@voyantjs/notifications-react 0.106.0 → 0.107.0

package/README.md

@@ -0,0 +1,30 @@
+# @voyantjs/notifications-react
+
+The notifications client tier: headless data hooks/clients plus the styled UI
+components and admin pages (formerly `@voyantjs/notifications-ui`).
+
+Headless consumers import from the root, `./hooks`, or `./client` — these pull
+no styling peers. Styled surfaces live under `./ui`, `./components/*`,
+`./admin`, `./i18n`, and `./styles.css`, whose heavier peers (`@voyantjs/ui`,
+`@voyantjs/admin`, `lucide-react`, `react-hook-form`) are optional and only
+needed when you import those subpaths.
+
+React components for Voyant notifications: reminder sequence editor (stages + channels), notification settings, and preview.
+
+## Install
+
+```bash
+pnpm add @voyantjs/notifications-react @voyantjs/ui @tanstack/react-query react react-dom
+```
+
+```ts
+import "@voyantjs/notifications-react/styles.css"
+```
+
+## Components
+
+- `<StageList />` — reminder rule's ordered stages with reorder + delete.
+- `<StageEditorDialog />` — create / edit a stage (anchor, window, cadence).
+- `<StageChannelEditorDialog />` — create / edit a channel under a stage.
+- `<NotificationSettingsForm />` — quiet hours, blackout dates, weekend skip, recipient rate limit, suppression window.
+- `<RemindersPreviewList />` — what would fire on a given date with reasoning.

package/dist/admin/index.d.ts

@@ -0,0 +1,82 @@
+import { type AdminExtension } from "@voyantjs/admin";
+/**
+ * Semantic destinations the notifications admin surfaces navigate to
+ * (packaged-admin RFC §4.7): the templates list/detail pair (list rows and
+ * the detail page's back link) and the reminder rules list/detail pair
+ * (the per-rule "Manage stages" link and the stage editor's back link).
+ * All shapes are closed, so they are declared here directly.
+ */
+declare module "@voyantjs/admin" {
+    interface AdminDestinations {
+        /** The notification templates list page. */
+        "notificationTemplate.list": Record<string, never>;
+        /** A notification template's detail page. */
+        "notificationTemplate.detail": {
+            templateId: string;
+        };
+        /** The reminder rules list page. */
+        "notificationReminderRule.list": Record<string, never>;
+        /** A reminder rule's detail page (stage sequence editor). */
+        "notificationReminderRule.detail": {
+            ruleId: string;
+        };
+    }
+}
+export { NotificationDeliveriesHost } from "./notification-deliveries-host.js";
+export { NotificationDeliveryDetailDialog } from "./notification-delivery-detail-dialog.js";
+export { NotificationReminderRuleDetailHost, type NotificationReminderRuleDetailHostProps, } from "./notification-reminder-rule-detail-host.js";
+export { NotificationReminderRuleDialog } from "./notification-reminder-rule-dialog.js";
+export { NotificationReminderRulesHost } from "./notification-reminder-rules-host.js";
+export { NotificationReminderRunsHost } from "./notification-reminder-runs-host.js";
+export { NotificationSettingsHost } from "./notification-settings-host.js";
+export { NotificationTemplateAuthoringHelp } from "./notification-template-authoring-help.js";
+export { NotificationTemplateDetailHost, type NotificationTemplateDetailHostProps, } from "./notification-template-detail-host.js";
+export { NotificationTemplateDialog } from "./notification-template-dialog.js";
+export { NotificationTemplatesHost } from "./notification-templates-host.js";
+export { RemindersPreviewHost } from "./reminders-preview-host.js";
+export interface CreateNotificationsAdminExtensionOptions {
+    /** Mount path of the notifications pages inside the admin workspace. Default `/notifications`. */
+    basePath?: string;
+    /** Localized page titles. Defaults are the English operator nav labels. */
+    labels?: {
+        templates?: string;
+        reminderRules?: string;
+        deliveries?: string;
+        reminderRuns?: string;
+        preview?: string;
+        settings?: string;
+    };
+}
+/**
+ * The notifications admin contribution (packaged-admin RFC Phase 3,
+ * `@voyantjs/<domain>-ui/admin` convention).
+ *
+ * NAVIGATION: deliberately none. The Notifications nav group (templates,
+ * reminder rules, deliveries, reminder runs, preview, settings) is part of
+ * the BASE operator navigation — see `createOperatorAdminNavigation` in
+ * `@voyantjs/admin` — so contributing nav entries here would duplicate
+ * them. If the base nav ever drops the notifications group, this extension
+ * is where the entries move.
+ *
+ * ROUTES: contributions are metadata only — the notifications pages keep
+ * their filter state component-local, so there are no URL search contracts.
+ * The PAGES are package-owned: {@link NotificationTemplatesHost},
+ * {@link NotificationReminderRulesHost}, {@link NotificationDeliveriesHost},
+ * {@link NotificationReminderRunsHost}, {@link RemindersPreviewHost} and
+ * {@link NotificationSettingsHost} are zero-prop;
+ * {@link NotificationTemplateDetailHost} and
+ * {@link NotificationReminderRuleDetailHost} bind the detail pages to their
+ * data wiring and resolve every cross-route link through the semantic
+ * destinations declared above. `component:` is intentionally NOT attached
+ * to these contributions yet: the contribution contract renders zero-prop
+ * pages (route components read params via the router, per RFC §4.2), while
+ * the detail hosts take the record id as a prop. Host route files stay the
+ * thin binding layer (`Route.useParams()` → host props) until the §4.2
+ * code-based route assembly gives packaged pages a router-agnostic way to
+ * read route state.
+ *
+ * WIDGETS: none today. No cross-domain notifications card is slot-mounted —
+ * deliveries shown on other domains' detail pages are those hosts' concern.
+ */
+export declare function createNotificationsAdminExtension(options?: CreateNotificationsAdminExtensionOptions): AdminExtension;
+//# sourceMappingURL=index.d.ts.map

