smoodly 0.0.15 → 0.0.17

package/dist/admin/serialize.d.ts

@@ -1,4 +1,5 @@
 import type { ResolvedConfig } from "../config.ts";
+import type { Descriptor } from "../fields.ts";
 import type { ZonePolicy } from "../zones.ts";
 export type AdminField = Record<string, unknown> & {
     type: string;
@@ -14,8 +15,11 @@ export type AdminSection = {
     icon?: string;
     description?: string;
     fields: Record<string, AdminField>;
+    settings: Record<string, AdminField>;
+    /** Smoodly's styles set after the schema's toggle (spec 2026-09-14 §2); `{}` for `styles: false`. */
     styles: Record<string, AdminField>;
-    meta: Record<string, AdminField>;
+    /** The custom-CSS box exists for this section: the project flag, unless the schema says `css: false` (spec 2026-09-14 §4). */
+    css: boolean;
     sample?: Record<string, unknown>;
 };
 export type AdminCollection = {
@@ -43,18 +47,19 @@ export type AdminPageTemplate = {
     /** `meta: { seo: true }` — the SEO & Social tab exists for this template. */
     seo: boolean;
 };
-export type AdminShared = {
+export type AdminGlobal = {
     name: string;
     title: string;
     /** The section a visual item renders through; absent = an object item. */
     section?: string;
-    versions: boolean;
     fields: Record<string, AdminField>;
-    /** Resolved (the config's standard set merged in) for a visual item; empty for an object item. */
+    /** The section's settings, styles set and css flag for a visual item; `{}` / `{}` / `false` for an object item. */
+    settings: Record<string, AdminField>;
     styles: Record<string, AdminField>;
+    css: boolean;
 };
-/** A registered Element (spec 2026-09-08 block nodes §1): a section shape plus its contexts. */
-export type AdminElement = AdminSection & {
+/** A registered Element (spec 2026-09-08 block nodes §1): a section shape plus its contexts — no styles, no css. */
+export type AdminElement = Omit<AdminSection, "styles" | "css"> & {
     contexts: string[];
 };
 export type AdminRegistry = {
@@ -62,11 +67,15 @@ export type AdminRegistry = {
     elements: AdminElement[];
     collections: AdminCollection[];
     pages: AdminPageTemplate[];
-    shared: AdminShared[];
+    globals: AdminGlobal[];
+    /** The custom section (spec 2026-09-14 §6) as one synthetic section: its rows descriptor, the full styles set, the project css flag. */
+    custom: AdminSection;
     locales: {
         default: string;
         supported: string[];
     };
+    /** The project's custom-CSS flag (spec 2026-09-14 §4). */
+    css: boolean;
     /** Which slug the site root serves. */
     homePageSlug: string;
     /** How deep editors may nest pages; 1 = flat. */
@@ -77,4 +86,6 @@ export type AdminRegistry = {
         accept: string[];
     };
 };
+/** A registered section's settings descriptors — what a visual global's form shows (spec 2026-09-14 §3). */
+export declare function sectionSettings(config: ResolvedConfig, name: string): Record<string, Descriptor>;
 export declare function serializeAdminConfig(config: ResolvedConfig): AdminRegistry;

package/dist/admin/serialize.js

@@ -1,6 +1,8 @@
 import { fixedSlug } from "../page.js";
 import { collectionDepth, collectionOrder } from "../collections.js";
 import { perLocaleSegments } from "../paths.js";
+import { styleDescriptors } from "../styles.js";
+import { CUSTOM_NODE_TYPE, customFields, defaultRow } from "../custom/index.js";
 function serializeDescriptor(d) {
     const out = { type: d.type };
     for (const [key, value] of Object.entries(d)) {
@@ -22,6 +24,14 @@ function serializeDescriptor(d) {
 function serializeMap(map) {
     return Object.fromEntries(Object.entries(map ?? {}).map(([k, d]) => [k, serializeDescriptor(d)]));
 }
+/** A registered section's settings descriptors — what a visual global's form shows (spec 2026-09-14 §3). */
+export function sectionSettings(config, name) {
+    return (config.registry.sections ?? []).find((s) => s.schema.name === name)?.schema.settings ?? {};
+}
+/** Whether a section gets the custom-CSS box: the project flag, unless the schema opts out (spec 2026-09-14 §4). */
+function sectionCss(config, name) {
+    return config.css && (config.registry.sections ?? []).find((s) => s.schema.name === name)?.schema.css !== false;
+}
 export function serializeAdminConfig(config) {
     const perLocale = (v) => perLocaleSegments(v, config.locales.supported);
     return {
@@ -33,8 +43,9 @@ export function serializeAdminConfig(config) {
                 icon: s.icon,
                 description: s.description,
                 fields: serializeMap(s.fields),
+                settings: serializeMap(s.settings),
                 styles: serializeMap(config.resolvedStyles(s.name)),
-                meta: serializeMap(s.meta),
+                css: sectionCss(config, s.name),
                 sample: s.sample,
             };
         }),
@@ -47,8 +58,7 @@ export function serializeAdminConfig(config) {
                 description: e.description,
                 contexts: [...(e.contexts ?? [])],
                 fields: serializeMap(e.fields),
-                styles: serializeMap(e.styles),
-                meta: serializeMap(e.meta),
+                settings: serializeMap(e.settings),
                 sample: e.sample,
             };
         }),
@@ -73,14 +83,26 @@ export function serializeAdminConfig(config) {
                 seo: p.meta?.seo === true,
             };
         }),
-        shared: (config.registry.shared ?? []).map((s) => ({
+        globals: (config.registry.globals ?? []).map((s) => ({
             name: s.name,
             title: s.title,
             ...(s.section !== undefined ? { section: s.section } : {}),
-            versions: s.versions === true,
             fields: serializeMap(s.fields),
+            settings: serializeMap(s.section !== undefined ? sectionSettings(config, s.section) : {}),
             styles: serializeMap(s.section !== undefined ? config.resolvedStyles(s.section) : {}),
+            css: s.section !== undefined ? sectionCss(config, s.section) : false,
         })),
+        custom: {
+            name: CUSTOM_NODE_TYPE,
+            title: "Custom section",
+            description: "Your own rows of columns",
+            fields: serializeMap(customFields(config.custom.toolset)),
+            settings: {},
+            styles: serializeMap(styleDescriptors(config.styles)),
+            css: config.css,
+            sample: { rows: [defaultRow()] },
+        },
+        css: config.css,
         locales: config.locales,
         homePageSlug: config.homePageSlug,
         pageDepth: config.pageDepth,

package/dist/admin/shell/AdminApp.js

@@ -17,8 +17,8 @@ import { makeClientOps } from "../client-ops.js";
 import { PagesList } from "./PagesList.js";
 import { EntriesList } from "./EntriesList.js";
 import { EntryForm } from "./EntryForm.js";
-import { SharedList } from "./SharedList.js";
-import { SharedForm } from "./SharedForm.js";
+import { GlobalList } from "./GlobalList.js";
+import { GlobalForm } from "./GlobalForm.js";
 import { EditorView } from "../editor/EditorView.js";
 import { LoginView } from "./LoginView.js";
 import { useAdminSession } from "./session.js";
@@ -48,11 +48,11 @@ export function AdminApp({ registry, op, auth }) {
     else if (isCollection && !tail)
         main = _jsx(EntriesList, { ops: ops, registry: registry, collection: head });
     else if (isCollection && tail)
-        main = _jsx(EntryForm, { ops: ops, registry: registry, collection: head, id: tail === "new" ? "new" : decodeURIComponent(tail) });
-    else if (head === "shared" && !tail)
-        main = _jsx(SharedList, { ops: ops, registry: registry });
-    else if (head === "shared" && tail)
-        main = _jsx(SharedForm, { ops: ops, registry: registry, name: decodeURIComponent(tail) });
+        main = _jsx(EntryForm, { ops: ops, registry: registry, collection: head, id: decodeURIComponent(tail) });
+    else if (head === "globals" && !tail)
+        main = _jsx(GlobalList, { ops: ops, registry: registry });
+    else if (head === "globals" && tail)
+        main = _jsx(GlobalForm, { ops: ops, registry: registry, name: decodeURIComponent(tail) });
     else if (head === "media")
         main = _jsx(MediaScreen, {});
     else

package/dist/admin/shell/EntriesList.js

@@ -8,6 +8,7 @@ import { useCallback, useEffect, useState } from "react";
 import { ListView } from "./ListView.js";
 import { canReorder, entryRows, entrySourceLocale } from "./entries-list.js";
 import { Button, StatusBadge } from "../ui/primitives.js";
+import { statusLabel } from "../ui/status-label.js";
 import { LocalePicker } from "../ui/LocaleSwitcher.js";
 import { relativeTime } from "../ui/format.js";
 import { useSortable } from "../ui/useSortable.js";
@@ -75,6 +76,21 @@ export function EntriesList({ ops, registry, collection }) {
     const open = (id) => {
         navigate(`${BASE}/${collection}/${encodeURIComponent(id)}?locale=${encodeURIComponent(locale)}`);
     };
+    /** "+ New entry" creates an empty draft in the locale on screen and opens it (spec 2026-09-14 §4). */
+    const createEntry = async () => {
+        let result;
+        try {
+            result = await ops.entries.create(collection, { locale, fields: {} });
+        }
+        catch {
+            result = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        if (!result.ok) {
+            window.alert(result.message);
+            return;
+        }
+        open(result.data.id);
+    };
     const addLocale = async (row) => {
         const record = records?.find((r) => r.id === row.id);
         if (!record)
@@ -95,10 +111,10 @@ export function EntriesList({ ops, registry, collection }) {
         }
         open(row.id);
     };
-    return (_jsx(ListView, { title: meta.title, titleTrailing: multilingual && _jsx(LocalePicker, { locales: registry.locales.supported, value: locale, onChange: pickLocale }), actions: _jsx(Button, { onClick: () => { navigate(`${BASE}/${collection}/new?locale=${encodeURIComponent(locale)}`); }, children: "+ New entry" }), columns: [
+    return (_jsx(ListView, { title: meta.title, titleTrailing: multilingual && _jsx(LocalePicker, { locales: registry.locales.supported, value: locale, onChange: pickLocale }), actions: _jsx(Button, { onClick: () => { void createEntry(); }, children: "+ New entry" }), columns: [
             { label: "Title", width: "minmax(160px,1fr)" },
             { label: "Updated", width: "minmax(110px,160px)" },
-            { label: "Status", width: "120px" },
+            { label: "Status", width: "170px" },
         ], empty: records ? "Nothing here yet." : "Loading…", sortable: canReorder(meta) ? { hook: sortable, canDrag: () => true } : undefined, rows: rows.map((row) => {
             const dim = row.present ? undefined : { opacity: 0.45 };
             return {
@@ -110,7 +126,7 @@ export function EntriesList({ ops, registry, collection }) {
                         ? _jsx("span", { className: "sm-cell sm-cell--muted", children: relativeTime(row.updatedAt) }, "u")
                         : _jsxs("span", { className: "sm-cell sm-cell--muted", children: ["not in ", locale, " \u2014 click to add"] }, "u"),
                     row.status
-                        ? _jsx(StatusBadge, { status: row.status }, "c")
+                        ? _jsx(StatusBadge, { status: statusLabel(row.status) }, "c")
                         : _jsx("span", { className: "sm-cell sm-cell--muted", children: "\u2014" }, "c"),
                 ],
             };

package/dist/admin/shell/EntryForm.js

@@ -1,44 +1,73 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // The classic field view for ONE locale of an entry (spec 2026-09-06
 // §7): the fields in schema order, the same FieldWidget renderer as the
 // editor sidebar, no tabs. In a multilingual project a field that is
 // NOT .localized() (nor the slug) carries a globe-off mark after its
-// name — every locale sees it — instead of the two "Shared across
-// languages" / "In <locale>" groups (dropped 2026-09-09). The locale
-// switcher loads that locale's merged fields; switching to a locale the
-// entry lacks shows the "Add <locale>" pane, which copies the locale on
-// screen; "Remove from <locale>" sits in the sidebar behind a confirm.
-// Status is per locale and immediate. The safe-delete guard's message
+// name — every locale sees it. The locale switcher loads that locale's
+// merged fields; switching to a locale the entry lacks shows the
+// "Add <locale>" pane, which copies the locale on screen; "Remove from
+// <locale>" sits in the sidebar behind a confirm.
+//
+// Since 2026-09-14 (spec collections draft/publish) the form autosaves
+// like the page editor: no Save button, every edit persists after a
+// debounce, the top bar carries the indicator, View live and the one
+// publish control. A draft may be incomplete; publish validates it and
+// lists the fields in an amber banner. The safe-delete guard's message
 // renders verbatim — it is product surface.
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 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 { relativeTime, 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, Button, FieldErrorList, InfoRow, LinkButton, SaveIndicator, SectionLabel, TopBar, UnlocalizedMark, } 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 { entrySourceLocale, entryTitle, localizedFieldKeys } from "./entries-list.js";
 import { BASE } from "./base.js";
 import { localeFromUrl, writeLocaleToUrl } from "../editor/locale-url.js";
 import { navigate, useLeaveGuard } from "./router.js";
-const STATUSES = ["Draft", "Published"];
 export function EntryForm({ ops, registry, collection, id }) {
     const meta = registry.collections.find((c) => c.name === collection);
-    const isNew = id === "new";
     const multilingual = registry.locales.supported.length > 1;
     const [locale, setLocale] = useState(() => localeFromUrl(registry));
     const [record, setRecord] = useState(null);
-    const [fields, setFields] = useState(isNew ? {} : null);
+    const [fields, setFields] = useState(null);
+    const [urls, setUrls] = useState({});
     const [parentLocales, setParentLocales] = useState(registry.locales.supported);
     const [refOptions, setRefOptions] = useState({});
-    const [banner, setBanner] = useState(null);
+    const [notice, setNotice] = useState(null);
     const [fieldErrors, setFieldErrors] = useState({});
     const [adding, setAdding] = useState(false);
     const [reloadKey, setReloadKey] = useState(0);
+    /** An edit since the last save ack — Publish wakes on it, before the autosave runs (spec 2026-09-13 publish flow §2). */
     const [dirty, setDirty] = useState(false);
-    // A nav click, the Back arrow, a list row: the router asks before
-    // leaving unsaved changes; reload and close ask through beforeunload.
-    useLeaveGuard(dirty);
+    /** Any edit on this screen yet: the indicator stays hidden until the first one (§6). */
+    const [touched, setTouched] = useState(false);
+    const [busy, setBusy] = useState(null);
+    /** The moment after a publish: the button reads "Published ✓". */
+    const [published, setPublished] = useState(false);
+    const [history, setHistory] = useState(null);
+    const [snapshot, setSnapshot] = useState(null);
+    const formRef = useRef(null);
+    const fieldsRef = useRef(fields);
+    fieldsRef.current = fields;
+    // The page editor's controller: debounced, retrying, flushable (spec 2026-09-14 §3).
+    const { saveState, mark, flush } = useDraftAutosave({
+        read: () => fieldsRef.current,
+        persist: async (value) => {
+            const r = await ops.entries.save(collection, id, locale, value);
+            if (r.ok)
+                setRecord(r.data);
+            return r;
+        },
+        onSaved: () => setDirty(false),
+    });
+    // Reload and close ask only while a save is pending or in flight.
+    useLeaveGuard(dirty || saveState !== "saved");
     const refTargets = useMemo(() => {
         const out = {};
         for (const [key, d] of Object.entries(meta?.fields ?? {})) {
@@ -50,26 +79,26 @@ export function EntryForm({ ops, registry, collection, id }) {
     const localeKeys = useMemo(() => (meta ? localizedFieldKeys(meta) : []), [meta]);
     // Load the locale's merged fields; an absent locale comes back with fields: null.
     useEffect(() => {
-        if (isNew)
-            return;
         let cancelled = false;
         setFields(null);
         setFieldErrors({});
+        setDirty(false);
+        setTouched(false);
         ops.entries.get(collection, id, locale).then((r) => {
             if (cancelled)
                 return;
             if (r.ok) {
                 setRecord(r.data.record);
                 setFields(r.data.fields);
+                setUrls(r.data.urls);
                 setParentLocales(r.data.parentLocales);
-                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, collection, id, isNew, locale, reloadKey]);
+    }, [ops, collection, id, locale, reloadKey]);
     // Ref options in the locale being edited: a target absent there is not offered.
     useEffect(() => {
         let cancelled = false;
@@ -93,64 +122,145 @@ export function EntryForm({ ops, registry, collection, id }) {
     }, [ops, refTargets, registry, locale]);
     if (!meta)
         return _jsx("p", { style: { padding: 32 }, children: "No such collection." });
-    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;
+    /** An op's failure onto the screen: amber with the fields for a validation result, red otherwise. */
+    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)
-            return;
-        if (isNew) {
-            const r = await ops.entries.create(collection, { locale, fields });
-            if (applyResult(r, "Created.") && r.ok) {
-                setDirty(false);
-                // force: the create just landed, but React has not flushed setDirty(false) yet.
-                navigate(`${BASE}/${collection}/${encodeURIComponent(r.data.id)}?locale=${encodeURIComponent(locale)}`, { force: true });
-            }
+    /** Publish what is on screen: the pending edit is flushed first, and a failed flush cancels the publish. */
+    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;
         }
-        else {
-            const r = await ops.entries.save(collection, id, locale, fields);
-            if (applyResult(r, "Saved.") && r.ok) {
-                setRecord(r.data);
-                setDirty(false);
-            }
+        let r;
+        try {
+            r = await ops.entries.setStatus(collection, id, locale, "published");
         }
-    };
-    const row = record?.locales[locale];
-    const status = row?.status ?? "draft";
-    const setPublished = async (next) => {
-        if (next === status)
+        catch {
+            r = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setBusy(null);
+        if (!r.ok) {
+            fail(r);
             return;
-        const r = await ops.entries.setStatus(collection, id, locale, next);
-        if (applyResult(r, next === "published" ? "Published." : "Unpublished.") && 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.entries.setStatus(collection, id, locale, "draft");
+        }
+        catch {
+            r = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setBusy(null);
+        if (r.ok)
             setRecord(r.data);
+        else
+            fail(r);
+    };
+    /** Discard (spec 2026-09-13 publish flow §4): confirm, flush so a late save cannot re-dirty the row, restore, reload. */
+    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.entries.discardDraft(collection, id, 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." });
+    };
+    /** History (spec 2026-09-13 history §5): flush first so the list's draft row is current. */
+    const openHistory = async () => {
+        if (!row)
+            return;
+        if (!(await flush())) {
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — history not opened." });
+            return;
+        }
+        const r = await ops.entries.listVersions(collection, id, locale);
+        if (!r.ok) {
+            fail(r);
+            return;
+        }
+        setSnapshot(null);
+        setHistory(historyRows(r.data, row));
+    };
+    const loadSnapshot = async (versionId) => {
+        const r = await ops.entries.getVersion(collection, id, versionId);
+        if (r.ok)
+            setSnapshot({ id: r.data.id, fields: r.data.fields });
+        else
+            fail(r);
+    };
+    const restore = async (versionId) => {
+        const r = await ops.entries.restore(collection, id, 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 goToLocale = (next) => {
         if (next === locale)
             return;
         writeLocaleToUrl(next);
-        setBanner(null);
+        setNotice(null);
         setLocale(next);
     };
-    const switchLocale = (next) => {
+    /** A switch flushes the pending edit first: nothing is ever unsaved past the debounce. */
+    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;
+        }
         goToLocale(next);
     };
     /** Add a locale, copying the locale on screen (or the record's source locale when this one is absent). */
     const doAddLocale = async (target) => {
         if (!record || adding)
             return;
-        if (dirty && !window.confirm("Discard unsaved changes?"))
+        if (!(await flush())) {
+            setNotice({ tone: "error", text: "Couldn't save your latest changes — locale not added." });
             return;
+        }
         const from = record.locales[locale] ? locale : entrySourceLocale(record, registry);
         setAdding(true);
         let result;
@@ -162,7 +272,7 @@ export function EntryForm({ ops, registry, collection, id }) {
         }
         setAdding(false);
         if (!result.ok) {
-            setBanner({ tone: "error", text: result.message });
+            fail(result);
             return;
         }
         setRecord(result.data);
@@ -177,8 +287,6 @@ export function EntryForm({ ops, registry, collection, id }) {
         const remaining = Object.keys(record.locales).filter((l) => l !== locale);
         if (remaining.length === 0)
             return;
-        if (dirty && !window.confirm("Discard unsaved changes?"))
-            return;
         if (!window.confirm(`Remove this entry from ${locale}? Its ${locale} fields and history are deleted.`))
             return;
         let result;
@@ -189,7 +297,7 @@ export function EntryForm({ ops, registry, collection, id }) {
             result = { ok: false, code: "internal", message: "Couldn't reach the server." };
         }
         if (!result.ok) {
-            setBanner({ tone: "error", text: result.message });
+            fail(result);
             return;
         }
         setRecord(result.data);
@@ -202,28 +310,26 @@ export function EntryForm({ ops, registry, collection, id }) {
         if (r.ok)
             navigate(`${BASE}/${collection}`, { force: true });
         else
-            setBanner({ tone: "error", text: r.message });
+            fail(r);
     };
-    const heading = isNew ? "New entry" : record ? entryTitle(record, meta, registry, locale) : id;
+    const heading = record ? entryTitle(record, meta, registry, locale) : "…";
     // The mount's path in the ACTIVE locale prefixes the slug; no path, no prefix.
     const base = meta.path?.[locale];
     const slugPrefix = base ? `/${base}/` : undefined;
     const present = record ? registry.locales.supported.filter((l) => record.locales[l]) : [locale];
-    const widget = ([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: fields?.[key], errors: fieldErrors, refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, prefix: d.type === "slug" ? slugPrefix : undefined, mark: multilingual && !localeKeys.includes(key) ? _jsx(UnlocalizedMark, {}) : undefined, onChange: (value) => { setFields((f) => ({ ...(f ?? {}), [key]: value })); setDirty(true); } }, key));
-    const absent = !isNew && record !== null && fields === null && !record.locales[locale];
+    const widget = ([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: fields?.[key], errors: fieldErrors, refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, prefix: d.type === "slug" ? slugPrefix : undefined, mark: multilingual && !localeKeys.includes(key) ? _jsx(UnlocalizedMark, {}) : undefined, onChange: (value) => {
+            setFields((f) => ({ ...(f ?? {}), [key]: value }));
+            setDirty(true);
+            setTouched(true);
+            mark();
+        } }, key));
+    const absent = record !== null && fields === null && !record.locales[locale];
     return (_jsxs(_Fragment, { children: [_jsx(TopBar, { left: _jsx(_Fragment, { children: _jsx(Breadcrumb, { backHref: `${BASE}/${collection}`, items: [
                             {
                                 label: meta.title, href: `${BASE}/${collection}`,
-                                trailing: multilingual && (isNew
-                                    ? _jsxs("span", { className: "sm-hint", children: ["\u00B7 ", locale] })
-                                    : _jsx(LocaleSwitcher, { registry: registry, present: present, parentLocales: parentLocales, value: locale, adding: adding, onSwitch: switchLocale, onAdd: (l) => void doAddLocale(l) })),
+                                trailing: multilingual && (_jsx(LocaleSwitcher, { registry: registry, present: present, parentLocales: parentLocales, value: locale, adding: adding, onSwitch: (l) => { void switchLocale(l); }, onAdd: (l) => void doAddLocale(l) })),
                             },
                             { label: heading },
-                        ] }) }), right: _jsx(Button, { onClick: save, disabled: fields === null, children: isNew ? "Create" : "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 }), absent ? (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [_jsxs("p", { children: ["This entry doesn't exist in ", locale, " yet. Adding it copies the ", entrySourceLocale(record, registry), " fields as the first ", locale, " draft."] }), _jsxs("div", { style: { display: "flex", gap: 8 }, children: [_jsxs(Button, { onClick: () => void doAddLocale(locale), disabled: adding || !parentLocales.includes(locale), title: parentLocales.includes(locale) ? undefined : `add ${locale} to the parent first`, children: ["Add ", locale] }), _jsxs(Button, { variant: "secondary", onClick: () => switchLocale(entrySourceLocale(record, registry)), children: ["Back to ", entrySourceLocale(record, registry)] })] })] })) : fields !== null ? (Object.entries(meta.fields).map(widget)) : !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: isNew || !row, value: status === "published" ? "Published" : "Draft", onChange: (v) => { void setPublished(v === "Published" ? "published" : "draft"); } }), isNew && _jsx("span", { className: "sm-hint", children: "Create the entry first \u2014 it starts as a draft." })] }), !isNew && record && row && (_jsx(_Fragment, { children: _jsxs("div", { className: "sm-card", children: [_jsx(SectionLabel, { children: "Document info" }), _jsx(InfoRow, { label: "Created", value: relativeTime(record.createdAt) }), _jsx(InfoRow, { label: "Updated", value: relativeTime(row.updatedAt) }), multilingual && _jsx(InfoRow, { label: "Languages", value: Object.keys(record.locales).join(", ") }), _jsx(InfoRow, { label: "ID", value: id, mono: true })] }) })), !isNew && record && (_jsx(_Fragment, { children: _jsxs("div", { className: "sm-card", children: [multilingual && row && Object.keys(record.locales).length > 1 && (_jsxs(Button, { variant: "secondary", onClick: () => void doRemoveLocale(), children: ["Remove from ", locale] })), _jsx(Button, { variant: "danger", onClick: destroy, children: "Delete" })] }) }))] })] })] }));
-}
-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 }), urls[locale] && (_jsx(LinkButton, { href: urls[locale], target: "_blank", rel: "noreferrer", title: "Opens the site route. While the admin's draft-mode cookie is on, this shows the DRAFT \u2014 open it in a private window to see what visitors see.", children: "View live" })), _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 ? (_jsx("fieldset", { disabled: true, className: "sm-history__form", children: Object.entries(meta.fields).map(([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: snapshot.fields[key], refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, prefix: d.type === "slug" ? slugPrefix : undefined, onChange: () => { } }, key))) })) : _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); } })] })), absent ? (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [_jsxs("p", { children: ["This entry doesn't exist in ", locale, " yet. Adding it copies the ", entrySourceLocale(record, registry), " fields as the first ", locale, " draft."] }), _jsxs("div", { style: { display: "flex", gap: 8 }, children: [_jsxs(Button, { onClick: () => void doAddLocale(locale), disabled: adding || !parentLocales.includes(locale), title: parentLocales.includes(locale) ? undefined : `add ${locale} to the parent first`, children: ["Add ", locale] }), _jsxs(Button, { variant: "secondary", onClick: () => { void switchLocale(entrySourceLocale(record, registry)); }, children: ["Back to ", entrySourceLocale(record, registry)] })] })] })) : fields !== null ? (Object.entries(meta.fields).map(widget)) : !notice && _jsx("p", { style: { color: "var(--text-muted)" }, children: "Loading\u2026" })] }), _jsx(ResizeHandle, {}), _jsxs("aside", { className: "sm-inspector", children: [record && row && (_jsxs("div", { className: "sm-card", children: [_jsx(SectionLabel, { children: "Document info" }), _jsx(InfoRow, { label: "Created", value: relativeTime(record.createdAt) }), _jsx(InfoRow, { label: "Updated", value: updatedLine(row.updatedAt, row.updatedBy) }), multilingual && _jsx(InfoRow, { label: "Languages", value: Object.keys(record.locales).join(", ") }), _jsx(InfoRow, { label: "ID", value: id, mono: true })] })), record && (_jsxs("div", { className: "sm-card", children: [multilingual && row && Object.keys(record.locales).length > 1 && (_jsxs(Button, { variant: "secondary", onClick: () => void doRemoveLocale(), children: ["Remove from ", locale] })), _jsx(Button, { variant: "danger", onClick: destroy, children: "Delete" })] }))] })] })] }));
 }

package/dist/admin/shell/GlobalFields.d.ts

@@ -0,0 +1,24 @@
+import type { AdminGlobal } from "../serialize.ts";
+import type { Group } from "../forms/tabs.ts";
+import { type NodeValues } from "../editor/InspectorFields.tsx";
+export type RefOption = {
+    id: string;
+    title: string;
+    status: string;
+};
+/** The item's value map as the inspector reads it: the reserved keys pulled out into their namespaces. */
+export declare function globalValues(fields: Record<string, unknown>): NodeValues;
+export declare function GlobalFields({ item, groups, fields, errors, refOptions, multilingual, inlinePath, onEditHere, onChange }: {
+    item: AdminGlobal;
+    groups: Group[];
+    /** The merged draft fields; a visual item's settings, styles and css under their reserved keys. */
+    fields: Record<string, unknown>;
+    errors?: Record<string, string>;
+    /** Loaded ref options by target collection. */
+    refOptions: Record<string, RefOption[]>;
+    multilingual: boolean;
+    /** The content field with an active inline session: its richtext widget yields to a note. */
+    inlinePath?: string;
+    onEditHere?(): void;
+    onChange(ns: "fields" | "settings" | "styles" | "css", key: string, value: unknown): void;
+}): import("react").JSX.Element;