@bettercms-ai/kit 0.1.1 → 2.0.0-next.0

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["/**\n * @bettercms-ai/kit entry point (in-app: \"@/kit\"). Importing it loads kit.css, whose tokens apply only\n * inside [data-kit-scope].\n *\n * scale.ts, table.ts and lib/utils.ts each export their own `formatNumber`, so they are not re-exported\n * here: import them by path (\"@/kit/schema/scale\", \"@/kit/schema/table\", \"@/kit/lib/utils\").\n */\nimport \"./kit.css\";\nimport { registerKitControls } from \"./controls\";\n\nexport * from \"./schema/types\";\nexport * from \"./schema/sources\";\nexport * from \"./schema/help\";\nexport * from \"./schema/adapters\";\nexport { cn } from \"./lib/cn\";\nexport * from \"./ui\";\n\n/* the form engine, its runtime contexts, and the V2 ↔ prod schema and value adapters */\nexport * from \"./context\";\nexport type { ControlProps } from \"./types\";\nexport * from \"./engine/schema-form\";\nexport * from \"./engine/kit-field\";\nexport * from \"./engine/field-shell\";\nexport * from \"./engine/bits\";\nexport * from \"./engine/group-summary\";\n/* layout (grouping.tsx's FieldList takes `renderField`; the engine's FieldList is field-list's, drawing KitField) */\nexport {\n  RHYTHM, useRhythm, InsetScope, useInsetDepth, useGroupStatus, Appear, AnimatedFields, FieldSection, FieldInset, FieldUnit, FieldUnitRow,\n  isBreakpointName, BreakpointGroup, arrangeFields, defaultGroup, GroupTabs, FieldsetSection, isShort,\n  type GroupStatus, type RenderField, type GroupTabItem, type FieldSectionProps,\n} from \"./engine/grouping\";\nexport * from \"./engine/field-list\";\nexport * from \"./engine/array\";\nexport * from \"./engine/item-list\";\nexport * from \"./engine/slot\";\nexport {\n  FrameSlotsProvider, useFrameSlots, FrameView, frameContext, FrameHeader, HistoryView, parentOfField, parentTitleOf, frameDirection,\n  useFrameNavigation, FrameStage, type FrameFieldListProps, type FrameSlots,\n} from \"./engine/frame\";\nexport * from \"./engine/breadcrumb\";\nexport { resolveFrames, rootFrame, isDrillable, type Frame } from \"./lib/frames\";\nexport * from \"./adapters/schema\";\nexport * from \"./adapters/values\";\n/* the prod model's names (Fieldset, OpenMode, ScaleUnit, SelectOption) collide with the kit's own, so they live under `prod` */\nexport * as prod from \"./adapters/prod-types\";\nexport type { LossyFeature } from \"./adapters/lossy\";\n\n/* controls: each register file adds its types to the engine's dispatch tables (one import per lane file) */\nimport \"./controls/date-register\";\nimport \"./controls/icon-register\";\nimport \"./controls/code-register\";\nimport \"./controls/json-register\";\nimport \"./controls/location-register\";\nimport \"./controls/media-register\";\nimport \"./controls/reference-register\";\nimport \"./controls/form-picker-register\";\nimport \"./controls/slot-register\";\nimport \"./controls/rich-text\";\nimport \"./controls/table\";\n/* the ported controls: registered once here, so any host that loads the kit draws them instead of its legacy control.\n   Their helpers keep short names (str, toNum…), so they live under `controls`. */\nexport * as controls from \"./controls\";\nexport { registerKitControls };\nregisterKitControls();\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,oBAAoB"}

package/dist/kit.css

