@cliquify.me/animations 10.0.0 → 10.0.2

package/dist/index.es.js

@@ -1,7 +1,7 @@
-import { jsx as j, Fragment as k } from "react/jsx-runtime";
-import H, { useMemo as st } from "react";
-import { interpolate as U, Easing as X } from "remotion";
-const nt = () => ({
+import { jsx as H, Fragment as vt, jsxs as Vt } from "react/jsx-runtime";
+import q, { useMemo as jt } from "react";
+import { interpolate as G, Easing as E } from "remotion";
+const Ht = () => ({
   scale: (t) => ({ transform: `scale(${t})` }),
   growIn: (t) => ({ transform: `scale(${t})` }),
   shrinkIn: (t) => ({ transform: `scale(${t})` }),
@@ -93,331 +93,331 @@ const nt = () => ({
     borderRadius: `${t}px`,
     overflow: "hidden"
   })
-}), tt = (t, l = 0) => {
-  const o = [], s = t / 5;
-  for (let a = 0; a < 6; a += 1)
-    o.push(a * s + l);
-  return o;
-}, at = (t, l, o, s = !1) => {
-  const { from: a, to: e, ease: h } = l, u = l.durationInFrames || 30, c = Number(a), n = Number(e), r = Math.max(1, Number(u));
-  if (isNaN(c) || isNaN(n))
+}), Xt = (t, d = 0) => {
+  const n = [], l = t / 5;
+  for (let i = 0; i < 6; i += 1)
+    n.push(i * l + d);
+  return n;
+}, Tt = (t, d, n, l = !1) => {
+  const { from: i, to: s, ease: b } = d, h = d.durationInFrames || 30, f = Number(i), o = Number(s), r = Math.max(1, Number(h));
+  if (isNaN(f) || isNaN(o))
     return console.error("Invalid animation values:", {
-      from: a,
-      to: e,
-      animationDurationInFrames: u,
-      property: l.property
-    }), c;
-  u === void 0 && console.warn(
-    `durationInFrames is undefined for animation: ${l.property}. Using 1 frame as default.`
+      from: i,
+      to: s,
+      animationDurationInFrames: h,
+      property: d.property
+    }), f;
+  h === void 0 && console.warn(
+    `durationInFrames is undefined for animation: ${d.property}. Using 1 frame as default.`
   );
-  const i = l.delay || 0;
-  if (l.property === "hide-show" || l.property === "hide" || l.property === "show")
-    return t < i ? c : n;
-  let g;
-  if (l.property === "moveScaleIn" ? g = s ? [
-    o - r - i,
-    o - r * 0.5 - i
+  const c = d.delay || 0;
+  if (d.property === "hide-show" || d.property === "hide" || d.property === "show")
+    return t < c ? f : o;
+  let $;
+  if (d.property === "moveScaleIn" ? $ = l ? [
+    n - r - c,
+    n - r * 0.5 - c
   ] : [
-    i + r * 0.5,
-    i + r
-  ] : l.property === "moveTranslateY" ? g = s ? [
-    o - r * 0.5 - i,
-    o - i
+    c + r * 0.5,
+    c + r
+  ] : d.property === "moveTranslateY" ? $ = l ? [
+    n - r * 0.5 - c,
+    n - c
   ] : [
-    i,
-    i + r * 0.5
-  ] : g = s ? [
-    o - r - i,
-    o - i
+    c,
+    c + r * 0.5
+  ] : $ = l ? [
+    n - r - c,
+    n - c
   ] : [
-    i,
-    i + r
-  ], l.property.includes("shake")) {
-    const N = s ? tt(
+    c,
+    c + r
+  ], d.property.includes("shake")) {
+    const v = l ? Xt(
       r,
-      o - r - i
-    ) : tt(r, i);
-    return U(
+      n - r - c
+    ) : Xt(r, c);
+    return G(
       t,
-      N,
-      [0, c, n, c, n, 0],
+      v,
+      [0, f, o, f, o, 0],
       {
         extrapolateLeft: "clamp",
         extrapolateRight: "clamp",
-        easing: h
+        easing: b
       }
     );
   }
-  return U(t, g, [c, n], {
+  return G(t, $, [f, o], {
     extrapolateLeft: "clamp",
     extrapolateRight: "clamp",
-    easing: h
+    easing: b
   });
-}, z = (t) => {
+}, J = (t) => {
   if (t == null) return 0;
   if (typeof t == "number")
     return Number.isNaN(t) ? 0 : t;
   if (typeof t == "object") {
     if (t.rotate !== void 0 && t.rotate !== null) {
-      const a = parseFloat(String(t.rotate));
-      if (!Number.isNaN(a)) return a;
+      const i = parseFloat(String(t.rotate));
+      if (!Number.isNaN(i)) return i;
     }
     if (t.rotation !== void 0 && t.rotation !== null) {
-      const a = parseFloat(String(t.rotation));
-      if (!Number.isNaN(a)) return a;
+      const i = parseFloat(String(t.rotation));
+      if (!Number.isNaN(i)) return i;
     }
-    return t.transform ? z(t.transform) : 0;
+    return t.transform ? J(t.transform) : 0;
   }
-  const l = String(t), o = /rotate\((-?[\d.]+)deg\)/.exec(l);
-  if (o)
-    return parseFloat(o[1]) || 0;
-  const s = /matrix\(([^)]+)\)/.exec(l);
-  if (s) {
-    const a = s[1].split(",").map((e) => parseFloat(e.trim()));
-    if (a.length >= 4) {
-      const [e, h] = a;
-      return Math.atan2(h, e) * (180 / Math.PI);
+  const d = String(t), n = /rotate\((-?[\d.]+)deg\)/.exec(d);
+  if (n)
+    return parseFloat(n[1]) || 0;
+  const l = /matrix\(([^)]+)\)/.exec(d);
+  if (l) {
+    const i = l[1].split(",").map((s) => parseFloat(s.trim()));
+    if (i.length >= 4) {
+      const [s, b] = i;
+      return Math.atan2(b, s) * (180 / Math.PI);
     }
   }
   return 0;
-}, et = (t, l, o, s, a) => {
-  var c, n, r, i, g;
-  const { property: e } = t;
-  if (e === "move") {
-    const N = Number(((c = t.details) == null ? void 0 : c.fromX) ?? t.from ?? 0), Y = Number(((n = t.details) == null ? void 0 : n.toX) ?? t.to ?? 0), A = Number(((r = t.details) == null ? void 0 : r.fromY) ?? 0), R = Number(((i = t.details) == null ? void 0 : i.toY) ?? 0), C = Number(((g = t.details) == null ? void 0 : g.scale) || 1) || 1;
-    let I = a;
-    if (I == null || Number.isNaN(I)) {
-      const m = t.details;
-      I = z((m == null ? void 0 : m.rotate) ?? (m == null ? void 0 : m.rotation) ?? (m == null ? void 0 : m.transform));
+}, It = (t, d, n, l, i) => {
+  var f, o, r, c, $;
+  const { property: s } = t;
+  if (s === "move") {
+    const v = Number(((f = t.details) == null ? void 0 : f.fromX) ?? t.from ?? 0), B = Number(((o = t.details) == null ? void 0 : o.toX) ?? t.to ?? 0), T = Number(((r = t.details) == null ? void 0 : r.fromY) ?? 0), P = Number(((c = t.details) == null ? void 0 : c.toY) ?? 0), F = Number((($ = t.details) == null ? void 0 : $.scale) || 1) || 1;
+    let V = i;
+    if (V == null || Number.isNaN(V)) {
+      const p = t.details;
+      V = J((p == null ? void 0 : p.rotate) ?? (p == null ? void 0 : p.rotation) ?? (p == null ? void 0 : p.transform));
     }
-    const f = t.delay || 0, w = t.durationInFrames || 30, P = s ? [o - w - f, o - f] : [f, f + w], E = U(l, P, [N, Y], {
+    const e = t.delay || 0, x = t.durationInFrames || 30, C = l ? [n - x - e, n - e] : [e, e + x], O = G(d, C, [v, B], {
       extrapolateLeft: "clamp",
       extrapolateRight: "clamp",
       easing: t.ease
-    }), x = U(l, P, [A, R], {
+    }), S = G(d, C, [T, P], {
       extrapolateLeft: "clamp",
       extrapolateRight: "clamp",
       easing: t.ease
-    }), v = (I || 0) * Math.PI / 180, S = Math.cos(v), d = Math.sin(v), p = E * S + x * d, y = -E * d + x * S, V = p / C, B = y / C;
+    }), w = (V || 0) * Math.PI / 180, Y = Math.cos(w), a = Math.sin(w), g = O * Y + S * a, m = -O * a + S * Y, j = g / F, R = m / F;
     return {
-      transform: `translateX(${V}px) translateY(${B}px)`
+      transform: `translateX(${j}px) translateY(${R}px)`
     };
   }
-  const h = at(l, t, o, s), u = nt();
-  return (u[e] || u.default)(h);
-}, L = (t, l, o, s = !1, a = !1, e) => H.useMemo(() => {
+  const b = Tt(d, t, n, l), h = Ht();
+  return (h[s] || h.default)(b);
+}, M = (t, d, n, l = !1, i = !1, s) => q.useMemo(() => {
   if (t.length === 0) return {};
-  const h = t.filter(
-    (u) => u.from !== void 0 && u.to !== void 0
+  const b = t.filter(
+    (h) => h.from !== void 0 && h.to !== void 0
   );
-  if (h.length !== t.length && console.error("Some animations are invalid and will be ignored"), a) {
-    const u = [];
-    return h.reverse().forEach((n) => {
-      const r = et(
-        n,
+  if (b.length !== t.length && console.error("Some animations are invalid and will be ignored"), i) {
+    const h = [];
+    return b.reverse().forEach((o) => {
+      const r = It(
         o,
-        l,
+        n,
+        d,
         !1,
-        e
+        s
       );
-      u.push(r);
-    }), u.reduce(
-      (n, r) => (Object.keys(r).forEach((i) => {
-        i === "transform" || i === "filter" ? n[i] = n[i] ? `${n[i]} ${r[i]}` : r[i] : n[i] = r[i];
-      }), n),
+      h.push(r);
+    }), h.reduce(
+      (o, r) => (Object.keys(r).forEach((c) => {
+        c === "transform" || c === "filter" ? o[c] = o[c] ? `${o[c]} ${r[c]}` : r[c] : o[c] = r[c];
+      }), o),
       {}
     );
   } else
-    return h.map((c) => et(c, o, l, s, e)).reduce(
-      (c, n) => (Object.keys(n).forEach((r) => {
-        r === "transform" || r === "filter" ? c[r] = c[r] ? `${c[r]} ${n[r]}` : n[r] : c[r] = n[r];
-      }), c),
+    return b.map((f) => It(f, n, d, l, s)).reduce(
+      (f, o) => (Object.keys(o).forEach((r) => {
+        r === "transform" || r === "filter" ? f[r] = f[r] ? `${f[r]} ${o[r]}` : o[r] : f[r] = o[r];
+      }), f),
       {}
     );
-}, [t, o, l, s, e]), T = (t) => t ? Array.isArray(t) ? t : [t] : [], pt = (...t) => {
-  const l = [];
-  return t.forEach((o) => {
-    Array.isArray(o) ? l.push(...o) : o && l.push(o);
-  }), l.filter((o) => o !== void 0).reduce((o, s) => o.find(
-    (e) => e.property === s.property
-  ) ? o.map(
-    (e) => e.property === s.property ? {
-      ...e,
-      from: Math.min(e.from, s.from),
-      to: Math.max(e.to, s.to),
+}, [t, n, d, l, s]), U = (t) => t ? Array.isArray(t) ? t : [t] : [], Dt = (...t) => {
+  const d = [];
+  return t.forEach((n) => {
+    Array.isArray(n) ? d.push(...n) : n && d.push(n);
+  }), d.filter((n) => n !== void 0).reduce((n, l) => n.find(
+    (s) => s.property === l.property
+  ) ? n.map(
+    (s) => s.property === l.property ? {
+      ...s,
+      from: Math.min(s.from, l.from),
+      to: Math.max(s.to, l.to),
       durationInFrames: Math.max(
-        e.durationInFrames,
-        s.durationInFrames
+        s.durationInFrames,
+        l.durationInFrames
       ),
-      delay: Math.min(e.delay || 0, s.delay || 0),
-      ease: (h) => (e.ease(h) + s.ease(h)) / 2
+      delay: Math.min(s.delay || 0, l.delay || 0),
+      ease: (b) => (s.ease(b) + l.ease(b)) / 2
       // Average the easing functions
-    } : e
-  ) : [...o, s], []);
-}, $t = ({
+    } : s
+  ) : [...n, l], []);
+}, Gt = ({
   animationIn: t,
-  animationOut: l,
-  durationInFrames: o,
-  children: s,
-  style: a = {},
-  frame: e,
-  isTransition: h = !1,
-  basicCharAnimationsIn: u = [],
-  basicCharAnimationsOut: c = []
+  animationOut: d,
+  durationInFrames: n,
+  children: l,
+  style: i = {},
+  frame: s,
+  isTransition: b = !1,
+  basicCharAnimationsIn: h = [],
+  basicCharAnimationsOut: f = []
 }) => {
-  const n = z(
-    (a == null ? void 0 : a.transform) || (a == null ? void 0 : a.rotate) || (a == null ? void 0 : a.rotation)
-  ), r = L(
-    T(t),
-    o,
-    e,
+  const o = J(
+    (i == null ? void 0 : i.transform) || (i == null ? void 0 : i.rotate) || (i == null ? void 0 : i.rotation)
+  ), r = M(
+    U(t),
+    n,
+    s,
     !1,
     !1,
-    n
-  ), i = L(
-    T(l),
-    o,
-    e,
+    o
+  ), c = M(
+    U(d),
+    n,
+    s,
     !0,
     !1,
-    n
-  ), g = L(
-    T(u),
-    o,
-    e,
+    o
+  ), $ = M(
+    U(h),
+    n,
+    s,
     !0,
     !1,
-    n
-  ), N = L(
-    T(c),
-    o,
-    e,
+    o
+  ), v = M(
+    U(f),
+    n,
+    s,
     !0,
     !1,
-    n
-  ), Y = H.useMemo(() => {
-    const x = Object.keys(r).length > 0, v = t == null ? void 0 : t.reduce(
-      (d, p) => Math.min(d, p.delay || 0),
+    o
+  ), B = q.useMemo(() => {
+    const S = Object.keys(r).length > 0, w = t == null ? void 0 : t.reduce(
+      (a, g) => Math.min(a, g.delay || 0),
       1 / 0
-    ), S = e - (v || 0);
-    return x && S < 0 ? { visibility: h ? "visible" : "hidden" } : r;
-  }, [r, e, t, h]), A = H.useMemo(() => {
-    if (e > o)
-      return { visibility: h ? "visible" : "hidden" };
-    const x = T(l);
-    if (!x || x.length === 0) return {};
-    let v = 0;
-    x.forEach((d) => {
-      const p = (d.durationInFrames || 0) + (d.delay || 0);
-      p > v && (v = p);
+    ), Y = s - (w || 0);
+    return S && Y < 0 ? { visibility: b ? "visible" : "hidden" } : r;
+  }, [r, s, t, b]), T = q.useMemo(() => {
+    if (s > n)
+      return { visibility: b ? "visible" : "hidden" };
+    const S = U(d);
+    if (!S || S.length === 0) return {};
+    let w = 0;
+    S.forEach((a) => {
+      const g = (a.durationInFrames || 0) + (a.delay || 0);
+      g > w && (w = g);
     });
-    const S = Math.max(0, o - v);
-    return e < S ? {} : i;
-  }, [i, e, l, o, h]), R = H.useMemo(() => {
-    const x = {
-      ...Y
+    const Y = Math.max(0, n - w);
+    return s < Y ? {} : c;
+  }, [c, s, d, n, b]), P = q.useMemo(() => {
+    const S = {
+      ...B
     };
-    return Object.entries(A).forEach(([v, S]) => {
-      v === "transform" ? x[v] = `${x[v] || ""} ${S || ""}`.trim() : v in x && typeof x[v] == "number" && typeof S == "number" ? x[v] = x[v] * S : x[v] = S;
-    }), x;
-  }, [Y, A]), C = st(() => {
-    const x = R.transform || "", {
-      translateX: v,
-      translateY: S,
-      scale: d,
-      rotation: p,
-      rotateX: y,
-      rotateY: V,
-      rotateZ: B
-    } = lt(x);
-    return `${p} ${v} ${S} ${d} ${y} ${V} ${B}`.trim();
-  }, [R]), {
-    top: I,
-    left: f,
-    position: w,
-    transform: P,
-    ...E
-  } = a || {};
-  return /* @__PURE__ */ j(
+    return Object.entries(T).forEach(([w, Y]) => {
+      w === "transform" ? S[w] = `${S[w] || ""} ${Y || ""}`.trim() : w in S && typeof S[w] == "number" && typeof Y == "number" ? S[w] = S[w] * Y : S[w] = Y;
+    }), S;
+  }, [B, T]), F = jt(() => {
+    const S = P.transform || "", {
+      translateX: w,
+      translateY: Y,
+      scale: a,
+      rotation: g,
+      rotateX: m,
+      rotateY: j,
+      rotateZ: R
+    } = Wt(S);
+    return `${g} ${w} ${Y} ${a} ${m} ${j} ${R}`.trim();
+  }, [P]), {
+    top: V,
+    left: e,
+    position: x,
+    transform: C,
+    ...O
+  } = i || {};
+  return /* @__PURE__ */ H(
     "div",
     {
       style: {
         width: "100%",
         height: "100%",
-        overflow: R.overflow || g.overflow || N.overflow || "visible",
+        overflow: P.overflow || $.overflow || v.overflow || "visible",
         pointerEvents: "none"
       },
-      children: /* @__PURE__ */ j(
+      children: /* @__PURE__ */ H(
         "div",
         {
           style: {
             width: "100%",
             height: "100%",
-            ...E,
-            ...R,
+            ...O,
+            ...P,
             overflow: "visible",
-            transform: C,
+            transform: F,
             pointerEvents: "none",
-            background: Object.keys(R).length === 0 ? "transparent" : R.backgroundColor
+            background: Object.keys(P).length === 0 ? "transparent" : P.backgroundColor
           },
-          children: s
+          children: l
         }
       )
     }
   );
-}, lt = (t) => {
-  let l = "", o = "", s = "scale(1)", a = "", e = "", h = "", u = "";
-  const c = t.match(/translateX\([^)]+\)/g);
-  c && (l = c[c.length - 1]);
-  const n = t.match(/translateY\([^)]+\)/g);
-  n && (o = n[n.length - 1]);
+}, Wt = (t) => {
+  let d = "", n = "", l = "scale(1)", i = "", s = "", b = "", h = "";
+  const f = t.match(/translateX\([^)]+\)/g);
+  f && (d = f[f.length - 1]);
+  const o = t.match(/translateY\([^)]+\)/g);
+  o && (n = o[o.length - 1]);
   const r = t.match(/scale\([^)]+\)/g);
-  r && (s = r[r.length - 1]);
-  const i = t.match(/rotate\([^)]+\)/g);
-  i && (a = i[i.length - 1]);
-  const g = t.match(/rotateX\([^)]+\)/g);
-  g && (e = g[g.length - 1]);
-  const N = t.match(/rotateY\([^)]+\)/g);
-  N && (h = N[N.length - 1]);
-  const Y = t.match(/rotateZ\([^)]+\)/g);
-  return Y && (u = Y[Y.length - 1]), { translateX: l, translateY: o, scale: s, rotation: a, rotateX: e, rotateY: h, rotateZ: u };
-}, gt = ({
+  r && (l = r[r.length - 1]);
+  const c = t.match(/rotate\([^)]+\)/g);
+  c && (i = c[c.length - 1]);
+  const $ = t.match(/rotateX\([^)]+\)/g);
+  $ && (s = $[$.length - 1]);
+  const v = t.match(/rotateY\([^)]+\)/g);
+  v && (b = v[v.length - 1]);
+  const B = t.match(/rotateZ\([^)]+\)/g);
+  return B && (h = B[B.length - 1]), { translateX: d, translateY: n, scale: l, rotation: i, rotateX: s, rotateY: b, rotateZ: h };
+}, Jt = ({
   animationTimed: t,
-  durationInFrames: l,
-  children: o,
-  style: s = {},
-  frame: a
+  durationInFrames: d,
+  children: n,
+  style: l = {},
+  frame: i
 }) => {
-  const e = z(
-    (s == null ? void 0 : s.transform) || (s == null ? void 0 : s.rotate) || (s == null ? void 0 : s.rotation)
-  ), h = L(
-    T(t),
-    l,
-    a,
+  const s = J(
+    (l == null ? void 0 : l.transform) || (l == null ? void 0 : l.rotate) || (l == null ? void 0 : l.rotation)
+  ), b = M(
+    U(t),
+    d,
+    i,
     !1,
     !0,
-    e
-  ), u = H.useMemo(() => ({
-    ...h
-  }), [h]), c = !!u.borderRadius;
-  return /* @__PURE__ */ j(
+    s
+  ), h = q.useMemo(() => ({
+    ...b
+  }), [b]), f = !!h.borderRadius;
+  return /* @__PURE__ */ H(
     "div",
     {
       style: {
-        overflow: c ? "hidden" : u.overflow || "visible",
-        borderRadius: u.borderRadius,
+        overflow: f ? "hidden" : h.overflow || "visible",
+        borderRadius: h.borderRadius,
         pointerEvents: "none",
-        height: s.height || "100%",
-        width: s.width || "100%",
-        ...u,
-        ...c ? { overflow: "hidden" } : {}
+        height: l.height || "100%",
+        width: l.width || "100%",
+        ...h,
+        ...f ? { overflow: "hidden" } : {}
       },
-      children: /* @__PURE__ */ j(
+      children: /* @__PURE__ */ H(
         "div",
         {
           style: {
-            overflow: c ? "hidden" : "visible",
-            borderRadius: u.borderRadius,
+            overflow: f ? "hidden" : "visible",
+            borderRadius: h.borderRadius,
             pointerEvents: "none",
             height: "100%",
             width: "100%",
@@ -425,181 +425,234 @@ const nt = () => ({
             alignItems: "center",
             justifyContent: "center"
           },
-          children: o
+          children: n
         }
       )
     }
   );
-}, it = (t) => {
+}, Lt = (t) => {
   if (typeof (t == null ? void 0 : t.ease) == "function")
     return t.ease;
   switch (t == null ? void 0 : t.easing) {
     case "ease-in":
     case "accelerate":
-      return X.in(X.cubic);
+      return E.in(E.cubic);
     case "ease-out":
     case "smooth":
     case "slowDown":
-      return X.out(X.cubic);
+      return E.out(E.cubic);
     case "ease-in-out":
     case "natural":
     case "swing":
-      return X.inOut(X.cubic);
+      return E.inOut(E.cubic);
     case "bounce":
-      return X.bounce;
+      return E.bounce;
     case "elastic":
-      return X.elastic(1);
+      return E.elastic(1);
     case "overshoot":
     case "impulse":
-      return X.out(X.back(1.7));
+      return E.out(E.back(1.7));
     case "none":
     case "linear":
     default:
-      return X.linear;
+      return E.linear;
   }
-}, ct = (t, l) => {
-  const o = l * Math.PI / 180, s = Math.cos(o), a = Math.sin(o), e = t / 100 * 50, h = 50, u = 50, c = 200, n = s, r = a, i = -a, g = s;
+}, Zt = (t, d) => {
+  const n = d * Math.PI / 180, l = Math.cos(n), i = Math.sin(n), s = t / 100 * 50, b = 50, h = 50, f = 200, o = l, r = i, c = -i, $ = l;
   return `polygon(${[
     [
-      h - n * c - i * e,
-      u - r * c - g * e
+      b - o * f - c * s,
+      h - r * f - $ * s
     ],
     [
-      h + n * c - i * e,
-      u + r * c - g * e
+      b + o * f - c * s,
+      h + r * f - $ * s
     ],
     [
-      h + n * c + i * e,
-      u + r * c + g * e
+      b + o * f + c * s,
+      h + r * f + $ * s
     ],
     [
-      h - n * c + i * e,
-      u - r * c + g * e
+      b - o * f + c * s,
+      h - r * f + $ * s
     ]
-  ].map(([Y, A]) => `${Y}% ${A}%`).join(", ")})`;
-}, ft = ({
+  ].map(([B, T]) => `${B}% ${T}%`).join(", ")})`;
+}, zt = ({
   children: t,
-  currentWidth: l,
-  currentHeight: o,
-  frame: s,
-  item: a,
-  keyframeAnimations: e,
-  durationInFrames: h
+  currentWidth: d,
+  currentHeight: n,
+  frame: l,
+  item: i,
+  keyframeAnimations: s,
+  durationInFrames: b
 }) => {
-  var q, G, J, K, Q, D;
-  if (!e || !Array.isArray(e) || e.length === 0)
-    return /* @__PURE__ */ j(k, { children: t });
-  const u = ($) => {
-    var b, F;
-    return !!((b = $ == null ? void 0 : $.property) != null && b.includes("maskReveal") || (F = $ == null ? void 0 : $.id) != null && F.includes("maskReveal"));
-  }, c = ($) => {
-    var b, F;
-    return !!(($ == null ? void 0 : $.type) === "exit" || (b = $ == null ? void 0 : $.property) != null && b.includes("Out") || (F = $ == null ? void 0 : $.id) != null && F.includes("Out"));
-  }, n = e.find(
-    ($) => u($) && !c($)
-  ), r = e.find(
-    ($) => u($) && c($)
+  var et, rt, ot, st, nt, lt, at, it, ct, dt, ft, ut, pt, ht, gt, bt, $t, xt, St, wt, mt, yt, Nt, Yt;
+  if (!s || !Array.isArray(s) || s.length === 0)
+    return /* @__PURE__ */ H(vt, { children: t });
+  const h = (u) => {
+    var y, I;
+    return !!((y = u == null ? void 0 : u.property) != null && y.includes("maskReveal") || (I = u == null ? void 0 : u.id) != null && I.includes("maskReveal"));
+  }, f = (u) => {
+    var y, I;
+    return !!((u == null ? void 0 : u.type) === "exit" || (y = u == null ? void 0 : u.property) != null && y.includes("Out") || (I = u == null ? void 0 : u.id) != null && I.includes("Out"));
+  }, o = s.find(
+    (u) => h(u) && !f(u)
+  ), r = s.find(
+    (u) => h(u) && f(u)
   );
-  if (!n && !r)
-    return /* @__PURE__ */ j(k, { children: t });
-  const i = Math.max(1, h || 300), g = n ? Math.max(1, Number(n.durationInFrames || 30)) : 30, N = n ? Math.max(0, Number(n.delay || 0)) : 0, Y = r ? Math.max(1, Number(r.durationInFrames || 30)) : 30, A = r ? Math.max(0, Number(r.delay || 0)) : 0, R = r ? Math.max(0, i - Y - A) : Number.POSITIVE_INFINITY;
-  let C = !1, I = !1, f = null, w = !1, P = 30, E = 0;
-  r && s >= R ? (f = r, w = !0, P = Y, E = s - R, E >= P - 1 && (C = !0)) : n ? s < N ? (C = !0, f = n, w = !1, P = g, E = 0) : s < N + g ? (f = n, w = !1, P = g, E = s - N) : (I = !0, f = null) : (I = !0, f = null);
-  const x = Math.max(0, E), v = P > 0 ? Math.min(Math.max(0, x / P), 1) : 1, S = f ? it(f) : X.linear, d = Math.max(
+  if (!o && !r)
+    return /* @__PURE__ */ H(vt, { children: t });
+  const c = Math.max(1, b || 300), $ = o ? Math.max(1, Number(o.durationInFrames || 30)) : 30, v = o ? Math.max(0, Number(o.delay || 0)) : 0, B = r ? Math.max(1, Number(r.durationInFrames || 30)) : 30, T = r ? Math.max(0, Number(r.delay || 0)) : 0, P = r ? Math.max(0, c - B - T) : Number.POSITIVE_INFINITY;
+  let F = !1, V = !1, e = null, x = !1, C = 30, O = 0;
+  if (r && (l >= P || !o)) {
+    e = r, x = !0, C = B;
+    const u = o || P < c ? P : 0;
+    O = l - u;
+    const y = String(r.property || r.id || ""), I = y.includes("Blur") || y.includes("Soft") || !!((et = r == null ? void 0 : r.details) != null && et.blurBottom) || !!((rt = r == null ? void 0 : r.details) != null && rt.softEdge);
+    O >= C - 1 && !I && (F = !0);
+  } else if (o)
+    if (l < v)
+      F = !0, e = o, x = !1, C = $, O = 0;
+    else if (l < v + $)
+      e = o, x = !1, C = $, O = l - v;
+    else {
+      const u = String(o.property || o.id || "");
+      u.includes("Blur") || u.includes("Soft") || !!((ot = o == null ? void 0 : o.details) != null && ot.blurBottom) || !!((st = o == null ? void 0 : o.details) != null && st.softEdge) ? (e = o, x = !1, C = $, O = $) : (V = !0, e = null);
+    }
+  else
+    V = !0, e = null;
+  const S = Math.max(0, O), w = C > 0 ? Math.min(Math.max(0, S / C), 1) : 1, Y = e ? Lt(e) : E.linear, a = Math.max(
     0,
-    Math.min(1, S(v))
+    Math.min(1, Y(w))
   );
-  let p, y = "", V = 1;
-  if (C)
-    p = "inset(100%)";
-  else if (I || !f)
-    p = void 0;
+  let g, m = "", j = 1;
+  const R = String(
+    (e == null ? void 0 : e.property) || (e == null ? void 0 : e.id) || ""
+  ), p = ((nt = e == null ? void 0 : e.details) == null ? void 0 : nt.direction) || "up";
+  if (F)
+    g = "inset(100%)";
+  else if (V || !e)
+    g = void 0;
   else {
-    const $ = String(
-      f.property || f.id || ""
-    ), b = ((q = f.details) == null ? void 0 : q.direction) || "up", F = $.includes("ShrinkScale"), _ = $.includes("CenterScale"), rt = $.includes("Slide") || $.includes("slide");
-    if (_) {
-      const M = Number(
-        ((G = f == null ? void 0 : f.details) == null ? void 0 : G.angle) ?? (f == null ? void 0 : f.angle) ?? 0
-      ), W = w ? 100 * (1 - d) : 100 * d;
-      p = ct(
-        W,
-        M
+    const u = R.includes("ShrinkScale"), y = R.includes("CenterScale"), I = R.includes("Slide") || R.includes("slide");
+    if (y) {
+      const N = Number(
+        ((lt = e == null ? void 0 : e.details) == null ? void 0 : lt.angle) ?? (e == null ? void 0 : e.angle) ?? 0
+      ), Z = x ? 100 * (1 - a) : 100 * a;
+      g = Zt(
+        Z,
+        N
       );
-    } else if (F) {
-      const M = Number(
-        ((J = f == null ? void 0 : f.details) == null ? void 0 : J.initialVisiblePercent) ?? (f == null ? void 0 : f.initialVisiblePercent) ?? 50
-      ), W = Math.max(
+    } else if (u) {
+      const N = Number(
+        ((at = e == null ? void 0 : e.details) == null ? void 0 : at.initialVisiblePercent) ?? (e == null ? void 0 : e.initialVisiblePercent) ?? 50
+      ), Z = Math.max(
         0,
-        Math.min(50, (100 - M) / 2)
-      ), Z = w ? W * d : W * (1 - d);
-      p = `inset(
-        ${Z}%
-        ${Z}%
-        ${Z}%
-        ${Z}%
+        Math.min(50, (100 - N) / 2)
+      ), z = x ? Z * a : Z * (1 - a);
+      g = `inset(
+        ${z}%
+        ${z}%
+        ${z}%
+        ${z}%
       )`;
-    } else if (rt)
-      p = "inset(0% 0% 0% 0%)", w ? b === "down" ? y = `translateY(${100 * d}%)` : b === "left" ? y = `translateX(${-100 * d}%)` : b === "right" ? y = `translateX(${100 * d}%)` : y = `translateY(${-100 * d}%)` : b === "down" ? y = `translateY(${-100 * (1 - d)}%)` : b === "left" ? y = `translateX(${100 * (1 - d)}%)` : b === "right" ? y = `translateX(${-100 * (1 - d)}%)` : y = `translateY(${100 * (1 - d)}%)`;
-    else if ($.includes("Center"))
-      p = `circle(${w ? 150 * (1 - d) : 150 * d}% at 50% 50%)`;
-    else if ($.includes("Corner")) {
-      const M = w ? d : 1 - d;
-      b === "down" ? p = `inset(0 ${100 * M}% ${100 * M}% 0)` : b === "up" ? p = `inset(${100 * M}% ${100 * M}% 0 0)` : b === "left" ? p = `inset(0 0 ${100 * M}% ${100 * M}%)` : b === "right" ? p = `inset(${100 * M}% 0 0 ${100 * M}%)` : p = `inset(0 ${100 * M}% ${100 * M}% 0)`;
+    } else if (I)
+      g = "inset(0% 0% 0% 0%)", x ? p === "down" ? m = `translateY(${100 * a}%)` : p === "left" ? m = `translateX(${-100 * a}%)` : p === "right" ? m = `translateX(${100 * a}%)` : m = `translateY(${-100 * a}%)` : p === "down" ? m = `translateY(${-100 * (1 - a)}%)` : p === "left" ? m = `translateX(${100 * (1 - a)}%)` : p === "right" ? m = `translateX(${-100 * (1 - a)}%)` : m = `translateY(${100 * (1 - a)}%)`;
+    else if (R.includes("Center"))
+      g = `circle(${x ? 150 * (1 - a) : 150 * a}% at 50% 50%)`;
+    else if (R.includes("Corner")) {
+      const N = x ? a : 1 - a;
+      p === "down" ? g = `inset(0 ${100 * N}% ${100 * N}% 0)` : p === "up" ? g = `inset(${100 * N}% ${100 * N}% 0 0)` : p === "left" ? g = `inset(0 0 ${100 * N}% ${100 * N}%)` : p === "right" ? g = `inset(${100 * N}% 0 0 ${100 * N}%)` : g = `inset(0 ${100 * N}% ${100 * N}% 0)`;
     } else
-      w ? b === "down" ? p = `inset(${100 * d}% 0 0 0)` : b === "left" ? p = `inset(0 0 0 ${100 * d}%)` : b === "right" ? p = `inset(0 ${100 * d}% 0 0)` : p = `inset(0 0 ${100 * d}% 0)` : b === "down" ? p = `inset(0 0 ${100 * (1 - d)}% 0)` : b === "left" ? p = `inset(0 0 0 ${100 * (1 - d)}%)` : b === "right" ? p = `inset(0 ${100 * (1 - d)}% 0 0)` : p = `inset(${100 * (1 - d)}% 0 0 0)`;
-    const ot = !!((K = f == null ? void 0 : f.details) != null && K.scale || f != null && f.scale);
-    _ || F ? ((Q = f == null ? void 0 : f.details) == null ? void 0 : Q.scale) === !1 ? V = 1 : V = w ? 1 + 0.5 * d : 1.5 - 0.5 * d : ot && (V = w ? 1 - 0.2 * d : 0.8 + 0.2 * d);
+      x ? p === "down" ? g = `inset(${100 * a}% 0 0 0)` : p === "left" ? g = `inset(0 0 0 ${100 * a}%)` : p === "right" ? g = `inset(0 ${100 * a}% 0 0)` : g = `inset(0 0 ${100 * a}% 0)` : p === "down" ? g = `inset(0 0 ${100 * (1 - a)}% 0)` : p === "left" ? g = `inset(0 0 0 ${100 * (1 - a)}%)` : p === "right" ? g = `inset(0 ${100 * (1 - a)}% 0 0)` : g = `inset(${100 * (1 - a)}% 0 0 0)`;
+    const Q = !!((it = e == null ? void 0 : e.details) != null && it.scale || e != null && e.scale);
+    y || u ? ((ct = e == null ? void 0 : e.details) == null ? void 0 : ct.scale) === !1 ? j = 1 : j = x ? 1 + 0.5 * a : 1.5 - 0.5 * a : Q && (j = x ? 1 - 0.2 * a : 0.8 + 0.2 * a);
+  }
+  const K = R.includes("Blur") || R.includes("Soft") || !!((dt = e == null ? void 0 : e.details) != null && dt.blurBottom) || !!((ft = e == null ? void 0 : e.details) != null && ft.softEdge);
+  let L;
+  if (K && !F && e) {
+    g = void 0;
+    const u = 30, y = ((ut = e == null ? void 0 : e.details) == null ? void 0 : ut.blurPosition) || "bottom";
+    x ? p === "up" ? m = `translateY(${u * a}%)` : p === "down" ? m = `translateY(${-u * a}%)` : p === "left" ? m = `translateX(${u * a}%)` : p === "right" && (m = `translateX(${-u * a}%)`) : p === "up" ? m = `translateY(${u * (1 - a)}%)` : p === "down" ? m = `translateY(${-u * (1 - a)}%)` : p === "left" ? m = `translateX(${u * (1 - a)}%)` : p === "right" && (m = `translateX(${-u * (1 - a)}%)`);
+    const I = typeof ((pt = e == null ? void 0 : e.details) == null ? void 0 : pt.blurHeight) == "number" ? e.details.blurHeight : parseInt(String(((ht = e == null ? void 0 : e.details) == null ? void 0 : ht.blurHeight) || "35"), 10) || 35, Q = x ? 100 : 0, N = x ? 0 : 100, Z = Number(((gt = e == null ? void 0 : e.details) == null ? void 0 : gt.initialOpacity) ?? Q) / 100, z = Number(((bt = e == null ? void 0 : e.details) == null ? void 0 : bt.finalOpacity) ?? N) / 100, Ot = Math.max(
+      0,
+      Math.min(1, Z + (z - Z) * a)
+    ), D = Math.max(0, 1 - Ot);
+    y === "bottom" ? L = `linear-gradient(to bottom, black 0%, black ${100 - I}%, rgba(0,0,0,${D}) 100%)` : y === "top" ? L = `linear-gradient(to top, black 0%, black ${100 - I}%, rgba(0,0,0,${D}) 100%)` : y === "right" ? L = `linear-gradient(to right, black 0%, black ${100 - I}%, rgba(0,0,0,${D}) 100%)` : y === "left" && (L = `linear-gradient(to left, black 0%, black ${100 - I}%, rgba(0,0,0,${D}) 100%)`);
   }
-  const B = [
-    y,
-    V !== 1 ? `scale(${V})` : ""
-  ].filter(Boolean).join(" ") || void 0, m = (D = a == null ? void 0 : a.details) == null ? void 0 : D.boxShadow, O = m && (m.x || m.y || m.blur) ? `drop-shadow(${m.x || 0}px ${m.y || 0}px ${m.blur || 0}px ${m.color || "#000000"})` : void 0;
-  return /* @__PURE__ */ j(
+  const Bt = [
+    m,
+    j !== 1 ? `scale(${j})` : ""
+  ].filter(Boolean).join(" ") || void 0, W = ($t = i == null ? void 0 : i.details) == null ? void 0 : $t.boxShadow, _ = W && (W.x || W.y || W.blur) ? `drop-shadow(${W.x || 0}px ${W.y || 0}px ${W.blur || 0}px ${W.color || "#000000"})` : void 0, A = Number(((xt = e == null ? void 0 : e.details) == null ? void 0 : xt.blurAmount) ?? 16), Pt = !!(K && (((St = e == null ? void 0 : e.details) == null ? void 0 : St.blurBottom) ?? !0)), X = ((wt = e == null ? void 0 : e.details) == null ? void 0 : wt.blurPosition) || "bottom", k = typeof ((mt = e == null ? void 0 : e.details) == null ? void 0 : mt.blurHeight) == "number" ? `${e.details.blurHeight}%` : ((yt = e == null ? void 0 : e.details) == null ? void 0 : yt.blurHeight) || "35%", Rt = x ? 100 : 0, Et = x ? 0 : 100, tt = Number(((Nt = e == null ? void 0 : e.details) == null ? void 0 : Nt.initialOpacity) ?? Rt) / 100, Ft = Number(((Yt = e == null ? void 0 : e.details) == null ? void 0 : Yt.finalOpacity) ?? Et) / 100, Ct = K && e ? Math.max(0, Math.min(1, tt + (Ft - tt) * a)) : 1;
+  return /* @__PURE__ */ H(
     "div",
     {
       style: {
-        width: l !== void 0 ? l : "100%",
-        height: o !== void 0 ? o : "100%",
+        width: d !== void 0 ? d : "100%",
+        height: n !== void 0 ? n : "100%",
         position: "relative",
-        visibility: C ? "hidden" : "visible",
-        filter: O,
-        WebkitFilter: O
+        visibility: F ? "hidden" : "visible"
       },
-      children: /* @__PURE__ */ j(
+      children: /* @__PURE__ */ Vt(
         "div",
         {
           style: {
             width: "100%",
             height: "100%",
             position: "relative",
-            clipPath: p || void 0,
-            WebkitClipPath: p || void 0,
-            overflow: p ? "hidden" : "visible"
+            clipPath: g || void 0,
+            WebkitClipPath: g || void 0,
+            maskImage: L || void 0,
+            WebkitMaskImage: L || void 0,
+            overflow: g || L ? "hidden" : "visible"
           },
-          children: /* @__PURE__ */ j(
-            "div",
-            {
-              style: {
-                width: "100%",
-                height: "100%",
-                transform: B,
-                transformOrigin: "center"
-              },
-              children: t
-            }
-          )
+          children: [
+            /* @__PURE__ */ H(
+              "div",
+              {
+                style: {
+                  width: "100%",
+                  height: "100%",
+                  transform: Bt,
+                  transformOrigin: "center",
+                  filter: _,
+                  WebkitFilter: _
+                },
+                children: t
+              }
+            ),
+            Pt && !F && /* @__PURE__ */ H(
+              "div",
+              {
+                style: {
+                  position: "absolute",
+                  top: X === "top" ? 0 : void 0,
+                  bottom: X === "bottom" ? 0 : void 0,
+                  left: 0,
+                  right: 0,
+                  width: X === "left" || X === "right" ? k : "100%",
+                  height: X === "top" || X === "bottom" ? k : "100%",
+                  pointerEvents: "none",
+                  opacity: Ct,
+                  backdropFilter: `blur(${A}px)`,
+                  WebkitBackdropFilter: `blur(${A}px)`,
+                  maskImage: X === "top" ? "linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : X === "left" ? "linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : X === "right" ? "linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : "linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)",
+                  WebkitMaskImage: X === "top" ? "linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : X === "left" ? "linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : X === "right" ? "linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)" : "linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)"
+                }
+              }
+            )
+          ]
         }
       )
     }
   );
-}, bt = ft;
+}, Kt = zt;
 export {
-  $t as BoxAnim,
-  gt as ContentAnim,
-  bt as MaskAnim,
-  pt as combine,
-  T as combineAnimations,
-  lt as extractTransformations,
-  L as useAnimation
+  Gt as BoxAnim,
+  Jt as ContentAnim,
+  Kt as MaskAnim,
+  Dt as combine,
+  U as combineAnimations,
+  Wt as extractTransformations,
+  M as useAnimation
 };

package/dist/index.umd.js

@@ -1,6 +1,6 @@
-(function(M,m){typeof exports=="object"&&typeof module<"u"?m(exports,require("react/jsx-runtime"),require("react"),require("remotion")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","remotion"],m):(M=typeof globalThis<"u"?globalThis:M||self,m(M.animations={},M.jsxRuntime,M.React,M.remotion))})(this,function(M,m,L,S){"use strict";const re=()=>({scale:e=>({transform:`scale(${e})`}),growIn:e=>({transform:`scale(${e})`}),shrinkIn:e=>({transform:`scale(${e})`}),shrinkOut:e=>({transform:`scale(${e})`}),opacity:e=>({opacity:e}),translateX:e=>({transform:`translateX(${e}%)`}),translateY:e=>({transform:`translateY(${e}%)`}),rotate:e=>({transform:`rotate(${e}deg)`}),spin:e=>({transform:`rotate(${e}deg)`}),spinIn:e=>({transform:`rotate(${e}deg)`}),twistIn:e=>({transform:`rotate(${e}deg)`}),twistOut:e=>({transform:`rotate(${e}deg)`}),moveScaleIn:e=>({transform:`scale(${e})`}),spinOut:e=>({transform:`rotate(${e}deg)`}),default:()=>({}),rotateY:e=>({transform:`rotateY(${e}deg)`}),rotateX:e=>({transform:`rotateX(${e}deg)`}),blur:e=>({filter:`blur(${e}px)`}),blurIn:e=>({filter:`blur(${e}px)`}),blurOut:e=>({filter:`blur(${e}px)`}),blurV2In:e=>({filter:`blur(${e}px)`}),blurSlide:e=>({filter:`blur(${e}px)`,transform:`translateY(${e*5}%)`}),blurSlideV2In:e=>({filter:`blur(${e}px)`}),brightness:e=>({filter:`brightness(${e}%)`}),contrast:e=>({filter:`contrast(${e}%)`}),grayscale:e=>({filter:`grayscale(${e}%)`}),hue:e=>({filter:`hue-rotate(${e}deg)`}),saturation:e=>({filter:`saturate(${e}%)`}),vignette:e=>({filter:`contrast(${100+e*20}%) brightness(${100-e*20}%)`}),noise:e=>({filter:`contrast(${100+e*40}%) brightness(${100+e*20}%)`}),pixelate:e=>({filter:`contrast(${100+e*2}%)`}),chromaticAberration:e=>({filter:`hue-rotate(${e*10}deg) contrast(110%)`}),lightLeak:e=>({filter:`brightness(${100+e*50}%) saturate(${100+e*30}%)`}),duotone:e=>({filter:`sepia(${e*100}%) hue-rotate(${e*180}deg)`}),shakeHorizontalIn:e=>({transform:`translateX(${e}px)`}),shakeVerticalIn:e=>({transform:`translateY(${e}px)`}),shakeHorizontalOut:e=>({transform:`translateX(${e}px)`}),shakeVerticalOut:e=>({transform:`translateY(${e}px)`}),maskUpIn:e=>({transform:`translateY(${e}px)`,overflow:"hidden"}),maskUpOut:e=>({transform:`translateY(${e}px)`,overflow:"hidden"}),maskDownIn:e=>({transform:`translateY(${e}px)`,overflow:"hidden"}),maskDownOut:e=>({transform:`translateY(${e}px)`,overflow:"hidden"}),moveTranslateY:e=>({transform:`translateY(${e}%)`}),"hide-show":e=>({opacity:e}),hide:e=>({opacity:e}),show:e=>({opacity:e}),borderRadius:e=>({borderRadius:`${e}px`,overflow:"hidden"}),"corner-radius":e=>({borderRadius:`${e}px`,overflow:"hidden"})}),z=(e,l=0)=>{const s=[],o=e/5;for(let a=0;a<6;a+=1)s.push(a*o+l);return s},se=(e,l,s,o=!1)=>{const{from:a,to:t,ease:h}=l,u=l.durationInFrames||30,c=Number(a),n=Number(t),r=Math.max(1,Number(u));if(isNaN(c)||isNaN(n))return console.error("Invalid animation values:",{from:a,to:t,animationDurationInFrames:u,property:l.property}),c;u===void 0&&console.warn(`durationInFrames is undefined for animation: ${l.property}. Using 1 frame as default.`);const i=l.delay||0;if(l.property==="hide-show"||l.property==="hide"||l.property==="show")return e<i?c:n;let $;if(l.property==="moveScaleIn"?$=o?[s-r-i,s-r*.5-i]:[i+r*.5,i+r]:l.property==="moveTranslateY"?$=o?[s-r*.5-i,s-i]:[i,i+r*.5]:$=o?[s-r-i,s-i]:[i,i+r],l.property.includes("shake")){const E=o?z(r,s-r-i):z(r,i);return S.interpolate(e,E,[0,c,n,c,n,0],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:h})}return S.interpolate(e,$,[c,n],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:h})},Z=e=>{if(e==null)return 0;if(typeof e=="number")return Number.isNaN(e)?0:e;if(typeof e=="object"){if(e.rotate!==void 0&&e.rotate!==null){const a=parseFloat(String(e.rotate));if(!Number.isNaN(a))return a}if(e.rotation!==void 0&&e.rotation!==null){const a=parseFloat(String(e.rotation));if(!Number.isNaN(a))return a}return e.transform?Z(e.transform):0}const l=String(e),s=/rotate\((-?[\d.]+)deg\)/.exec(l);if(s)return parseFloat(s[1])||0;const o=/matrix\(([^)]+)\)/.exec(l);if(o){const a=o[1].split(",").map(t=>parseFloat(t.trim()));if(a.length>=4){const[t,h]=a;return Math.atan2(h,t)*(180/Math.PI)}}return 0},O=(e,l,s,o,a)=>{var c,n,r,i,$;const{property:t}=e;if(t==="move"){const E=Number(((c=e.details)==null?void 0:c.fromX)??e.from??0),X=Number(((n=e.details)==null?void 0:n.toX)??e.to??0),F=Number(((r=e.details)==null?void 0:r.fromY)??0),P=Number(((i=e.details)==null?void 0:i.toY)??0),T=Number((($=e.details)==null?void 0:$.scale)||1)||1;let A=a;if(A==null||Number.isNaN(A)){const w=e.details;A=Z((w==null?void 0:w.rotate)??(w==null?void 0:w.rotation)??(w==null?void 0:w.transform))}const d=e.delay||0,N=e.durationInFrames||30,j=o?[s-N-d,s-d]:[d,d+N],C=S.interpolate(l,j,[E,X],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:e.ease}),x=S.interpolate(l,j,[F,P],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:e.ease}),v=(A||0)*Math.PI/180,y=Math.cos(v),f=Math.sin(v),p=C*y+x*f,I=-C*f+x*y,V=p/T,W=I/T;return{transform:`translateX(${V}px) translateY(${W}px)`}}const h=se(l,e,s,o),u=re();return(u[t]||u.default)(h)},H=(e,l,s,o=!1,a=!1,t)=>L.useMemo(()=>{if(e.length===0)return{};const h=e.filter(u=>u.from!==void 0&&u.to!==void 0);if(h.length!==e.length&&console.error("Some animations are invalid and will be ignored"),a){const u=[];return h.reverse().forEach(n=>{const r=O(n,s,l,!1,t);u.push(r)}),u.reduce((n,r)=>(Object.keys(r).forEach(i=>{i==="transform"||i==="filter"?n[i]=n[i]?`${n[i]} ${r[i]}`:r[i]:n[i]=r[i]}),n),{})}else return h.map(c=>O(c,s,l,o,t)).reduce((c,n)=>(Object.keys(n).forEach(r=>{r==="transform"||r==="filter"?c[r]=c[r]?`${c[r]} ${n[r]}`:n[r]:c[r]=n[r]}),c),{})},[e,s,l,o,t]),R=e=>e?Array.isArray(e)?e:[e]:[],oe=(...e)=>{const l=[];return e.forEach(s=>{Array.isArray(s)?l.push(...s):s&&l.push(s)}),l.filter(s=>s!==void 0).reduce((s,o)=>s.find(t=>t.property===o.property)?s.map(t=>t.property===o.property?{...t,from:Math.min(t.from,o.from),to:Math.max(t.to,o.to),durationInFrames:Math.max(t.durationInFrames,o.durationInFrames),delay:Math.min(t.delay||0,o.delay||0),ease:h=>(t.ease(h)+o.ease(h))/2}:t):[...s,o],[])},ne=({animationIn:e,animationOut:l,durationInFrames:s,children:o,style:a={},frame:t,isTransition:h=!1,basicCharAnimationsIn:u=[],basicCharAnimationsOut:c=[]})=>{const n=Z((a==null?void 0:a.transform)||(a==null?void 0:a.rotate)||(a==null?void 0:a.rotation)),r=H(R(e),s,t,!1,!1,n),i=H(R(l),s,t,!0,!1,n),$=H(R(u),s,t,!0,!1,n),E=H(R(c),s,t,!0,!1,n),X=L.useMemo(()=>{const x=Object.keys(r).length>0,v=e==null?void 0:e.reduce((f,p)=>Math.min(f,p.delay||0),1/0),y=t-(v||0);return x&&y<0?{visibility:h?"visible":"hidden"}:r},[r,t,e,h]),F=L.useMemo(()=>{if(t>s)return{visibility:h?"visible":"hidden"};const x=R(l);if(!x||x.length===0)return{};let v=0;x.forEach(f=>{const p=(f.durationInFrames||0)+(f.delay||0);p>v&&(v=p)});const y=Math.max(0,s-v);return t<y?{}:i},[i,t,l,s,h]),P=L.useMemo(()=>{const x={...X};return Object.entries(F).forEach(([v,y])=>{v==="transform"?x[v]=`${x[v]||""} ${y||""}`.trim():v in x&&typeof x[v]=="number"&&typeof y=="number"?x[v]=x[v]*y:x[v]=y}),x},[X,F]),T=L.useMemo(()=>{const x=P.transform||"",{translateX:v,translateY:y,scale:f,rotation:p,rotateX:I,rotateY:V,rotateZ:W}=G(x);return`${p} ${v} ${y} ${f} ${I} ${V} ${W}`.trim()},[P]),{top:A,left:d,position:N,transform:j,...C}=a||{};return m.jsx("div",{style:{width:"100%",height:"100%",overflow:P.overflow||$.overflow||E.overflow||"visible",pointerEvents:"none"},children:m.jsx("div",{style:{width:"100%",height:"100%",...C,...P,overflow:"visible",transform:T,pointerEvents:"none",background:Object.keys(P).length===0?"transparent":P.backgroundColor},children:o})})},G=e=>{let l="",s="",o="scale(1)",a="",t="",h="",u="";const c=e.match(/translateX\([^)]+\)/g);c&&(l=c[c.length-1]);const n=e.match(/translateY\([^)]+\)/g);n&&(s=n[n.length-1]);const r=e.match(/scale\([^)]+\)/g);r&&(o=r[r.length-1]);const i=e.match(/rotate\([^)]+\)/g);i&&(a=i[i.length-1]);const $=e.match(/rotateX\([^)]+\)/g);$&&(t=$[$.length-1]);const E=e.match(/rotateY\([^)]+\)/g);E&&(h=E[E.length-1]);const X=e.match(/rotateZ\([^)]+\)/g);return X&&(u=X[X.length-1]),{translateX:l,translateY:s,scale:o,rotation:a,rotateX:t,rotateY:h,rotateZ:u}},ae=({animationTimed:e,durationInFrames:l,children:s,style:o={},frame:a})=>{const t=Z((o==null?void 0:o.transform)||(o==null?void 0:o.rotate)||(o==null?void 0:o.rotation)),h=H(R(e),l,a,!1,!0,t),u=L.useMemo(()=>({...h}),[h]),c=!!u.borderRadius;return m.jsx("div",{style:{overflow:c?"hidden":u.overflow||"visible",borderRadius:u.borderRadius,pointerEvents:"none",height:o.height||"100%",width:o.width||"100%",...u,...c?{overflow:"hidden"}:{}},children:m.jsx("div",{style:{overflow:c?"hidden":"visible",borderRadius:u.borderRadius,pointerEvents:"none",height:"100%",width:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:s})})},le=e=>{if(typeof(e==null?void 0:e.ease)=="function")return e.ease;switch(e==null?void 0:e.easing){case"ease-in":case"accelerate":return S.Easing.in(S.Easing.cubic);case"ease-out":case"smooth":case"slowDown":return S.Easing.out(S.Easing.cubic);case"ease-in-out":case"natural":case"swing":return S.Easing.inOut(S.Easing.cubic);case"bounce":return S.Easing.bounce;case"elastic":return S.Easing.elastic(1);case"overshoot":case"impulse":return S.Easing.out(S.Easing.back(1.7));case"none":case"linear":default:return S.Easing.linear}},ie=(e,l)=>{const s=l*Math.PI/180,o=Math.cos(s),a=Math.sin(s),t=e/100*50,h=50,u=50,c=200,n=o,r=a,i=-a,$=o;return`polygon(${[[h-n*c-i*t,u-r*c-$*t],[h+n*c-i*t,u+r*c-$*t],[h+n*c+i*t,u+r*c+$*t],[h-n*c+i*t,u-r*c+$*t]].map(([X,F])=>`${X}% ${F}%`).join(", ")})`},ce=({children:e,currentWidth:l,currentHeight:s,frame:o,item:a,keyframeAnimations:t,durationInFrames:h})=>{var K,Q,D,_,k,ee;if(!t||!Array.isArray(t)||t.length===0)return m.jsx(m.Fragment,{children:e});const u=g=>{var b,B;return!!((b=g==null?void 0:g.property)!=null&&b.includes("maskReveal")||(B=g==null?void 0:g.id)!=null&&B.includes("maskReveal"))},c=g=>{var b,B;return!!((g==null?void 0:g.type)==="exit"||(b=g==null?void 0:g.property)!=null&&b.includes("Out")||(B=g==null?void 0:g.id)!=null&&B.includes("Out"))},n=t.find(g=>u(g)&&!c(g)),r=t.find(g=>u(g)&&c(g));if(!n&&!r)return m.jsx(m.Fragment,{children:e});const i=Math.max(1,h||300),$=n?Math.max(1,Number(n.durationInFrames||30)):30,E=n?Math.max(0,Number(n.delay||0)):0,X=r?Math.max(1,Number(r.durationInFrames||30)):30,F=r?Math.max(0,Number(r.delay||0)):0,P=r?Math.max(0,i-X-F):Number.POSITIVE_INFINITY;let T=!1,A=!1,d=null,N=!1,j=30,C=0;r&&o>=P?(d=r,N=!0,j=X,C=o-P,C>=j-1&&(T=!0)):n?o<E?(T=!0,d=n,N=!1,j=$,C=0):o<E+$?(d=n,N=!1,j=$,C=o-E):(A=!0,d=null):(A=!0,d=null);const x=Math.max(0,C),v=j>0?Math.min(Math.max(0,x/j),1):1,y=d?le(d):S.Easing.linear,f=Math.max(0,Math.min(1,y(v)));let p,I="",V=1;if(T)p="inset(100%)";else if(A||!d)p=void 0;else{const g=String(d.property||d.id||""),b=((K=d.details)==null?void 0:K.direction)||"up",B=g.includes("ShrinkScale"),te=g.includes("CenterScale"),de=g.includes("Slide")||g.includes("slide");if(te){const Y=Number(((Q=d==null?void 0:d.details)==null?void 0:Q.angle)??(d==null?void 0:d.angle)??0),q=N?100*(1-f):100*f;p=ie(q,Y)}else if(B){const Y=Number(((D=d==null?void 0:d.details)==null?void 0:D.initialVisiblePercent)??(d==null?void 0:d.initialVisiblePercent)??50),q=Math.max(0,Math.min(50,(100-Y)/2)),U=N?q*f:q*(1-f);p=`inset(
-        ${U}%
-        ${U}%
-        ${U}%
-        ${U}%
-      )`}else if(de)p="inset(0% 0% 0% 0%)",N?b==="down"?I=`translateY(${100*f}%)`:b==="left"?I=`translateX(${-100*f}%)`:b==="right"?I=`translateX(${100*f}%)`:I=`translateY(${-100*f}%)`:b==="down"?I=`translateY(${-100*(1-f)}%)`:b==="left"?I=`translateX(${100*(1-f)}%)`:b==="right"?I=`translateX(${-100*(1-f)}%)`:I=`translateY(${100*(1-f)}%)`;else if(g.includes("Center"))p=`circle(${N?150*(1-f):150*f}% at 50% 50%)`;else if(g.includes("Corner")){const Y=N?f:1-f;b==="down"?p=`inset(0 ${100*Y}% ${100*Y}% 0)`:b==="up"?p=`inset(${100*Y}% ${100*Y}% 0 0)`:b==="left"?p=`inset(0 0 ${100*Y}% ${100*Y}%)`:b==="right"?p=`inset(${100*Y}% 0 0 ${100*Y}%)`:p=`inset(0 ${100*Y}% ${100*Y}% 0)`}else N?b==="down"?p=`inset(${100*f}% 0 0 0)`:b==="left"?p=`inset(0 0 0 ${100*f}%)`:b==="right"?p=`inset(0 ${100*f}% 0 0)`:p=`inset(0 0 ${100*f}% 0)`:b==="down"?p=`inset(0 0 ${100*(1-f)}% 0)`:b==="left"?p=`inset(0 0 0 ${100*(1-f)}%)`:b==="right"?p=`inset(0 ${100*(1-f)}% 0 0)`:p=`inset(${100*(1-f)}% 0 0 0)`;const fe=!!((_=d==null?void 0:d.details)!=null&&_.scale||d!=null&&d.scale);te||B?((k=d==null?void 0:d.details)==null?void 0:k.scale)===!1?V=1:V=N?1+.5*f:1.5-.5*f:fe&&(V=N?1-.2*f:.8+.2*f)}const W=[I,V!==1?`scale(${V})`:""].filter(Boolean).join(" ")||void 0,w=(ee=a==null?void 0:a.details)==null?void 0:ee.boxShadow,J=w&&(w.x||w.y||w.blur)?`drop-shadow(${w.x||0}px ${w.y||0}px ${w.blur||0}px ${w.color||"#000000"})`:void 0;return m.jsx("div",{style:{width:l!==void 0?l:"100%",height:s!==void 0?s:"100%",position:"relative",visibility:T?"hidden":"visible",filter:J,WebkitFilter:J},children:m.jsx("div",{style:{width:"100%",height:"100%",position:"relative",clipPath:p||void 0,WebkitClipPath:p||void 0,overflow:p?"hidden":"visible"},children:m.jsx("div",{style:{width:"100%",height:"100%",transform:W,transformOrigin:"center"},children:e})})})};M.BoxAnim=ne,M.ContentAnim=ae,M.MaskAnim=ce,M.combine=oe,M.combineAnimations=R,M.extractTransformations=G,M.useAnimation=H,Object.defineProperty(M,Symbol.toStringTag,{value:"Module"})});
+(function(E,v){typeof exports=="object"&&typeof module<"u"?v(exports,require("react/jsx-runtime"),require("react"),require("remotion")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","remotion"],v):(E=typeof globalThis<"u"?globalThis:E||self,v(E.animations={},E.jsxRuntime,E.React,E.remotion))})(this,function(E,v,z,m){"use strict";const Bt=()=>({scale:t=>({transform:`scale(${t})`}),growIn:t=>({transform:`scale(${t})`}),shrinkIn:t=>({transform:`scale(${t})`}),shrinkOut:t=>({transform:`scale(${t})`}),opacity:t=>({opacity:t}),translateX:t=>({transform:`translateX(${t}%)`}),translateY:t=>({transform:`translateY(${t}%)`}),rotate:t=>({transform:`rotate(${t}deg)`}),spin:t=>({transform:`rotate(${t}deg)`}),spinIn:t=>({transform:`rotate(${t}deg)`}),twistIn:t=>({transform:`rotate(${t}deg)`}),twistOut:t=>({transform:`rotate(${t}deg)`}),moveScaleIn:t=>({transform:`scale(${t})`}),spinOut:t=>({transform:`rotate(${t}deg)`}),default:()=>({}),rotateY:t=>({transform:`rotateY(${t}deg)`}),rotateX:t=>({transform:`rotateX(${t}deg)`}),blur:t=>({filter:`blur(${t}px)`}),blurIn:t=>({filter:`blur(${t}px)`}),blurOut:t=>({filter:`blur(${t}px)`}),blurV2In:t=>({filter:`blur(${t}px)`}),blurSlide:t=>({filter:`blur(${t}px)`,transform:`translateY(${t*5}%)`}),blurSlideV2In:t=>({filter:`blur(${t}px)`}),brightness:t=>({filter:`brightness(${t}%)`}),contrast:t=>({filter:`contrast(${t}%)`}),grayscale:t=>({filter:`grayscale(${t}%)`}),hue:t=>({filter:`hue-rotate(${t}deg)`}),saturation:t=>({filter:`saturate(${t}%)`}),vignette:t=>({filter:`contrast(${100+t*20}%) brightness(${100-t*20}%)`}),noise:t=>({filter:`contrast(${100+t*40}%) brightness(${100+t*20}%)`}),pixelate:t=>({filter:`contrast(${100+t*2}%)`}),chromaticAberration:t=>({filter:`hue-rotate(${t*10}deg) contrast(110%)`}),lightLeak:t=>({filter:`brightness(${100+t*50}%) saturate(${100+t*30}%)`}),duotone:t=>({filter:`sepia(${t*100}%) hue-rotate(${t*180}deg)`}),shakeHorizontalIn:t=>({transform:`translateX(${t}px)`}),shakeVerticalIn:t=>({transform:`translateY(${t}px)`}),shakeHorizontalOut:t=>({transform:`translateX(${t}px)`}),shakeVerticalOut:t=>({transform:`translateY(${t}px)`}),maskUpIn:t=>({transform:`translateY(${t}px)`,overflow:"hidden"}),maskUpOut:t=>({transform:`translateY(${t}px)`,overflow:"hidden"}),maskDownIn:t=>({transform:`translateY(${t}px)`,overflow:"hidden"}),maskDownOut:t=>({transform:`translateY(${t}px)`,overflow:"hidden"}),moveTranslateY:t=>({transform:`translateY(${t}%)`}),"hide-show":t=>({opacity:t}),hide:t=>({opacity:t}),show:t=>({opacity:t}),borderRadius:t=>({borderRadius:`${t}px`,overflow:"hidden"}),"corner-radius":t=>({borderRadius:`${t}px`,overflow:"hidden"})}),_=(t,d=0)=>{const s=[],l=t/5;for(let i=0;i<6;i+=1)s.push(i*l+d);return s},It=(t,d,s,l=!1)=>{const{from:i,to:n,ease:b}=d,h=d.durationInFrames||30,f=Number(i),o=Number(n),r=Math.max(1,Number(h));if(isNaN(f)||isNaN(o))return console.error("Invalid animation values:",{from:i,to:n,animationDurationInFrames:h,property:d.property}),f;h===void 0&&console.warn(`durationInFrames is undefined for animation: ${d.property}. Using 1 frame as default.`);const c=d.delay||0;if(d.property==="hide-show"||d.property==="hide"||d.property==="show")return t<c?f:o;let $;if(d.property==="moveScaleIn"?$=l?[s-r-c,s-r*.5-c]:[c+r*.5,c+r]:d.property==="moveTranslateY"?$=l?[s-r*.5-c,s-c]:[c,c+r*.5]:$=l?[s-r-c,s-c]:[c,c+r],d.property.includes("shake")){const B=l?_(r,s-r-c):_(r,c);return m.interpolate(t,B,[0,f,o,f,o,0],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:b})}return m.interpolate(t,$,[f,o],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:b})},G=t=>{if(t==null)return 0;if(typeof t=="number")return Number.isNaN(t)?0:t;if(typeof t=="object"){if(t.rotate!==void 0&&t.rotate!==null){const i=parseFloat(String(t.rotate));if(!Number.isNaN(i))return i}if(t.rotation!==void 0&&t.rotation!==null){const i=parseFloat(String(t.rotation));if(!Number.isNaN(i))return i}return t.transform?G(t.transform):0}const d=String(t),s=/rotate\((-?[\d.]+)deg\)/.exec(d);if(s)return parseFloat(s[1])||0;const l=/matrix\(([^)]+)\)/.exec(d);if(l){const i=l[1].split(",").map(n=>parseFloat(n.trim()));if(i.length>=4){const[n,b]=i;return Math.atan2(b,n)*(180/Math.PI)}}return 0},A=(t,d,s,l,i)=>{var f,o,r,c,$;const{property:n}=t;if(n==="move"){const B=Number(((f=t.details)==null?void 0:f.fromX)??t.from??0),F=Number(((o=t.details)==null?void 0:o.toX)??t.to??0),L=Number(((r=t.details)==null?void 0:r.fromY)??0),j=Number(((c=t.details)==null?void 0:c.toY)??0),O=Number((($=t.details)==null?void 0:$.scale)||1)||1;let H=i;if(H==null||Number.isNaN(H)){const p=t.details;H=G((p==null?void 0:p.rotate)??(p==null?void 0:p.rotation)??(p==null?void 0:p.transform))}const e=t.delay||0,x=t.durationInFrames||30,T=l?[s-x-e,s-e]:[e,e+x],V=m.interpolate(d,T,[B,F],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:t.ease}),S=m.interpolate(d,T,[L,j],{extrapolateLeft:"clamp",extrapolateRight:"clamp",easing:t.ease}),w=(H||0)*Math.PI/180,X=Math.cos(w),a=Math.sin(w),g=V*X+S*a,y=-V*a+S*X,W=g/O,C=y/O;return{transform:`translateX(${W}px) translateY(${C}px)`}}const b=It(d,t,s,l),h=Bt();return(h[n]||h.default)(b)},U=(t,d,s,l=!1,i=!1,n)=>z.useMemo(()=>{if(t.length===0)return{};const b=t.filter(h=>h.from!==void 0&&h.to!==void 0);if(b.length!==t.length&&console.error("Some animations are invalid and will be ignored"),i){const h=[];return b.reverse().forEach(o=>{const r=A(o,s,d,!1,n);h.push(r)}),h.reduce((o,r)=>(Object.keys(r).forEach(c=>{c==="transform"||c==="filter"?o[c]=o[c]?`${o[c]} ${r[c]}`:r[c]:o[c]=r[c]}),o),{})}else return b.map(f=>A(f,s,d,l,n)).reduce((f,o)=>(Object.keys(o).forEach(r=>{r==="transform"||r==="filter"?f[r]=f[r]?`${f[r]} ${o[r]}`:o[r]:f[r]=o[r]}),f),{})},[t,s,d,l,n]),M=t=>t?Array.isArray(t)?t:[t]:[],Pt=(...t)=>{const d=[];return t.forEach(s=>{Array.isArray(s)?d.push(...s):s&&d.push(s)}),d.filter(s=>s!==void 0).reduce((s,l)=>s.find(n=>n.property===l.property)?s.map(n=>n.property===l.property?{...n,from:Math.min(n.from,l.from),to:Math.max(n.to,l.to),durationInFrames:Math.max(n.durationInFrames,l.durationInFrames),delay:Math.min(n.delay||0,l.delay||0),ease:b=>(n.ease(b)+l.ease(b))/2}:n):[...s,l],[])},Ft=({animationIn:t,animationOut:d,durationInFrames:s,children:l,style:i={},frame:n,isTransition:b=!1,basicCharAnimationsIn:h=[],basicCharAnimationsOut:f=[]})=>{const o=G((i==null?void 0:i.transform)||(i==null?void 0:i.rotate)||(i==null?void 0:i.rotation)),r=U(M(t),s,n,!1,!1,o),c=U(M(d),s,n,!0,!1,o),$=U(M(h),s,n,!0,!1,o),B=U(M(f),s,n,!0,!1,o),F=z.useMemo(()=>{const S=Object.keys(r).length>0,w=t==null?void 0:t.reduce((a,g)=>Math.min(a,g.delay||0),1/0),X=n-(w||0);return S&&X<0?{visibility:b?"visible":"hidden"}:r},[r,n,t,b]),L=z.useMemo(()=>{if(n>s)return{visibility:b?"visible":"hidden"};const S=M(d);if(!S||S.length===0)return{};let w=0;S.forEach(a=>{const g=(a.durationInFrames||0)+(a.delay||0);g>w&&(w=g)});const X=Math.max(0,s-w);return n<X?{}:c},[c,n,d,s,b]),j=z.useMemo(()=>{const S={...F};return Object.entries(L).forEach(([w,X])=>{w==="transform"?S[w]=`${S[w]||""} ${X||""}`.trim():w in S&&typeof S[w]=="number"&&typeof X=="number"?S[w]=S[w]*X:S[w]=X}),S},[F,L]),O=z.useMemo(()=>{const S=j.transform||"",{translateX:w,translateY:X,scale:a,rotation:g,rotateX:y,rotateY:W,rotateZ:C}=k(S);return`${g} ${w} ${X} ${a} ${y} ${W} ${C}`.trim()},[j]),{top:H,left:e,position:x,transform:T,...V}=i||{};return v.jsx("div",{style:{width:"100%",height:"100%",overflow:j.overflow||$.overflow||B.overflow||"visible",pointerEvents:"none"},children:v.jsx("div",{style:{width:"100%",height:"100%",...V,...j,overflow:"visible",transform:O,pointerEvents:"none",background:Object.keys(j).length===0?"transparent":j.backgroundColor},children:l})})},k=t=>{let d="",s="",l="scale(1)",i="",n="",b="",h="";const f=t.match(/translateX\([^)]+\)/g);f&&(d=f[f.length-1]);const o=t.match(/translateY\([^)]+\)/g);o&&(s=o[o.length-1]);const r=t.match(/scale\([^)]+\)/g);r&&(l=r[r.length-1]);const c=t.match(/rotate\([^)]+\)/g);c&&(i=c[c.length-1]);const $=t.match(/rotateX\([^)]+\)/g);$&&(n=$[$.length-1]);const B=t.match(/rotateY\([^)]+\)/g);B&&(b=B[B.length-1]);const F=t.match(/rotateZ\([^)]+\)/g);return F&&(h=F[F.length-1]),{translateX:d,translateY:s,scale:l,rotation:i,rotateX:n,rotateY:b,rotateZ:h}},jt=({animationTimed:t,durationInFrames:d,children:s,style:l={},frame:i})=>{const n=G((l==null?void 0:l.transform)||(l==null?void 0:l.rotate)||(l==null?void 0:l.rotation)),b=U(M(t),d,i,!1,!0,n),h=z.useMemo(()=>({...b}),[b]),f=!!h.borderRadius;return v.jsx("div",{style:{overflow:f?"hidden":h.overflow||"visible",borderRadius:h.borderRadius,pointerEvents:"none",height:l.height||"100%",width:l.width||"100%",...h,...f?{overflow:"hidden"}:{}},children:v.jsx("div",{style:{overflow:f?"hidden":"visible",borderRadius:h.borderRadius,pointerEvents:"none",height:"100%",width:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:s})})},Ct=t=>{if(typeof(t==null?void 0:t.ease)=="function")return t.ease;switch(t==null?void 0:t.easing){case"ease-in":case"accelerate":return m.Easing.in(m.Easing.cubic);case"ease-out":case"smooth":case"slowDown":return m.Easing.out(m.Easing.cubic);case"ease-in-out":case"natural":case"swing":return m.Easing.inOut(m.Easing.cubic);case"bounce":return m.Easing.bounce;case"elastic":return m.Easing.elastic(1);case"overshoot":case"impulse":return m.Easing.out(m.Easing.back(1.7));case"none":case"linear":default:return m.Easing.linear}},Ot=(t,d)=>{const s=d*Math.PI/180,l=Math.cos(s),i=Math.sin(s),n=t/100*50,b=50,h=50,f=200,o=l,r=i,c=-i,$=l;return`polygon(${[[b-o*f-c*n,h-r*f-$*n],[b+o*f-c*n,h+r*f-$*n],[b+o*f+c*n,h+r*f+$*n],[b-o*f+c*n,h-r*f+$*n]].map(([F,L])=>`${F}% ${L}%`).join(", ")})`},Tt=({children:t,currentWidth:d,currentHeight:s,frame:l,item:i,keyframeAnimations:n,durationInFrames:b})=>{var nt,st,lt,at,it,ct,dt,ft,ut,pt,ht,gt,bt,$t,xt,St,wt,yt,Nt,Yt,vt,mt,Et,Xt;if(!n||!Array.isArray(n)||n.length===0)return v.jsx(v.Fragment,{children:t});const h=u=>{var N,P;return!!((N=u==null?void 0:u.property)!=null&&N.includes("maskReveal")||(P=u==null?void 0:u.id)!=null&&P.includes("maskReveal"))},f=u=>{var N,P;return!!((u==null?void 0:u.type)==="exit"||(N=u==null?void 0:u.property)!=null&&N.includes("Out")||(P=u==null?void 0:u.id)!=null&&P.includes("Out"))},o=n.find(u=>h(u)&&!f(u)),r=n.find(u=>h(u)&&f(u));if(!o&&!r)return v.jsx(v.Fragment,{children:t});const c=Math.max(1,b||300),$=o?Math.max(1,Number(o.durationInFrames||30)):30,B=o?Math.max(0,Number(o.delay||0)):0,F=r?Math.max(1,Number(r.durationInFrames||30)):30,L=r?Math.max(0,Number(r.delay||0)):0,j=r?Math.max(0,c-F-L):Number.POSITIVE_INFINITY;let O=!1,H=!1,e=null,x=!1,T=30,V=0;if(r&&(l>=j||!o)){e=r,x=!0,T=F;const u=o||j<c?j:0;V=l-u;const N=String(r.property||r.id||""),P=N.includes("Blur")||N.includes("Soft")||!!((nt=r==null?void 0:r.details)!=null&&nt.blurBottom)||!!((st=r==null?void 0:r.details)!=null&&st.softEdge);V>=T-1&&!P&&(O=!0)}else if(o)if(l<B)O=!0,e=o,x=!1,T=$,V=0;else if(l<B+$)e=o,x=!1,T=$,V=l-B;else{const u=String(o.property||o.id||"");u.includes("Blur")||u.includes("Soft")||!!((lt=o==null?void 0:o.details)!=null&&lt.blurBottom)||!!((at=o==null?void 0:o.details)!=null&&at.softEdge)?(e=o,x=!1,T=$,V=$):(H=!0,e=null)}else H=!0,e=null;const S=Math.max(0,V),w=T>0?Math.min(Math.max(0,S/T),1):1,X=e?Ct(e):m.Easing.linear,a=Math.max(0,Math.min(1,X(w)));let g,y="",W=1;const C=String((e==null?void 0:e.property)||(e==null?void 0:e.id)||""),p=((it=e==null?void 0:e.details)==null?void 0:it.direction)||"up";if(O)g="inset(100%)";else if(H||!e)g=void 0;else{const u=C.includes("ShrinkScale"),N=C.includes("CenterScale"),P=C.includes("Slide")||C.includes("slide");if(N){const Y=Number(((ct=e==null?void 0:e.details)==null?void 0:ct.angle)??(e==null?void 0:e.angle)??0),q=x?100*(1-a):100*a;g=Ot(q,Y)}else if(u){const Y=Number(((dt=e==null?void 0:e.details)==null?void 0:dt.initialVisiblePercent)??(e==null?void 0:e.initialVisiblePercent)??50),q=Math.max(0,Math.min(50,(100-Y)/2)),D=x?q*a:q*(1-a);g=`inset(
+        ${D}%
+        ${D}%
+        ${D}%
+        ${D}%
+      )`}else if(P)g="inset(0% 0% 0% 0%)",x?p==="down"?y=`translateY(${100*a}%)`:p==="left"?y=`translateX(${-100*a}%)`:p==="right"?y=`translateX(${100*a}%)`:y=`translateY(${-100*a}%)`:p==="down"?y=`translateY(${-100*(1-a)}%)`:p==="left"?y=`translateX(${100*(1-a)}%)`:p==="right"?y=`translateX(${-100*(1-a)}%)`:y=`translateY(${100*(1-a)}%)`;else if(C.includes("Center"))g=`circle(${x?150*(1-a):150*a}% at 50% 50%)`;else if(C.includes("Corner")){const Y=x?a:1-a;p==="down"?g=`inset(0 ${100*Y}% ${100*Y}% 0)`:p==="up"?g=`inset(${100*Y}% ${100*Y}% 0 0)`:p==="left"?g=`inset(0 0 ${100*Y}% ${100*Y}%)`:p==="right"?g=`inset(${100*Y}% 0 0 ${100*Y}%)`:g=`inset(0 ${100*Y}% ${100*Y}% 0)`}else x?p==="down"?g=`inset(${100*a}% 0 0 0)`:p==="left"?g=`inset(0 0 0 ${100*a}%)`:p==="right"?g=`inset(0 ${100*a}% 0 0)`:g=`inset(0 0 ${100*a}% 0)`:p==="down"?g=`inset(0 0 ${100*(1-a)}% 0)`:p==="left"?g=`inset(0 0 0 ${100*(1-a)}%)`:p==="right"?g=`inset(0 ${100*(1-a)}% 0 0)`:g=`inset(${100*(1-a)}% 0 0 0)`;const Q=!!((ft=e==null?void 0:e.details)!=null&&ft.scale||e!=null&&e.scale);N||u?((ut=e==null?void 0:e.details)==null?void 0:ut.scale)===!1?W=1:W=x?1+.5*a:1.5-.5*a:Q&&(W=x?1-.2*a:.8+.2*a)}const K=C.includes("Blur")||C.includes("Soft")||!!((pt=e==null?void 0:e.details)!=null&&pt.blurBottom)||!!((ht=e==null?void 0:e.details)!=null&&ht.softEdge);let Z;if(K&&!O&&e){g=void 0;const u=30,N=((gt=e==null?void 0:e.details)==null?void 0:gt.blurPosition)||"bottom";x?p==="up"?y=`translateY(${u*a}%)`:p==="down"?y=`translateY(${-u*a}%)`:p==="left"?y=`translateX(${u*a}%)`:p==="right"&&(y=`translateX(${-u*a}%)`):p==="up"?y=`translateY(${u*(1-a)}%)`:p==="down"?y=`translateY(${-u*(1-a)}%)`:p==="left"?y=`translateX(${u*(1-a)}%)`:p==="right"&&(y=`translateX(${-u*(1-a)}%)`);const P=typeof((bt=e==null?void 0:e.details)==null?void 0:bt.blurHeight)=="number"?e.details.blurHeight:parseInt(String((($t=e==null?void 0:e.details)==null?void 0:$t.blurHeight)||"35"),10)||35,Q=x?100:0,Y=x?0:100,q=Number(((xt=e==null?void 0:e.details)==null?void 0:xt.initialOpacity)??Q)/100,D=Number(((St=e==null?void 0:e.details)==null?void 0:St.finalOpacity)??Y)/100,Zt=Math.max(0,Math.min(1,q+(D-q)*a)),J=Math.max(0,1-Zt);N==="bottom"?Z=`linear-gradient(to bottom, black 0%, black ${100-P}%, rgba(0,0,0,${J}) 100%)`:N==="top"?Z=`linear-gradient(to top, black 0%, black ${100-P}%, rgba(0,0,0,${J}) 100%)`:N==="right"?Z=`linear-gradient(to right, black 0%, black ${100-P}%, rgba(0,0,0,${J}) 100%)`:N==="left"&&(Z=`linear-gradient(to left, black 0%, black ${100-P}%, rgba(0,0,0,${J}) 100%)`)}const Vt=[y,W!==1?`scale(${W})`:""].filter(Boolean).join(" ")||void 0,R=(wt=i==null?void 0:i.details)==null?void 0:wt.boxShadow,tt=R&&(R.x||R.y||R.blur)?`drop-shadow(${R.x||0}px ${R.y||0}px ${R.blur||0}px ${R.color||"#000000"})`:void 0,et=Number(((yt=e==null?void 0:e.details)==null?void 0:yt.blurAmount)??16),Ht=!!(K&&(((Nt=e==null?void 0:e.details)==null?void 0:Nt.blurBottom)??!0)),I=((Yt=e==null?void 0:e.details)==null?void 0:Yt.blurPosition)||"bottom",rt=typeof((vt=e==null?void 0:e.details)==null?void 0:vt.blurHeight)=="number"?`${e.details.blurHeight}%`:((mt=e==null?void 0:e.details)==null?void 0:mt.blurHeight)||"35%",Wt=x?100:0,Lt=x?0:100,ot=Number(((Et=e==null?void 0:e.details)==null?void 0:Et.initialOpacity)??Wt)/100,Rt=Number(((Xt=e==null?void 0:e.details)==null?void 0:Xt.finalOpacity)??Lt)/100,Mt=K&&e?Math.max(0,Math.min(1,ot+(Rt-ot)*a)):1;return v.jsx("div",{style:{width:d!==void 0?d:"100%",height:s!==void 0?s:"100%",position:"relative",visibility:O?"hidden":"visible"},children:v.jsxs("div",{style:{width:"100%",height:"100%",position:"relative",clipPath:g||void 0,WebkitClipPath:g||void 0,maskImage:Z||void 0,WebkitMaskImage:Z||void 0,overflow:g||Z?"hidden":"visible"},children:[v.jsx("div",{style:{width:"100%",height:"100%",transform:Vt,transformOrigin:"center",filter:tt,WebkitFilter:tt},children:t}),Ht&&!O&&v.jsx("div",{style:{position:"absolute",top:I==="top"?0:void 0,bottom:I==="bottom"?0:void 0,left:0,right:0,width:I==="left"||I==="right"?rt:"100%",height:I==="top"||I==="bottom"?rt:"100%",pointerEvents:"none",opacity:Mt,backdropFilter:`blur(${et}px)`,WebkitBackdropFilter:`blur(${et}px)`,maskImage:I==="top"?"linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":I==="left"?"linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":I==="right"?"linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":"linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)",WebkitMaskImage:I==="top"?"linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":I==="left"?"linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":I==="right"?"linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)":"linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, rgba(0,0,0,0.2) 75%, transparent 100%)"}})]})})};E.BoxAnim=Ft,E.ContentAnim=jt,E.MaskAnim=Tt,E.combine=Pt,E.combineAnimations=M,E.extractTransformations=k,E.useAnimation=U,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cliquify.me/animations",
-  "version": "10.0.0",
+  "version": "10.0.2",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -26,7 +26,7 @@
     "typescript": "^5.3.3",
     "vite": "^5.2.0",
     "vite-plugin-dts": "^3.9.1",
-    "@cliquify.me/types": "9.0.0",
+    "@cliquify.me/types": "9.0.3",
     "@cliquify.me/typescript-config": "1.0.0"
   },
   "dependencies": {
@@ -38,7 +38,7 @@
     "@designcombo/events": "^1.0.2",
     "react": "^18.2.0 || ^19.0.0",
     "remotion": "4.0.506",
-    "@cliquify.me/types": "9.0.0"
+    "@cliquify.me/types": "9.0.3"
   },
   "scripts": {
     "dev": "vite",