smoodly 0.0.6 → 0.0.7

package/dist/admin/shell/EntryForm.js

@@ -1,28 +1,57 @@
-// packages/smoodly/src/admin/shell/EntryForm.tsx
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-// The classic field view: same FieldWidget renderer as the editor sidebar,
-// no tabs (collections are fields-only by design). The safe-delete guard's
-// message renders verbatim — it is product surface, not an error detail.
-//
-// Layout follows the design system's article-edit screen: top bar with the
-// breadcrumb and the save action, a roomy field column, and a 300px sidebar
-// holding status and document info.
+// The classic field view for ONE locale of an entry (spec 2026-09-06
+// §7): shared fields (every locale sees them) above, the locale's own
+// fields — the .localized() ones and the slug — below, the same
+// FieldWidget renderer as the editor sidebar, no tabs. The locale
+// switcher loads that locale's merged fields; "Add locale" 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 renders verbatim — it is product surface.
 import { useEffect, useMemo, useState } from "react";
 import { FieldWidget } from "../forms/FieldWidget.js";
 import { relativeTime } from "../ui/format.js";
-import { Banner, Breadcrumb, Button, Divider, SectionLabel, Segmented, TopBar, } from "../ui/primitives.js";
+import { LocaleSwitcher } from "../ui/LocaleSwitcher.js";
+import { Banner, Breadcrumb, Button, Divider, SectionLabel, Segmented, TopBar } from "../ui/primitives.js";
+import { entrySourceLocale, entryTitle, localizedFieldKeys } from "./entries-list.js";
+import { BASE } from "./base.js";
 const STATUSES = ["Draft", "Published"];
