@bettercms-ai/kit 0.1.0 → 1.0.0

package/controls/slot-register.d.ts

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

package/controls/slot-register.js

@@ -0,0 +1,16 @@
+import { JsonControl } from "./json.js";
+import { CONTROLS } from "../engine/kit-field.js";
+import { ComponentSlotControl } from "./slot.js";
+import { createElement } from "react";
+//#region src/kit/controls/slot-register.ts
+/**
+* Lane L3: a component slot (a json field the host marks `componentSlot`) draws the slot control; every other json
+* field keeps the json editor. Imported after json-register (kit barrel), so it wraps the registered json control.
+*/
+var Json = CONTROLS.json ?? JsonControl;
+CONTROLS.json = function JsonOrSlotControl(props) {
+	return createElement(props.field.componentSlot ? ComponentSlotControl : Json, props);
+};
+//#endregion
+
+//# sourceMappingURL=slot-register.js.map

package/controls/slot-register.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot-register.js","names":[],"sources":["../../src/kit/controls/slot-register.ts"],"sourcesContent":["/**\n * Lane L3: a component slot (a json field the host marks `componentSlot`) draws the slot control; every other json\n * field keeps the json editor. Imported after json-register (kit barrel), so it wraps the registered json control.\n */\nimport { createElement } from \"react\";\nimport type { ControlProps } from \"../types\";\nimport { CONTROLS } from \"../engine/kit-field\";\nimport { JsonControl } from \"./json\";\nimport { ComponentSlotControl } from \"./slot\";\n\nconst Json = CONTROLS.json ?? JsonControl;\nCONTROLS.json = function JsonOrSlotControl(props: ControlProps) {\n  return createElement(props.field.componentSlot ? ComponentSlotControl : Json, props);\n};\n"],"mappings":";;;;;;;;;AAUA,IAAM,OAAO,SAAS,QAAQ;AAC9B,SAAS,OAAO,SAAS,kBAAkB,OAAqB;AAC9D,QAAO,cAAc,MAAM,MAAM,gBAAgB,uBAAuB,MAAM,MAAM"}

package/controls/slot-services.d.ts

