Sidera/Components/Switch
Switch
A switch toggles a single setting that takes effect immediately — no save button required. Use it for on/off, not for form submission.
CategoryForms
StatusStable
01 —Overview
Reach for a switch when flipping it changes state right away. If the choice only matters on submit, use a checkbox instead.
02 —Disabled
03 —Properties
PropTypeDefault
checkedboolean—
defaultCheckedbooleanfalse
onCheckedChange(checked) => void—
disabledbooleanfalse
labelReactNode—
04 —Accessibility
- Built on Base UI — Space/Enter toggles; exposed as a switch with checked state.
- Label is associated with the control and part of the hit target.
- Motion honours reduced-motion; visible 3px focus ring.