smoodly 0.0.14 → 0.0.16

package/dist/admin/shell/SharedForm.js

@@ -2,24 +2,30 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // One Globals item (shared content, spec 2026-09-07 §6), one locale: the
 // entry form's shape without what a singleton never has — no slug, no
-// "new", no delete, no add/remove locale (every supported locale exists
-// by construction). The fields in schema order, a globe-off mark after
-// the name of each that is not .localized(), and for a visual item a
-// Styles group edited under the reserved `$styles` key.
-// Status is per locale and immediate. "Used on N pages" is the refs
-// index's answer.
-import { useEffect, useMemo, useState } from "react";
+// delete, no add/remove locale (every supported locale exists by
+// construction), no site URL. The fields in schema order, a globe-off
+// mark after the name of each that is not .localized(), and for a visual
+// item a Styles group edited under the reserved `$styles` key. Since
+// 2026-09-14 it autosaves like the entry form: no Save button, the top
+// bar carries the indicator and the one publish control, publish
+// validates the draft and lists the fields in an amber banner. "Used on
+// N pages" is the refs index's answer.
+import { useEffect, useMemo, useRef, useState } from "react";
 import { STYLES_KEY } from "../../shared.js";
-import { FieldWidget } from "../forms/FieldWidget.js";
-import { relativeTime } from "../ui/format.js";
+import { revealField } from "../forms/reveal.js";
+import { useDraftAutosave } from "../editor/autosave.js";
+import { updatedLine } from "../ui/format.js";
 import { LocaleSwitcher } from "../ui/LocaleSwitcher.js";
-import { Banner, Breadcrumb, Button, SectionLabel, Segmented, TopBar, UnlocalizedMark } from "../ui/primitives.js";
+import { Banner, Breadcrumb, FieldErrorList, InfoRow, SaveIndicator, SectionLabel, TopBar } from "../ui/primitives.js";
+import { PublishControl } from "../ui/PublishControl.js";
+import { HistoryModal, historyRows } from "../ui/HistoryModal.js";
+import { localeStatusOf } from "./pages-tree.js";
 import { ResizeHandle } from "../ui/ResizeHandle.js";
 import { entryTitle } from "./entries-list.js";
 import { BASE } from "./base.js";
+import { SharedFields } from "./SharedFields.js";
 import { localeFromUrl, writeLocaleToUrl } from "../editor/locale-url.js";
 import { useLeaveGuard } from "./router.js";
