Skip to content

Alert Dialog

A modal dialog that interrupts the user with important content and expects a response. Built on Radix UI for full accessibility.

$cookest-ui add alert-dialog

Basic

A standard confirmation dialog with a destructive action.

Sign Out Confirmation

Use Alert Dialog for session-ending actions.

PropTypeDefaultDescription
AlertDialogTriggerReactNodeElement that opens the dialog. Use asChild to merge props.
AlertDialogTitlestringThe dialog heading — required for accessibility.
AlertDialogDescriptionstringSupporting text describing the consequence of the action.
AlertDialogActionReactNodeThe confirming (often destructive) action button.
AlertDialogCancelReactNodeDismisses the dialog without taking action.