react-spring-carousel 3.0.0-beta-1.0.422 → 3.0.0-beta-2.0.0

package/dist/index.es.js

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