@@ -0,0 +1,75 @@
+/*
+ * @bettercms-ai/kit keyframes. Nothing else lives here.
+ *
+ * The V2 Block Kit tokens (every --kit-* role, light and dark) are declared once, in src/index.css's light
+ * and dark token blocks, where the dashboard's legacy role names alias them: one token home for the whole
+ * app. The kit's utility names (bg-kit-surface, text-kit-fg-3, rounded-kit-md, ...) are registered there
+ * too, by an "@theme inline reference" block. [data-kit-scope] is a marker: its V2 element defaults (body
+ * text, borders, headings, code mono) sit in index.css's base layer.
+ *
+ * Keyframe names are global, so each carries the kit- prefix. This sheet runs no Tailwind pass (a second
+ * utilities pass would re-emit .hidden and friends after the main sheet). Import it only from the kit entry
+ * point (src/kit/index.ts). src/kit/__tests__/kit-token-home.test.ts holds this file to keyframes only.
+ */
+
+@keyframes kit-fade-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+@keyframes kit-pop-in {
+  from { opacity: 0; transform: translateY(4px) scale(0.98); }
+  to { opacity: 1; transform: none; }
+}
+
+/* V2 slide-up (mobile flow modal sheet) */
+@keyframes kit-slide-up {
+  from { opacity: 0; transform: translateY(8px); }
+  to { opacity: 1; transform: none; }
+}
+
+/* V2 image editor enter (image-editor.tsx: opacity 0, y 8 → rest) */
+@keyframes kit-rise-in {
+  from { opacity: 0; transform: translateY(8px); }
+  to { opacity: 1; transform: none; }
+}
+
+/* V2 sheet-in-r / sheet-in-l (index.css), run by SheetContent on open */
+@keyframes kit-sheet-in-r {
+  from { transform: translateX(24px); opacity: 0; }
+  to { transform: none; opacity: 1; }
+}
+
+/* V2 floating inspector exit (editor.tsx inspector-float: x 16, opacity 0). Reduced motion is handled where it is
+   applied (FloatingInspector: skipped in JS, plus motion-reduce:animate-none). */
+@keyframes kit-sheet-out-r {
+  from { transform: none; opacity: 1; }
+  to { transform: translateX(16px); opacity: 0; }
+}
+
+@keyframes kit-sheet-in-l {
+  from { transform: translateX(-24px); opacity: 0; }
+  to { transform: none; opacity: 1; }
+}
+
+/* V2 TabletSheet (editor.tsx:491-513): the bottom sheet rises from y 100%, run by SheetContent side="bottom" */
+@keyframes kit-sheet-in-b {
+  from { transform: translateY(100%); }
+  to { transform: none; }
+}
+
+@keyframes kit-shimmer {
+  from { background-position: -400px 0; }
+  to { background-position: 400px 0; }
+}
+
+/* V2 shimmer-text (index.css:945): a 200%-wide text gradient sweeping right to left, looping seamlessly */
+@keyframes kit-shimmer-text {
+  from { background-position: 200% 0; }
+  to { background-position: -200% 0; }
+}
+
+@keyframes kit-pulse-dot {
+  0%, 100% { opacity: 1; transform: scale(1); }
+  50% { opacity: 0.45; transform: scale(0.85); }
+}

package/dist/lib/cn.d.ts

