Installation
pnpm add @viliha/vui-uiThen import from @viliha/vui-ui/switch.
Usage
switch-demo.tsx
import { Switch } from "@viliha/vui-ui/switch";
import { Label } from "@viliha/vui-ui/label";
export function Example() {
const [on, setOn] = React.useState(false);
return (
<div className="flex items-center gap-2">
<Switch id="airplane" checked={on} onCheckedChange={setOn} />
<Label htmlFor="airplane">Airplane mode</Label>
</div>
);
}API Reference
Built on the Radix Switch primitive, plus a VUI size option.
| Prop | Type | Default |
|---|---|---|
| size | "sm" | "default" | "default" |
| checked | boolean | — |
| defaultChecked | boolean | — |
| onCheckedChange | (checked: boolean) => void | — |
| disabled | boolean | false |