smoodly 0.0.6 → 0.0.8

package/dist/admin/shell/SharedForm.js

@@ -0,0 +1,146 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+// One shared item, one locale (spec 2026-09-07 §6): 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). Shared fields above, the locale's own below, 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";
+import { STYLES_KEY } from "../../shared.js";
+import { FieldWidget } from "../forms/FieldWidget.js";
+import { relativeTime } from "../ui/format.js";
+import { LocaleSwitcher } from "../ui/LocaleSwitcher.js";
+import { Banner, Breadcrumb, Button, Divider, SectionLabel, Segmented, TopBar } from "../ui/primitives.js";
+import { entryTitle } from "./entries-list.js";
+import { BASE } from "./base.js";
+const STATUSES = ["Draft", "Published"];
+function localeFromUrl(registry) {
+    try {
+        const l = new URLSearchParams(window.location.search).get("locale");
+        if (l && registry.locales.supported.includes(l))
+            return l;
+    }
+    catch {
+        // no window — the default is fine
+    }
+    return registry.locales.default;
+}
+function writeLocaleToUrl(next) {
+    try {
+        const u = new URL(window.location.href);
+        u.searchParams.set("locale", next);
+        window.history.replaceState(null, "", u);
+    }
+    catch {
+        // the URL is cosmetic here
+    }
+}
+export function SharedForm({ ops, registry, name }) {
+    const item = registry.shared.find((s) => s.name === name);
+    const multilingual = registry.locales.supported.length > 1;
+    const [locale, setLocale] = useState(() => localeFromUrl(registry));
+    const [record, setRecord] = useState(null);
+    const [fields, setFields] = useState(null);
+    const [usage, setUsage] = useState([]);
+    const [refOptions, setRefOptions] = useState({});
+    const [banner, setBanner] = useState(null);
+    const [fieldErrors, setFieldErrors] = useState({});
+    const [dirty, setDirty] = useState(false);
+    const refTargets = useMemo(() => {
+        const out = {};
+        for (const [key, d] of Object.entries(item?.fields ?? {})) {
+            if ((d.type === "ref" || d.type === "refList") && typeof d.target === "string")
+                out[key] = d.target;
+        }
+        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({});
+        ops.shared.get(name, locale).then((r) => {
+            if (cancelled)
+                return;
+            if (r.ok) {
+                setRecord(r.data.record);
+                setFields(r.data.fields);
+                setUsage(r.data.usage);
+                setDirty(false);
+            }
+            else
+                setBanner({ tone: "error", text: r.message });
+        }).catch(() => { if (!cancelled)
+            setBanner({ tone: "error", text: "Couldn't reach the server." }); });
+        return () => { cancelled = true; };
+    }, [ops, name, locale]);
+    // Ref options in the locale being edited — the entry form's rule.
+    useEffect(() => {
+        let cancelled = false;
+        for (const target of new Set(Object.values(refTargets))) {
+            const targetMeta = registry.collections.find((c) => c.name === target);
+            ops.entries.list(target).then((r) => {
+                if (cancelled || !r.ok)
+                    return;
+                const options = r.data
+                    .filter((e) => e.locales[locale])
+                    .map((e) => ({ id: e.id, title: targetMeta ? entryTitle(e, targetMeta, registry, locale) : e.id, status: e.locales[locale].status }));
+                setRefOptions((prev) => ({ ...prev, [target]: options }));
+            }).catch(console.error);
+        }
+        return () => { cancelled = true; };
+    }, [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 save = async () => {
+        if (!fields)
+            return;
+        const r = await ops.shared.save(name, locale, fields);
+        if (applyResult(r, "Saved.") && r.ok) {
+            setRecord(r.data);
+            setDirty(false);
+        }
+    };
+    const row = record?.locales[locale];
+    const status = row?.status ?? "draft";
+    const setPublished = async (next) => {
+        if (next === status)
+            return;
+        const r = await ops.shared.setStatus(name, locale, next);
+        if (applyResult(r, next === "published" ? "Published." : "Unpublished.") && r.ok)
+            setRecord(r.data);
+    };
+    const switchLocale = (next) => {
+        if (next === locale)
+            return;
+        if (dirty && !window.confirm("Discard unsaved changes?"))
+            return;
+        writeLocaleToUrl(next);
+        setBanner(null);
+        setLocale(next);
+    };
+    const shared = Object.entries(item.fields).filter(([key]) => !localeKeys.includes(key));
+    const own = Object.entries(item.fields).filter(([key]) => localeKeys.includes(key));
+    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], error: fieldErrors[key], refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, onChange: (value) => { setFields((f) => ({ ...(f ?? {}), [key]: value })); setDirty(true); } }, key));
+    return (_jsxs(_Fragment, { children: [_jsx(TopBar, { left: _jsxs(_Fragment, { children: [_jsx(Breadcrumb, { backHref: `${BASE}/shared`, items: [{ label: "Shared content", href: `${BASE}/shared` }, { label: item.title }] }), multilingual && (_jsx(LocaleSwitcher, { registry: registry, present: registry.locales.supported, parentLocales: [], value: locale, adding: false, onSwitch: switchLocale, onAdd: () => undefined }))] }), right: _jsx(Button, { onClick: save, disabled: fields === null, children: "Save" }) }), _jsxs("div", { style: { flex: 1, minHeight: 0, display: "grid", gridTemplateColumns: "1fr var(--inspector-w)" }, children: [_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 18, padding: "24px 32px", minWidth: 0, overflow: "auto" }, 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: [shared.length > 0 && (_jsxs(_Fragment, { children: [multilingual && _jsx(SectionLabel, { children: "Shared across languages" }), shared.map(widget)] })), own.length > 0 && (_jsxs(_Fragment, { children: [multilingual && _jsxs(SectionLabel, { children: ["In ", locale] }), own.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" })] }), _jsxs("aside", { style: { display: "flex", flexDirection: "column", gap: 16, padding: "16px 14px", minHeight: 0, overflow: "auto", borderLeft: "var(--border)" }, children: [_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, 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 && (_jsxs(_Fragment, { children: [_jsx(Divider, { bleed: 14 }), _jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, 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 })] }));
+}

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

@@ -0,0 +1,6 @@
+import type { AdminOps } from "../ops.ts";
+import type { AdminRegistry } from "../serialize.ts";
+export declare function SharedList({ ops, registry }: {
+    ops: AdminOps;
+    registry: AdminRegistry;
+}): import("react").JSX.Element;

package/dist/admin/shell/SharedList.js

@@ -0,0 +1,62 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+// The Shared content list (spec 2026-09-07 §6): every registered item is
+// a row, edited on its own page. Nothing here is created or deleted by
+// editors — the registry declares the items and ops.shared.list
+// materializes them — so there is no "+ New".
+import { useCallback, useEffect, useState } from "react";
+import { ListView } from "./ListView.js";
+import { sharedRows } from "./shared-list.js";
+import { Segmented, StatusBadge } from "../ui/primitives.js";
+import { relativeTime } from "../ui/format.js";
+import { BASE } from "./base.js";
+import { ErrorPane } from "./ErrorPane.js";
+const LOCALE_KEY = "smoodly.entries.locale"; // the same choice the collection lists remember
+function rememberedLocale(registry) {
+    try {
+        const stored = window.sessionStorage.getItem(LOCALE_KEY);
+        if (stored && registry.locales.supported.includes(stored))
+            return stored;
+    }
+    catch {
+        // storage unavailable — the default is fine
+    }
+    return registry.locales.default;
+}
+export function SharedList({ ops, registry }) {
+    const [items, setItems] = useState(null);
+    const [error, setError] = useState(null);
+    const [locale, setLocale] = useState(() => rememberedLocale(registry));
+    const multilingual = registry.locales.supported.length > 1;
+    const pickLocale = (next) => {
+        setLocale(next);
+        try {
+            window.sessionStorage.setItem(LOCALE_KEY, next);
+        }
+        catch { /* see rememberedLocale */ }
+    };
+    const load = useCallback(() => {
+        ops.shared.list()
+            .then((r) => (r.ok ? setItems(r.data) : setError(r.message)))
+            .catch(() => setError("Couldn't reach the server."));
+    }, [ops]);
+    useEffect(load, [load]);
+    if (error)
+        return _jsx(ErrorPane, { message: error });
+    const rows = items ? sharedRows(items, registry, locale) : [];
+    return (_jsx(ListView, { title: "Shared content", count: items ? rows.length : undefined, actions: multilingual ? _jsx(Segmented, { options: registry.locales.supported, value: locale, onChange: pickLocale }) : undefined, columns: [
+            { label: "Title", width: "minmax(160px,1fr)" },
+            { label: "Kind", width: "90px" },
+            { label: "Updated", width: "minmax(110px,160px)" },
+            { label: "Status", width: "120px" },
+        ], empty: items ? "No shared content is registered." : "Loading…", rows: rows.map((row) => ({
+            key: row.name,
+            href: `${BASE}/shared/${encodeURIComponent(row.name)}?locale=${encodeURIComponent(locale)}`,
+            cells: [
+                _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"),
+            ],
+        })) }));
+}

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

@@ -0,0 +1,21 @@
+import type { EntryRecord } from "../../entry-store.ts";
+import type { AdminCollection, AdminRegistry } from "../serialize.ts";
+import { type LocaleStatus } from "./pages-tree.ts";
+export type EntryRow = {
+    id: string;
+    title: string;
+    present: boolean;
+    status: LocaleStatus | null;
+    /** 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
+ *  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. */
+export declare function entrySourceLocale(record: EntryRecord, registry: AdminRegistry): string;
+/** The form keys a locale owns: `.localized()` fields, and `slug` always
+ *  (the same split entry-store.ts's splitFields makes). */
+export declare function localizedFieldKeys(meta: AdminCollection): string[];
+export declare function entryRows(records: EntryRecord[], meta: AdminCollection, registry: AdminRegistry, locale: string): EntryRow[];

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

@@ -0,0 +1,36 @@
+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
+ *  title field reads the same from every locale. */
+export function entryTitle(record, meta, registry, locale) {
+    const key = meta.titleField;
+    const from = (l) => {
+        const row = record.locales[l];
+        if (!row || !key)
+            return undefined;
+        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;
+}
+/** The locale an "Add <locale>" copies from: the default when the record has it, else its first. */
+export function entrySourceLocale(record, registry) {
+    return record.locales[registry.locales.default] ? registry.locales.default : Object.keys(record.locales)[0];
+}
+/** The form keys a locale owns: `.localized()` fields, and `slug` always
+ *  (the same split entry-store.ts's splitFields makes). */
+export function localizedFieldKeys(meta) {
+    return Object.entries(meta.fields).filter(([key, d]) => key === "slug" || d.localized === true).map(([key]) => key);
+}
+export function entryRows(records, meta, registry, locale) {
+    return records.map((record) => {
+        const row = record.locales[locale];
+        return {
+            id: record.id,
+            title: entryTitle(record, meta, registry, locale),
+            present: row !== undefined,
+            status: row ? localeStatusOf(row) : null,
+            updatedAt: row ? row.updatedAt : record.updatedAt,
+        };
+    });
+}

package/dist/admin/shell/pages-tree.d.ts

@@ -1,19 +1,31 @@
-import type { PageRecord } from "../../store.ts";
+import type { PageLocale, PageRecord } from "../../store.ts";
 import type { AdminCollection, AdminPageTemplate, AdminRegistry } from "../serialize.ts";
+type NodeLike = {
+    parentId: string | null;
+    locales: Record<string, {
+        slug: string;
+    }>;
+};
 /** Registrations editors may create pages against: fixed ones are
  *  materialized by Smoodly, never offered. */
 export declare function openTemplates(templates: AdminPageTemplate[]): AdminPageTemplate[];
 /** The collection a ROOT record is the mount of, if any — known from the
  *  registry, never from a column (spec 2026-09-05 §4). */
-export declare function mountOf(record: {
-    parentId: string | null;
-    slug: string;
-}, registry: AdminRegistry): AdminCollection | null;
-/** Fixed pages and mounts: never renamed, moved or deleted by editors. */
-export declare function isFixedNode(record: {
-    parentId: string | null;
-    slug: string;
-}, registry: AdminRegistry): boolean;
+export declare function mountOf(record: NodeLike, registry: AdminRegistry): AdminCollection | null;
+/** Fixed pages and mounts: never renamed, moved, deleted or stripped of a locale by editors. */
+export declare function isFixedNode(record: NodeLike, registry: AdminRegistry): boolean;
+/** A node's title for display in a locale it may not exist in: its own,
+ *  else the default locale's, else any. Display only — never content. */
+export declare function displayTitle(record: PageRecord, locale: string, registry: AdminRegistry): string;
+/** The locale an "Add <locale>" copies from: the default when the node has it, else its first. */
+export declare function sourceLocaleOf(record: PageRecord, registry: AdminRegistry): string;
+export type LocaleStatus = "published" | "draft edits" | "draft";
+/** Whether a locale's row is live, and if so whether the draft has moved
+ *  on. `status` decides — spec 2026-09-06 §2 keeps it as a column so a
+ *  future unpublish can clear it while the version pointers stay — and
+ *  the pointers only tell "published" from "draft edits". The Pages list
+ *  and the editor's badge both read it here so they cannot disagree. */
+export declare function localeStatusOf(row: Pick<PageLocale, "status" | "draftVersionId" | "publishedVersionId">): LocaleStatus;
 export type PagesTreeRow = {
     id: string;
     parentId: string | null;
@@ -24,7 +36,12 @@ export type PagesTreeRow = {
     hasChildren: boolean;
     expanded: boolean;
     title: string;
-    path: string;
+    /** The node's path in the selected locale; null when it is absent there. */
+    path: string | null;
+    /** Whether the node exists in the selected locale. */
+    present: boolean;
+    /** Every locale the node exists in. */
+    locales: string[];
     kind: "page" | "folder" | "mount";
     collection: string | null;
     fixed: boolean;
@@ -32,8 +49,9 @@ export type PagesTreeRow = {
     isHome: boolean;
     template: string | null;
     templateTitle: string;
-    status: "published" | "draft edits" | "draft" | null;
+    status: LocaleStatus | null;
     canHaveChildren: boolean;
     record: PageRecord;
 };
 export declare function pagesTreeRows(records: PageRecord[], registry: AdminRegistry, locale: string, collapsed: ReadonlySet<string>): PagesTreeRow[];
+export {};

package/dist/admin/shell/pages-tree.js

@@ -1,24 +1,57 @@
 // Pure view-model for the Pages list — the tree of the design system's
 // TreeTable (indent per depth, chevron on parents, the derived path as
-// the slug column). The shell is not DOM-tested; every decision that
+// the slug column) for ONE selected locale (spec 2026-09-06 §6). The
+// structure is shared, so every node has a row; presence is per locale,
+// so a node absent from the selected locale is dimmed with no path and
+// an "Add" action. The shell is not DOM-tested; every decision that
 // matters lives here.
-import { titleFor } from "../../localize.js";
 import { buildPageTree } from "../../paths.js";
 /** Registrations editors may create pages against: fixed ones are
  *  materialized by Smoodly, never offered. */
 export function openTemplates(templates) {
     return templates.filter((t) => t.slug === undefined);
 }
+/** The default-locale slug that identifies a ROOT node to the registry;
+ *  a root that exists in another locale only is never code-owned. */
+const rootSlug = (record, registry) => record.parentId === null ? record.locales[registry.locales.default]?.slug : undefined;
 /** The collection a ROOT record is the mount of, if any — known from the
  *  registry, never from a column (spec 2026-09-05 §4). */
 export function mountOf(record, registry) {
-    if (record.parentId !== null)
+    const slug = rootSlug(record, registry);
+    if (slug === undefined)
         return null;
-    return registry.collections.find((c) => c.path?.[registry.locales.default] === record.slug) ?? null;
+    return registry.collections.find((c) => c.path?.[registry.locales.default] === slug) ?? null;
 }
-/** Fixed pages and mounts: never renamed, moved or deleted by editors. */
+/** Fixed pages and mounts: never renamed, moved, deleted or stripped of a locale by editors. */
 export function isFixedNode(record, registry) {
-    return record.parentId === null && (registry.pages.some((t) => t.slug === record.slug) || mountOf(record, registry) !== null);
+    const slug = rootSlug(record, registry);
+    return slug !== undefined && (registry.pages.some((t) => t.slug === slug) || mountOf(record, registry) !== null);
+}
+/** A node's title for display in a locale it may not exist in: its own,
+ *  else the default locale's, else any. Display only — never content. */
+export function displayTitle(record, locale, registry) {
+    return (record.locales[locale]?.title ??
+        record.locales[registry.locales.default]?.title ??
+        Object.values(record.locales)[0]?.title ??
+        record.id);
+}
+/** The locale an "Add <locale>" copies from: the default when the node has it, else its first. */
+export function sourceLocaleOf(record, registry) {
+    return record.locales[registry.locales.default] ? registry.locales.default : Object.keys(record.locales)[0];
+}
+/** Whether a locale's row is live, and if so whether the draft has moved
+ *  on. `status` decides — spec 2026-09-06 §2 keeps it as a column so a
+ *  future unpublish can clear it while the version pointers stay — and
+ *  the pointers only tell "published" from "draft edits". The Pages list
+ *  and the editor's badge both read it here so they cannot disagree. */
+export function localeStatusOf(row) {
+    if (row.status !== "published")
+        return "draft";
+    // Pointers exist on pages and on versioned collections; a row without
+    // them is live as it stands.
+    if (row.publishedVersionId === null)
+        return "published";
+    return row.publishedVersionId === row.draftVersionId ? "published" : "draft edits";
 }
 export function pagesTreeRows(records, registry, locale, collapsed) {
     const opts = { locales: registry.locales, homePageSlug: registry.homePageSlug };
@@ -27,8 +60,10 @@ export function pagesTreeRows(records, registry, locale, collapsed) {
     const walk = (nodes, depth, parentId) => {
         nodes.forEach((node, index) => {
             const r = node.record;
+            const row = r.locales[locale];
+            const present = row !== undefined;
             const mount = mountOf(r, registry);
-            const isHome = r.parentId === null && r.slug === registry.homePageSlug;
+            const isHome = r.parentId === null && r.locales[registry.locales.default]?.slug === registry.homePageSlug;
             const expanded = !collapsed.has(r.id);
             rows.push({
                 id: r.id,
@@ -38,8 +73,10 @@ export function pagesTreeRows(records, registry, locale, collapsed) {
                 siblingCount: nodes.length,
                 hasChildren: node.children.length > 0,
                 expanded,
-                title: titleFor(r, locale, registry.locales),
+                title: displayTitle(r, locale, registry),
                 path: node.path,
+                present,
+                locales: Object.keys(r.locales),
                 kind: mount ? "mount" : r.template === null ? "folder" : "page",
                 collection: mount?.name ?? null,
                 fixed: isFixedNode(r, registry),
@@ -48,12 +85,9 @@ export function pagesTreeRows(records, registry, locale, collapsed) {
                 templateTitle: mount
                     ? r.template === null ? "Collection" : `Collection · ${templateTitle(r.template)}`
                     : r.template === null ? "Folder" : templateTitle(r.template),
-                status: r.template === null
-                    ? null
-                    : r.publishedVersionId
-                        ? r.publishedVersionId === r.draftVersionId ? "published" : "draft edits"
-                        : "draft",
-                canHaveChildren: !mount && !isHome && depth + 1 < registry.pageDepth,
+                status: !row || r.template === null ? null : localeStatusOf(row),
+                // A child needs its parent in the locale (the parent rule), so an absent node offers none.
+                canHaveChildren: present && !mount && !isHome && depth + 1 < registry.pageDepth,
                 record: r,
             });
             if (expanded)

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

@@ -0,0 +1,14 @@
+import type { EntryRecord } from "../../entry-store.ts";
+import type { AdminRegistry } from "../serialize.ts";
+import { type LocaleStatus } from "./pages-tree.ts";
+export type SharedRow = {
+    name: string;
+    title: string;
+    flavour: "Visual" | "Fields";
+    status: LocaleStatus;
+    updatedAt: number;
+};
+export declare function sharedRows(items: {
+    name: string;
+    record: EntryRecord;
+}[], registry: AdminRegistry, locale: string): SharedRow[];

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

@@ -0,0 +1,17 @@
+import { localeStatusOf } from "./pages-tree.js";
+export function sharedRows(items, registry, locale) {
+    const byName = new Map(items.map((i) => [i.name, i.record]));
+    return registry.shared.flatMap((item) => {
+        const record = byName.get(item.name);
+        const row = record?.locales[locale];
+        if (!record || !row)
+            return [];
+        return [{
+                name: item.name,
+                title: item.title,
+                flavour: item.section !== undefined ? "Visual" : "Fields",
+                status: localeStatusOf(row),
+                updatedAt: row.updatedAt,
+            }];
+    });
+}

package/dist/admin/tree-ops.d.ts

@@ -1,6 +1,6 @@
 import type { PageTree, TreeNode } from "../render.tsx";
 import type { ZonePolicy } from "../zones.ts";
-import type { AdminSection } from "./serialize.ts";
+import type { AdminSection, AdminShared } from "./serialize.ts";
 export declare function zoneOf(tree: PageTree, id: string): string | null;
 export declare function findNode(tree: PageTree, id: string): TreeNode | null;
 export declare function insertNode(tree: PageTree, zone: string, index: number, node: TreeNode): PageTree;
@@ -9,11 +9,18 @@ export declare function moveNode(tree: PageTree, id: string, dir: -1 | 1): PageT
 export declare function patchNode(tree: PageTree, id: string, ns: "fields" | "styles" | "meta", key: string, value: unknown): PageTree;
 export declare function canInsert(policy: ZonePolicy | undefined, count: number): boolean;
 export declare function allowedSections(policy: ZonePolicy | undefined, all: AdminSection[]): AdminSection[];
+/** The visual items the picker offers in a zone: materialized (an id is
+ *  known) and rendering a section the zone's policy allows. */
+export declare function allowedShared(policy: ZonePolicy | undefined, shared: AdminShared[], sharedIds: Record<string, string>): AdminShared[];
+/** A page places a visual item as this node (spec 2026-09-07 §6): `item`
+ *  names the registration, `ref` is the item's row id. */
+export declare function placementNode(item: AdminShared, ref: string, id: string): TreeNode;
 export declare function nodeFromSample(section: AdminSection, id: string): TreeNode;
 /** A locked zone holds exactly one node the editor can never insert or
  * remove — so someone has to put it there. This does, from the component's
- * sample, for every locked zone that is empty or missing. Runs when the
- * editor loads a draft, which also covers pages that predate a locked zone
- * being added to their schema. Returns the same tree when nothing changed. */
-export declare function fillLockedZones(tree: PageTree, policies: Record<string, ZonePolicy>, sections: AdminSection[]): PageTree;
+ * sample (or, for a zone bound to a shared item, a placement), for every
+ * locked zone that is empty or missing. Runs when the editor loads a draft,
+ * which also covers pages that predate a locked zone being added to their
+ * schema. Returns the same tree when nothing changed. */
+export declare function fillLockedZones(tree: PageTree, policies: Record<string, ZonePolicy>, sections: AdminSection[], sharedIds?: Record<string, string>): PageTree;
 export declare function newNodeId(type: string): string;

package/dist/admin/tree-ops.js

@@ -1,3 +1,4 @@
+import { SHARED_NODE_TYPE } from "../shared.js";
 export function zoneOf(tree, id) {
     for (const [zone, nodes] of Object.entries(tree.zones)) {
         if (nodes.some((n) => n.id === id))
@@ -60,6 +61,22 @@ export function allowedSections(policy, all) {
     const allow = new Set(policy.allow);
     return all.filter((s) => allow.has(s.name));
 }
+/** The visual items the picker offers in a zone: materialized (an id is
+ *  known) and rendering a section the zone's policy allows. */
+export function allowedShared(policy, shared, sharedIds) {
+    if (!policy || policy.kind === "locked")
+        return [];
+    return shared.filter((s) => {
+        if (s.section === undefined || sharedIds[s.name] === undefined)
+            return false;
+        return policy.allow === "*" || policy.allow.includes(s.section);
+    });
+}
+/** A page places a visual item as this node (spec 2026-09-07 §6): `item`
+ *  names the registration, `ref` is the item's row id. */
+export function placementNode(item, ref, id) {
+    return { id, type: SHARED_NODE_TYPE, fields: { item: item.name, ref } };
+}
 /** The empty value a fresh node's field starts at, by descriptor type.
  * Shape matters: a list-valued field seeded with "" is a type lie that
  * crashes the first section view that maps over it. */
@@ -89,21 +106,35 @@ export function nodeFromSample(section, id) {
 }
 /** A locked zone holds exactly one node the editor can never insert or
  * remove — so someone has to put it there. This does, from the component's
- * sample, for every locked zone that is empty or missing. Runs when the
- * editor loads a draft, which also covers pages that predate a locked zone
- * being added to their schema. Returns the same tree when nothing changed. */
-export function fillLockedZones(tree, policies, sections) {
+ * sample (or, for a zone bound to a shared item, a placement), for every
+ * locked zone that is empty or missing. Runs when the editor loads a draft,
+ * which also covers pages that predate a locked zone being added to their
+ * schema. Returns the same tree when nothing changed. */
+export function fillLockedZones(tree, policies, sections, sharedIds = {}) {
     let next = null;
     for (const [zone, policy] of Object.entries(policies)) {
         if (policy.kind !== "locked")
             continue;
         if ((tree.zones[zone] ?? []).length > 0)
             continue;
-        const section = sections.find((s) => s.name === policy.component);
-        if (!section)
-            continue;
+        let node = null;
+        if (policy.shared !== undefined) {
+            // Bound to a shared item (spec 2026-09-07 §4): a placement, once
+            // the editor has loaded the item's row id; until then leave the
+            // zone empty rather than seed a plain section there.
+            const ref = sharedIds[policy.shared];
+            if (ref === undefined)
+                continue;
+            node = placementNode({ name: policy.shared }, ref, newNodeId(SHARED_NODE_TYPE));
+        }
+        else {
+            const section = sections.find((s) => s.name === policy.component);
+            if (!section)
+                continue;
+            node = nodeFromSample(section, newNodeId(section.name));
+        }
         next ?? (next = { ...tree, zones: { ...tree.zones } });
-        next.zones[zone] = [nodeFromSample(section, newNodeId(section.name))];
+        next.zones[zone] = [node];
     }
     return next ?? tree;
 }

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

@@ -0,0 +1,11 @@
+import type { AdminRegistry } from "../serialize.ts";
+export declare function LocaleSwitcher({ registry, present, parentLocales, value, adding, onSwitch, onAdd }: {
+    registry: AdminRegistry;
+    /** The locales the record has; `[value]` while nothing is loaded. */
+    present: string[];
+    parentLocales: string[];
+    value: string;
+    adding: boolean;
+    onSwitch(locale: string): void;
+    onAdd(locale: string): void;
+}): import("react").JSX.Element;

package/dist/admin/ui/LocaleSwitcher.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function LocaleSwitcher({ registry, present, parentLocales, value, adding, onSwitch, onAdd }) {
+    const missing = registry.locales.supported.filter((l) => !present.includes(l) && l !== value);
+    return (_jsxs("select", { className: "sm-input", style: { width: "auto" }, value: value, "aria-label": "Locale", onChange: (e) => { const v = e.target.value; if (v.startsWith("+"))
+            onAdd(v.slice(1));
+        else
+            onSwitch(v); }, children: [present.map((l) => _jsx("option", { value: l, children: l }, l)), !present.includes(value) && _jsxs("option", { value: value, children: [value, " (not yet)"] }), missing.length > 0 && (_jsx("optgroup", { label: "Add locale", disabled: adding, children: missing.map((l) => {
+                    const blocked = !parentLocales.includes(l);
+                    const reason = `add ${l} to the parent first`;
+                    return blocked
+                        ? _jsxs("option", { value: `+${l}`, disabled: true, title: reason, children: ["+ ", l, " \u2014 ", reason] }, l)
+                        : _jsxs("option", { value: `+${l}`, children: ["+ ", l] }, l);
+                }) }))] }));
+}