markdown-flow-ui 0.1.108-beta.2 → 0.1.108-beta.4

package/dist/components/Slide/Player.es.js

@@ -1,24 +1,26 @@
 import { j as r } from "../../_virtual/jsx-runtime.es.js";
-import Ye, { memo as Ge, useRef as a, useState as we, useMemo as H, useEffect as b, useCallback as l } from "react";
-import { cn as Me } from "../../lib/utils.es.js";
-import Je from "./MobilePlayerSettingsSheet.es.js";
-import { DEFAULT_SLIDE_PLAYER_TEXTS as Qe } from "./constants.es.js";
-import { DEFAULT_MOBILE_VIEW_MODE as Ie } from "./utils/mobileScreenMode.es.js";
-import { toPlayerCustomActionList as er } from "./utils/playerCustomActions.es.js";
+import Qe, { memo as Ie, useRef as c, useState as ke, useMemo as H, useEffect as b, useCallback as l } from "react";
+import { cn as Ae } from "../../lib/utils.es.js";
+import er from "./MobilePlayerSettingsSheet.es.js";
+import { DEFAULT_SLIDE_PLAYER_TEXTS as rr } from "./constants.es.js";
+import { DEFAULT_MOBILE_VIEW_MODE as tr } from "./utils/mobileScreenMode.es.js";
+import { toPlayerCustomActionList as nr } from "./utils/playerCustomActions.es.js";
 /* empty css              */
-import rr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/ellipsis-vertical.es.js";
-import tr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/volume-2.es.js";
-import nr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/rotate-ccw.es.js";
-import ur from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/rotate-cw.es.js";
-import lr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/scan-line.es.js";
-import sr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/maximize.es.js";
-import cr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/file-pen-line.es.js";
-const je = /* @__PURE__ */ new Map(), Ee = (N) => {
-  if (typeof window > "u" || !N || je.has(N))
+import sr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/ellipsis-vertical.es.js";
+import lr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/volume-2.es.js";
+import ur from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/captions.es.js";
+import ar from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/captions-off.es.js";
+import cr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/rotate-ccw.es.js";
+import ir from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/rotate-cw.es.js";
+import or from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/scan-line.es.js";
+import fr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/maximize.es.js";
+import dr from "../../markdown-flow-ui/node_modules/.pnpm/lucide-react@0.525.0_react@19.0.1/node_modules/lucide-react/dist/esm/icons/file-pen-line.es.js";
+const Ee = /* @__PURE__ */ new Map(), Ne = (R) => {
+  if (typeof window > "u" || !R || Ee.has(R))
     return;
-  const C = window.document.createElement("audio");
-  C.preload = "auto", C.setAttribute("playsinline", "true"), C.src = N, C.load(), je.set(N, C);
-}, ar = () => /* @__PURE__ */ r.jsxs(
+  const v = window.document.createElement("audio");
+  v.preload = "auto", v.setAttribute("playsinline", "true"), v.src = R, v.load(), Ee.set(R, v);
+}, mr = () => /* @__PURE__ */ r.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -37,7 +39,7 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
       /* @__PURE__ */ r.jsx("path", { d: "M12 10H16V24H12V10ZM18 10H22V24H18V10Z", fill: "white" })
     ]
   }
-), or = () => /* @__PURE__ */ r.jsxs(
+), pr = () => /* @__PURE__ */ r.jsxs(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -56,100 +58,103 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
       /* @__PURE__ */ r.jsx("path", { d: "M13.3333 10L23.3333 16.6667L13.3333 23.3333V10Z", fill: "white" })
     ]
   }
