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