Switch
The Switch component implements an <input type="checkbox"/> replacement. It differs from Checkbox in that it only supports on and off states, and not an “indeterminate” state.
Examples
This is just an example Switch component, designed in the Plain Kit project. You have total freedom to design Plume components exactly as you'd want them to be, with your own unique variants and behaviors.
Switch to a different kit:
Plain Kit
Basic Switch with label
Switch Props
| Prop | Type | Description |
|---|---|---|
children | React.ReactNode | Label for the Switch |
isSelected | boolean | Whether the Switch is toggled on (controlled) |
defaultSelected | boolean | Whether the Switch is toggled on by default (uncontrolled) |
isDisabled | boolean | Whether the Switch is disabled |
isReadOnly | boolean | Whether the Switch is read-only |
ref | PlumeSwitchRef | Programmatic access to Switch |
PlumeSwitchRef
| Method | Description |
|---|---|
focus() | Focuses this Switch |
UNSAFE_getDOMNode() | Returns the root label DOM element |
Build your own!
Build your own Switch, designed in Plasmic, with the useSwitch hook!