Undo Toast
An advanced undo notification toast featuring an interactive progress countdown, pause-on-hover mechanics, action reversal animation, and versatile position anchoring.
Project archived
5 seconds remaining to restore project
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/undo-toast
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| open | boolean | true | Visibility state of the undo toast |
| title | string | 'Project archived' | Primary notification message title |
| description | string | 'Changes will be permanent in a few seconds' | Optional descriptive subtitle |
| undoLabel | string | 'Undo' | Label for undo action trigger |
| restoredMessage | string | 'Restored successfully' | Title displayed when action has been reversed |
| duration | number | 5000 | Duration in milliseconds before auto-dismissal |
| variant | 'default' | 'success' | 'warning' | 'error' | 'info' | 'default' | Semantic visual tone |
| position | 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'bottom-center' | Screen placement |
| onUndo | () => void | undefined | Callback fired when user clicks Undo |
| onDismiss | () => void | undefined | Callback fired when toast closes or expires |
| showProgress | boolean | true | Whether to show the countdown bar |