ferrovue 0.2.0 → 0.4.0

package/dist/attrs.js

@@ -1,15 +1,17 @@
-/* Attributes as Vue's server renderer writes them: `class`, `style`, booleans, merged objects. */
-import { escapeHtml, hyphenate, isBooleanAttr, isSSRSafeAttrName, parseStringStyle, propsToAttrMap } from "@vue/shared";
-import { fail, GenError, rustStr, STR } from "./model.js";
+import { escapeHtml, hyphenate, isBooleanAttr, isSSRSafeAttrName, propsToAttrMap } from "@vue/shared";
+import { fail, GenError, rustStr } from "./model.js";
 import { CONFIG_FILE, ctx } from "./context.js";
-import { cond, expr, known, meet, truthy, unquote } from "./expr.js";
-import { atom, bare, condition, logical, not, receiver, strArg } from "./parens.js";
+import { describeTy, expr } from "./expr.js";
+import { known, truthy } from "./narrowing.js";
+import { asCow, isTemporary, unquote } from "./strings.js";
+import { atom, bare, condition, receiver, strArg } from "./parens.js";
 import { Emitter } from "./emitter.js";
-/** What a number written at run time is expected to take: most a page shows are shorter, and the
- * reservation is an estimate. */
+import { isDollarAttrs } from "./fallthrough.js";
+import { claim } from "./plugin.js";
+import { classAttr, classPresent, literalClass, maybeEqual, renderClass } from "./classes.js";
+import { mergedStyle, renderStyle, styleAttr } from "./styles.js";
 const NUMBER_BYTES = 6;
