smoodly 0.0.8 → 0.0.10

package/dist/admin/editor/useCanvasBridge.d.ts

@@ -0,0 +1,15 @@
+import { type RefObject } from "react";
+import type { BridgeRect, ToBridge, ZoneRect } from "./protocol.ts";
+export type Geometry = "waiting" | "ok" | "missing";
+export declare function useCanvasBridge({ iframeRef, iframeSrc, onSelect, onHover }: {
+    iframeRef: RefObject<HTMLIFrameElement | null>;
+    iframeSrc: string | null;
+    onSelect(id: string | null): void;
+    onHover(id: string | null): void;
+}): {
+    rects: BridgeRect[];
+    emptyZones: ZoneRect[];
+    docH: number;
+    geometry: Geometry;
+    postToCanvas: (m: ToBridge) => void;
+};

package/dist/admin/editor/useCanvasBridge.js

@@ -0,0 +1,53 @@
+// The admin side of the editor⇄canvas protocol: the geometry the bridge
+// reports (node rects, empty zones, document height), select/hover
+// forwarded from the iframe, and `postToCanvas` for refresh/scroll.
+// Geometry silence is survivable — after GEOMETRY_TIMEOUT_MS the overlay
+// goes dark, the iframe and the outline keep working.
+import { useCallback, useEffect, useRef, useState } from "react";
+const GEOMETRY_TIMEOUT_MS = 4000;
+export function useCanvasBridge({ iframeRef, iframeSrc, onSelect, onHover }) {
+    const [rects, setRects] = useState([]);
+    const [emptyZones, setEmptyZones] = useState([]);
+    const [docH, setDocH] = useState(900);
+    const [geometry, setGeometry] = useState("waiting");
+    // The listener registers once; the handlers are read through refs.
+    const handlers = useRef({ onSelect, onHover });
+    handlers.current = { onSelect, onHover };
+    // A new canvas URL (a locale switch, a rename) means new geometry — the
+    // previous page's rects are stale the instant the iframe starts loading
+    // a different route, so clear them alongside resetting geometry.
+    useEffect(() => { setGeometry("waiting"); setRects([]); setEmptyZones([]); }, [iframeSrc]);
+    const postToCanvas = useCallback((m) => {
+        iframeRef.current?.contentWindow?.postMessage(m, "*");
+    }, [iframeRef]);
+    useEffect(() => {
+        const onMessage = (e) => {
+            const m = e.data;
+            if (m?.source !== "smoodly")
+                return;
+            if (e.source !== iframeRef.current?.contentWindow)
+                return;
+            if (m.kind === "rects") {
+                setRects(m.nodes);
+                setEmptyZones(m.emptyZones);
+                setDocH(m.docH);
+                setGeometry("ok");
+            }
+            else if (m.kind === "select") {
+                handlers.current.onSelect(m.id);
+            }
+            else if (m.kind === "hover") {
+                handlers.current.onHover(m.id);
+            }
+        };
+        window.addEventListener("message", onMessage);
+        return () => window.removeEventListener("message", onMessage);
+    }, [iframeRef]);
+    useEffect(() => {
+        if (!iframeSrc || geometry !== "waiting")
+            return;
+        const t = setTimeout(() => setGeometry((g) => (g === "waiting" ? "missing" : g)), GEOMETRY_TIMEOUT_MS);
+        return () => clearTimeout(t);
+    }, [iframeSrc, geometry]);
+    return { rects, emptyZones, docH, geometry, postToCanvas };
+}

package/dist/admin/editor/usePageLocale.d.ts

@@ -0,0 +1,23 @@
+import type { PageRecord } from "../../store.ts";
+import type { AdminOps } from "../ops.ts";
+import type { AdminRegistry } from "../serialize.ts";
+export declare function usePageLocale({ registry, ops, id, record, setRecord, flush, fail, clearBanner, reload }: {
+    registry: AdminRegistry;
+    ops: AdminOps;
+    id: string;
+    record: PageRecord | null;
+    setRecord(record: PageRecord): void;
+    /** Flush the pending autosave; false when it could not land. */
+    flush(): Promise<boolean>;
+    /** Show an error banner. */
+    fail(text: string): void;
+    clearBanner(): void;
+    /** Reload the editor for the current locale. */
+    reload(): void;
+}): {
+    locale: string;
+    adding: boolean;
+    switchLocale: (next: string) => Promise<void>;
+    doAddLocale: (target: string) => Promise<void>;
+    doRemoveLocale: () => Promise<void>;
+};

