Toggle
Toggles are a specialized type of checkbox that function as an on/off switch, typically for a single setting.
Props
| Prop | Type | Description |
|---|---|---|
| label | string | The text label displayed next to the toggle. |
| ...props | InputHTMLAttributes | Standard input attributes like `disabled`, `checked`, `onChange`, etc. |
Examples
Basic Toggle
A standard toggle with a descriptive label.
<Toggle label="Enable notifications" />Checked by Default
Use `defaultChecked` to render the toggle in the 'on' state initially.
<Toggle label="Airplane mode" defaultChecked />Disabled States
The `disabled` prop prevents user interaction for both 'on' and 'off' states.
<>
<Toggle label="Cannot enable" disabled />
<Toggle label="Already enabled" disabled defaultChecked />
</>