Dialog
Modal confirmation (Radix). Focus-trapped, Escape-to-close, elevation/3.
Example
Section titled “Example”| Prop | Type | Default | Description |
|---|---|---|---|
trigger | ReactNode | required | |
title | string | required | |
description | string | — | |
children | ReactNode | — | |
footer | ReactNode | — | |
open | boolean | — | |
onOpenChange | (open: boolean) => void | — |
States
Section titled “States”- closed
- open
Do / Don’t
Section titled “Do / Don’t”Do
Use for irreversible confirmations; make the affirmative button
Use for irreversible confirmations; make the affirmative button
primary.Don’t
Don’t stack dialogs or use them for non-blocking info — use Alert.
Don’t stack dialogs or use them for non-blocking info — use Alert.
Modes & RTL
Section titled “Modes & RTL”Colors come only from Semantic tokens, so this component re-themes automatically across Day / Night-NVG / Mono with no variant swap. It uses CSS logical properties, so it mirrors correctly in RTL.