@homepages/template-kit 0.8.1-dev-20260718224903 → 0.9.0-dev-20260719224319

package/dist/canvas-core/chrome.js

@@ -0,0 +1,147 @@
+//#region src/canvas-core/chrome.ts
+/** How far outside the target the ring sits, in CSS px. With a 2px border-box
+*  border, offset = 1 centers the stroke on the element's edge (1px outside,
+*  1px overlapping inside) so the ring reads as flush. */
+const RING_OFFSET = 1;
+/** Inset of the section title pill from the target's left edge, in CSS px. */
+const LABEL_LEFT_INDENT = 12;
+/**
+* Ring geometry in document space: shift by scroll, inflate by `offset`.
+*
+* `containerWidth` clamps the horizontal edges. A section flush with both page
+* edges would otherwise inflate `offset` px past each one and grow the
+* document's horizontal scroll extent. Omitting it means unclamped: the app's
+* overlay is wider than its page card and never overflows, so clamping it would
+* silently shift every full-bleed ring. A consumer whose overlay is page-width
+* opts in by passing one.
+*
+* Absence — not a sentinel value — is what selects the unclamped branch. A
+* numeric stand-in for "unbounded" would make NaN (plausible out of a detached
+* document's clientWidth arithmetic) take the clamped branch and yield NaN
+* geometry, and would let Number.MAX_SAFE_INTEGER quietly enable the left floor.
+*/
+function ringBox(rect, scroll, offset, containerWidth) {
+	const rawLeft = rect.left + scroll.x - offset;
+	const rawRight = rawLeft + rect.width + 2 * offset;
+	const left = containerWidth === void 0 ? rawLeft : Math.max(0, rawLeft);
+	const right = containerWidth === void 0 ? rawRight : Math.min(containerWidth, rawRight);
+	return {
+		top: rect.top + scroll.y - offset,
+		left,
+		width: Math.max(0, right - left),
+		height: rect.height + 2 * offset
+	};
+}
+/** Whether an element has a box a ring can actually wrap. */
+function hasMeasurableRingBox(el) {
+	const rect = measureRingRect(el);
+	return rect.width > 0 && rect.height > 0;
+}
+function measureRingRect(el) {
+	const rect = el.getBoundingClientRect();
+	if (rect.width > 0 && rect.height > 0) return rect;
+	let top = Infinity;
+	let left = Infinity;
+	let right = -Infinity;
+	let bottom = -Infinity;
+	let found = false;
+	for (const child of Array.from(el.children)) {
+		const childRect = measureRingRect(child);
+		if (childRect.width <= 0 || childRect.height <= 0) continue;
+		found = true;
+		top = Math.min(top, childRect.top);
+		left = Math.min(left, childRect.left);
+		right = Math.max(right, childRect.right);
+		bottom = Math.max(bottom, childRect.bottom);
+	}
+	if (!found) return rect;
+	return new DOMRect(left, top, right - left, bottom - top);
+}
+/**
+* Move a ring in #we-chrome-overlay to sit `offset` px outside `target`.
+*
+* `kind` flips a data attribute so CSS can pick a color (gold for sections and
+* slots). The hover ring leaves it unset and uses its own selector.
+*/
+function positionRing(ring, target, offset, kind, containerWidth) {
+	if (!ring) return;
+	if (!target) {
+		ring.removeAttribute("data-active");
+		return;
+	}
+	const win = target.ownerDocument.defaultView;
+	if (!win) return;
+	const box = ringBox(measureRingRect(target), {
+		x: win.scrollX,
+		y: win.scrollY
+	}, offset, containerWidth);
+	ring.style.top = `${box.top}px`;
+	ring.style.left = `${box.left}px`;
+	ring.style.width = `${box.width}px`;
+	ring.style.height = `${box.height}px`;
+	if (kind) ring.setAttribute("data-kind", kind);
+	ring.setAttribute("data-active", "true");
+}
+function applySelectionKind(ring, kind) {
+	ring.removeAttribute("data-kind");
+	requestAnimationFrame(() => {
+		requestAnimationFrame(() => {
+			ring.setAttribute("data-kind", kind);
+		});
+	});
+}
+function clearRing(ring) {
+	if (!ring) return;
+	ring.removeAttribute("data-active");
+	ring.removeAttribute("data-kind");
+}
+function positionLabel(label, target, text) {
+	if (!label) return;
+	if (!target || !text) {
+		clearLabel(label);
+		return;
+	}
+	const win = target.ownerDocument.defaultView;
+	if (!win) return;
+	const rect = measureRingRect(target);
+	const wasActive = label.getAttribute("data-active") === "true";
+	const textChanged = label.textContent !== text;
+	label.textContent = text;
+	label.style.top = `${rect.top + win.scrollY}px`;
+	label.style.left = `${rect.left + win.scrollX + 12}px`;
+	if (wasActive && textChanged) {
+		label.removeAttribute("data-active");
+		label.offsetWidth;
+	}
+	label.setAttribute("data-active", "true");
+}
+function clearLabel(label) {
+	if (!label) return;
+	label.removeAttribute("data-active");
+	label.textContent = "";
+}
+function cssEscape(value) {
+	if (typeof CSS !== "undefined" && CSS.escape) return CSS.escape(value);
+	return value.replace(/[^a-zA-Z0-9_-]/g, (c) => `\\${c}`);
+}
+function resolveVisibleSlotEl(scope, slotId, markers) {
+	const nodes = scope.querySelectorAll(`[${markers.slotId}="${cssEscape(slotId)}"]`);
+	for (const el of Array.from(nodes)) if (hasMeasurableRingBox(el)) return el;
+	return nodes[0] ?? null;
+}
+function resolveItemEl(slotEl, selection, markers) {
+	if (!selection || selection.kind !== "slot" || selection.item_index == null) return null;
+	return slotEl?.querySelector(`[${markers.slotItem}="${cssEscape(String(selection.item_index))}"]`) ?? null;
+}
+function resolveSelectionEl(doc, selection, markers) {
+	if (!selection) return null;
+	const sec = doc.querySelector(`[${markers.sectionInstanceId}="${cssEscape(selection.instance_id)}"]`);
+	if (!sec) return null;
+	if (selection.kind === "section") return sec;
+	const node = resolveVisibleSlotEl(sec, selection.slot_id, markers);
+	if (!node) return null;
+	return resolveItemEl(node, selection, markers) ?? node.closest(`[${markers.slotGroup}]`) ?? node;
+}
+
+//#endregion
+export { LABEL_LEFT_INDENT, RING_OFFSET, applySelectionKind, clearLabel, clearRing, cssEscape, hasMeasurableRingBox, measureRingRect, positionLabel, positionRing, resolveItemEl, resolveSelectionEl, resolveVisibleSlotEl, ringBox };

