@wix/motion 1.670.0 → 2.0.0-dp.20260305184410

package/dist/es/motion.js

@@ -0,0 +1,941 @@
+class O {
+  animations;
+  options;
+  ready;
+  isCSS;
+  constructor(e, n) {
+    this.animations = e, this.options = n, this.ready = n?.measured || Promise.resolve(), this.isCSS = e[0] instanceof CSSAnimation;
+  }
+  getProgress() {
+    return this.animations[0]?.effect?.getComputedTiming().progress || 0;
+  }
+  async play(e) {
+    await this.ready;
+    for (const n of this.animations)
+      n.play();
+    await Promise.all(this.animations.map((n) => n.ready)), e && e();
+  }
+  pause() {
+    for (const e of this.animations)
+      e.pause();
+  }
+  async reverse(e) {
+    await this.ready;
+    for (const n of this.animations)
+      n.reverse();
+    await Promise.all(this.animations.map((n) => n.ready)), e && e();
+  }
+  progress(e) {
+    for (const n of this.animations) {
+      const { delay: i, duration: s, iterations: r } = n.effect.getTiming(), u = (Number.isFinite(s) ? s : 0) * (Number.isFinite(r) ? r : 1);
+      n.currentTime = ((i || 0) + u) * e;
+    }
+  }
+  cancel() {
+    for (const e of this.animations)
+      e.cancel();
+  }
+  setPlaybackRate(e) {
+    for (const n of this.animations)
+      n.playbackRate = e;
+  }
+  async onFinish(e) {
+    try {
+      await Promise.all(this.animations.map((i) => i.finished));
+      const n = this.animations[0];
+      if (n && !this.isCSS) {
+        const i = n.effect?.target;
+        if (i) {
+          const s = new Event("animationend");
+          i.dispatchEvent(s);
+        }
+      }
+      e();
+    } catch (n) {
+      console.warn("animation was interrupted - aborting onFinish callback - ", n);
+    }
+  }
+  get finished() {
+    return Promise.all(this.animations.map((e) => e.finished));
+  }
+  get playState() {
+    return this.animations[0]?.playState;
+  }
+  getTimingOptions() {
+    return this.animations.map((e) => {
+      const n = e.effect?.getTiming(), i = n?.delay ?? 0, s = Number(n?.duration) || 0, r = n?.iterations ?? 1;
+      return {
+        delay: i,
+        duration: s,
+        iterations: r
+      };
+    });
+  }
+}
+const D = (t) => t, W = (t) => 1 - Math.cos(t * Math.PI / 2), B = (t) => Math.sin(t * Math.PI / 2), K = (t) => -(Math.cos(Math.PI * t) - 1) / 2, X = (t) => t ** 2, J = (t) => 1 - (1 - t) ** 2, U = (t) => t < 0.5 ? 2 * t ** 2 : 1 - (-2 * t + 2) ** 2 / 2, Y = (t) => t ** 3, Q = (t) => 1 - (1 - t) ** 3, Z = (t) => t < 0.5 ? 4 * t ** 3 : 1 - (-2 * t + 2) ** 3 / 2, tt = (t) => t ** 4, et = (t) => 1 - (1 - t) ** 4, nt = (t) => t < 0.5 ? 8 * t ** 4 : 1 - (-2 * t + 2) ** 4 / 2, it = (t) => t ** 5, st = (t) => 1 - (1 - t) ** 5, rt = (t) => t < 0.5 ? 16 * t ** 5 : 1 - (-2 * t + 2) ** 5 / 2, ot = (t) => t === 0 ? 0 : 2 ** (10 * t - 10), at = (t) => t === 1 ? 1 : 1 - 2 ** (-10 * t), ct = (t) => t === 0 ? 0 : t === 1 ? 1 : t < 0.5 ? 2 ** (20 * t - 10) / 2 : (2 - 2 ** (-20 * t + 10)) / 2, ut = (t) => 1 - Math.sqrt(1 - t ** 2), ft = (t) => Math.sqrt(1 - (t - 1) ** 2), lt = (t) => t < 0.5 ? (1 - Math.sqrt(1 - 4 * t ** 2)) / 2 : (Math.sqrt(-(2 * t - 3) * (2 * t - 1)) + 1) / 2, mt = (t) => 2.70158 * t ** 3 - 1.70158 * t ** 2, dt = (t) => 1 + 2.70158 * (t - 1) ** 3 + 1.70158 * (t - 1) ** 2, ht = (t, e = 1.70158 * 1.525) => t < 0.5 ? (2 * t) ** 2 * ((e + 1) * 2 * t - e) / 2 : ((2 * t - 2) ** 2 * ((e + 1) * (t * 2 - 2) + e) + 2) / 2, z = {
+  linear: D,
+  sineIn: W,
+  sineOut: B,
+  sineInOut: K,
+  quadIn: X,
+  quadOut: J,
+  quadInOut: U,
+  cubicIn: Y,
+  cubicOut: Q,
+  cubicInOut: Z,
+  quartIn: tt,
+  quartOut: et,
+  quartInOut: nt,
+  quintIn: it,
+  quintOut: st,
+  quintInOut: rt,
+  expoIn: ot,
+  expoOut: at,
+  expoInOut: ct,
+  circIn: ut,
+  circOut: ft,
+  circInOut: lt,
+  backIn: mt,
+  backOut: dt,
+  backInOut: ht
+}, F = {
+  linear: "linear",
+  ease: "ease",
+  easeIn: "ease-in",
+  easeOut: "ease-out",
+  easeInOut: "ease-in-out",
+  sineIn: "cubic-bezier(0.47, 0, 0.745, 0.715)",
+  sineOut: "cubic-bezier(0.39, 0.575, 0.565, 1)",
+  sineInOut: "cubic-bezier(0.445, 0.05, 0.55, 0.95)",
+  quadIn: "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
+  quadOut: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+  quadInOut: "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
+  cubicIn: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+  cubicOut: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+  cubicInOut: "cubic-bezier(0.645, 0.045, 0.355, 1)",
+  quartIn: "cubic-bezier(0.895, 0.03, 0.685, 0.22)",
+  quartOut: "cubic-bezier(0.165, 0.84, 0.44, 1)",
+  quartInOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+  quintIn: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
+  quintOut: "cubic-bezier(0.23, 1, 0.32, 1)",
+  quintInOut: "cubic-bezier(0.86, 0, 0.07, 1)",
+  expoIn: "cubic-bezier(0.95, 0.05, 0.795, 0.035)",
+  expoOut: "cubic-bezier(0.19, 1, 0.22, 1)",
+  expoInOut: "cubic-bezier(1, 0, 0, 1)",
+  circIn: "cubic-bezier(0.6, 0.04, 0.98, 0.335)",
+  circOut: "cubic-bezier(0.075, 0.82, 0.165, 1)",
+  circInOut: "cubic-bezier(0.785, 0.135, 0.15, 0.86)",
+  backIn: "cubic-bezier(0.6, -0.28, 0.735, 0.045)",
+  backOut: "cubic-bezier(0.175, 0.885, 0.32, 1.275)",
+  backInOut: "cubic-bezier(0.68, -0.55, 0.265, 1.55)"
+};
+function pt(t) {
+  return t === "percentage" ? "%" : t || "px";
+}
+function gt(t) {
+  return t ? F[t] || t : F.linear;
+}
+function bt(t, e, n, i) {
+  const s = 3 * t, r = 3 * (n - t) - s, u = 1 - s - r, a = 3 * e, l = 3 * (i - e) - a, m = 1 - a - l, o = (d) => ((u * d + r) * d + s) * d, c = (d) => ((m * d + l) * d + a) * d, f = (d) => (3 * u * d + 2 * r) * d + s;
+  function p(d) {
+    let h = d;
+    for (let b = 0; b < 8; b++) {
+      const y = o(h) - d;
+      if (Math.abs(y) < 1e-7) return h;
+      const _ = f(h);
+      if (Math.abs(_) < 1e-6) break;
+      h -= y / _;
+    }
+    let v = 0, g = 1;
+    for (h = (v + g) / 2; g - v > 1e-7; ) {
+      const b = o(h);
+      if (Math.abs(b - d) < 1e-7) return h;
+      d > b ? v = h : g = h, h = (v + g) / 2;
+    }
+    return h;
+  }
+  return (d) => d <= 0 ? 0 : d >= 1 ? 1 : c(p(d));
+}
+function yt(t) {
+  const e = t.match(
+    /^cubic-bezier\(\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*\)$/
+  );
+  if (!e) return;
+  const n = parseFloat(e[1]), i = parseFloat(e[2]), s = parseFloat(e[3]), r = parseFloat(e[4]);
+  if (![n, i, s, r].some(isNaN))
+    return bt(n, i, s, r);
+}
+function vt(t) {
+  const e = t.match(/^linear\((.+)\)$/);
+  if (!e) return;
+  const n = e[1].split(",").map((u) => u.trim()).filter(Boolean);
+  if (n.length === 0) return;
+  const i = [];
+  for (const u of n) {
+    const a = u.split(/\s+/), l = parseFloat(a[0]);
+    if (isNaN(l)) return;
+    const m = [];
+    for (let o = 1; o < a.length; o++)
+      if (a[o].endsWith("%")) {
+        const c = parseFloat(a[o]) / 100;
+        if (isNaN(c)) return;
+        m.push(c);
+      }
+    m.length === 0 ? i.push({ output: l, pos: null }) : m.length === 1 ? i.push({ output: l, pos: m[0] }) : (i.push({ output: l, pos: m[0] }), i.push({ output: l, pos: m[1] }));
+  }
+  if (i.length === 0) return;
+  i[0].pos === null && (i[0].pos = 0), i[i.length - 1].pos === null && (i[i.length - 1].pos = 1);
+  let s = 0;
+  for (; s < i.length; )
+    if (i[s].pos === null) {
+      const u = s - 1;
+      let a = s;
+      for (; a < i.length && i[a].pos === null; ) a++;
+      const l = i[u].pos, m = i[a].pos, o = a - u;
+      for (let c = u + 1; c < a; c++)
+        i[c].pos = l + (m - l) * (c - u) / o;
+      s = a + 1;
+    } else
+      s++;
+  for (let u = 1; u < i.length; u++)
+    i[u].pos < i[u - 1].pos && (i[u].pos = i[u - 1].pos);
+  const r = i;
+  return (u) => {
+    if (u <= r[0].pos) return r[0].output;
+    const a = r[r.length - 1];
+    if (u >= a.pos) return a.output;
+    let l = 0, m = r.length - 1;
+    for (; l < m - 1; ) {
+      const f = l + m >>> 1;
+      r[f].pos <= u ? l = f : m = f;
+    }
+    const o = r[l], c = r[m];
+    return c.pos === o.pos ? c.output : o.output + (c.output - o.output) * (u - o.pos) / (c.pos - o.pos);
+  };
+}
+function R(t) {
+  if (!t) return;
+  const e = z[t];
+  return e || (yt(t) ?? vt(t) ?? z.linear);
+}
+class Et extends O {
+  animationGroups;
+  delay;
+  offset;
+  offsetEasing;
+  timingOptions;
+  constructor(e, n = {}) {
+    const i = e.flatMap((s) => [...s.animations]);
+    super(i), this.animationGroups = e, this.delay = n.delay ?? 0, this.offset = n.offset ?? 0, this.offsetEasing = typeof n.offsetEasing == "function" ? n.offsetEasing : R(n.offsetEasing) ?? D, this.timingOptions = this.animationGroups.map((s) => s.getTimingOptions().map(({ delay: r, duration: u, iterations: a }) => ({
+      delay: r,
+      duration: Number.isFinite(u) ? u : 0,
+      iterations: Number.isFinite(a) ? a : 1
+    }))), this.applyOffsets(), this.ready = Promise.all(e.map((s) => s.ready)).then(() => {
+    });
+  }
+  /**
+   * Calculates stagger delay offsets for each animation group using the formula:
+   *   easing(i / last) * last * offset
+   * where i is the group index and last is the index of the final group.
+   */
+  calculateOffsets() {
+    const e = this.animationGroups.length;
+    if (e <= 1) return [0];
+    const n = e - 1;
+    return Array.from(
+      { length: e },
+      (i, s) => this.offsetEasing(s / n) * n * this.offset | 0
+    );
+  }
+  applyOffsets() {
+    const e = this.calculateOffsets(), n = this.getSequenceActiveDuration(e);
+    this.animationGroups.forEach((i, s) => {
+      i.animations.forEach((r, u) => {
+        const a = r.effect;
+        if (!a) return;
+        const { delay: l, duration: m, iterations: o } = this.timingOptions[s][u], c = l + e[s], f = n - (c + m * o);
+        a.updateTiming({ delay: c + this.delay, endDelay: f });
+      });
+    });
+  }
+  getSequenceActiveDuration(e) {
+    const n = [];
+    for (let i = 0; i < this.timingOptions.length; i++) {
+      const s = this.timingOptions[i].reduce((r, u) => {
+        if (!u) return r;
+        const { delay: a, duration: l, iterations: m } = u;
+        return Math.max(r, a + l * m);
+      }, 0);
+      n.push(e[i] + s);
+    }
+    return Math.max(...n);
+  }
+  /**
+   * Inserts new AnimationGroups at specified indices, then recalculates
+   * stagger offsets for all groups. Each entry specifies the target index
+   * in the animationGroups array where the group should be inserted.
+   */
+  addGroups(e) {
+    if (e.length === 0) return;
+    const n = [...e].sort((i, s) => s.index - i.index);
+    for (const { index: i, group: s } of n) {
+      const r = Math.min(i, this.animationGroups.length);
+      this.animationGroups.splice(r, 0, s), this.timingOptions.splice(r, 0, s.getTimingOptions());
+      const u = [...s.animations], a = this.animationGroups.slice(0, r).reduce((l, m) => l + m.animations.length, 0);
+      this.animations.splice(a, 0, ...u);
+    }
+    this.applyOffsets(), this.ready = Promise.all(this.animationGroups.map((i) => i.ready)).then(() => {
+    });
+  }
+  async onFinish(e) {
+    try {
+      await Promise.all(this.animationGroups.map((n) => n.finished)), e();
+    } catch (n) {
+      console.warn("animation was interrupted - aborting onFinish callback - ", n);
+    }
+  }
+}
+class _t {
+  _animation;
+  customEffect;
+  progress;
+  _tickCbId;
+  _finishHandler;
+  constructor(e, n, i, s) {
+    const r = new KeyframeEffect(n, [], {
+      ...i,
+      composite: "add"
+    }), { timeline: u } = s;
+    this._animation = new Animation(r, u), this._tickCbId = null, this.progress = null, this.customEffect = (a) => e(r.target, a), this._finishHandler = (a) => {
+      this.effect.target?.getAnimations().find((l) => l === this._animation) || this.cancel();
+    }, this.addEventListener("finish", this._finishHandler), this.addEventListener("remove", this._finishHandler);
+  }
+  // private tick method for customEffect loop implementation
+  _tick() {
+    try {
+      const e = this.effect?.getComputedTiming().progress ?? null;
+      e !== this.progress && (this.customEffect?.(e), this.progress = e), this._tickCbId = requestAnimationFrame(() => {
+        this._tick();
+      });
+    } catch (e) {
+      this._tickCbId = null, console.error(
+        `failed to run customEffect! effectId: ${this.id}, error: ${e instanceof Error ? e.message : e}`
+      );
+    }
+  }
+  // Animation timing properties
+  get currentTime() {
+    return this._animation.currentTime;
+  }
+  set currentTime(e) {
+    this._animation.currentTime = e;
+  }
+  get startTime() {
+    return this._animation.startTime;
+  }
+  set startTime(e) {
+    this._animation.startTime = e;
+  }
+  get playbackRate() {
+    return this._animation.playbackRate;
+  }
+  set playbackRate(e) {
+    this._animation.playbackRate = e;
+  }
+  // Animation basic properties
+  get id() {
+    return this._animation.id;
+  }
+  set id(e) {
+    this._animation.id = e;
+  }
+  get effect() {
+    return this._animation.effect;
+  }
+  set effect(e) {
+    this._animation.effect = e;
+  }
+  get timeline() {
+    return this._animation.timeline;
+  }
+  set timeline(e) {
+    this._animation.timeline = e;
+  }
+  // Animation readonly state properties
+  get finished() {
+    return this._animation.finished;
+  }
+  get pending() {
+    return this._animation.pending;
+  }
+  get playState() {
+    return this._animation.playState;
+  }
+  get ready() {
+    return this._animation.ready;
+  }
+  get replaceState() {
+    return this._animation.replaceState;
+  }
+  // Animation event handlers
+  get oncancel() {
+    return this._animation.oncancel;
+  }
+  set oncancel(e) {
+    this._animation.oncancel = e;
+  }
+  get onfinish() {
+    return this._animation.onfinish;
+  }
+  set onfinish(e) {
+    this._animation.onfinish = e;
+  }
+  get onremove() {
+    return this._animation.onremove;
+  }
+  set onremove(e) {
+    this._animation.onremove = e;
+  }
+  // CustomAnimation overridden methods
+  play() {
+    this._animation.play(), cancelAnimationFrame(this._tickCbId), this._tickCbId = requestAnimationFrame(() => this._tick());
+  }
+  pause() {
+    this._animation.pause(), cancelAnimationFrame(this._tickCbId), this._tickCbId = null;
+  }
+  cancel() {
+    this.removeEventListener("finish", this._finishHandler), this.removeEventListener("remove", this._finishHandler), this._animation.cancel(), this.customEffect(null), cancelAnimationFrame(this._tickCbId), this._tickCbId = null;
+  }
+  commitStyles() {
+    console.warn(
+      "CustomEffect animations do not support commitStyles method as they have no style to commit"
+    );
+  }
+  // Animation methods without override
+  finish() {
+    this._animation.finish();
+  }
+  persist() {
+    this._animation.persist();
+  }
+  reverse() {
+    this._animation.reverse();
+  }
+  updatePlaybackRate(e) {
+    this._animation.updatePlaybackRate(e);
+  }
+  // Animation events API
+  addEventListener(e, n, i) {
+    this._animation.addEventListener(e, n, i);
+  }
+  removeEventListener(e, n, i) {
+    this._animation.removeEventListener(e, n, i);
+  }
+  dispatchEvent(e) {
+    return this._animation.dispatchEvent(e);
+  }
+}
+function wt(t) {
+  return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
+}
+var A = { exports: {} }, C = A.exports, x;
+function It() {
+  return x || (x = 1, (function(t) {
+    (function(e) {
+      var n = function() {
+      }, i = e.requestAnimationFrame || e.webkitRequestAnimationFrame || e.mozRequestAnimationFrame || e.msRequestAnimationFrame || function(o) {
+        return setTimeout(o, 16);
+      };
+      function s() {
+        var o = this;
+        o.reads = [], o.writes = [], o.raf = i.bind(e);
+      }
+      s.prototype = {
+        constructor: s,
+        /**
+         * We run this inside a try catch
+         * so that if any jobs error, we
+         * are able to recover and continue
+         * to flush the batch until it's empty.
+         *
+         * @param {Array} tasks
+         */
+        runTasks: function(o) {
+          for (var c; c = o.shift(); ) c();
+        },
+        /**
+         * Adds a job to the read batch and
+         * schedules a new frame if need be.
+         *
+         * @param  {Function} fn
+         * @param  {Object} ctx the context to be bound to `fn` (optional).
+         * @public
+         */
+        measure: function(o, c) {
+          var f = c ? o.bind(c) : o;
+          return this.reads.push(f), r(this), f;
+        },
+        /**
+         * Adds a job to the
+         * write batch and schedules
+         * a new frame if need be.
+         *
+         * @param  {Function} fn
+         * @param  {Object} ctx the context to be bound to `fn` (optional).
+         * @public
+         */
+        mutate: function(o, c) {
+          var f = c ? o.bind(c) : o;
+          return this.writes.push(f), r(this), f;
+        },
+        /**
+         * Clears a scheduled 'read' or 'write' task.
+         *
+         * @param {Object} task
+         * @return {Boolean} success
+         * @public
+         */
+        clear: function(o) {
+          return a(this.reads, o) || a(this.writes, o);
+        },
+        /**
+         * Extend this FastDom with some
+         * custom functionality.
+         *
+         * Because fastdom must *always* be a
+         * singleton, we're actually extending
+         * the fastdom instance. This means tasks
+         * scheduled by an extension still enter
+         * fastdom's global task queue.
+         *
+         * The 'super' instance can be accessed
+         * from `this.fastdom`.
+         *
+         * @example
+         *
+         * var myFastdom = fastdom.extend({
+         *   initialize: function() {
+         *     // runs on creation
+         *   },
+         *
+         *   // override a method
+         *   measure: function(fn) {
+         *     // do extra stuff ...
+         *
+         *     // then call the original
+         *     return this.fastdom.measure(fn);
+         *   },
+         *
+         *   ...
+         * });
+         *
+         * @param  {Object} props  properties to mixin
+         * @return {FastDom}
+         */
+        extend: function(o) {
+          if (typeof o != "object") throw new Error("expected object");
+          var c = Object.create(this);
+          return l(c, o), c.fastdom = this, c.initialize && c.initialize(), c;
+        },
+        // override this with a function
+        // to prevent Errors in console
+        // when tasks throw
+        catch: null
+      };
+      function r(o) {
+        o.scheduled || (o.scheduled = !0, o.raf(u.bind(null, o)));
+      }
+      function u(o) {
+        var c = o.writes, f = o.reads, p;
+        try {
+          n("flushing reads", f.length), o.runTasks(f), n("flushing writes", c.length), o.runTasks(c);
+        } catch (d) {
+          p = d;
+        }
+        if (o.scheduled = !1, (f.length || c.length) && r(o), p)
+          if (n("task errored", p.message), o.catch) o.catch(p);
+          else throw p;
+      }
+      function a(o, c) {
+        var f = o.indexOf(c);
+        return !!~f && !!o.splice(f, 1);
+      }
+      function l(o, c) {
+        for (var f in c)
+          c.hasOwnProperty(f) && (o[f] = c[f]);
+      }
+      var m = e.fastdom = e.fastdom || new s();
+      t.exports = m;
+    })(typeof window < "u" ? window : typeof C < "u" ? C : globalThis);
+  })(A)), A.exports;
+}
+var Ot = It();
+const E = /* @__PURE__ */ wt(Ot), $ = {};
+function Nt(t) {
+  Object.assign($, t);
+}
+function At(t) {
+  return t in $ ? $[t] : (console.warn(
+    `${t} not found in registry. Please make sure to import and register the preset.`
+  ), null);
+}
+function w(t, e) {
+  return t ? (e || document).getElementById(t) : null;
+}
+function kt(t, e) {
+  return t?.matches(`[data-motion-part~="${e}"]`) ? t : t?.querySelector(`[data-motion-part~="${e}"]`);
+}
+function Tt(t) {
+  const e = t.alternate ? "alternate" : "";
+  return t.reversed ? `${e ? `${e}-` : ""}reverse` : e || "normal";
+}
+function T(t) {
+  return `${t.value}${pt(t.unit)}`;
+}
+function M(t, e, n) {
+  return `${t.name || "cover"} ${n && t.offset.unit !== "percentage" ? `calc(100% + ${T(t.offset)}${e ? ` + ${e}` : ""})` : e ? `calc(${T(t.offset)} + ${e})` : T(t.offset)}`;
+}
+function G(t) {
+  return {
+    start: M(t.startOffset, t.startOffsetAdd),
+    end: M(t.endOffset, t.endOffsetAdd, !0)
+  };
+}
+function L(t) {
+  return (e) => E.measure(() => e(t));
+}
+function j(t) {
+  return (e) => E.mutate(() => e(t));
+}
+function I(t) {
+  if (t.namedEffect) {
+    const e = t.namedEffect.type;
+    return typeof e == "string" ? At(e) : null;
+  } else if (t.keyframeEffect) {
+    const e = (i) => {
+      const { name: s, keyframes: r } = i.keyframeEffect;
+      return [{ ...i, name: s, keyframes: r }];
+    };
+    return { web: e, style: e, getNames: (i) => {
+      const { effectId: s } = i, { name: r } = i.keyframeEffect, u = r || s;
+      return u ? [u] : [];
+    } };
+  } else if (t.customEffect)
+    return (e) => [{ ...e, keyframes: [] }];
+  return null;
+}
+function H(t, e, n) {
+  return t.map((i, s) => {
+    const r = {
+      fill: i.fill,
+      easing: gt(i.easing),
+      iterations: i.iterations === 0 ? 1 / 0 : i.iterations || 1,
+      composite: i.composite,
+      direction: Tt(i)
+    };
+    return q(e) ? (r.duration = i.duration, r.delay = i.delay || 0) : window.ViewTimeline && e?.trigger === "view-progress" ? r.duration = "auto" : (r.duration = 99.99, r.delay = 0.01), {
+      effect: i,
+      options: r,
+      id: n && `${n}-${s + 1}`,
+      part: i.part
+    };
+  });
+}
+function q(t) {
+  return !t || t.trigger !== "pointer-move" && t.trigger !== "view-progress";
+}
+function N(t, e, n, i, s) {
+  if (t) {
+    if (q(i) && (e.duration = e.duration || 1, s?.reducedMotion))
+      if (e.iterations === 1 || e.iterations == null)
+        e = { ...e, duration: 1 };
+      else
+        return [];
+    let r;
+    return n instanceof HTMLElement && (r = { measure: L(n), mutate: j(n) }), t.web ? t.web(e, r, s) : t(e, r, s);
+  }
+  return [];
+}
+function V(t, e, n, i, s) {
+  const r = t instanceof HTMLElement ? t : w(t, s);
+  if (n?.trigger === "pointer-move" && !e.keyframeEffect) {
+    let f = e;
+    e.customEffect && (f = {
+      ...e,
+      namedEffect: { id: "", type: "CustomMouse" }
+    });
+    const p = I(
+      f
+    ), d = N(
+      p,
+      e,
+      r,
+      n,
+      i
+    );
+    return typeof d != "function" ? null : d(r);
+  }
+  const u = I(e), a = N(
+    u,
+    e,
+    r,
+    n,
+    i
+  );
+  if (!a || a.length === 0)
+    return null;
+  const l = H(a, n, e.effectId);
+  let m;
+  const o = n?.trigger === "view-progress";
+  o && window.ViewTimeline && (m = new ViewTimeline({
+    subject: n.element || w(n.componentId)
+  }));
+  const c = l.map(({ effect: f, options: p, id: d, part: h }) => {
+    const v = h ? kt(r, h) : r, g = new KeyframeEffect(v || null, [], p);
+    E.mutate(() => {
+      "timing" in f && g.updateTiming(f.timing), g.setKeyframes(f.keyframes);
+    });
+    const b = o && m ? { timeline: m } : {}, y = typeof f.customEffect == "function" ? new _t(
+      f.customEffect,
+      v || null,
+      p,
+      b
+    ) : new Animation(g, b.timeline);
+    if (o)
+      if (m)
+        E.mutate(() => {
+          const { start: _, end: k } = G(f);
+          y.rangeStart = _, y.rangeEnd = k, y.play();
+        });
+      else {
+        const { startOffset: _, endOffset: k } = e;
+        E.mutate(() => {
+          const S = f.startOffset || _, P = f.endOffset || k;
+          Object.assign(y, {
+            start: {
+              name: S.name,
+              offset: S.offset?.value,
+              add: f.startOffsetAdd
+            },
+            end: {
+              name: P.name,
+              offset: P.offset?.value,
+              add: f.endOffsetAdd
+            }
+          });
+        });
+      }
+    return d && (y.id = d), y;
+  });
+  return new O(c, {
+    ...e,
+    trigger: { ...n || {} },
+    // make sure the group is ready after all animation targets are measured and mutated
+    measured: new Promise((f) => E.mutate(f))
+  });
+}
+function $t(t, e) {
+  return t ? `#${t}${e ? `[data-motion-part~="${e}"]` : ""}` : "";
+}
+function qt(t, e) {
+  const { duration: n, delay: i, iterations: s = 1, fill: r, easing: u = "linear", direction: a } = t.options, l = t.effect.name, m = n === "auto";
+  return `${l} ${m ? "auto" : `${n}ms`}${m ? " " : ` ${i || 1}ms `}${u}${r && r !== "none" ? ` ${r}` : ""} ${!s || s === 1 / 0 ? "infinite" : s}${a === "normal" ? "" : ` ${a}`} ${e ? "" : "paused"}`;
+}
+function St(t, e, n) {
+  return t?.style ? (q(n) && (e.duration = e.duration || 1), t.style(e)) : [];
+}
+function Dt(t, e, n) {
+  const i = I(e), s = St(i, e), r = H(s, n, e.effectId), u = n?.trigger === "view-progress";
+  return r.map((a, l) => {
+    const { start: m, end: o } = u ? G(a.effect) : {};
+    return {
+      target: $t(t, a.part),
+      animation: qt(a, u),
+      composition: a.options.composite,
+      custom: a.effect.custom,
+      name: a.effect.name,
+      keyframes: a.effect.keyframes,
+      id: a.id && `${a.id}-${l + 1}`,
+      animationTimeline: u ? `--${n?.id}` : "",
+      animationRange: m || o ? `${m} ${o}` : ""
+    };
+  });
+}
+function Pt(t, e, n) {
+  const i = I(e), s = t instanceof HTMLElement ? t : w(t);
+  if (i && i.prepare && s) {
+    const r = { measure: L(s), mutate: j(s) };
+    i.prepare(e, r);
+  }
+  n && E.mutate(n);
+}
+function zt(t, e) {
+  const n = I(e);
+  if (!n)
+    return null;
+  if (!n.style)
+    return e.effectId && t ? Ft(t, e.effectId) : null;
+  const i = n.getNames(e), r = (typeof t == "string" ? w(t) : t)?.getAnimations(), u = r?.map((l) => l.animationName) || [], a = [];
+  return i.forEach((l) => {
+    u.includes(l) && a.push(
+      r?.find((m) => m.animationName === l)
+    );
+  }), a?.length ? new O(a) : null;
+}
+function Ft(t, e) {
+  const i = (typeof t == "string" ? w(t) : t)?.getAnimations().filter((s) => {
+    const r = s.id || s.animationName;
+    return r ? r.startsWith(e) : !0;
+  });
+  return i?.length ? new O(i) : null;
+}
+function Rt(t, e, n, i = {}) {
+  const { disabled: s, allowActiveEvent: r, ...u } = i, a = V(t, e, n, u);
+  if (!a)
+    return null;
+  let l = {};
+  if (n.trigger === "view-progress" && !window.ViewTimeline) {
+    const m = n.element || w(n.componentId), { ready: o } = a;
+    return a.animations.map((c) => ({
+      /* we use getters for start and end in order to access the animation's start and end
+         only when initializing the scrub scene rather than immediately */
+      get start() {
+        return c.start;
+      },
+      get end() {
+        return c.end;
+      },
+      viewSource: m,
+      ready: o,
+      getProgress() {
+        return a.getProgress();
+      },
+      effect(f, p) {
+        const { activeDuration: d } = c.effect.getComputedTiming(), { delay: h } = c.effect.getTiming();
+        c.currentTime = ((h || 0) + (d || 0)) * p;
+      },
+      disabled: s,
+      destroy() {
+        c.cancel();
+      }
+    }));
+  } else if (n.trigger === "pointer-move") {
+    const m = e, { centeredToTarget: o, transitionDuration: c, transitionEasing: f } = m, p = n.axis;
+    if (m.keyframeEffect) {
+      const d = a;
+      return d.animations?.length === 0 ? null : {
+        target: void 0,
+        centeredToTarget: o,
+        ready: d.ready,
+        _currentProgress: 0,
+        getProgress() {
+          return this._currentProgress;
+        },
+        effect(v, g) {
+          const b = p === "x" ? g.x : g.y;
+          this._currentProgress = b, d.progress(b);
+        },
+        disabled: s ?? !1,
+        destroy() {
+          d.cancel();
+        }
+      };
+    }
+    l = {
+      centeredToTarget: o,
+      allowActiveEvent: r
+    }, e.customEffect && c && (l.transitionDuration = c, l.transitionEasing = R(f)), l.target = a.target;
+  }
+  return {
+    ...l,
+    getProgress() {
+      return a.getProgress();
+    },
+    effect(m, o, c, f) {
+      a.progress(
+        c ? {
+          // @ts-expect-error spread error on p
+          ...o,
+          v: c,
+          active: f
+        } : o
+      );
+    },
+    disabled: s,
+    destroy() {
+      a.cancel();
+    }
+  };
+}
+function Ct(t, e, n, i = !1) {
+  const s = zt(t, e);
+  return s ? (s.ready = new Promise((r) => {
+    Pt(t, e, r);
+  }), s) : V(t, e, n, { reducedMotion: i });
+}
+function xt(t) {
+  return t === null ? [null] : typeof t == "string" ? Array.from(document.querySelectorAll(t)) : Array.isArray(t) ? t : [t];
+}
+function Mt(t, e) {
+  const n = [];
+  for (const { target: i, options: s } of t) {
+    const r = xt(i);
+    for (const u of r) {
+      const a = Ct(
+        u,
+        s,
+        void 0,
+        e?.reducedMotion
+      );
+      a instanceof O && n.push(a);
+    }
+  }
+  return n;
+}
+function Gt(t, e, n) {
+  const i = Mt(e, n);
+  return new Et(i, t);
+}
+export {
+  mt as backIn,
+  ht as backInOut,
+  dt as backOut,
+  ut as circIn,
+  lt as circInOut,
+  ft as circOut,
+  Mt as createAnimationGroups,
+  F as cssEasings,
+  Y as cubicIn,
+  Z as cubicInOut,
+  Q as cubicOut,
+  ot as expoIn,
+  ct as expoInOut,
+  at as expoOut,
+  Ct as getAnimation,
+  Dt as getCSSAnimation,
+  pt as getCssUnits,
+  gt as getEasing,
+  Ft as getElementAnimation,
+  zt as getElementCSSAnimation,
+  R as getJsEasing,
+  Rt as getScrubScene,
+  Gt as getSequence,
+  V as getWebAnimation,
+  z as jsEasings,
+  D as linear,
+  Pt as prepareAnimation,
+  X as quadIn,
+  U as quadInOut,
+  J as quadOut,
+  tt as quartIn,
+  nt as quartInOut,
+  et as quartOut,
+  it as quintIn,
+  rt as quintInOut,
+  st as quintOut,
+  Nt as registerEffects,
+  W as sineIn,
+  K as sineInOut,
+  B as sineOut
+};
+//# sourceMappingURL=motion.js.map