@bettercms-ai/kit 0.1.1 → 2.0.0

package/dist/controls/slot.js

@@ -0,0 +1,366 @@
+import { readSlot, slotList } from "./slot-services.js";
+import { cn } from "../lib/cn.js";
+import { useKitServices } from "../context.js";
+import { KitIcon } from "../lib/icons.js";
+import { Button } from "../ui/button.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../ui/overlay.js";
+import { RowList, useListOps } from "../engine/array.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconPlus, IconSearch } from "@tabler/icons-react";
+//#region src/controls/slot.tsx
+/**
+* COMPONENT SLOT — a prop that holds component instances (prod `slot`), on the engine's slot surface (engine/slot.tsx,
+* V2 HEAD 9829bf1): the block rows (icon tile, name, ⋯ menu, drag to reorder) and the compact searchable picker.
+*
+* What differs from V2's block slot is where the rows come from and what they store:
+*   - the picker lists the host's slot catalog (`useSlotCatalog`): the project's components with the SERVER's
+*     insertability verdict for each; one that can't go here stays in the list, disabled, with the reason under its name;
+*   - a row opens in place and edits that child's own props through the host's `SlotChild`;
+*   - the value is written in the stored shape (slot-services.ts): one `{ componentId, overrides? }`, or a list of them
+*     for a multiple slot, every item spread back with the keys this control does not show (style, window).
+*
+* Refusals are said in words, never by an inert control: no catalog service, an unreadable stored value, the nesting cap.
+*/
+/** How many slots deep the control sits: the host's SlotChild editor sits inside a provider one level down. */
+var SlotDepthContext = React.createContext(0);
+var count = (n) => `${n} block${n === 1 ? "" : "s"}`;
+var NO_CATALOG = {
+	entries: [],
+	nameOf: () => void 0
+};
+/** A note in words, labelable and focusable (the field label's `for` lands on it). */
+function SlotNote({ id, children, tone = "muted" }) {
+	return /* @__PURE__ */ jsx("output", {
+		id,
+		role: "note",
+		tabIndex: id ? 0 : void 0,
+		className: cn("block rounded-kit-sm text-kit-xs outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-kit-focus-ring focus-visible:[outline-style:solid] [html[data-input-modality=pointer]_&]:focus-visible:outline-none", tone === "warning" ? "text-kit-warning-fg" : "text-kit-fg-3"),
+		children
+	});
+}
+function ComponentSlotControl({ field, value, onChange, readOnly, id, path }) {
+	const slot = field.componentSlot ?? {
+		multiple: false,
+		min: 0,
+		max: 1
+	};
+	const depth = React.useContext(SlotDepthContext);
+	const { useSlotCatalog, SlotChild, toast } = useKitServices();
+	const catalog = useSlotCatalog ? useSlotCatalog({ componentIds: slot.componentIds }) : null;
+	const read = readSlot(value);
+	const items = read.items;
+	const max = slot.multiple ? slot.max : 1;
+	const [openId, setOpenId] = React.useState(null);
+	const nameOf = (componentId) => (catalog ?? NO_CATALOG).nameOf(componentId) ?? { title: catalog?.loading ? "Loading…" : componentId };
+	const locked = readOnly || read.unreadable > 0;
+	const write = (next) => {
+		setOpenId(null);
+		if (slot.multiple) return onChange(slotList(next));
+		const [first] = slotList(next);
+		onChange(first ?? { componentId: "" });
+	};
+	const opsField = {
+		...field,
+		validation: {
+			...field.validation,
+			min: slot.multiple ? slot.min : 0,
+			max
+		}
+	};
+	const ops = useListOps(opsField, path, items, write);
+	if (depth >= 10) return /* @__PURE__ */ jsx(SlotNote, {
+		id,
+		children: "Nested block limit reached. A slot this deep would render as nothing, so it can’t hold more blocks here."
+	});
+	const pick = (componentId) => {
+		if (!slot.multiple) {
+			const cur = items[0];
+			onChange(cur && cur.componentId === componentId ? cur : { componentId });
+			setOpenId(null);
+			return;
+		}
+		if (items.length >= max) return;
+		onChange([...items, { componentId }]);
+		setOpenId(`i${items.length}`);
+	};
+	const setOverrides = (index, overrides) => {
+		const next = items.map((it, i) => i === index ? {
+			...it,
+			overrides
+		} : it);
+		if (slot.multiple) onChange(next);
+		else onChange({
+			componentId: next[0].componentId,
+			overrides
+		});
+	};
+	const rows = items.map((it, i) => {
+		const name = nameOf(it.componentId);
+		const entry = catalog?.entries.find((e) => e.id === it.componentId);
+		return {
+			id: `i${i}`,
+			index: i,
+			item: it,
+			path: [...path, i],
+			preview: {
+				title: name.missing ? "Missing block" : name.title,
+				icon: entry?.icon ?? "box",
+				empty: false
+			},
+			extra: name.missing ? "Deleted, or not in this project. Replace or remove it." : entry?.category ?? `Block ${i + 1} of ${items.length}`
+		};
+	});
+	const only = slot.componentIds?.length === 1 ? catalog?.entries.find((e) => e.id === slot.componentIds[0]) : void 0;
+	const quickAdd = only?.insertable && (slot.multiple || items.length === 0) ? only : void 0;
+	const addOnly = (entry) => {
+		const before = value;
+		pick(entry.id);
+		toast?.(`${entry.title} added to ${field.title}`, { action: {
+			label: "Undo",
+			onClick: () => onChange(before)
+		} });
+	};
+	const picker = quickAdd ? /* @__PURE__ */ jsxs(Button, {
+		size: "lg",
+		variant: "ghost",
+		className: "text-kit-fg-2",
+		leftIcon: /* @__PURE__ */ jsx(IconPlus, { stroke: 1.5 }),
+		disabled: locked || slot.multiple && items.length >= max,
+		onClick: () => addOnly(quickAdd),
+		children: ["Add ", quickAdd.title]
+	}) : catalog ? /* @__PURE__ */ jsx(SlotPicker, {
+		entries: catalog.entries,
+		loading: catalog.loading,
+		error: catalog.error,
+		note: catalog.note,
+		current: slot.multiple ? void 0 : items[0]?.componentId,
+		label: slot.multiple ? "Add block" : items.length ? "Replace block" : "Choose a block",
+		disabled: locked || slot.multiple && items.length >= max,
+		onPick: pick
+	}) : null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex min-w-0 flex-col gap-1.5",
+		"data-slot": "kit-component-slot",
+		children: [
+			read.unreadable > 0 ? /* @__PURE__ */ jsxs(SlotNote, {
+				tone: "warning",
+				children: [
+					read.unreadable === 1 ? "One child here isn't a block instance" : `${read.unreadable} children here aren't block instances`,
+					" (blocks written by another editor). This editor would drop ",
+					read.unreadable === 1 ? "it" : "them",
+					" on save, so the slot is shown read-only and its value is kept."
+				]
+			}) : null,
+			read.inherited && items.length === 0 ? /* @__PURE__ */ jsx(SlotNote, { children: "Shows the block’s own content until a block is added here." }) : null,
+			/* @__PURE__ */ jsx("div", {
+				id,
+				tabIndex: -1,
+				className: "min-w-0 outline-none",
+				children: /* @__PURE__ */ jsx(RowList, {
+					field: opsField,
+					rows,
+					readOnly: locked,
+					layout: "list",
+					mode: "inline",
+					openId,
+					onOpen: (r) => setOpenId(openId === r.id ? null : r.id),
+					onCloseInline: () => setOpenId(null),
+					ops,
+					renderInline: (r) => {
+						const it = r.item;
+						const title = r.preview.title;
+						if (nameOf(it.componentId).missing) return /* @__PURE__ */ jsx(SlotNote, { children: "This component no longer exists, so its props can’t be edited. Replace it or remove it." });
+						if (!SlotChild) return /* @__PURE__ */ jsxs(SlotNote, { children: [
+							"This editor can’t open ",
+							title,
+							"’s own props."
+						] });
+						return /* @__PURE__ */ jsx(SlotDepthContext.Provider, {
+							value: depth + 1,
+							children: /* @__PURE__ */ jsx(SlotChild, {
+								componentId: it.componentId,
+								title,
+								overrides: it.overrides && typeof it.overrides === "object" ? it.overrides : {},
+								onChange: (o) => setOverrides(r.index, o),
+								readOnly: locked,
+								depth: depth + 1
+							})
+						});
+					},
+					leading: (r) => /* @__PURE__ */ jsx("span", {
+						className: "flex size-7 shrink-0 items-center justify-center rounded-kit-md border border-kit-line bg-kit-control-bg text-kit-fg-2 shadow-kit-xs",
+						children: /* @__PURE__ */ jsx(KitIcon, {
+							name: r.preview.icon,
+							className: "size-4"
+						})
+					}),
+					emptyLabel: slot.multiple ? "No blocks yet. Add one to start composing." : "No block yet. Choose one to fill this slot.",
+					addButton: picker ?? /* @__PURE__ */ jsxs(SlotNote, { children: [
+						"No block library is connected to this editor, so ",
+						field.title,
+						" can’t be changed here."
+					] })
+				})
+			}),
+			slot.multiple ? /* @__PURE__ */ jsxs("span", {
+				className: "text-kit-xs text-kit-fg-3",
+				children: [items.length >= max ? `This slot holds at most ${count(max)}.` : slot.min > 0 ? `Between ${slot.min} and ${count(max)}.` : `Up to ${count(max)}.`, slot.min > 0 && items.length > 0 && items.length <= slot.min ? ` It needs at least ${slot.min}, so none can be removed.` : ""]
+			}) : null
+		]
+	});
+}
+/**
+* The compact block picker (engine/slot.tsx BlockPicker), over the slot catalog: grouped by family, searchable, ↵ adds.
+* A component the server says can't go here is listed disabled with its reason in place of the description.
+*/
+function SlotPicker({ entries, loading, error, note, current, label, disabled, onPick }) {
+	const [open, setOpen] = React.useState(false);
+	const [q, setQ] = React.useState("");
+	const [active, setActive] = React.useState(0);
+	const listId = React.useId();
+	const list = entries.filter((b) => !q || `${b.title} ${b.category ?? ""} ${b.description ?? ""}`.toLowerCase().includes(q.toLowerCase()));
+	const cats = Array.from(new Set(list.map((b) => b.category || "Blocks")));
+	const flat = cats.flatMap((c) => list.filter((b) => (b.category || "Blocks") === c));
+	const choose = (b) => {
+		if (!b || !b.insertable) return;
+		onPick(b.id);
+		setOpen(false);
+		setQ("");
+	};
+	const optionId = (i) => `${listId}-${i}`;
+	return /* @__PURE__ */ jsxs(Popover, {
+		open,
+		onOpenChange: (o) => {
+			setOpen(o);
+			setQ("");
+			setActive(0);
+		},
+		children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+			render: /* @__PURE__ */ jsx(Button, {
+				size: "sm",
+				variant: "ghost",
+				className: "text-kit-fg-2",
+				leftIcon: /* @__PURE__ */ jsx(IconPlus, { stroke: 1.5 }),
+				disabled
+			}),
+			children: label
+		}), /* @__PURE__ */ jsxs(PopoverContent, {
+			className: "w-[300px] p-0",
+			align: "start",
+			children: [
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex h-10 items-center gap-2 border-b border-kit-line px-3 text-kit-fg-3",
+					children: [/* @__PURE__ */ jsx(IconSearch, {
+						className: "size-4 shrink-0",
+						stroke: 1.5,
+						"aria-hidden": true
+					}), /* @__PURE__ */ jsx("input", {
+						autoFocus: true,
+						value: q,
+						onChange: (e) => {
+							setQ(e.target.value);
+							setActive(0);
+						},
+						onKeyDown: (e) => {
+							if (e.key === "ArrowDown") {
+								e.preventDefault();
+								setActive((a) => (a + 1) % Math.max(1, flat.length));
+							} else if (e.key === "ArrowUp") {
+								e.preventDefault();
+								setActive((a) => (a - 1 + flat.length) % Math.max(1, flat.length));
+							} else if (e.key === "Enter") {
+								e.preventDefault();
+								choose(flat[active]);
+							}
+						},
+						placeholder: "Search blocks",
+						"aria-label": "Search blocks",
+						role: "combobox",
+						"aria-expanded": true,
+						"aria-controls": listId,
+						"aria-activedescendant": flat.length ? optionId(Math.min(active, flat.length - 1)) : void 0,
+						className: "h-full min-w-0 flex-1 bg-transparent text-kit-sm text-kit-fg outline-none placeholder:text-kit-fg-3"
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					id: listId,
+					className: "max-h-80 overflow-y-auto p-1",
+					role: "listbox",
+					"aria-label": "Blocks",
+					"aria-busy": loading || void 0,
+					children: [
+						loading && entries.length === 0 ? /* @__PURE__ */ jsx("p", {
+							role: "status",
+							className: "px-3 py-6 text-center text-kit-sm text-kit-fg-3",
+							children: "Loading blocks…"
+						}) : null,
+						!loading && !error && flat.length === 0 ? /* @__PURE__ */ jsx("p", {
+							className: "px-3 py-6 text-center text-kit-sm text-kit-fg-3",
+							children: entries.length ? "No blocks match" : "This project has no blocks that can go here yet."
+						}) : null,
+						error ? /* @__PURE__ */ jsx("p", {
+							role: "alert",
+							className: "px-3 py-3 text-kit-xs text-kit-danger-fg",
+							children: error
+						}) : null,
+						cats.map((c) => /* @__PURE__ */ jsxs("div", {
+							role: "group",
+							"aria-label": c,
+							className: "pb-1",
+							children: [/* @__PURE__ */ jsx("div", {
+								"aria-hidden": true,
+								className: "px-2 pb-1 pt-1.5 text-kit-2xs font-medium text-kit-fg-3",
+								children: c
+							}), list.filter((b) => (b.category || "Blocks") === c).map((b) => {
+								const i = flat.indexOf(b);
+								return /* @__PURE__ */ jsxs("div", {
+									id: optionId(i),
+									role: "option",
+									"aria-selected": b.id === current,
+									"aria-disabled": !b.insertable || void 0,
+									onMouseEnter: () => setActive(i),
+									onMouseDown: (e) => e.preventDefault(),
+									onClick: () => choose(b),
+									className: cn("flex w-full items-center gap-2.5 rounded-kit-md p-1.5 text-left", b.insertable ? "cursor-pointer" : "cursor-not-allowed", i === active && "bg-kit-hover"),
+									children: [/* @__PURE__ */ jsx("span", {
+										className: cn("flex size-8 shrink-0 items-center justify-center rounded-kit-md border border-kit-line bg-kit-surface text-kit-fg-2 shadow-kit-xs", !b.insertable && "opacity-50"),
+										children: /* @__PURE__ */ jsx(KitIcon, {
+											name: b.icon ?? "box",
+											className: "size-4"
+										})
+									}), /* @__PURE__ */ jsxs("span", {
+										className: "min-w-0 flex-1",
+										children: [/* @__PURE__ */ jsx("span", {
+											className: cn("block truncate text-kit-sm", b.insertable ? "text-kit-fg" : "text-kit-fg-3"),
+											children: b.title
+										}), !b.insertable && b.reason ? /* @__PURE__ */ jsx("span", {
+											className: "block text-kit-xs text-kit-fg-3",
+											children: b.reason
+										}) : b.description ? /* @__PURE__ */ jsx("span", {
+											className: "block truncate text-kit-xs text-kit-fg-3",
+											children: b.description
+										}) : null]
+									})]
+								}, b.id);
+							})]
+						}, c))
+					]
+				}),
+				note ? /* @__PURE__ */ jsx("p", {
+					className: "border-t border-kit-line px-3 py-2 text-kit-xs text-kit-fg-3",
+					children: note
+				}) : null,
+				/* @__PURE__ */ jsx("div", {
+					"data-hint": "shortcuts",
+					className: "border-t border-kit-line px-3 py-1.5 text-kit-2xs text-kit-fg-3",
+					children: "↵ add · type to search"
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { ComponentSlotControl, SlotDepthContext, SlotPicker };
+
+//# sourceMappingURL=slot.js.map

package/dist/controls/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","names":[],"sources":["../../src/controls/slot.tsx"],"sourcesContent":["/**\n * COMPONENT SLOT — a prop that holds component instances (prod `slot`), on the engine's slot surface (engine/slot.tsx,\n * V2 HEAD 9829bf1): the block rows (icon tile, name, ⋯ menu, drag to reorder) and the compact searchable picker.\n *\n * What differs from V2's block slot is where the rows come from and what they store:\n *   - the picker lists the host's slot catalog (`useSlotCatalog`): the project's components with the SERVER's\n *     insertability verdict for each; one that can't go here stays in the list, disabled, with the reason under its name;\n *   - a row opens in place and edits that child's own props through the host's `SlotChild`;\n *   - the value is written in the stored shape (slot-services.ts): one `{ componentId, overrides? }`, or a list of them\n *     for a multiple slot, every item spread back with the keys this control does not show (style, window).\n *\n * Refusals are said in words, never by an inert control: no catalog service, an unreadable stored value, the nesting cap.\n */\nimport * as React from \"react\";\nimport { IconPlus, IconSearch } from \"@tabler/icons-react\";\nimport { useKitServices } from \"../context\";\nimport { KitIcon } from \"../lib/icons\";\nimport { cn } from \"../lib/cn\";\nimport { Button } from \"../ui/button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../ui/overlay\";\nimport { RowList, useListOps, type RowModel } from \"../engine/array\";\nimport type { FieldSchema } from \"../schema/types\";\nimport type { ControlProps } from \"../types\";\nimport { readSlot, slotList, SLOT_DEPTH_MAX, type KitComponentSlot, type KitSlotEntry, type KitSlotItem } from \"./slot-services\";\n\n/** How many slots deep the control sits: the host's SlotChild editor sits inside a provider one level down. */\nexport const SlotDepthContext = React.createContext(0);\n\nconst count = (n: number) => `${n} block${n === 1 ? \"\" : \"s\"}`;\nconst NO_CATALOG = { entries: [] as KitSlotEntry[], nameOf: () => undefined };\n\n/** A note in words, labelable and focusable (the field label's `for` lands on it). */\nfunction SlotNote({ id, children, tone = \"muted\" }: { id?: string; children: React.ReactNode; tone?: \"muted\" | \"warning\" }) {\n  return (\n    <output\n      id={id}\n      role=\"note\"\n      tabIndex={id ? 0 : undefined}\n      className={cn(\n        \"block rounded-kit-sm text-kit-xs outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-kit-focus-ring focus-visible:[outline-style:solid] [html[data-input-modality=pointer]_&]:focus-visible:outline-none\",\n        tone === \"warning\" ? \"text-kit-warning-fg\" : \"text-kit-fg-3\",\n      )}\n    >\n      {children}\n    </output>\n  );\n}\n\nexport function ComponentSlotControl({ field, value, onChange, readOnly, id, path }: ControlProps) {\n  const slot: KitComponentSlot = field.componentSlot ?? { multiple: false, min: 0, max: 1 };\n  const depth = React.useContext(SlotDepthContext);\n  const { useSlotCatalog, SlotChild, toast } = useKitServices();\n  // a hook service: one identity for the life of the form, so it is called on every render or never\n  const catalog = useSlotCatalog ? useSlotCatalog({ componentIds: slot.componentIds }) : null; // eslint-disable-line react-hooks/rules-of-hooks\n  const read = readSlot(value);\n  const items = read.items;\n  const max = slot.multiple ? slot.max : 1;\n  const [openId, setOpenId] = React.useState<string | null>(null);\n  const nameOf = (componentId: string) => (catalog ?? NO_CATALOG).nameOf(componentId) ?? { title: catalog?.loading ? \"Loading…\" : componentId };\n  const locked = readOnly || read.unreadable > 0;\n\n  /* writes: the stored shape, never a `_key` (useListOps' duplicate adds one) */\n  const write = (next: unknown[]) => {\n    setOpenId(null);\n    if (slot.multiple) return onChange(slotList(next));\n    const [first] = slotList(next);\n    onChange(first ?? { componentId: \"\" });\n  };\n  const opsField: FieldSchema = { ...field, validation: { ...field.validation, min: slot.multiple ? slot.min : 0, max } };\n  const ops = useListOps(opsField, path, items, write);\n  if (depth >= SLOT_DEPTH_MAX) return <SlotNote id={id}>Nested block limit reached. A slot this deep would render as nothing, so it can&rsquo;t hold more blocks here.</SlotNote>;\n  const pick = (componentId: string) => {\n    if (!slot.multiple) {\n      const cur = items[0];\n      // a different component's overrides are keyed by the old component's props: dropped, never half-applied\n      onChange(cur && cur.componentId === componentId ? cur : { componentId });\n      setOpenId(null);\n      return;\n    }\n    if (items.length >= max) return;\n    onChange([...items, { componentId }]);\n    setOpenId(`i${items.length}`);\n  };\n  const setOverrides = (index: number, overrides: Record<string, unknown>) => {\n    const next = items.map((it, i) => (i === index ? { ...it, overrides } : it));\n    if (slot.multiple) onChange(next);\n    else onChange({ componentId: next[0].componentId, overrides });\n  };\n\n  const rows: RowModel[] = items.map((it, i) => {\n    const name = nameOf(it.componentId);\n    const entry = catalog?.entries.find((e) => e.id === it.componentId);\n    return {\n      id: `i${i}`,\n      index: i,\n      item: it,\n      path: [...path, i],\n      preview: { title: name.missing ? \"Missing block\" : name.title, icon: entry?.icon ?? \"box\", empty: false },\n      extra: name.missing ? \"Deleted, or not in this project. Replace or remove it.\" : (entry?.category ?? `Block ${i + 1} of ${items.length}`),\n    };\n  });\n\n  /*\n   * A slot that takes exactly one block type adds it in one press (V2 content-form.tsx \"Add {child}\"): no picker to\n   * choose from a list of one. Not insertable here → the picker, which says why. Undo puts the slot back as it was.\n   */\n  const only = slot.componentIds?.length === 1 ? catalog?.entries.find((e) => e.id === slot.componentIds![0]) : undefined;\n  const quickAdd = only?.insertable && (slot.multiple || items.length === 0) ? only : undefined;\n  const addOnly = (entry: KitSlotEntry) => {\n    const before = value;\n    pick(entry.id);\n    toast?.(`${entry.title} added to ${field.title}`, { action: { label: \"Undo\", onClick: () => onChange(before) } });\n  };\n\n  const picker = quickAdd ? (\n    <Button\n      size=\"lg\"\n      variant=\"ghost\"\n      className=\"text-kit-fg-2\"\n      leftIcon={<IconPlus stroke={1.5} />}\n      disabled={locked || (slot.multiple && items.length >= max)}\n      onClick={() => addOnly(quickAdd)}\n    >\n      Add {quickAdd.title}\n    </Button>\n  ) : catalog ? (\n    <SlotPicker\n      entries={catalog.entries}\n      loading={catalog.loading}\n      error={catalog.error}\n      note={catalog.note}\n      current={slot.multiple ? undefined : items[0]?.componentId}\n      label={slot.multiple ? \"Add block\" : items.length ? \"Replace block\" : \"Choose a block\"}\n      disabled={locked || (slot.multiple && items.length >= max)}\n      onPick={pick}\n    />\n  ) : null;\n\n  return (\n    <div className=\"flex min-w-0 flex-col gap-1.5\" data-slot=\"kit-component-slot\">\n      {read.unreadable > 0 ? (\n        <SlotNote tone=\"warning\">\n          {read.unreadable === 1 ? \"One child here isn't a block instance\" : `${read.unreadable} children here aren't block instances`} (blocks written by another editor). This editor\n          would drop {read.unreadable === 1 ? \"it\" : \"them\"} on save, so the slot is shown read-only and its value is kept.\n        </SlotNote>\n      ) : null}\n      {read.inherited && items.length === 0 ? <SlotNote>Shows the block&rsquo;s own content until a block is added here.</SlotNote> : null}\n      <div id={id} tabIndex={-1} className=\"min-w-0 outline-none\">\n        <RowList\n          field={opsField}\n          rows={rows}\n          readOnly={locked}\n          layout=\"list\"\n          mode=\"inline\"\n          openId={openId}\n          onOpen={(r) => setOpenId(openId === r.id ? null : r.id)}\n          onCloseInline={() => setOpenId(null)}\n          ops={ops}\n          renderInline={(r) => {\n            const it = r.item as KitSlotItem;\n            const title = r.preview.title;\n            if (nameOf(it.componentId).missing) return <SlotNote>This component no longer exists, so its props can&rsquo;t be edited. Replace it or remove it.</SlotNote>;\n            if (!SlotChild) return <SlotNote>This editor can&rsquo;t open {title}&rsquo;s own props.</SlotNote>;\n            return (\n              <SlotDepthContext.Provider value={depth + 1}>\n                <SlotChild\n                  componentId={it.componentId}\n                  title={title}\n                  overrides={it.overrides && typeof it.overrides === \"object\" ? it.overrides : {}}\n                  onChange={(o) => setOverrides(r.index, o)}\n                  readOnly={locked}\n                  depth={depth + 1}\n                />\n              </SlotDepthContext.Provider>\n            );\n          }}\n          leading={(r) => (\n            <span className=\"flex size-7 shrink-0 items-center justify-center rounded-kit-md border border-kit-line bg-kit-control-bg text-kit-fg-2 shadow-kit-xs\">\n              <KitIcon name={r.preview.icon} className=\"size-4\" />\n            </span>\n          )}\n          emptyLabel={slot.multiple ? \"No blocks yet. Add one to start composing.\" : \"No block yet. Choose one to fill this slot.\"}\n          addButton={picker ?? <SlotNote>No block library is connected to this editor, so {field.title} can&rsquo;t be changed here.</SlotNote>}\n        />\n      </div>\n      {slot.multiple ? (\n        <span className=\"text-kit-xs text-kit-fg-3\">\n          {items.length >= max ? `This slot holds at most ${count(max)}.` : slot.min > 0 ? `Between ${slot.min} and ${count(max)}.` : `Up to ${count(max)}.`}\n          {slot.min > 0 && items.length > 0 && items.length <= slot.min ? ` It needs at least ${slot.min}, so none can be removed.` : \"\"}\n        </span>\n      ) : null}\n    </div>\n  );\n}\n\n/**\n * The compact block picker (engine/slot.tsx BlockPicker), over the slot catalog: grouped by family, searchable, ↵ adds.\n * A component the server says can't go here is listed disabled with its reason in place of the description.\n */\nexport function SlotPicker({\n  entries,\n  loading,\n  error,\n  note,\n  current,\n  label,\n  disabled,\n  onPick,\n}: {\n  entries: KitSlotEntry[];\n  loading?: boolean;\n  error?: string;\n  note?: string;\n  current?: string;\n  label: string;\n  disabled?: boolean;\n  onPick: (componentId: string) => void;\n}) {\n  const [open, setOpen] = React.useState(false);\n  const [q, setQ] = React.useState(\"\");\n  const [active, setActive] = React.useState(0);\n  const listId = React.useId();\n  const list = entries.filter((b) => !q || `${b.title} ${b.category ?? \"\"} ${b.description ?? \"\"}`.toLowerCase().includes(q.toLowerCase()));\n  const cats = Array.from(new Set(list.map((b) => b.category || \"Blocks\")));\n  const flat = cats.flatMap((c) => list.filter((b) => (b.category || \"Blocks\") === c));\n  const choose = (b: KitSlotEntry | undefined) => {\n    if (!b || !b.insertable) return;\n    onPick(b.id);\n    setOpen(false);\n    setQ(\"\");\n  };\n  const optionId = (i: number) => `${listId}-${i}`;\n  return (\n    <Popover\n      open={open}\n      onOpenChange={(o) => {\n        setOpen(o);\n        setQ(\"\");\n        setActive(0);\n      }}\n    >\n      <PopoverTrigger render={<Button size=\"sm\" variant=\"ghost\" className=\"text-kit-fg-2\" leftIcon={<IconPlus stroke={1.5} />} disabled={disabled} />}>{label}</PopoverTrigger>\n      <PopoverContent className=\"w-[300px] p-0\" align=\"start\">\n        <label className=\"flex h-10 items-center gap-2 border-b border-kit-line px-3 text-kit-fg-3\">\n          <IconSearch className=\"size-4 shrink-0\" stroke={1.5} aria-hidden />\n          <input\n            autoFocus\n            value={q}\n            onChange={(e) => {\n              setQ(e.target.value);\n              setActive(0);\n            }}\n            onKeyDown={(e) => {\n              if (e.key === \"ArrowDown\") {\n                e.preventDefault();\n                setActive((a) => (a + 1) % Math.max(1, flat.length));\n              } else if (e.key === \"ArrowUp\") {\n                e.preventDefault();\n                setActive((a) => (a - 1 + flat.length) % Math.max(1, flat.length));\n              } else if (e.key === \"Enter\") {\n                e.preventDefault();\n                choose(flat[active]);\n              }\n            }}\n            placeholder=\"Search blocks\"\n            aria-label=\"Search blocks\"\n            role=\"combobox\"\n            aria-expanded\n            aria-controls={listId}\n            aria-activedescendant={flat.length ? optionId(Math.min(active, flat.length - 1)) : undefined}\n            className=\"h-full min-w-0 flex-1 bg-transparent text-kit-sm text-kit-fg outline-none placeholder:text-kit-fg-3\"\n          />\n        </label>\n        <div id={listId} className=\"max-h-80 overflow-y-auto p-1\" role=\"listbox\" aria-label=\"Blocks\" aria-busy={loading || undefined}>\n          {loading && entries.length === 0 ? (\n            <p role=\"status\" className=\"px-3 py-6 text-center text-kit-sm text-kit-fg-3\">\n              Loading blocks…\n            </p>\n          ) : null}\n          {!loading && !error && flat.length === 0 ? <p className=\"px-3 py-6 text-center text-kit-sm text-kit-fg-3\">{entries.length ? \"No blocks match\" : \"This project has no blocks that can go here yet.\"}</p> : null}\n          {error ? (\n            <p role=\"alert\" className=\"px-3 py-3 text-kit-xs text-kit-danger-fg\">\n              {error}\n            </p>\n          ) : null}\n          {cats.map((c) => (\n            <div key={c} role=\"group\" aria-label={c} className=\"pb-1\">\n              <div aria-hidden className=\"px-2 pb-1 pt-1.5 text-kit-2xs font-medium text-kit-fg-3\">\n                {c}\n              </div>\n              {list\n                .filter((b) => (b.category || \"Blocks\") === c)\n                .map((b) => {\n                  const i = flat.indexOf(b);\n                  return (\n                    <div\n                      key={b.id}\n                      id={optionId(i)}\n                      role=\"option\"\n                      aria-selected={b.id === current}\n                      aria-disabled={!b.insertable || undefined}\n                      onMouseEnter={() => setActive(i)}\n                      onMouseDown={(e) => e.preventDefault()}\n                      onClick={() => choose(b)}\n                      className={cn(\"flex w-full items-center gap-2.5 rounded-kit-md p-1.5 text-left\", b.insertable ? \"cursor-pointer\" : \"cursor-not-allowed\", i === active && \"bg-kit-hover\")}\n                    >\n                      <span className={cn(\"flex size-8 shrink-0 items-center justify-center rounded-kit-md border border-kit-line bg-kit-surface text-kit-fg-2 shadow-kit-xs\", !b.insertable && \"opacity-50\")}>\n                        <KitIcon name={b.icon ?? \"box\"} className=\"size-4\" />\n                      </span>\n                      <span className=\"min-w-0 flex-1\">\n                        <span className={cn(\"block truncate text-kit-sm\", b.insertable ? \"text-kit-fg\" : \"text-kit-fg-3\")}>{b.title}</span>\n                        {!b.insertable && b.reason ? (\n                          <span className=\"block text-kit-xs text-kit-fg-3\">{b.reason}</span>\n                        ) : b.description ? (\n                          <span className=\"block truncate text-kit-xs text-kit-fg-3\">{b.description}</span>\n                        ) : null}\n                      </span>\n                    </div>\n                  );\n                })}\n            </div>\n          ))}\n        </div>\n        {note ? <p className=\"border-t border-kit-line px-3 py-2 text-kit-xs text-kit-fg-3\">{note}</p> : null}\n        <div data-hint=\"shortcuts\" className=\"border-t border-kit-line px-3 py-1.5 text-kit-2xs text-kit-fg-3\">\n          ↵ add · type to search\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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"}

package/dist/controls/table/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/controls/table/index.js

@@ -0,0 +1,12 @@
+import { TableControl, TableFullScreenAction } from "./table.js";
+import { ACTIONS, CONTROLS } from "../../engine/kit-field.js";
+//#region src/controls/table/index.ts
+/**
+* Data table: registers the control and its label-row action (one line each, so lanes merge cleanly).
+* Imported for its side effect by the kit entry; import the parts themselves by path.
+*/
+CONTROLS.table = TableControl;
+ACTIONS.table = TableFullScreenAction;
+//#endregion
+
+//# sourceMappingURL=index.js.map

package/dist/controls/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/controls/table/index.ts"],"sourcesContent":["/**\n * Data table: registers the control and its label-row action (one line each, so lanes merge cleanly).\n * Imported for its side effect by the kit entry; import the parts themselves by path.\n */\nimport { ACTIONS, CONTROLS } from \"../../engine/kit-field\";\nimport { TableControl, TableFullScreenAction } from \"./table\";\n\nCONTROLS.table = TableControl;\nACTIONS.table = TableFullScreenAction;\n"],"mappings":";;;;;;;AAOA,SAAS,QAAQ;AACjB,QAAQ,QAAQ"}

package/dist/controls/table/prod.d.ts

@@ -0,0 +1,21 @@
+/**
+ * The production side of a data table, for the schema adapter (adapters/schema.ts) to call when it reads one:
+ *
+ *  - a component `table` prop with `config.mode: "data"` (BE @bettercms-ai/types component.ts; prop-fields.ts
+ *    isDataTable) holds ONE TableValue, with the table field's options beside `mode` in its `config`;
+ *  - a content-model `table` field (BE content-model.ts) holds the same value, its options in `config`.
+ *
+ * A `table` prop with no mode (or `"rows"` / `"types"`) is the older array of rows and is NOT this value.
+ * Only the option keys the backend defines are read, each only when it has the type the backend reads, so a stray key
+ * never turns into a setting the backend would not honour.
+ */
+import { type TableFieldOptions } from "../../schema/table";
+/** BE isDataTable: a `table` prop or sub-field holding one TableValue. */
+export declare const isDataTableProp: (p: {
+    type?: unknown;
+    config?: unknown;
+}) => boolean;
+/** The field options a data table's `config` carries, as the kit's `FieldSchema.table`. */
+export declare function tableOptionsFromConfig(config: unknown): TableFieldOptions;
+/** The `config` a data-table prop is written with (the inverse of tableOptionsFromConfig). */
+export declare function tableConfigFromOptions(o: TableFieldOptions | undefined): Record<string, unknown>;

package/dist/controls/table/prod.js

@@ -0,0 +1,79 @@
+import { TABLE_COLUMN_TYPES } from "../../schema/table.js";
+//#region src/controls/table/prod.ts
+/**
+* The production side of a data table, for the schema adapter (adapters/schema.ts) to call when it reads one:
+*
+*  - a component `table` prop with `config.mode: "data"` (BE @bettercms-ai/types component.ts; prop-fields.ts
+*    isDataTable) holds ONE TableValue, with the table field's options beside `mode` in its `config`;
+*  - a content-model `table` field (BE content-model.ts) holds the same value, its options in `config`.
+*
+* A `table` prop with no mode (or `"rows"` / `"types"`) is the older array of rows and is NOT this value.
+* Only the option keys the backend defines are read, each only when it has the type the backend reads, so a stray key
+* never turns into a setting the backend would not honour.
+*/
+var isObj = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var COLUMN_TYPES = new Set(TABLE_COLUMN_TYPES.map((t) => t.value));
+var PHONES = /* @__PURE__ */ new Set([
+	"scroll",
+	"stack",
+	"cards"
+]);
+var JSONLD = /* @__PURE__ */ new Set([
+	"ItemList",
+	"Dataset",
+	"Offers"
+]);
+var SETTING_FLAGS = [
+	"headers",
+	"totals",
+	"highlight",
+	"sticky",
+	"sort",
+	"search"
+];
+/** BE isDataTable: a `table` prop or sub-field holding one TableValue. */
+var isDataTableProp = (p) => p.type === "table" && isObj(p.config) && p.config.mode === "data";
+/** The field options a data table's `config` carries, as the kit's `FieldSchema.table`. */
+function tableOptionsFromConfig(config) {
+	if (!isObj(config)) return {};
+	const o = {};
+	const strs = (v, ok) => Array.isArray(v) ? v.filter((x) => typeof x === "string" && ok.has(x)) : void 0;
+	const columnTypes = strs(config.columnTypes, COLUMN_TYPES);
+	if (columnTypes) o.columnTypes = columnTypes;
+	for (const k of [
+		"lockColumns",
+		"requireCaption",
+		"allowGroups",
+		"allowFootnotes",
+		"allowNote"
+	]) if (typeof config[k] === "boolean") o[k] = config[k];
+	for (const k of [
+		"minRows",
+		"maxRows",
+		"maxColumns"
+	]) {
+		const n = config[k];
+		if (typeof n === "number" && Number.isInteger(n) && n >= 0) o[k] = n;
+	}
+	if (isObj(config.settings)) {
+		const s = {};
+		for (const k of SETTING_FLAGS) if (typeof config.settings[k] === "boolean") s[k] = config.settings[k];
+		const phones = strs(config.settings.phones, PHONES);
+		if (phones) s.phones = phones;
+		o.settings = s;
+	}
+	const jsonLd = strs(config.jsonLd, JSONLD);
+	if (jsonLd) o.jsonLd = jsonLd;
+	return o;
+}
+/** The `config` a data-table prop is written with (the inverse of tableOptionsFromConfig). */
+function tableConfigFromOptions(o) {
+	return {
+		mode: "data",
+		...o ? JSON.parse(JSON.stringify(o)) : {}
+	};
+}
+//#endregion
+export { isDataTableProp, tableConfigFromOptions, tableOptionsFromConfig };
+
+//# sourceMappingURL=prod.js.map

package/dist/controls/table/prod.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prod.js","names":[],"sources":["../../../src/controls/table/prod.ts"],"sourcesContent":["/**\n * The production side of a data table, for the schema adapter (adapters/schema.ts) to call when it reads one:\n *\n *  - a component `table` prop with `config.mode: \"data\"` (BE @bettercms-ai/types component.ts; prop-fields.ts\n *    isDataTable) holds ONE TableValue, with the table field's options beside `mode` in its `config`;\n *  - a content-model `table` field (BE content-model.ts) holds the same value, its options in `config`.\n *\n * A `table` prop with no mode (or `\"rows\"` / `\"types\"`) is the older array of rows and is NOT this value.\n * Only the option keys the backend defines are read, each only when it has the type the backend reads, so a stray key\n * never turns into a setting the backend would not honour.\n */\nimport { TABLE_COLUMN_TYPES, type TableColumnType, type TableFieldOptions, type TableJsonLdType, type TableResponsive, type TableSettingsOptions } from \"../../schema/table\";\n\nconst isObj = (v: unknown): v is Record<string, unknown> => !!v && typeof v === \"object\" && !Array.isArray(v);\nconst COLUMN_TYPES = new Set<string>(TABLE_COLUMN_TYPES.map((t) => t.value));\nconst PHONES = new Set<string>([\"scroll\", \"stack\", \"cards\"]);\nconst JSONLD = new Set<string>([\"ItemList\", \"Dataset\", \"Offers\"]);\nconst SETTING_FLAGS = [\"headers\", \"totals\", \"highlight\", \"sticky\", \"sort\", \"search\"] as const;\n\n/** BE isDataTable: a `table` prop or sub-field holding one TableValue. */\nexport const isDataTableProp = (p: { type?: unknown; config?: unknown }): boolean => p.type === \"table\" && isObj(p.config) && p.config.mode === \"data\";\n\n/** The field options a data table's `config` carries, as the kit's `FieldSchema.table`. */\nexport function tableOptionsFromConfig(config: unknown): TableFieldOptions {\n  if (!isObj(config)) return {};\n  const o: TableFieldOptions = {};\n  const strs = (v: unknown, ok: Set<string>) => (Array.isArray(v) ? v.filter((x): x is string => typeof x === \"string\" && ok.has(x)) : undefined);\n  const columnTypes = strs(config.columnTypes, COLUMN_TYPES);\n  if (columnTypes) o.columnTypes = columnTypes as TableColumnType[];\n  for (const k of [\"lockColumns\", \"requireCaption\", \"allowGroups\", \"allowFootnotes\", \"allowNote\"] as const) if (typeof config[k] === \"boolean\") o[k] = config[k] as boolean;\n  for (const k of [\"minRows\", \"maxRows\", \"maxColumns\"] as const) {\n    const n = config[k];\n    if (typeof n === \"number\" && Number.isInteger(n) && n >= 0) o[k] = n;\n  }\n  if (isObj(config.settings)) {\n    const s: TableSettingsOptions = {};\n    for (const k of SETTING_FLAGS) if (typeof config.settings[k] === \"boolean\") s[k] = config.settings[k] as boolean;\n    const phones = strs(config.settings.phones, PHONES);\n    if (phones) s.phones = phones as TableResponsive[];\n    o.settings = s;\n  }\n  const jsonLd = strs(config.jsonLd, JSONLD);\n  if (jsonLd) o.jsonLd = jsonLd as TableJsonLdType[];\n  return o;\n}\n\n/** The `config` a data-table prop is written with (the inverse of tableOptionsFromConfig). */\nexport function tableConfigFromOptions(o: TableFieldOptions | undefined): Record<string, unknown> {\n  return { mode: \"data\", ...(o ? JSON.parse(JSON.stringify(o)) : {}) };\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAM,SAAS,MAA6C,CAAC,CAAC,KAAK,OAAO,MAAM,YAAY,CAAC,MAAM,QAAQ,CAAC;AAC5G,IAAM,eAAe,IAAI,IAAY,mBAAmB,KAAK,MAAM,EAAE,KAAK,CAAC;AAC3E,IAAM,yBAAS,IAAI,IAAY;CAAC;CAAU;CAAS;AAAO,CAAC;AAC3D,IAAM,yBAAS,IAAI,IAAY;CAAC;CAAY;CAAW;AAAQ,CAAC;AAChE,IAAM,gBAAgB;CAAC;CAAW;CAAU;CAAa;CAAU;CAAQ;AAAQ;;AAGnF,IAAa,mBAAmB,MAAqD,EAAE,SAAS,WAAW,MAAM,EAAE,MAAM,KAAK,EAAE,OAAO,SAAS;;AAGhJ,SAAgB,uBAAuB,QAAoC;CACzE,IAAI,CAAC,MAAM,MAAM,GAAG,OAAO,CAAC;CAC5B,MAAM,IAAuB,CAAC;CAC9B,MAAM,QAAQ,GAAY,OAAqB,MAAM,QAAQ,CAAC,IAAI,EAAE,QAAQ,MAAmB,OAAO,MAAM,YAAY,GAAG,IAAI,CAAC,CAAC,IAAI,KAAA;CACrI,MAAM,cAAc,KAAK,OAAO,aAAa,YAAY;CACzD,IAAI,aAAa,EAAE,cAAc;CACjC,KAAK,MAAM,KAAK;EAAC;EAAe;EAAkB;EAAe;EAAkB;CAAW,GAAY,IAAI,OAAO,OAAO,OAAO,WAAW,EAAE,KAAK,OAAO;CAC5J,KAAK,MAAM,KAAK;EAAC;EAAW;EAAW;CAAY,GAAY;EAC7D,MAAM,IAAI,OAAO;EACjB,IAAI,OAAO,MAAM,YAAY,OAAO,UAAU,CAAC,KAAK,KAAK,GAAG,EAAE,KAAK;CACrE;CACA,IAAI,MAAM,OAAO,QAAQ,GAAG;EAC1B,MAAM,IAA0B,CAAC;EACjC,KAAK,MAAM,KAAK,eAAe,IAAI,OAAO,OAAO,SAAS,OAAO,WAAW,EAAE,KAAK,OAAO,SAAS;EACnG,MAAM,SAAS,KAAK,OAAO,SAAS,QAAQ,MAAM;EAClD,IAAI,QAAQ,EAAE,SAAS;EACvB,EAAE,WAAW;CACf;CACA,MAAM,SAAS,KAAK,OAAO,QAAQ,MAAM;CACzC,IAAI,QAAQ,EAAE,SAAS;CACvB,OAAO;AACT;;AAGA,SAAgB,uBAAuB,GAA2D;CAChG,OAAO;EAAE,MAAM;EAAQ,GAAI,IAAI,KAAK,MAAM,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC;CAAG;AACrE"}

package/dist/controls/table/refs.d.ts

@@ -0,0 +1,50 @@
+import type { TableRef } from "../../schema/table";
+export interface TableRefOption {
+    /** page or entry id: what the cell stores as `ref` */
+    id: string;
+    title: string;
+    /** "Blog post · my-slug", "Page" */
+    subtitle?: string;
+    /** the public path, stored as the cell's `href` so the published table links without a read */
+    href?: string;
+}
+export interface TableRefSearchRequest {
+    /** the column's `refTo` (null = pages, as V2) */
+    refTo: string[] | null;
+    q: string;
+    signal: AbortSignal;
+}
+export type TableRefSearch = (req: TableRefSearchRequest) => Promise<TableRefOption[]>;
+export interface TableKitServices {
+    tableRefSearch?: TableRefSearch;
+}
+declare module "../../context" {
+    interface KitServices {
+        /** Search pages and entries for a table's reference cells (see above). Absent → the picker names why it can't. */
+        tableRefSearch?: TableRefSearch;
+    }
+}
+/**
+ * The POST /content/reference-options `config` bodies one column's `refTo` needs (the host sends each and merges the
+ * answers): pages through `targets: ["page"]`, each collection through `contentModelId`.
+ */
+export declare function tableRefConfigs(refTo: string[] | null | undefined): Record<string, unknown>[];
+/** The words a stored reference shows: what a read resolved onto it, its stored label, else its id. */
+export declare function refLabel(r: TableRef & {
+    resolved?: {
+        title?: string;
+    };
+}): string;
+export type RefSearchState = {
+    status: "unavailable";
+} | {
+    status: "loading";
+} | {
+    status: "ready";
+    options: TableRefOption[];
+} | {
+    status: "error";
+    message: string;
+};
+/** Search while `open`, 200ms after the last keystroke; a newer query aborts the older one. */
+export declare function useRefSearch(open: boolean, refTo: string[] | null, q: string): RefSearchState;