Shadcn.io is not affiliated with official shadcn/ui
Toast with Action and Cancel
A Sonner toast with both action and cancel buttons for confirmations requiring explicit yes/no choices directly in the notification
Here's the thing—sometimes notifications need a real answer, not just dismissal. This React toast with action and cancel buttons forces a choice. Built with Sonner and shadcn/ui, combining action and cancel props creates inline decision dialogs—perfect for destructive confirmations, important choices, file operations, permission requests, or any notification where proceeding and canceling are equally valid options and you need users to explicitly pick one.
Toast with Action and Cancel preview
Installation
Related Components
Toast with Action Button
Toast with single action button
Toast with Cancel Button
Toast with cancel button only
Non-Dismissible Toast
Toast requiring interaction to close
Confirmation Dialog
Modal dialog for important confirmations
Alert Dialog
Blocking alert for critical decisions
Error Toast
Error notification toast
FAQ
Was this page helpful?
Sign in to leave feedback.
Toast with Cancel Button
A Sonner toast notification with a cancel button for confirmations and dismissible warnings that need explicit user acknowledgment
Non-Dismissible Toast
A Sonner toast that cannot be dismissed by clicking the X button, requiring users to wait for auto-dismiss or interact with action buttons