Switch

Toggle component with a thumb element. Accessible — renders as a <button role="switch"> with aria-checked.

Preview


import { Switch } from '@wire-ui/react'
 
<Switch.Root checked={on} onCheckedChange={setOn}>
  <Switch.Thumb />
</Switch.Root>

Prop	Type	Default	Description
`checked`	`boolean`	—	Controlled checked state
`defaultChecked`	`boolean`	`false`	Initial state for uncontrolled use
`onCheckedChange`	`(checked: boolean) => void`	—	Called when toggled
`disabled`	`boolean`	`false`	Disables the switch

Attribute	Element	Values
`data-state`	Root, Thumb	`"checked"` / `"unchecked"`
`data-disabled`	Root	Present when disabled