@12-apps/notifications 4.9.0 → 4.10.1

package/dist/{panel-UFXNO4AF.js → panel-OPB3DBLJ.js}

@@ -1,10 +1,12 @@
 import {
+  LiveSection,
   relativeTime
-} from "./chunk-O5BVUXPO.js";
+} from "./chunk-ZY32PC34.js";
 import {
   BellIcon,
   useInboxList
 } from "./chunk-BW723CX2.js";
+import "./chunk-RTURLH5U.js";
 import {
   __name
 } from "./chunk-7QVYU63E.js";
@@ -105,14 +107,15 @@ function NotificationRow({
 __name(NotificationRow, "NotificationRow");
 
 // src/react/panel.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function PanelBody({
   state,
   messages,
   onRetry,
   onLoadMore,
   onOpen,
-  onDelete
+  onDelete,
+  hasLive
 }) {
   if (state.status === "pending" || state.status === "idle") {
     return /* @__PURE__ */ jsx2(
@@ -138,7 +141,7 @@ function PanelBody({
       }
     );
   }
-  if (state.items.length === 0) {
+  if (state.items.length === 0 && !hasLive) {
     return /* @__PURE__ */ jsx2(
       EmptyState,
       {
@@ -150,53 +153,118 @@ function PanelBody({
       }
     );
   }
-  return /* @__PURE__ */ jsxs2(Box2, { children: [
-    state.items.map((notification) => /* @__PURE__ */ jsx2(
-      NotificationRow,
-      {
-        notification,
-        messages,
-        onOpen,
-        onDelete
+  return (
+    // A stable anchor for the inbox half, present whether or not it has rows.
+    // The panel's claim is that what is HAPPENING sits above what has already
+    // happened, and until this existed the only thing below the live section to
+    // point at was the empty state — which is exactly what stops rendering when
+    // something is live.
+    /* @__PURE__ */ jsxs2(Box2, { "data-testid": "notifications-inbox", children: [
+      state.items.map((notification) => /* @__PURE__ */ jsx2(
+        NotificationRow,
+        {
+          notification,
+          messages,
+          onOpen,
+          onDelete
+        },
+        notification.id
+      )),
+      state.nextCursor ? /* @__PURE__ */ jsx2(Box2, { sx: { display: "flex", justifyContent: "center", py: 1.5 }, children: /* @__PURE__ */ jsx2(
+        Button2,
+        {
+          variant: "outline",
+          color: "neutral",
+          size: "sm",
+          disabled: state.loadingMore,
+          onClick: onLoadMore,
+          dataTestId: "notifications-load-more",
+          children: state.loadingMore ? messages.loadingMore : messages.loadMore
+        }
+      ) }) : null
+    ] })
+  );
+}
+__name(PanelBody, "PanelBody");
+function usePanelOpeners(store, onClose, onNavigate) {
+  const follow = useCallback(
+    (link) => {
+      if (!link || !onNavigate) return;
+      onClose();
+      onNavigate(link);
+    },
+    [onClose, onNavigate]
+  );
+  return {
+    openNotification: useCallback(
+      (notification) => {
+        if (notification.readAt === null) store.markRead([notification.id]);
+        follow(notification.link);
       },
-      notification.id
-    )),
-    state.nextCursor ? /* @__PURE__ */ jsx2(Box2, { sx: { display: "flex", justifyContent: "center", py: 1.5 }, children: /* @__PURE__ */ jsx2(
+      [store, follow]
+    ),
+    openLive: useCallback((activity) => follow(activity.link), [follow])
+  };
+}
+__name(usePanelOpeners, "usePanelOpeners");
+function PanelInbox({
+  state,
+  messages,
+  store,
+  onOpen,
+  hasLive
+}) {
+  const hasUnread = state.items.some((item) => item.readAt === null);
+  return /* @__PURE__ */ jsxs2(Fragment, { children: [
+    hasUnread ? /* @__PURE__ */ jsx2(Box2, { sx: { display: "flex", justifyContent: "flex-end", pb: 1 }, children: /* @__PURE__ */ jsx2(
       Button2,
       {
-        variant: "outline",
-        color: "neutral",
-        size: "sm",
-        disabled: state.loadingMore,
-        onClick: onLoadMore,
-        dataTestId: "notifications-load-more",
-        children: state.loadingMore ? messages.loadingMore : messages.loadMore
+        variant: "ghost",
+        color: "primary",
+        size: "xs",
+        onClick: () => store.markAllRead(),
+        dataTestId: "notifications-mark-all-read",
+        children: messages.markAllRead
+      }
+    ) }) : null,
+    /* @__PURE__ */ jsx2(
+      PanelBody,
+      {
+        state,
+        messages,
+        onRetry: () => store.invalidate(),
+        onLoadMore: () => store.loadMore(),
+        onOpen,
+        onDelete: (id) => store.remove(id),
+        hasLive
       }
-    ) }) : null
+    )
   ] });
 }
-__name(PanelBody, "PanelBody");
+__name(PanelInbox, "PanelInbox");
 function NotificationsPanel({
   open,
   onClose,
   onNavigate,
   store,
-  messages
+  messages,
+  live,
+  liveSeen
 }) {
   const theme = useTheme();
   const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
   const state = useInboxList(store, open);
-  const openNotification = useCallback(
-    (notification) => {
-      if (notification.readAt === null) store.markRead([notification.id]);
-      if (notification.link && onNavigate) {
-        onClose();
-        onNavigate(notification.link);
-      }
-    },
-    [store, onClose, onNavigate]
-  );
-  const hasUnread = state.items.some((item) => item.readAt === null);
+  const { openNotification, openLive } = usePanelOpeners(store, onClose, onNavigate);
+  const renderInbox = /* @__PURE__ */ __name((liveCount) => /* @__PURE__ */ jsx2(
+    PanelInbox,
+    {
+      state,
+      messages,
+      store,
+      onOpen: openNotification,
+      hasLive: liveCount > 0
+    }
+  ), "renderInbox");
   return /* @__PURE__ */ jsxs2(
     Drawer,
     {
@@ -208,30 +276,17 @@ function NotificationsPanel({
       dataTestId: "notifications-panel",
       children: [
         /* @__PURE__ */ jsx2(DrawerHeader, { onClose, children: messages.panelTitle }),
-        /* @__PURE__ */ jsxs2(DrawerContent, { children: [
-          hasUnread ? /* @__PURE__ */ jsx2(Box2, { sx: { display: "flex", justifyContent: "flex-end", pb: 1 }, children: /* @__PURE__ */ jsx2(
-            Button2,
-            {
-              variant: "ghost",
-              color: "primary",
-              size: "xs",
-              onClick: () => store.markAllRead(),
-              dataTestId: "notifications-mark-all-read",
-              children: messages.markAllRead
-            }
-          ) }) : null,
-          /* @__PURE__ */ jsx2(
-            PanelBody,
-            {
-              state,
-              messages,
-              onRetry: () => store.invalidate(),
-              onLoadMore: () => store.loadMore(),
-              onOpen: openNotification,
-              onDelete: (id) => store.remove(id)
-            }
-          )
-        ] })
+        /* @__PURE__ */ jsx2(DrawerContent, { children: live ? /* @__PURE__ */ jsx2(
+          LiveSection,
+          {
+            config: live,
+            messages,
+            active: open,
+            ...onNavigate ? { onOpen: openLive } : {},
+            ...liveSeen ? { seen: liveSeen } : {},
+            children: renderInbox
+          }
+        ) : renderInbox(0) })
       ]
     }
   );
@@ -240,4 +295,4 @@ __name(NotificationsPanel, "NotificationsPanel");
 export {
   NotificationsPanel
 };
-//# sourceMappingURL=panel-UFXNO4AF.js.map
+//# sourceMappingURL=panel-OPB3DBLJ.js.map

package/dist/panel-OPB3DBLJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/react/panel.tsx","../src/react/row.tsx"],"sourcesContent":["/**\n * The notification-centre slide-over: newest-first list with unread styling,\n * per-item open (marks read + deep-links), soft delete, mark-all, empty /\n * loading / error states and a \"load more\" cursor pager.\n *\n * Rendering is app-agnostic — the host passes `onNavigate` (its router's\n * navigate) for deep links. Without one a link is simply not followed, which is\n * what lets the panel mount in a host that has no router at all.\n */\nimport { useCallback, type JSX } from 'react';\n\nimport { EmptyState } from '@12-apps/ui/data-display/EmptyState';\nimport { LoadingState } from '@12-apps/ui/data-display/LoadingState';\nimport { Button } from '@12-apps/ui/form/Button';\nimport { Drawer, DrawerContent, DrawerHeader } from '@12-apps/ui/layout/Drawer';\nimport { Box } from '@12-apps/ui/mui/Box';\nimport { useMediaQuery } from '@12-apps/ui/mui/useMediaQuery';\nimport { useTheme } from '@12-apps/ui/mui/styles';\n\nimport type { LiveActivity } from '../live';\nimport type { NotificationMessages } from '../messages';\nimport type { InboxNotification } from '../wire';\n\nimport { BellIcon } from './bell-icon';\nimport { useInboxList } from './hooks';\nimport type { InboxState, InboxStore } from './inbox-state';\nimport type { LiveActivitiesConfig } from './live-config';\nimport type { LiveSeenStore } from './live-seen';\nimport { LiveSection } from './live-section';\nimport { NotificationRow } from './row';\n\ninterface PanelBodyProps {\n  state: InboxState;\n  messages: NotificationMessages;\n  onRetry: () => void;\n  onLoadMore: () => void;\n  onOpen: (notification: InboxNotification) => void;\n  onDelete: (id: string) => void;\n  /**\n   * Whether the live section above has anything in it.\n   *\n   * The empty state is a CLAIM about the whole panel — \"nenhuma notificação\" —\n   * and a live entry is a notification, so an inbox with no rows under a pinned\n   * pedido is not empty. Without this the panel said both things at once.\n   */\n  hasLive: boolean;\n}\n\n/** The scrollable panel body: loading / error / empty / the list + pager. */\nfunction PanelBody({\n  state,\n  messages,\n  onRetry,\n  onLoadMore,\n  onOpen,\n  onDelete,\n  hasLive,\n}: PanelBodyProps): JSX.Element {\n  if (state.status === 'pending' || state.status === 'idle') {\n    return (\n      <LoadingState\n        variant=\"spinner\"\n        message={messages.loading}\n        size=\"md\"\n        dataTestId=\"notifications-loading\"\n      />\n    );\n  }\n  if (state.status === 'error') {\n    return (\n      <EmptyState\n        variant=\"minimal\"\n        title={messages.loadFailedTitle}\n        description={messages.loadFailedBody}\n        onRefresh={onRetry}\n        refreshLabel={messages.retry}\n        dataTestId=\"notifications-error\"\n      />\n    );\n  }\n  if (state.items.length === 0 && !hasLive) {\n    return (\n      <EmptyState\n        variant=\"illustrated\"\n        illustration={<BellIcon size={44} dim />}\n        title={messages.emptyTitle}\n        description={messages.emptyBody}\n        dataTestId=\"notifications-empty\"\n      />\n    );\n  }\n  return (\n    // A stable anchor for the inbox half, present whether or not it has rows.\n    // The panel's claim is that what is HAPPENING sits above what has already\n    // happened, and until this existed the only thing below the live section to\n    // point at was the empty state — which is exactly what stops rendering when\n    // something is live.\n    <Box data-testid=\"notifications-inbox\">\n      {state.items.map((notification) => (\n        <NotificationRow\n          key={notification.id}\n          notification={notification}\n          messages={messages}\n          onOpen={onOpen}\n          onDelete={onDelete}\n        />\n      ))}\n      {state.nextCursor ? (\n        <Box sx={{ display: 'flex', justifyContent: 'center', py: 1.5 }}>\n          <Button\n            variant=\"outline\"\n            color=\"neutral\"\n            size=\"sm\"\n            disabled={state.loadingMore}\n            onClick={onLoadMore}\n            dataTestId=\"notifications-load-more\"\n          >\n            {state.loadingMore ? messages.loadingMore : messages.loadMore}\n          </Button>\n        </Box>\n      ) : null}\n    </Box>\n  );\n}\n\n/**\n * The two open gestures, which are ONE deep-link path with a mark-read in front\n * of half of it.\n *\n * Lifted out of the component because both kinds of entry follow a link the\n * same way and a host with no router follows neither — one rule, stated once,\n * rather than the same three lines written twice.\n */\nfunction usePanelOpeners(\n  store: InboxStore,\n  onClose: () => void,\n  onNavigate?: (link: string) => void,\n): {\n  openNotification: (notification: InboxNotification) => void;\n  openLive: (activity: LiveActivity) => void;\n} {\n  const follow = useCallback(\n    (link: string | null) => {\n      if (!link || !onNavigate) return;\n      onClose();\n      onNavigate(link);\n    },\n    [onClose, onNavigate],\n  );\n\n  return {\n    openNotification: useCallback(\n      (notification: InboxNotification) => {\n        if (notification.readAt === null) store.markRead([notification.id]);\n        follow(notification.link);\n      },\n      [store, follow],\n    ),\n    openLive: useCallback((activity: LiveActivity) => follow(activity.link), [follow]),\n  };\n}\n\nexport interface NotificationsPanelProps {\n  open: boolean;\n  onClose: () => void;\n  /** Navigate to a notification's in-app link (the host's router). */\n  onNavigate?: (link: string) => void;\n}\n\n/**\n * Everything BELOW the live section: the mark-all control and the list.\n *\n * Its own component rather than a block inside the panel because it is rendered\n * from two places — through `LiveSection`, and directly when the host turned\n * live activities off — and because the panel is at its line ceiling. \"Marcar\n * todas como lidas\" belongs to the INBOX and travels with it: a live entry has\n * nothing to mark.\n */\nfunction PanelInbox({\n  state,\n  messages,\n  store,\n  onOpen,\n  hasLive,\n}: {\n  state: InboxState;\n  messages: NotificationMessages;\n  store: InboxStore;\n  onOpen: (notification: InboxNotification) => void;\n  hasLive: boolean;\n}): JSX.Element {\n  const hasUnread = state.items.some((item) => item.readAt === null);\n  return (\n    <>\n      {hasUnread ? (\n        <Box sx={{ display: 'flex', justifyContent: 'flex-end', pb: 1 }}>\n          <Button\n            variant=\"ghost\"\n            color=\"primary\"\n            size=\"xs\"\n            onClick={() => store.markAllRead()}\n            dataTestId=\"notifications-mark-all-read\"\n          >\n            {messages.markAllRead}\n          </Button>\n        </Box>\n      ) : null}\n      <PanelBody\n        state={state}\n        messages={messages}\n        onRetry={() => store.invalidate()}\n        onLoadMore={() => store.loadMore()}\n        onOpen={onOpen}\n        onDelete={(id) => store.remove(id)}\n        hasLive={hasLive}\n      />\n    </>\n  );\n}\n\nexport function NotificationsPanel({\n  open,\n  onClose,\n  onNavigate,\n  store,\n  messages,\n  live,\n  liveSeen,\n}: NotificationsPanelProps & {\n  store: InboxStore;\n  messages: NotificationMessages;\n  live?: LiveActivitiesConfig;\n  liveSeen?: LiveSeenStore;\n}): JSX.Element {\n  // `useTheme` from @mui/material/styles falls back to the DEFAULT theme when\n  // no provider is mounted, where the callback form of `useMediaQuery` would\n  // hand the callback a null theme and throw. A published component must render\n  // in a host that has not wrapped it yet.\n  const theme = useTheme();\n  const isMobile = useMediaQuery(theme.breakpoints.down('sm'));\n  const state = useInboxList(store, open);\n\n  const { openNotification, openLive } = usePanelOpeners(store, onClose, onNavigate);\n\n  // A function rather than an element so the live count can reach it: with a\n  // live section it is called by `LiveSection` — the only place the host's hook\n  // may be called — and without one it is called here with zero.\n  const renderInbox = (liveCount: number): JSX.Element => (\n    <PanelInbox\n      state={state}\n      messages={messages}\n      store={store}\n      onOpen={openNotification}\n      hasLive={liveCount > 0}\n    />\n  );\n\n  return (\n    <Drawer\n      open={open}\n      onClose={onClose}\n      anchor=\"right\"\n      variant=\"right\"\n      width={isMobile ? '100vw' : 400}\n      dataTestId=\"notifications-panel\"\n    >\n      <DrawerHeader onClose={onClose}>{messages.panelTitle}</DrawerHeader>\n      <DrawerContent>\n        {/*\n          Above the mark-all control as well as above the list, deliberately:\n          \"marcar todas como lidas\" belongs to the INBOX, and a live entry has\n          nothing to mark. A control between the two blocks would read as\n          applying to both.\n        */}\n        {live ? (\n          <LiveSection\n            config={live}\n            messages={messages}\n            active={open}\n            {...(onNavigate ? { onOpen: openLive } : {})}\n            {...(liveSeen ? { seen: liveSeen } : {})}\n          >\n            {renderInbox}\n          </LiveSection>\n        ) : (\n          renderInbox(0)\n        )}\n      </DrawerContent>\n    </Drawer>\n  );\n}\n","/** One inbox row: unread accent, content (opens/marks read), timestamp, delete. */\nimport type { JSX } from 'react';\n\nimport { Button } from '@12-apps/ui/form/Button';\nimport { Box } from '@12-apps/ui/mui/Box';\nimport { alpha, type Theme } from '@12-apps/ui/mui/styles';\nimport { Text } from '@12-apps/ui/typography/Text';\n\nimport type { NotificationMessages } from '../messages';\nimport type { InboxNotification } from '../wire';\n\nimport { relativeTime } from './relative-time';\n\nconst contentButtonSx = {\n  flex: 1,\n  minWidth: 0,\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 0.25,\n  textAlign: 'left',\n  border: 'none',\n  background: 'none',\n  p: 0,\n  cursor: 'pointer',\n  color: 'text.primary',\n  fontFamily: 'inherit',\n} as const;\n\nconst unreadDotSx = {\n  width: 8,\n  height: 8,\n  borderRadius: '50%',\n  bgcolor: 'primary.main',\n  flex: '0 0 auto',\n} as const;\n\nexport function NotificationRow({\n  notification,\n  messages,\n  onOpen,\n  onDelete,\n}: {\n  notification: InboxNotification;\n  messages: NotificationMessages;\n  onOpen: (notification: InboxNotification) => void;\n  onDelete: (id: string) => void;\n}): JSX.Element {\n  const unread = notification.readAt === null;\n  return (\n    <Box\n      data-testid={`notification-${notification.id}`}\n      sx={{\n        display: 'flex',\n        alignItems: 'flex-start',\n        gap: 1,\n        py: 1.5,\n        px: 1,\n        borderBottom: '1px solid',\n        borderColor: 'divider',\n        bgcolor: unread ? (t: Theme) => alpha(t.palette.primary.main, 0.06) : 'transparent',\n      }}\n    >\n      <Box\n        component=\"button\"\n        type=\"button\"\n        onClick={() => onOpen(notification)}\n        aria-label={\n          unread ? `${notification.title} (${messages.unreadSuffix})` : notification.title\n        }\n        sx={contentButtonSx}\n      >\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>\n          {unread ? <Box aria-hidden sx={unreadDotSx} /> : null}\n          <Text variant=\"body\" size=\"sm\" weight={unread ? 'bold' : 'medium'} as=\"span\">\n            {notification.title}\n          </Text>\n        </Box>\n        <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"span\">\n          {notification.body}\n        </Text>\n        <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"span\" italic>\n          {relativeTime(notification.createdAt, messages)}\n        </Text>\n      </Box>\n\n      <Button\n        variant=\"ghost\"\n        color=\"neutral\"\n        size=\"xs\"\n        aria-label={messages.deleteOne(notification.title)}\n        onClick={() => onDelete(notification.id)}\n        dataTestId={`notification-delete-${notification.id}`}\n      >\n        ✕\n      </Button>\n    </Box>\n  );\n}\n"],"mappings":"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","names":["Button","Box","jsx","jsxs","Box","Button"]}

package/dist/{preferences-screen-V3ZBWP7A.js → preferences-screen-SXUIGECY.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-CQZMTFPY.js";
 import {
   NOTIFICATION_CHANNELS
-} from "./chunk-BGI4BQ66.js";
+} from "./chunk-6W7INOYQ.js";
 import {
   __name
 } from "./chunk-7QVYU63E.js";
@@ -291,4 +291,4 @@ __name(PreferencesScreen, "PreferencesScreen");
 export {
   PreferencesScreen
 };
-//# sourceMappingURL=preferences-screen-V3ZBWP7A.js.map
+//# sourceMappingURL=preferences-screen-SXUIGECY.js.map

package/dist/react/index.d.ts

@@ -1,8 +1,50 @@
-import { N as NotificationsApiClient } from '../create-web-notifications-B-xQ6R0B.js';
-export { B as BADGE_POLL_MS, a as BADGE_RECONCILE_MS, b as BellButtonProps, I as InboxListStatus, d as InboxState, e as InboxStore, f as NotificationsHttpError, g as NotificationsPanelProps, h as NotificationsResult, i as NotificationsSignalHook, j as NotificationsSubscribe, k as NotificationsTransport, l as NotificationsWebConfig, P as PAGE_SIZE, m as PreferencesPayload, n as PreferencesScreenProps, o as PushRegistrationPayload, W as WebNotifications, p as WebPushPlatformHint, q as WebPushSetupConfig, r as createInboxStore, s as createNotificationsApiClient, c as createWebNotifications, t as httpNotificationsTransport, u as useInboxList, v as useInboxState, w as useUnreadCount } from '../create-web-notifications-B-xQ6R0B.js';
-import { JSX } from 'react';
-import { N as NotificationMessages } from '../wire-_coV3tJk.js';
-import '../types-BFmAY0P5.js';
+import { L as LiveActivitiesConfig, N as NotificationsApiClient } from '../create-web-notifications-DV3Y8k7e.js';
+export { B as BADGE_POLL_MS, a as BADGE_RECONCILE_MS, b as BellButtonProps, I as InboxListStatus, d as InboxState, e as InboxStore, f as LiveActivitiesHook, g as LiveActivityMessages, h as NotificationsHttpError, i as NotificationsPanelProps, j as NotificationsResult, k as NotificationsSignalHook, l as NotificationsSubscribe, m as NotificationsTransport, n as NotificationsWebConfig, P as PAGE_SIZE, o as PreferencesPayload, p as PreferencesScreenProps, q as PushRegistrationPayload, W as WebNotifications, r as WebPushPlatformHint, s as WebPushSetupConfig, t as createInboxStore, u as createNotificationsApiClient, c as createWebNotifications, v as httpNotificationsTransport, w as useInboxList, x as useInboxState, y as useUnreadCount } from '../create-web-notifications-DV3Y8k7e.js';
+import { JSX, ReactNode } from 'react';
+import { b as LiveActivity } from '../live-DYxEFO49.js';
+export { c as LiveActivityLane, d as LiveActivityStep, l as liveActivityLane } from '../live-DYxEFO49.js';
+import { N as NotificationMessages } from '../wire-BG1kuoXX.js';
+import '../types-BlqZkCWZ.js';
+
+/**
+ * What the reader has already been shown, so the bell can say NEW rather than
+ * merely PRESENT.
+ *
+ * A live activity is unlike an inbox row in the one way that matters here: it
+ * stays on the panel for as long as the thing is happening, so its presence
+ * cannot mean "you have not seen this". A pedido that has been `Preparo` for
+ * ten minutes is still live and still worth counting, but nothing has happened
+ * — and a badge that shouts for a subject the reader has already looked at is a
+ * badge people stop reading.
+ *
+ * So presence and novelty are answered separately: the COUNT comes from how
+ * many are live, and the TONE comes from this. The panel writes it — being on
+ * screen is what seen means — and the bell reads it.
+ *
+ * ## Per subject, not one watermark
+ *
+ * A single "newest instant already seen" is smaller and was the first cut, and
+ * it is wrong in a way that shows up in normal use: a pedido placed ten minutes
+ * ago but only now reaching the client arrives with an `updatedAt` BEHIND the
+ * watermark, and would be silently marked as already seen. The reader has never
+ * laid eyes on it. Keyed by subject, an id that has not been recorded is new
+ * whatever its clock says.
+ *
+ * Bounded by pruning rather than by expiry: every write keeps only the subjects
+ * that are live at that moment, so the record can never outgrow the number of
+ * things happening at once. A subject that finishes and later comes back is
+ * news again, which is correct — it is a different occurrence.
+ */
+
+/** id -> the `updatedAt` that was on screen. */
+type SeenMap = Readonly<Record<string, string>>;
+interface LiveSeenStore {
+    /** What has been shown, keyed by subject id. */
+    read: () => SeenMap;
+    /** Record that exactly these are on screen now, forgetting subjects that are not. */
+    mark: (activities: readonly LiveActivity[]) => void;
+    subscribe: (listener: () => void) => () => void;
+}
 
 /** Inline SVG bell (no icon-library dependency in this package). */
 
@@ -11,12 +53,82 @@ declare function BellIcon({ size, dim, }: {
     dim?: boolean;
 }): JSX.Element;
 
+/**
+ * The pinned block at the top of the panel: everything that is happening NOW,
+ * above everything that has already happened.
+ *
+ * ## Why it is here and not a second surface
+ *
+ * The notification centre is where a person goes to find out what they missed.
+ * Splitting "happening" into its own bell would make them check two places to
+ * answer one question, and the half they would stop checking is the one that
+ * only has something in it occasionally — which is this one. Above the list,
+ * inside the same drawer, it is on the path they already walk.
+ *
+ * ## What it deliberately does NOT do
+ *
+ * - It does not touch `unread`. A live entry is not news; counting it would put
+ *   a number on the bell that no amount of reading can clear.
+ * - It renders nothing at all when there is nothing live — no heading, no empty
+ *   state, no reserved space. A panel with one permanent empty section in it is
+ *   a panel that has taught its reader to skip the top.
+ * - It does not fetch. `useActivities` is the host's, and `active` tells it
+ *   whether anyone is looking.
+ */
+
+interface LiveSectionProps {
+    config: LiveActivitiesConfig;
+    messages: NotificationMessages;
+    /** Whether the panel is open — passed straight through to the host's hook. */
+    active: boolean;
+    /**
+     * Follow a card's link.
+     *
+     * Optional, and the panel omits it for a host with no router: a card that
+     * cannot go anywhere renders as text rather than as a named control that
+     * does nothing.
+     */
+    onOpen?: (activity: LiveActivity) => void;
+    /**
+     * The rest of the panel, given how many entries are live.
+     *
+     * A render prop rather than a sibling, because the count is knowable only
+     * where the host's hook is CALLED, and it cannot be called anywhere else:
+     * `live` is optional on the panel, so reading it there would mean calling a
+     * hook conditionally — the failure React reports as a crash in some unrelated
+     * component.
+     *
+     * The inbox needs the number for exactly one decision, and it is the decision
+     * this section exists to inform: whether "no notifications" is true. A live
+     * entry IS a notification, so a panel showing one under that sentence is
+     * contradicting itself.
+     */
+    children?: (liveCount: number) => ReactNode;
+    /**
+     * Where "the reader has seen these" is recorded, for the bell to read.
+     *
+     * Written HERE because this is the component that puts them on screen, and
+     * being on screen is what seen means. Optional so the section stays usable by
+     * a host that mounts it outside the panel.
+     */
+    seen?: LiveSeenStore;
+}
+declare function LiveSection({ config, messages, active, onOpen, children, seen, }: LiveSectionProps): JSX.Element;
+
 /**
  * "há 5 min"-style relative timestamp, falling back to an absolute date for
  * anything older than a week. Every word comes from the messages table, so a
  * host in another locale changes the copy and the locale together.
+ *
+ * `now` is a parameter rather than a read, and the live section is why. A
+ * relative phrase is only true for the instant it was computed, so something
+ * has to CAUSE the render that recomputes it — and the live entries' own data
+ * cannot: a host backed by react-query gets the previous object back whenever a
+ * poll is deep-equal (`structuralSharing`, on by default), which within one
+ * stage it always is. The section therefore ticks a clock and hands it down.
+ * Defaulted, so every existing caller reads the wall clock exactly as before.
  */
-declare function relativeTime(iso: string, messages: NotificationMessages): string;
+declare function relativeTime(iso: string, messages: NotificationMessages, now?: number): string;
 
 /**
  * The browser half of Web Push: register the service worker, ask permission,
@@ -44,4 +156,4 @@ declare function enableWebPush(api: NotificationsApiClient, swPath?: string): Pr
 /** Disable flow: unsubscribe the browser and drop the server-side row. */
 declare function disableWebPush(api: NotificationsApiClient): Promise<void>;
 
-export { BellIcon, NotificationsApiClient, type PushSetupResult, disableWebPush, enableWebPush, getExistingPushSubscription, pushSupported, relativeTime };
+export { BellIcon, LiveActivitiesConfig, LiveActivity, LiveSection, type LiveSectionProps, NotificationsApiClient, type PushSetupResult, disableWebPush, enableWebPush, getExistingPushSubscription, pushSupported, relativeTime };

package/dist/react/index.js

@@ -3,10 +3,11 @@ import {
   createNotificationsApiClient,
   createWebNotifications,
   httpNotificationsTransport
-} from "../chunk-M5XTROYM.js";
+} from "../chunk-I5QUMTCN.js";
 import {
+  LiveSection,
   relativeTime
-} from "../chunk-O5BVUXPO.js";
+} from "../chunk-ZY32PC34.js";
 import {
   BADGE_POLL_MS,
   BADGE_RECONCILE_MS,
@@ -24,11 +25,15 @@ import {
   pushSupported
 } from "../chunk-CQZMTFPY.js";
 import "../chunk-M2TVBVH2.js";
+import {
+  liveActivityLane
+} from "../chunk-RTURLH5U.js";
 import "../chunk-7QVYU63E.js";
 export {
   BADGE_POLL_MS,
   BADGE_RECONCILE_MS,
   BellIcon,
+  LiveSection,
   NotificationsHttpError,
   PAGE_SIZE,
   createInboxStore,
@@ -38,6 +43,7 @@ export {
   enableWebPush,
   getExistingPushSubscription,
   httpNotificationsTransport,
+  liveActivityLane,
   pushSupported,
   relativeTime,
   useInboxList,

package/dist/server/index.d.ts

@@ -1,11 +1,11 @@
-import { A as ApiNotifications } from '../create-api-notifications-B-VMezVB.js';
-export { C as CommittedNotification, E as EMAIL_DRIVERS, c as EmailDriver, d as EmailDriverDeclaration, e as EmailMessage, f as ExtraDrivers, L as ListNotificationsInput, g as NotificationAudienceDirectory, h as NotificationChannelPolicy, i as NotificationCommittedListener, j as NotificationContactDirectory, k as NotificationCreateData, l as NotificationDelegate, m as NotificationDeliveryDelegate, n as NotificationDeliveryRow, o as NotificationDeliveryWhere, p as NotificationDispatchScheduler, q as NotificationInboxStore, r as NotificationPageAfter, s as NotificationPreferenceDelegate, t as NotificationPreferenceRow, u as NotificationPreferenceStore, v as NotificationRouter, w as NotificationWhere, a as NotificationsActor, x as NotificationsApiError, y as NotificationsDb, z as NotificationsDbClient, B as NotificationsDbProvider, D as NotificationsRequest, F as NotificationsResponse, b as NotificationsRoute, N as NotificationsServerConfig, G as NotifyByPermission, H as NotifyOptions, I as NotifyResult, P as PermissionNotificationResult, J as PermissionNotificationSkip, K as PushSubscriptionDelegate, M as PushSubscriptionInput, O as PushSubscriptionRow, Q as PushSubscriptionStore, S as SMS_DRIVERS, R as SmsDriver, T as SmsDriverDeclaration, U as SmsMessage, V as TransportDeclaration, W as TransportRegistry, X as WHATSAPP_DRIVERS, Y as WhatsAppDriver, Z as WhatsAppDriverDeclaration, _ as WhatsAppMessage, $ as createApiNotifications, a0 as createTransportRegistry, a1 as emailTransport, a2 as foldApiError, a3 as formatEmail, a4 as formatSms, a5 as formatWhatsApp, a6 as ok, a7 as smsTransport, a8 as whatsAppTransport } from '../create-api-notifications-B-VMezVB.js';
-export { D as DriverDeclarationBase, F as FetchImpl, N as NotificationProviderError, W as WEB_PUSH_DRIVERS, a as WebPushDriverDeclaration, b as WebPushMessage, c as WebPushSender, d as WebPushSubscription, e as WebPushSubscriptionSource, f as absoluteLink, g as formatWebPush, w as webPushTransport } from '../web-push-D-ysQd5h.js';
+import { A as ApiNotifications } from '../create-api-notifications-CcPYrM3p.js';
+export { C as CommittedNotification, E as EMAIL_DRIVERS, c as EmailDriver, d as EmailDriverDeclaration, e as EmailMessage, f as ExtraDrivers, L as ListNotificationsInput, g as NotificationAudienceDirectory, h as NotificationChannelPolicy, i as NotificationCommittedListener, j as NotificationContactDirectory, k as NotificationCreateData, l as NotificationDelegate, m as NotificationDeliveryDelegate, n as NotificationDeliveryRow, o as NotificationDeliveryWhere, p as NotificationDispatchScheduler, q as NotificationInboxStore, r as NotificationPageAfter, s as NotificationPreferenceDelegate, t as NotificationPreferenceRow, u as NotificationPreferenceStore, v as NotificationRouter, w as NotificationWhere, a as NotificationsActor, x as NotificationsApiError, y as NotificationsDb, z as NotificationsDbClient, B as NotificationsDbProvider, D as NotificationsRequest, F as NotificationsResponse, b as NotificationsRoute, N as NotificationsServerConfig, G as NotifyByPermission, H as NotifyOptions, I as NotifyResult, P as PermissionNotificationResult, J as PermissionNotificationSkip, K as PushSubscriptionDelegate, M as PushSubscriptionInput, O as PushSubscriptionRow, Q as PushSubscriptionStore, S as SMS_DRIVERS, R as SmsDriver, T as SmsDriverDeclaration, U as SmsMessage, V as TransportDeclaration, W as TransportRegistry, X as WHATSAPP_DRIVERS, Y as WhatsAppDriver, Z as WhatsAppDriverDeclaration, _ as WhatsAppMessage, $ as createApiNotifications, a0 as createTransportRegistry, a1 as emailTransport, a2 as foldApiError, a3 as formatEmail, a4 as formatSms, a5 as formatWhatsApp, a6 as ok, a7 as smsTransport, a8 as whatsAppTransport } from '../create-api-notifications-CcPYrM3p.js';
+export { D as DriverDeclarationBase, F as FetchImpl, N as NotificationProviderError, W as WEB_PUSH_DRIVERS, a as WebPushDriverDeclaration, b as WebPushMessage, c as WebPushSender, d as WebPushSubscription, e as WebPushSubscriptionSource, f as absoluteLink, g as formatWebPush, w as webPushTransport } from '../web-push-Dnyaha2z.js';
 import { NotifyPort } from '@12-apps/wiring/ports';
-export { a as NOTIFICATIONS_DRAIN_CRON, b as NOTIFICATIONS_DRAIN_LEASE_MS, c as NOTIFICATIONS_JOBS, d as NOTIFICATIONS_SWEEP_QUEUE, N as NotificationsJobDeps } from '../jobs-D64B_bg7.js';
-import '../generators-BsuXe8Mp.js';
-import '../types-BFmAY0P5.js';
-import '../wire-_coV3tJk.js';
+export { a as NOTIFICATIONS_DRAIN_CRON, b as NOTIFICATIONS_DRAIN_LEASE_MS, c as NOTIFICATIONS_JOBS, d as NOTIFICATIONS_SWEEP_QUEUE, N as NotificationsJobDeps } from '../jobs--fex87-q.js';
+import '../generators-qAD4fNPq.js';
+import '../types-BlqZkCWZ.js';
+import '../wire-BG1kuoXX.js';
 import '../template-Dlt5S54z.js';
 import '@12-apps/wiring';
 

package/dist/server/index.js

@@ -4,7 +4,7 @@ import {
   NOTIFICATIONS_JOBS,
   NOTIFICATIONS_SWEEP_QUEUE,
   wireNotifyPort
-} from "../chunk-KU4FVOFA.js";
+} from "../chunk-ZIR3ILFH.js";
 import {
   EMAIL_DRIVERS,
   NotificationProviderError,
@@ -25,10 +25,11 @@ import {
   smsTransport,
   webPushTransport,
   whatsAppTransport
-} from "../chunk-KZG7QGFA.js";
-import "../chunk-GGAZOLNN.js";
+} from "../chunk-WVRODNXQ.js";
+import "../chunk-SWOWHIFE.js";
 import "../chunk-M2TVBVH2.js";
-import "../chunk-BGI4BQ66.js";
+import "../chunk-RTURLH5U.js";
+import "../chunk-6W7INOYQ.js";
 import "../chunk-EKUSNUBT.js";
 import "../chunk-7QVYU63E.js";
 export {

package/dist/{types-BFmAY0P5.d.ts → types-BlqZkCWZ.d.ts}

@@ -60,7 +60,16 @@ interface NotificationContent {
     body: string;
     /** In-app deep link (a same-origin path such as `/orders/123`). */
     link?: string;
-    /** Structured extras for consumers that want more than text. */
+    /**
+     * Structured extras for consumers that want more than text.
+     *
+     * ONE KEY IS RESERVED: `liveSubject` (`LIVE_SUBJECT_KEY` in `./live`) ties
+     * this notification to a live activity, and the WEB_PUSH transport turns it
+     * into the tray `tag` that collapses every push about one subject onto a
+     * single entry. A host already using that name for something else acquires
+     * that behaviour without asking for it — so it is named here, on the field a
+     * generator actually writes, and not only where the feature is documented.
+     */
     data?: Record<string, unknown>;
 }
 /** Who receives a notification. `clientId` scopes it to a tenant when set. */

package/dist/web-push/index.d.ts

@@ -1,5 +1,5 @@
-import { c as WebPushSender } from '../web-push-D-ysQd5h.js';
-import '../types-BFmAY0P5.js';
+import { c as WebPushSender } from '../web-push-Dnyaha2z.js';
+import '../types-BlqZkCWZ.js';
 
 /**
  * `@12-apps/notifications/web-push` — the VAPID sender, behind its own subpath.

package/dist/{web-push-D-ysQd5h.d.ts → web-push-Dnyaha2z.d.ts}

@@ -1,4 +1,4 @@
-import { g as NotificationLogger, d as NotificationContent, j as NotificationTransport } from './types-BFmAY0P5.js';
+import { g as NotificationLogger, d as NotificationContent, j as NotificationTransport } from './types-BlqZkCWZ.js';
 
 /**
  * The DRIVER port — the reason a host adds a vendor with a config entry and no
@@ -98,6 +98,26 @@ interface WebPushMessage {
     body: string;
     link: string | null;
     data: Record<string, unknown>;
+    /**
+     * The OS tray tag, or `null` for an ordinary event.
+     *
+     * Present for a notification about a LIVE SUBJECT (see `../../live`), and
+     * this is the whole of the live feature's reach onto a locked phone: a tag
+     * makes the next push about the same subject REPLACE the one already in the
+     * tray — silently — instead of stacking under it. Four stages then cost one
+     * entry and one buzz, and the entry that remains is the current one.
+     *
+     * {@link formatWebPush} always sets it, `null` included, so on the WIRE the
+     * key is always there and a service worker reads one shape. A worker that
+     * ignores it keeps today's behaviour exactly, which is what makes this safe
+     * to ship ahead of the workers.
+     *
+     * OPTIONAL in the type, and only in the type: a host that hand-writes its own
+     * `NotificationTransport<WebPushMessage>` — a fixture, a second driver —
+     * would otherwise stop compiling on a field it has no way to know about and
+     * no reason to set.
+     */
+    tag?: string | null;
 }
 interface WebPushDriverDeclaration extends DriverDeclarationBase {
     channel: 'WEB_PUSH';

package/dist/{wire-_coV3tJk.d.ts → wire-BG1kuoXX.d.ts}

@@ -1,4 +1,4 @@
-import { b as NotificationCategory, c as NotificationChannel } from './types-BFmAY0P5.js';
+import { b as NotificationCategory, c as NotificationChannel } from './types-BlqZkCWZ.js';
 
 /**
  * Every sentence this package can say to a USER, stated by the HOST.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/notifications",
-  "version": "4.9.0",
+  "version": "4.10.1",
   "type": "module",
   "sideEffects": false,
   "description": "Plug-and-play notification system (12-15): an always-on in-app inbox, per-user × per-category channel preferences, and email / SMS / WhatsApp / web-push transports behind vendor DRIVERS so a second provider is a config entry. Framework-free core (.), host-mounted backend surface (./server: inbox / preferences / push-subscription endpoints, the channel router with delivery records + retry sweep, the permission fan-out, duck-typed Prisma seam), Hono adapter (./hono), React surface (./react: bell + badge, inbox drawer, preferences screen), VAPID sender (./web-push) and the package-owned Prisma partial + migrations. Standardized adoption contract in ADOPTING.md.",
@@ -71,7 +71,7 @@
     "prisma:sync:check": "node scripts/sync-notifications-schema.mjs --check"
   },
   "dependencies": {
-    "@12-apps/ui": "^6.14.0"
+    "@12-apps/ui": "^6.18.0"
   },
   "peerDependencies": {
     "@12-apps/wiring": ">=1.3.0",

package/src/index.ts

@@ -65,6 +65,16 @@ export {
   type NotificationMessages,
 } from './messages';
 
+export {
+  LIVE_PUSH_TAG_PREFIX,
+  LIVE_SUBJECT_KEY,
+  liveActivityLane,
+  livePushTag,
+  type LiveActivity,
+  type LiveActivityLane,
+  type LiveActivityStep,
+} from './live';
+
 export {
   inboxWire,
   type InboxNotification,