AlertDialog
The AlertDialog component is a confirmation dialog for destructive or irreversible actions. It blocks ESC and overlay-click dismissal, forcing an explicit user choice before proceeding.
tsx
Destructive Confirmation
The default pattern — blocks ESC and overlay-click, focuses Cancel.
With Icon
Use AlertDialogIcon to add a semantic icon badge above the title.
Non-destructive Confirmation
Use variant="primary" on AlertDialogAction for non-destructive but irreversible actions.
Controlled
Use open and onOpenChange for programmatic control.