@@ -0,0 +1,4 @@
+import { type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+export declare function cn(...inputs: ClassValue[]): string;
+export { twMerge };

package/dist/lib/cn.js

@@ -0,0 +1,56 @@
+import { clsx } from "clsx";
+import { extendTailwindMerge, twMerge } from "tailwind-merge";
+//#region src/lib/cn.ts
+/** Merge Tailwind classes; our custom text sizes (2xs..3xl) are registered so twMerge
+*  doesn't confuse `text-sm` (size) with `text-fg-2` (color). */
+var merge = extendTailwindMerge({ extend: { classGroups: {
+	"font-size": [{ text: [
+		"2xs",
+		"xs",
+		"sm",
+		"base",
+		"md",
+		"lg",
+		"xl",
+		"2xl",
+		"3xl",
+		"kit-2xs",
+		"kit-xs",
+		"kit-sm",
+		"kit-base",
+		"kit-md",
+		"kit-lg",
+		"kit-xl",
+		"kit-2xl",
+		"kit-3xl"
+	] }],
+	shadow: [{ shadow: [
+		"kit-xs",
+		"kit-sm",
+		"kit-md",
+		"kit-lg",
+		"kit-xl",
+		"kit-canvas-frame",
+		"kit-device",
+		"kit-field",
+		"kit-ring-field",
+		"kit-button-primary",
+		"kit-sheet-r",
+		"kit-sheet-b"
+	] }],
+	rounded: [{ rounded: [
+		"kit-xs",
+		"kit-sm",
+		"kit-md",
+		"kit-lg",
+		"kit-xl",
+		"kit-2xl"
+	] }]
+} } });
+function cn(...inputs) {
+	return merge(clsx(inputs));
+}
+//#endregion
+export { cn, twMerge };
+
+//# sourceMappingURL=cn.js.map

package/dist/lib/cn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.js","names":[],"sources":["../../src/lib/cn.ts"],"sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/** Merge Tailwind classes; our custom text sizes (2xs..3xl) are registered so twMerge\n *  doesn't confuse `text-sm` (size) with `text-fg-2` (color). */\nimport { extendTailwindMerge } from \"tailwind-merge\";\nconst merge = extendTailwindMerge({\n  extend: {\n    classGroups: {\n      \"font-size\": [{ text: [\"2xs\", \"xs\", \"sm\", \"base\", \"md\", \"lg\", \"xl\", \"2xl\", \"3xl\", \"kit-2xs\", \"kit-xs\", \"kit-sm\", \"kit-base\", \"kit-md\", \"kit-lg\", \"kit-xl\", \"kit-2xl\", \"kit-3xl\"] }],\n      // Kit shadow and radius tokens (src/kit/kit.css @theme, namespaced \"kit-\"). Without this twMerge reads\n      // `shadow-kit-md` as a shadow COLOUR and keeps it next to `shadow-none`, so a variant could no longer\n      // override the base shadow; `rounded-kit-md` would not conflict with `rounded-none` either.\n      shadow: [{ shadow: [\"kit-xs\", \"kit-sm\", \"kit-md\", \"kit-lg\", \"kit-xl\", \"kit-canvas-frame\", \"kit-device\", \"kit-field\", \"kit-ring-field\", \"kit-button-primary\", \"kit-sheet-r\", \"kit-sheet-b\"] }],\n      rounded: [{ rounded: [\"kit-xs\", \"kit-sm\", \"kit-md\", \"kit-lg\", \"kit-xl\", \"kit-2xl\"] }],\n    },\n  },\n});\nexport function cn(...inputs: ClassValue[]) {\n  return merge(clsx(inputs));\n}\nexport { twMerge };\n"],"mappings":";;;;;AAMA,IAAM,QAAQ,oBAAoB,EAChC,QAAQ,EACN,aAAa;CACX,aAAa,CAAC,EAAE,MAAM;EAAC;EAAO;EAAM;EAAM;EAAQ;EAAM;EAAM;EAAM;EAAO;EAAO;EAAW;EAAU;EAAU;EAAY;EAAU;EAAU;EAAU;EAAW;CAAS,EAAE,CAAC;CAIlL,QAAQ,CAAC,EAAE,QAAQ;EAAC;EAAU;EAAU;EAAU;EAAU;EAAU;EAAoB;EAAc;EAAa;EAAkB;EAAsB;EAAe;CAAa,EAAE,CAAC;CAC5L,SAAS,CAAC,EAAE,SAAS;EAAC;EAAU;EAAU;EAAU;EAAU;EAAU;CAAS,EAAE,CAAC;AACtF,EACF,EACF,CAAC;AACD,SAAgB,GAAG,GAAG,QAAsB;CAC1C,OAAO,MAAM,KAAK,MAAM,CAAC;AAC3B"}

package/dist/lib/columns.d.ts

@@ -0,0 +1,14 @@
+/**
+ * COLUMNS (CPO D63; V2 HEAD c896beb kit/lib/columns.ts) — the one rule for putting fields side by side, shared by every
+ * host (sections, insets, array rows). Pure, no React.
+ *
+ * A field may sit in a column only when its value is genuinely short. The layout also needs room: `FieldRun` turns two-up
+ * only when the form is at least 420px wide (a container query), so the 300 to 380px inspector is always one column.
+ */
+import type { FieldSchema } from "../schema/types";
+/** Text longer than this never sits in a column. */
+export declare const SHORT_TEXT_MAX = 24;
+/** Long text, rich text, lists, media, links, references, buttons, tables and objects are always full width. */
+export declare function isColumnField(f: FieldSchema): boolean;
+/** Pairs neighbouring column fields; a column field with no short neighbour spans the full row. true = half width. */
+export declare function columnSpans(fields: FieldSchema[]): boolean[];

package/dist/lib/columns.js

