@instructure/studio-player 0.2.14 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,14 +1,14 @@
1
- import './index-BDj52-Kq.css';var Ke = Object.defineProperty;
2
- var De = (e, n, o) => n in e ? Ke(e, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[n] = o;
3
- var N = (e, n, o) => De(e, typeof n != "symbol" ? n + "" : n, o);
4
- import { jsx as t, jsxs as a, Fragment as ee } from "react/jsx-runtime";
5
- import { createContext as te, useContext as x, useState as T, useCallback as p, useEffect as B, useMemo as $, useRef as Ce } from "react";
6
- import { useMediaPlayer as A, Spinner as X, useMediaRemote as G, useMediaState as _, isTrackCaptionKind as ze, Track as Ue, Captions as je, usePlaybackRateOptions as qe, useCaptionOptions as We, useVideoQualityOptions as Ge, useMediaStore as ve, Poster as Qe, FullscreenButton as Ye, Time as re, TimeSlider as O, VolumeSlider as U, MediaPlayer as Xe, MediaProvider as Je } from "@vidstack/react";
7
- import { initReactI18next as et, useTranslation as C } from "react-i18next";
8
- import tt from "i18next";
9
- import nt from "i18next-resources-to-backend";
10
- import { useFloating as ge, autoUpdate as be, flip as we, arrow as ke, useDismiss as ye, useInteractions as Le, FloatingFocusManager as ot, FloatingArrow as xe, shift as it, offset as st } from "@floating-ui/react";
11
- const at = (e, n, o) => {
1
+ import './index-C1To2Xmm.css';var $e = Object.defineProperty;
2
+ var Ue = (e, n, o) => n in e ? $e(e, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[n] = o;
3
+ var N = (e, n, o) => Ue(e, typeof n != "symbol" ? n + "" : n, o);
4
+ import { jsx as t, jsxs as a, Fragment as te } from "react/jsx-runtime";
5
+ import { createContext as ne, useContext as oe, useState as P, useCallback as f, useEffect as H, useMemo as I, useRef as ie } from "react";
6
+ import { useMediaPlayer as B, Spinner as J, useMediaRemote as Q, useMediaState as p, isTrackCaptionKind as qe, Track as Ge, Captions as We, usePlaybackRateOptions as je, useCaptionOptions as Qe, useVideoQualityOptions as Ye, useMediaStore as ge, Poster as Xe, FullscreenButton as Je, Time as ue, TimeSlider as z, VolumeSlider as q, MediaPlayer as et, MediaProvider as tt } from "@vidstack/react";
7
+ import { initReactI18next as nt, useTranslation as C } from "react-i18next";
8
+ import ot from "i18next";
9
+ import it from "i18next-resources-to-backend";
10
+ import { useFloating as ve, autoUpdate as be, flip as ye, arrow as we, useDismiss as ke, useInteractions as xe, FloatingFocusManager as st, FloatingArrow as Le, shift as at, offset as ct } from "@floating-ui/react";
11
+ const rt = (e, n, o) => {
12
12
  const i = e[n];
13
13
  return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((s, c) => {
14
14
  (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
@@ -21,9 +21,9 @@ const at = (e, n, o) => {
21
21
  );
22
22
  });
23
23
  };
24
- tt.use(et).use(
25
- nt(
26
- (e) => at(/* @__PURE__ */ Object.assign({ "./locales/en.json": () => import("./en-BlhWGmnp.js"), "./locales/kl.json": () => import("./kl-BRha3TKE.js") }), `./locales/${e}.json`, 3)
24
+ ot.use(nt).use(
25
+ it(
26
+ (e) => rt(/* @__PURE__ */ Object.assign({ "./locales/en.json": () => import("./en-p8Xpb7Qg.js"), "./locales/kl.json": () => import("./kl-Drx4juMa.js") }), `./locales/${e}.json`, 3)
27
27
  )
28
28
  ).init({
29
29
  fallbackLng: "en",
@@ -34,35 +34,35 @@ tt.use(et).use(
34
34
  escapeValue: !1
35
35
  }
36
36
  });
37
- const Pe = te(null);
38
- function ct({
37
+ const Ne = ne(null);
38
+ function lt({
39
39
  children: e,
40
40
  contextValue: n
41
41
  }) {
42
- return /* @__PURE__ */ t(Pe.Provider, { value: n, children: e });
42
+ return /* @__PURE__ */ t(Ne.Provider, { value: n, children: e });
43
43
  }
44
- function v() {
45
- const e = x(Pe);
44
+ function g() {
45
+ const e = oe(Ne);
46
46
  if (!e)
47
47
  throw new Error(
48
48
  "useStudioPlayerContext must be used within a StudioPlayerContextProvider"
49
49
  );
50
50
  return e;
51
51
  }
52
- const Ne = te(null);
53
- function lt({
52
+ const Pe = ne(null);
53
+ function ut({
54
54
  hideFullScreen: e,
55
55
  comments: n,
56
56
  annotations: o,
57
57
  quizMarkers: i,
58
58
  interactive: s,
59
59
  onAnnotationClick: c,
60
- onQuizMarkerClick: l,
61
- onInteractivePinClick: u,
60
+ onQuizMarkerClick: r,
61
+ onInteractivePinClick: l,
62
62
  interactiveMenuElements: m,
63
- darkMode: h,
64
- children: g,
65
- forceComments: y,
63
+ darkMode: _,
64
+ children: v,
65
+ forceComments: x,
66
66
  disableCaptionSettings: k
67
67
  }) {
68
68
  const b = {
@@ -72,102 +72,102 @@ function lt({
72
72
  quizMarkers: i,
73
73
  interactive: s,
74
74
  onAnnotationClick: c,
75
- onQuizMarkerClick: l,
76
- onInteractivePinClick: u,
75
+ onQuizMarkerClick: r,
76
+ onInteractivePinClick: l,
77
77
  interactiveMenuElements: m,
78
- darkMode: h,
78
+ darkMode: _,
79
79
  hasComments: n.length > 0,
80
80
  hasAnnotations: o.length > 0,
81
81
  hasQuizmarkers: i.length > 0,
82
- forceComments: y,
82
+ forceComments: x,
83
83
  disableCaptionSettings: k
84
84
  };
85
- return /* @__PURE__ */ t(Ne.Provider, { value: b, children: g });
85
+ return /* @__PURE__ */ t(Pe.Provider, { value: b, children: v });
86
86
  }
87
- function S() {
88
- const e = x(Ne);
87
+ function E() {
88
+ const e = oe(Pe);
89
89
  if (!e)
90
90
  throw new Error(
91
91
  "useStudioPlayerPropsContext must be used within a StudioPlayerPropsContextProvider"
92
92
  );
93
93
  return e;
94
94
  }
95
- const rt = "_annotation-overlay_1kxzn_1", ut = {
95
+ const dt = "_annotation-overlay_1kxzn_1", mt = {
96
96
  "annotation-overlay": "_annotation-overlay_1kxzn_1",
97
- annotationOverlay: rt
98
- }, ue = 0.25, dt = (e, n) => {
97
+ annotationOverlay: dt
98
+ }, de = 0.25, ht = (e, n) => {
99
99
  let o = !1;
100
100
  return (i) => {
101
101
  const s = i.detail.currentTime;
102
- s >= e.time && s < e.time + ue && !o && (o = !0, n(e)), (s < e.time || s >= e.time + ue) && o && (o = !1);
102
+ s >= e.time && s < e.time + de && !o && (o = !0, n(e)), (s < e.time || s >= e.time + de) && o && (o = !1);
103
103
  };
104
104
  };
105
- function mt({ annotations: e }) {
106
- const n = A(), o = v(), i = S(), [s, c] = T(
105
+ function pt({ annotations: e }) {
106
+ const n = B(), o = g(), i = E(), [s, c] = P(
107
107
  null
108
- ), l = p(
108
+ ), r = f(
109
109
  (m) => {
110
110
  n == null || n.pause(), i.interactive || o.disableInteractions(), c(m);
111
111
  },
112
112
  [n, o]
113
- ), u = () => {
113
+ ), l = () => {
114
114
  i.interactive || (n == null || n.play(), o.enableInteractions()), c(null);
115
115
  };
116
- return B(() => {
116
+ return H(() => {
117
117
  if (!n)
118
118
  return;
119
119
  const m = [];
120
- for (const h of e) {
121
- const g = dt(h, l);
122
- n.addEventListener("time-update", g), m.push(g);
120
+ for (const _ of e) {
121
+ const v = ht(_, r);
122
+ n.addEventListener("time-update", v), m.push(v);
123
123
  }
124
124
  if (s) {
125
- const h = e.find(
126
- (g) => g.id === s.id
125
+ const _ = e.find(
126
+ (v) => v.id === s.id
127
127
  );
128
- h ? c(h) : (c(null), o.enableInteractions());
128
+ _ ? c(_) : (c(null), o.enableInteractions());
129
129
  }
130
130
  return () => {
131
- for (const h of m)
132
- n.removeEventListener("time-update", h);
131
+ for (const _ of m)
132
+ n.removeEventListener("time-update", _);
133
133
  };
134
- }, [n, e]), s ? /* @__PURE__ */ t("div", { className: ut.annotationOverlay, children: s.render(u) }) : null;
134
+ }, [n, e]), s ? /* @__PURE__ */ t("div", { className: mt.annotationOverlay, children: s.render(l) }) : null;
135
135
  }
136
- const ht = "_media-buffering-indicator_1fwjr_1", pt = "_media-buffering-spinner_1fwjr_17", _t = "_media-buffering-spin_1fwjr_17", ft = "_media-buffering-track_1fwjr_22", Ct = "_media-buffering-track-fill_1fwjr_27", j = {
136
+ const _t = "_media-buffering-indicator_1fwjr_1", ft = "_media-buffering-spinner_1fwjr_17", Ct = "_media-buffering-spin_1fwjr_17", gt = "_media-buffering-track_1fwjr_22", vt = "_media-buffering-track-fill_1fwjr_27", G = {
137
137
  "media-buffering-indicator": "_media-buffering-indicator_1fwjr_1",
138
- mediaBufferingIndicator: ht,
138
+ mediaBufferingIndicator: _t,
139
139
  "media-buffering-spinner": "_media-buffering-spinner_1fwjr_17",
140
- mediaBufferingSpinner: pt,
140
+ mediaBufferingSpinner: ft,
141
141
  "media-buffering-spin": "_media-buffering-spin_1fwjr_17",
142
- mediaBufferingSpin: _t,
142
+ mediaBufferingSpin: Ct,
143
143
  "media-buffering-track": "_media-buffering-track_1fwjr_22",
144
- mediaBufferingTrack: ft,
144
+ mediaBufferingTrack: gt,
145
145
  "media-buffering-track-fill": "_media-buffering-track-fill_1fwjr_27",
146
- mediaBufferingTrackFill: Ct
146
+ mediaBufferingTrackFill: vt
147
147
  };
148
- function vt() {
149
- return /* @__PURE__ */ t("div", { className: j.mediaBufferingIndicator, children: /* @__PURE__ */ a(X.Root, { className: j.mediaBufferingSpinner, size: 96, children: [
150
- /* @__PURE__ */ t(X.Track, { className: j.mediaBufferingTrack, width: 8 }),
148
+ function bt() {
149
+ return /* @__PURE__ */ t("div", { className: G.mediaBufferingIndicator, children: /* @__PURE__ */ a(J.Root, { className: G.mediaBufferingSpinner, size: 96, children: [
150
+ /* @__PURE__ */ t(J.Track, { className: G.mediaBufferingTrack, width: 8 }),
151
151
  /* @__PURE__ */ t(
152
- X.TrackFill,
152
+ J.TrackFill,
153
153
  {
154
- className: j.mediaBufferingTrackFill,
154
+ className: G.mediaBufferingTrackFill,
155
155
  width: 8
156
156
  }
157
157
  )
158
158
  ] }) });
159
159
  }
160
- const Te = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
160
+ const Me = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
161
161
  /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104418", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
162
162
  /* @__PURE__ */ t("g", { clipPath: "url(#clip0_149_104418)", children: /* @__PURE__ */ t("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" }) })
163
- ] }), Me = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
163
+ ] }), Ie = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
164
164
  /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104406", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
165
165
  /* @__PURE__ */ t("g", { clipPath: "url(#clip0_149_104406)", children: /* @__PURE__ */ t("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" }) })
166
166
  ] });
167
- function gt() {
168
- const e = G(), n = _("textTrack"), o = _("hasCaptions"), i = n && ze(n), s = v(), c = p(
169
- (l) => {
170
- e.toggleCaptions(l.nativeEvent);
167
+ function yt() {
168
+ const e = Q(), n = p("textTrack"), o = p("hasCaptions"), i = n && qe(n), s = g(), c = f(
169
+ (r) => {
170
+ e.toggleCaptions(r.nativeEvent);
171
171
  },
172
172
  [e]
173
173
  );
@@ -180,18 +180,18 @@ function gt() {
180
180
  "aria-label": "Captions",
181
181
  "aria-pressed": i ? "true" : "false",
182
182
  tabIndex: s.state.interactionsDisabled ? -1 : 0,
183
- children: i ? /* @__PURE__ */ t(Me, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Te, { className: "controls-button-icon" })
183
+ children: i ? /* @__PURE__ */ t(Ie, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Me, { className: "controls-button-icon" })
184
184
  }
185
185
  ) : null;
186
186
  }
187
- const bt = "_captions_13epz_1", wt = {
188
- captions: bt
187
+ const wt = "_captions_13epz_1", kt = {
188
+ captions: wt
189
189
  };
190
- function kt({ captions: e }) {
191
- const n = _("hasCaptions"), o = v();
192
- return /* @__PURE__ */ a(ee, { children: [
190
+ function xt({ captions: e }) {
191
+ const n = p("hasCaptions"), o = g();
192
+ return /* @__PURE__ */ a(te, { children: [
193
193
  e.map((i) => /* @__PURE__ */ t(
194
- Ue,
194
+ Ge,
195
195
  {
196
196
  kind: "subtitles",
197
197
  type: i.type,
@@ -211,14 +211,14 @@ function kt({ captions: e }) {
211
211
  "--captions-color": o.state.captionsInvertColors ? "rgba(22, 22, 22)" : "white",
212
212
  "--captions-background-color": o.state.captionsInvertColors ? "rgba(255, 255, 255, 0.75)" : "rgba(22, 22, 22, 0.75)"
213
213
  },
214
- children: /* @__PURE__ */ t(je, { className: wt.captions })
214
+ children: /* @__PURE__ */ t(We, { className: kt.captions })
215
215
  }
216
216
  ) : null
217
217
  ] });
218
218
  }
219
- const V = [0.5, 0.75, 1, 1.25, 1.5, 2], yt = [0.5, 1, 2, 3, 4], Ie = 5, Lt = (e) => {
220
- const [, n] = T({});
221
- return $(() => {
219
+ const R = [0.5, 0.75, 1, 1.25, 1.5, 2], Lt = [0.5, 1, 2, 3, 4], Se = 5, Nt = (e) => {
220
+ const [, n] = P({});
221
+ return I(() => {
222
222
  let o = [];
223
223
  return {
224
224
  add(i) {
@@ -235,21 +235,21 @@ const V = [0.5, 0.75, 1, 1.25, 1.5, 2], yt = [0.5, 1, 2, 3, 4], Ie = 5, Lt = (e)
235
235
  }
236
236
  };
237
237
  }, []);
238
- }, xt = (e, n, o) => {
238
+ }, Pt = (e, n, o) => {
239
239
  let i = !1;
240
240
  return (s) => {
241
241
  const c = s.detail.currentTime;
242
242
  c >= e.timestamp && c < e.timestamp + n && !i && (o.add(e), i = !0), (c < e.timestamp || c >= e.timestamp + n) && i && (o.remove(e), i = !1);
243
243
  };
244
- }, Pt = (e, n = 5) => {
245
- const o = A(), i = Lt(n);
246
- return B(() => {
244
+ }, Mt = (e, n = 5) => {
245
+ const o = B(), i = Nt(n);
246
+ return H(() => {
247
247
  if (!o)
248
248
  return;
249
249
  const s = [];
250
250
  for (const c of e) {
251
- const l = xt(c, Ie, i);
252
- s.push(l), o.addEventListener("time-update", l);
251
+ const r = Pt(c, Se, i);
252
+ s.push(r), o.addEventListener("time-update", r);
253
253
  }
254
254
  return o.dispatchEvent(
255
255
  new CustomEvent("time-update", {
@@ -261,133 +261,144 @@ const V = [0.5, 0.75, 1, 1.25, 1.5, 2], yt = [0.5, 1, 2, 3, 4], Ie = 5, Lt = (e)
261
261
  i.clear();
262
262
  };
263
263
  }, [o, i, e]), i;
264
- }, Nt = "_comments-overlay_2woxe_1", Tt = "_comments-container_2woxe_9", Mt = "_comment_2woxe_1", It = "_comment-text_2woxe_45", St = "_comment-author-avatar_2woxe_68", Ht = "_comment-author-name_2woxe_87", E = {
265
- "comments-overlay": "_comments-overlay_2woxe_1",
266
- commentsOverlay: Nt,
267
- "comments-container": "_comments-container_2woxe_9",
268
- commentsContainer: Tt,
269
- comment: Mt,
270
- "comment-text": "_comment-text_2woxe_45",
271
- commentText: It,
272
- "comment-author-avatar": "_comment-author-avatar_2woxe_68",
273
- commentAuthorAvatar: St,
274
- "comment-author-name": "_comment-author-name_2woxe_87",
275
- commentAuthorName: Ht
264
+ }, It = "_comments-overlay_1puzm_1", St = "_comments-container_1puzm_10", Tt = "_comment_1puzm_1", Et = "_comment-text_1puzm_47", At = "_comment-author-avatar_1puzm_70", Rt = "_comment-author-name_1puzm_89", V = {
265
+ "comments-overlay": "_comments-overlay_1puzm_1",
266
+ commentsOverlay: It,
267
+ "comments-container": "_comments-container_1puzm_10",
268
+ commentsContainer: St,
269
+ comment: Tt,
270
+ "comment-text": "_comment-text_1puzm_47",
271
+ commentText: Et,
272
+ "comment-author-avatar": "_comment-author-avatar_1puzm_70",
273
+ commentAuthorAvatar: At,
274
+ "comment-author-name": "_comment-author-name_1puzm_89",
275
+ commentAuthorName: Rt
276
276
  };
277
- function Rt({ comment: e }) {
278
- return /* @__PURE__ */ a("div", { className: E.comment, onClick: () => {
277
+ function Vt({ comment: e }) {
278
+ return /* @__PURE__ */ a("div", { className: V.comment, onClick: () => {
279
279
  var n;
280
280
  return (n = e.onClick) == null ? void 0 : n.call(e, e);
281
281
  }, children: [
282
282
  /* @__PURE__ */ t(
283
283
  "img",
284
284
  {
285
- className: E.commentAuthorAvatar,
285
+ className: V.commentAuthorAvatar,
286
286
  src: e.user.avatar,
287
287
  alt: e.user.name
288
288
  }
289
289
  ),
290
- /* @__PURE__ */ t("span", { className: E.commentText, children: e.text }),
291
- /* @__PURE__ */ t("span", { className: E.commentAuthorName, children: e.user.name })
290
+ /* @__PURE__ */ t("span", { className: V.commentText, children: e.text }),
291
+ /* @__PURE__ */ t("span", { className: V.commentAuthorName, children: e.user.name })
292
292
  ] });
293
293
  }
294
- const Vt = 5;
295
- function Et({ comments: e }) {
296
- const n = v(), o = Pt(e, Vt), i = !!_("textTrack"), s = o.map((c) => /* @__PURE__ */ t(Rt, { comment: c }, c.id));
294
+ const Ht = 5;
295
+ function Bt({ comments: e }) {
296
+ const n = g(), o = Mt(e, Ht), i = !!p("textTrack"), s = o.map((c) => /* @__PURE__ */ t(Vt, { comment: c }, c.id));
297
297
  return e.length > 0 && n.state.commentsEnabled ? /* @__PURE__ */ t(
298
298
  "div",
299
299
  {
300
- className: E.commentsOverlay,
300
+ className: V.commentsOverlay,
301
301
  style: {
302
302
  flexDirection: n.state.captionPositionOnTop && i ? "column-reverse" : "column"
303
303
  },
304
- children: /* @__PURE__ */ t("div", { className: E.commentsContainer, children: i ? s.slice(-4) : s })
304
+ children: /* @__PURE__ */ t("div", { className: V.commentsContainer, children: i ? s.slice(-4) : s })
305
305
  }
306
306
  ) : null;
307
307
  }
308
- const Bt = "_root_1x28e_1", At = "_left-controls_1x28e_28", Ot = "_right-controls_1x28e_34", Ft = "_indicators_1x28e_40", Zt = "_normal-timeline_1x28e_49", $t = "_compact-timeline_1x28e_55", R = {
309
- root: Bt,
308
+ const Ot = "_root_1x28e_1", Ft = "_left-controls_1x28e_28", zt = "_right-controls_1x28e_34", Zt = "_indicators_1x28e_40", Kt = "_normal-timeline_1x28e_49", Dt = "_compact-timeline_1x28e_55", A = {
309
+ root: Ot,
310
310
  "left-controls": "_left-controls_1x28e_28",
311
- leftControls: At,
311
+ leftControls: Ft,
312
312
  "right-controls": "_right-controls_1x28e_34",
313
- rightControls: Ot,
314
- indicators: Ft,
313
+ rightControls: zt,
314
+ indicators: Zt,
315
315
  "normal-timeline": "_normal-timeline_1x28e_49",
316
- normalTimeline: Zt,
316
+ normalTimeline: Kt,
317
317
  "compact-timeline": "_compact-timeline_1x28e_55",
318
- compactTimeline: $t
318
+ compactTimeline: Dt
319
319
  };
320
- function Kt({
320
+ function $t({
321
321
  darkMode: e,
322
322
  playerRef: n,
323
323
  showCaptionsButton: o = !0
324
324
  }) {
325
- const i = A();
326
- return B(() => {
325
+ const i = B();
326
+ return H(() => {
327
327
  i && (i.remoteControl.pauseControls(), n && (n.current = i));
328
- }, [i, n]), /* @__PURE__ */ a("div", { "data-darkmode": e, className: R.root, children: [
329
- /* @__PURE__ */ t(he, { className: R.normalTimeline }),
330
- /* @__PURE__ */ a("div", { className: R.leftControls, children: [
331
- /* @__PURE__ */ t(ro, {}),
332
- /* @__PURE__ */ t(hi, {})
328
+ }, [i, n]), /* @__PURE__ */ a("div", { "data-darkmode": e, className: A.root, children: [
329
+ /* @__PURE__ */ t(pe, { className: A.normalTimeline }),
330
+ /* @__PURE__ */ a("div", { className: A.leftControls, children: [
331
+ /* @__PURE__ */ t(fo, {}),
332
+ /* @__PURE__ */ t(vi, {})
333
333
  ] }),
334
- /* @__PURE__ */ t("div", { className: R.indicators, children: /* @__PURE__ */ t(yo, {}) }),
335
- /* @__PURE__ */ t(he, { className: R.compactTimeline }),
336
- /* @__PURE__ */ a("div", { className: R.rightControls, children: [
337
- o && /* @__PURE__ */ t(gt, {}),
338
- /* @__PURE__ */ t(Vn, {}),
339
- /* @__PURE__ */ t(Qn, {})
334
+ /* @__PURE__ */ t("div", { className: A.indicators, children: /* @__PURE__ */ t(Io, {}) }),
335
+ /* @__PURE__ */ t(pe, { className: A.compactTimeline }),
336
+ /* @__PURE__ */ a("div", { className: A.rightControls, children: [
337
+ o && /* @__PURE__ */ t(yt, {}),
338
+ /* @__PURE__ */ t(zn, {}),
339
+ /* @__PURE__ */ t(no, {})
340
340
  ] })
341
341
  ] });
342
342
  }
343
- const P = te(null), Dt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), zt = "_menu-hint_k49ve_1", Ut = "_menu-button_k49ve_5", jt = "_menu-label_k49ve_37", qt = "_menu-icon_k49ve_42", q = {
343
+ const Ut = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), qt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), Gt = "_menu-hint_k49ve_1", Wt = "_menu-button_k49ve_5", jt = "_menu-label_k49ve_37", Qt = "_menu-icon_k49ve_42", W = {
344
344
  "menu-hint": "_menu-hint_k49ve_1",
345
- menuHint: zt,
345
+ menuHint: Gt,
346
346
  "menu-button": "_menu-button_k49ve_5",
347
- menuButton: Ut,
347
+ menuButton: Wt,
348
348
  "menu-label": "_menu-label_k49ve_37",
349
349
  menuLabel: jt,
350
350
  "menu-icon": "_menu-icon_k49ve_42",
351
- menuIcon: qt
351
+ menuIcon: Qt
352
352
  };
353
- function K({ label: e, hint: n, onClick: o, Icon: i }) {
354
- return /* @__PURE__ */ a("button", { type: "button", className: q.menuButton, onClick: o, children: [
355
- i && /* @__PURE__ */ t(i, { className: q.menuIcon }),
356
- /* @__PURE__ */ t("span", { className: q.menuLabel, children: e }),
357
- /* @__PURE__ */ t("span", { className: q.menuHint, children: n }),
358
- /* @__PURE__ */ t(Dt, {})
359
- ] });
353
+ function D({ label: e, hint: n, onClick: o, Icon: i }) {
354
+ return /* @__PURE__ */ a(
355
+ "button",
356
+ {
357
+ type: "button",
358
+ role: "menuitem",
359
+ "aria-label": e,
360
+ tabIndex: -1,
361
+ onClick: o,
362
+ className: W.menuButton,
363
+ children: [
364
+ i && /* @__PURE__ */ t(i, { className: W.menuIcon }),
365
+ /* @__PURE__ */ t("span", { className: W.menuLabel, children: e }),
366
+ /* @__PURE__ */ t("span", { className: W.menuHint, children: n }),
367
+ /* @__PURE__ */ t(qt, {})
368
+ ]
369
+ }
370
+ );
360
371
  }
361
- const Wt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) });
362
- function Gt() {
363
- const e = x(P), n = _("playbackRate"), { t: o } = C(), i = p(() => {
364
- e && e.setPage("speed");
372
+ const Yt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) });
373
+ function Xt() {
374
+ const e = L(), n = p("playbackRate"), { t: o } = C(), i = f(() => {
375
+ e.setPage("speed");
365
376
  }, [e]);
366
- return e ? /* @__PURE__ */ t(
367
- K,
377
+ return /* @__PURE__ */ t(
378
+ D,
368
379
  {
369
380
  label: o("PLAYBACK_SPEED"),
370
381
  hint: `${n}x`,
371
382
  onClick: i,
372
- Icon: Wt
383
+ Icon: Yt
373
384
  }
374
- ) : null;
385
+ );
375
386
  }
376
- function Qt() {
377
- const e = x(P), n = _("hasCaptions"), o = _("textTrack"), { t: i } = C(), s = p(() => {
378
- e && e.setPage("captions");
387
+ function Jt() {
388
+ const e = L(), n = p("hasCaptions"), o = p("textTrack"), { t: i } = C(), s = f(() => {
389
+ e.setPage("captions");
379
390
  }, [e]);
380
- return e && n ? /* @__PURE__ */ t(
381
- K,
391
+ return n ? /* @__PURE__ */ t(
392
+ D,
382
393
  {
383
394
  label: i("CAPTIONS"),
384
395
  hint: (o == null ? void 0 : o.label) ?? i("OFF"),
385
396
  onClick: s,
386
- Icon: Te
397
+ Icon: Me
387
398
  }
388
399
  ) : null;
389
400
  }
390
- const Yt = (e) => /* @__PURE__ */ a("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
401
+ const en = (e) => /* @__PURE__ */ a("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
391
402
  /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_412_23039", children: /* @__PURE__ */ t("rect", { width: 18, height: 18, fill: "white" }) }) }),
392
403
  /* @__PURE__ */ a("g", { clipPath: "url(#clip0_412_23039)", children: [
393
404
  /* @__PURE__ */ t("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" }),
@@ -395,183 +406,265 @@ const Yt = (e) => /* @__PURE__ */ a("svg", { width: 18, height: 18, viewBox: "0
395
406
  /* @__PURE__ */ t("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" })
396
407
  ] })
397
408
  ] });
398
- function Xt() {
399
- const e = x(P), n = _("autoQuality"), o = _("quality"), { t: i } = C(), s = p(() => {
400
- e && e.setPage("quality");
409
+ function tn() {
410
+ const e = L(), n = p("autoQuality"), o = p("quality"), { t: i } = C(), s = f(() => {
411
+ e.setPage("quality");
401
412
  }, [e]);
402
- return e && o ? /* @__PURE__ */ t(
403
- K,
413
+ return o ? /* @__PURE__ */ t(
414
+ D,
404
415
  {
405
416
  label: i("QUALITY"),
406
417
  hint: n ? i("AUTO", { quality: o.height }) : `${o.height}p`,
407
418
  onClick: s,
408
- Icon: Yt
419
+ Icon: en
409
420
  }
410
421
  ) : null;
411
422
  }
412
- const Jt = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), en = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), tn = "_switch-track_vptv3_1", nn = "_switch-thumb_vptv3_11", on = "_switch-icon_vptv3_25", sn = "_switch-body_vptv3_31", an = "_switch-label_vptv3_68", cn = "_menu-icon_vptv3_72", I = {
413
- "switch-track": "_switch-track_vptv3_1",
414
- switchTrack: tn,
415
- "switch-thumb": "_switch-thumb_vptv3_11",
416
- switchThumb: nn,
417
- "switch-icon": "_switch-icon_vptv3_25",
418
- switchIcon: on,
419
- "switch-body": "_switch-body_vptv3_31",
420
- switchBody: sn,
421
- "switch-label": "_switch-label_vptv3_68",
422
- switchLabel: an,
423
- "menu-icon": "_menu-icon_vptv3_72",
424
- menuIcon: cn
423
+ const nn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), on = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), sn = "_switch-track_1d65g_1", an = "_switch-thumb_1d65g_12", cn = "_switch-icon_1d65g_26", rn = "_switch-body_1d65g_32", ln = "_switch-label_1d65g_73", un = "_menu-icon_1d65g_77", T = {
424
+ "switch-track": "_switch-track_1d65g_1",
425
+ switchTrack: sn,
426
+ "switch-thumb": "_switch-thumb_1d65g_12",
427
+ switchThumb: an,
428
+ "switch-icon": "_switch-icon_1d65g_26",
429
+ switchIcon: cn,
430
+ "switch-body": "_switch-body_1d65g_32",
431
+ switchBody: rn,
432
+ "switch-label": "_switch-label_1d65g_73",
433
+ switchLabel: ln,
434
+ "menu-icon": "_menu-icon_1d65g_77",
435
+ menuIcon: un
425
436
  };
426
- function ne({
437
+ function se({
427
438
  label: e,
428
439
  checked: n = !1,
429
440
  onClick: o,
430
441
  Icon: i
431
442
  }) {
432
- const s = p(
433
- (c) => {
434
- (c.key === "Enter" || c.key === " ") && (o == null || o());
435
- },
436
- [o]
437
- );
438
443
  return /* @__PURE__ */ a(
439
- "div",
444
+ "button",
440
445
  {
441
- className: I.switchBody,
442
- role: "menuitemcheckbox",
446
+ className: T.switchBody,
447
+ role: "checkbox",
448
+ "aria-label": e,
443
449
  "aria-checked": n,
444
450
  onClick: o,
445
- onKeyDown: s,
446
- tabIndex: 0,
451
+ tabIndex: -1,
447
452
  children: [
448
- i && /* @__PURE__ */ t(i, { className: I.menuIcon }),
449
- /* @__PURE__ */ t("span", { className: I.switchLabel, children: e }),
450
- /* @__PURE__ */ t("div", { className: I.switchTrack, children: /* @__PURE__ */ t("div", { className: I.switchThumb, children: n ? /* @__PURE__ */ t(Jt, { className: I.switchIcon }) : /* @__PURE__ */ t(en, { className: I.switchIcon }) }) })
453
+ i && /* @__PURE__ */ t(i, { className: T.menuIcon }),
454
+ /* @__PURE__ */ t("span", { className: T.switchLabel, children: e }),
455
+ /* @__PURE__ */ t("div", { className: T.switchTrack, children: /* @__PURE__ */ t("div", { className: T.switchThumb, children: n ? /* @__PURE__ */ t(nn, { className: T.switchIcon }) : /* @__PURE__ */ t(on, { className: T.switchIcon }) }) })
451
456
  ]
452
457
  }
453
458
  );
454
459
  }
455
- const ln = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) });
456
- function rn() {
457
- const { t: e } = C(), n = S(), o = v();
460
+ const dn = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) });
461
+ function mn() {
462
+ const { t: e } = C(), n = E(), o = g();
458
463
  return !n.forceComments && n.hasComments ? /* @__PURE__ */ t(
459
- ne,
464
+ se,
460
465
  {
461
- Icon: ln,
466
+ Icon: dn,
462
467
  label: e("COMMENTS"),
463
468
  onClick: o.toggleComments,
464
469
  checked: o.state.commentsEnabled
465
470
  }
466
471
  ) : null;
467
472
  }
468
- function H(e) {
469
- B(() => {
473
+ const hn = "_main-menu_7h96l_1", pn = {
474
+ "main-menu": "_main-menu_7h96l_1",
475
+ mainMenu: hn
476
+ };
477
+ function Te(e) {
478
+ H(() => {
470
479
  const n = (o) => {
471
- o.key === "Escape" && (e == null || e());
480
+ var i;
481
+ (i = e[o.key]) == null || i.call(e, o);
472
482
  };
473
- return document.addEventListener("keydown", n), () => {
483
+ return document.addEventListener("keydown", n, { passive: !0 }), () => {
474
484
  document.removeEventListener("keydown", n);
475
485
  };
476
- }, []);
486
+ }, [e]);
477
487
  }
478
- const un = "_main-menu_7h96l_1", dn = {
479
- "main-menu": "_main-menu_7h96l_1",
480
- mainMenu: un
481
- };
482
- function mn() {
483
- const e = x(P);
484
- return H(e == null ? void 0 : e.toggle), /* @__PURE__ */ a("div", { className: dn.mainMenu, children: [
485
- /* @__PURE__ */ t(Gt, {}),
486
- /* @__PURE__ */ t(Qt, {}),
487
- /* @__PURE__ */ t(rn, {}),
488
- /* @__PURE__ */ t(Xt, {})
489
- ] });
488
+ function _n(e) {
489
+ const n = I(() => ({ Escape: e }), [e]);
490
+ return Te(n);
490
491
  }
491
- const Q = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), D = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), hn = "_menu-container_1bjr3_1", pn = "_menu-options_1bjr3_6", _n = "_menu-heading_1bjr3_11", fn = "_check-icon_1bjr3_27", Cn = "_menu-item-label_1bjr3_33", vn = "_menu-item_1bjr3_33", gn = "_menu-back-button_1bjr3_66", r = {
492
- "menu-container": "_menu-container_1bjr3_1",
493
- menuContainer: hn,
494
- "menu-options": "_menu-options_1bjr3_6",
495
- menuOptions: pn,
496
- "menu-heading": "_menu-heading_1bjr3_11",
497
- menuHeading: _n,
498
- "check-icon": "_check-icon_1bjr3_27",
499
- checkIcon: fn,
500
- "menu-item-label": "_menu-item-label_1bjr3_33",
501
- menuItemLabel: Cn,
502
- "menu-item": "_menu-item_1bjr3_33",
503
- menuItem: vn,
504
- "menu-back-button": "_menu-back-button_1bjr3_66",
505
- menuBackButton: gn
492
+ const L = () => {
493
+ const e = oe(Ee);
494
+ if (!e)
495
+ throw new Error(
496
+ "useCustomSettingsMenuContext must be used within a CustomSettingsMenuContext.Provider"
497
+ );
498
+ return e;
506
499
  };
500
+ function fn(e, n) {
501
+ const o = Array.from(e.querySelectorAll("button")), i = o.indexOf(n);
502
+ return o[i - 1] ?? null;
503
+ }
504
+ function Cn(e, n) {
505
+ const o = Array.from(e.querySelectorAll("button")), i = o.indexOf(n);
506
+ return o[i + 1] ?? null;
507
+ }
508
+ function gn(e) {
509
+ return e.querySelector("button");
510
+ }
511
+ function vn(e) {
512
+ const n = Array.from(e.querySelectorAll("button"));
513
+ return n[n.length - 1] ?? null;
514
+ }
515
+ function O() {
516
+ const e = L(), n = ie(null), o = I(
517
+ () => ({
518
+ Escape: e.toggle,
519
+ ArrowUp: () => {
520
+ const i = document.activeElement;
521
+ if (i && n.current && n.current.contains(i)) {
522
+ const s = fn(
523
+ n.current,
524
+ i
525
+ );
526
+ s == null || s.focus();
527
+ } else if (n.current) {
528
+ const s = vn(n.current);
529
+ s == null || s.focus();
530
+ }
531
+ },
532
+ ArrowDown: () => {
533
+ const i = document.activeElement;
534
+ if (i && n.current && n.current.contains(i)) {
535
+ const s = Cn(
536
+ n.current,
537
+ i
538
+ );
539
+ s == null || s.focus();
540
+ } else if (n.current) {
541
+ const s = gn(n.current);
542
+ s == null || s.focus();
543
+ }
544
+ },
545
+ ArrowRight: () => {
546
+ const i = document.activeElement;
547
+ i && n.current && n.current.contains(i) && i.click();
548
+ },
549
+ ArrowLeft: e.back
550
+ }),
551
+ [e]
552
+ );
553
+ return Te(o), n;
554
+ }
507
555
  function bn() {
508
- const e = x(P), n = qe({
509
- rates: V,
556
+ const e = O(), { t: n } = C();
557
+ return /* @__PURE__ */ a(
558
+ "div",
559
+ {
560
+ ref: e,
561
+ id: "submenu",
562
+ "aria-label": n("MAIN_MENU"),
563
+ role: "menu",
564
+ className: pn.mainMenu,
565
+ children: [
566
+ /* @__PURE__ */ t(Xt, {}),
567
+ /* @__PURE__ */ t(Jt, {}),
568
+ /* @__PURE__ */ t(mn, {}),
569
+ /* @__PURE__ */ t(tn, {})
570
+ ]
571
+ }
572
+ );
573
+ }
574
+ const Y = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), $ = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), yn = "_menu-container_1lrzf_1", wn = "_menu-heading_1lrzf_6", kn = "_check-icon_1lrzf_22", xn = "_menu-item-label_1lrzf_28", Ln = "_menu-item_1lrzf_28", Nn = "_menu-back-button_1lrzf_61", d = {
575
+ "menu-container": "_menu-container_1lrzf_1",
576
+ menuContainer: yn,
577
+ "menu-heading": "_menu-heading_1lrzf_6",
578
+ menuHeading: wn,
579
+ "check-icon": "_check-icon_1lrzf_22",
580
+ checkIcon: kn,
581
+ "menu-item-label": "_menu-item-label_1lrzf_28",
582
+ menuItemLabel: xn,
583
+ "menu-item": "_menu-item_1lrzf_28",
584
+ menuItem: Ln,
585
+ "menu-back-button": "_menu-back-button_1lrzf_61",
586
+ menuBackButton: Nn
587
+ };
588
+ function Pn() {
589
+ const e = L(), n = je({
590
+ rates: R,
510
591
  normalLabel: "1x"
511
- }), { t: o } = C();
512
- return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
513
- /* @__PURE__ */ a(
514
- "button",
515
- {
516
- type: "button",
517
- className: r.menuBackButton,
518
- onClick: e.backToMain,
519
- children: [
520
- /* @__PURE__ */ t(D, {}),
521
- /* @__PURE__ */ t("span", { children: o("BACK") })
522
- ]
523
- }
524
- ),
525
- /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("PLAYBACK_SPEED") }),
526
- /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label: s, select: c, selected: l }) => /* @__PURE__ */ a(
527
- "button",
528
- {
529
- type: "button",
530
- role: "menuitemradio",
531
- "aria-checked": l,
532
- onClick: () => {
533
- c(), e.backToMain(), e.toggle();
534
- },
535
- className: r.menuItem,
536
- children: [
537
- /* @__PURE__ */ t(Q, { className: r.checkIcon }),
538
- /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: s })
539
- ]
540
- },
541
- i
542
- )) })
543
- ] }) : null;
592
+ }), { t: o } = C(), i = O();
593
+ return /* @__PURE__ */ a(
594
+ "div",
595
+ {
596
+ ref: i,
597
+ id: "submenu",
598
+ "aria-label": o("SPEED_MENU"),
599
+ role: "menu",
600
+ className: d.menuContainer,
601
+ children: [
602
+ /* @__PURE__ */ a(
603
+ "button",
604
+ {
605
+ type: "button",
606
+ role: "menuitem",
607
+ tabIndex: -1,
608
+ className: d.menuBackButton,
609
+ onClick: e.back,
610
+ children: [
611
+ /* @__PURE__ */ t($, {}),
612
+ /* @__PURE__ */ t("span", { children: o("BACK") })
613
+ ]
614
+ }
615
+ ),
616
+ /* @__PURE__ */ t("strong", { className: d.menuHeading, children: o("PLAYBACK_SPEED") }),
617
+ n.map(({ value: s, label: c, select: r, selected: l }) => /* @__PURE__ */ a(
618
+ "button",
619
+ {
620
+ type: "button",
621
+ role: "menuitemradio",
622
+ "aria-label": c,
623
+ "aria-checked": l,
624
+ onClick: () => r(),
625
+ tabIndex: -1,
626
+ className: d.menuItem,
627
+ children: [
628
+ /* @__PURE__ */ t(Y, { className: d.checkIcon }),
629
+ /* @__PURE__ */ t("span", { className: d.menuItemLabel, children: c })
630
+ ]
631
+ },
632
+ s
633
+ ))
634
+ ]
635
+ }
636
+ );
544
637
  }
545
- function wn() {
546
- const e = x(P), n = _("textTrack"), { t: o } = C(), i = p(() => {
547
- e && e.setPage("captionLanguage");
638
+ function Mn() {
639
+ const e = L(), n = p("textTrack"), { t: o } = C(), { disableCaptionSettings: i } = g(), s = f(() => {
640
+ e.setPage("captionLanguage");
548
641
  }, [e]);
549
- return e ? /* @__PURE__ */ t(
550
- K,
642
+ return i ? null : /* @__PURE__ */ t(
643
+ D,
551
644
  {
552
645
  label: o("LANGUAGE"),
553
646
  hint: (n == null ? void 0 : n.label) ?? o("OFF"),
554
- onClick: i
647
+ onClick: s
555
648
  }
556
- ) : null;
649
+ );
557
650
  }
558
- function kn() {
559
- const { t: e } = C(), n = v(), o = x(P), i = p(() => {
560
- o && o.setPage("captionFontSize");
651
+ function In() {
652
+ const { t: e } = C(), n = g(), o = L(), i = f(() => {
653
+ o.setPage("captionFontSize");
561
654
  }, [o]);
562
- return o ? /* @__PURE__ */ t(
563
- K,
655
+ return /* @__PURE__ */ t(
656
+ D,
564
657
  {
565
658
  label: e("CAPTION_FONT_SIZE"),
566
659
  hint: `${n.state.captionsFontSizeMultiplier * 100}%`,
567
660
  onClick: i
568
661
  }
569
- ) : null;
662
+ );
570
663
  }
571
- function yn() {
572
- const { t: e } = C(), n = v();
664
+ function Sn() {
665
+ const { t: e } = C(), n = g();
573
666
  return /* @__PURE__ */ t(
574
- ne,
667
+ se,
575
668
  {
576
669
  label: e("ON_TOP"),
577
670
  onClick: n.toggleCaptionPositionOnTop,
@@ -579,10 +672,10 @@ function yn() {
579
672
  }
580
673
  );
581
674
  }
582
- function Ln() {
583
- const { t: e } = C(), n = v();
675
+ function Tn() {
676
+ const { t: e } = C(), n = g();
584
677
  return /* @__PURE__ */ t(
585
- ne,
678
+ se,
586
679
  {
587
680
  label: e("INVERT_COLORS"),
588
681
  onClick: n.toggleCaptionsInvertColors,
@@ -590,238 +683,277 @@ function Ln() {
590
683
  }
591
684
  );
592
685
  }
593
- function xn() {
594
- const e = x(P), { t: n } = C(), { disableCaptionSettings: o } = v();
595
- return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
596
- /* @__PURE__ */ a(
597
- "button",
598
- {
599
- type: "button",
600
- className: r.menuBackButton,
601
- onClick: e.backToMain,
602
- children: [
603
- /* @__PURE__ */ t(D, {}),
604
- /* @__PURE__ */ t("span", { children: n("BACK") })
605
- ]
606
- }
607
- ),
608
- /* @__PURE__ */ t("strong", { className: r.menuHeading, children: n("CAPTIONS") }),
609
- !o && /* @__PURE__ */ t(wn, {}),
610
- /* @__PURE__ */ t(kn, {}),
611
- /* @__PURE__ */ t(yn, {}),
612
- /* @__PURE__ */ t(Ln, {})
613
- ] }) : null;
686
+ function En() {
687
+ const e = L(), { t: n } = C(), o = O();
688
+ return /* @__PURE__ */ a(
689
+ "div",
690
+ {
691
+ ref: o,
692
+ id: "submenu",
693
+ "aria-label": n("CAPTIONS_MENU"),
694
+ role: "menu",
695
+ className: d.menuContainer,
696
+ children: [
697
+ /* @__PURE__ */ a(
698
+ "button",
699
+ {
700
+ type: "button",
701
+ role: "menuitem",
702
+ tabIndex: -1,
703
+ className: d.menuBackButton,
704
+ onClick: e.back,
705
+ children: [
706
+ /* @__PURE__ */ t($, {}),
707
+ /* @__PURE__ */ t("span", { children: n("BACK") })
708
+ ]
709
+ }
710
+ ),
711
+ /* @__PURE__ */ t("strong", { className: d.menuHeading, children: n("CAPTIONS") }),
712
+ /* @__PURE__ */ t(Mn, {}),
713
+ /* @__PURE__ */ t(In, {}),
714
+ /* @__PURE__ */ t(Sn, {}),
715
+ /* @__PURE__ */ t(Tn, {})
716
+ ]
717
+ }
718
+ );
614
719
  }
615
- function Pn() {
616
- const e = x(P), n = We(), { t: o } = C();
617
- return H(e == null ? void 0 : e.backToCaptions), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
618
- /* @__PURE__ */ a(
619
- "button",
620
- {
621
- type: "button",
622
- className: r.menuBackButton,
623
- onClick: e.backToCaptions,
624
- children: [
625
- /* @__PURE__ */ t(D, {}),
626
- /* @__PURE__ */ t("span", { children: o("BACK") })
627
- ]
628
- }
629
- ),
630
- /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
631
- /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label: s, select: c, selected: l }) => /* @__PURE__ */ a(
632
- "button",
633
- {
634
- type: "button",
635
- role: "menuitemradio",
636
- "aria-checked": l,
637
- onClick: () => {
638
- c(), e.backToMain(), e.toggle();
639
- },
640
- className: r.menuItem,
641
- children: [
642
- /* @__PURE__ */ t(Q, { className: r.checkIcon }),
643
- /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: s })
644
- ]
645
- },
646
- i
647
- )) })
648
- ] }) : null;
720
+ function An() {
721
+ const e = L(), n = Qe(), { t: o } = C(), i = O();
722
+ return /* @__PURE__ */ a(
723
+ "div",
724
+ {
725
+ ref: i,
726
+ id: "submenu",
727
+ "aria-label": o("CAPTIONS_LANGUAGE_MENU"),
728
+ role: "menu",
729
+ className: d.menuContainer,
730
+ children: [
731
+ /* @__PURE__ */ a(
732
+ "button",
733
+ {
734
+ type: "button",
735
+ role: "menuitem",
736
+ tabIndex: -1,
737
+ className: d.menuBackButton,
738
+ onClick: e.back,
739
+ children: [
740
+ /* @__PURE__ */ t($, {}),
741
+ /* @__PURE__ */ t("span", { children: o("BACK") })
742
+ ]
743
+ }
744
+ ),
745
+ /* @__PURE__ */ t("strong", { className: d.menuHeading, children: o("CAPTIONS") }),
746
+ n.map(({ value: s, label: c, select: r, selected: l }) => /* @__PURE__ */ a(
747
+ "button",
748
+ {
749
+ type: "button",
750
+ role: "menuitemradio",
751
+ "aria-checked": l,
752
+ onClick: () => r(),
753
+ tabIndex: -1,
754
+ className: d.menuItem,
755
+ children: [
756
+ /* @__PURE__ */ t(Y, { className: d.checkIcon }),
757
+ /* @__PURE__ */ t("span", { className: d.menuItemLabel, children: c })
758
+ ]
759
+ },
760
+ s
761
+ ))
762
+ ]
763
+ }
764
+ );
649
765
  }
650
- function Nn() {
651
- const e = v(), n = x(P), { t: o } = C();
652
- return H(n == null ? void 0 : n.backToCaptions), n ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
653
- /* @__PURE__ */ a(
654
- "button",
655
- {
656
- type: "button",
657
- className: r.menuBackButton,
658
- onClick: n.backToCaptions,
659
- children: [
660
- /* @__PURE__ */ t(D, {}),
661
- /* @__PURE__ */ t("span", { children: o("BACK") })
662
- ]
663
- }
664
- ),
665
- /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
666
- /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: yt.map((i) => /* @__PURE__ */ a(
667
- "button",
668
- {
669
- type: "button",
670
- role: "menuitemradio",
671
- "aria-checked": i === e.state.captionsFontSizeMultiplier,
672
- onClick: () => {
673
- e.setCaptionsFontSizeMultiplier(i), n.backToMain(), n.toggle();
674
- },
675
- className: r.menuItem,
676
- children: [
677
- /* @__PURE__ */ t(Q, { className: r.checkIcon }),
678
- /* @__PURE__ */ a("span", { className: r.menuItemLabel, children: [
679
- i * 100,
680
- "%"
681
- ] })
682
- ]
683
- },
684
- i
685
- )) })
686
- ] }) : null;
766
+ function Rn() {
767
+ const e = g(), n = L(), { t: o } = C(), i = O();
768
+ return /* @__PURE__ */ a(
769
+ "div",
770
+ {
771
+ ref: i,
772
+ id: "submenu",
773
+ "aria-label": o("CAPTIONS_FONT_SIZE_MENU"),
774
+ role: "menu",
775
+ className: d.menuContainer,
776
+ children: [
777
+ /* @__PURE__ */ a(
778
+ "button",
779
+ {
780
+ type: "button",
781
+ role: "menuitem",
782
+ tabIndex: -1,
783
+ className: d.menuBackButton,
784
+ onClick: n.back,
785
+ children: [
786
+ /* @__PURE__ */ t($, {}),
787
+ /* @__PURE__ */ t("span", { children: o("BACK") })
788
+ ]
789
+ }
790
+ ),
791
+ /* @__PURE__ */ t("strong", { className: d.menuHeading, children: o("CAPTIONS") }),
792
+ Lt.map((s) => /* @__PURE__ */ a(
793
+ "button",
794
+ {
795
+ type: "button",
796
+ role: "menuitemradio",
797
+ "aria-checked": s === e.state.captionsFontSizeMultiplier,
798
+ onClick: () => {
799
+ e.setCaptionsFontSizeMultiplier(s);
800
+ },
801
+ tabIndex: -1,
802
+ className: d.menuItem,
803
+ children: [
804
+ /* @__PURE__ */ t(Y, { className: d.checkIcon }),
805
+ /* @__PURE__ */ a("span", { className: d.menuItemLabel, children: [
806
+ s * 100,
807
+ "%"
808
+ ] })
809
+ ]
810
+ },
811
+ s
812
+ ))
813
+ ]
814
+ }
815
+ );
687
816
  }
688
- function Tn() {
689
- const e = x(P), n = Ge({ sort: "descending" }), o = _("autoQuality"), { t: i } = C();
690
- return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
691
- /* @__PURE__ */ a(
692
- "button",
693
- {
694
- type: "button",
695
- className: r.menuBackButton,
696
- onClick: e.backToMain,
697
- children: [
698
- /* @__PURE__ */ t(D, {}),
699
- /* @__PURE__ */ t("span", { children: i("BACK") })
700
- ]
701
- }
702
- ),
703
- /* @__PURE__ */ t("strong", { className: r.menuHeading, children: i("QUALITY") }),
704
- /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: s, label: c, select: l, selected: u }) => /* @__PURE__ */ a(
705
- "button",
706
- {
707
- type: "button",
708
- role: "menuitemradio",
709
- "aria-checked": s === "auto" && o || u && !o,
710
- onClick: () => {
711
- l(), e.backToMain(), e.toggle();
712
- },
713
- className: r.menuItem,
714
- children: [
715
- /* @__PURE__ */ t(Q, { className: r.checkIcon }),
716
- /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: c })
717
- ]
718
- },
719
- s
720
- )) })
721
- ] }) : null;
722
- }
723
- const Mn = {
724
- main: mn,
725
- speed: bn,
726
- captions: xn,
727
- captionLanguage: Pn,
728
- captionFontSize: Nn,
729
- quality: Tn
817
+ function Vn() {
818
+ const e = L(), n = Ye({ sort: "descending" }), o = p("autoQuality"), { t: i } = C(), s = O();
819
+ return /* @__PURE__ */ a(
820
+ "div",
821
+ {
822
+ ref: s,
823
+ id: "submenu",
824
+ "aria-label": i("QUALITY_MENU"),
825
+ role: "menu",
826
+ className: d.menuContainer,
827
+ children: [
828
+ /* @__PURE__ */ a(
829
+ "button",
830
+ {
831
+ type: "button",
832
+ role: "menuitem",
833
+ tabIndex: -1,
834
+ className: d.menuBackButton,
835
+ onClick: e.back,
836
+ children: [
837
+ /* @__PURE__ */ t($, {}),
838
+ /* @__PURE__ */ t("span", { children: i("BACK") })
839
+ ]
840
+ }
841
+ ),
842
+ /* @__PURE__ */ t("strong", { className: d.menuHeading, children: i("QUALITY") }),
843
+ n.map(({ value: c, label: r, select: l, selected: m }) => /* @__PURE__ */ a(
844
+ "button",
845
+ {
846
+ type: "button",
847
+ role: "menuitemradio",
848
+ "aria-checked": c === "auto" && o || m && !o,
849
+ onClick: () => l(),
850
+ tabIndex: -1,
851
+ className: d.menuItem,
852
+ children: [
853
+ /* @__PURE__ */ t(Y, { className: d.checkIcon }),
854
+ /* @__PURE__ */ t("span", { className: d.menuItemLabel, children: r })
855
+ ]
856
+ },
857
+ c
858
+ ))
859
+ ]
860
+ }
861
+ );
862
+ }
863
+ const Ee = ne(null), Hn = {
864
+ main: bn,
865
+ speed: Pn,
866
+ captions: En,
867
+ captionLanguage: An,
868
+ captionFontSize: Rn,
869
+ quality: Vn
730
870
  };
731
- function In() {
732
- const [e, n] = T("main"), [o, i] = T(!1), s = p(() => {
733
- i((M) => !M);
734
- }, []), c = p((M) => {
735
- n(M);
736
- }, []), l = p(() => {
737
- n("captions");
738
- }, []), u = p(() => {
739
- n("main");
740
- }, []), m = $(() => Mn[e], [e]), h = Ce(null), { refs: g, floatingStyles: y, context: k } = ge({
741
- open: o,
742
- onOpenChange: (M) => {
743
- i(M), u();
744
- },
871
+ function Bn() {
872
+ const e = g(), [n, o] = P(["main"]), [i, s] = P(!1), c = f(() => {
873
+ s(!i), o(["main"]), e.setGlobalKeysDisabled(!i);
874
+ }, [i]), r = f((M) => {
875
+ o((F) => F.concat(M));
876
+ }, []), l = f(() => {
877
+ o((M) => M.length > 1 ? M.slice(0, -1) : M);
878
+ }, []), m = I(() => Hn[n[n.length - 1]], [n]), _ = ie(null), { refs: v, floatingStyles: x, context: k } = ve({
879
+ open: i,
880
+ onOpenChange: c,
745
881
  placement: "top-end",
746
882
  whileElementsMounted: be,
747
883
  middleware: [
748
- we(),
749
- ke({
750
- element: h
884
+ ye(),
885
+ we({
886
+ element: _
751
887
  })
752
888
  ]
753
- }), b = ye(k, { escapeKey: !1 }), { getReferenceProps: f, getFloatingProps: w } = Le([b]);
889
+ }), b = ke(k, { escapeKey: !1 }), { getReferenceProps: S, getFloatingProps: h } = xe([b]), y = I(
890
+ () => ({ setPage: r, back: l, toggle: c }),
891
+ [l, r, c]
892
+ );
754
893
  return {
755
894
  Page: m,
756
- open: o,
757
- toggle: s,
758
- setPage: c,
759
- backToCaptions: l,
760
- backToMain: u,
761
- arrowRef: h,
762
- refs: g,
763
- floatingStyles: y,
895
+ open: i,
896
+ arrowRef: _,
897
+ refs: v,
898
+ floatingStyles: x,
764
899
  context: k,
765
- getReferenceProps: f,
766
- getFloatingProps: w
900
+ getReferenceProps() {
901
+ return {
902
+ ...S(),
903
+ tabIndex: e.state.interactionsDisabled ? -1 : 0
904
+ };
905
+ },
906
+ getFloatingProps: h,
907
+ contextValue: y
767
908
  };
768
909
  }
769
- const Sn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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 = "_settings-menu_hxlsv_1", Rn = "_arrow_hxlsv_15", de = {
770
- "settings-menu": "_settings-menu_hxlsv_1",
771
- settingsMenu: Hn,
772
- arrow: Rn
910
+ const On = "_settings-menu_7d0td_1", Fn = "_arrow_7d0td_19", me = {
911
+ "settings-menu": "_settings-menu_7d0td_1",
912
+ settingsMenu: On,
913
+ arrow: Fn
773
914
  };
774
- function Vn() {
915
+ function zn() {
775
916
  const {
776
917
  Page: e,
777
918
  arrowRef: n,
778
- backToCaptions: o,
779
- backToMain: i,
780
- context: s,
781
- floatingStyles: c,
782
- getFloatingProps: l,
783
- getReferenceProps: u,
784
- open: m,
785
- refs: h,
786
- setPage: g,
787
- toggle: y
788
- } = In(), k = v(), { t: b } = C();
789
- return /* @__PURE__ */ a(ee, { children: [
919
+ context: o,
920
+ floatingStyles: i,
921
+ getFloatingProps: s,
922
+ getReferenceProps: c,
923
+ open: r,
924
+ refs: l,
925
+ contextValue: m
926
+ } = Bn(), { t: _ } = C();
927
+ return /* @__PURE__ */ a(te, { children: [
790
928
  /* @__PURE__ */ t(
791
929
  "button",
792
930
  {
793
- ref: h.setReference,
931
+ ref: l.setReference,
794
932
  type: "button",
795
933
  className: "controls-button",
796
- "aria-label": b("SETTINGS"),
797
- onClick: y,
798
- "aria-expanded": m,
799
- tabIndex: k != null && k.state.interactionsDisabled ? -1 : 0,
800
- ...u(),
801
- children: /* @__PURE__ */ t(Sn, { className: "controls-button-icon icon-rotate" })
934
+ "aria-label": _("SETTINGS"),
935
+ onClick: m.toggle,
936
+ "aria-expanded": r,
937
+ ...c(),
938
+ children: /* @__PURE__ */ t(Ut, { className: "controls-button-icon icon-rotate" })
802
939
  }
803
940
  ),
804
- m && /* @__PURE__ */ t(ot, { context: s, initialFocus: -1, modal: !1, children: /* @__PURE__ */ a(
941
+ r && /* @__PURE__ */ t(st, { context: o, restoreFocus: !0, modal: !1, children: /* @__PURE__ */ a(
805
942
  "div",
806
943
  {
807
- className: de.settingsMenu,
808
- ref: h.setFloating,
809
- style: c,
810
- ...l(),
944
+ "aria-labelledby": "submenu",
945
+ className: me.settingsMenu,
946
+ ref: l.setFloating,
947
+ style: i,
948
+ ...s(),
811
949
  children: [
950
+ /* @__PURE__ */ t(Ee.Provider, { value: m, children: /* @__PURE__ */ t(e, {}) }),
812
951
  /* @__PURE__ */ t(
813
- P.Provider,
814
- {
815
- value: { setPage: g, backToMain: i, backToCaptions: o, toggle: y },
816
- children: /* @__PURE__ */ t(e, {})
817
- }
818
- ),
819
- /* @__PURE__ */ t(
820
- xe,
952
+ Le,
821
953
  {
822
954
  ref: n,
823
- context: s,
824
- className: de.arrow
955
+ context: o,
956
+ className: me.arrow
825
957
  }
826
958
  )
827
959
  ]
@@ -829,137 +961,137 @@ function Vn() {
829
961
  ) })
830
962
  ] });
831
963
  }
832
- function Se(e, n = 1e3) {
964
+ function Ae(e, n = 1e3) {
833
965
  return function() {
834
- const i = _("lastKeyboardAction"), [s, c] = T(!1), l = p(() => c(!1), []);
835
- return B(() => {
966
+ const i = p("lastKeyboardAction"), [s, c] = P(!1), r = f(() => c(!1), []);
967
+ return H(() => {
836
968
  c(!!i);
837
- const u = setTimeout(l, n);
838
- return () => clearTimeout(u);
969
+ const l = setTimeout(r, n);
970
+ return () => clearTimeout(l);
839
971
  }, [i, n]), s ? /* @__PURE__ */ t(e, {}) : null;
840
972
  };
841
973
  }
842
- const oe = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), ie = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), He = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Re = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Ve = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), En = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Bn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), An = "_feedback-overlay_v4lbu_1", On = "_feedback-message_v4lbu_14", Fn = "_feedback-icon_v4lbu_30", Zn = "_feedback-icon-animation_v4lbu_1", L = {
974
+ const ae = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), ce = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), Re = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Ve = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), He = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Zn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Kn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Dn = "_feedback-overlay_v4lbu_1", $n = "_feedback-message_v4lbu_14", Un = "_feedback-icon_v4lbu_30", qn = "_feedback-icon-animation_v4lbu_1", w = {
843
975
  "feedback-overlay": "_feedback-overlay_v4lbu_1",
844
- feedbackOverlay: An,
976
+ feedbackOverlay: Dn,
845
977
  "feedback-message": "_feedback-message_v4lbu_14",
846
- feedbackMessage: On,
978
+ feedbackMessage: $n,
847
979
  "feedback-icon": "_feedback-icon_v4lbu_30",
848
- feedbackIcon: Fn,
980
+ feedbackIcon: Un,
849
981
  "feedback-icon-animation": "_feedback-icon-animation_v4lbu_1",
850
- feedbackIconAnimation: Zn
982
+ feedbackIconAnimation: qn
851
983
  };
852
- function $n() {
984
+ function Gn() {
853
985
  var o;
854
- const e = ve();
986
+ const e = ge();
855
987
  switch ((o = e.lastKeyboardAction) == null ? void 0 : o.action) {
856
988
  case "togglePaused":
857
- return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: e.paused ? /* @__PURE__ */ t(oe, {}) : /* @__PURE__ */ t(ie, {}) });
989
+ return /* @__PURE__ */ t("i", { className: w.feedbackIcon, children: e.paused ? /* @__PURE__ */ t(ae, {}) : /* @__PURE__ */ t(ce, {}) });
858
990
  case "toggleCaptions":
859
991
  case "nextCaptionLanguage":
860
992
  case "previousCaptionLanguage":
861
- return e.hasCaptions ? /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(Me, {}) }) : null;
993
+ return e.hasCaptions ? /* @__PURE__ */ t("i", { className: w.feedbackIcon, children: /* @__PURE__ */ t(Ie, {}) }) : null;
862
994
  case "volumeUp":
863
995
  case "volumeDown":
864
996
  case "toggleMuted":
865
- return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: e.muted || e.volume === 0 ? /* @__PURE__ */ t(He, {}) : e.volume >= 0.5 ? /* @__PURE__ */ t(Ve, {}) : /* @__PURE__ */ t(Re, {}) });
997
+ return /* @__PURE__ */ t("i", { className: w.feedbackIcon, children: e.muted || e.volume === 0 ? /* @__PURE__ */ t(Re, {}) : e.volume >= 0.5 ? /* @__PURE__ */ t(He, {}) : /* @__PURE__ */ t(Ve, {}) });
866
998
  case "seekForward":
867
999
  case "seekForward10":
868
- return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(En, { className: "right" }) });
1000
+ return /* @__PURE__ */ t("i", { className: w.feedbackIcon, children: /* @__PURE__ */ t(Zn, { className: "right" }) });
869
1001
  case "seekBackward":
870
1002
  case "seekBackward10":
871
- return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(Bn, { className: "left" }) });
1003
+ return /* @__PURE__ */ t("i", { className: w.feedbackIcon, children: /* @__PURE__ */ t(Kn, { className: "left" }) });
872
1004
  default:
873
1005
  return null;
874
1006
  }
875
1007
  }
876
- function Kn() {
1008
+ function Wn() {
877
1009
  var i;
878
- const { t: e } = C(), n = ve();
1010
+ const { t: e } = C(), n = ge();
879
1011
  switch ((i = n.lastKeyboardAction) == null ? void 0 : i.action) {
880
1012
  case "toggleCaptions":
881
1013
  case "nextCaptionLanguage":
882
1014
  case "previousCaptionLanguage":
883
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: n.textTrack ? e("CAPTION_LANGUAGE", { language: n.textTrack.label }) : `${e("CAPTIONS")}: ${e("OFF")}` });
1015
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: n.textTrack ? e("CAPTION_LANGUAGE", { language: n.textTrack.label }) : `${e("CAPTIONS")}: ${e("OFF")}` });
884
1016
  case "volumeUp":
885
1017
  case "volumeDown":
886
1018
  case "toggleMuted":
887
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: n.muted || n.volume === 0 ? e("MUTED") : e("VOLUME", { volume: (n.volume * 100).toFixed(0) }) });
1019
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: n.muted || n.volume === 0 ? e("MUTED") : e("VOLUME_VALUE", { volume: (n.volume * 100).toFixed(0) }) });
888
1020
  case "increasePlaybackRate":
889
1021
  case "decreasePlaybackRate":
890
1022
  case "resetPlaybackRate":
891
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: e("PLAYBACK_SPEED_MESSAGE", { speed: n.playbackRate }) });
1023
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: e("PLAYBACK_SPEED_MESSAGE", { speed: n.playbackRate }) });
892
1024
  case "seekForward":
893
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 5 }) });
1025
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 5 }) });
894
1026
  case "seekForward10":
895
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 10 }) });
1027
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 10 }) });
896
1028
  case "seekBackward":
