Notification Bell

An interactive notification trigger with animated badge counter, arrival shake feedback, and dropdown panel.

Installation

Add the component directly to your repository using shadcn CLI:

npx shadcn@latest add Surajmaurya1/easyui/notification-bell

API Reference

PropTypeDefaultDescription
notificationsNotification[]Array of notification objects (id, message, timestamp, read)
onMarkAsRead(id: string) => voidHandler fired when an individual notification is marked read
onMarkAllAsRead() => voidundefinedHandler to clear all active badges
isOpenbooleanundefinedControlled open state of notification drawer
onOpenChange(isOpen: boolean) => voidundefinedCallback on panel open/close
showCountbooleantrueDisplays numeric badge instead of minimal red dot