package/dist/canvas-core/frame.d.ts

@@ -0,0 +1,20 @@
+import { CanvasFrameDeps, CanvasSectionEntry, CanvasSelection, CanvasTarget } from "./types.js";
+//#region src/canvas-core/frame.d.ts
+interface CanvasFrame {
+  srcdoc(): string;
+  buildSectionWrapper(entry: CanvasSectionEntry, doc: Document): HTMLElement;
+  buildErrorPlaceholder(entry: CanvasSectionEntry, doc: Document): HTMLElement;
+  resolveTarget(hit: HTMLElement | null, sections: CanvasSectionEntry[]): CanvasTarget | null;
+  localizeSectionAssets(html: string): string;
+  /** The DOM node a selection points at: item, then slot group, then slot —
+   *  the same order the selection ring targets. */
+  resolveSelectionEl(doc: Document, selection: CanvasSelection | null): HTMLElement | null;
+  /** The painting copy of a slot, for sections with responsive duplicate DOM. */
+  resolveVisibleSlotEl(scope: ParentNode, slotId: string): HTMLElement | null;
+  /** The selected collection item within an already-resolved slot element. */
+  resolveItemEl(slotEl: HTMLElement | null, selection: CanvasSelection | null): HTMLElement | null;
+}
+/** Bind the frame to one consumer's markers, asset URLs and editability rule. */
+declare function createCanvasFrame(deps: CanvasFrameDeps): CanvasFrame;
+//#endregion
+export { CanvasFrame, createCanvasFrame };

