Checkbox
Binary input. Supports checked, unchecked, and indeterminate states via modelValue.
Default
Single checkbox bound with v-model.
With label
Wire to a Label for accessible click targets.
Disabled
The disabled state grays the box and blocks input.
Indeterminate
Set modelValue to 'indeterminate' for tri-state pickers.
API Reference
Props, events, and slots for each sub-component.
Checkbox
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| modelValue | boolean | 'indeterminate' | — | Checked state. Supports v-model. |
| defaultValue | boolean | 'indeterminate' | false | Initial state when v-model is not used. |
| disabled | boolean | false | Disable input. |
| id | string | — | Match with Label for prop. |
Events
| Event | Description |
|---|---|
| update:modelValue | Fires with the new checked state. Enables v-model. |
Accessibility
Keyboard shortcuts and ARIA behavior.
Keyboard
| Shortcut | Description |
|---|---|
| Space | Toggles the checkbox when focused. |
| Tab | Moves focus to or from the checkbox. |
- Uses role=checkbox with aria-checked reflecting the state.
- Supports an indeterminate (mixed) state via aria-checked="mixed".
- Pair with a label so the control's purpose is announced.