@@ -0,0 +1,97 @@
+/**
+ * Component slots (lane L3): the services the slot control reads and the reading of a stored slot value, declared as
+ * augmentations so context.tsx and schema/types.ts stay untouched by this lane.
+ *
+ * A prod `slot` prop holds component instances, not V2 blocks:
+ *   single   `{ componentId, overrides? }` (a detached slot is `{ componentId: "" }`)
+ *   multiple `[{ componentId, overrides?, style?, window? }, …]`; a single object reads as a list of one
+ * The host marks such a field with `componentSlot` (the dock reads it off the prop's config) and the slot control draws
+ * it; the value is written back in exactly that shape, each item spread with the keys this control does not show.
+ *
+ *   useSlotCatalog → a React HOOK: the components this slot may take, with the SERVER's insertability verdicts
+ *                    (GET /components/section-catalog) already turned into words, and the name of any component id
+ *   SlotChild      → the host's editor for one child's own props (its overrides), drawn under the child's row
+ */
+import type { ComponentType } from "react";
+/** One component the slot picker lists. `insertable: false` always carries `reason`, a sentence the picker shows. */
+export interface KitSlotEntry {
+    id: string;
+    title: string;
+    /** the section family ("Hero"), shown as the picker's group */
+    category?: string | null;
+    description?: string | null;
+    icon?: string;
+    insertable: boolean;
+    reason?: string;
+}
+export interface KitSlotCatalog {
+    entries: KitSlotEntry[];
+    loading?: boolean;
+    /** a whole sentence naming what failed ("Sections couldn't be loaded: …") */
+    error?: string;
+    /** a sentence under the picker's list naming what can never fill a slot and why (built-in sections) */
+    note?: string;
+    /** a component id's name; `missing` when the project has no such component (deleted, or another project's) */
+    nameOf: (componentId: string) => {
+        title: string;
+        missing?: boolean;
+    } | undefined;
+}
+export interface KitSlotChildProps {
+    componentId: string;
+    title: string;
+    overrides: Record<string, unknown>;
+    onChange: (next: Record<string, unknown>) => void;
+    readOnly?: boolean;
+    /** how many slots deep this child sits (1 for a top-level slot's child) */
+    depth: number;
+}
+/** The slot's own rules, mirrored from the prop's config so a save is not refused (BE slot-values.ts). */
+export interface KitComponentSlot {
+    multiple: boolean;
+    /** config.componentIds: the only components it takes (empty or absent: any) */
+    componentIds?: string[];
+    /** config.minItems (multiple only) */
+    min: number;
+    /** config.maxItems, defaulted to 12 and capped at 50 (multiple only; a single slot holds one) */
+    max: number;
+}
+declare module "../context" {
+    interface KitServices {
+        useSlotCatalog?: (req: {
+            componentIds?: string[];
+        }) => KitSlotCatalog;
+        SlotChild?: ComponentType<KitSlotChildProps>;
+    }
+}
+declare module "../schema/types" {
+    interface FieldSchema {
+        /** a component slot (prod `slot` prop): drawn by the slot control instead of the json editor */
+        componentSlot?: KitComponentSlot;
+    }
+}
+/** SLOT_MAX_ITEMS / SLOT_ITEMS_CAP (@bettercms-ai/types): the default and the hard cap of a multiple slot. */
+export declare const SLOT_MAX_ITEMS = 12;
+export declare const SLOT_ITEMS_CAP = 50;
+/** The renderers' nesting cap: past it a tree renders as nothing, so the editor refuses to nest further. */
+export declare const SLOT_DEPTH_MAX = 10;
+export interface KitSlotItem {
+    componentId: string;
+    overrides?: Record<string, unknown>;
+    [key: string]: unknown;
+}
+export interface SlotReading {
+    items: KitSlotItem[];
+    /** the value is the component's own content (its child blocks), shown until an item is added */
+    inherited: boolean;
+    /** entries this control can't read and would drop on a write (V2 block children, malformed rows) */
+    unreadable: number;
+}
+/**
+ * A stored slot value as its instances (`slotItems`, the one reading of a slot value): a list is its items, a single
+ * `{ componentId }` is a list of one, a detached `{ componentId: "" }` is none. A non-empty list with no instance and no
+ * V2 child is the component's own child blocks (the inherited value), not something to drop.
+ */
+export declare function readSlot(value: unknown): SlotReading;
+/** Write a multiple slot: the items as they are (no `_key` the engine's list helpers add, which prod never stores). */
+export declare function slotList(items: unknown[]): KitSlotItem[];

package/controls/slot-services.js

@@ -0,0 +1,38 @@
+//#region src/kit/controls/slot-services.ts
+var isObj = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+var isItem = (v) => isObj(v) && typeof v.componentId === "string" && v.componentId !== "";
+/**
+* A stored slot value as its instances (`slotItems`, the one reading of a slot value): a list is its items, a single
+* `{ componentId }` is a list of one, a detached `{ componentId: "" }` is none. A non-empty list with no instance and no
+* V2 child is the component's own child blocks (the inherited value), not something to drop.
+*/
+function readSlot(value) {
+	if (Array.isArray(value)) {
+		const items = value.filter(isItem);
+		const rest = value.filter((v) => !isItem(v));
+		const v2 = rest.filter((v) => isObj(v) && v.componentId === void 0 && ("_type" in v || "_key" in v));
+		const inherited = items.length === 0 && v2.length === 0 && rest.length > 0;
+		return {
+			items,
+			inherited,
+			unreadable: inherited ? 0 : rest.length
+		};
+	}
+	return {
+		items: isItem(value) ? [value] : [],
+		inherited: false,
+		unreadable: 0
+	};
+}
+/** Write a multiple slot: the items as they are (no `_key` the engine's list helpers add, which prod never stores). */
+function slotList(items) {
+	return items.filter(isItem).map((it) => {
+		if (!("_key" in it)) return it;
+		const { _key, ...rest } = it;
+		return rest;
+	});
+}
+//#endregion
+export { readSlot, slotList };
+
+//# sourceMappingURL=slot-services.js.map