package/dist/canvas-core/frame.js

@@ -0,0 +1,23 @@
+import { resolveItemEl, resolveSelectionEl, resolveVisibleSlotEl } from "./chrome.js";
+import { resolveCanvasTarget } from "./resolve-target.js";
+import { buildErrorPlaceholder, buildSectionWrapper } from "./section-dom.js";
+import { buildSrcdoc, localizeSectionAssets } from "./srcdoc.js";
+
+//#region src/canvas-core/frame.ts
+/** Bind the frame to one consumer's markers, asset URLs and editability rule. */
+function createCanvasFrame(deps) {
+	const localize = (html) => localizeSectionAssets(html, deps.assets.basePath);
+	return {
+		srcdoc: () => buildSrcdoc(deps.assets, deps.markers),
+		buildSectionWrapper: (entry, doc) => buildSectionWrapper(entry, doc, deps.markers, localize),
+		buildErrorPlaceholder,
+		resolveTarget: (hit, sections) => resolveCanvasTarget(hit, sections, deps),
+		localizeSectionAssets: localize,
+		resolveSelectionEl: (doc, selection) => resolveSelectionEl(doc, selection, deps.markers),
+		resolveVisibleSlotEl: (scope, slotId) => resolveVisibleSlotEl(scope, slotId, deps.markers),
+		resolveItemEl: (slotEl, selection) => resolveItemEl(slotEl, selection, deps.markers)
+	};
+}
+
+//#endregion
+export { createCanvasFrame };

package/dist/canvas-core/hidden-tabs.d.ts

@@ -0,0 +1,16 @@
+//#region src/canvas-core/hidden-tabs.d.ts
+declare const WE_TAB_STEP = 42;
+declare const TAB_TUCK = 16;
+interface TabAnchor {
+  idx: number;
+  y: number;
+}
+interface HiddenTabSpec {
+  instanceId: string;
+  label: string;
+}
+declare function placeTabs(anchors: TabAnchor[], step: number): Record<number, number>;
+declare function buildHiddenTab(doc: Document, instanceId: string, label: string, onReveal: () => void): HTMLButtonElement;
+declare function reconcileHiddenTabs(container: HTMLElement, doc: Document, specs: HiddenTabSpec[], onReveal: (instanceId: string) => void): HTMLButtonElement[];
+//#endregion
+export { HiddenTabSpec, TAB_TUCK, TabAnchor, WE_TAB_STEP, buildHiddenTab, placeTabs, reconcileHiddenTabs };

package/dist/canvas-core/hidden-tabs.js

