@glissade/scene 0.4.2 → 0.4.4

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { $ as createDisplayListBuilder, A as NodeProps, B as DisplayList, C as WordBox, D as EvalContext, E as BindablePropTarget, F as breakLines, G as FontSpec, H as DrawCommand, I as estimatingMeasurer, J as Rect$1, K as Paint, L as quantize, M as resolveAnchor, N as TextMeasurer, O as HitArea, P as TextMetricsLite, Q as StrokeStyle, R as segmentWords, S as VideoProps, T as AnchorSpec, U as FilterSpec, V as DisplayListBuilder, W as FilterValidationError, X as ResourceId, Y as Resource, Z as ShaderRef, _ as Rect, a as LayoutEngineMissingError, at as applyToPoint, b as TextProps, c as requireLayoutEngine, ct as matEquals, d as Group, et as filtersToCanvasFilter, f as ImageNode, g as PathProps, h as Path, i as LayoutEngine, it as Mat2x3, j as PropInit, k as Node, l as setLayoutEngine, lt as multiply, m as LineBox, n as LayoutChildSpec, nt as validateFilters, ot as fromTRS, p as ImageProps, q as PathSeg, r as LayoutContainerSpec, rt as IDENTITY, s as getLayoutEngine, st as invert, t as LayoutBox, tt as glow, u as Circle, v as ShapeProps, w as roundedRectSegs, x as Video, y as Text, z as BlendMode } from "./layoutEngine.js";
+import { $ as StrokeStyle, A as NodeProps, B as BlendMode, C as WordBox, D as EvalContext, E as BindablePropTarget, F as breakLines, G as FilterValidationError, H as DisplayListBuilder, I as estimatingMeasurer, J as PathSeg, K as FontSpec, L as quantize, M as resolveAnchor, N as TextMeasurer, O as HitArea, P as TextMetricsLite, Q as ShaderRef, R as segmentWords, S as VideoProps, T as AnchorSpec, U as DrawCommand, V as DisplayList, W as FilterSpec, X as Resource, Y as Rect$1, Z as ResourceId, _ as Rect, a as LayoutEngineMissingError, at as Mat2x3, b as TextProps, c as requireLayoutEngine, ct as invert, d as Group, et as createDisplayListBuilder, f as ImageNode, g as PathProps, h as Path, i as LayoutEngine, it as IDENTITY, j as PropInit, k as Node, l as setLayoutEngine, lt as matEquals, m as LineBox, n as LayoutChildSpec, nt as glow, ot as applyToPoint, p as ImageProps, q as Paint, r as LayoutContainerSpec, rt as validateFilters, s as getLayoutEngine, st as fromTRS, t as LayoutBox, tt as filtersToCanvasFilter, u as Circle, ut as multiply, v as ShapeProps, w as roundedRectSegs, x as Video, y as Text, z as setDefaultMeasurer } from "./layoutEngine.js";
 import { BindableSignal, BoundTimeline, CompiledTimeline, Playhead, Timeline } from "@glissade/core";
 
 //#region src/highlight.d.ts
