1.6 KiB
1.6 KiB
Toggle
Toggle components are used to indicate boolean values which can be toggled on or off. They are a stylistic alternative to checkboxes, but still use the input[type=checkbox] under the hood.
Params
| Param | Type | Default | Description |
|---|---|---|---|
| onChange | function |
onChange is triggered on checkbox change (select, deselect). Must manually mutate checked value | |
| name | string |
name is passed along to the form field, as well as to generate the ID of the input & "for" value of the label | |
| [checked] | boolean |
false |
checked status of the input, and must be passed in and mutated from the parent |
| [disabled] | boolean |
false |
disabled makes the switch unclickable |
| [size] | string |
"'medium'" |
Sizing can be small or medium |
| [status] | string |
"'normal'" |
Status can be normal or success, which makes the switch have a blue background when checked=true |
Example
<Toggle @requiredParam={requiredParam} @optionalParam={optionalParam} @param1={{param1}}/>
See