react-spring-carousel 3.0.0-beta-2.0.13 → 3.0.0-beta-2.0.16
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 +115 -104
- package/dist/index.umd.js +2 -2
- package/dist/types.d.ts +2 -1
- package/package.json +1 -1
package/dist/index.es.js
CHANGED
|
@@ -119,7 +119,7 @@ function $t(r) {
|
|
|
119
119
|
passive: e
|
|
120
120
|
};
|
|
121
121
|
}
|
|
122
|
-
function
|
|
122
|
+
function Nt(r, t = "") {
|
|
123
123
|
const e = mt[r], n = e && e[t] || t;
|
|
124
124
|
return r + n;
|
|
125
125
|
}
|
|
@@ -129,7 +129,7 @@ function W(r) {
|
|
|
129
129
|
function gt(r) {
|
|
130
130
|
return W(r) ? "touch" : "pointerType" in r ? r.pointerType : "mouse";
|
|
131
131
|
}
|
|
132
|
-
function
|
|
132
|
+
function Mt(r) {
|
|
133
133
|
return Array.from(r.touches).filter((t) => {
|
|
134
134
|
var e, n;
|
|
135
135
|
return t.target === r.currentTarget || ((e = r.currentTarget) === null || e === void 0 || (n = e.contains) === null || n === void 0 ? void 0 : n.call(e, t.target));
|
|
@@ -142,7 +142,7 @@ function vt(r) {
|
|
|
142
142
|
return W(r) ? Rt(r)[0] : r;
|
|
143
143
|
}
|
|
144
144
|
function Lt(r) {
|
|
145
|
-
return
|
|
145
|
+
return Mt(r).map((t) => t.identifier);
|
|
146
146
|
}
|
|
147
147
|
function Q(r) {
|
|
148
148
|
const t = vt(r);
|
|
@@ -249,11 +249,11 @@ class Bt {
|
|
|
249
249
|
g.addTo(e._distance, I);
|
|
250
250
|
}
|
|
251
251
|
this.axisIntent && this.axisIntent(t);
|
|
252
|
-
const [c, a] = e._movement, [u,
|
|
252
|
+
const [c, a] = e._movement, [u, d] = n.threshold, {
|
|
253
253
|
_step: f,
|
|
254
254
|
values: E
|
|
255
255
|
} = e;
|
|
256
|
-
if (n.hasCustomTransform ? (f[0] === !1 && (f[0] = Math.abs(c) >= u && E[0]), f[1] === !1 && (f[1] = Math.abs(a) >=
|
|
256
|
+
if (n.hasCustomTransform ? (f[0] === !1 && (f[0] = Math.abs(c) >= u && E[0]), f[1] === !1 && (f[1] = Math.abs(a) >= d && E[1])) : (f[0] === !1 && (f[0] = Math.abs(c) >= u && Math.sign(c) * u), f[1] === !1 && (f[1] = Math.abs(a) >= d && Math.sign(a) * d)), e.intentional = f[0] !== !1 || f[1] !== !1, !e.intentional) return;
|
|
257
257
|
const v = [0, 0];
|
|
258
258
|
if (n.hasCustomTransform) {
|
|
259
259
|
const [I, F] = E;
|
|
@@ -263,10 +263,10 @@ class Bt {
|
|
|
263
263
|
this.restrictToAxis && !e._blocked && this.restrictToAxis(v);
|
|
264
264
|
const P = e.offset, C = e._active && !e._blocked || e.active;
|
|
265
265
|
C && (e.first = e._active && !e.active, e.last = !e._active && e.active, e.active = s[this.ingKey] = e._active, t && (e.first && ("bounds" in n && (e._bounds = Y(n.bounds, e)), this.setup && this.setup()), e.movement = v, this.computeOffset()));
|
|
266
|
-
const [x, $] = e.offset, [[S, O], [R,
|
|
267
|
-
e.overflow = [x < S ? -1 : x > O ? 1 : 0, $ < R ? -1 : $ >
|
|
268
|
-
const
|
|
269
|
-
if (e.offset = It(e._bounds, e.offset,
|
|
266
|
+
const [x, $] = e.offset, [[S, O], [R, h]] = e._bounds;
|
|
267
|
+
e.overflow = [x < S ? -1 : x > O ? 1 : 0, $ < R ? -1 : $ > h ? 1 : 0], e._movementBound[0] = e.overflow[0] ? e._movementBound[0] === !1 ? e._movement[0] : e._movementBound[0] : !1, e._movementBound[1] = e.overflow[1] ? e._movementBound[1] === !1 ? e._movement[1] : e._movementBound[1] : !1;
|
|
268
|
+
const N = e._active ? n.rubberband || [0, 0] : [0, 0];
|
|
269
|
+
if (e.offset = It(e._bounds, e.offset, N), e.delta = g.sub(e.offset, P), this.computeMovement(), C && (!e.last || i > Kt)) {
|
|
270
270
|
e.delta = g.sub(e.offset, P);
|
|
271
271
|
const I = e.delta.map(Math.abs);
|
|
272
272
|
g.addTo(e.distance, I), e.direction = e.delta.map(Math.sign), e._direction = e._delta.map(Math.sign), !e.first && i > 0 && (e.velocity = [I[0] / i, I[1] / i], e.timeDelta = i);
|
|
@@ -386,7 +386,7 @@ process.env.NODE_ENV === "development" && Object.assign(et, {
|
|
|
386
386
|
return NaN;
|
|
387
387
|
}
|
|
388
388
|
});
|
|
389
|
-
const Wt = 0,
|
|
389
|
+
const Wt = 0, j = l(l({}, et), {}, {
|
|
390
390
|
axis(r, t, {
|
|
391
391
|
axis: e
|
|
392
392
|
}) {
|
|
@@ -397,7 +397,7 @@ const Wt = 0, V = l(l({}, et), {}, {
|
|
|
397
397
|
},
|
|
398
398
|
bounds(r = {}) {
|
|
399
399
|
if (typeof r == "function")
|
|
400
|
-
return (i) =>
|
|
400
|
+
return (i) => j.bounds(r(i));
|
|
401
401
|
if ("current" in r)
|
|
402
402
|
return () => r.current;
|
|
403
403
|
if (typeof HTMLElement == "function" && r instanceof HTMLElement)
|
|
@@ -434,7 +434,7 @@ class Ft extends Yt {
|
|
|
434
434
|
top: e.top - n.top + t.offset[1],
|
|
435
435
|
bottom: e.bottom - n.bottom + t.offset[1]
|
|
436
436
|
};
|
|
437
|
-
t._bounds =
|
|
437
|
+
t._bounds = j.bounds(s);
|
|
438
438
|
}
|
|
439
439
|
}
|
|
440
440
|
cancel() {
|
|
@@ -498,10 +498,10 @@ class Ft extends Yt {
|
|
|
498
498
|
if (e.tap = i <= n.tapsThreshold && c <= n.tapsThreshold, e.tap && n.filterTaps)
|
|
499
499
|
e._force = !0;
|
|
500
500
|
else {
|
|
501
|
-
const [a, u] = e._delta, [
|
|
501
|
+
const [a, u] = e._delta, [d, f] = e._movement, [E, v] = n.swipe.velocity, [P, C] = n.swipe.distance, x = n.swipe.duration;
|
|
502
502
|
if (e.elapsedTime < x) {
|
|
503
503
|
const $ = Math.abs(a / e.timeDelta), S = Math.abs(u / e.timeDelta);
|
|
504
|
-
$ > E && Math.abs(
|
|
504
|
+
$ > E && Math.abs(d) > P && (e.swipe[0] = Math.sign(a)), S > v && Math.abs(f) > C && (e.swipe[1] = Math.sign(u));
|
|
505
505
|
}
|
|
506
506
|
}
|
|
507
507
|
this.emit();
|
|
@@ -560,18 +560,18 @@ class Ft extends Yt {
|
|
|
560
560
|
function Ht(r) {
|
|
561
561
|
"persist" in r && typeof r.persist == "function" && r.persist();
|
|
562
562
|
}
|
|
563
|
-
const
|
|
564
|
-
function
|
|
565
|
-
return
|
|
563
|
+
const U = typeof window < "u" && window.document && window.document.createElement;
|
|
564
|
+
function yt() {
|
|
565
|
+
return U && "ontouchstart" in window;
|
|
566
566
|
}
|
|
567
567
|
function Xt() {
|
|
568
|
-
return
|
|
568
|
+
return yt() || U && window.navigator.maxTouchPoints > 1;
|
|
569
569
|
}
|
|
570
570
|
function Gt() {
|
|
571
|
-
return
|
|
571
|
+
return U && "onpointerdown" in window;
|
|
572
572
|
}
|
|
573
573
|
function qt() {
|
|
574
|
-
return
|
|
574
|
+
return U && "exitPointerLock" in window.document;
|
|
575
575
|
}
|
|
576
576
|
function Jt() {
|
|
577
577
|
try {
|
|
@@ -581,9 +581,9 @@ function Jt() {
|
|
|
581
581
|
}
|
|
582
582
|
}
|
|
583
583
|
const T = {
|
|
584
|
-
isBrowser:
|
|
584
|
+
isBrowser: U,
|
|
585
585
|
gesture: Jt(),
|
|
586
|
-
touch:
|
|
586
|
+
touch: yt(),
|
|
587
587
|
touchscreen: Xt(),
|
|
588
588
|
pointer: Gt(),
|
|
589
589
|
pointerLock: qt()
|
|
@@ -591,7 +591,7 @@ const T = {
|
|
|
591
591
|
mouse: 0,
|
|
592
592
|
touch: 0,
|
|
593
593
|
pen: 8
|
|
594
|
-
},
|
|
594
|
+
}, _t = l(l({}, j), {}, {
|
|
595
595
|
device(r, t, {
|
|
596
596
|
pointer: {
|
|
597
597
|
touch: e = !1,
|
|
@@ -652,7 +652,7 @@ const T = {
|
|
|
652
652
|
return r;
|
|
653
653
|
}
|
|
654
654
|
});
|
|
655
|
-
process.env.NODE_ENV === "development" && Object.assign(
|
|
655
|
+
process.env.NODE_ENV === "development" && Object.assign(_t, {
|
|
656
656
|
useTouch(r) {
|
|
657
657
|
if (r !== void 0)
|
|
658
658
|
throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");
|
|
@@ -722,10 +722,10 @@ l(l({}, et), {}, {
|
|
|
722
722
|
return r;
|
|
723
723
|
}
|
|
724
724
|
});
|
|
725
|
-
l(l({},
|
|
725
|
+
l(l({}, j), {}, {
|
|
726
726
|
mouseOnly: (r = !0) => r
|
|
727
727
|
});
|
|
728
|
-
l(l({},
|
|
728
|
+
l(l({}, j), {}, {
|
|
729
729
|
mouseOnly: (r = !0) => r
|
|
730
730
|
});
|
|
731
731
|
const bt = /* @__PURE__ */ new Map(), tt = /* @__PURE__ */ new Map();
|
|
@@ -735,7 +735,7 @@ function se(r) {
|
|
|
735
735
|
const ie = {
|
|
736
736
|
key: "drag",
|
|
737
737
|
engine: Ft,
|
|
738
|
-
resolver:
|
|
738
|
+
resolver: _t
|
|
739
739
|
};
|
|
740
740
|
function oe(r, t) {
|
|
741
741
|
if (r == null) return {};
|
|
@@ -805,7 +805,7 @@ function fe(r, t, e = {}) {
|
|
|
805
805
|
window: c,
|
|
806
806
|
enabled: a,
|
|
807
807
|
transform: u
|
|
808
|
-
} = n,
|
|
808
|
+
} = n, d = ae(n, ue);
|
|
809
809
|
if (e.shared = z({
|
|
810
810
|
target: s,
|
|
811
811
|
eventOptions: i,
|
|
@@ -816,14 +816,14 @@ function fe(r, t, e = {}) {
|
|
|
816
816
|
const f = tt.get(t);
|
|
817
817
|
e[t] = z(l({
|
|
818
818
|
shared: e.shared
|
|
819
|
-
},
|
|
819
|
+
}, d), f);
|
|
820
820
|
} else
|
|
821
|
-
for (const f in
|
|
821
|
+
for (const f in d) {
|
|
822
822
|
const E = tt.get(f);
|
|
823
823
|
if (E)
|
|
824
824
|
e[f] = z(l({
|
|
825
825
|
shared: e.shared
|
|
826
|
-
},
|
|
826
|
+
}, d[f]), E);
|
|
827
827
|
else if (process.env.NODE_ENV === "development" && !["drag", "pinch", "scroll", "wheel", "move", "hover"].includes(f)) {
|
|
828
828
|
if (f === "domTarget")
|
|
829
829
|
throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");
|
|
@@ -837,10 +837,10 @@ class wt {
|
|
|
837
837
|
y(this, "_listeners", /* @__PURE__ */ new Set()), this._ctrl = t, this._gestureKey = e;
|
|
838
838
|
}
|
|
839
839
|
add(t, e, n, s, i) {
|
|
840
|
-
const c = this._listeners, a =
|
|
841
|
-
t.addEventListener(a, s,
|
|
840
|
+
const c = this._listeners, a = Nt(e, n), u = this._gestureKey ? this._ctrl.config[this._gestureKey].eventOptions : {}, d = l(l({}, u), i);
|
|
841
|
+
t.addEventListener(a, s, d);
|
|
842
842
|
const f = () => {
|
|
843
|
-
t.removeEventListener(a, s,
|
|
843
|
+
t.removeEventListener(a, s, d), c.delete(f);
|
|
844
844
|
};
|
|
845
845
|
return c.add(f), f;
|
|
846
846
|
}
|
|
@@ -902,8 +902,8 @@ class de {
|
|
|
902
902
|
for (const c of this.gestures) {
|
|
903
903
|
const a = this.config[c], u = ht(n, a.eventOptions, !!s);
|
|
904
904
|
if (a.enabled) {
|
|
905
|
-
const
|
|
906
|
-
new
|
|
905
|
+
const d = bt.get(c);
|
|
906
|
+
new d(this, t, c).bind(u);
|
|
907
907
|
}
|
|
908
908
|
}
|
|
909
909
|
const i = ht(n, e.eventOptions, !!s);
|
|
@@ -930,15 +930,15 @@ class de {
|
|
|
930
930
|
}
|
|
931
931
|
}
|
|
932
932
|
}
|
|
933
|
-
function
|
|
933
|
+
function M(r, t) {
|
|
934
934
|
r.gestures.add(t), r.gestureEventStores[t] = new wt(r, t), r.gestureTimeoutStores[t] = new le();
|
|
935
935
|
}
|
|
936
936
|
function he(r, t) {
|
|
937
|
-
t.drag &&
|
|
937
|
+
t.drag && M(r, "drag"), t.wheel && M(r, "wheel"), t.scroll && M(r, "scroll"), t.move && M(r, "move"), t.pinch && M(r, "pinch"), t.hover && M(r, "hover");
|
|
938
938
|
}
|
|
939
939
|
const ht = (r, t, e) => (n, s, i, c = {}, a = !1) => {
|
|
940
|
-
var u,
|
|
941
|
-
const f = (u = c.capture) !== null && u !== void 0 ? u : t.capture, E = (
|
|
940
|
+
var u, d;
|
|
941
|
+
const f = (u = c.capture) !== null && u !== void 0 ? u : t.capture, E = (d = c.passive) !== null && d !== void 0 ? d : t.passive;
|
|
942
942
|
let v = a ? n : At(n, s, f);
|
|
943
943
|
e && E && (v += "Passive"), r[v] = r[v] || [], r[v].push(i);
|
|
944
944
|
};
|
|
@@ -995,12 +995,12 @@ function we({
|
|
|
995
995
|
startEndGutter: c = 0,
|
|
996
996
|
carouselAxis: a = "x",
|
|
997
997
|
slideType: u = "fixed",
|
|
998
|
-
startingPosition:
|
|
998
|
+
startingPosition: d = "start",
|
|
999
999
|
enableGestures: f = !0,
|
|
1000
1000
|
slideWhenDragThresholdIsReached: E = !0,
|
|
1001
1001
|
onInit: v
|
|
1002
1002
|
}) {
|
|
1003
|
-
const P = A(r), C = A(null), x = A(null), $ = A(0), S = A(!e), O = A(!1), R = A(0),
|
|
1003
|
+
const P = A(r), C = A(null), x = A(null), $ = A(0), S = A(!e), O = A(!1), R = A(0), h = A(0), [N, I] = xt(
|
|
1004
1004
|
() => ({
|
|
1005
1005
|
value: 0,
|
|
1006
1006
|
onChange({ value: o }) {
|
|
@@ -1014,68 +1014,70 @@ function we({
|
|
|
1014
1014
|
), F = u !== "freeScroll" && e ? [
|
|
1015
1015
|
...t.map((o) => ({
|
|
1016
1016
|
...o,
|
|
1017
|
-
id: `prev-repeated-item-${o.id}
|
|
1017
|
+
id: `prev-repeated-item-${o.id}`,
|
|
1018
|
+
isClonedItem: !0
|
|
1018
1019
|
})),
|
|
1019
1020
|
...t,
|
|
1020
1021
|
...t.map((o) => ({
|
|
1021
1022
|
...o,
|
|
1022
|
-
id: `next-repeated-item-${o.id}
|
|
1023
|
+
id: `next-repeated-item-${o.id}`,
|
|
1024
|
+
isClonedItem: !0
|
|
1023
1025
|
}))
|
|
1024
|
-
] : t, { useListenToCustomEvent: rt, emitEvent:
|
|
1026
|
+
] : t, { useListenToCustomEvent: rt, emitEvent: L } = ge();
|
|
1025
1027
|
function H(o) {
|
|
1026
|
-
P.current && (O.current ||
|
|
1028
|
+
P.current && (O.current || V({
|
|
1027
1029
|
type: "next",
|
|
1028
1030
|
toIndex: o,
|
|
1029
1031
|
actionType: "click"
|
|
1030
1032
|
}));
|
|
1031
1033
|
}
|
|
1032
1034
|
function X(o) {
|
|
1033
|
-
P.current && (S.current ||
|
|
1035
|
+
P.current && (S.current || V({
|
|
1034
1036
|
type: "prev",
|
|
1035
1037
|
toIndex: o,
|
|
1036
1038
|
actionType: "click"
|
|
1037
1039
|
}));
|
|
1038
1040
|
}
|
|
1039
|
-
function
|
|
1041
|
+
function V({
|
|
1040
1042
|
type: o,
|
|
1041
|
-
shouldAnimate:
|
|
1043
|
+
shouldAnimate: p = !0,
|
|
1042
1044
|
toIndex: D,
|
|
1043
|
-
actionType:
|
|
1045
|
+
actionType: _
|
|
1044
1046
|
}) {
|
|
1045
|
-
const
|
|
1047
|
+
const m = K(), B = !p;
|
|
1046
1048
|
S.current = !1, O.current = !1;
|
|
1047
|
-
let k =
|
|
1048
|
-
if (o === "next" && (
|
|
1049
|
+
let k = N.value.get(), b = 0;
|
|
1050
|
+
if (o === "next" && (h.current += 1), o === "prev" && (h.current === 0 ? h.current = t.length - 1 : h.current -= 1), D !== void 0 && (h.current = D), u !== "freeScroll" && o === "next") {
|
|
1049
1051
|
const w = G(
|
|
1050
|
-
e ?
|
|
1052
|
+
e ? m * (t.length * 2) : 0
|
|
1051
1053
|
);
|
|
1052
|
-
|
|
1054
|
+
b = -(h.current * m), w - Math.abs(b) < m / 1.2 && u === "fluid" && !e && (b = -w), !e && Math.abs(b) >= w && (O.current = !0, b = -w), e && h.current === t.length && (h.current = 0, k = k + m * t.length, b = 0);
|
|
1053
1055
|
}
|
|
1054
|
-
if (u !== "freeScroll" && o === "prev" && (
|
|
1056
|
+
if (u !== "freeScroll" && o === "prev" && (b = -(h.current * m), h.current === t.length - 1 && (k = k - t.length * m), !e && b >= 0 && (S.current = !0, b = 0)), u === "freeScroll" && o === "next") {
|
|
1055
1057
|
const w = x.current[a === "x" ? "scrollLeft" : "scrollTop"];
|
|
1056
|
-
k = w,
|
|
1058
|
+
k = w, b = w + m;
|
|
1057
1059
|
}
|
|
1058
1060
|
if (u === "freeScroll" && o === "prev") {
|
|
1059
1061
|
const w = x.current[a === "x" ? "scrollLeft" : "scrollTop"];
|
|
1060
|
-
k = w,
|
|
1062
|
+
k = w, b = w - m;
|
|
1061
1063
|
}
|
|
1062
|
-
$.current =
|
|
1064
|
+
$.current = b, L(_ === "resize" ? {
|
|
1063
1065
|
eventName: "onResize",
|
|
1064
|
-
sliceActionType:
|
|
1066
|
+
sliceActionType: _,
|
|
1065
1067
|
slideDirection: o,
|
|
1066
1068
|
currentItem: {
|
|
1067
|
-
index:
|
|
1068
|
-
id: t
|
|
1069
|
+
index: h.current,
|
|
1070
|
+
id: t.at(h.current).id,
|
|
1069
1071
|
startReached: S.current,
|
|
1070
1072
|
endReached: O.current
|
|
1071
1073
|
}
|
|
1072
1074
|
} : {
|
|
1073
1075
|
eventName: "onSlideStartChange",
|
|
1074
|
-
sliceActionType:
|
|
1076
|
+
sliceActionType: _,
|
|
1075
1077
|
slideDirection: o,
|
|
1076
1078
|
nextItem: {
|
|
1077
|
-
index:
|
|
1078
|
-
id: t
|
|
1079
|
+
index: h.current,
|
|
1080
|
+
id: t.at(h.current).id,
|
|
1079
1081
|
startReached: S.current,
|
|
1080
1082
|
endReached: O.current
|
|
1081
1083
|
}
|
|
@@ -1085,22 +1087,22 @@ function we({
|
|
|
1085
1087
|
value: k
|
|
1086
1088
|
},
|
|
1087
1089
|
to: {
|
|
1088
|
-
value:
|
|
1090
|
+
value: b
|
|
1089
1091
|
},
|
|
1090
1092
|
onRest({ finished: w }) {
|
|
1091
|
-
w && u === "fixed" &&
|
|
1093
|
+
w && u === "fixed" && L({
|
|
1092
1094
|
eventName: "onSlideChangeComplete",
|
|
1093
|
-
sliceActionType:
|
|
1095
|
+
sliceActionType: _,
|
|
1094
1096
|
slideDirection: o,
|
|
1095
1097
|
currentItem: {
|
|
1096
|
-
index:
|
|
1097
|
-
id: t
|
|
1098
|
+
index: h.current,
|
|
1099
|
+
id: t.at(h.current).id,
|
|
1098
1100
|
startReached: S.current,
|
|
1099
1101
|
endReached: O.current
|
|
1100
1102
|
}
|
|
1101
|
-
}), w && u === "fluid" &&
|
|
1103
|
+
}), w && u === "fluid" && L({
|
|
1102
1104
|
eventName: "onSlideChangeComplete",
|
|
1103
|
-
sliceActionType:
|
|
1105
|
+
sliceActionType: _,
|
|
1104
1106
|
slideDirection: o,
|
|
1105
1107
|
currentItem: {
|
|
1106
1108
|
index: 0,
|
|
@@ -1114,67 +1116,71 @@ function we({
|
|
|
1114
1116
|
}
|
|
1115
1117
|
function K() {
|
|
1116
1118
|
const o = x.current.children[0];
|
|
1117
|
-
let
|
|
1118
|
-
return
|
|
1119
|
+
let p = 0;
|
|
1120
|
+
return p = o.getBoundingClientRect()[a === "x" ? "width" : "height"] + i, p;
|
|
1119
1121
|
}
|
|
1120
1122
|
function G(o) {
|
|
1121
|
-
const
|
|
1122
|
-
return
|
|
1123
|
+
const p = x.current;
|
|
1124
|
+
return p[a === "x" ? "scrollWidth" : "scrollHeight"] - p.getBoundingClientRect()[a === "x" ? "width" : "height"] - o;
|
|
1123
1125
|
}
|
|
1124
1126
|
pt(() => {
|
|
1125
|
-
function o(
|
|
1126
|
-
switch (
|
|
1127
|
+
function o(_, m) {
|
|
1128
|
+
switch (_) {
|
|
1127
1129
|
case "start":
|
|
1128
1130
|
return 0;
|
|
1129
1131
|
case "middle-start":
|
|
1130
|
-
return Math.floor((
|
|
1132
|
+
return Math.floor((m - 1) * 0.25);
|
|
1131
1133
|
case "center":
|
|
1132
|
-
return Math.floor((
|
|
1134
|
+
return Math.floor((m - 1) * 0.5);
|
|
1133
1135
|
case "middle-end":
|
|
1134
|
-
return Math.floor((
|
|
1136
|
+
return Math.floor((m - 1) * 0.75);
|
|
1135
1137
|
case "end":
|
|
1136
|
-
return
|
|
1138
|
+
return m - 1;
|
|
1137
1139
|
default:
|
|
1138
1140
|
return 0;
|
|
1139
1141
|
}
|
|
1140
1142
|
}
|
|
1141
|
-
function
|
|
1143
|
+
function p(_) {
|
|
1142
1144
|
if (C.current) {
|
|
1143
|
-
let
|
|
1144
|
-
e && (
|
|
1145
|
+
let m = 0;
|
|
1146
|
+
e && (m = K() * t.length), m -= K() * o(d, s), m -= c, C.current.style.setProperty(
|
|
1145
1147
|
`--${n}-offset-modifier`,
|
|
1146
|
-
`${-
|
|
1147
|
-
),
|
|
1148
|
+
`${-m}px`
|
|
1149
|
+
), _ && _();
|
|
1148
1150
|
}
|
|
1149
1151
|
}
|
|
1150
1152
|
function D() {
|
|
1151
|
-
|
|
1153
|
+
p(), V({
|
|
1152
1154
|
type: "next",
|
|
1153
|
-
toIndex:
|
|
1155
|
+
toIndex: h.current,
|
|
1154
1156
|
shouldAnimate: !1,
|
|
1155
1157
|
actionType: "resize"
|
|
1156
1158
|
});
|
|
1157
1159
|
}
|
|
1158
1160
|
if (r && (R.current = K() / 4), r && u === "fixed")
|
|
1159
|
-
return
|
|
1161
|
+
return p(v), window.addEventListener("resize", D), () => {
|
|
1160
1162
|
window.removeEventListener("resize", D);
|
|
1161
1163
|
};
|
|
1162
|
-
}, [r, e, n, a, i,
|
|
1164
|
+
}, [r, e, n, a, i, d, u]);
|
|
1163
1165
|
const Et = me(
|
|
1164
1166
|
(o) => {
|
|
1165
1167
|
if (!P.current)
|
|
1166
1168
|
return;
|
|
1167
|
-
const
|
|
1168
|
-
|
|
1169
|
+
const p = o.dragging, D = o.offset[a === "x" ? 0 : 1], _ = o.movement[a === "x" ? 0 : 1], m = _ > R.current, B = _ < -R.current, k = o.velocity;
|
|
1170
|
+
p && (L({
|
|
1171
|
+
...o,
|
|
1172
|
+
eventName: "onDrag",
|
|
1173
|
+
slideActionType: "drag"
|
|
1174
|
+
}), I.start({
|
|
1169
1175
|
value: D,
|
|
1170
1176
|
immediate: !0,
|
|
1171
1177
|
config: {
|
|
1172
1178
|
velocity: k
|
|
1173
1179
|
}
|
|
1174
|
-
}), E && (
|
|
1180
|
+
}), E && (m || B) && o.cancel()), o.last && (m ? V({
|
|
1175
1181
|
actionType: "drag",
|
|
1176
1182
|
type: "prev"
|
|
1177
|
-
}) : B ?
|
|
1183
|
+
}) : B ? V({
|
|
1178
1184
|
actionType: "drag",
|
|
1179
1185
|
type: "next"
|
|
1180
1186
|
}) : I.start({
|
|
@@ -1196,7 +1202,7 @@ function we({
|
|
|
1196
1202
|
bottom: 0
|
|
1197
1203
|
})
|
|
1198
1204
|
},
|
|
1199
|
-
from: () => [
|
|
1205
|
+
from: () => [N.value.get(), N.value.get()]
|
|
1200
1206
|
}
|
|
1201
1207
|
);
|
|
1202
1208
|
return {
|
|
@@ -1254,18 +1260,23 @@ function we({
|
|
|
1254
1260
|
...Et(),
|
|
1255
1261
|
...u === "freeScroll" ? {
|
|
1256
1262
|
onWheel() {
|
|
1257
|
-
|
|
1263
|
+
N.value.stop();
|
|
1258
1264
|
}
|
|
1259
1265
|
} : {},
|
|
1260
|
-
children: F.map((o,
|
|
1266
|
+
children: F.map((o, p) => /* @__PURE__ */ q(
|
|
1261
1267
|
"div",
|
|
1262
1268
|
{
|
|
1263
1269
|
className: "ReactSpringCarouselItem",
|
|
1264
1270
|
"data-part": "Item",
|
|
1265
1271
|
"data-part-internal": `${n}-Item`,
|
|
1266
|
-
|
|
1272
|
+
"data-id": o.id,
|
|
1273
|
+
children: typeof o.renderItem == "function" ? o.renderItem({
|
|
1274
|
+
useListenToCustomEvent: rt,
|
|
1275
|
+
index: p,
|
|
1276
|
+
isClonedItem: !!o.isClonedItem
|
|
1277
|
+
}) : o.renderItem
|
|
1267
1278
|
},
|
|
1268
|
-
`${o.id}-${
|
|
1279
|
+
`${o.id}-${p}`
|
|
1269
1280
|
))
|
|
1270
1281
|
}
|
|
1271
1282
|
)
|
|
@@ -1283,17 +1294,17 @@ function we({
|
|
|
1283
1294
|
);
|
|
1284
1295
|
return;
|
|
1285
1296
|
}
|
|
1286
|
-
o >
|
|
1297
|
+
o > h.current ? H(o) : X(o);
|
|
1287
1298
|
}
|
|
1288
1299
|
if (typeof o == "string") {
|
|
1289
|
-
const
|
|
1290
|
-
if (
|
|
1300
|
+
const p = t.findIndex((D) => D.id === o);
|
|
1301
|
+
if (p < 0) {
|
|
1291
1302
|
console.warn(
|
|
1292
1303
|
`The item you're trying to slide doesn't exist. id: ${o}`
|
|
1293
1304
|
);
|
|
1294
1305
|
return;
|
|
1295
1306
|
}
|
|
1296
|
-
|
|
1307
|
+
p > h.current ? H(p) : X(p);
|
|
1297
1308
|
}
|
|
1298
1309
|
}
|
|
1299
1310
|
};
|
package/dist/index.umd.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(O,M){typeof exports=="object"&&typeof module<"u"?M(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"],M):(O=typeof globalThis<"u"?globalThis:O||self,M(O["react-spring-carousel"]={},O["react/jsx-runtime"],O["@react-spring/web"],O.React))})(this,function(O,M,we,y){"use strict";function Ee(r,e,t){return Math.max(e,Math.min(r,t))}const g={toVector(r,e){return r===void 0&&(r=e),Array.isArray(r)?r:[r,r]},add(r,e){return[r[0]+e[0],r[1]+e[1]]},sub(r,e){return[r[0]-e[0],r[1]-e[1]]},addTo(r,e){r[0]+=e[0],r[1]+=e[1]},subTo(r,e){r[0]-=e[0],r[1]-=e[1]}};function re(r,e,t){return e===0||Math.abs(e)===1/0?Math.pow(r,t*5):r*e*t/(e+t*r)}function ne(r,e,t,n=.15){return n===0?Ee(r,e,t):r<e?-re(e-r,t-e,n)+e:r>t?+re(r-t,t-e,n)+t:r}function Te(r,[e,t],[n,s]){const[[i,c],[a,u]]=r;return[ne(e,i,c,n),ne(t,a,u,s)]}function xe(r,e){if(typeof r!="object"||r===null)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var n=t.call(r,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(r)}function Se(r){var e=xe(r,"string");return typeof e=="symbol"?e:String(e)}function _(r,e,t){return e=Se(e),e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function se(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(r,s).enumerable})),t.push.apply(t,n)}return t}function l(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?se(Object(t),!0).forEach(function(n){_(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):se(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}const ie={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 oe(r){return r?r[0].toUpperCase()+r.slice(1):""}const Ie=["enter","leave"];function De(r=!1,e){return r&&!Ie.includes(e)}function ke(r,e="",t=!1){const n=ie[r],s=n&&n[e]||e;return"on"+oe(r)+oe(s)+(De(t,s)?"Capture":"")}const Ce=["gotpointercapture","lostpointercapture"];function Oe(r){let e=r.substring(2).toLowerCase();const t=!!~e.indexOf("passive");t&&(e=e.replace("passive",""));const n=Ce.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:t}}function Ae(r,e=""){const t=ie[r],n=t&&t[e]||e;return r+n}function B(r){return"touches"in r}function ae(r){return B(r)?"touch":"pointerType"in r?r.pointerType:"mouse"}function Pe(r){return Array.from(r.touches).filter(e=>{var t,n;return e.target===r.currentTarget||((t=r.currentTarget)===null||t===void 0||(n=t.contains)===null||n===void 0?void 0:n.call(t,e.target))})}function Me(r){return r.type==="touchend"||r.type==="touchcancel"?r.changedTouches:r.targetTouches}function ce(r){return B(r)?Me(r)[0]:r}function $e(r){return Pe(r).map(e=>e.identifier)}function X(r){const e=ce(r);return B(r)?e.identifier:e.pointerId}function ue(r){const e=ce(r);return[e.clientX,e.clientY]}function Ne(r){const e={};if("buttons"in r&&(e.buttons=r.buttons),"shiftKey"in r){const{shiftKey:t,altKey:n,metaKey:s,ctrlKey:i}=r;Object.assign(e,{shiftKey:t,altKey:n,metaKey:s,ctrlKey:i})}return e}function z(r,...e){return typeof r=="function"?r(...e):r}function Le(){}function Re(...r){return r.length===0?Le:r.length===1?r[0]:function(){let e;for(const t of r)e=t.apply(this,arguments)||e;return e}}function fe(r,e){return Object.assign({},e,r||{})}const Ve=32;class je{constructor(e,t,n){this.ctrl=e,this.args=t,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:t,ingKey:n,args:s}=this;t[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 t=this.state,n=this.config;t._active||(this.reset(),this.computeInitial(),t._active=!0,t.target=e.target,t.currentTarget=e.currentTarget,t.lastOffset=n.from?z(n.from,t):t.offset,t.offset=t.lastOffset,t.startTime=t.timeStamp=e.timeStamp)}computeValues(e){const t=this.state;t._values=e,t.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:t,config:n,shared:s}=this;t.args=this.args;let i=0;if(e&&(t.event=e,n.preventDefault&&e.cancelable&&t.event.preventDefault(),t.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ne(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,i=e.timeStamp-t.timeStamp,t.timeStamp=e.timeStamp,t.elapsedTime=t.timeStamp-t.startTime),t._active){const D=t._delta.map(Math.abs);g.addTo(t._distance,D)}this.axisIntent&&this.axisIntent(e);const[c,a]=t._movement,[u,p]=n.threshold,{_step:f,values:x}=t;if(n.hasCustomTransform?(f[0]===!1&&(f[0]=Math.abs(c)>=u&&x[0]),f[1]===!1&&(f[1]=Math.abs(a)>=p&&x[1])):(f[0]===!1&&(f[0]=Math.abs(c)>=u&&Math.sign(c)*u),f[1]===!1&&(f[1]=Math.abs(a)>=p&&Math.sign(a)*p)),t.intentional=f[0]!==!1||f[1]!==!1,!t.intentional)return;const v=[0,0];if(n.hasCustomTransform){const[D,Q]=x;v[0]=f[0]!==!1?D-f[0]:0,v[1]=f[1]!==!1?Q-f[1]:0}else v[0]=f[0]!==!1?c-f[0]:0,v[1]=f[1]!==!1?a-f[1]:0;this.restrictToAxis&&!t._blocked&&this.restrictToAxis(v);const $=t.offset,A=t._active&&!t._blocked||t.active;A&&(t.first=t._active&&!t.active,t.last=!t._active&&t.active,t.active=s[this.ingKey]=t._active,e&&(t.first&&("bounds"in n&&(t._bounds=z(n.bounds,t)),this.setup&&this.setup()),t.movement=v,this.computeOffset()));const[S,N]=t.offset,[[I,P],[U,d]]=t._bounds;t.overflow=[S<I?-1:S>P?1:0,N<U?-1:N>d?1:0],t._movementBound[0]=t.overflow[0]?t._movementBound[0]===!1?t._movement[0]:t._movementBound[0]:!1,t._movementBound[1]=t.overflow[1]?t._movementBound[1]===!1?t._movement[1]:t._movementBound[1]:!1;const R=t._active?n.rubberband||[0,0]:[0,0];if(t.offset=Te(t._bounds,t.offset,R),t.delta=g.sub(t.offset,$),this.computeMovement(),A&&(!t.last||i>Ve)){t.delta=g.sub(t.offset,$);const D=t.delta.map(Math.abs);g.addTo(t.distance,D),t.direction=t.delta.map(Math.sign),t._direction=t._delta.map(Math.sign),!t.first&&i>0&&(t.velocity=[D[0]/i,D[1]/i],t.timeDelta=i)}}emit(){const e=this.state,t=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(l(l(l({},t),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Ue([r,e],t){const n=Math.abs(r),s=Math.abs(e);if(n>s&&n>t)return"x";if(s>n&&s>t)return"y"}class Ke extends je{constructor(...e){super(...e),_(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=g.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=g.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const t=this.state,n=this.config;if(!t.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ae(e)]:n.axisThreshold;t.axis=Ue(t._movement,s)}t._blocked=(n.lockDirection||!!n.axis)&&!t.axis||!!n.axis&&n.axis!==t.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 le=r=>r,de=.15,q={enabled(r=!0){return r},eventOptions(r,e,t){return l(l({},t.shared.eventOptions),r)},preventDefault(r=!1){return r},triggerAllEvents(r=!1){return r},rubberband(r=0){switch(r){case!0:return[de,de];case!1:return[0,0];default:return g.toVector(r)}},from(r){if(typeof r=="function")return r;if(r!=null)return g.toVector(r)},transform(r,e,t){const n=r||t.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||le;return i=>{const c=s(i);return(!isFinite(c[0])||!isFinite(c[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${c[0]},${[1]}]`),c}}return n||le},threshold(r){return g.toVector(r,0)}};process.env.NODE_ENV==="development"&&Object.assign(q,{domTarget(r){if(r!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(r){if(r!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(r){if(r!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const Be=0,V=l(l({},q),{},{axis(r,e,{axis:t}){if(this.lockDirection=t==="lock",!this.lockDirection)return t},axisThreshold(r=Be){return r},bounds(r={}){if(typeof r=="function")return i=>V.bounds(r(i));if("current"in r)return()=>r.current;if(typeof HTMLElement=="function"&&r instanceof HTMLElement)return r;const{left:e=-1/0,right:t=1/0,top:n=-1/0,bottom:s=1/0}=r;return[[e,t],[n,s]]}}),he={ArrowRight:(r,e=1)=>[r*e,0],ArrowLeft:(r,e=1)=>[-1*r*e,0],ArrowUp:(r,e=1)=>[0,-1*r*e],ArrowDown:(r,e=1)=>[0,r*e]};class ze extends Ke{constructor(...e){super(...e),_(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 t=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:t.left-n.left+e.offset[0],right:t.right-n.right+e.offset[0],top:t.top-n.top+e.offset[1],bottom:t.bottom-n.bottom+e.offset[1]};e._bounds=V.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 t=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(t.pointerButtons)?!t.pointerButtons.includes(e.buttons):t.pointerButtons!==-1&&t.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);t.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=X(e),n._pointerActive=!0,this.computeValues(ue(e)),this.computeInitial(),t.preventScrollAxis&&ae(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):t.delay>0?(this.setupDelayTrigger(e),t.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const t=this.state;t._active=!0,t._preventScroll=!0,t._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const t=this.state,n=this.config;if(!t._pointerActive)return;const s=X(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;const i=ue(e);if(document.pointerLockElement===e.target?t._delta=[e.movementX,e.movementY]:(t._delta=g.sub(i,t._values),this.computeValues(i)),g.addTo(t._movement,t._delta),this.compute(e),t._delayed&&t.intentional){this.timeoutStore.remove("dragDelay"),t.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!t._preventScroll)if(t.axis)if(t.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){t._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 t=this.state,n=this.config;if(!t._active||!t._pointerActive)return;const s=X(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[i,c]=t._distance;if(t.tap=i<=n.tapsThreshold&&c<=n.tapsThreshold,t.tap&&n.filterTaps)t._force=!0;else{const[a,u]=t._delta,[p,f]=t._movement,[x,v]=n.swipe.velocity,[$,A]=n.swipe.distance,S=n.swipe.duration;if(t.elapsedTime<S){const N=Math.abs(a/t.timeDelta),I=Math.abs(u/t.timeDelta);N>x&&Math.abs(p)>$&&(t.swipe[0]=Math.sign(a)),I>v&&Math.abs(f)>A&&(t.swipe[1]=Math.sign(u))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const t=this.config,n=t.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&t.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{}t.pointerLock&&e.currentTarget.requestPointerLock(),t.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,Ye(e);const t=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",t),this.eventStore.add(this.sharedConfig.window,"touch","cancel",t),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 t=he[e.key];if(t){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=t(this.config.keyboardDisplacement,s),n._keyboardActive=!0,g.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in he&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const t=this.config.device;e(t,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(t,"change",this.pointerMove.bind(this)),e(t,"end",this.pointerUp.bind(this)),e(t,"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 Ye(r){"persist"in r&&typeof r.persist=="function"&&r.persist()}const j=typeof window<"u"&&window.document&&window.document.createElement;function pe(){return j&&"ontouchstart"in window}function We(){return pe()||j&&window.navigator.maxTouchPoints>1}function Fe(){return j&&"onpointerdown"in window}function He(){return j&&"exitPointerLock"in window.document}function Xe(){try{return"constructor"in GestureEvent}catch{return!1}}const T={isBrowser:j,gesture:Xe(),touch:pe(),touchscreen:We(),pointer:Fe(),pointerLock:He()},qe=250,Ge=180,Je=.5,Qe=50,Ze=250,et=10,me={mouse:0,touch:0,pen:8},ge=l(l({},V),{},{device(r,e,{pointer:{touch:t=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&T.pointerLock,T.touch&&t?"touch":this.pointerLock?"mouse":T.pointer&&!s?"pointer":T.touch?"touch":"mouse"},preventScrollAxis(r,e,{preventScroll:t}){if(this.preventScrollDelay=typeof t=="number"?t:t||t===void 0&&r?qe:void 0,!(!T.touchscreen||t===!1))return r||(t!==void 0?"y":void 0)},pointerCapture(r,e,{pointer:{capture:t=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&t},threshold(r,e,{filterTaps:t=!1,tapsThreshold:n=3,axis:s=void 0}){const i=g.toVector(r,t?n:s?1:0);return this.filterTaps=t,this.tapsThreshold=n,i},swipe({velocity:r=Je,distance:e=Qe,duration:t=Ze}={}){return{velocity:this.transform(g.toVector(r)),distance:this.transform(g.toVector(e)),duration:t}},delay(r=0){switch(r){case!0:return Ge;case!1:return 0;default:return r}},axisThreshold(r){return r?l(l({},me),r):me},keyboardDisplacement(r=et){return r}});process.env.NODE_ENV==="development"&&Object.assign(ge,{useTouch(r){if(r!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(r){if(r!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),l(l({},q),{},{device(r,e,{shared:t,pointer:{touch:n=!1}={}}){if(t.target&&!T.touch&&T.gesture)return"gesture";if(T.touch&&n)return"touch";if(T.touchscreen){if(T.pointer)return"pointer";if(T.touch)return"touch"}},bounds(r,e,{scaleBounds:t={},angleBounds:n={}}){const s=c=>{const a=fe(z(t,c),{min:-1/0,max:1/0});return[a.min,a.max]},i=c=>{const a=fe(z(n,c),{min:-1/0,max:1/0});return[a.min,a.max]};return typeof t!="function"&&typeof n!="function"?[s(),i()]:c=>[s(c),i(c)]},threshold(r,e,t){return this.lockDirection=t.axis==="lock",g.toVector(r,this.lockDirection?[.1,3]:0)},modifierKey(r){return r===void 0?"ctrlKey":r},pinchOnWheel(r=!0){return r}}),l(l({},V),{},{mouseOnly:(r=!0)=>r}),l(l({},V),{},{mouseOnly:(r=!0)=>r});const ve=new Map,G=new Map;function tt(r){ve.set(r.key,r.engine),G.set(r.key,r.resolver)}const rt={key:"drag",engine:ze,resolver:ge};function nt(r,e){if(r==null)return{};var t={},n=Object.keys(r),s,i;for(i=0;i<n.length;i++)s=n[i],!(e.indexOf(s)>=0)&&(t[s]=r[s]);return t}function st(r,e){if(r==null)return{};var t=nt(r,e),n,s;if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(r);for(s=0;s<i.length;s++)n=i[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}const it={target(r){if(r)return()=>"current"in r?r.current:r},enabled(r=!0){return r},window(r=T.isBrowser?window:void 0){return r},eventOptions({passive:r=!0,capture:e=!1}={}){return{passive:r,capture:e}},transform(r){return r}},ot=["target","eventOptions","window","enabled","transform"];function Y(r={},e){const t={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const i=s.call(t,r[n],n,r);Number.isNaN(i)||(t[n]=i)}else t[n]=s.call(t,r[n],n,r);break;case"object":t[n]=Y(r[n],s);break;case"boolean":s&&(t[n]=r[n]);break}return t}function at(r,e,t={}){const n=r,{target:s,eventOptions:i,window:c,enabled:a,transform:u}=n,p=st(n,ot);if(t.shared=Y({target:s,eventOptions:i,window:c,enabled:a,transform:u},it),e){const f=G.get(e);t[e]=Y(l({shared:t.shared},p),f)}else for(const f in p){const x=G.get(f);if(x)t[f]=Y(l({shared:t.shared},p[f]),x);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(f)){if(f==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${f}\` was used. Please read the documentation for further information.`)}}return t}class ye{constructor(e,t){_(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=t}add(e,t,n,s,i){const c=this._listeners,a=Ae(t,n),u=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},p=l(l({},u),i);e.addEventListener(a,s,p);const f=()=>{e.removeEventListener(a,s,p),c.delete(f)};return c.add(f),f}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class ct{constructor(){_(this,"_timeouts",new Map)}add(e,t,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(t,n,...s))}remove(e){const t=this._timeouts.get(e);t&&window.clearTimeout(t)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class ut{constructor(e){_(this,"gestures",new Set),_(this,"_targetEventStore",new ye(this)),_(this,"gestureEventStores",{}),_(this,"gestureTimeoutStores",{}),_(this,"handlers",{}),_(this,"config",{}),_(this,"pointerIds",new Set),_(this,"touchIds",new Set),_(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),ft(this,e)}setEventIds(e){if(B(e))return this.touchIds=new Set($e(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,t){this.handlers=e,this.nativeHandlers=t}applyConfig(e,t){this.config=at(e,t,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 t=this.config.shared,n={};let s;if(!(t.target&&(s=t.target(),!s))){if(t.enabled){for(const c of this.gestures){const a=this.config[c],u=_e(n,a.eventOptions,!!s);if(a.enabled){const p=ve.get(c);new p(this,e,c).bind(u)}}const i=_e(n,t.eventOptions,!!s);for(const c in this.nativeHandlers)i(c,"",a=>this.nativeHandlers[c](l(l({},this.state.shared),{},{event:a,args:e})),void 0,!0)}for(const i in n)n[i]=Re(...n[i]);if(!s)return n;for(const i in n){const{device:c,capture:a,passive:u}=Oe(i);this._targetEventStore.add(s,c,"",n[i],{capture:a,passive:u})}}}}function L(r,e){r.gestures.add(e),r.gestureEventStores[e]=new ye(r,e),r.gestureTimeoutStores[e]=new ct}function ft(r,e){e.drag&&L(r,"drag"),e.wheel&&L(r,"wheel"),e.scroll&&L(r,"scroll"),e.move&&L(r,"move"),e.pinch&&L(r,"pinch"),e.hover&&L(r,"hover")}const _e=(r,e,t)=>(n,s,i,c={},a=!1)=>{var u,p;const f=(u=c.capture)!==null&&u!==void 0?u:e.capture,x=(p=c.passive)!==null&&p!==void 0?p:e.passive;let v=a?n:ke(n,s,f);t&&x&&(v+="Passive"),r[v]=r[v]||[],r[v].push(i)};function lt(r,e={},t,n){const s=y.useMemo(()=>new ut(r),[]);if(s.applyHandlers(r,n),s.applyConfig(e,t),y.useEffect(s.effect.bind(s)),y.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function dt(r,e){return tt(rt),lt({drag:r},e||{},"drag")}const J="RSC::Event";function ht(){const r=y.useRef(null);function e(n){y.useEffect(()=>{r.current||(r.current=document.createElement("div"));function s(i){n(i.detail)}if(r.current)return r.current.addEventListener(J,s,!1),()=>{var i;(i=r.current)==null||i.removeEventListener(J,s,!1)}},[n])}function t(n){if(r.current){const s=new CustomEvent(J,{detail:n});r.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:t}}function pt({init:r=!0,items:e,withLoop:t=!1,id:n,itemsPerSlide:s=1,gutter:i=0,startEndGutter:c=0,carouselAxis:a="x",slideType:u="fixed",startingPosition:p="start",enableGestures:f=!0,slideWhenDragThresholdIsReached:x=!0,onInit:v}){const $=y.useRef(r),A=y.useRef(null),S=y.useRef(null),N=y.useRef(0),I=y.useRef(!t),P=y.useRef(!1),U=y.useRef(0),d=y.useRef(0),[R,D]=we.useSpring(()=>({value:0,onChange({value:o}){(u==="fixed"||u==="fluid")&&A.current.style.setProperty(`--${n}-offset-position`,`${o.value}px`),u==="freeScroll"&&(S.current[a==="x"?"scrollLeft":"scrollTop"]=Math.abs(o.value))}}),[a]),Q=u!=="freeScroll"&&t?[...e.map(o=>({...o,id:`prev-repeated-item-${o.id}`})),...e,...e.map(o=>({...o,id:`next-repeated-item-${o.id}`}))]:e,{useListenToCustomEvent:be,emitEvent:W}=ht();function Z(o){$.current&&(P.current||K({type:"next",toIndex:o,actionType:"click"}))}function ee(o){$.current&&(I.current||K({type:"prev",toIndex:o,actionType:"click"}))}function K({type:o,shouldAnimate:m=!0,toIndex:k,actionType:w}){const h=F(),H=!m;I.current=!1,P.current=!1;let C=R.value.get(),b=0;if(o==="next"&&(d.current+=1),o==="prev"&&(d.current-=1),k!==void 0&&(d.current=k),u!=="freeScroll"&&o==="next"){const E=te(t?h*(e.length*2):0);b=-(d.current*h),E-Math.abs(b)<h/1.2&&u==="fluid"&&!t&&(b=-E),!t&&Math.abs(b)>=E&&(P.current=!0,b=-E),t&&d.current===e.length&&(d.current=0,C=C+h*e.length,b=0)}if(u!=="freeScroll"&&o==="prev"&&(b=-(d.current*h),!t&&b>=0&&(I.current=!0,b=0),t&&d.current<0&&Math.abs(d.current)===e.length/2&&(C=C-h*e.length,b=-(Math.abs(d.current)*h),d.current=e.length/2)),u==="freeScroll"&&o==="next"){const E=S.current[a==="x"?"scrollLeft":"scrollTop"];C=E,b=E+h}if(u==="freeScroll"&&o==="prev"){const E=S.current[a==="x"?"scrollLeft":"scrollTop"];C=E,b=E-h}N.current=b,W(w==="resize"?{eventName:"onResize",sliceActionType:w,slideDirection:o,currentItem:{index:d.current,id:e[d.current].id,startReached:I.current,endReached:P.current}}:{eventName:"onSlideStartChange",sliceActionType:w,slideDirection:o,nextItem:{index:d.current,id:e[d.current].id,startReached:I.current,endReached:P.current}}),D.start({immediate:H,from:{value:C},to:{value:b},onRest({finished:E}){E&&u==="fixed"&&W({eventName:"onSlideChangeComplete",sliceActionType:w,slideDirection:o,currentItem:{index:d.current,id:e[d.current].id,startReached:I.current,endReached:P.current}}),E&&u==="fluid"&&W({eventName:"onSlideChangeComplete",sliceActionType:w,slideDirection:o,currentItem:{index:0,id:"",startReached:I.current,endReached:P.current}})}})}function F(){const o=S.current.children[0];let m=0;return m=o.getBoundingClientRect()[a==="x"?"width":"height"]+i,m}function te(o){const m=S.current;return m[a==="x"?"scrollWidth":"scrollHeight"]-m.getBoundingClientRect()[a==="x"?"width":"height"]-o}y.useEffect(()=>{function o(w,h){switch(w){case"start":return 0;case"middle-start":return Math.floor((h-1)*.25);case"center":return Math.floor((h-1)*.5);case"middle-end":return Math.floor((h-1)*.75);case"end":return h-1;default:return 0}}function m(w){if(A.current){let h=0;t&&(h=F()*e.length),h-=F()*o(p,s),h-=c,A.current.style.setProperty(`--${n}-offset-modifier`,`${-h}px`),w&&w()}}function k(){m(),K({type:"next",toIndex:d.current,shouldAnimate:!1,actionType:"resize"})}if(r&&(U.current=F()/4),r&&u==="fixed")return m(v),window.addEventListener("resize",k),()=>{window.removeEventListener("resize",k)}},[r,t,n,a,i,p,u]);const mt=dt(o=>{if(!$.current)return;const m=o.dragging,k=o.offset[a==="x"?0:1],w=o.movement[a==="x"?0:1],h=w>U.current,H=w<-U.current,C=o.velocity;m&&(D.start({value:k,immediate:!0,config:{velocity:C}}),x&&(h||H)&&o.cancel()),o.last&&(h?K({actionType:"drag",type:"prev"}):H?K({actionType:"drag",type:"next"}):D.start({value:N.current,config:{velocity:C}}))},{enabled:f&&u!=="freeScroll",axis:a,rubberband:!t,...t?{}:{bounds:()=>({right:0,left:-te(0),top:-te(0),bottom:0})},from:()=>[R.value.get(),R.value.get()]});return{carouselFragment:M.jsxs("div",{ref:A,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,children:[M.jsx("style",{dangerouslySetInnerHTML:{__html:`
|
|
1
|
+
(function(O,$){typeof exports=="object"&&typeof module<"u"?$(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"],$):(O=typeof globalThis<"u"?globalThis:O||self,$(O["react-spring-carousel"]={},O["react/jsx-runtime"],O["@react-spring/web"],O.React))})(this,function(O,$,we,y){"use strict";function Ee(r,e,t){return Math.max(e,Math.min(r,t))}const g={toVector(r,e){return r===void 0&&(r=e),Array.isArray(r)?r:[r,r]},add(r,e){return[r[0]+e[0],r[1]+e[1]]},sub(r,e){return[r[0]-e[0],r[1]-e[1]]},addTo(r,e){r[0]+=e[0],r[1]+=e[1]},subTo(r,e){r[0]-=e[0],r[1]-=e[1]}};function re(r,e,t){return e===0||Math.abs(e)===1/0?Math.pow(r,t*5):r*e*t/(e+t*r)}function ne(r,e,t,n=.15){return n===0?Ee(r,e,t):r<e?-re(e-r,t-e,n)+e:r>t?+re(r-t,t-e,n)+t:r}function Te(r,[e,t],[n,s]){const[[i,c],[a,u]]=r;return[ne(e,i,c,n),ne(t,a,u,s)]}function xe(r,e){if(typeof r!="object"||r===null)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var n=t.call(r,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(r)}function Se(r){var e=xe(r,"string");return typeof e=="symbol"?e:String(e)}function _(r,e,t){return e=Se(e),e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function se(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(r,s).enumerable})),t.push.apply(t,n)}return t}function l(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?se(Object(t),!0).forEach(function(n){_(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):se(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}const ie={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 oe(r){return r?r[0].toUpperCase()+r.slice(1):""}const Ie=["enter","leave"];function De(r=!1,e){return r&&!Ie.includes(e)}function ke(r,e="",t=!1){const n=ie[r],s=n&&n[e]||e;return"on"+oe(r)+oe(s)+(De(t,s)?"Capture":"")}const Ce=["gotpointercapture","lostpointercapture"];function Oe(r){let e=r.substring(2).toLowerCase();const t=!!~e.indexOf("passive");t&&(e=e.replace("passive",""));const n=Ce.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:t}}function Ae(r,e=""){const t=ie[r],n=t&&t[e]||e;return r+n}function z(r){return"touches"in r}function ae(r){return z(r)?"touch":"pointerType"in r?r.pointerType:"mouse"}function Pe(r){return Array.from(r.touches).filter(e=>{var t,n;return e.target===r.currentTarget||((t=r.currentTarget)===null||t===void 0||(n=t.contains)===null||n===void 0?void 0:n.call(t,e.target))})}function $e(r){return r.type==="touchend"||r.type==="touchcancel"?r.changedTouches:r.targetTouches}function ce(r){return z(r)?$e(r)[0]:r}function Me(r){return Pe(r).map(e=>e.identifier)}function X(r){const e=ce(r);return z(r)?e.identifier:e.pointerId}function ue(r){const e=ce(r);return[e.clientX,e.clientY]}function Ne(r){const e={};if("buttons"in r&&(e.buttons=r.buttons),"shiftKey"in r){const{shiftKey:t,altKey:n,metaKey:s,ctrlKey:i}=r;Object.assign(e,{shiftKey:t,altKey:n,metaKey:s,ctrlKey:i})}return e}function Y(r,...e){return typeof r=="function"?r(...e):r}function Le(){}function Re(...r){return r.length===0?Le:r.length===1?r[0]:function(){let e;for(const t of r)e=t.apply(this,arguments)||e;return e}}function fe(r,e){return Object.assign({},e,r||{})}const Ve=32;class je{constructor(e,t,n){this.ctrl=e,this.args=t,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:t,ingKey:n,args:s}=this;t[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 t=this.state,n=this.config;t._active||(this.reset(),this.computeInitial(),t._active=!0,t.target=e.target,t.currentTarget=e.currentTarget,t.lastOffset=n.from?Y(n.from,t):t.offset,t.offset=t.lastOffset,t.startTime=t.timeStamp=e.timeStamp)}computeValues(e){const t=this.state;t._values=e,t.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:t,config:n,shared:s}=this;t.args=this.args;let i=0;if(e&&(t.event=e,n.preventDefault&&e.cancelable&&t.event.preventDefault(),t.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ne(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,i=e.timeStamp-t.timeStamp,t.timeStamp=e.timeStamp,t.elapsedTime=t.timeStamp-t.startTime),t._active){const D=t._delta.map(Math.abs);g.addTo(t._distance,D)}this.axisIntent&&this.axisIntent(e);const[c,a]=t._movement,[u,d]=n.threshold,{_step:f,values:x}=t;if(n.hasCustomTransform?(f[0]===!1&&(f[0]=Math.abs(c)>=u&&x[0]),f[1]===!1&&(f[1]=Math.abs(a)>=d&&x[1])):(f[0]===!1&&(f[0]=Math.abs(c)>=u&&Math.sign(c)*u),f[1]===!1&&(f[1]=Math.abs(a)>=d&&Math.sign(a)*d)),t.intentional=f[0]!==!1||f[1]!==!1,!t.intentional)return;const v=[0,0];if(n.hasCustomTransform){const[D,Q]=x;v[0]=f[0]!==!1?D-f[0]:0,v[1]=f[1]!==!1?Q-f[1]:0}else v[0]=f[0]!==!1?c-f[0]:0,v[1]=f[1]!==!1?a-f[1]:0;this.restrictToAxis&&!t._blocked&&this.restrictToAxis(v);const M=t.offset,A=t._active&&!t._blocked||t.active;A&&(t.first=t._active&&!t.active,t.last=!t._active&&t.active,t.active=s[this.ingKey]=t._active,e&&(t.first&&("bounds"in n&&(t._bounds=Y(n.bounds,t)),this.setup&&this.setup()),t.movement=v,this.computeOffset()));const[S,N]=t.offset,[[I,P],[U,h]]=t._bounds;t.overflow=[S<I?-1:S>P?1:0,N<U?-1:N>h?1:0],t._movementBound[0]=t.overflow[0]?t._movementBound[0]===!1?t._movement[0]:t._movementBound[0]:!1,t._movementBound[1]=t.overflow[1]?t._movementBound[1]===!1?t._movement[1]:t._movementBound[1]:!1;const R=t._active?n.rubberband||[0,0]:[0,0];if(t.offset=Te(t._bounds,t.offset,R),t.delta=g.sub(t.offset,M),this.computeMovement(),A&&(!t.last||i>Ve)){t.delta=g.sub(t.offset,M);const D=t.delta.map(Math.abs);g.addTo(t.distance,D),t.direction=t.delta.map(Math.sign),t._direction=t._delta.map(Math.sign),!t.first&&i>0&&(t.velocity=[D[0]/i,D[1]/i],t.timeDelta=i)}}emit(){const e=this.state,t=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(l(l(l({},t),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Ue([r,e],t){const n=Math.abs(r),s=Math.abs(e);if(n>s&&n>t)return"x";if(s>n&&s>t)return"y"}class Ke extends je{constructor(...e){super(...e),_(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=g.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=g.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const t=this.state,n=this.config;if(!t.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ae(e)]:n.axisThreshold;t.axis=Ue(t._movement,s)}t._blocked=(n.lockDirection||!!n.axis)&&!t.axis||!!n.axis&&n.axis!==t.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 le=r=>r,de=.15,q={enabled(r=!0){return r},eventOptions(r,e,t){return l(l({},t.shared.eventOptions),r)},preventDefault(r=!1){return r},triggerAllEvents(r=!1){return r},rubberband(r=0){switch(r){case!0:return[de,de];case!1:return[0,0];default:return g.toVector(r)}},from(r){if(typeof r=="function")return r;if(r!=null)return g.toVector(r)},transform(r,e,t){const n=r||t.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||le;return i=>{const c=s(i);return(!isFinite(c[0])||!isFinite(c[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${c[0]},${[1]}]`),c}}return n||le},threshold(r){return g.toVector(r,0)}};process.env.NODE_ENV==="development"&&Object.assign(q,{domTarget(r){if(r!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(r){if(r!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(r){if(r!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const Be=0,V=l(l({},q),{},{axis(r,e,{axis:t}){if(this.lockDirection=t==="lock",!this.lockDirection)return t},axisThreshold(r=Be){return r},bounds(r={}){if(typeof r=="function")return i=>V.bounds(r(i));if("current"in r)return()=>r.current;if(typeof HTMLElement=="function"&&r instanceof HTMLElement)return r;const{left:e=-1/0,right:t=1/0,top:n=-1/0,bottom:s=1/0}=r;return[[e,t],[n,s]]}}),he={ArrowRight:(r,e=1)=>[r*e,0],ArrowLeft:(r,e=1)=>[-1*r*e,0],ArrowUp:(r,e=1)=>[0,-1*r*e],ArrowDown:(r,e=1)=>[0,r*e]};class ze extends Ke{constructor(...e){super(...e),_(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 t=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:t.left-n.left+e.offset[0],right:t.right-n.right+e.offset[0],top:t.top-n.top+e.offset[1],bottom:t.bottom-n.bottom+e.offset[1]};e._bounds=V.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 t=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(t.pointerButtons)?!t.pointerButtons.includes(e.buttons):t.pointerButtons!==-1&&t.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);t.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=X(e),n._pointerActive=!0,this.computeValues(ue(e)),this.computeInitial(),t.preventScrollAxis&&ae(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):t.delay>0?(this.setupDelayTrigger(e),t.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const t=this.state;t._active=!0,t._preventScroll=!0,t._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const t=this.state,n=this.config;if(!t._pointerActive)return;const s=X(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;const i=ue(e);if(document.pointerLockElement===e.target?t._delta=[e.movementX,e.movementY]:(t._delta=g.sub(i,t._values),this.computeValues(i)),g.addTo(t._movement,t._delta),this.compute(e),t._delayed&&t.intentional){this.timeoutStore.remove("dragDelay"),t.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!t._preventScroll)if(t.axis)if(t.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){t._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 t=this.state,n=this.config;if(!t._active||!t._pointerActive)return;const s=X(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[i,c]=t._distance;if(t.tap=i<=n.tapsThreshold&&c<=n.tapsThreshold,t.tap&&n.filterTaps)t._force=!0;else{const[a,u]=t._delta,[d,f]=t._movement,[x,v]=n.swipe.velocity,[M,A]=n.swipe.distance,S=n.swipe.duration;if(t.elapsedTime<S){const N=Math.abs(a/t.timeDelta),I=Math.abs(u/t.timeDelta);N>x&&Math.abs(d)>M&&(t.swipe[0]=Math.sign(a)),I>v&&Math.abs(f)>A&&(t.swipe[1]=Math.sign(u))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const t=this.config,n=t.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&t.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{}t.pointerLock&&e.currentTarget.requestPointerLock(),t.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,Ye(e);const t=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",t),this.eventStore.add(this.sharedConfig.window,"touch","cancel",t),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 t=he[e.key];if(t){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=t(this.config.keyboardDisplacement,s),n._keyboardActive=!0,g.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in he&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const t=this.config.device;e(t,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(t,"change",this.pointerMove.bind(this)),e(t,"end",this.pointerUp.bind(this)),e(t,"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 Ye(r){"persist"in r&&typeof r.persist=="function"&&r.persist()}const j=typeof window<"u"&&window.document&&window.document.createElement;function pe(){return j&&"ontouchstart"in window}function We(){return pe()||j&&window.navigator.maxTouchPoints>1}function Fe(){return j&&"onpointerdown"in window}function He(){return j&&"exitPointerLock"in window.document}function Xe(){try{return"constructor"in GestureEvent}catch{return!1}}const T={isBrowser:j,gesture:Xe(),touch:pe(),touchscreen:We(),pointer:Fe(),pointerLock:He()},qe=250,Ge=180,Je=.5,Qe=50,Ze=250,et=10,me={mouse:0,touch:0,pen:8},ge=l(l({},V),{},{device(r,e,{pointer:{touch:t=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&T.pointerLock,T.touch&&t?"touch":this.pointerLock?"mouse":T.pointer&&!s?"pointer":T.touch?"touch":"mouse"},preventScrollAxis(r,e,{preventScroll:t}){if(this.preventScrollDelay=typeof t=="number"?t:t||t===void 0&&r?qe:void 0,!(!T.touchscreen||t===!1))return r||(t!==void 0?"y":void 0)},pointerCapture(r,e,{pointer:{capture:t=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&t},threshold(r,e,{filterTaps:t=!1,tapsThreshold:n=3,axis:s=void 0}){const i=g.toVector(r,t?n:s?1:0);return this.filterTaps=t,this.tapsThreshold=n,i},swipe({velocity:r=Je,distance:e=Qe,duration:t=Ze}={}){return{velocity:this.transform(g.toVector(r)),distance:this.transform(g.toVector(e)),duration:t}},delay(r=0){switch(r){case!0:return Ge;case!1:return 0;default:return r}},axisThreshold(r){return r?l(l({},me),r):me},keyboardDisplacement(r=et){return r}});process.env.NODE_ENV==="development"&&Object.assign(ge,{useTouch(r){if(r!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(r){if(r!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),l(l({},q),{},{device(r,e,{shared:t,pointer:{touch:n=!1}={}}){if(t.target&&!T.touch&&T.gesture)return"gesture";if(T.touch&&n)return"touch";if(T.touchscreen){if(T.pointer)return"pointer";if(T.touch)return"touch"}},bounds(r,e,{scaleBounds:t={},angleBounds:n={}}){const s=c=>{const a=fe(Y(t,c),{min:-1/0,max:1/0});return[a.min,a.max]},i=c=>{const a=fe(Y(n,c),{min:-1/0,max:1/0});return[a.min,a.max]};return typeof t!="function"&&typeof n!="function"?[s(),i()]:c=>[s(c),i(c)]},threshold(r,e,t){return this.lockDirection=t.axis==="lock",g.toVector(r,this.lockDirection?[.1,3]:0)},modifierKey(r){return r===void 0?"ctrlKey":r},pinchOnWheel(r=!0){return r}}),l(l({},V),{},{mouseOnly:(r=!0)=>r}),l(l({},V),{},{mouseOnly:(r=!0)=>r});const ve=new Map,G=new Map;function tt(r){ve.set(r.key,r.engine),G.set(r.key,r.resolver)}const rt={key:"drag",engine:ze,resolver:ge};function nt(r,e){if(r==null)return{};var t={},n=Object.keys(r),s,i;for(i=0;i<n.length;i++)s=n[i],!(e.indexOf(s)>=0)&&(t[s]=r[s]);return t}function st(r,e){if(r==null)return{};var t=nt(r,e),n,s;if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(r);for(s=0;s<i.length;s++)n=i[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}const it={target(r){if(r)return()=>"current"in r?r.current:r},enabled(r=!0){return r},window(r=T.isBrowser?window:void 0){return r},eventOptions({passive:r=!0,capture:e=!1}={}){return{passive:r,capture:e}},transform(r){return r}},ot=["target","eventOptions","window","enabled","transform"];function W(r={},e){const t={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const i=s.call(t,r[n],n,r);Number.isNaN(i)||(t[n]=i)}else t[n]=s.call(t,r[n],n,r);break;case"object":t[n]=W(r[n],s);break;case"boolean":s&&(t[n]=r[n]);break}return t}function at(r,e,t={}){const n=r,{target:s,eventOptions:i,window:c,enabled:a,transform:u}=n,d=st(n,ot);if(t.shared=W({target:s,eventOptions:i,window:c,enabled:a,transform:u},it),e){const f=G.get(e);t[e]=W(l({shared:t.shared},d),f)}else for(const f in d){const x=G.get(f);if(x)t[f]=W(l({shared:t.shared},d[f]),x);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(f)){if(f==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${f}\` was used. Please read the documentation for further information.`)}}return t}class ye{constructor(e,t){_(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=t}add(e,t,n,s,i){const c=this._listeners,a=Ae(t,n),u=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},d=l(l({},u),i);e.addEventListener(a,s,d);const f=()=>{e.removeEventListener(a,s,d),c.delete(f)};return c.add(f),f}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class ct{constructor(){_(this,"_timeouts",new Map)}add(e,t,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(t,n,...s))}remove(e){const t=this._timeouts.get(e);t&&window.clearTimeout(t)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class ut{constructor(e){_(this,"gestures",new Set),_(this,"_targetEventStore",new ye(this)),_(this,"gestureEventStores",{}),_(this,"gestureTimeoutStores",{}),_(this,"handlers",{}),_(this,"config",{}),_(this,"pointerIds",new Set),_(this,"touchIds",new Set),_(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),ft(this,e)}setEventIds(e){if(z(e))return this.touchIds=new Set(Me(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,t){this.handlers=e,this.nativeHandlers=t}applyConfig(e,t){this.config=at(e,t,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 t=this.config.shared,n={};let s;if(!(t.target&&(s=t.target(),!s))){if(t.enabled){for(const c of this.gestures){const a=this.config[c],u=_e(n,a.eventOptions,!!s);if(a.enabled){const d=ve.get(c);new d(this,e,c).bind(u)}}const i=_e(n,t.eventOptions,!!s);for(const c in this.nativeHandlers)i(c,"",a=>this.nativeHandlers[c](l(l({},this.state.shared),{},{event:a,args:e})),void 0,!0)}for(const i in n)n[i]=Re(...n[i]);if(!s)return n;for(const i in n){const{device:c,capture:a,passive:u}=Oe(i);this._targetEventStore.add(s,c,"",n[i],{capture:a,passive:u})}}}}function L(r,e){r.gestures.add(e),r.gestureEventStores[e]=new ye(r,e),r.gestureTimeoutStores[e]=new ct}function ft(r,e){e.drag&&L(r,"drag"),e.wheel&&L(r,"wheel"),e.scroll&&L(r,"scroll"),e.move&&L(r,"move"),e.pinch&&L(r,"pinch"),e.hover&&L(r,"hover")}const _e=(r,e,t)=>(n,s,i,c={},a=!1)=>{var u,d;const f=(u=c.capture)!==null&&u!==void 0?u:e.capture,x=(d=c.passive)!==null&&d!==void 0?d:e.passive;let v=a?n:ke(n,s,f);t&&x&&(v+="Passive"),r[v]=r[v]||[],r[v].push(i)};function lt(r,e={},t,n){const s=y.useMemo(()=>new ut(r),[]);if(s.applyHandlers(r,n),s.applyConfig(e,t),y.useEffect(s.effect.bind(s)),y.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function dt(r,e){return tt(rt),lt({drag:r},e||{},"drag")}const J="RSC::Event";function ht(){const r=y.useRef(null);function e(n){y.useEffect(()=>{r.current||(r.current=document.createElement("div"));function s(i){n(i.detail)}if(r.current)return r.current.addEventListener(J,s,!1),()=>{var i;(i=r.current)==null||i.removeEventListener(J,s,!1)}},[n])}function t(n){if(r.current){const s=new CustomEvent(J,{detail:n});r.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:t}}function pt({init:r=!0,items:e,withLoop:t=!1,id:n,itemsPerSlide:s=1,gutter:i=0,startEndGutter:c=0,carouselAxis:a="x",slideType:u="fixed",startingPosition:d="start",enableGestures:f=!0,slideWhenDragThresholdIsReached:x=!0,onInit:v}){const M=y.useRef(r),A=y.useRef(null),S=y.useRef(null),N=y.useRef(0),I=y.useRef(!t),P=y.useRef(!1),U=y.useRef(0),h=y.useRef(0),[R,D]=we.useSpring(()=>({value:0,onChange({value:o}){(u==="fixed"||u==="fluid")&&A.current.style.setProperty(`--${n}-offset-position`,`${o.value}px`),u==="freeScroll"&&(S.current[a==="x"?"scrollLeft":"scrollTop"]=Math.abs(o.value))}}),[a]),Q=u!=="freeScroll"&&t?[...e.map(o=>({...o,id:`prev-repeated-item-${o.id}`,isClonedItem:!0})),...e,...e.map(o=>({...o,id:`next-repeated-item-${o.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:be,emitEvent:K}=ht();function Z(o){M.current&&(P.current||B({type:"next",toIndex:o,actionType:"click"}))}function ee(o){M.current&&(I.current||B({type:"prev",toIndex:o,actionType:"click"}))}function B({type:o,shouldAnimate:p=!0,toIndex:k,actionType:b}){const m=F(),H=!p;I.current=!1,P.current=!1;let C=R.value.get(),w=0;if(o==="next"&&(h.current+=1),o==="prev"&&(h.current===0?h.current=e.length-1:h.current-=1),k!==void 0&&(h.current=k),u!=="freeScroll"&&o==="next"){const E=te(t?m*(e.length*2):0);w=-(h.current*m),E-Math.abs(w)<m/1.2&&u==="fluid"&&!t&&(w=-E),!t&&Math.abs(w)>=E&&(P.current=!0,w=-E),t&&h.current===e.length&&(h.current=0,C=C+m*e.length,w=0)}if(u!=="freeScroll"&&o==="prev"&&(w=-(h.current*m),h.current===e.length-1&&(C=C-e.length*m),!t&&w>=0&&(I.current=!0,w=0)),u==="freeScroll"&&o==="next"){const E=S.current[a==="x"?"scrollLeft":"scrollTop"];C=E,w=E+m}if(u==="freeScroll"&&o==="prev"){const E=S.current[a==="x"?"scrollLeft":"scrollTop"];C=E,w=E-m}N.current=w,K(b==="resize"?{eventName:"onResize",sliceActionType:b,slideDirection:o,currentItem:{index:h.current,id:e.at(h.current).id,startReached:I.current,endReached:P.current}}:{eventName:"onSlideStartChange",sliceActionType:b,slideDirection:o,nextItem:{index:h.current,id:e.at(h.current).id,startReached:I.current,endReached:P.current}}),D.start({immediate:H,from:{value:C},to:{value:w},onRest({finished:E}){E&&u==="fixed"&&K({eventName:"onSlideChangeComplete",sliceActionType:b,slideDirection:o,currentItem:{index:h.current,id:e.at(h.current).id,startReached:I.current,endReached:P.current}}),E&&u==="fluid"&&K({eventName:"onSlideChangeComplete",sliceActionType:b,slideDirection:o,currentItem:{index:0,id:"",startReached:I.current,endReached:P.current}})}})}function F(){const o=S.current.children[0];let p=0;return p=o.getBoundingClientRect()[a==="x"?"width":"height"]+i,p}function te(o){const p=S.current;return p[a==="x"?"scrollWidth":"scrollHeight"]-p.getBoundingClientRect()[a==="x"?"width":"height"]-o}y.useEffect(()=>{function o(b,m){switch(b){case"start":return 0;case"middle-start":return Math.floor((m-1)*.25);case"center":return Math.floor((m-1)*.5);case"middle-end":return Math.floor((m-1)*.75);case"end":return m-1;default:return 0}}function p(b){if(A.current){let m=0;t&&(m=F()*e.length),m-=F()*o(d,s),m-=c,A.current.style.setProperty(`--${n}-offset-modifier`,`${-m}px`),b&&b()}}function k(){p(),B({type:"next",toIndex:h.current,shouldAnimate:!1,actionType:"resize"})}if(r&&(U.current=F()/4),r&&u==="fixed")return p(v),window.addEventListener("resize",k),()=>{window.removeEventListener("resize",k)}},[r,t,n,a,i,d,u]);const mt=dt(o=>{if(!M.current)return;const p=o.dragging,k=o.offset[a==="x"?0:1],b=o.movement[a==="x"?0:1],m=b>U.current,H=b<-U.current,C=o.velocity;p&&(K({...o,eventName:"onDrag",slideActionType:"drag"}),D.start({value:k,immediate:!0,config:{velocity:C}}),x&&(m||H)&&o.cancel()),o.last&&(m?B({actionType:"drag",type:"prev"}):H?B({actionType:"drag",type:"next"}):D.start({value:N.current,config:{velocity:C}}))},{enabled:f&&u!=="freeScroll",axis:a,rubberband:!t,...t?{}:{bounds:()=>({right:0,left:-te(0),top:-te(0),bottom:0})},from:()=>[R.value.get(),R.value.get()]});return{carouselFragment:$.jsxs("div",{ref:A,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,children:[$.jsx("style",{dangerouslySetInnerHTML:{__html:`
|
|
2
2
|
[data-part-internal="${n}-Container"] {
|
|
3
3
|
display: flex;
|
|
4
4
|
width: 100%;
|
|
@@ -26,4 +26,4 @@
|
|
|
26
26
|
display: flex;
|
|
27
27
|
flex: ${u==="fixed"?`1 0 calc(100% / var(--${n}-items-per-slide) - calc(var(--${n}-gutter) * (var(--${n}-items-per-slide) - 1)) / var(--${n}-items-per-slide) - calc(var(--${n}-start-end-gutter) / var(--${n}-items-per-slide)))`:"1"};
|
|
28
28
|
}
|
|
29
|
-
`}})
|
|
29
|
+
`}}),$.jsx("div",{ref:S,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,...mt(),...u==="freeScroll"?{onWheel(){R.value.stop()}}:{},children:Q.map((o,p)=>$.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":o.id,children:typeof o.renderItem=="function"?o.renderItem({useListenToCustomEvent:be,index:p,isClonedItem:!!o.isClonedItem}):o.renderItem},`${o.id}-${p}`))})]}),useListenToCustomEvent:be,slideToNextItem:()=>Z(),slideToPrevItem:()=>ee(),slideToItem:o=>{if(typeof o=="number"){if(!e[o]){console.warn(`The item you're trying to slide doesn't exist. index: ${o}`);return}o>h.current?Z(o):ee(o)}if(typeof o=="string"){const p=e.findIndex(k=>k.id===o);if(p<0){console.warn(`The item you're trying to slide doesn't exist. id: ${o}`);return}p>h.current?Z(p):ee(p)}}}}O.useSpringCarousel=pt,Object.defineProperty(O,Symbol.toStringTag,{value:"Module"})});
|
package/dist/types.d.ts
CHANGED
|
@@ -2,10 +2,11 @@ import { FullGestureState } from '@use-gesture/react';
|
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
export type SlideType = "fixed" | "fluid" | "freeScroll";
|
|
4
4
|
export type CarouselAxis = "x" | "y";
|
|
5
|
-
type Item = {
|
|
5
|
+
export type Item = {
|
|
6
6
|
id: string;
|
|
7
7
|
renderItem: ReactNode | ((props: {
|
|
8
8
|
index: number;
|
|
9
|
+
isClonedItem: boolean;
|
|
9
10
|
useListenToCustomEvent(eventHandler: SpringCarouselEventsEventHandler): void;
|
|
10
11
|
}) => ReactNode);
|
|
11
12
|
};
|