package/dist/admin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/admin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAwB,MAAM,iBAAiB,CAAA;AAE3E;;;;;;GAMG;AACH,OAAO,QAAQ,iBAAiB,CAAC;IAC/B,UAAU,iBAAiB;QACzB,4CAA4C;QAC5C,2BAA2B,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;QAClD,6CAA6C;QAC7C,6BAA6B,EAAE;YAAE,UAAU,EAAE,MAAM,CAAA;SAAE,CAAA;QACrD,oCAAoC;QACpC,+BAA+B,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;QACtD,6DAA6D;QAC7D,iCAAiC,EAAE;YAAE,MAAM,EAAE,MAAM,CAAA;SAAE,CAAA;KACtD;CACF;AAKD,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAA;AAC9E,OAAO,EAAE,gCAAgC,EAAE,MAAM,0CAA0C,CAAA;AAC3F,OAAO,EACL,kCAAkC,EAClC,KAAK,uCAAuC,GAC7C,MAAM,6CAA6C,CAAA;AACpD,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAA;AACvF,OAAO,EAAE,6BAA6B,EAAE,MAAM,uCAAuC,CAAA;AACrF,OAAO,EAAE,4BAA4B,EAAE,MAAM,sCAAsC,CAAA;AACnF,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAA;AAC1E,OAAO,EAAE,iCAAiC,EAAE,MAAM,2CAA2C,CAAA;AAC7F,OAAO,EACL,8BAA8B,EAC9B,KAAK,mCAAmC,GACzC,MAAM,wCAAwC,CAAA;AAC/C,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAA;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,kCAAkC,CAAA;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAElE,MAAM,WAAW,wCAAwC;IACvD,kGAAkG;IAClG,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,2EAA2E;IAC3E,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,aAAa,CAAC,EAAE,MAAM,CAAA;QACtB,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,QAAQ,CAAC,EAAE,MAAM,CAAA;KAClB,CAAA;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,iCAAiC,CAC/C,OAAO,GAAE,wCAA6C,GACrD,cAAc,CAwDhB"}

package/dist/admin/index.js

@@ -0,0 +1,96 @@
+import { defineAdminExtension } from "@voyantjs/admin";
+// Packaged admin hosts (packaged-admin RFC Phase 3): the operator-grade
+// notifications pages bound to their data wiring + semantic-destination
+// navigation. Host route files only bind route params onto these.
+export { NotificationDeliveriesHost } from "./notification-deliveries-host.js";
+export { NotificationDeliveryDetailDialog } from "./notification-delivery-detail-dialog.js";
+export { NotificationReminderRuleDetailHost, } from "./notification-reminder-rule-detail-host.js";
+export { NotificationReminderRuleDialog } from "./notification-reminder-rule-dialog.js";
+export { NotificationReminderRulesHost } from "./notification-reminder-rules-host.js";
+export { NotificationReminderRunsHost } from "./notification-reminder-runs-host.js";
+export { NotificationSettingsHost } from "./notification-settings-host.js";
+export { NotificationTemplateAuthoringHelp } from "./notification-template-authoring-help.js";
+export { NotificationTemplateDetailHost, } from "./notification-template-detail-host.js";
+export { NotificationTemplateDialog } from "./notification-template-dialog.js";
+export { NotificationTemplatesHost } from "./notification-templates-host.js";
+export { RemindersPreviewHost } from "./reminders-preview-host.js";
+/**
+ * The notifications admin contribution (packaged-admin RFC Phase 3,
+ * `@voyantjs/<domain>-ui/admin` convention).
+ *
+ * NAVIGATION: deliberately none. The Notifications nav group (templates,
+ * reminder rules, deliveries, reminder runs, preview, settings) is part of
+ * the BASE operator navigation — see `createOperatorAdminNavigation` in
+ * `@voyantjs/admin` — so contributing nav entries here would duplicate
+ * them. If the base nav ever drops the notifications group, this extension
+ * is where the entries move.
+ *
+ * ROUTES: contributions are metadata only — the notifications pages keep
+ * their filter state component-local, so there are no URL search contracts.
+ * The PAGES are package-owned: {@link NotificationTemplatesHost},
+ * {@link NotificationReminderRulesHost}, {@link NotificationDeliveriesHost},
+ * {@link NotificationReminderRunsHost}, {@link RemindersPreviewHost} and
+ * {@link NotificationSettingsHost} are zero-prop;
+ * {@link NotificationTemplateDetailHost} and
+ * {@link NotificationReminderRuleDetailHost} bind the detail pages to their
+ * data wiring and resolve every cross-route link through the semantic
+ * destinations declared above. `component:` is intentionally NOT attached
+ * to these contributions yet: the contribution contract renders zero-prop
+ * pages (route components read params via the router, per RFC §4.2), while
+ * the detail hosts take the record id as a prop. Host route files stay the
+ * thin binding layer (`Route.useParams()` → host props) until the §4.2
+ * code-based route assembly gives packaged pages a router-agnostic way to
+ * read route state.
+ *
+ * WIDGETS: none today. No cross-domain notifications card is slot-mounted —
+ * deliveries shown on other domains' detail pages are those hosts' concern.
+ */
+export function createNotificationsAdminExtension(options = {}) {
+    const { basePath = "/notifications", labels = {} } = options;
+    const { templates = "Templates", reminderRules = "Reminder Rules", deliveries = "Deliveries", reminderRuns = "Reminder Runs", preview = "Preview", settings = "Settings", } = labels;
+    return defineAdminExtension({
+        id: "notifications",
+        routes: [
+            {
+                id: "notifications-templates-index",
+                path: `${basePath}/templates`,
+                title: templates,
+            },
+            {
+                id: "notifications-templates-detail",
+                path: `${basePath}/templates/$id`,
+                title: templates,
+            },
+            {
+                id: "notifications-reminder-rules-index",
+                path: `${basePath}/reminder-rules`,
+                title: reminderRules,
+            },
+            {
+                id: "notifications-reminder-rules-detail",
+                path: `${basePath}/reminder-rules/$id`,
+                title: reminderRules,
+            },
+            {
+                id: "notifications-deliveries",
+                path: `${basePath}/deliveries`,
+                title: deliveries,
+            },
+            {
+                id: "notifications-reminder-runs",
+                path: `${basePath}/reminder-runs`,
+                title: reminderRuns,
+            },
+            {
+                id: "notifications-preview",
+                path: `${basePath}/preview`,
+                title: preview,
+            },
+            {
+                id: "notifications-settings",
+                path: `${basePath}/settings`,
+                title: settings,
+            },
+        ],
+    });
+}

