@barefootjs/jsx 0.35.0 → 0.35.2

package/src/ir-to-client-js/control-flow/plan/build-lazy-row.ts

@@ -218,9 +218,14 @@ export function decideLazyRow(args: BuildLazyRowArgs): {
   const condFacts: LazyConditionalFacts[] = []
   let conditionalRefusal: string | null = null
   for (const cond of rawConditionals) {
+    // whenTrueHtml/whenFalseHtml are already loop-param-wrapped at IR
+    // render time (`irToHtmlTemplate`'s `loopParams`, collect-elements.ts)
+    // — do NOT re-wrap the rendered HTML string here (#2868: a
+    // word-boundary regex over assembled markup can match a bare tag name
+    // colliding with the param/index identifier, e.g. `<i>` -> `<i()>`).
     const verdict = analyzeLazyConditional(cond, {
-      whenTrueHtml: addCondAttrToTemplate(wrap(cond.whenTrueHtml), cond.slotId),
-      whenFalseHtml: addCondAttrToTemplate(wrap(cond.whenFalseHtml), cond.slotId),
+      whenTrueHtml: addCondAttrToTemplate(cond.whenTrueHtml, cond.slotId),
+      whenFalseHtml: addCondAttrToTemplate(cond.whenFalseHtml, cond.slotId),
     })
     if (!verdict.lazySafe) { conditionalRefusal = verdict.reason; break }
     condFacts.push(verdict.facts)

package/src/ir-to-client-js/control-flow/plan/build-loop-child-arm.ts

@@ -202,6 +202,8 @@ export interface BuildBranchInnerLoopsArgs {
   outerLoopParam: string
   /** Outer loop param destructuring metadata. */
   outerLoopParamBindings?: readonly LoopParamBinding[]
+  /** Outer loop's index param name, when present (#2861). */
+  outerLoopIndex?: string | null
   /**
    * Outer-wrap closure — defaults to wrapping with `outerLoopParam`. Overridden
    * by `emitNestedLoopChildConditionals` recursion (which threads its own wrap).
@@ -225,6 +227,7 @@ export function buildBranchInnerLoopsPlan(
     condSlotId,
     outerLoopParam,
     outerLoopParamBindings,
+    outerLoopIndex,
     wrapOuter,
   } = args
   if (!innerLoops || innerLoops.length === 0) return []
@@ -232,7 +235,12 @@ export function buildBranchInnerLoopsPlan(
   const plan: BranchInnerLoop[] = []
   for (let i = 0; i < innerLoops.length; i++) {
     const inner = innerLoops[i]
-    if (!inner.refsOuterParam || !inner.template) continue
+    // #2865: an inner loop inside a conditional arm used to be dropped
+    // entirely (no `mapArray`, no hydration wiring at all) whenever its
+    // array didn't reference the outer loop's item — the same unsound
+    // gate `build-inner-loop.ts` used, just answered by skipping instead
+    // of falling back to a weaker static emission. Always build the plan.
+    if (!inner.template) continue
 
     const wrapInner = (expr: string) => wrapLoopParamAsAccessor(expr, inner.param, inner.paramBindings, inner.index)
     const wrapBoth = (expr: string) => wrapLoopParamAsAccessor(wrapOuter(expr), inner.param, inner.paramBindings, inner.index)
@@ -327,11 +335,13 @@ export function buildBranchInnerLoopsPlan(
         wrap: wrapBoth,
         loopParam: inner.param,
         loopParamBindings: inner.paramBindings,
+        loopIndex: inner.index,
       }),
       innerLoopParam: inner.param,
       innerLoopParamBindings: inner.paramBindings,
       outerLoopParam,
       outerLoopParamBindings,
+      outerLoopIndex,
     })
   }
   return plan
@@ -352,6 +362,8 @@ export interface BuildLoopChildConditionalsArgs {
   loopParam: string
   /** Loop param destructuring metadata. */
   loopParamBindings?: readonly LoopParamBinding[]
+  /** Loop's index param name, when it declares one (#2861) — same role as `loopParam` above. */
+  loopIndex?: string | null
 }
 
 /**
@@ -360,7 +372,8 @@ export interface BuildLoopChildConditionalsArgs {
  * recursion. Each conditional pre-builds:
  *
  *   - the wrapped condition expression
- *   - the wrapped + addCondAttr'd whenTrue / whenFalse template HTML
+ *   - the addCondAttr'd whenTrue / whenFalse template HTML (already
+ *     loop-param-wrapped at IR render time, #2868)
  *   - per-arm `LoopChildArmPlan`: events / child components / inner
  *     loops / nested conditionals (recursion)
  *
@@ -370,7 +383,7 @@ export interface BuildLoopChildConditionalsArgs {
 export function buildLoopChildConditionalsPlan(
   args: BuildLoopChildConditionalsArgs,
 ): LoopChildConditionalPlan[] {
-  const { conditionals, scopeVar, wrap, loopParam, loopParamBindings } = args
+  const { conditionals, scopeVar, wrap, loopParam, loopParamBindings, loopIndex } = args
   if (!conditionals || conditionals.length === 0) return []
 
   const plans: LoopChildConditionalPlan[] = []
@@ -379,13 +392,20 @@ export function buildLoopChildConditionalsPlan(
       slotId: cond.slotId,
       scopeVar,
       wrappedCondition: wrap(cond.condition),
-      whenTrueTemplateHtml: addCondAttrToTemplate(wrap(cond.whenTrueHtml), cond.slotId),
-      whenFalseTemplateHtml: addCondAttrToTemplate(wrap(cond.whenFalseHtml), cond.slotId),
+      // whenTrueHtml/whenFalseHtml are already loop-param-wrapped for the
+      // full ancestor chain at IR render time (`irToHtmlTemplate`'s
+      // `loopParams`, collect-elements.ts) — do NOT re-wrap the rendered
+      // HTML string here (#2868: a word-boundary regex over assembled
+      // markup can match a bare tag name colliding with the param/index
+      // identifier, e.g. `<i>` -> `<i()>`).
+      whenTrueTemplateHtml: addCondAttrToTemplate(cond.whenTrueHtml, cond.slotId),
+      whenFalseTemplateHtml: addCondAttrToTemplate(cond.whenFalseHtml, cond.slotId),
       whenTrueArm: buildLoopChildArmPlan({
         branch: cond.whenTrue,
         wrap,
         loopParam,
         loopParamBindings,
+        loopIndex,
         condId: cond.slotId,
       }),
       whenFalseArm: buildLoopChildArmPlan({
@@ -393,8 +413,10 @@ export function buildLoopChildConditionalsPlan(
         wrap,
         loopParam,
         loopParamBindings,
+        loopIndex,
         condId: cond.slotId,
       }),
+      ...(cond.readsPreamble && { readsPreamble: true }),
     })
   }
   return plans
@@ -429,6 +451,7 @@ export function buildArmAttrsPlan(
         attrName: attr.attrName,
         wrappedExpression: wrap(attr.expression),
         meta: pickAttrMeta(attr),
+        ...(attr.readsPreamble && { readsPreamble: true }),
       })),
     })
   }
@@ -455,12 +478,14 @@ interface BuildLoopChildArmArgs {
   wrap: (expr: string) => string
   loopParam: string
   loopParamBindings?: readonly LoopParamBinding[]
+  /** Loop's index param name, when it declares one (#2861). */
+  loopIndex?: string | null
   /** The enclosing conditional's own slot id — threaded to `buildBranchInnerLoopsPlan`'s `condSlotId` (#2705). */
   condId: string
 }
 
 function buildLoopChildArmPlan(args: BuildLoopChildArmArgs): LoopChildArmPlan {
-  const { branch, wrap, loopParam, loopParamBindings, condId } = args
+  const { branch, wrap, loopParam, loopParamBindings, loopIndex, condId } = args
   return {
     events: buildBranchEventBindingsPlan({
       events: branch.events,
@@ -476,6 +501,7 @@ function buildLoopChildArmPlan(args: BuildLoopChildArmArgs): LoopChildArmPlan {
       condSlotId: condId,
       outerLoopParam: loopParam,
       outerLoopParamBindings: loopParamBindings,
+      outerLoopIndex: loopIndex,
       wrapOuter: wrap,
     }),
     nestedConditionals: buildLoopChildConditionalsPlan({
@@ -484,6 +510,7 @@ function buildLoopChildArmPlan(args: BuildLoopChildArmArgs): LoopChildArmPlan {
       wrap,
       loopParam,
       loopParamBindings,
+      loopIndex,
     }),
     attrs: buildArmAttrsPlan(branch.reactiveAttrs, wrap),
     texts: buildArmTextsPlan(branch.reactiveTexts, wrap),

package/src/ir-to-client-js/control-flow/plan/build-plain-row.ts

@@ -93,8 +93,14 @@ export function buildPlainRowCore(inputs: PlainRowInputs): PlainRowCore {
   const mapPreambleWrappedFinal = !lazyRow && loop.index
     ? wrapIndexParamAsAccessor(mapPreambleWrapped, loop.index)
     : mapPreambleWrapped
+  // `loop.templateIndexed` is a second structured render (index wrapped at
+  // IR time, `collect-elements.ts`) rather than a post-hoc regex pass over
+  // `loop.template` — a word-boundary regex over assembled HTML can match a
+  // bare tag name colliding with the index identifier (`<i>` -> `<i()>`,
+  // #2868). Falls back to `loop.template` for the rare shape that doesn't
+  // populate it (e.g. a flatMap projection loop).
   const templateFinal = !lazyRow && loop.index
-    ? wrapIndexParamAsAccessor(loop.template, loop.index)
+    ? (loop.templateIndexed ?? loop.template)
     : loop.template
 
   return {

package/src/ir-to-client-js/control-flow/plan/build-reactive-effects.ts

@@ -12,8 +12,9 @@
  *      from `LoopChildBranchSummary.reactiveAttrs` / `.reactiveTexts` —
  *      collected per-branch, recursively, so a doubly-nested conditional's
  *      arm carries its own bindings instead of an outer scope reaching in.
- *   4. Apply `addCondAttrToTemplate` to the wrapped branch HTML so the
- *      stringifier emits a ready-to-interpolate template literal.
+ *   4. Apply `addCondAttrToTemplate` to each branch's HTML (already
+ *      loop-param-wrapped at IR render time, #2868) so the stringifier
+ *      emits a ready-to-interpolate template literal.
  *   5. Recurse into the per-arm sub-plans via `LoopChildArmPlan` —
  *      events, child component inits, inner loops, nested conditionals,
  *      attrs, texts. No legacy passthrough remains.
@@ -110,10 +111,17 @@ export function buildReactiveEffectsPlan(
       conditionalPlans.push({
         slotId: cond.slotId,
         wrappedCondition: wrap(cond.condition),
-        whenTrueTemplateHtml: addCondAttrToTemplate(wrap(cond.whenTrueHtml), cond.slotId),
-        whenFalseTemplateHtml: addCondAttrToTemplate(wrap(cond.whenFalseHtml), cond.slotId),
-        whenTrueArm: buildOuterArm(cond.whenTrue, wrap, loopParam, loopParamBindings, cond.slotId, profileComponentName),
-        whenFalseArm: buildOuterArm(cond.whenFalse, wrap, loopParam, loopParamBindings, cond.slotId, profileComponentName),
+        // whenTrueHtml/whenFalseHtml are already loop-param-wrapped at IR
+        // render time (`irToHtmlTemplate`'s `loopParams`, collect-elements.ts)
+        // — do NOT re-wrap the rendered HTML string here. A word-boundary
+        // regex over already-assembled markup matches a bare tag name that
+        // collides with the param/index identifier (`<i>` -> `<i()>`) just
+        // as readily as a real reference, since `<`/`>` are non-word
+        // characters (#2868).
+        whenTrueTemplateHtml: addCondAttrToTemplate(cond.whenTrueHtml, cond.slotId),
+        whenFalseTemplateHtml: addCondAttrToTemplate(cond.whenFalseHtml, cond.slotId),
+        whenTrueArm: buildOuterArm(cond.whenTrue, wrap, loopParam, loopParamBindings, loopIndex, cond.slotId, profileComponentName),
+        whenFalseArm: buildOuterArm(cond.whenFalse, wrap, loopParam, loopParamBindings, loopIndex, cond.slotId, profileComponentName),
         ...(cond.readsPreamble && { readsPreamble: true }),
       })
     }
@@ -132,6 +140,8 @@ function buildOuterArm(
   wrap: (expr: string) => string,
   loopParam: string,
   loopParamBindings: readonly LoopParamBinding[] | undefined,
+  /** This loop's index param name, when it declares one (#2861). */
+  loopIndex: string | null | undefined,
   /** The conditional's own slot id — threaded to `buildBranchInnerLoopsPlan`'s `condSlotId` (#2705). */
   condSlotId: string,
   profileComponentName?: string,
@@ -152,6 +162,7 @@ function buildOuterArm(
       condSlotId,
       outerLoopParam: loopParam,
       outerLoopParamBindings: loopParamBindings,
+      outerLoopIndex: loopIndex,
       wrapOuter: wrap,
     }),
     nestedConditionals: buildLoopChildConditionalsPlan({
@@ -160,6 +171,7 @@ function buildOuterArm(
       wrap,
       loopParam,
       loopParamBindings,
+      loopIndex,
     }),
     attrs: buildArmAttrsPlan(branch.reactiveAttrs, wrap),
     texts: buildArmTextsPlan(branch.reactiveTexts, wrap),

package/src/ir-to-client-js/control-flow/plan/inner-loop.ts

@@ -1,13 +1,19 @@
 /**
  * Plan types for inner loops emitted inside a composite loop's renderItem
- * body. Each `InnerLoopPlan` is one level (= one `mapArray` for reactive
- * inner loops, one `forEach` for static ones); `childLevels` recurses for
- * deeper nestings.
+ * body. Each `InnerLoopPlan` is one level (= one `mapArray`); `childLevels`
+ * recurses for deeper nestings.
  *
  * Replaces the legacy `emitInnerLoopSetup` + `DepthLevel` walk. The
- * builder pre-resolves every per-level decision (mode, container query,
- * wrapped array / template / key, narrowed-outer-param children) so the
+ * builder pre-resolves every per-level decision (container query, wrapped
+ * array / template / key, narrowed-outer-param children) so the
  * stringifier is a deterministic walk.
+ *
+ * Every level gets the reactive `mapArray` shape (#2865) — there used to
+ * be a second "static forEach, setup-only" shape for a nested loop whose
+ * array didn't reference the outer item, but that gate answered the wrong
+ * question (it never checked whether the array was reactive at all, only
+ * whether it mentioned the outer item's name) and silently froze any other
+ * reactivity in the row. See `build-inner-loop.ts`'s module docstring.
  */
 
 import type { LoopChildEvent } from '../../types.ts'
@@ -64,20 +70,9 @@ export interface InnerLoopReactiveAttr {
 }
 
 /**
- * One inner loop level inside a composite renderItem.
- *
- * The `mode` discriminator selects the emission shape:
- *
- *   - `reactive`: full `mapArray(...)` with renderItem (template clone,
- *     key attr, components/events with inner-wrapped props, reactive text
- *     effects, recursive childLevels).
- *   - `static`: `forEach(...)` for setup-only (children are rendered
- *     into the SSR HTML); components/events use the raw param, no
- *     wrap, no template clone.
- *
- * Choosing the mode requires checking whether `inner.array` references
- * the outer loop param at *this* level (legacy O-8 fix). The builder
- * does that check; the stringifier just dispatches on `mode`.
+ * One inner loop level inside a composite renderItem: a full `mapArray(...)`
+ * with renderItem (template clone, key attr, components/events with
+ * inner-wrapped props, reactive text/attr effects, recursive childLevels).
  */
 export interface InnerLoopPlan {
   /** Unique suffix used in `__ic` / `__innerEl` / `__innerIdx` var names. */
@@ -101,21 +96,25 @@ export interface InnerLoopPlan {
    * `// Initialize <array> loop components and events` comments.
    */
   arraySrc: string
-  /** Inner loop parameter identifier (used by static forEach). */
+  /** Inner loop parameter identifier. */
   param: string
   /** Depth used by `keyAttrName(...)`. Same as the IR's `inner.depth`. */
   keyDepth: number
-  /**
-   * Per-mode emission data. Discriminator keeps each shape's required fields
-   * narrowed and prevents accidental cross-talk.
-   */
-  emit: InnerLoopReactiveEmit | InnerLoopStaticEmit
+  /** Emission data for this level's `mapArray` renderItem. */
+  emit: InnerLoopReactiveEmit
   /** Recursive child levels — narrowed-outer-param at build time. */
   childLevels: readonly InnerLoopPlan[]
   /** Outer loop param threaded into emitComponentAndEventSetup. */
   outerLoopParam: string | undefined
   /** Outer loop param destructuring metadata. */
   outerLoopParamBindings?: readonly LoopParamBinding[]
+  /**
+   * Outer loop's index param name, when present (#2861) — threaded into
+   * `emitComponentAndEventSetup` so a component prop / event handler in
+   * this row that closes over the OUTER loop's index reads it through the
+   * live accessor instead of a value frozen at row-creation time.
+   */
+  outerLoopIndex?: string | null
 }
 
 export interface InnerLoopReactiveEmit {
@@ -164,24 +163,4 @@ export interface InnerLoopReactiveEmit {
   childRefs: readonly LoopChildRefBinding[]
 }
 
-export interface InnerLoopStaticEmit {
-  mode: 'static'
-  /** Raw key expression (used as-is in setAttribute) — null when no key. */
-  rawKey: string | null
-  /**
-   * Body-entry statements (see `PreludeStatements`) emitted at the top of
-   * the static `forEach(...)` body, after the existence guard. Holds the
-   * inner `.map()` callback preamble locals (#1064). Emitted unwrapped
-   * because the forEach param is the literal item, not a signal accessor —
-   * no accessor rewrite is needed.
-   */
-  preludeStatements: PreludeStatements
-  /** Raw components (no inner-wrap; the static body has no signal accessor). */
-  components: readonly IRLoopChildComponent[]
-  /** Raw events (no inner-wrap). */
-  events: readonly LoopChildEvent[]
-  /** Imperative ref callbacks (unwrapped — static body has no signal accessor). */
-  childRefs: readonly LoopChildRefBinding[]
-}
-
 export type InnerLoopsPlan = readonly InnerLoopPlan[]

package/src/ir-to-client-js/control-flow/plan/loop-child-arm.ts

@@ -146,6 +146,13 @@ export interface BranchInnerLoop {
   outerLoopParam: string
   /** Outer loop param destructuring metadata. */
   outerLoopParamBindings?: readonly import('../../../types.ts').LoopParamBinding[]
+  /**
+   * Outer loop's index param name, when present (#2861) — threaded into
+   * `emitComponentAndEventSetup`'s own outer-wrap pass alongside
+   * `outerLoopParam`/`outerLoopParamBindings`, mirroring `InnerLoopPlan`'s
+   * field of the same name.
+   */
+  outerLoopIndex?: string | null
 }
 
 export type BranchInnerLoopsPlan = readonly BranchInnerLoop[]
@@ -206,4 +213,11 @@ export interface LoopChildConditionalPlan {
   whenFalseTemplateHtml: string
   whenTrueArm: LoopChildArmPlan
   whenFalseArm: LoopChildArmPlan
+  /**
+   * `wrappedCondition` reads a `.map()` callback preamble local (#2596,
+   * same field as `NestedConditionalPlan.readsPreamble` one level up) —
+   * the stringifier must run the row's preamble inside the getter passed
+   * to `insert()`; the local isn't otherwise in scope there.
+   */
+  readsPreamble?: boolean
 }

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

@@ -1,8 +1,12 @@
 /**
  * Stringify `InnerLoopsPlan` into source lines.
  *
- * Two emission shapes (mode-discriminated, byte-identical to the legacy
- * `emitInnerLoopSetup`):
+ * One emission shape (#2865 — the former second "static forEach,
+ * setup-only" shape for a nested loop whose array didn't reference the
+ * outer item was removed: it answered "does the array mention the outer
+ * item" instead of "is this reactive at all", so it silently froze any
+ * other reactivity — a signal, a memo, a prop, a preamble local — the
+ * inner array or its rows depended on):
  *
  *   reactive — full mapArray:
  *     <indent>// Reactive inner loop: <arraySrc>
@@ -17,23 +21,11 @@
  *     <indent>  per-item conditionals: insert() over __innerEl<uid> (#2706)
  *     <indent>  return __innerEl<uid>
  *     <indent>}) }
- *
- *   static — forEach setup-only:
- *     <indent>// Initialize <arraySrc> loop components and events
- *     <indent>{ const __ic<uid> = <containerExpr>
- *     <indent>if (__ic<uid> && <arrayExpr>) <arrayExpr>.forEach((<param>, __innerIdx<uid>) => {
- *     <indent>  const __innerEl<uid> = __ic<uid>.children[__innerIdx<uid>]
- *     <indent>  if (!__innerEl<uid>) return
- *     <indent>  <preludeStatements*>   // raw preamble (#1064)
- *     <indent>  __innerEl<uid>.setAttribute('<keyAttr>', String(<rawKey>))?
- *     <indent>  emitComponentAndEventSetup(...)
- *     <indent>  recurse on childLevels
- *     <indent>}) }
  */
 
 import { keyAttrName, mapArrayKeyArgs, profileBindingId, varSlotId } from '../../utils.ts'
 import { emitComponentAndEventSetup } from '../shared.ts'
-import { emitAttrUpdate } from '../../emit-reactive.ts'
+import { emitDedupedAttrUpdate, DEDUP_STORE_DECL } from '../../emit-reactive.ts'
 import { emitMultiRootTemplateCloneLines, namespaceWrapForTemplate } from './template-parse.ts'
 import { emitLoopChildRefs } from './loop.ts'
 import { claimPlanLiteral, claimWriterVarName, type ClaimSlotSpec } from './claim-plan.ts'
@@ -50,18 +42,13 @@ export function stringifyInnerLoops(
   pc?: string,
 ): void {
   for (const inner of plan) {
-    if (inner.emit.mode === 'reactive') {
-      emitReactive(lines, inner, indent, pc)
-    } else {
-      emitStatic(lines, inner, indent, pc)
-    }
+    emitReactive(lines, inner, indent, pc)
   }
 }
 
 function emitReactive(lines: string[], inner: InnerLoopPlan, indent: string, pc: string | undefined): void {
   const uid = inner.uidSuffix
   const emit = inner.emit
-  if (emit.mode !== 'reactive') return // narrow
 
   lines.push(`${indent}// Reactive inner loop: ${inner.arraySrc}`)
   lines.push(`${indent}{ const __ic${uid} = ${inner.containerExpr}`)
@@ -108,6 +95,8 @@ function emitReactive(lines: string[], inner: InnerLoopPlan, indent: string, pc:
       [...emit.events],
       inner.outerLoopParam,
       inner.outerLoopParamBindings,
+      false,
+      inner.outerLoopIndex,
     )
   }
   if (inner.childLevels.length > 0) {
@@ -132,11 +121,13 @@ function emitReactive(lines: string[], inner: InnerLoopPlan, indent: string, pc:
       lines.push(`${indent}  createEffect(() => { ${writer}('${text.slotId}', String(${text.wrappedExpression})) }${profileBindingId(pc, text.slotId)})`)
     }
   }
+  if (emit.reactiveAttrs.length > 0) lines.push(`${indent}  ${DEDUP_STORE_DECL}`)
+  let attrOrdinal = 0
   for (const attr of emit.reactiveAttrs) {
     const targetVar = `__ta_${attr.slotId.replace(/[^a-zA-Z0-9]/g, '_')}`
     lines.push(`${indent}  { const ${targetVar} = qsa(__innerEl${uid}, '[bf="${attr.slotId}"]')`)
     lines.push(`${indent}  if (${targetVar}) createEffect(() => {`)
-    for (const stmt of emitAttrUpdate(targetVar, attr.attrName, attr.wrappedExpression, attr.meta)) {
+    for (const stmt of emitDedupedAttrUpdate(targetVar, attr.attrName, attr.wrappedExpression, attr.meta, attrOrdinal++)) {
       lines.push(`${indent}    ${stmt}`)
     }
     lines.push(`${indent}  }${profileBindingId(pc, attr.slotId)}) }`)
@@ -146,7 +137,13 @@ function emitReactive(lines: string[], inner: InnerLoopPlan, indent: string, pc:
   // ternary. Mirrors `stringifyBranchInnerLoops`'s identical call for a
   // branch-scoped inner loop's own conditionals.
   if (emit.conditionals.length > 0) {
-    stringifyLoopChildConditionals(lines, emit.conditionals, `${indent}  `, pc)
+    // This inner loop's own preamble (`preludeStatements` above) is not a
+    // single re-runnable string like the outer row's `mapPreambleWrapped`,
+    // so there is nothing correct to thread here — `readsPreamble &&
+    // mapPreambleWrapped`'s guard downstream makes this `undefined` a
+    // no-op, exactly as before this fix (inner-loop preambles are out of
+    // scope — see PR notes on #2596 follow-up).
+    stringifyLoopChildConditionals(lines, emit.conditionals, `${indent}  `, pc, undefined)
   }
   // Imperative ref callbacks fire on every renderItem invocation, which
   // means every mount: SSR hydration, initial CSR creation, and same-key
@@ -163,46 +160,3 @@ function emitReactive(lines: string[], inner: InnerLoopPlan, indent: string, pc:
   // instead of the default `data-key`.
   lines.push(`${indent}}, '${inner.markerId}'${mapArrayKeyArgs(profileBindingId(pc, inner.slotId), !!emit.wrappedKey, inner.keyDepth)}) }`)
 }
-
-function emitStatic(lines: string[], inner: InnerLoopPlan, indent: string, pc: string | undefined): void {
-  const uid = inner.uidSuffix
-  const emit = inner.emit
-  if (emit.mode !== 'static') return
-
-  lines.push(`${indent}// Initialize ${inner.arraySrc} loop components and events`)
-  lines.push(`${indent}{ const __ic${uid} = ${inner.containerExpr}`)
-  // Guard: inner array may be undefined when inside a conditional branch.
-  lines.push(`${indent}if (__ic${uid} && ${inner.arrayExpr}) ${inner.arrayExpr}.forEach((${inner.param}, __innerIdx${uid}) => {`)
-  lines.push(`${indent}  const __innerEl${uid} = __ic${uid}.children[__innerIdx${uid}]`)
-  lines.push(`${indent}  if (!__innerEl${uid}) return`)
-  // Body-entry statements: inner-`.map()` preamble locals (raw, since the
-  // forEach param is the literal item — #1064). Emitted before component
-  // and event setup so their prop getters / handlers resolve the locals.
-  for (const stmt of emit.preludeStatements) {
-    lines.push(`${indent}  ${stmt}`)
-  }
-  if (emit.rawKey) {
-    lines.push(`${indent}  __innerEl${uid}.setAttribute('${keyAttrName(inner.keyDepth)}', String(${emit.rawKey}))`)
-  }
-  emitComponentAndEventSetup(
-    lines,
-    `${indent}  `,
-    `__innerEl${uid}`,
-    [...emit.components],
-    [...emit.events],
-    inner.outerLoopParam,
-    inner.outerLoopParamBindings,
-  )
-  if (inner.childLevels.length > 0) {
-    stringifyInnerLoops(lines, inner.childLevels, `${indent}  `, pc)
-  }
-  // Imperative ref callbacks for static inner loops — fire once per
-  // forEach iteration (#1244). Static arrays don't reactively re-iterate,
-  // so this is effectively a one-shot per item.
-  emitLoopChildRefs(lines, emit.childRefs, {
-    indent: `${indent}  `,
-    elVar: `__innerEl${uid}`,
-    bodyIsMultiRoot: false,
-  })
-  lines.push(`${indent}}) }`)
-}

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

@@ -29,7 +29,7 @@
  */
 
 import { emitRefCall, varSlotId } from '../../utils.ts'
-import { emitAttrUpdate } from '../../emit-reactive.ts'
+import { emitDedupedAttrUpdate, DEDUP_STORE_DECL } from '../../emit-reactive.ts'
 import type { InsertPlan, InsertArm, ArmBody, ScopeRef } from '../plan/types.ts'
 import { stringifyBranchLoops } from './branch-loop.ts'
 import { emitListenerLine } from './event-listener.ts'
@@ -163,10 +163,12 @@ function emitArmBody(
     const v = varSlotId(slotId)
     const elVar = `__ra_${v}`
     lines.push(`${indent}{ const ${elVar} = qsa(__branchScope, '[bf="${slotId}"]')`)
+    lines.push(`${indent}${DEDUP_STORE_DECL}`)
     lines.push(`${indent}if (${elVar}) {`)
+    let ordinal = 0
     for (const attr of attrs) {
       lines.push(`${indent}  __disposers.push(createDisposableEffect(() => {`)
-      for (const stmt of emitAttrUpdate(elVar, attr.attrName, attr.expression, attr)) {
+      for (const stmt of emitDedupedAttrUpdate(elVar, attr.attrName, attr.expression, attr, ordinal++)) {
         lines.push(`${indent}    ${stmt}`)
       }
       lines.push(`${indent}  }${bindingBfId(slotId)}))`)

package/src/ir-to-client-js/control-flow/stringify/lazy-row.ts

@@ -60,7 +60,7 @@
  */
 
 import { isBooleanAttr } from '../../../html-constants.ts'
-import { emitAttrUpdate } from '../../emit-reactive.ts'
+import { emitDedupedAttrUpdate, dedupGuard } from '../../emit-reactive.ts'
 import { toHtmlAttrName } from '../../utils.ts'
 import type { SkeletonSlotPaths } from '../../html-template.ts'
 import { claimPlanLiteral, type ClaimSlotSpec } from './claim-plan.ts'
@@ -458,11 +458,13 @@ function emitConditional(
   lines.push(`${ind}} }`)
 }
 
-/** `entry.last`-backed dedup test. `in` (not a truthiness check) so a
- *  legitimately `undefined` value still records and still writes once. */
-function dedupGuard(ordinal: number): string {
-  return `!(${ordinal} in __l) || !Object.is(__l[${ordinal}], __x)`
-}
+// `dedupGuard` (the `entry.last`-backed dedup test) and the actual guarded
+// write now live in `emit-reactive.ts` as `emitDedupedAttrUpdate` (#2869) —
+// shared with every eager reactive-attr emission site. This module's only
+// remaining substrate-specific piece is WHERE `__l` comes from: the
+// reconciler's `entry.last` (see the per-mode `applyItem`/`applyOuter`
+// callers below), not a closure-local `const __l = []`, because those are
+// separate invocations with no shared closure of their own to own it.
 
 function emitAttrBinding(
   lines: string[],
@@ -474,21 +476,16 @@ function emitAttrBinding(
   // plain read. An ADOPTED row starts with an EMPTY `refs` array and each
   // binding claims its OWN slot on first use — see `elementAccess`.
   const target = mode === 'create' ? `__r[${a.refIndex}]` : elementAccess(a)
-  lines.push(`${ind}{ const __t = ${target}`)
-  lines.push(`${ind}if (__t) {`)
-  lines.push(`${ind}  const __x = ${a.wrappedExpression}`)
   const guard = mode === 'create'
     ? null
     : mode === 'item'
       ? dedupGuard(a.ordinal)
       : `__seed ? (${seedDiffersExpr('__t', a)}) : (${dedupGuard(a.ordinal)})`
-  const writeIndent = guard ? `${ind}    ` : `${ind}  `
-  if (guard) lines.push(`${ind}  if (${guard}) {`)
-  for (const stmt of emitAttrUpdate('__t', a.attrName, '__x', a.meta)) {
-    lines.push(`${writeIndent}${stmt}`)
+  lines.push(`${ind}{ const __t = ${target}`)
+  lines.push(`${ind}if (__t) {`)
+  for (const stmt of emitDedupedAttrUpdate('__t', a.attrName, a.wrappedExpression, a.meta, a.ordinal, guard)) {
+    lines.push(`${ind}  ${stmt}`)
   }
-  if (guard) lines.push(`${ind}  }`)
-  lines.push(`${ind}  __l[${a.ordinal}] = __x`)
   lines.push(`${ind}} }`)
 }