react-spring-carousel 3.0.0-beta-1.0.0 → 3.0.0-beta-1.0.1

package/dist/react-spring-carousel.js

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