package/dist/admin/editor/usePageLocale.js

@@ -0,0 +1,88 @@
+// The editor's locale lifecycle: which locale is being edited (from the
+// URL), switching, adding this page to a locale, removing it from one.
+// Every transition flushes the pending autosave first — a save landing
+// after the switch would persist THIS tree under the new locale.
+import { useState } from "react";
+import { sourceLocaleOf } from "../shell/pages-tree.js";
+import { localeFromUrl, writeLocaleToUrl } from "./locale-url.js";
+export function usePageLocale({ registry, ops, id, record, setRecord, flush, fail, clearBanner, reload }) {
+    const [locale, setLocale] = useState(() => localeFromUrl(registry));
+    const [adding, setAdding] = useState(false);
+    const switchLocale = async (next) => {
+        if (next === locale)
+            return;
+        const flushed = await flush();
+        if (!flushed) {
+            fail("Couldn't save your latest changes — switch cancelled.");
+            return;
+        }
+        writeLocaleToUrl(next);
+        clearBanner();
+        setLocale(next);
+    };
+    /** Add a locale, copying the tree on screen (or the record's source locale when this one is absent). */
+    const doAddLocale = async (target) => {
+        if (!record || adding)
+            return;
+        const from = record.locales[locale] ? locale : sourceLocaleOf(record, registry);
+        if (from === locale) {
+            const flushed = await flush();
+            if (!flushed) {
+                fail("Couldn't save your latest changes — add cancelled.");
+                return;
+            }
+        }
+        setAdding(true);
+        let result;
+        try {
+            result = await ops.pages.addLocale(id, target, { from });
+        }
+        catch {
+            result = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        setAdding(false);
+        if (!result.ok) {
+            fail(result.message);
+            return;
+        }
+        // The record now HAS the locale; keep it, or the pane below would go
+        // on offering "doesn't exist yet" until the reload lands.
+        setRecord(result.data);
+        if (target === locale)
+            reload();
+        else
+            void switchLocale(target);
+    };
+    const doRemoveLocale = async () => {
+        if (!record)
+            return;
+        const remaining = Object.keys(record.locales).filter((l) => l !== locale);
+        if (remaining.length === 0)
+            return;
+        if (!window.confirm(`Remove this page from ${locale}? Its ${locale} content and history are deleted.`))
+            return;
+        // Let a pending save land before the row goes, so no save races the
+        // delete — and if it cannot land, stop: a retry mid-flight would
+        // recreate the very draft the removal is deleting.
+        const flushed = await flush();
+        if (!flushed) {
+            fail("Couldn't save your latest changes — removal cancelled.");
+            return;
+        }
+        let result;
+        try {
+            result = await ops.pages.removeLocale(id, locale);
+        }
+        catch {
+            result = { ok: false, code: "internal", message: "Couldn't reach the server." };
+        }
+        if (!result.ok) {
+            fail(result.message);
+            return;
+        }
+        const next = remaining.includes(registry.locales.default) ? registry.locales.default : remaining[0];
+        writeLocaleToUrl(next);
+        setLocale(next);
+    };
+    return { locale, adding, switchLocale, doAddLocale, doRemoveLocale };
+}

package/dist/admin/forms/FieldWidget.d.ts

@@ -1,10 +1,14 @@
-import type { ReactElement } from "react";
+import { type ReactElement } from "react";
 import type { AdminField } from "../serialize.ts";
-export declare function FieldWidget({ descriptor: d, value, onChange, error, refOptions, fieldKey, prefix, }: {
+export declare function FieldWidget({ descriptor: d, value, onChange, errors, path: pathProp, bare, refOptions, fieldKey, prefix, }: {
     descriptor: AdminField;
     value: unknown;
     onChange(value: unknown): void;
-    error?: string;
+    errors?: Record<string, string>;
+    /** Dotted path of this widget in the form; defaults to `fieldKey`. */
+    path?: string;
+    /** Render the control alone, no label wrapper — list items. */
+    bare?: boolean;
     refOptions?: {
         id: string;
         title: string;

package/dist/admin/forms/FieldWidget.js

@@ -1,11 +1,26 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { plainToRichtext, richtextToPlain } from "../richtext.js";
-import { Field, IconButton } from "../ui/primitives.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// One schema descriptor → one labelled control, in the design system's
+// field language: uppercase 9px label, inset control with no border at
+// rest, 1.5px accent border + soft ring on focus (all in ui/theme.tsx).
+// Objects and lists recurse through this same component; the list's
+// logic lives in ./list.ts as pure functions.
+import { useState } from "react";
+import { RichtextWidget } from "./RichtextWidget.js";
+import { Button, Field, IconButton } from "../ui/primitives.js";
+import { addItem, itemSummary, moveIndex, moveItem, patchObject, removeIndex, removeItem } from "./list.js";
 const label = (key) => key.replace(/([A-Z])/g, " $1").replace(/^./, (c) => c.toUpperCase());
-export function FieldWidget({ descriptor: d, value, onChange, error, refOptions = [], fieldKey, prefix, }) {
+export function FieldWidget({ descriptor: d, value, onChange, errors, path: pathProp, bare, refOptions = [], fieldKey, prefix, }) {
+    const path = pathProp ?? fieldKey;
+    const message = errors?.[path];
+    // Unused for non-list types, but hooks must be unconditional — a list's
+    // rows key their collapse state to this rather than to array position,
+    // so a move or remove doesn't reassign which row looks open.
+    const [collapsed, setCollapsed] = useState(() => new Set());
     const optionTitle = (o) => o.status === "draft" ? `${o.title} (draft)` : o.title;
     let control;
+    let counter;
+    let asDiv = d.type === "refList";
     switch (d.type) {
         case "text":
         case "link":
@@ -26,7 +41,9 @@ export function FieldWidget({ descriptor: d, value, onChange, error, refOptions
             break;
         }
         case "richtext":
-            control = (_jsx("textarea", { className: "sm-textarea", rows: 5, value: richtextToPlain(value), onChange: (e) => onChange(plainToRichtext(e.target.value)) }));
+            // The toolbar holds buttons, so this control can never sit in a <label>.
+            asDiv = true;
+            control = _jsx(RichtextWidget, { value: value, toolset: d.toolset, onChange: onChange });
             break;
         case "image":
         case "video":
@@ -44,11 +61,54 @@ export function FieldWidget({ descriptor: d, value, onChange, error, refOptions
             control = (_jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 6 }, children: [ids.map((id, i) => (_jsxs("div", { style: { display: "flex", gap: 6, alignItems: "center" }, children: [_jsx("span", { className: "sm-input", style: { display: "flex", alignItems: "center", flex: 1 }, children: byId.get(id) ? optionTitle(byId.get(id)) : id }), _jsx(IconButton, { label: "Remove", size: 28, onClick: () => onChange(ids.filter((_, j) => j !== i)), children: "\u00D7" })] }, `${id}-${i}`))), _jsxs("select", { className: "sm-select", value: "", onChange: (e) => e.target.value && onChange([...ids, e.target.value]), children: [_jsx("option", { value: "", children: "Add\u2026" }), refOptions.filter((o) => !ids.includes(o.id)).map((o) => (_jsx("option", { value: o.id, children: optionTitle(o) }, o.id)))] })] }));
             break;
         }
+        case "object": {
+            asDiv = true;
+            const obj = (value && typeof value === "object" && !Array.isArray(value) ? value : {});
+            control = (_jsx("div", { className: "sm-group", children: Object.entries(d.fields ?? {}).map(([k, sub]) => (_jsx(FieldWidget, { fieldKey: k, descriptor: sub, value: obj[k], errors: errors, path: `${path}.${k}`, onChange: (v) => onChange(patchObject(obj, k, v, d.optional === true)) }, k))) }));
+            break;
+        }
+        case "list": {
+            asDiv = true;
+            const items = Array.isArray(value) ? value : [];
+            const item = d.item ?? { type: "text" };
+            const atMax = typeof d.max === "number" && items.length >= d.max;
+            if (typeof d.max === "number")
+                counter = `${items.length} of ${d.max}`;
+            control = (_jsxs("div", { className: "sm-list", children: [items.map((it, i) => (_jsx(ListRow, { index: i, count: items.length, summary: itemSummary(it, i), open: !collapsed.has(i), onToggle: () => setCollapsed((prev) => {
+                            const next = new Set(prev);
+                            if (next.has(i))
+                                next.delete(i);
+                            else
+                                next.add(i);
+                            return next;
+                        }), onMove: (to) => {
+                            const moved = moveItem(items, i, to);
+                            if (moved !== items) {
+                                onChange(moved);
+                                setCollapsed((prev) => moveIndex(prev, i, to));
+                            }
+                        }, onRemove: () => {
+                            onChange(removeItem(items, i));
+                            setCollapsed((prev) => removeIndex(prev, i));
+                        }, children: _jsx(FieldWidget, { fieldKey: String(i), descriptor: item, value: it, errors: errors, path: `${path}.${i}`, bare: true, onChange: (v) => onChange(items.map((x, j) => (j === i ? v : x))) }) }, i))), _jsx(Button, { variant: "secondary", disabled: atMax, onClick: () => onChange(addItem(items, d)), children: "Add" })] }));
+            break;
+        }
         default:
             control = _jsx("textarea", { className: "sm-textarea", disabled: true, value: JSON.stringify(value ?? null, null, 2), rows: 2 });
     }
+    if (bare) {
+        return (_jsxs(_Fragment, { children: [control, message && _jsx("span", { className: "sm-error", children: message })] }));
+    }
     // A <label> activates its first labelable descendant, so it may only wrap a
-    // single control — around refList's rows it would turn every click into a
-    // press of the first row's remove button.
-    return (_jsx(Field, { label: label(fieldKey), error: error, asDiv: d.type === "refList", children: control }));
+    // single control — around refList's rows, an object's fieldset or a list's
+    // rows it would turn every click into a press of the first button.
+    return (_jsx(Field, { label: label(fieldKey), counter: counter, error: message, asDiv: asDiv, children: control }));
+}
+/** One list item: a header with the summary and the row controls, the
+ *  item's widget underneath while expanded. Header is a div, not a label.
+ *  Collapse state lives in the parent `FieldWidget`, keyed to the item's
+ *  index rather than to `key={i}` position, so a move or remove doesn't
+ *  hand this row someone else's open/closed state. */
+function ListRow({ index, count, summary, open, onToggle, onMove, onRemove, children }) {
+    return (_jsxs("div", { className: "sm-listrow", children: [_jsxs("div", { className: "sm-listrow__head", children: [_jsxs("button", { type: "button", className: "sm-listrow__toggle", "aria-expanded": open, onClick: onToggle, children: [_jsx("span", { "aria-hidden": "true", children: open ? "▾" : "▸" }), _jsx("span", { className: "sm-listrow__summary", children: summary })] }), _jsx(IconButton, { label: "Move up", disabled: index === 0, onClick: () => onMove(index - 1), children: "\u2191" }), _jsx(IconButton, { label: "Move down", disabled: index === count - 1, onClick: () => onMove(index + 1), children: "\u2193" }), _jsx(IconButton, { label: "Remove", onClick: onRemove, children: "\u00D7" })] }), open && _jsx("div", { className: "sm-listrow__body", children: children })] }));
 }

package/dist/admin/forms/RichtextToolbar.d.ts

@@ -0,0 +1,20 @@
+import type { Allowed } from "../../toolset.ts";
+export type ToolbarCommand = "bold" | "italic" | "link" | "bulletList" | "orderedList" | "blockquote" | {
+    heading: number;
+};
+export type ActiveState = {
+    bold: boolean;
+    italic: boolean;
+    link: boolean;
+    bulletList: boolean;
+    orderedList: boolean;
+    blockquote: boolean;
+    /** The active heading level, or null in a paragraph. */
+    heading: number | null;
+};
+export declare const INACTIVE: ActiveState;
+export declare function RichtextToolbar({ allowed, active, onCommand }: {
+    allowed: Allowed;
+    active: ActiveState;
+    onCommand(command: ToolbarCommand): void;
+}): import("react").JSX.Element | null;

package/dist/admin/forms/RichtextToolbar.js

@@ -0,0 +1,37 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bold, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Italic, Link, List, ListOrdered, Quote } from "lucide-react";
+import { IconButton } from "../ui/primitives.js";
+export const INACTIVE = {
+    bold: false, italic: false, link: false, bulletList: false, orderedList: false, blockquote: false, heading: null,
+};
+const HEADING_ICONS = { 1: Heading1, 2: Heading2, 3: Heading3, 4: Heading4, 5: Heading5, 6: Heading6 };
+const ICON = 14;
+/** Keep the editor's selection: a toolbar press must not blur the content. */
+const keepFocus = (e) => e.preventDefault();
+export function RichtextToolbar({ allowed, active, onCommand }) {
+    const button = (label, pressed, command, Icon) => (_jsx(IconButton, { label: label, "aria-pressed": pressed, onMouseDown: keepFocus, onClick: () => onCommand(command), children: _jsx(Icon, { size: ICON, "aria-hidden": "true" }) }, label));
+    const groups = [];
+    const marks = [
+        allowed.marks.has("bold") && button("Bold", active.bold, "bold", Bold),
+        allowed.marks.has("italic") && button("Italic", active.italic, "italic", Italic),
+        allowed.marks.has("link") && button("Link", active.link, "link", Link),
+    ].filter(Boolean);
+    if (marks.length > 0)
+        groups.push(marks);
+    const headings = allowed.headingLevels
+        .filter((l) => l >= 1 && l <= 6)
+        .map((l) => button(`Heading ${l}`, active.heading === l, { heading: l }, HEADING_ICONS[l]));
+    if (headings.length > 0)
+        groups.push(headings);
+    const blocks = [
+        allowed.nodes.has("bulletList") && button("Bullet list", active.bulletList, "bulletList", List),
+        allowed.nodes.has("orderedList") && button("Numbered list", active.orderedList, "orderedList", ListOrdered),
+        allowed.nodes.has("blockquote") && button("Quote", active.blockquote, "blockquote", Quote),
+    ].filter(Boolean);
+    if (blocks.length > 0)
+        groups.push(blocks);
+    if (groups.length === 0)
+        return null;
+    return (_jsx("div", { className: "sm-richtext__bar", role: "toolbar", "aria-label": "Formatting", children: groups.map((group, i) => (_jsxs("span", { style: { display: "contents" }, children: [i > 0 && _jsx("span", { className: "sm-richtext__sep", "aria-hidden": "true" }), group] }, i))) }));
+}

package/dist/admin/forms/RichtextWidget.d.ts

@@ -0,0 +1,5 @@
+export declare function RichtextWidget({ value, toolset, onChange }: {
+    value: unknown;
+    toolset: unknown;
+    onChange(doc: unknown): void;
+}): import("react").JSX.Element;

package/dist/admin/forms/RichtextWidget.js

@@ -0,0 +1,123 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// The richtext field widget (spec 2026-09-08 §3): a TipTap editor under a
+// fixed toolbar. The editor owns its document and emits TipTap JSON on
+// every change; the parent stores the emitted document by reference, so
+// a value that is not the last emitted document is a change from outside
+// (load, locale switch, a list row moving) and re-seeds the editor. The
+// schema is always full; `allowed` gates creation (extensions, paste,
+// toolbar). Only this file and richtext-extensions.ts import TipTap.
+import { useEffect, useMemo, useRef, useState } from "react";
+import { EditorContent, useEditor, useEditorState } from "@tiptap/react";
+import { Slice } from "@tiptap/pm/model";
+import { allowedOf } from "../../toolset.js";
+import { plainDoc } from "../richtext-doc.js";
+import { Button } from "../ui/primitives.js";
+import { richtextExtensions } from "./richtext-extensions.js";
+import { gatePastedSlice } from "./richtext-paste.js";
+import { INACTIVE, RichtextToolbar } from "./RichtextToolbar.js";
+const EMPTY = { type: "doc", content: [{ type: "paragraph" }] };
+const LEVELS = [1, 2, 3, 4, 5, 6];
+const isDoc = (v) => !!v && typeof v === "object" && v.type === "doc";
+export function RichtextWidget({ value, toolset, onChange }) {
+    const allowed = useMemo(() => allowedOf(toolset), [toolset]);
+    // The parent's onChange closes over its render; the editor's onUpdate is
+    // created once, so read the latest through a ref.
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    // The last document this widget emitted — anything else arriving as
+    // `value` came from outside and re-seeds the editor.
+    const emitted = useRef(value);
+    const [link, setLink] = useState({ open: false, href: "" });
+    const openLinkRef = useRef(() => { });
+    const editor = useEditor({
+        immediatelyRender: false,
+        extensions: richtextExtensions(allowed, { onLink: () => openLinkRef.current() }),
+        content: isDoc(value) ? value : EMPTY,
+        editorProps: {
+            attributes: { class: "sm-richtext__content" },
+            transformPasted: (slice, view) => Slice.fromJSON(view.state.schema, gatePastedSlice(slice.toJSON(), allowed)),
+        },
+        onUpdate: ({ editor }) => {
+            const doc = plainDoc(editor.getJSON());
+            emitted.current = doc;
+            onChangeRef.current(doc);
+        },
+    }, [allowed]);
+    useEffect(() => {
+        if (!editor || value === emitted.current)
+            return;
+        emitted.current = value;
+        editor.commands.setContent(isDoc(value) ? value : EMPTY, { emitUpdate: false });
+    }, [editor, value]);
+    const active = useEditorState({
+        editor,
+        selector: ({ editor }) => editor
+            ? {
+                bold: editor.isActive("bold"),
+                italic: editor.isActive("italic"),
+                link: editor.isActive("link"),
+                bulletList: editor.isActive("bulletList"),
+                orderedList: editor.isActive("orderedList"),
+                blockquote: editor.isActive("blockquote"),
+                heading: LEVELS.find((level) => editor.isActive("heading", { level })) ?? null,
+            }
+            : INACTIVE,
+    });
+    // Read the caret's link from the editor at open time, not from the last
+    // render: a selection change and the press can land in the same tick.
+    const openLink = () => setLink({ open: true, href: editor?.getAttributes("link").href ?? "" });
+    openLinkRef.current = openLink;
+    const closeLink = () => {
+        setLink({ open: false, href: "" });
+        editor?.commands.focus();
+    };
+    const applyLink = () => {
+        if (!editor)
+            return;
+        const href = link.href.trim();
+        const chain = editor.chain().focus().extendMarkRange("link");
+        if (href === "")
+            chain.unsetLink().run();
+        else
+            chain.setLink({ href }).run();
+        setLink({ open: false, href: "" });
+    };
+    const removeLink = () => {
+        editor?.chain().focus().extendMarkRange("link").unsetLink().run();
+        setLink({ open: false, href: "" });
+    };
+    const run = (command) => {
+        if (!editor)
+            return;
+        if (command === "link") {
+            openLink();
+            return;
+        }
+        const chain = editor.chain().focus();
+        if (typeof command === "object")
+            chain.toggleHeading({ level: command.heading }).run();
+        else if (command === "bold")
+            chain.toggleBold().run();
+        else if (command === "italic")
+            chain.toggleItalic().run();
+        else if (command === "bulletList")
+            chain.toggleBulletList().run();
+        else if (command === "orderedList")
+            chain.toggleOrderedList().run();
+        else if (command === "blockquote")
+            chain.toggleBlockquote().run();
+    };
+    return (_jsxs("div", { className: "sm-richtext", children: [_jsx(RichtextToolbar, { allowed: allowed, active: active ?? INACTIVE, onCommand: run }), link.open && (_jsxs("div", { className: "sm-richtext__link", children: [_jsx("input", { className: "sm-input", placeholder: "https://\u2026 or /path", value: link.href, autoFocus: true, "aria-label": "Link URL", onChange: (e) => setLink({ open: true, href: e.target.value }), onKeyDown: (e) => {
+                            // Escape must not reach the editor's window handler, which clears the block selection.
+                            if (e.key === "Enter") {
+                                e.preventDefault();
+                                applyLink();
+                            }
+                            if (e.key === "Escape") {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                closeLink();
+                            }
+                        } }), _jsx(Button, { onClick: applyLink, children: "Apply" }), _jsx(Button, { variant: "secondary", onClick: removeLink, children: "Remove" })] })), _jsx(EditorContent, { editor: editor })] }));
+}

package/dist/admin/forms/list.d.ts

@@ -0,0 +1,18 @@
+import type { AdminField } from "../serialize.ts";
+/** An empty item: an object of its subfields' defaults, else the default. */
+export declare function emptyValue(d: AdminField): unknown;
+export declare function addItem(items: unknown[], list: AdminField): unknown[];
+export declare function removeItem(items: unknown[], index: number): unknown[];
+export declare function moveItem(items: unknown[], from: number, to: number): unknown[];
+/** Permutes a set of item indices (e.g. collapse state) for the same move
+ *  `moveItem` just applied: the index at `from` becomes `to`; indices strictly
+ *  between the two shift by one toward `from`; every other index is unchanged. */
+export declare function moveIndex(set: Set<number>, from: number, to: number): Set<number>;
+/** Permutes a set of item indices for a removal at `index`: drops it, and
+ *  shifts every higher index down by one. */
+export declare function removeIndex(set: Set<number>, index: number): Set<number>;
+/** The row header's text: the value, or its first non-empty string, or "Item N". */
+export declare function itemSummary(value: unknown, index: number): string;
+/** A subfield change on an object value. `collapseEmpty` (an optional
+ *  object) turns an object with no defined values into `undefined`. */
+export declare function patchObject(obj: Record<string, unknown>, key: string, value: unknown, collapseEmpty: boolean): Record<string, unknown> | undefined;

package/dist/admin/forms/list.js

@@ -0,0 +1,81 @@
+/** An empty item: an object of its subfields' defaults, else the default. */
+export function emptyValue(d) {
+    if (d.type === "object") {
+        const out = {};
+        for (const [k, sub] of Object.entries(d.fields ?? {})) {
+            const v = emptyValue(sub);
+            if (v !== undefined)
+                out[k] = v;
+        }
+        return out;
+    }
+    return d.default;
+}
+export function addItem(items, list) {
+    if (typeof list.max === "number" && items.length >= list.max)
+        return items;
+    return [...items, list.item ? emptyValue(list.item) : undefined];
+}
+export function removeItem(items, index) {
+    return items.filter((_, i) => i !== index);
+}
+export function moveItem(items, from, to) {
+    if (to < 0 || to >= items.length || from === to)
+        return items;
+    const next = [...items];
+    const [moved] = next.splice(from, 1);
+    next.splice(to, 0, moved);
+    return next;
+}
+/** Permutes a set of item indices (e.g. collapse state) for the same move
+ *  `moveItem` just applied: the index at `from` becomes `to`; indices strictly
+ *  between the two shift by one toward `from`; every other index is unchanged. */
+export function moveIndex(set, from, to) {
+    const next = new Set();
+    for (const i of set) {
+        if (i === from)
+            next.add(to);
+        else if (from < to && i > from && i <= to)
+            next.add(i - 1);
+        else if (to < from && i >= to && i < from)
+            next.add(i + 1);
+        else
+            next.add(i);
+    }
+    return next;
+}
+/** Permutes a set of item indices for a removal at `index`: drops it, and
+ *  shifts every higher index down by one. */
+export function removeIndex(set, index) {
+    const next = new Set();
+    for (const i of set) {
+        if (i === index)
+            continue;
+        next.add(i > index ? i - 1 : i);
+    }
+    return next;
+}
+const nonEmpty = (v) => typeof v === "string" && v.trim() !== "";
+/** The row header's text: the value, or its first non-empty string, or "Item N". */
+export function itemSummary(value, index) {
+    if (nonEmpty(value))
+        return value;
+    if (value && typeof value === "object" && !Array.isArray(value)) {
+        const hit = Object.values(value).find(nonEmpty);
+        if (hit)
+            return hit;
+    }
+    return `Item ${index + 1}`;
+}
+/** A subfield change on an object value. `collapseEmpty` (an optional
+ *  object) turns an object with no defined values into `undefined`. */
+export function patchObject(obj, key, value, collapseEmpty) {
+    const next = { ...obj };
+    if (value === undefined)
+        delete next[key];
+    else
+        next[key] = value;
+    if (collapseEmpty && Object.values(next).every((v) => v === undefined))
+        return undefined;
+    return next;
+}

package/dist/admin/forms/richtext-extensions.d.ts

@@ -0,0 +1,5 @@
+import { type AnyExtension } from "@tiptap/core";
+import type { Allowed } from "../../toolset.ts";
+export declare function richtextExtensions(allowed: Allowed, hooks: {
+    onLink(): void;
+}): AnyExtension[];