@@ -0,0 +1,30 @@
+//#region src/lib/columns.ts
+/** Text longer than this never sits in a column. */
+var SHORT_TEXT_MAX = 24;
+/** Long text, rich text, lists, media, links, references, buttons, tables and objects are always full width. */
+function isColumnField(f) {
+	switch (f.type) {
+		case "number": return !f.scale && f.layout !== "slider";
+		case "boolean":
+		case "date":
+		case "color":
+		case "icon":
+		case "rating": return true;
+		case "select": return f.layout !== "cards" && f.layout !== "radio";
+		case "string": return (f.validation?.max ?? Infinity) <= 24;
+		default: return false;
+	}
+}
+/** Pairs neighbouring column fields; a column field with no short neighbour spans the full row. true = half width. */
+function columnSpans(fields) {
+	const out = fields.map(() => false);
+	for (let i = 0; i < fields.length - 1; i++) if (isColumnField(fields[i]) && isColumnField(fields[i + 1])) {
+		out[i] = out[i + 1] = true;
+		i++;
+	}
+	return out;
+}
+//#endregion
+export { SHORT_TEXT_MAX, columnSpans, isColumnField };
+
+//# sourceMappingURL=columns.js.map

package/dist/lib/columns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"columns.js","names":[],"sources":["../../src/lib/columns.ts"],"sourcesContent":["/**\n * COLUMNS (CPO D63; V2 HEAD c896beb kit/lib/columns.ts) — the one rule for putting fields side by side, shared by every\n * host (sections, insets, array rows). Pure, no React.\n *\n * A field may sit in a column only when its value is genuinely short. The layout also needs room: `FieldRun` turns two-up\n * only when the form is at least 420px wide (a container query), so the 300 to 380px inspector is always one column.\n */\nimport type { FieldSchema } from \"../schema/types\";\n\n/** Text longer than this never sits in a column. */\nexport const SHORT_TEXT_MAX = 24;\n\n/** Long text, rich text, lists, media, links, references, buttons, tables and objects are always full width. */\nexport function isColumnField(f: FieldSchema): boolean {\n  switch (f.type) {\n    case \"number\":\n      return !f.scale && f.layout !== \"slider\"; // a scale needs the full row (D41)\n    case \"boolean\": case \"date\": case \"color\": case \"icon\": case \"rating\":\n      return true;\n    case \"select\":\n      return f.layout !== \"cards\" && f.layout !== \"radio\";\n    case \"string\":\n      return (f.validation?.max ?? Infinity) <= SHORT_TEXT_MAX;\n    default:\n      return false;\n  }\n}\n/** Pairs neighbouring column fields; a column field with no short neighbour spans the full row. true = half width. */\nexport function columnSpans(fields: FieldSchema[]): boolean[] {\n  const out = fields.map(() => false);\n  for (let i = 0; i < fields.length - 1; i++) {\n    if (isColumnField(fields[i]) && isColumnField(fields[i + 1])) {\n      out[i] = out[i + 1] = true;\n      i++;\n    }\n  }\n  return out;\n}\n"],"mappings":";;AAUA,IAAa,iBAAiB;;AAG9B,SAAgB,cAAc,GAAyB;CACrD,QAAQ,EAAE,MAAV;EACE,KAAK,UACH,OAAO,CAAC,EAAE,SAAS,EAAE,WAAW;EAClC,KAAK;EAAW,KAAK;EAAQ,KAAK;EAAS,KAAK;EAAQ,KAAK,UAC3D,OAAO;EACT,KAAK,UACH,OAAO,EAAE,WAAW,WAAW,EAAE,WAAW;EAC9C,KAAK,UACH,QAAQ,EAAE,YAAY,OAAO,aAAA;EAC/B,SACE,OAAO;CACX;AACF;;AAEA,SAAgB,YAAY,QAAkC;CAC5D,MAAM,MAAM,OAAO,UAAU,KAAK;CAClC,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,SAAS,GAAG,KACrC,IAAI,cAAc,OAAO,EAAE,KAAK,cAAc,OAAO,IAAI,EAAE,GAAG;EAC5D,IAAI,KAAK,IAAI,IAAI,KAAK;EACtB;CACF;CAEF,OAAO;AACT"}

package/dist/lib/frames.d.ts

