@geekapps/silo-elements-nextjs 0.2.41 → 0.2.43

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.
Files changed (7) hide show
  1. package/dist/VideoPlayer.js +22 -17
  2. package/dist/VideoPlayer.js.map +1 -1
  3. package/dist/index.js +22 -17
  4. package/dist/index.js.map +1 -1
  5. package/dist/styles.css +1 -1
  6. package/package.json +1 -1
  7. package/styles.css +1 -1
package/dist/index.js CHANGED
@@ -1224,7 +1224,6 @@ function Video({
1224
1224
  const [isFullscreen, setIsFullscreen] = useState(false);
1225
1225
  const [playerHeight, setPlayerHeight] = useState(0);
1226
1226
  const [playerWidth, setPlayerWidth] = useState(0);
1227
- const [error, setError] = useState(null);
1228
1227
  const activeSource = parsed.sources[sourceIndex] ?? parsed.sources[0] ?? null;
1229
1228
  const progressPercent = duration ? currentTime / duration * 100 : 0;
1230
1229
  const bufferedPercent = duration ? bufferedTime / duration * 100 : 0;
@@ -1495,7 +1494,6 @@ function Video({
1495
1494
  return;
1496
1495
  }
1497
1496
  destroyMediaEngines();
1498
- setError(null);
1499
1497
  setIsLoading(true);
1500
1498
  setCurrentTime(0);
1501
1499
  setBufferedTime(0);
@@ -1540,13 +1538,13 @@ function Video({
1540
1538
  setIsLoading(false);
1541
1539
  });
1542
1540
  dash.on(dashjs.MediaPlayer.events.ERROR, () => {
1543
- setError("N\xE3o foi poss\xEDvel reproduzir o stream MPEG-DASH.");
1541
+ console.error("[Silo] MPEG-DASH playback failed");
1544
1542
  setIsLoading(false);
1545
1543
  });
1546
1544
  dash.initialize(video, activeSource.src, false);
1547
1545
  } catch {
1548
1546
  if (!cancelled) {
1549
- setError("N\xE3o foi poss\xEDvel carregar o player MPEG-DASH.");
1547
+ console.error("[Silo] MPEG-DASH player load failed");
1550
1548
  setIsLoading(false);
1551
1549
  }
1552
1550
  }
@@ -1612,7 +1610,7 @@ function Video({
1612
1610
  hls.recoverMediaError();
1613
1611
  return;
1614
1612
  }
1615
- setError("N\xE3o foi poss\xEDvel reproduzir o stream HLS.");
1613
+ console.error("[Silo] HLS playback failed");
1616
1614
  setIsLoading(false);
1617
1615
  });
1618
1616
  return;
@@ -1623,11 +1621,11 @@ function Video({
1623
1621
  setIsLoading(false);
1624
1622
  return;
1625
1623
  }
1626
- setError("Este navegador n\xE3o suporta HLS.");
1624
+ console.error("[Silo] HLS not supported in this browser");
1627
1625
  setIsLoading(false);
1628
1626
  } catch {
1629
1627
  if (!cancelled) {
1630
- setError("N\xE3o foi poss\xEDvel carregar o player HLS.");
1628
+ console.error("[Silo] HLS player load failed");
1631
1629
  setIsLoading(false);
1632
1630
  }
1633
1631
  }
@@ -1649,9 +1647,18 @@ function Video({
1649
1647
  const togglePlay = useCallback(async () => {
1650
1648
  const video = videoRef.current;
1651
1649
  if (!video) return;
1650
+ const wasPaused = video.paused;
1652
1651
  try {
1653
- const wasPaused = video.paused;
1654
1652
  if (wasPaused) {
1653
+ if (video.readyState < HTMLMediaElement.HAVE_FUTURE_DATA) {
1654
+ await new Promise((resolve) => {
1655
+ const onReady = () => {
1656
+ video.removeEventListener("canplay", onReady);
1657
+ resolve();
1658
+ };
1659
+ video.addEventListener("canplay", onReady);
1660
+ });
1661
+ }
1655
1662
  await video.play();
1656
1663
  } else {
1657
1664
  video.pause();
@@ -1664,7 +1671,6 @@ function Video({
1664
1671
  600
1665
1672
  );
1666
1673
  } catch {
1667
- setError("O navegador bloqueou a reprodu\xE7\xE3o autom\xE1tica.");
1668
1674
  }
1669
1675
  }, []);
1670
1676
  const seekRelative = useCallback((seconds) => {
@@ -1718,7 +1724,7 @@ function Video({
1718
1724
  }
1719
1725
  throw new Error("Fullscreen unavailable");
1720
1726
  } catch {
1721
- setError("N\xE3o foi poss\xEDvel alterar o modo fullscreen.");
1727
+ console.error("[Silo] Fullscreen toggle failed");
1722
1728
  }
1723
1729
  }, []);
1724
1730
  const changeAudio = useCallback((trackId) => {
@@ -1943,17 +1949,16 @@ function Video({
1943
1949
  opacity: clickIcon ? 1 : 0,
1944
1950
  transition: clickIcon ? "opacity 0.08s ease-in" : "opacity 0.45s ease-out"
1945
1951
  },
1946
- children: /* @__PURE__ */ jsx("span", { className: "grid size-10 place-items-center text-white drop-shadow-[0_2px_12px_rgba(0,0,0,0.8)] @sm:size-14 @lg:size-16", children: clickIcon === "pause" ? /* @__PURE__ */ jsx(Pause, { className: "size-5 @sm:size-7 @lg:size-8", fill: "white" }) : /* @__PURE__ */ jsx(
1952
+ children: /* @__PURE__ */ jsx("span", { className: "grid size-10 place-items-center text-white drop-shadow-[0_2px_12px_rgba(0,0,0,0.8)] @sm:size-14 @lg:size-16", children: clickIcon === "pause" ? /* @__PURE__ */ jsx(Pause, { className: "size-7 @sm:size-9 @lg:size-11", fill: "white" }) : /* @__PURE__ */ jsx(
1947
1953
  Play,
1948
1954
  {
1949
- className: "ml-0.5 size-5 @sm:size-7 @lg:size-8",
1955
+ className: "ml-0.5 size-7 @sm:size-9 @lg:size-11",
1950
1956
  fill: "white"
1951
1957
  }
1952
1958
  ) })
1953
1959
  }
1954
1960
  ),
1955
1961
  isLoading && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 z-20 grid place-items-center bg-black/10", children: /* @__PURE__ */ jsx("div", { className: "size-9 animate-spin rounded-full border-2 border-white/25 border-t-white" }) }),
1956
- error && /* @__PURE__ */ jsx("div", { className: "absolute inset-x-8 top-1/2 z-40 -translate-y-1/2 rounded-2xl border border-white/10 bg-black/75 p-5 text-center text-sm text-white shadow-2xl backdrop-blur-xl", children: error }),
1957
1962
  /* @__PURE__ */ jsxs(
1958
1963
  "div",
1959
1964
  {
@@ -2112,7 +2117,7 @@ function Video({
2112
2117
  /* @__PURE__ */ jsx(
2113
2118
  "svg",
2114
2119
  {
2115
- className: `size-4 shrink-0${selectedQuality === quality.id ? "text-white" : "text-transparent"}`,
2120
+ className: `size-4 shrink-0 ${selectedQuality === quality.id ? "text-white" : "text-transparent"}`,
2116
2121
  viewBox: "0 0 16 16",
2117
2122
  fill: "none",
2118
2123
  children: /* @__PURE__ */ jsx(
@@ -2192,7 +2197,7 @@ function Video({
2192
2197
  /* @__PURE__ */ jsx(
2193
2198
  "svg",
2194
2199
  {
2195
- className: `size-4 shrink-0${subtitleStyle.track === s.srclang ? "text-white" : "text-transparent"}`,
2200
+ className: `size-4 shrink-0 ${subtitleStyle.track === s.srclang ? "text-white" : "text-transparent"}`,
2196
2201
  viewBox: "0 0 16 16",
2197
2202
  fill: "none",
2198
2203
  children: /* @__PURE__ */ jsx(
@@ -2375,7 +2380,7 @@ function Video({
2375
2380
  /* @__PURE__ */ jsx(
2376
2381
  "svg",
2377
2382
  {
2378
- className: `size-4 shrink-0${selectedAudio === track.id ? "text-white" : "text-transparent"}`,
2383
+ className: `size-4 shrink-0 ${selectedAudio === track.id ? "text-white" : "text-transparent"}`,
2379
2384
  viewBox: "0 0 16 16",
2380
2385
  fill: "none",
2381
2386
  children: /* @__PURE__ */ jsx(
@@ -2446,7 +2451,7 @@ function Video({
2446
2451
  /* @__PURE__ */ jsx(
2447
2452
  "svg",
2448
2453
  {
2449
- className: `size-4 shrink-0${playbackRate === speed ? "text-white" : "text-transparent"}`,
2454
+ className: `size-4 shrink-0 ${playbackRate === speed ? "text-white" : "text-transparent"}`,
2450
2455
  viewBox: "0 0 16 16",
2451
2456
  fill: "none",
2452
2457
  children: /* @__PURE__ */ jsx(