@@ -0,0 +1,84 @@
+//#region src/canvas-core/hidden-tabs.ts
+const WE_TAB_STEP = 42;
+const TAB_TUCK = 16;
+function placeTabs(anchors, step) {
+	const clusters = [];
+	for (const a of anchors) {
+		clusters.push({
+			sum: a.y,
+			n: 1,
+			items: [a]
+		});
+		while (clusters.length > 1) {
+			const b = clusters[clusters.length - 1];
+			const p = clusters[clusters.length - 2];
+			if (!b || !p) break;
+			if (b.sum / b.n - (b.n - 1) / 2 * step - (p.sum / p.n + (p.n - 1) / 2 * step) < step) clusters.splice(clusters.length - 2, 2, {
+				sum: p.sum + b.sum,
+				n: p.n + b.n,
+				items: p.items.concat(b.items)
+			});
+			else break;
+		}
+	}
+	const out = {};
+	for (const c of clusters) {
+		const top = c.sum / c.n - (c.n - 1) / 2 * step;
+		c.items.forEach((it, i) => {
+			out[it.idx] = top + i * step;
+		});
+	}
+	return out;
+}
+const SVG_WRAP = (cls, inner) => `<svg class="${cls}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${inner}</svg>`;
+const EYE_OFF_SVG = SVG_WRAP("we-htab-eye-off", "<path d=\"M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49\"/><path d=\"M14.084 14.158a3 3 0 0 1-4.242-4.242\"/><path d=\"M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143\"/><path d=\"m2 2 20 20\"/>");
+const EYE_SVG = SVG_WRAP("we-htab-eye-on", "<path d=\"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/>");
+const revealHandlers = /* @__PURE__ */ new WeakMap();
+function buildHiddenTab(doc, instanceId, label, onReveal) {
+	const btn = doc.createElement("button");
+	btn.type = "button";
+	btn.className = "we-htab";
+	btn.dataset.hiddenTab = instanceId;
+	btn.title = `Show ${label}`;
+	btn.setAttribute("aria-label", `Show ${label}`);
+	btn.innerHTML = `<span class="we-htab-eye">${EYE_OFF_SVG}${EYE_SVG}</span><span class="we-htab-name"></span>`;
+	const nameEl = btn.querySelector(".we-htab-name");
+	if (nameEl) nameEl.textContent = label;
+	revealHandlers.set(btn, onReveal);
+	btn.addEventListener("click", (event) => {
+		event.stopPropagation();
+		revealHandlers.get(btn)?.();
+	});
+	return btn;
+}
+function reconcileHiddenTabs(container, doc, specs, onReveal) {
+	const existing = /* @__PURE__ */ new Map();
+	container.querySelectorAll(".we-htab").forEach((el) => {
+		const id = el.dataset.hiddenTab;
+		if (id) existing.set(id, el);
+	});
+	const keep = /* @__PURE__ */ new Set();
+	const live = [];
+	for (const spec of specs) {
+		let el = existing.get(spec.instanceId);
+		if (!el) {
+			el = buildHiddenTab(doc, spec.instanceId, spec.label, () => onReveal(spec.instanceId));
+			container.appendChild(el);
+		} else {
+			const nameEl = el.querySelector(".we-htab-name");
+			if (nameEl && nameEl.textContent !== spec.label) nameEl.textContent = spec.label;
+			el.title = `Show ${spec.label}`;
+			el.setAttribute("aria-label", `Show ${spec.label}`);
+			revealHandlers.set(el, () => onReveal(spec.instanceId));
+		}
+		keep.add(spec.instanceId);
+		live.push(el);
+	}
+	existing.forEach((el, id) => {
+		if (!keep.has(id)) el.remove();
+	});
+	return live;
+}
+
+//#endregion
+export { TAB_TUCK, WE_TAB_STEP, buildHiddenTab, placeTabs, reconcileHiddenTabs };

package/dist/canvas-core/resolve-target.js

@@ -0,0 +1,55 @@
+//#region src/canvas-core/resolve-target.ts
+function firstEditableGroupMemberId(groupEl, instanceId, deps) {
+	for (const el of Array.from(groupEl.querySelectorAll(`[${deps.markers.slotId}]`))) {
+		const id = el.getAttribute(deps.markers.slotId);
+		if (id && deps.isSlotEditable(instanceId, id)) return id;
+	}
+	return null;
+}
+function resolveCanvasTarget(hit, sections, deps) {
+	if (!hit) return null;
+	const sectionEl = hit.closest(`[${deps.markers.sectionInstanceId}]`);
+	const instanceId = sectionEl?.getAttribute(deps.markers.sectionInstanceId);
+	if (!sectionEl || !instanceId) return null;
+	const section = sections.find((s) => s.instance_id === instanceId);
+	const sectionTarget = {
+		selection: {
+			kind: "section",
+			instance_id: instanceId
+		},
+		element: sectionEl
+	};
+	if (!section) return sectionTarget;
+	const groupEl = hit.closest(`[${deps.markers.slotGroup}]`);
+	if (groupEl && sectionEl.contains(groupEl)) {
+		const repId = firstEditableGroupMemberId(groupEl, instanceId, deps);
+		if (!repId) return sectionTarget;
+		return {
+			selection: {
+				kind: "slot",
+				instance_id: instanceId,
+				slot_id: repId
+			},
+			element: groupEl
+		};
+	}
+	const slotEl = hit.closest(`[${deps.markers.slotId}]`);
+	const slotId = slotEl?.getAttribute(deps.markers.slotId);
+	if (!slotEl || !slotId) return sectionTarget;
+	if (!deps.isSlotEditable(instanceId, slotId)) return sectionTarget;
+	const itemEl = hit.closest(`[${deps.markers.slotItem}]`);
+	const rawItem = itemEl ? Number(itemEl.getAttribute(deps.markers.slotItem)) : NaN;
+	const itemIndex = Number.isInteger(rawItem) ? rawItem : void 0;
+	return {
+		selection: {
+			kind: "slot",
+			instance_id: instanceId,
+			slot_id: slotId,
+			...itemIndex !== void 0 ? { item_index: itemIndex } : {}
+		},
+		element: itemEl ?? slotEl
+	};
+}
+
+//#endregion
+export { resolveCanvasTarget };