@@ -0,0 +1,36 @@
+/**
+ * NAVIGATION MODEL — a path resolves to a STACK OF FRAMES (one per breadcrumb). The last frame is what the
+ * panel shows. Drillable nodes: object fields (drill mode), array items, slot children (blocks), button fields
+ * (the one button screen) and "@history" (a field's versions as a stacked panel).
+ */
+import { type Crumb, type FieldGroup, type FieldPath, type FieldSchema, type Fieldset, type TypeSchema } from "../schema/types";
+export interface Frame {
+    path: FieldPath;
+    kind: Crumb["kind"];
+    title: string;
+    icon?: string;
+    fields: FieldSchema[];
+    fieldsets?: Fieldset[];
+    groups?: FieldGroup[];
+    /** the field that owns this frame (object / array / slot / button / history target) */
+    field?: FieldSchema;
+    /** array items and slot children */
+    item?: {
+        arrayPath: FieldPath;
+        index: number;
+        count: number;
+        itemSchema?: FieldSchema;
+        block?: TypeSchema;
+        slotField?: FieldSchema;
+        /** the title of sibling `i` (table rows and columns, whose items have no schema to preview) */
+        titleAt?: (i: number) => string;
+    };
+}
+export declare function rootFrame(schema: TypeSchema): Frame;
+/** Resolve `path` into frames. Stops at the first segment that doesn't resolve (returns the valid prefix). */
+export declare function resolveFrames(schema: TypeSchema, value: unknown, path: FieldPath, resolveSchema?: (t: string) => TypeSchema | undefined): {
+    frames: Frame[];
+    path: FieldPath;
+};
+/** Can this field be opened as its own frame (drill target)? */
+export declare const isDrillable: (f: FieldSchema) => boolean;

package/dist/lib/frames.js

@@ -0,0 +1,214 @@
+import { cellText, isTableValue, normalizeTable } from "../schema/table.js";
+import { getIn, isObj } from "./path.js";
+import { isPrimitive, itemSchemaFor, previewOf } from "./schema.js";
+import { HISTORY_SEGMENT } from "../schema/types.js";
+//#region src/lib/frames.ts
+/**
+* NAVIGATION MODEL — a path resolves to a STACK OF FRAMES (one per breadcrumb). The last frame is what the
+* panel shows. Drillable nodes: object fields (drill mode), array items, slot children (blocks), button fields
+* (the one button screen) and "@history" (a field's versions as a stacked panel).
+*/
+function rootFrame(schema) {
+	return {
+		path: [],
+		kind: "root",
+		title: schema.title,
+		icon: schema.icon,
+		fields: schema.fields,
+		fieldsets: schema.fieldsets,
+		groups: schema.groups
+	};
+}
+/** Resolve `path` into frames. Stops at the first segment that doesn't resolve (returns the valid prefix). */
+function resolveFrames(schema, value, path, resolveSchema) {
+	const frames = [rootFrame(schema)];
+	let fields = schema.fields;
+	let i = 0;
+	while (i < path.length) {
+		const seg = path[i];
+		if (typeof seg !== "string") break;
+		const f = fields.find((x) => x.name === seg);
+		if (!f) break;
+		const here = path.slice(0, i + 1);
+		if (path[i + 1] === "@history") {
+			frames.push({
+				path: [...here, HISTORY_SEGMENT],
+				kind: "history",
+				title: "History",
+				icon: "clock",
+				fields: [f],
+				field: f
+			});
+			i += 2;
+			break;
+		}
+		if (f.type === "object" && f.fields) {
+			frames.push({
+				path: here,
+				kind: "object",
+				title: f.title,
+				icon: f.icon,
+				fields: f.fields,
+				field: f
+			});
+			fields = f.fields;
+			i += 1;
+			continue;
+		}
+		if (f.type === "button") {
+			frames.push({
+				path: here,
+				kind: "button",
+				title: f.title,
+				icon: "click",
+				fields: [f],
+				field: f
+			});
+			i += 1;
+			if (path[i] === "@history") {
+				frames.push({
+					path: [...here, HISTORY_SEGMENT],
+					kind: "history",
+					title: "History",
+					icon: "clock",
+					fields: [f],
+					field: f
+				});
+				i += 1;
+			}
+			break;
+		}
+		if (f.type === "table" && (path[i + 1] === "rows" || path[i + 1] === "columns") && typeof path[i + 2] === "number") {
+			const raw = getIn(value, here);
+			if (!isTableValue(raw)) break;
+			const t = normalizeTable(raw);
+			const idx = path[i + 2];
+			const arrayPath = [...here, path[i + 1]];
+			if (path[i + 1] === "rows") {
+				const row = t.rows[idx];
+				if (!row) break;
+				const group = row.group && !row.footer ? t.rowGroups?.find((g) => g._key === row.group) : void 0;
+				if (group) frames.push({
+					path: here,
+					kind: "tableGroup",
+					title: group.label || "Untitled group",
+					icon: "folder",
+					fields: [],
+					field: f
+				});
+				const first = t.columns[0];
+				const titleAt = (j) => {
+					const r = t.rows[j];
+					return r && first && cellText(first, r, r.cells[first._key]) || "Untitled row";
+				};
+				frames.push({
+					path: [...arrayPath, idx],
+					kind: "tableRow",
+					title: titleAt(idx),
+					icon: "list",
+					fields: [],
+					field: f,
+					item: {
+						arrayPath,
+						index: idx,
+						count: t.rows.length,
+						itemSchema: {
+							name: "row",
+							title: "Row",
+							type: "object"
+						},
+						titleAt
+					}
+				});
+			} else {
+				if (!t.columns[idx]) break;
+				const titleAt = (j) => t.columns[j]?.label || "Untitled column";
+				frames.push({
+					path: [...arrayPath, idx],
+					kind: "tableColumn",
+					title: titleAt(idx),
+					icon: "layout-columns",
+					fields: [],
+					field: f,
+					item: {
+						arrayPath,
+						index: idx,
+						count: t.columns.length,
+						itemSchema: {
+							name: "column",
+							title: "Column",
+							type: "object"
+						},
+						titleAt
+					}
+				});
+			}
+			i += 3;
+			break;
+		}
+		if ((f.type === "array" || f.type === "slot") && typeof path[i + 1] === "number") {
+			const idx = path[i + 1];
+			const list = getIn(value, here);
+			const items = Array.isArray(list) ? list : [];
+			const item = items[idx];
+			if (item === void 0) break;
+			const itemPath = [...here, idx];
+			if (f.type === "array") {
+				const s = itemSchemaFor(f, item);
+				if (!s || isPrimitive(s.type) || !s.fields) break;
+				const pv = previewOf(s, item, idx);
+				frames.push({
+					path: itemPath,
+					kind: "item",
+					title: pv.title,
+					icon: s.icon ?? f.icon,
+					fields: s.fields,
+					field: f,
+					item: {
+						arrayPath: here,
+						index: idx,
+						count: items.length,
+						itemSchema: s
+					}
+				});
+				fields = s.fields;
+			} else {
+				const type = isObj(item) && typeof item._type === "string" ? item._type : "";
+				const block = resolveSchema?.(type);
+				if (!block) break;
+				const pv = previewOf(block, item, idx, block.title);
+				frames.push({
+					path: itemPath,
+					kind: "block",
+					title: pv.empty ? block.title : pv.title,
+					icon: block.icon,
+					fields: block.fields,
+					fieldsets: block.fieldsets,
+					groups: block.groups,
+					field: f,
+					item: {
+						arrayPath: here,
+						index: idx,
+						count: items.length,
+						block,
+						slotField: f
+					}
+				});
+				fields = block.fields;
+			}
+			i += 2;
+			continue;
+		}
+		break;
+	}
+	return {
+		frames,
+		path: frames.length > 1 ? frames[frames.length - 1].path : []
+	};
+}
+/** Can this field be opened as its own frame (drill target)? */
+var isDrillable = (f) => f.type === "object" || f.type === "button";
+//#endregion
+export { isDrillable, resolveFrames, rootFrame };
+
+//# sourceMappingURL=frames.js.map

