react-spring-carousel 3.0.0-beta090 → 3.0.0-beta090.10

package/dist/index.es2.js

@@ -1,65 +1,66 @@
-import { u as Ve, a as De, j as P } from "./useThumbsModule-e63fbf2f.js";
-import { useSpring as qe, config as Y, useIsomorphicLayoutEffect as Be } from "@react-spring/web";
-import { useRef as g, useEffect as N, createContext as He, useCallback as Oe, useContext as ze } from "react";
-import { useDrag as Xe } from "@use-gesture/react";
-import Ye from "resize-observer-polyfill";
-import $ from "screenfull";
-function Je({
+import { u as Be, a as He, j as R } from "./useThumbsModule-4e4b7969.js";
+import { useSpring as ze, config as _, useIsomorphicLayoutEffect as Xe } from "@react-spring/web";
+import { useDrag as Ye } from "@use-gesture/react";
+import { useRef as m, useEffect as E, createContext as Je, useCallback as Y, useContext as Ke } from "react";
+import Qe from "resize-observer-polyfill";
+import N from "screenfull";
+function Ue({
   mainCarouselWrapperRef: n,
   onFullScreenChange: v,
-  handleResize: E
+  handleResize: W
 }) {
-  const J = g(!1);
-  N(() => {
-    function h() {
-      document.fullscreenElement && (O(!0), v(!0), E && E()), document.fullscreenElement || (O(!1), v(!1), E && E());
+  const O = m(!1);
+  E(() => {
+    function a() {
+      document.fullscreenElement && (J(!0), v(!0), W && W()), document.fullscreenElement || (J(!1), v(!1), W && W());
     }
-    if ($.isEnabled)
-      return $.on("change", h), () => {
-        $.isEnabled && $.off("change", h);
+    if (N.isEnabled)
+      return N.on("change", a), () => {
+        N.isEnabled && N.off("change", a);
       };
   }, []);
-  function O(h) {
-    J.current = h;
+  function J(a) {
+    O.current = a;
   }
-  function b() {
-    return J.current;
+  function y() {
+    return O.current;
   }
-  function k(h) {
-    $.isEnabled && $.request(h || n.current);
+  function b(a) {
+    N.isEnabled && N.request(a || n.current);
   }
   function u() {
-    $.isEnabled && $.exit();
+    N.isEnabled && N.exit();
   }
   return {
-    enterFullscreen: k,
+    enterFullscreen: b,
     exitFullscreen: u,
-    getIsFullscreen: b
+    getIsFullscreen: y
   };
 }
-function et({
+function tr({
   items: n,
   init: v = !0,
-  withThumbs: E,
-  thumbsSlideAxis: J = "x",
-  itemsPerSlide: O = 1,
-  slideType: b = "fixed",
-  gutter: k = 0,
+  withThumbs: W,
+  thumbsSlideAxis: O = "x",
+  itemsPerSlide: J = 1,
+  slideType: y = "fixed",
+  gutter: b = 0,
   withLoop: u = !1,
-  startEndGutter: h = 0,
-  carouselSlideAxis: i = "x",
-  disableGestures: ae = !1,
-  draggingSlideTreshold: L,
-  slideWhenThresholdIsReached: de = !1,
+  startEndGutter: a = 0,
+  carouselSlideAxis: o = "x",
+  disableGestures: me = !1,
+  draggingSlideTreshold: ne,
+  slideWhenThresholdIsReached: ve = !1,
   freeScroll: c,
-  enableFreeScrollDrag: pe,
-  initialStartingPosition: A,
-  prepareThumbsData: xe,
-  initialActiveItem: M = 0,
-  animateWhenActiveItemChange: ye = !0,
-  getControllerRef: S
+  enableFreeScrollDrag: ce,
+  initialStartingPosition: L,
+  prepareThumbsData: be,
+  initialActiveItem: C = 0,
+  animateWhenActiveItemChange: Te = !0,
+  getControllerRef: ue,
+  slideGroupOfItems: j = !1
 }) {
-  const w = O > n.length ? n.length : O, z = g(!1), K = g(L ?? 0), C = g("initial"), ee = g("initial"), te = g("initial"), p = g(M), s = g(M === 0), l = g(b === "fixed" && M === n.length - 1), f = g(null), x = g(null), re = g(0), ne = g(0), a = g(0), Ie = g(u), Te = g(b), be = g(c), R = g(!1), Q = Oe(() => u ? [
+  const w = J > n.length ? n.length : J, K = m(!1), G = m(ne ?? 0), k = m("initial"), oe = m("initial"), ie = m("initial"), p = m(C), d = m(C === 0), s = m(y === "fixed" && C === n.length - 1), f = m(null), x = m(null), se = m(0), le = m(0), g = m(0), we = m(u), Me = m(y), Ce = m(c), V = m(!1), A = Y(() => u ? [
     ...n.map((e) => ({
       ...e,
       id: `prev-repeated-item-${e.id}`
@@ -69,263 +70,281 @@ function et({
       ...e,
       id: `next-repeated-item-${e.id}`
     }))
-  ] : [...n], [n, u])(), [W, y] = qe(
+  ] : [...n], [n, u])(), [P, I] = ze(
     () => ({
       val: 0,
       pause: !v,
       onChange: ({ value: e }) => {
-        c && f.current ? (i === "x" ? f.current.scrollLeft = Math.abs(e.val) : f.current.scrollTop = Math.abs(e.val), G()) : x.current && (i === "x" ? x.current.style.transform = `translate3d(${e.val}px, 0px,0px)` : x.current.style.transform = `translate3d(0px,${e.val}px,0px)`);
+        c && f.current ? (o === "x" ? f.current.scrollLeft = Math.abs(e.val) : f.current.scrollTop = Math.abs(e.val), te()) : x.current && (o === "x" ? x.current.style.transform = `translate3d(${e.val}px, 0px,0px)` : x.current.style.transform = `translate3d(0px,${e.val}px,0px)`);
       }
     }),
     [c]
-  ), { emitEvent: U, useListenToCustomEvent: Z } = Ve(), { thumbsFragment: Me, handleScroll: we } = De({
-    withThumbs: !!E,
-    thumbsSlideAxis: J,
-    prepareThumbsData: xe,
+  ), { emitEvent: S, useListenToCustomEvent: ee } = Be(), { thumbsFragment: ke, handleScroll: Fe } = He({
+    withThumbs: !!W,
+    thumbsSlideAxis: O,
+    prepareThumbsData: be,
     items: n,
     renderThumbFnProps: {
-      getIsActiveItem: se,
-      getIsPrevItem: le,
-      useListenToCustomEvent: Z,
-      getIsNextItem: oe
+      getIsActiveItem: ge,
+      getIsPrevItem: de,
+      useListenToCustomEvent: ee,
+      getIsNextItem: ae
     }
-  }), { enterFullscreen: me, exitFullscreen: ge, getIsFullscreen: ve } = Je({
+  }), { enterFullscreen: pe, exitFullscreen: xe, getIsFullscreen: Ie } = Ue({
     mainCarouselWrapperRef: f,
-    handleResize: () => _(),
+    handleResize: () => re(),
     onFullScreenChange: (e) => {
-      U({
+      S({
         eventName: "onFullscreenChange",
         isFullscreen: e
       });
     }
   });
-  function Ce(e) {
-    return b === "fixed" && !c ? {
-      marginRight: `${e ? 0 : k}px`,
-      flex: `1 0 calc(100% / ${w} - ${k * (w - 1) / w}px)`
+  function $e(e) {
+    return y === "fixed" && !c ? {
+      marginRight: `${e ? 0 : b}px`,
+      flex: `1 0 calc(100% / ${w} - ${b * (w - 1) / w}px)`
     } : {
-      marginRight: `${e ? 0 : k}px`
+      marginRight: `${e ? 0 : b}px`
     };
   }
-  function d() {
+  const l = Y(() => {
     var r;
-    const e = (r = f.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
+    const e = j ? f.current : (r = f.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
     if (!e)
       throw Error("No carousel items available!");
-    return e.getBoundingClientRect()[i === "x" ? "width" : "height"] + k;
-  }
-  function j({ from: e, to: r, nextActiveItem: t, immediate: o = !1, slideMode: T }) {
-    ee.current = T, typeof t == "number" && (c || (p.current = t), U({
+    let t = e.getBoundingClientRect()[o === "x" ? "width" : "height"];
+    return j || (t += b), j && (t += b - a * 2), t;
+  }, [o, b, j, a]);
+  function D({ from: e, to: t, nextActiveItem: r, immediate: i = !1, slideMode: M }) {
+    oe.current = M, typeof r == "number" && (c || (p.current = r), S({
       eventName: "onSlideStartChange",
-      slideActionType: C.current,
-      slideMode: ee.current,
+      slideActionType: k.current,
+      slideMode: oe.current,
       nextItem: {
-        startReached: s.current,
-        endReached: l.current,
+        startReached: d.current,
+        endReached: s.current,
         index: c ? -1 : p.current,
         id: c ? "" : n[p.current].id
       }
-    })), a.current = r, y.start({
-      immediate: o,
+    })), g.current = t, I.start({
+      immediate: i,
       from: {
         val: e
       },
       to: {
-        val: r
+        val: t
       },
       config: {
-        ...Y.default,
-        velocity: W.val.velocity
+        ..._.default,
+        velocity: P.val.velocity
       },
-      onRest(B) {
-        !o && B.finished && U({
+      onRest(z) {
+        !i && z.finished && S({
           eventName: "onSlideChange",
-          slideActionType: C.current,
-          slideMode: ee.current,
+          slideActionType: k.current,
+          slideMode: oe.current,
           currentItem: {
-            startReached: s.current,
-            endReached: l.current,
+            startReached: d.current,
+            endReached: s.current,
             index: c ? -1 : p.current,
             id: c ? "" : n[p.current].id
           }
         });
       }
-    }), E && !o && we(p.current);
+    }), W && !i && Fe(p.current);
   }
-  function m() {
+  const h = Y(() => {
     var e;
-    return u ? d() * n.length : Math.round(
+    return x.current ? u ? l() * n.length : Math.round(
       Number(
-        (e = x.current) == null ? void 0 : e[i === "x" ? "scrollWidth" : "scrollHeight"]
-      ) - x.current.getBoundingClientRect()[i === "x" ? "width" : "height"] - h * 2
-    );
-  }
-  function Fe() {
-    const e = `calc(100% - ${h * 2}px)`;
+        (e = x.current) == null ? void 0 : e[o === "x" ? "scrollWidth" : "scrollHeight"]
+      ) - x.current.getBoundingClientRect()[o === "x" ? "width" : "height"] - a * 2
+    ) : 0;
+  }, [o, l, n.length, a, u]);
+  function Ne() {
+    const e = `calc(100% - ${a * 2}px)`;
     return {
-      width: i === "x" ? e : "100%",
-      height: i === "y" ? e : "100%"
+      width: o === "x" ? e : "100%",
+      height: o === "y" ? e : "100%"
     };
   }
-  function ce() {
-    var r;
-    const e = (r = x.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
+  const Q = Y(() => {
+    var t;
+    const e = (t = x.current) == null ? void 0 : t.querySelector(".use-spring-carousel-item");
     if (!e)
       throw Error("No carousel items available!");
-    return e.getBoundingClientRect()[i === "x" ? "width" : "height"] + k;
-  }
-  function ue(e) {
-    const r = i === "x" ? "left" : "top", t = x.current;
-    t && (u ? (t.style.top = "0px", t.style.left = "0px", t.style[r] = `-${e - h}px`, s.current = !1, l.current = !1) : (t.style.left = "0px", t.style.top = "0px"));
-  }
-  function _(e = !1) {
-    if (x.current && e && (x.current.style.transform = "translate3d(0px, 0px,0px)", x.current.style.left = "0", x.current.style.top = "0"), b === "fixed" && ue(
-      A === "center" ? ce() * n.length - d() * Math.round((w - 1) / 2) : A === "end" ? ce() * n.length - d() * Math.round(w - 1) : ce() * n.length
-    ), b === "fluid") {
-      if (l.current && m() !== Math.abs(a.current) && !u) {
-        const r = -m();
-        a.current = r, y.start({
-          immediate: !0,
-          val: a.current
-        });
+    return e.getBoundingClientRect()[o === "x" ? "width" : "height"] + b;
+  }, [o, b]), U = Y(
+    (e) => {
+      const t = o === "x" ? "left" : "top", r = x.current;
+      r && (u ? (r.style.top = "0px", r.style.left = "0px", r.style[t] = `-${e - a}px`, d.current = !1, s.current = !1) : (r.style.left = "0px", r.style.top = "0px"));
+    },
+    [o, a, u]
+  ), re = Y(
+    (e = !1) => {
+      if (x.current && e && (x.current.style.transform = "translate3d(0px, 0px,0px)", x.current.style.left = "0", x.current.style.top = "0"), y === "fixed" && U(
+        L === "center" ? Q() * n.length - l() * Math.round((w - 1) / 2) : L === "end" ? Q() * n.length - l() * Math.round(w - 1) : Q() * n.length
+      ), y === "fluid") {
+        if (U(Q() * n.length), s.current && h() !== Math.abs(g.current) && !u) {
+          const t = -h();
+          g.current = t, I.start({
+            immediate: !0,
+            val: g.current
+          });
+          return;
+        }
+        if (Math.abs(g.current) > 0 && h() !== Math.abs(g.current) && !u && !c && ie.current === "backward") {
+          const t = se.current - h(), r = g.current + t;
+          return I.start({
+            immediate: !0,
+            val: r
+          }), () => {
+            g.current = r;
+          };
+        }
+        console.log("here");
         return;
       }
-      if (Math.abs(a.current) > 0 && m() !== Math.abs(a.current) && !u && !c && te.current === "backward") {
-        const r = re.current - m(), t = a.current + r;
-        return y.start({
-          immediate: !0,
-          val: t
-        }), () => {
-          a.current = t;
-        };
+      if (!c && y === "fixed") {
+        const t = -(l() * p.current);
+        if (Math.abs(t) > h() && !u) {
+          const r = -h();
+          s.current = !0, g.current = r, I.start({
+            immediate: !0,
+            val: g.current
+          });
+        } else
+          g.current = t, I.start({
+            immediate: !0,
+            val: t
+          });
+        setTimeout(() => {
+          K.current = !1;
+        }, 0);
       }
-      return;
-    }
-    if (!c && b === "fixed") {
-      const r = -(d() * p.current);
-      if (Math.abs(r) > m() && !u) {
-        const t = -m();
-        l.current = !0, a.current = t, y.start({
-          immediate: !0,
-          val: a.current
-        });
-      } else
-        a.current = r, y.start({
-          immediate: !0,
-          val: r
-        });
-      setTimeout(() => {
-        z.current = !1;
-      }, 0);
-    }
-  }
+    },
+    [
+      c,
+      Q,
+      l,
+      h,
+      L,
+      n.length,
+      w,
+      U,
+      I,
+      y,
+      u
+    ]
+  );
   function F() {
-    return c && f.current ? f.current[i === "x" ? "scrollLeft" : "scrollTop"] : W.val.get();
+    return c && f.current ? f.current[o === "x" ? "scrollLeft" : "scrollTop"] : P.val.get();
   }
-  function X(e, r) {
+  function Z(e, t) {
     if (c && e === "next") {
-      const t = a.current + d();
-      return t > m() ? m() : t;
+      const r = g.current + l();
+      return r > h() ? h() : r;
     }
     if (c && e === "prev") {
-      const t = a.current - d();
-      return t < 0 ? 0 : t;
+      const r = g.current - l();
+      return r < 0 ? 0 : r;
     }
-    return e === "next" ? typeof r == "number" ? -(r * d()) : a.current - d() : typeof r == "number" ? -(r * d()) : a.current + d();
+    return e === "next" ? typeof t == "number" ? -(t * l()) : g.current - l() : typeof t == "number" ? -(t * l()) : g.current + l();
   }
-  function V({ type: e, index: r, immediate: t }) {
-    if (!v || R.current || s.current && !u)
+  function q({ type: e, index: t, immediate: r }) {
+    if (!v || V.current || d.current && !u)
       return;
-    l.current && (te.current = "backward"), C.current = "prev", l.current = !1;
-    const o = typeof r == "number" ? r : p.current - 1;
-    if (c && G(), !u) {
-      const T = c ? X("prev", r) - d() / 3 < 0 : X("prev", r) + d() / 3 > 0;
-      if (s.current)
+    s.current && (ie.current = "backward"), k.current = "prev", s.current = !1;
+    const i = typeof t == "number" ? t : p.current - 1;
+    if (c && te(), !u) {
+      const M = c ? Z("prev", t) - l() / 3 < 0 : Z("prev", t) + l() / 3 > 0;
+      if (d.current)
         return;
-      if (T) {
-        s.current = !0, l.current = !1, j({
+      if (M) {
+        d.current = !0, s.current = !1, D({
           slideMode: e,
           from: F(),
           to: 0,
           nextActiveItem: 0,
-          immediate: t
+          immediate: r
         });
         return;
       }
     }
-    if (u && (s.current || o < 0)) {
-      s.current = !1, l.current = !0, j({
+    if (u && (d.current || i < 0)) {
+      d.current = !1, s.current = !0, D({
         slideMode: e,
-        from: F() - d() * n.length,
-        to: -(d() * n.length) + d(),
+        from: F() - l() * n.length,
+        to: -(l() * n.length) + l(),
         nextActiveItem: n.length - 1,
-        immediate: t
+        immediate: r
       });
       return;
     }
-    o === 0 && (s.current = !0), (o === n.length - 1 || o === -1) && (l.current = !0), j({
+    i === 0 && (d.current = !0), (i === n.length - 1 || i === -1) && (s.current = !0), D({
       slideMode: e,
       from: F(),
-      to: X("prev", r),
-      nextActiveItem: o,
-      immediate: t
+      to: Z("prev", t),
+      nextActiveItem: i,
+      immediate: r
     });
   }
-  function D({ type: e, index: r, immediate: t }) {
-    if (!v || R.current || l.current && !u)
+  function B({ type: e, index: t, immediate: r }) {
+    if (!v || V.current || s.current && !u)
       return;
-    s.current && (te.current = "forward"), C.current = "next", s.current = !1;
-    const o = r || p.current + 1;
-    if (c && G(), !u) {
-      const T = Math.abs(X("next", r)) > m() - d() / 3;
-      if (l.current)
+    d.current && (ie.current = "forward"), k.current = "next", d.current = !1;
+    const i = t || p.current + 1;
+    if (c && te(), !u) {
+      const M = Math.abs(Z("next", t)) > h() - l() / 3;
+      if (s.current)
         return;
-      if (T) {
-        s.current = !1, l.current = !0, j({
+      if (M) {
+        d.current = !1, s.current = !0, D({
           slideMode: e,
           from: F(),
-          to: c ? m() : -m(),
-          nextActiveItem: o,
-          immediate: t
+          to: c ? h() : -h(),
+          nextActiveItem: i,
+          immediate: r
         });
         return;
       }
     }
-    if (u && (l.current || o > n.length - 1)) {
-      l.current = !1, s.current = !0, j({
+    if (u && (s.current || i > n.length - 1)) {
+      s.current = !1, d.current = !0, D({
         slideMode: e,
-        from: F() + d() * n.length,
+        from: F() + l() * n.length,
         to: 0,
         nextActiveItem: 0,
-        immediate: t
+        immediate: r
       });
       return;
     }
-    o === 0 && (s.current = !0), o === n.length - 1 && (l.current = !0), j({
+    i === 0 && (d.current = !0), i === n.length - 1 && (s.current = !0), D({
       slideMode: e,
       from: F(),
-      to: X("next", r),
-      nextActiveItem: o,
-      immediate: t
+      to: Z("next", t),
+      nextActiveItem: i,
+      immediate: r
     });
   }
-  function ke() {
-    L ? K.current = L : K.current = Math.floor(d() / 2 / 2);
+  function Ee() {
+    ne ? G.current = ne : G.current = Math.floor(l() / 2 / 2);
   }
-  function he() {
-    x.current && (re.current = m(), Ie.current = u, Te.current = b, be.current = c, ne.current = window.innerWidth, a.current = 0, ie({ id: 0, immediate: !0, shouldReset: !0 }), ke(), _());
+  function ye() {
+    x.current && (se.current = h(), we.current = u, Me.current = y, Ce.current = c, le.current = window.innerWidth, g.current = 0, fe({ id: 0, immediate: !0, shouldReset: !0 }), Ee(), re());
   }
-  const $e = Xe(
+  const We = Ye(
     (e) => {
-      const r = e.dragging, t = e.offset[i === "x" ? 0 : 1], o = e.movement[i === "x" ? 0 : 1], T = e.direction[i === "x" ? 0 : 1], B = o > K.current, H = o < -K.current, je = m();
-      if (r) {
-        if (T > 0 ? C.current = "prev" : C.current = "next", U({
+      const t = e.dragging, r = e.offset[o === "x" ? 0 : 1], i = e.movement[o === "x" ? 0 : 1], M = e.direction[o === "x" ? 0 : 1], z = i > G.current, X = i < -G.current, qe = h(), $ = e.velocity;
+      if (t) {
+        if (M > 0 ? k.current = "prev" : k.current = "next", S({
           ...e,
           eventName: "onDrag",
-          slideActionType: C.current
+          slideActionType: k.current
         }), c) {
-          if (t > 0) {
-            y.start({
+          if (r > 0) {
+            I.start({
               from: {
                 val: F()
               },
@@ -333,40 +352,40 @@ function et({
                 val: 0
               },
               config: {
-                velocity: e.velocity,
+                velocity: $,
                 friction: 50,
                 tension: 1e3
               }
             }), e.cancel();
             return;
           }
-          y.start({
+          I.start({
             from: {
               val: F()
             },
             to: {
-              val: -t
+              val: -r
             },
             config: {
-              velocity: e.velocity,
+              velocity: $,
               friction: 50,
               tension: 1e3
             }
           });
           return;
         }
-        y.start({
-          val: t,
+        I.start({
+          val: r,
           config: {
-            velocity: e.velocity,
+            velocity: $,
             friction: 50,
             tension: 1e3
           }
-        }), de && H ? (D({ type: "drag" }), e.cancel()) : de && B && (V({ type: "drag" }), e.cancel()), je - Math.abs(t) < -(d() * 2) && e.cancel();
+        }), ve && X ? (B({ type: "drag" }), e.cancel()) : ve && z && (q({ type: "drag" }), e.cancel()), qe - Math.abs(r) < -(l() * 2) && e.cancel();
         return;
       }
-      if (e.last && c && t > 0) {
-        y.start({
+      if (e.last && c && r > 0) {
+        I.start({
           from: {
             val: F()
           },
@@ -374,240 +393,263 @@ function et({
             val: 0
           },
           config: {
-            velocity: e.velocity,
+            velocity: $,
             friction: 50,
             tension: 1e3
           }
         });
         return;
       }
-      e.last && !e.canceled && c && (C.current === "prev" && V({ type: "drag" }), C.current === "next" && D({ type: "drag" })), e.last && !e.canceled && !c && (H ? !u && l.current ? y.start({
-        val: -m(),
+      e.last && !e.canceled && c && (k.current === "prev" && q({ type: "drag" }), k.current === "next" && B({ type: "drag" })), e.last && !e.canceled && !c && (X ? !u && s.current ? I.start({
+        val: -h(),
         config: {
-          ...Y.default,
-          velocity: e.velocity
+          ..._.default,
+          velocity: $
         }
-      }) : D({ type: "drag" }) : B ? !u && s.current ? y.start({
+      }) : B({ type: "drag" }) : z ? !u && d.current ? I.start({
         val: 0,
         config: {
-          ...Y.default,
-          velocity: e.velocity
+          ..._.default,
+          velocity: $
         }
-      }) : V({ type: "drag" }) : y.start({
-        val: a.current,
+      }) : q({ type: "drag" }) : I.start({
+        val: g.current,
         config: {
-          ...Y.default,
-          velocity: e.velocity
+          ..._.default,
+          velocity: $
         }
-      })), e.last && e.canceled && y.start({
-        val: a.current,
+      })), e.last && e.canceled && I.start({
+        val: g.current,
         config: {
-          ...Y.default,
-          velocity: e.velocity
+          ..._.default,
+          velocity: $
         }
       });
     },
     {
-      enabled: v && !ae && !c || !!c && !!pe,
-      axis: i,
+      enabled: v && !me && !c || !!c && !!ce,
+      axis: o,
       from: () => c && f.current ? [
         -f.current.scrollLeft,
         -f.current.scrollTop
-      ] : i === "x" ? [W.val.get(), W.val.get()] : [W.val.get(), W.val.get()]
+      ] : o === "x" ? [P.val.get(), P.val.get()] : [P.val.get(), P.val.get()]
     }
   );
-  function Ne() {
-    return c ? i === "x" ? {
+  function Pe() {
+    return c ? o === "x" ? {
       overflowX: "auto"
     } : {
       overflowY: "auto"
     } : {};
   }
-  function G() {
-    f.current && (a.current = f.current[i === "x" ? "scrollLeft" : "scrollTop"], f.current[i === "x" ? "scrollLeft" : "scrollTop"] === 0 && (s.current = !0, l.current = !1), f.current[i === "x" ? "scrollLeft" : "scrollTop"] > 0 && f.current[i === "x" ? "scrollLeft" : "scrollTop"] < m() && (s.current = !1, l.current = !1), f.current[i === "x" ? "scrollLeft" : "scrollTop"] === m() && (s.current = !1, l.current = !0));
+  function te() {
+    f.current && (g.current = f.current[o === "x" ? "scrollLeft" : "scrollTop"], f.current[o === "x" ? "scrollLeft" : "scrollTop"] === 0 && (d.current = !0, s.current = !1), f.current[o === "x" ? "scrollLeft" : "scrollTop"] > 0 && f.current[o === "x" ? "scrollLeft" : "scrollTop"] < h() && (d.current = !1, s.current = !1), f.current[o === "x" ? "scrollLeft" : "scrollTop"] === h() && (d.current = !1, s.current = !0));
   }
-  function Ee() {
+  function Re() {
     return c ? {
       onWheel() {
-        W.val.stop(), G();
+        P.val.stop(), te();
       }
     } : {};
   }
-  function q(e, r) {
-    let t = 0;
-    if (typeof e == "string" ? t = n.findIndex((o) => o.id === e) : t = e, t < 0 || t >= n.length) {
-      if (r)
-        throw new Error(r);
-      console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`), t = -1;
+  function H(e, t) {
+    let r = 0;
+    if (typeof e == "string" ? r = n.findIndex((i) => i.id === e) : r = e, r < 0 || r >= n.length) {
+      if (t)
+        throw new Error(t);
+      console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`), r = -1;
     }
-    return t;
+    return r;
   }
-  function ie({ id: e, immediate: r, shouldReset: t, type: o }) {
-    if (!v || R.current)
+  function fe({ id: e, immediate: t, shouldReset: r, type: i }) {
+    if (!v || V.current)
       return;
-    s.current = !1, l.current = !1;
-    const T = q(
+    d.current = !1, s.current = !1;
+    const M = H(
       e,
       "The item you want to slide to doesn't exist; check the provided id."
     );
-    if (T === p.current && !t)
+    if (M === p.current && !r)
       return;
-    const B = q(n[p.current].id), H = q(n[T].id);
-    H > B ? D({
-      type: o || t ? "initial" : "click",
-      index: H,
-      immediate: r
-    }) : V({
-      type: o || t ? "initial" : "click",
-      index: H,
-      immediate: r
+    const z = H(n[p.current].id), X = H(n[M].id);
+    X > z ? B({
+      type: i || r ? "initial" : "click",
+      index: X,
+      immediate: t
+    }) : q({
+      type: i || r ? "initial" : "click",
+      index: X,
+      immediate: t
     });
   }
-  function oe(e) {
-    const r = q(e, "The item doesn't exist; check the provided id."), t = p.current;
-    return u && t === n.length - 1 ? r === 0 : r === t + 1;
+  function ae(e) {
+    const t = H(e, "The item doesn't exist; check the provided id."), r = p.current;
+    return u && r === n.length - 1 ? t === 0 : t === r + 1;
   }
-  function le(e) {
-    const r = q(e, "The item doesn't exist; check the provided id."), t = p.current;
-    return u && t === 0 ? r === n.length - 1 : r === t - 1;
+  function de(e) {
+    const t = H(e, "The item doesn't exist; check the provided id."), r = p.current;
+    return u && r === 0 ? t === n.length - 1 : t === r - 1;
   }
-  function se(e) {
-    return q(e, "The item you want to check doesn't exist; check the provided id.") === p.current;
+  function ge(e) {
+    return H(e, "The item you want to check doesn't exist; check the provided id.") === p.current;
   }
-  function We() {
-    return ae ? "unset" : i === "x" ? "pan-y" : "pan-x";
+  function je() {
+    return me ? "unset" : o === "x" ? "pan-y" : "pan-x";
   }
-  const I = c ? {
-    useListenToCustomEvent: Z,
-    enterFullscreen: me,
-    exitFullscreen: ge,
-    getIsFullscreen: ve,
+  const T = c ? {
+    useListenToCustomEvent: ee,
+    enterFullscreen: pe,
+    exitFullscreen: xe,
+    getIsFullscreen: Ie,
     slideToPrevItem: (e = !0) => {
-      V({
+      q({
         type: "click",
         immediate: !e
       });
     },
     slideToNextItem: (e = !0) => {
-      D({
+      B({
         type: "click",
         immediate: !e
       });
     }
   } : {
-    useListenToCustomEvent: Z,
-    enterFullscreen: me,
-    exitFullscreen: ge,
-    getIsFullscreen: ve,
+    useListenToCustomEvent: ee,
+    enterFullscreen: pe,
+    exitFullscreen: xe,
+    getIsFullscreen: Ie,
     slideToPrevItem: (e = !0) => {
-      V({
+      q({
         type: "click",
         immediate: !e
       });
     },
     slideToNextItem: (e = !0) => {
-      D({
+      B({
         type: "click",
         immediate: !e
       });
     },
-    slideToItem: (e, r = !0) => {
-      ie({ id: e, immediate: !r });
+    slideToItem: (e, t = !0) => {
+      fe({ id: e, immediate: !t });
     },
-    getIsNextItem: oe,
-    getIsPrevItem: le,
-    getIsActiveItem: se
+    getIsNextItem: ae,
+    getIsPrevItem: de,
+    getIsActiveItem: ge
   };
-  Be(() => {
-    x.current && v && (z.current = !0, he());
-  }, [v]), N(() => {
-    p.current !== M && (z.current = !0, ie({
-      id: M,
-      immediate: !ye
+  Xe(() => {
+    x.current && v && (K.current = !0, ye());
+  }, [v]), E(() => {
+    p.current !== C && (K.current = !0, fe({
+      id: C,
+      immediate: !Te
     }));
-  }, [M]), N(() => {
+  }, [C]), E(() => {
     if (v) {
-      if (M > n.length - 1)
+      if (C > n.length - 1)
         throw new Error(
-          `initialActiveItem (${M}) is greater than the total quantity available items (${n.length}).`
+          `initialActiveItem (${C}) is greater than the total quantity available items (${n.length}).`
         );
       w > n.length && console.warn(
         `itemsPerSlide (${w}) is greater than the total quantity available items (${n.length}). Fallback to ${n.length})`
       );
     }
-  }, [M, n.length, w, v]), N(() => {
-    ne.current = window.innerWidth;
-  }, []), N(() => {
-    v && (z.current = !0, he());
-  }, [A, w, h, k, v, u]), N(() => {
+  }, [C, n.length, w, v]), E(() => {
+    le.current = window.innerWidth;
+  }, []), E(() => {
+    if (v) {
+      if (u && c)
+        throw new Error("`withLoop` and `freeScroll` can't be used together.");
+      if (c && y === "fixed")
+        throw new Error("`freeScroll` can't be used when `scrollType=fixed`.");
+      if (ce && (y !== "fluid" || !c))
+        throw new Error(
+          "`enableFreeScrollDrag` must be used with `slideType=fluid` and `freeScroll=true`"
+        );
+      if (j && c)
+        throw new Error("`slideGroupOfItems` and `freeScroll` can't be used together.");
+      K.current = !0, ye();
+    }
+  }, [
+    L,
+    w,
+    a,
+    b,
+    v,
+    u,
+    y,
+    c,
+    ce,
+    j
+  ]), E(() => {
     if (!v)
       return;
     function e() {
-      document.hidden ? R.current = !0 : R.current = !1;
+      document.hidden ? V.current = !0 : V.current = !1;
     }
     return document.addEventListener("visibilitychange", e), () => {
       document.removeEventListener("visibilitychange", e);
     };
-  }, [v]), N(() => {
+  }, [v]), E(() => {
     if (f.current) {
       let e;
-      const r = new Ye(() => {
-        if (!R.current && !z.current) {
-          ne.current = window.innerWidth;
-          const t = _();
+      const t = new Qe(() => {
+        if (!V.current && !K.current) {
+          le.current = window.innerWidth;
+          const r = re();
           window.clearTimeout(e), e = setTimeout(() => {
-            re.current = m(), typeof t == "function" && t();
+            se.current = h(), typeof r == "function" && r();
           }, 100);
         }
       });
-      return r.observe(f.current), () => {
-        r.disconnect();
+      return t.observe(f.current), () => {
+        t.disconnect();
       };
     }
-  }, [_, m]), N(() => {
-    S && S({
-      slideToNextItem: I.slideToNextItem,
-      slideToPrevItem: I.slideToPrevItem,
-      slideToItem: I == null ? void 0 : I.slideToItem
+  }, [re, h]), E(() => {
+    ue && ue({
+      slideToNextItem: T.slideToNextItem,
+      slideToPrevItem: T.slideToPrevItem,
+      slideToItem: T == null ? void 0 : T.slideToItem
     });
-  }, [S, I.slideToItem, I.slideToNextItem, I.slideToPrevItem]);
-  const Pe = /* @__PURE__ */ P.jsx(fe.Provider, { value: I, children: Me }), Re = /* @__PURE__ */ P.jsx(fe.Provider, { value: I, children: /* @__PURE__ */ P.jsx(
+  }, [ue, T.slideToItem, T.slideToNextItem, T.slideToPrevItem]);
+  const Ve = /* @__PURE__ */ R.jsx(he.Provider, { value: T, children: ke }), De = /* @__PURE__ */ R.jsx(he.Provider, { value: T, children: /* @__PURE__ */ R.jsx(
     "div",
     {
       className: "use-spring-carousel-main-wrapper",
       ref: f,
-      ...Ee(),
+      ...Re(),
       style: {
         display: "flex",
         position: "relative",
         width: "100%",
         height: "100%",
-        ...Ne()
+        ...Pe()
       },
-      children: /* @__PURE__ */ P.jsxs(
+      children: /* @__PURE__ */ R.jsxs(
         "div",
         {
           className: "use-spring-carousel-track-wrapper",
           ref: x,
-          ...$e(),
+          ...We(),
           style: {
             position: "relative",
             display: "flex",
-            flexDirection: i === "x" ? "row" : "column",
-            touchAction: We(),
-            ...Fe()
+            flexDirection: o === "x" ? "row" : "column",
+            touchAction: je(),
+            ...Ne()
           },
           children: [
-            (c || !u) && h ? /* @__PURE__ */ P.jsx(
+            (c || !u) && a ? /* @__PURE__ */ R.jsx(
               "div",
               {
                 style: {
                   flexShrink: 0,
-                  width: h
+                  width: a
                 }
               }
             ) : null,
-            Q.map((e, r) => /* @__PURE__ */ P.jsx(
+            A.map((e, t) => /* @__PURE__ */ R.jsx(
               "div",
               {
                 className: "use-spring-carousel-item",
@@ -616,27 +658,27 @@ function et({
                   display: "flex",
                   position: "relative",
                   flex: "1",
-                  ...Ce(
-                    r === Q.findIndex(
-                      (t) => t.id === Q[Q.length - 1].id
+                  ...$e(
+                    t === A.findIndex(
+                      (r) => r.id === A[A.length - 1].id
                     )
                   )
                 },
                 children: typeof e.renderItem == "function" ? e.renderItem({
-                  getIsActiveItem: se,
-                  getIsNextItem: oe,
-                  getIsPrevItem: le,
-                  useListenToCustomEvent: Z
+                  getIsActiveItem: ge,
+                  getIsNextItem: ae,
+                  getIsPrevItem: de,
+                  useListenToCustomEvent: ee
                 }) : e.renderItem
               },
-              `${e.id}-${r}`
+              `${e.id}-${t}`
             )),
-            (c || !u) && h ? /* @__PURE__ */ P.jsx(
+            (c || !u) && a ? /* @__PURE__ */ R.jsx(
               "div",
               {
                 style: {
                   flexShrink: 0,
-                  width: h
+                  width: a
                 }
               }
             ) : null
@@ -645,17 +687,17 @@ function et({
       )
     }
   ) });
-  return { ...I, carouselFragment: Re, thumbsFragment: Pe };
+  return { ...T, carouselFragment: De, thumbsFragment: Ve };
 }
-const fe = He(void 0);
-function tt() {
-  const n = ze(fe);
+const he = Je(void 0);
+function nr() {
+  const n = Ke(he);
   if (!n)
     throw new Error("useSpringCarouselContext must be used within the carousel.");
   return n;
 }
 export {
-  et as useSpringCarousel,
-  tt as useSpringCarouselContext
+  tr as useSpringCarousel,
+  nr as useSpringCarouselContext
 };
 //# sourceMappingURL=index.es2.js.map