@llui/vite-plugin 0.0.40 → 0.0.42

package/dist/transform.js

@@ -1,5 +1,6 @@
 import ts from 'typescript';
 import { collectDeps } from './collect-deps.js';
+import { resolveLocalConstInitializer, resolveAccessorBody, isMemoCallWithArrowArg, } from './accessor-resolver.js';
 import { extractMsgSchema, extractEffectSchema, isRichField, } from './msg-schema.js';
 import { extractMsgAnnotations } from './msg-annotations.js';
 import { extractStateSchema } from './state-schema.js';
@@ -94,66 +95,68 @@ const PROP_KEYS = new Set([
     'innerHTML',
     'textContent',
 ]);
+function isStaticPrimitiveLiteral(expr) {
+    return (ts.isStringLiteral(expr) ||
+        ts.isNumericLiteral(expr) ||
+        ts.isNoSubstitutionTemplateLiteral(expr) ||
+        expr.kind === ts.SyntaxKind.TrueKeyword ||
+        expr.kind === ts.SyntaxKind.FalseKeyword ||
+        expr.kind === ts.SyntaxKind.NullKeyword);
+}
 /**
- * Walk from `use` outward toward the source file root, looking for a
- * `const <name> = <initializer>` (or `let`/`var`) declaration that binds
- * this identifier in an enclosing scope. Returns the initializer if found.
- *
- * This enables reactive-binding detection for hoisted accessors:
- *
- *   const cls = (s: State) => isActive(item, s.path) ? 'on' : 'off'
- *   return a({ class: cls }, ...)
- *
- * Without resolution, `class: cls` would fall through the static path
- * and emit `__e.className = cls`, coercing the function to its source
- * string. With resolution, we see that `cls` is an arrow and emit a
- * binding exactly as if the arrow had been inlined.
- *
- * Lifetime rules:
- *   - Only single-binding `const`/`let`/`var` declarations with an
- *     initializer are considered. No destructuring, no multi-declarator
- *     statements (too easy to get wrong without a type checker).
- *   - Later reassignments are NOT tracked — if the identifier is `let`
- *     and gets reassigned, the resolution is unreliable. We conservatively
- *     refuse to resolve `let` bindings for now (arrow-valued accessors
- *     are ~always `const` in practice).
- *   - The declaration must dominate the use (same block or an enclosing
- *     one). TypeScript's block semantics mean walking up parent blocks
- *     is sufficient.
+ * Classify a reactive-prop value. See `ResolvedReactiveValue` for the
+ * contract. Returns `null` only when the value is none of the recognized
+ * shapes (caller can fall back to its own branches — currently only
+ * `tryTransformElementCall` does this for `isPerItemFieldAccess` /
+ * `isHoistedPerItem`).
  */
