Checkbox

import { Checkbox } from "@/components/ui";

1<Checkbox
2  label="Email notifications"
3  description="Receive email updates about your account activity"
4/>

1const [checked, setChecked] = useState(false);
2
3return (
4  <Checkbox
5    label="Subscribe to newsletter"
6    checked={checked}
7    onChange={(e) => setChecked(e.target.checked)}
8  />
9);

1<div className="space-y-2">
2  <Checkbox
3    label="Select all"
4    indeterminate={someSelected && !allSelected}
5    checked={allSelected}
6    onChange={handleSelectAll}
7  />
8  <div className="ml-6 space-y-1">
9    <Checkbox label="Option 1" checked={selected.option1} />
10    <Checkbox label="Option 2" checked={selected.option2} />
11    <Checkbox label="Option 3" checked={selected.option3} />
12  </div>
13</div>

1<div className="space-y-2">
2  <Checkbox label="Unchecked disabled" disabled />
3  <Checkbox label="Checked disabled" checked disabled />
4</div>