@instructure/studio-player 0.1.5 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/StudioPlayer/StudioPlayer.d.ts +4 -2
  2. package/dist/StudioPlayer/store/StudioPlayerMediaStorage.d.ts +40 -0
  3. package/dist/StudioPlayer/useStudioPlayer.d.ts +5 -1
  4. package/dist/constants.d.ts +2 -4
  5. package/dist/en-CDw-Fu7s.js +87 -0
  6. package/dist/i18n.d.ts +1 -0
  7. package/dist/index.css +1 -1
  8. package/dist/kl-fK-9jtTT.js +87 -0
  9. package/dist/studio-player.es.js +970 -677
  10. package/dist/types.d.ts +12 -0
  11. package/package.json +14 -10
package/dist/studio-player.es.js CHANGED
@@ -1,584 +1,709 @@
1
- import { jsx as e, jsxs as a, Fragment as Q } from "react/jsx-runtime";
2
- import { Spinner as Z, useMediaState as m, isTrackCaptionKind as ue, useMediaRemote as $, Track as he, Captions as me, usePlaybackRateOptions as _e, useCaptionOptions as pe, useVideoQualityOptions as be, useMediaStore as W, FullscreenButton as J, useMediaPlayer as fe, PlayButton as ge, Poster as ke, Time as A, TimeSlider as B, MuteButton as we, VolumeSlider as S, MediaPlayer as Ce, MediaProvider as ve } from "@vidstack/react";
3
- import { createContext as X, useContext as i, useCallback as u, useEffect as G, useState as v, useMemo as Y, useRef as ye } from "react";
4
- import { useFloating as Le, autoUpdate as Me, flip as Ne, arrow as Ie, useDismiss as xe, useInteractions as Be, FloatingFocusManager as He, FloatingArrow as Ve } from "@floating-ui/react";
5
- import './index.css';const Te = "_media-buffering-indicator_1fwjr_1", Pe = "_media-buffering-spinner_1fwjr_17", Se = "_media-buffering-spin_1fwjr_17", Re = "_media-buffering-track_1fwjr_22", Fe = "_media-buffering-track-fill_1fwjr_27", R = {
1
+ import './index.css';var be = Object.defineProperty;
2
+ var ve = (e, n, o) => n in e ? be(e, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[n] = o;
3
+ var L = (e, n, o) => ve(e, typeof n != "symbol" ? n + "" : n, o);
4
+ import { jsx as t, jsxs as s, Fragment as oe } from "react/jsx-runtime";
5
+ import { createContext as ae, useContext as u, useCallback as m, useEffect as $, useState as T, useMemo as K, useRef as Ce } from "react";
6
+ import { Spinner as j, useMediaState as h, isTrackCaptionKind as ke, useMediaRemote as z, Track as we, Captions as ye, useMediaPlayer as se, usePlaybackRateOptions as Le, useCaptionOptions as Ne, useVideoQualityOptions as Te, useMediaStore as ce, FullscreenButton as ie, PlayButton as Me, Poster as Ie, Time as Q, TimeSlider as H, MuteButton as Se, VolumeSlider as O, MediaPlayer as Pe, MediaProvider as Be } from "@vidstack/react";
7
+ import { initReactI18next as Re, useTranslation as p } from "react-i18next";
8
+ import He from "i18next";
9
+ import Ve from "i18next-resources-to-backend";
10
+ import { useFloating as xe, autoUpdate as Ae, flip as Ee, arrow as Oe, useDismiss as Fe, useInteractions as Ze, FloatingFocusManager as Ke, FloatingArrow as $e } from "@floating-ui/react";
11
+ const De = (e, n, o) => {
12
+ const a = e[n];
13
+ return a ? typeof a == "function" ? a() : Promise.resolve(a) : new Promise((c, i) => {
14
+ (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
15
+ i.bind(
16
+ null,
17
+ new Error(
18
+ "Unknown variable dynamic import: " + n + (n.split("/").length !== o ? ". Note that variables only represent file names one level deep." : "")
19
+ )
20
+ )
21
+ );
22
+ });
23
+ };
24
+ He.use(Re).use(
25
+ Ve(
26
+ (e) => De(/* @__PURE__ */ Object.assign({ "./locales/en.json": () => import("./en-CDw-Fu7s.js"), "./locales/kl.json": () => import("./kl-fK-9jtTT.js") }), `./locales/${e}.json`, 3)
27
+ )
28
+ ).init({
29
+ fallbackLng: "en",
30
+ partialBundledLanguages: !0,
31
+ ns: [],
32
+ resources: {},
33
+ interpolation: {
34
+ escapeValue: !1
35
+ }
36
+ });
37
+ const je = "_media-buffering-indicator_1fwjr_1", Ue = "_media-buffering-spinner_1fwjr_17", ze = "_media-buffering-spin_1fwjr_17", Ge = "_media-buffering-track_1fwjr_22", We = "_media-buffering-track-fill_1fwjr_27", F = {
6
38
  "media-buffering-indicator": "_media-buffering-indicator_1fwjr_1",
7
- mediaBufferingIndicator: Te,
39
+ mediaBufferingIndicator: je,
8
40
  "media-buffering-spinner": "_media-buffering-spinner_1fwjr_17",
9
- mediaBufferingSpinner: Pe,
41
+ mediaBufferingSpinner: Ue,
10
42
  "media-buffering-spin": "_media-buffering-spin_1fwjr_17",
11
- mediaBufferingSpin: Se,
43
+ mediaBufferingSpin: ze,
12
44
  "media-buffering-track": "_media-buffering-track_1fwjr_22",
13
- mediaBufferingTrack: Re,
45
+ mediaBufferingTrack: Ge,
14
46
  "media-buffering-track-fill": "_media-buffering-track-fill_1fwjr_27",
15
- mediaBufferingTrackFill: Fe
47
+ mediaBufferingTrackFill: We
16
48
  };
17
49
  function qe() {
18
- return /* @__PURE__ */ e("div", { className: R.mediaBufferingIndicator, children: /* @__PURE__ */ a(Z.Root, { className: R.mediaBufferingSpinner, size: 96, children: [
19
- /* @__PURE__ */ e(Z.Track, { className: R.mediaBufferingTrack, width: 8 }),
20
- /* @__PURE__ */ e(
21
- Z.TrackFill,
50
+ return /* @__PURE__ */ t("div", { className: F.mediaBufferingIndicator, children: /* @__PURE__ */ s(j.Root, { className: F.mediaBufferingSpinner, size: 96, children: [
51
+ /* @__PURE__ */ t(j.Track, { className: F.mediaBufferingTrack, width: 8 }),
52
+ /* @__PURE__ */ t(
53
+ j.TrackFill,
22
54
  {
23
- className: R.mediaBufferingTrackFill,
55
+ className: F.mediaBufferingTrackFill,
24
56
  width: 8
25
57
  }
26
58
  )
27
59
  ] }) });
28
60
  }
29
- const p = X(null), ee = (t) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
30
- /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("clipPath", { id: "clip0_149_104418", children: /* @__PURE__ */ e("rect", { width: 24, height: 24, fill: "white" }) }) }),
31
- /* @__PURE__ */ e("g", { clipPath: "url(#clip0_149_104418)", children: /* @__PURE__ */ e("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" }) })
32
- ] }), te = (t) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
33
- /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("clipPath", { id: "clip0_149_104406", children: /* @__PURE__ */ e("rect", { width: 24, height: 24, fill: "white" }) }) }),
34
- /* @__PURE__ */ e("g", { clipPath: "url(#clip0_149_104406)", children: /* @__PURE__ */ e("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" }) })
61
+ const f = ae(null), le = (e) => /* @__PURE__ */ s("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
62
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104418", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
63
+ /* @__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" }) })
64
+ ] }), re = (e) => /* @__PURE__ */ s("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
65
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104406", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
66
+ /* @__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" }) })
35
67
  ] });
36
- function Ze() {
37
- const t = m("hasCaptions"), n = m("textTrack"), o = n && ue(n), c = $(), s = i(p), r = u(
38
- (d) => {
39
- c.toggleCaptions(d.nativeEvent);
68
+ function Qe() {
69
+ const e = h("hasCaptions"), n = h("textTrack"), o = n && ke(n), a = z(), c = u(f), i = m(
70
+ (l) => {
71
+ a.toggleCaptions(l.nativeEvent);
40
72
  },
41
- [c]
73
+ [a]
42
74
  );
43
- return t ? /* @__PURE__ */ e(
75
+ return e ? /* @__PURE__ */ t(
44
76
  "button",
45
77
  {
46
78
  type: "button",
47
79
  className: "controls-button",
48
- onClick: r,
80
+ onClick: i,
49
81
  "aria-label": "Captions",
50
- tabIndex: s != null && s.state.interactionsDisabled ? -1 : 0,
51
- children: o ? /* @__PURE__ */ e(te, { className: "controls-button-icon" }) : /* @__PURE__ */ e(ee, { className: "controls-button-icon" })
82
+ tabIndex: c != null && c.state.interactionsDisabled ? -1 : 0,
83
+ children: o ? /* @__PURE__ */ t(re, { className: "controls-button-icon" }) : /* @__PURE__ */ t(le, { className: "controls-button-icon" })
52
84
  }
53
85
  ) : null;
54
86
  }
55
- const je = "_captions_13epz_1", $e = {
56
- captions: je
87
+ const Ye = "_captions_13epz_1", Je = {
88
+ captions: Ye
57
89
  };
58
- function Oe({ captions: t }) {
59
- const n = m("hasCaptions"), o = i(p);
60
- return /* @__PURE__ */ a(Q, { children: [
61
- t.map((c) => /* @__PURE__ */ e(
62
- he,
90
+ function Xe({ captions: e }) {
91
+ const n = h("hasCaptions"), o = u(f);
92
+ return /* @__PURE__ */ s(oe, { children: [
93
+ e.map((a) => /* @__PURE__ */ t(
94
+ we,
63
95
  {
64
96
  kind: "subtitles",
65
- type: c.type,
66
- language: c.language,
67
- label: c.label,
68
- src: c.src
97
+ type: a.type,
98
+ language: a.language,
99
+ label: a.label,
100
+ src: a.src
69
101
  },
70
- c.label
102
+ a.label
71
103
  )),
72
- n ? /* @__PURE__ */ e(
104
+ n ? /* @__PURE__ */ t(
73
105
  "div",
74
106
  {
75
107
  style: {
76
108
  display: "contents",
77
- "--captions-font-size-multiplier": (o == null ? void 0 : o.state.captionsFontSizeMultiplier.value) ?? 1,
109
+ "--captions-font-size-multiplier": (o == null ? void 0 : o.state.captionsFontSizeMultiplier) ?? 1,
78
110
  "--captions-flex-direction": o != null && o.state.captionPositionOnTop ? "column" : "column-reverse",
79
111
  "--captions-color": o != null && o.state.captionsInvertColors ? "rgba(22, 22, 22)" : "white",
80
112
  "--captions-background-color": o != null && o.state.captionsInvertColors ? "rgba(255, 255, 255, 0.75)" : "rgba(22, 22, 22, 0.75)"
81
113
  },
82
- children: /* @__PURE__ */ e(me, { className: $e.captions })
114
+ children: /* @__PURE__ */ t(ye, { className: Je.captions })
83
115
  }
84
116
  ) : null
85
117
  ] });
86
118
  }
87
- const ze = "_root_zdwuq_1", Ae = "_left-controls_zdwuq_27", Ke = "_right-controls_zdwuq_33", De = "_indicators_zdwuq_39", Ee = "_normal-timeline_zdwuq_48", Ue = "_compact-timeline_zdwuq_54", M = {
88
- root: ze,
119
+ const P = [0.5, 0.75, 1, 1.25, 1.5, 2], et = [0.5, 1, 2, 3, 4], ue = 5, tt = (e) => {
120
+ const [, n] = T({});
121
+ return K(() => {
122
+ let o = [];
123
+ return {
124
+ add(a) {
125
+ o.length >= e && o.shift(), o.push(a), n({});
126
+ },
127
+ remove(a) {
128
+ o = o.filter((c) => c !== a), n({});
129
+ },
130
+ map(a) {
131
+ return o.map(a);
132
+ }
133
+ };
134
+ }, []);
135
+ }, nt = (e, n, o) => {
136
+ let a = !1;
137
+ return (c) => {
138
+ const i = c.detail.currentTime;
139
+ i >= e.timestamp && i < e.timestamp + n && !a && (o.add(e), a = !0), (i < e.timestamp || i >= e.timestamp + n) && a && (o.remove(e), a = !1);
140
+ };
141
+ }, ot = (e, n = 5) => {
142
+ const o = se(), a = tt(n);
143
+ return $(() => {
144
+ if (!o)
145
+ return;
146
+ const c = [];
147
+ for (const i of e) {
148
+ const l = nt(i, ue, a);
149
+ c.push(l), o.addEventListener("time-update", l);
150
+ }
151
+ return () => {
152
+ for (const i of c)
153
+ o.removeEventListener("time-update", i);
154
+ };
155
+ }, [o, a, e]), a;
156
+ }, at = "_comments-overlay_agbjl_1", st = "_comments-container_agbjl_9", ct = "_comment_agbjl_1", it = "_comment-text_agbjl_44", lt = "_comment-author-avatar_agbjl_67", rt = "_comment-author-name_agbjl_86", B = {
157
+ "comments-overlay": "_comments-overlay_agbjl_1",
158
+ commentsOverlay: at,
159
+ "comments-container": "_comments-container_agbjl_9",
160
+ commentsContainer: st,
161
+ comment: ct,
162
+ "comment-text": "_comment-text_agbjl_44",
163
+ commentText: it,
164
+ "comment-author-avatar": "_comment-author-avatar_agbjl_67",
165
+ commentAuthorAvatar: lt,
166
+ "comment-author-name": "_comment-author-name_agbjl_86",
167
+ commentAuthorName: rt
168
+ };
169
+ function ut({ comment: e }) {
170
+ return /* @__PURE__ */ s("div", { className: B.comment, onClick: e.onClick, children: [
171
+ /* @__PURE__ */ t(
172
+ "img",
173
+ {
174
+ className: B.commentAuthorAvatar,
175
+ src: e.user.avatar,
176
+ alt: e.user.name
177
+ }
178
+ ),
179
+ /* @__PURE__ */ t("span", { className: B.commentText, children: e.text }),
180
+ /* @__PURE__ */ t("span", { className: B.commentAuthorName, children: e.user.name })
181
+ ] });
182
+ }
183
+ const Y = 5;
184
+ function dt() {
185
+ const e = u(f), n = (e == null ? void 0 : e.comments) || [], o = ot(n, Y), a = !!h("textTrack"), c = o.map((i) => /* @__PURE__ */ t(ut, { comment: i }, i.id));
186
+ return n.length > 0 && (e != null && e.state.commentsEnabled) ? /* @__PURE__ */ t(
187
+ "div",
188
+ {
189
+ className: B.commentsOverlay,
190
+ style: {
191
+ flexDirection: e != null && e.state.captionPositionOnTop && a ? "column-reverse" : "column"
192
+ },
193
+ children: /* @__PURE__ */ t("div", { className: B.commentsContainer, children: a ? c.slice(-(Y - 1)) : c })
194
+ }
195
+ ) : null;
196
+ }
197
+ const mt = "_root_zdwuq_1", ht = "_left-controls_zdwuq_27", _t = "_right-controls_zdwuq_33", pt = "_indicators_zdwuq_39", gt = "_normal-timeline_zdwuq_48", ft = "_compact-timeline_zdwuq_54", S = {
198
+ root: mt,
89
199
  "left-controls": "_left-controls_zdwuq_27",
90
- leftControls: Ae,
200
+ leftControls: ht,
91
201
  "right-controls": "_right-controls_zdwuq_33",
92
- rightControls: Ke,
93
- indicators: De,
202
+ rightControls: _t,
203
+ indicators: pt,
94
204
  "normal-timeline": "_normal-timeline_zdwuq_48",
95
- normalTimeline: Ee,
205
+ normalTimeline: gt,
96
206
  "compact-timeline": "_compact-timeline_zdwuq_54",
97
- compactTimeline: Ue
207
+ compactTimeline: ft
98
208
  };
99
- function Qe() {
100
- return /* @__PURE__ */ a("div", { className: M.root, children: [
101
- /* @__PURE__ */ e(E, { className: M.normalTimeline }),
102
- /* @__PURE__ */ a("div", { className: M.leftControls, children: [
103
- /* @__PURE__ */ e(hn, {}),
104
- /* @__PURE__ */ e($n, {})
209
+ function bt() {
210
+ return /* @__PURE__ */ s("div", { className: S.root, children: [
211
+ /* @__PURE__ */ t(ee, { className: S.normalTimeline }),
212
+ /* @__PURE__ */ s("div", { className: S.leftControls, children: [
213
+ /* @__PURE__ */ t(On, {}),
214
+ /* @__PURE__ */ t(go, {})
105
215
  ] }),
106
- /* @__PURE__ */ e("div", { className: M.indicators, children: /* @__PURE__ */ e(Mn, {}) }),
107
- /* @__PURE__ */ e(E, { className: M.compactTimeline }),
108
- /* @__PURE__ */ a("div", { className: M.rightControls, children: [
109
- /* @__PURE__ */ e(Ze, {}),
110
- /* @__PURE__ */ e(qt, {}),
111
- /* @__PURE__ */ e(Yt, {})
216
+ /* @__PURE__ */ t("div", { className: S.indicators, children: /* @__PURE__ */ t(Yn, {}) }),
217
+ /* @__PURE__ */ t(ee, { className: S.compactTimeline }),
218
+ /* @__PURE__ */ s("div", { className: S.rightControls, children: [
219
+ /* @__PURE__ */ t(Qe, {}),
220
+ /* @__PURE__ */ t(un, {}),
221
+ /* @__PURE__ */ t(Tn, {})
112
222
  ] })
113
223
  ] });
114
224
  }
115
- const We = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), b = X(null), Je = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), Xe = "_menu-hint_k49ve_1", Ge = "_menu-button_k49ve_5", Ye = "_menu-label_k49ve_37", et = "_menu-icon_k49ve_42", F = {
225
+ const vt = (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" }) }), C = ae(null), Ct = (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" }) }), kt = "_menu-hint_k49ve_1", wt = "_menu-button_k49ve_5", yt = "_menu-label_k49ve_37", Lt = "_menu-icon_k49ve_42", Z = {
116
226
  "menu-hint": "_menu-hint_k49ve_1",
117
- menuHint: Xe,
227
+ menuHint: kt,
118
228
  "menu-button": "_menu-button_k49ve_5",
119
- menuButton: Ge,
229
+ menuButton: wt,
120
230
  "menu-label": "_menu-label_k49ve_37",
121
- menuLabel: Ye,
231
+ menuLabel: yt,
122
232
  "menu-icon": "_menu-icon_k49ve_42",
123
- menuIcon: et
233
+ menuIcon: Lt
124
234
  };
125
- function T({ label: t, hint: n, onClick: o, Icon: c }) {
126
- return /* @__PURE__ */ a("button", { type: "button", className: F.menuButton, onClick: o, children: [
127
- c && /* @__PURE__ */ e(c, { className: F.menuIcon }),
128
- /* @__PURE__ */ e("span", { className: F.menuLabel, children: t }),
129
- /* @__PURE__ */ e("span", { className: F.menuHint, children: n }),
130
- /* @__PURE__ */ e(Je, {})
235
+ function A({ label: e, hint: n, onClick: o, Icon: a }) {
236
+ return /* @__PURE__ */ s("button", { type: "button", className: Z.menuButton, onClick: o, children: [
237
+ a && /* @__PURE__ */ t(a, { className: Z.menuIcon }),
238
+ /* @__PURE__ */ t("span", { className: Z.menuLabel, children: e }),
239
+ /* @__PURE__ */ t("span", { className: Z.menuHint, children: n }),
240
+ /* @__PURE__ */ t(Ct, {})
131
241
  ] });
132
242
  }
133
- const tt = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) });
134
- function nt() {
135
- const t = i(b), n = m("playbackRate"), o = u(() => {
136
- t && t.setPage("speed");
137
- }, [t]);
138
- return t ? /* @__PURE__ */ e(
139
- T,
243
+ const Nt = (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" }) });
244
+ function Tt() {
245
+ const e = u(C), n = h("playbackRate"), { t: o } = p(), a = m(() => {
246
+ e && e.setPage("speed");
247
+ }, [e]);
248
+ return e ? /* @__PURE__ */ t(
249
+ A,
140
250
  {
141
- label: "Playback Speed",
251
+ label: o("PLAYBACK_SPEED"),
142
252
  hint: `${n}x`,
143
- onClick: o,
144
- Icon: tt
253
+ onClick: a,
254
+ Icon: Nt
145
255
  }
146
256
  ) : null;
147
257
  }
148
- function ot() {
149
- const t = i(b), n = m("hasCaptions"), o = m("textTrack"), c = u(() => {
150
- t && t.setPage("captions");
151
- }, [t]);
152
- return t && n ? /* @__PURE__ */ e(
153
- T,
258
+ function Mt() {
259
+ const e = u(C), n = h("hasCaptions"), o = h("textTrack"), { t: a } = p(), c = m(() => {
260
+ e && e.setPage("captions");
261
+ }, [e]);
262
+ return e && n ? /* @__PURE__ */ t(
263
+ A,
154
264
  {
155
- label: "Captions",
156
- hint: (o == null ? void 0 : o.label) ?? "Off",
265
+ label: a("CAPTIONS"),
266
+ hint: (o == null ? void 0 : o.label) ?? a("OFF"),
157
267
  onClick: c,
158
- Icon: ee
268
+ Icon: le
159
269
  }
160
270
  ) : null;
161
271
  }
162
- const at = (t) => /* @__PURE__ */ a("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: [
163
- /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ e("clipPath", { id: "clip0_412_23039", children: /* @__PURE__ */ e("rect", { width: 18, height: 18, fill: "white" }) }) }),
164
- /* @__PURE__ */ a("g", { clipPath: "url(#clip0_412_23039)", children: [
165
- /* @__PURE__ */ e("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" }),
166
- /* @__PURE__ */ e("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0 8.40039H9.46326C9.7388 7.11449 10.8818 6.15039 12.25 6.15039C13.6182 6.15039 14.7612 7.11449 15.0367 8.40039H18V9.60039H15.0367C14.7612 10.8863 13.6182 11.8504 12.25 11.8504C10.8818 11.8504 9.7388 10.8863 9.46326 9.60039H0V8.40039ZM12.25 7.35039C11.3387 7.35039 10.6 8.08912 10.6 9.00039C10.6 9.91166 11.3387 10.6504 12.25 10.6504C13.1613 10.6504 13.9 9.91166 13.9 9.00039C13.9 8.08912 13.1613 7.35039 12.25 7.35039Z", fill: "currentColor" }),
167
- /* @__PURE__ */ e("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" })
272
+ const It = (e) => /* @__PURE__ */ s("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
273
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_412_23039", children: /* @__PURE__ */ t("rect", { width: 18, height: 18, fill: "white" }) }) }),
274
+ /* @__PURE__ */ s("g", { clipPath: "url(#clip0_412_23039)", children: [
275
+ /* @__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" }),
276
+ /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0 8.40039H9.46326C9.7388 7.11449 10.8818 6.15039 12.25 6.15039C13.6182 6.15039 14.7612 7.11449 15.0367 8.40039H18V9.60039H15.0367C14.7612 10.8863 13.6182 11.8504 12.25 11.8504C10.8818 11.8504 9.7388 10.8863 9.46326 9.60039H0V8.40039ZM12.25 7.35039C11.3387 7.35039 10.6 8.08912 10.6 9.00039C10.6 9.91166 11.3387 10.6504 12.25 10.6504C13.1613 10.6504 13.9 9.91166 13.9 9.00039C13.9 8.08912 13.1613 7.35039 12.25 7.35039Z", fill: "currentColor" }),
277
+ /* @__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" })
168
278
  ] })
169
279
  ] });
170
- function ct() {
171
- const t = i(b), n = m("autoQuality"), o = m("quality"), c = u(() => {
172
- t && t.setPage("quality");
173
- }, [t]);
174
- return t && o ? /* @__PURE__ */ e(
175
- T,
280
+ function St() {
281
+ const e = u(C), n = h("autoQuality"), o = h("quality"), { t: a } = p(), c = m(() => {
282
+ e && e.setPage("quality");
283
+ }, [e]);
284
+ return e && o ? /* @__PURE__ */ t(
285
+ A,
176
286
  {
177
- label: "Quality",
178
- hint: n ? `Auto (${o.height}p)` : `${o.height}p`,
287
+ label: a("QUALITY"),
288
+ hint: n ? a("AUTO", { quality: o.height }) : `${o.height}p`,
179
289
  onClick: c,
180
- Icon: at
290
+ Icon: It
181
291
  }
182
292
  ) : null;
183
293
  }
184
- function y(t) {
185
- G(() => {
294
+ const Pt = (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" }) }), Bt = (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" }) }), Rt = "_switch-track_vptv3_1", Ht = "_switch-thumb_vptv3_11", Vt = "_switch-icon_vptv3_25", xt = "_switch-body_vptv3_31", At = "_switch-label_vptv3_68", Et = "_menu-icon_vptv3_72", M = {
295
+ "switch-track": "_switch-track_vptv3_1",
296
+ switchTrack: Rt,
297
+ "switch-thumb": "_switch-thumb_vptv3_11",
298
+ switchThumb: Ht,
299
+ "switch-icon": "_switch-icon_vptv3_25",
300
+ switchIcon: Vt,
301
+ "switch-body": "_switch-body_vptv3_31",
302
+ switchBody: xt,
303
+ "switch-label": "_switch-label_vptv3_68",
304
+ switchLabel: At,
305
+ "menu-icon": "_menu-icon_vptv3_72",
306
+ menuIcon: Et
307
+ };
308
+ function G({
309
+ label: e,
310
+ checked: n = !1,
311
+ onClick: o,
312
+ Icon: a
313
+ }) {
314
+ const c = m(
315
+ (i) => {
316
+ (i.key === "Enter" || i.key === " ") && (o == null || o());
317
+ },
318
+ [o]
319
+ );
320
+ return /* @__PURE__ */ s(
321
+ "div",
322
+ {
323
+ className: M.switchBody,
324
+ role: "menuitemcheckbox",
325
+ "aria-checked": n,
326
+ onClick: o,
327
+ onKeyDown: c,
328
+ tabIndex: 0,
329
+ children: [
330
+ a && /* @__PURE__ */ t(a, { className: M.menuIcon }),
331
+ /* @__PURE__ */ t("span", { className: M.switchLabel, children: e }),
332
+ /* @__PURE__ */ t("div", { className: M.switchTrack, children: /* @__PURE__ */ t("div", { className: M.switchThumb, children: n ? /* @__PURE__ */ t(Pt, { className: M.switchIcon }) : /* @__PURE__ */ t(Bt, { className: M.switchIcon }) }) })
333
+ ]
334
+ }
335
+ );
336
+ }
337
+ const Ot = (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" }) });
338
+ function Ft() {
339
+ const e = u(f), { t: n } = p();
340
+ return e != null && e.hasComments ? /* @__PURE__ */ t(
341
+ G,
342
+ {
343
+ Icon: Ot,
344
+ label: n("COMMENTS"),
345
+ onClick: e.toggleComments,
346
+ checked: e.state.commentsEnabled
347
+ }
348
+ ) : null;
349
+ }
350
+ function I(e) {
351
+ $(() => {
186
352
  const n = (o) => {
187
- o.key === "Escape" && (t == null || t());
353
+ o.key === "Escape" && (e == null || e());
188
354
  };
189
355
  return document.addEventListener("keydown", n), () => {
190
356
  document.removeEventListener("keydown", n);
191
357
  };
192
358
  }, []);
193
359
  }
194
- const st = "_main-menu_7h96l_1", lt = {
360
+ const Zt = "_main-menu_7h96l_1", Kt = {
195
361
  "main-menu": "_main-menu_7h96l_1",
196
- mainMenu: st
362
+ mainMenu: Zt
197
363
  };
198
- function it() {
199
- const t = i(b);
200
- return y(t == null ? void 0 : t.toggle), /* @__PURE__ */ a("div", { className: lt.mainMenu, children: [
201
- /* @__PURE__ */ e(nt, {}),
202
- /* @__PURE__ */ e(ot, {}),
203
- /* @__PURE__ */ e(ct, {})
364
+ function $t() {
365
+ const e = u(C);
366
+ return I(e == null ? void 0 : e.toggle), /* @__PURE__ */ s("div", { className: Kt.mainMenu, children: [
367
+ /* @__PURE__ */ t(Tt, {}),
368
+ /* @__PURE__ */ t(Mt, {}),
369
+ /* @__PURE__ */ t(Ft, {}),
370
+ /* @__PURE__ */ t(St, {})
204
371
  ] });
205
372
  }
206
- const q = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), P = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), I = [0.5, 0.75, 1, 1.25, 1.5, 2], rt = [
207
- { label: "50%", value: 0.5 },
208
- { label: "100%", value: 1 },
209
- { label: "200%", value: 2 },
210
- { label: "300%", value: 3 },
211
- { label: "400%", value: 4 }
212
- ], dt = "_menu-container_rqjaq_1", ut = "_menu-options_rqjaq_6", ht = "_menu-heading_rqjaq_11", mt = "_check-icon_rqjaq_27", _t = "_menu-item-label_rqjaq_33", pt = "_menu-item_rqjaq_33", bt = "_menu-back-button_rqjaq_65", l = {
213
- "menu-container": "_menu-container_rqjaq_1",
214
- menuContainer: dt,
215
- "menu-options": "_menu-options_rqjaq_6",
216
- menuOptions: ut,
217
- "menu-heading": "_menu-heading_rqjaq_11",
218
- menuHeading: ht,
219
- "check-icon": "_check-icon_rqjaq_27",
220
- checkIcon: mt,
221
- "menu-item-label": "_menu-item-label_rqjaq_33",
222
- menuItemLabel: _t,
223
- "menu-item": "_menu-item_rqjaq_33",
224
- menuItem: pt,
225
- "menu-back-button": "_menu-back-button_rqjaq_65",
226
- menuBackButton: bt
373
+ const 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: "M17.1347 3.00061L6.55157 13.5825L0.865302 7.89624L0 8.76154L6.55157 15.3131L17.9988 3.86469L17.1347 3.00061Z", fill: "currentColor" }) }), E = (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" }) }), Dt = "_menu-container_1bjr3_1", jt = "_menu-options_1bjr3_6", Ut = "_menu-heading_1bjr3_11", zt = "_check-icon_1bjr3_27", Gt = "_menu-item-label_1bjr3_33", Wt = "_menu-item_1bjr3_33", qt = "_menu-back-button_1bjr3_66", r = {
374
+ "menu-container": "_menu-container_1bjr3_1",
375
+ menuContainer: Dt,
376
+ "menu-options": "_menu-options_1bjr3_6",
377
+ menuOptions: jt,
378
+ "menu-heading": "_menu-heading_1bjr3_11",
379
+ menuHeading: Ut,
380
+ "check-icon": "_check-icon_1bjr3_27",
381
+ checkIcon: zt,
382
+ "menu-item-label": "_menu-item-label_1bjr3_33",
383
+ menuItemLabel: Gt,
384
+ "menu-item": "_menu-item_1bjr3_33",
385
+ menuItem: Wt,
386
+ "menu-back-button": "_menu-back-button_1bjr3_66",
387
+ menuBackButton: qt
227
388
  };
228
- function ft() {
229
- const t = i(b), n = _e({
230
- rates: I,
389
+ function Qt() {
390
+ const e = u(C), n = Le({
391
+ rates: P,
231
392
  normalLabel: "1x"
232
- });
233
- return y(t == null ? void 0 : t.backToMain), t ? /* @__PURE__ */ a("div", { className: l.menuContainer, children: [
234
- /* @__PURE__ */ a(
393
+ }), { t: o } = p();
394
+ return I(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ s("div", { className: r.menuContainer, children: [
395
+ /* @__PURE__ */ s(
235
396
  "button",
236
397
  {
237
398
  type: "button",
238
- className: l.menuBackButton,
239
- onClick: t.backToMain,
399
+ className: r.menuBackButton,
400
+ onClick: e.backToMain,
240
401
  children: [
241
- /* @__PURE__ */ e(P, {}),
242
- /* @__PURE__ */ e("span", { children: "Back" })
402
+ /* @__PURE__ */ t(E, {}),
403
+ /* @__PURE__ */ t("span", { children: o("BACK") })
243
404
  ]
244
405
  }
245
406
  ),
246
- /* @__PURE__ */ e("strong", { className: l.menuHeading, children: "Playback Speed" }),
247
- /* @__PURE__ */ e("div", { role: "menu", className: l.menuOptions, children: n.map(({ value: o, label: c, select: s, selected: r }) => /* @__PURE__ */ a(
407
+ /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("PLAYBACK_SPEED") }),
408
+ /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: a, label: c, select: i, selected: l }) => /* @__PURE__ */ s(
248
409
  "button",
249
410
  {
250
411
  type: "button",
251
412
  role: "menuitemradio",
252
- "aria-checked": r,
413
+ "aria-checked": l,
253
414
  onClick: () => {
254
- s(), t.backToMain(), t.toggle();
415
+ i(), e.backToMain(), e.toggle();
255
416
  },
256
- className: l.menuItem,
417
+ className: r.menuItem,
257
418
  children: [
258
- /* @__PURE__ */ e(q, { className: l.checkIcon }),
259
- /* @__PURE__ */ e("span", { className: l.menuItemLabel, children: c })
419
+ /* @__PURE__ */ t(D, { className: r.checkIcon }),
420
+ /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: c })
260
421
  ]
261
422
  },
262
- o
423
+ a
263
424
  )) })
264
425
  ] }) : null;
265
426
  }
266
- function gt() {
267
- const t = i(b), n = m("textTrack"), o = u(() => {
268
- t && t.setPage("captionLanguage");
269
- }, [t]);
270
- return t ? /* @__PURE__ */ e(
271
- T,
427
+ function Yt() {
428
+ const e = u(C), n = h("textTrack"), { t: o } = p(), a = m(() => {
429
+ e && e.setPage("captionLanguage");
430
+ }, [e]);
431
+ return e ? /* @__PURE__ */ t(
432
+ A,
272
433
  {
273
- label: "Language",
274
- hint: (n == null ? void 0 : n.label) ?? "Off",
275
- onClick: o
434
+ label: o("LANGUAGE"),
435
+ hint: (n == null ? void 0 : n.label) ?? o("OFF"),
436
+ onClick: a
276
437
  }
277
438
  ) : null;
278
439
  }
279
- function kt() {
280
- const t = i(p), n = i(b), o = u(() => {
440
+ function Jt() {
441
+ const e = u(f), n = u(C), { t: o } = p(), a = m(() => {
281
442
  n && n.setPage("captionFontSize");
282
443
  }, [n]);
283
- return n && t ? /* @__PURE__ */ e(
284
- T,
444
+ return n && e ? /* @__PURE__ */ t(
445
+ A,
285
446
  {
286
- label: "Caption Font Size",
287
- hint: t.state.captionsFontSizeMultiplier.label,
288
- onClick: o
447
+ label: o("CAPTION_FONT_SIZE"),
448
+ hint: `${e.state.captionsFontSizeMultiplier * 100}%`,
449
+ onClick: a
289
450
  }
290
451
  ) : null;
291
452
  }
292
- const wt = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), Ct = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), vt = "_switch-track_8rjat_1", yt = "_switch-thumb_8rjat_11", Lt = "_switch-icon_8rjat_25", Mt = "_switch-body_8rjat_31", Nt = "_switch-label_8rjat_68", N = {
293
- "switch-track": "_switch-track_8rjat_1",
294
- switchTrack: vt,
295
- "switch-thumb": "_switch-thumb_8rjat_11",
296
- switchThumb: yt,
297
- "switch-icon": "_switch-icon_8rjat_25",
298
- switchIcon: Lt,
299
- "switch-body": "_switch-body_8rjat_31",
300
- switchBody: Mt,
301
- "switch-label": "_switch-label_8rjat_68",
302
- switchLabel: Nt
303
- };
304
- function ne({
305
- label: t,
306
- checked: n = !1,
307
- onClick: o
308
- }) {
309
- const c = u(
310
- (s) => {
311
- (s.key === "Enter" || s.key === " ") && (o == null || o());
312
- },
313
- [o]
314
- );
315
- return /* @__PURE__ */ a(
316
- "div",
453
+ function Xt() {
454
+ const e = u(f), { t: n } = p();
455
+ return e ? /* @__PURE__ */ t(
456
+ G,
317
457
  {
318
- className: N.switchBody,
319
- role: "menuitemcheckbox",
320
- "aria-checked": n,
321
- onClick: o,
322
- onKeyDown: c,
323
- tabIndex: 0,
324
- children: [
325
- /* @__PURE__ */ e("span", { className: N.switchLabel, children: t }),
326
- /* @__PURE__ */ e("div", { className: N.switchTrack, children: /* @__PURE__ */ e("div", { className: N.switchThumb, children: n ? /* @__PURE__ */ e(wt, { className: N.switchIcon }) : /* @__PURE__ */ e(Ct, { className: N.switchIcon }) }) })
327
- ]
328
- }
329
- );
330
- }
331
- function It() {
332
- const t = i(p);
333
- return t ? /* @__PURE__ */ e(
334
- ne,
335
- {
336
- label: "On Top",
337
- onClick: t.toggleCaptionPositionOnTop,
338
- checked: t.state.captionPositionOnTop
458
+ label: n("ON_TOP"),
459
+ onClick: e.toggleCaptionPositionOnTop,
460
+ checked: e.state.captionPositionOnTop
339
461
  }
340
462
  ) : null;
341
463
  }
342
- function xt() {
343
- const t = i(p);
344
- return t ? /* @__PURE__ */ e(
345
- ne,
464
+ function en() {
465
+ const e = u(f), { t: n } = p();
466
+ return e ? /* @__PURE__ */ t(
467
+ G,
346
468
  {
347
- label: "Invert Colors",
348
- onClick: t.toggleCaptionsInvertColors,
349
- checked: t.state.captionsInvertColors
469
+ label: n("INVERT_COLORS"),
470
+ onClick: e.toggleCaptionsInvertColors,
471
+ checked: e.state.captionsInvertColors
350
472
  }
351
473
  ) : null;
352
474
  }
353
- function Bt() {
354
- const t = i(b);
355
- return y(t == null ? void 0 : t.backToMain), t ? /* @__PURE__ */ a("div", { className: l.menuContainer, children: [
356
- /* @__PURE__ */ a(
475
+ function tn() {
476
+ const e = u(C), { t: n } = p();
477
+ return I(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ s("div", { className: r.menuContainer, children: [
478
+ /* @__PURE__ */ s(
357
479
  "button",
358
480
  {
359
481
  type: "button",
360
- className: l.menuBackButton,
361
- onClick: t.backToMain,
482
+ className: r.menuBackButton,
483
+ onClick: e.backToMain,
362
484
  children: [
363
- /* @__PURE__ */ e(P, {}),
364
- /* @__PURE__ */ e("span", { children: "Back" })
485
+ /* @__PURE__ */ t(E, {}),
486
+ /* @__PURE__ */ t("span", { children: n("BACK") })
365
487
  ]
366
488
  }
367
489
  ),
368
- /* @__PURE__ */ e("strong", { className: l.menuHeading, children: "Captions" }),
369
- /* @__PURE__ */ e(gt, {}),
370
- /* @__PURE__ */ e(kt, {}),
371
- /* @__PURE__ */ e(It, {}),
372
- /* @__PURE__ */ e(xt, {})
490
+ /* @__PURE__ */ t("strong", { className: r.menuHeading, children: n("CAPTIONS") }),
491
+ /* @__PURE__ */ t(Yt, {}),
492
+ /* @__PURE__ */ t(Jt, {}),
493
+ /* @__PURE__ */ t(Xt, {}),
494
+ /* @__PURE__ */ t(en, {})
373
495
  ] }) : null;
374
496
  }
375
- function Ht() {
376
- const t = i(b), n = pe();
377
- return y(t == null ? void 0 : t.backToCaptions), t ? /* @__PURE__ */ a("div", { className: l.menuContainer, children: [
378
- /* @__PURE__ */ a(
497
+ function nn() {
498
+ const e = u(C), n = Ne(), { t: o } = p();
499
+ return I(e == null ? void 0 : e.backToCaptions), e ? /* @__PURE__ */ s("div", { className: r.menuContainer, children: [
500
+ /* @__PURE__ */ s(
379
501
  "button",
380
502
  {
381
503
  type: "button",
382
- className: l.menuBackButton,
383
- onClick: t.backToCaptions,
504
+ className: r.menuBackButton,
505
+ onClick: e.backToCaptions,
384
506
  children: [
385
- /* @__PURE__ */ e(P, {}),
386
- /* @__PURE__ */ e("span", { children: "Back" })
507
+ /* @__PURE__ */ t(E, {}),
508
+ /* @__PURE__ */ t("span", { children: o("BACK") })
387
509
  ]
388
510
  }
389
511
  ),
390
- /* @__PURE__ */ e("strong", { className: l.menuHeading, children: "Captions" }),
391
- /* @__PURE__ */ e("div", { role: "menu", className: l.menuOptions, children: n.map(({ value: o, label: c, select: s, selected: r }) => /* @__PURE__ */ a(
512
+ /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
513
+ /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: a, label: c, select: i, selected: l }) => /* @__PURE__ */ s(
392
514
  "button",
393
515
  {
394
516
  type: "button",
395
517
  role: "menuitemradio",
396
- "aria-checked": r,
518
+ "aria-checked": l,
397
519
  onClick: () => {
398
- s(), t.backToMain(), t.toggle();
520
+ i(), e.backToMain(), e.toggle();
399
521
  },
400
- className: l.menuItem,
522
+ className: r.menuItem,
401
523
  children: [
402
- /* @__PURE__ */ e(q, { className: l.checkIcon }),
403
- /* @__PURE__ */ e("span", { className: l.menuItemLabel, children: c })
524
+ /* @__PURE__ */ t(D, { className: r.checkIcon }),
525
+ /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: c })
404
526
  ]
405
527
  },
406
- o
528
+ a
407
529
  )) })
408
530
  ] }) : null;
409
531
  }
410
- function Vt() {
411
- const t = i(p), n = i(b);
412
- return y(n == null ? void 0 : n.backToCaptions), t && n ? /* @__PURE__ */ a("div", { className: l.menuContainer, children: [
413
- /* @__PURE__ */ a(
532
+ function on() {
533
+ const e = u(f), n = u(C), { t: o } = p();
534
+ return I(n == null ? void 0 : n.backToCaptions), e && n ? /* @__PURE__ */ s("div", { className: r.menuContainer, children: [
535
+ /* @__PURE__ */ s(
414
536
  "button",
415
537
  {
416
538
  type: "button",
417
- className: l.menuBackButton,
539
+ className: r.menuBackButton,
418
540
  onClick: n.backToCaptions,
419
541
  children: [
420
- /* @__PURE__ */ e(P, {}),
421
- /* @__PURE__ */ e("span", { children: "Back" })
542
+ /* @__PURE__ */ t(E, {}),
543
+ /* @__PURE__ */ t("span", { children: o("BACK") })
422
544
  ]
423
545
  }
424
546
  ),
425
- /* @__PURE__ */ e("strong", { className: l.menuHeading, children: "Captions" }),
426
- /* @__PURE__ */ e("div", { role: "menu", className: l.menuOptions, children: rt.map((o) => /* @__PURE__ */ a(
547
+ /* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
548
+ /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: et.map((a) => /* @__PURE__ */ s(
427
549
  "button",
428
550
  {
429
551
  type: "button",
430
552
  role: "menuitemradio",
431
- "aria-checked": o.value === t.state.captionsFontSizeMultiplier.value,
553
+ "aria-checked": a === e.state.captionsFontSizeMultiplier,
432
554
  onClick: () => {
433
- t.setCaptionsFontSizeMultiplier(o), n.backToMain(), n.toggle();
555
+ e.setCaptionsFontSizeMultiplier(a), n.backToMain(), n.toggle();
434
556
  },
435
- className: l.menuItem,
557
+ className: r.menuItem,
436
558
  children: [
437
- /* @__PURE__ */ e(q, { className: l.checkIcon }),
438
- /* @__PURE__ */ e("span", { className: l.menuItemLabel, children: o.label })
559
+ /* @__PURE__ */ t(D, { className: r.checkIcon }),
560
+ /* @__PURE__ */ s("span", { className: r.menuItemLabel, children: [
561
+ a * 100,
562
+ "%"
563
+ ] })
439
564
  ]
440
565
  },
441
- o.label
566
+ a
442
567
  )) })
443
568
  ] }) : null;
444
569
  }
445
- function Tt() {
446
- const t = i(b), n = be({ sort: "descending" }), o = m("autoQuality");
447
- return y(t == null ? void 0 : t.backToMain), t ? /* @__PURE__ */ a("div", { className: l.menuContainer, children: [
448
- /* @__PURE__ */ a(
570
+ function an() {
571
+ const e = u(C), n = Te({ sort: "descending" }), o = h("autoQuality"), { t: a } = p();
572
+ return I(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ s("div", { className: r.menuContainer, children: [
573
+ /* @__PURE__ */ s(
449
574
  "button",
450
575
  {
451
576
  type: "button",
452
- className: l.menuBackButton,
453
- onClick: t.backToMain,
577
+ className: r.menuBackButton,
578
+ onClick: e.backToMain,
454
579
  children: [
455
- /* @__PURE__ */ e(P, {}),
456
- /* @__PURE__ */ e("span", { children: "Back" })
580
+ /* @__PURE__ */ t(E, {}),
581
+ /* @__PURE__ */ t("span", { children: a("BACK") })
457
582
  ]
458
583
  }
459
584
  ),
460
- /* @__PURE__ */ e("strong", { className: l.menuHeading, children: "Quality" }),
461
- /* @__PURE__ */ e("div", { role: "menu", className: l.menuOptions, children: n.map(({ value: c, label: s, select: r, selected: d }) => /* @__PURE__ */ a(
585
+ /* @__PURE__ */ t("strong", { className: r.menuHeading, children: a("QUALITY") }),
586
+ /* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: c, label: i, select: l, selected: g }) => /* @__PURE__ */ s(
462
587
  "button",
463
588
  {
464
589
  type: "button",
465
590
  role: "menuitemradio",
466
- "aria-checked": c === "auto" && o || d && !o,
591
+ "aria-checked": c === "auto" && o || g && !o,
467
592
  onClick: () => {
468
- r(), t.backToMain(), t.toggle();
593
+ l(), e.backToMain(), e.toggle();
469
594
  },
470
- className: l.menuItem,
595
+ className: r.menuItem,
471
596
  children: [
472
- /* @__PURE__ */ e(q, { className: l.checkIcon }),
473
- /* @__PURE__ */ e("span", { className: l.menuItemLabel, children: s })
597
+ /* @__PURE__ */ t(D, { className: r.checkIcon }),
598
+ /* @__PURE__ */ t("span", { className: r.menuItemLabel, children: i })
474
599
  ]
475
600
  },
476
601
  c
477
602
  )) })
478
603
  ] }) : null;
479
604
  }
480
- const Pt = {
481
- main: it,
482
- speed: ft,
483
- captions: Bt,
484
- captionLanguage: Ht,
485
- captionFontSize: Vt,
486
- quality: Tt
605
+ const sn = {
606
+ main: $t,
607
+ speed: Qt,
608
+ captions: tn,
609
+ captionLanguage: nn,
610
+ captionFontSize: on,
611
+ quality: an
487
612
  };
488
- function St() {
489
- const [t, n] = v("main"), [o, c] = v(!1), s = u(() => {
490
- c((x) => !x);
491
- }, []), r = u((x) => {
492
- n(x);
493
- }, []), d = u(() => {
613
+ function cn() {
614
+ const [e, n] = T("main"), [o, a] = T(!1), c = m(() => {
615
+ a((R) => !R);
616
+ }, []), i = m((R) => {
617
+ n(R);
618
+ }, []), l = m(() => {
494
619
  n("captions");
495
- }, []), f = u(() => {
620
+ }, []), g = m(() => {
496
621
  n("main");
497
- }, []), g = Y(() => Pt[t], [t]), h = ye(null), { refs: C, floatingStyles: L, context: k } = Le({
622
+ }, []), b = K(() => sn[e], [e]), k = Ce(null), { refs: y, floatingStyles: N, context: d } = xe({
498
623
  open: o,
499
- onOpenChange: (x) => {
500
- c(x), f();
624
+ onOpenChange: (R) => {
625
+ a(R), g();
501
626
  },
502
627
  placement: "top-end",
503
- whileElementsMounted: Me,
628
+ whileElementsMounted: Ae,
504
629
  middleware: [
505
- Ne(),
506
- Ie({
507
- element: h
630
+ Ee(),
631
+ Oe({
632
+ element: k
508
633
  })
509
634
  ]
510
- }), ie = xe(k, { escapeKey: !1 }), { getReferenceProps: re, getFloatingProps: de } = Be([ie]);
635
+ }), _ = Fe(d, { escapeKey: !1 }), { getReferenceProps: ge, getFloatingProps: fe } = Ze([_]);
511
636
  return {
512
- Page: g,
637
+ Page: b,
513
638
  open: o,
514
- toggle: s,
515
- setPage: r,
516
- backToCaptions: d,
517
- backToMain: f,
518
- arrowRef: h,
519
- refs: C,
520
- floatingStyles: L,
521
- context: k,
522
- getReferenceProps: re,
523
- getFloatingProps: de
639
+ toggle: c,
640
+ setPage: i,
641
+ backToCaptions: l,
642
+ backToMain: g,
643
+ arrowRef: k,
644
+ refs: y,
645
+ floatingStyles: N,
646
+ context: d,
647
+ getReferenceProps: ge,
648
+ getFloatingProps: fe
524
649
  };
525
650
  }
526
- const Rt = "_settings-menu_hxlsv_1", Ft = "_arrow_hxlsv_15", K = {
651
+ const ln = "_settings-menu_hxlsv_1", rn = "_arrow_hxlsv_15", J = {
527
652
  "settings-menu": "_settings-menu_hxlsv_1",
528
- settingsMenu: Rt,
529
- arrow: Ft
653
+ settingsMenu: ln,
654
+ arrow: rn
530
655
  };
531
- function qt() {
656
+ function un() {
532
657
  const {
533
- Page: t,
658
+ Page: e,
534
659
  arrowRef: n,
535
660
  backToCaptions: o,
536
- backToMain: c,
537
- context: s,
538
- floatingStyles: r,
539
- getFloatingProps: d,
540
- getReferenceProps: f,
541
- open: g,
542
- refs: h,
543
- setPage: C,
544
- toggle: L
545
- } = St(), k = i(p);
546
- return /* @__PURE__ */ a(Q, { children: [
547
- /* @__PURE__ */ e(
661
+ backToMain: a,
662
+ context: c,
663
+ floatingStyles: i,
664
+ getFloatingProps: l,
665
+ getReferenceProps: g,
666
+ open: b,
667
+ refs: k,
668
+ setPage: y,
669
+ toggle: N
670
+ } = cn(), d = u(f), { t: _ } = p();
671
+ return /* @__PURE__ */ s(oe, { children: [
672
+ /* @__PURE__ */ t(
548
673
  "button",
549
674
  {
550
- ref: h.setReference,
675
+ ref: k.setReference,
551
676
  type: "button",
552
677
  className: "controls-button",
553
- "aria-label": "Settings",
554
- onClick: L,
555
- "aria-expanded": g,
556
- tabIndex: k != null && k.state.interactionsDisabled ? -1 : 0,
557
- ...f(),
558
- children: /* @__PURE__ */ e(We, { className: "controls-button-icon icon-rotate" })
678
+ "aria-label": _("SETTINGS"),
679
+ onClick: N,
680
+ "aria-expanded": b,
681
+ tabIndex: d != null && d.state.interactionsDisabled ? -1 : 0,
682
+ ...g(),
683
+ children: /* @__PURE__ */ t(vt, { className: "controls-button-icon icon-rotate" })
559
684
  }
560
685
  ),
561
- g && /* @__PURE__ */ e(He, { context: s, initialFocus: -1, modal: !1, children: /* @__PURE__ */ a(
686
+ b && /* @__PURE__ */ t(Ke, { context: c, initialFocus: -1, modal: !1, children: /* @__PURE__ */ s(
562
687
  "div",
563
688
  {
564
- className: K.settingsMenu,
565
- ref: h.setFloating,
566
- style: r,
567
- ...d(),
689
+ className: J.settingsMenu,
690
+ ref: k.setFloating,
691
+ style: i,
692
+ ...l(),
568
693
  children: [
569
- /* @__PURE__ */ e(
570
- b.Provider,
694
+ /* @__PURE__ */ t(
695
+ C.Provider,
571
696
  {
572
- value: { setPage: C, backToMain: c, backToCaptions: o, toggle: L },
573
- children: /* @__PURE__ */ e(t, {})
697
+ value: { setPage: y, backToMain: a, backToCaptions: o, toggle: N },
698
+ children: /* @__PURE__ */ t(e, {})
574
699
  }
575
700
  ),
576
- /* @__PURE__ */ e(
577
- Ve,
701
+ /* @__PURE__ */ t(
702
+ $e,
578
703
  {
579
704
  ref: n,
580
- context: s,
581
- className: K.arrow
705
+ context: c,
706
+ className: J.arrow
582
707
  }
583
708
  )
584
709
  ]
@@ -586,225 +711,225 @@ function qt() {
586
711
  ) })
587
712
  ] });
588
713
  }
589
- function oe(t, n = 1e3) {
714
+ function de(e, n = 1e3) {
590
715
  return function() {
591
- const c = m("lastKeyboardAction"), [s, r] = v(!1), d = u(() => r(!1), []);
592
- return G(() => {
593
- r(!!c);
594
- const f = setTimeout(d, n);
595
- return () => clearTimeout(f);
596
- }, [c, n]), s ? /* @__PURE__ */ e(t, {}) : null;
716
+ const a = h("lastKeyboardAction"), [c, i] = T(!1), l = m(() => i(!1), []);
717
+ return $(() => {
718
+ i(!!a);
719
+ const g = setTimeout(l, n);
720
+ return () => clearTimeout(g);
721
+ }, [a, n]), c ? /* @__PURE__ */ t(e, {}) : null;
597
722
  };
598
723
  }
599
- const O = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), z = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), ae = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), ce = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), se = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), Zt = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), jt = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), $t = "_feedback-overlay_v4lbu_1", Ot = "_feedback-message_v4lbu_14", zt = "_feedback-icon_v4lbu_30", At = "_feedback-icon-animation_v4lbu_1", _ = {
724
+ const W = (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" }) }), q = (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" }) }), me = (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" }) }), 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 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" }) }), _e = (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" }) }), dn = (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" }) }), mn = (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" }) }), hn = "_feedback-overlay_v4lbu_1", _n = "_feedback-message_v4lbu_14", pn = "_feedback-icon_v4lbu_30", gn = "_feedback-icon-animation_v4lbu_1", v = {
600
725
  "feedback-overlay": "_feedback-overlay_v4lbu_1",
601
- feedbackOverlay: $t,
726
+ feedbackOverlay: hn,
602
727
  "feedback-message": "_feedback-message_v4lbu_14",
603
- feedbackMessage: Ot,
728
+ feedbackMessage: _n,
604
729
  "feedback-icon": "_feedback-icon_v4lbu_30",
605
- feedbackIcon: zt,
730
+ feedbackIcon: pn,
606
731
  "feedback-icon-animation": "_feedback-icon-animation_v4lbu_1",
607
- feedbackIconAnimation: At
732
+ feedbackIconAnimation: gn
608
733
  };
609
- function Kt() {
734
+ function fn() {
610
735
  var o;
611
- const t = W();
612
- switch ((o = t.lastKeyboardAction) == null ? void 0 : o.action) {
736
+ const e = ce();
737
+ switch ((o = e.lastKeyboardAction) == null ? void 0 : o.action) {
613
738
  case "togglePaused":
614
- return /* @__PURE__ */ e("i", { className: _.feedbackIcon, children: t.paused ? /* @__PURE__ */ e(O, {}) : /* @__PURE__ */ e(z, {}) });
739
+ return /* @__PURE__ */ t("i", { className: v.feedbackIcon, children: e.paused ? /* @__PURE__ */ t(W, {}) : /* @__PURE__ */ t(q, {}) });
615
740
  case "toggleCaptions":
616
741
  case "nextCaptionLanguage":
617
742
  case "previousCaptionLanguage":
618
- return t.hasCaptions ? /* @__PURE__ */ e("i", { className: _.feedbackIcon, children: /* @__PURE__ */ e(te, {}) }) : null;
743
+ return e.hasCaptions ? /* @__PURE__ */ t("i", { className: v.feedbackIcon, children: /* @__PURE__ */ t(re, {}) }) : null;
619
744
  case "volumeUp":
620
745
  case "volumeDown":
621
746
  case "toggleMuted":
622
- return /* @__PURE__ */ e("i", { className: _.feedbackIcon, children: t.muted || t.volume === 0 ? /* @__PURE__ */ e(ae, {}) : t.volume >= 0.5 ? /* @__PURE__ */ e(se, {}) : /* @__PURE__ */ e(ce, {}) });
747
+ return /* @__PURE__ */ t("i", { className: v.feedbackIcon, children: e.muted || e.volume === 0 ? /* @__PURE__ */ t(me, {}) : e.volume >= 0.5 ? /* @__PURE__ */ t(_e, {}) : /* @__PURE__ */ t(he, {}) });
623
748
  case "seekForward":
624
749
  case "seekForward10":
625
- return /* @__PURE__ */ e("i", { className: _.feedbackIcon, children: /* @__PURE__ */ e(Zt, { className: "right" }) });
750
+ return /* @__PURE__ */ t("i", { className: v.feedbackIcon, children: /* @__PURE__ */ t(dn, { className: "right" }) });
626
751
  case "seekBackward":
627
752
  case "seekBackward10":
628
- return /* @__PURE__ */ e("i", { className: _.feedbackIcon, children: /* @__PURE__ */ e(jt, { className: "left" }) });
753
+ return /* @__PURE__ */ t("i", { className: v.feedbackIcon, children: /* @__PURE__ */ t(mn, { className: "left" }) });
629
754
  default:
630
755
  return null;
631
756
  }
632
757
  }
633
- function Dt() {
634
- var o;
635
- const t = W();
636
- switch ((o = t.lastKeyboardAction) == null ? void 0 : o.action) {
758
+ function bn() {
759
+ var a;
760
+ const { t: e } = p(), n = ce();
761
+ switch ((a = n.lastKeyboardAction) == null ? void 0 : a.action) {
637
762
  case "toggleCaptions":
638
763
  case "nextCaptionLanguage":
639
764
  case "previousCaptionLanguage":
640
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: t.textTrack ? `Caption Language: ${t.textTrack.label}` : "Captions: Off" });
765
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: n.textTrack ? e("CAPTION_LANGUAGE", { language: n.textTrack.label }) : `${e("CAPTIONS")}: ${e("OFF")}` });
641
766
  case "volumeUp":
642
767
  case "volumeDown":
643
768
  case "toggleMuted":
644
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: t.muted || t.volume === 0 ? "Muted" : `Volume: ${(t.volume * 100).toFixed(0)}%` });
769
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: n.muted || n.volume === 0 ? e("MUTED") : e("VOLUME", { volume: (n.volume * 100).toFixed(0) }) });
645
770
  case "increasePlaybackRate":
646
771
  case "decreasePlaybackRate":
647
772
  case "resetPlaybackRate":
648
- return /* @__PURE__ */ a("div", { className: _.feedbackMessage, children: [
649
- "Playback speed: ",
650
- t.playbackRate,
651
- "x"
652
- ] });
773
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: e("PLAYBACK_SPEED_MESSAGE", { speed: n.playbackRate }) });
653
774
  case "seekForward":
654
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: "Seek forward: 5 seconds" });
775
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 5 }) });
655
776
  case "seekForward10":
656
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: "Seek forward: 10 seconds" });
777
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: e("SEEK_FORWARD", { seconds: 10 }) });
657
778
  case "seekBackward":
658
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: "Seek backward: 5 seconds" });
779
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 5 }) });
659
780
  case "seekBackward10":
660
- return /* @__PURE__ */ e("div", { className: _.feedbackMessage, children: "Seek backward: 10 seconds" });
781
+ return /* @__PURE__ */ t("div", { className: v.feedbackMessage, children: e("SEEK_BACKWARD", { seconds: 10 }) });
661
782
  default:
662
783
  return null;
663
784
  }
664
785
  }
665
- const Et = oe(Kt, 500), Ut = oe(Dt, 1e3);
666
- function Qt() {
667
- return /* @__PURE__ */ a("div", { className: _.feedbackOverlay, children: [
668
- /* @__PURE__ */ e(Et, {}),
669
- /* @__PURE__ */ e(Ut, {})
786
+ const vn = de(fn, 500), Cn = de(bn, 1e3);
787
+ function kn() {
788
+ return /* @__PURE__ */ s("div", { className: v.feedbackOverlay, children: [
789
+ /* @__PURE__ */ t(vn, {}),
790
+ /* @__PURE__ */ t(Cn, {})
670
791
  ] });
671
792
  }
672
- const Wt = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), Jt = (t) => /* @__PURE__ */ e("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), Xt = "_full-screen-button_1xm32_2", Gt = {
793
+ const wn = (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" }) }), yn = (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" }) }), Ln = "_full-screen-button_1xm32_2", Nn = {
673
794
  "full-screen-button": "_full-screen-button_1xm32_2",
674
- fullScreenButton: Xt
795
+ fullScreenButton: Ln
675
796
  };
676
- function Yt() {
677
- const t = m("fullscreen"), n = i(p);
678
- return n && !n.hideFullScreen ? /* @__PURE__ */ e(
679
- J,
797
+ function Tn() {
798
+ const e = h("fullscreen"), n = u(f);
799
+ return n && !n.hideFullScreen ? /* @__PURE__ */ t(
800
+ ie,
680
801
  {
681
802
  tabIndex: n != null && n.state.interactionsDisabled ? -1 : 0,
682
- className: `controls-button ${Gt.fullScreenButton}`,
683
- children: t ? /* @__PURE__ */ e(Jt, { className: "controls-button-icon" }) : /* @__PURE__ */ e(Wt, { className: "controls-button-icon" })
803
+ className: `controls-button ${Nn.fullScreenButton}`,
804
+ children: e ? /* @__PURE__ */ t(yn, { className: "controls-button-icon" }) : /* @__PURE__ */ t(wn, { className: "controls-button-icon" })
684
805
  }
685
806
  ) : null;
686
807
  }
687
- const en = "_gestures-container_1fn3b_1", tn = "_gesture_1fn3b_1", D = {
808
+ const Mn = "_gestures-container_1fn3b_1", In = "_gesture_1fn3b_1", X = {
688
809
  "gestures-container": "_gestures-container_1fn3b_1",
689
- gesturesContainer: en,
690
- gesture: tn
810
+ gesturesContainer: Mn,
811
+ gesture: In
691
812
  };
692
- function nn() {
693
- const t = $(), n = () => {
694
- t.togglePaused();
813
+ function Sn() {
814
+ const e = z(), n = () => {
815
+ e.togglePaused();
695
816
  };
696
- return /* @__PURE__ */ e("div", { className: D.gesturesContainer, children: /* @__PURE__ */ e("div", { "aria-hidden": !0, className: D.gesture, onClick: n }) });
817
+ return /* @__PURE__ */ t("div", { className: X.gesturesContainer, children: /* @__PURE__ */ t("div", { "aria-hidden": !0, className: X.gesture, onClick: n }) });
697
818
  }
698
- const on = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), le = (t) => /* @__PURE__ */ e("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t, children: /* @__PURE__ */ e("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" }) }), an = "_keyboard-shortcuts-overlay_uwwbr_1", cn = "_keyboard-shortcuts-button_uwwbr_67", sn = "_close-button_uwwbr_91", j = {
699
- "keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_uwwbr_1",
700
- keyboardShortcutsOverlay: an,
701
- "keyboard-shortcuts-button": "_keyboard-shortcuts-button_uwwbr_67",
702
- keyboardShortcutsButton: cn,
703
- "close-button": "_close-button_uwwbr_91",
704
- closeButton: sn
819
+ const Pn = (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" }) }), pe = (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" }) }), Bn = "_keyboard-shortcuts-overlay_y5kv6_1", Rn = "_keyboard-shortcuts-button_y5kv6_67", Hn = "_close-button_y5kv6_93", U = {
820
+ "keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_y5kv6_1",
821
+ keyboardShortcutsOverlay: Bn,
822
+ "keyboard-shortcuts-button": "_keyboard-shortcuts-button_y5kv6_67",
823
+ keyboardShortcutsButton: Rn,
824
+ "close-button": "_close-button_y5kv6_93",
825
+ closeButton: Hn
705
826
  };
706
- function ln({ onClose: t }) {
707
- y(t);
708
- const n = (o) => {
709
- o && o.focus();
827
+ function Vn({ onClose: e }) {
828
+ const { t: n } = p();
829
+ I(e);
830
+ const o = (a) => {
831
+ a && a.focus();
710
832
  };
711
- return /* @__PURE__ */ a(
833
+ return /* @__PURE__ */ s(
712
834
  "div",
713
835
  {
714
- className: j.keyboardShortcutsOverlay,
836
+ className: U.keyboardShortcutsOverlay,
715
837
  tabIndex: 0,
716
- ref: n,
838
+ ref: o,
717
839
  children: [
718
- /* @__PURE__ */ a("header", { children: [
719
- /* @__PURE__ */ e("h2", { children: "Keyboard Shortcuts" }),
720
- /* @__PURE__ */ e(
840
+ /* @__PURE__ */ s("header", { children: [
841
+ /* @__PURE__ */ t("h2", { children: n("KEYBOARD_SHORTCUTS") }),
842
+ /* @__PURE__ */ t(
721
843
  "button",
722
844
  {
723
845
  type: "button",
724
- className: j.closeButton,
725
- onClick: t,
726
- "aria-label": "Close",
727
- children: /* @__PURE__ */ e(le, {})
846
+ className: U.closeButton,
847
+ onClick: e,
848
+ "aria-label": n("CLOSE"),
849
+ children: /* @__PURE__ */ t(pe, {})
728
850
  }
729
851
  )
730
852
  ] }),
731
- /* @__PURE__ */ a("table", { children: [
732
- /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ a("tr", { children: [
733
- /* @__PURE__ */ e("th", { children: "Action" }),
734
- /* @__PURE__ */ e("th", { children: "Key" })
853
+ /* @__PURE__ */ s("table", { children: [
854
+ /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ s("tr", { children: [
855
+ /* @__PURE__ */ t("th", { children: n("ACTION") }),
856
+ /* @__PURE__ */ t("th", { children: n("SHORTCUT") })
735
857
  ] }) }),
736
- /* @__PURE__ */ a("tbody", { children: [
737
- /* @__PURE__ */ a("tr", { children: [
738
- /* @__PURE__ */ e("td", { children: "Seek back 5 sec" }),
739
- /* @__PURE__ */ e("td", { children: "Left Arrow" })
858
+ /* @__PURE__ */ s("tbody", { children: [
859
+ /* @__PURE__ */ s("tr", { children: [
860
+ /* @__PURE__ */ t("td", { children: n("SEEK_BACKWARD", { seconds: 5 }) }),
861
+ /* @__PURE__ */ t("td", { children: n("LEFT_ARROW") })
740
862
  ] }),
741
- /* @__PURE__ */ a("tr", { children: [
742
- /* @__PURE__ */ e("td", { children: "Seek forward 5 sec" }),
743
- /* @__PURE__ */ e("td", { children: "Right Arrow" })
863
+ /* @__PURE__ */ s("tr", { children: [
864
+ /* @__PURE__ */ t("td", { children: n("SEEK_FORWARD", { seconds: 5 }) }),
865
+ /* @__PURE__ */ t("td", { children: n("RIGHT_ARROW") })
744
866
  ] }),
745
- /* @__PURE__ */ a("tr", { children: [
746
- /* @__PURE__ */ e("td", { children: "Seek back 10 sec" }),
747
- /* @__PURE__ */ e("td", { children: "J" })
867
+ /* @__PURE__ */ s("tr", { children: [
868
+ /* @__PURE__ */ t("td", { children: n("SEEK_BACKWARD", { seconds: 10 }) }),
869
+ /* @__PURE__ */ t("td", { children: "J" })
748
870
  ] }),
749
- /* @__PURE__ */ a("tr", { children: [
750
- /* @__PURE__ */ e("td", { children: "Seek forward 10 sec" }),
751
- /* @__PURE__ */ e("td", { children: "L" })
871
+ /* @__PURE__ */ s("tr", { children: [
872
+ /* @__PURE__ */ t("td", { children: n("SEEK_FORWARD", { seconds: 10 }) }),
873
+ /* @__PURE__ */ t("td", { children: "L" })
752
874
  ] }),
753
- /* @__PURE__ */ a("tr", { children: [
754
- /* @__PURE__ */ e("td", { children: "Increase volume by 5%" }),
755
- /* @__PURE__ */ e("td", { children: "Up Arrow" })
875
+ /* @__PURE__ */ s("tr", { children: [
876
+ /* @__PURE__ */ t("td", { children: n("INCREASE_VOLUME", { percent: 5 }) }),
877
+ /* @__PURE__ */ t("td", { children: n("UP_ARROW") })
756
878
  ] }),
757
- /* @__PURE__ */ a("tr", { children: [
758
- /* @__PURE__ */ e("td", { children: "Decrease volume by 5%" }),
759
- /* @__PURE__ */ e("td", { children: "Down Arrow" })
879
+ /* @__PURE__ */ s("tr", { children: [
880
+ /* @__PURE__ */ t("td", { children: n("DECREASE_VOLUME", { percent: 5 }) }),
881
+ /* @__PURE__ */ t("td", { children: n("DOWN_ARROW") })
760
882
  ] }),
761
- /* @__PURE__ */ a("tr", { children: [
762
- /* @__PURE__ */ e("td", { children: "Toggle mute" }),
763
- /* @__PURE__ */ e("td", { children: "M" })
883
+ /* @__PURE__ */ s("tr", { children: [
884
+ /* @__PURE__ */ t("td", { children: n("TOGGLE_MUTED") }),
885
+ /* @__PURE__ */ t("td", { children: "M" })
764
886
  ] }),
765
- /* @__PURE__ */ a("tr", { children: [
766
- /* @__PURE__ */ e("td", { children: "Toggle play/pause" }),
767
- /* @__PURE__ */ e("td", { children: "Space, K" })
887
+ /* @__PURE__ */ s("tr", { children: [
888
+ /* @__PURE__ */ t("td", { children: n("TOGGLE_PLAY_PAUSE") }),
889
+ /* @__PURE__ */ s("td", { children: [
890
+ n("SPACE"),
891
+ ", K"
892
+ ] })
768
893
  ] }),
769
- /* @__PURE__ */ a("tr", { children: [
770
- /* @__PURE__ */ e("td", { children: "Enter full screen" }),
771
- /* @__PURE__ */ e("td", { children: "F" })
894
+ /* @__PURE__ */ s("tr", { children: [
895
+ /* @__PURE__ */ t("td", { children: n("ENTER_FULLSCREEN") }),
896
+ /* @__PURE__ */ t("td", { children: "F" })
772
897
  ] }),
773
- /* @__PURE__ */ a("tr", { children: [
774
- /* @__PURE__ */ e("td", { children: "Exit full screen" }),
775
- /* @__PURE__ */ e("td", { children: "Esc, F" })
898
+ /* @__PURE__ */ s("tr", { children: [
899
+ /* @__PURE__ */ t("td", { children: n("EXIT_FULLSCREEN") }),
900
+ /* @__PURE__ */ t("td", { children: "Esc, F" })
776
901
  ] }),
777
- /* @__PURE__ */ a("tr", { children: [
778
- /* @__PURE__ */ e("td", { children: "Toggle captions" }),
779
- /* @__PURE__ */ e("td", { children: "C" })
902
+ /* @__PURE__ */ s("tr", { children: [
903
+ /* @__PURE__ */ t("td", { children: n("TOGGLE_CAPTIONS") }),
904
+ /* @__PURE__ */ t("td", { children: "C" })
780
905
  ] }),
781
- /* @__PURE__ */ a("tr", { children: [
782
- /* @__PURE__ */ e("td", { children: "Next caption language" }),
783
- /* @__PURE__ */ e("td", { children: "V" })
906
+ /* @__PURE__ */ s("tr", { children: [
907
+ /* @__PURE__ */ t("td", { children: n("NEXT_CAPTION_LANGUAGE") }),
908
+ /* @__PURE__ */ t("td", { children: "V" })
784
909
  ] }),
785
- /* @__PURE__ */ a("tr", { children: [
786
- /* @__PURE__ */ e("td", { children: "Previous caption language" }),
787
- /* @__PURE__ */ e("td", { children: "X" })
910
+ /* @__PURE__ */ s("tr", { children: [
911
+ /* @__PURE__ */ t("td", { children: n("PREVIOUS_CAPTION_LANGUAGE") }),
912
+ /* @__PURE__ */ t("td", { children: "X" })
788
913
  ] }),
789
- /* @__PURE__ */ a("tr", { children: [
790
- /* @__PURE__ */ e("td", { children: "Decrease playback speed" }),
791
- /* @__PURE__ */ e("td", { children: "A" })
914
+ /* @__PURE__ */ s("tr", { children: [
915
+ /* @__PURE__ */ t("td", { children: n("DECREASE_PLAYBACK_SPEED") }),
916
+ /* @__PURE__ */ t("td", { children: "A" })
792
917
  ] }),
793
- /* @__PURE__ */ a("tr", { children: [
794
- /* @__PURE__ */ e("td", { children: "Reset playback speed to 1x" }),
795
- /* @__PURE__ */ e("td", { children: "S" })
918
+ /* @__PURE__ */ s("tr", { children: [
919
+ /* @__PURE__ */ t("td", { children: n("RESET_PLAYBACK_SPEED") }),
920
+ /* @__PURE__ */ t("td", { children: "S" })
796
921
  ] }),
797
- /* @__PURE__ */ a("tr", { children: [
798
- /* @__PURE__ */ e("td", { children: "Increase playback speed" }),
799
- /* @__PURE__ */ e("td", { children: "D" })
922
+ /* @__PURE__ */ s("tr", { children: [
923
+ /* @__PURE__ */ t("td", { children: n("INCREASE_PLAYBACK_SPEED") }),
924
+ /* @__PURE__ */ t("td", { children: "D" })
800
925
  ] }),
801
- /* @__PURE__ */ a("tr", { children: [
802
- /* @__PURE__ */ e("td", { children: "Jump to start" }),
803
- /* @__PURE__ */ e("td", { children: "0" })
926
+ /* @__PURE__ */ s("tr", { children: [
927
+ /* @__PURE__ */ t("td", { children: n("JUMP_TO_START") }),
928
+ /* @__PURE__ */ t("td", { children: "0" })
804
929
  ] }),
805
- /* @__PURE__ */ a("tr", { children: [
806
- /* @__PURE__ */ e("td", { children: "Jump to specific percentage (1-10%, 2-20%, etc)" }),
807
- /* @__PURE__ */ e("td", { children: "1-9" })
930
+ /* @__PURE__ */ s("tr", { children: [
931
+ /* @__PURE__ */ t("td", { children: n("JUMP_TO_PERCENTAGE") }),
932
+ /* @__PURE__ */ t("td", { children: "1-9" })
808
933
  ] })
809
934
  ] })
810
935
  ] })
@@ -812,152 +937,174 @@ function ln({ onClose: t }) {
812
937
  }
813
938
  );
814
939
  }
815
- function rn() {
816
- const [t, n] = v(!1), [o, c] = v(!1), [s, r] = v(!1), d = i(p), f = m("playing"), g = $(), h = u(() => {
817
- n(!0), d == null || d.disableInteractions(), f && (r(!0), g.pause());
818
- }, [f, g, d]), C = u(() => {
819
- n(!1), c(!0), d == null || d.enableInteractions(), s && (r(!1), g.play());
820
- }, [s, g, d]), L = u(
821
- (k) => o && (k == null ? void 0 : k.focus()),
940
+ function xn() {
941
+ const [e, n] = T(!1), [o, a] = T(!1), [c, i] = T(!1), l = u(f), g = h("playing"), b = z(), { t: k } = p(), y = m(() => {
942
+ n(!0), l == null || l.disableInteractions(), g && (i(!0), b.pause());
943
+ }, [g, b, l]), N = m(() => {
944
+ n(!1), a(!0), l == null || l.enableInteractions(), c && (i(!1), b.play());
945
+ }, [c, b, l]), d = m(
946
+ (_) => o && (_ == null ? void 0 : _.focus()),
822
947
  [o]
823
948
  );
824
- return t ? /* @__PURE__ */ e(ln, { onClose: C }) : /* @__PURE__ */ e(
949
+ return e ? /* @__PURE__ */ t(Vn, { onClose: N }) : /* @__PURE__ */ t(
825
950
  "button",
826
951
  {
827
- ref: L,
828
- "aria-label": "Keyboard shortcuts",
952
+ ref: d,
953
+ "aria-label": k("KEYBOARD_SHORTCUTS"),
829
954
  type: "button",
830
- className: j.keyboardShortcutsButton,
831
- onClick: h,
955
+ className: U.keyboardShortcutsButton,
956
+ onClick: y,
832
957
  tabIndex: 0,
833
- children: /* @__PURE__ */ e(on, {})
958
+ children: /* @__PURE__ */ t(Pn, {})
834
959
  }
835
960
  );
836
961
  }
837
- const dn = "_play-pause-button_kyuc5_1", un = {
962
+ const An = "_play-pause-button_kyuc5_1", En = {
838
963
  "play-pause-button": "_play-pause-button_kyuc5_1",
839
- playPauseButton: dn
964
+ playPauseButton: An
840
965
  };
841
- function hn() {
842
- const t = fe(), n = i(p), o = m("paused");
843
- return t ? /* @__PURE__ */ e(
844
- ge,
966
+ function On() {
967
+ const e = se(), n = u(f), o = h("paused");
968
+ return e ? /* @__PURE__ */ t(
969
+ Me,
845
970
  {
846
971
  tabIndex: n != null && n.state.interactionsDisabled ? -1 : 0,
847
- className: `${un.playPauseButton} controls-button`,
848
- onKeyDown: (c) => {
849
- c.key === " " && (t == null || t.$state.lastKeyboardAction.set({
972
+ className: `${En.playPauseButton} controls-button`,
973
+ onKeyDown: (a) => {
974
+ a.key === " " && (e == null || e.$state.lastKeyboardAction.set({
850
975
  action: "togglePaused",
851
- event: c.nativeEvent
976
+ event: a.nativeEvent
852
977
  }));
853
978
  },
854
- children: o ? /* @__PURE__ */ e(z, { className: "controls-button-icon" }) : /* @__PURE__ */ e(O, { className: "controls-button-icon" })
979
+ children: o ? /* @__PURE__ */ t(q, { className: "controls-button-icon" }) : /* @__PURE__ */ t(W, { className: "controls-button-icon" })
855
980
  }
856
981
  ) : null;
857
982
  }
858
- const mn = "_poster_195hi_1", _n = {
859
- poster: mn
983
+ const Fn = "_poster_195hi_1", Zn = {
984
+ poster: Fn
860
985
  };
861
- function pn({ src: t }) {
862
- const n = m("source");
863
- return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ e(ke, { src: t, className: _n.poster });
986
+ function Kn({ src: e }) {
987
+ const n = h("source");
988
+ return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ t(Ie, { src: e, className: Zn.poster });
864
989
  }
865
- const bn = "_small-layout-overlay_38qhb_1", fn = "_small-layout-button_38qhb_14", gn = "_small-layout-icon-play_38qhb_24", kn = "_small-layout-icon-pause_38qhb_30", wn = "_full-screen-close-icon_38qhb_36", Cn = "_fade-out_38qhb_1", H = {
866
- "small-layout-overlay": "_small-layout-overlay_38qhb_1",
867
- smallLayoutOverlay: bn,
868
- "small-layout-button": "_small-layout-button_38qhb_14",
869
- smallLayoutButton: fn,
870
- "small-layout-icon-play": "_small-layout-icon-play_38qhb_24",
871
- smallLayoutIconPlay: gn,
872
- "small-layout-icon-pause": "_small-layout-icon-pause_38qhb_30",
873
- smallLayoutIconPause: kn,
874
- "full-screen-close-icon": "_full-screen-close-icon_38qhb_36",
875
- fullScreenCloseIcon: wn,
876
- "fade-out": "_fade-out_38qhb_1",
877
- fadeOut: Cn
990
+ const $n = "_small-layout-overlay_1vli4_1", Dn = "_small-layout-button_1vli4_14", jn = "_small-layout-icon-play_1vli4_24", Un = "_small-layout-icon-pause_1vli4_30", zn = "_full-screen-close-icon_1vli4_36", Gn = "_fade-out_1vli4_1", V = {
991
+ "small-layout-overlay": "_small-layout-overlay_1vli4_1",
992
+ smallLayoutOverlay: $n,
993
+ "small-layout-button": "_small-layout-button_1vli4_14",
994
+ smallLayoutButton: Dn,
995
+ "small-layout-icon-play": "_small-layout-icon-play_1vli4_24",
996
+ smallLayoutIconPlay: jn,
997
+ "small-layout-icon-pause": "_small-layout-icon-pause_1vli4_30",
998
+ smallLayoutIconPause: Un,
999
+ "full-screen-close-icon": "_full-screen-close-icon_1vli4_36",
1000
+ fullScreenCloseIcon: zn,
1001
+ "fade-out": "_fade-out_1vli4_1",
1002
+ fadeOut: Gn
878
1003
  };
879
- function vn() {
880
- return /* @__PURE__ */ a("div", { className: H.smallLayoutOverlay, children: [
881
- /* @__PURE__ */ e(J, { className: H.fullScreenCloseIcon, children: /* @__PURE__ */ e(le, {}) }),
882
- /* @__PURE__ */ a("i", { className: H.smallLayoutButton, children: [
883
- /* @__PURE__ */ e(z, { className: H.smallLayoutIconPlay }),
884
- /* @__PURE__ */ e(O, { className: H.smallLayoutIconPause })
1004
+ function Wn() {
1005
+ return /* @__PURE__ */ s("div", { className: V.smallLayoutOverlay, children: [
1006
+ /* @__PURE__ */ t(ie, { className: V.fullScreenCloseIcon, children: /* @__PURE__ */ t(pe, {}) }),
1007
+ /* @__PURE__ */ s("i", { className: V.smallLayoutButton, children: [
1008
+ /* @__PURE__ */ t(q, { className: V.smallLayoutIconPlay }),
1009
+ /* @__PURE__ */ t(W, { className: V.smallLayoutIconPause })
885
1010
  ] })
886
1011
  ] });
887
1012
  }
888
- const yn = "_time-indicator_1wsym_1", Ln = {
889
- "time-indicator": "_time-indicator_1wsym_1",
890
- timeIndicator: yn
1013
+ const qn = "_time-indicator_1ght2_1", Qn = {
1014
+ "time-indicator": "_time-indicator_1ght2_1",
1015
+ timeIndicator: qn
891
1016
  };
892
- function Mn() {
893
- return /* @__PURE__ */ a("div", { className: Ln.timeIndicator, children: [
894
- /* @__PURE__ */ e(A, { type: "current" }),
1017
+ function Yn() {
1018
+ return /* @__PURE__ */ s("div", { className: Qn.timeIndicator, children: [
1019
+ /* @__PURE__ */ t(Q, { type: "current" }),
895
1020
  "/",
896
- /* @__PURE__ */ e(A, { type: "duration" })
1021
+ /* @__PURE__ */ t(Q, { type: "duration" })
897
1022
  ] });
898
1023
  }
899
- const Nn = "_timeline-wrapper_j9z56_1", In = "_track_j9z56_8", xn = "_thumb_j9z56_19", Bn = "_root_j9z56_33", Hn = "_track-inner_j9z56_63", Vn = "_progress_j9z56_69", Tn = "_track-fill_j9z56_75", w = {
900
- "timeline-wrapper": "_timeline-wrapper_j9z56_1",
901
- timelineWrapper: Nn,
902
- track: In,
903
- thumb: xn,
904
- root: Bn,
905
- "track-inner": "_track-inner_j9z56_63",
906
- trackInner: Hn,
907
- progress: Vn,
908
- "track-fill": "_track-fill_j9z56_75",
909
- trackFill: Tn
910
- }, Pn = `${w.progress} ${w.trackInner}`, Sn = `${w.trackFill} ${w.trackInner}`;
911
- function E({ className: t }) {
912
- const n = i(p), o = t ? `${w.timelineWrapper} ${t}` : w.timelineWrapper;
913
- return /* @__PURE__ */ e("div", { className: o, children: /* @__PURE__ */ a(
914
- B.Root,
1024
+ const Jn = "_comment-markers_1xw2k_1", Xn = "_comment-marker_1xw2k_1", eo = "_timeline-wrapper_1xw2k_21", to = "_track_1xw2k_34", no = "_thumb_1xw2k_47", oo = "_root_1xw2k_61", ao = "_track-inner_1xw2k_91", so = "_progress_1xw2k_97", co = "_track-fill_1xw2k_103", w = {
1025
+ "comment-markers": "_comment-markers_1xw2k_1",
1026
+ commentMarkers: Jn,
1027
+ "comment-marker": "_comment-marker_1xw2k_1",
1028
+ commentMarker: Xn,
1029
+ "timeline-wrapper": "_timeline-wrapper_1xw2k_21",
1030
+ timelineWrapper: eo,
1031
+ track: to,
1032
+ thumb: no,
1033
+ root: oo,
1034
+ "track-inner": "_track-inner_1xw2k_91",
1035
+ trackInner: ao,
1036
+ progress: so,
1037
+ "track-fill": "_track-fill_1xw2k_103",
1038
+ trackFill: co
1039
+ };
1040
+ function io() {
1041
+ const e = u(f), n = h("duration");
1042
+ return e != null && e.hasComments && (e != null && e.state.commentsEnabled) ? /* @__PURE__ */ t("div", { className: w.commentMarkers, children: e.comments.map((o) => /* @__PURE__ */ t(
1043
+ "span",
915
1044
  {
916
- className: w.root,
917
- tabIndex: n != null && n.state.interactionsDisabled ? -1 : 0,
918
- children: [
919
- /* @__PURE__ */ a(B.Track, { className: w.track, children: [
920
- /* @__PURE__ */ e(B.Progress, { className: Pn }),
921
- /* @__PURE__ */ e(B.TrackFill, { className: Sn })
922
- ] }),
923
- /* @__PURE__ */ e(B.Thumb, { className: w.thumb })
924
- ]
925
- }
926
- ) });
1045
+ className: w.commentMarker,
1046
+ style: {
1047
+ left: `${o.timestamp / n * 100}%`,
1048
+ width: `${ue / n * 100}%`
1049
+ }
1050
+ },
1051
+ o.id
1052
+ )) }) : null;
1053
+ }
1054
+ const lo = `${w.progress} ${w.trackInner}`, ro = `${w.trackFill} ${w.trackInner}`;
1055
+ function ee({ className: e }) {
1056
+ const n = u(f), o = e ? `${w.timelineWrapper} ${e}` : w.timelineWrapper;
1057
+ return /* @__PURE__ */ s("div", { className: o, children: [
1058
+ /* @__PURE__ */ s(
1059
+ H.Root,
1060
+ {
1061
+ className: w.root,
1062
+ tabIndex: n != null && n.state.interactionsDisabled ? -1 : 0,
1063
+ children: [
1064
+ /* @__PURE__ */ s(H.Track, { className: w.track, children: [
1065
+ /* @__PURE__ */ t(H.Progress, { className: lo }),
1066
+ /* @__PURE__ */ t(H.TrackFill, { className: ro })
1067
+ ] }),
1068
+ /* @__PURE__ */ t(H.Thumb, { className: w.thumb })
1069
+ ]
1070
+ }
1071
+ ),
1072
+ /* @__PURE__ */ t(io, {})
1073
+ ] });
927
1074
  }
928
- const Rn = "_wrapper_d2nt6_1", Fn = "_track_d2nt6_6", qn = "_thumb_d2nt6_16", Zn = "_track-fill_d2nt6_30", jn = "_root_d2nt6_48", V = {
929
- wrapper: Rn,
930
- track: Fn,
931
- thumb: qn,
1075
+ const uo = "_wrapper_d2nt6_1", mo = "_track_d2nt6_6", ho = "_thumb_d2nt6_16", _o = "_track-fill_d2nt6_30", po = "_root_d2nt6_48", x = {
1076
+ wrapper: uo,
1077
+ track: mo,
1078
+ thumb: ho,
932
1079
  "track-fill": "_track-fill_d2nt6_30",
933
- trackFill: Zn,
934
- root: jn
1080
+ trackFill: _o,
1081
+ root: po
935
1082
  };
936
- function $n() {
937
- const t = m("volume"), n = m("muted"), o = i(p);
938
- return /* @__PURE__ */ a("div", { className: V.wrapper, children: [
939
- /* @__PURE__ */ e(
940
- we,
1083
+ function go() {
1084
+ const e = h("volume"), n = h("muted"), o = u(f);
1085
+ return /* @__PURE__ */ s("div", { className: x.wrapper, children: [
1086
+ /* @__PURE__ */ t(
1087
+ Se,
941
1088
  {
942
1089
  tabIndex: o != null && o.state.interactionsDisabled ? -1 : 0,
943
1090
  className: "controls-button",
944
- children: n || t == 0 ? /* @__PURE__ */ e(ae, { className: "controls-button-icon" }) : t < 0.5 ? /* @__PURE__ */ e(ce, { className: "controls-button-icon" }) : /* @__PURE__ */ e(se, { className: "controls-button-icon" })
1091
+ children: n || e == 0 ? /* @__PURE__ */ t(me, { className: "controls-button-icon" }) : e < 0.5 ? /* @__PURE__ */ t(he, { className: "controls-button-icon" }) : /* @__PURE__ */ t(_e, { className: "controls-button-icon" })
945
1092
  }
946
1093
  ),
947
- /* @__PURE__ */ a(
948
- S.Root,
1094
+ /* @__PURE__ */ s(
1095
+ O.Root,
949
1096
  {
950
- className: V.root,
1097
+ className: x.root,
951
1098
  tabIndex: o != null && o.state.interactionsDisabled ? -1 : 0,
952
1099
  children: [
953
- /* @__PURE__ */ e(S.Track, { className: V.track, children: /* @__PURE__ */ e(S.TrackFill, { className: V.trackFill }) }),
954
- /* @__PURE__ */ e(S.Thumb, { className: V.thumb })
1100
+ /* @__PURE__ */ t(O.Track, { className: x.track, children: /* @__PURE__ */ t(O.TrackFill, { className: x.trackFill }) }),
1101
+ /* @__PURE__ */ t(O.Thumb, { className: x.thumb })
955
1102
  ]
956
1103
  }
957
1104
  )
958
1105
  ] });
959
1106
  }
960
- const On = {}, U = {
1107
+ const te = {
961
1108
  togglePaused: ["Space", "Enter", "k"],
962
1109
  seekForward: ["ArrowRight"],
963
1110
  seekBackward: ["ArrowLeft"],
@@ -968,162 +1115,308 @@ const On = {}, U = {
968
1115
  toggleCaptions: ["c"],
969
1116
  nextCaptionLanguage: {
970
1117
  keys: ["v"],
971
- onKeyUp({ event: t, player: n, remote: o }) {
972
- const c = n.textTracks.selectedIndex, s = c + 1;
973
- o.changeTextTrackMode(c, "hidden"), o.changeTextTrackMode(
974
- s >= n.textTracks.length ? 0 : s,
1118
+ onKeyUp({ event: e, player: n, remote: o }) {
1119
+ const a = n.textTracks.selectedIndex, c = a + 1;
1120
+ o.changeTextTrackMode(a, "hidden"), o.changeTextTrackMode(
1121
+ c >= n.textTracks.length ? 0 : c,
975
1122
  "showing"
976
1123
  ), n.$state.lastKeyboardAction.set({
977
1124
  action: "nextCaptionLanguage",
978
- event: t
1125
+ event: e
979
1126
  });
980
1127
  }
981
1128
  },
982
1129
  previousCaptionLanguage: {
983
1130
  keys: ["x"],
984
- onKeyUp({ event: t, player: n, remote: o }) {
985
- const c = n.textTracks.selectedIndex, s = c - 1;
986
- o.changeTextTrackMode(c, "hidden"), o.changeTextTrackMode(
987
- s < 0 ? n.textTracks.length - 1 : s,
1131
+ onKeyUp({ event: e, player: n, remote: o }) {
1132
+ const a = n.textTracks.selectedIndex, c = a - 1;
1133
+ o.changeTextTrackMode(a, "hidden"), o.changeTextTrackMode(
1134
+ c < 0 ? n.textTracks.length - 1 : c,
988
1135
  "showing"
989
1136
  ), n.$state.lastKeyboardAction.set({
990
1137
  action: "previousCaptionLanguage",
991
- event: t
1138
+ event: e
992
1139
  });
993
1140
  }
994
1141
  },
995
1142
  decreasePlaybackRate: {
996
1143
  keys: ["a"],
997
- onKeyUp({ event: t, player: n, remote: o }) {
998
- const s = I.indexOf(n.playbackRate) - 1;
999
- s >= 0 && (o.changePlaybackRate(I[s]), n.$state.lastKeyboardAction.set({
1144
+ onKeyUp({ event: e, player: n, remote: o }) {
1145
+ const c = P.indexOf(n.playbackRate) - 1;
1146
+ c >= 0 && (o.changePlaybackRate(P[c]), n.$state.lastKeyboardAction.set({
1000
1147
  action: "decreasePlaybackRate",
1001
- event: t
1148
+ event: e
1002
1149
  }));
1003
1150
  }
1004
1151
  },
1005
1152
  increasePlaybackRate: {
1006
1153
  keys: ["d"],
1007
- onKeyUp({ event: t, player: n, remote: o }) {
1008
- const s = I.indexOf(n.playbackRate) + 1;
1009
- s < I.length && (o.changePlaybackRate(I[s]), n.$state.lastKeyboardAction.set({
1154
+ onKeyUp({ event: e, player: n, remote: o }) {
1155
+ const c = P.indexOf(n.playbackRate) + 1;
1156
+ c < P.length && (o.changePlaybackRate(P[c]), n.$state.lastKeyboardAction.set({
1010
1157
  action: "increasePlaybackRate",
1011
- event: t
1158
+ event: e
1012
1159
  }));
1013
1160
  }
1014
1161
  },
1015
1162
  resetPlaybackRate: {
1016
1163
  keys: ["s"],
1017
- onKeyUp({ event: t, player: n, remote: o }) {
1164
+ onKeyUp({ event: e, player: n, remote: o }) {
1018
1165
  o.changePlaybackRate(1), n.$state.lastKeyboardAction.set({
1019
1166
  action: "resetPlaybackRate",
1020
- event: t
1167
+ event: e
1021
1168
  });
1022
1169
  }
1023
1170
  },
1024
1171
  seekForward10Seconds: {
1025
1172
  keys: ["l"],
1026
- onKeyUp({ event: t, player: n, remote: o }) {
1173
+ onKeyUp({ event: e, player: n, remote: o }) {
1027
1174
  o.seek(n.currentTime + 10), n.$state.lastKeyboardAction.set({
1028
1175
  action: "seekForward10",
1029
- event: t
1176
+ event: e
1030
1177
  });
1031
1178
  }
1032
1179
  },
1033
1180
  seekBackward10Seconds: {
1034
1181
  keys: ["j"],
1035
- onKeyUp({ event: t, player: n, remote: o }) {
1182
+ onKeyUp({ event: e, player: n, remote: o }) {
1036
1183
  o.seek(n.currentTime - 10), n.$state.lastKeyboardAction.set({
1037
1184
  action: "seekBackward10",
1038
- event: t
1185
+ event: e
1039
1186
  });
1040
1187
  }
1041
1188
  }
1042
1189
  };
1043
- function zn({ hideFullScreen: t }) {
1044
- const [n, o] = v({
1045
- captionsFontSizeMultiplier: { label: "100%", value: 1 },
1046
- captionPositionOnTop: !1,
1047
- captionsInvertColors: !1,
1048
- interactionsDisabled: !1
1049
- }), c = u(
1050
- (h) => {
1051
- o((C) => ({
1052
- ...C,
1053
- captionsFontSizeMultiplier: h
1190
+ function fo(e, n = 1e3) {
1191
+ let o = !1;
1192
+ return () => {
1193
+ o || (e(), o = !0, setTimeout(() => {
1194
+ o = !1;
1195
+ }, n));
1196
+ };
1197
+ }
1198
+ const ne = {
1199
+ volume: 1,
1200
+ muted: !1,
1201
+ lang: null,
1202
+ captions: !1,
1203
+ rate: 1,
1204
+ multiplier: 1,
1205
+ ontop: !1,
1206
+ invert: !1,
1207
+ comments: !1
1208
+ };
1209
+ class bo {
1210
+ constructor() {
1211
+ L(this, "playerId", "studio-player");
1212
+ L(this, "mediaId", null);
1213
+ L(this, "data", ne);
1214
+ L(this, "time", null);
1215
+ L(this, "saveTime", () => {
1216
+ if (!this.mediaId) return;
1217
+ const n = (this.time ?? 0).toString();
1218
+ localStorage.setItem(this.mediaId, n);
1219
+ });
1220
+ L(this, "saveTimeThrottled", fo(this.saveTime, 1e3));
1221
+ // only used for useStudioPlayer hook's state initialization
1222
+ L(this, "initializeState", () => {
1223
+ const n = localStorage.getItem(this.playerId);
1224
+ if (n)
1225
+ try {
1226
+ this.data = JSON.parse(n);
1227
+ } catch {
1228
+ }
1229
+ return {
1230
+ captionsFontSizeMultiplier: this.data.multiplier,
1231
+ captionPositionOnTop: this.data.ontop,
1232
+ captionsInvertColors: this.data.invert,
1233
+ commentsEnabled: this.data.comments,
1234
+ interactionsDisabled: !1
1235
+ };
1236
+ });
1237
+ L(this, "saveData", (n, o) => {
1238
+ this.data = {
1239
+ ...this.data,
1240
+ [n]: o
1241
+ }, this.save();
1242
+ });
1243
+ }
1244
+ async getVideoQuality() {
1245
+ return null;
1246
+ }
1247
+ async getAudioGain() {
1248
+ return null;
1249
+ }
1250
+ async getLang() {
1251
+ return this.data.lang;
1252
+ }
1253
+ async setLang(n) {
1254
+ this.data.lang = n, this.save();
1255
+ }
1256
+ async getVolume() {
1257
+ return this.data.volume;
1258
+ }
1259
+ async setVolume(n) {
1260
+ this.data.volume = n, this.save();
1261
+ }
1262
+ async getMuted() {
1263
+ return this.data.muted;
1264
+ }
1265
+ async setMuted(n) {
1266
+ this.data.muted = n, this.save();
1267
+ }
1268
+ async getTime() {
1269
+ return this.time;
1270
+ }
1271
+ async setTime(n, o) {
1272
+ const a = n < 0;
1273
+ this.time = a ? null : n, a || o ? this.saveTime() : this.saveTimeThrottled();
1274
+ }
1275
+ async getCaptions() {
1276
+ return this.data.captions;
1277
+ }
1278
+ async setCaptions(n) {
1279
+ this.data.captions = n, this.save();
1280
+ }
1281
+ async getPlaybackRate() {
1282
+ return this.data.rate;
1283
+ }
1284
+ async setPlaybackRate(n) {
1285
+ this.data.rate = n, this.save();
1286
+ }
1287
+ onChange(n, o, a = "studio-player") {
1288
+ const c = a ? localStorage.getItem(a) : null, i = o ? localStorage.getItem(o) : null;
1289
+ this.playerId = a, this.mediaId = o;
1290
+ let l = {};
1291
+ if (c)
1292
+ try {
1293
+ l = JSON.parse(c);
1294
+ } catch {
1295
+ }
1296
+ this.data = {
1297
+ ...ne,
1298
+ ...l
1299
+ }, this.time = i ? +i : null;
1300
+ }
1301
+ save() {
1302
+ if (!this.playerId) return;
1303
+ const n = JSON.stringify(this.data);
1304
+ localStorage.setItem(this.playerId, n);
1305
+ }
1306
+ }
1307
+ function vo({
1308
+ hideFullScreen: e,
1309
+ comments: n
1310
+ }) {
1311
+ const o = K(() => new bo(), []), [a, c] = T(
1312
+ o.initializeState
1313
+ ), i = m(
1314
+ (d) => {
1315
+ c((_) => (o.saveData("multiplier", d), {
1316
+ ..._,
1317
+ captionsFontSizeMultiplier: d
1054
1318
  }));
1055
1319
  },
1056
- []
1057
- ), s = u(() => {
1058
- o((h) => ({
1059
- ...h,
1060
- captionPositionOnTop: !h.captionPositionOnTop
1061
- }));
1062
- }, []), r = u(() => {
1063
- o((h) => ({
1064
- ...h,
1065
- captionsInvertColors: !h.captionsInvertColors
1066
- }));
1067
- }, []), d = u(() => {
1068
- o((h) => ({
1069
- ...h,
1320
+ [o]
1321
+ ), l = m(() => {
1322
+ c((d) => {
1323
+ const _ = !d.captionPositionOnTop;
1324
+ return o.saveData("ontop", _), {
1325
+ ...d,
1326
+ captionPositionOnTop: _
1327
+ };
1328
+ });
1329
+ }, [o]), g = m(() => {
1330
+ c((d) => {
1331
+ const _ = !d.captionsInvertColors;
1332
+ return o.saveData("invert", _), {
1333
+ ...d,
1334
+ captionsInvertColors: _
1335
+ };
1336
+ });
1337
+ }, [o]), b = m(() => {
1338
+ c((d) => {
1339
+ const _ = !d.commentsEnabled;
1340
+ return o.saveData("comments", _), {
1341
+ ...d,
1342
+ commentsEnabled: _
1343
+ };
1344
+ });
1345
+ }, [o]), k = m(() => {
1346
+ c((d) => ({
1347
+ ...d,
1070
1348
  interactionsDisabled: !1
1071
1349
  }));
1072
- }, []), f = u(() => {
1073
- o((h) => ({
1074
- ...h,
1350
+ }, []), y = m(() => {
1351
+ c((d) => ({
1352
+ ...d,
1075
1353
  interactionsDisabled: !0
1076
1354
  }));
1077
- }, []), g = Y(() => t ? {
1078
- ...U,
1355
+ }, []), N = K(() => e ? {
1356
+ ...te,
1079
1357
  toggleFullscreen: []
1080
- } : U, [t]);
1358
+ } : te, [e]);
1081
1359
  return {
1082
1360
  contextValue: {
1083
- state: n,
1084
- setCaptionsFontSizeMultiplier: c,
1085
- toggleCaptionPositionOnTop: s,
1086
- toggleCaptionsInvertColors: r,
1087
- enableInteractions: d,
1088
- disableInteractions: f,
1089
- hideFullScreen: t
1361
+ state: a,
1362
+ setCaptionsFontSizeMultiplier: i,
1363
+ toggleCaptionPositionOnTop: l,
1364
+ toggleCaptionsInvertColors: g,
1365
+ enableInteractions: k,
1366
+ disableInteractions: y,
1367
+ toggleComments: b,
1368
+ hideFullScreen: e,
1369
+ hasComments: n.length > 0,
1370
+ comments: n
1090
1371
  },
1091
- shortcuts: g
1372
+ shortcuts: N,
1373
+ storage: o
1092
1374
  };
1093
1375
  }
1094
- function Un({
1095
- title: t,
1376
+ const Co = {};
1377
+ function So({
1378
+ title: e,
1096
1379
  src: n,
1097
1380
  captions: o = [],
1098
- thumbnail: c,
1099
- hideFullScreen: s = !1
1381
+ thumbnail: a,
1382
+ hideFullScreen: c = !1,
1383
+ comments: i = [],
1384
+ locale: l = "en"
1100
1385
  }) {
1101
- const { contextValue: r, shortcuts: d } = zn({ hideFullScreen: s });
1102
- return /* @__PURE__ */ e(p.Provider, { value: r, children: /* @__PURE__ */ a(
1103
- Ce,
1386
+ const { contextValue: g, shortcuts: b, storage: k } = vo({
1387
+ hideFullScreen: c,
1388
+ comments: i
1389
+ }), { i18n: y } = p();
1390
+ return $(() => {
1391
+ y.changeLanguage(l);
1392
+ }, [y, l]), /* @__PURE__ */ t(f.Provider, { value: g, children: /* @__PURE__ */ s(
1393
+ Pe,
1104
1394
  {
1105
- title: t,
1395
+ storage: k,
1396
+ title: e,
1106
1397
  src: n,
1107
- keyShortcuts: d,
1398
+ keyShortcuts: b,
1108
1399
  playsInline: !0,
1109
- keyDisabled: r.state.interactionsDisabled,
1400
+ keyDisabled: g.state.interactionsDisabled,
1110
1401
  children: [
1111
- /* @__PURE__ */ e(rn, {}),
1112
- /* @__PURE__ */ a(ve, { className: On.mediaProvider, children: [
1113
- /* @__PURE__ */ e(qe, {}),
1114
- /* @__PURE__ */ e(pn, { src: c }),
1115
- /* @__PURE__ */ e(Oe, { captions: o }),
1116
- /* @__PURE__ */ e(Qt, {}),
1117
- /* @__PURE__ */ e(vn, {}),
1118
- /* @__PURE__ */ e(nn, {})
1402
+ /* @__PURE__ */ t(xn, {}),
1403
+ /* @__PURE__ */ s(Be, { className: Co.mediaProvider, children: [
1404
+ /* @__PURE__ */ t(Kn, { src: a }),
1405
+ /* @__PURE__ */ t(kn, {}),
1406
+ /* @__PURE__ */ t(qe, {}),
1407
+ /* @__PURE__ */ t(Xe, { captions: o }),
1408
+ /* @__PURE__ */ t(dt, {}),
1409
+ /* @__PURE__ */ t(Wn, {}),
1410
+ /* @__PURE__ */ t(Sn, {})
1119
1411
  ] }),
1120
- /* @__PURE__ */ e(Qe, {})
1412
+ /* @__PURE__ */ t(bt, {})
1121
1413
  ]
1122
1414
  }
1123
1415
  ) });
1124
1416
  }
1125
1417
  export {
1126
- rt as CAPTION_FONT_SIZE_MULTIPLIERS,
1127
- I as PLAYBACK_RATES,
1128
- Un as StudioPlayer
1418
+ et as CAPTION_FONT_SIZE_MULTIPLIERS,
1419
+ ue as COMMENT_DURATION,
1420
+ P as PLAYBACK_RATES,
1421
+ So as StudioPlayer
1129
1422
  };