-const STATUSES = ["Draft", "Published"];
 export function SharedForm({ ops, registry, name }) {
     const item = registry.shared.find((s) => s.name === name);
     const multilingual = registry.locales.supported.length > 1;
@@ -28,10 +34,29 @@ export function SharedForm({ ops, registry, name }) {
     const [fields, setFields] = useState(null);
     const [usage, setUsage] = useState([]);
     const [refOptions, setRefOptions] = useState({});
-    const [banner, setBanner] = useState(null);
+    const [notice, setNotice] = useState(null);
     const [fieldErrors, setFieldErrors] = useState({});
     const [dirty, setDirty] = useState(false);
-    useLeaveGuard(dirty);
+    const [touched, setTouched] = useState(false);
+    const [busy, setBusy] = useState(null);
+    const [published, setPublished] = useState(false);
+    const [reloadKey, setReloadKey] = useState(0);
+    const [history, setHistory] = useState(null);
+    const [snapshot, setSnapshot] = useState(null);
+    const formRef = useRef(null);
+    const fieldsRef = useRef(fields);
+    fieldsRef.current = fields;
+    const { saveState, mark, flush } = useDraftAutosave({
+        read: () => fieldsRef.current,
+        persist: async (value) => {
+            const r = await ops.shared.save(name, locale, value);
+            if (r.ok)
+                setRecord(r.data);
+            return r;
+        },
+        onSaved: () => setDirty(false),
+    });
+    useLeaveGuard(dirty || saveState !== "saved");
     const refTargets = useMemo(() => {
         const out = {};
         for (const [key, d] of Object.entries(item?.fields ?? {})) {
@@ -40,11 +65,12 @@ export function SharedForm({ ops, registry, name }) {
         }
         return out;
     }, [item]);
-    const localeKeys = useMemo(() => Object.entries(item?.fields ?? {}).filter(([, d]) => d.localized === true).map(([key]) => key), [item]);
     useEffect(() => {
         let cancelled = false;
         setFields(null);
         setFieldErrors({});
+        setDirty(false);
+        setTouched(false);
         ops.shared.get(name, locale).then((r) => {
             if (cancelled)
                 return;
@@ -52,14 +78,13 @@ export function SharedForm({ ops, registry, name }) {
                 setRecord(r.data.record);
                 setFields(r.data.fields);
                 setUsage(r.data.usage);
-                setDirty(false);
             }
             else
-                setBanner({ tone: "error", text: r.message });
+                setNotice({ tone: "error", text: r.message });
         }).catch(() => { if (!cancelled)
-            setBanner({ tone: "error", text: "Couldn't reach the server." }); });
+            setNotice({ tone: "error", text: "Couldn't reach the server." }); });
         return () => { cancelled = true; };
-    }, [ops, name, locale]);
+    }, [ops, name, locale, reloadKey]);
     // Ref options in the locale being edited — the entry form's rule.
     useEffect(() => {
         let cancelled = false;
@@ -78,57 +103,146 @@ export function SharedForm({ ops, registry, name }) {
     }, [ops, refTargets, registry, locale]);
     if (!item)
         return _jsx("p", { style: { padding: 32 }, children: "No such shared item." });
-    const applyResult = (r, okText) => {
-        if (r.ok) {
-            setBanner({ tone: "ok", text: okText });
-            setFieldErrors({});
-            return true;
-        }
-        setBanner({ tone: "error", text: r.message });
-        setFieldErrors(Object.fromEntries((r.fields ?? []).map((f) => [f.field, f.message])));
-        return false;
+    const row = record?.locales[locale];
+    const status = row ? localeStatusOf(row) : null;
+    const fail = (r) => {
+        if (r.code === "validation" && r.fields && r.fields.length > 0) {
+            setFieldErrors(Object.fromEntries(r.fields.map((f) => [f.field, f.message])));
+            setNotice({ tone: "warn", text: r.message, fields: r.fields });
+        }
+        else
+            setNotice({ tone: "error", text: r.message });
     };
-    const save = async () => {
-        if (!fields)
+    const publish = async () => {
+        setNotice(null);
+        setBusy("publish");
+        if (!(await flush())) {
+            setBusy(null);
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — publish cancelled." });
+            return;
+        }
+        let r;
+        try {
+            r = await ops.shared.setStatus(name, locale, "published");
+        }
+        catch {
+            r = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setBusy(null);
+        if (!r.ok) {
+            fail(r);
             return;
-        const r = await ops.shared.save(name, locale, fields);
-        if (applyResult(r, "Saved.") && r.ok) {
+        }
+        setRecord(r.data);
+        setFieldErrors({});
+        setPublished(true);
+        setTimeout(() => setPublished(false), 1600);
+    };
+    const unpublish = async () => {
+        setNotice(null);
+        setBusy("unpublish");
+        let r;
+        try {
+            r = await ops.shared.setStatus(name, locale, "draft");
+        }
+        catch {
+            r = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setBusy(null);
+        if (r.ok)
             setRecord(r.data);
-            setDirty(false);
+        else
+            fail(r);
+    };
+    const discard = async () => {
+        if (!window.confirm("Discard your changes and restore the published version?"))
+            return;
+        setNotice(null);
+        setBusy("discard");
+        if (!(await flush())) {
+            setBusy(null);
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — discard cancelled." });
+            return;
+        }
+        let r;
+        try {
+            r = await ops.shared.discardDraft(name, locale);
         }
+        catch {
+            r = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setBusy(null);
+        if (!r.ok) {
+            fail(r);
+            return;
+        }
+        setRecord(r.data);
+        setReloadKey((k) => k + 1);
+        setNotice({ tone: "ok", text: "Changes discarded." });
     };
-    const row = record?.locales[locale];
-    const status = row?.status ?? "draft";
-    const setPublished = async (next) => {
-        if (next === status)
+    const openHistory = async () => {
+        if (!row)
             return;
-        const r = await ops.shared.setStatus(name, locale, next);
-        if (applyResult(r, next === "published" ? "Published." : "Unpublished.") && r.ok)
-            setRecord(r.data);
+        if (!(await flush())) {
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — history not opened." });
+            return;
+        }
+        const r = await ops.shared.listVersions(name, locale);
+        if (!r.ok) {
+            fail(r);
+            return;
+        }
+        setSnapshot(null);
+        setHistory(historyRows(r.data, row));
+    };
+    const loadSnapshot = async (versionId) => {
+        const r = await ops.shared.getVersion(name, versionId);
+        if (r.ok)
+            setSnapshot({ id: r.data.id, fields: r.data.fields });
+        else
+            fail(r);
+    };
+    const restore = async (versionId) => {
+        const r = await ops.shared.restore(name, locale, versionId);
+        if (!r.ok) {
+            fail(r);
+            return false;
+        }
+        setRecord(r.data);
+        setReloadKey((k) => k + 1);
+        setNotice({ tone: "ok", text: "Version restored." });
+        return true;
     };
-    const switchLocale = (next) => {
+    const switchLocale = async (next) => {
         if (next === locale)
             return;
-        if (dirty && !window.confirm("Discard unsaved changes?"))
+        if (!(await flush())) {
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — stayed on this locale." });
             return;
+        }
         writeLocaleToUrl(next);
-        setBanner(null);
+        setNotice(null);
         setLocale(next);
     };
-    const styles = (fields?.[STYLES_KEY] ?? {});
     const pages = new Set(usage.filter((u) => u.sourceKind === "page").map((u) => u.sourceId));
-    const widget = ([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: fields?.[key], errors: fieldErrors, refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, mark: multilingual && !localeKeys.includes(key) ? _jsx(UnlocalizedMark, {}) : undefined, onChange: (value) => { setFields((f) => ({ ...(f ?? {}), [key]: value })); setDirty(true); } }, key));
+    const fieldEntries = Object.entries(item.fields).map(([key, descriptor]) => ({ key, ns: "fields", descriptor }));
+    const styleEntries = item.section !== undefined
+        ? Object.entries(item.styles).map(([key, descriptor]) => ({ key, ns: "styles", descriptor }))
+        : [];
+    const onChange = (ns, key, value) => {
+        setFields((f) => ns === "fields"
+            ? { ...(f ?? {}), [key]: value }
+            : { ...(f ?? {}), [STYLES_KEY]: { ...(f?.[STYLES_KEY] ?? {}), [key]: value } });
+        setDirty(true);
+        setTouched(true);
+        mark();
+    };
     return (_jsxs(_Fragment, { children: [_jsx(TopBar, { left: _jsx(_Fragment, { children: _jsx(Breadcrumb, { backHref: `${BASE}/shared`, items: [
                             {
                                 label: "Globals", href: `${BASE}/shared`,
-                                trailing: multilingual && (_jsx(LocaleSwitcher, { registry: registry, present: registry.locales.supported, parentLocales: [], value: locale, adding: false, onSwitch: switchLocale, onAdd: () => undefined })),
+                                trailing: multilingual && (_jsx(LocaleSwitcher, { registry: registry, present: registry.locales.supported, parentLocales: [], value: locale, adding: false, onSwitch: (l) => { void switchLocale(l); }, onAdd: () => undefined })),
                             },
                             { label: item.title },
-                        ] }) }), right: _jsx(Button, { onClick: save, disabled: fields === null, children: "Save" }) }), _jsxs("div", { className: "sm-editor", children: [_jsxs("div", { className: "sm-form", children: [banner && _jsx(Banner, { tone: banner.tone, onDismiss: () => setBanner(null), children: banner.text }), record && (_jsxs("p", { className: "sm-hint", children: [pages.size === 0 ? "Not placed on any page yet." : `Used on ${pages.size} page${pages.size === 1 ? "" : "s"}: `, [...pages].map((id, i) => (_jsxs("span", { children: [i > 0 && ", ", _jsx("a", { href: `${BASE}/pages/${encodeURIComponent(id)}?locale=${encodeURIComponent(locale)}`, children: id })] }, id)))] })), fields !== null ? (_jsxs(_Fragment, { children: [Object.entries(item.fields).map(widget), item.section !== undefined && Object.keys(item.styles).length > 0 && (_jsxs(_Fragment, { children: [_jsx(SectionLabel, { children: "Styles" }), Object.entries(item.styles).map(([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: styles[key], onChange: (value) => {
-                                                    setFields((f) => ({ ...(f ?? {}), [STYLES_KEY]: { ...(f?.[STYLES_KEY] ?? {}), [key]: value } }));
-                                                    setDirty(true);
-                                                } }, key)))] }))] })) : !banner && _jsx("p", { style: { color: "var(--text-muted)" }, children: "Loading\u2026" })] }), _jsx(ResizeHandle, {}), _jsxs("aside", { className: "sm-inspector", children: [_jsxs("div", { className: "sm-card", children: [_jsxs(SectionLabel, { children: ["Status", multilingual ? ` · ${locale}` : ""] }), _jsx(Segmented, { options: STATUSES, stretch: true, disabled: !row, value: status === "published" ? "Published" : "Draft", onChange: (v) => { void setPublished(v === "Published" ? "published" : "draft"); } })] }), record && row && (_jsx(_Fragment, { children: _jsxs("div", { className: "sm-card", children: [_jsx(SectionLabel, { children: "Document info" }), _jsx(InfoRow, { label: "Kind", value: item.section !== undefined ? `Visual · ${item.section}` : "Fields" }), _jsx(InfoRow, { label: "Updated", value: relativeTime(row.updatedAt) }), _jsx(InfoRow, { label: "ID", value: record.id, mono: true })] }) }))] })] })] }));
-}
-function InfoRow({ label, value, mono }) {
-    return (_jsxs("div", { style: { display: "flex", justifyContent: "space-between", gap: 10, fontSize: "var(--text-sm)", color: "var(--text-muted)" }, children: [_jsx("span", { children: label }), _jsx("span", { style: { color: "var(--text)", fontFamily: mono ? "var(--font-mono)" : undefined, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: value })] }));
+                        ] }) }), right: _jsxs(_Fragment, { children: [(touched || saveState === "error") && _jsx(SaveIndicator, { state: saveState }), _jsx(PublishControl, { status: status, pending: dirty || saveState !== "saved", busy: busy, flash: published, disabled: !row, onPublish: () => { void publish(); }, onUnpublish: () => { void unpublish(); }, onDiscard: () => { void discard(); }, onHistory: () => { void openHistory(); } })] }) }), history && row && (_jsx(HistoryModal, { rows: history, draftId: row.draftVersionId, onSelect: (v) => { void loadSnapshot(v); }, onClose: () => setHistory(null), onRestore: restore, render: (versionId) => snapshot?.id === versionId ? (_jsxs("fieldset", { disabled: true, className: "sm-history__form", children: [_jsx(SharedFields, { item: item, entries: fieldEntries, fields: snapshot.fields, refOptions: refOptions, multilingual: multilingual, onChange: () => { } }), styleEntries.length > 0 && (_jsxs(_Fragment, { children: [_jsx(SectionLabel, { children: "Styles" }), _jsx(SharedFields, { item: item, entries: styleEntries, fields: snapshot.fields, refOptions: refOptions, multilingual: multilingual, onChange: () => { } })] }))] })) : _jsx("p", { className: "sm-hint", style: { padding: 16 }, children: "Loading\u2026" }) })), _jsxs("div", { className: "sm-editor", children: [_jsxs("div", { className: "sm-form", ref: formRef, children: [notice && (_jsxs(Banner, { tone: notice.tone, onDismiss: () => setNotice(null), children: [_jsx("p", { style: { margin: 0 }, children: notice.text }), _jsx(FieldErrorList, { fields: notice.fields ?? [], onReveal: (path) => { if (formRef.current)
+                                            revealField(formRef.current, path); } })] })), record && (_jsxs("p", { className: "sm-hint", children: [pages.size === 0 ? "Not placed on any page yet." : `Used on ${pages.size} page${pages.size === 1 ? "" : "s"}: `, [...pages].map((id, i) => (_jsxs("span", { children: [i > 0 && ", ", _jsx("a", { href: `${BASE}/pages/${encodeURIComponent(id)}?locale=${encodeURIComponent(locale)}`, children: id })] }, id)))] })), fields !== null ? (_jsxs(_Fragment, { children: [_jsx(SharedFields, { item: item, entries: fieldEntries, fields: fields, errors: fieldErrors, refOptions: refOptions, multilingual: multilingual, onChange: onChange }), styleEntries.length > 0 && (_jsxs(_Fragment, { children: [_jsx(SectionLabel, { children: "Styles" }), _jsx(SharedFields, { item: item, entries: styleEntries, fields: fields, errors: fieldErrors, refOptions: refOptions, multilingual: multilingual, onChange: onChange })] }))] })) : !notice && _jsx("p", { style: { color: "var(--text-muted)" }, children: "Loading\u2026" })] }), _jsx(ResizeHandle, {}), _jsx("aside", { className: "sm-inspector", children: record && row && (_jsxs("div", { className: "sm-card", children: [_jsx(SectionLabel, { children: "Document info" }), _jsx(InfoRow, { label: "Kind", value: item.section !== undefined ? `Visual · ${item.section}` : "Fields" }), _jsx(InfoRow, { label: "Updated", value: updatedLine(row.updatedAt, row.updatedBy) }), _jsx(InfoRow, { label: "ID", value: record.id, mono: true })] })) })] })] }));
 }