package/controls/slot-services.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot-services.js","names":[],"sources":["../../src/kit/controls/slot-services.ts"],"sourcesContent":["/**\n * Component slots (lane L3): the services the slot control reads and the reading of a stored slot value, declared as\n * augmentations so context.tsx and schema/types.ts stay untouched by this lane.\n *\n * A prod `slot` prop holds component instances, not V2 blocks:\n *   single   `{ componentId, overrides? }` (a detached slot is `{ componentId: \"\" }`)\n *   multiple `[{ componentId, overrides?, style?, window? }, …]`; a single object reads as a list of one\n * The host marks such a field with `componentSlot` (the dock reads it off the prop's config) and the slot control draws\n * it; the value is written back in exactly that shape, each item spread with the keys this control does not show.\n *\n *   useSlotCatalog → a React HOOK: the components this slot may take, with the SERVER's insertability verdicts\n *                    (GET /components/section-catalog) already turned into words, and the name of any component id\n *   SlotChild      → the host's editor for one child's own props (its overrides), drawn under the child's row\n */\nimport type { ComponentType } from \"react\";\n\n/** One component the slot picker lists. `insertable: false` always carries `reason`, a sentence the picker shows. */\nexport interface KitSlotEntry {\n  id: string;\n  title: string;\n  /** the section family (\"Hero\"), shown as the picker's group */\n  category?: string | null;\n  description?: string | null;\n  icon?: string;\n  insertable: boolean;\n  reason?: string;\n}\n\nexport interface KitSlotCatalog {\n  entries: KitSlotEntry[];\n  loading?: boolean;\n  /** a whole sentence naming what failed (\"Sections couldn't be loaded: …\") */\n  error?: string;\n  /** a sentence under the picker's list naming what can never fill a slot and why (built-in sections) */\n  note?: string;\n  /** a component id's name; `missing` when the project has no such component (deleted, or another project's) */\n  nameOf: (componentId: string) => { title: string; missing?: boolean } | undefined;\n}\n\nexport interface KitSlotChildProps {\n  componentId: string;\n  title: string;\n  overrides: Record<string, unknown>;\n  onChange: (next: Record<string, unknown>) => void;\n  readOnly?: boolean;\n  /** how many slots deep this child sits (1 for a top-level slot's child) */\n  depth: number;\n}\n\n/** The slot's own rules, mirrored from the prop's config so a save is not refused (BE slot-values.ts). */\nexport interface KitComponentSlot {\n  multiple: boolean;\n  /** config.componentIds: the only components it takes (empty or absent: any) */\n  componentIds?: string[];\n  /** config.minItems (multiple only) */\n  min: number;\n  /** config.maxItems, defaulted to 12 and capped at 50 (multiple only; a single slot holds one) */\n  max: number;\n}\n\ndeclare module \"../context\" {\n  interface KitServices {\n    useSlotCatalog?: (req: { componentIds?: string[] }) => KitSlotCatalog;\n    SlotChild?: ComponentType<KitSlotChildProps>;\n  }\n}\n\ndeclare module \"../schema/types\" {\n  interface FieldSchema {\n    /** a component slot (prod `slot` prop): drawn by the slot control instead of the json editor */\n    componentSlot?: KitComponentSlot;\n  }\n}\n\n/** SLOT_MAX_ITEMS / SLOT_ITEMS_CAP (@bettercms-ai/types): the default and the hard cap of a multiple slot. */\nexport const SLOT_MAX_ITEMS = 12;\nexport const SLOT_ITEMS_CAP = 50;\n/** The renderers' nesting cap: past it a tree renders as nothing, so the editor refuses to nest further. */\nexport const SLOT_DEPTH_MAX = 10;\n\nexport interface KitSlotItem {\n  componentId: string;\n  overrides?: Record<string, unknown>;\n  [key: string]: unknown;\n}\n\nexport interface SlotReading {\n  items: KitSlotItem[];\n  /** the value is the component's own content (its child blocks), shown until an item is added */\n  inherited: boolean;\n  /** entries this control can't read and would drop on a write (V2 block children, malformed rows) */\n  unreadable: number;\n}\n\nconst isObj = (v: unknown): v is Record<string, unknown> => !!v && typeof v === \"object\" && !Array.isArray(v);\nconst isItem = (v: unknown): v is KitSlotItem => isObj(v) && typeof v.componentId === \"string\" && v.componentId !== \"\";\n\n/**\n * A stored slot value as its instances (`slotItems`, the one reading of a slot value): a list is its items, a single\n * `{ componentId }` is a list of one, a detached `{ componentId: \"\" }` is none. A non-empty list with no instance and no\n * V2 child is the component's own child blocks (the inherited value), not something to drop.\n */\nexport function readSlot(value: unknown): SlotReading {\n  if (Array.isArray(value)) {\n    const items = value.filter(isItem);\n    const rest = value.filter((v) => !isItem(v));\n    const v2 = rest.filter((v) => isObj(v) && v.componentId === undefined && (\"_type\" in v || \"_key\" in v));\n    const inherited = items.length === 0 && v2.length === 0 && rest.length > 0;\n    return { items, inherited, unreadable: inherited ? 0 : rest.length };\n  }\n  return { items: isItem(value) ? [value] : [], inherited: false, unreadable: 0 };\n}\n\n/** Write a multiple slot: the items as they are (no `_key` the engine's list helpers add, which prod never stores). */\nexport function slotList(items: unknown[]): KitSlotItem[] {\n  return items.filter(isItem).map((it) => {\n    if (!(\"_key\" in it)) return it;\n    const { _key, ...rest } = it;\n    void _key;\n    return rest as KitSlotItem;\n  });\n}\n"],"mappings":";AA8FA,IAAM,SAAS,MAA6C,CAAC,CAAC,KAAK,OAAO,MAAM,YAAY,CAAC,MAAM,QAAQ,EAAE;AAC7G,IAAM,UAAU,MAAiC,MAAM,EAAE,IAAI,OAAO,EAAE,gBAAgB,YAAY,EAAE,gBAAgB;;;;;;AAOpH,SAAgB,SAAS,OAA6B;AACpD,KAAI,MAAM,QAAQ,MAAM,EAAE;EACxB,MAAM,QAAQ,MAAM,OAAO,OAAO;EAClC,MAAM,OAAO,MAAM,QAAQ,MAAM,CAAC,OAAO,EAAE,CAAC;EAC5C,MAAM,KAAK,KAAK,QAAQ,MAAM,MAAM,EAAE,IAAI,EAAE,gBAAgB,KAAA,MAAc,WAAW,KAAK,UAAU,GAAG;EACvG,MAAM,YAAY,MAAM,WAAW,KAAK,GAAG,WAAW,KAAK,KAAK,SAAS;AACzE,SAAO;GAAE;GAAO;GAAW,YAAY,YAAY,IAAI,KAAK;GAAQ;;AAEtE,QAAO;EAAE,OAAO,OAAO,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE;EAAE,WAAW;EAAO,YAAY;EAAG;;;AAIjF,SAAgB,SAAS,OAAiC;AACxD,QAAO,MAAM,OAAO,OAAO,CAAC,KAAK,OAAO;AACtC,MAAI,EAAE,UAAU,IAAK,QAAO;EAC5B,MAAM,EAAE,MAAM,GAAG,SAAS;AAE1B,SAAO;GACP"}

