@cliquify.me/transitions 1.0.0 → 1.0.1

package/dist/index.es.js

@@ -1,26 +1,26 @@
-import { interpolate as D, spring as ce, measureSpring as me, AbsoluteFill as c, Internals as Z, Sequence as M, useVideoConfig as de, useCurrentFrame as fe, Freeze as Y, random as B } from "remotion";
-import { jsx as o, Fragment as ee, jsxs as W } from "react/jsx-runtime";
-import C, { useMemo as h, Children as pe, useState as A } from "react";
-import { getBoundingBox as he, translatePath as te } from "@remotion/paths";
-import { makeStar as ge, makePie as ye } from "@remotion/shapes";
-const T = (n) => ({
+import { interpolate as D, spring as ut, measureSpring as mt, AbsoluteFill as u, Internals as Z, Sequence as L, useVideoConfig as dt, useCurrentFrame as ft, Freeze as z, random as W } from "remotion";
+import { jsx as o, Fragment as tt, jsxs as C } from "react/jsx-runtime";
+import M, { useMemo as g, Children as ht, useState as B } from "react";
+import { getBoundingBox as pt, translatePath as et } from "@remotion/paths";
+import { makeStar as gt, makePie as yt } from "@remotion/shapes";
+const b = (n) => ({
   getDurationInFrames: () => n.durationInFrames,
-  getProgress: ({ frame: t }) => D(t, [0, n.durationInFrames], [0, 1], {
+  getProgress: ({ frame: e }) => D(e, [0, n.durationInFrames], [0, 1], {
     easing: n.easing,
     extrapolateLeft: "clamp",
     extrapolateRight: "clamp"
   })
-}), at = (n = {}) => ({
-  getDurationInFrames: ({ fps: t }) => n.durationInFrames ? n.durationInFrames : me({
+}), le = (n = {}) => ({
+  getDurationInFrames: ({ fps: e }) => n.durationInFrames ? n.durationInFrames : mt({
     config: n.config,
     threshold: n.durationRestThreshold,
-    fps: t
+    fps: e
   }),
-  getProgress: ({ fps: t, frame: e }) => {
+  getProgress: ({ fps: e, frame: t }) => {
     const r = n.reverse ? 0 : 1, s = n.reverse ? 1 : 0;
-    return ce({
-      fps: t,
-      frame: e,
+    return ut({
+      fps: e,
+      frame: t,
       to: r,
       from: s,
       config: n.config,
@@ -31,7 +31,7 @@ const T = (n) => ({
   }
 });
 typeof window < "u" && (window.remotion_renderReady = !1, window.remotion_delayRenderTimeouts || (window.remotion_delayRenderTimeouts = {}), window.remotion_delayRenderHandles = []);
-var $e = {
+var wt = {
   "style.transformOrigin": {
     type: "transform-origin",
     step: 1,
@@ -67,7 +67,7 @@ var $e = {
     description: "Opacity",
     hiddenFromList: !1
   }
-}, we = {
+}, $t = {
   "style.borderWidth": {
     type: "number",
     default: void 0,
@@ -98,7 +98,7 @@ var $e = {
     default: void 0,
     description: "Border color"
   }
-}, Te = {
+}, bt = {
   "style.borderRadius": {
     type: "number",
     default: 0,
@@ -140,13 +140,13 @@ var $e = {
     description: "Bottom left radius",
     hiddenFromList: !1
   }
-}, be = {
+}, Tt = {
   "style.backgroundColor": {
     type: "color",
     default: "transparent",
     description: "Color"
   }
-}, Se = {
+}, St = {
   premountFor: {
     type: "number",
     default: 0,
@@ -164,9 +164,9 @@ var $e = {
     hiddenFromList: !0,
     keyframable: !1
   }
-}, Fe = {
-  ...Se
-}, ve = {
+}, vt = {
+  ...St
+}, Ft = {
   cropLeft: {
     type: "number",
     default: 0,
@@ -207,66 +207,66 @@ var $e = {
     hiddenFromList: !1,
     keyframable: !0
   }
-}, xe = ve, Ie = {
-  ...xe,
-  ...$e,
-  ...be,
-  ...we,
-  ...Te,
-  ...Fe
-}, Ee = {
+}, xt = Ft, It = {
+  ...xt,
+  ...wt,
+  ...Tt,
+  ...$t,
+  ...bt,
+  ...vt
+}, Et = {
   layout: {
     type: "enum",
     default: "absolute-fill",
     description: "Layout",
     variants: {
-      "absolute-fill": Ie,
+      "absolute-fill": It,
       none: {}
     }
   }
 };
 ({
-  ...Ee.layout
+  ...Et.layout
 });
-function Pe(n, t) {
-  const { allowFloats: e, component: r } = t;
+function Pt(n, e) {
+  const { allowFloats: t, component: r } = e;
   if (typeof n > "u")
     throw new Error(`The "durationInFrames" prop ${r} is missing.`);
   if (typeof n != "number")
     throw new Error(`The "durationInFrames" prop ${r} must be a number, but you passed a value of type ${typeof n}`);
   if (n <= 0)
     throw new TypeError(`The "durationInFrames" prop ${r} must be positive, but got ${n}.`);
-  if (!e && n % 1 !== 0)
+  if (!t && n % 1 !== 0)
     throw new TypeError(`The "durationInFrames" prop ${r} must be an integer, but got ${n}.`);
   if (!Number.isFinite(n))
     throw new TypeError(`The "durationInFrames" prop ${r} must be finite, but got ${n}.`);
 }
-var qe = {
-  validateDurationInFrames: Pe
+var Rt = {
+  validateDurationInFrames: Pt
 };
-const ne = C.createContext(null), re = C.createContext(null), K = ({ presentationProgress: n, children: t }) => {
-  const e = h(() => ({
+const nt = M.createContext(null), rt = M.createContext(null), K = ({ presentationProgress: n, children: e }) => {
+  const t = g(() => ({
     enteringProgress: n
   }), [n]);
-  return /* @__PURE__ */ o(ne.Provider, { value: e, children: t });
-}, G = ({ presentationProgress: n, children: t }) => {
-  const e = h(() => ({
+  return /* @__PURE__ */ o(nt.Provider, { value: t, children: e });
+}, G = ({ presentationProgress: n, children: e }) => {
+  const t = g(() => ({
     exitingProgress: n
   }), [n]);
-  return /* @__PURE__ */ o(re.Provider, { value: e, children: t });
-}, oe = (n) => C.Children.toArray(n).reduce((e, r) => r.type === C.Fragment ? e.concat(
-  oe(
+  return /* @__PURE__ */ o(rt.Provider, { value: t, children: e });
+}, ot = (n) => M.Children.toArray(n).reduce((t, r) => r.type === M.Fragment ? t.concat(
+  ot(
     r.props.children
   )
-) : (e.push(r), e), []), Re = 0.01, ke = ({
+) : (t.push(r), t), []), kt = 0.01, qt = ({
   children: n,
-  presentationProgress: t,
-  presentationDirection: e,
+  presentationProgress: e,
+  presentationDirection: t,
   passedProps: { direction: r = "from-left", enterStyle: s, exitStyle: l }
 }) => {
-  const u = h(() => {
-    const i = t === 1 ? t * 100 : t * 100 - Re;
-    if (e === "exiting")
+  const c = g(() => {
+    const i = e === 1 ? e * 100 : e * 100 - kt;
+    if (t === "exiting")
       switch (r) {
         case "from-left":
           return {
@@ -274,7 +274,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
           };
         case "from-right":
           return {
-            transform: `translateX(${-t * 100}%)`
+            transform: `translateX(${-e * 100}%)`
           };
         case "from-top":
           return {
@@ -282,7 +282,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
           };
         case "from-bottom":
           return {
-            transform: `translateY(${-t * 100}%)`
+            transform: `translateY(${-e * 100}%)`
           };
         default:
           throw new Error(`Invalid direction: ${r}`);
@@ -290,7 +290,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
     switch (r) {
       case "from-left":
         return {
-          transform: `translateX(${-100 + t * 100}%)`
+          transform: `translateX(${-100 + e * 100}%)`
         };
       case "from-right":
         return {
@@ -298,7 +298,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
         };
       case "from-top":
         return {
-          transform: `translateY(${-100 + t * 100}%)`
+          transform: `translateY(${-100 + e * 100}%)`
         };
       case "from-bottom":
         return {
@@ -307,132 +307,132 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
       default:
         throw new Error(`Invalid direction: ${r}`);
     }
-  }, [e, t, r]), a = h(() => ({
+  }, [t, e, r]), a = g(() => ({
     width: "100%",
     height: "100%",
     justifyContent: "center",
     alignItems: "center",
-    ...u,
-    ...e === "entering" ? s : l
-  }), [u, s, l, e]);
-  return /* @__PURE__ */ o(c, { style: a, children: n });
-}, N = (n) => ({
-  component: ke,
+    ...c,
+    ...t === "entering" ? s : l
+  }), [c, s, l, t]);
+  return /* @__PURE__ */ o(u, { style: a, children: n });
+}, X = (n) => ({
+  component: qt,
   props: {}
-}), Ce = qe.validateDurationInFrames, L = function(n) {
+}), Ct = Rt.validateDurationInFrames, N = function(n) {
   return null;
-}, z = ({ children: n }) => /* @__PURE__ */ o(ee, { children: n }), Me = ({
+}, _ = ({ children: n }) => /* @__PURE__ */ o(tt, { children: n }), Mt = ({
   children: n
 }) => {
-  const { fps: t } = de(), e = fe(), r = h(() => {
+  const { fps: e } = dt(), t = ft(), r = g(() => {
     let s = 0, l = 0;
-    const u = oe(n);
-    return pe.map(u, (a, i) => {
-      const f = a;
-      if (typeof f == "string") {
-        if (f.trim() === "")
+    const c = ot(n);
+    return ht.map(c, (a, i) => {
+      const d = a;
+      if (typeof d == "string") {
+        if (d.trim() === "")
           return null;
         throw new TypeError(
-          `The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> components as its children, but you passed a string "${f}"`
+          `The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> components as its children, but you passed a string "${d}"`
         );
       }
-      const d = u[i - 1], $ = u[i + 1], p = typeof d == "string" || typeof d > "u" ? null : d.type === L ? d : null, g = typeof $ == "string" || typeof $ > "u" ? null : $.type === L ? $ : null, _ = typeof d == "string" || typeof d > "u" ? !1 : d.type === L;
-      if (f.type === L) {
-        if (_)
+      const m = c[i - 1], y = c[i + 1], f = typeof m == "string" || typeof m > "u" ? null : m.type === N ? m : null, p = typeof y == "string" || typeof y > "u" ? null : y.type === N ? y : null, A = typeof m == "string" || typeof m > "u" ? !1 : m.type === N;
+      if (d.type === N) {
+        if (A)
           throw new TypeError(
             `A <TransitionSeries.Transition /> component must not be followed by another <TransitionSeries.Transition /> component (nth children = ${i - 1} and ${i})`
           );
         return null;
       }
-      if (f.type !== z)
+      if (d.type !== _)
         throw new TypeError(
-          `The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> and <TransitionSeries.Transition /> components as its children, but got ${f} instead`
+          `The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> and <TransitionSeries.Transition /> components as its children, but got ${d} instead`
         );
-      const E = f, R = `index = ${i}, duration = ${E.props.durationInFrames}`;
+      const E = d, k = `index = ${i}, duration = ${E.props.durationInFrames}`;
       if (!(E != null && E.props.children))
         throw new TypeError(
-          `A <TransitionSeries.Sequence /> component (${R}) was detected to not have any children. Delete it to fix this error.`
+          `A <TransitionSeries.Sequence /> component (${k}) was detected to not have any children. Delete it to fix this error.`
         );
-      const w = E.props.durationInFrames, {
-        durationInFrames: b,
-        children: tt,
-        ...F
+      const $ = E.props.durationInFrames, {
+        durationInFrames: T,
+        children: ne,
+        ...v
       } = E.props;
-      Ce(w, {
+      Ct($, {
         component: "of a <TransitionSeries.Sequence /> component",
         allowFloats: !0
       });
       const P = E.props.offset ?? 0;
       if (Number.isNaN(P))
         throw new TypeError(
-          `The "offset" property of a <TransitionSeries.Sequence /> must not be NaN, but got NaN (${R}).`
+          `The "offset" property of a <TransitionSeries.Sequence /> must not be NaN, but got NaN (${k}).`
         );
       if (!Number.isFinite(P))
         throw new TypeError(
-          `The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${P} (${R}).`
+          `The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${P} (${k}).`
         );
       if (P % 1 !== 0)
         throw new TypeError(
-          `The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${P} (${R}).`
+          `The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${P} (${k}).`
         );
-      const ie = l + P;
-      let X = 0;
-      p && (X = p.props.timing.getDurationInFrames({
-        fps: t
-      }), s -= X / 2);
-      let m = ie - X / 2;
-      l += w + P, m < 0 && (m = 0);
-      const O = g ? g.props.timing.getProgress({
-        frame: e - m - b + g.props.timing.getDurationInFrames({ fps: t }) / 2 + s,
-        fps: t
-      }) : null, k = p ? p.props.timing.getProgress({
-        frame: e - m,
-        fps: t
-      }) : null, se = p ? p.props.timing.getProgress({
-        frame: e - (m + b),
-        fps: t
+      const it = l + P;
+      let O = 0;
+      f && (O = f.props.timing.getDurationInFrames({
+        fps: e
+      }), s -= O / 2);
+      let h = it - O / 2;
+      l += $ + P, h < 0 && (h = 0);
+      const U = p ? p.props.timing.getProgress({
+        frame: t - h - T + p.props.timing.getDurationInFrames({ fps: e }) / 2 + s,
+        fps: e
+      }) : null, q = f ? f.props.timing.getProgress({
+        frame: t - h,
+        fps: e
+      }) : null, st = f ? f.props.timing.getProgress({
+        frame: t - (h + T),
+        fps: e
       }) : null;
-      if (g && w < g.props.timing.getDurationInFrames({ fps: t }) / 2)
+      if (p && $ < p.props.timing.getDurationInFrames({ fps: e }) / 2)
         throw new Error(
-          `The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the next <TransitionSeries.Transition />. The transition is ${g.props.timing.getDurationInFrames(
-            { fps: t }
-          )} frames long, but the sequence is only ${w} frames long (${R})`
+          `The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the next <TransitionSeries.Transition />. The transition is ${p.props.timing.getDurationInFrames(
+            { fps: e }
+          )} frames long, but the sequence is only ${$} frames long (${k})`
         );
-      if (p && w < p.props.timing.getDurationInFrames({ fps: t }) / 2)
+      if (f && $ < f.props.timing.getDurationInFrames({ fps: e }) / 2)
         throw new Error(
-          `The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the previous <TransitionSeries.Transition />. The transition is ${p.props.timing.getDurationInFrames(
-            { fps: t }
-          )} frames long, but the sequence is only ${w} frames long (${R})`
+          `The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the previous <TransitionSeries.Transition />. The transition is ${f.props.timing.getDurationInFrames(
+            { fps: e }
+          )} frames long, but the sequence is only ${$} frames long (${k})`
         );
-      if (g && p && se !== null && k !== null) {
-        const v = g.props.presentation ?? N(), x = p.props.presentation ?? N(), I = p.props.timing.getDurationInFrames({
-          fps: t
-        }), S = g.props.timing.getDurationInFrames({
-          fps: t
-        }), q = v.component, U = x.component, j = e < +Math.floor(m) + I / 2, V = e > Math.floor(m) + Math.floor(b) + I / 2, ae = V ? Math.floor(m) + Math.floor(b) + Math.floor(S / 2) : Math.floor(m), H = j ? Math.floor(m) : Math.floor(m) + I / 2, J = g.props.timing.getProgress({
-          frame: e - (H + b - S / 2),
-          fps: t
-        }), le = e > m, ue = e < m + b + S / 2 + I / 2;
+      if (p && f && st !== null && q !== null) {
+        const F = p.props.presentation ?? X(), x = f.props.presentation ?? X(), I = f.props.timing.getDurationInFrames({
+          fps: e
+        }), S = p.props.timing.getDurationInFrames({
+          fps: e
+        }), R = F.component, Y = x.component, j = t < +Math.floor(h) + I / 2, V = t > Math.floor(h) + Math.floor(T) + I / 2, at = V ? Math.floor(h) + Math.floor(T) + Math.floor(S / 2) : Math.floor(h), H = j ? Math.floor(h) : Math.floor(h) + I / 2, J = p.props.timing.getProgress({
+          frame: t - (H + T - S / 2),
+          fps: e
+        }), lt = t > h, ct = t < h + T + S / 2 + I / 2;
         return /* @__PURE__ */ o(
-          Y,
+          z,
           {
-            active: ue && le && (j || V),
-            frame: ae,
+            active: ct && lt && (j || V),
+            frame: at,
             children: /* @__PURE__ */ o(
-              M,
+              L,
               {
                 from: H,
-                durationInFrames: w + S / 2,
-                ...F,
-                name: F.name || "<TS.Sequence>",
+                durationInFrames: $ + S / 2,
+                ...v,
+                name: v.name || "<TS.Sequence>",
                 children: /* @__PURE__ */ o(
-                  q,
+                  R,
                   {
-                    passedProps: v.props ?? {},
+                    passedProps: F.props ?? {},
                     presentationDirection: "exiting",
                     presentationProgress: J,
-                    presentationDurationInFrames: g.props.timing.getDurationInFrames(
-                      { fps: t }
+                    presentationDurationInFrames: p.props.timing.getDurationInFrames(
+                      { fps: e }
                     ),
                     onElementImage: () => {
                     },
@@ -444,13 +444,13 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
                       {
                         presentationProgress: J,
                         children: /* @__PURE__ */ o(
-                          U,
+                          Y,
                           {
                             passedProps: x.props ?? {},
                             presentationDirection: "entering",
-                            presentationProgress: k,
-                            presentationDurationInFrames: p.props.timing.getDurationInFrames(
-                              { fps: t }
+                            presentationProgress: q,
+                            presentationDurationInFrames: f.props.timing.getDurationInFrames(
+                              { fps: e }
                             ),
                             onElementImage: () => {
                             },
@@ -460,7 +460,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
                             children: /* @__PURE__ */ o(
                               K,
                               {
-                                presentationProgress: k,
+                                presentationProgress: q,
                                 children: a
                               }
                             )
@@ -477,28 +477,28 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
           i
         );
       }
-      if (k !== null && p) {
-        const v = p.props.timing.getDurationInFrames({ fps: t }) / 2, x = p.props.presentation ?? N(), I = x.component, S = e < m + v, q = S ? Math.floor(m) : Math.floor(m) + v, U = e > q;
+      if (q !== null && f) {
+        const F = f.props.timing.getDurationInFrames({ fps: e }) / 2, x = f.props.presentation ?? X(), I = x.component, S = t < h + F, R = S ? Math.floor(h) : Math.floor(h) + F, Y = t > R;
         return /* @__PURE__ */ o(
-          Y,
+          z,
           {
-            active: U && S,
-            frame: q,
+            active: Y && S,
+            frame: R,
             children: /* @__PURE__ */ o(
-              M,
+              L,
               {
-                from: q,
-                durationInFrames: w,
-                ...F,
-                name: F.name || "<TS.Sequence>",
+                from: R,
+                durationInFrames: $,
+                ...v,
+                name: v.name || "<TS.Sequence>",
                 children: /* @__PURE__ */ o(
                   I,
                   {
                     passedProps: x.props ?? {},
                     presentationDirection: "entering",
-                    presentationProgress: k,
-                    presentationDurationInFrames: p.props.timing.getDurationInFrames(
-                      { fps: t }
+                    presentationProgress: q,
+                    presentationDurationInFrames: f.props.timing.getDurationInFrames(
+                      { fps: e }
                     ),
                     onElementImage: () => {
                     },
@@ -508,7 +508,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
                     children: /* @__PURE__ */ o(
                       K,
                       {
-                        presentationProgress: k,
+                        presentationProgress: q,
                         children: a
                       }
                     )
@@ -521,28 +521,28 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
           i
         );
       }
-      if (O !== null && g) {
-        const v = g.props.timing.getDurationInFrames({ fps: t }) / 2, x = g.props.presentation ?? N(), I = x.component, S = e > Math.floor(b) + Math.floor(m), q = e < Math.floor(b) + Math.floor(m) + v;
+      if (U !== null && p) {
+        const F = p.props.timing.getDurationInFrames({ fps: e }) / 2, x = p.props.presentation ?? X(), I = x.component, S = t > Math.floor(T) + Math.floor(h), R = t < Math.floor(T) + Math.floor(h) + F;
         return /* @__PURE__ */ o(
-          Y,
+          z,
           {
-            active: q && S,
-            frame: Math.floor(b),
+            active: R && S,
+            frame: Math.floor(T),
             children: /* @__PURE__ */ o(
-              M,
+              L,
               {
-                from: Math.floor(m),
-                durationInFrames: w + v,
-                ...F,
-                name: F.name || "<TS.Sequence>",
+                from: Math.floor(h),
+                durationInFrames: $ + F,
+                ...v,
+                name: v.name || "<TS.Sequence>",
                 children: /* @__PURE__ */ o(
                   I,
                   {
                     passedProps: x.props ?? {},
                     presentationDirection: "exiting",
-                    presentationProgress: O,
-                    presentationDurationInFrames: g.props.timing.getDurationInFrames(
-                      { fps: t }
+                    presentationProgress: U,
+                    presentationDurationInFrames: p.props.timing.getDurationInFrames(
+                      { fps: e }
                     ),
                     onElementImage: () => {
                     },
@@ -552,7 +552,7 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
                     children: /* @__PURE__ */ o(
                       G,
                       {
-                        presentationProgress: O,
+                        presentationProgress: U,
                         children: a
                       }
                     )
@@ -566,157 +566,196 @@ const ne = C.createContext(null), re = C.createContext(null), K = ({ presentatio
         );
       }
       return /* @__PURE__ */ o(
-        M,
+        L,
         {
-          from: Math.floor(m),
-          durationInFrames: w,
-          ...F,
-          name: F.name || "<TS.Sequence>",
+          from: Math.floor(h),
+          durationInFrames: $,
+          ...v,
+          name: v.name || "<TS.Sequence>",
           children: a
         },
         i
       );
     });
-  }, [n, t, e]);
-  return /* @__PURE__ */ o(ee, { children: r });
-}, y = ({ children: n, name: t, layout: e, ...r }) => /* @__PURE__ */ o(M, { name: t ?? "<TransitionSeries>", layout: e ?? "absolute-fill", ...r, children: /* @__PURE__ */ o(Me, { children: n }) });
-y.Sequence = z;
-y.Transition = L;
-Z.addSequenceStackTraces(y);
-Z.addSequenceStackTraces(z);
-const lt = () => {
-  const n = C.useContext(ne), t = C.useContext(re);
-  return !n && !t ? {
+  }, [n, e, t]);
+  return /* @__PURE__ */ o(tt, { children: r });
+}, w = ({ children: n, name: e, layout: t, ...r }) => /* @__PURE__ */ o(L, { name: e ?? "<TransitionSeries>", layout: t ?? "absolute-fill", ...r, children: /* @__PURE__ */ o(Mt, { children: n }) });
+w.Sequence = _;
+w.Transition = N;
+Z.addSequenceStackTraces(w);
+Z.addSequenceStackTraces(_);
+const ce = () => {
+  const n = M.useContext(nt), e = M.useContext(rt);
+  return !n && !e ? {
     isInTransitionSeries: !1,
     entering: 1,
     exiting: 0
   } : {
     isInTransitionSeries: !0,
     entering: (n == null ? void 0 : n.enteringProgress) ?? 1,
-    exiting: (t == null ? void 0 : t.exitingProgress) ?? 0
+    exiting: (e == null ? void 0 : e.exitingProgress) ?? 0
   };
-}, Le = ({
+}, Lt = ({
   children: n,
-  presentationDirection: t,
-  presentationProgress: e,
+  presentationDirection: e,
+  presentationProgress: t,
   passedProps: r
 }) => {
-  const l = Math.sqrt(r.width ** 2 + r.height ** 2) / 2 * e, u = Be(
+  const l = Math.sqrt(r.width ** 2 + r.height ** 2) / 2 * t, c = Wt(
     r.width / 2,
     r.height / 2,
     l
-  ), [a] = A(() => String(B(null))), i = h(() => ({
+  ), [a] = B(() => String(W(null))), i = g(() => ({
     width: "100%",
     height: "100%",
-    clipPath: t === "exiting" ? void 0 : `url(#${a})`
-  }), [a, t]);
-  return /* @__PURE__ */ W(c, { children: [
-    /* @__PURE__ */ o(c, { style: i, children: n }),
-    t === "exiting" ? null : /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o("svg", { width: r.width, height: r.height, children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: a, children: /* @__PURE__ */ o("path", { d: u, fill: "black" }) }) }) }) })
+    clipPath: e === "exiting" ? void 0 : `url(#${a})`
+  }), [a, e]);
+  return /* @__PURE__ */ C(u, { children: [
+    /* @__PURE__ */ o(u, { style: i, children: n }),
+    e === "exiting" ? null : /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o("svg", { width: r.width, height: r.height, children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: a, children: /* @__PURE__ */ o("path", { d: c, fill: "black" }) }) }) }) })
   ] });
-}, Ne = (n) => ({ component: Le, props: n }), Be = (n, t, e) => `M ${n}, ${t}
-            m -${e}, 0
-            a ${e},${e} 0 1,0 ${e * 2},0
-            a ${e},${e} 0 1,0 -${e * 2},0`, We = ({
+}, Nt = (n) => ({ component: Lt, props: n }), Wt = (n, e, t) => `M ${n}, ${e}
+            m -${t}, 0
+            a ${t},${t} 0 1,0 ${t * 2},0
+            a ${t},${t} 0 1,0 -${t * 2},0`, Bt = ({
   children: n,
-  presentationDirection: t,
-  presentationProgress: e,
+  presentationDirection: e,
+  presentationProgress: t,
+  passedProps: r
+}) => {
+  const { width: s, height: l } = r, c = -s * 0.35, a = l * 0.52, i = Math.sqrt((s - c) ** 2 + Math.max(a, l - a) ** 2), d = s * 0.3, m = d + (i - d + s * 0.1) * t, [y] = B(() => String(W(null))), f = Math.max(3, Math.round(s * 7e-3)), p = Math.max(0, m - f / 2), A = g(() => ({
+    width: "100%",
+    height: "100%",
+    clipPath: e === "exiting" ? void 0 : `url(#${y})`
+  }), [y, e]);
+  return /* @__PURE__ */ C(u, { children: [
+    /* @__PURE__ */ o(u, { style: A, children: n }),
+    e === "exiting" ? null : /* @__PURE__ */ o(u, { style: { pointerEvents: "none" }, children: /* @__PURE__ */ C(
+      "svg",
+      {
+        width: s,
+        height: l,
+        style: { position: "absolute", inset: 0, width: "100%", height: "100%" },
+        children: [
+          /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: y, children: /* @__PURE__ */ o("circle", { cx: c, cy: a, r: m, fill: "black" }) }) }),
+          t > 0 && t < 1 && /* @__PURE__ */ o(
+            "circle",
+            {
+              cx: c,
+              cy: a,
+              r: p,
+              fill: "none",
+              stroke: "#1e3a8a",
+              strokeWidth: f
+            }
+          )
+        ]
+      }
+    ) })
+  ] });
+}, ue = (n) => ({
+  component: Bt,
+  props: n
+}), At = ({
+  children: n,
+  presentationDirection: e,
+  presentationProgress: t,
   passedProps: r
 }) => {
-  const { width: s, height: l } = r, u = s * e, a = l * e, i = s / 2 - u / 2, f = l / 2 - a / 2, [d] = A(() => String(B(null))), $ = h(() => ({
+  const { width: s, height: l } = r, c = s * t, a = l * t, i = s / 2 - c / 2, d = l / 2 - a / 2, [m] = B(() => String(W(null))), y = g(() => ({
     width: "100%",
     height: "100%",
-    clipPath: t === "exiting" ? void 0 : `url(#${d})`
-  }), [d, t]);
-  return /* @__PURE__ */ W(c, { children: [
-    /* @__PURE__ */ o(c, { style: $, children: n }),
-    t === "exiting" ? null : /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: d, children: /* @__PURE__ */ o(
+    clipPath: e === "exiting" ? void 0 : `url(#${m})`
+  }), [m, e]);
+  return /* @__PURE__ */ C(u, { children: [
+    /* @__PURE__ */ o(u, { style: y, children: n }),
+    e === "exiting" ? null : /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: m, children: /* @__PURE__ */ o(
       "rect",
       {
         x: i,
-        y: f,
-        width: u,
+        y: d,
+        width: c,
         height: a,
         fill: "black"
       }
     ) }) }) }) })
   ] });
-}, Ae = (n) => ({ component: We, props: n }), Xe = ({
+}, Xt = (n) => ({ component: At, props: n }), Ot = ({
   children: n,
-  presentationDirection: t,
-  presentationProgress: e,
+  presentationDirection: e,
+  presentationProgress: t,
   passedProps: r
 }) => {
-  const s = Math.sqrt(r.width ** 2 + r.height ** 2) / 2, l = s * e, u = s * 2 * e, { path: a } = ge({
+  const s = Math.sqrt(r.width ** 2 + r.height ** 2) / 2, l = s * t, c = s * 2 * t, { path: a } = gt({
     innerRadius: l,
-    outerRadius: u,
+    outerRadius: c,
     points: 5
-  }), i = he(a), f = te(
+  }), i = pt(a), d = et(
     a,
     r.width / 2 - i.width / 2,
     r.height / 2 - i.height / 2
-  ), [d] = A(() => String(B(null))), $ = h(() => ({
+  ), [m] = B(() => String(W(null))), y = g(() => ({
     width: "100%",
     height: "100%",
-    clipPath: t === "exiting" ? void 0 : `url(#${d})`
-  }), [d, t]);
-  return /* @__PURE__ */ W(c, { children: [
-    /* @__PURE__ */ o(c, { style: $, children: n }),
-    t === "exiting" ? null : /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: d, children: /* @__PURE__ */ o("path", { d: f, fill: "black" }) }) }) }) })
+    clipPath: e === "exiting" ? void 0 : `url(#${m})`
+  }), [m, e]);
+  return /* @__PURE__ */ C(u, { children: [
+    /* @__PURE__ */ o(u, { style: y, children: n }),
+    e === "exiting" ? null : /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: m, children: /* @__PURE__ */ o("path", { d, fill: "black" }) }) }) }) })
   ] });
-}, Oe = (n) => ({ component: Xe, props: n }), Ue = ({
+}, Ut = (n) => ({ component: Ot, props: n }), Yt = ({
   children: n,
-  presentationDirection: t,
-  presentationProgress: e,
+  presentationDirection: e,
+  presentationProgress: t,
   passedProps: r
 }) => {
-  const { width: s, height: l } = r, u = s * e, a = s / 2 - u / 2, [i] = A(() => String(B(null))), f = h(() => ({
+  const { width: s, height: l } = r, c = s * t, a = s / 2 - c / 2, [i] = B(() => String(W(null))), d = g(() => ({
     width: "100%",
     height: "100%",
-    clipPath: t === "exiting" ? void 0 : `url(#${i})`
-  }), [i, t]);
-  return /* @__PURE__ */ W(c, { children: [
-    /* @__PURE__ */ o(c, { style: f, children: n }),
-    t === "exiting" ? null : /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: i, children: /* @__PURE__ */ o(
+    clipPath: e === "exiting" ? void 0 : `url(#${i})`
+  }), [i, e]);
+  return /* @__PURE__ */ C(u, { children: [
+    /* @__PURE__ */ o(u, { style: d, children: n }),
+    e === "exiting" ? null : /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o("svg", { children: /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: i, children: /* @__PURE__ */ o(
       "rect",
       {
         x: a,
         y: 0,
-        width: u,
+        width: c,
         height: l,
         fill: "black"
       }
     ) }) }) }) })
   ] });
-}, Ye = (n) => ({ component: Ue, props: n });
-var De = ({ children: n, presentationDirection: t, presentationProgress: e, passedProps: r }) => {
-  const s = t === "entering", l = h(() => ({
-    opacity: s ? e : r.shouldFadeOutExitingScene ? 1 - e : 1,
-    ...t === "entering" ? r.enterStyle : r.exitStyle
+}, zt = (n) => ({ component: Yt, props: n });
+var Dt = ({ children: n, presentationDirection: e, presentationProgress: t, passedProps: r }) => {
+  const s = e === "entering", l = g(() => ({
+    opacity: s ? t : r.shouldFadeOutExitingScene ? 1 - t : 1,
+    ...e === "entering" ? r.enterStyle : r.exitStyle
   }), [
     s,
     r.enterStyle,
     r.exitStyle,
     r.shouldFadeOutExitingScene,
-    t,
-    e
+    e,
+    t
   ]);
-  return /* @__PURE__ */ o(c, {
+  return /* @__PURE__ */ o(u, {
     style: l,
     children: n
   });
 }, Q = (n) => ({
-  component: De,
+  component: Dt,
   props: n ?? {}
-}), ze = 0.01, _e = ({
+}), _t = 0.01, jt = ({
   children: n,
-  presentationProgress: t,
-  presentationDirection: e,
+  presentationProgress: e,
+  presentationDirection: t,
   passedProps: { direction: r = "from-left", enterStyle: s, exitStyle: l }
 }) => {
-  const u = h(() => {
-    const i = t === 1 ? t * 100 : t * 100 - ze;
-    if (e === "exiting")
+  const c = g(() => {
+    const i = e === 1 ? e * 100 : e * 100 - _t;
+    if (t === "exiting")
       switch (r) {
         case "from-left":
           return {
@@ -724,7 +763,7 @@ var De = ({ children: n, presentationDirection: t, presentationProgress: e, pass
           };
         case "from-right":
           return {
-            transform: `translateX(${-t * 100}%)`
+            transform: `translateX(${-e * 100}%)`
           };
         case "from-top":
           return {
@@ -732,7 +771,7 @@ var De = ({ children: n, presentationDirection: t, presentationProgress: e, pass
           };
         case "from-bottom":
           return {
-            transform: `translateY(${-t * 100}%)`
+            transform: `translateY(${-e * 100}%)`
           };
         default:
           throw new Error(`Invalid direction: ${r}`);
@@ -740,7 +779,7 @@ var De = ({ children: n, presentationDirection: t, presentationProgress: e, pass
     switch (r) {
       case "from-left":
         return {
-          transform: `translateX(${-100 + t * 100}%)`
+          transform: `translateX(${-100 + e * 100}%)`
         };
       case "from-right":
         return {
@@ -748,7 +787,7 @@ var De = ({ children: n, presentationDirection: t, presentationProgress: e, pass
         };
       case "from-top":
         return {
-          transform: `translateY(${-100 + t * 100}%)`
+          transform: `translateY(${-100 + e * 100}%)`
         };
       case "from-bottom":
         return {
@@ -757,264 +796,265 @@ var De = ({ children: n, presentationDirection: t, presentationProgress: e, pass
       default:
         throw new Error(`Invalid direction: ${r}`);
     }
-  }, [e, t, r]), a = h(() => ({
+  }, [t, e, r]), a = g(() => ({
     width: "100%",
     height: "100%",
     justifyContent: "center",
     alignItems: "center",
-    ...u,
-    ...e === "entering" ? s : l
-  }), [u, s, l, e]);
-  return /* @__PURE__ */ o(c, {
+    ...c,
+    ...t === "entering" ? s : l
+  }), [c, s, l, t]);
+  return /* @__PURE__ */ o(u, {
     style: a,
     children: n
   });
-}, je = (n) => ({
-  component: _e,
+}, Vt = (n) => ({
+  component: jt,
   props: n ?? {}
-}), Ve = (n, t) => {
-  const e = n * 100;
-  switch (t) {
+}), Ht = (n, e) => {
+  const t = n * 100;
+  switch (e) {
     case "from-left":
-      return `polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;
+      return `polygon(0% 0%, ${t}% 0%, ${t}% 100%, 0% 100%)`;
     case "from-top-left":
-      return `polygon(0% 0%, ${e * 2}% 0%, 0% ${e * 2}%)`;
+      return `polygon(0% 0%, ${t * 2}% 0%, 0% ${t * 2}%)`;
     case "from-top":
-      return `polygon(0% 0%, 100% 0%, 100% ${e}%, 0% ${e}%)`;
+      return `polygon(0% 0%, 100% 0%, 100% ${t}%, 0% ${t}%)`;
     case "from-top-right":
-      return `polygon(100% 0%, ${100 - e * 2}% 0%, 100% ${e * 2}%)`;
+      return `polygon(100% 0%, ${100 - t * 2}% 0%, 100% ${t * 2}%)`;
     case "from-right":
-      return `polygon(100% 0%, 100% 100%, ${100 - e}% 100%, ${100 - e}% 0%)`;
+      return `polygon(100% 0%, 100% 100%, ${100 - t}% 100%, ${100 - t}% 0%)`;
     case "from-bottom-right":
-      return `polygon(100% 100%, ${100 - e * 2}% 100%, 100% ${100 - e * 2}%)`;
+      return `polygon(100% 100%, ${100 - t * 2}% 100%, 100% ${100 - t * 2}%)`;
     case "from-bottom":
-      return `polygon(0% 100%, 100% 100%, 100% ${100 - e}%, 0% ${100 - e}%)`;
+      return `polygon(0% 100%, 100% 100%, 100% ${100 - t}%, 0% ${100 - t}%)`;
     case "from-bottom-left":
-      return `polygon(0% 100%, 0% ${100 - e * 2}%, ${e * 2}% 100%)`;
+      return `polygon(0% 100%, 0% ${100 - t * 2}%, ${t * 2}% 100%)`;
     default:
-      throw new Error(`Unknown direction ${JSON.stringify(t)}`);
+      throw new Error(`Unknown direction ${JSON.stringify(e)}`);
   }
-}, He = (n, t) => {
-  const e = n * 100;
-  switch (t) {
+}, Jt = (n, e) => {
+  const t = n * 100;
+  switch (e) {
     case "from-left":
-      return `polygon(100% 100%, ${100 - e}% 100%, ${100 - e}% 0%, 100% 0%)`;
+      return `polygon(100% 100%, ${100 - t}% 100%, ${100 - t}% 0%, 100% 0%)`;
     case "from-top-left":
-      return `polygon(100% 100%, ${100 - e * 2}% 100%, 100% ${100 - e * 2}%)`;
+      return `polygon(100% 100%, ${100 - t * 2}% 100%, 100% ${100 - t * 2}%)`;
     case "from-top":
-      return `polygon(100% 100%, 0% 100%, 0% ${100 - e}%, 100% ${100 - e}%)`;
+      return `polygon(100% 100%, 0% 100%, 0% ${100 - t}%, 100% ${100 - t}%)`;
     case "from-top-right":
-      return `polygon(0% 100%, ${e * 2}% 100%, 0% ${100 - e * 2}%)`;
+      return `polygon(0% 100%, ${t * 2}% 100%, 0% ${100 - t * 2}%)`;
     case "from-right":
-      return `polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;
+      return `polygon(0% 0%, ${t}% 0%, ${t}% 100%, 0% 100%)`;
     case "from-bottom-right":
-      return `polygon(0% 0%, ${e * 2}% 0%, 0% ${e * 2}%)`;
+      return `polygon(0% 0%, ${t * 2}% 0%, 0% ${t * 2}%)`;
     case "from-bottom":
-      return `polygon(100% 0%, 0% 0%, 0% ${e}%, 100% ${e}%)`;
+      return `polygon(100% 0%, 0% 0%, 0% ${t}%, 100% ${t}%)`;
     case "from-bottom-left":
-      return `polygon(100% 0%, ${100 - e * 2}% 0%, 100% ${e * 2}%)`;
+      return `polygon(100% 0%, ${100 - t * 2}% 0%, 100% ${t * 2}%)`;
     default:
-      throw new Error(`Unknown direction ${JSON.stringify(t)}`);
+      throw new Error(`Unknown direction ${JSON.stringify(e)}`);
   }
-}, Je = ({
+}, Kt = ({
   children: n,
-  presentationProgress: t,
-  presentationDirection: e,
+  presentationProgress: e,
+  presentationDirection: t,
   passedProps: {
     direction: r = "from-left",
     innerEnterStyle: s,
     innerExitStyle: l,
-    outerEnterStyle: u,
+    outerEnterStyle: c,
     outerExitStyle: a
   }
 }) => {
-  const i = e === "entering" ? t : 1 - t, f = e === "entering" ? Ve(i, r) : He(i, r), d = h(() => ({
+  const i = t === "entering" ? e : 1 - e, d = t === "entering" ? Ht(i, r) : Jt(i, r), m = g(() => ({
     width: "100%",
     height: "100%",
     justifyContent: "center",
     alignItems: "center",
-    clipPath: f,
-    ...e === "entering" ? s : l
-  }), [f, s, l, e]), $ = h(() => e === "entering" ? u : a, [u, a, e]);
-  return /* @__PURE__ */ o(c, {
-    style: $,
-    children: /* @__PURE__ */ o(c, {
-      style: d,
+    clipPath: d,
+    ...t === "entering" ? s : l
+  }), [d, s, l, t]), y = g(() => t === "entering" ? c : a, [c, a, t]);
+  return /* @__PURE__ */ o(u, {
+    style: y,
+    children: /* @__PURE__ */ o(u, {
+      style: m,
       children: n
     })
   });
-}, Ke = (n) => ({
-  component: Je,
+}, Gt = (n) => ({
+  component: Kt,
   props: n ?? {}
-}), Ge = ({
+}), Qt = ({
   children: n,
-  presentationDirection: t,
-  presentationProgress: e,
+  presentationDirection: e,
+  presentationProgress: t,
   passedProps: {
     direction: r = "from-left",
     perspective: s = 1e3,
     innerEnterStyle: l,
-    innerExitStyle: u,
+    innerExitStyle: c,
     outerEnterStyle: a,
     outerExitStyle: i
   }
 }) => {
-  const f = h(() => {
-    const g = t === "entering" ? D(e, [0, 1], [r === "from-right" || r === "from-top" ? 180 : -180, 0]) : D(e, [0, 1], [0, r === "from-right" || r === "from-top" ? -180 : 180]);
+  const d = g(() => {
+    const p = e === "entering" ? D(t, [0, 1], [r === "from-right" || r === "from-top" ? 180 : -180, 0]) : D(t, [0, 1], [0, r === "from-right" || r === "from-top" ? -180 : 180]);
     return {
       width: "100%",
       height: "100%",
-      transform: `${r === "from-top" || r === "from-bottom" ? "rotateX" : "rotateY"}(${g}deg)`,
+      transform: `${r === "from-top" || r === "from-bottom" ? "rotateX" : "rotateY"}(${p}deg)`,
       backfaceVisibility: "hidden",
       WebkitBackfaceVisibility: "hidden",
-      ...t === "entering" ? l : u
+      ...e === "entering" ? l : c
     };
   }, [
     r,
     l,
-    u,
-    t,
-    e
-  ]), d = h(() => ({
+    c,
+    e,
+    t
+  ]), m = g(() => ({
     perspective: s,
     transformStyle: "preserve-3d",
-    ...t === "entering" ? a : i
-  }), [a, i, s, t]);
-  return /* @__PURE__ */ o(c, {
-    style: d,
-    children: /* @__PURE__ */ o(c, {
-      style: f,
+    ...e === "entering" ? a : i
+  }), [a, i, s, e]);
+  return /* @__PURE__ */ o(u, {
+    style: m,
+    children: /* @__PURE__ */ o(u, {
+      style: d,
       children: n
     })
   });
-}, Qe = (n) => ({ component: Ge, props: n ?? {} }), Ze = ({ children: n, presentationDirection: t, presentationProgress: e, passedProps: r }) => {
-  const s = Math.sqrt(r.width ** 2 + r.height ** 2) / 2, { path: l } = ye({
+}, Zt = (n) => ({ component: Qt, props: n ?? {} }), te = ({ children: n, presentationDirection: e, presentationProgress: t, passedProps: r }) => {
+  const s = Math.sqrt(r.width ** 2 + r.height ** 2) / 2, { path: l } = yt({
     radius: s,
-    progress: e
-  }), u = te(l, -(s * 2 - r.width) / 2, -(s * 2 - r.height) / 2), a = h(() => ({
+    progress: t
+  }), c = et(l, -(s * 2 - r.width) / 2, -(s * 2 - r.height) / 2), a = g(() => ({
     width: "100%",
     height: "100%",
-    clipPath: t === "exiting" ? void 0 : `path("${u}")`,
-    ...t === "entering" ? r.innerEnterStyle : r.innerExitStyle
+    clipPath: e === "exiting" ? void 0 : `path("${c}")`,
+    ...e === "entering" ? r.innerEnterStyle : r.innerExitStyle
   }), [
-    u,
+    c,
     r.innerEnterStyle,
     r.innerExitStyle,
-    t
-  ]), i = h(() => t === "entering" ? r.outerEnterStyle : r.outerExitStyle, [
+    e
+  ]), i = g(() => e === "entering" ? r.outerEnterStyle : r.outerExitStyle, [
     r.outerEnterStyle,
     r.outerExitStyle,
-    t
+    e
   ]);
-  return /* @__PURE__ */ o(c, {
+  return /* @__PURE__ */ o(u, {
     style: i,
-    children: /* @__PURE__ */ o(c, {
+    children: /* @__PURE__ */ o(u, {
       style: a,
       children: n
     })
   });
-}, et = (n) => ({ component: Ze, props: n ?? {} });
-const ut = {
+}, ee = (n) => ({ component: te, props: n ?? {} });
+const me = {
   none: ({ id: n }) => /* @__PURE__ */ o(
-    y.Transition,
+    w.Transition,
     {
       presentation: Q(),
-      timing: T({ durationInFrames: 1 })
+      timing: b({ durationInFrames: 1 })
     },
     n
   ),
-  fade: ({ durationInFrames: n, id: t }) => /* @__PURE__ */ o(
-    y.Transition,
+  fade: ({ durationInFrames: n, id: e }) => /* @__PURE__ */ o(
+    w.Transition,
     {
       presentation: Q(),
-      timing: T({ durationInFrames: n })
+      timing: b({ durationInFrames: n })
     },
-    t
+    e
   ),
-  slide: ({ durationInFrames: n, id: t, direction: e }) => /* @__PURE__ */ o(
-    y.Transition,
+  slide: ({ durationInFrames: n, id: e, direction: t }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: je({ direction: e }),
-      timing: T({ durationInFrames: n })
+      presentation: Vt({ direction: t }),
+      timing: b({ durationInFrames: n })
     },
-    t
+    e
   ),
-  wipe: ({ durationInFrames: n, id: t, direction: e }) => /* @__PURE__ */ o(
-    y.Transition,
+  wipe: ({ durationInFrames: n, id: e, direction: t }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: Ke({ direction: e }),
-      timing: T({ durationInFrames: n })
+      presentation: Gt({ direction: t }),
+      timing: b({ durationInFrames: n })
     },
-    t
+    e
   ),
-  flip: ({ durationInFrames: n, id: t }) => /* @__PURE__ */ o(
-    y.Transition,
+  flip: ({ durationInFrames: n, id: e }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: Qe(),
-      timing: T({ durationInFrames: n })
+      presentation: Zt(),
+      timing: b({ durationInFrames: n })
     },
-    t
+    e
   ),
-  clockWipe: ({ width: n, height: t, durationInFrames: e, id: r }) => /* @__PURE__ */ o(
-    y.Transition,
+  clockWipe: ({ width: n, height: e, durationInFrames: t, id: r }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: et({ width: n, height: t }),
-      timing: T({ durationInFrames: e })
+      presentation: ee({ width: n, height: e }),
+      timing: b({ durationInFrames: t })
     },
     r
   ),
-  star: ({ width: n, height: t, durationInFrames: e, id: r }) => /* @__PURE__ */ o(
-    y.Transition,
+  star: ({ width: n, height: e, durationInFrames: t, id: r }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: Oe({ width: n, height: t }),
-      timing: T({ durationInFrames: e })
+      presentation: Ut({ width: n, height: e }),
+      timing: b({ durationInFrames: t })
     },
     r
   ),
-  circle: ({ width: n, height: t, durationInFrames: e, id: r }) => /* @__PURE__ */ o(
-    y.Transition,
+  circle: ({ width: n, height: e, durationInFrames: t, id: r }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: Ne({ width: n, height: t }),
-      timing: T({ durationInFrames: e })
+      presentation: Nt({ width: n, height: e }),
+      timing: b({ durationInFrames: t })
     },
     r
   ),
-  rectangle: ({ width: n, height: t, durationInFrames: e, id: r }) => /* @__PURE__ */ o(
-    y.Transition,
+  rectangle: ({ width: n, height: e, durationInFrames: t, id: r }) => /* @__PURE__ */ o(
+    w.Transition,
     {
-      presentation: Ae({ width: n, height: t }),
-      timing: T({ durationInFrames: e })
+      presentation: Xt({ width: n, height: e }),
+      timing: b({ durationInFrames: t })
     },
     r
   ),
   slidingDoors: ({
     width: n,
-    height: t,
-    durationInFrames: e,
+    height: e,
+    durationInFrames: t,
     id: r
   }) => /* @__PURE__ */ o(
-    y.Transition,
+    w.Transition,
     {
-      presentation: Ye({ width: n, height: t }),
-      timing: T({ durationInFrames: e })
+      presentation: zt({ width: n, height: e }),
+      timing: b({ durationInFrames: t })
     },
     r
   )
 };
 export {
-  y as TransitionSeries,
-  ut as Transitions,
-  Ne as circle,
-  et as clockWipe,
+  w as TransitionSeries,
+  me as Transitions,
+  Nt as circle,
+  ue as circleReveal,
+  ee as clockWipe,
   Q as fade,
-  Qe as flip,
-  T as linearTiming,
-  Ae as rectangle,
-  je as slide,
-  Ye as slidingDoors,
-  at as springTiming,
-  Oe as star,
-  lt as useTransitionProgress,
-  Ke as wipe
+  Zt as flip,
+  b as linearTiming,
+  Xt as rectangle,
+  Vt as slide,
+  zt as slidingDoors,
+  le as springTiming,
+  Ut as star,
+  ce as useTransitionProgress,
+  Gt as wipe
 };
 //# sourceMappingURL=index.es.js.map