package/dist/canvas-core/scroll.d.ts

@@ -0,0 +1,10 @@
+//#region src/canvas-core/scroll.d.ts
+declare const SCROLL_MARGIN_PX = 24;
+interface ScrollRect {
+  top: number;
+  bottom: number;
+  height: number;
+}
+declare function computeScrollTop(rect: ScrollRect, viewportH: number, scrollY: number, margin: number): number | null;
+//#endregion
+export { SCROLL_MARGIN_PX, ScrollRect, computeScrollTop };

package/dist/canvas-core/scroll.js

@@ -0,0 +1,15 @@
+//#region src/canvas-core/scroll.ts
+const SCROLL_MARGIN_PX = 24;
+function computeScrollTop(rect, viewportH, scrollY, margin) {
+	if (rect.height + 2 * margin <= viewportH) {
+		if (rect.top >= margin && rect.bottom <= viewportH - margin) return null;
+		if (rect.top < margin) return Math.max(0, scrollY + rect.top - margin);
+		return Math.max(0, scrollY + rect.bottom - (viewportH - margin));
+	}
+	const target = Math.max(0, scrollY + rect.top - margin);
+	if (Math.abs(target - scrollY) < 1) return null;
+	return target;
+}
+
+//#endregion
+export { SCROLL_MARGIN_PX, computeScrollTop };

package/dist/canvas-core/section-dom.d.ts

@@ -0,0 +1,6 @@
+import { CanvasSectionEntry } from "./types.js";
+//#region src/canvas-core/section-dom.d.ts
+declare function sectionLabel(entry: CanvasSectionEntry): string;
+declare function hashHtml(html: string | null): string;
+//#endregion
+export { hashHtml, sectionLabel };

package/dist/canvas-core/section-dom.js

@@ -0,0 +1,43 @@
+//#region src/canvas-core/section-dom.ts
+function sectionLabel(entry) {
+	if (entry.section_display_name) return entry.section_display_name;
+	return entry.section_key.split("-").map((p) => p ? p[0].toUpperCase() + p.slice(1) : p).join(" ");
+}
+function hashHtml(html) {
+	if (!html) return "null";
+	let h = 2166136261;
+	for (let i = 0; i < html.length; i++) {
+		h ^= html.charCodeAt(i);
+		h = Math.imul(h, 16777619);
+	}
+	return (h >>> 0).toString(16);
+}
+function buildErrorPlaceholder(entry, doc) {
+	const card = doc.createElement("div");
+	card.className = "we-render-error";
+	const title = doc.createElement("p");
+	title.className = "we-render-error__title";
+	title.textContent = "Couldn’t render this section.";
+	const detail = doc.createElement("p");
+	detail.className = "we-render-error__detail";
+	detail.textContent = entry.render_error?.message ?? "Unknown render error.";
+	card.appendChild(title);
+	card.appendChild(detail);
+	return card;
+}
+function buildSectionWrapper(entry, doc, markers, localize) {
+	const wrapper = doc.createElement("div");
+	wrapper.setAttribute(markers.sectionInstanceId, entry.instance_id);
+	wrapper.setAttribute("data-section-label", sectionLabel(entry));
+	wrapper.dataset.svId = entry.section_version_id;
+	wrapper.dataset.htmlHash = hashHtml(entry.html);
+	const body = doc.createElement("div");
+	body.className = "we-section-body";
+	if (entry.render_error || entry.html === null) body.appendChild(buildErrorPlaceholder(entry, doc));
+	else body.innerHTML = localize(entry.html);
+	wrapper.appendChild(body);
+	return wrapper;
+}
+
+//#endregion
+export { buildErrorPlaceholder, buildSectionWrapper, hashHtml, sectionLabel };