+/** The locale to edit: from the URL (the list links here with ?locale=), else the default. */
+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 EntryForm({ ops, registry, collection, id }) {
     const meta = registry.collections.find((c) => c.name === collection);
     const isNew = id === "new";
-    const [fields, setFields] = useState({});
-    const [status, setStatus] = useState("draft");
-    const [stamps, setStamps] = useState(null);
+    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 [parentLocales, setParentLocales] = useState(registry.locales.supported);
     const [refOptions, setRefOptions] = useState({});
     const [banner, setBanner] = useState(null);
     const [fieldErrors, setFieldErrors] = useState({});
-    const [loaded, setLoaded] = useState(isNew);
+    const [adding, setAdding] = useState(false);
+    const [reloadKey, setReloadKey] = useState(0);
+    const [dirty, setDirty] = useState(false);
     const refTargets = useMemo(() => {
         const out = {};
         for (const [key, d] of Object.entries(meta?.fields ?? {})) {
@@ -31,33 +60,50 @@ export function EntryForm({ ops, registry, collection, id }) {
         }
         return out;
     }, [meta]);
+    const localeKeys = useMemo(() => (meta ? localizedFieldKeys(meta) : []), [meta]);
+    // Load the locale's merged fields; an absent locale comes back with fields: null.
     useEffect(() => {
-        if (!isNew) {
-            ops.entries.get(collection, id).then((r) => {
-                if (r.ok) {
-                    setFields(r.data.fields);
-                    setStatus(r.data.status);
-                    setLoaded(true);
-                    setStamps({ createdAt: r.data.createdAt, updatedAt: r.data.updatedAt });
-                }
-                else
-                    setBanner({ tone: "error", text: r.message });
-            }).catch(() => setBanner({ tone: "error", text: "Couldn't reach the server." }));
-        }
+        if (isNew)
+            return;
+        let cancelled = false;
+        setFields(null);
+        setFieldErrors({});
+        ops.entries.get(collection, id, locale).then((r) => {
+            if (cancelled)
+                return;
+            if (r.ok) {
+                setRecord(r.data.record);
+                setFields(r.data.fields);
+                setParentLocales(r.data.parentLocales);
+                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, collection, id, isNew, locale, reloadKey]);
+    // Ref options in the locale being edited: a target absent there is not offered.
+    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 (!r.ok)
+                // A list issued for the previous locale must not overwrite this one's.
+                if (cancelled || !r.ok)
                     return;
-                const options = r.data.map((e) => ({
+                const options = r.data
+                    .filter((e) => e.locales[locale])
+                    .map((e) => ({
                     id: e.id,
-                    title: String((targetMeta?.titleField && e.fields[targetMeta.titleField]) ?? e.id),
-                    status: e.status,
+                    title: targetMeta ? entryTitle(e, targetMeta, registry, locale) : e.id,
+                    status: e.locales[locale].status,
                 }));
                 setRefOptions((prev) => ({ ...prev, [target]: options }));
             }).catch(console.error);
         }
-    }, [ops, collection, id, isNew, refTargets, registry]);
+        return () => { cancelled = true; };
+    }, [ops, refTargets, registry, locale]);
     if (!meta)
         return _jsx("p", { style: { padding: 32 }, children: "No such collection." });
     const applyResult = (r, okText) => {
@@ -71,46 +117,118 @@ export function EntryForm({ ops, registry, collection, id }) {
         return false;
     };
     const save = async () => {
+        if (!fields)
+            return;
         if (isNew) {
-            const r = await ops.entries.create(collection, fields);
+            const r = await ops.entries.create(collection, { locale, fields });
             if (applyResult(r, "Created.") && r.ok) {
-                window.location.href = `/admin/${collection}/${encodeURIComponent(r.data.id)}`;
+                setDirty(false);
+                window.location.href = `${BASE}/${collection}/${encodeURIComponent(r.data.id)}?locale=${encodeURIComponent(locale)}`;
             }
         }
         else {
-            const r = await ops.entries.save(collection, id, fields);
-            if (applyResult(r, "Saved.") && r.ok)
-                setStamps({ createdAt: r.data.createdAt, updatedAt: r.data.updatedAt });
+            const r = await ops.entries.save(collection, id, 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.entries.setStatus(collection, id, next);
-        if (applyResult(r, next === "published" ? "Published." : "Unpublished."))
-            setStatus(next);
+        const r = await ops.entries.setStatus(collection, id, locale, next);
+        if (applyResult(r, next === "published" ? "Published." : "Unpublished.") && r.ok)
+            setRecord(r.data);
+    };
+    const goToLocale = (next) => {
+        if (next === locale)
+            return;
+        writeLocaleToUrl(next);
+        setBanner(null);
+        setLocale(next);
+    };
+    const switchLocale = (next) => {
+        if (next === locale)
+            return;
+        if (dirty && !window.confirm("Discard unsaved changes?"))
+            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?"))
+            return;
+        const from = record.locales[locale] ? locale : entrySourceLocale(record, registry);
+        setAdding(true);
+        let result;
+        try {
+            result = await ops.entries.addLocale(collection, id, target, { from });
+        }
+        catch {
+            result = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setAdding(false);
+        if (!result.ok) {
+            setBanner({ tone: "error", text: result.message });
+            return;
+        }
+        setRecord(result.data);
+        if (target === locale)
+            setReloadKey((k) => k + 1);
+        else
+            goToLocale(target);
+    };
+    const doRemoveLocale = async () => {
+        if (!record)
+            return;
+        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;
+        try {
+            result = await ops.entries.removeLocale(collection, id, locale);
+        }
+        catch {
+            result = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        if (!result.ok) {
+            setBanner({ tone: "error", text: result.message });
+            return;
+        }
+        setRecord(result.data);
+        goToLocale(remaining.includes(registry.locales.default) ? registry.locales.default : remaining[0]);
     };
     const destroy = async () => {
-        if (!window.confirm("Delete this entry?"))
+        if (!window.confirm(multilingual ? "Delete this entry in every language?" : "Delete this entry?"))
             return;
         const r = await ops.entries.delete(collection, id);
         if (r.ok)
-            window.location.href = `/admin/${collection}`;
+            window.location.href = `${BASE}/${collection}`;
         else
             setBanner({ tone: "error", text: r.message });
     };
-    const titleValue = meta.titleField ? fields[meta.titleField] : undefined;
-    const heading = isNew ? "New entry" : (typeof titleValue === "string" && titleValue) || id;
-    // The mount's path in the default locale prefixes the slug (spec §7);
-    // a collection without a path has no URLs and shows no prefix.
-    const base = meta.path?.[registry.locales.default];
+    const heading = isNew ? "New entry" : record ? entryTitle(record, meta, registry, locale) : id;
+    // 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;
-    return (_jsxs(_Fragment, { children: [_jsx(TopBar, { left: _jsx(Breadcrumb, { backHref: `/admin/${collection}`, items: [{ label: meta.title, href: `/admin/${collection}` }, { label: heading }] }), right: _jsx(Button, { onClick: save, disabled: !loaded, children: isNew ? "Create" : "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 }), loaded
-                                ? Object.entries(meta.fields).map(([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: fields[key], error: fieldErrors[key], refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, prefix: d.type === "slug" ? slugPrefix : undefined, onChange: (value) => setFields((f) => ({ ...f, [key]: value })) }, key)))
-                                : !banner && _jsx("p", { style: { color: "var(--text-muted)" }, children: "Loading\u2026" })] }), _jsxs("aside", { style: {
+    const present = record ? registry.locales.supported.filter((l) => record.locales[l]) : [locale];
+    const shared = Object.entries(meta.fields).filter(([key]) => !localeKeys.includes(key));
+    const own = Object.entries(meta.fields).filter(([key]) => localeKeys.includes(key));
+    const widget = ([key, d]) => (_jsx(FieldWidget, { fieldKey: key, descriptor: d, value: fields?.[key], error: fieldErrors[key], refOptions: refTargets[key] ? refOptions[refTargets[key]] ?? [] : undefined, prefix: d.type === "slug" ? slugPrefix : undefined, onChange: (value) => { setFields((f) => ({ ...(f ?? {}), [key]: value })); setDirty(true); } }, key));
+    const absent = !isNew && record !== null && fields === null && !record.locales[locale];
+    return (_jsxs(_Fragment, { children: [_jsx(TopBar, { left: _jsxs(_Fragment, { children: [_jsx(Breadcrumb, { backHref: `${BASE}/${collection}`, items: [{ label: meta.title, href: `${BASE}/${collection}` }, { label: heading }] }), multilingual && !isNew && (_jsx(LocaleSwitcher, { registry: registry, present: present, parentLocales: parentLocales, value: locale, adding: adding, onSwitch: switchLocale, onAdd: (l) => void doAddLocale(l) })), multilingual && isNew && _jsxs("span", { className: "sm-hint", children: ["\u00B7 ", locale] })] }), right: _jsx(Button, { onClick: save, disabled: fields === null, children: isNew ? "Create" : "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 }), 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 ? (_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)] }))] })) : !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: [_jsx(SectionLabel, { children: "Status" }), _jsx(Segmented, { options: STATUSES, stretch: true, disabled: isNew || !loaded, 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 && stamps && (_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: "Created", value: relativeTime(stamps.createdAt) }), _jsx(InfoRow, { label: "Updated", value: relativeTime(stamps.updatedAt) }), _jsx(InfoRow, { label: "ID", value: id, mono: true })] })] })), !isNew && (_jsxs(_Fragment, { children: [_jsx(Divider, { bleed: 14 }), _jsx(Button, { variant: "danger", disabled: !loaded, onClick: destroy, children: "Delete" })] }))] })] })] }));
+                        }, children: [_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, 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 && (_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: "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 && (_jsxs(_Fragment, { children: [_jsx(Divider, { bleed: 14 }), _jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, 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: {

package/dist/admin/shell/PagesList.js

@@ -1,21 +1,46 @@
 // packages/smoodly/src/admin/shell/PagesList.tsx
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-// The Pages list: the tree of the design system's TreeTable, plus the
-// row menu (New subpage/subfolder, Add page here, Rename, Move, Delete)
-// as a floating popover positioned from the triggering click.
+// The Pages list: the tree of the design system's TreeTable for ONE
+// selected locale (spec 2026-09-06 §6), plus the row menu (New
+// subpage/subfolder, Add page here, Add <locale>, Rename, Move, Remove
+// from <locale>, Delete) as a floating popover positioned from the
+// triggering click. Structure is shared, so every node has a row; a node
+// absent from the selected locale is dimmed and offers "Add <locale>".
 import { useCallback, useEffect, useState } from "react";
 import { ListView } from "./ListView.js";
-import { openTemplates, pagesTreeRows } from "./pages-tree.js";
-import { Button, StatusBadge } from "../ui/primitives.js";
+import { openTemplates, pagesTreeRows, sourceLocaleOf } from "./pages-tree.js";
+import { Button, Segmented, StatusBadge } from "../ui/primitives.js";
 import { BASE } from "./base.js";
 import { ErrorPane } from "./ErrorPane.js";
+const LOCALE_KEY = "smoodly.pages.locale";
+/** The selected locale survives a reload within the session; a stored
+ *  value that is no longer supported falls back to the default. */
+function rememberedLocale(registry) {
+    try {
+        const stored = window.sessionStorage.getItem(LOCALE_KEY);
+        if (stored && registry.locales.supported.includes(stored))
+            return stored;
+    }
+    catch {
+        // storage unavailable (private mode, no window) — the default is fine
+    }
+    return registry.locales.default;
+}
 export function PagesList({ ops, registry }) {
     const [pages, setPages] = useState(null);
     const [error, setError] = useState(null);
     const [collapsed, setCollapsed] = useState(() => new Set());
     const [menu, setMenu] = useState(null);
-    const locale = registry.locales.default;
+    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.pages.list()
             .then((r) => (r.ok ? setPages(r.data) : setError(r.message)))
@@ -29,7 +54,10 @@ export function PagesList({ ops, registry }) {
         next.delete(id);
     else
         next.add(id); return next; });
-    const openEditor = (id) => { window.location.href = `${BASE}/pages/${encodeURIComponent(id)}`; };
+    /** The editor opens in the locale selected here. */
+    const openEditor = (id) => {
+        window.location.href = `${BASE}/pages/${encodeURIComponent(id)}?locale=${encodeURIComponent(locale)}`;
+    };
     /** Run an op; on success reload the list (and maybe navigate), else show the op's message. */
     const run = async (work, then) => {
         let result;
@@ -53,6 +81,7 @@ export function PagesList({ ops, registry }) {
             return creatable[0].name;
         return window.prompt(`Template? (${creatable.map((p) => p.name).join(", ")})`) || null;
     };
+    /** New page and New folder create in the SELECTED locale (spec §6). */
     const newNode = (parentId, kind) => {
         if (kind === "page" && noOpen)
             return;
@@ -62,7 +91,7 @@ export function PagesList({ ops, registry }) {
         const template = kind === "page" ? pickTemplate() : null;
         if (kind === "page" && !template)
             return;
-        void run(() => ops.pages.create({ parentId, slug, template }), (page) => { if (template)
+        void run(() => ops.pages.create({ parentId, locale, slug, template }), (page) => { if (template)
             openEditor(page.id); });
     };
     const addPageHere = (row) => {
@@ -71,8 +100,23 @@ export function PagesList({ ops, registry }) {
             return;
         void run(() => ops.pages.setTemplate(row.id, template), (page) => openEditor(page.id));
     };
+    const addLocale = (row) => {
+        const from = sourceLocaleOf(row.record, registry);
+        if (!window.confirm(`Add "${row.title}" to ${locale}? Its ${from} content is copied as the first ${locale} draft.`))
+            return;
+        void run(() => ops.pages.addLocale(row.id, locale, { from }), (page) => { if (page.template !== null)
+            openEditor(page.id); });
+    };
+    const removeLocale = (row) => {
+        if (!window.confirm(`Remove "${row.title}" from ${locale}? Its ${locale} content and history are deleted.`))
+            return;
+        void run(() => ops.pages.removeLocale(row.id, locale));
+    };
     const rename = (row) => {
-        const title = window.prompt("Title:", row.record.title);
+        const current = row.record.locales[locale];
+        if (!current)
+            return;
+        const title = window.prompt("Title:", current.title);
         if (title === null)
             return;
         // The site root's slug is the config's homePageSlug — title only here.
@@ -80,19 +124,24 @@ export function PagesList({ ops, registry }) {
             void run(() => ops.pages.rename(row.id, { locale, title }));
             return;
         }
-        const slug = window.prompt("Slug (the URL segment):", row.record.slug);
+        const slug = window.prompt("Slug (the URL segment):", current.slug);
         if (slug === null)
             return;
         void run(() => ops.pages.rename(row.id, { locale, title, slug }));
     };
     const move = (row, dir) => void run(() => ops.pages.move(row.id, { parentId: row.parentId, index: row.index + dir }));
     const destroy = (row) => {
-        if (!window.confirm(`Delete "${row.title}"?`))
+        const scope = row.locales.length > 1 ? ` in every language (${row.locales.join(", ")})` : "";
+        if (!window.confirm(`Delete "${row.title}"${scope}?`))
             return;
         void run(() => ops.pages.delete(row.id));
     };
     const menuItems = (row) => {
         const items = [];
+        if (!row.present) {
+            items.push({ label: `Add ${locale}`, run: () => addLocale(row) });
+            return items;
+        }
         if (row.kind === "mount" && row.template !== null)
             items.push({ label: "Edit index page", run: () => openEditor(row.id) });
         if (row.canHaveChildren && !noOpen)
@@ -107,12 +156,17 @@ export function PagesList({ ops, registry }) {
             items.push({ label: "Move up", run: () => move(row, -1) });
         if (!row.fixed && !row.isHome && row.index < row.siblingCount - 1)
             items.push({ label: "Move down", run: () => move(row, 1) });
+        if (multilingual && !row.fixed && !row.isHome && row.locales.length > 1) {
+            items.push({ label: `Remove from ${locale}`, run: () => removeLocale(row) });
+        }
         if (!row.fixed && !row.isHome && !row.hasChildren)
             items.push({ label: "Delete", run: () => destroy(row) });
         return items;
     };
     const onRow = (row) => {
-        if (row.kind === "mount" && row.collection)
+        if (!row.present)
+            addLocale(row);
+        else if (row.kind === "mount" && row.collection)
             window.location.href = `${BASE}/${row.collection}`;
         else if (row.template !== null)
             openEditor(row.id);
@@ -122,25 +176,31 @@ export function PagesList({ ops, registry }) {
     if (error)
         return _jsx(ErrorPane, { message: error });
     const items = menu ? menuItems(menu.row) : [];
-    return (_jsxs(_Fragment, { children: [_jsx(ListView, { title: "Pages", count: pages?.length, actions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "secondary", onClick: () => newNode(null, "folder"), children: "+ New folder" }), _jsx(Button, { onClick: () => newNode(null, "page"), disabled: noOpen, title: noOpen ? "Every page registration is fixed — add an open one (a page schema with no `slug`) to create pages here." : undefined, children: "+ New page" })] }), columns: [
+    return (_jsxs(_Fragment, { children: [_jsx(ListView, { title: "Pages", count: pages?.length, actions: _jsxs(_Fragment, { children: [multilingual && _jsx(Segmented, { options: registry.locales.supported, value: locale, onChange: pickLocale }), _jsx(Button, { variant: "secondary", onClick: () => newNode(null, "folder"), children: "+ New folder" }), _jsx(Button, { onClick: () => newNode(null, "page"), disabled: noOpen, title: noOpen ? "Every page registration is fixed — add an open one (a page schema with no `slug`) to create pages here." : undefined, children: "+ New page" })] }), columns: [
                     { label: "Title", width: "minmax(160px,1fr)" },
                     { label: "Path", width: "minmax(140px,260px)" },
                     { label: "Template", width: "minmax(100px,160px)" },
                     { label: "Status", width: "110px" },
                     { label: "", width: "32px" },
-                ], empty: pages ? "No pages yet." : "Loading…", rows: rows.map((row) => ({
-                    key: row.id,
-                    onClick: () => onRow(row),
-                    cells: [
-                        _jsxs("span", { className: row.hasChildren ? "sm-cell sm-cell--tree sm-cell--parent" : "sm-cell sm-cell--tree", style: { paddingLeft: row.depth * 20 }, children: [_jsx("button", { type: "button", className: "sm-chevron", "aria-label": row.expanded ? "Collapse" : "Expand", "aria-expanded": row.hasChildren ? row.expanded : undefined, style: { visibility: row.hasChildren ? "visible" : "hidden" }, onClick: (e) => { e.stopPropagation(); toggle(row.id); }, onKeyDown: (e) => e.stopPropagation(), children: row.expanded ? "▾" : "▸" }), _jsx("span", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: row.title })] }, "t"),
-                        _jsx("span", { className: "sm-cell sm-cell--mono", children: row.path }, "p"),
-                        _jsx("span", { className: "sm-cell sm-cell--muted", children: row.templateTitle }, "k"),
-                        row.status
-                            ? _jsx(StatusBadge, { status: row.status }, "s")
-                            : _jsx("span", { className: "sm-cell sm-cell--muted", children: "\u2014" }, "s"),
-                        _jsx("button", { type: "button", className: "sm-rowmenu", "aria-label": "Row menu", onClick: (e) => { e.stopPropagation(); setMenu({ row, x: e.clientX, y: e.clientY }); }, onKeyDown: (e) => e.stopPropagation(), children: "\u00B7\u00B7\u00B7" }, "m"),
-                    ],
-                })) }), menu && (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 60 }, onClick: () => setMenu(null), children: _jsxs("div", { className: "sm-picker", onClick: (e) => e.stopPropagation(), style: {
+                ], empty: pages ? "No pages yet." : "Loading…", rows: rows.map((row) => {
+                    // An absent node is still a row (structure is shared) but reads as dimmed.
+                    const dim = row.present ? undefined : { opacity: 0.45 };
+                    return {
+                        key: row.id,
+                        onClick: () => onRow(row),
+                        cells: [
+                            _jsxs("span", { className: row.hasChildren ? "sm-cell sm-cell--tree sm-cell--parent" : "sm-cell sm-cell--tree", style: { paddingLeft: row.depth * 20, ...dim }, children: [_jsx("button", { type: "button", className: "sm-chevron", "aria-label": row.expanded ? "Collapse" : "Expand", "aria-expanded": row.hasChildren ? row.expanded : undefined, style: { visibility: row.hasChildren ? "visible" : "hidden" }, onClick: (e) => { e.stopPropagation(); toggle(row.id); }, onKeyDown: (e) => e.stopPropagation(), children: row.expanded ? "▾" : "▸" }), _jsx("span", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: row.title })] }, "t"),
+                            row.present
+                                ? _jsx("span", { className: "sm-cell sm-cell--mono", children: row.path }, "p")
+                                : _jsxs("span", { className: "sm-cell sm-cell--muted", children: ["not in ", locale, " \u2014 click to add"] }, "p"),
+                            _jsx("span", { className: "sm-cell sm-cell--muted", style: dim, children: row.templateTitle }, "k"),
+                            row.status
+                                ? _jsx(StatusBadge, { status: row.status }, "s")
+                                : _jsx("span", { className: "sm-cell sm-cell--muted", children: "\u2014" }, "s"),
+                            _jsx("button", { type: "button", className: "sm-rowmenu", "aria-label": "Row menu", onClick: (e) => { e.stopPropagation(); setMenu({ row, x: e.clientX, y: e.clientY }); }, onKeyDown: (e) => e.stopPropagation(), children: "\u00B7\u00B7\u00B7" }, "m"),
+                        ],
+                    };
+                }) }), menu && (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 60 }, onClick: () => setMenu(null), children: _jsxs("div", { className: "sm-picker", onClick: (e) => e.stopPropagation(), style: {
                         position: "absolute",
                         left: Math.max(12, Math.min(menu.x - 280, window.innerWidth - 312)),
                         top: Math.min(menu.y + 8, Math.max(12, window.innerHeight - 300)),

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 {};