@voyantjs/ui 0.28.3 → 0.30.0

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

@@ -1 +1 @@
-{"version":3,"file":"notification-reminder-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/notification-reminder-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,8BAA8B,EAGpC,MAAM,+BAA+B,CAAA;AAuDtC,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,2CAiNrC"}
+{"version":3,"file":"notification-reminder-rule-dialog.d.ts","sourceRoot":"","sources":["../../src/components/notification-reminder-rule-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,8BAA8B,EAGpC,MAAM,+BAA+B,CAAA;AAsDtC,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/components/notification-reminder-rule-dialog.js

@@ -21,8 +21,9 @@ const reminderRuleFormSchema = z.object({
         "booking_cancelled_non_payment",
     ]),
     channel: z.enum(["email", "sms"]),
-    templateId: z.string().min(1, "Template is required"),
-    relativeDaysFromDueDate: z.number().int().min(-365).max(365),
+    // 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 reminderTargetOptions = [
     { value: "booking_confirmed", label: "Booking confirmed" },
@@ -30,7 +31,6 @@ const reminderTargetOptions = [
     { value: "booking_cancelled_non_payment", label: "Booking cancelled (non-payment)" },
     { value: "booking_payment_schedule", label: "Booking payment schedule" },
 ];
-const dueDateTargetTypes = new Set(["booking_payment_schedule"]);
 function slugifyReminderRule(value) {
     const slug = value
         .trim()
@@ -50,12 +50,9 @@ export function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuc
             targetType: "booking_payment_schedule",
             channel: "email",
             templateId: "",
-            relativeDaysFromDueDate: 0,
         },
     });
     const channel = form.watch("channel");
-    const targetType = form.watch("targetType");
-    const usesDueDateTiming = dueDateTargetTypes.has(targetType);
     const { data: templates } = useNotificationTemplates({
         channel,
         status: "active",
@@ -75,7 +72,6 @@ export function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuc
                 targetType: rule.targetType === "invoice" ? "booking_payment_schedule" : rule.targetType,
                 channel: rule.channel,
                 templateId: resolvedTemplateId,
-                relativeDaysFromDueDate: rule.relativeDaysFromDueDate,
             });
             return;
         }
@@ -92,11 +88,8 @@ export function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuc
             targetType: values.targetType,
             channel: values.channel,
             provider: null,
-            templateId: values.templateId,
+            templateId: values.templateId ? values.templateId : null,
             templateSlug: null,
-            relativeDaysFromDueDate: dueDateTargetTypes.has(values.targetType)
-                ? values.relativeDaysFromDueDate
-                : 0,
             isSystem: rule?.isSystem ?? false,
             metadata: rule?.metadata ?? null,
         };