package/dist/canvas-core/srcdoc.d.ts

@@ -0,0 +1,8 @@
+import { CanvasAssets, MarkerAttrs } from "./types.js";
+//#region src/canvas-core/srcdoc.d.ts
+declare function localizeSectionAssets(html: string, basePath: string): string;
+declare function buildSrcdoc(assets: CanvasAssets, markers: MarkerAttrs): string;
+declare function buildSrcdocError(): string;
+declare function isCanvasScaffoldReady(doc: Document | null | undefined): boolean;
+//#endregion
+export { buildSrcdoc, buildSrcdocError, isCanvasScaffoldReady, localizeSectionAssets };

package/dist/canvas-core/srcdoc.js

@@ -0,0 +1,77 @@
+import { buildChromeCss } from "./chrome-css.js";
+
+//#region src/canvas-core/srcdoc.ts
+function jsonForScript(value) {
+	return JSON.stringify(value).replaceAll("<", "\\u003c").replaceAll(">", "\\u003e").replaceAll("&", "\\u0026");
+}
+function islandHead(assets) {
+	if (Object.keys(assets.islandMap).length === 0) return "";
+	if (Object.keys(assets.importMap).length === 0 && !assets.hostResolvesOwnImports) {
+		console.error("canvas: this template version has islands but no import map, so nothing can resolve their React — sections render statically. Republish the template to emit the vendor.");
+		return "";
+	}
+	const host = assets.hostScriptSrc ? `
+  <script id="tr-island-host" type="module" src="${assets.hostScriptSrc}"><\/script>` : "";
+	return `${Object.keys(assets.importMap).length === 0 ? "" : `
+  <script type="importmap">${jsonForScript({ imports: assets.importMap })}<\/script>`}
+  <script>window.__TR_ISLAND_MAP=${jsonForScript(assets.islandMap)};<\/script>
+  <!-- id is the contract the host's readiness gate keys off — it waits on THIS
+       element's load event, not a timeout, so a slow cold first load still
+       activates without a refresh. -->${host}`;
+}
+function localizeSectionAssets(html, basePath) {
+	return html.replaceAll("/section-assets/", `${basePath}runtime/section-asset/`);
+}
+function buildSrcdoc(assets, markers) {
+	const links = assets.stylesheets.map((href) => `<link rel="stylesheet" href="${href}">`).join("");
+	return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <base href="${assets.basePath}">
+  ${links}${islandHead(assets)}
+  <style>${buildChromeCss(markers)}</style>
+</head>
+<body>
+  <div id="we-zoom">
+    <div id="we-page"></div>
+  </div>
+  <div id="we-chrome-overlay" aria-hidden="true">
+    <div class="we-chrome-ring we-chrome-ring--hover"></div>
+    <div class="we-chrome-ring we-chrome-ring--selection"></div>
+    <div class="we-chrome-label"></div>
+  </div>
+  <div id="we-htabs"></div>
+</body>
+</html>`;
+}
+function buildSrcdocError() {
+	return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <style>
+    body { margin: 0; font-family: ui-sans-serif, system-ui, sans-serif; }
+    .we-assets-error {
+      margin: 40px; padding: 24px 28px; border-radius: 8px;
+      border: 1px solid #e6c0c0; background: #fdf4f4; color: #7a2e2e;
+      font-size: 14px; line-height: 1.5; max-width: 520px;
+    }
+    .we-assets-error strong { display: block; margin-bottom: 6px; font-size: 15px; }
+  </style>
+</head>
+<body>
+  <div class="we-assets-error" role="alert">
+    <strong>Template assets unavailable</strong>
+    This template has no published static-assets binding. Re-publish
+    the template registry, then reload the editor.
+  </div>
+</body>
+</html>`;
+}
+function isCanvasScaffoldReady(doc) {
+	return !!doc?.getElementById("we-page");
+}
+
+//#endregion
+export { buildSrcdoc, buildSrcdocError, isCanvasScaffoldReady, localizeSectionAssets };

package/dist/canvas-core/types.d.ts

