refactor: update naming in label variants constant

pixel-point · Dec 3, 2024 · 82ff2c2 · 82ff2c2
1 parent 834b9e6
commit 82ff2c2
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 11 deletions.
diff --git a/packages/ui/src/components/checkbox.tsx b/packages/ui/src/components/checkbox.tsx
@@ -23,7 +23,7 @@ const Checkbox = forwardRef<ElementRef<typeof CheckboxPrimitive.Root>, CheckboxP
         </CheckboxPrimitive.Indicator>
       </CheckboxPrimitive.Root>
       {label && (
-        <Label className="leading-tight" theme="foreground-1" htmlFor={props.id}>
+        <Label className="leading-tight" color="foreground-1" htmlFor={props.id}>
           {label}
         </Label>
       )}

diff --git a/packages/ui/src/components/input.tsx b/packages/ui/src/components/input.tsx
@@ -61,7 +61,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>(
     return (
       <ControlGroup>
         {label && (
-          <Label className="mb-2.5" theme={disabled ? 'foreground-9' : 'foreground-2'} optional={optional} htmlFor={id}>
+          <Label className="mb-2.5" color={disabled ? 'foreground-9' : 'foreground-2'} optional={optional} htmlFor={id}>
             {label}
           </Label>
         )}

diff --git a/packages/ui/src/components/label.tsx b/packages/ui/src/components/label.tsx
@@ -11,7 +11,7 @@ const labelVariants = cva('peer-disabled:cursor-not-allowed peer-disabled:opacit
     variant: {
       default: 'text-sm font-normal leading-none'
     },
-    theme: {
+    color: {
       'foreground-1': 'text-foreground-1',
       'foreground-2': 'text-foreground-2',
       'foreground-5': 'text-foreground-5',
@@ -20,15 +20,15 @@ const labelVariants = cva('peer-disabled:cursor-not-allowed peer-disabled:opacit
   },
   defaultVariants: {
     variant: 'default',
-    theme: 'foreground-1'
+    color: 'foreground-1'
   }
 })
 
 const LabelRoot = forwardRef<
   ElementRef<typeof LabelPrimitive.Root>,
-  ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
->(({ className, variant, theme, ...props }, ref) => (
-  <LabelPrimitive.Root ref={ref} className={cn(labelVariants({ variant, theme }), className)} {...props} />
+  Omit<ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, 'color'> & VariantProps<typeof labelVariants>
+>(({ className, variant, color, ...props }, ref) => (
+  <LabelPrimitive.Root ref={ref} className={cn(labelVariants({ variant, color }), className)} {...props} />
 ))
 LabelRoot.displayName = LabelPrimitive.Root.displayName
 
@@ -38,9 +38,9 @@ interface LabelProps extends VariantProps<typeof labelVariants>, PropsWithChildr
   className?: string
 }
 
-const Label = ({ htmlFor, optional, theme, variant, children, className }: LabelProps) => {
+const Label = ({ htmlFor, optional, color, variant, children, className }: LabelProps) => {
   return (
-    <LabelRoot htmlFor={htmlFor} variant={variant} theme={theme} className={className}>
+    <LabelRoot htmlFor={htmlFor} variant={variant} color={color} className={className}>
       {children} {optional && <span className="text-foreground-7 align-top">(optional)</span>}
     </LabelRoot>
   )

diff --git a/packages/ui/src/components/select.tsx b/packages/ui/src/components/select.tsx
@@ -35,7 +35,7 @@ const Select: FC<SelectProps> = ({
 }) => (
   <SelectPrimitive.Root {...props}>
     {label && (
-      <Label className="mb-2.5" theme={disabled ? 'foreground-9' : 'foreground-2'} htmlFor={name}>
+      <Label className="mb-2.5" color={disabled ? 'foreground-9' : 'foreground-2'} htmlFor={name}>
         {label}
       </Label>
     )}

diff --git a/packages/ui/src/components/textarea.tsx b/packages/ui/src/components/textarea.tsx
@@ -23,7 +23,7 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
     return (
       <ControlGroup>
         {label && (
-          <Label className="mb-2.5" theme={disabled ? 'foreground-9' : 'foreground-2'} optional={optional} htmlFor={id}>
+          <Label className="mb-2.5" color={disabled ? 'foreground-9' : 'foreground-2'} optional={optional} htmlFor={id}>
             {label}
           </Label>
         )}