Settings

Danger zone

The destructive action panel, with an optional type-to-confirm gate before it will fire.

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.

Danger zone

Rendered live from Storybook

Open

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/settings/DangerZone.tsx
Portability: Copies across unchanged — only the utils import path moves.
Variants: spacing: sm | mdrequireConfirmation on/off
States to cover: plain actionconfirmation dialogphrase not yet matchedphrase matched
Notes: The type-to-confirm gate is now a component rather than a pattern repeated per screen — see the Patterns shortlist.