package/dist/admin/notification-deliveries-host.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Packaged admin host for the notification deliveries page (packaged-admin
+ * RFC Phase 3). Zero-prop: filter state stays component-local and the
+ * details dialog is in-page — no cross-route navigation.
+ */
+export declare function NotificationDeliveriesHost(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=notification-deliveries-host.d.ts.map

package/dist/admin/notification-deliveries-host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-deliveries-host.d.ts","sourceRoot":"","sources":["../../src/admin/notification-deliveries-host.tsx"],"names":[],"mappings":"AA2BA;;;;GAIG;AACH,wBAAgB,0BAA0B,4CA+KzC"}

package/dist/admin/notification-deliveries-host.js

@@ -0,0 +1,92 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Button, Dialog, DialogBody, DialogContent, DialogDescription, DialogHeader, DialogTitle, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyantjs/ui/components";
+import { Loader2, RotateCcw, Search } from "lucide-react";
+import { useState } from "react";
+import { useNotificationsUiMessagesOrDefault } from "../i18n/index.js";
+import { useNotificationDeliveries, useNotificationDeliveryMutation, } from "../index.js";
+/**
+ * Packaged admin host for the notification deliveries page (packaged-admin
+ * RFC Phase 3). Zero-prop: filter state stays component-local and the
+ * details dialog is in-page — no cross-route navigation.
+ */
+export function NotificationDeliveriesHost() {
+    const messages = useNotificationsUiMessagesOrDefault();
+    const t = messages.admin.deliveriesPage;
+    const common = messages.admin.common;
+    const [channel, setChannel] = useState("all");
+    const [status, setStatus] = useState("all");
+    const [selectedDelivery, setSelectedDelivery] = useState(null);
+    const deliveryMutation = useNotificationDeliveryMutation();
+    const selectedDeliveryId = selectedDelivery?.id;
+    const { data, isPending } = useNotificationDeliveries({
+        channel: channel === "all" ? undefined : channel,
+        status: status === "all" ? undefined : status,
+        limit: 50,
+        offset: 0,
+    });
+    return (_jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-bold tracking-tight", children: t.title }), _jsx("p", { className: "text-sm text-muted-foreground", children: t.description })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs(Select, { value: channel, onValueChange: (value) => setChannel(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: common.channelFilterPlaceholder }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: common.allChannels }), _jsx(SelectItem, { value: "email", children: common.channelEmail }), _jsx(SelectItem, { value: "sms", children: common.channelSms })] })] }), _jsxs(Select, { value: status, onValueChange: (value) => setStatus(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: common.statusFilterPlaceholder }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: common.allStatuses }), _jsx(SelectItem, { value: "pending", children: common.statusPending }), _jsx(SelectItem, { value: "sent", children: common.statusSent }), _jsx(SelectItem, { value: "failed", children: common.statusFailed }), _jsx(SelectItem, { value: "cancelled", children: common.statusCancelled })] })] })] }), isPending ? (_jsx("div", { className: "flex items-center justify-center py-12", children: _jsx(Loader2, { className: "h-6 w-6 animate-spin text-muted-foreground" }) })) : null, !isPending && (!data?.data || data.data.length === 0) ? (_jsx("div", { className: "rounded-md border border-dashed p-8 text-center", children: _jsx("p", { className: "text-sm text-muted-foreground", children: t.empty }) })) : null, !isPending && data?.data && data.data.length > 0 ? (_jsx("div", { className: "rounded-md border", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted/40 text-left text-xs uppercase tracking-wide text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "px-4 py-3", children: "To" }), _jsx("th", { className: "px-4 py-3", children: "Template" }), _jsx("th", { className: "px-4 py-3", children: "Channel" }), _jsx("th", { className: "px-4 py-3", children: "Provider" }), _jsx("th", { className: "px-4 py-3", children: "Status" }), _jsx("th", { className: "px-4 py-3", children: "Created" }), _jsx("th", { className: "px-4 py-3 text-right", children: "Logs" })] }) }), _jsx("tbody", { children: data.data.map((delivery) => (_jsxs("tr", { className: "border-t", children: [_jsxs("td", { className: "px-4 py-3", children: [_jsx("div", { children: delivery.toAddress }), delivery.subject ? (_jsx("div", { className: "text-xs text-muted-foreground", children: delivery.subject })) : null] }), _jsx("td", { className: "px-4 py-3 font-mono text-xs", children: delivery.templateSlug ?? common.directTemplate }), _jsx("td", { className: "px-4 py-3", children: _jsx(Badge, { variant: "outline", children: delivery.channel }) }), _jsx("td", { className: "px-4 py-3", children: delivery.provider }), _jsxs("td", { className: "px-4 py-3", children: [_jsx(Badge, { variant: delivery.status === "sent"
+                                                    ? "default"
+                                                    : delivery.status === "failed"
+                                                        ? "destructive"
+                                                        : "secondary", children: delivery.status }), delivery.status === "failed" && delivery.errorMessage ? (_jsx("div", { className: "mt-1 max-w-[280px] truncate text-destructive text-xs", children: delivery.errorMessage })) : null] }), _jsx("td", { className: "px-4 py-3", children: new Date(delivery.createdAt).toLocaleString() }), _jsx("td", { className: "px-4 py-3 text-right", children: _jsxs("div", { className: "flex justify-end gap-1", children: [delivery.status === "failed" ? (_jsxs(Button, { type: "button", variant: "ghost", size: "sm", disabled: deliveryMutation.resend.isPending, onClick: () => {
+                                                        deliveryMutation.resend.mutate(delivery.id, {
+                                                            onError(error) {
+                                                                window.alert(error instanceof Error ? error.message : t.resendFailed);
+                                                            },
+                                                        });
+                                                    }, children: [deliveryMutation.resend.isPending ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(RotateCcw, { className: "mr-2 h-4 w-4" })), t.resend] })) : null, _jsxs(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setSelectedDelivery(delivery), children: [_jsx(Search, { className: "mr-2 h-4 w-4" }), t.detailsButton] })] }) })] }, delivery.id))) })] }) })) : null, _jsx(DeliveryDetailsDialog, { messages: messages, delivery: selectedDelivery, open: Boolean(selectedDelivery), onOpenChange: (open) => {
+                    if (!open)
+                        setSelectedDelivery(null);
+                }, onResend: selectedDelivery?.status === "failed" && selectedDeliveryId
+                    ? () => {
+                        deliveryMutation.resend.mutate(selectedDeliveryId, {
+                            onError(error) {
+                                window.alert(error instanceof Error ? error.message : t.resendFailed);
+                            },
+                        });
+                    }
+                    : undefined, isResending: deliveryMutation.resend.isPending })] }));
+}
+function DeliveryDetailsDialog({ messages, delivery, open, onOpenChange, onResend, isResending = false, }) {
+    if (!delivery)
+        return null;
+    const t = messages.admin.deliveriesPage;
+    const failureLog = readRecord(delivery.metadata?.failureLog);
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { size: "xl", children: [_jsx(DialogHeader, { children: _jsxs("div", { className: "flex items-start justify-between gap-4 pr-8", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(DialogTitle, { children: t.dialogTitle }), _jsx(DialogDescription, { children: t.dialogDescription })] }), onResend ? (_jsxs(Button, { type: "button", variant: "outline", size: "sm", disabled: isResending, onClick: onResend, children: [isResending ? (_jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" })) : (_jsx(RotateCcw, { className: "mr-2 h-4 w-4" })), t.resend] })) : null] }) }), _jsxs(DialogBody, { className: "space-y-5", children: [_jsxs("section", { className: "grid gap-3 sm:grid-cols-2", children: [_jsx(Detail, { label: t.labels.deliveryId, value: delivery.id, mono: true }), _jsx(Detail, { label: t.labels.status, value: delivery.status }), _jsx(Detail, { label: t.labels.provider, value: delivery.provider }), _jsx(Detail, { label: t.labels.providerMessageId, value: delivery.providerMessageId ?? "—", mono: true }), _jsx(Detail, { label: t.labels.template, value: delivery.templateSlug ?? messages.admin.common.directTemplate, mono: true }), _jsx(Detail, { label: t.labels.channel, value: delivery.channel }), _jsx(Detail, { label: t.labels.created, value: formatDateTime(delivery.createdAt) }), _jsx(Detail, { label: t.labels.failed, value: formatDateTime(delivery.failedAt) }), _jsx(Detail, { label: t.labels.sent, value: formatDateTime(delivery.sentAt) }), _jsx(Detail, { label: t.labels.scheduled, value: formatDateTime(delivery.scheduledFor) })] }), delivery.errorMessage ? (_jsx(LogSection, { title: t.errorMessageTitle, tone: "destructive", children: delivery.errorMessage })) : null, failureLog ? (_jsx(JsonSection, { title: t.failureLogTitle, value: failureLog })) : delivery.status === "failed" ? (_jsx(LogSection, { title: t.failureLogTitle, children: t.noFailureLog })) : null, _jsxs("section", { className: "grid gap-3 sm:grid-cols-2", children: [_jsx(Detail, { label: t.labels.to, value: delivery.toAddress }), _jsx(Detail, { label: t.labels.from, value: delivery.fromAddress ?? "—" }), _jsx(Detail, { label: t.labels.subject, value: delivery.subject ?? "—" }), _jsx(Detail, { label: t.labels.target, value: formatTarget(delivery), mono: true })] }), _jsx(JsonSection, { title: t.payloadDataTitle, value: delivery.payloadData }), _jsx(JsonSection, { title: t.metadataTitle, value: delivery.metadata }), _jsx(BodySection, { title: t.textBodyTitle, value: delivery.textBody }), _jsx(BodySection, { title: t.htmlBodyTitle, value: delivery.htmlBody })] })] }) }));
+}
+function Detail({ label, value, mono = false }) {
+    return (_jsxs("div", { className: "rounded-md border bg-muted/20 p-3", children: [_jsx("div", { className: "text-muted-foreground text-xs uppercase tracking-wide", children: label }), _jsx("div", { className: `mt-1 break-words text-sm ${mono ? "font-mono" : ""}`, children: value || "—" })] }));
+}
+function LogSection({ title, children, tone, }) {
+    return (_jsxs("section", { className: "space-y-2", children: [_jsx("h2", { className: "font-medium text-sm", children: title }), _jsx("pre", { className: `max-h-56 overflow-auto rounded-md border p-3 text-xs ${
+                // i18n-literal-ok tailwind utilities keyed off a tone enum, not user-facing copy.
+                tone === "destructive" ? "border-destructive/30 bg-destructive/10" : "bg-muted/30"}`, children: children })] }));
+}
+function JsonSection({ title, value }) {
+    if (!value)
+        return null;
+    return _jsx(LogSection, { title: title, children: JSON.stringify(value, null, 2) });
+}
+function BodySection({ title, value }) {
+    if (!value)
+        return null;
+    return _jsx(LogSection, { title: title, children: value });
+}
+function readRecord(value) {
+    return value && typeof value === "object" && !Array.isArray(value)
+        ? value
+        : null;
+}
+function formatDateTime(value) {
+    return value ? new Date(value).toLocaleString() : "—";
+}
+function formatTarget(delivery) {
+    const targetId = delivery.bookingId ??
+        delivery.invoiceId ??
+        delivery.paymentSessionId ??
+        delivery.personId ??
+        delivery.organizationId ??
+        delivery.targetId;
+    return targetId ? `${delivery.targetType}:${targetId}` : delivery.targetType;
+}

package/dist/admin/notification-delivery-detail-dialog.d.ts

@@ -0,0 +1,8 @@
+type NotificationDeliveryDetailDialogProps = {
+    deliveryId: string | null;
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+};
+export declare function NotificationDeliveryDetailDialog({ deliveryId, open, onOpenChange, }: NotificationDeliveryDetailDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=notification-delivery-detail-dialog.d.ts.map

package/dist/admin/notification-delivery-detail-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-delivery-detail-dialog.d.ts","sourceRoot":"","sources":["../../src/admin/notification-delivery-detail-dialog.tsx"],"names":[],"mappings":"AAeA,KAAK,qCAAqC,GAAG;IAC3C,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;CACtC,CAAA;AAED,wBAAgB,gCAAgC,CAAC,EAC/C,UAAU,EACV,IAAI,EACJ,YAAY,GACb,EAAE,qCAAqC,2CA+HvC"}

package/dist/admin/notification-delivery-detail-dialog.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Badge, Button, Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, } from "@voyantjs/ui/components";
+import { Loader2 } from "lucide-react";
+import { useNotificationsUiMessagesOrDefault } from "../i18n/index.js";
+import { useNotificationDelivery } from "../index.js";
+export function NotificationDeliveryDetailDialog({ deliveryId, open, onOpenChange, }) {
+    const messages = useNotificationsUiMessagesOrDefault();
+    const t = messages.admin.deliveryDetail;
+    const { data, isPending, error } = useNotificationDelivery(deliveryId ?? "", {
+        enabled: open && Boolean(deliveryId),
+    });
+    const delivery = data ?? null;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-4xl", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: t.title }) }), _jsxs("div", { className: "min-h-0 flex-1 space-y-4 overflow-y-auto py-4 pr-1", children: [isPending ? (_jsx("div", { className: "flex items-center justify-center py-12", children: _jsx(Loader2, { className: "h-6 w-6 animate-spin text-muted-foreground" }) })) : null, !isPending && error ? (_jsx("div", { className: "rounded-md border border-destructive/30 bg-destructive/10 px-4 py-3 text-sm text-destructive", children: error instanceof Error ? error.message : t.loadFailed })) : null, !isPending && delivery ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-2 xl:grid-cols-4", children: [_jsx(InfoCard, { label: t.labels.to, value: delivery.toAddress }), _jsx(InfoCard, { label: t.labels.template, value: delivery.templateSlug ?? messages.admin.common.directTemplate, mono: true }), _jsx(InfoCard, { label: t.labels.provider, value: delivery.provider }), _jsxs("div", { className: "rounded-md border p-3", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: t.labels.status }), _jsx("div", { className: "mt-2", children: _jsx(Badge, { variant: delivery.status === "sent"
+                                                            ? "default"
+                                                            : delivery.status === "failed"
+                                                                ? "destructive"
+                                                                : "secondary", children: delivery.status }) })] })] }), _jsxs("div", { className: "grid gap-4 lg:grid-cols-2", children: [_jsxs(Section, { title: t.metadataTitle, children: [_jsx(KeyValue, { label: t.labels.channel, value: delivery.channel }), _jsx(KeyValue, { label: t.labels.from, value: delivery.fromAddress ?? "—" }), _jsx(KeyValue, { label: t.labels.targetType, value: delivery.targetType }), _jsx(KeyValue, { label: t.labels.targetId, value: delivery.targetId ?? "—", mono: true }), _jsx(KeyValue, { label: t.labels.providerMessageId, value: delivery.providerMessageId ?? "—", mono: true }), _jsx(KeyValue, { label: t.labels.created, value: new Date(delivery.createdAt).toLocaleString() }), _jsx(KeyValue, { label: t.labels.sent, value: delivery.sentAt ? new Date(delivery.sentAt).toLocaleString() : "—" }), _jsx(KeyValue, { label: t.labels.failed, value: delivery.failedAt ? new Date(delivery.failedAt).toLocaleString() : "—" })] }), _jsxs(Section, { title: t.renderedPayloadTitle, children: [_jsx(KeyValue, { label: t.labels.subject, value: delivery.subject ?? "—" }), _jsx(KeyValue, { label: t.labels.error, value: delivery.errorMessage ?? "—" }), _jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: t.labels.text }), _jsx("pre", { className: "whitespace-pre-wrap rounded-md border bg-muted/20 px-3 py-3 text-xs", children: delivery.textBody ?? "—" })] })] })] }), _jsx(Section, { title: t.htmlBodyTitle, children: delivery.htmlBody ? (_jsx("div", { className: "prose prose-sm max-w-none rounded-md border bg-background px-4 py-4 dark:prose-invert", 
+                                        // biome-ignore lint/security/noDangerouslySetInnerHtml: Notification HTML body is stored template output rendered for preview.
+                                        dangerouslySetInnerHTML: { __html: delivery.htmlBody } })) : (_jsx("div", { className: "rounded-md border bg-muted/20 px-4 py-3 text-sm text-muted-foreground", children: t.noHtmlStored })) }), _jsx(Section, { title: t.payloadDataTitle, children: _jsx("pre", { className: "overflow-x-auto whitespace-pre-wrap rounded-md border bg-muted/20 px-3 py-3 text-xs", children: JSON.stringify(delivery.payloadData ?? {}, null, 2) }) })] })) : null] }), _jsx(DialogFooter, { children: _jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: t.close }) })] }) }));
+}
+function Section({ title, children }) {
+    return (_jsxs("section", { className: "space-y-3 rounded-md border p-4", children: [_jsx("h3", { className: "text-sm font-medium", children: title }), children] }));
+}
+function InfoCard({ label, value, mono = false, }) {
+    return (_jsxs("div", { className: "rounded-md border p-3", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: label }), _jsx("div", { className: `mt-2 break-words text-sm ${mono ? "font-mono text-xs" : ""}`, children: value })] }));
+}
+function KeyValue({ label, value, mono = false, }) {
+    return (_jsxs("div", { className: "grid gap-1", children: [_jsx("div", { className: "text-xs uppercase tracking-wide text-muted-foreground", children: label }), _jsx("div", { className: `break-words text-sm ${mono ? "font-mono text-xs" : ""}`, children: value })] }));
+}

