Switch
A binary setting control for immediate on/off preferences.
Controls
import { Switch } from "raft-ui";
<Switch aria-label="Setting" />API#WIP
| Prop | Type | Default | Description |
|---|---|---|---|
size | "sm" | "md" | "sm" | Visual size of the switch. Use sm in dense menus and md in form rows. |
checked | boolean | — | Controlled checked state. Pair with onCheckedChange. |
defaultChecked | boolean | false | Initial checked state for uncontrolled usage. |
onCheckedChange | (checked: boolean, details) => void | — | Called when the switch is toggled. |
disabled | boolean | false | Disables the switch. |
readOnly | boolean | false | Keeps the switch focusable but prevents toggling. |
required | boolean | false | Marks the hidden native input required for form validation. |
...props | Base UI Switch.Root.Props | — | Form props (name, value, uncheckedValue, form) plus Base UI render props. |
| Prop | Type | Default | Description |
|---|---|---|---|
...props | Base UI Switch.Thumb.Props | — | Optional thumb slot for custom visuals. Switch renders it by default. |