@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20261014103458 → 0.8.1-dev.20261015111022
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.
|
@@ -33,7 +33,9 @@ var Slider = ({
|
|
|
33
33
|
);
|
|
34
34
|
const [isPlaying, setIsPlaying] = useState(autoplay);
|
|
35
35
|
const trackRef = useRef(null);
|
|
36
|
-
|
|
36
|
+
const prevSlideRef = useRef(currentSlide);
|
|
37
|
+
const nextSlideRef = useRef(() => {
|
|
38
|
+
});
|
|
37
39
|
const [videoProgress, setVideoProgress] = useState(null);
|
|
38
40
|
useEffect(() => {
|
|
39
41
|
if (typeof initialSlidesToShow === "number") {
|
|
@@ -55,16 +57,36 @@ var Slider = ({
|
|
|
55
57
|
}, [initialSlidesToShow]);
|
|
56
58
|
useEffect(() => {
|
|
57
59
|
if (!autoplay) return;
|
|
60
|
+
if (trackRef.current) {
|
|
61
|
+
Array.from(trackRef.current.children).forEach((child, index) => {
|
|
62
|
+
if (index !== currentSlide) {
|
|
63
|
+
const nonActiveVideos = child.querySelectorAll("video");
|
|
64
|
+
nonActiveVideos.forEach((vid) => {
|
|
65
|
+
vid.pause();
|
|
66
|
+
vid.currentTime = 0;
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
}
|
|
58
71
|
const activeSlideElement = trackRef.current?.children[currentSlide];
|
|
59
72
|
const videoElement = activeSlideElement?.querySelector("video");
|
|
73
|
+
const isNewSlide = prevSlideRef.current !== currentSlide;
|
|
74
|
+
prevSlideRef.current = currentSlide;
|
|
60
75
|
if (videoElement) {
|
|
61
76
|
videoElement.loop = false;
|
|
62
|
-
|
|
63
|
-
|
|
77
|
+
if (isNewSlide) {
|
|
78
|
+
setVideoProgress(0);
|
|
64
79
|
videoElement.currentTime = 0;
|
|
65
80
|
}
|
|
66
|
-
|
|
67
|
-
|
|
81
|
+
if (isPlaying) {
|
|
82
|
+
if (videoElement.ended) {
|
|
83
|
+
videoElement.currentTime = 0;
|
|
84
|
+
}
|
|
85
|
+
videoElement.play().catch(() => {
|
|
86
|
+
});
|
|
87
|
+
} else {
|
|
88
|
+
videoElement.pause();
|
|
89
|
+
}
|
|
68
90
|
const handleTimeUpdate = () => {
|
|
69
91
|
if (videoElement.duration && !isNaN(videoElement.duration) && videoElement.duration > 0) {
|
|
70
92
|
const pct = videoElement.currentTime / videoElement.duration * 100;
|
|
@@ -73,10 +95,12 @@ var Slider = ({
|
|
|
73
95
|
};
|
|
74
96
|
const handleVideoEnded = () => {
|
|
75
97
|
setVideoProgress(100);
|
|
76
|
-
|
|
98
|
+
nextSlideRef.current();
|
|
77
99
|
};
|
|
78
100
|
const handleVideoError = () => {
|
|
79
|
-
|
|
101
|
+
if (videoElement.error) {
|
|
102
|
+
nextSlideRef.current();
|
|
103
|
+
}
|
|
80
104
|
};
|
|
81
105
|
videoElement.addEventListener("timeupdate", handleTimeUpdate);
|
|
82
106
|
videoElement.addEventListener("loadedmetadata", handleTimeUpdate);
|
|
@@ -93,7 +117,7 @@ var Slider = ({
|
|
|
93
117
|
}
|
|
94
118
|
const timer = setInterval(() => {
|
|
95
119
|
if (isPlaying) {
|
|
96
|
-
|
|
120
|
+
nextSlideRef.current();
|
|
97
121
|
}
|
|
98
122
|
}, autoplay_speed);
|
|
99
123
|
return () => clearInterval(timer);
|
|
@@ -132,6 +156,7 @@ var Slider = ({
|
|
|
132
156
|
setCurrentSlide(slidePositions[currentStepIndex + 1]);
|
|
133
157
|
}
|
|
134
158
|
};
|
|
159
|
+
nextSlideRef.current = nextSlide;
|
|
135
160
|
const prevSlide = () => {
|
|
136
161
|
if (currentStepIndex <= 0) {
|
|
137
162
|
if (infinite_scroll) {
|
|
@@ -31,7 +31,9 @@ var Slider = ({
|
|
|
31
31
|
);
|
|
32
32
|
const [isPlaying, setIsPlaying] = useState(autoplay);
|
|
33
33
|
const trackRef = useRef(null);
|
|
34
|
-
|
|
34
|
+
const prevSlideRef = useRef(currentSlide);
|
|
35
|
+
const nextSlideRef = useRef(() => {
|
|
36
|
+
});
|
|
35
37
|
const [videoProgress, setVideoProgress] = useState(null);
|
|
36
38
|
useEffect(() => {
|
|
37
39
|
if (typeof initialSlidesToShow === "number") {
|
|
@@ -53,16 +55,36 @@ var Slider = ({
|
|
|
53
55
|
}, [initialSlidesToShow]);
|
|
54
56
|
useEffect(() => {
|
|
55
57
|
if (!autoplay) return;
|
|
58
|
+
if (trackRef.current) {
|
|
59
|
+
Array.from(trackRef.current.children).forEach((child, index) => {
|
|
60
|
+
if (index !== currentSlide) {
|
|
61
|
+
const nonActiveVideos = child.querySelectorAll("video");
|
|
62
|
+
nonActiveVideos.forEach((vid) => {
|
|
63
|
+
vid.pause();
|
|
64
|
+
vid.currentTime = 0;
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
}
|
|
56
69
|
const activeSlideElement = trackRef.current?.children[currentSlide];
|
|
57
70
|
const videoElement = activeSlideElement?.querySelector("video");
|
|
71
|
+
const isNewSlide = prevSlideRef.current !== currentSlide;
|
|
72
|
+
prevSlideRef.current = currentSlide;
|
|
58
73
|
if (videoElement) {
|
|
59
74
|
videoElement.loop = false;
|
|
60
|
-
|
|
61
|
-
|
|
75
|
+
if (isNewSlide) {
|
|
76
|
+
setVideoProgress(0);
|
|
62
77
|
videoElement.currentTime = 0;
|
|
63
78
|
}
|
|
64
|
-
|
|
65
|
-
|
|
79
|
+
if (isPlaying) {
|
|
80
|
+
if (videoElement.ended) {
|
|
81
|
+
videoElement.currentTime = 0;
|
|
82
|
+
}
|
|
83
|
+
videoElement.play().catch(() => {
|
|
84
|
+
});
|
|
85
|
+
} else {
|
|
86
|
+
videoElement.pause();
|
|
87
|
+
}
|
|
66
88
|
const handleTimeUpdate = () => {
|
|
67
89
|
if (videoElement.duration && !isNaN(videoElement.duration) && videoElement.duration > 0) {
|
|
68
90
|
const pct = videoElement.currentTime / videoElement.duration * 100;
|
|
@@ -71,10 +93,12 @@ var Slider = ({
|
|
|
71
93
|
};
|
|
72
94
|
const handleVideoEnded = () => {
|
|
73
95
|
setVideoProgress(100);
|
|
74
|
-
|
|
96
|
+
nextSlideRef.current();
|
|
75
97
|
};
|
|
76
98
|
const handleVideoError = () => {
|
|
77
|
-
|
|
99
|
+
if (videoElement.error) {
|
|
100
|
+
nextSlideRef.current();
|
|
101
|
+
}
|
|
78
102
|
};
|
|
79
103
|
videoElement.addEventListener("timeupdate", handleTimeUpdate);
|
|
80
104
|
videoElement.addEventListener("loadedmetadata", handleTimeUpdate);
|
|
@@ -91,7 +115,7 @@ var Slider = ({
|
|
|
91
115
|
}
|
|
92
116
|
const timer = setInterval(() => {
|
|
93
117
|
if (isPlaying) {
|
|
94
|
-
|
|
118
|
+
nextSlideRef.current();
|
|
95
119
|
}
|
|
96
120
|
}, autoplay_speed);
|
|
97
121
|
return () => clearInterval(timer);
|
|
@@ -130,6 +154,7 @@ var Slider = ({
|
|
|
130
154
|
setCurrentSlide(slidePositions[currentStepIndex + 1]);
|
|
131
155
|
}
|
|
132
156
|
};
|
|
157
|
+
nextSlideRef.current = nextSlide;
|
|
133
158
|
const prevSlide = () => {
|
|
134
159
|
if (currentStepIndex <= 0) {
|
|
135
160
|
if (infinite_scroll) {
|
package/dist/index.js
CHANGED
|
@@ -7194,7 +7194,9 @@ var init_Slider = __esm({
|
|
|
7194
7194
|
);
|
|
7195
7195
|
const [isPlaying, setIsPlaying] = (0, import_react62.useState)(autoplay);
|
|
7196
7196
|
const trackRef = (0, import_react62.useRef)(null);
|
|
7197
|
-
|
|
7197
|
+
const prevSlideRef = (0, import_react62.useRef)(currentSlide);
|
|
7198
|
+
const nextSlideRef = (0, import_react62.useRef)(() => {
|
|
7199
|
+
});
|
|
7198
7200
|
const [videoProgress, setVideoProgress] = (0, import_react62.useState)(null);
|
|
7199
7201
|
(0, import_react62.useEffect)(() => {
|
|
7200
7202
|
if (typeof initialSlidesToShow === "number") {
|
|
@@ -7216,16 +7218,36 @@ var init_Slider = __esm({
|
|
|
7216
7218
|
}, [initialSlidesToShow]);
|
|
7217
7219
|
(0, import_react62.useEffect)(() => {
|
|
7218
7220
|
if (!autoplay) return;
|
|
7221
|
+
if (trackRef.current) {
|
|
7222
|
+
Array.from(trackRef.current.children).forEach((child, index) => {
|
|
7223
|
+
if (index !== currentSlide) {
|
|
7224
|
+
const nonActiveVideos = child.querySelectorAll("video");
|
|
7225
|
+
nonActiveVideos.forEach((vid) => {
|
|
7226
|
+
vid.pause();
|
|
7227
|
+
vid.currentTime = 0;
|
|
7228
|
+
});
|
|
7229
|
+
}
|
|
7230
|
+
});
|
|
7231
|
+
}
|
|
7219
7232
|
const activeSlideElement = trackRef.current?.children[currentSlide];
|
|
7220
7233
|
const videoElement = activeSlideElement?.querySelector("video");
|
|
7234
|
+
const isNewSlide = prevSlideRef.current !== currentSlide;
|
|
7235
|
+
prevSlideRef.current = currentSlide;
|
|
7221
7236
|
if (videoElement) {
|
|
7222
7237
|
videoElement.loop = false;
|
|
7223
|
-
|
|
7224
|
-
|
|
7238
|
+
if (isNewSlide) {
|
|
7239
|
+
setVideoProgress(0);
|
|
7225
7240
|
videoElement.currentTime = 0;
|
|
7226
7241
|
}
|
|
7227
|
-
|
|
7228
|
-
|
|
7242
|
+
if (isPlaying) {
|
|
7243
|
+
if (videoElement.ended) {
|
|
7244
|
+
videoElement.currentTime = 0;
|
|
7245
|
+
}
|
|
7246
|
+
videoElement.play().catch(() => {
|
|
7247
|
+
});
|
|
7248
|
+
} else {
|
|
7249
|
+
videoElement.pause();
|
|
7250
|
+
}
|
|
7229
7251
|
const handleTimeUpdate = () => {
|
|
7230
7252
|
if (videoElement.duration && !isNaN(videoElement.duration) && videoElement.duration > 0) {
|
|
7231
7253
|
const pct = videoElement.currentTime / videoElement.duration * 100;
|
|
@@ -7234,10 +7256,12 @@ var init_Slider = __esm({
|
|
|
7234
7256
|
};
|
|
7235
7257
|
const handleVideoEnded = () => {
|
|
7236
7258
|
setVideoProgress(100);
|
|
7237
|
-
|
|
7259
|
+
nextSlideRef.current();
|
|
7238
7260
|
};
|
|
7239
7261
|
const handleVideoError = () => {
|
|
7240
|
-
|
|
7262
|
+
if (videoElement.error) {
|
|
7263
|
+
nextSlideRef.current();
|
|
7264
|
+
}
|
|
7241
7265
|
};
|
|
7242
7266
|
videoElement.addEventListener("timeupdate", handleTimeUpdate);
|
|
7243
7267
|
videoElement.addEventListener("loadedmetadata", handleTimeUpdate);
|
|
@@ -7254,7 +7278,7 @@ var init_Slider = __esm({
|
|
|
7254
7278
|
}
|
|
7255
7279
|
const timer = setInterval(() => {
|
|
7256
7280
|
if (isPlaying) {
|
|
7257
|
-
|
|
7281
|
+
nextSlideRef.current();
|
|
7258
7282
|
}
|
|
7259
7283
|
}, autoplay_speed);
|
|
7260
7284
|
return () => clearInterval(timer);
|
|
@@ -7293,6 +7317,7 @@ var init_Slider = __esm({
|
|
|
7293
7317
|
setCurrentSlide(slidePositions[currentStepIndex + 1]);
|
|
7294
7318
|
}
|
|
7295
7319
|
};
|
|
7320
|
+
nextSlideRef.current = nextSlide;
|
|
7296
7321
|
const prevSlide = () => {
|
|
7297
7322
|
if (currentStepIndex <= 0) {
|
|
7298
7323
|
if (infinite_scroll) {
|
package/dist/index.mjs
CHANGED
|
@@ -2551,7 +2551,7 @@ var Pagination = dynamic16(() => import("./Pagination-6R4XZLF6.mjs"), { ssr: tru
|
|
|
2551
2551
|
var DataBindingControls = dynamic16(() => import("./DataBindingControls-VSLL4WV2.mjs"), {
|
|
2552
2552
|
ssr: true
|
|
2553
2553
|
});
|
|
2554
|
-
var Slider = dynamic16(() => import("./Slider-
|
|
2554
|
+
var Slider = dynamic16(() => import("./Slider-3URCZ3JU.mjs"), {
|
|
2555
2555
|
ssr: false
|
|
2556
2556
|
});
|
|
2557
2557
|
function toCamelCase(str) {
|
package/dist/server.js
CHANGED
|
@@ -4829,7 +4829,9 @@ var init_Slider = __esm({
|
|
|
4829
4829
|
);
|
|
4830
4830
|
const [isPlaying, setIsPlaying] = (0, import_react42.useState)(autoplay);
|
|
4831
4831
|
const trackRef = (0, import_react42.useRef)(null);
|
|
4832
|
-
|
|
4832
|
+
const prevSlideRef = (0, import_react42.useRef)(currentSlide);
|
|
4833
|
+
const nextSlideRef = (0, import_react42.useRef)(() => {
|
|
4834
|
+
});
|
|
4833
4835
|
const [videoProgress, setVideoProgress] = (0, import_react42.useState)(null);
|
|
4834
4836
|
(0, import_react42.useEffect)(() => {
|
|
4835
4837
|
if (typeof initialSlidesToShow === "number") {
|
|
@@ -4851,16 +4853,36 @@ var init_Slider = __esm({
|
|
|
4851
4853
|
}, [initialSlidesToShow]);
|
|
4852
4854
|
(0, import_react42.useEffect)(() => {
|
|
4853
4855
|
if (!autoplay) return;
|
|
4856
|
+
if (trackRef.current) {
|
|
4857
|
+
Array.from(trackRef.current.children).forEach((child, index) => {
|
|
4858
|
+
if (index !== currentSlide) {
|
|
4859
|
+
const nonActiveVideos = child.querySelectorAll("video");
|
|
4860
|
+
nonActiveVideos.forEach((vid) => {
|
|
4861
|
+
vid.pause();
|
|
4862
|
+
vid.currentTime = 0;
|
|
4863
|
+
});
|
|
4864
|
+
}
|
|
4865
|
+
});
|
|
4866
|
+
}
|
|
4854
4867
|
const activeSlideElement = trackRef.current?.children[currentSlide];
|
|
4855
4868
|
const videoElement = activeSlideElement?.querySelector("video");
|
|
4869
|
+
const isNewSlide = prevSlideRef.current !== currentSlide;
|
|
4870
|
+
prevSlideRef.current = currentSlide;
|
|
4856
4871
|
if (videoElement) {
|
|
4857
4872
|
videoElement.loop = false;
|
|
4858
|
-
|
|
4859
|
-
|
|
4873
|
+
if (isNewSlide) {
|
|
4874
|
+
setVideoProgress(0);
|
|
4860
4875
|
videoElement.currentTime = 0;
|
|
4861
4876
|
}
|
|
4862
|
-
|
|
4863
|
-
|
|
4877
|
+
if (isPlaying) {
|
|
4878
|
+
if (videoElement.ended) {
|
|
4879
|
+
videoElement.currentTime = 0;
|
|
4880
|
+
}
|
|
4881
|
+
videoElement.play().catch(() => {
|
|
4882
|
+
});
|
|
4883
|
+
} else {
|
|
4884
|
+
videoElement.pause();
|
|
4885
|
+
}
|
|
4864
4886
|
const handleTimeUpdate = () => {
|
|
4865
4887
|
if (videoElement.duration && !isNaN(videoElement.duration) && videoElement.duration > 0) {
|
|
4866
4888
|
const pct = videoElement.currentTime / videoElement.duration * 100;
|
|
@@ -4869,10 +4891,12 @@ var init_Slider = __esm({
|
|
|
4869
4891
|
};
|
|
4870
4892
|
const handleVideoEnded = () => {
|
|
4871
4893
|
setVideoProgress(100);
|
|
4872
|
-
|
|
4894
|
+
nextSlideRef.current();
|
|
4873
4895
|
};
|
|
4874
4896
|
const handleVideoError = () => {
|
|
4875
|
-
|
|
4897
|
+
if (videoElement.error) {
|
|
4898
|
+
nextSlideRef.current();
|
|
4899
|
+
}
|
|
4876
4900
|
};
|
|
4877
4901
|
videoElement.addEventListener("timeupdate", handleTimeUpdate);
|
|
4878
4902
|
videoElement.addEventListener("loadedmetadata", handleTimeUpdate);
|
|
@@ -4889,7 +4913,7 @@ var init_Slider = __esm({
|
|
|
4889
4913
|
}
|
|
4890
4914
|
const timer = setInterval(() => {
|
|
4891
4915
|
if (isPlaying) {
|
|
4892
|
-
|
|
4916
|
+
nextSlideRef.current();
|
|
4893
4917
|
}
|
|
4894
4918
|
}, autoplay_speed);
|
|
4895
4919
|
return () => clearInterval(timer);
|
|
@@ -4928,6 +4952,7 @@ var init_Slider = __esm({
|
|
|
4928
4952
|
setCurrentSlide(slidePositions[currentStepIndex + 1]);
|
|
4929
4953
|
}
|
|
4930
4954
|
};
|
|
4955
|
+
nextSlideRef.current = nextSlide;
|
|
4931
4956
|
const prevSlide = () => {
|
|
4932
4957
|
if (currentStepIndex <= 0) {
|
|
4933
4958
|
if (infinite_scroll) {
|
package/dist/server.mjs
CHANGED
|
@@ -2507,7 +2507,7 @@ var Pagination = dynamic15(() => import("./Pagination-RMAXCIL7.mjs"), { ssr: tru
|
|
|
2507
2507
|
var DataBindingControls = dynamic15(() => import("./DataBindingControls-Z2AHWFYX.mjs"), {
|
|
2508
2508
|
ssr: true
|
|
2509
2509
|
});
|
|
2510
|
-
var Slider = dynamic15(() => import("./Slider-
|
|
2510
|
+
var Slider = dynamic15(() => import("./Slider-5VE2T2QN.mjs"), {
|
|
2511
2511
|
ssr: false
|
|
2512
2512
|
});
|
|
2513
2513
|
function toCamelCase(str) {
|