package/dist/lib/frames.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frames.js","names":[],"sources":["../../src/lib/frames.ts"],"sourcesContent":["/**\n * NAVIGATION MODEL — a path resolves to a STACK OF FRAMES (one per breadcrumb). The last frame is what the\n * panel shows. Drillable nodes: object fields (drill mode), array items, slot children (blocks), button fields\n * (the one button screen) and \"@history\" (a field's versions as a stacked panel).\n */\nimport { HISTORY_SEGMENT, type Crumb, type FieldGroup, type FieldPath, type FieldSchema, type Fieldset, type TypeSchema } from \"../schema/types\";\nimport { cellText, isTableValue, normalizeTable } from \"../schema/table\";\nimport { getIn, isObj } from \"./path\";\nimport { isPrimitive, itemSchemaFor, previewOf } from \"./schema\";\n\nexport interface Frame {\n  path: FieldPath;\n  kind: Crumb[\"kind\"];\n  title: string;\n  icon?: string;\n  fields: FieldSchema[];\n  fieldsets?: Fieldset[];\n  groups?: FieldGroup[];\n  /** the field that owns this frame (object / array / slot / button / history target) */\n  field?: FieldSchema;\n  /** array items and slot children */\n  item?: {\n    arrayPath: FieldPath;\n    index: number;\n    count: number;\n    itemSchema?: FieldSchema;\n    block?: TypeSchema;\n    slotField?: FieldSchema;\n    /** the title of sibling `i` (table rows and columns, whose items have no schema to preview) */\n    titleAt?: (i: number) => string;\n  };\n}\n\nexport function rootFrame(schema: TypeSchema): Frame {\n  return { path: [], kind: \"root\", title: schema.title, icon: schema.icon, fields: schema.fields, fieldsets: schema.fieldsets, groups: schema.groups };\n}\n\n/** Resolve `path` into frames. Stops at the first segment that doesn't resolve (returns the valid prefix). */\nexport function resolveFrames(\n  schema: TypeSchema,\n  value: unknown,\n  path: FieldPath,\n  resolveSchema?: (t: string) => TypeSchema | undefined,\n): { frames: Frame[]; path: FieldPath } {\n  const frames: Frame[] = [rootFrame(schema)];\n  let fields = schema.fields;\n  let i = 0;\n  while (i < path.length) {\n    const seg = path[i];\n    if (typeof seg !== \"string\") break;\n    const f = fields.find((x) => x.name === seg);\n    if (!f) break;\n    const here = path.slice(0, i + 1);\n    if (path[i + 1] === HISTORY_SEGMENT) {\n      frames.push({ path: [...here, HISTORY_SEGMENT], kind: \"history\", title: \"History\", icon: \"clock\", fields: [f], field: f });\n      i += 2;\n      break;\n    }\n    if (f.type === \"object\" && f.fields) {\n      frames.push({ path: here, kind: \"object\", title: f.title, icon: f.icon, fields: f.fields, field: f });\n      fields = f.fields;\n      i += 1;\n      continue;\n    }\n    if (f.type === \"button\") {\n      frames.push({ path: here, kind: \"button\", title: f.title, icon: \"click\", fields: [f], field: f });\n      i += 1;\n      // a button screen is a leaf, except for its own history\n      if (path[i] === HISTORY_SEGMENT) {\n        frames.push({ path: [...here, HISTORY_SEGMENT], kind: \"history\", title: \"History\", icon: \"clock\", fields: [f], field: f });\n        i += 1;\n      }\n      break;\n    }\n    /* D50: a table's rows and columns drill like array items. A row inside a row group gets the group as a crumb\n       (its path is the table field, which resolves back to the frame that shows the table). */\n    if (f.type === \"table\" && (path[i + 1] === \"rows\" || path[i + 1] === \"columns\") && typeof path[i + 2] === \"number\") {\n      const raw = getIn(value, here);\n      if (!isTableValue(raw)) break;\n      const t = normalizeTable(raw);\n      const idx = path[i + 2] as number;\n      const arrayPath = [...here, path[i + 1]];\n      if (path[i + 1] === \"rows\") {\n        const row = t.rows[idx];\n        if (!row) break;\n        const group = row.group && !row.footer ? t.rowGroups?.find((g) => g._key === row.group) : undefined;\n        if (group) frames.push({ path: here, kind: \"tableGroup\", title: group.label || \"Untitled group\", icon: \"folder\", fields: [], field: f });\n        const first = t.columns[0];\n        const titleAt = (j: number) => {\n          const r = t.rows[j];\n          return (r && first && cellText(first, r, r.cells[first._key])) || \"Untitled row\";\n        };\n        frames.push({\n          path: [...arrayPath, idx], kind: \"tableRow\", title: titleAt(idx), icon: \"list\", fields: [], field: f,\n          item: { arrayPath, index: idx, count: t.rows.length, itemSchema: { name: \"row\", title: \"Row\", type: \"object\" }, titleAt },\n        });\n      } else {\n        const col = t.columns[idx];\n        if (!col) break;\n        const titleAt = (j: number) => t.columns[j]?.label || \"Untitled column\";\n        frames.push({\n          path: [...arrayPath, idx], kind: \"tableColumn\", title: titleAt(idx), icon: \"layout-columns\", fields: [], field: f,\n          item: { arrayPath, index: idx, count: t.columns.length, itemSchema: { name: \"column\", title: \"Column\", type: \"object\" }, titleAt },\n        });\n      }\n      i += 3;\n      break;\n    }\n    if ((f.type === \"array\" || f.type === \"slot\") && typeof path[i + 1] === \"number\") {\n      const idx = path[i + 1] as number;\n      const list = getIn(value, here);\n      const items = Array.isArray(list) ? list : [];\n      const item = items[idx];\n      if (item === undefined) break;\n      const itemPath = [...here, idx];\n      if (f.type === \"array\") {\n        const s = itemSchemaFor(f, item);\n        if (!s || isPrimitive(s.type) || !s.fields) break;\n        const pv = previewOf(s, item, idx);\n        frames.push({\n          path: itemPath, kind: \"item\", title: pv.title, icon: s.icon ?? f.icon, fields: s.fields, field: f,\n          item: { arrayPath: here, index: idx, count: items.length, itemSchema: s },\n        });\n        fields = s.fields;\n      } else {\n        const type = isObj(item) && typeof item._type === \"string\" ? item._type : \"\";\n        const block = resolveSchema?.(type);\n        if (!block) break;\n        const pv = previewOf(block, item, idx, block.title);\n        frames.push({\n          path: itemPath, kind: \"block\", title: pv.empty ? block.title : pv.title, icon: block.icon, fields: block.fields,\n          fieldsets: block.fieldsets, groups: block.groups, field: f,\n          item: { arrayPath: here, index: idx, count: items.length, block, slotField: f },\n        });\n        fields = block.fields;\n      }\n      i += 2;\n      continue;\n    }\n    break;\n  }\n  return { frames, path: frames.length > 1 ? frames[frames.length - 1].path : [] };\n}\n\n/** Can this field be opened as its own frame (drill target)? */\nexport const isDrillable = (f: FieldSchema) => f.type === \"object\" || f.type === \"button\";\n"],"mappings":"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"}

