@bettercms-ai/kit 1.0.0 → 2.0.0-next.1

package/dist/table/table-view.js

@@ -0,0 +1,140 @@
+import { cellText, normalizeTable, renderTableHtml, tableJsonLd } from "../schema/table.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import "./table.css";
+//#region src/table/table-view.tsx
+/**
+* <TableView> — the live-page face of the ONE table renderer (CPO D42). It renders `renderTableHtml()` (the same
+* semantic HTML stored in rich text and written to published pages) and adds the visitor tools a static page can't:
+* sort buttons in sortable headers (aria-sort) and a filter box (live row count for screen readers). JSON-LD, when the
+* editor opted in, is written next to the table.
+*/
+function TableView({ value, resolveRef, interactive = true, jsonLd = true, url, className, idScope }) {
+	const uid = React.useId().replace(/[^\w-]/g, "");
+	const scope = (idScope ?? uid).replace(/[^\w-]/g, "");
+	const t = React.useMemo(() => {
+		const n = normalizeTable(value);
+		return {
+			...n,
+			id: `${n.id}-${scope}`
+		};
+	}, [value, scope]);
+	const [sort, setSort] = React.useState(null);
+	const [query, setQuery] = React.useState("");
+	const filterId = React.useId();
+	const visible = React.useMemo(() => {
+		const q = query.trim().toLowerCase();
+		if (!q) return void 0;
+		return new Set(t.rows.filter((r) => t.columns.some((c) => cellText(c, r, r.cells[c._key], resolveRef).toLowerCase().includes(q))).map((r) => r._key));
+	}, [
+		query,
+		t,
+		resolveRef
+	]);
+	const html = React.useMemo(() => renderTableHtml(t, {
+		resolveRef,
+		interactive,
+		sort: interactive ? sort : null,
+		visibleRows: visible,
+		marks: false
+	}), [
+		t,
+		resolveRef,
+		interactive,
+		sort,
+		visible
+	]);
+	const ld = React.useMemo(() => jsonLd ? tableJsonLd(t, {
+		url,
+		resolveRef
+	}) : null, [
+		jsonLd,
+		t,
+		url,
+		resolveRef
+	]);
+	const onClick = (e) => {
+		const b = e.target.closest("button.bt-sort");
+		if (!b) return;
+		const key = b.dataset.sortKey;
+		e.stopPropagation();
+		setSort((s) => s?.key !== key ? {
+			key,
+			dir: 1
+		} : s.dir === 1 ? {
+			key,
+			dir: -1
+		} : null);
+		refocus.current = key;
+	};
+	const refocus = React.useRef(null);
+	const host = React.useRef(null);
+	React.useLayoutEffect(() => {
+		const key = refocus.current;
+		if (!key) return;
+		refocus.current = null;
+		host.current?.querySelector(`button.bt-sort[data-sort-key="${CSS.escape(key)}"]`)?.focus({ preventScroll: true });
+	});
+	const shown = visible ? visible.size : t.rows.length;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: host,
+		className,
+		onClick: interactive ? onClick : void 0,
+		children: [
+			interactive && t.filterable ? /* @__PURE__ */ jsxs("div", {
+				className: "bt-filter",
+				children: [
+					/* @__PURE__ */ jsxs("label", {
+						htmlFor: filterId,
+						className: "bt-sr",
+						style: {
+							position: "absolute",
+							width: 1,
+							height: 1,
+							overflow: "hidden",
+							clip: "rect(0 0 0 0)"
+						},
+						children: ["Filter ", t.caption || "table"]
+					}),
+					/* @__PURE__ */ jsx("input", {
+						id: filterId,
+						type: "search",
+						placeholder: "Filter rows…",
+						value: query,
+						onChange: (e) => setQuery(e.target.value),
+						"aria-controls": `${t.id}-caption`
+					}),
+					/* @__PURE__ */ jsx("span", {
+						role: "status",
+						"aria-live": "polite",
+						style: {
+							position: "absolute",
+							width: 1,
+							height: 1,
+							overflow: "hidden",
+							clip: "rect(0 0 0 0)"
+						},
+						children: query ? `${shown} of ${t.rows.length} rows` : ""
+					})
+				]
+			}) : null,
+			/* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: html } }),
+			interactive && visible && !visible.size ? /* @__PURE__ */ jsxs("p", {
+				className: "bt-empty-filter",
+				children: [
+					"No rows match “",
+					query,
+					"”."
+				]
+			}) : null,
+			ld ? /* @__PURE__ */ jsx("script", {
+				type: "application/ld+json",
+				dangerouslySetInnerHTML: { __html: JSON.stringify(ld).replace(/</g, "\\u003c") }
+			}) : null
+		]
+	});
+}
+//#endregion
+export { TableView };
+
+//# sourceMappingURL=table-view.js.map