@@ -0,0 +1,76 @@
+//#region src/canvas-core/types.d.ts
+/** Marker attribute names the frame stamps and reads. Injected because each
+ *  consuming repo owns its own generated copy of the marker contract. */
+interface MarkerAttrs {
+  sectionInstanceId: string;
+  slotId: string;
+  slotGroup: string;
+  slotItem: string;
+}
+/** Everything the frame needs to resolve a URL. The app derives this from its
+ *  published static-asset binding; a dev harness derives it from its own server. */
+interface CanvasAssets {
+  /** Prefix for every same-origin URL the frame emits, e.g. "/app/" or "/". */
+  basePath: string;
+  /** Stylesheet hrefs, emitted in order. Already absolute or base-relative. */
+  stylesheets: string[];
+  /** Bare-specifier -> URL, emitted as an import map. Empty means no islands. */
+  importMap: Record<string, string>;
+  /** Island key -> module URL, emitted as window.__TR_ISLAND_MAP. */
+  islandMap: Record<string, string>;
+  /** The island host module, or null to emit no host. */
+  hostScriptSrc: string | null;
+  /**
+   * True when the host module resolves its own bare specifiers — a build-time
+   * transform (a Vite dev server, say) having already rewritten every import
+   * including `react`. Such a consumer needs no import map, so an empty
+   * `importMap` is correct rather than broken.
+   *
+   * Defaults to false, which keeps the strict gate: for a host that DOES carry
+   * bare specifiers, an empty import map means its `import "react"` cannot
+   * resolve, and emitting no host at all beats emitting one that throws.
+   */
+  hostResolvesOwnImports?: boolean;
+}
+/** The subset of a rendered section the frame needs: exactly the fields the frame
+ *  reads, and no more. Field names mirror the consumer's own entry shape, so a
+ *  richer entry type satisfies this structurally and is passed unconverted. */
+interface CanvasSectionEntry {
+  instance_id: string;
+  section_version_id: string;
+  section_key: string;
+  section_display_name?: string | null;
+  html: string | null;
+  render_error?: {
+    code: string;
+    message: string;
+  } | null;
+}
+/** A resolved canvas selection. A discriminated union rather than flat optionals
+ *  so a slot selection structurally always carries its slot_id. */
+type CanvasSelection = {
+  kind: "section";
+  instance_id: string;
+} | {
+  kind: "slot";
+  instance_id: string;
+  slot_id: string;
+  /** For collection slots: the item the user clicked (the slotItem index). */
+  item_index?: number;
+};
+interface CanvasTarget {
+  selection: CanvasSelection;
+  element: HTMLElement;
+}
+/** The frame's injected dependencies. */
+interface CanvasFrameDeps {
+  markers: MarkerAttrs;
+  assets: CanvasAssets;
+  /** True when a slot may be selected. Inverted out of the kernel so it does not
+   *  pull in a consumer's slot-editor registry. Keyed on the section INSTANCE id,
+   *  not the section key: two instances of one key can pin different section
+   *  versions, so the key alone does not determine a slot's schema. */
+  isSlotEditable: (sectionInstanceId: string, slotId: string) => boolean;
+}
+//#endregion
+export { CanvasAssets, CanvasFrameDeps, CanvasSectionEntry, CanvasSelection, CanvasTarget, MarkerAttrs };

package/dist/canvas-core.d.ts