@@ -117,13 +110,13 @@ export function NotificationReminderRuleDialog({ open, onOpenChange, rule, onSuc
                                                         if (!value)
                                                             return;
                                                         form.setValue("status", value);
-                                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "draft", children: "Draft" }), _jsx(SelectItem, { value: "active", children: "Active" }), _jsx(SelectItem, { value: "archived", children: "Archived" })] })] })] })] }), _jsxs("div", { className: usesDueDateTiming ? "grid grid-cols-2 gap-4" : "grid gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Channel" }), _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: "Email" }), _jsx(SelectItem, { value: "sms", children: "SMS" })] })] })] }), usesDueDateTiming ? (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Send timing" }), _jsx(Input, { type: "number", value: form.watch("relativeDaysFromDueDate"), onChange: (event) => form.setValue("relativeDaysFromDueDate", Number.parseInt(event.target.value || "0", 10)) }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Days from due date: -3 sends 3 days before, 0 on the due date, 3 after." })] })) : null] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Template" }), _jsxs(Select, { value: form.watch("templateId"), onValueChange: (value) => {
+                                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "draft", children: "Draft" }), _jsx(SelectItem, { value: "active", children: "Active" }), _jsx(SelectItem, { value: "archived", children: "Archived" })] })] })] })] }), _jsx("div", { className: "grid gap-4", children: _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Channel" }), _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: "Email" }), _jsx(SelectItem, { value: "sms", children: "SMS" })] })] })] }) }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Default template" }), _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: "Select template" }) }), _jsx(SelectContent, { children: (templates?.data ?? []).map((template) => (_jsxs(SelectItem, { value: template.id, children: [template.name, " (", template.slug, ")"] }, template.id))) })] })] })] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsxs(Button, { type: "submit", disabled: isPending, children: [isPending ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? "Save Changes" : "Create Rule"] })] })] })] }) }));
+                                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: "Select template" }) }), _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: "Used as a fallback. Per-stage channels can override this." })] }), !isEditing ? (_jsxs("p", { className: "rounded-md border border-dashed bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: ["After creating the rule, click ", _jsx("strong", { children: "Manage stages" }), " on the row to define when it fires (anchor, window, cadence) and which channels deliver it."] })) : null] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }), _jsxs(Button, { type: "submit", disabled: isPending, children: [isPending ? _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : null, isEditing ? "Save Changes" : "Create Rule"] })] })] })] }) }));
 }

package/dist/components/notification-reminder-rules-page.d.ts

@@ -1,2 +1,10 @@
-export declare function NotificationReminderRulesPage(): import("react/jsx-runtime").JSX.Element;
+export interface NotificationReminderRulesPageProps {
+    /**
+     * Path used for the per-rule "Manage stages" link. Receives the rule id and
+     * returns the URL the consumer's router understands. Defaults to
+     * `/notifications/reminder-rules/<id>`.
+     */
+    manageStagesHref?: (ruleId: string) => string;
+}
+export declare function NotificationReminderRulesPage({ manageStagesHref, }?: NotificationReminderRulesPageProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=notification-reminder-rules-page.d.ts.map

package/dist/components/notification-reminder-rules-page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-reminder-rules-page.d.ts","sourceRoot":"","sources":["../../src/components/notification-reminder-rules-page.tsx"],"names":[],"mappings":"AAyCA,wBAAgB,6BAA6B,4CA+J5C"}
+{"version":3,"file":"notification-reminder-rules-page.d.ts","sourceRoot":"","sources":["../../src/components/notification-reminder-rules-page.tsx"],"names":[],"mappings":"AA4BA,MAAM,WAAW,kCAAkC;IACjD;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAA;CAC9C;AAED,wBAAgB,6BAA6B,CAAC,EAC5C,gBAAgE,GACjE,GAAE,kCAAuC,2CAoKzC"}

package/dist/components/notification-reminder-rules-page.js

@@ -1,10 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useNotificationReminderRules, } from "@voyantjs/notifications-react";
-import { Loader2, Pencil, Plus, Search } from "lucide-react";
+import { Layers, Loader2, Pencil, Plus, Search } from "lucide-react";
 import { useState } from "react";
 import { Badge } from "./badge.js";
-import { Button } from "./button.js";
+import { Button, buttonVariants } from "./button.js";
 import { Input } from "./input.js";
 import { NotificationReminderRuleDialog } from "./notification-reminder-rule-dialog.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./select.js";
@@ -14,22 +14,12 @@ const reminderTargetLabels = {
     payment_complete: "Payment complete",
     booking_cancelled_non_payment: "Booking cancelled (non-payment)",
 };
-const dueDateTargetTypes = new Set([
-    "booking_payment_schedule",
-]);
 function getReminderTargetLabel(targetType) {
     if (targetType === "invoice")
         return "Invoice";
     return reminderTargetLabels[targetType] ?? targetType;
 }
-function formatReminderTiming(targetType, days) {
-    if (!dueDateTargetTypes.has(targetType))
-        return "Event";
-    if (days === 0)
-        return "Due date";
-    return days < 0 ? `${Math.abs(days)} days before` : `${days} days after`;
-}
-export function NotificationReminderRulesPage() {
+export function NotificationReminderRulesPage({ manageStagesHref = (id) => `/notifications/reminder-rules/${id}`, } = {}) {
     const [search, setSearch] = useState("");
     const [channel, setChannel] = useState("all");
     const [status, setStatus] = useState("all");
@@ -45,10 +35,10 @@ export function NotificationReminderRulesPage() {
     return (_jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-bold tracking-tight", children: "Reminder Rules" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Schedule booking payment reminders and event notifications against templates and channels." })] }), _jsxs(Button, { onClick: () => {
                             setEditing(undefined);
                             setDialogOpen(true);
-                        }, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "New Rule"] })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "relative max-w-sm flex-1", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { placeholder: "Search rules...", value: search, onChange: (event) => setSearch(event.target.value), className: "pl-9" })] }), _jsxs(Select, { value: targetType, onValueChange: (value) => setTargetType(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[190px]", children: _jsx(SelectValue, { placeholder: "Target" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All targets" }), Object.entries(reminderTargetLabels).map(([value, label]) => (_jsx(SelectItem, { value: value, children: label }, value)))] })] }), _jsxs(Select, { value: channel, onValueChange: (value) => setChannel(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: "Channel" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All channels" }), _jsx(SelectItem, { value: "email", children: "Email" }), _jsx(SelectItem, { value: "sms", children: "SMS" })] })] }), _jsxs(Select, { value: status, onValueChange: (value) => setStatus(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All statuses" }), _jsx(SelectItem, { value: "draft", children: "Draft" }), _jsx(SelectItem, { value: "active", children: "Active" }), _jsx(SelectItem, { value: "archived", children: "Archived" })] })] })] }), 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: "No reminder rules yet." }) })) : 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: "Rule" }), _jsx("th", { className: "px-4 py-3", children: "Target" }), _jsx("th", { className: "px-4 py-3", children: "Channel" }), _jsx("th", { className: "px-4 py-3", children: "Timing" }), _jsx("th", { className: "px-4 py-3", children: "Status" }), _jsx("th", { className: "px-4 py-3 text-right", children: "Actions" })] }) }), _jsx("tbody", { children: data.data.map((rule) => (_jsxs("tr", { className: "border-t", children: [_jsx("td", { className: "px-4 py-3", children: _jsx("div", { className: "font-medium", children: rule.name }) }), _jsx("td", { className: "px-4 py-3", children: getReminderTargetLabel(rule.targetType) }), _jsx("td", { className: "px-4 py-3", children: _jsx(Badge, { variant: "outline", children: rule.channel }) }), _jsx("td", { className: "px-4 py-3", children: formatReminderTiming(rule.targetType, rule.relativeDaysFromDueDate) }), _jsx("td", { className: "px-4 py-3", children: _jsx(Badge, { variant: rule.status === "active" ? "default" : "secondary", children: rule.status }) }), _jsx("td", { className: "px-4 py-3 text-right", children: _jsx(Button, { variant: "ghost", size: "sm", onClick: () => {
-                                                setEditing(rule);
-                                                setDialogOpen(true);
-                                            }, children: _jsx(Pencil, { className: "h-4 w-4" }) }) })] }, rule.id))) })] }) })) : null, _jsx(NotificationReminderRuleDialog, { open: dialogOpen, onOpenChange: setDialogOpen, rule: editing, onSuccess: () => {
+                        }, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "New Rule"] })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "relative max-w-sm flex-1", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { placeholder: "Search rules...", value: search, onChange: (event) => setSearch(event.target.value), className: "pl-9" })] }), _jsxs(Select, { value: targetType, onValueChange: (value) => setTargetType(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[190px]", children: _jsx(SelectValue, { placeholder: "Target" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All targets" }), Object.entries(reminderTargetLabels).map(([value, label]) => (_jsx(SelectItem, { value: value, children: label }, value)))] })] }), _jsxs(Select, { value: channel, onValueChange: (value) => setChannel(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: "Channel" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All channels" }), _jsx(SelectItem, { value: "email", children: "Email" }), _jsx(SelectItem, { value: "sms", children: "SMS" })] })] }), _jsxs(Select, { value: status, onValueChange: (value) => setStatus(value ?? "all"), children: [_jsx(SelectTrigger, { className: "w-[140px]", children: _jsx(SelectValue, { placeholder: "Status" }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "all", children: "All statuses" }), _jsx(SelectItem, { value: "draft", children: "Draft" }), _jsx(SelectItem, { value: "active", children: "Active" }), _jsx(SelectItem, { value: "archived", children: "Archived" })] })] })] }), 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: "No reminder rules yet." }) })) : 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: "Rule" }), _jsx("th", { className: "px-4 py-3", children: "Target" }), _jsx("th", { className: "px-4 py-3", children: "Channel" }), _jsx("th", { className: "px-4 py-3", children: "Status" }), _jsx("th", { className: "px-4 py-3 text-right", children: "Actions" })] }) }), _jsx("tbody", { children: data.data.map((rule) => (_jsxs("tr", { className: "border-t", children: [_jsx("td", { className: "px-4 py-3", children: _jsx("div", { className: "font-medium", children: rule.name }) }), _jsx("td", { className: "px-4 py-3", children: getReminderTargetLabel(rule.targetType) }), _jsx("td", { className: "px-4 py-3", children: _jsx(Badge, { variant: "outline", children: rule.channel }) }), _jsx("td", { className: "px-4 py-3", children: _jsx(Badge, { variant: rule.status === "active" ? "default" : "secondary", children: rule.status }) }), _jsx("td", { className: "px-4 py-3 text-right", children: _jsxs("div", { className: "flex items-center justify-end gap-1", children: [_jsxs("a", { href: manageStagesHref(rule.id), className: buttonVariants({ variant: "ghost", size: "sm" }), children: [_jsx(Layers, { className: "mr-2 h-4 w-4" }), "Manage stages"] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => {
+                                                        setEditing(rule);
+                                                        setDialogOpen(true);
+                                                    }, children: _jsx(Pencil, { className: "h-4 w-4" }) })] }) })] }, rule.id))) })] }) })) : null, _jsx(NotificationReminderRuleDialog, { open: dialogOpen, onOpenChange: setDialogOpen, rule: editing, onSuccess: () => {
                     setDialogOpen(false);
                     setEditing(undefined);
                     void refetch();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@voyantjs/ui",
-  "version": "0.28.3",
+  "version": "0.30.0",
   "license": "Apache-2.0",
   "type": "module",
   "sideEffects": false,
@@ -35,10 +35,10 @@
     "tw-animate-css": "^1.3.5",
     "vaul": "^1.1.2",
     "zod": "^4.3.6",
-    "@voyantjs/i18n": "0.28.3",
-    "@voyantjs/notifications": "0.28.3",
-    "@voyantjs/notifications-react": "0.28.3",
-    "@voyantjs/utils": "0.28.3"
+    "@voyantjs/i18n": "0.30.0",
+    "@voyantjs/notifications": "0.30.0",
+    "@voyantjs/notifications-react": "0.30.0",
+    "@voyantjs/utils": "0.30.0"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.1.11",