@instructure/studio-player 0.5.1 → 0.5.6

package/dist/studio-player.es.js

@@ -1,15 +1,15 @@
-import './index-Dn2U025w.css';var lt = Object.defineProperty;
-var rt = (e, t, o) => t in e ? lt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o;
-var V = (e, t, o) => rt(e, typeof t != "symbol" ? t + "" : t, o);
+import './index-Bp7bsIbA.css';var ht = Object.defineProperty;
+var pt = (e, t, o) => t in e ? ht(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o;
+var R = (e, t, o) => pt(e, typeof t != "symbol" ? t + "" : t, o);
 import { jsx as n, jsxs as r, Fragment as X } from "react/jsx-runtime";
-import { createContext as ce, useContext as ue, useState as x, useCallback as p, useEffect as F, useMemo as A, useRef as q, forwardRef as ct } from "react";
-import { useMediaPlayer as T, Spinner as re, useMediaState as b, useMediaRemote as ie, isTrackCaptionKind as ut, Track as dt, Captions as mt, usePlaybackRateOptions as ht, useCaptionOptions as pt, useVideoQualityOptions as _t, Poster as ft, FullscreenButton as Ct, Time as xe, TimeSlider as W, VolumeSlider as J, isAudioProvider as bt, isVideoProvider as gt, isYouTubeProvider as vt, isVimeoProvider as wt, MediaPlayer as kt, MediaProvider as yt } from "@vidstack/react";
-import { useMediaState as Vi, useMediaStore as Ti } from "@vidstack/react";
-import { initReactI18next as Lt, useTranslation as _ } from "react-i18next";
-import Mt from "i18next";
-import xt from "i18next-resources-to-backend";
-import { useFloating as de, autoUpdate as me, shift as He, offset as Ae, arrow as Re, useListNavigation as Pt, useDismiss as he, useInteractions as pe, FloatingFocusManager as _e, FloatingArrow as Be, detectOverflow as Nt, useMergeRefs as It } from "@floating-ui/react";
-const St = (e, t, o) => {
+import { createContext as we, useContext as ye, useState as k, useCallback as f, useEffect as Z, useMemo as D, useRef as z, forwardRef as ft } from "react";
+import { u as S, s as ge, a as g, b as de, i as _t, T as Ct, C as gt, c as bt, d as vt, e as wt, P as yt, F as kt, f as ce, g as be, t as G, v as se, h as Lt, j as xt, k as Mt, l as Pt, M as Nt, m as It } from "./vidstack-CRo1u9eU.js";
+import { n as Zi } from "./vidstack-CRo1u9eU.js";
+import { initReactI18next as Et, useTranslation as h } from "react-i18next";
+import Tt from "i18next";
+import At from "i18next-resources-to-backend";
+import { useFloating as me, autoUpdate as he, shift as ke, offset as Le, arrow as xe, useListNavigation as ze, useDismiss as Me, useInteractions as Pe, FloatingFocusManager as Ne, FloatingArrow as Ie, useMergeRefs as $e, detectOverflow as St } from "@floating-ui/react";
+const Vt = (e, t, o) => {
   const i = e[t];
   return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((s, a) => {
     (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
@@ -22,9 +22,9 @@ const St = (e, t, o) => {
     );
   });
 };
-Mt.use(Lt).use(
-  xt(
-    (e) => St(/* @__PURE__ */ Object.assign({ "./locales/ar.json": () => import("./ar-B8l4Fn4I.js"), "./locales/ca.json": () => import("./ca-D-9XXbq2.js"), "./locales/cy.json": () => import("./cy-7BijMmgd.js"), "./locales/da-x-k12.json": () => import("./da-x-k12-CJ2niKwf.js"), "./locales/da.json": () => import("./da-DAY_l_21.js"), "./locales/de.json": () => import("./de-ya8bO5Ja.js"), "./locales/en-AU-x-unimelb.json": () => import("./en-AU-x-unimelb-irzsO2mb.js"), "./locales/en-GB-x-ukhe.json": () => import("./en-GB-x-ukhe-G4m87b7j.js"), "./locales/en.json": () => import("./en-D6AICPim.js"), "./locales/en_AU.json": () => import("./en_AU-DB3OHfTc.js"), "./locales/en_CY.json": () => import("./en_CY-DhDZF-tZ.js"), "./locales/en_GB.json": () => import("./en_GB-BK_q7w5s.js"), "./locales/es.json": () => import("./es-DZ5Y82Uj.js"), "./locales/es_ES.json": () => import("./es_ES-CQMBItY2.js"), "./locales/fi.json": () => import("./fi-B4Pz1t-t.js"), "./locales/fr.json": () => import("./fr-BteehQcx.js"), "./locales/fr_CA.json": () => import("./fr_CA-BHaXh8MX.js"), "./locales/ga.json": () => import("./ga-Bx3a9UKG.js"), "./locales/hi.json": () => import("./hi-DHG0_yeQ.js"), "./locales/ht.json": () => import("./ht-C2IdMP2u.js"), "./locales/id.json": () => import("./id-uk30JX2p.js"), "./locales/is.json": () => import("./is-yOmqk5qU.js"), "./locales/it.json": () => import("./it-BM3Um8gU.js"), "./locales/ja.json": () => import("./ja-BdL71P8g.js"), "./locales/kl.json": () => import("./kl-BeSfwm2D.js"), "./locales/mi.json": () => import("./mi-D2uHHivq.js"), "./locales/ms.json": () => import("./ms--AuIVHSL.js"), "./locales/nb-x-k12.json": () => import("./nb-x-k12-CxOnhM4J.js"), "./locales/nb.json": () => import("./nb-CXLIMCwW.js"), "./locales/nl.json": () => import("./nl-CsVJ-oQV.js"), "./locales/pl.json": () => import("./pl-BT0sRFhU.js"), "./locales/pt.json": () => import("./pt-Anx8EAjZ.js"), "./locales/pt_BR.json": () => import("./pt_BR-Be3UULFe.js"), "./locales/ru.json": () => import("./ru-DPUYT2zh.js"), "./locales/sl.json": () => import("./sl-QnHcT_i1.js"), "./locales/sv-x-k12.json": () => import("./sv-x-k12-DLoiJ1OB.js"), "./locales/sv.json": () => import("./sv-D_WuG6Ug.js"), "./locales/th.json": () => import("./th-CcE5hCow.js"), "./locales/vi.json": () => import("./vi-De-Nfy-i.js"), "./locales/zh-Hans.json": () => import("./zh-Hans-CU7SSIXE.js"), "./locales/zh-Hant.json": () => import("./zh-Hant-BMd136-f.js"), "./locales/zh.json": () => import("./zh-ClimEyGq.js"), "./locales/zh_HK.json": () => import("./zh_HK-Culy5KI5.js") }), `./locales/${e}.json`, 3)
+Tt.use(Et).use(
+  At(
+    (e) => Vt(/* @__PURE__ */ Object.assign({ "./locales/ar.json": () => import("./ar-VCVxJm7K.js"), "./locales/ca.json": () => import("./ca-BEBt24QP.js"), "./locales/cy.json": () => import("./cy-YaAJqNQl.js"), "./locales/da-x-k12.json": () => import("./da-x-k12-lQy2NFaK.js"), "./locales/da.json": () => import("./da-BZWhI2Xn.js"), "./locales/de.json": () => import("./de-BUvRwMD6.js"), "./locales/en-AU-x-unimelb.json": () => import("./en-AU-x-unimelb-CMl3c1a0.js"), "./locales/en-GB-x-ukhe.json": () => import("./en-GB-x-ukhe-oT9RNDTK.js"), "./locales/en.json": () => import("./en-DwAikWk3.js"), "./locales/en_AU.json": () => import("./en_AU-CvZ7peTk.js"), "./locales/en_CY.json": () => import("./en_CY-BG8Pm72U.js"), "./locales/en_GB.json": () => import("./en_GB-CA_2B3N6.js"), "./locales/es.json": () => import("./es-CsXsddFr.js"), "./locales/es_ES.json": () => import("./es_ES-D71hU2MM.js"), "./locales/fi.json": () => import("./fi-D2HqteTW.js"), "./locales/fr.json": () => import("./fr-BAEJ5gcO.js"), "./locales/fr_CA.json": () => import("./fr_CA-BKv7vpJe.js"), "./locales/ga.json": () => import("./ga-COMvYqPH.js"), "./locales/hi.json": () => import("./hi-BejTYLRj.js"), "./locales/ht.json": () => import("./ht-BeM6QStZ.js"), "./locales/id.json": () => import("./id-NJzBnSib.js"), "./locales/is.json": () => import("./is-Cv47H4ey.js"), "./locales/it.json": () => import("./it-B6LzBKYz.js"), "./locales/ja.json": () => import("./ja-BV_3G5Hd.js"), "./locales/kl.json": () => import("./kl-CBFEKDWH.js"), "./locales/mi.json": () => import("./mi-BRHT5aP1.js"), "./locales/ms.json": () => import("./ms-D7bYcHUm.js"), "./locales/nb-x-k12.json": () => import("./nb-x-k12-8GMfCmMo.js"), "./locales/nb.json": () => import("./nb-DyTI7Ts1.js"), "./locales/nl.json": () => import("./nl-DBSxFMy9.js"), "./locales/pl.json": () => import("./pl-DUdYRh1Y.js"), "./locales/pt.json": () => import("./pt-DkTHNOHF.js"), "./locales/pt_BR.json": () => import("./pt_BR-DZZGbQIg.js"), "./locales/ru.json": () => import("./ru-Bxl9NL5w.js"), "./locales/sl.json": () => import("./sl-D2hOGCNb.js"), "./locales/sv-x-k12.json": () => import("./sv-x-k12-B7c2_4ik.js"), "./locales/sv.json": () => import("./sv-Bic7JSI_.js"), "./locales/th.json": () => import("./th-hFDNyurj.js"), "./locales/vi.json": () => import("./vi-Dz6NuOdc.js"), "./locales/zh-Hans.json": () => import("./zh-Hans-DKg6WKbe.js"), "./locales/zh-Hant.json": () => import("./zh-Hant-ZHDw_Y-L.js"), "./locales/zh.json": () => import("./zh-C7jcyKYp.js"), "./locales/zh_HK.json": () => import("./zh_HK-C2PlZhAG.js") }), `./locales/${e}.json`, 3)
   )
 ).init({
   fallbackLng: "en",
@@ -35,96 +35,100 @@ Mt.use(Lt).use(
     escapeValue: !1
   }
 });
-const Oe = ce(null);
-function Et({
+const Ue = we(null);
+function Rt({
   children: e,
   contextValue: t
 }) {
-  return /* @__PURE__ */ n(Oe.Provider, { value: t, children: e });
+  return /* @__PURE__ */ n(Ue.Provider, { value: t, children: e });
 }
-function g() {
-  const e = ue(Oe);
+function v() {
+  const e = ye(Ue);
   if (!e)
     throw new Error(
       "useStudioPlayerContext must be used within a StudioPlayerContextProvider"
     );
   return e;
 }
-const Fe = ce(null);
-function Vt({
-  hideFullScreen: e,
-  comments: t,
-  captions: o,
-  thumbnail: i,
-  annotations: s,
-  quizMarkers: a,
-  interactive: l,
-  onAnnotationClick: c,
-  onQuizMarkerClick: u,
-  onInteractivePinClick: d,
-  interactiveMenuElements: f,
-  kebabMenuElements: v,
-  darkMode: w,
-  children: y,
-  forceComments: N,
-  disableCaptionSettings: h,
-  disableStorage: C,
-  captionOffsetOverride: k,
-  disableInteractivePinRanges: I,
-  onQuizMarkerShow: Z,
+const qe = we(null);
+function Ht({
+  title: e,
+  hideFullScreen: t,
+  comments: o,
+  captions: i,
+  thumbnail: s,
+  annotations: a,
+  quizMarkers: l,
+  interactive: c,
+  onAnnotationClick: u,
+  onQuizMarkerClick: d,
+  onInteractivePinClick: _,
+  interactiveMenuElements: b,
+  kebabMenuElements: w,
+  darkMode: y,
+  children: x,
+  forceComments: p,
+  disableCaptionSettings: C,
+  disableStorage: H,
+  captionOffsetOverride: E,
+  disableInteractivePinRanges: P,
+  onQuizMarkerShow: I,
   onCaptionsDelete: B,
-  controlsLayout: D
+  controlsLayout: V,
+  startAt: O
 }) {
   const j = {
-    hideFullScreen: e,
-    comments: t,
-    captions: o,
-    thumbnail: i,
-    annotations: s,
-    quizMarkers: a,
-    interactive: l,
-    onAnnotationClick: c,
-    onQuizMarkerClick: u,
-    onInteractivePinClick: d,
-    interactiveMenuElements: f,
-    kebabMenuElements: v,
-    darkMode: w,
-    hasComments: t.length > 0,
-    hasAnnotations: s.length > 0,
-    hasQuizmarkers: a.length > 0,
-    forceComments: N,
-    disableCaptionSettings: h,
-    disableStorage: C,
-    captionOffsetOverride: k,
-    disableInteractivePinRanges: I,
-    onQuizMarkerShow: Z,
+    title: e,
+    hideFullScreen: t,
+    comments: o,
+    captions: i,
+    thumbnail: s,
+    annotations: a,
+    quizMarkers: l,
+    interactive: c,
+    onAnnotationClick: u,
+    onQuizMarkerClick: d,
+    onInteractivePinClick: _,
+    interactiveMenuElements: b,
+    kebabMenuElements: w,
+    darkMode: y,
+    hasComments: o.length > 0,
+    hasAnnotations: a.length > 0,
+    hasQuizmarkers: l.length > 0,
+    forceComments: p,
+    disableCaptionSettings: C,
+    disableStorage: H,
+    captionOffsetOverride: E,
+    disableInteractivePinRanges: P,
+    onQuizMarkerShow: I,
     onCaptionsDelete: B,
-    controlsLayout: D
+    controlsLayout: V,
+    startAt: O
   };
-  return /* @__PURE__ */ n(Fe.Provider, { value: j, children: y });
+  return /* @__PURE__ */ n(qe.Provider, { value: j, children: x });
 }
 function L() {
-  const e = ue(Fe);
+  const e = ye(qe);
   if (!e)
     throw new Error(
       "useStudioPlayerPropsContext must be used within a StudioPlayerPropsContextProvider"
     );
   return e;
 }
-const Tt = "_annotation-overlay_1kxzn_1", Ht = {
+const Bt = "_annotation-overlay_1kxzn_1", Ot = {
   "annotation-overlay": "_annotation-overlay_1kxzn_1",
-  annotationOverlay: Tt
-}, Pe = 0.25, At = (e, t) => {
+  annotationOverlay: Bt
+}, He = 0.25, Ft = (e, t) => {
   let o = !1;
   return (i) => {
     const s = i.detail.currentTime;
-    s >= e.time && s < e.time + Pe && !o && (o = !0, t(e)), (s < e.time || s >= e.time + Pe) && o && (o = !1);
+    s >= e.time && s < e.time + He && !o && (o = !0, t(e)), (s < e.time || s >= e.time + He) && o && (o = !1);
   };
 };
-function Rt({ annotations: e }) {
-  const t = T(), o = g(), i = L(), [s, a] = x(
+function Dt({ annotations: e }) {
+  const t = S(), o = v(), i = L(), [s, a] = k(
     null
-  ), l = p(
+  ), l = f(
     (u) => {
       t == null || t.pause(), i.interactive || o.disableInteractions(), a(u);
     },
@@ -132,17 +136,17 @@ function Rt({ annotations: e }) {
   ), c = () => {
     i.interactive || (t == null || t.play(), o.enableInteractions()), a(null);
   };
-  return F(() => {
+  return Z(() => {
     if (!t)
       return;
     const u = [];
     for (const d of e) {
-      const f = At(d, l);
-      t.addEventListener("time-update", f), u.push(f);
+      const _ = Ft(d, l);
+      t.addEventListener("time-update", _), u.push(_);
     }
     if (s) {
       const d = e.find(
-        (f) => f.id === s.id
+        (_) => _.id === s.id
       );
       d ? a(d) : (a(null), o.enableInteractions());
     }
@@ -150,35 +154,41 @@ function Rt({ annotations: e }) {
       for (const d of u)
         t.removeEventListener("time-update", d);
     };
-  }, [t, e]), s ? /* @__PURE__ */ n("div", { className: Ht.annotationOverlay, children: s.render(c) }) : null;
+  }, [t, e]), s ? /* @__PURE__ */ n("div", { className: Ot.annotationOverlay, children: s.render(c) }) : null;
 }
-const Bt = "_media-buffering-indicator_1fwjr_1", Ot = "_media-buffering-spinner_1fwjr_17", Ft = "_media-buffering-spin_1fwjr_17", Zt = "_media-buffering-track_1fwjr_22", Dt = "_media-buffering-track-fill_1fwjr_27", ee = {
+const Zt = "_media-buffering-indicator_1fwjr_1", jt = "_media-buffering-spinner_1fwjr_17", Kt = "_media-buffering-spin_1fwjr_17", zt = "_media-buffering-track_1fwjr_22", $t = "_media-buffering-track-fill_1fwjr_27", ae = {
   "media-buffering-indicator": "_media-buffering-indicator_1fwjr_1",
-  mediaBufferingIndicator: Bt,
+  mediaBufferingIndicator: Zt,
   "media-buffering-spinner": "_media-buffering-spinner_1fwjr_17",
-  mediaBufferingSpinner: Ot,
+  mediaBufferingSpinner: jt,
   "media-buffering-spin": "_media-buffering-spin_1fwjr_17",
-  mediaBufferingSpin: Ft,
+  mediaBufferingSpin: Kt,
   "media-buffering-track": "_media-buffering-track_1fwjr_22",
-  mediaBufferingTrack: Zt,
+  mediaBufferingTrack: zt,
   "media-buffering-track-fill": "_media-buffering-track-fill_1fwjr_27",
-  mediaBufferingTrackFill: Dt
+  mediaBufferingTrackFill: $t
 };
-function Ze() {
-  return /* @__PURE__ */ n("div", { className: ee.mediaBufferingIndicator, children: /* @__PURE__ */ r(re.Root, { className: ee.mediaBufferingSpinner, size: 96, children: [
-    /* @__PURE__ */ n(re.Track, { className: ee.mediaBufferingTrack, width: 8 }),
+function Ge() {
+  return /* @__PURE__ */ n("div", { className: ae.mediaBufferingIndicator, children: /* @__PURE__ */ r(ge.Root, { className: ae.mediaBufferingSpinner, size: 96, children: [
+    /* @__PURE__ */ n(ge.Track, { className: ae.mediaBufferingTrack, width: 8 }),
     /* @__PURE__ */ n(
-      re.TrackFill,
+      ge.TrackFill,
       {
-        className: ee.mediaBufferingTrackFill,
+        className: ae.mediaBufferingTrackFill,
         width: 8
       }
     )
   ] }) });
 }
-const jt = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
-function fe(e, t = !1) {
-  F(() => {
+const Ut = [
+  "ArrowUp",
+  "ArrowDown",
+  "ArrowLeft",
+  "ArrowRight",
+  "Escape"
+];
+function Ee(e, t = !1) {
+  Z(() => {
     const o = new AbortController();
     return document.addEventListener(
       "keydown",
@@ -193,7 +203,7 @@ function fe(e, t = !1) {
     ), t && window.addEventListener(
       "keydown",
       (i) => {
-        jt.includes(i.code) && i.preventDefault();
+        Ut.includes(i.code) && i.preventDefault();
       },
       { signal: o.signal }
     ), () => {
@@ -201,41 +211,41 @@ function fe(e, t = !1) {
     };
   }, [e]);
 }
-function Kt(e) {
-  const t = A(() => ({ Escape: e }), [e]);
-  return fe(t);
-}
-const De = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.94968 7.74766L3.99993 2.79791L2.79785 3.99999L7.7476 8.94974L2.79785 13.8995L3.99993 15.1016L8.94968 10.1518L13.8994 15.1016L15.1015 13.8995L10.1518 8.94974L15.1015 3.99999L13.8994 2.79791L8.94968 7.74766Z", fill: "currentColor" }) }), zt = "_controls-overlay_poi8b_1", Ut = "_keyboard-shortcuts-overlay_poi8b_11", $t = "_screen-reader-content_poi8b_75", qt = "_controls-button_poi8b_89", Gt = "_keyboard-shortcuts-button_poi8b_101", Wt = "_kebab-menu-button_poi8b_110", Qt = "_kebab-menu_poi8b_110", Yt = "_kebab-menu-item_poi8b_139", Xt = "_close-button_poi8b_178", Jt = "_arrow_poi8b_192", S = {
-  "controls-overlay": "_controls-overlay_poi8b_1",
-  controlsOverlay: zt,
-  "keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_poi8b_11",
-  keyboardShortcutsOverlay: Ut,
-  "screen-reader-content": "_screen-reader-content_poi8b_75",
-  screenReaderContent: $t,
-  "controls-button": "_controls-button_poi8b_89",
-  controlsButton: qt,
-  "keyboard-shortcuts-button": "_keyboard-shortcuts-button_poi8b_101",
-  keyboardShortcutsButton: Gt,
-  "kebab-menu-button": "_kebab-menu-button_poi8b_110",
-  kebabMenuButton: Wt,
-  "kebab-menu": "_kebab-menu_poi8b_110",
-  kebabMenu: Qt,
-  "kebab-menu-item": "_kebab-menu-item_poi8b_139",
-  kebabMenuItem: Yt,
-  "close-button": "_close-button_poi8b_178",
-  closeButton: Xt,
-  arrow: Jt
+function qt(e) {
+  const t = D(() => ({ Escape: e }), [e]);
+  return Ee(t);
+}
+const Qe = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.94968 7.74766L3.99993 2.79791L2.79785 3.99999L7.7476 8.94974L2.79785 13.8995L3.99993 15.1016L8.94968 10.1518L13.8994 15.1016L15.1015 13.8995L10.1518 8.94974L15.1015 3.99999L13.8994 2.79791L8.94968 7.74766Z", fill: "currentColor" }) }), Gt = "_controls-overlay_151j5_1", Qt = "_keyboard-shortcuts-overlay_151j5_11", Wt = "_screen-reader-content_151j5_76", Yt = "_controls-button_151j5_90", Xt = "_keyboard-shortcuts-button_151j5_106", Jt = "_kebab-menu-button_151j5_116", en = "_kebab-menu_151j5_116", tn = "_kebab-menu-item_151j5_145", nn = "_close-button_151j5_184", on = "_arrow_151j5_198", A = {
+  "controls-overlay": "_controls-overlay_151j5_1",
+  controlsOverlay: Gt,
+  "keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_151j5_11",
+  keyboardShortcutsOverlay: Qt,
+  "screen-reader-content": "_screen-reader-content_151j5_76",
+  screenReaderContent: Wt,
+  "controls-button": "_controls-button_151j5_90",
+  controlsButton: Yt,
+  "keyboard-shortcuts-button": "_keyboard-shortcuts-button_151j5_106",
+  keyboardShortcutsButton: Xt,
+  "kebab-menu-button": "_kebab-menu-button_151j5_116",
+  kebabMenuButton: Jt,
+  "kebab-menu": "_kebab-menu_151j5_116",
+  kebabMenu: en,
+  "kebab-menu-item": "_kebab-menu-item_151j5_145",
+  kebabMenuItem: tn,
+  "close-button": "_close-button_151j5_184",
+  closeButton: nn,
+  arrow: on
 };
-function en({ onClose: e }) {
-  const { t } = _();
-  Kt(e);
+function sn({ onClose: e }) {
+  const { t } = h();
+  qt(e);
   const o = (i) => {
     i && i.focus();
   };
   return /* @__PURE__ */ r(
     "div",
     {
-      className: S.keyboardShortcutsOverlay,
+      className: A.keyboardShortcutsOverlay,
       tabIndex: 0,
       ref: o,
       role: "dialog",
@@ -247,15 +257,15 @@ function en({ onClose: e }) {
             "button",
             {
               type: "button",
-              className: S.closeButton,
+              className: A.closeButton,
               onClick: e,
               "aria-label": t("CLOSE"),
-              children: /* @__PURE__ */ n(De, {})
+              children: /* @__PURE__ */ n(Qe, {})
             }
           )
         ] }),
         /* @__PURE__ */ r("table", { children: [
-          /* @__PURE__ */ n("caption", { className: S.screenReaderContent, children: t("KEYBOARD_SHORTCUTS") }),
+          /* @__PURE__ */ n("caption", { className: A.screenReaderContent, children: t("KEYBOARD_SHORTCUTS") }),
           /* @__PURE__ */ n("thead", { children: /* @__PURE__ */ r("tr", { children: [
             /* @__PURE__ */ n("th", { children: t("ACTION") }),
             /* @__PURE__ */ n("th", { children: t("SHORTCUT") })
@@ -342,87 +352,94 @@ function en({ onClose: e }) {
     }
   );
 }
-const tn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.8 3.6C9.79288 3.6 10.6 2.79288 10.6 1.8C10.6 0.80712 9.79288 0 8.8 0C7.80712 0 7 0.80712 7 1.8C7 2.79288 7.80712 3.6 8.8 3.6ZM10.6 8.99999C10.6 9.99287 9.79288 10.8 8.8 10.8C7.80712 10.8 7 9.99287 7 8.99999C7 8.00711 7.80712 7.19999 8.8 7.19999C9.79288 7.19999 10.6 8.00711 10.6 8.99999ZM10.6 16.2C10.6 17.1929 9.79288 18 8.8 18C7.80712 18 7 17.1929 7 16.2C7 15.2071 7.80712 14.4 8.8 14.4C9.79288 14.4 10.6 15.2071 10.6 16.2Z", fill: "currentColor" }) }), nn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1074 16.8677C12.8638 16.8677 11.8524 15.8563 11.8524 14.6127C11.8524 14.4154 11.8862 14.2271 11.9336 14.0444C12.0317 13.6701 12.22 13.3318 12.4804 13.059C12.8908 12.6294 13.467 12.3576 14.1074 12.3576C15.3511 12.3576 16.3625 13.369 16.3625 14.6127C16.3625 15.8563 15.3511 16.8677 14.1074 16.8677ZM4.38257 11.2301C3.13891 11.2301 2.12752 10.2187 2.12752 8.97507C2.12752 7.73141 3.13891 6.72002 4.38257 6.72002C5.01623 6.72002 5.58676 6.98386 5.99718 7.40556C6.25989 7.67616 6.44819 8.01329 6.54966 8.38763C6.60153 8.57592 6.63761 8.76986 6.63761 8.97507C6.63761 9.2017 6.59364 9.41818 6.53049 9.62452C6.41887 9.99435 6.22155 10.327 5.94982 10.5908C5.54391 10.9843 4.99256 11.2301 4.38257 11.2301ZM11.8524 3.38257C11.8524 2.13891 12.8638 1.12753 14.1074 1.12753C15.3511 1.12753 16.3625 2.13891 16.3625 3.38257C16.3625 4.62622 15.3511 5.63761 14.1074 5.63761C13.4749 5.63761 12.9055 5.3749 12.4962 4.95546C12.2324 4.68485 12.0429 4.34773 11.9415 3.97339C11.8896 3.78397 11.8524 3.5889 11.8524 3.38257ZM14.1074 11.2301C13.0498 11.2301 12.1151 11.7273 11.495 12.4907L7.52722 10.1996C7.67605 9.81846 7.76513 9.40804 7.76513 8.97507C7.76513 8.56465 7.68056 8.17678 7.54639 7.8126L11.5108 5.5226C12.132 6.27466 13.0588 6.76513 14.1074 6.76513C15.9724 6.76513 17.49 5.24748 17.49 3.38256C17.49 1.51764 15.9724 0 14.1074 0C12.2425 0 10.7249 1.51764 10.7249 3.38256C10.7249 3.79411 10.8094 4.18423 10.9447 4.54842L6.9815 6.83729C6.36136 6.08411 5.43341 5.59251 4.38256 5.59251C2.51764 5.59251 1 7.11015 1 8.97507C1 10.84 2.51764 12.3576 4.38256 12.3576C5.40974 12.3576 6.32077 11.8875 6.94091 11.1625L10.9368 13.4694C10.8072 13.829 10.7249 14.2102 10.7249 14.6127C10.7249 16.4776 12.2425 17.9952 14.1074 17.9952C15.9724 17.9952 17.49 16.4776 17.49 14.6127C17.49 12.7478 15.9724 11.2301 14.1074 11.2301Z", fill: "currentColor" }) }), on = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.7647 16.9412H2.05882V1.05883H10.5294V5.29412H14.7647V16.9412ZM11.5882 1.278L14.5455 4.2353H11.5882V1.278ZM15.3587 3.55129L12.2722 0.464824C11.9715 0.165176 11.5724 0 11.1488 0H1V18H15.8235V4.67471C15.8235 4.25118 15.6584 3.852 15.3587 3.55129ZM1 0H15.8235V18H1V0ZM1 18H15.8235V0H1V18ZM4.17649 5.29412H8.41178V4.23529H4.17649V5.29412ZM4.17649 9.52941H10.5294V8.47059H4.17649V9.52941ZM4.17649 13.7647H8.41178V12.7059H4.17649V13.7647ZM4.17649 7.41177H12.6471V6.35294H4.17649V7.41177ZM4.17649 11.6471H11.5883V10.5882H4.17649V11.6471Z", fill: "currentColor" }) }), sn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.30365 10.9535V0H9.3637V10.9535L12.6986 7.61855L13.4491 8.368L8.83261 12.9824L4.21823 8.368L4.96875 7.61855L8.30365 10.9535ZM3.77376 16.94H13.9354L16.9607 13.9146L17.7091 14.6651L14.3742 18H3.3349L0 14.6651L0.749452 13.9146L3.77376 16.94Z", fill: "currentColor" }) }), je = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.8234 16.4118C14.8234 16.7029 14.5852 16.9412 14.294 16.9412H3.70577C3.41459 16.9412 3.17636 16.7029 3.17636 16.4118V5.29412H2.11753V16.4118C2.11753 17.2874 2.83012 18 3.70577 18H14.294C15.1697 18 15.8822 17.2874 15.8822 16.4118V5.29412H14.8234V16.4118ZM6.35284 14.8235H7.41166V6.35294H6.35284V14.8235ZM10.5881 14.8235H11.6469V6.35294H10.5881V14.8235ZM12.5682 3.17647L11.4099 0H6.51176L5.35553 3.17647H0V4.23529H18V3.17647H12.5682ZM6.48105 3.17647L7.25293 1.05882H10.6698L11.4416 3.17647H6.48105Z", fill: "currentColor" }) }), an = {
-  share: /* @__PURE__ */ n(nn, {}),
-  transcript: /* @__PURE__ */ n(on, {}),
-  media: /* @__PURE__ */ n(sn, {}),
-  delete: /* @__PURE__ */ n(je, {})
-}, ln = (e) => typeof e != "string";
-function rn() {
-  const [e, t] = x(!1), [o, i] = x(null), s = g(), a = L(), l = () => {
+const an = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.8 3.6C9.79288 3.6 10.6 2.79288 10.6 1.8C10.6 0.80712 9.79288 0 8.8 0C7.80712 0 7 0.80712 7 1.8C7 2.79288 7.80712 3.6 8.8 3.6ZM10.6 8.99999C10.6 9.99287 9.79288 10.8 8.8 10.8C7.80712 10.8 7 9.99287 7 8.99999C7 8.00711 7.80712 7.19999 8.8 7.19999C9.79288 7.19999 10.6 8.00711 10.6 8.99999ZM10.6 16.2C10.6 17.1929 9.79288 18 8.8 18C7.80712 18 7 17.1929 7 16.2C7 15.2071 7.80712 14.4 8.8 14.4C9.79288 14.4 10.6 15.2071 10.6 16.2Z", fill: "currentColor" }) }), ln = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1074 16.8677C12.8638 16.8677 11.8524 15.8563 11.8524 14.6127C11.8524 14.4154 11.8862 14.2271 11.9336 14.0444C12.0317 13.6701 12.22 13.3318 12.4804 13.059C12.8908 12.6294 13.467 12.3576 14.1074 12.3576C15.3511 12.3576 16.3625 13.369 16.3625 14.6127C16.3625 15.8563 15.3511 16.8677 14.1074 16.8677ZM4.38257 11.2301C3.13891 11.2301 2.12752 10.2187 2.12752 8.97507C2.12752 7.73141 3.13891 6.72002 4.38257 6.72002C5.01623 6.72002 5.58676 6.98386 5.99718 7.40556C6.25989 7.67616 6.44819 8.01329 6.54966 8.38763C6.60153 8.57592 6.63761 8.76986 6.63761 8.97507C6.63761 9.2017 6.59364 9.41818 6.53049 9.62452C6.41887 9.99435 6.22155 10.327 5.94982 10.5908C5.54391 10.9843 4.99256 11.2301 4.38257 11.2301ZM11.8524 3.38257C11.8524 2.13891 12.8638 1.12753 14.1074 1.12753C15.3511 1.12753 16.3625 2.13891 16.3625 3.38257C16.3625 4.62622 15.3511 5.63761 14.1074 5.63761C13.4749 5.63761 12.9055 5.3749 12.4962 4.95546C12.2324 4.68485 12.0429 4.34773 11.9415 3.97339C11.8896 3.78397 11.8524 3.5889 11.8524 3.38257ZM14.1074 11.2301C13.0498 11.2301 12.1151 11.7273 11.495 12.4907L7.52722 10.1996C7.67605 9.81846 7.76513 9.40804 7.76513 8.97507C7.76513 8.56465 7.68056 8.17678 7.54639 7.8126L11.5108 5.5226C12.132 6.27466 13.0588 6.76513 14.1074 6.76513C15.9724 6.76513 17.49 5.24748 17.49 3.38256C17.49 1.51764 15.9724 0 14.1074 0C12.2425 0 10.7249 1.51764 10.7249 3.38256C10.7249 3.79411 10.8094 4.18423 10.9447 4.54842L6.9815 6.83729C6.36136 6.08411 5.43341 5.59251 4.38256 5.59251C2.51764 5.59251 1 7.11015 1 8.97507C1 10.84 2.51764 12.3576 4.38256 12.3576C5.40974 12.3576 6.32077 11.8875 6.94091 11.1625L10.9368 13.4694C10.8072 13.829 10.7249 14.2102 10.7249 14.6127C10.7249 16.4776 12.2425 17.9952 14.1074 17.9952C15.9724 17.9952 17.49 16.4776 17.49 14.6127C17.49 12.7478 15.9724 11.2301 14.1074 11.2301Z", fill: "currentColor" }) }), rn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.7647 16.9412H2.05882V1.05883H10.5294V5.29412H14.7647V16.9412ZM11.5882 1.278L14.5455 4.2353H11.5882V1.278ZM15.3587 3.55129L12.2722 0.464824C11.9715 0.165176 11.5724 0 11.1488 0H1V18H15.8235V4.67471C15.8235 4.25118 15.6584 3.852 15.3587 3.55129ZM1 0H15.8235V18H1V0ZM1 18H15.8235V0H1V18ZM4.17649 5.29412H8.41178V4.23529H4.17649V5.29412ZM4.17649 9.52941H10.5294V8.47059H4.17649V9.52941ZM4.17649 13.7647H8.41178V12.7059H4.17649V13.7647ZM4.17649 7.41177H12.6471V6.35294H4.17649V7.41177ZM4.17649 11.6471H11.5883V10.5882H4.17649V11.6471Z", fill: "currentColor" }) }), cn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.30365 10.9535V0H9.3637V10.9535L12.6986 7.61855L13.4491 8.368L8.83261 12.9824L4.21823 8.368L4.96875 7.61855L8.30365 10.9535ZM3.77376 16.94H13.9354L16.9607 13.9146L17.7091 14.6651L14.3742 18H3.3349L0 14.6651L0.749452 13.9146L3.77376 16.94Z", fill: "currentColor" }) }), We = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.8234 16.4118C14.8234 16.7029 14.5852 16.9412 14.294 16.9412H3.70577C3.41459 16.9412 3.17636 16.7029 3.17636 16.4118V5.29412H2.11753V16.4118C2.11753 17.2874 2.83012 18 3.70577 18H14.294C15.1697 18 15.8822 17.2874 15.8822 16.4118V5.29412H14.8234V16.4118ZM6.35284 14.8235H7.41166V6.35294H6.35284V14.8235ZM10.5881 14.8235H11.6469V6.35294H10.5881V14.8235ZM12.5682 3.17647L11.4099 0H6.51176L5.35553 3.17647H0V4.23529H18V3.17647H12.5682ZM6.48105 3.17647L7.25293 1.05882H10.6698L11.4416 3.17647H6.48105Z", fill: "currentColor" }) }), un = {
+  share: /* @__PURE__ */ n(ln, {}),
+  transcript: /* @__PURE__ */ n(rn, {}),
+  media: /* @__PURE__ */ n(cn, {}),
+  delete: /* @__PURE__ */ n(We, {})
+}, dn = (e) => typeof e != "string";
+function mn() {
+  const [e, t] = k(!1), [o, i] = k(null), s = v(), a = L(), l = () => {
     t(!e), s.setGlobalKeysDisabled(!e);
-  }, c = q(null), u = q([]), { refs: d, floatingStyles: f, context: v } = de({
+  }, c = z(null), u = z([]), { refs: d, floatingStyles: _, context: b } = me({
     open: e,
     onOpenChange: l,
-    whileElementsMounted: me,
+    whileElementsMounted: he,
     placement: "bottom-end",
     middleware: [
-      He(),
-      Ae(10),
-      Re({
+      ke(),
+      Le(10),
+      xe({
         element: c
       })
     ]
-  }), w = Pt(v, {
+  }), w = ze(b, {
     listRef: u,
     activeIndex: o,
-    onNavigate: i
-  }), y = he(v), { getReferenceProps: N, getFloatingProps: h, getItemProps: C } = pe(
+    onNavigate: i,
+    loop: !0
+  }), y = Me(b), { getReferenceProps: x, getFloatingProps: p, getItemProps: C } = Pe(
     [y, w]
-  ), { t: k } = _();
+  ), { t: H } = h();
   return a.kebabMenuElements.length > 0 ? /* @__PURE__ */ r(X, { children: [
     /* @__PURE__ */ n(
       "button",
       {
+        id: "kebab-menu-button",
         type: "button",
-        "aria-label": k("KEBAB_MENU"),
+        "aria-label": H("KEBAB_MENU", { title: a.title }),
         "aria-haspopup": "true",
-        className: `${S.controlsButton} ${S.kebabMenuButton}`,
-        tabIndex: s.state.interactionsDisabled ? -1 : 0,
+        "aria-expanded": e,
+        className: `${A.controlsButton} ${A.kebabMenuButton}`,
+        tabIndex: s.state.interactionsDisabled || e ? -1 : 0,
         ref: d.setReference,
-        ...N({
+        ...x({
           onClick: () => l()
         }),
-        children: /* @__PURE__ */ n(tn, {})
+        children: /* @__PURE__ */ n(an, {})
       }
     ),
-    e && /* @__PURE__ */ n(_e, { context: v, modal: !1, children: /* @__PURE__ */ r(
+    e && /* @__PURE__ */ n(Ne, { context: b, guards: !1, children: /* @__PURE__ */ r(
       "div",
       {
+        id: "kebab-menu",
         ref: d.setFloating,
-        style: f,
-        className: S.kebabMenu,
-        ...h(),
+        style: _,
+        className: A.kebabMenu,
+        role: "menu",
+        "aria-labelledby": "kebab-menu-button",
+        ...p(),
         children: [
           a.kebabMenuElements.map(
-            ({ id: I, text: Z, icon: B, onClick: D }, j) => /* @__PURE__ */ r(
+            ({ id: E, text: P, icon: I, onClick: B }, V) => /* @__PURE__ */ r(
               "button",
               {
-                tabIndex: o === j ? 0 : -1,
+                tabIndex: o === V ? 0 : -1,
                 type: "button",
-                className: S.kebabMenuItem,
-                ref: (ae) => {
-                  u.current[j] = ae;
+                role: "menuitem",
+                className: A.kebabMenuItem,
+                ref: (O) => {
+                  u.current[V] = O;
                 },
                 ...C({
                   onClick: () => {
-                    D(I), t(!1);
+                    B(E), t(!1);
                   }
                 }),
                 children: [
-                  ln(B) ? B : an[B],
-                  Z
+                  dn(I) ? I : un[I],
+                  P
                 ]
               },
-              I
+              E
             )
           ),
           /* @__PURE__ */ n(
-            Be,
+            Ie,
             {
               ref: c,
-              context: v,
-              className: S.arrow
+              context: b,
+              className: A.arrow
             }
           )
         ]
@@ -430,43 +447,43 @@ function rn() {
     ) })
   ] }) : null;
 }
-const cn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.76472 10.5294C5.05696 10.5294 5.29413 10.2922 5.29413 9.99999V8.94117C5.29413 8.64893 5.05696 8.41175 4.76472 8.41175H3.7059C3.41366 8.41175 3.17649 8.64893 3.17649 8.94117V9.99999C3.17649 10.2922 3.41366 10.5294 3.7059 10.5294H4.76472ZM11.1177 10.5294C11.4099 10.5294 11.6471 10.2922 11.6471 9.99999V8.94117C11.6471 8.64893 11.4099 8.41175 11.1177 8.41175H10.0588C9.76661 8.41175 9.52944 8.64893 9.52944 8.94117V9.99999C9.52944 10.2922 9.76661 10.5294 10.0588 10.5294H11.1177ZM14.8235 9.99999C14.8235 10.2922 14.5864 10.5294 14.2941 10.5294H13.2353C12.9431 10.5294 12.7059 10.2922 12.7059 9.99999V8.94117C12.7059 8.64893 12.9431 8.41175 13.2353 8.41175H14.2941C14.5864 8.41175 14.8235 8.64893 14.8235 8.94117V9.99999ZM14.8235 13.1765C14.8235 13.4687 14.5864 13.7059 14.2941 13.7059H13.2353C12.9431 13.7059 12.7059 13.4687 12.7059 13.1765V12.1176C12.7059 11.8254 12.9431 11.5882 13.2353 11.5882H14.2941C14.5864 11.5882 14.8235 11.8254 14.8235 12.1176V13.1765ZM11.6471 13.1765C11.6471 13.4687 11.4099 13.7059 11.1177 13.7059H6.88239C6.59015 13.7059 6.35297 13.4687 6.35297 13.1765V12.1176C6.35297 11.8254 6.59015 11.5882 6.88239 11.5882H11.1177C11.4099 11.5882 11.6471 11.8254 11.6471 12.1176V13.1765ZM5.29413 13.1765C5.29413 13.4687 5.05696 13.7059 4.76472 13.7059H3.7059C3.41366 13.7059 3.17649 13.4687 3.17649 13.1765V12.1176C3.17649 11.8254 3.41366 11.5882 3.7059 11.5882H4.76472C5.05696 11.5882 5.29413 11.8254 5.29413 12.1176V13.1765ZM6.88238 8.41175C6.59015 8.41175 6.35297 8.64893 6.35297 8.94117V9.99999C6.35297 10.2922 6.59015 10.5294 6.88238 10.5294H7.94121C8.23344 10.5294 8.47062 10.2922 8.47062 9.99999V8.94117C8.47062 8.64893 8.23344 8.41175 7.94121 8.41175H6.88238ZM16.4118 5.23529H9.57494C9.71471 4.42 10.1933 4.17118 10.8254 3.85565C11.6629 3.43741 12.7059 2.91541 12.7059 1H11.6471C11.6471 2.26106 11.1039 2.53212 10.3511 2.90906C9.59824 3.28494 8.68659 3.75506 8.50871 5.23529H1.58824C0.712588 5.23529 0 5.94788 0 6.82353V15.2941C0 16.1698 0.712588 16.8824 1.58824 16.8824H16.4118C17.2874 16.8824 18 16.1698 18 15.2941V6.82353C18 5.94788 17.2874 5.23529 16.4118 5.23529Z", fill: "currentColor" }) });
-function un() {
-  const [e, t] = x(!1), [o, i] = x(!1), [s, a] = x(!1), l = g(), c = b("playing"), u = ie(), { t: d } = _(), f = p(() => {
+const hn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.76472 10.5294C5.05696 10.5294 5.29413 10.2922 5.29413 9.99999V8.94117C5.29413 8.64893 5.05696 8.41175 4.76472 8.41175H3.7059C3.41366 8.41175 3.17649 8.64893 3.17649 8.94117V9.99999C3.17649 10.2922 3.41366 10.5294 3.7059 10.5294H4.76472ZM11.1177 10.5294C11.4099 10.5294 11.6471 10.2922 11.6471 9.99999V8.94117C11.6471 8.64893 11.4099 8.41175 11.1177 8.41175H10.0588C9.76661 8.41175 9.52944 8.64893 9.52944 8.94117V9.99999C9.52944 10.2922 9.76661 10.5294 10.0588 10.5294H11.1177ZM14.8235 9.99999C14.8235 10.2922 14.5864 10.5294 14.2941 10.5294H13.2353C12.9431 10.5294 12.7059 10.2922 12.7059 9.99999V8.94117C12.7059 8.64893 12.9431 8.41175 13.2353 8.41175H14.2941C14.5864 8.41175 14.8235 8.64893 14.8235 8.94117V9.99999ZM14.8235 13.1765C14.8235 13.4687 14.5864 13.7059 14.2941 13.7059H13.2353C12.9431 13.7059 12.7059 13.4687 12.7059 13.1765V12.1176C12.7059 11.8254 12.9431 11.5882 13.2353 11.5882H14.2941C14.5864 11.5882 14.8235 11.8254 14.8235 12.1176V13.1765ZM11.6471 13.1765C11.6471 13.4687 11.4099 13.7059 11.1177 13.7059H6.88239C6.59015 13.7059 6.35297 13.4687 6.35297 13.1765V12.1176C6.35297 11.8254 6.59015 11.5882 6.88239 11.5882H11.1177C11.4099 11.5882 11.6471 11.8254 11.6471 12.1176V13.1765ZM5.29413 13.1765C5.29413 13.4687 5.05696 13.7059 4.76472 13.7059H3.7059C3.41366 13.7059 3.17649 13.4687 3.17649 13.1765V12.1176C3.17649 11.8254 3.41366 11.5882 3.7059 11.5882H4.76472C5.05696 11.5882 5.29413 11.8254 5.29413 12.1176V13.1765ZM6.88238 8.41175C6.59015 8.41175 6.35297 8.64893 6.35297 8.94117V9.99999C6.35297 10.2922 6.59015 10.5294 6.88238 10.5294H7.94121C8.23344 10.5294 8.47062 10.2922 8.47062 9.99999V8.94117C8.47062 8.64893 8.23344 8.41175 7.94121 8.41175H6.88238ZM16.4118 5.23529H9.57494C9.71471 4.42 10.1933 4.17118 10.8254 3.85565C11.6629 3.43741 12.7059 2.91541 12.7059 1H11.6471C11.6471 2.26106 11.1039 2.53212 10.3511 2.90906C9.59824 3.28494 8.68659 3.75506 8.50871 5.23529H1.58824C0.712588 5.23529 0 5.94788 0 6.82353V15.2941C0 16.1698 0.712588 16.8824 1.58824 16.8824H16.4118C17.2874 16.8824 18 16.1698 18 15.2941V6.82353C18 5.94788 17.2874 5.23529 16.4118 5.23529Z", fill: "currentColor" }) });
+function pn() {
+  const [e, t] = k(!1), [o, i] = k(!1), [s, a] = k(!1), l = v(), c = g("playing"), u = de(), { t: d } = h(), _ = f(() => {
     t(!0), l.disableInteractions(), c && (a(!0), u.pause());
-  }, [c, u, l]), v = p(() => {
+  }, [c, u, l]), b = f(() => {
     t(!1), i(!0), l.enableInteractions(), s && (a(!1), u.play());
-  }, [s, u, l]), w = p(
+  }, [s, u, l]), w = f(
     (y) => o && (y == null ? void 0 : y.focus()),
     [o]
   );
-  return e ? /* @__PURE__ */ n(en, { onClose: v }) : /* @__PURE__ */ r("div", { className: S.controlsOverlay, children: [
+  return e ? /* @__PURE__ */ n(sn, { onClose: b }) : /* @__PURE__ */ r("div", { className: A.controlsOverlay, children: [
     /* @__PURE__ */ n(
       "button",
       {
         ref: w,
         "aria-label": d("KEYBOARD_SHORTCUTS"),
         type: "button",
-        className: `${S.controlsButton} ${S.keyboardShortcutsButton}`,
-        onClick: f,
+        className: `${A.controlsButton} ${A.keyboardShortcutsButton}`,
+        onClick: _,
         tabIndex: l.state.interactionsDisabled ? -1 : 0,
-        children: /* @__PURE__ */ n(cn, {})
+        children: /* @__PURE__ */ n(hn, {})
       }
     ),
-    /* @__PURE__ */ n(rn, {})
+    /* @__PURE__ */ n(mn, {})
   ] });
 }
-const Ke = (e) => /* @__PURE__ */ r("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
+const Ye = (e) => /* @__PURE__ */ r("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
   /* @__PURE__ */ n("defs", { children: /* @__PURE__ */ n("clipPath", { id: "clip0_149_104418", children: /* @__PURE__ */ n("rect", { width: 24, height: 24, fill: "white" }) }) }),
   /* @__PURE__ */ n("g", { clipPath: "url(#clip0_149_104418)", children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M22.5 21.8125V2.3125C22.5 1.9 22.1625 1.5625 21.75 1.5625H2.25C1.8375 1.5625 1.5 1.9 1.5 2.3125V21.8125C1.5 22.225 1.8375 22.5625 2.25 22.5625H21.75C22.1625 22.5625 22.5 22.225 22.5 21.8125ZM21.75 0.0625C22.9905 0.0625 24 1.072 24 2.3125V21.8125C24 23.053 22.9905 24.0625 21.75 24.0625H2.25C1.0095 24.0625 0 23.053 0 21.8125V2.3125C0 1.072 1.0095 0.0625 2.25 0.0625H21.75ZM10.744 10.6709H8.74403V10.0042H6.07736V14.0042H8.74403V13.3375H10.744V14.6709C10.744 15.4042 10.144 16.0042 9.41069 16.0042H5.41069C4.67736 16.0042 4.07736 15.4042 4.07736 14.6709V9.33753C4.07736 8.6042 4.67736 8.0042 5.41069 8.0042H9.41069C10.144 8.0042 10.744 8.6042 10.744 9.33753V10.6709ZM19.8065 10.6709H17.8065V10.0042H15.1399V14.0042H17.8065V13.3375H19.8065V14.6709C19.8065 15.4042 19.2065 16.0042 18.4732 16.0042H14.4732C13.7399 16.0042 13.1399 15.4042 13.1399 14.6709V9.33753C13.1399 8.6042 13.7399 8.0042 14.4732 8.0042H18.4732C19.2065 8.0042 19.8065 8.6042 19.8065 9.33753V10.6709Z", fill: "currentColor" }) })
-] }), ze = (e) => /* @__PURE__ */ r("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
+] }), Xe = (e) => /* @__PURE__ */ r("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
   /* @__PURE__ */ n("defs", { children: /* @__PURE__ */ n("clipPath", { id: "clip0_149_104406", children: /* @__PURE__ */ n("rect", { width: 24, height: 24, fill: "white" }) }) }),
   /* @__PURE__ */ n("g", { clipPath: "url(#clip0_149_104406)", children: /* @__PURE__ */ n("path", { d: "M21.3333 0H2.66666C1.18666 0 0 1.35 0 3V21C0 22.65 1.18666 24 2.66666 24H21.3333C22.8 24 24 22.65 24 21V3C24 1.35 22.8 0 21.3333 0ZM10.6667 10.6667H8.66666V10H6V14H8.66666V13.3333H10.6667V14.6667C10.6667 15.4 10.0667 16 9.33334 16H5.33334C4.6 16 4 15.4 4 14.6667V9.33334C4 8.6 4.6 8 5.33334 8H9.33334C10.0667 8 10.6667 8.6 10.6667 9.33334V10.6667ZM20.0042 10.6667H18.0042V10H15.3375V14H18.0042V13.3333H20.0042V14.6667C20.0042 15.4 19.4042 16 18.6708 16H14.6708C13.9375 16 13.3375 15.4 13.3375 14.6667V9.33334C13.3375 8.6 13.9375 8 14.6708 8H18.6708C19.4042 8 20.0042 8.6 20.0042 9.33334V10.6667Z", fill: "currentColor" }) })
 ] });
-function dn() {
-  const e = ie(), t = b("textTrack"), o = b("hasCaptions"), i = t && ut(t), s = g(), a = p(
-    (l) => {
-      e.toggleCaptions(l.nativeEvent);
+function fn() {
+  const e = de(), t = g("textTrack"), o = g("hasCaptions"), i = t && _t(t), s = v(), { t: a } = h(), l = f(
+    (c) => {
+      e.toggleCaptions(c.nativeEvent);
     },
     [e]
   );
@@ -475,25 +492,25 @@ function dn() {
     {
       type: "button",
       className: "controls-button",
-      onClick: a,
-      "aria-label": "Captions",
+      onClick: l,
+      "aria-label": a(i ? "CAPTIONS_DISABLE" : "CAPTIONS_ENABLE"),
       "aria-pressed": i ? "true" : "false",
       tabIndex: s.state.interactionsDisabled ? -1 : 0,
-      children: i ? /* @__PURE__ */ n(ze, { className: "controls-button-icon" }) : /* @__PURE__ */ n(Ke, { className: "controls-button-icon" })
+      children: i ? /* @__PURE__ */ n(Xe, { className: "controls-button-icon" }) : /* @__PURE__ */ n(Ye, { className: "controls-button-icon" })
     }
   ) : null;
 }
-const mn = "_captions_1cu0g_1", hn = {
-  captions: mn
-}, pn = (e, t) => e ? t.top : t.bottom;
-function Ue({ captions: e }) {
-  const t = e.length > 0, o = g(), { captionOffsetOverride: i } = L(), s = o.state.captionPositionOnTop, a = pn(
+const _n = "_captions_1cu0g_1", Cn = {
+  captions: _n
+}, gn = (e, t) => e ? t.top : t.bottom;
+function Je({ captions: e }) {
+  const t = e.length > 0, o = v(), { captionOffsetOverride: i } = L(), s = o.state.captionPositionOnTop, a = gn(
     s,
     i ?? {}
   );
   return /* @__PURE__ */ r(X, { children: [
     e.map((l) => /* @__PURE__ */ n(
-      dt,
+      Ct,
       {
         kind: "subtitles",
         type: l.type,
@@ -514,27 +531,27 @@ function Ue({ captions: e }) {
           "--captions-color": o.state.captionsInvertColors ? "rgba(22, 22, 22)" : "white",
           "--captions-background-color": o.state.captionsInvertColors ? "rgba(255, 255, 255, 0.75)" : "rgba(22, 22, 22, 0.75)"
         },
-        children: /* @__PURE__ */ n(mt, { className: hn.captions })
+        children: /* @__PURE__ */ n(gt, { className: Cn.captions })
       }
     ) : null
   ] });
 }
-function $e(e) {
+function et(e) {
   var t, o, i = "";
   if (typeof e == "string" || typeof e == "number") i += e;
   else if (typeof e == "object") if (Array.isArray(e)) {
     var s = e.length;
-    for (t = 0; t < s; t++) e[t] && (o = $e(e[t])) && (i && (i += " "), i += o);
+    for (t = 0; t < s; t++) e[t] && (o = et(e[t])) && (i && (i += " "), i += o);
   } else for (o in e) e[o] && (i && (i += " "), i += o);
   return i;
 }
-function oe() {
-  for (var e, t, o = 0, i = "", s = arguments.length; o < s; o++) (e = arguments[o]) && (t = $e(e)) && (i && (i += " "), i += t);
+function ue() {
+  for (var e, t, o = 0, i = "", s = arguments.length; o < s; o++) (e = arguments[o]) && (t = et(e)) && (i && (i += " "), i += t);
   return i;
 }
-const $ = [0.5, 0.75, 1, 1.25, 1.5, 2], _n = [0.5, 1, 2, 3, 4], fn = 5, Cn = (e) => {
-  const [, t] = x({});
-  return A(() => {
+const Y = [0.5, 0.75, 1, 1.25, 1.5, 2], bn = [0.5, 1, 2, 3, 4], vn = 5, wn = (e) => {
+  const [, t] = k({});
+  return D(() => {
     let o = [];
     return {
       add(i) {
@@ -551,20 +568,20 @@ const $ = [0.5, 0.75, 1, 1.25, 1.5, 2], _n = [0.5, 1, 2, 3, 4], fn = 5, Cn = (e)
       }
     };
   }, []);
-}, bn = (e, t, o) => {
+}, yn = (e, t, o) => {
   let i = !1;
   return (s) => {
     const a = s.detail.currentTime;
     a >= e.timestamp && a < e.timestamp + t && !i && (o.add(e), i = !0), (a < e.timestamp || a >= e.timestamp + t) && i && (o.remove(e), i = !1);
   };
-}, gn = (e, t = 5) => {
-  const o = T(), i = Cn(t);
-  return F(() => {
+}, kn = (e, t = 5) => {
+  const o = S(), i = wn(t);
+  return Z(() => {
     if (!o)
       return;
     const s = [];
     for (const a of e) {
-      const l = bn(a, fn, i);
+      const l = yn(a, vn, i);
       s.push(l), o.addEventListener("time-update", l);
     }
     return o.dispatchEvent(
@@ -577,55 +594,55 @@ const $ = [0.5, 0.75, 1, 1.25, 1.5, 2], _n = [0.5, 1, 2, 3, 4], fn = 5, Cn = (e)
       i.clear();
     };
   }, [o, i, e]), i;
-}, vn = "_comments-overlay_bymws_1", wn = "_comments-container_bymws_10", kn = "_kebab_bymws_20", yn = "_comment_bymws_1", Ln = "_comment-text_bymws_51", Mn = "_comment-author-avatar_bymws_71", xn = "_comment-author-name_bymws_95", O = {
+}, Ln = "_comments-overlay_bymws_1", xn = "_comments-container_bymws_10", Mn = "_kebab_bymws_20", Pn = "_comment_bymws_1", Nn = "_comment-text_bymws_51", In = "_comment-author-avatar_bymws_71", En = "_comment-author-name_bymws_95", K = {
   "comments-overlay": "_comments-overlay_bymws_1",
-  commentsOverlay: vn,
+  commentsOverlay: Ln,
   "comments-container": "_comments-container_bymws_10",
-  commentsContainer: wn,
-  kebab: kn,
-  comment: yn,
+  commentsContainer: xn,
+  kebab: Mn,
+  comment: Pn,
   "comment-text": "_comment-text_bymws_51",
-  commentText: Ln,
+  commentText: Nn,
   "comment-author-avatar": "_comment-author-avatar_bymws_71",
-  commentAuthorAvatar: Mn,
+  commentAuthorAvatar: In,
   "comment-author-name": "_comment-author-name_bymws_95",
-  commentAuthorName: xn
+  commentAuthorName: En
 };
-function Pn({ comment: e }) {
-  return e.render ? e.render(e, O) : /* @__PURE__ */ r("div", { className: O.comment, onClick: () => {
+function Tn({ comment: e }) {
+  return e.render ? e.render(e, K) : /* @__PURE__ */ r("div", { className: K.comment, onClick: () => {
     var t;
     return (t = e.onClick) == null ? void 0 : t.call(e, e);
   }, children: [
     /* @__PURE__ */ n(
       "img",
       {
-        className: O.commentAuthorAvatar,
+        className: K.commentAuthorAvatar,
         src: e.user.avatar,
         alt: e.user.name
       }
     ),
-    /* @__PURE__ */ n("span", { className: O.commentText, children: e.text }),
-    /* @__PURE__ */ n("span", { className: O.commentAuthorName, children: e.user.name })
+    /* @__PURE__ */ n("span", { className: K.commentText, children: e.text }),
+    /* @__PURE__ */ n("span", { className: K.commentAuthorName, children: e.user.name })
   ] });
 }
-const Nn = 4;
-function In({
+const An = 4;
+function Sn({
   comments: e,
   isKebabMenuVisible: t
 }) {
-  const o = g(), i = gn(e, Nn), s = !!b("textTrack"), a = i.map((l) => /* @__PURE__ */ n(Pn, { comment: l }, l.id));
+  const o = v(), i = kn(e, An), s = !!g("textTrack"), a = i.map((l) => /* @__PURE__ */ n(Tn, { comment: l }, l.id));
   return e.length > 0 && o.state.commentsEnabled ? /* @__PURE__ */ n(
     "div",
     {
-      className: O.commentsOverlay,
+      className: K.commentsOverlay,
       style: {
         flexDirection: o.state.captionPositionOnTop && s ? "column-reverse" : "column"
       },
       children: /* @__PURE__ */ n(
         "div",
         {
-          className: oe(O.commentsContainer, {
-            [O.kebab]: t
+          className: ue(K.commentsContainer, {
+            [K.kebab]: t
           }),
           children: s ? a.slice(-3) : a
         }
@@ -633,74 +650,71 @@ function In({
     }
   ) : null;
 }
-const Sn = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.0692 12C21.0692 11.4776 21.0212 10.944 20.9238 10.4104L23.5511 8.13318L21.0579 3.87247L17.7431 4.97788C16.9059 4.28329 15.9515 3.73553 14.9449 3.37271L14.2616 0H9.28941L8.60612 3.37129C7.58823 3.73553 6.65082 4.27482 5.80659 4.97647L2.49318 3.87247L0 8.13318L2.62729 10.4104C2.52988 10.944 2.48188 11.4776 2.48188 12C2.48188 12.5224 2.52988 13.056 2.62729 13.5896L0 15.8668L2.49318 20.1275L5.808 19.0221C6.64518 19.7167 7.59953 20.2645 8.60612 20.6273L9.28941 24H14.2616L14.9449 20.6287C15.9614 20.2645 16.9002 19.7252 17.7445 19.0235L21.0579 20.1289L23.5511 15.8682L20.9238 13.5911C21.0212 13.056 21.0692 12.5224 21.0692 12ZM11.7755 16.9412C9.05082 16.9412 6.83435 14.7247 6.83435 12C6.83435 9.2753 9.05082 7.05883 11.7755 7.05883C14.5002 7.05883 16.7167 9.2753 16.7167 12C16.7167 14.7247 14.5002 16.9412 11.7755 16.9412Z", fill: "currentColor" }) }), En = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), Vn = "_settings-menu_gl385_1", Tn = "_menu-container_gl385_37", Hn = "_scrollable-buttons_gl385_38", An = "_menu-heading_gl385_45", Rn = "_check-icon_gl385_56", Bn = "_trash-icon_gl385_57", On = "_menu-item-label_gl385_70", Fn = "_menu-item_gl385_70", Zn = "_menu-back-button_gl385_107", Dn = "_arrow_gl385_133", E = {
-  "settings-menu": "_settings-menu_gl385_1",
-  settingsMenu: Vn,
-  "menu-container": "_menu-container_gl385_37",
-  menuContainer: Tn,
-  "scrollable-buttons": "_scrollable-buttons_gl385_38",
-  scrollableButtons: Hn,
-  "menu-heading": "_menu-heading_gl385_45",
-  menuHeading: An,
-  "check-icon": "_check-icon_gl385_56",
-  checkIcon: Rn,
-  "trash-icon": "_trash-icon_gl385_57",
-  trashIcon: Bn,
-  "menu-item-label": "_menu-item-label_gl385_70",
-  menuItemLabel: On,
-  "menu-item": "_menu-item_gl385_70",
-  menuItem: Fn,
-  "menu-back-button": "_menu-back-button_gl385_107",
-  menuBackButton: Zn,
-  arrow: Dn
+function Vn({ renderOverlay: e }) {
+  const t = v();
+  return e(t);
+}
+const Rn = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.0692 12C21.0692 11.4776 21.0212 10.944 20.9238 10.4104L23.5511 8.13318L21.0579 3.87247L17.7431 4.97788C16.9059 4.28329 15.9515 3.73553 14.9449 3.37271L14.2616 0H9.28941L8.60612 3.37129C7.58823 3.73553 6.65082 4.27482 5.80659 4.97647L2.49318 3.87247L0 8.13318L2.62729 10.4104C2.52988 10.944 2.48188 11.4776 2.48188 12C2.48188 12.5224 2.52988 13.056 2.62729 13.5896L0 15.8668L2.49318 20.1275L5.808 19.0221C6.64518 19.7167 7.59953 20.2645 8.60612 20.6273L9.28941 24H14.2616L14.9449 20.6287C15.9614 20.2645 16.9002 19.7252 17.7445 19.0235L21.0579 20.1289L23.5511 15.8682L20.9238 13.5911C21.0212 13.056 21.0692 12.5224 21.0692 12ZM11.7755 16.9412C9.05082 16.9412 6.83435 14.7247 6.83435 12C6.83435 9.2753 9.05082 7.05883 11.7755 7.05883C14.5002 7.05883 16.7167 9.2753 16.7167 12C16.7167 14.7247 14.5002 16.9412 11.7755 16.9412Z", fill: "currentColor" }) }), Hn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), Bn = "_settings-menu_1gbpr_1", On = "_menu-heading_1gbpr_37", Fn = "_check-icon_1gbpr_48", Dn = "_trash-icon_1gbpr_49", Zn = "_menu-item-label_1gbpr_62", jn = "_menu-item_1gbpr_62", Kn = "_menu-back-button_1gbpr_99", zn = "_arrow_1gbpr_125", F = {
+  "settings-menu": "_settings-menu_1gbpr_1",
+  settingsMenu: Bn,
+  "menu-heading": "_menu-heading_1gbpr_37",
+  menuHeading: On,
+  "check-icon": "_check-icon_1gbpr_48",
+  checkIcon: Fn,
+  "trash-icon": "_trash-icon_1gbpr_49",
+  trashIcon: Dn,
+  "menu-item-label": "_menu-item-label_1gbpr_62",
+  menuItemLabel: Zn,
+  "menu-item": "_menu-item_1gbpr_62",
+  menuItem: jn,
+  "menu-back-button": "_menu-back-button_1gbpr_99",
+  menuBackButton: Kn,
+  arrow: zn
 };
-function z({
-  label: e,
-  noBackButton: t,
-  heading: o,
-  children: i
+function q({
+  noBackButton: e,
+  heading: t,
+  children: o
 }) {
-  const s = R(), a = Io(), { t: l } = _();
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      ref: a,
-      id: "submenu",
-      "aria-label": e,
-      role: "menu",
-      className: E.menuContainer,
-      children: [
-        !t && /* @__PURE__ */ r(
-          "button",
-          {
-            type: "button",
-            role: "menuitem",
-            tabIndex: -1,
-            className: E.menuBackButton,
-            onClick: s.back,
-            children: [
-              /* @__PURE__ */ n(En, {}),
-              /* @__PURE__ */ n("span", { children: l("BACK") })
-            ]
-          }
-        ),
-        o && /* @__PURE__ */ n("strong", { role: "presentation", className: E.menuHeading, children: o }),
-        /* @__PURE__ */ n("div", { role: "presentation", className: E.scrollableButtons, children: i })
-      ]
-    }
-  );
+  const i = $(), { t: s } = h();
+  return /* @__PURE__ */ r(X, { children: [
+    !e && /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        role: "menuitem",
+        tabIndex: -1,
+        className: F.menuBackButton,
+        onClick: i.back,
+        children: [
+          /* @__PURE__ */ n(Hn, {}),
+          /* @__PURE__ */ n("span", { children: s("BACK") })
+        ]
+      }
+    ),
+    t && /* @__PURE__ */ n(
+      "strong",
+      {
+        role: "presentation",
+        id: "menu-heading",
+        className: F.menuHeading,
+        children: t
+      }
+    ),
+    o
+  ] });
 }
-const jn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), Kn = "_menu-hint_1wiu5_1", zn = "_menu-button_1wiu5_5", Un = "_menu-label_1wiu5_37", $n = "_menu-icon_1wiu5_42", te = {
+const $n = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), Un = "_menu-hint_1wiu5_1", qn = "_menu-button_1wiu5_5", Gn = "_menu-label_1wiu5_37", Qn = "_menu-icon_1wiu5_42", le = {
   "menu-hint": "_menu-hint_1wiu5_1",
-  menuHint: Kn,
+  menuHint: Un,
   "menu-button": "_menu-button_1wiu5_5",
-  menuButton: zn,
+  menuButton: qn,
   "menu-label": "_menu-label_1wiu5_37",
-  menuLabel: Un,
+  menuLabel: Gn,
   "menu-icon": "_menu-icon_1wiu5_42",
-  menuIcon: $n
+  menuIcon: Qn
 };
-function G({ label: e, hint: t, onClick: o, Icon: i }) {
+function J({ label: e, hint: t, onClick: o, Icon: i }) {
   return /* @__PURE__ */ r(
     "button",
     {
@@ -709,32 +723,32 @@ function G({ label: e, hint: t, onClick: o, Icon: i }) {
       "aria-haspopup": "true",
       tabIndex: -1,
       onClick: o,
-      className: te.menuButton,
+      className: le.menuButton,
       children: [
-        i && /* @__PURE__ */ n(i, { className: te.menuIcon }),
-        /* @__PURE__ */ n("span", { className: te.menuLabel, children: e }),
-        t && /* @__PURE__ */ n("span", { className: te.menuHint, children: t }),
-        /* @__PURE__ */ n(jn, {})
+        i && /* @__PURE__ */ n(i, { className: le.menuIcon }),
+        /* @__PURE__ */ n("span", { className: le.menuLabel, children: e }),
+        t && /* @__PURE__ */ n("span", { className: le.menuHint, children: t }),
+        /* @__PURE__ */ n($n, {})
       ]
     }
   );
 }
-const qn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.42229 2.82911C4.71149 1.83006 6.23876 1.19768 7.8383 1L7.96797 2.05432C6.55867 2.22862 5.21101 2.7866 4.07273 3.66874L3.42229 2.82911ZM5.44493 6.71393L9.49745 10.7665L17.0924 3.1705L17.8438 3.92297L9.49745 12.2693L4.69352 7.46534L5.44493 6.71393ZM17.932 8.83829C17.8618 8.27074 17.7364 7.70745 17.5589 7.16222L16.5482 7.49276C16.7055 7.97209 16.816 8.46843 16.8766 8.96689C16.917 9.29742 16.9372 9.6269 16.9372 9.96594C16.9372 10.305 16.917 10.6344 16.8777 10.9639C16.7033 12.3732 16.1454 13.7209 15.2632 14.8592L16.1029 15.5096C17.1019 14.2204 17.7343 12.6931 17.932 11.0925C17.9766 10.7205 18 10.3486 18 9.96594C18 9.58332 17.9766 9.21134 17.932 8.83829ZM1.05432 8.96795L0 8.83829C0.197684 7.23874 0.830061 5.71147 1.82911 4.42228L2.66874 5.07272C1.7866 6.211 1.22862 7.55865 1.05432 8.96795ZM0 11.0936C0.197684 12.6931 0.830061 14.2204 1.82911 15.5096L2.66874 14.8591C1.7866 13.7209 1.22862 12.3732 1.05432 10.9639L0 11.0936ZM10.0939 1.00011C11.6935 1.19673 13.2207 1.83017 14.5099 2.82922L13.8595 3.66884C12.7202 2.7867 11.3736 2.22872 9.96426 2.05442L10.0939 1.00011Z", fill: "currentColor" }) });
-function Gn() {
-  const e = R(), t = b("playbackRate"), { t: o } = _(), i = p(() => {
+const Wn = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.42229 2.82911C4.71149 1.83006 6.23876 1.19768 7.8383 1L7.96797 2.05432C6.55867 2.22862 5.21101 2.7866 4.07273 3.66874L3.42229 2.82911ZM5.44493 6.71393L9.49745 10.7665L17.0924 3.1705L17.8438 3.92297L9.49745 12.2693L4.69352 7.46534L5.44493 6.71393ZM17.932 8.83829C17.8618 8.27074 17.7364 7.70745 17.5589 7.16222L16.5482 7.49276C16.7055 7.97209 16.816 8.46843 16.8766 8.96689C16.917 9.29742 16.9372 9.6269 16.9372 9.96594C16.9372 10.305 16.917 10.6344 16.8777 10.9639C16.7033 12.3732 16.1454 13.7209 15.2632 14.8592L16.1029 15.5096C17.1019 14.2204 17.7343 12.6931 17.932 11.0925C17.9766 10.7205 18 10.3486 18 9.96594C18 9.58332 17.9766 9.21134 17.932 8.83829ZM1.05432 8.96795L0 8.83829C0.197684 7.23874 0.830061 5.71147 1.82911 4.42228L2.66874 5.07272C1.7866 6.211 1.22862 7.55865 1.05432 8.96795ZM0 11.0936C0.197684 12.6931 0.830061 14.2204 1.82911 15.5096L2.66874 14.8591C1.7866 13.7209 1.22862 12.3732 1.05432 10.9639L0 11.0936ZM10.0939 1.00011C11.6935 1.19673 13.2207 1.83017 14.5099 2.82922L13.8595 3.66884C12.7202 2.7867 11.3736 2.22872 9.96426 2.05442L10.0939 1.00011Z", fill: "currentColor" }) });
+function Yn() {
+  const e = $(), t = g("playbackRate"), { t: o } = h(), i = f(() => {
     e.setPage("speed");
   }, [e]);
   return /* @__PURE__ */ n(
-    G,
+    J,
     {
       label: o("PLAYBACK_SPEED"),
       hint: `${t}x`,
       onClick: i,
-      Icon: qn
+      Icon: Wn
     }
   );
 }
-const Wn = (e) => /* @__PURE__ */ r("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
+const Xn = (e) => /* @__PURE__ */ r("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
   /* @__PURE__ */ n("defs", { children: /* @__PURE__ */ n("clipPath", { id: "clip0_412_23039", children: /* @__PURE__ */ n("rect", { width: 18, height: 18, fill: "white" }) }) }),
   /* @__PURE__ */ r("g", { clipPath: "url(#clip0_412_23039)", children: [
     /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.46326 3.85039H0V2.65039H2.46326C2.7388 1.36449 3.88181 0.400391 5.24999 0.400391C6.61818 0.400391 7.76119 1.36449 8.03673 2.65039H18V3.85039H8.03673C7.76119 5.13629 6.61818 6.10039 5.24999 6.10039C3.88181 6.10039 2.7388 5.13629 2.46326 3.85039ZM3.59999 3.25039C3.59999 2.33912 4.33872 1.60039 5.24999 1.60039C6.16126 1.60039 6.89999 2.33912 6.89999 3.25039C6.89999 4.16166 6.16126 4.90039 5.24999 4.90039C4.33872 4.90039 3.59999 4.16166 3.59999 3.25039Z", fill: "currentColor" }),
@@ -742,49 +756,59 @@ const Wn = (e) => /* @__PURE__ */ r("svg", { width: 18, height: 18, viewBox: "0
     /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.24999 17.6004C6.61818 17.6004 7.76119 16.6363 8.03673 15.3504H18V14.1504H8.03673C7.76119 12.8645 6.61818 11.9004 5.24999 11.9004C3.88181 11.9004 2.7388 12.8645 2.46326 14.1504H0V15.3504H2.46326C2.7388 16.6363 3.88181 17.6004 5.24999 17.6004ZM5.24999 13.1004C4.33872 13.1004 3.59999 13.8391 3.59999 14.7504C3.59999 15.6617 4.33872 16.4004 5.24999 16.4004C6.16126 16.4004 6.89999 15.6617 6.89999 14.7504C6.89999 13.8391 6.16126 13.1004 5.24999 13.1004Z", fill: "currentColor" })
   ] })
 ] });
-function Qn() {
-  const e = R(), t = b("autoQuality"), o = b("quality"), { t: i } = _(), s = p(() => {
+function tt(e) {
+  const { width: t, height: o } = e;
+  if (t >= 3800 || o >= 2100)
+    return "2160p";
+  const i = o > t, s = i ? t : o, a = i ? o : t;
+  return s >= 1400 || a >= 2500 ? "1440p" : s >= 1e3 || a >= 1800 ? "1080p" : s >= 700 || a >= 1200 ? "720p" : s >= 460 || a >= 800 ? "480p" : s >= 300 || a >= 540 ? "360p" : s >= 200 || a >= 360 ? "240p" : "144p";
+}
+function Jn() {
+  const e = $(), t = g("autoQuality"), o = g("quality"), { t: i } = h(), s = f(() => {
     e.setPage("quality");
   }, [e]);
-  return o ? /* @__PURE__ */ n(
-    G,
+  if (!o)
+    return null;
+  const a = tt(o);
+  return /* @__PURE__ */ n(
+    J,
     {
       label: i("QUALITY"),
-      hint: t ? i("AUTO", { quality: o.height }) : `${o.height}p`,
+      hint: t ? i("AUTO", { quality: a }) : a,
       onClick: s,
-      Icon: Wn
+      Icon: Xn
     }
-  ) : null;
+  );
 }
-function Yn() {
-  const e = R(), t = b("hasCaptions"), o = b("textTrack"), { t: i } = _(), s = p(() => {
+function eo() {
+  const e = $(), t = g("hasCaptions"), o = g("textTrack"), { t: i } = h(), s = f(() => {
     e.setPage("captions");
   }, [e]);
   return t ? /* @__PURE__ */ n(
-    G,
+    J,
     {
       label: i("CAPTIONS"),
       hint: (o == null ? void 0 : o.label) ?? i("OFF"),
       onClick: s,
-      Icon: Ke
+      Icon: Ye
     }
   ) : null;
 }
-const Xn = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 21.798373,3.342155 8.8843977,16.256145 2.2000774,9.571825 0,11.771895 8.8843977,20.657845 24,5.543795 Z", fill: "currentColor" }) }), Jn = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 9.64706,12 4,17.64706 6.35293,20 12,14.35293 17.64706,20 20,17.64706 14.35293,12 20,6.35293 17.64706,4 12,9.64706 6.35293,4 4,6.35293 Z", fill: "currentColor" }) }), eo = "_switch-track_7nhpo_1", to = "_switch-thumb_7nhpo_17", no = "_switch-icon_7nhpo_31", oo = "_switch-body_7nhpo_37", io = "_switch-label_7nhpo_78", so = "_menu-icon_7nhpo_82", K = {
+const to = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 21.798373,3.342155 8.8843977,16.256145 2.2000774,9.571825 0,11.771895 8.8843977,20.657845 24,5.543795 Z", fill: "currentColor" }) }), no = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 9.64706,12 4,17.64706 6.35293,20 12,14.35293 17.64706,20 20,17.64706 14.35293,12 20,6.35293 17.64706,4 12,9.64706 6.35293,4 4,6.35293 Z", fill: "currentColor" }) }), oo = "_switch-track_7nhpo_1", io = "_switch-thumb_7nhpo_17", so = "_switch-icon_7nhpo_31", ao = "_switch-body_7nhpo_37", lo = "_switch-label_7nhpo_78", ro = "_menu-icon_7nhpo_82", U = {
   "switch-track": "_switch-track_7nhpo_1",
-  switchTrack: eo,
+  switchTrack: oo,
   "switch-thumb": "_switch-thumb_7nhpo_17",
-  switchThumb: to,
+  switchThumb: io,
   "switch-icon": "_switch-icon_7nhpo_31",
-  switchIcon: no,
+  switchIcon: so,
   "switch-body": "_switch-body_7nhpo_37",
-  switchBody: oo,
+  switchBody: ao,
   "switch-label": "_switch-label_7nhpo_78",
-  switchLabel: io,
+  switchLabel: lo,
   "menu-icon": "_menu-icon_7nhpo_82",
-  menuIcon: so
+  menuIcon: ro
 };
-function Ce({
+function Te({
   label: e,
   checked: t = !1,
   onClick: o,
@@ -793,44 +817,43 @@ function Ce({
   return /* @__PURE__ */ r(
     "button",
     {
-      className: K.switchBody,
-      role: "checkbox",
+      className: U.switchBody,
+      role: "menuitemcheckbox",
       "aria-label": e,
       "aria-checked": t,
       onClick: o,
       tabIndex: -1,
       children: [
-        i && /* @__PURE__ */ n(i, { className: K.menuIcon }),
-        /* @__PURE__ */ n("span", { className: K.switchLabel, children: e }),
-        /* @__PURE__ */ n("div", { className: K.switchTrack, children: /* @__PURE__ */ n("div", { className: K.switchThumb, children: t ? /* @__PURE__ */ n(Xn, { className: K.switchIcon }) : /* @__PURE__ */ n(Jn, { className: K.switchIcon }) }) })
+        i && /* @__PURE__ */ n(i, { className: U.menuIcon }),
+        /* @__PURE__ */ n("span", { className: U.switchLabel, children: e }),
+        /* @__PURE__ */ n("div", { className: U.switchTrack, children: /* @__PURE__ */ n("div", { className: U.switchThumb, children: t ? /* @__PURE__ */ n(to, { className: U.switchIcon }) : /* @__PURE__ */ n(no, { className: U.switchIcon }) }) })
       ]
     }
   );
 }
-const ao = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1 0V12.7489H5.44V18L10.5007 12.7489H16.582V0H1ZM2 1H15.58V11.7339H9.98655L6.52667 15.25V11.7339H2V1ZM5.24963 5.35011H12.3323V4.24835H5.24963V5.35011ZM5.24963 8.18462H9.50067V7.08285H5.24963V8.18462Z", fill: "currentColor" }) });
-function lo() {
-  const { t: e } = _(), t = L(), o = g();
+const co = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1 0V12.7489H5.44V18L10.5007 12.7489H16.582V0H1ZM2 1H15.58V11.7339H9.98655L6.52667 15.25V11.7339H2V1ZM5.24963 5.35011H12.3323V4.24835H5.24963V5.35011ZM5.24963 8.18462H9.50067V7.08285H5.24963V8.18462Z", fill: "currentColor" }) });
+function uo() {
+  const { t: e } = h(), t = L(), o = v();
   return !t.forceComments && t.hasComments ? /* @__PURE__ */ n(
-    Ce,
+    Te,
     {
-      Icon: ao,
+      Icon: co,
       label: e("COMMENTS"),
       onClick: o.toggleComments,
       checked: o.state.commentsEnabled
     }
   ) : null;
 }
-function ro() {
-  const { t: e } = _();
-  return /* @__PURE__ */ r(z, { label: e("MAIN_MENU"), noBackButton: !0, children: [
-    /* @__PURE__ */ n(Gn, {}),
+function mo() {
+  return /* @__PURE__ */ r(q, { noBackButton: !0, children: [
     /* @__PURE__ */ n(Yn, {}),
-    /* @__PURE__ */ n(lo, {}),
-    /* @__PURE__ */ n(Qn, {})
+    /* @__PURE__ */ n(eo, {}),
+    /* @__PURE__ */ n(uo, {}),
+    /* @__PURE__ */ n(Jn, {})
   ] });
 }
-const co = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.1347 3.00061L6.55157 13.5825L0.865302 7.89624L0 8.76154L6.55157 15.3131L17.9988 3.86469L17.1347 3.00061Z", fill: "currentColor" }) });
-function se({ selected: e, label: t, onClick: o }) {
+const ho = (e) => /* @__PURE__ */ n("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.1347 3.00061L6.55157 13.5825L0.865302 7.89624L0 8.76154L6.55157 15.3131L17.9988 3.86469L17.1347 3.00061Z", fill: "currentColor" }) });
+function pe({ selected: e, label: t, onClick: o }) {
   return /* @__PURE__ */ r(
     "button",
     {
@@ -839,21 +862,21 @@ function se({ selected: e, label: t, onClick: o }) {
       "aria-checked": e,
       onClick: o,
       tabIndex: -1,
-      className: E.menuItem,
+      className: F.menuItem,
       children: [
-        /* @__PURE__ */ n(co, { className: E.checkIcon }),
-        /* @__PURE__ */ n("span", { className: E.menuItemLabel, children: t })
+        /* @__PURE__ */ n(ho, { className: F.checkIcon }),
+        /* @__PURE__ */ n("span", { className: F.menuItemLabel, children: t })
       ]
     }
   );
 }
-function uo() {
-  const e = ht({
-    rates: $,
+function po() {
+  const e = bt({
+    rates: Y,
     normalLabel: "1x"
-  }), { t } = _();
-  return /* @__PURE__ */ n(z, { label: t("SPEED_MENU"), heading: t("PLAYBACK_SPEED"), children: e.map(({ value: o, label: i, select: s, selected: a }) => /* @__PURE__ */ n(
-    se,
+  }), { t } = h();
+  return /* @__PURE__ */ n(q, { heading: t("PLAYBACK_SPEED"), children: e.map(({ value: o, label: i, select: s, selected: a }) => /* @__PURE__ */ n(
+    pe,
     {
       selected: a,
       onClick: () => s(),
@@ -862,18 +885,18 @@ function uo() {
     o
   )) });
 }
-function mo() {
-  const e = R(), { t } = _(), o = p(() => {
+function fo() {
+  const e = $(), { t } = h(), o = f(() => {
     e.setPage("captionManage");
   }, [e]);
-  return /* @__PURE__ */ n(G, { label: t("CAPTIONS_MANAGE"), onClick: o });
+  return /* @__PURE__ */ n(J, { label: t("CAPTIONS_MANAGE"), onClick: o });
 }
-function ho() {
-  const { t: e } = _(), t = g(), o = R(), i = p(() => {
+function _o() {
+  const { t: e } = h(), t = v(), o = $(), i = f(() => {
     o.setPage("captionFontSize");
   }, [o]);
   return /* @__PURE__ */ n(
-    G,
+    J,
     {
       label: e("CAPTION_FONT_SIZE"),
       hint: `${t.state.captionsFontSizeMultiplier * 100}%`,
@@ -881,12 +904,12 @@ function ho() {
     }
   );
 }
-function po() {
-  const e = R(), t = b("textTrack"), { t: o } = _(), { disableCaptionSettings: i } = g(), s = p(() => {
+function Co() {
+  const e = $(), t = g("textTrack"), { t: o } = h(), { disableCaptionSettings: i } = v(), s = f(() => {
     e.setPage("captionLanguage");
   }, [e]);
   return i ? null : /* @__PURE__ */ n(
-    G,
+    J,
     {
       label: o("LANGUAGE"),
       hint: (t == null ? void 0 : t.label) ?? o("OFF"),
@@ -894,10 +917,10 @@ function po() {
     }
   );
 }
-function _o() {
-  const { t: e } = _(), t = g();
+function go() {
+  const { t: e } = h(), t = v();
   return /* @__PURE__ */ n(
-    Ce,
+    Te,
     {
       label: e("ON_TOP"),
       onClick: t.toggleCaptionPositionOnTop,
@@ -905,10 +928,10 @@ function _o() {
     }
   );
 }
-function fo() {
-  const { t: e } = _(), t = g();
+function bo() {
+  const { t: e } = h(), t = v();
   return /* @__PURE__ */ n(
-    Ce,
+    Te,
     {
       label: e("INVERT_COLORS"),
       onClick: t.toggleCaptionsInvertColors,
@@ -916,20 +939,20 @@ function fo() {
     }
   );
 }
-function Co() {
-  const e = L(), { t } = _();
-  return /* @__PURE__ */ r(z, { label: t("CAPTIONS_MENU"), heading: t("CAPTIONS"), children: [
-    /* @__PURE__ */ n(po, {}),
-    /* @__PURE__ */ n(ho, {}),
+function vo() {
+  const e = L(), { t } = h();
+  return /* @__PURE__ */ r(q, { heading: t("CAPTIONS"), children: [
+    /* @__PURE__ */ n(Co, {}),
     /* @__PURE__ */ n(_o, {}),
-    /* @__PURE__ */ n(fo, {}),
-    e.onCaptionsDelete && /* @__PURE__ */ n(mo, {})
+    /* @__PURE__ */ n(go, {}),
+    /* @__PURE__ */ n(bo, {}),
+    e.onCaptionsDelete && /* @__PURE__ */ n(fo, {})
   ] });
 }
-function bo() {
-  const e = pt(), { t } = _();
-  return /* @__PURE__ */ n(z, { label: t("CAPTIONS_LANGUAGE_MENU"), heading: t("CAPTIONS"), children: e.map(({ value: o, label: i, select: s, selected: a }) => /* @__PURE__ */ n(
-    se,
+function wo() {
+  const e = vt(), { t } = h();
+  return /* @__PURE__ */ n(q, { heading: t("CAPTIONS_LANGUAGE"), children: e.map(({ value: o, label: i, select: s, selected: a }) => /* @__PURE__ */ n(
+    pe,
     {
       selected: a,
       onClick: () => s(),
@@ -938,10 +961,10 @@ function bo() {
     o
   )) });
 }
-function go() {
-  const e = g(), { t } = _();
-  return /* @__PURE__ */ n(z, { label: t("CAPTIONS_FONT_SIZE_MENU"), heading: t("CAPTIONS"), children: _n.map((o) => /* @__PURE__ */ n(
-    se,
+function yo() {
+  const e = v(), { t } = h();
+  return /* @__PURE__ */ n(q, { heading: t("CAPTION_FONT_SIZE"), children: bn.map((o) => /* @__PURE__ */ n(
+    pe,
     {
       selected: o === e.state.captionsFontSizeMultiplier,
       onClick: () => {
@@ -952,19 +975,19 @@ function go() {
     o
   )) });
 }
-const R = () => {
-  const e = ue(qe);
+const $ = () => {
+  const e = ye(nt);
   if (!e)
     throw new Error(
       "useCustomSettingsMenuContext must be used within a CustomSettingsMenuContext.Provider"
     );
   return e;
 };
-function vo() {
-  const e = R(), t = L(), { t: o } = _();
-  return F(() => {
+function ko() {
+  const e = $(), t = L(), { t: o } = h();
+  return Z(() => {
     t.captions.length === 0 && e.backToMain();
-  }, [t.captions]), /* @__PURE__ */ n(z, { label: o("CAPTIONS_MANAGE_MENU"), heading: o("CAPTIONS_MANAGE"), children: t.captions.map((i) => /* @__PURE__ */ r(
+  }, [t.captions]), /* @__PURE__ */ n(q, { heading: o("CAPTIONS_MANAGE"), children: t.captions.map((i) => /* @__PURE__ */ r(
     "button",
     {
       type: "button",
@@ -974,122 +997,79 @@ function vo() {
         (s = t.onCaptionsDelete) == null || s.call(t, i);
       },
       tabIndex: -1,
-      className: E.menuItem,
+      className: F.menuItem,
       children: [
-        /* @__PURE__ */ n(je, { className: E.trashIcon }),
-        /* @__PURE__ */ n("span", { className: E.menuItemLabel, children: o("CAPTION_DELETE", { language: i.label }) })
+        /* @__PURE__ */ n(We, { className: F.trashIcon }),
+        /* @__PURE__ */ n("span", { className: F.menuItemLabel, children: o("CAPTION_DELETE", { language: i.label }) })
       ]
     },
     i.language
   )) });
 }
-function wo() {
-  const e = _t({ sort: "descending" }), t = b("autoQuality"), { t: o } = _();
-  return /* @__PURE__ */ n(z, { label: o("QUALITY_MENU"), heading: o("QUALITY"), children: e.map(({ value: i, label: s, select: a, selected: l }) => /* @__PURE__ */ n(
-    se,
+function Lo() {
+  const e = g("autoQuality"), t = wt({ sort: "descending" }), { t: o } = h();
+  return /* @__PURE__ */ n(q, { heading: o("QUALITY"), children: t.map(({ value: i, select: s, selected: a, label: l, quality: c }) => /* @__PURE__ */ n(
+    pe,
     {
-      selected: i === "auto" && t || l && !t,
-      onClick: () => a(),
-      label: s
+      selected: i === "auto" && e || a && !e,
+      onClick: () => s(),
+      label: c ? tt(c) : l
     },
     i
   )) });
 }
-const qe = ce(null), ko = {
-  main: ro,
-  speed: uo,
-  captions: Co,
-  captionLanguage: bo,
-  captionFontSize: go,
-  captionManage: vo,
-  quality: wo
-}, yo = {
-  name: "middleware",
-  async fn(e) {
-    const t = await Nt(e);
-    return {
-      x: e.x - t.right - 4,
-      y: e.y - 4
-    };
-  }
-};
-function Lo() {
-  const e = g(), [t, o] = x(["main"]), [i, s] = x(!1), a = p(() => {
-    s(!i), o(["main"]), e.setGlobalKeysDisabled(!i);
-  }, [i]), l = p((k) => {
-    o((I) => I.concat(k));
-  }, []), c = p(() => {
-    o((k) => k.length > 1 ? k.slice(0, -1) : k);
-  }, []), u = p(() => {
-    o(["main"]);
-  }, []), d = A(() => ko[t[t.length - 1]], [t]), { refs: f, floatingStyles: v, context: w } = de({
-    open: i,
-    onOpenChange: a,
-    placement: "top-end",
-    whileElementsMounted: me,
-    middleware: [yo]
-  }), y = he(w, { escapeKey: !1 }), { getReferenceProps: N, getFloatingProps: h } = pe([y]), C = A(
-    () => ({ setPage: l, back: c, backToMain: u, toggle: a }),
-    [l, c, u, a]
-  );
-  return {
-    Page: d,
-    open: i,
-    refs: f,
-    floatingStyles: v,
-    context: w,
-    getReferenceProps() {
-      return {
-        ...N(),
-        tabIndex: e.state.interactionsDisabled ? -1 : 0
-      };
-    },
-    getFloatingProps: h,
-    contextValue: C
-  };
-}
-function Mo(e, t) {
+function xo(e, t) {
   const o = Array.from(e.querySelectorAll("button")), i = o.indexOf(t);
   return o[i - 1] ?? null;
 }
-function xo(e, t) {
+function Mo(e, t) {
   const o = Array.from(e.querySelectorAll("button")), i = o.indexOf(t);
   return o[i + 1] ?? null;
 }
-function Po(e) {
+function Be(e) {
   return e.querySelector("button");
 }
-function No(e) {
+function Oe(e) {
   const t = Array.from(e.querySelectorAll("button"));
   return t[t.length - 1] ?? null;
 }
-function Io() {
-  const e = R(), t = q(null), o = A(
+function Po(e) {
+  const t = z(null), o = D(
     () => ({
       Escape: e.toggle,
       ArrowUp: () => {
         const i = document.activeElement;
         if (i && t.current && t.current.contains(i)) {
-          const s = Mo(
+          const s = xo(
             t.current,
             i
           );
-          s == null || s.focus();
+          if (s)
+            s.focus();
+          else {
+            const a = Oe(t.current);
+            a == null || a.focus();
+          }
         } else if (t.current) {
-          const s = No(t.current);
+          const s = Oe(t.current);
           s == null || s.focus();
         }
       },
       ArrowDown: () => {
         const i = document.activeElement;
         if (i && t.current && t.current.contains(i)) {
-          const s = xo(
+          const s = Mo(
             t.current,
             i
           );
-          s == null || s.focus();
+          if (s)
+            s.focus();
+          else {
+            const a = Be(t.current);
+            a == null || a.focus();
+          }
         } else if (t.current) {
-          const s = Po(t.current);
+          const s = Be(t.current);
           s == null || s.focus();
         }
       },
@@ -1101,9 +1081,63 @@ function Io() {
     }),
     [e]
   );
-  return fe(o, !0), t;
+  return Ee(o, !0), t;
+}
+const nt = we(null), No = {
+  main: mo,
+  speed: po,
+  captions: vo,
+  captionLanguage: wo,
+  captionFontSize: yo,
+  captionManage: ko,
+  quality: Lo
+}, Io = {
+  name: "middleware",
+  async fn(e) {
+    const t = await St(e);
+    return {
+      x: e.x - t.right - 4,
+      y: e.y - 4
+    };
+  }
+};
+function Eo() {
+  const e = v(), [t, o] = k(["main"]), [i, s] = k(!1), a = f(() => {
+    s(!i), o(["main"]), e.setGlobalKeysDisabled(!i);
+  }, [i]), l = f((P) => {
+    o((I) => I.concat(P));
+  }, []), c = f(() => {
+    o((P) => P.length > 1 ? P.slice(0, -1) : P);
+  }, []), u = f(() => {
+    o(["main"]);
+  }, []), d = D(() => No[t[t.length - 1]], [t]), { refs: _, floatingStyles: b, context: w } = me({
+    open: i,
+    onOpenChange: a,
+    placement: "top-end",
+    whileElementsMounted: he,
+    middleware: [Io]
+  }), y = Me(w, { escapeKey: !1 }), { getReferenceProps: x, getFloatingProps: p } = Pe([y]), C = D(
+    () => ({ setPage: l, back: c, backToMain: u, toggle: a }),
+    [l, c, u, a]
+  ), H = Po(C), E = $e([_.setFloating, H]);
+  return {
+    Page: d,
+    open: i,
+    floatingRef: E,
+    referenceRef: _.setReference,
+    floatingStyles: b,
+    context: w,
+    getReferenceProps() {
+      return {
+        ...x(),
+        tabIndex: e.state.interactionsDisabled ? -1 : 0
+      };
+    },
+    getFloatingProps: p,
+    contextValue: C
+  };
 }
-function So() {
+function To() {
   const {
     Page: e,
     context: t,
@@ -1111,40 +1145,53 @@ function So() {
     getFloatingProps: i,
     getReferenceProps: s,
     open: a,
-    refs: l,
-    contextValue: c
-  } = Lo(), { t: u } = _();
+    floatingRef: l,
+    referenceRef: c,
+    contextValue: u
+  } = Eo(), { t: d } = h();
   return /* @__PURE__ */ r(X, { children: [
     /* @__PURE__ */ n(
       "button",
       {
-        ref: l.setReference,
+        ref: c,
         type: "button",
         className: "controls-button",
-        "aria-label": u("SETTINGS"),
-        onClick: c.toggle,
+        "aria-label": d("SETTINGS"),
+        onClick: u.toggle,
         "aria-expanded": a,
+        "aria-haspopup": "true",
         ...s(),
-        children: /* @__PURE__ */ n(Sn, { className: "controls-button-icon icon-rotate" })
+        children: /* @__PURE__ */ n(Rn, { className: "controls-button-icon icon-rotate" })
       }
     ),
-    a && /* @__PURE__ */ n(_e, { context: t, restoreFocus: !0, modal: !1, children: /* @__PURE__ */ n(
-      "div",
+    a && /* @__PURE__ */ n(
+      Ne,
       {
-        "aria-labelledby": "submenu",
-        className: E.settingsMenu,
-        ref: l.setFloating,
-        style: o,
-        ...i(),
-        children: /* @__PURE__ */ n(qe.Provider, { value: c, children: /* @__PURE__ */ n(e, {}) })
+        context: t,
+        restoreFocus: !0,
+        guards: !1,
+        initialFocus: -1,
+        children: /* @__PURE__ */ n(
+          "div",
+          {
+            role: "menu",
+            "aria-label": d("VIDEO_SETTINGS"),
+            "aria-labelledby": "menu-heading",
+            className: F.settingsMenu,
+            ref: l,
+            style: o,
+            ...i(),
+            children: /* @__PURE__ */ n(nt.Provider, { value: u, children: /* @__PURE__ */ n(e, {}) })
+          }
+        )
       }
-    ) })
+    )
   ] });
 }
-function Ge(e, t = 1e3) {
+function ot(e, t = 1e3) {
   return function() {
-    const i = T(), [s, a] = x(null), l = p(() => a(null), []);
-    return F(() => {
+    const i = S(), [s, a] = k(null), l = f(() => a(null), []);
+    return Z(() => {
       if (!i)
         return () => {
         };
@@ -1154,8 +1201,8 @@ function Ge(e, t = 1e3) {
         "keyboardAction",
         (d) => {
           clearTimeout(u);
-          const f = d.detail;
-          a(/* @__PURE__ */ n(e, { action: f })), u = setTimeout(l, t);
+          const _ = d.detail;
+          a(/* @__PURE__ */ n(e, { action: _ })), u = setTimeout(l, t);
         },
         { signal: c.signal }
       ), () => {
@@ -1164,75 +1211,75 @@ function Ge(e, t = 1e3) {
     }, [t]), s;
   };
 }
-const be = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), ge = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), Eo = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.691 3.99987V10.5281L0 4.00655V20.2596L10.691 13.7367V20.2663L23.9987 12.1331L10.691 3.99987Z", fill: "currentColor" }) }), Vo = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.309 3.99987L0 12.1331L13.309 20.2663V13.7367L23.9987 20.2596V4.00655L13.309 10.5281V3.99987Z", fill: "currentColor" }) }), We = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1179 1.41211V22.589H11.2943L5.64717 16.9418V7.05928L11.2943 1.41211H14.1179ZM4.23537 7.05928V16.9418H2.11769C0.957618 16.9418 0.0189406 16.0147 0.00028305 14.8592L0 14.8241V9.17696C0 8.01689 0.927077 7.07822 2.0826 7.05956L2.11769 7.05928H4.23537ZM22.3744 7.93711L24 9.56119L21.5623 11.9988L24 14.4365L22.3744 16.0621L19.9383 13.6245L17.5006 16.0621L15.875 14.4365L18.3127 11.9988L15.875 9.56119L17.5006 7.93711L19.9383 10.3748L22.3744 7.93711Z", fill: "currentColor" }) }), Qe = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 6.98017V16.8627L11.2943 22.5099H14.1179V1.33301H11.2943L5.64714 6.98017ZM0 9.09785V14.745C0 15.9168 0.945899 16.8627 2.11768 16.8627H4.23537V6.98017H2.11768C0.945899 6.98017 0 7.92607 0 9.09785ZM18.3527 11.9207C18.3527 10.6134 17.8388 9.36962 16.9056 8.4209L17.9094 7.43123C19.1066 8.64396 19.7645 10.2393 19.7645 11.9207C19.7645 13.6036 19.1066 15.1989 17.9094 16.4116L16.9056 15.422C17.8388 14.4732 18.3527 13.2295 18.3527 11.9207Z", fill: "currentColor" }) }), Ye = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 16.8627V6.98017L11.2943 1.33301H14.1179V22.5099H11.2943L5.64714 16.8627ZM0 14.745V9.09785C0 7.92607 0.945899 6.98017 2.11768 6.98017H4.23537V16.8627H2.11768C0.945899 16.8627 0 15.9168 0 14.745ZM16.9056 8.4209C17.8388 9.36962 18.3527 10.6134 18.3527 11.9207C18.3527 13.2295 17.8388 14.4732 16.9056 15.422L17.9094 16.4116C19.1066 15.1989 19.7645 13.6036 19.7645 11.9207C19.7645 10.2393 19.1066 8.64396 17.9094 7.43123L16.9056 8.4209ZM19.9016 5.43185L20.8997 4.43372C22.9002 6.43422 24 9.09403 24 11.9219C24 14.7497 22.9002 17.4081 20.8997 19.4086L19.9016 18.4104C21.6353 16.6782 22.5882 14.3727 22.5882 11.9219C22.5882 9.46957 21.6353 7.16553 19.9016 5.43185Z", fill: "currentColor" }) }), To = "_feedback-overlay_3kkqe_1", Ho = "_feedback-message_3kkqe_14", Ao = "_feedback-icon_3kkqe_30", Ro = "_feedback-icon-animation_3kkqe_1", P = {
+const Ae = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), Se = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), Ao = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.691 3.99987V10.5281L0 4.00655V20.2596L10.691 13.7367V20.2663L23.9987 12.1331L10.691 3.99987Z", fill: "currentColor" }) }), So = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.309 3.99987L0 12.1331L13.309 20.2663V13.7367L23.9987 20.2596V4.00655L13.309 10.5281V3.99987Z", fill: "currentColor" }) }), it = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1179 1.41211V22.589H11.2943L5.64717 16.9418V7.05928L11.2943 1.41211H14.1179ZM4.23537 7.05928V16.9418H2.11769C0.957618 16.9418 0.0189406 16.0147 0.00028305 14.8592L0 14.8241V9.17696C0 8.01689 0.927077 7.07822 2.0826 7.05956L2.11769 7.05928H4.23537ZM22.3744 7.93711L24 9.56119L21.5623 11.9988L24 14.4365L22.3744 16.0621L19.9383 13.6245L17.5006 16.0621L15.875 14.4365L18.3127 11.9988L15.875 9.56119L17.5006 7.93711L19.9383 10.3748L22.3744 7.93711Z", fill: "currentColor" }) }), st = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 6.98017V16.8627L11.2943 22.5099H14.1179V1.33301H11.2943L5.64714 6.98017ZM0 9.09785V14.745C0 15.9168 0.945899 16.8627 2.11768 16.8627H4.23537V6.98017H2.11768C0.945899 6.98017 0 7.92607 0 9.09785ZM18.3527 11.9207C18.3527 10.6134 17.8388 9.36962 16.9056 8.4209L17.9094 7.43123C19.1066 8.64396 19.7645 10.2393 19.7645 11.9207C19.7645 13.6036 19.1066 15.1989 17.9094 16.4116L16.9056 15.422C17.8388 14.4732 18.3527 13.2295 18.3527 11.9207Z", fill: "currentColor" }) }), at = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 16.8627V6.98017L11.2943 1.33301H14.1179V22.5099H11.2943L5.64714 16.8627ZM0 14.745V9.09785C0 7.92607 0.945899 6.98017 2.11768 6.98017H4.23537V16.8627H2.11768C0.945899 16.8627 0 15.9168 0 14.745ZM16.9056 8.4209C17.8388 9.36962 18.3527 10.6134 18.3527 11.9207C18.3527 13.2295 17.8388 14.4732 16.9056 15.422L17.9094 16.4116C19.1066 15.1989 19.7645 13.6036 19.7645 11.9207C19.7645 10.2393 19.1066 8.64396 17.9094 7.43123L16.9056 8.4209ZM19.9016 5.43185L20.8997 4.43372C22.9002 6.43422 24 9.09403 24 11.9219C24 14.7497 22.9002 17.4081 20.8997 19.4086L19.9016 18.4104C21.6353 16.6782 22.5882 14.3727 22.5882 11.9219C22.5882 9.46957 21.6353 7.16553 19.9016 5.43185Z", fill: "currentColor" }) }), Vo = "_feedback-overlay_3kkqe_1", Ro = "_feedback-message_3kkqe_14", Ho = "_feedback-icon_3kkqe_30", Bo = "_feedback-icon-animation_3kkqe_1", N = {
   "feedback-overlay": "_feedback-overlay_3kkqe_1",
-  feedbackOverlay: To,
+  feedbackOverlay: Vo,
   "feedback-message": "_feedback-message_3kkqe_14",
-  feedbackMessage: Ho,
+  feedbackMessage: Ro,
   "feedback-icon": "_feedback-icon_3kkqe_30",
-  feedbackIcon: Ao,
+  feedbackIcon: Ho,
   "feedback-icon-animation": "_feedback-icon-animation_3kkqe_1",
-  feedbackIconAnimation: Ro
+  feedbackIconAnimation: Bo
 };
-function Bo({ action: e }) {
-  const t = T();
+function Oo({ action: e }) {
+  const t = S();
   if (!t)
     return null;
   switch (e) {
     case "togglePaused":
-      return /* @__PURE__ */ n("i", { className: P.feedbackIcon, children: t.paused ? /* @__PURE__ */ n(be, {}) : /* @__PURE__ */ n(ge, {}) });
+      return /* @__PURE__ */ n("i", { className: N.feedbackIcon, children: t.paused ? /* @__PURE__ */ n(Ae, {}) : /* @__PURE__ */ n(Se, {}) });
     case "seekForward":
     case "seekForward10":
-      return /* @__PURE__ */ n("i", { className: P.feedbackIcon, children: /* @__PURE__ */ n(Eo, { className: "right" }) });
+      return /* @__PURE__ */ n("i", { className: N.feedbackIcon, children: /* @__PURE__ */ n(Ao, { className: "right" }) });
     case "seekBackward":
     case "seekBackward10":
-      return /* @__PURE__ */ n("i", { className: P.feedbackIcon, children: /* @__PURE__ */ n(Vo, { className: "left" }) });
+      return /* @__PURE__ */ n("i", { className: N.feedbackIcon, children: /* @__PURE__ */ n(So, { className: "left" }) });
     case "captionsChange":
-      return /* @__PURE__ */ n("i", { className: P.feedbackIcon, children: /* @__PURE__ */ n(ze, {}) });
+      return /* @__PURE__ */ n("i", { className: N.feedbackIcon, children: /* @__PURE__ */ n(Xe, {}) });
     case "volumeChange":
-      return /* @__PURE__ */ n("i", { className: P.feedbackIcon, children: t.muted || t.volume === 0 ? /* @__PURE__ */ n(We, {}) : t.volume >= 0.5 ? /* @__PURE__ */ n(Ye, {}) : /* @__PURE__ */ n(Qe, {}) });
+      return /* @__PURE__ */ n("i", { className: N.feedbackIcon, children: t.muted || t.volume === 0 ? /* @__PURE__ */ n(it, {}) : t.volume >= 0.5 ? /* @__PURE__ */ n(at, {}) : /* @__PURE__ */ n(st, {}) });
     default:
       return null;
   }
 }
-function Oo({ action: e }) {
-  const { t } = _(), o = T();
+function Fo({ action: e }) {
+  const { t } = h(), o = S();
   if (!o)
     return null;
   switch (e) {
     case "captionsChange":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: o.textTracks.selected ? t("CAPTION_LANGUAGE", {
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: o.textTracks.selected ? t("CAPTION_LANGUAGE", {
         language: o.textTracks.selected.label
       }) : `${t("CAPTIONS")}: ${t("OFF")}` });
     case "volumeChange":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: o.muted || o.volume === 0 ? t("MUTED") : t("VOLUME_VALUE", { volume: (o.volume * 100).toFixed(0) }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: o.muted || o.volume === 0 ? t("MUTED") : t("VOLUME_VALUE", { volume: (o.volume * 100).toFixed(0) }) });
     case "playbackRateChange":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: t("PLAYBACK_SPEED_MESSAGE", { speed: o.playbackRate }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: t("PLAYBACK_SPEED_MESSAGE", { speed: o.playbackRate }) });
     case "seekForward":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: t("SEEK_FORWARD", { seconds: 5 }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: t("SEEK_FORWARD", { seconds: 5 }) });
     case "seekForward10":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: t("SEEK_FORWARD", { seconds: 10 }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: t("SEEK_FORWARD", { seconds: 10 }) });
     case "seekBackward":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: t("SEEK_BACKWARD", { seconds: 5 }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: t("SEEK_BACKWARD", { seconds: 5 }) });
     case "seekBackward10":
-      return /* @__PURE__ */ n("div", { className: P.feedbackMessage, children: t("SEEK_BACKWARD", { seconds: 10 }) });
+      return /* @__PURE__ */ n("div", { className: N.feedbackMessage, children: t("SEEK_BACKWARD", { seconds: 10 }) });
     default:
       return null;
   }
 }
-const Fo = Ge(Bo, 300), Zo = Ge(Oo, 1e3);
-function Xe() {
-  return /* @__PURE__ */ r("div", { className: P.feedbackOverlay, children: [
-    /* @__PURE__ */ n(Fo, {}),
+const Do = ot(Oo, 300), Zo = ot(Fo, 1e3);
+function lt() {
+  return /* @__PURE__ */ r("div", { className: N.feedbackOverlay, children: [
+    /* @__PURE__ */ n(Do, {}),
     /* @__PURE__ */ n(Zo, {})
   ] });
 }
-const Do = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1383 0.999867V3.66268H18.4561L3.66281 18.4546V14.1382H1V23H9.86449V20.3372H5.54542L20.3387 5.54528V9.86303H23.0001V0.999867H14.1383Z", fill: "currentColor" }) }), jo = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.562 6.58944L22.1514 0L24.0005 1.84907L17.4111 8.43851H21.6506V11.0552H12.9453V2.34861H15.562V6.58944ZM2.34861 15.5615V12.9461H11.0539V21.6501H8.43982V17.4106L1.84907 24L0 22.1509L6.59075 15.5615H2.34861Z", fill: "currentColor" }) }), Ko = "_full-screen-button_1xm32_2", zo = {
+const jo = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1383 0.999867V3.66268H18.4561L3.66281 18.4546V14.1382H1V23H9.86449V20.3372H5.54542L20.3387 5.54528V9.86303H23.0001V0.999867H14.1383Z", fill: "currentColor" }) }), Ko = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.562 6.58944L22.1514 0L24.0005 1.84907L17.4111 8.43851H21.6506V11.0552H12.9453V2.34861H15.562V6.58944ZM2.34861 15.5615V12.9461H11.0539V21.6501H8.43982V17.4106L1.84907 24L0 22.1509L6.59075 15.5615H2.34861Z", fill: "currentColor" }) }), zo = "_full-screen-button_1xm32_2", $o = {
   "full-screen-button": "_full-screen-button_1xm32_2",
-  fullScreenButton: Ko
+  fullScreenButton: zo
 };
 function Uo() {
-  const e = b("fullscreen"), t = T(), o = g(), i = L(), { t: s } = _();
+  const e = g("fullscreen"), t = S(), o = v(), i = L(), { t: s } = h();
   return i.hideFullScreen ? null : /* @__PURE__ */ n(
     "button",
     {
@@ -1240,133 +1287,156 @@ function Uo() {
       type: "button",
       "aria-label": s(e ? "EXIT_FULLSCREEN" : "ENTER_FULLSCREEN"),
       tabIndex: o.state.interactionsDisabled ? -1 : 0,
-      className: `controls-button ${zo.fullScreenButton}`,
+      className: `controls-button ${$o.fullScreenButton}`,
       onClick: () => {
         e ? t == null || t.exitFullscreen() : t == null || t.enterFullscreen();
       },
-      children: e ? /* @__PURE__ */ n(jo, { className: "controls-button-icon" }) : /* @__PURE__ */ n(Do, { className: "controls-button-icon" })
+      children: e ? /* @__PURE__ */ n(Ko, { className: "controls-button-icon" }) : /* @__PURE__ */ n(jo, { className: "controls-button-icon" })
     }
   );
 }
-const $o = "_gestures-container_1fn3b_1", qo = "_gesture_1fn3b_1", Ne = {
+const qo = "_gestures-container_1fn3b_1", Go = "_gesture_1fn3b_1", Fe = {
   "gestures-container": "_gestures-container_1fn3b_1",
-  gesturesContainer: $o,
-  gesture: qo
+  gesturesContainer: qo,
+  gesture: Go
 };
-function Go() {
-  const e = ie(), t = () => {
+function Qo() {
+  const e = de(), t = () => {
     e.togglePaused();
   };
-  return /* @__PURE__ */ n("div", { className: Ne.gesturesContainer, children: /* @__PURE__ */ n("div", { "aria-hidden": !0, className: Ne.gesture, onClick: t }) });
+  return /* @__PURE__ */ n("div", { className: Fe.gesturesContainer, children: /* @__PURE__ */ n("div", { "aria-hidden": !0, className: Fe.gesture, onClick: t }) });
 }
-const Wo = "_play-pause-button_1834v_1", Qo = {
+const Wo = (e) => /* @__PURE__ */ n("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 0V2.66667C17.1453 2.66667 21.3333 6.85333 21.3333 12C21.3333 17.1467 17.1453 21.3333 12 21.3333C6.85467 21.3333 2.66667 17.1467 2.66667 12C2.66667 9.53733 3.64667 7.21867 5.33333 5.49067V8.66667H8V1.33333H0.666667V4H3.05467C1.108 6.176 0 9.012 0 12C0 18.616 5.38267 24 12 24C18.6173 24 24 18.616 24 12C24 5.384 18.6173 0 12 0Z", fill: "currentColor" }) }), Yo = "_play-pause-button_1834v_1", Xo = {
   "play-pause-button": "_play-pause-button_1834v_1",
-  playPauseButton: Wo
+  playPauseButton: Yo
 };
-function Yo() {
-  const e = T(), t = g(), o = b("paused"), { t: i } = _();
+function Jo(e, t) {
+  return t ? Wo : e ? Se : Ae;
+}
+function e1(e, t) {
+  return t ? "REPLAY" : e ? "PLAY" : "PAUSE";
+}
+function t1() {
+  const e = S(), t = v(), o = g("paused"), i = g("ended"), { t: s } = h(), a = Jo(o, i);
   return e ? /* @__PURE__ */ n(
     "button",
     {
       role: "button",
       type: "button",
-      className: `controls-button ${Qo.playPauseButton}`,
-      "aria-label": i(o ? "PLAY" : "PAUSE"),
+      className: `controls-button ${Xo.playPauseButton}`,
+      "aria-label": s(e1(o, i)),
       tabIndex: t.state.interactionsDisabled ? -1 : 0,
       onClick: () => {
         e.paused ? e.remoteControl.play() : e.remoteControl.pause();
       },
-      children: o ? /* @__PURE__ */ n(ge, { className: "controls-button-icon" }) : /* @__PURE__ */ n(be, { className: "controls-button-icon" })
+      children: /* @__PURE__ */ n(a, { className: "controls-button-icon" })
     }
   ) : null;
 }
-const Xo = "_poster_195hi_1", Jo = {
-  poster: Xo
+const n1 = "_poster_195hi_1", o1 = {
+  poster: n1
 };
-function e1({ src: e }) {
-  const t = b("source");
-  return t.type === "video/youtube" || t.type === "video/vimeo" ? null : /* @__PURE__ */ n(ft, { src: e, className: Jo.poster });
-}
-const t1 = "_small-layout-overlay_80lyi_1", n1 = "_small-layout-button_80lyi_14", o1 = "_small-layout-icon-play_80lyi_24", i1 = "_small-layout-icon-pause_80lyi_30", s1 = "_full-screen-close-icon_80lyi_36", a1 = "_fade-out_80lyi_1", Q = {
-  "small-layout-overlay": "_small-layout-overlay_80lyi_1",
-  smallLayoutOverlay: t1,
-  "small-layout-button": "_small-layout-button_80lyi_14",
-  smallLayoutButton: n1,
-  "small-layout-icon-play": "_small-layout-icon-play_80lyi_24",
-  smallLayoutIconPlay: o1,
-  "small-layout-icon-pause": "_small-layout-icon-pause_80lyi_30",
-  smallLayoutIconPause: i1,
-  "full-screen-close-icon": "_full-screen-close-icon_80lyi_36",
-  fullScreenCloseIcon: s1,
-  "fade-out": "_fade-out_80lyi_1",
-  fadeOut: a1
+function i1({ src: e, title: t }) {
+  const o = g("source"), { t: i } = h();
+  return o.type === "video/youtube" || o.type === "video/vimeo" ? null : /* @__PURE__ */ n(
+    yt,
+    {
+      src: e,
+      className: o1.poster,
+      alt: i("POSTER_ALT", { title: t })
+    }
+  );
+}
+const s1 = "_small-layout-overlay_4hkng_1", a1 = "_small-layout-button_4hkng_14", l1 = "_small-layout-icon-play_4hkng_24", r1 = "_small-layout-icon-pause_4hkng_30", c1 = "_small-layout-timestamp_4hkng_36", u1 = "_full-screen-close-icon_4hkng_49", d1 = "_fade-out_4hkng_1", Q = {
+  "small-layout-overlay": "_small-layout-overlay_4hkng_1",
+  smallLayoutOverlay: s1,
+  "small-layout-button": "_small-layout-button_4hkng_14",
+  smallLayoutButton: a1,
+  "small-layout-icon-play": "_small-layout-icon-play_4hkng_24",
+  smallLayoutIconPlay: l1,
+  "small-layout-icon-pause": "_small-layout-icon-pause_4hkng_30",
+  smallLayoutIconPause: r1,
+  "small-layout-timestamp": "_small-layout-timestamp_4hkng_36",
+  smallLayoutTimestamp: c1,
+  "full-screen-close-icon": "_full-screen-close-icon_4hkng_49",
+  fullScreenCloseIcon: u1,
+  "fade-out": "_fade-out_4hkng_1",
+  fadeOut: d1
 };
-function l1() {
-  const e = b("paused");
+function m1() {
+  const e = g("paused");
   return /* @__PURE__ */ r("div", { className: Q.smallLayoutOverlay, children: [
-    /* @__PURE__ */ n(Ct, { className: Q.fullScreenCloseIcon, children: /* @__PURE__ */ n(De, {}) }),
-    /* @__PURE__ */ n("i", { className: Q.smallLayoutButton, children: e ? /* @__PURE__ */ n(ge, { className: Q.smallLayoutIconPlay }) : /* @__PURE__ */ n(be, { className: Q.smallLayoutIconPause }) })
+    /* @__PURE__ */ n(kt, { className: Q.fullScreenCloseIcon, children: /* @__PURE__ */ n(Qe, {}) }),
+    /* @__PURE__ */ n("i", { className: Q.smallLayoutButton, children: e ? /* @__PURE__ */ n(Se, { className: Q.smallLayoutIconPlay }) : /* @__PURE__ */ n(Ae, { className: Q.smallLayoutIconPause }) }),
+    /* @__PURE__ */ r("div", { className: Q.smallLayoutTimestamp, children: [
+      /* @__PURE__ */ n(ce, { type: "current" }),
+      "/",
+      /* @__PURE__ */ n(ce, { type: "duration" })
+    ] })
   ] });
 }
-const r1 = "_time-indicator_1uygf_1", c1 = {
+const h1 = "_time-indicator_1uygf_1", p1 = {
   "time-indicator": "_time-indicator_1uygf_1",
-  timeIndicator: r1
+  timeIndicator: h1
 };
-function u1() {
-  return /* @__PURE__ */ r("div", { className: c1.timeIndicator, children: [
-    /* @__PURE__ */ n(xe, { type: "current" }),
+function f1() {
+  return /* @__PURE__ */ r("div", { className: p1.timeIndicator, children: [
+    /* @__PURE__ */ n(ce, { type: "current" }),
     "/",
-    /* @__PURE__ */ n(xe, { type: "duration" })
+    /* @__PURE__ */ n(ce, { type: "duration" })
   ] });
 }
-const d1 = "_comment-markers_1eebk_1", m1 = "_comment-marker_1eebk_1", h1 = "_timeline-wrapper_1eebk_23", p1 = "_timeline-wrapper-compact_1eebk_24", _1 = "_track_1eebk_33", f1 = "_thumb_1eebk_46", C1 = "_root_1eebk_60", b1 = "_track-inner_1eebk_90", g1 = "_progress_1eebk_96", v1 = "_track-fill_1eebk_102", w1 = "_pins_1eebk_119", k1 = "_pin-button_1eebk_128", y1 = "_annotation-pin_1eebk_148", L1 = "_quiz-pin_1eebk_153", M1 = "_annotation-pin-child_1eebk_158", x1 = "_quiz-pin-child_1eebk_162", P1 = "_interactive-pin-container_1eebk_167", N1 = "_interactive-pin-wrapper_1eebk_173", I1 = "_interactive-pin-icon_1eebk_179", S1 = "_interactive-pin_1eebk_167", E1 = "_bg_1eebk_193", V1 = "_symbol_1eebk_197", T1 = "_interactive-pin-button_1eebk_202", H1 = "_interactive-pin-menu_1eebk_222", A1 = "_interactive-pin-menu-item_1eebk_236", R1 = "_arrow_1eebk_257", m = {
-  "comment-markers": "_comment-markers_1eebk_1",
-  commentMarkers: d1,
-  "comment-marker": "_comment-marker_1eebk_1",
-  commentMarker: m1,
-  "timeline-wrapper": "_timeline-wrapper_1eebk_23",
-  timelineWrapper: h1,
-  "timeline-wrapper-compact": "_timeline-wrapper-compact_1eebk_24",
-  timelineWrapperCompact: p1,
-  track: _1,
-  thumb: f1,
-  root: C1,
-  "track-inner": "_track-inner_1eebk_90",
-  trackInner: b1,
-  progress: g1,
-  "track-fill": "_track-fill_1eebk_102",
-  trackFill: v1,
-  pins: w1,
-  "pin-button": "_pin-button_1eebk_128",
-  pinButton: k1,
-  "annotation-pin": "_annotation-pin_1eebk_148",
-  annotationPin: y1,
-  "quiz-pin": "_quiz-pin_1eebk_153",
-  quizPin: L1,
-  "annotation-pin-child": "_annotation-pin-child_1eebk_158",
-  annotationPinChild: M1,
-  "quiz-pin-child": "_quiz-pin-child_1eebk_162",
-  quizPinChild: x1,
-  "interactive-pin-container": "_interactive-pin-container_1eebk_167",
-  interactivePinContainer: P1,
-  "interactive-pin-wrapper": "_interactive-pin-wrapper_1eebk_173",
-  interactivePinWrapper: N1,
-  "interactive-pin-icon": "_interactive-pin-icon_1eebk_179",
-  interactivePinIcon: I1,
-  "interactive-pin": "_interactive-pin_1eebk_167",
-  interactivePin: S1,
-  bg: E1,
-  symbol: V1,
-  "interactive-pin-button": "_interactive-pin-button_1eebk_202",
-  interactivePinButton: T1,
-  "interactive-pin-menu": "_interactive-pin-menu_1eebk_222",
-  interactivePinMenu: H1,
-  "interactive-pin-menu-item": "_interactive-pin-menu-item_1eebk_236",
-  interactivePinMenuItem: A1,
-  arrow: R1
+const _1 = "_comment-markers_u7l2l_1", C1 = "_comment-marker_u7l2l_1", g1 = "_timeline-wrapper_u7l2l_23", b1 = "_timeline-wrapper-compact_u7l2l_24", v1 = "_track_u7l2l_33", w1 = "_thumb_u7l2l_44", y1 = "_root_u7l2l_58", k1 = "_track-inner_u7l2l_88", L1 = "_progress_u7l2l_94", x1 = "_track-fill_u7l2l_100", M1 = "_pins_u7l2l_117", P1 = "_pin-button_u7l2l_126", N1 = "_annotation-pin_u7l2l_146", I1 = "_quiz-pin_u7l2l_155", E1 = "_annotation-pin-child_u7l2l_164", T1 = "_quiz-pin-child_u7l2l_168", A1 = "_interactive-pin-container_u7l2l_173", S1 = "_interactive-pin-wrapper_u7l2l_180", V1 = "_interactive-pin-icon_u7l2l_186", R1 = "_interactive-pin_u7l2l_173", H1 = "_bg_u7l2l_200", B1 = "_symbol_u7l2l_204", O1 = "_interactive-pin-button_u7l2l_209", F1 = "_interactive-pin-menu_u7l2l_230", D1 = "_interactive-pin-menu-item_u7l2l_248", Z1 = "_arrow_u7l2l_269", j1 = "_tooltip_u7l2l_273", K1 = "_tooltip-arrow_u7l2l_282", m = {
+  "comment-markers": "_comment-markers_u7l2l_1",
+  commentMarkers: _1,
+  "comment-marker": "_comment-marker_u7l2l_1",
+  commentMarker: C1,
+  "timeline-wrapper": "_timeline-wrapper_u7l2l_23",
+  timelineWrapper: g1,
+  "timeline-wrapper-compact": "_timeline-wrapper-compact_u7l2l_24",
+  timelineWrapperCompact: b1,
+  track: v1,
+  thumb: w1,
+  root: y1,
+  "track-inner": "_track-inner_u7l2l_88",
+  trackInner: k1,
+  progress: L1,
+  "track-fill": "_track-fill_u7l2l_100",
+  trackFill: x1,
+  pins: M1,
+  "pin-button": "_pin-button_u7l2l_126",
+  pinButton: P1,
+  "annotation-pin": "_annotation-pin_u7l2l_146",
+  annotationPin: N1,
+  "quiz-pin": "_quiz-pin_u7l2l_155",
+  quizPin: I1,
+  "annotation-pin-child": "_annotation-pin-child_u7l2l_164",
+  annotationPinChild: E1,
+  "quiz-pin-child": "_quiz-pin-child_u7l2l_168",
+  quizPinChild: T1,
+  "interactive-pin-container": "_interactive-pin-container_u7l2l_173",
+  interactivePinContainer: A1,
+  "interactive-pin-wrapper": "_interactive-pin-wrapper_u7l2l_180",
+  interactivePinWrapper: S1,
+  "interactive-pin-icon": "_interactive-pin-icon_u7l2l_186",
+  interactivePinIcon: V1,
+  "interactive-pin": "_interactive-pin_u7l2l_173",
+  interactivePin: R1,
+  bg: H1,
+  symbol: B1,
+  "interactive-pin-button": "_interactive-pin-button_u7l2l_209",
+  interactivePinButton: O1,
+  "interactive-pin-menu": "_interactive-pin-menu_u7l2l_230",
+  interactivePinMenu: F1,
+  "interactive-pin-menu-item": "_interactive-pin-menu-item_u7l2l_248",
+  interactivePinMenuItem: D1,
+  arrow: Z1,
+  tooltip: j1,
+  "tooltip-arrow": "_tooltip-arrow_u7l2l_282",
+  tooltipArrow: K1
 };
-function Ie() {
-  const e = b("duration"), t = L(), o = g();
+function De() {
+  const e = g("duration"), t = L(), o = v();
   return e > 0 && t.hasComments && o.state.commentsEnabled ? /* @__PURE__ */ n("div", { className: m.commentMarkers, children: t.comments.map((i) => /* @__PURE__ */ n(
     "span",
     {
@@ -1378,37 +1448,48 @@ function Ie() {
     i.id
   )) }) : null;
 }
-const B1 = ct(function({ currentTime: t, position: o }, i) {
-  const [s, a] = x(!1), l = L(), c = g(), u = p(() => {
-    l.interactiveMenuElements.length > 0 ? (a((k) => !k), c.setGlobalKeysDisabled(!0)) : l.onInteractivePinClick(t);
+const z1 = ft(function({ currentTime: t, position: o }, i) {
+  const [s, a] = k(!1), [l, c] = k(null), u = L(), d = v(), _ = f(() => {
+    u.interactiveMenuElements.length > 0 ? (a((j) => !j), d.setGlobalKeysDisabled(!0)) : u.onInteractivePinClick(t);
   }, [
-    l.interactiveMenuElements,
-    l.onInteractivePinClick,
+    u.interactiveMenuElements,
+    u.onInteractivePinClick,
     t
-  ]), d = q(null), { refs: f, floatingStyles: v, context: w } = de({
+  ]), b = z(null), { refs: w, floatingStyles: y, context: x } = me({
     open: s,
-    onOpenChange: a,
-    whileElementsMounted: me,
+    onOpenChange: _,
+    whileElementsMounted: he,
     placement: "top",
     middleware: [
-      He(),
-      Ae(6),
-      Re({
-        element: d
+      ke(),
+      Le(6),
+      xe({
+        element: b
       })
     ]
-  }), y = he(w), { getReferenceProps: N, getFloatingProps: h } = pe([y]), C = It([f.setReference, i]);
+  }), p = z([]), C = Me(x), H = ze(x, {
+    listRef: p,
+    activeIndex: l,
+    onNavigate: c,
+    loop: !0,
+    openOnArrowKeyDown: !1
+  }), { getReferenceProps: E, getFloatingProps: P, getItemProps: I } = Pe(
+    [C, H]
+  ), B = $e([w.setReference, i]), { t: V } = h(), O = be(t);
   return /* @__PURE__ */ r(X, { children: [
     /* @__PURE__ */ n(
       "button",
       {
+        id: "interactive-pin",
         type: "button",
-        "aria-haspopup": l.interactiveMenuElements.length > 0 ? "true" : void 0,
-        onClick: u,
+        "aria-label": u.interactiveMenuElements.length > 0 ? V("ADD_QUIZ_AT", { time: O }) : V("ADD_ANNOTATION_AT", { time: O }),
+        "aria-haspopup": u.interactiveMenuElements.length > 0 ? "true" : void 0,
         className: m.interactivePinButton,
-        ref: C,
+        ref: B,
         style: { left: `${o}%` },
-        ...N(),
+        ...E({
+          onClick: _
+        }),
         children: /* @__PURE__ */ r(
           "svg",
           {
@@ -1449,71 +1530,70 @@ const B1 = ct(function({ currentTime: t, position: o }, i) {
         )
       }
     ),
-    s && /* @__PURE__ */ n(
-      _e,
+    s && /* @__PURE__ */ n(Ne, { context: x, initialFocus: -1, modal: !0, children: /* @__PURE__ */ r(
+      "div",
       {
-        order: ["floating", "content"],
-        context: w,
-        modal: !0,
-        children: /* @__PURE__ */ r(
-          "div",
-          {
-            ref: f.setFloating,
-            style: v,
-            className: m.interactivePinMenu,
-            ...h(),
-            children: [
-              l.interactiveMenuElements.map(
-                ({ id: k, text: I, onClick: Z }) => /* @__PURE__ */ r(
-                  "button",
-                  {
-                    type: "button",
-                    className: m.interactivePinMenuItem,
-                    onClick: () => {
-                      Z(k, t), a(!1), c.setGlobalKeysDisabled(!1);
-                    },
-                    children: [
-                      /* @__PURE__ */ n(
-                        "svg",
+        ref: w.setFloating,
+        style: y,
+        className: m.interactivePinMenu,
+        "aria-labelledby": "interactive-pin",
+        ...P(),
+        children: [
+          u.interactiveMenuElements.map(
+            ({ id: j, text: fe, onClick: _e }, ee) => /* @__PURE__ */ r(
+              "button",
+              {
+                type: "button",
+                className: m.interactivePinMenuItem,
+                ref: (ne) => {
+                  p.current[ee] = ne;
+                },
+                tabIndex: l === ee ? 0 : -1,
+                ...I({
+                  onClick: () => {
+                    _e(j, t), a(!1), d.setGlobalKeysDisabled(!1);
+                  }
+                }),
+                children: [
+                  /* @__PURE__ */ n(
+                    "svg",
+                    {
+                      width: "16",
+                      height: "16",
+                      viewBox: "0 0 16 16",
+                      fill: "none",
+                      xmlns: "http://www.w3.org/2000/svg",
+                      children: /* @__PURE__ */ n(
+                        "path",
                         {
-                          width: "16",
-                          height: "16",
-                          viewBox: "0 0 16 16",
-                          fill: "none",
-                          xmlns: "http://www.w3.org/2000/svg",
-                          children: /* @__PURE__ */ n(
-                            "path",
-                            {
-                              fillRule: "evenodd",
-                              clipRule: "evenodd",
-                              d: "M7.33339 7.33339H1.77783V8.66672H7.33339V14.2223H8.66672V8.66672H14.2223V7.33339H8.66672V1.77783H7.33339V7.33339Z",
-                              fill: "#273540"
-                            }
-                          )
+                          fillRule: "evenodd",
+                          clipRule: "evenodd",
+                          d: "M7.33339 7.33339H1.77783V8.66672H7.33339V14.2223H8.66672V8.66672H14.2223V7.33339H8.66672V1.77783H7.33339V7.33339Z",
+                          fill: "#273540"
                         }
-                      ),
-                      I
-                    ]
-                  },
-                  k
-                )
-              ),
-              /* @__PURE__ */ n(
-                Be,
-                {
-                  ref: d,
-                  context: w,
-                  className: m.arrow
-                }
-              )
-            ]
-          }
-        )
+                      )
+                    }
+                  ),
+                  fe
+                ]
+              },
+              j
+            )
+          ),
+          /* @__PURE__ */ n(
+            Ie,
+            {
+              ref: b,
+              context: x,
+              className: m.arrow
+            }
+          )
+        ]
       }
-    )
+    ) })
   ] });
-}), O1 = () => {
-  const e = q(!1), t = q(!1), o = A(() => ({
+}), $1 = () => {
+  const e = z(!1), t = z(!1), o = D(() => ({
     ArrowLeft: () => {
       t.current = !0;
     },
@@ -1524,7 +1604,7 @@ const B1 = ct(function({ currentTime: t, position: o }, i) {
       t.current = !1;
     }
   }), []);
-  return fe(o), { focusCallback: p((s) => {
+  return Ee(o), { focusCallback: f((s) => {
     s && (s.addEventListener("focus", () => {
       e.current = !0;
     }), s.addEventListener("blur", () => {
@@ -1532,13 +1612,13 @@ const B1 = ct(function({ currentTime: t, position: o }, i) {
     }), e.current && s.focus());
   }, []), wasPinFocused: e.current };
 };
-function F1() {
+function U1() {
   var c;
-  const e = b("duration"), t = b("currentTime"), o = t / e * 100, { disableInteractivePinRanges: i } = L(), s = !i.some(
+  const e = g("duration"), t = g("currentTime"), o = t / e * 100, { disableInteractivePinRanges: i } = L(), s = !i.some(
     ([u, d]) => t >= u && t <= d
-  ), { wasPinFocused: a, focusCallback: l } = O1();
+  ), { wasPinFocused: a, focusCallback: l } = $1();
   return s ? /* @__PURE__ */ n("div", { className: m.interactivePinContainer, children: /* @__PURE__ */ n("div", { className: m.interactivePinWrapper, children: /* @__PURE__ */ n(
-    B1,
+    z1,
     {
       ref: l,
       currentTime: t,
@@ -1546,35 +1626,40 @@ function F1() {
     }
   ) }) }) : (a && ((c = document.querySelector("[data-media-time-slider]")) == null || c.focus()), null);
 }
-function Z1() {
-  const e = b("paused"), t = g();
-  return e && !t.state.interactionsDisabled ? /* @__PURE__ */ n(F1, {}) : null;
+function q1() {
+  const e = g("paused"), t = v();
+  return e && !t.state.interactionsDisabled ? /* @__PURE__ */ n(U1, {}) : null;
 }
-const D1 = {
+const G1 = {
   annotation: m.annotationPin,
   quiz: m.quizPin
-};
-function Je({
+}, Q1 = (e, t, o, i = !1) => t === "annotation" ? e("OPEN_ANNOTATION_AT", { time: be(o) }) : t === "quiz" ? e(i ? "OPEN_COMPLETED_QUIZ_AT" : "OPEN_QUIZ_AT", {
+  time: be(o)
+}) : "";
+function rt({
   type: e,
   position: t,
   children: o,
   onClick: i,
-  id: s
+  id: s,
+  time: a,
+  completed: l
 }) {
-  const a = g();
+  const c = v(), { t: u } = h();
   return /* @__PURE__ */ n(
     "button",
     {
       type: "button",
-      tabIndex: a.state.interactionsDisabled ? -1 : 0,
+      tabIndex: c.state.interactionsDisabled ? -1 : 0,
       className: m.pinButton,
       style: { left: `${t}%` },
       onClick: i,
       "data-marker-id": s,
+      "aria-label": Q1(u, e, a, l),
       children: /* @__PURE__ */ r(
         "svg",
         {
-          className: D1[e],
+          className: G1[e],
           width: "26",
           height: "32",
           viewBox: "0 0 26 32",
@@ -1588,8 +1673,8 @@ function Je({
     }
   );
 }
-function j1(e) {
-  return /* @__PURE__ */ n(Je, { type: "annotation", ...e, children: /* @__PURE__ */ n(
+function W1(e) {
+  return /* @__PURE__ */ n(rt, { type: "annotation", ...e, children: /* @__PURE__ */ n(
     "path",
     {
       className: m.annotationPinChild,
@@ -1601,7 +1686,7 @@ function j1(e) {
     }
   ) });
 }
-function K1(e) {
+function Y1(e) {
   const t = e.completed ? /* @__PURE__ */ n(
     "path",
     {
@@ -1610,7 +1695,8 @@ function K1(e) {
       fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M12.7156 2.33212L5.18253 9.86522L1.28337 5.96607L0 7.24944L5.18253 12.4329L13.9999 3.6164L12.7156 2.33212Z",
-      fill: "currentColor"
+      fill: "currentColor",
+      "data-completed": "true"
     }
   ) : /* @__PURE__ */ n(
     "text",
@@ -1624,9 +1710,9 @@ function K1(e) {
       children: e.ordinal
     }
   );
-  return /* @__PURE__ */ n(Je, { type: "quiz", ...e, children: e.multiple ? /* @__PURE__ */ n("circle", { className: m.quizPinChild, cx: "13", cy: "13", r: "6" }) : t });
+  return /* @__PURE__ */ n(rt, { type: "quiz", ...e, children: e.multiple ? /* @__PURE__ */ n("circle", { className: m.quizPinChild, cx: "13", cy: "13", r: "6" }) : t });
 }
-function z1(e, t) {
+function X1(e, t) {
   return e.map((o, i) => ({
     id: o.id,
     time: o.time,
@@ -1635,7 +1721,7 @@ function z1(e, t) {
     onClick: () => t(o)
   }));
 }
-function U1(e, t) {
+function J1(e, t) {
   const o = /* @__PURE__ */ new Map();
   e.forEach((a) => {
     var c;
@@ -1656,30 +1742,32 @@ function U1(e, t) {
     }), s++;
   }), i;
 }
-function $1(e, t, o, i) {
+function ei(e, t, o, i) {
   switch (e.type) {
     case "annotation": {
       const s = () => i ? e.onClick() : o.seek(e.time);
       return /* @__PURE__ */ n(
-        j1,
+        W1,
         {
           id: e.id,
           position: e.time / t * 100,
-          onClick: s
+          onClick: s,
+          time: e.time
         },
         e.id
       );
     }
     case "quiz":
       return /* @__PURE__ */ n(
-        K1,
+        Y1,
         {
           id: e.id,
           position: e.time / t * 100,
           ordinal: e.ordinal,
           multiple: e.multiple,
           onClick: e.onClick,
-          completed: e.completed
+          completed: e.completed,
+          time: e.time
         },
         e.id
       );
@@ -1687,64 +1775,103 @@ function $1(e, t, o, i) {
       return null;
   }
 }
-function q1() {
-  const e = ie(), t = b("duration"), o = L(), i = A(() => [
-    ...z1(
+function ti() {
+  const e = de(), t = g("duration"), o = L(), i = D(() => [
+    ...X1(
       o.annotations,
       o.onAnnotationClick
     ),
-    ...U1(o.quizMarkers, o.onQuizMarkerClick)
-  ].sort((a, l) => a.time - l.time).map((a) => $1(a, t, e, o.interactive)), [o.annotations, o.quizMarkers, t, e]);
+    ...J1(o.quizMarkers, o.onQuizMarkerClick)
+  ].sort((a, l) => a.time - l.time).map((a) => ei(a, t, e, o.interactive)), [o.annotations, o.quizMarkers, t, e]);
   return /* @__PURE__ */ n("div", { className: m.pins, children: i });
 }
-const G1 = {
+const ni = {
   normal: m.timelineWrapper,
   compact: m.timelineWrapperCompact
 };
-function Se({
+function Ze({
   layout: e,
   interactionsDisabled: t,
   children: o
 }) {
-  return /* @__PURE__ */ r("div", { className: G1[e], children: [
+  const [i, s] = k(!1), a = f(() => s(!0), []), l = f(() => s(!1), []), c = z(null), { refs: u, floatingStyles: d, context: _ } = me({
+    open: i,
+    onOpenChange: s,
+    whileElementsMounted: (b, w, y) => he(b, w, y, {
+      animationFrame: !0
+    }),
+    placement: "top",
+    middleware: [
+      ke(),
+      Le(18),
+      xe({
+        element: c
+      })
+    ]
+  });
+  return /* @__PURE__ */ r("div", { className: ni[e], children: [
     o,
     /* @__PURE__ */ r(
-      W.Root,
+      G.Root,
       {
-        className: m.root,
         tabIndex: t ? -1 : 0,
+        className: m.root,
+        onDragStart: a,
+        onDragEnd: l,
         children: [
-          /* @__PURE__ */ r(W.Track, { className: m.track, children: [
+          /* @__PURE__ */ r(G.Track, { className: m.track, children: [
             /* @__PURE__ */ n(
-              W.Progress,
+              G.Progress,
               {
-                className: oe(m.progress, m.trackInner)
+                className: ue(m.progress, m.trackInner)
               }
             ),
             /* @__PURE__ */ n(
-              W.TrackFill,
+              G.TrackFill,
               {
-                className: oe(m.trackFill, m.trackInner)
+                className: ue(m.trackFill, m.trackInner)
               }
             )
           ] }),
-          /* @__PURE__ */ n(W.Thumb, { className: m.thumb })
+          /* @__PURE__ */ n(G.Thumb, { className: m.thumb, ref: u.setReference }),
+          i ? /* @__PURE__ */ r(
+            "div",
+            {
+              role: "tooltip",
+              ref: u.setFloating,
+              style: d,
+              className: m.tooltip,
+              children: [
+                /* @__PURE__ */ n(G.Value, {}),
+                /* @__PURE__ */ n(
+                  Ie,
+                  {
+                    ref: c,
+                    context: _,
+                    className: m.tooltipArrow,
+                    width: 20,
+                    height: 10
+                  }
+                )
+              ]
+            }
+          ) : null
         ]
       }
     )
   ] });
 }
-const W1 = "_wrapper_12cb0_1", Q1 = "_track_12cb0_6", Y1 = "_thumb_12cb0_18", X1 = "_track-fill_12cb0_32", J1 = "_root_12cb0_51", Y = {
-  wrapper: W1,
-  track: Q1,
-  thumb: Y1,
-  "track-fill": "_track-fill_12cb0_32",
-  trackFill: X1,
-  root: J1
+const oi = "_wrapper_1ijfr_1", ii = "_track_1ijfr_6", si = "_thumb_1ijfr_16", ai = "_track-fill_1ijfr_30", li = "_root_1ijfr_49", te = {
+  wrapper: oi,
+  track: ii,
+  thumb: si,
+  "track-fill": "_track-fill_1ijfr_30",
+  trackFill: ai,
+  root: li
 };
-function ei() {
-  const e = T(), t = b("volume"), o = b("muted"), i = g(), s = o || t === 0, { t: a } = _();
-  return /* @__PURE__ */ r("div", { className: Y.wrapper, children: [
+function ri() {
+  const e = S(), t = g("volume"), o = g("muted"), i = v(), s = o || t === 0, { t: a } = h();
+  return /* @__PURE__ */ r("div", { className: te.wrapper, children: [
     /* @__PURE__ */ n(
       "button",
       {
@@ -1756,17 +1883,17 @@ function ei() {
         onClick: () => {
           s ? e == null || e.remoteControl.unmute() : e == null || e.remoteControl.mute();
         },
-        children: s ? /* @__PURE__ */ n(We, { className: "controls-button-icon" }) : t < 0.5 ? /* @__PURE__ */ n(Qe, { className: "controls-button-icon" }) : /* @__PURE__ */ n(Ye, { className: "controls-button-icon" })
+        children: s ? /* @__PURE__ */ n(it, { className: "controls-button-icon" }) : t < 0.5 ? /* @__PURE__ */ n(st, { className: "controls-button-icon" }) : /* @__PURE__ */ n(at, { className: "controls-button-icon" })
       }
     ),
     /* @__PURE__ */ r(
-      J.Root,
+      se.Root,
       {
-        className: Y.root,
+        className: te.root,
         tabIndex: i.state.interactionsDisabled ? -1 : 0,
         children: [
-          /* @__PURE__ */ n(J.Track, { className: Y.track, children: /* @__PURE__ */ n(J.TrackFill, { className: Y.trackFill }) }),
-          /* @__PURE__ */ n(J.Thumb, { className: Y.thumb })
+          /* @__PURE__ */ n(se.Track, { className: te.track, children: /* @__PURE__ */ n(se.TrackFill, { className: te.trackFill }) }),
+          /* @__PURE__ */ n(se.Thumb, { className: te.thumb })
         ]
       }
     )
@@ -1779,7 +1906,7 @@ function M(e, t) {
     })
   );
 }
-const Ee = {
+const je = {
   togglePaused: {
     keys: ["Space", "Enter", "k"],
     onKeyDown({ player: e, remote: t, event: o }) {
@@ -1849,15 +1976,15 @@ const Ee = {
   decreasePlaybackRate: {
     keys: ["a"],
     onKeyDown({ event: e, player: t, remote: o }) {
-      const s = $.indexOf(t.playbackRate) - 1;
-      s >= 0 && (o.changePlaybackRate($[s], e), M(t, "playbackRateChange"));
+      const s = Y.indexOf(t.playbackRate) - 1;
+      s >= 0 && (o.changePlaybackRate(Y[s], e), M(t, "playbackRateChange"));
     }
   },
   increasePlaybackRate: {
     keys: ["d"],
     onKeyDown({ event: e, player: t, remote: o }) {
-      const s = $.indexOf(t.playbackRate) + 1;
-      s < $.length && (o.changePlaybackRate($[s], e), M(t, "playbackRateChange"));
+      const s = Y.indexOf(t.playbackRate) + 1;
+      s < Y.length && (o.changePlaybackRate(Y[s], e), M(t, "playbackRateChange"));
     }
   },
   resetPlaybackRate: {
@@ -1879,10 +2006,16 @@ const Ee = {
     }
   }
 };
-function Ve(e) {
+function ci(e) {
+  return Array.isArray(e) && typeof e[0] == "object";
+}
+function ui(e) {
+  return ci(e) && e.length === 1 ? e[0].src : e;
+}
+function ve(e) {
   return typeof e == "number" && !isNaN(e);
 }
-function ti(e, t = 1e3) {
+function di(e, t = 1e3) {
   let o = !1;
   return () => {
     o || (e(), o = !0, setTimeout(() => {
@@ -1890,7 +2023,7 @@ function ti(e, t = 1e3) {
     }, t));
   };
 }
-const Te = {
+const Ke = {
   volume: 1,
   muted: !1,
   lang: null,
@@ -1901,23 +2034,23 @@ const Te = {
   invert: !1,
   comments: !1
 };
-class ni {
+class mi {
   constructor() {
-    V(this, "playerId", "studio-player");
-    V(this, "mediaId", null);
-    V(this, "data", Te);
-    V(this, "time", null);
-    V(this, "overrideTime", null);
-    V(this, "saveTime", () => {
+    R(this, "playerId", "studio-player");
+    R(this, "mediaId", null);
+    R(this, "data", Ke);
+    R(this, "time", null);
+    R(this, "overrideTime", null);
+    R(this, "saveTime", () => {
       if (!this.mediaId) return;
       const t = (this.time ?? 0).toString();
       localStorage.setItem(this.mediaId, t);
     });
-    V(this, "saveTimeThrottled", ti(this.saveTime, 1e3));
+    R(this, "saveTimeThrottled", di(this.saveTime, 1e3));
     // only used for useStudioPlayer hook's state initialization
-    V(this, "initializeState", (t) => {
+    R(this, "initializeState", (t) => {
       const o = localStorage.getItem(this.playerId);
-      if (Ve(t) && t >= 0 && (this.overrideTime = t), o)
+      if (ve(t) && t >= 0 && (this.overrideTime = t), o)
         try {
           this.data = JSON.parse(o);
         } catch {
@@ -1932,7 +2065,7 @@ class ni {
         disableCaptionSettings: !1
       };
     });
-    V(this, "saveData", (t, o) => {
+    R(this, "saveData", (t, o) => {
       this.data = {
         ...this.data,
         [t]: o
@@ -1992,9 +2125,9 @@ class ni {
       } catch {
       }
     this.data = {
-      ...Te,
+      ...Ke,
       ...l
-    }, Ve(this.overrideTime) && this.overrideTime >= 0 ? this.time = this.overrideTime : this.time = a ? +a : null;
+    }, ve(this.overrideTime) && this.overrideTime >= 0 ? this.time = this.overrideTime : this.time = a ? +a : null;
   }
   save() {
     if (!this.playerId) return;
@@ -2002,60 +2135,60 @@ class ni {
     localStorage.setItem(this.playerId, t);
   }
 }
-function oi(e, t, o, i) {
-  const s = A(() => new ni(), []), [a, l] = x(
+function hi(e, t, o, i) {
+  const s = D(() => new mi(), []), [a, l] = k(
     s.initializeState(i)
-  ), c = p(
-    (h) => {
-      l((C) => (s.saveData("multiplier", h), {
+  ), c = f(
+    (p) => {
+      l((C) => (s.saveData("multiplier", p), {
         ...C,
-        captionsFontSizeMultiplier: h
+        captionsFontSizeMultiplier: p
       }));
     },
     [s]
-  ), u = p(() => {
-    l((h) => {
-      const C = !h.captionPositionOnTop;
+  ), u = f(() => {
+    l((p) => {
+      const C = !p.captionPositionOnTop;
       return s.saveData("ontop", C), {
-        ...h,
+        ...p,
         captionPositionOnTop: C
       };
     });
-  }, [s]), d = p(() => {
-    l((h) => {
-      const C = !h.captionsInvertColors;
+  }, [s]), d = f(() => {
+    l((p) => {
+      const C = !p.captionsInvertColors;
       return s.saveData("invert", C), {
-        ...h,
+        ...p,
         captionsInvertColors: C
       };
     });
-  }, [s]), f = p(() => {
-    l((h) => {
-      const C = !h.commentsEnabled;
+  }, [s]), _ = f(() => {
+    l((p) => {
+      const C = !p.commentsEnabled;
       return s.saveData("comments", C), {
-        ...h,
+        ...p,
         commentsEnabled: C
       };
     });
-  }, [s]), v = p(() => {
-    l((h) => ({
-      ...h,
+  }, [s]), b = f(() => {
+    l((p) => ({
+      ...p,
       interactionsDisabled: !1
     }));
-  }, []), w = p(() => {
-    l((h) => ({
-      ...h,
+  }, []), w = f(() => {
+    l((p) => ({
+      ...p,
       interactionsDisabled: !0
     }));
-  }, []), y = p((h) => {
+  }, []), y = f((p) => {
     l((C) => ({
       ...C,
-      globalKeysDisabled: h
+      globalKeysDisabled: p
     }));
-  }, []), N = A(() => e ? {
-    ...Ee,
+  }, []), x = D(() => e ? {
+    ...je,
     toggleFullscreen: []
-  } : Ee, [e]);
+  } : je, [e]);
   return {
     contextValue: {
       state: {
@@ -2065,17 +2198,17 @@ function oi(e, t, o, i) {
       setCaptionsFontSizeMultiplier: c,
       toggleCaptionPositionOnTop: u,
       toggleCaptionsInvertColors: d,
-      enableInteractions: v,
+      enableInteractions: b,
       disableInteractions: w,
       setGlobalKeysDisabled: y,
-      toggleComments: f,
+      toggleComments: _,
       disableCaptionSettings: o
     },
-    shortcuts: N,
+    shortcuts: x,
     storage: s
   };
 }
-const ii = (e) => /* @__PURE__ */ n("svg", { width: 56, height: 72, viewBox: "0 0 28 36", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("g", { id: "Icons", stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ r("g", { id: "audio", children: [
+const pi = (e) => /* @__PURE__ */ n("svg", { width: 56, height: 72, viewBox: "0 0 28 36", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ n("g", { id: "Icons", stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ r("g", { id: "audio", children: [
   /* @__PURE__ */ r("g", { id: "icon-file-base-2", children: [
     /* @__PURE__ */ n("path", { d: "M0,2 L0,34 C0,35.105 0.899,36 1.993,36 L26.006,36 C27.107,36 28,35.11 28,34 L28,10 L18,0 L1.993,0 C0.892,0 0,0.89 0,2 Z", fill: "#FFFFFF" }),
     /* @__PURE__ */ n("path", { d: "M0,2 L0,34 C0,35.105 0.899,36 1.993,36 L26.006,36 C27.107,36 28,35.11 28,34 L28,10 L18,0 L1.993,0 C0.892,0 0,0.89 0,2 Z M1.993,35 C1.445,35 1,34.552 1,34 L1,2 C1,1.448 1.445,1 1.993,1 L16.5,1 L16.5,9 C16.5,10.379 17.621,11.5 18.999,11.5 L27,11.5 L27,34 C27,34.552 26.554,35 26.006,35 L1.993,35 Z M27,10.5 L18.999,10.5 C18.173,10.5 17.5,9.827 17.5,9 L17.5,1 L17.585,1 L27,10.414 L27,10.5 L27,10.5 Z", id: "icon-file-base", fill: "#FFFFFF" }),
@@ -2083,26 +2216,32 @@ const ii = (e) => /* @__PURE__ */ n("svg", { width: 56, height: 72, viewBox: "0
   ] }),
   /* @__PURE__ */ n("path", { d: "M14.7142857,14.2824 L14.7142857,13 L13.2857143,13.2548 L13.2857143,23.0912 C12.8642857,22.9106 12.3785714,22.8 11.8571429,22.8 C10.2771429,22.8 9,23.7408 9,24.9 C9,26.0592 10.2771429,27 11.8571429,27 C12.3785714,27 12.8642857,26.8894 13.2857143,26.7088 C14.1371429,26.3448 14.7142857,25.6756 14.7142857,24.9 L14.7142857,17.0824 C17.5714286,17.0824 19,20 19,21.4 C19,15.8 16.1428571,14.2824 14.7142857,14.2824", id: "Fill-776", fill: "#384A58" })
 ] }) }) });
-function si() {
+function fi() {
   const e = L();
   return /* @__PURE__ */ r("div", { className: "audio-layout-wrapper", children: [
-    /* @__PURE__ */ n(ii, {}),
-    /* @__PURE__ */ n(Xe, {}),
-    /* @__PURE__ */ n(Ze, {}),
-    /* @__PURE__ */ n(Ue, { captions: e.captions })
+    /* @__PURE__ */ n(pi, {}),
+    /* @__PURE__ */ n(lt, {}),
+    /* @__PURE__ */ n(Ge, {}),
+    /* @__PURE__ */ n(Je, { captions: e.captions })
   ] });
 }
-function ai() {
+function _i() {
   const e = L(), t = e.kebabMenuElements.length > 0;
   return /* @__PURE__ */ r(X, { children: [
-    /* @__PURE__ */ n(e1, { src: e.thumbnail }),
-    /* @__PURE__ */ n(Xe, {}),
-    /* @__PURE__ */ n(Ze, {}),
-    /* @__PURE__ */ n(Ue, { captions: e.captions }),
-    /* @__PURE__ */ n(l1, {}),
-    /* @__PURE__ */ n(Go, {}),
     /* @__PURE__ */ n(
-      In,
+      i1,
+      {
+        src: e.thumbnail,
+        title: e.title
+      }
+    ),
+    /* @__PURE__ */ n(lt, {}),
+    /* @__PURE__ */ n(Ge, {}),
+    /* @__PURE__ */ n(Je, { captions: e.captions }),
+    /* @__PURE__ */ n(m1, {}),
+    /* @__PURE__ */ n(Qo, {}),
+    /* @__PURE__ */ n(
+      Sn,
       {
         comments: e.comments,
         isKebabMenuVisible: t
@@ -2110,93 +2249,105 @@ function ai() {
     )
   ] });
 }
-const li = "_root_5cfhx_1", ri = "_normal_5cfhx_14", ci = "_compact_5cfhx_21", ui = "_left-controls_5cfhx_36", di = "_right-controls_5cfhx_42", mi = "_indicators_5cfhx_48", U = {
-  root: li,
-  normal: ri,
-  compact: ci,
+const Ci = "_root_5cfhx_1", gi = "_normal_5cfhx_14", bi = "_compact_5cfhx_21", vi = "_left-controls_5cfhx_36", wi = "_right-controls_5cfhx_42", yi = "_indicators_5cfhx_48", W = {
+  root: Ci,
+  normal: gi,
+  compact: bi,
   "left-controls": "_left-controls_5cfhx_36",
-  leftControls: ui,
+  leftControls: vi,
   "right-controls": "_right-controls_5cfhx_42",
-  rightControls: di,
-  indicators: mi
+  rightControls: wi,
+  indicators: yi
 };
-function hi({
+function ki() {
+  const e = S(), t = L();
+  Z(() => {
+    const o = () => {
+      const i = t.startAt;
+      e && t.disableStorage && ve(i) && e.remoteControl.seek(i);
+    };
+    return e == null || e.addEventListener("loaded-metadata", o), () => {
+      e == null || e.removeEventListener("loaded-metadata", o);
+    };
+  }, [e]);
+}
+function Li({
   darkMode: e,
   playerRef: t,
   controlsLayout: o,
   showCaptionsButton: i
 }) {
-  const s = T(), a = g(), { hasAnnotations: l, hasQuizmarkers: c, interactive: u } = L();
-  return F(() => {
+  const s = S(), a = v(), { hasAnnotations: l, hasQuizmarkers: c, interactive: u } = L();
+  return ki(), Z(() => {
     s && (s.remoteControl.pauseControls(), t && (typeof t == "function" ? t(s) : t.current = s));
   }, [s, t]), /* @__PURE__ */ r(
     "div",
     {
       "data-darkmode": e,
-      className: oe(U.root, {
-        [U.normal]: o === "normal",
-        [U.compact]: o === "compact"
+      className: ue(W.root, {
+        [W.normal]: o === "normal",
+        [W.compact]: o === "compact"
       }),
       children: [
         o === "normal" ? /* @__PURE__ */ r(
-          Se,
+          Ze,
           {
             layout: "normal",
             interactionsDisabled: a.state.interactionsDisabled,
             children: [
-              u ? /* @__PURE__ */ n(Z1, {}) : null,
-              u || l || c ? /* @__PURE__ */ n(q1, {}) : null,
-              /* @__PURE__ */ n(Ie, {})
+              u || l || c ? /* @__PURE__ */ n(ti, {}) : null,
+              u ? /* @__PURE__ */ n(q1, {}) : null,
+              /* @__PURE__ */ n(De, {})
             ]
           }
         ) : null,
-        /* @__PURE__ */ r("div", { className: U.leftControls, children: [
-          /* @__PURE__ */ n(Yo, {}),
-          /* @__PURE__ */ n(ei, {})
+        /* @__PURE__ */ r("div", { className: W.leftControls, children: [
+          /* @__PURE__ */ n(t1, {}),
+          /* @__PURE__ */ n(ri, {})
         ] }),
-        /* @__PURE__ */ n("div", { className: U.indicators, children: /* @__PURE__ */ n(u1, {}) }),
+        /* @__PURE__ */ n("div", { className: W.indicators, children: /* @__PURE__ */ n(f1, {}) }),
         o === "compact" ? /* @__PURE__ */ n(
-          Se,
+          Ze,
           {
             layout: "compact",
             interactionsDisabled: a.state.interactionsDisabled,
-            children: /* @__PURE__ */ n(Ie, {})
+            children: /* @__PURE__ */ n(De, {})
           }
         ) : null,
-        /* @__PURE__ */ r("div", { className: U.rightControls, children: [
-          i && /* @__PURE__ */ n(dn, {}),
-          /* @__PURE__ */ n(So, {}),
+        /* @__PURE__ */ r("div", { className: W.rightControls, children: [
+          i && /* @__PURE__ */ n(fn, {}),
+          /* @__PURE__ */ n(To, {}),
           /* @__PURE__ */ n(Uo, {})
         ] })
       ]
     }
   );
 }
-function pi(e, t) {
+function xi(e, t) {
   return e.reduce((o, i) => (Object.keys(t).includes(i.id) || (o[i.id] = !0), o), t);
 }
-function _i(e, t, o, i, s) {
+function Mi(e, t, o, i, s) {
   return (a) => {
     const l = a.detail.currentTime, c = !o.paused, u = Math.min(o.duration * 0.05, 2);
     l >= e.time && l < e.time + u && !i[e.id] && (s({ ...i, [e.id]: !0 }), t(e, c));
   };
 }
-function fi() {
-  const e = T(), { quizMarkers: t, onQuizMarkerShow: o } = L(), [i, s] = x(
+function Pi() {
+  const e = S(), { quizMarkers: t, onQuizMarkerShow: o } = L(), [i, s] = k(
     t.reduce((a, l) => (a[l.id] = !1, a), {})
   );
-  F(() => {
+  Z(() => {
     if (!e)
       return;
-    t.length > Object.keys(i).length && s(pi(t, i));
+    t.length > Object.keys(i).length && s(xi(t, i));
     const a = [], l = (c) => {
-      var f;
-      const u = (f = c == null ? void 0 : c.request) == null ? void 0 : f.detail, d = t.reduce((v, w) => (v[w.id] = w.time <= u, v), {});
+      var _;
+      const u = (_ = c == null ? void 0 : c.request) == null ? void 0 : _.detail, d = t.reduce((b, w) => (b[w.id] = w.time <= u, b), {});
       s({ ...i, ...d });
     };
     e.addEventListener("seeked", l);
     for (const c of t) {
-      const u = _i(
+      const u = Mi(
         c,
         o,
         e,
@@ -2212,18 +2363,12 @@ function fi() {
     };
   }, [t, e, i]);
 }
-function Ci() {
-  return fi(), null;
-}
-function bi(e) {
-  return Array.isArray(e) && typeof e[0] == "object";
-}
-function gi(e) {
-  return bi(e) && e.length === 1 ? e[0].src : e;
+function Ni() {
+  return Pi(), null;
 }
-const vi = {}, ne = () => {
+const Ii = {}, re = () => {
 };
-function Ii({
+function Oi({
   title: e,
   playerRef: t,
   src: o,
@@ -2234,98 +2379,106 @@ function Ii({
   locale: c = "en",
   annotations: u = [],
   quizMarkers: d = [],
-  interactive: f = !1,
-  onAnnotationClick: v = ne,
-  onQuizMarkerClick: w = ne,
-  onQuizMarkerShow: y = ne,
-  onInteractivePinClick: N = ne,
-  onCaptionsDelete: h,
+  interactive: _ = !1,
+  onAnnotationClick: b = re,
+  onQuizMarkerClick: w = re,
+  onQuizMarkerShow: y = re,
+  onInteractivePinClick: x = re,
+  onCaptionsDelete: p,
   interactiveMenuElements: C = [],
-  kebabMenuElements: k = [],
-  darkMode: I = !1,
-  autoLoadCaptionSrc: Z = "",
-  forceComments: B = !1,
-  disableCaptionSettings: D = !1,
-  disableStorage: j = !1,
-  startAt: ae,
-  crossOrigin: et,
-  captionOffsetOverride: tt,
-  disableInteractivePinRanges: nt = [],
-  customOverlay: ve,
-  controlsLayout: we = "compact"
+  kebabMenuElements: H = [],
+  darkMode: E = !1,
+  autoLoadCaptionSrc: P = "",
+  forceComments: I = !1,
+  disableCaptionSettings: B = !1,
+  disableStorage: V = !1,
+  startAt: O,
+  crossOrigin: j,
+  captionOffsetOverride: fe,
+  disableInteractivePinRanges: _e = [],
+  customOverlay: ee,
+  controlsLayout: ne = "compact"
 }) {
-  const { contextValue: le, shortcuts: ot, storage: it } = oi(
+  const { contextValue: Ce, shortcuts: ct, storage: ut } = hi(
     a,
+    I,
     B,
-    D,
-    ae
-  ), { i18n: ke } = _();
-  F(() => {
-    ke.changeLanguage(c);
-  }, [ke, c]);
-  const [ye, Le] = x("none"), st = p((H) => {
-    bt(H) ? Le("audio") : (gt(H) || vt(H) || wt(H)) && Le("video");
+    O
+  ), { i18n: Ve } = h();
+  Z(() => {
+    Ve.changeLanguage(c);
+  }, [Ve, c]);
+  const [oe, ie] = k("none"), dt = f((T) => {
+    Lt(T) ? ie("audio") : (xt(T) || Mt(T) || Pt(T)) && ie("video");
   }, []);
   return /* @__PURE__ */ n(
-    Vt,
+    Ht,
     {
+      title: e,
       hideFullScreen: a,
       comments: l,
       captions: i,
       thumbnail: s,
       annotations: u,
       quizMarkers: d,
-      interactive: f,
-      onAnnotationClick: v,
+      interactive: _,
+      onAnnotationClick: b,
       onQuizMarkerClick: w,
-      onInteractivePinClick: N,
+      onInteractivePinClick: x,
       interactiveMenuElements: C,
-      kebabMenuElements: k,
-      darkMode: I,
-      forceComments: B,
-      disableCaptionSettings: D,
-      disableStorage: j,
-      captionOffsetOverride: tt,
-      disableInteractivePinRanges: nt,
+      kebabMenuElements: H,
+      darkMode: E,
+      forceComments: I,
+      disableCaptionSettings: B,
+      disableStorage: V,
+      captionOffsetOverride: fe,
+      disableInteractivePinRanges: _e,
       onQuizMarkerShow: y,
-      onCaptionsDelete: h,
-      controlsLayout: we,
-      children: /* @__PURE__ */ n(Et, { contextValue: le, children: /* @__PURE__ */ r(
-        kt,
+      onCaptionsDelete: p,
+      controlsLayout: ne,
+      startAt: O,
+      children: /* @__PURE__ */ n(Rt, { contextValue: Ce, children: /* @__PURE__ */ r(
+        Nt,
         {
-          "data-version": "0.5.1",
-          crossOrigin: et,
-          storage: j ? null : it,
+          "data-version": "0.5.6",
+          crossOrigin: j,
+          storage: V ? null : ut,
           title: e,
-          src: gi(o),
-          keyShortcuts: ot,
+          src: ui(o),
+          keyShortcuts: ct,
           playsInline: !0,
-          keyDisabled: le.state.interactionsDisabled || le.state.globalKeysDisabled,
-          onTextTracksChange: (H) => {
-            const Me = H == null ? void 0 : H.findIndex(
-              (at) => at.src === Z
+          keyDisabled: Ce.state.interactionsDisabled || Ce.state.globalKeysDisabled,
+          onTextTracksChange: (T) => {
+            const Re = T == null ? void 0 : T.findIndex(
+              (mt) => mt.src === P
             );
-            Me > -1 && (H[Me].mode = "showing");
+            Re > -1 && (T[Re].mode = "showing");
+          },
+          onProviderSetup: dt,
+          onQualitiesChange: (T) => {
+            T.length > 0 && oe === "none" && ie("video");
+          },
+          onLoadedData: () => {
+            oe === "none" && ie("audio");
           },
-          onProviderSetup: st,
           children: [
-            /* @__PURE__ */ r(yt, { className: vi.mediaProvider, children: [
-              ye === "audio" && /* @__PURE__ */ n(si, {}),
-              ye === "video" && /* @__PURE__ */ n(ai, {})
+            /* @__PURE__ */ r(It, { className: Ii.mediaProvider, children: [
+              oe === "audio" && /* @__PURE__ */ n(fi, {}),
+              oe === "video" && /* @__PURE__ */ n(_i, {})
             ] }),
-            /* @__PURE__ */ n(un, {}),
-            ve && ve(),
+            /* @__PURE__ */ n(pn, {}),
+            ee && /* @__PURE__ */ n(Vn, { renderOverlay: ee }),
             /* @__PURE__ */ n(
-              hi,
+              Li,
               {
-                darkMode: I,
+                darkMode: E,
                 playerRef: t,
-                showCaptionsButton: !D,
-                controlsLayout: we
+                showCaptionsButton: !B,
+                controlsLayout: ne
               }
             ),
-            /* @__PURE__ */ n(Rt, { annotations: u }),
-            !!d.length && /* @__PURE__ */ n(Ci, {})
+            /* @__PURE__ */ n(Dt, { annotations: u }),
+            !!d.length && /* @__PURE__ */ n(Ni, {})
           ]
         }
       ) })
@@ -2333,10 +2486,10 @@ function Ii({
   );
 }
 export {
-  _n as CAPTION_FONT_SIZE_MULTIPLIERS,
-  fn as COMMENT_DURATION,
-  $ as PLAYBACK_RATES,
-  Ii as StudioPlayer,
-  Vi as useMediaState,
-  Ti as useMediaStore
+  bn as CAPTION_FONT_SIZE_MULTIPLIERS,
+  vn as COMMENT_DURATION,
+  Y as PLAYBACK_RATES,
+  Oi as StudioPlayer,
+  g as useMediaState,
+  Zi as useMediaStore
 };