package/dist/admin/shell/SharedList.js

@@ -8,6 +8,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from "react";
 import { ListView } from "./ListView.js";
 import { sharedRows } from "./shared-list.js";
+import { statusLabel } from "../ui/status-label.js";
 import { StatusBadge } from "../ui/primitives.js";
 import { LocalePicker } from "../ui/LocaleSwitcher.js";
 import { relativeTime } from "../ui/format.js";
@@ -50,7 +51,7 @@ export function SharedList({ ops, registry }) {
             { label: "Title", width: "minmax(160px,1fr)" },
             { label: "Kind", width: "90px" },
             { label: "Updated", width: "minmax(110px,160px)" },
-            { label: "Status", width: "120px" },
+            { label: "Status", width: "170px" },
         ], empty: items ? "No shared content is registered." : "Loading…", rows: rows.map((row) => ({
             key: row.name,
             href: `${BASE}/shared/${encodeURIComponent(row.name)}?locale=${encodeURIComponent(locale)}`,
@@ -58,7 +59,7 @@ export function SharedList({ ops, registry }) {
                 _jsx("span", { className: "sm-cell sm-cell--title", children: row.title }, "t"),
                 _jsx("span", { className: "sm-cell sm-cell--muted", children: row.flavour }, "k"),
                 _jsx("span", { className: "sm-cell sm-cell--muted", children: relativeTime(row.updatedAt) }, "u"),
-                _jsx(StatusBadge, { status: row.status }, "s"),
+                _jsx(StatusBadge, { status: statusLabel(row.status) }, "s"),
             ],
         })) }));
 }

