@pixodesk/svg-animator-web 1.0.21 → 1.0.24

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

@@ -0,0 +1,1687 @@
+"use strict";
+var PixodeskAnimator = (() => {
+  var __defProp = Object.defineProperty;
+  var __defProps = Object.defineProperties;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b)) {
+        if (__propIsEnum.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp(target, name, { get: all[name], enumerable: true });
+  };
+  var __copyProps = (to, from, except, desc) => {
+    if (from && typeof from === "object" || typeof from === "function") {
+      for (let key of __getOwnPropNames(from))
+        if (!__hasOwnProp.call(to, key) && key !== except)
+          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+    }
+    return to;
+  };
+  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+  // src/index.prerendered-waapi.ts
+  var index_prerendered_waapi_exports = {};
+  __export(index_prerendered_waapi_exports, {
+    PX_ANIMATOR_DATA_KEY: () => PX_ANIMATOR_DATA_KEY,
+    createAnimator: () => createPrerenderedWaapiAnimator,
+    setupAnimationTriggers: () => setupAnimationTriggers
+  });
+
+  // ../svg-animator-core/src/PxAnimatorConstants.ts
+  var PxAnimatorMode = {
+    auto: "auto",
+    waapi: "waapi",
+    frames: "frames"
+  };
+  var PxAnimatorEngine = {
+    waapi: PxAnimatorMode.waapi,
+    frames: PxAnimatorMode.frames
+  };
+  var PxLoopExtend = {
+    /** Segment from the START; the animation is extended BEFORE the first keyframe
+     *  (intro loops that run before the main timeline begins). */
+    before: "before",
+    /** DEFAULT — segment from the END; extended AFTER the last keyframe (idle/outro
+     *  loops that continue once the main timeline has finished). */
+    after: "after"
+  };
+  function getAnimatorConfig(doc) {
+    var _a;
+    return (doc == null ? void 0 : doc.animator) || ((_a = doc == null ? void 0 : doc.meta) == null ? void 0 : _a.animator);
+  }
+  function getDefs(doc) {
+    var _a;
+    if (!doc) return void 0;
+    return (_a = getAnimatorConfig(doc)) == null ? void 0 : _a.definitions;
+  }
+  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, animate: anim }));
+  }
+
+  // ../svg-animator-core/src/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 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"]);
+  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 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/PxMotionPath.ts
+  function getKfTranslate(kf) {
+    var _a;
+    const v = (_a = kf.value) != null ? _a : kf.v;
+    if (!v) return void 0;
+    if (Array.isArray(v) && v.length >= 2 && typeof v[0] === "number" && typeof v[1] === "number") {
+      return [v[0], v[1]];
+    }
+    const tr = v.translate;
+    if (Array.isArray(tr) && tr.length >= 2) return [tr[0], tr[1]];
+    return void 0;
+  }
+  function getKfTime(kf) {
+    var _a, _b;
+    return (_b = (_a = kf.time) != null ? _a : kf.t) != null ? _b : 0;
+  }
+  function getKfEasing(kf) {
+    var _a;
+    return (_a = kf.easing) != null ? _a : kf.e;
+  }
+  function propAnimIsMotionPath(anim) {
+    var _a, _b, _c;
+    const kfs = (_a = anim.keyframes) != null ? _a : anim.kfs;
+    if (!Array.isArray(kfs)) return false;
+    if (anim.autoOrient) return true;
+    for (const kf of kfs) {
+      if (((_b = kf.tangentIn) != null ? _b : kf.ti) || ((_c = kf.tangentOut) != null ? _c : kf.to)) return true;
+    }
+    return false;
+  }
+  var _segmentCache = /* @__PURE__ */ new WeakMap();
+  function getSegmentCache(prevKf, nextKf, prevPos, nextPos) {
+    var _a, _b;
+    let byNext = _segmentCache.get(prevKf);
+    const existing = byNext == null ? void 0 : byNext.get(nextKf);
+    if (existing) return existing;
+    const to = (_a = prevKf.tangentOut) != null ? _a : prevKf.to;
+    const ti = (_b = nextKf.tangentIn) != null ? _b : nextKf.ti;
+    const P1 = [prevPos[0] + (to ? to[0] : 0), prevPos[1] + (to ? to[1] : 0)];
+    const P2 = [nextPos[0] + (ti ? ti[0] : 0), nextPos[1] + (ti ? ti[1] : 0)];
+    const lut = bezier2D_arcLengthLUT(prevPos, P1, P2, nextPos);
+    const entry = {
+      P0: prevPos,
+      P1,
+      P2,
+      P3: nextPos,
+      lut,
+      totalArc: lut.ds[lut.ds.length - 1]
+    };
+    if (!byNext) {
+      byNext = /* @__PURE__ */ new WeakMap();
+      _segmentCache.set(prevKf, byNext);
+    }
+    byNext.set(nextKf, entry);
+    return entry;
+  }
+  var DEFAULT_FLATNESS_TOL = 0.5;
+  var DEFAULT_ROTATION_TOL = 5;
+  var DEFAULT_MAX_SAMPLES = 32;
+  function materialiseMotionPathInPropAnim(anim, opts) {
+    var _a, _b, _c, _d;
+    if (!propAnimIsMotionPath(anim)) return anim;
+    const kfs = (_a = anim.keyframes) != null ? _a : anim.kfs;
+    if (!Array.isArray(kfs) || kfs.length < 2) return anim;
+    const autoOrient = !!anim.autoOrient;
+    const flatnessTol = (_b = opts == null ? void 0 : opts.flatnessTolerance) != null ? _b : DEFAULT_FLATNESS_TOL;
+    const rotationTol = (_c = opts == null ? void 0 : opts.rotationTolerance) != null ? _c : DEFAULT_ROTATION_TOL;
+    const maxSamples = (_d = opts == null ? void 0 : opts.maxSamplesPerSegment) != null ? _d : DEFAULT_MAX_SAMPLES;
+    const out = [];
+    const firstPos = getKfTranslate(kfs[0]);
+    if (!firstPos) return anim;
+    const firstRotate = autoOrient ? derivAngleForFirstKf(kfs[0], kfs[1]) : void 0;
+    out.push(makeOutKf(
+      getKfTime(kfs[0]),
+      buildOutKfValue(getKfValueParts(kfs[0]), getKfValueParts(kfs[0]), 0, firstPos, firstRotate, autoOrient)
+    ));
+    for (let i = 0; i < kfs.length - 1; i++) {
+      const prevKf = kfs[i];
+      const nextKf = kfs[i + 1];
+      const prevPos = getKfTranslate(prevKf);
+      const nextPos = getKfTranslate(nextKf);
+      if (!prevPos || !nextPos) {
+        out.push(makeOutKf(
+          getKfTime(nextKf),
+          buildOutKfValue(getKfValueParts(nextKf), getKfValueParts(nextKf), 1, nextPos != null ? nextPos : [0, 0], void 0, autoOrient)
+        ));
+        continue;
+      }
+      if (autoOrient && i > 0) {
+        insertSharpCornerStepKfIfNeeded(out, prevKf, nextKf, prevPos, nextPos, rotationTol);
+      }
+      materialiseSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples);
+    }
+    const lastInE = getKfEasing(kfs[kfs.length - 1]);
+    if (lastInE) out[out.length - 1].e = lastInE;
+    if (autoOrient) unwrapAutoOrientRotations(out);
+    const result = { kfs: out };
+    if (anim.loop !== void 0) result.loop = anim.loop;
+    return result;
+  }
+  function unwrapAutoOrientRotations(kfs) {
+    var _a;
+    let prev;
+    for (const kf of kfs) {
+      const v = (_a = kf.v) != null ? _a : kf.value;
+      if (!v || typeof v.rotate !== "number") continue;
+      if (prev === void 0) {
+        prev = v.rotate;
+        continue;
+      }
+      let r = v.rotate;
+      while (r - prev > 180) r -= 360;
+      while (r - prev < -180) r += 360;
+      v.rotate = r;
+      prev = r;
+    }
+  }
+  function makeOutKf(time, value) {
+    return { t: time, v: value };
+  }
+  function getKfValueParts(kf) {
+    var _a;
+    const v = (_a = kf.value) != null ? _a : kf.v;
+    if (!v || typeof v !== "object" || Array.isArray(v)) return void 0;
+    return v;
+  }
+  function interpolatePart(prev, next, p) {
+    if (prev === void 0) return next;
+    if (next === void 0) return prev;
+    if (typeof prev === "number" && typeof next === "number") {
+      return prev + (next - prev) * p;
+    }
+    if (Array.isArray(prev) && Array.isArray(next) && prev.length === next.length) {
+      const out = new Array(prev.length);
+      for (let i = 0; i < prev.length; i++) {
+        const a = typeof prev[i] === "number" ? prev[i] : 0;
+        const b = typeof next[i] === "number" ? next[i] : 0;
+        out[i] = a + (b - a) * p;
+      }
+      return out;
+    }
+    return p < 0.5 ? prev : next;
+  }
+  function buildOutKfValue(prevV, nextV, p, translate, rotateDegFromAutoOrient, autoOrient) {
+    const value = { translate };
+    const keys = /* @__PURE__ */ new Set();
+    if (prevV) for (const k of Object.keys(prevV)) keys.add(k);
+    if (nextV) for (const k of Object.keys(nextV)) keys.add(k);
+    for (const k of keys) {
+      if (k === "translate") continue;
+      if (k === "rotate" && autoOrient) continue;
+      const pv = prevV == null ? void 0 : prevV[k];
+      const nv = nextV == null ? void 0 : nextV[k];
+      if (pv === void 0 && nv === void 0) continue;
+      value[k] = interpolatePart(pv, nv, p);
+    }
+    if (rotateDegFromAutoOrient !== void 0) {
+      value.rotate = rotateDegFromAutoOrient + explicitRotateAt(prevV, nextV, p);
+    }
+    return value;
+  }
+  function explicitRotateAt(prevV, nextV, p) {
+    const pv = typeof (prevV == null ? void 0 : prevV.rotate) === "number" ? prevV.rotate : void 0;
+    const nv = typeof (nextV == null ? void 0 : nextV.rotate) === "number" ? nextV.rotate : void 0;
+    if (pv === void 0 && nv === void 0) return 0;
+    const r = interpolatePart(pv, nv, p);
+    return typeof r === "number" ? r : 0;
+  }
+  function derivAngleForFirstKf(kf0, kf1) {
+    const p0 = getKfTranslate(kf0);
+    const p1 = getKfTranslate(kf1);
+    if (!p0 || !p1) return 0;
+    const seg = getSegmentCache(kf0, kf1, p0, p1);
+    const tan = bezier2D_derivativeAt(seg.P0, seg.P1, seg.P2, seg.P3, 0);
+    return Math.atan2(tan[1], tan[0]) * 180 / Math.PI;
+  }
+  function wrappedAngleDelta(a, b) {
+    let d = a - b;
+    while (d > 180) d -= 360;
+    while (d < -180) d += 360;
+    return d;
+  }
+  function insertSharpCornerStepKfIfNeeded(out, prevKf, nextKf, prevPos, nextPos, rotationTol) {
+    var _a;
+    const lastKf = out[out.length - 1];
+    const lastV = (_a = lastKf.v) != null ? _a : lastKf.value;
+    const prevExit = lastV == null ? void 0 : lastV.rotate;
+    if (typeof prevExit !== "number") return;
+    const boundaryV = getKfValueParts(prevKf);
+    const prevExitTangent = prevExit - explicitRotateAt(boundaryV, boundaryV, 0);
+    const seg = getSegmentCache(prevKf, nextKf, prevPos, nextPos);
+    const tanAtStart = bezier2D_derivativeAt(seg.P0, seg.P1, seg.P2, seg.P3, 0);
+    const nextEntry = Math.atan2(tanAtStart[1], tanAtStart[0]) * 180 / Math.PI;
+    const delta = wrappedAngleDelta(nextEntry, prevExitTangent);
+    if (Math.abs(delta) <= rotationTol) return;
+    const prevTime = getKfTime(prevKf);
+    const stepTime = Math.min(prevTime + CORNER_STEP_AFTER_BOUNDARY_MS, (prevTime + getKfTime(nextKf)) / 2);
+    const dupValue = buildOutKfValue(
+      getKfValueParts(prevKf),
+      getKfValueParts(prevKf),
+      0,
+      prevPos,
+      nextEntry,
+      true
+    );
+    out.push(makeOutKf(stepTime, dupValue));
+  }
+  var CORNER_STEP_AFTER_BOUNDARY_MS = 0.05;
+  function materialiseSegment(out, prevKf, nextKf, prevPos, nextPos, autoOrient, flatnessTol, rotationTol, maxSamples) {
+    const seg = getSegmentCache(prevKf, nextKf, prevPos, nextPos);
+    const prevTime = getKfTime(prevKf);
+    const nextTime = getKfTime(nextKf);
+    const prevEasing = getKfEasing(prevKf);
+    const invertFn = invertEasing(prevEasing);
+    const prevV = getKfValueParts(prevKf);
+    const nextV = getKfValueParts(nextKf);
+    const interiorTs = computeSampleTs(seg, autoOrient, flatnessTol, rotationTol, maxSamples);
+    const samples = [];
+    for (const t of interiorTs) {
+      const arc = bezier2D_arcAtT(seg.lut, t);
+      const p = clamp(seg.totalArc > 0 ? arc / seg.totalArc : t, 0, 1);
+      const u = clamp(invertFn(p), 0, 1);
+      const pos = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, t);
+      const sample = { u, p, pos };
+      if (autoOrient) {
+        const tan = bezier2D_derivativeAt(seg.P0, seg.P1, seg.P2, seg.P3, t);
+        sample.rotateDeg = Math.atan2(tan[1], tan[0]) * 180 / Math.PI;
+      }
+      samples.push(sample);
+    }
+    let remaining = prevEasing;
+    let prevU = 0;
+    const startIdx = out.length - 1;
+    for (let i = 0; i < samples.length; i++) {
+      const s = samples[i];
+      const xFrac = prevU < 1 ? clamp((s.u - prevU) / (1 - prevU), 0, 1) : 1;
+      const { left, right } = splitEasing(remaining, xFrac);
+      const ownerIdx = i === 0 ? startIdx : out.length - 1;
+      if (left) out[ownerIdx].e = left;
+      else delete out[ownerIdx].e;
+      const tGlobal = prevTime + s.u * (nextTime - prevTime);
+      const value = buildOutKfValue(prevV, nextV, s.p, s.pos, s.rotateDeg, autoOrient);
+      out.push(makeOutKf(tGlobal, value));
+      remaining = right;
+      prevU = s.u;
+    }
+  }
+  function computeSampleTs(seg, autoOrient, flatnessTol, rotationTol, maxSamples) {
+    const extremes = [];
+    addAxisExtremes(seg.P0[0], seg.P1[0], seg.P2[0], seg.P3[0], extremes);
+    addAxisExtremes(seg.P0[1], seg.P1[1], seg.P2[1], seg.P3[1], extremes);
+    extremes.sort((a, b) => a - b);
+    const critical = [0];
+    for (const t of extremes) {
+      if (t > critical[critical.length - 1] + 1e-6 && t < 1 - 1e-6) {
+        critical.push(t);
+      }
+    }
+    critical.push(1);
+    const out = [];
+    const budget = { remaining: maxSamples - critical.length };
+    for (let i = 0; i < critical.length - 1; i++) {
+      bisect(critical[i], critical[i + 1], out, seg, autoOrient, flatnessTol, rotationTol, budget);
+    }
+    return out;
+  }
+  function addAxisExtremes(p0, p1, p2, p3, out) {
+    const a = p1 - p0;
+    const b = p2 - p1;
+    const c = p3 - p2;
+    const A = a - 2 * b + c;
+    const B = 2 * (b - a);
+    const C = a;
+    if (Math.abs(A) < 1e-10) {
+      if (Math.abs(B) > 1e-10) {
+        const t = -C / B;
+        if (t > 1e-6 && t < 1 - 1e-6) out.push(t);
+      }
+      return;
+    }
+    const disc = B * B - 4 * A * C;
+    if (disc < 0) return;
+    const sq = Math.sqrt(disc);
+    const t1 = (-B - sq) / (2 * A);
+    const t2 = (-B + sq) / (2 * A);
+    if (t1 > 1e-6 && t1 < 1 - 1e-6) out.push(t1);
+    if (t2 > 1e-6 && t2 < 1 - 1e-6) out.push(t2);
+  }
+  function bisect(tA, tB, out, seg, autoOrient, flatnessTol, rotationTol, budget) {
+    const tMid = (tA + tB) / 2;
+    const pA = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, tA);
+    const pB = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, tB);
+    const span = tB - tA;
+    const p25 = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, tA + span * 0.25);
+    const p50 = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, tMid);
+    const p75 = bezier2D_pointAt(seg.P0, seg.P1, seg.P2, seg.P3, tA + span * 0.75);
+    const dev = Math.max(
+      perpDist(p25, pA, pB),
+      perpDist(p50, pA, pB),
+      perpDist(p75, pA, pB)
+    );
+    let rotOk = true;
+    if (autoOrient) {
+      const tanA = bezier2D_derivativeAt(seg.P0, seg.P1, seg.P2, seg.P3, tA);
+      const tanB = bezier2D_derivativeAt(seg.P0, seg.P1, seg.P2, seg.P3, tB);
+      const angA = Math.atan2(tanA[1], tanA[0]) * 180 / Math.PI;
+      const angB = Math.atan2(tanB[1], tanB[0]) * 180 / Math.PI;
+      let delta = Math.abs(angA - angB);
+      if (delta > 180) delta = 360 - delta;
+      if (delta > rotationTol) rotOk = false;
+    }
+    if (dev <= flatnessTol && rotOk || budget.remaining <= 0 || span < 1e-6) {
+      out.push(tB);
+      return;
+    }
+    budget.remaining -= 1;
+    bisect(tA, tMid, out, seg, autoOrient, flatnessTol, rotationTol, budget);
+    bisect(tMid, tB, out, seg, autoOrient, flatnessTol, rotationTol, budget);
+  }
+  function perpDist(q, pA, pB) {
+    const dx = pB[0] - pA[0];
+    const dy = pB[1] - pA[1];
+    const len2 = dx * dx + dy * dy;
+    if (len2 < 1e-20) {
+      const qdx = q[0] - pA[0];
+      const qdy = q[1] - pA[1];
+      return Math.sqrt(qdx * qdx + qdy * qdy);
+    }
+    const cross = (q[0] - pA[0]) * dy - (q[1] - pA[1]) * dx;
+    return Math.abs(cross) / Math.sqrt(len2);
+  }
+
+  // ../svg-animator-core/src/PxDefinitions.ts
+  var LOOP_JUMP_SHIFT_MS = 10;
+  function deepEqualValue(a, b) {
+    if (a === b) return true;
+    if (typeof a !== typeof b || a === null || b === null || typeof a !== "object") return false;
+    if (Array.isArray(a) !== Array.isArray(b)) return false;
+    const ka = Object.keys(a);
+    const kb = Object.keys(b);
+    if (ka.length !== kb.length) return false;
+    return ka.every((k) => deepEqualValue(a[k], b[k]));
+  }
+  function parsePathCommands(d) {
+    const tokens = d.split(/([MLCZmlcz]|[\s,]+)/).map((t) => t.trim()).filter((t) => t && t !== ",");
+    const commands = [];
+    let currentCommand = null;
+    for (const token of tokens) {
+      if (/[MLCZmlcz]/.test(token)) {
+        currentCommand = { type: token, values: [] };
+        commands.push(currentCommand);
+      } else if (currentCommand) {
+        const value = +token;
+        currentCommand.values.push(Number.isNaN(value) ? 0 : value);
+      }
+    }
+    return commands;
+  }
+  function parseSvgPathToBezier(d) {
+    const res = [];
+    let currentPath;
+    const commands = parsePathCommands(d);
+    for (const command of commands) {
+      const type = command.type;
+      const values = command.values;
+      if (type === "M" || type === "m") {
+        const x = values[0] || 0;
+        const y = values[1] || 0;
+        currentPath = {
+          v: [[x, y]],
+          i: [[x, y]],
+          o: [[x, y]],
+          c: false
+        };
+        res.push(currentPath);
+        continue;
+      }
+      if (!currentPath) {
+        currentPath = {
+          v: [[0, 0]],
+          i: [[0, 0]],
+          o: [[0, 0]],
+          c: false
+        };
+        res.push(currentPath);
+      }
+      if (type === "L") {
+        const x = values[0] || 0;
+        const y = values[1] || 0;
+        currentPath.v.push([x, y]);
+        currentPath.i.push([x, y]);
+        currentPath.o.push([x, y]);
+      } else if (type === "C") {
+        const outX = values[0] || 0;
+        const outY = values[1] || 0;
+        const inX2 = values[2] || 0;
+        const inY2 = values[3] || 0;
+        const x2 = values[4] || 0;
+        const y2 = values[5] || 0;
+        currentPath.o[currentPath.o.length - 1] = [outX, outY];
+        currentPath.v.push([x2, y2]);
+        currentPath.i.push([inX2, inY2]);
+        currentPath.o.push([x2, y2]);
+      } else if (type === "Z" || type === "z") {
+        currentPath.c = true;
+      } else {
+        console.warn('Unsupported path command "' + type + '"');
+      }
+    }
+    return res;
+  }
+  function extractPathData(str) {
+    if (str.startsWith("path(") && str.endsWith(")")) {
+      return str.slice(5, -1);
+    }
+    if (/^[MmZzLlHhVvCcSsQqTtAa]/.test(str)) {
+      return str;
+    }
+    return void 0;
+  }
+  function isPathString(value) {
+    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);
+      return d ? { paths: parseSvgPathToBezier(d) } : value;
+    }
+    if (value && typeof value === "object" && "paths" in value) {
+      const pathsArray = value.paths;
+      if (Array.isArray(pathsArray) && pathsArray.length > 0) {
+        if (isPathString(pathsArray[0])) {
+          const paths = [];
+          for (const pathStr of pathsArray) {
+            const d = extractPathData(pathStr);
+            if (d) {
+              paths.push(...parseSvgPathToBezier(d));
+            }
+          }
+          return { paths };
+        }
+      }
+      return value;
+    }
+    if (Array.isArray(value)) {
+      if (value.length > 0 && isPathString(value[0])) {
+        const paths = [];
+        for (const pathStr of value) {
+          const d = extractPathData(pathStr);
+          if (d) {
+            paths.push(...parseSvgPathToBezier(d));
+          }
+        }
+        return { paths };
+      }
+      return { paths: value };
+    }
+    if (isPathString(value)) {
+      const d = extractPathData(value);
+      return { paths: parseSvgPathToBezier(d) };
+    }
+    return value;
+  }
+  function resolveEasing(easing, defs) {
+    var _a;
+    if (!easing) return void 0;
+    if (Array.isArray(easing)) {
+      return easing;
+    }
+    if ((_a = defs == null ? void 0 : defs.easings) == null ? void 0 : _a[easing]) {
+      return defs.easings[easing];
+    }
+    console.warn("Unknown easing name: " + easing);
+    return void 0;
+  }
+  function resolveAnimation(animRef, defs) {
+    var _a;
+    if (typeof animRef === "string") {
+      const resolved = (_a = defs == null ? void 0 : defs.animations) == null ? void 0 : _a[animRef];
+      if (!resolved) {
+        console.warn("Unknown animation name: " + animRef);
+      }
+      return resolved;
+    }
+    return animRef;
+  }
+  function resolveElementAnimation(animate, defs) {
+    if (!animate) return [];
+    const results = [];
+    if (typeof animate === "string") {
+      const resolved = resolveAnimation(animate, defs);
+      if (resolved) results.push(resolved);
+    } else if (Array.isArray(animate)) {
+      for (const item of animate) {
+        const resolved = resolveAnimation(item, defs);
+        if (resolved) results.push(resolved);
+      }
+    } else {
+      results.push(animate);
+    }
+    return results;
+  }
+  function interpolateValue(propName, a, b, t) {
+    var _a, _b;
+    if (propName === "d") {
+      const aPaths = (_a = a == null ? void 0 : a.paths) != null ? _a : Array.isArray(a) ? a : [];
+      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)) {
+      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)) {
+      return interpolateTransformParts(a, b, t);
+    }
+    if (propName === "rotate" && typeof a === "number" && typeof b === "number") {
+      return interpolateNum(a, b, t);
+    }
+    if (TRANSFORM_FN_NAMES.has(propName) || propName === "stroke-dasharray" || propName === "strokeDasharray") {
+      return interpolateVec(a || [], b || [], t);
+    }
+    return interpolateNum(+(a || 0), +(b || 0), t);
+  }
+  function interpolateTransformParts(a, b, t) {
+    const keys = /* @__PURE__ */ new Set([...Object.keys(a != null ? a : {}), ...Object.keys(b != null ? b : {})]);
+    const out = {};
+    for (const k of keys) {
+      const av = a == null ? void 0 : a[k];
+      const bv = b == null ? void 0 : b[k];
+      if (k === "rotate" || k === "skew") {
+        out[k] = interpolateNum(+(av != null ? av : 0), +(bv != null ? bv : 0), t);
+      } else if (k === "translate" || k === "scale" || k === "origin") {
+        const fallback = k === "scale" ? [1, 1] : [0, 0];
+        out[k] = interpolateVec(av || fallback, bv || fallback, t);
+      } else {
+        out[k] = bv != null ? bv : av;
+      }
+    }
+    return out;
+  }
+  function expandLoopKeyframes(propName, keyframes, loop, duration) {
+    var _a, _b, _c, _d, _e;
+    const totalIntervals = keyframes.length - 1;
+    const segCount = clamp((_a = loop.segmentCount) != null ? _a : totalIntervals, 1, totalIntervals);
+    let segKfs;
+    if (loop.extend === PxLoopExtend.before) {
+      segKfs = keyframes.slice(0, segCount + 1);
+    } else {
+      segKfs = keyframes.slice(totalIntervals - segCount);
+    }
+    const firstT = (_b = keyframes[0].t) != null ? _b : 0;
+    const lastT = (_c = keyframes[keyframes.length - 1].t) != null ? _c : 0;
+    let fillStart, fillEnd;
+    if (loop.extend === PxLoopExtend.before) {
+      fillStart = 0;
+      fillEnd = firstT;
+    } else {
+      fillStart = lastT;
+      fillEnd = duration;
+    }
+    const fillDuration = fillEnd - fillStart;
+    if (fillDuration <= 0) return keyframes;
+    const segStartT = (_d = segKfs[0].t) != null ? _d : 0;
+    const segEndT = (_e = segKfs[segKfs.length - 1].t) != null ? _e : 0;
+    const segDuration = segEndT - segStartT;
+    if (segDuration <= 0) return keyframes;
+    const template = segKfs.map((kf) => {
+      var _a2, _b2;
+      return {
+        relT: (kf.t - segStartT) / segDuration,
+        v: kf.v,
+        e: kf.e,
+        tangentIn: (_a2 = kf.tangentIn) != null ? _a2 : kf.ti,
+        tangentOut: (_b2 = kf.tangentOut) != null ? _b2 : kf.to
+      };
+    });
+    const fullReps = Math.floor(fillDuration / segDuration);
+    const remainder = fillDuration - fullReps * segDuration;
+    const partialFraction = remainder / segDuration;
+    const looped = [];
+    const separateBoundary = loop.extend !== PxLoopExtend.before;
+    const originalTerminalKf = keyframes[keyframes.length - 1];
+    function appendRep(repStart, isReversed, partial) {
+      var _a2;
+      let entries;
+      if (isReversed) {
+        entries = [];
+        for (let i = template.length - 1; i >= 0; i--) {
+          entries.push({
+            relT: 1 - template[i].relT,
+            v: template[i].v,
+            // Easing for reversed transition: use reversed easing from the forward "from" keyframe
+            e: i > 0 ? reverseEasing(template[i - 1].e) : void 0,
+            // Reversed traversal swaps each vertex's in/out spatial tangents
+            // (geometry is identical, walked backwards), so curvature and
+            // auto-orientation survive the reversed rep.
+            tangentIn: template[i].tangentOut,
+            tangentOut: template[i].tangentIn
+          });
+        }
+      } else {
+        entries = template;
+      }
+      const cutRelT = partial !== void 0 ? partial : 1;
+      for (let i = 0; i < entries.length; i++) {
+        const entry = entries[i];
+        if (entry.relT > cutRelT + 1e-9) {
+          const prev = entries[i - 1];
+          const intervalSpan = entry.relT - prev.relT;
+          const localFrac = (cutRelT - prev.relT) / intervalSpan;
+          const easedFrac = prev.e ? cubicBezier(prev.e)(localFrac) : localFrac;
+          const cutValue = interpolateValue(propName, prev.v, entry.v, easedFrac);
+          const { left: leftEasing } = splitEasing(prev.e, localFrac);
+          if (looped.length > 0 && prev.relT <= cutRelT) {
+            looped[looped.length - 1].e = leftEasing;
+          }
+          looped.push({ t: repStart + cutRelT * segDuration, v: cutValue, e: void 0 });
+          return;
+        }
+        const prevKf = looped.length > 0 ? looped[looped.length - 1] : originalTerminalKf;
+        const isBoundary = separateBoundary && i === 0 && prevKf !== void 0 && Math.abs(((_a2 = prevKf.t) != null ? _a2 : 0) - (repStart + entry.relT * segDuration)) < 1e-9;
+        if (isBoundary) {
+          if (deepEqualValue(prevKf.v, entry.v)) continue;
+          if (looped.length > 0) {
+            delete prevKf.tangentIn;
+            delete prevKf.tangentOut;
+          }
+        }
+        const pushed = {
+          t: repStart + entry.relT * segDuration + (isBoundary ? LOOP_JUMP_SHIFT_MS : 0),
+          v: entry.v,
+          e: i < entries.length - 1 ? entry.e : void 0
+        };
+        if (entry.tangentIn) pushed.tangentIn = entry.tangentIn;
+        if (entry.tangentOut) pushed.tangentOut = entry.tangentOut;
+        looped.push(pushed);
+      }
+    }
+    function appendRepTail(repStart, isReversed, tailFraction) {
+      let entries;
+      if (isReversed) {
+        entries = [];
+        for (let i = template.length - 1; i >= 0; i--) {
+          entries.push({
+            relT: 1 - template[i].relT,
+            v: template[i].v,
+            e: i > 0 ? reverseEasing(template[i - 1].e) : void 0,
+            tangentIn: template[i].tangentOut,
+            tangentOut: template[i].tangentIn
+          });
+        }
+      } else {
+        entries = template;
+      }
+      const startRelT = 1 - tailFraction;
+      for (let i = 0; i < entries.length; i++) {
+        const entry = entries[i];
+        if (entry.relT < startRelT - 1e-9) continue;
+        const prev = entries[i - 1];
+        if (prev && prev.relT < startRelT - 1e-9 && entry.relT > startRelT + 1e-9) {
+          const intervalSpan = entry.relT - prev.relT;
+          const localFrac = (startRelT - prev.relT) / intervalSpan;
+          const easedFrac = prev.e ? cubicBezier(prev.e)(localFrac) : localFrac;
+          const startValue = interpolateValue(propName, prev.v, entry.v, easedFrac);
+          const { right: rightEasing } = splitEasing(prev.e, localFrac);
+          looped.push({ t: repStart, v: startValue, e: rightEasing });
+        }
+        const pushed = {
+          t: repStart + (entry.relT - startRelT) * segDuration,
+          v: entry.v,
+          e: i < entries.length - 1 ? entry.e : void 0
+        };
+        if (entry.tangentIn) pushed.tangentIn = entry.tangentIn;
+        if (entry.tangentOut) pushed.tangentOut = entry.tangentOut;
+        looped.push(pushed);
+      }
+    }
+    if (loop.extend === PxLoopExtend.before) {
+      if (partialFraction > 1e-9) {
+        const isReversed = !!loop.alternate && fullReps % 2 === 0;
+        appendRepTail(fillStart, isReversed, partialFraction);
+      }
+      for (let rep = 0; rep < fullReps; rep++) {
+        const distFromBoundary = fullReps - 1 - rep;
+        const isReversed = !!loop.alternate && distFromBoundary % 2 === 0;
+        const repStart = fillStart + remainder + rep * segDuration;
+        appendRep(repStart, isReversed);
+      }
+    } else {
+      for (let rep = 0; rep < fullReps; rep++) {
+        const isReversed = !!loop.alternate && rep % 2 === 0;
+        const repStart = fillStart + rep * segDuration;
+        appendRep(repStart, isReversed);
+      }
+      if (partialFraction > 1e-9) {
+        const isReversed = !!loop.alternate && fullReps % 2 === 0;
+        const repStart = fillStart + fullReps * segDuration;
+        appendRep(repStart, isReversed, partialFraction);
+      }
+    }
+    if (loop.extend === PxLoopExtend.before) {
+      return [...looped, ...keyframes];
+    } else {
+      return [...keyframes, ...looped];
+    }
+  }
+  function normalizeKeyframes(propName, propAnim, duration, defs) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const keyframes = propAnim.keyframes || propAnim.kfs || [];
+    const normalized = [];
+    for (const kf of keyframes) {
+      const timePct = (_b = (_a = kf.time) != null ? _a : kf.t) != null ? _b : 0;
+      let value = (_c = kf.value) != null ? _c : kf.v;
+      const easing = (_d = kf.easing) != null ? _d : kf.e;
+      if (propName === "d") {
+        value = normalizePathValue(value);
+      }
+      const propNameKebab = isCamelCaseWord(propName) ? camelCaseToKebabWordIfNeeded(propName) : propName;
+      if (COLOUR_ATTR_NAMES.has(propNameKebab)) {
+        value = (_e = parseColor(value)) != null ? _e : value;
+      }
+      const normKf = {
+        t: timePct,
+        v: value,
+        e: resolveEasing(easing, defs)
+      };
+      const tIn = (_f = kf.tangentIn) != null ? _f : kf.ti;
+      const tOut = (_g = kf.tangentOut) != null ? _g : kf.to;
+      if (tIn) normKf.tangentIn = tIn;
+      if (tOut) normKf.tangentOut = tOut;
+      normalized.push(normKf);
+    }
+    normalized.sort((a, b) => {
+      var _a2, _b2;
+      return ((_a2 = a.t) != null ? _a2 : 0) - ((_b2 = b.t) != null ? _b2 : 0);
+    });
+    const loopRaw = propAnim.loop;
+    const loop = loopRaw === true ? {} : loopRaw || void 0;
+    if (loop && normalized.length >= 2) {
+      return expandLoopKeyframes(propName, normalized, loop, duration);
+    }
+    return normalized;
+  }
+  function mergeAnimationDefinitions(animations) {
+    const merged = {};
+    for (const anim of animations) {
+      for (const [prop, propAnim] of Object.entries(anim)) {
+        merged[prop] = propAnim;
+      }
+    }
+    return merged;
+  }
+  var _elementIdCounter = 0;
+  function generateElementId() {
+    return "_px_el_" + ++_elementIdCounter;
+  }
+  function normalizeAnimationDefinition(animDef, duration, defs, engine = PxAnimatorEngine.waapi) {
+    const normalized = {};
+    for (const [propName, propAnim] of Object.entries(animDef)) {
+      const normalizedKfs = normalizeKeyframes(propName, propAnim, duration, defs);
+      if (normalizedKfs.length > 0) {
+        const out = { kfs: normalizedKfs };
+        if (propAnim.autoOrient !== void 0) out.autoOrient = propAnim.autoOrient;
+        if (propAnim.loop !== void 0) out.loop = propAnim.loop;
+        normalized[propName] = engine === PxAnimatorEngine.waapi && propName === "transform" ? materialiseMotionPathInPropAnim(out) : out;
+      }
+    }
+    return normalized;
+  }
+  function getNormalisedBindings(doc, engine = PxAnimatorEngine.waapi) {
+    const animatorConfig = getAnimatorConfig(doc) || {};
+    const defs = getDefs(doc);
+    const duration = animatorConfig.duration || 1e3;
+    const bindings = [];
+    const processAnimation = (id, animate) => {
+      if (!animate) return null;
+      const animDefs = resolveElementAnimation(animate, defs);
+      if (animDefs.length === 0) return null;
+      const merged = mergeAnimationDefinitions(animDefs);
+      const normalizedAnim = normalizeAnimationDefinition(merged, duration, defs, engine);
+      if (Object.keys(normalizedAnim).length === 0) return null;
+      return {
+        id,
+        animate: normalizedAnim
+      };
+    };
+    const docBindings = getBindings(doc);
+    if (docBindings) {
+      for (const binding of docBindings) {
+        const normalized = processAnimation(binding.id, binding.animate);
+        if (normalized) bindings.push(normalized);
+      }
+    }
+    const processNode = (node) => {
+      const inlineAnim = node.animate;
+      if (inlineAnim && Object.keys(inlineAnim).length > 0) {
+        const nodeId = node.id || generateElementId();
+        node.id = nodeId;
+        const normalized = processAnimation(nodeId, inlineAnim);
+        if (normalized) bindings.push(normalized);
+      }
+      if (node.children) {
+        for (let i = 0; i < node.children.length; i++) {
+          processNode(node.children[i]);
+        }
+      }
+    };
+    if (doc.children) {
+      for (let i = 0; i < doc.children.length; i++) {
+        processNode(doc.children[i]);
+      }
+    }
+    return bindings;
+  }
+
+  // src/PxAnimatorTriggers.ts
+  function setupAnimationTriggers(api, config) {
+    const { startOn, outAction = "continue", scrollIntoViewThreshold = 0 } = config;
+    const root = api.getRootElement();
+    if (!root) {
+      console.warn("setupAnimationTriggers: No root element found for animation.");
+      return api;
+    }
+    let reversed = false;
+    const start = () => {
+      if (reversed) {
+        reversed = false;
+        api.setPlaybackRate(1);
+      }
+      api.play();
+    };
+    const handleEndAction = () => {
+      switch (outAction) {
+        case "pause":
+          api.pause();
+          break;
+        case "reset":
+          api.cancel();
+          break;
+        case "reverse":
+          reversed = true;
+          api.setPlaybackRate(-1);
+          api.play();
+          break;
+        case "continue":
+        default:
+          break;
+      }
+    };
+    switch (startOn) {
+      case "load": {
+        const startHandler = () => start();
+        if (document.readyState === "complete") {
+          startHandler();
+        } else {
+          window.addEventListener("load", startHandler, { once: true });
+        }
+        break;
+      }
+      case "mouseOver": {
+        let enteredOnce = false;
+        const mouseOverHandler = () => {
+          enteredOnce = true;
+          start();
+        };
+        const mouseOutHandler = () => {
+          if (enteredOnce) handleEndAction();
+        };
+        root.addEventListener("mouseenter", mouseOverHandler);
+        root.addEventListener("mouseleave", mouseOutHandler);
+        break;
+      }
+      case "click": {
+        const clickHandler = () => {
+          if (api.isPlaying()) {
+            handleEndAction();
+          } else {
+            start();
+          }
+        };
+        root.addEventListener("click", clickHandler);
+        break;
+      }
+      case "scrollIntoView": {
+        const effectiveRatio = (entry) => {
+          var _a, _b;
+          const target = entry.boundingClientRect;
+          const visible = entry.intersectionRect;
+          if (!(target == null ? void 0 : target.height) || !visible) return entry.intersectionRatio;
+          const live = typeof window !== "undefined" && window.innerHeight ? window.innerHeight : Infinity;
+          const declared = (_b = (_a = entry.rootBounds) == null ? void 0 : _a.height) != null ? _b : Infinity;
+          const viewport = Math.min(live, declared);
+          const denom = Math.min(target.height, Number.isFinite(viewport) ? viewport : target.height);
+          return denom > 0 ? visible.height / denom : entry.intersectionRatio;
+        };
+        const thresholdSteps = Array.from({ length: 21 }, (_, i) => i / 20);
+        let wasIntersecting = false;
+        const observer = new IntersectionObserver(
+          (entries) => {
+            entries.forEach((entry) => {
+              if (entry.isIntersecting && effectiveRatio(entry) >= scrollIntoViewThreshold) {
+                wasIntersecting = true;
+                start();
+              } else if (wasIntersecting) {
+                wasIntersecting = false;
+                handleEndAction();
+              }
+            });
+          },
+          { threshold: thresholdSteps }
+        );
+        observer.observe(root);
+        break;
+      }
+      case "programmatic":
+        break;
+    }
+    return api;
+  }
+
+  // src/PxAnimatorFrameLoop.ts
+  function getSelector(id) {
+    return "#" + id;
+  }
+
+  // src/PxAnimatorWebApi.ts
+  function createCssKf(kf, t, propName, unsupportedSet) {
+    var _a, _b;
+    let value = (_a = kf.v) != null ? _a : kf.value;
+    const e = (_b = kf.e) != null ? _b : kf.easing;
+    const cssKf = {
+      offset: t,
+      easing: e && Array.isArray(e) ? "cubic-bezier(" + e.join(",") + ")" : void 0
+    };
+    let cssValue;
+    let cssKey = propName;
+    if (COLOUR_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 });
+      cssKey = "transform";
+    } else if (TRANSFORM_FN_NAMES.has(propName)) {
+      if (Array.isArray(value)) {
+        if (propName === "translate") value = value.map((v) => v + "px");
+        value = value.join(",");
+      }
+      if (propName === "rotate") value = value + "deg";
+      cssValue = propName + "(" + value + ")";
+      cssKey = "transform";
+    } else if (propName === "d") {
+      const paths = value && typeof value === "object" && Array.isArray(value.paths) ? value.paths : [];
+      cssValue = 'path("' + paths.map((bz) => bezierToSvgPath(bz, true)).join("") + '")';
+    } else {
+      cssValue = "" + value;
+    }
+    if (!CSS.supports(camelCaseToKebabWordIfNeeded(cssKey), cssValue)) unsupportedSet.add(cssKey);
+    cssKey = kebabToCamelCaseWord(cssKey);
+    cssKf[cssKey] = cssValue;
+    return cssKf;
+  }
+  function clipKeyframesToDuration(propName, keyframes, duration) {
+    var _a, _b, _c, _d, _e;
+    const result = [];
+    for (let i = 0; i < keyframes.length; i++) {
+      const kf = keyframes[i];
+      const t = (_a = kf.t) != null ? _a : 0;
+      if (t < 0) {
+        const next = keyframes[i + 1];
+        if (next && ((_b = next.t) != null ? _b : 0) >= 0) {
+          const nextT = (_c = next.t) != null ? _c : 0;
+          const localFrac = (0 - t) / (nextT - t);
+          const easedFrac = kf.e ? cubicBezier(kf.e)(localFrac) : localFrac;
+          const { right: rightEasing } = splitEasing(kf.e, localFrac);
+          result.push({ t: 0, v: interpolateValue(propName, kf.v, next.v, easedFrac), e: rightEasing });
+        }
+        continue;
+      }
+      if (t > duration) {
+        const prev = keyframes[i - 1];
+        if (prev && ((_d = prev.t) != null ? _d : 0) <= duration) {
+          const prevT = (_e = prev.t) != null ? _e : 0;
+          const localFrac = (duration - prevT) / (t - prevT);
+          const easedFrac = prev.e ? cubicBezier(prev.e)(localFrac) : localFrac;
+          const { left: leftEasing } = splitEasing(prev.e, localFrac);
+          if (result.length > 0) result[result.length - 1] = __spreadProps(__spreadValues({}, result[result.length - 1]), { e: leftEasing });
+          result.push({ t: duration, v: interpolateValue(propName, prev.v, kf.v, easedFrac), e: void 0 });
+        }
+        break;
+      }
+      result.push(kf);
+    }
+    return result;
+  }
+  function convertToWebApiKeyframes(animDef, unsupportedSet, config) {
+    var _a;
+    const result = /* @__PURE__ */ new Map();
+    for (const [propName, propAnim] of Object.entries(animDef)) {
+      const duration = config.duration || 1;
+      const clippedKeyframes = clipKeyframesToDuration(propName, propAnim.kfs || propAnim.keyframes || [], duration);
+      const cssKeyframes = [];
+      for (let i = 0; i < clippedKeyframes.length; i++) {
+        const kf = clippedKeyframes[i];
+        const t = clamp(((_a = kf.t) != null ? _a : 0) / duration, 0, 1);
+        const cssKf = createCssKf(kf, t, propName, unsupportedSet);
+        if (i === 0 && (cssKf.offset || 0) > 0) {
+          cssKeyframes.push(__spreadProps(__spreadValues({}, cssKf), { offset: 0 }));
+        }
+        cssKeyframes.push(cssKf);
+      }
+      if (cssKeyframes.length > 0 && (cssKeyframes[cssKeyframes.length - 1].offset || 0) < 1) {
+        cssKeyframes.push(__spreadProps(__spreadValues({}, cssKeyframes[cssKeyframes.length - 1]), {
+          offset: 1
+        }));
+      }
+      if (cssKeyframes.length > 0) {
+        result.set(propName, cssKeyframes);
+      }
+    }
+    return result;
+  }
+  function createWebApiAnimator(doc, callbacks, rootElement, forceEvenIfHasUnsupportedAttrs) {
+    var _a;
+    const config = getAnimatorConfig(doc) || {};
+    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);
+      } else {
+        console.warn("createFrameLoopAnimator: No root element provided");
+      }
+    }
+    const bindings = getNormalisedBindings(doc, PxAnimatorEngine.waapi);
+    const animations = [];
+    const _iterations = config.iterations;
+    let iterations;
+    if (typeof _iterations === "number") iterations = _iterations;
+    if (_iterations === "infinite") iterations = Infinity;
+    const unsupportedSet = /* @__PURE__ */ new Set();
+    let finishNotified = false;
+    let removeCalled = false;
+    if (!(bindings == null ? void 0 : bindings.length)) {
+      console.warn("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);
+        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 + '"');
+      }
+      const keyframesMap = convertToWebApiKeyframes(animDef, unsupportedSet, config);
+      const positiveDelay = config.delay && config.delay > 0 ? config.delay : void 0;
+      let seekPosition;
+      if (config.delay && config.delay < 0 && config.duration) {
+        const rawSeek = -config.delay;
+        seekPosition = iterations === Infinity ? rawSeek % config.duration : Math.min(rawSeek, config.duration * (iterations != null ? iterations : 1));
+      }
+      const effectOptions = {
+        duration: config.duration,
+        delay: positiveDelay,
+        // Default to 'forwards' so elements hold their final state after the
+        // animation ends — consistent with Lottie and other animation runtimes.
+        // Without this, seeking to the last frame reverts elements to their
+        // pre-animation state (the Web Animations API "after" phase with fill:'none').
+        fill: (_a = config.fill) != null ? _a : "forwards",
+        direction: config.direction,
+        iterations
+      };
+      for (let i = 0; i < elements.length; i++) {
+        const element = elements[i];
+        for (const [, keyframes] of keyframesMap) {
+          if (keyframes.length > 0) {
+            try {
+              const effect = new KeyframeEffect(element, keyframes, effectOptions);
+              const anim = new Animation(effect, document.timeline);
+              if (callbacks == null ? void 0 : callbacks.onFinish) anim.onfinish = () => {
+                var _a2;
+                if (finishNotified) return;
+                finishNotified = true;
+                (_a2 = callbacks.onFinish) == null ? void 0 : _a2.call(callbacks);
+              };
+              if (callbacks == null ? void 0 : callbacks.onRemove) anim.onremove = () => {
+                var _a2;
+                if (removeCalled) return;
+                removeCalled = true;
+                (_a2 = callbacks.onRemove) == null ? void 0 : _a2.call(callbacks);
+              };
+              if (seekPosition !== void 0) {
+                anim.currentTime = seekPosition;
+              }
+              animations.push(anim);
+            } catch (e) {
+              console.warn(e);
+            }
+          }
+        }
+      }
+    }
+    if (!forceEvenIfHasUnsupportedAttrs && unsupportedSet.size) {
+      console.warn("Unsupported CSS attrs: " + [...unsupportedSet].join(", "));
+      return null;
+    }
+    const api = {
+      "isReady": () => true,
+      "getRootElement": () => rootElement || null,
+      "isPlaying": () => {
+        var _a2;
+        return ((_a2 = animations[0]) == null ? void 0 : _a2.playState) === "running";
+      },
+      "play": () => {
+        var _a2;
+        finishNotified = false;
+        animations.forEach((a) => a.play());
+        (_a2 = callbacks == null ? void 0 : callbacks.onPlay) == null ? void 0 : _a2.call(callbacks);
+      },
+      "pause": () => {
+        var _a2;
+        animations.forEach((a) => a.pause());
+        (_a2 = callbacks == null ? void 0 : callbacks.onPause) == null ? void 0 : _a2.call(callbacks);
+      },
+      "cancel": () => {
+        var _a2;
+        finishNotified = false;
+        animations.forEach((a) => a.cancel());
+        (_a2 = callbacks == null ? void 0 : callbacks.onCancel) == null ? void 0 : _a2.call(callbacks);
+      },
+      "finish": () => {
+        var _a2;
+        for (const a of animations) {
+          try {
+            if (((_a2 = a.effect) == null ? void 0 : _a2.getTiming().iterations) === Infinity) {
+              a.effect.updateTiming({ iterations: 1 });
+              a.finish();
+              a.effect.updateTiming({ iterations: Infinity });
+            } else {
+              a.finish();
+            }
+          } catch (e) {
+            a.cancel();
+          }
+        }
+      },
+      "setPlaybackRate": (rate) => {
+        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;
+        return res !== null ? +res : null;
+      },
+      "setCurrentTime": (time) => {
+        finishNotified = false;
+        animations.forEach((a) => {
+          a.currentTime = time;
+        });
+      },
+      "destroy": () => {
+        var _a2;
+        api.cancel();
+        animations.splice(0, animations.length);
+        if (!removeCalled) {
+          removeCalled = true;
+          (_a2 = callbacks == null ? void 0 : callbacks.onRemove) == null ? void 0 : _a2.call(callbacks);
+        }
+      }
+    };
+    if (config.trigger) {
+      setupAnimationTriggers(api, config.trigger);
+    }
+    return api;
+  }
+
+  // src/PxAnimatorBind.ts
+  function finaliseAnimator(animatorConfig, callbacks, make) {
+    let apiRef;
+    let effectiveCallbacks = callbacks;
+    if (animatorConfig.resetOnFinish) {
+      effectiveCallbacks = __spreadProps(__spreadValues({}, callbacks), {
+        onFinish: () => {
+          var _a;
+          (_a = callbacks == null ? void 0 : callbacks.onFinish) == null ? void 0 : _a.call(callbacks);
+          apiRef == null ? void 0 : apiRef.cancel();
+        }
+      });
+    }
+    const res = make(effectiveCallbacks);
+    apiRef = res;
+    if (animatorConfig.debugInstName) {
+      window[animatorConfig.debugInstName] = res;
+    }
+    return res;
+  }
+  function requireData(options) {
+    if (!(options == null ? void 0 : options.data)) throw new Error("createAnimator: `data` is required");
+    return options.data;
+  }
+  function createPrerenderedWaapiAnimator(options) {
+    const doc = requireData(options);
+    const animatorConfig = getAnimatorConfig(doc) || {};
+    return finaliseAnimator(
+      animatorConfig,
+      options.callbacks,
+      (cb) => createWebApiAnimator(doc, cb, null, true)
+    );
+  }
+
+  // src/PxAnimatorKeys.ts
+  var PX_ANIMATOR_DATA_KEY = "data";
+  return __toCommonJS(index_prerendered_waapi_exports);
+})();
+//# sourceMappingURL=index.prerendered-waapi.umd.js.map