@layers-app/shared 0.4.5 → 0.4.7

package/dist/components/VideoPlayer/VideoPlayer.js

@@ -0,0 +1,727 @@
+import { jsx as C, jsxs as me, Fragment as De } from "react/jsx-runtime";
+import { useState as b, useRef as R, useEffect as d, useCallback as qe, useMemo as Oe } from "react";
+import { useTranslation as We } from "react-i18next";
+import { Flex as Ve } from "@mantine/core";
+import _e from "shaka-player-react";
+import { VideoCustomControls as $e } from "./components/VideoCustomControls.js";
+import { PlayIcon as je } from "./components/VideoIcons.js";
+import { getSettingsSnapshot as x, setSubtitle as ie, setQuality as Xe, setPlaybackRate as Ye } from "./utils/videoSettings.js";
+/* empty css            */
+function M(T, v) {
+  return T ? T.startsWith("http://") || T.startsWith("https://") ? T : T.startsWith("/") ? `${v || window.location.origin}${T}` : T : null;
+}
+function Ge(T) {
+  return Array.from(T.textTracks || []).filter(
+    (v) => v.kind === "subtitles" || v.kind === "captions"
+  );
+}
+function pe(T, v) {
+  return T.url ? M(T.url, v) : null;
+}
+function ct({
+  source: T,
+  videoId: v,
+  language: G,
+  baseUrl: y,
+  storyboard: we,
+  chapters: ve,
+  subtitles: U,
+  onPlayerInfo: ae,
+  onFallback: D
+}) {
+  const {
+    streamUrl: J,
+    nativeUrl: B,
+    rawUrl: q,
+    localBlobUrl: H,
+    posterUrl: K,
+    optimizedReady: h = !1,
+    isProcessing: Ne = !1
+  } = T, { t: Q, i18n: Fe } = We(), [m, ye] = b(null), [V, he] = b(null), [ge, ke] = b(null), [L, Z] = b(!1), g = R(null), P = R(null), O = R(null), [s, Ee] = b(null), [W, S] = b(() => x(null, null)), [be, le] = b(!0), [k, se] = b([]), [ce, Te] = b([{ id: null, label: Q("editor.video.settings.off") }]), [z, ue] = b(null), [N, _] = b(null), [Me, Ie] = b(!0), [Se, ee] = b(!1), [te, Ue] = b(0), [oe, de] = b(!1), A = R(!1), ne = R(null), p = R(null), $ = R(null), j = R(
+    null
+  ), re = R([]), Le = R(!1), X = R(/* @__PURE__ */ new Set()), fe = R(null), I = R(!1);
+  d(() => {
+    G && Fe.changeLanguage(G).catch(() => {
+    });
+  }, [G]), d(() => {
+    if (!v) {
+      se([]);
+      return;
+    }
+    if (U != null) {
+      const e = (U || []).filter(
+        (t) => t.id && !t.isDisabled
+      );
+      se(e);
+    }
+  }, [v, U]), d(() => {
+    le(!0), fe.current = null;
+  }, [v]);
+  const Be = qe(() => {
+    if (!v || U == null) return;
+    const e = (U || []).filter(
+      (t) => t.id && !t.isDisabled
+    );
+    se(e);
+  }, [v, U]);
+  d(() => {
+    if (k.length === 0) {
+      Te([
+        { id: null, label: Q("editor.video.settings.off") }
+      ]), ue(null);
+      return;
+    }
+    const e = [
+      { id: null, label: Q("editor.video.settings.off") },
+      ...k.map((t, n) => ({
+        id: n,
+        label: t.label || t.lang || "Unknown",
+        lang: t.lang || void 0,
+        isDefault: t.isDefault || !1
+      }))
+    ];
+    Te(e), ue(
+      (t) => t != null && t >= 0 && t < k.length ? t : null
+    );
+  }, [k, Q]), d(() => {
+    let e = !1;
+    const t = g.current?.player || null;
+    return h ? (async () => {
+      if (!t) return;
+      if (z == null) {
+        ie(t, null), S(
+          x(t, s)
+        );
+        return;
+      }
+      const i = k[z], a = i?.label || i?.lang || "und", l = i?.lang || "und", c = i?.kind || "subtitles", f = t.getTextTracks?.() || [];
+      let o = f.find(
+        (E) => (E.language || "") === l && (E.label || "") === a && (E.kind || "subtitles") === c
+      );
+      if (!o && N && (o = f.find(
+        (E) => (E.language || "") === N.lang && (E.label || "") === N.label && (E.kind || "subtitles") === N.kind
+      )), !o) {
+        const E = N && k.length > 0 && k.find(
+          (Y) => (Y.lang || "und") === N.lang && (Y.label || Y.lang || "und") === N.label && (Y.kind || "subtitles") === N.kind
+        ) || null, F = i || E, u = F ? pe(F, y) : null;
+        if (!u || typeof t.addTextTrackAsync != "function")
+          return;
+        let w = null;
+        w = await t.addTextTrackAsync(
+          u,
+          F?.lang || l,
+          F?.kind || c,
+          "text/vtt",
+          void 0,
+          F?.label || a
+        ), w && typeof w.id == "number" && (o = w);
+      }
+      e || o && (t.selectTextTrack?.(o), t.setTextTrackVisibility?.(!0), S(
+        x(t, s)
+      ));
+    })().catch(() => {
+    }) : s && (ie(null, z, s), S(x(null, s))), () => {
+      e = !0;
+    };
+  }, [
+    z,
+    k,
+    h,
+    s,
+    y,
+    v,
+    N
+  ]), d(() => {
+    if (!m) return;
+    let e = !1, t = null;
+    const n = (l) => {
+      if (e) return;
+      M(B, y) || M(q ?? null, y) ? (Z(!0), D?.(!0)) : ke(
+        Q("editor.video.player.playbackError", { code: l.code })
+      );
+    }, r = (l) => {
+      const c = l.detail;
+      if (c.severity === 2)
+        n(c);
+      else
+        try {
+          t?.recover();
+        } catch {
+        }
+    }, i = () => {
+      if (t = g.current?.player, !t) {
+        const l = requestAnimationFrame(i);
+        return () => cancelAnimationFrame(l);
+      }
+      if ($.current)
+        try {
+          t.removeEventListener("error", $.current);
+        } catch {
+        }
+      $.current = r, t.addEventListener("error", r), t.load(m).catch((l) => {
+        e || l.code !== 7e3 && n(l);
+      });
+    }, a = requestAnimationFrame(i);
+    return () => {
+      if (e = !0, cancelAnimationFrame(a), t && $.current)
+        try {
+          t.removeEventListener("error", $.current);
+        } catch {
+        }
+    };
+  }, [m, B, q, y, D]), d(() => {
+    let e = !1, t = null;
+    if (h && J) {
+      const n = M(J, y);
+      if (n) {
+        if (!V) {
+          const f = H || M(q ?? null, y);
+          f && he(f);
+        }
+        if (fe.current === n)
+          return;
+        const r = P.current;
+        r && r.currentTime > 0 && (p.current = {
+          time: r.currentTime,
+          paused: r.paused
+        }, I.current = !0);
+        const i = (f) => {
+          e || fetch(n, { method: "HEAD", credentials: "include" }).then((o) => {
+            e || (fe.current = n, o.ok ? (ye(n), ke(null), Z(!1), D?.(!1), X.current.clear()) : (X.current.clear(), Z(!0), D?.(!0), c(f)));
+          }).catch(() => {
+            e || (X.current.clear(), Z(!0), D?.(!0), c(f));
+          });
+        }, a = 10, l = 5e3, c = (f) => {
+          e || f >= a || (t = setTimeout(() => i(f + 1), l));
+        };
+        i(0);
+      }
+    } else if (H || B) {
+      const n = H || M(B, y);
+      if (n) {
+        if (ne.current === n)
+          return;
+        const r = P.current;
+        if (r && r.readyState > 0 && !r.error && r.src) {
+          ne.current = n;
+          return;
+        }
+        ne.current && r && r.currentTime > 0 && (p.current = {
+          time: r.currentTime,
+          paused: r.paused
+        }), he(n), ye(null), ne.current = n;
+      }
+    }
+    return () => {
+      e = !0, t && clearTimeout(t);
+    };
+  }, [J, y, h, B, H]), d(() => {
+    if (!h || !m) return;
+    let e = !1, t = null;
+    const n = () => {
+      if (e) return;
+      const r = g.current?.videoElement;
+      if (!r) {
+        requestAnimationFrame(n);
+        return;
+      }
+      const i = () => {
+        if (e || r.readyState < 1) return;
+        const a = P.current, l = a && a.currentTime > 0 ? a.currentTime : p.current?.time ?? 0;
+        l > 0 && Math.abs(r.currentTime - l) > 0.05 && (r.currentTime = l), p.current = null, I.current = !1;
+      };
+      r.readyState >= 1 ? i() : (r.addEventListener("loadedmetadata", i, {
+        once: !0
+      }), r.addEventListener("canplay", i, { once: !0 }), t = () => {
+        r.removeEventListener("loadedmetadata", i), r.removeEventListener("canplay", i);
+      });
+    };
+    return n(), () => {
+      e = !0, t?.();
+    };
+  }, [h, m]), d(() => {
+    const e = P.current;
+    e && m && !L && (A.current = !e.paused, e.currentTime > 0 && (p.current = {
+      time: e.currentTime,
+      paused: e.paused
+    }));
+  }, [m, L]), d(() => {
+    if (!m || L) {
+      de(!1);
+      return;
+    }
+    let e = !1, t = null, n = null, r = 0, i = !1;
+    const a = 3, l = () => {
+      if (e) return;
+      const c = g.current?.videoElement;
+      if (!c) {
+        requestAnimationFrame(l);
+        return;
+      }
+      const f = () => {
+        if (e || !A.current || !c.paused || c.ended) return;
+        const u = c.play();
+        !u || typeof u.then != "function" || u.then(() => {
+          e || !A.current || c.paused && (n && clearTimeout(n), n = setTimeout(() => {
+            e || !A.current || !c.paused || r >= a || (r += 1, f());
+          }, 250));
+        }).catch(() => {
+        });
+      }, o = () => {
+        if (!e && c.readyState >= 2 && !c.seeking) {
+          const u = P.current, w = !!(u && !u.paused && !u.ended);
+          if (!(A.current && w)) {
+            !i && u && Math.abs(c.currentTime - u.currentTime) > 0.1 && (c.currentTime = u.currentTime), i = !0, A.current = !1, de(!0);
+            return;
+          }
+          c.paused && u && (i || Math.abs(c.currentTime - u.currentTime) > 0.1 && (c.currentTime = u.currentTime), i = !0, c.muted = !0, f());
+        }
+      }, E = () => {
+        if (e) return;
+        const u = P.current;
+        u && !u.paused && u.pause(), c.muted && (c.muted = !1), de(!0), A.current = !1, r = 0, n && (clearTimeout(n), n = null);
+      }, F = () => {
+        if (!(e || !A.current) && !(c.seeking || c.ended) && !(c.readyState < 2)) {
+          if (r >= a) {
+            A.current = !1;
+            return;
+          }
+          r += 1, f();
+        }
+      };
+      c.addEventListener("seeked", o), c.addEventListener("canplay", o), c.addEventListener("loadeddata", o), c.addEventListener("playing", o), c.addEventListener("playing", E), c.addEventListener("pause", F), o(), t = () => {
+        c.removeEventListener("seeked", o), c.removeEventListener("canplay", o), c.removeEventListener("loadeddata", o), c.removeEventListener("playing", o), c.removeEventListener("playing", E), c.removeEventListener("pause", F);
+      };
+    };
+    return l(), () => {
+      e = !0, n && clearTimeout(n), t?.();
+    };
+  }, [m, L]), d(() => {
+    if (m && !L && oe) {
+      const e = g.current?.videoElement || null;
+      e && Ee(e);
+    } else if (!m || L) {
+      const e = P.current;
+      if (Ee(e), L && A.current && e && e.paused && !e.ended) {
+        const t = () => {
+          !A.current || !e.paused || e.ended || e.play().then(() => {
+            e.paused || (A.current = !1);
+          }).catch(() => {
+          });
+        };
+        e.readyState >= 2 ? t() : (e.addEventListener("canplay", t, { once: !0 }), e.addEventListener("loadeddata", t, { once: !0 }));
+      }
+    }
+  }, [
+    h,
+    L,
+    m,
+    V,
+    oe
+  ]), d(() => {
+    if (!s) {
+      ee(!1);
+      return;
+    }
+    const e = s, t = () => ee(!0), n = () => {
+      e.readyState >= 3 && ee(!1);
+    }, r = () => ee(!1);
+    return e.addEventListener("waiting", t), e.addEventListener("seeking", t), e.addEventListener("seeked", n), e.addEventListener("canplay", n), e.addEventListener("playing", r), () => {
+      e.removeEventListener("waiting", t), e.removeEventListener("seeking", t), e.removeEventListener("seeked", n), e.removeEventListener("canplay", n), e.removeEventListener("playing", r);
+    };
+  }, [s]), d(() => {
+    if (!s) return;
+    const e = () => {
+      Ie(s.paused);
+    };
+    return e(), s.addEventListener("play", e), s.addEventListener("pause", e), s.addEventListener("ended", e), () => {
+      s.removeEventListener("play", e), s.removeEventListener("pause", e), s.removeEventListener("ended", e);
+    };
+  }, [s]), d(() => {
+    const e = O.current;
+    if (!e) return;
+    const t = new ResizeObserver((n) => {
+      const r = n[0];
+      r && Ue(Math.round(r.contentRect.width));
+    });
+    return t.observe(e), () => t.disconnect();
+  }, []), d(() => {
+    if (!ae) return;
+    const e = g.current?.player || null, t = P.current || null, n = O.current || null, r = m && !L && e ? "shaka" : "native";
+    let i = null;
+    try {
+      const a = e?.seekRange?.();
+      a && Number.isFinite(a.end) && a.end > 0 && (i = a.end);
+    } catch {
+    }
+    if (i == null && s) {
+      const a = s.duration;
+      Number.isFinite(a) && a > 0 && (i = a);
+    }
+    ae({
+      shakaPlayer: e,
+      nativeVideo: t,
+      mode: r,
+      containerEl: n,
+      videoDuration: i
+    });
+  }, [
+    ae,
+    h,
+    L,
+    m,
+    V,
+    s
+  ]), d(() => {
+    const e = P.current;
+    e && (e.poster = K || "");
+    const t = g.current?.videoElement;
+    t && (t.poster = K || "");
+  }, [K, m, V]), d(() => {
+    const e = g.current?.player || null;
+    if (!h || !e) {
+      S(x(null, s));
+      return;
+    }
+    S(x(e, s));
+  }, [h, m, s]), d(() => {
+    const e = g.current?.player || null;
+    if (!h || !e)
+      return;
+    const t = () => {
+      S(x(e, s));
+    }, n = ["variantchanged", "adaptation", "trackschanged"];
+    return n.forEach((r) => {
+      e.addEventListener?.(r, t);
+    }), () => {
+      n.forEach((r) => {
+        e.removeEventListener?.(r, t);
+      });
+    };
+  }, [h, m, s]), d(() => {
+    if (!s) return;
+    const e = () => {
+      const t = g.current?.player || null;
+      S(x(t, s));
+    };
+    return s.addEventListener("ratechange", e), () => {
+      s.removeEventListener("ratechange", e);
+    };
+  }, [s]), d(() => () => {
+    const e = document.pictureInPictureElement;
+    if (!e) return;
+    const t = g.current?.videoElement || null, n = P.current || null, r = O.current || null, i = e instanceof HTMLVideoElement && (n && n.currentSrc === e.currentSrc || t && t.currentSrc === e.currentSrc);
+    (e === t || e === n || r && r.contains(e) || i) && document.exitPictureInPicture?.().catch(() => {
+    });
+  }, []), d(() => {
+    const e = P.current;
+    if (!e || !V) return;
+    const t = () => {
+      p.current && (e.currentTime = p.current.time, p.current.paused || e.play().catch(() => {
+      }), I.current = !1);
+    };
+    e.readyState >= 1 ? t() : e.addEventListener("loadedmetadata", t, {
+      once: !0
+    });
+    const n = () => {
+      I.current || (j.current && clearTimeout(j.current), j.current = setTimeout(() => {
+        I.current || (p.current || (p.current = { time: 0, paused: !0 }), p.current.time = e.currentTime);
+      }, 100));
+    }, r = () => {
+      I.current || (p.current ? p.current.paused = !1 : p.current = { time: 0, paused: !1 });
+    }, i = () => {
+      I.current || (p.current ? p.current.paused = !0 : p.current = { time: e.currentTime, paused: !0 });
+    };
+    return e.addEventListener("timeupdate", n), e.addEventListener("play", r), e.addEventListener("pause", i), () => {
+      e.removeEventListener("loadedmetadata", t), e.removeEventListener("timeupdate", n), e.removeEventListener("play", r), e.removeEventListener("pause", i), j.current && clearTimeout(j.current), e.currentTime > 0 && (p.current = {
+        time: e.currentTime,
+        paused: e.paused
+      });
+    };
+  }, [V]), d(() => {
+    if (h) return;
+    const e = P.current;
+    if (!e) return;
+    e.querySelectorAll(
+      'track[data-subtitle-track="managed"]'
+    ).forEach((i) => i.remove()), v && k.forEach((i) => {
+      const a = pe(i, y);
+      if (!a)
+        return;
+      const l = document.createElement("track");
+      l.setAttribute("data-subtitle-track", "managed"), l.kind = i.kind || "subtitles", l.label = i.label || i.lang || "und", l.srclang = i.lang || "und", l.src = a, l.setAttribute("crossorigin", "use-credentials"), l.default = !1, e.appendChild(l);
+    });
+    const n = Ge(e);
+    n.some((i) => i.mode === "showing") && n.forEach((i) => {
+      i.mode = "disabled";
+    }), S(x(null, e));
+  }, [h, V, k, v, y]), d(() => {
+    if (!h) {
+      re.current = [];
+      return;
+    }
+    const e = g.current?.player || null;
+    if (!e) return;
+    const t = e.getNetworkingEngine?.();
+    t && !Le.current && (t.registerRequestFilter?.((a, l) => {
+      l.allowCrossSiteCredentials = !0;
+    }), Le.current = !0), (e.getTextTracks?.() || []).forEach((a) => {
+      re.current.includes(a.id) && e.removeTextTrack?.(a);
+    }), re.current = [];
+    let r = !1;
+    return (async () => {
+      const a = e.getTextTracks?.() || [];
+      if (v)
+        for (const l of k) {
+          const c = pe(l, y);
+          if (!c || typeof e.addTextTrackAsync != "function")
+            continue;
+          const f = l.label || l.lang || "und", o = l.lang || "und", E = l.kind || "subtitles";
+          if (a.some(
+            (w) => (w.language || "") === o && (w.label || "") === f && (w.kind || "subtitles") === E
+          ))
+            continue;
+          let u = null;
+          if (u = await e.addTextTrackAsync(
+            c,
+            o,
+            E,
+            "text/vtt",
+            void 0,
+            f
+          ), r) return;
+          u && typeof u.id == "number" && (re.current.push(u.id), a.push(u));
+        }
+      e.setTextTrackVisibility?.(!1), S(x(e, s));
+    })().catch(() => {
+    }), () => {
+      r = !0;
+    };
+  }, [
+    h,
+    m,
+    k,
+    v,
+    y,
+    s
+  ]);
+  const He = Oe(() => ({
+    ...W,
+    subtitles: ce,
+    currentSubtitleId: z,
+    currentQualityId: be ? null : W.currentQualityId,
+    hasRealSubtitles: ce.length > 1
+  }), [
+    W,
+    ce,
+    z,
+    be
+  ]), Qe = (e) => {
+    if (!s) return;
+    e.target.closest(".video-player-controls") !== null || (s.paused ? s.play().catch(() => {
+    }) : s.pause());
+  };
+  if (ge)
+    return /* @__PURE__ */ C(
+      Ve,
+      {
+        justify: "center",
+        align: "center",
+        styles: {
+          root: {
+            height: "100%",
+            width: "100%",
+            minHeight: 200,
+            padding: 16
+          }
+        },
+        children: /* @__PURE__ */ C("div", { style: { textAlign: "center", color: "red" }, children: ge })
+      }
+    );
+  const Pe = H || M(q ?? null, y) || V, Re = !!(m && !L), xe = Re && oe, Ae = te > 0 && te < 500, Ce = te > 0 && te < 380, ze = (ve?.length ?? 0) > 0 && !Ce ? "48px" : "16px";
+  return /* @__PURE__ */ C(
+    Ve,
+    {
+      justify: "center",
+      align: "center",
+      styles: {
+        root: {
+          height: "100%",
+          width: "100%",
+          minHeight: 200,
+          position: "relative"
+        }
+      },
+      children: /* @__PURE__ */ me(
+        "div",
+        {
+          "data-test-id": "video-player-container",
+          className: `video-player-container video-player-container--with-player ${Ae ? "video-player--compact" : ""} ${Ce ? "video-player--narrow" : ""}`,
+          style: {
+            "--video-subtitles-offset": ze
+          },
+          ref: O,
+          onClick: Qe,
+          children: [
+            /* @__PURE__ */ C(
+              "video",
+              {
+                ref: P,
+                src: V || (L ? Pe : null) || void 0,
+                className: "video-player-media",
+                style: xe ? { display: "none" } : void 0,
+                poster: K || void 0,
+                onError: (e) => {
+                  const t = e.currentTarget, n = t.currentSrc || t.src;
+                  if (!n || !t.error) return;
+                  X.current.add(n);
+                  const i = [
+                    H,
+                    M(q ?? null, y),
+                    M(B, y)
+                  ].filter(
+                    (a) => !!a && !X.current.has(a)
+                  );
+                  i.length > 0 && (t.src = i[0], t.load());
+                }
+              }
+            ),
+            Re && /* @__PURE__ */ C(
+              _e,
+              {
+                ref: g,
+                autoPlay: !1,
+                className: `video-player-media${xe ? "" : " video-player-media--loading"}`
+              }
+            ),
+            (V || m || J || L && Pe) && /* @__PURE__ */ me(De, { children: [
+              Se && /* @__PURE__ */ C(
+                "div",
+                {
+                  className: "video-player-buffering",
+                  "data-test-id": "video-player-buffering",
+                  children: /* @__PURE__ */ C("div", { className: "video-player-buffering-ring" })
+                }
+              ),
+              Me && !Ae && !Se && /* @__PURE__ */ C(
+                "button",
+                {
+                  className: "video-player-center-play",
+                  type: "button",
+                  "aria-label": Q("editor.video.player.play"),
+                  onClick: (e) => {
+                    e.stopPropagation(), s?.play().catch(() => {
+                    });
+                  },
+                  children: /* @__PURE__ */ C(je, { size: 32 })
+                }
+              ),
+              /* @__PURE__ */ me("div", { className: "video-player-overlay", children: [
+                /* @__PURE__ */ C("div", { className: "video-player-gradient" }),
+                /* @__PURE__ */ C(
+                  $e,
+                  {
+                    video: s,
+                    containerRef: O,
+                    settings: He,
+                    isSettingsDisabled: !1,
+                    onSubtitlesOpen: Be,
+                    storyboard: we,
+                    chapters: h ? ve : void 0,
+                    isProcessing: Ne,
+                    baseUrl: y,
+                    onSpeedClick: (e) => {
+                      const t = g.current?.player || null;
+                      S((n) => ({
+                        ...n,
+                        currentSpeed: e
+                      })), t && Ye(t, e), s && (s.playbackRate = e);
+                    },
+                    onQualityClick: (e) => {
+                      const t = g.current?.player || null;
+                      if (!t || W.qualities.length === 0)
+                        return;
+                      if (e == null) {
+                        t.configure?.({ abr: { enabled: !0 } }), le(!0), S(
+                          x(t, s)
+                        );
+                        return;
+                      }
+                      t.configure?.({ abr: { enabled: !1 } });
+                      const n = W.qualities.find(
+                        (r) => r.id === e
+                      ) || null;
+                      n && Xe(t, n.id), le(!1), S((r) => ({
+                        ...r,
+                        currentQualityId: e
+                      }));
+                    },
+                    onSubtitleSelect: (e) => {
+                      const t = g.current?.player || null, n = typeof e == "number" ? e : null;
+                      if (ue(n), t) {
+                        const r = t.getTextTracks?.() ?? [];
+                        if (n == null)
+                          _(null);
+                        else {
+                          const a = r.find(
+                            (l) => l.id === n
+                          );
+                          if (a)
+                            _({
+                              lang: a.language || "und",
+                              label: a.label || "und",
+                              kind: a.kind || "subtitles"
+                            });
+                          else {
+                            const l = k[n];
+                            l && _({
+                              lang: l.lang || "und",
+                              label: l.label || l.lang || "und",
+                              kind: l.kind || "subtitles"
+                            });
+                          }
+                        }
+                        let i = n;
+                        if (typeof n == "number" && !r.find((a) => a.id === n)) {
+                          const a = k[n];
+                          if (a) {
+                            const l = a.label || a.lang || "und", c = a.lang || "und", f = r.find(
+                              (o) => (o.language || "") === c && (o.label || "") === l
+                            );
+                            f && (i = f.id);
+                          }
+                        }
+                        ie(t, i), S(
+                          x(t, s)
+                        );
+                        return;
+                      }
+                      if (s) {
+                        if (n == null)
+                          _(null);
+                        else {
+                          const r = k[n];
+                          r && _({
+                            lang: r.lang || "und",
+                            label: r.label || r.lang || "und",
+                            kind: r.kind || "subtitles"
+                          });
+                        }
+                        ie(null, n, s), S(
+                          x(null, s)
+                        );
+                      }
+                    }
+                  }
+                )
+              ] })
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  ct as VideoPlayer
+};