package/dist/table/table-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-view.js","names":[],"sources":["../../src/table/table-view.tsx"],"sourcesContent":["/**\n * <TableView> — the live-page face of the ONE table renderer (CPO D42). It renders `renderTableHtml()` (the same\n * semantic HTML stored in rich text and written to published pages) and adds the visitor tools a static page can't:\n * sort buttons in sortable headers (aria-sort) and a filter box (live row count for screen readers). JSON-LD, when the\n * editor opted in, is written next to the table.\n */\nimport * as React from \"react\";\nimport { cellText, normalizeTable, renderTableHtml, tableJsonLd, type RefResolver, type TableValue } from \"../schema/table\";\nimport \"./table.css\";\n\nexport interface TableViewProps {\n  value: TableValue | null | undefined;\n  resolveRef?: RefResolver;\n  /** Visitor tools (sort, filter). Off in thumbnails and editors. Default true. */\n  interactive?: boolean;\n  /** Write the table's JSON-LD (opt-in on the table). Default true. */\n  jsonLd?: boolean;\n  url?: string;\n  className?: string;\n  /** Makes element ids unique when the same table renders twice on one page (block id). Default: a React id. */\n  idScope?: string;\n}\n\nexport function TableView({ value, resolveRef, interactive = true, jsonLd = true, url, className, idScope }: TableViewProps) {\n  const uid = React.useId().replace(/[^\\w-]/g, \"\");\n  const scope = (idScope ?? uid).replace(/[^\\w-]/g, \"\");\n  const t = React.useMemo(() => {\n    const n = normalizeTable(value);\n    return { ...n, id: `${n.id}-${scope}` };\n  }, [value, scope]);\n  const [sort, setSort] = React.useState<{ key: string; dir: 1 | -1 } | null>(null);\n  const [query, setQuery] = React.useState(\"\");\n  const filterId = React.useId();\n  const visible = React.useMemo(() => {\n    const q = query.trim().toLowerCase();\n    if (!q) return undefined;\n    return new Set(t.rows.filter((r) => t.columns.some((c) => cellText(c, r, r.cells[c._key], resolveRef).toLowerCase().includes(q))).map((r) => r._key));\n  }, [query, t, resolveRef]);\n  const html = React.useMemo(\n    () => renderTableHtml(t, { resolveRef, interactive, sort: interactive ? sort : null, visibleRows: visible, marks: false }),\n    [t, resolveRef, interactive, sort, visible],\n  );\n  const ld = React.useMemo(() => (jsonLd ? tableJsonLd(t, { url, resolveRef }) : null), [jsonLd, t, url, resolveRef]);\n  const onClick = (e: React.MouseEvent) => {\n    const b = (e.target as HTMLElement).closest<HTMLButtonElement>(\"button.bt-sort\");\n    if (!b) return;\n    const key = b.dataset.sortKey!;\n    e.stopPropagation();\n    setSort((s) => (s?.key !== key ? { key, dir: 1 } : s.dir === 1 ? { key, dir: -1 } : null));\n    refocus.current = key; // the header HTML is rewritten; keep focus on the same sort button\n  };\n  const refocus = React.useRef<string | null>(null);\n  const host = React.useRef<HTMLDivElement>(null);\n  React.useLayoutEffect(() => {\n    const key = refocus.current;\n    if (!key) return;\n    refocus.current = null;\n    host.current?.querySelector<HTMLButtonElement>(`button.bt-sort[data-sort-key=\"${CSS.escape(key)}\"]`)?.focus({ preventScroll: true });\n  });\n  const shown = visible ? visible.size : t.rows.length;\n  return (\n    <div ref={host} className={className} onClick={interactive ? onClick : undefined}>\n      {interactive && t.filterable ? (\n        <div className=\"bt-filter\">\n          <label htmlFor={filterId} className=\"bt-sr\" style={{ position: \"absolute\", width: 1, height: 1, overflow: \"hidden\", clip: \"rect(0 0 0 0)\" }}>\n            Filter {t.caption || \"table\"}\n          </label>\n          <input id={filterId} type=\"search\" placeholder=\"Filter rows…\" value={query} onChange={(e) => setQuery(e.target.value)} aria-controls={`${t.id}-caption`} />\n          <span role=\"status\" aria-live=\"polite\" style={{ position: \"absolute\", width: 1, height: 1, overflow: \"hidden\", clip: \"rect(0 0 0 0)\" }}>\n            {query ? `${shown} of ${t.rows.length} rows` : \"\"}\n          </span>\n        </div>\n      ) : null}\n      <div dangerouslySetInnerHTML={{ __html: html }} />\n      {interactive && visible && !visible.size ? <p className=\"bt-empty-filter\">No rows match “{query}”.</p> : null}\n      {ld ? <script type=\"application/ld+json\" dangerouslySetInnerHTML={{ __html: JSON.stringify(ld).replace(/</g, \"\\\\u003c\") }} /> : null}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/table/table.css

