Notification center

@summonware/ui · notification · P1 · Advanced UI

Usage

A persistent, glanceable list behind a bell icon — distinct from `Toast` (a transient message pushed at the user mid-task). This is for system messages a user checks on their own schedule: "did anything happen while I was away," not "your save just succeeded."
import { NotificationCenter } from '@summonware/ui';

Best practices

DoReserve the unread dot/count for things that need acknowledgement, not everything the system logs. A badge that is always non-zero stops meaning anything.
Don'tUse this for a single immediate confirmation ("Saved") — that is what `Toast` is for. Routing a save confirmation through here delays when the user actually sees it.

Examples

Common configurations, variations and states.

Bell with unread items

Click the bell to open the list. "Mark all read" clears the unread dot.

Reference variants

0 of 4 labels from the reference are demonstrated above.
Notification AlertNotification with IconsAuto Close NotificationsUsing the notification.hide() method