package/dist/admin/shell/entries-list.d.ts

@@ -9,8 +9,8 @@ export type EntryRow = {
     /** The locale row's updatedAt when present, else the node's. */
     updatedAt: number;
 };
-/** The title field's value in a locale: its own, else the default
- *  locale's, else any locale's, else the id. Display only — a shared
+/** The entry's title in the selected locale, else the default locale's, else any locale's;
+ *  "Untitled" when every one is empty (spec 2026-09-14 §4). Display only — a shared
  *  title field reads the same from every locale. */
 export declare function entryTitle(record: EntryRecord, meta: AdminCollection, registry: AdminRegistry, locale: string): string;
 /** The locale an "Add <locale>" copies from: the default when the record has it, else its first. */

package/dist/admin/shell/entries-list.js

@@ -1,6 +1,6 @@
 import { localeStatusOf } from "./pages-tree.js";
-/** The title field's value in a locale: its own, else the default
- *  locale's, else any locale's, else the id. Display only — a shared
+/** The entry's title in the selected locale, else the default locale's, else any locale's;
+ *  "Untitled" when every one is empty (spec 2026-09-14 §4). Display only — a shared
  *  title field reads the same from every locale. */
 export function entryTitle(record, meta, registry, locale) {
     const key = meta.titleField;
@@ -11,7 +11,7 @@ export function entryTitle(record, meta, registry, locale) {
         const value = key in row.fields ? row.fields[key] : record.fields[key];
         return typeof value === "string" && value.length > 0 ? value : undefined;
     };
-    return from(locale) ?? from(registry.locales.default) ?? Object.keys(record.locales).map(from).find((t) => t !== undefined) ?? record.id;
+    return from(locale) ?? from(registry.locales.default) ?? Object.keys(record.locales).map(from).find((t) => t !== undefined) ?? "Untitled";
 }
 /** The locale an "Add <locale>" copies from: the default when the record has it, else its first. */
 export function entrySourceLocale(record, registry) {

package/dist/admin/supabase-auth.js

@@ -11,7 +11,7 @@ export function supabaseAdminAuth(input) {
     return {
         async verify(token) {
             const res = await auth.auth.getUser(token);
-            return res.data.user ? { userId: res.data.user.id } : null;
+            return res.data.user ? { userId: res.data.user.id, email: res.data.user.email ?? null } : null;
         },
         async isEditor(userId) {
             const res = await input.db.from("editors").select("user_id").eq("user_id", userId).limit(1);

package/dist/admin/ui/ActionMenu.d.ts

@@ -0,0 +1,11 @@
+export type ActionMenuItem = {
+    label: string;
+    run(): void;
+    disabled?: boolean;
+    danger?: boolean;
+};
+export declare function ActionMenu({ label, items, disabled }: {
+    label: string;
+    items: ActionMenuItem[];
+    disabled?: boolean;
+}): import("react").JSX.Element;

package/dist/admin/ui/ActionMenu.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// A round three-dot button and its popover of actions (spec 2026-09-13
+// publish flow §2). Items are always rendered and disabled when they do
+// not apply — the layout never shifts and the editor learns what exists.
+// The popover is the Pages list's row menu shape (`.sm-picker`), anchored
+// under the button instead of at the pointer.
+import { useEffect, useRef, useState } from "react";
+import { cx } from "./primitives.js";
+export function ActionMenu({ label, items, disabled }) {
+    const [open, setOpen] = useState(false);
+    const ref = useRef(null);
+    useEffect(() => {
+        if (!open)
+            return;
+        const onDown = (e) => { if (!ref.current?.contains(e.target))
+            setOpen(false); };
+        const onKey = (e) => { if (e.key === "Escape")
+            setOpen(false); };
+        document.addEventListener("pointerdown", onDown);
+        document.addEventListener("keydown", onKey);
+        return () => { document.removeEventListener("pointerdown", onDown); document.removeEventListener("keydown", onKey); };
+    }, [open]);
+    return (_jsxs("div", { ref: ref, style: { position: "relative", flex: "none" }, children: [_jsx("button", { type: "button", className: "sm-dotmenu", "aria-label": label, title: label, "aria-haspopup": "menu", "aria-expanded": open, disabled: disabled, onClick: () => setOpen((o) => !o), children: "\u00B7\u00B7\u00B7" }), open && (_jsx("div", { role: "menu", className: "sm-picker sm-picker--menu", children: items.map((item) => (_jsx("button", { type: "button", role: "menuitem", className: cx("sm-picker__item", item.danger && "sm-picker__item--danger"), disabled: item.disabled, onClick: () => { setOpen(false); item.run(); }, children: item.label }, item.label))) }))] }));
+}

package/dist/admin/ui/HistoryModal.d.ts

@@ -0,0 +1,23 @@
+import { type ReactElement, type ReactNode } from "react";
+import type { PageLocale } from "../../store.ts";
+import type { VersionSummary } from "../ops.ts";
+export type HistoryTag = "Draft" | "Live" | null;
+export type HistoryRow = VersionSummary & {
+    tag: HistoryTag;
+};
+export declare const RESTORE_CONFIRM = "Restore this version? The current draft will be replaced. Nothing goes live until you publish.";
+/** The rows for a locale's versions: the unpublished draft is Draft, the
+ *  row the site serves Live, an older publish carries nothing. */
+export declare function historyRows(versions: VersionSummary[], row: Pick<PageLocale, "status" | "draftVersionId" | "publishedVersionId">): HistoryRow[];
+export declare function HistoryModal({ rows, draftId, render, onSelect, onRestore, onClose }: {
+    rows: HistoryRow[];
+    /** The current draft's version id: Restore is disabled on it. */
+    draftId: string | null;
+    /** The main area for the selected version. */
+    render(versionId: string): ReactNode;
+    /** The selection changed — fired once for the initial row too; the entry screens load the snapshot here. */
+    onSelect?(versionId: string): void;
+    /** Resolves true when the restore landed; the modal then closes itself. */
+    onRestore(versionId: string): Promise<boolean>;
+    onClose(): void;
+}): ReactElement;

package/dist/admin/ui/HistoryModal.js

@@ -0,0 +1,40 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// The History modal (spec 2026-09-13 history §5): the locale's versions on
+// the left — newest first, the unpublished draft tagged Draft and the row
+// the site serves Live — and the selected version on the right, rendered
+// by the screen that opened it (an iframe of the site's draft route for a
+// page, a disabled form for an entry or a shared item). Restore confirms,
+// hands the id to the screen, and closes once the restore landed.
+import { useEffect, useState } from "react";
+import { versionTime } from "./format.js";
+import { Modal } from "./Modal.js";
+import { Button, cx } from "./primitives.js";
+export const RESTORE_CONFIRM = "Restore this version? The current draft will be replaced. Nothing goes live until you publish.";
+/** The rows for a locale's versions: the unpublished draft is Draft, the
+ *  row the site serves Live, an older publish carries nothing. */
+export function historyRows(versions, row) {
+    const live = row.status === "published";
+    return versions.map((v) => ({
+        ...v,
+        tag: v.id === row.draftVersionId && (v.id !== row.publishedVersionId || !live) ? "Draft"
+            : v.id === row.publishedVersionId && live ? "Live"
+                : null,
+    }));
+}
+export function HistoryModal({ rows, draftId, render, onSelect, onRestore, onClose }) {
+    const [selected, setSelected] = useState(rows[0]?.id ?? null);
+    const [busy, setBusy] = useState(false);
+    useEffect(() => { if (selected)
+        onSelect?.(selected); }, [selected]); // eslint-disable-line react-hooks/exhaustive-deps
+    const restore = async () => {
+        if (!selected || !window.confirm(RESTORE_CONFIRM))
+            return;
+        setBusy(true);
+        const landed = await onRestore(selected);
+        setBusy(false);
+        if (landed)
+            onClose();
+    };
+    return (_jsx(Modal, { title: "History", width: 1200, height: "85vh", flush: true, onClose: onClose, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "secondary", onClick: onClose, children: "Close" }), _jsx(Button, { disabled: busy || !selected || selected === draftId, onClick: () => { void restore(); }, children: busy ? "Restoring…" : "Restore" })] }), children: _jsxs("div", { className: "sm-history", children: [_jsxs("div", { className: "sm-history__list", role: "listbox", "aria-label": "Versions", children: [rows.length === 0 && _jsx("span", { className: "sm-hint", style: { padding: 12 }, children: "No versions yet." }), rows.map((r) => (_jsxs("button", { type: "button", role: "option", "aria-selected": r.id === selected, className: cx("sm-history__row", r.id === selected && "sm-history__row--active"), onClick: () => setSelected(r.id), children: [_jsx("span", { children: versionTime(r.savedAt) }), r.tag && _jsx("span", { className: cx("sm-history__tag", r.tag === "Live" && "sm-history__tag--live"), children: r.tag })] }, r.id)))] }), _jsx("div", { className: "sm-history__main", children: selected ? render(selected) : null })] }) }));
+}

