Forms

Switch

Turn a setting on or off, applied immediately rather than on save.

Importimport { Switch } from "@/components/ui/Switch";
Sourcesrc/components/ui/Switch

A Switch takes effect immediately. If the surface has a Save button, the control belongs to that form and should be a Checkbox instead — a switch that does not apply until later is a broken promise.

States

Controlled only. Give it an aria-label, or a Label paired by id — the track has no text of its own.

Props

Switch

PropTypeDefaultDescription
checkedbooleanRequired. The controlled state.
onCheckedChange(checked: boolean) => voidCalled with the next state.