@acoustte-digital-services/digitalstore-controls-dev 0.8.1-dev.20260604041835 → 0.8.1-dev.20260604044508

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-DPFBQY2N.mjs";
4
+ } from "./chunk-SDNYBQSI.mjs";
5
5
  export {
6
6
  HlsPlayer_default as default
7
7
  };
@@ -370,32 +370,66 @@ var HlsPlayer = React.memo(
370
370
  transform: scale(1.08);
371
371
  }
372
372
  ` }),
373
- isBuffering && /* @__PURE__ */ jsx(
373
+ isBuffering && /* @__PURE__ */ jsxs(
374
374
  "div",
375
375
  {
376
376
  className: "absolute inset-0 flex items-center justify-center pointer-events-none",
377
377
  style: { zIndex: 10 },
378
- children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
378
+ children: [
379
379
  /* @__PURE__ */ jsx("style", { children: `
380
- @keyframes hls-bounce {
381
- 0%, 80%, 100% { transform: translateY(0); opacity: 0.5; }
382
- 40% { transform: translateY(-10px); opacity: 1; }
383
- }
384
- .hls-dot {
385
- width: clamp(8px, 1.5vmin, 12px);
386
- height: clamp(8px, 1.5vmin, 12px);
387
- border-radius: 50%;
388
- background: white;
389
- animation: hls-bounce 1.1s ease-in-out infinite;
390
- }
391
- .hls-dot:nth-child(1) { animation-delay: 0s; }
392
- .hls-dot:nth-child(2) { animation-delay: 0.18s; }
393
- .hls-dot:nth-child(3) { animation-delay: 0.36s; }
394
- ` }),
395
- /* @__PURE__ */ jsx("div", { className: "hls-dot" }),
396
- /* @__PURE__ */ jsx("div", { className: "hls-dot" }),
397
- /* @__PURE__ */ jsx("div", { className: "hls-dot" })
398
- ] })
380
+ @keyframes hls-spin {
381
+ to { transform: rotate(360deg); }
382
+ }
383
+ .hls-spinner {
384
+ animation: hls-spin 1s linear infinite;
385
+ filter: drop-shadow(0 0 6px rgba(243, 31, 73, 0.7))
386
+ drop-shadow(0 0 12px rgba(143, 38, 237, 0.5));
387
+ }
388
+ ` }),
389
+ /* @__PURE__ */ jsxs(
390
+ "svg",
391
+ {
392
+ className: "hls-spinner",
393
+ width: "clamp(44px, 8vmin, 72px)",
394
+ height: "clamp(44px, 8vmin, 72px)",
395
+ viewBox: "0 0 72 72",
396
+ fill: "none",
397
+ xmlns: "http://www.w3.org/2000/svg",
398
+ children: [
399
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "hls-arc-grad", x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
400
+ /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "rgba(243,31,73,0)" }),
401
+ /* @__PURE__ */ jsx("stop", { offset: "40%", stopColor: "rgba(243,31,73,1)" }),
402
+ /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "rgba(143,38,237,1)" })
403
+ ] }) }),
404
+ Array.from({ length: 18 }).map((_, i) => {
405
+ const angle = i / 18 * 360;
406
+ const opacity = 0.15 + i / 17 * 0.85;
407
+ const rad = (angle - 90) * (Math.PI / 180);
408
+ const r = 30;
409
+ const cx = 36 + r * Math.cos(rad);
410
+ const cy = 36 + r * Math.sin(rad);
411
+ const t = i / 17;
412
+ const r1 = Math.round(243 * (1 - t) + 143 * t);
413
+ const g1 = Math.round(31 * (1 - t) + 38 * t);
414
+ const b1 = Math.round(73 * (1 - t) + 237 * t);
415
+ return /* @__PURE__ */ jsx(
416
+ "rect",
417
+ {
418
+ x: cx - 2.2,
419
+ y: cy - 5.5,
420
+ width: 4.4,
421
+ height: 11,
422
+ rx: 2.2,
423
+ fill: `rgba(${r1},${g1},${b1},${opacity})`,
424
+ transform: `rotate(${angle}, ${cx}, ${cy})`
425
+ },
426
+ i
427
+ );
428
+ })
429
+ ]
430
+ }
431
+ )
432
+ ]
399
433
  }
400
434
  ),
