Skip to content

Commit a1c6d82

Browse files
committed
fix: migrate checkbox to base-ui
1 parent 0585d83 commit a1c6d82

File tree

1 file changed

+8
-16
lines changed

1 file changed

+8
-16
lines changed
Lines changed: 8 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,13 @@
1-
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
1+
import { Checkbox as CheckboxPrimitive } from "@base-ui-components/react/checkbox";
22
import { CheckIcon } from "lucide-react";
3-
import { forwardRef, useId } from "react";
43
import { cn } from "../../lib/utils.js";
54

6-
const Checkbox = forwardRef<
7-
React.ComponentRef<typeof CheckboxPrimitive.Root>,
8-
React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>
9-
>(({ className, id, children, ...props }, ref) => {
10-
const autoId = useId();
11-
id = id || autoId;
5+
export type CheckboxProps = CheckboxPrimitive.Root.Props;
126

7+
const Checkbox = ({ className, children, ...props }: CheckboxProps) => {
138
return (
14-
<div className="flex items-center text-gray-dark">
9+
// biome-ignore lint/a11y/noLabelWithoutControl: The CheckboxPrimitive.Root is the control
10+
<label className="flex items-center text-gray-dark">
1511
<CheckboxPrimitive.Root
1612
className={cn(
1713
`
@@ -28,19 +24,15 @@ const Checkbox = forwardRef<
2824
`,
2925
className,
3026
)}
31-
id={id}
3227
{...props}
3328
>
3429
<CheckboxPrimitive.Indicator>
3530
<CheckIcon className="size-5" />
3631
</CheckboxPrimitive.Indicator>
3732
</CheckboxPrimitive.Root>
38-
<label className="pl-2 text-sm leading-none" htmlFor={id}>
39-
{children}
40-
</label>
41-
</div>
33+
<span className="pl-2 text-sm leading-none">{children}</span>
34+
</label>
4235
);
43-
});
44-
Checkbox.displayName = CheckboxPrimitive.Root.displayName;
36+
};
4537

4638
export { Checkbox };

0 commit comments

Comments
 (0)