-function resolveLocalConstInitializer(use) {
-    const name = use.text;
-    let node = use;
-    while (node.parent) {
-        const parent = node.parent;
-        // Scan statements of an enclosing block/source-file for a matching declaration
-        let statements = null;
-        if (ts.isBlock(parent) || ts.isSourceFile(parent) || ts.isModuleBlock(parent)) {
-            statements = parent.statements;
+function classifyReactiveValue(value) {
+    // Inline arrow / function expression at the call site
+    if (ts.isArrowFunction(value) || ts.isFunctionExpression(value)) {
+        return { kind: 'arrow', accessor: value, valueForBinding: value };
+    }
+    // Inline `memo(arrow)` at the call site
+    if (isMemoCallWithArrowArg(value)) {
+        return {
+            kind: 'memo-call',
+            accessor: value.arguments[0],
+            valueForBinding: value,
+        };
+    }
+    // Identifier — resolve and classify the resolved declaration
+    if (ts.isIdentifier(value)) {
+        const resolved = resolveLocalConstInitializer(value);
+        if (!resolved) {
+            // Imported / parameter / unbound — can't prove it's a primitive,
+            // can't prove it's a function. Caller must bail to runtime.
+            return { kind: 'bail' };
         }
-        else if (ts.isCaseClause(parent) || ts.isDefaultClause(parent)) {
-            statements = parent.statements;
+        if (ts.isArrowFunction(resolved) || ts.isFunctionExpression(resolved)) {
+            return { kind: 'arrow', accessor: resolved, valueForBinding: value };
         }
-        if (statements) {
-            for (const stmt of statements) {
-                if (!ts.isVariableStatement(stmt))
-                    continue;
-                // Skip `let` — reassignment would invalidate our resolution
-                const flags = stmt.declarationList.flags;
-                if (!(flags & ts.NodeFlags.Const))
-                    continue;
-                if (stmt.declarationList.declarations.length !== 1)
-                    continue;
-                const decl = stmt.declarationList.declarations[0];
-                if (!ts.isIdentifier(decl.name) || decl.name.text !== name)
-                    continue;
-                if (!decl.initializer)
-                    continue;
-                return decl.initializer;
-            }
+        if (ts.isFunctionDeclaration(resolved)) {
+            return { kind: 'fn-decl', accessor: resolved, valueForBinding: value };
+        }
+        if (isMemoCallWithArrowArg(resolved)) {
+            return {
+                kind: 'memo-call',
+                accessor: resolved.arguments[0],
+                valueForBinding: value,
+            };
         }
-        node = parent;
+        if (isStaticPrimitiveLiteral(resolved)) {
+            return { kind: 'static-literal' };
+        }
+        // Resolved to something else (object/array/expression) — conservative
+        // bail. We don't know if the runtime value is a function; the runtime
+        // element helper handles both cases correctly.
+        return { kind: 'bail' };
+    }
+    // Static literals at the call site
+    if (isStaticPrimitiveLiteral(value)) {
+        return { kind: 'static-literal' };
     }
+    // CallExpression — caller decides (per-item, etc.)
     return null;
 }
 function classifyKind(key) {
@@ -821,70 +824,92 @@ function tryTransformElementCall(node, helpers, fieldBits, compiled, bailed, f)
                 events.push(f.createArrayLiteralExpression([f.createStringLiteral(eventName), value]));
                 continue;
             }
-            // If the value is an Identifier that refers to a local const-bound
-            // arrow/function, resolve it and treat it as if the arrow had been
-            // inlined. Without this, `class: cls` where `const cls = (s) => ...`
-            // falls through to the static path and emits `.className = cls`,
-            // coercing the function to its source string in the DOM.
-            if (ts.isIdentifier(value)) {
-                const resolved = resolveLocalConstInitializer(value);
-                if (resolved && (ts.isArrowFunction(resolved) || ts.isFunctionExpression(resolved))) {
-                    value = resolved;
-                }
+            // Per-item shapes — handled before the general classifier because
+            // they appear inside `each().render` callbacks where `item` is a
+            // closed-over per-row accessor (zero-arg). The resolver above can't
+            // see them; they're shape-matched syntactically.
+            if (isPerItemFieldAccess(value) || isHoistedPerItem(value)) {
+                const kind = classifyKind(key);
+                const resolvedKey = resolveKey(key, kind);
+                bindings.push(f.createArrayLiteralExpression([
+                    createMaskLiteral(f, 0xffffffff | 0),
+                    f.createStringLiteral(kind),
+                    f.createStringLiteral(resolvedKey),
+                    value,
+                ]));
+                continue;
             }
-            // Reactive binding — value is an arrow function or function expression
-            if (ts.isArrowFunction(value) || ts.isFunctionExpression(value)) {
+            if (ts.isCallExpression(value) && isPerItemCall(value)) {
                 const kind = classifyKind(key);
                 const resolvedKey = resolveKey(key, kind);
-                const { mask, readsState } = computeAccessorMask(value, fieldBits);
-                // Zero-mask constant folding: accessor doesn't read state → treat as static
-                if (mask === 0 && !readsState) {
-                    emitStaticProp(staticProps, f, kind, resolvedKey, f.createCallExpression(value, undefined, []));
-                    continue;
-                }
                 bindings.push(f.createArrayLiteralExpression([
-                    createMaskLiteral(f, mask),
+                    createMaskLiteral(f, 0xffffffff | 0),
                     f.createStringLiteral(kind),
                     f.createStringLiteral(resolvedKey),
                     value,
                 ]));
                 continue;
             }
-            // Call expression — check if it's a per-item accessor: item(t => t.field)
-            if (ts.isCallExpression(value)) {
-                if (isPerItemCall(value)) {
-                    // Emit as a binding with FULL_MASK — the accessor is the item() call itself
-                    const kind = classifyKind(key);
-                    const resolvedKey = resolveKey(key, kind);
-                    bindings.push(f.createArrayLiteralExpression([
-                        createMaskLiteral(f, 0xffffffff | 0),
-                        f.createStringLiteral(kind),
-                        f.createStringLiteral(resolvedKey),
-                        value,
-                    ]));
-                    continue;
-                }
-                // Unknown call expression — bail out
+            // Classify the value at a reactive-prop position:
+            //   - inline arrow / fn-expr at the call site
+            //   - inline `memo(arrow)` at the call site
+            //   - Identifier referencing a const-bound arrow/fn-expr in scope
+            //   - Identifier referencing a hoisted function declaration in scope
+            //   - Identifier referencing `const x = memo(arrow)` in scope
+            //   - Identifier referencing a static primitive literal
+            //   - Anything else (imports, parameters, opaque expressions) — bail
+            //     to runtime; the runtime helper handles `typeof v === 'function'`
+            //     correctly for both function and primitive values.
+            const classified = classifyReactiveValue(value);
+            if (classified === null) {
+                // Unknown shape (a CallExpression that isn't memo/per-item, etc.)
+                // — historically bailed to runtime. Preserve that.
                 bailed.add(localName);
                 return null;
             }
-            // Per-item property access: item.field — equivalent to item(t => t.field)
-            // Also matches hoisted __a0/__a1/… identifiers produced by dedup pass.
-            if (isPerItemFieldAccess(value) || isHoistedPerItem(value)) {
+            if (classified.kind === 'bail') {
+                bailed.add(localName);
+                return null;
+            }
+            if (classified.kind === 'static-literal') {
+                // Fall through to emitStaticProp (`__e.disabled = X`). Safe because
+                // we proved X is a primitive.
+                const kind = classifyKind(key);
+                const resolvedKey = resolveKey(key, kind);
+                emitStaticProp(staticProps, f, kind, resolvedKey, value);
+                continue;
+            }
+            // 'arrow' | 'fn-decl' | 'memo-call' — emit as a binding tuple. Mask is
+            // analyzed from the resolved accessor body (or the inner arrow inside
+            // a memo() call); the value emitted into the binding tuple is what the
+            // runtime calls as `accessor(state)` — for inline arrows we keep the
+            // arrow itself (preserves the historical inlining behavior), for
+            // identifier-bound forms we keep the identifier so consumers see
+            // a single canonical reference (and `memo()` proxies aren't rebuilt
+            // per render).
+            {
                 const kind = classifyKind(key);
                 const resolvedKey = resolveKey(key, kind);
+                const { mask, readsState } = computeAccessorMask(classified.accessor, fieldBits);
+                // Zero-mask constant folding only applies to inline arrows whose body
+                // we can safely call at compile time. For identifier-bound forms
+                // (`accessor !== value`) we skip the fold — calling the identifier's
+                // declaration at compile time would be unsafe (different scope) and
+                // calling the identifier in the emitted output would defeat the point.
+                if (classified.kind === 'arrow' &&
+                    classified.accessor === value &&
+                    mask === 0 &&
+                    !readsState) {
+                    emitStaticProp(staticProps, f, kind, resolvedKey, f.createCallExpression(classified.accessor, undefined, []));
+                    continue;
+                }
                 bindings.push(f.createArrayLiteralExpression([
-                    createMaskLiteral(f, 0xffffffff | 0),
+                    createMaskLiteral(f, mask === 0 && readsState ? 0xffffffff | 0 : mask),
                     f.createStringLiteral(kind),
                     f.createStringLiteral(resolvedKey),
-                    value,
+                    classified.valueForBinding,
                 ]));
-                continue;
             }
-            // Static prop
-            const kind = classifyKind(key);
-            const resolvedKey = resolveKey(key, kind);
-            emitStaticProp(staticProps, f, kind, resolvedKey, value);
         }
     }
     // Build elSplit args
@@ -971,13 +996,18 @@ function tryInjectTextMask(node, lluiImport, viewHelperNames, viewHelperAliases,
     const firstArg = node.arguments[0];
     if (!firstArg)
         return null;
-    // Only inject mask for accessor functions, not static strings
-    if (!ts.isArrowFunction(firstArg) && !ts.isFunctionExpression(firstArg))
-        return null;
     // Don't inject if mask already provided
     if (node.arguments.length >= 2)
         return null;
-    const { mask } = computeAccessorMask(firstArg, fieldBits);
+    // Resolve the accessor body — accepts inline arrows, `memo(arrow)`, or
+    // identifier references to a const-bound arrow / `memo(...)` / function
+    // declaration in scope. Anything else (static strings, opaque imports,
+    // parameters) leaves the call as-is — the runtime falls back to
+    // FULL_MASK, which is correct but slower.
+    const accessor = resolveAccessorBody(firstArg);
+    if (!accessor)
+        return null;
+    const { mask } = computeAccessorMask(accessor, fieldBits);
     return f.createCallExpression(node.expression, node.typeArguments, [
         firstArg,
         createMaskLiteral(f, mask === 0 ? 0xffffffff | 0 : mask),
@@ -1020,9 +1050,11 @@ function tryInjectStructuralMask(node, viewHelperNames, viewHelperAliases, field
         if (ts.isPropertyAssignment(prop) &&
             ts.isIdentifier(prop.name) &&
             prop.name.text === driverProp) {
-            if (ts.isArrowFunction(prop.initializer) || ts.isFunctionExpression(prop.initializer)) {
-                driverAccessor = prop.initializer;
-            }
+            // Same shape contract as `text()`'s first arg: inline arrow, inline
+            // `memo(arrow)`, or identifier referencing a const-bound arrow /
+            // memo / function declaration. Anything else leaves the call
+            // unchanged — runtime falls back to FULL_MASK.
+            driverAccessor = resolveAccessorBody(prop.initializer);
             break;
         }
     }
@@ -3392,16 +3424,31 @@ function isHoistedPerItem(node) {
 // mask = 0 + readsState = false → constant (can fold to static)
 // mask = 0 + readsState = true → unresolvable state access (FULL_MASK)
 // mask > 0 → precise mask
-function computeAccessorMask(accessor, fieldBits) {
+// See `NON_DELEGATION_HELPERS` in collect-deps.ts — same set of names
+// that aren't followed when scanning for `helper(s)` delegation calls.
+const NON_DELEGATION_HELPERS = new Set(['sample', 'item', 'memo', 'text', 'unsafeHtml']);
+function computeAccessorMask(accessor, fieldBits, visited = new Set()) {
+    if (visited.has(accessor))
+        return { mask: 0, readsState: false };
+    visited.add(accessor);
     if (accessor.parameters.length === 0)
         return { mask: 0xffffffff | 0, readsState: false };
     const paramName = accessor.parameters[0].name;
     if (!ts.isIdentifier(paramName))
         return { mask: 0xffffffff | 0, readsState: false };
+    // FunctionDeclaration always has a body (we never resolve overloads here);
+    // ArrowFunction's body may be a single expression. Both shapes are walked
+    // identically by ts.forEachChild, so no special-casing is needed below.
+    if (!accessor.body)
+        return { mask: 0xffffffff | 0, readsState: false };
     const stateParam = paramName.text;
     let mask = 0;
     let readsState = false;
-    function walk(node) {
+    // `inNestedFn` gates only the delegation-recursion. Property-access
+    // path extraction happens everywhere — inner-arrow callbacks like
+    // `s.items.filter((i) => i.includes(s.filter))` close over our
+    // state, and their `s.filter` reads contribute to the mask.
+    function walk(node, inNestedFn) {
         // `node.parent` can be undefined for synthetic nodes produced by
         // earlier AST-transform passes (the row-factory rewrite and the
         // per-item heuristic both build new sub-trees whose inner nodes
@@ -3429,8 +3476,17 @@ function computeAccessorMask(accessor, fieldBits) {
                         mask |= bit;
                     }
                     else {
+                        // Match paths that overlap our chain in either direction:
+                        //   - `path` extends `chain` — fieldBits has finer-grained paths
+                        //     than we're reading (e.g. chain='user', fieldBits has
+                        //     'user.email').
+                        //   - `chain` extends `path` — we're reading deeper than what
+                        //     fieldBits tracks (e.g. chain='items.filter' from
+                        //     `s.items.filter(...)`, fieldBits has 'items'). Both ends
+                        //     must mask in: a change to `items` invalidates anything
+                        //     downstream of it.
                         for (const [path, b] of fieldBits) {
-                            if (path.startsWith(chain + '.') || path === chain) {
+                            if (path === chain || path.startsWith(chain + '.') || chain.startsWith(path + '.')) {
                                 mask |= b;
                             }
                         }
@@ -3438,9 +3494,30 @@ function computeAccessorMask(accessor, fieldBits) {
                 }
             }
         }
-        ts.forEachChild(node, walk);
+        // Delegation: `helper(s)` where `s` matches our state param.
+        // Recurse into the helper's body so its state-path reads
+        // contribute to our mask. Only at top level — inside a nested
+        // function body, `s` may be shadowed and the call isn't
+        // unambiguously handing our state in.
+        if (!inNestedFn && ts.isCallExpression(node) && ts.isIdentifier(node.expression)) {
+            const calleeName = node.expression.text;
+            if (!NON_DELEGATION_HELPERS.has(calleeName)) {
+                const arg0 = node.arguments[0];
+                if (arg0 && ts.isIdentifier(arg0) && arg0.text === stateParam) {
+                    const resolved = resolveAccessorBody(node.expression);
+                    if (resolved) {
+                        const inner = computeAccessorMask(resolved, fieldBits, visited);
+                        mask |= inner.mask;
+                        if (inner.readsState)
+                            readsState = true;
+                    }
+                }
+            }
+        }
+        const enteringNested = ts.isArrowFunction(node) || ts.isFunctionExpression(node) || ts.isFunctionDeclaration(node);
+        ts.forEachChild(node, (child) => walk(child, inNestedFn || enteringNested));
     }
-    walk(accessor.body);
+    walk(accessor.body, false);
     if (mask === 0 && readsState) {
         return { mask: 0xffffffff | 0, readsState: true };
     }