Toggle
A two-state button that can be either on or off.
Usage
Variants
Sizes
Props
| Prop | Type | Default | Description |
|---|---|---|---|
modelValue | boolean | - | The controlled toggle state. Use with v-model. |
defaultValue | boolean | - | The default toggle state for uncontrolled usage. |
variant | 'default' | 'outline' | 'default' | The visual style variant. |
size | 'default' | 'sm' | 'lg' | 'default' | The size of the toggle. |
disabled | boolean | false | Whether the toggle is disabled. |
Events
| Event | Payload | Description |
|---|---|---|
update:modelValue | boolean | Emitted when the toggle state changes. |
Slots
| Slot | Props | Description |
|---|---|---|
default | { modelValue: boolean, state: 'on' | 'off', pressed: boolean, disabled: boolean } | Toggle content with access to the toggle state. |