Toggle
A two-state button that can be either on or off.
Features
- Full keyboard navigation.
- Can be controlled or uncontrolled.
Installation
Install the component from your command line.
sh
$ npm add reka-uiAnatomy
Import the component.
vue
<script setup>
import { Toggle } from 'reka-ui'
</script>
<template>
<Toggle />
</template>API Reference
Root
The toggle.
| Data Attribute | Value |
|---|---|
[data-state] | "on" | "off" |
[data-disabled] | Present when disabled |
Accessibility
Keyboard Interactions
| Key | Description |
|---|---|
Space | Activates/deactivates the toggle. |
Enter | Activates/deactivates the toggle. |