fuzor 0.5.1 → 0.5.3

package/dist/compiler/native-authoring.js

@@ -0,0 +1,569 @@
+import { createHash } from "node:crypto";
+import path from "node:path";
+import { readFile } from "node:fs/promises";
+import { parse } from "@babel/parser";
+import { parseFragment } from "parse5";
+import MagicString from "magic-string";
+import { isManagedScript } from "./page-scripts.js";
+import * as Effect from "effect/Effect";
+import { nativeSeed } from "../native-state.js";
+import { freeNames } from "../server-components/closures.js";
+import { assertJson, assertName, isBindingAttribute, scalar } from "../server-components/protocol.js";
+import { escapeAttribute, escapeText } from "../html-escape.js";
+import { isServerData } from "../server-data.js";
+import { compileServerActions } from "./server-actions.js";
+import { computeNativeValues } from "../native-expressions.js";
+import { compileNativeRange } from "./native-ranges.js";
+import { selectOptions } from "./select-options.js";
+const hash = (value) => createHash("sha256").update(value).digest("hex").slice(0, 20);
+const eventTypes = new Set(["click", "input", "change", "keydown", "keyup", "submit", "focusin", "focusout", "pointerdown", "pointerup"]);
+const attr = (node, name) => node.attrs.find(a => a.name === name)?.value;
+const fail = (source, message) => { throw new Error(`${source}: native Fuzor script: ${message}`); };
+const unwrap = (node) => ["TSAsExpression", "TSSatisfiesExpression", "TSNonNullExpression"].includes(node.type) ? unwrap(node.expression) : node;
+function literal(raw, source) {
+    const node = unwrap(raw);
+    if (node.type === "NullLiteral")
+        return null;
+    if (["StringLiteral", "NumericLiteral", "BooleanLiteral"].includes(node.type)) {
+        assertJson(node.value);
+        return node.value;
+    }
+    if (node.type === "UnaryExpression" && node.operator === "-" && node.argument.type === "NumericLiteral")
+        return -node.argument.value;
+    if (node.type === "ArrayExpression")
+        return node.elements.map((n) => n ? literal(n, source) : fail(source, "state arrays cannot have holes"));
+    if (node.type === "ObjectExpression") {
+        const entries = node.properties.map((p) => {
+            if (p.type !== "ObjectProperty" || p.computed || p.shorthand)
+                return fail(source, "state defaults must be explicit JSON");
+            const key = p.key.name ?? p.key.value;
+            assertName(key);
+            return [key, literal(p.value, source)];
+        });
+        const value = Object.fromEntries(entries);
+        assertJson(value);
+        return value;
+    }
+    return fail(source, "state defaults must be JSON literals or fuzor.props paths with a JSON fallback");
+}
+function analyze(code, source, language) {
+    const body = parse(code, { sourceType: "module", plugins: language === "ts" ? ["typescript"] : [], allowAwaitOutsideFunction: true }).program.body;
+    const imports = body.filter(n => n.type === "ImportDeclaration");
+    const aliases = new Set(["fuzor"]);
+    for (const node of imports)
+        if (["fuzor", "fuzor/runtime/native"].includes(node.source.value))
+            for (const s of node.specifiers)
+                if (s.imported?.name === "fuzor")
+                    aliases.add(s.local.name);
+    const member = (node, name) => node?.type === "MemberExpression" && !node.computed && node.object.type === "Identifier" && aliases.has(node.object.name) && node.property.name === name;
+    // Opt in only through declarations, never identifiers in strings/comments or unrelated imperative code.
+    const calls = body.flatMap(n => n.type === "VariableDeclaration" ? n.declarations.map((d) => d.init) : n.type === "ExpressionStatement" ? [n.expression] : []);
+    if (!calls.some(n => n?.type === "CallExpression" && (member(n.callee, "state") || member(n.callee, "computed") || member(n.callee, "action") || member(n.callee, "effect"))))
+        return undefined;
+    const states = [], handles = new Map(), actions = new Map(), types = [];
+    const computed = {};
+    const effects = [];
+    const expression = (raw) => {
+        const node = unwrap(raw);
+        if (node.type === "CallExpression" && node.arguments.length === 0 && node.callee.type === "MemberExpression" && !node.callee.computed && node.callee.property.name === "get" && handles.has(node.callee.object.name))
+            return { op: "read", name: handles.get(node.callee.object.name) };
+        if (node.type === "MemberExpression" && !node.computed && node.property.type === "Identifier") {
+            assertName(node.property.name);
+            return { op: "property", value: expression(node.object), key: node.property.name };
+        }
+        if (node.type === "UnaryExpression" && ["!", "+", "-"].includes(node.operator))
+            return { op: node.operator, value: expression(node.argument) };
+        if (["BinaryExpression", "LogicalExpression"].includes(node.type) && ["+", "-", "*", "/", "%", "**", "===", "!==", "<", "<=", ">", ">=", "&&", "||", "??"].includes(node.operator))
+            return { op: "binary", operator: node.operator, left: expression(node.left), right: expression(node.right) };
+        if (node.type === "ConditionalExpression")
+            return { op: "choose", test: expression(node.test), yes: expression(node.consequent), no: expression(node.alternate) };
+        if (node.type === "ArrayExpression")
+            return { op: "array", items: node.elements.map((item) => item ? expression(item) : fail(source, "computed arrays cannot have holes")) };
+        try {
+            return { op: "literal", value: literal(node, source) };
+        }
+        catch {
+            return fail(source, `computed values require pure expressions over previously declared state handles; unsupported ${node.type} at column ${node.start + 1}`);
+        }
+    };
+    const propsPath = (node) => {
+        if (member(node, "props"))
+            return [];
+        if (node.type !== "MemberExpression" || node.computed || node.property.type !== "Identifier")
+            return undefined;
+        const parent = propsPath(node.object);
+        return parent ? [...parent, node.property.name] : undefined;
+    };
+    for (const node of body) {
+        if (node.type === "ImportDeclaration") {
+            if (!node.specifiers.length && !/\.(?:css|scss|sass|less|styl)(?:\?.*)?$/.test(node.source.value))
+                fail(source, "side-effect imports belong in an imperative script");
+            if (node.specifiers.some((s) => aliases.has(s.local.name) && s.imported?.name !== "fuzor"))
+                fail(source, "fuzor is reserved for the compiler context");
+            continue;
+        }
+        if (["TSTypeAliasDeclaration", "TSInterfaceDeclaration"].includes(node.type)) {
+            types.push(code.slice(node.start, node.end));
+            continue;
+        }
+        if (node.type === "EmptyStatement")
+            continue;
+        if (node.type === "VariableDeclaration" && node.kind === "const") {
+            for (const declaration of node.declarations) {
+                const call = declaration.init;
+                const derived = call?.type === "CallExpression" && member(call.callee, "computed");
+                if (declaration.id.type !== "Identifier" || call?.type !== "CallExpression" || !derived && !member(call.callee, "state") || call.arguments.length !== 2)
+                    fail(source, 'use const handle = fuzor.state("name", initialValue) or fuzor.computed("name", () => expression)');
+                const name = literal(call.arguments[0], source);
+                if (typeof name !== "string" || !/^[a-z][a-z0-9]*(?:-[a-z0-9]+)*$/.test(name))
+                    fail(source, "state names must be lowercase HTML names (for example count or first-name)");
+                assertName(name);
+                if (states.some(s => s.name === name) || handles.has(declaration.id.name) || aliases.has(declaration.id.name))
+                    fail(source, "duplicate state name or reserved handle");
+                if (derived) {
+                    const fn = unwrap(call.arguments[1]);
+                    if (fn.type !== "ArrowFunctionExpression" || fn.async || fn.params.length || fn.body.type === "BlockStatement")
+                        fail(source, "computed values require a synchronous zero-argument expression arrow");
+                    computed[name] = expression(fn.body);
+                    const fallback = computeNativeValues(Object.fromEntries([...states.map(cell => [cell.name, cell.fallback]), [name, null]]), computed)[name];
+                    states.push({ name, fallback, readonly: true });
+                    handles.set(declaration.id.name, name);
+                    continue;
+                }
+                let initial = unwrap(call.arguments[1]), fallback, from;
+                if (initial.type === "LogicalExpression" && initial.operator === "??") {
+                    from = propsPath(initial.left);
+                    if (!from?.length)
+                        fail(source, "only fuzor.props paths may use an initializer fallback");
+                    fallback = literal(initial.right, source);
+                }
+                else {
+                    from = propsPath(initial);
+                    fallback = from?.length ? null : literal(initial, source);
+                }
+                if (from)
+                    from.forEach(assertName);
+                states.push({ name, fallback, ...(from?.length ? { from } : {}) });
+                handles.set(declaration.id.name, name);
+            }
+            continue;
+        }
+        const call = node.type === "ExpressionStatement" ? node.expression : undefined;
+        if (call?.type === "CallExpression" && (member(call.callee, "action") && call.arguments.length === 2 || member(call.callee, "effect") && call.arguments.length === 3)) {
+            const effect = member(call.callee, "effect");
+            const name = literal(call.arguments[0], source), fn = call.arguments[effect ? 2 : 1];
+            if (effect) {
+                const dependencies = call.arguments[1];
+                if (dependencies.type !== "ArrayExpression" || dependencies.elements.some((item) => item?.type !== "Identifier" || !handles.has(item.name)))
+                    fail(source, "effects require an explicit array of state/computed handles");
+                effects.push({ action: String(name), dependencies: dependencies.elements.map((item) => handles.get(item.name)) });
+            }
+            if (typeof name !== "string" || !/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(name) || name.length > 256 || actions.has(name))
+                fail(source, "actions require a unique local action name without slashes");
+            if (!["ArrowFunctionExpression", "FunctionExpression"].includes(fn.type) || fn.generator || fn.params.length > 1 || fn.params.some((p) => p.type !== "Identifier"))
+                fail(source, "actions take a function with zero or one context parameter");
+            actions.set(name, fn);
+            continue;
+        }
+        fail(source, "use imports, types, state declarations and actions; imperative setup belongs in a separate script");
+    }
+    const imported = new Set(imports.flatMap(n => n.specifiers.map((s) => s.local.name)));
+    const outer = new Set([...imported, ...handles.keys(), ...aliases]);
+    for (const fn of actions.values())
+        for (const name of freeNames(fn, outer))
+            if (!outer.has(name))
+                fail(source, `unsupported action capture ${name}; capture a state handle or import a browser module`);
+    for (const effect of effects)
+        for (const name of freeNames(actions.get(effect.action), outer))
+            if (handles.has(name) && !effect.dependencies.includes(handles.get(name)))
+                fail(source, `effect ${effect.action} reads ${name} without declaring its dependency`);
+    return { states, computed, effects, actions, handles, imports, types, aliases, code, language, source, id: `native-${hash(JSON.stringify([source, code]))}` };
+}
+/** Extract independently imported actions; declarations themselves are inert HTML data. */
+export function compileAuthoredNativeScript(code, script, buildId) {
+    const analysis = analyze(code, script.source, script.language) ?? (script.native ? { states: [], computed: {}, effects: [], actions: new Map(), handles: new Map(), imports: [], types: [], aliases: new Set(["fuzor"]), code, language: script.language, source: script.source, id: script.native.id } : undefined);
+    if (!analysis)
+        return undefined;
+    if (!script.native)
+        return fail(script.source, "native declarations require an HTML instance compiled by Fuzor");
+    const { imports, types, aliases, handles, actions } = analysis;
+    const imported = new Set(imports.flatMap(n => n.specifiers.map((s) => s.local.name)));
+    const handlers = [];
+    const actionIds = new Map();
+    const unique = (prefix) => { let name = prefix; while (new RegExp(`\\b${name}\\b`).test(code))
+        name += "_"; return name; };
+    const context = unique("__fz_context"), state = unique("__fz_state");
+    for (const [action, fn] of actions) {
+        const free = freeNames(fn, new Set([...imported, ...handles.keys(), ...aliases]));
+        const needed = imports.flatMap(node => {
+            const specifiers = node.specifiers.filter((s) => !aliases.has(s.local.name) && (node.importKind === "type" || free.includes(s.local.name)));
+            if (!specifiers.length)
+                return [];
+            const parts = specifiers.map((s) => s.type === "ImportDefaultSpecifier" ? s.local.name : s.type === "ImportNamespaceSpecifier" ? `* as ${s.local.name}` : `{ ${s.importKind === "type" ? "type " : ""}${s.imported.name ?? JSON.stringify(s.imported.value)}${s.local.name === s.imported.name ? "" : ` as ${s.local.name}`} }`);
+            // Separate named specifiers are legal as separate imports and preserve aliases/types.
+            return parts.map((part) => `import ${node.importKind === "type" ? "type " : ""}${part} from ${JSON.stringify(node.source.value)};`);
+        });
+        const id = `${analysis.id}-${hash(action)}`;
+        actionIds.set(action, id);
+        const locals = free.flatMap(name => handles.has(name) ? [`const ${name} = ${state}(${context}, ${JSON.stringify(handles.get(name))});`] : aliases.has(name) ? [`const ${name} = { props: ${context}.props };`] : []);
+        handlers.push({ id, source: script.source, language: script.language, code: `import { createNativeState as ${state} } from "fuzor/runtime/native";\n${needed.join("\n")}\n${types.join("\n")}\nexport default async function(${context}) { ${locals.join("\n")} return await (${code.slice(fn.start, fn.end)})(${context}); }` });
+    }
+    const metadata = script.native;
+    for (const [name, action] of Object.entries(metadata.serverActions ?? {})) {
+        const id = `${metadata.id}-${hash(name)}`;
+        actionIds.set(name, id);
+        handlers.push({ id, source: script.source, language: "js", code: `import { invokeServerAction } from "fuzor/runtime/native";\nexport default context => invokeServerAction(context, ${JSON.stringify(action)}, ${JSON.stringify(buildId ?? "development")});` });
+    }
+    return { handlers, actionIds, ...(metadata.computed || metadata.ranges || metadata.effects ? { graphId: `graph-${hash(JSON.stringify([metadata.id, metadata.computed, metadata.ranges, metadata.effects]))}` } : {}), css: imports.filter(node => !node.specifiers.length).map(node => node.source.value) };
+}
+function allScripts(html, includeTemplates = false) {
+    const fragment = parseFragment(html, { sourceCodeLocationInfo: true }), scripts = [];
+    const visit = (node) => { if (!("tagName" in node))
+        return; if (node.tagName === "script")
+        scripts.push(node); if (node.tagName !== "template")
+        node.childNodes.forEach(visit);
+    else if (includeTemplates)
+        node.content.childNodes.forEach(visit); };
+    fragment.childNodes.forEach(visit);
+    return { fragment, scripts };
+}
+/** A server annotation must never silently become a browser script in unsupported surfaces. */
+export function assertNoServerScripts(html, source) {
+    if (allScripts(html, true).scripts.some(node => attr(node, "server") !== undefined))
+        fail(source, "server scripts belong in a page or component with a native declaration");
+}
+function hostFor(node) {
+    if (attr(node, "data-fuzor-script-host") !== "next-element" && "tagName" in node.parentNode)
+        return node.parentNode;
+    const siblings = node.parentNode.childNodes;
+    const next = siblings.slice(siblings.indexOf(node) + 1).find(n => "tagName" in n && !["script", "style"].includes(n.tagName));
+    if (!next || !("tagName" in next))
+        return fail(attr(node, "data-fuzor-script-source") ?? "HTML", "a declaration needs a following markup root");
+    return next;
+}
+const serverQuery = "?fuzor-server-script=";
+export function resolveHtmlServer(id, ssr, modules) {
+    if (!id.includes(serverQuery) && !modules.has(id))
+        return;
+    if (!ssr)
+        throw new Error("HTML server scripts cannot be imported by browser code");
+    return id;
+}
+export async function loadHtmlServer(id, modules, watch) {
+    const generated = modules.get(id);
+    if (generated !== undefined)
+        return generated;
+    const index = id.indexOf(serverQuery);
+    if (index < 0)
+        return;
+    const file = id.slice(0, index), key = id.slice(index + serverQuery.length);
+    watch(file);
+    const html = await readFile(file, "utf8");
+    const script = allScripts(html).scripts.find(n => attr(n, "server") !== undefined && hash(html.slice(n.sourceCodeLocation.startTag.endOffset, n.sourceCodeLocation.endTag.startOffset)) === key);
+    if (!script)
+        throw new Error(`${file}: server script no longer exists`);
+    const location = script.sourceCodeLocation;
+    const code = html.slice(location.startTag.endOffset, location.endTag.startOffset);
+    const language = attr(script, "lang") ?? "js";
+    if (!["js", "ts"].includes(language))
+        throw new Error(`${file}: server script lang must be js or ts`);
+    return (await import("vite")).transformWithEsbuild(compileServerActions(code, file, language).code, `${file}.server.${language}`, { loader: language, target: "es2022" });
+}
+export function htmlServerPlugin(modules = new Map()) {
+    return { name: "fuzor:html-server", enforce: "pre",
+        resolveId(id, _importer, options) { return resolveHtmlServer(id, options.ssr, modules); },
+        load(id) { return loadHtmlServer(id, modules, file => this.addWatchFile(file)); }
+    };
+}
+/** Adoptable HTML is produced without running any client setup or action. */
+export async function prepareNativeScripts(project, root, loadModule, serverModules) {
+    const compile = Effect.fnUntraced(function* (html, source, route, request, baseData) {
+        const { scripts } = allScripts(html), output = new MagicString(html);
+        const active = new Set(scripts.map(node => node.sourceCodeLocation?.startOffset));
+        if (allScripts(html, true).scripts.some(node => attr(node, "server") !== undefined && !active.has(node.sourceCodeLocation?.startOffset)))
+            fail(source, "server scripts cannot appear in inert templates");
+        const clients = new Map();
+        for (const node of scripts) {
+            if (!isManagedScript(node))
+                continue;
+            const origin = attr(node, "data-fuzor-script-source") ?? path.resolve(root, source), loc = node.sourceCodeLocation;
+            const src = attr(node, "src"), file = src ? path.resolve(src.startsWith("/") ? root : path.dirname(origin), src.startsWith("/") ? `.${src}` : src) : origin;
+            if (src && /^(?:[a-z]+:|\/\/)/i.test(src))
+                continue;
+            const code = src ? yield* Effect.tryPromise(() => readFile(file, "utf8")) : html.slice(loc.startTag.endOffset, loc.endTag.startOffset);
+            const language = attr(node, "lang") ?? (src && /\.[cm]?ts$/.test(src) ? "ts" : "js");
+            if (language !== "js" && language !== "ts")
+                continue;
+            const analysis = analyze(code, file, language);
+            if (!analysis)
+                continue;
+            const host = hostFor(node);
+            if ([...clients.values()].some(c => c.host === host))
+                fail(origin, "one native declaration script owns each markup root");
+            clients.set(node, { node, host, analysis });
+        }
+        const servers = new Map();
+        for (const node of scripts.filter(n => attr(n, "server") !== undefined)) {
+            const origin = attr(node, "data-fuzor-script-source") ?? path.resolve(root, source), loc = node.sourceCodeLocation;
+            if (attr(node, "src") !== undefined || !loc.startTag || !loc.endTag || node.attrs.some(a => a.name.startsWith("client:") || a.name === "data-fuzor-global"))
+                fail(origin, "server scripts must be inline with a closing tag");
+            const host = hostFor(node);
+            if (servers.has(host))
+                fail(origin, "one server script owns each markup root");
+            const code = html.slice(loc.startTag.endOffset, loc.endTag.startOffset);
+            const language = (attr(node, "lang") ?? "js");
+            if (language !== "js" && language !== "ts")
+                fail(origin, "server script lang must be js or ts");
+            const authored = compileServerActions(code, origin, language);
+            const module = origin + serverQuery + hash(code);
+            const loaded = yield* Effect.tryPromise(() => loadModule(module));
+            if (Object.keys(loaded).some(key => !["props", "default", "__fuzor_actions"].includes(key)) || loaded.props !== undefined && loaded.default !== undefined)
+                fail(origin, "export either public const props or a default request loader, not both");
+            const dynamic = loaded.default !== undefined;
+            if (dynamic && !isServerData(loaded.default) && typeof loaded.default !== "function")
+                fail(origin, "request scripts export a default loader function or defineServerData(...)");
+            if (authored.names.length && loaded.props !== undefined)
+                fail(origin, "server actions need request-time defineServerData for fresh props; export a loader instead of build-only props");
+            const actions = Object.fromEntries(authored.names.map(name => {
+                if (typeof loaded.__fuzor_actions?.[name] !== "function")
+                    fail(origin, "server action registry does not match the compiled declarations");
+                return [name, `action-${hash(JSON.stringify([origin, code, name]))}`];
+            }));
+            const props = loaded.props ?? {};
+            assertJson(props);
+            if (!props || typeof props !== "object" || Array.isArray(props))
+                fail(origin, "public props must be a JSON object");
+            const synthetic = ![...clients.values()].some(c => c.host === host);
+            if (synthetic)
+                clients.set(node, { node, host, analysis: { states: [], computed: {}, effects: [], actions: new Map(), handles: new Map(), imports: [], types: [], aliases: new Set(["fuzor"]), code: "", language, source: origin, id: `native-${hash(JSON.stringify([origin, code]))}` } });
+            const client = [...clients.values()].find(c => c.host === host);
+            if (authored.names.some(name => client.analysis.actions.has(name)))
+                fail(origin, "client and server actions on one root need distinct names");
+            servers.set(host, { module, props: props, request: dynamic || authored.names.length > 0, actions, synthetic });
+            output.remove(loc.startOffset, loc.endOffset);
+        }
+        const usedKeys = new Set(), counts = new Map();
+        const entries = [];
+        const childHosts = new Set([...clients.values()].map(c => c.host));
+        for (const script of scripts)
+            if (isManagedScript(script)) {
+                if (attr(script, "data-fuzor-script-host") === "next-element")
+                    childHosts.add(hostFor(script));
+                else if (script.parentNode && "tagName" in script.parentNode)
+                    childHosts.add(script.parentNode);
+            }
+        for (const { node, host, analysis } of clients.values()) {
+            const count = counts.get(analysis.id) ?? 0;
+            counts.set(analysis.id, count + 1);
+            const explicit = attr(host, "data-fuzor-key") ?? attr(host, "id");
+            const key = `fz-${hash(JSON.stringify([route, analysis.id, explicit ?? count]))}`;
+            if (usedKeys.has(key))
+                fail(analysis.source, "duplicate native instance key");
+            usedKeys.add(key);
+            const server = servers.get(host);
+            // Server-only values are read-only cells; client declarations can explicitly own editable state.
+            if (server) {
+                const discover = (element) => {
+                    if (element !== host && (childHosts.has(element) || element.tagName === "script"))
+                        return;
+                    if (element.tagName === "fz-state") {
+                        const name = attr(element, "name") ?? fail(analysis.source, "fz-state requires a local state name");
+                        if (!analysis.states.some(cell => cell.name === name))
+                            analysis.states.push({ name, from: [name], fallback: null, readonly: true });
+                    }
+                    for (const kind of ["each", "if"]) {
+                        const name = attr(element, `data-fz-${kind}`);
+                        if (name !== undefined && !analysis.states.some(cell => cell.name === name))
+                            analysis.states.push({ name, from: [name], fallback: kind === "each" ? [] : false, readonly: true });
+                    }
+                    for (const attribute of element.attrs)
+                        if (attribute.name === "data-fz-value" || attribute.name === "data-fz-checked" || attribute.name.startsWith("data-fz-attr-")) {
+                            if (!analysis.states.some(cell => cell.name === attribute.value))
+                                analysis.states.push({ name: attribute.value, from: [attribute.value], fallback: attribute.name === "data-fz-checked" ? false : null, ...(!["data-fz-value", "data-fz-checked"].includes(attribute.name) ? { readonly: true } : {}) });
+                        }
+                    element.childNodes.forEach(child => { if ("tagName" in child)
+                        discover(child); });
+                    if (element.tagName === "template")
+                        element.content.childNodes.forEach(child => { if ("tagName" in child)
+                            discover(child); });
+                };
+                discover(host);
+            }
+            const baseSeed = nativeSeed(server?.props ?? {}, analysis.states);
+            const seed = { ...baseSeed, state: computeNativeValues(baseSeed.state, analysis.computed) };
+            const bindings = [], events = [];
+            const ranges = [];
+            const additions = new Map();
+            const add = (element, name, value) => { if (attr(element, name) !== undefined)
+                fail(analysis.source, `reserved compiler attribute ${name}`); const list = additions.get(element) ?? []; list.push(` ${name}="${escapeAttribute(value)}"`); additions.set(element, list); };
+            add(host, "data-fz-instance", key);
+            add(host, "data-fz-seed", JSON.stringify(seed));
+            if (server?.request) {
+                add(host, "data-fz-seed-source", `__fuzor_native.${key}`);
+            }
+            const walk = (element) => {
+                if (element !== host && (childHosts.has(element) || element.tagName === "template" || element.tagName === "script" || element.tagName.startsWith("fuzor-") || element.attrs.some(a => a.name === "data-fuzor-ui")))
+                    return;
+                const local = [];
+                if (element.tagName.startsWith("fz-")) {
+                    if (element.tagName !== "fz-state")
+                        fail(analysis.source, 'value markers use <fz-state name="count">');
+                    const state = attr(element, "name") ?? fail(analysis.source, "fz-state requires a local state name");
+                    if (!state || !Object.hasOwn(seed.state, state))
+                        fail(analysis.source, `unknown value marker state ${state ?? "(missing name)"}`);
+                    if (element.childNodes.some(n => "tagName" in n))
+                        fail(analysis.source, "value markers contain text only");
+                    local.push({ state, kind: "text" });
+                }
+                for (const a of element.attrs) {
+                    if (a.name === "data-fz-value" || a.name === "data-fz-checked" || a.name.startsWith("data-fz-attr-")) {
+                        if (!Object.hasOwn(seed.state, a.value))
+                            fail(analysis.source, `unknown binding state ${a.value}`);
+                        const kind = a.name === "data-fz-value" ? "value" : a.name === "data-fz-checked" ? "checked" : "attribute";
+                        const attribute = kind === "attribute" ? a.name.slice("data-fz-attr-".length) : undefined;
+                        if (attribute && !isBindingAttribute(attribute))
+                            fail(analysis.source, "unsupported attribute binding");
+                        if (kind === "checked" && (element.tagName !== "input" || attr(element, "type") !== "checkbox") || kind === "value" && !["input", "textarea", "select"].includes(element.tagName))
+                            fail(analysis.source, "field bindings require native form controls");
+                        if (["checked", "value"].includes(kind) && Object.hasOwn(analysis.computed, a.value))
+                            fail(analysis.source, "computed values are read-only; bind form controls to writable state");
+                        local.push({ state: a.value, kind, ...(attribute ? { attribute } : {}) });
+                    }
+                }
+                const render = [];
+                const tokens = [];
+                for (const binding of local) {
+                    const token = `${key}-b${bindings.length}`, value = seed.state[binding.state];
+                    tokens.push(token);
+                    bindings.push({ ...binding, selector: `[data-fz-bind~="${token}"]` });
+                    if (binding.kind === "checked" && typeof value !== "boolean")
+                        fail(analysis.source, "checked state needs a boolean default or props fallback");
+                    if (binding.kind !== "checked")
+                        scalar(value);
+                    const loc = element.sourceCodeLocation;
+                    if (binding.kind === "text" || binding.kind === "value" && element.tagName === "textarea") {
+                        if (!loc.endTag)
+                            fail(analysis.source, "value markers and textareas require closing tags");
+                        const start = loc.startTag.endOffset, end = loc.endTag.startOffset;
+                        if (start === end)
+                            output.appendLeft(start, escapeText(scalar(value)));
+                        else
+                            output.overwrite(start, end, escapeText(scalar(value)));
+                    }
+                    else if (binding.kind === "value" && element.tagName === "select") {
+                        if (attr(element, "multiple") !== undefined)
+                            fail(analysis.source, "value bindings require single-value selects");
+                        let matched = false;
+                        for (const { element: option, value: optionValue } of selectOptions(element)) {
+                            const selected = option.sourceCodeLocation.attrs?.selected;
+                            if (selected)
+                                output.remove(selected.startOffset, selected.endOffset);
+                            if (!matched && optionValue === scalar(value)) {
+                                matched = true;
+                                const list = additions.get(option) ?? [];
+                                list.push(" selected");
+                                additions.set(option, list);
+                            }
+                        }
+                    }
+                    else {
+                        const attribute = binding.kind === "value" ? "value" : binding.kind === "checked" ? "checked" : binding.attribute;
+                        const location = loc.attrs?.[attribute];
+                        if (location)
+                            output.remove(location.startOffset, location.endOffset);
+                        if (value !== null && !(["checked", "hidden", "disabled"].includes(attribute) && value === false)) {
+                            const list = additions.get(element) ?? [];
+                            list.push(` ${attribute}="${escapeAttribute(scalar(value))}"`);
+                            additions.set(element, list);
+                        }
+                    }
+                    if (server?.request)
+                        render.push({ name: `__fuzor_native.${key}.state.${binding.state}`, kind: binding.kind, ...(binding.attribute ? { attribute: binding.attribute } : {}) });
+                }
+                if (tokens.length)
+                    add(element, "data-fz-bind", tokens.join(" "));
+                if (render.length)
+                    add(element, "data-fz-render", JSON.stringify(render));
+                const eventTokens = [];
+                for (const a of element.attrs)
+                    if (a.name.startsWith("data-fz-") && eventTypes.has(a.name.slice(8))) {
+                        const type = a.name.slice(8);
+                        if (analysis.effects.some(effect => effect.action === a.value) || !analysis.actions.has(a.value) && !Object.hasOwn(server?.actions ?? {}, a.value))
+                            fail(analysis.source, `unknown action ${a.value}`);
+                        const token = `${key}-e${events.length}`;
+                        eventTokens.push(token);
+                        events.push({ selector: `[data-fz-on~="${token}"]`, type, action: a.value, ...(attr(element, "data-fz-prevent-default")?.split(/\s+/).includes(type) || type === "submit" && Object.hasOwn(server?.actions ?? {}, a.value) ? { preventDefault: true } : {}) });
+                    }
+                if (eventTokens.length)
+                    add(element, "data-fz-on", eventTokens.join(" "));
+                const each = attr(element, "data-fz-each"), condition = attr(element, "data-fz-if");
+                if (each !== undefined || condition !== undefined) {
+                    if (each !== undefined && condition !== undefined)
+                        fail(analysis.source, "a range cannot be both keyed and conditional");
+                    const state = each ?? condition;
+                    if (!Object.hasOwn(seed.state, state))
+                        fail(analysis.source, `unknown range state ${state}`);
+                    const rowKey = each === undefined ? undefined : attr(element, "data-fz-key");
+                    if (each !== undefined && !rowKey)
+                        fail(analysis.source, "keyed ranges require data-fz-key with a stable row property");
+                    const templates = element.childNodes.filter(n => "tagName" in n && n.tagName === "template");
+                    if (templates.length !== 1 || element.childNodes.some(n => n !== templates[0] && !(n.nodeName === "#text" && !n.value.trim())))
+                        fail(analysis.source, "a range container contains exactly one inert template");
+                    const loc = templates[0].sourceCodeLocation, rangeId = `r${ranges.length}`;
+                    const compiled = compileNativeRange(html.slice(loc.startTag.endOffset, loc.endTag.startOffset), rangeId, state, rowKey, seed.state, (type, action) => {
+                        const serverAction = Object.hasOwn(server?.actions ?? {}, action);
+                        if (!analysis.actions.has(action) && !serverAction || analysis.effects.some(effect => effect.action === action))
+                            fail(analysis.source, "range actions require an admitted action");
+                        const token = `e${events.length}`;
+                        events.push({ selector: `[data-fz-range-on~="${token}"]`, type, action, delegated: true, ...(serverAction && type === "submit" ? { preventDefault: true } : {}) });
+                        return token;
+                    });
+                    ranges.push(compiled.range);
+                    add(element, "data-fz-range", rangeId);
+                    if (server?.request) {
+                        add(element, "data-fz-range-source", `__fuzor_native.${key}.state`);
+                        add(element, "data-fz-range-program", JSON.stringify(compiled.range));
+                    }
+                    output.overwrite(element.sourceCodeLocation.startTag.endOffset, element.sourceCodeLocation.endTag.startOffset, compiled.html);
+                    return;
+                }
+                for (const child of element.childNodes)
+                    if ("tagName" in child)
+                        walk(child);
+            };
+            walk(host);
+            if (server?.request)
+                entries.push({ key, module: server.module, actions: server.actions, computed: analysis.computed, ranges, states: analysis.states.map(cell => ({ ...cell, ...(bindings.some(b => b.state === cell.name && b.kind === "checked") ? { binding: "boolean" } : bindings.some(b => b.state === cell.name) ? { binding: "scalar" } : {}) })) });
+            for (const [element, attributes] of additions)
+                output.appendLeft(element.sourceCodeLocation.startTag.endOffset - (html[element.sourceCodeLocation.startTag.endOffset - 2] === "/" ? 2 : 1), attributes.join(""));
+            const metadata = { id: analysis.id, state: Object.fromEntries(analysis.states.map(s => [s.name, s.fallback])), seeds: analysis.states, ...(server?.request ? { request: true } : {}), ...(Object.keys(analysis.computed).length ? { computed: analysis.computed } : {}), ...(ranges.length ? { ranges } : {}), ...(analysis.effects.length ? { effects: analysis.effects } : {}), ...(server ? { serverActions: server.actions } : {}), bindings, events };
+            if (server?.synthetic)
+                output.appendLeft(node.sourceCodeLocation.startOffset, `<script type="module" data-fuzor-script-source="${escapeAttribute(analysis.source)}" data-fz-native="${escapeAttribute(JSON.stringify(metadata))}"${host !== node.parentNode ? ' data-fuzor-script-host="next-element"' : ""}></script>`);
+            else
+                output.appendLeft(node.sourceCodeLocation.startTag.endOffset - 1, ` data-fz-native="${escapeAttribute(JSON.stringify(metadata))}"`);
+            // Root declarations (also in pages) share the same host contract as component declarations.
+            if (!server?.synthetic && host !== node.parentNode && attr(node, "data-fuzor-script-host") === undefined)
+                output.appendLeft(node.sourceCodeLocation.startTag.endOffset - 1, ' data-fuzor-script-host="next-element"');
+        }
+        let data = baseData;
+        if (entries.length) {
+            data = `virtual:fuzor/native-data/${hash(JSON.stringify([route, entries, baseData]))}`;
+            serverModules.set(data, `import { composeNativeData } from "fuzor/server";\nimport { nativeDataStream } from "fuzor/server/native-stream";\n${baseData ? `import base from ${JSON.stringify(baseData)};` : "const base = undefined;"}\n${entries.map((entry, i) => `import * as loader${i} from ${JSON.stringify(entry.module)};`).join("\n")}\nconst entries = [${entries.map((entry, i) => `{key:${JSON.stringify(entry.key)},data:loader${i}.default,states:${JSON.stringify(entry.states)},computed:${JSON.stringify(entry.computed)},ranges:${JSON.stringify(entry.ranges)},actions:{${Object.entries(entry.actions).map(([name, id]) => `${JSON.stringify(id)}:loader${i}.__fuzor_actions[${JSON.stringify(name)}]`).join(",")}}}`).join(",")}];\nexport default { ...composeNativeData(base, entries), stream: nativeDataStream(base, entries) };`);
+        }
+        return { html: output.toString(), ...(data ? { serverData: data } : {}), runtimeServer: entries.length > 0 };
+    });
+    return Effect.runPromise(Effect.gen(function* () {
+        const routes = [];
+        for (const route of project.routes) {
+            const { runtimeServer, ...compiled } = yield* compile(route.html, route.source, route.path, route.policy?.rendering === "request", route.serverData);
+            if (runtimeServer && route.renderingDeclaration === "static")
+                fail(route.source, "rendering=static conflicts with request-time HTML server work");
+            routes.push({ ...route, ...compiled, ...(runtimeServer ? { policy: { ...route.policy, rendering: "request", navigation: route.policy?.navigation ?? "document" } } : {}) });
+        }
+        const boundaries = [];
+        for (const boundary of project.boundaries ?? [])
+            boundaries.push({ ...boundary, ...yield* compile(boundary.html, boundary.source, `${boundary.kind}:${boundary.scope}`, false) });
+        return { ...project, routes, ...(project.boundaries ? { boundaries } : {}) };
+    }));
+}
+//# sourceMappingURL=native-authoring.js.map