Sakani

Switch

An immediate on/off toggle. Use it for settings that apply the moment they change.

Switch or checkbox?

A switch takes effect immediately; a Checkbox stages a change that a submit button commits. If your switch needs a Save button next to it, it should have been a checkbox.

States

Without a label

Inside a settings row that already has its own text, drop the label and pass an aria-label so the control is still named for screen readers.

Notifications

Controlled

Backing up nightly

Props

Every other native input attribute is forwarded to the underlying <input type="checkbox">.

PropTypeDefaultDescription
labelstringOptional text rendered to the right of the switch.
checkedbooleanControlled on/off state.
defaultCheckedbooleanUncontrolled initial state.
disabledbooleanfalseDisables the input.
onChange(e: ChangeEvent<HTMLInputElement>) => voidFires on toggle.