package/dist/admin/notification-reminder-rule-detail-host.d.ts

@@ -0,0 +1,12 @@
+export interface NotificationReminderRuleDetailHostProps {
+    id: string;
+}
+/**
+ * Packaged admin host for the reminder rule detail page — rule summary plus
+ * the stage sequence editor (packaged-admin RFC Phase 3). Takes the rule id
+ * as a prop — the host route file binds `Route.useParams()` onto it. The
+ * back link resolves through the `notificationReminderRule.list` semantic
+ * destination.
+ */
+export declare function NotificationReminderRuleDetailHost({ id, }: NotificationReminderRuleDetailHostProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=notification-reminder-rule-detail-host.d.ts.map

package/dist/admin/notification-reminder-rule-detail-host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-reminder-rule-detail-host.d.ts","sourceRoot":"","sources":["../../src/admin/notification-reminder-rule-detail-host.tsx"],"names":[],"mappings":"AAUA,MAAM,WAAW,uCAAuC;IACtD,EAAE,EAAE,MAAM,CAAA;CACX;AAED;;;;;;GAMG;AACH,wBAAgB,kCAAkC,CAAC,EACjD,EAAE,GACH,EAAE,uCAAuC,2CAuDzC"}

package/dist/admin/notification-reminder-rule-detail-host.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAdminHref, useAdminNavigate } from "@voyantjs/admin";
+import { Badge, Button, Card, CardContent, CardHeader, CardTitle } from "@voyantjs/ui/components";
+import { ArrowLeft } from "lucide-react";
+import { StageList } from "../components/stage-list.js";
+import { useNotificationsUiMessagesOrDefault } from "../i18n/index.js";
+import { useNotificationReminderRule } from "../index.js";
+import { DestinationLink } from "./notifications-admin-shared.js";
+/**
+ * Packaged admin host for the reminder rule detail page — rule summary plus
+ * the stage sequence editor (packaged-admin RFC Phase 3). Takes the rule id
+ * as a prop — the host route file binds `Route.useParams()` onto it. The
+ * back link resolves through the `notificationReminderRule.list` semantic
+ * destination.
+ */
+export function NotificationReminderRuleDetailHost({ id, }) {
+    const messages = useNotificationsUiMessagesOrDefault();
+    const resolveHref = useAdminHref();
+    const navigateTo = useAdminNavigate();
+    const { data: rule, isLoading } = useNotificationReminderRule(id);
+    return (_jsxs("div", { className: "container mx-auto space-y-6 p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(DestinationLink, { href: resolveHref("notificationReminderRule.list", {}), onNavigate: () => navigateTo("notificationReminderRule.list", {}), children: _jsx(Button, { variant: "ghost", size: "icon", children: _jsx(ArrowLeft, { className: "size-4" }) }) }), _jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: rule?.name ?? messages.admin.reminderRuleDetail.fallbackTitle }), _jsx("p", { className: "text-sm text-muted-foreground", children: isLoading ? messages.common.loading : rule?.slug })] })] }), rule && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: "outline", children: rule.targetType }), _jsx(Badge, { variant: "outline", children: rule.channel }), _jsx(Badge, { children: rule.status })] }))] }), rule && (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Rule" }) }), _jsxs(CardContent, { className: "text-sm grid grid-cols-2 gap-x-8 gap-y-2 text-muted-foreground", children: [_jsxs("div", { children: ["Template slug: ", _jsx("span", { className: "font-mono", children: rule.templateSlug ?? "—" })] }), _jsxs("div", { children: ["Template id: ", _jsx("span", { className: "font-mono", children: rule.templateId ?? "—" })] })] })] })), _jsx(StageList, { reminderRuleId: id })] }));
+}

