Toggle

Two-state pressed button.

Installation

npx @noarka/cli add toggle

tsx

import { Toggle } from "@noarka/ui";

tsx

<Toggle aria-label="Airplane mode">Off</Toggle>

Variants

Default and outline styles.

Sizes

Small, default, and large.

Disabled

Disabled toggles ignore interaction.

Toggle

Prop	Type	Default
`variant` Visual style.	`"default" \| "outline"`	`"default"`
`size` Size.	`"default" \| "sm" \| "lg"`	`"default"`
`pressed` Controlled pressed state. Use with onPressedChange.	`boolean`	`-`
`defaultPressed` Initially pressed when uncontrolled.	`boolean`	`false`
`onPressedChange` Called when the pressed state changes.	`(pressed: boolean) => void`	`-`
`disabled` Disable interaction. Renders at half opacity.	`boolean`	`false`
`render` Polymorphic render prop.	`ReactElement \| ((props) => ReactNode)`	`-`
`nativeButton` Set explicitly to override the automatic inference. Inferred from the render element unless told otherwise.	`boolean`	`-`
`className` Additional classes merged with the variant styles.	`string`	`-`