package/dist/admin/ui/Modal.d.ts

@@ -1,7 +1,11 @@
 import { type ReactElement, type ReactNode } from "react";
-export declare function Modal({ title, width, onClose, children, footer }: {
+export declare function Modal({ title, width, height, flush, onClose, children, footer }: {
     title: string;
     width?: number;
+    /** A fixed panel height (e.g. `"85vh"`) for a modal whose body must fill it; default: the content's. */
+    height?: number | string;
+    /** Drops the body padding for a modal whose body is a two-pane layout (History). */
+    flush?: boolean;
     onClose(): void;
     children: ReactNode;
     footer?: ReactNode;

package/dist/admin/ui/Modal.js

@@ -8,13 +8,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // overflow the same way. Static rendering (no document) keeps it inline.
 import { useEffect, useState } from "react";
 import { createPortal } from "react-dom";
-import { IconButton } from "./primitives.js";
+import { cx, IconButton } from "./primitives.js";
 function adminRoot() {
     if (typeof document === "undefined")
         return null;
     return document.querySelector(".sm-admin") ?? document.body;
 }
-export function Modal({ title, width = 720, onClose, children, footer }) {
+export function Modal({ title, width = 720, height, flush = false, onClose, children, footer }) {
     const [root] = useState(adminRoot);
     useEffect(() => {
         const onKey = (e) => { if (e.key === "Escape")
@@ -22,6 +22,6 @@ export function Modal({ title, width = 720, onClose, children, footer }) {
         window.addEventListener("keydown", onKey);
         return () => window.removeEventListener("keydown", onKey);
     }, [onClose]);
-    const modal = (_jsx("div", { className: "sm-modal", onClick: onClose, children: _jsxs("div", { className: "sm-modal__panel", role: "dialog", "aria-label": title, style: { width }, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "sm-modal__head", children: [_jsx("span", { className: "sm-title", children: title }), _jsx(IconButton, { label: "Close", onClick: onClose, children: "\u00D7" })] }), _jsx("div", { className: "sm-modal__body", children: children }), footer && _jsx("div", { className: "sm-modal__foot", children: footer })] }) }));
+    const modal = (_jsx("div", { className: "sm-modal", onClick: onClose, children: _jsxs("div", { className: "sm-modal__panel", role: "dialog", "aria-label": title, style: { width, ...(height !== undefined ? { height } : {}) }, onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "sm-modal__head", children: [_jsx("span", { className: "sm-title", children: title }), _jsx(IconButton, { label: "Close", onClick: onClose, children: "\u00D7" })] }), _jsx("div", { className: cx("sm-modal__body", flush && "sm-modal__body--flush"), children: children }), footer && _jsx("div", { className: "sm-modal__foot", children: footer })] }) }));
     return root ? createPortal(modal, root) : modal;
 }

package/dist/admin/ui/PublishControl.d.ts

@@ -0,0 +1,31 @@
+import type { LocaleStatus } from "../shell/pages-tree.ts";
+import { type ActionMenuItem } from "./ActionMenu.tsx";
+export type PublishBusy = "publish" | "discard" | "unpublish" | null;
+/** The three-dot menu's items: History first when the screen offers it (spec 2026-09-13 history §5;
+ *  every collection since 2026-09-14), then the two publish-flow actions — always rendered,
+ *  disabled when they do not apply. */
+export declare function publishMenu(opts: {
+    can: {
+        discard: boolean;
+        unpublish: boolean;
+    };
+    onDiscard(): void;
+    onUnpublish(): void;
+    onHistory?(): void;
+}): ActionMenuItem[];
+export declare function PublishControl({ status, pending, busy, flash, disabled, onPublish, onDiscard, onUnpublish, onHistory, }: {
+    /** The locale's stored state; null while the document loads or before it exists. */
+    status: LocaleStatus | null;
+    /** The editor holds a change the store has not confirmed (dirty, or a save pending / in flight / failed). */
+    pending?: boolean;
+    busy?: PublishBusy;
+    /** The moment after a publish: the button reads "Published ✓". */
+    flash?: boolean;
+    /** No document to act on (loading, a new unsaved entry). */
+    disabled?: boolean;
+    onPublish(): void;
+    onDiscard(): void;
+    onUnpublish(): void;
+    /** Opens History (spec 2026-09-13 history §5). Absent = no History item (the canvas card). */
+    onHistory?(): void;
+}): import("react").JSX.Element;

package/dist/admin/ui/PublishControl.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ActionMenu } from "./ActionMenu.js";
+import { Button, StatusBadge } from "./primitives.js";
+import { publishActions, statusLabel } from "./status-label.js";
+const BUSY_WORD = {
+    publish: "Publishing…", discard: "Discarding…", unpublish: "Unpublishing…",
+};
+/** The three-dot menu's items: History first when the screen offers it (spec 2026-09-13 history §5;
+ *  every collection since 2026-09-14), then the two publish-flow actions — always rendered,
+ *  disabled when they do not apply. */
+export function publishMenu(opts) {
+    return [
+        ...(opts.onHistory ? [{ label: "History", run: opts.onHistory }] : []),
+        { label: "Discard changes", danger: true, disabled: !opts.can.discard, run: opts.onDiscard },
+        { label: "Unpublish", disabled: !opts.can.unpublish, run: opts.onUnpublish },
+    ];
+}
+export function PublishControl({ status, pending = false, busy = null, flash = false, disabled = false, onPublish, onDiscard, onUnpublish, onHistory, }) {
+    const can = publishActions(status, pending);
+    const inert = disabled || busy !== null;
+    const word = busy ? BUSY_WORD[busy] : flash ? "Published ✓" : "Publish";
+    return (_jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: 8 }, children: [status && _jsx(StatusBadge, { status: statusLabel(status) }), _jsx(Button, { variant: flash && !busy ? "ok" : "primary", disabled: inert || !can.publish, onClick: onPublish, children: word }), _jsx(ActionMenu, { label: "More actions", disabled: inert || status === null, items: publishMenu({ can, onDiscard, onUnpublish, onHistory }) })] }));
+}

