@barefootjs/test 0.26.2 → 0.26.3

package/dist/index.js

@@ -187301,6 +187301,7 @@ var UNSUPPORTED_METHODS = new Set([
   "some",
   "forEach",
   "flatMap",
+  "fill",
   "charAt",
   "charCodeAt",
   "codePointAt",
@@ -189191,6 +189192,16 @@ function computeFileScope(entryPath) {
 
 // ../jsx/src/ir-to-client-js/csr-substitute.ts
 var import_typescript4 = __toESM(require_typescript(), 1);
+function extractFreeIdentifiersFromText(text) {
+  if (!text || text.trim().length === 0)
+    return new Set;
+  const sf = import_typescript4.default.createSourceFile("__free_ids__.ts", `(${text});`, import_typescript4.default.ScriptTarget.Latest, true, import_typescript4.default.ScriptKind.TS);
+  const stmt = sf.statements[0];
+  if (!stmt || !import_typescript4.default.isExpressionStatement(stmt))
+    return new Set;
+  const expr = import_typescript4.default.isParenthesizedExpression(stmt.expression) ? stmt.expression.expression : stmt.expression;
+  return extractFreeIdentifiersFromNode(expr);
+}
 
 // ../jsx/src/ir-to-client-js/html-template.ts
 function splitTemplateInterpolations(inner) {
@@ -189412,6 +189423,39 @@ function reconstructWithoutTypes(node, sourceFile, ranges) {
   }
   return result;
 }
+function reconstructAsSegments(node, sourceFile, ranges, markers) {
+  const nodeStart = node.getStart(sourceFile);
+  const nodeEnd = node.getEnd();
+  const fullText = sourceFile.text;
+  const edits = [];
+  for (const r of ranges) {
+    if (r.end <= nodeStart || r.start >= nodeEnd)
+      continue;
+    edits.push({ start: r.start, end: r.end, marker: null });
+  }
+  markers.forEach((m, i2) => edits.push({ start: m.start, end: m.end, marker: i2 }));
+  edits.sort((a, b) => a.start - b.start || b.end - a.end);
+  const segments = [];
+  let jsBuf = "";
+  let pos = nodeStart;
+  for (const edit of edits) {
+    if (edit.start < pos)
+      continue;
+    jsBuf += fullText.slice(pos, edit.start);
+    if (edit.marker !== null) {
+      if (jsBuf)
+        segments.push({ js: jsBuf });
+      jsBuf = "";
+      segments.push({ marker: edit.marker });
+    }
+    pos = edit.end;
+  }
+  if (pos < nodeEnd)
+    jsBuf += fullText.slice(pos, nodeEnd);
+  if (jsBuf)
+    segments.push({ js: jsBuf });
+  return segments;
+}
 function mergeRanges(ranges) {
   if (ranges.length === 0)
     return [];
@@ -189557,10 +189601,11 @@ function findAngleBracketAfter(lastTypeArg, fullText) {
 }
 
 // ../jsx/src/analyzer-context.ts
-function createAnalyzerContext(sourceFile, filePath) {
+function createAnalyzerContext(sourceFile, filePath, acceptsCallbackBody) {
   return {
     sourceFile,
     filePath,
+    acceptsCallbackBody,
     componentName: null,
     componentNode: null,
     hasDefaultExport: false,
@@ -189606,6 +189651,9 @@ function createAnalyzerContext(sourceFile, filePath) {
       } catch {
         ownSourceFile = undefined;
       }
+      if (process.env.BF_ASSERT_NO_JSX_IN_GETJS === "1" && this.errors.length === 0 && nodeContainsJsx(node)) {
+        throw new Error("getJS() called on a JSX-bearing node — raw JSX must never be spliced " + "into emitted output. Carry mixed content as structured segments " + "(MapCallbackPreamble / FlatMapCallback) instead.");
+      }
       if (ownSourceFile && ownSourceFile !== sourceFile) {
         return node.getText(ownSourceFile);
       }
@@ -189613,6 +189661,11 @@ function createAnalyzerContext(sourceFile, filePath) {
     }
   };
 }
+function nodeContainsJsx(node) {
+  if (import_typescript7.default.isJsxElement(node) || import_typescript7.default.isJsxSelfClosingElement(node) || import_typescript7.default.isJsxFragment(node))
+    return true;
+  return import_typescript7.default.forEachChild(node, nodeContainsJsx) ?? false;
+}
 function getSourceLocation(node, sourceFile, filePath) {
   const start = sourceFile.getLineAndCharacterOfPosition(node.getStart());
   const end = sourceFile.getLineAndCharacterOfPosition(node.getEnd());
@@ -190038,7 +190091,7 @@ function createProgramForFile(source, filePath) {
     return null;
   }
 }
-function analyzeComponent(source, filePath, targetComponentName, program) {
+function analyzeComponent(source, filePath, targetComponentName, program, acceptsCallbackBody) {
   incrementCounter("filesAnalyzed");
   const hadSharedProgram = program !== undefined;
   const prescan = prescanReactiveFactoriesInSource(source, filePath);
@@ -190071,7 +190124,7 @@ function analyzeComponent(source, filePath, targetComponentName, program) {
       checker = result.checker;
     }
   }
-  const ctx = createAnalyzerContext(sourceFile, filePath);
+  const ctx = createAnalyzerContext(sourceFile, filePath, acceptsCallbackBody);
   ctx.checker = checker;
   ctx.reactiveFactories = prescan.factories;
   ctx.declinedReactiveFactories = prescan.declined;
@@ -191123,9 +191176,15 @@ function extractSingleJsxReturn(body) {
     return null;
   return jsxReturn;
 }
-function extractMultiReturnJsxBranches(body) {
+function preambleUnsafe(preamble, branches, fallback) {
+  if (preamble.length === 0)
+    return false;
+  return fallback === null || branches.some((b) => b.jsxReturn === null);
+}
+function extractMultiReturnJsxBranches(body, allowPreamble = false) {
   const branches = [];
   let fallback = null;
+  const preamble = [];
   const stmts = body.statements;
   for (let i2 = 0;i2 < stmts.length; i2++) {
     const stmt = stmts[i2];
@@ -191155,7 +191214,9 @@ function extractMultiReturnJsxBranches(body) {
           }
           if (branches.length === 0)
             return null;
-          return { branches, fallback };
+          if (preambleUnsafe(preamble, branches, fallback))
+            return null;
+          return { branches, fallback, preamble };
         }
         break;
       }
@@ -191170,23 +191231,38 @@ function extractMultiReturnJsxBranches(body) {
       const hasDefault = stmt.caseBlock.clauses.some((c) => import_typescript8.default.isDefaultClause(c));
       if (!hasDefault)
         return null;
+      let pendingCases = [];
       for (const clause of stmt.caseBlock.clauses) {
+        if (import_typescript8.default.isCaseClause(clause) && clause.statements.length === 0) {
+          pendingCases.push(clause.expression);
+          continue;
+        }
         const jsxReturn = findJsxReturnInCaseClause(clause);
         const nullReturn = findNullReturnInCaseClause(clause);
         if (!jsxReturn && !nullReturn)
           return null;
+        if (!caseClauseIsDirectReturn(clause))
+          return null;
         if (import_typescript8.default.isCaseClause(clause)) {
           branches.push({
             condition: clause.expression,
-            jsxReturn: jsxReturn ?? null
+            jsxReturn: jsxReturn ?? null,
+            extraCaseConditions: pendingCases.length > 0 ? pendingCases : undefined
           });
+          pendingCases = [];
         } else {
+          if (pendingCases.length > 0)
+            return null;
           fallback = jsxReturn ?? null;
         }
       }
+      if (pendingCases.length > 0)
+        return null;
       if (branches.length === 0)
         return null;
-      return { branches, fallback, switchDiscriminant: stmt.expression };
+      if (preambleUnsafe(preamble, branches, fallback))
+        return null;
+      return { branches, fallback, switchDiscriminant: stmt.expression, preamble };
     }
     if (import_typescript8.default.isReturnStatement(stmt) && stmt.expression) {
       const expr = unwrapJsxTransparent(stmt.expression);
@@ -191197,13 +191273,22 @@ function extractMultiReturnJsxBranches(body) {
       }
       continue;
     }
-    if (import_typescript8.default.isVariableStatement(stmt))
+    if (import_typescript8.default.isVariableStatement(stmt)) {
+      const declFlags = stmt.declarationList.flags;
+      const isConstOrLet = (declFlags & import_typescript8.default.NodeFlags.Const) !== 0 || (declFlags & import_typescript8.default.NodeFlags.Let) !== 0;
+      if (allowPreamble && isConstOrLet && branches.length === 0 && fallback === null) {
+        preamble.push(stmt);
+        continue;
+      }
       return null;
+    }
     return null;
   }
   if (branches.length === 0)
     return null;
-  return { branches, fallback };
+  if (preambleUnsafe(preamble, branches, fallback))
+    return null;
+  return { branches, fallback, preamble };
 }
 function isDirectReturnBlock(node) {
   if (import_typescript8.default.isReturnStatement(node))
@@ -191213,9 +191298,9 @@ function isDirectReturnBlock(node) {
     for (const stmt of node.statements) {
       if (import_typescript8.default.isReturnStatement(stmt)) {
         returnCount++;
-      } else if (import_typescript8.default.isIfStatement(stmt) || import_typescript8.default.isSwitchStatement(stmt) || import_typescript8.default.isForStatement(stmt) || import_typescript8.default.isForOfStatement(stmt) || import_typescript8.default.isForInStatement(stmt) || import_typescript8.default.isWhileStatement(stmt) || import_typescript8.default.isDoStatement(stmt) || import_typescript8.default.isTryStatement(stmt)) {
-        return false;
+        continue;
       }
+      return false;
     }
     return returnCount === 1;
   }
@@ -191246,6 +191331,24 @@ function findJsxReturnInCaseClause(clause) {
   }
   return null;
 }
+function caseClauseIsDirectReturn(clause) {
+  let returnCount = 0;
+  let seenReturn = false;
+  for (const stmt of clause.statements) {
+    if (import_typescript8.default.isReturnStatement(stmt)) {
+      returnCount++;
+      seenReturn = true;
+      continue;
+    }
+    if (import_typescript8.default.isBreakStatement(stmt)) {
+      if (!seenReturn)
+        return false;
+      continue;
+    }
+    return false;
+  }
+  return returnCount === 1;
+}
 function findNullReturnInCaseClause(clause) {
   for (const stmt of clause.statements) {
     if (import_typescript8.default.isReturnStatement(stmt) && stmt.expression) {
@@ -193261,6 +193364,9 @@ var REACTIVE_BINDING_KINDS = new Set([
 function isReactiveOrigin(origin) {
   return origin.freeRefs?.some((r) => REACTIVE_BINDING_KINDS.has(r.kind)) ?? false;
 }
+function tsxSourceText(raw) {
+  return raw;
+}
 var AttrValueOf = {
   literal(value) {
     return { kind: "literal", value };
@@ -194391,8 +194497,13 @@ function attachParsedExpressions(node, analyzer, bound = EMPTY_BOUND) {
         for (const child of nested.children)
           attachParsedExpressions(child, analyzer, loopBound);
       }
-      for (const frag of node.flatMapCallback?.fragments ?? []) {
-        attachParsedExpressions(frag.ir, analyzer, loopBound);
+      for (const seg of node.flatMapCallback?.segments ?? []) {
+        if (seg.kind === "jsx")
+          attachParsedExpressions(seg.ir, analyzer, loopBound);
+      }
+      for (const seg of node.preamble?.segments ?? []) {
+        if (seg.kind === "jsx")
+          attachParsedExpressions(seg.ir, analyzer, loopBound);
       }
       break;
     }
@@ -195027,74 +195138,78 @@ function transformMultiReturnJsxFunctionCall(callExpr, info, ctx) {
   ctx.analyzer.getJS = substitutedGetJS;
   try {
     const loc = getSourceLocation(callExpr, ctx.sourceFile, ctx.filePath);
-    const nullExpr = {
-      type: "expression",
-      expr: "null",
-      typeInfo: { kind: "primitive", raw: "null", primitive: "null" },
-      reactive: false,
-      slotId: null,
-      loc,
-      origin: { phase: "tick", scope: "template", effect: "pure", freeRefs: [] }
-    };
-    let result = info.fallback ? transformNode(info.fallback, ctx) ?? nullExpr : nullExpr;
-    for (let i2 = info.branches.length - 1;i2 >= 0; i2--) {
-      const branch = info.branches[i2];
-      let conditionText;
-      if (info.switchDiscriminant) {
-        const discText = substitutedGetJS(info.switchDiscriminant);
-        const caseText = substitutedGetJS(branch.condition);
-        conditionText = `${discText} === ${caseText}`;
-      } else {
-        conditionText = substitutedGetJS(branch.condition);
-      }
-      const env = makeBindingEnv(ctx);
-      const caseFreeRefs = resolveFreeRefs(branch.condition, env);
-      const discFreeRefs = info.switchDiscriminant ? resolveFreeRefs(info.switchDiscriminant, env) : [];
-      const conditionOrigin = {
-        phase: "tick",
-        scope: "template",
-        effect: "pure",
-        freeRefs: [...discFreeRefs, ...caseFreeRefs]
-      };
-      const reactive = isReactiveExpression(conditionText, ctx, branch.condition) || isReactiveOrigin(conditionOrigin);
-      const loopParamReactive = !reactive && referencesLoopParam(conditionText, ctx);
-      const callsReactive = exprCallsReactiveGetters(branch.condition, ctx) || (info.switchDiscriminant ? exprCallsReactiveGetters(info.switchDiscriminant, ctx) : false);
-      const hasCalls = exprHasFunctionCalls(branch.condition) || (info.switchDiscriminant ? exprHasFunctionCalls(info.switchDiscriminant) : false);
-      const needsSlot = reactive || loopParamReactive || callsReactive || hasCalls;
-      const slotId = needsSlot ? generateSlotId(ctx) : null;
-      const whenTrue = branch.jsxReturn ? transformNode(branch.jsxReturn, ctx) ?? nullExpr : nullExpr;
-      let templateCondition;
-      if (info.switchDiscriminant) {
-        const discRewritten = rewriteBarePropRefs2(substitutedGetJS(info.switchDiscriminant), info.switchDiscriminant, ctx);
-        const caseRewritten = rewriteBarePropRefs2(substitutedGetJS(branch.condition), branch.condition, ctx);
-        const discPart = discRewritten ?? substitutedGetJS(info.switchDiscriminant);
-        const casePart = caseRewritten ?? substitutedGetJS(branch.condition);
-        templateCondition = `${discPart} === ${casePart}`;
-      } else {
-        templateCondition = rewriteBarePropRefs2(conditionText, branch.condition, ctx);
-      }
-      const conditional = {
-        type: "conditional",
-        condition: conditionText,
-        templateCondition,
-        conditionType: null,
-        reactive,
-        whenTrue,
-        whenFalse: result,
-        slotId,
-        callsReactiveGetters: callsReactive || undefined,
-        hasFunctionCalls: hasCalls || undefined,
-        loc,
-        origin: conditionOrigin
-      };
-      result = conditional;
-    }
-    return result;
+    return foldMultiReturnBranches(info, ctx, loc, substitutedGetJS);
   } finally {
     ctx.getJS = originalCtxGetJS;
     ctx.analyzer.getJS = originalAnalyzerGetJS;
   }
 }
+function foldMultiReturnBranches(info, ctx, loc, getText) {
+  const nullExpr = {
+    type: "expression",
+    expr: "null",
+    typeInfo: { kind: "primitive", raw: "null", primitive: "null" },
+    reactive: false,
+    slotId: null,
+    loc,
+    origin: { phase: "tick", scope: "template", effect: "pure", freeRefs: [] }
+  };
+  let result = info.fallback ? transformNode(info.fallback, ctx) ?? nullExpr : nullExpr;
+  for (let i2 = info.branches.length - 1;i2 >= 0; i2--) {
+    const branch = info.branches[i2];
+    const caseConds = info.switchDiscriminant ? [branch.condition, ...branch.extraCaseConditions ?? []] : [branch.condition];
+    let conditionText;
+    if (info.switchDiscriminant) {
+      const discText = getText(info.switchDiscriminant);
+      conditionText = caseConds.map((c) => `(${discText}) === (${getText(c)})`).join(" || ");
+    } else {
+      conditionText = getText(branch.condition);
+    }
+    const env = makeBindingEnv(ctx);
+    const caseFreeRefs = caseConds.flatMap((c) => resolveFreeRefs(c, env));
+    const discFreeRefs = info.switchDiscriminant ? resolveFreeRefs(info.switchDiscriminant, env) : [];
+    const conditionOrigin = {
+      phase: "tick",
+      scope: "template",
+      effect: "pure",
+      freeRefs: [...discFreeRefs, ...caseFreeRefs]
+    };
+    const reactive = isReactiveExpression(conditionText, ctx, branch.condition) || isReactiveOrigin(conditionOrigin);
+    const loopParamReactive = !reactive && referencesLoopParam(conditionText, ctx);
+    const callsReactive = caseConds.some((c) => exprCallsReactiveGetters(c, ctx)) || (info.switchDiscriminant ? exprCallsReactiveGetters(info.switchDiscriminant, ctx) : false);
+    const hasCalls = caseConds.some((c) => exprHasFunctionCalls(c)) || (info.switchDiscriminant ? exprHasFunctionCalls(info.switchDiscriminant) : false);
+    const needsSlot = reactive || loopParamReactive || callsReactive || hasCalls;
+    const slotId = needsSlot ? generateSlotId(ctx) : null;
+    const whenTrue = branch.jsxReturn ? transformNode(branch.jsxReturn, ctx) ?? nullExpr : nullExpr;
+    let templateCondition;
+    if (info.switchDiscriminant) {
+      const discRewritten = rewriteBarePropRefs2(getText(info.switchDiscriminant), info.switchDiscriminant, ctx);
+      const discPart = discRewritten ?? getText(info.switchDiscriminant);
+      templateCondition = caseConds.map((c) => {
+        const casePart = rewriteBarePropRefs2(getText(c), c, ctx) ?? getText(c);
+        return `(${discPart}) === (${casePart})`;
+      }).join(" || ");
+    } else {
+      templateCondition = rewriteBarePropRefs2(conditionText, branch.condition, ctx);
+    }
+    const conditional = {
+      type: "conditional",
+      condition: conditionText,
+      templateCondition,
+      conditionType: null,
+      reactive,
+      whenTrue,
+      whenFalse: result,
+      slotId,
+      callsReactiveGetters: callsReactive || undefined,
+      hasFunctionCalls: hasCalls || undefined,
+      loc,
+      origin: conditionOrigin
+    };
+    result = conditional;
+  }
+  return result;
+}
 function transformConditional(node, ctx) {
   const condition = ctx.getJS(node.condition);
   const conditionOrigin = {
@@ -195945,9 +196060,7 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
   let filterPredicate;
   let sortComparator;
   let chainOrder;
-  let mapPreamble;
-  let templateMapPreamble;
-  let typedMapPreamble;
+  let preamble;
   let iterationShape;
   let objectIteration;
   const setArray = (node2) => {
@@ -195977,7 +196090,7 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
     const innerFilter = isFilterCall(sortInfo.array);
     const sortExtraction = extractSortComparator(sortInfo.callback, sortInfo.method, ctx);
     if (isClientOnly || !sortExtraction.result) {
-      if (!isClientOnly && sortExtraction.unsupportedReason) {
+      if (!isClientOnly && sortExtraction.unsupportedReason && !(ctx.analyzer.acceptsCallbackBody?.("sort") ?? false)) {
         ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(sortInfo.callback, ctx.sourceFile, ctx.filePath), {
           message: `Expression cannot be compiled to marked template: ${sortExtraction.unsupportedReason}`,
           suggestion: {
@@ -195992,7 +196105,7 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
         chainOrder = "filter-sort";
         const filterExtraction = extractFilterPredicate(innerFilter.callback, ctx);
         if (isClientOnly || !filterExtraction.result) {
-          if (!isClientOnly && filterExtraction.unsupportedReason) {
+          if (!isClientOnly && filterExtraction.unsupportedReason && !(ctx.analyzer.acceptsCallbackBody?.("filter") ?? false)) {
             ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(innerFilter.callback, ctx.sourceFile, ctx.filePath), {
               message: `Expression cannot be compiled to marked template: ${filterExtraction.unsupportedReason}`,
               suggestion: {
@@ -196015,7 +196128,7 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
     const innerSort = isSortCall(filterInfo.array);
     const filterExtraction = extractFilterPredicate(filterInfo.callback, ctx);
     if (isClientOnly || !filterExtraction.result) {
-      if (!isClientOnly && filterExtraction.unsupportedReason) {
+      if (!isClientOnly && filterExtraction.unsupportedReason && !(ctx.analyzer.acceptsCallbackBody?.("filter") ?? false)) {
         ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(filterInfo.callback, ctx.sourceFile, ctx.filePath), {
           message: `Expression cannot be compiled to marked template: ${filterExtraction.unsupportedReason}`,
           suggestion: {
@@ -196030,7 +196143,7 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
         chainOrder = "sort-filter";
         const sortExtraction = extractSortComparator(innerSort.callback, innerSort.method, ctx);
         if (isClientOnly || !sortExtraction.result) {
-          if (!isClientOnly && sortExtraction.unsupportedReason) {
+          if (!isClientOnly && sortExtraction.unsupportedReason && !(ctx.analyzer.acceptsCallbackBody?.("sort") ?? false)) {
             ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(innerSort.callback, ctx.sourceFile, ctx.filePath), {
               message: `Expression cannot be compiled to marked template: ${sortExtraction.unsupportedReason}`,
               suggestion: {
@@ -196145,7 +196258,24 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
     } else if (method === "flatMap" && import_typescript11.default.isArrayLiteralExpression(body)) {
       children = transformArrayLiteralChildren(body, ctx);
     } else if (import_typescript11.default.isBlock(body)) {
-      const returnStmt = body.statements.find((s) => import_typescript11.default.isReturnStatement(s) && s.expression != null);
+      const multiReturn = method !== "flatMap" ? extractMultiReturnJsxBranches(body, true) : null;
+      if (multiReturn && multiReturn.branches.length > 0) {
+        const loc = getSourceLocation(body, ctx.sourceFile, ctx.filePath);
+        children = [foldMultiReturnBranches(multiReturn, ctx, loc, ctx.getJS)];
+        const pre = multiReturn.preamble ?? [];
+        if (pre.length > 0) {
+          preamble = preambleFromValueStatements(pre, ctx);
+          if (!isClientOnly && !(ctx.analyzer.acceptsCallbackBody?.("map") ?? false)) {
+            ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, loc, {
+              message: "A .map() callback body with a `const`/`let` preamble before its " + "branches cannot be lowered to a template: the loop-local binding " + "cannot be carried into a conditional branch on this backend.",
+              suggestion: {
+                message: "Add /* @client */ to evaluate this expression on the client only"
+              }
+            }));
+          }
+        }
+      }
+      const returnStmt = children.length === 0 ? body.statements.find((s) => import_typescript11.default.isReturnStatement(s) && s.expression != null) : undefined;
       if (returnStmt && returnStmt.expression) {
         let returnExpr = returnStmt.expression;
         while (import_typescript11.default.isParenthesizedExpression(returnExpr)) {
@@ -196157,32 +196287,53 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
             children = [transformed];
           }
         }
-        const preambleStmts = [];
-        const templatePreambleStmts = [];
-        const typedPreambleStmts = [];
-        let hasTypeDiff = false;
-        let hasTemplateDiff = false;
+        let jsxPreambleStmt;
         for (const stmt of body.statements) {
           if (stmt === returnStmt)
             break;
-          const js = ctx.getJS(stmt);
-          const tjs = ctx.getTemplateJS(stmt);
-          const ts12 = stmt.getText(ctx.sourceFile);
-          preambleStmts.push(js.endsWith(";") ? js : js + ";");
-          templatePreambleStmts.push(tjs.endsWith(";") ? tjs : tjs + ";");
-          typedPreambleStmts.push(ts12.endsWith(";") ? ts12 : ts12 + ";");
-          if (js !== ts12)
-            hasTypeDiff = true;
-          if (js !== tjs)
-            hasTemplateDiff = true;
+          if (containsJsxInExpression(stmt)) {
+            jsxPreambleStmt = stmt;
+            break;
+          }
         }
-        if (preambleStmts.length > 0) {
-          mapPreamble = preambleStmts.join(" ");
-          if (hasTemplateDiff) {
-            templateMapPreamble = templatePreambleStmts.join(" ");
+        if (jsxPreambleStmt) {
+          const jsRuntime = isClientOnly || (ctx.analyzer.acceptsCallbackBody?.("map") ?? false);
+          if (children.length === 0) {
+            ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(jsxPreambleStmt, ctx.sourceFile, ctx.filePath), {
+              message: "A .map() callback that builds JSX in a statement before its " + "`return` must return a single JSX element that embeds the " + "built array — this return shape has no element root to host it.",
+              suggestion: {
+                message: "Wrap the result in one element root, e.g. `return <tr key={item.id}>{out}</tr>`."
+              }
+            }));
+          } else if (!jsRuntime) {
+            ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(jsxPreambleStmt, ctx.sourceFile, ctx.filePath), {
+              message: "A .map() callback that builds JSX in a statement before its " + "`return` (for example pushing elements into an array in a loop) " + "cannot be lowered to a template on this backend.",
+              suggestion: {
+                message: "Add /* @client */ to render this loop on the client only"
+              }
+            }));
+          } else {
+            const collected = buildPreambleSegments(body.statements, returnStmt, ctx);
+            if (collected.refusalNode) {
+              ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(collected.refusalNode, ctx.sourceFile, ctx.filePath), {
+                message: "A JSX element built in a .map() callback preamble cannot carry " + "event handlers, components, nested loops, or reactive expressions, " + "and cannot sit inside a template literal — the verbatim render " + "path builds it once, with no reactive wiring.",
+                suggestion: {
+                  message: "Return the element directly (not through a preamble variable), " + "or add /* @client */ to render the loop on the client only."
+                }
+              }));
+            } else {
+              preamble = collected.preamble;
+            }
+          }
+        } else {
+          const valueStmts = [];
+          for (const stmt of body.statements) {
+            if (stmt === returnStmt)
+              break;
+            valueStmts.push(stmt);
           }
-          if (hasTypeDiff) {
-            typedMapPreamble = typedPreambleStmts.join(" ");
+          if (valueStmts.length > 0) {
+            preamble = preambleFromValueStatements(valueStmts, ctx);
           }
         }
       }
@@ -196211,6 +196362,31 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
   const itemConditional = children.length > 0 ? loopBodyItemConditional(children) : null;
   const bodyIsItemConditional = itemConditional !== null;
   const key = bodyIsItemConditional ? extractItemConditionalKey(itemConditional) : children.length > 0 ? extractLoopKey(children[0]) : null;
+  const declaredNameSet = preamble && preamble.declaredNames.length > 0 ? new Set(preamble.declaredNames) : undefined;
+  if (key && declaredNameSet) {
+    const keyRefs = extractFreeIdentifiersFromText(key);
+    const usesLocal = [...keyRefs].some((r) => declaredNameSet.has(r));
+    if (usesLocal) {
+      ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(node, ctx.sourceFile, ctx.filePath), {
+        message: "A .map() loop key must be derivable from the loop item — it is " + "evaluated before the callback body runs, so it cannot reference a " + "value computed in the callback preamble.",
+        suggestion: {
+          message: "Derive the key directly from the loop item (e.g. key={item.id})."
+        }
+      }));
+    }
+  }
+  if (preamble && preamble.builderNames.length > 0) {
+    flagArrayChildExpressions(children, new Set(preamble.builderNames));
+  }
+  if (preamble && preamble.builderNames.length > 0 && children.length === 1 && children[0].type === "component") {
+    ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(node, ctx.sourceFile, ctx.filePath), {
+      message: "A .map() callback that builds JSX in its preamble cannot return a " + "component: the built elements would reach the component as raw HTML " + "strings on the client but as JSX elements at SSR (a silent divergence).",
+      suggestion: {
+        message: "Return a plain element root that embeds the array, or move the " + "building logic inside the component."
+      }
+    }));
+    preamble = undefined;
+  }
   let childComponent;
   if (children.length === 1 && children[0].type === "component") {
     const comp = children[0];
@@ -196259,11 +196435,9 @@ function transformMapCall(node, ctx, isClientOnly = false, method = "map") {
     objectIteration,
     depth,
     clientOnly: isClientOnly || undefined,
-    mapPreamble,
-    templateMapPreamble,
+    preamble,
     paramType,
     indexType,
-    typedMapPreamble,
     paramBindings,
     arrayFreeIdentifiers: extractFreeIdentifiersFromNode(arrayExpr),
     flatMapCallback,
@@ -196299,47 +196473,206 @@ function containsJsx(node) {
 function buildFlatMapCallback(callback, body, ctx) {
   if (!containsJsx(body))
     return;
-  const fragments = [];
-  const sourceText = ctx.sourceFile.text;
-  const bodyStart = body.getStart(ctx.sourceFile);
-  const bodyEnd = body.getEnd();
-  const bodyText = sourceText.slice(bodyStart, bodyEnd);
-  const jsxNodes = [];
-  function collectJsx(n) {
+  const leafSpans = [];
+  const leafIrs = [];
+  let refusalNode;
+  const collectJsx = (n, underTemplate) => {
     if (import_typescript11.default.isJsxElement(n) || import_typescript11.default.isJsxSelfClosingElement(n) || import_typescript11.default.isJsxFragment(n)) {
-      jsxNodes.push({
-        node: n,
-        start: n.getStart(ctx.sourceFile) - bodyStart,
-        end: n.getEnd() - bodyStart
-      });
+      if (underTemplate)
+        refusalNode ??= n;
+      leafSpans.push({ start: n.getStart(ctx.sourceFile), end: n.getEnd() });
+      const ir = transformNode(n, ctx);
+      leafIrs.push(ir ?? { type: "text", value: "", loc: getSourceLocation(n, ctx.sourceFile, ctx.filePath) });
       return;
     }
-    n.forEachChild(collectJsx);
-  }
-  collectJsx(body);
-  if (jsxNodes.length === 0)
+    const inTemplate = underTemplate || import_typescript11.default.isTemplateExpression(n) || import_typescript11.default.isTaggedTemplateExpression(n);
+    n.forEachChild((c) => collectJsx(c, inTemplate));
+  };
+  collectJsx(body, false);
+  if (leafSpans.length === 0)
+    return;
+  if (refusalNode) {
+    ctx.analyzer.errors.push(createError(ErrorCodes.UNSUPPORTED_JSX_PATTERN, getSourceLocation(refusalNode, ctx.sourceFile, ctx.filePath), {
+      message: "A JSX element inside a template literal in a .flatMap() callback " + "body cannot be compiled.",
+      suggestion: { message: "Build the element outside the template literal." }
+    }));
     return;
-  let compiledBody = "";
-  let lastEnd = 0;
-  for (let i2 = 0;i2 < jsxNodes.length; i2++) {
-    const { node, start, end } = jsxNodes[i2];
-    const placeholder = `__BF_JSX_${i2}__`;
-    compiledBody += bodyText.slice(lastEnd, start) + placeholder;
-    lastEnd = end;
-    const ir = transformNode(node, ctx);
-    fragments.push({
-      placeholder,
-      ir: ir ?? { type: "text", value: "", loc: getSourceLocation(node, ctx.sourceFile, ctx.filePath) }
-    });
   }
-  compiledBody += bodyText.slice(lastEnd);
+  const pieces = reconstructAsSegments(body, ctx.sourceFile, ctx.analyzer.typeExcludeRanges, leafSpans);
+  const segments = pieces.map((piece) => {
+    if ("marker" in piece)
+      return { kind: "jsx", ir: leafIrs[piece.marker] };
+    const tpl = rewriteBarePropRefs2(piece.js, body, ctx);
+    return tpl !== undefined && tpl !== piece.js ? { kind: "js", text: piece.js, templateText: tpl } : { kind: "js", text: piece.js };
+  });
   const paramsText = callback.parameters.map((p) => p.getText(ctx.sourceFile)).join(", ");
   return {
     params: `(${paramsText})`,
-    body: compiledBody,
-    templateBody: compiledBody,
-    rawBody: bodyText,
-    fragments
+    segments,
+    rawBody: tsxSourceText(body.getText(ctx.sourceFile))
+  };
+}
+function preambleFragmentNeedsWiring(ir) {
+  switch (ir.type) {
+    case "component":
+    case "loop":
+      return true;
+    case "element":
+      if (ir.events.length > 0)
+        return true;
+      if (ir.attrs.some((a) => a.name.startsWith("...")))
+        return true;
+      return ir.children.some(preambleFragmentNeedsWiring);
+    case "expression":
+      return ir.reactive === true;
+    case "conditional":
+      return preambleFragmentNeedsWiring(ir.whenTrue) || (ir.whenFalse ? preambleFragmentNeedsWiring(ir.whenFalse) : false);
+    case "fragment":
+      return ir.children.some(preambleFragmentNeedsWiring);
+    default:
+      return false;
+  }
+}
+function flagArrayChildExpressions(nodes, declared) {
+  for (const node of nodes) {
+    switch (node.type) {
+      case "expression": {
+        const name = node.expr.trim();
+        const refs = extractFreeIdentifiersFromText(node.expr);
+        if (refs.size === 1 && refs.has(name) && declared.has(name)) {
+          node.joinArrayChild = true;
+        }
+        break;
+      }
+      case "element":
+      case "fragment":
+        flagArrayChildExpressions(node.children, declared);
+        break;
+      case "conditional":
+        flagArrayChildExpressions([node.whenTrue, ...node.whenFalse ? [node.whenFalse] : []], declared);
+        break;
+    }
+  }
+}
+function collectBindingNames(name, out) {
+  if (import_typescript11.default.isIdentifier(name)) {
+    out.add(name.text);
+    return;
+  }
+  for (const el of name.elements) {
+    if (import_typescript11.default.isBindingElement(el))
+      collectBindingNames(el.name, out);
+  }
+}
+function collectPreambleDeclaredNames(stmt, out) {
+  if (import_typescript11.default.isVariableStatement(stmt)) {
+    for (const decl of stmt.declarationList.declarations) {
+      collectBindingNames(decl.name, out);
+    }
+  } else if (import_typescript11.default.isFunctionDeclaration(stmt) && stmt.name) {
+    out.add(stmt.name.text);
+  }
+}
+function preambleFromValueStatements(statements, ctx) {
+  const segments = [];
+  const typedParts = [];
+  const declared = new Set;
+  for (const stmt of statements) {
+    collectPreambleDeclaredNames(stmt, declared);
+    const js0 = ctx.getJS(stmt);
+    const tjs0 = ctx.getTemplateJS(stmt);
+    const raw0 = stmt.getText(ctx.sourceFile);
+    const js = (js0.endsWith(";") ? js0 : js0 + ";") + " ";
+    const tjs = (tjs0.endsWith(";") ? tjs0 : tjs0 + ";") + " ";
+    typedParts.push(raw0.endsWith(";") ? raw0 : raw0 + ";");
+    segments.push(tjs !== js ? { kind: "js", text: js, templateText: tjs } : { kind: "js", text: js });
+  }
+  return {
+    segments: trimPreambleSegments(segments),
+    ssrText: tsxSourceText(typedParts.join(" ")),
+    declaredNames: [...declared],
+    builderNames: []
+  };
+}
+function trimPreambleSegments(segments) {
+  const last = segments[segments.length - 1];
+  if (last?.kind === "js") {
+    const text = last.text.trimEnd();
+    const templateText = last.templateText?.trimEnd();
+    segments[segments.length - 1] = templateText !== undefined ? { kind: "js", text, templateText } : { kind: "js", text };
+  }
+  return segments;
+}
+function buildPreambleSegments(statements, returnStmt, ctx) {
+  const segments = [];
+  const typedParts = [];
+  const declared = new Set;
+  const builders = new Set;
+  let refusalNode;
+  const recordBuilderTarget = (leaf, stmt) => {
+    for (let n = leaf.parent;n && n !== stmt.parent; n = n.parent) {
+      if (import_typescript11.default.isCallExpression(n) && import_typescript11.default.isPropertyAccessExpression(n.expression) && (n.expression.name.text === "push" || n.expression.name.text === "unshift") && import_typescript11.default.isIdentifier(n.expression.expression)) {
+        builders.add(n.expression.expression.text);
+        return;
+      }
+      if (import_typescript11.default.isVariableDeclaration(n) && import_typescript11.default.isIdentifier(n.name)) {
+        builders.add(n.name.text);
+        return;
+      }
+    }
+  };
+  for (const stmt of statements) {
+    if (stmt === returnStmt)
+      break;
+    collectPreambleDeclaredNames(stmt, declared);
+    const leafSpans = [];
+    const leafIrs = [];
+    const collect = (n, underTemplate) => {
+      if (import_typescript11.default.isJsxElement(n) || import_typescript11.default.isJsxSelfClosingElement(n) || import_typescript11.default.isJsxFragment(n)) {
+        if (underTemplate)
+          refusalNode ??= n;
+        recordBuilderTarget(n, stmt);
+        leafSpans.push({ start: n.getStart(ctx.sourceFile), end: n.getEnd() });
+        const ir = transformNode(n, ctx);
+        if (ir && preambleFragmentNeedsWiring(ir))
+          refusalNode ??= n;
+        leafIrs.push(ir ?? { type: "text", value: "", loc: getSourceLocation(n, ctx.sourceFile, ctx.filePath) });
+        return;
+      }
+      const inTemplate = underTemplate || import_typescript11.default.isTemplateExpression(n) || import_typescript11.default.isTaggedTemplateExpression(n);
+      n.forEachChild((c) => collect(c, inTemplate));
+    };
+    collect(stmt, false);
+    const raw0 = stmt.getText(ctx.sourceFile);
+    typedParts.push(raw0.endsWith(";") ? raw0 : raw0 + ";");
+    if (leafSpans.length === 0) {
+      const js0 = ctx.getJS(stmt);
+      const tjs0 = ctx.getTemplateJS(stmt);
+      const js = (js0.endsWith(";") ? js0 : js0 + ";") + " ";
+      const tjs = (tjs0.endsWith(";") ? tjs0 : tjs0 + ";") + " ";
+      segments.push(tjs !== js ? { kind: "js", text: js, templateText: tjs } : { kind: "js", text: js });
+      continue;
+    }
+    const pieces = reconstructAsSegments(stmt, ctx.sourceFile, ctx.analyzer.typeExcludeRanges, leafSpans);
+    for (const piece of pieces) {
+      if ("marker" in piece) {
+        segments.push({ kind: "jsx", ir: leafIrs[piece.marker] });
+      } else {
+        const tpl = rewriteBarePropRefs2(piece.js, stmt, ctx);
+        segments.push(tpl !== undefined && tpl !== piece.js ? { kind: "js", text: piece.js, templateText: tpl } : { kind: "js", text: piece.js });
+      }
+    }
+    const sep2 = raw0.endsWith(";") ? " " : "; ";
+    segments.push({ kind: "js", text: sep2 });
+  }
+  return {
+    preamble: {
+      segments: trimPreambleSegments(segments),
+      ssrText: tsxSourceText(typedParts.join(" ")),
+      declaredNames: [...declared],
+      builderNames: [...builders]
+    },
+    refusalNode
   };
 }
 function collectNestedComponents(nodes) {
@@ -197726,6 +198059,7 @@ class BaseAdapter {
 // ../jsx/src/adapters/jsx-adapter.ts
 class JsxAdapter extends BaseAdapter {
   componentName = "";
+  acceptsCallbackBody = () => true;
   formatImportSpecifiers(specifiers) {
     const defaultSpec = specifiers.find((s) => s.isDefault);
     const namespaceSpec = specifiers.find((s) => s.isNamespace);
@@ -198071,6 +198405,10 @@ export default ${this.componentName}` : "";
     const indexParam = loop.index ? `, ${loop.index}` : "";
     const children = this.renderChildren(loop.children);
     const safeChildren = children.startsWith("{") ? `<>${children}</>` : children;
+    const preamble = loop.preamble?.ssrText;
+    if (preamble) {
+      return `{${loop.array}.map((${loop.param}${indexParam}) => { ${preamble} return ${safeChildren} })}`;
+    }
     return `{${loop.array}.map((${loop.param}${indexParam}) => ${safeChildren})}`;
   }
   renderComponent(comp) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/test",
-  "version": "0.26.2",
+  "version": "0.26.3",
   "description": "Test utilities for BarefootJS - IR-based component testing without a browser",
   "type": "module",
   "main": "./dist/index.js",
@@ -39,7 +39,7 @@
     "directory": "packages/test"
   },
   "dependencies": {
-    "@barefootjs/jsx": "0.26.2"
+    "@barefootjs/jsx": "0.26.3"
   },
   "devDependencies": {
     "typescript": "^5.0.0"