🐛 fix(switch.tsx): add aria-disabled attribute to the Switch component to improve accessibility
🎨 style(switch.tsx): update class names in the Switch component to improve readability and maintainability
This commit is contained in:
parent
562bbe99ee
commit
61e87a6d54
1 changed files with 3 additions and 2 deletions
|
|
@ -17,8 +17,9 @@ const Switch = React.forwardRef<
|
||||||
ref={ref}
|
ref={ref}
|
||||||
>
|
>
|
||||||
<SwitchPrimitives.Thumb
|
<SwitchPrimitives.Thumb
|
||||||
|
aria-disabled={props.disabled}
|
||||||
className={cn(
|
className={cn(
|
||||||
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
|
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 aria-disabled:bg-muted/70 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
</SwitchPrimitives.Root>
|
</SwitchPrimitives.Root>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue