react-spring-carousel 3.0.0-beta090.2 → 3.0.0-beta090.21

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.es2.js CHANGED
@@ -1,65 +1,66 @@
1
- import { u as Ve, a as De, j as P } from "./useThumbsModule-4e4b7969.js";
2
- import { useSpring as qe, config as Y, useIsomorphicLayoutEffect as Be } from "@react-spring/web";
3
- import { useDrag as He } from "@use-gesture/react";
4
- import { useRef as g, useEffect as N, createContext as Oe, useCallback as ze, useContext as Xe } from "react";
5
- import Ye from "resize-observer-polyfill";
1
+ import { u as Be, a as He, j as W } from "./useThumbsModule-4e4b7969.js";
2
+ import { useSpring as ze, config as _, useIsomorphicLayoutEffect as Xe } from "@react-spring/web";
3
+ import { useDrag as Ye } from "@use-gesture/react";
4
+ import { useRef as m, useEffect as N, createContext as Je, useCallback as Y, useContext as Ke } from "react";
5
+ import Qe from "resize-observer-polyfill";
6
6
  import $ from "screenfull";
7
- function Je({
7
+ function Ue({
8
8
  mainCarouselWrapperRef: n,
9
9
  onFullScreenChange: v,
10
10
  handleResize: E
11
11
  }) {
12
- const J = g(!1);
12
+ const O = m(!1);
13
13
  N(() => {
14
- function h() {
15
- document.fullscreenElement && (O(!0), v(!0), E && E()), document.fullscreenElement || (O(!1), v(!1), E && E());
14
+ function a() {
15
+ document.fullscreenElement && (J(!0), v(!0), E && E()), document.fullscreenElement || (J(!1), v(!1), E && E());
16
16
  }
17
17
  if ($.isEnabled)
18
- return $.on("change", h), () => {
19
- $.isEnabled && $.off("change", h);
18
+ return $.on("change", a), () => {
19
+ $.isEnabled && $.off("change", a);
20
20
  };
21
21
  }, []);
22
- function O(h) {
23
- J.current = h;
22
+ function J(a) {
23
+ O.current = a;
24
24
  }
25
- function b() {
26
- return J.current;
25
+ function p() {
26
+ return O.current;
27
27
  }
28
- function k(h) {
29
- $.isEnabled && $.request(h || n.current);
28
+ function I(a) {
29
+ $.isEnabled && $.request(a || n.current);
30
30
  }
31
31
  function u() {
32
32
  $.isEnabled && $.exit();
33
33
  }
34
34
  return {
35
- enterFullscreen: k,
35
+ enterFullscreen: I,
36
36
  exitFullscreen: u,
37
- getIsFullscreen: b
37
+ getIsFullscreen: p
38
38
  };
39
39
  }
40
- function et({
40
+ function tr({
41
41
  items: n,
42
42
  init: v = !0,
43
43
  withThumbs: E,
44
- thumbsSlideAxis: J = "x",
45
- itemsPerSlide: O = 1,
46
- slideType: b = "fixed",
47
- gutter: k = 0,
44
+ thumbsSlideAxis: O = "x",
45
+ itemsPerSlide: J = 1,
46
+ slideType: p = "fixed",
47
+ gutter: I = 0,
48
48
  withLoop: u = !1,
49
- startEndGutter: h = 0,
50
- carouselSlideAxis: i = "x",
51
- disableGestures: ae = !1,
52
- draggingSlideTreshold: L,
53
- slideWhenThresholdIsReached: de = !1,
49
+ startEndGutter: a = 0,
50
+ carouselSlideAxis: o = "x",
51
+ disableGestures: me = !1,
52
+ draggingSlideTreshold: ne,
53
+ slideWhenThresholdIsReached: ve = !1,
54
54
  freeScroll: c,
55
- enableFreeScrollDrag: pe,
56
- initialStartingPosition: A,
57
- prepareThumbsData: xe,
55
+ enableFreeScrollDrag: ce,
56
+ initialStartingPosition: L,
57
+ prepareThumbsData: Ie,
58
58
  initialActiveItem: M = 0,
59
- animateWhenActiveItemChange: ye = !0,
60
- getControllerRef: S
59
+ animateWhenActiveItemChange: we = !0,
60
+ slideGroupOfItems: j = !1,
61
+ slideAmount: P
61
62
  }) {
62
- const w = O > n.length ? n.length : O, z = g(!1), K = g(L ?? 0), C = g("initial"), ee = g("initial"), te = g("initial"), p = g(M), s = g(M === 0), l = g(b === "fixed" && M === n.length - 1), f = g(null), x = g(null), re = g(0), ne = g(0), a = g(0), Ie = g(u), Te = g(b), be = g(c), R = g(!1), Q = ze(() => u ? [
63
+ const w = J > n.length ? n.length : J, K = m(!1), G = m(ne ?? 0), C = m("initial"), ue = m("initial"), oe = m("initial"), x = m(M), d = m(M === 0), f = m(p === "fixed" && M === n.length - 1), l = m(null), y = m(null), ie = m(0), fe = m(0), g = m(0), Te = m(u), Me = m(p), Ce = m(c), V = m(!1), A = Y(() => u ? [
63
64
  ...n.map((e) => ({
64
65
  ...e,
65
66
  id: `prev-repeated-item-${e.id}`
@@ -69,461 +70,489 @@ function et({
69
70
  ...e,
70
71
  id: `next-repeated-item-${e.id}`
71
72
  }))
72
- ] : [...n], [n, u])(), [W, y] = qe(
73
+ ] : [...n], [n, u])(), [R, b] = ze(
73
74
  () => ({
74
75
  val: 0,
75
76
  pause: !v,
76
77
  onChange: ({ value: e }) => {
77
- c && f.current ? (i === "x" ? f.current.scrollLeft = Math.abs(e.val) : f.current.scrollTop = Math.abs(e.val), G()) : x.current && (i === "x" ? x.current.style.transform = `translate3d(${e.val}px, 0px,0px)` : x.current.style.transform = `translate3d(0px,${e.val}px,0px)`);
78
+ c && l.current ? (o === "x" ? l.current.scrollLeft = Math.abs(e.val) : l.current.scrollTop = Math.abs(e.val), te()) : y.current && (o === "x" ? y.current.style.transform = `translate3d(${e.val}px, 0px,0px)` : y.current.style.transform = `translate3d(0px,${e.val}px,0px)`);
78
79
  }
79
80
  }),
80
81
  [c]
81
- ), { emitEvent: U, useListenToCustomEvent: Z } = Ve(), { thumbsFragment: Me, handleScroll: we } = De({
82
+ ), { emitEvent: S, useListenToCustomEvent: ee } = Be(), { thumbsFragment: ke, handleScroll: Fe } = He({
82
83
  withThumbs: !!E,
83
- thumbsSlideAxis: J,
84
- prepareThumbsData: xe,
84
+ thumbsSlideAxis: O,
85
+ prepareThumbsData: Ie,
85
86
  items: n,
86
87
  renderThumbFnProps: {
87
- getIsActiveItem: se,
88
- getIsPrevItem: le,
89
- useListenToCustomEvent: Z,
90
- getIsNextItem: oe
88
+ getIsActiveItem: de,
89
+ getIsPrevItem: ae,
90
+ useListenToCustomEvent: ee,
91
+ getIsNextItem: le
91
92
  }
92
- }), { enterFullscreen: me, exitFullscreen: ge, getIsFullscreen: ve } = Je({
93
- mainCarouselWrapperRef: f,
94
- handleResize: () => _(),
93
+ }), { enterFullscreen: pe, exitFullscreen: xe, getIsFullscreen: ye } = Ue({
94
+ mainCarouselWrapperRef: l,
95
+ handleResize: () => re(),
95
96
  onFullScreenChange: (e) => {
96
- U({
97
+ S({
97
98
  eventName: "onFullscreenChange",
98
99
  isFullscreen: e
99
100
  });
100
101
  }
101
102
  });
102
- function Ce(e) {
103
- return b === "fixed" && !c ? {
104
- marginRight: `${e ? 0 : k}px`,
105
- flex: `1 0 calc(100% / ${w} - ${k * (w - 1) / w}px)`
103
+ function $e(e) {
104
+ return p === "fixed" && !c ? {
105
+ marginRight: `${e ? 0 : I}px`,
106
+ flex: `1 0 calc(100% / ${w} - ${I * (w - 1) / w}px)`
106
107
  } : {
107
- marginRight: `${e ? 0 : k}px`
108
+ marginRight: `${e ? 0 : I}px`
108
109
  };
109
110
  }
110
- function d() {
111
+ const s = Y(() => {
111
112
  var r;
112
- const e = (r = f.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
113
+ if (typeof P == "number" && P > 0 && (p === "fluid" || c))
114
+ return P;
115
+ const e = j ? l.current : (r = l.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
113
116
  if (!e)
114
117
  throw Error("No carousel items available!");
115
- return e.getBoundingClientRect()[i === "x" ? "width" : "height"] + k;
116
- }
117
- function j({ from: e, to: r, nextActiveItem: t, immediate: o = !1, slideMode: T }) {
118
- ee.current = T, typeof t == "number" && (c || (p.current = t), U({
118
+ let t = e.getBoundingClientRect()[o === "x" ? "width" : "height"];
119
+ return j || (t += I), j && (t += I - a * 2), t;
120
+ }, [
121
+ o,
122
+ c,
123
+ I,
124
+ P,
125
+ j,
126
+ p,
127
+ a
128
+ ]);
129
+ function D({ from: e, to: t, nextActiveItem: r, immediate: i = !1, slideMode: T }) {
130
+ ue.current = T, typeof r == "number" && (c || (x.current = r), S({
119
131
  eventName: "onSlideStartChange",
120
132
  slideActionType: C.current,
121
- slideMode: ee.current,
133
+ slideMode: ue.current,
122
134
  nextItem: {
123
- startReached: s.current,
124
- endReached: l.current,
125
- index: c ? -1 : p.current,
126
- id: c ? "" : n[p.current].id
135
+ startReached: d.current,
136
+ endReached: f.current,
137
+ index: c ? -1 : x.current,
138
+ id: c ? "" : n[x.current].id
127
139
  }
128
- })), a.current = r, y.start({
129
- immediate: o,
140
+ })), g.current = t, b.start({
141
+ immediate: i,
130
142
  from: {
131
143
  val: e
132
144
  },
133
145
  to: {
134
- val: r
146
+ val: t
135
147
  },
136
148
  config: {
137
- ...Y.default,
138
- velocity: W.val.velocity
149
+ ..._.default,
150
+ velocity: R.val.velocity
139
151
  },
140
- onRest(B) {
141
- !o && B.finished && U({
152
+ onRest(z) {
153
+ !i && z.finished && S({
142
154
  eventName: "onSlideChange",
143
155
  slideActionType: C.current,
144
- slideMode: ee.current,
156
+ slideMode: ue.current,
145
157
  currentItem: {
146
- startReached: s.current,
147
- endReached: l.current,
148
- index: c ? -1 : p.current,
149
- id: c ? "" : n[p.current].id
158
+ startReached: d.current,
159
+ endReached: f.current,
160
+ index: c ? -1 : x.current,
161
+ id: c ? "" : n[x.current].id
150
162
  }
151
163
  });
152
164
  }
153
- }), E && !o && we(p.current);
165
+ }), E && !i && Fe(x.current);
154
166
  }
155
- function m() {
167
+ const h = Y(() => {
156
168
  var e;
157
- return x.current ? u ? d() * n.length : Math.round(
169
+ return y.current ? u ? s() * n.length : Math.round(
158
170
  Number(
159
- (e = x.current) == null ? void 0 : e[i === "x" ? "scrollWidth" : "scrollHeight"]
160
- ) - x.current.getBoundingClientRect()[i === "x" ? "width" : "height"] - h * 2
171
+ (e = y.current) == null ? void 0 : e[o === "x" ? "scrollWidth" : "scrollHeight"]
172
+ ) - y.current.getBoundingClientRect()[o === "x" ? "width" : "height"] - a * 2
161
173
  ) : 0;
162
- }
163
- function Fe() {
164
- const e = `calc(100% - ${h * 2}px)`;
174
+ }, [o, s, n.length, a, u]);
175
+ function Ee() {
176
+ const e = `calc(100% - ${a * 2}px)`;
165
177
  return {
166
- width: i === "x" ? e : "100%",
167
- height: i === "y" ? e : "100%"
178
+ width: o === "x" ? e : "100%",
179
+ height: o === "y" ? e : "100%"
168
180
  };
169
181
  }
170
- function ce() {
171
- var r;
172
- const e = (r = x.current) == null ? void 0 : r.querySelector(".use-spring-carousel-item");
182
+ const Q = Y(() => {
183
+ var t;
184
+ const e = (t = y.current) == null ? void 0 : t.querySelector(".use-spring-carousel-item");
173
185
  if (!e)
174
186
  throw Error("No carousel items available!");
175
- return e.getBoundingClientRect()[i === "x" ? "width" : "height"] + k;
176
- }
177
- function ue(e) {
178
- const r = i === "x" ? "left" : "top", t = x.current;
179
- t && (u ? (t.style.top = "0px", t.style.left = "0px", t.style[r] = `-${e - h}px`, s.current = !1, l.current = !1) : (t.style.left = "0px", t.style.top = "0px"));
180
- }
181
- function _(e = !1) {
182
- if (x.current && e && (x.current.style.transform = "translate3d(0px, 0px,0px)", x.current.style.left = "0", x.current.style.top = "0"), b === "fixed" && ue(
183
- A === "center" ? ce() * n.length - d() * Math.round((w - 1) / 2) : A === "end" ? ce() * n.length - d() * Math.round(w - 1) : ce() * n.length
184
- ), b === "fluid") {
185
- if (l.current && m() !== Math.abs(a.current) && !u) {
186
- const r = -m();
187
- a.current = r, y.start({
188
- immediate: !0,
189
- val: a.current
190
- });
187
+ return e.getBoundingClientRect()[o === "x" ? "width" : "height"] + I;
188
+ }, [o, I]), U = Y(
189
+ (e) => {
190
+ const t = o === "x" ? "left" : "top", r = y.current;
191
+ r && (u ? (r.style.top = "0px", r.style.left = "0px", r.style[t] = `-${e - a}px`, d.current = !1, f.current = !1) : (r.style.left = "0px", r.style.top = "0px"));
192
+ },
193
+ [o, a, u]
194
+ ), re = Y(
195
+ (e = !1) => {
196
+ if (y.current && e && (y.current.style.transform = "translate3d(0px, 0px,0px)", y.current.style.left = "0", y.current.style.top = "0"), p === "fixed" && U(
197
+ L === "center" ? Q() * n.length - s() * Math.round((w - 1) / 2) : L === "end" ? Q() * n.length - s() * Math.round(w - 1) : Q() * n.length
198
+ ), p === "fluid") {
199
+ if (U(Q() * n.length), f.current && h() !== Math.abs(g.current) && !u) {
200
+ const t = -h();
201
+ g.current = t, b.start({
202
+ immediate: !0,
203
+ val: g.current
204
+ });
205
+ return;
206
+ }
207
+ if (Math.abs(g.current) > 0 && h() !== Math.abs(g.current) && !u && !c && oe.current === "backward") {
208
+ const t = ie.current - h(), r = g.current + t;
209
+ return b.start({
210
+ immediate: !0,
211
+ val: r
212
+ }), () => {
213
+ g.current = r;
214
+ };
215
+ }
216
+ console.log("here");
191
217
  return;
192
218
  }
193
- if (Math.abs(a.current) > 0 && m() !== Math.abs(a.current) && !u && !c && te.current === "backward") {
194
- const r = re.current - m(), t = a.current + r;
195
- return y.start({
196
- immediate: !0,
197
- val: t
198
- }), () => {
199
- a.current = t;
200
- };
219
+ if (!c && p === "fixed") {
220
+ const t = -(s() * x.current);
221
+ if (Math.abs(t) > h() && !u) {
222
+ const r = -h();
223
+ f.current = !0, g.current = r, b.start({
224
+ immediate: !0,
225
+ val: g.current
226
+ });
227
+ } else
228
+ g.current = t, b.start({
229
+ immediate: !0,
230
+ val: t
231
+ });
232
+ setTimeout(() => {
233
+ K.current = !1;
234
+ }, 0);
201
235
  }
202
- return;
203
- }
204
- if (!c && b === "fixed") {
205
- const r = -(d() * p.current);
206
- if (Math.abs(r) > m() && !u) {
207
- const t = -m();
208
- l.current = !0, a.current = t, y.start({
209
- immediate: !0,
210
- val: a.current
211
- });
212
- } else
213
- a.current = r, y.start({
214
- immediate: !0,
215
- val: r
216
- });
217
- setTimeout(() => {
218
- z.current = !1;
219
- }, 0);
220
- }
221
- }
222
- function F() {
223
- return c && f.current ? f.current[i === "x" ? "scrollLeft" : "scrollTop"] : W.val.get();
236
+ },
237
+ [
238
+ c,
239
+ Q,
240
+ s,
241
+ h,
242
+ L,
243
+ n.length,
244
+ w,
245
+ U,
246
+ b,
247
+ p,
248
+ u
249
+ ]
250
+ );
251
+ function k() {
252
+ return c && l.current ? l.current[o === "x" ? "scrollLeft" : "scrollTop"] : R.val.get();
224
253
  }
225
- function X(e, r) {
254
+ function Z(e, t) {
226
255
  if (c && e === "next") {
227
- const t = a.current + d();
228
- return t > m() ? m() : t;
256
+ const r = g.current + s();
257
+ return r > h() ? h() : r;
229
258
  }
230
259
  if (c && e === "prev") {
231
- const t = a.current - d();
232
- return t < 0 ? 0 : t;
260
+ const r = g.current - s();
261
+ return r < 0 ? 0 : r;
233
262
  }
234
- return e === "next" ? typeof r == "number" ? -(r * d()) : a.current - d() : typeof r == "number" ? -(r * d()) : a.current + d();
263
+ return e === "next" ? typeof t == "number" ? -(t * s()) : g.current - s() : typeof t == "number" ? -(t * s()) : g.current + s();
235
264
  }
236
- function V({ type: e, index: r, immediate: t }) {
237
- if (!v || R.current || s.current && !u)
265
+ function q({ type: e, index: t, immediate: r }) {
266
+ if (!v || V.current || d.current && !u)
238
267
  return;
239
- l.current && (te.current = "backward"), C.current = "prev", l.current = !1;
240
- const o = typeof r == "number" ? r : p.current - 1;
241
- if (c && G(), !u) {
242
- const T = c ? X("prev", r) - d() / 3 < 0 : X("prev", r) + d() / 3 > 0;
243
- if (s.current)
268
+ f.current && (oe.current = "backward"), C.current = "prev", f.current = !1;
269
+ const i = typeof t == "number" ? t : x.current - 1;
270
+ if (c && te(), !u) {
271
+ const T = c ? Z("prev", t) - s() / 3 < 0 : Z("prev", t) + s() / 3 > 0;
272
+ if (d.current)
244
273
  return;
245
274
  if (T) {
246
- s.current = !0, l.current = !1, j({
275
+ d.current = !0, f.current = !1, D({
247
276
  slideMode: e,
248
- from: F(),
277
+ from: k(),
249
278
  to: 0,
250
279
  nextActiveItem: 0,
251
- immediate: t
280
+ immediate: r
252
281
  });
253
282
  return;
254
283
  }
255
284
  }
256
- if (u && (s.current || o < 0)) {
257
- s.current = !1, l.current = !0, j({
285
+ if (u && (d.current || i < 0)) {
286
+ d.current = !1, f.current = !0, D({
258
287
  slideMode: e,
259
- from: F() - d() * n.length,
260
- to: -(d() * n.length) + d(),
288
+ from: k() - s() * n.length,
289
+ to: -(s() * n.length) + s(),
261
290
  nextActiveItem: n.length - 1,
262
- immediate: t
291
+ immediate: r
263
292
  });
264
293
  return;
265
294
  }
266
- o === 0 && (s.current = !0), (o === n.length - 1 || o === -1) && (l.current = !0), j({
295
+ i === 0 && (d.current = !0), (i === n.length - 1 || i === -1) && (f.current = !0), D({
267
296
  slideMode: e,
268
- from: F(),
269
- to: X("prev", r),
270
- nextActiveItem: o,
271
- immediate: t
297
+ from: k(),
298
+ to: Z("prev", t),
299
+ nextActiveItem: i,
300
+ immediate: r
272
301
  });
273
302
  }
274
- function D({ type: e, index: r, immediate: t }) {
275
- if (!v || R.current || l.current && !u)
303
+ function B({ type: e, index: t, immediate: r }) {
304
+ if (!v || V.current || f.current && !u)
276
305
  return;
277
- s.current && (te.current = "forward"), C.current = "next", s.current = !1;
278
- const o = r || p.current + 1;
279
- if (c && G(), !u) {
280
- const T = Math.abs(X("next", r)) > m() - d() / 3;
281
- if (l.current)
306
+ d.current && (oe.current = "forward"), C.current = "next", d.current = !1;
307
+ const i = t || x.current + 1;
308
+ if (c && te(), !u) {
309
+ const T = Math.abs(Z("next", t)) > h() - s() / 3;
310
+ if (f.current)
282
311
  return;
283
312
  if (T) {
284
- s.current = !1, l.current = !0, j({
313
+ d.current = !1, f.current = !0, D({
285
314
  slideMode: e,
286
- from: F(),
287
- to: c ? m() : -m(),
288
- nextActiveItem: o,
289
- immediate: t
315
+ from: k(),
316
+ to: c ? h() : -h(),
317
+ nextActiveItem: i,
318
+ immediate: r
290
319
  });
291
320
  return;
292
321
  }
293
322
  }
294
- if (u && (l.current || o > n.length - 1)) {
295
- l.current = !1, s.current = !0, j({
323
+ if (u && (f.current || i > n.length - 1)) {
324
+ f.current = !1, d.current = !0, D({
296
325
  slideMode: e,
297
- from: F() + d() * n.length,
326
+ from: k() + s() * n.length,
298
327
  to: 0,
299
328
  nextActiveItem: 0,
300
- immediate: t
329
+ immediate: r
301
330
  });
302
331
  return;
303
332
  }
304
- o === 0 && (s.current = !0), o === n.length - 1 && (l.current = !0), j({
333
+ i === 0 && (d.current = !0), i === n.length - 1 && (f.current = !0), D({
305
334
  slideMode: e,
306
- from: F(),
307
- to: X("next", r),
308
- nextActiveItem: o,
309
- immediate: t
335
+ from: k(),
336
+ to: Z("next", t),
337
+ nextActiveItem: i,
338
+ immediate: r
310
339
  });
311
340
  }
312
- function ke() {
313
- L ? K.current = L : K.current = Math.floor(d() / 2 / 2);
341
+ function Re() {
342
+ ne ? G.current = ne : G.current = Math.floor(s() / 2 / 2);
314
343
  }
315
- function he() {
316
- x.current && (re.current = m(), Ie.current = u, Te.current = b, be.current = c, ne.current = window.innerWidth, a.current = 0, ie({ id: 0, immediate: !0, shouldReset: !0 }), ke(), _());
344
+ function be() {
345
+ y.current && (ie.current = h(), Te.current = u, Me.current = p, Ce.current = c, fe.current = window.innerWidth, g.current = 0, se({ id: 0, immediate: !0, shouldReset: !0 }), Re(), re());
317
346
  }
318
- const $e = He(
347
+ const We = Ye(
319
348
  (e) => {
320
- const r = e.dragging, t = e.offset[i === "x" ? 0 : 1], o = e.movement[i === "x" ? 0 : 1], T = e.direction[i === "x" ? 0 : 1], B = o > K.current, H = o < -K.current, je = m();
321
- if (r) {
322
- if (T > 0 ? C.current = "prev" : C.current = "next", U({
349
+ const t = e.dragging, r = e.offset[o === "x" ? 0 : 1], i = e.movement[o === "x" ? 0 : 1], T = e.direction[o === "x" ? 0 : 1], z = i > G.current, X = i < -G.current, qe = h(), F = e.velocity;
350
+ if (t) {
351
+ if (T > 0 ? C.current = "prev" : C.current = "next", S({
323
352
  ...e,
324
353
  eventName: "onDrag",
325
354
  slideActionType: C.current
326
355
  }), c) {
327
- if (t > 0) {
328
- y.start({
356
+ if (r > 0) {
357
+ b.start({
329
358
  from: {
330
- val: F()
359
+ val: k()
331
360
  },
332
361
  to: {
333
362
  val: 0
334
363
  },
335
364
  config: {
336
- velocity: e.velocity,
365
+ velocity: F,
337
366
  friction: 50,
338
367
  tension: 1e3
339
368
  }
340
369
  }), e.cancel();
341
370
  return;
342
371
  }
343
- y.start({
372
+ b.start({
344
373
  from: {
345
- val: F()
374
+ val: k()
346
375
  },
347
376
  to: {
348
- val: -t
377
+ val: -r
349
378
  },
350
379
  config: {
351
- velocity: e.velocity,
380
+ velocity: F,
352
381
  friction: 50,
353
382
  tension: 1e3
354
383
  }
355
384
  });
356
385
  return;
357
386
  }
358
- y.start({
359
- val: t,
387
+ b.start({
388
+ val: r,
360
389
  config: {
361
- velocity: e.velocity,
390
+ velocity: F,
362
391
  friction: 50,
363
392
  tension: 1e3
364
393
  }
365
- }), de && H ? (D({ type: "drag" }), e.cancel()) : de && B && (V({ type: "drag" }), e.cancel()), je - Math.abs(t) < -(d() * 2) && e.cancel();
394
+ }), ve && X ? (B({ type: "drag" }), e.cancel()) : ve && z && (q({ type: "drag" }), e.cancel()), qe - Math.abs(r) < -(s() * 2) && e.cancel();
366
395
  return;
367
396
  }
368
- if (e.last && c && t > 0) {
369
- y.start({
397
+ if (e.last && c && r > 0) {
398
+ b.start({
370
399
  from: {
371
- val: F()
400
+ val: k()
372
401
  },
373
402
  to: {
374
403
  val: 0
375
404
  },
376
405
  config: {
377
- velocity: e.velocity,
406
+ velocity: F,
378
407
  friction: 50,
379
408
  tension: 1e3
380
409
  }
381
410
  });
382
411
  return;
383
412
  }
384
- e.last && !e.canceled && c && (C.current === "prev" && V({ type: "drag" }), C.current === "next" && D({ type: "drag" })), e.last && !e.canceled && !c && (H ? !u && l.current ? y.start({
385
- val: -m(),
413
+ e.last && !e.canceled && c && (C.current === "prev" && q({ type: "drag" }), C.current === "next" && B({ type: "drag" })), e.last && !e.canceled && !c && (X ? !u && f.current ? b.start({
414
+ val: -h(),
386
415
  config: {
387
- ...Y.default,
388
- velocity: e.velocity
416
+ ..._.default,
417
+ velocity: F
389
418
  }
390
- }) : D({ type: "drag" }) : B ? !u && s.current ? y.start({
419
+ }) : B({ type: "drag" }) : z ? !u && d.current ? b.start({
391
420
  val: 0,
392
421
  config: {
393
- ...Y.default,
394
- velocity: e.velocity
422
+ ..._.default,
423
+ velocity: F
395
424
  }
396
- }) : V({ type: "drag" }) : y.start({
397
- val: a.current,
425
+ }) : q({ type: "drag" }) : b.start({
426
+ val: g.current,
398
427
  config: {
399
- ...Y.default,
400
- velocity: e.velocity
428
+ ..._.default,
429
+ velocity: F
401
430
  }
402
- })), e.last && e.canceled && y.start({
403
- val: a.current,
431
+ })), e.last && e.canceled && b.start({
432
+ val: g.current,
404
433
  config: {
405
- ...Y.default,
406
- velocity: e.velocity
434
+ ..._.default,
435
+ velocity: F
407
436
  }
408
437
  });
409
438
  },
410
439
  {
411
- enabled: v && !ae && !c || !!c && !!pe,
412
- axis: i,
413
- from: () => c && f.current ? [
414
- -f.current.scrollLeft,
415
- -f.current.scrollTop
416
- ] : i === "x" ? [W.val.get(), W.val.get()] : [W.val.get(), W.val.get()]
440
+ enabled: v && !me && !c || !!c && !!ce,
441
+ axis: o,
442
+ from: () => c && l.current ? [
443
+ -l.current.scrollLeft,
444
+ -l.current.scrollTop
445
+ ] : o === "x" ? [R.val.get(), R.val.get()] : [R.val.get(), R.val.get()]
417
446
  }
418
447
  );
419
448
  function Ne() {
420
- return c ? i === "x" ? {
449
+ return c ? o === "x" ? {
421
450
  overflowX: "auto"
422
451
  } : {
423
452
  overflowY: "auto"
424
453
  } : {};
425
454
  }
426
- function G() {
427
- f.current && (a.current = f.current[i === "x" ? "scrollLeft" : "scrollTop"], f.current[i === "x" ? "scrollLeft" : "scrollTop"] === 0 && (s.current = !0, l.current = !1), f.current[i === "x" ? "scrollLeft" : "scrollTop"] > 0 && f.current[i === "x" ? "scrollLeft" : "scrollTop"] < m() && (s.current = !1, l.current = !1), f.current[i === "x" ? "scrollLeft" : "scrollTop"] === m() && (s.current = !1, l.current = !0));
455
+ function te() {
456
+ l.current && (g.current = l.current[o === "x" ? "scrollLeft" : "scrollTop"], l.current[o === "x" ? "scrollLeft" : "scrollTop"] === 0 && (d.current = !0, f.current = !1), l.current[o === "x" ? "scrollLeft" : "scrollTop"] > 0 && l.current[o === "x" ? "scrollLeft" : "scrollTop"] < h() && (d.current = !1, f.current = !1), l.current[o === "x" ? "scrollLeft" : "scrollTop"] === h() && (d.current = !1, f.current = !0));
428
457
  }
429
- function Ee() {
458
+ function je() {
430
459
  return c ? {
431
460
  onWheel() {
432
- W.val.stop(), G();
461
+ R.val.stop(), te();
433
462
  }
434
463
  } : {};
435
464
  }
436
- function q(e, r) {
437
- let t = 0;
438
- if (typeof e == "string" ? t = n.findIndex((o) => o.id === e) : t = e, t < 0 || t >= n.length) {
439
- if (r)
440
- throw new Error(r);
441
- console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`), t = -1;
465
+ function H(e, t) {
466
+ let r = 0;
467
+ if (typeof e == "string" ? r = n.findIndex((i) => i.id === e) : r = e, r < 0 || r >= n.length) {
468
+ if (t)
469
+ throw new Error(t);
470
+ console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`), r = -1;
442
471
  }
443
- return t;
472
+ return r;
444
473
  }
445
- function ie({ id: e, immediate: r, shouldReset: t, type: o }) {
446
- if (!v || R.current)
474
+ function se({ id: e, immediate: t, shouldReset: r, type: i }) {
475
+ if (!v || V.current)
447
476
  return;
448
- s.current = !1, l.current = !1;
449
- const T = q(
477
+ d.current = !1, f.current = !1;
478
+ const T = H(
450
479
  e,
451
480
  "The item you want to slide to doesn't exist; check the provided id."
452
481
  );
453
- if (T === p.current && !t)
482
+ if (T === x.current && !r)
454
483
  return;
455
- const B = q(n[p.current].id), H = q(n[T].id);
456
- H > B ? D({
457
- type: o || t ? "initial" : "click",
458
- index: H,
459
- immediate: r
460
- }) : V({
461
- type: o || t ? "initial" : "click",
462
- index: H,
463
- immediate: r
484
+ const z = H(n[x.current].id), X = H(n[T].id);
485
+ X > z ? B({
486
+ type: i || r ? "initial" : "click",
487
+ index: X,
488
+ immediate: t
489
+ }) : q({
490
+ type: i || r ? "initial" : "click",
491
+ index: X,
492
+ immediate: t
464
493
  });
465
494
  }
466
- function oe(e) {
467
- const r = q(e, "The item doesn't exist; check the provided id."), t = p.current;
468
- return u && t === n.length - 1 ? r === 0 : r === t + 1;
469
- }
470
495
  function le(e) {
471
- const r = q(e, "The item doesn't exist; check the provided id."), t = p.current;
472
- return u && t === 0 ? r === n.length - 1 : r === t - 1;
496
+ const t = H(e, "The item doesn't exist; check the provided id."), r = x.current;
497
+ return u && r === n.length - 1 ? t === 0 : t === r + 1;
473
498
  }
474
- function se(e) {
475
- return q(e, "The item you want to check doesn't exist; check the provided id.") === p.current;
499
+ function ae(e) {
500
+ const t = H(e, "The item doesn't exist; check the provided id."), r = x.current;
501
+ return u && r === 0 ? t === n.length - 1 : t === r - 1;
476
502
  }
477
- function We() {
478
- return ae ? "unset" : i === "x" ? "pan-y" : "pan-x";
503
+ function de(e) {
504
+ return H(e, "The item you want to check doesn't exist; check the provided id.") === x.current;
479
505
  }
480
- const I = c ? {
481
- useListenToCustomEvent: Z,
482
- enterFullscreen: me,
483
- exitFullscreen: ge,
484
- getIsFullscreen: ve,
506
+ function Pe() {
507
+ return me ? "unset" : o === "x" ? "pan-y" : "pan-x";
508
+ }
509
+ const ge = c ? {
510
+ useListenToCustomEvent: ee,
511
+ enterFullscreen: pe,
512
+ exitFullscreen: xe,
513
+ getIsFullscreen: ye,
485
514
  slideToPrevItem: (e = !0) => {
486
- V({
515
+ q({
487
516
  type: "click",
488
517
  immediate: !e
489
518
  });
490
519
  },
491
520
  slideToNextItem: (e = !0) => {
492
- D({
521
+ B({
493
522
  type: "click",
494
523
  immediate: !e
495
524
  });
496
525
  }
497
526
  } : {
498
- useListenToCustomEvent: Z,
499
- enterFullscreen: me,
500
- exitFullscreen: ge,
501
- getIsFullscreen: ve,
527
+ useListenToCustomEvent: ee,
528
+ enterFullscreen: pe,
529
+ exitFullscreen: xe,
530
+ getIsFullscreen: ye,
502
531
  slideToPrevItem: (e = !0) => {
503
- V({
532
+ q({
504
533
  type: "click",
505
534
  immediate: !e
506
535
  });
507
536
  },
508
537
  slideToNextItem: (e = !0) => {
509
- D({
538
+ B({
510
539
  type: "click",
511
540
  immediate: !e
512
541
  });
513
542
  },
514
- slideToItem: (e, r = !0) => {
515
- ie({ id: e, immediate: !r });
543
+ slideToItem: (e, t = !0) => {
544
+ se({ id: e, immediate: !t });
516
545
  },
517
- getIsNextItem: oe,
518
- getIsPrevItem: le,
519
- getIsActiveItem: se
546
+ getIsNextItem: le,
547
+ getIsPrevItem: ae,
548
+ getIsActiveItem: de
520
549
  };
521
- Be(() => {
522
- x.current && v && (z.current = !0, he());
550
+ Xe(() => {
551
+ y.current && v && (K.current = !0, be());
523
552
  }, [v]), N(() => {
524
- p.current !== M && (z.current = !0, ie({
553
+ x.current !== M && (K.current = !0, se({
525
554
  id: M,
526
- immediate: !ye
555
+ immediate: !we
527
556
  }));
528
557
  }, [M]), N(() => {
529
558
  if (v) {
@@ -536,47 +565,66 @@ function et({
536
565
  );
537
566
  }
538
567
  }, [M, n.length, w, v]), N(() => {
539
- ne.current = window.innerWidth;
568
+ fe.current = window.innerWidth;
540
569
  }, []), N(() => {
541
- v && (z.current = !0, he());
542
- }, [A, w, h, k, v, u]), N(() => {
570
+ if (v) {
571
+ if (u && c)
572
+ throw new Error("`withLoop` and `freeScroll` can't be used together.");
573
+ if (c && p === "fixed")
574
+ throw new Error("`freeScroll` can't be used when `scrollType: fixed`.");
575
+ if (ce && (p !== "fluid" || !c))
576
+ throw new Error(
577
+ "`enableFreeScrollDrag` must be used with `slideType: fluid` and `freeScroll=true`"
578
+ );
579
+ if (j && c)
580
+ throw new Error("`slideGroupOfItems` and `freeScroll` can't be used together.");
581
+ if (typeof P == "number" && P > 0 && p === "fixed")
582
+ throw new Error("`slideAmount` must be used with `slideType: fluid`");
583
+ K.current = !0, be();
584
+ }
585
+ }, [
586
+ L,
587
+ w,
588
+ a,
589
+ I,
590
+ v,
591
+ u,
592
+ p,
593
+ c,
594
+ ce,
595
+ j
596
+ ]), N(() => {
543
597
  if (!v)
544
598
  return;
545
599
  function e() {
546
- document.hidden ? R.current = !0 : R.current = !1;
600
+ document.hidden ? V.current = !0 : V.current = !1;
547
601
  }
548
602
  return document.addEventListener("visibilitychange", e), () => {
549
603
  document.removeEventListener("visibilitychange", e);
550
604
  };
551
605
  }, [v]), N(() => {
552
- if (f.current) {
606
+ if (l.current) {
553
607
  let e;
554
- const r = new Ye(() => {
555
- if (!R.current && !z.current) {
556
- ne.current = window.innerWidth;
557
- const t = _();
608
+ const t = new Qe(() => {
609
+ if (!V.current && !K.current) {
610
+ fe.current = window.innerWidth;
611
+ const r = re();
558
612
  window.clearTimeout(e), e = setTimeout(() => {
559
- re.current = m(), typeof t == "function" && t();
613
+ ie.current = h(), typeof r == "function" && r();
560
614
  }, 100);
561
615
  }
562
616
  });
563
- return r.observe(f.current), () => {
564
- r.disconnect();
617
+ return t.observe(l.current), () => {
618
+ t.disconnect();
565
619
  };
566
620
  }
567
- }, [_, m]), N(() => {
568
- S && S({
569
- slideToNextItem: I.slideToNextItem,
570
- slideToPrevItem: I.slideToPrevItem,
571
- slideToItem: I == null ? void 0 : I.slideToItem
572
- });
573
- }, [S, I.slideToItem, I.slideToNextItem, I.slideToPrevItem]);
574
- const Pe = /* @__PURE__ */ P.jsx(fe.Provider, { value: I, children: Me }), Re = /* @__PURE__ */ P.jsx(fe.Provider, { value: I, children: /* @__PURE__ */ P.jsx(
621
+ }, [re, h]);
622
+ const Ve = /* @__PURE__ */ W.jsx(he.Provider, { value: ge, children: ke }), De = /* @__PURE__ */ W.jsx(he.Provider, { value: ge, children: /* @__PURE__ */ W.jsx(
575
623
  "div",
576
624
  {
577
625
  className: "use-spring-carousel-main-wrapper",
578
- ref: f,
579
- ...Ee(),
626
+ ref: l,
627
+ ...je(),
580
628
  style: {
581
629
  display: "flex",
582
630
  position: "relative",
@@ -584,30 +632,30 @@ function et({
584
632
  height: "100%",
585
633
  ...Ne()
586
634
  },
587
- children: /* @__PURE__ */ P.jsxs(
635
+ children: /* @__PURE__ */ W.jsxs(
588
636
  "div",
589
637
  {
590
638
  className: "use-spring-carousel-track-wrapper",
591
- ref: x,
592
- ...$e(),
639
+ ref: y,
640
+ ...We(),
593
641
  style: {
594
642
  position: "relative",
595
643
  display: "flex",
596
- flexDirection: i === "x" ? "row" : "column",
597
- touchAction: We(),
598
- ...Fe()
644
+ flexDirection: o === "x" ? "row" : "column",
645
+ touchAction: Pe(),
646
+ ...Ee()
599
647
  },
600
648
  children: [
601
- (c || !u) && h ? /* @__PURE__ */ P.jsx(
649
+ (c || !u) && a ? /* @__PURE__ */ W.jsx(
602
650
  "div",
603
651
  {
604
652
  style: {
605
653
  flexShrink: 0,
606
- width: h
654
+ width: a
607
655
  }
608
656
  }
609
657
  ) : null,
610
- Q.map((e, r) => /* @__PURE__ */ P.jsx(
658
+ A.map((e, t) => /* @__PURE__ */ W.jsx(
611
659
  "div",
612
660
  {
613
661
  className: "use-spring-carousel-item",
@@ -616,27 +664,27 @@ function et({
616
664
  display: "flex",
617
665
  position: "relative",
618
666
  flex: "1",
619
- ...Ce(
620
- r === Q.findIndex(
621
- (t) => t.id === Q[Q.length - 1].id
667
+ ...$e(
668
+ t === A.findIndex(
669
+ (r) => r.id === A[A.length - 1].id
622
670
  )
623
671
  )
624
672
  },
625
673
  children: typeof e.renderItem == "function" ? e.renderItem({
626
- getIsActiveItem: se,
627
- getIsNextItem: oe,
628
- getIsPrevItem: le,
629
- useListenToCustomEvent: Z
674
+ getIsActiveItem: de,
675
+ getIsNextItem: le,
676
+ getIsPrevItem: ae,
677
+ useListenToCustomEvent: ee
630
678
  }) : e.renderItem
631
679
  },
632
- `${e.id}-${r}`
680
+ `${e.id}-${t}`
633
681
  )),
634
- (c || !u) && h ? /* @__PURE__ */ P.jsx(
682
+ (c || !u) && a ? /* @__PURE__ */ W.jsx(
635
683
  "div",
636
684
  {
637
685
  style: {
638
686
  flexShrink: 0,
639
- width: h
687
+ width: a
640
688
  }
641
689
  }
642
690
  ) : null
@@ -645,17 +693,17 @@ function et({
645
693
  )
646
694
  }
647
695
  ) });
648
- return { ...I, carouselFragment: Re, thumbsFragment: Pe };
696
+ return { ...ge, carouselFragment: De, thumbsFragment: Ve };
649
697
  }
650
- const fe = Oe(void 0);
651
- function tt() {
652
- const n = Xe(fe);
698
+ const he = Je(void 0);
699
+ function nr() {
700
+ const n = Ke(he);
653
701
  if (!n)
654
702
  throw new Error("useSpringCarouselContext must be used within the carousel.");
655
703
  return n;
656
704
  }
657
705
  export {
658
- et as useSpringCarousel,
659
- tt as useSpringCarouselContext
706
+ tr as useSpringCarousel,
707
+ nr as useSpringCarouselContext
660
708
  };
661
709
  //# sourceMappingURL=index.es2.js.map