コンポーネント
Checkbox
チェック済みと未チェックを切り替えられるコントロールです。
import { Checkbox, Label } from "@murasakijs/ui";export function CheckboxDemo() {return ( <div className="flex items-center gap-2"> <Checkbox id="terms" /> <Label htmlFor="terms">Accept terms and conditions</Label> </div>);}使い方
import { Checkbox } from "@murasakijs/ui";<Checkbox id="terms" />API リファレンス
Props
| Prop | 型 | デフォルト |
|---|---|---|
checked | boolean | "indeterminate" | — |
defaultChecked | boolean | "indeterminate" | — |
onCheckedChange | (checked: boolean | "indeterminate") => void | — |
disabled | boolean | false |
required | boolean | false |
name | string | — |
value | string | "on" |
Checkbox は Radix UI の Checkbox.Root
をレンダリングし、それ以外の props はすべて内部にそのまま渡されます。