Destructive actions (delete, discard, remove) happen constantly in games and apps. If the UI treats them as “instant and final,” people make mistakes — especially on controller/keyboard, with motor tremor, or when a list reflows.
Goal: let someone recover from a mistake without opening a modal or stealing focus.
Why “visual-only” delete toasts fail
- Screen reader users may not hear it if it’s not in a live region.
- Keyboard users may miss it if focus stays on the delete button and the toast appears elsewhere.
- “Deleted” is not recovery: if there’s no Undo, the toast is just a post-mortem.
Minimum viable Undo toast (checklist)
- Include a real button (not a click-only span) labeled “Undo”.
- Keep focus stable. Don’t move focus into the toast automatically.
- Announce the event in a live region: what happened + that Undo is available.
- Give a time window (e.g., 5–10 seconds). If it expires, say so.
- Support keyboard: the Undo button must be tabbable; optional shortcut like
Ctrl+Z.
If the action is truly irreversible (e.g., “Delete account”), use a confirmation dialog instead. Undo toasts are best for “oops” mistakes like removing an item from a list.
Accessibility notes
- Prefer
role="status"/aria-live="polite"so you don’t interrupt speech. - Don’t spam announcements: if a user deletes many items rapidly, batch or rate-limit messages.
- Don’t rely on color (“green toast = safe”). Use explicit text (“Restored Slot B”).