@@ -28,6 +28,56 @@ declare class Highlight extends Node {
 /** `children: [highlight(title, { color: '#ffe066' }), title]` — marker behind the text. */
 declare function highlight(text: Text, props?: Omit<HighlightProps, 'text'>): Highlight;
 //#endregion
+//#region src/tokenHighlight.d.ts
+interface TokenRange {
+  /** token text (whitespace-insensitive run match) or inclusive [from, to] wordBoxes indices */
+  match: string | readonly [number, number];
+  /** which occurrence of a string match; default 1 (the first) */
+  occurrence?: number;
+  /** range id for track targets ('<nodeId>/<rangeId>/fill' …); default 'r<index>' */
+  id?: string;
+  fill?: PropInit<string>;
+  opacity?: PropInit<number>;
+  /** 0→1 left-to-right reveal across the range; default 1 */
+  progress?: PropInit<number>;
+  /** scale about the range rect's center; default 1 */
+  scale?: PropInit<number>;
+}
+interface TokenHighlightProps extends NodeProps {
+  /** the Text whose tokens get highlighted; place this node as an EARLIER sibling */
+  text: Text;
+  ranges: TokenRange[];
+  /** marker overhang beyond the ink box, [x, y] px; default [4, 2] */
+  padding?: [number, number];
+  cornerRadius?: number;
+  /** re-resolve string matches every frame (animated text); default false — drift throws */
+  rematch?: boolean;
+}
+declare class TokenMatchError extends Error {
+  constructor(message: string);
+}
+/**
+ * Find the Nth whitespace-stripped consecutive run of boxes equal to token.
+ * Boundary-exact: a run that diverges mid-segment is not a match; ending
+ * mid-segment throws (with the real segment list) rather than half-boxing.
+ */
+declare function matchTokenRun(boxes: WordBox[], token: string, occurrence?: number): [number, number];
+declare class TokenHighlight extends Node {
+  readonly target: Text;
+  readonly padding: [number, number];
+  readonly cornerRadius: number;
+  readonly rematch: boolean;
+  private readonly ranges;
+  constructor(props: TokenHighlightProps);
+  private resolveRun;
+  protected draw(out: DisplayListBuilder, ctx: EvalContext): void;
+}
+/**
+ * `children: [tokenHighlight(para, { ranges: [{ match: '$48,200', fill: cat.money }] }), para]`
+ * — each range animates independently via '<id>/<rangeId>/fill|opacity|progress|scale'.
+ */
+declare function tokenHighlight(text: Text, props: Omit<TokenHighlightProps, 'text'>): TokenHighlight;
+//#endregion
 //#region src/assets.d.ts
 /**
  * Asset contracts (DESIGN.md §3.8): evaluate() never awaits — callers warm
@@ -218,4 +268,4 @@ declare function bindScene(scene: Scene, doc: Timeline): BindingCacheEntry;
  */
 declare function evaluate(scene: Scene, doc: Timeline, t: number): DisplayList;
 //#endregion
-export { type AnchorSpec, type BindablePropTarget, type BlendMode, type CanvasLike, Circle, ColdAssetError, type Ctx2DLike, type DisplayList, type DisplayListBuilder, type DrawCommand, DuplicateNodeIdError, type EvalContext, type FilterSpec, FilterValidationError, type FontSpec, Group, Highlight, type HighlightProps, type HitArea, IDENTITY, type ImageHandle, ImageNode, type ImageProps, type LayoutBox, type LayoutChildSpec, type LayoutContainerSpec, type LayoutEngine, LayoutEngineMissingError, type LineBox, type Mat2x3, Node, type NodeProps, type Paint, Path, type PathLike, type PathProps, type PathSeg, type PropInit, Raster2D, type Raster2DHost, Rect, type Rect$1 as RectShape, type Resource, type ResourceId, type Scene, type SceneInit, type SceneModule, type ShaderCaps, ShaderEffect, type ShaderEffectProps, type ShaderRef, type ShapeProps, type StrokeStyle, Text, type TextMeasurer, type TextMetricsLite, type TextProps, Video, type VideoFrameSource, type VideoProps, type WordBox, applyToPoint, bindScene, breakLines, createDisplayListBuilder, createScene, estimatingMeasurer, evaluate, filtersToCanvasFilter, fontString, fromTRS, getLayoutEngine, glow, highlight, invert, matEquals, multiply, quantize, requireLayoutEngine, resolveAnchor, roundedRectSegs, segmentWords, setLayoutEngine, validateFilters };
+export { type AnchorSpec, type BindablePropTarget, type BlendMode, type CanvasLike, Circle, ColdAssetError, type Ctx2DLike, type DisplayList, type DisplayListBuilder, type DrawCommand, DuplicateNodeIdError, type EvalContext, type FilterSpec, FilterValidationError, type FontSpec, Group, Highlight, type HighlightProps, type HitArea, IDENTITY, type ImageHandle, ImageNode, type ImageProps, type LayoutBox, type LayoutChildSpec, type LayoutContainerSpec, type LayoutEngine, LayoutEngineMissingError, type LineBox, type Mat2x3, Node, type NodeProps, type Paint, Path, type PathLike, type PathProps, type PathSeg, type PropInit, Raster2D, type Raster2DHost, Rect, type Rect$1 as RectShape, type Resource, type ResourceId, type Scene, type SceneInit, type SceneModule, type ShaderCaps, ShaderEffect, type ShaderEffectProps, type ShaderRef, type ShapeProps, type StrokeStyle, Text, type TextMeasurer, type TextMetricsLite, type TextProps, TokenHighlight, type TokenHighlightProps, TokenMatchError, type TokenRange, Video, type VideoFrameSource, type VideoProps, type WordBox, applyToPoint, bindScene, breakLines, createDisplayListBuilder, createScene, estimatingMeasurer, evaluate, filtersToCanvasFilter, fontString, fromTRS, getLayoutEngine, glow, highlight, invert, matEquals, matchTokenRun, multiply, quantize, requireLayoutEngine, resolveAnchor, roundedRectSegs, segmentWords, setDefaultMeasurer, setLayoutEngine, tokenHighlight, validateFilters };

package/dist/index.js

@@ -1,4 +1,4 @@
-import { C as validateFilters, D as invert, E as fromTRS, O as matEquals, S as glow, T as applyToPoint, _ as quantize, a as Circle, b as createDisplayListBuilder, c as Path, d as Video, f as roundedRectSegs, g as estimatingMeasurer, h as breakLines, i as setLayoutEngine, k as multiply, l as Rect, m as resolveAnchor, n as getLayoutEngine, o as Group, p as Node, r as requireLayoutEngine, s as ImageNode, t as LayoutEngineMissingError, u as Text, v as segmentWords, w as IDENTITY, x as filtersToCanvasFilter, y as FilterValidationError } from "./layoutEngine.js";
+import { A as matEquals, C as filtersToCanvasFilter, D as applyToPoint, E as IDENTITY, O as fromTRS, S as createDisplayListBuilder, T as validateFilters, _ as fallbackMeasurer, a as Circle, b as setDefaultMeasurer, c as Path, d as Video, f as roundedRectSegs, g as estimatingMeasurer, h as breakLines, i as setLayoutEngine, j as multiply, k as invert, l as Rect, m as resolveAnchor, n as getLayoutEngine, o as Group, p as Node, r as requireLayoutEngine, s as ImageNode, t as LayoutEngineMissingError, u as Text, v as quantize, w as glow, x as FilterValidationError, y as segmentWords } from "./layoutEngine.js";
 import { bindTimeline, compileTimeline, createPlayhead, emitDevWarning, evaluateAt, signal } from "@glissade/core";
 //#region src/highlight.ts
 /**
@@ -19,8 +19,8 @@ var Highlight = class extends Node {
 	constructor(props) {
 		super(props);
 		this.target = props.text;
-		this.color = init(signal("#ffe066"), props.color);
-		this.progress = init(signal(1), props.progress);
+		this.color = init$1(signal("#ffe066"), props.color);
+		this.progress = init$1(signal(1), props.progress);
 		this.padding = props.padding ?? [4, 2];
 		this.cornerRadius = props.cornerRadius ?? 4;
 		this.registerTarget("progress", this.progress);
@@ -73,6 +73,185 @@ function highlight(text, props = {}) {
 		text
 	});
 }
+function init$1(sig, v) {
+	if (typeof v === "function") sig.bindSource(v);
+	else if (v !== void 0) sig.set(v);
+	return sig;
+}
+//#endregion
+//#region src/tokenHighlight.ts
+/**
+* Multi-range token highlight: sub-line ranges over a Text node's wordBoxes,
+* each with its OWN animatable fill/opacity/progress/scale — four-color
+* category passes, per-token flips, karaoke-with-color. Design answers from
+* downstream production (the NNDL verification ritual):
+*  - ranges VALIDATE at construction and THROW on copy drift at draw — the
+*    throw is load-bearing (it catches edited copy that no longer matches);
+*    `rematch: true` opts animated text into per-frame re-resolution.
+*  - a range spanning a wrap produces one rect per line segment.
+*  - string matches are whitespace-stripped consecutive box runs and must end
+*    boundary-exact (mid-segment end = error listing the actual segments);
+*    `[wordIndex, wordIndex]` ranges sidestep matching entirely.
+*/
+var TokenMatchError = class extends Error {
+	constructor(message) {
+		super(message);
+		this.name = "TokenMatchError";
+	}
+};
+const stripWs = (s) => s.replace(/\s+/g, "");
+/**
+* Find the Nth whitespace-stripped consecutive run of boxes equal to token.
+* Boundary-exact: a run that diverges mid-segment is not a match; ending
+* mid-segment throws (with the real segment list) rather than half-boxing.
+*/
+function matchTokenRun(boxes, token, occurrence = 1) {
+	const want = stripWs(token);
+	if (want.length === 0) throw new TokenMatchError("empty token");
+	let seen = 0;
+	for (let i = 0; i < boxes.length; i++) {
+		let acc = "";
+		for (let j = i; j < boxes.length; j++) {
+			acc += stripWs(boxes[j].text);
+			if (acc === want) {
+				seen++;
+				if (seen === occurrence) return [i, j];
+				break;
+			}
+			if (!want.startsWith(acc)) break;
+		}
+	}
+	throw new TokenMatchError(`no match for token '${token}'${occurrence > 1 ? ` (occurrence ${occurrence})` : ""} — segments are [${boxes.map((b) => `'${b.text}'`).join(", ")}]`);
+}
+var TokenHighlight = class extends Node {
+	target;
+	padding;
+	cornerRadius;
+	rematch;
+	ranges;
+	constructor(props) {
+		super(props);
+		this.target = props.text;
+		this.padding = props.padding ?? [4, 2];
+		this.cornerRadius = props.cornerRadius ?? 4;
+		this.rematch = props.rematch ?? false;
+		const boxes = this.target.wordBoxes();
+		this.ranges = props.ranges.map((spec, index) => {
+			const run = this.resolveRun(boxes, spec);
+			const id = spec.id ?? `r${index}`;
+			const r = {
+				spec,
+				fill: init(signal("#ffe066"), spec.fill),
+				opacity: init(signal(1), spec.opacity),
+				progress: init(signal(1), spec.progress),
+				scale: init(signal(1), spec.scale),
+				run,
+				bound: runText(boxes, run)
+			};
+			this.registerTarget(`${id}/fill`, r.fill);
+			this.registerTarget(`${id}/opacity`, r.opacity);
+			this.registerTarget(`${id}/progress`, r.progress);
+			this.registerTarget(`${id}/scale`, r.scale);
+			return r;
+		});
+	}
+	resolveRun(boxes, spec) {
+		if (typeof spec.match !== "string") {
+			const [from, to] = spec.match;
+			if (from < 0 || to >= boxes.length || from > to) throw new TokenMatchError(`word index range [${from}, ${to}] out of bounds (${boxes.length} boxes)`);
+			return [from, to];
+		}
+		return matchTokenRun(boxes, spec.match, spec.occurrence ?? 1);
+	}
+	draw(out, ctx) {
+		const boxes = this.target.wordBoxes(ctx.measurer);
+		if (boxes.length === 0) return;
+		const tm = this.target.localMatrix();
+		const [px, py] = this.padding;
+		let pushedTransform = false;
+		for (const r of this.ranges) {
+			const opacity = r.opacity();
+			if (opacity <= 0) continue;
+			const progress = Math.min(1, Math.max(0, r.progress()));
+			if (progress <= 0) continue;
+			let run = r.run;
+			if (this.rematch && typeof r.spec.match === "string") run = matchTokenRun(boxes, r.spec.match, r.spec.occurrence ?? 1);
+			else if (runText(boxes, run) !== r.bound) throw new TokenMatchError(`bound token '${r.bound}' no longer matches boxes [${run[0]}, ${run[1]}] — the text changed (segments now [${boxes.slice(run[0], run[1] + 1).map((b) => `'${b.text}'`).join(", ")}]); pass rematch: true for animated text`);
+			const lineRects = [];
+			for (let i = run[0]; i <= run[1]; i++) {
+				const b = boxes[i];
+				const last = lineRects[lineRects.length - 1];
+				const cur = i > run[0] && boxes[i - 1].line === b.line ? last : void 0;
+				if (cur) {
+					cur.w = b.x + b.w + px - cur.x;
+					cur.y = Math.min(cur.y, b.y - py);
+					cur.h = Math.max(cur.h, b.y + b.h + py - cur.y);
+				} else lineRects.push({
+					x: b.x - px,
+					y: b.y - py,
+					w: b.w + 2 * px,
+					h: b.h + 2 * py
+				});
+			}
+			if (!pushedTransform && !matEquals(tm, IDENTITY)) {
+				out.push({
+					op: "transform",
+					m: tm
+				});
+				pushedTransform = true;
+			}
+			const grouped = opacity < 1;
+			if (grouped) out.push({
+				op: "pushGroup",
+				opacity,
+				blend: "source-over",
+				filters: []
+			});
+			const fill = r.fill();
+			const scale = r.scale();
+			let remaining = progress * lineRects.reduce((sum, q) => sum + q.w, 0);
+			for (const q of lineRects) {
+				const fillW = Math.min(q.w, remaining);
+				remaining -= fillW;
+				if (fillW <= 0) break;
+				const cx = q.x + q.w / 2;
+				const cy = q.y + q.h / 2;
+				const w = fillW * scale;
+				const h = q.h * scale;
+				const x = cx - q.w / 2 * scale;
+				const y = cy - h / 2;
+				const rad = Math.min(this.cornerRadius, w / 2, h / 2);
+				const path = out.resource({
+					kind: "path",
+					segs: roundedRectSegs(x, y, w, h, rad)
+				});
+				out.push({
+					op: "fillPath",
+					path,
+					paint: {
+						kind: "color",
+						color: fill
+					}
+				});
+				if (remaining <= 0) break;
+			}
+			if (grouped) out.push({ op: "popGroup" });
+		}
+	}
+};
+function runText(boxes, run) {
+	return boxes.slice(run[0], run[1] + 1).map((b) => stripWs(b.text)).join("");
+}
+/**
+* `children: [tokenHighlight(para, { ranges: [{ match: '$48,200', fill: cat.money }] }), para]`
+* — each range animates independently via '<id>/<rangeId>/fill|opacity|progress|scale'.
+*/
+function tokenHighlight(text, props) {
+	return new TokenHighlight({
+		...props,
+		text
+	});
+}
 function init(sig, v) {
 	if (typeof v === "function") sig.bindSource(v);
 	else if (v !== void 0) sig.set(v);
@@ -505,8 +684,8 @@ function createScene(init) {
 	});
 	const nodes = /* @__PURE__ */ new Map();
 	const playhead = createPlayhead();
-	let measurer = estimatingMeasurer;
-	indexNodes(root, nodes, () => measurer);
+	let measurer = null;
+	indexNodes(root, nodes, () => measurer ?? fallbackMeasurer());
 	return {
 		root,
 		nodes,
@@ -521,7 +700,7 @@ function createScene(init) {
 			measurer = m;
 		},
 		get textMeasurer() {
-			return measurer;
+			return measurer ?? fallbackMeasurer();
 		}
 	};
 }
