Skip to content
Lantern

Actions

Toggle

A two-state button. Pressed state is visual only — it does not submit.
Available
Ports as-is

Examples

This component's Storybook stories, embedded. They are the maintained source for its states, so Lantern shows them rather than keeping a duplicate set.

Toggle

Rendered live from Storybook

Storybook must be running for this to load — npm run storybook from the repo root, or set NEXT_PUBLIC_STORYBOOK_URL to a deployed instance.

Reference

Transcribed from the component audit. If this disagrees with the source, the source is right.

Source
src/components/ui/toggle.tsx
Portability
Copies across unchanged — only the utils import path moves.
Variants
defaultoutlinesm / default / lg
States to cover
offonhoverdisabledfocus ringicon-only
Dependencies
@radix-ui/react-toggle
Props the port adds
pressed / onPressedChange
Notes
Port alongside ToggleGroup — they share toggleVariants.