-), ir = ({
-  audioList: N = [],
-  className: C,
+), hr = ({
+  audioList: R = [],
+  className: v,
   currentAudioIndex: m = -1,
-  defaultPlaying: M = !0,
+  defaultPlaying: j = !0,
   isPlaybackPaused: L = !1,
   isAutoAdvanceEnabled: Y = !0,
   useAutoAdvanceToggle: G = !1,
-  onLoadingChange: re,
-  onPlaybackTimeChange: O,
-  onPrev: ke,
-  onNext: Ae,
-  onFullscreen: te,
-  isFullscreen: ne = !1,
-  mobileViewMode: Re = Ie,
-  settingsPortalContainer: Ne,
-  onMobileViewModeChange: ue,
-  onEnded: le,
-  onAutoAdvanceToggle: ve,
-  onInteractionToggle: Te,
-  hasInteraction: Ce = !1,
-  isInteractionOpen: K = !1,
-  prevDisabled: Le = !1,
-  nextDisabled: Ue = !1,
-  showControls: J = !0,
-  customActions: se,
-  customActionContext: ce,
-  texts: ae,
-  ...Fe
+  onLoadingChange: te,
+  onPlaybackStarted: ne,
+  onPlaybackTimeChange: q,
+  onSubtitleToggle: se,
+  onPrev: Re,
+  onNext: Te,
+  onFullscreen: le,
+  isFullscreen: ue = !1,
+  mobileViewMode: Ce = tr,
+  settingsPortalContainer: ve,
+  onMobileViewModeChange: ae,
+  onEnded: ce,
+  onAutoAdvanceToggle: Le,
+  onInteractionToggle: Ue,
+  hasInteraction: Fe = !1,
+  isInteractionOpen: O = !1,
+  isSubtitleEnabled: J = !0,
+  prevDisabled: Pe = !1,
+  nextDisabled: We = !1,
+  showControls: Q = !0,
+  customActions: ie,
+  customActionContext: oe,
+  texts: fe,
+  ...Ve
 }) => {
-  const h = a(null), oe = a(K), j = a(null), ie = a(null), S = a(0), c = a(null), q = a(void 0), E = a([]), Z = a(!1), fe = a(!1), y = a(!1), U = a(null), x = a(!1), u = a(!1), p = a(null), w = a(!1), F = a(null), Q = a(0), v = a("unknown"), [I, o] = we(M), [de, W] = we(!1), f = m >= 0 ? N[m] : void 0, B = f?.audioUrl, Pe = f?.element?.subtitle_cues ?? [], k = H(
+  const h = c(null), de = c(O), M = c(null), me = c(null), x = c(0), a = c(null), z = c(void 0), k = c([]), Z = c(!1), pe = c(!1), y = c(!1), U = c(null), S = c(!1), s = c(!1), p = c(null), w = c(!1), F = c(null), I = c(0), T = c("unknown"), [ee, i] = ke(j), [he, B] = ke(!1), f = m >= 0 ? R[m] : void 0, K = f?.audioUrl, Be = f?.element?.subtitle_cues ?? [], A = H(
     () => [...f?.audioSegments ?? []].sort(
       (e, t) => e.segment_index - t.segment_index
     ),
     [f?.audioSegments]
-  ), me = H(
-    () => er(se, ce),
-    [ce, se]
-  ), pe = me.length + 5, Ve = H(
+  ), ye = H(
+    () => nr(ie, oe),
+    [oe, ie]
+  ), ge = ye.length + 5, Ke = H(
     () => ({
-      "--slide-player-mobile-control-count": String(pe)
+      "--slide-player-mobile-control-count": String(ge)
     }),
-    [pe]
-  ), z = H(
+    [ge]
+  ), P = H(
     () => ({
-      ...Qe,
-      ...ae
+      ...rr,
+      ...fe
     }),
-    [ae]
-  ), ee = H(() => f ? f.audioKey ?? `${String(f.sequenceNumber ?? "none")}:${String(f.audioUrl ?? "")}` : "none", [f]), We = G ? Y : I, Be = G ? Y ? "Pause autoplay" : "Play autoplay" : I ? "Pause" : "Play";
+    [fe]
+  ), re = H(() => f ? f.audioKey ?? `${String(f.sequenceNumber ?? "none")}:${String(f.audioUrl ?? "")}` : "none", [f]), Oe = G ? Y : ee, Ze = G ? Y ? "Pause autoplay" : "Play autoplay" : ee ? "Pause" : "Play";
   b(() => {
-    q.current = f;
+    z.current = f;
   }, [f]), b(() => {
-    J || W(!1);
-  }, [J]), b(() => {
-    !oe.current && K && W(!1), oe.current = K;
-  }, [K]), b(() => {
-    E.current = k;
-  }, [k]), b(() => {
-    const e = f?.audioUrl, t = m >= 0 ? N[m + 1]?.audioUrl : void 0;
-    Ee(e), Ee(t);
-  }, [N, f?.audioUrl, m]);
+    Q || B(!1);
+  }, [Q]), b(() => {
+    !de.current && O && B(!1), de.current = O;
+  }, [O]), b(() => {
+    k.current = A;
+  }, [A]), b(() => {
+    const e = f?.audioUrl, t = m >= 0 ? R[m + 1]?.audioUrl : void 0;
+    Ne(e), Ne(t);
+  }, [R, f?.audioUrl, m]);
   const n = l(
     (e) => {
-      fe.current !== e && (fe.current = e, re?.(e));
+      pe.current !== e && (pe.current = e, te?.(e));
     },
-    [re]
-  ), he = l((e) => e instanceof DOMException ? e.name === "NotAllowedError" || e.name === "SecurityError" : !1, []), T = l(() => M && !L && !y.current && v.current !== "blocked", [M, L]), ye = l((e) => e ? e.startsWith("data:") ? e : `data:audio/mpeg;base64,${e}` : "", []), ge = l(() => {
-    const e = c.current;
-    return e == null || e <= 0 ? 0 : E.current.slice(0, e).reduce(
-      (t, s) => t + Math.max(Number(s.duration_ms ?? 0), 0),
+    [te]
+  ), _e = l((e) => e instanceof DOMException ? e.name === "NotAllowedError" || e.name === "SecurityError" : !1, []), C = l(() => j && !L && !y.current && T.current !== "blocked", [j, L]), be = l((e) => e ? e.startsWith("data:") ? e : `data:audio/mpeg;base64,${e}` : "", []), xe = l(() => {
+    const e = a.current;
+    return e == null || e <= 0 ? 0 : k.current.slice(0, e).reduce(
+      (t, u) => t + Math.max(Number(u.duration_ms ?? 0), 0),
       0
     ) / 1e3;
-  }, []), P = l((e) => e <= 0 ? 0 : E.current.slice(0, e).reduce(
-    (t, s) => t + Math.max(Number(s.duration_ms ?? 0), 0),
+  }, []), W = l((e) => e <= 0 ? 0 : k.current.slice(0, e).reduce(
+    (t, u) => t + Math.max(Number(u.duration_ms ?? 0), 0),
     0
-  ), []), _e = l(() => {
+  ), []), Se = l(() => {
     const e = h.current;
-    return e ? U.current === "segment" ? P(S.current) + Math.max(e.currentTime, 0) * 1e3 : p.current !== null && e.readyState === 0 ? p.current * 1e3 : Math.max(e.currentTime, 0) * 1e3 : c.current != null ? P(c.current) : 0;
-  }, [P]), g = l(
+    return e ? U.current === "segment" ? W(x.current) + Math.max(e.currentTime, 0) * 1e3 : p.current !== null && e.readyState === 0 ? p.current * 1e3 : Math.max(e.currentTime, 0) * 1e3 : a.current != null ? W(a.current) : 0;
+  }, [W]), g = l(
     (e) => {
       const t = Math.max(e, 0);
-      Q.current !== t && (Q.current = t, O?.(t));
+      I.current !== t && (I.current = t, q?.(t));
     },
-    [O]
-  ), i = l(() => {
-    g(_e());
-  }, [_e, g]), d = l(() => {
+    [q]
+  ), o = l(() => {
+    g(Se());
+  }, [Se, g]), d = l(() => {
     typeof window > "u" || F.current === null || (window.cancelAnimationFrame(F.current), F.current = null);
-  }, []), be = l(() => {
+  }, []), we = l(() => {
     if (typeof window > "u" || F.current !== null)
       return;
     const e = () => {
-      i();
+      o();
       const t = h.current;
       if (!t || t.paused || t.ended) {
         F.current = null;
@@ -158,83 +163,83 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
       F.current = window.requestAnimationFrame(e);
     };
     F.current = window.requestAnimationFrame(e);
-  }, [i]), $ = l(() => {
+  }, [o]), $ = l(() => {
     const e = h.current;
-    e && (d(), u.current = !1, y.current = !1, Z.current = !1, U.current = null, p.current = null, x.current = !1, w.current = !1, e.pause(), e.removeAttribute("src"), e.load(), j.current = null, S.current = 0, c.current = null, g(0), o(!1), n(!1));
+    e && (d(), s.current = !1, y.current = !1, Z.current = !1, U.current = null, p.current = null, S.current = !1, w.current = !1, e.pause(), e.removeAttribute("src"), e.load(), M.current = null, x.current = 0, a.current = null, g(0), i(!1), n(!1));
   }, [g, d, n]), _ = l(
     (e) => {
       const t = h.current;
       if (!t)
         return !1;
-      const s = t.play();
-      return s && typeof s.then == "function" && s.then(() => {
-        v.current === "unknown" && (v.current = "auto"), u.current = !1, w.current = !1;
+      const u = t.play();
+      return u && typeof u.then == "function" && u.then(() => {
+        T.current === "unknown" && (T.current = "auto"), s.current = !1, w.current = !1;
       }).catch((V) => {
-        v.current === "unknown" && he(V) && (v.current = "blocked", u.current = !1, n(!1)), w.current = !1, o(!1);
+        T.current === "unknown" && _e(V) && (T.current = "blocked", s.current = !1, n(!1)), w.current = !1, i(!1);
       }), !0;
     },
-    [he, n]
-  ), A = l(
+    [_e, n]
+  ), E = l(
     (e, t) => {
-      const s = h.current, V = E.current[e];
-      if (!s || !V)
+      const u = h.current, V = k.current[e];
+      if (!u || !V)
         return !1;
-      const R = ye(V.audio_data);
-      S.current = e, c.current = null, x.current = !1, w.current = !0, g(P(e));
-      const X = T();
-      u.current = X, n(!1);
-      const Xe = j.current !== R;
-      return U.current = "segment", Xe && (s.pause(), s.removeAttribute("src"), s.load(), j.current = R, s.src = R, s.load()), p.current = 0, s.readyState > 0 && (s.currentTime = 0, p.current = null), X ? _(`start-segment:${t}`) : (u.current = !1, w.current = !1, s.pause(), o(!1), !0);
+      const N = be(V.audio_data);
+      x.current = e, a.current = null, S.current = !1, w.current = !0, g(W(e));
+      const X = C();
+      s.current = X, n(!1);
+      const Je = M.current !== N;
+      return U.current = "segment", Je && (u.pause(), u.removeAttribute("src"), u.load(), M.current = N, u.src = N, u.load()), p.current = 0, u.readyState > 0 && (u.currentTime = 0, p.current = null), X ? _(`start-segment:${t}`) : (s.current = !1, w.current = !1, u.pause(), i(!1), !0);
     },
     [
-      T,
-      ye,
-      P,
+      C,
+      be,
+      W,
       g,
       _,
       n
     ]
   ), D = l(
     (e) => {
-      d(), u.current = !1, x.current = !1, w.current = !1, i(), o(!1), n(!1), m >= 0 && le?.(m);
+      d(), s.current = !1, S.current = !1, w.current = !1, o(), i(!1), n(!1), m >= 0 && ce?.(m);
     },
     [
       m,
-      le,
+      ce,
       d,
-      i,
+      o,
       n
     ]
-  ), Se = l(() => {
-    const e = S.current + 1, t = E.current, s = t[e], V = q.current, R = t.some((X) => X.is_final);
-    if (s) {
-      A(e, "ended");
+  ), je = l(() => {
+    const e = x.current + 1, t = k.current, u = t[e], V = z.current, N = t.some((X) => X.is_final);
+    if (u) {
+      E(e, "ended");
       return;
     }
-    if (V?.isAudioStreaming || !R) {
-      S.current = e, c.current = e, x.current = !0, u.current = M, g(P(e)), o(!1), n(!0);
+    if (V?.isAudioStreaming || !N) {
+      x.current = e, a.current = e, S.current = !0, s.current = j, g(W(e)), i(!1), n(!0);
       return;
     }
     D("segments-completed");
   }, [
-    M,
+    j,
     D,
-    P,
+    W,
     g,
-    A,
+    E,
     n
   ]);
   b(() => {
-    if (ie.current === ee)
+    if (me.current === re)
       return;
-    ie.current = ee, S.current = 0, c.current = null, x.current = !1, y.current = !1, Z.current = !1, u.current = !1, w.current = !1, U.current = null, j.current = null, d(), g(0), n(!1);
+    me.current = re, x.current = 0, a.current = null, S.current = !1, y.current = !1, Z.current = !1, s.current = !1, w.current = !1, U.current = null, M.current = null, d(), g(0), n(!1);
     const e = h.current;
-    e && (e.pause(), e.removeAttribute("src"), e.load(), o(!1));
+    e && (e.pause(), e.removeAttribute("src"), e.load(), i(!1));
   }, [
     m,
-    ee,
-    k.length,
-    B,
+    re,
+    A.length,
+    K,
     g,
     d,
     n
@@ -242,34 +247,34 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
     const e = h.current;
     if (e) {
       if (L) {
-        Z.current = !!(q.current && !y.current && (!e.paused || u.current || c.current !== null)), u.current = !1, n(!1), e.pause(), o(!1);
+        Z.current = !!(z.current && !y.current && (!e.paused || s.current || a.current !== null)), s.current = !1, n(!1), e.pause(), i(!1);
         return;
       }
-      if (!(!Z.current || !q.current || y.current)) {
-        if (Z.current = !1, c.current !== null) {
-          if (c.current < E.current.length) {
-            A(c.current, "external-resume");
+      if (!(!Z.current || !z.current || y.current)) {
+        if (Z.current = !1, a.current !== null) {
+          if (a.current < k.current.length) {
+            E(a.current, "external-resume");
             return;
           }
-          u.current = !0, n(!0);
+          s.current = !0, n(!0);
           return;
         }
-        if (!j.current && E.current.length > 0) {
-          A(
+        if (!M.current && k.current.length > 0) {
+          E(
             Math.min(
-              S.current,
-              E.current.length - 1
+              x.current,
+              k.current.length - 1
             ),
             "external-resume-init"
           );
           return;
         }
-        e.paused && (u.current = !0, _("external-resume"));
+        e.paused && (s.current = !0, _("external-resume"));
       }
     }
   }, [
     L,
-    A,
+    E,
     _,
     n
   ]), b(() => {
@@ -280,168 +285,196 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
         return;
       }
       if (L) {
-        u.current = !1, n(!1), e.pause(), o(!1);
+        s.current = !1, n(!1), e.pause(), i(!1);
         return;
       }
-      if (B) {
-        const t = j.current !== B, s = T();
-        if (U.current === "segment" && !!j.current && c.current === null) {
-          if (!s) {
-            u.current = !1, e.pause(), o(!1);
+      if (K) {
+        const t = M.current !== K, u = C();
+        if (U.current === "segment" && !!M.current && a.current === null) {
+          if (!u) {
+            s.current = !1, e.pause(), i(!1);
             return;
           }
-          e.paused && (u.current = !0, _("keep-segment-source"));
+          e.paused && (s.current = !0, _("keep-segment-source"));
           return;
         }
         if (t) {
-          const R = c.current !== null ? ge() : 0;
-          e.pause(), e.removeAttribute("src"), e.load(), j.current = B, U.current = "url", e.src = B, e.load(), p.current = R, g(R * 1e3), e.readyState > 0 && (e.currentTime = R, p.current = null);
+          const N = a.current !== null ? xe() : 0;
+          e.pause(), e.removeAttribute("src"), e.load(), M.current = K, U.current = "url", e.src = K, e.load(), p.current = N, g(N * 1e3), e.readyState > 0 && (e.currentTime = N, p.current = null);
         }
-        if (u.current = s, x.current = !1, w.current = !1, n(!1), !s) {
-          u.current = !1, e.pause(), o(!1);
+        if (s.current = u, S.current = !1, w.current = !1, n(!1), !u) {
+          s.current = !1, e.pause(), i(!1);
           return;
         }
         _(t ? "sync-url-init" : "sync-url");
         return;
       }
-      if (c.current !== null) {
-        if (c.current < k.length) {
+      if (a.current !== null) {
+        if (a.current < A.length) {
           if (y.current) {
-            o(!1), n(!1);
+            i(!1), n(!1);
             return;
           }
-          A(c.current, "wait-resume");
+          E(a.current, "wait-resume");
           return;
         }
-        x.current = !0, u.current = T(), o(!1), n(T());
+        S.current = !0, s.current = C(), i(!1), n(C());
         return;
       }
-      if (!k.length) {
+      if (!A.length) {
         if (f.isAudioStreaming) {
-          c.current = S.current, x.current = !0, u.current = T(), o(!1), n(T());
+          a.current = x.current, S.current = !0, s.current = C(), i(!1), n(C());
           return;
         }
         $();
         return;
       }
-      if (!j.current) {
-        A(
+      if (!M.current) {
+        E(
           Math.min(
-            S.current,
-            k.length - 1
+            x.current,
+            A.length - 1
           ),
           "effect-init"
         );
         return;
       }
-      if (!M || y.current) {
-        u.current = !1, e.pause(), o(!1);
+      if (!j || y.current) {
+        s.current = !1, e.pause(), i(!1);
         return;
       }
-      e.paused && (u.current = !0, _("sync-paused-retry"));
+      e.paused && (s.current = !0, _("sync-paused-retry"));
     }
   }, [
     f,
     m,
-    k,
-    B,
-    M,
+    A,
+    K,
+    j,
     L,
-    T,
+    C,
     g,
     $,
-    A,
+    E,
     _,
-    ge,
+    xe,
     n
   ]), b(() => $, [$]), b(() => d, [d]);
-  const Ke = l(() => {
-    i(), be(), o(!0), n(!1);
-  }, [be, i, n]), Ze = l(() => {
-    x.current || w.current || (d(), i(), o(!1));
-  }, [m, d, i]), $e = l(() => {
+  const $e = l(() => {
+    o(), we(), i(!0), n(!1), ne?.();
+  }, [
+    ne,
+    we,
+    o,
+    n
+  ]), He = l(() => {
+    S.current || w.current || (d(), o(), i(!1));
+  }, [m, d, o]), qe = l(() => {
     const e = h.current;
-    e && p.current !== null && (e.currentTime = p.current, p.current = null), i(), !(!u.current || !M) && _("canplay");
+    e && p.current !== null && (e.currentTime = p.current, p.current = null), o(), !(!s.current || !j) && _("canplay");
   }, [
     m,
-    M,
-    i,
+    j,
+    o,
     _
-  ]), He = l(() => {
+  ]), ze = l(() => {
     const e = h.current;
-    e && p.current !== null && (e.currentTime = p.current, p.current = null), i();
-  }, [m, i]), Oe = l(() => {
-    i();
-  }, [i]), xe = l(() => {
-    i();
-  }, [i]), qe = l(() => {
-    const e = U.current === "url" || E.current.length === 0;
+    e && p.current !== null && (e.currentTime = p.current, p.current = null), o();
+  }, [m, o]), De = l(() => {
+    o();
+  }, [o]), Me = l(() => {
+    o();
+  }, [o]), Xe = l(() => {
+    const e = U.current === "url" || k.current.length === 0;
     if (d(), w.current = !1, e) {
       D("url-ended");
       return;
     }
-    Se();
-  }, [D, Se, d]), ze = l(() => {
-    d(), i(), o(!1), n(!1);
-  }, [d, i, n]), De = l(
+    je();
+  }, [D, je, d]), Ye = l(() => {
+    d(), o(), i(!1), n(!1);
+  }, [d, o, n]), Ge = l(
     (e) => {
-      ue?.(e), W(!1);
+      ae?.(e), B(!1);
     },
-    [ue]
+    [ae]
   );
-  return console.log("SubtitleOverlay", Pe), b(() => {
-    O?.(Q.current);
-  }, [O]), /* @__PURE__ */ r.jsxs("div", { className: Me("slide-player", C), ...Fe, children: [
+  return console.log("SubtitleOverlay", Be), b(() => {
+    q?.(I.current);
+  }, [q]), /* @__PURE__ */ r.jsxs("div", { className: Ae("slide-player", v), ...Ve, children: [
     /* @__PURE__ */ r.jsx(
       "audio",
       {
         ref: h,
         preload: "auto",
         playsInline: !0,
-        onLoadedMetadata: He,
-        onCanPlay: $e,
-        onPlay: Ke,
-        onPause: Ze,
-        onSeeking: xe,
-        onSeeked: xe,
-        onTimeUpdate: Oe,
-        onEnded: qe,
-        onError: ze
+        onLoadedMetadata: ze,
+        onCanPlay: qe,
+        onPlay: $e,
+        onPause: He,
+        onSeeking: Me,
+        onSeeked: Me,
+        onTimeUpdate: De,
+        onEnded: Xe,
+        onError: Ye
       }
     ),
-    J ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+    Q ? /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
       /* @__PURE__ */ r.jsx(
-        Je,
+        er,
         {
-          container: Ne,
+          container: ve,
           labels: {
-            fullscreen: z.fullscreenLabel,
-            nonFullscreen: z.nonFullscreenLabel,
-            screen: z.screenLabel,
-            title: z.settingsTitle
+            fullscreen: P.fullscreenLabel,
+            nonFullscreen: P.nonFullscreenLabel,
+            screen: P.screenLabel,
+            subtitle: P.subtitleLabel,
+            subtitleToggle: P.subtitleToggleAriaLabel,
+            title: P.settingsTitle
           },
-          onClose: () => W(!1),
-          onOpenChange: W,
-          onViewModeChange: De,
-          open: de,
-          viewMode: Re
+          isSubtitleEnabled: J,
+          onClose: () => B(!1),
+          onOpenChange: B,
+          onSubtitleToggle: se ?? (() => {
+          }),
+          onViewModeChange: Ge,
+          open: he,
+          viewMode: Ce
         }
       ),
-      /* @__PURE__ */ r.jsxs("div", { className: "slide-player__controls", style: Ve, children: [
+      /* @__PURE__ */ r.jsxs("div", { className: "slide-player__controls", style: Ke, children: [
         /* @__PURE__ */ r.jsxs("div", { className: "slide-player__group", children: [
           /* @__PURE__ */ r.jsx(
             "button",
             {
-              "aria-expanded": de,
+              "aria-expanded": he,
               "aria-haspopup": "dialog",
               "aria-label": "More options",
               className: "slide-player__action slide-player__action--mobile-more",
               onClick: () => {
-                W((e) => !e);
+                B((e) => !e);
               },
               type: "button",
               children: /* @__PURE__ */ r.jsx(
-                rr,
+                sr,
+                {
+                  className: "slide-player__icon",
+                  strokeWidth: 2.25
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ r.jsx("button", { "aria-label": "Volume", className: "hidden", type: "button", children: /* @__PURE__ */ r.jsx(lr, { className: "slide-player__icon", strokeWidth: 2.25 }) }),
+          /* @__PURE__ */ r.jsx(
+            "button",
+            {
+              "aria-label": P.subtitleToggleAriaLabel,
+              "aria-pressed": J,
+              className: "slide-player__action slide-player__action--subtitle",
+              onClick: se,
+              type: "button",
+              children: J ? /* @__PURE__ */ r.jsx(ur, { className: "slide-player__icon", strokeWidth: 2.25 }) : /* @__PURE__ */ r.jsx(
+                ar,
                 {
                   className: "slide-player__icon",
                   strokeWidth: 2.25
@@ -449,57 +482,56 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
               )
             }
           ),
-          /* @__PURE__ */ r.jsx("button", { "aria-label": "Volume", className: "hidden", type: "button", children: /* @__PURE__ */ r.jsx(tr, { className: "slide-player__icon", strokeWidth: 2.25 }) }),
           /* @__PURE__ */ r.jsx(
             "button",
             {
               "aria-label": "Rewind",
               className: "slide-player__action slide-player__action--prev",
-              disabled: Le,
-              onClick: ke,
+              disabled: Pe,
+              onClick: Re,
               type: "button",
-              children: /* @__PURE__ */ r.jsx(nr, { className: "slide-player__icon", strokeWidth: 2.25 })
+              children: /* @__PURE__ */ r.jsx(cr, { className: "slide-player__icon", strokeWidth: 2.25 })
             }
           ),
           /* @__PURE__ */ r.jsx(
             "button",
             {
-              "aria-label": Be,
+              "aria-label": Ze,
               className: "slide-player__toggle slide-player__toggle--playback",
               onClick: () => {
                 if (G) {
-                  ve?.(!Y);
+                  Le?.(!Y);
                   return;
                 }
                 const e = h.current;
                 if (!(L || !e || !f)) {
-                  if (c.current !== null) {
-                    if (I) {
-                      u.current = !1, y.current = !0, c.current = null, x.current = !1, o(!1), n(!1), e.pause();
+                  if (a.current !== null) {
+                    if (ee) {
+                      s.current = !1, y.current = !0, a.current = null, S.current = !1, i(!1), n(!1), e.pause();
                       return;
                     }
-                    v.current = "manual", y.current = !1, u.current = !0, n(!0);
+                    T.current = "manual", y.current = !1, s.current = !0, n(!0);
                     return;
                   }
-                  if (!e.src && k.length > 0) {
-                    v.current = "manual", y.current = !1, A(
+                  if (!e.src && A.length > 0) {
+                    T.current = "manual", y.current = !1, E(
                       Math.min(
-                        S.current,
-                        k.length - 1
+                        x.current,
+                        A.length - 1
                       ),
                       "toggle"
                     );
                     return;
                   }
                   if (e.paused) {
-                    v.current = "manual", y.current = !1, u.current = !0, _("toggle-resume");
+                    T.current = "manual", y.current = !1, s.current = !0, _("toggle-resume");
                     return;
                   }
-                  u.current = !1, y.current = !0, e.pause();
+                  s.current = !1, y.current = !0, e.pause();
                 }
               },
               type: "button",
-              children: We ? /* @__PURE__ */ r.jsx(ar, {}) : /* @__PURE__ */ r.jsx(or, {})
+              children: Oe ? /* @__PURE__ */ r.jsx(mr, {}) : /* @__PURE__ */ r.jsx(pr, {})
             }
           ),
           /* @__PURE__ */ r.jsx(
@@ -507,27 +539,27 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
             {
               "aria-label": "Forward",
               className: "slide-player__action slide-player__action--next",
-              disabled: Ue,
-              onClick: Ae,
+              disabled: We,
+              onClick: Te,
               type: "button",
-              children: /* @__PURE__ */ r.jsx(ur, { className: "slide-player__icon", strokeWidth: 2.25 })
+              children: /* @__PURE__ */ r.jsx(ir, { className: "slide-player__icon", strokeWidth: 2.25 })
             }
           ),
-          te ? /* @__PURE__ */ r.jsx(
+          le ? /* @__PURE__ */ r.jsx(
             "button",
             {
-              "aria-label": ne ? "Exit fullscreen" : "Enter fullscreen",
+              "aria-label": ue ? "Exit fullscreen" : "Enter fullscreen",
               className: "slide-player__action slide-player__action--fullscreen",
-              onClick: te,
+              onClick: le,
               type: "button",
-              children: ne ? /* @__PURE__ */ r.jsx(
-                lr,
+              children: ue ? /* @__PURE__ */ r.jsx(
+                or,
                 {
                   className: "slide-player__icon",
                   strokeWidth: 2.25
                 }
               ) : /* @__PURE__ */ r.jsx(
-                sr,
+                fr,
                 {
                   className: "slide-player__icon",
                   strokeWidth: 2.25
@@ -538,20 +570,20 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
         ] }),
         /* @__PURE__ */ r.jsx("div", { className: "slide-player__separator" }),
         /* @__PURE__ */ r.jsxs("div", { className: "slide-player__group", children: [
-          me.map((e, t) => /* @__PURE__ */ r.jsx(Ye.Fragment, { children: e }, `custom-action-${t}`)),
+          ye.map((e, t) => /* @__PURE__ */ r.jsx(Qe.Fragment, { children: e }, `custom-action-${t}`)),
           /* @__PURE__ */ r.jsx(
             "button",
             {
               "aria-label": "Notes",
-              className: Me(
+              className: Ae(
                 "slide-player__action slide-player__action--notes",
-                K && "slide-player__action--active"
+                O && "slide-player__action--active"
               ),
-              disabled: !Ce,
-              onClick: Te,
+              disabled: !Fe,
+              onClick: Ue,
               type: "button",
               children: /* @__PURE__ */ r.jsx(
-                cr,
+                dr,
                 {
                   className: "slide-player__icon",
                   strokeWidth: 2.25
@@ -563,9 +595,9 @@ const je = /* @__PURE__ */ new Map(), Ee = (N) => {
       ] })
     ] }) : null
   ] });
-}, fr = Ge(ir);
-fr.displayName = "Player";
+}, yr = Ie(hr);
+yr.displayName = "Player";
 export {
-  fr as default
+  yr as default
 };
 //# sourceMappingURL=Player.es.js.map