react-spring-carousel 3.0.0-beta-2.0.89 → 3.0.0-beta-2.0.91

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.es.js CHANGED
@@ -4,7 +4,7 @@ import J, { useRef as $, useEffect as M, useState as Mt } from "react";
4
4
  function Vt(e, t, r) {
5
5
  return Math.max(t, Math.min(e, r));
6
6
  }
7
- const b = {
7
+ const _ = {
8
8
  toVector(e, t) {
9
9
  return e === void 0 && (e = t), Array.isArray(e) ? e : [e, e];
10
10
  },
@@ -246,7 +246,7 @@ class te {
246
246
  let o = 0;
247
247
  if (t && (r.event = t, n.preventDefault && t.cancelable && r.event.preventDefault(), r.type = t.type, s.touches = this.ctrl.pointerIds.size || this.ctrl.touchIds.size, s.locked = !!document.pointerLockElement, Object.assign(s, qt(t)), s.down = s.pressed = s.buttons % 2 === 1 || s.touches > 0, o = t.timeStamp - r.timeStamp, r.timeStamp = t.timeStamp, r.elapsedTime = r.timeStamp - r.startTime), r._active) {
248
248
  const f = r._delta.map(Math.abs);
249
- b.addTo(r._distance, f);
249
+ _.addTo(r._distance, f);
250
250
  }
251
251
  this.axisIntent && this.axisIntent(t);
252
252
  const [a, c] = r._movement, [l, h] = n.threshold, {
@@ -254,22 +254,22 @@ class te {
254
254
  values: v
255
255
  } = r;
256
256
  if (n.hasCustomTransform ? (u[0] === !1 && (u[0] = Math.abs(a) >= l && v[0]), u[1] === !1 && (u[1] = Math.abs(c) >= h && v[1])) : (u[0] === !1 && (u[0] = Math.abs(a) >= l && Math.sign(a) * l), u[1] === !1 && (u[1] = Math.abs(c) >= h && Math.sign(c) * h)), r.intentional = u[0] !== !1 || u[1] !== !1, !r.intentional) return;
257
- const m = [0, 0];
257
+ const g = [0, 0];
258
258
  if (n.hasCustomTransform) {
259
259
  const [f, R] = v;
260
- m[0] = u[0] !== !1 ? f - u[0] : 0, m[1] = u[1] !== !1 ? R - u[1] : 0;
260
+ g[0] = u[0] !== !1 ? f - u[0] : 0, g[1] = u[1] !== !1 ? R - u[1] : 0;
261
261
  } else
262
- m[0] = u[0] !== !1 ? a - u[0] : 0, m[1] = u[1] !== !1 ? c - u[1] : 0;
263
- this.restrictToAxis && !r._blocked && this.restrictToAxis(m);
264
- const D = r.offset, _ = r._active && !r._blocked || r.active;
265
- _ && (r.first = r._active && !r.active, r.last = !r._active && r.active, r.active = s[this.ingKey] = r._active, t && (r.first && ("bounds" in n && (r._bounds = z(n.bounds, r)), this.setup && this.setup()), r.movement = m, this.computeOffset()));
266
- const [T, P] = r.offset, [[A, w], [I, k]] = r._bounds;
267
- r.overflow = [T < A ? -1 : T > w ? 1 : 0, P < I ? -1 : P > k ? 1 : 0], r._movementBound[0] = r.overflow[0] ? r._movementBound[0] === !1 ? r._movement[0] : r._movementBound[0] : !1, r._movementBound[1] = r.overflow[1] ? r._movementBound[1] === !1 ? r._movement[1] : r._movementBound[1] : !1;
262
+ g[0] = u[0] !== !1 ? a - u[0] : 0, g[1] = u[1] !== !1 ? c - u[1] : 0;
263
+ this.restrictToAxis && !r._blocked && this.restrictToAxis(g);
264
+ const D = r.offset, w = r._active && !r._blocked || r.active;
265
+ w && (r.first = r._active && !r.active, r.last = !r._active && r.active, r.active = s[this.ingKey] = r._active, t && (r.first && ("bounds" in n && (r._bounds = z(n.bounds, r)), this.setup && this.setup()), r.movement = g, this.computeOffset()));
266
+ const [S, P] = r.offset, [[A, y], [I, k]] = r._bounds;
267
+ r.overflow = [S < A ? -1 : S > y ? 1 : 0, P < I ? -1 : P > k ? 1 : 0], r._movementBound[0] = r.overflow[0] ? r._movementBound[0] === !1 ? r._movement[0] : r._movementBound[0] : !1, r._movementBound[1] = r.overflow[1] ? r._movementBound[1] === !1 ? r._movement[1] : r._movementBound[1] : !1;
268
268
  const V = r._active ? n.rubberband || [0, 0] : [0, 0];
269
- if (r.offset = Rt(r._bounds, r.offset, V), r.delta = b.sub(r.offset, D), this.computeMovement(), _ && (!r.last || o > Zt)) {
270
- r.delta = b.sub(r.offset, D);
269
+ if (r.offset = Rt(r._bounds, r.offset, V), r.delta = _.sub(r.offset, D), this.computeMovement(), w && (!r.last || o > Zt)) {
270
+ r.delta = _.sub(r.offset, D);
271
271
  const f = r.delta.map(Math.abs);
272
- b.addTo(r.distance, f), r.direction = r.delta.map(Math.sign), r._direction = r._delta.map(Math.sign), !r.first && o > 0 && (r.velocity = [f[0] / o, f[1] / o], r.timeDelta = o);
272
+ _.addTo(r.distance, f), r.direction = r.delta.map(Math.sign), r._direction = r._delta.map(Math.sign), !r.first && o > 0 && (r.velocity = [f[0] / o, f[1] / o], r.timeDelta = o);
273
273
  }
274
274
  }
275
275
  emit() {
@@ -302,10 +302,10 @@ class re extends te {
302
302
  this.state.offset = [0, 0], this.state.lastOffset = [0, 0];
303
303
  }
304
304
  computeOffset() {
305
- this.state.offset = b.add(this.state.lastOffset, this.state.movement);
305
+ this.state.offset = _.add(this.state.lastOffset, this.state.movement);
306
306
  }
307
307
  computeMovement() {
308
- this.state.movement = b.sub(this.state.offset, this.state.lastOffset);
308
+ this.state.movement = _.sub(this.state.offset, this.state.lastOffset);
309
309
  }
310
310
  axisIntent(t) {
311
311
  const r = this.state, n = this.config;
@@ -347,12 +347,12 @@ const mt = (e) => e, gt = 0.15, rt = {
347
347
  case !1:
348
348
  return [0, 0];
349
349
  default:
350
- return b.toVector(e);
350
+ return _.toVector(e);
351
351
  }
352
352
  },
353
353
  from(e) {
354
354
  if (typeof e == "function") return e;
355
- if (e != null) return b.toVector(e);
355
+ if (e != null) return _.toVector(e);
356
356
  },
357
357
  transform(e, t, r) {
358
358
  const n = e || r.shared.transform;
@@ -366,7 +366,7 @@ const mt = (e) => e, gt = 0.15, rt = {
366
366
  return n || mt;
367
367
  },
368
368
  threshold(e) {
369
- return b.toVector(e, 0);
369
+ return _.toVector(e, 0);
370
370
  }
371
371
  };
372
372
  process.env.NODE_ENV === "development" && Object.assign(rt, {
@@ -465,7 +465,7 @@ class se extends re {
465
465
  const s = Q(t);
466
466
  if (r._pointerId !== void 0 && s !== r._pointerId) return;
467
467
  const o = ht(t);
468
- if (document.pointerLockElement === t.target ? r._delta = [t.movementX, t.movementY] : (r._delta = b.sub(o, r._values), this.computeValues(o)), b.addTo(r._movement, r._delta), this.compute(t), r._delayed && r.intentional) {
468
+ if (document.pointerLockElement === t.target ? r._delta = [t.movementX, t.movementY] : (r._delta = _.sub(o, r._values), this.computeValues(o)), _.addTo(r._movement, r._delta), this.compute(t), r._delayed && r.intentional) {
469
469
  this.timeoutStore.remove("dragDelay"), r.active = !1, this.startPointerDrag(t);
470
470
  return;
471
471
  }
@@ -498,10 +498,10 @@ class se extends re {
498
498
  if (r.tap = o <= n.tapsThreshold && a <= n.tapsThreshold, r.tap && n.filterTaps)
499
499
  r._force = !0;
500
500
  else {
501
- const [c, l] = r._delta, [h, u] = r._movement, [v, m] = n.swipe.velocity, [D, _] = n.swipe.distance, T = n.swipe.duration;
502
- if (r.elapsedTime < T) {
501
+ const [c, l] = r._delta, [h, u] = r._movement, [v, g] = n.swipe.velocity, [D, w] = n.swipe.distance, S = n.swipe.duration;
502
+ if (r.elapsedTime < S) {
503
503
  const P = Math.abs(c / r.timeDelta), A = Math.abs(l / r.timeDelta);
504
- P > v && Math.abs(h) > D && (r.swipe[0] = Math.sign(c)), A > m && Math.abs(u) > _ && (r.swipe[1] = Math.sign(l));
504
+ P > v && Math.abs(h) > D && (r.swipe[0] = Math.sign(c)), A > g && Math.abs(u) > w && (r.swipe[1] = Math.sign(l));
505
505
  }
506
506
  }
507
507
  this.emit();
@@ -543,7 +543,7 @@ class se extends re {
543
543
  const r = vt[t.key];
544
544
  if (r) {
545
545
  const n = this.state, s = t.shiftKey ? 10 : t.altKey ? 0.1 : 1;
546
- this.start(t), n._delta = r(this.config.keyboardDisplacement, s), n._keyboardActive = !0, b.addTo(n._movement, n._delta), this.compute(t), this.emit();
546
+ this.start(t), n._delta = r(this.config.keyboardDisplacement, s), n._keyboardActive = !0, _.addTo(n._movement, n._delta), this.compute(t), this.emit();
547
547
  }
548
548
  }
549
549
  keyUp(t) {
@@ -621,7 +621,7 @@ const O = {
621
621
  tapsThreshold: n = 3,
622
622
  axis: s = void 0
623
623
  }) {
624
- const o = b.toVector(e, r ? n : s ? 1 : 0);
624
+ const o = _.toVector(e, r ? n : s ? 1 : 0);
625
625
  return this.filterTaps = r, this.tapsThreshold = n, o;
626
626
  },
627
627
  swipe({
@@ -630,8 +630,8 @@ const O = {
630
630
  duration: r = pe
631
631
  } = {}) {
632
632
  return {
633
- velocity: this.transform(b.toVector(e)),
634
- distance: this.transform(b.toVector(t)),
633
+ velocity: this.transform(_.toVector(e)),
634
+ distance: this.transform(_.toVector(t)),
635
635
  duration: r
636
636
  };
637
637
  },
@@ -713,7 +713,7 @@ p(p({}, rt), {}, {
713
713
  return typeof r != "function" && typeof n != "function" ? [s(), o()] : (a) => [s(a), o(a)];
714
714
  },
715
715
  threshold(e, t, r) {
716
- return this.lockDirection = r.axis === "lock", b.toVector(e, this.lockDirection ? [0.1, 3] : 0);
716
+ return this.lockDirection = r.axis === "lock", _.toVector(e, this.lockDirection ? [0.1, 3] : 0);
717
717
  },
718
718
  modifierKey(e) {
719
719
  return e === void 0 ? "ctrlKey" : e;
@@ -939,8 +939,8 @@ function xe(e, t) {
939
939
  const bt = (e, t, r) => (n, s, o, a = {}, c = !1) => {
940
940
  var l, h;
941
941
  const u = (l = a.capture) !== null && l !== void 0 ? l : t.capture, v = (h = a.passive) !== null && h !== void 0 ? h : t.passive;
942
- let m = c ? n : Gt(n, s, u);
943
- r && v && (m += "Passive"), e[m] = e[m] || [], e[m].push(o);
942
+ let g = c ? n : Gt(n, s, u);
943
+ r && v && (g += "Passive"), e[g] = e[g] || [], e[g].push(o);
944
944
  };
945
945
  function Ie(e, t = {}, r, n) {
946
946
  const s = J.useMemo(() => new Se(e), []);
@@ -1003,7 +1003,7 @@ function Le({
1003
1003
  onInit: u,
1004
1004
  initialActiveItem: v = 0
1005
1005
  }) {
1006
- const [m, D] = Mt(!1), _ = $(e), T = $(null), P = $(null), A = $(0), w = $(0), I = $(!r), k = $(!1), V = $(0), f = $(0), [R, Y] = wt(
1006
+ const [g, D] = Mt(!1), w = $(e), S = $(null), P = $(null), A = $(0), y = $(0), I = $(!r), k = $(!1), V = $(0), f = $(0), [R, Y] = wt(
1007
1007
  () => ({
1008
1008
  value: 0,
1009
1009
  onChange({ value: i }) {
@@ -1032,23 +1032,23 @@ function Le({
1032
1032
  return i;
1033
1033
  }
1034
1034
  function $t() {
1035
- if (T.current) {
1035
+ if (S.current) {
1036
1036
  const d = window.getComputedStyle(
1037
- T.current
1037
+ S.current
1038
1038
  ).getPropertyValue(`--${n}-items-per-slide`).trim();
1039
1039
  return Number(d) || 1;
1040
1040
  }
1041
1041
  return 1;
1042
1042
  }
1043
1043
  function F(i) {
1044
- _.current && (k.current || N({
1044
+ w.current && (k.current || N({
1045
1045
  type: "next",
1046
1046
  toIndex: i,
1047
1047
  actionType: "click"
1048
1048
  }));
1049
1049
  }
1050
1050
  function H(i) {
1051
- _.current && (I.current || N({
1051
+ w.current && (I.current || N({
1052
1052
  type: "prev",
1053
1053
  toIndex: i,
1054
1054
  actionType: "click"
@@ -1057,20 +1057,20 @@ function Le({
1057
1057
  function N({
1058
1058
  type: i,
1059
1059
  shouldAnimate: d = !0,
1060
- toIndex: y,
1060
+ toIndex: b,
1061
1061
  actionType: E
1062
1062
  }) {
1063
1063
  var ot, at;
1064
- const S = !d;
1064
+ const T = !d;
1065
1065
  I.current = !1, k.current = !1;
1066
- let g = R.value.get(), C = 0;
1067
- if (i === "next" && (f.current += 1), i === "prev" && (f.current === 0 ? f.current = t.length - 1 : f.current -= 1), y !== void 0 && (f.current = y), i === "next") {
1066
+ let m = R.value.get(), C = 0;
1067
+ if (i === "next" && (f.current += 1), i === "prev" && (f.current === 0 ? f.current = t.length - 1 : f.current -= 1), b !== void 0 && (f.current = b), i === "next") {
1068
1068
  const K = X(
1069
- r ? w.current * (t.length * 2) : 0
1069
+ r ? y.current * (t.length * 2) : 0
1070
1070
  );
1071
- C = -(f.current * w.current), r && f.current === t.length && (f.current = 0, g = g + w.current * t.length, C = 0), !r && (Math.abs(C) >= K || f.current === t.length - 1) && (k.current = !0, C = -K);
1071
+ C = -(f.current * y.current), r && f.current === t.length && (f.current = 0, m = m + y.current * t.length, C = 0), !r && (Math.abs(C) >= K || f.current === t.length - 1) && (k.current = !0, C = -K);
1072
1072
  }
1073
- i === "prev" && (C = -(f.current * w.current), f.current === t.length - 1 && (g = g - t.length * w.current), !r && C >= 0 && (I.current = !0, C = 0)), A.current = C, E === "resize" ? (C = -(f.current * w.current), U({
1073
+ i === "prev" && (C = -(f.current * y.current), f.current === t.length - 1 && (m = m - t.length * y.current), !r && C >= 0 && (I.current = !0, C = 0)), A.current = C, E === "resize" ? (C = -(f.current * y.current), U({
1074
1074
  eventName: "onResize",
1075
1075
  sliceActionType: E,
1076
1076
  slideDirection: i,
@@ -1091,9 +1091,9 @@ function Le({
1091
1091
  endReached: k.current
1092
1092
  }
1093
1093
  }), Y.start({
1094
- immediate: S,
1094
+ immediate: T,
1095
1095
  from: {
1096
- value: g
1096
+ value: m
1097
1097
  },
1098
1098
  to: {
1099
1099
  value: C
@@ -1125,50 +1125,51 @@ function Le({
1125
1125
  }
1126
1126
  function st() {
1127
1127
  let i = 0, d = 0;
1128
- if (T.current) {
1129
- const y = window.getComputedStyle(
1130
- T.current
1131
- ), E = y.getPropertyValue(`--${n}-start-end-gutter`).trim();
1128
+ if (S.current) {
1129
+ const b = window.getComputedStyle(
1130
+ S.current
1131
+ ), E = b.getPropertyValue(`--${n}-start-end-gutter`).trim();
1132
1132
  E.includes("px") && (i = Number(
1133
1133
  E.replace("px", "")
1134
1134
  ));
1135
- const S = y.getPropertyValue(`--${n}-gutter`).trim();
1136
- S.includes("px") && (d = Number(S.replace("px", "")));
1135
+ const T = b.getPropertyValue(`--${n}-gutter`).trim();
1136
+ T.includes("px") && (d = Number(T.replace("px", "")));
1137
1137
  }
1138
1138
  return { totalStartEndGutterCssVar: i, totalGutterCssVar: d };
1139
1139
  }
1140
1140
  M(() => {
1141
- function i(S) {
1142
- const g = $t();
1143
- switch (S) {
1141
+ function i(T) {
1142
+ const m = $t();
1143
+ switch (T) {
1144
1144
  case "start":
1145
1145
  return 0;
1146
1146
  case "middle-start":
1147
- return Math.floor((g - 1) * 0.25);
1147
+ return Math.floor((m - 1) * 0.25);
1148
1148
  case "center":
1149
- return Math.floor((g - 1) * 0.5);
1149
+ return Math.floor((m - 1) * 0.5);
1150
1150
  case "middle-end":
1151
- return Math.floor((g - 1) * 0.75);
1151
+ return Math.floor((m - 1) * 0.75);
1152
1152
  case "end":
1153
- return g - 1;
1153
+ return m - 1;
1154
1154
  default:
1155
1155
  return 0;
1156
1156
  }
1157
1157
  }
1158
1158
  function d() {
1159
- w.current = Ot(), V.current = w.current / 4;
1160
- const { totalStartEndGutterCssVar: S } = st();
1161
- let g = 0;
1162
- r && (g = w.current * t.length), g -= w.current * i(c), g -= S / 2, T.current.style.setProperty(
1159
+ y.current = Ot(), console.log("scrollAmountValue", y.current), V.current = y.current / 4;
1160
+ const { totalStartEndGutterCssVar: T } = st();
1161
+ console.log({ totalStartEndGutterCssVar: T });
1162
+ let m = 0;
1163
+ r && (m = y.current * t.length), console.log({ offset: m }), m -= y.current * i(c), console.log({ offset: m }), m -= T / 2, console.log({ offset: m }), S.current.style.setProperty(
1163
1164
  `--${n}-offset-modifier`,
1164
- `${-g}px`
1165
+ `${-m}px`
1165
1166
  );
1166
1167
  }
1167
- function y(S) {
1168
- T.current && (d(), D(!0), S && S());
1168
+ function b(T) {
1169
+ S.current && (d(), D(!0), T && T());
1169
1170
  }
1170
1171
  function E() {
1171
- y(), N({
1172
+ b(), N({
1172
1173
  type: "resize",
1173
1174
  toIndex: f.current,
1174
1175
  shouldAnimate: !1,
@@ -1176,7 +1177,7 @@ function Le({
1176
1177
  });
1177
1178
  }
1178
1179
  if (e)
1179
- return _.current = !0, y(u), window.addEventListener("resize", E), () => {
1180
+ return w.current = !0, b(u), window.addEventListener("resize", E), () => {
1180
1181
  window.removeEventListener("resize", E);
1181
1182
  };
1182
1183
  }, [e, r, n, a, s, c]), M(() => {
@@ -1189,23 +1190,23 @@ function Le({
1189
1190
  }, [e, v]);
1190
1191
  const it = l, At = ke(
1191
1192
  (i) => {
1192
- if (!_.current)
1193
+ if (!w.current)
1193
1194
  return;
1194
- const d = i.dragging, y = i.offset[a === "x" ? 0 : 1], E = i.movement[a === "x" ? 0 : 1], S = E > V.current, g = E < -V.current, C = i.velocity;
1195
+ const d = i.dragging, b = i.offset[a === "x" ? 0 : 1], E = i.movement[a === "x" ? 0 : 1], T = E > V.current, m = E < -V.current, C = i.velocity;
1195
1196
  d && (U({
1196
1197
  ...i,
1197
1198
  eventName: "onDrag",
1198
1199
  slideActionType: "drag"
1199
1200
  }), Y.start({
1200
- value: y,
1201
+ value: b,
1201
1202
  immediate: !0,
1202
1203
  config: {
1203
1204
  velocity: C
1204
1205
  }
1205
- }), h && (S || g) && i.cancel()), i.last && (S ? (N({
1206
+ }), h && (T || m) && i.cancel()), i.last && (T ? (N({
1206
1207
  actionType: "drag",
1207
1208
  type: "prev"
1208
- }), i.cancel()) : g ? (N({
1209
+ }), i.cancel()) : m ? (N({
1209
1210
  actionType: "drag",
1210
1211
  type: "next"
1211
1212
  }), i.cancel()) : (Y.start({
@@ -1231,14 +1232,14 @@ function Le({
1231
1232
  }
1232
1233
  );
1233
1234
  function Nt(i) {
1234
- var d, y;
1235
- return typeof i == "number" ? f.current === i : ((d = t.find((E) => E.id === i)) == null ? void 0 : d.id) === ((y = t[f.current]) == null ? void 0 : y.id);
1235
+ var d, b;
1236
+ return typeof i == "number" ? f.current === i : ((d = t.find((E) => E.id === i)) == null ? void 0 : d.id) === ((b = t[f.current]) == null ? void 0 : b.id);
1236
1237
  }
1237
1238
  return {
1238
1239
  carouselFragment: /* @__PURE__ */ Lt(
1239
1240
  "div",
1240
1241
  {
1241
- ref: T,
1242
+ ref: S,
1242
1243
  className: "ReactSpringCarouselContainer",
1243
1244
  "data-part": "Container",
1244
1245
  "data-part-internal": `${n}-Container`,
@@ -1267,8 +1268,8 @@ function Le({
1267
1268
  display: flex;
1268
1269
  position: relative;
1269
1270
  --initial-offset-modifier: calc(calc(-100% - var(--${n}-gutter) + calc(var(--${n}-start-end-gutter) / 2 / ${t.length} * var(--${n}-items-per-slide)) + var(--${n}-start-end-gutter)) * ${t.length} / var(--${n}-items-per-slide));
1270
- left: ${r && a === "x" && !m ? "var(--initial-offset-modifier)" : "0px"};
1271
- top: ${r && a === "y" && !m ? "var(--initial-offset-modifier)" : "0px"};
1271
+ left: ${r && a === "x" && !g ? "var(--initial-offset-modifier)" : "0px"};
1272
+ top: ${r && a === "y" && !g ? "var(--initial-offset-modifier)" : "0px"};
1272
1273
  flex-direction: ${a === "x" ? "row" : "column"};
1273
1274
  width: 100%;
1274
1275
  height: 100%;
@@ -1347,7 +1348,7 @@ function Le({
1347
1348
  i > f.current ? F(i) : H(i);
1348
1349
  }
1349
1350
  if (typeof i == "string") {
1350
- const d = t.findIndex((y) => y.id === i);
1351
+ const d = t.findIndex((b) => b.id === i);
1351
1352
  if (d < 0) {
1352
1353
  console.warn(
1353
1354
  `The item you're trying to slide doesn't exist. id: ${i}`
@@ -1400,12 +1401,12 @@ function Me({ container: e, onReach: t }) {
1400
1401
  }
1401
1402
  return M(() => {
1402
1403
  function c() {
1403
- var w;
1404
- const D = tt(e.current), _ = ((w = [...e.current.children].at(0)) == null ? void 0 : w.getBoundingClientRect().width) || 0, T = Array(e.current.childElementCount).fill(0).map((I, k) => ({
1404
+ var y;
1405
+ const D = tt(e.current), w = ((y = [...e.current.children].at(0)) == null ? void 0 : y.getBoundingClientRect().width) || 0, S = Array(e.current.childElementCount).fill(0).map((I, k) => ({
1405
1406
  index: k,
1406
1407
  start: D * k,
1407
1408
  end: D * (k + 1)
1408
- })), P = e.current.scrollLeft + _, A = T.find(
1409
+ })), P = e.current.scrollLeft + w, A = S.find(
1409
1410
  (I) => P >= I.start && P < I.end
1410
1411
  );
1411
1412
  n.current = (A == null ? void 0 : A.index) || 0;
@@ -1414,11 +1415,11 @@ function Me({ container: e, onReach: t }) {
1414
1415
  s.stop();
1415
1416
  }
1416
1417
  function h(D) {
1417
- const _ = D.target;
1418
- _.scrollLeft === 0 ? (n.current = 0, r.current = "start", t && t("start")) : _.scrollLeft >= _t(_) ? (r.current = "end", t && t("end")) : r.current !== "idle" && (r.current = "idle", t && t("idle"));
1418
+ const w = D.target;
1419
+ w.scrollLeft === 0 ? (n.current = 0, r.current = "start", t && t("start")) : w.scrollLeft >= _t(w) ? (r.current = "end", t && t("end")) : r.current !== "idle" && (r.current = "idle", t && t("idle"));
1419
1420
  }
1420
1421
  let u, v = 0;
1421
- function m() {
1422
+ function g() {
1422
1423
  v = e.current.scrollLeft, clearTimeout(u), u = setTimeout(function() {
1423
1424
  e.current.scrollLeft === v && c();
1424
1425
  }, 200);
@@ -1426,8 +1427,8 @@ function Me({ container: e, onReach: t }) {
1426
1427
  if (e.current)
1427
1428
  return e.current.addEventListener("wheel", l, {
1428
1429
  passive: !0
1429
- }), e.current.addEventListener("scroll", h), e.current.addEventListener("scroll", m), () => {
1430
- e.current && (e.current.removeEventListener("scroll", m), e.current.removeEventListener("scroll", h), e.current.removeEventListener("wheel", l));
1430
+ }), e.current.addEventListener("scroll", h), e.current.addEventListener("scroll", g), () => {
1431
+ e.current && (e.current.removeEventListener("scroll", g), e.current.removeEventListener("scroll", h), e.current.removeEventListener("wheel", l));
1431
1432
  };
1432
1433
  }, [e, t]), M(() => {
1433
1434
  if (e.current) {
package/dist/index.umd.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(A,L){typeof exports=="object"&&typeof module<"u"?L(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],L):(A=typeof globalThis<"u"?globalThis:A||self,L(A["react-spring-carousel"]={},A["react/jsx-runtime"],A["@react-spring/web"],A.React))})(this,function(A,L,re,m){"use strict";function Ce(t,e,r){return Math.max(e,Math.min(t,r))}const b={toVector(t,e){return t===void 0&&(t=e),Array.isArray(t)?t:[t,t]},add(t,e){return[t[0]+e[0],t[1]+e[1]]},sub(t,e){return[t[0]-e[0],t[1]-e[1]]},addTo(t,e){t[0]+=e[0],t[1]+=e[1]},subTo(t,e){t[0]-=e[0],t[1]-=e[1]}};function ne(t,e,r){return e===0||Math.abs(e)===1/0?Math.pow(t,r*5):t*e*r/(e+r*t)}function se(t,e,r,n=.15){return n===0?Ce(t,e,r):t<e?-ne(e-t,r-e,n)+e:t>r?+ne(t-r,r-e,n)+r:t}function De(t,[e,r],[n,s]){const[[o,a],[c,l]]=t;return[se(e,o,a,n),se(r,c,l,s)]}function Pe(t,e){if(typeof t!="object"||t===null)return t;var r=t[Symbol.toPrimitive];if(r!==void 0){var n=r.call(t,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(t)}function $e(t){var e=Pe(t,"string");return typeof e=="symbol"?e:String(e)}function S(t,e,r){return e=$e(e),e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function ie(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(t,s).enumerable})),r.push.apply(r,n)}return r}function p(t){for(var e=1;e<arguments.length;e++){var r=arguments[e]!=null?arguments[e]:{};e%2?ie(Object(r),!0).forEach(function(n){S(t,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ie(Object(r)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(r,n))})}return t}const oe={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 ae(t){return t?t[0].toUpperCase()+t.slice(1):""}const Oe=["enter","leave"];function Ae(t=!1,e){return t&&!Oe.includes(e)}function Ne(t,e="",r=!1){const n=oe[t],s=n&&n[e]||e;return"on"+ae(t)+ae(s)+(Ae(r,s)?"Capture":"")}const Le=["gotpointercapture","lostpointercapture"];function Me(t){let e=t.substring(2).toLowerCase();const r=!!~e.indexOf("passive");r&&(e=e.replace("passive",""));const n=Le.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:r}}function Ve(t,e=""){const r=oe[t],n=r&&r[e]||e;return t+n}function K(t){return"touches"in t}function ce(t){return K(t)?"touch":"pointerType"in t?t.pointerType:"mouse"}function je(t){return Array.from(t.touches).filter(e=>{var r,n;return e.target===t.currentTarget||((r=t.currentTarget)===null||r===void 0||(n=r.contains)===null||n===void 0?void 0:n.call(r,e.target))})}function Be(t){return t.type==="touchend"||t.type==="touchcancel"?t.changedTouches:t.targetTouches}function ue(t){return K(t)?Be(t)[0]:t}function Re(t){return je(t).map(e=>e.identifier)}function F(t){const e=ue(t);return K(t)?e.identifier:e.pointerId}function le(t){const e=ue(t);return[e.clientX,e.clientY]}function Ue(t){const e={};if("buttons"in t&&(e.buttons=t.buttons),"shiftKey"in t){const{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o}=t;Object.assign(e,{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o})}return e}function G(t,...e){return typeof t=="function"?t(...e):t}function Ke(){}function Ge(...t){return t.length===0?Ke:t.length===1?t[0]:function(){let e;for(const r of t)e=r.apply(this,arguments)||e;return e}}function fe(t,e){return Object.assign({},e,t||{})}const ze=32;class We{constructor(e,r,n){this.ctrl=e,this.args=r,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:r,ingKey:n,args:s}=this;r[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=s,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const r=this.state,n=this.config;r._active||(this.reset(),this.computeInitial(),r._active=!0,r.target=e.target,r.currentTarget=e.currentTarget,r.lastOffset=n.from?G(n.from,r):r.offset,r.offset=r.lastOffset,r.startTime=r.timeStamp=e.timeStamp)}computeValues(e){const r=this.state;r._values=e,r.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:r,config:n,shared:s}=this;r.args=this.args;let o=0;if(e&&(r.event=e,n.preventDefault&&e.cancelable&&r.event.preventDefault(),r.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ue(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-r.timeStamp,r.timeStamp=e.timeStamp,r.elapsedTime=r.timeStamp-r.startTime),r._active){const f=r._delta.map(Math.abs);b.addTo(r._distance,f)}this.axisIntent&&this.axisIntent(e);const[a,c]=r._movement,[l,h]=n.threshold,{_step:u,values:y}=r;if(n.hasCustomTransform?(u[0]===!1&&(u[0]=Math.abs(a)>=l&&y[0]),u[1]===!1&&(u[1]=Math.abs(c)>=h&&y[1])):(u[0]===!1&&(u[0]=Math.abs(a)>=l&&Math.sign(a)*l),u[1]===!1&&(u[1]=Math.abs(c)>=h&&Math.sign(c)*h)),r.intentional=u[0]!==!1||u[1]!==!1,!r.intentional)return;const g=[0,0];if(n.hasCustomTransform){const[f,U]=y;g[0]=u[0]!==!1?f-u[0]:0,g[1]=u[1]!==!1?U-u[1]:0}else g[0]=u[0]!==!1?a-u[0]:0,g[1]=u[1]!==!1?c-u[1]:0;this.restrictToAxis&&!r._blocked&&this.restrictToAxis(g);const $=r.offset,w=r._active&&!r._blocked||r.active;w&&(r.first=r._active&&!r.active,r.last=!r._active&&r.active,r.active=s[this.ingKey]=r._active,e&&(r.first&&("bounds"in n&&(r._bounds=G(n.bounds,r)),this.setup&&this.setup()),r.movement=g,this.computeOffset()));const[x,O]=r.offset,[[N,E],[k,C]]=r._bounds;r.overflow=[x<N?-1:x>E?1:0,O<k?-1:O>C?1:0],r._movementBound[0]=r.overflow[0]?r._movementBound[0]===!1?r._movement[0]:r._movementBound[0]:!1,r._movementBound[1]=r.overflow[1]?r._movementBound[1]===!1?r._movement[1]:r._movementBound[1]:!1;const R=r._active?n.rubberband||[0,0]:[0,0];if(r.offset=De(r._bounds,r.offset,R),r.delta=b.sub(r.offset,$),this.computeMovement(),w&&(!r.last||o>ze)){r.delta=b.sub(r.offset,$);const f=r.delta.map(Math.abs);b.addTo(r.distance,f),r.direction=r.delta.map(Math.sign),r._direction=r._delta.map(Math.sign),!r.first&&o>0&&(r.velocity=[f[0]/o,f[1]/o],r.timeDelta=o)}}emit(){const e=this.state,r=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(p(p(p({},r),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Ye([t,e],r){const n=Math.abs(t),s=Math.abs(e);if(n>s&&n>r)return"x";if(s>n&&s>r)return"y"}class Fe extends We{constructor(...e){super(...e),S(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=b.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=b.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const r=this.state,n=this.config;if(!r.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ce(e)]:n.axisThreshold;r.axis=Ye(r._movement,s)}r._blocked=(n.lockDirection||!!n.axis)&&!r.axis||!!n.axis&&n.axis!==r.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const de=t=>t,he=.15,H={enabled(t=!0){return t},eventOptions(t,e,r){return p(p({},r.shared.eventOptions),t)},preventDefault(t=!1){return t},triggerAllEvents(t=!1){return t},rubberband(t=0){switch(t){case!0:return[he,he];case!1:return[0,0];default:return b.toVector(t)}},from(t){if(typeof t=="function")return t;if(t!=null)return b.toVector(t)},transform(t,e,r){const n=t||r.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||de;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||de},threshold(t){return b.toVector(t,0)}};process.env.NODE_ENV==="development"&&Object.assign(H,{domTarget(t){if(t!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(t){if(t!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(t){if(t!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const He=0,j=p(p({},H),{},{axis(t,e,{axis:r}){if(this.lockDirection=r==="lock",!this.lockDirection)return r},axisThreshold(t=He){return t},bounds(t={}){if(typeof t=="function")return o=>j.bounds(t(o));if("current"in t)return()=>t.current;if(typeof HTMLElement=="function"&&t instanceof HTMLElement)return t;const{left:e=-1/0,right:r=1/0,top:n=-1/0,bottom:s=1/0}=t;return[[e,r],[n,s]]}}),pe={ArrowRight:(t,e=1)=>[t*e,0],ArrowLeft:(t,e=1)=>[-1*t*e,0],ArrowUp:(t,e=1)=>[0,-1*t*e],ArrowDown:(t,e=1)=>[0,t*e]};class Xe extends Fe{constructor(...e){super(...e),S(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const r=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:r.left-n.left+e.offset[0],right:r.right-n.right+e.offset[0],top:r.top-n.top+e.offset[1],bottom:r.bottom-n.bottom+e.offset[1]};e._bounds=j.bounds(s)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const r=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(r.pointerButtons)?!r.pointerButtons.includes(e.buttons):r.pointerButtons!==-1&&r.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);r.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=F(e),n._pointerActive=!0,this.computeValues(le(e)),this.computeInitial(),r.preventScrollAxis&&ce(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):r.delay>0?(this.setupDelayTrigger(e),r.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const r=this.state;r._active=!0,r._preventScroll=!0,r._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const r=this.state,n=this.config;if(!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;const o=le(e);if(document.pointerLockElement===e.target?r._delta=[e.movementX,e.movementY]:(r._delta=b.sub(o,r._values),this.computeValues(o)),b.addTo(r._movement,r._delta),this.compute(e),r._delayed&&r.intentional){this.timeoutStore.remove("dragDelay"),r.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!r._preventScroll)if(r.axis)if(r.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){r._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const r=this.state,n=this.config;if(!r._active||!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=r._distance;if(r.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,r.tap&&n.filterTaps)r._force=!0;else{const[c,l]=r._delta,[h,u]=r._movement,[y,g]=n.swipe.velocity,[$,w]=n.swipe.distance,x=n.swipe.duration;if(r.elapsedTime<x){const O=Math.abs(c/r.timeDelta),N=Math.abs(l/r.timeDelta);O>y&&Math.abs(h)>$&&(r.swipe[0]=Math.sign(c)),N>g&&Math.abs(u)>w&&(r.swipe[1]=Math.sign(l))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const r=this.config,n=r.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&r.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",s)}}catch{}r.pointerLock&&e.currentTarget.requestPointerLock(),r.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,qe(e);const r=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",r),this.eventStore.add(this.sharedConfig.window,"touch","cancel",r),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const r=pe[e.key];if(r){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=r(this.config.keyboardDisplacement,s),n._keyboardActive=!0,b.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in pe&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const r=this.config.device;e(r,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(r,"change",this.pointerMove.bind(this)),e(r,"end",this.pointerUp.bind(this)),e(r,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function qe(t){"persist"in t&&typeof t.persist=="function"&&t.persist()}const B=typeof window<"u"&&window.document&&window.document.createElement;function me(){return B&&"ontouchstart"in window}function Je(){return me()||B&&window.navigator.maxTouchPoints>1}function Qe(){return B&&"onpointerdown"in window}function Ze(){return B&&"exitPointerLock"in window.document}function et(){try{return"constructor"in GestureEvent}catch{return!1}}const P={isBrowser:B,gesture:et(),touch:me(),touchscreen:Je(),pointer:Qe(),pointerLock:Ze()},tt=250,rt=180,nt=.5,st=50,it=250,ot=10,ge={mouse:0,touch:0,pen:8},ve=p(p({},j),{},{device(t,e,{pointer:{touch:r=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&P.pointerLock,P.touch&&r?"touch":this.pointerLock?"mouse":P.pointer&&!s?"pointer":P.touch?"touch":"mouse"},preventScrollAxis(t,e,{preventScroll:r}){if(this.preventScrollDelay=typeof r=="number"?r:r||r===void 0&&t?tt:void 0,!(!P.touchscreen||r===!1))return t||(r!==void 0?"y":void 0)},pointerCapture(t,e,{pointer:{capture:r=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&r},threshold(t,e,{filterTaps:r=!1,tapsThreshold:n=3,axis:s=void 0}){const o=b.toVector(t,r?n:s?1:0);return this.filterTaps=r,this.tapsThreshold=n,o},swipe({velocity:t=nt,distance:e=st,duration:r=it}={}){return{velocity:this.transform(b.toVector(t)),distance:this.transform(b.toVector(e)),duration:r}},delay(t=0){switch(t){case!0:return rt;case!1:return 0;default:return t}},axisThreshold(t){return t?p(p({},ge),t):ge},keyboardDisplacement(t=ot){return t}});process.env.NODE_ENV==="development"&&Object.assign(ve,{useTouch(t){if(t!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(t){if(t!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),p(p({},H),{},{device(t,e,{shared:r,pointer:{touch:n=!1}={}}){if(r.target&&!P.touch&&P.gesture)return"gesture";if(P.touch&&n)return"touch";if(P.touchscreen){if(P.pointer)return"pointer";if(P.touch)return"touch"}},bounds(t,e,{scaleBounds:r={},angleBounds:n={}}){const s=a=>{const c=fe(G(r,a),{min:-1/0,max:1/0});return[c.min,c.max]},o=a=>{const c=fe(G(n,a),{min:-1/0,max:1/0});return[c.min,c.max]};return typeof r!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(t,e,r){return this.lockDirection=r.axis==="lock",b.toVector(t,this.lockDirection?[.1,3]:0)},modifierKey(t){return t===void 0?"ctrlKey":t},pinchOnWheel(t=!0){return t}}),p(p({},j),{},{mouseOnly:(t=!0)=>t}),p(p({},j),{},{mouseOnly:(t=!0)=>t});const ye=new Map,X=new Map;function at(t){ye.set(t.key,t.engine),X.set(t.key,t.resolver)}const ct={key:"drag",engine:Xe,resolver:ve};function ut(t,e){if(t==null)return{};var r={},n=Object.keys(t),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(r[s]=t[s]);return r}function lt(t,e){if(t==null)return{};var r=ut(t,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}const ft={target(t){if(t)return()=>"current"in t?t.current:t},enabled(t=!0){return t},window(t=P.isBrowser?window:void 0){return t},eventOptions({passive:t=!0,capture:e=!1}={}){return{passive:t,capture:e}},transform(t){return t}},dt=["target","eventOptions","window","enabled","transform"];function z(t={},e){const r={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(r,t[n],n,t);Number.isNaN(o)||(r[n]=o)}else r[n]=s.call(r,t[n],n,t);break;case"object":r[n]=z(t[n],s);break;case"boolean":s&&(r[n]=t[n]);break}return r}function ht(t,e,r={}){const n=t,{target:s,eventOptions:o,window:a,enabled:c,transform:l}=n,h=lt(n,dt);if(r.shared=z({target:s,eventOptions:o,window:a,enabled:c,transform:l},ft),e){const u=X.get(e);r[e]=z(p({shared:r.shared},h),u)}else for(const u in h){const y=X.get(u);if(y)r[u]=z(p({shared:r.shared},h[u]),y);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(u)){if(u==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${u}\` was used. Please read the documentation for further information.`)}}return r}class be{constructor(e,r){S(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=r}add(e,r,n,s,o){const a=this._listeners,c=Ve(r,n),l=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},h=p(p({},l),o);e.addEventListener(c,s,h);const u=()=>{e.removeEventListener(c,s,h),a.delete(u)};return a.add(u),u}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class pt{constructor(){S(this,"_timeouts",new Map)}add(e,r,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(r,n,...s))}remove(e){const r=this._timeouts.get(e);r&&window.clearTimeout(r)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class mt{constructor(e){S(this,"gestures",new Set),S(this,"_targetEventStore",new be(this)),S(this,"gestureEventStores",{}),S(this,"gestureTimeoutStores",{}),S(this,"handlers",{}),S(this,"config",{}),S(this,"pointerIds",new Set),S(this,"touchIds",new Set),S(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),gt(this,e)}setEventIds(e){if(K(e))return this.touchIds=new Set(Re(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,r){this.handlers=e,this.nativeHandlers=r}applyConfig(e,r){this.config=ht(e,r,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const r=this.config.shared,n={};let s;if(!(r.target&&(s=r.target(),!s))){if(r.enabled){for(const a of this.gestures){const c=this.config[a],l=_e(n,c.eventOptions,!!s);if(c.enabled){const h=ye.get(a);new h(this,e,a).bind(l)}}const o=_e(n,r.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",c=>this.nativeHandlers[a](p(p({},this.state.shared),{},{event:c,args:e})),void 0,!0)}for(const o in n)n[o]=Ge(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:c,passive:l}=Me(o);this._targetEventStore.add(s,a,"",n[o],{capture:c,passive:l})}}}}function M(t,e){t.gestures.add(e),t.gestureEventStores[e]=new be(t,e),t.gestureTimeoutStores[e]=new pt}function gt(t,e){e.drag&&M(t,"drag"),e.wheel&&M(t,"wheel"),e.scroll&&M(t,"scroll"),e.move&&M(t,"move"),e.pinch&&M(t,"pinch"),e.hover&&M(t,"hover")}const _e=(t,e,r)=>(n,s,o,a={},c=!1)=>{var l,h;const u=(l=a.capture)!==null&&l!==void 0?l:e.capture,y=(h=a.passive)!==null&&h!==void 0?h:e.passive;let g=c?n:Ne(n,s,u);r&&y&&(g+="Passive"),t[g]=t[g]||[],t[g].push(o)};function vt(t,e={},r,n){const s=m.useMemo(()=>new mt(t),[]);if(s.applyHandlers(t,n),s.applyConfig(e,r),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function yt(t,e){return at(ct),vt({drag:t},e||{},"drag")}const q="RSC::Event";function bt(){const t=m.useRef(null);function e(n){m.useEffect(()=>{t.current||(t.current=document.createElement("div"));function s(o){n(o.detail)}if(t.current)return t.current.addEventListener(q,s,!1),()=>{var o;(o=t.current)==null||o.removeEventListener(q,s,!1)}},[n])}function r(n){if(t.current){const s=new CustomEvent(q,{detail:n});t.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:r}}function _t(t){let e=t.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm,"");return e=e.replace(/[\n\t]+/g," "),e=e.replace(/\s*([{}:;,])\s*/g,"$1"),e=e.replace(/\s+}/g,"}"),e=e.replace(/{\s+/g,"{"),e=e.replace(/\s+/g," "),e.trim()}function wt({init:t=!0,items:e,withLoop:r=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:c="start",enableGestures:l=!0,slideWhenDragThresholdIsReached:h=!0,onInit:u,initialActiveItem:y=0}){const[g,$]=m.useState(!1),w=m.useRef(t),x=m.useRef(null),O=m.useRef(null),N=m.useRef(0),E=m.useRef(0),k=m.useRef(!r),C=m.useRef(!1),R=m.useRef(0),f=m.useRef(0),[U,Q]=re.useSpring(()=>({value:0,onChange({value:i}){O.current.style.transform=`translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),[a]);m.useEffect(()=>{},[]);const St=r?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:Ee,emitEvent:W}=bt();function xt(){const{totalGutterCssVar:i}=Te();return i}function It(){if(x.current){const d=window.getComputedStyle(x.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(d)||1}return 1}function Z(i){w.current&&(C.current||V({type:"next",toIndex:i,actionType:"click"}))}function ee(i){w.current&&(k.current||V({type:"prev",toIndex:i,actionType:"click"}))}function V({type:i,shouldAnimate:d=!0,toIndex:_,actionType:T}){var xe,Ie;const I=!d;k.current=!1,C.current=!1;let v=U.value.get(),D=0;if(i==="next"&&(f.current+=1),i==="prev"&&(f.current===0?f.current=e.length-1:f.current-=1),_!==void 0&&(f.current=_),i==="next"){const Y=te(r?E.current*(e.length*2):0);D=-(f.current*E.current),r&&f.current===e.length&&(f.current=0,v=v+E.current*e.length,D=0),!r&&(Math.abs(D)>=Y||f.current===e.length-1)&&(C.current=!0,D=-Y)}i==="prev"&&(D=-(f.current*E.current),f.current===e.length-1&&(v=v-e.length*E.current),!r&&D>=0&&(k.current=!0,D=0)),N.current=D,T==="resize"?(D=-(f.current*E.current),W({eventName:"onResize",sliceActionType:T,slideDirection:i,currentItem:{index:f.current,id:((xe=e.at(f.current))==null?void 0:xe.id)??"",startReached:k.current,endReached:C.current}})):W({eventName:"onSlideStartChange",sliceActionType:T,slideDirection:i,nextItem:{index:f.current,id:((Ie=e.at(f.current))==null?void 0:Ie.id)??"",startReached:k.current,endReached:C.current}}),Q.start({immediate:I,from:{value:v},to:{value:D},onRest({finished:Y}){var ke;Y&&W({eventName:"onSlideChangeComplete",sliceActionType:T,slideDirection:i,currentItem:{index:f.current,id:((ke=e.at(f.current))==null?void 0:ke.id)??"",startReached:k.current,endReached:C.current}})}})}function kt(){const i=O.current;let d=0;return d=i.getBoundingClientRect()[a==="x"?"width":"height"]+xt(),d}function te(i){const d=O.current;return d[a==="x"?"scrollWidth":"scrollHeight"]-d.getBoundingClientRect()[a==="x"?"width":"height"]-i}function Te(){let i=0,d=0;if(x.current){const _=window.getComputedStyle(x.current),T=_.getPropertyValue(`--${n}-start-end-gutter`).trim();T.includes("px")&&(i=Number(T.replace("px","")));const I=_.getPropertyValue(`--${n}-gutter`).trim();I.includes("px")&&(d=Number(I.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:d}}m.useEffect(()=>{function i(I){const v=It();switch(I){case"start":return 0;case"middle-start":return Math.floor((v-1)*.25);case"center":return Math.floor((v-1)*.5);case"middle-end":return Math.floor((v-1)*.75);case"end":return v-1;default:return 0}}function d(){E.current=kt(),R.current=E.current/4;const{totalStartEndGutterCssVar:I}=Te();let v=0;r&&(v=E.current*e.length),v-=E.current*i(c),v-=I/2,x.current.style.setProperty(`--${n}-offset-modifier`,`${-v}px`)}function _(I){x.current&&(d(),$(!0),I&&I())}function T(){_(),V({type:"resize",toIndex:f.current,shouldAnimate:!1,actionType:"resize"})}if(t)return w.current=!0,_(u),window.addEventListener("resize",T),()=>{window.removeEventListener("resize",T)}},[t,r,n,a,s,c]),m.useEffect(()=>{t&&y!==f.current&&V({type:"next",toIndex:y,actionType:"resize",shouldAnimate:!1})},[t,y]);const Se=l,Ct=yt(i=>{if(!w.current)return;const d=i.dragging,_=i.offset[a==="x"?0:1],T=i.movement[a==="x"?0:1],I=T>R.current,v=T<-R.current,D=i.velocity;d&&(W({...i,eventName:"onDrag",slideActionType:"drag"}),Q.start({value:_,immediate:!0,config:{velocity:D}}),h&&(I||v)&&i.cancel()),i.last&&(I?(V({actionType:"drag",type:"prev"}),i.cancel()):v?(V({actionType:"drag",type:"next"}),i.cancel()):(Q.start({value:N.current,config:{velocity:D}}),i.cancel()))},{enabled:Se,axis:a,rubberband:!r,...r?{}:{bounds:()=>({right:0,left:-te(0),top:-te(0),bottom:0})},from:()=>[U.value.get(),U.value.get()]});function Dt(i){var d,_;return typeof i=="number"?f.current===i:((d=e.find(T=>T.id===i))==null?void 0:d.id)===((_=e[f.current])==null?void 0:_.id)}return{carouselFragment:L.jsxs("div",{ref:x,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Ct(),children:[L.jsx("style",{dangerouslySetInnerHTML:{__html:_t(`
1
+ (function(A,L){typeof exports=="object"&&typeof module<"u"?L(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],L):(A=typeof globalThis<"u"?globalThis:A||self,L(A["react-spring-carousel"]={},A["react/jsx-runtime"],A["@react-spring/web"],A.React))})(this,function(A,L,re,m){"use strict";function Ce(t,e,r){return Math.max(e,Math.min(t,r))}const b={toVector(t,e){return t===void 0&&(t=e),Array.isArray(t)?t:[t,t]},add(t,e){return[t[0]+e[0],t[1]+e[1]]},sub(t,e){return[t[0]-e[0],t[1]-e[1]]},addTo(t,e){t[0]+=e[0],t[1]+=e[1]},subTo(t,e){t[0]-=e[0],t[1]-=e[1]}};function ne(t,e,r){return e===0||Math.abs(e)===1/0?Math.pow(t,r*5):t*e*r/(e+r*t)}function se(t,e,r,n=.15){return n===0?Ce(t,e,r):t<e?-ne(e-t,r-e,n)+e:t>r?+ne(t-r,r-e,n)+r:t}function De(t,[e,r],[n,s]){const[[o,a],[c,l]]=t;return[se(e,o,a,n),se(r,c,l,s)]}function Pe(t,e){if(typeof t!="object"||t===null)return t;var r=t[Symbol.toPrimitive];if(r!==void 0){var n=r.call(t,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(t)}function $e(t){var e=Pe(t,"string");return typeof e=="symbol"?e:String(e)}function x(t,e,r){return e=$e(e),e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function ie(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(t,s).enumerable})),r.push.apply(r,n)}return r}function p(t){for(var e=1;e<arguments.length;e++){var r=arguments[e]!=null?arguments[e]:{};e%2?ie(Object(r),!0).forEach(function(n){x(t,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ie(Object(r)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(r,n))})}return t}const oe={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 ae(t){return t?t[0].toUpperCase()+t.slice(1):""}const Oe=["enter","leave"];function Ae(t=!1,e){return t&&!Oe.includes(e)}function Ne(t,e="",r=!1){const n=oe[t],s=n&&n[e]||e;return"on"+ae(t)+ae(s)+(Ae(r,s)?"Capture":"")}const Le=["gotpointercapture","lostpointercapture"];function Me(t){let e=t.substring(2).toLowerCase();const r=!!~e.indexOf("passive");r&&(e=e.replace("passive",""));const n=Le.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:r}}function Ve(t,e=""){const r=oe[t],n=r&&r[e]||e;return t+n}function K(t){return"touches"in t}function ce(t){return K(t)?"touch":"pointerType"in t?t.pointerType:"mouse"}function je(t){return Array.from(t.touches).filter(e=>{var r,n;return e.target===t.currentTarget||((r=t.currentTarget)===null||r===void 0||(n=r.contains)===null||n===void 0?void 0:n.call(r,e.target))})}function Be(t){return t.type==="touchend"||t.type==="touchcancel"?t.changedTouches:t.targetTouches}function ue(t){return K(t)?Be(t)[0]:t}function Re(t){return je(t).map(e=>e.identifier)}function F(t){const e=ue(t);return K(t)?e.identifier:e.pointerId}function le(t){const e=ue(t);return[e.clientX,e.clientY]}function Ue(t){const e={};if("buttons"in t&&(e.buttons=t.buttons),"shiftKey"in t){const{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o}=t;Object.assign(e,{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o})}return e}function G(t,...e){return typeof t=="function"?t(...e):t}function Ke(){}function Ge(...t){return t.length===0?Ke:t.length===1?t[0]:function(){let e;for(const r of t)e=r.apply(this,arguments)||e;return e}}function fe(t,e){return Object.assign({},e,t||{})}const ze=32;class We{constructor(e,r,n){this.ctrl=e,this.args=r,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:r,ingKey:n,args:s}=this;r[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=s,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const r=this.state,n=this.config;r._active||(this.reset(),this.computeInitial(),r._active=!0,r.target=e.target,r.currentTarget=e.currentTarget,r.lastOffset=n.from?G(n.from,r):r.offset,r.offset=r.lastOffset,r.startTime=r.timeStamp=e.timeStamp)}computeValues(e){const r=this.state;r._values=e,r.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:r,config:n,shared:s}=this;r.args=this.args;let o=0;if(e&&(r.event=e,n.preventDefault&&e.cancelable&&r.event.preventDefault(),r.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ue(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-r.timeStamp,r.timeStamp=e.timeStamp,r.elapsedTime=r.timeStamp-r.startTime),r._active){const f=r._delta.map(Math.abs);b.addTo(r._distance,f)}this.axisIntent&&this.axisIntent(e);const[a,c]=r._movement,[l,h]=n.threshold,{_step:u,values:y}=r;if(n.hasCustomTransform?(u[0]===!1&&(u[0]=Math.abs(a)>=l&&y[0]),u[1]===!1&&(u[1]=Math.abs(c)>=h&&y[1])):(u[0]===!1&&(u[0]=Math.abs(a)>=l&&Math.sign(a)*l),u[1]===!1&&(u[1]=Math.abs(c)>=h&&Math.sign(c)*h)),r.intentional=u[0]!==!1||u[1]!==!1,!r.intentional)return;const v=[0,0];if(n.hasCustomTransform){const[f,U]=y;v[0]=u[0]!==!1?f-u[0]:0,v[1]=u[1]!==!1?U-u[1]:0}else v[0]=u[0]!==!1?a-u[0]:0,v[1]=u[1]!==!1?c-u[1]:0;this.restrictToAxis&&!r._blocked&&this.restrictToAxis(v);const $=r.offset,E=r._active&&!r._blocked||r.active;E&&(r.first=r._active&&!r.active,r.last=!r._active&&r.active,r.active=s[this.ingKey]=r._active,e&&(r.first&&("bounds"in n&&(r._bounds=G(n.bounds,r)),this.setup&&this.setup()),r.movement=v,this.computeOffset()));const[I,O]=r.offset,[[N,_],[k,C]]=r._bounds;r.overflow=[I<N?-1:I>_?1:0,O<k?-1:O>C?1:0],r._movementBound[0]=r.overflow[0]?r._movementBound[0]===!1?r._movement[0]:r._movementBound[0]:!1,r._movementBound[1]=r.overflow[1]?r._movementBound[1]===!1?r._movement[1]:r._movementBound[1]:!1;const R=r._active?n.rubberband||[0,0]:[0,0];if(r.offset=De(r._bounds,r.offset,R),r.delta=b.sub(r.offset,$),this.computeMovement(),E&&(!r.last||o>ze)){r.delta=b.sub(r.offset,$);const f=r.delta.map(Math.abs);b.addTo(r.distance,f),r.direction=r.delta.map(Math.sign),r._direction=r._delta.map(Math.sign),!r.first&&o>0&&(r.velocity=[f[0]/o,f[1]/o],r.timeDelta=o)}}emit(){const e=this.state,r=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(p(p(p({},r),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Ye([t,e],r){const n=Math.abs(t),s=Math.abs(e);if(n>s&&n>r)return"x";if(s>n&&s>r)return"y"}class Fe extends We{constructor(...e){super(...e),x(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=b.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=b.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const r=this.state,n=this.config;if(!r.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ce(e)]:n.axisThreshold;r.axis=Ye(r._movement,s)}r._blocked=(n.lockDirection||!!n.axis)&&!r.axis||!!n.axis&&n.axis!==r.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const de=t=>t,he=.15,H={enabled(t=!0){return t},eventOptions(t,e,r){return p(p({},r.shared.eventOptions),t)},preventDefault(t=!1){return t},triggerAllEvents(t=!1){return t},rubberband(t=0){switch(t){case!0:return[he,he];case!1:return[0,0];default:return b.toVector(t)}},from(t){if(typeof t=="function")return t;if(t!=null)return b.toVector(t)},transform(t,e,r){const n=t||r.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||de;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||de},threshold(t){return b.toVector(t,0)}};process.env.NODE_ENV==="development"&&Object.assign(H,{domTarget(t){if(t!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(t){if(t!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(t){if(t!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const He=0,j=p(p({},H),{},{axis(t,e,{axis:r}){if(this.lockDirection=r==="lock",!this.lockDirection)return r},axisThreshold(t=He){return t},bounds(t={}){if(typeof t=="function")return o=>j.bounds(t(o));if("current"in t)return()=>t.current;if(typeof HTMLElement=="function"&&t instanceof HTMLElement)return t;const{left:e=-1/0,right:r=1/0,top:n=-1/0,bottom:s=1/0}=t;return[[e,r],[n,s]]}}),pe={ArrowRight:(t,e=1)=>[t*e,0],ArrowLeft:(t,e=1)=>[-1*t*e,0],ArrowUp:(t,e=1)=>[0,-1*t*e],ArrowDown:(t,e=1)=>[0,t*e]};class Xe extends Fe{constructor(...e){super(...e),x(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const r=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:r.left-n.left+e.offset[0],right:r.right-n.right+e.offset[0],top:r.top-n.top+e.offset[1],bottom:r.bottom-n.bottom+e.offset[1]};e._bounds=j.bounds(s)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const r=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(r.pointerButtons)?!r.pointerButtons.includes(e.buttons):r.pointerButtons!==-1&&r.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);r.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=F(e),n._pointerActive=!0,this.computeValues(le(e)),this.computeInitial(),r.preventScrollAxis&&ce(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):r.delay>0?(this.setupDelayTrigger(e),r.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const r=this.state;r._active=!0,r._preventScroll=!0,r._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const r=this.state,n=this.config;if(!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;const o=le(e);if(document.pointerLockElement===e.target?r._delta=[e.movementX,e.movementY]:(r._delta=b.sub(o,r._values),this.computeValues(o)),b.addTo(r._movement,r._delta),this.compute(e),r._delayed&&r.intentional){this.timeoutStore.remove("dragDelay"),r.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!r._preventScroll)if(r.axis)if(r.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){r._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const r=this.state,n=this.config;if(!r._active||!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=r._distance;if(r.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,r.tap&&n.filterTaps)r._force=!0;else{const[c,l]=r._delta,[h,u]=r._movement,[y,v]=n.swipe.velocity,[$,E]=n.swipe.distance,I=n.swipe.duration;if(r.elapsedTime<I){const O=Math.abs(c/r.timeDelta),N=Math.abs(l/r.timeDelta);O>y&&Math.abs(h)>$&&(r.swipe[0]=Math.sign(c)),N>v&&Math.abs(u)>E&&(r.swipe[1]=Math.sign(l))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const r=this.config,n=r.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&r.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",s)}}catch{}r.pointerLock&&e.currentTarget.requestPointerLock(),r.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,qe(e);const r=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",r),this.eventStore.add(this.sharedConfig.window,"touch","cancel",r),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const r=pe[e.key];if(r){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=r(this.config.keyboardDisplacement,s),n._keyboardActive=!0,b.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in pe&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const r=this.config.device;e(r,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(r,"change",this.pointerMove.bind(this)),e(r,"end",this.pointerUp.bind(this)),e(r,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function qe(t){"persist"in t&&typeof t.persist=="function"&&t.persist()}const B=typeof window<"u"&&window.document&&window.document.createElement;function me(){return B&&"ontouchstart"in window}function Je(){return me()||B&&window.navigator.maxTouchPoints>1}function Qe(){return B&&"onpointerdown"in window}function Ze(){return B&&"exitPointerLock"in window.document}function et(){try{return"constructor"in GestureEvent}catch{return!1}}const P={isBrowser:B,gesture:et(),touch:me(),touchscreen:Je(),pointer:Qe(),pointerLock:Ze()},tt=250,rt=180,nt=.5,st=50,it=250,ot=10,ge={mouse:0,touch:0,pen:8},ve=p(p({},j),{},{device(t,e,{pointer:{touch:r=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&P.pointerLock,P.touch&&r?"touch":this.pointerLock?"mouse":P.pointer&&!s?"pointer":P.touch?"touch":"mouse"},preventScrollAxis(t,e,{preventScroll:r}){if(this.preventScrollDelay=typeof r=="number"?r:r||r===void 0&&t?tt:void 0,!(!P.touchscreen||r===!1))return t||(r!==void 0?"y":void 0)},pointerCapture(t,e,{pointer:{capture:r=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&r},threshold(t,e,{filterTaps:r=!1,tapsThreshold:n=3,axis:s=void 0}){const o=b.toVector(t,r?n:s?1:0);return this.filterTaps=r,this.tapsThreshold=n,o},swipe({velocity:t=nt,distance:e=st,duration:r=it}={}){return{velocity:this.transform(b.toVector(t)),distance:this.transform(b.toVector(e)),duration:r}},delay(t=0){switch(t){case!0:return rt;case!1:return 0;default:return t}},axisThreshold(t){return t?p(p({},ge),t):ge},keyboardDisplacement(t=ot){return t}});process.env.NODE_ENV==="development"&&Object.assign(ve,{useTouch(t){if(t!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(t){if(t!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),p(p({},H),{},{device(t,e,{shared:r,pointer:{touch:n=!1}={}}){if(r.target&&!P.touch&&P.gesture)return"gesture";if(P.touch&&n)return"touch";if(P.touchscreen){if(P.pointer)return"pointer";if(P.touch)return"touch"}},bounds(t,e,{scaleBounds:r={},angleBounds:n={}}){const s=a=>{const c=fe(G(r,a),{min:-1/0,max:1/0});return[c.min,c.max]},o=a=>{const c=fe(G(n,a),{min:-1/0,max:1/0});return[c.min,c.max]};return typeof r!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(t,e,r){return this.lockDirection=r.axis==="lock",b.toVector(t,this.lockDirection?[.1,3]:0)},modifierKey(t){return t===void 0?"ctrlKey":t},pinchOnWheel(t=!0){return t}}),p(p({},j),{},{mouseOnly:(t=!0)=>t}),p(p({},j),{},{mouseOnly:(t=!0)=>t});const ye=new Map,X=new Map;function at(t){ye.set(t.key,t.engine),X.set(t.key,t.resolver)}const ct={key:"drag",engine:Xe,resolver:ve};function ut(t,e){if(t==null)return{};var r={},n=Object.keys(t),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(r[s]=t[s]);return r}function lt(t,e){if(t==null)return{};var r=ut(t,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}const ft={target(t){if(t)return()=>"current"in t?t.current:t},enabled(t=!0){return t},window(t=P.isBrowser?window:void 0){return t},eventOptions({passive:t=!0,capture:e=!1}={}){return{passive:t,capture:e}},transform(t){return t}},dt=["target","eventOptions","window","enabled","transform"];function z(t={},e){const r={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(r,t[n],n,t);Number.isNaN(o)||(r[n]=o)}else r[n]=s.call(r,t[n],n,t);break;case"object":r[n]=z(t[n],s);break;case"boolean":s&&(r[n]=t[n]);break}return r}function ht(t,e,r={}){const n=t,{target:s,eventOptions:o,window:a,enabled:c,transform:l}=n,h=lt(n,dt);if(r.shared=z({target:s,eventOptions:o,window:a,enabled:c,transform:l},ft),e){const u=X.get(e);r[e]=z(p({shared:r.shared},h),u)}else for(const u in h){const y=X.get(u);if(y)r[u]=z(p({shared:r.shared},h[u]),y);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(u)){if(u==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${u}\` was used. Please read the documentation for further information.`)}}return r}class be{constructor(e,r){x(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=r}add(e,r,n,s,o){const a=this._listeners,c=Ve(r,n),l=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},h=p(p({},l),o);e.addEventListener(c,s,h);const u=()=>{e.removeEventListener(c,s,h),a.delete(u)};return a.add(u),u}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class pt{constructor(){x(this,"_timeouts",new Map)}add(e,r,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(r,n,...s))}remove(e){const r=this._timeouts.get(e);r&&window.clearTimeout(r)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class mt{constructor(e){x(this,"gestures",new Set),x(this,"_targetEventStore",new be(this)),x(this,"gestureEventStores",{}),x(this,"gestureTimeoutStores",{}),x(this,"handlers",{}),x(this,"config",{}),x(this,"pointerIds",new Set),x(this,"touchIds",new Set),x(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),gt(this,e)}setEventIds(e){if(K(e))return this.touchIds=new Set(Re(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,r){this.handlers=e,this.nativeHandlers=r}applyConfig(e,r){this.config=ht(e,r,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const r=this.config.shared,n={};let s;if(!(r.target&&(s=r.target(),!s))){if(r.enabled){for(const a of this.gestures){const c=this.config[a],l=_e(n,c.eventOptions,!!s);if(c.enabled){const h=ye.get(a);new h(this,e,a).bind(l)}}const o=_e(n,r.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",c=>this.nativeHandlers[a](p(p({},this.state.shared),{},{event:c,args:e})),void 0,!0)}for(const o in n)n[o]=Ge(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:c,passive:l}=Me(o);this._targetEventStore.add(s,a,"",n[o],{capture:c,passive:l})}}}}function M(t,e){t.gestures.add(e),t.gestureEventStores[e]=new be(t,e),t.gestureTimeoutStores[e]=new pt}function gt(t,e){e.drag&&M(t,"drag"),e.wheel&&M(t,"wheel"),e.scroll&&M(t,"scroll"),e.move&&M(t,"move"),e.pinch&&M(t,"pinch"),e.hover&&M(t,"hover")}const _e=(t,e,r)=>(n,s,o,a={},c=!1)=>{var l,h;const u=(l=a.capture)!==null&&l!==void 0?l:e.capture,y=(h=a.passive)!==null&&h!==void 0?h:e.passive;let v=c?n:Ne(n,s,u);r&&y&&(v+="Passive"),t[v]=t[v]||[],t[v].push(o)};function vt(t,e={},r,n){const s=m.useMemo(()=>new mt(t),[]);if(s.applyHandlers(t,n),s.applyConfig(e,r),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function yt(t,e){return at(ct),vt({drag:t},e||{},"drag")}const q="RSC::Event";function bt(){const t=m.useRef(null);function e(n){m.useEffect(()=>{t.current||(t.current=document.createElement("div"));function s(o){n(o.detail)}if(t.current)return t.current.addEventListener(q,s,!1),()=>{var o;(o=t.current)==null||o.removeEventListener(q,s,!1)}},[n])}function r(n){if(t.current){const s=new CustomEvent(q,{detail:n});t.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:r}}function _t(t){let e=t.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm,"");return e=e.replace(/[\n\t]+/g," "),e=e.replace(/\s*([{}:;,])\s*/g,"$1"),e=e.replace(/\s+}/g,"}"),e=e.replace(/{\s+/g,"{"),e=e.replace(/\s+/g," "),e.trim()}function wt({init:t=!0,items:e,withLoop:r=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:c="start",enableGestures:l=!0,slideWhenDragThresholdIsReached:h=!0,onInit:u,initialActiveItem:y=0}){const[v,$]=m.useState(!1),E=m.useRef(t),I=m.useRef(null),O=m.useRef(null),N=m.useRef(0),_=m.useRef(0),k=m.useRef(!r),C=m.useRef(!1),R=m.useRef(0),f=m.useRef(0),[U,Q]=re.useSpring(()=>({value:0,onChange({value:i}){O.current.style.transform=`translate3d(calc(${i.value}px + var(--${n}-offset-modifier)), 0px, 0px)`}}),[a]);m.useEffect(()=>{},[]);const St=r?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:Ee,emitEvent:W}=bt();function xt(){const{totalGutterCssVar:i}=Te();return i}function It(){if(I.current){const d=window.getComputedStyle(I.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(d)||1}return 1}function Z(i){E.current&&(C.current||V({type:"next",toIndex:i,actionType:"click"}))}function ee(i){E.current&&(k.current||V({type:"prev",toIndex:i,actionType:"click"}))}function V({type:i,shouldAnimate:d=!0,toIndex:w,actionType:T}){var xe,Ie;const S=!d;k.current=!1,C.current=!1;let g=U.value.get(),D=0;if(i==="next"&&(f.current+=1),i==="prev"&&(f.current===0?f.current=e.length-1:f.current-=1),w!==void 0&&(f.current=w),i==="next"){const Y=te(r?_.current*(e.length*2):0);D=-(f.current*_.current),r&&f.current===e.length&&(f.current=0,g=g+_.current*e.length,D=0),!r&&(Math.abs(D)>=Y||f.current===e.length-1)&&(C.current=!0,D=-Y)}i==="prev"&&(D=-(f.current*_.current),f.current===e.length-1&&(g=g-e.length*_.current),!r&&D>=0&&(k.current=!0,D=0)),N.current=D,T==="resize"?(D=-(f.current*_.current),W({eventName:"onResize",sliceActionType:T,slideDirection:i,currentItem:{index:f.current,id:((xe=e.at(f.current))==null?void 0:xe.id)??"",startReached:k.current,endReached:C.current}})):W({eventName:"onSlideStartChange",sliceActionType:T,slideDirection:i,nextItem:{index:f.current,id:((Ie=e.at(f.current))==null?void 0:Ie.id)??"",startReached:k.current,endReached:C.current}}),Q.start({immediate:S,from:{value:g},to:{value:D},onRest({finished:Y}){var ke;Y&&W({eventName:"onSlideChangeComplete",sliceActionType:T,slideDirection:i,currentItem:{index:f.current,id:((ke=e.at(f.current))==null?void 0:ke.id)??"",startReached:k.current,endReached:C.current}})}})}function kt(){const i=O.current;let d=0;return d=i.getBoundingClientRect()[a==="x"?"width":"height"]+xt(),d}function te(i){const d=O.current;return d[a==="x"?"scrollWidth":"scrollHeight"]-d.getBoundingClientRect()[a==="x"?"width":"height"]-i}function Te(){let i=0,d=0;if(I.current){const w=window.getComputedStyle(I.current),T=w.getPropertyValue(`--${n}-start-end-gutter`).trim();T.includes("px")&&(i=Number(T.replace("px","")));const S=w.getPropertyValue(`--${n}-gutter`).trim();S.includes("px")&&(d=Number(S.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:d}}m.useEffect(()=>{function i(S){const g=It();switch(S){case"start":return 0;case"middle-start":return Math.floor((g-1)*.25);case"center":return Math.floor((g-1)*.5);case"middle-end":return Math.floor((g-1)*.75);case"end":return g-1;default:return 0}}function d(){_.current=kt(),console.log("scrollAmountValue",_.current),R.current=_.current/4;const{totalStartEndGutterCssVar:S}=Te();console.log({totalStartEndGutterCssVar:S});let g=0;r&&(g=_.current*e.length),console.log({offset:g}),g-=_.current*i(c),console.log({offset:g}),g-=S/2,console.log({offset:g}),I.current.style.setProperty(`--${n}-offset-modifier`,`${-g}px`)}function w(S){I.current&&(d(),$(!0),S&&S())}function T(){w(),V({type:"resize",toIndex:f.current,shouldAnimate:!1,actionType:"resize"})}if(t)return E.current=!0,w(u),window.addEventListener("resize",T),()=>{window.removeEventListener("resize",T)}},[t,r,n,a,s,c]),m.useEffect(()=>{t&&y!==f.current&&V({type:"next",toIndex:y,actionType:"resize",shouldAnimate:!1})},[t,y]);const Se=l,Ct=yt(i=>{if(!E.current)return;const d=i.dragging,w=i.offset[a==="x"?0:1],T=i.movement[a==="x"?0:1],S=T>R.current,g=T<-R.current,D=i.velocity;d&&(W({...i,eventName:"onDrag",slideActionType:"drag"}),Q.start({value:w,immediate:!0,config:{velocity:D}}),h&&(S||g)&&i.cancel()),i.last&&(S?(V({actionType:"drag",type:"prev"}),i.cancel()):g?(V({actionType:"drag",type:"next"}),i.cancel()):(Q.start({value:N.current,config:{velocity:D}}),i.cancel()))},{enabled:Se,axis:a,rubberband:!r,...r?{}:{bounds:()=>({right:0,left:-te(0),top:-te(0),bottom:0})},from:()=>[U.value.get(),U.value.get()]});function Dt(i){var d,w;return typeof i=="number"?f.current===i:((d=e.find(T=>T.id===i))==null?void 0:d.id)===((w=e[f.current])==null?void 0:w.id)}return{carouselFragment:L.jsxs("div",{ref:I,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Ct(),children:[L.jsx("style",{dangerouslySetInnerHTML:{__html:_t(`
2
2
  [data-part-internal="${n}-Container"] {
3
3
  display: flex;
4
4
  width: 100%;
@@ -17,8 +17,8 @@
17
17
  display: flex;
18
18
  position: relative;
19
19
  --initial-offset-modifier: calc(calc(-100% - var(--${n}-gutter) + calc(var(--${n}-start-end-gutter) / 2 / ${e.length} * var(--${n}-items-per-slide)) + var(--${n}-start-end-gutter)) * ${e.length} / var(--${n}-items-per-slide));
20
- left: ${r&&a==="x"&&!g?"var(--initial-offset-modifier)":"0px"};
21
- top: ${r&&a==="y"&&!g?"var(--initial-offset-modifier)":"0px"};
20
+ left: ${r&&a==="x"&&!v?"var(--initial-offset-modifier)":"0px"};
21
+ top: ${r&&a==="y"&&!v?"var(--initial-offset-modifier)":"0px"};
22
22
  flex-direction: ${a==="x"?"row":"column"};
23
23
  width: 100%;
24
24
  height: 100%;
@@ -44,4 +44,4 @@
44
44
  }
45
45
  }
46
46
  `).join(""):""}
47
- `)}}),L.jsx("div",{ref:O,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{k.current=!1,C.current=!1},children:St.map((i,d)=>L.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:Ee,index:d,isClonedItem:!!i.isClonedItem,isActiveItem:Dt}):i.renderItem},`${i.id}-${d}`))})]}),useListenToCustomEvent:Ee,slideToNextItem:()=>Z(),slideToPrevItem:()=>ee(),slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>f.current?Z(i):ee(i)}if(typeof i=="string"){const d=e.findIndex(_=>_.id===i);if(d<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}d>f.current?Z(d):ee(d)}}}}function Et(t){let e=0;const r=getComputedStyle(t).getPropertyValue("gap");return r.includes("px")&&(e=Number(r.replace("px",""))),e}function we(t){return t.scrollWidth-t.clientWidth}function J(t){const e=t.children[0],r=Et(t);return e.getBoundingClientRect().width+r}function Tt({container:t,onReach:e}){const r=m.useRef("start"),n=m.useRef(0),[,s]=re.useSpring(()=>({x:0}));function o(c){s.start({from:{x:t.current.scrollLeft},to:{x:c},onChange({value:l}){t.current&&(t.current.scrollLeft=l.x)}})}function a(c){if(!t.current||c==="next"&&r.current==="end"||c==="prev"&&r.current==="start")return;let l=0;if(c==="next"&&(n.current+=1),c==="prev"&&(n.current-=1),l=n.current*J(t.current),c==="next"){const h=we(t.current);l>h&&(r.current="end",l=h,e&&e("end"))}c==="prev"&&l<=0&&(r.current="start",n.current=0,l=0,e&&e("start")),o(l)}return m.useEffect(()=>{function c(){var E;const $=J(t.current),w=((E=[...t.current.children].at(0))==null?void 0:E.getBoundingClientRect().width)||0,x=Array(t.current.childElementCount).fill(0).map((k,C)=>({index:C,start:$*C,end:$*(C+1)})),O=t.current.scrollLeft+w,N=x.find(k=>O>=k.start&&O<k.end);n.current=(N==null?void 0:N.index)||0}function l(){s.stop()}function h($){const w=$.target;w.scrollLeft===0?(n.current=0,r.current="start",e&&e("start")):w.scrollLeft>=we(w)?(r.current="end",e&&e("end")):r.current!=="idle"&&(r.current="idle",e&&e("idle"))}let u,y=0;function g(){y=t.current.scrollLeft,clearTimeout(u),u=setTimeout(function(){t.current.scrollLeft===y&&c()},200)}if(t.current)return t.current.addEventListener("wheel",l,{passive:!0}),t.current.addEventListener("scroll",h),t.current.addEventListener("scroll",g),()=>{t.current&&(t.current.removeEventListener("scroll",g),t.current.removeEventListener("scroll",h),t.current.removeEventListener("wheel",l))}},[t,e]),m.useEffect(()=>{if(t.current){const c=new ResizeObserver(()=>{o(n.current*J(t.current))});return c.observe(t.current),()=>{c.disconnect()}}},[]),{scrollToNext(){a("next")},scrollToPrev(){a("prev")}}}A.useSpringCarousel=wt,A.useSpringScroll=Tt,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});
47
+ `)}}),L.jsx("div",{ref:O,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{k.current=!1,C.current=!1},children:St.map((i,d)=>L.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:Ee,index:d,isClonedItem:!!i.isClonedItem,isActiveItem:Dt}):i.renderItem},`${i.id}-${d}`))})]}),useListenToCustomEvent:Ee,slideToNextItem:()=>Z(),slideToPrevItem:()=>ee(),slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>f.current?Z(i):ee(i)}if(typeof i=="string"){const d=e.findIndex(w=>w.id===i);if(d<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}d>f.current?Z(d):ee(d)}}}}function Et(t){let e=0;const r=getComputedStyle(t).getPropertyValue("gap");return r.includes("px")&&(e=Number(r.replace("px",""))),e}function we(t){return t.scrollWidth-t.clientWidth}function J(t){const e=t.children[0],r=Et(t);return e.getBoundingClientRect().width+r}function Tt({container:t,onReach:e}){const r=m.useRef("start"),n=m.useRef(0),[,s]=re.useSpring(()=>({x:0}));function o(c){s.start({from:{x:t.current.scrollLeft},to:{x:c},onChange({value:l}){t.current&&(t.current.scrollLeft=l.x)}})}function a(c){if(!t.current||c==="next"&&r.current==="end"||c==="prev"&&r.current==="start")return;let l=0;if(c==="next"&&(n.current+=1),c==="prev"&&(n.current-=1),l=n.current*J(t.current),c==="next"){const h=we(t.current);l>h&&(r.current="end",l=h,e&&e("end"))}c==="prev"&&l<=0&&(r.current="start",n.current=0,l=0,e&&e("start")),o(l)}return m.useEffect(()=>{function c(){var _;const $=J(t.current),E=((_=[...t.current.children].at(0))==null?void 0:_.getBoundingClientRect().width)||0,I=Array(t.current.childElementCount).fill(0).map((k,C)=>({index:C,start:$*C,end:$*(C+1)})),O=t.current.scrollLeft+E,N=I.find(k=>O>=k.start&&O<k.end);n.current=(N==null?void 0:N.index)||0}function l(){s.stop()}function h($){const E=$.target;E.scrollLeft===0?(n.current=0,r.current="start",e&&e("start")):E.scrollLeft>=we(E)?(r.current="end",e&&e("end")):r.current!=="idle"&&(r.current="idle",e&&e("idle"))}let u,y=0;function v(){y=t.current.scrollLeft,clearTimeout(u),u=setTimeout(function(){t.current.scrollLeft===y&&c()},200)}if(t.current)return t.current.addEventListener("wheel",l,{passive:!0}),t.current.addEventListener("scroll",h),t.current.addEventListener("scroll",v),()=>{t.current&&(t.current.removeEventListener("scroll",v),t.current.removeEventListener("scroll",h),t.current.removeEventListener("wheel",l))}},[t,e]),m.useEffect(()=>{if(t.current){const c=new ResizeObserver(()=>{o(n.current*J(t.current))});return c.observe(t.current),()=>{c.disconnect()}}},[]),{scrollToNext(){a("next")},scrollToPrev(){a("prev")}}}A.useSpringCarousel=wt,A.useSpringScroll=Tt,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-spring-carousel",
3
- "version": "3.0.0-beta-2.0.89",
3
+ "version": "3.0.0-beta-2.0.91",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "main": "./dist/index.umd.js",