@mohasinac/appkit 4.71.0 → 4.71.2

package/dist/features/site-settings/components/NavPermissionsManager.js

@@ -4,20 +4,27 @@ import { normalizeError } from "../../../errors/normalize.js";
 import { useState, useTransition } from "react";
 import { Code, Table, Tbody, Td, Th, Thead, Tr } from "../../../ui/components/Semantic.js";
 import { Div } from "../../../ui/components/Div.js";
-import { Stack } from "../../../ui/components/Layout.js";
+import { Stack, Row } from "../../../ui/components/Layout.js";
 import { Text } from "../../../ui/components/Typography.js";
 import { Toggle } from "../../../ui/components/Toggle.js";
+import { Button } from "../../../ui/components/Button.js";
+import { IconButton } from "../../../ui/components/IconButton.js";
+import { Icon } from "../../../ui/components/Icon.js";
+import { FieldSelect } from "../../../ui/forms/FieldSelect.js";
 import { useToast } from "../../../ui/components/toast-context.js";
+import { sortByFieldOrder } from "../../shell/field-ui-meta.js";
 const __O = {
     hidden: "overflow-hidden",
 };
-export function NavPermissionsManager({ initialConfig, navGroups, onUpdate, }) {
+export function NavPermissionsManager({ initialConfig, navGroups, onUpdate, onReorder, availableToAdd, onAdd, onRemove, customNavIds, }) {
+    const [addingId, setAddingId] = useState("");
+    const [addingGroup, setAddingGroup] = useState("");
     const { showToast } = useToast();
     const [config, setConfig] = useState(initialConfig);
     const [, startTransition] = useTransition();
     const handleToggle = (navId, label, enabled) => {
         const prev = config;
-        setConfig((c) => ({ ...c, [navId]: { enabled } }));
+        setConfig((c) => ({ ...c, [navId]: { enabled, order: c[navId]?.order } }));
         startTransition(async () => {
             try {
                 await onUpdate(navId, enabled);
@@ -31,12 +38,81 @@ export function NavPermissionsManager({ initialConfig, navGroups, onUpdate, }) {
         });
     };
     const isEnabled = (id) => config[id]?.enabled ?? true;
-    return (_jsx(Stack, { gap: "lg", children: navGroups.map((group) => (_jsxs(Div, { children: [_jsx(Text, { className: "mb-3 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: group.groupLabel }), _jsx(Div, { className: `${__O.hidden}`, rounded: "xl", border: "default", children: _jsxs(Table, { size: "sm", children: [_jsx(Thead, { children: _jsxs(Tr, { surface: "subtle", border: "default", children: [_jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Nav Item" }), _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Route" }), _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Permission" }), _jsx(Th, { className: "text-right", padding: "md", color: "primary", weight: "semibold", children: "Enabled" })] }) }), _jsx(Tbody, { children: group.items.map((item, idx) => {
+    const orderedItems = (items) => {
+        const fieldOrder = Object.entries(config)
+            .filter((entry) => typeof entry[1].order === "number")
+            .sort((a, b) => a[1].order - b[1].order)
+            .map(([id]) => id);
+        return fieldOrder.length > 0 ? sortByFieldOrder(items, fieldOrder, (item) => item.id ?? "") : items;
+    };
+    const handleMove = (group, navId, direction) => {
+        const sorted = orderedItems(group.items).filter((i) => i.id);
+        const idx = sorted.findIndex((i) => i.id === navId);
+        const swapWith = idx + direction;
+        if (idx === -1 || swapWith < 0 || swapWith >= sorted.length)
+            return;
+        const reordered = [...sorted];
+        [reordered[idx], reordered[swapWith]] = [reordered[swapWith], reordered[idx]];
+        const orderedIds = reordered.map((i) => i.id);
+        const prev = config;
+        setConfig((c) => {
+            const next = { ...c };
+            orderedIds.forEach((id, index) => {
+                next[id] = { enabled: next[id]?.enabled ?? true, order: index };
+            });
+            return next;
+        });
+        startTransition(async () => {
+            try {
+                await onReorder?.(orderedIds);
+            }
+            catch (_err) {
+                void normalizeError(_err);
+                setConfig(prev);
+                showToast("Failed to reorder navigation. Please try again.", "error");
+            }
+        });
+    };
+    const handleAdd = (groupLabel) => {
+        const item = availableToAdd?.find((i) => i.id === addingId);
+        if (!item)
+            return;
+        startTransition(async () => {
+            try {
+                await onAdd?.(groupLabel, item);
+                showToast(`"${item.label}" added to ${groupLabel}.`, "success");
+                setAddingId("");
+            }
+            catch (_err) {
+                void normalizeError(_err);
+                showToast("Failed to add nav entry. Please try again.", "error");
+            }
+        });
+    };
+    const handleRemove = (navId, label) => {
+        startTransition(async () => {
+            try {
+                await onRemove?.(navId);
+                showToast(`"${label}" removed.`, "success");
+            }
+            catch (_err) {
+                void normalizeError(_err);
+                showToast("Failed to remove nav entry. Please try again.", "error");
+            }
+        });
+    };
+    return (_jsx(Stack, { gap: "lg", children: navGroups.map((group) => (_jsxs(Div, { children: [_jsx(Text, { className: "mb-3 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: group.groupLabel }), _jsx(Div, { className: `${__O.hidden}`, rounded: "xl", border: "default", children: _jsxs(Table, { size: "sm", children: [_jsx(Thead, { children: _jsxs(Tr, { surface: "subtle", border: "default", children: [onReorder && _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Order" }), _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Nav Item" }), _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Route" }), _jsx(Th, { className: "text-left", padding: "md", color: "primary", weight: "semibold", children: "Permission" }), _jsx(Th, { className: "text-right", padding: "md", color: "primary", weight: "semibold", children: "Enabled" })] }) }), _jsx(Tbody, { children: orderedItems(group.items).map((item, idx, sorted) => {
                                     const hasId = !!item.id;
                                     const enabled = hasId ? isEnabled(item.id) : true;
                                     return (_jsxs(Tr, { className: [
                                             idx % 2 === 0 ? "bg-[var(--appkit-color-surface)]" : "bg-zinc-50/50 bg-[var(--appkit-color-surface-elevated)]/50",
                                             !enabled ? "opacity-60" : "",
-                                        ].join(" "), children: [_jsx(Td, { padding: "md", children: _jsxs(Div, { children: [_jsx(Text, { weight: "medium", color: "primary", children: item.label }), item.id && (_jsx(Text, { size: "xs", color: "faint", children: item.id }))] }) }), _jsx(Td, { padding: "md", children: _jsx(Code, { color: "muted", size: "xs", children: item.href }) }), _jsx(Td, { padding: "md", children: item.requiredPermission ? (_jsx(Code, { className: "bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text)]", padding: "sm", size: "xs", rounded: "default", children: item.requiredPermission })) : (_jsx(Text, { size: "xs", color: "faint", children: "\u2014" })) }), _jsx(Td, { className: "text-right", padding: "md", children: hasId ? (_jsx(Toggle, { checked: enabled, onChange: (v) => handleToggle(item.id, item.label, v), "aria-label": `Toggle ${item.label}` })) : (_jsx(Text, { className: "italic", size: "xs", color: "faint", children: "Legacy \u2014 always visible" })) })] }, item.href));
-                                }) })] }) })] }, group.groupLabel))) }));
+                                        ].join(" "), children: [onReorder && (_jsx(Td, { padding: "md", children: hasId ? (_jsxs(Stack, { className: "gap-[0.125rem]", children: [_jsx(Button, { variant: "ghost", type: "button", onClick: () => handleMove(group, item.id, -1), disabled: idx === 0, className: "text-zinc-400 hover:text-[var(--appkit-color-text)] disabled:opacity-30 leading-none text-[length:var(--appkit-text-xs)] p-[var(--appkit-space-0)] min-h-0 h-auto rounded-none", "aria-label": `Move ${item.label} up`, children: "\u25B2" }), _jsx(Button, { variant: "ghost", type: "button", onClick: () => handleMove(group, item.id, 1), disabled: idx >= sorted.length - 1, className: "text-zinc-400 hover:text-[var(--appkit-color-text)] disabled:opacity-30 leading-none text-[length:var(--appkit-text-xs)] p-[var(--appkit-space-0)] min-h-0 h-auto rounded-none", "aria-label": `Move ${item.label} down`, children: "\u25BC" })] })) : (_jsx(Text, { size: "xs", color: "faint", children: "\u2014" })) })), _jsx(Td, { padding: "md", children: _jsxs(Div, { children: [_jsx(Text, { weight: "medium", color: "primary", children: item.label }), item.id && (_jsx(Text, { size: "xs", color: "faint", children: item.id }))] }) }), _jsx(Td, { padding: "md", children: _jsx(Code, { color: "muted", size: "xs", children: item.href }) }), _jsx(Td, { padding: "md", children: item.requiredPermission ? (_jsx(Code, { className: "bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text)]", padding: "sm", size: "xs", rounded: "default", children: item.requiredPermission })) : (_jsx(Text, { size: "xs", color: "faint", children: "\u2014" })) }), _jsx(Td, { className: "text-right", padding: "md", children: _jsxs(Row, { gap: "xs", align: "center", justify: "end", children: [hasId ? (_jsx(Toggle, { checked: enabled, onChange: (v) => handleToggle(item.id, item.label, v), "aria-label": `Toggle ${item.label}` })) : (_jsx(Text, { className: "italic", size: "xs", color: "faint", children: "Legacy \u2014 always visible" })), hasId && customNavIds?.has(item.id) && onRemove ? (_jsx(IconButton, { "aria-label": `Remove "${item.label}"`, icon: _jsx(Icon, { name: "delete", size: "sm" }), size: "sm", variant: "ghost", onClick: () => handleRemove(item.id, item.label) })) : null] }) })] }, item.href));
+                                }) })] }) }), availableToAdd && availableToAdd.length > 0 && onAdd ? (_jsx(AddNavEntryRow, { groupLabel: group.groupLabel, availableToAdd: availableToAdd.filter((candidate) => !group.items.some((existing) => existing.id === candidate.id)), addingId: addingId, onSelect: setAddingId, onAdd: () => handleAdd(group.groupLabel) })) : null] }, group.groupLabel))) }));
+}
+function AddNavEntryRow({ groupLabel, availableToAdd, addingId, onSelect, onAdd, }) {
+    if (availableToAdd.length === 0) {
+        return (_jsxs(Text, { className: "mt-2", size: "xs", color: "faint", children: ["Every available entry is already in ", groupLabel, "."] }));
+    }
+    return (_jsxs(Row, { className: "mt-2", gap: "xs", align: "end", wrap: true, children: [_jsx(FieldSelect, { name: `add-nav-${groupLabel}`, label: "Add entry", value: addingId, options: availableToAdd.map((i) => ({ value: i.id ?? i.href, label: i.label })), onChange: onSelect }), _jsxs(Button, { variant: "outline", size: "sm", type: "button", disabled: !addingId, onClick: onAdd, children: ["Add to ", groupLabel] })] }));
 }

