react-spring-carousel 3.0.0-beta-2.0.94 → 3.0.0-beta-2.0.97

package/dist/index.es.js

@@ -1,6 +1,6 @@
-import { jsxs as Me, jsx as J } from "react/jsx-runtime";
-import { useSpringRef as Ve, useSpring as Te } from "@react-spring/web";
-import Q, { useRef as $, useEffect as R, useState as Re } from "react";
+import { jsxs as Me, jsx as Q } from "react/jsx-runtime";
+import { useSpringRef as Ve, useSpring as xe } from "@react-spring/web";
+import Z, { useRef as $, useEffect as B, useState as Re } from "react";
 function je(t, e, r) {
   return Math.max(e, Math.min(t, r));
 }
@@ -74,7 +74,7 @@ function p(t) {
   }
   return t;
 }
-const Se = {
+const Te = {
   pointer: {
     start: "down",
     change: "move",
@@ -104,7 +104,7 @@ function ze(t = !1, e) {
   return t && !Ge.includes(e);
 }
 function We(t, e = "", r = !1) {
-  const n = Se[t], s = n && n[e] || e;
+  const n = Te[t], s = n && n[e] || e;
   return "on" + pe(t) + pe(s) + (ze(r, s) ? "Capture" : "");
 }
 const Ye = ["gotpointercapture", "lostpointercapture"];
@@ -120,14 +120,14 @@ function Fe(t) {
   };
 }
 function He(t, e = "") {
-  const r = Se[t], n = r && r[e] || e;
+  const r = Te[t], n = r && r[e] || e;
   return t + n;
 }
-function Y(t) {
+function F(t) {
   return "touches" in t;
 }
-function xe(t) {
-  return Y(t) ? "touch" : "pointerType" in t ? t.pointerType : "mouse";
+function Se(t) {
+  return F(t) ? "touch" : "pointerType" in t ? t.pointerType : "mouse";
 }
 function Xe(t) {
   return Array.from(t.touches).filter((e) => {
@@ -139,14 +139,14 @@ function qe(t) {
   return t.type === "touchend" || t.type === "touchcancel" ? t.changedTouches : t.targetTouches;
 }
 function Ie(t) {
-  return Y(t) ? qe(t)[0] : t;
+  return F(t) ? qe(t)[0] : t;
 }
 function Je(t) {
   return Xe(t).map((e) => e.identifier);
 }
-function Z(t) {
+function ee(t) {
   const e = Ie(t);
-  return Y(t) ? e.identifier : e.pointerId;
+  return F(t) ? e.identifier : e.pointerId;
 }
 function me(t) {
   const e = Ie(t);
@@ -170,7 +170,7 @@ function Qe(t) {
   }
   return e;
 }
-function W(t, ...e) {
+function Y(t, ...e) {
   return typeof t == "function" ? t(...e) : t;
 }
 function Ze() {
@@ -226,7 +226,7 @@ class rt {
   }
   start(e) {
     const r = this.state, n = this.config;
-    r._active || (this.reset(), this.computeInitial(), r._active = !0, r.target = e.target, r.currentTarget = e.currentTarget, r.lastOffset = n.from ? W(n.from, r) : r.offset, r.offset = r.lastOffset, r.startTime = r.timeStamp = e.timeStamp);
+    r._active || (this.reset(), this.computeInitial(), r._active = !0, r.target = e.target, r.currentTarget = e.currentTarget, r.lastOffset = n.from ? Y(n.from, r) : r.offset, r.offset = r.lastOffset, r.startTime = r.timeStamp = e.timeStamp);
   }
   computeValues(e) {
     const r = this.state;
@@ -261,13 +261,13 @@ class rt {
     } else
       m[0] = u[0] !== !1 ? a - u[0] : 0, m[1] = u[1] !== !1 ? c - u[1] : 0;
     this.restrictToAxis && !r._blocked && this.restrictToAxis(m);
-    const x = r.offset, C = r._active && !r._blocked || r.active;
-    C && (r.first = r._active && !r.active, r.last = !r._active && r.active, r.active = s[this.ingKey] = r._active, e && (r.first && ("bounds" in n && (r._bounds = W(n.bounds, r)), this.setup && this.setup()), r.movement = m, this.computeOffset()));
-    const [O, w] = r.offset, [[D, L], [g, I]] = r._bounds;
-    r.overflow = [O < D ? -1 : O > L ? 1 : 0, w < g ? -1 : w > I ? 1 : 0], r._movementBound[0] = r.overflow[0] ? r._movementBound[0] === !1 ? r._movement[0] : r._movementBound[0] : !1, r._movementBound[1] = r.overflow[1] ? r._movementBound[1] === !1 ? r._movement[1] : r._movementBound[1] : !1;
+    const I = r.offset, D = r._active && !r._blocked || r.active;
+    D && (r.first = r._active && !r.active, r.last = !r._active && r.active, r.active = s[this.ingKey] = r._active, e && (r.first && ("bounds" in n && (r._bounds = Y(n.bounds, r)), this.setup && this.setup()), r.movement = m, this.computeOffset()));
+    const [O, w] = r.offset, [[E, L], [g, k]] = r._bounds;
+    r.overflow = [O < E ? -1 : O > L ? 1 : 0, w < g ? -1 : w > k ? 1 : 0], r._movementBound[0] = r.overflow[0] ? r._movementBound[0] === !1 ? r._movement[0] : r._movementBound[0] : !1, r._movementBound[1] = r.overflow[1] ? r._movementBound[1] === !1 ? r._movement[1] : r._movementBound[1] : !1;
     const N = r._active ? n.rubberband || [0, 0] : [0, 0];
-    if (r.offset = Be(r._bounds, r.offset, N), r.delta = b.sub(r.offset, x), this.computeMovement(), C && (!r.last || o > tt)) {
-      r.delta = b.sub(r.offset, x);
+    if (r.offset = Be(r._bounds, r.offset, N), r.delta = b.sub(r.offset, I), this.computeMovement(), D && (!r.last || o > tt)) {
+      r.delta = b.sub(r.offset, I);
       const A = r.delta.map(Math.abs);
       b.addTo(r.distance, A), r.direction = r.delta.map(Math.sign), r._direction = r._delta.map(Math.sign), !r.first && o > 0 && (r.velocity = [A[0] / o, A[1] / o], r.timeDelta = o);
     }
@@ -310,7 +310,7 @@ class st extends rt {
   axisIntent(e) {
     const r = this.state, n = this.config;
     if (!r.axis && e) {
-      const s = typeof n.axisThreshold == "object" ? n.axisThreshold[xe(e)] : n.axisThreshold;
+      const s = typeof n.axisThreshold == "object" ? n.axisThreshold[Se(e)] : n.axisThreshold;
       r.axis = nt(r._movement, s);
     }
     r._blocked = (n.lockDirection || !!n.axis) && !r.axis || !!n.axis && n.axis !== r.axis;
@@ -327,7 +327,7 @@ class st extends rt {
       }
   }
 }
-const ve = (t) => t, ye = 0.15, ne = {
+const ve = (t) => t, ye = 0.15, se = {
   enabled(t = !0) {
     return t;
   },
@@ -369,7 +369,7 @@ const ve = (t) => t, ye = 0.15, ne = {
     return b.toVector(t, 0);
   }
 };
-process.env.NODE_ENV === "development" && Object.assign(ne, {
+process.env.NODE_ENV === "development" && Object.assign(se, {
   domTarget(t) {
     if (t !== void 0)
       throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");
@@ -386,7 +386,7 @@ process.env.NODE_ENV === "development" && Object.assign(ne, {
     return NaN;
   }
 });
-const it = 0, j = p(p({}, ne), {}, {
+const it = 0, U = p(p({}, se), {}, {
   axis(t, e, {
     axis: r
   }) {
@@ -397,7 +397,7 @@ const it = 0, j = p(p({}, ne), {}, {
   },
   bounds(t = {}) {
     if (typeof t == "function")
-      return (o) => j.bounds(t(o));
+      return (o) => U.bounds(t(o));
     if ("current" in t)
       return () => t.current;
     if (typeof HTMLElement == "function" && t instanceof HTMLElement)
@@ -434,7 +434,7 @@ class ot extends st {
         top: r.top - n.top + e.offset[1],
         bottom: r.bottom - n.bottom + e.offset[1]
       };
-      e._bounds = j.bounds(s);
+      e._bounds = U.bounds(s);
     }
   }
   cancel() {
@@ -453,7 +453,7 @@ class ot extends st {
     const r = this.config, n = this.state;
     if (e.buttons != null && (Array.isArray(r.pointerButtons) ? !r.pointerButtons.includes(e.buttons) : r.pointerButtons !== -1 && r.pointerButtons !== e.buttons)) return;
     const s = this.ctrl.setEventIds(e);
-    r.pointerCapture && e.target.setPointerCapture(e.pointerId), !(s && s.size > 1 && n._pointerActive) && (this.start(e), this.setupPointer(e), n._pointerId = Z(e), n._pointerActive = !0, this.computeValues(me(e)), this.computeInitial(), r.preventScrollAxis && xe(e) !== "mouse" ? (n._active = !1, this.setupScrollPrevention(e)) : r.delay > 0 ? (this.setupDelayTrigger(e), r.triggerAllEvents && (this.compute(e), this.emit())) : this.startPointerDrag(e));
+    r.pointerCapture && e.target.setPointerCapture(e.pointerId), !(s && s.size > 1 && n._pointerActive) && (this.start(e), this.setupPointer(e), n._pointerId = ee(e), n._pointerActive = !0, this.computeValues(me(e)), this.computeInitial(), r.preventScrollAxis && Se(e) !== "mouse" ? (n._active = !1, this.setupScrollPrevention(e)) : r.delay > 0 ? (this.setupDelayTrigger(e), r.triggerAllEvents && (this.compute(e), this.emit())) : this.startPointerDrag(e));
   }
   startPointerDrag(e) {
     const r = this.state;
@@ -462,7 +462,7 @@ class ot extends st {
   pointerMove(e) {
     const r = this.state, n = this.config;
     if (!r._pointerActive) return;
-    const s = Z(e);
+    const s = ee(e);
     if (r._pointerId !== void 0 && s !== r._pointerId) return;
     const o = me(e);
     if (document.pointerLockElement === e.target ? r._delta = [e.movementX, e.movementY] : (r._delta = b.sub(o, r._values), this.computeValues(o)), b.addTo(r._movement, r._delta), this.compute(e), r._delayed && r.intentional) {
@@ -491,17 +491,17 @@ class ot extends st {
     }
     const r = this.state, n = this.config;
     if (!r._active || !r._pointerActive) return;
-    const s = Z(e);
+    const s = ee(e);
     if (r._pointerId !== void 0 && s !== r._pointerId) return;
     this.state._pointerActive = !1, this.setActive(), this.compute(e);
     const [o, a] = r._distance;
     if (r.tap = o <= n.tapsThreshold && a <= n.tapsThreshold, r.tap && n.filterTaps)
       r._force = !0;
     else {
-      const [c, l] = r._delta, [d, u] = r._movement, [_, m] = n.swipe.velocity, [x, C] = n.swipe.distance, O = n.swipe.duration;
+      const [c, l] = r._delta, [d, u] = r._movement, [_, m] = n.swipe.velocity, [I, D] = n.swipe.distance, O = n.swipe.duration;
       if (r.elapsedTime < O) {
-        const w = Math.abs(c / r.timeDelta), D = Math.abs(l / r.timeDelta);
-        w > _ && Math.abs(d) > x && (r.swipe[0] = Math.sign(c)), D > m && Math.abs(u) > C && (r.swipe[1] = Math.sign(l));
+        const w = Math.abs(c / r.timeDelta), E = Math.abs(l / r.timeDelta);
+        w > _ && Math.abs(d) > I && (r.swipe[0] = Math.sign(c)), E > m && Math.abs(u) > D && (r.swipe[1] = Math.sign(l));
       }
     }
     this.emit();
@@ -560,18 +560,18 @@ class ot extends st {
 function at(t) {
   "persist" in t && typeof t.persist == "function" && t.persist();
 }
-const B = typeof window < "u" && window.document && window.document.createElement;
+const K = typeof window < "u" && window.document && window.document.createElement;
 function ke() {
-  return B && "ontouchstart" in window;
+  return K && "ontouchstart" in window;
 }
 function ct() {
-  return ke() || B && window.navigator.maxTouchPoints > 1;
+  return ke() || K && window.navigator.maxTouchPoints > 1;
 }
 function ut() {
-  return B && "onpointerdown" in window;
+  return K && "onpointerdown" in window;
 }
 function lt() {
-  return B && "exitPointerLock" in window.document;
+  return K && "exitPointerLock" in window.document;
 }
 function ft() {
   try {
@@ -581,7 +581,7 @@ function ft() {
   }
 }
 const P = {
-  isBrowser: B,
+  isBrowser: K,
   gesture: ft(),
   touch: ke(),
   touchscreen: ct(),
@@ -591,7 +591,7 @@ const P = {
   mouse: 0,
   touch: 0,
   pen: 8
-}, Ce = p(p({}, j), {}, {
+}, Ce = p(p({}, U), {}, {
   device(t, e, {
     pointer: {
       touch: r = !1,
@@ -679,7 +679,7 @@ process.env.NODE_ENV === "development" && Object.assign(Ce, {
     return NaN;
   }
 });
-p(p({}, ne), {}, {
+p(p({}, se), {}, {
   device(t, e, {
     shared: r,
     pointer: {
@@ -698,13 +698,13 @@ p(p({}, ne), {}, {
     angleBounds: n = {}
   }) {
     const s = (a) => {
-      const c = ge(W(r, a), {
+      const c = ge(Y(r, a), {
         min: -1 / 0,
         max: 1 / 0
       });
       return [c.min, c.max];
     }, o = (a) => {
-      const c = ge(W(n, a), {
+      const c = ge(Y(n, a), {
         min: -1 / 0,
         max: 1 / 0
       });
@@ -722,15 +722,15 @@ p(p({}, ne), {}, {
     return t;
   }
 });
-p(p({}, j), {}, {
+p(p({}, U), {}, {
   mouseOnly: (t = !0) => t
 });
-p(p({}, j), {}, {
+p(p({}, U), {}, {
   mouseOnly: (t = !0) => t
 });
-const De = /* @__PURE__ */ new Map(), re = /* @__PURE__ */ new Map();
+const De = /* @__PURE__ */ new Map(), ne = /* @__PURE__ */ new Map();
 function yt(t) {
-  De.set(t.key, t.engine), re.set(t.key, t.resolver);
+  De.set(t.key, t.engine), ne.set(t.key, t.resolver);
 }
 const bt = {
   key: "drag",
@@ -777,8 +777,8 @@ const Et = {
   transform(t) {
     return t;
   }
-}, Tt = ["target", "eventOptions", "window", "enabled", "transform"];
-function z(t = {}, e) {
+}, xt = ["target", "eventOptions", "window", "enabled", "transform"];
+function W(t = {}, e) {
   const r = {};
   for (const [n, s] of Object.entries(e))
     switch (typeof s) {
@@ -790,7 +790,7 @@ function z(t = {}, e) {
           r[n] = s.call(r, t[n], n, t);
         break;
       case "object":
-        r[n] = z(t[n], s);
+        r[n] = W(t[n], s);
         break;
       case "boolean":
         s && (r[n] = t[n]);
@@ -798,30 +798,30 @@ function z(t = {}, e) {
     }
   return r;
 }
-function St(t, e, r = {}) {
+function Tt(t, e, r = {}) {
   const n = t, {
     target: s,
     eventOptions: o,
     window: a,
     enabled: c,
     transform: l
-  } = n, d = wt(n, Tt);
-  if (r.shared = z({
+  } = n, d = wt(n, xt);
+  if (r.shared = W({
     target: s,
     eventOptions: o,
     window: a,
     enabled: c,
     transform: l
   }, Et), e) {
-    const u = re.get(e);
-    r[e] = z(p({
+    const u = ne.get(e);
+    r[e] = W(p({
       shared: r.shared
     }, d), u);
   } else
     for (const u in d) {
-      const _ = re.get(u);
+      const _ = ne.get(u);
       if (_)
-        r[u] = z(p({
+        r[u] = W(p({
           shared: r.shared
         }, d[u]), _);
       else if (process.env.NODE_ENV === "development" && !["drag", "pinch", "scroll", "wheel", "move", "hover"].includes(u)) {
@@ -848,7 +848,7 @@ class $e {
     this._listeners.forEach((e) => e()), this._listeners.clear();
   }
 }
-class xt {
+class St {
   constructor() {
     S(this, "_timeouts", /* @__PURE__ */ new Map());
   }
@@ -875,7 +875,7 @@ class It {
     }), kt(this, e);
   }
   setEventIds(e) {
-    if (Y(e))
+    if (F(e))
       return this.touchIds = new Set(Je(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;
@@ -884,7 +884,7 @@ class It {
     this.handlers = e, this.nativeHandlers = r;
   }
   applyConfig(e, r) {
-    this.config = St(e, r, this.config);
+    this.config = Tt(e, r, this.config);
   }
   clean() {
     this._targetEventStore.clean();
@@ -930,11 +930,11 @@ class It {
     }
   }
 }
-function V(t, e) {
-  t.gestures.add(e), t.gestureEventStores[e] = new $e(t, e), t.gestureTimeoutStores[e] = new xt();
+function j(t, e) {
+  t.gestures.add(e), t.gestureEventStores[e] = new $e(t, e), t.gestureTimeoutStores[e] = new St();
 }
 function kt(t, e) {
-  e.drag && V(t, "drag"), e.wheel && V(t, "wheel"), e.scroll && V(t, "scroll"), e.move && V(t, "move"), e.pinch && V(t, "pinch"), e.hover && V(t, "hover");
+  e.drag && j(t, "drag"), e.wheel && j(t, "wheel"), e.scroll && j(t, "scroll"), e.move && j(t, "move"), e.pinch && j(t, "pinch"), e.hover && j(t, "hover");
 }
 const we = (t, e, r) => (n, s, o, a = {}, c = !1) => {
   var l, d;
@@ -943,8 +943,8 @@ const we = (t, e, r) => (n, s, o, a = {}, c = !1) => {
   r && _ && (m += "Passive"), t[m] = t[m] || [], t[m].push(o);
 };
 function Ct(t, e = {}, r, n) {
-  const s = Q.useMemo(() => new It(t), []);
-  if (s.applyHandlers(t, n), s.applyConfig(e, r), Q.useEffect(s.effect.bind(s)), Q.useEffect(() => s.clean.bind(s), []), e.target === void 0)
+  const s = Z.useMemo(() => new It(t), []);
+  if (s.applyHandlers(t, n), s.applyConfig(e, r), Z.useEffect(s.effect.bind(s)), Z.useEffect(() => s.clean.bind(s), []), e.target === void 0)
     return s.bind.bind(s);
 }
 function Dt(t, e) {
@@ -952,20 +952,20 @@ function Dt(t, e) {
     drag: t
   }, e || {}, "drag");
 }
-const ee = "RSC::Event";
+const te = "RSC::Event";
 function $t() {
   const t = $(null);
   function e(n) {
-    R(() => {
+    B(() => {
       t.current || (t.current = document.createElement("div"));
       function s(o) {
         n(o.detail);
       }
       if (t.current)
-        return t.current.addEventListener(ee, s, !1), () => {
+        return t.current.addEventListener(te, s, !1), () => {
           var o;
           (o = t.current) == null || o.removeEventListener(
-            ee,
+            te,
             s,
             !1
           );
@@ -974,7 +974,7 @@ function $t() {
   }
   function r(n) {
     if (t.current) {
-      const s = new CustomEvent(ee, {
+      const s = new CustomEvent(te, {
         detail: n
       });
       t.current.dispatchEvent(s);
@@ -1004,11 +1004,11 @@ function Vt({
   slideType: _ = "item",
   initialActiveItem: m = 0
 }) {
-  const [x, C] = Re(!1), O = $(t), w = $(null), D = $(null), L = $(0), g = $(0), I = $(!r), N = $(!1), A = $(0), h = $(0), U = Ve(), F = Te({
+  const [I, D] = Re(!1), O = $(t), w = $(null), E = $(null), L = $(0), g = $(0), k = $(!r), N = $(!1), A = $(0), h = $(0), G = Ve(), H = xe({
     value: 0,
-    ref: U,
+    ref: G,
     onChange({ value: i }) {
-      D.current.style.transform = `translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`;
+      E.current.style.transform = `translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`;
     }
   }), Pe = r ? [
     ...e.map((i) => ({
@@ -1022,9 +1022,9 @@ function Vt({
       id: `next-repeated-item-${i.id}`,
       isClonedItem: !0
     }))
-  ] : e, { useListenToCustomEvent: se, emitEvent: K } = $t();
-  function ie() {
-    const { totalGutterCssVar: i } = oe();
+  ] : e, { useListenToCustomEvent: ie, emitEvent: z } = $t();
+  function oe() {
+    const { totalGutterCssVar: i } = ae();
     return i;
   }
   function Oe() {
@@ -1036,15 +1036,15 @@ function Vt({
     }
     return 1;
   }
-  function H(i) {
+  function X(i) {
     O.current && (N.current || M({
       type: "next",
       toIndex: i,
       actionType: "click"
     }));
   }
-  function X(i) {
-    O.current && (I.current || M({
+  function q(i) {
+    O.current && (k.current || M({
       type: "prev",
       toIndex: i,
       actionType: "click"
@@ -1054,56 +1054,59 @@ function Vt({
     type: i,
     shouldAnimate: f = !0,
     toIndex: y,
-    actionType: E
+    actionType: x
   }) {
-    var ce, ue;
+    var V, ue;
     const T = !f;
-    I.current = !1, N.current = !1;
-    let v = F.value.get(), k = 0;
+    k.current = !1, N.current = !1;
+    let v = H.value.get(), C = 0;
     if (i === "next" && (h.current += 1), i === "prev" && (h.current === 0 ? h.current = e.length - 1 : h.current -= 1), y !== void 0 && (h.current = y), i === "next") {
-      const G = q(
+      const R = J(
         r ? g.current * (e.length * 2) : 0
       );
-      k = -(h.current * g.current), r && h.current === e.length && (h.current = 0, v = v + g.current * e.length, k = 0), !r && (Math.abs(k) >= G || h.current === e.length - 1) && (N.current = !0, k = -G);
+      C = -(h.current * g.current), r && h.current === e.length && (h.current = 0, v = v + g.current * e.length, C = 0), !r && (Math.abs(C) >= R || h.current === e.length - 1) && (N.current = !0, C = -R);
     }
-    i === "prev" && (k = -(h.current * g.current), h.current === e.length - 1 && (v = v - e.length * g.current), !r && k >= 0 && (I.current = !0, k = 0)), L.current = k, E === "resize" ? (k = -(h.current * g.current), K({
+    i === "prev" && (C = -(h.current * g.current), h.current === e.length - 1 && (v = v - e.length * g.current), !r && C >= 0 && (k.current = !0, C = 0)), L.current = C, x === "resize" ? (C = -(h.current * g.current), z({
       eventName: "onResize",
-      sliceActionType: E,
+      sliceActionType: x,
       slideDirection: i,
       currentItem: {
         index: h.current,
-        id: ((ce = e.at(h.current)) == null ? void 0 : ce.id) ?? "",
-        startReached: I.current,
+        id: ((V = e.at(h.current)) == null ? void 0 : V.id) ?? "",
+        startReached: k.current,
         endReached: N.current
       }
-    })) : K({
+    })) : z({
       eventName: "onSlideStartChange",
-      sliceActionType: E,
+      sliceActionType: x,
       slideDirection: i,
       nextItem: {
         index: h.current,
         id: ((ue = e.at(h.current)) == null ? void 0 : ue.id) ?? "",
-        startReached: I.current,
+        startReached: k.current,
         endReached: N.current
       }
-    }), U.start({
+    }), G.start({
       immediate: T,
       from: {
         value: v
       },
       to: {
-        value: k
+        value: C
       },
-      onRest({ finished: G }) {
+      onChange({ value: R }) {
+        E.current.style.transform = `translate3d(calc(${R.value}px + var(--${n}-offset-modifier)), 0px, 0px)`;
+      },
+      onRest({ finished: R }) {
         var le;
-        G && K({
+        R && z({
           eventName: "onSlideChangeComplete",
-          sliceActionType: E,
+          sliceActionType: x,
           slideDirection: i,
           currentItem: {
             index: h.current,
             id: ((le = e.at(h.current)) == null ? void 0 : le.id) ?? "",
-            startReached: I.current,
+            startReached: k.current,
             endReached: N.current
           }
         });
@@ -1111,29 +1114,29 @@ function Vt({
     });
   }
   function Ae() {
-    const i = D.current;
+    const i = E.current;
     let f = 0;
-    return _ === "item" ? f = i.children[0].getBoundingClientRect()[a === "x" ? "width" : "height"] + ie() : f = i.getBoundingClientRect()[a === "x" ? "width" : "height"] + ie(), f;
+    return _ === "item" ? f = i.children[0].getBoundingClientRect()[a === "x" ? "width" : "height"] + oe() : f = i.getBoundingClientRect()[a === "x" ? "width" : "height"] + oe(), f;
   }
-  function q(i) {
-    const f = D.current;
+  function J(i) {
+    const f = E.current;
     return f[a === "x" ? "scrollWidth" : "scrollHeight"] - f.getBoundingClientRect()[a === "x" ? "width" : "height"] - i;
   }
-  function oe() {
+  function ae() {
     let i = 0, f = 0;
     if (w.current) {
       const y = window.getComputedStyle(
         w.current
-      ), E = y.getPropertyValue(`--${n}-start-end-gutter`).trim();
-      E.includes("px") && (i = Number(
-        E.replace("px", "")
+      ), x = y.getPropertyValue(`--${n}-start-end-gutter`).trim();
+      x.includes("px") && (i = Number(
+        x.replace("px", "")
       ));
       const T = y.getPropertyValue(`--${n}-gutter`).trim();
       T.includes("px") && (f = Number(T.replace("px", "")));
     }
     return { totalStartEndGutterCssVar: i, totalGutterCssVar: f };
   }
-  R(() => {
+  B(() => {
     function i(T) {
       const v = Oe();
       switch (T) {
@@ -1153,7 +1156,7 @@ function Vt({
     }
     function f() {
       g.current = Ae(), console.log("scrollAmountValue", g.current), A.current = g.current / 4;
-      const { totalStartEndGutterCssVar: T } = oe();
+      const { totalStartEndGutterCssVar: T } = ae();
       let v = 0;
       r && (v = g.current * e.length), v -= g.current * i(c), v -= T / 2, console.log({
         mod1: g.current * e.length,
@@ -1165,9 +1168,9 @@ function Vt({
       );
     }
     function y(T) {
-      w.current && (f(), C(!0), T && T());
+      w.current && (f(), D(!0), T && T());
     }
-    function E() {
+    function x() {
       y(), M({
         type: "resize",
         toIndex: h.current,
@@ -1176,10 +1179,10 @@ function Vt({
       });
     }
     if (t)
-      return O.current = !0, y(u), window.addEventListener("resize", E), () => {
-        window.removeEventListener("resize", E);
+      return O.current = !0, y(u), window.addEventListener("resize", x), () => {
+        window.removeEventListener("resize", x);
       };
-  }, [t, r, n, a, s, c]), R(() => {
+  }, [t, r, n, a, s, c]), B(() => {
     t && m !== h.current && M({
       type: "next",
       toIndex: m,
@@ -1187,20 +1190,23 @@ function Vt({
       shouldAnimate: !1
     });
   }, [t, m]);
-  const ae = l, Ne = Dt(
+  const ce = l, Ne = Dt(
     (i) => {
       if (!O.current)
         return;
-      const f = i.dragging, y = i.offset[a === "x" ? 0 : 1], E = i.movement[a === "x" ? 0 : 1], T = E > A.current, v = E < -A.current, k = i.velocity;
-      f && (K({
+      const f = i.dragging, y = i.offset[a === "x" ? 0 : 1], x = i.movement[a === "x" ? 0 : 1], T = x > A.current, v = x < -A.current, C = i.velocity;
+      f && (z({
         ...i,
         eventName: "onDrag",
         slideActionType: "drag"
-      }), U.start({
+      }), G.start({
         value: y,
         immediate: !0,
         config: {
-          velocity: k
+          velocity: C
+        },
+        onChange({ value: V }) {
+          E.current.style.transform = `translate3d(calc(${V.value}px + var(--${n}-offset-modifier)), 0px, 0px)`;
         }
       }), d && (T || v) && i.cancel()), i.last && (T ? (M({
         actionType: "drag",
@@ -1208,31 +1214,34 @@ function Vt({
       }), i.cancel()) : v ? (M({
         actionType: "drag",
         type: "next"
-      }), i.cancel()) : (U.start({
+      }), i.cancel()) : (G.start({
         value: L.current,
         config: {
-          velocity: k
+          velocity: C
+        },
+        onChange({ value: V }) {
+          E.current.style.transform = `translate3d(calc(${V.value}px + var(--${n}-offset-modifier)), 0px, 0px)`;
         }
       }), i.cancel()));
     },
     {
-      enabled: ae,
+      enabled: ce,
       axis: a,
       rubberband: !r,
       ...r ? {} : {
         bounds: () => ({
           right: 0,
-          left: -q(0),
-          top: -q(0),
+          left: -J(0),
+          top: -J(0),
           bottom: 0
         })
       },
-      from: () => [F.value.get(), F.value.get()]
+      from: () => [H.value.get(), H.value.get()]
     }
   );
   function Le(i) {
     var f, y;
-    return typeof i == "number" ? h.current === i : ((f = e.find((E) => E.id === i)) == null ? void 0 : f.id) === ((y = e[h.current]) == null ? void 0 : y.id);
+    return typeof i == "number" ? h.current === i : ((f = e.find((x) => x.id === i)) == null ? void 0 : f.id) === ((y = e[h.current]) == null ? void 0 : y.id);
   }
   return {
     carouselFragment: /* @__PURE__ */ Me(
@@ -1244,7 +1253,7 @@ function Vt({
         "data-part-internal": `${n}-Container`,
         ...Ne(),
         children: [
-          /* @__PURE__ */ J(
+          /* @__PURE__ */ Q(
             "style",
             {
               dangerouslySetInnerHTML: {
@@ -1261,14 +1270,14 @@ function Vt({
               --${n}-scroll-y-value: ${a === "y" ? `calc(var(--${n}-offset-position) + var(--${n}-offset-modifier))` : "0px"};
               --${n}-gutter: 0px;
               --${n}-start-end-gutter: 0px;
-              touch-action: ${ae ? a === "x" ? "pan-y" : "pan-x" : "auto"};
+              touch-action: ${ce ? a === "x" ? "pan-y" : "pan-x" : "auto"};
             }
             [data-part-internal="${n}-Track"] {
               display: flex;
               position: relative;
               --initial-offset-modifier: calc(calc(-100% - var(--${n}-gutter) + calc(var(--${n}-start-end-gutter) / 2 / ${e.length} * var(--${n}-items-per-slide)) + var(--${n}-start-end-gutter)) * ${e.length} / var(--${n}-items-per-slide));
-              left: ${r && a === "x" && !x ? "var(--initial-offset-modifier)" : "0px"};
-              top: ${r && a === "y" && !x ? "var(--initial-offset-modifier)" : "0px"};
+              left: ${r && a === "x" && !I ? "var(--initial-offset-modifier)" : "0px"};
+              top: ${r && a === "y" && !I ? "var(--initial-offset-modifier)" : "0px"};
               flex-direction: ${a === "x" ? "row" : "column"};
               width: 100%;
               height: 100%;
@@ -1302,17 +1311,17 @@ function Vt({
               }
             }
           ),
-          /* @__PURE__ */ J(
+          /* @__PURE__ */ Q(
             "div",
             {
-              ref: D,
+              ref: E,
               className: "ReactSpringCarouselTrack",
               "data-part": "Track",
               "data-part-internal": `${n}-Track`,
               onScroll: () => {
-                I.current = !1, N.current = !1;
+                k.current = !1, N.current = !1;
               },
-              children: Pe.map((i, f) => /* @__PURE__ */ J(
+              children: Pe.map((i, f) => /* @__PURE__ */ Q(
                 "div",
                 {
                   className: "ReactSpringCarouselItem",
@@ -1320,7 +1329,7 @@ function Vt({
                   "data-part-internal": `${n}-Item`,
                   "data-id": i.id,
                   children: typeof i.renderItem == "function" ? i.renderItem({
-                    useListenToCustomEvent: se,
+                    useListenToCustomEvent: ie,
                     index: f,
                     isClonedItem: !!i.isClonedItem,
                     isActiveItem: Le
@@ -1333,9 +1342,9 @@ function Vt({
         ]
       }
     ),
-    useListenToCustomEvent: se,
-    slideToNextItem: () => H(),
-    slideToPrevItem: () => X(),
+    useListenToCustomEvent: ie,
+    slideToNextItem: () => X(),
+    slideToPrevItem: () => q(),
     slideToItem: (i) => {
       if (typeof i == "number") {
         if (!e[i]) {
@@ -1344,7 +1353,7 @@ function Vt({
           );
           return;
         }
-        i > h.current ? H(i) : X(i);
+        i > h.current ? X(i) : q(i);
       }
       if (typeof i == "string") {
         const f = e.findIndex((y) => y.id === i);
@@ -1354,7 +1363,7 @@ function Vt({
           );
           return;
         }
-        f > h.current ? H(f) : X(f);
+        f > h.current ? X(f) : q(f);
       }
     }
   };
@@ -1367,12 +1376,12 @@ function Ot(t) {
 function Ee(t) {
   return t.scrollWidth - t.clientWidth;
 }
-function te(t) {
+function re(t) {
   const e = t.children[0], r = Ot(t);
   return e.getBoundingClientRect().width + r;
 }
 function Rt({ container: t, onReach: e }) {
-  const r = $("start"), n = $(0), [, s] = Te(() => ({
+  const r = $("start"), n = $(0), [, s] = xe(() => ({
     x: 0
   }));
   function o(c) {
@@ -1392,30 +1401,30 @@ function Rt({ container: t, onReach: e }) {
     if (!t.current || c === "next" && r.current === "end" || c === "prev" && r.current === "start")
       return;
     let l = 0;
-    if (c === "next" && (n.current += 1), c === "prev" && (n.current -= 1), l = n.current * te(t.current), c === "next") {
+    if (c === "next" && (n.current += 1), c === "prev" && (n.current -= 1), l = n.current * re(t.current), c === "next") {
       const d = Ee(t.current);
       l > d && (r.current = "end", l = d, e && e("end"));
     }
     c === "prev" && l <= 0 && (r.current = "start", n.current = 0, l = 0, e && e("start")), o(l);
   }
-  return R(() => {
+  return B(() => {
     function c() {
       var L;
-      const x = te(t.current), C = ((L = [...t.current.children].at(0)) == null ? void 0 : L.getBoundingClientRect().width) || 0, O = Array(t.current.childElementCount).fill(0).map((g, I) => ({
-        index: I,
-        start: x * I,
-        end: x * (I + 1)
-      })), w = t.current.scrollLeft + C, D = O.find(
+      const I = re(t.current), D = ((L = [...t.current.children].at(0)) == null ? void 0 : L.getBoundingClientRect().width) || 0, O = Array(t.current.childElementCount).fill(0).map((g, k) => ({
+        index: k,
+        start: I * k,
+        end: I * (k + 1)
+      })), w = t.current.scrollLeft + D, E = O.find(
         (g) => w >= g.start && w < g.end
       );
-      n.current = (D == null ? void 0 : D.index) || 0;
+      n.current = (E == null ? void 0 : E.index) || 0;
     }
     function l() {
       s.stop();
     }
-    function d(x) {
-      const C = x.target;
-      C.scrollLeft === 0 ? (n.current = 0, r.current = "start", e && e("start")) : C.scrollLeft >= Ee(C) ? (r.current = "end", e && e("end")) : r.current !== "idle" && (r.current = "idle", e && e("idle"));
+    function d(I) {
+      const D = I.target;
+      D.scrollLeft === 0 ? (n.current = 0, r.current = "start", e && e("start")) : D.scrollLeft >= Ee(D) ? (r.current = "end", e && e("end")) : r.current !== "idle" && (r.current = "idle", e && e("idle"));
     }
     let u, _ = 0;
     function m() {
@@ -1429,10 +1438,10 @@ function Rt({ container: t, onReach: e }) {
       }), t.current.addEventListener("scroll", d), t.current.addEventListener("scroll", m), () => {
         t.current && (t.current.removeEventListener("scroll", m), t.current.removeEventListener("scroll", d), t.current.removeEventListener("wheel", l));
       };
-  }, [t, e]), R(() => {
+  }, [t, e]), B(() => {
     if (t.current) {
       const c = new ResizeObserver(() => {
-        o(n.current * te(t.current));
+        o(n.current * re(t.current));
       });
       return c.observe(t.current), () => {
         c.disconnect();

package/dist/index.umd.js

@@ -1,4 +1,4 @@
-(function(N,M){typeof exports=="object"&&typeof module<"u"?M(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],M):(N=typeof globalThis<"u"?globalThis:N||self,M(N["react-spring-carousel"]={},N["react/jsx-runtime"],N["@react-spring/web"],N.React))})(this,function(N,M,H,m){"use strict";function Pe(t,e,r){return Math.max(e,Math.min(t,r))}const b={toVector(t,e){return t===void 0&&(t=e),Array.isArray(t)?t:[t,t]},add(t,e){return[t[0]+e[0],t[1]+e[1]]},sub(t,e){return[t[0]-e[0],t[1]-e[1]]},addTo(t,e){t[0]+=e[0],t[1]+=e[1]},subTo(t,e){t[0]-=e[0],t[1]-=e[1]}};function se(t,e,r){return e===0||Math.abs(e)===1/0?Math.pow(t,r*5):t*e*r/(e+r*t)}function ie(t,e,r,n=.15){return n===0?Pe(t,e,r):t<e?-se(e-t,r-e,n)+e:t>r?+se(t-r,r-e,n)+r:t}function $e(t,[e,r],[n,s]){const[[o,a],[c,l]]=t;return[ie(e,o,a,n),ie(r,c,l,s)]}function Oe(t,e){if(typeof t!="object"||t===null)return t;var r=t[Symbol.toPrimitive];if(r!==void 0){var n=r.call(t,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(t)}function Ae(t){var e=Oe(t,"string");return typeof e=="symbol"?e:String(e)}function x(t,e,r){return e=Ae(e),e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function oe(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(t,s).enumerable})),r.push.apply(r,n)}return r}function p(t){for(var e=1;e<arguments.length;e++){var r=arguments[e]!=null?arguments[e]:{};e%2?oe(Object(r),!0).forEach(function(n){x(t,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):oe(Object(r)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(r,n))})}return t}const ae={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 ce(t){return t?t[0].toUpperCase()+t.slice(1):""}const Ne=["enter","leave"];function Le(t=!1,e){return t&&!Ne.includes(e)}function Me(t,e="",r=!1){const n=ae[t],s=n&&n[e]||e;return"on"+ce(t)+ce(s)+(Le(r,s)?"Capture":"")}const Ve=["gotpointercapture","lostpointercapture"];function je(t){let e=t.substring(2).toLowerCase();const r=!!~e.indexOf("passive");r&&(e=e.replace("passive",""));const n=Ve.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:r}}function Re(t,e=""){const r=ae[t],n=r&&r[e]||e;return t+n}function K(t){return"touches"in t}function ue(t){return K(t)?"touch":"pointerType"in t?t.pointerType:"mouse"}function Be(t){return Array.from(t.touches).filter(e=>{var r,n;return e.target===t.currentTarget||((r=t.currentTarget)===null||r===void 0||(n=r.contains)===null||n===void 0?void 0:n.call(r,e.target))})}function Ue(t){return t.type==="touchend"||t.type==="touchcancel"?t.changedTouches:t.targetTouches}function le(t){return K(t)?Ue(t)[0]:t}function Ke(t){return Be(t).map(e=>e.identifier)}function X(t){const e=le(t);return K(t)?e.identifier:e.pointerId}function fe(t){const e=le(t);return[e.clientX,e.clientY]}function Ge(t){const e={};if("buttons"in t&&(e.buttons=t.buttons),"shiftKey"in t){const{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o}=t;Object.assign(e,{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o})}return e}function G(t,...e){return typeof t=="function"?t(...e):t}function ze(){}function We(...t){return t.length===0?ze:t.length===1?t[0]:function(){let e;for(const r of t)e=r.apply(this,arguments)||e;return e}}function de(t,e){return Object.assign({},e,t||{})}const Ye=32;class Fe{constructor(e,r,n){this.ctrl=e,this.args=r,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:r,ingKey:n,args:s}=this;r[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=s,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 r=this.state,n=this.config;r._active||(this.reset(),this.computeInitial(),r._active=!0,r.target=e.target,r.currentTarget=e.currentTarget,r.lastOffset=n.from?G(n.from,r):r.offset,r.offset=r.lastOffset,r.startTime=r.timeStamp=e.timeStamp)}computeValues(e){const r=this.state;r._values=e,r.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:r,config:n,shared:s}=this;r.args=this.args;let o=0;if(e&&(r.event=e,n.preventDefault&&e.cancelable&&r.event.preventDefault(),r.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ge(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-r.timeStamp,r.timeStamp=e.timeStamp,r.elapsedTime=r.timeStamp-r.startTime),r._active){const A=r._delta.map(Math.abs);b.addTo(r._distance,A)}this.axisIntent&&this.axisIntent(e);const[a,c]=r._movement,[l,d]=n.threshold,{_step:u,values:w}=r;if(n.hasCustomTransform?(u[0]===!1&&(u[0]=Math.abs(a)>=l&&w[0]),u[1]===!1&&(u[1]=Math.abs(c)>=d&&w[1])):(u[0]===!1&&(u[0]=Math.abs(a)>=l&&Math.sign(a)*l),u[1]===!1&&(u[1]=Math.abs(c)>=d&&Math.sign(c)*d)),r.intentional=u[0]!==!1||u[1]!==!1,!r.intentional)return;const g=[0,0];if(n.hasCustomTransform){const[A,h]=w;g[0]=u[0]!==!1?A-u[0]:0,g[1]=u[1]!==!1?h-u[1]:0}else g[0]=u[0]!==!1?a-u[0]:0,g[1]=u[1]!==!1?c-u[1]:0;this.restrictToAxis&&!r._blocked&&this.restrictToAxis(g);const I=r.offset,P=r._active&&!r._blocked||r.active;P&&(r.first=r._active&&!r.active,r.last=!r._active&&r.active,r.active=s[this.ingKey]=r._active,e&&(r.first&&("bounds"in n&&(r._bounds=G(n.bounds,r)),this.setup&&this.setup()),r.movement=g,this.computeOffset()));const[O,E]=r.offset,[[$,V],[v,k]]=r._bounds;r.overflow=[O<$?-1:O>V?1:0,E<v?-1:E>k?1:0],r._movementBound[0]=r.overflow[0]?r._movementBound[0]===!1?r._movement[0]:r._movementBound[0]:!1,r._movementBound[1]=r.overflow[1]?r._movementBound[1]===!1?r._movement[1]:r._movementBound[1]:!1;const L=r._active?n.rubberband||[0,0]:[0,0];if(r.offset=$e(r._bounds,r.offset,L),r.delta=b.sub(r.offset,I),this.computeMovement(),P&&(!r.last||o>Ye)){r.delta=b.sub(r.offset,I);const A=r.delta.map(Math.abs);b.addTo(r.distance,A),r.direction=r.delta.map(Math.sign),r._direction=r._delta.map(Math.sign),!r.first&&o>0&&(r.velocity=[A[0]/o,A[1]/o],r.timeDelta=o)}}emit(){const e=this.state,r=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(p(p(p({},r),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function He([t,e],r){const n=Math.abs(t),s=Math.abs(e);if(n>s&&n>r)return"x";if(s>n&&s>r)return"y"}class Xe extends Fe{constructor(...e){super(...e),x(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=b.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=b.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const r=this.state,n=this.config;if(!r.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ue(e)]:n.axisThreshold;r.axis=He(r._movement,s)}r._blocked=(n.lockDirection||!!n.axis)&&!r.axis||!!n.axis&&n.axis!==r.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 he=t=>t,pe=.15,q={enabled(t=!0){return t},eventOptions(t,e,r){return p(p({},r.shared.eventOptions),t)},preventDefault(t=!1){return t},triggerAllEvents(t=!1){return t},rubberband(t=0){switch(t){case!0:return[pe,pe];case!1:return[0,0];default:return b.toVector(t)}},from(t){if(typeof t=="function")return t;if(t!=null)return b.toVector(t)},transform(t,e,r){const n=t||r.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||he;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||he},threshold(t){return b.toVector(t,0)}};process.env.NODE_ENV==="development"&&Object.assign(q,{domTarget(t){if(t!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(t){if(t!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(t){if(t!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const qe=0,B=p(p({},q),{},{axis(t,e,{axis:r}){if(this.lockDirection=r==="lock",!this.lockDirection)return r},axisThreshold(t=qe){return t},bounds(t={}){if(typeof t=="function")return o=>B.bounds(t(o));if("current"in t)return()=>t.current;if(typeof HTMLElement=="function"&&t instanceof HTMLElement)return t;const{left:e=-1/0,right:r=1/0,top:n=-1/0,bottom:s=1/0}=t;return[[e,r],[n,s]]}}),me={ArrowRight:(t,e=1)=>[t*e,0],ArrowLeft:(t,e=1)=>[-1*t*e,0],ArrowUp:(t,e=1)=>[0,-1*t*e],ArrowDown:(t,e=1)=>[0,t*e]};class Je extends Xe{constructor(...e){super(...e),x(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 r=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:r.left-n.left+e.offset[0],right:r.right-n.right+e.offset[0],top:r.top-n.top+e.offset[1],bottom:r.bottom-n.bottom+e.offset[1]};e._bounds=B.bounds(s)}}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 r=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(r.pointerButtons)?!r.pointerButtons.includes(e.buttons):r.pointerButtons!==-1&&r.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);r.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=X(e),n._pointerActive=!0,this.computeValues(fe(e)),this.computeInitial(),r.preventScrollAxis&&ue(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):r.delay>0?(this.setupDelayTrigger(e),r.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const r=this.state;r._active=!0,r._preventScroll=!0,r._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const r=this.state,n=this.config;if(!r._pointerActive)return;const s=X(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;const o=fe(e);if(document.pointerLockElement===e.target?r._delta=[e.movementX,e.movementY]:(r._delta=b.sub(o,r._values),this.computeValues(o)),b.addTo(r._movement,r._delta),this.compute(e),r._delayed&&r.intentional){this.timeoutStore.remove("dragDelay"),r.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!r._preventScroll)if(r.axis)if(r.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){r._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 r=this.state,n=this.config;if(!r._active||!r._pointerActive)return;const s=X(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=r._distance;if(r.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,r.tap&&n.filterTaps)r._force=!0;else{const[c,l]=r._delta,[d,u]=r._movement,[w,g]=n.swipe.velocity,[I,P]=n.swipe.distance,O=n.swipe.duration;if(r.elapsedTime<O){const E=Math.abs(c/r.timeDelta),$=Math.abs(l/r.timeDelta);E>w&&Math.abs(d)>I&&(r.swipe[0]=Math.sign(c)),$>g&&Math.abs(u)>P&&(r.swipe[1]=Math.sign(l))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const r=this.config,n=r.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&r.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).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.",s)}}catch{}r.pointerLock&&e.currentTarget.requestPointerLock(),r.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,Qe(e);const r=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",r),this.eventStore.add(this.sharedConfig.window,"touch","cancel",r),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 r=me[e.key];if(r){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=r(this.config.keyboardDisplacement,s),n._keyboardActive=!0,b.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in me&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const r=this.config.device;e(r,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(r,"change",this.pointerMove.bind(this)),e(r,"end",this.pointerUp.bind(this)),e(r,"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 Qe(t){"persist"in t&&typeof t.persist=="function"&&t.persist()}const U=typeof window<"u"&&window.document&&window.document.createElement;function ge(){return U&&"ontouchstart"in window}function Ze(){return ge()||U&&window.navigator.maxTouchPoints>1}function et(){return U&&"onpointerdown"in window}function tt(){return U&&"exitPointerLock"in window.document}function rt(){try{return"constructor"in GestureEvent}catch{return!1}}const D={isBrowser:U,gesture:rt(),touch:ge(),touchscreen:Ze(),pointer:et(),pointerLock:tt()},nt=250,st=180,it=.5,ot=50,at=250,ct=10,ve={mouse:0,touch:0,pen:8},ye=p(p({},B),{},{device(t,e,{pointer:{touch:r=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&D.pointerLock,D.touch&&r?"touch":this.pointerLock?"mouse":D.pointer&&!s?"pointer":D.touch?"touch":"mouse"},preventScrollAxis(t,e,{preventScroll:r}){if(this.preventScrollDelay=typeof r=="number"?r:r||r===void 0&&t?nt:void 0,!(!D.touchscreen||r===!1))return t||(r!==void 0?"y":void 0)},pointerCapture(t,e,{pointer:{capture:r=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&r},threshold(t,e,{filterTaps:r=!1,tapsThreshold:n=3,axis:s=void 0}){const o=b.toVector(t,r?n:s?1:0);return this.filterTaps=r,this.tapsThreshold=n,o},swipe({velocity:t=it,distance:e=ot,duration:r=at}={}){return{velocity:this.transform(b.toVector(t)),distance:this.transform(b.toVector(e)),duration:r}},delay(t=0){switch(t){case!0:return st;case!1:return 0;default:return t}},axisThreshold(t){return t?p(p({},ve),t):ve},keyboardDisplacement(t=ct){return t}});process.env.NODE_ENV==="development"&&Object.assign(ye,{useTouch(t){if(t!==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(t){if(t!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(t){if(t!==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(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),p(p({},q),{},{device(t,e,{shared:r,pointer:{touch:n=!1}={}}){if(r.target&&!D.touch&&D.gesture)return"gesture";if(D.touch&&n)return"touch";if(D.touchscreen){if(D.pointer)return"pointer";if(D.touch)return"touch"}},bounds(t,e,{scaleBounds:r={},angleBounds:n={}}){const s=a=>{const c=de(G(r,a),{min:-1/0,max:1/0});return[c.min,c.max]},o=a=>{const c=de(G(n,a),{min:-1/0,max:1/0});return[c.min,c.max]};return typeof r!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(t,e,r){return this.lockDirection=r.axis==="lock",b.toVector(t,this.lockDirection?[.1,3]:0)},modifierKey(t){return t===void 0?"ctrlKey":t},pinchOnWheel(t=!0){return t}}),p(p({},B),{},{mouseOnly:(t=!0)=>t}),p(p({},B),{},{mouseOnly:(t=!0)=>t});const be=new Map,J=new Map;function ut(t){be.set(t.key,t.engine),J.set(t.key,t.resolver)}const lt={key:"drag",engine:Je,resolver:ye};function ft(t,e){if(t==null)return{};var r={},n=Object.keys(t),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(r[s]=t[s]);return r}function dt(t,e){if(t==null)return{};var r=ft(t,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}const ht={target(t){if(t)return()=>"current"in t?t.current:t},enabled(t=!0){return t},window(t=D.isBrowser?window:void 0){return t},eventOptions({passive:t=!0,capture:e=!1}={}){return{passive:t,capture:e}},transform(t){return t}},pt=["target","eventOptions","window","enabled","transform"];function z(t={},e){const r={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(r,t[n],n,t);Number.isNaN(o)||(r[n]=o)}else r[n]=s.call(r,t[n],n,t);break;case"object":r[n]=z(t[n],s);break;case"boolean":s&&(r[n]=t[n]);break}return r}function mt(t,e,r={}){const n=t,{target:s,eventOptions:o,window:a,enabled:c,transform:l}=n,d=dt(n,pt);if(r.shared=z({target:s,eventOptions:o,window:a,enabled:c,transform:l},ht),e){const u=J.get(e);r[e]=z(p({shared:r.shared},d),u)}else for(const u in d){const w=J.get(u);if(w)r[u]=z(p({shared:r.shared},d[u]),w);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(u)){if(u==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${u}\` was used. Please read the documentation for further information.`)}}return r}class _e{constructor(e,r){x(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=r}add(e,r,n,s,o){const a=this._listeners,c=Re(r,n),l=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},d=p(p({},l),o);e.addEventListener(c,s,d);const u=()=>{e.removeEventListener(c,s,d),a.delete(u)};return a.add(u),u}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class gt{constructor(){x(this,"_timeouts",new Map)}add(e,r,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(r,n,...s))}remove(e){const r=this._timeouts.get(e);r&&window.clearTimeout(r)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class vt{constructor(e){x(this,"gestures",new Set),x(this,"_targetEventStore",new _e(this)),x(this,"gestureEventStores",{}),x(this,"gestureTimeoutStores",{}),x(this,"handlers",{}),x(this,"config",{}),x(this,"pointerIds",new Set),x(this,"touchIds",new Set),x(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),yt(this,e)}setEventIds(e){if(K(e))return this.touchIds=new Set(Ke(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,r){this.handlers=e,this.nativeHandlers=r}applyConfig(e,r){this.config=mt(e,r,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 r=this.config.shared,n={};let s;if(!(r.target&&(s=r.target(),!s))){if(r.enabled){for(const a of this.gestures){const c=this.config[a],l=we(n,c.eventOptions,!!s);if(c.enabled){const d=be.get(a);new d(this,e,a).bind(l)}}const o=we(n,r.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",c=>this.nativeHandlers[a](p(p({},this.state.shared),{},{event:c,args:e})),void 0,!0)}for(const o in n)n[o]=We(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:c,passive:l}=je(o);this._targetEventStore.add(s,a,"",n[o],{capture:c,passive:l})}}}}function j(t,e){t.gestures.add(e),t.gestureEventStores[e]=new _e(t,e),t.gestureTimeoutStores[e]=new gt}function yt(t,e){e.drag&&j(t,"drag"),e.wheel&&j(t,"wheel"),e.scroll&&j(t,"scroll"),e.move&&j(t,"move"),e.pinch&&j(t,"pinch"),e.hover&&j(t,"hover")}const we=(t,e,r)=>(n,s,o,a={},c=!1)=>{var l,d;const u=(l=a.capture)!==null&&l!==void 0?l:e.capture,w=(d=a.passive)!==null&&d!==void 0?d:e.passive;let g=c?n:Me(n,s,u);r&&w&&(g+="Passive"),t[g]=t[g]||[],t[g].push(o)};function bt(t,e={},r,n){const s=m.useMemo(()=>new vt(t),[]);if(s.applyHandlers(t,n),s.applyConfig(e,r),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function _t(t,e){return ut(lt),bt({drag:t},e||{},"drag")}const Q="RSC::Event";function wt(){const t=m.useRef(null);function e(n){m.useEffect(()=>{t.current||(t.current=document.createElement("div"));function s(o){n(o.detail)}if(t.current)return t.current.addEventListener(Q,s,!1),()=>{var o;(o=t.current)==null||o.removeEventListener(Q,s,!1)}},[n])}function r(n){if(t.current){const s=new CustomEvent(Q,{detail:n});t.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:r}}function Et(t){let e=t.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm,"");return e=e.replace(/[\n\t]+/g," "),e=e.replace(/\s*([{}:;,])\s*/g,"$1"),e=e.replace(/\s+}/g,"}"),e=e.replace(/{\s+/g,"{"),e=e.replace(/\s+/g," "),e.trim()}function Tt({init:t=!0,items:e,withLoop:r=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:c="start",enableGestures:l=!0,slideWhenDragThresholdIsReached:d=!0,onInit:u,slideType:w="item",initialActiveItem:g=0}){const[I,P]=m.useState(!1),O=m.useRef(t),E=m.useRef(null),$=m.useRef(null),V=m.useRef(0),v=m.useRef(0),k=m.useRef(!r),L=m.useRef(!1),A=m.useRef(0),h=m.useRef(0),W=H.useSpringRef(),ee=H.useSpring({value:0,ref:W,onChange({value:i}){$.current.style.transform=`translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),It=r?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:Te,emitEvent:Y}=wt();function Se(){const{totalGutterCssVar:i}=xe();return i}function kt(){if(E.current){const f=window.getComputedStyle(E.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(f)||1}return 1}function te(i){O.current&&(L.current||R({type:"next",toIndex:i,actionType:"click"}))}function re(i){O.current&&(k.current||R({type:"prev",toIndex:i,actionType:"click"}))}function R({type:i,shouldAnimate:f=!0,toIndex:_,actionType:T}){var ke,Ce;const S=!f;k.current=!1,L.current=!1;let y=ee.value.get(),C=0;if(i==="next"&&(h.current+=1),i==="prev"&&(h.current===0?h.current=e.length-1:h.current-=1),_!==void 0&&(h.current=_),i==="next"){const F=ne(r?v.current*(e.length*2):0);C=-(h.current*v.current),r&&h.current===e.length&&(h.current=0,y=y+v.current*e.length,C=0),!r&&(Math.abs(C)>=F||h.current===e.length-1)&&(L.current=!0,C=-F)}i==="prev"&&(C=-(h.current*v.current),h.current===e.length-1&&(y=y-e.length*v.current),!r&&C>=0&&(k.current=!0,C=0)),V.current=C,T==="resize"?(C=-(h.current*v.current),Y({eventName:"onResize",sliceActionType:T,slideDirection:i,currentItem:{index:h.current,id:((ke=e.at(h.current))==null?void 0:ke.id)??"",startReached:k.current,endReached:L.current}})):Y({eventName:"onSlideStartChange",sliceActionType:T,slideDirection:i,nextItem:{index:h.current,id:((Ce=e.at(h.current))==null?void 0:Ce.id)??"",startReached:k.current,endReached:L.current}}),W.start({immediate:S,from:{value:y},to:{value:C},onRest({finished:F}){var De;F&&Y({eventName:"onSlideChangeComplete",sliceActionType:T,slideDirection:i,currentItem:{index:h.current,id:((De=e.at(h.current))==null?void 0:De.id)??"",startReached:k.current,endReached:L.current}})}})}function Ct(){const i=$.current;let f=0;return w==="item"?f=i.children[0].getBoundingClientRect()[a==="x"?"width":"height"]+Se():f=i.getBoundingClientRect()[a==="x"?"width":"height"]+Se(),f}function ne(i){const f=$.current;return f[a==="x"?"scrollWidth":"scrollHeight"]-f.getBoundingClientRect()[a==="x"?"width":"height"]-i}function xe(){let i=0,f=0;if(E.current){const _=window.getComputedStyle(E.current),T=_.getPropertyValue(`--${n}-start-end-gutter`).trim();T.includes("px")&&(i=Number(T.replace("px","")));const S=_.getPropertyValue(`--${n}-gutter`).trim();S.includes("px")&&(f=Number(S.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:f}}m.useEffect(()=>{function i(S){const y=kt();switch(S){case"start":return 0;case"middle-start":return Math.floor((y-1)*.25);case"center":return Math.floor((y-1)*.5);case"middle-end":return Math.floor((y-1)*.75);case"end":return y-1;default:return 0}}function f(){v.current=Ct(),console.log("scrollAmountValue",v.current),A.current=v.current/4;const{totalStartEndGutterCssVar:S}=xe();let y=0;r&&(y=v.current*e.length),y-=v.current*i(c),y-=S/2,console.log({mod1:v.current*e.length,mod2:v.current*i(c),mod3:S/2}),E.current.style.setProperty(`--${n}-offset-modifier`,`${-y}px`)}function _(S){E.current&&(f(),P(!0),S&&S())}function T(){_(),R({type:"resize",toIndex:h.current,shouldAnimate:!1,actionType:"resize"})}if(t)return O.current=!0,_(u),window.addEventListener("resize",T),()=>{window.removeEventListener("resize",T)}},[t,r,n,a,s,c]),m.useEffect(()=>{t&&g!==h.current&&R({type:"next",toIndex:g,actionType:"resize",shouldAnimate:!1})},[t,g]);const Ie=l,Dt=_t(i=>{if(!O.current)return;const f=i.dragging,_=i.offset[a==="x"?0:1],T=i.movement[a==="x"?0:1],S=T>A.current,y=T<-A.current,C=i.velocity;f&&(Y({...i,eventName:"onDrag",slideActionType:"drag"}),W.start({value:_,immediate:!0,config:{velocity:C}}),d&&(S||y)&&i.cancel()),i.last&&(S?(R({actionType:"drag",type:"prev"}),i.cancel()):y?(R({actionType:"drag",type:"next"}),i.cancel()):(W.start({value:V.current,config:{velocity:C}}),i.cancel()))},{enabled:Ie,axis:a,rubberband:!r,...r?{}:{bounds:()=>({right:0,left:-ne(0),top:-ne(0),bottom:0})},from:()=>[ee.value.get(),ee.value.get()]});function Pt(i){var f,_;return typeof i=="number"?h.current===i:((f=e.find(T=>T.id===i))==null?void 0:f.id)===((_=e[h.current])==null?void 0:_.id)}return{carouselFragment:M.jsxs("div",{ref:E,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Dt(),children:[M.jsx("style",{dangerouslySetInnerHTML:{__html:Et(`
+(function(N,M){typeof exports=="object"&&typeof module<"u"?M(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],M):(N=typeof globalThis<"u"?globalThis:N||self,M(N["react-spring-carousel"]={},N["react/jsx-runtime"],N["@react-spring/web"],N.React))})(this,function(N,M,X,m){"use strict";function $e(t,e,r){return Math.max(e,Math.min(t,r))}const b={toVector(t,e){return t===void 0&&(t=e),Array.isArray(t)?t:[t,t]},add(t,e){return[t[0]+e[0],t[1]+e[1]]},sub(t,e){return[t[0]-e[0],t[1]-e[1]]},addTo(t,e){t[0]+=e[0],t[1]+=e[1]},subTo(t,e){t[0]-=e[0],t[1]-=e[1]}};function ie(t,e,r){return e===0||Math.abs(e)===1/0?Math.pow(t,r*5):t*e*r/(e+r*t)}function oe(t,e,r,n=.15){return n===0?$e(t,e,r):t<e?-ie(e-t,r-e,n)+e:t>r?+ie(t-r,r-e,n)+r:t}function Pe(t,[e,r],[n,s]){const[[o,a],[c,l]]=t;return[oe(e,o,a,n),oe(r,c,l,s)]}function Oe(t,e){if(typeof t!="object"||t===null)return t;var r=t[Symbol.toPrimitive];if(r!==void 0){var n=r.call(t,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(t)}function Ae(t){var e=Oe(t,"string");return typeof e=="symbol"?e:String(e)}function I(t,e,r){return e=Ae(e),e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function ae(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(t,s).enumerable})),r.push.apply(r,n)}return r}function p(t){for(var e=1;e<arguments.length;e++){var r=arguments[e]!=null?arguments[e]:{};e%2?ae(Object(r),!0).forEach(function(n){I(t,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ae(Object(r)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(r,n))})}return t}const ce={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 ue(t){return t?t[0].toUpperCase()+t.slice(1):""}const Ne=["enter","leave"];function Le(t=!1,e){return t&&!Ne.includes(e)}function Me(t,e="",r=!1){const n=ce[t],s=n&&n[e]||e;return"on"+ue(t)+ue(s)+(Le(r,s)?"Capture":"")}const Ve=["gotpointercapture","lostpointercapture"];function je(t){let e=t.substring(2).toLowerCase();const r=!!~e.indexOf("passive");r&&(e=e.replace("passive",""));const n=Ve.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:r}}function Re(t,e=""){const r=ce[t],n=r&&r[e]||e;return t+n}function z(t){return"touches"in t}function le(t){return z(t)?"touch":"pointerType"in t?t.pointerType:"mouse"}function Be(t){return Array.from(t.touches).filter(e=>{var r,n;return e.target===t.currentTarget||((r=t.currentTarget)===null||r===void 0||(n=r.contains)===null||n===void 0?void 0:n.call(r,e.target))})}function Ue(t){return t.type==="touchend"||t.type==="touchcancel"?t.changedTouches:t.targetTouches}function fe(t){return z(t)?Ue(t)[0]:t}function Ke(t){return Be(t).map(e=>e.identifier)}function q(t){const e=fe(t);return z(t)?e.identifier:e.pointerId}function de(t){const e=fe(t);return[e.clientX,e.clientY]}function Ge(t){const e={};if("buttons"in t&&(e.buttons=t.buttons),"shiftKey"in t){const{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o}=t;Object.assign(e,{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o})}return e}function W(t,...e){return typeof t=="function"?t(...e):t}function ze(){}function We(...t){return t.length===0?ze:t.length===1?t[0]:function(){let e;for(const r of t)e=r.apply(this,arguments)||e;return e}}function he(t,e){return Object.assign({},e,t||{})}const Ye=32;class Fe{constructor(e,r,n){this.ctrl=e,this.args=r,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:r,ingKey:n,args:s}=this;r[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=s,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 r=this.state,n=this.config;r._active||(this.reset(),this.computeInitial(),r._active=!0,r.target=e.target,r.currentTarget=e.currentTarget,r.lastOffset=n.from?W(n.from,r):r.offset,r.offset=r.lastOffset,r.startTime=r.timeStamp=e.timeStamp)}computeValues(e){const r=this.state;r._values=e,r.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:r,config:n,shared:s}=this;r.args=this.args;let o=0;if(e&&(r.event=e,n.preventDefault&&e.cancelable&&r.event.preventDefault(),r.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ge(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-r.timeStamp,r.timeStamp=e.timeStamp,r.elapsedTime=r.timeStamp-r.startTime),r._active){const A=r._delta.map(Math.abs);b.addTo(r._distance,A)}this.axisIntent&&this.axisIntent(e);const[a,c]=r._movement,[l,d]=n.threshold,{_step:u,values:w}=r;if(n.hasCustomTransform?(u[0]===!1&&(u[0]=Math.abs(a)>=l&&w[0]),u[1]===!1&&(u[1]=Math.abs(c)>=d&&w[1])):(u[0]===!1&&(u[0]=Math.abs(a)>=l&&Math.sign(a)*l),u[1]===!1&&(u[1]=Math.abs(c)>=d&&Math.sign(c)*d)),r.intentional=u[0]!==!1||u[1]!==!1,!r.intentional)return;const g=[0,0];if(n.hasCustomTransform){const[A,h]=w;g[0]=u[0]!==!1?A-u[0]:0,g[1]=u[1]!==!1?h-u[1]:0}else g[0]=u[0]!==!1?a-u[0]:0,g[1]=u[1]!==!1?c-u[1]:0;this.restrictToAxis&&!r._blocked&&this.restrictToAxis(g);const C=r.offset,P=r._active&&!r._blocked||r.active;P&&(r.first=r._active&&!r.active,r.last=!r._active&&r.active,r.active=s[this.ingKey]=r._active,e&&(r.first&&("bounds"in n&&(r._bounds=W(n.bounds,r)),this.setup&&this.setup()),r.movement=g,this.computeOffset()));const[O,E]=r.offset,[[x,V],[v,k]]=r._bounds;r.overflow=[O<x?-1:O>V?1:0,E<v?-1:E>k?1:0],r._movementBound[0]=r.overflow[0]?r._movementBound[0]===!1?r._movement[0]:r._movementBound[0]:!1,r._movementBound[1]=r.overflow[1]?r._movementBound[1]===!1?r._movement[1]:r._movementBound[1]:!1;const L=r._active?n.rubberband||[0,0]:[0,0];if(r.offset=Pe(r._bounds,r.offset,L),r.delta=b.sub(r.offset,C),this.computeMovement(),P&&(!r.last||o>Ye)){r.delta=b.sub(r.offset,C);const A=r.delta.map(Math.abs);b.addTo(r.distance,A),r.direction=r.delta.map(Math.sign),r._direction=r._delta.map(Math.sign),!r.first&&o>0&&(r.velocity=[A[0]/o,A[1]/o],r.timeDelta=o)}}emit(){const e=this.state,r=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(p(p(p({},r),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function He([t,e],r){const n=Math.abs(t),s=Math.abs(e);if(n>s&&n>r)return"x";if(s>n&&s>r)return"y"}class Xe extends Fe{constructor(...e){super(...e),I(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=b.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=b.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const r=this.state,n=this.config;if(!r.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[le(e)]:n.axisThreshold;r.axis=He(r._movement,s)}r._blocked=(n.lockDirection||!!n.axis)&&!r.axis||!!n.axis&&n.axis!==r.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 pe=t=>t,me=.15,J={enabled(t=!0){return t},eventOptions(t,e,r){return p(p({},r.shared.eventOptions),t)},preventDefault(t=!1){return t},triggerAllEvents(t=!1){return t},rubberband(t=0){switch(t){case!0:return[me,me];case!1:return[0,0];default:return b.toVector(t)}},from(t){if(typeof t=="function")return t;if(t!=null)return b.toVector(t)},transform(t,e,r){const n=t||r.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||pe;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||pe},threshold(t){return b.toVector(t,0)}};process.env.NODE_ENV==="development"&&Object.assign(J,{domTarget(t){if(t!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(t){if(t!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(t){if(t!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const qe=0,K=p(p({},J),{},{axis(t,e,{axis:r}){if(this.lockDirection=r==="lock",!this.lockDirection)return r},axisThreshold(t=qe){return t},bounds(t={}){if(typeof t=="function")return o=>K.bounds(t(o));if("current"in t)return()=>t.current;if(typeof HTMLElement=="function"&&t instanceof HTMLElement)return t;const{left:e=-1/0,right:r=1/0,top:n=-1/0,bottom:s=1/0}=t;return[[e,r],[n,s]]}}),ge={ArrowRight:(t,e=1)=>[t*e,0],ArrowLeft:(t,e=1)=>[-1*t*e,0],ArrowUp:(t,e=1)=>[0,-1*t*e],ArrowDown:(t,e=1)=>[0,t*e]};class Je extends Xe{constructor(...e){super(...e),I(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 r=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:r.left-n.left+e.offset[0],right:r.right-n.right+e.offset[0],top:r.top-n.top+e.offset[1],bottom:r.bottom-n.bottom+e.offset[1]};e._bounds=K.bounds(s)}}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 r=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(r.pointerButtons)?!r.pointerButtons.includes(e.buttons):r.pointerButtons!==-1&&r.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);r.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=q(e),n._pointerActive=!0,this.computeValues(de(e)),this.computeInitial(),r.preventScrollAxis&&le(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):r.delay>0?(this.setupDelayTrigger(e),r.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const r=this.state;r._active=!0,r._preventScroll=!0,r._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const r=this.state,n=this.config;if(!r._pointerActive)return;const s=q(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;const o=de(e);if(document.pointerLockElement===e.target?r._delta=[e.movementX,e.movementY]:(r._delta=b.sub(o,r._values),this.computeValues(o)),b.addTo(r._movement,r._delta),this.compute(e),r._delayed&&r.intentional){this.timeoutStore.remove("dragDelay"),r.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!r._preventScroll)if(r.axis)if(r.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){r._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 r=this.state,n=this.config;if(!r._active||!r._pointerActive)return;const s=q(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=r._distance;if(r.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,r.tap&&n.filterTaps)r._force=!0;else{const[c,l]=r._delta,[d,u]=r._movement,[w,g]=n.swipe.velocity,[C,P]=n.swipe.distance,O=n.swipe.duration;if(r.elapsedTime<O){const E=Math.abs(c/r.timeDelta),x=Math.abs(l/r.timeDelta);E>w&&Math.abs(d)>C&&(r.swipe[0]=Math.sign(c)),x>g&&Math.abs(u)>P&&(r.swipe[1]=Math.sign(l))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const r=this.config,n=r.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&r.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).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.",s)}}catch{}r.pointerLock&&e.currentTarget.requestPointerLock(),r.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,Qe(e);const r=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",r),this.eventStore.add(this.sharedConfig.window,"touch","cancel",r),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 r=ge[e.key];if(r){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=r(this.config.keyboardDisplacement,s),n._keyboardActive=!0,b.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in ge&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const r=this.config.device;e(r,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(r,"change",this.pointerMove.bind(this)),e(r,"end",this.pointerUp.bind(this)),e(r,"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 Qe(t){"persist"in t&&typeof t.persist=="function"&&t.persist()}const G=typeof window<"u"&&window.document&&window.document.createElement;function ve(){return G&&"ontouchstart"in window}function Ze(){return ve()||G&&window.navigator.maxTouchPoints>1}function et(){return G&&"onpointerdown"in window}function tt(){return G&&"exitPointerLock"in window.document}function rt(){try{return"constructor"in GestureEvent}catch{return!1}}const $={isBrowser:G,gesture:rt(),touch:ve(),touchscreen:Ze(),pointer:et(),pointerLock:tt()},nt=250,st=180,it=.5,ot=50,at=250,ct=10,ye={mouse:0,touch:0,pen:8},be=p(p({},K),{},{device(t,e,{pointer:{touch:r=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&$.pointerLock,$.touch&&r?"touch":this.pointerLock?"mouse":$.pointer&&!s?"pointer":$.touch?"touch":"mouse"},preventScrollAxis(t,e,{preventScroll:r}){if(this.preventScrollDelay=typeof r=="number"?r:r||r===void 0&&t?nt:void 0,!(!$.touchscreen||r===!1))return t||(r!==void 0?"y":void 0)},pointerCapture(t,e,{pointer:{capture:r=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&r},threshold(t,e,{filterTaps:r=!1,tapsThreshold:n=3,axis:s=void 0}){const o=b.toVector(t,r?n:s?1:0);return this.filterTaps=r,this.tapsThreshold=n,o},swipe({velocity:t=it,distance:e=ot,duration:r=at}={}){return{velocity:this.transform(b.toVector(t)),distance:this.transform(b.toVector(e)),duration:r}},delay(t=0){switch(t){case!0:return st;case!1:return 0;default:return t}},axisThreshold(t){return t?p(p({},ye),t):ye},keyboardDisplacement(t=ct){return t}});process.env.NODE_ENV==="development"&&Object.assign(be,{useTouch(t){if(t!==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(t){if(t!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(t){if(t!==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(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),p(p({},J),{},{device(t,e,{shared:r,pointer:{touch:n=!1}={}}){if(r.target&&!$.touch&&$.gesture)return"gesture";if($.touch&&n)return"touch";if($.touchscreen){if($.pointer)return"pointer";if($.touch)return"touch"}},bounds(t,e,{scaleBounds:r={},angleBounds:n={}}){const s=a=>{const c=he(W(r,a),{min:-1/0,max:1/0});return[c.min,c.max]},o=a=>{const c=he(W(n,a),{min:-1/0,max:1/0});return[c.min,c.max]};return typeof r!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(t,e,r){return this.lockDirection=r.axis==="lock",b.toVector(t,this.lockDirection?[.1,3]:0)},modifierKey(t){return t===void 0?"ctrlKey":t},pinchOnWheel(t=!0){return t}}),p(p({},K),{},{mouseOnly:(t=!0)=>t}),p(p({},K),{},{mouseOnly:(t=!0)=>t});const _e=new Map,Q=new Map;function ut(t){_e.set(t.key,t.engine),Q.set(t.key,t.resolver)}const lt={key:"drag",engine:Je,resolver:be};function ft(t,e){if(t==null)return{};var r={},n=Object.keys(t),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(r[s]=t[s]);return r}function dt(t,e){if(t==null)return{};var r=ft(t,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}const ht={target(t){if(t)return()=>"current"in t?t.current:t},enabled(t=!0){return t},window(t=$.isBrowser?window:void 0){return t},eventOptions({passive:t=!0,capture:e=!1}={}){return{passive:t,capture:e}},transform(t){return t}},pt=["target","eventOptions","window","enabled","transform"];function Y(t={},e){const r={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(r,t[n],n,t);Number.isNaN(o)||(r[n]=o)}else r[n]=s.call(r,t[n],n,t);break;case"object":r[n]=Y(t[n],s);break;case"boolean":s&&(r[n]=t[n]);break}return r}function mt(t,e,r={}){const n=t,{target:s,eventOptions:o,window:a,enabled:c,transform:l}=n,d=dt(n,pt);if(r.shared=Y({target:s,eventOptions:o,window:a,enabled:c,transform:l},ht),e){const u=Q.get(e);r[e]=Y(p({shared:r.shared},d),u)}else for(const u in d){const w=Q.get(u);if(w)r[u]=Y(p({shared:r.shared},d[u]),w);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(u)){if(u==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${u}\` was used. Please read the documentation for further information.`)}}return r}class we{constructor(e,r){I(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=r}add(e,r,n,s,o){const a=this._listeners,c=Re(r,n),l=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},d=p(p({},l),o);e.addEventListener(c,s,d);const u=()=>{e.removeEventListener(c,s,d),a.delete(u)};return a.add(u),u}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class gt{constructor(){I(this,"_timeouts",new Map)}add(e,r,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(r,n,...s))}remove(e){const r=this._timeouts.get(e);r&&window.clearTimeout(r)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class vt{constructor(e){I(this,"gestures",new Set),I(this,"_targetEventStore",new we(this)),I(this,"gestureEventStores",{}),I(this,"gestureTimeoutStores",{}),I(this,"handlers",{}),I(this,"config",{}),I(this,"pointerIds",new Set),I(this,"touchIds",new Set),I(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),yt(this,e)}setEventIds(e){if(z(e))return this.touchIds=new Set(Ke(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,r){this.handlers=e,this.nativeHandlers=r}applyConfig(e,r){this.config=mt(e,r,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 r=this.config.shared,n={};let s;if(!(r.target&&(s=r.target(),!s))){if(r.enabled){for(const a of this.gestures){const c=this.config[a],l=Ee(n,c.eventOptions,!!s);if(c.enabled){const d=_e.get(a);new d(this,e,a).bind(l)}}const o=Ee(n,r.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",c=>this.nativeHandlers[a](p(p({},this.state.shared),{},{event:c,args:e})),void 0,!0)}for(const o in n)n[o]=We(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:c,passive:l}=je(o);this._targetEventStore.add(s,a,"",n[o],{capture:c,passive:l})}}}}function j(t,e){t.gestures.add(e),t.gestureEventStores[e]=new we(t,e),t.gestureTimeoutStores[e]=new gt}function yt(t,e){e.drag&&j(t,"drag"),e.wheel&&j(t,"wheel"),e.scroll&&j(t,"scroll"),e.move&&j(t,"move"),e.pinch&&j(t,"pinch"),e.hover&&j(t,"hover")}const Ee=(t,e,r)=>(n,s,o,a={},c=!1)=>{var l,d;const u=(l=a.capture)!==null&&l!==void 0?l:e.capture,w=(d=a.passive)!==null&&d!==void 0?d:e.passive;let g=c?n:Me(n,s,u);r&&w&&(g+="Passive"),t[g]=t[g]||[],t[g].push(o)};function bt(t,e={},r,n){const s=m.useMemo(()=>new vt(t),[]);if(s.applyHandlers(t,n),s.applyConfig(e,r),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function _t(t,e){return ut(lt),bt({drag:t},e||{},"drag")}const Z="RSC::Event";function wt(){const t=m.useRef(null);function e(n){m.useEffect(()=>{t.current||(t.current=document.createElement("div"));function s(o){n(o.detail)}if(t.current)return t.current.addEventListener(Z,s,!1),()=>{var o;(o=t.current)==null||o.removeEventListener(Z,s,!1)}},[n])}function r(n){if(t.current){const s=new CustomEvent(Z,{detail:n});t.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:r}}function Et(t){let e=t.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm,"");return e=e.replace(/[\n\t]+/g," "),e=e.replace(/\s*([{}:;,])\s*/g,"$1"),e=e.replace(/\s+}/g,"}"),e=e.replace(/{\s+/g,"{"),e=e.replace(/\s+/g," "),e.trim()}function xt({init:t=!0,items:e,withLoop:r=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:c="start",enableGestures:l=!0,slideWhenDragThresholdIsReached:d=!0,onInit:u,slideType:w="item",initialActiveItem:g=0}){const[C,P]=m.useState(!1),O=m.useRef(t),E=m.useRef(null),x=m.useRef(null),V=m.useRef(0),v=m.useRef(0),k=m.useRef(!r),L=m.useRef(!1),A=m.useRef(0),h=m.useRef(0),F=X.useSpringRef(),te=X.useSpring({value:0,ref:F,onChange({value:i}){x.current.style.transform=`translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),It=r?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:Te,emitEvent:H}=wt();function Se(){const{totalGutterCssVar:i}=Ie();return i}function Ct(){if(E.current){const f=window.getComputedStyle(E.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(f)||1}return 1}function re(i){O.current&&(L.current||R({type:"next",toIndex:i,actionType:"click"}))}function ne(i){O.current&&(k.current||R({type:"prev",toIndex:i,actionType:"click"}))}function R({type:i,shouldAnimate:f=!0,toIndex:_,actionType:T}){var B,ke;const S=!f;k.current=!1,L.current=!1;let y=te.value.get(),D=0;if(i==="next"&&(h.current+=1),i==="prev"&&(h.current===0?h.current=e.length-1:h.current-=1),_!==void 0&&(h.current=_),i==="next"){const U=se(r?v.current*(e.length*2):0);D=-(h.current*v.current),r&&h.current===e.length&&(h.current=0,y=y+v.current*e.length,D=0),!r&&(Math.abs(D)>=U||h.current===e.length-1)&&(L.current=!0,D=-U)}i==="prev"&&(D=-(h.current*v.current),h.current===e.length-1&&(y=y-e.length*v.current),!r&&D>=0&&(k.current=!0,D=0)),V.current=D,T==="resize"?(D=-(h.current*v.current),H({eventName:"onResize",sliceActionType:T,slideDirection:i,currentItem:{index:h.current,id:((B=e.at(h.current))==null?void 0:B.id)??"",startReached:k.current,endReached:L.current}})):H({eventName:"onSlideStartChange",sliceActionType:T,slideDirection:i,nextItem:{index:h.current,id:((ke=e.at(h.current))==null?void 0:ke.id)??"",startReached:k.current,endReached:L.current}}),F.start({immediate:S,from:{value:y},to:{value:D},onChange({value:U}){x.current.style.transform=`translate3d(calc(${U.value}px + var(--${n}-offset-modifier)), 0px, 0px)`},onRest({finished:U}){var De;U&&H({eventName:"onSlideChangeComplete",sliceActionType:T,slideDirection:i,currentItem:{index:h.current,id:((De=e.at(h.current))==null?void 0:De.id)??"",startReached:k.current,endReached:L.current}})}})}function kt(){const i=x.current;let f=0;return w==="item"?f=i.children[0].getBoundingClientRect()[a==="x"?"width":"height"]+Se():f=i.getBoundingClientRect()[a==="x"?"width":"height"]+Se(),f}function se(i){const f=x.current;return f[a==="x"?"scrollWidth":"scrollHeight"]-f.getBoundingClientRect()[a==="x"?"width":"height"]-i}function Ie(){let i=0,f=0;if(E.current){const _=window.getComputedStyle(E.current),T=_.getPropertyValue(`--${n}-start-end-gutter`).trim();T.includes("px")&&(i=Number(T.replace("px","")));const S=_.getPropertyValue(`--${n}-gutter`).trim();S.includes("px")&&(f=Number(S.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:f}}m.useEffect(()=>{function i(S){const y=Ct();switch(S){case"start":return 0;case"middle-start":return Math.floor((y-1)*.25);case"center":return Math.floor((y-1)*.5);case"middle-end":return Math.floor((y-1)*.75);case"end":return y-1;default:return 0}}function f(){v.current=kt(),console.log("scrollAmountValue",v.current),A.current=v.current/4;const{totalStartEndGutterCssVar:S}=Ie();let y=0;r&&(y=v.current*e.length),y-=v.current*i(c),y-=S/2,console.log({mod1:v.current*e.length,mod2:v.current*i(c),mod3:S/2}),E.current.style.setProperty(`--${n}-offset-modifier`,`${-y}px`)}function _(S){E.current&&(f(),P(!0),S&&S())}function T(){_(),R({type:"resize",toIndex:h.current,shouldAnimate:!1,actionType:"resize"})}if(t)return O.current=!0,_(u),window.addEventListener("resize",T),()=>{window.removeEventListener("resize",T)}},[t,r,n,a,s,c]),m.useEffect(()=>{t&&g!==h.current&&R({type:"next",toIndex:g,actionType:"resize",shouldAnimate:!1})},[t,g]);const Ce=l,Dt=_t(i=>{if(!O.current)return;const f=i.dragging,_=i.offset[a==="x"?0:1],T=i.movement[a==="x"?0:1],S=T>A.current,y=T<-A.current,D=i.velocity;f&&(H({...i,eventName:"onDrag",slideActionType:"drag"}),F.start({value:_,immediate:!0,config:{velocity:D},onChange({value:B}){x.current.style.transform=`translate3d(calc(${B.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),d&&(S||y)&&i.cancel()),i.last&&(S?(R({actionType:"drag",type:"prev"}),i.cancel()):y?(R({actionType:"drag",type:"next"}),i.cancel()):(F.start({value:V.current,config:{velocity:D},onChange({value:B}){x.current.style.transform=`translate3d(calc(${B.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),i.cancel()))},{enabled:Ce,axis:a,rubberband:!r,...r?{}:{bounds:()=>({right:0,left:-se(0),top:-se(0),bottom:0})},from:()=>[te.value.get(),te.value.get()]});function $t(i){var f,_;return typeof i=="number"?h.current===i:((f=e.find(T=>T.id===i))==null?void 0:f.id)===((_=e[h.current])==null?void 0:_.id)}return{carouselFragment:M.jsxs("div",{ref:E,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Dt(),children:[M.jsx("style",{dangerouslySetInnerHTML:{__html:Et(`
             [data-part-internal="${n}-Container"] {
               display: flex;
               width: 100%;
@@ -11,14 +11,14 @@
               --${n}-scroll-y-value: ${a==="y"?`calc(var(--${n}-offset-position) + var(--${n}-offset-modifier))`:"0px"};
               --${n}-gutter: 0px;
               --${n}-start-end-gutter: 0px;
-              touch-action: ${Ie?a==="x"?"pan-y":"pan-x":"auto"};
+              touch-action: ${Ce?a==="x"?"pan-y":"pan-x":"auto"};
             }
             [data-part-internal="${n}-Track"] {
               display: flex;
               position: relative;
               --initial-offset-modifier: calc(calc(-100% - var(--${n}-gutter) + calc(var(--${n}-start-end-gutter) / 2 / ${e.length} * var(--${n}-items-per-slide)) + var(--${n}-start-end-gutter)) * ${e.length} / var(--${n}-items-per-slide));
-              left: ${r&&a==="x"&&!I?"var(--initial-offset-modifier)":"0px"};
-              top: ${r&&a==="y"&&!I?"var(--initial-offset-modifier)":"0px"};
+              left: ${r&&a==="x"&&!C?"var(--initial-offset-modifier)":"0px"};
+              top: ${r&&a==="y"&&!C?"var(--initial-offset-modifier)":"0px"};
               flex-direction: ${a==="x"?"row":"column"};
               width: 100%;
               height: 100%;
@@ -44,4 +44,4 @@
                     }
                   }
                 `).join(""):""}
-          `)}}),M.jsx("div",{ref:$,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{k.current=!1,L.current=!1},children:It.map((i,f)=>M.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:Te,index:f,isClonedItem:!!i.isClonedItem,isActiveItem:Pt}):i.renderItem},`${i.id}-${f}`))})]}),useListenToCustomEvent:Te,slideToNextItem:()=>te(),slideToPrevItem:()=>re(),slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>h.current?te(i):re(i)}if(typeof i=="string"){const f=e.findIndex(_=>_.id===i);if(f<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}f>h.current?te(f):re(f)}}}}function St(t){let e=0;const r=getComputedStyle(t).getPropertyValue("gap");return r.includes("px")&&(e=Number(r.replace("px",""))),e}function Ee(t){return t.scrollWidth-t.clientWidth}function Z(t){const e=t.children[0],r=St(t);return e.getBoundingClientRect().width+r}function xt({container:t,onReach:e}){const r=m.useRef("start"),n=m.useRef(0),[,s]=H.useSpring(()=>({x:0}));function o(c){s.start({from:{x:t.current.scrollLeft},to:{x:c},onChange({value:l}){t.current&&(t.current.scrollLeft=l.x)}})}function a(c){if(!t.current||c==="next"&&r.current==="end"||c==="prev"&&r.current==="start")return;let l=0;if(c==="next"&&(n.current+=1),c==="prev"&&(n.current-=1),l=n.current*Z(t.current),c==="next"){const d=Ee(t.current);l>d&&(r.current="end",l=d,e&&e("end"))}c==="prev"&&l<=0&&(r.current="start",n.current=0,l=0,e&&e("start")),o(l)}return m.useEffect(()=>{function c(){var V;const I=Z(t.current),P=((V=[...t.current.children].at(0))==null?void 0:V.getBoundingClientRect().width)||0,O=Array(t.current.childElementCount).fill(0).map((v,k)=>({index:k,start:I*k,end:I*(k+1)})),E=t.current.scrollLeft+P,$=O.find(v=>E>=v.start&&E<v.end);n.current=($==null?void 0:$.index)||0}function l(){s.stop()}function d(I){const P=I.target;P.scrollLeft===0?(n.current=0,r.current="start",e&&e("start")):P.scrollLeft>=Ee(P)?(r.current="end",e&&e("end")):r.current!=="idle"&&(r.current="idle",e&&e("idle"))}let u,w=0;function g(){w=t.current.scrollLeft,clearTimeout(u),u=setTimeout(function(){t.current.scrollLeft===w&&c()},200)}if(t.current)return t.current.addEventListener("wheel",l,{passive:!0}),t.current.addEventListener("scroll",d),t.current.addEventListener("scroll",g),()=>{t.current&&(t.current.removeEventListener("scroll",g),t.current.removeEventListener("scroll",d),t.current.removeEventListener("wheel",l))}},[t,e]),m.useEffect(()=>{if(t.current){const c=new ResizeObserver(()=>{o(n.current*Z(t.current))});return c.observe(t.current),()=>{c.disconnect()}}},[]),{scrollToNext(){a("next")},scrollToPrev(){a("prev")}}}N.useSpringCarousel=Tt,N.useSpringScroll=xt,Object.defineProperty(N,Symbol.toStringTag,{value:"Module"})});
+          `)}}),M.jsx("div",{ref:x,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{k.current=!1,L.current=!1},children:It.map((i,f)=>M.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:Te,index:f,isClonedItem:!!i.isClonedItem,isActiveItem:$t}):i.renderItem},`${i.id}-${f}`))})]}),useListenToCustomEvent:Te,slideToNextItem:()=>re(),slideToPrevItem:()=>ne(),slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>h.current?re(i):ne(i)}if(typeof i=="string"){const f=e.findIndex(_=>_.id===i);if(f<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}f>h.current?re(f):ne(f)}}}}function Tt(t){let e=0;const r=getComputedStyle(t).getPropertyValue("gap");return r.includes("px")&&(e=Number(r.replace("px",""))),e}function xe(t){return t.scrollWidth-t.clientWidth}function ee(t){const e=t.children[0],r=Tt(t);return e.getBoundingClientRect().width+r}function St({container:t,onReach:e}){const r=m.useRef("start"),n=m.useRef(0),[,s]=X.useSpring(()=>({x:0}));function o(c){s.start({from:{x:t.current.scrollLeft},to:{x:c},onChange({value:l}){t.current&&(t.current.scrollLeft=l.x)}})}function a(c){if(!t.current||c==="next"&&r.current==="end"||c==="prev"&&r.current==="start")return;let l=0;if(c==="next"&&(n.current+=1),c==="prev"&&(n.current-=1),l=n.current*ee(t.current),c==="next"){const d=xe(t.current);l>d&&(r.current="end",l=d,e&&e("end"))}c==="prev"&&l<=0&&(r.current="start",n.current=0,l=0,e&&e("start")),o(l)}return m.useEffect(()=>{function c(){var V;const C=ee(t.current),P=((V=[...t.current.children].at(0))==null?void 0:V.getBoundingClientRect().width)||0,O=Array(t.current.childElementCount).fill(0).map((v,k)=>({index:k,start:C*k,end:C*(k+1)})),E=t.current.scrollLeft+P,x=O.find(v=>E>=v.start&&E<v.end);n.current=(x==null?void 0:x.index)||0}function l(){s.stop()}function d(C){const P=C.target;P.scrollLeft===0?(n.current=0,r.current="start",e&&e("start")):P.scrollLeft>=xe(P)?(r.current="end",e&&e("end")):r.current!=="idle"&&(r.current="idle",e&&e("idle"))}let u,w=0;function g(){w=t.current.scrollLeft,clearTimeout(u),u=setTimeout(function(){t.current.scrollLeft===w&&c()},200)}if(t.current)return t.current.addEventListener("wheel",l,{passive:!0}),t.current.addEventListener("scroll",d),t.current.addEventListener("scroll",g),()=>{t.current&&(t.current.removeEventListener("scroll",g),t.current.removeEventListener("scroll",d),t.current.removeEventListener("wheel",l))}},[t,e]),m.useEffect(()=>{if(t.current){const c=new ResizeObserver(()=>{o(n.current*ee(t.current))});return c.observe(t.current),()=>{c.disconnect()}}},[]),{scrollToNext(){a("next")},scrollToPrev(){a("prev")}}}N.useSpringCarousel=xt,N.useSpringScroll=St,Object.defineProperty(N,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-spring-carousel",
-  "version": "3.0.0-beta-2.0.94",
+  "version": "3.0.0-beta-2.0.97",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.umd.js",
@@ -29,7 +29,7 @@
     "@use-gesture/react": "^10.3.1"
   },
   "peerDependencies": {
-    "@react-spring/web": "^9.5.4",
+    "@react-spring/web": "^9.5.4 || ^10.0.0",
     "react": "^18.0.0 || ^19",
     "react-dom": "^18.0.0 || ^19"
   },