@barefootjs/jsx 0.31.7 → 0.31.8

package/dist/index.js

@@ -17006,6 +17006,13 @@ function csrInlinableConstantsFromCtx(ctx) {
   }
   return out;
 }
+function buildTemplateDefPart(ctx, templateHtml) {
+  const envDecls = ctx.signals.filter((s) => Boolean(s.envReader) && Boolean(s.envFactory)).map((s) => `const [${s.getter}] = ${s.envFactory}()`);
+  if (envDecls.length === 0) {
+    return `template: (${PROPS_PARAM}) => \`${templateHtml}\``;
+  }
+  return `template: (${PROPS_PARAM}) => { ${envDecls.join("; ")}; return \`${templateHtml}\` }`;
+}
 function emitRegistrationAndHydration(lines, ctx, _ir, graph, inlinability) {
   const name = ctx.componentName;
   lines.push(`}`);
@@ -17022,13 +17029,13 @@ function emitRegistrationAndHydration(lines, ctx, _ir, graph, inlinability) {
   if (canGenerateStaticTemplate(_ir.root, propNamesForStaticCheck, inlinableConstants, unsafeLocalNames)) {
     const templateHtml = irToComponentTemplate(_ir.root, inlinableConstants, restSpreadNames, ctx.propsObjectName);
     if (templateHtml) {
-      defParts.push(`template: (${PROPS_PARAM}) => \`${templateHtml}\``);
+      defParts.push(buildTemplateDefPart(ctx, templateHtml));
     }
   } else {
     const csrInlinableConstants = csrInlinableConstantsFromCtx(ctx);
     const templateHtml = generateCsrTemplate(_ir.root, csrInlinableConstants, ctx, restSpreadNames, ctx.propsObjectName, unsafeLocalNames, ctx.deferredChildSlots);
     if (templateHtml) {
-      defParts.push(`template: (${PROPS_PARAM}) => \`${templateHtml}\``);
+      defParts.push(buildTemplateDefPart(ctx, templateHtml));
     }
   }
   if (isCommentScope) {

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

@@ -1 +1 @@
-{"version":3,"file":"csr-substitute.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/csr-substitute.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAKH,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,iBAAiB;IAChC,cAAc,EAAE,MAAM,CAAA;IACtB,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CACrC;AAED;;;;;GAKG;AACH,MAAM,MAAM,kBAAkB,GAAG,GAAG,CAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC,CAAA;AAEtE;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,GAAG,YAAY,CAAA;IAC3B,sEAAsE;IACtE,WAAW,EAAE,MAAM,CAAA;IACnB,qFAAqF;IACrF,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CACrC;AAED,MAAM,WAAW,MAAM;IACrB;;;;;OAKG;IACH,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;IAC3C,4EAA4E;IAC5E,eAAe,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,cAAc,CAAC,EAAE,YAAY,GAC5B;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CAAE,CAmB7D;AAwMD;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAGtF;AAED,wBAAgB,8BAA8B,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAaxE;AAED;;;;;;;;GAQG;AACH,wBAAgB,uCAAuC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAUjF;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,sCAAsC,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAkBpF;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAQ/D;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,SAAS,UAAU,EAAE,EAC9B,KAAK,EAAE,SAAS,QAAQ,EAAE,EAC1B,eAAe,EAAE,MAAM,GAAG,IAAI,GAC7B,MAAM,CA2BR"}
+{"version":3,"file":"csr-substitute.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/csr-substitute.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAKH,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,iBAAiB;IAChC,cAAc,EAAE,MAAM,CAAA;IACtB,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CACrC;AAED;;;;;GAKG;AACH,MAAM,MAAM,kBAAkB,GAAG,GAAG,CAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC,CAAA;AAEtE;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,GAAG,YAAY,CAAA;IAC3B,sEAAsE;IACtE,WAAW,EAAE,MAAM,CAAA;IACnB,qFAAqF;IACrF,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CACrC;AAED,MAAM,WAAW,MAAM;IACrB;;;;;OAKG;IACH,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;IAC3C,4EAA4E;IAC5E,eAAe,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,cAAc,CAAC,EAAE,YAAY,GAC5B;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;CAAE,CAmB7D;AAwMD;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAGtF;AAED,wBAAgB,8BAA8B,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAaxE;AAED;;;;;;;;GAQG;AACH,wBAAgB,uCAAuC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAUjF;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,sCAAsC,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAkBpF;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAQ/D;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,SAAS,UAAU,EAAE,EAC9B,KAAK,EAAE,SAAS,QAAQ,EAAE,EAC1B,eAAe,EAAE,MAAM,GAAG,IAAI,GAC7B,MAAM,CA4BR"}

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

@@ -1 +1 @@
-{"version":3,"file":"emit-registration.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/emit-registration.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAc,MAAM,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AACnF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD;;;;;;;;;;;GAWG;AACH,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,UAAU,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAmD9G;AAED;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CACrC,GAAG,EAAE,eAAe,EACpB,KAAK,EAAE,eAAe,EACtB,MAAM,EAAE,MAAM,GACb;IACD,kBAAkB,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACvC,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CAC9B,CAGA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,4BAA4B,CAAC,GAAG,EAAE,eAAe,GAAG,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAMtF;AAED,4EAA4E;AAC5E;;;;GAIG;AACH,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,MAAM,EAAE,EACf,GAAG,EAAE,eAAe,EACpB,GAAG,EAAE,WAAW,EAChB,KAAK,EAAE,eAAe;AACtB;;;;;;GAMG;AACH,YAAY,CAAC,EAAE;IAAE,kBAAkB,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAAC,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CAAE,GACxF,MAAM,CAqFR"}
+{"version":3,"file":"emit-registration.d.ts","sourceRoot":"","sources":["../../src/ir-to-client-js/emit-registration.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAc,MAAM,EAAE,eAAe,EAAc,MAAM,aAAa,CAAA;AAC/F,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD;;;;;;;;;;;GAWG;AACH,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,UAAU,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAmD9G;AAED;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CACrC,GAAG,EAAE,eAAe,EACpB,KAAK,EAAE,eAAe,EACtB,MAAM,EAAE,MAAM,GACb;IACD,kBAAkB,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACvC,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CAC9B,CAGA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,4BAA4B,CAAC,GAAG,EAAE,eAAe,GAAG,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAMtF;AAkDD,4EAA4E;AAC5E;;;;GAIG;AACH,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,MAAM,EAAE,EACf,GAAG,EAAE,eAAe,EACpB,GAAG,EAAE,WAAW,EAChB,KAAK,EAAE,eAAe;AACtB;;;;;;GAMG;AACH,YAAY,CAAC,EAAE;IAAE,kBAAkB,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAAC,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;CAAE,GACxF,MAAM,CAqFR"}

package/package.json

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

package/src/__tests__/env-signal-template-prelude.test.ts

@@ -0,0 +1,87 @@
+/**
+ * #2654 — the CSR `template:` lambda must declare its own env-signal
+ * getter (`createSearchParams()`, #2057) before referencing it, instead
+ * of relying on `init`'s `const [<getter>] = createSearchParams()`
+ * closure — the template lambda runs at module scope and has no access
+ * to that init-local binding, so the bare call ReferenceErrors at
+ * template-evaluation time.
+ *
+ * See `buildTemplateDefPart` in `../ir-to-client-js/emit-registration.ts`.
+ */
+
+import { describe, test, expect } from 'bun:test'
+import { compileJSX } from '../compiler'
+import { TestAdapter } from '../adapters/test-adapter'
+
+const adapter = new TestAdapter()
+
+function compileClient(source: string, fileName: string): string {
+  const result = compileJSX(source, fileName, { adapter })
+  expect(result.errors).toHaveLength(0)
+  const clientJs = result.files.find((f) => f.type === 'clientJs')
+  return clientJs?.content ?? ''
+}
+
+describe('#2654 — env-signal getter self-declared in the template lambda', () => {
+  test('default getter name (`searchParams`): template lambda declares its own copy', () => {
+    const source = `
+      import { createSearchParams } from '@barefootjs/client'
+      export function SortLabel() {
+        const [searchParams] = createSearchParams()
+        return <p>{searchParams().get('sort') ?? 'none'}</p>
+      }
+    `
+    const clientJs = compileClient(source, 'SortLabel.tsx')
+
+    // The template lambda gets a block body with its own prelude
+    // declaration ahead of the returned template literal.
+    expect(clientJs).toMatch(
+      /template:\s*\(_p\)\s*=>\s*\{\s*const \[searchParams\] = createSearchParams\(\);\s*return\s*`/,
+    )
+    // The getter call inside the template body is untouched (still a
+    // real call — csr-substitute.ts deliberately leaves env-signal
+    // getters as live calls, not baked initial values).
+    expect(clientJs).toMatch(/\$\{escapeText\(searchParams\(\)\.get\('sort'\) \?\? 'none'\)\}/)
+    // `init` keeps its own independent destructure — unaffected by the
+    // template-lambda prelude.
+    expect(clientJs).toMatch(/export function initSortLabel[\s\S]*const \[searchParams\] = createSearchParams\(\)/)
+  })
+
+  test('aliased getter name (`sp`): prelude uses the destructured alias, not the canonical name', () => {
+    const source = `
+      'use client'
+      import { createMemo, createSearchParams } from '@barefootjs/client'
+      export function SortStatus() {
+        const [sp] = createSearchParams()
+        const sort = createMemo(() => sp().get('sort') ?? 'date')
+        return <p>sort: {sort()}</p>
+      }
+    `
+    const clientJs = compileClient(source, 'SortStatus.tsx')
+
+    expect(clientJs).toMatch(
+      /template:\s*\(_p\)\s*=>\s*\{\s*const \[sp\] = createSearchParams\(\);\s*return\s*`/,
+    )
+    // The memo body substitution inlines the memo's computation, still
+    // calling the self-declared `sp()` getter — no bare, undeclared
+    // reference reaches the module-scope lambda.
+    expect(clientJs).toMatch(/sp\(\)\.get\('sort'\) \?\? 'date'/)
+  })
+
+  test('component with no env signal keeps the plain expression-body template (no prelude leak)', () => {
+    const source = `
+      'use client'
+      import { createSignal } from '@barefootjs/client'
+      export function Counter() {
+        const [count] = createSignal(0)
+        return <p>{count()}</p>
+      }
+    `
+    const clientJs = compileClient(source, 'Counter.tsx')
+
+    // Plain expression-body form — unconditional prelude emission must
+    // not leak into components that hold no env signal.
+    expect(clientJs).toMatch(/template:\s*\(_p\)\s*=>\s*`/)
+    expect(clientJs).not.toMatch(/template:\s*\(_p\)\s*=>\s*\{/)
+  })
+})

package/src/ir-to-client-js/csr-substitute.ts

@@ -452,8 +452,9 @@ export function buildSignalMemoEnv(
   for (const s of signals) {
     // Env signals (#2057) have no static initial value to bake — their getter
     // is a live request-scoped read (`searchParams().get(k)`). Leave it in the
-    // CSR template as a real call, exactly as the pre-#2057 bare `searchParams()`
-    // import was (it was never a substitutable signal).
+    // CSR template as a real call; `emitRegistrationAndHydration`'s
+    // `buildTemplateDefPart` (#2654) gives the template lambda its own
+    // `const [<getter>] = <envFactory>()` prelude so the call resolves.
     if (s.envReader) continue
     substitutions.set(s.getter, {
       kind: 'call',

package/src/ir-to-client-js/emit-registration.ts

@@ -4,7 +4,7 @@
  * and the final hydrate() call emission.
  */
 
-import type { ComponentIR, IRFragment, IRNode, ReferencesGraph } from '../types.ts'
+import type { ComponentIR, IRFragment, IRNode, ReferencesGraph, SignalInfo } from '../types.ts'
 import type { ClientJsContext } from './types.ts'
 import { PROPS_PARAM } from './utils.ts'
 import { computeInlinability, toLegacyInlinability } from './compute-inlinability.ts'
@@ -115,6 +115,54 @@ export function csrInlinableConstantsFromCtx(ctx: ClientJsContext): Map<string,
   return out
 }
 
+/**
+ * Build the `template:` ComponentDef entry text for a generated
+ * `templateHtml` string.
+ *
+ * When the component holds one or more env signals (`createSearchParams()`,
+ * #2057), the template lambda destructures its own copy of each getter in
+ * a block-body prelude before returning the template literal:
+ *
+ *     template: (_p) => { const [sp] = createSearchParams(); return `...` }
+ *
+ * instead of the plain expression-body form:
+ *
+ *     template: (_p) => `...`
+ *
+ * The template lambda runs at module scope (`render()` / `renderChild()`),
+ * but an env-signal getter is otherwise only ever destructured inside
+ * `init...` — so a template that calls the getter directly (`sp()`,
+ * `searchParams()`) ReferenceErrors the moment it runs (#2654). Before
+ * #2057, `searchParams` was a bare module-scope import and the same
+ * template-body call worked by accident; #2057 moved it behind
+ * `const [sp] = createSearchParams()` without updating template emission.
+ *
+ * The prelude is emitted whenever the component HAS an env signal —
+ * never gated on whether `templateHtml` textually mentions the getter.
+ * Scanning already-emitted template HTML for a getter name would be a
+ * string/regex parse of emitted JS, which CLAUDE.md's parse rule forbids.
+ * Unconditional emission is safe because `createSearchParams()`
+ * (`packages/client/src/reactive.ts`) only returns the shared
+ * `searchParamsTuple` module singleton — no side effect — so declaring it
+ * in a prelude the template body doesn't end up using costs nothing.
+ *
+ * `envFactory` is expected to always be set alongside `envReader` (the
+ * analyzer sets both together, #2057) — the `undefined` branch is a
+ * defensive fallback: if it's ever missing, skip that signal's prelude
+ * line entirely rather than guessing a canonical factory name, leaving
+ * that one signal's template reference exactly as unsound as before this
+ * fix (never worse).
+ */
+function buildTemplateDefPart(ctx: ClientJsContext, templateHtml: string): string {
+  const envDecls = ctx.signals
+    .filter((s): s is SignalInfo & { envFactory: string } => Boolean(s.envReader) && Boolean(s.envFactory))
+    .map((s) => `const [${s.getter}] = ${s.envFactory}()`)
+  if (envDecls.length === 0) {
+    return `template: (${PROPS_PARAM}) => \`${templateHtml}\``
+  }
+  return `template: (${PROPS_PARAM}) => { ${envDecls.join('; ')}; return \`${templateHtml}\` }`
+}
+
 /** Emit hydrate() call that registers component, template, and hydrates. */
 /**
  * Generate the closing brace for the init function and the hydrate() call.
@@ -157,7 +205,7 @@ export function emitRegistrationAndHydration(
   if (canGenerateStaticTemplate(_ir.root, propNamesForStaticCheck, inlinableConstants, unsafeLocalNames)) {
     const templateHtml = irToComponentTemplate(_ir.root, inlinableConstants, restSpreadNames, ctx.propsObjectName)
     if (templateHtml) {
-      defParts.push(`template: (${PROPS_PARAM}) => \`${templateHtml}\``)
+      defParts.push(buildTemplateDefPart(ctx, templateHtml))
     }
   } else {
     // CSR fallback: emit for all components that can't generate static templates.
@@ -173,7 +221,7 @@ export function emitRegistrationAndHydration(
       _ir.root, csrInlinableConstants, ctx, restSpreadNames, ctx.propsObjectName, unsafeLocalNames, ctx.deferredChildSlots
     )
     if (templateHtml) {
-      defParts.push(`template: (${PROPS_PARAM}) => \`${templateHtml}\``)
+      defParts.push(buildTemplateDefPart(ctx, templateHtml))
     }
   }
   // No else: top-level-only components skip template entirely (save bytes)