@glissade/scene 0.23.0-pre.0 → 0.23.0-pre.1

package/dist/describe.js

@@ -22,7 +22,7 @@ import { easings, listValueTypes } from "@glissade/core";
 * never pulled onto the base embed path — a scene that never calls `describe()`
 * pays zero bytes for it.
 */
-const RAW_VERSION = "0.23.0-pre.0";
+const RAW_VERSION = "0.23.0-pre.1";
 const PACKAGE_VERSION = RAW_VERSION.includes("GLISSADE_".concat("VERSION")) ? "0.0.0-dev" : RAW_VERSION;
 /** Arity of a value type's numeric repr: vec2/vec2-arc → 2, number → 1; others (color/paint/path/string/boolean) carry no scalar arity. */
 function arityOf(type) {

package/dist/nodes.d.ts

@@ -1,5 +1,5 @@
 import { C as Mat2x3, a as FilterSpec, d as Paint, f as PathSeg, g as ShaderRef, r as DisplayListBuilder, s as FontSpec, t as BlendMode } from "./displayList.js";
-import { BindableSignal, PathValue, ReadonlySignal, Rng, Track, ValueTypeId, Vec2, Vec2Signal } from "@glissade/core";
+import { BindableSignal, FontAxes, PathValue, ReadonlySignal, Rng, Track, ValueTypeId, Vec2, Vec2Signal } from "@glissade/core";
 
 //#region src/text.d.ts
 
@@ -682,14 +682,23 @@ interface TextProps extends NodeProps {
    * `ctx.fontVariationSettings`) renders the axes; the browser DOM 2D context
    * has no such property, so axes are best-effort there (a guarded no-op, never
    * a throw). OMITTED when unset, so default Text emits a byte-identical
-   * FontSpec. Axes are STATIC only in 0.20 — **animatable** axes (a `wght`
-   * track, `opsz` driven by size, …) are deferred to 1.0 (an opaque CSS string
-   * isn't lerp-able); a track targeting `<id>/fontVariationSettings` hard-throws
-   * `UnboundTargetError` today (no property signal resolves to it). For a
-   * dynamic weight, use the discrete `fontWeight` named instances your font
-   * ships.
+   * FontSpec. This is the STATIC form (an opaque CSS string isn't lerp-able);
+   * to ANIMATE an axis (`wght`, `opsz`, …), use {@link fontAxes} instead — a
+   * structured, per-axis-interpolated map (0.23). When both are given, `fontAxes`
+   * (if non-empty) wins.
    */
   fontVariationSettings?: string;
+  /**
+   * Variable-font axes as a STRUCTURED, ANIMATABLE map — `{ wght: 700, opsz: 14 }`
+   * (0.23). Unlike the opaque {@link fontVariationSettings} string, this is a
+   * lerp-able value type (`fontAxes`): a track on `<id>/fontAxes` interpolates
+   * each axis per-frame, formatted to the CSS `font-variation-settings` string at
+   * draw (so backends are unchanged). Both keyframes of a track must declare the
+   * SAME axis tags (a mismatched set snaps + warns, like path/paint topology).
+   * Empty/unset ⇒ omitted, so default Text stays byte-identical. Track target
+   * `<id>/fontAxes`, value type `fontAxes`.
+   */
+  fontAxes?: PropInit<FontAxes>;
   /** Horizontal alignment about the node position; default 'left'. */
   align?: 'left' | 'center' | 'right';
   /** Wrap width in px; unset = no wrapping (explicit \n still breaks). */
@@ -736,6 +745,9 @@ declare class Text extends Node {
   readonly fontStyle: 'normal' | 'italic';
   /** Static variable-font axes (CSS `font-variation-settings`); undefined = none. */
   readonly fontVariationSettings: string | undefined;
+  /** Animatable variable-font axes (track target `<id>/fontAxes`); empty = none.
+   *  When non-empty, overrides {@link fontVariationSettings} in the FontSpec. */
+  readonly fontAxes: BindableSignal<FontAxes>;
   readonly align: 'left' | 'center' | 'right';
   readonly width: BindableSignal<number>;
   readonly lineHeight: number;

package/dist/nodes.js

@@ -1844,6 +1844,12 @@ var Video = class Video extends Node {
 		});
 	}
 };
+/** Format a variable-font axis map → the CSS `font-variation-settings` string,
+*  `'"wght" 700, "opsz" 14'`. Axis tags are SORTED so the same axes always emit
+*  the same string regardless of insertion order — a deterministic FontSpec. */
+function formatFontAxes(axes) {
+	return Object.keys(axes).sort().map((tag) => `"${tag}" ${axes[tag]}`).join(", ");
+}
 var Text = class Text extends Node {
 	/** Taxonomy name pinned literally (survives IIFE minification — see {@link Group}). */
 	get describeType() {
@@ -1857,6 +1863,9 @@ var Text = class Text extends Node {
 	fontStyle;
 	/** Static variable-font axes (CSS `font-variation-settings`); undefined = none. */
 	fontVariationSettings;
+	/** Animatable variable-font axes (track target `<id>/fontAxes`); empty = none.
+	*  When non-empty, overrides {@link fontVariationSettings} in the FontSpec. */
+	fontAxes;
 	align;
 	width;
 	lineHeight;
@@ -1878,6 +1887,7 @@ var Text = class Text extends Node {
 		this.fontWeight = props.fontWeight ?? 400;
 		this.fontStyle = props.fontStyle ?? "normal";
 		this.fontVariationSettings = props.fontVariationSettings;
+		this.fontAxes = initProp(signal({}), props.fontAxes);
 		this.align = props.align ?? "left";
 		this.width = initProp(signal(0), props.width);
 		this.lineHeight = props.lineHeight ?? 1.25;
@@ -1890,6 +1900,7 @@ var Text = class Text extends Node {
 		this.registerTarget("fontSize", this.fontSize, "number");
 		this.registerTarget("reveal", this.reveal, "number");
 		this.registerTarget("revealFraction", this.revealFraction, "number");
+		this.registerTarget("fontAxes", this.fontAxes, "fontAxes");
 		if (new.target === Text) this.checkProps(props);
 	}
 	/**
@@ -1900,12 +1911,14 @@ var Text = class Text extends Node {
 	* golden corpus depends on it).
 	*/
 	fontSpec() {
+		const axes = this.fontAxes();
+		const fvs = Object.keys(axes).length > 0 ? formatFontAxes(axes) : this.fontVariationSettings;
 		return {
 			family: this.fontFamily,
 			size: this.fontSize(),
 			weight: this.fontWeight,
 			...this.fontStyle === "italic" ? { style: "italic" } : {},
-			...this.fontVariationSettings !== void 0 ? { fontVariationSettings: this.fontVariationSettings } : {},
+			...fvs !== void 0 ? { fontVariationSettings: fvs } : {},
 			...this.letterSpacing !== void 0 ? { letterSpacing: this.letterSpacing } : {}
 		};
 	}

package/package.json

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