@@ -563,4 +742,4 @@ function evaluate(scene, doc, t) {
 	});
 }
 //#endregion
-export { Circle, ColdAssetError, DuplicateNodeIdError, FilterValidationError, Group, Highlight, IDENTITY, ImageNode, LayoutEngineMissingError, Node, Path, Raster2D, Rect, ShaderEffect, Text, Video, applyToPoint, bindScene, breakLines, createDisplayListBuilder, createScene, estimatingMeasurer, evaluate, filtersToCanvasFilter, fontString, fromTRS, getLayoutEngine, glow, highlight, invert, matEquals, multiply, quantize, requireLayoutEngine, resolveAnchor, roundedRectSegs, segmentWords, setLayoutEngine, validateFilters };
+export { Circle, ColdAssetError, DuplicateNodeIdError, FilterValidationError, Group, Highlight, IDENTITY, ImageNode, LayoutEngineMissingError, Node, Path, Raster2D, Rect, ShaderEffect, Text, TokenHighlight, TokenMatchError, Video, applyToPoint, bindScene, breakLines, createDisplayListBuilder, createScene, estimatingMeasurer, evaluate, filtersToCanvasFilter, fontString, fromTRS, getLayoutEngine, glow, highlight, invert, matEquals, matchTokenRun, multiply, quantize, requireLayoutEngine, resolveAnchor, roundedRectSegs, segmentWords, setDefaultMeasurer, setLayoutEngine, tokenHighlight, validateFilters };

