@pixodesk/svg-animator-web 1.0.35 → 1.0.40

package/dist/index.prerendered-waapi.umd.js

@@ -50,530 +50,107 @@ var PixodeskAnimator = (() => {
   // src/index.prerendered-waapi.ts
   var index_prerendered_waapi_exports = {};
   __export(index_prerendered_waapi_exports, {
-    PX_ANIMATOR_DATA_KEY: () => PX_ANIMATOR_DATA_KEY,
+    PX_ANIMATOR_DOC_KEY: () => PX_ANIMATOR_DOC_KEY,
     createAnimator: () => createPrerenderedWaapiAnimator,
     setupAnimationTriggers: () => setupAnimationTriggers
   });
 
-  // ../svg-animator-core/src/util/PxAnimatorUtil.ts
-  function bezierToSvgPath(path, forceCurves = false) {
-    var _a, _b, _c, _d;
-    const v = path.v;
-    const i = path.i;
-    const o = path.o;
-    const c = path.c;
-    if (!v.length) return "";
-    const d = [];
-    const len = v.length;
-    d.push("M" + v[0][0] + "," + v[0][1]);
-    for (let idx = 1; idx < len; idx++) {
-      const prevV = v[idx - 1];
-      const prevO = (_a = o == null ? void 0 : o[idx - 1]) != null ? _a : prevV;
-      const currI = (_b = i == null ? void 0 : i[idx]) != null ? _b : v[idx];
-      const currV = v[idx];
-      const isLine = !forceCurves && (prevO[0] === prevV[0] && prevO[1] === prevV[1]) && (currI[0] === currV[0] && currI[1] === currV[1]);
-      if (isLine) {
-        d.push("L" + currV[0] + "," + currV[1]);
-      } else {
-        d.push("C" + prevO[0] + "," + prevO[1] + "," + currI[0] + "," + currI[1] + "," + currV[0] + "," + currV[1]);
-      }
-    }
-    if (c && len > 0) {
-      const lastV = v[len - 1];
-      const lastO = (_c = o == null ? void 0 : o[len - 1]) != null ? _c : lastV;
-      const firstI = (_d = i == null ? void 0 : i[0]) != null ? _d : v[0];
-      const firstV = v[0];
-      const isLine = !forceCurves && (lastO[0] === lastV[0] && lastO[1] === lastV[1]) && (firstI[0] === firstV[0] && firstI[1] === firstV[1]);
-      if (!isLine) {
-        d.push("C" + lastO[0] + "," + lastO[1] + "," + firstI[0] + "," + firstI[1] + "," + firstV[0] + "," + firstV[1]);
-      }
-      d.push("z");
-    }
-    return d.join("");
-  }
-  function interpolateNum(a, b, t) {
-    return a + (b - a) * t;
-  }
-  function interpolateVec(a, b, t) {
-    const res = [];
-    const count = Math.max(a.length, b.length);
-    for (let i = 0; i < count; i++) {
-      res[i] = interpolateNum(a[i] || 0, b[i] || 0, t);
+  // ../svg-animator-core/src/schema/PxSchema.ts
+  var PX_UNKNOWN_KEY_ERROR = "unexpected extra key";
+  function pathStr(path) {
+    if (!path.length) return ".";
+    let result = "";
+    for (const seg of path) {
+      if (seg.startsWith("[")) result += seg;
+      else result += (result ? "." : "") + seg;
     }
-    return res;
-  }
-  function interpolateColor(a, b, t) {
-    return [
-      interpolateNum(a[0] || 0, b[0] || 0, t),
-      interpolateNum(a[1] || 0, b[1] || 0, t),
-      interpolateNum(a[2] || 0, b[2] || 0, t),
-      interpolateNum(a[3] === void 0 ? 1 : a[3], b[3] === void 0 ? 1 : b[3], t)
-    ];
+    return result;
   }
-  function interpolateBeziers(paths1, paths2, progress) {
-    const count = Math.max(paths1.length, paths2.length);
-    const res = [];
-    for (let i = 0; i < count; i++) {
-      res.push(interpolateBezier(paths1[i], paths2[i], progress));
+  var Base = class {
+    _canSanitize(raw) {
+      return this.isValid(raw);
     }
-    return res;
-  }
-  function interpolateBezier(path1, path2, progress) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
-    if (!path1 || !path2) return path1 || path2 || { v: [] };
-    const t = Math.min(Math.max(progress, 0), 1);
-    const len = Math.min(path1.v.length, path2.v.length);
-    const v = [];
-    const i = [];
-    const o = [];
-    for (let idx = 0; idx < len; idx++) {
-      const v1 = path1.v[idx];
-      const v2 = path2.v[idx];
-      v.push(interpolateVec(v1, v2, t));
-      const i1 = (_b = (_a = path1.i) == null ? void 0 : _a[idx]) != null ? _b : v1;
-      const i2 = (_d = (_c = path2.i) == null ? void 0 : _c[idx]) != null ? _d : v2;
-      i.push(interpolateVec(i1, i2, t));
-      const o1 = (_f = (_e = path1.o) == null ? void 0 : _e[idx]) != null ? _f : v1;
-      const o2 = (_h = (_g = path2.o) == null ? void 0 : _g[idx]) != null ? _h : v2;
-      o.push(interpolateVec(o1, o2, t));
+    optional() {
+      return new Optional(this);
     }
-    return { v, i: i.length ? i : void 0, o: o.length ? o : void 0, c: (_i = path1.c) != null ? _i : path2.c };
-  }
-  function solveCubicBezierX(p1x, p2x, x) {
-    if (x <= 0) return 0;
-    if (x >= 1) return 1;
-    const cx = 3 * p1x;
-    const bx = 3 * (p2x - p1x) - cx;
-    const ax = 1 - cx - bx;
-    function sampleX(t) {
-      return ((ax * t + bx) * t + cx) * t;
+  };
+  var Optional = class extends Base {
+    constructor(inner) {
+      super();
+      this.inner = inner;
+      this._default = void 0;
     }
-    function sampleDX(t) {
-      return (3 * ax * t + 2 * bx) * t + cx;
+    sanitize(raw) {
+      if (raw === void 0 || raw === null) return void 0;
+      return this.inner._canSanitize(raw) ? this.inner.sanitize(raw) : void 0;
     }
-    let t2 = x;
-    let t0 = 0;
-    let t1 = 1;
-    for (let i = 0; i < 8; i++) {
-      const x2 = sampleX(t2) - x;
-      if (Math.abs(x2) < 1e-6) return t2;
-      const d2 = sampleDX(t2);
-      if (Math.abs(d2) < 1e-6) break;
-      t2 -= x2 / d2;
+    isValid(raw, ctx, path) {
+      if (raw === void 0 || raw === null) return true;
+      return this.inner.isValid(raw, ctx, path);
     }
-    t2 = x;
-    while (t0 < t1) {
-      const x2 = sampleX(t2);
-      if (Math.abs(x2 - x) < 1e-6) return t2;
-      if (x > x2) t0 = t2;
-      else t1 = t2;
-      t2 = (t1 + t0) / 2;
+    _canSanitize(raw) {
+      return raw === void 0 || raw === null || this.inner._canSanitize(raw);
     }
-    return t2;
-  }
-  function cubicBezier(easing) {
-    const [p1x, p1y, p2x, p2y] = easing;
-    const cy = 3 * p1y;
-    const by = 3 * (p2y - p1y) - cy;
-    const ay = 1 - cy - by;
-    function sampleCurveY(t) {
-      return ((ay * t + by) * t + cy) * t;
+  };
+  var Str = class extends Base {
+    constructor(_default = "") {
+      super();
+      this._default = _default;
     }
-    return function(x) {
-      return sampleCurveY(solveCubicBezierX(p1x, p2x, x));
-    };
-  }
-  function lerp2(a, b, t) {
-    return [a[0] + (b[0] - a[0]) * t, a[1] + (b[1] - a[1]) * t];
-  }
-  function subdivideCubicBezier(p0, p1, p2, p3, t) {
-    const q0 = lerp2(p0, p1, t);
-    const q1 = lerp2(p1, p2, t);
-    const q2 = lerp2(p2, p3, t);
-    const r0 = lerp2(q0, q1, t);
-    const r1 = lerp2(q1, q2, t);
-    const s = lerp2(r0, r1, t);
-    return {
-      left: [p0, q0, r0, s],
-      right: [s, r1, q2, p3]
-    };
-  }
-  function splitEasing(easing, xFraction) {
-    if (!easing) return { left: void 0, right: void 0 };
-    if (xFraction <= 0) return { left: void 0, right: easing };
-    if (xFraction >= 1) return { left: easing, right: void 0 };
-    const [x1, y1, x2, y2] = easing;
-    const t = solveCubicBezierX(x1, x2, xFraction);
-    const p0 = [0, 0];
-    const p1 = [x1, y1];
-    const p2 = [x2, y2];
-    const p3 = [1, 1];
-    const { left, right } = subdivideCubicBezier(p0, p1, p2, p3, t);
-    const sx = left[3][0];
-    const sy = left[3][1];
-    let leftEasing;
-    if (sx > 1e-9 && Math.abs(sy) > 1e-9) {
-      leftEasing = [
-        left[1][0] / sx,
-        left[1][1] / sy,
-        left[2][0] / sx,
-        left[2][1] / sy
-      ];
+    sanitize(raw) {
+      return typeof raw === "string" ? raw : this._default;
     }
-    let rightEasing;
-    const rx = 1 - sx;
-    const ry = 1 - sy;
-    if (rx > 1e-9 && Math.abs(ry) > 1e-9) {
-      rightEasing = [
-        (right[1][0] - sx) / rx,
-        (right[1][1] - sy) / ry,
-        (right[2][0] - sx) / rx,
-        (right[2][1] - sy) / ry
-      ];
+    isValid(raw, ctx, path) {
+      if (typeof raw === "string") return true;
+      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected string, got " + typeof raw);
+      return false;
     }
-    return { left: leftEasing, right: rightEasing };
-  }
-  function reverseEasing(easing) {
-    if (!easing) return void 0;
-    return [1 - easing[2], 1 - easing[3], 1 - easing[0], 1 - easing[1]];
-  }
-  function toRGBA(color) {
-    const r = Math.round(color[0] * 255);
-    const g = Math.round(color[1] * 255);
-    const b = Math.round(color[2] * 255);
-    return color.length === 4 ? "rgba(" + r + "," + g + "," + b + "," + color[3] + ")" : "rgb(" + r + "," + g + "," + b + ")";
-  }
-  function parseRgba(s) {
-    var _a;
-    const inner = (_a = s.match(/rgba?\((.*)\)/)) == null ? void 0 : _a[1];
-    if (!inner) throw new Error("Invalid rgb/rgba format");
-    const parts = inner.split(",").map((v) => +v.trim());
-    return [parts[0] / 255, parts[1] / 255, parts[2] / 255, ...parts[3] !== void 0 ? [parts[3]] : []];
-  }
-  function parseHex(s) {
-    const hex = s.slice(1);
-    const isShort = hex.length <= 4;
-    const r = isShort ? hex[0] + hex[0] : hex.slice(0, 2);
-    const g = isShort ? hex[1] + hex[1] : hex.slice(2, 4);
-    const b = isShort ? hex[2] + hex[2] : hex.slice(4, 6);
-    const a = hex.length === 4 ? hex[3] + hex[3] : hex.length === 8 ? hex.slice(6, 8) : null;
-    const result = [
-      parseInt(r, 16) / 255,
-      parseInt(g, 16) / 255,
-      parseInt(b, 16) / 255
-    ];
-    if (a !== null) {
-      result.push(parseInt(a, 16) / 255);
+  };
+  var Num = class extends Base {
+    constructor(_default = 0) {
+      super();
+      this._default = _default;
     }
-    return result;
-  }
-  function parseColor(s) {
-    if (!s) return void 0;
-    if (Array.isArray(s)) return s;
-    if (typeof s !== "string") return void 0;
-    if (s.startsWith("#")) {
-      return parseHex(s);
-    } else if (s.startsWith("rgb")) {
-      return parseRgba(s);
-    } else {
-      console.warn("Unsupported color format: " + s);
+    sanitize(raw) {
+      return typeof raw === "number" && isFinite(raw) ? raw : this._default;
     }
-    return void 0;
-  }
-  var COLOUR_ATTR_NAMES = /* @__PURE__ */ new Set(["color", "fill", "flood-color", "lighting-color", "stop-color", "stroke"]);
-  var TRANSFORM_FN_NAMES = /* @__PURE__ */ new Set(["translate", "rotate", "scale", "skew"]);
-  var PCT_BASED_ATTR_NAMES = /* @__PURE__ */ new Set(["offset-distance", "offsetDistance"]);
-  function composeTransformParts(parts, opts) {
-    var _a;
-    if (!parts) return "";
-    const withUnits = (_a = opts == null ? void 0 : opts.withUnits) != null ? _a : true;
-    const segs = [];
-    const t = parts.translate;
-    const o = parts.origin;
-    const r = parts.rotate;
-    const k = parts.skew;
-    const s = parts.scale;
-    const tu = withUnits ? "px" : "";
-    const ru = withUnits ? "deg" : "";
-    if (t) segs.push("translate(" + t[0] + tu + "," + t[1] + tu + ")");
-    if (o) segs.push("translate(" + o[0] + tu + "," + o[1] + tu + ")");
-    if (r !== void 0 && r !== null) segs.push("rotate(" + r + ru + ")");
-    if (k !== void 0 && k !== null) segs.push("skewX(" + k + ru + ")");
-    if (s) segs.push("scale(" + s[0] + "," + s[1] + ")");
-    if (o) segs.push("translate(" + -o[0] + tu + "," + -o[1] + tu + ")");
-    return segs.join("");
-  }
-  function parseTransformParts(str) {
-    var _a, _b;
-    if (!str || typeof str !== "string") return void 0;
-    const out = {};
-    const re = /([a-zA-Z]+)\s*\(([^)]*)\)/g;
-    const order = ["translate", "rotate", "skewX", "scale"];
-    let lastIdx = -1;
-    let m;
-    while ((m = re.exec(str)) !== null) {
-      const fn = m[1];
-      const idx = order.indexOf(fn);
-      if (idx < 0 || idx <= lastIdx) return void 0;
-      lastIdx = idx;
-      const nums = m[2].split(/[\s,]+/).filter(Boolean).map(Number);
-      if (nums.some((n) => Number.isNaN(n))) return void 0;
-      if (fn === "translate") {
-        if (nums.length < 1 || nums.length > 2) return void 0;
-        out.translate = [nums[0], (_a = nums[1]) != null ? _a : 0];
-      } else if (fn === "rotate") {
-        if (nums.length !== 1) return void 0;
-        out.rotate = nums[0];
-      } else if (fn === "skewX") {
-        if (nums.length !== 1) return void 0;
-        out.skew = nums[0];
-      } else {
-        if (nums.length < 1 || nums.length > 2) return void 0;
-        out.scale = [nums[0], (_b = nums[1]) != null ? _b : nums[0]];
-      }
-    }
-    if (str.replace(/([a-zA-Z]+)\s*\(([^)]*)\)/g, "").replace(/[\s,]/g, "").length) return void 0;
-    return Object.keys(out).length ? out : void 0;
-  }
-  function kebabToCamelCaseWord(kebab) {
-    return kebab.includes("-") ? kebab.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()) : kebab;
-  }
-  function isCamelCaseWord(word) {
-    return !word.includes("-") && /[a-z][A-Z]/.test(word);
-  }
-  var SVG_CAMEL_CASE_ATTRS = /* @__PURE__ */ new Set([
-    // Transform/positioning
-    "viewBox",
-    "preserveAspectRatio",
-    // Gradient
-    "gradientUnits",
-    "gradientTransform",
-    "spreadMethod",
-    // Pattern
-    "patternUnits",
-    "patternContentUnits",
-    "patternTransform",
-    // Clipping/masking
-    "clipPathUnits",
-    "maskUnits",
-    "maskContentUnits",
-    // Marker  (SVG spec keeps these camelCase, like viewBox)
-    "markerUnits",
-    "markerWidth",
-    "markerHeight",
-    "refX",
-    "refY",
-    // Text
-    "textLength",
-    "lengthAdjust",
-    "startOffset",
-    // Filter
-    "filterUnits",
-    "primitiveUnits",
-    "tableValues",
-    // feFuncR/G/B/A transfer table (type="table")
-    "stdDeviation",
-    "baseFrequency",
-    "numOctaves",
-    "surfaceScale",
-    "diffuseConstant",
-    "specularConstant",
-    "specularExponent",
-    "kernelMatrix",
-    "kernelUnitLength",
-    "edgeMode",
-    "preserveAlpha",
-    "targetX",
-    "targetY"
-    // // Animation
-    // 'attributeName',
-    // 'attributeType',
-    // 'calcMode',
-    // 'keyTimes',
-    // 'keySplines',
-    // 'repeatCount',
-    // 'repeatDur'    
-  ]);
-  function camelCaseToKebabWordIfNeeded(camel) {
-    return SVG_CAMEL_CASE_ATTRS.has(camel) ? camel : camel.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-  }
-  function clamp(value, min, max) {
-    return Math.max(min, Math.min(value, max));
-  }
-  function bezier2D_pointAt(P0, P1, P2, P3, t) {
-    if (t <= 0) return [P0[0], P0[1]];
-    if (t >= 1) return [P3[0], P3[1]];
-    const u = 1 - t;
-    const u2 = u * u;
-    const u3 = u2 * u;
-    const t2 = t * t;
-    const t3 = t2 * t;
-    const w0 = u3;
-    const w1 = 3 * t * u2;
-    const w2 = 3 * t2 * u;
-    const w3 = t3;
-    return [
-      w0 * P0[0] + w1 * P1[0] + w2 * P2[0] + w3 * P3[0],
-      w0 * P0[1] + w1 * P1[1] + w2 * P2[1] + w3 * P3[1]
-    ];
-  }
-  var BEZIER_T_NUDGE = 1e-4;
-  function bezier2D_derivativeAt(P0, P1, P2, P3, t) {
-    const result = _bezier2D_derivativeAtRaw(P0, P1, P2, P3, t);
-    if (result[0] === 0 && result[1] === 0) {
-      const nudgedT = t < 0.5 ? t + BEZIER_T_NUDGE : t - BEZIER_T_NUDGE;
-      return _bezier2D_derivativeAtRaw(P0, P1, P2, P3, nudgedT);
-    }
-    return result;
-  }
-  function _bezier2D_derivativeAtRaw(P0, P1, P2, P3, t) {
-    const u = 1 - t;
-    const a = 3 * u * u;
-    const b = 6 * t * u;
-    const c = 3 * t * t;
-    return [
-      a * (P1[0] - P0[0]) + b * (P2[0] - P1[0]) + c * (P3[0] - P2[0]),
-      a * (P1[1] - P0[1]) + b * (P2[1] - P1[1]) + c * (P3[1] - P2[1])
-    ];
-  }
-  function bezier2D_arcLengthLUT(P0, P1, P2, P3, steps = 100) {
-    const n = steps + 1;
-    const ts = new Float64Array(n);
-    const ds = new Float64Array(n);
-    let prev = bezier2D_pointAt(P0, P1, P2, P3, 0);
-    ts[0] = 0;
-    ds[0] = 0;
-    let cum = 0;
-    for (let i = 1; i < n; i++) {
-      const t = i / steps;
-      const cur = bezier2D_pointAt(P0, P1, P2, P3, t);
-      const dx = cur[0] - prev[0];
-      const dy = cur[1] - prev[1];
-      cum += Math.sqrt(dx * dx + dy * dy);
-      ts[i] = t;
-      ds[i] = cum;
-      prev = cur;
-    }
-    return { ts, ds };
-  }
-  function bezier2D_arcAtT(lut, t) {
-    const { ts, ds } = lut;
-    const last = ts.length - 1;
-    if (t <= ts[0]) return ds[0];
-    if (t >= ts[last]) return ds[last];
-    let lo = 1, hi = last;
-    while (lo < hi) {
-      const mid = lo + hi >>> 1;
-      if (ts[mid] < t) lo = mid + 1;
-      else hi = mid;
-    }
-    const tPrev = ts[hi - 1];
-    const span = ts[hi] - tPrev;
-    const frac = span > 0 ? (t - tPrev) / span : 0;
-    return ds[hi - 1] + frac * (ds[hi] - ds[hi - 1]);
-  }
-  function invertEasing(easing) {
-    if (!easing) return (y) => y;
-    const flipped = [easing[1], easing[0], easing[3], easing[2]];
-    return cubicBezier(flipped);
-  }
-
-  // ../svg-animator-core/src/schema/PxSchema.ts
-  var PX_UNKNOWN_KEY_ERROR = "unexpected extra key";
-  function pathStr(path) {
-    if (!path.length) return ".";
-    let result = "";
-    for (const seg of path) {
-      if (seg.startsWith("[")) result += seg;
-      else result += (result ? "." : "") + seg;
-    }
-    return result;
-  }
-  var Base = class {
-    _canSanitize(raw) {
-      return this.isValid(raw);
-    }
-    optional() {
-      return new Optional(this);
+    isValid(raw, ctx, path) {
+      if (typeof raw === "number" && isFinite(raw)) return true;
+      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected finite number, got " + JSON.stringify(raw));
+      return false;
     }
   };
-  var Optional = class extends Base {
-    constructor(inner) {
+  var Bool = class extends Base {
+    constructor(_default = false) {
       super();
-      this.inner = inner;
-      this._default = void 0;
+      this._default = _default;
     }
     sanitize(raw) {
-      if (raw === void 0 || raw === null) return void 0;
-      return this.inner._canSanitize(raw) ? this.inner.sanitize(raw) : void 0;
+      return typeof raw === "boolean" ? raw : this._default;
     }
     isValid(raw, ctx, path) {
-      if (raw === void 0 || raw === null) return true;
-      return this.inner.isValid(raw, ctx, path);
-    }
-    _canSanitize(raw) {
-      return raw === void 0 || raw === null || this.inner._canSanitize(raw);
+      if (typeof raw === "boolean") return true;
+      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected boolean, got " + typeof raw);
+      return false;
     }
   };
-  var Str = class extends Base {
-    constructor(_default = "") {
+  var Literal = class extends Base {
+    constructor(value) {
       super();
-      this._default = _default;
+      this.value = value;
+      this._default = value;
     }
     sanitize(raw) {
-      return typeof raw === "string" ? raw : this._default;
+      return raw === this.value ? this.value : this._default;
     }
     isValid(raw, ctx, path) {
-      if (typeof raw === "string") return true;
-      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected string, got " + typeof raw);
+      if (raw === this.value) return true;
+      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected " + JSON.stringify(this.value) + ", got " + JSON.stringify(raw));
       return false;
     }
   };
-  var Num = class extends Base {
-    constructor(_default = 0) {
-      super();
-      this._default = _default;
-    }
-    sanitize(raw) {
-      return typeof raw === "number" && isFinite(raw) ? raw : this._default;
-    }
-    isValid(raw, ctx, path) {
-      if (typeof raw === "number" && isFinite(raw)) return true;
-      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected finite number, got " + JSON.stringify(raw));
-      return false;
-    }
-  };
-  var Bool = class extends Base {
-    constructor(_default = false) {
-      super();
-      this._default = _default;
-    }
-    sanitize(raw) {
-      return typeof raw === "boolean" ? raw : this._default;
-    }
-    isValid(raw, ctx, path) {
-      if (typeof raw === "boolean") return true;
-      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected boolean, got " + typeof raw);
-      return false;
-    }
-  };
-  var Literal = class extends Base {
-    constructor(value) {
-      super();
-      this.value = value;
-      this._default = value;
-    }
-    sanitize(raw) {
-      return raw === this.value ? this.value : this._default;
-    }
-    isValid(raw, ctx, path) {
-      if (raw === this.value) return true;
-      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": expected " + JSON.stringify(this.value) + ", got " + JSON.stringify(raw));
-      return false;
-    }
-  };
-  var Enum = class extends Base {
-    constructor(values, defaultVal) {
+  var Enum = class extends Base {
+    constructor(values, defaultVal) {
       super();
       this.values = values;
       this._default = defaultVal != null ? defaultVal : values[0];
@@ -587,6 +164,7 @@ var PixodeskAnimator = (() => {
       return false;
     }
   };
+  var UNION_MEMBER_ERROR_LIMIT = 4;
   var Union = class extends Base {
     constructor(schemas, defaultVal) {
       super();
@@ -605,7 +183,35 @@ var PixodeskAnimator = (() => {
       var _a;
       const probe = ctx && { errors: [], warnings: [], strict: ctx.strict };
       if (this.schemas.some((s) => s.isValid(raw, probe, path ? [...path] : void 0))) return true;
-      ctx == null ? void 0 : ctx.errors.push(pathStr(path != null ? path : []) + ": no union member matched for value " + ((_a = JSON.stringify(raw)) != null ? _a : "").slice(0, 240));
+      if (!ctx) return false;
+      const base = pathStr(path != null ? path : []);
+      ctx.errors.push(base + ": no union member matched for value " + ((_a = JSON.stringify(raw)) != null ? _a : "").slice(0, 240));
+      let best;
+      let bestDepth = -1;
+      const leafExpectations = [];
+      for (const member of this.schemas) {
+        const sink = { errors: [], warnings: [], strict: ctx.strict };
+        member.isValid(raw, sink, path ? [...path] : void 0);
+        if (!sink.errors.length) continue;
+        const depth = Math.max(...sink.errors.map((e) => e.slice(0, e.indexOf(":")).length));
+        if (depth > bestDepth || depth === bestDepth && best && sink.errors.length < best.length) {
+          bestDepth = depth;
+          best = sink.errors;
+        }
+        if (depth <= base.length) {
+          for (const e of sink.errors) {
+            const m = /: expected (.+?), got /.exec(e);
+            if (m && !leafExpectations.includes(m[1])) leafExpectations.push(m[1]);
+          }
+        }
+      }
+      if (best && bestDepth > base.length) {
+        for (const e of best.slice(0, UNION_MEMBER_ERROR_LIMIT)) {
+          if (!ctx.errors.includes(e)) ctx.errors.push(e);
+        }
+      } else if (leafExpectations.length) {
+        ctx.errors.push(base + ": expected " + leafExpectations.join(" | "));
+      }
       return false;
     }
     _canSanitize(raw) {
@@ -957,6 +563,76 @@ var PixodeskAnimator = (() => {
   };
 
   // ../svg-animator-core/src/format/PxAnimatorConstants.ts
+  var PxFillMode = {
+    forwards: "forwards",
+    backwards: "backwards",
+    both: "both",
+    none: "none"
+  };
+  var PxPlaybackDirection = {
+    normal: "normal",
+    reverse: "reverse",
+    alternate: "alternate",
+    alternateReverse: "alternate-reverse"
+  };
+  var PxStartOn = {
+    load: "load",
+    mouseOver: "mouseOver",
+    click: "click",
+    scrollIntoView: "scrollIntoView",
+    programmatic: "programmatic"
+  };
+  var PxOutAction = {
+    continue: "continue",
+    pause: "pause",
+    reset: "reset",
+    reverse: "reverse"
+  };
+  var PxFinishAction = {
+    hold: "hold",
+    reset: "reset"
+  };
+  var PxScrollKind = {
+    view: "view",
+    scroll: "scroll"
+  };
+  var PxScrollAxis = {
+    block: "block",
+    inline: "inline",
+    x: "x",
+    y: "y"
+  };
+  var PxScrollSource = {
+    nearest: "nearest",
+    root: "root"
+  };
+  var PxPinAlign = {
+    top: "top",
+    center: "center",
+    bottom: "bottom"
+  };
+  var PxScrollPhase = {
+    cover: "cover",
+    contain: "contain",
+    entry: "entry",
+    exit: "exit",
+    entryCrossing: "entry-crossing",
+    exitCrossing: "exit-crossing"
+  };
+  var PxAlongPathMode = {
+    sampled: "sampled",
+    offsetPath: "offsetPath"
+  };
+  var PX_TIMELINE_SHARED_KEYS = ["duration", "iterations", "engine", "frameRate"];
+  var PX_TIME_ONLY_TIMELINE_KEYS = ["trigger", "delay", "fillMode", "direction"];
+  var PX_FLAT_RUNTIME_VIEW_KEYS = [
+    ...PX_TIMELINE_SHARED_KEYS,
+    ...PX_TIME_ONLY_TIMELINE_KEYS,
+    "fill",
+    "resetOnFinish",
+    "timelineSource",
+    "scroll"
+  ];
   var PxTimelineEngine = {
     native: "native",
     js: "js"
@@ -964,6 +640,19 @@ var PixodeskAnimator = (() => {
   var PxTimelineEngineExtra = __spreadProps(__spreadValues({}, PxTimelineEngine), {
     auto: "auto"
   });
+  var PX_TRIGGER_DEFAULTS = {
+    startOn: "load",
+    outAction: "continue",
+    scrollIntoViewThreshold: 0
+  };
+  function resolveTrigger(trigger) {
+    var _a, _b, _c;
+    return {
+      startOn: (_a = trigger == null ? void 0 : trigger.startOn) != null ? _a : PX_TRIGGER_DEFAULTS.startOn,
+      outAction: (_b = trigger == null ? void 0 : trigger.outAction) != null ? _b : PX_TRIGGER_DEFAULTS.outAction,
+      scrollIntoViewThreshold: (_c = trigger == null ? void 0 : trigger.scrollIntoViewThreshold) != null ? _c : PX_TRIGGER_DEFAULTS.scrollIntoViewThreshold
+    };
+  }
   var PxLoopRepeatAt = {
     /** Segment from the START; the repetition runs BEFORE the first keyframe
      *  (intro loops that play until the main timeline begins). */
@@ -1023,10 +712,6 @@ var PixodeskAnimator = (() => {
     TRANSFORM_PART.scale,
     TRANSFORM_PART.origin
   ];
-  var PxGradientUnits = {
-    userSpaceOnUse: "userSpaceOnUse",
-    objectBoundingBox: "objectBoundingBox"
-  };
   var PxGradientSpreadMethod = {
     pad: "pad",
     reflect: "reflect",
@@ -1039,8 +724,18 @@ var PixodeskAnimator = (() => {
   function getAnimatorConfig(doc) {
     var _a;
     const cfg = (doc == null ? void 0 : doc.animator) || ((_a = doc == null ? void 0 : doc.meta) == null ? void 0 : _a.animator);
-    return cfg ? flattenAnimatorTimeline(cfg) : void 0;
-  }
+    if (!cfg) return void 0;
+    const memoised = wireViewMemo.get(cfg);
+    if (memoised) return memoised;
+    const wire = cfg;
+    const stray = PX_FLAT_RUNTIME_VIEW_KEYS.filter((k) => wire[k] !== void 0);
+    const source = stray.length ? __spreadValues({}, wire) : cfg;
+    for (const k of stray) delete source[k];
+    const view = flattenAnimatorTimeline(source);
+    wireViewMemo.set(cfg, view);
+    return view;
+  }
+  var wireViewMemo = /* @__PURE__ */ new WeakMap();
   var flattenMemo = /* @__PURE__ */ new WeakMap();
   function flattenAnimatorTimeline(cfg) {
     const timeline = cfg.timeline;
@@ -1066,7 +761,7 @@ var PixodeskAnimator = (() => {
       else if (pin && typeof pin === "object") {
         scroll.pin = true;
         if (pin.align !== void 0) scroll.pinAlign = pin.align;
-        if (pin.top !== void 0) scroll.pinTop = pin.top;
+        if (pin.offset !== void 0) scroll.pinOffset = pin.offset;
         if (pin.distance !== void 0) scroll.pinDistance = pin.distance;
       }
       flat.scroll = scroll;
@@ -1093,9 +788,7 @@ var PixodeskAnimator = (() => {
   function getBindings(doc) {
     var _a;
     if (!doc) return void 0;
-    const animateById = (_a = getAnimatorConfig(doc)) == null ? void 0 : _a.animateById;
-    if (!animateById) return void 0;
-    return Object.entries(animateById).map(([id, anim]) => ({ id: id.startsWith("#") ? id.slice(1) : id, animate: anim }));
+    return (_a = getAnimatorConfig(doc)) == null ? void 0 : _a.bindings;
   }
 
   // ../svg-animator-core/src/format/PxAnimatorTypes.ts
@@ -1108,14 +801,13 @@ var PixodeskAnimator = (() => {
     // e.g. for colors
     px.number(),
     px.array(px.number()),
-    // ORDER LAW: the key-discriminated object shapes (`{path}`, `{paths}`) come BEFORE the
+    // ORDER LAW: the key-discriminated object shape (`{pathData}`) comes BEFORE the
     // all-optional transform-parts record. In default (non-strict) mode that record accepts
     // ANY object (every key optional, unknown keys ignored), so listing it earlier made
-    // Union.sanitize route `{path}`/`{paths}` values into it and strip them to `{}` —
+    // Union.sanitize route `{pathData}` values into it and strip them to `{}` —
     // silent morph-data loss (repro: the editor's keyframeValueSanitize spec). Validity is
     // order-independent (`some()`); only sanitize routing depends on this order.
-    px.object({ path: px.string() }),
-    px.lazy(() => px.object({ paths: px.array(PxBezierPathSchema) }), { paths: [] }),
+    px.object({ pathData: px.string() }),
     // Gradient `stops` timeline — each kf value is the full stops-array snapshot.
     px.lazy(() => px.array(PxGradientStopSchema), []),
     px.lazy(() => PxTransformPartsSchema, {})
@@ -1155,7 +847,7 @@ var PixodeskAnimator = (() => {
     keyframes: px.array(PxKeyframeSchema).optional(),
     loop: px.union([PxLoopSchema, px.boolean()]).optional(),
     autoOrient: px.boolean().optional(),
-    alongPathMode: px.enum(["sampled", "offsetPath"]).optional()
+    alongPathMode: px.enum([PxAlongPathMode.sampled, PxAlongPathMode.offsetPath]).optional()
   }));
   var PxTransformPartsSchema = implementsInterface()(px.object({
     translate: px.tuple([px.number(), px.number()]).optional(),
@@ -1179,17 +871,17 @@ var PixodeskAnimator = (() => {
     PxAnimationDefinitionSchema
   ]));
   var PxTriggerSchema = implementsInterface()(px.object({
-    startOn: px.enum(["load", "mouseOver", "click", "scrollIntoView", "programmatic"]).optional(),
-    outAction: px.enum(["continue", "pause", "reset", "reverse"]).optional(),
+    startOn: px.enum([PxStartOn.load, PxStartOn.mouseOver, PxStartOn.click, PxStartOn.scrollIntoView, PxStartOn.programmatic], PX_TRIGGER_DEFAULTS.startOn).optional(),
+    outAction: px.enum([PxOutAction.continue, PxOutAction.pause, PxOutAction.reset, PxOutAction.reverse], PX_TRIGGER_DEFAULTS.outAction).optional(),
     // What happens after a NATURAL finish — `'hold'` (default: keep the end state per
     // `fill`) or `'reset'` (snap back to the start state). Pairs with `outAction` ("what
     // happens when the trigger condition ends"); both end-of-life knobs now read alike.
-    finishAction: px.enum(["hold", "reset"]).optional(),
+    finishAction: px.enum([PxFinishAction.hold, PxFinishAction.reset]).optional(),
     scrollIntoViewThreshold: px.number().optional()
   }));
   var PxGlyphSchema = implementsInterface()(px.object({
     width: px.number(),
-    d: px.string()
+    pathData: px.string()
   }));
   var PxGlyphFontSchema = implementsInterface()(px.object({
     fontFamily: px.string(),
@@ -1201,14 +893,17 @@ var PixodeskAnimator = (() => {
   var PxDefsSchema = implementsInterface()(px.object({
     easings: px.record(px.tuple([px.number(), px.number(), px.number(), px.number()])).optional(),
     animations: px.record(PxAnimationDefinitionSchema).optional(),
-    // Review §2.6: the schema now matches the declared type — a style preset is a flat
-    // record of string|number attribute values, nothing nested.
-    styles: px.record(px.record(px.union([px.string(), px.number()]))).optional(),
     fonts: px.record(PxGlyphFontSchema).optional()
   }));
-  var PX_SCROLL_PHASES = ["cover", "contain", "entry", "exit", "entry-crossing", "exit-crossing"];
   var PxScrollRangePointSchema = implementsInterface()(px.object({
-    phase: px.enum(PX_SCROLL_PHASES).optional(),
+    phase: px.enum([
+      PxScrollPhase.cover,
+      PxScrollPhase.contain,
+      PxScrollPhase.entry,
+      PxScrollPhase.exit,
+      PxScrollPhase.entryCrossing,
+      PxScrollPhase.exitCrossing
+    ]).optional(),
     fraction: px.number().optional()
   }));
   var PxScrollRangeSchema = px.object({
@@ -1216,21 +911,21 @@ var PixodeskAnimator = (() => {
     end: PxScrollRangePointSchema.optional()
   });
   var PxScrollSchema = implementsInterface()(px.object({
-    kind: px.enum(["view", "scroll"]).optional(),
-    axis: px.enum(["block", "inline", "x", "y"]).optional(),
-    source: px.enum(["nearest", "root"]).optional(),
+    kind: px.enum([PxScrollKind.view, PxScrollKind.scroll]).optional(),
+    axis: px.enum([PxScrollAxis.block, PxScrollAxis.inline, PxScrollAxis.x, PxScrollAxis.y]).optional(),
+    source: px.enum([PxScrollSource.nearest, PxScrollSource.root]).optional(),
     // Free-form: the two keywords `parent`/`scroller` plus any CSS selector.
     subject: px.string().optional(),
     smoothing: px.number().optional(),
     pin: px.boolean().optional(),
-    pinAlign: px.enum(["top", "center", "bottom"]).optional(),
-    pinTop: px.number().optional(),
+    pinAlign: px.enum([PxPinAlign.top, PxPinAlign.center, PxPinAlign.bottom]).optional(),
+    pinOffset: px.number().optional(),
     pinDistance: px.number().optional(),
     range: PxScrollRangeSchema.optional()
   }));
   var PxTimelinePinSchema = implementsInterface()(px.object({
-    align: px.enum(["top", "center", "bottom"]).optional(),
-    top: px.number().optional(),
+    align: px.enum([PxPinAlign.top, PxPinAlign.center, PxPinAlign.bottom]).optional(),
+    offset: px.number().optional(),
     distance: px.number().optional()
   }));
   var PxTimelineEngineSchema = px.enum([PxTimelineEngineExtra.auto, PxTimelineEngineExtra.native, PxTimelineEngineExtra.js]).optional();
@@ -1245,8 +940,8 @@ var PixodeskAnimator = (() => {
     iterations: px.union([px.number(), px.literal("infinite")]).optional(),
     // `fillMode` on the wire (CSS `animation-fill-mode`; the runtime view calls it `fill`)
     // — never `fill`, which is paint everywhere else in the format.
-    fillMode: px.enum(["forwards", "backwards", "both", "none"]).optional(),
-    direction: px.enum(["normal", "reverse", "alternate", "alternate-reverse"]).optional()
+    fillMode: px.enum([PxFillMode.forwards, PxFillMode.backwards, PxFillMode.both, PxFillMode.none]).optional(),
+    direction: px.enum([PxPlaybackDirection.normal, PxPlaybackDirection.reverse, PxPlaybackDirection.alternate, PxPlaybackDirection.alternateReverse]).optional()
   }));
   var scrollishTimelineShape = {
     // §2.8: duration is a property of the TIMELINE — under scrubbing it is the keyframe
@@ -1257,8 +952,8 @@ var PixodeskAnimator = (() => {
     iterations: px.number().optional(),
     engine: PxTimelineEngineSchema,
     frameRate: px.number().optional(),
-    axis: px.enum(["block", "inline", "x", "y"]).optional(),
-    source: px.enum(["nearest", "root"]).optional(),
+    axis: px.enum([PxScrollAxis.block, PxScrollAxis.inline, PxScrollAxis.x, PxScrollAxis.y]).optional(),
+    source: px.enum([PxScrollSource.nearest, PxScrollSource.root]).optional(),
     subject: px.string().optional(),
     // 'parent' | 'scroller' | any CSS selector
     smoothing: px.number().optional(),
@@ -1278,22 +973,22 @@ var PixodeskAnimator = (() => {
     PxScrollTimelineSchema,
     PxViewTimelineSchema
   ]);
+  var PxBindingSchema = implementsInterface()(px.object({
+    target: px.string(),
+    animateWith: px.array(px.string())
+  }));
   var PxAnimatorConfigSchema = implementsInterface()(px.object({
     // (`mode`, `duration` and `frameRate` live INSIDE `timeline` on the wire — §2.8; they exist
     // at this level only on the runtime view, like the rest of the playback dynamics.)
     // THE spelling of "what advances progress" — clock / scroll / view (review §2.1).
     timeline: PxTimelineSchema.optional(),
     definitions: PxDefsSchema.optional(),
-    animateById: px.record(PxElementAnimationSchema).optional(),
+    bindings: px.array(PxBindingSchema).optional(),
     debugGlobalName: px.string().optional(),
     // Declared HERE because this is a closed object: an undeclared key would be stripped by
     // `sanitize` and flagged by strict validation on our own files.
     version: px.string().optional()
   }));
-  var PxBindingSchema = implementsInterface()(px.object({
-    id: px.string(),
-    animate: PxElementAnimationSchema
-  }));
   var PxAttrValueSchema = px.union([
     px.string(),
     px.number(),
@@ -1347,7 +1042,7 @@ var PixodeskAnimator = (() => {
     height: px.number().optional()
   }));
   var PxClipPathEffectSchema = implementsInterface()(px.object({
-    d: PxAnimatableStringSchema.optional()
+    pathData: PxAnimatableStringSchema.optional()
   }));
   var PxStrokeTrimEffectSchema = implementsInterface()(px.object({
     offset: PxAnimatableNumberSchema.optional(),
@@ -1375,97 +1070,523 @@ var PixodeskAnimator = (() => {
     px.object({ value: px.array(PxGradientStopSchema) }),
     PxPropertyAnimationSchema
   ]);
-  var PxFillGradientEffectSchema = implementsInterface()(px.object({
-    // Contextual kind — the `type` convention, see `PxNodeBase.type`.
-    type: px.enum([PxGradientType.linear, PxGradientType.radial]),
-    start: PxAnimatableVec2Schema.optional(),
-    end: PxAnimatableVec2Schema.optional(),
-    center: PxAnimatableVec2Schema.optional(),
-    radius: PxAnimatableNumberSchema.optional(),
-    focal: PxAnimatableVec2Schema.optional(),
-    stops: PxAnimatableGradientStopsSchema.optional(),
-    gradientUnits: px.enum([PxGradientUnits.userSpaceOnUse, PxGradientUnits.objectBoundingBox]).optional(),
-    spreadMethod: px.enum([PxGradientSpreadMethod.pad, PxGradientSpreadMethod.reflect, PxGradientSpreadMethod.repeat]).optional(),
-    gradientTransform: px.string().optional()
-  }));
-  var PxStrokeGradientEffectSchema = PxFillGradientEffectSchema;
-  var PxTextPathEffectSchema = implementsInterface()(px.object({
-    pathData: px.string(),
-    pathOverflow: px.enum([PxPathOverflow.clip, PxPathOverflow.extend]).optional(),
-    lengthAdjust: px.enum([PxLengthAdjust.spacing, PxLengthAdjust.spacingAndGlyphs]).optional(),
-    method: px.enum([PxTextPathMethod.align, PxTextPathMethod.stretch]).optional(),
-    spacing: px.enum([PxTextPathSpacing.auto, PxTextPathSpacing.exact]).optional(),
-    startOffset: PxAnimatableNumberSchema.optional(),
-    textLength: PxAnimatableNumberSchema.optional()
-  }));
-  var PxTextEffectSchema = implementsInterface()(px.object({
-    useGlyphs: px.boolean().optional()
-  }));
-  var PxEffectsSchema = implementsInterface()(px.object({
-    transformBy: PxTransformByEffectSchema.optional(),
-    repeater: PxRepeaterEffectSchema.optional(),
-    maskedBy: PxMaskedByEffectSchema.optional(),
-    clipPath: PxClipPathEffectSchema.optional(),
-    strokeTrim: PxStrokeTrimEffectSchema.optional(),
-    clone: PxCloneEffectSchema.optional(),
-    fillGradient: PxFillGradientEffectSchema.optional(),
-    strokeGradient: PxStrokeGradientEffectSchema.optional(),
-    textPath: PxTextPathEffectSchema.optional(),
-    text: PxTextEffectSchema.optional()
-  }));
-  var PxNodeBase = px.openObject({
-    // CONVENTION (SCHEMA-DESIGN R1 / issues N4): `type` is the ONE word for "what
-    // kind of thing is this", discriminated by its CARRIER — here the node TAG
-    // (`rect`, `text`), and inside a sub-object that object's kind (`fillGradient.type`,
-    // `fillGradient.type`, editor `preset.type`). Each sits in its own object, so
-    // the carrier disambiguates completely; synonyms (`cloneKind`, `presetShape`)
-    // would add words that all mean "type" and still need the carrier to read.
-    // Guarding a `type` SLOT against a wrong VALUE is the job of strict enums
-    // (issues V3), never of distinct key names.
-    type: px.string(),
-    // The escape hatch for elements that carry a REAL `type` attribute — `<feTurbulence
-    // type="fractalNoise">`, `<feFuncR type="table">`, `<feColorMatrix type="saturate">`.
-    // `type` is taken by the tag name, so the attribute travels here and the renderer puts
-    // it back (`PxAnimatorDOM.renderNode`, `PxRnRender`). Declared here — not merely
-    // documented — because a wire key that is not in a schema is invisible to the
-    // minifier's reserve list and gets renamed (MINIFICATION-BOUNDARY-PLAN.md §1.1).
-    domType: px.string().optional(),
-    id: px.string().optional(),
-    meta: px.any().optional(),
-    // Player-effects bucket emitted by the Editor's lightweight design format.
-    // Consumed and removed by `applyPlayerEffects` before any other normalisation
-    // (see `createAnimatorImpl`), so downstream code never sees it.
-    effects: PxEffectsSchema.optional(),
-    // `PxElementAnimation` (not just `PxAnimationDefinition`) — accepts
-    // string ref / array of refs / inline definition / mixed array; mirrors
-    // `animator.animateById` map values and what `processNode` resolves at runtime.
-    animate: PxElementAnimationSchema.optional(),
-    style: px.union([px.string(), px.record(px.union([px.string(), px.number()]))]).optional()
-  }, PxAttrValueSchema);
-  var PxNodeSchema = px.openObject(__spreadProps(__spreadValues({}, PxNodeBase._shape), {
-    children: px.lazy(() => px.array(PxNodeSchema), []).optional()
-  }), PxAttrValueSchema);
-  var PxSvgNodeExtra = px.object({
-    // `"100%"` and other SVG length strings are legal here — a number-only slot rejected
-    // real documents (e.g. apple-store-look-14-main.json) at the root <svg>.
-    width: px.union([px.number(), px.string()]).optional(),
-    height: px.union([px.number(), px.string()]).optional(),
-    viewBox: px.string().optional(),
-    animator: PxAnimatorConfigSchema.optional()
-  });
-  var PxAnimatedSvgDocumentSchema = px.openObject(__spreadProps(__spreadValues(__spreadValues({}, PxNodeBase._shape), PxSvgNodeExtra._shape), {
-    type: px.literal("svg"),
-    // override string → literal to require 'svg'
-    children: px.array(PxNodeSchema).optional()
-  }), PxAttrValueSchema);
-  var PxBezierPathSchema = implementsInterface()(px.object({
-    v: px.array(px.array(px.number())),
-    i: px.array(px.array(px.number())).optional(),
-    o: px.array(px.array(px.number())).optional(),
-    c: px.boolean().optional()
-  }));
+  var PxFillGradientEffectSchema = implementsInterface()(px.object({
+    // Contextual kind — the `type` convention, see `PxNodeBase.type`.
+    type: px.enum([PxGradientType.linear, PxGradientType.radial]),
+    start: PxAnimatableVec2Schema.optional(),
+    end: PxAnimatableVec2Schema.optional(),
+    center: PxAnimatableVec2Schema.optional(),
+    radius: PxAnimatableNumberSchema.optional(),
+    focal: PxAnimatableVec2Schema.optional(),
+    stops: PxAnimatableGradientStopsSchema.optional(),
+    gradientUnits: px.enum([PxUnits.userSpaceOnUse, PxUnits.objectBoundingBox]).optional(),
+    spreadMethod: px.enum([PxGradientSpreadMethod.pad, PxGradientSpreadMethod.reflect, PxGradientSpreadMethod.repeat]).optional(),
+    gradientTransform: px.string().optional()
+  }));
+  var PxStrokeGradientEffectSchema = PxFillGradientEffectSchema;
+  var PxTextPathEffectSchema = implementsInterface()(px.object({
+    pathData: px.string(),
+    pathOverflow: px.enum([PxPathOverflow.clip, PxPathOverflow.extend]).optional(),
+    lengthAdjust: px.enum([PxLengthAdjust.spacing, PxLengthAdjust.spacingAndGlyphs]).optional(),
+    method: px.enum([PxTextPathMethod.align, PxTextPathMethod.stretch]).optional(),
+    spacing: px.enum([PxTextPathSpacing.auto, PxTextPathSpacing.exact]).optional(),
+    startOffset: PxAnimatableNumberSchema.optional(),
+    textLength: PxAnimatableNumberSchema.optional()
+  }));
+  var PxTextEffectSchema = implementsInterface()(px.object({
+    useGlyphs: px.boolean().optional()
+  }));
+  var PxEffectsSchema = implementsInterface()(px.object({
+    transformBy: PxTransformByEffectSchema.optional(),
+    repeater: PxRepeaterEffectSchema.optional(),
+    maskedBy: PxMaskedByEffectSchema.optional(),
+    clipPath: PxClipPathEffectSchema.optional(),
+    strokeTrim: PxStrokeTrimEffectSchema.optional(),
+    clone: PxCloneEffectSchema.optional(),
+    fillGradient: PxFillGradientEffectSchema.optional(),
+    strokeGradient: PxStrokeGradientEffectSchema.optional(),
+    textPath: PxTextPathEffectSchema.optional(),
+    text: PxTextEffectSchema.optional()
+  }));
+  var PxNodeBase = px.openObject({
+    // CONVENTION (SCHEMA-DESIGN R1 / issues N4): `type` is the ONE word for "what
+    // kind of thing is this", discriminated by its CARRIER — here the node TAG
+    // (`rect`, `text`), and inside a sub-object that object's kind (`fillGradient.type`,
+    // `fillGradient.type`, editor `preset.type`). Each sits in its own object, so
+    // the carrier disambiguates completely; synonyms (`cloneKind`, `presetShape`)
+    // would add words that all mean "type" and still need the carrier to read.
+    // Guarding a `type` SLOT against a wrong VALUE is the job of strict enums
+    // (issues V3), never of distinct key names.
+    type: px.string(),
+    // The escape hatch for elements that carry a REAL `type` attribute — `<feTurbulence
+    // type="fractalNoise">`, `<feFuncR type="table">`, `<feColorMatrix type="saturate">`.
+    // `type` is taken by the tag name, so the attribute travels here and the renderer puts
+    // it back (`PxAnimatorDOM.renderNode`, `PxRnRender`). Declared here — not merely
+    // documented — because a wire key that is not in a schema is invisible to the
+    // minifier's reserve list and gets renamed (MINIFICATION-BOUNDARY-PLAN.md §1.1).
+    domType: px.string().optional(),
+    // Text content of a `<text>` / `<tspan>`. Declared, so a non-string value is a schema error
+    // and the minifier reserves the key; `text` is NOT an alias for it and is not read anywhere.
+    textContent: px.string().optional(),
+    id: px.string().optional(),
+    meta: px.any().optional(),
+    // Player-effects bucket emitted by the Editor's lightweight design format.
+    // Consumed and removed by `applyPlayerEffects` before any other normalization
+    // (see `createAnimatorImpl`), so downstream code never sees it.
+    effects: PxEffectsSchema.optional(),
+    // `PxElementAnimation` (not just `PxAnimationDefinition`) — accepts
+    // string ref / array of refs / inline definition / mixed array; mirrors
+    // `node.animate` values and what `processNode` resolves at runtime.
+    animate: PxElementAnimationSchema.optional(),
+    style: px.record(px.union([px.string(), px.number()])).optional()
+  }, PxAttrValueSchema);
+  var PxNodeSchema = px.openObject(__spreadProps(__spreadValues({}, PxNodeBase._shape), {
+    children: px.lazy(() => px.array(PxNodeSchema), []).optional()
+  }), PxAttrValueSchema);
+  var PxSvgNodeExtra = px.object({
+    // `"100%"` and other SVG length strings are legal here — a number-only slot rejected
+    // real documents (e.g. apple-store-look-14-main.json) at the root <svg>.
+    width: px.union([px.number(), px.string()]).optional(),
+    height: px.union([px.number(), px.string()]).optional(),
+    viewBox: px.string().optional(),
+    animator: PxAnimatorConfigSchema.optional()
+  });
+  var PxAnimatedSvgDocumentSchema = px.openObject(__spreadProps(__spreadValues(__spreadValues({}, PxNodeBase._shape), PxSvgNodeExtra._shape), {
+    type: px.literal("svg"),
+    // override string → literal to require 'svg'
+    children: px.array(PxNodeSchema).optional()
+  }), PxAttrValueSchema);
+  var PxBezierPathSchema = implementsInterface()(px.object({
+    v: px.array(px.array(px.number())),
+    i: px.array(px.array(px.number())).optional(),
+    o: px.array(px.array(px.number())).optional(),
+    c: px.boolean().optional()
+  }));
+
+  // ../svg-animator-core/src/util/PxAnimatorUtil.ts
+  function bezierToSvgPath(path, forceCurves = false) {
+    var _a, _b, _c, _d;
+    const v = path.v;
+    const i = path.i;
+    const o = path.o;
+    const c = path.c;
+    if (!v.length) return "";
+    const d = [];
+    const len = v.length;
+    d.push("M" + v[0][0] + "," + v[0][1]);
+    for (let idx = 1; idx < len; idx++) {
+      const prevV = v[idx - 1];
+      const prevO = (_a = o == null ? void 0 : o[idx - 1]) != null ? _a : prevV;
+      const currI = (_b = i == null ? void 0 : i[idx]) != null ? _b : v[idx];
+      const currV = v[idx];
+      const isLine = !forceCurves && (prevO[0] === prevV[0] && prevO[1] === prevV[1]) && (currI[0] === currV[0] && currI[1] === currV[1]);
+      if (isLine) {
+        d.push("L" + currV[0] + "," + currV[1]);
+      } else {
+        d.push("C" + prevO[0] + "," + prevO[1] + "," + currI[0] + "," + currI[1] + "," + currV[0] + "," + currV[1]);
+      }
+    }
+    if (c && len > 0) {
+      const lastV = v[len - 1];
+      const lastO = (_c = o == null ? void 0 : o[len - 1]) != null ? _c : lastV;
+      const firstI = (_d = i == null ? void 0 : i[0]) != null ? _d : v[0];
+      const firstV = v[0];
+      const isLine = !forceCurves && (lastO[0] === lastV[0] && lastO[1] === lastV[1]) && (firstI[0] === firstV[0] && firstI[1] === firstV[1]);
+      if (!isLine) {
+        d.push("C" + lastO[0] + "," + lastO[1] + "," + firstI[0] + "," + firstI[1] + "," + firstV[0] + "," + firstV[1]);
+      }
+      d.push("z");
+    }
+    return d.join("");
+  }
+  function interpolateNum(a, b, t) {
+    return a + (b - a) * t;
+  }
+  function interpolateVec(a, b, t) {
+    const res = [];
+    const count = Math.max(a.length, b.length);
+    for (let i = 0; i < count; i++) {
+      res[i] = interpolateNum(a[i] || 0, b[i] || 0, t);
+    }
+    return res;
+  }
+  function interpolateColor(a, b, t) {
+    return [
+      interpolateNum(a[0] || 0, b[0] || 0, t),
+      interpolateNum(a[1] || 0, b[1] || 0, t),
+      interpolateNum(a[2] || 0, b[2] || 0, t),
+      interpolateNum(a[3] === void 0 ? 1 : a[3], b[3] === void 0 ? 1 : b[3], t)
+    ];
+  }
+  function interpolateBeziers(paths1, paths2, progress) {
+    const count = Math.max(paths1.length, paths2.length);
+    const res = [];
+    for (let i = 0; i < count; i++) {
+      res.push(interpolateBezier(paths1[i], paths2[i], progress));
+    }
+    return res;
+  }
+  function interpolateBezier(path1, path2, progress) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+    if (!path1 || !path2) return path1 || path2 || { v: [] };
+    const t = Math.min(Math.max(progress, 0), 1);
+    const len = Math.min(path1.v.length, path2.v.length);
+    const v = [];
+    const i = [];
+    const o = [];
+    for (let idx = 0; idx < len; idx++) {
+      const v1 = path1.v[idx];
+      const v2 = path2.v[idx];
+      v.push(interpolateVec(v1, v2, t));
+      const i1 = (_b = (_a = path1.i) == null ? void 0 : _a[idx]) != null ? _b : v1;
+      const i2 = (_d = (_c = path2.i) == null ? void 0 : _c[idx]) != null ? _d : v2;
+      i.push(interpolateVec(i1, i2, t));
+      const o1 = (_f = (_e = path1.o) == null ? void 0 : _e[idx]) != null ? _f : v1;
+      const o2 = (_h = (_g = path2.o) == null ? void 0 : _g[idx]) != null ? _h : v2;
+      o.push(interpolateVec(o1, o2, t));
+    }
+    return { v, i: i.length ? i : void 0, o: o.length ? o : void 0, c: (_i = path1.c) != null ? _i : path2.c };
+  }
+  function solveCubicBezierX(p1x, p2x, x) {
+    if (x <= 0) return 0;
+    if (x >= 1) return 1;
+    const cx = 3 * p1x;
+    const bx = 3 * (p2x - p1x) - cx;
+    const ax = 1 - cx - bx;
+    function sampleX(t) {
+      return ((ax * t + bx) * t + cx) * t;
+    }
+    function sampleDX(t) {
+      return (3 * ax * t + 2 * bx) * t + cx;
+    }
+    let t2 = x;
+    let t0 = 0;
+    let t1 = 1;
+    for (let i = 0; i < 8; i++) {
+      const x2 = sampleX(t2) - x;
+      if (Math.abs(x2) < 1e-6) return t2;
+      const d2 = sampleDX(t2);
+      if (Math.abs(d2) < 1e-6) break;
+      t2 -= x2 / d2;
+    }
+    t2 = x;
+    while (t0 < t1) {
+      const x2 = sampleX(t2);
+      if (Math.abs(x2 - x) < 1e-6) return t2;
+      if (x > x2) t0 = t2;
+      else t1 = t2;
+      t2 = (t1 + t0) / 2;
+    }
+    return t2;
+  }
+  function cubicBezier(easing) {
+    const [p1x, p1y, p2x, p2y] = easing;
+    const cy = 3 * p1y;
+    const by = 3 * (p2y - p1y) - cy;
+    const ay = 1 - cy - by;
+    function sampleCurveY(t) {
+      return ((ay * t + by) * t + cy) * t;
+    }
+    return function(x) {
+      return sampleCurveY(solveCubicBezierX(p1x, p2x, x));
+    };
+  }
+  function lerp2(a, b, t) {
+    return [a[0] + (b[0] - a[0]) * t, a[1] + (b[1] - a[1]) * t];
+  }
+  function subdivideCubicBezier(p0, p1, p2, p3, t) {
+    const q0 = lerp2(p0, p1, t);
+    const q1 = lerp2(p1, p2, t);
+    const q2 = lerp2(p2, p3, t);
+    const r0 = lerp2(q0, q1, t);
+    const r1 = lerp2(q1, q2, t);
+    const s = lerp2(r0, r1, t);
+    return {
+      left: [p0, q0, r0, s],
+      right: [s, r1, q2, p3]
+    };
+  }
+  function splitEasing(easing, xFraction) {
+    if (!easing) return { left: void 0, right: void 0 };
+    if (xFraction <= 0) return { left: void 0, right: easing };
+    if (xFraction >= 1) return { left: easing, right: void 0 };
+    const [x1, y1, x2, y2] = easing;
+    const t = solveCubicBezierX(x1, x2, xFraction);
+    const p0 = [0, 0];
+    const p1 = [x1, y1];
+    const p2 = [x2, y2];
+    const p3 = [1, 1];
+    const { left, right } = subdivideCubicBezier(p0, p1, p2, p3, t);
+    const sx = left[3][0];
+    const sy = left[3][1];
+    let leftEasing;
+    if (sx > 1e-9 && Math.abs(sy) > 1e-9) {
+      leftEasing = [
+        left[1][0] / sx,
+        left[1][1] / sy,
+        left[2][0] / sx,
+        left[2][1] / sy
+      ];
+    }
+    let rightEasing;
+    const rx = 1 - sx;
+    const ry = 1 - sy;
+    if (rx > 1e-9 && Math.abs(ry) > 1e-9) {
+      rightEasing = [
+        (right[1][0] - sx) / rx,
+        (right[1][1] - sy) / ry,
+        (right[2][0] - sx) / rx,
+        (right[2][1] - sy) / ry
+      ];
+    }
+    return { left: leftEasing, right: rightEasing };
+  }
+  function reverseEasing(easing) {
+    if (!easing) return void 0;
+    return [1 - easing[2], 1 - easing[3], 1 - easing[0], 1 - easing[1]];
+  }
+  function toRGBA(color) {
+    const r = Math.round(color[0] * 255);
+    const g = Math.round(color[1] * 255);
+    const b = Math.round(color[2] * 255);
+    return color.length === 4 ? "rgba(" + r + "," + g + "," + b + "," + color[3] + ")" : "rgb(" + r + "," + g + "," + b + ")";
+  }
+  function parseRgba(s) {
+    var _a;
+    const inner = (_a = s.match(/rgba?\((.*)\)/)) == null ? void 0 : _a[1];
+    if (!inner) throw new Error("Invalid rgb/rgba format");
+    const parts = inner.split(",").map((v) => +v.trim());
+    return [parts[0] / 255, parts[1] / 255, parts[2] / 255, ...parts[3] !== void 0 ? [parts[3]] : []];
+  }
+  function parseHex(s) {
+    const hex = s.slice(1);
+    const isShort = hex.length <= 4;
+    const r = isShort ? hex[0] + hex[0] : hex.slice(0, 2);
+    const g = isShort ? hex[1] + hex[1] : hex.slice(2, 4);
+    const b = isShort ? hex[2] + hex[2] : hex.slice(4, 6);
+    const a = hex.length === 4 ? hex[3] + hex[3] : hex.length === 8 ? hex.slice(6, 8) : null;
+    const result = [
+      parseInt(r, 16) / 255,
+      parseInt(g, 16) / 255,
+      parseInt(b, 16) / 255
+    ];
+    if (a !== null) {
+      result.push(parseInt(a, 16) / 255);
+    }
+    return result;
+  }
+  function parseColor(s) {
+    if (!s) return void 0;
+    if (Array.isArray(s)) return s;
+    if (typeof s !== "string") return void 0;
+    if (s.startsWith("#")) {
+      return parseHex(s);
+    } else if (s.startsWith("rgb")) {
+      return parseRgba(s);
+    } else {
+      console.warn("Unsupported color format: " + s);
+    }
+    return void 0;
+  }
+  var COLOR_ATTR_NAMES = /* @__PURE__ */ new Set(["color", "fill", "flood-color", "lighting-color", "stop-color", "stroke"]);
+  var TRANSFORM_FN_NAMES = /* @__PURE__ */ new Set(["translate", "rotate", "scale", "skew"]);
+  var PCT_BASED_ATTR_NAMES = /* @__PURE__ */ new Set(["offset-distance", "offsetDistance"]);
+  function composeTransformParts(parts, opts) {
+    var _a;
+    if (!parts) return "";
+    const withUnits = (_a = opts == null ? void 0 : opts.withUnits) != null ? _a : true;
+    const segs = [];
+    const t = parts.translate;
+    const o = parts.origin;
+    const r = parts.rotate;
+    const k = parts.skew;
+    const s = parts.scale;
+    const tu = withUnits ? "px" : "";
+    const ru = withUnits ? "deg" : "";
+    if (t) segs.push("translate(" + t[0] + tu + "," + t[1] + tu + ")");
+    if (o) segs.push("translate(" + o[0] + tu + "," + o[1] + tu + ")");
+    if (r !== void 0 && r !== null) segs.push("rotate(" + r + ru + ")");
+    if (k !== void 0 && k !== null) segs.push("skewX(" + k + ru + ")");
+    if (s) segs.push("scale(" + s[0] + "," + s[1] + ")");
+    if (o) segs.push("translate(" + -o[0] + tu + "," + -o[1] + tu + ")");
+    return segs.join("");
+  }
+  function parseTransformParts(str) {
+    var _a, _b;
+    if (!str || typeof str !== "string") return void 0;
+    const out = {};
+    const re = /([a-zA-Z]+)\s*\(([^)]*)\)/g;
+    const order = ["translate", "rotate", "skewX", "scale"];
+    let lastIdx = -1;
+    let m;
+    while ((m = re.exec(str)) !== null) {
+      const fn = m[1];
+      const idx = order.indexOf(fn);
+      if (idx < 0 || idx <= lastIdx) return void 0;
+      lastIdx = idx;
+      const nums = m[2].split(/[\s,]+/).filter(Boolean).map(Number);
+      if (nums.some((n) => Number.isNaN(n))) return void 0;
+      if (fn === "translate") {
+        if (nums.length < 1 || nums.length > 2) return void 0;
+        out.translate = [nums[0], (_a = nums[1]) != null ? _a : 0];
+      } else if (fn === "rotate") {
+        if (nums.length !== 1) return void 0;
+        out.rotate = nums[0];
+      } else if (fn === "skewX") {
+        if (nums.length !== 1) return void 0;
+        out.skew = nums[0];
+      } else {
+        if (nums.length < 1 || nums.length > 2) return void 0;
+        out.scale = [nums[0], (_b = nums[1]) != null ? _b : nums[0]];
+      }
+    }
+    if (str.replace(/([a-zA-Z]+)\s*\(([^)]*)\)/g, "").replace(/[\s,]/g, "").length) return void 0;
+    return Object.keys(out).length ? out : void 0;
+  }
+  function kebabToCamelCaseWord(kebab) {
+    return kebab.includes("-") ? kebab.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()) : kebab;
+  }
+  function isCamelCaseWord(word) {
+    return !word.includes("-") && /[a-z][A-Z]/.test(word);
+  }
+  var SVG_CAMEL_CASE_ATTRS = /* @__PURE__ */ new Set([
+    // Transform/positioning
+    "viewBox",
+    "preserveAspectRatio",
+    // Gradient
+    "gradientUnits",
+    "gradientTransform",
+    "spreadMethod",
+    // Pattern
+    "patternUnits",
+    "patternContentUnits",
+    "patternTransform",
+    // Clipping/masking
+    "clipPathUnits",
+    "maskUnits",
+    "maskContentUnits",
+    // Marker  (SVG spec keeps these camelCase, like viewBox)
+    "markerUnits",
+    "markerWidth",
+    "markerHeight",
+    "refX",
+    "refY",
+    // Text
+    "textLength",
+    "lengthAdjust",
+    "startOffset",
+    // Filter
+    "filterUnits",
+    "primitiveUnits",
+    "tableValues",
+    // feFuncR/G/B/A transfer table (type="table")
+    "stdDeviation",
+    "baseFrequency",
+    "numOctaves",
+    "surfaceScale",
+    "diffuseConstant",
+    "specularConstant",
+    "specularExponent",
+    "kernelMatrix",
+    "kernelUnitLength",
+    "edgeMode",
+    "preserveAlpha",
+    "targetX",
+    "targetY"
+    // // Animation
+    // 'attributeName',
+    // 'attributeType',
+    // 'calcMode',
+    // 'keyTimes',
+    // 'keySplines',
+    // 'repeatCount',
+    // 'repeatDur'    
+  ]);
+  function camelCaseToKebabWordIfNeeded(camel) {
+    return SVG_CAMEL_CASE_ATTRS.has(camel) ? camel : camel.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+  }
+  function clamp(value, min, max) {
+    return Math.max(min, Math.min(value, max));
+  }
+  function bezier2D_pointAt(P0, P1, P2, P3, t) {
+    if (t <= 0) return [P0[0], P0[1]];
+    if (t >= 1) return [P3[0], P3[1]];
+    const u = 1 - t;
+    const u2 = u * u;
+    const u3 = u2 * u;
+    const t2 = t * t;
+    const t3 = t2 * t;
+    const w0 = u3;
+    const w1 = 3 * t * u2;
+    const w2 = 3 * t2 * u;
+    const w3 = t3;
+    return [
+      w0 * P0[0] + w1 * P1[0] + w2 * P2[0] + w3 * P3[0],
+      w0 * P0[1] + w1 * P1[1] + w2 * P2[1] + w3 * P3[1]
+    ];
+  }
+  var BEZIER_T_NUDGE = 1e-4;
+  function bezier2D_derivativeAt(P0, P1, P2, P3, t) {
+    const result = _bezier2D_derivativeAtRaw(P0, P1, P2, P3, t);
+    if (result[0] === 0 && result[1] === 0) {
+      const nudgedT = t < 0.5 ? t + BEZIER_T_NUDGE : t - BEZIER_T_NUDGE;
+      return _bezier2D_derivativeAtRaw(P0, P1, P2, P3, nudgedT);
+    }
+    return result;
+  }
+  function _bezier2D_derivativeAtRaw(P0, P1, P2, P3, t) {
+    const u = 1 - t;
+    const a = 3 * u * u;
+    const b = 6 * t * u;
+    const c = 3 * t * t;
+    return [
+      a * (P1[0] - P0[0]) + b * (P2[0] - P1[0]) + c * (P3[0] - P2[0]),
+      a * (P1[1] - P0[1]) + b * (P2[1] - P1[1]) + c * (P3[1] - P2[1])
+    ];
+  }
+  function bezier2D_arcLengthLUT(P0, P1, P2, P3, steps = 100) {
+    const n = steps + 1;
+    const ts = new Float64Array(n);
+    const ds = new Float64Array(n);
+    let prev = bezier2D_pointAt(P0, P1, P2, P3, 0);
+    ts[0] = 0;
+    ds[0] = 0;
+    let cum = 0;
+    for (let i = 1; i < n; i++) {
+      const t = i / steps;
+      const cur = bezier2D_pointAt(P0, P1, P2, P3, t);
+      const dx = cur[0] - prev[0];
+      const dy = cur[1] - prev[1];
+      cum += Math.sqrt(dx * dx + dy * dy);
+      ts[i] = t;
+      ds[i] = cum;
+      prev = cur;
+    }
+    return { ts, ds };
+  }
+  function bezier2D_arcAtT(lut, t) {
+    const { ts, ds } = lut;
+    const last = ts.length - 1;
+    if (t <= ts[0]) return ds[0];
+    if (t >= ts[last]) return ds[last];
+    let lo = 1, hi = last;
+    while (lo < hi) {
+      const mid = lo + hi >>> 1;
+      if (ts[mid] < t) lo = mid + 1;
+      else hi = mid;
+    }
+    const tPrev = ts[hi - 1];
+    const span = ts[hi] - tPrev;
+    const frac = span > 0 ? (t - tPrev) / span : 0;
+    return ds[hi - 1] + frac * (ds[hi] - ds[hi - 1]);
+  }
+  function invertEasing(easing) {
+    if (!easing) return (y) => y;
+    const flipped = [easing[1], easing[0], easing[3], easing[2]];
+    return cubicBezier(flipped);
+  }
 
-  // ../svg-animator-core/src/materialise/PxMotionPath.ts
+  // ../svg-animator-core/src/materialize/PxMotionPath.ts
   function getKfTranslate(kf) {
     const v = kfValue(kf);
     if (!v) return void 0;
@@ -1519,7 +1640,7 @@ var PixodeskAnimator = (() => {
   var DEFAULT_FLATNESS_TOL = 0.5;
   var DEFAULT_ROTATION_TOL = 5;
   var DEFAULT_MAX_SAMPLES = 32;
-  function materialiseMotionPathInPropAnim(anim, opts) {
+  function materializeMotionPathInPropAnim(anim, opts) {
     var _a, _b, _c;
     if (!propAnimIsMotionPath(anim)) return anim;
     const kfs = anim.keyframes;
@@ -1551,7 +1672,7 @@ var PixodeskAnimator = (() => {
       if (autoOrient && i > 0) {
         insertSharpCornerStepKfIfNeeded(out, prevKf, nextKf, prevPos, nextPos, rotationTol);
       }
-      materialiseSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples);
+      materializeSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples);
     }
     const lastInE = getKfEasing(kfs[kfs.length - 1]);
     if (lastInE) out[out.length - 1].e = lastInE;
@@ -1665,7 +1786,7 @@ var PixodeskAnimator = (() => {
     out.push(makeOutKf(stepTime, dupValue));
   }
   var CORNER_STEP_AFTER_BOUNDARY_MS = 0.05;
-  function materialiseSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples) {
+  function materializeSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples) {
     const seg = getSegmentCache(prevKf, nextKf, prevPos, nextPos);
     const prevTime = getKfTime(prevKf);
     const nextTime = getKfTime(nextKf);
@@ -1881,8 +2002,8 @@ var PixodeskAnimator = (() => {
     return typeof value === "string" && extractPathData(value) !== void 0;
   }
   function normalizePathValue(value) {
-    if (value && typeof value === "object" && typeof value.path === "string") {
-      const d = extractPathData(value.path);
+    if (value && typeof value === "object" && typeof value.pathData === "string") {
+      const d = extractPathData(value.pathData);
       return d ? { paths: parseSvgPathToBezier(d) } : value;
     }
     if (value && typeof value === "object" && "paths" in value) {
@@ -1966,7 +2087,7 @@ var PixodeskAnimator = (() => {
       const bPaths = (_b = b == null ? void 0 : b.paths) != null ? _b : Array.isArray(b) ? b : [];
       return { paths: interpolateBeziers(aPaths, bPaths, t) };
     }
-    if (COLOUR_ATTR_NAMES.has(propName)) {
+    if (COLOR_ATTR_NAMES.has(propName)) {
       return interpolateColor(a || [0, 0, 0, 1], b || [0, 0, 0, 1], t);
     }
     if (propName === "transform" && typeof a === "object" && a !== null && !Array.isArray(a) && typeof b === "object" && b !== null && !Array.isArray(b)) {
@@ -2188,7 +2309,7 @@ var PixodeskAnimator = (() => {
         value = normalizePathValue(value);
       }
       const propNameKebab = isCamelCaseWord(propName) ? camelCaseToKebabWordIfNeeded(propName) : propName;
-      if (COLOUR_ATTR_NAMES.has(propNameKebab)) {
+      if (COLOR_ATTR_NAMES.has(propNameKebab)) {
         value = (_a = parseColor(value)) != null ? _a : value;
       }
       const normKf = {
@@ -2267,19 +2388,17 @@ var PixodeskAnimator = (() => {
         const out = { keyframes: normalizedKfs };
         if (propAnim.autoOrient !== void 0) out.autoOrient = propAnim.autoOrient;
         if (propAnim.loop !== void 0) out.loop = propAnim.loop;
-        normalized[propName] = engine === PxTimelineEngine.native && propName === "transform" ? materialiseMotionPathInPropAnim(out) : out;
+        normalized[propName] = engine === PxTimelineEngine.native && propName === "transform" ? materializeMotionPathInPropAnim(out) : out;
       }
     }
     return normalized;
   }
-  function getNormalisedBindings(doc, engine = PxTimelineEngine.native) {
+  function getNormalizedBindings(doc, engine = PxTimelineEngine.native) {
     const animatorConfig = getAnimatorConfig(doc) || {};
     const defs = getDefs(doc);
     const duration = animatorConfig.duration || 1e3;
     const bindings = [];
-    const processAnimation = (id, animate, staticTransform) => {
-      if (!animate) return null;
-      const animDefs = resolveElementAnimation(animate, defs);
+    const processAnimation = (id, animDefs, staticTransform) => {
       if (animDefs.length === 0) return null;
       const merged = mergeStaticTransformIntoAnimDef(mergeAnimationDefinitions(animDefs), staticTransform);
       const normalizedAnim = normalizeAnimationDefinition(merged, duration, defs, engine);
@@ -2292,7 +2411,9 @@ var PixodeskAnimator = (() => {
     const docBindings = getBindings(doc);
     if (docBindings) {
       for (const binding of docBindings) {
-        const normalized = processAnimation(binding.id, binding.animate);
+        const id = binding.target.startsWith("#") ? binding.target.slice(1) : binding.target;
+        const animDefs = binding.animateWith.map((name) => resolveAnimation(name, defs)).filter((d) => !!d);
+        const normalized = processAnimation(id, animDefs);
         if (normalized) bindings.push(normalized);
       }
     }
@@ -2301,7 +2422,7 @@ var PixodeskAnimator = (() => {
       if (inlineAnim && Object.keys(inlineAnim).length > 0) {
         const nodeId = node.id || generateElementId();
         node.id = nodeId;
-        const normalized = processAnimation(nodeId, inlineAnim, node.transform);
+        const normalized = processAnimation(nodeId, resolveElementAnimation(inlineAnim, defs), node.transform);
         if (normalized) bindings.push(normalized);
       }
       if (node.children) {
@@ -2318,13 +2439,143 @@ var PixodeskAnimator = (() => {
     return bindings;
   }
 
+  // ../svg-animator-core/src/playback/PxPlaybackTime.ts
+  var PX_RATE_REJECTED = "setPlaybackRate: rate must be finite and non-zero";
+  function isValidPlaybackRate(rate) {
+    return Number.isFinite(rate) && rate !== 0;
+  }
+  function seekCeilingMs(durationMs, iterations) {
+    if (!(durationMs > 0)) return 0;
+    if (iterations === Infinity) return Infinity;
+    return durationMs * (iterations > 0 ? iterations : 1);
+  }
+  function progressSpanMs(durationMs, iterations) {
+    if (!(durationMs > 0)) return 0;
+    if (iterations === Infinity) return durationMs;
+    return durationMs * (iterations > 0 ? iterations : 1);
+  }
+  function clampSeekMs(timeMs, ceilingMs) {
+    if (Number.isNaN(timeMs) || timeMs < 0) return 0;
+    if (Number.isFinite(ceilingMs)) return timeMs > ceilingMs ? ceilingMs : timeMs;
+    return Number.isFinite(timeMs) ? timeMs : 0;
+  }
+  function timeToProgress(timeMs, durationMs, iterations) {
+    const span = progressSpanMs(durationMs, iterations);
+    if (!(span > 0) || !Number.isFinite(timeMs)) return 0;
+    if (timeMs <= 0) return 0;
+    if (iterations === Infinity) return timeMs % span / span;
+    return timeMs >= span ? 1 : timeMs / span;
+  }
+  function progressToTimeMs(progress, durationMs, iterations) {
+    const span = progressSpanMs(durationMs, iterations);
+    if (!(span > 0) || !Number.isFinite(progress)) return 0;
+    if (progress <= 0) return 0;
+    return progress >= 1 ? span : progress * span;
+  }
+
+  // ../svg-animator-core/src/playback/PxDiagnostics.ts
+  var PxDiagnosticKind = {
+    /** The document is wrong — regenerate or repair the file. */
+    document: "document",
+    /** The page or app cannot provide what the document asks for — fix the mount. */
+    host: "host",
+    /** The platform cannot do it and the player degraded — usually nothing to fix. */
+    platform: "platform",
+    /** The call is wrong or self-contradictory — fix the options or props you passed. */
+    usage: "usage",
+    /** The player failed where it did not expect to — report it to us. */
+    internal: "internal"
+  };
+  function asError(error) {
+    return typeof error === "string" ? new Error(error) : error;
+  }
+  function createDiagnostics(config, prefix) {
+    const tag = prefix ? prefix + " " : "";
+    return {
+      warn: (kind, message, detail) => {
+        if (config == null ? void 0 : config.onWarn) {
+          config.onWarn({ kind, message, detail });
+          return;
+        }
+        if (config == null ? void 0 : config.muteWarn) return;
+        const line = tag + kind + ": " + message;
+        if (detail === void 0) console.warn(line);
+        else console.warn(line, detail);
+      },
+      error: (kind, error, detail) => {
+        const err = asError(error);
+        if (config == null ? void 0 : config.onError) {
+          config.onError({ kind, message: err.message, error: err, detail });
+          return;
+        }
+        if (config == null ? void 0 : config.muteError) return;
+        const line = tag + kind + ": " + err.message;
+        if (detail === void 0) console.error(line);
+        else console.error(line, detail);
+      }
+    };
+  }
+
+  // src/shared/PxAnimatorCallbacks.ts
+  function toEngineCallbacks(inline) {
+    const { onPlay, onPause, onCancel, onFinish, onRemove, onStop, onWarn, onError, muteWarn, muteError } = inline != null ? inline : {};
+    const withStop = (own) => own || onStop ? () => {
+      own == null ? void 0 : own();
+      onStop == null ? void 0 : onStop();
+    } : void 0;
+    return {
+      onPlay,
+      onPause: withStop(onPause),
+      onCancel: withStop(onCancel),
+      onFinish: withStop(onFinish),
+      onRemove: withStop(onRemove),
+      onWarn,
+      onError,
+      muteWarn,
+      muteError
+    };
+  }
+  function createInertAnimator() {
+    return {
+      isReady: () => false,
+      getRootElement: () => null,
+      isPlaying: () => false,
+      play: () => {
+      },
+      pause: () => {
+      },
+      cancel: () => {
+      },
+      finish: () => {
+      },
+      setPlaybackRate: () => {
+      },
+      getCurrentTime: () => null,
+      setCurrentTime: () => {
+      },
+      getCurrentProgress: () => null,
+      setCurrentProgress: () => {
+      },
+      destroy: () => {
+      }
+    };
+  }
+  function asThrownError(e) {
+    return e instanceof Error ? e : new Error(String(e));
+  }
+
   // src/triggers/PxAnimatorTriggers.ts
-  function setupAnimationTriggers(api, config) {
-    const { startOn, outAction = "continue", scrollIntoViewThreshold = 0 } = config;
+  function setupAnimationTriggers(api, config, diag) {
+    const report = diag != null ? diag : createDiagnostics(void 0, "[PxAnimator]");
+    const cleanups = [];
+    const dispose = () => {
+      for (const undo of cleanups.splice(0)) undo();
+    };
+    const { startOn, outAction, scrollIntoViewThreshold } = resolveTrigger(config);
     const root = api.getRootElement();
     if (!root) {
-      console.warn("setupAnimationTriggers: No root element found for animation.");
-      return api;
+      report.warn(PxDiagnosticKind.host, "setupAnimationTriggers: No root element found for animation.");
+      return dispose;
     }
     let reversed = false;
     const start = () => {
@@ -2359,6 +2610,7 @@ var PixodeskAnimator = (() => {
           startHandler();
         } else {
           window.addEventListener("load", startHandler, { once: true });
+          cleanups.push(() => window.removeEventListener("load", startHandler));
         }
         break;
       }
@@ -2373,6 +2625,10 @@ var PixodeskAnimator = (() => {
         };
         root.addEventListener("mouseenter", mouseOverHandler);
         root.addEventListener("mouseleave", mouseOutHandler);
+        cleanups.push(() => {
+          root.removeEventListener("mouseenter", mouseOverHandler);
+          root.removeEventListener("mouseleave", mouseOutHandler);
+        });
         break;
       }
       case "click": {
@@ -2384,6 +2640,7 @@ var PixodeskAnimator = (() => {
           }
         };
         root.addEventListener("click", clickHandler);
+        cleanups.push(() => root.removeEventListener("click", clickHandler));
         break;
       }
       case "scrollIntoView": {
@@ -2415,12 +2672,13 @@ var PixodeskAnimator = (() => {
           { threshold: thresholdSteps }
         );
         observer.observe(root);
+        cleanups.push(() => observer.disconnect());
         break;
       }
       case "programmatic":
         break;
     }
-    return api;
+    return dispose;
   }
 
   // src/engines/PxAnimatorFrameLoop.ts
@@ -2438,7 +2696,7 @@ var PixodeskAnimator = (() => {
     };
     let cssValue;
     let cssKey = propName;
-    if (COLOUR_ATTR_NAMES.has(propName) && Array.isArray(value)) {
+    if (COLOR_ATTR_NAMES.has(propName) && Array.isArray(value)) {
       cssValue = toRGBA(value);
     } else if (propName === "transform" && value !== null && typeof value === "object" && !Array.isArray(value)) {
       cssValue = composeTransformParts(value, { withUnits: true });
@@ -2525,18 +2783,19 @@ var PixodeskAnimator = (() => {
     return result;
   }
   function createWebApiAnimator(doc, callbacks, rootElement, forceEvenIfHasUnsupportedAttrs, scrollTimeline) {
-    var _a;
+    var _a, _b;
     const config = getAnimatorConfig(doc) || {};
+    const diag = createDiagnostics(callbacks, "[PxAnimator]");
     if (!rootElement) {
       if (doc.id) {
         const rootSelector = getSelector(doc.id);
         rootElement = document.querySelector(rootSelector);
-        if (!rootElement) console.warn("createFrameLoopAnimator: No root element found for selector: ", rootSelector);
+        if (!rootElement) diag.warn(PxDiagnosticKind.host, "createWebApiAnimator: No root element found for selector: " + rootSelector);
       } else {
-        console.warn("createFrameLoopAnimator: No root element provided");
+        diag.warn(PxDiagnosticKind.host, "createWebApiAnimator: No root element provided");
       }
     }
-    const bindings = getNormalisedBindings(doc, PxTimelineEngine.native);
+    const bindings = getNormalizedBindings(doc, PxTimelineEngine.native);
     const animations = [];
     const _iterations = config.iterations;
     let iterations;
@@ -2546,18 +2805,18 @@ var PixodeskAnimator = (() => {
     let finishNotified = false;
     let removeCalled = false;
     if (!(bindings == null ? void 0 : bindings.length)) {
-      console.warn("createWebApiAnimator: No animation bindings defined");
+      diag.warn(PxDiagnosticKind.document, "createWebApiAnimator: No animation bindings defined");
     }
     for (const binding of bindings || []) {
       const animDef = binding.animate;
       if (!animDef || typeof animDef !== "object" || Array.isArray(animDef)) {
-        console.warn("createWebApiAnimator: Empty or unresolved binding", binding);
+        diag.warn(PxDiagnosticKind.document, "createWebApiAnimator: Empty or unresolved binding", binding);
         continue;
       }
       const selector = getSelector(binding.id);
       const elements = (rootElement == null ? void 0 : rootElement.querySelectorAll(selector)) || document.querySelectorAll(selector);
       if (elements.length === 0) {
-        console.warn('createWebApiAnimator: No elements found for selector "' + selector + '"');
+        diag.warn(PxDiagnosticKind.host, 'createWebApiAnimator: No elements found for selector "' + selector + '"');
       }
       const keyframesMap = convertToWebApiKeyframes(animDef, unsupportedSet, config);
       const positiveDelay = config.delay && config.delay > 0 ? config.delay : void 0;
@@ -2606,14 +2865,14 @@ var PixodeskAnimator = (() => {
               }
               animations.push(anim);
             } catch (e) {
-              console.warn(e);
+              diag.warn(PxDiagnosticKind.internal, "createWebApiAnimator: could not build the animation", e);
             }
           }
         }
       }
     }
     if (!forceEvenIfHasUnsupportedAttrs && unsupportedSet.size) {
-      console.warn("Unsupported CSS attrs: " + [...unsupportedSet].join(", "));
+      diag.warn(PxDiagnosticKind.platform, "Unsupported CSS attrs: " + [...unsupportedSet].join(", "));
       return null;
     }
     const api = {
@@ -2657,20 +2916,36 @@ var PixodeskAnimator = (() => {
         }
       },
       "setPlaybackRate": (rate) => {
+        if (!isValidPlaybackRate(rate)) {
+          diag.warn(PxDiagnosticKind.usage, PX_RATE_REJECTED);
+          return api;
+        }
         animations.forEach((a) => a.playbackRate = rate);
         return api;
       },
       "getCurrentTime": () => {
-        var _a2, _b;
-        const res = (_b = (_a2 = animations[0]) == null ? void 0 : _a2.currentTime) != null ? _b : null;
+        var _a2, _b2;
+        const res = (_b2 = (_a2 = animations[0]) == null ? void 0 : _a2.currentTime) != null ? _b2 : null;
         return res !== null ? +res : null;
       },
       "setCurrentTime": (time) => {
+        var _a2;
+        const ceiling = seekCeilingMs((_a2 = config.duration) != null ? _a2 : 0, iterations != null ? iterations : 1);
+        const seek = ceiling > 0 ? clampSeekMs(time, ceiling) : Math.max(0, time);
         finishNotified = false;
         animations.forEach((a) => {
-          a.currentTime = time;
+          a.currentTime = seek;
         });
       },
+      "getCurrentProgress": () => {
+        var _a2;
+        const t = api.getCurrentTime();
+        return t === null ? null : timeToProgress(t, (_a2 = config.duration) != null ? _a2 : 0, iterations != null ? iterations : 1);
+      },
+      "setCurrentProgress": (progress) => {
+        var _a2;
+        api.setCurrentTime(progressToTimeMs(progress, (_a2 = config.duration) != null ? _a2 : 0, iterations != null ? iterations : 1));
+      },
       "destroy": () => {
         var _a2;
         api.cancel();
@@ -2681,12 +2956,15 @@ var PixodeskAnimator = (() => {
         }
       }
     };
-    if (config.trigger) {
-      if (config.timelineSource === "scroll") {
-        console.warn("scroll timeline: `animator.trigger` is ignored (triggers do not apply to scroll-driven playback)");
-      } else {
-        setupAnimationTriggers(api, config.trigger);
-      }
+    if (config.timelineSource === "scroll") {
+      if (config.trigger) diag.warn(PxDiagnosticKind.usage, "scroll timeline: `animator.trigger` is ignored (triggers do not apply to scroll-driven playback)");
+    } else {
+      const detachTriggers = setupAnimationTriggers(api, (_b = config.trigger) != null ? _b : {}, diag);
+      const destroyEngine = api.destroy.bind(api);
+      api.destroy = () => {
+        detachTriggers();
+        destroyEngine();
+      };
     }
     if (scrollTimeline) {
       animations.forEach((a) => a.play());
@@ -2714,22 +2992,33 @@ var PixodeskAnimator = (() => {
     }
     return res;
   }
-  function requireData(options) {
-    if (!(options == null ? void 0 : options.data)) throw new Error("createAnimator: `data` is required");
-    return options.data;
+  function requireDoc(options) {
+    if (!(options == null ? void 0 : options.doc)) throw new Error("createAnimator: `doc` is required");
+    return options.doc;
+  }
+  function buildOrReport(options, build) {
+    try {
+      return build();
+    } catch (e) {
+      const err = asThrownError(e);
+      createDiagnostics(options, "[PxAnimator]").error(PxDiagnosticKind.internal, "createAnimator: could not build the player \u2014 " + err.message, err);
+      return createInertAnimator();
+    }
   }
   function createPrerenderedWaapiAnimator(options) {
-    const doc = requireData(options);
-    const animatorConfig = getAnimatorConfig(doc) || {};
-    return finaliseAnimator(
-      animatorConfig,
-      options.callbacks,
-      (cb) => createWebApiAnimator(doc, cb, null, true)
-    );
+    const doc = requireDoc(options);
+    return buildOrReport(options, () => {
+      const animatorConfig = getAnimatorConfig(doc) || {};
+      return finaliseAnimator(
+        animatorConfig,
+        toEngineCallbacks(options),
+        (cb) => createWebApiAnimator(doc, cb, null, true)
+      );
+    });
   }
 
   // src/shared/PxAnimatorKeys.ts
-  var PX_ANIMATOR_DATA_KEY = "data";
+  var PX_ANIMATOR_DOC_KEY = "doc";
   return __toCommonJS(index_prerendered_waapi_exports);
 })();
 //# sourceMappingURL=index.prerendered-waapi.umd.js.map