@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260502051234 → 0.8.1-dev.20260502120507

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.
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  HlsPlayer_default
4
- } from "./chunk-TMQZ6HXG.mjs";
4
+ } from "./chunk-FRNG2H5Y.mjs";
5
5
  export {
6
6
  HlsPlayer_default as default
7
7
  };
@@ -2,6 +2,12 @@
2
2
  import React, { useRef, useEffect, useState, useCallback } from "react";
3
3
  import Hls from "hls.js";
4
4
  import { jsx, jsxs } from "react/jsx-runtime";
5
+ var pickSource = (sources) => {
6
+ for (const { src, media } of sources) {
7
+ if (media && window.matchMedia(media).matches) return src;
8
+ }
9
+ return sources.find((s) => !s.media)?.src ?? sources[0]?.src ?? "";
10
+ };
5
11
  var HlsPlayer = React.memo(
6
12
  ({
7
13
  sources,
@@ -42,19 +48,13 @@ var HlsPlayer = React.memo(
42
48
  return () => window.removeEventListener("resize", checkMobile);
43
49
  }, []);
44
50
  useEffect(() => {
45
- const v = videoRef.current;
46
- if (!v) return;
47
- const onPlaying = () => setIsPosterVisible(false);
48
- const onPause = () => {
49
- if (v.currentTime === 0) setIsPosterVisible(true);
50
- };
51
- v.addEventListener("playing", onPlaying);
52
- v.addEventListener("pause", onPause);
53
- return () => {
54
- v.removeEventListener("playing", onPlaying);
55
- v.removeEventListener("pause", onPause);
56
- };
57
- }, []);
51
+ if (isPlaying) {
52
+ setIsPosterVisible(false);
53
+ } else {
54
+ const v = videoRef.current;
55
+ if (!v || v.currentTime === 0) setIsPosterVisible(true);
56
+ }
57
+ }, [isPlaying]);
58
58
  const resetInactivityTimer = useCallback(() => {
59
59
  setIsControlsVisible(true);
60
60
  if (inactivityTimerRef.current) clearTimeout(inactivityTimerRef.current);
@@ -83,28 +83,24 @@ var HlsPlayer = React.memo(
83
83
  hlsRef.current.destroy();
84
84
  hlsRef.current = null;
85
85
  }
86
+ const chosenSrc = pickSource(resolvedSources);
87
+ if (!chosenSrc) return;
86
88
  if (Hls.isSupported()) {
87
89
  const hls = new Hls();
88
- const onLoadStart = () => {
89
- const chosenSrc = v.currentSrc;
90
- if (!chosenSrc) return;
91
- hls.loadSource(chosenSrc);
92
- hls.attachMedia(v);
93
- hls.on(Hls.Events.MANIFEST_PARSED, () => {
94
- if (isPlaying && !wasManuallyPausedRef.current) {
95
- v.play().catch(console.error);
96
- }
97
- });
98
- };
99
- v.addEventListener("loadstart", onLoadStart, { once: true });
100
- v.load();
90
+ hls.loadSource(chosenSrc);
91
+ hls.attachMedia(v);
92
+ hls.on(Hls.Events.MANIFEST_PARSED, () => {
93
+ if (isPlaying && !wasManuallyPausedRef.current) {
94
+ v.play().catch(console.error);
95
+ }
96
+ });
101
97
  hlsRef.current = hls;
102
98
  return () => {
103
- v.removeEventListener("loadstart", onLoadStart);
104
99
  hls.destroy();
105
100
  hlsRef.current = null;
106
101
  };
107
102
  } else if (v.canPlayType("application/vnd.apple.mpegurl")) {
103
+ v.src = chosenSrc;
108
104
  v.load();
109
105
  }
110
106
  }, [JSON.stringify(resolvedSources)]);
@@ -229,7 +225,8 @@ var HlsPlayer = React.memo(
229
225
  width: intrinsicWidth,
230
226
  height: intrinsicHeight,
231
227
  alt: "poster",
232
- className: "w-full h-full object-cover"
228
+ className: "w-full h-full object-cover",
229
+ style: { pointerEvents: "none" }
233
230
  }
234
231
  )
235
232
  ]