package/dist/features/site-settings/components/ThemeManagerView.js

@@ -14,7 +14,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * persistence pipeline they use.
  */
 import { useMemo, useState, useCallback } from "react";
-import { BUILT_IN_THEMES, REQUIRED_GRADIENT_KEYS, REQUIRED_THEME_TOKENS, } from "../../../tokens/themes/index.js";
+import { BUILT_IN_THEMES, REQUIRED_GRADIENT_KEYS, REQUIRED_THEME_TOKENS, getDefaultBuiltInTheme, } from "../../../tokens/themes/index.js";
+import { findContrastIssues } from "../../../tokens/contrast.js";
 import { Alert } from "../../../ui/components/Alert.js";
 import { Button } from "../../../ui/components/Button.js";
 import { Div } from "../../../ui/components/Div.js";
@@ -51,6 +52,12 @@ const TOKEN_GROUPS = [
     { label: "Fonts", keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-font-")) },
     { label: "Spacing scale", keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-space-")) },
     { label: "Font-size scale", keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-text-")) },
+    { label: "Radius scale", keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-radius-")) },
+    { label: "Letter spacing", keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-tracking-")) },
+    {
+        label: "Motion",
+        keys: REQUIRED_THEME_TOKENS.filter((k) => k.startsWith("appkit-duration-") || k.startsWith("appkit-ease-")),
+    },
 ];
 function isBuiltInId(id) {
     return BUILT_IN_THEMES.some((t) => t.id === id);
@@ -102,7 +109,20 @@ function ThemeEditor({ draft, readOnly, onChange, onSave, onCancel, }) {
             gradients: { ...draft.gradients, [key]: value },
         });
     }, [draft, onChange]);
-    return (_jsx(Section, { padding: "md", surface: "card", border: "default", rounded: "lg", children: _jsxs(Stack, { gap: "md", children: [_jsxs(Row, { align: "end", justify: "between", gap: "md", wrap: true, children: [_jsxs(Stack, { gap: "sm", children: [_jsx(Input, { label: "Name", value: draft.name, onChange: (event) => onChange({ ...draft, name: event.target.value }), disabled: readOnly }), _jsx(Input, { label: "Id (slug)", value: draft.id, onChange: (event) => onChange({ ...draft, id: slugify(event.target.value) }), disabled: readOnly || draft.builtIn === true })] }), _jsx(Select, { label: "Mode", options: MODE_OPTIONS, value: draft.mode, onValueChange: (next) => onChange({ ...draft, mode: next }), disabled: readOnly })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "CSS variable tokens" }), _jsxs(Text, { size: "xs", color: "muted", children: ["Each key is written as ", _jsx("code", { children: "--key" }), " on ", _jsx("code", { children: "<html>" }), " ", "when this theme is active. Empty values fall back to the active mode\u2019s built-in theme."] }), TOKEN_GROUPS.map((group) => (_jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "xs", weight: "semibold", color: "muted", children: group.label }), _jsx(Grid, { cols: 2, gap: "sm", children: group.keys.map((key) => (_jsx(Input, { label: key, value: draft.tokens[key] ?? "", onChange: (event) => updateToken(key, event.target.value), disabled: readOnly, placeholder: "inherits from built-in" }, key))) })] }, group.label)))] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Gradients" }), _jsxs(Text, { size: "xs", color: "muted", children: ["Each gradient is a complete CSS expression \u2014 vary direction, stops, opacity, and easing per theme. Tokens flow through", " ", _jsxs("code", { children: ["--appkit-gradient-", "<key>"] }), "."] }), _jsx(Stack, { gap: "sm", children: REQUIRED_GRADIENT_KEYS.map((key) => (_jsx(Textarea, { label: key, rows: 2, value: draft.gradients[key] ?? "", onChange: (event) => updateGradient(key, event.target.value), disabled: readOnly, placeholder: "linear-gradient(...)" }, key))) })] }), _jsxs(Row, { gap: "sm", justify: "end", children: [_jsx(Button, { variant: "ghost", onClick: onCancel, children: "Cancel" }), !readOnly ? (_jsx(Button, { variant: "primary", onClick: onSave, children: "Save theme" })) : null] })] }) }));
+    /*
+     * Live AAA check — same pair set `audit-color-contrast.mjs` enforces at
+     * build time, run here against the draft so an admin sees a failure
+     * before saving rather than discovering it in the next `npm run check`.
+     * Resolved the same way `ThemeProvider.applyTheme` effectively resolves a
+     * theme: the draft's own overrides over its mode's built-in fallback — a
+     * key the draft has not touched yet still has a real value to measure.
+     */
+    const contrastIssues = useMemo(() => {
+        const fallback = getDefaultBuiltInTheme(draft.mode);
+        const effectiveTokens = { ...fallback.tokens, ...draft.tokens };
+        return findContrastIssues(effectiveTokens, draft.mode);
+    }, [draft.tokens, draft.mode]);
+    return (_jsx(Section, { padding: "md", surface: "card", border: "default", rounded: "lg", children: _jsxs(Stack, { gap: "md", children: [_jsxs(Row, { align: "end", justify: "between", gap: "md", wrap: true, children: [_jsxs(Stack, { gap: "sm", children: [_jsx(Input, { label: "Name", value: draft.name, onChange: (event) => onChange({ ...draft, name: event.target.value }), disabled: readOnly }), _jsx(Input, { label: "Id (slug)", value: draft.id, onChange: (event) => onChange({ ...draft, id: slugify(event.target.value) }), disabled: readOnly || draft.builtIn === true })] }), _jsx(Select, { label: "Mode", options: MODE_OPTIONS, value: draft.mode, onValueChange: (next) => onChange({ ...draft, mode: next }), disabled: readOnly })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "CSS variable tokens" }), _jsxs(Text, { size: "xs", color: "muted", children: ["Each key is written as ", _jsx("code", { children: "--key" }), " on ", _jsx("code", { children: "<html>" }), " ", "when this theme is active. Empty values fall back to the active mode\u2019s built-in theme."] }), TOKEN_GROUPS.map((group) => (_jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "xs", weight: "semibold", color: "muted", children: group.label }), _jsx(Grid, { cols: 2, gap: "sm", children: group.keys.map((key) => (_jsx(Input, { label: key, value: draft.tokens[key] ?? "", onChange: (event) => updateToken(key, event.target.value), disabled: readOnly, placeholder: "inherits from built-in" }, key))) })] }, group.label)))] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Gradients" }), _jsxs(Text, { size: "xs", color: "muted", children: ["Each gradient is a complete CSS expression \u2014 vary direction, stops, opacity, and easing per theme. Tokens flow through", " ", _jsxs("code", { children: ["--appkit-gradient-", "<key>"] }), "."] }), _jsx(Stack, { gap: "sm", children: REQUIRED_GRADIENT_KEYS.map((key) => (_jsx(Textarea, { label: key, rows: 2, value: draft.gradients[key] ?? "", onChange: (event) => updateGradient(key, event.target.value), disabled: readOnly, placeholder: "linear-gradient(...)" }, key))) })] }), contrastIssues.length > 0 ? (_jsx(Alert, { variant: "error", children: _jsxs(Stack, { gap: "xs", children: [_jsxs(Text, { size: "sm", weight: "semibold", children: [contrastIssues.length, " colour pairing", contrastIssues.length === 1 ? "" : "s", " fail", contrastIssues.length === 1 ? "s" : "", " WCAG AAA \u2014 fix before saving."] }), contrastIssues.map((issue) => (_jsxs(Text, { size: "xs", children: [issue.label, ": ", issue.ratio.toFixed(2), ":1, needs ", issue.min, ":1."] }, issue.label)))] }) })) : null, _jsxs(Row, { gap: "sm", justify: "end", children: [_jsx(Button, { variant: "ghost", onClick: onCancel, children: "Cancel" }), !readOnly ? (_jsx(Button, { variant: "primary", onClick: onSave, disabled: contrastIssues.length > 0, children: "Save theme" })) : null] })] }) }));
 }
 export function ThemeManagerView({ value, onChange, previewOrigin = "/", }) {
     const [editingId, setEditingId] = useState(null);

package/dist/features/sticker-trace/components/StickerRunHistoryPanel.d.ts

@@ -41,5 +41,12 @@ export interface StickerRunHistoryPanelProps {
      * active one spends the whole render budget to reach the state it is in.
      */
     onPromote?: (run: StickerRunRow) => void;
+    /**
+     * Re-fetch the list from Firestore. A one-shot, user-triggered fetch, not
+     * an interval — `audit-client-poll-cost` blocks a standing poll, but it says
+     * nothing about a button a human presses once to check a `queued` row that
+     * has not moved.
+     */
+    onRefresh?: () => void;
 }
-export declare function StickerRunHistoryPanel({ runs, loading, onOpenAsset, onRetry, onPromote, }: StickerRunHistoryPanelProps): import("react").JSX.Element;
+export declare function StickerRunHistoryPanel({ runs, loading, onOpenAsset, onRetry, onPromote, onRefresh, }: StickerRunHistoryPanelProps): import("react").JSX.Element;

package/dist/features/sticker-trace/components/StickerRunHistoryPanel.js

@@ -30,9 +30,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
 import { Badge } from "../../../ui/components/Badge.js";
 import { Button } from "../../../ui/components/Button.js";
-import { Card } from "../../../ui/components/Card.js";
 import { Heading, Span, Text } from "../../../ui/components/Typography.js";
 import { Row, Stack } from "../../../ui/components/Layout.js";
+import { DataTable } from "../../../ui/DataTable.js";
 import { TIER_HELP } from "../constants/help-content.js";
 /**
  * 🛑 `succeeded` is NOT the same as `isActive`, and the badges keep them apart.
@@ -73,16 +73,48 @@ const STAMP = {
     minute: "2-digit",
     hour12: false,
 };
-export function StickerRunHistoryPanel({ runs, loading = false, onOpenAsset, onRetry, onPromote, }) {
+export function StickerRunHistoryPanel({ runs, loading = false, onOpenAsset, onRetry, onPromote, onRefresh, }) {
     const open = useCallback((runId, kind) => () => onOpenAsset?.(runId, kind), [onOpenAsset]);
     const sorted = useMemo(() => [...runs].sort((a, b) => b.createdAt.localeCompare(a.createdAt)), [runs]);
-    if (loading) {
-        return (_jsx(Card, { variant: "default", children: _jsx(Text, { color: "muted", children: "Loading attempts\u2026" }) }));
-    }
-    if (sorted.length === 0) {
-        return (_jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "dense", children: [_jsx(Heading, { level: 3, children: "Attempts" }), _jsx(Text, { color: "muted", children: "No runs yet. Tune the parameters above, give the attempt a name, and commit it \u2014 every attempt is kept so you can compare them later." })] }) }));
-    }
-    return (_jsxs(Stack, { gap: "comfortable", children: [_jsxs(Heading, { level: 3, children: ["Attempts (", sorted.length, ")"] }), sorted.map((run) => (_jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "dense", children: [_jsxs(Row, { align: "center", justify: "between", gap: "sm", wrap: true, children: [_jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { weight: "bold", children: run.name }), _jsx(Badge, { variant: statusTone(run.status), children: run.status }), run.isActive ? _jsx(Badge, { variant: "info", children: "accepted" }) : null, run.isPromoted ? _jsx(Badge, { variant: "success", children: "promoted" }) : null] }), _jsx(Text, { size: "xs", color: "muted", children: new Date(run.createdAt).toLocaleString("en-GB", STAMP) })] }), _jsxs(Text, { size: "sm", color: "muted", children: [TIER_HELP[run.tier]?.title ?? run.tier, " · ", run.partCount, " part", run.partCount === 1 ? "" : "s", run.groupCount > 1 ? ` in ${run.groupCount} sheets` : "", " · ", formatDuration(run.durationMs)] }), run.status === "failed" && run.error ? (_jsxs(Text, { size: "sm", color: "error", role: "alert", children: ["Failed at ", _jsx(Span, { weight: "semibold", children: run.error.stage }), typeof run.error.partOrdinal === "number"
-                                    ? ` on part ${run.error.partOrdinal}`
-                                    : "", ": ", run.error.message] })) : null, run.status === "running" && run.stage ? (_jsxs(Text, { size: "sm", color: "muted", children: ["Currently in ", _jsx(Span, { weight: "semibold", children: run.stage }), "."] })) : null, _jsxs(Row, { gap: "sm", wrap: true, children: [run.has.preview ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "preview"), children: "Preview" })) : null, run.has.overlay ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "overlay"), children: "Overlay" })) : null, run.has.cutSvg ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "cutSvg"), children: "Cut file" })) : null, onRetry ? (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onRetry(run), children: "Retry from this" })) : null, onPromote && run.status === "succeeded" && !run.isActive ? (_jsx(Button, { size: "sm", variant: "primary", onClick: () => onPromote(run), children: "Accept & render" })) : null] })] }) }, run.id)))] }));
+    const columns = useMemo(() => [
+        {
+            key: "name",
+            header: "Name",
+            sortable: true,
+            render: (run) => (_jsxs(Stack, { gap: "dense", children: [_jsxs(Row, { align: "center", gap: "sm", wrap: true, children: [_jsx(Text, { weight: "bold", children: run.name }), run.isActive ? _jsx(Badge, { variant: "info", children: "accepted" }) : null, run.isPromoted ? _jsx(Badge, { variant: "success", children: "promoted" }) : null] }), run.status === "failed" && run.error ? (_jsxs(Text, { size: "sm", color: "error", role: "alert", children: ["Failed at ", _jsx(Span, { weight: "semibold", children: run.error.stage }), typeof run.error.partOrdinal === "number"
+                                ? ` on part ${run.error.partOrdinal}`
+                                : "", ": ", run.error.message] })) : null, run.status === "running" && run.stage ? (_jsxs(Text, { size: "sm", color: "muted", children: ["Currently in ", _jsx(Span, { weight: "semibold", children: run.stage }), "."] })) : null] })),
+        },
+        {
+            key: "status",
+            header: "Status",
+            sortable: true,
+            render: (run) => _jsx(Badge, { variant: statusTone(run.status), children: run.status }),
+        },
+        {
+            key: "tier",
+            header: "Tier",
+            sortable: true,
+            render: (run) => TIER_HELP[run.tier]?.title ?? run.tier,
+        },
+        {
+            key: "partCount",
+            header: "Parts",
+            sortable: true,
+            render: (run) => `${run.partCount}${run.groupCount > 1 ? ` (${run.groupCount} sheets)` : ""}`,
+        },
+        {
+            key: "durationMs",
+            header: "Duration",
+            sortable: true,
+            render: (run) => formatDuration(run.durationMs),
+        },
+        {
+            key: "createdAt",
+            header: "Created",
+            sortable: true,
+            render: (run) => new Date(run.createdAt).toLocaleString("en-GB", STAMP),
+        },
+    ], []);
+    return (_jsxs(Stack, { gap: "comfortable", children: [_jsxs(Row, { align: "center", justify: "between", gap: "sm", wrap: true, children: [_jsxs(Heading, { level: 3, children: ["Attempts (", sorted.length, ")"] }), onRefresh ? (_jsx(Button, { size: "sm", variant: "ghost", onClick: onRefresh, isLoading: loading, children: "Refresh" })) : null] }), _jsx(DataTable, { data: sorted, columns: columns, loading: loading, emptyMessage: "No runs yet. Tune the parameters above, give the attempt a name, and commit it \u2014 every attempt is kept so you can compare them later.", showViewToggle: false, actions: (run) => (_jsxs(Row, { gap: "sm", wrap: true, children: [run.has.preview ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "preview"), children: "Preview" })) : null, run.has.overlay ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "overlay"), children: "Overlay" })) : null, run.has.cutSvg ? (_jsx(Button, { size: "sm", variant: "secondary", onClick: open(run.id, "cutSvg"), children: "Cut file" })) : null, onRetry ? (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onRetry(run), children: "Retry from this" })) : null, onPromote && run.status === "succeeded" && !run.isActive ? (_jsx(Button, { size: "sm", variant: "primary", onClick: () => onPromote(run), children: "Accept & render" })) : null] })) })] }));
 }

package/dist/features/sticker-trace/components/StickerTraceStudio.js

@@ -76,6 +76,22 @@ export function StickerTraceStudio({ renderCommit }) {
     const [source, setSource] = useState(null);
     const [params, setParams] = useState(() => paramsForTier(TIER));
     const canvasRef = useRef(null);
+    /*
+     * The raw scan, shown immediately — before any trace exists. The canvas
+     * below answers "what will this cut"; this answers "what did I pick",
+     * which otherwise had no answer until the first trace finished (or never,
+     * if it errored). An object URL, not a data URL: a multi-megabyte scan
+     * through `FileReader.readAsDataURL` would duplicate the whole file as a
+     * base64 string purely to display it.
+     */
+    const [previewUrl, setPreviewUrl] = useState(null);
+    const previewUrlRef = useRef(null);
+    useEffect(() => {
+        return () => {
+            if (previewUrlRef.current)
+                URL.revokeObjectURL(previewUrlRef.current);
+        };
+    }, []);
     const { parts, diagnostics, raster, tracing, lastMs, error } = useLiveTrace(source, params);
     /*
      * The scan's natural size, probed once per file.
@@ -117,6 +133,11 @@ export function StickerTraceStudio({ renderCommit }) {
     }, [source]);
     const onFile = useCallback((picked) => {
         setFile(picked);
+        if (previewUrlRef.current)
+            URL.revokeObjectURL(previewUrlRef.current);
+        const url = URL.createObjectURL(picked);
+        previewUrlRef.current = url;
+        setPreviewUrl(url);
         void picked.arrayBuffer().then((buf) => setSource(new Uint8Array(buf)));
     }, []);
     const setParam = useCallback((key, value) => {
@@ -160,17 +181,17 @@ export function StickerTraceStudio({ renderCommit }) {
         }
     }, [raster, parts]);
     const bgLabel = useMemo(() => (diagnostics ? (diagnostics.paperColour ? "paper" : "art") : "—"), [diagnostics]);
-    return (_jsx(Section, { children: _jsxs(Stack, { gap: "comfortable", children: [_jsxs(Row, { gap: "comfortable", align: "center", children: [_jsx(FilePickerButton, { onFile: onFile, accept: "image/*", children: file ? "Choose a different scan" : "Choose a scan" }), file ? _jsx(Text, { size: "sm", color: "muted", children: file.name }) : null] }), error ? (_jsx(Card, { variant: "default", children: _jsx(Text, { color: "error", role: "alert", children: error }) })) : null, probeError ? (_jsx(Card, { variant: "default", children: _jsxs(Text, { color: "error", role: "alert", children: ["Could not read this scan's dimensions (", probeError, "). You can still tune it, but it cannot be committed as a run until that works \u2014 a run needs the real pixel size, not the preview's."] }) })) : null, source ? (_jsxs(Grid, { cols: "cards", children: [_jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "comfortable", children: [_jsx(Heading, { level: 3, children: "Parameters" }), CONTROLS.map((c) => (_jsxs(Stack, { gap: "dense", children: [_jsx(FieldInput, { name: c.key, type: "number", label: PARAM_HELP[c.key]?.title ?? c.key, step: c.step, value: String(params[c.key]), onChange: (v) => {
-                                                    const n = Number(v);
-                                                    // A half-typed "0." parses NaN; keeping the old value
-                                                    // beats re-tracing against a NaN and blanking the canvas.
-                                                    if (Number.isFinite(n))
-                                                        setParam(c.key, n);
-                                                } }), _jsx(Text, { size: "xs", color: "muted", children: PARAM_HELP[c.key]?.body })] }, c.key))), _jsx(FieldSelect, { name: "tier", label: "Tier", value: TIER, disabled: true, options: [{ value: TIER, label: TIER_HELP[TIER].title }], onChange: () => undefined }), _jsx(Text, { size: "xs", color: "muted", children: TIER_HELP[TIER].body })] }) }), _jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "dense", children: [_jsx(Heading, { level: 3, children: "Result" }), _jsxs(Text, { children: [_jsx(Span, { weight: "bold", children: parts.length }), " part(s)", diagnostics ? ` · ${diagnostics.droppedSheetSized} sheet-sized` : "", diagnostics ? ` · ${diagnostics.droppedBelowMinArea} too small` : ""] }), _jsxs(Text, { size: "sm", color: "muted", children: ["background: ", bgLabel, diagnostics
-                                                ? ` · ridge ${(diagnostics.ridgeCoverage * 100).toFixed(1)}%`
-                                                : "", lastMs !== null ? ` · ${lastMs} ms` : "", tracing ? " · tracing…" : ""] }), diagnostics && parts.length === 0 && diagnostics.droppedSheetSized >= 1 ? (_jsx(Text, { size: "sm", color: "warning", children: "No parts, and one component covers the whole sheet \u2014 this looks like several sheets in one scan, which is unsupported. Scan them individually or crop." })) : null] }) })] })) : (_jsx(Text, { color: "muted", children: "Pick a scanned sticker sheet to trace. Nothing is uploaded \u2014 the trace runs entirely in this tab." })), source ? (_jsx(Card, { variant: "default", children: _jsx("canvas", { ref: canvasRef, className: "w-full h-auto" }) })) : null, renderCommit?.({
-                    params,
-                    file,
-                    dimensions: natural,
-                })] }) }));
+    return (_jsx(Section, { children: _jsxs(Stack, { gap: "comfortable", children: [_jsxs(Row, { gap: "comfortable", align: "center", children: [_jsx(FilePickerButton, { onFile: onFile, accept: "image/*", children: file ? "Choose a different scan" : "Choose a scan" }), file ? _jsx(Text, { size: "sm", color: "muted", children: file.name }) : null] }), error ? (_jsx(Card, { variant: "default", children: _jsx(Text, { color: "error", role: "alert", children: error }) })) : null, probeError ? (_jsx(Card, { variant: "default", children: _jsxs(Text, { color: "error", role: "alert", children: ["Could not read this scan's dimensions (", probeError, "). You can still tune it, but it cannot be committed as a run until that works \u2014 a run needs the real pixel size, not the preview's."] }) })) : null, source ? (_jsxs(Grid, { cols: "halves", children: [_jsxs(Stack, { gap: "comfortable", children: [_jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "dense", children: [_jsx(Heading, { level: 3, children: "Preview" }), previewUrl ? (_jsx("img", { src: previewUrl, alt: "Uploaded scan", className: "w-full h-auto" })) : null, _jsx("canvas", { ref: canvasRef, className: "w-full h-auto" })] }) }), _jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "dense", children: [_jsx(Heading, { level: 3, children: "Result" }), _jsxs(Text, { children: [_jsx(Span, { weight: "bold", children: parts.length }), " part(s)", diagnostics ? ` · ${diagnostics.droppedSheetSized} sheet-sized` : "", diagnostics ? ` · ${diagnostics.droppedBelowMinArea} too small` : ""] }), _jsxs(Text, { size: "sm", color: "muted", children: ["background: ", bgLabel, diagnostics
+                                                        ? ` · ridge ${(diagnostics.ridgeCoverage * 100).toFixed(1)}%`
+                                                        : "", lastMs !== null ? ` · ${lastMs} ms` : "", tracing ? " · tracing…" : ""] }), diagnostics && parts.length === 0 && diagnostics.droppedSheetSized >= 1 ? (_jsx(Text, { size: "sm", color: "warning", children: "No parts, and one component covers the whole sheet \u2014 this looks like several sheets in one scan, which is unsupported. Scan them individually or crop." })) : null] }) })] }), _jsxs(Stack, { gap: "comfortable", children: [_jsx(Card, { variant: "default", children: _jsxs(Stack, { gap: "comfortable", children: [_jsx(Heading, { level: 3, children: "Parameters" }), CONTROLS.map((c) => (_jsxs(Stack, { gap: "dense", children: [_jsx(FieldInput, { name: c.key, type: "number", label: PARAM_HELP[c.key]?.title ?? c.key, step: c.step, value: String(params[c.key]), onChange: (v) => {
+                                                            const n = Number(v);
+                                                            // A half-typed "0." parses NaN; keeping the old value
+                                                            // beats re-tracing against a NaN and blanking the canvas.
+                                                            if (Number.isFinite(n))
+                                                                setParam(c.key, n);
+                                                        } }), _jsx(Text, { size: "xs", color: "muted", children: PARAM_HELP[c.key]?.body })] }, c.key))), _jsx(FieldSelect, { name: "tier", label: "Tier", value: TIER, disabled: true, options: [{ value: TIER, label: TIER_HELP[TIER].title }], onChange: () => undefined }), _jsx(Text, { size: "xs", color: "muted", children: TIER_HELP[TIER].body })] }) }), renderCommit?.({
+                                    params,
+                                    file,
+                                    dimensions: natural,
+                                })] })] })) : (_jsx(Text, { color: "muted", children: "Pick a scanned sticker sheet to trace. Nothing is uploaded \u2014 the trace runs entirely in this tab." }))] }) }));
 }

package/dist/features/sticker-trace/repository/sticker-sheets.repository.d.ts

@@ -45,7 +45,7 @@ export declare class StickerSheetsRepository extends BaseRepository<StickerSheet
      *
      * Matched on `ordinal`, never on array index — removing a part shifts every
      * later index by one, so an index-wise write renames the wrong sticker. Same
-     * rule as § "Lottery Config Writes" merges by `slotNumber`.
+     * rule as § "Giveaway Config Writes" merges by `slotNumber`.
      *
      * An unknown ordinal is a no-op that throws rather than a silent miss: the
      * caller named a part that is not on this sheet, and answering 200 to that

package/dist/features/sticker-trace/repository/sticker-sheets.repository.js

@@ -82,7 +82,7 @@ export class StickerSheetsRepository extends BaseRepository {
      *
      * Matched on `ordinal`, never on array index — removing a part shifts every
      * later index by one, so an index-wise write renames the wrong sticker. Same
-     * rule as § "Lottery Config Writes" merges by `slotNumber`.
+     * rule as § "Giveaway Config Writes" merges by `slotNumber`.
      *
      * An unknown ordinal is a no-op that throws rather than a silent miss: the
      * caller named a part that is not on this sheet, and answering 200 to that

package/dist/features/sticker-trace/repository/sticker-trace-runs.repository.d.ts

@@ -73,6 +73,14 @@ export declare class StickerTraceRunsRepository extends BaseRepository<StickerTr
      * own history, which is Root Cause #100.
      */
     listBySheet(sheetId: string, limit?: number): Promise<StickerTraceRunDocument[]>;
+    /**
+     * Runs stuck in one non-terminal status past a cutoff — the sweep's query.
+     *
+     * Covered by the existing `(status ASC, createdAt DESC)` composite index;
+     * no new index is needed. Queried per-status rather than `status in [...]`
+     * so the result stays a simple equality + range match against that index.
+     */
+    listStuckByStatus(status: StickerTraceRunDocument["status"], olderThan: Date, limit?: number): Promise<StickerTraceRunDocument[]>;
     listForAdmin(model: SieveModel): Promise<FirebaseSieveResult<StickerTraceRunDocument>>;
     /** Every Timestamp field carries `parseSieveDateValue` — Root Cause #47. */
     static readonly SIEVE_FIELDS: {

package/dist/features/sticker-trace/repository/sticker-trace-runs.repository.js

@@ -149,6 +149,21 @@ export class StickerTraceRunsRepository extends BaseRepository {
             .get();
         return snap.docs.map((doc) => this.mapDoc(doc));
     }
+    /**
+     * Runs stuck in one non-terminal status past a cutoff — the sweep's query.
+     *
+     * Covered by the existing `(status ASC, createdAt DESC)` composite index;
+     * no new index is needed. Queried per-status rather than `status in [...]`
+     * so the result stays a simple equality + range match against that index.
+     */
+    async listStuckByStatus(status, olderThan, limit = 50) {
+        const snap = await this.getCollection()
+            .where(STICKER_TRACE_RUN_FIELDS.STATUS, "==", status)
+            .where(STICKER_TRACE_RUN_FIELDS.CREATED_AT, "<", olderThan)
+            .limit(limit)
+            .get();
+        return snap.docs.map((doc) => this.mapDoc(doc));
+    }
     async listForAdmin(model) {
         return this.sieveQuery(model, StickerTraceRunsRepository.SIEVE_FIELDS, {
             defaultPageSize: 25,

package/dist/features/store-extensions/repository/store-extensions.repositories.d.ts

@@ -19,7 +19,7 @@
  *
  * The other ten hold no PII and use the BaseRepository public API only.
  */
-import { BaseRepository } from "../../../providers/db-firebase";
+import { BaseRepository, type DocumentSnapshot } from "../../../providers/db-firebase";
 import { type AnalyticsAlertDocument, type AnalyticsCardDocument, type ItemRequestDocument, type ItemRequestReply, type ListingTemplateDocument, type ModerationQueueDocument, type PayoutMethodDocument, type PayoutMethodPlain, type ReportDocument, type ShippingConfigDocument, type StoreCategoryDocument, type StoreGoogleConfigDocument, type StoreWhatsAppConfigDocument } from "../schemas/firestore";
 export declare class PayoutMethodsRepository extends BaseRepository<PayoutMethodDocument> {
     /**
@@ -104,6 +104,7 @@ export declare class ReportsRepository extends BaseRepository<ReportDocument> {
 }
 export declare class ItemRequestsRepository extends BaseRepository<ItemRequestDocument> {
     constructor();
+    protected mapDoc<D = ItemRequestDocument>(snap: DocumentSnapshot): D;
     listOpen(opts?: {
         limit?: number;
     }): Promise<{

package/dist/features/store-extensions/repository/store-extensions.repositories.js

@@ -148,6 +148,22 @@ export class ItemRequestsRepository extends BaseRepository {
     constructor() {
         super(ITEM_REQUESTS_COLLECTION);
     }
+    /*
+     * 🛑 Documents written before `replies`/`replyCount` existed have neither
+     * field — `DEFAULT_ITEM_REQUEST_DATA` is only applied at create time, and
+     * `BaseRepository.mapDoc` does no default-merge. `/item-requests/[id]`'s
+     * `.replies.length` then throws on a plain `undefined`, crashing the page
+     * for every viewport. Backfilled here so every read path (detail, list,
+     * Sieve) agrees, not just the one call site that happened to crash first.
+     */
+    mapDoc(snap) {
+        const raw = super.mapDoc(snap);
+        return {
+            ...raw,
+            replies: raw.replies ?? [],
+            replyCount: raw.replyCount ?? 0,
+        };
+    }
     async listOpen(opts) {
         const all = await this.findBy("status", "open");
         const limit = opts?.limit ?? 50;

package/dist/features/store-extensions/schemas/admin-notification-form.d.ts

@@ -16,17 +16,17 @@ export declare const adminNotificationCreateSchema: z.ZodObject<{
     entityType: z.ZodOptional<z.ZodString>;
     entityId: z.ZodOptional<z.ZodString>;
 }, "strict", z.ZodTypeAny, {
+    body: string;
     title: string;
     category: AdminNotificationCategory;
-    body: string;
     severity: "error" | "warning" | "info";
     entityId?: string | undefined;
     entityType?: string | undefined;
     audienceUserIds?: string[] | undefined;
 }, {
+    body: string;
     title: string;
     category: AdminNotificationCategory;
-    body: string;
     severity: "error" | "warning" | "info";
     entityId?: string | undefined;
     entityType?: string | undefined;

package/dist/features/store-extensions/schemas/analytics-forms.d.ts

@@ -40,15 +40,15 @@ export declare const analyticsCardCreateSchema: z.ZodObject<{
     position: z.ZodOptional<z.ZodNumber>;
     isVisible: z.ZodOptional<z.ZodBoolean>;
 }, "strict", z.ZodTypeAny, {
-    type: AnalyticsCardType;
     title: string;
+    type: AnalyticsCardType;
     metric: string;
     position?: number | undefined;
     filters?: Record<string, import("../../..").FirestoreValue> | undefined;
     isVisible?: boolean | undefined;
 }, {
-    type: AnalyticsCardType;
     title: string;
+    type: AnalyticsCardType;
     metric: string;
     position?: number | undefined;
     filters?: Record<string, import("../../..").FirestoreValue> | undefined;

package/dist/features/store-extensions/schemas/firestore.d.ts

@@ -1,5 +1,5 @@
 import type { AlertMetric } from "../constants/alert-metrics";
-import type { FirestoreDocument } from "@mohasinac/appkit";
+import type { FirestoreDocument } from "../../../schemas/types";
 import type { BaseDocument } from "../../../_internal/shared/types/base-document";
 import type { Encrypted, Plaintext } from "../../../security/encrypted";
 /**
@@ -71,6 +71,16 @@ export interface ShippingConfigDocument extends BaseDocument {
     expressSurcharge?: number;
     estimatedDays?: number;
     zones?: string[];
+    /**
+     * Values for admin-defined custom fields with no schema presence (3B
+     * item 1b, Universal Template System pilot — see
+     * `features/shell/field-ui-meta.ts`'s `CustomFieldDef`). Never read by
+     * any typed computation (shipping-cost resolution reads the named
+     * fields above only) and never merged into them — see the storage rule
+     * in the mega-overhaul plan's 3B-1b section for why this bag must stay
+     * bounded to scalars and separate from the real schema.
+     */
+    customFieldValues?: Record<string, string | number | boolean>;
 }
 export declare const SHIPPING_CONFIGS_COLLECTION: "shippingConfigs";
 export declare const SHIPPING_CONFIG_INDEXED_FIELDS: readonly ["storeId", "method", "isDefault", "isActive", "createdAt"];
@@ -154,7 +164,7 @@ export declare const DEFAULT_STORE_CATEGORY_DATA: Partial<StoreCategoryDocument>
  *  - `art` and `stickers` are ADDED. They are real listing types a seller can
  *    create, and their absence meant a template could never be saved for them.
  */
-export declare const LISTING_TEMPLATE_TYPES: readonly ["standard", "auction", "pre-order", "prize-draw", "bundle", "classified", "digital-code", "live", "art", "stickers"];
+export declare const LISTING_TEMPLATE_TYPES: readonly ["standard", "collector-drop", "pre-order", "clearance", "bundle", "classified", "digital-code", "live", "art-and-stickers"];
 export type ListingTemplateType = (typeof LISTING_TEMPLATE_TYPES)[number];
 export interface ListingTemplateDocument extends BaseDocument {
     storeId: string;

package/dist/features/store-extensions/schemas/firestore.js

@@ -103,15 +103,14 @@ export const DEFAULT_STORE_CATEGORY_DATA = {
  */
 export const LISTING_TEMPLATE_TYPES = [
     "standard",
-    "auction",
+    "collector-drop",
     "pre-order",
-    "prize-draw",
+    "clearance",
     "bundle",
     "classified",
     "digital-code",
     "live",
-    "art",
-    "stickers",
+    "art-and-stickers",
 ];
 export const LISTING_TEMPLATES_COLLECTION = "listingTemplates";
 export const LISTING_TEMPLATE_INDEXED_FIELDS = [