package/controls/slot.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 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.
+ */
+import * as React from "react";
+import type { ControlProps } from "../types";
+import { type KitSlotEntry } from "./slot-services";
+/** How many slots deep the control sits: the host's SlotChild editor sits inside a provider one level down. */
+export declare const SlotDepthContext: React.Context<number>;
+export declare function ComponentSlotControl({ field, value, onChange, readOnly, id, path }: ControlProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * 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.
+ */
+export declare function SlotPicker({ entries, loading, error, note, current, label, disabled, onPick, }: {
+    entries: KitSlotEntry[];
+    loading?: boolean;
+    error?: string;
+    note?: string;
+    current?: string;
+    label: string;
+    disabled?: boolean;
+    onPick: (componentId: string) => void;
+}): import("react/jsx-runtime").JSX.Element;

package/controls/slot.js

@@ -0,0 +1,348 @@
+import { cn } from "../lib/cn.js";
+import { KitIcon } from "../lib/icons.js";
+import { useKitServices } from "../context.js";
+import { Button } from "../ui/button.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../ui/overlay.js";
+import { RowList, useListOps } from "../engine/array.js";
+import { readSlot, slotList } from "./slot-services.js";
+import * as React from "react";
+import { IconPlus, IconSearch } from "@tabler/icons-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/kit/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} component${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 } = 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 component limit reached. A slot this deep would render as nothing, so it can’t hold more components 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 component" : name.title,
+				icon: entry?.icon ?? "box",
+				empty: false
+			},
+			extra: name.missing ? "Deleted, or not in this project. Replace or remove it." : entry?.category ?? `Component ${i + 1} of ${items.length}`
+		};
+	});
+	const picker = 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 component" : items.length ? "Replace component" : "Choose a component",
+		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 component instance" : `${read.unreadable} children here aren't component 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 component’s own content until a component 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 components yet. Add one to start composing." : "No component yet. Choose one to fill this slot.",
+					addButton: picker ?? /* @__PURE__ */ jsxs(SlotNote, { children: [
+						"No component 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 || "Components")));
+	const flat = cats.flatMap((c) => list.filter((b) => (b.category || "Components") === 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 components",
+						"aria-label": "Search components",
+						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": "Components",
+					"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 components…"
+						}) : 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 components match" : "This project has no components 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 || "Components") === 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 };
+
+//# sourceMappingURL=slot.js.map

package/controls/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","names":[],"sources":["../../src/kit/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} component${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 } = 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 component limit reached. A slot this deep would render as nothing, so it can&rsquo;t hold more components 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 component\" : name.title, icon: entry?.icon ?? \"box\", empty: false },\n      extra: name.missing ? \"Deleted, or not in this project. Replace or remove it.\" : (entry?.category ?? `Component ${i + 1} of ${items.length}`),\n    };\n  });\n\n  const picker = 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 component\" : items.length ? \"Replace component\" : \"Choose a component\"}\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 component instance\" : `${read.unreadable} children here aren't component 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 component&rsquo;s own content until a component 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 components yet. Add one to start composing.\" : \"No component yet. Choose one to fill this slot.\"}\n          addButton={picker ?? <SlotNote>No component 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 || \"Components\")));\n  const flat = cats.flatMap((c) => list.filter((b) => (b.category || \"Components\") === 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 components\"\n            aria-label=\"Search components\"\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=\"Components\" 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 components…\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 components match\" : \"This project has no components 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 || \"Components\") === 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/controls/table/index.d.ts

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

package/controls/table/index.js

@@ -0,0 +1,12 @@
+import { TableControl, TableFullScreenAction } from "./table.js";
+import { ACTIONS, CONTROLS } from "../../engine/kit-field.js";
+//#region src/kit/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/controls/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/kit/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"}