Merge pull request #319 from softnetics/supakorn/fix/components

fix: separator overriding.

Author: SupakornNetsuwan

.changeset/bold-webs-read.md

@@ -0,0 +1,6 @@
+---
+'@example/ui-playground': patch
+'@genseki/ui': patch
+---
+
+fix: separator class overriding.

examples/ui-playground/src/app/playground/shadcn/separator-section.tsx

@@ -14,7 +14,10 @@ function BasicSeparatorExamples() {
       </div>
       <div className="flex h-24 items-center gap-4">
         <span className="text-sm text-muted-foreground">Top</span>
-        <Separator orientation="vertical" className="h-full" />
+        <Separator
+          orientation="vertical"
+          className="bg-blue-500  data-[orientation=vertical]:w-4"
+        />
         <span className="text-sm text-muted-foreground">Bottom</span>
       </div>
       <div className="flex items-center gap-4">

packages/ui/src/components/primitives/separator.tsx

@@ -4,6 +4,8 @@ import React from 'react'
 import * as SeparatorPrimitive from '@radix-ui/react-separator'
 import { cva, type VariantProps } from 'class-variance-authority'
 
+import { cn } from '../../utils/cn'
+
 /**
  * Shadcn component
  */
@@ -39,7 +41,7 @@ function Separator({
       data-slot="separator"
       decorative={decorative}
       orientation={orientation}
-      className={separator({ variant, className })}
+      className={cn(separator({ variant }), className)}
       {...props}
     />
   )