react-spring-carousel 3.0.0-beta-1.0.39 → 3.0.0-beta-1.0.40

package/dist/index.es.js

@@ -61,8 +61,8 @@ function xe(r, e, t, n = 0.15) {
   return n === 0 ? Ze(r, e, t) : r < e ? -we(e - r, t - e, n) + e : r > t ? +we(r - t, t - e, n) + t : r;
 }
 function et(r, [e, t], [n, i]) {
-  const [[c, s], [d, m]] = r;
-  return [xe(e, c, s, n), xe(t, d, m, i)];
+  const [[c, o], [d, m]] = r;
+  return [xe(e, c, o, n), xe(t, d, m, i)];
 }
 function tt(r, e) {
   if (typeof r != "object" || r === null) return r;
@@ -96,7 +96,7 @@ function Ie(r, e) {
   }
   return t;
 }
-function _(r) {
+function w(r) {
   for (var e = 1; e < arguments.length; e++) {
     var t = arguments[e] != null ? arguments[e] : {};
     e % 2 ? Ie(Object(t), !0).forEach(function(n) {
@@ -282,22 +282,22 @@ class mt {
       D.addTo(t._distance, V);
     }
     this.axisIntent && this.axisIntent(e);
-    const [s, d] = t._movement, [m, I] = n.threshold, {
+    const [o, d] = t._movement, [m, I] = n.threshold, {
       _step: l,
-      values: A
+      values: N
     } = t;
-    if (n.hasCustomTransform ? (l[0] === !1 && (l[0] = Math.abs(s) >= m && A[0]), l[1] === !1 && (l[1] = Math.abs(d) >= I && A[1])) : (l[0] === !1 && (l[0] = Math.abs(s) >= m && Math.sign(s) * m), l[1] === !1 && (l[1] = Math.abs(d) >= I && Math.sign(d) * I)), t.intentional = l[0] !== !1 || l[1] !== !1, !t.intentional) return;
-    const T = [0, 0];
+    if (n.hasCustomTransform ? (l[0] === !1 && (l[0] = Math.abs(o) >= m && N[0]), l[1] === !1 && (l[1] = Math.abs(d) >= I && N[1])) : (l[0] === !1 && (l[0] = Math.abs(o) >= m && Math.sign(o) * m), l[1] === !1 && (l[1] = Math.abs(d) >= I && Math.sign(d) * I)), t.intentional = l[0] !== !1 || l[1] !== !1, !t.intentional) return;
+    const k = [0, 0];
     if (n.hasCustomTransform) {
-      const [V, S] = A;
-      T[0] = l[0] !== !1 ? V - l[0] : 0, T[1] = l[1] !== !1 ? S - l[1] : 0;
+      const [V, S] = N;
+      k[0] = l[0] !== !1 ? V - l[0] : 0, k[1] = l[1] !== !1 ? S - l[1] : 0;
     } else
-      T[0] = l[0] !== !1 ? s - l[0] : 0, T[1] = l[1] !== !1 ? d - l[1] : 0;
-    this.restrictToAxis && !t._blocked && this.restrictToAxis(T);
+      k[0] = l[0] !== !1 ? o - l[0] : 0, k[1] = l[1] !== !1 ? d - l[1] : 0;
+    this.restrictToAxis && !t._blocked && this.restrictToAxis(k);
     const O = t.offset, $ = t._active && !t._blocked || t.active;
-    $ && (t.first = t._active && !t.active, t.last = !t._active && t.active, t.active = i[this.ingKey] = t._active, e && (t.first && ("bounds" in n && (t._bounds = ce(n.bounds, t)), this.setup && this.setup()), t.movement = T, this.computeOffset()));
-    const [F, w] = t.offset, [[E, L], [q, J]] = t._bounds;
-    t.overflow = [F < E ? -1 : F > L ? 1 : 0, w < q ? -1 : w > J ? 1 : 0], t._movementBound[0] = t.overflow[0] ? t._movementBound[0] === !1 ? t._movement[0] : t._movementBound[0] : !1, t._movementBound[1] = t.overflow[1] ? t._movementBound[1] === !1 ? t._movement[1] : t._movementBound[1] : !1;
+    $ && (t.first = t._active && !t.active, t.last = !t._active && t.active, t.active = i[this.ingKey] = t._active, e && (t.first && ("bounds" in n && (t._bounds = ce(n.bounds, t)), this.setup && this.setup()), t.movement = k, this.computeOffset()));
+    const [F, x] = t.offset, [[E, L], [q, J]] = t._bounds;
+    t.overflow = [F < E ? -1 : F > L ? 1 : 0, x < q ? -1 : x > J ? 1 : 0], t._movementBound[0] = t.overflow[0] ? t._movementBound[0] === !1 ? t._movement[0] : t._movementBound[0] : !1, t._movementBound[1] = t.overflow[1] ? t._movementBound[1] === !1 ? t._movement[1] : t._movementBound[1] : !1;
     const b = t._active ? n.rubberband || [0, 0] : [0, 0];
     if (t.offset = et(t._bounds, t.offset, b), t.delta = D.sub(t.offset, O), this.computeMovement(), $ && (!t.last || c > gt)) {
       t.delta = D.sub(t.offset, O);
@@ -308,7 +308,7 @@ class mt {
   emit() {
     const e = this.state, t = this.shared, n = this.config;
     if (e._active || this.clean(), (e._blocked || !e.intentional) && !e._force && !n.triggerAllEvents) return;
-    const i = this.handler(_(_(_({}, t), e), {}, {
+    const i = this.handler(w(w(w({}, t), e), {}, {
       [this.aliasKey]: e.values
     }));
     i !== void 0 && (e.memo = i);
@@ -360,12 +360,12 @@ class bt extends mt {
       }
   }
 }
-const Te = (r) => r, ke = 0.15, ve = {
+const ke = (r) => r, Te = 0.15, ve = {
   enabled(r = !0) {
     return r;
   },
   eventOptions(r, e, t) {
-    return _(_({}, t.shared.eventOptions), r);
+    return w(w({}, t.shared.eventOptions), r);
   },
   preventDefault(r = !1) {
     return r;
@@ -376,7 +376,7 @@ const Te = (r) => r, ke = 0.15, ve = {
   rubberband(r = 0) {
     switch (r) {
       case !0:
-        return [ke, ke];
+        return [Te, Te];
       case !1:
         return [0, 0];
       default:
@@ -390,13 +390,13 @@ const Te = (r) => r, ke = 0.15, ve = {
   transform(r, e, t) {
     const n = r || t.shared.transform;
     if (this.hasCustomTransform = !!n, process.env.NODE_ENV === "development") {
-      const i = n || Te;
+      const i = n || ke;
       return (c) => {
-        const s = i(c);
-        return (!isFinite(s[0]) || !isFinite(s[1])) && console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${s[0]},${[1]}]`), s;
+        const o = i(c);
+        return (!isFinite(o[0]) || !isFinite(o[1])) && console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${o[0]},${[1]}]`), o;
       };
     }
-    return n || Te;
+    return n || ke;
   },
   threshold(r) {
     return D.toVector(r, 0);
@@ -419,7 +419,7 @@ process.env.NODE_ENV === "development" && Object.assign(ve, {
     return NaN;
   }
 });
-const yt = 0, ee = _(_({}, ve), {}, {
+const yt = 0, ee = w(w({}, ve), {}, {
   axis(r, e, {
     axis: t
   }) {
@@ -527,14 +527,14 @@ class _t extends bt {
     const i = pe(e);
     if (t._pointerId !== void 0 && i !== t._pointerId) return;
     this.state._pointerActive = !1, this.setActive(), this.compute(e);
-    const [c, s] = t._distance;
-    if (t.tap = c <= n.tapsThreshold && s <= n.tapsThreshold, t.tap && n.filterTaps)
+    const [c, o] = t._distance;
+    if (t.tap = c <= n.tapsThreshold && o <= n.tapsThreshold, t.tap && n.filterTaps)
       t._force = !0;
     else {
-      const [d, m] = t._delta, [I, l] = t._movement, [A, T] = n.swipe.velocity, [O, $] = n.swipe.distance, F = n.swipe.duration;
+      const [d, m] = t._delta, [I, l] = t._movement, [N, k] = n.swipe.velocity, [O, $] = n.swipe.distance, F = n.swipe.duration;
       if (t.elapsedTime < F) {
-        const w = Math.abs(d / t.timeDelta), E = Math.abs(m / t.timeDelta);
-        w > A && Math.abs(I) > O && (t.swipe[0] = Math.sign(d)), E > T && Math.abs(l) > $ && (t.swipe[1] = Math.sign(m));
+        const x = Math.abs(d / t.timeDelta), E = Math.abs(m / t.timeDelta);
+        x > N && Math.abs(I) > O && (t.swipe[0] = Math.sign(d)), E > k && Math.abs(l) > $ && (t.swipe[1] = Math.sign(m));
       }
     }
     this.emit();
@@ -620,11 +620,11 @@ const R = {
   touchscreen: xt(),
   pointer: It(),
   pointerLock: Et()
-}, Dt = 250, Tt = 180, kt = 0.5, Ct = 50, Ot = 250, Pt = 10, Oe = {
+}, Dt = 250, kt = 180, Tt = 0.5, Ct = 50, Ot = 250, Pt = 10, Oe = {
   mouse: 0,
   touch: 0,
   pen: 8
-}, Le = _(_({}, ee), {}, {
+}, Le = w(w({}, ee), {}, {
   device(r, e, {
     pointer: {
       touch: t = !1,
@@ -658,7 +658,7 @@ const R = {
     return this.filterTaps = t, this.tapsThreshold = n, c;
   },
   swipe({
-    velocity: r = kt,
+    velocity: r = Tt,
     distance: e = Ct,
     duration: t = Ot
   } = {}) {
@@ -671,7 +671,7 @@ const R = {
   delay(r = 0) {
     switch (r) {
       case !0:
-        return Tt;
+        return kt;
       case !1:
         return 0;
       default:
@@ -679,7 +679,7 @@ const R = {
     }
   },
   axisThreshold(r) {
-    return r ? _(_({}, Oe), r) : Oe;
+    return r ? w(w({}, Oe), r) : Oe;
   },
   keyboardDisplacement(r = Pt) {
     return r;
@@ -712,7 +712,7 @@ process.env.NODE_ENV === "development" && Object.assign(Le, {
     return NaN;
   }
 });
-_(_({}, ve), {}, {
+w(w({}, ve), {}, {
   device(r, e, {
     shared: t,
     pointer: {
@@ -730,20 +730,20 @@ _(_({}, ve), {}, {
     scaleBounds: t = {},
     angleBounds: n = {}
   }) {
-    const i = (s) => {
-      const d = De(ce(t, s), {
+    const i = (o) => {
+      const d = De(ce(t, o), {
         min: -1 / 0,
         max: 1 / 0
       });
       return [d.min, d.max];
-    }, c = (s) => {
-      const d = De(ce(n, s), {
+    }, c = (o) => {
+      const d = De(ce(n, o), {
         min: -1 / 0,
         max: 1 / 0
       });
       return [d.min, d.max];
     };
-    return typeof t != "function" && typeof n != "function" ? [i(), c()] : (s) => [i(s), c(s)];
+    return typeof t != "function" && typeof n != "function" ? [i(), c()] : (o) => [i(o), c(o)];
   },
   threshold(r, e, t) {
     return this.lockDirection = t.axis === "lock", D.toVector(r, this.lockDirection ? [0.1, 3] : 0);
@@ -755,10 +755,10 @@ _(_({}, ve), {}, {
     return r;
   }
 });
-_(_({}, ee), {}, {
+w(w({}, ee), {}, {
   mouseOnly: (r = !0) => r
 });
-_(_({}, ee), {}, {
+w(w({}, ee), {}, {
   mouseOnly: (r = !0) => r
 });
 const Ve = /* @__PURE__ */ new Map(), me = /* @__PURE__ */ new Map();
@@ -835,28 +835,28 @@ function Vt(r, e, t = {}) {
   const n = r, {
     target: i,
     eventOptions: c,
-    window: s,
+    window: o,
     enabled: d,
     transform: m
   } = n, I = Rt(n, Lt);
   if (t.shared = oe({
     target: i,
     eventOptions: c,
-    window: s,
+    window: o,
     enabled: d,
     transform: m
   }, $t), e) {
     const l = me.get(e);
-    t[e] = oe(_({
+    t[e] = oe(w({
       shared: t.shared
     }, I), l);
   } else
     for (const l in I) {
-      const A = me.get(l);
-      if (A)
-        t[l] = oe(_({
+      const N = me.get(l);
+      if (N)
+        t[l] = oe(w({
           shared: t.shared
-        }, I[l]), A);
+        }, I[l]), N);
       else if (process.env.NODE_ENV === "development" && !["drag", "pinch", "scroll", "wheel", "move", "hover"].includes(l)) {
         if (l === "domTarget")
           throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");
@@ -870,12 +870,12 @@ class Be {
     C(this, "_listeners", /* @__PURE__ */ new Set()), this._ctrl = e, this._gestureKey = t;
   }
   add(e, t, n, i, c) {
-    const s = this._listeners, d = at(t, n), m = this._gestureKey ? this._ctrl.config[this._gestureKey].eventOptions : {}, I = _(_({}, m), c);
+    const o = this._listeners, d = at(t, n), m = this._gestureKey ? this._ctrl.config[this._gestureKey].eventOptions : {}, I = w(w({}, m), c);
     e.addEventListener(d, i, I);
     const l = () => {
-      e.removeEventListener(d, i, I), s.delete(l);
+      e.removeEventListener(d, i, I), o.delete(l);
     };
-    return s.add(l), l;
+    return o.add(l), l;
   }
   clean() {
     this._listeners.forEach((e) => e()), this._listeners.clear();
@@ -932,16 +932,16 @@ class Ut {
     let i;
     if (!(t.target && (i = t.target(), !i))) {
       if (t.enabled) {
-        for (const s of this.gestures) {
-          const d = this.config[s], m = Pe(n, d.eventOptions, !!i);
+        for (const o of this.gestures) {
+          const d = this.config[o], m = Pe(n, d.eventOptions, !!i);
           if (d.enabled) {
-            const I = Ve.get(s);
-            new I(this, e, s).bind(m);
+            const I = Ve.get(o);
+            new I(this, e, o).bind(m);
           }
         }
         const c = Pe(n, t.eventOptions, !!i);
-        for (const s in this.nativeHandlers)
-          c(s, "", (d) => this.nativeHandlers[s](_(_({}, this.state.shared), {}, {
+        for (const o in this.nativeHandlers)
+          c(o, "", (d) => this.nativeHandlers[o](w(w({}, this.state.shared), {}, {
             event: d,
             args: e
           })), void 0, !0);
@@ -951,11 +951,11 @@ class Ut {
       if (!i) return n;
       for (const c in n) {
         const {
-          device: s,
+          device: o,
           capture: d,
           passive: m
         } = ct(c);
-        this._targetEventStore.add(i, s, "", n[c], {
+        this._targetEventStore.add(i, o, "", n[c], {
           capture: d,
           passive: m
         });
@@ -969,11 +969,11 @@ function X(r, e) {
 function jt(r, e) {
   e.drag && X(r, "drag"), e.wheel && X(r, "wheel"), e.scroll && X(r, "scroll"), e.move && X(r, "move"), e.pinch && X(r, "pinch"), e.hover && X(r, "hover");
 }
-const Pe = (r, e, t) => (n, i, c, s = {}, d = !1) => {
+const Pe = (r, e, t) => (n, i, c, o = {}, d = !1) => {
   var m, I;
-  const l = (m = s.capture) !== null && m !== void 0 ? m : e.capture, A = (I = s.passive) !== null && I !== void 0 ? I : e.passive;
-  let T = d ? n : st(n, i, l);
-  t && A && (T += "Passive"), r[T] = r[T] || [], r[T].push(c);
+  const l = (m = o.capture) !== null && m !== void 0 ? m : e.capture, N = (I = o.passive) !== null && I !== void 0 ? I : e.passive;
+  let k = d ? n : st(n, i, l);
+  t && N && (k += "Passive"), r[k] = r[k] || [], r[k].push(c);
 };
 function Gt(r, e = {}, t, n) {
   const i = de.useMemo(() => new Ut(r), []);
@@ -986,11 +986,11 @@ function Kt(r, e) {
   }, e || {}, "drag");
 }
 function Ft(r) {
-  const { left: e, right: t, top: n, bottom: i } = r.getBoundingClientRect(), { innerWidth: c, innerHeight: s } = window;
+  const { left: e, right: t, top: n, bottom: i } = r.getBoundingClientRect(), { innerWidth: c, innerHeight: o } = window;
   return e < 0 || n < 0 ? {
     isOut: !0,
     direction: "start"
-  } : Math.floor(t) > Math.floor(c) || Math.floor(i) > Math.floor(s) ? {
+  } : Math.floor(t) > Math.floor(c) || Math.floor(i) > Math.floor(o) ? {
     isOut: !0,
     direction: "end"
   } : {
@@ -1011,35 +1011,35 @@ function Xt({
   scrollAmount: n,
   withLoop: i = !1,
   enableGestures: c = !0,
-  carouselAxis: s = "x",
+  carouselAxis: o = "x",
   slideWhenDragThresholdIsReached: d = !0,
   itemsPerSlide: m,
   scrollAmountType: I,
   gutter: l = 0,
-  startEndGutter: A = 0,
-  fadeIn: T = !1
+  startEndGutter: N = 0,
+  fadeIn: k = !1
 }) {
-  const O = M(!1), $ = M([]), F = M(!1), w = m ?? 1, E = I ?? "slide", L = i ? [
-    ...e.map((o) => ({
-      ...o,
-      id: `prev-repeated-item-${o.id}`
+  const O = M(!1), $ = M([]), F = M(!1), x = m ?? 1, E = I ?? "slide", L = i ? [
+    ...e.map((s) => ({
+      ...s,
+      id: `prev-repeated-item-${s.id}`
     })),
     ...e,
-    ...e.map((o) => ({
-      ...o,
-      id: `next-repeated-item-${o.id}`
+    ...e.map((s) => ({
+      ...s,
+      id: `next-repeated-item-${s.id}`
     }))
   ] : e, q = M(n), J = M(0), b = Xe().replace(/:/g, ""), V = M(null), S = M(null), be = M(0), p = M(!0), h = M(!1), a = M(0), [B, re] = qe(() => ({
     value: 0,
-    onChange({ value: o }) {
-      (t === "fixed" || t === "fluid") && (s === "x" ? S.current.style.transform = `translate3d(${o.value}px, 0px, 0px)` : S.current.style.transform = `translate3d(${o.value}px, 0px, 0px)`), t === "freeScroll" && (S.current[s === "x" ? "scrollLeft" : "scrollTop"] = Math.abs(o.value));
+    onChange({ value: s }) {
+      (t === "fixed" || t === "fluid") && (o === "x" ? S.current.style.transform = `translate3d(${s.value}px, 0px, 0px)` : S.current.style.transform = `translate3d(${s.value}px, 0px, 0px)`), t === "freeScroll" && (S.current[o === "x" ? "scrollLeft" : "scrollTop"] = Math.abs(s.value));
     }
   })), { useListenToCustomEvent: Ue, emitEvent: W } = Qe();
   function g() {
     return Y(q.current ?? 0);
   }
   function G() {
-    return S.current[s === "x" ? "scrollWidth" : "scrollHeight"] - V.current.getBoundingClientRect()[s === "x" ? "width" : "height"];
+    return S.current[o === "x" ? "scrollWidth" : "scrollHeight"] - V.current.getBoundingClientRect()[o === "x" ? "width" : "height"];
   }
   function Q() {
     ge("The carousel can't be initialized. List of errors:"), console.table($.current);
@@ -1049,63 +1049,63 @@ function Xt({
       onWheel() {
         B.value.stop();
       },
-      onScroll(o) {
-        const f = o.currentTarget, v = s === "x" ? f.scrollLeft : f.scrollTop, u = s === "x" ? f.scrollWidth - f.clientWidth : f.scrollHeight - f.clientHeight;
+      onScroll(s) {
+        const f = s.currentTarget, v = o === "x" ? f.scrollLeft : f.scrollTop, u = o === "x" ? f.scrollWidth - f.clientWidth : f.scrollHeight - f.clientHeight;
         v === 0 ? p.current = !0 : v === u ? h.current = !0 : (p.current = !1, h.current = !1);
       }
     } : {};
   }
   function Ge() {
-    let o = 0, f = 0;
+    let s = 0, f = 0;
     const v = getComputedStyle(
       document.documentElement
     ).getPropertyValue(`--${b}-react-spring-carousel-item-gutter`), u = getComputedStyle(
       document.documentElement
     ).getPropertyValue(`--${b}-react-spring-carousel-item-gutter`);
-    return u.includes("px") && (o = Number(u.replace("px", ""))), v.includes("px") && (f = Number(
+    return u.includes("px") && (s = Number(u.replace("px", ""))), v.includes("px") && (f = Number(
       v.replace("px", "")
-    )), { totalGutterCssVar: o, totalStartEndGutterCssVar: f };
+    )), { totalGutterCssVar: s, totalStartEndGutterCssVar: f };
   }
   function Ke() {
-    return w > 1 ? `calc(100% / ${w} - var(--${b}-react-spring-carousel-item-gutter) / ${w} * ${w - 1}) !important` : "100% !important";
+    return x > 1 ? `calc(100% / ${x} - var(--${b}-react-spring-carousel-item-gutter) / ${x} * ${x - 1}) !important` : "100% !important";
   }
   function ne({
-    type: o,
+    type: s,
     actionType: f,
     newActiveItem: v
   }) {
     var U, K, H, Z, ie, ye, _e;
-    let u = 0, x = B.value.get();
+    let u = 0, y = B.value.get();
     if (p.current = !1, h.current = !1, t === "fixed") {
-      const k = a.current;
-      if (o === "prev" && (a.current = v ?? a.current - 1), o === "next" && (a.current = v ?? a.current + 1), i && E === "group" && w > 1 && o === "next") {
-        const y = e.length / w, j = Math.ceil(y) - 1 === a.current, z = Math.ceil(y) === a.current;
-        j && (h.current = !0), u = -(a.current * g()), z && (a.current = 0, x = B.value.get() + g() * y, u = 0, h.current = !1, p.current = !0);
+      const T = a.current;
+      if (s === "prev" && (a.current = v ?? a.current - 1), s === "next" && (a.current = v ?? a.current + 1), i && E === "group" && x > 1 && s === "next") {
+        const _ = e.length / x, j = Math.ceil(_) - 1 === a.current, z = Math.ceil(_) === a.current;
+        j && (h.current = !0), u = -(a.current * g()), z && (a.current = 0, y = B.value.get() + g() * _, u = 0, h.current = !1, p.current = !0);
       }
-      if (i && E === "group" && w > 1 && o === "prev") {
-        const y = e.length / w, j = a.current === 0, z = a.current === -1;
-        u = -(a.current * g()), j && (p.current = !0), z && (p.current = !1, h.current = !0, a.current = y - 1, x = B.value.get() - g() * y, u = -g() * y + g());
+      if (i && E === "group" && x > 1 && s === "prev") {
+        const _ = e.length / x, j = a.current === 0, z = a.current === -1;
+        u = -(a.current * g()), j && (p.current = !0), z && (p.current = !1, h.current = !0, a.current = _ - 1, y = B.value.get() - g() * _, u = -g() * _ + g());
       }
-      if (!i && E === "group" && w > 1) {
-        const y = e.length / w, j = 2 % y !== 0, z = Math.ceil(y - 1) === a.current, fe = a.current === 0;
+      if (!i && E === "group" && x > 1) {
+        const _ = e.length / x, j = 2 % _ !== 0, z = Math.ceil(_ - 1) === a.current, fe = a.current === 0;
         u = -(a.current * g()), fe && (p.current = !0), z && (h.current = !0, j && (u = -G()));
       }
-      if (i && o === "next" && (E === "slide" || E === "group" && w === 1)) {
-        const y = ((U = e[a.current]) == null ? void 0 : U.id) === e[e.length - 1].id, j = L[e.length + a.current].id.includes(
+      if (i && s === "next" && (E === "slide" || E === "group" && x === 1)) {
+        const _ = ((U = e[a.current]) == null ? void 0 : U.id) === e[e.length - 1].id, j = L[e.length + a.current].id.includes(
           "repeated-item"
         );
-        y && (h.current = !0), j && (a.current = 0, x = B.value.get() + g() * e.length, h.current = !1, p.current = !0), u = -(a.current * g());
+        _ && (h.current = !0), j && (a.current = 0, y = B.value.get() + g() * e.length, h.current = !1, p.current = !0), u = -(a.current * g());
       }
-      if (i && o === "prev" && (E === "slide" || E === "group" && w === 1)) {
-        const y = L.findIndex(
-          (fe) => fe.id === e[k].id
-        ), j = ((K = e[a.current]) == null ? void 0 : K.id) === e[0].id, z = L[y - 1].id.includes("repeated-item");
-        j && (p.current = !0), z && (p.current = !1, h.current = !0, a.current = e.length - 1, x = B.value.get() - g() * e.length), u = -(a.current * g());
+      if (i && s === "prev" && (E === "slide" || E === "group" && x === 1)) {
+        const _ = L.findIndex(
+          (fe) => fe.id === e[T].id
+        ), j = ((K = e[a.current]) == null ? void 0 : K.id) === e[0].id, z = L[_ - 1].id.includes("repeated-item");
+        j && (p.current = !0), z && (p.current = !1, h.current = !0, a.current = e.length - 1, y = B.value.get() - g() * e.length), u = -(a.current * g());
       }
-      !i && E === "slide" && (((H = e[a.current + 1]) == null ? void 0 : H.id) === e[e.length - 1].id ? h.current = !0 : a.current === 0 ? p.current = !0 : (p.current = !1, h.current = !1), u = -(a.current * g()), o === "next" && Math.abs(u) > G() && (h.current = !0, u = -G())), W({
+      !i && E === "slide" && (((H = e[a.current + 1]) == null ? void 0 : H.id) === e[e.length - 1].id ? h.current = !0 : a.current === 0 ? p.current = !0 : (p.current = !1, h.current = !1), u = -(a.current * g()), s === "next" && Math.abs(u) > G() && (h.current = !0, u = -G())), W({
         eventName: "onSlideStartChange",
         sliceActionType: f,
-        slideDirection: o,
+        slideDirection: s,
         nextItem: {
           index: a.current,
           id: e[a.current].id,
@@ -1115,26 +1115,26 @@ function Xt({
       });
     }
     if (t === "fluid") {
-      if (o === "prev" && (a.current = v ?? a.current - 1), o === "next" && (a.current = v ?? a.current + 1), u = -(a.current * g()), o === "next" && i) {
-        const k = ((Z = e[a.current]) == null ? void 0 : Z.id) === e[e.length - 1].id, y = L[e.length + a.current].id.includes(
+      if (s === "prev" && (a.current = v ?? a.current - 1), s === "next" && (a.current = v ?? a.current + 1), u = -(a.current * g()), s === "next" && i) {
+        const T = ((Z = e[a.current]) == null ? void 0 : Z.id) === e[e.length - 1].id, _ = L[e.length + a.current].id.includes(
           "repeated-item"
         );
-        k && (h.current = !0), y && (a.current = 0, x = B.value.get() + g() * e.length, u = 0, h.current = !1, p.current = !0);
+        T && (h.current = !0), _ && (a.current = 0, y = B.value.get() + g() * e.length, u = 0, h.current = !1, p.current = !0);
       }
-      if (o === "next" && !i) {
-        const k = Math.abs(u) > G();
-        k || k ? (h.current = !0, u = -G()) : (p.current = !1, h.current = !1);
+      if (s === "next" && !i) {
+        const T = Math.abs(u) > G();
+        T || T ? (h.current = !0, u = -G()) : (p.current = !1, h.current = !1);
       }
-      if (o === "prev" && !i && ((ie = e[a.current]) == null ? void 0 : ie.id) === e[0].id && (p.current = !0), o === "prev" && i) {
-        const k = ((ye = e[a.current]) == null ? void 0 : ye.id) === e[0].id, y = (_e = L[e.length + a.current]) == null ? void 0 : _e.id.includes(
+      if (s === "prev" && !i && ((ie = e[a.current]) == null ? void 0 : ie.id) === e[0].id && (p.current = !0), s === "prev" && i) {
+        const T = ((ye = e[a.current]) == null ? void 0 : ye.id) === e[0].id, _ = (_e = L[e.length + a.current]) == null ? void 0 : _e.id.includes(
           "repeated-item"
         );
-        k && (p.current = !0), y && (a.current = e.length - 1, x = B.value.get() - g() * e.length, u = -(g() * e.length - g()), p.current = !1, h.current = !0);
+        T && (p.current = !0), _ && (a.current = e.length - 1, y = B.value.get() - g() * e.length, u = -(g() * e.length - g()), p.current = !1, h.current = !0);
       }
       W({
         eventName: "onSlideStartChange",
         sliceActionType: f,
-        slideDirection: o,
+        slideDirection: s,
         nextItem: {
           startReached: p.current,
           endReached: h.current,
@@ -1144,21 +1144,21 @@ function Xt({
       });
     }
     if (t === "freeScroll") {
-      const k = S.current[s === "x" ? "scrollLeft" : "scrollTop"], y = s === "x" ? S.current.scrollWidth - S.current.clientWidth : S.current.scrollHeight - S.current.clientHeight;
-      x = k, o === "prev" && (u = x - g(), u < 0 && (u = 0), x - g() <= 0 && (p.current = !0), W({
+      const T = S.current[o === "x" ? "scrollLeft" : "scrollTop"], _ = o === "x" ? S.current.scrollWidth - S.current.clientWidth : S.current.scrollHeight - S.current.clientHeight;
+      y = T, s === "prev" && (u = y - g(), u < 0 && (u = 0), y - g() <= 0 && (p.current = !0), W({
         eventName: "onSlideStartChange",
         sliceActionType: f,
-        slideDirection: o,
+        slideDirection: s,
         nextItem: {
           index: 0,
           id: "",
           startReached: p.current,
           endReached: !1
         }
-      })), o === "next" && (u = x + g(), u > y && (u = y), x + g() >= y && (h.current = !0), W({
+      })), s === "next" && (u = y + g(), u > _ && (u = _), y + g() >= _ && (h.current = !0), W({
         eventName: "onSlideStartChange",
         sliceActionType: f,
-        slideDirection: o,
+        slideDirection: s,
         nextItem: {
           index: 0,
           id: "",
@@ -1167,29 +1167,29 @@ function Xt({
         }
       }));
     }
-    const N = Y(x), P = Y(u);
-    be.current = P, re.start({
+    const P = Y(y), A = Y(u);
+    be.current = A, re.start({
       from: {
-        value: N
+        value: P
       },
       to: {
-        value: P
+        value: A
       },
-      onRest({ finished: k }) {
-        k && t === "fixed" && W({
+      onRest({ finished: T }) {
+        T && t === "fixed" && W({
           eventName: "onSlideChangeComplete",
           sliceActionType: f,
-          slideDirection: o,
+          slideDirection: s,
           currentItem: {
             index: a.current,
             id: e[a.current].id,
             startReached: p.current,
             endReached: h.current
           }
-        }), k && t === "fluid" && W({
+        }), T && t === "fluid" && W({
           eventName: "onSlideChangeComplete",
           sliceActionType: f,
-          slideDirection: o,
+          slideDirection: s,
           currentItem: {
             index: 0,
             id: "",
@@ -1200,63 +1200,63 @@ function Xt({
       }
     });
   }
-  function ue(o, f) {
+  function ue(s, f) {
     if (!O.current) {
       Q();
       return;
     }
-    if (t === "fixed" && i || t === "fixed" && !i && !h.current) {
+    if (s === "drag" || t === "fixed" && i || t === "fixed" && !i && !h.current) {
       const v = f ?? a.current + 1;
       ne({
         type: "next",
-        actionType: o,
+        actionType: s,
         newActiveItem: v
       });
     }
     (t === "fluid" && i || t === "fluid" && !i && !h.current || t === "freeScroll" && !h.current) && ne({
       type: "next",
-      actionType: o
+      actionType: s
     });
   }
-  function le(o, f) {
+  function le(s, f) {
     if (!O.current) {
       Q();
       return;
     }
-    if (t === "fixed" && i || t === "fixed" && !i && !p.current) {
+    if (s === "drag" || t === "fixed" && i || t === "fixed" && !i && !p.current) {
       const v = f ?? a.current - 1;
       ne({
         type: "prev",
-        actionType: o,
+        actionType: s,
         newActiveItem: v
       });
     }
     (t === "fluid" && i || t === "fluid" && !i && !p.current || t === "freeScroll" && !p.current) && ne({
       type: "prev",
-      actionType: o
+      actionType: s
     });
   }
-  function Fe(o) {
+  function Fe(s) {
     let f = 0;
-    typeof o == "string" ? f = e.findIndex((v) => v.id === o) : f = o, f > a.current && ue("click", f), f < a.current && le("click", f);
+    typeof s == "string" ? f = e.findIndex((v) => v.id === s) : f = s, f > a.current && ue("click", f), f < a.current && le("click", f);
   }
   function We({
-    getContainer: o,
+    getContainer: s,
     activeItem: f,
     updateTotalValue: v
   }) {
-    const u = o();
+    const u = s();
     if (!(u instanceof HTMLElement)) {
       console.warn(
         `Container is not a valid html element: container is ${u}`
       );
       return;
     }
-    const x = u.children[f];
-    if (x) {
-      const N = u[s === "x" ? "scrollWidth" : "scrollHeight"] - u.getBoundingClientRect()[s === "x" ? "width" : "height"], U = x.offsetLeft + x.offsetWidth / 2 - u.clientWidth / 2, K = Ft(x);
+    const y = u.children[f];
+    if (y) {
+      const P = u[o === "x" ? "scrollWidth" : "scrollHeight"] - u.getBoundingClientRect()[o === "x" ? "width" : "height"], U = y.offsetLeft + y.offsetWidth / 2 - u.clientWidth / 2, K = Ft(y);
       if (K.isOut) {
-        const H = K.direction === "start" ? U < 0 ? 0 : U : U > N ? N : U, Z = u[s === "x" ? "scrollLeft" : "scrollTop"];
+        const H = K.direction === "start" ? U < 0 ? 0 : U : U > P ? P : U, Z = u[o === "x" ? "scrollLeft" : "scrollTop"];
         new Je({
           from: {
             value: Z
@@ -1269,39 +1269,43 @@ function Xt({
             }) : H
           },
           onChange({ value: ie }) {
-            u[s === "x" ? "scrollLeft" : "scrollTop"] = ie.value;
+            u[o === "x" ? "scrollLeft" : "scrollTop"] = ie.value;
           }
         });
       }
     }
   }
   const He = Kt(
-    (o) => {
+    (s) => {
       if (!O.current) {
         Q();
         return;
       }
-      const f = o.dragging, v = o.offset[s === "x" ? 0 : 1], u = o.movement[s === "x" ? 0 : 1], x = u > J.current, N = u < -J.current, P = o.velocity;
+      const f = s.dragging, v = s.offset[o === "x" ? 0 : 1], u = s.movement[o === "x" ? 0 : 1], y = u > J.current, P = u < -J.current, A = s.velocity;
       f && (W({
-        ...o,
+        ...s,
         eventName: "onDrag",
         slideActionType: "drag"
       }), re.start({
         value: v,
         immediate: !0,
         config: {
-          velocity: P
+          velocity: A
         }
-      }), d && (x || N) && o.cancel()), o.last && (x ? le("drag") : N ? ue("drag") : re.start({
+      }), d && (y || P) && (console.log("cancel", {
+        slideWhenDragThresholdIsReached: d,
+        prevItemTresholdReached: y,
+        nextItemTresholdReached: P
+      }), s.cancel())), s.last && (console.log("last"), y ? le("drag") : P ? ue("drag") : re.start({
         value: be.current,
         config: {
-          velocity: P
+          velocity: A
         }
       }));
     },
     {
       enabled: c && t !== "freeScroll",
-      axis: s,
+      axis: o,
       rubberband: !i,
       ...i ? {} : {
         bounds: () => ({
@@ -1315,16 +1319,16 @@ function Xt({
     }
   );
   return Ae(() => {
-    function o() {
+    function s() {
       document.hidden ? (F.current = !0, O.current = !1) : (F.current = !1, O.current = !0);
     }
     function f() {
       if (!(t === "fixed" && !i || t === "freeScroll"))
-        if (t === "fixed" && E === "group" && w > 1) {
-          const N = e.length * 3 / w;
-          S.current.style[s === "x" ? "left" : "top"] = `-${Y(g() * N / 3)}px`;
+        if (t === "fixed" && E === "group" && x > 1) {
+          const P = e.length * 3 / x;
+          S.current.style[o === "x" ? "left" : "top"] = `-${Y(g() * P / 3)}px`;
         } else
-          S.current.style[s === "x" ? "left" : "top"] = `-${Y(g() * L.length / 3)}px`;
+          S.current.style[o === "x" ? "left" : "top"] = `-${Y(g() * L.length / 3)}px`;
     }
     function v() {
       u(), f(), re.start({
@@ -1333,23 +1337,23 @@ function Xt({
       });
     }
     function u() {
-      const N = S.current.children[0];
-      let P = 0;
-      const U = t === "fixed" && E === "group" && w > 1;
-      U ? P = Y(
-        S.current.getBoundingClientRect()[s === "x" ? "width" : "height"]
-      ) : P = Y(
-        N.getBoundingClientRect()[s === "x" ? "width" : "height"]
+      const P = S.current.children[0];
+      let A = 0;
+      const U = t === "fixed" && E === "group" && x > 1;
+      U ? A = Y(
+        S.current.getBoundingClientRect()[o === "x" ? "width" : "height"]
+      ) : A = Y(
+        P.getBoundingClientRect()[o === "x" ? "width" : "height"]
       );
       let { totalGutterCssVar: K, totalStartEndGutterCssVar: H } = Ge();
-      return P += K, U && (P -= H), q.current = P, P;
+      return A += K, U && (A -= H), q.current = A, A;
     }
-    function x() {
+    function y() {
       if ($.current = [], L.length === 0 && ge(
         "Init is true but no items are available; carousel will not be initialized"
-      ), t === "fixed" && E === "group" && w === 1 && ge(
+      ), t === "fixed" && E === "group" && x === 1 && ge(
         "Using scrollAmountType='group' and itemsPerSlide={1} makes no difference; itemsPerSlide must be greater than 1."
-      ), t === "fixed" && E === "group" && e.length % w !== 0 && $.current.push("When using scrollAmountType='group' and itemsPerSlide={number>1} make sure that itemsPerSlides is divisible by the total quantity of items otherwise the carousel won't initialize."), t === "fluid" && I !== void 0 && $.current.push(
+      ), t === "fixed" && E === "group" && e.length % x !== 0 && $.current.push("When using scrollAmountType='group' and itemsPerSlide={number>1} make sure that itemsPerSlides is divisible by the total quantity of items otherwise the carousel won't initialize."), t === "fluid" && I !== void 0 && $.current.push(
         'scrollAmountType="group" is not available for slideType="fluid"; please change one of them.'
       ), t === "fluid" && m !== void 0 && $.current.push(
         `itemsPerSlide=${m} is not available for slideType="fluid"; please change one of them.`
@@ -1360,14 +1364,14 @@ function Xt({
       u(), i && f(), J.current = g() / 4, O.current = !0;
     }
     if (r)
-      return x(), window.addEventListener("resize", v), document.addEventListener("visibilitychange", o), () => {
+      return y(), window.addEventListener("resize", v), document.addEventListener("visibilitychange", s), () => {
         document.removeEventListener(
           "visibilitychange",
-          o
+          s
         ), window.removeEventListener("resize", v);
       };
     O.current = !1;
-  }, [q, r, t, i, s]), {
+  }, [q, r, t, i, o]), {
     carouselFragment: /* @__PURE__ */ ze(Ye, { children: [
       /* @__PURE__ */ se(
         "style",
@@ -1377,7 +1381,7 @@ function Xt({
             __html: `
             :root {
               --${b}-react-spring-carousel-item-gutter: ${l}px;
-              --${b}-react-spring-carousel-start-end-gutter: ${A}px;
+              --${b}-react-spring-carousel-start-end-gutter: ${N}px;
             }
             .carousel-${b} {
               display: flex;
@@ -1390,10 +1394,10 @@ function Xt({
               display: flex;
               width: calc(100% - var(--${b}-react-spring-carousel-start-end-gutter) * 2);
               padding-left: var(--${b}-react-spring-carousel-start-end-gutter);
-              touch-action: ${c ? s === "x" ? "pan-y" : "pan-x" : "auto"};
-              flex-direction: ${s === "x" ? "row" : "column"};
-              overflow-x: ${t === "freeScroll" && s === "x" ? "auto" : "initial"};
-              overflow-y: ${t === "freeScroll" && s === "y" ? "auto" : "initial"};
+              touch-action: ${c ? o === "x" ? "pan-y" : "pan-x" : "auto"};
+              flex-direction: ${o === "x" ? "row" : "column"};
+              overflow-x: ${t === "freeScroll" && o === "x" ? "auto" : "initial"};
+              overflow-y: ${t === "freeScroll" && o === "y" ? "auto" : "initial"};
             }
             .carousel-${b} .use-spring-carousel-track::after {
               content: "";
@@ -1413,7 +1417,7 @@ function Xt({
             .carousel-${b}[data-carousel-direction=y] .use-spring-carousel-item:not(:last-child) {
               margin-bottom: var(--${b}-react-spring-carousel-item-gutter);
             }
-            ${T ? `.carousel-${b} .use-spring-carousel-item {
+            ${k ? `.carousel-${b} .use-spring-carousel-item {
                   position: absolute;
                   top: 0;
                   left: 0;
@@ -1433,7 +1437,7 @@ function Xt({
         {
           className: `use-spring-carousel-container carousel-${b}`,
           ref: V,
-          "data-carousel-direction": s,
+          "data-carousel-direction": o,
           children: /* @__PURE__ */ se(
             "div",
             {
@@ -1441,14 +1445,14 @@ function Xt({
               ...He(),
               ref: S,
               ...je(),
-              children: L.map((o, f) => /* @__PURE__ */ se(
+              children: L.map((s, f) => /* @__PURE__ */ se(
                 "div",
                 {
                   className: "use-spring-carousel-item",
-                  id: o.id,
-                  children: o.renderItem
+                  id: s.id,
+                  children: s.renderItem
                 },
-                `${o.id}-${f}`
+                `${s.id}-${f}`
               ))
             }
           )
@@ -1458,12 +1462,12 @@ function Xt({
     useListenToCustomEvent: Ue,
     slideToNextItem: () => ue("click"),
     slideToPrevItem: () => le("click"),
-    slideToIem: (o) => {
+    slideToIem: (s) => {
       if (!O.current) {
         Q();
         return;
       }
-      Fe(o);
+      Fe(s);
     },
     handleThumbsContainerScroll: We,
     carouselId: b

package/dist/index.umd.js

@@ -1,7 +1,7 @@
-(function(G,R){typeof exports=="object"&&typeof module<"u"?R(exports,require("react/jsx-runtime"),require("react"),require("@react-spring/web")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@react-spring/web"],R):(G=typeof globalThis<"u"?globalThis:G||self,R(G["react-spring-carousel"]={},G["react/jsx-runtime"],G.React,G["@react-spring/web"]))})(this,function(G,R,E,be){"use strict";const le="RSC::Event";function Be(){const r=E.useRef(null);function e(n){E.useEffect(()=>{r.current||(r.current=document.createElement("div"));function i(c){n(c.detail)}if(r.current)return r.current.addEventListener(le,i,!1),()=>{var c;(c=r.current)==null||c.removeEventListener(le,i,!1)}},[n])}function t(n){if(r.current){const i=new CustomEvent(le,{detail:n});r.current.dispatchEvent(i)}}return{useListenToCustomEvent:e,emitEvent:t}}function Ue(r,e,t){return Math.max(e,Math.min(r,t))}const S={toVector(r,e){return r===void 0&&(r=e),Array.isArray(r)?r:[r,r]},add(r,e){return[r[0]+e[0],r[1]+e[1]]},sub(r,e){return[r[0]-e[0],r[1]-e[1]]},addTo(r,e){r[0]+=e[0],r[1]+=e[1]},subTo(r,e){r[0]-=e[0],r[1]-=e[1]}};function ye(r,e,t){return e===0||Math.abs(e)===1/0?Math.pow(r,t*5):r*e*t/(e+t*r)}function _e(r,e,t,n=.15){return n===0?Ue(r,e,t):r<e?-ye(e-r,t-e,n)+e:r>t?+ye(r-t,t-e,n)+t:r}function Ge(r,[e,t],[n,i]){const[[c,s],[d,m]]=r;return[_e(e,c,s,n),_e(t,d,m,i)]}function Ke(r,e){if(typeof r!="object"||r===null)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var n=t.call(r,e||"default");if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(r)}function Fe(r){var e=Ke(r,"string");return typeof e=="symbol"?e:String(e)}function C(r,e,t){return e=Fe(e),e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function we(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(i){return Object.getOwnPropertyDescriptor(r,i).enumerable})),t.push.apply(t,n)}return t}function b(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?we(Object(t),!0).forEach(function(n){C(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):we(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}const xe={pointer:{start:"down",change:"move",end:"up"},mouse:{start:"down",change:"move",end:"up"},touch:{start:"start",change:"move",end:"end"},gesture:{start:"start",change:"change",end:"end"}};function Ie(r){return r?r[0].toUpperCase()+r.slice(1):""}const We=["enter","leave"];function He(r=!1,e){return r&&!We.includes(e)}function ze(r,e="",t=!1){const n=xe[r],i=n&&n[e]||e;return"on"+Ie(r)+Ie(i)+(He(t,i)?"Capture":"")}const Ye=["gotpointercapture","lostpointercapture"];function Xe(r){let e=r.substring(2).toLowerCase();const t=!!~e.indexOf("passive");t&&(e=e.replace("passive",""));const n=Ye.includes(e)?"capturecapture":"capture",i=!!~e.indexOf(n);return i&&(e=e.replace("capture","")),{device:e,capture:i,passive:t}}function qe(r,e=""){const t=xe[r],n=t&&t[e]||e;return r+n}function ie(r){return"touches"in r}function Ee(r){return ie(r)?"touch":"pointerType"in r?r.pointerType:"mouse"}function Je(r){return Array.from(r.touches).filter(e=>{var t,n;return e.target===r.currentTarget||((t=r.currentTarget)===null||t===void 0||(n=t.contains)===null||n===void 0?void 0:n.call(t,e.target))})}function Qe(r){return r.type==="touchend"||r.type==="touchcancel"?r.changedTouches:r.targetTouches}function Se(r){return ie(r)?Qe(r)[0]:r}function Ze(r){return Je(r).map(e=>e.identifier)}function fe(r){const e=Se(r);return ie(r)?e.identifier:e.pointerId}function Te(r){const e=Se(r);return[e.clientX,e.clientY]}function et(r){const e={};if("buttons"in r&&(e.buttons=r.buttons),"shiftKey"in r){const{shiftKey:t,altKey:n,metaKey:i,ctrlKey:c}=r;Object.assign(e,{shiftKey:t,altKey:n,metaKey:i,ctrlKey:c})}return e}function se(r,...e){return typeof r=="function"?r(...e):r}function tt(){}function rt(...r){return r.length===0?tt:r.length===1?r[0]:function(){let e;for(const t of r)e=t.apply(this,arguments)||e;return e}}function De(r,e){return Object.assign({},e,r||{})}const nt=32;class it{constructor(e,t,n){this.ctrl=e,this.args=t,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:t,ingKey:n,args:i}=this;t[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=i,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const t=this.state,n=this.config;t._active||(this.reset(),this.computeInitial(),t._active=!0,t.target=e.target,t.currentTarget=e.currentTarget,t.lastOffset=n.from?se(n.from,t):t.offset,t.offset=t.lastOffset,t.startTime=t.timeStamp=e.timeStamp)}computeValues(e){const t=this.state;t._values=e,t.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:t,config:n,shared:i}=this;t.args=this.args;let c=0;if(e&&(t.event=e,n.preventDefault&&e.cancelable&&t.event.preventDefault(),t.type=e.type,i.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,i.locked=!!document.pointerLockElement,Object.assign(i,et(e)),i.down=i.pressed=i.buttons%2===1||i.touches>0,c=e.timeStamp-t.timeStamp,t.timeStamp=e.timeStamp,t.elapsedTime=t.timeStamp-t.startTime),t._active){const j=t._delta.map(Math.abs);S.addTo(t._distance,j)}this.axisIntent&&this.axisIntent(e);const[s,d]=t._movement,[m,I]=n.threshold,{_step:l,values:M}=t;if(n.hasCustomTransform?(l[0]===!1&&(l[0]=Math.abs(s)>=m&&M[0]),l[1]===!1&&(l[1]=Math.abs(d)>=I&&M[1])):(l[0]===!1&&(l[0]=Math.abs(s)>=m&&Math.sign(s)*m),l[1]===!1&&(l[1]=Math.abs(d)>=I&&Math.sign(d)*I)),t.intentional=l[0]!==!1||l[1]!==!1,!t.intentional)return;const k=[0,0];if(n.hasCustomTransform){const[j,D]=M;k[0]=l[0]!==!1?j-l[0]:0,k[1]=l[1]!==!1?D-l[1]:0}else k[0]=l[0]!==!1?s-l[0]:0,k[1]=l[1]!==!1?d-l[1]:0;this.restrictToAxis&&!t._blocked&&this.restrictToAxis(k);const P=t.offset,L=t._active&&!t._blocked||t.active;L&&(t.first=t._active&&!t.active,t.last=!t._active&&t.active,t.active=i[this.ingKey]=t._active,e&&(t.first&&("bounds"in n&&(t._bounds=se(n.bounds,t)),this.setup&&this.setup()),t.movement=k,this.computeOffset()));const[z,w]=t.offset,[[T,V],[ee,te]]=t._bounds;t.overflow=[z<T?-1:z>V?1:0,w<ee?-1:w>te?1:0],t._movementBound[0]=t.overflow[0]?t._movementBound[0]===!1?t._movement[0]:t._movementBound[0]:!1,t._movementBound[1]=t.overflow[1]?t._movementBound[1]===!1?t._movement[1]:t._movementBound[1]:!1;const y=t._active?n.rubberband||[0,0]:[0,0];if(t.offset=Ge(t._bounds,t.offset,y),t.delta=S.sub(t.offset,P),this.computeMovement(),L&&(!t.last||c>nt)){t.delta=S.sub(t.offset,P);const j=t.delta.map(Math.abs);S.addTo(t.distance,j),t.direction=t.delta.map(Math.sign),t._direction=t._delta.map(Math.sign),!t.first&&c>0&&(t.velocity=[j[0]/c,j[1]/c],t.timeDelta=c)}}emit(){const e=this.state,t=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const i=this.handler(b(b(b({},t),e),{},{[this.aliasKey]:e.values}));i!==void 0&&(e.memo=i)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function st([r,e],t){const n=Math.abs(r),i=Math.abs(e);if(n>i&&n>t)return"x";if(i>n&&i>t)return"y"}class ot extends it{constructor(...e){super(...e),C(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=S.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=S.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const t=this.state,n=this.config;if(!t.axis&&e){const i=typeof n.axisThreshold=="object"?n.axisThreshold[Ee(e)]:n.axisThreshold;t.axis=st(t._movement,i)}t._blocked=(n.lockDirection||!!n.axis)&&!t.axis||!!n.axis&&n.axis!==t.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const ke=r=>r,Ce=.15,de={enabled(r=!0){return r},eventOptions(r,e,t){return b(b({},t.shared.eventOptions),r)},preventDefault(r=!1){return r},triggerAllEvents(r=!1){return r},rubberband(r=0){switch(r){case!0:return[Ce,Ce];case!1:return[0,0];default:return S.toVector(r)}},from(r){if(typeof r=="function")return r;if(r!=null)return S.toVector(r)},transform(r,e,t){const n=r||t.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const i=n||ke;return c=>{const s=i(c);return(!isFinite(s[0])||!isFinite(s[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${s[0]},${[1]}]`),s}}return n||ke},threshold(r){return S.toVector(r,0)}};process.env.NODE_ENV==="development"&&Object.assign(de,{domTarget(r){if(r!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(r){if(r!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(r){if(r!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const ct=0,Q=b(b({},de),{},{axis(r,e,{axis:t}){if(this.lockDirection=t==="lock",!this.lockDirection)return t},axisThreshold(r=ct){return r},bounds(r={}){if(typeof r=="function")return c=>Q.bounds(r(c));if("current"in r)return()=>r.current;if(typeof HTMLElement=="function"&&r instanceof HTMLElement)return r;const{left:e=-1/0,right:t=1/0,top:n=-1/0,bottom:i=1/0}=r;return[[e,t],[n,i]]}}),Oe={ArrowRight:(r,e=1)=>[r*e,0],ArrowLeft:(r,e=1)=>[-1*r*e,0],ArrowUp:(r,e=1)=>[0,-1*r*e],ArrowDown:(r,e=1)=>[0,r*e]};class at extends ot{constructor(...e){super(...e),C(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const t=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),i={left:t.left-n.left+e.offset[0],right:t.right-n.right+e.offset[0],top:t.top-n.top+e.offset[1],bottom:t.bottom-n.bottom+e.offset[1]};e._bounds=Q.bounds(i)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const t=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(t.pointerButtons)?!t.pointerButtons.includes(e.buttons):t.pointerButtons!==-1&&t.pointerButtons!==e.buttons))return;const i=this.ctrl.setEventIds(e);t.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(i&&i.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=fe(e),n._pointerActive=!0,this.computeValues(Te(e)),this.computeInitial(),t.preventScrollAxis&&Ee(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):t.delay>0?(this.setupDelayTrigger(e),t.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const t=this.state;t._active=!0,t._preventScroll=!0,t._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const t=this.state,n=this.config;if(!t._pointerActive)return;const i=fe(e);if(t._pointerId!==void 0&&i!==t._pointerId)return;const c=Te(e);if(document.pointerLockElement===e.target?t._delta=[e.movementX,e.movementY]:(t._delta=S.sub(c,t._values),this.computeValues(c)),S.addTo(t._movement,t._delta),this.compute(e),t._delayed&&t.intentional){this.timeoutStore.remove("dragDelay"),t.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!t._preventScroll)if(t.axis)if(t.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){t._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const t=this.state,n=this.config;if(!t._active||!t._pointerActive)return;const i=fe(e);if(t._pointerId!==void 0&&i!==t._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[c,s]=t._distance;if(t.tap=c<=n.tapsThreshold&&s<=n.tapsThreshold,t.tap&&n.filterTaps)t._force=!0;else{const[d,m]=t._delta,[I,l]=t._movement,[M,k]=n.swipe.velocity,[P,L]=n.swipe.distance,z=n.swipe.duration;if(t.elapsedTime<z){const w=Math.abs(d/t.timeDelta),T=Math.abs(m/t.timeDelta);w>M&&Math.abs(I)>P&&(t.swipe[0]=Math.sign(d)),T>k&&Math.abs(l)>L&&(t.swipe[1]=Math.sign(m))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const t=this.config,n=t.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&t.preventScrollDelay===void 0){const i="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(i).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",i)}}catch{}t.pointerLock&&e.currentTarget.requestPointerLock(),t.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,ut(e);const t=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",t),this.eventStore.add(this.sharedConfig.window,"touch","cancel",t),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const t=Oe[e.key];if(t){const n=this.state,i=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=t(this.config.keyboardDisplacement,i),n._keyboardActive=!0,S.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in Oe&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const t=this.config.device;e(t,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(t,"change",this.pointerMove.bind(this)),e(t,"end",this.pointerUp.bind(this)),e(t,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function ut(r){"persist"in r&&typeof r.persist=="function"&&r.persist()}const Z=typeof window<"u"&&window.document&&window.document.createElement;function Pe(){return Z&&"ontouchstart"in window}function lt(){return Pe()||Z&&window.navigator.maxTouchPoints>1}function ft(){return Z&&"onpointerdown"in window}function dt(){return Z&&"exitPointerLock"in window.document}function ht(){try{return"constructor"in GestureEvent}catch{return!1}}const N={isBrowser:Z,gesture:ht(),touch:Pe(),touchscreen:lt(),pointer:ft(),pointerLock:dt()},pt=250,gt=180,mt=.5,vt=50,bt=250,yt=10,Ae={mouse:0,touch:0,pen:8},Ne=b(b({},Q),{},{device(r,e,{pointer:{touch:t=!1,lock:n=!1,mouse:i=!1}={}}){return this.pointerLock=n&&N.pointerLock,N.touch&&t?"touch":this.pointerLock?"mouse":N.pointer&&!i?"pointer":N.touch?"touch":"mouse"},preventScrollAxis(r,e,{preventScroll:t}){if(this.preventScrollDelay=typeof t=="number"?t:t||t===void 0&&r?pt:void 0,!(!N.touchscreen||t===!1))return r||(t!==void 0?"y":void 0)},pointerCapture(r,e,{pointer:{capture:t=!0,buttons:n=1,keys:i=!0}={}}){return this.pointerButtons=n,this.keys=i,!this.pointerLock&&this.device==="pointer"&&t},threshold(r,e,{filterTaps:t=!1,tapsThreshold:n=3,axis:i=void 0}){const c=S.toVector(r,t?n:i?1:0);return this.filterTaps=t,this.tapsThreshold=n,c},swipe({velocity:r=mt,distance:e=vt,duration:t=bt}={}){return{velocity:this.transform(S.toVector(r)),distance:this.transform(S.toVector(e)),duration:t}},delay(r=0){switch(r){case!0:return gt;case!1:return 0;default:return r}},axisThreshold(r){return r?b(b({},Ae),r):Ae},keyboardDisplacement(r=yt){return r}});process.env.NODE_ENV==="development"&&Object.assign(Ne,{useTouch(r){if(r!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(r){if(r!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),b(b({},de),{},{device(r,e,{shared:t,pointer:{touch:n=!1}={}}){if(t.target&&!N.touch&&N.gesture)return"gesture";if(N.touch&&n)return"touch";if(N.touchscreen){if(N.pointer)return"pointer";if(N.touch)return"touch"}},bounds(r,e,{scaleBounds:t={},angleBounds:n={}}){const i=s=>{const d=De(se(t,s),{min:-1/0,max:1/0});return[d.min,d.max]},c=s=>{const d=De(se(n,s),{min:-1/0,max:1/0});return[d.min,d.max]};return typeof t!="function"&&typeof n!="function"?[i(),c()]:s=>[i(s),c(s)]},threshold(r,e,t){return this.lockDirection=t.axis==="lock",S.toVector(r,this.lockDirection?[.1,3]:0)},modifierKey(r){return r===void 0?"ctrlKey":r},pinchOnWheel(r=!0){return r}}),b(b({},Q),{},{mouseOnly:(r=!0)=>r}),b(b({},Q),{},{mouseOnly:(r=!0)=>r});const Me=new Map,he=new Map;function _t(r){Me.set(r.key,r.engine),he.set(r.key,r.resolver)}const wt={key:"drag",engine:at,resolver:Ne};function xt(r,e){if(r==null)return{};var t={},n=Object.keys(r),i,c;for(c=0;c<n.length;c++)i=n[c],!(e.indexOf(i)>=0)&&(t[i]=r[i]);return t}function It(r,e){if(r==null)return{};var t=xt(r,e),n,i;if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(r);for(i=0;i<c.length;i++)n=c[i],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}const Et={target(r){if(r)return()=>"current"in r?r.current:r},enabled(r=!0){return r},window(r=N.isBrowser?window:void 0){return r},eventOptions({passive:r=!0,capture:e=!1}={}){return{passive:r,capture:e}},transform(r){return r}},St=["target","eventOptions","window","enabled","transform"];function oe(r={},e){const t={};for(const[n,i]of Object.entries(e))switch(typeof i){case"function":if(process.env.NODE_ENV==="development"){const c=i.call(t,r[n],n,r);Number.isNaN(c)||(t[n]=c)}else t[n]=i.call(t,r[n],n,r);break;case"object":t[n]=oe(r[n],i);break;case"boolean":i&&(t[n]=r[n]);break}return t}function Tt(r,e,t={}){const n=r,{target:i,eventOptions:c,window:s,enabled:d,transform:m}=n,I=It(n,St);if(t.shared=oe({target:i,eventOptions:c,window:s,enabled:d,transform:m},Et),e){const l=he.get(e);t[e]=oe(b({shared:t.shared},I),l)}else for(const l in I){const M=he.get(l);if(M)t[l]=oe(b({shared:t.shared},I[l]),M);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(l)){if(l==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${l}\` was used. Please read the documentation for further information.`)}}return t}class $e{constructor(e,t){C(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=t}add(e,t,n,i,c){const s=this._listeners,d=qe(t,n),m=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},I=b(b({},m),c);e.addEventListener(d,i,I);const l=()=>{e.removeEventListener(d,i,I),s.delete(l)};return s.add(l),l}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class Dt{constructor(){C(this,"_timeouts",new Map)}add(e,t,n=140,...i){this.remove(e),this._timeouts.set(e,window.setTimeout(t,n,...i))}remove(e){const t=this._timeouts.get(e);t&&window.clearTimeout(t)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class kt{constructor(e){C(this,"gestures",new Set),C(this,"_targetEventStore",new $e(this)),C(this,"gestureEventStores",{}),C(this,"gestureTimeoutStores",{}),C(this,"handlers",{}),C(this,"config",{}),C(this,"pointerIds",new Set),C(this,"touchIds",new Set),C(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),Ct(this,e)}setEventIds(e){if(ie(e))return this.touchIds=new Set(Ze(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,t){this.handlers=e,this.nativeHandlers=t}applyConfig(e,t){this.config=Tt(e,t,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const t=this.config.shared,n={};let i;if(!(t.target&&(i=t.target(),!i))){if(t.enabled){for(const s of this.gestures){const d=this.config[s],m=Le(n,d.eventOptions,!!i);if(d.enabled){const I=Me.get(s);new I(this,e,s).bind(m)}}const c=Le(n,t.eventOptions,!!i);for(const s in this.nativeHandlers)c(s,"",d=>this.nativeHandlers[s](b(b({},this.state.shared),{},{event:d,args:e})),void 0,!0)}for(const c in n)n[c]=rt(...n[c]);if(!i)return n;for(const c in n){const{device:s,capture:d,passive:m}=Xe(c);this._targetEventStore.add(i,s,"",n[c],{capture:d,passive:m})}}}}function J(r,e){r.gestures.add(e),r.gestureEventStores[e]=new $e(r,e),r.gestureTimeoutStores[e]=new Dt}function Ct(r,e){e.drag&&J(r,"drag"),e.wheel&&J(r,"wheel"),e.scroll&&J(r,"scroll"),e.move&&J(r,"move"),e.pinch&&J(r,"pinch"),e.hover&&J(r,"hover")}const Le=(r,e,t)=>(n,i,c,s={},d=!1)=>{var m,I;const l=(m=s.capture)!==null&&m!==void 0?m:e.capture,M=(I=s.passive)!==null&&I!==void 0?I:e.passive;let k=d?n:ze(n,i,l);t&&M&&(k+="Passive"),r[k]=r[k]||[],r[k].push(c)};function Ot(r,e={},t,n){const i=E.useMemo(()=>new kt(r),[]);if(i.applyHandlers(r,n),i.applyConfig(e,t),E.useEffect(i.effect.bind(i)),E.useEffect(()=>i.clean.bind(i),[]),e.target===void 0)return i.bind.bind(i)}function Pt(r,e){return _t(wt),Ot({drag:r},e||{},"drag")}function At(r){const{left:e,right:t,top:n,bottom:i}=r.getBoundingClientRect(),{innerWidth:c,innerHeight:s}=window;return e<0||n<0?{isOut:!0,direction:"start"}:Math.floor(t)>Math.floor(c)||Math.floor(i)>Math.floor(s)?{isOut:!0,direction:"end"}:{isOut:!1,direction:null}}function H(r){return parseFloat(r.toFixed(2))}function pe(r){process.env.NODE_ENV!=="production"&&console.warn(r)}function Nt({init:r=!0,items:e,slideType:t="fixed",scrollAmount:n,withLoop:i=!1,enableGestures:c=!0,carouselAxis:s="x",slideWhenDragThresholdIsReached:d=!0,itemsPerSlide:m,scrollAmountType:I,gutter:l=0,startEndGutter:M=0,fadeIn:k=!1}){const P=E.useRef(!1),L=E.useRef([]),z=E.useRef(!1),w=m??1,T=I??"slide",V=i?[...e.map(o=>({...o,id:`prev-repeated-item-${o.id}`})),...e,...e.map(o=>({...o,id:`next-repeated-item-${o.id}`}))]:e,ee=E.useRef(n),te=E.useRef(0),y=E.useId().replace(/:/g,""),j=E.useRef(null),D=E.useRef(null),Re=E.useRef(0),p=E.useRef(!0),h=E.useRef(!1),a=E.useRef(0),[B,ce]=be.useSpring(()=>({value:0,onChange({value:o}){(t==="fixed"||t==="fluid")&&(s==="x"?D.current.style.transform=`translate3d(${o.value}px, 0px, 0px)`:D.current.style.transform=`translate3d(${o.value}px, 0px, 0px)`),t==="freeScroll"&&(D.current[s==="x"?"scrollLeft":"scrollTop"]=Math.abs(o.value))}})),{useListenToCustomEvent:Mt,emitEvent:Y}=Be();function g(){return H(ee.current??0)}function F(){return D.current[s==="x"?"scrollWidth":"scrollHeight"]-j.current.getBoundingClientRect()[s==="x"?"width":"height"]}function re(){pe("The carousel can't be initialized. List of errors:"),console.table(L.current)}function $t(){return t==="freeScroll"?{onWheel(){B.value.stop()},onScroll(o){const f=o.currentTarget,v=s==="x"?f.scrollLeft:f.scrollTop,u=s==="x"?f.scrollWidth-f.clientWidth:f.scrollHeight-f.clientHeight;v===0?p.current=!0:v===u?h.current=!0:(p.current=!1,h.current=!1)}}:{}}function Lt(){let o=0,f=0;const v=getComputedStyle(document.documentElement).getPropertyValue(`--${y}-react-spring-carousel-item-gutter`),u=getComputedStyle(document.documentElement).getPropertyValue(`--${y}-react-spring-carousel-item-gutter`);return u.includes("px")&&(o=Number(u.replace("px",""))),v.includes("px")&&(f=Number(v.replace("px",""))),{totalGutterCssVar:o,totalStartEndGutterCssVar:f}}function Rt(){return w>1?`calc(100% / ${w} - var(--${y}-react-spring-carousel-item-gutter) / ${w} * ${w-1}) !important`:"100% !important"}function ae({type:o,actionType:f,newActiveItem:v}){var U,W,X,ne,ue,Ve,je;let u=0,x=B.value.get();if(p.current=!1,h.current=!1,t==="fixed"){const O=a.current;if(o==="prev"&&(a.current=v??a.current-1),o==="next"&&(a.current=v??a.current+1),i&&T==="group"&&w>1&&o==="next"){const _=e.length/w,K=Math.ceil(_)-1===a.current,q=Math.ceil(_)===a.current;K&&(h.current=!0),u=-(a.current*g()),q&&(a.current=0,x=B.value.get()+g()*_,u=0,h.current=!1,p.current=!0)}if(i&&T==="group"&&w>1&&o==="prev"){const _=e.length/w,K=a.current===0,q=a.current===-1;u=-(a.current*g()),K&&(p.current=!0),q&&(p.current=!1,h.current=!0,a.current=_-1,x=B.value.get()-g()*_,u=-g()*_+g())}if(!i&&T==="group"&&w>1){const _=e.length/w,K=2%_!==0,q=Math.ceil(_-1)===a.current,ve=a.current===0;u=-(a.current*g()),ve&&(p.current=!0),q&&(h.current=!0,K&&(u=-F()))}if(i&&o==="next"&&(T==="slide"||T==="group"&&w===1)){const _=((U=e[a.current])==null?void 0:U.id)===e[e.length-1].id,K=V[e.length+a.current].id.includes("repeated-item");_&&(h.current=!0),K&&(a.current=0,x=B.value.get()+g()*e.length,h.current=!1,p.current=!0),u=-(a.current*g())}if(i&&o==="prev"&&(T==="slide"||T==="group"&&w===1)){const _=V.findIndex(ve=>ve.id===e[O].id),K=((W=e[a.current])==null?void 0:W.id)===e[0].id,q=V[_-1].id.includes("repeated-item");K&&(p.current=!0),q&&(p.current=!1,h.current=!0,a.current=e.length-1,x=B.value.get()-g()*e.length),u=-(a.current*g())}!i&&T==="slide"&&(((X=e[a.current+1])==null?void 0:X.id)===e[e.length-1].id?h.current=!0:a.current===0?p.current=!0:(p.current=!1,h.current=!1),u=-(a.current*g()),o==="next"&&Math.abs(u)>F()&&(h.current=!0,u=-F())),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:o,nextItem:{index:a.current,id:e[a.current].id,startReached:p.current,endReached:h.current}})}if(t==="fluid"){if(o==="prev"&&(a.current=v??a.current-1),o==="next"&&(a.current=v??a.current+1),u=-(a.current*g()),o==="next"&&i){const O=((ne=e[a.current])==null?void 0:ne.id)===e[e.length-1].id,_=V[e.length+a.current].id.includes("repeated-item");O&&(h.current=!0),_&&(a.current=0,x=B.value.get()+g()*e.length,u=0,h.current=!1,p.current=!0)}if(o==="next"&&!i){const O=Math.abs(u)>F();O||O?(h.current=!0,u=-F()):(p.current=!1,h.current=!1)}if(o==="prev"&&!i&&((ue=e[a.current])==null?void 0:ue.id)===e[0].id&&(p.current=!0),o==="prev"&&i){const O=((Ve=e[a.current])==null?void 0:Ve.id)===e[0].id,_=(je=V[e.length+a.current])==null?void 0:je.id.includes("repeated-item");O&&(p.current=!0),_&&(a.current=e.length-1,x=B.value.get()-g()*e.length,u=-(g()*e.length-g()),p.current=!1,h.current=!0)}Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:o,nextItem:{startReached:p.current,endReached:h.current,index:0,id:""}})}if(t==="freeScroll"){const O=D.current[s==="x"?"scrollLeft":"scrollTop"],_=s==="x"?D.current.scrollWidth-D.current.clientWidth:D.current.scrollHeight-D.current.clientHeight;x=O,o==="prev"&&(u=x-g(),u<0&&(u=0),x-g()<=0&&(p.current=!0),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:o,nextItem:{index:0,id:"",startReached:p.current,endReached:!1}})),o==="next"&&(u=x+g(),u>_&&(u=_),x+g()>=_&&(h.current=!0),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:o,nextItem:{index:0,id:"",startReached:!1,endReached:h.current}}))}const $=H(x),A=H(u);Re.current=A,ce.start({from:{value:$},to:{value:A},onRest({finished:O}){O&&t==="fixed"&&Y({eventName:"onSlideChangeComplete",sliceActionType:f,slideDirection:o,currentItem:{index:a.current,id:e[a.current].id,startReached:p.current,endReached:h.current}}),O&&t==="fluid"&&Y({eventName:"onSlideChangeComplete",sliceActionType:f,slideDirection:o,currentItem:{index:0,id:"",startReached:p.current,endReached:h.current}})}})}function ge(o,f){if(!P.current){re();return}if(t==="fixed"&&i||t==="fixed"&&!i&&!h.current){const v=f??a.current+1;ae({type:"next",actionType:o,newActiveItem:v})}(t==="fluid"&&i||t==="fluid"&&!i&&!h.current||t==="freeScroll"&&!h.current)&&ae({type:"next",actionType:o})}function me(o,f){if(!P.current){re();return}if(t==="fixed"&&i||t==="fixed"&&!i&&!p.current){const v=f??a.current-1;ae({type:"prev",actionType:o,newActiveItem:v})}(t==="fluid"&&i||t==="fluid"&&!i&&!p.current||t==="freeScroll"&&!p.current)&&ae({type:"prev",actionType:o})}function Vt(o){let f=0;typeof o=="string"?f=e.findIndex(v=>v.id===o):f=o,f>a.current&&ge("click",f),f<a.current&&me("click",f)}function jt({getContainer:o,activeItem:f,updateTotalValue:v}){const u=o();if(!(u instanceof HTMLElement)){console.warn(`Container is not a valid html element: container is ${u}`);return}const x=u.children[f];if(x){const $=u[s==="x"?"scrollWidth":"scrollHeight"]-u.getBoundingClientRect()[s==="x"?"width":"height"],U=x.offsetLeft+x.offsetWidth/2-u.clientWidth/2,W=At(x);if(W.isOut){const X=W.direction==="start"?U<0?0:U:U>$?$:U,ne=u[s==="x"?"scrollLeft":"scrollTop"];new be.Controller({from:{value:ne},to:{value:v?v({from:ne,to:X,itemOutOfViewport:W}):X},onChange({value:ue}){u[s==="x"?"scrollLeft":"scrollTop"]=ue.value}})}}}const Bt=Pt(o=>{if(!P.current){re();return}const f=o.dragging,v=o.offset[s==="x"?0:1],u=o.movement[s==="x"?0:1],x=u>te.current,$=u<-te.current,A=o.velocity;f&&(Y({...o,eventName:"onDrag",slideActionType:"drag"}),ce.start({value:v,immediate:!0,config:{velocity:A}}),d&&(x||$)&&o.cancel()),o.last&&(x?me("drag"):$?ge("drag"):ce.start({value:Re.current,config:{velocity:A}}))},{enabled:c&&t!=="freeScroll",axis:s,rubberband:!i,...i?{}:{bounds:()=>({right:0,left:-F(),top:-F(),bottom:0})},from:()=>[B.value.get(),B.value.get()]});return E.useEffect(()=>{function o(){document.hidden?(z.current=!0,P.current=!1):(z.current=!1,P.current=!0)}function f(){if(!(t==="fixed"&&!i||t==="freeScroll"))if(t==="fixed"&&T==="group"&&w>1){const $=e.length*3/w;D.current.style[s==="x"?"left":"top"]=`-${H(g()*$/3)}px`}else D.current.style[s==="x"?"left":"top"]=`-${H(g()*V.length/3)}px`}function v(){u(),f(),ce.start({immediate:!0,value:-(a.current*g())})}function u(){const $=D.current.children[0];let A=0;const U=t==="fixed"&&T==="group"&&w>1;U?A=H(D.current.getBoundingClientRect()[s==="x"?"width":"height"]):A=H($.getBoundingClientRect()[s==="x"?"width":"height"]);let{totalGutterCssVar:W,totalStartEndGutterCssVar:X}=Lt();return A+=W,U&&(A-=X),ee.current=A,A}function x(){if(L.current=[],V.length===0&&pe("Init is true but no items are available; carousel will not be initialized"),t==="fixed"&&T==="group"&&w===1&&pe("Using scrollAmountType='group' and itemsPerSlide={1} makes no difference; itemsPerSlide must be greater than 1."),t==="fixed"&&T==="group"&&e.length%w!==0&&L.current.push("When using scrollAmountType='group' and itemsPerSlide={number>1} make sure that itemsPerSlides is divisible by the total quantity of items otherwise the carousel won't initialize."),t==="fluid"&&I!==void 0&&L.current.push('scrollAmountType="group" is not available for slideType="fluid"; please change one of them.'),t==="fluid"&&m!==void 0&&L.current.push(`itemsPerSlide=${m} is not available for slideType="fluid"; please change one of them.`),L.current.length>0){re();return}u(),i&&f(),te.current=g()/4,P.current=!0}if(r)return x(),window.addEventListener("resize",v),document.addEventListener("visibilitychange",o),()=>{document.removeEventListener("visibilitychange",o),window.removeEventListener("resize",v)};P.current=!1},[ee,r,t,i,s]),{carouselFragment:R.jsxs(R.Fragment,{children:[R.jsx("style",{id:`carousel-container-${y}`,dangerouslySetInnerHTML:{__html:`
+(function(G,R){typeof exports=="object"&&typeof module<"u"?R(exports,require("react/jsx-runtime"),require("react"),require("@react-spring/web")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@react-spring/web"],R):(G=typeof globalThis<"u"?globalThis:G||self,R(G["react-spring-carousel"]={},G["react/jsx-runtime"],G.React,G["@react-spring/web"]))})(this,function(G,R,E,be){"use strict";const le="RSC::Event";function Be(){const r=E.useRef(null);function e(n){E.useEffect(()=>{r.current||(r.current=document.createElement("div"));function i(c){n(c.detail)}if(r.current)return r.current.addEventListener(le,i,!1),()=>{var c;(c=r.current)==null||c.removeEventListener(le,i,!1)}},[n])}function t(n){if(r.current){const i=new CustomEvent(le,{detail:n});r.current.dispatchEvent(i)}}return{useListenToCustomEvent:e,emitEvent:t}}function Ue(r,e,t){return Math.max(e,Math.min(r,t))}const S={toVector(r,e){return r===void 0&&(r=e),Array.isArray(r)?r:[r,r]},add(r,e){return[r[0]+e[0],r[1]+e[1]]},sub(r,e){return[r[0]-e[0],r[1]-e[1]]},addTo(r,e){r[0]+=e[0],r[1]+=e[1]},subTo(r,e){r[0]-=e[0],r[1]-=e[1]}};function ye(r,e,t){return e===0||Math.abs(e)===1/0?Math.pow(r,t*5):r*e*t/(e+t*r)}function _e(r,e,t,n=.15){return n===0?Ue(r,e,t):r<e?-ye(e-r,t-e,n)+e:r>t?+ye(r-t,t-e,n)+t:r}function Ge(r,[e,t],[n,i]){const[[c,o],[d,m]]=r;return[_e(e,c,o,n),_e(t,d,m,i)]}function Ke(r,e){if(typeof r!="object"||r===null)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var n=t.call(r,e||"default");if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(r)}function Fe(r){var e=Ke(r,"string");return typeof e=="symbol"?e:String(e)}function C(r,e,t){return e=Fe(e),e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function we(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(i){return Object.getOwnPropertyDescriptor(r,i).enumerable})),t.push.apply(t,n)}return t}function b(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?we(Object(t),!0).forEach(function(n){C(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):we(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}const xe={pointer:{start:"down",change:"move",end:"up"},mouse:{start:"down",change:"move",end:"up"},touch:{start:"start",change:"move",end:"end"},gesture:{start:"start",change:"change",end:"end"}};function Ie(r){return r?r[0].toUpperCase()+r.slice(1):""}const We=["enter","leave"];function He(r=!1,e){return r&&!We.includes(e)}function ze(r,e="",t=!1){const n=xe[r],i=n&&n[e]||e;return"on"+Ie(r)+Ie(i)+(He(t,i)?"Capture":"")}const Ye=["gotpointercapture","lostpointercapture"];function Xe(r){let e=r.substring(2).toLowerCase();const t=!!~e.indexOf("passive");t&&(e=e.replace("passive",""));const n=Ye.includes(e)?"capturecapture":"capture",i=!!~e.indexOf(n);return i&&(e=e.replace("capture","")),{device:e,capture:i,passive:t}}function qe(r,e=""){const t=xe[r],n=t&&t[e]||e;return r+n}function ie(r){return"touches"in r}function Ee(r){return ie(r)?"touch":"pointerType"in r?r.pointerType:"mouse"}function Je(r){return Array.from(r.touches).filter(e=>{var t,n;return e.target===r.currentTarget||((t=r.currentTarget)===null||t===void 0||(n=t.contains)===null||n===void 0?void 0:n.call(t,e.target))})}function Qe(r){return r.type==="touchend"||r.type==="touchcancel"?r.changedTouches:r.targetTouches}function Se(r){return ie(r)?Qe(r)[0]:r}function Ze(r){return Je(r).map(e=>e.identifier)}function fe(r){const e=Se(r);return ie(r)?e.identifier:e.pointerId}function Te(r){const e=Se(r);return[e.clientX,e.clientY]}function et(r){const e={};if("buttons"in r&&(e.buttons=r.buttons),"shiftKey"in r){const{shiftKey:t,altKey:n,metaKey:i,ctrlKey:c}=r;Object.assign(e,{shiftKey:t,altKey:n,metaKey:i,ctrlKey:c})}return e}function se(r,...e){return typeof r=="function"?r(...e):r}function tt(){}function rt(...r){return r.length===0?tt:r.length===1?r[0]:function(){let e;for(const t of r)e=t.apply(this,arguments)||e;return e}}function De(r,e){return Object.assign({},e,r||{})}const nt=32;class it{constructor(e,t,n){this.ctrl=e,this.args=t,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:t,ingKey:n,args:i}=this;t[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=i,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const t=this.state,n=this.config;t._active||(this.reset(),this.computeInitial(),t._active=!0,t.target=e.target,t.currentTarget=e.currentTarget,t.lastOffset=n.from?se(n.from,t):t.offset,t.offset=t.lastOffset,t.startTime=t.timeStamp=e.timeStamp)}computeValues(e){const t=this.state;t._values=e,t.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:t,config:n,shared:i}=this;t.args=this.args;let c=0;if(e&&(t.event=e,n.preventDefault&&e.cancelable&&t.event.preventDefault(),t.type=e.type,i.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,i.locked=!!document.pointerLockElement,Object.assign(i,et(e)),i.down=i.pressed=i.buttons%2===1||i.touches>0,c=e.timeStamp-t.timeStamp,t.timeStamp=e.timeStamp,t.elapsedTime=t.timeStamp-t.startTime),t._active){const j=t._delta.map(Math.abs);S.addTo(t._distance,j)}this.axisIntent&&this.axisIntent(e);const[o,d]=t._movement,[m,I]=n.threshold,{_step:l,values:$}=t;if(n.hasCustomTransform?(l[0]===!1&&(l[0]=Math.abs(o)>=m&&$[0]),l[1]===!1&&(l[1]=Math.abs(d)>=I&&$[1])):(l[0]===!1&&(l[0]=Math.abs(o)>=m&&Math.sign(o)*m),l[1]===!1&&(l[1]=Math.abs(d)>=I&&Math.sign(d)*I)),t.intentional=l[0]!==!1||l[1]!==!1,!t.intentional)return;const k=[0,0];if(n.hasCustomTransform){const[j,D]=$;k[0]=l[0]!==!1?j-l[0]:0,k[1]=l[1]!==!1?D-l[1]:0}else k[0]=l[0]!==!1?o-l[0]:0,k[1]=l[1]!==!1?d-l[1]:0;this.restrictToAxis&&!t._blocked&&this.restrictToAxis(k);const P=t.offset,L=t._active&&!t._blocked||t.active;L&&(t.first=t._active&&!t.active,t.last=!t._active&&t.active,t.active=i[this.ingKey]=t._active,e&&(t.first&&("bounds"in n&&(t._bounds=se(n.bounds,t)),this.setup&&this.setup()),t.movement=k,this.computeOffset()));const[z,x]=t.offset,[[T,V],[ee,te]]=t._bounds;t.overflow=[z<T?-1:z>V?1:0,x<ee?-1:x>te?1:0],t._movementBound[0]=t.overflow[0]?t._movementBound[0]===!1?t._movement[0]:t._movementBound[0]:!1,t._movementBound[1]=t.overflow[1]?t._movementBound[1]===!1?t._movement[1]:t._movementBound[1]:!1;const y=t._active?n.rubberband||[0,0]:[0,0];if(t.offset=Ge(t._bounds,t.offset,y),t.delta=S.sub(t.offset,P),this.computeMovement(),L&&(!t.last||c>nt)){t.delta=S.sub(t.offset,P);const j=t.delta.map(Math.abs);S.addTo(t.distance,j),t.direction=t.delta.map(Math.sign),t._direction=t._delta.map(Math.sign),!t.first&&c>0&&(t.velocity=[j[0]/c,j[1]/c],t.timeDelta=c)}}emit(){const e=this.state,t=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const i=this.handler(b(b(b({},t),e),{},{[this.aliasKey]:e.values}));i!==void 0&&(e.memo=i)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function st([r,e],t){const n=Math.abs(r),i=Math.abs(e);if(n>i&&n>t)return"x";if(i>n&&i>t)return"y"}class ot extends it{constructor(...e){super(...e),C(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=S.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=S.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const t=this.state,n=this.config;if(!t.axis&&e){const i=typeof n.axisThreshold=="object"?n.axisThreshold[Ee(e)]:n.axisThreshold;t.axis=st(t._movement,i)}t._blocked=(n.lockDirection||!!n.axis)&&!t.axis||!!n.axis&&n.axis!==t.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const ke=r=>r,Ce=.15,de={enabled(r=!0){return r},eventOptions(r,e,t){return b(b({},t.shared.eventOptions),r)},preventDefault(r=!1){return r},triggerAllEvents(r=!1){return r},rubberband(r=0){switch(r){case!0:return[Ce,Ce];case!1:return[0,0];default:return S.toVector(r)}},from(r){if(typeof r=="function")return r;if(r!=null)return S.toVector(r)},transform(r,e,t){const n=r||t.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const i=n||ke;return c=>{const o=i(c);return(!isFinite(o[0])||!isFinite(o[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${o[0]},${[1]}]`),o}}return n||ke},threshold(r){return S.toVector(r,0)}};process.env.NODE_ENV==="development"&&Object.assign(de,{domTarget(r){if(r!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(r){if(r!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(r){if(r!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const ct=0,Q=b(b({},de),{},{axis(r,e,{axis:t}){if(this.lockDirection=t==="lock",!this.lockDirection)return t},axisThreshold(r=ct){return r},bounds(r={}){if(typeof r=="function")return c=>Q.bounds(r(c));if("current"in r)return()=>r.current;if(typeof HTMLElement=="function"&&r instanceof HTMLElement)return r;const{left:e=-1/0,right:t=1/0,top:n=-1/0,bottom:i=1/0}=r;return[[e,t],[n,i]]}}),Oe={ArrowRight:(r,e=1)=>[r*e,0],ArrowLeft:(r,e=1)=>[-1*r*e,0],ArrowUp:(r,e=1)=>[0,-1*r*e],ArrowDown:(r,e=1)=>[0,r*e]};class at extends ot{constructor(...e){super(...e),C(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const t=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),i={left:t.left-n.left+e.offset[0],right:t.right-n.right+e.offset[0],top:t.top-n.top+e.offset[1],bottom:t.bottom-n.bottom+e.offset[1]};e._bounds=Q.bounds(i)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const t=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(t.pointerButtons)?!t.pointerButtons.includes(e.buttons):t.pointerButtons!==-1&&t.pointerButtons!==e.buttons))return;const i=this.ctrl.setEventIds(e);t.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(i&&i.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=fe(e),n._pointerActive=!0,this.computeValues(Te(e)),this.computeInitial(),t.preventScrollAxis&&Ee(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):t.delay>0?(this.setupDelayTrigger(e),t.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const t=this.state;t._active=!0,t._preventScroll=!0,t._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const t=this.state,n=this.config;if(!t._pointerActive)return;const i=fe(e);if(t._pointerId!==void 0&&i!==t._pointerId)return;const c=Te(e);if(document.pointerLockElement===e.target?t._delta=[e.movementX,e.movementY]:(t._delta=S.sub(c,t._values),this.computeValues(c)),S.addTo(t._movement,t._delta),this.compute(e),t._delayed&&t.intentional){this.timeoutStore.remove("dragDelay"),t.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!t._preventScroll)if(t.axis)if(t.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){t._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const t=this.state,n=this.config;if(!t._active||!t._pointerActive)return;const i=fe(e);if(t._pointerId!==void 0&&i!==t._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[c,o]=t._distance;if(t.tap=c<=n.tapsThreshold&&o<=n.tapsThreshold,t.tap&&n.filterTaps)t._force=!0;else{const[d,m]=t._delta,[I,l]=t._movement,[$,k]=n.swipe.velocity,[P,L]=n.swipe.distance,z=n.swipe.duration;if(t.elapsedTime<z){const x=Math.abs(d/t.timeDelta),T=Math.abs(m/t.timeDelta);x>$&&Math.abs(I)>P&&(t.swipe[0]=Math.sign(d)),T>k&&Math.abs(l)>L&&(t.swipe[1]=Math.sign(m))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const t=this.config,n=t.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&t.preventScrollDelay===void 0){const i="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(i).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",i)}}catch{}t.pointerLock&&e.currentTarget.requestPointerLock(),t.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,ut(e);const t=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",t),this.eventStore.add(this.sharedConfig.window,"touch","cancel",t),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const t=Oe[e.key];if(t){const n=this.state,i=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=t(this.config.keyboardDisplacement,i),n._keyboardActive=!0,S.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in Oe&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const t=this.config.device;e(t,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(t,"change",this.pointerMove.bind(this)),e(t,"end",this.pointerUp.bind(this)),e(t,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function ut(r){"persist"in r&&typeof r.persist=="function"&&r.persist()}const Z=typeof window<"u"&&window.document&&window.document.createElement;function Pe(){return Z&&"ontouchstart"in window}function lt(){return Pe()||Z&&window.navigator.maxTouchPoints>1}function ft(){return Z&&"onpointerdown"in window}function dt(){return Z&&"exitPointerLock"in window.document}function ht(){try{return"constructor"in GestureEvent}catch{return!1}}const M={isBrowser:Z,gesture:ht(),touch:Pe(),touchscreen:lt(),pointer:ft(),pointerLock:dt()},pt=250,gt=180,mt=.5,vt=50,bt=250,yt=10,Ae={mouse:0,touch:0,pen:8},Ne=b(b({},Q),{},{device(r,e,{pointer:{touch:t=!1,lock:n=!1,mouse:i=!1}={}}){return this.pointerLock=n&&M.pointerLock,M.touch&&t?"touch":this.pointerLock?"mouse":M.pointer&&!i?"pointer":M.touch?"touch":"mouse"},preventScrollAxis(r,e,{preventScroll:t}){if(this.preventScrollDelay=typeof t=="number"?t:t||t===void 0&&r?pt:void 0,!(!M.touchscreen||t===!1))return r||(t!==void 0?"y":void 0)},pointerCapture(r,e,{pointer:{capture:t=!0,buttons:n=1,keys:i=!0}={}}){return this.pointerButtons=n,this.keys=i,!this.pointerLock&&this.device==="pointer"&&t},threshold(r,e,{filterTaps:t=!1,tapsThreshold:n=3,axis:i=void 0}){const c=S.toVector(r,t?n:i?1:0);return this.filterTaps=t,this.tapsThreshold=n,c},swipe({velocity:r=mt,distance:e=vt,duration:t=bt}={}){return{velocity:this.transform(S.toVector(r)),distance:this.transform(S.toVector(e)),duration:t}},delay(r=0){switch(r){case!0:return gt;case!1:return 0;default:return r}},axisThreshold(r){return r?b(b({},Ae),r):Ae},keyboardDisplacement(r=yt){return r}});process.env.NODE_ENV==="development"&&Object.assign(Ne,{useTouch(r){if(r!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(r){if(r!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),b(b({},de),{},{device(r,e,{shared:t,pointer:{touch:n=!1}={}}){if(t.target&&!M.touch&&M.gesture)return"gesture";if(M.touch&&n)return"touch";if(M.touchscreen){if(M.pointer)return"pointer";if(M.touch)return"touch"}},bounds(r,e,{scaleBounds:t={},angleBounds:n={}}){const i=o=>{const d=De(se(t,o),{min:-1/0,max:1/0});return[d.min,d.max]},c=o=>{const d=De(se(n,o),{min:-1/0,max:1/0});return[d.min,d.max]};return typeof t!="function"&&typeof n!="function"?[i(),c()]:o=>[i(o),c(o)]},threshold(r,e,t){return this.lockDirection=t.axis==="lock",S.toVector(r,this.lockDirection?[.1,3]:0)},modifierKey(r){return r===void 0?"ctrlKey":r},pinchOnWheel(r=!0){return r}}),b(b({},Q),{},{mouseOnly:(r=!0)=>r}),b(b({},Q),{},{mouseOnly:(r=!0)=>r});const Me=new Map,he=new Map;function _t(r){Me.set(r.key,r.engine),he.set(r.key,r.resolver)}const wt={key:"drag",engine:at,resolver:Ne};function xt(r,e){if(r==null)return{};var t={},n=Object.keys(r),i,c;for(c=0;c<n.length;c++)i=n[c],!(e.indexOf(i)>=0)&&(t[i]=r[i]);return t}function It(r,e){if(r==null)return{};var t=xt(r,e),n,i;if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(r);for(i=0;i<c.length;i++)n=c[i],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}const Et={target(r){if(r)return()=>"current"in r?r.current:r},enabled(r=!0){return r},window(r=M.isBrowser?window:void 0){return r},eventOptions({passive:r=!0,capture:e=!1}={}){return{passive:r,capture:e}},transform(r){return r}},St=["target","eventOptions","window","enabled","transform"];function oe(r={},e){const t={};for(const[n,i]of Object.entries(e))switch(typeof i){case"function":if(process.env.NODE_ENV==="development"){const c=i.call(t,r[n],n,r);Number.isNaN(c)||(t[n]=c)}else t[n]=i.call(t,r[n],n,r);break;case"object":t[n]=oe(r[n],i);break;case"boolean":i&&(t[n]=r[n]);break}return t}function Tt(r,e,t={}){const n=r,{target:i,eventOptions:c,window:o,enabled:d,transform:m}=n,I=It(n,St);if(t.shared=oe({target:i,eventOptions:c,window:o,enabled:d,transform:m},Et),e){const l=he.get(e);t[e]=oe(b({shared:t.shared},I),l)}else for(const l in I){const $=he.get(l);if($)t[l]=oe(b({shared:t.shared},I[l]),$);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(l)){if(l==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${l}\` was used. Please read the documentation for further information.`)}}return t}class $e{constructor(e,t){C(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=t}add(e,t,n,i,c){const o=this._listeners,d=qe(t,n),m=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},I=b(b({},m),c);e.addEventListener(d,i,I);const l=()=>{e.removeEventListener(d,i,I),o.delete(l)};return o.add(l),l}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class Dt{constructor(){C(this,"_timeouts",new Map)}add(e,t,n=140,...i){this.remove(e),this._timeouts.set(e,window.setTimeout(t,n,...i))}remove(e){const t=this._timeouts.get(e);t&&window.clearTimeout(t)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class kt{constructor(e){C(this,"gestures",new Set),C(this,"_targetEventStore",new $e(this)),C(this,"gestureEventStores",{}),C(this,"gestureTimeoutStores",{}),C(this,"handlers",{}),C(this,"config",{}),C(this,"pointerIds",new Set),C(this,"touchIds",new Set),C(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),Ct(this,e)}setEventIds(e){if(ie(e))return this.touchIds=new Set(Ze(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,t){this.handlers=e,this.nativeHandlers=t}applyConfig(e,t){this.config=Tt(e,t,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const t=this.config.shared,n={};let i;if(!(t.target&&(i=t.target(),!i))){if(t.enabled){for(const o of this.gestures){const d=this.config[o],m=Le(n,d.eventOptions,!!i);if(d.enabled){const I=Me.get(o);new I(this,e,o).bind(m)}}const c=Le(n,t.eventOptions,!!i);for(const o in this.nativeHandlers)c(o,"",d=>this.nativeHandlers[o](b(b({},this.state.shared),{},{event:d,args:e})),void 0,!0)}for(const c in n)n[c]=rt(...n[c]);if(!i)return n;for(const c in n){const{device:o,capture:d,passive:m}=Xe(c);this._targetEventStore.add(i,o,"",n[c],{capture:d,passive:m})}}}}function J(r,e){r.gestures.add(e),r.gestureEventStores[e]=new $e(r,e),r.gestureTimeoutStores[e]=new Dt}function Ct(r,e){e.drag&&J(r,"drag"),e.wheel&&J(r,"wheel"),e.scroll&&J(r,"scroll"),e.move&&J(r,"move"),e.pinch&&J(r,"pinch"),e.hover&&J(r,"hover")}const Le=(r,e,t)=>(n,i,c,o={},d=!1)=>{var m,I;const l=(m=o.capture)!==null&&m!==void 0?m:e.capture,$=(I=o.passive)!==null&&I!==void 0?I:e.passive;let k=d?n:ze(n,i,l);t&&$&&(k+="Passive"),r[k]=r[k]||[],r[k].push(c)};function Ot(r,e={},t,n){const i=E.useMemo(()=>new kt(r),[]);if(i.applyHandlers(r,n),i.applyConfig(e,t),E.useEffect(i.effect.bind(i)),E.useEffect(()=>i.clean.bind(i),[]),e.target===void 0)return i.bind.bind(i)}function Pt(r,e){return _t(wt),Ot({drag:r},e||{},"drag")}function At(r){const{left:e,right:t,top:n,bottom:i}=r.getBoundingClientRect(),{innerWidth:c,innerHeight:o}=window;return e<0||n<0?{isOut:!0,direction:"start"}:Math.floor(t)>Math.floor(c)||Math.floor(i)>Math.floor(o)?{isOut:!0,direction:"end"}:{isOut:!1,direction:null}}function H(r){return parseFloat(r.toFixed(2))}function pe(r){process.env.NODE_ENV!=="production"&&console.warn(r)}function Nt({init:r=!0,items:e,slideType:t="fixed",scrollAmount:n,withLoop:i=!1,enableGestures:c=!0,carouselAxis:o="x",slideWhenDragThresholdIsReached:d=!0,itemsPerSlide:m,scrollAmountType:I,gutter:l=0,startEndGutter:$=0,fadeIn:k=!1}){const P=E.useRef(!1),L=E.useRef([]),z=E.useRef(!1),x=m??1,T=I??"slide",V=i?[...e.map(s=>({...s,id:`prev-repeated-item-${s.id}`})),...e,...e.map(s=>({...s,id:`next-repeated-item-${s.id}`}))]:e,ee=E.useRef(n),te=E.useRef(0),y=E.useId().replace(/:/g,""),j=E.useRef(null),D=E.useRef(null),Re=E.useRef(0),p=E.useRef(!0),h=E.useRef(!1),a=E.useRef(0),[B,ce]=be.useSpring(()=>({value:0,onChange({value:s}){(t==="fixed"||t==="fluid")&&(o==="x"?D.current.style.transform=`translate3d(${s.value}px, 0px, 0px)`:D.current.style.transform=`translate3d(${s.value}px, 0px, 0px)`),t==="freeScroll"&&(D.current[o==="x"?"scrollLeft":"scrollTop"]=Math.abs(s.value))}})),{useListenToCustomEvent:Mt,emitEvent:Y}=Be();function g(){return H(ee.current??0)}function F(){return D.current[o==="x"?"scrollWidth":"scrollHeight"]-j.current.getBoundingClientRect()[o==="x"?"width":"height"]}function re(){pe("The carousel can't be initialized. List of errors:"),console.table(L.current)}function $t(){return t==="freeScroll"?{onWheel(){B.value.stop()},onScroll(s){const f=s.currentTarget,v=o==="x"?f.scrollLeft:f.scrollTop,u=o==="x"?f.scrollWidth-f.clientWidth:f.scrollHeight-f.clientHeight;v===0?p.current=!0:v===u?h.current=!0:(p.current=!1,h.current=!1)}}:{}}function Lt(){let s=0,f=0;const v=getComputedStyle(document.documentElement).getPropertyValue(`--${y}-react-spring-carousel-item-gutter`),u=getComputedStyle(document.documentElement).getPropertyValue(`--${y}-react-spring-carousel-item-gutter`);return u.includes("px")&&(s=Number(u.replace("px",""))),v.includes("px")&&(f=Number(v.replace("px",""))),{totalGutterCssVar:s,totalStartEndGutterCssVar:f}}function Rt(){return x>1?`calc(100% / ${x} - var(--${y}-react-spring-carousel-item-gutter) / ${x} * ${x-1}) !important`:"100% !important"}function ae({type:s,actionType:f,newActiveItem:v}){var U,W,X,ne,ue,Ve,je;let u=0,_=B.value.get();if(p.current=!1,h.current=!1,t==="fixed"){const O=a.current;if(s==="prev"&&(a.current=v??a.current-1),s==="next"&&(a.current=v??a.current+1),i&&T==="group"&&x>1&&s==="next"){const w=e.length/x,K=Math.ceil(w)-1===a.current,q=Math.ceil(w)===a.current;K&&(h.current=!0),u=-(a.current*g()),q&&(a.current=0,_=B.value.get()+g()*w,u=0,h.current=!1,p.current=!0)}if(i&&T==="group"&&x>1&&s==="prev"){const w=e.length/x,K=a.current===0,q=a.current===-1;u=-(a.current*g()),K&&(p.current=!0),q&&(p.current=!1,h.current=!0,a.current=w-1,_=B.value.get()-g()*w,u=-g()*w+g())}if(!i&&T==="group"&&x>1){const w=e.length/x,K=2%w!==0,q=Math.ceil(w-1)===a.current,ve=a.current===0;u=-(a.current*g()),ve&&(p.current=!0),q&&(h.current=!0,K&&(u=-F()))}if(i&&s==="next"&&(T==="slide"||T==="group"&&x===1)){const w=((U=e[a.current])==null?void 0:U.id)===e[e.length-1].id,K=V[e.length+a.current].id.includes("repeated-item");w&&(h.current=!0),K&&(a.current=0,_=B.value.get()+g()*e.length,h.current=!1,p.current=!0),u=-(a.current*g())}if(i&&s==="prev"&&(T==="slide"||T==="group"&&x===1)){const w=V.findIndex(ve=>ve.id===e[O].id),K=((W=e[a.current])==null?void 0:W.id)===e[0].id,q=V[w-1].id.includes("repeated-item");K&&(p.current=!0),q&&(p.current=!1,h.current=!0,a.current=e.length-1,_=B.value.get()-g()*e.length),u=-(a.current*g())}!i&&T==="slide"&&(((X=e[a.current+1])==null?void 0:X.id)===e[e.length-1].id?h.current=!0:a.current===0?p.current=!0:(p.current=!1,h.current=!1),u=-(a.current*g()),s==="next"&&Math.abs(u)>F()&&(h.current=!0,u=-F())),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:s,nextItem:{index:a.current,id:e[a.current].id,startReached:p.current,endReached:h.current}})}if(t==="fluid"){if(s==="prev"&&(a.current=v??a.current-1),s==="next"&&(a.current=v??a.current+1),u=-(a.current*g()),s==="next"&&i){const O=((ne=e[a.current])==null?void 0:ne.id)===e[e.length-1].id,w=V[e.length+a.current].id.includes("repeated-item");O&&(h.current=!0),w&&(a.current=0,_=B.value.get()+g()*e.length,u=0,h.current=!1,p.current=!0)}if(s==="next"&&!i){const O=Math.abs(u)>F();O||O?(h.current=!0,u=-F()):(p.current=!1,h.current=!1)}if(s==="prev"&&!i&&((ue=e[a.current])==null?void 0:ue.id)===e[0].id&&(p.current=!0),s==="prev"&&i){const O=((Ve=e[a.current])==null?void 0:Ve.id)===e[0].id,w=(je=V[e.length+a.current])==null?void 0:je.id.includes("repeated-item");O&&(p.current=!0),w&&(a.current=e.length-1,_=B.value.get()-g()*e.length,u=-(g()*e.length-g()),p.current=!1,h.current=!0)}Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:s,nextItem:{startReached:p.current,endReached:h.current,index:0,id:""}})}if(t==="freeScroll"){const O=D.current[o==="x"?"scrollLeft":"scrollTop"],w=o==="x"?D.current.scrollWidth-D.current.clientWidth:D.current.scrollHeight-D.current.clientHeight;_=O,s==="prev"&&(u=_-g(),u<0&&(u=0),_-g()<=0&&(p.current=!0),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:s,nextItem:{index:0,id:"",startReached:p.current,endReached:!1}})),s==="next"&&(u=_+g(),u>w&&(u=w),_+g()>=w&&(h.current=!0),Y({eventName:"onSlideStartChange",sliceActionType:f,slideDirection:s,nextItem:{index:0,id:"",startReached:!1,endReached:h.current}}))}const A=H(_),N=H(u);Re.current=N,ce.start({from:{value:A},to:{value:N},onRest({finished:O}){O&&t==="fixed"&&Y({eventName:"onSlideChangeComplete",sliceActionType:f,slideDirection:s,currentItem:{index:a.current,id:e[a.current].id,startReached:p.current,endReached:h.current}}),O&&t==="fluid"&&Y({eventName:"onSlideChangeComplete",sliceActionType:f,slideDirection:s,currentItem:{index:0,id:"",startReached:p.current,endReached:h.current}})}})}function ge(s,f){if(!P.current){re();return}if(s==="drag"||t==="fixed"&&i||t==="fixed"&&!i&&!h.current){const v=f??a.current+1;ae({type:"next",actionType:s,newActiveItem:v})}(t==="fluid"&&i||t==="fluid"&&!i&&!h.current||t==="freeScroll"&&!h.current)&&ae({type:"next",actionType:s})}function me(s,f){if(!P.current){re();return}if(s==="drag"||t==="fixed"&&i||t==="fixed"&&!i&&!p.current){const v=f??a.current-1;ae({type:"prev",actionType:s,newActiveItem:v})}(t==="fluid"&&i||t==="fluid"&&!i&&!p.current||t==="freeScroll"&&!p.current)&&ae({type:"prev",actionType:s})}function Vt(s){let f=0;typeof s=="string"?f=e.findIndex(v=>v.id===s):f=s,f>a.current&&ge("click",f),f<a.current&&me("click",f)}function jt({getContainer:s,activeItem:f,updateTotalValue:v}){const u=s();if(!(u instanceof HTMLElement)){console.warn(`Container is not a valid html element: container is ${u}`);return}const _=u.children[f];if(_){const A=u[o==="x"?"scrollWidth":"scrollHeight"]-u.getBoundingClientRect()[o==="x"?"width":"height"],U=_.offsetLeft+_.offsetWidth/2-u.clientWidth/2,W=At(_);if(W.isOut){const X=W.direction==="start"?U<0?0:U:U>A?A:U,ne=u[o==="x"?"scrollLeft":"scrollTop"];new be.Controller({from:{value:ne},to:{value:v?v({from:ne,to:X,itemOutOfViewport:W}):X},onChange({value:ue}){u[o==="x"?"scrollLeft":"scrollTop"]=ue.value}})}}}const Bt=Pt(s=>{if(!P.current){re();return}const f=s.dragging,v=s.offset[o==="x"?0:1],u=s.movement[o==="x"?0:1],_=u>te.current,A=u<-te.current,N=s.velocity;f&&(Y({...s,eventName:"onDrag",slideActionType:"drag"}),ce.start({value:v,immediate:!0,config:{velocity:N}}),d&&(_||A)&&(console.log("cancel",{slideWhenDragThresholdIsReached:d,prevItemTresholdReached:_,nextItemTresholdReached:A}),s.cancel())),s.last&&(console.log("last"),_?me("drag"):A?ge("drag"):ce.start({value:Re.current,config:{velocity:N}}))},{enabled:c&&t!=="freeScroll",axis:o,rubberband:!i,...i?{}:{bounds:()=>({right:0,left:-F(),top:-F(),bottom:0})},from:()=>[B.value.get(),B.value.get()]});return E.useEffect(()=>{function s(){document.hidden?(z.current=!0,P.current=!1):(z.current=!1,P.current=!0)}function f(){if(!(t==="fixed"&&!i||t==="freeScroll"))if(t==="fixed"&&T==="group"&&x>1){const A=e.length*3/x;D.current.style[o==="x"?"left":"top"]=`-${H(g()*A/3)}px`}else D.current.style[o==="x"?"left":"top"]=`-${H(g()*V.length/3)}px`}function v(){u(),f(),ce.start({immediate:!0,value:-(a.current*g())})}function u(){const A=D.current.children[0];let N=0;const U=t==="fixed"&&T==="group"&&x>1;U?N=H(D.current.getBoundingClientRect()[o==="x"?"width":"height"]):N=H(A.getBoundingClientRect()[o==="x"?"width":"height"]);let{totalGutterCssVar:W,totalStartEndGutterCssVar:X}=Lt();return N+=W,U&&(N-=X),ee.current=N,N}function _(){if(L.current=[],V.length===0&&pe("Init is true but no items are available; carousel will not be initialized"),t==="fixed"&&T==="group"&&x===1&&pe("Using scrollAmountType='group' and itemsPerSlide={1} makes no difference; itemsPerSlide must be greater than 1."),t==="fixed"&&T==="group"&&e.length%x!==0&&L.current.push("When using scrollAmountType='group' and itemsPerSlide={number>1} make sure that itemsPerSlides is divisible by the total quantity of items otherwise the carousel won't initialize."),t==="fluid"&&I!==void 0&&L.current.push('scrollAmountType="group" is not available for slideType="fluid"; please change one of them.'),t==="fluid"&&m!==void 0&&L.current.push(`itemsPerSlide=${m} is not available for slideType="fluid"; please change one of them.`),L.current.length>0){re();return}u(),i&&f(),te.current=g()/4,P.current=!0}if(r)return _(),window.addEventListener("resize",v),document.addEventListener("visibilitychange",s),()=>{document.removeEventListener("visibilitychange",s),window.removeEventListener("resize",v)};P.current=!1},[ee,r,t,i,o]),{carouselFragment:R.jsxs(R.Fragment,{children:[R.jsx("style",{id:`carousel-container-${y}`,dangerouslySetInnerHTML:{__html:`
             :root {
               --${y}-react-spring-carousel-item-gutter: ${l}px;
-              --${y}-react-spring-carousel-start-end-gutter: ${M}px;
+              --${y}-react-spring-carousel-start-end-gutter: ${$}px;
             }
             .carousel-${y} {
               display: flex;
@@ -14,10 +14,10 @@
               display: flex;
               width: calc(100% - var(--${y}-react-spring-carousel-start-end-gutter) * 2);
               padding-left: var(--${y}-react-spring-carousel-start-end-gutter);
-              touch-action: ${c?s==="x"?"pan-y":"pan-x":"auto"};
-              flex-direction: ${s==="x"?"row":"column"};
-              overflow-x: ${t==="freeScroll"&&s==="x"?"auto":"initial"};
-              overflow-y: ${t==="freeScroll"&&s==="y"?"auto":"initial"};
+              touch-action: ${c?o==="x"?"pan-y":"pan-x":"auto"};
+              flex-direction: ${o==="x"?"row":"column"};
+              overflow-x: ${t==="freeScroll"&&o==="x"?"auto":"initial"};
+              overflow-y: ${t==="freeScroll"&&o==="y"?"auto":"initial"};
             }
             .carousel-${y} .use-spring-carousel-track::after {
               content: "";
@@ -48,4 +48,4 @@
                 .carousel-${y} .use-spring-carousel-item:first-child {
                   opacity: 1;
                 }`.trim():""};
-              `.trim()}}),R.jsx("div",{className:`use-spring-carousel-container carousel-${y}`,ref:j,"data-carousel-direction":s,children:R.jsx("div",{className:"use-spring-carousel-track",...Bt(),ref:D,...$t(),children:V.map((o,f)=>R.jsx("div",{className:"use-spring-carousel-item",id:o.id,children:o.renderItem},`${o.id}-${f}`))})})]}),useListenToCustomEvent:Mt,slideToNextItem:()=>ge("click"),slideToPrevItem:()=>me("click"),slideToIem:o=>{if(!P.current){re();return}Vt(o)},handleThumbsContainerScroll:jt,carouselId:y}}G.useSpringCarousel=Nt,Object.defineProperty(G,Symbol.toStringTag,{value:"Module"})});
+              `.trim()}}),R.jsx("div",{className:`use-spring-carousel-container carousel-${y}`,ref:j,"data-carousel-direction":o,children:R.jsx("div",{className:"use-spring-carousel-track",...Bt(),ref:D,...$t(),children:V.map((s,f)=>R.jsx("div",{className:"use-spring-carousel-item",id:s.id,children:s.renderItem},`${s.id}-${f}`))})})]}),useListenToCustomEvent:Mt,slideToNextItem:()=>ge("click"),slideToPrevItem:()=>me("click"),slideToIem:s=>{if(!P.current){re();return}Vt(s)},handleThumbsContainerScroll:jt,carouselId:y}}G.useSpringCarousel=Nt,Object.defineProperty(G,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-spring-carousel",
-  "version": "3.0.0-beta-1.0.39",
+  "version": "3.0.0-beta-1.0.40",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.umd.js",
@@ -35,16 +35,16 @@
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^1.7.0",
+    "@chromatic-com/storybook": "^3.2.2",
     "@eslint/js": "^9.9.0",
-    "@storybook/addon-essentials": "^8.2.9",
-    "@storybook/addon-interactions": "^8.2.9",
-    "@storybook/addon-links": "^8.2.9",
-    "@storybook/addon-onboarding": "^8.2.9",
-    "@storybook/blocks": "^8.2.9",
-    "@storybook/react": "^8.2.9",
-    "@storybook/react-vite": "^8.2.9",
-    "@storybook/test": "^8.2.9",
+    "@storybook/addon-essentials": "^8.4.5",
+    "@storybook/addon-interactions": "^8.4.5",
+    "@storybook/addon-links": "^8.4.5",
+    "@storybook/addon-onboarding": "^8.4.5",
+    "@storybook/blocks": "^8.4.5",
+    "@storybook/react": "^8.4.5",
+    "@storybook/react-vite": "^8.4.5",
+    "@storybook/test": "^8.4.5",
     "@types/node": "^22.7.9",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
@@ -52,9 +52,9 @@
     "eslint": "^9.9.0",
     "eslint-plugin-react-hooks": "^5.1.0-rc.0",
     "eslint-plugin-react-refresh": "^0.4.9",
-    "eslint-plugin-storybook": "^0.8.0",
+    "eslint-plugin-storybook": "^0.11.1",
     "globals": "^15.9.0",
-    "storybook": "^8.2.9",
+    "storybook": "^8.4.5",
     "typescript": "^5.5.3",
     "typescript-eslint": "^8.0.1",
     "vite": "^5.4.1",