Simple binary switch control
Standard switch control for binary options.
1import '@tempoplatform/tpds/components/switch'
2
3const [active, setActive] = React.useState(true)
4
5<Switch
6 active={active}
7 onClick={() => setActive(!active)}
8/>Disabled (active)
Disabled (inactive)
Success variant (active)
Prop Name
Type
Default
Required
Description
active
Boolean
false
required
The state of the switch.
onClick
Function
null
required
The click handler controlling the state of the switch.
variant
String
info
optional
The style of the switch. Can be "info", "success", "warning" or "danger", resulting in respectively blue, green, orange or red background color.
disabled
SVG JSX
null
optional
Optional icon to show after the label
iconColor
HEX String
null
optional
If iconBefore or iconAfter is passed, this color will be applied to it's fill.