package/dist/layout.d.ts

@@ -1,4 +1,4 @@
-import { A as NodeProps, D as EvalContext, N as TextMeasurer, V as DisplayListBuilder, a as LayoutEngineMissingError, d as Group, i as LayoutEngine, j as PropInit, k as Node, l as setLayoutEngine, n as LayoutChildSpec, o as LayoutResult, r as LayoutContainerSpec, s as getLayoutEngine, t as LayoutBox } from "./layoutEngine.js";
+import { A as NodeProps, D as EvalContext, H as DisplayListBuilder, N as TextMeasurer, a as LayoutEngineMissingError, d as Group, i as LayoutEngine, j as PropInit, k as Node, l as setLayoutEngine, n as LayoutChildSpec, o as LayoutResult, r as LayoutContainerSpec, s as getLayoutEngine, t as LayoutBox } from "./layoutEngine.js";
 import { BindableSignal } from "@glissade/core";
 
 //#region src/layout.d.ts

package/dist/layout.js

@@ -1,4 +1,4 @@
-import { g as estimatingMeasurer, i as setLayoutEngine, n as getLayoutEngine, o as Group, r as requireLayoutEngine, t as LayoutEngineMissingError } from "./layoutEngine.js";
+import { _ as fallbackMeasurer, i as setLayoutEngine, n as getLayoutEngine, o as Group, r as requireLayoutEngine, t as LayoutEngineMissingError } from "./layoutEngine.js";
 import { signal } from "@glissade/core";
 //#region src/layout.ts
 /**
@@ -68,7 +68,7 @@ var Layout = class extends Group {
 	* The measurer defaults to the scene-injected one (estimating pre-scene).
 	*/
 	computedSize(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		return this.#compute(m).size;
 	}
 	#compute(measurer) {