package/dist/admin/notification-reminder-rule-dialog.d.ts

@@ -0,0 +1,10 @@
+import { type NotificationReminderRuleRecord } from "../index.js";
+type NotificationReminderRuleDialogProps = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    rule?: NotificationReminderRuleRecord;
+    onSuccess: () => void;
+};
+export declare function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuccess, }: NotificationReminderRuleDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=notification-reminder-rule-dialog.d.ts.map

package/dist/admin/notification-reminder-rule-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-reminder-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/admin/notification-reminder-rule-dialog.tsx"],"names":[],"mappings":"AAwBA,OAAO,EACL,KAAK,8BAA8B,EAGpC,MAAM,aAAa,CAAA;AAoCpB,KAAK,mCAAmC,GAAG;IACzC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,IAAI,CAAC,EAAE,8BAA8B,CAAA;IACrC,SAAS,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA;AAED,wBAAgB,8BAA8B,CAAC,EAC7C,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,SAAS,GACV,EAAE,mCAAmC,2CAkMrC"}

package/dist/admin/notification-reminder-rule-dialog.js

@@ -0,0 +1,122 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Dialog, DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyantjs/ui/components";
+import { zodResolver } from "@voyantjs/ui/lib/zod-resolver";
+import { Loader2 } from "lucide-react";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+import { useNotificationsUiMessagesOrDefault } from "../i18n/index.js";
+import { useNotificationReminderRuleMutation, useNotificationTemplates, } from "../index.js";
+const reminderRuleFormSchema = z.object({
+    name: z.string().min(1, "Name is required"),
+    status: z.enum(["draft", "active", "archived"]).default("draft"),
+    targetType: z.enum([
+        "booking_confirmed",
+        "booking_payment_schedule",
+        "payment_complete",
+        "booking_cancelled_non_payment",
+    ]),
+    channel: z.enum(["email", "sms"]),
+    // Optional default template — stages own per-channel templates and
+    // override this. Empty string is normalized to null in the payload.
+    templateId: z.string().optional(),
+});
+const reminderTargetValues = [
+    "booking_confirmed",
+    "payment_complete",
+    "booking_cancelled_non_payment",
+    "booking_payment_schedule",
+];
+function slugifyReminderRule(value) {
+    const slug = value
+        .trim()
+        .toLowerCase()
+        .replace(/[^a-z0-9]+/g, "-")
+        .replace(/^-+|-+$/g, "");
+    return slug || "notification-rule";
+}
+export function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuccess, }) {
+    const isEditing = Boolean(rule);
+    const messages = useNotificationsUiMessagesOrDefault();
+    const t = messages.admin.reminderRuleDialog;
+    const common = messages.admin.common;
+    const { create, update } = useNotificationReminderRuleMutation();
+    const form = useForm({
+        resolver: zodResolver(reminderRuleFormSchema),
+        defaultValues: {
+            name: "",
+            status: "draft",
+            targetType: "booking_payment_schedule",
+            channel: "email",
+            templateId: "",
+        },
+    });
+    const channel = form.watch("channel");
+    const { data: templates } = useNotificationTemplates({
+        channel,
+        status: "active",
+        limit: 100,
+        offset: 0,
+    });
+    useEffect(() => {
+        if (open && rule) {
+            const resolvedTemplateId = rule.templateId ??
+                (rule.templateSlug
+                    ? ((templates?.data ?? []).find((template) => template.slug === rule.templateSlug)?.id ??
+                        "")
+                    : "");
+            form.reset({
+                name: rule.name,
+                status: rule.status,
+                targetType: rule.targetType === "invoice" ? "booking_payment_schedule" : rule.targetType,
+                channel: rule.channel,
+                templateId: resolvedTemplateId,
+            });
+            return;
+        }
+        if (open) {
+            form.reset();
+        }
+    }, [open, rule, form, templates?.data]);
+    const onSubmit = async (values) => {
+        const payload = {
+            name: values.name,
+            slug: rule?.slug ??
+                `${slugifyReminderRule(values.targetType)}-${slugifyReminderRule(values.name)}`,
+            status: values.status,
+            targetType: values.targetType,
+            channel: values.channel,
+            provider: null,
+            templateId: values.templateId ? values.templateId : null,
+            templateSlug: null,
+            isSystem: rule?.isSystem ?? false,
+            metadata: rule?.metadata ?? null,
+        };
+        if (isEditing && rule) {
+            await update.mutateAsync({ id: rule.id, input: payload });
+        }
+        else {
+            await create.mutateAsync(payload);
+        }
+        onSuccess();
+    };
+    const isPending = create.isPending || update.isPending;
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: isEditing ? t.editTitle : t.createTitle }) }), _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(DialogBody, { className: "grid gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.nameLabel }), _jsx(Input, { ...form.register("name"), placeholder: t.namePlaceholder })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.targetLabel }), _jsxs(Select, { value: form.watch("targetType"), onValueChange: (value) => {
+                                                        if (!value)
+                                                            return;
+                                                        form.setValue("targetType", value);
+                                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: reminderTargetValues.map((value) => (_jsx(SelectItem, { value: value, children: messages.admin.reminderRulesPage.targets[value] }, value))) })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.statusLabel }), _jsxs(Select, { value: form.watch("status"), onValueChange: (value) => {
+                                                        if (!value)
+                                                            return;
+                                                        form.setValue("status", value);
+                                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "draft", children: common.statusDraft }), _jsx(SelectItem, { value: "active", children: common.statusActive }), _jsx(SelectItem, { value: "archived", children: common.statusArchived })] })] })] })] }), _jsx("div", { className: "grid gap-4", children: _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.channelLabel }), _jsxs(Select, { value: form.watch("channel"), onValueChange: (value) => {
+                                                    if (!value)
+                                                        return;
+                                                    form.setValue("channel", value);
+                                                }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "email", children: common.channelEmail }), _jsx(SelectItem, { value: "sms", children: common.channelSms })] })] })] }) }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: t.defaultTemplateLabel }), _jsxs(Select, { value: form.watch("templateId"), onValueChange: (value) => {
+                                                if (!value)
+                                                    return;
+                                                form.setValue("templateId", value);
+                                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: t.selectTemplatePlaceholder }) }), _jsx(SelectContent, { children: (templates?.data ?? []).map((template) => (_jsxs(SelectItem, { value: template.id, children: [template.name, " (", template.slug, ")"] }, template.id))) })] }), _jsx("p", { className: "text-xs text-muted-foreground", children: t.defaultTemplateHint })] }), !isEditing ? (_jsxs("p", { className: "rounded-md border border-dashed bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: [t.stagesHintBefore, " ", _jsx("strong", { children: t.stagesHintAction }), " ", t.stagesHintAfter] })) : null] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: messages.common.cancel }), _jsxs(Button, { type: "submit", disabled: isPending, children: [isPending ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? common.saveChanges : t.createRule] })] })] })] }) }));
+}

package/dist/admin/notification-reminder-rules-host.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Packaged admin host for the reminder rules list page (packaged-admin RFC
+ * Phase 3). Zero-prop: list/filter state stays component-local and the
+ * per-rule "Manage stages" link resolves through the
+ * `notificationReminderRule.detail` semantic destination.
+ */
+export declare function NotificationReminderRulesHost(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=notification-reminder-rules-host.d.ts.map

package/dist/admin/notification-reminder-rules-host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification-reminder-rules-host.d.ts","sourceRoot":"","sources":["../../src/admin/notification-reminder-rules-host.tsx"],"names":[],"mappings":"AAuCA;;;;;GAKG;AACH,wBAAgB,6BAA6B,4CA6K5C"}