@12-apps/notifications 4.7.0 → 4.7.1

package/dist/chunk-6HLHQDKS.js

@@ -1,1022 +0,0 @@
-import {
-  NOTIFICATION_CHANNELS,
-  messagesOf
-} from "./chunk-Y34FX24X.js";
-import {
-  __name
-} from "./chunk-7QVYU63E.js";
-
-// src/react/api.ts
-function createNotificationsApiClient(apiBase, transport) {
-  const base = apiBase.replace(/\/$/, "");
-  const url = /* @__PURE__ */ __name((path) => `${base}${path}`, "url");
-  return {
-    listNotifications({ cursor, limit, filter }) {
-      const params = new URLSearchParams();
-      if (limit !== void 0) params.set("limit", String(limit));
-      if (cursor) params.set("cursor", cursor);
-      if (filter) params.set("filter", filter);
-      const query = params.toString();
-      return transport.get(
-        url(`/notifications${query ? `?${query}` : ""}`)
-      );
-    },
-    async unreadCount() {
-      const { count } = await transport.get(
-        url("/notifications/unread-count")
-      );
-      return count;
-    },
-    markRead: /* @__PURE__ */ __name((ids) => transport.send(url("/notifications/mark-read"), "POST", { ids: [...ids] }), "markRead"),
-    markAllRead: /* @__PURE__ */ __name(() => transport.send(url("/notifications/mark-read"), "POST", { all: true }), "markAllRead"),
-    remove: /* @__PURE__ */ __name((ids) => transport.send(url("/notifications/delete"), "POST", { ids: [...ids] }), "remove"),
-    getPreferences: /* @__PURE__ */ __name(() => transport.get(url("/notification-preferences")), "getPreferences"),
-    savePreference: /* @__PURE__ */ __name((category, channel, enabled) => transport.send(url("/notification-preferences"), "PUT", {
-      [category]: { [channel]: enabled }
-    }), "savePreference"),
-    getPushRegistration: /* @__PURE__ */ __name(({ endpoint } = {}) => transport.get(
-      url(
-        endpoint ? `/push-subscriptions?endpoint=${encodeURIComponent(endpoint)}` : "/push-subscriptions"
-      )
-    ), "getPushRegistration"),
-    savePushSubscription: /* @__PURE__ */ __name((input) => transport.send(url("/push-subscriptions"), "POST", input), "savePushSubscription"),
-    removePushSubscription: /* @__PURE__ */ __name((endpoint) => transport.send(url("/push-subscriptions"), "DELETE", { endpoint }), "removePushSubscription")
-  };
-}
-__name(createNotificationsApiClient, "createNotificationsApiClient");
-
-// src/react/bell-icon.tsx
-import { Box } from "@12-apps/ui/mui/Box";
-import { jsx, jsxs } from "react/jsx-runtime";
-function BellIcon({
-  size = 28,
-  dim = false
-}) {
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      component: "svg",
-      viewBox: "0 0 24 24",
-      "aria-hidden": true,
-      sx: {
-        width: size,
-        height: size,
-        fill: "none",
-        stroke: "currentColor",
-        opacity: dim ? 0.4 : 1
-      },
-      strokeWidth: 1.8,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx("path", { d: "M6 9a6 6 0 0 1 12 0c0 5 2 6 2 6H4s2-1 2-6" }),
-        /* @__PURE__ */ jsx("path", { d: "M10 20a2 2 0 0 0 4 0" })
-      ]
-    }
-  );
-}
-__name(BellIcon, "BellIcon");
-
-// src/react/inbox-state.ts
-var PAGE_SIZE = 20;
-var BADGE_POLL_MS = 6e4;
-var BADGE_RECONCILE_MS = 3e5;
-var EMPTY = {
-  unread: 0,
-  items: [],
-  status: "idle",
-  nextCursor: null,
-  loadingMore: false
-};
-function patch(cell, next) {
-  cell.state = { ...cell.state, ...next };
-  for (const listener of cell.listeners) listener();
-}
-__name(patch, "patch");
-function refreshBadge(cell, api) {
-  void api.unreadCount().then((unread) => patch(cell, { unread })).catch(() => void 0);
-}
-__name(refreshBadge, "refreshBadge");
-function reloadList(cell, api) {
-  const token = cell.request += 1;
-  patch(cell, { status: cell.state.items.length > 0 ? cell.state.status : "pending" });
-  void api.listNotifications({ limit: PAGE_SIZE }).then((page) => {
-    if (token !== cell.request) return;
-    patch(cell, { items: page.items, nextCursor: page.nextCursor, status: "ready" });
-  }).catch(() => {
-    if (token !== cell.request) return;
-    patch(cell, { status: "error" });
-  });
-}
-__name(reloadList, "reloadList");
-function invalidate(cell, api) {
-  refreshBadge(cell, api);
-  if (cell.state.status !== "idle") reloadList(cell, api);
-}
-__name(invalidate, "invalidate");
-function write(cell, api, apply, send) {
-  apply();
-  void send().then((result) => {
-    if (!result.ok) invalidate(cell, api);
-  }).catch(() => invalidate(cell, api));
-}
-__name(write, "write");
-function bumpUnread(cell, delta) {
-  patch(cell, { unread: Math.max(0, cell.state.unread + delta) });
-}
-__name(bumpUnread, "bumpUnread");
-function loadMore(cell, api) {
-  const cursor = cell.state.nextCursor;
-  if (!cursor || cell.state.loadingMore) return;
-  patch(cell, { loadingMore: true });
-  void api.listNotifications({ cursor, limit: PAGE_SIZE }).then((page) => {
-    patch(cell, {
-      items: [...cell.state.items, ...page.items],
-      nextCursor: page.nextCursor,
-      loadingMore: false
-    });
-  }).catch(() => patch(cell, { loadingMore: false }));
-}
-__name(loadMore, "loadMore");
-function markRead(cell, api, ids) {
-  const readAt = (/* @__PURE__ */ new Date()).toISOString();
-  let flipped = 0;
-  const items = cell.state.items.map((item) => {
-    if (!ids.includes(item.id) || item.readAt !== null) return item;
-    flipped += 1;
-    return { ...item, readAt };
-  });
-  if (flipped === 0) return;
-  write(
-    cell,
-    api,
-    () => {
-      patch(cell, { items });
-      bumpUnread(cell, -flipped);
-    },
-    () => api.markRead(ids)
-  );
-}
-__name(markRead, "markRead");
-function remove(cell, api, id) {
-  const target = cell.state.items.find((item) => item.id === id);
-  if (!target) return;
-  const items = cell.state.items.filter((item) => item.id !== id);
-  write(
-    cell,
-    api,
-    () => {
-      patch(cell, { items });
-      if (target.readAt === null) bumpUnread(cell, -1);
-    },
-    () => api.remove([id])
-  );
-}
-__name(remove, "remove");
-function createInboxStore(api) {
-  const cell = { state: EMPTY, listeners: /* @__PURE__ */ new Set(), request: 0 };
-  return {
-    getState: /* @__PURE__ */ __name(() => cell.state, "getState"),
-    subscribe(listener) {
-      cell.listeners.add(listener);
-      return () => cell.listeners.delete(listener);
-    },
-    open() {
-      if (cell.state.status === "idle") reloadList(cell, api);
-    },
-    refreshBadge: /* @__PURE__ */ __name(() => refreshBadge(cell, api), "refreshBadge"),
-    invalidate: /* @__PURE__ */ __name(() => invalidate(cell, api), "invalidate"),
-    loadMore: /* @__PURE__ */ __name(() => loadMore(cell, api), "loadMore"),
-    markRead: /* @__PURE__ */ __name((ids) => markRead(cell, api, ids), "markRead"),
-    markAllRead() {
-      const readAt = (/* @__PURE__ */ new Date()).toISOString();
-      const items = cell.state.items.map((item) => ({ ...item, readAt: item.readAt ?? readAt }));
-      write(
-        cell,
-        api,
-        () => patch(cell, { items, unread: 0 }),
-        () => api.markAllRead()
-      );
-    },
-    remove: /* @__PURE__ */ __name((id) => remove(cell, api, id), "remove")
-  };
-}
-__name(createInboxStore, "createInboxStore");
-
-// src/react/hooks.ts
-import { useEffect, useSyncExternalStore } from "react";
-function useInboxState(store) {
-  return useSyncExternalStore(store.subscribe, store.getState, store.getState);
-}
-__name(useInboxState, "useInboxState");
-function useUnreadCount(store, options = {}) {
-  const enabled = options.enabled ?? true;
-  const subscribe = options.subscribe;
-  const { unread } = useInboxState(store);
-  options.useSignal?.(() => {
-    if (enabled) store.invalidate();
-  });
-  useEffect(() => {
-    if (!enabled) return;
-    store.refreshBadge();
-    const unsubscribe = subscribe?.(() => store.invalidate());
-    const interval = setInterval(
-      () => store.refreshBadge(),
-      subscribe ? BADGE_RECONCILE_MS : BADGE_POLL_MS
-    );
-    const onFocus = /* @__PURE__ */ __name(() => store.refreshBadge(), "onFocus");
-    globalThis.addEventListener?.("focus", onFocus);
-    return () => {
-      clearInterval(interval);
-      globalThis.removeEventListener?.("focus", onFocus);
-      unsubscribe?.();
-    };
-  }, [store, enabled, subscribe]);
-  return enabled ? unread : 0;
-}
-__name(useUnreadCount, "useUnreadCount");
-function useInboxList(store, open) {
-  const state = useInboxState(store);
-  useEffect(() => {
-    if (open) store.open();
-  }, [store, open]);
-  return state;
-}
-__name(useInboxList, "useInboxList");
-
-// src/react/relative-time.ts
-function relativeTime(iso, messages) {
-  const elapsedMs = Date.now() - new Date(iso).getTime();
-  const minutes = Math.round(elapsedMs / 6e4);
-  if (minutes < 1) return messages.justNow;
-  if (minutes < 60) return messages.minutesAgo(minutes);
-  const hours = Math.round(minutes / 60);
-  if (hours < 24) return messages.hoursAgo(hours);
-  const days = Math.round(hours / 24);
-  if (days < 7) return messages.daysAgo(days);
-  return new Date(iso).toLocaleDateString(messages.dateLocale);
-}
-__name(relativeTime, "relativeTime");
-
-// src/react/web-push-client.ts
-function base64UrlToUint8Array(base64Url) {
-  const padding = "=".repeat((4 - base64Url.length % 4) % 4);
-  const base64 = (base64Url + padding).replaceAll("-", "+").replaceAll("_", "/");
-  const raw = atob(base64);
-  return Uint8Array.from(raw, (char) => char.charCodeAt(0));
-}
-__name(base64UrlToUint8Array, "base64UrlToUint8Array");
-function pushSupported() {
-  return typeof navigator !== "undefined" && "serviceWorker" in navigator && typeof window !== "undefined" && "PushManager" in window && "Notification" in window;
-}
-__name(pushSupported, "pushSupported");
-async function getExistingPushSubscription() {
-  if (!pushSupported()) return null;
-  const registration = await navigator.serviceWorker.getRegistration();
-  if (!registration) return null;
-  return registration.pushManager.getSubscription();
-}
-__name(getExistingPushSubscription, "getExistingPushSubscription");
-async function obtainSubscription(swPath, vapidPublicKey) {
-  const registration = await navigator.serviceWorker.register(swPath);
-  await navigator.serviceWorker.ready;
-  return await registration.pushManager.getSubscription() ?? registration.pushManager.subscribe({
-    userVisibleOnly: true,
-    applicationServerKey: base64UrlToUint8Array(vapidPublicKey)
-  });
-}
-__name(obtainSubscription, "obtainSubscription");
-async function persist(api, subscription) {
-  const json = subscription.toJSON();
-  if (!json.endpoint || !json.keys?.p256dh || !json.keys.auth) {
-    return { ok: false, reason: "error" };
-  }
-  const saved = await api.savePushSubscription({
-    endpoint: json.endpoint,
-    keys: { p256dh: json.keys.p256dh, auth: json.keys.auth }
-  });
-  return saved.ok ? { ok: true } : { ok: false, reason: "error" };
-}
-__name(persist, "persist");
-async function enableWebPush(api, swPath = "/sw.js") {
-  if (!pushSupported()) return { ok: false, reason: "unsupported" };
-  const registration = await api.getPushRegistration().catch(() => null);
-  if (!registration?.vapidPublicKey) return { ok: false, reason: "unconfigured" };
-  const permission = await Notification.requestPermission();
-  if (permission !== "granted") return { ok: false, reason: "permission-denied" };
-  try {
-    return await persist(
-      api,
-      await obtainSubscription(swPath, registration.vapidPublicKey)
-    );
-  } catch {
-    return { ok: false, reason: "error" };
-  }
-}
-__name(enableWebPush, "enableWebPush");
-async function disableWebPush(api) {
-  const subscription = await getExistingPushSubscription();
-  if (!subscription) return;
-  const endpoint = subscription.endpoint;
-  await subscription.unsubscribe().catch(() => false);
-  await api.removePushSubscription(endpoint).catch(() => void 0);
-}
-__name(disableWebPush, "disableWebPush");
-
-// src/react/transport.ts
-var NotificationsHttpError = class _NotificationsHttpError extends Error {
-  static {
-    __name(this, "NotificationsHttpError");
-  }
-  status;
-  constructor(status, message) {
-    super(message);
-    this.name = "NotificationsHttpError";
-    this.status = status;
-    Object.setPrototypeOf(this, _NotificationsHttpError.prototype);
-  }
-};
-function httpNotificationsTransport(fallbackError) {
-  return {
-    async get(path) {
-      const response = await fetch(path, {
-        credentials: "same-origin",
-        headers: { Accept: "application/json" }
-      });
-      const payload = await response.json().catch(() => null);
-      if (!response.ok) {
-        throw new NotificationsHttpError(
-          response.status,
-          payload?.error ?? `HTTP ${response.status} for ${path}`
-        );
-      }
-      return payload?.data ?? payload;
-    },
-    async send(path, method, body) {
-      try {
-        const response = await fetch(path, {
-          method,
-          credentials: "same-origin",
-          headers: {
-            Accept: "application/json",
-            ...body === void 0 ? {} : { "Content-Type": "application/json" }
-          },
-          ...body === void 0 ? {} : { body: JSON.stringify(body) }
-        });
-        if (response.status === 204) return { ok: true, data: void 0 };
-        const payload = await response.json().catch(() => null);
-        if (!response.ok) return { ok: false, error: payload?.error ?? fallbackError };
-        return { ok: true, data: payload?.data ?? payload };
-      } catch {
-        return { ok: false, error: fallbackError };
-      }
-    }
-  };
-}
-__name(httpNotificationsTransport, "httpNotificationsTransport");
-
-// src/react/create-web-notifications.tsx
-import { useState as useState3 } from "react";
-
-// src/react/bell-button.tsx
-import { Badge } from "@12-apps/ui/data-display/Badge";
-import { Box as Box2 } from "@12-apps/ui/mui/Box";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var triggerSx = {
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-  p: 0.5,
-  border: "none",
-  background: "none",
-  cursor: "pointer",
-  color: "text.primary",
-  lineHeight: 0,
-  "& *": { cursor: "pointer" },
-  "&:hover": { color: "primary.main" },
-  "&:focus-visible": {
-    outline: "2px solid",
-    outlineColor: "primary.main",
-    outlineOffset: "2px",
-    borderRadius: "50%"
-  }
-};
-function BellButton({
-  onClick,
-  enabled = true,
-  store,
-  messages,
-  subscribe,
-  useSignal
-}) {
-  const count = useUnreadCount(store, {
-    enabled,
-    ...subscribe ? { subscribe } : {},
-    ...useSignal ? { useSignal } : {}
-  });
-  return /* @__PURE__ */ jsx2(
-    Box2,
-    {
-      component: "button",
-      type: "button",
-      onClick,
-      "aria-label": count > 0 ? messages.openBellWithUnread(count) : messages.openBell,
-      "data-testid": "notifications-bell",
-      sx: triggerSx,
-      children: /* @__PURE__ */ jsx2(
-        Badge,
-        {
-          content: count > 0 ? count : void 0,
-          color: "primary",
-          variant: "count",
-          max: 99,
-          "data-testid": "notifications-badge",
-          children: /* @__PURE__ */ jsx2(BellIcon, { size: 28 })
-        }
-      )
-    }
-  );
-}
-__name(BellButton, "BellButton");
-
-// src/react/panel.tsx
-import { useCallback } from "react";
-import { EmptyState } from "@12-apps/ui/data-display/EmptyState";
-import { LoadingState } from "@12-apps/ui/data-display/LoadingState";
-import { Button as Button2 } from "@12-apps/ui/form/Button";
-import { Drawer, DrawerContent, DrawerHeader } from "@12-apps/ui/layout/Drawer";
-import { Box as Box4 } from "@12-apps/ui/mui/Box";
-import { useMediaQuery } from "@12-apps/ui/mui/useMediaQuery";
-import { useTheme } from "@12-apps/ui/mui/styles";
-
-// src/react/row.tsx
-import { Button } from "@12-apps/ui/form/Button";
-import { Box as Box3 } from "@12-apps/ui/mui/Box";
-import { alpha } from "@12-apps/ui/mui/styles";
-import { Text } from "@12-apps/ui/typography/Text";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var contentButtonSx = {
-  flex: 1,
-  minWidth: 0,
-  display: "flex",
-  flexDirection: "column",
-  gap: 0.25,
-  textAlign: "left",
-  border: "none",
-  background: "none",
-  p: 0,
-  cursor: "pointer",
-  color: "text.primary",
-  fontFamily: "inherit"
-};
-var unreadDotSx = {
-  width: 8,
-  height: 8,
-  borderRadius: "50%",
-  bgcolor: "primary.main",
-  flex: "0 0 auto"
-};
-function NotificationRow({
-  notification,
-  messages,
-  onOpen,
-  onDelete
-}) {
-  const unread = notification.readAt === null;
-  return /* @__PURE__ */ jsxs2(
-    Box3,
-    {
-      "data-testid": `notification-${notification.id}`,
-      sx: {
-        display: "flex",
-        alignItems: "flex-start",
-        gap: 1,
-        py: 1.5,
-        px: 1,
-        borderBottom: "1px solid",
-        borderColor: "divider",
-        bgcolor: unread ? (t) => alpha(t.palette.primary.main, 0.06) : "transparent"
-      },
-      children: [
-        /* @__PURE__ */ jsxs2(
-          Box3,
-          {
-            component: "button",
-            type: "button",
-            onClick: () => onOpen(notification),
-            "aria-label": unread ? `${notification.title} (${messages.unreadSuffix})` : notification.title,
-            sx: contentButtonSx,
-            children: [
-              /* @__PURE__ */ jsxs2(Box3, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-                unread ? /* @__PURE__ */ jsx3(Box3, { "aria-hidden": true, sx: unreadDotSx }) : null,
-                /* @__PURE__ */ jsx3(Text, { variant: "body", size: "sm", weight: unread ? "bold" : "medium", as: "span", children: notification.title })
-              ] }),
-              /* @__PURE__ */ jsx3(Text, { variant: "caption", size: "xs", color: "secondary", as: "span", children: notification.body }),
-              /* @__PURE__ */ jsx3(Text, { variant: "caption", size: "xs", color: "secondary", as: "span", italic: true, children: relativeTime(notification.createdAt, messages) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx3(
-          Button,
-          {
-            variant: "ghost",
-            color: "neutral",
-            size: "xs",
-            "aria-label": messages.deleteOne(notification.title),
-            onClick: () => onDelete(notification.id),
-            dataTestId: `notification-delete-${notification.id}`,
-            children: "\u2715"
-          }
-        )
-      ]
-    }
-  );
-}
-__name(NotificationRow, "NotificationRow");
-
-// src/react/panel.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function PanelBody({
-  state,
-  messages,
-  onRetry,
-  onLoadMore,
-  onOpen,
-  onDelete
-}) {
-  if (state.status === "pending" || state.status === "idle") {
-    return /* @__PURE__ */ jsx4(
-      LoadingState,
-      {
-        variant: "spinner",
-        message: messages.loading,
-        size: "md",
-        dataTestId: "notifications-loading"
-      }
-    );
-  }
-  if (state.status === "error") {
-    return /* @__PURE__ */ jsx4(
-      EmptyState,
-      {
-        variant: "minimal",
-        title: messages.loadFailedTitle,
-        description: messages.loadFailedBody,
-        onRefresh: onRetry,
-        refreshLabel: messages.retry,
-        dataTestId: "notifications-error"
-      }
-    );
-  }
-  if (state.items.length === 0) {
-    return /* @__PURE__ */ jsx4(
-      EmptyState,
-      {
-        variant: "illustrated",
-        illustration: /* @__PURE__ */ jsx4(BellIcon, { size: 44, dim: true }),
-        title: messages.emptyTitle,
-        description: messages.emptyBody,
-        dataTestId: "notifications-empty"
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs3(Box4, { children: [
-    state.items.map((notification) => /* @__PURE__ */ jsx4(
-      NotificationRow,
-      {
-        notification,
-        messages,
-        onOpen,
-        onDelete
-      },
-      notification.id
-    )),
-    state.nextCursor ? /* @__PURE__ */ jsx4(Box4, { sx: { display: "flex", justifyContent: "center", py: 1.5 }, children: /* @__PURE__ */ jsx4(
-      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 NotificationsPanel({
-  open,
-  onClose,
-  onNavigate,
-  store,
-  messages
-}) {
-  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);
-  return /* @__PURE__ */ jsxs3(
-    Drawer,
-    {
-      open,
-      onClose,
-      anchor: "right",
-      variant: "right",
-      width: isMobile ? "100vw" : 400,
-      dataTestId: "notifications-panel",
-      children: [
-        /* @__PURE__ */ jsx4(DrawerHeader, { onClose, children: messages.panelTitle }),
-        /* @__PURE__ */ jsxs3(DrawerContent, { children: [
-          hasUnread ? /* @__PURE__ */ jsx4(Box4, { sx: { display: "flex", justifyContent: "flex-end", pb: 1 }, children: /* @__PURE__ */ jsx4(
-            Button2,
-            {
-              variant: "ghost",
-              color: "primary",
-              size: "xs",
-              onClick: () => store.markAllRead(),
-              dataTestId: "notifications-mark-all-read",
-              children: messages.markAllRead
-            }
-          ) }) : null,
-          /* @__PURE__ */ jsx4(
-            PanelBody,
-            {
-              state,
-              messages,
-              onRetry: () => store.invalidate(),
-              onLoadMore: () => store.loadMore(),
-              onOpen: openNotification,
-              onDelete: (id) => store.remove(id)
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
-__name(NotificationsPanel, "NotificationsPanel");
-
-// src/react/preferences-screen.tsx
-import { useCallback as useCallback2, useEffect as useEffect3, useState as useState2 } from "react";
-import { LoadingState as LoadingState2 } from "@12-apps/ui/data-display/LoadingState";
-import { Switch } from "@12-apps/ui/form/Switch";
-import { Box as Box6 } from "@12-apps/ui/mui/Box";
-import { Text as Text3 } from "@12-apps/ui/typography/Text";
-
-// src/react/web-push-setup.tsx
-import { useEffect as useEffect2, useState } from "react";
-import { Button as Button3 } from "@12-apps/ui/form/Button";
-import { Box as Box5 } from "@12-apps/ui/mui/Box";
-import { Text as Text2 } from "@12-apps/ui/typography/Text";
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var cardSx = {
-  p: 2,
-  border: "1px solid",
-  borderColor: "divider",
-  borderRadius: 2
-};
-function InstallFirstHint({ hint }) {
-  return /* @__PURE__ */ jsxs4(Box5, { sx: cardSx, "data-testid": "web-push-install-hint", children: [
-    /* @__PURE__ */ jsx5(Text2, { variant: "body", size: "sm", weight: "semibold", as: "p", children: hint.title }),
-    /* @__PURE__ */ jsx5(Text2, { 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);
-  useEffect2(() => {
-    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__ */ jsx5(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__ */ jsxs4(
-    Box5,
-    {
-      sx: {
-        ...cardSx,
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "space-between",
-        gap: 2
-      },
-      "data-testid": "web-push-device-setup",
-      children: [
-        /* @__PURE__ */ jsxs4(Box5, { sx: { minWidth: 0 }, children: [
-          /* @__PURE__ */ jsx5(Text2, { variant: "body", size: "sm", weight: "semibold", as: "p", children: messages.devicePushTitle }),
-          /* @__PURE__ */ jsx5(Text2, { variant: "caption", size: "xs", color: "secondary", as: "p", children: statusText(state, messages) })
-        ] }),
-        state !== "on" ? /* @__PURE__ */ jsx5(
-          Button3,
-          {
-            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 jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-function CategoryCard({
-  category,
-  channels,
-  availability,
-  messages,
-  onToggle
-}) {
-  const labels = messages.categoryLabels[category];
-  return /* @__PURE__ */ jsxs5(
-    Box6,
-    {
-      sx: { p: 2, border: "1px solid", borderColor: "divider", borderRadius: 2 },
-      "data-testid": `prefs-${category}`,
-      children: [
-        /* @__PURE__ */ jsx6(Text3, { variant: "body", size: "sm", weight: "semibold", as: "p", children: labels?.title ?? messages.categoryFallbackTitle(category) }),
-        labels?.description ? /* @__PURE__ */ jsx6(Text3, { variant: "caption", size: "xs", color: "secondary", as: "p", children: labels.description }) : null,
-        /* @__PURE__ */ jsx6(
-          Box6,
-          {
-            sx: {
-              mt: 1.5,
-              display: "grid",
-              gridTemplateColumns: { xs: "1fr 1fr", sm: "repeat(4, 1fr)" },
-              gap: 1
-            },
-            children: NOTIFICATION_CHANNELS.map((channel) => /* @__PURE__ */ jsx6(
-              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__ */ jsx6(Box6, { sx: { display: "flex", flexDirection: "column", gap: 0.5 }, children: unavailable.map((channel) => /* @__PURE__ */ jsxs5(
-    Text3,
-    {
-      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);
-  useEffect3(() => {
-    let cancelled = false;
-    void api.getPreferences().then((next) => {
-      if (!cancelled) setPayload(next);
-    }).catch(() => void 0);
-    return () => {
-      cancelled = true;
-    };
-  }, [api]);
-  const toggle = useCallback2(
-    (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__ */ jsx6(
-      LoadingState2,
-      {
-        variant: "spinner",
-        message: messages.loadingMore,
-        size: "md",
-        dataTestId: "notification-prefs-loading"
-      }
-    );
-  }
-  const { preferences, availability, categories } = payload;
-  return /* @__PURE__ */ jsxs5(
-    Box6,
-    {
-      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__ */ jsxs5(Box6, { children: [
-          /* @__PURE__ */ jsx6(Text3, { variant: "heading", size: "lg", as: "h1", children: messages.preferencesTitle }),
-          /* @__PURE__ */ jsxs5(Text3, { variant: "caption", size: "sm", color: "secondary", as: "p", children: [
-            messages.preferencesLead,
-            " ",
-            footer
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx6(
-          WebPushDeviceSetup,
-          {
-            available: availability.WEB_PUSH,
-            api,
-            messages,
-            config: webPush
-          }
-        ),
-        categories.map((category) => /* @__PURE__ */ jsx6(
-          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__ */ jsx6(UnavailableHints, { availability, messages })
-      ]
-    }
-  );
-}
-__name(PreferencesScreen, "PreferencesScreen");
-
-// src/react/create-web-notifications.tsx
-import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-function createWebNotifications(config) {
-  const messages = messagesOf(config);
-  const api = createNotificationsApiClient(
-    config.apiBase,
-    config.transport ?? httpNotificationsTransport(messages.operationFailed)
-  );
-  const store = createInboxStore(api);
-  const webPush = config.webPush ?? {};
-  const subscribe = config.subscribe;
-  const subscribeOption = {
-    ...subscribe ? { subscribe } : {},
-    ...config.useSignal ? { useSignal: config.useSignal } : {}
-  };
-  const Bell = /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsx7(BellButton, { ...props, store, messages, ...subscribeOption }), "Bell");
-  const Panel = /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsx7(NotificationsPanel, { ...props, store, messages }), "Panel");
-  function useBoundUnreadCount(options = {}) {
-    return useUnreadCount(store, { ...options, ...subscribeOption });
-  }
-  __name(useBoundUnreadCount, "useBoundUnreadCount");
-  function BellWithPanel({
-    enabled = true,
-    onNavigate
-  }) {
-    const [open, setOpen] = useState3(false);
-    return /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx7(Bell, { enabled, onClick: () => setOpen(true) }),
-      /* @__PURE__ */ jsx7(
-        Panel,
-        {
-          open,
-          onClose: () => setOpen(false),
-          ...onNavigate ? { onNavigate } : {}
-        }
-      )
-    ] });
-  }
-  __name(BellWithPanel, "BellWithPanel");
-  return {
-    page: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsx7(PreferencesScreen, { ...props, api, messages, webPush }), "page"),
-    BellButton: Bell,
-    Panel,
-    BellWithPanel,
-    useUnreadCount: useBoundUnreadCount,
-    store,
-    api,
-    messages
-  };
-}
-__name(createWebNotifications, "createWebNotifications");
-
-export {
-  createNotificationsApiClient,
-  BellIcon,
-  PAGE_SIZE,
-  BADGE_POLL_MS,
-  BADGE_RECONCILE_MS,
-  createInboxStore,
-  useInboxState,
-  useUnreadCount,
-  useInboxList,
-  relativeTime,
-  pushSupported,
-  getExistingPushSubscription,
-  enableWebPush,
-  disableWebPush,
-  NotificationsHttpError,
-  httpNotificationsTransport,
-  createWebNotifications
-};
-//# sourceMappingURL=chunk-6HLHQDKS.js.map