package/dist/layoutEngine.d.ts

@@ -189,10 +189,16 @@ interface TextMeasurer {
 /** §3.6 measurement quantum. */
 declare function quantize(v: number): number;
 /**
- * Estimating fallback measurer — used only when no backend has been injected
- * (e.g. evaluating for IR-level tests). Deterministic but not metrically
- * faithful; mount(), the CLI, and exporters always inject the real one.
+ * Process-wide fallback measurer for FACTORY-TIME measurement — component
+ * factories run before any scene exists, so Text pulls (measuredSize,
+ * lineBoxes, wordBoxes) and createScene fall back here before the estimator.
+ * Node consumers: `setDefaultMeasurer(createMeasurer({ fonts }))` from
+ * @glissade/backend-skia gives factory code the rasterizer's real metrics.
+ * Scene-injected measurers (mount/CLI/golden harness) always win.
  */
+declare function setDefaultMeasurer(m: TextMeasurer | null): void;
+/** The default-or-estimating chain end; internal fallback for measurer pulls. */
+
 declare const estimatingMeasurer: TextMeasurer;
 /**
  * The draw-path word segmentation (Intl.Segmenter boundaries, punctuation
@@ -602,4 +608,4 @@ declare function setLayoutEngine(e: LayoutEngine): void;
 declare function getLayoutEngine(): LayoutEngine | null;
 declare function requireLayoutEngine(): LayoutEngine;
 //#endregion
-export { createDisplayListBuilder as $, NodeProps as A, DisplayList as B, WordBox as C, EvalContext as D, BindablePropTarget as E, breakLines as F, FontSpec as G, DrawCommand as H, estimatingMeasurer as I, Rect$1 as J, Paint as K, quantize as L, resolveAnchor as M, TextMeasurer as N, HitArea as O, TextMetricsLite as P, StrokeStyle as Q, segmentWords as R, VideoProps as S, AnchorSpec as T, FilterSpec as U, DisplayListBuilder as V, FilterValidationError as W, ResourceId as X, Resource as Y, ShaderRef as Z, Rect as _, LayoutEngineMissingError as a, applyToPoint as at, TextProps as b, requireLayoutEngine as c, matEquals as ct, Group as d, filtersToCanvasFilter as et, ImageNode as f, PathProps as g, Path as h, LayoutEngine as i, Mat2x3 as it, PropInit as j, Node as k, setLayoutEngine as l, multiply as lt, LineBox as m, LayoutChildSpec as n, validateFilters as nt, LayoutResult as o, fromTRS as ot, ImageProps as p, PathSeg as q, LayoutContainerSpec as r, IDENTITY as rt, getLayoutEngine as s, invert as st, LayoutBox as t, glow as tt, Circle as u, ShapeProps as v, roundedRectSegs as w, Video as x, Text as y, BlendMode as z };
+export { StrokeStyle as $, NodeProps as A, BlendMode as B, WordBox as C, EvalContext as D, BindablePropTarget as E, breakLines as F, FilterValidationError as G, DisplayListBuilder as H, estimatingMeasurer as I, PathSeg as J, FontSpec as K, quantize as L, resolveAnchor as M, TextMeasurer as N, HitArea as O, TextMetricsLite as P, ShaderRef as Q, segmentWords as R, VideoProps as S, AnchorSpec as T, DrawCommand as U, DisplayList as V, FilterSpec as W, Resource as X, Rect$1 as Y, ResourceId as Z, Rect as _, LayoutEngineMissingError as a, Mat2x3 as at, TextProps as b, requireLayoutEngine as c, invert as ct, Group as d, createDisplayListBuilder as et, ImageNode as f, PathProps as g, Path as h, LayoutEngine as i, IDENTITY as it, PropInit as j, Node as k, setLayoutEngine as l, matEquals as lt, LineBox as m, LayoutChildSpec as n, glow as nt, LayoutResult as o, applyToPoint as ot, ImageProps as p, Paint as q, LayoutContainerSpec as r, validateFilters as rt, getLayoutEngine as s, fromTRS as st, LayoutBox as t, filtersToCanvasFilter as tt, Circle as u, multiply as ut, ShapeProps as v, roundedRectSegs as w, Video as x, Text as y, setDefaultMeasurer as z };

package/dist/layoutEngine.js

@@ -158,6 +158,22 @@ function quantize(v) {
 * (e.g. evaluating for IR-level tests). Deterministic but not metrically
 * faithful; mount(), the CLI, and exporters always inject the real one.
 */
+let defaultMeasurer = null;
+/**
+* Process-wide fallback measurer for FACTORY-TIME measurement — component
+* factories run before any scene exists, so Text pulls (measuredSize,
+* lineBoxes, wordBoxes) and createScene fall back here before the estimator.
+* Node consumers: `setDefaultMeasurer(createMeasurer({ fonts }))` from
+* @glissade/backend-skia gives factory code the rasterizer's real metrics.
+* Scene-injected measurers (mount/CLI/golden harness) always win.
+*/
+function setDefaultMeasurer(m) {
+	defaultMeasurer = m;
+}
+/** The default-or-estimating chain end; internal fallback for measurer pulls. */
+function fallbackMeasurer() {
+	return defaultMeasurer ?? estimatingMeasurer;
+}
 const estimatingMeasurer = { measureText(text, font) {
 	return {
 		width: text.length * font.size * .52,
@@ -329,7 +345,7 @@ var Node = class {
 	* left/center/right baseline origin; Path from author-positioned bounds.
 	*/
 	drawOffset(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const size = this.intrinsicSize(m) ?? {
 			w: 0,
 			h: 0
@@ -345,7 +361,7 @@ var Node = class {
 	* (−ax·w, −ay·h); the center default reproduces (−w/2, −h/2).
 	*/
 	flowOffset(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const d = this.drawOffset(m);
 		const [sx, sy] = this.anchorShift(m);
 		return {
@@ -365,7 +381,7 @@ var Node = class {
 	anchorShift(measurer) {
 		if (!this.hasAnchor) return [0, 0];
 		const [ax, ay] = this.anchor;
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const size = this.intrinsicSize(m);
 		if (!size) {
 			if (!this.#warnedAnchor) {
@@ -869,7 +885,7 @@ var Text = class extends Node {
 	}
 	/** Text draws from a baseline origin at its align edge, not a center (§3.6). */
 	drawOffset(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const size = this.intrinsicSize(m);
 		const font = {
 			family: this.fontFamily,
@@ -889,7 +905,7 @@ var Text = class extends Node {
 	* text dimensions (e.g. underline width = () => title.measuredSize().w).
 	*/
 	measuredSize(measurer) {
-		return this.intrinsicSize(measurer ?? this.measurerSource?.() ?? estimatingMeasurer);
+		return this.intrinsicSize(measurer ?? this.measurerSource?.() ?? fallbackMeasurer());
 	}
 	/**
 	* Per-line ink boxes in this node's DRAW space (origin = first baseline at
@@ -899,7 +915,7 @@ var Text = class extends Node {
 	* reveals, selections.
 	*/
 	lineBoxes(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const text = this.text();
 		if (!text) return [];
 		const font = {
@@ -936,7 +952,7 @@ var Text = class extends Node {
 	* karaoke; draw your own rects for sub-line multi-color token work.
 	*/
 	wordBoxes(measurer) {
-		const m = measurer ?? this.measurerSource?.() ?? estimatingMeasurer;
+		const m = measurer ?? this.measurerSource?.() ?? fallbackMeasurer();
 		const text = this.text();
 		if (!text) return [];
 		const font = {
@@ -958,12 +974,15 @@ var Text = class extends Node {
 			const h = met.ascent + met.descent;
 			let prefix = "";
 			for (const seg of segmentWords(line)) {
-				const before = prefix === "" ? 0 : m.measureText(prefix, font).width;
+				const start = prefix;
 				prefix += seg;
-				if (seg.trim() === "") continue;
-				const after = m.measureText(prefix, font).width;
+				const word = seg.trim();
+				if (word === "") continue;
+				const lead = seg.length - seg.trimStart().length;
+				const before = m.measureText(start + seg.slice(0, lead), font).width;
+				const after = m.measureText(start + seg.trimEnd(), font).width;
 				boxes.push({
-					text: seg,
+					text: word,
 					line: i,
 					x: lineX + before,
 					y,
@@ -1022,4 +1041,4 @@ function requireLayoutEngine() {
 	return engine;
 }
 //#endregion
-export { validateFilters as C, invert as D, fromTRS as E, matEquals as O, glow as S, applyToPoint as T, quantize as _, Circle as a, createDisplayListBuilder as b, Path as c, Video as d, roundedRectSegs as f, estimatingMeasurer as g, breakLines as h, setLayoutEngine as i, multiply as k, Rect as l, resolveAnchor as m, getLayoutEngine as n, Group as o, Node as p, requireLayoutEngine as r, ImageNode as s, LayoutEngineMissingError as t, Text as u, segmentWords as v, IDENTITY as w, filtersToCanvasFilter as x, FilterValidationError as y };
+export { matEquals as A, filtersToCanvasFilter as C, applyToPoint as D, IDENTITY as E, fromTRS as O, createDisplayListBuilder as S, validateFilters as T, fallbackMeasurer as _, Circle as a, setDefaultMeasurer as b, Path as c, Video as d, roundedRectSegs as f, estimatingMeasurer as g, breakLines as h, setLayoutEngine as i, multiply as j, invert as k, Rect as l, resolveAnchor as m, getLayoutEngine as n, Group as o, Node as p, requireLayoutEngine as r, ImageNode as s, LayoutEngineMissingError as t, Text as u, quantize as v, glow as w, FilterValidationError as x, segmentWords as y };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glissade/scene",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "glissade scene graph: nodes, transforms, DisplayList emission. Renderer-agnostic; zero DOM/Node dependencies.",
   "license": "Apache-2.0",
   "type": "module",
@@ -20,7 +20,7 @@
   ],
   "dependencies": {
     "yoga-layout": "^3.2.1",
-    "@glissade/core": "0.4.2"
+    "@glissade/core": "0.4.4"
   },
   "repository": {
     "type": "git",