@barefootjs/xslate 0.18.3 → 0.18.5

package/dist/index.js

@@ -187365,7 +187365,7 @@ function isAriaBooleanAttr(name) {
 }
 
 // src/adapter/xslate-adapter.ts
-import { BF_SLOT, BF_COND, BF_REGION } from "@barefootjs/shared";
+import { BF_SLOT, BF_COND, BF_REGION, escapeHtml } from "@barefootjs/shared";
 
 // src/adapter/lib/constants.ts
 var XSLATE_TEMPLATE_PRIMITIVES = {
@@ -187374,7 +187374,10 @@ var XSLATE_TEMPLATE_PRIMITIVES = {
   Number: { arity: 1, emit: (args) => `$bf.number(${args[0]})` },
   "Math.floor": { arity: 1, emit: (args) => `$bf.floor(${args[0]})` },
   "Math.ceil": { arity: 1, emit: (args) => `$bf.ceil(${args[0]})` },
-  "Math.round": { arity: 1, emit: (args) => `$bf.round(${args[0]})` }
+  "Math.round": { arity: 1, emit: (args) => `$bf.round(${args[0]})` },
+  "Math.min": { arity: 2, emit: (args) => `$bf.min(${args[0]}, ${args[1]})` },
+  "Math.max": { arity: 2, emit: (args) => `$bf.max(${args[0]}, ${args[1]})` },
+  "Math.abs": { arity: 1, emit: (args) => `$bf.abs(${args[0]})` }
 };
 var XSLATE_PRIMITIVE_EMIT_MAP = Object.fromEntries(Object.entries(XSLATE_TEMPLATE_PRIMITIVES).map(([k, v]) => [k, v.emit]));
 
@@ -187479,6 +187482,12 @@ function renderArrayMethod(method, object, args, emit) {
       const recv = emit(object);
       return `$bf.trim(${recv})`;
     }
+    case "trimStart":
+    case "trimEnd": {
+      const fn = method === "trimStart" ? "trim_start" : "trim_end";
+      const recv = emit(object);
+      return `$bf.${fn}(${recv})`;
+    }
     case "toFixed": {
       const recv = emit(object);
       const digits = args.length >= 1 ? emit(args[0]) : "0";
@@ -187512,6 +187521,12 @@ function renderArrayMethod(method, object, args, emit) {
       const newS = emit(args[1]);
       return `$bf.replace(${recv}, ${oldS}, ${newS})`;
     }
+    case "replaceAll": {
+      const recv = emit(object);
+      const oldS = emit(args[0]);
+      const newS = emit(args[1]);
+      return `$bf.replace_all(${recv}, ${oldS}, ${newS})`;
+    }
     case "repeat": {
       const recv = emit(object);
       const count = args.length === 0 ? "0" : emit(args[0]);
@@ -187611,6 +187626,8 @@ function renderFlatMethod(recv, depth, emit) {
 
 // src/adapter/expr/emitters.ts
 import {
+  groupBinaryOperand,
+  isStringConcatBinary,
   identifierPath,
   matchSearchParamsMethodCall,
   sortComparatorFromArrow
@@ -187653,7 +187670,7 @@ class XslateFilterEmitter {
       return "nil";
     return String(value);
   }
-  member(object, property, _computed, emit) {
+  member(object, property, _computed, _optional, emit) {
     if (property === "length") {
       return `$bf.length(${emit(object)})`;
     }
@@ -187679,8 +187696,11 @@ class XslateFilterEmitter {
     return arg;
   }
   binary(op, left, right, emit) {
-    const l = emit(left);
-    const r = emit(right);
+    const l = groupBinaryOperand(left, emit(left));
+    const r = groupBinaryOperand(right, emit(right));
+    if (isStringConcatBinary(op, left, right, this.isStringName)) {
+      return `${l} ~ ${r}`;
+    }
     const opMap = {
       "===": "==",
       "!==": "!=",
@@ -187762,7 +187782,7 @@ class XslateTopLevelEmitter {
       return "nil";
     return String(value);
   }
-  member(object, property, _computed, emit) {
+  member(object, property, _computed, _optional, emit) {
     if (object.kind === "identifier" && object.name === "props") {
       return `$${property}`;
     }
@@ -187809,8 +187829,11 @@ class XslateTopLevelEmitter {
     return arg;
   }
   binary(op, left, right, emit) {
-    const l = emit(left);
-    const r = emit(right);
+    const l = groupBinaryOperand(left, emit(left));
+    const r = groupBinaryOperand(right, emit(right));
+    if (isStringConcatBinary(op, left, right, (n) => this.ctx._isStringValueName(n))) {
+      return `${l} ~ ${r}`;
+    }
     const opMap = {
       "===": "==",
       "!==": "!=",
@@ -188200,6 +188223,7 @@ class XslateAdapter extends BaseAdapter {
   options;
   errors = [];
   inLoop = false;
+  currentLoopKeyDepth = 0;
   propsObjectName = null;
   propsParams = [];
   booleanTypedProps = new Set;
@@ -188276,7 +188300,7 @@ class XslateAdapter extends BaseAdapter {
     return this.renderElement(node);
   }
   emitText(node) {
-    return node.value;
+    return escapeHtml(node.value);
   }
   emitExpression(node) {
     return this.renderExpression(node);
@@ -188500,9 +188524,12 @@ ${whenTrue}
     }
     const param = loop.param;
     const renderedChildren = this.renderChildren(loop.children);
-    const loopVar = loop.iterationShape === "keys" ? "__bf_item" : supportableDestructure ? "__bf_item" : param;
+    const loopVar = loop.objectIteration === "entries" ? "__bf_pair" : loop.objectIteration ? param : loop.iterationShape === "keys" ? "__bf_item" : supportableDestructure ? "__bf_item" : param;
     const indexLocalLines = [];
-    if (loop.iterationShape === "keys") {
+    if (loop.objectIteration === "entries") {
+      indexLocalLines.push(`: my $${loop.index ?? param} = $${loopVar}.key;`);
+      indexLocalLines.push(`: my $${param} = $${loopVar}.value;`);
+    } else if (loop.objectIteration) {} else if (loop.iterationShape === "keys") {
       indexLocalLines.push(`: my $${param} = $~${loopVar}.index;`);
     } else if (loop.index) {
       indexLocalLines.push(`: my $${loop.index} = $~${loopVar}.index;`);
@@ -188522,13 +188549,17 @@ ${whenTrue}
     }
     const prevInLoop = this.inLoop;
     this.inLoop = true;
+    const prevLoopKeyDepth = this.currentLoopKeyDepth;
+    this.currentLoopKeyDepth = loop.depth;
     const childrenUnderLoop = this.renderChildren(loop.children);
+    this.currentLoopKeyDepth = prevLoopKeyDepth;
     this.inLoop = prevInLoop;
     const bodyChildren = loop.bodyIsItemConditional && loop.key ? `<: $bf.comment("loop-i:" ~ ${this.convertExpressionToKolon(loop.key)}) | mark_raw :>
 ${childrenUnderLoop}` : childrenUnderLoop;
     const lines = [];
     lines.push(`<: $bf.comment("loop:${loop.markerId}") | mark_raw :>`);
-    lines.push(`: for ${array} -> $${loopVar} {`);
+    const forHeader = loop.objectIteration === "entries" ? `: for ${array}.kv() -> $${loopVar} {` : loop.objectIteration === "keys" ? `: for ${array}.keys() -> $${loopVar} {` : loop.objectIteration === "values" ? `: for ${array}.values() -> $${loopVar} {` : `: for ${array} -> $${loopVar} {`;
+    lines.push(forHeader);
     for (const il of indexLocalLines)
       lines.push(il);
     if (loop.filterPredicate) {
@@ -188599,9 +188630,20 @@ ${childrenUnderLoop}` : childrenUnderLoop;
   renderComponent(comp) {
     const segments = [{ kind: "entries", parts: [] }];
     const currentEntries = () => this.componentPropSegmentEntries(segments);
+    const namedSlotMacros = [];
     for (const p of comp.props) {
       if ((p.name.match(/^on[A-Z]/) || p.name === "ref") && p.value.kind === "expression")
         continue;
+      if (p.value.kind === "jsx-children" && p.name !== "children") {
+        const prevInLoop = this.inLoop;
+        this.inLoop = false;
+        const slotBody = this.renderChildren(p.value.children);
+        this.inLoop = prevInLoop;
+        const macroName = `bf_prop_${this.childrenCaptureCounter++}`;
+        namedSlotMacros.push(`<: macro ${macroName} -> () { :>${slotBody}<: } :>`);
+        currentEntries().push(`${kolonHashKey(p.name)} => ${macroName}()`);
+        continue;
+      }
       if (p.value.kind === "spread") {
         const trimmed = p.value.expr.trim();
         if (this.propsObjectName && this.propsObjectName === trimmed) {
@@ -188630,11 +188672,11 @@ ${childrenUnderLoop}` : childrenUnderLoop;
       const macroName = `bf_children_${comp.slotId ?? "c" + this.childrenCaptureCounter++}`;
       currentEntries().push(`children => ${macroName}()`);
       const dict = this.combineComponentPropSegments(segments);
-      return `<: macro ${macroName} -> () { :>${childrenBody}<: } :><: $bf.render_child('${tplName}', ${dict}) | mark_raw :>`;
+      return `${namedSlotMacros.join("")}<: macro ${macroName} -> () { :>${childrenBody}<: } :><: $bf.render_child('${tplName}', ${dict}) | mark_raw :>`;
     }
     const isEmpty = segments.every((s) => s.kind === "entries" && s.parts.length === 0);
     const hashEntries = isEmpty ? "" : `, ${this.combineComponentPropSegments(segments)}`;
-    return `<: $bf.render_child('${tplName}'${hashEntries}) | mark_raw :>`;
+    return `${namedSlotMacros.join("")}<: $bf.render_child('${tplName}'${hashEntries}) | mark_raw :>`;
   }
   childrenCaptureCounter = 0;
   presenceVarCounter = 0;
@@ -188679,7 +188721,7 @@ ${alternate}
 ${children}`;
   }
   elementAttrEmitter = {
-    emitLiteral: (value, name) => `${name}="${value.value}"`,
+    emitLiteral: (value, name) => `${name}="${escapeHtml(value.value)}"`,
     emitExpression: (value, name) => {
       if (name === "style") {
         const css = this.tryLowerStyleObject(value.expr);
@@ -188786,9 +188828,10 @@ ${name}="<: ${val} :>"
       let attrName;
       if (attr.name === "className")
         attrName = "class";
-      else if (attr.name === "key")
-        attrName = "data-key";
-      else
+      else if (attr.name === "key") {
+        const depth = this.currentLoopKeyDepth;
+        attrName = depth > 0 ? `data-key-${depth}` : "data-key";
+      } else
         attrName = attr.name;
       const lowered = emitAttrValue(attr.value, this.elementAttrEmitter, attrName);
       if (lowered)
@@ -188875,6 +188918,7 @@ ${reason}` : "";
       _resolveModuleStringConst: (name) => this._resolveModuleStringConst(name),
       _resolveLiteralConst: (name) => this._resolveLiteralConst(name),
       _resolveStaticRecordLiteral: (o, k) => this._resolveStaticRecordLiteral(o, k),
+      _isStringValueName: (name) => this._isStringValueName(name),
       _recordExprBF101: (message, reason) => this._recordExprBF101(message, reason),
       _renderKolonFilterExprPublic: (e, p) => this._renderKolonFilterExprPublic(e, p)
     };
@@ -189028,25 +189072,10 @@ var conformancePins = {
     { 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" }],
-  "string-replaceall": [{ code: "BF101", severity: "error" }]
+  "dangerous-inner-html": [{ code: "BF101", severity: "error" }]
 };
 // src/render-divergences.ts
-var renderDivergences = {
-  "arithmetic-text": "`(count() + 2) * 3` renders 10 instead of 18 — the parenthesised sub-expression loses its grouping (silent wrong arithmetic)",
-  "string-concat-plus": "`'Hello, ' + name` numeric-coerces through Perl's `+` (needs `.`/`~` concat)",
-  "html-entity-text": "`&copy;` in JSX literal text: Hono decodes to `©`, this adapter re-emits the raw entity — same DOM, different bytes",
-  "math-methods": "Math.min/max/abs over a signal render empty (only Math.floor is in the template-primitive registry)",
-  "boolean-attr-literals": 'camelCase boolean alias `readOnly`: Hono SSRs `readOnly="true"`, this adapter emits bare presence',
-  "camelcase-attributes": "`htmlFor` is not lowered to `for` (Hono maps it)",
-  "static-attr-escape": 'static attribute values are not HTML-escaped (`title="Fish & Chips"` emitted raw; Hono escapes)',
-  "svg-icon": "SVG camelCase presentation attrs (`strokeWidth`, `strokeLinecap`) pass through unmapped; Hono lowers to kebab-case",
-  "object-entries-map": "`Object.entries(prop).map(([k, v]) => …)` renders an EMPTY list — the object-shaped prop silently produces zero iterations",
-  "nested-loop-outer-binding": "nested-loop inner items carry `data-key` where the reference emits the depth-suffixed `data-key-1`",
-  "jsx-element-prop": "a JSX element passed as a NON-children prop renders an empty slot — the element value is silently dropped",
-  "string-slice": "`.slice()` on a STRING misfires through the array slice helper",
-  "string-trim-sided": "`.trimStart()` / `.trimEnd()` render empty (no lowering)"
-};
+var renderDivergences = {};
 export {
   xslateAdapter,
   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,iBA2B/B,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,iBAAsB,CAAA"}

package/lib/BarefootJS/Backend/Xslate.pm

@@ -1,5 +1,5 @@
 package BarefootJS::Backend::Xslate;
-our $VERSION = "0.18.2";
+our $VERSION = "0.18.4";
 use strict;
 use warnings;
 use utf8;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@barefootjs/xslate",
-  "version": "0.18.3",
+  "version": "0.18.5",
   "description": "Text::Xslate (Kolon) adapter for BarefootJS — compiles IR to .tx templates and ships the Xslate rendering backend; runs under any PSGI/Plack app",
   "type": "module",
   "main": "./dist/index.js",
@@ -55,14 +55,14 @@
     "directory": "packages/adapter-xslate"
   },
   "dependencies": {
-    "@barefootjs/shared": "0.18.3"
+    "@barefootjs/shared": "0.18.5"
   },
   "peerDependencies": {
     "@barefootjs/jsx": ">=0.2.0"
   },
   "devDependencies": {
     "@barefootjs/adapter-tests": "0.1.0",
-    "@barefootjs/jsx": "0.18.3",
+    "@barefootjs/jsx": "0.18.5",
     "typescript": "^5.0.0"
   }
 }

package/src/__tests__/xslate-adapter.test.ts

@@ -396,6 +396,26 @@ export { A }
   })
 })
 
+describe('XslateAdapter - named-slot capture identifier safety (#2168 jsx-element-prop)', () => {
+  // A JSX-valued prop under a hyphenated name (`data-slot`, a valid JSX
+  // attribute name) must not leak into the Kolon macro's identifier — Kolon
+  // macro names can't contain `-`. The macro name is purely counter-based
+  // (never derived from the prop name); the hash KEY passed to
+  // `render_child` still carries the real name, quoted via `kolonHashKey`.
+  test('a hyphenated prop name does not appear in the macro name', () => {
+    const { template } = compileAndGenerate(`
+function Card(props) { return null }
+export function Parent() {
+  return <Card data-slot={<strong>Title</strong>}>text</Card>
+}
+`)
+    expect(template).toContain('<: macro bf_prop_0 -> ()')
+    expect(template).toContain("'data-slot' => bf_prop_0()")
+    expect(template).not.toContain('data-slot -> ()')
+    expect(template).not.toContain('data-slot_')
+  })
+})
+
 // #2038 nested-callback-predicate loudness is pinned at the shared
 // conformance layer: `filter-nested-callback-predicate` /
 // `filter-nested-find-predicate` (BF101 via `expectedDiagnostics` above) and

package/src/adapter/emit-context.ts

@@ -42,6 +42,9 @@ export interface XslateEmitContext {
    */
   _resolveStaticRecordLiteral(objectName: string, key: string): string | null
 
+  /** Whether a getter/prop name resolves to a string-typed SSR value. */
+  _isStringValueName(name: string): boolean
+
   /** Record a BF101 unsupported-expression diagnostic. */
   _recordExprBF101(message: string, reason?: string): void
 

package/src/adapter/expr/array-method.ts

@@ -89,6 +89,15 @@ export function renderArrayMethod(
       const recv = emit(object)
       return `$bf.trim(${recv})`
     }
+    case 'trimStart':
+    case 'trimEnd': {
+      // `.trimStart()` / `.trimEnd()` — the one-sided siblings of
+      // `.trim()` (#2183 follow-up). Dedicated `$bf.trim_start` /
+      // `$bf.trim_end` helpers, not `$bf.trim` with a flag.
+      const fn = method === 'trimStart' ? 'trim_start' : 'trim_end'
+      const recv = emit(object)
+      return `$bf.${fn}(${recv})`
+    }
     case 'toFixed': {
       // `.toFixed(digits?)` — `$bf.to_fixed` mirrors JS rounding +
       // zero-padding (default 0 digits). #1897.
@@ -124,6 +133,16 @@ export function renderArrayMethod(
       const newS = emit(args[1])
       return `$bf.replace(${recv}, ${oldS}, ${newS})`
     }
+    case 'replaceAll': {
+      // `.replaceAll(old, new)` — string-pattern form, EVERY occurrence,
+      // via the dedicated `$bf.replace_all` helper (not `$bf.replace`
+      // with a flag) — the regex-pattern form is refused upstream at
+      // the parser, same as `.replace`. See #2182.
+      const recv = emit(object)
+      const oldS = emit(args[0])
+      const newS = emit(args[1])
+      return `$bf.replace_all(${recv}, ${oldS}, ${newS})`
+    }
     case 'repeat': {
       const recv = emit(object)
       const count = args.length === 0 ? '0' : emit(args[0])

package/src/adapter/expr/emitters.ts

@@ -11,7 +11,8 @@
  *     the adapter only through the narrow `XslateEmitContext` seam.
  */
 
-import {
+import { groupBinaryOperand,
+  isStringConcatBinary,
   type ParsedExprEmitter,
   type HigherOrderMethod,
   type ArrayMethod,
@@ -93,7 +94,7 @@ export class XslateFilterEmitter implements ParsedExprEmitter {
     return String(value)
   }
 
-  member(object: ParsedExpr, property: string, _computed: boolean, emit: (e: ParsedExpr) => string): string {
+  member(object: ParsedExpr, property: string, _computed: boolean, _optional: boolean, emit: (e: ParsedExpr) => string): string {
     // `.length` — route through `$bf.length` (handles both array element
     // count and string char count, JS-compatibly). Kolon's builtin `.size()`
     // is array-only and faults on a string.
@@ -130,8 +131,17 @@ export class XslateFilterEmitter implements ParsedExprEmitter {
   }
 
   binary(op: string, left: ParsedExpr, right: ParsedExpr, emit: (e: ParsedExpr) => string): string {
-    const l = emit(left)
-    const r = emit(right)
+    // Preserve source grouping: a compound operand re-emitted as infix
+    // text is otherwise re-parsed under THIS language's precedence —
+    // `(count() + 2) * 3` would silently become `count + 2 * 3` (#2173).
+    const l = groupBinaryOperand(left, emit(left))
+    const r = groupBinaryOperand(right, emit(right))
+    // JS `+` with a string-typed operand is CONCATENATION, not addition —
+    // Kolon's `+` is numeric-only and coerces `'Hello, ' + $name` to 0
+    // (#2176). Lower to Kolon's `~` concat operator.
+    if (isStringConcatBinary(op, left, right, this.isStringName)) {
+      return `${l} ~ ${r}`
+    }
     // Kolon's `==` / `!=` are value-equality operators that compare strings
     // and numbers correctly — unlike Perl's numeric `==` (which the Mojo
     // adapter must steer around with `eq`/`ne`). Kolon has no `eq`/`ne`
@@ -253,7 +263,7 @@ export class XslateTopLevelEmitter implements ParsedExprEmitter {
     return String(value)
   }
 
-  member(object: ParsedExpr, property: string, _computed: boolean, emit: (e: ParsedExpr) => string): string {
+  member(object: ParsedExpr, property: string, _computed: boolean, _optional: boolean, emit: (e: ParsedExpr) => string): string {
     // `props.x` flattens to the bare `$x` the SSR caller binds each prop to
     // (props arrive as individual top-level vars, not a `$props` hashref).
     if (object.kind === 'identifier' && object.name === 'props') {
@@ -322,8 +332,19 @@ export class XslateTopLevelEmitter implements ParsedExprEmitter {
   }
 
   binary(op: string, left: ParsedExpr, right: ParsedExpr, emit: (e: ParsedExpr) => string): string {
-    const l = emit(left)
-    const r = emit(right)
+    // Preserve source grouping: a compound operand re-emitted as infix
+    // text is otherwise re-parsed under THIS language's precedence —
+    // `(count() + 2) * 3` would silently become `count + 2 * 3` (#2173).
+    const l = groupBinaryOperand(left, emit(left))
+    const r = groupBinaryOperand(right, emit(right))
+    // JS `+` with a string-typed operand is CONCATENATION, not addition —
+    // Kolon's `+` is numeric-only and coerces `'Hello, ' + $name` to 0
+    // (#2176). Lower to Kolon's `~` concat operator. The adapter's
+    // string-value registry catches getter/prop operands with no literal
+    // present (`firstName() + lastName()`).
+    if (isStringConcatBinary(op, left, right, n => this.ctx._isStringValueName(n))) {
+      return `${l} ~ ${r}`
+    }
     // Kolon's `==` / `!=` are value-equality operators handling both strings
     // and numbers (unlike Perl's numeric `==`, which the Mojo adapter must
     // route around with `eq`/`ne`). Kolon has no `eq`/`ne` operator, so all

package/src/adapter/lib/constants.ts

@@ -23,6 +23,9 @@ export const XSLATE_TEMPLATE_PRIMITIVES: Record<string, PrimitiveSpec> = {
   'Math.floor':     { arity: 1, emit: (args) => `$bf.floor(${args[0]})` },
   'Math.ceil':      { arity: 1, emit: (args) => `$bf.ceil(${args[0]})` },
   'Math.round':     { arity: 1, emit: (args) => `$bf.round(${args[0]})` },
+  'Math.min':       { arity: 2, emit: (args) => `$bf.min(${args[0]}, ${args[1]})` },
+  'Math.max':       { arity: 2, emit: (args) => `$bf.max(${args[0]}, ${args[1]})` },
+  'Math.abs':       { arity: 1, emit: (args) => `$bf.abs(${args[0]})` },
 }
 
 /**

package/src/adapter/xslate-adapter.ts

@@ -77,7 +77,7 @@ import {
 import { isAriaBooleanAttr, isBooleanResultExpr } from './boolean-result.ts'
 import ts from 'typescript'
 import type { ParsedExpr, LoweringMatcher } from '@barefootjs/jsx'
-import { BF_SLOT, BF_COND, BF_REGION } from '@barefootjs/shared'
+import { BF_SLOT, BF_COND, BF_REGION, escapeHtml } from '@barefootjs/shared'
 
 import type { XslateRenderCtx } from './lib/types.ts'
 import { XSLATE_PRIMITIVE_EMIT_MAP } from './lib/constants.ts'
@@ -176,6 +176,14 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
   private options: Required<XslateAdapterOptions>
   private errors: CompilerError[] = []
   private inLoop: boolean = false
+  /**
+   * `IRLoop.depth` of the loop currently being rendered (save/restore
+   * around `renderChildren(loop.children)`, mirroring `inLoop` above).
+   * `renderAttributes` reads this to derive the `key` → `data-key`/
+   * `data-key-N` suffix — the depth is IR-computed (jsx-to-ir.ts), not
+   * re-derived here (#2168 nested-loop-outer-binding).
+   */
+  private currentLoopKeyDepth = 0
   /**
    * SolidJS-style props identifier (`function(props: P)`) and the
    * analyzer-extracted prop names. Stashed at `generate()` entry so the
@@ -375,7 +383,9 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
   }
 
   emitText(node: IRText): string {
-    return node.value
+    // IRText carries the entity-DECODED value (Phase 1 decodes JSX
+    // character references); re-escape for direct HTML emission.
+    return escapeHtml(node.value)
   }
 
   emitExpression(node: IRExpression): string {
@@ -724,9 +734,13 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
     // For `keys`-shape iterations the callback param IS the index. We iterate
     // the array but bind the loop var to a throwaway and expose the index as
     // `$param`. Kolon's `$~loopvar.index` provides the 0-based index.
-    const loopVar = loop.iterationShape === 'keys'
-      ? '__bf_item'
-      : supportableDestructure ? '__bf_item' : param
+    const loopVar = loop.objectIteration === 'entries'
+      ? '__bf_pair'
+      : loop.objectIteration
+        ? param
+        : loop.iterationShape === 'keys'
+          ? '__bf_item'
+          : supportableDestructure ? '__bf_item' : param
 
     // Index alias: when an explicit `index` param is present (`.map((x, i) =>
     // ...)`) or the iteration is `keys`-shaped, expose it via a `: my` Kolon
@@ -746,7 +760,16 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
     // `segments` (empty at the loop root, per the `LoopParamBinding` jsdoc) —
     // NOT the same as a fixed binding's full-accessor segments.
     const indexLocalLines: string[] = []
-    if (loop.iterationShape === 'keys') {
+    if (loop.objectIteration === 'entries') {
+      // `key`/`value` bind off the `.kv()` pair (see the for-header below)
+      // — no derived `.index` local needed, unlike the array
+      // `iterationShape` cases.
+      indexLocalLines.push(`: my $${loop.index ?? param} = $${loopVar}.key;`)
+      indexLocalLines.push(`: my $${param} = $${loopVar}.value;`)
+    } else if (loop.objectIteration) {
+      // 'keys'/'values': `.keys()`/`.values()` already yield the bound
+      // value directly — no derived local needed either.
+    } else if (loop.iterationShape === 'keys') {
       indexLocalLines.push(`: my $${param} = $~${loopVar}.index;`)
     } else if (loop.index) {
       indexLocalLines.push(`: my $${loop.index} = $~${loopVar}.index;`)
@@ -769,10 +792,13 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
 
     const prevInLoop = this.inLoop
     this.inLoop = true
+    const prevLoopKeyDepth = this.currentLoopKeyDepth
+    this.currentLoopKeyDepth = loop.depth
     // Re-render children now that inLoop is set (so nested components use the
     // loop-child naming convention). renderedChildren above was computed with
     // the previous flag; recompute under the loop flag.
     const childrenUnderLoop = this.renderChildren(loop.children)
+    this.currentLoopKeyDepth = prevLoopKeyDepth
     this.inLoop = prevInLoop
     void renderedChildren
 
@@ -789,7 +815,21 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
     // Scoped per-call-site marker so sibling `.map()`s under the same parent
     // each get their own reconciliation range.
     lines.push(`<: $bf.comment("loop:${loop.markerId}") | mark_raw :>`)
-    lines.push(`: for ${array} -> $${loopVar} {`)
+    // `objectIteration` (#2168 object-entries-map): Kolon has no built-in
+    // hash-destructure `for` target, so `'entries'` iterates `.kv()`
+    // (yielding `{key, value}` pair objects, unpacked via the `: my`
+    // locals above) while `'keys'`/`'values'` iterate `.keys()`/`.values()`
+    // directly. All three are alphabetically sorted by Text::Xslate itself
+    // (verified empirically) — not JS insertion order, a documented known
+    // limitation for out-of-alphabetical-order data, same as Go/Rust.
+    const forHeader = loop.objectIteration === 'entries'
+      ? `: for ${array}.kv() -> $${loopVar} {`
+      : loop.objectIteration === 'keys'
+        ? `: for ${array}.keys() -> $${loopVar} {`
+        : loop.objectIteration === 'values'
+          ? `: for ${array}.values() -> $${loopVar} {`
+          : `: for ${array} -> $${loopVar} {`
+    lines.push(forHeader)
     for (const il of indexLocalLines) lines.push(il)
 
     // Handle filter().map() pattern by wrapping children in if-condition
@@ -932,11 +972,33 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
     type Segment = { kind: 'entries'; parts: string[] } | { kind: 'spread'; expr: string }
     const segments: Segment[] = [{ kind: 'entries', parts: [] }]
     const currentEntries = () => this.componentPropSegmentEntries(segments)
+    // Named JSX-valued props OTHER than the reserved `children`
+    // (`header={<strong>Title</strong>}`, #2168 jsx-element-prop) each get
+    // their own macro, prepended to the final returned string below —
+    // same mechanism as the reserved children macro, just keyed by the
+    // prop's own name instead of `children`.
+    const namedSlotMacros: string[] = []
 
     for (const p of comp.props) {
       // Skip callback props (onXxx) and `ref` — both are client-only for
       // SSR (Hono renders neither; the client JS wires them at hydration).
       if ((p.name.match(/^on[A-Z]/) || p.name === 'ref') && p.value.kind === 'expression') continue
+      if (p.value.kind === 'jsx-children' && p.name !== 'children') {
+        const prevInLoop = this.inLoop
+        this.inLoop = false
+        const slotBody = this.renderChildren(p.value.children)
+        this.inLoop = prevInLoop
+        // Purely counter-based — NOT derived from `p.name` or `comp.slotId`.
+        // A JSX prop name can contain characters (`data-slot`) that aren't a
+        // valid Kolon macro identifier, and `comp.slotId` alone would
+        // collide across two named-slot props on the same component
+        // invocation (unlike the reserved children slot, there's only ever
+        // one of those per invocation).
+        const macroName = `bf_prop_${this.childrenCaptureCounter++}`
+        namedSlotMacros.push(`<: macro ${macroName} -> () { :>${slotBody}<: } :>`)
+        currentEntries().push(`${kolonHashKey(p.name)} => ${macroName}()`)
+        continue
+      }
       if (p.value.kind === 'spread') {
         const trimmed = p.value.expr.trim()
         // SolidJS-style props identifier (`function(props: P)`) has no
@@ -996,12 +1058,12 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
       const macroName = `bf_children_${comp.slotId ?? 'c' + this.childrenCaptureCounter++}`
       currentEntries().push(`children => ${macroName}()`)
       const dict = this.combineComponentPropSegments(segments)
-      return `<: macro ${macroName} -> () { :>${childrenBody}<: } :><: $bf.render_child('${tplName}', ${dict}) | mark_raw :>`
+      return `${namedSlotMacros.join('')}<: macro ${macroName} -> () { :>${childrenBody}<: } :><: $bf.render_child('${tplName}', ${dict}) | mark_raw :>`
     }
 
     const isEmpty = segments.every(s => s.kind === 'entries' && s.parts.length === 0)
     const hashEntries = isEmpty ? '' : `, ${this.combineComponentPropSegments(segments)}`
-    return `<: $bf.render_child('${tplName}'${hashEntries}) | mark_raw :>`
+    return `${namedSlotMacros.join('')}<: $bf.render_child('${tplName}'${hashEntries}) | mark_raw :>`
   }
 
   private childrenCaptureCounter = 0
@@ -1085,7 +1147,7 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
    * AttrValue lowering for intrinsic-element attributes (Kolon).
    */
   private readonly elementAttrEmitter: AttrValueEmitter = {
-    emitLiteral: (value, name) => `${name}="${value.value}"`,
+    emitLiteral: (value, name) => `${name}="${escapeHtml(value.value)}"`,
     emitExpression: (value, name) => {
       // `style={{ … }}` object literal → a CSS string with dynamic values
       // interpolated, instead of refusing the bare object with BF101 (#1322).
@@ -1285,7 +1347,10 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
       // Rewrite JSX special-prop names to their HTML-attribute counterparts.
       let attrName: string
       if (attr.name === 'className') attrName = 'class'
-      else if (attr.name === 'key') attrName = 'data-key'
+      else if (attr.name === 'key') {
+        const depth = this.currentLoopKeyDepth
+        attrName = depth > 0 ? `data-key-${depth}` : 'data-key'
+      }
       else attrName = attr.name
       const lowered = emitAttrValue(attr.value, this.elementAttrEmitter, attrName)
       if (lowered) parts.push(lowered)
@@ -1436,6 +1501,7 @@ export class XslateAdapter extends BaseAdapter implements IRNodeEmitter<XslateRe
       _resolveModuleStringConst: (name) => this._resolveModuleStringConst(name),
       _resolveLiteralConst: (name) => this._resolveLiteralConst(name),
       _resolveStaticRecordLiteral: (o, k) => this._resolveStaticRecordLiteral(o, k),
+      _isStringValueName: (name) => this._isStringValueName(name),
       _recordExprBF101: (message, reason) => this._recordExprBF101(message, reason),
       _renderKolonFilterExprPublic: (e, p) => this._renderKolonFilterExprPublic(e, p),
     }

package/src/conformance-pins.ts

@@ -115,9 +115,4 @@ export const conformancePins: ConformancePins = {
   // the shape loudly instead of emitting entity-escaped markup that
   // silently renders tags as text.
   'dangerous-inner-html': [{ code: 'BF101', severity: 'error' }],
-  // Edge-case sweep (Priority 12): `.replaceAll` has no lowering yet —
-  // only first-occurrence `.replace` is wired to the runtime helpers.
-  // Refused with BF101 rather than reusing the first-only lowering,
-  // which would silently change semantics.
-  'string-replaceall': [{ code: 'BF101', severity: 'error' }],
 }