AlertDialog
A modal that asks for a confirmation and ignores clicks outside; fires confirm or cancel.
Group: Overlays · Kind: macro
Preview
Section titled “Preview”open
Platforms
Section titled “Platforms”The same specimen painted by React, SwiftUI, Compose and gpui.




| Prop | Type | Required | Bindable | Description |
|---|---|---|---|---|
title |
string |
yes | – | The question. |
description |
string |
– | – | What will happen. |
confirmLabel |
string |
– | – | The confirming button’s text. Default "$string.confirm". |
cancelLabel |
string |
– | – | The cancelling button’s text. Default "$string.cancel". |
destructive |
boolean |
– | – | Styles the confirming button as dangerous. Default false. |
open |
boolean |
– | yes | Whether it shows; bind it. Default false. |
Events
Section titled “Events”on.confirm: runs an actionon.cancel: runs an actionon.change: runs an action
trigger: one component by id
Children
Section titled “Children”many
A2UI basic mapping
Section titled “A2UI basic mapping”No basic catalog component maps here.
Built from
Section titled “Built from”Accessibility
Section titled “Accessibility”Role: alertdialog
alertdialog. The cancel button takes focus on open (autoFocus, $a11y).
| Keys | Action |
|---|---|
| – | Opening focuses the cancel button |
Escape |
cancel; clicks outside are ignored |
Theming
Section titled “Theming”Recipe parts: AlertDialog/root AlertDialog/footer AlertDialog/cancel AlertDialog/confirm
Keyed by: destructive :hover :pressed :focus :disabled :checked :open :selected :invalid :dragover
Related
Section titled “Related”Button · Dialog · Drawer · DockCard · Popover · Tooltip · Menu · Toast