@barefootjs/jsx 0.28.1 → 0.29.0

package/dist/index.js

@@ -14046,7 +14046,7 @@ function emitTemplateCloneLines(template, indent) {
   ];
 }
 function emitLoopItemElementSetup(lines, opts) {
-  const { template, bodyIsMultiRoot, indent, singleRootLayout } = opts;
+  const { template, bodyIsMultiRoot, indent, singleRootLayout, mountRow } = opts;
   const innerIndent = indent + "  ";
   if (bodyIsMultiRoot) {
     lines.push(`${indent}let __el, __extras`);
@@ -14057,18 +14057,21 @@ function emitLoopItemElementSetup(lines, opts) {
       lines.push(ln);
     }
     lines.push(`${innerIndent}__el.__bfExtras = __extras`);
+    if (mountRow)
+      lines.push(`${innerIndent}mountRowRoot(__el)`);
     lines.push(`${indent}}`);
     return;
   }
   if (singleRootLayout === "inline") {
     const cloneExpr = emitTemplateCloneInline(template);
-    lines.push(`${indent}const __el = __existing ?? (() => { ${cloneExpr} })()`);
+    const clone = `__existing ?? (() => { ${cloneExpr} })()`;
+    lines.push(`${indent}const __el = ${mountRow ? `__existing ?? mountRowRoot((() => { ${cloneExpr} })())` : clone}`);
     return;
   }
-  lines.push(`${indent}const __el = __existing ?? (() => {`);
+  lines.push(`${indent}const __el = __existing ?? ${mountRow ? "mountRowRoot(" : ""}(() => {`);
   for (const ln of emitTemplateCloneLines(template, innerIndent))
     lines.push(ln);
-  lines.push(`${indent}})()`);
+  lines.push(`${indent}})()${mountRow ? ")" : ""}`);
 }
 function emitMultiRootTemplateCloneLines(template, indent, varEl, varExtras) {
   const isSvg = multiRootTemplateNeedsSvgWrap(template);
@@ -15296,6 +15299,10 @@ function isValueReferenceIdentifier(id) {
   if ((ts13.isMethodDeclaration(parent) || ts13.isGetAccessorDeclaration(parent) || ts13.isSetAccessorDeclaration(parent)) && parent.name === id) {
     return false;
   }
+  if (ts13.isPropertyDeclaration(parent) && parent.name === id)
+    return false;
+  if (ts13.isMetaProperty(parent) && parent.name === id)
+    return false;
   if (ts13.isVariableDeclaration(parent) && parent.name === id)
     return false;
   if (ts13.isFunctionDeclaration(parent) && parent.name === id)
@@ -15369,6 +15376,7 @@ var RUNTIME_IMPORT_CANDIDATES = [
   "registerTemplate",
   "initChild",
   "upsertChild",
+  "mountRowRoot",
   "createPortal",
   "provideContext",
   "createContext",
@@ -20227,7 +20235,8 @@ function stringifyCompositeLoop(lines, plan) {
     template,
     bodyIsMultiRoot,
     indent: bodyIndent,
-    singleRootLayout: "multiline"
+    singleRootLayout: "multiline",
+    mountRow: true
   });
   emitComponentAndEventSetup(lines, bodyIndent, "__el", compsArr, eventsArr, loopParam, loopParamBindings, bodyIsMultiRoot);
   if (innerLoops.length > 0) {

package/dist/ir-to-client-js/control-flow/stringify/composite-loop.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"composite-loop.d.ts","sourceRoot":"","sources":["../../../../src/ir-to-client-js/control-flow/stringify/composite-loop.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAOH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEzD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,iBAAiB,GAAG,IAAI,CAuGrF"}
+{"version":3,"file":"composite-loop.d.ts","sourceRoot":"","sources":["../../../../src/ir-to-client-js/control-flow/stringify/composite-loop.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAOH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEzD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,iBAAiB,GAAG,IAAI,CA2GrF"}

package/dist/ir-to-client-js/control-flow/stringify/template-parse.d.ts

@@ -125,6 +125,20 @@ export declare function emitLoopItemElementSetup(lines: string[], opts: {
     indent: string;
     /** Single-root layout: 'inline' (plain / branch-plain) or 'multiline' (composite). */
     singleRootLayout: 'inline' | 'multiline';
+    /**
+     * Emit `mountRowRoot(__el)` on the FRESH branch, connecting the row at the
+     * mount point `mapArray` handed down before the body's tail runs.
+     *
+     * Only bodies that initialise something inside the row need it — the tail
+     * is where `useContext` would otherwise resolve against a detached element
+     * and fall through to the global last-writer-wins store. A row with no
+     * nested init has nothing to resolve, so plain loops leave this off and
+     * their emission (and the `mapArrayLazy` measurements) are untouched.
+     *
+     * Never on the hydration branch: that row came from SSR markup and is in
+     * the document already.
+     */
+    mountRow?: boolean;
 }): void;
 /**
  * Multi-root template clone for loop bodies that emit a JSX Fragment with

package/dist/ir-to-client-js/control-flow/stringify/template-parse.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"template-parse.d.ts","sourceRoot":"","sources":["../../../../src/ir-to-client-js/control-flow/stringify/template-parse.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAkBH;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAsB3D;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,6BAA6B,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAIvE;AAkDD;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAKhE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAKvH;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,GAAG,MAAM,CAIjF;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAajF;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,MAAM,EAAE,EACf,IAAI,EAAE;IACJ,QAAQ,EAAE,MAAM,CAAA;IAChB,eAAe,EAAE,OAAO,CAAA;IACxB,MAAM,EAAE,MAAM,CAAA;IACd,sFAAsF;IACtF,gBAAgB,EAAE,QAAQ,GAAG,WAAW,CAAA;CACzC,GACA,IAAI,CAuBN;AAED;;;;;;;;;GASG;AACH,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,MAAM,GAChB,MAAM,EAAE,CAeV"}
+{"version":3,"file":"template-parse.d.ts","sourceRoot":"","sources":["../../../../src/ir-to-client-js/control-flow/stringify/template-parse.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAkBH;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAsB3D;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,6BAA6B,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAIvE;AAkDD;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAKhE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAKvH;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,MAAM,GAAG,MAAM,CAIjF;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAajF;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,MAAM,EAAE,EACf,IAAI,EAAE;IACJ,QAAQ,EAAE,MAAM,CAAA;IAChB,eAAe,EAAE,OAAO,CAAA;IACxB,MAAM,EAAE,MAAM,CAAA;IACd,sFAAsF;IACtF,gBAAgB,EAAE,QAAQ,GAAG,WAAW,CAAA;IACxC;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GACA,IAAI,CA4BN;AAED;;;;;;;;;GASG;AACH,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,MAAM,GAChB,MAAM,EAAE,CAeV"}

package/dist/ir-to-client-js/imports.d.ts

@@ -2,9 +2,9 @@
  * Import detection and DOM import management.
  */
 import type { ComponentIR } from '../types.ts';
-export declare const RUNTIME_IMPORT_CANDIDATES: readonly ['createSignal', 'createMemo', 'createEffect', 'onCleanup', 'onMount', 'hydrate', 'insert', 'getLoopChildren', 'getLoopNodes', 'mapArray', 'mapArrayAnchored', 'mapArrayLazy', 'patchLeaf', 'createDisposableEffect', 'createComponent', 'renderChild', 'registerComponent', 'registerTemplate', 'initChild', 'upsertChild', 'createPortal', 'provideContext', 'createContext', 'useContext', 'forwardProps', 'applyRestAttrs', 'splitProps', 'spreadAttrs', 'styleToCss', 'escapeAttr', 'escapeText', 'escapeTextOrNode', 'qsa', 'qsaItem', 'qsaChildScope', 'qsaChildScopes', 'upsertChildItem', '__slot', '__bfSlot', '__bfText', 'claimSlots', 'lazySlots', 'lazyClaimSlots', 'textOrNode', 'beginTurn', 'endTurn', 'date', 'formatDate'];
+export declare const RUNTIME_IMPORT_CANDIDATES: readonly ['createSignal', 'createMemo', 'createEffect', 'onCleanup', 'onMount', 'hydrate', 'insert', 'getLoopChildren', 'getLoopNodes', 'mapArray', 'mapArrayAnchored', 'mapArrayLazy', 'patchLeaf', 'createDisposableEffect', 'createComponent', 'renderChild', 'registerComponent', 'registerTemplate', 'initChild', 'upsertChild', 'mountRowRoot', 'createPortal', 'provideContext', 'createContext', 'useContext', 'forwardProps', 'applyRestAttrs', 'splitProps', 'spreadAttrs', 'styleToCss', 'escapeAttr', 'escapeText', 'escapeTextOrNode', 'qsa', 'qsaItem', 'qsaChildScope', 'qsaChildScopes', 'upsertChildItem', '__slot', '__bfSlot', '__bfText', 'claimSlots', 'lazySlots', 'lazyClaimSlots', 'textOrNode', 'beginTurn', 'endTurn', 'date', 'formatDate'];
 /** @deprecated Use RUNTIME_IMPORT_CANDIDATES */
-export declare const DOM_IMPORT_CANDIDATES: readonly ["createSignal", "createMemo", "createEffect", "onCleanup", "onMount", "hydrate", "insert", "getLoopChildren", "getLoopNodes", "mapArray", "mapArrayAnchored", "mapArrayLazy", "patchLeaf", "createDisposableEffect", "createComponent", "renderChild", "registerComponent", "registerTemplate", "initChild", "upsertChild", "createPortal", "provideContext", "createContext", "useContext", "forwardProps", "applyRestAttrs", "splitProps", "spreadAttrs", "styleToCss", "escapeAttr", "escapeText", "escapeTextOrNode", "qsa", "qsaItem", "qsaChildScope", "qsaChildScopes", "upsertChildItem", "__slot", "__bfSlot", "__bfText", "claimSlots", "lazySlots", "lazyClaimSlots", "textOrNode", "beginTurn", "endTurn", "date", "formatDate"];
+export declare const DOM_IMPORT_CANDIDATES: readonly ["createSignal", "createMemo", "createEffect", "onCleanup", "onMount", "hydrate", "insert", "getLoopChildren", "getLoopNodes", "mapArray", "mapArrayAnchored", "mapArrayLazy", "patchLeaf", "createDisposableEffect", "createComponent", "renderChild", "registerComponent", "registerTemplate", "initChild", "upsertChild", "mountRowRoot", "createPortal", "provideContext", "createContext", "useContext", "forwardProps", "applyRestAttrs", "splitProps", "spreadAttrs", "styleToCss", "escapeAttr", "escapeText", "escapeTextOrNode", "qsa", "qsaItem", "qsaChildScope", "qsaChildScopes", "upsertChildItem", "__slot", "__bfSlot", "__bfText", "claimSlots", "lazySlots", "lazyClaimSlots", "textOrNode", "beginTurn", "endTurn", "date", "formatDate"];
 export declare const RUNTIME_MODULE = "@barefootjs/client/runtime";
 export declare const IMPORT_PLACEHOLDER = "/* __BAREFOOTJS_DOM_IMPORTS__ */";
 export declare const MODULE_CONSTANTS_PLACEHOLDER = "/* __MODULE_LEVEL_CONSTANTS__ */";

package/dist/ir-to-client-js/imports.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"imports.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/imports.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAU,MAAM,aAAa,CAAA;AAKtD,eAAO,MAAM,yBAAyB,YACpC,cAAc,EAAE,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,SAAS,EACpE,SAAS,EAAE,QAAQ,EAAE,iBAAiB,EAAE,cAAc,EAAE,UAAU,EAAE,kBAAkB,EAAE,cAAc,EAAE,WAAW,EAAE,wBAAwB,EAC7I,iBAAiB,EAAE,aAAa,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,WAAW,EAAE,aAAa,EACrG,cAAc,EACd,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAC/C,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAC3H,KAAK,EAAE,SAAS,EAAE,eAAe,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAUxG,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,YAAY,EAEzD,WAAW,EAAE,SAAS,EAItB,MAAM,EAIN,YAAY,CACJ,CAAA;AAEV,gDAAgD;AAChD,eAAO,MAAM,qBAAqB,wtBAA4B,CAAA;AAE9D,eAAO,MAAM,cAAc,+BAA+B,CAAA;AAE1D,eAAO,MAAM,kBAAkB,qCAAqC,CAAA;AACpE,eAAO,MAAM,4BAA4B,qCAAqC,CAAA;AAE9E;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAqB3D;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,WAAW,GAAG,MAAM,EAAE,CAoB/D;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,kBAAkB,CAAC,aAAa,EAAE,MAAM,GAAG,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAWxF;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,mBAAmB,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,CAsCvH"}
+{"version":3,"file":"imports.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/imports.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAU,MAAM,aAAa,CAAA;AAKtD,eAAO,MAAM,yBAAyB,YACpC,cAAc,EAAE,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,SAAS,EACpE,SAAS,EAAE,QAAQ,EAAE,iBAAiB,EAAE,cAAc,EAAE,UAAU,EAAE,kBAAkB,EAAE,cAAc,EAAE,WAAW,EAAE,wBAAwB,EAC7I,iBAAiB,EAAE,aAAa,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,WAAW,EAAE,aAAa,EAKrG,cAAc,EACd,cAAc,EACd,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAC/C,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAC3H,KAAK,EAAE,SAAS,EAAE,eAAe,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAUxG,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,YAAY,EAEzD,WAAW,EAAE,SAAS,EAItB,MAAM,EAIN,YAAY,CACJ,CAAA;AAEV,gDAAgD;AAChD,eAAO,MAAM,qBAAqB,wuBAA4B,CAAA;AAE9D,eAAO,MAAM,cAAc,+BAA+B,CAAA;AAE1D,eAAO,MAAM,kBAAkB,qCAAqC,CAAA;AACpE,eAAO,MAAM,4BAA4B,qCAAqC,CAAA;AAE9E;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAqB3D;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,WAAW,GAAG,MAAM,EAAE,CAoB/D;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,kBAAkB,CAAC,aAAa,EAAE,MAAM,GAAG,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAWxF;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,mBAAmB,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,EAAE,CAsCvH"}

package/dist/value-references.d.ts

@@ -24,13 +24,26 @@ import ts from 'typescript';
  * A ShorthandPropertyAssignment (`{ Theme }`) intentionally counts as a
  * reference — it reads the binding, it doesn't just spell its name.
  *
+ * CONTRACT: this classifies identifier positions in **JavaScript** source.
+ * Both current callers parse with `ts.ScriptKind.JS` —
+ * `collectValueReferencedNames` below, and `detectStrippedReferences` in
+ * `packages/cli/src/lib/resolve-imports.ts`, which parses the assembled
+ * bundle. TypeScript-only positions are deliberately NOT handled: an
+ * identifier in a type position (`const x: Foo = …`, a
+ * `TypeReferenceNode`) is still reported as a value reference, and so are
+ * `interface` / `type` / `enum` declaration names. Do not point this at
+ * TypeScript source — it would over-report there.
+ *
  * Caveat: this is a syntactic test, not a scope analysis. If a local
  * function parameter happens to share a name with an imported binding,
  * references inside that function's body will count as references to
- * the import (false positive). Acceptable: over-counting a reference
- * just means we keep an import we didn't strictly need, which is a
- * strict improvement over the alternative failure direction (dropping a
- * needed import and producing a `ReferenceError`).
+ * the import (false positive). For the import-emission caller
+ * (`makeValueUsageTest` in `ir-to-client-js/imports.ts`), over-counting is
+ * the safe direction — an extra import whose binding exists is harmless.
+ * It is NOT safe for the BF053 caller (`detectStrippedReferences`): there,
+ * an over-reported reference to a stripped binding is a false build
+ * error on legal code. That asymmetry is why every exclusion branch below
+ * matters — each one is a case that would otherwise misfire BF053.
  */
 export declare function isValueReferenceIdentifier(id: ts.Identifier): boolean;
 /**

package/dist/value-references.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"value-references.d.ts","sourceRoot":"","sources":["../src/value-references.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,0BAA0B,CAAC,EAAE,EAAE,EAAE,CAAC,UAAU,GAAG,OAAO,CAgCrE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,2BAA2B,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,GAAG,IAAI,CA0B5E"}
+{"version":3,"file":"value-references.d.ts","sourceRoot":"","sources":["../src/value-references.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,0BAA0B,CAAC,EAAE,EAAE,EAAE,CAAC,UAAU,GAAG,OAAO,CAyCrE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,2BAA2B,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,GAAG,IAAI,CA0B5E"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/jsx",
-  "version": "0.28.1",
+  "version": "0.29.0",
   "description": "JSX compiler for BarefootJS - transforms JSX to server HTML + client JS",
   "type": "module",
   "main": "./dist/index.js",
@@ -53,7 +53,7 @@
     "directory": "packages/jsx"
   },
   "dependencies": {
-    "@barefootjs/shared": "0.28.1"
+    "@barefootjs/shared": "0.29.0"
   },
   "peerDependencies": {
     "@barefootjs/client": ">=0.2.0",

package/src/__tests__/ir-to-client-js/imports.test.ts

@@ -310,6 +310,24 @@ describe('collectExternalImports', () => {
     const result = collectExternalImports(ir, code)
     expect(result).toEqual(["import { 日本語 } from 'some-lib'"])
   })
+
+  // #2432 follow-up: a class field name is a member key, not a read — the
+  // same treatment as an object-literal key above.
+  test('a specifier that appears ONLY as a class field name is not emitted (#2432 follow-up)', () => {
+    const ir = makeIR([makeImport('./utils', ['helper'])])
+    const code = 'class Widget { helper = 1 }'
+    const result = collectExternalImports(ir, code)
+    expect(result).toEqual([])
+  })
+
+  // #2432 follow-up: a COMPUTED class field name (`[helper]`) IS a read of
+  // the binding — pins that the class-field exclusion didn't over-exclude.
+  test('a specifier that appears as a COMPUTED class field name IS emitted (#2432 follow-up)', () => {
+    const ir = makeIR([makeImport('./utils', ['helper'])])
+    const code = 'class Widget { [helper] = 1 }'
+    const result = collectExternalImports(ir, code)
+    expect(result).toEqual(["import { helper } from './utils'"])
+  })
 })
 
 describe('collectUserDomImports', () => {

package/src/__tests__/loop-row-creation-paths.test.ts

@@ -0,0 +1,169 @@
+/**
+ * Which code creates a loop row's root element, and whether that row is
+ * connected before its body's tail runs.
+ *
+ * The "connect before init" invariant exists because `useContext` resolves by
+ * walking `parentElement`: a child that initialises inside a detached row finds
+ * no ancestors and falls through to the global last-writer-wins context store,
+ * silently reading whichever provider on the page wrote last. So the creation
+ * site has to know its destination in advance, and there are two ways to tell
+ * it — a PLACEHOLDER already in the tree (`mountAt`, child slots), or the
+ * AMBIENT row mount point.
+ *
+ * Both work because a runtime FUNCTION creates the element and can take an
+ * argument. A row whose root is a template clone written inline in the emitted
+ * body has no such function, so the compiler emits `mountRowRoot(clone)` to
+ * consume the same ambient point — but only for the variant that initialises
+ * anything inside the row. A row with no nested init has nothing that could
+ * resolve wrongly, and skipping it there keeps the high-volume `mapArrayLazy`
+ * emission untouched.
+ *
+ * This matrix pins that split against compiled output rather than
+ * recollection. `mountsRow` is the load-bearing column: if it ever flips to
+ * false for a shape that initialises a child, that shape has silently gone
+ * back to initialising detached, and nothing else in the suite would say so —
+ * the wrong value it produces is only wrong when a second provider of the same
+ * context happens to be on the page.
+ */
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+interface RowShape {
+  /** How the row's root element comes into existence. */
+  rowRoot: 'createComponent' | 'template-clone'
+  /**
+   * Does a child inside the row reach its `init` through a placeholder slot
+   * (`upsertChild` / `upsertChildItem`)?
+   *
+   * Narrower than "something initialises in this row" — a conditional child
+   * arrives via `insert` + `initChild` and reads false here. Read it alongside
+   * `mountsRow`, never as a substitute.
+   *
+   * `initChild` on the row ROOT is deliberately excluded: that is the
+   * hydration branch adopting an SSR-rendered row, which is in the document by
+   * construction and never part of this problem.
+   */
+  nestedChildInit: boolean
+  /** Multi-root (Fragment) body — the sibling-walk lookup path. */
+  multiRoot: boolean
+  /** Is the fresh row connected before the body's tail runs? */
+  mountsRow: boolean
+  /** Which list runtime the loop compiles to. */
+  loopRuntime: string
+}
+
+function classify(loopBody: string): RowShape {
+  const source = `"use client"
+import { createSignal } from '@barefootjs/client'
+import { Chip } from './chip'
+function T() {
+  const [items] = createSignal([{ id: '1', name: 'a' }])
+  return <ul>{items().map((it) => ${loopBody})}</ul>
+}
+export { T }`
+  const result = compileJSX(source, 'T.tsx', { adapter: new TestAdapter() })
+  const hard = result.errors.filter((e) => e.severity !== 'warning')
+  if (hard.length > 0) throw new Error(`unexpected compile error: ${hard.map((e) => e.code).join(',')}`)
+  const js = result.files.find((f) => f.type === 'clientJs')?.content ?? ''
+
+  // Slice from the list call to the end of the emitted init function.
+  // Everything the row does at setup time is in there, and the top-level
+  // `createComponent('T', …)` export sits after it, so it cannot be mistaken
+  // for a row root. Starting at the call also excludes the import line, so
+  // `mountsRow` reflects a real call site rather than the import of one.
+  const call = /mapArray(?:Lazy|Anchored)?\(/.exec(js)
+  if (!call) throw new Error('no list runtime call emitted')
+  const hydrateAt = js.indexOf('\nhydrate(')
+  const region = js.slice(call.index, hydrateAt === -1 ? undefined : hydrateAt)
+
+  return {
+    rowRoot: /cloneNode\(/.test(region) ? 'template-clone' : 'createComponent',
+    nestedChildInit: /upsertChild\(|upsertChildItem\(/.test(region),
+    multiRoot: /__bfExtras|upsertChildItem\(|qsaItem\(/.test(region),
+    mountsRow: /mountRowRoot\(/.test(region),
+    loopRuntime: /mapArray(?:Lazy|Anchored)?/.exec(region)?.[0] ?? 'unknown',
+  }
+}
+
+describe('loop row creation paths — who makes the row root, and when it is connected', () => {
+  test('component row root: the runtime creates it, so it takes the mount point itself', () => {
+    // `<Chip/>` IS the row. `createComponent` consumes the ambient point in its
+    // own step 7b, so no separate call is emitted.
+    expect(classify('<Chip key={it.id} id={it.id} />')).toEqual({
+      rowRoot: 'createComponent',
+      nestedChildInit: false,
+      multiRoot: false,
+      mountsRow: false,
+      loopRuntime: 'mapArray',
+    })
+  })
+
+  test('markup row root with no component inside: a clone, and deliberately not mounted', () => {
+    // Nothing initialises inside this row, so there is no `useContext` call
+    // during setup to resolve wrongly — and this is the high-volume path, so
+    // leaving it alone keeps the `mapArrayLazy` emission and the measurements
+    // taken against it untouched. `mountsRow: false` here is a decision.
+    expect(classify('<li key={it.id}>{it.name}</li>')).toEqual({
+      rowRoot: 'template-clone',
+      nestedChildInit: false,
+      multiRoot: false,
+      mountsRow: false,
+      loopRuntime: 'mapArrayLazy',
+    })
+  })
+
+  test('markup row root with a nested component: clone, mounted before the tail', () => {
+    // The row root is user markup, so it is not and cannot become a component;
+    // `mountRowRoot` is what gives it a destination. Flip `mountsRow` to false
+    // and `upsertChild` goes back to running the child's `init` against a
+    // detached element.
+    expect(classify('<li key={it.id}><Chip id={it.id} /></li>')).toEqual({
+      rowRoot: 'template-clone',
+      nestedChildInit: true,
+      multiRoot: false,
+      mountsRow: true,
+      loopRuntime: 'mapArray',
+    })
+  })
+
+  test('two nested components in one markup row: same case, one mount', () => {
+    expect(classify('<li key={it.id}><Chip id={it.id} /><Chip id={it.name} /></li>')).toEqual({
+      rowRoot: 'template-clone',
+      nestedChildInit: true,
+      multiRoot: false,
+      mountsRow: true,
+      loopRuntime: 'mapArray',
+    })
+  })
+
+  test('Fragment row with a nested component: mounted, and the multi-root lookup copes', () => {
+    // A Fragment root can never be a component, so this shape only became
+    // reachable for a mount point once the clone path got one. It is also the
+    // multi-root lookup, whose sibling walk in `qsa-item.ts` used to end with
+    // `return` and skip the `__bfExtras` stash the moment the primary was
+    // attached — a `break` now, so an attached primary still finds its extras.
+    expect(classify('<><Chip id={it.id} /><span>{it.name}</span></>')).toEqual({
+      rowRoot: 'template-clone',
+      nestedChildInit: true,
+      multiRoot: true,
+      mountsRow: true,
+      loopRuntime: 'mapArray',
+    })
+  })
+
+  test('conditional child in a markup row: mounted, though it inits through `insert`', () => {
+    // `nestedChildInit` is false because this child arrives via `insert` +
+    // `initChild` rather than `upsertChild` — but it is still a child
+    // initialising inside the row, and the emission is keyed on the loop
+    // variant (composite), not on which call the child arrives through. This
+    // row is why the two columns have to be read separately.
+    expect(classify('<li key={it.id}>{it.name ? <Chip id={it.id} /> : null}</li>')).toEqual({
+      rowRoot: 'template-clone',
+      nestedChildInit: false,
+      multiRoot: false,
+      mountsRow: true,
+      loopRuntime: 'mapArray',
+    })
+  })
+})

package/src/__tests__/value-references.test.ts

@@ -0,0 +1,88 @@
+/**
+ * Tests for `packages/jsx/src/value-references.ts` — the single-door
+ * "is this identifier a VALUE reference" classifier shared by
+ * `collectExternalImports` (jsx) and `detectStrippedReferences` (cli).
+ *
+ * There was no direct test file for this module before this one. It was
+ * added as a follow-up to #2432: a Copilot review on the original PR
+ * flagged that `ts.PropertyDeclaration` (class field) names were not
+ * excluded, so a class field like `helper` in `class C { helper = 1 }`
+ * was misclassified as a value reference. Harmless for the jsx-side
+ * caller (an extra kept import), but a false BF053 build error for the
+ * cli-side caller when the same name is a stripped import binding.
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { collectValueReferencedNames } from '../value-references'
+
+describe('collectValueReferencedNames', () => {
+  test('class field name only is NOT a reference', () => {
+    const result = collectValueReferencedNames('class C { helper = 1 }')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(false)
+  })
+
+  test('static class field name only is NOT a reference', () => {
+    const result = collectValueReferencedNames('class C { static helper = 1 }')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(false)
+  })
+
+  test('computed class field name IS a reference (does not over-exclude)', () => {
+    const result = collectValueReferencedNames('class C { [helper] = 1 }')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(true)
+  })
+
+  test('class method name is NOT a reference', () => {
+    const result = collectValueReferencedNames('class C { helper() {} }')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(false)
+  })
+
+  test('object-literal key is NOT a reference', () => {
+    const result = collectValueReferencedNames('const o = { helper: 1 };')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(false)
+  })
+
+  test('property access name is NOT a reference', () => {
+    const result = collectValueReferencedNames('obj.helper();')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(false)
+  })
+
+  test('shorthand property IS a reference (reads the binding)', () => {
+    const result = collectValueReferencedNames('const o = { helper };')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(true)
+  })
+
+  test('a genuine call IS a reference', () => {
+    const result = collectValueReferencedNames('helper();')
+    expect(result).not.toBeNull()
+    expect(result?.has('helper')).toBe(true)
+  })
+
+  test('new.target: "target" is NOT a reference', () => {
+    const result = collectValueReferencedNames('function f() { return new.target; }')
+    expect(result).not.toBeNull()
+    expect(result?.has('target')).toBe(false)
+  })
+
+  // Both halves of the MetaProperty exclusion are pinned: `new.target`
+  // above, and `import.meta` here — the one Copilot flagged as uncovered
+  // on #2439. `import.meta.url` also incidentally covers the
+  // property-access half (`url` is excluded too).
+  test('import.meta: "meta" is NOT a reference', () => {
+    const result = collectValueReferencedNames('const u = import.meta.url;')
+    expect(result).not.toBeNull()
+    expect(result?.has('meta')).toBe(false)
+    expect(result?.has('url')).toBe(false)
+  })
+
+  test('unparseable text returns null ("cannot answer")', () => {
+    const result = collectValueReferencedNames('const x = ;;; {{{ ]]]')
+    expect(result).toBeNull()
+  })
+})

package/src/ir-to-client-js/control-flow/stringify/composite-loop.ts

@@ -119,6 +119,10 @@ export function stringifyCompositeLoop(lines: string[], plan: CompositeLoopPlan)
     bodyIsMultiRoot,
     indent: bodyIndent,
     singleRootLayout: 'multiline',
+    // Composite is exactly the variant that initialises something inside the
+    // row — nested components, inner loops, or both — so it is exactly the
+    // variant whose tail needs the row already connected.
+    mountRow: true,
   })
   emitComponentAndEventSetup(lines, bodyIndent, '__el', compsArr, eventsArr, loopParam, loopParamBindings, bodyIsMultiRoot)
   if (innerLoops.length > 0) {

package/src/ir-to-client-js/control-flow/stringify/template-parse.ts

@@ -251,9 +251,23 @@ export function emitLoopItemElementSetup(
     indent: string
     /** Single-root layout: 'inline' (plain / branch-plain) or 'multiline' (composite). */
     singleRootLayout: 'inline' | 'multiline'
+    /**
+     * Emit `mountRowRoot(__el)` on the FRESH branch, connecting the row at the
+     * mount point `mapArray` handed down before the body's tail runs.
+     *
+     * Only bodies that initialise something inside the row need it — the tail
+     * is where `useContext` would otherwise resolve against a detached element
+     * and fall through to the global last-writer-wins store. A row with no
+     * nested init has nothing to resolve, so plain loops leave this off and
+     * their emission (and the `mapArrayLazy` measurements) are untouched.
+     *
+     * Never on the hydration branch: that row came from SSR markup and is in
+     * the document already.
+     */
+    mountRow?: boolean
   },
 ): void {
-  const { template, bodyIsMultiRoot, indent, singleRootLayout } = opts
+  const { template, bodyIsMultiRoot, indent, singleRootLayout, mountRow } = opts
   const innerIndent = indent + '  '
   if (bodyIsMultiRoot) {
     lines.push(`${indent}let __el, __extras`)
@@ -264,17 +278,22 @@ export function emitLoopItemElementSetup(
       lines.push(ln)
     }
     lines.push(`${innerIndent}__el.__bfExtras = __extras`)
+    // After the stash: `mountRowRoot` attaches the primary, and an attached
+    // primary makes `itemRootElements`' sibling walk the first thing a lookup
+    // sees — it must find the stash already in place behind it.
+    if (mountRow) lines.push(`${innerIndent}mountRowRoot(__el)`)
     lines.push(`${indent}}`)
     return
   }
   if (singleRootLayout === 'inline') {
     const cloneExpr = emitTemplateCloneInline(template)
-    lines.push(`${indent}const __el = __existing ?? (() => { ${cloneExpr} })()`)
+    const clone = `__existing ?? (() => { ${cloneExpr} })()`
+    lines.push(`${indent}const __el = ${mountRow ? `__existing ?? mountRowRoot((() => { ${cloneExpr} })())` : clone}`)
     return
   }
-  lines.push(`${indent}const __el = __existing ?? (() => {`)
+  lines.push(`${indent}const __el = __existing ?? ${mountRow ? 'mountRowRoot(' : ''}(() => {`)
   for (const ln of emitTemplateCloneLines(template, innerIndent)) lines.push(ln)
-  lines.push(`${indent}})()`)
+  lines.push(`${indent}})()${mountRow ? ')' : ''}`)
 }
 
 /**

package/src/ir-to-client-js/imports.ts

@@ -11,6 +11,11 @@ export const RUNTIME_IMPORT_CANDIDATES = [
   'createSignal', 'createMemo', 'createEffect', 'onCleanup', 'onMount',
   'hydrate', 'insert', 'getLoopChildren', 'getLoopNodes', 'mapArray', 'mapArrayAnchored', 'mapArrayLazy', 'patchLeaf', 'createDisposableEffect',
   'createComponent', 'renderChild', 'registerComponent', 'registerTemplate', 'initChild', 'upsertChild',
+  // Connects a template-clone loop row before the body's tail runs, so a child
+  // that inits inside it resolves context against real ancestors rather than
+  // falling through to the global store. The clone-root counterpart of the
+  // mount point `createComponent` consumes for component-root rows.
+  'mountRowRoot',
   'createPortal',
   'provideContext', 'createContext', 'useContext',
   'forwardProps', 'applyRestAttrs', 'splitProps', 'spreadAttrs', 'styleToCss', 'escapeAttr', 'escapeText', 'escapeTextOrNode',

package/src/value-references.ts

@@ -26,13 +26,26 @@ import ts from 'typescript'
  * A ShorthandPropertyAssignment (`{ Theme }`) intentionally counts as a
  * reference — it reads the binding, it doesn't just spell its name.
  *
+ * CONTRACT: this classifies identifier positions in **JavaScript** source.
+ * Both current callers parse with `ts.ScriptKind.JS` —
+ * `collectValueReferencedNames` below, and `detectStrippedReferences` in
+ * `packages/cli/src/lib/resolve-imports.ts`, which parses the assembled
+ * bundle. TypeScript-only positions are deliberately NOT handled: an
+ * identifier in a type position (`const x: Foo = …`, a
+ * `TypeReferenceNode`) is still reported as a value reference, and so are
+ * `interface` / `type` / `enum` declaration names. Do not point this at
+ * TypeScript source — it would over-report there.
+ *
  * Caveat: this is a syntactic test, not a scope analysis. If a local
  * function parameter happens to share a name with an imported binding,
  * references inside that function's body will count as references to
- * the import (false positive). Acceptable: over-counting a reference
- * just means we keep an import we didn't strictly need, which is a
- * strict improvement over the alternative failure direction (dropping a
- * needed import and producing a `ReferenceError`).
+ * the import (false positive). For the import-emission caller
+ * (`makeValueUsageTest` in `ir-to-client-js/imports.ts`), over-counting is
+ * the safe direction — an extra import whose binding exists is harmless.
+ * It is NOT safe for the BF053 caller (`detectStrippedReferences`): there,
+ * an over-reported reference to a stripped binding is a false build
+ * error on legal code. That asymmetry is why every exclusion branch below
+ * matters — each one is a case that would otherwise misfire BF053.
  */
 export function isValueReferenceIdentifier(id: ts.Identifier): boolean {
   const parent = id.parent
@@ -47,6 +60,15 @@ export function isValueReferenceIdentifier(id: ts.Identifier): boolean {
   ) {
     return false
   }
+  // Class field name (`class C { helper = 1 }`, including `static helper
+  // = 1`): the name is a member key, not a read. The `parent.name === id`
+  // guard is what preserves the computed case — in `class C { [helper] =
+  // 1 }` the name is a ComputedPropertyName, not `id` itself, so `helper`
+  // (inside the brackets) still falls through and counts as a reference.
+  if (ts.isPropertyDeclaration(parent) && parent.name === id) return false
+  // `new.target` / `import.meta`: `target`/`meta` sits in keyword
+  // position, not a binding.
+  if (ts.isMetaProperty(parent) && parent.name === id) return false
   if (ts.isVariableDeclaration(parent) && parent.name === id) return false
   if (ts.isFunctionDeclaration(parent) && parent.name === id) return false
   if (ts.isFunctionExpression(parent) && parent.name === id) return false