@layers-app/editor-video 0.1.1 → 0.1.3
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.js +39 -2184
- package/dist/index.js.map +1 -1
- package/package.json +6 -4
package/dist/index.js
CHANGED
|
@@ -2,15 +2,16 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
5
|
-
import { createContext, useState, useRef, useCallback, useMemo, useContext, useEffect, forwardRef, createElement
|
|
6
|
-
import { createCommand, $getNodeByKey, $setSelection,
|
|
5
|
+
import { createContext, useState, useRef, useCallback, useMemo, useContext, useEffect, forwardRef, createElement } from "react";
|
|
6
|
+
import { createCommand, $getNodeByKey, $setSelection, COMMAND_PRIORITY_LOW, DecoratorNode } from "lexical";
|
|
7
7
|
import { useTranslation } from "react-i18next";
|
|
8
|
-
import { Tooltip, ActionIcon, Text, Progress, Paper, Button, TextInput, Loader, Menu, Box, Slider, Flex, Select, Switch, Stack, Group, Textarea,
|
|
8
|
+
import { Tooltip, ActionIcon, Text, Progress, Paper, Button, TextInput, Loader, Menu, Box, Slider, Flex, Select, Switch, Stack, Group, Textarea, Modal, Divider } from "@mantine/core";
|
|
9
|
+
import { BlockWithAlignableContents } from "@lexical/react/LexicalBlockWithAlignableContents";
|
|
9
10
|
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
10
11
|
import { Dropzone as Dropzone$1, IMAGE_MIME_TYPE } from "@mantine/dropzone";
|
|
11
12
|
import ShakaPlayer from "shaka-player-react";
|
|
12
13
|
import { IconDotsVertical, IconCheck, IconChevronLeft, IconChevronRight, IconHelpCircle } from "@tabler/icons-react";
|
|
13
|
-
import {
|
|
14
|
+
import { Carousel } from "@mantine/carousel";
|
|
14
15
|
const VideoContext = createContext(null);
|
|
15
16
|
function VideoPluginProvider({
|
|
16
17
|
config,
|
|
@@ -49,12 +50,12 @@ function VideoPluginProvider({
|
|
|
49
50
|
if (!(callbacks == null ? void 0 : callbacks.onError)) return;
|
|
50
51
|
let apiError;
|
|
51
52
|
if (error && typeof error === "object" && "status" in error && typeof error.status === "number") {
|
|
52
|
-
const
|
|
53
|
+
const e = error;
|
|
53
54
|
apiError = {
|
|
54
|
-
status:
|
|
55
|
-
statusText:
|
|
56
|
-
message:
|
|
57
|
-
data:
|
|
55
|
+
status: e.status,
|
|
56
|
+
statusText: e.statusText || "",
|
|
57
|
+
message: e.message || (e.data && typeof e.data === "object" && "message" in e.data && typeof e.data.message === "string" ? e.data.message : "Request failed"),
|
|
58
|
+
data: e.data,
|
|
58
59
|
source,
|
|
59
60
|
videoId
|
|
60
61
|
};
|
|
@@ -296,105 +297,6 @@ function removeVideoNode(editor, nodeKey, deleteNode) {
|
|
|
296
297
|
function VideoToolbar({ children }) {
|
|
297
298
|
return /* @__PURE__ */ jsx("div", { className: "media-actions", children });
|
|
298
299
|
}
|
|
299
|
-
class r extends DecoratorNode {
|
|
300
|
-
constructor(t, r2) {
|
|
301
|
-
super(r2);
|
|
302
|
-
__publicField(this, "__format");
|
|
303
|
-
this.__format = t || "";
|
|
304
|
-
}
|
|
305
|
-
exportJSON() {
|
|
306
|
-
return { ...super.exportJSON(), format: this.__format || "" };
|
|
307
|
-
}
|
|
308
|
-
updateFromJSON(t) {
|
|
309
|
-
return super.updateFromJSON(t).setFormat(t.format || "");
|
|
310
|
-
}
|
|
311
|
-
canIndent() {
|
|
312
|
-
return false;
|
|
313
|
-
}
|
|
314
|
-
createDOM() {
|
|
315
|
-
return document.createElement("div");
|
|
316
|
-
}
|
|
317
|
-
updateDOM() {
|
|
318
|
-
return false;
|
|
319
|
-
}
|
|
320
|
-
setFormat(t) {
|
|
321
|
-
const r2 = this.getWritable();
|
|
322
|
-
return r2.__format = t, r2;
|
|
323
|
-
}
|
|
324
|
-
isInline() {
|
|
325
|
-
return false;
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
function e(t) {
|
|
329
|
-
return t instanceof r;
|
|
330
|
-
}
|
|
331
|
-
function d(e2, t) {
|
|
332
|
-
return e2.getEditorState().read(() => {
|
|
333
|
-
const e3 = $getNodeByKey(t);
|
|
334
|
-
return null !== e3 && e3.isSelected();
|
|
335
|
-
});
|
|
336
|
-
}
|
|
337
|
-
function u(c) {
|
|
338
|
-
const [u2] = useLexicalComposerContext(), [p2, s] = useState(() => d(u2, c));
|
|
339
|
-
useEffect(() => {
|
|
340
|
-
let e2 = true;
|
|
341
|
-
const t = u2.registerUpdateListener(() => {
|
|
342
|
-
e2 && s(d(u2, c));
|
|
343
|
-
});
|
|
344
|
-
return () => {
|
|
345
|
-
e2 = false, t();
|
|
346
|
-
};
|
|
347
|
-
}, [u2, c]);
|
|
348
|
-
return [p2, useCallback((e2) => {
|
|
349
|
-
u2.update(() => {
|
|
350
|
-
let a = $getSelection();
|
|
351
|
-
$isNodeSelection(a) || (a = $createNodeSelection(), $setSelection(a)), $isNodeSelection(a) && (e2 ? a.add(c) : a.delete(c));
|
|
352
|
-
});
|
|
353
|
-
}, [u2, c]), useCallback(() => {
|
|
354
|
-
u2.update(() => {
|
|
355
|
-
const e2 = $getSelection();
|
|
356
|
-
$isNodeSelection(e2) && e2.clear();
|
|
357
|
-
});
|
|
358
|
-
}, [u2])];
|
|
359
|
-
}
|
|
360
|
-
function R(t, ...e2) {
|
|
361
|
-
const n = new URL("https://lexical.dev/docs/error"), o = new URLSearchParams();
|
|
362
|
-
o.append("code", t);
|
|
363
|
-
for (const t2 of e2) o.append("v", t2);
|
|
364
|
-
throw n.search = o.toString(), Error(`Minified Lexical error #${t}; visit ${n.toString()} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`);
|
|
365
|
-
}
|
|
366
|
-
const T = "undefined" != typeof window && void 0 !== window.document && void 0 !== window.document.createElement, B = T && "documentMode" in document ? document.documentMode : null;
|
|
367
|
-
!(!T || !("InputEvent" in window) || B) && "getTargetRanges" in new window.InputEvent("input");
|
|
368
|
-
function U(...t) {
|
|
369
|
-
return () => {
|
|
370
|
-
for (let e2 = t.length - 1; e2 >= 0; e2--) t[e2]();
|
|
371
|
-
t.length = 0;
|
|
372
|
-
};
|
|
373
|
-
}
|
|
374
|
-
function xt(t) {
|
|
375
|
-
const e2 = $findMatchingParent(t, (t2) => $isElementNode(t2) && !t2.isInline());
|
|
376
|
-
return $isElementNode(e2) || R(4, t.__key), e2;
|
|
377
|
-
}
|
|
378
|
-
function p({ children: p2, format: g, nodeKey: N, className: C }) {
|
|
379
|
-
const [h] = useLexicalComposerContext(), [v, y, F] = u(N), L = useRef(null);
|
|
380
|
-
return useEffect(() => U(h.registerCommand(FORMAT_ELEMENT_COMMAND, (e$1) => {
|
|
381
|
-
if (v) {
|
|
382
|
-
const r2 = $getSelection();
|
|
383
|
-
if ($isNodeSelection(r2)) {
|
|
384
|
-
const r3 = $getNodeByKey(N);
|
|
385
|
-
e(r3) && r3.setFormat(e$1);
|
|
386
|
-
} else if ($isRangeSelection(r2)) {
|
|
387
|
-
const o = r2.getNodes();
|
|
388
|
-
for (const r3 of o) if (e(r3)) r3.setFormat(e$1);
|
|
389
|
-
else {
|
|
390
|
-
xt(r3).setFormat(e$1);
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
|
-
return true;
|
|
394
|
-
}
|
|
395
|
-
return false;
|
|
396
|
-
}, COMMAND_PRIORITY_LOW), h.registerCommand(CLICK_COMMAND, (e2) => e2.target === L.current && (e2.preventDefault(), e2.shiftKey || F(), y(!v), true), COMMAND_PRIORITY_LOW)), [F, h, v, N, y]), jsx("div", { className: [C.base, v ? C.focus : null].filter(Boolean).join(" "), ref: L, style: { textAlign: g || void 0 }, children: p2 });
|
|
397
|
-
}
|
|
398
300
|
function StarsAnimation({ size = 32 }) {
|
|
399
301
|
return /* @__PURE__ */ jsx(
|
|
400
302
|
"div",
|
|
@@ -1011,9 +913,9 @@ async function uploadChunkWithProgress(videoId, file, offset, end, total, baseUr
|
|
|
1011
913
|
reject(new Error("Upload cancelled"));
|
|
1012
914
|
});
|
|
1013
915
|
}
|
|
1014
|
-
xhr.upload.addEventListener("progress", (
|
|
1015
|
-
if (
|
|
1016
|
-
onProgress(
|
|
916
|
+
xhr.upload.addEventListener("progress", (e) => {
|
|
917
|
+
if (e.lengthComputable && onProgress) {
|
|
918
|
+
onProgress(e.loaded);
|
|
1017
919
|
}
|
|
1018
920
|
});
|
|
1019
921
|
xhr.addEventListener("load", () => {
|
|
@@ -2177,11 +2079,11 @@ function LinkState({
|
|
|
2177
2079
|
onSubmit
|
|
2178
2080
|
}) {
|
|
2179
2081
|
const { t } = useTranslation();
|
|
2180
|
-
const stopMousePropagation = useCallback((
|
|
2181
|
-
|
|
2082
|
+
const stopMousePropagation = useCallback((e) => {
|
|
2083
|
+
e.stopPropagation();
|
|
2182
2084
|
}, []);
|
|
2183
|
-
const stopPointerPropagation = useCallback((
|
|
2184
|
-
|
|
2085
|
+
const stopPointerPropagation = useCallback((e) => {
|
|
2086
|
+
e.stopPropagation();
|
|
2185
2087
|
}, []);
|
|
2186
2088
|
return /* @__PURE__ */ jsxs(
|
|
2187
2089
|
"div",
|
|
@@ -3840,8 +3742,8 @@ function VideoPlayerState({
|
|
|
3840
3742
|
if (errorHandlerRef.current) {
|
|
3841
3743
|
try {
|
|
3842
3744
|
player.removeEventListener("error", errorHandlerRef.current);
|
|
3843
|
-
} catch (
|
|
3844
|
-
console.warn("Error removing old event listener:",
|
|
3745
|
+
} catch (e) {
|
|
3746
|
+
console.warn("Error removing old event listener:", e);
|
|
3845
3747
|
}
|
|
3846
3748
|
}
|
|
3847
3749
|
const errorHandler = (event) => {
|
|
@@ -3870,8 +3772,8 @@ function VideoPlayerState({
|
|
|
3870
3772
|
if (player && errorHandlerRef.current) {
|
|
3871
3773
|
try {
|
|
3872
3774
|
player.removeEventListener("error", errorHandlerRef.current);
|
|
3873
|
-
} catch (
|
|
3874
|
-
console.warn("Error removing event listener on cleanup:",
|
|
3775
|
+
} catch (e) {
|
|
3776
|
+
console.warn("Error removing event listener on cleanup:", e);
|
|
3875
3777
|
}
|
|
3876
3778
|
}
|
|
3877
3779
|
};
|
|
@@ -4929,7 +4831,7 @@ function VideoUploadComponent({
|
|
|
4929
4831
|
}
|
|
4930
4832
|
};
|
|
4931
4833
|
return /* @__PURE__ */ jsx(
|
|
4932
|
-
|
|
4834
|
+
BlockWithAlignableContents,
|
|
4933
4835
|
{
|
|
4934
4836
|
className,
|
|
4935
4837
|
format,
|
|
@@ -4945,9 +4847,9 @@ function VideoUploadComponent({
|
|
|
4945
4847
|
"div",
|
|
4946
4848
|
{
|
|
4947
4849
|
className: "video-upload-header",
|
|
4948
|
-
onClick: (
|
|
4949
|
-
onMouseDown: (
|
|
4950
|
-
onPointerDown: (
|
|
4850
|
+
onClick: (e) => e.stopPropagation(),
|
|
4851
|
+
onMouseDown: (e) => e.stopPropagation(),
|
|
4852
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
4951
4853
|
children: /* @__PURE__ */ jsx(
|
|
4952
4854
|
Select,
|
|
4953
4855
|
{
|
|
@@ -5224,7 +5126,7 @@ function ChapterRow({
|
|
|
5224
5126
|
variant: "default",
|
|
5225
5127
|
placeholder: startTimePlaceholder,
|
|
5226
5128
|
value: startInput,
|
|
5227
|
-
onChange: (
|
|
5129
|
+
onChange: (e) => handleStartChange(e.currentTarget.value),
|
|
5228
5130
|
style: { width: "100%" },
|
|
5229
5131
|
styles: {
|
|
5230
5132
|
input: {
|
|
@@ -5250,7 +5152,7 @@ function ChapterRow({
|
|
|
5250
5152
|
variant: "default",
|
|
5251
5153
|
placeholder: endTimePlaceholder,
|
|
5252
5154
|
value: endInput,
|
|
5253
|
-
onChange: (
|
|
5155
|
+
onChange: (e) => handleEndChange(e.currentTarget.value),
|
|
5254
5156
|
style: { width: "100%" },
|
|
5255
5157
|
styles: {
|
|
5256
5158
|
input: {
|
|
@@ -5285,7 +5187,7 @@ function ChapterRow({
|
|
|
5285
5187
|
variant: "default",
|
|
5286
5188
|
placeholder: titlePlaceholder,
|
|
5287
5189
|
value: chapter.title,
|
|
5288
|
-
onChange: (
|
|
5190
|
+
onChange: (e) => onTitleChange(index, e.currentTarget.value),
|
|
5289
5191
|
styles: {
|
|
5290
5192
|
root: {
|
|
5291
5193
|
width: "100%",
|
|
@@ -5390,8 +5292,8 @@ function ChaptersSection({
|
|
|
5390
5292
|
return;
|
|
5391
5293
|
}
|
|
5392
5294
|
const updateDuration = () => {
|
|
5393
|
-
const
|
|
5394
|
-
setDurationSec(Number.isFinite(
|
|
5295
|
+
const d = nativeVideo.duration;
|
|
5296
|
+
setDurationSec(Number.isFinite(d) && d > 0 ? d : null);
|
|
5395
5297
|
};
|
|
5396
5298
|
updateDuration();
|
|
5397
5299
|
nativeVideo.addEventListener("loadedmetadata", updateDuration);
|
|
@@ -5583,8 +5485,8 @@ function ChaptersSection({
|
|
|
5583
5485
|
size: "sm",
|
|
5584
5486
|
color: "var(--mantine-primary-color-filled)",
|
|
5585
5487
|
checked: chaptersDisabled,
|
|
5586
|
-
onChange: (
|
|
5587
|
-
const disabled2 =
|
|
5488
|
+
onChange: (e) => {
|
|
5489
|
+
const disabled2 = e.currentTarget.checked;
|
|
5588
5490
|
onChaptersDisabledChange(disabled2);
|
|
5589
5491
|
if (disabled2 && autoChaptersEnabled) {
|
|
5590
5492
|
onAutoChaptersChange(false);
|
|
@@ -5602,8 +5504,8 @@ function ChaptersSection({
|
|
|
5602
5504
|
color: "var(--mantine-primary-color-filled)",
|
|
5603
5505
|
checked: autoChaptersEnabled,
|
|
5604
5506
|
disabled: chaptersDisabled,
|
|
5605
|
-
onChange: (
|
|
5606
|
-
const enabled =
|
|
5507
|
+
onChange: (e) => {
|
|
5508
|
+
const enabled = e.currentTarget.checked;
|
|
5607
5509
|
onAutoChaptersChange(enabled);
|
|
5608
5510
|
if (enabled) {
|
|
5609
5511
|
handleSuggest();
|
|
@@ -5670,2053 +5572,6 @@ function ChaptersSection({
|
|
|
5670
5572
|
editableChapters.length === 0 && !isLoading && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", mt: "xs", children: emptyLabel })
|
|
5671
5573
|
] });
|
|
5672
5574
|
}
|
|
5673
|
-
function isObject$1(subject) {
|
|
5674
|
-
return Object.prototype.toString.call(subject) === "[object Object]";
|
|
5675
|
-
}
|
|
5676
|
-
function isRecord(subject) {
|
|
5677
|
-
return isObject$1(subject) || Array.isArray(subject);
|
|
5678
|
-
}
|
|
5679
|
-
function canUseDOM() {
|
|
5680
|
-
return !!(typeof window !== "undefined" && window.document && window.document.createElement);
|
|
5681
|
-
}
|
|
5682
|
-
function areOptionsEqual(optionsA, optionsB) {
|
|
5683
|
-
const optionsAKeys = Object.keys(optionsA);
|
|
5684
|
-
const optionsBKeys = Object.keys(optionsB);
|
|
5685
|
-
if (optionsAKeys.length !== optionsBKeys.length) return false;
|
|
5686
|
-
const breakpointsA = JSON.stringify(Object.keys(optionsA.breakpoints || {}));
|
|
5687
|
-
const breakpointsB = JSON.stringify(Object.keys(optionsB.breakpoints || {}));
|
|
5688
|
-
if (breakpointsA !== breakpointsB) return false;
|
|
5689
|
-
return optionsAKeys.every((key) => {
|
|
5690
|
-
const valueA = optionsA[key];
|
|
5691
|
-
const valueB = optionsB[key];
|
|
5692
|
-
if (typeof valueA === "function") return `${valueA}` === `${valueB}`;
|
|
5693
|
-
if (!isRecord(valueA) || !isRecord(valueB)) return valueA === valueB;
|
|
5694
|
-
return areOptionsEqual(valueA, valueB);
|
|
5695
|
-
});
|
|
5696
|
-
}
|
|
5697
|
-
function sortAndMapPluginToOptions(plugins) {
|
|
5698
|
-
return plugins.concat().sort((a, b) => a.name > b.name ? 1 : -1).map((plugin) => plugin.options);
|
|
5699
|
-
}
|
|
5700
|
-
function arePluginsEqual(pluginsA, pluginsB) {
|
|
5701
|
-
if (pluginsA.length !== pluginsB.length) return false;
|
|
5702
|
-
const optionsA = sortAndMapPluginToOptions(pluginsA);
|
|
5703
|
-
const optionsB = sortAndMapPluginToOptions(pluginsB);
|
|
5704
|
-
return optionsA.every((optionA, index) => {
|
|
5705
|
-
const optionB = optionsB[index];
|
|
5706
|
-
return areOptionsEqual(optionA, optionB);
|
|
5707
|
-
});
|
|
5708
|
-
}
|
|
5709
|
-
function isNumber(subject) {
|
|
5710
|
-
return typeof subject === "number";
|
|
5711
|
-
}
|
|
5712
|
-
function isString(subject) {
|
|
5713
|
-
return typeof subject === "string";
|
|
5714
|
-
}
|
|
5715
|
-
function isBoolean(subject) {
|
|
5716
|
-
return typeof subject === "boolean";
|
|
5717
|
-
}
|
|
5718
|
-
function isObject(subject) {
|
|
5719
|
-
return Object.prototype.toString.call(subject) === "[object Object]";
|
|
5720
|
-
}
|
|
5721
|
-
function mathAbs(n) {
|
|
5722
|
-
return Math.abs(n);
|
|
5723
|
-
}
|
|
5724
|
-
function mathSign(n) {
|
|
5725
|
-
return Math.sign(n);
|
|
5726
|
-
}
|
|
5727
|
-
function deltaAbs(valueB, valueA) {
|
|
5728
|
-
return mathAbs(valueB - valueA);
|
|
5729
|
-
}
|
|
5730
|
-
function factorAbs(valueB, valueA) {
|
|
5731
|
-
if (valueB === 0 || valueA === 0) return 0;
|
|
5732
|
-
if (mathAbs(valueB) <= mathAbs(valueA)) return 0;
|
|
5733
|
-
const diff = deltaAbs(mathAbs(valueB), mathAbs(valueA));
|
|
5734
|
-
return mathAbs(diff / valueB);
|
|
5735
|
-
}
|
|
5736
|
-
function roundToTwoDecimals(num) {
|
|
5737
|
-
return Math.round(num * 100) / 100;
|
|
5738
|
-
}
|
|
5739
|
-
function arrayKeys(array) {
|
|
5740
|
-
return objectKeys(array).map(Number);
|
|
5741
|
-
}
|
|
5742
|
-
function arrayLast(array) {
|
|
5743
|
-
return array[arrayLastIndex(array)];
|
|
5744
|
-
}
|
|
5745
|
-
function arrayLastIndex(array) {
|
|
5746
|
-
return Math.max(0, array.length - 1);
|
|
5747
|
-
}
|
|
5748
|
-
function arrayIsLastIndex(array, index) {
|
|
5749
|
-
return index === arrayLastIndex(array);
|
|
5750
|
-
}
|
|
5751
|
-
function arrayFromNumber(n, startAt = 0) {
|
|
5752
|
-
return Array.from(Array(n), (_, i) => startAt + i);
|
|
5753
|
-
}
|
|
5754
|
-
function objectKeys(object) {
|
|
5755
|
-
return Object.keys(object);
|
|
5756
|
-
}
|
|
5757
|
-
function objectsMergeDeep(objectA, objectB) {
|
|
5758
|
-
return [objectA, objectB].reduce((mergedObjects, currentObject) => {
|
|
5759
|
-
objectKeys(currentObject).forEach((key) => {
|
|
5760
|
-
const valueA = mergedObjects[key];
|
|
5761
|
-
const valueB = currentObject[key];
|
|
5762
|
-
const areObjects = isObject(valueA) && isObject(valueB);
|
|
5763
|
-
mergedObjects[key] = areObjects ? objectsMergeDeep(valueA, valueB) : valueB;
|
|
5764
|
-
});
|
|
5765
|
-
return mergedObjects;
|
|
5766
|
-
}, {});
|
|
5767
|
-
}
|
|
5768
|
-
function isMouseEvent(evt, ownerWindow) {
|
|
5769
|
-
return typeof ownerWindow.MouseEvent !== "undefined" && evt instanceof ownerWindow.MouseEvent;
|
|
5770
|
-
}
|
|
5771
|
-
function Alignment(align, viewSize) {
|
|
5772
|
-
const predefined = {
|
|
5773
|
-
start,
|
|
5774
|
-
center,
|
|
5775
|
-
end
|
|
5776
|
-
};
|
|
5777
|
-
function start() {
|
|
5778
|
-
return 0;
|
|
5779
|
-
}
|
|
5780
|
-
function center(n) {
|
|
5781
|
-
return end(n) / 2;
|
|
5782
|
-
}
|
|
5783
|
-
function end(n) {
|
|
5784
|
-
return viewSize - n;
|
|
5785
|
-
}
|
|
5786
|
-
function measure(n, index) {
|
|
5787
|
-
if (isString(align)) return predefined[align](n);
|
|
5788
|
-
return align(viewSize, n, index);
|
|
5789
|
-
}
|
|
5790
|
-
const self = {
|
|
5791
|
-
measure
|
|
5792
|
-
};
|
|
5793
|
-
return self;
|
|
5794
|
-
}
|
|
5795
|
-
function EventStore() {
|
|
5796
|
-
let listeners = [];
|
|
5797
|
-
function add(node, type, handler, options = {
|
|
5798
|
-
passive: true
|
|
5799
|
-
}) {
|
|
5800
|
-
let removeListener;
|
|
5801
|
-
if ("addEventListener" in node) {
|
|
5802
|
-
node.addEventListener(type, handler, options);
|
|
5803
|
-
removeListener = () => node.removeEventListener(type, handler, options);
|
|
5804
|
-
} else {
|
|
5805
|
-
const legacyMediaQueryList = node;
|
|
5806
|
-
legacyMediaQueryList.addListener(handler);
|
|
5807
|
-
removeListener = () => legacyMediaQueryList.removeListener(handler);
|
|
5808
|
-
}
|
|
5809
|
-
listeners.push(removeListener);
|
|
5810
|
-
return self;
|
|
5811
|
-
}
|
|
5812
|
-
function clear() {
|
|
5813
|
-
listeners = listeners.filter((remove) => remove());
|
|
5814
|
-
}
|
|
5815
|
-
const self = {
|
|
5816
|
-
add,
|
|
5817
|
-
clear
|
|
5818
|
-
};
|
|
5819
|
-
return self;
|
|
5820
|
-
}
|
|
5821
|
-
function Animations(ownerDocument, ownerWindow, update, render) {
|
|
5822
|
-
const documentVisibleHandler = EventStore();
|
|
5823
|
-
const fixedTimeStep = 1e3 / 60;
|
|
5824
|
-
let lastTimeStamp = null;
|
|
5825
|
-
let accumulatedTime = 0;
|
|
5826
|
-
let animationId = 0;
|
|
5827
|
-
function init() {
|
|
5828
|
-
documentVisibleHandler.add(ownerDocument, "visibilitychange", () => {
|
|
5829
|
-
if (ownerDocument.hidden) reset();
|
|
5830
|
-
});
|
|
5831
|
-
}
|
|
5832
|
-
function destroy() {
|
|
5833
|
-
stop();
|
|
5834
|
-
documentVisibleHandler.clear();
|
|
5835
|
-
}
|
|
5836
|
-
function animate(timeStamp) {
|
|
5837
|
-
if (!animationId) return;
|
|
5838
|
-
if (!lastTimeStamp) {
|
|
5839
|
-
lastTimeStamp = timeStamp;
|
|
5840
|
-
update();
|
|
5841
|
-
update();
|
|
5842
|
-
}
|
|
5843
|
-
const timeElapsed = timeStamp - lastTimeStamp;
|
|
5844
|
-
lastTimeStamp = timeStamp;
|
|
5845
|
-
accumulatedTime += timeElapsed;
|
|
5846
|
-
while (accumulatedTime >= fixedTimeStep) {
|
|
5847
|
-
update();
|
|
5848
|
-
accumulatedTime -= fixedTimeStep;
|
|
5849
|
-
}
|
|
5850
|
-
const alpha = accumulatedTime / fixedTimeStep;
|
|
5851
|
-
render(alpha);
|
|
5852
|
-
if (animationId) {
|
|
5853
|
-
animationId = ownerWindow.requestAnimationFrame(animate);
|
|
5854
|
-
}
|
|
5855
|
-
}
|
|
5856
|
-
function start() {
|
|
5857
|
-
if (animationId) return;
|
|
5858
|
-
animationId = ownerWindow.requestAnimationFrame(animate);
|
|
5859
|
-
}
|
|
5860
|
-
function stop() {
|
|
5861
|
-
ownerWindow.cancelAnimationFrame(animationId);
|
|
5862
|
-
lastTimeStamp = null;
|
|
5863
|
-
accumulatedTime = 0;
|
|
5864
|
-
animationId = 0;
|
|
5865
|
-
}
|
|
5866
|
-
function reset() {
|
|
5867
|
-
lastTimeStamp = null;
|
|
5868
|
-
accumulatedTime = 0;
|
|
5869
|
-
}
|
|
5870
|
-
const self = {
|
|
5871
|
-
init,
|
|
5872
|
-
destroy,
|
|
5873
|
-
start,
|
|
5874
|
-
stop,
|
|
5875
|
-
update,
|
|
5876
|
-
render
|
|
5877
|
-
};
|
|
5878
|
-
return self;
|
|
5879
|
-
}
|
|
5880
|
-
function Axis(axis, contentDirection) {
|
|
5881
|
-
const isRightToLeft = contentDirection === "rtl";
|
|
5882
|
-
const isVertical = axis === "y";
|
|
5883
|
-
const scroll = isVertical ? "y" : "x";
|
|
5884
|
-
const cross = isVertical ? "x" : "y";
|
|
5885
|
-
const sign = !isVertical && isRightToLeft ? -1 : 1;
|
|
5886
|
-
const startEdge = getStartEdge();
|
|
5887
|
-
const endEdge = getEndEdge();
|
|
5888
|
-
function measureSize(nodeRect) {
|
|
5889
|
-
const {
|
|
5890
|
-
height,
|
|
5891
|
-
width
|
|
5892
|
-
} = nodeRect;
|
|
5893
|
-
return isVertical ? height : width;
|
|
5894
|
-
}
|
|
5895
|
-
function getStartEdge() {
|
|
5896
|
-
if (isVertical) return "top";
|
|
5897
|
-
return isRightToLeft ? "right" : "left";
|
|
5898
|
-
}
|
|
5899
|
-
function getEndEdge() {
|
|
5900
|
-
if (isVertical) return "bottom";
|
|
5901
|
-
return isRightToLeft ? "left" : "right";
|
|
5902
|
-
}
|
|
5903
|
-
function direction(n) {
|
|
5904
|
-
return n * sign;
|
|
5905
|
-
}
|
|
5906
|
-
const self = {
|
|
5907
|
-
scroll,
|
|
5908
|
-
cross,
|
|
5909
|
-
startEdge,
|
|
5910
|
-
endEdge,
|
|
5911
|
-
measureSize,
|
|
5912
|
-
direction
|
|
5913
|
-
};
|
|
5914
|
-
return self;
|
|
5915
|
-
}
|
|
5916
|
-
function Limit(min = 0, max = 0) {
|
|
5917
|
-
const length = mathAbs(min - max);
|
|
5918
|
-
function reachedMin(n) {
|
|
5919
|
-
return n < min;
|
|
5920
|
-
}
|
|
5921
|
-
function reachedMax(n) {
|
|
5922
|
-
return n > max;
|
|
5923
|
-
}
|
|
5924
|
-
function reachedAny(n) {
|
|
5925
|
-
return reachedMin(n) || reachedMax(n);
|
|
5926
|
-
}
|
|
5927
|
-
function constrain(n) {
|
|
5928
|
-
if (!reachedAny(n)) return n;
|
|
5929
|
-
return reachedMin(n) ? min : max;
|
|
5930
|
-
}
|
|
5931
|
-
function removeOffset(n) {
|
|
5932
|
-
if (!length) return n;
|
|
5933
|
-
return n - length * Math.ceil((n - max) / length);
|
|
5934
|
-
}
|
|
5935
|
-
const self = {
|
|
5936
|
-
length,
|
|
5937
|
-
max,
|
|
5938
|
-
min,
|
|
5939
|
-
constrain,
|
|
5940
|
-
reachedAny,
|
|
5941
|
-
reachedMax,
|
|
5942
|
-
reachedMin,
|
|
5943
|
-
removeOffset
|
|
5944
|
-
};
|
|
5945
|
-
return self;
|
|
5946
|
-
}
|
|
5947
|
-
function Counter(max, start, loop) {
|
|
5948
|
-
const {
|
|
5949
|
-
constrain
|
|
5950
|
-
} = Limit(0, max);
|
|
5951
|
-
const loopEnd = max + 1;
|
|
5952
|
-
let counter = withinLimit(start);
|
|
5953
|
-
function withinLimit(n) {
|
|
5954
|
-
return !loop ? constrain(n) : mathAbs((loopEnd + n) % loopEnd);
|
|
5955
|
-
}
|
|
5956
|
-
function get() {
|
|
5957
|
-
return counter;
|
|
5958
|
-
}
|
|
5959
|
-
function set(n) {
|
|
5960
|
-
counter = withinLimit(n);
|
|
5961
|
-
return self;
|
|
5962
|
-
}
|
|
5963
|
-
function add(n) {
|
|
5964
|
-
return clone().set(get() + n);
|
|
5965
|
-
}
|
|
5966
|
-
function clone() {
|
|
5967
|
-
return Counter(max, get(), loop);
|
|
5968
|
-
}
|
|
5969
|
-
const self = {
|
|
5970
|
-
get,
|
|
5971
|
-
set,
|
|
5972
|
-
add,
|
|
5973
|
-
clone
|
|
5974
|
-
};
|
|
5975
|
-
return self;
|
|
5976
|
-
}
|
|
5977
|
-
function DragHandler(axis, rootNode, ownerDocument, ownerWindow, target, dragTracker, location, animation, scrollTo, scrollBody, scrollTarget, index, eventHandler, percentOfView, dragFree, dragThreshold, skipSnaps, baseFriction, watchDrag) {
|
|
5978
|
-
const {
|
|
5979
|
-
cross: crossAxis,
|
|
5980
|
-
direction
|
|
5981
|
-
} = axis;
|
|
5982
|
-
const focusNodes = ["INPUT", "SELECT", "TEXTAREA"];
|
|
5983
|
-
const nonPassiveEvent = {
|
|
5984
|
-
passive: false
|
|
5985
|
-
};
|
|
5986
|
-
const initEvents = EventStore();
|
|
5987
|
-
const dragEvents = EventStore();
|
|
5988
|
-
const goToNextThreshold = Limit(50, 225).constrain(percentOfView.measure(20));
|
|
5989
|
-
const snapForceBoost = {
|
|
5990
|
-
mouse: 300,
|
|
5991
|
-
touch: 400
|
|
5992
|
-
};
|
|
5993
|
-
const freeForceBoost = {
|
|
5994
|
-
mouse: 500,
|
|
5995
|
-
touch: 600
|
|
5996
|
-
};
|
|
5997
|
-
const baseSpeed = dragFree ? 43 : 25;
|
|
5998
|
-
let isMoving = false;
|
|
5999
|
-
let startScroll = 0;
|
|
6000
|
-
let startCross = 0;
|
|
6001
|
-
let pointerIsDown = false;
|
|
6002
|
-
let preventScroll = false;
|
|
6003
|
-
let preventClick = false;
|
|
6004
|
-
let isMouse = false;
|
|
6005
|
-
function init(emblaApi) {
|
|
6006
|
-
if (!watchDrag) return;
|
|
6007
|
-
function downIfAllowed(evt) {
|
|
6008
|
-
if (isBoolean(watchDrag) || watchDrag(emblaApi, evt)) down(evt);
|
|
6009
|
-
}
|
|
6010
|
-
const node = rootNode;
|
|
6011
|
-
initEvents.add(node, "dragstart", (evt) => evt.preventDefault(), nonPassiveEvent).add(node, "touchmove", () => void 0, nonPassiveEvent).add(node, "touchend", () => void 0).add(node, "touchstart", downIfAllowed).add(node, "mousedown", downIfAllowed).add(node, "touchcancel", up).add(node, "contextmenu", up).add(node, "click", click, true);
|
|
6012
|
-
}
|
|
6013
|
-
function destroy() {
|
|
6014
|
-
initEvents.clear();
|
|
6015
|
-
dragEvents.clear();
|
|
6016
|
-
}
|
|
6017
|
-
function addDragEvents() {
|
|
6018
|
-
const node = isMouse ? ownerDocument : rootNode;
|
|
6019
|
-
dragEvents.add(node, "touchmove", move, nonPassiveEvent).add(node, "touchend", up).add(node, "mousemove", move, nonPassiveEvent).add(node, "mouseup", up);
|
|
6020
|
-
}
|
|
6021
|
-
function isFocusNode(node) {
|
|
6022
|
-
const nodeName = node.nodeName || "";
|
|
6023
|
-
return focusNodes.includes(nodeName);
|
|
6024
|
-
}
|
|
6025
|
-
function forceBoost() {
|
|
6026
|
-
const boost = dragFree ? freeForceBoost : snapForceBoost;
|
|
6027
|
-
const type = isMouse ? "mouse" : "touch";
|
|
6028
|
-
return boost[type];
|
|
6029
|
-
}
|
|
6030
|
-
function allowedForce(force, targetChanged) {
|
|
6031
|
-
const next = index.add(mathSign(force) * -1);
|
|
6032
|
-
const baseForce = scrollTarget.byDistance(force, !dragFree).distance;
|
|
6033
|
-
if (dragFree || mathAbs(force) < goToNextThreshold) return baseForce;
|
|
6034
|
-
if (skipSnaps && targetChanged) return baseForce * 0.5;
|
|
6035
|
-
return scrollTarget.byIndex(next.get(), 0).distance;
|
|
6036
|
-
}
|
|
6037
|
-
function down(evt) {
|
|
6038
|
-
const isMouseEvt = isMouseEvent(evt, ownerWindow);
|
|
6039
|
-
isMouse = isMouseEvt;
|
|
6040
|
-
preventClick = dragFree && isMouseEvt && !evt.buttons && isMoving;
|
|
6041
|
-
isMoving = deltaAbs(target.get(), location.get()) >= 2;
|
|
6042
|
-
if (isMouseEvt && evt.button !== 0) return;
|
|
6043
|
-
if (isFocusNode(evt.target)) return;
|
|
6044
|
-
pointerIsDown = true;
|
|
6045
|
-
dragTracker.pointerDown(evt);
|
|
6046
|
-
scrollBody.useFriction(0).useDuration(0);
|
|
6047
|
-
target.set(location);
|
|
6048
|
-
addDragEvents();
|
|
6049
|
-
startScroll = dragTracker.readPoint(evt);
|
|
6050
|
-
startCross = dragTracker.readPoint(evt, crossAxis);
|
|
6051
|
-
eventHandler.emit("pointerDown");
|
|
6052
|
-
}
|
|
6053
|
-
function move(evt) {
|
|
6054
|
-
const isTouchEvt = !isMouseEvent(evt, ownerWindow);
|
|
6055
|
-
if (isTouchEvt && evt.touches.length >= 2) return up(evt);
|
|
6056
|
-
const lastScroll = dragTracker.readPoint(evt);
|
|
6057
|
-
const lastCross = dragTracker.readPoint(evt, crossAxis);
|
|
6058
|
-
const diffScroll = deltaAbs(lastScroll, startScroll);
|
|
6059
|
-
const diffCross = deltaAbs(lastCross, startCross);
|
|
6060
|
-
if (!preventScroll && !isMouse) {
|
|
6061
|
-
if (!evt.cancelable) return up(evt);
|
|
6062
|
-
preventScroll = diffScroll > diffCross;
|
|
6063
|
-
if (!preventScroll) return up(evt);
|
|
6064
|
-
}
|
|
6065
|
-
const diff = dragTracker.pointerMove(evt);
|
|
6066
|
-
if (diffScroll > dragThreshold) preventClick = true;
|
|
6067
|
-
scrollBody.useFriction(0.3).useDuration(0.75);
|
|
6068
|
-
animation.start();
|
|
6069
|
-
target.add(direction(diff));
|
|
6070
|
-
evt.preventDefault();
|
|
6071
|
-
}
|
|
6072
|
-
function up(evt) {
|
|
6073
|
-
const currentLocation = scrollTarget.byDistance(0, false);
|
|
6074
|
-
const targetChanged = currentLocation.index !== index.get();
|
|
6075
|
-
const rawForce = dragTracker.pointerUp(evt) * forceBoost();
|
|
6076
|
-
const force = allowedForce(direction(rawForce), targetChanged);
|
|
6077
|
-
const forceFactor = factorAbs(rawForce, force);
|
|
6078
|
-
const speed = baseSpeed - 10 * forceFactor;
|
|
6079
|
-
const friction = baseFriction + forceFactor / 50;
|
|
6080
|
-
preventScroll = false;
|
|
6081
|
-
pointerIsDown = false;
|
|
6082
|
-
dragEvents.clear();
|
|
6083
|
-
scrollBody.useDuration(speed).useFriction(friction);
|
|
6084
|
-
scrollTo.distance(force, !dragFree);
|
|
6085
|
-
isMouse = false;
|
|
6086
|
-
eventHandler.emit("pointerUp");
|
|
6087
|
-
}
|
|
6088
|
-
function click(evt) {
|
|
6089
|
-
if (preventClick) {
|
|
6090
|
-
evt.stopPropagation();
|
|
6091
|
-
evt.preventDefault();
|
|
6092
|
-
preventClick = false;
|
|
6093
|
-
}
|
|
6094
|
-
}
|
|
6095
|
-
function pointerDown() {
|
|
6096
|
-
return pointerIsDown;
|
|
6097
|
-
}
|
|
6098
|
-
const self = {
|
|
6099
|
-
init,
|
|
6100
|
-
destroy,
|
|
6101
|
-
pointerDown
|
|
6102
|
-
};
|
|
6103
|
-
return self;
|
|
6104
|
-
}
|
|
6105
|
-
function DragTracker(axis, ownerWindow) {
|
|
6106
|
-
const logInterval = 170;
|
|
6107
|
-
let startEvent;
|
|
6108
|
-
let lastEvent;
|
|
6109
|
-
function readTime(evt) {
|
|
6110
|
-
return evt.timeStamp;
|
|
6111
|
-
}
|
|
6112
|
-
function readPoint(evt, evtAxis) {
|
|
6113
|
-
const property = evtAxis || axis.scroll;
|
|
6114
|
-
const coord = `client${property === "x" ? "X" : "Y"}`;
|
|
6115
|
-
return (isMouseEvent(evt, ownerWindow) ? evt : evt.touches[0])[coord];
|
|
6116
|
-
}
|
|
6117
|
-
function pointerDown(evt) {
|
|
6118
|
-
startEvent = evt;
|
|
6119
|
-
lastEvent = evt;
|
|
6120
|
-
return readPoint(evt);
|
|
6121
|
-
}
|
|
6122
|
-
function pointerMove(evt) {
|
|
6123
|
-
const diff = readPoint(evt) - readPoint(lastEvent);
|
|
6124
|
-
const expired = readTime(evt) - readTime(startEvent) > logInterval;
|
|
6125
|
-
lastEvent = evt;
|
|
6126
|
-
if (expired) startEvent = evt;
|
|
6127
|
-
return diff;
|
|
6128
|
-
}
|
|
6129
|
-
function pointerUp(evt) {
|
|
6130
|
-
if (!startEvent || !lastEvent) return 0;
|
|
6131
|
-
const diffDrag = readPoint(lastEvent) - readPoint(startEvent);
|
|
6132
|
-
const diffTime = readTime(evt) - readTime(startEvent);
|
|
6133
|
-
const expired = readTime(evt) - readTime(lastEvent) > logInterval;
|
|
6134
|
-
const force = diffDrag / diffTime;
|
|
6135
|
-
const isFlick = diffTime && !expired && mathAbs(force) > 0.1;
|
|
6136
|
-
return isFlick ? force : 0;
|
|
6137
|
-
}
|
|
6138
|
-
const self = {
|
|
6139
|
-
pointerDown,
|
|
6140
|
-
pointerMove,
|
|
6141
|
-
pointerUp,
|
|
6142
|
-
readPoint
|
|
6143
|
-
};
|
|
6144
|
-
return self;
|
|
6145
|
-
}
|
|
6146
|
-
function NodeRects() {
|
|
6147
|
-
function measure(node) {
|
|
6148
|
-
const {
|
|
6149
|
-
offsetTop,
|
|
6150
|
-
offsetLeft,
|
|
6151
|
-
offsetWidth,
|
|
6152
|
-
offsetHeight
|
|
6153
|
-
} = node;
|
|
6154
|
-
const offset = {
|
|
6155
|
-
top: offsetTop,
|
|
6156
|
-
right: offsetLeft + offsetWidth,
|
|
6157
|
-
bottom: offsetTop + offsetHeight,
|
|
6158
|
-
left: offsetLeft,
|
|
6159
|
-
width: offsetWidth,
|
|
6160
|
-
height: offsetHeight
|
|
6161
|
-
};
|
|
6162
|
-
return offset;
|
|
6163
|
-
}
|
|
6164
|
-
const self = {
|
|
6165
|
-
measure
|
|
6166
|
-
};
|
|
6167
|
-
return self;
|
|
6168
|
-
}
|
|
6169
|
-
function PercentOfView(viewSize) {
|
|
6170
|
-
function measure(n) {
|
|
6171
|
-
return viewSize * (n / 100);
|
|
6172
|
-
}
|
|
6173
|
-
const self = {
|
|
6174
|
-
measure
|
|
6175
|
-
};
|
|
6176
|
-
return self;
|
|
6177
|
-
}
|
|
6178
|
-
function ResizeHandler(container, eventHandler, ownerWindow, slides, axis, watchResize, nodeRects) {
|
|
6179
|
-
const observeNodes = [container].concat(slides);
|
|
6180
|
-
let resizeObserver;
|
|
6181
|
-
let containerSize;
|
|
6182
|
-
let slideSizes = [];
|
|
6183
|
-
let destroyed = false;
|
|
6184
|
-
function readSize(node) {
|
|
6185
|
-
return axis.measureSize(nodeRects.measure(node));
|
|
6186
|
-
}
|
|
6187
|
-
function init(emblaApi) {
|
|
6188
|
-
if (!watchResize) return;
|
|
6189
|
-
containerSize = readSize(container);
|
|
6190
|
-
slideSizes = slides.map(readSize);
|
|
6191
|
-
function defaultCallback(entries) {
|
|
6192
|
-
for (const entry of entries) {
|
|
6193
|
-
if (destroyed) return;
|
|
6194
|
-
const isContainer = entry.target === container;
|
|
6195
|
-
const slideIndex = slides.indexOf(entry.target);
|
|
6196
|
-
const lastSize = isContainer ? containerSize : slideSizes[slideIndex];
|
|
6197
|
-
const newSize = readSize(isContainer ? container : slides[slideIndex]);
|
|
6198
|
-
const diffSize = mathAbs(newSize - lastSize);
|
|
6199
|
-
if (diffSize >= 0.5) {
|
|
6200
|
-
emblaApi.reInit();
|
|
6201
|
-
eventHandler.emit("resize");
|
|
6202
|
-
break;
|
|
6203
|
-
}
|
|
6204
|
-
}
|
|
6205
|
-
}
|
|
6206
|
-
resizeObserver = new ResizeObserver((entries) => {
|
|
6207
|
-
if (isBoolean(watchResize) || watchResize(emblaApi, entries)) {
|
|
6208
|
-
defaultCallback(entries);
|
|
6209
|
-
}
|
|
6210
|
-
});
|
|
6211
|
-
ownerWindow.requestAnimationFrame(() => {
|
|
6212
|
-
observeNodes.forEach((node) => resizeObserver.observe(node));
|
|
6213
|
-
});
|
|
6214
|
-
}
|
|
6215
|
-
function destroy() {
|
|
6216
|
-
destroyed = true;
|
|
6217
|
-
if (resizeObserver) resizeObserver.disconnect();
|
|
6218
|
-
}
|
|
6219
|
-
const self = {
|
|
6220
|
-
init,
|
|
6221
|
-
destroy
|
|
6222
|
-
};
|
|
6223
|
-
return self;
|
|
6224
|
-
}
|
|
6225
|
-
function ScrollBody(location, offsetLocation, previousLocation, target, baseDuration, baseFriction) {
|
|
6226
|
-
let scrollVelocity = 0;
|
|
6227
|
-
let scrollDirection = 0;
|
|
6228
|
-
let scrollDuration = baseDuration;
|
|
6229
|
-
let scrollFriction = baseFriction;
|
|
6230
|
-
let rawLocation = location.get();
|
|
6231
|
-
let rawLocationPrevious = 0;
|
|
6232
|
-
function seek() {
|
|
6233
|
-
const displacement = target.get() - location.get();
|
|
6234
|
-
const isInstant = !scrollDuration;
|
|
6235
|
-
let scrollDistance = 0;
|
|
6236
|
-
if (isInstant) {
|
|
6237
|
-
scrollVelocity = 0;
|
|
6238
|
-
previousLocation.set(target);
|
|
6239
|
-
location.set(target);
|
|
6240
|
-
scrollDistance = displacement;
|
|
6241
|
-
} else {
|
|
6242
|
-
previousLocation.set(location);
|
|
6243
|
-
scrollVelocity += displacement / scrollDuration;
|
|
6244
|
-
scrollVelocity *= scrollFriction;
|
|
6245
|
-
rawLocation += scrollVelocity;
|
|
6246
|
-
location.add(scrollVelocity);
|
|
6247
|
-
scrollDistance = rawLocation - rawLocationPrevious;
|
|
6248
|
-
}
|
|
6249
|
-
scrollDirection = mathSign(scrollDistance);
|
|
6250
|
-
rawLocationPrevious = rawLocation;
|
|
6251
|
-
return self;
|
|
6252
|
-
}
|
|
6253
|
-
function settled() {
|
|
6254
|
-
const diff = target.get() - offsetLocation.get();
|
|
6255
|
-
return mathAbs(diff) < 1e-3;
|
|
6256
|
-
}
|
|
6257
|
-
function duration() {
|
|
6258
|
-
return scrollDuration;
|
|
6259
|
-
}
|
|
6260
|
-
function direction() {
|
|
6261
|
-
return scrollDirection;
|
|
6262
|
-
}
|
|
6263
|
-
function velocity() {
|
|
6264
|
-
return scrollVelocity;
|
|
6265
|
-
}
|
|
6266
|
-
function useBaseDuration() {
|
|
6267
|
-
return useDuration(baseDuration);
|
|
6268
|
-
}
|
|
6269
|
-
function useBaseFriction() {
|
|
6270
|
-
return useFriction(baseFriction);
|
|
6271
|
-
}
|
|
6272
|
-
function useDuration(n) {
|
|
6273
|
-
scrollDuration = n;
|
|
6274
|
-
return self;
|
|
6275
|
-
}
|
|
6276
|
-
function useFriction(n) {
|
|
6277
|
-
scrollFriction = n;
|
|
6278
|
-
return self;
|
|
6279
|
-
}
|
|
6280
|
-
const self = {
|
|
6281
|
-
direction,
|
|
6282
|
-
duration,
|
|
6283
|
-
velocity,
|
|
6284
|
-
seek,
|
|
6285
|
-
settled,
|
|
6286
|
-
useBaseFriction,
|
|
6287
|
-
useBaseDuration,
|
|
6288
|
-
useFriction,
|
|
6289
|
-
useDuration
|
|
6290
|
-
};
|
|
6291
|
-
return self;
|
|
6292
|
-
}
|
|
6293
|
-
function ScrollBounds(limit, location, target, scrollBody, percentOfView) {
|
|
6294
|
-
const pullBackThreshold = percentOfView.measure(10);
|
|
6295
|
-
const edgeOffsetTolerance = percentOfView.measure(50);
|
|
6296
|
-
const frictionLimit = Limit(0.1, 0.99);
|
|
6297
|
-
let disabled2 = false;
|
|
6298
|
-
function shouldConstrain() {
|
|
6299
|
-
if (disabled2) return false;
|
|
6300
|
-
if (!limit.reachedAny(target.get())) return false;
|
|
6301
|
-
if (!limit.reachedAny(location.get())) return false;
|
|
6302
|
-
return true;
|
|
6303
|
-
}
|
|
6304
|
-
function constrain(pointerDown) {
|
|
6305
|
-
if (!shouldConstrain()) return;
|
|
6306
|
-
const edge = limit.reachedMin(location.get()) ? "min" : "max";
|
|
6307
|
-
const diffToEdge = mathAbs(limit[edge] - location.get());
|
|
6308
|
-
const diffToTarget = target.get() - location.get();
|
|
6309
|
-
const friction = frictionLimit.constrain(diffToEdge / edgeOffsetTolerance);
|
|
6310
|
-
target.subtract(diffToTarget * friction);
|
|
6311
|
-
if (!pointerDown && mathAbs(diffToTarget) < pullBackThreshold) {
|
|
6312
|
-
target.set(limit.constrain(target.get()));
|
|
6313
|
-
scrollBody.useDuration(25).useBaseFriction();
|
|
6314
|
-
}
|
|
6315
|
-
}
|
|
6316
|
-
function toggleActive(active) {
|
|
6317
|
-
disabled2 = !active;
|
|
6318
|
-
}
|
|
6319
|
-
const self = {
|
|
6320
|
-
shouldConstrain,
|
|
6321
|
-
constrain,
|
|
6322
|
-
toggleActive
|
|
6323
|
-
};
|
|
6324
|
-
return self;
|
|
6325
|
-
}
|
|
6326
|
-
function ScrollContain(viewSize, contentSize, snapsAligned, containScroll, pixelTolerance) {
|
|
6327
|
-
const scrollBounds = Limit(-contentSize + viewSize, 0);
|
|
6328
|
-
const snapsBounded = measureBounded();
|
|
6329
|
-
const scrollContainLimit = findScrollContainLimit();
|
|
6330
|
-
const snapsContained = measureContained();
|
|
6331
|
-
function usePixelTolerance(bound, snap) {
|
|
6332
|
-
return deltaAbs(bound, snap) <= 1;
|
|
6333
|
-
}
|
|
6334
|
-
function findScrollContainLimit() {
|
|
6335
|
-
const startSnap = snapsBounded[0];
|
|
6336
|
-
const endSnap = arrayLast(snapsBounded);
|
|
6337
|
-
const min = snapsBounded.lastIndexOf(startSnap);
|
|
6338
|
-
const max = snapsBounded.indexOf(endSnap) + 1;
|
|
6339
|
-
return Limit(min, max);
|
|
6340
|
-
}
|
|
6341
|
-
function measureBounded() {
|
|
6342
|
-
return snapsAligned.map((snapAligned, index) => {
|
|
6343
|
-
const {
|
|
6344
|
-
min,
|
|
6345
|
-
max
|
|
6346
|
-
} = scrollBounds;
|
|
6347
|
-
const snap = scrollBounds.constrain(snapAligned);
|
|
6348
|
-
const isFirst = !index;
|
|
6349
|
-
const isLast = arrayIsLastIndex(snapsAligned, index);
|
|
6350
|
-
if (isFirst) return max;
|
|
6351
|
-
if (isLast) return min;
|
|
6352
|
-
if (usePixelTolerance(min, snap)) return min;
|
|
6353
|
-
if (usePixelTolerance(max, snap)) return max;
|
|
6354
|
-
return snap;
|
|
6355
|
-
}).map((scrollBound) => parseFloat(scrollBound.toFixed(3)));
|
|
6356
|
-
}
|
|
6357
|
-
function measureContained() {
|
|
6358
|
-
if (contentSize <= viewSize + pixelTolerance) return [scrollBounds.max];
|
|
6359
|
-
if (containScroll === "keepSnaps") return snapsBounded;
|
|
6360
|
-
const {
|
|
6361
|
-
min,
|
|
6362
|
-
max
|
|
6363
|
-
} = scrollContainLimit;
|
|
6364
|
-
return snapsBounded.slice(min, max);
|
|
6365
|
-
}
|
|
6366
|
-
const self = {
|
|
6367
|
-
snapsContained,
|
|
6368
|
-
scrollContainLimit
|
|
6369
|
-
};
|
|
6370
|
-
return self;
|
|
6371
|
-
}
|
|
6372
|
-
function ScrollLimit(contentSize, scrollSnaps, loop) {
|
|
6373
|
-
const max = scrollSnaps[0];
|
|
6374
|
-
const min = loop ? max - contentSize : arrayLast(scrollSnaps);
|
|
6375
|
-
const limit = Limit(min, max);
|
|
6376
|
-
const self = {
|
|
6377
|
-
limit
|
|
6378
|
-
};
|
|
6379
|
-
return self;
|
|
6380
|
-
}
|
|
6381
|
-
function ScrollLooper(contentSize, limit, location, vectors) {
|
|
6382
|
-
const jointSafety = 0.1;
|
|
6383
|
-
const min = limit.min + jointSafety;
|
|
6384
|
-
const max = limit.max + jointSafety;
|
|
6385
|
-
const {
|
|
6386
|
-
reachedMin,
|
|
6387
|
-
reachedMax
|
|
6388
|
-
} = Limit(min, max);
|
|
6389
|
-
function shouldLoop(direction) {
|
|
6390
|
-
if (direction === 1) return reachedMax(location.get());
|
|
6391
|
-
if (direction === -1) return reachedMin(location.get());
|
|
6392
|
-
return false;
|
|
6393
|
-
}
|
|
6394
|
-
function loop(direction) {
|
|
6395
|
-
if (!shouldLoop(direction)) return;
|
|
6396
|
-
const loopDistance = contentSize * (direction * -1);
|
|
6397
|
-
vectors.forEach((v) => v.add(loopDistance));
|
|
6398
|
-
}
|
|
6399
|
-
const self = {
|
|
6400
|
-
loop
|
|
6401
|
-
};
|
|
6402
|
-
return self;
|
|
6403
|
-
}
|
|
6404
|
-
function ScrollProgress(limit) {
|
|
6405
|
-
const {
|
|
6406
|
-
max,
|
|
6407
|
-
length
|
|
6408
|
-
} = limit;
|
|
6409
|
-
function get(n) {
|
|
6410
|
-
const currentLocation = n - max;
|
|
6411
|
-
return length ? currentLocation / -length : 0;
|
|
6412
|
-
}
|
|
6413
|
-
const self = {
|
|
6414
|
-
get
|
|
6415
|
-
};
|
|
6416
|
-
return self;
|
|
6417
|
-
}
|
|
6418
|
-
function ScrollSnaps(axis, alignment, containerRect, slideRects, slidesToScroll) {
|
|
6419
|
-
const {
|
|
6420
|
-
startEdge,
|
|
6421
|
-
endEdge
|
|
6422
|
-
} = axis;
|
|
6423
|
-
const {
|
|
6424
|
-
groupSlides
|
|
6425
|
-
} = slidesToScroll;
|
|
6426
|
-
const alignments = measureSizes().map(alignment.measure);
|
|
6427
|
-
const snaps = measureUnaligned();
|
|
6428
|
-
const snapsAligned = measureAligned();
|
|
6429
|
-
function measureSizes() {
|
|
6430
|
-
return groupSlides(slideRects).map((rects) => arrayLast(rects)[endEdge] - rects[0][startEdge]).map(mathAbs);
|
|
6431
|
-
}
|
|
6432
|
-
function measureUnaligned() {
|
|
6433
|
-
return slideRects.map((rect) => containerRect[startEdge] - rect[startEdge]).map((snap) => -mathAbs(snap));
|
|
6434
|
-
}
|
|
6435
|
-
function measureAligned() {
|
|
6436
|
-
return groupSlides(snaps).map((g) => g[0]).map((snap, index) => snap + alignments[index]);
|
|
6437
|
-
}
|
|
6438
|
-
const self = {
|
|
6439
|
-
snaps,
|
|
6440
|
-
snapsAligned
|
|
6441
|
-
};
|
|
6442
|
-
return self;
|
|
6443
|
-
}
|
|
6444
|
-
function SlideRegistry(containSnaps, containScroll, scrollSnaps, scrollContainLimit, slidesToScroll, slideIndexes) {
|
|
6445
|
-
const {
|
|
6446
|
-
groupSlides
|
|
6447
|
-
} = slidesToScroll;
|
|
6448
|
-
const {
|
|
6449
|
-
min,
|
|
6450
|
-
max
|
|
6451
|
-
} = scrollContainLimit;
|
|
6452
|
-
const slideRegistry = createSlideRegistry();
|
|
6453
|
-
function createSlideRegistry() {
|
|
6454
|
-
const groupedSlideIndexes = groupSlides(slideIndexes);
|
|
6455
|
-
const doNotContain = !containSnaps || containScroll === "keepSnaps";
|
|
6456
|
-
if (scrollSnaps.length === 1) return [slideIndexes];
|
|
6457
|
-
if (doNotContain) return groupedSlideIndexes;
|
|
6458
|
-
return groupedSlideIndexes.slice(min, max).map((group, index, groups) => {
|
|
6459
|
-
const isFirst = !index;
|
|
6460
|
-
const isLast = arrayIsLastIndex(groups, index);
|
|
6461
|
-
if (isFirst) {
|
|
6462
|
-
const range = arrayLast(groups[0]) + 1;
|
|
6463
|
-
return arrayFromNumber(range);
|
|
6464
|
-
}
|
|
6465
|
-
if (isLast) {
|
|
6466
|
-
const range = arrayLastIndex(slideIndexes) - arrayLast(groups)[0] + 1;
|
|
6467
|
-
return arrayFromNumber(range, arrayLast(groups)[0]);
|
|
6468
|
-
}
|
|
6469
|
-
return group;
|
|
6470
|
-
});
|
|
6471
|
-
}
|
|
6472
|
-
const self = {
|
|
6473
|
-
slideRegistry
|
|
6474
|
-
};
|
|
6475
|
-
return self;
|
|
6476
|
-
}
|
|
6477
|
-
function ScrollTarget(loop, scrollSnaps, contentSize, limit, targetVector) {
|
|
6478
|
-
const {
|
|
6479
|
-
reachedAny,
|
|
6480
|
-
removeOffset,
|
|
6481
|
-
constrain
|
|
6482
|
-
} = limit;
|
|
6483
|
-
function minDistance(distances) {
|
|
6484
|
-
return distances.concat().sort((a, b) => mathAbs(a) - mathAbs(b))[0];
|
|
6485
|
-
}
|
|
6486
|
-
function findTargetSnap(target) {
|
|
6487
|
-
const distance = loop ? removeOffset(target) : constrain(target);
|
|
6488
|
-
const ascDiffsToSnaps = scrollSnaps.map((snap, index2) => ({
|
|
6489
|
-
diff: shortcut(snap - distance, 0),
|
|
6490
|
-
index: index2
|
|
6491
|
-
})).sort((d1, d2) => mathAbs(d1.diff) - mathAbs(d2.diff));
|
|
6492
|
-
const {
|
|
6493
|
-
index
|
|
6494
|
-
} = ascDiffsToSnaps[0];
|
|
6495
|
-
return {
|
|
6496
|
-
index,
|
|
6497
|
-
distance
|
|
6498
|
-
};
|
|
6499
|
-
}
|
|
6500
|
-
function shortcut(target, direction) {
|
|
6501
|
-
const targets = [target, target + contentSize, target - contentSize];
|
|
6502
|
-
if (!loop) return target;
|
|
6503
|
-
if (!direction) return minDistance(targets);
|
|
6504
|
-
const matchingTargets = targets.filter((t) => mathSign(t) === direction);
|
|
6505
|
-
if (matchingTargets.length) return minDistance(matchingTargets);
|
|
6506
|
-
return arrayLast(targets) - contentSize;
|
|
6507
|
-
}
|
|
6508
|
-
function byIndex(index, direction) {
|
|
6509
|
-
const diffToSnap = scrollSnaps[index] - targetVector.get();
|
|
6510
|
-
const distance = shortcut(diffToSnap, direction);
|
|
6511
|
-
return {
|
|
6512
|
-
index,
|
|
6513
|
-
distance
|
|
6514
|
-
};
|
|
6515
|
-
}
|
|
6516
|
-
function byDistance(distance, snap) {
|
|
6517
|
-
const target = targetVector.get() + distance;
|
|
6518
|
-
const {
|
|
6519
|
-
index,
|
|
6520
|
-
distance: targetSnapDistance
|
|
6521
|
-
} = findTargetSnap(target);
|
|
6522
|
-
const reachedBound = !loop && reachedAny(target);
|
|
6523
|
-
if (!snap || reachedBound) return {
|
|
6524
|
-
index,
|
|
6525
|
-
distance
|
|
6526
|
-
};
|
|
6527
|
-
const diffToSnap = scrollSnaps[index] - targetSnapDistance;
|
|
6528
|
-
const snapDistance = distance + shortcut(diffToSnap, 0);
|
|
6529
|
-
return {
|
|
6530
|
-
index,
|
|
6531
|
-
distance: snapDistance
|
|
6532
|
-
};
|
|
6533
|
-
}
|
|
6534
|
-
const self = {
|
|
6535
|
-
byDistance,
|
|
6536
|
-
byIndex,
|
|
6537
|
-
shortcut
|
|
6538
|
-
};
|
|
6539
|
-
return self;
|
|
6540
|
-
}
|
|
6541
|
-
function ScrollTo(animation, indexCurrent, indexPrevious, scrollBody, scrollTarget, targetVector, eventHandler) {
|
|
6542
|
-
function scrollTo(target) {
|
|
6543
|
-
const distanceDiff = target.distance;
|
|
6544
|
-
const indexDiff = target.index !== indexCurrent.get();
|
|
6545
|
-
targetVector.add(distanceDiff);
|
|
6546
|
-
if (distanceDiff) {
|
|
6547
|
-
if (scrollBody.duration()) {
|
|
6548
|
-
animation.start();
|
|
6549
|
-
} else {
|
|
6550
|
-
animation.update();
|
|
6551
|
-
animation.render(1);
|
|
6552
|
-
animation.update();
|
|
6553
|
-
}
|
|
6554
|
-
}
|
|
6555
|
-
if (indexDiff) {
|
|
6556
|
-
indexPrevious.set(indexCurrent.get());
|
|
6557
|
-
indexCurrent.set(target.index);
|
|
6558
|
-
eventHandler.emit("select");
|
|
6559
|
-
}
|
|
6560
|
-
}
|
|
6561
|
-
function distance(n, snap) {
|
|
6562
|
-
const target = scrollTarget.byDistance(n, snap);
|
|
6563
|
-
scrollTo(target);
|
|
6564
|
-
}
|
|
6565
|
-
function index(n, direction) {
|
|
6566
|
-
const targetIndex = indexCurrent.clone().set(n);
|
|
6567
|
-
const target = scrollTarget.byIndex(targetIndex.get(), direction);
|
|
6568
|
-
scrollTo(target);
|
|
6569
|
-
}
|
|
6570
|
-
const self = {
|
|
6571
|
-
distance,
|
|
6572
|
-
index
|
|
6573
|
-
};
|
|
6574
|
-
return self;
|
|
6575
|
-
}
|
|
6576
|
-
function SlideFocus(root, slides, slideRegistry, scrollTo, scrollBody, eventStore, eventHandler, watchFocus) {
|
|
6577
|
-
const focusListenerOptions = {
|
|
6578
|
-
passive: true,
|
|
6579
|
-
capture: true
|
|
6580
|
-
};
|
|
6581
|
-
let lastTabPressTime = 0;
|
|
6582
|
-
function init(emblaApi) {
|
|
6583
|
-
if (!watchFocus) return;
|
|
6584
|
-
function defaultCallback(index) {
|
|
6585
|
-
const nowTime = (/* @__PURE__ */ new Date()).getTime();
|
|
6586
|
-
const diffTime = nowTime - lastTabPressTime;
|
|
6587
|
-
if (diffTime > 10) return;
|
|
6588
|
-
eventHandler.emit("slideFocusStart");
|
|
6589
|
-
root.scrollLeft = 0;
|
|
6590
|
-
const group = slideRegistry.findIndex((group2) => group2.includes(index));
|
|
6591
|
-
if (!isNumber(group)) return;
|
|
6592
|
-
scrollBody.useDuration(0);
|
|
6593
|
-
scrollTo.index(group, 0);
|
|
6594
|
-
eventHandler.emit("slideFocus");
|
|
6595
|
-
}
|
|
6596
|
-
eventStore.add(document, "keydown", registerTabPress, false);
|
|
6597
|
-
slides.forEach((slide, slideIndex) => {
|
|
6598
|
-
eventStore.add(slide, "focus", (evt) => {
|
|
6599
|
-
if (isBoolean(watchFocus) || watchFocus(emblaApi, evt)) {
|
|
6600
|
-
defaultCallback(slideIndex);
|
|
6601
|
-
}
|
|
6602
|
-
}, focusListenerOptions);
|
|
6603
|
-
});
|
|
6604
|
-
}
|
|
6605
|
-
function registerTabPress(event) {
|
|
6606
|
-
if (event.code === "Tab") lastTabPressTime = (/* @__PURE__ */ new Date()).getTime();
|
|
6607
|
-
}
|
|
6608
|
-
const self = {
|
|
6609
|
-
init
|
|
6610
|
-
};
|
|
6611
|
-
return self;
|
|
6612
|
-
}
|
|
6613
|
-
function Vector1D(initialValue) {
|
|
6614
|
-
let value = initialValue;
|
|
6615
|
-
function get() {
|
|
6616
|
-
return value;
|
|
6617
|
-
}
|
|
6618
|
-
function set(n) {
|
|
6619
|
-
value = normalizeInput(n);
|
|
6620
|
-
}
|
|
6621
|
-
function add(n) {
|
|
6622
|
-
value += normalizeInput(n);
|
|
6623
|
-
}
|
|
6624
|
-
function subtract(n) {
|
|
6625
|
-
value -= normalizeInput(n);
|
|
6626
|
-
}
|
|
6627
|
-
function normalizeInput(n) {
|
|
6628
|
-
return isNumber(n) ? n : n.get();
|
|
6629
|
-
}
|
|
6630
|
-
const self = {
|
|
6631
|
-
get,
|
|
6632
|
-
set,
|
|
6633
|
-
add,
|
|
6634
|
-
subtract
|
|
6635
|
-
};
|
|
6636
|
-
return self;
|
|
6637
|
-
}
|
|
6638
|
-
function Translate(axis, container) {
|
|
6639
|
-
const translate = axis.scroll === "x" ? x : y;
|
|
6640
|
-
const containerStyle = container.style;
|
|
6641
|
-
let previousTarget = null;
|
|
6642
|
-
let disabled2 = false;
|
|
6643
|
-
function x(n) {
|
|
6644
|
-
return `translate3d(${n}px,0px,0px)`;
|
|
6645
|
-
}
|
|
6646
|
-
function y(n) {
|
|
6647
|
-
return `translate3d(0px,${n}px,0px)`;
|
|
6648
|
-
}
|
|
6649
|
-
function to(target) {
|
|
6650
|
-
if (disabled2) return;
|
|
6651
|
-
const newTarget = roundToTwoDecimals(axis.direction(target));
|
|
6652
|
-
if (newTarget === previousTarget) return;
|
|
6653
|
-
containerStyle.transform = translate(newTarget);
|
|
6654
|
-
previousTarget = newTarget;
|
|
6655
|
-
}
|
|
6656
|
-
function toggleActive(active) {
|
|
6657
|
-
disabled2 = !active;
|
|
6658
|
-
}
|
|
6659
|
-
function clear() {
|
|
6660
|
-
if (disabled2) return;
|
|
6661
|
-
containerStyle.transform = "";
|
|
6662
|
-
if (!container.getAttribute("style")) container.removeAttribute("style");
|
|
6663
|
-
}
|
|
6664
|
-
const self = {
|
|
6665
|
-
clear,
|
|
6666
|
-
to,
|
|
6667
|
-
toggleActive
|
|
6668
|
-
};
|
|
6669
|
-
return self;
|
|
6670
|
-
}
|
|
6671
|
-
function SlideLooper(axis, viewSize, contentSize, slideSizes, slideSizesWithGaps, snaps, scrollSnaps, location, slides) {
|
|
6672
|
-
const roundingSafety = 0.5;
|
|
6673
|
-
const ascItems = arrayKeys(slideSizesWithGaps);
|
|
6674
|
-
const descItems = arrayKeys(slideSizesWithGaps).reverse();
|
|
6675
|
-
const loopPoints = startPoints().concat(endPoints());
|
|
6676
|
-
function removeSlideSizes(indexes, from) {
|
|
6677
|
-
return indexes.reduce((a, i) => {
|
|
6678
|
-
return a - slideSizesWithGaps[i];
|
|
6679
|
-
}, from);
|
|
6680
|
-
}
|
|
6681
|
-
function slidesInGap(indexes, gap) {
|
|
6682
|
-
return indexes.reduce((a, i) => {
|
|
6683
|
-
const remainingGap = removeSlideSizes(a, gap);
|
|
6684
|
-
return remainingGap > 0 ? a.concat([i]) : a;
|
|
6685
|
-
}, []);
|
|
6686
|
-
}
|
|
6687
|
-
function findSlideBounds(offset) {
|
|
6688
|
-
return snaps.map((snap, index) => ({
|
|
6689
|
-
start: snap - slideSizes[index] + roundingSafety + offset,
|
|
6690
|
-
end: snap + viewSize - roundingSafety + offset
|
|
6691
|
-
}));
|
|
6692
|
-
}
|
|
6693
|
-
function findLoopPoints(indexes, offset, isEndEdge) {
|
|
6694
|
-
const slideBounds = findSlideBounds(offset);
|
|
6695
|
-
return indexes.map((index) => {
|
|
6696
|
-
const initial = isEndEdge ? 0 : -contentSize;
|
|
6697
|
-
const altered = isEndEdge ? contentSize : 0;
|
|
6698
|
-
const boundEdge = isEndEdge ? "end" : "start";
|
|
6699
|
-
const loopPoint = slideBounds[index][boundEdge];
|
|
6700
|
-
return {
|
|
6701
|
-
index,
|
|
6702
|
-
loopPoint,
|
|
6703
|
-
slideLocation: Vector1D(-1),
|
|
6704
|
-
translate: Translate(axis, slides[index]),
|
|
6705
|
-
target: () => location.get() > loopPoint ? initial : altered
|
|
6706
|
-
};
|
|
6707
|
-
});
|
|
6708
|
-
}
|
|
6709
|
-
function startPoints() {
|
|
6710
|
-
const gap = scrollSnaps[0];
|
|
6711
|
-
const indexes = slidesInGap(descItems, gap);
|
|
6712
|
-
return findLoopPoints(indexes, contentSize, false);
|
|
6713
|
-
}
|
|
6714
|
-
function endPoints() {
|
|
6715
|
-
const gap = viewSize - scrollSnaps[0] - 1;
|
|
6716
|
-
const indexes = slidesInGap(ascItems, gap);
|
|
6717
|
-
return findLoopPoints(indexes, -contentSize, true);
|
|
6718
|
-
}
|
|
6719
|
-
function canLoop() {
|
|
6720
|
-
return loopPoints.every(({
|
|
6721
|
-
index
|
|
6722
|
-
}) => {
|
|
6723
|
-
const otherIndexes = ascItems.filter((i) => i !== index);
|
|
6724
|
-
return removeSlideSizes(otherIndexes, viewSize) <= 0.1;
|
|
6725
|
-
});
|
|
6726
|
-
}
|
|
6727
|
-
function loop() {
|
|
6728
|
-
loopPoints.forEach((loopPoint) => {
|
|
6729
|
-
const {
|
|
6730
|
-
target,
|
|
6731
|
-
translate,
|
|
6732
|
-
slideLocation
|
|
6733
|
-
} = loopPoint;
|
|
6734
|
-
const shiftLocation = target();
|
|
6735
|
-
if (shiftLocation === slideLocation.get()) return;
|
|
6736
|
-
translate.to(shiftLocation);
|
|
6737
|
-
slideLocation.set(shiftLocation);
|
|
6738
|
-
});
|
|
6739
|
-
}
|
|
6740
|
-
function clear() {
|
|
6741
|
-
loopPoints.forEach((loopPoint) => loopPoint.translate.clear());
|
|
6742
|
-
}
|
|
6743
|
-
const self = {
|
|
6744
|
-
canLoop,
|
|
6745
|
-
clear,
|
|
6746
|
-
loop,
|
|
6747
|
-
loopPoints
|
|
6748
|
-
};
|
|
6749
|
-
return self;
|
|
6750
|
-
}
|
|
6751
|
-
function SlidesHandler(container, eventHandler, watchSlides) {
|
|
6752
|
-
let mutationObserver;
|
|
6753
|
-
let destroyed = false;
|
|
6754
|
-
function init(emblaApi) {
|
|
6755
|
-
if (!watchSlides) return;
|
|
6756
|
-
function defaultCallback(mutations) {
|
|
6757
|
-
for (const mutation of mutations) {
|
|
6758
|
-
if (mutation.type === "childList") {
|
|
6759
|
-
emblaApi.reInit();
|
|
6760
|
-
eventHandler.emit("slidesChanged");
|
|
6761
|
-
break;
|
|
6762
|
-
}
|
|
6763
|
-
}
|
|
6764
|
-
}
|
|
6765
|
-
mutationObserver = new MutationObserver((mutations) => {
|
|
6766
|
-
if (destroyed) return;
|
|
6767
|
-
if (isBoolean(watchSlides) || watchSlides(emblaApi, mutations)) {
|
|
6768
|
-
defaultCallback(mutations);
|
|
6769
|
-
}
|
|
6770
|
-
});
|
|
6771
|
-
mutationObserver.observe(container, {
|
|
6772
|
-
childList: true
|
|
6773
|
-
});
|
|
6774
|
-
}
|
|
6775
|
-
function destroy() {
|
|
6776
|
-
if (mutationObserver) mutationObserver.disconnect();
|
|
6777
|
-
destroyed = true;
|
|
6778
|
-
}
|
|
6779
|
-
const self = {
|
|
6780
|
-
init,
|
|
6781
|
-
destroy
|
|
6782
|
-
};
|
|
6783
|
-
return self;
|
|
6784
|
-
}
|
|
6785
|
-
function SlidesInView(container, slides, eventHandler, threshold) {
|
|
6786
|
-
const intersectionEntryMap = {};
|
|
6787
|
-
let inViewCache = null;
|
|
6788
|
-
let notInViewCache = null;
|
|
6789
|
-
let intersectionObserver;
|
|
6790
|
-
let destroyed = false;
|
|
6791
|
-
function init() {
|
|
6792
|
-
intersectionObserver = new IntersectionObserver((entries) => {
|
|
6793
|
-
if (destroyed) return;
|
|
6794
|
-
entries.forEach((entry) => {
|
|
6795
|
-
const index = slides.indexOf(entry.target);
|
|
6796
|
-
intersectionEntryMap[index] = entry;
|
|
6797
|
-
});
|
|
6798
|
-
inViewCache = null;
|
|
6799
|
-
notInViewCache = null;
|
|
6800
|
-
eventHandler.emit("slidesInView");
|
|
6801
|
-
}, {
|
|
6802
|
-
root: container.parentElement,
|
|
6803
|
-
threshold
|
|
6804
|
-
});
|
|
6805
|
-
slides.forEach((slide) => intersectionObserver.observe(slide));
|
|
6806
|
-
}
|
|
6807
|
-
function destroy() {
|
|
6808
|
-
if (intersectionObserver) intersectionObserver.disconnect();
|
|
6809
|
-
destroyed = true;
|
|
6810
|
-
}
|
|
6811
|
-
function createInViewList(inView) {
|
|
6812
|
-
return objectKeys(intersectionEntryMap).reduce((list, slideIndex) => {
|
|
6813
|
-
const index = parseInt(slideIndex);
|
|
6814
|
-
const {
|
|
6815
|
-
isIntersecting
|
|
6816
|
-
} = intersectionEntryMap[index];
|
|
6817
|
-
const inViewMatch = inView && isIntersecting;
|
|
6818
|
-
const notInViewMatch = !inView && !isIntersecting;
|
|
6819
|
-
if (inViewMatch || notInViewMatch) list.push(index);
|
|
6820
|
-
return list;
|
|
6821
|
-
}, []);
|
|
6822
|
-
}
|
|
6823
|
-
function get(inView = true) {
|
|
6824
|
-
if (inView && inViewCache) return inViewCache;
|
|
6825
|
-
if (!inView && notInViewCache) return notInViewCache;
|
|
6826
|
-
const slideIndexes = createInViewList(inView);
|
|
6827
|
-
if (inView) inViewCache = slideIndexes;
|
|
6828
|
-
if (!inView) notInViewCache = slideIndexes;
|
|
6829
|
-
return slideIndexes;
|
|
6830
|
-
}
|
|
6831
|
-
const self = {
|
|
6832
|
-
init,
|
|
6833
|
-
destroy,
|
|
6834
|
-
get
|
|
6835
|
-
};
|
|
6836
|
-
return self;
|
|
6837
|
-
}
|
|
6838
|
-
function SlideSizes(axis, containerRect, slideRects, slides, readEdgeGap, ownerWindow) {
|
|
6839
|
-
const {
|
|
6840
|
-
measureSize,
|
|
6841
|
-
startEdge,
|
|
6842
|
-
endEdge
|
|
6843
|
-
} = axis;
|
|
6844
|
-
const withEdgeGap = slideRects[0] && readEdgeGap;
|
|
6845
|
-
const startGap = measureStartGap();
|
|
6846
|
-
const endGap = measureEndGap();
|
|
6847
|
-
const slideSizes = slideRects.map(measureSize);
|
|
6848
|
-
const slideSizesWithGaps = measureWithGaps();
|
|
6849
|
-
function measureStartGap() {
|
|
6850
|
-
if (!withEdgeGap) return 0;
|
|
6851
|
-
const slideRect = slideRects[0];
|
|
6852
|
-
return mathAbs(containerRect[startEdge] - slideRect[startEdge]);
|
|
6853
|
-
}
|
|
6854
|
-
function measureEndGap() {
|
|
6855
|
-
if (!withEdgeGap) return 0;
|
|
6856
|
-
const style = ownerWindow.getComputedStyle(arrayLast(slides));
|
|
6857
|
-
return parseFloat(style.getPropertyValue(`margin-${endEdge}`));
|
|
6858
|
-
}
|
|
6859
|
-
function measureWithGaps() {
|
|
6860
|
-
return slideRects.map((rect, index, rects) => {
|
|
6861
|
-
const isFirst = !index;
|
|
6862
|
-
const isLast = arrayIsLastIndex(rects, index);
|
|
6863
|
-
if (isFirst) return slideSizes[index] + startGap;
|
|
6864
|
-
if (isLast) return slideSizes[index] + endGap;
|
|
6865
|
-
return rects[index + 1][startEdge] - rect[startEdge];
|
|
6866
|
-
}).map(mathAbs);
|
|
6867
|
-
}
|
|
6868
|
-
const self = {
|
|
6869
|
-
slideSizes,
|
|
6870
|
-
slideSizesWithGaps,
|
|
6871
|
-
startGap,
|
|
6872
|
-
endGap
|
|
6873
|
-
};
|
|
6874
|
-
return self;
|
|
6875
|
-
}
|
|
6876
|
-
function SlidesToScroll(axis, viewSize, slidesToScroll, loop, containerRect, slideRects, startGap, endGap, pixelTolerance) {
|
|
6877
|
-
const {
|
|
6878
|
-
startEdge,
|
|
6879
|
-
endEdge,
|
|
6880
|
-
direction
|
|
6881
|
-
} = axis;
|
|
6882
|
-
const groupByNumber = isNumber(slidesToScroll);
|
|
6883
|
-
function byNumber(array, groupSize) {
|
|
6884
|
-
return arrayKeys(array).filter((i) => i % groupSize === 0).map((i) => array.slice(i, i + groupSize));
|
|
6885
|
-
}
|
|
6886
|
-
function bySize(array) {
|
|
6887
|
-
if (!array.length) return [];
|
|
6888
|
-
return arrayKeys(array).reduce((groups, rectB, index) => {
|
|
6889
|
-
const rectA = arrayLast(groups) || 0;
|
|
6890
|
-
const isFirst = rectA === 0;
|
|
6891
|
-
const isLast = rectB === arrayLastIndex(array);
|
|
6892
|
-
const edgeA = containerRect[startEdge] - slideRects[rectA][startEdge];
|
|
6893
|
-
const edgeB = containerRect[startEdge] - slideRects[rectB][endEdge];
|
|
6894
|
-
const gapA = !loop && isFirst ? direction(startGap) : 0;
|
|
6895
|
-
const gapB = !loop && isLast ? direction(endGap) : 0;
|
|
6896
|
-
const chunkSize = mathAbs(edgeB - gapB - (edgeA + gapA));
|
|
6897
|
-
if (index && chunkSize > viewSize + pixelTolerance) groups.push(rectB);
|
|
6898
|
-
if (isLast) groups.push(array.length);
|
|
6899
|
-
return groups;
|
|
6900
|
-
}, []).map((currentSize, index, groups) => {
|
|
6901
|
-
const previousSize = Math.max(groups[index - 1] || 0);
|
|
6902
|
-
return array.slice(previousSize, currentSize);
|
|
6903
|
-
});
|
|
6904
|
-
}
|
|
6905
|
-
function groupSlides(array) {
|
|
6906
|
-
return groupByNumber ? byNumber(array, slidesToScroll) : bySize(array);
|
|
6907
|
-
}
|
|
6908
|
-
const self = {
|
|
6909
|
-
groupSlides
|
|
6910
|
-
};
|
|
6911
|
-
return self;
|
|
6912
|
-
}
|
|
6913
|
-
function Engine(root, container, slides, ownerDocument, ownerWindow, options, eventHandler) {
|
|
6914
|
-
const {
|
|
6915
|
-
align,
|
|
6916
|
-
axis: scrollAxis,
|
|
6917
|
-
direction,
|
|
6918
|
-
startIndex,
|
|
6919
|
-
loop,
|
|
6920
|
-
duration,
|
|
6921
|
-
dragFree,
|
|
6922
|
-
dragThreshold,
|
|
6923
|
-
inViewThreshold,
|
|
6924
|
-
slidesToScroll: groupSlides,
|
|
6925
|
-
skipSnaps,
|
|
6926
|
-
containScroll,
|
|
6927
|
-
watchResize,
|
|
6928
|
-
watchSlides,
|
|
6929
|
-
watchDrag,
|
|
6930
|
-
watchFocus
|
|
6931
|
-
} = options;
|
|
6932
|
-
const pixelTolerance = 2;
|
|
6933
|
-
const nodeRects = NodeRects();
|
|
6934
|
-
const containerRect = nodeRects.measure(container);
|
|
6935
|
-
const slideRects = slides.map(nodeRects.measure);
|
|
6936
|
-
const axis = Axis(scrollAxis, direction);
|
|
6937
|
-
const viewSize = axis.measureSize(containerRect);
|
|
6938
|
-
const percentOfView = PercentOfView(viewSize);
|
|
6939
|
-
const alignment = Alignment(align, viewSize);
|
|
6940
|
-
const containSnaps = !loop && !!containScroll;
|
|
6941
|
-
const readEdgeGap = loop || !!containScroll;
|
|
6942
|
-
const {
|
|
6943
|
-
slideSizes,
|
|
6944
|
-
slideSizesWithGaps,
|
|
6945
|
-
startGap,
|
|
6946
|
-
endGap
|
|
6947
|
-
} = SlideSizes(axis, containerRect, slideRects, slides, readEdgeGap, ownerWindow);
|
|
6948
|
-
const slidesToScroll = SlidesToScroll(axis, viewSize, groupSlides, loop, containerRect, slideRects, startGap, endGap, pixelTolerance);
|
|
6949
|
-
const {
|
|
6950
|
-
snaps,
|
|
6951
|
-
snapsAligned
|
|
6952
|
-
} = ScrollSnaps(axis, alignment, containerRect, slideRects, slidesToScroll);
|
|
6953
|
-
const contentSize = -arrayLast(snaps) + arrayLast(slideSizesWithGaps);
|
|
6954
|
-
const {
|
|
6955
|
-
snapsContained,
|
|
6956
|
-
scrollContainLimit
|
|
6957
|
-
} = ScrollContain(viewSize, contentSize, snapsAligned, containScroll, pixelTolerance);
|
|
6958
|
-
const scrollSnaps = containSnaps ? snapsContained : snapsAligned;
|
|
6959
|
-
const {
|
|
6960
|
-
limit
|
|
6961
|
-
} = ScrollLimit(contentSize, scrollSnaps, loop);
|
|
6962
|
-
const index = Counter(arrayLastIndex(scrollSnaps), startIndex, loop);
|
|
6963
|
-
const indexPrevious = index.clone();
|
|
6964
|
-
const slideIndexes = arrayKeys(slides);
|
|
6965
|
-
const update = ({
|
|
6966
|
-
dragHandler,
|
|
6967
|
-
scrollBody: scrollBody2,
|
|
6968
|
-
scrollBounds,
|
|
6969
|
-
options: {
|
|
6970
|
-
loop: loop2
|
|
6971
|
-
}
|
|
6972
|
-
}) => {
|
|
6973
|
-
if (!loop2) scrollBounds.constrain(dragHandler.pointerDown());
|
|
6974
|
-
scrollBody2.seek();
|
|
6975
|
-
};
|
|
6976
|
-
const render = ({
|
|
6977
|
-
scrollBody: scrollBody2,
|
|
6978
|
-
translate,
|
|
6979
|
-
location: location2,
|
|
6980
|
-
offsetLocation: offsetLocation2,
|
|
6981
|
-
previousLocation: previousLocation2,
|
|
6982
|
-
scrollLooper,
|
|
6983
|
-
slideLooper,
|
|
6984
|
-
dragHandler,
|
|
6985
|
-
animation: animation2,
|
|
6986
|
-
eventHandler: eventHandler2,
|
|
6987
|
-
scrollBounds,
|
|
6988
|
-
options: {
|
|
6989
|
-
loop: loop2
|
|
6990
|
-
}
|
|
6991
|
-
}, alpha) => {
|
|
6992
|
-
const shouldSettle = scrollBody2.settled();
|
|
6993
|
-
const withinBounds = !scrollBounds.shouldConstrain();
|
|
6994
|
-
const hasSettled = loop2 ? shouldSettle : shouldSettle && withinBounds;
|
|
6995
|
-
const hasSettledAndIdle = hasSettled && !dragHandler.pointerDown();
|
|
6996
|
-
if (hasSettledAndIdle) animation2.stop();
|
|
6997
|
-
const interpolatedLocation = location2.get() * alpha + previousLocation2.get() * (1 - alpha);
|
|
6998
|
-
offsetLocation2.set(interpolatedLocation);
|
|
6999
|
-
if (loop2) {
|
|
7000
|
-
scrollLooper.loop(scrollBody2.direction());
|
|
7001
|
-
slideLooper.loop();
|
|
7002
|
-
}
|
|
7003
|
-
translate.to(offsetLocation2.get());
|
|
7004
|
-
if (hasSettledAndIdle) eventHandler2.emit("settle");
|
|
7005
|
-
if (!hasSettled) eventHandler2.emit("scroll");
|
|
7006
|
-
};
|
|
7007
|
-
const animation = Animations(ownerDocument, ownerWindow, () => update(engine), (alpha) => render(engine, alpha));
|
|
7008
|
-
const friction = 0.68;
|
|
7009
|
-
const startLocation = scrollSnaps[index.get()];
|
|
7010
|
-
const location = Vector1D(startLocation);
|
|
7011
|
-
const previousLocation = Vector1D(startLocation);
|
|
7012
|
-
const offsetLocation = Vector1D(startLocation);
|
|
7013
|
-
const target = Vector1D(startLocation);
|
|
7014
|
-
const scrollBody = ScrollBody(location, offsetLocation, previousLocation, target, duration, friction);
|
|
7015
|
-
const scrollTarget = ScrollTarget(loop, scrollSnaps, contentSize, limit, target);
|
|
7016
|
-
const scrollTo = ScrollTo(animation, index, indexPrevious, scrollBody, scrollTarget, target, eventHandler);
|
|
7017
|
-
const scrollProgress = ScrollProgress(limit);
|
|
7018
|
-
const eventStore = EventStore();
|
|
7019
|
-
const slidesInView = SlidesInView(container, slides, eventHandler, inViewThreshold);
|
|
7020
|
-
const {
|
|
7021
|
-
slideRegistry
|
|
7022
|
-
} = SlideRegistry(containSnaps, containScroll, scrollSnaps, scrollContainLimit, slidesToScroll, slideIndexes);
|
|
7023
|
-
const slideFocus = SlideFocus(root, slides, slideRegistry, scrollTo, scrollBody, eventStore, eventHandler, watchFocus);
|
|
7024
|
-
const engine = {
|
|
7025
|
-
ownerDocument,
|
|
7026
|
-
ownerWindow,
|
|
7027
|
-
eventHandler,
|
|
7028
|
-
containerRect,
|
|
7029
|
-
slideRects,
|
|
7030
|
-
animation,
|
|
7031
|
-
axis,
|
|
7032
|
-
dragHandler: DragHandler(axis, root, ownerDocument, ownerWindow, target, DragTracker(axis, ownerWindow), location, animation, scrollTo, scrollBody, scrollTarget, index, eventHandler, percentOfView, dragFree, dragThreshold, skipSnaps, friction, watchDrag),
|
|
7033
|
-
eventStore,
|
|
7034
|
-
percentOfView,
|
|
7035
|
-
index,
|
|
7036
|
-
indexPrevious,
|
|
7037
|
-
limit,
|
|
7038
|
-
location,
|
|
7039
|
-
offsetLocation,
|
|
7040
|
-
previousLocation,
|
|
7041
|
-
options,
|
|
7042
|
-
resizeHandler: ResizeHandler(container, eventHandler, ownerWindow, slides, axis, watchResize, nodeRects),
|
|
7043
|
-
scrollBody,
|
|
7044
|
-
scrollBounds: ScrollBounds(limit, offsetLocation, target, scrollBody, percentOfView),
|
|
7045
|
-
scrollLooper: ScrollLooper(contentSize, limit, offsetLocation, [location, offsetLocation, previousLocation, target]),
|
|
7046
|
-
scrollProgress,
|
|
7047
|
-
scrollSnapList: scrollSnaps.map(scrollProgress.get),
|
|
7048
|
-
scrollSnaps,
|
|
7049
|
-
scrollTarget,
|
|
7050
|
-
scrollTo,
|
|
7051
|
-
slideLooper: SlideLooper(axis, viewSize, contentSize, slideSizes, slideSizesWithGaps, snaps, scrollSnaps, offsetLocation, slides),
|
|
7052
|
-
slideFocus,
|
|
7053
|
-
slidesHandler: SlidesHandler(container, eventHandler, watchSlides),
|
|
7054
|
-
slidesInView,
|
|
7055
|
-
slideIndexes,
|
|
7056
|
-
slideRegistry,
|
|
7057
|
-
slidesToScroll,
|
|
7058
|
-
target,
|
|
7059
|
-
translate: Translate(axis, container)
|
|
7060
|
-
};
|
|
7061
|
-
return engine;
|
|
7062
|
-
}
|
|
7063
|
-
function EventHandler() {
|
|
7064
|
-
let listeners = {};
|
|
7065
|
-
let api;
|
|
7066
|
-
function init(emblaApi) {
|
|
7067
|
-
api = emblaApi;
|
|
7068
|
-
}
|
|
7069
|
-
function getListeners(evt) {
|
|
7070
|
-
return listeners[evt] || [];
|
|
7071
|
-
}
|
|
7072
|
-
function emit(evt) {
|
|
7073
|
-
getListeners(evt).forEach((e2) => e2(api, evt));
|
|
7074
|
-
return self;
|
|
7075
|
-
}
|
|
7076
|
-
function on(evt, cb) {
|
|
7077
|
-
listeners[evt] = getListeners(evt).concat([cb]);
|
|
7078
|
-
return self;
|
|
7079
|
-
}
|
|
7080
|
-
function off(evt, cb) {
|
|
7081
|
-
listeners[evt] = getListeners(evt).filter((e2) => e2 !== cb);
|
|
7082
|
-
return self;
|
|
7083
|
-
}
|
|
7084
|
-
function clear() {
|
|
7085
|
-
listeners = {};
|
|
7086
|
-
}
|
|
7087
|
-
const self = {
|
|
7088
|
-
init,
|
|
7089
|
-
emit,
|
|
7090
|
-
off,
|
|
7091
|
-
on,
|
|
7092
|
-
clear
|
|
7093
|
-
};
|
|
7094
|
-
return self;
|
|
7095
|
-
}
|
|
7096
|
-
const defaultOptions = {
|
|
7097
|
-
align: "center",
|
|
7098
|
-
axis: "x",
|
|
7099
|
-
container: null,
|
|
7100
|
-
slides: null,
|
|
7101
|
-
containScroll: "trimSnaps",
|
|
7102
|
-
direction: "ltr",
|
|
7103
|
-
slidesToScroll: 1,
|
|
7104
|
-
inViewThreshold: 0,
|
|
7105
|
-
breakpoints: {},
|
|
7106
|
-
dragFree: false,
|
|
7107
|
-
dragThreshold: 10,
|
|
7108
|
-
loop: false,
|
|
7109
|
-
skipSnaps: false,
|
|
7110
|
-
duration: 25,
|
|
7111
|
-
startIndex: 0,
|
|
7112
|
-
active: true,
|
|
7113
|
-
watchDrag: true,
|
|
7114
|
-
watchResize: true,
|
|
7115
|
-
watchSlides: true,
|
|
7116
|
-
watchFocus: true
|
|
7117
|
-
};
|
|
7118
|
-
function OptionsHandler(ownerWindow) {
|
|
7119
|
-
function mergeOptions(optionsA, optionsB) {
|
|
7120
|
-
return objectsMergeDeep(optionsA, optionsB || {});
|
|
7121
|
-
}
|
|
7122
|
-
function optionsAtMedia(options) {
|
|
7123
|
-
const optionsAtMedia2 = options.breakpoints || {};
|
|
7124
|
-
const matchedMediaOptions = objectKeys(optionsAtMedia2).filter((media) => ownerWindow.matchMedia(media).matches).map((media) => optionsAtMedia2[media]).reduce((a, mediaOption) => mergeOptions(a, mediaOption), {});
|
|
7125
|
-
return mergeOptions(options, matchedMediaOptions);
|
|
7126
|
-
}
|
|
7127
|
-
function optionsMediaQueries(optionsList) {
|
|
7128
|
-
return optionsList.map((options) => objectKeys(options.breakpoints || {})).reduce((acc, mediaQueries) => acc.concat(mediaQueries), []).map(ownerWindow.matchMedia);
|
|
7129
|
-
}
|
|
7130
|
-
const self = {
|
|
7131
|
-
mergeOptions,
|
|
7132
|
-
optionsAtMedia,
|
|
7133
|
-
optionsMediaQueries
|
|
7134
|
-
};
|
|
7135
|
-
return self;
|
|
7136
|
-
}
|
|
7137
|
-
function PluginsHandler(optionsHandler) {
|
|
7138
|
-
let activePlugins = [];
|
|
7139
|
-
function init(emblaApi, plugins) {
|
|
7140
|
-
activePlugins = plugins.filter(({
|
|
7141
|
-
options
|
|
7142
|
-
}) => optionsHandler.optionsAtMedia(options).active !== false);
|
|
7143
|
-
activePlugins.forEach((plugin) => plugin.init(emblaApi, optionsHandler));
|
|
7144
|
-
return plugins.reduce((map, plugin) => Object.assign(map, {
|
|
7145
|
-
[plugin.name]: plugin
|
|
7146
|
-
}), {});
|
|
7147
|
-
}
|
|
7148
|
-
function destroy() {
|
|
7149
|
-
activePlugins = activePlugins.filter((plugin) => plugin.destroy());
|
|
7150
|
-
}
|
|
7151
|
-
const self = {
|
|
7152
|
-
init,
|
|
7153
|
-
destroy
|
|
7154
|
-
};
|
|
7155
|
-
return self;
|
|
7156
|
-
}
|
|
7157
|
-
function EmblaCarousel(root, userOptions, userPlugins) {
|
|
7158
|
-
const ownerDocument = root.ownerDocument;
|
|
7159
|
-
const ownerWindow = ownerDocument.defaultView;
|
|
7160
|
-
const optionsHandler = OptionsHandler(ownerWindow);
|
|
7161
|
-
const pluginsHandler = PluginsHandler(optionsHandler);
|
|
7162
|
-
const mediaHandlers = EventStore();
|
|
7163
|
-
const eventHandler = EventHandler();
|
|
7164
|
-
const {
|
|
7165
|
-
mergeOptions,
|
|
7166
|
-
optionsAtMedia,
|
|
7167
|
-
optionsMediaQueries
|
|
7168
|
-
} = optionsHandler;
|
|
7169
|
-
const {
|
|
7170
|
-
on,
|
|
7171
|
-
off,
|
|
7172
|
-
emit
|
|
7173
|
-
} = eventHandler;
|
|
7174
|
-
const reInit = reActivate;
|
|
7175
|
-
let destroyed = false;
|
|
7176
|
-
let engine;
|
|
7177
|
-
let optionsBase = mergeOptions(defaultOptions, EmblaCarousel.globalOptions);
|
|
7178
|
-
let options = mergeOptions(optionsBase);
|
|
7179
|
-
let pluginList = [];
|
|
7180
|
-
let pluginApis;
|
|
7181
|
-
let container;
|
|
7182
|
-
let slides;
|
|
7183
|
-
function storeElements() {
|
|
7184
|
-
const {
|
|
7185
|
-
container: userContainer,
|
|
7186
|
-
slides: userSlides
|
|
7187
|
-
} = options;
|
|
7188
|
-
const customContainer = isString(userContainer) ? root.querySelector(userContainer) : userContainer;
|
|
7189
|
-
container = customContainer || root.children[0];
|
|
7190
|
-
const customSlides = isString(userSlides) ? container.querySelectorAll(userSlides) : userSlides;
|
|
7191
|
-
slides = [].slice.call(customSlides || container.children);
|
|
7192
|
-
}
|
|
7193
|
-
function createEngine(options2) {
|
|
7194
|
-
const engine2 = Engine(root, container, slides, ownerDocument, ownerWindow, options2, eventHandler);
|
|
7195
|
-
if (options2.loop && !engine2.slideLooper.canLoop()) {
|
|
7196
|
-
const optionsWithoutLoop = Object.assign({}, options2, {
|
|
7197
|
-
loop: false
|
|
7198
|
-
});
|
|
7199
|
-
return createEngine(optionsWithoutLoop);
|
|
7200
|
-
}
|
|
7201
|
-
return engine2;
|
|
7202
|
-
}
|
|
7203
|
-
function activate(withOptions, withPlugins) {
|
|
7204
|
-
if (destroyed) return;
|
|
7205
|
-
optionsBase = mergeOptions(optionsBase, withOptions);
|
|
7206
|
-
options = optionsAtMedia(optionsBase);
|
|
7207
|
-
pluginList = withPlugins || pluginList;
|
|
7208
|
-
storeElements();
|
|
7209
|
-
engine = createEngine(options);
|
|
7210
|
-
optionsMediaQueries([optionsBase, ...pluginList.map(({
|
|
7211
|
-
options: options2
|
|
7212
|
-
}) => options2)]).forEach((query) => mediaHandlers.add(query, "change", reActivate));
|
|
7213
|
-
if (!options.active) return;
|
|
7214
|
-
engine.translate.to(engine.location.get());
|
|
7215
|
-
engine.animation.init();
|
|
7216
|
-
engine.slidesInView.init();
|
|
7217
|
-
engine.slideFocus.init(self);
|
|
7218
|
-
engine.eventHandler.init(self);
|
|
7219
|
-
engine.resizeHandler.init(self);
|
|
7220
|
-
engine.slidesHandler.init(self);
|
|
7221
|
-
if (engine.options.loop) engine.slideLooper.loop();
|
|
7222
|
-
if (container.offsetParent && slides.length) engine.dragHandler.init(self);
|
|
7223
|
-
pluginApis = pluginsHandler.init(self, pluginList);
|
|
7224
|
-
}
|
|
7225
|
-
function reActivate(withOptions, withPlugins) {
|
|
7226
|
-
const startIndex = selectedScrollSnap();
|
|
7227
|
-
deActivate();
|
|
7228
|
-
activate(mergeOptions({
|
|
7229
|
-
startIndex
|
|
7230
|
-
}, withOptions), withPlugins);
|
|
7231
|
-
eventHandler.emit("reInit");
|
|
7232
|
-
}
|
|
7233
|
-
function deActivate() {
|
|
7234
|
-
engine.dragHandler.destroy();
|
|
7235
|
-
engine.eventStore.clear();
|
|
7236
|
-
engine.translate.clear();
|
|
7237
|
-
engine.slideLooper.clear();
|
|
7238
|
-
engine.resizeHandler.destroy();
|
|
7239
|
-
engine.slidesHandler.destroy();
|
|
7240
|
-
engine.slidesInView.destroy();
|
|
7241
|
-
engine.animation.destroy();
|
|
7242
|
-
pluginsHandler.destroy();
|
|
7243
|
-
mediaHandlers.clear();
|
|
7244
|
-
}
|
|
7245
|
-
function destroy() {
|
|
7246
|
-
if (destroyed) return;
|
|
7247
|
-
destroyed = true;
|
|
7248
|
-
mediaHandlers.clear();
|
|
7249
|
-
deActivate();
|
|
7250
|
-
eventHandler.emit("destroy");
|
|
7251
|
-
eventHandler.clear();
|
|
7252
|
-
}
|
|
7253
|
-
function scrollTo(index, jump, direction) {
|
|
7254
|
-
if (!options.active || destroyed) return;
|
|
7255
|
-
engine.scrollBody.useBaseFriction().useDuration(jump === true ? 0 : options.duration);
|
|
7256
|
-
engine.scrollTo.index(index, direction || 0);
|
|
7257
|
-
}
|
|
7258
|
-
function scrollNext(jump) {
|
|
7259
|
-
const next = engine.index.add(1).get();
|
|
7260
|
-
scrollTo(next, jump, -1);
|
|
7261
|
-
}
|
|
7262
|
-
function scrollPrev(jump) {
|
|
7263
|
-
const prev = engine.index.add(-1).get();
|
|
7264
|
-
scrollTo(prev, jump, 1);
|
|
7265
|
-
}
|
|
7266
|
-
function canScrollNext() {
|
|
7267
|
-
const next = engine.index.add(1).get();
|
|
7268
|
-
return next !== selectedScrollSnap();
|
|
7269
|
-
}
|
|
7270
|
-
function canScrollPrev() {
|
|
7271
|
-
const prev = engine.index.add(-1).get();
|
|
7272
|
-
return prev !== selectedScrollSnap();
|
|
7273
|
-
}
|
|
7274
|
-
function scrollSnapList() {
|
|
7275
|
-
return engine.scrollSnapList;
|
|
7276
|
-
}
|
|
7277
|
-
function scrollProgress() {
|
|
7278
|
-
return engine.scrollProgress.get(engine.offsetLocation.get());
|
|
7279
|
-
}
|
|
7280
|
-
function selectedScrollSnap() {
|
|
7281
|
-
return engine.index.get();
|
|
7282
|
-
}
|
|
7283
|
-
function previousScrollSnap() {
|
|
7284
|
-
return engine.indexPrevious.get();
|
|
7285
|
-
}
|
|
7286
|
-
function slidesInView() {
|
|
7287
|
-
return engine.slidesInView.get();
|
|
7288
|
-
}
|
|
7289
|
-
function slidesNotInView() {
|
|
7290
|
-
return engine.slidesInView.get(false);
|
|
7291
|
-
}
|
|
7292
|
-
function plugins() {
|
|
7293
|
-
return pluginApis;
|
|
7294
|
-
}
|
|
7295
|
-
function internalEngine() {
|
|
7296
|
-
return engine;
|
|
7297
|
-
}
|
|
7298
|
-
function rootNode() {
|
|
7299
|
-
return root;
|
|
7300
|
-
}
|
|
7301
|
-
function containerNode() {
|
|
7302
|
-
return container;
|
|
7303
|
-
}
|
|
7304
|
-
function slideNodes() {
|
|
7305
|
-
return slides;
|
|
7306
|
-
}
|
|
7307
|
-
const self = {
|
|
7308
|
-
canScrollNext,
|
|
7309
|
-
canScrollPrev,
|
|
7310
|
-
containerNode,
|
|
7311
|
-
internalEngine,
|
|
7312
|
-
destroy,
|
|
7313
|
-
off,
|
|
7314
|
-
on,
|
|
7315
|
-
emit,
|
|
7316
|
-
plugins,
|
|
7317
|
-
previousScrollSnap,
|
|
7318
|
-
reInit,
|
|
7319
|
-
rootNode,
|
|
7320
|
-
scrollNext,
|
|
7321
|
-
scrollPrev,
|
|
7322
|
-
scrollProgress,
|
|
7323
|
-
scrollSnapList,
|
|
7324
|
-
scrollTo,
|
|
7325
|
-
selectedScrollSnap,
|
|
7326
|
-
slideNodes,
|
|
7327
|
-
slidesInView,
|
|
7328
|
-
slidesNotInView
|
|
7329
|
-
};
|
|
7330
|
-
activate(userOptions, userPlugins);
|
|
7331
|
-
setTimeout(() => eventHandler.emit("init"), 0);
|
|
7332
|
-
return self;
|
|
7333
|
-
}
|
|
7334
|
-
EmblaCarousel.globalOptions = void 0;
|
|
7335
|
-
function useEmblaCarousel(options = {}, plugins = []) {
|
|
7336
|
-
const storedOptions = useRef(options);
|
|
7337
|
-
const storedPlugins = useRef(plugins);
|
|
7338
|
-
const [emblaApi, setEmblaApi] = useState();
|
|
7339
|
-
const [viewport, setViewport] = useState();
|
|
7340
|
-
const reInit = useCallback(() => {
|
|
7341
|
-
if (emblaApi) emblaApi.reInit(storedOptions.current, storedPlugins.current);
|
|
7342
|
-
}, [emblaApi]);
|
|
7343
|
-
useEffect(() => {
|
|
7344
|
-
if (areOptionsEqual(storedOptions.current, options)) return;
|
|
7345
|
-
storedOptions.current = options;
|
|
7346
|
-
reInit();
|
|
7347
|
-
}, [options, reInit]);
|
|
7348
|
-
useEffect(() => {
|
|
7349
|
-
if (arePluginsEqual(storedPlugins.current, plugins)) return;
|
|
7350
|
-
storedPlugins.current = plugins;
|
|
7351
|
-
reInit();
|
|
7352
|
-
}, [plugins, reInit]);
|
|
7353
|
-
useEffect(() => {
|
|
7354
|
-
if (canUseDOM() && viewport) {
|
|
7355
|
-
EmblaCarousel.globalOptions = useEmblaCarousel.globalOptions;
|
|
7356
|
-
const newEmblaApi = EmblaCarousel(viewport, storedOptions.current, storedPlugins.current);
|
|
7357
|
-
setEmblaApi(newEmblaApi);
|
|
7358
|
-
return () => newEmblaApi.destroy();
|
|
7359
|
-
} else {
|
|
7360
|
-
setEmblaApi(void 0);
|
|
7361
|
-
}
|
|
7362
|
-
}, [viewport, setEmblaApi]);
|
|
7363
|
-
return [setViewport, emblaApi];
|
|
7364
|
-
}
|
|
7365
|
-
useEmblaCarousel.globalOptions = void 0;
|
|
7366
|
-
const [CarouselProvider, useCarouselContext] = createSafeContext(
|
|
7367
|
-
"Carousel component was not found in tree"
|
|
7368
|
-
);
|
|
7369
|
-
var classes = { "root": "m_17884d0f", "viewport": "m_a2dae653", "container": "m_fcd81474", "controls": "m_39bc3463", "control": "m_64f58e10", "indicators": "m_71ea3ab1", "indicator": "m_eae68602", "slide": "m_d98df724" };
|
|
7370
|
-
const CarouselSlide = factory((props, ref) => {
|
|
7371
|
-
const { classNames, className, style, styles: styles2, vars, mod, ...others } = useProps(
|
|
7372
|
-
"CarouselSlide",
|
|
7373
|
-
null,
|
|
7374
|
-
props
|
|
7375
|
-
);
|
|
7376
|
-
const ctx = useCarouselContext();
|
|
7377
|
-
return /* @__PURE__ */ jsx(
|
|
7378
|
-
Box,
|
|
7379
|
-
{
|
|
7380
|
-
ref,
|
|
7381
|
-
mod: [{ orientation: ctx.orientation }, mod],
|
|
7382
|
-
...ctx.getStyles("slide", { className, style, classNames, styles: styles2 }),
|
|
7383
|
-
...others
|
|
7384
|
-
}
|
|
7385
|
-
);
|
|
7386
|
-
});
|
|
7387
|
-
CarouselSlide.classes = classes;
|
|
7388
|
-
CarouselSlide.displayName = "@mantine/carousel/CarouselSlide";
|
|
7389
|
-
function CarouselVariables({ slideGap, slideSize, selector }) {
|
|
7390
|
-
const theme = useMantineTheme();
|
|
7391
|
-
const baseStyles = filterProps({
|
|
7392
|
-
"--carousel-slide-gap": getSpacing(getBaseValue(slideGap)),
|
|
7393
|
-
"--carousel-slide-size": rem(getBaseValue(slideSize))
|
|
7394
|
-
});
|
|
7395
|
-
const queries = keys(theme.breakpoints).reduce(
|
|
7396
|
-
(acc, breakpoint) => {
|
|
7397
|
-
if (!acc[breakpoint]) {
|
|
7398
|
-
acc[breakpoint] = {};
|
|
7399
|
-
}
|
|
7400
|
-
if (typeof slideGap === "object" && slideGap[breakpoint] !== void 0) {
|
|
7401
|
-
acc[breakpoint]["--carousel-slide-gap"] = getSpacing(slideGap[breakpoint]);
|
|
7402
|
-
}
|
|
7403
|
-
if (typeof slideSize === "object" && slideSize[breakpoint] !== void 0) {
|
|
7404
|
-
acc[breakpoint]["--carousel-slide-size"] = getSpacing(slideSize[breakpoint]);
|
|
7405
|
-
}
|
|
7406
|
-
return acc;
|
|
7407
|
-
},
|
|
7408
|
-
{}
|
|
7409
|
-
);
|
|
7410
|
-
const sortedBreakpoints = getSortedBreakpoints(keys(queries), theme.breakpoints).filter(
|
|
7411
|
-
(breakpoint) => keys(queries[breakpoint.value]).length > 0
|
|
7412
|
-
);
|
|
7413
|
-
const media = sortedBreakpoints.map((breakpoint) => ({
|
|
7414
|
-
query: `(min-width: ${theme.breakpoints[breakpoint.value]})`,
|
|
7415
|
-
styles: queries[breakpoint.value]
|
|
7416
|
-
}));
|
|
7417
|
-
return /* @__PURE__ */ jsx(InlineStyles, { styles: baseStyles, media, selector });
|
|
7418
|
-
}
|
|
7419
|
-
function getBreakpoints(values) {
|
|
7420
|
-
if (typeof values === "object" && values !== null) {
|
|
7421
|
-
return keys(values);
|
|
7422
|
-
}
|
|
7423
|
-
return [];
|
|
7424
|
-
}
|
|
7425
|
-
function sortBreakpoints(breakpoints) {
|
|
7426
|
-
return breakpoints.sort((a, b) => px(a) - px(b));
|
|
7427
|
-
}
|
|
7428
|
-
function getUniqueBreakpoints({ slideGap, slideSize }) {
|
|
7429
|
-
const breakpoints = Array.from(
|
|
7430
|
-
/* @__PURE__ */ new Set([...getBreakpoints(slideGap), ...getBreakpoints(slideSize)])
|
|
7431
|
-
);
|
|
7432
|
-
return sortBreakpoints(breakpoints);
|
|
7433
|
-
}
|
|
7434
|
-
function CarouselContainerVariables({
|
|
7435
|
-
slideGap,
|
|
7436
|
-
slideSize,
|
|
7437
|
-
selector
|
|
7438
|
-
}) {
|
|
7439
|
-
const baseStyles = filterProps({
|
|
7440
|
-
"--carousel-slide-gap": getSpacing(getBaseValue(slideGap)),
|
|
7441
|
-
"--carousel-slide-size": rem(getBaseValue(slideSize))
|
|
7442
|
-
});
|
|
7443
|
-
const queries = getUniqueBreakpoints({ slideGap, slideSize }).reduce((acc, breakpoint) => {
|
|
7444
|
-
if (!acc[breakpoint]) {
|
|
7445
|
-
acc[breakpoint] = {};
|
|
7446
|
-
}
|
|
7447
|
-
if (typeof slideGap === "object" && slideGap[breakpoint] !== void 0) {
|
|
7448
|
-
acc[breakpoint]["--carousel-slide-gap"] = getSpacing(slideGap[breakpoint]);
|
|
7449
|
-
}
|
|
7450
|
-
if (typeof slideSize === "object" && slideSize[breakpoint] !== void 0) {
|
|
7451
|
-
acc[breakpoint]["--carousel-slide-size"] = getSpacing(slideSize[breakpoint]);
|
|
7452
|
-
}
|
|
7453
|
-
return acc;
|
|
7454
|
-
}, {});
|
|
7455
|
-
const media = Object.keys(queries).map((breakpoint) => ({
|
|
7456
|
-
query: `carousel (min-width: ${breakpoint})`,
|
|
7457
|
-
styles: queries[breakpoint]
|
|
7458
|
-
}));
|
|
7459
|
-
return /* @__PURE__ */ jsx(InlineStyles, { styles: baseStyles, container: media, selector });
|
|
7460
|
-
}
|
|
7461
|
-
function getChevronRotation({ dir, orientation, direction }) {
|
|
7462
|
-
if (direction === "previous") {
|
|
7463
|
-
return orientation === "horizontal" ? 90 * (dir === "ltr" ? 1 : -1) : -180;
|
|
7464
|
-
}
|
|
7465
|
-
return orientation === "horizontal" ? 90 * (dir === "ltr" ? -1 : 1) : 0;
|
|
7466
|
-
}
|
|
7467
|
-
const defaultProps = {
|
|
7468
|
-
controlSize: 26,
|
|
7469
|
-
controlsOffset: "sm",
|
|
7470
|
-
slideSize: "100%",
|
|
7471
|
-
slideGap: 0,
|
|
7472
|
-
orientation: "horizontal",
|
|
7473
|
-
includeGapInSize: true,
|
|
7474
|
-
initialSlide: 0,
|
|
7475
|
-
withControls: true,
|
|
7476
|
-
withIndicators: false,
|
|
7477
|
-
withKeyboardEvents: true,
|
|
7478
|
-
type: "media"
|
|
7479
|
-
};
|
|
7480
|
-
const defaultEmblaOptions = {
|
|
7481
|
-
align: "center",
|
|
7482
|
-
loop: false,
|
|
7483
|
-
slidesToScroll: 1,
|
|
7484
|
-
dragFree: false,
|
|
7485
|
-
inViewThreshold: 0,
|
|
7486
|
-
skipSnaps: false,
|
|
7487
|
-
containScroll: "trimSnaps"
|
|
7488
|
-
};
|
|
7489
|
-
const varsResolver = createVarsResolver(
|
|
7490
|
-
(_, { height, controlSize, controlsOffset }) => ({
|
|
7491
|
-
root: {
|
|
7492
|
-
"--carousel-height": rem(height),
|
|
7493
|
-
"--carousel-control-size": rem(controlSize),
|
|
7494
|
-
"--carousel-controls-offset": getSpacing(controlsOffset)
|
|
7495
|
-
}
|
|
7496
|
-
})
|
|
7497
|
-
);
|
|
7498
|
-
const Carousel = factory((_props, ref) => {
|
|
7499
|
-
const props = useProps("Carousel", defaultProps, _props);
|
|
7500
|
-
const {
|
|
7501
|
-
classNames,
|
|
7502
|
-
className,
|
|
7503
|
-
style,
|
|
7504
|
-
styles: styles2,
|
|
7505
|
-
unstyled,
|
|
7506
|
-
vars,
|
|
7507
|
-
children,
|
|
7508
|
-
getEmblaApi,
|
|
7509
|
-
onNextSlide,
|
|
7510
|
-
onPreviousSlide,
|
|
7511
|
-
onSlideChange,
|
|
7512
|
-
nextControlProps,
|
|
7513
|
-
previousControlProps,
|
|
7514
|
-
controlSize,
|
|
7515
|
-
controlsOffset,
|
|
7516
|
-
slideSize,
|
|
7517
|
-
slideGap,
|
|
7518
|
-
orientation,
|
|
7519
|
-
height,
|
|
7520
|
-
includeGapInSize,
|
|
7521
|
-
draggable,
|
|
7522
|
-
initialSlide,
|
|
7523
|
-
withControls,
|
|
7524
|
-
withIndicators,
|
|
7525
|
-
plugins,
|
|
7526
|
-
nextControlIcon,
|
|
7527
|
-
previousControlIcon,
|
|
7528
|
-
withKeyboardEvents,
|
|
7529
|
-
mod,
|
|
7530
|
-
type,
|
|
7531
|
-
emblaOptions,
|
|
7532
|
-
attributes,
|
|
7533
|
-
...others
|
|
7534
|
-
} = props;
|
|
7535
|
-
const getStyles = useStyles({
|
|
7536
|
-
name: "Carousel",
|
|
7537
|
-
classes,
|
|
7538
|
-
props,
|
|
7539
|
-
className,
|
|
7540
|
-
style,
|
|
7541
|
-
classNames,
|
|
7542
|
-
styles: styles2,
|
|
7543
|
-
unstyled,
|
|
7544
|
-
attributes,
|
|
7545
|
-
vars,
|
|
7546
|
-
varsResolver
|
|
7547
|
-
});
|
|
7548
|
-
const responsiveClassName = useRandomClassName();
|
|
7549
|
-
const { dir } = useDirection();
|
|
7550
|
-
const [emblaRefElement, embla] = useEmblaCarousel(
|
|
7551
|
-
{
|
|
7552
|
-
axis: orientation === "horizontal" ? "x" : "y",
|
|
7553
|
-
direction: orientation === "horizontal" ? dir : void 0,
|
|
7554
|
-
startIndex: initialSlide,
|
|
7555
|
-
...defaultEmblaOptions,
|
|
7556
|
-
...emblaOptions
|
|
7557
|
-
},
|
|
7558
|
-
plugins
|
|
7559
|
-
);
|
|
7560
|
-
const [selected, setSelected] = useState(0);
|
|
7561
|
-
const [slidesCount, setSlidesCount] = useState(0);
|
|
7562
|
-
const handleScroll = useCallback((index) => embla && embla.scrollTo(index), [embla]);
|
|
7563
|
-
const handleSelect = useCallback(() => {
|
|
7564
|
-
if (!embla) {
|
|
7565
|
-
return;
|
|
7566
|
-
}
|
|
7567
|
-
const slide = embla.selectedScrollSnap();
|
|
7568
|
-
setSelected(slide);
|
|
7569
|
-
slide !== selected && (onSlideChange == null ? void 0 : onSlideChange(slide));
|
|
7570
|
-
}, [embla, setSelected, onSlideChange, selected]);
|
|
7571
|
-
const handlePrevious = useCallback(() => {
|
|
7572
|
-
embla == null ? void 0 : embla.scrollPrev();
|
|
7573
|
-
onPreviousSlide == null ? void 0 : onPreviousSlide();
|
|
7574
|
-
}, [embla]);
|
|
7575
|
-
const handleNext = useCallback(() => {
|
|
7576
|
-
embla == null ? void 0 : embla.scrollNext();
|
|
7577
|
-
onNextSlide == null ? void 0 : onNextSlide();
|
|
7578
|
-
}, [embla]);
|
|
7579
|
-
const handleKeydown = useCallback(
|
|
7580
|
-
(event) => {
|
|
7581
|
-
if (withKeyboardEvents) {
|
|
7582
|
-
if (event.key === "ArrowRight") {
|
|
7583
|
-
event.preventDefault();
|
|
7584
|
-
handleNext();
|
|
7585
|
-
}
|
|
7586
|
-
if (event.key === "ArrowLeft") {
|
|
7587
|
-
event.preventDefault();
|
|
7588
|
-
handlePrevious();
|
|
7589
|
-
}
|
|
7590
|
-
}
|
|
7591
|
-
},
|
|
7592
|
-
[embla]
|
|
7593
|
-
);
|
|
7594
|
-
useEffect(() => {
|
|
7595
|
-
if (embla) {
|
|
7596
|
-
getEmblaApi == null ? void 0 : getEmblaApi(embla);
|
|
7597
|
-
handleSelect();
|
|
7598
|
-
setSlidesCount(embla.scrollSnapList().length);
|
|
7599
|
-
embla.on("select", handleSelect);
|
|
7600
|
-
return () => {
|
|
7601
|
-
embla.off("select", handleSelect);
|
|
7602
|
-
};
|
|
7603
|
-
}
|
|
7604
|
-
return void 0;
|
|
7605
|
-
}, [embla, emblaOptions == null ? void 0 : emblaOptions.slidesToScroll, handleSelect]);
|
|
7606
|
-
useEffect(() => {
|
|
7607
|
-
if (embla) {
|
|
7608
|
-
embla.reInit();
|
|
7609
|
-
setSlidesCount(embla.scrollSnapList().length);
|
|
7610
|
-
setSelected(
|
|
7611
|
-
(currentSelected) => clamp$1(currentSelected, 0, Children.toArray(children).length - 1)
|
|
7612
|
-
);
|
|
7613
|
-
}
|
|
7614
|
-
}, [Children.toArray(children).length, emblaOptions == null ? void 0 : emblaOptions.slidesToScroll]);
|
|
7615
|
-
const canScrollPrev = (embla == null ? void 0 : embla.canScrollPrev()) || false;
|
|
7616
|
-
const canScrollNext = (embla == null ? void 0 : embla.canScrollNext()) || false;
|
|
7617
|
-
const indicators = Array(slidesCount).fill(0).map((_, index) => /* @__PURE__ */ createElement(
|
|
7618
|
-
UnstyledButton,
|
|
7619
|
-
{
|
|
7620
|
-
...getStyles("indicator"),
|
|
7621
|
-
key: index,
|
|
7622
|
-
"data-active": index === selected || void 0,
|
|
7623
|
-
"aria-hidden": true,
|
|
7624
|
-
tabIndex: -1,
|
|
7625
|
-
onClick: () => handleScroll(index),
|
|
7626
|
-
"data-orientation": orientation,
|
|
7627
|
-
onMouseDown: (event) => event.preventDefault()
|
|
7628
|
-
}
|
|
7629
|
-
));
|
|
7630
|
-
return /* @__PURE__ */ jsxs(CarouselProvider, { value: { getStyles, orientation }, children: [
|
|
7631
|
-
type === "container" ? /* @__PURE__ */ jsx(CarouselContainerVariables, { ...props, selector: `.${responsiveClassName}` }) : /* @__PURE__ */ jsx(CarouselVariables, { ...props, selector: `.${responsiveClassName}` }),
|
|
7632
|
-
/* @__PURE__ */ jsxs(
|
|
7633
|
-
Box,
|
|
7634
|
-
{
|
|
7635
|
-
ref,
|
|
7636
|
-
...getStyles("root", { className: "responsiveClassName" }),
|
|
7637
|
-
...others,
|
|
7638
|
-
mod: [{ orientation, "include-gap-in-size": includeGapInSize }, mod],
|
|
7639
|
-
onKeyDownCapture: handleKeydown,
|
|
7640
|
-
children: [
|
|
7641
|
-
/* @__PURE__ */ jsx("div", { ...getStyles("viewport"), ref: emblaRefElement, "data-type": type, children: /* @__PURE__ */ jsx(
|
|
7642
|
-
"div",
|
|
7643
|
-
{
|
|
7644
|
-
...getStyles("container", { className: responsiveClassName }),
|
|
7645
|
-
"data-orientation": orientation,
|
|
7646
|
-
children
|
|
7647
|
-
}
|
|
7648
|
-
) }),
|
|
7649
|
-
withIndicators && /* @__PURE__ */ jsx("div", { ...getStyles("indicators"), "data-orientation": orientation, children: indicators }),
|
|
7650
|
-
withControls && /* @__PURE__ */ jsxs("div", { ...getStyles("controls"), "data-orientation": orientation, children: [
|
|
7651
|
-
/* @__PURE__ */ jsx(
|
|
7652
|
-
UnstyledButton,
|
|
7653
|
-
{
|
|
7654
|
-
...previousControlProps,
|
|
7655
|
-
...getStyles("control", {
|
|
7656
|
-
className: previousControlProps == null ? void 0 : previousControlProps.className,
|
|
7657
|
-
style: previousControlProps == null ? void 0 : previousControlProps.style
|
|
7658
|
-
}),
|
|
7659
|
-
onClick: (event) => {
|
|
7660
|
-
var _a;
|
|
7661
|
-
handlePrevious();
|
|
7662
|
-
(_a = previousControlProps == null ? void 0 : previousControlProps.onClick) == null ? void 0 : _a.call(previousControlProps, event);
|
|
7663
|
-
},
|
|
7664
|
-
"data-inactive": !canScrollPrev || void 0,
|
|
7665
|
-
"data-type": "previous",
|
|
7666
|
-
tabIndex: canScrollPrev ? 0 : -1,
|
|
7667
|
-
children: typeof previousControlIcon !== "undefined" ? previousControlIcon : /* @__PURE__ */ jsx(
|
|
7668
|
-
AccordionChevron,
|
|
7669
|
-
{
|
|
7670
|
-
style: {
|
|
7671
|
-
transform: `rotate(${getChevronRotation({
|
|
7672
|
-
dir,
|
|
7673
|
-
orientation,
|
|
7674
|
-
direction: "previous"
|
|
7675
|
-
})}deg)`
|
|
7676
|
-
}
|
|
7677
|
-
}
|
|
7678
|
-
)
|
|
7679
|
-
}
|
|
7680
|
-
),
|
|
7681
|
-
/* @__PURE__ */ jsx(
|
|
7682
|
-
UnstyledButton,
|
|
7683
|
-
{
|
|
7684
|
-
...getStyles("control", {
|
|
7685
|
-
className: nextControlProps == null ? void 0 : nextControlProps.className,
|
|
7686
|
-
style: nextControlProps == null ? void 0 : nextControlProps.style
|
|
7687
|
-
}),
|
|
7688
|
-
...nextControlProps,
|
|
7689
|
-
onClick: (event) => {
|
|
7690
|
-
var _a;
|
|
7691
|
-
handleNext();
|
|
7692
|
-
(_a = nextControlProps == null ? void 0 : nextControlProps.onClick) == null ? void 0 : _a.call(nextControlProps, event);
|
|
7693
|
-
},
|
|
7694
|
-
"data-inactive": !canScrollNext || void 0,
|
|
7695
|
-
"data-type": "next",
|
|
7696
|
-
tabIndex: canScrollNext ? 0 : -1,
|
|
7697
|
-
children: typeof nextControlIcon !== "undefined" ? nextControlIcon : /* @__PURE__ */ jsx(
|
|
7698
|
-
AccordionChevron,
|
|
7699
|
-
{
|
|
7700
|
-
style: {
|
|
7701
|
-
transform: `rotate(${getChevronRotation({
|
|
7702
|
-
dir,
|
|
7703
|
-
orientation,
|
|
7704
|
-
direction: "next"
|
|
7705
|
-
})}deg)`
|
|
7706
|
-
}
|
|
7707
|
-
}
|
|
7708
|
-
)
|
|
7709
|
-
}
|
|
7710
|
-
)
|
|
7711
|
-
] })
|
|
7712
|
-
]
|
|
7713
|
-
}
|
|
7714
|
-
)
|
|
7715
|
-
] });
|
|
7716
|
-
});
|
|
7717
|
-
Carousel.classes = classes;
|
|
7718
|
-
Carousel.displayName = "@mantine/carousel/Carousel";
|
|
7719
|
-
Carousel.Slide = CarouselSlide;
|
|
7720
5575
|
function CoverSection({
|
|
7721
5576
|
opened,
|
|
7722
5577
|
videoId,
|
|
@@ -7855,7 +5710,7 @@ function CoverSection({
|
|
|
7855
5710
|
const selectedUrl = useMemo(() => {
|
|
7856
5711
|
var _a2, _b2;
|
|
7857
5712
|
if (selectedPosterUrl) return selectedPosterUrl;
|
|
7858
|
-
return ((_a2 = previews.find((
|
|
5713
|
+
return ((_a2 = previews.find((p) => p.id === effectiveSelected)) == null ? void 0 : _a2.url) ?? ((_b2 = status == null ? void 0 : status.cover) == null ? void 0 : _b2.url) ?? null;
|
|
7859
5714
|
}, [selectedPosterUrl, previews, effectiveSelected, (_b = status == null ? void 0 : status.cover) == null ? void 0 : _b.url]);
|
|
7860
5715
|
useEffect(() => {
|
|
7861
5716
|
if (!opened || !videoId) return;
|
|
@@ -7967,7 +5822,7 @@ function CoverSection({
|
|
|
7967
5822
|
},
|
|
7968
5823
|
role: "button",
|
|
7969
5824
|
tabIndex: 0,
|
|
7970
|
-
onKeyDown: (
|
|
5825
|
+
onKeyDown: (e) => e.key === "Enter" && !isError && (() => {
|
|
7971
5826
|
setSelectedPreviewId(preview.id);
|
|
7972
5827
|
onSelectedPosterChange == null ? void 0 : onSelectedPosterChange(preview.url);
|
|
7973
5828
|
})(),
|
|
@@ -8376,10 +6231,10 @@ function ManualSubtitlesPanel({
|
|
|
8376
6231
|
function DraftRow({ draft, onChange, onUpload, onRemove }) {
|
|
8377
6232
|
const { t } = useTranslation();
|
|
8378
6233
|
const inputRef = useRef(null);
|
|
8379
|
-
const handleFileChange = (
|
|
6234
|
+
const handleFileChange = (e) => {
|
|
8380
6235
|
var _a;
|
|
8381
|
-
const file = (_a =
|
|
8382
|
-
|
|
6236
|
+
const file = (_a = e.target.files) == null ? void 0 : _a[0];
|
|
6237
|
+
e.target.value = "";
|
|
8383
6238
|
if (!file) return;
|
|
8384
6239
|
onUpload(file);
|
|
8385
6240
|
};
|