@@ -283,21 +280,15 @@ var HlsPlayer = React.memo(
283
280
  style: overlayButtonStyle,
284
281
  onMouseEnter: handleButtonMouseEnter,
285
282
  onMouseLeave: handleButtonMouseLeave,
286
- children: isMuted ? (
287
- /* Muted speaker with an X */
288
- /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
289
- /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
290
- /* @__PURE__ */ jsx("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
291
- /* @__PURE__ */ jsx("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
292
- ] })
293
- ) : (
294
- /* Unmuted — speaker with sound waves */
295
- /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
296
- /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
297
- /* @__PURE__ */ jsx("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
298
- /* @__PURE__ */ jsx("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
299
- ] })
300
- )
283
+ children: isMuted ? /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
284
+ /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
285
+ /* @__PURE__ */ jsx("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
286
+ /* @__PURE__ */ jsx("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
287
+ ] }) : /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
288
+ /* @__PURE__ */ jsx("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
289
+ /* @__PURE__ */ jsx("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
290
+ /* @__PURE__ */ jsx("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
291
+ ] })
301
292
  }
302
293
  )
303
294
  }
package/dist/index.js CHANGED
@@ -520,7 +520,7 @@ var HlsPlayer_exports = {};
520
520
  __export(HlsPlayer_exports, {
521
521
  default: () => HlsPlayer_default
522
522
  });
523
- var import_react32, import_hls, import_jsx_runtime41, HlsPlayer, HlsPlayer_default;
523
+ var import_react32, import_hls, import_jsx_runtime41, pickSource, HlsPlayer, HlsPlayer_default;
524
524
  var init_HlsPlayer = __esm({
525
525
  "src/components/HlsPlayer.tsx"() {
526
526
  "use strict";
@@ -528,6 +528,12 @@ var init_HlsPlayer = __esm({
528
528
  import_react32 = __toESM(require("react"));
529
529
  import_hls = __toESM(require("hls.js"));
530
530
  import_jsx_runtime41 = require("react/jsx-runtime");
531
+ pickSource = (sources) => {
532
+ for (const { src, media } of sources) {
533
+ if (media && window.matchMedia(media).matches) return src;
534
+ }
535
+ return sources.find((s) => !s.media)?.src ?? sources[0]?.src ?? "";
536
+ };
531
537
  HlsPlayer = import_react32.default.memo(
532
538
  ({
533
539
  sources,
@@ -568,19 +574,13 @@ var init_HlsPlayer = __esm({
568
574
  return () => window.removeEventListener("resize", checkMobile);
569
575
  }, []);
570
576
  (0, import_react32.useEffect)(() => {
571
- const v = videoRef.current;
572
- if (!v) return;
573
- const onPlaying = () => setIsPosterVisible(false);
574
- const onPause = () => {
575
- if (v.currentTime === 0) setIsPosterVisible(true);
576
- };
577
- v.addEventListener("playing", onPlaying);
578
- v.addEventListener("pause", onPause);
579
- return () => {
580
- v.removeEventListener("playing", onPlaying);
581
- v.removeEventListener("pause", onPause);
582
- };
583
- }, []);
577
+ if (isPlaying) {
578
+ setIsPosterVisible(false);
579
+ } else {
580
+ const v = videoRef.current;
581
+ if (!v || v.currentTime === 0) setIsPosterVisible(true);
582
+ }
583
+ }, [isPlaying]);
584
584
  const resetInactivityTimer = (0, import_react32.useCallback)(() => {
585
585
  setIsControlsVisible(true);
586
586
  if (inactivityTimerRef.current) clearTimeout(inactivityTimerRef.current);
@@ -609,28 +609,24 @@ var init_HlsPlayer = __esm({
609
609
  hlsRef.current.destroy();
610
610
  hlsRef.current = null;
611
611
  }
612
+ const chosenSrc = pickSource(resolvedSources);
613
+ if (!chosenSrc) return;
612
614
  if (import_hls.default.isSupported()) {
613
615
  const hls = new import_hls.default();
614
- const onLoadStart = () => {
615
- const chosenSrc = v.currentSrc;
616
- if (!chosenSrc) return;
617
- hls.loadSource(chosenSrc);
618
- hls.attachMedia(v);
619
- hls.on(import_hls.default.Events.MANIFEST_PARSED, () => {
620
- if (isPlaying && !wasManuallyPausedRef.current) {
621
- v.play().catch(console.error);
622
- }
623
- });
624
- };
625
- v.addEventListener("loadstart", onLoadStart, { once: true });
626
- v.load();
616
+ hls.loadSource(chosenSrc);
617
+ hls.attachMedia(v);
618
+ hls.on(import_hls.default.Events.MANIFEST_PARSED, () => {
619
+ if (isPlaying && !wasManuallyPausedRef.current) {
620
+ v.play().catch(console.error);
621
+ }
622
+ });
627
623
  hlsRef.current = hls;
628
624
  return () => {
629
- v.removeEventListener("loadstart", onLoadStart);
630
625
  hls.destroy();
631
626
  hlsRef.current = null;
632
627
  };
633
628
  } else if (v.canPlayType("application/vnd.apple.mpegurl")) {
629
+ v.src = chosenSrc;
634
630
  v.load();
635
631
  }
636
632
  }, [JSON.stringify(resolvedSources)]);
@@ -755,7 +751,8 @@ var init_HlsPlayer = __esm({
755
751
  width: intrinsicWidth,
756
752
  height: intrinsicHeight,
757
753
  alt: "poster",
758
- className: "w-full h-full object-cover"
754
+ className: "w-full h-full object-cover",
755
+ style: { pointerEvents: "none" }
759
756
  }
760
757
  )
761
758
  ]
@@ -809,21 +806,15 @@ var init_HlsPlayer = __esm({
809
806
  style: overlayButtonStyle,
810
807
  onMouseEnter: handleButtonMouseEnter,
811
808
  onMouseLeave: handleButtonMouseLeave,
812
- children: isMuted ? (
813
- /* Muted speaker with an X */
814
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
815
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
816
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
817
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
818
- ] })
819
- ) : (
820
- /* Unmuted — speaker with sound waves */
821
- /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
822
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
823
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
824
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
825
- ] })
826
- )
809
+ children: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
810
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
811
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "23", y1: "9", x2: "17", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
812
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("line", { x1: "17", y1: "9", x2: "23", y2: "15", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
813
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
814
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M11 5L6 9H2v6h4l5 4V5Z", fill: "white" }),
815
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }),
816
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })
817
+ ] })
827
818
  }