package/dist/admin/ui/format.d.ts

@@ -1 +1,5 @@
 export declare function relativeTime(ms: number, now?: number): string;
+/** A version's saved time: an absolute date and time — History compares moments, not distances. */
+export declare function versionTime(ms: number): string;
+/** The "Updated" info line: the relative time, then who, when the row knows (spec 2026-09-13 history §2). */
+export declare function updatedLine(updatedAt: number, updatedBy: string | null, now?: number): string;

package/dist/admin/ui/format.js

@@ -23,3 +23,12 @@ export function relativeTime(ms, now = Date.now()) {
         month: "short", day: "numeric", ...(sameYear ? {} : { year: "numeric" }),
     });
 }
+/** A version's saved time: an absolute date and time — History compares moments, not distances. */
+export function versionTime(ms) {
+    return new Date(ms).toLocaleString(undefined, { day: "numeric", month: "short", year: "numeric", hour: "2-digit", minute: "2-digit" });
+}
+/** The "Updated" info line: the relative time, then who, when the row knows (spec 2026-09-13 history §2). */
+export function updatedLine(updatedAt, updatedBy, now = Date.now()) {
+    const when = relativeTime(updatedAt, now);
+    return updatedBy ? `${when} · ${updatedBy}` : when;
+}

package/dist/admin/ui/primitives.d.ts