897
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 5 }) });
1029
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 5 }) });
898
1030
  case "seekBackward10":
899
- return /* @__PURE__ */ t("div", { className: L.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 10 }) });
1031
+ return /* @__PURE__ */ t("div", { className: w.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 10 }) });
900
1032
  default:
901
1033
  return null;
902
1034
  }
903
1035
  }
904
- const Dn = Se($n, 500), zn = Se(Kn, 1e3);
905
- function Un() {
906
- return /* @__PURE__ */ a("div", { className: L.feedbackOverlay, children: [
907
- /* @__PURE__ */ t(Dn, {}),
908
- /* @__PURE__ */ t(zn, {})
1036
+ const jn = Ae(Gn, 500), Qn = Ae(Wn, 1e3);
1037
+ function Yn() {
1038
+ return /* @__PURE__ */ a("div", { className: w.feedbackOverlay, children: [
1039
+ /* @__PURE__ */ t(jn, {}),
1040
+ /* @__PURE__ */ t(Qn, {})
909
1041
  ] });
910
1042
  }
911
- const jn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), qn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Wn = "_full-screen-button_1xm32_2", Gn = {
1043
+ const Xn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Jn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), eo = "_full-screen-button_1xm32_2", to = {
912
1044
  "full-screen-button": "_full-screen-button_1xm32_2",
913
- fullScreenButton: Wn
1045
+ fullScreenButton: eo
914
1046
  };
915
- function Qn() {
916
- const e = _("fullscreen"), n = A(), o = v(), i = S(), { t: s } = C();
1047
+ function no() {
1048
+ const e = p("fullscreen"), n = B(), o = g(), i = E(), { t: s } = C();
917
1049
  return i.hideFullScreen ? null : /* @__PURE__ */ t(
918
1050
  "button",
919
1051
  {
920
1052
  role: "button",
921
1053
  type: "button",
922
- "aria-label": s(e ? "EXIT_FSCREEN" : "FSCREEN"),
1054
+ "aria-label": s(e ? "EXIT_FULLSCREEN" : "ENTER_FULLSCREEN"),
923
1055
  tabIndex: o.state.interactionsDisabled ? -1 : 0,
924
- className: `controls-button ${Gn.fullScreenButton}`,
1056
+ className: `controls-button ${to.fullScreenButton}`,
925
1057
  onClick: () => {
926
1058
  e ? n == null || n.exitFullscreen() : n == null || n.enterFullscreen();
927
1059
  },
928
- children: e ? /* @__PURE__ */ t(qn, { className: "controls-button-icon" }) : /* @__PURE__ */ t(jn, { className: "controls-button-icon" })
1060
+ children: e ? /* @__PURE__ */ t(Jn, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Xn, { className: "controls-button-icon" })
929
1061
  }
930
1062
  );
931
1063
  }
932
- const Yn = "_gestures-container_1fn3b_1", Xn = "_gesture_1fn3b_1", me = {
1064
+ const oo = "_gestures-container_1fn3b_1", io = "_gesture_1fn3b_1", he = {
933
1065
  "gestures-container": "_gestures-container_1fn3b_1",
934
- gesturesContainer: Yn,
935
- gesture: Xn
1066
+ gesturesContainer: oo,
1067
+ gesture: io
936
1068
  };
937
- function Jn() {
938
- const e = G(), n = () => {
1069
+ function so() {
1070
+ const e = Q(), n = () => {
939
1071
  e.togglePaused();
940
1072
  };
941
- return /* @__PURE__ */ t("div", { className: me.gesturesContainer, children: /* @__PURE__ */ t("div", { "aria-hidden": !0, className: me.gesture, onClick: n }) });
1073
+ return /* @__PURE__ */ t("div", { className: he.gesturesContainer, children: /* @__PURE__ */ t("div", { "aria-hidden": !0, className: he.gesture, onClick: n }) });
942
1074
  }
943
- const eo = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Ee = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), to = "_keyboard-shortcuts-overlay_dr03d_1", no = "_screen-reader-content_dr03d_66", oo = "_keyboard-shortcuts-button_dr03d_80", io = "_close-button_dr03d_106", W = {
1075
+ const ao = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), Be = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("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" }) }), co = "_keyboard-shortcuts-overlay_dr03d_1", ro = "_screen-reader-content_dr03d_66", lo = "_keyboard-shortcuts-button_dr03d_80", uo = "_close-button_dr03d_106", j = {
944
1076
  "keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_dr03d_1",
945
- keyboardShortcutsOverlay: to,
1077
+ keyboardShortcutsOverlay: co,
946
1078
  "screen-reader-content": "_screen-reader-content_dr03d_66",
947
- screenReaderContent: no,
1079
+ screenReaderContent: ro,
948
1080
  "keyboard-shortcuts-button": "_keyboard-shortcuts-button_dr03d_80",
949
- keyboardShortcutsButton: oo,
1081
+ keyboardShortcutsButton: lo,
950
1082
  "close-button": "_close-button_dr03d_106",
951
- closeButton: io
1083
+ closeButton: uo
952
1084
  };
953
- function so({ onClose: e }) {
1085
+ function mo({ onClose: e }) {
954
1086
  const { t: n } = C();
955
- H(e);
1087
+ _n(e);
956
1088
  const o = (i) => {
957
1089
  i && i.focus();
958
1090
  };
959
1091
  return /* @__PURE__ */ a(
960
1092
  "div",
961
1093
  {
962
- className: W.keyboardShortcutsOverlay,
1094
+ className: j.keyboardShortcutsOverlay,
963
1095
  tabIndex: 0,
964
1096
  ref: o,
965
1097
  role: "dialog",
@@ -971,15 +1103,15 @@ function so({ onClose: e }) {
971
1103
  "button",
972
1104
  {
973
1105
  type: "button",
974
- className: W.closeButton,
1106
+ className: j.closeButton,
975
1107
  onClick: e,
976
1108
  "aria-label": n("CLOSE"),
977
- children: /* @__PURE__ */ t(Ee, {})
1109
+ children: /* @__PURE__ */ t(Be, {})
978
1110
  }
979
1111
  )
980
1112
  ] }),
981
1113
  /* @__PURE__ */ a("table", { children: [
982
- /* @__PURE__ */ t("caption", { className: W.screenReaderContent, children: n("KEYBOARD_SHORTCUTS") }),
1114
+ /* @__PURE__ */ t("caption", { className: j.screenReaderContent, children: n("KEYBOARD_SHORTCUTS") }),
983
1115
  /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ a("tr", { children: [
984
1116
  /* @__PURE__ */ t("th", { children: n("ACTION") }),
985
1117
  /* @__PURE__ */ t("th", { children: n("SHORTCUT") })
@@ -1066,40 +1198,40 @@ function so({ onClose: e }) {
1066
1198
  }
1067
1199
  );
1068
1200
  }
1069
- function ao() {
1070
- const [e, n] = T(!1), [o, i] = T(!1), [s, c] = T(!1), l = v(), u = _("playing"), m = G(), { t: h } = C(), g = p(() => {
1071
- n(!0), l.disableInteractions(), u && (c(!0), m.pause());
1072
- }, [u, m, l]), y = p(() => {
1073
- n(!1), i(!0), l.enableInteractions(), s && (c(!1), m.play());
1074
- }, [s, m, l]), k = p(
1201
+ function ho() {
1202
+ const [e, n] = P(!1), [o, i] = P(!1), [s, c] = P(!1), r = g(), l = p("playing"), m = Q(), { t: _ } = C(), v = f(() => {
1203
+ n(!0), r.disableInteractions(), l && (c(!0), m.pause());
1204
+ }, [l, m, r]), x = f(() => {
1205
+ n(!1), i(!0), r.enableInteractions(), s && (c(!1), m.play());
1206
+ }, [s, m, r]), k = f(
1075
1207
  (b) => o && (b == null ? void 0 : b.focus()),
1076
1208
  [o]
1077
1209
  );
1078
- return e ? /* @__PURE__ */ t(so, { onClose: y }) : /* @__PURE__ */ t(
1210
+ return e ? /* @__PURE__ */ t(mo, { onClose: x }) : /* @__PURE__ */ t(
1079
1211
  "button",
1080
1212
  {
1081
1213
  ref: k,
1082
- "aria-label": h("KEYBOARD_SHORTCUTS"),
1214
+ "aria-label": _("KEYBOARD_SHORTCUTS"),
1083
1215
  type: "button",
1084
- className: W.keyboardShortcutsButton,
1085
- onClick: g,
1086
- tabIndex: l.state.interactionsDisabled ? -1 : 0,
1087
- children: /* @__PURE__ */ t(eo, {})
1216
+ className: j.keyboardShortcutsButton,
1217
+ onClick: v,
1218
+ tabIndex: r.state.interactionsDisabled ? -1 : 0,
1219
+ children: /* @__PURE__ */ t(ao, {})
1088
1220
  }
1089
1221
  );
1090
1222
  }
1091
- const co = "_play-pause-button_1834v_1", lo = {
1223
+ const po = "_play-pause-button_1834v_1", _o = {
1092
1224
  "play-pause-button": "_play-pause-button_1834v_1",
1093
- playPauseButton: co
1225
+ playPauseButton: po
1094
1226
  };
1095
- function ro() {
1096
- const e = A(), n = v(), o = _("paused"), { t: i } = C();
1227
+ function fo() {
1228
+ const e = B(), n = g(), o = p("paused"), { t: i } = C();
1097
1229
  return e ? /* @__PURE__ */ t(
1098
1230
  "button",
1099
1231
  {
1100
1232
  role: "button",
1101
1233
  type: "button",
1102
- className: `controls-button ${lo.playPauseButton}`,
1234
+ className: `controls-button ${_o.playPauseButton}`,
1103
1235
  "aria-label": i(o ? "PLAY" : "PAUSE"),
1104
1236
  tabIndex: n.state.interactionsDisabled ? -1 : 0,
1105
1237
  onClick: () => {
@@ -1111,117 +1243,117 @@ function ro() {
1111
1243
  event: s.nativeEvent
1112
1244
  }));
1113
1245
  },
1114
- children: o ? /* @__PURE__ */ t(ie, { className: "controls-button-icon" }) : /* @__PURE__ */ t(oe, { className: "controls-button-icon" })
1246
+ children: o ? /* @__PURE__ */ t(ce, { className: "controls-button-icon" }) : /* @__PURE__ */ t(ae, { className: "controls-button-icon" })
1115
1247
  }
1116
1248
  ) : null;
1117
1249
  }
1118
- const uo = "_poster_195hi_1", mo = {
1119
- poster: uo
1250
+ const Co = "_poster_195hi_1", go = {
1251
+ poster: Co
1120
1252
  };
1121
- function ho({ src: e }) {
1122
- const n = _("source");
1123
- return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ t(Qe, { src: e, className: mo.poster });
1253
+ function vo({ src: e }) {
1254
+ const n = p("source");
1255
+ return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ t(Xe, { src: e, className: go.poster });
1124
1256
  }
1125
- const po = "_small-layout-overlay_1vli4_1", _o = "_small-layout-button_1vli4_14", fo = "_small-layout-icon-play_1vli4_24", Co = "_small-layout-icon-pause_1vli4_30", vo = "_full-screen-close-icon_1vli4_36", go = "_fade-out_1vli4_1", F = {
1257
+ const bo = "_small-layout-overlay_1vli4_1", yo = "_small-layout-button_1vli4_14", wo = "_small-layout-icon-play_1vli4_24", ko = "_small-layout-icon-pause_1vli4_30", xo = "_full-screen-close-icon_1vli4_36", Lo = "_fade-out_1vli4_1", Z = {
1126
1258
  "small-layout-overlay": "_small-layout-overlay_1vli4_1",
1127
- smallLayoutOverlay: po,
1259
+ smallLayoutOverlay: bo,
1128
1260
  "small-layout-button": "_small-layout-button_1vli4_14",
1129
- smallLayoutButton: _o,
1261
+ smallLayoutButton: yo,
1130
1262
  "small-layout-icon-play": "_small-layout-icon-play_1vli4_24",
1131
- smallLayoutIconPlay: fo,
1263
+ smallLayoutIconPlay: wo,
1132
1264
  "small-layout-icon-pause": "_small-layout-icon-pause_1vli4_30",
1133
- smallLayoutIconPause: Co,
1265
+ smallLayoutIconPause: ko,
1134
1266
  "full-screen-close-icon": "_full-screen-close-icon_1vli4_36",
1135
- fullScreenCloseIcon: vo,
1267
+ fullScreenCloseIcon: xo,
1136
1268
  "fade-out": "_fade-out_1vli4_1",
1137
- fadeOut: go
1269
+ fadeOut: Lo
1138
1270
  };
1139
- function bo() {
1140
- return /* @__PURE__ */ a("div", { className: F.smallLayoutOverlay, children: [
1141
- /* @__PURE__ */ t(Ye, { className: F.fullScreenCloseIcon, children: /* @__PURE__ */ t(Ee, {}) }),
1142
- /* @__PURE__ */ a("i", { className: F.smallLayoutButton, children: [
1143
- /* @__PURE__ */ t(ie, { className: F.smallLayoutIconPlay }),
1144
- /* @__PURE__ */ t(oe, { className: F.smallLayoutIconPause })
1271
+ function No() {
1272
+ return /* @__PURE__ */ a("div", { className: Z.smallLayoutOverlay, children: [
1273
+ /* @__PURE__ */ t(Je, { className: Z.fullScreenCloseIcon, children: /* @__PURE__ */ t(Be, {}) }),
1274
+ /* @__PURE__ */ a("i", { className: Z.smallLayoutButton, children: [
1275
+ /* @__PURE__ */ t(ce, { className: Z.smallLayoutIconPlay }),
1276
+ /* @__PURE__ */ t(ae, { className: Z.smallLayoutIconPause })
1145
1277
  ] })
1146
1278
  ] });
1147
1279
  }
1148
- const wo = "_time-indicator_1rlpb_1", ko = {
1280
+ const Po = "_time-indicator_1rlpb_1", Mo = {
1149
1281
  "time-indicator": "_time-indicator_1rlpb_1",
1150
- timeIndicator: wo
1282
+ timeIndicator: Po
1151
1283
  };
1152
- function yo() {
1153
- return /* @__PURE__ */ a("div", { className: ko.timeIndicator, children: [
1154
- /* @__PURE__ */ t(re, { type: "current" }),
1284
+ function Io() {
1285
+ return /* @__PURE__ */ a("div", { className: Mo.timeIndicator, children: [
1286
+ /* @__PURE__ */ t(ue, { type: "current" }),
1155
1287
  "/",
1156
- /* @__PURE__ */ t(re, { type: "duration" })
1288
+ /* @__PURE__ */ t(ue, { type: "duration" })
1157
1289
  ] });
1158
1290
  }
1159
- const Lo = "_comment-markers_49pse_1", xo = "_comment-marker_49pse_1", Po = "_timeline-wrapper_49pse_21", No = "_track_49pse_35", To = "_thumb_49pse_48", Mo = "_root_49pse_62", Io = "_track-inner_49pse_92", So = "_progress_49pse_98", Ho = "_track-fill_49pse_104", Ro = "_pins_49pse_121", Vo = "_pin-button_49pse_134", Eo = "_annotation-pin_49pse_154", Bo = "_quiz-pin_49pse_159", Ao = "_annotation-pin-child_49pse_164", Oo = "_quiz-pin-child_49pse_168", Fo = "_interactive-pin-container_49pse_173", Zo = "_interactive-pin-wrapper_49pse_183", $o = "_interactive-pin-icon_49pse_189", Ko = "_interactive-pin_49pse_173", Do = "_bg_49pse_203", zo = "_symbol_49pse_207", Uo = "_interactive-pin-button_49pse_212", jo = "_interactive-pin-menu_49pse_232", qo = "_interactive-pin-menu-item_49pse_246", Wo = "_arrow_49pse_267", d = {
1291
+ const So = "_comment-markers_49pse_1", To = "_comment-marker_49pse_1", Eo = "_timeline-wrapper_49pse_21", Ao = "_track_49pse_35", Ro = "_thumb_49pse_48", Vo = "_root_49pse_62", Ho = "_track-inner_49pse_92", Bo = "_progress_49pse_98", Oo = "_track-fill_49pse_104", Fo = "_pins_49pse_121", zo = "_pin-button_49pse_134", Zo = "_annotation-pin_49pse_154", Ko = "_quiz-pin_49pse_159", Do = "_annotation-pin-child_49pse_164", $o = "_quiz-pin-child_49pse_168", Uo = "_interactive-pin-container_49pse_173", qo = "_interactive-pin-wrapper_49pse_183", Go = "_interactive-pin-icon_49pse_189", Wo = "_interactive-pin_49pse_173", jo = "_bg_49pse_203", Qo = "_symbol_49pse_207", Yo = "_interactive-pin-button_49pse_212", Xo = "_interactive-pin-menu_49pse_232", Jo = "_interactive-pin-menu-item_49pse_246", ei = "_arrow_49pse_267", u = {
1160
1292
  "comment-markers": "_comment-markers_49pse_1",
1161
- commentMarkers: Lo,
1293
+ commentMarkers: So,
1162
1294
  "comment-marker": "_comment-marker_49pse_1",
1163
- commentMarker: xo,
1295
+ commentMarker: To,
1164
1296
  "timeline-wrapper": "_timeline-wrapper_49pse_21",
1165
- timelineWrapper: Po,
1166
- track: No,
1167
- thumb: To,
1168
- root: Mo,
1297
+ timelineWrapper: Eo,
1298
+ track: Ao,
1299
+ thumb: Ro,
1300
+ root: Vo,
1169
1301
  "track-inner": "_track-inner_49pse_92",
1170
- trackInner: Io,
1171
- progress: So,
1302
+ trackInner: Ho,
1303
+ progress: Bo,
1172
1304
  "track-fill": "_track-fill_49pse_104",
1173
- trackFill: Ho,
1174
- pins: Ro,
1305
+ trackFill: Oo,
1306
+ pins: Fo,
1175
1307
  "pin-button": "_pin-button_49pse_134",
1176
- pinButton: Vo,
1308
+ pinButton: zo,
1177
1309
  "annotation-pin": "_annotation-pin_49pse_154",
1178
- annotationPin: Eo,
1310
+ annotationPin: Zo,
1179
1311
  "quiz-pin": "_quiz-pin_49pse_159",
1180
- quizPin: Bo,
1312
+ quizPin: Ko,
1181
1313
  "annotation-pin-child": "_annotation-pin-child_49pse_164",
1182
- annotationPinChild: Ao,
1314
+ annotationPinChild: Do,
1183
1315
  "quiz-pin-child": "_quiz-pin-child_49pse_168",
1184
- quizPinChild: Oo,
1316
+ quizPinChild: $o,
1185
1317
  "interactive-pin-container": "_interactive-pin-container_49pse_173",
1186
- interactivePinContainer: Fo,
1318
+ interactivePinContainer: Uo,
1187
1319
  "interactive-pin-wrapper": "_interactive-pin-wrapper_49pse_183",
1188
- interactivePinWrapper: Zo,
1320
+ interactivePinWrapper: qo,
1189
1321
  "interactive-pin-icon": "_interactive-pin-icon_49pse_189",
1190
- interactivePinIcon: $o,
1322
+ interactivePinIcon: Go,
1191
1323
  "interactive-pin": "_interactive-pin_49pse_173",
1192
- interactivePin: Ko,
1193
- bg: Do,
1194
- symbol: zo,
1324
+ interactivePin: Wo,
1325
+ bg: jo,
1326
+ symbol: Qo,
1195
1327
  "interactive-pin-button": "_interactive-pin-button_49pse_212",
1196
- interactivePinButton: Uo,
1328
+ interactivePinButton: Yo,
1197
1329
  "interactive-pin-menu": "_interactive-pin-menu_49pse_232",
1198
- interactivePinMenu: jo,
1330
+ interactivePinMenu: Xo,
1199
1331
  "interactive-pin-menu-item": "_interactive-pin-menu-item_49pse_246",
1200
- interactivePinMenuItem: qo,
1201
- arrow: Wo
1202
- }, Go = {
1203
- annotation: d.annotationPin,
1204
- quiz: d.quizPin
1332
+ interactivePinMenuItem: Jo,
1333
+ arrow: ei
1334
+ }, ti = {
1335
+ annotation: u.annotationPin,
1336
+ quiz: u.quizPin
1205
1337
  };
1206
- function Be({
1338
+ function Oe({
1207
1339
  type: e,
1208
1340
  position: n,
1209
1341
  children: o,
1210
1342
  onClick: i
1211
1343
  }) {
1212
- const s = v();
1344
+ const s = g();
1213
1345
  return /* @__PURE__ */ t(
1214
1346
  "button",
1215
1347
  {
1216
1348
  type: "button",
1217
1349
  tabIndex: s.state.interactionsDisabled ? -1 : 0,
1218
- className: d.pinButton,
1350
+ className: u.pinButton,
1219
1351
  style: { left: `${n}%` },
1220
1352
  onClick: i,
1221
1353
  children: /* @__PURE__ */ a(
1222
1354
  "svg",
1223
1355
  {
1224
- className: Go[e],
1356
+ className: ti[e],
1225
1357
  width: "26",
1226
1358
  height: "32",
1227
1359
  viewBox: "0 0 26 32",
@@ -1235,11 +1367,11 @@ function Be({
1235
1367
  }
1236
1368
  );
1237
1369
  }
1238
- function Qo(e) {
1239
- return /* @__PURE__ */ t(Be, { type: "annotation", ...e, children: /* @__PURE__ */ t(
1370
+ function ni(e) {
1371
+ return /* @__PURE__ */ t(Oe, { type: "annotation", ...e, children: /* @__PURE__ */ t(
1240
1372
  "path",
1241
1373
  {
1242
- className: d.annotationPinChild,
1374
+ className: u.annotationPinChild,
1243
1375
  fillRule: "evenodd",
1244
1376
  clipRule: "evenodd",
1245
1377
  d: "M7 8V19.25H8.875V18.875C8.875 17.8415 9.7165 17 10.75 17H19V8H7ZM10 11.75H16V11H10V11.75ZM14.5 14H10V13.25H14.5V14Z",
@@ -1248,11 +1380,11 @@ function Qo(e) {
1248
1380
  }
1249
1381
  ) });
1250
1382
  }
1251
- function Yo(e) {
1252
- return /* @__PURE__ */ t(Be, { type: "quiz", ...e, children: e.multiple ? /* @__PURE__ */ t("circle", { className: d.quizPinChild, cx: "13", cy: "13", r: "6" }) : /* @__PURE__ */ t(
1383
+ function oi(e) {
1384
+ return /* @__PURE__ */ t(Oe, { type: "quiz", ...e, children: e.multiple ? /* @__PURE__ */ t("circle", { className: u.quizPinChild, cx: "13", cy: "13", r: "6" }) : /* @__PURE__ */ t(
1253
1385
  "text",
1254
1386
  {
1255
- className: d.quizPinChild,
1387
+ className: u.quizPinChild,
1256
1388
  x: "50%",
1257
1389
  y: "56%",
1258
1390
  textAnchor: "middle",
@@ -1262,7 +1394,7 @@ function Yo(e) {
1262
1394
  }
1263
1395
  ) });
1264
1396
  }
1265
- function Xo(e, n) {
1397
+ function ii(e, n) {
1266
1398
  return e.map((o, i) => ({
1267
1399
  id: o.id,
1268
1400
  time: o.time,
@@ -1271,19 +1403,19 @@ function Xo(e, n) {
1271
1403
  onClick: () => n(o)
1272
1404
  }));
1273
1405
  }
1274
- function Jo(e, n) {
1406
+ function si(e, n) {
1275
1407
  const o = /* @__PURE__ */ new Map();
1276
1408
  e.forEach((c) => {
1277
- var u;
1278
- const l = c.time;
1279
- o.has(l) || o.set(l, []), (u = o.get(l)) == null || u.push(c);
1409
+ var l;
1410
+ const r = c.time;
1411
+ o.has(r) || o.set(r, []), (l = o.get(r)) == null || l.push(c);
1280
1412
  });
1281
1413
  const i = [];
1282
1414
  let s = 1;
1283
- return o.forEach((c, l) => {
1415
+ return o.forEach((c, r) => {
1284
1416
  i.push({
1285
- id: c.map((u) => u.id).join("-"),
1286
- time: l,
1417
+ id: c.map((l) => l.id).join("-"),
1418
+ time: r,
1287
1419
  type: "quiz",
1288
1420
  ordinal: s + 1,
1289
1421
  onClick: () => n(c),
@@ -1291,12 +1423,12 @@ function Jo(e, n) {
1291
1423
  }), s++;
1292
1424
  }), i;
1293
1425
  }
1294
- function ei(e, n, o, i) {
1426
+ function ai(e, n, o, i) {
1295
1427
  switch (e.type) {
1296
1428
  case "annotation": {
1297
1429
  const s = () => i ? e.onClick() : o.seek(e.time);
1298
1430
  return /* @__PURE__ */ t(
1299
- Qo,
1431
+ ni,
1300
1432
  {
1301
1433
  position: e.time / n * 100,
1302
1434
  onClick: s
@@ -1306,7 +1438,7 @@ function ei(e, n, o, i) {
1306
1438
  }
1307
1439
  case "quiz":
1308
1440
  return /* @__PURE__ */ t(
1309
- Yo,
1441
+ oi,
1310
1442
  {
1311
1443
  position: e.time / n * 100,
1312
1444
  ordinal: e.ordinal,
@@ -1319,27 +1451,27 @@ function ei(e, n, o, i) {
1319
1451
  return null;
1320
1452
  }
1321
1453
  }
1322
- function ti() {
1323
- const e = G(), n = _("duration"), o = S(), i = $(() => [
1324
- ...Xo(
1454
+ function ci() {
1455
+ const e = Q(), n = p("duration"), o = E(), i = I(() => [
1456
+ ...ii(
1325
1457
  o.annotations,
1326
1458
  o.onAnnotationClick
1327
1459
  ),
1328
- ...Jo(o.quizMarkers, o.onQuizMarkerClick)
1329
- ].sort((c, l) => c.time - l.time).map((c) => ei(c, n, e, o.interactive)), [o.annotations, o.quizMarkers, n, e]);
1330
- return /* @__PURE__ */ t("div", { className: d.pins, children: i });
1460
+ ...si(o.quizMarkers, o.onQuizMarkerClick)
1461
+ ].sort((c, r) => c.time - r.time).map((c) => ai(c, n, e, o.interactive)), [o.annotations, o.quizMarkers, n, e]);
1462
+ return /* @__PURE__ */ t("div", { className: u.pins, children: i });
1331
1463
  }
1332
- function ni() {
1333
- const e = _("duration"), n = S(), o = v();
1334
- return n.hasComments && o.state.commentsEnabled ? /* @__PURE__ */ t("div", { className: d.commentMarkers, children: n.comments.map((i) => {
1464
+ function ri() {
1465
+ const e = p("duration"), n = E(), o = g();
1466
+ return n.hasComments && o.state.commentsEnabled ? /* @__PURE__ */ t("div", { className: u.commentMarkers, children: n.comments.map((i) => {
1335
1467
  const s = Math.min(
1336
1468
  Math.abs(e - i.timestamp),
1337
- Ie
1469
+ Se
1338
1470
  );
1339
1471
  return /* @__PURE__ */ t(
1340
1472
  "span",
1341
1473
  {
1342
- className: d.commentMarker,
1474
+ className: u.commentMarker,
1343
1475
  style: {
1344
1476
  left: `${i.timestamp / e * 100}%`,
1345
1477
  width: `${s / e * 100}%`
@@ -1349,39 +1481,39 @@ function ni() {
1349
1481
  );
1350
1482
  }) }) : null;
1351
1483
  }
1352
- function oi({ currentTime: e, position: n }) {
1353
- const [o, i] = T(!1), s = S(), c = p(() => s.interactiveMenuElements.length > 0 ? i((b) => !b) : s.onInteractivePinClick(e), [
1484
+ function li({ currentTime: e, position: n }) {
1485
+ const [o, i] = P(!1), s = E(), c = f(() => s.interactiveMenuElements.length > 0 ? i((b) => !b) : s.onInteractivePinClick(e), [
1354
1486
  s.interactiveMenuElements,
1355
1487
  s.onInteractivePinClick,
1356
1488
  e
1357
- ]), l = Ce(null), { refs: u, floatingStyles: m, context: h } = ge({
1489
+ ]), r = ie(null), { refs: l, floatingStyles: m, context: _ } = ve({
1358
1490
  open: o,
1359
1491
  onOpenChange: i,
1360
1492
  whileElementsMounted: be,
1361
1493
  placement: "top",
1362
1494
  middleware: [
1363
- it(),
1364
- st(6),
1365
- we(),
1366
- ke({
1367
- element: l
1495
+ at(),
1496
+ ct(6),
1497
+ ye(),
1498
+ we({
1499
+ element: r
1368
1500
  })
1369
1501
  ]
1370
- }), g = ye(h), { getReferenceProps: y, getFloatingProps: k } = Le([g]);
1371
- return /* @__PURE__ */ a(ee, { children: [
1502
+ }), v = ke(_), { getReferenceProps: x, getFloatingProps: k } = xe([v]);
1503
+ return /* @__PURE__ */ a(te, { children: [
1372
1504
  /* @__PURE__ */ t(
1373
1505
  "button",
1374
1506
  {
1375
1507
  type: "button",
1376
1508
  onClick: c,
1377
- className: d.interactivePinButton,
1378
- ref: u.setReference,
1509
+ className: u.interactivePinButton,
1510
+ ref: l.setReference,
1379
1511
  style: { left: `${n}%` },
1380
- ...y(),
1512
+ ...x(),
1381
1513
  children: /* @__PURE__ */ a(
1382
1514
  "svg",
1383
1515
  {
1384
- className: d.interactivePin,
1516
+ className: u.interactivePin,
1385
1517
  width: "36",
1386
1518
  height: "44",
1387
1519
  fill: "none",
@@ -1391,21 +1523,21 @@ function oi({ currentTime: e, position: n }) {
1391
1523
  /* @__PURE__ */ t(
1392
1524
  "path",
1393
1525
  {
1394
- className: d.bg,
1526
+ className: u.bg,
1395
1527
  d: "M 33.1703,27.499961 C 34.9615,24.721661 36,21.418761 36,17.874961 36,8.0028612 27.9411,-3.8819277e-5 18,-3.8819277e-5 8.0588999,-3.8819277e-5 -1.5e-7,8.0028612 -1.5e-7,17.874961 c 0,3.5438 1.03844995,6.8467 2.82964995,9.625 4.5447501,6.8094 10.1600502,10.1014 15.2487502,16.5 5.0364,-6.3985 10.5573,-9.7259 15.0919,-16.5 z"
1396
1528
  }
1397
1529
  ),
1398
1530
  /* @__PURE__ */ t(
1399
1531
  "path",
1400
1532
  {
1401
- className: d.symbol,
1533
+ className: u.symbol,
1402
1534
  d: "m 35.499961,17.877772 c 0,3.443549 -1.008198,6.652061 -2.747494,9.351891 -2.235095,3.338633 -4.71529,5.832631 -7.286584,8.306425 -0.277599,0.267143 -0.556499,0.534085 -0.836198,0.801928 -2.174595,2.082232 -4.40389,4.216673 -6.553385,6.870196 -2.158995,-2.636621 -4.40379,-4.754859 -6.591985,-6.819788 -0.2979,-0.281145 -0.594699,-0.561289 -0.890198,-0.841534 C 7.9918219,33.077896 5.4869279,30.584698 3.2477829,27.230063 1.5082968,24.530133 0.50003905,21.321521 0.50003905,17.877772 0.50003905,8.2835422 8.3317219,0.50000048 18,0.50000048 c 9.668278,0 17.499961,7.78354172 17.499961,17.37777152 z"
1403
1535
  }
1404
1536
  ),
1405
1537
  /* @__PURE__ */ t(
1406
1538
  "path",
1407
1539
  {
1408
- className: d.interactivePinIcon,
1540
+ className: u.interactivePinIcon,
1409
1541
  "data-open": o,
1410
1542
  fillRule: "evenodd",
1411
1543
  clipRule: "evenodd",
@@ -1421,18 +1553,18 @@ function oi({ currentTime: e, position: n }) {
1421
1553
  o && /* @__PURE__ */ a(
1422
1554
  "div",
1423
1555
  {
1424
- ref: u.setFloating,
1556
+ ref: l.setFloating,
1425
1557
  style: m,
1426
- className: d.interactivePinMenu,
1558
+ className: u.interactivePinMenu,
1427
1559
  ...k(),
1428
1560
  children: [
1429
- s.interactiveMenuElements.map(({ id: b, text: f, onClick: w }) => /* @__PURE__ */ a(
1561
+ s.interactiveMenuElements.map(({ id: b, text: S, onClick: h }) => /* @__PURE__ */ a(
1430
1562
  "button",
1431
1563
  {
1432
1564
  type: "button",
1433
- className: d.interactivePinMenuItem,
1565
+ className: u.interactivePinMenuItem,
1434
1566
  onClick: () => {
1435
- w(b, e), i(!1);
1567
+ h(b, e), i(!1);
1436
1568
  },
1437
1569
  children: [
1438
1570
  /* @__PURE__ */ t(
@@ -1454,17 +1586,17 @@ function oi({ currentTime: e, position: n }) {
1454
1586
  )
1455
1587
  }
1456
1588
  ),
1457
- f
1589
+ S
1458
1590
  ]
1459
1591
  },
1460
1592
  b
1461
1593
  )),
1462
1594
  /* @__PURE__ */ t(
1463
- xe,
1595
+ Le,
1464
1596
  {
1465
- ref: l,
1466
- context: h,
1467
- className: d.arrow
1597
+ ref: r,
1598
+ context: _,
1599
+ className: u.arrow
1468
1600
  }
1469
1601
  )
1470
1602
  ]
@@ -1472,48 +1604,48 @@ function oi({ currentTime: e, position: n }) {
1472
1604
  )
1473
1605
  ] });
1474
1606
  }
1475
- function ii() {
1476
- const e = _("duration"), n = _("currentTime"), o = n / e * 100;
1477
- return /* @__PURE__ */ t("div", { className: d.interactivePinContainer, children: /* @__PURE__ */ t("div", { className: d.interactivePinWrapper, children: /* @__PURE__ */ t(oi, { currentTime: n, position: o }) }) });
1607
+ function ui() {
1608
+ const e = p("duration"), n = p("currentTime"), o = n / e * 100;
1609
+ return /* @__PURE__ */ t("div", { className: u.interactivePinContainer, children: /* @__PURE__ */ t("div", { className: u.interactivePinWrapper, children: /* @__PURE__ */ t(li, { currentTime: n, position: o }) }) });
1478
1610
  }
1479
- function si() {
1480
- const e = _("paused"), n = v();
1481
- return e && !n.state.interactionsDisabled ? /* @__PURE__ */ t(ii, {}) : null;
1611
+ function di() {
1612
+ const e = p("paused"), n = g();
1613
+ return e && !n.state.interactionsDisabled ? /* @__PURE__ */ t(ui, {}) : null;
1482
1614
  }
1483
- const ai = `${d.progress} ${d.trackInner}`, ci = `${d.trackFill} ${d.trackInner}`;
1484
- function he({ className: e }) {
1485
- const n = v(), { hasAnnotations: o, hasQuizmarkers: i, interactive: s } = S(), c = e ? `${d.timelineWrapper} ${e}` : d.timelineWrapper;
1615
+ const mi = `${u.progress} ${u.trackInner}`, hi = `${u.trackFill} ${u.trackInner}`;
1616
+ function pe({ className: e }) {
1617
+ const n = g(), { hasAnnotations: o, hasQuizmarkers: i, interactive: s } = E(), c = e ? `${u.timelineWrapper} ${e}` : u.timelineWrapper;
1486
1618
  return /* @__PURE__ */ a("div", { className: c, children: [
1487
- s ? /* @__PURE__ */ t(si, {}) : null,
1488
- s || o || i ? /* @__PURE__ */ t(ti, {}) : null,
1619
+ s ? /* @__PURE__ */ t(di, {}) : null,
1620
+ s || o || i ? /* @__PURE__ */ t(ci, {}) : null,
1489
1621
  /* @__PURE__ */ a(
1490
- O.Root,
1622
+ z.Root,
1491
1623
  {
1492
- className: d.root,
1624
+ className: u.root,
1493
1625
  tabIndex: n.state.interactionsDisabled ? -1 : 0,
1494
1626
  children: [
1495
- /* @__PURE__ */ a(O.Track, { className: d.track, children: [
1496
- /* @__PURE__ */ t(O.Progress, { className: ai }),
1497
- /* @__PURE__ */ t(O.TrackFill, { className: ci })
1627
+ /* @__PURE__ */ a(z.Track, { className: u.track, children: [
1628
+ /* @__PURE__ */ t(z.Progress, { className: mi }),
1629
+ /* @__PURE__ */ t(z.TrackFill, { className: hi })
1498
1630
  ] }),
1499
- /* @__PURE__ */ t(O.Thumb, { className: d.thumb })
1631
+ /* @__PURE__ */ t(z.Thumb, { className: u.thumb })
1500
1632
  ]
1501
1633
  }
1502
1634
  ),
1503
- /* @__PURE__ */ t(ni, {})
1635
+ /* @__PURE__ */ t(ri, {})
1504
1636
  ] });
1505
1637
  }
1506
- const li = "_wrapper_12cb0_1", ri = "_track_12cb0_6", ui = "_thumb_12cb0_18", di = "_track-fill_12cb0_32", mi = "_root_12cb0_51", Z = {
1507
- wrapper: li,
1508
- track: ri,
1509
- thumb: ui,
1638
+ const pi = "_wrapper_12cb0_1", _i = "_track_12cb0_6", fi = "_thumb_12cb0_18", Ci = "_track-fill_12cb0_32", gi = "_root_12cb0_51", K = {
1639
+ wrapper: pi,
1640
+ track: _i,
1641
+ thumb: fi,
1510
1642
  "track-fill": "_track-fill_12cb0_32",
1511
- trackFill: di,
1512
- root: mi
1643
+ trackFill: Ci,
1644
+ root: gi
1513
1645
  };
1514
- function hi() {
1515
- const e = A(), n = _("volume"), o = _("muted"), i = v(), s = o || n === 0, { t: c } = C();
1516
- return /* @__PURE__ */ a("div", { className: Z.wrapper, children: [
1646
+ function vi() {
1647
+ const e = B(), n = p("volume"), o = p("muted"), i = g(), s = o || n === 0, { t: c } = C();
1648
+ return /* @__PURE__ */ a("div", { className: K.wrapper, children: [
1517
1649
  /* @__PURE__ */ t(
1518
1650
  "button",
1519
1651
  {
@@ -1525,23 +1657,23 @@ function hi() {
1525
1657
  onClick: () => {
1526
1658
  s ? e == null || e.remoteControl.unmute() : e == null || e.remoteControl.mute();
1527
1659
  },
1528
- children: s ? /* @__PURE__ */ t(He, { className: "controls-button-icon" }) : n < 0.5 ? /* @__PURE__ */ t(Re, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Ve, { className: "controls-button-icon" })
1660
+ children: s ? /* @__PURE__ */ t(Re, { className: "controls-button-icon" }) : n < 0.5 ? /* @__PURE__ */ t(Ve, { className: "controls-button-icon" }) : /* @__PURE__ */ t(He, { className: "controls-button-icon" })
1529
1661
  }
1530
1662
  ),
1531
1663
  /* @__PURE__ */ a(
1532
- U.Root,
1664
+ q.Root,
1533
1665
  {
1534
- className: Z.root,
1666
+ className: K.root,
1535
1667
  tabIndex: i.state.interactionsDisabled ? -1 : 0,
1536
1668
  children: [
1537
- /* @__PURE__ */ t(U.Track, { className: Z.track, children: /* @__PURE__ */ t(U.TrackFill, { className: Z.trackFill }) }),
1538
- /* @__PURE__ */ t(U.Thumb, { className: Z.thumb })
1669
+ /* @__PURE__ */ t(q.Track, { className: K.track, children: /* @__PURE__ */ t(q.TrackFill, { className: K.trackFill }) }),
1670
+ /* @__PURE__ */ t(q.Thumb, { className: K.thumb })
1539
1671
  ]
1540
1672
  }
1541
1673
  )
1542
1674
  ] });
1543
1675
  }
1544
- const pe = {
1676
+ const _e = {
1545
1677
  togglePaused: ["Space", "Enter", "k"],
1546
1678
  seekForward: ["ArrowRight"],
1547
1679
  seekBackward: ["ArrowLeft"],
@@ -1579,8 +1711,8 @@ const pe = {
1579
1711
  decreasePlaybackRate: {
1580
1712
  keys: ["a"],
1581
1713
  onKeyUp({ event: e, player: n, remote: o }) {
1582
- const s = V.indexOf(n.playbackRate) - 1;
1583
- s >= 0 && (o.changePlaybackRate(V[s]), n.$state.lastKeyboardAction.set({
1714
+ const s = R.indexOf(n.playbackRate) - 1;
1715
+ s >= 0 && (o.changePlaybackRate(R[s]), n.$state.lastKeyboardAction.set({
1584
1716
  action: "decreasePlaybackRate",
1585
1717
  event: e
1586
1718
  }));
@@ -1589,8 +1721,8 @@ const pe = {
1589
1721
  increasePlaybackRate: {
1590
1722
  keys: ["d"],
1591
1723
  onKeyUp({ event: e, player: n, remote: o }) {
1592
- const s = V.indexOf(n.playbackRate) + 1;
1593
- s < V.length && (o.changePlaybackRate(V[s]), n.$state.lastKeyboardAction.set({
1724
+ const s = R.indexOf(n.playbackRate) + 1;
1725
+ s < R.length && (o.changePlaybackRate(R[s]), n.$state.lastKeyboardAction.set({
1594
1726
  action: "increasePlaybackRate",
1595
1727
  event: e
1596
1728
  }));
@@ -1624,10 +1756,10 @@ const pe = {
1624
1756
  }
1625
1757
  }
1626
1758
  };
1627
- function _e(e) {
1759
+ function fe(e) {
1628
1760
  return typeof e == "number" && !isNaN(e);
1629
1761
  }
1630
- function pi(e, n = 1e3) {
1762
+ function bi(e, n = 1e3) {
1631
1763
  let o = !1;
1632
1764
  return () => {
1633
1765
  o || (e(), o = !0, setTimeout(() => {
@@ -1635,7 +1767,7 @@ function pi(e, n = 1e3) {
1635
1767
  }, n));
1636
1768
  };
1637
1769
  }
1638
- const fe = {
1770
+ const Ce = {
1639
1771
  volume: 1,
1640
1772
  muted: !1,
1641
1773
  lang: null,
@@ -1646,11 +1778,11 @@ const fe = {
1646
1778
  invert: !1,
1647
1779
  comments: !1
1648
1780
  };
1649
- class _i {
1781
+ class yi {
1650
1782
  constructor() {
1651
1783
  N(this, "playerId", "studio-player");
1652
1784
  N(this, "mediaId", null);
1653
- N(this, "data", fe);
1785
+ N(this, "data", Ce);
1654
1786
  N(this, "time", null);
1655
1787
  N(this, "overrideTime", null);
1656
1788
  N(this, "saveTime", () => {
@@ -1658,11 +1790,11 @@ class _i {
1658
1790
  const n = (this.time ?? 0).toString();
1659
1791
  localStorage.setItem(this.mediaId, n);
1660
1792
  });
1661
- N(this, "saveTimeThrottled", pi(this.saveTime, 1e3));
1793
+ N(this, "saveTimeThrottled", bi(this.saveTime, 1e3));
1662
1794
  // only used for useStudioPlayer hook's state initialization
1663
1795
  N(this, "initializeState", (n) => {
1664
1796
  const o = localStorage.getItem(this.playerId);
1665
- if (_e(n) && n >= 0 && (this.overrideTime = n), o)
1797
+ if (fe(n) && n >= 0 && (this.overrideTime = n), o)
1666
1798
  try {
1667
1799
  this.data = JSON.parse(o);
1668
1800
  } catch {
@@ -1673,6 +1805,7 @@ class _i {
1673
1805
  captionsInvertColors: this.data.invert,
1674
1806
  commentsEnabled: this.data.comments,
1675
1807
  interactionsDisabled: !1,
1808
+ globalKeysDisabled: !1,
1676
1809
  disableCaptionSettings: !1
1677
1810
  };
1678
1811
  });
@@ -1729,16 +1862,16 @@ class _i {
1729
1862
  onChange(n, o, i = "studio-player") {
1730
1863
  const s = i ? localStorage.getItem(i) : null, c = o ? localStorage.getItem(o) : null;
1731
1864
  this.playerId = i, this.mediaId = o;
1732
- let l = {};
1865
+ let r = {};
1733
1866
  if (s)
1734
1867
  try {
1735
- l = JSON.parse(s);
1868
+ r = JSON.parse(s);
1736
1869
  } catch {
1737
1870
  }
1738
1871
  this.data = {
1739
- ...fe,
1740
- ...l
1741
- }, _e(this.overrideTime) && this.overrideTime >= 0 ? this.time = this.overrideTime : this.time = c ? +c : null;
1872
+ ...Ce,
1873
+ ...r
1874
+ }, fe(this.overrideTime) && this.overrideTime >= 0 ? this.time = this.overrideTime : this.time = c ? +c : null;
1742
1875
  }
1743
1876
  save() {
1744
1877
  if (!this.playerId) return;
@@ -1746,157 +1879,163 @@ class _i {
1746
1879
  localStorage.setItem(this.playerId, n);
1747
1880
  }
1748
1881
  }
1749
- function fi(e, n, o, i) {
1750
- const s = $(() => new _i(), []), [c, l] = T(
1882
+ function wi(e, n, o, i) {
1883
+ const s = I(() => new yi(), []), [c, r] = P(
1751
1884
  s.initializeState(i)
1752
- ), u = p(
1753
- (f) => {
1754
- l((w) => (s.saveData("multiplier", f), {
1755
- ...w,
1756
- captionsFontSizeMultiplier: f
1885
+ ), l = f(
1886
+ (h) => {
1887
+ r((y) => (s.saveData("multiplier", h), {
1888
+ ...y,
1889
+ captionsFontSizeMultiplier: h
1757
1890
  }));
1758
1891
  },
1759
1892
  [s]
1760
- ), m = p(() => {
1761
- l((f) => {
1762
- const w = !f.captionPositionOnTop;
1763
- return s.saveData("ontop", w), {
1764
- ...f,
1765
- captionPositionOnTop: w
1893
+ ), m = f(() => {
1894
+ r((h) => {
1895
+ const y = !h.captionPositionOnTop;
1896
+ return s.saveData("ontop", y), {
1897
+ ...h,
1898
+ captionPositionOnTop: y
1766
1899
  };
1767
1900
  });
1768
- }, [s]), h = p(() => {
1769
- l((f) => {
1770
- const w = !f.captionsInvertColors;
1771
- return s.saveData("invert", w), {
1772
- ...f,
1773
- captionsInvertColors: w
1901
+ }, [s]), _ = f(() => {
1902
+ r((h) => {
1903
+ const y = !h.captionsInvertColors;
1904
+ return s.saveData("invert", y), {
1905
+ ...h,
1906
+ captionsInvertColors: y
1774
1907
  };
1775
1908
  });
1776
- }, [s]), g = p(() => {
1777
- l((f) => {
1778
- const w = !f.commentsEnabled;
1779
- return s.saveData("comments", w), {
1780
- ...f,
1781
- commentsEnabled: w
1909
+ }, [s]), v = f(() => {
1910
+ r((h) => {
1911
+ const y = !h.commentsEnabled;
1912
+ return s.saveData("comments", y), {
1913
+ ...h,
1914
+ commentsEnabled: y
1782
1915
  };
1783
1916
  });
1784
- }, [s]), y = p(() => {
1785
- l((f) => ({
1786
- ...f,
1917
+ }, [s]), x = f(() => {
1918
+ r((h) => ({
1919
+ ...h,
1787
1920
  interactionsDisabled: !1
1788
1921
  }));
1789
- }, []), k = p(() => {
1790
- l((f) => ({
1791
- ...f,
1922
+ }, []), k = f(() => {
1923
+ r((h) => ({
1924
+ ...h,
1792
1925
  interactionsDisabled: !0
1793
1926
  }));
1794
- }, []), b = $(() => e ? {
1795
- ...pe,
1927
+ }, []), b = f((h) => {
1928
+ r((y) => ({
1929
+ ...y,
1930
+ globalKeysDisabled: h
1931
+ }));
1932
+ }, []), S = I(() => e ? {
1933
+ ..._e,
1796
1934
  toggleFullscreen: []
1797
- } : pe, [e]);
1935
+ } : _e, [e]);
1798
1936
  return {
1799
1937
  contextValue: {
1800
1938
  state: {
1801
1939
  ...c,
1802
1940
  commentsEnabled: n || c.commentsEnabled
1803
1941
  },
1804
- setCaptionsFontSizeMultiplier: u,
1942
+ setCaptionsFontSizeMultiplier: l,
1805
1943
  toggleCaptionPositionOnTop: m,
1806
- toggleCaptionsInvertColors: h,
1807
- enableInteractions: y,
1944
+ toggleCaptionsInvertColors: _,
1945
+ enableInteractions: x,
1808
1946
  disableInteractions: k,
1809
- toggleComments: g,
1947
+ setGlobalKeysDisabled: b,
1948
+ toggleComments: v,
1810
1949
  disableCaptionSettings: o
1811
1950
  },
1812
- shortcuts: b,
1951
+ shortcuts: S,
1813
1952
  storage: s
1814
1953
  };
1815
1954
  }
1816
- const Ci = {}, J = () => {
1955
+ const ki = {}, ee = () => {
1817
1956
  };
1818
- function Pi({
1957
+ function Ei({
1819
1958
  title: e,
1820
1959
  playerRef: n,
1821
1960
  src: o,
1822
1961
  captions: i = [],
1823
1962
  thumbnail: s,
1824
1963
  hideFullScreen: c = !1,
1825
- comments: l = [],
1826
- locale: u = "en",
1964
+ comments: r = [],
1965
+ locale: l = "en",
1827
1966
  annotations: m = [],
1828
- quizMarkers: h = [],
1829
- interactive: g = !1,
1830
- onAnnotationClick: y = J,
1831
- onQuizMarkerClick: k = J,
1832
- onInteractivePinClick: b = J,
1833
- interactiveMenuElements: f = [],
1834
- darkMode: w = !1,
1835
- autoLoadCaptionSrc: M = "",
1836
- forceComments: se,
1837
- disableCaptionSettings: Y,
1838
- startAt: Ae,
1839
- crossOrigin: Oe
1967
+ quizMarkers: _ = [],
1968
+ interactive: v = !1,
1969
+ onAnnotationClick: x = ee,
1970
+ onQuizMarkerClick: k = ee,
1971
+ onInteractivePinClick: b = ee,
1972
+ interactiveMenuElements: S = [],
1973
+ darkMode: h = !1,
1974
+ autoLoadCaptionSrc: y = "",
1975
+ forceComments: M,
1976
+ disableCaptionSettings: F,
1977
+ startAt: Fe,
1978
+ crossOrigin: ze
1840
1979
  }) {
1841
- const { contextValue: ae, shortcuts: Fe, storage: Ze } = fi(
1980
+ const { contextValue: X, shortcuts: Ze, storage: Ke } = wi(
1842
1981
  c,
1843
- se ?? !1,
1844
- Y ?? !1,
1845
- Ae
1846
- ), { i18n: ce } = C();
1847
- return B(() => {
1848
- ce.changeLanguage(u);
1849
- }, [ce, u]), /* @__PURE__ */ t(
1850
- lt,
1982
+ M ?? !1,
1983
+ F ?? !1,
1984
+ Fe
1985
+ ), { i18n: re } = C();
1986
+ return H(() => {
1987
+ re.changeLanguage(l);
1988
+ }, [re, l]), /* @__PURE__ */ t(
1989
+ ut,
1851
1990
  {
1852
1991
  hideFullScreen: c,
1853
- comments: l,
1992
+ comments: r,
1854
1993
  annotations: m,
1855
- quizMarkers: h,
1856
- interactive: g,
1857
- onAnnotationClick: y,
1994
+ quizMarkers: _,
1995
+ interactive: v,
1996
+ onAnnotationClick: x,
1858
1997
  onQuizMarkerClick: k,
1859
1998
  onInteractivePinClick: b,
1860
- interactiveMenuElements: f,
1861
- darkMode: w,
1862
- forceComments: se ?? !1,
1863
- disableCaptionSettings: Y ?? !1,
1864
- children: /* @__PURE__ */ t(ct, { contextValue: ae, children: /* @__PURE__ */ a(
1865
- Xe,
1999
+ interactiveMenuElements: S,
2000
+ darkMode: h,
2001
+ forceComments: M ?? !1,
2002
+ disableCaptionSettings: F ?? !1,
2003
+ children: /* @__PURE__ */ t(lt, { contextValue: X, children: /* @__PURE__ */ a(
2004
+ et,
1866
2005
  {
1867
- crossOrigin: Oe,
1868
- storage: Ze,
2006
+ crossOrigin: ze,
2007
+ storage: Ke,
1869
2008
  title: e,
1870
2009
  src: o,
1871
- keyShortcuts: Fe,
2010
+ keyShortcuts: Ze,
1872
2011
  playsInline: !0,
1873
- keyDisabled: ae.state.interactionsDisabled,
1874
- onTextTracksChange: (z) => {
1875
- const le = z == null ? void 0 : z.findIndex(
1876
- ($e) => $e.src === M
2012
+ keyDisabled: X.state.interactionsDisabled || X.state.globalKeysDisabled,
2013
+ onTextTracksChange: (U) => {
2014
+ const le = U == null ? void 0 : U.findIndex(
2015
+ (De) => De.src === y
1877
2016
  );
1878
- le > -1 && (z[le].mode = "showing");
2017
+ le > -1 && (U[le].mode = "showing");
1879
2018
  },
1880
2019
  children: [
1881
- /* @__PURE__ */ t(ao, {}),
1882
- /* @__PURE__ */ a(Je, { className: Ci.mediaProvider, children: [
1883
- /* @__PURE__ */ t(ho, { src: s }),
1884
- /* @__PURE__ */ t(Un, {}),
1885
- /* @__PURE__ */ t(vt, {}),
1886
- /* @__PURE__ */ t(kt, { captions: i }),
1887
- /* @__PURE__ */ t(Jn, {}),
1888
- /* @__PURE__ */ t(Et, { comments: l }),
1889
- /* @__PURE__ */ t(bo, {})
2020
+ /* @__PURE__ */ t(ho, {}),
2021
+ /* @__PURE__ */ a(tt, { className: ki.mediaProvider, children: [
2022
+ /* @__PURE__ */ t(vo, { src: s }),
2023
+ /* @__PURE__ */ t(Yn, {}),
2024
+ /* @__PURE__ */ t(bt, {}),
2025
+ /* @__PURE__ */ t(xt, { captions: i }),
2026
+ /* @__PURE__ */ t(No, {}),
2027
+ /* @__PURE__ */ t(so, {}),
2028
+ /* @__PURE__ */ t(Bt, { comments: r })
1890
2029
  ] }),
1891
2030
  /* @__PURE__ */ t(
1892
- Kt,
2031
+ $t,
1893
2032
  {
1894
- darkMode: w,
2033
+ darkMode: h,
1895
2034
  playerRef: n,
1896
- showCaptionsButton: !Y
2035
+ showCaptionsButton: !F
1897
2036
  }
1898
2037
  ),
1899
- /* @__PURE__ */ t(mt, { annotations: m })
2038
+ /* @__PURE__ */ t(pt, { annotations: m })
1900
2039
  ]
1901
2040
  }
1902
2041
  ) })
@@ -1904,8 +2043,8 @@ function Pi({
1904
2043
  );
1905
2044
  }
1906
2045
  export {
1907
- yt as CAPTION_FONT_SIZE_MULTIPLIERS,
1908
- Ie as COMMENT_DURATION,
1909
- V as PLAYBACK_RATES,
1910
- Pi as StudioPlayer
2046
+ Lt as CAPTION_FONT_SIZE_MULTIPLIERS,
2047
+ Se as COMMENT_DURATION,
2048
+ R as PLAYBACK_RATES,
2049
+ Ei as StudioPlayer
1911
2050
  };