1import { Checkbox } from "./Checkbox.tsx";
2
3export const Basic = () => (
4 <div style="display: flex; flex-direction: column; gap: 8px;">
5 <Checkbox>Default Checkbox</Checkbox>
6 <Checkbox checked>Checked Checkbox</Checkbox>
7 <Checkbox disabled>Disabled Checkbox</Checkbox>
8 <Checkbox checked disabled>Checked Disabled</Checkbox>
9 </div>
10);
11
12export const WithDataSync = () => (
13 <div style="display: flex; flex-direction: column; gap: 8px;">
14 <Checkbox data-sync="enabled">Enabled</Checkbox>
15 <Checkbox data-sync="visible" checked>Visible</Checkbox>
16 <Checkbox data-sync="locked">Locked</Checkbox>
17 </div>
18);
19
20export const meta = {
21 title: "Forms/Checkbox",
22 description: "Checkbox component for binary choices",
23 component: Checkbox,
24};
25