828
819
  )
829
820
  }
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  HlsPlayer_default
3
- } from "./chunk-TMQZ6HXG.mjs";
3
+ } from "./chunk-FRNG2H5Y.mjs";
4
4
  import {
5
5
  Button_default,
6
6
  ClientButton_default,
@@ -1963,7 +1963,7 @@ var DeviceAssetSelector_default = DeviceAssetSelector;
1963
1963
 
1964
1964
  // src/components/pageRenderingEngine/nodes/ImageNode.tsx
1965
1965
  import { Fragment as Fragment2, jsx as jsx37 } from "react/jsx-runtime";
1966
- var HlsPlayer = dynamic2(() => import("./HlsPlayer-SL6K74P3.mjs"), {
1966
+ var HlsPlayer = dynamic2(() => import("./HlsPlayer-ZPLOKA4L.mjs"), {
1967
1967
  ssr: false
1968
1968
  });
1969
1969
  var getNestedValue = (obj, path) => {
@@ -3645,7 +3645,7 @@ var Pagination_default = Pagination;
3645
3645
  // src/components/pageRenderingEngine/nodes/ImageGalleryNode.tsx
3646
3646
  import dynamic6 from "next/dynamic";
3647
3647
  import { Fragment as Fragment8, jsx as jsx56, jsxs as jsxs31 } from "react/jsx-runtime";
3648
- var HlsPlayer2 = dynamic6(() => import("./HlsPlayer-SL6K74P3.mjs"), { ssr: false });
3648
+ var HlsPlayer2 = dynamic6(() => import("./HlsPlayer-ZPLOKA4L.mjs"), { ssr: false });
3649
3649
  var deviceToMediaQuery = (device) => {
3650
3650
  switch (device) {
3651
3651
  case "sm":
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@acoustte-digital-services/digitalstore-controls-dev",
3
- "version": "0.8.1-dev.20260502051234",
3
+ "version": "0.8.1-dev.20260502120507",
4
4
  "description": "Reusable React components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",