@@ -0,0 +1,9 @@
+import { CanvasAssets, CanvasFrameDeps, CanvasSectionEntry, CanvasSelection, CanvasTarget, MarkerAttrs } from "./canvas-core/types.js";
+import { LABEL_LEFT_INDENT, RING_OFFSET, RingRect, applySelectionKind, clearLabel, clearRing, cssEscape, hasMeasurableRingBox, measureRingRect, positionLabel, positionRing, ringBox } from "./canvas-core/chrome.js";
+import { HOST_INJECTED_PROPERTIES, buildChromeCss } from "./canvas-core/chrome-css.js";
+import { CanvasFrame, createCanvasFrame } from "./canvas-core/frame.js";
+import { HiddenTabSpec, TAB_TUCK, TabAnchor, WE_TAB_STEP, buildHiddenTab, placeTabs, reconcileHiddenTabs } from "./canvas-core/hidden-tabs.js";
+import { SCROLL_MARGIN_PX, ScrollRect, computeScrollTop } from "./canvas-core/scroll.js";
+import { hashHtml, sectionLabel } from "./canvas-core/section-dom.js";
+import { buildSrcdoc, buildSrcdocError, isCanvasScaffoldReady, localizeSectionAssets } from "./canvas-core/srcdoc.js";
+export { type CanvasAssets, type CanvasFrame, type CanvasFrameDeps, type CanvasSectionEntry, type CanvasSelection, type CanvasTarget, HOST_INJECTED_PROPERTIES, type HiddenTabSpec, LABEL_LEFT_INDENT, type MarkerAttrs, RING_OFFSET, type RingRect, SCROLL_MARGIN_PX, type ScrollRect, TAB_TUCK, type TabAnchor, WE_TAB_STEP, applySelectionKind, buildChromeCss, buildHiddenTab, buildSrcdoc, buildSrcdocError, clearLabel, clearRing, computeScrollTop, createCanvasFrame, cssEscape, hasMeasurableRingBox, hashHtml, isCanvasScaffoldReady, localizeSectionAssets, measureRingRect, placeTabs, positionLabel, positionRing, reconcileHiddenTabs, ringBox, sectionLabel };

package/dist/canvas-core.js

@@ -0,0 +1,9 @@
+import { LABEL_LEFT_INDENT, RING_OFFSET, applySelectionKind, clearLabel, clearRing, cssEscape, hasMeasurableRingBox, measureRingRect, positionLabel, positionRing, ringBox } from "./canvas-core/chrome.js";
+import { TAB_TUCK, WE_TAB_STEP, buildHiddenTab, placeTabs, reconcileHiddenTabs } from "./canvas-core/hidden-tabs.js";
+import { HOST_INJECTED_PROPERTIES, buildChromeCss } from "./canvas-core/chrome-css.js";
+import { hashHtml, sectionLabel } from "./canvas-core/section-dom.js";
+import { buildSrcdoc, buildSrcdocError, isCanvasScaffoldReady, localizeSectionAssets } from "./canvas-core/srcdoc.js";
+import { createCanvasFrame } from "./canvas-core/frame.js";
+import { SCROLL_MARGIN_PX, computeScrollTop } from "./canvas-core/scroll.js";
+
+export { HOST_INJECTED_PROPERTIES, LABEL_LEFT_INDENT, RING_OFFSET, SCROLL_MARGIN_PX, TAB_TUCK, WE_TAB_STEP, applySelectionKind, buildChromeCss, buildHiddenTab, buildSrcdoc, buildSrcdocError, clearLabel, clearRing, computeScrollTop, createCanvasFrame, cssEscape, hasMeasurableRingBox, hashHtml, isCanvasScaffoldReady, localizeSectionAssets, measureRingRect, placeTabs, positionLabel, positionRing, reconcileHiddenTabs, ringBox, sectionLabel };

package/dist/cli/check/css.js

@@ -1,7 +1,7 @@
 import { loadEsbuild } from "./resolve-tool.js";
-import { existsSync } from "node:fs";
-import { join } from "node:path";
 import { readdir } from "node:fs/promises";
+import { join } from "node:path";
+import { existsSync } from "node:fs";
 
 //#region src/cli/check/css.ts
 /**

package/dist/cli/check/loader.js

@@ -1,7 +1,7 @@
 import { loadEsbuild } from "./resolve-tool.js";
 import { ASSET_LOADERS, ASSET_NAMES } from "./css.js";
-import { join, relative } from "node:path";
 import { mkdir, rm, stat } from "node:fs/promises";
+import { join, relative } from "node:path";
 import { createHash } from "node:crypto";
 import { pathToFileURL } from "node:url";
 

package/dist/cli/check/stages/deps.js

@@ -1,8 +1,8 @@
 import { CHECK_CONFIG } from "../config.js";
 import { z } from "zod";
-import { join } from "node:path";
 import { promisify } from "node:util";
 import { readFile, readdir, realpath, stat } from "node:fs/promises";
+import { join } from "node:path";
 import { execFile } from "node:child_process";
 
 //#region src/cli/check/stages/deps.ts