@barefootjs/jsx 0.17.1 → 0.18.1

package/dist/index.js

@@ -441,6 +441,7 @@ function convertNode(node, raw) {
       if (callee.property === "flat") {
         const depthNode = node.arguments[0];
         let flatDepth;
+        let depthExpr;
         if (depthNode === undefined) {
           flatDepth = 1;
         } else if (ts2.isIdentifier(depthNode) && depthNode.text === "Infinity") {
@@ -453,16 +454,23 @@ function convertNode(node, raw) {
             n = -Number(depthNode.operand.text);
           }
           if (n === undefined || Number.isNaN(n)) {
-            return {
-              kind: "unsupported",
-              raw,
-              reason: `\`.flat(depth)\` needs a literal integer or \`Infinity\` depth — a computed depth can't be resolved at template time. Use a literal depth, or pre-compute the value before the template.`
-            };
+            const parsedDepth = convertNode(depthNode, raw);
+            if (checkSupport(parsedDepth).supported) {
+              depthExpr = parsedDepth;
+              flatDepth = 1;
+            } else {
+              return {
+                kind: "unsupported",
+                raw,
+                reason: `\`.flat(depth)\` needs a literal integer, \`Infinity\`, or a supported dynamic depth expression — this depth can't be resolved. Use a literal depth, a supported expression (prop/signal/arithmetic), or pre-compute the value before the template.`
+              };
+            }
+          } else {
+            const truncated = Math.trunc(n);
+            flatDepth = truncated < 0 ? 0 : truncated;
           }
-          const truncated = Math.trunc(n);
-          flatDepth = truncated < 0 ? 0 : truncated;
         }
-        return { kind: "array-method", method: "flat", object: callee.object, args: [], flatDepth };
+        return depthExpr !== undefined ? { kind: "array-method", method: "flat", object: callee.object, args: [], flatDepth, depthExpr } : { kind: "array-method", method: "flat", object: callee.object, args: [], flatDepth };
       }
       if (callee.property === "toLowerCase") {
         return { kind: "array-method", method: "toLowerCase", object: callee.object, args };
@@ -1007,6 +1015,8 @@ function validateRestUsage(expr, restName, excludedTopKeys) {
         walk(e.object);
         for (const a of e.args)
           walk(a);
+        if (e.method === "flat" && e.depthExpr)
+          walk(e.depthExpr);
         return;
       case "literal":
       case "unsupported":
@@ -1092,6 +1102,8 @@ function collectIdentifiers(expr, out) {
     case "array-method":
       collectIdentifiers(expr.object, out);
       expr.args.forEach((e) => collectIdentifiers(e, out));
+      if (expr.method === "flat" && expr.depthExpr)
+        collectIdentifiers(expr.depthExpr, out);
       return;
     case "literal":
     case "regex":
@@ -1149,7 +1161,14 @@ function substituteDestructuredFields(expr, fieldMap, syntheticParam, restName)
         return { kind: "array-literal", elements: e.elements.map(walk) };
       case "array-method":
         if (e.method === "flat") {
-          return { kind: "array-method", method: "flat", object: walk(e.object), args: [], flatDepth: e.flatDepth };
+          return {
+            kind: "array-method",
+            method: "flat",
+            object: walk(e.object),
+            args: [],
+            flatDepth: e.flatDepth,
+            ...e.depthExpr ? { depthExpr: walk(e.depthExpr) } : {}
+          };
         }
         return { kind: "array-method", method: e.method, object: walk(e.object), args: e.args.map(walk) };
       case "literal":
@@ -1246,6 +1265,11 @@ function checkSupport(expr) {
         if (!argSupport.supported)
           return argSupport;
       }
+      if (expr.method === "flat" && expr.depthExpr) {
+        const depthSupport = checkSupport(expr.depthExpr);
+        if (!depthSupport.supported)
+          return depthSupport;
+      }
       return { supported: true, level: "L2" };
     }
     case "call": {
@@ -1345,6 +1369,9 @@ function checkSupport(expr) {
       const leftSupport = checkSupport(expr.left);
       if (!leftSupport.supported)
         return leftSupport;
+      if (expr.op === "??" && expr.right.kind === "object-literal" && expr.right.properties.length === 0) {
+        return { supported: true, level: "L4" };
+      }
       const rightSupport = checkSupport(expr.right);
       if (!rightSupport.supported)
         return rightSupport;
@@ -1399,7 +1426,7 @@ function containsHigherOrder(expr) {
     case "array-literal":
       return expr.elements.some(containsHigherOrder);
     case "array-method":
-      return containsHigherOrder(expr.object) || expr.args.some(containsHigherOrder);
+      return containsHigherOrder(expr.object) || expr.args.some(containsHigherOrder) || expr.method === "flat" && expr.depthExpr !== undefined && containsHigherOrder(expr.depthExpr);
     default:
       return false;
   }
@@ -1567,7 +1594,10 @@ function usesPerPath(name, expr) {
       case "array-literal":
         return sum(e.elements);
       case "array-method":
-        return add(walk(e.object), e.method === "flat" ? { min: 0, max: 0 } : sum(e.args));
+        if (e.method === "flat") {
+          return add(walk(e.object), e.depthExpr ? walk(e.depthExpr) : { min: 0, max: 0 });
+        }
+        return add(walk(e.object), sum(e.args));
       case "object-literal":
         return sum(e.properties.map((p) => p.value));
       case "arrow":
@@ -1622,7 +1652,14 @@ function inlineBinding(expr, name, value) {
         return { kind: "array-literal", elements: e.elements.map((el) => walk(el, enclosing)) };
       case "array-method":
         if (e.method === "flat") {
-          return { kind: "array-method", method: "flat", object: walk(e.object, enclosing), args: [], flatDepth: e.flatDepth };
+          return {
+            kind: "array-method",
+            method: "flat",
+            object: walk(e.object, enclosing),
+            args: [],
+            flatDepth: e.flatDepth,
+            ...e.depthExpr ? { depthExpr: walk(e.depthExpr, enclosing) } : {}
+          };
         }
         return { kind: "array-method", method: e.method, object: walk(e.object, enclosing), args: e.args.map((a) => walk(a, enclosing)) };
       case "object-literal":
@@ -1753,6 +1790,9 @@ function exprToString(expr) {
       return `[${expr.elements.map(exprToString).join(", ")}]`;
     case "array-method":
       if (expr.method === "flat") {
+        if (expr.depthExpr) {
+          return `${exprToString(expr.object)}.flat(${exprToString(expr.depthExpr)})`;
+        }
         const d = expr.flatDepth;
         const depthSrc = d === "infinity" ? "Infinity" : String(d);
         return `${exprToString(expr.object)}.flat(${d === 1 ? "" : depthSrc})`;
@@ -1804,6 +1844,9 @@ function stringifyParsedExpr(expr) {
       return `[${expr.elements.map(stringifyParsedExpr).join(", ")}]`;
     case "array-method":
       if (expr.method === "flat") {
+        if (expr.depthExpr) {
+          return `${stringifyParsedExpr(expr.object)}.flat(${stringifyParsedExpr(expr.depthExpr)})`;
+        }
         const d = expr.flatDepth;
         const depthSrc = d === "infinity" ? "Infinity" : String(d);
         return `${stringifyParsedExpr(expr.object)}.flat(${d === 1 ? "" : depthSrc})`;
@@ -1847,8 +1890,9 @@ function materializeGetterCalls(expr, names) {
     case "array-literal":
       return { kind: "array-literal", elements: expr.elements.map(rw) };
     case "array-method":
-      if (expr.method === "flat")
-        return { ...expr, object: rw(expr.object) };
+      if (expr.method === "flat") {
+        return { ...expr, object: rw(expr.object), ...expr.depthExpr ? { depthExpr: rw(expr.depthExpr) } : {} };
+      }
       return { ...expr, object: rw(expr.object), args: expr.args.map(rw) };
     case "object-literal":
       return {
@@ -1871,63 +1915,67 @@ function serializeParsedExpr(expr) {
 }
 function freeVarsInBody(body, params) {
   const found = new Set;
-  const visit = (e) => {
+  const visit = (e, bound) => {
     switch (e.kind) {
       case "identifier":
-        if (!params.has(e.name))
+        if (!bound.has(e.name))
           found.add(e.name);
         return;
       case "binary":
       case "logical":
-        visit(e.left);
-        visit(e.right);
+        visit(e.left, bound);
+        visit(e.right, bound);
         return;
       case "unary":
-        visit(e.argument);
+        visit(e.argument, bound);
         return;
       case "conditional":
-        visit(e.test);
-        visit(e.consequent);
-        visit(e.alternate);
+        visit(e.test, bound);
+        visit(e.consequent, bound);
+        visit(e.alternate, bound);
         return;
       case "member":
-        visit(e.object);
+        visit(e.object, bound);
         return;
       case "index-access":
-        visit(e.object);
-        visit(e.index);
+        visit(e.object, bound);
+        visit(e.index, bound);
         return;
       case "call":
         if (evalBuiltinCalleeName(e.callee) === null)
-          visit(e.callee);
-        e.args.forEach(visit);
+          visit(e.callee, bound);
+        e.args.forEach((a) => visit(a, bound));
         return;
       case "template-literal":
         for (const p of e.parts)
           if (p.type === "expression")
-            visit(p.expr);
+            visit(p.expr, bound);
         return;
       case "array-literal":
-        e.elements.forEach(visit);
+        e.elements.forEach((el) => visit(el, bound));
         return;
       case "object-literal":
         for (const p of e.properties)
-          visit(p.value);
+          visit(p.value, bound);
         return;
       case "array-method":
-        if (e.method === "includes") {
-          visit(e.object);
-          e.args.forEach(visit);
+        if (e.method === "includes" || e.method === "join") {
+          visit(e.object, bound);
+          e.args.forEach((a) => visit(a, bound));
         }
         return;
+      case "arrow": {
+        const inner = e.params.length === 0 ? bound : new Set([...bound, ...e.params]);
+        visit(e.body, inner);
+        return;
+      }
       case "literal":
-      case "arrow":
       case "regex":
       case "unsupported":
         return;
     }
   };
-  visit(body);
+  visit(body, params);
   return [...found].sort();
 }
 function freeIdentifiers(expr) {
@@ -1978,6 +2026,8 @@ function freeIdentifiers(expr) {
         for (const a of e.args)
           if (!visit(a, bound))
             return false;
+        if (e.method === "flat" && e.depthExpr && !visit(e.depthExpr, bound))
+          return false;
         return true;
       case "object-literal":
         for (const p of e.properties)
@@ -2073,6 +2123,20 @@ function toEvalNode(e) {
       return object && index ? { kind: "index-access", object, index } : null;
     }
     case "call": {
+      const cb = asCallbackMethodCall(e);
+      if (cb && (cb.method === "map" || cb.method === "filter")) {
+        const object = toEvalNode(cb.object);
+        if (!object)
+          return null;
+        const body = toEvalNode(cb.arrow.body);
+        if (!body)
+          return null;
+        return {
+          kind: "call",
+          callee: { kind: "member", object, property: cb.method, computed: false },
+          args: [{ kind: "arrow", params: cb.arrow.params, body }]
+        };
+      }
       if (evalBuiltinCalleeName(e.callee) === null)
         return null;
       const callee = toEvalNode(e.callee);
@@ -2127,6 +2191,15 @@ function toEvalNode(e) {
         const arg = toEvalNode(e.args[0]);
         return object && arg ? { kind: "array-method", method: "includes", object, args: [arg] } : null;
       }
+      if (e.method === "join" && e.args.length <= 1) {
+        const object = toEvalNode(e.object);
+        if (!object)
+          return null;
+        if (e.args.length === 0)
+          return { kind: "array-method", method: "join", object, args: [] };
+        const sep = toEvalNode(e.args[0]);
+        return sep ? { kind: "array-method", method: "join", object, args: [sep] } : null;
+      }
       return null;
     }
     case "arrow":
@@ -3282,6 +3355,89 @@ function irToHtmlTemplate(node, restSpreadNames, loopDepth = 0, loopParams, bran
       return assertNever(node);
   }
 }
+function buildLoopSkeletonTemplate(node, safe) {
+  switch (node.type) {
+    case "element": {
+      const attrParts = [];
+      for (const a of node.attrs) {
+        if (a.name === "...")
+          return null;
+        if (a.name === "dangerouslySetInnerHTML")
+          return null;
+        if (a.name === "key") {
+          attrParts.push(`${keyAttrName(0)}=""`);
+          continue;
+        }
+        const v = a.value;
+        switch (v.kind) {
+          case "literal":
+            attrParts.push(`${toHtmlAttrName(a.name)}="${v.value}"`);
+            break;
+          case "boolean-attr":
+            attrParts.push(toHtmlAttrName(a.name));
+            break;
+          case "boolean-shorthand":
+          case "jsx-children":
+            break;
+          case "expression":
+          case "template": {
+            const attrKey = node.slotId ? `${node.slotId}::${a.name}` : null;
+            if (!attrKey || !safe.reactiveAttrKeys.has(attrKey))
+              return null;
+            break;
+          }
+          case "spread":
+            return null;
+        }
+      }
+      if (node.slotId)
+        attrParts.push(`bf="${node.slotId}"`);
+      const attrs = attrParts.join(" ");
+      let children = "";
+      for (const child of node.children) {
+        const rendered = buildLoopSkeletonTemplate(child, safe);
+        if (rendered === null)
+          return null;
+        children += rendered;
+      }
+      if (children || !VOID_ELEMENTS.has(node.tag)) {
+        return `<${node.tag}${attrs ? " " + attrs : ""}>${children}</${node.tag}>`;
+      }
+      return `<${node.tag}${attrs ? " " + attrs : ""} />`;
+    }
+    case "text":
+      return node.value;
+    case "expression":
+      if (node.expr === "null" || node.expr === "undefined")
+        return "";
+      if (!node.slotId) {
+        return null;
+      }
+      if (!safe.reactiveTextSlotIds.has(node.slotId))
+        return null;
+      return `<!--bf:${node.slotId}--><!--/-->`;
+    case "fragment": {
+      let out = "";
+      for (const child of node.children) {
+        const rendered = buildLoopSkeletonTemplate(child, safe);
+        if (rendered === null)
+          return null;
+        out += rendered;
+      }
+      return out;
+    }
+    case "conditional":
+    case "component":
+    case "loop":
+    case "if-statement":
+    case "provider":
+    case "async":
+    case "slot":
+      return null;
+    default:
+      return assertNever(node);
+  }
+}
 function irToPlaceholderTemplate(node, restSpreadNames, loopDepth = 0, loopParams) {
   const recurse = (n) => irToPlaceholderTemplate(n, restSpreadNames, loopDepth, loopParams);
   const wrapExpr = (expr) => wrapExprWithLoopParams(expr, loopParams);
@@ -3681,7 +3837,23 @@ function generateCsrTemplate(node, inlinableConstants, ctx, insideLoop, restSpre
       }
     }
   }
-  return generateCsrTemplateWithOpts(node, { inlinableConstants, restSpreadNames, propsObjectName, csrEnv, insideLoop, unsafeLocalNames, deferredChildSlots, loopDepth: -1 });
+  const effectiveUnsafeLocalNames = mergeCsrNullUnsafe(ctx, unsafeLocalNames);
+  return generateCsrTemplateWithOpts(node, { inlinableConstants, restSpreadNames, propsObjectName, csrEnv, insideLoop, unsafeLocalNames: effectiveUnsafeLocalNames, deferredChildSlots, loopDepth: -1 });
+}
+function mergeCsrNullUnsafe(ctx, unsafeLocalNames) {
+  let merged = null;
+  let exemptNames = null;
+  for (const [name, entry] of ctx.csrInlinable) {
+    if (entry !== null || unsafeLocalNames?.has(name))
+      continue;
+    exemptNames ??= new Set(ctx.localConstants.filter((c) => c.isJsx || c.systemConstructKind).map((c) => c.name));
+    if (exemptNames.has(name))
+      continue;
+    if (!merged)
+      merged = new Set(unsafeLocalNames ?? []);
+    merged.add(name);
+  }
+  return merged ?? unsafeLocalNames;
 }
 function buildCsrEnvForCtx(ctx, inlinableConstants, propsObjectName) {
   const base = buildSignalMemoEnv(ctx.signals, ctx.memos, propsObjectName ?? null);
@@ -4269,6 +4441,15 @@ function createAnalyzerContext(sourceFile, filePath) {
     checker: null,
     componentBodyBlock: null,
     getJS(node) {
+      let ownSourceFile;
+      try {
+        ownSourceFile = node.getSourceFile();
+      } catch {
+        ownSourceFile = undefined;
+      }
+      if (ownSourceFile && ownSourceFile !== sourceFile) {
+        return node.getText(ownSourceFile);
+      }
       return reconstructWithoutTypes(node, sourceFile, this.typeExcludeRanges);
     }
   };
@@ -6622,6 +6803,7 @@ function extractProps(param, ctx) {
       loc: getSourceLocation(param, ctx.sourceFile, ctx.filePath),
       hasIgnoreDirective: ignored
     };
+    const memberTypes = param.type ? collectMemberTypes(param.type, ctx) : null;
     for (const element of param.name.elements) {
       if (ts8.isBindingElement(element) && ts8.isIdentifier(element.name)) {
         const localName = element.name.text;
@@ -6630,10 +6812,12 @@ function extractProps(param, ctx) {
           ctx.restPropsName = localName;
           continue;
         }
+        const sourcePropName = element.propertyName && ts8.isIdentifier(element.propertyName) ? element.propertyName.text : localName;
+        const resolvedType = memberTypes?.get(sourcePropName) ?? { kind: "unknown", raw: "unknown" };
         const defaultContainsArrow = element.initializer ? nodeContainsArrow(element.initializer) : false;
         ctx.propsParams.push({
           name: localName,
-          type: { kind: "unknown", raw: "unknown" },
+          type: resolvedType,
           optional: !!element.initializer,
           defaultValue,
           defaultContainsArrow: defaultContainsArrow || undefined
@@ -6694,6 +6878,37 @@ function collectKeysFromMembers(members, ctx) {
   }
   return keys;
 }
+function collectMemberTypes(typeNode, ctx) {
+  const isResolvablePrimitive = (info) => info.kind === "primitive" && (info.primitive === "string" || info.primitive === "number" || info.primitive === "boolean");
+  const fromMembers = (members) => {
+    const map = new Map;
+    for (const member of members) {
+      if (ts8.isPropertySignature(member) && member.name && member.type && !member.questionToken) {
+        const info = typeNodeToTypeInfo(member.type, ctx.sourceFile);
+        if (info && isResolvablePrimitive(info)) {
+          map.set(member.name.getText(ctx.sourceFile), info);
+        }
+      }
+    }
+    return map;
+  };
+  if (ts8.isTypeLiteralNode(typeNode)) {
+    return fromMembers(typeNode.members);
+  }
+  if (ts8.isTypeReferenceNode(typeNode)) {
+    const typeName = typeNode.typeName.getText(ctx.sourceFile);
+    const typeDecl = findTypeDeclaration(typeName, ctx.sourceFile);
+    if (!typeDecl)
+      return null;
+    if (ts8.isInterfaceDeclaration(typeDecl)) {
+      return fromMembers(typeDecl.members);
+    }
+    if (ts8.isTypeAliasDeclaration(typeDecl) && ts8.isTypeLiteralNode(typeDecl.type)) {
+      return fromMembers(typeDecl.type.members);
+    }
+  }
+  return null;
+}
 function extractPropsFromType(typeNode, ctx) {
   if (ts8.isTypeLiteralNode(typeNode)) {
     extractPropsFromTypeMembers(typeNode.members, ctx);
@@ -7388,6 +7603,119 @@ function pickAttrMetaFromIR(src) {
   };
 }
 
+// src/module-exports.ts
+function generateModuleExports(ir, extraInlineExported = new Set, rewriteRelativeImport) {
+  const lines = [];
+  for (const constant of ir.metadata.localConstants) {
+    if (!constant.isExported)
+      continue;
+    const keyword = constant.declarationKind ?? "const";
+    if (!constant.value) {
+      lines.push(`export ${keyword} ${constant.name}`);
+      continue;
+    }
+    const value = constant.value.trim();
+    if (/^createContext\b/.test(value) || /^new WeakMap\b/.test(value))
+      continue;
+    lines.push(`export ${keyword} ${constant.name} = ${constant.value}`);
+  }
+  for (const func of ir.metadata.localFunctions) {
+    if (!func.isExported)
+      continue;
+    const params = func.typedParams !== undefined ? func.typedParams : func.params.map(formatParamWithType).join(", ");
+    const returnAnnotation = func.typedReturnType ? `: ${func.typedReturnType}` : "";
+    const body = func.typedBody ?? func.body;
+    const asyncKw = func.isAsync ? "async " : "";
+    lines.push(`export ${asyncKw}function ${func.name}(${params})${returnAnnotation} ${body}`);
+  }
+  const inlineExported = collectInlineExportedNames(ir);
+  for (const name of extraInlineExported)
+    inlineExported.add(name);
+  for (const block of ir.metadata.namedExports) {
+    const isReexportFrom = block.source !== null;
+    const survivingSpecs = block.specifiers.filter((spec) => {
+      if (isReexportFrom)
+        return true;
+      return !(inlineExported.has(spec.name) && spec.alias == null);
+    });
+    if (survivingSpecs.length === 0)
+      continue;
+    const specText = survivingSpecs.map((s) => {
+      const prefix = s.isTypeOnly ? "type " : "";
+      return s.alias ? `${prefix}${s.name} as ${s.alias}` : `${prefix}${s.name}`;
+    }).join(", ");
+    const typeKw = block.isTypeOnly ? "type " : "";
+    if (isReexportFrom) {
+      const source = rewriteRelativeImport && block.source.startsWith(".") ? rewriteRelativeImport(block.source) : block.source;
+      lines.push(`export ${typeKw}{ ${specText} } from '${source}'`);
+    } else {
+      lines.push(`export ${typeKw}{ ${specText} }`);
+    }
+  }
+  return lines.length > 0 ? lines.join(`
+`) : null;
+}
+function collectInlineExportedNames(ir) {
+  const names = new Set;
+  for (const c of ir.metadata.localConstants) {
+    if (c.isExported)
+      names.add(c.name);
+  }
+  for (const f of ir.metadata.localFunctions) {
+    if (f.isExported)
+      names.add(f.name);
+  }
+  if (ir.metadata.isExported && ir.metadata.componentName) {
+    names.add(ir.metadata.componentName);
+  }
+  return names;
+}
+function formatParamWithType(p) {
+  const rest = p.isRest ? "..." : "";
+  const optional = p.optional ? "?" : "";
+  const typeAnnotation = p.type?.raw && p.type.raw !== "unknown" ? `: ${p.type.raw}` : "";
+  const defaultPart = p.defaultValue !== undefined ? ` = ${p.defaultValue}` : "";
+  return `${rest}${p.name}${optional}${typeAnnotation}${defaultPart}`;
+}
+function findReachableNames(primaryRefs, declarations) {
+  const allNames = new Set(declarations.map((d) => d.name));
+  const bodyMap = new Map(declarations.map((d) => [d.name, d.body]));
+  const reachable = new Set;
+  const queue = [];
+  for (const name of allNames) {
+    if (new RegExp(`\\b${name}\\b`).test(primaryRefs)) {
+      reachable.add(name);
+      queue.push(name);
+    }
+  }
+  while (queue.length > 0) {
+    const current = queue.shift();
+    const body = bodyMap.get(current) || "";
+    for (const name of allNames) {
+      if (!reachable.has(name) && new RegExp(`\\b${name}\\b`).test(body)) {
+        reachable.add(name);
+        queue.push(name);
+      }
+    }
+  }
+  return reachable;
+}
+function extractFunctionParams(value) {
+  const arrowMatch = value.match(/^(?:async\s*)?\(([^)]*)\)\s*(?::\s*[^=]+)?\s*=>/);
+  if (arrowMatch) {
+    return arrowMatch[1].split(",").map((p) => p.trim().split(":")[0].split("=")[0].trim()).filter(Boolean).join(", ");
+  }
+  const singleMatch = value.match(/^(?:async\s*)?(\w+)\s*=>/);
+  if (singleMatch) {
+    return singleMatch[1];
+  }
+  const funcMatch = value.match(/^(?:async\s*)?function\s*\w*\s*\(([^)]*)\)/);
+  if (funcMatch) {
+    return funcMatch[1].split(",").map((p) => p.trim().split(":")[0].split("=")[0].trim()).filter(Boolean).join(", ");
+  }
+  return "";
+}
+
 // src/builtins.ts
 var CLIENT_BUILTIN_SOURCE = "@barefootjs/client";
 function isClientBuiltinName(name) {
@@ -8509,6 +8837,7 @@ function transformExpression(node, ctx) {
   return transformExpressionInner(expr, ctx, node, isClientOnly);
 }
 function transformExpressionInner(expr, ctx, node, isClientOnly) {
+  expr = tryDesugarInterleaveTaggedTemplate(expr, ctx);
   checkBareSignalOrMemoIdentifier(expr, ctx);
   if (ts11.isIdentifier(expr)) {
     const jsxNode = ctx.analyzer.jsxConstants.get(expr.text);
@@ -9050,11 +9379,10 @@ function isIteratorShapeCall(node) {
   return { array: node.expression.expression, shape: name };
 }
 function extractSortComparator(callback, _method, ctx) {
-  const unsupported = () => {
-    const raw = ctx.getJS(callback);
-    return {
-      result: null,
-      unsupportedReason: `Sort comparator '${raw}' is not a supported shape. Accepted:
+  const outerRaw = ctx.getJS(callback);
+  const unsupported = () => ({
+    result: null,
+    unsupportedReason: `Sort comparator '${outerRaw}' is not a supported shape. Accepted:
 ` + `  (a, b) => a - b
 ` + `  (a, b) => a.field - b.field
 ` + `  (a, b) => a.localeCompare(b)
@@ -9062,15 +9390,25 @@ function extractSortComparator(callback, _method, ctx) {
 ` + `  (a, b) => a.field > b.field ? 1 : a.field < b.field ? -1 : 0
 ` + `  any of the above '||'-chained for multi-key tie-breaks
 ` + `(reverse the operands for descending order).`
-    };
-  };
-  if (!ts11.isArrowFunction(callback) && !ts11.isFunctionExpression(callback)) {
+  });
+  let resolvedNode = callback;
+  if (ts11.isIdentifier(callback)) {
+    const resolved = resolveSortComparatorIdentifier(callback.text, ctx);
+    if (!resolved) {
+      return {
+        result: null,
+        unsupportedReason: `Sort comparator '${outerRaw}' could not be resolved to a local function — ` + `declare it in the same file or inline it.`
+      };
+    }
+    resolvedNode = resolved;
+  }
+  if (!ts11.isArrowFunction(resolvedNode) && !ts11.isFunctionExpression(resolvedNode)) {
     return {
       result: null,
       unsupportedReason: "Sort comparator must be an arrow function or function expression"
     };
   }
-  const arrow = tsNodeToParsedExpr(callback);
+  const arrow = tsNodeToParsedExpr(resolvedNode);
   if (arrow.kind !== "arrow" || arrow.params.length !== 2)
     return unsupported();
   if (sortComparatorFromArrow(arrow) === null)
@@ -9084,6 +9422,21 @@ function extractSortComparator(callback, _method, ctx) {
     }
   };
 }
+function resolveSortComparatorIdentifier(name, ctx) {
+  const constInfo = findLocalConst(name, ctx);
+  const fnInfo = findLocalFunction(name, ctx);
+  if (constInfo && fnInfo)
+    return null;
+  if (constInfo) {
+    const ast = parseConstInitializer(constInfo);
+    return ast && (ts11.isArrowFunction(ast) || ts11.isFunctionExpression(ast)) ? ast : null;
+  }
+  if (fnInfo) {
+    const ast = parseFunctionInfoAsExpr(fnInfo);
+    return ast && (ts11.isArrowFunction(ast) || ts11.isFunctionExpression(ast)) ? ast : null;
+  }
+  return null;
+}
 function extractFilterPredicate(callback, ctx) {
   if (!ts11.isArrowFunction(callback))
     return { result: null };
@@ -9156,7 +9509,7 @@ function extractLoopParamBindings(pattern) {
   const appendDotAccess = (prefix, key) => {
     return isIdent(key) ? `${prefix}.${key}` : `${prefix}[${JSON.stringify(key)}]`;
   };
-  const walk = (p, prefix) => {
+  const walk = (p, prefix, segments) => {
     if (unsupported)
       return;
     if (ts11.isArrayBindingPattern(p)) {
@@ -9173,15 +9526,17 @@ function extractLoopParamBindings(pattern) {
           bindings.push({
             name: el.name.text,
             path: prefix,
-            rest: { kind: "array", from: index }
+            rest: { kind: "array", from: index },
+            segments
           });
           return;
         }
         const path = `${prefix}[${index}]`;
+        const nextSegments = [...segments, { kind: "index", index }];
         if (ts11.isIdentifier(el.name)) {
-          bindings.push({ name: el.name.text, path });
+          bindings.push({ name: el.name.text, path, segments: nextSegments });
         } else {
-          walk(el.name, path);
+          walk(el.name, path, nextSegments);
         }
       }
       return;
@@ -9198,7 +9553,8 @@ function extractLoopParamBindings(pattern) {
         bindings.push({
           name: el.name.text,
           path: prefix,
-          rest: { kind: "object", exclude: collectedKeys }
+          rest: { kind: "object", exclude: collectedKeys },
+          segments
         });
         return;
       }
@@ -9221,17 +9577,19 @@ function extractLoopParamBindings(pattern) {
         unsupported = true;
         return;
       }
-      collectedKeys.push({ key: keyText, isIdent: isIdent(keyText) });
+      const keyIsIdent = isIdent(keyText);
+      collectedKeys.push({ key: keyText, isIdent: keyIsIdent });
       const path = appendDotAccess(prefix, keyText);
+      const nextSegments = [...segments, { kind: "field", key: keyText, isIdent: keyIsIdent }];
       if (ts11.isIdentifier(el.name)) {
-        bindings.push({ name: el.name.text, path });
+        bindings.push({ name: el.name.text, path, segments: nextSegments });
       } else {
-        walk(el.name, path);
+        walk(el.name, path, nextSegments);
       }
     }
   };
   if (ts11.isArrayBindingPattern(pattern) || ts11.isObjectBindingPattern(pattern)) {
-    walk(pattern, "");
+    walk(pattern, "", []);
     if (unsupported)
       return { unsupported: true };
     return bindings;
@@ -10000,6 +10358,7 @@ function getAttributeValue(attr, ctx) {
         expr = branchInit;
       }
     }
+    expr = tryDesugarInterleaveTaggedTemplate(expr, ctx);
     if (ts11.isAwaitExpression(expr)) {
       ctx.analyzer.errors.push(createError(ErrorCodes.STAGE_AWAIT_IN_TEMPLATE, getSourceLocation(expr, ctx.sourceFile, ctx.filePath)));
       return AttrValueOf.expression("undefined");
@@ -10135,6 +10494,14 @@ function findLocalConst(name, ctx) {
   const pool = fnScoped.length > 0 ? fnScoped : matches;
   return pool[pool.length - 1];
 }
+function findLocalFunction(name, ctx) {
+  const matches = ctx.analyzer.localFunctions.filter((f) => f.name === name);
+  if (matches.length === 0)
+    return;
+  const fnScoped = matches.filter((f) => !f.isModule);
+  const pool = fnScoped.length > 0 ? fnScoped : matches;
+  return pool[pool.length - 1];
+}
 function isDynamicTagLocal(name, ctx) {
   if (!hasDynamicTagBinding(name, ctx.sourceFile))
     return false;
@@ -10229,10 +10596,151 @@ function parseConstInitializerImpl(c) {
 function astText(node) {
   return node.getText(node.getSourceFile());
 }
-function parseTernary(expr, ctx) {
-  const whenTrueValue = getStringValue(expr.whenTrue);
-  const whenFalseValue = getStringValue(expr.whenFalse);
-  if (whenTrueValue !== null && whenFalseValue !== null) {
+var functionInfoExprCache = new WeakMap;
+function parseFunctionInfoAsExpr(fn) {
+  const cached = functionInfoExprCache.get(fn);
+  if (cached !== undefined)
+    return cached;
+  const result = parseFunctionInfoAsExprImpl(fn);
+  functionInfoExprCache.set(fn, result);
+  return result;
+}
+function parseFunctionInfoAsExprImpl(fn) {
+  if (!fn.body)
+    return null;
+  const params = fn.typedParams !== undefined ? fn.typedParams : fn.params.map(formatParamWithType).join(", ");
+  const body = fn.typedBody ?? fn.body;
+  const wrapped = `const __bf_resolve_fn__ = function(${params}) ${body}`;
+  const sf = ts11.createSourceFile("__bf_resolve_fn.ts", wrapped, ts11.ScriptTarget.Latest, true, ts11.ScriptKind.TS);
+  const stmt = sf.statements[0];
+  if (!stmt || !ts11.isVariableStatement(stmt))
+    return null;
+  const decl = stmt.declarationList.declarations[0];
+  if (!decl?.initializer)
+    return null;
+  return decl.initializer;
+}
+function tryDesugarInterleaveTaggedTemplate(expr, ctx) {
+  if (!ts11.isTaggedTemplateExpression(expr))
+    return expr;
+  if (!ts11.isIdentifier(expr.tag))
+    return expr;
+  const resolvedTag = resolveInterleaveTagIdentifier(expr.tag.text, ctx);
+  if (!resolvedTag)
+    return expr;
+  if (!isInterleaveTagFunction(resolvedTag))
+    return expr;
+  const rewritten = buildUntaggedTemplateLiteral(expr, ctx);
+  return rewritten ?? expr;
+}
+function resolveInterleaveTagIdentifier(name, ctx) {
+  const constInfo = findLocalConst(name, ctx);
+  const fnInfo = findLocalFunction(name, ctx);
+  if (constInfo && fnInfo)
+    return null;
+  if (constInfo) {
+    const ast = parseConstInitializer(constInfo);
+    return ast && (ts11.isArrowFunction(ast) || ts11.isFunctionExpression(ast)) ? ast : null;
+  }
+  if (fnInfo) {
+    const ast = parseFunctionInfoAsExpr(fnInfo);
+    return ast && (ts11.isArrowFunction(ast) || ts11.isFunctionExpression(ast)) ? ast : null;
+  }
+  return null;
+}
+function isInterleaveTagFunction(fn) {
+  if (!ts11.isArrowFunction(fn) && !ts11.isFunctionExpression(fn))
+    return false;
+  if (fn.parameters.length !== 2)
+    return false;
+  const [partsParam, argsParam] = fn.parameters;
+  if (!ts11.isIdentifier(partsParam.name) || partsParam.dotDotDotToken)
+    return false;
+  if (!ts11.isIdentifier(argsParam.name) || !argsParam.dotDotDotToken)
+    return false;
+  const parsed = tsNodeToParsedExpr(fn);
+  if (parsed.kind !== "arrow")
+    return false;
+  return isInterleaveReduceCall(parsed.body, partsParam.name.text, argsParam.name.text);
+}
+function isInterleaveReduceCall(body, partsName, argsName) {
+  if (body.kind !== "call" || body.args.length !== 2)
+    return false;
+  const { callee, args } = body;
+  if (callee.kind !== "member" || callee.computed || callee.property !== "reduce")
+    return false;
+  if (callee.object.kind !== "identifier" || callee.object.name !== partsName)
+    return false;
+  const [callback, init] = args;
+  if (init.kind !== "literal" || init.literalType !== "string" || init.value !== "")
+    return false;
+  if (callback.kind !== "arrow" || callback.params.length !== 3)
+    return false;
+  const [acc, p, i] = callback.params;
+  return isInterleaveReduceCallbackBody(callback.body, acc, p, i, argsName);
+}
+function isInterleaveReduceCallbackBody(body, acc, p, i, argsName) {
+  if (body.kind !== "binary" || body.op !== "+")
+    return false;
+  const { left, right } = body;
+  if (left.kind !== "binary" || left.op !== "+")
+    return false;
+  if (left.left.kind !== "identifier" || left.left.name !== acc)
+    return false;
+  if (left.right.kind !== "identifier" || left.right.name !== p)
+    return false;
+  return isInterleaveSpanExpr(right, i, argsName);
+}
+function isInterleaveSpanExpr(expr, i, argsName) {
+  let inner = expr;
+  if (inner.kind === "call" && inner.args.length === 1 && inner.callee.kind === "identifier" && inner.callee.name === "String") {
+    inner = inner.args[0];
+  }
+  if (inner.kind !== "logical" || inner.op !== "??")
+    return false;
+  if (inner.right.kind !== "literal" || inner.right.literalType !== "string" || inner.right.value !== "") {
+    return false;
+  }
+  const idx = inner.left;
+  if (idx.kind !== "index-access")
+    return false;
+  if (idx.object.kind !== "identifier" || idx.object.name !== argsName)
+    return false;
+  if (idx.index.kind !== "identifier" || idx.index.name !== i)
+    return false;
+  return true;
+}
+function buildUntaggedTemplateLiteral(node, ctx) {
+  const template = node.template;
+  let text;
+  if (ts11.isNoSubstitutionTemplateLiteral(template)) {
+    text = "`" + (template.rawText ?? template.text) + "`";
+  } else {
+    let body = template.head.rawText ?? template.head.text;
+    for (const span of template.templateSpans) {
+      const spanText = ctx.getJS(span.expression);
+      body += "${(" + spanText + ") ?? ''}";
+      body += span.literal.rawText ?? span.literal.text;
+    }
+    text = "`" + body + "`";
+  }
+  const wrapped = `const __bf_resolve_tagged__ = (${text})`;
+  const sf = ts11.createSourceFile("__bf_resolve_tagged.tsx", wrapped, ts11.ScriptTarget.Latest, true, ts11.ScriptKind.TSX);
+  const stmt = sf.statements[0];
+  if (!stmt || !ts11.isVariableStatement(stmt))
+    return null;
+  const decl = stmt.declarationList.declarations[0];
+  if (!decl?.initializer)
+    return null;
+  const result = ts11.isParenthesizedExpression(decl.initializer) ? decl.initializer.expression : decl.initializer;
+  if (!ts11.isTemplateExpression(result) && !ts11.isNoSubstitutionTemplateLiteral(result))
+    return null;
+  return result;
+}
+function parseTernary(expr, ctx) {
+  const whenTrueValue = getStringValue(expr.whenTrue);
+  const whenFalseValue = getStringValue(expr.whenFalse);
+  if (whenTrueValue !== null && whenFalseValue !== null) {
     const condition = ctx.getJS(expr.condition);
     return {
       type: "ternary",
@@ -11344,6 +11852,7 @@ function collectElements(node, ctx, siblingOffsets, insideConditional = false) {
       const { useElementReconciliation, innerLoops } = decideLoopRendering(l, siblingOffsets, ctx);
       let template = "";
       let staticItemTemplate;
+      let skeletonTemplate;
       if (l.childComponent) {
         template = "";
         if (l.isStaticArray && l.children[0]) {
@@ -11354,6 +11863,11 @@ function collectElements(node, ctx, siblingOffsets, insideConditional = false) {
         template = useElementReconciliation ? irToPlaceholderTemplate(l.children[0], buildRestSpreadNames(ctx), 0, loopParamSpec) : irToHtmlTemplate(l.children[0], buildRestSpreadNames(ctx), 0, loopParamSpec);
         if (l.isStaticArray) {
           staticItemTemplate = useElementReconciliation ? irToPlaceholderTemplate(l.children[0], buildRestSpreadNames(ctx), 0) : irToHtmlTemplate(l.children[0], buildRestSpreadNames(ctx), 0);
+        } else if (!useElementReconciliation && !l.bodyIsMultiRoot && !l.bodyIsItemConditional) {
+          skeletonTemplate = buildLoopSkeletonTemplate(l.children[0], {
+            reactiveAttrKeys: new Set(bindings.reactiveAttrs.map((a) => `${a.childSlotId}::${a.attrName}`)),
+            reactiveTextSlotIds: new Set(bindings.reactiveTexts.map((t) => t.slotId))
+          }) ?? undefined;
         }
       }
       ctx.loopElements.push({
@@ -11371,6 +11885,7 @@ function collectElements(node, ctx, siblingOffsets, insideConditional = false) {
         iterationShape: l.iterationShape,
         template,
         staticItemTemplate,
+        skeletonTemplate,
         childEventHandlers: childHandlers,
         bindings,
         childComponent: l.childComponent,
@@ -12259,6 +12774,45 @@ function collectComponentNames(node) {
 
 // src/relocate.ts
 import ts13 from "typescript";
+
+// src/lowering-registry.ts
+var plugins = [];
+function registerLoweringPlugin(plugin) {
+  const existing = plugins.findIndex((p) => p.name === plugin.name);
+  if (existing >= 0)
+    plugins[existing] = plugin;
+  else
+    plugins.push(plugin);
+}
+function getLoweringPlugins() {
+  return [...plugins];
+}
+function prepareLoweringMatchers(metadata) {
+  const matchers = [];
+  for (const plugin of plugins) {
+    const matcher = plugin.prepare(metadata);
+    if (matcher)
+      matchers.push(matcher);
+  }
+  return matchers;
+}
+function matchLoweringCall(callee, args, metadata) {
+  for (const matcher of prepareLoweringMatchers(metadata)) {
+    const node = matcher(callee, args);
+    if (node)
+      return node;
+  }
+  return null;
+}
+function isValidHelperId(helper) {
+  return /^[A-Za-z_][A-Za-z0-9_]*$/.test(helper);
+}
+function __resetLoweringPluginsForTest(next = []) {
+  plugins.length = 0;
+  plugins.push(...next);
+}
+
+// src/relocate.ts
 function classify(name, env) {
   return env.bindings.get(name) ?? "global";
 }
@@ -12293,6 +12847,14 @@ function decideAction(kind, toScope, env, name) {
     return { action: "lift-to-prop", rewrittenAs: `${PROPS_PARAM}.${name}` };
   }
   if ((kind === "init-local" || kind === "sub-init-local") && toScope === "template") {
+    const aliasTarget = env.aliasTargets?.get(name);
+    if (aliasTarget !== undefined) {
+      const targetLeftmost = aliasTarget.includes(".") ? aliasTarget.split(".")[0] : aliasTarget;
+      const targetKind = classify(targetLeftmost, env);
+      if (isVisibleIn(toScope, targetKind)) {
+        return { action: "inline", rewrittenAs: aliasTarget };
+      }
+    }
     const inlineForm = env.inlinable.get(name);
     if (inlineForm !== undefined) {
       return { action: "inline", rewrittenAs: inlineForm };
@@ -12372,6 +12934,8 @@ function isInlinableInTemplate(value, env) {
   return { ok: true, rewrittenValue: r.text, decisions: r.decisions };
 }
 function getCalleeIdentifierPath(callee) {
+  if (ts13.isParenthesizedExpression(callee))
+    return getCalleeIdentifierPath(callee.expression);
   if (ts13.isIdentifier(callee))
     return callee.text;
   if (ts13.isPropertyAccessExpression(callee)) {
@@ -12383,6 +12947,8 @@ function getCalleeIdentifierPath(callee) {
   return null;
 }
 function getCalleeLeftmostIdentifier(callee) {
+  if (ts13.isParenthesizedExpression(callee))
+    return getCalleeLeftmostIdentifier(callee.expression);
   if (ts13.isIdentifier(callee))
     return callee.text;
   if (ts13.isPropertyAccessExpression(callee)) {
@@ -12396,20 +12962,39 @@ var REGISTRY_SAFE_BINDING_KINDS = new Set([
   "module-local"
 ]);
 function isCallAcceptedByAdapter(call, env) {
-  const name = getCalleeIdentifierPath(call.expression);
-  if (name === null)
+  const originalPath = getCalleeIdentifierPath(call.expression);
+  if (originalPath === null)
     return false;
   const leftmost = getCalleeLeftmostIdentifier(call.expression);
+  let resolvedPath = originalPath;
+  let resolvedLeftmost = leftmost;
   if (leftmost !== null) {
-    const kind = env.bindings.get(leftmost);
+    const aliasTarget = env.aliasTargets?.get(leftmost);
+    if (aliasTarget !== undefined) {
+      resolvedPath = originalPath === leftmost ? aliasTarget : `${aliasTarget}${originalPath.slice(leftmost.length)}`;
+      resolvedLeftmost = aliasTarget.includes(".") ? aliasTarget.split(".")[0] : aliasTarget;
+    }
+  }
+  if (resolvedLeftmost !== null) {
+    const kind = env.bindings.get(resolvedLeftmost);
     if (kind !== undefined && !REGISTRY_SAFE_BINDING_KINDS.has(kind)) {
       return false;
     }
   }
-  if (env.templatePrimitives && env.templatePrimitives[name])
+  if (env.templatePrimitives && env.templatePrimitives[resolvedPath])
     return true;
-  if (env.acceptsTemplateCall && env.acceptsTemplateCall(name))
+  if (env.acceptsTemplateCall && env.acceptsTemplateCall(resolvedPath))
     return true;
+  if (env.loweringMatchers && env.loweringMatchers.length > 0) {
+    const parsed = tsNodeToParsedExpr(call);
+    if (parsed.kind === "call") {
+      const calleeForMatch = resolvedPath !== originalPath && !resolvedPath.includes(".") && parsed.callee.kind === "identifier" ? { kind: "identifier", name: resolvedPath } : parsed.callee;
+      for (const matcher of env.loweringMatchers) {
+        if (matcher(calleeForMatch, parsed.args))
+          return true;
+      }
+    }
+  }
   return false;
 }
 function parseExpressionNode(text) {
@@ -12555,6 +13140,7 @@ function buildRelocateEnvFromIR(metadata, options) {
     env.templatePrimitives = options.templatePrimitives;
   if (options?.acceptsTemplateCall)
     env.acceptsTemplateCall = options.acceptsTemplateCall;
+  env.loweringMatchers = prepareLoweringMatchers(metadata);
   return env;
 }
 function buildRelocateEnvFromFields(src) {
@@ -12603,14 +13189,35 @@ function buildRelocateEnvFromFields(src) {
     if (kind === "prop")
       propsForLift.add(name);
   }
+  const aliasTargets = new Map;
+  for (const c of src.localConstants) {
+    const kind = bindings.get(c.name);
+    if (kind !== "init-local" && kind !== "module-local")
+      continue;
+    const target = identifierPathFromParsed(c.parsed);
+    if (target !== null)
+      aliasTargets.set(c.name, target);
+  }
   return {
     bindings,
     inlinable: new Map,
     propsForLift,
     propsObjectName,
-    allowFallback: true
+    allowFallback: true,
+    aliasTargets
   };
 }
+function identifierPathFromParsed(expr) {
+  if (!expr)
+    return null;
+  if (expr.kind === "identifier")
+    return expr.name;
+  if (expr.kind === "member" && !expr.computed) {
+    const object = identifierPathFromParsed(expr.object);
+    return object === null ? null : `${object}.${expr.property}`;
+  }
+  return null;
+}
 
 // src/ir-to-client-js/compute-inlinability.ts
 function buildEnvFromCtx(ctx) {
@@ -12630,7 +13237,7 @@ function buildEnvFromCtx(ctx) {
     effects: ctx.effects,
     onMounts: ctx.onMounts,
     initStatements: ctx.initStatements,
-    imports: [],
+    imports: ctx.imports,
     templateImports: [],
     namedExports: [],
     localFunctions: ctx.localFunctions,
@@ -15391,6 +15998,15 @@ function emitTemplateCloneInline(template) {
   }
   return `const __tpl = document.createElement('template'); __tpl.innerHTML = \`${template}\`; return __tpl.content.firstElementChild.cloneNode(true)`;
 }
+function emitHoistedTemplateDecl(lines, indent, tplVar, skeletonTemplate) {
+  const isSvg = templateRootIsSvg(skeletonTemplate);
+  const html = isSvg ? `<svg>${skeletonTemplate}</svg>` : skeletonTemplate;
+  lines.push(`${indent}const ${tplVar} = document.createElement('template')`);
+  lines.push(`${indent}${tplVar}.innerHTML = \`${html}\``);
+}
+function hoistedCloneExpr(tplVar, skeletonTemplate) {
+  return templateRootIsSvg(skeletonTemplate) ? `${tplVar}.content.firstElementChild.firstElementChild.cloneNode(true)` : `${tplVar}.content.firstElementChild.cloneNode(true)`;
+}
 function emitTemplateCloneLines(template, indent) {
   if (templateRootIsSvg(template)) {
     return [
@@ -15689,6 +16305,7 @@ function stringifyPlainLoop(lines, plan, topIndent = "  ") {
     indexParam,
     mapPreambleWrapped,
     template,
+    skeletonTemplate,
     reactiveEffects,
     childRefs,
     bodyIsMultiRoot,
@@ -15699,11 +16316,16 @@ function stringifyPlainLoop(lines, plan, topIndent = "  ") {
     stringifyAnchoredLoop(lines, plan, topIndent, anchorKeyExpr);
     return;
   }
+  const hoistedTpl = !bodyIsMultiRoot && skeletonTemplate ? skeletonTemplate : null;
+  const tplVar = `__tpl_${markerId.replace(/[^A-Za-z0-9_$]/g, "_")}`;
+  if (hoistedTpl) {
+    emitHoistedTemplateDecl(lines, topIndent, tplVar, hoistedTpl);
+  }
   const loopBfId = plan.profileLoopId ? `, ${JSON.stringify(plan.profileLoopId)}` : "";
   if (reactiveEffects === null && !bodyIsMultiRoot && childRefs.length === 0) {
     const unwrapInline = paramUnwrap ? `${paramUnwrap} ` : "";
     const preamble = mapPreambleWrapped ? `${mapPreambleWrapped}; ` : "";
-    const cloneExpr = emitTemplateCloneInline(template);
+    const cloneExpr = hoistedTpl ? `return ${hoistedCloneExpr(tplVar, hoistedTpl)}` : emitTemplateCloneInline(template);
     lines.push(`${topIndent}mapArray(() => ${arrayExpr}, ${containerVar}, ${keyFn}, (${paramHead}, ${indexParam}, __existing) => { ${unwrapInline}${preamble}if (__existing) return __existing; ${cloneExpr} }, '${markerId}'${loopBfId})`);
     return;
   }
@@ -15713,12 +16335,16 @@ function stringifyPlainLoop(lines, plan, topIndent = "  ") {
     lines.push(`${bodyIndent}${paramUnwrap}`);
   if (mapPreambleWrapped)
     lines.push(`${bodyIndent}${mapPreambleWrapped}`);
-  emitLoopItemElementSetup(lines, {
-    template,
-    bodyIsMultiRoot,
-    indent: bodyIndent,
-    singleRootLayout: "inline"
-  });
+  if (hoistedTpl) {
+    lines.push(`${bodyIndent}const __el = __existing ?? ${hoistedCloneExpr(tplVar, hoistedTpl)}`);
+  } else {
+    emitLoopItemElementSetup(lines, {
+      template,
+      bodyIsMultiRoot,
+      indent: bodyIndent,
+      singleRootLayout: "inline"
+    });
+  }
   if (reactiveEffects !== null) {
     stringifyReactiveEffects(lines, reactiveEffects, { indent: bodyIndent, elVar: "__el", bodyIsMultiRoot });
   }
@@ -16404,6 +17030,7 @@ function buildPlainLoopPlan(elem, profileComponentName) {
     indexParam: elem.index || "__idx",
     mapPreambleWrapped: elem.mapPreamble ? wrap(elem.mapPreamble) : "",
     template: elem.template,
+    skeletonTemplate: elem.skeletonTemplate,
     reactiveEffects: hasReactive2 ? buildLoopReactiveEffectsPlan(elem, profileComponentName) : null,
     childRefs: buildChildRefBindings(elem.bindings.refs, elem.param, elem.paramBindings),
     bodyIsMultiRoot: elem.bodyIsMultiRoot ?? false,
@@ -17010,6 +17637,7 @@ function createContext(ir, scope, adapterCapabilities, profile) {
     initStatements: ir.metadata.initStatements ?? [],
     localFunctions: ir.metadata.localFunctions,
     localConstants: ir.metadata.localConstants,
+    imports: ir.metadata.imports,
     propsParams: ir.metadata.propsParams,
     propsObjectName: ir.metadata.propsObjectName,
     restPropsName: ir.metadata.restPropsName,
@@ -17093,119 +17721,6 @@ ${externalImports.join(`
   return generatedCode.replace(IMPORT_PLACEHOLDER, allImports);
 }
 
-// src/module-exports.ts
-function generateModuleExports(ir, extraInlineExported = new Set, rewriteRelativeImport) {
-  const lines = [];
-  for (const constant of ir.metadata.localConstants) {
-    if (!constant.isExported)
-      continue;
-    const keyword = constant.declarationKind ?? "const";
-    if (!constant.value) {
-      lines.push(`export ${keyword} ${constant.name}`);
-      continue;
-    }
-    const value = constant.value.trim();
-    if (/^createContext\b/.test(value) || /^new WeakMap\b/.test(value))
-      continue;
-    lines.push(`export ${keyword} ${constant.name} = ${constant.value}`);
-  }
-  for (const func of ir.metadata.localFunctions) {
-    if (!func.isExported)
-      continue;
-    const params = func.typedParams !== undefined ? func.typedParams : func.params.map(formatParamWithType).join(", ");
-    const returnAnnotation = func.typedReturnType ? `: ${func.typedReturnType}` : "";
-    const body = func.typedBody ?? func.body;
-    const asyncKw = func.isAsync ? "async " : "";
-    lines.push(`export ${asyncKw}function ${func.name}(${params})${returnAnnotation} ${body}`);
-  }
-  const inlineExported = collectInlineExportedNames(ir);
-  for (const name of extraInlineExported)
-    inlineExported.add(name);
-  for (const block of ir.metadata.namedExports) {
-    const isReexportFrom = block.source !== null;
-    const survivingSpecs = block.specifiers.filter((spec) => {
-      if (isReexportFrom)
-        return true;
-      return !(inlineExported.has(spec.name) && spec.alias == null);
-    });
-    if (survivingSpecs.length === 0)
-      continue;
-    const specText = survivingSpecs.map((s) => {
-      const prefix = s.isTypeOnly ? "type " : "";
-      return s.alias ? `${prefix}${s.name} as ${s.alias}` : `${prefix}${s.name}`;
-    }).join(", ");
-    const typeKw = block.isTypeOnly ? "type " : "";
-    if (isReexportFrom) {
-      const source = rewriteRelativeImport && block.source.startsWith(".") ? rewriteRelativeImport(block.source) : block.source;
-      lines.push(`export ${typeKw}{ ${specText} } from '${source}'`);
-    } else {
-      lines.push(`export ${typeKw}{ ${specText} }`);
-    }
-  }
-  return lines.length > 0 ? lines.join(`
-`) : null;
-}
-function collectInlineExportedNames(ir) {
-  const names = new Set;
-  for (const c of ir.metadata.localConstants) {
-    if (c.isExported)
-      names.add(c.name);
-  }
-  for (const f of ir.metadata.localFunctions) {
-    if (f.isExported)
-      names.add(f.name);
-  }
-  if (ir.metadata.isExported && ir.metadata.componentName) {
-    names.add(ir.metadata.componentName);
-  }
-  return names;
-}
-function formatParamWithType(p) {
-  const rest = p.isRest ? "..." : "";
-  const optional = p.optional ? "?" : "";
-  const typeAnnotation = p.type?.raw && p.type.raw !== "unknown" ? `: ${p.type.raw}` : "";
-  const defaultPart = p.defaultValue !== undefined ? ` = ${p.defaultValue}` : "";
-  return `${rest}${p.name}${optional}${typeAnnotation}${defaultPart}`;
-}
-function findReachableNames(primaryRefs, declarations) {
-  const allNames = new Set(declarations.map((d) => d.name));
-  const bodyMap = new Map(declarations.map((d) => [d.name, d.body]));
-  const reachable = new Set;
-  const queue = [];
-  for (const name of allNames) {
-    if (new RegExp(`\\b${name}\\b`).test(primaryRefs)) {
-      reachable.add(name);
-      queue.push(name);
-    }
-  }
-  while (queue.length > 0) {
-    const current = queue.shift();
-    const body = bodyMap.get(current) || "";
-    for (const name of allNames) {
-      if (!reachable.has(name) && new RegExp(`\\b${name}\\b`).test(body)) {
-        reachable.add(name);
-        queue.push(name);
-      }
-    }
-  }
-  return reachable;
-}
-function extractFunctionParams(value) {
-  const arrowMatch = value.match(/^(?:async\s*)?\(([^)]*)\)\s*(?::\s*[^=]+)?\s*=>/);
-  if (arrowMatch) {
-    return arrowMatch[1].split(",").map((p) => p.trim().split(":")[0].split("=")[0].trim()).filter(Boolean).join(", ");
-  }
-  const singleMatch = value.match(/^(?:async\s*)?(\w+)\s*=>/);
-  if (singleMatch) {
-    return singleMatch[1];
-  }
-  const funcMatch = value.match(/^(?:async\s*)?function\s*\w*\s*\(([^)]*)\)/);
-  if (funcMatch) {
-    return funcMatch[1].split(",").map((p) => p.trim().split(":")[0].split("=")[0].trim()).filter(Boolean).join(", ");
-  }
-  return "";
-}
-
 // src/css-layer-prefixer.ts
 function prefixClass(cls, layerName) {
   if (!cls || cls.startsWith("layer-"))
@@ -17713,16 +18228,14 @@ function extractSsrDefaults(metadata) {
     propsLike.add(metadata.propsObjectName);
   for (const p of metadata.propsParams)
     propsLike.add(p.name);
-  if (metadata.propsObjectName === null) {
-    for (const p of metadata.propsParams) {
-      if (p.isRest)
-        continue;
-      if (p.defaultValue !== undefined) {
-        const value = tryStaticEval(p.defaultValue, { bindings: {}, propsLike });
-        out[p.name] = { propName: p.name, value: resultToJsonable(value) };
-      } else {
-        out[p.name] = { propName: p.name, value: null };
-      }
+  for (const p of metadata.propsParams) {
+    if (p.isRest)
+      continue;
+    if (metadata.propsObjectName === null && p.defaultValue !== undefined) {
+      const value = tryStaticEval(p.defaultValue, { bindings: {}, propsLike });
+      out[p.name] = { propName: p.name, value: resultToJsonable(value) };
+    } else {
+      out[p.name] = { propName: p.name, value: null };
     }
   }
   if (metadata.restPropsName) {
@@ -18044,10 +18557,13 @@ import ts17 from "typescript";
 function collectContextConsumers(metadata) {
   const constants = metadata.localConstants ?? [];
   const contextDefaults = new Map;
+  const contextDefaultKinds = new Map;
   for (const c of constants) {
     if (c.systemConstructKind !== "createContext" || c.value === undefined)
       continue;
     contextDefaults.set(c.name, parseCreateContextDefault(c.value));
+    if (isObjectLiteralCreateContextDefault(c.value))
+      contextDefaultKinds.set(c.name, "object");
   }
   if (contextDefaults.size === 0)
     return [];
@@ -18061,7 +18577,8 @@ function collectContextConsumers(metadata) {
     consumers.push({
       localName: c.name,
       contextName: ctxName,
-      defaultValue: contextDefaults.get(ctxName) ?? null
+      defaultValue: contextDefaults.get(ctxName) ?? null,
+      defaultKind: contextDefaultKinds.get(ctxName)
     });
   }
   return consumers;
@@ -18094,6 +18611,14 @@ function parseCreateContextDefault(source) {
     return false;
   return null;
 }
+function isObjectLiteralCreateContextDefault(source) {
+  const expr = parseSingleExpression(source);
+  if (!expr || !ts17.isCallExpression(expr))
+    return false;
+  if (expr.arguments.length === 0)
+    return false;
+  return ts17.isObjectLiteralExpression(expr.arguments[0]);
+}
 function parseSingleExpression(source) {
   const sf = ts17.createSourceFile("__ctx.ts", `(${source})`, ts17.ScriptTarget.Latest, false);
   const stmt = sf.statements[0];
@@ -18113,16 +18638,48 @@ function augmentInheritedPropAccesses(ir) {
   const booleanAttrProps = new Set;
   const accessed = new Set;
   const accessRe = new RegExp(`(?:^|[^\\w$.])${propsObj}\\.([A-Za-z_$][\\w$]*)`, "g");
-  const scan = (s) => {
+  const scan = (s, also) => {
     if (!s)
       return;
-    for (const m of s.matchAll(accessRe))
+    for (const m of s.matchAll(accessRe)) {
       accessed.add(m[1]);
+      also?.add(m[1]);
+    }
+  };
+  const coalesceLiteralTypes = new Map;
+  const pinCoalesceLiterals = (s) => {
+    if (!s || !s.includes(propsObj))
+      return;
+    const sf = ts17.createSourceFile("__aug.ts", `(${s})`, ts17.ScriptTarget.Latest, false);
+    const visit3 = (n) => {
+      if (ts17.isBinaryExpression(n) && (n.operatorToken.kind === ts17.SyntaxKind.QuestionQuestionToken || n.operatorToken.kind === ts17.SyntaxKind.BarBarToken)) {
+        let left = n.left;
+        while (ts17.isParenthesizedExpression(left))
+          left = left.expression;
+        if (ts17.isPropertyAccessExpression(left) && ts17.isIdentifier(left.expression) && left.expression.text === propsObj) {
+          const name = left.name.text;
+          let right = n.right;
+          while (ts17.isParenthesizedExpression(right))
+            right = right.expression;
+          if (ts17.isPrefixUnaryExpression(right))
+            right = right.operand;
+          const kind = ts17.isNumericLiteral(right) ? "number" : right.kind === ts17.SyntaxKind.TrueKeyword || right.kind === ts17.SyntaxKind.FalseKeyword ? "boolean" : ts17.isStringLiteralLike(right) ? "string" : null;
+          if (kind && !coalesceLiteralTypes.has(name))
+            coalesceLiteralTypes.set(name, kind);
+        }
+      }
+      ts17.forEachChild(n, visit3);
+    };
+    visit3(sf);
   };
-  for (const memo of ir.metadata.memos)
+  for (const memo of ir.metadata.memos) {
     scan(memo.computation);
-  for (const signal of ir.metadata.signals)
+    pinCoalesceLiterals(memo.computation);
+  }
+  for (const signal of ir.metadata.signals) {
     scan(signal.initialValue);
+    pinCoalesceLiterals(signal.initialValue);
+  }
   for (const stmt of ir.metadata.initStatements ?? [])
     scan(stmt.body);
   for (const eff of ir.metadata.effects ?? [])
@@ -18131,11 +18688,39 @@ function augmentInheritedPropAccesses(ir) {
     if (c.isModule)
       continue;
     scan(c.value);
+    pinCoalesceLiterals(c.value);
   }
   const walk = (node) => {
     if (!node)
       return;
+    const carrier = node;
+    if (carrier.type === "expression") {
+      scan(carrier.expr);
+      pinCoalesceLiterals(carrier.expr);
+    }
+    scan(carrier.condition, bareRefProps);
+    pinCoalesceLiterals(carrier.condition);
+    scan(carrier.array, bareRefProps);
     const el = node;
+    for (const prop of node.props ?? []) {
+      const v = prop.value;
+      if (v?.parts) {
+        for (const part of v.parts) {
+          if (part.type === "string")
+            scan(part.value);
+          else if (part.type === "ternary") {
+            scan(part.condition);
+            scan(part.whenTrue);
+            scan(part.whenFalse);
+          } else if (part.type === "lookup")
+            scan(part.key);
+        }
+      }
+      if (v?.kind === "expression" && typeof v.expr === "string") {
+        scan(v.expr, bareRefProps);
+        pinCoalesceLiterals(v.expr);
+      }
+    }
     for (const attr of el.attrs ?? []) {
       const v = attr.value;
       if (v?.parts) {
@@ -18182,11 +18767,13 @@ function augmentInheritedPropAccesses(ir) {
     let raw;
     if (booleanAttrProps.has(name))
       raw = "boolean";
+    else if (coalesceLiteralTypes.has(name))
+      raw = coalesceLiteralTypes.get(name);
     else if (bareRefProps.has(name))
       raw = "unknown";
     else
       raw = "string";
-    const type = raw === "boolean" ? { kind: "primitive", raw: "boolean", primitive: "boolean" } : raw === "string" ? { kind: "primitive", raw: "string", primitive: "string" } : { kind: "unknown", raw: "unknown" };
+    const type = raw === "unknown" ? { kind: "unknown", raw: "unknown" } : { kind: "primitive", raw, primitive: raw };
     ir.metadata.propsParams.push({ name, type, optional: true });
     existing.add(name);
   }
@@ -18558,7 +19145,8 @@ function compileMultipleComponents(source, filePath, componentNames, options) {
       files.push({
         path: dir + output.componentName + adapter.extension,
         content: output.rawTemplate,
-        type: "markedTemplate"
+        type: "markedTemplate",
+        componentName: output.componentName
       });
       const ir = entries.find((e) => e.componentIR.metadata.componentName === output.componentName);
       const ssrDefaults = ir ? extractSsrDefaults(ir.componentIR.metadata) : undefined;
@@ -18566,7 +19154,8 @@ function compileMultipleComponents(source, filePath, componentNames, options) {
         files.push({
           path: dir + output.componentName + ".ssr-defaults.json",
           content: JSON.stringify(ssrDefaults),
-          type: "ssrDefaults"
+          type: "ssrDefaults",
+          componentName: output.componentName
         });
       }
     }
@@ -18862,7 +19451,8 @@ function compileJSX(source, filePath, options) {
   files.push({
     path: filePath.replace(/\.tsx?$/, adapter.extension),
     content,
-    type: "markedTemplate"
+    type: "markedTemplate",
+    componentName: componentIR.metadata.componentName
   });
   {
     const ssrDefaults = extractSsrDefaults(componentIR.metadata);
@@ -18870,7 +19460,8 @@ function compileJSX(source, filePath, options) {
       files.push({
         path: filePath.replace(/\.tsx?$/, ".ssr-defaults.json"),
         content: JSON.stringify(ssrDefaults),
-        type: "ssrDefaults"
+        type: "ssrDefaults",
+        componentName: componentIR.metadata.componentName
       });
     }
   }
@@ -19439,7 +20030,7 @@ function emitParsedExpr(expr, emitter) {
       return emitter.objectLiteral(expr.properties, expr.raw, emit);
     case "array-method":
       if (expr.method === "flat") {
-        return emitter.flatMethod(expr.object, expr.flatDepth, emit);
+        return emitter.flatMethod(expr.object, expr.depthExpr ? { expr: expr.depthExpr } : expr.flatDepth, emit);
       }
       return emitter.arrayMethod(expr.method, expr.object, expr.args, emit);
     case "unsupported":
@@ -19512,39 +20103,6 @@ function isOmitBranch(node) {
   }
   return false;
 }
-// src/lowering-registry.ts
-var plugins = [];
-function registerLoweringPlugin(plugin) {
-  const existing = plugins.findIndex((p) => p.name === plugin.name);
-  if (existing >= 0)
-    plugins[existing] = plugin;
-  else
-    plugins.push(plugin);
-}
-function getLoweringPlugins() {
-  return [...plugins];
-}
-function prepareLoweringMatchers(metadata) {
-  const matchers = [];
-  for (const plugin of plugins) {
-    const matcher = plugin.prepare(metadata);
-    if (matcher)
-      matchers.push(matcher);
-  }
-  return matchers;
-}
-function matchLoweringCall(callee, args, metadata) {
-  for (const matcher of prepareLoweringMatchers(metadata)) {
-    const node = matcher(callee, args);
-    if (node)
-      return node;
-  }
-  return null;
-}
-function __resetLoweringPluginsForTest(next = []) {
-  plugins.length = 0;
-  plugins.push(...next);
-}
 // src/builtin-lowering-plugins.ts
 var queryHrefPlugin = {
   name: "queryHref",
@@ -19718,8 +20276,7 @@ function parseAndMerge(content, importsBySource, otherImports, codeSections) {
   }
 }
 // src/loop-destructure.ts
-var SIMPLE_FIELD = /^\.[A-Za-z_$][\w$]*$/;
-function isLowerableObjectRestDestructure(loop) {
+function isLowerableLoopDestructure(loop) {
   const bindings = loop.paramBindings;
   if (!bindings || bindings.length === 0)
     return false;
@@ -19731,18 +20288,20 @@ function isLowerableObjectRestDestructure(loop) {
   }
   for (const b of bindings) {
     if (b.rest) {
-      if (b.rest.kind !== "object")
+      if (!b.segments)
         return false;
-    } else if (!SIMPLE_FIELD.test(b.path)) {
+    } else if (!b.segments || b.segments.length === 0) {
       return false;
     }
   }
-  const restNames = bindings.filter((b) => b.rest).map((b) => b.name);
-  if (restNames.length === 0)
+  const objectRestNames = bindings.filter((b) => b.rest?.kind === "object").map((b) => b.name);
+  if (objectRestNames.length === 0)
     return true;
-  return !restNamesMisused(loop, restNames);
+  return !restNamesMisused(loop, objectRestNames);
 }
+var isLowerableObjectRestDestructure = isLowerableLoopDestructure;
 function restNamesMisused(loop, names) {
+  const nameSet = new Set(names);
   const valueUse = names.map((n) => new RegExp(`(?<![\\w.$])${escapeRe(n)}(?!\\s*\\??\\.)(?![\\w$])`));
   let misused = false;
   const check = (s) => {
@@ -19755,7 +20314,10 @@ function restNamesMisused(loop, names) {
       }
     }
   };
-  const attr = (v) => {
+  const attr = (v, isIntrinsicElementAttrs) => {
+    if (v.kind === "spread" && isIntrinsicElementAttrs && nameSet.has(v.expr.trim())) {
+      return;
+    }
     if (v.kind === "expression" || v.kind === "spread") {
       check(v.expr);
       check(v.templateExpr);
@@ -19815,16 +20377,16 @@ function restNamesMisused(loop, names) {
           visit3(node.alternate);
         break;
       case "element":
-        node.attrs.forEach((a) => attr(a.value));
+        node.attrs.forEach((a) => attr(a.value, true));
         node.events.forEach((e) => check(e.handler));
         node.children.forEach(visit3);
         break;
       case "component":
-        node.props.forEach((p) => attr(p.value));
+        node.props.forEach((p) => attr(p.value, false));
         node.children.forEach(visit3);
         break;
       case "provider":
-        attr(node.valueProp.value);
+        attr(node.valueProp.value, false);
         node.children.forEach(visit3);
         break;
       case "fragment":
@@ -22491,8 +23053,10 @@ export {
   listComponentFunctions,
   jsxToIR,
   joinProfilerEvents,
+  isValidHelperId,
   isSupported,
   isLowerableObjectRestDestructure,
+  isLowerableLoopDestructure,
   isBooleanAttr,
   importsSearchParams,
   identifierPath,