@@ -1,5 +1,6 @@
 import type { AnchorHTMLAttributes, ButtonHTMLAttributes, CSSProperties, ReactNode } from "react";
 import type { SaveState } from "../editor/autosave.ts";
+import type { FieldError } from "../validate.ts";
 /** The wordmark, inlined: a package can't ship a file into the host app's
  *  /public. Its colour is the --logo-color token (accent in the warm look). */
 export declare function Logo({ height }: {
@@ -115,10 +116,22 @@ export declare function SectionLabel({ children, action, mono, style }: {
 export declare function Divider({ bleed }: {
     bleed?: number;
 }): import("react").JSX.Element;
+/** The lines under a publish-validation banner: one per field, each focusing its widget
+ *  when the screen can reveal it (spec 2026-09-14 §2). */
+export declare function FieldErrorList({ fields, onReveal }: {
+    fields: FieldError[];
+    onReveal?(path: string): void;
+}): import("react").JSX.Element | null;
 export declare function Banner({ tone, children, onDismiss }: {
     tone: "ok" | "error" | "warn";
     children: ReactNode;
     onDismiss?: () => void;
 }): import("react").JSX.Element;
 export declare function cx(...parts: (string | false | null | undefined)[]): string;
+/** One line of a form's info block: a muted label, the value right-aligned and clipped. */
+export declare function InfoRow({ label, value, mono }: {
+    label: string;
+    value: string;
+    mono?: boolean;
+}): import("react").JSX.Element;
 export {};