@12-apps/notifications 4.6.0 → 4.7.1

package/dist/preferences-screen-IOW6Y2H2.js

@@ -0,0 +1,294 @@
+import {
+  enableWebPush,
+  getExistingPushSubscription
+} from "./chunk-CQZMTFPY.js";
+import {
+  NOTIFICATION_CHANNELS
+} from "./chunk-XE7HZVMH.js";
+import {
+  __name
+} from "./chunk-7QVYU63E.js";
+
+// src/react/preferences-screen.tsx
+import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
+import { LoadingState } from "@12-apps/ui/data-display/LoadingState";
+import { Switch } from "@12-apps/ui/form/Switch";
+import { Box as Box2 } from "@12-apps/ui/mui/Box";
+import { Text as Text2 } from "@12-apps/ui/typography/Text";
+
+// src/react/web-push-setup.tsx
+import { useEffect, useState } from "react";
+import { Button } from "@12-apps/ui/form/Button";
+import { Box } from "@12-apps/ui/mui/Box";
+import { Text } from "@12-apps/ui/typography/Text";
+import { jsx, jsxs } from "react/jsx-runtime";
+var cardSx = {
+  p: 2,
+  border: "1px solid",
+  borderColor: "divider",
+  borderRadius: 2
+};
+function InstallFirstHint({ hint }) {
+  return /* @__PURE__ */ jsxs(Box, { sx: cardSx, "data-testid": "web-push-install-hint", children: [
+    /* @__PURE__ */ jsx(Text, { variant: "body", size: "sm", weight: "semibold", as: "p", children: hint.title }),
+    /* @__PURE__ */ jsx(Text, { variant: "caption", size: "xs", color: "secondary", as: "p", children: hint.body })
+  ] });
+}
+__name(InstallFirstHint, "InstallFirstHint");
+async function resolveState(api) {
+  const subscription = await getExistingPushSubscription();
+  if (!subscription) return "idle";
+  const registration = await api.getPushRegistration({ endpoint: subscription.endpoint }).catch(() => null);
+  return registration?.registered ? "on" : "idle";
+}
+__name(resolveState, "resolveState");
+function statusText(state, messages) {
+  if (state === "on") return messages.devicePushOn;
+  if (state === "denied") return messages.devicePushDenied;
+  if (state === "failed") return messages.devicePushFailed;
+  return messages.devicePushIdle;
+}
+__name(statusText, "statusText");
+function WebPushDeviceSetup({
+  available,
+  api,
+  messages,
+  config
+}) {
+  const [state, setState] = useState("checking");
+  const [needsInstall] = useState(() => config.needsInstallFirst?.() ?? false);
+  useEffect(() => {
+    let cancelled = false;
+    void resolveState(api).then((next) => {
+      if (!cancelled) setState(next);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [api]);
+  if (!available) return null;
+  if (needsInstall && config.installHint) return /* @__PURE__ */ jsx(InstallFirstHint, { hint: config.installHint });
+  const enable = /* @__PURE__ */ __name(async () => {
+    setState("busy");
+    const result = await enableWebPush(api, config.swPath);
+    if (result.ok) setState("on");
+    else setState(result.reason === "permission-denied" ? "denied" : "failed");
+  }, "enable");
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      sx: {
+        ...cardSx,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        gap: 2
+      },
+      "data-testid": "web-push-device-setup",
+      children: [
+        /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx(Text, { variant: "body", size: "sm", weight: "semibold", as: "p", children: messages.devicePushTitle }),
+          /* @__PURE__ */ jsx(Text, { variant: "caption", size: "xs", color: "secondary", as: "p", children: statusText(state, messages) })
+        ] }),
+        state !== "on" ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            color: "primary",
+            size: "sm",
+            disabled: state === "busy" || state === "checking",
+            onClick: () => void enable(),
+            dataTestId: "web-push-enable",
+            children: state === "busy" ? messages.devicePushEnabling : messages.devicePushEnable
+          }
+        ) : null
+      ]
+    }
+  );
+}
+__name(WebPushDeviceSetup, "WebPushDeviceSetup");
+
+// src/react/preferences-screen.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function CategoryCard({
+  category,
+  channels,
+  availability,
+  messages,
+  onToggle
+}) {
+  const labels = messages.categoryLabels[category];
+  return /* @__PURE__ */ jsxs2(
+    Box2,
+    {
+      sx: { p: 2, border: "1px solid", borderColor: "divider", borderRadius: 2 },
+      "data-testid": `prefs-${category}`,
+      children: [
+        /* @__PURE__ */ jsx2(Text2, { variant: "body", size: "sm", weight: "semibold", as: "p", children: labels?.title ?? messages.categoryFallbackTitle(category) }),
+        labels?.description ? /* @__PURE__ */ jsx2(Text2, { variant: "caption", size: "xs", color: "secondary", as: "p", children: labels.description }) : null,
+        /* @__PURE__ */ jsx2(
+          Box2,
+          {
+            sx: {
+              mt: 1.5,
+              display: "grid",
+              gridTemplateColumns: { xs: "1fr 1fr", sm: "repeat(4, 1fr)" },
+              gap: 1
+            },
+            children: NOTIFICATION_CHANNELS.map((channel) => /* @__PURE__ */ jsx2(
+              Switch,
+              {
+                size: "sm",
+                color: "primary",
+                label: messages.channelLabels[channel] ?? channel,
+                checked: channels[channel] && availability[channel],
+                disabled: !availability[channel],
+                onChange: (_, checked) => onToggle(channel, checked),
+                dataTestId: `prefs-${category}-${channel}`
+              },
+              channel
+            ))
+          }
+        )
+      ]
+    }
+  );
+}
+__name(CategoryCard, "CategoryCard");
+function UnavailableHints({
+  availability,
+  messages
+}) {
+  const unavailable = NOTIFICATION_CHANNELS.filter((channel) => !availability[channel]);
+  if (unavailable.length === 0) return null;
+  return /* @__PURE__ */ jsx2(Box2, { sx: { display: "flex", flexDirection: "column", gap: 0.5 }, children: unavailable.map((channel) => /* @__PURE__ */ jsxs2(
+    Text2,
+    {
+      variant: "caption",
+      size: "xs",
+      color: "secondary",
+      as: "p",
+      "data-testid": `prefs-hint-${channel}`,
+      children: [
+        messages.channelLabels[channel] ?? channel,
+        ":",
+        " ",
+        messages.channelUnavailableHints[channel] ?? ""
+      ]
+    },
+    channel
+  )) });
+}
+__name(UnavailableHints, "UnavailableHints");
+function usePreferences(api) {
+  const [payload, setPayload] = useState2(null);
+  useEffect2(() => {
+    let cancelled = false;
+    void api.getPreferences().then((next) => {
+      if (!cancelled) setPayload(next);
+    }).catch(() => void 0);
+    return () => {
+      cancelled = true;
+    };
+  }, [api]);
+  const toggle = useCallback(
+    (category, channel, enabled) => {
+      setPayload((current) => {
+        const row = current?.preferences[category];
+        if (!current || !row) return current;
+        return {
+          ...current,
+          preferences: { ...current.preferences, [category]: { ...row, [channel]: enabled } }
+        };
+      });
+      const reconcile = /* @__PURE__ */ __name(() => {
+        void api.getPreferences().then(setPayload).catch(() => void 0);
+      }, "reconcile");
+      void api.savePreference(category, channel, enabled).then((result) => {
+        if (result.ok) setPayload(result.data);
+        else reconcile();
+      }).catch(reconcile);
+    },
+    [api]
+  );
+  return { payload, toggle };
+}
+__name(usePreferences, "usePreferences");
+function PreferencesScreen({
+  footer,
+  api,
+  messages,
+  webPush
+}) {
+  const { payload, toggle } = usePreferences(api);
+  if (!payload) {
+    return /* @__PURE__ */ jsx2(
+      LoadingState,
+      {
+        variant: "spinner",
+        message: messages.loadingMore,
+        size: "md",
+        dataTestId: "notification-prefs-loading"
+      }
+    );
+  }
+  const { preferences, availability, categories } = payload;
+  return /* @__PURE__ */ jsxs2(
+    Box2,
+    {
+      component: "section",
+      "data-testid": "notification-prefs-view",
+      sx: {
+        maxWidth: 640,
+        mx: "auto",
+        width: "100%",
+        px: 2,
+        py: 4,
+        display: "flex",
+        flexDirection: "column",
+        gap: 2
+      },
+      children: [
+        /* @__PURE__ */ jsxs2(Box2, { children: [
+          /* @__PURE__ */ jsx2(Text2, { variant: "heading", size: "lg", as: "h1", children: messages.preferencesTitle }),
+          /* @__PURE__ */ jsxs2(Text2, { variant: "caption", size: "sm", color: "secondary", as: "p", children: [
+            messages.preferencesLead,
+            " ",
+            footer
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx2(
+          WebPushDeviceSetup,
+          {
+            available: availability.WEB_PUSH,
+            api,
+            messages,
+            config: webPush
+          }
+        ),
+        categories.map((category) => /* @__PURE__ */ jsx2(
+          CategoryCard,
+          {
+            category,
+            channels: preferences[category] ?? {
+              EMAIL: false,
+              SMS: false,
+              WHATSAPP: false,
+              WEB_PUSH: false
+            },
+            availability,
+            messages,
+            onToggle: (channel, enabled) => toggle(category, channel, enabled)
+          },
+          category
+        )),
+        /* @__PURE__ */ jsx2(UnavailableHints, { availability, messages })
+      ]
+    }
+  );
+}
+__name(PreferencesScreen, "PreferencesScreen");
+export {
+  PreferencesScreen
+};
+//# sourceMappingURL=preferences-screen-IOW6Y2H2.js.map

package/dist/preferences-screen-IOW6Y2H2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/react/preferences-screen.tsx","../src/react/web-push-setup.tsx"],"sourcesContent":["/**\n * The notification-preferences screen: the category × channel matrix over\n * `GET/PUT <mount>/notification-preferences`.\n *\n * Toggles auto-save (optimistic, per change); channels that cannot reach the\n * user right now (no phone on file / channel not declared) render disabled with\n * a hint. Web Push additionally carries the per-BROWSER enable step, since a\n * preference alone cannot reach a device that never subscribed.\n */\nimport { useCallback, useEffect, useState, type JSX } from 'react';\n\nimport { LoadingState } from '@12-apps/ui/data-display/LoadingState';\nimport { Switch } from '@12-apps/ui/form/Switch';\nimport { Box } from '@12-apps/ui/mui/Box';\nimport { Text } from '@12-apps/ui/typography/Text';\n\nimport type { NotificationMessages } from '../messages';\nimport { NOTIFICATION_CHANNELS, type NotificationChannel } from '../types';\n\nimport type { NotificationsApiClient, PreferencesPayload } from './api';\nimport { WebPushDeviceSetup, type WebPushSetupConfig } from './web-push-setup';\n\ntype Availability = Record<NotificationChannel, boolean>;\n\n/** One category's row of channel switches. */\nfunction CategoryCard({\n  category,\n  channels,\n  availability,\n  messages,\n  onToggle,\n}: {\n  category: string;\n  channels: Record<NotificationChannel, boolean>;\n  availability: Availability;\n  messages: NotificationMessages;\n  onToggle: (channel: NotificationChannel, enabled: boolean) => void;\n}): JSX.Element {\n  const labels = messages.categoryLabels[category];\n  return (\n    <Box\n      sx={{ p: 2, border: '1px solid', borderColor: 'divider', borderRadius: 2 }}\n      data-testid={`prefs-${category}`}\n    >\n      <Text variant=\"body\" size=\"sm\" weight=\"semibold\" as=\"p\">\n        {labels?.title ?? messages.categoryFallbackTitle(category)}\n      </Text>\n      {labels?.description ? (\n        <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"p\">\n          {labels.description}\n        </Text>\n      ) : null}\n      <Box\n        sx={{\n          mt: 1.5,\n          display: 'grid',\n          gridTemplateColumns: { xs: '1fr 1fr', sm: 'repeat(4, 1fr)' },\n          gap: 1,\n        }}\n      >\n        {NOTIFICATION_CHANNELS.map((channel) => (\n          <Switch\n            key={channel}\n            size=\"sm\"\n            color=\"primary\"\n            label={messages.channelLabels[channel] ?? channel}\n            // An unavailable channel reads OFF regardless of the stored choice:\n            // a toggle that says \"on\" for a channel that cannot reach you is a\n            // promise the pipeline will not keep.\n            checked={channels[channel] && availability[channel]}\n            disabled={!availability[channel]}\n            onChange={(_, checked) => onToggle(channel, checked)}\n            // `dataTestId`, not `data-testid`: the UI Switch puts this one on\n            // the INPUT (and derives `-container` / `-label` from it), which is\n            // the element a click and a `disabled` assertion need.\n            dataTestId={`prefs-${category}-${channel}`}\n          />\n        ))}\n      </Box>\n    </Box>\n  );\n}\n\n/** Why disabled toggles are disabled, one line per unavailable channel. */\nfunction UnavailableHints({\n  availability,\n  messages,\n}: {\n  availability: Availability;\n  messages: NotificationMessages;\n}): JSX.Element | null {\n  const unavailable = NOTIFICATION_CHANNELS.filter((channel) => !availability[channel]);\n  if (unavailable.length === 0) return null;\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 0.5 }}>\n      {unavailable.map((channel) => (\n        <Text\n          key={channel}\n          variant=\"caption\"\n          size=\"xs\"\n          color=\"secondary\"\n          as=\"p\"\n          data-testid={`prefs-hint-${channel}`}\n        >\n          {messages.channelLabels[channel] ?? channel}:{' '}\n          {messages.channelUnavailableHints[channel] ?? ''}\n        </Text>\n      ))}\n    </Box>\n  );\n}\n\nexport interface PreferencesScreenProps {\n  /** Rendered under the lead paragraph — a \"back to account\" link, typically. */\n  footer?: JSX.Element;\n}\n\n/** Optimistic per-toggle auto-save; a failed PUT takes the server's answer. */\nfunction usePreferences(api: NotificationsApiClient): {\n  payload: PreferencesPayload | null;\n  toggle: (category: string, channel: NotificationChannel, enabled: boolean) => void;\n} {\n  const [payload, setPayload] = useState<PreferencesPayload | null>(null);\n\n  useEffect(() => {\n    let cancelled = false;\n    void api\n      .getPreferences()\n      .then((next) => {\n        if (!cancelled) setPayload(next);\n      })\n      .catch(() => undefined);\n    return () => {\n      cancelled = true;\n    };\n  }, [api]);\n\n  const toggle = useCallback(\n    (category: string, channel: NotificationChannel, enabled: boolean) => {\n      setPayload((current) => {\n        const row = current?.preferences[category];\n        if (!current || !row) return current;\n        return {\n          ...current,\n          preferences: { ...current.preferences, [category]: { ...row, [channel]: enabled } },\n        };\n      });\n      const reconcile = (): void => {\n        void api.getPreferences().then(setPayload).catch(() => undefined);\n      };\n      void api\n        .savePreference(category, channel, enabled)\n        .then((result) => {\n          // The PUT answers with the whole matrix, so a success REPLACES the\n          // optimistic guess with the server's own row — which is what catches a\n          // save the server merged differently from the way the screen assumed.\n          if (result.ok) setPayload(result.data);\n          else reconcile();\n        })\n        // The packaged transport never rejects (it folds a failure into\n        // `ok: false`), but a HOST transport may — and an unhandled rejection\n        // would leave the toggle showing a choice the server never took.\n        .catch(reconcile);\n    },\n    [api],\n  );\n\n  return { payload, toggle };\n}\n\nexport function PreferencesScreen({\n  footer,\n  api,\n  messages,\n  webPush,\n}: PreferencesScreenProps & {\n  api: NotificationsApiClient;\n  messages: NotificationMessages;\n  webPush: WebPushSetupConfig;\n}): JSX.Element {\n  const { payload, toggle } = usePreferences(api);\n\n  if (!payload) {\n    return (\n      <LoadingState\n        variant=\"spinner\"\n        message={messages.loadingMore}\n        size=\"md\"\n        dataTestId=\"notification-prefs-loading\"\n      />\n    );\n  }\n\n  const { preferences, availability, categories } = payload;\n  return (\n    <Box\n      component=\"section\"\n      data-testid=\"notification-prefs-view\"\n      sx={{\n        maxWidth: 640,\n        mx: 'auto',\n        width: '100%',\n        px: 2,\n        py: 4,\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 2,\n      }}\n    >\n      <Box>\n        <Text variant=\"heading\" size=\"lg\" as=\"h1\">\n          {messages.preferencesTitle}\n        </Text>\n        <Text variant=\"caption\" size=\"sm\" color=\"secondary\" as=\"p\">\n          {messages.preferencesLead} {footer}\n        </Text>\n      </Box>\n      <WebPushDeviceSetup\n        available={availability.WEB_PUSH}\n        api={api}\n        messages={messages}\n        config={webPush}\n      />\n      {categories.map((category) => (\n        <CategoryCard\n          key={category}\n          category={category}\n          channels={preferences[category] ?? {\n            EMAIL: false,\n            SMS: false,\n            WHATSAPP: false,\n            WEB_PUSH: false,\n          }}\n          availability={availability}\n          messages={messages}\n          onToggle={(channel, enabled) => toggle(category, channel, enabled)}\n        />\n      ))}\n      <UnavailableHints availability={availability} messages={messages} />\n    </Box>\n  );\n}\n","/**\n * The per-BROWSER Web Push enable step, which sits above the preference matrix\n * because a preference alone cannot reach a device that never subscribed.\n */\nimport { useEffect, useState, type JSX } from 'react';\n\nimport { Button } from '@12-apps/ui/form/Button';\nimport { Box } from '@12-apps/ui/mui/Box';\nimport { Text } from '@12-apps/ui/typography/Text';\n\nimport type { NotificationMessages } from '../messages';\n\nimport type { NotificationsApiClient } from './api';\nimport { enableWebPush, getExistingPushSubscription } from './web-push-client';\n\n/** The panel's copy for a host whose platform blocks browser-level push. */\nexport interface WebPushPlatformHint {\n  title: string;\n  body: string;\n}\n\nexport interface WebPushSetupConfig {\n  /**\n   * The host's service-worker path. Path-routed SPAs each control their own\n   * scope, and the file itself is the host's.\n   */\n  swPath?: string;\n  /**\n   * Whether THIS platform must be installed to the home screen before a\n   * subscription can exist at all.\n   *\n   * iOS is the case: Safari has no browser-level Web Push, so \"Ativar\" there\n   * asks no permission, creates no subscription, and fails with nothing a user\n   * could act on. The check is a config seam rather than a dependency because\n   * \"is this an installable iOS browser\" is a question a host's PWA layer\n   * already answers (the origin passes\n   * `() => isIosInstallable() && !isStandalone()` from `@12-apps/pwa`).\n   */\n  needsInstallFirst?: () => boolean;\n  /** What to say instead of the button when the check above is true. */\n  installHint?: WebPushPlatformHint;\n}\n\nconst cardSx = {\n  p: 2,\n  border: '1px solid',\n  borderColor: 'divider',\n  borderRadius: 2,\n} as const;\n\nfunction InstallFirstHint({ hint }: { hint: WebPushPlatformHint }): JSX.Element {\n  return (\n    <Box sx={cardSx} data-testid=\"web-push-install-hint\">\n      <Text variant=\"body\" size=\"sm\" weight=\"semibold\" as=\"p\">\n        {hint.title}\n      </Text>\n      <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"p\">\n        {hint.body}\n      </Text>\n    </Box>\n  );\n}\n\ntype SetupState = 'idle' | 'checking' | 'on' | 'busy' | 'failed' | 'denied';\n\n/**\n * \"Is this browser receiving alerts?\" — asked of the browser AND of the server.\n *\n * The browser alone is not enough, and answering from it alone is how a real\n * person is silenced while being told they are fine. Two users share a counter\n * PC: Ana enables push, then Otávio signs in on the same browser and enables it\n * too. `PushManager` hands out the SAME endpoint for the same browser profile,\n * so the POST re-owns the row and Ana's is gone. Ana signs back in, her browser\n * still holds the subscription object, and a browser-only check renders \"Este\n * navegador está recebendo alertas.\" with no button to fix it — forever. The\n * 404/410 prune reaches the same state from the other direction.\n *\n * So the server is asked whether it still has THIS endpoint under THIS user. A\n * `false` (or an unreachable server) shows *Ativar* again, and one click\n * re-registers the row — which is the same request the happy path makes, so the\n * recovery costs nothing to maintain.\n */\nasync function resolveState(api: NotificationsApiClient): Promise<SetupState> {\n  const subscription = await getExistingPushSubscription();\n  if (!subscription) return 'idle';\n  const registration = await api\n    .getPushRegistration({ endpoint: subscription.endpoint })\n    .catch(() => null);\n  return registration?.registered ? 'on' : 'idle';\n}\n\nfunction statusText(state: SetupState, messages: NotificationMessages): string {\n  if (state === 'on') return messages.devicePushOn;\n  if (state === 'denied') return messages.devicePushDenied;\n  if (state === 'failed') return messages.devicePushFailed;\n  return messages.devicePushIdle;\n}\n\nexport function WebPushDeviceSetup({\n  available,\n  api,\n  messages,\n  config,\n}: {\n  available: boolean;\n  api: NotificationsApiClient;\n  messages: NotificationMessages;\n  config: WebPushSetupConfig;\n}): JSX.Element | null {\n  const [state, setState] = useState<SetupState>('checking');\n  // Read once, at mount: neither can change without a new document.\n  const [needsInstall] = useState(() => config.needsInstallFirst?.() ?? false);\n\n  useEffect(() => {\n    let cancelled = false;\n    void resolveState(api).then((next) => {\n      if (!cancelled) setState(next);\n    });\n    return () => {\n      cancelled = true;\n    };\n  }, [api]);\n\n  if (!available) return null;\n  if (needsInstall && config.installHint) return <InstallFirstHint hint={config.installHint} />;\n\n  const enable = async (): Promise<void> => {\n    setState('busy');\n    const result = await enableWebPush(api, config.swPath);\n    if (result.ok) setState('on');\n    else setState(result.reason === 'permission-denied' ? 'denied' : 'failed');\n  };\n\n  return (\n    <Box\n      sx={{\n        ...cardSx,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        gap: 2,\n      }}\n      data-testid=\"web-push-device-setup\"\n    >\n      <Box sx={{ minWidth: 0 }}>\n        <Text variant=\"body\" size=\"sm\" weight=\"semibold\" as=\"p\">\n          {messages.devicePushTitle}\n        </Text>\n        <Text variant=\"caption\" size=\"xs\" color=\"secondary\" as=\"p\">\n          {statusText(state, messages)}\n        </Text>\n      </Box>\n      {state !== 'on' ? (\n        <Button\n          variant=\"outline\"\n          color=\"primary\"\n          size=\"sm\"\n          disabled={state === 'busy' || state === 'checking'}\n          onClick={() => void enable()}\n          dataTestId=\"web-push-enable\"\n        >\n          {state === 'busy' ? messages.devicePushEnabling : messages.devicePushEnable}\n        </Button>\n      ) : null}\n    </Box>\n  );\n}\n"],"mappings":"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","names":["useEffect","useState","Box","Text","jsx","jsxs","Box","Text","useState","useEffect"]}

package/dist/react/index.d.ts

@@ -1,7 +1,7 @@
-import { N as NotificationsApiClient } from '../create-web-notifications-Du3hTs7P.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-Du3hTs7P.js';
+import { N as NotificationsApiClient } from '../create-web-notifications-BHCzaU2y.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-BHCzaU2y.js';
 import { JSX } from 'react';
-import { N as NotificationMessages } from '../wire-5IRin4zH.js';
+import { N as NotificationMessages } from '../wire-6dzyfDE7.js';
 import '../types-CXLAG3UU.js';
 
 /** Inline SVG bell (no icon-library dependency in this package). */

package/dist/react/index.js

@@ -1,23 +1,29 @@
+import {
+  relativeTime
+} from "../chunk-O5BVUXPO.js";
+import {
+  disableWebPush,
+  enableWebPush,
+  getExistingPushSubscription,
+  pushSupported
+} from "../chunk-CQZMTFPY.js";
+import {
+  NotificationsHttpError,
+  createNotificationsApiClient,
+  createWebNotifications,
+  httpNotificationsTransport
+} from "../chunk-MMLV4EZT.js";
 import {
   BADGE_POLL_MS,
   BADGE_RECONCILE_MS,
   BellIcon,
-  NotificationsHttpError,
   PAGE_SIZE,
   createInboxStore,
-  createNotificationsApiClient,
-  createWebNotifications,
-  disableWebPush,
-  enableWebPush,
-  getExistingPushSubscription,
-  httpNotificationsTransport,
-  pushSupported,
-  relativeTime,
   useInboxList,
   useInboxState,
   useUnreadCount
-} from "../chunk-YE24MDS6.js";
-import "../chunk-4TTYQVPK.js";
+} from "../chunk-BW723CX2.js";
+import "../chunk-M2TVBVH2.js";
 import "../chunk-7QVYU63E.js";
 export {
   BADGE_POLL_MS,

package/dist/server/index.d.ts

@@ -1,11 +1,11 @@
-import { A as ApiNotifications } from '../create-api-notifications-CgBdjfyF.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-CgBdjfyF.js';
+import { A as ApiNotifications } from '../create-api-notifications-B3u6Kx3x.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-B3u6Kx3x.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-Cs14Wp9u.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-DhDjrAX5.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-BDZ7aGHV.js';
 import '../generators-B9xt3sRh.js';
 import '../types-CXLAG3UU.js';
-import '../wire-5IRin4zH.js';
+import '../wire-6dzyfDE7.js';
 import '@12-apps/wiring';
 
 /**

package/dist/server/index.js

@@ -4,7 +4,7 @@ import {
   NOTIFICATIONS_JOBS,
   NOTIFICATIONS_SWEEP_QUEUE,
   wireNotifyPort
-} from "../chunk-WU6QJLSZ.js";
+} from "../chunk-CUZW62JS.js";
 import {
   EMAIL_DRIVERS,
   NotificationProviderError,
@@ -25,9 +25,10 @@ import {
   smsTransport,
   webPushTransport,
   whatsAppTransport
-} from "../chunk-ORXJH3VM.js";
-import "../chunk-AHNRSA6U.js";
-import "../chunk-4TTYQVPK.js";
+} from "../chunk-WHBMPHQE.js";
+import "../chunk-HHMRCMQU.js";
+import "../chunk-XE7HZVMH.js";
+import "../chunk-M2TVBVH2.js";
 import "../chunk-7QVYU63E.js";
 export {
   EMAIL_DRIVERS,

package/dist/{wire-5IRin4zH.d.ts → wire-6dzyfDE7.d.ts}

@@ -83,7 +83,20 @@ interface NotificationMessages extends NotificationWireMessages {
     devicePushEnabling: string;
 }
 /**
- * The messages in force.
+ * What a copy field takes once its words can follow a reader.
+ *
+ * Declared here rather than imported from `@12-apps/i18n`: this package must
+ * stay liftable into a repo that has never heard of it, so the two agree
+ * STRUCTURALLY and nothing forces the dependency. The context is deliberately
+ * loose — a raw tag off the wire, unnarrowed — because matching it is the host
+ * resolver's job, not this package's.
+ */
+type NotificationsCopyResolver<T> = (context: {
+    readonly locale?: string | null;
+}) => T;
+type NotificationsCopySource<T> = T | NotificationsCopyResolver<T>;
+/**
+ * The messages in force, for ONE reader.
  *
  * A pass-through rather than a merge: there is nothing left to merge WITH, and
  * that is the point of the change. The old version spread the host's table over
@@ -94,11 +107,24 @@ interface NotificationMessages extends NotificationWireMessages {
  * the same screen.
  *
  * Kept as a function because all three mounts read it off a config object, and
- * because a later rule (a blank-string refusal, say) belongs in one place.
+ * because a later rule (a blank-string refusal, say) belongs in one place —
+ * which is exactly what made it the right place to put the RESOLUTION when the
+ * field learned to take a resolver.
+ *
+ * **Call it where the sentence is used.** `createApiNotifications` runs once
+ * per process, and at least one host memoises its call behind an `if
+ * (assembled) return assembled;`, so a value read there answers every later
+ * request in the language the process started with — and a single-locale host
+ * cannot tell the difference. The route handlers call it per request; the
+ * parsers below them keep taking a plain pack, so one request resolves exactly
+ * once and no helper can disagree with another about the language.
+ *
+ * The generic survives the widening: a host whose pack carries extra keys of
+ * its own still gets them back, resolver or not.
  */
 declare function messagesOf<T extends NotificationWireMessages>(config: {
-    messages: T;
-}): T;
+    messages: NotificationsCopySource<T>;
+}, locale?: string): T;
 
 /**
  * The preference POLICY, with no storage in it (12-15): which channels a
@@ -194,4 +220,4 @@ interface NotificationRow {
 /** Row → wire. Dates become ISO strings; a null `data` becomes `{}`. */
 declare function inboxWire(row: NotificationRow): InboxNotification;
 
-export { type ChannelMatrix as C, DEFAULT_CHANNEL_ROW as D, type InboxNotification as I, type ListNotificationsResult as L, type NotificationMessages as N, type ChannelRow as a, type NotificationRow as b, type NotificationWireMessages as c, defaultChannelMatrix as d, enabledChannelsOf as e, mergeStoredRow as f, messagesOf as g, inboxWire as i, mergeChoices as m };
+export { type ChannelMatrix as C, DEFAULT_CHANNEL_ROW as D, type InboxNotification as I, type ListNotificationsResult as L, type NotificationMessages as N, type ChannelRow as a, type NotificationRow as b, type NotificationWireMessages as c, defaultChannelMatrix as d, enabledChannelsOf as e, mergeStoredRow as f, messagesOf as g, type NotificationsCopySource as h, inboxWire as i, mergeChoices as m };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/notifications",
-  "version": "4.6.0",
+  "version": "4.7.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.",
@@ -51,7 +51,7 @@
     "prisma:sync:check": "node scripts/sync-notifications-schema.mjs --check"
   },
   "dependencies": {
-    "@12-apps/ui": "^6.10.0"
+    "@12-apps/ui": "^6.11.1"
   },
   "peerDependencies": {
     "@12-apps/wiring": ">=1.3.0",

package/src/messages.ts

@@ -85,7 +85,21 @@ export interface NotificationMessages extends NotificationWireMessages {
 }
 
 /**
- * The messages in force.
+ * What a copy field takes once its words can follow a reader.
+ *
+ * Declared here rather than imported from `@12-apps/i18n`: this package must
+ * stay liftable into a repo that has never heard of it, so the two agree
+ * STRUCTURALLY and nothing forces the dependency. The context is deliberately
+ * loose — a raw tag off the wire, unnarrowed — because matching it is the host
+ * resolver's job, not this package's.
+ */
+export type NotificationsCopyResolver<T> = (context: {
+  readonly locale?: string | null;
+}) => T;
+export type NotificationsCopySource<T> = T | NotificationsCopyResolver<T>;
+
+/**
+ * The messages in force, for ONE reader.
  *
  * A pass-through rather than a merge: there is nothing left to merge WITH, and
  * that is the point of the change. The old version spread the host's table over
@@ -96,8 +110,27 @@ export interface NotificationMessages extends NotificationWireMessages {
  * the same screen.
  *
  * Kept as a function because all three mounts read it off a config object, and
- * because a later rule (a blank-string refusal, say) belongs in one place.
+ * because a later rule (a blank-string refusal, say) belongs in one place —
+ * which is exactly what made it the right place to put the RESOLUTION when the
+ * field learned to take a resolver.
+ *
+ * **Call it where the sentence is used.** `createApiNotifications` runs once
+ * per process, and at least one host memoises its call behind an `if
+ * (assembled) return assembled;`, so a value read there answers every later
+ * request in the language the process started with — and a single-locale host
+ * cannot tell the difference. The route handlers call it per request; the
+ * parsers below them keep taking a plain pack, so one request resolves exactly
+ * once and no helper can disagree with another about the language.
+ *
+ * The generic survives the widening: a host whose pack carries extra keys of
+ * its own still gets them back, resolver or not.
  */
-export function messagesOf<T extends NotificationWireMessages>(config: { messages: T }): T {
-  return config.messages;
+export function messagesOf<T extends NotificationWireMessages>(
+  config: { messages: NotificationsCopySource<T> },
+  locale?: string,
+): T {
+  const source = config.messages;
+  return typeof source === 'function'
+    ? (source as NotificationsCopyResolver<T>)({ locale })
+    : source;
 }

package/src/react/create-web-notifications.tsx

@@ -10,8 +10,10 @@ import {
   type NotificationsSubscribe,
 } from './hooks';
 import { createInboxStore, type InboxStore } from './inbox-state';
-import { NotificationsPanel, type NotificationsPanelProps } from './panel';
-import { PreferencesScreen, type PreferencesScreenProps } from './preferences-screen';
+import { lazyNotificationsPanel } from './panel-lazy';
+import type { NotificationsPanelProps } from './panel';
+import { lazyPreferencesPage } from './page-lazy';
+import type { PreferencesScreenProps } from './preferences-screen';
 import { httpNotificationsTransport, type NotificationsTransport } from './transport';
 import type { WebPushSetupConfig } from './web-push-setup';
 
@@ -56,11 +58,22 @@ export interface NotificationsWebConfig {
 }
 
 export interface WebNotifications {
-  /** The routed surface: the preferences screen. */
+  /**
+   * The routed surface: the preferences screen.
+   *
+   * Loaded on demand — see `page-lazy.tsx`. A host that mounts only the bell and
+   * the panel never downloads it, and a host that routes to it fetches it while
+   * entering that route.
+   */
   page: ComponentType<PreferencesScreenProps>;
   /** The bell, already bound to the shared store. */
   BellButton: ComponentType<BellButtonProps>;
-  /** The inbox slide-over, sharing that store. */
+  /**
+   * The inbox slide-over, sharing that store.
+   *
+   * Loaded the first time it is opened — see `panel-lazy.tsx`. Until then a
+   * host's chrome carries the bell and nothing else.
+   */
   Panel: ComponentType<NotificationsPanelProps>;
   /**
    * Bell + panel as ONE element, for a host that just wants the feature in its
@@ -97,9 +110,7 @@ export function createWebNotifications(config: NotificationsWebConfig): WebNotif
   const Bell: ComponentType<BellButtonProps> = (props) => (
     <BellButton {...props} store={store} messages={messages} {...subscribeOption} />
   );
-  const Panel: ComponentType<NotificationsPanelProps> = (props) => (
-    <NotificationsPanel {...props} store={store} messages={messages} />
-  );
+  const Panel = lazyNotificationsPanel({ store, messages });
 
   function useBoundUnreadCount(options: { enabled?: boolean } = {}): number {
     return useUnreadCount(store, { ...options, ...subscribeOption });
@@ -126,9 +137,7 @@ export function createWebNotifications(config: NotificationsWebConfig): WebNotif
   }
 
   return {
-    page: (props) => (
-      <PreferencesScreen {...props} api={api} messages={messages} webPush={webPush} />
-    ),
+    page: lazyPreferencesPage({ api, messages, webPush }),
     BellButton: Bell,
     Panel,
     BellWithPanel,