Dialog
Modal dialog built on Radix UI Dialog primitives with HUD styling. Supports controlled and uncontrolled usage with compound sub-components.
Basic Dialog
Preview
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| open | boolean | - | Controlled open state of the dialog. |
| onOpenChange | (open: boolean) => void | - | Callback invoked when the open state changes. |
| className | string | - | Additional CSS classes for the dialog content. |
Accessibility
- Built on Radix UI Dialog which provides full WAI-ARIA dialog pattern support
- Focus is automatically trapped inside the dialog when open and restored on close
- Pressing
Escapecloses the dialog - Clicking the overlay backdrop closes the dialog
<DialogTitle>is linked viaaria-labelledbyand<DialogDescription>viaaria-describedby- The trigger element receives
aria-haspopup="dialog"andaria-expandedstate