package/dist/lib/icon-image.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Is this image field an ICON? The image control draws one 32px row for it instead of a picture card, the field shell
+ * gives it no second label, and the field lists gather two or more into one "Icons" group. One rule for all three, so
+ * they never disagree.
+ *
+ * Only `svgOnly`, which the schema adapter sets from the import's `media: "icon"` stamp (and nothing else sets). An SVG
+ * alone is not an icon: a site's SVG logo keeps its picture, alt text and details.
+ */
+import type { FieldSchema } from "../schema/types";
+export declare function isIconImage(field: FieldSchema, _value?: unknown): boolean;

package/dist/lib/icon-image.js

@@ -0,0 +1,8 @@
+//#region src/lib/icon-image.ts
+function isIconImage(field, _value) {
+	return field.type === "image" && field.svgOnly === true;
+}
+//#endregion
+export { isIconImage };
+
+//# sourceMappingURL=icon-image.js.map

package/dist/lib/icon-image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-image.js","names":[],"sources":["../../src/lib/icon-image.ts"],"sourcesContent":["/**\n * Is this image field an ICON? The image control draws one 32px row for it instead of a picture card, the field shell\n * gives it no second label, and the field lists gather two or more into one \"Icons\" group. One rule for all three, so\n * they never disagree.\n *\n * Only `svgOnly`, which the schema adapter sets from the import's `media: \"icon\"` stamp (and nothing else sets). An SVG\n * alone is not an icon: a site's SVG logo keeps its picture, alt text and details.\n */\nimport type { FieldSchema } from \"../schema/types\";\n\nexport function isIconImage(field: FieldSchema, _value?: unknown): boolean {\n  return field.type === \"image\" && field.svgOnly === true;\n}\n"],"mappings":";AAUA,SAAgB,YAAY,OAAoB,QAA2B;CACzE,OAAO,MAAM,SAAS,WAAW,MAAM,YAAY;AACrD"}

package/dist/lib/icons.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Icon names in schemas are kebab-case Tabler names ("help-circle", "layout-grid"). Catalog data still
+ * carries lucide-style names ("CircleHelp", "LayoutGrid"); `kitIcon()` resolves both.
+ * The curated set doubles as the icon picker's library (explicit imports keep the bundle small).
+ */
+import { type Icon } from "@tabler/icons-react";
+export declare const KIT_ICONS: Record<string, Icon>;
+export declare function iconKey(name?: string): string | undefined;
+/** Render a schema icon by name. Falls back to `fallback` (default: a neutral square). */
+export declare function KitIcon({ name, className, fallback }: {
+    name?: string;
+    className?: string;
+    fallback?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/** Human label for an icon key: "help-circle" → "Help circle". */
+export declare const iconLabel: (k: string) => string;