Dialog

Dialogs interrupt the user's workflow to request input or confirmation. They create a focused context by dimming the background and trapping focus inside the modal. Use them sparingly — every dialog is a speed bump in the user's flow.

Variants

DefaultConfirmation dialog
DestructiveDangerous action confirmation
FormDialog with form inputs

Usage Guidelines

Do

Use dialogs for actions that need explicit confirmation or require focused input.

Don't

Don't use dialogs for simple notifications. Use Toast or Alert instead.

Do

Always provide a clear way to dismiss — both a close button and the Escape key.

Don't

Don't stack dialogs on top of each other. If you need more context, redesign the flow.

Source Code