@mindees/renderer 0.22.0 → 0.22.2

package/dist/canvas.js

@@ -111,6 +111,11 @@ function createCanvas2DBackend(options = {}) {
 			markDirty();
 		},
 		insert(parent, node, anchor) {
+			if (node.parent) {
+				const prev = node.parent.children;
+				const at = prev.indexOf(node);
+				if (at >= 0) prev.splice(at, 1);
+			}
 			node.parent = parent;
 			const idx = anchor ? parent.children.indexOf(anchor) : -1;
 			if (idx >= 0) parent.children.splice(idx, 0, node);

package/dist/canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas.js","names":[],"sources":["../src/canvas.ts"],"sourcesContent":["/**\n * The **Helix Canvas strand** (spec §6.2) — a retained-mode 2D scene graph driven by the SAME\n * reconciler as the native/DOM strands, painting to a 2D context. You get Flutter-grade pixel control\n * *exactly where you want it*: a `<canvas-rect>`/`<canvas-text>`/… subtree is built + diffed by Helix,\n * and `paint(ctx)` rasterizes it. The 2D context is an interface ({@link Scene2DContext}) — a real\n * `CanvasRenderingContext2D` satisfies it on web today, and a WebGPU rasterizer can drive the same\n * scene graph later without touching app code.\n *\n * @module\n */\n\nimport type { HostBackend } from './backend'\n\n/** The subset of `CanvasRenderingContext2D` the painter uses (so a WebGPU/mock backend can satisfy it). */\nexport interface Scene2DContext {\n  fillStyle: string\n  strokeStyle: string\n  lineWidth: number\n  globalAlpha: number\n  font: string\n  textBaseline: string\n  save(): void\n  restore(): void\n  clearRect(x: number, y: number, w: number, h: number): void\n  fillRect(x: number, y: number, w: number, h: number): void\n  strokeRect(x: number, y: number, w: number, h: number): void\n  beginPath(): void\n  moveTo(x: number, y: number): void\n  lineTo(x: number, y: number): void\n  arc(x: number, y: number, r: number, start: number, end: number): void\n  closePath(): void\n  fill(): void\n  stroke(): void\n  fillText(text: string, x: number, y: number): void\n}\n\n/** A node in the canvas scene graph. */\nexport interface SceneNode {\n  type: string\n  readonly props: Record<string, unknown>\n  text: string\n  readonly isTextNode: boolean\n  parent: SceneNode | null\n  readonly children: SceneNode[]\n}\n\n/** A Canvas2D backend: the reconciler builds the scene; `paint(ctx)` rasterizes it. */\nexport interface Canvas2DBackend extends HostBackend<SceneNode> {\n  /** The scene root (pass to `render(tree, backend, root)`). */\n  readonly root: SceneNode\n  /** Rasterize the whole scene to `ctx` (clears `[0,0,width,height]` first). */\n  paint(ctx: Scene2DContext, width: number, height: number): void\n}\n\nconst num = (v: unknown, fallback = 0): number =>\n  typeof v === 'number' && Number.isFinite(v) ? v : fallback\nconst str = (v: unknown): string | undefined => (typeof v === 'string' ? v : undefined)\n\nfunction makeNode(type: string, isTextNode: boolean, text = ''): SceneNode {\n  return { type, props: {}, text, isTextNode, parent: null, children: [] }\n}\n\n/** Concatenate the immediate text-node children of `node` (how a `canvas-text`'s string content arrives). */\nfunction textOf(node: SceneNode): string {\n  let out = ''\n  for (const c of node.children) if (c.isTextNode) out += c.text\n  return out\n}\n\n/** Draw one scene node (and recurse). Coordinates are absolute (no transform stack in v1). */\nfunction drawNode(ctx: Scene2DContext, node: SceneNode): void {\n  if (node.isTextNode) return\n  const p = node.props\n  const opacity = p.opacity === undefined ? 1 : num(p.opacity, 1)\n  const needsAlpha = opacity !== 1\n  if (needsAlpha) {\n    ctx.save()\n    ctx.globalAlpha *= opacity\n  }\n  const fill = str(p.fill)\n  const stroke = str(p.stroke)\n  const strokeWidth = num(p.strokeWidth, 1)\n\n  switch (node.type) {\n    case 'canvas-rect': {\n      const x = num(p.x)\n      const y = num(p.y)\n      const w = num(p.width)\n      const h = num(p.height)\n      if (fill) {\n        ctx.fillStyle = fill\n        ctx.fillRect(x, y, w, h)\n      }\n      if (stroke) {\n        ctx.strokeStyle = stroke\n        ctx.lineWidth = strokeWidth\n        ctx.strokeRect(x, y, w, h)\n      }\n      break\n    }\n    case 'canvas-circle': {\n      const cx = num(p.x)\n      const cy = num(p.y)\n      const r = num(p.radius)\n      ctx.beginPath()\n      ctx.arc(cx, cy, r, 0, Math.PI * 2)\n      ctx.closePath()\n      if (fill) {\n        ctx.fillStyle = fill\n        ctx.fill()\n      }\n      if (stroke) {\n        ctx.strokeStyle = stroke\n        ctx.lineWidth = strokeWidth\n        ctx.stroke()\n      }\n      break\n    }\n    case 'canvas-line': {\n      ctx.beginPath()\n      ctx.moveTo(num(p.x1), num(p.y1))\n      ctx.lineTo(num(p.x2), num(p.y2))\n      ctx.strokeStyle = stroke ?? fill ?? '#000'\n      ctx.lineWidth = strokeWidth\n      ctx.stroke()\n      break\n    }\n    case 'canvas-text': {\n      const content = textOf(node)\n      if (content) {\n        ctx.font = str(p.font) ?? '16px sans-serif'\n        ctx.textBaseline = str(p.baseline) ?? 'top'\n        ctx.fillStyle = fill ?? '#000'\n        ctx.fillText(content, num(p.x), num(p.y))\n      }\n      break\n    }\n    // 'canvas' (root) and 'canvas-group' just composite their children.\n    default:\n      break\n  }\n  for (const child of node.children) drawNode(ctx, child)\n  if (needsAlpha) ctx.restore()\n}\n\n/**\n * Create a Canvas2D scene backend. Drive it with the reconciler\n * (`render(scene, backend, backend.root)`), then call `backend.paint(ctx, w, h)` to rasterize — on a\n * frame loop for animations, or once for static art. `onDirty` fires after any mutation so a host can\n * schedule a repaint.\n */\nexport function createCanvas2DBackend(options: { onDirty?: () => void } = {}): Canvas2DBackend {\n  const root = makeNode('canvas', false)\n  const markDirty = (): void => options.onDirty?.()\n\n  return {\n    root,\n    createElement: (type) => makeNode(type, false),\n    createText: (value) => makeNode('#text', true, value),\n    setText(node, value) {\n      node.text = value\n      markDirty()\n    },\n    setProp(node, key, value) {\n      if (value === undefined) delete node.props[key]\n      else node.props[key] = value\n      markDirty()\n    },\n    insert(parent, node, anchor) {\n      node.parent = parent\n      const idx = anchor ? parent.children.indexOf(anchor) : -1\n      if (idx >= 0) parent.children.splice(idx, 0, node)\n      else parent.children.push(node)\n      markDirty()\n    },\n    remove(parent, node) {\n      const idx = parent.children.indexOf(node)\n      if (idx >= 0) parent.children.splice(idx, 1)\n      node.parent = null\n      markDirty()\n    },\n    parentOf: (node) => node.parent,\n    nextSibling(node) {\n      const siblings = node.parent?.children\n      if (!siblings) return null\n      const idx = siblings.indexOf(node)\n      return idx >= 0 && idx + 1 < siblings.length ? (siblings[idx + 1] as SceneNode) : null\n    },\n    isText: (node) => node.isTextNode,\n    paint(ctx, width, height) {\n      ctx.clearRect(0, 0, width, height)\n      for (const child of root.children) drawNode(ctx, child)\n    },\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"canvas.js","names":[],"sources":["../src/canvas.ts"],"sourcesContent":["/**\n * The **Helix Canvas strand** (spec §6.2) — a retained-mode 2D scene graph driven by the SAME\n * reconciler as the native/DOM strands, painting to a 2D context. You get Flutter-grade pixel control\n * *exactly where you want it*: a `<canvas-rect>`/`<canvas-text>`/… subtree is built + diffed by Helix,\n * and `paint(ctx)` rasterizes it. The 2D context is an interface ({@link Scene2DContext}) — a real\n * `CanvasRenderingContext2D` satisfies it on web today, and a WebGPU rasterizer can drive the same\n * scene graph later without touching app code.\n *\n * @module\n */\n\nimport type { HostBackend } from './backend'\n\n/** The subset of `CanvasRenderingContext2D` the painter uses (so a WebGPU/mock backend can satisfy it). */\nexport interface Scene2DContext {\n  fillStyle: string\n  strokeStyle: string\n  lineWidth: number\n  globalAlpha: number\n  font: string\n  textBaseline: string\n  save(): void\n  restore(): void\n  clearRect(x: number, y: number, w: number, h: number): void\n  fillRect(x: number, y: number, w: number, h: number): void\n  strokeRect(x: number, y: number, w: number, h: number): void\n  beginPath(): void\n  moveTo(x: number, y: number): void\n  lineTo(x: number, y: number): void\n  arc(x: number, y: number, r: number, start: number, end: number): void\n  closePath(): void\n  fill(): void\n  stroke(): void\n  fillText(text: string, x: number, y: number): void\n}\n\n/** A node in the canvas scene graph. */\nexport interface SceneNode {\n  type: string\n  readonly props: Record<string, unknown>\n  text: string\n  readonly isTextNode: boolean\n  parent: SceneNode | null\n  readonly children: SceneNode[]\n}\n\n/** A Canvas2D backend: the reconciler builds the scene; `paint(ctx)` rasterizes it. */\nexport interface Canvas2DBackend extends HostBackend<SceneNode> {\n  /** The scene root (pass to `render(tree, backend, root)`). */\n  readonly root: SceneNode\n  /** Rasterize the whole scene to `ctx` (clears `[0,0,width,height]` first). */\n  paint(ctx: Scene2DContext, width: number, height: number): void\n}\n\nconst num = (v: unknown, fallback = 0): number =>\n  typeof v === 'number' && Number.isFinite(v) ? v : fallback\nconst str = (v: unknown): string | undefined => (typeof v === 'string' ? v : undefined)\n\nfunction makeNode(type: string, isTextNode: boolean, text = ''): SceneNode {\n  return { type, props: {}, text, isTextNode, parent: null, children: [] }\n}\n\n/** Concatenate the immediate text-node children of `node` (how a `canvas-text`'s string content arrives). */\nfunction textOf(node: SceneNode): string {\n  let out = ''\n  for (const c of node.children) if (c.isTextNode) out += c.text\n  return out\n}\n\n/** Draw one scene node (and recurse). Coordinates are absolute (no transform stack in v1). */\nfunction drawNode(ctx: Scene2DContext, node: SceneNode): void {\n  if (node.isTextNode) return\n  const p = node.props\n  const opacity = p.opacity === undefined ? 1 : num(p.opacity, 1)\n  const needsAlpha = opacity !== 1\n  if (needsAlpha) {\n    ctx.save()\n    ctx.globalAlpha *= opacity\n  }\n  const fill = str(p.fill)\n  const stroke = str(p.stroke)\n  const strokeWidth = num(p.strokeWidth, 1)\n\n  switch (node.type) {\n    case 'canvas-rect': {\n      const x = num(p.x)\n      const y = num(p.y)\n      const w = num(p.width)\n      const h = num(p.height)\n      if (fill) {\n        ctx.fillStyle = fill\n        ctx.fillRect(x, y, w, h)\n      }\n      if (stroke) {\n        ctx.strokeStyle = stroke\n        ctx.lineWidth = strokeWidth\n        ctx.strokeRect(x, y, w, h)\n      }\n      break\n    }\n    case 'canvas-circle': {\n      const cx = num(p.x)\n      const cy = num(p.y)\n      const r = num(p.radius)\n      ctx.beginPath()\n      ctx.arc(cx, cy, r, 0, Math.PI * 2)\n      ctx.closePath()\n      if (fill) {\n        ctx.fillStyle = fill\n        ctx.fill()\n      }\n      if (stroke) {\n        ctx.strokeStyle = stroke\n        ctx.lineWidth = strokeWidth\n        ctx.stroke()\n      }\n      break\n    }\n    case 'canvas-line': {\n      ctx.beginPath()\n      ctx.moveTo(num(p.x1), num(p.y1))\n      ctx.lineTo(num(p.x2), num(p.y2))\n      ctx.strokeStyle = stroke ?? fill ?? '#000'\n      ctx.lineWidth = strokeWidth\n      ctx.stroke()\n      break\n    }\n    case 'canvas-text': {\n      const content = textOf(node)\n      if (content) {\n        ctx.font = str(p.font) ?? '16px sans-serif'\n        ctx.textBaseline = str(p.baseline) ?? 'top'\n        ctx.fillStyle = fill ?? '#000'\n        ctx.fillText(content, num(p.x), num(p.y))\n      }\n      break\n    }\n    // 'canvas' (root) and 'canvas-group' just composite their children.\n    default:\n      break\n  }\n  for (const child of node.children) drawNode(ctx, child)\n  if (needsAlpha) ctx.restore()\n}\n\n/**\n * Create a Canvas2D scene backend. Drive it with the reconciler\n * (`render(scene, backend, backend.root)`), then call `backend.paint(ctx, w, h)` to rasterize — on a\n * frame loop for animations, or once for static art. `onDirty` fires after any mutation so a host can\n * schedule a repaint.\n */\nexport function createCanvas2DBackend(options: { onDirty?: () => void } = {}): Canvas2DBackend {\n  const root = makeNode('canvas', false)\n  const markDirty = (): void => options.onDirty?.()\n\n  return {\n    root,\n    createElement: (type) => makeNode(type, false),\n    createText: (value) => makeNode('#text', true, value),\n    setText(node, value) {\n      node.text = value\n      markDirty()\n    },\n    setProp(node, key, value) {\n      if (value === undefined) delete node.props[key]\n      else node.props[key] = value\n      markDirty()\n    },\n    insert(parent, node, anchor) {\n      // Move-semantics (matches the headless/native/DOM backends): if the node is already mounted,\n      // detach it from its old parent FIRST so a keyed-list reorder MOVES it rather than duplicating\n      // it in the scene graph. The anchor index is read AFTER the detach (it can shift on removal).\n      if (node.parent) {\n        const prev = node.parent.children\n        const at = prev.indexOf(node)\n        if (at >= 0) prev.splice(at, 1)\n      }\n      node.parent = parent\n      const idx = anchor ? parent.children.indexOf(anchor) : -1\n      if (idx >= 0) parent.children.splice(idx, 0, node)\n      else parent.children.push(node)\n      markDirty()\n    },\n    remove(parent, node) {\n      const idx = parent.children.indexOf(node)\n      if (idx >= 0) parent.children.splice(idx, 1)\n      node.parent = null\n      markDirty()\n    },\n    parentOf: (node) => node.parent,\n    nextSibling(node) {\n      const siblings = node.parent?.children\n      if (!siblings) return null\n      const idx = siblings.indexOf(node)\n      return idx >= 0 && idx + 1 < siblings.length ? (siblings[idx + 1] as SceneNode) : null\n    },\n    isText: (node) => node.isTextNode,\n    paint(ctx, width, height) {\n      ctx.clearRect(0, 0, width, height)\n      for (const child of root.children) drawNode(ctx, child)\n    },\n  }\n}\n"],"mappings":"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"}

package/dist/headless.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headless.d.ts","names":[],"sources":["../src/headless.ts"],"mappings":";;;;UAciB,YAAA;EAIf;EAFA,IAAA;EAIA;EAFA,KAAA,EAAO,MAAA;EAIG;EAFV,IAAA;EAIQ;EAFR,QAAA,EAAU,YAAA;EAEU;EAApB,MAAA,EAAQ,YAAA;AAAA;;UAkEO,sBAAA;EAMoB;AAIrC;;;;EAJqC,SAA1B,WAAA,GAAc,YAAY;AAAA;;iBAIrB,qBAAA,CACd,OAAA,GAAS,sBAAA,GACR,mBAAA,CAAoB,YAAA;;iBAwEP,WAAA,CAAY,GAAW;;iBAOvB,kBAAA,CAAmB,IAAA,YAAgB,YAAY"}
+{"version":3,"file":"headless.d.ts","names":[],"sources":["../src/headless.ts"],"mappings":";;;;UAciB,YAAA;EAIf;EAFA,IAAA;EAIA;EAFA,KAAA,EAAO,MAAA;EAIG;EAFV,IAAA;EAIQ;EAFR,QAAA,EAAU,YAAA;EAEU;EAApB,MAAA,EAAQ,YAAA;AAAA;;UA0FO,sBAAA;EAMoB;AAIrC;;;;EAJqC,SAA1B,WAAA,GAAc,YAAY;AAAA;;iBAIrB,qBAAA,CACd,OAAA,GAAS,sBAAA,GACR,mBAAA,CAAoB,YAAA;;iBAwEP,WAAA,CAAY,GAAW;;iBAOvB,kBAAA,CAAmB,IAAA,YAAgB,YAAY"}

package/dist/headless.js

@@ -37,8 +37,27 @@ function serializeHeadless(node, options) {
 	if (node.type === TEXT) return escapeText(node.text);
 	const tag = (options?.mapTag ?? ((t) => t))(node.type);
 	if (!isValidAttrName(tag)) throw new Error(`refusing to serialize unsafe element tag: ${JSON.stringify(tag)}`);
-	return `<${tag}${Object.entries(node.props).filter(([key]) => !isEventProp(key) && isValidAttrName(key)).map(([key, value]) => value === true ? ` ${key}=""` : ` ${key}="${escapeAttr(serializeAttrValue(value))}"`).join("")}>${node.children.map((c) => serializeHeadless(c, options)).join("")}</${tag}>`;
+	const attrs = Object.entries(node.props).filter(([key]) => !isEventProp(key) && isValidAttrName(key)).map(([key, value]) => value === true ? ` ${key}=""` : ` ${key}="${escapeAttr(serializeAttrValue(value))}"`).join("");
+	if (VOID_ELEMENTS.has(tag)) return `<${tag}${attrs}>`;
+	return `<${tag}${attrs}>${node.children.map((c) => serializeHeadless(c, options)).join("")}</${tag}>`;
 }
+/** HTML void elements — serialized with no closing tag and no children (post-`mapTag` names). */
+const VOID_ELEMENTS = new Set([
+	"area",
+	"base",
+	"br",
+	"col",
+	"embed",
+	"hr",
+	"img",
+	"input",
+	"link",
+	"meta",
+	"param",
+	"source",
+	"track",
+	"wbr"
+]);
 /** Create a {@link SerializableBackend} backed by an in-memory tree. */
 function createHeadlessBackend(options = {}) {
 	const backend = {

package/dist/headless.js.map

@@ -1 +1 @@
-{"version":3,"file":"headless.js","names":[],"sources":["../src/headless.ts"],"sourcesContent":["/**\n * Headless host backend — an in-memory host tree, no browser required.\n *\n * This is the **reference backend**: it implements the full {@link HostBackend}\n * (plus {@link SerializableBackend}) so the entire reconciler can be exercised\n * in CI without a DOM. It's also handy for snapshot-testing rendered output.\n *\n * @module\n */\n\nimport type { SerializableBackend, SerializeOptions } from './backend'\nimport { serializeStyle } from './css'\n\n/** A headless host node: an element (with tag/props/children) or a text node. */\nexport interface HeadlessNode {\n  /** `\"#text\"` for text nodes, otherwise the element tag. */\n  type: string\n  /** Applied props (elements only). */\n  props: Record<string, unknown>\n  /** Text content (text nodes only). */\n  text: string\n  /** Child nodes (elements only). */\n  children: HeadlessNode[]\n  /** Back-pointer to the parent, or `null` when detached. */\n  parent: HeadlessNode | null\n}\n\nconst TEXT = '#text'\n\nfunction escapeAttr(value: string): string {\n  return value.replace(/&/g, '&amp;').replace(/\"/g, '&quot;').replace(/</g, '&lt;')\n}\n\nfunction escapeText(value: string): string {\n  return value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')\n}\n\n/**\n * Render an attribute value: a `style` object becomes a CSS string via the SAME serializer\n * the DOM backend uses (kebab-case names + `px` units), so SSR markup matches the hydrated DOM.\n */\nfunction serializeAttrValue(value: unknown): string {\n  if (value && typeof value === 'object') {\n    return serializeStyle(value as Record<string, unknown>)\n  }\n  return String(value)\n}\n\n/**\n * Whether `key` is a safe HTML attribute name. Attribute NAMES are interpolated\n * into markup unescaped, so a name containing `>`, whitespace, quotes, `=`, `/`,\n * etc. could break out of the tag and inject markup (stored XSS when props are\n * built from user/server data). We emit only names that match the HTML name\n * grammar — matching what the DOM's `setAttribute` would accept — and drop the\n * rest, exactly as an invalid name would never reach the DOM either.\n */\nfunction isValidAttrName(key: string): boolean {\n  return /^[A-Za-z_:][\\w:.-]*$/.test(key)\n}\n\n/**\n * Serialize a headless node (and subtree) to HTML. A standalone function, not an\n * object method: the public {@link SerializableBackend.serialize} is typed as a\n * plain function member, so a consumer may legally detach it\n * (`const { serialize } = backend`). Recursing through this lexical helper rather\n * than `this.serialize` keeps it binding-independent.\n */\nfunction serializeHeadless(node: HeadlessNode, options?: SerializeOptions): string {\n  if (node.type === TEXT) return escapeText(node.text)\n  const mapTag = options?.mapTag ?? ((t: string) => t)\n  const tag = mapTag(node.type)\n  // The tag is interpolated into `<tag>`/`</tag>` unescaped, so a tag containing `>`,\n  // whitespace, etc. would break out of the element and inject markup. Reject any tag\n  // that isn't a valid name (same grammar as attribute names) — fail closed.\n  if (!isValidAttrName(tag)) {\n    throw new Error(`refusing to serialize unsafe element tag: ${JSON.stringify(tag)}`)\n  }\n  const attrs = Object.entries(node.props)\n    .filter(([key]) => !isEventProp(key) && isValidAttrName(key))\n    .map(([key, value]) =>\n      // Boolean `true` → a valueless attribute (`disabled=\"\"`), matching the DOM\n      // backend (dom.ts) so SSR markup equals hydrated markup.\n      value === true ? ` ${key}=\"\"` : ` ${key}=\"${escapeAttr(serializeAttrValue(value))}\"`,\n    )\n    .join('')\n  const inner = node.children.map((c) => serializeHeadless(c, options)).join('')\n  return `<${tag}${attrs}>${inner}</${tag}>`\n}\n\n/** Options for {@link createHeadlessBackend}. */\nexport interface HeadlessBackendOptions {\n  /**\n   * A designated overlay node for portals. Omit (the default) and `overlayRoot` is unimplemented,\n   * so portals mount IN PLACE — the SSR-correct behavior (`renderToString` only serializes the\n   * root's own children). Pass a node to test relocated portal placement.\n   */\n  readonly overlayRoot?: HeadlessNode\n}\n\n/** Create a {@link SerializableBackend} backed by an in-memory tree. */\nexport function createHeadlessBackend(\n  options: HeadlessBackendOptions = {},\n): SerializableBackend<HeadlessNode> {\n  const backend: SerializableBackend<HeadlessNode> = {\n    createElement(type: string): HeadlessNode {\n      return { type, props: {}, text: '', children: [], parent: null }\n    },\n\n    createText(value: string): HeadlessNode {\n      return { type: TEXT, props: {}, text: value, children: [], parent: null }\n    },\n\n    setProp(node, key, value): void {\n      // Event handlers and falsy values are tracked but not serialized as attrs.\n      if (value === undefined || value === null || value === false) {\n        delete node.props[key]\n      } else {\n        node.props[key] = value\n      }\n    },\n\n    setText(node, value): void {\n      node.text = value\n    },\n\n    insert(parent, node, anchor): void {\n      if (node.parent) {\n        const prevSiblings = node.parent.children\n        const at = prevSiblings.indexOf(node)\n        if (at >= 0) prevSiblings.splice(at, 1)\n      }\n      node.parent = parent\n      if (anchor === null) {\n        parent.children.push(node)\n      } else {\n        const idx = parent.children.indexOf(anchor)\n        parent.children.splice(idx < 0 ? parent.children.length : idx, 0, node)\n      }\n    },\n\n    remove(parent, node): void {\n      const idx = parent.children.indexOf(node)\n      if (idx >= 0) parent.children.splice(idx, 1)\n      node.parent = null\n    },\n\n    parentOf(node): HeadlessNode | null {\n      return node.parent\n    },\n\n    nextSibling(node): HeadlessNode | null {\n      const parent = node.parent\n      if (!parent) return null\n      const idx = parent.children.indexOf(node)\n      return idx >= 0 && idx + 1 < parent.children.length\n        ? (parent.children[idx + 1] ?? null)\n        : null\n    },\n\n    isText(node): boolean {\n      return node.type === TEXT\n    },\n\n    serialize: serializeHeadless,\n  }\n  // Only expose overlayRoot when a target was provided, so the default stays in-place (SSR-correct).\n  if (options.overlayRoot) {\n    const target = options.overlayRoot\n    backend.overlayRoot = () => target\n  }\n  return backend\n}\n\n/** Whether a prop key is an event handler (`onClick`, `onPress`, …). */\nexport function isEventProp(key: string): boolean {\n  return (\n    key.length > 2 && key[0] === 'o' && key[1] === 'n' && key[2] === (key[2] ?? '').toUpperCase()\n  )\n}\n\n/** Convenience: create a detached headless root element (default tag `\"root\"`). */\nexport function createHeadlessRoot(type = 'root'): HeadlessNode {\n  return { type, props: {}, text: '', children: [], parent: null }\n}\n"],"mappings":"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"}
+{"version":3,"file":"headless.js","names":[],"sources":["../src/headless.ts"],"sourcesContent":["/**\n * Headless host backend — an in-memory host tree, no browser required.\n *\n * This is the **reference backend**: it implements the full {@link HostBackend}\n * (plus {@link SerializableBackend}) so the entire reconciler can be exercised\n * in CI without a DOM. It's also handy for snapshot-testing rendered output.\n *\n * @module\n */\n\nimport type { SerializableBackend, SerializeOptions } from './backend'\nimport { serializeStyle } from './css'\n\n/** A headless host node: an element (with tag/props/children) or a text node. */\nexport interface HeadlessNode {\n  /** `\"#text\"` for text nodes, otherwise the element tag. */\n  type: string\n  /** Applied props (elements only). */\n  props: Record<string, unknown>\n  /** Text content (text nodes only). */\n  text: string\n  /** Child nodes (elements only). */\n  children: HeadlessNode[]\n  /** Back-pointer to the parent, or `null` when detached. */\n  parent: HeadlessNode | null\n}\n\nconst TEXT = '#text'\n\nfunction escapeAttr(value: string): string {\n  return value.replace(/&/g, '&amp;').replace(/\"/g, '&quot;').replace(/</g, '&lt;')\n}\n\nfunction escapeText(value: string): string {\n  return value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')\n}\n\n/**\n * Render an attribute value: a `style` object becomes a CSS string via the SAME serializer\n * the DOM backend uses (kebab-case names + `px` units), so SSR markup matches the hydrated DOM.\n */\nfunction serializeAttrValue(value: unknown): string {\n  if (value && typeof value === 'object') {\n    return serializeStyle(value as Record<string, unknown>)\n  }\n  return String(value)\n}\n\n/**\n * Whether `key` is a safe HTML attribute name. Attribute NAMES are interpolated\n * into markup unescaped, so a name containing `>`, whitespace, quotes, `=`, `/`,\n * etc. could break out of the tag and inject markup (stored XSS when props are\n * built from user/server data). We emit only names that match the HTML name\n * grammar — matching what the DOM's `setAttribute` would accept — and drop the\n * rest, exactly as an invalid name would never reach the DOM either.\n */\nfunction isValidAttrName(key: string): boolean {\n  return /^[A-Za-z_:][\\w:.-]*$/.test(key)\n}\n\n/**\n * Serialize a headless node (and subtree) to HTML. A standalone function, not an\n * object method: the public {@link SerializableBackend.serialize} is typed as a\n * plain function member, so a consumer may legally detach it\n * (`const { serialize } = backend`). Recursing through this lexical helper rather\n * than `this.serialize` keeps it binding-independent.\n */\nfunction serializeHeadless(node: HeadlessNode, options?: SerializeOptions): string {\n  if (node.type === TEXT) return escapeText(node.text)\n  const mapTag = options?.mapTag ?? ((t: string) => t)\n  const tag = mapTag(node.type)\n  // The tag is interpolated into `<tag>`/`</tag>` unescaped, so a tag containing `>`,\n  // whitespace, etc. would break out of the element and inject markup. Reject any tag\n  // that isn't a valid name (same grammar as attribute names) — fail closed.\n  if (!isValidAttrName(tag)) {\n    throw new Error(`refusing to serialize unsafe element tag: ${JSON.stringify(tag)}`)\n  }\n  const attrs = Object.entries(node.props)\n    .filter(([key]) => !isEventProp(key) && isValidAttrName(key))\n    .map(([key, value]) =>\n      // Boolean `true` → a valueless attribute (`disabled=\"\"`), matching the DOM\n      // backend (dom.ts) so SSR markup equals hydrated markup.\n      value === true ? ` ${key}=\"\"` : ` ${key}=\"${escapeAttr(serializeAttrValue(value))}\"`,\n    )\n    .join('')\n  // HTML void elements (e.g. `img`, `input` — what `image`/`textinput` map to) have NO closing tag\n  // and NO children: emitting `<img>...</img>` is malformed and the browser reparents the children as\n  // siblings, diverging from the reconciler's tree. Emit a self-contained start tag only.\n  if (VOID_ELEMENTS.has(tag)) {\n    return `<${tag}${attrs}>`\n  }\n  const inner = node.children.map((c) => serializeHeadless(c, options)).join('')\n  return `<${tag}${attrs}>${inner}</${tag}>`\n}\n\n/** HTML void elements — serialized with no closing tag and no children (post-`mapTag` names). */\nconst VOID_ELEMENTS = new Set([\n  'area',\n  'base',\n  'br',\n  'col',\n  'embed',\n  'hr',\n  'img',\n  'input',\n  'link',\n  'meta',\n  'param',\n  'source',\n  'track',\n  'wbr',\n])\n\n/** Options for {@link createHeadlessBackend}. */\nexport interface HeadlessBackendOptions {\n  /**\n   * A designated overlay node for portals. Omit (the default) and `overlayRoot` is unimplemented,\n   * so portals mount IN PLACE — the SSR-correct behavior (`renderToString` only serializes the\n   * root's own children). Pass a node to test relocated portal placement.\n   */\n  readonly overlayRoot?: HeadlessNode\n}\n\n/** Create a {@link SerializableBackend} backed by an in-memory tree. */\nexport function createHeadlessBackend(\n  options: HeadlessBackendOptions = {},\n): SerializableBackend<HeadlessNode> {\n  const backend: SerializableBackend<HeadlessNode> = {\n    createElement(type: string): HeadlessNode {\n      return { type, props: {}, text: '', children: [], parent: null }\n    },\n\n    createText(value: string): HeadlessNode {\n      return { type: TEXT, props: {}, text: value, children: [], parent: null }\n    },\n\n    setProp(node, key, value): void {\n      // Event handlers and falsy values are tracked but not serialized as attrs.\n      if (value === undefined || value === null || value === false) {\n        delete node.props[key]\n      } else {\n        node.props[key] = value\n      }\n    },\n\n    setText(node, value): void {\n      node.text = value\n    },\n\n    insert(parent, node, anchor): void {\n      if (node.parent) {\n        const prevSiblings = node.parent.children\n        const at = prevSiblings.indexOf(node)\n        if (at >= 0) prevSiblings.splice(at, 1)\n      }\n      node.parent = parent\n      if (anchor === null) {\n        parent.children.push(node)\n      } else {\n        const idx = parent.children.indexOf(anchor)\n        parent.children.splice(idx < 0 ? parent.children.length : idx, 0, node)\n      }\n    },\n\n    remove(parent, node): void {\n      const idx = parent.children.indexOf(node)\n      if (idx >= 0) parent.children.splice(idx, 1)\n      node.parent = null\n    },\n\n    parentOf(node): HeadlessNode | null {\n      return node.parent\n    },\n\n    nextSibling(node): HeadlessNode | null {\n      const parent = node.parent\n      if (!parent) return null\n      const idx = parent.children.indexOf(node)\n      return idx >= 0 && idx + 1 < parent.children.length\n        ? (parent.children[idx + 1] ?? null)\n        : null\n    },\n\n    isText(node): boolean {\n      return node.type === TEXT\n    },\n\n    serialize: serializeHeadless,\n  }\n  // Only expose overlayRoot when a target was provided, so the default stays in-place (SSR-correct).\n  if (options.overlayRoot) {\n    const target = options.overlayRoot\n    backend.overlayRoot = () => target\n  }\n  return backend\n}\n\n/** Whether a prop key is an event handler (`onClick`, `onPress`, …). */\nexport function isEventProp(key: string): boolean {\n  return (\n    key.length > 2 && key[0] === 'o' && key[1] === 'n' && key[2] === (key[2] ?? '').toUpperCase()\n  )\n}\n\n/** Convenience: create a detached headless root element (default tag `\"root\"`). */\nexport function createHeadlessRoot(type = 'root'): HeadlessNode {\n  return { type, props: {}, text: '', children: [], parent: null }\n}\n"],"mappings":"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"}

package/dist/index.d.ts

@@ -17,7 +17,7 @@ import { Maturity, NotImplementedError, PackageInfo, notImplemented } from "@min
 /** The npm package name. */
 declare const name = "@mindees/renderer";
 /** The package version. All `@mindees/*` packages share one locked version line. */
-declare const VERSION = "0.22.0";
+declare const VERSION = "0.22.2";
 /**
  * Current maturity. The Helix **web/DOM** renderer (reconciler, DOM backend,
  * headless backend, SSR + hydration) is implemented and tested. Native

package/dist/index.js

@@ -16,7 +16,7 @@ import { NotImplementedError, notImplemented } from "@mindees/core";
 /** The npm package name. */
 const name = "@mindees/renderer";
 /** The package version. All `@mindees/*` packages share one locked version line. */
-const VERSION = "0.22.0";
+const VERSION = "0.22.2";
 /**
 * Current maturity. The Helix **web/DOM** renderer (reconciler, DOM backend,
 * headless backend, SSR + hydration) is implemented and tested. Native

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { Maturity, PackageInfo } from '@mindees/core'\nimport { NotImplementedError, notImplemented } from '@mindees/core'\n\n/** Host-backend contract + capability detection. */\nexport {\n  type HostBackend,\n  isSerializable,\n  type SerializableBackend,\n} from './backend'\n/** Helix Canvas strand — a 2D scene graph driven by the reconciler, painted to a 2D context (§6.2). */\nexport {\n  type Canvas2DBackend,\n  createCanvas2DBackend,\n  type Scene2DContext,\n  type SceneNode,\n} from './canvas'\n/** DOM (web) backend. */\nexport {\n  createDomBackend,\n  type DomDocument,\n  type DomElement,\n  type DomNode,\n  type DomText,\n  domTagFor,\n} from './dom'\n/** Keyed list reconciliation (the renderer side of core's KeyedRegion). */\nexport { bindKeyedChild } from './for'\n/** Headless (in-memory) backend — the reference/test target. */\nexport {\n  createHeadlessBackend,\n  createHeadlessRoot,\n  type HeadlessNode,\n  isEventProp,\n} from './headless'\n/**\n * Native backends. `createNativeCommandBackend` is implemented (emits a native\n * command stream); `createNativeBackend`/`createCanvasBackend` are research\n * tracks that throw `NotImplementedError`.\n */\nexport {\n  type CanvasBackend,\n  createCanvasBackend,\n  createNativeBackend,\n  createNativeCommandBackend,\n  type NativeBackend,\n  type NativeCommandBackend,\n  type NativeCommandBackendOptions,\n  type NativeCommandNode,\n} from './native'\n/** One-call native app entry — wires the command backend + host contract. */\nexport {\n  type CreateNativeAppOptions,\n  createNativeApp,\n  type NativeApp,\n} from './native-app'\n/**\n * The strict reference native host — applies a command stream to a model tree and\n * validates it (the executable conformance contract real native hosts implement).\n */\nexport {\n  createReferenceHost,\n  NativeHostError,\n  type ReferenceHost,\n  type ReferenceHostNode,\n} from './native-host'\n/** The native command protocol: command types + serialization-safe helpers. */\nexport {\n  type CreateNodeCommand,\n  type CreateTextCommand,\n  createNativeNodeIdFactory,\n  type DisposeNodeCommand,\n  type InsertChildCommand,\n  isNativeCommand,\n  isNativePropValue,\n  type NativeCommand,\n  type NativeNodeId,\n  type NativePropValue,\n  normalizeNativeProp,\n  type RegisterEventCommand,\n  type RemoveChildCommand,\n  type RemovePropCommand,\n  type SetPropCommand,\n  type UnregisterEventCommand,\n  type UpdateTextCommand,\n} from './native-protocol'\n/** Portal reconciliation (the renderer side of core's PortalRegion). */\nexport { bindPortalChild } from './portal'\n/** The fine-grained reactive reconciler. */\nexport { type Mounted, mountNode, render } from './render'\n/** Server-side rendering + hydration (web). */\nexport { hydrate, renderToString } from './ssr'\n\n/** The npm package name. */\nexport const name = '@mindees/renderer'\n\n/** The package version. All `@mindees/*` packages share one locked version line. */\nexport const VERSION = '0.22.0'\n\n/**\n * Current maturity. The Helix **web/DOM** renderer (reconciler, DOM backend,\n * headless backend, SSR + hydration) is implemented and tested. Native\n * (iOS/Android) and the GPU canvas are research tracks (throw\n * `NotImplementedError`). See the repository `STATUS.md`.\n */\nexport const maturity: Maturity = 'experimental'\n\n/**\n * Static identity + maturity metadata for this package. Frozen so the\n * self-reported identity tooling introspects cannot be mutated at runtime,\n * matching the `readonly` fields of {@link PackageInfo}.\n */\nexport const info: PackageInfo = Object.freeze({ name, version: VERSION, maturity })\n\nexport type { Maturity, PackageInfo }\nexport { NotImplementedError, notImplemented }\n"],"mappings":";;;;;;;;;;;;;;;;AA6FA,MAAa,OAAO;;AAGpB,MAAa,UAAU;;;;;;;AAQvB,MAAa,WAAqB;;;;;;AAOlC,MAAa,OAAoB,OAAO,OAAO;CAAE;CAAM,SAAS;CAAS;AAAS,CAAC"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["import type { Maturity, PackageInfo } from '@mindees/core'\nimport { NotImplementedError, notImplemented } from '@mindees/core'\n\n/** Host-backend contract + capability detection. */\nexport {\n  type HostBackend,\n  isSerializable,\n  type SerializableBackend,\n} from './backend'\n/** Helix Canvas strand — a 2D scene graph driven by the reconciler, painted to a 2D context (§6.2). */\nexport {\n  type Canvas2DBackend,\n  createCanvas2DBackend,\n  type Scene2DContext,\n  type SceneNode,\n} from './canvas'\n/** DOM (web) backend. */\nexport {\n  createDomBackend,\n  type DomDocument,\n  type DomElement,\n  type DomNode,\n  type DomText,\n  domTagFor,\n} from './dom'\n/** Keyed list reconciliation (the renderer side of core's KeyedRegion). */\nexport { bindKeyedChild } from './for'\n/** Headless (in-memory) backend — the reference/test target. */\nexport {\n  createHeadlessBackend,\n  createHeadlessRoot,\n  type HeadlessNode,\n  isEventProp,\n} from './headless'\n/**\n * Native backends. `createNativeCommandBackend` is implemented (emits a native\n * command stream); `createNativeBackend`/`createCanvasBackend` are research\n * tracks that throw `NotImplementedError`.\n */\nexport {\n  type CanvasBackend,\n  createCanvasBackend,\n  createNativeBackend,\n  createNativeCommandBackend,\n  type NativeBackend,\n  type NativeCommandBackend,\n  type NativeCommandBackendOptions,\n  type NativeCommandNode,\n} from './native'\n/** One-call native app entry — wires the command backend + host contract. */\nexport {\n  type CreateNativeAppOptions,\n  createNativeApp,\n  type NativeApp,\n} from './native-app'\n/**\n * The strict reference native host — applies a command stream to a model tree and\n * validates it (the executable conformance contract real native hosts implement).\n */\nexport {\n  createReferenceHost,\n  NativeHostError,\n  type ReferenceHost,\n  type ReferenceHostNode,\n} from './native-host'\n/** The native command protocol: command types + serialization-safe helpers. */\nexport {\n  type CreateNodeCommand,\n  type CreateTextCommand,\n  createNativeNodeIdFactory,\n  type DisposeNodeCommand,\n  type InsertChildCommand,\n  isNativeCommand,\n  isNativePropValue,\n  type NativeCommand,\n  type NativeNodeId,\n  type NativePropValue,\n  normalizeNativeProp,\n  type RegisterEventCommand,\n  type RemoveChildCommand,\n  type RemovePropCommand,\n  type SetPropCommand,\n  type UnregisterEventCommand,\n  type UpdateTextCommand,\n} from './native-protocol'\n/** Portal reconciliation (the renderer side of core's PortalRegion). */\nexport { bindPortalChild } from './portal'\n/** The fine-grained reactive reconciler. */\nexport { type Mounted, mountNode, render } from './render'\n/** Server-side rendering + hydration (web). */\nexport { hydrate, renderToString } from './ssr'\n\n/** The npm package name. */\nexport const name = '@mindees/renderer'\n\n/** The package version. All `@mindees/*` packages share one locked version line. */\nexport const VERSION = '0.22.2'\n\n/**\n * Current maturity. The Helix **web/DOM** renderer (reconciler, DOM backend,\n * headless backend, SSR + hydration) is implemented and tested. Native\n * (iOS/Android) and the GPU canvas are research tracks (throw\n * `NotImplementedError`). See the repository `STATUS.md`.\n */\nexport const maturity: Maturity = 'experimental'\n\n/**\n * Static identity + maturity metadata for this package. Frozen so the\n * self-reported identity tooling introspects cannot be mutated at runtime,\n * matching the `readonly` fields of {@link PackageInfo}.\n */\nexport const info: PackageInfo = Object.freeze({ name, version: VERSION, maturity })\n\nexport type { Maturity, PackageInfo }\nexport { NotImplementedError, notImplemented }\n"],"mappings":";;;;;;;;;;;;;;;;AA6FA,MAAa,OAAO;;AAGpB,MAAa,UAAU;;;;;;;AAQvB,MAAa,WAAqB;;;;;;AAOlC,MAAa,OAAoB,OAAO,OAAO;CAAE;CAAM,SAAS;CAAS;AAAS,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindees/renderer",
-  "version": "0.22.0",
+  "version": "0.22.2",
   "description": "MindeesNative Helix — fine-grained reactive renderer with a web/DOM backend, SSR + hydration, and a headless test backend. Native and GPU-canvas backends are research tracks.",
   "license": "MIT OR Apache-2.0",
   "type": "module",
@@ -23,7 +23,7 @@
     "directory": "packages/renderer"
   },
   "dependencies": {
-    "@mindees/core": "0.22.0"
+    "@mindees/core": "0.22.2"
   },
   "devDependencies": {
     "happy-dom": "20.9.0"