Switch
A control that allows the user to toggle between checked and not checked.
Installation
npm i @huin-core/react-switchAPI Reference
Switch
| Prop | Type | Description |
|---|---|---|
| asChild | boolean | When set to true, renders the component as its child element, inheriting the child's styles and behavior. |
| defaultChecked | boolean | The state of the switch when it is initially rendered. Use when you do not need to control its state. |
| checked | boolean | Represents the current state of the component, indicating whether it is enabled or selected. |
| onCheckedChange | function | Event handler called when the checked state changes. |
| disabled | boolean | When set to true, disables the component, preventing user interaction or triggering of associated actions. |
| name | string | The name of the piece. |
| required | boolean | When true, indicates that the user must check the switch before the owning form can be submitted. |
| value | string | Represents the current value or state of the component, which can be used to bind or track its data over time. |
SwitchThumb
| Prop | Type | Description |
|---|---|---|
| asChild | boolean | When set to true, renders the component as its child element, inheriting the child's styles and behavior. |
Keyboard Interactions
| Key | Description |
|---|---|
Space Enter | Turns the switch on or off. |