Family / Notifications system

Notifications system — production surface

Fourteen notification primitives for the Oak Flats Mufflermen workshop — toasts, banners, push, preferences, snooze, DND, digest, sounds, priority rules, quiet hours, templates, delivery reports, and a composed centre.

Production answer

Notifications system — production surface is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.

Primary CTAReview Notifications system — production surface states
Generative search brief

Notifications system — production surface: Fourteen notification primitives for the Oak Flats Mufflermen workshop — toasts, banners, push, preferences, snooze, DND, digest, sounds, priority rules, quiet hours, templates, delivery reports, and a composed centre.

Visual reference only — no real delivery transports wired
Primitive 01

Toast stack

Corner toast stack — top-right + bottom-center placements with collapse / expand.

Stateful · collapseOpen
Primitive 02

Toast card

Single toast — info / success / warning / danger with optional action + countdown timer.

Stateful · timerOpen
Primitive 03

Banner strip

Page-top banner — announcement, alert, promo, maintenance with dismiss.

Stateful · dismissOpen
Primitive 04

Push permission card

Browser push prompt with three-state allow / decline / granted benefit list.

Stateful · 3 statesOpen
Primitive 05

Preference panel

Event × channel matrix — per-row switches across SMS, email, push, in-app.

Stateful · matrixOpen
Primitive 06

Snooze controller

Snooze duration picker — 15m, 1h, today, until Mon — with active chip + clear.

Stateful · radioOpen
Primitive 07

Digest scheduler

Daily / weekly digest scheduler with weekday picker, timezone, send time.

Stateful · cadenceOpen
Primitive 08

Sound preset row

Sound picker with click-to-preview button — never auto-plays audio.

Stateful · previewOpen
Primitive 09

Do not disturb

DND schedule — weekday picker, hush window, enable toggle, summary.

Stateful · scheduleOpen
Primitive 10

Notification centre

Sliding panel with grouped notifications, filter tabs, search, mark-all.

Stateful · tabsOpen
Primitive 11

Priority rule row

Escalation rule — if unread N minutes then page / email / SMS on-call.

Stateful · enableOpen
Primitive 12

Quiet hours pill

Current quiet-hours status pill — active / inactive / scheduled with edit.

Stateless · pillOpen
Primitive 13

Event template card

Per-event message template with merge tags and channel-aware subject hide.

Stateful · textOpen
Primitive 14

Delivery report row

Per-message delivery status — sent / delivered / opened / clicked / failed / bounced.

Stateless · statusOpen
Composition

Full notification centre

All 14 primitives composed into a complete notification operations scene.

CompositionOpen