@barefootjs/jsx 0.26.4 → 0.27.0

package/src/ir-to-client-js/html-template.ts

@@ -126,7 +126,11 @@ export function createTemplateAwareStringProtector(): {
   return { protect, restore, replaceProtectedCall }
 }
 
-const VOID_ELEMENTS = new Set([
+// Exported (not just module-local) so `client-only-elision.ts` (slot
+// unification Step B) can reuse the exact same void-element list when it
+// walks the IR tree computing markerless-eligible child-index paths —
+// duplicating this list would risk the two walks silently drifting apart.
+export const VOID_ELEMENTS = new Set([
   'area', 'base', 'br', 'col', 'embed', 'hr', 'img',
   'input', 'link', 'meta', 'param', 'source', 'track', 'wbr',
 ])
@@ -794,6 +798,16 @@ export function irToHtmlTemplate(node: IRNode, restSpreadNames?: Set<string>, lo
 
     case 'expression': {
       if (node.expr === 'null' || node.expr === 'undefined') return ''
+      // Slot unification Step B (`markerless`, decided once by
+      // `client-only-elision.ts` before this CSR pass runs): drop the
+      // marker pair and fall through to the same bare `${...}` shape the
+      // no-slotId branch below already uses — `elidedPath` (not this
+      // string) is what the claim plan resolves against, so no marker
+      // anchor is needed here at all.
+      if (node.markerless) {
+        const bare = wrapInterpolation(wrapExpr(node.expr))
+        return `\${${bare}}`
+      }
       const inner = wrapInterpolation(wrapExpr(node.expr))
       // Stage 3 / D4 — an element-array child ({out}) built by an arbitrary
       // .map() preamble is an array of HTML strings; join it rather than let
@@ -908,8 +922,8 @@ export function irToHtmlTemplate(node: IRNode, restSpreadNames?: Set<string>, lo
       // (Go's `bf_sort`, etc.) applied the sort separately and
       // hydration only needed to match, but broken on Hono / CSR
       // where the template is the only source of truth. The chain
-      // mirrors `buildChainedArrayExpr` so reconcileList sees the
-      // same array shape this template emits.
+      // mirrors `buildChainedArrayExpr` so mapArray/mapArrayAnchored sees
+      // the same array shape this template emits.
       const rawChainedArray = applyLoopChain(node)
       const { array: iterArray, callbackParam } = applyIterationShape(node, rawChainedArray, indexParam)
       const wrappedArray = wrapExpr(iterArray)
@@ -1120,7 +1134,9 @@ export interface SkeletonSlotPaths {
  * the loop keeps its hoisted-clone fast path, but every slot lookup falls
  * back to `qsa`/`$t`.
  */
-const SKELETON_PATH_HAZARD_TAGS = new Set([
+// Exported for reuse by `client-only-elision.ts` (Step B) — same hazard
+// class, same reasoning, must never drift out of sync with a second copy.
+export const SKELETON_PATH_HAZARD_TAGS = new Set([
   'table', 'thead', 'tbody', 'tfoot', 'caption', 'colgroup', 'col',
   'select', 'optgroup',
   'p',
@@ -1136,7 +1152,7 @@ const SKELETON_PATH_HAZARD_TAGS = new Set([
  * `<dt>` closes the `<dt>`). A skeleton hitting this bails on path
  * computation entirely (see `SKELETON_PATH_HAZARD_TAGS` doc).
  */
-const SKELETON_PATH_FORCE_CLOSE_GROUPS: ReadonlyArray<ReadonlySet<string>> = [
+export const SKELETON_PATH_FORCE_CLOSE_GROUPS: ReadonlyArray<ReadonlySet<string>> = [
   new Set(['a']),
   new Set(['button']),
   new Set(['form']),
@@ -1146,7 +1162,7 @@ const SKELETON_PATH_FORCE_CLOSE_GROUPS: ReadonlyArray<ReadonlySet<string>> = [
   new Set(['li']),
 ]
 
-function skeletonForceCloseGroup(tag: string): number {
+export function skeletonForceCloseGroup(tag: string): number {
   return SKELETON_PATH_FORCE_CLOSE_GROUPS.findIndex(group => group.has(tag))
 }
 
@@ -1204,7 +1220,7 @@ function walkSkeletonPathNode(
 }
 
 /** True if `children` (already flattened) contains anything the HTML parser would foster-parent out of a `<tr>`. */
-function hasForeignTableRowContent(children: readonly IRNode[]): boolean {
+export function hasForeignTableRowContent(children: readonly IRNode[]): boolean {
   for (const child of children) {
     if (child.type === 'text') {
       if (child.value.trim() !== '') return true
@@ -1218,7 +1234,7 @@ function hasForeignTableRowContent(children: readonly IRNode[]): boolean {
 }
 
 /** Splice fragment children inline — a fragment contributes no DOM node of its own. */
-function flattenSkeletonChildren(children: readonly IRNode[]): IRNode[] {
+export function flattenSkeletonChildren(children: readonly IRNode[]): IRNode[] {
   const out: IRNode[] = []
   for (const child of children) {
     if (child.type === 'fragment') {
@@ -2322,7 +2338,11 @@ function generateCsrTemplateWithOpts(node: IRNode, opts: TemplateOptions): strin
     case 'expression':
       if (node.expr === 'null' || node.expr === 'undefined') return ''
       if (node.clientOnly && node.slotId) {
-        return `<!--bf-client:${node.slotId}--><!--/-->`
+        // Ordinary claimed 'text' slot pair (slot unification A3) — matches
+        // the SSR adapters' `renderExpression` byte-for-byte (byte parity):
+        // empty at CSR mount too, since the expression is evaluated only
+        // once init's createEffect runs, same as the SSR case.
+        return `<!--bf:${node.slotId}--><!--/-->`
       }
       {
         const transformed = transformExpr(node.expr, node.templateExpr)

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

@@ -8,13 +8,16 @@ import { isClientBuiltinName } from '../builtins.ts'
 // All exports from @barefootjs/client/runtime that may be used in generated code
 export const RUNTIME_IMPORT_CANDIDATES = [
   'createSignal', 'createMemo', 'createEffect', 'onCleanup', 'onMount',
-  'hydrate', 'insert', 'reconcileElements', 'getLoopChildren', 'getLoopNodes', 'mapArray', 'mapArrayAnchored', 'patchLeaf', 'patchSlotRange', 'createDisposableEffect',
-  'createComponent', 'renderChild', 'registerComponent', 'registerTemplate', 'initChild', 'upsertChild', 'updateClientMarker',
+  'hydrate', 'insert', 'getLoopChildren', 'getLoopNodes', 'mapArray', 'mapArrayAnchored', 'patchLeaf', 'createDisposableEffect',
+  'createComponent', 'renderChild', 'registerComponent', 'registerTemplate', 'initChild', 'upsertChild',
   'createPortal',
   'provideContext', 'createContext', 'useContext',
-  'forwardProps', 'applyRestAttrs', 'splitProps', 'spreadAttrs', 'styleToCss', 'escapeAttr', 'escapeText',
+  'forwardProps', 'applyRestAttrs', 'splitProps', 'spreadAttrs', 'styleToCss', 'escapeAttr', 'escapeText', 'escapeTextOrNode',
   'qsa', 'qsaItem', 'qsaChildScope', 'qsaChildScopes', 'upsertChildItem', '__slot', '__bfSlot', '__bfText',
-  'tAfter',
+  // Claim-plan interpreter (slot unification A2/A3, spec/slot-unification.md)
+  // — the "one claim mechanism" that replaced `patchSlotRange` and
+  // `updateClientMarker` (both deleted) as the content-slot update door.
+  'claimSlots', 'lazySlots',
   // Profile mode (#1690, SR3) — turn-boundary markers around event handlers.
   'beginTurn', 'endTurn',
   // Catalogued `Date` lowering (#2274/#2292) — the client counterpart to

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

@@ -571,8 +571,9 @@ export function collectLoopChildReactiveTexts(
     expression: ({ node: n, scope: insideConditional }) => {
       if (!n.slotId) return
       // #2389 — a preamble-patched region (see `IRLoop.preambleRegions`) has
-      // its own `patchSlotRange`-based effect (`preambleRegions` in the
-      // client-JS loop plan); it must never ALSO become a `reactiveTexts`
+      // its own claimed 'markup'-slot effect (`preambleRegions` in the
+      // client-JS loop plan; slot unification A3, `@barefootjs/client/
+      // runtime/claim-slots.ts`); it must never ALSO become a `reactiveTexts`
       // entry, which would patch it via `.textContent` and corrupt markup
       // (a `joinArrayChild` region's value is raw HTML, not text).
       if (n.preambleRegion) return

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

@@ -255,7 +255,7 @@ export interface LoopCore {
   /**
    * Unique id for this loop's `<!--bf-loop:<id>--> ... <!--bf-/loop:<id>-->`
    * marker pair, threaded from `IRLoop.markerId`. Each `mapArray()` /
-   * `reconcileElements()` call passes this id so sibling loops under the
+   * `mapArrayAnchored()` call passes this id so sibling loops under the
    * same parent reconcile their own range (#1087).
    */
   markerId: string
@@ -609,7 +609,7 @@ export interface TopLevelLoop extends LoopCore {
   // Per-item bindings (events / reactiveAttrs / reactiveTexts / refs / conditionals)
   // now live on `LoopCore.bindings` — see issue #1244 §B.
   isStaticArray: boolean // True if array is a static prop (not a signal)
-  useElementReconciliation?: boolean // True: reconcileElements + composite rendering (native root with child components)
+  useElementReconciliation?: boolean // True: mapArray/mapArrayAnchored + composite rendering (native root with child components)
   /** Inner loop metadata for composite element reconciliation (array, param, key, container) */
   innerLoops?: NestedLoop[]
   /** Offset of this loop's items past its preceding container siblings (#1693). */
@@ -654,6 +654,14 @@ export interface ReactiveAttribute extends AttrMeta {
 export interface ClientOnlyElement {
   slotId: string
   expression: string
+  /**
+   * Slot unification Step B (`spec/slot-unification.md` §3(b), §5 Step B):
+   * copied from `IRExpression.elidedPath` (`client-only-elision.ts`) when
+   * the compiler proved this slot's marker pair can be elided. Absent
+   * (`undefined`) is always safe — the claim plan falls back to `path: []`
+   * / marker-based resolution exactly as before Step B.
+   */
+  elidedPath?: readonly number[]
 }
 
 

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

@@ -180,7 +180,7 @@ export function applyObjectIterationWrap(
 }
 
 /**
- * Build the chained array expression for reconcileList. Thin
+ * Build the chained array expression for mapArray/mapArrayAnchored. Thin
  * adapter over `buildLoopChainExpr` that unpacks the collected
  * `TopLevelLoop` / `BranchLoop` shape into the primitive inputs.
  * Branch loops carry the same `filterPredicate` / `sortComparator`

package/src/jsx-to-ir.ts

@@ -4610,8 +4610,8 @@ function transformMapCall(
   const bodyIsMultiRoot = loopBodyIsMultiRoot(children)
 
   // Determine if array is static (prop) or dynamic (signal/memo).
-  // Static arrays don't need reconcileList — SSR elements are hydrated
-  // directly. Signal / memo arrays need reconcileList for dynamic DOM
+  // Static arrays don't need mapArray/mapArrayAnchored — SSR elements are
+  // hydrated directly. Signal / memo arrays need mapArray for dynamic DOM
   // updates.
   //
   // Solid-style wrap-by-default fallback (#943, follow-up to
@@ -4621,7 +4621,7 @@ function transformMapCall(
   // where `getItems` is an imported helper previously silent-dropped
   // into the static-render path, freezing the SSR-time list on the
   // client. Over-reconciling an array that happens to contain a pure
-  // call costs one extra `reconcileList` per loop; under-reconciling
+  // call costs one extra `mapArray` per loop; under-reconciling
   // is the silent-drop bug this closes.
   //
   // Destructured map params (`([, cfg]) => ...`, `({ a, b }) => ...`,
@@ -4660,8 +4660,9 @@ function transformMapCall(
 
   // Collect nested components for both static and dynamic arrays.
   // Static arrays: needed for initChild hydration.
-  // Dynamic arrays with native root + component descendants: enables reconcileElements
-  // with composite rendering (placeholder + createComponent replacement).
+  // Dynamic arrays with native root + component descendants: enables
+  // mapArray/mapArrayAnchored with composite rendering (placeholder +
+  // createComponent replacement).
   const nestedComponents = collectNestedComponents(children).filter(c => c.name !== childComponent?.name)
 
   return {
@@ -6564,7 +6565,7 @@ function isArrayExprDirectPropRef(arrayExpr: ts.Expression, ctx: TransformContex
 
 /**
  * Check if array expression is a signal or memo getter call.
- * Used to determine if a loop needs reconcileList for dynamic DOM updates.
+ * Used to determine if a loop needs mapArray for dynamic DOM updates.
  * Props and local constants are considered static (don't change at runtime).
  */
 function isSignalOrMemoArray(array: string, ctx: TransformContext): boolean {
@@ -6767,7 +6768,7 @@ function attrValueReactivityProbe(value: AttrValue): string | null {
 
 /**
  * Propagate slotId to loop children that need it.
- * Loops need to use their parent element's slotId for reconcileList.
+ * Loops need to use their parent element's slotId for mapArray.
  * This handles loops directly in children or nested in fragments.
  */
 function propagateSlotIdToLoops(children: IRNode[], slotId: string): void {

package/src/types.ts

@@ -386,7 +386,8 @@ export interface IRExpression {
    * intersect the enclosing loop's `preamble.declaredNames`. Excludes the
    * node from `collectLoopChildReactiveTexts` (which patches via
    * `.textContent`, wrong for markup) regardless of `reactive` / `slotId` —
-   * the region-patch effect (`patchSlotRange`) is its only wiring.
+   * the region-patch effect (a claimed 'markup' slot writer, slot
+   * unification A3) is its only wiring.
    */
   preambleRegion?: boolean
   /** When true, expression calls signal getters or memos (has reactive `foo()` pattern). */
@@ -400,6 +401,28 @@ export interface IRExpression {
    * source of truth for free-reference / reactivity classification.
    */
   origin: OriginInfo
+  /**
+   * Slot unification Step B (`spec/slot-unification.md` §3(b), §5 Step B):
+   * true when this slot's `<!--bf:sN-->…<!--/-->` marker pair can be safely
+   * omitted from BOTH SSR and CSR output, because `elidedPath` already gives
+   * every claimer a real compile-time DOM path to the slot's position.
+   * Decided EXACTLY ONCE, by `client-only-elision.ts`, before either
+   * `adapter.generate()` (SSR) or `generateClientJs()` (CSR) run — every one
+   * of the nine SSR adapters' `renderExpression` and the CSR template
+   * emitters (`html-template.ts`) read this single flag and must never
+   * re-derive their own elision decision. Unset/false is always safe
+   * (keeps markers, today's behavior); only the compiler pass above may
+   * ever set it true.
+   */
+  markerless?: boolean
+  /**
+   * Root-relative child-index path to this slot's position (parent index
+   * chain, LAST element = the index of the slot itself within its parent's
+   * `childNodes`). Valid, and required, only when `markerless` is true —
+   * see `SlotSpec.markerless` in `@barefootjs/client/runtime/claim-slots.ts`
+   * for the claim-time resolve-or-create semantics this path feeds.
+   */
+  elidedPath?: readonly number[]
 }
 
 export interface IRConditional {
@@ -723,7 +746,7 @@ export interface IRLoop {
    * `slotId` is emitted as the usual `<!--bf:sN-->...<!--/-->` marker pair
    * (same door as a reactive text slot — `irToHtmlTemplate` / Hono's
    * `renderExpression` key off `slotId` alone), but the CLIENT wiring is a
-   * distinct `patchSlotRange`-based region-patch effect (`preambleRegions`
+   * distinct claimed 'markup'-slot region-patch effect (`preambleRegions`
    * in the client-JS loop plan), NOT a `reactiveTexts` entry — patching via
    * `.textContent` would escape markup that a `joinArrayChild` region must
    * render raw. `collectLoopChildReactiveTexts` excludes any node collected