EasecraftImplemented

Composition / Feedback

Notification Center

Manage persistent unread history alongside queued, pausable live notifications.

Notification center

02 unread
  • Preview ready

    Composition docs are available locally.

    Now
  • Accessibility verified

    Keyboard checks passed.

    4m
  • Production build complete1h

    Delivery contract

    Install it

    pnpm add easecraft@0.1.0

    The composition imports stable APIs from easecraft.

    Files / 02

    1. utilitycomponents/easecraft/compositions/notification-center-core.tsx
    2. compositioncomponents/easecraft/compositions/notification-center.tsx

    Dependencies / 03

    easecraft
    npm / 0.1.0
    react
    peer / >=18.2.0 <20.0.0
    react-dom
    peer / >=18.2.0 <20.0.0

    Component graph

    Foundations

    FeedbackToast StackToastStack

    Interaction contract

    Keyboard

    Tab / Shift+Tab
    Moves through center controls, feed items, and toast actions.
    Enter / Space
    Activates mark-read, clear, and notification actions.
    F8
    Moves focus to the transient notification viewport.
    Escape
    Dismisses the active transient notification.

    Release requirement

    Accessibility

    Pattern
    notification-center
    Focus management
    Required
    Reduced motion
    Immediate semantic fallback
    Note
    Keeps persistent notification history separate from transient polite or assertive announcements.
    Note
    Delegates pausable timers, swipe dismissal, queue limits, and retained exits to ToastStack.