@ssgoi/core 2.5.4 → 2.5.6

package/dist/view-transitions/index.js

@@ -1,25 +1,25 @@
-import { p as m, g as L } from "../jaemin-BAi8PTrj.js";
-import { a as qt } from "../jaemin-BAi8PTrj.js";
+import { p as m, g as L } from "../jaemin-BWkrXq0V.js";
+import { a as Vt } from "../jaemin-BWkrXq0V.js";
 const U = (t) => new Promise((n) => setTimeout(n, t));
-function G(t, n = 0) {
+function q(t, n = 0) {
   const i = Math.pow(10, n);
   return Math.round(t * i) / i;
 }
-const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K = 300, Z = 10, J = "horizontal", Q = "#000000", Dt = (t = {}) => {
+const G = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K = 300, Z = 10, J = "horizontal", Q = "#000000", Dt = (t = {}) => {
   const {
     inSpring: n = j,
-    outSpring: i = V,
+    outSpring: i = G,
     transitionDelay: d = K,
     blindCount: r = Z,
-    direction: s = J,
-    staggerDelay: h = 100,
+    direction: l = J,
+    staggerDelay: c = 100,
     blindColor: e = Q
   } = t;
-  let a, o = null;
-  const l = (p, g, u = "left") => {
+  let o, s = null;
+  const a = (p, g, u = "left") => {
     window.getComputedStyle(p).position === "static" && (p.style.position = "relative");
-    const c = document.createElement("div");
-    c.className = "blind-container", c.style.cssText = `
+    const h = document.createElement("div");
+    h.className = "blind-container", h.style.cssText = `
       position: absolute;
       top: 0;
       left: 0;
@@ -32,7 +32,7 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
     const f = [];
     for (let $ = 0; $ < r; $++) {
       const x = document.createElement("div");
-      if (s === "horizontal") {
+      if (l === "horizontal") {
         const w = 100 / r, T = `calc(${w}% + 1px)`;
         x.style.cssText = `
           position: absolute;
@@ -59,35 +59,35 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
           will-change: transform;
         `;
       }
-      f.push(x), c.appendChild(x);
+      f.push(x), h.appendChild(x);
     }
-    return p.appendChild(c), { container: c, blinds: f };
+    return p.appendChild(h), { container: h, blinds: f };
   };
   return {
     out: () => {
       let p = null;
-      return a = new Promise((u) => {
-        o = u;
+      return o = new Promise((u) => {
+        s = u;
       }), {
         springs: Array.from({ length: r }, (u, y) => ({
           from: 0,
           to: 1,
           spring: i,
-          offset: y * h,
-          tick: (c) => {
+          offset: y * c,
+          tick: (h) => {
             if (!p) return;
             const f = p.blinds[y];
-            f && (s === "horizontal" ? f.style.transform = `scaleX(${c})` : f.style.transform = `scaleY(${c})`);
+            f && (l === "horizontal" ? f.style.transform = `scaleX(${h})` : f.style.transform = `scaleY(${h})`);
           }
         })),
         schedule: "chain",
         prepare: (u) => {
-          m(u), u.style.zIndex = "1000", p = l(u, "hidden", "left");
+          m(u), u.style.zIndex = "1000", p = a(u, "hidden", "left");
         },
         onStart: () => {
         },
         onEnd: () => {
-          o && o();
+          s && s();
         }
       };
     },
@@ -98,21 +98,21 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
           from: 1,
           to: 0,
           spring: n,
-          offset: y * h,
-          tick: (c) => {
+          offset: y * c,
+          tick: (h) => {
             if (!p) return;
             const f = p.blinds[y];
-            f && (s === "horizontal" ? f.style.transform = `scaleX(${c})` : f.style.transform = `scaleY(${c})`);
+            f && (l === "horizontal" ? f.style.transform = `scaleX(${h})` : f.style.transform = `scaleY(${h})`);
           }
         })),
         schedule: "chain",
         prepare: (u) => {
-          u.style.position = "relative", u.style.zIndex = "0", p = l(u, "closed", "right");
+          u.style.position = "relative", u.style.zIndex = "0", p = a(u, "closed", "right");
         },
         onStart: () => {
         },
         wait: async () => {
-          a && await a, await U(d);
+          o && await o, await U(d);
         },
         onEnd: () => {
           p && p.container && p.container.remove();
@@ -127,53 +127,65 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
   stiffness: 100,
   damping: 20
 }, vt = (t = {}) => {
-  var s, h;
+  var l, c;
   const { opacity: n = !1, direction: i = "enter" } = t, d = i === "enter" ? R : tt, r = {
-    stiffness: ((s = t.spring) == null ? void 0 : s.stiffness) ?? d.stiffness,
-    damping: ((h = t.spring) == null ? void 0 : h.damping) ?? d.damping
+    stiffness: ((l = t.spring) == null ? void 0 : l.stiffness) ?? d.stiffness,
+    damping: ((c = t.spring) == null ? void 0 : c.damping) ?? d.damping
   };
   return i === "enter" ? {
     in: (e) => ({
       spring: r,
       prepare: () => {
-        e.style.willChange = n ? "transform, opacity" : "transform";
+        e.style.willChange = n ? "transform, opacity" : "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint";
       },
-      tick: (a) => {
-        e.style.transform = `translateX(${(1 - a) * 100}%)`, n && (e.style.opacity = a.toString());
+      css: (o) => {
+        const s = {
+          transform: `translate3d(${(1 - o) * 100}%, 0, 0)`
+        };
+        return n && (s.opacity = o), s;
       },
       onEnd: () => {
-        e.style.willChange = "auto";
+        e.style.willChange = "auto", e.style.backfaceVisibility = "", e.style.contain = "";
       }
     }),
-    out: (e, a) => ({
+    out: (e, o) => ({
       spring: r,
-      prepare: (o) => {
-        m(o, a), o.style.zIndex = "-1", o.style.willChange = n ? "transform, opacity" : "transform";
+      prepare: (s) => {
+        m(s, o), s.style.zIndex = "-1", s.style.willChange = n ? "transform, opacity" : "transform", s.style.backfaceVisibility = "hidden", s.style.contain = "layout paint", s.style.pointerEvents = "none";
       },
-      tick: (o) => {
-        e.style.transform = `translateX(${-(1 - o) * 20}%)`, n && (e.style.opacity = o.toString());
+      css: (s) => {
+        const a = {
+          transform: `translate3d(${-(1 - s) * 20}%, 0, 0)`
+        };
+        return n && (a.opacity = s), a;
       }
     })
   } : {
     in: (e) => ({
       spring: r,
       prepare: () => {
-        e.style.willChange = n ? "transform, opacity" : "transform";
+        e.style.willChange = n ? "transform, opacity" : "transform", e.style.backfaceVisibility = "hidden", e.style.contain = "layout paint";
       },
-      tick: (a) => {
-        e.style.transform = `translateX(${-(1 - a) * 20}%)`, n && (e.style.opacity = a.toString());
+      css: (o) => {
+        const s = {
+          transform: `translate3d(${-(1 - o) * 20}%, 0, 0)`
+        };
+        return n && (s.opacity = o), s;
       },
       onEnd: () => {
-        e.style.willChange = "auto";
+        e.style.willChange = "auto", e.style.backfaceVisibility = "", e.style.contain = "";
       }
     }),
-    out: (e, a) => ({
+    out: (e, o) => ({
       spring: r,
-      prepare: (o) => {
-        m(o, a), o.style.willChange = n ? "transform, opacity" : "transform", o.style.zIndex = "100";
+      prepare: (s) => {
+        m(s, o), s.style.zIndex = "100", s.style.willChange = n ? "transform, opacity" : "transform", s.style.backfaceVisibility = "hidden", s.style.contain = "layout paint", s.style.pointerEvents = "none";
       },
-      tick: (o) => {
-        e.style.transform = `translateX(${(1 - o) * 100}%)`, n && (e.style.opacity = o.toString());
+      css: (s) => {
+        const a = {
+          transform: `translate3d(${(1 - s) * 100}%, 0, 0)`
+        };
+        return n && (a.opacity = s), a;
       }
     })
   };
@@ -183,9 +195,9 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
     outSpring: i = nt,
     transitionDelay: d = it
   } = t;
-  let r, s = null;
+  let r, l = null;
   return {
-    in: (h) => ({
+    in: (c) => ({
       spring: n,
       prepare: (e) => {
         e.style.opacity = "0", e.style.willChange = "opacity";
@@ -194,25 +206,25 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
         r && (await r, await U(d));
       },
       tick: (e) => {
-        const a = G(e, 2);
-        h.style.opacity = a.toString();
+        const o = q(e, 2);
+        c.style.opacity = o.toString();
       },
       onEnd: () => {
-        h.style.willChange = "auto";
+        c.style.willChange = "auto";
       }
     }),
-    out: (h, e) => (r = new Promise((a) => {
-      s = a;
+    out: (c, e) => (r = new Promise((o) => {
+      l = o;
     }), {
       spring: i,
-      tick: (a) => {
-        h.style.opacity = a.toString();
+      tick: (o) => {
+        c.style.opacity = o.toString();
       },
       prepare: () => {
-        m(h, e), h.style.willChange = "opacity";
+        m(c, e), c.style.willChange = "opacity";
       },
       onEnd: () => {
-        s && s(), h.style.willChange = "auto";
+        l && l(), c.style.willChange = "auto";
       }
     })
   };
@@ -221,7 +233,7 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
   // Lower stiffness for smoother motion
   damping: 3.5
   // Lower damping for more fluid movement
-}, rt = 0.8, lt = "white", b = {
+}, lt = 0.8, rt = "white", b = {
   start: 0,
   end: 0.45
 }, E = {
@@ -232,25 +244,25 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
   end: 0.9
 }, Yt = (t) => {
   var r;
-  const n = (t == null ? void 0 : t.spring) ?? st, i = (t == null ? void 0 : t.scale) ?? rt, d = ((r = t == null ? void 0 : t.border) == null ? void 0 : r.color) ?? lt;
+  const n = (t == null ? void 0 : t.spring) ?? st, i = (t == null ? void 0 : t.scale) ?? lt, d = ((r = t == null ? void 0 : t.border) == null ? void 0 : r.color) ?? rt;
   return {
-    out: async (s, h) => {
-      const e = I(h), a = L(document.body, h.positionedParent), o = ot(d, {
+    out: async (l, c) => {
+      const e = I(c), o = L(document.body, c.positionedParent), s = ot(d, {
         ...e,
-        top: a.top
+        top: o.top
       });
-      let l = 1, p = -e.top;
+      let a = 1, p = -e.top;
       return {
         spring: n,
         prepare: () => {
-          m(s), P(s, e), D(s, e), ht(s, e);
-          for (const g of o)
-            h.positionedParent.appendChild(g);
+          m(l), P(l, e), D(l, e), ct(l, e);
+          for (const g of s)
+            c.positionedParent.appendChild(g);
         },
         onEnd: () => {
-          s.style.clipPath = "", s.style.transformOrigin = "", setTimeout(() => {
-            for (const g of o)
-              h.positionedParent.removeChild(g);
+          l.style.clipPath = "", l.style.transformOrigin = "", setTimeout(() => {
+            for (const g of s)
+              c.positionedParent.removeChild(g);
           }, 1e3);
         },
         tick: (g) => {
@@ -261,7 +273,7 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
               b.start,
               b.end
             );
-            l = 1 - (1 - i) * f;
+            a = 1 - (1 - i) * f;
           }
           if (E.start <= u && u <= E.end) {
             const f = C(
@@ -269,7 +281,7 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
               E.start,
               E.end
             );
-            l = i + (1 - i) * f;
+            a = i + (1 - i) * f;
           }
           if (A.start <= u && u <= A.end) {
             const f = C(
@@ -279,49 +291,49 @@ const V = { stiffness: 80, damping: 25 }, j = { stiffness: 75, damping: 25 }, K
             );
             p = -e.top - e.height * f;
           }
-          s.style.transform = `translateY(${p}px) scale(${l})`;
-          const y = (e.width - e.width * l) / 2, c = (e.height - e.height * l) / 2;
-          at(o, y, c);
+          l.style.transform = `translateY(${p}px) scale(${a})`;
+          const y = (e.width - e.width * a) / 2, h = (e.height - e.height * a) / 2;
+          at(s, y, h);
         }
       };
     },
-    in: async (s, h) => {
-      const e = I(h);
-      let a = i, o = -e.top + e.height;
+    in: async (l, c) => {
+      const e = I(c);
+      let o = i, s = -e.top + e.height;
       return {
         spring: n,
         prepare: () => {
-          P(s, e), D(s, e), s.style.transform = `translateY(${-e.top + e.height}px) scale(${i})`;
+          P(l, e), D(l, e), l.style.transform = `translateY(${-e.top + e.height}px) scale(${i})`;
         },
         onEnd: () => {
-          s.style.clipPath = "", s.style.transformOrigin = "", s.style.transform = "";
+          l.style.clipPath = "", l.style.transformOrigin = "", l.style.transform = "";
         },
-        tick: (l) => {
-          if (b.start <= l && l <= b.end) {
+        tick: (a) => {
+          if (b.start <= a && a <= b.end) {
             const p = C(
-              l,
+              a,
               b.start,
               b.end
             );
-            a = 1 - (1 - i) * p;
+            o = 1 - (1 - i) * p;
           }
-          if (E.start <= l && l <= E.end) {
+          if (E.start <= a && a <= E.end) {
             const p = C(
-              l,
+              a,
               E.start,
               E.end
             );
-            a = i + (1 - i) * p;
+            o = i + (1 - i) * p;
           }
-          if (A.start <= l && l <= A.end) {
+          if (A.start <= a && a <= A.end) {
             const p = C(
-              l,
+              a,
               A.start,
               A.end
             );
-            o = -e.top + e.height * (1 - p);
+            s = -e.top + e.height * (1 - p);
           }
-          s.style.transform = `translateY(${o}px) scale(${a})`;
+          l.style.transform = `translateY(${s}px) scale(${o})`;
         }
       };
     }
@@ -334,34 +346,34 @@ function at(t, n, i) {
 function ot(t = "white", n) {
   const r = document.createElement("div");
   r.style.position = "fixed", r.style.pointerEvents = "none", r.style.zIndex = "9999", r.style.top = `${n.top - 1}px`, r.style.left = `${n.left - 1}px`, r.style.width = "15px", r.style.height = "15px";
-  const s = document.createElement("div");
-  s.style.position = "absolute", s.style.width = "15px", s.style.height = "1px", s.style.backgroundColor = t, s.style.top = "0", s.style.left = "0";
-  const h = document.createElement("div");
-  h.style.position = "absolute", h.style.width = "1px", h.style.height = "15px", h.style.backgroundColor = t, h.style.top = "0", h.style.left = "0", r.appendChild(s), r.appendChild(h);
+  const l = document.createElement("div");
+  l.style.position = "absolute", l.style.width = "15px", l.style.height = "1px", l.style.backgroundColor = t, l.style.top = "0", l.style.left = "0";
+  const c = document.createElement("div");
+  c.style.position = "absolute", c.style.width = "1px", c.style.height = "15px", c.style.backgroundColor = t, c.style.top = "0", c.style.left = "0", r.appendChild(l), r.appendChild(c);
   const e = document.createElement("div");
   e.style.position = "fixed", e.style.pointerEvents = "none", e.style.zIndex = "9999", e.style.top = `${n.top - 1}px`, e.style.left = `${n.left + n.width - 15 + 1}px`, e.style.width = "15px", e.style.height = "15px";
-  const a = document.createElement("div");
-  a.style.position = "absolute", a.style.width = "15px", a.style.height = "1px", a.style.backgroundColor = t, a.style.top = "0", a.style.right = "0";
   const o = document.createElement("div");
-  o.style.position = "absolute", o.style.width = "1px", o.style.height = "15px", o.style.backgroundColor = t, o.style.top = "0", o.style.right = "0", e.appendChild(a), e.appendChild(o);
-  const l = document.createElement("div");
-  l.style.position = "fixed", l.style.pointerEvents = "none", l.style.zIndex = "9999", l.style.top = `${n.top + n.height - 15 + 1}px`, l.style.left = `${n.left - 1}px`, l.style.width = "15px", l.style.height = "15px";
+  o.style.position = "absolute", o.style.width = "15px", o.style.height = "1px", o.style.backgroundColor = t, o.style.top = "0", o.style.right = "0";
+  const s = document.createElement("div");
+  s.style.position = "absolute", s.style.width = "1px", s.style.height = "15px", s.style.backgroundColor = t, s.style.top = "0", s.style.right = "0", e.appendChild(o), e.appendChild(s);
+  const a = document.createElement("div");
+  a.style.position = "fixed", a.style.pointerEvents = "none", a.style.zIndex = "9999", a.style.top = `${n.top + n.height - 15 + 1}px`, a.style.left = `${n.left - 1}px`, a.style.width = "15px", a.style.height = "15px";
   const p = document.createElement("div");
   p.style.position = "absolute", p.style.width = "15px", p.style.height = "1px", p.style.backgroundColor = t, p.style.bottom = "0", p.style.left = "0";
   const g = document.createElement("div");
-  g.style.position = "absolute", g.style.width = "1px", g.style.height = "15px", g.style.backgroundColor = t, g.style.bottom = "0", g.style.left = "0", l.appendChild(p), l.appendChild(g);
+  g.style.position = "absolute", g.style.width = "1px", g.style.height = "15px", g.style.backgroundColor = t, g.style.bottom = "0", g.style.left = "0", a.appendChild(p), a.appendChild(g);
   const u = document.createElement("div");
   u.style.position = "fixed", u.style.pointerEvents = "none", u.style.zIndex = "9999", u.style.top = `${n.top + n.height - 15 + 1}px`, u.style.left = `${n.left + n.width - 15 + 1}px`, u.style.width = "15px", u.style.height = "15px";
   const y = document.createElement("div");
   y.style.position = "absolute", y.style.width = "15px", y.style.height = "1px", y.style.backgroundColor = t, y.style.bottom = "0", y.style.right = "0";
-  const c = document.createElement("div");
-  return c.style.position = "absolute", c.style.width = "1px", c.style.height = "15px", c.style.backgroundColor = t, c.style.bottom = "0", c.style.right = "0", u.appendChild(y), u.appendChild(c), {
+  const h = document.createElement("div");
+  return h.style.position = "absolute", h.style.width = "1px", h.style.height = "15px", h.style.backgroundColor = t, h.style.bottom = "0", h.style.right = "0", u.appendChild(y), u.appendChild(h), {
     topLeft: r,
     topRight: e,
-    bottomLeft: l,
+    bottomLeft: a,
     bottomRight: u,
     *[Symbol.iterator]() {
-      yield r, yield e, yield l, yield u;
+      yield r, yield e, yield a, yield u;
     }
   };
 }
@@ -386,7 +398,7 @@ function D(t, n) {
     ${n.left}px ${n.top + n.height}px
   )`;
 }
-function ht(t, n) {
+function ct(t, n) {
   t.style.transform = `translateY(${-n.top}px)`;
 }
 function C(t, n, i) {
@@ -396,15 +408,15 @@ function dt(t, n) {
   return t.querySelector(`[data-hero-key="${n}"]`);
 }
 const Ot = (t = {}) => {
-  var h, e;
+  var c, e;
   const n = {
-    stiffness: ((h = t.spring) == null ? void 0 : h.stiffness) ?? 300,
+    stiffness: ((c = t.spring) == null ? void 0 : c.stiffness) ?? 300,
     damping: ((e = t.spring) == null ? void 0 : e.damping) ?? 30
   }, i = t.timeout ?? 300, d = t.maxDistance ?? 700;
-  let r = null, s = null;
+  let r = null, l = null;
   return {
-    in: async (a, o) => {
-      const l = a, p = Array.from(l.querySelectorAll("[data-hero-key]"));
+    in: async (o, s) => {
+      const a = o, p = Array.from(a.querySelectorAll("[data-hero-key]"));
       if (p.length === 0)
         return {
           spring: n,
@@ -413,8 +425,8 @@ const Ot = (t = {}) => {
           // No hero elements, skip animation
         };
       if (!await new Promise((y) => {
-        r ? y(!0) : (s = y, setTimeout(() => {
-          s = null, y(!1);
+        r ? y(!0) : (l = y, setTimeout(() => {
+          l = null, y(!1);
         }, i));
       }) || !r)
         return r = null, {
@@ -424,22 +436,22 @@ const Ot = (t = {}) => {
           // No fromNode, skip animation
         };
       const u = p.map((y) => {
-        const c = y.getAttribute("data-hero-key");
-        if (!c) return null;
-        const f = dt(r, c);
+        const h = y.getAttribute("data-hero-key");
+        if (!h) return null;
+        const f = dt(r, h);
         if (!f) return null;
-        const $ = y, x = L(r, f), w = L(l, $), T = x.left - w.left - o.scrollOffset.x, X = x.top - w.top - o.scrollOffset.y, W = x.width / w.width, z = x.height / w.height, B = $.style.transform, H = $.style.position, M = $.style.transformOrigin, N = $.style.zIndex, q = $.style.willChange;
+        const $ = y, x = L(r, f), w = L(a, $), T = x.left - w.left - s.scrollOffset.x, W = x.top - w.top - s.scrollOffset.y, X = x.width / w.width, z = x.height / w.height, B = $.style.transform, H = $.style.position, M = $.style.transformOrigin, N = $.style.zIndex, V = $.style.willChange;
         return {
           toEl: $,
           dx: T,
-          dy: X,
-          dw: W,
+          dy: W,
+          dw: X,
           dh: z,
           originalTransform: B,
           originalPosition: H,
           originalTransformOrigin: M,
           originalZIndex: N,
-          originalWillChange: q
+          originalWillChange: V
         };
       }).filter(
         (y) => y !== null && Math.abs(y.dy) <= d
@@ -457,46 +469,48 @@ const Ot = (t = {}) => {
           });
         },
         tick: (y) => {
-          u.forEach(({ toEl: c, dx: f, dy: $, dw: x, dh: w }) => {
-            c.style.transform = `translate(${(1 - y) * f}px,${(1 - y) * $}px) scale(${y + (1 - y) * x}, ${y + (1 - y) * w})`;
+          u.forEach(({ toEl: h, dx: f, dy: $, dw: x, dh: w }) => {
+            h.style.transform = `translate(${(1 - y) * f}px,${(1 - y) * $}px) scale(${y + (1 - y) * x}, ${y + (1 - y) * w})`;
           });
         },
         onEnd: () => {
           u.forEach(
             ({
               toEl: y,
-              originalTransform: c,
+              originalTransform: h,
               originalPosition: f,
               originalTransformOrigin: $,
               originalZIndex: x,
               originalWillChange: w
             }) => {
-              y.style.transform = c, y.style.position = f, y.style.transformOrigin = $, y.style.zIndex = x, y.style.willChange = w;
+              y.style.transform = h, y.style.position = f, y.style.transformOrigin = $, y.style.zIndex = x, y.style.willChange = w;
             }
           );
         }
       };
     },
-    out: async (a) => ({
+    out: async (o) => ({
       onStart: () => {
-        r = a, s && (s(!0), s = null);
+        r = o, l && (l(!0), l = null);
       },
-      prepare: (o) => {
-        m(o), o.style.opacity = "0";
+      tick: () => {
+      },
+      prepare: (s) => {
+        m(s), s.style.opacity = "0";
       }
     })
   };
 };
-function ct({
+function ht({
   detailRect: t,
   galleryRect: n,
   pageRect: i,
   scrollOffset: d
 }, r) {
-  const s = n.left - t.left + (n.width - t.width) / 2 - d.x, h = n.top - t.top + (n.height - t.height) / 2 - d.y, e = n.width / t.width, a = n.height / t.height, o = Math.max(e, a), l = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
+  const l = n.left - t.left + (n.width - t.width) / 2 - d.x, c = n.top - t.top + (n.height - t.height) / 2 - d.y, e = n.width / t.width, o = n.height / t.height, s = Math.max(e, o), a = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
   return r.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, (y) => {
-    const c = 1 - y, f = l * c, $ = p * c, x = g * c, w = u * c;
-    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${s * c}px, ${h * c}px) scale(${1 + (o - 1) * c})`;
+    const h = 1 - y, f = a * h, $ = p * h, x = g * h, w = u * h;
+    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${l * h}px, ${c * h}px) scale(${1 + (s - 1) * h})`;
   };
 }
 function pt({
@@ -505,10 +519,10 @@ function pt({
   pageRect: i,
   scrollOffset: d
 }, r) {
-  const s = n.left - t.left + (n.width - t.width) / 2 + d.x, h = n.top - t.top + (n.height - t.height) / 2 + d.y, e = n.width / t.width, a = n.height / t.height, o = Math.min(e, a), l = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
+  const l = n.left - t.left + (n.width - t.width) / 2 + d.x, c = n.top - t.top + (n.height - t.height) / 2 + d.y, e = n.width / t.width, o = n.height / t.height, s = Math.min(e, o), a = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
   return r.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, (y) => {
-    const c = 1 - y, f = l * c, $ = p * c, x = g * c, w = u * c;
-    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${s * c - d.x}px, ${h * c - d.y}px) scale(${1 + (o - 1) * c})`;
+    const h = 1 - y, f = a * h, $ = p * h, x = g * h, w = u * h;
+    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${l * h - d.x}px, ${c * h - d.y}px) scale(${1 + (s - 1) * h})`;
   };
 }
 function yt(t, n, i) {
@@ -519,31 +533,31 @@ function yt(t, n, i) {
   );
   if (t.querySelectorAll("[data-instagram-detail-key]").length > 1 || n.querySelectorAll("[data-instagram-detail-key]").length > 1)
     return null;
-  let s = null, h = null, e = !1;
+  let l = null, c = null, e = !1;
   if (!d && r) {
-    h = r;
-    const l = h.getAttribute("data-instagram-detail-key");
-    if (!l) return null;
-    s = t.querySelector(
-      `[data-instagram-gallery-key="${l}"]`
-    ), s && (e = !0);
+    c = r;
+    const a = c.getAttribute("data-instagram-detail-key");
+    if (!a) return null;
+    l = t.querySelector(
+      `[data-instagram-gallery-key="${a}"]`
+    ), l && (e = !0);
   } else if (d && !r) {
-    h = d;
-    const l = h.getAttribute("data-instagram-detail-key");
-    if (!l) return null;
-    s = n.querySelector(
-      `[data-instagram-gallery-key="${l}"]`
-    ), s && (e = !1);
+    c = d;
+    const a = c.getAttribute("data-instagram-detail-key");
+    if (!a) return null;
+    l = n.querySelector(
+      `[data-instagram-gallery-key="${a}"]`
+    ), l && (e = !1);
   }
-  if (!s || !h)
+  if (!l || !c)
     return null;
-  const a = L(e ? t : n, s), o = L(e ? n : t, h);
+  const o = L(e ? t : n, l), s = L(e ? n : t, c);
   return e ? {
     isEnterMode: !0,
-    inAnimation: ct(
+    inAnimation: ht(
       {
-        detailRect: o,
-        galleryRect: a,
+        detailRect: s,
+        galleryRect: o,
         pageRect: n.getBoundingClientRect(),
         scrollOffset: i
       },
@@ -554,8 +568,8 @@ function yt(t, n, i) {
     isEnterMode: !1,
     outAnimation: pt(
       {
-        detailRect: o,
-        galleryRect: a,
+        detailRect: s,
+        galleryRect: o,
         pageRect: t.getBoundingClientRect(),
         scrollOffset: i
       },
@@ -565,15 +579,15 @@ function yt(t, n, i) {
   };
 }
 const Ut = (t = {}) => {
-  var h, e;
+  var c, e;
   const n = {
-    stiffness: ((h = t.spring) == null ? void 0 : h.stiffness) ?? 150,
+    stiffness: ((c = t.spring) == null ? void 0 : c.stiffness) ?? 150,
     damping: ((e = t.spring) == null ? void 0 : e.damping) ?? 20
   }, i = t.timeout ?? 300;
-  let d = null, r = null, s = null;
+  let d = null, r = null, l = null;
   return {
-    in: async (a, { scrollOffset: o }) => {
-      const l = a;
+    in: async (o, { scrollOffset: s }) => {
+      const a = o;
       return !await new Promise((g) => {
         d ? g(!0) : (r = g, setTimeout(() => {
           r = null, g(!1);
@@ -582,10 +596,10 @@ const Ut = (t = {}) => {
         spring: n,
         tick: () => {
         }
-      }) : (s = yt(d, l, o), s ? (d = null, {
+      }) : (l = yt(d, a, s), l ? (d = null, {
         spring: n,
         tick: (g) => {
-          s != null && s.inAnimation && s.inAnimation(g);
+          l != null && l.inAnimation && l.inAnimation(g);
         }
       }) : {
         spring: n,
@@ -593,16 +607,16 @@ const Ut = (t = {}) => {
         }
       });
     },
-    out: async (a, o) => ({
+    out: async (o) => ({
       spring: n,
       onStart: () => {
-        d = a, r && (r(!0), r = null);
+        d = o, r && (r(!0), r = null);
       },
-      prepare: (l) => {
-        m(l, o), s != null && s.isEnterMode || (l.style.zIndex = "-1");
+      prepare: (s) => {
+        m(s), l != null && l.isEnterMode || (s.style.zIndex = "-1");
       },
-      tick: (l) => {
-        s != null && s.outAnimation && s.outAnimation(l);
+      tick: (s) => {
+        l != null && l.outAnimation && l.outAnimation(s);
       }
     })
   };
@@ -613,10 +627,10 @@ function ut({
   pageRect: i,
   scrollOffset: d
 }, r) {
-  const s = n.left - t.left + (n.width - t.width) / 2 - d.x, h = n.top - t.top + (n.height - t.height) / 2 - d.y, e = n.width / t.width, a = n.height / t.height, o = Math.max(e, a), l = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
+  const l = n.left - t.left + (n.width - t.width) / 2 - d.x, c = n.top - t.top + (n.height - t.height) / 2 - d.y, e = n.width / t.width, o = n.height / t.height, s = Math.max(e, o), a = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
   return r.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, (y) => {
-    const c = 1 - y, f = l * c, $ = p * c, x = g * c, w = u * c;
-    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${s * c}px, ${h * c}px) scale(${1 + (o - 1) * c})`;
+    const h = 1 - y, f = a * h, $ = p * h, x = g * h, w = u * h;
+    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${l * h}px, ${c * h}px) scale(${1 + (s - 1) * h})`;
   };
 }
 function gt({
@@ -624,11 +638,11 @@ function gt({
   detailRect: n,
   scrollOffset: i
 }, d) {
-  const r = n.left - t.left + (n.width - t.width) / 2 + i.x, s = n.top - t.top + (n.height - t.height) / 2 + i.y, h = n.width / t.width, e = n.height / t.height, a = Math.max(h, e);
-  return (o) => {
+  const r = n.left - t.left + (n.width - t.width) / 2 + i.x, l = n.top - t.top + (n.height - t.height) / 2 + i.y, c = n.width / t.width, e = n.height / t.height, o = Math.max(c, e);
+  return (s) => {
     d.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`;
-    const l = 1 - o;
-    d.style.transform = `translate(${r * l - i.x}px, ${s * l - i.y}px) scale(${1 + (a - 1) * l})`, d.style.opacity = `${1 - l}`;
+    const a = 1 - s;
+    d.style.transform = `translate(${r * a - i.x}px, ${l * a - i.y}px) scale(${1 + (o - 1) * a})`, d.style.opacity = `${1 - a}`;
   };
 }
 function ft({
@@ -636,10 +650,10 @@ function ft({
   detailRect: n,
   scrollOffset: i
 }, d) {
-  const r = n.left - t.left + (n.width - t.width) / 2 - i.x, s = n.top - t.top + (n.height - t.height) / 2 - i.y, h = n.width / t.width, e = n.height / t.height, a = Math.max(h, e);
-  return (o) => {
-    const l = 1 - o, p = o;
-    d.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, d.style.transform = `translate(${r * l}px, ${s * l}px) scale(${1 + (a - 1) * l})`, d.style.opacity = `${p}`;
+  const r = n.left - t.left + (n.width - t.width) / 2 - i.x, l = n.top - t.top + (n.height - t.height) / 2 - i.y, c = n.width / t.width, e = n.height / t.height, o = Math.max(c, e);
+  return (s) => {
+    const a = 1 - s, p = s;
+    d.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, d.style.transform = `translate(${r * a}px, ${l * a}px) scale(${1 + (o - 1) * a})`, d.style.opacity = `${p}`;
   };
 }
 function $t({
@@ -648,10 +662,10 @@ function $t({
   pageRect: i,
   scrollOffset: d
 }, r) {
-  const s = n.left - t.left + (n.width - t.width) / 2 + d.x, h = n.top - t.top + (n.height - t.height) / 2 + d.y, e = n.width / t.width, a = n.height / t.height, o = Math.min(e, a), l = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
+  const l = n.left - t.left + (n.width - t.width) / 2 + d.x, c = n.top - t.top + (n.height - t.height) / 2 + d.y, e = n.width / t.width, o = n.height / t.height, s = Math.min(e, o), a = t.top / i.height * 100, p = (i.width - (t.left + t.width)) / i.width * 100, g = (i.height - (t.top + t.height)) / i.height * 100, u = t.left / i.width * 100;
   return r.style.transformOrigin = `${t.left + t.width / 2}px ${t.top + t.height / 2}px`, (y) => {
-    const c = 1 - y, f = l * c, $ = p * c, x = g * c, w = u * c;
-    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${s * c - d.x}px, ${h * c - d.y}px) scale(${1 + (o - 1) * c})`;
+    const h = 1 - y, f = a * h, $ = p * h, x = g * h, w = u * h;
+    r.style.clipPath = `inset(${f}% ${$}% ${x}% ${w}%)`, r.style.transform = `translate(${l * h - d.x}px, ${c * h - d.y}px) scale(${1 + (s - 1) * h})`;
   };
 }
 function wt(t, n, i) {
@@ -662,48 +676,48 @@ function wt(t, n, i) {
   );
   if (t.querySelectorAll("[data-pinterest-detail-key]").length > 1 || n.querySelectorAll("[data-pinterest-detail-key]").length > 1)
     return null;
-  let s = null, h = null, e = !1;
+  let l = null, c = null, e = !1;
   if (!d && r) {
-    h = r;
-    const l = h.getAttribute("data-pinterest-detail-key");
-    if (!l) return null;
-    s = t.querySelector(
-      `[data-pinterest-gallery-key="${l}"]`
-    ), s && (e = !0);
+    c = r;
+    const a = c.getAttribute("data-pinterest-detail-key");
+    if (!a) return null;
+    l = t.querySelector(
+      `[data-pinterest-gallery-key="${a}"]`
+    ), l && (e = !0);
   } else if (d && !r) {
-    h = d;
-    const l = h.getAttribute("data-pinterest-detail-key");
-    if (!l) return null;
-    s = n.querySelector(
-      `[data-pinterest-gallery-key="${l}"]`
-    ), s && (e = !1);
+    c = d;
+    const a = c.getAttribute("data-pinterest-detail-key");
+    if (!a) return null;
+    l = n.querySelector(
+      `[data-pinterest-gallery-key="${a}"]`
+    ), l && (e = !1);
   }
-  if (!s || !h)
+  if (!l || !c)
     return null;
-  const a = L(e ? t : n, s), o = L(e ? n : t, h);
+  const o = L(e ? t : n, l), s = L(e ? n : t, c);
   return e ? {
     inAnimation: ut(
       {
-        detailRect: o,
-        galleryRect: a,
+        detailRect: s,
+        galleryRect: o,
         pageRect: n.getBoundingClientRect(),
         scrollOffset: i
       },
       n
     ),
     outAnimation: gt(
-      { galleryRect: a, detailRect: o, scrollOffset: i },
+      { galleryRect: o, detailRect: s, scrollOffset: i },
       t
     )
   } : {
     inAnimation: ft(
-      { galleryRect: a, detailRect: o, scrollOffset: i },
+      { galleryRect: o, detailRect: s, scrollOffset: i },
       n
     ),
     outAnimation: $t(
       {
-        detailRect: o,
-        galleryRect: a,
+        detailRect: s,
+        galleryRect: o,
         pageRect: t.getBoundingClientRect(),
         scrollOffset: i
       },
@@ -711,16 +725,16 @@ function wt(t, n, i) {
     )
   };
 }
-const Xt = (t = {}) => {
-  var h, e;
+const Wt = (t = {}) => {
+  var c, e;
   const n = {
-    stiffness: ((h = t.spring) == null ? void 0 : h.stiffness) ?? 30,
+    stiffness: ((c = t.spring) == null ? void 0 : c.stiffness) ?? 30,
     damping: ((e = t.spring) == null ? void 0 : e.damping) ?? 10
   }, i = t.timeout ?? 300;
-  let d = null, r = null, s = null;
+  let d = null, r = null, l = null;
   return {
-    in: async (a, { scrollOffset: o }) => {
-      const l = a;
+    in: async (o, { scrollOffset: s }) => {
+      const a = o;
       return !await new Promise((g) => {
         d ? g(!0) : (r = g, setTimeout(() => {
           r = null, g(!1);
@@ -729,10 +743,10 @@ const Xt = (t = {}) => {
         spring: n,
         tick: () => {
         }
-      }) : (s = wt(d, l, o), s ? (d = null, {
+      }) : (l = wt(d, a, s), l ? (d = null, {
         spring: n,
         tick: (g) => {
-          s && s.inAnimation(g);
+          l && l.inAnimation(g);
         }
       }) : {
         spring: n,
@@ -740,61 +754,61 @@ const Xt = (t = {}) => {
         }
       });
     },
-    out: async (a) => ({
+    out: async (o) => ({
       spring: n,
       onStart: () => {
-        d = a, r && (r(!0), r = null);
+        d = o, r && (r(!0), r = null);
       },
-      prepare: (o) => {
-        m(o), o.style.zIndex = "-1";
+      prepare: (s) => {
+        m(s), s.style.zIndex = "-1";
       },
-      tick: (o) => {
-        s && s.outAnimation(o);
+      tick: (s) => {
+        l && l.outAnimation(s);
       }
     })
   };
 }, v = {
   stiffness: 5,
   damping: 4
-}, Wt = (t = {}) => {
-  var a, o;
+}, Xt = (t = {}) => {
+  var o, s;
   const n = t.direction ?? "up", i = {
-    stiffness: ((a = t.spring) == null ? void 0 : a.stiffness) ?? v.stiffness,
-    damping: ((o = t.spring) == null ? void 0 : o.damping) ?? v.damping
+    stiffness: ((o = t.spring) == null ? void 0 : o.stiffness) ?? v.stiffness,
+    damping: ((s = t.spring) == null ? void 0 : s.damping) ?? v.damping
   }, d = n === "up";
-  let r = null, s = null, h = null;
+  let r = null, l = null, c = null;
   const e = () => {
-    if (r === null || s === null)
+    if (r === null || l === null)
       return null;
-    const l = Math.min(r, s), p = window.innerHeight;
-    return Math.max(l, p);
+    const a = Math.min(r, l), p = window.innerHeight;
+    return Math.max(a, p);
   };
   return {
-    in: (l) => (s = l.offsetHeight, r !== null && (h = e()), {
+    in: (a) => (l = a.offsetHeight, r !== null && (c = e()), {
       spring: i,
       prepare: () => {
-        l.style.willChange = "transform";
+        a.style.willChange = "transform";
       },
       tick: (p) => {
-        if (h === null && (h = e(), h === null))
+        if (c === null && (c = e(), c === null))
           return;
-        const g = d ? (1 - p) * h : (1 - p) * -h;
-        l.style.transform = `translateY(${g}px)`;
+        const g = d ? (1 - p) * c : (1 - p) * -c;
+        a.style.transform = `translateY(${g}px)`;
       },
       onEnd: () => {
-        l.style.willChange = "auto";
+        a.style.willChange = "auto";
       }
     }),
-    out: (l) => ({
+    out: (a) => ({
       spring: i,
       onStart: () => {
-        r = l.offsetHeight, s !== null && (h = e());
+        r = a.offsetHeight, l !== null && (c = e());
       },
       tick: (p) => {
-        if (h === null && (h = e(), h === null))
+        if (c === null && (c = e(), c === null))
           return;
-        const g = d ? (1 - p) * -h : (1 - p) * h;
-        l.style.transform = `translateY(${g}px)`;
+        const g = d ? (1 - p) * -c : (1 - p) * c;
+        a.style.transform = `translateY(${g}px)`;
       },
       prepare: (p) => {
         m(p), p.style.zIndex = d ? "-1" : "1", p.style.willChange = "transform";
@@ -805,50 +819,50 @@ const Xt = (t = {}) => {
   stiffness: 15,
   damping: 7
 }, zt = (t = {}) => {
-  var r, s;
+  var r, l;
   const n = t.direction ?? "left", i = {
     stiffness: ((r = t.spring) == null ? void 0 : r.stiffness) ?? F.stiffness,
-    damping: ((s = t.spring) == null ? void 0 : s.damping) ?? F.damping
+    damping: ((l = t.spring) == null ? void 0 : l.damping) ?? F.damping
   }, d = n === "left";
   return {
-    in: (h) => ({
+    in: (c) => ({
       spring: i,
       prepare: () => {
-        h.style.willChange = "transform";
+        c.style.willChange = "transform";
       },
       tick: (e) => {
-        const a = d ? (1 - e) * 100 : (1 - e) * -100;
-        h.style.transform = `translateX(${a}%)`;
+        const o = d ? (1 - e) * 100 : (1 - e) * -100;
+        c.style.transform = `translateX(${o}%)`;
       },
       onEnd: () => {
-        h.style.willChange = "auto";
+        c.style.willChange = "auto";
       }
     }),
-    out: (h, e) => ({
+    out: (c, e) => ({
       spring: i,
-      tick: (a) => {
-        const o = d ? (1 - a) * -100 : (1 - a) * 100;
-        h.style.transform = `translateX(${o}%)`;
+      tick: (o) => {
+        const s = d ? (1 - o) * -100 : (1 - o) * 100;
+        c.style.transform = `translateX(${s}%)`;
       },
-      prepare: (a) => {
-        m(a, e), a.style.zIndex = d ? "-1" : "1", a.style.willChange = "transform";
+      prepare: (o) => {
+        m(o, e), o.style.zIndex = d ? "-1" : "1", o.style.willChange = "transform";
       }
     })
   };
-}, Y = { stiffness: 17, damping: 6 }, k = 20, _ = 800, Bt = () => {
+}, Y = { stiffness: 17, damping: 6 }, S = 20, _ = 800, Bt = () => {
   let t, n = null;
   return {
     in: (i) => ({
       spring: Y,
       prepare: (d) => {
-        d.style.willChange = "transform", d.style.transform = `perspective(${_}px) rotateY(${k}deg) translateX(-100%)`;
+        d.style.willChange = "transform", d.style.transform = `perspective(${_}px) rotateY(${S}deg) translateX(-100%)`;
       },
       wait: async () => {
         t && await t;
       },
       tick: (d) => {
-        const r = (1 - d) * k, s = -(1 - d) * 100;
-        i.style.transform = `perspective(${_}px) rotateY(${r}deg) translateX(${s}%)`;
+        const r = (1 - d) * S, l = -(1 - d) * 100;
+        i.style.transform = `perspective(${_}px) rotateY(${r}deg) translateX(${l}%)`;
       },
       onEnd: () => {
         i.style.transform = "", i.style.willChange = "auto";
@@ -862,8 +876,8 @@ const Xt = (t = {}) => {
         m(r, d), r.style.willChange = "transform";
       },
       tick: (r) => {
-        const s = 1 - r, h = s * k, e = s * 100;
-        i.style.transform = `perspective(${_}px) rotateY(${-h}deg) translateX(${e}%)`;
+        const l = 1 - r, c = l * S, e = l * 100;
+        i.style.transform = `perspective(${_}px) rotateY(${-c}deg) translateX(${e}%)`;
       },
       onEnd: () => {
         n && n(), i.style.transform = "";
@@ -899,7 +913,7 @@ const Xt = (t = {}) => {
   fontWeight: "900",
   letterSpacing: "0.02em",
   color: "#FFFFFF"
-}, St = 0.4, S = 0.5, kt = 0.2;
+}, kt = 0.4, k = 0.5, St = 0.2;
 function _t(t, n) {
   switch (t) {
     case "circle":
@@ -918,40 +932,40 @@ const It = (t) => t.reduce((n, i) => n + i, 0), Ht = (t = {}) => {
     texts: i = [],
     shape: d = Et,
     inSpring: r = mt,
-    outSpring: s = xt,
-    textStyle: h = {}
+    outSpring: l = xt,
+    textStyle: c = {}
   } = t;
   return {
-    out: (e, a) => {
-      const o = e.style.opacity;
+    out: (e, o) => {
+      const s = e.style.opacity;
       return {
-        spring: s,
+        spring: l,
         from: 1,
         to: 0,
-        prepare: (l) => {
-          m(l, a), l.style.opacity = "1";
+        prepare: (a) => {
+          m(a, o), a.style.opacity = "1";
         },
-        tick: (l) => {
-          const p = Math.max(0, l - St);
+        tick: (a) => {
+          const p = Math.max(0, a - kt);
           e.style.opacity = String(p);
         },
         onEnd: () => {
-          e.style.opacity = o;
+          e.style.opacity = s;
         }
       };
     },
     in: (e) => {
-      let a = null, o = null, l = null;
+      let o = null, s = null, a = null;
       const p = document.body.style.overflow, g = document.getElementById(
         O
       );
       let u = [];
       const y = () => {
-        a = document.createElement("div"), a.id = O, Object.assign(a.style, At, { background: n }), document.body.appendChild(a), o = document.createElement("div"), Object.assign(o.style, Lt), a.appendChild(o), l = document.createElement("div"), Object.assign(l.style, Ct), o.appendChild(l), i.forEach((c) => {
+        o = document.createElement("div"), o.id = O, Object.assign(o.style, At, { background: n }), document.body.appendChild(o), s = document.createElement("div"), Object.assign(s.style, Lt), o.appendChild(s), a = document.createElement("div"), Object.assign(a.style, Ct), s.appendChild(a), i.forEach((h) => {
           const f = document.createElement("div");
-          f.textContent = c, Object.assign(f.style, Tt, h), l.appendChild(f);
-        }), u = Array.from(l.children).map(
-          (c) => c.getBoundingClientRect().width
+          f.textContent = h, Object.assign(f.style, Tt, c), a.appendChild(f);
+        }), u = Array.from(a.children).map(
+          (h) => h.getBoundingClientRect().width
         );
       };
       return {
@@ -959,28 +973,28 @@ const It = (t) => t.reduce((n, i) => n + i, 0), Ht = (t = {}) => {
         from: 0,
         to: 1,
         prepare: () => {
-          document.body.style.overflow = "hidden", e.style.opacity = "1", g == null || g.remove(), y(), a && o && (a.style.clipPath = "none", o.style.transform = "scale(1)");
+          document.body.style.overflow = "hidden", e.style.opacity = "1", g == null || g.remove(), y(), o && s && (o.style.clipPath = "none", s.style.transform = "scale(1)");
         },
-        tick: (c) => {
-          if (!(!a || !o || !l)) {
-            if (c <= S && i.length > 0) {
-              const f = c / S, $ = Math.min(
+        tick: (h) => {
+          if (!(!o || !s || !a)) {
+            if (h <= k && i.length > 0) {
+              const f = h / k, $ = Math.min(
                 Math.floor(f * i.length),
                 i.length - 1
               ), x = u[$] ?? 0, w = It(u.slice(0, $));
-              o.style.width = `${x}px`, l.style.transform = `translateX(-${w}px)`;
+              s.style.width = `${x}px`, a.style.transform = `translateX(-${w}px)`;
             }
-            if (c > S) {
+            if (h > k) {
               const $ = 1 - Math.max(
                 0,
-                Math.min(1, (c - S) / kt)
+                Math.min(1, (h - k) / St)
               );
-              a.style.clipPath = _t(d, $), o.style.transform = `scale(${$})`;
+              o.style.clipPath = _t(d, $), s.style.transform = `scale(${$})`;
             }
           }
         },
         onEnd: () => {
-          a == null || a.remove(), a = o = l = null, document.body.style.overflow = p;
+          o == null || o.remove(), o = s = a = null, document.body.style.overflow = p;
         }
       };
     }
@@ -994,9 +1008,9 @@ export {
   Yt as film,
   Ot as hero,
   Ut as instagram,
-  qt as jaemin,
-  Xt as pinterest,
-  Wt as scroll,
+  Vt as jaemin,
+  Wt as pinterest,
+  Xt as scroll,
   zt as slide,
   Bt as strip
 };