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