-/** A string, a number or a boolean written escaped: now when it is known, by JavaScript itself. */
-function display(e, v) {
+export function display(e, v) {
     if (v.ty.k === "str" && known(v) !== undefined)
         e.lit(escapeHtml(unquote(v.code)));
     else if ((v.ty.k === "int" || v.ty.k === "float") && v.num !== undefined)
@@ -20,7 +22,6 @@ function display(e, v) {
         e.stmt(`fv::escape_into(out, ${strArg(v.code)});`);
     else if (v.ty.k === "int" || v.ty.k === "float") {
         e.stmt(`fv::${v.ty.k === "int" ? "push_int" : "push_number"}(out, ${bare(v.code)});`);
-        // Counted in the reservation, or a page of numbers outgrows it and is copied to a larger one.
         e.expect(NUMBER_BYTES);
     }
     else if (v.ty.k === "bool")
@@ -29,41 +30,43 @@ function display(e, v) {
         return false;
     return true;
 }
-/** `toDisplayString`, escaped. */
 export function interpolate(e, v) {
     if (display(e, v))
         return;
     switch (v.ty.k) {
         case "undef":
             return;
-        // `toDisplayString` of a query value: a string, nothing for `null`, an array as JSON.
-        case "query":
-            e.stmt(`${atom(v.code)}.write_display(out);`);
-            return;
         case "opt":
             e.open(`if let Some(v) = ${v.code}`);
             interpolate(e, { code: "v", ty: v.ty.of });
             e.close();
             return;
         default:
+            if (ctx.plugins.some((p) => p.values?.interpolate?.(e, v)))
+                return;
             throw new GenError("only strings, numbers and booleans can be interpolated");
     }
 }
-/** The value half of `key="value"`, escaped. */
 export function attrValue(e, v) {
     if (!display(e, v))
         throw new GenError("an attribute value must be a string, a number or a boolean");
 }
-/** `ssrRenderAttr(key, value)`: absent for null/undefined, `key="value"` for anything else. */
-export function renderAttr(e, key, v) {
+function renderable(s, key, v, n) {
+    const ty = v.ty.k === "opt" ? v.ty.of : v.ty;
+    if (ty.k === "str" || ty.k === "int" || ty.k === "float" || ty.k === "bool" || ty.k === "undef")
+        return;
+    const own = claim((p) => p.values?.unbindable?.(ty));
+    const what = own?.what ?? describeTy(ty);
+    const fix = own?.fix ?? (ty.k === "list" ? 'join it into one string, as `.join(",")`' : "bind a string, a number or a boolean");
+    fail(s.comp, `\`${key}\` is bound to ${what}: Vue's server renderer leaves the attribute out, and hydration then sets it, changing the page; ${fix}`, n);
+}
+export function renderAttr(s, e, key, v, n) {
+    renderable(s, key, v, n);
     if (v.ty.k === "undef")
         return;
-    // Only a single query value is an attribute's value; `null` and an array leave it out.
-    if (v.ty.k === "query")
-        v = { code: `${atom(v.code)}.attr_value()`, ty: { k: "opt", of: STR } };
     if (v.ty.k === "opt") {
         e.open(`if let Some(v) = ${v.code}`);
-        renderAttr(e, key, { code: "v", ty: v.ty.of });
+        renderAttr(s, e, key, { code: "v", ty: v.ty.of }, n);
         e.close();
         return;
     }
@@ -71,19 +74,15 @@ export function renderAttr(e, key, v) {
     attrValue(e, v);
     e.lit(`"`);
 }
-/** `ssrRenderDynamicAttr(key, value)`: as `renderAttr`, but a boolean attribute is present or
- * absent, and an empty string renders the name alone. */
 export function renderDynamicAttr(s, e, key, v, n) {
     const name = propsToAttrMap[key] ?? key.toLowerCase();
     if (!isSSRSafeAttrName(name))
         fail(s.comp, `unsafe attribute name \`${name}\``, n);
+    renderable(s, key, v, n);
     if (v.ty.k === "undef")
         return;
-    if (v.ty.k === "query")
-        v = { code: `${atom(v.code)}.attr_value()`, ty: { k: "opt", of: STR } };
     const boolean = (t) => isBooleanAttr(name) || (name === "hidden" && (t.k === "bool" || t.k === "int" || t.k === "float"));
     if (v.ty.k === "opt" && boolean(v.ty.of)) {
-        // Present, or truthy when it is not a string: one test, with nothing to bind.
         e.open(`if ${v.ty.of.k === "str" ? `${atom(v.code)}.is_some()` : truthy(v)}`);
         e.lit(` ${name}`);
         e.close();
@@ -115,7 +114,6 @@ export function renderDynamicAttr(s, e, key, v, n) {
         e.lit(` ${name}`);
         e.close(" else {");
         e.lit(` ${name}="`);
-        // Re-evaluated rather than bound: every string expression here is a borrow or a pure call.
         attrValue(e, v);
         e.lit(`"`);
         e.close();
@@ -125,132 +123,15 @@ export function renderDynamicAttr(s, e, key, v, n) {
     attrValue(e, v);
     e.lit(`"`);
 }
-/** `normalizeClass`'s view of a class binding, flattened: a string, an array of items, an object
- * of `name: condition`, `cond && "name"`, `cond ? "a" : null`. Every item is trimmed and the empty
- * ones dropped before they are joined with one space, which is what `class_into` does too, so an
- * object's keys become items of their own. */
-export function classItems(s, n) {
-    switch (n.type) {
-        case "StringLiteral": {
-            const t = n.value.trim();
-            return t ? [{ lit: t }] : [];
-        }
-        case "ArrayExpression":
-            return n.elements.flatMap((el) => (el ? classItems(s, el) : []));
-        case "ObjectExpression":
-            // A computed name may hold spaces, which Vue keeps between the names it joins: such an object
-            // is normalised whole, at run time, as Vue normalises it.
-            // Normalised whole, at run time, as a JavaScript object: when a name is computed (and may hold
-            // spaces, repeat another, or be an array index), or a literal name repeats or is an index —
-            // which a JavaScript object lists first, in numeric order.
-            const literalNames = n.properties
-                .filter((p) => p.type === "ObjectProperty" && !p.computed)
-                .map((p) => (p.key.type === "Identifier" ? p.key.name : String(p.key.value)));
-            const arrayIndex = (k) => /^(0|[1-9]\d*)$/.test(k) && Number(k) < 2 ** 32 - 1;
-            if (n.properties.some((p) => p.type === "ObjectProperty" && p.computed) ||
-                literalNames.some(arrayIndex) ||
-                new Set(literalNames).size !== literalNames.length) {
-                const keys = [];
-                const entries = n.properties.map((p) => {
-                    if (p.type !== "ObjectProperty")
-                        fail(s.comp, "a class object holds `name: condition` pairs", p);
-                    const key = p.computed ? expr(s, p.key) : { code: rustStr(p.key.type === "Identifier" ? p.key.name : String(p.key.value)), ty: STR };
-                    if (key.ty.k !== "str")
-                        fail(s.comp, "a computed class name is a string", p.key);
-                    // Names are told apart, which two halves of surrogate pairs would not be.
-                    for (const other of keys)
-                        meet(s.comp, other, key, "a class object's names", p.key, "equal");
-                    keys.push(key);
-                    return `(${bare(cond(s, p.value))}, ${bare(key.code)})`;
-                });
-                return [{ code: `&*fv::class_object(&[${entries.join(", ")}])` }];
-            }
-            return n.properties.flatMap((p) => {
-                if (p.type !== "ObjectProperty")
-                    fail(s.comp, "a class object holds `name: condition` pairs", p);
-                // A literal name is written as it is: an object's names are joined, not trimmed one by one.
-                let name;
-                if (!p.computed) {
-                    const key = p.key.type === "Identifier" ? p.key.name : String(p.key.value);
-                    if (key !== key.trim() || !key)
-                        fail(s.comp, `class name \`${key}\` has spaces around it`, p);
-                    name = { lit: key };
-                }
-                else {
-                    const k = expr(s, p.key);
-                    if (k.ty.k !== "str")
-                        fail(s.comp, "a computed class name is a string", p.key);
-                    name = { code: `fv::js_trim(${strArg(k.code)})` };
-                }
-                const v = expr(s, p.value);
-                const on = known(v);
-                if (on !== undefined)
-                    return on ? [name] : [];
-                const text = "lit" in name ? rustStr(name.lit) : name.code;
-                return [{ code: `if ${condition(truthy(v))} { ${bare(text)} } else { "" }` }];
-            });
-        case "LogicalExpression":
-            if (n.operator === "&&") {
-                return conditional(cond(s, n.left), classItems(s, n.right));
-            }
-            break;
-        case "ConditionalExpression":
-            if (n.consequent.type === "NullLiteral" || n.alternate.type === "NullLiteral") {
-                const branch = n.consequent.type === "NullLiteral" ? n.alternate : n.consequent;
-                const test = cond(s, n.test);
-                return conditional(n.consequent.type === "NullLiteral" ? not(test) : test, classItems(s, branch));
-            }
-            break;
-    }
-    const v = expr(s, n);
-    if (v.ty.k === "str")
-        return [{ code: v.code }];
-    if (v.ty.k === "opt" && v.ty.of.k === "str")
-        return [{ code: `${atom(v.code)}.unwrap_or("")` }];
-    if (v.ty.k === "undef")
-        return [];
-    return fail(s.comp, "a class is a string, an array, or an object of conditions", n);
-}
-/** Class items that apply only when \`test\` holds: each one, or nothing, decided now if it can be. */
-function conditional(test, items) {
-    if (test === "true" || test === "false")
-        return test === "true" ? items : [];
-    return items.map((it) => ({ code: `if ${condition(test)} { ${"lit" in it ? rustStr(it.lit) : bare(it.code)} } else { "" }` }));
-}
-/** `ssrRenderClass(value)`: normalised, then escaped. `after` says a class was already written. */
-export function renderClass(s, e, n, after = false) {
-    const items = classItems(s, n);
-    // Literal items before the first run-time one are written now; the rest go to `class_into`,
-    // which decides at run time whether each needs a separator.
-    let wrote = after;
-    let i = 0;
-    for (; i < items.length; i++) {
-        const it = items[i];
-        if (!("lit" in it))
-            break;
-        e.lit((wrote ? " " : "") + escapeHtml(it.lit));
-        wrote = true;
-    }
-    if (i < items.length) {
-        const rest = items.slice(i).map((it) => ("lit" in it ? rustStr(it.lit) : it.code));
-        e.stmt(`fv::class_into(out, ${wrote}, &[${rest.join(", ")}]);`);
-    }
-}
 export const IGNORED_PROPS = new Set(["", "key", "ref", "innerHTML", "textContent", "ref_key", "ref_for"]);
-/** `ssrRenderAttrs(_attrs)` on the root: the scope ids a parent handed it, already written as Vue
- * writes them. They are all `_attrs` holds, since a parent passes a child only the props it
- * declares and nothing else falls through. */
 function inheritedAttrs(s, e) {
     if (s.attrs !== null)
         e.stmt(`out.push_str(${s.attrs});`);
 }
-/** `ssrGetDirectiveProps(_ctx, dir)`: a custom directive's server props, which are none for a
- * directive the configuration declares client-only. `false` when `n` is not such a call. */
 export function directiveProps(s, n) {
     if (n?.type !== "CallExpression" || n.callee.type !== "Identifier" || n.callee.name !== "_ssrGetDirectiveProps")
         return false;
     const dir = n.arguments[1];
-    // `$setup["vFocus"]` for an imported directive, `_directive_focus` for a registered one.
     let name = null;
     if (dir?.type === "MemberExpression") {
         const local = dir.computed ? dir.property.value : dir.property.name;
@@ -263,32 +144,84 @@ export function directiveProps(s, n) {
     }
     return true;
 }
-/** `ssrRenderAttrs(obj)`, key by key in the object's order, and the inherited scope ids where the
- * root's `_attrs` is merged in. */
+export function isAttrs(n) {
+    return n?.type === "Identifier" && n.name === "_attrs";
+}
+export function dollarAttrs(s, n) {
+    if (!isDollarAttrs(n, s.attrsBindings))
+        return false;
+    if (s.comp.idsInAttrs) {
+        fail(s.comp, `\`$attrs\` in ${s.comp.name}, the root of a component that may be handed scope ids: it would hold them as attributes too`, n);
+    }
+    return true;
+}
+export function mergedParts(n) {
+    return n?.type === "CallExpression" && n.callee.type === "Identifier" && n.callee.name === "_mergeProps" ? n.arguments : [n];
+}
 export function renderAttrs(s, e, n) {
-    const isAttrs = (a) => a.type === "Identifier" && a.name === "_attrs";
+    const parts = mergedParts(n);
+    const passed = (p) => s.fallthrough !== null && ((isAttrs(p) && s.comp.inheritAttrs) || dollarAttrs(s, p));
+    if (!parts.some(passed)) {
+        staticAttrs(s, e, n);
+        return;
+    }
+    e.open(`if ${s.fallthrough}.is_empty()`);
+    const at = e.lines.length;
+    staticAttrs(s, e, n);
+    e.flush();
+    if (e.lines.length === at)
+        e.replace(at - 1, `if ${s.fallthrough}.is_empty()`, `if !${s.fallthrough}.is_empty()`);
+    else
+        e.close(" else {");
+    if (parts.length === 1 && parts[0] === n) {
+        e.stmt(`fv::passed_attrs_into(out, ${s.fallthrough}.list(), ${isAttrs(n) && s.attrs !== null ? s.attrs : '""'});`);
+        e.close();
+        return;
+    }
+    const sources = [];
+    let idsAt = -1;
+    for (const p of parts) {
+        if (directiveProps(s, p))
+            continue;
+        if (isAttrs(p))
+            idsAt = sources.length;
+        if (passed(p))
+            sources.push(`${s.fallthrough}.list()`);
+        else if (isAttrs(p))
+            sources.push("&[]");
+        else if (p.type === "ObjectExpression")
+            sources.push(`&[${attrEntries(s, p, "own").join(", ")}]`);
+        else
+            fail(s.comp, "attributes must be an object literal", p);
+    }
+    const ids = idsAt >= 0 && s.attrs !== null ? s.attrs : '""';
+    e.stmt(`fv::attrs_into(out, &[${sources.join(", ")}], ${idsAt >= 0 ? idsAt : sources.length}, ${ids});`);
+    e.close();
+}
+function staticAttrs(s, e, n) {
     if (isAttrs(n)) {
         inheritedAttrs(s, e);
         return;
     }
-    if (directiveProps(s, n))
+    if (dollarAttrs(s, n) || directiveProps(s, n))
         return;
     if (n.type === "CallExpression" && n.callee.type === "Identifier" && n.callee.name === "_mergeProps") {
         const merged = mergeProps(s, n);
         const at = n.arguments.findIndex(isAttrs);
         if (at < 0) {
-            renderAttrs(s, e, merged);
+            objectAttrs(s, e, merged, true);
             return;
         }
-        // The inherited ids take their place among the keys: after those given before `_attrs`, before
-        // those first given after it, such as `v-show`'s `style` when there is no other.
         const before = new Set(mergeProps(s, { ...n, arguments: n.arguments.slice(0, at) }).properties.map((p) => p.key.name ?? p.key.value));
         const part = (early) => ({ ...merged, properties: merged.properties.filter((p) => before.has(p.key.name ?? p.key.value) === early) });
-        renderAttrs(s, e, part(true));
+        objectAttrs(s, e, part(true), true);
         inheritedAttrs(s, e);
-        renderAttrs(s, e, part(false));
+        objectAttrs(s, e, part(false), true);
         return;
     }
+    objectAttrs(s, e, n, false);
+}
+function objectAttrs(s, e, n, merged) {
     if (n.type !== "ObjectExpression")
         fail(s.comp, "attributes must be an object literal", n);
     for (const p of n.properties) {
@@ -297,19 +230,28 @@ export function renderAttrs(s, e, n) {
         const raw = p.key.type === "Identifier" ? p.key.name : p.key.value;
         if (IGNORED_PROPS.has(raw) || /^on[^a-z]/.test(raw) || raw.startsWith("."))
             continue;
-        // Vue strips the `^` attribute-binding prefix before it looks at the name.
         const key = raw.startsWith("^") ? raw.slice(1) : raw;
         if (key === "className") {
             fail(s.comp, "`className` renders by its own rule in Vue; bind `class`", p);
         }
         else if (key === "class") {
+            const present = merged ? classPresent(s, p.value) : "true";
+            if (present === "false")
+                continue;
+            if (present !== "true")
+                e.open(`if ${condition(present)}`);
             e.lit(` class="`);
             renderClass(s, e, p.value);
             e.lit(`"`);
+            if (present !== "true")
+                e.close();
         }
         else if (key === "style") {
             e.lit(` style="`);
-            renderStyle(s, e, p.value);
+            if (merged)
+                mergedStyle(s, e, p.value);
+            else
+                renderStyle(s, e, p.value);
             e.lit(`"`);
         }
         else {
@@ -317,13 +259,10 @@ export function renderAttrs(s, e, n) {
         }
     }
 }
-/** `mergeProps(a, _attrs, b, …)` as one object literal, without `_attrs`: it holds only scope ids,
- * which the caller writes after the rest. Of the rest, `class` and `style` values are merged as an
- * array, and any other key keeps the place it first had with the last value given. */
 export function mergeProps(s, n) {
     const merged = new Map();
     for (const a of n.arguments) {
-        if (a.type === "Identifier" && a.name === "_attrs")
+        if (isAttrs(a) || dollarAttrs(s, a))
             continue;
         if (directiveProps(s, a))
             continue;
@@ -334,11 +273,18 @@ export function mergeProps(s, n) {
                 fail(s.comp, "attribute objects hold plain keys", p);
             const key = p.key.type === "Identifier" ? p.key.name : p.key.value;
             const had = merged.get(key);
-            if (had && (key === "class" || key === "style")) {
-                merged.set(key, { ...p, value: { type: "ArrayExpression", elements: [had.value, p.value] } });
+            if (had && key === "class" && maybeEqual(s, p.value)) {
+                const before = literalClass(had.value);
+                if (before === null || p.value.type !== "StringLiteral") {
+                    fail(s.comp, "a class merged with a string that may equal the class before it, which Vue then writes once: bind an array", p);
+                }
+                if (before !== p.value.value)
+                    merged.set(key, { ...p, value: { type: "ArrayExpression", elements: [had.value, p.value], fvMerged: true } });
+            }
+            else if (had && (key === "class" || key === "style")) {
+                merged.set(key, { ...p, value: { type: "ArrayExpression", elements: [had.value, p.value], fvMerged: true } });
             }
             else if (had) {
-                // `Map` keeps a key where it was first set, as a JavaScript object does.
                 merged.set(key, { ...had, value: p.value });
             }
             else
@@ -347,142 +293,47 @@ export function mergeProps(s, n) {
     }
     return { type: "ObjectExpression", properties: [...merged.values()] };
 }
-/** The objects a style binding merges, in order: an object literal, a static `style` the compiler
- * parsed, `v-show`'s `cond ? null : { display: "none" }`, and arrays of those. */
-export function styleItems(s, n, when) {
-    // A condition known now: an object that never applies is left out, one that always does is not
-    // conditional.
-    if (when === "false")
-        return [];
-    if (when === "true")
-        when = null;
-    const both = (a, b) => (a === null ? b : logical(a, "&&", b));
-    switch (n.type) {
-        case "NullLiteral":
-            return [];
-        case "ArrayExpression":
-            return n.elements.flatMap((el) => (el ? styleItems(s, el, when) : []));
-        case "StringLiteral":
-            // Parsed as `normalizeStyle` parses a string inside an array, by Vue's own function.
-            return [{ cond: when, entries: Object.entries(parseStringStyle(n.value)).map(([key, v]) => ({ key, css: key, value: { type: "StringLiteral", value: v } })) }];
-        case "ConditionalExpression": {
-            const t = cond(s, n.test);
-            return [...styleItems(s, n.consequent, both(when, t)), ...styleItems(s, n.alternate, both(when, not(t)))];
-        }
-        case "LogicalExpression":
-            if (n.operator === "&&")
-                return styleItems(s, n.right, both(when, cond(s, n.left)));
-            break;
-        case "ObjectExpression":
-            return [{
-                    cond: when,
-                    entries: n.properties.map((p) => {
-                        if (p.type !== "ObjectProperty" || p.computed)
-                            fail(s.comp, "a style object holds plain `property: value` pairs", p);
-                        const key = p.key.type === "Identifier" ? p.key.name : String(p.key.value);
-                        // An integer-like key comes first in a JavaScript object whatever the order written.
-                        if (/^\d+$/.test(key) || key.startsWith(":"))
-                            fail(s.comp, `style property \`${key}\``, p);
-                        return { key, css: key.startsWith("--") ? key : hyphenate(key), value: p.value };
-                    }),
-                }];
-    }
-    return fail(s.comp, "a style binding is an object, an array of objects, or a string on its own", n);
-}
-/** `ssrRenderStyle(value)`: a string as it is, or the objects merged — each property where it first
- * appears, with the last value given — and written `name:value;`, all escaped. */
-export function renderStyle(s, e, n) {
-    // A string on its own is written as it is, with no normalising.
-    if (n.type === "StringLiteral") {
-        e.lit(escapeHtml(n.value));
-        return;
-    }
-    if (n.type !== "ObjectExpression" && n.type !== "ArrayExpression" && n.type !== "ConditionalExpression" && n.type !== "LogicalExpression" && n.type !== "NullLiteral") {
-        const v = expr(s, n);
-        if (v.ty.k === "str")
-            e.stmt(`fv::escape_into(out, ${strArg(v.code)});`);
-        else if (v.ty.k === "opt" && v.ty.of.k === "str") {
-            e.open(`if let Some(v) = ${v.code}`);
-            e.stmt("fv::escape_into(out, v);");
-            e.close();
-        }
-        else if (v.ty.k !== "undef")
-            fail(s.comp, "a style binding is a string, an object or an array", n);
-        return;
-    }
-    const items = styleItems(s, n, null);
-    // Each property, where it first appears, with every place that sets it.
-    const order = [];
-    const sets = new Map();
-    for (const it of items) {
-        for (const en of it.entries) {
-            if (!sets.has(en.key)) {
-                order.push(en.key);
-                sets.set(en.key, []);
-            }
-            sets.get(en.key).push({ cond: it.cond, css: en.css, value: en.value });
-        }
-    }
-    const write = (css, value) => {
-        // A literal is stringified now, by JavaScript itself: `0.5`, `"1px"`.
-        if (value.type === "StringLiteral" || value.type === "NumericLiteral") {
-            e.lit(escapeHtml(`${css}:${String(value.value)};`));
-            return;
-        }
-        const v = expr(s, value);
-        const one = (w) => {
-            if (w.ty.k === "str" || w.ty.k === "int" || w.ty.k === "float") {
-                e.lit(`${escapeHtml(css)}:`);
-                display(e, w);
-                e.lit(";");
-            }
-            else if (w.ty.k === "opt") {
-                e.open(`if let Some(v) = ${w.code}`);
-                one({ code: "v", ty: w.ty.of });
-                e.close();
-            }
-            // A boolean or `undefined` writes nothing — and, set later, removes what was set before.
-        };
-        one(v);
-    };
-    // A property's place is where an object that is present first sets it. When that object is
-    // conditional and the property is set again after another one first appears, the order would be
-    // decided at run time.
-    const flat = items.flatMap((it, i) => it.entries.map((en) => ({ key: en.key, item: i, cond: it.cond })));
-    for (const key of order) {
-        const at = flat.filter((f) => f.key === key);
-        if (at.length < 2 || at[0].cond === null)
+export function attrEntries(s, obj, side) {
+    const out = [];
+    for (const p of obj.properties) {
+        if (p.type !== "ObjectProperty" || p.computed)
+            fail(s.comp, "attribute objects hold plain keys", p);
+        const key = p.key.type === "Identifier" ? p.key.name : String(p.key.value);
+        if (IGNORED_PROPS.has(key) || /^on[^a-z]/.test(key) || key.startsWith("."))
             continue;
-        const first = flat.indexOf(at[0]);
-        const again = flat.indexOf(at[at.length - 1]);
-        const between = flat.slice(first + 1, again).some((f) => order.indexOf(f.key) > order.indexOf(key));
-        if (between)
-            fail(s.comp, `the place of style property \`${key}\` would depend on a condition; set it unconditionally first`, n);
+        out.push(`(${rustStr(key)}, ${attrOf(s, key, p.value, side)})`);
     }
-    for (const key of order) {
-        // The last place that sets it wins: walked back to the first that always applies.
-        const chain = [];
-        for (const set of sets.get(key).toReversed()) {
-            chain.push(set);
-            if (set.cond === null)
-                break;
-        }
-        if (chain.length === 1 && chain[0].cond === null) {
-            write(chain[0].css, chain[0].value);
-            continue;
+    return out;
+}
+export function attrOf(s, key, n, side) {
+    if (key === "className")
+        fail(s.comp, "`className` renders by its own rule in Vue; bind `class`", n);
+    if (key === "class")
+        return classAttr(s, n, side);
+    if (key === "style")
+        return styleAttr(s, n);
+    if (n.type === "NullLiteral")
+        return "fv::Attr::Undefined";
+    return valueAttr(s, expr(s, n), n);
+}
+export function valueAttr(s, v, n) {
+    switch (v.ty.k) {
+        case "str":
+            return isTemporary(v) ? `fv::Attr::Str(${asCow(v)})` : `fv::Attr::str(${strArg(v.code)})`;
+        case "int":
+            return `fv::Attr::Int(${bare(v.code)})`;
+        case "float":
+            return `fv::Attr::Float(${bare(v.code)})`;
+        case "bool":
+            return `fv::Attr::Bool(${bare(v.code)})`;
+        case "undef":
+            return "fv::Attr::Undefined";
+        case "opt": {
+            const of = v.ty.of.k;
+            const make = of === "str" ? "fv::Attr::str" : of === "int" ? "fv::Attr::Int" : of === "float" ? "fv::Attr::Float" : of === "bool" ? "fv::Attr::Bool" : null;
+            if (make !== null)
+                return `${atom(v.code)}.map_or(fv::Attr::Undefined, ${make})`;
         }
-        chain.forEach((set, i) => {
-            if (set.cond === null) {
-                e.close(" else {");
-            }
-            else if (i === 0) {
-                e.open(`if ${condition(set.cond)}`);
-            }
-            else {
-                e.close(` else if ${condition(set.cond)} {`);
-            }
-            write(set.css, set.value);
-        });
-        e.close();
     }
+    return fail(s.comp, "an attribute that may fall through is a string, a number or a boolean", n);
 }

package/dist/calls.d.ts

@@ -0,0 +1,4 @@
+import { type N, type Scope, type Val } from "./model.ts";
+export declare function call(s: Scope, n: N): Val;
+export declare function isObjectCall(n: N, method: string): boolean;
+export declare function helperCall(s: Scope, name: string, args: N[], n: N): Val;