Switch
Usage
A setting that takes effect the moment it is flipped. That immediacy is the whole distinction from Checkbox: a checkbox states an intention that a submit button later acts on, a switch *is* the action. If your switch needs a Save button next to it, it should have been a checkbox.import { Switch } from '@summonware/ui';Best practices
DoApply the change immediately, and show a toast if the result is not visible on screen.
DoUse `description` for the consequence — "Get notified when a ticket is assigned" explains what the switch actually does.
Don'tPut switches in a form that is submitted. Use checkboxes there.
Don'tLabel a switch with a verb like "Enable notifications". The label names the setting; the position says whether it is on.
Examples
Common configurations, variations and states.Settings list
The usual home for switches — a settings panel where each row applies on toggle.
Disabled
A switch locked by permissions or plan. Keep it visible with an explanation rather than hiding the capability.
Reference variants
3 of 13 labels from the reference are demonstrated above.Basic SwitchesSwitches with LabelsEvent HandlingSwitch [ v1 ]Inline SwitchSwitch in Horizontal FormSizingColored SwitchesSwitch SizesDark Theme SwitchesSwitches in FormsReverse LayoutInline Switches