@barefootjs/blade 0.18.5 → 0.18.7

package/dist/index.js

@@ -187308,7 +187308,13 @@ import {
   prepareLoweringMatchers,
   queryHrefArgs,
   sortComparatorFromArrow as sortComparatorFromArrow2,
-  isValidHelperId
+  isValidHelperId,
+  isDangerousInnerHtmlAttr,
+  resolveDangerousInnerHtml,
+  dangerousInnerHtmlMetacharViolation,
+  dangerousInnerHtmlDiagnostic,
+  resolveStaticLoopSource,
+  collectLoopBoundNames as collectLoopBoundNames2
 } from "@barefootjs/jsx";
 
 // src/adapter/boolean-result.ts
@@ -187654,6 +187660,39 @@ function renderFlatMethod(recv, depth, emit) {
   return `$bf->flat(${recv}, ${d})`;
 }
 
+// src/adapter/lib/static-value.ts
+function staticValueToBlade(value) {
+  if (value === null || value === undefined)
+    return "null";
+  if (typeof value === "boolean")
+    return value ? "true" : "false";
+  if (typeof value === "number")
+    return String(value);
+  if (typeof value === "string")
+    return `'${escapeBladeSingleQuoted(value)}'`;
+  if (Array.isArray(value)) {
+    const items = [];
+    for (const el of value) {
+      const serialized = staticValueToBlade(el);
+      if (serialized === null)
+        return null;
+      items.push(serialized);
+    }
+    return `[${items.join(", ")}]`;
+  }
+  if (typeof value === "object") {
+    const entries = [];
+    for (const [key, val] of Object.entries(value)) {
+      const serialized = staticValueToBlade(val);
+      if (serialized === null)
+        return null;
+      entries.push(`${bladeHashKey(key)} => ${serialized}`);
+    }
+    return `[${entries.join(", ")}]`;
+  }
+  return null;
+}
+
 // src/adapter/expr/emitters.ts
 import {
   groupBinaryOperand,
@@ -188193,6 +188232,9 @@ function generateDerivedMemoSeed(ctx, ir) {
 ` : "";
 }
 
+// src/adapter/props/prop-classes.ts
+import { collectLoopBoundNames } from "@barefootjs/jsx";
+
 // src/adapter/value/parsed-literal.ts
 import { evalStringArrayJoin } from "@barefootjs/jsx";
 function isStringTypeInfo(type2) {
@@ -188223,6 +188265,12 @@ function collectStringValueNames(ir) {
     if (isStringTypeInfo(p.type))
       names.add(p.name);
   }
+  for (const c of ir.metadata.localConstants) {
+    if (isStringTypeInfo(c.type ?? undefined) || isBareStringLiteral(c.value))
+      names.add(c.name);
+  }
+  for (const bound of collectLoopBoundNames(ir))
+    names.delete(bound);
   return names;
 }
 
@@ -188247,6 +188295,7 @@ class BladeAdapter extends BaseAdapter {
   _searchParamsLocals = new Set;
   _loweringMatchers = [];
   localConstants = [];
+  staticLoopSourceBoundNames = new Set;
   nullableOptionalProps = new Set;
   constructor(options = {}) {
     super();
@@ -188262,6 +188311,7 @@ class BladeAdapter extends BaseAdapter {
     this.propsParams = ir.metadata.propsParams.map((p) => ({ name: p.name }));
     this.booleanTypedProps = collectBooleanTypedProps(ir);
     this.localConstants = ir.metadata.localConstants ?? [];
+    this.staticLoopSourceBoundNames = collectLoopBoundNames2(ir);
     this.nullableOptionalProps = collectNullableOptionalProps(ir);
     this.stringValueNames = collectStringValueNames(ir);
     this.moduleStringConsts = collectModuleStringConsts(ir.metadata.localConstants);
@@ -188383,7 +188433,8 @@ class BladeAdapter extends BaseAdapter {
   renderElement(element) {
     const tag = element.tag;
     const attrs = this.renderAttributes(element);
-    const children = this.renderChildren(element.children);
+    const dangerousHtml = this.renderDangerousInnerHtml(element);
+    const children = dangerousHtml !== null ? dangerousHtml : this.renderChildren(element.children);
     let hydrationAttrs = "";
     if (element.needsScope) {
       hydrationAttrs += ` ${this.renderScopeMarker("")}`;
@@ -188418,6 +188469,22 @@ class BladeAdapter extends BaseAdapter {
     }
     return `<${tag}${attrs}${hydrationAttrs}>${children}</${tag}>`;
   }
+  renderDangerousInnerHtml(element) {
+    const resolution = resolveDangerousInnerHtml(element);
+    if (!resolution)
+      return null;
+    if (resolution.kind === "dynamic") {
+      this.errors.push(dangerousInnerHtmlDiagnostic(resolution.expr, resolution.loc));
+      return "";
+    }
+    const violation = dangerousInnerHtmlMetacharViolation(resolution.html, this.name);
+    if (violation) {
+      const attr = element.attrs.find(isDangerousInnerHtmlAttr);
+      this.errors.push(dangerousInnerHtmlDiagnostic(`{ __html: ${JSON.stringify(resolution.html)} }`, attr.loc, violation));
+      return "";
+    }
+    return resolution.html;
+  }
   renderExpression(expr) {
     if (expr.clientOnly) {
       if (expr.slotId) {
@@ -188425,7 +188492,7 @@ class BladeAdapter extends BaseAdapter {
       }
       return "";
     }
-    const bladeExpr = `$bf->string(${this.convertExpressionToBlade(expr.expr)})`;
+    const bladeExpr = `$bf->string(${this.convertExpressionToBlade(expr.expr, expr.parsed)})`;
     if (expr.slotId) {
       return `{!! $bf->text_start("${expr.slotId}") !!}{!! e(${bladeExpr}) !!}{!! $bf->text_end() !!}`;
     }
@@ -188516,8 +188583,12 @@ ${whenTrue}
         }
       });
     }
+    const staticItems = resolveStaticLoopSource(loop.arrayParsed, this.localConstants, {
+      isNameShadowed: (name) => this.staticLoopSourceBoundNames.has(name)
+    });
+    const staticArray = staticItems !== null ? staticValueToBlade(staticItems) : null;
     const arrayName = loop.array.trim();
-    if (/^[A-Za-z_$][\w$]*$/.test(arrayName)) {
+    if (staticArray === null && /^[A-Za-z_$][\w$]*$/.test(arrayName)) {
       const arrayConst = (this.localConstants ?? []).find((c) => c.name === arrayName);
       if (arrayConst && !arrayConst.isModule && this._resolveLiteralConst(arrayName) === null) {
         this.errors.push({
@@ -188531,7 +188602,7 @@ ${whenTrue}
         });
       }
     }
-    const rawArray = this.convertExpressionToBlade(loop.array);
+    const rawArray = staticArray ?? this.convertExpressionToBlade(loop.array);
     let array = rawArray;
     if (loop.sortComparator) {
       const sort = loop.sortComparator;
@@ -188850,6 +188921,8 @@ ${name}="{!! e($bf->string(${val})) !!}"
     for (const attr of element.attrs) {
       if (attr.clientOnly)
         continue;
+      if (isDangerousInnerHtmlAttr(attr))
+        continue;
       let attrName;
       if (attr.name === "className")
         attrName = "class";
@@ -189050,6 +189123,8 @@ Options:
     return isBooleanResultExpr(expr) || isAriaBooleanAttr(name) || this.isBooleanTypedPropRef(expr);
   }
   _resolveLiteralConst(name) {
+    if (this.staticLoopSourceBoundNames.has(name))
+      return null;
     const c = (this.localConstants ?? []).find((lc) => lc.name === name);
     if (c?.value === undefined)
       return null;
@@ -189062,6 +189137,8 @@ Options:
     return null;
   }
   _resolveStaticRecordLiteral(objectName, key) {
+    if (this.staticLoopSourceBoundNames.has(objectName))
+      return null;
     const hit = lookupStaticRecordLiteral(objectName, key, this.localConstants);
     if (!hit)
       return null;
@@ -189099,22 +189176,15 @@ Options:
 var bladeAdapter = new BladeAdapter;
 // src/conformance-pins.ts
 var conformancePins = {
-  "static-array-children": [{ code: "BF103", severity: "error" }],
-  "todo-app": [{ code: "BF103", severity: "error" }],
-  "todo-app-ssr": [{ code: "BF103", severity: "error" }],
   "static-array-from-props": [{ code: "BF101", severity: "error" }],
-  "static-array-from-props-with-component": [
-    { code: "BF103", severity: "error" },
-    { code: "BF101", severity: "error" }
-  ],
+  "static-array-from-props-with-component": [{ code: "BF101", severity: "error" }],
   "filter-nested-callback-predicate": [
     { code: "BF101", severity: "error", issue: "https://github.com/piconic-ai/barefootjs/issues/2038" }
   ],
   "filter-nested-find-predicate": [
     { code: "BF101", severity: "error", issue: "https://github.com/piconic-ai/barefootjs/issues/2038" }
   ],
-  "array-map-function-reference": [{ code: "BF101", severity: "error" }],
-  "dangerous-inner-html": [{ code: "BF101", severity: "error" }]
+  "dangerous-inner-html-dynamic": [{ code: "BF101", severity: "error", issue: "https://github.com/piconic-ai/barefootjs/issues/2215" }]
 };
 // src/render-divergences.ts
 var renderDivergences = {};

package/dist/render-divergences.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render-divergences.d.ts","sourceRoot":"","sources":["../src/render-divergences.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAExD,eAAO,MAAM,iBAAiB,EAAE,iBAAsB,CAAA"}
+{"version":3,"file":"render-divergences.d.ts","sourceRoot":"","sources":["../src/render-divergences.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAExD,eAAO,MAAM,iBAAiB,EAAE,iBAK/B,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/blade",
-  "version": "0.18.5",
+  "version": "0.18.7",
   "description": "Laravel Blade (PHP) adapter for BarefootJS — compiles IR to .blade.php templates and ships the PHP BarefootJS rendering runtime on illuminate/view standalone",
   "type": "module",
   "main": "./dist/index.js",
@@ -54,14 +54,14 @@
     "directory": "packages/adapter-blade"
   },
   "dependencies": {
-    "@barefootjs/shared": "0.18.5"
+    "@barefootjs/shared": "0.18.7"
   },
   "peerDependencies": {
     "@barefootjs/jsx": ">=0.2.0"
   },
   "devDependencies": {
     "@barefootjs/adapter-tests": "0.1.0",
-    "@barefootjs/jsx": "0.18.5",
+    "@barefootjs/jsx": "0.18.7",
     "typescript": "^5.0.0"
   }
 }

package/src/__tests__/blade-adapter-unit.test.ts

@@ -406,6 +406,126 @@ export function Parent() {
   })
 })
 
+// #2221: `_resolveLiteralConst` is a flat name lookup against
+// `ir.metadata.localConstants` with no notion of AST scope — it used to
+// substitute an outer const's literal value even at an occurrence that is
+// actually an enclosing loop callback's own (shadowing) parameter, so every
+// iteration rendered the same hard-coded literal. Guarded with the same
+// coarse `collectLoopBoundNames` exclusion as #2212: any name a loop binds
+// anywhere in the component never inlines, falling back to the bare
+// identifier.
+describe('BladeAdapter - const inlining vs loop-param shadowing (#2221)', () => {
+  test('a loop param shadowing an outer literal const emits the identifier, not the const value', () => {
+    const { template } = compileAndGenerate(`
+function Widget() {
+  const label: string = 'x'
+  return <ul>{[2, 5].map((label) => <li key={label}>{1 + label}</li>)}</ul>
+}
+`)
+    // The loop body must reference the per-iteration loop var...
+    expect(template).toContain('1 + $label')
+    // ...never the outer const's hard-coded value.
+    expect(template).not.toContain("1 + 'x'")
+  })
+
+  test('a numeric const shadowed by a loop param emits the identifier too', () => {
+    const { template } = compileAndGenerate(`
+function Widget() {
+  const count = 7
+  return <ul>{[2, 5].map((count) => <li key={count}>{1 + count}</li>)}</ul>
+}
+`)
+    expect(template).toContain('1 + $count')
+    expect(template).not.toContain('1 + 7')
+  })
+
+  test('a literal const NOT shadowed by any loop still inlines (#1897 pin)', () => {
+    const { template } = compileAndGenerate(`
+function Widget({ values }: { values: number[] }) {
+  const totalPages = 5
+  return <div>
+    <p>Page 1 of {1 + totalPages}</p>
+    <ul>{values.map((v) => <li key={v}>{v}</li>)}</ul>
+  </div>
+}
+`)
+    expect(template).toContain('1 + 5')
+  })
+
+  // The accepted coarse-exclusion trade-off (same as #2212): a name that is
+  // loop-bound ANYWHERE in the component never inlines, even at a genuinely
+  // non-shadowed occurrence outside the loop — the bare identifier is
+  // emitted instead of the value.
+  test('a const referenced outside the loop whose name is loop-bound elsewhere falls back to the identifier (accepted trade-off)', () => {
+    const { template } = compileAndGenerate(`
+function Widget({ values }: { values: number[] }) {
+  const label: string = 'x'
+  return <div>
+    <p>{1 + label}</p>
+    <ul>{values.map((label) => <li key={label}>{2 + label}</li>)}</ul>
+  </div>
+}
+`)
+    expect(template).not.toContain("1 + 'x'")
+    expect(template).toContain('2 + $label')
+  })
+})
+
+// #2237: `_resolveStaticRecordLiteral` (`IDENT.key` on a module-scope
+// object-literal const, e.g. `variantClasses.ghost` — #1896/#1897) is a
+// flat name lookup on `objectName` with no notion of AST scope, the
+// record-literal sibling of #2221's `_resolveLiteralConst` bug. It used to
+// substitute the outer const's member value even at an occurrence that is
+// actually an enclosing loop callback's own (shadowing) parameter, so every
+// iteration rendered the same hard-coded literal instead of the per-item
+// value. Guarded with the same coarse `staticLoopSourceBoundNames`
+// exclusion as #2221: any name a loop binds anywhere in the component
+// never inlines, falling back to the bare `data_get($cfg, 'x')` member
+// expression.
+describe('BladeAdapter - record-literal member lookup vs loop-param shadowing (#2237)', () => {
+  test('a loop param shadowing an outer module object const emits the member access, not the outer literal', () => {
+    const { template } = compileAndGenerate(`
+const cfg = { x: 'outer-lit' }
+function Widget({ rows }: { rows: { x: string }[] }) {
+  return <ul>{rows.map((cfg) => <li key={cfg.x}>{cfg.x}</li>)}</ul>
+}
+`)
+    // The loop body must reference the per-iteration member access...
+    expect(template).toContain("bf->string(data_get($cfg, 'x'))")
+    // ...never the outer const's hard-coded value.
+    expect(template).not.toContain("bf->string('outer-lit')")
+  })
+
+  test('a module object const NOT shadowed by any loop still inlines (variantClasses.ghost shape, #1896/#1897 pin)', () => {
+    const { template } = compileAndGenerate(`
+const variantClasses = { solid: 'bg-solid', ghost: 'bg-ghost' }
+function Widget({ variant }: { variant: 'solid' | 'ghost' }) {
+  return <div>{variantClasses.ghost}</div>
+}
+`)
+    expect(template).toContain("bf->string('bg-ghost')")
+  })
+
+  // The accepted coarse-exclusion trade-off (same as #2221/#2212): an
+  // object name that is loop-bound ANYWHERE in the component never
+  // inlines its member lookups, even at a genuinely non-shadowed
+  // occurrence outside the loop — the bare member expression is emitted
+  // instead of the value.
+  test('a record member referenced outside the loop whose object name is loop-bound elsewhere falls back to the member expression (accepted trade-off)', () => {
+    const { template } = compileAndGenerate(`
+const cfg = { x: 'outer-lit' }
+function Widget({ rows }: { rows: { x: string }[] }) {
+  return <div>
+    <p>{cfg.x}</p>
+    <ul>{rows.map((cfg) => <li key={cfg.x}>{cfg.x}</li>)}</ul>
+  </div>
+}
+`)
+    expect(template).not.toContain("bf->string('outer-lit')")
+    expect(template).toContain("bf->string(data_get($cfg, 'x'))")
+  })
+})
+
 // #2038 nested-callback-predicate loudness is pinned at the shared
 // conformance layer (workstream C): `filter-nested-callback-predicate` /
 // `filter-nested-find-predicate` (BF101 via `expectedDiagnostics`) and

package/src/adapter/blade-adapter.ts

@@ -289,6 +289,12 @@ import {
   queryHrefArgs,
   sortComparatorFromArrow,
   isValidHelperId,
+  isDangerousInnerHtmlAttr,
+  resolveDangerousInnerHtml,
+  dangerousInnerHtmlMetacharViolation,
+  dangerousInnerHtmlDiagnostic,
+  resolveStaticLoopSource,
+  collectLoopBoundNames,
 } from '@barefootjs/jsx'
 import { isAriaBooleanAttr, isBooleanResultExpr, isExplicitStringCall } from './boolean-result.ts'
 import type { ParsedExpr, LoweringMatcher } from '@barefootjs/jsx'
@@ -308,6 +314,7 @@ import {
   collectRootScopeNodes,
 } from './lib/ir-scope.ts'
 import { renderSortMethod, renderSortEval } from './expr/array-method.ts'
+import { staticValueToBlade } from './lib/static-value.ts'
 import { BladeFilterEmitter, BladeTopLevelEmitter, truthyTest } from './expr/emitters.ts'
 import type { BladeEmitContext, BladeSpreadContext, BladeMemoContext } from './emit-context.ts'
 import {
@@ -417,6 +424,17 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
    */
   private localConstants: IRMetadata['localConstants'] = []
 
+  /**
+   * Every name a `.map()`/`.filter()` loop callback binds as its item/index
+   * parameter anywhere in the component (#2208 fable review). A static
+   * loop-SOURCE name (e.g. a function-scope `const items = [...]`) must
+   * never resolve through `resolveStaticLoopSource` at a use site where a
+   * DIFFERENT, enclosing loop's own callback param shadows it — same
+   * shadowing hazard, and same coarse-but-safe mitigation, as #2212's
+   * `collectLoopBoundNames` use in `collectStringValueNames`.
+   */
+  private staticLoopSourceBoundNames: Set<string> = new Set()
+
   /**
    * Optional, no-default props that are `None` when the caller omits them.
    * Their bare-reference attribute emission is guarded with a Blade
@@ -449,6 +467,7 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
     // ("1"/"") (#1897, pagination's data-active).
     this.booleanTypedProps = collectBooleanTypedProps(ir)
     this.localConstants = ir.metadata.localConstants ?? []
+    this.staticLoopSourceBoundNames = collectLoopBoundNames(ir)
     this.nullableOptionalProps = collectNullableOptionalProps(ir)
     this.stringValueNames = collectStringValueNames(ir)
     this.moduleStringConsts = collectModuleStringConsts(ir.metadata.localConstants)
@@ -669,7 +688,8 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
   renderElement(element: IRElement): string {
     const tag = element.tag
     const attrs = this.renderAttributes(element)
-    const children = this.renderChildren(element.children)
+    const dangerousHtml = this.renderDangerousInnerHtml(element)
+    const children = dangerousHtml !== null ? dangerousHtml : this.renderChildren(element.children)
 
     let hydrationAttrs = ''
     if (element.needsScope) {
@@ -704,6 +724,35 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
     return `<${tag}${attrs}${hydrationAttrs}>${children}</${tag}>`
   }
 
+  /**
+   * `dangerouslySetInnerHTML={{ __html: '...' }}` (#2207) — replaces the
+   * element's normal children with a compile-time-literal raw-HTML string,
+   * spliced directly as template text (never through a `{!! !!}`-style
+   * runtime raw-output primitive: the value is already fully known at
+   * compile time, so no runtime escape hatch is needed, and using one would
+   * reopen a template-source injection surface for no benefit). Returns
+   * `null` when the attribute is absent (caller falls through to normal
+   * `renderChildren`); a non-`null` string (possibly `''`) means the caller
+   * must use it as-is instead — including the dynamic/guard-violation
+   * refusal cases, where the empty string is safe filler for a compile that
+   * fails anyway.
+   */
+  private renderDangerousInnerHtml(element: IRElement): string | null {
+    const resolution = resolveDangerousInnerHtml(element)
+    if (!resolution) return null
+    if (resolution.kind === 'dynamic') {
+      this.errors.push(dangerousInnerHtmlDiagnostic(resolution.expr, resolution.loc))
+      return ''
+    }
+    const violation = dangerousInnerHtmlMetacharViolation(resolution.html, this.name)
+    if (violation) {
+      const attr = element.attrs.find(isDangerousInnerHtmlAttr)!
+      this.errors.push(dangerousInnerHtmlDiagnostic(`{ __html: ${JSON.stringify(resolution.html)} }`, attr.loc, violation))
+      return ''
+    }
+    return resolution.html
+  }
+
   // ===========================================================================
   // Expression Rendering
   // ===========================================================================
@@ -717,8 +766,13 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
     }
 
     // Text-position interpolation of a possibly-non-string value — see the
-    // file header, "Stringification" (carried unchanged from Twig).
-    const bladeExpr = `$bf->string(${this.convertExpressionToBlade(expr.expr)})`
+    // file header, "Stringification" (carried unchanged from Twig). Thread
+    // the IR-carried `.parsed` tree through (mirrors go-template's
+    // `convertExpressionToGo(expr.expr, classify, expr.parsed)`) so a
+    // resolved bare-identifier `.map`/`.filter`/… callback
+    // (`resolveCallbackMethodFunctionReferences`, #2206) isn't lost to a
+    // fresh, unresolved re-parse of the raw string.
+    const bladeExpr = `$bf->string(${this.convertExpressionToBlade(expr.expr, expr.parsed)})`
 
     if (expr.slotId) {
       return `{!! $bf->text_start("${expr.slotId}") !!}{!! e(${bladeExpr}) !!}{!! $bf->text_end() !!}`
@@ -863,8 +917,27 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
     // corpus only because the widened destructure gate (#2087 Phase A/B)
     // no longer refuses this fixture's `([emoji, users]) => ...` param
     // first. Same policy and shape as the Jinja / ERB adapters' check.
+    // #2208: a loop source that is a fully-static array literal — either
+    // inline (`[{ label: 'Alpha' }, ...].map(...)`) or a bare identifier
+    // bound to a FUNCTION-scope local const whose initializer has no
+    // prop/signal/function-call dependency — inlines as a native PHP
+    // array literal below, the same way a module-scope const's value is
+    // already seeded. A runtime-computed local (#2069, e.g.
+    // `Object.entries(props.tags).filter(...)`) still refuses below.
+    // `isNameShadowed` guards a DIFFERENT, enclosing loop's own callback
+    // param shadowing this identifier (fable review) — never resolve the
+    // static const in that case. `rawArray` then falls through to the
+    // bare identifier expression below, same as before #2208 — which
+    // still trips the pre-existing BF101 gate for an unresolvable local
+    // const reference (a loud, conservative refusal, not a silent wrong
+    // value).
+    const staticItems = resolveStaticLoopSource(loop.arrayParsed, this.localConstants, {
+      isNameShadowed: name => this.staticLoopSourceBoundNames.has(name),
+    })
+    const staticArray = staticItems !== null ? staticValueToBlade(staticItems) : null
+
     const arrayName = loop.array.trim()
-    if (/^[A-Za-z_$][\w$]*$/.test(arrayName)) {
+    if (staticArray === null && /^[A-Za-z_$][\w$]*$/.test(arrayName)) {
       const arrayConst = (this.localConstants ?? []).find(c => c.name === arrayName)
       if (arrayConst && !arrayConst.isModule && this._resolveLiteralConst(arrayName) === null) {
         this.errors.push({
@@ -880,7 +953,7 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
       }
     }
 
-    const rawArray = this.convertExpressionToBlade(loop.array)
+    const rawArray = staticArray ?? this.convertExpressionToBlade(loop.array)
     // Apply sort if present: wrap the loop array in the shared `$bf->sort`
     // helper, binding the sorted result to a per-iteration local so the
     // helper runs once.
@@ -1554,6 +1627,12 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
       // the unsupported-expression lowering is never reached for a deferred
       // predicate (no BF101 / BF102). #1966
       if (attr.clientOnly) continue
+      // `dangerouslySetInnerHTML` never renders as an HTML attribute — it's
+      // handled by `renderDangerousInnerHtml` instead, which replaces the
+      // element's children. Skip it here so its `{ __html: ... }` object
+      // literal never reaches `refuseUnsupportedAttrExpression`'s generic
+      // BF101 (which would double-report alongside the purpose-built one).
+      if (isDangerousInnerHtmlAttr(attr)) continue
       // Rewrite JSX special-prop names to their HTML-attribute counterparts.
       let attrName: string
       if (attr.name === 'className') attrName = 'class'
@@ -1924,8 +2003,19 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
    * single-quoted string literal (`const totalPages = 5`, #1897
    * pagination) — function-scope consts never reach the per-render
    * context, so a bare reference would resolve to an undefined variable.
+   *
+   * The lookup is a flat name match with no notion of AST scope, so a
+   * name that any loop callback binds as its item/index param never
+   * inlines (#2221) — the occurrence may be the loop's own (shadowing)
+   * binding, and substituting the outer const's value there renders every
+   * iteration with the same hard-coded literal. Coarse (a genuinely
+   * non-shadowed same-named const elsewhere in the component also stops
+   * inlining, falling back to the bare identifier) but safe — the same
+   * trade-off as #2212's `collectLoopBoundNames` use in
+   * `collectStringValueNames`.
    */
   private _resolveLiteralConst(name: string): string | null {
+    if (this.staticLoopSourceBoundNames.has(name)) return null
     const c = (this.localConstants ?? []).find(lc => lc.name === name)
     if (c?.value === undefined) return null
     const v = c.value.trim()
@@ -1935,7 +2025,22 @@ export class BladeAdapter extends BaseAdapter implements IRNodeEmitter<BladeRend
     return null
   }
 
+  /**
+   * Resolve `IDENT.key` where `IDENT` is a module-scope object-literal const
+   * (`variantClasses.ghost`, #1896/#1897) to the looked-up scalar.
+   *
+   * The lookup is a flat name match on `objectName` with no notion of AST
+   * scope, so an enclosing loop callback's own param of the same name
+   * (`.map((cfg) => <li>{cfg.x}</li>)` shadowing a module `const cfg = {…}`)
+   * still resolved to the OUTER const's member value at every iteration
+   * (#2237) — the sibling hazard to #2221's `_resolveLiteralConst`. Same
+   * coarse-but-safe `staticLoopSourceBoundNames` guard: any name a loop
+   * binds anywhere in the component never inlines, falling back to the bare
+   * `data_get($cfg, 'x')` member expression (which a Blade `@foreach`
+   * binds correctly at the shadowed occurrences).
+   */
   private _resolveStaticRecordLiteral(objectName: string, key: string): string | null {
+    if (this.staticLoopSourceBoundNames.has(objectName)) return null
     const hit = lookupStaticRecordLiteral(objectName, key, this.localConstants)
     if (!hit) return null
     return hit.kind === 'number'

package/src/adapter/lib/static-value.ts

@@ -0,0 +1,39 @@
+/**
+ * Serialize a compile-time-evaluated JS value (`@barefootjs/jsx`'s
+ * `evaluateStaticLiteral`/`resolveStaticLoopSource`, #2208) into a native
+ * PHP literal. Used to inline a fully-static loop source (an inline array
+ * literal, or a function-scope local const with a static initializer)
+ * directly in a `@foreach` header, rather than requiring a bound template
+ * variable.
+ *
+ * Returns `null` for a value this adapter can't represent as a literal —
+ * the caller falls back to its existing BF101 refusal instead of guessing.
+ */
+
+import { escapeBladeSingleQuoted, bladeHashKey } from './blade-naming.ts'
+
+export function staticValueToBlade(value: unknown): string | null {
+  if (value === null || value === undefined) return 'null'
+  if (typeof value === 'boolean') return value ? 'true' : 'false'
+  if (typeof value === 'number') return String(value)
+  if (typeof value === 'string') return `'${escapeBladeSingleQuoted(value)}'`
+  if (Array.isArray(value)) {
+    const items: string[] = []
+    for (const el of value) {
+      const serialized = staticValueToBlade(el)
+      if (serialized === null) return null
+      items.push(serialized)
+    }
+    return `[${items.join(', ')}]`
+  }
+  if (typeof value === 'object') {
+    const entries: string[] = []
+    for (const [key, val] of Object.entries(value as Record<string, unknown>)) {
+      const serialized = staticValueToBlade(val)
+      if (serialized === null) return null
+      entries.push(`${bladeHashKey(key)} => ${serialized}`)
+    }
+    return `[${entries.join(', ')}]`
+  }
+  return null
+}

package/src/adapter/props/prop-classes.ts

@@ -6,7 +6,7 @@
  * sets the adapter consults during lowering. No adapter instance state.
  */
 
-import type { ComponentIR } from '@barefootjs/jsx'
+import { collectLoopBoundNames, type ComponentIR } from '@barefootjs/jsx'
 import { isStringTypeInfo, isBareStringLiteral } from '../value/parsed-literal.ts'
 
 /**
@@ -43,14 +43,31 @@ export function collectNullableOptionalProps(ir: ComponentIR): Set<string> {
 }
 
 /**
- * String-typed signals and props. A signal is string-typed when its inferred
- * type is `string` (or, defensively, when its initial value is a bare string
- * literal); a prop when its annotated type is `string`. In the Mojo adapter
- * this drives `eq`/`ne` selection for string equality; the Blade emitters
- * don't consume the distinction — `===`/`!==` ALWAYS route through
- * `bf.eq`/`bf.neq` regardless of operand type (see
- * `expr/emitters.ts`'s file header, divergence 4) — so this set is carried
- * only for parity with the Perl-family adapters.
+ * String-typed signals, props, and same-file local consts (#2212). A
+ * signal is string-typed when its inferred type is `string` (or,
+ * defensively, when its initial value is a bare string literal); a prop
+ * when its annotated type is `string`; a local const the same way. Consumed
+ * by `isStringConcatBinary`/`isStringTypedOperand` (`@barefootjs/jsx`) to
+ * pick `.` over JS `+`'s numeric fallback (#2163, #2212) — including now
+ * for a bare identifier operand, not just a prop/getter/literal. In the
+ * Mojo adapter this ALSO drives `eq`/`ne` selection for string equality;
+ * the Blade emitters don't consume the distinction there — `===`/`!==`
+ * ALWAYS route through `bf.eq`/`bf.neq` regardless of operand type (see
+ * `expr/emitters.ts`'s file header, divergence 4) — so that half of this
+ * set is carried only for parity with the Perl-family adapters.
+ *
+ * Excludes any name bound as a `.map()`/`.filter()` loop callback's item
+ * or index parameter ANYWHERE in the component (Fable review, #2212): the
+ * lookup below is a flat, scope-blind `Set<string>` with no notion of a
+ * loop param shadowing an outer string-typed binding of the same name
+ * (`items.map((name) => 1 + name)` inside a component that also has a
+ * string `name` prop) — left unguarded, that shadowed `name` would be
+ * misdetected as string-typed and `1 + name` would silently lower to `.`
+ * instead of staying numeric `+`. Subtracting loop-bound names is coarse
+ * (it also suppresses a genuinely non-shadowed same-named string
+ * elsewhere in the component) but safe: the suppressed case just falls
+ * back to today's numeric `+` — the same, already-accepted residual as an
+ * unresolvable operand — never silently-wrong output.
  */
 export function collectStringValueNames(ir: ComponentIR): Set<string> {
   const names = new Set<string>()
@@ -62,5 +79,9 @@ export function collectStringValueNames(ir: ComponentIR): Set<string> {
   for (const p of ir.metadata.propsParams) {
     if (isStringTypeInfo(p.type)) names.add(p.name)
   }
+  for (const c of ir.metadata.localConstants) {
+    if (isStringTypeInfo(c.type ?? undefined) || isBareStringLiteral(c.value)) names.add(c.name)
+  }
+  for (const bound of collectLoopBoundNames(ir)) names.delete(bound)
   return names
 }