@aigamo/hydrangean-diva 0.0.1-alpha.6 → 0.0.1-alpha.8

package/dist/index.es.js

@@ -1,158 +1,1301 @@
-var Q = Object.defineProperty;
-var ee = (n, e, i) => e in n ? Q(n, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : n[e] = i;
-var p = (n, e, i) => ee(n, typeof e != "symbol" ? e + "" : e, i);
-import { useNostalgicDiva as C, findVideoService as te, NostalgicDiva as ne } from "@aigamo/nostalgic-diva";
-import { EuiRange as j, EuiPopover as F, EuiFormRow as O, EuiFlexGroup as k, EuiButtonIcon as I, EuiIcon as E, EuiContextMenu as ie, EuiBottomBar as se, EuiFlexItem as v, EuiButton as x, EuiModal as re, EuiModalHeader as le, EuiModalHeaderTitle as ae, EuiModalBody as oe, EuiForm as ce, EuiFieldText as V, EuiModalFooter as me, EuiButtonEmpty as de, useEuiTheme as H, EuiTableHeader as ue, EuiTableHeaderCellCheckbox as he, EuiCheckbox as U, EuiTableHeaderCell as P, EuiContextMenuItem as pe, EuiContextMenuPanel as ge, EuiHorizontalRule as L, EuiTableRowCell as A, EuiTableRow as fe, EuiTableRowCellCheckbox as Ee, EuiLink as ve, EuiTable as Ie, EuiFlyout as ye, EuiCodeBlock as be, EuiSpacer as $, EuiPageTemplate as z } from "@elastic/eui";
-import { Speaker2Regular as q, TopSpeedRegular as Te, SkipBack10Regular as xe, SkipForward30Regular as Ce, DismissRegular as B, ArrowRepeat1Filled as ke, ArrowRepeatAllFilled as we, ArrowRepeatAllOffFilled as Pe, ArrowShuffleFilled as Se, ArrowShuffleOffFilled as Oe, PreviousFilled as Ae, PauseFilled as ze, PlayFilled as Me, NextFilled as Re, MoreHorizontalFilled as J, AddRegular as N, ArrowUploadRegular as Fe, ArrowDownloadRegular as Be, PlayRegular as Ne, DeleteRegular as Ve } from "@fluentui/react-icons";
-import { observer as h } from "mobx-react-lite";
-import t, { useCallback as u, memo as y, useState as g, useLayoutEffect as Le, useMemo as G, createContext as W, useContext as X, useEffect as De } from "react";
-import { ReactSortable as je } from "react-sortablejs";
-import { makeObservable as He, action as r, computed as c, observable as b, reaction as Ue } from "mobx";
-import { pull as D } from "lodash-es";
-import $e from "ajv";
-var o = /* @__PURE__ */ ((n) => (n.Off = "Off", n.All = "All", n.One = "One", n))(o || {});
-const Y = 80, qe = h(({ playerStore: n }) => {
-  const e = C(), i = u(
-    (a) => {
-      const m = Number(a.currentTarget.value) / 100;
-      n.setPercent(m);
+var Cr = Object.defineProperty;
+var Ir = (t, e, n) => e in t ? Cr(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var U = (t, e, n) => Ir(t, typeof e != "symbol" ? e + "" : e, n);
+import * as te from "react";
+import Dt, { forwardRef as Pr, useContext as st, useCallback as $, memo as Z, useState as q, useLayoutEffect as Rr, useMemo as zt, createContext as Lt, useEffect as wr } from "react";
+import Or from "@emotion/cache";
+import { useNostalgicDiva as ie, findVideoService as _r, NostalgicDiva as Ar } from "@aigamo/nostalgic-diva";
+import { EuiRange as Vt, EuiButtonIcon as K, EuiFlexGroup as me, EuiFlexItem as G, EuiBottomBar as kr, EuiFormRow as tt, EuiPopover as lt, EuiIcon as H, EuiContextMenu as Mr, EuiButton as ne, EuiModalHeaderTitle as Fr, EuiModalHeader as jr, EuiForm as Nr, EuiFieldText as It, EuiModalBody as $r, EuiModalFooter as Dr, EuiButtonEmpty as zr, EuiModal as Lr, useEuiTheme as Yt, EuiCheckbox as Bt, EuiTableHeaderCellCheckbox as Vr, EuiTableHeaderCell as Xe, EuiTableHeader as Yr, EuiContextMenuItem as Br, EuiHorizontalRule as Pt, EuiContextMenuPanel as Wr, EuiTableRowCell as rt, EuiTableRowCellCheckbox as Ur, EuiLink as qr, EuiTableRow as Hr, EuiTable as Gr, EuiCodeBlock as Jr, EuiFlyout as Kr, EuiSpacer as Wt, EuiPageTemplate as nt } from "@elastic/eui";
+import { ArrowRepeat1Filled as Xr, ArrowRepeatAllFilled as Zr, ArrowRepeatAllOffFilled as Qr, ArrowShuffleFilled as en, ArrowShuffleOffFilled as tn, PreviousFilled as rn, PauseFilled as nn, PlayFilled as on, NextFilled as an, Speaker2Regular as Ut, MoreHorizontalFilled as qt, TopSpeedRegular as sn, SkipBack10Regular as ln, SkipForward30Regular as cn, DismissRegular as ct, AddRegular as ut, ArrowUploadRegular as un, ArrowDownloadRegular as fn, PlayRegular as dn, DeleteRegular as mn } from "@fluentui/react-icons";
+import { observer as Y } from "mobx-react-lite";
+import { ReactSortable as hn } from "react-sortablejs";
+import { makeObservable as vn, action as y, computed as _, observable as re, reaction as pn } from "mobx";
+import { pull as Rt } from "lodash-es";
+import yn from "ajv";
+var De = { exports: {} }, xe = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var wt;
+function gn() {
+  if (wt) return xe;
+  wt = 1;
+  var t = Dt, e = Symbol.for("react.element"), n = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, a = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function f(m, h, p) {
+    var E, P = {}, D = null, j = null;
+    p !== void 0 && (D = "" + p), h.key !== void 0 && (D = "" + h.key), h.ref !== void 0 && (j = h.ref);
+    for (E in h) i.call(h, E) && !l.hasOwnProperty(E) && (P[E] = h[E]);
+    if (m && m.defaultProps) for (E in h = m.defaultProps, h) P[E] === void 0 && (P[E] = h[E]);
+    return { $$typeof: e, type: m, key: D, ref: j, props: P, _owner: a.current };
+  }
+  return xe.Fragment = n, xe.jsx = f, xe.jsxs = f, xe;
+}
+var Se = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var Ot;
+function bn() {
+  return Ot || (Ot = 1, process.env.NODE_ENV !== "production" && function() {
+    var t = Dt, e = Symbol.for("react.element"), n = Symbol.for("react.portal"), i = Symbol.for("react.fragment"), a = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), f = Symbol.for("react.provider"), m = Symbol.for("react.context"), h = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), E = Symbol.for("react.suspense_list"), P = Symbol.for("react.memo"), D = Symbol.for("react.lazy"), j = Symbol.for("react.offscreen"), A = Symbol.iterator, B = "@@iterator";
+    function Q(r) {
+      if (r === null || typeof r != "object")
+        return null;
+      var s = A && r[A] || r[B];
+      return typeof s == "function" ? s : null;
+    }
+    var z = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    function I(r) {
+      {
+        for (var s = arguments.length, u = new Array(s > 1 ? s - 1 : 0), v = 1; v < s; v++)
+          u[v - 1] = arguments[v];
+        k("error", r, u);
+      }
+    }
+    function k(r, s, u) {
+      {
+        var v = z.ReactDebugCurrentFrame, T = v.getStackAddendum();
+        T !== "" && (s += "%s", u = u.concat([T]));
+        var C = u.map(function(b) {
+          return String(b);
+        });
+        C.unshift("Warning: " + s), Function.prototype.apply.call(console[r], console, C);
+      }
+    }
+    var w = !1, c = !1, L = !1, he = !1, we = !1, Oe;
+    Oe = Symbol.for("react.module.reference");
+    function Ve(r) {
+      return !!(typeof r == "string" || typeof r == "function" || r === i || r === l || we || r === a || r === p || r === E || he || r === j || w || c || L || typeof r == "object" && r !== null && (r.$$typeof === D || r.$$typeof === P || r.$$typeof === f || r.$$typeof === m || r.$$typeof === h || // This needs to include all possible module reference object
+      // types supported by any Flight configuration anywhere since
+      // we don't know which Flight build this will end up being used
+      // with.
+      r.$$typeof === Oe || r.getModuleId !== void 0));
+    }
+    function Ye(r, s, u) {
+      var v = r.displayName;
+      if (v)
+        return v;
+      var T = s.displayName || s.name || "";
+      return T !== "" ? u + "(" + T + ")" : u;
+    }
+    function _e(r) {
+      return r.displayName || "Context";
+    }
+    function J(r) {
+      if (r == null)
+        return null;
+      if (typeof r.tag == "number" && I("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof r == "function")
+        return r.displayName || r.name || null;
+      if (typeof r == "string")
+        return r;
+      switch (r) {
+        case i:
+          return "Fragment";
+        case n:
+          return "Portal";
+        case l:
+          return "Profiler";
+        case a:
+          return "StrictMode";
+        case p:
+          return "Suspense";
+        case E:
+          return "SuspenseList";
+      }
+      if (typeof r == "object")
+        switch (r.$$typeof) {
+          case m:
+            var s = r;
+            return _e(s) + ".Consumer";
+          case f:
+            var u = r;
+            return _e(u._context) + ".Provider";
+          case h:
+            return Ye(r, r.render, "ForwardRef");
+          case P:
+            var v = r.displayName || null;
+            return v !== null ? v : J(r.type) || "Memo";
+          case D: {
+            var T = r, C = T._payload, b = T._init;
+            try {
+              return J(b(C));
+            } catch {
+              return null;
+            }
+          }
+        }
+      return null;
+    }
+    var ee = Object.assign, oe = 0, Ae, ke, ve, Me, pe, Fe, je;
+    function Ne() {
+    }
+    Ne.__reactDisabledLog = !0;
+    function Be() {
+      {
+        if (oe === 0) {
+          Ae = console.log, ke = console.info, ve = console.warn, Me = console.error, pe = console.group, Fe = console.groupCollapsed, je = console.groupEnd;
+          var r = {
+            configurable: !0,
+            enumerable: !0,
+            value: Ne,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            info: r,
+            log: r,
+            warn: r,
+            error: r,
+            group: r,
+            groupCollapsed: r,
+            groupEnd: r
+          });
+        }
+        oe++;
+      }
+    }
+    function We() {
+      {
+        if (oe--, oe === 0) {
+          var r = {
+            configurable: !0,
+            enumerable: !0,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            log: ee({}, r, {
+              value: Ae
+            }),
+            info: ee({}, r, {
+              value: ke
+            }),
+            warn: ee({}, r, {
+              value: ve
+            }),
+            error: ee({}, r, {
+              value: Me
+            }),
+            group: ee({}, r, {
+              value: pe
+            }),
+            groupCollapsed: ee({}, r, {
+              value: Fe
+            }),
+            groupEnd: ee({}, r, {
+              value: je
+            })
+          });
+        }
+        oe < 0 && I("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+      }
+    }
+    var ye = z.ReactCurrentDispatcher, ge;
+    function le(r, s, u) {
+      {
+        if (ge === void 0)
+          try {
+            throw Error();
+          } catch (T) {
+            var v = T.stack.trim().match(/\n( *(at )?)/);
+            ge = v && v[1] || "";
+          }
+        return `
+` + ge + r;
+      }
+    }
+    var be = !1, ce;
+    {
+      var Ue = typeof WeakMap == "function" ? WeakMap : Map;
+      ce = new Ue();
+    }
+    function d(r, s) {
+      if (!r || be)
+        return "";
+      {
+        var u = ce.get(r);
+        if (u !== void 0)
+          return u;
+      }
+      var v;
+      be = !0;
+      var T = Error.prepareStackTrace;
+      Error.prepareStackTrace = void 0;
+      var C;
+      C = ye.current, ye.current = null, Be();
+      try {
+        if (s) {
+          var b = function() {
+            throw Error();
+          };
+          if (Object.defineProperty(b.prototype, "props", {
+            set: function() {
+              throw Error();
+            }
+          }), typeof Reflect == "object" && Reflect.construct) {
+            try {
+              Reflect.construct(b, []);
+            } catch (V) {
+              v = V;
+            }
+            Reflect.construct(r, [], b);
+          } else {
+            try {
+              b.call();
+            } catch (V) {
+              v = V;
+            }
+            r.call(b.prototype);
+          }
+        } else {
+          try {
+            throw Error();
+          } catch (V) {
+            v = V;
+          }
+          r();
+        }
+      } catch (V) {
+        if (V && v && typeof V.stack == "string") {
+          for (var g = V.stack.split(`
+`), N = v.stack.split(`
+`), O = g.length - 1, M = N.length - 1; O >= 1 && M >= 0 && g[O] !== N[M]; )
+            M--;
+          for (; O >= 1 && M >= 0; O--, M--)
+            if (g[O] !== N[M]) {
+              if (O !== 1 || M !== 1)
+                do
+                  if (O--, M--, M < 0 || g[O] !== N[M]) {
+                    var W = `
+` + g[O].replace(" at new ", " at ");
+                    return r.displayName && W.includes("<anonymous>") && (W = W.replace("<anonymous>", r.displayName)), typeof r == "function" && ce.set(r, W), W;
+                  }
+                while (O >= 1 && M >= 0);
+              break;
+            }
+        }
+      } finally {
+        be = !1, ye.current = C, We(), Error.prepareStackTrace = T;
+      }
+      var de = r ? r.displayName || r.name : "", se = de ? le(de) : "";
+      return typeof r == "function" && ce.set(r, se), se;
+    }
+    function Ee(r, s, u) {
+      return d(r, !1);
+    }
+    function ue(r) {
+      var s = r.prototype;
+      return !!(s && s.isReactComponent);
+    }
+    function ae(r, s, u) {
+      if (r == null)
+        return "";
+      if (typeof r == "function")
+        return d(r, ue(r));
+      if (typeof r == "string")
+        return le(r);
+      switch (r) {
+        case p:
+          return le("Suspense");
+        case E:
+          return le("SuspenseList");
+      }
+      if (typeof r == "object")
+        switch (r.$$typeof) {
+          case h:
+            return Ee(r.render);
+          case P:
+            return ae(r.type, s, u);
+          case D: {
+            var v = r, T = v._payload, C = v._init;
+            try {
+              return ae(C(T), s, u);
+            } catch {
+            }
+          }
+        }
+      return "";
+    }
+    var Te = Object.prototype.hasOwnProperty, ft = {}, dt = z.ReactDebugCurrentFrame;
+    function $e(r) {
+      if (r) {
+        var s = r._owner, u = ae(r.type, r._source, s ? s.type : null);
+        dt.setExtraStackFrame(u);
+      } else
+        dt.setExtraStackFrame(null);
+    }
+    function rr(r, s, u, v, T) {
+      {
+        var C = Function.call.bind(Te);
+        for (var b in r)
+          if (C(r, b)) {
+            var g = void 0;
+            try {
+              if (typeof r[b] != "function") {
+                var N = Error((v || "React class") + ": " + u + " type `" + b + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof r[b] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw N.name = "Invariant Violation", N;
+              }
+              g = r[b](s, b, v, u, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (O) {
+              g = O;
+            }
+            g && !(g instanceof Error) && ($e(T), I("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", v || "React class", u, b, typeof g), $e(null)), g instanceof Error && !(g.message in ft) && (ft[g.message] = !0, $e(T), I("Failed %s type: %s", u, g.message), $e(null));
+          }
+      }
+    }
+    var nr = Array.isArray;
+    function qe(r) {
+      return nr(r);
+    }
+    function ir(r) {
+      {
+        var s = typeof Symbol == "function" && Symbol.toStringTag, u = s && r[Symbol.toStringTag] || r.constructor.name || "Object";
+        return u;
+      }
+    }
+    function or(r) {
+      try {
+        return mt(r), !1;
+      } catch {
+        return !0;
+      }
+    }
+    function mt(r) {
+      return "" + r;
+    }
+    function ht(r) {
+      if (or(r))
+        return I("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", ir(r)), mt(r);
+    }
+    var vt = z.ReactCurrentOwner, ar = {
+      key: !0,
+      ref: !0,
+      __self: !0,
+      __source: !0
+    }, pt, yt;
+    function sr(r) {
+      if (Te.call(r, "ref")) {
+        var s = Object.getOwnPropertyDescriptor(r, "ref").get;
+        if (s && s.isReactWarning)
+          return !1;
+      }
+      return r.ref !== void 0;
+    }
+    function lr(r) {
+      if (Te.call(r, "key")) {
+        var s = Object.getOwnPropertyDescriptor(r, "key").get;
+        if (s && s.isReactWarning)
+          return !1;
+      }
+      return r.key !== void 0;
+    }
+    function cr(r, s) {
+      typeof r.ref == "string" && vt.current;
+    }
+    function ur(r, s) {
+      {
+        var u = function() {
+          pt || (pt = !0, I("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", s));
+        };
+        u.isReactWarning = !0, Object.defineProperty(r, "key", {
+          get: u,
+          configurable: !0
+        });
+      }
+    }
+    function fr(r, s) {
+      {
+        var u = function() {
+          yt || (yt = !0, I("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", s));
+        };
+        u.isReactWarning = !0, Object.defineProperty(r, "ref", {
+          get: u,
+          configurable: !0
+        });
+      }
+    }
+    var dr = function(r, s, u, v, T, C, b) {
+      var g = {
+        // This tag allows us to uniquely identify this as a React Element
+        $$typeof: e,
+        // Built-in properties that belong on the element
+        type: r,
+        key: s,
+        ref: u,
+        props: b,
+        // Record the component responsible for creating this element.
+        _owner: C
+      };
+      return g._store = {}, Object.defineProperty(g._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: !1
+      }), Object.defineProperty(g, "_self", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: v
+      }), Object.defineProperty(g, "_source", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: T
+      }), Object.freeze && (Object.freeze(g.props), Object.freeze(g)), g;
+    };
+    function mr(r, s, u, v, T) {
+      {
+        var C, b = {}, g = null, N = null;
+        u !== void 0 && (ht(u), g = "" + u), lr(s) && (ht(s.key), g = "" + s.key), sr(s) && (N = s.ref, cr(s, T));
+        for (C in s)
+          Te.call(s, C) && !ar.hasOwnProperty(C) && (b[C] = s[C]);
+        if (r && r.defaultProps) {
+          var O = r.defaultProps;
+          for (C in O)
+            b[C] === void 0 && (b[C] = O[C]);
+        }
+        if (g || N) {
+          var M = typeof r == "function" ? r.displayName || r.name || "Unknown" : r;
+          g && ur(b, M), N && fr(b, M);
+        }
+        return dr(r, g, N, T, v, vt.current, b);
+      }
+    }
+    var He = z.ReactCurrentOwner, gt = z.ReactDebugCurrentFrame;
+    function fe(r) {
+      if (r) {
+        var s = r._owner, u = ae(r.type, r._source, s ? s.type : null);
+        gt.setExtraStackFrame(u);
+      } else
+        gt.setExtraStackFrame(null);
+    }
+    var Ge;
+    Ge = !1;
+    function Je(r) {
+      return typeof r == "object" && r !== null && r.$$typeof === e;
+    }
+    function bt() {
+      {
+        if (He.current) {
+          var r = J(He.current.type);
+          if (r)
+            return `
+
+Check the render method of \`` + r + "`.";
+        }
+        return "";
+      }
+    }
+    function hr(r) {
+      return "";
+    }
+    var Et = {};
+    function vr(r) {
+      {
+        var s = bt();
+        if (!s) {
+          var u = typeof r == "string" ? r : r.displayName || r.name;
+          u && (s = `
+
+Check the top-level render call using <` + u + ">.");
+        }
+        return s;
+      }
+    }
+    function Tt(r, s) {
+      {
+        if (!r._store || r._store.validated || r.key != null)
+          return;
+        r._store.validated = !0;
+        var u = vr(s);
+        if (Et[u])
+          return;
+        Et[u] = !0;
+        var v = "";
+        r && r._owner && r._owner !== He.current && (v = " It was passed a child from " + J(r._owner.type) + "."), fe(r), I('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, v), fe(null);
+      }
+    }
+    function xt(r, s) {
+      {
+        if (typeof r != "object")
+          return;
+        if (qe(r))
+          for (var u = 0; u < r.length; u++) {
+            var v = r[u];
+            Je(v) && Tt(v, s);
+          }
+        else if (Je(r))
+          r._store && (r._store.validated = !0);
+        else if (r) {
+          var T = Q(r);
+          if (typeof T == "function" && T !== r.entries)
+            for (var C = T.call(r), b; !(b = C.next()).done; )
+              Je(b.value) && Tt(b.value, s);
+        }
+      }
+    }
+    function pr(r) {
+      {
+        var s = r.type;
+        if (s == null || typeof s == "string")
+          return;
+        var u;
+        if (typeof s == "function")
+          u = s.propTypes;
+        else if (typeof s == "object" && (s.$$typeof === h || // Note: Memo only checks outer props here.
+        // Inner props are checked in the reconciler.
+        s.$$typeof === P))
+          u = s.propTypes;
+        else
+          return;
+        if (u) {
+          var v = J(s);
+          rr(u, r.props, "prop", v, r);
+        } else if (s.PropTypes !== void 0 && !Ge) {
+          Ge = !0;
+          var T = J(s);
+          I("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", T || "Unknown");
+        }
+        typeof s.getDefaultProps == "function" && !s.getDefaultProps.isReactClassApproved && I("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+      }
+    }
+    function yr(r) {
+      {
+        for (var s = Object.keys(r.props), u = 0; u < s.length; u++) {
+          var v = s[u];
+          if (v !== "children" && v !== "key") {
+            fe(r), I("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", v), fe(null);
+            break;
+          }
+        }
+        r.ref !== null && (fe(r), I("Invalid attribute `ref` supplied to `React.Fragment`."), fe(null));
+      }
+    }
+    var St = {};
+    function Ct(r, s, u, v, T, C) {
+      {
+        var b = Ve(r);
+        if (!b) {
+          var g = "";
+          (r === void 0 || typeof r == "object" && r !== null && Object.keys(r).length === 0) && (g += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var N = hr();
+          N ? g += N : g += bt();
+          var O;
+          r === null ? O = "null" : qe(r) ? O = "array" : r !== void 0 && r.$$typeof === e ? (O = "<" + (J(r.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : O = typeof r, I("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", O, g);
+        }
+        var M = mr(r, s, u, T, C);
+        if (M == null)
+          return M;
+        if (b) {
+          var W = s.children;
+          if (W !== void 0)
+            if (v)
+              if (qe(W)) {
+                for (var de = 0; de < W.length; de++)
+                  xt(W[de], r);
+                Object.freeze && Object.freeze(W);
+              } else
+                I("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+            else
+              xt(W, r);
+        }
+        if (Te.call(s, "key")) {
+          var se = J(r), V = Object.keys(s).filter(function(Sr) {
+            return Sr !== "key";
+          }), Ke = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!St[se + Ke]) {
+            var xr = V.length > 0 ? "{" + V.join(": ..., ") + ": ...}" : "{}";
+            I(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`, Ke, se, xr, se), St[se + Ke] = !0;
+          }
+        }
+        return r === i ? yr(M) : pr(M), M;
+      }
+    }
+    function gr(r, s, u) {
+      return Ct(r, s, u, !0);
+    }
+    function br(r, s, u) {
+      return Ct(r, s, u, !1);
+    }
+    var Er = br, Tr = gr;
+    Se.Fragment = i, Se.jsx = Er, Se.jsxs = Tr;
+  }()), Se;
+}
+var _t;
+function En() {
+  return _t || (_t = 1, process.env.NODE_ENV === "production" ? De.exports = gn() : De.exports = bn()), De.exports;
+}
+var Ie = En(), ze = { exports: {} }, x = {};
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var At;
+function Tn() {
+  if (At) return x;
+  At = 1;
+  var t = typeof Symbol == "function" && Symbol.for, e = t ? Symbol.for("react.element") : 60103, n = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, l = t ? Symbol.for("react.profiler") : 60114, f = t ? Symbol.for("react.provider") : 60109, m = t ? Symbol.for("react.context") : 60110, h = t ? Symbol.for("react.async_mode") : 60111, p = t ? Symbol.for("react.concurrent_mode") : 60111, E = t ? Symbol.for("react.forward_ref") : 60112, P = t ? Symbol.for("react.suspense") : 60113, D = t ? Symbol.for("react.suspense_list") : 60120, j = t ? Symbol.for("react.memo") : 60115, A = t ? Symbol.for("react.lazy") : 60116, B = t ? Symbol.for("react.block") : 60121, Q = t ? Symbol.for("react.fundamental") : 60117, z = t ? Symbol.for("react.responder") : 60118, I = t ? Symbol.for("react.scope") : 60119;
+  function k(c) {
+    if (typeof c == "object" && c !== null) {
+      var L = c.$$typeof;
+      switch (L) {
+        case e:
+          switch (c = c.type, c) {
+            case h:
+            case p:
+            case i:
+            case l:
+            case a:
+            case P:
+              return c;
+            default:
+              switch (c = c && c.$$typeof, c) {
+                case m:
+                case E:
+                case A:
+                case j:
+                case f:
+                  return c;
+                default:
+                  return L;
+              }
+          }
+        case n:
+          return L;
+      }
+    }
+  }
+  function w(c) {
+    return k(c) === p;
+  }
+  return x.AsyncMode = h, x.ConcurrentMode = p, x.ContextConsumer = m, x.ContextProvider = f, x.Element = e, x.ForwardRef = E, x.Fragment = i, x.Lazy = A, x.Memo = j, x.Portal = n, x.Profiler = l, x.StrictMode = a, x.Suspense = P, x.isAsyncMode = function(c) {
+    return w(c) || k(c) === h;
+  }, x.isConcurrentMode = w, x.isContextConsumer = function(c) {
+    return k(c) === m;
+  }, x.isContextProvider = function(c) {
+    return k(c) === f;
+  }, x.isElement = function(c) {
+    return typeof c == "object" && c !== null && c.$$typeof === e;
+  }, x.isForwardRef = function(c) {
+    return k(c) === E;
+  }, x.isFragment = function(c) {
+    return k(c) === i;
+  }, x.isLazy = function(c) {
+    return k(c) === A;
+  }, x.isMemo = function(c) {
+    return k(c) === j;
+  }, x.isPortal = function(c) {
+    return k(c) === n;
+  }, x.isProfiler = function(c) {
+    return k(c) === l;
+  }, x.isStrictMode = function(c) {
+    return k(c) === a;
+  }, x.isSuspense = function(c) {
+    return k(c) === P;
+  }, x.isValidElementType = function(c) {
+    return typeof c == "string" || typeof c == "function" || c === i || c === p || c === l || c === a || c === P || c === D || typeof c == "object" && c !== null && (c.$$typeof === A || c.$$typeof === j || c.$$typeof === f || c.$$typeof === m || c.$$typeof === E || c.$$typeof === Q || c.$$typeof === z || c.$$typeof === I || c.$$typeof === B);
+  }, x.typeOf = k, x;
+}
+var S = {};
+/** @license React v16.13.1
+ * react-is.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var kt;
+function xn() {
+  return kt || (kt = 1, process.env.NODE_ENV !== "production" && function() {
+    var t = typeof Symbol == "function" && Symbol.for, e = t ? Symbol.for("react.element") : 60103, n = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, l = t ? Symbol.for("react.profiler") : 60114, f = t ? Symbol.for("react.provider") : 60109, m = t ? Symbol.for("react.context") : 60110, h = t ? Symbol.for("react.async_mode") : 60111, p = t ? Symbol.for("react.concurrent_mode") : 60111, E = t ? Symbol.for("react.forward_ref") : 60112, P = t ? Symbol.for("react.suspense") : 60113, D = t ? Symbol.for("react.suspense_list") : 60120, j = t ? Symbol.for("react.memo") : 60115, A = t ? Symbol.for("react.lazy") : 60116, B = t ? Symbol.for("react.block") : 60121, Q = t ? Symbol.for("react.fundamental") : 60117, z = t ? Symbol.for("react.responder") : 60118, I = t ? Symbol.for("react.scope") : 60119;
+    function k(d) {
+      return typeof d == "string" || typeof d == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+      d === i || d === p || d === l || d === a || d === P || d === D || typeof d == "object" && d !== null && (d.$$typeof === A || d.$$typeof === j || d.$$typeof === f || d.$$typeof === m || d.$$typeof === E || d.$$typeof === Q || d.$$typeof === z || d.$$typeof === I || d.$$typeof === B);
+    }
+    function w(d) {
+      if (typeof d == "object" && d !== null) {
+        var Ee = d.$$typeof;
+        switch (Ee) {
+          case e:
+            var ue = d.type;
+            switch (ue) {
+              case h:
+              case p:
+              case i:
+              case l:
+              case a:
+              case P:
+                return ue;
+              default:
+                var ae = ue && ue.$$typeof;
+                switch (ae) {
+                  case m:
+                  case E:
+                  case A:
+                  case j:
+                  case f:
+                    return ae;
+                  default:
+                    return Ee;
+                }
+            }
+          case n:
+            return Ee;
+        }
+      }
+    }
+    var c = h, L = p, he = m, we = f, Oe = e, Ve = E, Ye = i, _e = A, J = j, ee = n, oe = l, Ae = a, ke = P, ve = !1;
+    function Me(d) {
+      return ve || (ve = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), pe(d) || w(d) === h;
+    }
+    function pe(d) {
+      return w(d) === p;
+    }
+    function Fe(d) {
+      return w(d) === m;
+    }
+    function je(d) {
+      return w(d) === f;
+    }
+    function Ne(d) {
+      return typeof d == "object" && d !== null && d.$$typeof === e;
+    }
+    function Be(d) {
+      return w(d) === E;
+    }
+    function We(d) {
+      return w(d) === i;
+    }
+    function ye(d) {
+      return w(d) === A;
+    }
+    function ge(d) {
+      return w(d) === j;
+    }
+    function le(d) {
+      return w(d) === n;
+    }
+    function be(d) {
+      return w(d) === l;
+    }
+    function ce(d) {
+      return w(d) === a;
+    }
+    function Ue(d) {
+      return w(d) === P;
+    }
+    S.AsyncMode = c, S.ConcurrentMode = L, S.ContextConsumer = he, S.ContextProvider = we, S.Element = Oe, S.ForwardRef = Ve, S.Fragment = Ye, S.Lazy = _e, S.Memo = J, S.Portal = ee, S.Profiler = oe, S.StrictMode = Ae, S.Suspense = ke, S.isAsyncMode = Me, S.isConcurrentMode = pe, S.isContextConsumer = Fe, S.isContextProvider = je, S.isElement = Ne, S.isForwardRef = Be, S.isFragment = We, S.isLazy = ye, S.isMemo = ge, S.isPortal = le, S.isProfiler = be, S.isStrictMode = ce, S.isSuspense = Ue, S.isValidElementType = k, S.typeOf = w;
+  }()), S;
+}
+var Mt;
+function Sn() {
+  return Mt || (Mt = 1, process.env.NODE_ENV === "production" ? ze.exports = Tn() : ze.exports = xn()), ze.exports;
+}
+var Ze, Ft;
+function Cn() {
+  if (Ft) return Ze;
+  Ft = 1;
+  var t = Sn(), e = {
+    childContextTypes: !0,
+    contextType: !0,
+    contextTypes: !0,
+    defaultProps: !0,
+    displayName: !0,
+    getDefaultProps: !0,
+    getDerivedStateFromError: !0,
+    getDerivedStateFromProps: !0,
+    mixins: !0,
+    propTypes: !0,
+    type: !0
+  }, n = {
+    name: !0,
+    length: !0,
+    prototype: !0,
+    caller: !0,
+    callee: !0,
+    arguments: !0,
+    arity: !0
+  }, i = {
+    $$typeof: !0,
+    render: !0,
+    defaultProps: !0,
+    displayName: !0,
+    propTypes: !0
+  }, a = {
+    $$typeof: !0,
+    compare: !0,
+    defaultProps: !0,
+    displayName: !0,
+    propTypes: !0,
+    type: !0
+  }, l = {};
+  l[t.ForwardRef] = i, l[t.Memo] = a;
+  function f(A) {
+    return t.isMemo(A) ? a : l[A.$$typeof] || e;
+  }
+  var m = Object.defineProperty, h = Object.getOwnPropertyNames, p = Object.getOwnPropertySymbols, E = Object.getOwnPropertyDescriptor, P = Object.getPrototypeOf, D = Object.prototype;
+  function j(A, B, Q) {
+    if (typeof B != "string") {
+      if (D) {
+        var z = P(B);
+        z && z !== D && j(A, z, Q);
+      }
+      var I = h(B);
+      p && (I = I.concat(p(B)));
+      for (var k = f(A), w = f(B), c = 0; c < I.length; ++c) {
+        var L = I[c];
+        if (!n[L] && !(Q && Q[L]) && !(w && w[L]) && !(k && k[L])) {
+          var he = E(B, L);
+          try {
+            m(A, L, he);
+          } catch {
+          }
+        }
+      }
+    }
+    return A;
+  }
+  return Ze = j, Ze;
+}
+Cn();
+var In = !0;
+function Pn(t, e, n) {
+  var i = "";
+  return n.split(" ").forEach(function(a) {
+    t[a] !== void 0 ? e.push(t[a] + ";") : a && (i += a + " ");
+  }), i;
+}
+var Ht = function(e, n, i) {
+  var a = e.key + "-" + n.name;
+  // we only need to add the styles to the registered cache if the
+  // class name could be used further down
+  // the tree but if it's a string tag, we know it won't
+  // so we don't have to add it to registered cache.
+  // this improves memory usage since we can avoid storing the whole style string
+  (i === !1 || // we need to always store it if we're in compat mode and
+  // in node since emotion-server relies on whether a style is in
+  // the registered cache to know whether a style is global or not
+  // also, note that this check will be dead code eliminated in the browser
+  In === !1) && e.registered[a] === void 0 && (e.registered[a] = n.styles);
+}, Rn = function(e, n, i) {
+  Ht(e, n, i);
+  var a = e.key + "-" + n.name;
+  if (e.inserted[n.name] === void 0) {
+    var l = n;
+    do
+      e.insert(n === l ? "." + a : "", l, e.sheet, !0), l = l.next;
+    while (l !== void 0);
+  }
+};
+function wn(t) {
+  for (var e = 0, n, i = 0, a = t.length; a >= 4; ++i, a -= 4)
+    n = t.charCodeAt(i) & 255 | (t.charCodeAt(++i) & 255) << 8 | (t.charCodeAt(++i) & 255) << 16 | (t.charCodeAt(++i) & 255) << 24, n = /* Math.imul(k, m): */
+    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), n ^= /* k >>> r: */
+    n >>> 24, e = /* Math.imul(k, m): */
+    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16) ^ /* Math.imul(h, m): */
+    (e & 65535) * 1540483477 + ((e >>> 16) * 59797 << 16);
+  switch (a) {
+    case 3:
+      e ^= (t.charCodeAt(i + 2) & 255) << 16;
+    case 2:
+      e ^= (t.charCodeAt(i + 1) & 255) << 8;
+    case 1:
+      e ^= t.charCodeAt(i) & 255, e = /* Math.imul(h, m): */
+      (e & 65535) * 1540483477 + ((e >>> 16) * 59797 << 16);
+  }
+  return e ^= e >>> 13, e = /* Math.imul(h, m): */
+  (e & 65535) * 1540483477 + ((e >>> 16) * 59797 << 16), ((e ^ e >>> 15) >>> 0).toString(36);
+}
+var On = {
+  animationIterationCount: 1,
+  aspectRatio: 1,
+  borderImageOutset: 1,
+  borderImageSlice: 1,
+  borderImageWidth: 1,
+  boxFlex: 1,
+  boxFlexGroup: 1,
+  boxOrdinalGroup: 1,
+  columnCount: 1,
+  columns: 1,
+  flex: 1,
+  flexGrow: 1,
+  flexPositive: 1,
+  flexShrink: 1,
+  flexNegative: 1,
+  flexOrder: 1,
+  gridRow: 1,
+  gridRowEnd: 1,
+  gridRowSpan: 1,
+  gridRowStart: 1,
+  gridColumn: 1,
+  gridColumnEnd: 1,
+  gridColumnSpan: 1,
+  gridColumnStart: 1,
+  msGridRow: 1,
+  msGridRowSpan: 1,
+  msGridColumn: 1,
+  msGridColumnSpan: 1,
+  fontWeight: 1,
+  lineHeight: 1,
+  opacity: 1,
+  order: 1,
+  orphans: 1,
+  scale: 1,
+  tabSize: 1,
+  widows: 1,
+  zIndex: 1,
+  zoom: 1,
+  WebkitLineClamp: 1,
+  // SVG-related properties
+  fillOpacity: 1,
+  floodOpacity: 1,
+  stopOpacity: 1,
+  strokeDasharray: 1,
+  strokeDashoffset: 1,
+  strokeMiterlimit: 1,
+  strokeOpacity: 1,
+  strokeWidth: 1
+};
+function _n(t) {
+  var e = /* @__PURE__ */ Object.create(null);
+  return function(n) {
+    return e[n] === void 0 && (e[n] = t(n)), e[n];
+  };
+}
+var An = /[A-Z]|^ms/g, kn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Gt = function(e) {
+  return e.charCodeAt(1) === 45;
+}, jt = function(e) {
+  return e != null && typeof e != "boolean";
+}, Qe = /* @__PURE__ */ _n(function(t) {
+  return Gt(t) ? t : t.replace(An, "-$&").toLowerCase();
+}), Nt = function(e, n) {
+  switch (e) {
+    case "animation":
+    case "animationName":
+      if (typeof n == "string")
+        return n.replace(kn, function(i, a, l) {
+          return X = {
+            name: a,
+            styles: l,
+            next: X
+          }, a;
+        });
+  }
+  return On[e] !== 1 && !Gt(e) && typeof n == "number" && n !== 0 ? n + "px" : n;
+};
+function Pe(t, e, n) {
+  if (n == null)
+    return "";
+  var i = n;
+  if (i.__emotion_styles !== void 0)
+    return i;
+  switch (typeof n) {
+    case "boolean":
+      return "";
+    case "object": {
+      var a = n;
+      if (a.anim === 1)
+        return X = {
+          name: a.name,
+          styles: a.styles,
+          next: X
+        }, a.name;
+      var l = n;
+      if (l.styles !== void 0) {
+        var f = l.next;
+        if (f !== void 0)
+          for (; f !== void 0; )
+            X = {
+              name: f.name,
+              styles: f.styles,
+              next: X
+            }, f = f.next;
+        var m = l.styles + ";";
+        return m;
+      }
+      return Mn(t, e, n);
+    }
+    case "function": {
+      if (t !== void 0) {
+        var h = X, p = n(t);
+        return X = h, Pe(t, e, p);
+      }
+      break;
+    }
+  }
+  var E = n;
+  return E;
+}
+function Mn(t, e, n) {
+  var i = "";
+  if (Array.isArray(n))
+    for (var a = 0; a < n.length; a++)
+      i += Pe(t, e, n[a]) + ";";
+  else
+    for (var l in n) {
+      var f = n[l];
+      if (typeof f != "object") {
+        var m = f;
+        jt(m) && (i += Qe(l) + ":" + Nt(l, m) + ";");
+      } else if (Array.isArray(f) && typeof f[0] == "string" && e == null)
+        for (var h = 0; h < f.length; h++)
+          jt(f[h]) && (i += Qe(l) + ":" + Nt(l, f[h]) + ";");
+      else {
+        var p = Pe(t, e, f);
+        switch (l) {
+          case "animation":
+          case "animationName": {
+            i += Qe(l) + ":" + p + ";";
+            break;
+          }
+          default:
+            i += l + "{" + p + "}";
+        }
+      }
+    }
+  return i;
+}
+var $t = /label:\s*([^\s;{]+)\s*(;|$)/g, X;
+function Fn(t, e, n) {
+  if (t.length === 1 && typeof t[0] == "object" && t[0] !== null && t[0].styles !== void 0)
+    return t[0];
+  var i = !0, a = "";
+  X = void 0;
+  var l = t[0];
+  if (l == null || l.raw === void 0)
+    i = !1, a += Pe(n, e, l);
+  else {
+    var f = l;
+    a += f[0];
+  }
+  for (var m = 1; m < t.length; m++)
+    if (a += Pe(n, e, t[m]), i) {
+      var h = l;
+      a += h[m];
+    }
+  $t.lastIndex = 0;
+  for (var p = "", E; (E = $t.exec(a)) !== null; )
+    p += "-" + E[1];
+  var P = wn(a) + p;
+  return {
+    name: P,
+    styles: a,
+    next: X
+  };
+}
+var jn = function(e) {
+  return e();
+}, Nn = te.useInsertionEffect ? te.useInsertionEffect : !1, $n = Nn || jn, Jt = /* @__PURE__ */ te.createContext(
+  // we're doing this to avoid preconstruct's dead code elimination in this one case
+  // because this module is primarily intended for the browser and node
+  // but it's also required in react native and similar environments sometimes
+  // and we could have a special build just for that
+  // but this is much easier and the native packages
+  // might use a different theme context in the future anyway
+  typeof HTMLElement < "u" ? /* @__PURE__ */ Or({
+    key: "css"
+  }) : null
+);
+Jt.Provider;
+var Dn = function(e) {
+  return /* @__PURE__ */ Pr(function(n, i) {
+    var a = st(Jt);
+    return e(n, a, i);
+  });
+}, zn = /* @__PURE__ */ te.createContext({}), Le = {}.hasOwnProperty, it = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", Kt = function(e, n) {
+  var i = {};
+  for (var a in n)
+    Le.call(n, a) && (i[a] = n[a]);
+  return i[it] = e, i;
+}, Ln = function(e) {
+  var n = e.cache, i = e.serialized, a = e.isStringTag;
+  return Ht(n, i, a), $n(function() {
+    return Rn(n, i, a);
+  }), null;
+}, Vn = /* @__PURE__ */ Dn(function(t, e, n) {
+  var i = t.css;
+  typeof i == "string" && e.registered[i] !== void 0 && (i = e.registered[i]);
+  var a = t[it], l = [i], f = "";
+  typeof t.className == "string" ? f = Pn(e.registered, l, t.className) : t.className != null && (f = t.className + " ");
+  var m = Fn(l, void 0, te.useContext(zn));
+  f += e.key + "-" + m.name;
+  var h = {};
+  for (var p in t)
+    Le.call(t, p) && p !== "css" && p !== it && (h[p] = t[p]);
+  return h.className = f, n && (h.ref = n), /* @__PURE__ */ te.createElement(te.Fragment, null, /* @__PURE__ */ te.createElement(Ln, {
+    cache: e,
+    serialized: m,
+    isStringTag: typeof a == "string"
+  }), /* @__PURE__ */ te.createElement(a, h));
+}), Xt = Vn, Re = Ie.Fragment, o = function(e, n, i) {
+  return Le.call(n, "css") ? Ie.jsx(Xt, Kt(e, n), i) : Ie.jsx(e, n, i);
+}, F = function(e, n, i) {
+  return Le.call(n, "css") ? Ie.jsxs(Xt, Kt(e, n), i) : Ie.jsxs(e, n, i);
+}, R = /* @__PURE__ */ ((t) => (t.Off = "Off", t.All = "All", t.One = "One", t))(R || {});
+const Zt = 80, Yn = Y(({ playerStore: t }) => {
+  const e = ie(), n = $(
+    (l) => {
+      const f = Number(l.currentTarget.value) / 100;
+      t.setPercent(f);
     },
-    [n]
-  ), s = u(
-    (a) => {
-      a.button === 0 && n.setSeeking(!0);
+    [t]
+  ), i = $(
+    (l) => {
+      l.button === 0 && t.setSeeking(!0);
     },
-    [n]
-  ), l = u(
-    async (a) => {
-      if (a.button === 0) {
-        const m = Number(a.currentTarget.value) / 100;
-        n.setSeeking(!1);
-        const d = await e.getDuration();
-        d !== void 0 && await e.setCurrentTime(d * m);
+    [t]
+  ), a = $(
+    async (l) => {
+      if (l.button === 0) {
+        const f = Number(l.currentTarget.value) / 100;
+        t.setSeeking(!1);
+        const m = await e.getDuration();
+        m !== void 0 && await e.setCurrentTime(m * f);
       }
     },
-    [n, e]
+    [t, e]
   );
-  return /* @__PURE__ */ t.createElement(
-    j,
+  return /* @__PURE__ */ o(
+    Vt,
     {
       min: 0,
       max: 100,
       step: 1e-7,
-      value: n.percent * 100,
-      onChange: i,
-      onMouseDown: s,
-      onMouseUp: l,
+      value: t.percent * 100,
+      onChange: n,
+      onMouseDown: i,
+      onMouseUp: a,
       fullWidth: !0,
       showRange: !0,
       css: { blockSize: 32 }
     }
   );
-}), Je = y(
-  ({ button: n, isOpen: e, closePopover: i }) => {
-    const [s, l] = g("0"), a = C();
-    Le(() => {
-      e && a.getVolume().then((d) => {
-        d !== void 0 && l(Math.floor(d * 100).toString());
+}), Bn = Z(
+  ({ button: t, isOpen: e, closePopover: n }) => {
+    const [i, a] = q("0"), l = ie();
+    Rr(() => {
+      e && l.getVolume().then((m) => {
+        m !== void 0 && a(Math.floor(m * 100).toString());
       });
-    }, [e, a]);
-    const m = u(
-      async (d) => {
-        l(d.currentTarget.value), await a.setVolume(Number(d.currentTarget.value) / 100);
+    }, [e, l]);
+    const f = $(
+      async (m) => {
+        a(m.currentTarget.value), await l.setVolume(Number(m.currentTarget.value) / 100);
       },
-      [a]
+      [l]
     );
-    return /* @__PURE__ */ t.createElement(
-      F,
+    return /* @__PURE__ */ o(
+      lt,
       {
-        button: n,
+        button: t,
         isOpen: e,
-        closePopover: i,
-        anchorPosition: "upRight"
-      },
-      /* @__PURE__ */ t.createElement(O, null, /* @__PURE__ */ t.createElement(
-        k,
-        {
-          responsive: !1,
-          gutterSize: "s",
-          justifyContent: "center",
-          alignItems: "center"
-        },
-        /* @__PURE__ */ t.createElement(
-          I,
+        closePopover: n,
+        anchorPosition: "upRight",
+        children: /* @__PURE__ */ o(tt, { children: /* @__PURE__ */ F(
+          me,
           {
-            title: "Mute",
-            "aria-label": "Mute",
-            iconType: q,
-            size: "s",
-            iconSize: "l"
+            responsive: !1,
+            gutterSize: "s",
+            justifyContent: "center",
+            alignItems: "center",
+            children: [
+              /* @__PURE__ */ o(
+                K,
+                {
+                  title: "Mute",
+                  "aria-label": "Mute",
+                  iconType: Ut,
+                  size: "s",
+                  iconSize: "l"
+                }
+              ),
+              /* @__PURE__ */ o(
+                Vt,
+                {
+                  min: 0,
+                  max: 100,
+                  step: 1,
+                  value: i,
+                  onChange: f,
+                  css: { blockSize: 32 }
+                }
+              )
+            ]
           }
-        ),
-        /* @__PURE__ */ t.createElement(
-          j,
-          {
-            min: 0,
-            max: 100,
-            step: 1,
-            value: s,
-            onChange: m,
-            css: { blockSize: 32 }
-          }
-        )
-      ))
+        ) })
+      }
     );
   }
-), Ge = y(
+), Wn = Z(
   ({
-    playQueueStore: n,
+    playQueueStore: t,
     closePopover: e
   }) => {
-    const i = C(), s = u(async () => {
-      const f = await i.getCurrentTime();
-      f !== void 0 && await i.setCurrentTime(f - 10), e();
-    }, [i, e]), l = u(async () => {
-      const f = await i.getCurrentTime();
-      f !== void 0 && await i.setCurrentTime(f + 30), e();
-    }, [i, e]), a = u(
-      async (f) => {
-        await i.setPlaybackRate(f), e();
+    const n = ie(), i = $(async () => {
+      const p = await n.getCurrentTime();
+      p !== void 0 && await n.setCurrentTime(p - 10), e();
+    }, [n, e]), a = $(async () => {
+      const p = await n.getCurrentTime();
+      p !== void 0 && await n.setCurrentTime(p + 30), e();
+    }, [n, e]), l = $(
+      async (p) => {
+        await n.setPlaybackRate(p), e();
       },
-      [i, e]
-    ), m = u(async () => {
-      n.currentItem !== void 0 && await n.removeItems([
-        n.currentItem
+      [n, e]
+    ), f = $(async () => {
+      t.currentItem !== void 0 && await t.removeItems([
+        t.currentItem
       ]), e();
-    }, [n, e]), [d] = g(), T = G(
+    }, [t, e]), [m] = q(), h = zt(
       () => [
         {
           id: 0,
           items: [
             {
               name: "Speed",
-              icon: /* @__PURE__ */ t.createElement(E, { type: Te, size: "m" }),
+              icon: /* @__PURE__ */ o(H, { type: sn, size: "m" }),
               panel: 1
             },
             {
               name: "Skip back 10 seconds",
-              icon: /* @__PURE__ */ t.createElement(E, { type: xe, size: "m" }),
-              onClick: s,
-              disabled: n.isEmpty
+              icon: /* @__PURE__ */ o(H, { type: ln, size: "m" }),
+              onClick: i,
+              disabled: t.isEmpty
             },
             {
               name: "Skip forward 30 seconds",
-              icon: /* @__PURE__ */ t.createElement(E, { type: Ce, size: "m" }),
-              onClick: l,
-              disabled: n.isEmpty
+              icon: /* @__PURE__ */ o(H, { type: cn, size: "m" }),
+              onClick: a,
+              disabled: t.isEmpty
             },
             {
               isSeparator: !0
             },
             {
               name: "Remove from play queue",
-              icon: /* @__PURE__ */ t.createElement(E, { type: B, size: "m" }),
-              onClick: m,
-              disabled: n.isEmpty
+              icon: /* @__PURE__ */ o(H, { type: ct, size: "m" }),
+              onClick: f,
+              disabled: t.isEmpty
             }
           ]
         },
@@ -160,452 +1303,492 @@ const Y = 80, qe = h(({ playerStore: n }) => {
           id: 1,
           title: "Speed",
           items: [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2].map(
-            (f) => ({
-              name: f.toString(),
-              onClick: () => a(f),
-              icon: f === d ? "check" : "empty"
+            (p) => ({
+              name: p.toString(),
+              onClick: () => l(p),
+              icon: p === m ? "check" : "empty"
             })
           )
         }
       ],
       [
-        n,
-        s,
-        l,
-        m,
+        t,
+        i,
         a,
-        d
+        f,
+        l,
+        m
       ]
     );
-    return /* @__PURE__ */ t.createElement(ie, { initialPanelId: 0, panels: T });
+    return /* @__PURE__ */ o(Mr, { initialPanelId: 0, panels: h });
   }
-), We = y(
+), Un = Z(
   ({
-    playQueueStore: n,
+    playQueueStore: t,
     button: e,
-    isOpen: i,
-    closePopover: s
-  }) => /* @__PURE__ */ t.createElement(
-    F,
+    isOpen: n,
+    closePopover: i
+  }) => /* @__PURE__ */ o(
+    lt,
     {
       button: e,
-      isOpen: i,
-      closePopover: s,
+      isOpen: n,
+      closePopover: i,
       panelPaddingSize: "none",
-      anchorPosition: "upRight"
-    },
-    /* @__PURE__ */ t.createElement(
-      Ge,
-      {
-        playQueueStore: n,
-        closePopover: s
-      }
-    )
+      anchorPosition: "upRight",
+      children: /* @__PURE__ */ o(
+        Wn,
+        {
+          playQueueStore: t,
+          closePopover: i
+        }
+      )
+    }
   )
-), Xe = {
-  [o.Off]: Pe,
-  [o.All]: we,
-  [o.One]: ke
-}, Ye = h(
+), qn = {
+  [R.Off]: Qr,
+  [R.All]: Zr,
+  [R.One]: Xr
+}, Hn = Y(
   ({
-    playerStore: n,
+    playerStore: t,
     playQueueStore: e
   }) => {
-    const i = C(), s = u(async () => {
+    const n = ie(), i = $(async () => {
       if (e.hasPreviousItem) {
-        const l = await i.getCurrentTime();
-        l === void 0 || l < 5 ? await e.previous() : await i.setCurrentTime(0);
+        const a = await n.getCurrentTime();
+        a === void 0 || a < 5 ? await e.previous() : await n.setCurrentTime(0);
       } else
-        await i.setCurrentTime(0);
-    }, [e, i]);
-    return /* @__PURE__ */ t.createElement(
-      k,
+        await n.setCurrentTime(0);
+    }, [e, n]);
+    return /* @__PURE__ */ F(
+      me,
       {
         responsive: !1,
         gutterSize: "s",
         justifyContent: "center",
-        alignItems: "center"
-      },
-      /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
-          "aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
-          iconType: e.shuffle ? Se : Oe,
-          size: "s",
-          iconSize: "l",
-          onClick: e.toggleShuffle,
-          disabled: !0
-        }
-      ),
-      /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: "Previous",
-          "aria-label": "Previous",
-          iconType: Ae,
-          size: "s",
-          iconSize: "l",
-          onClick: s,
-          disabled: e.isEmpty
-        }
-      ),
-      n.playing ? /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: "Pause",
-          "aria-label": "Pause",
-          iconType: ze,
-          size: "s",
-          iconSize: "l",
-          onClick: () => i.pause(),
-          disabled: !e.canPlay
-        }
-      ) : /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: "Play",
-          "aria-label": "Play",
-          iconType: Me,
-          size: "s",
-          iconSize: "l",
-          onClick: () => i.play(),
-          disabled: !e.canPlay
-        }
-      ),
-      /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: "Next",
-          "aria-label": "Next",
-          iconType: Re,
-          size: "s",
-          iconSize: "l",
-          onClick: e.next,
-          disabled: !e.hasNextItem
-        }
-      ),
-      /* @__PURE__ */ t.createElement(
-        I,
-        {
-          title: `Repeat: ${e.repeat === o.All ? "All" : e.repeat === o.One ? "One" : "Off"}`,
-          "aria-label": `Repeat: ${e.repeat === o.All ? "All" : e.repeat === o.One ? "One" : "Off"}`,
-          iconType: Xe[e.repeat],
-          size: "s",
-          iconSize: "l",
-          onClick: e.toggleRepeat
-        }
-      )
+        alignItems: "center",
+        children: [
+          /* @__PURE__ */ o(
+            K,
+            {
+              title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
+              "aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
+              iconType: e.shuffle ? en : tn,
+              size: "s",
+              iconSize: "l",
+              onClick: e.toggleShuffle,
+              disabled: !0
+            }
+          ),
+          /* @__PURE__ */ o(
+            K,
+            {
+              title: "Previous",
+              "aria-label": "Previous",
+              iconType: rn,
+              size: "s",
+              iconSize: "l",
+              onClick: i,
+              disabled: e.isEmpty
+            }
+          ),
+          t.playing ? /* @__PURE__ */ o(
+            K,
+            {
+              title: "Pause",
+              "aria-label": "Pause",
+              iconType: nn,
+              size: "s",
+              iconSize: "l",
+              onClick: () => n.pause(),
+              disabled: !e.canPlay
+            }
+          ) : /* @__PURE__ */ o(
+            K,
+            {
+              title: "Play",
+              "aria-label": "Play",
+              iconType: on,
+              size: "s",
+              iconSize: "l",
+              onClick: () => n.play(),
+              disabled: !e.canPlay
+            }
+          ),
+          /* @__PURE__ */ o(
+            K,
+            {
+              title: "Next",
+              "aria-label": "Next",
+              iconType: an,
+              size: "s",
+              iconSize: "l",
+              onClick: e.next,
+              disabled: !e.hasNextItem
+            }
+          ),
+          /* @__PURE__ */ o(
+            K,
+            {
+              title: `Repeat: ${e.repeat === R.All ? "All" : e.repeat === R.One ? "One" : "Off"}`,
+              "aria-label": `Repeat: ${e.repeat === R.All ? "All" : e.repeat === R.One ? "One" : "Off"}`,
+              iconType: qn[e.repeat],
+              size: "s",
+              iconSize: "l",
+              onClick: e.toggleRepeat
+            }
+          )
+        ]
+      }
     );
   }
-), Ke = y(() => {
-  const [n, e] = g(!1), i = () => e(!n);
-  return /* @__PURE__ */ t.createElement(
-    Je,
+), Gn = Z(() => {
+  const [t, e] = q(!1);
+  return /* @__PURE__ */ o(
+    Bn,
     {
-      button: /* @__PURE__ */ t.createElement(
-        I,
+      button: /* @__PURE__ */ o(
+        K,
         {
           title: "Volume",
           "aria-label": "Volume",
-          iconType: q,
+          iconType: Ut,
           size: "s",
           iconSize: "l",
-          onClick: i
+          onClick: () => e(!t)
         }
       ),
-      isOpen: n,
+      isOpen: t,
       closePopover: () => e(!1)
     }
   );
-}), Ze = y(
-  ({ playQueueStore: n }) => {
-    const [e, i] = g(!1), s = () => i(!e);
-    return /* @__PURE__ */ t.createElement(
-      We,
+}), Jn = Z(
+  ({ playQueueStore: t }) => {
+    const [e, n] = q(!1);
+    return /* @__PURE__ */ o(
+      Un,
       {
-        playQueueStore: n,
-        button: /* @__PURE__ */ t.createElement(
-          I,
+        playQueueStore: t,
+        button: /* @__PURE__ */ o(
+          K,
           {
             title: "More options",
             "aria-label": "More options",
-            iconType: J,
+            iconType: qt,
             size: "s",
             iconSize: "l",
-            onClick: s
+            onClick: () => n(!e)
           }
         ),
         isOpen: e,
-        closePopover: () => i(!1)
+        closePopover: () => n(!1)
       }
     );
   }
-), _e = y(
-  ({ playQueueStore: n }) => /* @__PURE__ */ t.createElement(
-    k,
+), Kn = Z(
+  ({ playQueueStore: t }) => /* @__PURE__ */ F(
+    me,
     {
       responsive: !1,
       gutterSize: "s",
       justifyContent: "flexEnd",
-      alignItems: "center"
-    },
-    /* @__PURE__ */ t.createElement(Ke, null),
-    /* @__PURE__ */ t.createElement(Ze, { playQueueStore: n })
-  )
-), St = h(
-  ({ playerStore: n, playQueueStore: e }) => /* @__PURE__ */ t.createElement(se, { paddingSize: "s" }, /* @__PURE__ */ t.createElement(k, { direction: "column", gutterSize: "none" }, /* @__PURE__ */ t.createElement(v, null, /* @__PURE__ */ t.createElement(qe, { playerStore: n })), /* @__PURE__ */ t.createElement(v, null, /* @__PURE__ */ t.createElement(k, { responsive: !1 }, /* @__PURE__ */ t.createElement(v, { css: { width: "calc(100% / 3)" } }), /* @__PURE__ */ t.createElement(v, { css: { width: "calc(100% / 3)" } }, /* @__PURE__ */ t.createElement(
-    Ye,
-    {
-      playerStore: n,
-      playQueueStore: e
-    }
-  )), /* @__PURE__ */ t.createElement(v, { css: { width: "calc(100% / 3)" } }, /* @__PURE__ */ t.createElement(
-    _e,
-    {
-      playQueueStore: e
+      alignItems: "center",
+      children: [
+        /* @__PURE__ */ o(Gn, {}),
+        /* @__PURE__ */ o(Jn, { playQueueStore: t })
+      ]
     }
-  ))))))
-), Qe = ({
-  onCancel: n,
+  )
+), Ri = Y(
+  ({ playerStore: t, playQueueStore: e }) => /* @__PURE__ */ o(kr, { paddingSize: "s", children: /* @__PURE__ */ F(me, { direction: "column", gutterSize: "none", children: [
+    /* @__PURE__ */ o(G, { children: /* @__PURE__ */ o(Yn, { playerStore: t }) }),
+    /* @__PURE__ */ o(G, { children: /* @__PURE__ */ F(me, { responsive: !1, children: [
+      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" } }),
+      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
+        Hn,
+        {
+          playerStore: t,
+          playQueueStore: e
+        }
+      ) }),
+      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
+        Kn,
+        {
+          playQueueStore: e
+        }
+      ) })
+    ] }) })
+  ] }) })
+), Xn = ({
+  onCancel: t,
   onSave: e
 }) => {
-  const [i, s] = g(""), [l, a] = g(""), [m, d] = g(!1);
-  return /* @__PURE__ */ t.createElement(re, { onClose: n, initialFocus: "[name=url]" }, /* @__PURE__ */ t.createElement(le, null, /* @__PURE__ */ t.createElement(ae, null, "Add video")), /* @__PURE__ */ t.createElement(oe, null, /* @__PURE__ */ t.createElement(ce, { component: "form" }, /* @__PURE__ */ t.createElement(O, { label: "URL" }, /* @__PURE__ */ t.createElement(
-    V,
-    {
-      name: "url",
-      value: i,
-      onChange: (T) => s(T.target.value)
-    }
-  )), /* @__PURE__ */ t.createElement(O, { label: "Title" }, /* @__PURE__ */ t.createElement(
-    V,
-    {
-      name: "title",
-      value: l,
-      onChange: (T) => a(T.target.value)
-    }
-  )))), /* @__PURE__ */ t.createElement(me, null, /* @__PURE__ */ t.createElement(de, { onClick: n }, "Cancel"), /* @__PURE__ */ t.createElement(
-    x,
-    {
-      type: "submit",
-      onClick: async () => {
-        try {
-          d(!0), await e({ url: i, title: l });
-        } finally {
-          d(!1);
+  const [n, i] = q(""), [a, l] = q(""), [f, m] = q(!1);
+  return /* @__PURE__ */ F(Lr, { onClose: t, initialFocus: "[name=url]", children: [
+    /* @__PURE__ */ o(jr, { children: /* @__PURE__ */ o(Fr, { children: "Add video" }) }),
+    /* @__PURE__ */ o($r, { children: /* @__PURE__ */ F(Nr, { component: "form", children: [
+      /* @__PURE__ */ o(tt, { label: "URL", children: /* @__PURE__ */ o(
+        It,
+        {
+          name: "url",
+          value: n,
+          onChange: (h) => i(h.target.value)
         }
-      },
-      fill: !0,
-      disabled: i.trim().length === 0,
-      isLoading: m
-    },
-    "Save"
-  )));
+      ) }),
+      /* @__PURE__ */ o(tt, { label: "Title", children: /* @__PURE__ */ o(
+        It,
+        {
+          name: "title",
+          value: a,
+          onChange: (h) => l(h.target.value)
+        }
+      ) })
+    ] }) }),
+    /* @__PURE__ */ F(Dr, { children: [
+      /* @__PURE__ */ o(zr, { onClick: t, children: "Cancel" }),
+      /* @__PURE__ */ o(
+        ne,
+        {
+          type: "submit",
+          onClick: async () => {
+            try {
+              m(!0), await e({ url: n, title: a });
+            } finally {
+              m(!1);
+            }
+          },
+          fill: !0,
+          disabled: n.trim().length === 0,
+          isLoading: f,
+          children: "Save"
+        }
+      )
+    ] })
+  ] });
 };
-function et(n) {
-  return n !== null && typeof n == "object" && "title" in n && typeof n.title == "string";
+function Zn(t) {
+  return t !== null && typeof t == "object" && "title" in t && typeof t.title == "string";
 }
-const tt = y(
-  ({ playQueueStore: n }) => {
-    const [e, i] = g(!1), s = u(
-      async (l) => {
-        const a = te(l.url);
-        if (a !== void 0) {
-          const m = a.extractVideoId(l.url);
-          if (m !== void 0) {
-            const T = await (await fetch(
+const Qn = Z(
+  ({ playQueueStore: t }) => {
+    const [e, n] = q(!1), i = $(
+      async (a) => {
+        const l = _r(a.url);
+        if (l !== void 0) {
+          const f = l.extractVideoId(a.url);
+          if (f !== void 0) {
+            const h = await (await fetch(
               `https://noembed.com/embed?url=${encodeURIComponent(
-                l.url
+                a.url
               )}`
             )).json();
-            await n.addItems([
-              n.createItem({
-                url: l.url,
-                type: a.type,
-                videoId: m,
-                title: l.title || (et(T) ? T.title : m)
+            await t.addItems([
+              t.createItem({
+                url: a.url,
+                type: l.type,
+                videoId: f,
+                title: a.title || (Zn(h) ? h.title : f)
               })
             ]);
           }
         }
-        i(!1);
+        n(!1);
       },
-      [n]
+      [t]
     );
-    return /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
-      x,
-      {
-        onClick: () => i(!0),
-        iconType: N,
-        color: "primary"
-      },
-      "Add video"
-    ), e && /* @__PURE__ */ t.createElement(
-      Qe,
-      {
-        onCancel: () => i(!1),
-        onSave: s
-      }
-    ));
+    return /* @__PURE__ */ F(Re, { children: [
+      /* @__PURE__ */ o(
+        ne,
+        {
+          onClick: () => n(!0),
+          iconType: ut,
+          color: "primary",
+          children: "Add video"
+        }
+      ),
+      e && /* @__PURE__ */ o(
+        Xn,
+        {
+          onCancel: () => n(!1),
+          onSave: i
+        }
+      )
+    ] });
   }
-), nt = h(
-  ({ playQueueStore: n }) => {
-    const { euiTheme: e } = H();
-    return /* @__PURE__ */ t.createElement(
-      ue,
+), ei = Y(
+  ({ playQueueStore: t }) => {
+    const { euiTheme: e } = Yt();
+    return /* @__PURE__ */ F(
+      Yr,
       {
         style: {
           position: "sticky",
           top: 112,
           zIndex: 998,
           background: e.colors.backgroundBasePlain
-        }
-      },
-      /* @__PURE__ */ t.createElement(he, null, /* @__PURE__ */ t.createElement(
-        U,
-        {
-          id: "",
-          checked: n.allItemsSelected,
-          onChange: (i) => {
-            n.allItemsSelected = i.target.checked;
-          }
-        }
-      )),
-      /* @__PURE__ */ t.createElement(P, { width: 24 }),
-      /* @__PURE__ */ t.createElement(P, null, "Title"),
-      /* @__PURE__ */ t.createElement(P, null)
+        },
+        children: [
+          /* @__PURE__ */ o(Vr, { children: /* @__PURE__ */ o(
+            Bt,
+            {
+              id: "",
+              checked: t.allItemsSelected,
+              onChange: (n) => {
+                t.allItemsSelected = n.target.checked;
+              }
+            }
+          ) }),
+          /* @__PURE__ */ o(Xe, { width: 24 }),
+          /* @__PURE__ */ o(Xe, { children: "Title" }),
+          /* @__PURE__ */ o(Xe, {})
+        ]
+      }
     );
   }
-), it = y(
+), ti = Z(
   ({
-    item: n,
+    item: t,
     closePopover: e
   }) => {
-    const i = y(
+    const n = Z(
       ({
-        onClick: s,
-        ...l
+        onClick: i,
+        ...a
       }) => {
-        const a = u(
-          (m) => {
-            e(), s == null || s(m);
+        const l = $(
+          (f) => {
+            e(), i == null || i(f);
           },
-          [s]
+          [i]
         );
-        return /* @__PURE__ */ t.createElement(pe, { ...l, onClick: a });
+        return /* @__PURE__ */ o(Br, { ...a, onClick: l });
       }
     );
-    return /* @__PURE__ */ t.createElement(ge, null, /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: "" }),
-        onClick: n.playFirst
-      },
-      "Play first"
-    ), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: "" }),
-        onClick: n.playNext
-      },
-      "Play next"
-    ), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: N }),
-        onClick: n.addToPlayQueue
-      },
-      "Add to play queue"
-    ), /* @__PURE__ */ t.createElement(L, { margin: "none" }), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: Fe }),
-        onClick: n.moveToTop,
-        disabled: !n.canMoveToTop
-      },
-      "Move to the top"
-    ), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: Be }),
-        onClick: n.moveToBottom,
-        disabled: !n.canMoveToBottom
-      },
-      "Move to the bottom"
-    ), /* @__PURE__ */ t.createElement(L, { margin: "none" }), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: "" }),
-        onClick: n.removeToTop,
-        disabled: !n.canRemoveToTop
-      },
-      "Remove to the top"
-    ), /* @__PURE__ */ t.createElement(
-      i,
-      {
-        icon: /* @__PURE__ */ t.createElement(E, { type: "" }),
-        onClick: n.removeOthers,
-        disabled: !n.canRemoveOthers
-      },
-      "Remove others"
-    ));
-  }
-), st = y(
-  ({ item: n }) => {
-    const [e, i] = g(!1), s = u(() => i(!e), [e]), l = u(() => i(!1), []);
-    return /* @__PURE__ */ t.createElement(
-      F,
+    return /* @__PURE__ */ F(Wr, { children: [
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: "" }),
+          onClick: t.playFirst,
+          children: "Play first"
+        }
+      ),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: "" }),
+          onClick: t.playNext,
+          children: "Play next"
+        }
+      ),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: ut }),
+          onClick: t.addToPlayQueue,
+          children: "Add to play queue"
+        }
+      ),
+      /* @__PURE__ */ o(Pt, { margin: "none" }),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: un }),
+          onClick: t.moveToTop,
+          disabled: !t.canMoveToTop,
+          children: "Move to the top"
+        }
+      ),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: fn }),
+          onClick: t.moveToBottom,
+          disabled: !t.canMoveToBottom,
+          children: "Move to the bottom"
+        }
+      ),
+      /* @__PURE__ */ o(Pt, { margin: "none" }),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: "" }),
+          onClick: t.removeToTop,
+          disabled: !t.canRemoveToTop,
+          children: "Remove to the top"
+        }
+      ),
+      /* @__PURE__ */ o(
+        n,
+        {
+          icon: /* @__PURE__ */ o(H, { type: "" }),
+          onClick: t.removeOthers,
+          disabled: !t.canRemoveOthers,
+          children: "Remove others"
+        }
+      )
+    ] });
+  }
+), ri = Z(
+  ({ item: t }) => {
+    const [e, n] = q(!1), i = $(() => n(!e), [e]), a = $(() => n(!1), []);
+    return /* @__PURE__ */ o(
+      lt,
       {
-        button: /* @__PURE__ */ t.createElement(
-          I,
+        button: /* @__PURE__ */ o(
+          K,
           {
             title: "More options",
             "aria-label": "More options",
-            iconType: J,
+            iconType: qt,
             size: "s",
             color: "text",
-            onClick: s
+            onClick: i
           }
         ),
         isOpen: e,
-        closePopover: l,
+        closePopover: a,
         panelPaddingSize: "none",
-        anchorPosition: "leftCenter"
-      },
-      /* @__PURE__ */ t.createElement(
-        it,
-        {
-          item: n,
-          closePopover: l
-        }
-      )
+        anchorPosition: "leftCenter",
+        children: /* @__PURE__ */ o(
+          ti,
+          {
+            item: t,
+            closePopover: a
+          }
+        )
+      }
     );
   }
-), rt = h(
-  ({ item: n }) => {
-    const e = C();
-    return /* @__PURE__ */ t.createElement(A, { textOnly: !1, hasActions: !0, align: "right" }, /* @__PURE__ */ t.createElement(
-      x,
-      {
-        iconType: Ne,
-        size: "s",
-        onClick: async () => {
-          n.isCurrent ? await e.setCurrentTime(0) : n.play();
+), ni = Y(
+  ({ item: t }) => {
+    const e = ie();
+    return /* @__PURE__ */ F(rt, { textOnly: !1, hasActions: !0, align: "right", children: [
+      /* @__PURE__ */ o(
+        ne,
+        {
+          iconType: dn,
+          size: "s",
+          onClick: async () => {
+            t.isCurrent ? await e.setCurrentTime(0) : t.play();
+          },
+          children: "Play"
         }
-      },
-      "Play"
-    ), /* @__PURE__ */ t.createElement(
-      x,
-      {
-        iconType: B,
-        size: "s",
-        onClick: n.remove
-      },
-      "Remove"
-    ), /* @__PURE__ */ t.createElement(st, { item: n }));
+      ),
+      /* @__PURE__ */ o(
+        ne,
+        {
+          iconType: ct,
+          size: "s",
+          onClick: t.remove,
+          children: "Remove"
+        }
+      ),
+      /* @__PURE__ */ o(ri, { item: t })
+    ] });
   }
-), lt = {
+), ii = {
   Audio: "",
   Dailymotion: "https://www.dailymotion.com/favicon.ico",
   Niconico: "https://www.nicovideo.jp/favicon.ico",
@@ -613,251 +1796,273 @@ const tt = y(
   Twitch: "https://www.twitch.tv/favicon.ico",
   Vimeo: "https://vimeo.com/favicon.ico",
   YouTube: "https://www.youtube.com/favicon.ico"
-}, at = h(
-  ({ item: n }) => {
-    const e = C();
-    return /* @__PURE__ */ t.createElement(fe, { key: n.id, isSelected: n.isCurrent }, /* @__PURE__ */ t.createElement(Ee, null, /* @__PURE__ */ t.createElement(
-      U,
-      {
-        id: n.id.toString(),
-        checked: n.isSelected,
-        onChange: n.toggleSelected
-      }
-    )), /* @__PURE__ */ t.createElement(A, { textOnly: !1 }, /* @__PURE__ */ t.createElement(
-      "img",
-      {
-        src: lt[n.type],
-        width: 16,
-        height: 16,
-        alt: n.type
-      }
-    )), /* @__PURE__ */ t.createElement(A, null, /* @__PURE__ */ t.createElement(
-      ve,
-      {
-        href: n.url,
-        target: "_blank",
-        external: !0,
-        onClick: () => e.pause()
-      },
-      n.title
-    )), /* @__PURE__ */ t.createElement(rt, { item: n }));
+}, oi = Y(
+  ({ item: t }) => {
+    const e = ie();
+    return /* @__PURE__ */ F(Hr, { isSelected: t.isCurrent, children: [
+      /* @__PURE__ */ o(Ur, { children: /* @__PURE__ */ o(
+        Bt,
+        {
+          id: t.id.toString(),
+          checked: t.isSelected,
+          onChange: t.toggleSelected
+        }
+      ) }),
+      /* @__PURE__ */ o(rt, { textOnly: !1, children: /* @__PURE__ */ o(
+        "img",
+        {
+          src: ii[t.type],
+          width: 16,
+          height: 16,
+          alt: t.type
+        }
+      ) }),
+      /* @__PURE__ */ o(rt, { children: /* @__PURE__ */ o(
+        qr,
+        {
+          href: t.url,
+          target: "_blank",
+          external: !0,
+          onClick: () => e.pause(),
+          children: t.title
+        }
+      ) }),
+      /* @__PURE__ */ o(ni, { item: t })
+    ] }, t.id);
   }
-), ot = h(
-  ({ playQueueStore: n }) => /* @__PURE__ */ t.createElement(
-    je,
+), ai = Y(
+  ({ playQueueStore: t }) => /* @__PURE__ */ o(
+    hn,
     {
       tag: "tbody",
-      list: n.items,
-      setList: (e) => n.setItems(e)
-    },
-    n.items.map((e) => /* @__PURE__ */ t.createElement(at, { key: e.id, item: e }))
+      list: t.items,
+      setList: (e) => t.setItems(e),
+      children: t.items.map((e) => /* @__PURE__ */ o(oi, { item: e }, e.id))
+    }
   )
-), ct = h(
-  ({ playQueueStore: n }) => /* @__PURE__ */ t.createElement(Ie, null, /* @__PURE__ */ t.createElement(nt, { playQueueStore: n }), /* @__PURE__ */ t.createElement(ot, { playQueueStore: n }))
-), mt = h(
-  ({ playQueueStore: n }) => {
-    const [e, i] = g(!1);
-    return /* @__PURE__ */ t.createElement(t.Fragment, null, e && /* @__PURE__ */ t.createElement(
-      ye,
-      {
-        type: "push",
-        size: "s",
-        onClose: () => i(!1)
-      },
-      /* @__PURE__ */ t.createElement("div", { style: { blockSize: "100%" } }, /* @__PURE__ */ t.createElement(
-        be,
+), si = Y(
+  ({ playQueueStore: t }) => /* @__PURE__ */ F(Gr, { children: [
+    /* @__PURE__ */ o(ei, { playQueueStore: t }),
+    /* @__PURE__ */ o(ai, { playQueueStore: t })
+  ] })
+), li = Y(
+  ({ playQueueStore: t }) => {
+    const [e, n] = q(!1);
+    return /* @__PURE__ */ F(Re, { children: [
+      e && /* @__PURE__ */ o(
+        Kr,
         {
-          language: "json",
-          overflowHeight: "100%",
-          isCopyable: !0,
-          isVirtualized: !0
-        },
-        JSON.stringify(
-          n.localStorageState,
-          void 0,
-          2
-        )
-      ))
-    ), /* @__PURE__ */ t.createElement(tt, { playQueueStore: n }));
-  }
-), dt = h(
-  ({ playerStore: n, playQueueStore: e }) => {
-    const { euiTheme: i } = H();
-    return /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
-      k,
-      {
-        alignItems: "center",
-        gutterSize: "m",
-        style: {
-          position: "sticky",
-          top: 48,
-          zIndex: 998,
-          background: i.colors.backgroundBasePlain
+          type: "push",
+          size: "s",
+          onClose: () => n(!1),
+          children: /* @__PURE__ */ o("div", { style: { blockSize: "100%" }, children: /* @__PURE__ */ o(
+            Jr,
+            {
+              language: "json",
+              overflowHeight: "100%",
+              isCopyable: !0,
+              isVirtualized: !0,
+              children: JSON.stringify(
+                t.localStorageState,
+                void 0,
+                2
+              )
+            }
+          ) })
         }
-      },
-      /* @__PURE__ */ t.createElement(v, { grow: !1 }, /* @__PURE__ */ t.createElement(
-        x,
-        {
-          disabled: e.isEmpty || e.selectedItems.length === 0,
-          onClick: e.playSelectedItemsNext
-        },
-        "Play next"
-      )),
-      /* @__PURE__ */ t.createElement(v, { grow: !1 }, /* @__PURE__ */ t.createElement(
-        x,
-        {
-          iconType: N,
-          onClick: e.addSelectedItems,
-          disabled: e.isEmpty || e.selectedItems.length === 0
-        },
-        "Add to play queue"
-      )),
-      /* @__PURE__ */ t.createElement(v, { grow: !1 }, /* @__PURE__ */ t.createElement(
-        x,
-        {
-          iconType: B,
-          onClick: e.removeSelectedItems,
-          disabled: e.isEmpty || e.selectedItems.length === 0
-        },
-        "Remove"
-      )),
-      /* @__PURE__ */ t.createElement(v, { grow: !1 }, /* @__PURE__ */ t.createElement(
-        x,
+      ),
+      /* @__PURE__ */ o(Qn, { playQueueStore: t })
+    ] });
+  }
+), ci = Y(
+  ({ playerStore: t, playQueueStore: e }) => {
+    const { euiTheme: n } = Yt();
+    return /* @__PURE__ */ F(Re, { children: [
+      /* @__PURE__ */ F(
+        me,
         {
-          iconType: Ve,
-          onClick: e.clear,
-          disabled: e.isEmpty
-        },
-        "Clear"
-      )),
-      /* @__PURE__ */ t.createElement(v, { grow: !0 }),
-      /* @__PURE__ */ t.createElement(v, { grow: !1 }, /* @__PURE__ */ t.createElement(mt, { playQueueStore: e }))
-    ), !e.isEmpty && /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
-      $,
-      {
-        size: "l",
-        style: {
-          position: "sticky",
-          top: 88,
-          zIndex: 998,
-          background: i.colors.backgroundBasePlain
+          alignItems: "center",
+          gutterSize: "m",
+          style: {
+            position: "sticky",
+            top: 48,
+            zIndex: 998,
+            background: n.colors.backgroundBasePlain
+          },
+          children: [
+            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+              ne,
+              {
+                disabled: e.isEmpty || e.selectedItems.length === 0,
+                onClick: e.playSelectedItemsNext,
+                children: "Play next"
+              }
+            ) }),
+            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+              ne,
+              {
+                iconType: ut,
+                onClick: e.addSelectedItems,
+                disabled: e.isEmpty || e.selectedItems.length === 0,
+                children: "Add to play queue"
+              }
+            ) }),
+            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+              ne,
+              {
+                iconType: ct,
+                onClick: e.removeSelectedItems,
+                disabled: e.isEmpty || e.selectedItems.length === 0,
+                children: "Remove"
+              }
+            ) }),
+            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+              ne,
+              {
+                iconType: mn,
+                onClick: e.clear,
+                disabled: e.isEmpty,
+                children: "Clear"
+              }
+            ) }),
+            /* @__PURE__ */ o(G, { grow: !0 }),
+            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(li, { playQueueStore: e }) })
+          ]
         }
+      ),
+      !e.isEmpty && /* @__PURE__ */ F(Re, { children: [
+        /* @__PURE__ */ o(
+          Wt,
+          {
+            size: "l",
+            style: {
+              position: "sticky",
+              top: 88,
+              zIndex: 998,
+              background: n.colors.backgroundBasePlain
+            }
+          }
+        ),
+        /* @__PURE__ */ o(si, { playQueueStore: e })
+      ] })
+    ] });
+  }
+), wi = Y(
+  ({ playerStore: t, playQueueStore: e }) => /* @__PURE__ */ F(Re, { children: [
+    /* @__PURE__ */ o(
+      nt.Header,
+      {
+        pageTitle: "Play queue",
+        rightSideItems: []
       }
-    ), /* @__PURE__ */ t.createElement(ct, { playQueueStore: e })));
-  }
-), Ot = h(
-  ({ playerStore: n, playQueueStore: e }) => /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
-    z.Header,
-    {
-      pageTitle: "Play queue",
-      rightSideItems: []
-    }
-  ), /* @__PURE__ */ t.createElement(z.Section, null, /* @__PURE__ */ t.createElement(
-    dt,
-    {
-      playerStore: n,
-      playQueueStore: e
-    }
-  )))
-), M = {
+    ),
+    /* @__PURE__ */ o(nt.Section, { children: /* @__PURE__ */ o(
+      ci,
+      {
+        playerStore: t,
+        playQueueStore: e
+      }
+    ) })
+  ] })
+), ot = {
   width: 16 * 25,
   height: 9 * 25
-}, At = h(
-  ({ playerStore: n, playQueueStore: e }) => {
-    const i = C(), s = u(async () => {
-      e.interacted && await i.play();
-    }, [e, i]), l = u(async () => {
+}, Oi = Y(
+  ({ playerStore: t, playQueueStore: e }) => {
+    const n = ie(), i = $(async () => {
+      e.interacted && await n.play();
+    }, [e, n]), a = $(async () => {
       switch (e.repeat) {
-        case o.One:
-          await i.setCurrentTime(0);
+        case R.One:
+          await n.setCurrentTime(0);
           break;
-        case o.Off:
-        case o.All:
+        case R.Off:
+        case R.All:
           if (e.isLastItem)
             switch (e.repeat) {
-              case o.Off:
-                n.onEnded();
+              case R.Off:
+                t.onEnded();
                 break;
-              case o.All:
-                e.hasMultipleItems ? await e.goToFirst() : await i.setCurrentTime(0);
+              case R.All:
+                e.hasMultipleItems ? await e.goToFirst() : await n.setCurrentTime(0);
                 break;
             }
           else
             await e.next();
           break;
       }
-    }, [e, n, i]), a = G(
+    }, [e, t, n]), l = zt(
       () => ({
-        onLoaded: s,
-        onPlay: n.onPlay,
-        onPause: n.onPause,
-        onEnded: l,
-        onTimeUpdate: n.onTimeUpdate
+        onLoaded: i,
+        onPlay: t.onPlay,
+        onPause: t.onPause,
+        onEnded: a,
+        onTimeUpdate: t.onTimeUpdate
       }),
-      [n, s, l]
+      [t, i, a]
     );
-    return /* @__PURE__ */ t.createElement(
+    return /* @__PURE__ */ o(
       "div",
       {
         css: {
           position: "fixed",
           right: 0,
-          bottom: Y,
-          width: M.width,
-          height: M.height,
+          bottom: Zt,
+          width: ot.width,
+          height: ot.height,
           zIndex: 998,
           backgroundColor: "rgb(39, 39, 39)",
           display: "flex",
           flexDirection: "column"
-        }
-      },
-      /* @__PURE__ */ t.createElement("div", { css: { flexGrow: 1, backgroundColor: "black" } }, e.currentItem && /* @__PURE__ */ t.createElement(
-        ne,
-        {
-          src: e.currentItem.url,
-          options: a
-        }
-      ))
+        },
+        children: /* @__PURE__ */ o("div", { css: { flexGrow: 1, backgroundColor: "black" }, children: e.currentItem && /* @__PURE__ */ o(
+          Ar,
+          {
+            src: e.currentItem.url,
+            options: l
+          }
+        ) })
+      }
     );
   }
 );
-class K {
-  makeObservable(e, i) {
-    return He(e, i);
+class Qt {
+  makeObservable(e, n) {
+    return vn(e, n);
   }
 }
-const w = class w {
-  constructor(e, i, s) {
-    p(this, "id");
-    p(this, "isSelected", !1);
-    this.observableStateProvider = e, this.playQueueStore = i, this.dto = s, this.id = w.nextId++, e.makeObservable(this, {
-      isSelected: b,
-      isCurrent: c,
-      index: c,
-      isFirst: c,
-      isLast: c,
-      canMoveToTop: c,
-      canMoveToBottom: c,
-      canRemoveToTop: c,
-      canRemoveOthers: c,
-      unselect: r,
-      toggleSelected: r.bound,
-      play: r,
-      remove: r.bound,
-      playFirst: r.bound,
-      playNext: r.bound,
-      addToPlayQueue: r.bound,
-      moveToTop: r.bound,
-      moveToBottom: r.bound,
-      removeToTop: r.bound,
-      removeOthers: r.bound
+const Ce = class Ce {
+  constructor(e, n, i) {
+    U(this, "id");
+    U(this, "isSelected", !1);
+    this.observableStateProvider = e, this.playQueueStore = n, this.dto = i, this.id = Ce.nextId++, e.makeObservable(this, {
+      isSelected: re,
+      isCurrent: _,
+      index: _,
+      isFirst: _,
+      isLast: _,
+      canMoveToTop: _,
+      canMoveToBottom: _,
+      canRemoveToTop: _,
+      canRemoveOthers: _,
+      unselect: y,
+      toggleSelected: y.bound,
+      play: y,
+      remove: y.bound,
+      playFirst: y.bound,
+      playNext: y.bound,
+      addToPlayQueue: y.bound,
+      moveToTop: y.bound,
+      moveToBottom: y.bound,
+      removeToTop: y.bound,
+      removeOthers: y.bound
     });
   }
-  static fromDto(e, i, s) {
-    return new w(
+  static fromDto(e, n, i) {
+    return new Ce(
       e,
-      i,
-      s
+      n,
+      i
     );
   }
   get url() {
@@ -936,22 +2141,22 @@ const w = class w {
     return this.playQueueStore.removeOtherItems(this);
   }
 };
-p(w, "nextId", 1);
-let R = w;
-const S = new $e({
+U(Ce, "nextId", 1);
+let at = Ce;
+const et = new yn({
   coerceTypes: !0
 });
-function ut(n, e) {
-  let i;
-  if (i = S.getSchema(e), i === void 0 && (S.addSchema(n, e), i = S.getSchema(e)), i === void 0 || i.schema !== n)
+function ui(t, e) {
+  let n;
+  if (n = et.getSchema(e), n === void 0 && (et.addSchema(t, e), n = et.getSchema(e)), n === void 0 || n.schema !== t)
     throw new Error(
       `Invalid schema. Expected: '${JSON.stringify(
-        n
-      )}', but got '${JSON.stringify(i == null ? void 0 : i.schema)}'.`
+        t
+      )}', but got '${JSON.stringify(n == null ? void 0 : n.schema)}'.`
     );
-  return i;
+  return n;
 }
-const ht = {
+const fi = {
   type: "object",
   properties: {
     version: {
@@ -960,7 +2165,7 @@ const ht = {
     },
     repeat: {
       type: "string",
-      enum: Object.values(o),
+      enum: Object.values(R),
       nullable: !0
     },
     shuffle: {
@@ -994,62 +2199,62 @@ const ht = {
       nullable: !0
     }
   }
-}, pt = ut(
-  ht,
+}, di = ui(
+  fi,
   "PlayQueueStore"
 );
-class gt {
+class mi {
   constructor(e) {
-    p(this, "interacted", !1);
-    p(this, "items", []);
-    p(this, "currentId");
-    p(this, "repeat", o.Off);
-    p(this, "shuffle", !1);
+    U(this, "interacted", !1);
+    U(this, "items", []);
+    U(this, "currentId");
+    U(this, "repeat", R.Off);
+    U(this, "shuffle", !1);
     this.observableStateProvider = e, e.makeObservable(this, {
-      interacted: b,
-      items: b,
-      currentId: b,
-      repeat: b,
-      shuffle: b,
-      localStorageState: c.struct,
-      isEmpty: c,
-      currentItem: c,
-      canPlay: c,
-      canPause: c,
-      hasMultipleItems: c,
-      currentIndex: c,
-      hasPreviousItem: c,
-      hasNextItem: c,
-      isLastItem: c,
-      selectedItems: c,
-      allItemsSelected: c,
-      selectedItemsOrAllItems: c,
-      setItems: r,
-      interact: r,
-      clear: r.bound,
-      unselectAll: r,
-      setCurrentItem: r,
-      setNextItems: r,
-      clearAndSetItems: r,
-      playNext: r,
-      playSelectedItemsNext: r.bound,
-      addItems: r,
-      addSelectedItems: r.bound,
-      playFirst: r,
-      moveItem: r,
-      removeItems: r,
-      removeSelectedItems: r.bound,
-      removeOtherItems: r,
-      removeItemsAbove: r,
-      toggleRepeat: r.bound,
-      toggleShuffle: r.bound,
-      previous: r,
-      next: r.bound,
-      goToFirst: r
+      interacted: re,
+      items: re,
+      currentId: re,
+      repeat: re,
+      shuffle: re,
+      localStorageState: _.struct,
+      isEmpty: _,
+      currentItem: _,
+      canPlay: _,
+      canPause: _,
+      hasMultipleItems: _,
+      currentIndex: _,
+      hasPreviousItem: _,
+      hasNextItem: _,
+      isLastItem: _,
+      selectedItems: _,
+      allItemsSelected: _,
+      selectedItemsOrAllItems: _,
+      setItems: y,
+      interact: y,
+      clear: y.bound,
+      unselectAll: y,
+      setCurrentItem: y,
+      setNextItems: y,
+      clearAndSetItems: y,
+      playNext: y,
+      playSelectedItemsNext: y.bound,
+      addItems: y,
+      addSelectedItems: y.bound,
+      playFirst: y,
+      moveItem: y,
+      removeItems: y,
+      removeSelectedItems: y.bound,
+      removeOtherItems: y,
+      removeItemsAbove: y,
+      toggleRepeat: y.bound,
+      toggleShuffle: y.bound,
+      previous: y,
+      next: y.bound,
+      goToFirst: y
     });
   }
   createItem(e) {
-    return R.fromDto(
+    return at.fromDto(
       this.observableStateProvider,
       this,
       e
@@ -1065,11 +2270,11 @@ class gt {
     };
   }
   set localStorageState(e) {
-    var i;
-    this.repeat = e.repeat ?? o.Off, this.shuffle = e.shuffle ?? !1, this.items = ((i = e.items) == null ? void 0 : i.map((s) => this.createItem(s))) ?? [], this.currentIndex = e.currentIndex;
+    var n;
+    this.repeat = e.repeat ?? R.Off, this.shuffle = e.shuffle ?? !1, this.items = ((n = e.items) == null ? void 0 : n.map((i) => this.createItem(i))) ?? [], this.currentIndex = e.currentIndex;
   }
   validateLocalStorageState(e) {
-    return pt(e);
+    return di(e);
   }
   get isEmpty() {
     return this.items.length === 0;
@@ -1090,8 +2295,8 @@ class gt {
     return this.currentId !== void 0 ? this.items.findIndex((e) => e.id === this.currentId) : void 0;
   }
   set currentIndex(e) {
-    var i;
-    this.currentId = e !== void 0 ? (i = this.items.at(e)) == null ? void 0 : i.id : void 0;
+    var n;
+    this.currentId = e !== void 0 ? (n = this.items.at(e)) == null ? void 0 : n.id : void 0;
   }
   get hasPreviousItem() {
     return this.hasMultipleItems && this.currentIndex !== void 0 && this.currentIndex > 0;
@@ -1109,8 +2314,8 @@ class gt {
     return this.selectedItems.length === this.items.length;
   }
   set allItemsSelected(e) {
-    for (const i of this.items)
-      i.isSelected = e;
+    for (const n of this.items)
+      n.isSelected = e;
   }
   get selectedItemsOrAllItems() {
     return this.selectedItems.length > 0 ? this.selectedItems : this.items;
@@ -1166,47 +2371,47 @@ class gt {
       this.clearAndSetItems(e);
       return;
     }
-    const { currentIndex: i } = this;
-    i !== void 0 && (this.interact(), this.items.splice(i, 0, ...e), this.currentIndex = i);
+    const { currentIndex: n } = this;
+    n !== void 0 && (this.interact(), this.items.splice(n, 0, ...e), this.currentIndex = n);
   }
-  moveItem(e, i) {
-    const s = this.items.splice(this.items.indexOf(e), 1)[0];
-    this.items.splice(i, 0, s);
+  moveItem(e, n) {
+    const i = this.items.splice(this.items.indexOf(e), 1)[0];
+    this.items.splice(n, 0, i);
   }
   async removeItems(e) {
-    const { currentItem: i } = this;
-    D(this.items, ...e.filter((a) => a !== i));
-    const { currentIndex: s, isLastItem: l } = this;
-    D(
+    const { currentItem: n } = this;
+    Rt(this.items, ...e.filter((l) => l !== n));
+    const { currentIndex: i, isLastItem: a } = this;
+    Rt(
       this.items,
-      e.find((a) => a === i)
-    ), this.currentItem !== i && (this.interact(), l ? await this.goToFirst() : this.currentIndex = s);
+      e.find((l) => l === n)
+    ), this.currentItem !== n && (this.interact(), a ? await this.goToFirst() : this.currentIndex = i);
   }
   async removeSelectedItems() {
     await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
   }
   async removeOtherItems(e) {
-    const i = e.id;
+    const n = e.id;
     return this.removeItems(
-      this.items.filter((s) => s.id !== i)
+      this.items.filter((i) => i.id !== n)
     );
   }
   async removeItemsAbove(e) {
-    const i = this.items.indexOf(e);
+    const n = this.items.indexOf(e);
     return this.removeItems(
-      this.items.filter((s, l) => l < i)
+      this.items.filter((i, a) => a < n)
     );
   }
   toggleRepeat() {
     switch (this.repeat) {
-      case o.Off:
-        this.repeat = o.All;
+      case R.Off:
+        this.repeat = R.All;
         break;
-      case o.All:
-        this.repeat = o.One;
+      case R.All:
+        this.repeat = R.One;
         break;
-      case o.One:
-        this.repeat = o.Off;
+      case R.One:
+        this.repeat = R.Off;
         break;
     }
   }
@@ -1223,50 +2428,52 @@ class gt {
     this.currentIndex !== void 0 && (this.currentIndex = 0);
   }
 }
-const Z = W(void 0), zt = ({
-  children: n
+const er = Lt(void 0), _i = ({
+  children: t
 }) => {
-  const [e] = g(
-    () => new gt(new K())
-  ), i = C();
-  return De(() => Ue(
+  const [e] = q(
+    () => new mi(new Qt())
+  ), n = ie();
+  return wr(() => pn(
     () => e.currentItem,
-    async (s, l) => {
-      s === void 0 || l === void 0 || s.type === l.type && s.videoId === l.videoId && await i.setCurrentTime(0);
-    }
-  ), [e, i]), /* @__PURE__ */ t.createElement(Z.Provider, { value: e }, n);
-}, ft = () => X(Z), Mt = h(
-  ({ children: n }) => {
-    const e = ft();
-    return /* @__PURE__ */ t.createElement(
-      z,
+    async (i, a) => {
+      i === void 0 || a === void 0 || i.type === a.type && i.videoId === a.videoId && await n.setCurrentTime(0);
+    }
+  ), [e, n]), /* @__PURE__ */ o(er.Provider, { value: e, children: t });
+}, hi = () => st(er), Ai = Y(
+  ({ children: t }) => {
+    const e = hi();
+    return /* @__PURE__ */ F(
+      nt,
       {
         panelled: !0,
         style: {
-          minBlockSize: `max(460px, 100vh - ${Y}px)`
-        }
-      },
-      n,
-      !e.isEmpty && /* @__PURE__ */ t.createElement($, { style: { blockSize: M.height } })
+          minBlockSize: `max(460px, 100vh - ${Zt}px)`
+        },
+        children: [
+          t,
+          !e.isEmpty && /* @__PURE__ */ o(Wt, { style: { blockSize: ot.height } })
+        ]
+      }
     );
   }
 );
-class Et {
+class vi {
   constructor(e) {
-    p(this, "playing", !1);
-    p(this, "percent", 0);
-    p(this, "seeking", !1);
+    U(this, "playing", !1);
+    U(this, "percent", 0);
+    U(this, "seeking", !1);
     e.makeObservable(this, {
-      playing: b,
-      percent: b,
-      seeking: b,
-      setPlaying: r,
-      setPercent: r,
-      setSeeking: r,
-      onPlay: r.bound,
-      onPause: r.bound,
-      onEnded: r.bound,
-      onTimeUpdate: r.bound
+      playing: re,
+      percent: re,
+      seeking: re,
+      setPlaying: y,
+      setPercent: y,
+      setSeeking: y,
+      onPlay: y.bound,
+      onPause: y.bound,
+      onEnded: y.bound,
+      onTimeUpdate: y.bound
     });
   }
   setPlaying(e) {
@@ -1291,32 +2498,32 @@ class Et {
     e !== void 0 && (this.seeking || (this.percent = e));
   }
 }
-const _ = W(void 0), Rt = ({
-  children: n
+const tr = Lt(void 0), ki = ({
+  children: t
 }) => {
-  const [e] = g(
-    () => new Et(new K())
+  const [e] = q(
+    () => new vi(new Qt())
   );
-  return /* @__PURE__ */ t.createElement(_.Provider, { value: e }, n);
-}, Ft = () => X(_);
-class Bt {
-  makeObservable(e, i) {
+  return /* @__PURE__ */ o(tr.Provider, { value: e, children: t });
+}, Mi = () => st(tr);
+class Fi {
+  makeObservable(e, n) {
     return e;
   }
 }
 export {
-  St as BottomBar,
-  Ot as HydrangeanDiva,
-  Mt as MediaPlayerLayout,
-  At as MiniPlayer,
-  K as MobXObservableStateProvider,
-  Bt as ObservableStateProvider,
-  zt as PlayQueueStoreProvider,
-  Rt as PlayerStoreProvider,
-  o as RepeatMode,
-  Y as bottomBarHeight,
-  M as miniPlayerSize,
-  ft as usePlayQueueStore,
-  Ft as usePlayerStore
+  Ri as BottomBar,
+  wi as HydrangeanDiva,
+  Ai as MediaPlayerLayout,
+  Oi as MiniPlayer,
+  Qt as MobXObservableStateProvider,
+  Fi as ObservableStateProvider,
+  _i as PlayQueueStoreProvider,
+  ki as PlayerStoreProvider,
+  R as RepeatMode,
+  Zt as bottomBarHeight,
+  ot as miniPlayerSize,
+  hi as usePlayQueueStore,
+  Mi as usePlayerStore
 };
 //# sourceMappingURL=index.es.js.map