@smwb/ui-solid 0.1.1 → 0.2.1
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/assets/styles/less/components/carousel/carousel.entry.css +1 -1
- package/dist/components/dataDisplay/carousel/carousel.d.ts +10 -0
- package/dist/components/dataDisplay/carousel/carousel.js +223 -106
- package/dist/components/dataDisplay/carousel/carousel.js.map +1 -1
- package/dist/components/dataDisplay/carousel/utils.d.ts +5 -0
- package/dist/components/dataDisplay/carousel/utils.js +26 -12
- package/dist/components/dataDisplay/carousel/utils.js.map +1 -1
- package/dist/headless/components/dataDisplay/carousel/carousel.js +223 -106
- package/dist/headless/components/dataDisplay/carousel/carousel.js.map +1 -1
- package/dist/headless/components/dataDisplay/carousel/utils.js +26 -12
- package/dist/headless/components/dataDisplay/carousel/utils.js.map +1 -1
- package/package.json +8 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
.smwb-carousel{max-width:412px}.smwb-carousel__inner{position:relative}.smwb-carousel__track{text-align:center;overflow:hidden;cursor:pointer;margin-left
|
|
1
|
+
.smwb-carousel{max-width:var(--smwb-carousel-max-width, 412px)}.smwb-carousel__inner{position:relative}.smwb-carousel__track{text-align:center;overflow:hidden;cursor:pointer;margin-left:calc(-1 * var(--smwb-carousel-gap, 4px));margin-right:calc(-1 * var(--smwb-carousel-gap, 4px));touch-action:pan-y}.smwb-carousel__layer{width:100%;height:100%;display:flex;will-change:transform}.smwb-carousel__slide{flex-shrink:0;padding-left:var(--smwb-carousel-gap, 4px);padding-right:var(--smwb-carousel-gap, 4px)}.smwb-carousel__slide-inner{border-radius:28px;overflow:hidden;will-change:width}.smwb-carousel__slide-inner_clickable{cursor:zoom-in}.smwb-carousel__slide-inner img{height:var(--smwb-carousel-cell-height, 205px);aspect-ratio:var(--smwb-carousel-aspect-ratio, .9);object-fit:cover;width:100%;user-select:none;-webkit-user-drag:none}.smwb-carousel__navigation{display:flex;justify-content:center}.smwb-carousel__navigation .current{background-color:var(--smui-onPrimaryContainerActive)}.smwb-carousel__navigation__dot{margin:3px;width:10px;height:10px;border-radius:50%;border:1px solid var(--smui-onPrimaryContainer)}.smwb-carousel__arrow{cursor:pointer;position:absolute;background:var(--smui-onPrimaryContainerActive);color:var(--smui-onPrimaryContainer);border-radius:50%;z-index:1;display:flex;align-items:center;justify-content:center}.smwb-carousel__fullscreen-content{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.smwb-carousel__fullscreen-stage{display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%}.smwb-carousel__fullscreen-stage img{max-width:96vw;max-height:92vh;width:auto;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none}.smwb-carousel__fullscreen-arrow,.smwb-carousel__fullscreen-close{position:absolute;z-index:1;cursor:pointer;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}.smwb-carousel__fullscreen-arrow{top:50%;transform:translateY(-50%)}.smwb-carousel__fullscreen-arrow_prev{left:16px}.smwb-carousel__fullscreen-arrow_next{right:16px}.smwb-carousel__fullscreen-close{top:16px;right:16px}
|
|
@@ -14,6 +14,16 @@ export interface CarouselProps {
|
|
|
14
14
|
autoplay?: boolean;
|
|
15
15
|
autoplayInterval?: number;
|
|
16
16
|
pauseOnHover?: boolean;
|
|
17
|
+
/** Height of each cell/photo. Number is treated as px. Overrides the default 205px. */
|
|
18
|
+
cellHeight?: number | string;
|
|
19
|
+
/** Aspect ratio of each cell/photo (e.g. 0.9 or "16 / 9"). Overrides the default 0.9. */
|
|
20
|
+
aspectRatio?: number | string;
|
|
21
|
+
/** Per-side spacing around each slide. Number is treated as px (default 4). */
|
|
22
|
+
gap?: number | string;
|
|
23
|
+
/** Max width of the carousel. Number is treated as px (default 412). */
|
|
24
|
+
maxWidth?: number | string;
|
|
25
|
+
/** Open the clicked slide in a fullscreen lightbox (arrows / swipe / Esc to navigate & close). */
|
|
26
|
+
enableFullscreen?: boolean;
|
|
17
27
|
ref?: Ref<HTMLDivElement>;
|
|
18
28
|
}
|
|
19
29
|
export declare function Carousel(props: ParentProps<CarouselProps>): JSX.Element;
|
|
@@ -1,13 +1,15 @@
|
|
|
1
|
-
import { addEventListener as
|
|
1
|
+
import { addEventListener as k, use as O, insert as h, createComponent as f, effect as P, setAttribute as ee, style as te, className as z, setStyleProperty as re, template as F, delegateEvents as Ee } from "solid-js/web";
|
|
2
2
|
import '../../../assets/styles/less/components/carousel/carousel.entry.css';/* empty css */
|
|
3
|
-
import { mergeProps as
|
|
4
|
-
import
|
|
5
|
-
import { dragPrevent as
|
|
6
|
-
import { mergeRefs as
|
|
7
|
-
import { Icon as
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
3
|
+
import { mergeProps as ke, splitProps as Te, children as Xe, createSignal as S, createUniqueId as Le, createEffect as A, createMemo as se, onCleanup as ne, Show as I, For as oe } from "solid-js";
|
|
4
|
+
import p from "clsx";
|
|
5
|
+
import { toCssLength as Y, toCssNumber as Me, dragPrevent as le, getSlideStyle as Pe, getStartSlide as ze, getSlidesToShow as Ae, clamp as Fe, getSlideIndexForMultipleParts as ae, coordX as V, coordY as ie, getSlideWidth as Ne, isMouseEvent as ce, isTouchEvent as De } from "./utils.js";
|
|
6
|
+
import { mergeRefs as He } from "../../../primitives/mergeRefs.js";
|
|
7
|
+
import { Icon as T } from "../../base/icon/icon.js";
|
|
8
|
+
import { Modal as Re } from "../../feedBack/modal/modal.js";
|
|
9
|
+
var ue = /* @__PURE__ */ F("<div>"), Oe = /* @__PURE__ */ F("<div class=smwb-carousel__fullscreen-content><div class=smwb-carousel__fullscreen-stage>"), Ye = /* @__PURE__ */ F("<div data-testid=carousel role=region aria-roledescription=carousel><div class=smwb-carousel__inner><div class=smwb-carousel__track><div class=smwb-carousel__layer>"), Ve = /* @__PURE__ */ F("<div class=smwb-carousel__slide><div>");
|
|
10
|
+
const de = 8, We = 0.4, W = () => typeof performance < "u" ? performance.now() : Date.now();
|
|
11
|
+
function Ze(fe) {
|
|
12
|
+
const me = ke({
|
|
11
13
|
slidesToShow: 3,
|
|
12
14
|
startSlide: 0,
|
|
13
15
|
showNavigation: !0,
|
|
@@ -15,162 +17,277 @@ function Ee(Q) {
|
|
|
15
17
|
"aria-label": "Carousel",
|
|
16
18
|
autoplay: !1,
|
|
17
19
|
autoplayInterval: 4e3,
|
|
18
|
-
pauseOnHover: !0
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
pauseOnHover: !0,
|
|
21
|
+
enableFullscreen: !1
|
|
22
|
+
}, fe), [s] = Te(me, ["slidesToShow", "startSlide", "children", "class", "showNavigation", "showArrows", "arrowsSize", "navigationClassName", "onSlideChange", "navigationDotRenderer", "aria-label", "autoplay", "autoplayInterval", "pauseOnHover", "cellHeight", "aspectRatio", "gap", "maxWidth", "enableFullscreen", "ref"]), he = Xe(() => s.children), N = () => he.toArray(), o = () => N().length, d = () => Ae(s.slidesToShow, o()), K = () => ze(s.startSlide, o()), q = () => !!s.showArrows && o() > 1, X = () => Math.max(0, o() - d()), [g, B] = S(K()), [D, H] = S(void 0), [ge, G] = S(!1), [ve, U] = S(0), [we, j] = S(!1), [y, L] = S(null);
|
|
23
|
+
let M, v;
|
|
24
|
+
const l = {
|
|
22
25
|
isPressed: !1,
|
|
23
26
|
startX: 0,
|
|
24
|
-
startY: 0
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
startY: 0,
|
|
28
|
+
lastX: 0,
|
|
29
|
+
lastT: 0,
|
|
30
|
+
axis: null,
|
|
31
|
+
dragged: !1
|
|
32
|
+
};
|
|
33
|
+
let C = null;
|
|
34
|
+
const _e = Le();
|
|
35
|
+
A(() => {
|
|
36
|
+
d(), H(!1);
|
|
37
|
+
}), A(() => {
|
|
38
|
+
const e = K();
|
|
39
|
+
B(e), s.onSlideChange?.(e), D() !== void 0 && H(!0);
|
|
31
40
|
});
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
41
|
+
const b = (e) => {
|
|
42
|
+
const t = Fe(e, 0, X());
|
|
43
|
+
B(t), H(!0), s.onSlideChange?.(t);
|
|
44
|
+
}, pe = (e) => {
|
|
45
|
+
v && (v.removeEventListener(e ? "mousemove" : "touchmove", J), v.removeEventListener(e ? "mouseup" : "touchend", x), e && v.removeEventListener("mouseleave", x));
|
|
46
|
+
}, J = (e) => {
|
|
47
|
+
if (!M || !l.isPressed) return;
|
|
48
|
+
if (De(e) && e.touches.length > 1) {
|
|
49
|
+
x(e);
|
|
36
50
|
return;
|
|
37
51
|
}
|
|
38
|
-
const
|
|
39
|
-
if (
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
52
|
+
const t = V(e), a = ie(e), i = t - l.startX, c = a - l.startY;
|
|
53
|
+
if (l.axis === null) {
|
|
54
|
+
if (Math.abs(i) < de && Math.abs(c) < de) return;
|
|
55
|
+
if (l.axis = Math.abs(i) >= Math.abs(c) ? "x" : "y", l.dragged = !0, l.axis === "y") {
|
|
56
|
+
x(e);
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
o() > 1 && j(!0);
|
|
45
60
|
}
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
h.removeEventListener(r ? "mousemove" : "touchmove", R), h.removeEventListener(r ? "mouseup" : "touchend", p), r && h.removeEventListener("mouseleave", p);
|
|
51
|
-
}, W = (e) => {
|
|
52
|
-
if (a() <= 1 || !h) return;
|
|
53
|
-
const r = B(e);
|
|
54
|
-
r && e.button !== 0 || (e.stopPropagation(), u.isPressed = !0, u.startX = L(e), u.startY = X(e), h.addEventListener(r ? "mousemove" : "touchmove", R), h.addEventListener(r ? "mouseup" : "touchend", p), r && h.addEventListener("mouseleave", p));
|
|
55
|
-
}, _ = (e) => {
|
|
56
|
-
C(e), b(!0), t.onSlideChange?.(e);
|
|
57
|
-
}, E = (e) => {
|
|
58
|
-
const r = o() === 1, l = r ? a() : Math.ceil(a() / o()), d = m() + o(), c = a() - o() <= m(), n = (j(d, o(), a(), c) + e + l) % l;
|
|
59
|
-
return r ? n : n * o();
|
|
60
|
-
}, re = () => {
|
|
61
|
-
const e = a() - o() <= m(), r = o() === 1, l = r ? a() : Math.ceil(a() / o()), d = [];
|
|
62
|
-
for (let c = 0; c < l; c++) {
|
|
63
|
-
let s = c, n = m();
|
|
64
|
-
if (!r) {
|
|
65
|
-
const i = c === l - 1, f = m() + o();
|
|
66
|
-
s = i ? a() - o() : c * o(), n = j(f, o(), a(), e);
|
|
61
|
+
if (l.axis === "x") {
|
|
62
|
+
if (e.preventDefault(), e.stopPropagation(), o() > 1) {
|
|
63
|
+
const r = g() <= 0, n = g() >= X(), u = r && i > 0 || n && i < 0 ? i * 0.35 : i;
|
|
64
|
+
U(u);
|
|
67
65
|
}
|
|
68
|
-
|
|
66
|
+
l.lastX = t, l.lastT = W();
|
|
67
|
+
}
|
|
68
|
+
}, x = (e) => {
|
|
69
|
+
if (!l.isPressed) return;
|
|
70
|
+
const t = ce(e);
|
|
71
|
+
pe(t);
|
|
72
|
+
const {
|
|
73
|
+
axis: a,
|
|
74
|
+
dragged: i,
|
|
75
|
+
startX: c,
|
|
76
|
+
lastX: r,
|
|
77
|
+
lastT: n
|
|
78
|
+
} = l;
|
|
79
|
+
if (l.isPressed = !1, j(!1), a === "x" && i && o() > 1 && M) {
|
|
80
|
+
const u = V(e), w = u - c, m = M.offsetWidth / d(), _ = n ? (u - r) / Math.max(1, W() - n) : 0;
|
|
81
|
+
let E = m > 0 ? Math.round(-w / m) : 0;
|
|
82
|
+
E === 0 && Math.abs(_) > We && (E = _ < 0 ? 1 : -1), b(g() + E);
|
|
83
|
+
}
|
|
84
|
+
U(0);
|
|
85
|
+
}, Q = (e) => {
|
|
86
|
+
if (!v) return;
|
|
87
|
+
const t = ce(e);
|
|
88
|
+
t && e.button !== 0 || (e.stopPropagation(), l.isPressed = !0, l.startX = V(e), l.startY = ie(e), l.lastX = l.startX, l.lastT = W(), l.axis = null, l.dragged = !1, v.addEventListener(t ? "mousemove" : "touchmove", J, {
|
|
89
|
+
passive: !1
|
|
90
|
+
}), v.addEventListener(t ? "mouseup" : "touchend", x), t && v.addEventListener("mouseleave", x));
|
|
91
|
+
}, be = (e) => {
|
|
92
|
+
l.dragged || s.enableFullscreen && L(e);
|
|
93
|
+
}, R = (e) => {
|
|
94
|
+
const t = d() === 1, a = t ? o() : Math.ceil(o() / d()), i = g() + d(), c = o() - d() <= g(), n = (ae(i, d(), o(), c) + e + a) % a;
|
|
95
|
+
return t ? n : n * d();
|
|
96
|
+
}, xe = () => {
|
|
97
|
+
const e = o() - d() <= g(), t = d() === 1, a = t ? o() : Math.ceil(o() / d()), i = [];
|
|
98
|
+
for (let c = 0; c < a; c++) {
|
|
99
|
+
let r = c, n = g();
|
|
100
|
+
if (!t) {
|
|
101
|
+
const u = c === a - 1, w = g() + d();
|
|
102
|
+
r = u ? o() - d() : c * d(), n = ae(w, d(), o(), e);
|
|
103
|
+
}
|
|
104
|
+
i.push({
|
|
69
105
|
index: c,
|
|
70
|
-
nextIndex:
|
|
106
|
+
nextIndex: r,
|
|
71
107
|
isActive: n === c
|
|
72
108
|
});
|
|
73
109
|
}
|
|
74
|
-
return
|
|
75
|
-
},
|
|
76
|
-
const e =
|
|
77
|
-
return
|
|
110
|
+
return i;
|
|
111
|
+
}, Se = () => {
|
|
112
|
+
const e = g() > X() ? X() : g();
|
|
113
|
+
return Ne(d()) * e;
|
|
114
|
+
}, Ie = se(() => {
|
|
115
|
+
const e = {}, t = Y(s.cellHeight), a = Me(s.aspectRatio), i = Y(s.gap), c = Y(s.maxWidth);
|
|
116
|
+
return t && (e["--smwb-carousel-cell-height"] = t), a && (e["--smwb-carousel-aspect-ratio"] = a), i && (e["--smwb-carousel-gap"] = i), c && (e["--smwb-carousel-max-width"] = c), e;
|
|
117
|
+
}), $ = (e) => {
|
|
118
|
+
const t = y();
|
|
119
|
+
t !== null && L((t + e + o()) % o());
|
|
120
|
+
}, ye = se(() => {
|
|
121
|
+
const e = y();
|
|
122
|
+
if (e === null) return null;
|
|
123
|
+
const t = N()[e];
|
|
124
|
+
return t instanceof Node ? t.cloneNode(!0) : t == null ? "" : String(t);
|
|
125
|
+
});
|
|
126
|
+
A(() => {
|
|
127
|
+
if (!s.autoplay || o() <= 1 || s.pauseOnHover && ge() || y() !== null)
|
|
128
|
+
return;
|
|
129
|
+
const e = window.setInterval(() => b(R(1)), s.autoplayInterval);
|
|
130
|
+
ne(() => window.clearInterval(e));
|
|
131
|
+
}), A(() => {
|
|
132
|
+
if (y() === null || o() <= 1) return;
|
|
133
|
+
const e = (t) => {
|
|
134
|
+
t.key === "ArrowLeft" ? $(-1) : t.key === "ArrowRight" && $(1);
|
|
135
|
+
};
|
|
136
|
+
document.addEventListener("keydown", e), ne(() => document.removeEventListener("keydown", e));
|
|
137
|
+
});
|
|
138
|
+
const Ce = (e) => {
|
|
139
|
+
C = e.touches[0]?.clientX ?? null;
|
|
140
|
+
}, $e = (e) => {
|
|
141
|
+
if (C === null || o() <= 1) return;
|
|
142
|
+
const t = (e.changedTouches[0]?.clientX ?? C) - C;
|
|
143
|
+
C = null, Math.abs(t) > 40 && $(t < 0 ? 1 : -1);
|
|
78
144
|
};
|
|
79
|
-
return
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
var e = Se(), r = e.firstChild, l = r.firstChild, d = l.firstChild;
|
|
85
|
-
I(e, "mouseleave", t.pauseOnHover ? () => O(!1) : void 0), I(e, "mouseenter", t.pauseOnHover ? () => O(!0) : void 0);
|
|
86
|
-
var c = we(t.ref);
|
|
87
|
-
return typeof c == "function" && P(c, e), P((s) => y = s, r), S(r, w(N, {
|
|
145
|
+
return (() => {
|
|
146
|
+
var e = Ye(), t = e.firstChild, a = t.firstChild, i = a.firstChild;
|
|
147
|
+
k(e, "mouseleave", s.pauseOnHover ? () => G(!1) : void 0), k(e, "mouseenter", s.pauseOnHover ? () => G(!0) : void 0);
|
|
148
|
+
var c = He(s.ref);
|
|
149
|
+
return typeof c == "function" && O(c, e), O((r) => M = r, t), h(t, f(I, {
|
|
88
150
|
get when() {
|
|
89
|
-
return
|
|
151
|
+
return q();
|
|
90
152
|
},
|
|
91
153
|
get children() {
|
|
92
|
-
return
|
|
154
|
+
return f(T, {
|
|
93
155
|
name: "chevron_left",
|
|
94
156
|
get size() {
|
|
95
|
-
return
|
|
157
|
+
return s.arrowsSize;
|
|
96
158
|
},
|
|
97
159
|
get class() {
|
|
98
|
-
return
|
|
160
|
+
return p("smwb-carousel__arrow", "smwb-carousel__arrow_prev");
|
|
99
161
|
},
|
|
100
162
|
get style() {
|
|
101
163
|
return {
|
|
102
|
-
top: `calc(50% - ${
|
|
103
|
-
left: `${-
|
|
164
|
+
top: `calc(50% - ${s.arrowsSize / 2}px)`,
|
|
165
|
+
left: `${-s.arrowsSize / 2}px`
|
|
104
166
|
};
|
|
105
167
|
},
|
|
106
|
-
onClick: () =>
|
|
168
|
+
onClick: () => b(R(-1))
|
|
107
169
|
});
|
|
108
170
|
}
|
|
109
|
-
}),
|
|
171
|
+
}), a), k(a, "dragend", le), k(a, "dragstart", le), a.$$touchstart = Q, a.$$mousedown = Q, O((r) => v = r, a), h(i, f(oe, {
|
|
110
172
|
get each() {
|
|
111
|
-
return
|
|
173
|
+
return N();
|
|
112
174
|
},
|
|
113
|
-
children: (
|
|
114
|
-
var
|
|
115
|
-
return
|
|
116
|
-
var
|
|
117
|
-
return
|
|
175
|
+
children: (r, n) => (() => {
|
|
176
|
+
var u = Ve(), w = u.firstChild;
|
|
177
|
+
return k(w, "click", s.enableFullscreen ? () => be(n()) : void 0, !0), h(w, r), P((m) => {
|
|
178
|
+
var _ = `${_e}${n()}`, E = Pe(d()), Z = p("smwb-carousel__slide-inner", s.enableFullscreen && "smwb-carousel__slide-inner_clickable");
|
|
179
|
+
return _ !== m.e && ee(u, "id", m.e = _), m.t = te(u, E, m.t), Z !== m.a && z(w, m.a = Z), m;
|
|
118
180
|
}, {
|
|
119
181
|
e: void 0,
|
|
120
|
-
t: void 0
|
|
121
|
-
|
|
182
|
+
t: void 0,
|
|
183
|
+
a: void 0
|
|
184
|
+
}), u;
|
|
122
185
|
})()
|
|
123
|
-
})),
|
|
186
|
+
})), h(t, f(I, {
|
|
124
187
|
get when() {
|
|
125
|
-
return
|
|
188
|
+
return q();
|
|
126
189
|
},
|
|
127
190
|
get children() {
|
|
128
|
-
return
|
|
191
|
+
return f(T, {
|
|
129
192
|
name: "chevron_right",
|
|
130
193
|
get size() {
|
|
131
|
-
return
|
|
194
|
+
return s.arrowsSize;
|
|
132
195
|
},
|
|
133
196
|
get class() {
|
|
134
|
-
return
|
|
197
|
+
return p("smwb-carousel__arrow", "smwb-carousel__arrow_next");
|
|
135
198
|
},
|
|
136
199
|
get style() {
|
|
137
200
|
return {
|
|
138
|
-
top: `calc(50% - ${
|
|
139
|
-
right: `${-
|
|
201
|
+
top: `calc(50% - ${s.arrowsSize / 2}px)`,
|
|
202
|
+
right: `${-s.arrowsSize / 2}px`
|
|
140
203
|
};
|
|
141
204
|
},
|
|
142
|
-
onClick: () =>
|
|
205
|
+
onClick: () => b(R(1))
|
|
143
206
|
});
|
|
144
207
|
}
|
|
145
|
-
}), null),
|
|
208
|
+
}), null), h(e, f(I, {
|
|
146
209
|
get when() {
|
|
147
|
-
return
|
|
210
|
+
return s.showNavigation;
|
|
148
211
|
},
|
|
149
212
|
get children() {
|
|
150
|
-
var
|
|
151
|
-
return
|
|
213
|
+
var r = ue();
|
|
214
|
+
return h(r, f(oe, {
|
|
152
215
|
get each() {
|
|
153
|
-
return
|
|
216
|
+
return xe();
|
|
154
217
|
},
|
|
155
|
-
children: (n) =>
|
|
156
|
-
var
|
|
157
|
-
return
|
|
218
|
+
children: (n) => s.navigationDotRenderer ? s.navigationDotRenderer(n.index, n.isActive, (u) => b(u)) : (() => {
|
|
219
|
+
var u = ue();
|
|
220
|
+
return u.$$click = () => b(n.nextIndex), P(() => z(u, p("smwb-carousel__navigation__dot", n.isActive && "current"))), u;
|
|
158
221
|
})()
|
|
159
|
-
})),
|
|
222
|
+
})), P(() => z(r, p("smwb-carousel__navigation", s.navigationClassName))), r;
|
|
223
|
+
}
|
|
224
|
+
}), null), h(e, f(I, {
|
|
225
|
+
get when() {
|
|
226
|
+
return s.enableFullscreen;
|
|
227
|
+
},
|
|
228
|
+
get children() {
|
|
229
|
+
return f(Re, {
|
|
230
|
+
get open() {
|
|
231
|
+
return y() !== null;
|
|
232
|
+
},
|
|
233
|
+
size: "fullscreen",
|
|
234
|
+
backdrop: "darkBlured",
|
|
235
|
+
class: "smwb-carousel__fullscreen",
|
|
236
|
+
onClose: () => L(null),
|
|
237
|
+
"aria-label": "Image viewer",
|
|
238
|
+
get children() {
|
|
239
|
+
var r = Oe(), n = r.firstChild;
|
|
240
|
+
return h(r, f(I, {
|
|
241
|
+
get when() {
|
|
242
|
+
return o() > 1;
|
|
243
|
+
},
|
|
244
|
+
get children() {
|
|
245
|
+
return f(T, {
|
|
246
|
+
name: "chevron_left",
|
|
247
|
+
size: 40,
|
|
248
|
+
get class() {
|
|
249
|
+
return p("smwb-carousel__fullscreen-arrow", "smwb-carousel__fullscreen-arrow_prev");
|
|
250
|
+
},
|
|
251
|
+
onClick: () => $(-1)
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
}), n), n.$$touchend = $e, n.$$touchstart = Ce, h(n, () => ye()), h(r, f(I, {
|
|
255
|
+
get when() {
|
|
256
|
+
return o() > 1;
|
|
257
|
+
},
|
|
258
|
+
get children() {
|
|
259
|
+
return f(T, {
|
|
260
|
+
name: "chevron_right",
|
|
261
|
+
size: 40,
|
|
262
|
+
get class() {
|
|
263
|
+
return p("smwb-carousel__fullscreen-arrow", "smwb-carousel__fullscreen-arrow_next");
|
|
264
|
+
},
|
|
265
|
+
onClick: () => $(1)
|
|
266
|
+
});
|
|
267
|
+
}
|
|
268
|
+
}), null), h(r, f(T, {
|
|
269
|
+
name: "close",
|
|
270
|
+
size: 32,
|
|
271
|
+
class: "smwb-carousel__fullscreen-close",
|
|
272
|
+
onClick: () => L(null)
|
|
273
|
+
}), null), r;
|
|
274
|
+
}
|
|
275
|
+
});
|
|
160
276
|
}
|
|
161
|
-
}), null),
|
|
162
|
-
var n =
|
|
163
|
-
return n !==
|
|
277
|
+
}), null), P((r) => {
|
|
278
|
+
var n = p("smwb-carousel", s.class), u = s["aria-label"], w = Ie(), m = `translateX(calc(-${Se()}% + ${ve()}px))`, _ = we() || D() === void 0 ? "none" : D() ? "transform 500ms cubic-bezier(.1, 0, .25, 1)" : "none";
|
|
279
|
+
return n !== r.e && z(e, r.e = n), u !== r.t && ee(e, "aria-label", r.t = u), r.a = te(e, w, r.a), m !== r.o && re(i, "transform", r.o = m), _ !== r.i && re(i, "transition", r.i = _), r;
|
|
164
280
|
}, {
|
|
165
281
|
e: void 0,
|
|
166
282
|
t: void 0,
|
|
167
283
|
a: void 0,
|
|
168
|
-
o: void 0
|
|
284
|
+
o: void 0,
|
|
285
|
+
i: void 0
|
|
169
286
|
}), e;
|
|
170
287
|
})();
|
|
171
288
|
}
|
|
172
|
-
|
|
289
|
+
Ee(["mousedown", "touchstart", "touchend", "click"]);
|
|
173
290
|
export {
|
|
174
|
-
|
|
291
|
+
Ze as Carousel
|
|
175
292
|
};
|
|
176
293
|
//# sourceMappingURL=carousel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.js","sources":["../../../../src/components/dataDisplay/carousel/carousel.tsx"],"sourcesContent":["import {\n type JSX,\n type ParentProps,\n For,\n Show,\n children as resolveChildren,\n createEffect,\n createSignal,\n createUniqueId,\n mergeProps,\n onCleanup,\n splitProps,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport {\n coordX,\n coordY,\n dragPrevent,\n getSlideIndexForMultipleParts,\n getSlideStyle,\n getSlideWidth,\n getSlidesToShow,\n getStartSlide,\n isMouseEvent,\n isTouchEvent,\n} from \"./utils\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface CarouselProps {\n slidesToShow?: number;\n startSlide?: number;\n class?: string;\n showNavigation?: boolean;\n showArrows?: boolean;\n arrowsSize?: number;\n navigationClassName?: string;\n onSlideChange?: (slideIndex: number) => void;\n navigationDotRenderer?: (index: number, isActive: boolean, onClick: (index: number) => void) => JSX.Element;\n \"aria-label\"?: string;\n autoplay?: boolean;\n autoplayInterval?: number;\n pauseOnHover?: boolean;\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface Motion {\n isPressed: boolean;\n startX: number;\n startY: number;\n}\n\nexport function Carousel(props: ParentProps<CarouselProps>): JSX.Element {\n const merged = mergeProps(\n {\n slidesToShow: 3,\n startSlide: 0,\n showNavigation: true,\n arrowsSize: 30,\n \"aria-label\": \"Carousel\",\n autoplay: false,\n autoplayInterval: 4000,\n pauseOnHover: true,\n },\n props\n );\n const [local] = splitProps(merged, [\n \"slidesToShow\",\n \"startSlide\",\n \"children\",\n \"class\",\n \"showNavigation\",\n \"showArrows\",\n \"arrowsSize\",\n \"navigationClassName\",\n \"onSlideChange\",\n \"navigationDotRenderer\",\n \"aria-label\",\n \"autoplay\",\n \"autoplayInterval\",\n \"pauseOnHover\",\n \"ref\",\n ]);\n\n const resolved = resolveChildren(() => local.children);\n const slides = (): unknown[] => resolved.toArray();\n const slidesCount = (): number => slides().length;\n const slidesToShow = (): number => getSlidesToShow(local.slidesToShow, slidesCount());\n const startSlide = (): number => getStartSlide(local.startSlide, slidesCount());\n const showArrows = (): boolean => !!local.showArrows && slidesCount() > 1;\n\n const [activeSlideIndex, setActiveSlideIndex] = createSignal(startSlide());\n const [animation, setAnimation] = createSignal<boolean | undefined>(undefined);\n const [isHovered, setIsHovered] = createSignal(false);\n\n let rootEl: HTMLDivElement | undefined;\n let trackEl: HTMLDivElement | undefined;\n const motion: Motion = { isPressed: false, startX: 0, startY: 0 };\n const slideId = createUniqueId();\n\n createEffect(() => {\n slidesToShow();\n setAnimation(false);\n });\n\n createEffect(() => {\n const start = startSlide();\n setActiveSlideIndex(start);\n local.onSlideChange?.(start);\n if (animation() !== undefined) setAnimation(true);\n });\n\n const onMove = (event: MouseEvent | TouchEvent): void => {\n if (!rootEl || !motion.isPressed) return;\n event.preventDefault();\n event.stopPropagation();\n if (isTouchEvent(event) && event.touches.length > 1) {\n onEnd(event);\n return;\n }\n const shiftX = coordX(event) - motion.startX;\n const shiftY = coordY(event) - motion.startY;\n const shiftXAbs = Math.abs(shiftX);\n const shiftYAbs = Math.abs(shiftY);\n if (shiftXAbs < shiftYAbs) return;\n const viewWidth = rootEl.offsetWidth;\n const widthPerSlide = viewWidth / slidesToShow();\n const threshold = slidesToShow() === 1 ? 1.95 : 1.4;\n if (shiftXAbs % widthPerSlide > widthPerSlide / threshold) {\n const direction = shiftX < 0 ? 1 : -1;\n const shiftSlidesMax = slidesCount() - slidesToShow();\n const targetIndex = activeSlideIndex() + direction;\n if (targetIndex < 0 || targetIndex > shiftSlidesMax) return;\n setActiveSlideIndex(targetIndex);\n setAnimation(true);\n motion.startX = coordX(event);\n motion.startY = coordY(event);\n local.onSlideChange?.(targetIndex);\n }\n };\n\n const onEnd = (event: MouseEvent | TouchEvent): void => {\n if (!trackEl || !motion.isPressed) return;\n motion.isPressed = false;\n const mouse = isMouseEvent(event);\n trackEl.removeEventListener(mouse ? \"mousemove\" : \"touchmove\", onMove as EventListener);\n trackEl.removeEventListener(mouse ? \"mouseup\" : \"touchend\", onEnd as EventListener);\n if (mouse) trackEl.removeEventListener(\"mouseleave\", onEnd as EventListener);\n };\n\n const onStart: JSX.EventHandler<HTMLDivElement, MouseEvent | TouchEvent> = (event) => {\n if (slidesCount() <= 1 || !trackEl) return;\n const mouse = isMouseEvent(event);\n if (mouse && (event as MouseEvent).button !== 0) return;\n event.stopPropagation();\n motion.isPressed = true;\n motion.startX = coordX(event);\n motion.startY = coordY(event);\n trackEl.addEventListener(mouse ? \"mousemove\" : \"touchmove\", onMove as EventListener);\n trackEl.addEventListener(mouse ? \"mouseup\" : \"touchend\", onEnd as EventListener);\n if (mouse) trackEl.addEventListener(\"mouseleave\", onEnd as EventListener);\n };\n\n const goTo = (index: number): void => {\n setActiveSlideIndex(index);\n setAnimation(true);\n local.onSlideChange?.(index);\n };\n\n const getNextIndex = (direction: 1 | -1): number => {\n const isSingle = slidesToShow() === 1;\n const totalGroups = isSingle ? slidesCount() : Math.ceil(slidesCount() / slidesToShow());\n const activeIndex = activeSlideIndex() + slidesToShow();\n const isNextDisabled = slidesCount() - slidesToShow() <= activeSlideIndex();\n const currentIndex = getSlideIndexForMultipleParts(activeIndex, slidesToShow(), slidesCount(), isNextDisabled);\n const nextIndex = (currentIndex + direction + totalGroups) % totalGroups;\n return isSingle ? nextIndex : nextIndex * slidesToShow();\n };\n\n const dots = (): Array<{ index: number; nextIndex: number; isActive: boolean }> => {\n const isNextDisabled = slidesCount() - slidesToShow() <= activeSlideIndex();\n const isSingle = slidesToShow() === 1;\n const count = isSingle ? slidesCount() : Math.ceil(slidesCount() / slidesToShow());\n const result: Array<{ index: number; nextIndex: number; isActive: boolean }> = [];\n for (let index = 0; index < count; index++) {\n let nextIndex = index;\n let currentIndex = activeSlideIndex();\n if (!isSingle) {\n const isLast = index === count - 1;\n const activeIndex = activeSlideIndex() + slidesToShow();\n nextIndex = isLast ? slidesCount() - slidesToShow() : index * slidesToShow();\n currentIndex = getSlideIndexForMultipleParts(activeIndex, slidesToShow(), slidesCount(), isNextDisabled);\n }\n result.push({ index, nextIndex, isActive: currentIndex === index });\n }\n return result;\n };\n\n const indent = (): number => {\n const shiftSlidesMax = slidesCount() - slidesToShow();\n const shiftSlides = activeSlideIndex() > shiftSlidesMax ? shiftSlidesMax : activeSlideIndex();\n return getSlideWidth(slidesToShow()) * shiftSlides;\n };\n\n // Autoplay\n createEffect(() => {\n if (!local.autoplay || slidesCount() <= 1 || (local.pauseOnHover && isHovered())) return;\n const timer = window.setInterval(() => goTo(getNextIndex(1)), local.autoplayInterval);\n onCleanup(() => window.clearInterval(timer));\n });\n\n return (\n <div\n class={cn(\"smwb-carousel\", local.class)}\n data-testid=\"carousel\"\n ref={mergeRefs(local.ref)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n aria-label={local[\"aria-label\"]}\n onMouseEnter={local.pauseOnHover ? () => setIsHovered(true) : undefined}\n onMouseLeave={local.pauseOnHover ? () => setIsHovered(false) : undefined}\n >\n <div class=\"smwb-carousel__inner\" ref={(el) => (rootEl = el)}>\n <Show when={showArrows()}>\n <Icon\n name=\"chevron_left\"\n size={local.arrowsSize}\n class={cn(\"smwb-carousel__arrow\", \"smwb-carousel__arrow_prev\")}\n style={{ top: `calc(50% - ${local.arrowsSize / 2}px)`, left: `${-local.arrowsSize / 2}px` }}\n onClick={() => goTo(getNextIndex(-1))}\n />\n </Show>\n <div\n ref={(el) => (trackEl = el)}\n class=\"smwb-carousel__track\"\n onMouseDown={onStart}\n onTouchStart={onStart}\n onDragStart={dragPrevent}\n onDragEnd={dragPrevent}\n >\n <div\n class=\"smwb-carousel__layer\"\n style={{\n transform: `translateX(-${indent()}%)`,\n transition: animation() ? \"transform 500ms cubic-bezier(.1, 0, .25, 1)\" : \"none\",\n }}\n >\n <For each={slides()}>\n {(child, index) => (\n <div id={`${slideId}${index()}`} class=\"smwb-carousel__slide\" style={getSlideStyle(slidesToShow())}>\n <div class=\"smwb-carousel__slide-inner\">{child as JSX.Element}</div>\n </div>\n )}\n </For>\n </div>\n </div>\n <Show when={showArrows()}>\n <Icon\n name=\"chevron_right\"\n size={local.arrowsSize}\n class={cn(\"smwb-carousel__arrow\", \"smwb-carousel__arrow_next\")}\n style={{ top: `calc(50% - ${local.arrowsSize / 2}px)`, right: `${-local.arrowsSize / 2}px` }}\n onClick={() => goTo(getNextIndex(1))}\n />\n </Show>\n </div>\n <Show when={local.showNavigation}>\n <div class={cn(\"smwb-carousel__navigation\", local.navigationClassName)}>\n <For each={dots()}>\n {(dot) =>\n local.navigationDotRenderer ? (\n local.navigationDotRenderer(dot.index, dot.isActive, (i) => goTo(i))\n ) : (\n <div\n class={cn(\"smwb-carousel__navigation__dot\", dot.isActive && \"current\")}\n onClick={() => goTo(dot.nextIndex)}\n />\n )\n }\n </For>\n </div>\n </Show>\n </div>\n );\n}\n\nexport default Carousel;\n"],"names":["Carousel","props","merged","mergeProps","slidesToShow","startSlide","showNavigation","arrowsSize","autoplay","autoplayInterval","pauseOnHover","local","splitProps","resolved","resolveChildren","children","slides","toArray","slidesCount","length","getSlidesToShow","getStartSlide","showArrows","activeSlideIndex","setActiveSlideIndex","createSignal","animation","setAnimation","undefined","isHovered","setIsHovered","rootEl","trackEl","motion","isPressed","startX","startY","slideId","createUniqueId","createEffect","start","onSlideChange","onMove","event","preventDefault","stopPropagation","isTouchEvent","touches","onEnd","shiftX","coordX","shiftY","coordY","shiftXAbs","Math","abs","shiftYAbs","widthPerSlide","offsetWidth","threshold","direction","shiftSlidesMax","targetIndex","mouse","isMouseEvent","removeEventListener","onStart","button","addEventListener","goTo","index","getNextIndex","isSingle","totalGroups","ceil","activeIndex","isNextDisabled","nextIndex","getSlideIndexForMultipleParts","dots","count","result","currentIndex","isLast","push","isActive","indent","shiftSlides","getSlideWidth","timer","window","setInterval","onCleanup","clearInterval","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","_$addEventListener","_ref$","mergeRefs","ref","_$use","el","_$insert","_$createComponent","Show","when","Icon","name","size","cn","style","top","left","onClick","dragPrevent","$$touchstart","$$mousedown","For","each","child","_el$6","_tmpl$3","_el$7","_$effect","_p$","_v$5","_v$6","getSlideStyle","e","_$setAttribute","t","_$style","right","_el$5","_tmpl$","dot","navigationDotRenderer","i","_el$8","$$click","_$className","navigationClassName","_v$","class","_v$2","_v$3","_v$4","a","_$setStyleProperty","o","_$delegateEvents"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"carousel.js","sources":["../../../../src/components/dataDisplay/carousel/carousel.tsx"],"sourcesContent":["import {\n type JSX,\n type ParentProps,\n For,\n Show,\n children as resolveChildren,\n createEffect,\n createMemo,\n createSignal,\n createUniqueId,\n mergeProps,\n onCleanup,\n splitProps,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { Modal } from \"../../feedBack/modal\";\nimport {\n clamp,\n coordX,\n coordY,\n dragPrevent,\n getSlideIndexForMultipleParts,\n getSlideStyle,\n getSlideWidth,\n getSlidesToShow,\n getStartSlide,\n isMouseEvent,\n isTouchEvent,\n toCssLength,\n toCssNumber,\n} from \"./utils\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface CarouselProps {\n slidesToShow?: number;\n startSlide?: number;\n class?: string;\n showNavigation?: boolean;\n showArrows?: boolean;\n arrowsSize?: number;\n navigationClassName?: string;\n onSlideChange?: (slideIndex: number) => void;\n navigationDotRenderer?: (index: number, isActive: boolean, onClick: (index: number) => void) => JSX.Element;\n \"aria-label\"?: string;\n autoplay?: boolean;\n autoplayInterval?: number;\n pauseOnHover?: boolean;\n /** Height of each cell/photo. Number is treated as px. Overrides the default 205px. */\n cellHeight?: number | string;\n /** Aspect ratio of each cell/photo (e.g. 0.9 or \"16 / 9\"). Overrides the default 0.9. */\n aspectRatio?: number | string;\n /** Per-side spacing around each slide. Number is treated as px (default 4). */\n gap?: number | string;\n /** Max width of the carousel. Number is treated as px (default 412). */\n maxWidth?: number | string;\n /** Open the clicked slide in a fullscreen lightbox (arrows / swipe / Esc to navigate & close). */\n enableFullscreen?: boolean;\n ref?: Ref<HTMLDivElement>;\n}\n\ntype Axis = \"x\" | \"y\" | null;\n\ninterface Motion {\n isPressed: boolean;\n startX: number;\n startY: number;\n lastX: number;\n lastT: number;\n axis: Axis;\n dragged: boolean;\n}\n\nconst TAP_THRESHOLD = 8;\nconst FLICK_VELOCITY = 0.4;\n\nconst now = (): number => (typeof performance !== \"undefined\" ? performance.now() : Date.now());\n\nexport function Carousel(props: ParentProps<CarouselProps>): JSX.Element {\n const merged = mergeProps(\n {\n slidesToShow: 3,\n startSlide: 0,\n showNavigation: true,\n arrowsSize: 30,\n \"aria-label\": \"Carousel\",\n autoplay: false,\n autoplayInterval: 4000,\n pauseOnHover: true,\n enableFullscreen: false,\n },\n props\n );\n const [local] = splitProps(merged, [\n \"slidesToShow\",\n \"startSlide\",\n \"children\",\n \"class\",\n \"showNavigation\",\n \"showArrows\",\n \"arrowsSize\",\n \"navigationClassName\",\n \"onSlideChange\",\n \"navigationDotRenderer\",\n \"aria-label\",\n \"autoplay\",\n \"autoplayInterval\",\n \"pauseOnHover\",\n \"cellHeight\",\n \"aspectRatio\",\n \"gap\",\n \"maxWidth\",\n \"enableFullscreen\",\n \"ref\",\n ]);\n\n const resolved = resolveChildren(() => local.children);\n const slides = (): unknown[] => resolved.toArray();\n const slidesCount = (): number => slides().length;\n const slidesToShow = (): number => getSlidesToShow(local.slidesToShow, slidesCount());\n const startSlide = (): number => getStartSlide(local.startSlide, slidesCount());\n const showArrows = (): boolean => !!local.showArrows && slidesCount() > 1;\n const maxShift = (): number => Math.max(0, slidesCount() - slidesToShow());\n\n const [activeSlideIndex, setActiveSlideIndex] = createSignal(startSlide());\n const [animation, setAnimation] = createSignal<boolean | undefined>(undefined);\n const [isHovered, setIsHovered] = createSignal(false);\n const [dragPx, setDragPx] = createSignal(0);\n const [isDragging, setIsDragging] = createSignal(false);\n const [fullscreenIndex, setFullscreenIndex] = createSignal<number | null>(null);\n\n let rootEl: HTMLDivElement | undefined;\n let trackEl: HTMLDivElement | undefined;\n const motion: Motion = { isPressed: false, startX: 0, startY: 0, lastX: 0, lastT: 0, axis: null, dragged: false };\n let fullscreenTouchX: number | null = null;\n const slideId = createUniqueId();\n\n createEffect(() => {\n slidesToShow();\n setAnimation(false);\n });\n\n createEffect(() => {\n const start = startSlide();\n setActiveSlideIndex(start);\n local.onSlideChange?.(start);\n if (animation() !== undefined) setAnimation(true);\n });\n\n const goToSlide = (index: number): void => {\n const target = clamp(index, 0, maxShift());\n setActiveSlideIndex(target);\n setAnimation(true);\n local.onSlideChange?.(target);\n };\n\n const detachListeners = (mouse: boolean): void => {\n if (!trackEl) return;\n trackEl.removeEventListener(mouse ? \"mousemove\" : \"touchmove\", onMove as EventListener);\n trackEl.removeEventListener(mouse ? \"mouseup\" : \"touchend\", onEnd as EventListener);\n if (mouse) trackEl.removeEventListener(\"mouseleave\", onEnd as EventListener);\n };\n\n const onMove = (event: MouseEvent | TouchEvent): void => {\n if (!rootEl || !motion.isPressed) return;\n if (isTouchEvent(event) && event.touches.length > 1) {\n onEnd(event);\n return;\n }\n\n const clientX = coordX(event);\n const clientY = coordY(event);\n const shiftX = clientX - motion.startX;\n const shiftY = clientY - motion.startY;\n\n if (motion.axis === null) {\n if (Math.abs(shiftX) < TAP_THRESHOLD && Math.abs(shiftY) < TAP_THRESHOLD) return;\n motion.axis = Math.abs(shiftX) >= Math.abs(shiftY) ? \"x\" : \"y\";\n motion.dragged = true;\n if (motion.axis === \"y\") {\n onEnd(event);\n return;\n }\n if (slidesCount() > 1) setIsDragging(true);\n }\n\n if (motion.axis !== \"x\") return;\n\n event.preventDefault();\n event.stopPropagation();\n\n if (slidesCount() > 1) {\n const atStart = activeSlideIndex() <= 0;\n const atEnd = activeSlideIndex() >= maxShift();\n const offset = (atStart && shiftX > 0) || (atEnd && shiftX < 0) ? shiftX * 0.35 : shiftX;\n setDragPx(offset);\n }\n\n motion.lastX = clientX;\n motion.lastT = now();\n };\n\n const onEnd = (event: MouseEvent | TouchEvent): void => {\n if (!motion.isPressed) return;\n\n const mouse = isMouseEvent(event);\n detachListeners(mouse);\n\n const { axis, dragged, startX, lastX, lastT } = motion;\n motion.isPressed = false;\n setIsDragging(false);\n\n if (axis === \"x\" && dragged && slidesCount() > 1 && rootEl) {\n const clientX = coordX(event);\n const totalShift = clientX - startX;\n const widthPerSlide = rootEl.offsetWidth / slidesToShow();\n const velocity = lastT ? (clientX - lastX) / Math.max(1, now() - lastT) : 0;\n\n let movedSlides = widthPerSlide > 0 ? Math.round(-totalShift / widthPerSlide) : 0;\n if (movedSlides === 0 && Math.abs(velocity) > FLICK_VELOCITY) {\n movedSlides = velocity < 0 ? 1 : -1;\n }\n goToSlide(activeSlideIndex() + movedSlides);\n }\n\n setDragPx(0);\n };\n\n const onStart: JSX.EventHandler<HTMLDivElement, MouseEvent | TouchEvent> = (event) => {\n if (!trackEl) return;\n const mouse = isMouseEvent(event);\n if (mouse && (event as MouseEvent).button !== 0) return;\n event.stopPropagation();\n\n motion.isPressed = true;\n motion.startX = coordX(event);\n motion.startY = coordY(event);\n motion.lastX = motion.startX;\n motion.lastT = now();\n motion.axis = null;\n motion.dragged = false;\n\n trackEl.addEventListener(mouse ? \"mousemove\" : \"touchmove\", onMove as EventListener, { passive: false });\n trackEl.addEventListener(mouse ? \"mouseup\" : \"touchend\", onEnd as EventListener);\n if (mouse) trackEl.addEventListener(\"mouseleave\", onEnd as EventListener);\n };\n\n const onSlideClick = (index: number): void => {\n if (motion.dragged) return;\n if (local.enableFullscreen) setFullscreenIndex(index);\n };\n\n const getNextIndex = (direction: 1 | -1): number => {\n const isSingle = slidesToShow() === 1;\n const totalGroups = isSingle ? slidesCount() : Math.ceil(slidesCount() / slidesToShow());\n const activeIndex = activeSlideIndex() + slidesToShow();\n const isNextDisabled = slidesCount() - slidesToShow() <= activeSlideIndex();\n const currentIndex = getSlideIndexForMultipleParts(activeIndex, slidesToShow(), slidesCount(), isNextDisabled);\n const nextIndex = (currentIndex + direction + totalGroups) % totalGroups;\n return isSingle ? nextIndex : nextIndex * slidesToShow();\n };\n\n const dots = (): Array<{ index: number; nextIndex: number; isActive: boolean }> => {\n const isNextDisabled = slidesCount() - slidesToShow() <= activeSlideIndex();\n const isSingle = slidesToShow() === 1;\n const count = isSingle ? slidesCount() : Math.ceil(slidesCount() / slidesToShow());\n const result: Array<{ index: number; nextIndex: number; isActive: boolean }> = [];\n for (let index = 0; index < count; index++) {\n let nextIndex = index;\n let currentIndex = activeSlideIndex();\n if (!isSingle) {\n const isLast = index === count - 1;\n const activeIndex = activeSlideIndex() + slidesToShow();\n nextIndex = isLast ? slidesCount() - slidesToShow() : index * slidesToShow();\n currentIndex = getSlideIndexForMultipleParts(activeIndex, slidesToShow(), slidesCount(), isNextDisabled);\n }\n result.push({ index, nextIndex, isActive: currentIndex === index });\n }\n return result;\n };\n\n const indent = (): number => {\n const shiftSlides = activeSlideIndex() > maxShift() ? maxShift() : activeSlideIndex();\n return getSlideWidth(slidesToShow()) * shiftSlides;\n };\n\n const rootStyle = createMemo<JSX.CSSProperties>(() => {\n const style: Record<string, string> = {};\n const cellHeightValue = toCssLength(local.cellHeight);\n const aspectRatioValue = toCssNumber(local.aspectRatio);\n const gapValue = toCssLength(local.gap);\n const maxWidthValue = toCssLength(local.maxWidth);\n if (cellHeightValue) style[\"--smwb-carousel-cell-height\"] = cellHeightValue;\n if (aspectRatioValue) style[\"--smwb-carousel-aspect-ratio\"] = aspectRatioValue;\n if (gapValue) style[\"--smwb-carousel-gap\"] = gapValue;\n if (maxWidthValue) style[\"--smwb-carousel-max-width\"] = maxWidthValue;\n return style;\n });\n\n const moveFullscreen = (direction: 1 | -1): void => {\n const prev = fullscreenIndex();\n if (prev === null) return;\n setFullscreenIndex((prev + direction + slidesCount()) % slidesCount());\n };\n\n // A DOM node can only live in one place, so the carousel's own slide node\n // can't be reused inside the modal — render a clone of the active slide.\n const fullscreenNode = createMemo<Node | string | null>(() => {\n const idx = fullscreenIndex();\n if (idx === null) return null;\n const node = slides()[idx];\n if (node instanceof Node) return node.cloneNode(true);\n return node == null ? \"\" : String(node);\n });\n\n // Autoplay\n createEffect(() => {\n if (!local.autoplay || slidesCount() <= 1 || (local.pauseOnHover && isHovered()) || fullscreenIndex() !== null) {\n return;\n }\n const timer = window.setInterval(() => goToSlide(getNextIndex(1)), local.autoplayInterval);\n onCleanup(() => window.clearInterval(timer));\n });\n\n // Keyboard navigation while the lightbox is open.\n createEffect(() => {\n if (fullscreenIndex() === null || slidesCount() <= 1) return;\n const onKeyDown = (event: KeyboardEvent): void => {\n if (event.key === \"ArrowLeft\") moveFullscreen(-1);\n else if (event.key === \"ArrowRight\") moveFullscreen(1);\n };\n document.addEventListener(\"keydown\", onKeyDown);\n onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n });\n\n const onFullscreenTouchStart = (event: TouchEvent): void => {\n fullscreenTouchX = event.touches[0]?.clientX ?? null;\n };\n\n const onFullscreenTouchEnd = (event: TouchEvent): void => {\n if (fullscreenTouchX === null || slidesCount() <= 1) return;\n const delta = (event.changedTouches[0]?.clientX ?? fullscreenTouchX) - fullscreenTouchX;\n fullscreenTouchX = null;\n if (Math.abs(delta) > 40) moveFullscreen(delta < 0 ? 1 : -1);\n };\n\n return (\n <div\n class={cn(\"smwb-carousel\", local.class)}\n data-testid=\"carousel\"\n ref={mergeRefs(local.ref)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n aria-label={local[\"aria-label\"]}\n style={rootStyle()}\n onMouseEnter={local.pauseOnHover ? () => setIsHovered(true) : undefined}\n onMouseLeave={local.pauseOnHover ? () => setIsHovered(false) : undefined}\n >\n <div class=\"smwb-carousel__inner\" ref={(el) => (rootEl = el)}>\n <Show when={showArrows()}>\n <Icon\n name=\"chevron_left\"\n size={local.arrowsSize}\n class={cn(\"smwb-carousel__arrow\", \"smwb-carousel__arrow_prev\")}\n style={{ top: `calc(50% - ${local.arrowsSize / 2}px)`, left: `${-local.arrowsSize / 2}px` }}\n onClick={() => goToSlide(getNextIndex(-1))}\n />\n </Show>\n <div\n ref={(el) => (trackEl = el)}\n class=\"smwb-carousel__track\"\n onMouseDown={onStart}\n onTouchStart={onStart}\n onDragStart={dragPrevent}\n onDragEnd={dragPrevent}\n >\n <div\n class=\"smwb-carousel__layer\"\n style={{\n transform: `translateX(calc(-${indent()}% + ${dragPx()}px))`,\n transition:\n isDragging() || animation() === undefined\n ? \"none\"\n : animation()\n ? \"transform 500ms cubic-bezier(.1, 0, .25, 1)\"\n : \"none\",\n }}\n >\n <For each={slides()}>\n {(child, index) => (\n <div id={`${slideId}${index()}`} class=\"smwb-carousel__slide\" style={getSlideStyle(slidesToShow())}>\n <div\n class={cn(\n \"smwb-carousel__slide-inner\",\n local.enableFullscreen && \"smwb-carousel__slide-inner_clickable\"\n )}\n onClick={local.enableFullscreen ? () => onSlideClick(index()) : undefined}\n >\n {child as JSX.Element}\n </div>\n </div>\n )}\n </For>\n </div>\n </div>\n <Show when={showArrows()}>\n <Icon\n name=\"chevron_right\"\n size={local.arrowsSize}\n class={cn(\"smwb-carousel__arrow\", \"smwb-carousel__arrow_next\")}\n style={{ top: `calc(50% - ${local.arrowsSize / 2}px)`, right: `${-local.arrowsSize / 2}px` }}\n onClick={() => goToSlide(getNextIndex(1))}\n />\n </Show>\n </div>\n <Show when={local.showNavigation}>\n <div class={cn(\"smwb-carousel__navigation\", local.navigationClassName)}>\n <For each={dots()}>\n {(dot) =>\n local.navigationDotRenderer ? (\n local.navigationDotRenderer(dot.index, dot.isActive, (i) => goToSlide(i))\n ) : (\n <div\n class={cn(\"smwb-carousel__navigation__dot\", dot.isActive && \"current\")}\n onClick={() => goToSlide(dot.nextIndex)}\n />\n )\n }\n </For>\n </div>\n </Show>\n <Show when={local.enableFullscreen}>\n <Modal\n open={fullscreenIndex() !== null}\n size=\"fullscreen\"\n backdrop=\"darkBlured\"\n class=\"smwb-carousel__fullscreen\"\n onClose={() => setFullscreenIndex(null)}\n aria-label=\"Image viewer\"\n >\n <div class=\"smwb-carousel__fullscreen-content\">\n <Show when={slidesCount() > 1}>\n <Icon\n name=\"chevron_left\"\n size={40}\n class={cn(\"smwb-carousel__fullscreen-arrow\", \"smwb-carousel__fullscreen-arrow_prev\")}\n onClick={() => moveFullscreen(-1)}\n />\n </Show>\n <div\n class=\"smwb-carousel__fullscreen-stage\"\n onTouchStart={onFullscreenTouchStart}\n onTouchEnd={onFullscreenTouchEnd}\n >\n {fullscreenNode() as JSX.Element}\n </div>\n <Show when={slidesCount() > 1}>\n <Icon\n name=\"chevron_right\"\n size={40}\n class={cn(\"smwb-carousel__fullscreen-arrow\", \"smwb-carousel__fullscreen-arrow_next\")}\n onClick={() => moveFullscreen(1)}\n />\n </Show>\n <Icon\n name=\"close\"\n size={32}\n class=\"smwb-carousel__fullscreen-close\"\n onClick={() => setFullscreenIndex(null)}\n />\n </div>\n </Modal>\n </Show>\n </div>\n );\n}\n\nexport default Carousel;\n"],"names":["TAP_THRESHOLD","FLICK_VELOCITY","now","performance","Date","Carousel","props","merged","mergeProps","slidesToShow","startSlide","showNavigation","arrowsSize","autoplay","autoplayInterval","pauseOnHover","enableFullscreen","local","splitProps","resolved","resolveChildren","children","slides","toArray","slidesCount","length","getSlidesToShow","getStartSlide","showArrows","maxShift","Math","max","activeSlideIndex","setActiveSlideIndex","createSignal","animation","setAnimation","undefined","isHovered","setIsHovered","dragPx","setDragPx","isDragging","setIsDragging","fullscreenIndex","setFullscreenIndex","rootEl","trackEl","motion","isPressed","startX","startY","lastX","lastT","axis","dragged","fullscreenTouchX","slideId","createUniqueId","createEffect","start","onSlideChange","goToSlide","index","target","clamp","detachListeners","mouse","removeEventListener","onMove","onEnd","event","isTouchEvent","touches","clientX","coordX","clientY","coordY","shiftX","shiftY","abs","preventDefault","stopPropagation","atStart","atEnd","offset","isMouseEvent","totalShift","widthPerSlide","offsetWidth","velocity","movedSlides","round","onStart","button","addEventListener","passive","onSlideClick","getNextIndex","direction","isSingle","totalGroups","ceil","activeIndex","isNextDisabled","nextIndex","getSlideIndexForMultipleParts","dots","count","result","currentIndex","isLast","push","isActive","indent","shiftSlides","getSlideWidth","rootStyle","createMemo","style","cellHeightValue","toCssLength","cellHeight","aspectRatioValue","toCssNumber","aspectRatio","gapValue","gap","maxWidthValue","maxWidth","moveFullscreen","prev","fullscreenNode","idx","node","Node","cloneNode","String","timer","window","setInterval","onCleanup","clearInterval","onKeyDown","key","document","onFullscreenTouchStart","onFullscreenTouchEnd","delta","changedTouches","_el$","_tmpl$3","_el$2","firstChild","_el$3","_el$4","_$addEventListener","_ref$","mergeRefs","ref","_$use","el","_$insert","_$createComponent","Show","when","Icon","name","size","cn","top","left","onClick","dragPrevent","$$touchstart","$$mousedown","For","each","child","_el$8","_tmpl$4","_el$9","_$effect","_p$","_v$6","_v$7","getSlideStyle","_v$8","e","_$setAttribute","t","_$style","a","_$className","right","_el$5","_tmpl$","dot","navigationDotRenderer","i","_el$0","$$click","navigationClassName","Modal","open","backdrop","onClose","_el$6","_tmpl$2","_el$7","$$touchend","_v$","class","_v$2","_v$3","_v$4","_v$5","o","_$setStyleProperty","_$delegateEvents"],"mappings":"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"}
|
|
@@ -10,3 +10,8 @@ export declare function getSlideWidth(slidesToShow: number): number;
|
|
|
10
10
|
export declare function getSlideStyle(slidesToShow: number): JSX.CSSProperties;
|
|
11
11
|
export declare function getSlidesToShow(slidesToShow: number, slidesCount: number): number;
|
|
12
12
|
export declare function getStartSlide(startSlide: number, slidesCount: number): number;
|
|
13
|
+
export declare function clamp(value: number, min: number, max: number): number;
|
|
14
|
+
/** Number -> "<n>px", string -> as-is, nullish -> undefined. */
|
|
15
|
+
export declare function toCssLength(value?: number | string): string | undefined;
|
|
16
|
+
/** Number/string -> string, nullish -> undefined (for unit-less CSS values like aspect-ratio). */
|
|
17
|
+
export declare function toCssNumber(value?: number | string): string | undefined;
|