Switch
A control that allows the user to toggle a setting on or off. Optimized for accessibility with ARIA switch role.
The Switch component is a visual alternative to a checkbox when used for binary "on/off" settings.
Accessibility Features
- Role Switch: Uses
role="switch"so screen readers announce it as a toggle switch rather than a checkbox. - State Announcement: Clear
aria-checkedstate updates.
Usage Example
import { Switch } from '@holmdigital/components'; <div className="flex items-center space-x-2"> <Switch id="airplane-mode" /> <label htmlFor="airplane-mode">Airplane Mode</label> </div>