@kumikijs/runtime 0.1.0

package/dist/index.js

@@ -0,0 +1,1682 @@
+//#region src/scenario.ts
+const settle$1 = (ms) => new Promise((r) => setTimeout(r, ms));
+async function runScenario(app, root, scenario, opts = {}) {
+	const settleMs = opts.settleMs ?? 25;
+	const steps = [];
+	let errorBuf = [];
+	const onError = (ev) => {
+		errorBuf.push(ev.message || String(ev.error));
+	};
+	const onRejection = (ev) => {
+		errorBuf.push(`unhandled rejection: ${String(ev.reason)}`);
+	};
+	const origConsoleError = console.error;
+	console.error = (...args) => {
+		errorBuf.push(args.map(String).join(" "));
+	};
+	const w = globalThis;
+	w.addEventListener?.("error", onError);
+	w.addEventListener?.("unhandledrejection", onRejection);
+	const emitBuf = [];
+	const scripts = scenario.effects ?? {};
+	const cursors = {};
+	const def = scenario.defaultEffect ?? {
+		outcome: "ok",
+		value: null
+	};
+	for (const [name, eff] of Object.entries(app.effects)) eff.invoke = async (input) => {
+		emitBuf.push({
+			effect: name,
+			args: [input]
+		});
+		const queue = scripts[name];
+		if (queue && queue.length > 0) {
+			const idx = cursors[name] ?? 0;
+			const scripted = queue[Math.min(idx, queue.length - 1)] ?? def;
+			cursors[name] = idx + 1;
+			return {
+				kind: scripted.outcome,
+				value: scripted.value ?? null
+			};
+		}
+		return {
+			kind: def.outcome,
+			value: def.value ?? null
+		};
+	};
+	const dispatchable = app;
+	try {
+		try {
+			mount(app, root);
+		} catch (e) {
+			steps.push(mkStep(void 0, "mount", [`mount threw: ${errStr$1(e)}`], [], app, root, []));
+			return finish();
+		}
+		await settle$1(settleMs);
+		for (const step of scenario.steps) {
+			errorBuf = [];
+			emitBuf.length = 0;
+			const actionDesc = step.do ? describeAction(step.do) : void 0;
+			if (step.do) {
+				try {
+					performAction(step.do, root, dispatchable);
+				} catch (e) {
+					errorBuf.push(`action threw: ${errStr$1(e)}`);
+				}
+				await settle$1(settleMs);
+			}
+			const result = mkStep(step.label, actionDesc, [...errorBuf], [...emitBuf], app, root, evaluateExpect(step.expect, errorBuf, app, root));
+			steps.push(result);
+		}
+		return finish();
+	} finally {
+		console.error = origConsoleError;
+		w.removeEventListener?.("error", onError);
+		w.removeEventListener?.("unhandledrejection", onRejection);
+	}
+	function finish() {
+		return {
+			ok: steps.every((s) => s.errors.length === 0 && s.failures.length === 0),
+			steps
+		};
+	}
+}
+function mkStep(label, action, errors, emits, app, root, failures) {
+	const step = {
+		errors,
+		emits,
+		state: snapshotState(app),
+		domText: (root.textContent ?? "").replace(/\s+/g, " ").trim(),
+		failures
+	};
+	if (label !== void 0) step.label = label;
+	if (action !== void 0) step.action = action;
+	return step;
+}
+function describeAction(a) {
+	if ("dispatch" in a) return `dispatch ${a.dispatch}`;
+	if ("clickText" in a) return `clickText "${a.clickText}"`;
+	if ("click" in a) return `click ${a.click}`;
+	if ("fill" in a) return `fill ${a.fill}="${a.value}"`;
+	if ("choose" in a) return `choose ${a.choose}="${a.value}"`;
+	return `navigate ${a.navigate}`;
+}
+function performAction(a, root, app) {
+	if ("dispatch" in a) {
+		app._dispatch?.(a.dispatch, a.payload ?? {});
+		return;
+	}
+	if ("navigate" in a) {
+		app._navigate?.(a.navigate);
+		return;
+	}
+	if ("clickText" in a) {
+		const target = Array.from(root.querySelectorAll("button, a, [role='button']")).find((e) => (e.textContent ?? "").includes(a.clickText));
+		if (!target) throw new Error(`no clickable element with text "${a.clickText}"`);
+		target.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+		return;
+	}
+	if ("click" in a) {
+		const el = root.querySelector(a.click);
+		if (!el) throw new Error(`no element matching selector ${a.click}`);
+		el.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+		return;
+	}
+	if ("fill" in a) {
+		const el = root.querySelector(a.fill);
+		if (!el) throw new Error(`no input matching selector ${a.fill}`);
+		el.value = a.value;
+		el.dispatchEvent(new Event("input", { bubbles: true }));
+		el.dispatchEvent(new Event("change", { bubbles: true }));
+		return;
+	}
+	const sel = root.querySelector(a.choose);
+	if (!sel) throw new Error(`no select matching selector ${a.choose}`);
+	const opt = Array.from(sel.options).find((o) => o.value === a.value || (o.textContent ?? "").trim() === a.value);
+	if (!opt) throw new Error(`no option "${a.value}" in select ${a.choose}`);
+	sel.value = opt.value;
+	sel.dispatchEvent(new Event("change", { bubbles: true }));
+}
+function evaluateExpect(expect, errors, app, root) {
+	if (!expect) return [];
+	const failures = [];
+	if (expect.noErrors && errors.length > 0) failures.push(`expected no errors but got: ${errors.join("; ")}`);
+	if (expect.state) {
+		const state = snapshotState(app);
+		for (const [key, want] of Object.entries(expect.state)) {
+			const got = readPath(state, key);
+			if (!matches(want, got)) failures.push(`state ${key}: expected ${j(want)}, got ${j(got)}`);
+		}
+	}
+	const text = root.textContent ?? "";
+	for (const s of expect.domIncludes ?? []) if (!text.includes(s)) failures.push(`DOM should include "${s}"`);
+	for (const s of expect.domExcludes ?? []) if (text.includes(s)) failures.push(`DOM should NOT include "${s}"`);
+	return failures;
+}
+function snapshotState(app) {
+	const live = app.live ?? {};
+	const out = {};
+	for (const [k, v] of Object.entries(live)) {
+		if (k === "route") continue;
+		out[k] = sanitize(v);
+	}
+	return out;
+}
+function sanitize(v) {
+	if (v === null || typeof v !== "object") return typeof v === "function" ? "[fn]" : v;
+	if (Array.isArray(v)) return v.map(sanitize);
+	const out = {};
+	for (const [k, val] of Object.entries(v)) {
+		if (typeof val === "function") continue;
+		out[k] = sanitize(val);
+	}
+	return out;
+}
+function readPath(obj, path) {
+	let cur = obj;
+	for (const seg of path.split(".")) {
+		if (cur === null || typeof cur !== "object") return void 0;
+		cur = cur[seg];
+	}
+	return cur;
+}
+/** Partial structural match: every key/element in `want` must be present in `got`. */
+function matches(want, got) {
+	if (want === null || typeof want !== "object") return want === got;
+	if (Array.isArray(want)) {
+		if (!Array.isArray(got) || got.length !== want.length) return false;
+		return want.every((w, i) => matches(w, got[i]));
+	}
+	if (got === null || typeof got !== "object") return false;
+	const g = got;
+	return Object.entries(want).every(([k, w]) => matches(w, g[k]));
+}
+function j(v) {
+	try {
+		return JSON.stringify(v);
+	} catch {
+		return String(v);
+	}
+}
+function errStr$1(e) {
+	return e instanceof Error ? e.message : String(e);
+}
+//#endregion
+//#region src/smoke.ts
+const settle = (ms) => new Promise((r) => setTimeout(r, ms));
+/** Position + tag + text signature: stable across re-renders of the same element. */
+function signature(el, index) {
+	const tag = el.tagName.toLowerCase();
+	const label = (el.textContent ?? "").trim().slice(0, 24);
+	return label ? `${tag}[${index}] ("${label}")` : `${tag}[${index}]`;
+}
+/**
+* Mount `app` into `root`, drive its UI, and report runtime failures.
+* Runs in any DOM environment (jsdom for CI, a real browser for the playground).
+*/
+async function smoke(app, root, opts = {}) {
+	const { interact = true, maxInteractions = 40, settleMs = 30 } = opts;
+	const issues = [];
+	let currentTrigger;
+	let phase = "mount";
+	const onError = (ev) => {
+		issues.push({
+			phase,
+			message: ev.message || String(ev.error),
+			trigger: currentTrigger
+		});
+	};
+	const onRejection = (ev) => {
+		issues.push({
+			phase: "async",
+			message: `unhandled rejection: ${String(ev.reason)}`,
+			trigger: currentTrigger
+		});
+	};
+	const origConsoleError = console.error;
+	console.error = (...args) => {
+		issues.push({
+			phase,
+			message: args.map(String).join(" "),
+			trigger: currentTrigger
+		});
+	};
+	const w = globalThis;
+	w.addEventListener?.("error", onError);
+	w.addEventListener?.("unhandledrejection", onRejection);
+	let mounted = false;
+	let rendered = false;
+	let interactions = 0;
+	let dispose;
+	try {
+		phase = "mount";
+		try {
+			dispose = mount(app, root).dispose;
+			mounted = true;
+		} catch (e) {
+			issues.push({
+				phase: "mount",
+				message: errStr(e)
+			});
+			return finish();
+		}
+		phase = "async";
+		await settle(settleMs);
+		phase = "initial-render";
+		rendered = hasContent(root);
+		if (!rendered) issues.push({
+			phase: "initial-render",
+			message: "root is empty after mount"
+		});
+		if (interact && mounted) {
+			phase = "interaction";
+			const fired = /* @__PURE__ */ new Set();
+			for (let round = 0; round < maxInteractions; round++) {
+				const next = collectInteractive(root).map((el, i) => [el, signature(el, i)]).find(([, sig]) => !fired.has(sig));
+				if (!next) break;
+				const [el, sig] = next;
+				fired.add(sig);
+				currentTrigger = `${actionFor(el)} ${sig}`;
+				try {
+					fire(el);
+				} catch (e) {
+					issues.push({
+						phase: "interaction",
+						message: errStr(e),
+						trigger: currentTrigger
+					});
+				}
+				interactions++;
+				await settle(settleMs);
+				if (!hasContent(root)) {
+					issues.push({
+						phase: "interaction",
+						message: "root became empty after interaction",
+						trigger: currentTrigger
+					});
+					break;
+				}
+			}
+			currentTrigger = void 0;
+		}
+		return finish();
+	} finally {
+		try {
+			dispose?.();
+		} catch {}
+		console.error = origConsoleError;
+		w.removeEventListener?.("error", onError);
+		w.removeEventListener?.("unhandledrejection", onRejection);
+	}
+	function finish() {
+		return {
+			ok: issues.length === 0 && mounted && rendered,
+			mounted,
+			rendered,
+			interactions,
+			issues
+		};
+	}
+}
+function hasContent(root) {
+	return root.childElementCount > 0 || (root.textContent ?? "").trim().length > 0;
+}
+function collectInteractive(root) {
+	return Array.from(root.querySelectorAll("button, input, textarea, select, [data-kumiki-bind]"));
+}
+function actionFor(el) {
+	const tag = el.tagName.toLowerCase();
+	if (tag === "select") return "change";
+	if (tag === "input" || tag === "textarea") return "input";
+	return "click";
+}
+function fire(el) {
+	const tag = el.tagName.toLowerCase();
+	if (tag === "select") {
+		const sel = el;
+		if (sel.options.length > 1) sel.selectedIndex = sel.options.length - 1;
+		sel.dispatchEvent(new Event("change", { bubbles: true }));
+		return;
+	}
+	if (tag === "textarea") {
+		el.value = "smoke";
+		el.dispatchEvent(new Event("input", { bubbles: true }));
+		return;
+	}
+	if (tag === "input") {
+		const inp = el;
+		if (inp.type === "checkbox" || inp.type === "radio") el.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+		else {
+			inp.value = "smoke";
+			el.dispatchEvent(new Event("input", { bubbles: true }));
+			el.dispatchEvent(new Event("change", { bubbles: true }));
+		}
+		return;
+	}
+	el.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+}
+function errStr(e) {
+	if (e instanceof Error) return e.stack ? `${e.message}\n${e.stack.split("\n")[1]?.trim() ?? ""}` : e.message;
+	return String(e);
+}
+//#endregion
+//#region src/index.ts
+function parseLocation(routes, loc) {
+	const path = loc.pathname || "/";
+	const query = {};
+	const params = new URLSearchParams(loc.search);
+	for (const [k, v] of params.entries()) query[k] = v;
+	const hash = loc.hash ? loc.hash.slice(1) : null;
+	if (!routes) return {
+		path,
+		pattern: path,
+		params: {},
+		query,
+		hash
+	};
+	for (const r of routes) {
+		if ("redirectTo" in r) continue;
+		const m = matchPattern(r.pattern, path);
+		if (m) return {
+			path,
+			pattern: r.pattern,
+			params: m,
+			query,
+			hash
+		};
+	}
+	return {
+		path,
+		pattern: "/404",
+		params: {},
+		query,
+		hash
+	};
+}
+function matchPattern(pattern, path) {
+	if (pattern === "/404") return null;
+	const patSegs = pattern.split("/").filter(Boolean);
+	const pathSegs = path.split("/").filter(Boolean);
+	const params = {};
+	for (let i = 0; i < patSegs.length; i++) {
+		const p = patSegs[i];
+		if (p === "*") return params;
+		const s = pathSegs[i];
+		if (s === void 0) return null;
+		if (p.startsWith(":")) params[p.slice(1)] = decodeURIComponent(s);
+		else if (p !== s) return null;
+	}
+	if (pathSegs.length !== patSegs.length) return null;
+	return params;
+}
+function emptyRoute() {
+	return {
+		path: "/",
+		pattern: "/",
+		params: {},
+		query: {},
+		hash: null
+	};
+}
+function mount(app, target) {
+	if (!app.live) {
+		app.live = {};
+		for (const [k, v] of Object.entries(app.slots)) app.live[k] = v.value;
+	}
+	if (!("route" in app.live)) app.live.route = emptyRoute();
+	const slotValues = app.live;
+	const dispatcher = makeEffectDispatcher(app, makeCapabilityRegistry(app.caps), (effect, outcome, value, key) => {
+		handleEffectResult(effect, outcome, value, key);
+	});
+	let currentRoot = null;
+	let disposed = false;
+	const render = () => {
+		if (disposed) return;
+		let snap = null;
+		const active = document.activeElement;
+		if (active && (active.tagName === "INPUT" || active.tagName === "TEXTAREA") && target.contains(active)) {
+			const el = active;
+			snap = {
+				bind: el.dataset.kumikiBind ?? void 0,
+				id: el.id || void 0,
+				path: domPath(el, target),
+				selStart: el.selectionStart,
+				selEnd: el.selectionEnd
+			};
+		}
+		maybeReapplyTheme(app);
+		const dom = renderTile(pickRootTile(app));
+		if (currentRoot) target.replaceChild(dom, currentRoot);
+		else target.appendChild(dom);
+		currentRoot = dom;
+		if (snap) {
+			let sel = snap.bind ? target.querySelector(`[data-kumiki-bind="${snap.bind}"]`) : snap.id ? target.querySelector(`#${CSS.escape(snap.id)}`) : null;
+			if (!sel && snap.path) sel = elementAtPath(snap.path, target);
+			if (sel && (sel.tagName === "INPUT" || sel.tagName === "TEXTAREA")) {
+				const el = sel;
+				el.focus();
+				if (snap.selStart !== null && snap.selEnd !== null) try {
+					el.setSelectionRange(snap.selStart, snap.selEnd);
+				} catch {}
+			}
+		}
+	};
+	function pickRootTile(app) {
+		if (app.routes && app.routes.length > 0) {
+			const cur = slotValues.route;
+			for (const r of app.routes) if (r.pattern === cur.pattern && "tile" in r) return r.tile();
+			for (const r of app.routes) if (r.pattern === "/404" && "tile" in r) return r.tile();
+		}
+		return app.root ? app.root() : {
+			kind: "text",
+			text: "(no root)"
+		};
+	}
+	function applyReducer(r, payload) {
+		if (disposed) return;
+		const result = r.apply(slotValues, payload);
+		for (const [k, v] of Object.entries(result.slots)) {
+			const meta = app.slots[k];
+			if (meta?.refine && !meta.refine(v)) continue;
+			slotValues[k] = v;
+		}
+		for (const emit of result.emits) dispatcher.dispatch(emit);
+		render();
+	}
+	function handleEffectResult(effect, outcome, value, key) {
+		for (const r of app.reducers) if (r.event.kind === "effect" && r.event.effect === effect && r.event.outcome === outcome) applyReducer(r, {
+			$1: value,
+			$2: key
+		});
+	}
+	function updateRoute(newPath, replace) {
+		if (replace) history.replaceState(null, "", newPath);
+		else history.pushState(null, "", newPath);
+		syncRouteFromLocation();
+	}
+	function syncRouteFromLocation() {
+		const oldRoute = slotValues.route;
+		const newRoute = parseLocation(app.routes, location);
+		slotValues.route = newRoute;
+		if (oldRoute && oldRoute.pattern !== newRoute.pattern) {
+			for (const r of app.reducers) if (r.event.kind === "lifecycle" && r.event.name === `route.leave(${JSON.stringify(oldRoute.pattern)})`) applyReducer(r, { $route: oldRoute });
+		}
+		for (const r of app.reducers) if (r.event.kind === "lifecycle" && r.event.name === `route.enter(${JSON.stringify(newRoute.pattern)})`) applyReducer(r, { $route: newRoute });
+		render();
+	}
+	registerBuiltinEffects(app, updateRoute, () => slotValues, () => render());
+	lastAppliedThemeName = null;
+	applyThemeDefaults(app);
+	lastAppliedThemeName = app.live?.[app.themeName ?? ""] ?? app.themeName ?? null;
+	if (app.routes && app.routes.length > 0) {
+		for (const r of app.routes) if ("redirectTo" in r && matchPattern(r.pattern, location.pathname)) {
+			history.replaceState(null, "", r.redirectTo);
+			break;
+		}
+		slotValues.route = parseLocation(app.routes, location);
+		window.addEventListener("popstate", () => syncRouteFromLocation());
+	}
+	app._rerender = render;
+	app._dispatch = (reducerName, el) => {
+		const r = app.reducers.find((x) => x.name === reducerName);
+		if (!r) return;
+		applyReducer(r, {
+			$el: el,
+			$event: el
+		});
+	};
+	app._setSlot = (name, value) => {
+		const meta = app.slots[name];
+		if (meta?.refine && !meta.refine(value)) return;
+		slotValues[name] = value;
+		render();
+	};
+	app._navigate = (path, replace) => {
+		updateRoute(path, !!replace);
+	};
+	for (const emit of app.init) dispatcher.dispatch(emit);
+	for (const r of app.reducers) if (r.event.kind === "lifecycle" && r.event.name === "app.start") applyReducer(r, {});
+	const timerHandles = [];
+	for (const r of app.reducers) if (r.event.kind === "timer") {
+		const handle = setInterval(() => applyReducer(r, {}), r.event.intervalMs);
+		timerHandles.push(handle);
+	}
+	if (app.routes && app.routes.length > 0) {
+		const cur = slotValues.route;
+		for (const r of app.reducers) if (r.event.kind === "lifecycle" && r.event.name === `route.enter(${JSON.stringify(cur.pattern)})`) applyReducer(r, { $route: cur });
+	}
+	render();
+	return { dispose: () => {
+		disposed = true;
+		for (const h of timerHandles) clearInterval(h);
+		target.replaceChildren();
+		dispatcher.dispose();
+	} };
+}
+function makeCapabilityRegistry(allowed) {
+	const ok = new Set(allowed);
+	return { has: (c) => ok.has(c) };
+}
+function makeEffectDispatcher(app, caps, onResult) {
+	const state = {
+		inflight: /* @__PURE__ */ new Map(),
+		timers: /* @__PURE__ */ new Map(),
+		onceSeen: /* @__PURE__ */ new Map()
+	};
+	const launch = async (eff, input, key) => {
+		if (!caps.has(eff.cap)) {
+			console.warn(`Capability "${eff.cap}" not declared in app.caps`);
+			return;
+		}
+		try {
+			const res = await eff.invoke(input, caps);
+			onResult(eff.name, res.kind, res.value, input);
+		} catch (e) {
+			onResult(eff.name, "err", { message: String(e) }, input);
+		} finally {
+			if (state.inflight.get(`${eff.name}:${key}`)) state.inflight.delete(`${eff.name}:${key}`);
+		}
+	};
+	return {
+		dispatch(emit) {
+			const eff = app.effects[emit.effect];
+			if (!eff) return;
+			const input = emit.args[0];
+			const policy = eff.policy ?? { kind: "default" };
+			const keyOf = (input) => {
+				if (policy.kind === "latest-per-key") return policy.keyOf(input);
+				return "_";
+			};
+			const key = keyOf(input);
+			const id = `${eff.name}:${key}`;
+			if (policy.kind === "once") {
+				const seen = state.onceSeen.get(eff.name) ?? /* @__PURE__ */ new Set();
+				const k = JSON.stringify(input ?? null);
+				if (seen.has(k)) return;
+				seen.add(k);
+				state.onceSeen.set(eff.name, seen);
+				launch(eff, input, key);
+				return;
+			}
+			if (policy.kind === "debounce") {
+				const t = state.timers.get(id);
+				if (t) clearTimeout(t);
+				state.timers.set(id, setTimeout(() => {
+					state.timers.delete(id);
+					launch(eff, input, key);
+				}, policy.ms));
+				return;
+			}
+			if (policy.kind === "throttle") {
+				if (state.timers.has(id)) return;
+				state.timers.set(id, setTimeout(() => state.timers.delete(id), policy.ms));
+				launch(eff, input, key);
+				return;
+			}
+			if (policy.kind === "latest" || policy.kind === "latest-per-key") {
+				const ic = state.inflight.get(id);
+				if (ic) ic.abort();
+				const ctl = new AbortController();
+				state.inflight.set(id, ctl);
+				launch(eff, input, key);
+				return;
+			}
+			launch(eff, input, key);
+		},
+		dispose() {
+			for (const t of state.timers.values()) clearTimeout(t);
+			state.timers.clear();
+			for (const c of state.inflight.values()) c.abort();
+			state.inflight.clear();
+		}
+	};
+}
+function registerBuiltinEffects(app, navigate, getLive, rerender) {
+	app.effects.navigate = {
+		name: "navigate",
+		cap: "nav.push",
+		invoke: async (input) => {
+			navigate(buildPath(input), false);
+			return {
+				kind: "ok",
+				value: null
+			};
+		}
+	};
+	app.effects["navigate-replace"] = {
+		name: "navigate-replace",
+		cap: "nav.replace",
+		invoke: async (input) => {
+			navigate(buildPath(input), true);
+			return {
+				kind: "ok",
+				value: null
+			};
+		}
+	};
+	app.effects["navigate-back"] = {
+		name: "navigate-back",
+		cap: "nav.back",
+		invoke: async () => {
+			history.back();
+			return {
+				kind: "ok",
+				value: null
+			};
+		}
+	};
+	app.effects.toast = {
+		name: "toast",
+		cap: "notification.show",
+		invoke: async (input) => {
+			const t = input;
+			const banner = document.createElement("div");
+			banner.style.cssText = "position:fixed;bottom:24px;right:24px;padding:8px 16px;background:#1a1a1a;color:#fff;border-radius:8px;z-index:9999;";
+			banner.textContent = t.text ?? "";
+			document.body.appendChild(banner);
+			setTimeout(() => banner.remove(), 3e3);
+			return {
+				kind: "ok",
+				value: null
+			};
+		}
+	};
+	app.effects.log = {
+		name: "log",
+		cap: "log.write",
+		invoke: async (input) => {
+			console.log("[kumiki]", input);
+			return {
+				kind: "ok",
+				value: null
+			};
+		}
+	};
+}
+function buildPath(x) {
+	let p = x.path;
+	if (x.params) for (const [k, v] of Object.entries(x.params)) {
+		p = p.replace(`{${k}}`, encodeURIComponent(v));
+		p = p.replace(`:${k}`, encodeURIComponent(v));
+	}
+	if (x.query) {
+		const q = new URLSearchParams(x.query).toString();
+		if (q) p += `?${q}`;
+	}
+	return p;
+}
+/** Record the child-index chain from `root` down to `el`, for focus restore. */
+function domPath(el, root) {
+	const path = [];
+	let cur = el;
+	while (cur && cur !== root) {
+		const parent = cur.parentElement;
+		if (!parent) break;
+		path.unshift(Array.prototype.indexOf.call(parent.children, cur));
+		cur = parent;
+	}
+	return path;
+}
+/** Re-walk a child-index chain produced by domPath to find the element. */
+function elementAtPath(path, root) {
+	let cur = root;
+	for (const idx of path) {
+		if (!cur) return null;
+		cur = cur.children[idx] ?? null;
+	}
+	return cur;
+}
+function _setPathHelper(obj, path, value) {
+	if (path.length === 0) return value;
+	const [head, ...rest] = path;
+	const cur = obj && typeof obj === "object" ? obj : {};
+	return {
+		...cur,
+		[head]: _setPathHelper(cur[head], rest, value)
+	};
+}
+function renderTile(node) {
+	switch (node.kind) {
+		case "page":
+		case "column": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = node.kind;
+			div.style.display = "flex";
+			div.style.flexDirection = "column";
+			applyContainerProps(div, node.props);
+			for (const child of node.children) if (child != null) div.appendChild(renderTile(child));
+			return div;
+		}
+		case "row": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = "row";
+			div.style.display = "flex";
+			div.style.flexDirection = "row";
+			applyContainerProps(div, node.props);
+			for (const child of node.children) if (child != null) div.appendChild(renderTile(child));
+			return div;
+		}
+		case "card":
+		case "box":
+		case "panel":
+		case "fieldset":
+		case "stack":
+		case "region":
+		case "scroll": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = node.kind;
+			if (node.kind === "card") {
+				if (!node.props || node.props.pad === void 0) div.style.padding = "16px";
+				div.style.marginBottom = "12px";
+				div.style.borderRadius = "8px";
+			}
+			if (node.kind === "scroll") div.style.overflow = "auto";
+			if (node.kind === "stack") {
+				div.style.display = "flex";
+				div.style.flexDirection = "column";
+			}
+			applyContainerProps(div, node.props);
+			for (const child of node.children) if (child != null) div.appendChild(renderTile(child));
+			return div;
+		}
+		case "grid": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = "grid";
+			div.style.display = "grid";
+			const cols = node.props?.cols;
+			if (typeof cols === "number") div.style.gridTemplateColumns = `repeat(${cols}, 1fr)`;
+			else if (typeof cols === "string") div.style.gridTemplateColumns = cols;
+			else div.style.gridTemplateColumns = "repeat(3, 1fr)";
+			applyContainerProps(div, node.props);
+			for (const child of node.children) if (child != null) div.appendChild(renderTile(child));
+			return div;
+		}
+		case "divider": {
+			const hr = document.createElement("hr");
+			hr.dataset.kumikiTile = "divider";
+			return hr;
+		}
+		case "heading": {
+			const h = document.createElement("h1");
+			h.dataset.kumikiTile = "heading";
+			h.textContent = node.text;
+			applyTextProps(h, node.props);
+			return h;
+		}
+		case "text": {
+			const span = document.createElement("span");
+			span.dataset.kumikiTile = "text";
+			span.textContent = node.text;
+			applyTextProps(span, node.props);
+			return span;
+		}
+		case "button": {
+			const b = document.createElement("button");
+			b.dataset.kumikiTile = "button";
+			b.textContent = node.text;
+			if (node.disabled) b.disabled = true;
+			if (node.props?.onClick) b.addEventListener("click", (e) => {
+				e.preventDefault();
+				node.props?.onClick?.(node.props?.el ?? {});
+			});
+			return b;
+		}
+		case "input": {
+			const inp = document.createElement("input");
+			inp.dataset.kumikiTile = "input";
+			inp.type = node.type ?? "text";
+			if (node.placeholder) inp.placeholder = node.placeholder;
+			if (node.required) inp.required = true;
+			if (node.autoFocus) inp.autofocus = true;
+			if (node.id) inp.id = node.id;
+			if (node.bind) {
+				const fullPath = node.bindPath && node.bindPath.length > 0 ? `${node.bind}.${node.bindPath.join(".")}` : node.bind;
+				inp.dataset.kumikiBind = fullPath;
+			}
+			inp.value = node.value ?? "";
+			if (node.bind) {
+				const slotName = node.bind;
+				const bindPath = node.bindPath;
+				inp.addEventListener("input", () => {
+					const app = window.__kumikiApp;
+					if (!app?._setSlot) return;
+					if (bindPath && bindPath.length > 0) {
+						const next = _setPathHelper(app.live?.[slotName] ?? {}, bindPath, inp.value);
+						app._setSlot(slotName, next);
+					} else app._setSlot(slotName, inp.value);
+				});
+			}
+			if (node.props?.onInput) inp.addEventListener("input", () => {
+				node.props?.onInput?.({
+					...node.props?.el ?? {},
+					value: inp.value
+				});
+			});
+			if (node.props?.onChange) inp.addEventListener("change", () => {
+				node.props?.onChange?.({
+					...node.props?.el ?? {},
+					value: inp.value
+				});
+			});
+			return inp;
+		}
+		case "textarea": {
+			const ta = document.createElement("textarea");
+			ta.dataset.kumikiTile = "textarea";
+			if (node.rows) ta.rows = node.rows;
+			if (node.placeholder) ta.placeholder = node.placeholder;
+			if (node.id) ta.id = node.id;
+			if (node.bind) {
+				const fullPath = node.bindPath && node.bindPath.length > 0 ? `${node.bind}.${node.bindPath.join(".")}` : node.bind;
+				ta.dataset.kumikiBind = fullPath;
+			}
+			ta.value = node.value ?? "";
+			if (node.bind) {
+				const slotName = node.bind;
+				const bindPath = node.bindPath;
+				ta.addEventListener("input", () => {
+					const app = window.__kumikiApp;
+					if (!app?._setSlot) return;
+					if (bindPath && bindPath.length > 0) {
+						const next = _setPathHelper(app.live?.[slotName] ?? {}, bindPath, ta.value);
+						app._setSlot(slotName, next);
+					} else app._setSlot(slotName, ta.value);
+				});
+			}
+			return ta;
+		}
+		case "check": {
+			const wrap = document.createElement("label");
+			wrap.dataset.kumikiTile = "check";
+			const inp = document.createElement("input");
+			inp.type = "checkbox";
+			inp.checked = node.checked;
+			if (node.props?.onClick) inp.addEventListener("change", () => {
+				node.props?.onClick?.(node.props?.el ?? {});
+			});
+			wrap.appendChild(inp);
+			return wrap;
+		}
+		case "spinner": {
+			const span = document.createElement("span");
+			span.dataset.kumikiTile = "spinner";
+			span.textContent = "…";
+			return span;
+		}
+		case "select": {
+			const sel = document.createElement("select");
+			sel.dataset.kumikiTile = "select";
+			const options = node.options ?? [];
+			const currentValue = node.value;
+			const valueKey = (v) => {
+				if (v && typeof v === "object" && "_tag" in v) {
+					const t = v;
+					const parts = [String(t._tag)];
+					for (let i = 0; `_${i}` in t; i++) parts.push(valueKey(t[`_${i}`]));
+					return parts.join("|");
+				}
+				return JSON.stringify(v);
+			};
+			const currentKey = valueKey(currentValue);
+			if (node.placeholder) {
+				const ph = document.createElement("option");
+				ph.value = "";
+				ph.textContent = String(node.placeholder);
+				ph.disabled = true;
+				if (currentValue == null) ph.selected = true;
+				sel.appendChild(ph);
+			}
+			for (const opt of options) {
+				const o = document.createElement("option");
+				const k = valueKey(opt.value);
+				o.value = k;
+				o.textContent = String(opt.label);
+				if (k === currentKey) o.selected = true;
+				sel.appendChild(o);
+			}
+			sel.addEventListener("change", () => {
+				const k = sel.value;
+				const matched = options.find((o) => valueKey(o.value) === k);
+				if (matched === void 0) return;
+				const app = window.__kumikiApp;
+				if (node.bind && app?._setSlot) {
+					const slotName = node.bind;
+					const bindPath = node.bindPath;
+					if (bindPath && bindPath.length > 0) {
+						const next = _setPathHelper(app.live?.[slotName] ?? {}, bindPath, matched.value);
+						app._setSlot(slotName, next);
+					} else app._setSlot(slotName, matched.value);
+				}
+				if (node.props?.onChange) node.props.onChange({
+					...node.props.el ?? {},
+					value: matched.value
+				});
+			});
+			return sel;
+		}
+		case "radio": {
+			const wrap = document.createElement("label");
+			wrap.dataset.kumikiTile = "radio";
+			const inp = document.createElement("input");
+			inp.type = "radio";
+			if (node.group) inp.name = String(node.group);
+			inp.checked = !!node.selected;
+			const labelText = node.props?.label ?? "";
+			wrap.appendChild(inp);
+			if (labelText) {
+				const span = document.createElement("span");
+				span.textContent = labelText;
+				wrap.appendChild(span);
+			}
+			if (node.props?.onClick) inp.addEventListener("change", () => {
+				node.props?.onClick?.(node.props?.el ?? {});
+			});
+			return wrap;
+		}
+		case "skeleton": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = "skeleton";
+			div.style.background = "#eee";
+			div.style.borderRadius = "8px";
+			div.style.minHeight = "60px";
+			const h = node.props?.h;
+			if (typeof h === "number") div.style.height = `${h}px`;
+			return div;
+		}
+		case "form": {
+			const form = document.createElement("form");
+			form.dataset.kumikiTile = "form";
+			form.addEventListener("submit", (e) => {
+				e.preventDefault();
+				if (node.props?.onSubmit) node.props.onSubmit(node.props.el ?? {});
+			});
+			for (const child of node.children) if (child != null) form.appendChild(renderTile(child));
+			return form;
+		}
+		case "label": {
+			const lbl = document.createElement("label");
+			lbl.dataset.kumikiTile = "label";
+			lbl.textContent = node.text;
+			const forAttr = node.props?.for;
+			if (typeof forAttr === "string") lbl.htmlFor = forAttr;
+			return lbl;
+		}
+		case "link": {
+			const a = document.createElement("a");
+			a.dataset.kumikiTile = "link";
+			a.href = node.to;
+			a.textContent = node.text;
+			a.addEventListener("click", (e) => {
+				if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;
+				e.preventDefault();
+				const nav = window.__kumikiApp?._navigate;
+				if (nav) nav(node.to, false);
+			});
+			return a;
+		}
+		case "markdown": {
+			const div = document.createElement("div");
+			div.dataset.kumikiTile = "markdown";
+			const paragraphs = (node.text ?? "").split(/\n\s*\n/);
+			for (const para of paragraphs) {
+				const p = document.createElement("p");
+				p.textContent = para.trim();
+				p.style.whiteSpace = "pre-wrap";
+				div.appendChild(p);
+			}
+			return div;
+		}
+		case "image": {
+			const img = document.createElement("img");
+			img.dataset.kumikiTile = "image";
+			img.src = node.src;
+			const alt = node.props?.alt;
+			if (typeof alt === "string") img.alt = alt;
+			return img;
+		}
+		case "icon": {
+			const span = document.createElement("span");
+			span.dataset.kumikiTile = "icon";
+			span.textContent = `[${node.name}]`;
+			return span;
+		}
+	}
+}
+function applyContainerProps(el, props) {
+	if (!props) return;
+	applyResponsive(el, props.gap, (v) => el.style.gap = mapToken(String(v)));
+	applyResponsive(el, props.align, (v) => el.style.alignItems = mapAlign(String(v)));
+	applyResponsive(el, props.justify, (v) => el.style.justifyContent = mapJustify(String(v)));
+	applyResponsive(el, props.pad, (v) => el.style.padding = mapToken(String(v)));
+	const mw = props["max-w"] ?? props.maxWidth;
+	if (mw !== void 0) el.style.maxWidth = typeof mw === "number" ? `${mw}px` : String(mw);
+	if (typeof props.bg === "string") el.style.background = mapColor(props.bg);
+	if (typeof props.radius === "string") el.style.borderRadius = mapToken(props.radius);
+	applyStateStyles(el, props);
+	applyTransition(el, props);
+}
+/** Apply a value that may be a literal or a responsive `{base, sm, md, lg, xl}` map. */
+function applyResponsive(_el, raw, set) {
+	if (raw === void 0 || raw === null) return;
+	if (typeof raw !== "object" || Array.isArray(raw)) {
+		set(raw);
+		return;
+	}
+	const m = raw;
+	if (m.base !== void 0) set(m.base);
+	for (const [bp, q] of [
+		["xl", "(min-width: 1280px)"],
+		["lg", "(min-width: 1024px)"],
+		["md", "(min-width: 768px)"],
+		["sm", "(min-width: 640px)"]
+	]) if (m[bp] !== void 0 && window.matchMedia(q).matches) {
+		set(m[bp]);
+		return;
+	}
+}
+let animationStylesInjected = false;
+function ensureAnimationStyles() {
+	if (animationStylesInjected) return;
+	animationStylesInjected = true;
+	const css = `
+@keyframes kumiki-fade { from { opacity: 0 } to { opacity: 1 } }
+@keyframes kumiki-slide-up { from { transform: translateY(8px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
+@keyframes kumiki-slide-down { from { transform: translateY(-8px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
+.kumiki-anim { animation-fill-mode: both; animation-timing-function: ease; animation-duration: 300ms; }
+.kumiki-anim-fade { animation-name: kumiki-fade; }
+.kumiki-anim-slide-up { animation-name: kumiki-slide-up; }
+.kumiki-anim-slide-down { animation-name: kumiki-slide-down; }
+.kumiki-anim-fast { animation-duration: 150ms; }
+.kumiki-anim-normal { animation-duration: 300ms; }
+.kumiki-anim-slow { animation-duration: 600ms; }
+`;
+	const style = document.createElement("style");
+	style.id = "kumiki-animations";
+	style.appendChild(document.createTextNode(css));
+	document.head.appendChild(style);
+}
+function applyTransition(el, props) {
+	if (!props) return;
+	const t = props.transition;
+	if (typeof t !== "string") return;
+	ensureAnimationStyles();
+	el.classList.add("kumiki-anim", `kumiki-anim-${t}`);
+	const d = props["transition-duration"];
+	if (typeof d === "string") el.classList.add(`kumiki-anim-${d}`);
+}
+let stateStyleSeq = 0;
+let stateStylesEl = null;
+function applyStateStyles(el, props) {
+	for (const state of [
+		"hover",
+		"focus",
+		"active",
+		"disabled",
+		"selected"
+	]) {
+		const sub = props[state];
+		if (!sub || typeof sub !== "object" || Array.isArray(sub)) continue;
+		const id = `s${++stateStyleSeq}`;
+		el.dataset.kumikiState = el.dataset.kumikiState ? `${el.dataset.kumikiState} ${id}` : id;
+		const decls = stateStyleDecls(sub);
+		if (!stateStylesEl) {
+			stateStylesEl = document.createElement("style");
+			stateStylesEl.id = "kumiki-state-styles";
+			document.head.appendChild(stateStylesEl);
+		}
+		const selector = state === "hover" ? ":hover" : state === "focus" ? ":focus" : state === "active" ? ":active" : state === "disabled" ? ":disabled" : "[data-kumiki-selected]";
+		stateStylesEl.appendChild(document.createTextNode(`[data-kumiki-state~="${id}"]${selector} { ${decls} }\n`));
+	}
+}
+function stateStyleDecls(sub) {
+	const decls = [];
+	if (typeof sub.bg === "string") decls.push(`background: ${mapColor(sub.bg)}`);
+	if (typeof sub.color === "string") decls.push(`color: ${mapColor(sub.color)}`);
+	if (typeof sub.shadow === "string") decls.push(`box-shadow: ${sub.shadow}`);
+	return decls.join("; ");
+}
+function applyTextProps(el, props) {
+	if (!props) return;
+	if (props.strike) el.style.textDecoration = "line-through";
+	if (typeof props.color === "string") el.style.color = mapColor(props.color);
+	if (typeof props.size === "string") el.style.fontSize = mapSize(props.size);
+	if (props.weight === "bold") el.style.fontWeight = "700";
+	applyStateStyles(el, props);
+}
+let lastAppliedThemeName = null;
+function maybeReapplyTheme(app) {
+	let name = app.themeName;
+	if (name && app.themes && !(name in app.themes) && app.live && typeof app.live[name] === "string") name = app.live[name];
+	if (name === lastAppliedThemeName) return;
+	lastAppliedThemeName = name ?? null;
+	applyThemeDefaults(app);
+}
+function applyThemeDefaults(app) {
+	window.__kumikiApp = app;
+	const theme = currentTheme();
+	if (!theme) return;
+	const colors = theme.colors ?? {};
+	const typography = theme.typography ?? {};
+	const sizes = typography.size ?? {};
+	if (typeof colors.bg === "string") document.body.style.background = colors.bg;
+	if (typeof colors.fg === "string") document.body.style.color = colors.fg;
+	if (typeof typography.family === "string") document.body.style.fontFamily = typography.family;
+	if (typeof sizes.md === "string") document.body.style.fontSize = sizes.md;
+	if (typeof typography["line-height"] === "string") document.body.style.lineHeight = String(typography["line-height"]);
+	const prior = document.getElementById("kumiki-theme-base");
+	if (prior) prior.remove();
+	const css = document.createElement("style");
+	css.id = "kumiki-theme-base";
+	css.appendChild(document.createTextNode(`
+[data-kumiki-tile="card"] {
+  background: ${typeof colors.surface === "string" ? colors.surface : "#fff"};
+  border: 1px solid ${typeof colors.border === "string" ? colors.border : "#e0e0e0"};
+  box-shadow: ${themeShadow(theme, "sm") ?? "0 1px 2px rgba(0,0,0,0.08)"};
+}
+[data-kumiki-tile="button"] {
+  background: ${typeof colors.surface === "string" ? colors.surface : "#fff"};
+  color: ${typeof colors.fg === "string" ? colors.fg : "#1a1a1a"};
+  border: 1px solid ${typeof colors.border === "string" ? colors.border : "#ddd"};
+  padding: 6px 12px;
+  cursor: pointer;
+  border-radius: ${themeRadius(theme, "md") ?? "8px"};
+}
+[data-kumiki-tile="button"]:hover { filter: brightness(0.97); }
+[data-kumiki-tile="input"], [data-kumiki-tile="textarea"] {
+  font: inherit;
+  padding: 6px 10px;
+  border: 1px solid ${typeof colors.border === "string" ? colors.border : "#ddd"};
+  border-radius: ${themeRadius(theme, "sm") ?? "4px"};
+  background: ${typeof colors.surface === "string" ? colors.surface : "#fff"};
+  color: ${typeof colors.fg === "string" ? colors.fg : "#1a1a1a"};
+}
+[data-kumiki-tile="input"]:focus, [data-kumiki-tile="textarea"]:focus {
+  outline: 2px solid ${typeof colors.primary === "string" ? colors.primary : "#0070f3"};
+  outline-offset: 1px;
+}
+[data-kumiki-tile="link"] {
+  color: ${typeof colors.primary === "string" ? colors.primary : "#0070f3"};
+  text-decoration: none;
+}
+[data-kumiki-tile="link"]:hover { text-decoration: underline; }
+[data-kumiki-tile="heading"] {
+  font-size: ${typeof sizes.xl === "string" ? sizes.xl : "28px"};
+  font-weight: 700;
+  margin: 0 0 8px;
+}
+[data-kumiki-tile="markdown"] p { margin: 0 0 12px; }
+`));
+	document.head.appendChild(css);
+}
+function themeShadow(theme, key) {
+	const shadow = theme.shadow;
+	if (shadow && typeof shadow === "object" && !Array.isArray(shadow)) {
+		const v = shadow[key];
+		if (typeof v === "string") return v;
+	}
+}
+function themeRadius(theme, key) {
+	const radius = theme.radius;
+	if (radius && typeof radius === "object" && !Array.isArray(radius)) {
+		const v = radius[key];
+		if (typeof v === "string") return v;
+	}
+}
+function currentTheme() {
+	const app = window.__kumikiApp;
+	if (!app?.themes) return null;
+	let name = app.themeName;
+	if (name && !(name in app.themes) && app.live && typeof app.live[name] === "string") name = app.live[name];
+	if (!name) name = Object.keys(app.themes)[0];
+	if (!name) return null;
+	return app.themes[name] ?? null;
+}
+function mapToken(t) {
+	const theme = currentTheme();
+	if (theme?.spacing && typeof theme.spacing === "object") {
+		const sec = theme.spacing;
+		if (t in sec) {
+			const v = sec[t];
+			if (typeof v === "string") return v;
+			if (typeof v === "number") return `${v}px`;
+		}
+	}
+	switch (t) {
+		case "xs": return "4px";
+		case "sm": return "8px";
+		case "md": return "16px";
+		case "lg": return "24px";
+		case "xl": return "40px";
+		case "xxl": return "64px";
+		default: return t;
+	}
+}
+function mapAlign(a) {
+	switch (a) {
+		case "start": return "flex-start";
+		case "end": return "flex-end";
+		case "center": return "center";
+		case "stretch": return "stretch";
+		default: return a;
+	}
+}
+function mapJustify(a) {
+	switch (a) {
+		case "start": return "flex-start";
+		case "end": return "flex-end";
+		case "center": return "center";
+		case "between": return "space-between";
+		case "around": return "space-around";
+		default: return a;
+	}
+}
+function mapColor(c) {
+	const theme = currentTheme();
+	if (theme?.colors && typeof theme.colors === "object") {
+		const sec = theme.colors;
+		if (c in sec) {
+			const v = sec[c];
+			if (typeof v === "string") return v;
+		}
+	}
+	switch (c) {
+		case "muted": return "#888";
+		case "danger": return "#c4222a";
+		case "primary": return "#0070f3";
+		case "fg": return "#1a1a1a";
+		case "surface": return "#f7f7f7";
+		default: return c;
+	}
+}
+function mapSize(s) {
+	const theme = currentTheme();
+	if (theme?.typography && typeof theme.typography === "object") {
+		const sz = theme.typography.size;
+		if (sz && typeof sz === "object" && !Array.isArray(sz) && s in sz) {
+			const v = sz[s];
+			if (typeof v === "string") return v;
+			if (typeof v === "number") return `${v}px`;
+		}
+	}
+	switch (s) {
+		case "sm": return "14px";
+		case "md": return "16px";
+		case "lg": return "20px";
+		case "xl": return "28px";
+		case "xxl": return "40px";
+		default: return s;
+	}
+}
+const _stdlib = {
+	mapSize(m) {
+		if (m instanceof Map) return m.size;
+		if (m && typeof m === "object") return Object.keys(m).length;
+		return 0;
+	},
+	mapKeys(m) {
+		return m ? Object.keys(m) : [];
+	},
+	mapValues(m) {
+		return m ? Object.values(m) : [];
+	},
+	mapEntries(m) {
+		return m ? Object.entries(m) : [];
+	},
+	mapGet(m, k) {
+		return m ? m[k] : void 0;
+	},
+	/** Polymorphic `.get-or(default)` for Option-like values. */
+	getOr(v, fallback) {
+		if (v && typeof v === "object" && "_tag" in v) {
+			const tagged = v;
+			if (tagged._tag === "Some" || tagged._tag === "Ok") return tagged._0;
+			if (tagged._tag === "None" || tagged._tag === "Err") return fallback;
+		}
+		return v ?? fallback;
+	},
+	mapGetOr(m, k, def) {
+		if (m && k in m) return m[k];
+		return def;
+	},
+	mapInsert(m, k, v) {
+		return {
+			...m,
+			[k]: v
+		};
+	},
+	mapRemove(m, k) {
+		const out = {};
+		for (const [kk, vv] of Object.entries(m ?? {})) if (kk !== k) out[kk] = vv;
+		return out;
+	},
+	mapFilter(m, pred) {
+		const out = {};
+		for (const [k, v] of Object.entries(m ?? {})) if (pred(k, v)) out[k] = v;
+		return out;
+	},
+	/**
+	* Polymorphic `.filter` dispatch — used by codegen when the receiver type
+	* isn't statically known (e.g. `m.keys.filter(...)` vs `m.filter(...)`).
+	* Arrays go through Array.prototype.filter; objects (Maps in Kumiki) fall
+	* back to the (k, v) → boolean predicate of mapFilter.
+	*/
+	filter(coll, pred) {
+		if (Array.isArray(coll)) return coll.filter((x) => pred(x));
+		if (coll && typeof coll === "object") {
+			const out = {};
+			for (const [k, v] of Object.entries(coll)) if (pred(k, v)) out[k] = v;
+			return out;
+		}
+		return [];
+	},
+	listSize(xs) {
+		return xs?.length ?? 0;
+	},
+	listFilter(xs, pred) {
+		return (xs ?? []).filter(pred);
+	},
+	listMap(xs, fn) {
+		return (xs ?? []).map(fn);
+	},
+	/** Polymorphic `.map`: over List elements, or over Option/Result Some/Ok. */
+	mapOver(coll, fn) {
+		if (Array.isArray(coll)) return coll.map(fn);
+		if (coll && typeof coll === "object" && "_tag" in coll) {
+			const tagged = coll;
+			if (tagged._tag === "Some") return {
+				_tag: "Some",
+				_0: fn(tagged._0)
+			};
+			if (tagged._tag === "Ok") return {
+				_tag: "Ok",
+				_0: fn(tagged._0)
+			};
+			return coll;
+		}
+		return coll == null ? [] : fn(coll);
+	},
+	/** Option(T).flat-map(f): Some(v) -> f(v), None -> None. f returns an Option. */
+	flatMapOption(opt, fn) {
+		if (opt && typeof opt === "object" && "_tag" in opt) {
+			const tagged = opt;
+			if (tagged._tag === "Some" || tagged._tag === "Ok") return fn(tagged._0);
+			return opt;
+		}
+		return _stdlib.None;
+	},
+	listSortBy(xs, keyOf) {
+		return [...xs ?? []].sort((a, b) => keyOf(a) - keyOf(b));
+	},
+	/** List(T).fold(init, expr): left fold with $1=acc, $2=elem. */
+	listFold(xs, init, fn) {
+		let acc = init;
+		for (const x of xs ?? []) acc = fn(acc, x);
+		return acc;
+	},
+	setHas(s, x) {
+		return !!s && String(x) in s;
+	},
+	setToggle(s, x) {
+		const k = String(x);
+		const cur = { ...s ?? {} };
+		if (k in cur) {
+			delete cur[k];
+			return cur;
+		}
+		cur[k] = true;
+		return cur;
+	},
+	add(a, b) {
+		if (typeof a === "string" || typeof b === "string") return String(a) + String(b);
+		return a + b;
+	},
+	show(v) {
+		if (v === null || v === void 0) return "";
+		if (typeof v === "object" && v && "_tag" in v) return v._tag;
+		return String(v);
+	},
+	eq(a, b) {
+		if (a === b) return true;
+		if (a == null || b == null) return false;
+		if (typeof a === "object" && typeof b === "object") {
+			const ao = a;
+			const bo = b;
+			if (ao._tag !== void 0 || bo._tag !== void 0) {
+				if (ao._tag !== bo._tag) return false;
+				for (const k of Object.keys(ao)) if (!Object.is(ao[k], bo[k])) return false;
+				return true;
+			}
+		}
+		return false;
+	},
+	freshId() {
+		const c = globalThis.crypto;
+		if (c?.randomUUID) return c.randomUUID();
+		return Math.random().toString(36).slice(2) + Date.now().toString(36);
+	},
+	now() {
+		return Date.now();
+	},
+	recordCopy(rec, patch) {
+		return {
+			...rec,
+			...patch
+		};
+	},
+	unwrap(opt) {
+		if (opt && typeof opt === "object" && "_tag" in opt) {
+			const o = opt;
+			if (o._tag === "Some") return o._0;
+		}
+		return opt;
+	},
+	optionGetOr(opt, def) {
+		if (opt && typeof opt === "object" && "_tag" in opt) {
+			const o = opt;
+			if (o._tag === "Some") return o._0;
+			if (o._tag === "None") return def;
+		}
+		return opt ?? def;
+	},
+	Some(v) {
+		return {
+			_tag: "Some",
+			_0: v
+		};
+	},
+	None: { _tag: "None" },
+	Ok(v) {
+		return {
+			_tag: "Ok",
+			_0: v
+		};
+	},
+	Err(v) {
+		return {
+			_tag: "Err",
+			_0: v
+		};
+	},
+	variant(tag, ...args) {
+		const o = { _tag: tag };
+		args.forEach((a, i) => {
+			o[`_${i}`] = a;
+		});
+		return o;
+	},
+	variantIs(v, tag) {
+		return !!v && typeof v === "object" && "_tag" in v && v._tag === tag;
+	},
+	/** List(T).chunk(n) → List(List(T)). The last chunk may be shorter. */
+	listChunk(xs, n) {
+		const arr = xs ?? [];
+		const size = Math.max(1, Math.floor(n));
+		const out = [];
+		for (let i = 0; i < arr.length; i += size) out.push(arr.slice(i, i + size));
+		return out;
+	},
+	/** List(T).zip(other) → List(Tuple(T, U)); truncates to the shorter list. */
+	listZip(a, b) {
+		const xs = a ?? [];
+		const ys = b ?? [];
+		const n = Math.min(xs.length, ys.length);
+		const out = [];
+		for (let i = 0; i < n; i++) out.push([xs[i], ys[i]]);
+		return out;
+	},
+	/** Map(K,V).update(k, fn): apply fn to the current value of k, no-op if absent. */
+	mapUpdate(m, k, fn) {
+		const obj = m ?? {};
+		if (!(k in obj)) return obj;
+		return {
+			...obj,
+			[k]: fn(obj[k])
+		};
+	},
+	/** Set(T).add(x). Sets are stored as `{ [String(x)]: true }`. */
+	setAdd(s, x) {
+		return {
+			...s ?? {},
+			[String(x)]: true
+		};
+	},
+	/** Set(T).union(other). */
+	setUnion(a, b) {
+		return {
+			...a ?? {},
+			...b ?? {}
+		};
+	},
+	/** Set(T).intersect(other) — keys present in both. */
+	setIntersect(a, b) {
+		const bb = b ?? {};
+		const out = {};
+		for (const k of Object.keys(a ?? {})) if (k in bb) out[k] = true;
+		return out;
+	},
+	/** Set(T).diff(other) — keys in a not in b. */
+	setDiff(a, b) {
+		const bb = b ?? {};
+		const out = {};
+		for (const k of Object.keys(a ?? {})) if (!(k in bb)) out[k] = true;
+		return out;
+	},
+	/** Option(T).or / Result(T,E).or — receiver when Some/Ok, else `other`. */
+	or(v, other) {
+		if (v && typeof v === "object" && "_tag" in v) {
+			const tag = v._tag;
+			if (tag === "Some" || tag === "Ok") return v;
+			if (tag === "None" || tag === "Err") return other;
+		}
+		return v ?? other;
+	},
+	/** Result(T,E).map-err(fn) — maps the Err payload, passes Ok through unchanged. */
+	mapErr(r, fn) {
+		if (r && typeof r === "object" && "_tag" in r) {
+			const t = r;
+			if (t._tag === "Err") return {
+				_tag: "Err",
+				_0: fn(t._0)
+			};
+		}
+		return r;
+	},
+	/** Polymorphic `.diff`: numeric magnitude (Time/Duration) or Set difference. */
+	diff(a, b) {
+		if (typeof a === "number" || typeof b === "number") return Math.abs(a - b);
+		return _stdlib.setDiff(a, b);
+	}
+};
+const builtinEffects = {
+	async storageRead(input) {
+		const { key } = input;
+		try {
+			const raw = localStorage.getItem(key);
+			if (raw === null) return {
+				kind: "ok",
+				value: _stdlib.None
+			};
+			const value = JSON.parse(raw);
+			return {
+				kind: "ok",
+				value: _stdlib.Some(value)
+			};
+		} catch (e) {
+			return {
+				kind: "err",
+				value: { message: String(e) }
+			};
+		}
+	},
+	async storageWrite(input) {
+		const { key, value } = input;
+		try {
+			localStorage.setItem(key, JSON.stringify(value));
+			return {
+				kind: "ok",
+				value: null
+			};
+		} catch (e) {
+			return {
+				kind: "err",
+				value: { message: String(e) }
+			};
+		}
+	},
+	async httpFetch(method, input, baseUrl) {
+		const x = input;
+		const url = (baseUrl ?? "") + (x.url ?? "");
+		const init = {
+			method,
+			headers: { ...x.headers ?? {} }
+		};
+		if (x.body !== void 0 && method !== "GET" && method !== "HEAD") {
+			const headers = init.headers;
+			if (typeof x.body === "string") init.body = x.body;
+			else {
+				init.body = JSON.stringify(x.body);
+				if (!headers["Content-Type"]) headers["Content-Type"] = "application/json";
+			}
+		}
+		try {
+			const res = await fetch(url, init);
+			if (res.status === 401 || res.status === 403 || res.status >= 500) return {
+				kind: "err",
+				value: {
+					status: res.status,
+					message: res.statusText,
+					body: await res.text().catch(() => "")
+				}
+			};
+			if (!res.ok) return {
+				kind: "err",
+				value: {
+					status: res.status,
+					message: res.statusText,
+					body: await res.text().catch(() => "")
+				}
+			};
+			const decode = x.decode ?? "json";
+			let value;
+			if (decode === "json") value = await res.json();
+			else if (decode === "text") value = await res.text();
+			else if (decode === "none") value = null;
+			else value = await res.text();
+			return {
+				kind: "ok",
+				value
+			};
+		} catch (e) {
+			return {
+				kind: "err",
+				value: {
+					status: 0,
+					message: String(e),
+					body: ""
+				}
+			};
+		}
+	}
+};
+//#endregion
+export { _stdlib, builtinEffects, mount, runScenario, smoke };