Confirm Morph

Usage

Use ConfirmMorph to confirm a destructive or consequential action without a modal, when the person is already looking at the thing they are acting on: delete a record, remove a unit, archive an incident. One pill changes face: the trigger, then the prompt with Cancel and Confirm, then a pending face, then done (with Undo, if you offer it) or error (with Retry).

Return the promise from onConfirm. A resolved promise shows the done face; a rejected one shows the error face and calls onConfirmError.
Pass undoLabel and onUndo together to offer Undo. Undo returns to idle at once and calls onUndo.
The prompt cancels itself after about six seconds, and the done and error faces return to idle after about five. The countdown waits while the pointer is over the control or the tab is hidden.
Escape, Cancel, and a press outside the control cancel the prompt.
fullSpan fills the host's inline size in every phase, and the face on show is centered. Block size stays at the control token in row, column, and grid hosts; the pill does not spring because its width comes from the host.
tone={ConfirmMorphTone.Destructive} uses the destructive status tokens for the trigger, Confirm, and the pill's edge. Use it for actions that cannot be reversed.

When not to use it

The action must block the page, needs more than a yes or no, or the person may not be looking at the control: use AlertDialog.
The action is safe and instant: use Button.

Combobox / Accessibility

Confirm Morph / API and Development

On this page

When not to use it

Confirm Morph

Usage

Return the promise from onConfirm. A resolved promise shows the done face; a rejected one shows the error face and calls onConfirmError.
Pass undoLabel and onUndo together to offer Undo. Undo returns to idle at once and calls onUndo.
The prompt cancels itself after about six seconds, and the done and error faces return to idle after about five. The countdown waits while the pointer is over the control or the tab is hidden.
Escape, Cancel, and a press outside the control cancel the prompt.
fullSpan fills the host's inline size in every phase, and the face on show is centered. Block size stays at the control token in row, column, and grid hosts; the pill does not spring because its width comes from the host.
tone={ConfirmMorphTone.Destructive} uses the destructive status tokens for the trigger, Confirm, and the pill's edge. Use it for actions that cannot be reversed.

When not to use it

The action must block the page, needs more than a yes or no, or the person may not be looking at the control: use AlertDialog.
The action is safe and instant: use Button.

Combobox / Accessibility

Confirm Morph / API and Development

On this page

When not to use it