@@ -0,0 +1,73 @@
+/*
+ * TABLE (CPO D42) — styles for the one semantic table renderer (src/schema/table.ts → renderTableHtml).
+ * Works on the Caldera site (--s* tokens), the Kit Library preview (--ks-*) and in the app: inside a kit scope
+ * (--kit-fg, --kit-line…), else the dashboard roles (--foreground, --border, --card). V2 path: src/kit/schema/table.ts.
+ * Responsive modes never change the DOM: Scroll (default) scrolls sideways with the row headers pinned; Stack and
+ * Cards re-lay the same rows below 560px of container width. Display changes can drop table semantics in some
+ * engines, so the renderer adds the equivalent ARIA roles only in those two modes (see docs/TABLES.md).
+ */
+.bt-table {
+  --bt-fg: var(--sfg, var(--ks-fg, var(--kit-fg)));
+  --bt-fg2: var(--sfg2, var(--ks-fg2, var(--kit-fg-2)));
+  --bt-line: var(--sline, var(--ks-line, var(--kit-line)));
+  --bt-bg: var(--sbg, var(--ks-card, var(--kit-surface)));
+  --bt-head: color-mix(in oklab, var(--bt-fg) 4%, var(--bt-bg));
+  --bt-accent: var(--sbtn, var(--ks-accent, var(--kit-fg)));
+  --bt-pad-y: 11px;
+  --bt-pad-x: 16px;
+  margin: 0;
+  container-type: inline-size;
+  color: var(--bt-fg);
+  font-variant-numeric: tabular-nums;
+}
+.bt-table[data-density="compact"] { --bt-pad-y: 7px; --bt-pad-x: 12px; }
+.bt-table .bt-scroll { overflow-x: auto; border-radius: var(--cs-r, 10px); box-shadow: inset 0 0 0 1px var(--bt-line); background: var(--bt-bg); }
+.bt-table .bt-scroll:focus-visible { outline: 2px solid var(--bt-fg2); outline-offset: 2px; }
+.bt-table[data-sticky="true"] .bt-scroll { max-height: min(70vh, 640px); overflow: auto; }
+.bt-table table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; line-height: 1.45; }
+.bt-table caption { caption-side: top; text-align: left; padding: 14px var(--bt-pad-x) 10px; font-weight: 600; font-size: 14px; color: var(--bt-fg); }
+.bt-table th, .bt-table td { padding: var(--bt-pad-y) var(--bt-pad-x); text-align: left; vertical-align: top; border-top: 1px solid var(--bt-line); }
+.bt-table [data-align="end"] { text-align: right; }
+.bt-table [data-align="center"] { text-align: center; }
+.bt-table thead th, .bt-table thead td { font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; color: var(--bt-fg2); background: var(--bt-head); vertical-align: bottom; }
+.bt-table thead th[scope="colgroup"] { text-align: center; border-bottom: 1px solid var(--bt-line); letter-spacing: 0.04em; }
+.bt-table[data-sticky="true"] thead th, .bt-table[data-sticky="true"] thead td { position: sticky; top: 0; z-index: 2; }
+.bt-table tbody th[scope="row"], .bt-table tfoot th[scope="row"] { font-weight: 600; color: var(--bt-fg); }
+.bt-table[data-header-col="true"] th[scope="row"], .bt-table[data-header-col="true"] thead tr:last-child > :first-child { position: sticky; left: 0; z-index: 1; background: var(--bt-bg); box-shadow: inset -1px 0 0 var(--bt-line); }
+.bt-table[data-header-col="true"] thead tr:last-child > :first-child { background: var(--bt-head); z-index: 3; }
+.bt-table tr.bt-group th { font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; color: var(--bt-fg); padding-top: calc(var(--bt-pad-y) + 8px); background: var(--bt-bg); }
+.bt-table[data-striped="true"] tbody tr:not(.bt-group):nth-child(even) > * { background: color-mix(in oklab, var(--bt-fg) 2.5%, var(--bt-bg)); }
+.bt-table tr[data-highlight="true"] > *, .bt-table [data-highlight="true"]:is(td, th) { background: color-mix(in oklab, var(--bt-accent) 7%, var(--bt-bg)); }
+.bt-table tfoot th, .bt-table tfoot td { font-weight: 600; border-top: 2px solid var(--bt-line); }
+.bt-table td a, .bt-table th a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
+.bt-table sup { font-size: 0.7em; margin-left: 1px; }
+.bt-table sup a { text-decoration: none; color: var(--bt-fg2); }
+.bt-table .bt-bool[data-bool="true"] { color: var(--bt-accent); font-weight: 700; }
+.bt-table .bt-bool[data-bool="false"], .bt-table .bt-dash, .bt-table .bt-dim { color: var(--bt-fg2); opacity: 0.7; }
+.bt-table .bt-star { color: var(--kit-rating, #d29a1c); }
+.bt-table .bt-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
+.bt-table .bt-sort { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; border-radius: 4px; }
+.bt-table .bt-sort:focus-visible { outline: 2px solid var(--bt-fg2); outline-offset: 2px; }
+.bt-table .bt-sort-icon { opacity: 0.55; font-size: 11px; }
+.bt-table .bt-notes { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--bt-fg2); }
+.bt-table .bt-notes p { margin: 0; }
+.bt-table .bt-notes ol { margin: 6px 0 0; padding-left: 1.4em; list-style: decimal; }
+.bt-table .bt-notes li + li { margin-top: 2px; }
+.bt-filter { display: flex; margin-bottom: 10px; }
+.bt-filter input { width: min(280px, 100%); height: 34px; padding: 0 12px; border-radius: 8px; border: 1px solid var(--sline, var(--kit-line)); background: var(--sbg, var(--kit-surface)); color: inherit; font: inherit; font-size: 14px; }
+.bt-empty-filter { padding: 16px; font-size: 14px; color: var(--sfg2, var(--kit-fg-2)); }
+
+/* Stack + Cards: same DOM, rows become blocks under 560px; each cell shows its column label (data-label). */
+@container (max-width: 560px) {
+  .bt-table[data-responsive="stack"] thead, .bt-table[data-responsive="cards"] thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
+  .bt-table[data-responsive="stack"] table, .bt-table[data-responsive="stack"] tbody, .bt-table[data-responsive="stack"] tfoot, .bt-table[data-responsive="stack"] tr,
+  .bt-table[data-responsive="cards"] table, .bt-table[data-responsive="cards"] tbody, .bt-table[data-responsive="cards"] tfoot, .bt-table[data-responsive="cards"] tr { display: block; }
+  .bt-table[data-responsive="stack"] th, .bt-table[data-responsive="stack"] td, .bt-table[data-responsive="cards"] th, .bt-table[data-responsive="cards"] td { display: block; border-top: 0; padding-top: 6px; padding-bottom: 6px; text-align: left; position: static; box-shadow: none; }
+  /* the label is an inline-block beside the value, so a cell's parts (icon + words, ★ + number) stay one line */
+  .bt-table[data-responsive="stack"] td::before, .bt-table[data-responsive="cards"] td::before { content: attr(data-label); display: inline-block; width: 40%; min-width: 96px; padding-right: 12px; vertical-align: top; font-size: 12px; font-weight: 600; color: var(--bt-fg2); }
+  .bt-table[data-responsive="stack"] th[scope="row"], .bt-table[data-responsive="cards"] th[scope="row"], .bt-table tr.bt-group th { display: block; font-size: 15px; padding-top: 12px; }
+  .bt-table[data-responsive="stack"] tr { border-top: 1px solid var(--bt-line); padding: 6px 0; }
+  .bt-table[data-responsive="cards"] .bt-scroll { box-shadow: none; background: transparent; overflow: visible; }
+  .bt-table[data-responsive="cards"] tbody tr:not(.bt-group), .bt-table[data-responsive="cards"] tfoot tr { margin: 10px 0; border-radius: var(--cs-r, 10px); box-shadow: inset 0 0 0 1px var(--bt-line); background: var(--bt-bg); padding: 6px 0; }
+  .bt-table[data-responsive="cards"] caption { display: block; padding-left: 0; }
+}

package/dist/testing/corpus.d.ts

@@ -0,0 +1,63 @@
+import type { TypeSchema } from "../schema/types";
+import { type AdapterTarget } from "../adapters/schema";
+import { type Backlog, type CatalogItem, type LossyItem } from "../adapters/lossy";
+export declare const CORPUS: {
+    id: string;
+    schema: TypeSchema;
+    value: Record<string, unknown>;
+}[];
+/**
+ * Every leaf (JSON pointer) where `a` and `b` differ. A missing object or array is read as empty, so a dropped
+ * `{ required, max }` shows as its two leaves, and an undefined key equals an absent one.
+ */
+export declare function leafDiff(a: unknown, b: unknown, path?: string, out?: string[]): string[];
+/**
+ * Round-trips one schema and returns what breaks "equals v2 minus exactly the lossy and catalog paths" (empty = holds).
+ */
+export declare function roundTrip(schema: TypeSchema, target: AdapterTarget): {
+    lossy: LossyItem[];
+    catalog: CatalogItem[];
+    /** a difference no lossy or catalog item names: a silent drop or a wrong mapping */
+    unreported: string[];
+    /** a lossy or catalog item with nothing lost under it: an over-report */
+    overreported: string[];
+};
+/**
+ * entry id → the sorted features, per lane: what prod drops (`lossy`) or what the host sets at seeding (`catalog`).
+ * The lossy summary also names each reported feature's backlog item, and lists the features per backlog item with
+ * their entry counts in both lanes (the generated backend order).
+ */
+export declare function computeLedger(kind: "lossy" | "catalog"): {
+    summary: {
+        fields: {
+            [k: string]: number;
+        };
+        props: {
+            [k: string]: number;
+        };
+    };
+    entries: Record<string, {
+        fields: string[];
+        props: string[];
+    }>;
+} | {
+    summary: {
+        backlog: Record<string, Backlog>;
+        byBacklog: {
+            [k: string]: Record<string, {
+                fields: number;
+                props: number;
+            }>;
+        };
+        fields: {
+            [k: string]: number;
+        };
+        props: {
+            [k: string]: number;
+        };
+    };
+    entries: Record<string, {
+        fields: string[];
+        props: string[];
+    }>;
+};

package/dist/testing/corpus.js

@@ -0,0 +1,129 @@
+import { FEATURES } from "../adapters/lossy.js";
+import { fromTypeSchema, propsToTypeSchema, toTypeSchema } from "../adapters/schema.js";
+import { EXAMPLES } from "../library/examples/index.js";
+import { KIT_LIBRARY } from "../library/entries/index.js";
+//#region src/testing/corpus.ts
+/** The 149 schemas the adapters are held to (KIT_LIBRARY 142 + the 7 core examples) and the leaf diff the round trip uses. */
+var CORPUS = [...KIT_LIBRARY.map((e) => ({
+	id: e.id,
+	schema: e.schema,
+	value: e.value
+})), ...EXAMPLES.map((e) => ({
+	id: e.id,
+	schema: e.schema,
+	value: e.value
+}))];
+var isObj = (v) => !!v && typeof v === "object" && !Array.isArray(v);
+/**
+* Every leaf (JSON pointer) where `a` and `b` differ. A missing object or array is read as empty, so a dropped
+* `{ required, max }` shows as its two leaves, and an undefined key equals an absent one.
+*/
+function leafDiff(a, b, path = "", out = []) {
+	if (isObj(a) || isObj(b)) {
+		if (a !== void 0 && !isObj(a) || b !== void 0 && !isObj(b)) {
+			out.push(path);
+			return out;
+		}
+		const A = a ?? {};
+		const B = b ?? {};
+		for (const k of /* @__PURE__ */ new Set([...Object.keys(A), ...Object.keys(B)])) leafDiff(A[k], B[k], `${path}/${k}`, out);
+		return out;
+	}
+	if (Array.isArray(a) || Array.isArray(b)) {
+		if (a !== void 0 && !Array.isArray(a) || b !== void 0 && !Array.isArray(b)) {
+			out.push(path);
+			return out;
+		}
+		const A = a ?? [];
+		const B = b ?? [];
+		for (let i = 0; i < Math.max(A.length, B.length); i++) leafDiff(A[i], B[i], `${path}/${i}`, out);
+		return out;
+	}
+	if (a !== b) out.push(path);
+	return out;
+}
+var under = (path, root) => path === root || path.startsWith(`${root}/`);
+/**
+* A V2 field with no group sits in the default group (engine/grouping.tsx: `f.group ?? defaultGroup(groups)`). Prop
+* tabs store every top-level prop's tab, so the props lane reads that placement back as an explicit `group`: the same
+* placement, compared as such.
+*/
+function withDefaultGroups(schema) {
+	const d = (schema.groups?.find((g) => g.default) ?? schema.groups?.[0])?.name;
+	return d === void 0 ? schema : {
+		...schema,
+		fields: schema.fields.map((f) => f.group === void 0 ? {
+			...f,
+			group: d
+		} : f)
+	};
+}
+/**
+* Round-trips one schema and returns what breaks "equals v2 minus exactly the lossy and catalog paths" (empty = holds).
+*/
+function roundTrip(schema, target) {
+	const { schema: prod, blockModels, lossy, catalog } = target === "fields" ? fromTypeSchema(schema, "fields") : fromTypeSchema(schema, "props");
+	const back = target === "fields" ? toTypeSchema(prod, { blockModels }) : propsToTypeSchema(prod);
+	const diffs = leafDiff(target === "props" ? withDefaultGroups(schema) : schema, back);
+	const named = [...lossy, ...catalog];
+	return {
+		lossy,
+		catalog,
+		/** a difference no lossy or catalog item names: a silent drop or a wrong mapping */
+		unreported: diffs.filter((d) => !named.some((l) => under(d, l.path))),
+		/** a lossy or catalog item with nothing lost under it: an over-report */
+		overreported: named.filter((l) => !diffs.some((d) => under(d, l.path))).map((l) => `${l.path} (${l.feature})`)
+	};
+}
+/**
+* entry id → the sorted features, per lane: what prod drops (`lossy`) or what the host sets at seeding (`catalog`).
+* The lossy summary also names each reported feature's backlog item, and lists the features per backlog item with
+* their entry counts in both lanes (the generated backend order).
+*/
+function computeLedger(kind) {
+	const entries = {};
+	const summary = {
+		fields: {},
+		props: {}
+	};
+	for (const { id, schema } of CORPUS) {
+		const row = {
+			fields: [],
+			props: []
+		};
+		for (const t of ["fields", "props"]) {
+			row[t] = [...new Set(roundTrip(schema, t)[kind].map((l) => l.feature))].sort();
+			for (const f of row[t]) summary[t][f] = (summary[t][f] ?? 0) + 1;
+		}
+		entries[id] = row;
+	}
+	const sortedCounts = (o) => Object.fromEntries(Object.entries(o).sort((a, b) => b[1] - a[1] || a[0].localeCompare(b[0])));
+	const counts = {
+		fields: sortedCounts(summary.fields),
+		props: sortedCounts(summary.props)
+	};
+	if (kind === "catalog") return {
+		summary: counts,
+		entries
+	};
+	const reported = [.../* @__PURE__ */ new Set([...Object.keys(counts.fields), ...Object.keys(counts.props)])].sort();
+	const backlog = Object.fromEntries(reported.map((f) => [f, FEATURES[f]?.backlog]));
+	const byBacklog = {};
+	for (const f of reported) (byBacklog[backlog[f]] ??= {})[f] = {
+		fields: summary.fields[f] ?? 0,
+		props: summary.props[f] ?? 0
+	};
+	const sortedByBacklog = Object.fromEntries(Object.keys(byBacklog).sort().map((b) => [b, byBacklog[b]]));
+	return {
+		summary: {
+			...counts,
+			backlog,
+			byBacklog: sortedByBacklog
+		},
+		entries
+	};
+}
+//#endregion
+export { CORPUS, computeLedger, leafDiff, roundTrip };
+
+//# sourceMappingURL=corpus.js.map

package/dist/testing/corpus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"corpus.js","names":[],"sources":["../../src/testing/corpus.ts"],"sourcesContent":["/** The 149 schemas the adapters are held to (KIT_LIBRARY 142 + the 7 core examples) and the leaf diff the round trip uses. */\nimport { KIT_LIBRARY } from \"../library/entries\";\nimport { EXAMPLES } from \"../library/examples\";\nimport type { TypeSchema } from \"../schema/types\";\nimport { fromTypeSchema, propsToTypeSchema, toTypeSchema, type AdapterTarget } from \"../adapters/schema\";\nimport { FEATURES, type Backlog, type CatalogItem, type LossyFeature, type LossyItem } from \"../adapters/lossy\";\n\nexport const CORPUS: { id: string; schema: TypeSchema; value: Record<string, unknown> }[] = [\n  ...KIT_LIBRARY.map((e) => ({ id: e.id, schema: e.schema, value: e.value })),\n  ...EXAMPLES.map((e) => ({ id: e.id, schema: e.schema, value: e.value })),\n];\n\ntype Obj = Record<string, unknown>;\nconst isObj = (v: unknown): v is Obj => !!v && typeof v === \"object\" && !Array.isArray(v);\n\n/**\n * Every leaf (JSON pointer) where `a` and `b` differ. A missing object or array is read as empty, so a dropped\n * `{ required, max }` shows as its two leaves, and an undefined key equals an absent one.\n */\nexport function leafDiff(a: unknown, b: unknown, path = \"\", out: string[] = []): string[] {\n  if (isObj(a) || isObj(b)) {\n    if ((a !== undefined && !isObj(a)) || (b !== undefined && !isObj(b))) {\n      out.push(path);\n      return out;\n    }\n    const A = (a ?? {}) as Obj;\n    const B = (b ?? {}) as Obj;\n    for (const k of new Set([...Object.keys(A), ...Object.keys(B)])) leafDiff(A[k], B[k], `${path}/${k}`, out);\n    return out;\n  }\n  if (Array.isArray(a) || Array.isArray(b)) {\n    if ((a !== undefined && !Array.isArray(a)) || (b !== undefined && !Array.isArray(b))) {\n      out.push(path);\n      return out;\n    }\n    const A = (a ?? []) as unknown[];\n    const B = (b ?? []) as unknown[];\n    for (let i = 0; i < Math.max(A.length, B.length); i++) leafDiff(A[i], B[i], `${path}/${i}`, out);\n    return out;\n  }\n  if (a !== b) out.push(path);\n  return out;\n}\n\nconst under = (path: string, root: string) => path === root || path.startsWith(`${root}/`);\n\n/**\n * A V2 field with no group sits in the default group (engine/grouping.tsx: `f.group ?? defaultGroup(groups)`). Prop\n * tabs store every top-level prop's tab, so the props lane reads that placement back as an explicit `group`: the same\n * placement, compared as such.\n */\nfunction withDefaultGroups(schema: TypeSchema): TypeSchema {\n  const d = (schema.groups?.find((g) => g.default) ?? schema.groups?.[0])?.name;\n  return d === undefined ? schema : { ...schema, fields: schema.fields.map((f) => (f.group === undefined ? { ...f, group: d } : f)) };\n}\n\n/**\n * Round-trips one schema and returns what breaks \"equals v2 minus exactly the lossy and catalog paths\" (empty = holds).\n */\nexport function roundTrip(schema: TypeSchema, target: AdapterTarget) {\n  const { schema: prod, blockModels, lossy, catalog } = target === \"fields\" ? fromTypeSchema(schema, \"fields\") : fromTypeSchema(schema, \"props\");\n  const back =\n    target === \"fields\"\n      ? toTypeSchema(prod as Parameters<typeof toTypeSchema>[0], { blockModels })\n      : propsToTypeSchema(prod as Parameters<typeof propsToTypeSchema>[0]);\n  const diffs = leafDiff(target === \"props\" ? withDefaultGroups(schema) : schema, back);\n  const named: (LossyItem | CatalogItem)[] = [...lossy, ...catalog];\n  return {\n    lossy,\n    catalog,\n    /** a difference no lossy or catalog item names: a silent drop or a wrong mapping */\n    unreported: diffs.filter((d) => !named.some((l) => under(d, l.path))),\n    /** a lossy or catalog item with nothing lost under it: an over-report */\n    overreported: named.filter((l) => !diffs.some((d) => under(d, l.path))).map((l) => `${l.path} (${l.feature})`),\n  };\n}\n\n/**\n * entry id → the sorted features, per lane: what prod drops (`lossy`) or what the host sets at seeding (`catalog`).\n * The lossy summary also names each reported feature's backlog item, and lists the features per backlog item with\n * their entry counts in both lanes (the generated backend order).\n */\nexport function computeLedger(kind: \"lossy\" | \"catalog\") {\n  const entries: Record<string, { fields: string[]; props: string[] }> = {};\n  const summary = { fields: {} as Record<string, number>, props: {} as Record<string, number> };\n  for (const { id, schema } of CORPUS) {\n    const row = { fields: [] as string[], props: [] as string[] };\n    for (const t of [\"fields\", \"props\"] as const) {\n      row[t] = [...new Set((roundTrip(schema, t)[kind] as { feature: string }[]).map((l) => l.feature))].sort();\n      for (const f of row[t]) summary[t][f] = (summary[t][f] ?? 0) + 1;\n    }\n    entries[id] = row;\n  }\n  const sortedCounts = (o: Record<string, number>) =>\n    Object.fromEntries(Object.entries(o).sort((a, b) => b[1] - a[1] || a[0].localeCompare(b[0])));\n  const counts = { fields: sortedCounts(summary.fields), props: sortedCounts(summary.props) };\n  if (kind === \"catalog\") return { summary: counts, entries };\n  const reported = [...new Set([...Object.keys(counts.fields), ...Object.keys(counts.props)])].sort() as LossyFeature[];\n  const backlog = Object.fromEntries(reported.map((f) => [f, FEATURES[f]?.backlog])) as Record<string, Backlog>;\n  const byBacklog: Record<string, Record<string, { fields: number; props: number }>> = {};\n  for (const f of reported) (byBacklog[backlog[f]] ??= {})[f] = { fields: summary.fields[f] ?? 0, props: summary.props[f] ?? 0 };\n  const sortedByBacklog = Object.fromEntries(Object.keys(byBacklog).sort().map((b) => [b, byBacklog[b]]));\n  return { summary: { ...counts, backlog, byBacklog: sortedByBacklog }, entries };\n}\n"],"mappings":"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"}

