Overlays

ConfirmDialog

The dialog confirm() opens: a title, an optional message and detail line, and a Cancel and a confirm button. It answers with a boolean, so the code that asked reads like a question.

Asking with confirm()

Call confirm() with a title, a message and the labels the buttons should carry, and await the answer. It resolves true when the reader confirms and false when they cancel, press Escape or click outside the dialog, so it never throws on a cancel. It needs <DialogContainer /> mounted once in your layout, as the Dialog page sets up.

What the reader sees

The title states the question and the message what follows from it. An identifier the message refers to, such as the id of the record about to go, goes in detail: it sits on its own line in monospace, so a long id never wraps inside the sentence.

Name the action on the confirm button. A button reading Delete draft says what happens, and the default Confirm only says that something does. Cancel takes the first focus, so an Enter pressed before the reader has read the dialog does nothing.

Options

Rendering it yourself

DialogContainer renders ConfirmDialog for every confirm() call, so most pages never render it directly. A dialog stack of your own passes the entry it is drawing, and can pass onConfirm to run work before the dialog closes: the confirm button shows a spinner while it runs, and returning false or throwing keeps the dialog open.

API