hightouch UI

Confirmation Dialog

Confirmation dialogs are used to confirm a dangerous or destructive action that's about to be performed by the user.

#

#

#

#

#

#

  • When there's a dangerous or destructive action to perform on behalf of the user.

#

  • When there's neutral or non-dangerous information or actions to perform on behalf of the user, use a generic dialog instead.

#

  • Confirmation dialog must never appear on its own without user's interaction (like clicking a button).

#

  • Warn user about the consequences of the action they're about to perform.
  • Use sentence case everywhere.
  • Don't punctuate the end of the title.
  • Always end a sentence with a period in description.
  • Don't ask "Are you sure?". Instead, explain the consequences of this action.
  • Confirm button text must be explicit and avoid generic words like "Confirm", "Submit", "Yes", "Delete". For example, a good button text would be "Delete source".

#

#

NameDefaultDescription

On this page

  • Usage
  • Danger
  • Warning
  • Inside of a drawer inside of a menu
  • Guidelines
  • When to use
  • When not to use
  • Usage
  • Content
  • Props
  • ConfirmationDialog