package/dist/testing/test-form.d.ts

@@ -0,0 +1,11 @@
+import type { FieldSchema } from "../schema/types";
+import type { ControlProps } from "../types";
+import { type SchemaFormProps } from "../engine/schema-form";
+/** A controlled SchemaForm over `fields`, with the latest value readable from `onValue`. */
+export declare function TestForm({ fields, initial, onValue, ...rest }: Omit<SchemaFormProps, "schema" | "value" | "onChange"> & {
+    fields: FieldSchema[];
+    initial?: Record<string, unknown>;
+    onValue?: (v: Record<string, unknown>) => void;
+}): import("react/jsx-runtime").JSX.Element;
+/** A plain input standing in for a real control: it sets an aria-describedby id of its own, which the shell keeps. */
+export declare function TestInput({ id, value, onChange, invalid, readOnly }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/testing/test-form.js

@@ -0,0 +1,38 @@
+import { SchemaForm } from "../engine/schema-form.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/testing/test-form.tsx
+/** A controlled SchemaForm over `fields`, with the latest value readable from `onValue`. */
+function TestForm({ fields, initial = {}, onValue, ...rest }) {
+	const [value, setValue] = React.useState(initial);
+	const schema = React.useMemo(() => ({
+		name: "doc",
+		title: "Doc",
+		kind: "entry",
+		fields
+	}), [fields]);
+	return /* @__PURE__ */ jsx(SchemaForm, {
+		schema,
+		value,
+		onChange: (v) => {
+			setValue(v);
+			onValue?.(v);
+		},
+		...rest
+	});
+}
+/** A plain input standing in for a real control: it sets an aria-describedby id of its own, which the shell keeps. */
+function TestInput({ id, value, onChange, invalid, readOnly }) {
+	return /* @__PURE__ */ jsx("input", {
+		id,
+		"aria-describedby": "own-id",
+		"aria-invalid": invalid || void 0,
+		readOnly,
+		value: typeof value === "string" ? value : "",
+		onChange: (e) => onChange(e.target.value)
+	});
+}
+//#endregion
+export { TestForm, TestInput };
+
+//# sourceMappingURL=test-form.js.map

package/dist/testing/test-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-form.js","names":[],"sources":["../../src/testing/test-form.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { FieldSchema } from \"../schema/types\";\nimport type { ControlProps } from \"../types\";\nimport { SchemaForm, type SchemaFormProps } from \"../engine/schema-form\";\n\n/** A controlled SchemaForm over `fields`, with the latest value readable from `onValue`. */\nexport function TestForm({\n  fields,\n  initial = {},\n  onValue,\n  ...rest\n}: Omit<SchemaFormProps, \"schema\" | \"value\" | \"onChange\"> & {\n  fields: FieldSchema[];\n  initial?: Record<string, unknown>;\n  onValue?: (v: Record<string, unknown>) => void;\n}) {\n  const [value, setValue] = React.useState(initial);\n  const schema = React.useMemo(() => ({ name: \"doc\", title: \"Doc\", kind: \"entry\" as const, fields }), [fields]);\n  return (\n    <SchemaForm\n      schema={schema}\n      value={value}\n      onChange={(v) => {\n        setValue(v);\n        onValue?.(v);\n      }}\n      {...rest}\n    />\n  );\n}\n\n/** A plain input standing in for a real control: it sets an aria-describedby id of its own, which the shell keeps. */\nexport function TestInput({ id, value, onChange, invalid, readOnly }: ControlProps) {\n  return (\n    <input\n      id={id}\n      aria-describedby=\"own-id\"\n      aria-invalid={invalid || undefined}\n      readOnly={readOnly}\n      value={typeof value === \"string\" ? value : \"\"}\n      onChange={(e) => onChange(e.target.value)}\n    />\n  );\n}\n"],"mappings":";;;;;AAMA,SAAgB,SAAS,EACvB,QACA,UAAU,CAAC,GACX,SACA,GAAG,QAKF;CACD,MAAM,CAAC,OAAO,YAAY,MAAM,SAAS,OAAO;CAChD,MAAM,SAAS,MAAM,eAAe;EAAE,MAAM;EAAO,OAAO;EAAO,MAAM;EAAkB;CAAO,IAAI,CAAC,MAAM,CAAC;CAC5G,OACE,oBAAC,YAAD;EACU;EACD;EACP,WAAW,MAAM;GACf,SAAS,CAAC;GACV,UAAU,CAAC;EACb;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAgB,UAAU,EAAE,IAAI,OAAO,UAAU,SAAS,YAA0B;CAClF,OACE,oBAAC,SAAD;EACM;EACJ,oBAAiB;EACjB,gBAAc,WAAW,KAAA;EACf;EACV,OAAO,OAAO,UAAU,WAAW,QAAQ;EAC3C,WAAW,MAAM,SAAS,EAAE,OAAO,KAAK;CACzC,CAAA;AAEL"}