Alerts & Notifications components
8 Alerts & Notifications components for React, shadcn, Vue 3, Laravel Blade and HTML + Alpine.js: Alert, AlertList, AppUpdate, Attention, DesktopNotification, NotificationCenter, NotificationItem, Toaster.
- AlertQuiet inline notice with a tone (info, success, warning, danger), optional title, description, action and dismiss.
- AlertListAlert triage lists, AlertList and SecurityAlerts, with status tabs and counts, search, severity and source filters, sorting, acknowledge, resolve and reopen, and an expandable timeline per alert.
- AppUpdateAn update pill with download progress, an update sheet with release notes and speed, a forced-update gate for unsupported builds, and an admin release manager with the minimum supported build.
- AttentionA short, domain-independent list of things the user should act on now (unread conversations, failed deployments, approvals, setup steps), ordered by urgency.
- DesktopNotificationNotification cards drawn like macOS and Windows system alerts for Electron apps and previews, a corner stack with auto dismiss, and the notification permission flow with a soft ask, waiting, granted and blocked steps.
- NotificationCenterBell button with an unread badge that opens notifications in a popover or a full-height side panel, with All and Unread tabs, mark all read, a header slot and an empty state. Controlled.
- NotificationItemOne row of a notifications list, a full-width button with an actor avatar or icon, title, description, time and an unread marker.
- ToasterTransient notifications. A themed, RTL-aware Sonner Toaster plus the re-exported toast() function.