401
435
  !isPlayOnHover && !isBuffering && /* @__PURE__ */ jsx(
package/dist/index.js CHANGED
@@ -534,32 +534,66 @@ var init_HlsPlayer = __esm({
534
534
  transform: scale(1.08);
535
535
  }
536
536
  ` }),
537
- isBuffering && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
537
+ isBuffering && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
538
538
  "div",
539
539
  {
540
540
  className: "absolute inset-0 flex items-center justify-center pointer-events-none",
541
541
  style: { zIndex: 10 },
542
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
542
+ children: [
543
543
  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("style", { children: `
544
- @keyframes hls-bounce {
545
- 0%, 80%, 100% { transform: translateY(0); opacity: 0.5; }
546
- 40% { transform: translateY(-10px); opacity: 1; }
547
- }
548
- .hls-dot {
549
- width: clamp(8px, 1.5vmin, 12px);
550
- height: clamp(8px, 1.5vmin, 12px);
551
- border-radius: 50%;
552
- background: white;
553
- animation: hls-bounce 1.1s ease-in-out infinite;
554
- }
555
- .hls-dot:nth-child(1) { animation-delay: 0s; }
556
- .hls-dot:nth-child(2) { animation-delay: 0.18s; }
557
- .hls-dot:nth-child(3) { animation-delay: 0.36s; }
558
- ` }),
559
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "hls-dot" }),
560
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "hls-dot" }),
561
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "hls-dot" })
562
- ] })
544
+ @keyframes hls-spin {
545
+ to { transform: rotate(360deg); }
546
+ }
547
+ .hls-spinner {
548
+ animation: hls-spin 1s linear infinite;
549
+ filter: drop-shadow(0 0 6px rgba(243, 31, 73, 0.7))
550
+ drop-shadow(0 0 12px rgba(143, 38, 237, 0.5));
551
+ }
552
+ ` }),
553
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
554
+ "svg",
555
+ {
556
+ className: "hls-spinner",
557
+ width: "clamp(44px, 8vmin, 72px)",
558
+ height: "clamp(44px, 8vmin, 72px)",
559
+ viewBox: "0 0 72 72",
560
+ fill: "none",
561
+ xmlns: "http://www.w3.org/2000/svg",
562
+ children: [
563
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("linearGradient", { id: "hls-arc-grad", x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
564
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { offset: "0%", stopColor: "rgba(243,31,73,0)" }),
565
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { offset: "40%", stopColor: "rgba(243,31,73,1)" }),
566
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("stop", { offset: "100%", stopColor: "rgba(143,38,237,1)" })
567
+ ] }) }),
568
+ Array.from({ length: 18 }).map((_, i) => {
569
+ const angle = i / 18 * 360;
570
+ const opacity = 0.15 + i / 17 * 0.85;
571
+ const rad = (angle - 90) * (Math.PI / 180);
572
+ const r = 30;
573
+ const cx = 36 + r * Math.cos(rad);
574
+ const cy = 36 + r * Math.sin(rad);
575
+ const t = i / 17;
576
+ const r1 = Math.round(243 * (1 - t) + 143 * t);
577
+ const g1 = Math.round(31 * (1 - t) + 38 * t);
578
+ const b1 = Math.round(73 * (1 - t) + 237 * t);
579
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
580
+ "rect",
581
+ {
582
+ x: cx - 2.2,
583
+ y: cy - 5.5,
584
+ width: 4.4,
585
+ height: 11,
586
+ rx: 2.2,
587
+ fill: `rgba(${r1},${g1},${b1},${opacity})`,
588
+ transform: `rotate(${angle}, ${cx}, ${cy})`
589
+ },
590
+ i
591
+ );
592
+ })
593
+ ]
594
+ }
595
+ )
596
+ ]
563
597
  }
564
598
  ),
565
599
  !isPlayOnHover && !isBuffering && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  HlsPlayer_default
3
- } from "./chunk-DPFBQY2N.mjs";
3
+ } from "./chunk-SDNYBQSI.mjs";
4
4
  import {
5
5
  Button_default,
6
6
  ClientButton_default,
@@ -2055,7 +2055,7 @@ import React30 from "react";
2055
2055
  // src/components/pageRenderingEngine/nodes/ImageNode.tsx
2056
2056
  import dynamic3 from "next/dynamic";
2057
2057
  import { jsx as jsx39 } from "react/jsx-runtime";
2058
- var HlsPlayer = dynamic3(() => import("./HlsPlayer-JXH6KK7T.mjs"), { ssr: false });
2058
+ var HlsPlayer = dynamic3(() => import("./HlsPlayer-DZNDKG2P.mjs"), { ssr: false });
2059
2059
  var getNestedValue = (obj, path) => {
2060
2060
  if (!obj || !path) return void 0;
2061
2061
  return path.split(".").reduce((current, key) => {
@@ -3715,7 +3715,7 @@ var Pagination_default = Pagination;
3715
3715
  // src/components/pageRenderingEngine/nodes/ImageGalleryNode.tsx
3716
3716
  import dynamic7 from "next/dynamic";
3717
3717
  import { Fragment as Fragment7, jsx as jsx58, jsxs as jsxs31 } from "react/jsx-runtime";
3718
- var HlsPlayer2 = dynamic7(() => import("./HlsPlayer-JXH6KK7T.mjs"), { ssr: false });
3718
+ var HlsPlayer2 = dynamic7(() => import("./HlsPlayer-DZNDKG2P.mjs"), { ssr: false });
3719
3719
  var deviceToMediaQuery = (device) => {
3720
3720
  switch (device) {
3721
3721
  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.20260604041835",
3
+ "version": "0.8.1-dev.20260604044508",
4
4
  "description": "Reusable React components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",