@aigamo/hydrangean-diva 0.0.1-alpha.21 → 0.0.1-alpha.23

package/dist/index.es.js

@@ -1,127 +1,127 @@
-import { makeObservable as Rr, action as y, computed as A, observable as Z, reaction as Or } from "mobx";
+import { makeObservable as Nr, action as v, computed as _, observable as X, reaction as $r } from "mobx";
 import * as te from "react";
-import Dt, { forwardRef as _r, useContext as at, memo as ne, useState as W, useCallback as N, useMemo as De, createContext as zt, useEffect as kr, useLayoutEffect as Ar } from "react";
-import Mr from "@emotion/cache";
-import { useNostalgicDiva as U, findVideoService as Fr, NostalgicDivaProvider as jr, PlayerType as Nr, NostalgicDiva as $r, nullPlayerController as Dr } from "@aigamo/nostalgic-diva";
-import { EuiButton as re, useGeneratedHtmlId as zr, EuiModalHeaderTitle as Br, EuiModalHeader as Lr, EuiForm as Vr, EuiFormRow as rt, EuiFieldText as St, EuiModalBody as Yr, EuiModalFooter as Wr, EuiButtonEmpty as Bt, EuiModal as Ur, useEuiTheme as Lt, EuiCheckbox as Vt, EuiTableHeaderCellCheckbox as qr, EuiTableHeader as Hr, EuiTableRowCell as nt, EuiTableRowCellCheckbox as Gr, EuiLink as Jr, EuiTableRow as Kr, EuiTable as Xr, EuiButtonIcon as q, EuiPopover as ze, EuiIcon as Y, EuiContextMenu as st, EuiTableHeaderCell as Ze, EuiCodeBlock as Zr, EuiFlyout as Qr, EuiFlexGroup as se, EuiFlexItem as J, EuiSpacer as Yt, EuiEmptyPrompt as en, EuiPageTemplate as lt, EuiRange as Wt, EuiBottomBar as tn } from "@elastic/eui";
-import { AddRegular as ct, PlayRegular as rn, DismissRegular as ut, MoreHorizontalFilled as Ut, ArrowUploadRegular as nn, ArrowDownloadRegular as on, WindowDevToolsRegular as an, DeleteRegular as sn, ArrowShuffleFilled as ln, ArrowShuffleOffFilled as cn, PreviousFilled as un, SkipBack10Regular as qt, PauseFilled as dn, PlayFilled as fn, SkipForward30Regular as Ht, NextFilled as mn, ArrowRepeat1Filled as hn, ArrowRepeatAllFilled as vn, ArrowRepeatAllOffFilled as pn, OpenRegular as yn, Speaker2Regular as Gt, TopSpeedRegular as gn, NavigationPlayRegular as bn } from "@fluentui/react-icons";
-import { observer as P } from "mobx-react-lite";
-import { ReactSortable as Tn } from "react-sortablejs";
-import { pull as Pt } from "lodash-es";
-import En from "ajv";
-import { useRouter as Cn } from "@tanstack/react-router";
-const Jt = 81;
-class Kt {
-  makeObservable(t, n) {
-    return Rr(t, n);
+import Lt, { forwardRef as jr, useContext as ct, useState as z, useEffect as Vt, memo as re, useCallback as $, useMemo as Ve, createContext as Ut, useLayoutEffect as zr } from "react";
+import qr from "@emotion/cache";
+import { EuiSelectable as Lr, EuiPopoverTitle as Vr, EuiPopoverFooter as Ur, EuiButton as Q, EuiPopover as xe, useGeneratedHtmlId as Yr, EuiModalHeaderTitle as Wr, EuiModalHeader as Hr, EuiForm as Gr, EuiFormRow as at, EuiFieldText as xt, EuiModalBody as Jr, EuiModalFooter as Qr, EuiButtonEmpty as Yt, EuiModal as Kr, useEuiTheme as Wt, EuiCheckbox as Ht, EuiTableHeaderCellCheckbox as Br, EuiTableHeader as Xr, EuiTableRowCell as st, EuiTableRowCellCheckbox as Zr, EuiLink as en, EuiTableRow as tn, EuiTable as rn, EuiButtonIcon as W, EuiIcon as Y, EuiContextMenu as ut, EuiTableHeaderCell as tt, EuiCodeBlock as nn, EuiFlyout as an, EuiFlexGroup as oe, EuiFlexItem as J, EuiSpacer as Gt, EuiEmptyPrompt as sn, EuiPageTemplate as dt, EuiRange as Jt, EuiBottomBar as on } from "@elastic/eui";
+import { AddRegular as Te, PlayRegular as ln, DismissRegular as ft, MoreHorizontalFilled as Qt, ArrowUploadRegular as cn, ArrowDownloadRegular as un, WindowDevToolsRegular as dn, DeleteRegular as fn, ArrowShuffleFilled as pn, ArrowShuffleOffFilled as yn, PreviousFilled as hn, SkipBack10Regular as Kt, PauseFilled as mn, PlayFilled as vn, SkipForward30Regular as Bt, NextFilled as gn, ArrowRepeat1Filled as Pn, ArrowRepeatAllFilled as bn, ArrowRepeatAllOffFilled as wn, OpenRegular as Sn, Speaker2Regular as Xt, TopSpeedRegular as En, NavigationPlayRegular as Rn } from "@fluentui/react-icons";
+import { useNostalgicDiva as le, findVideoService as Tn, NostalgicDivaProvider as Cn, NostalgicDiva as In, nullPlayerController as xn } from "@aigamo/nostalgic-diva";
+import { observer as C } from "mobx-react-lite";
+import { ReactSortable as On } from "react-sortablejs";
+import _n from "ajv";
+import { pull as Ot } from "lodash-es";
+import { useRouter as kn } from "@tanstack/react-router";
+const Zt = 81;
+class er {
+  makeObservable(t, r) {
+    return Nr(t, r);
   }
 }
-class Yi {
-  makeObservable(t, n) {
+class Sa {
+  makeObservable(t, r) {
     return t;
   }
 }
-var je = { exports: {} }, Ee = {};
-var wt;
-function xn() {
-  if (wt) return Ee;
-  wt = 1;
-  var e = Dt, t = Symbol.for("react.element"), n = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function d(h, m, p) {
-    var T, w = {}, I = null, D = null;
-    p !== void 0 && (I = "" + p), m.key !== void 0 && (I = "" + m.key), m.ref !== void 0 && (D = m.ref);
-    for (T in m) i.call(m, T) && !l.hasOwnProperty(T) && (w[T] = m[T]);
-    if (h && h.defaultProps) for (T in m = h.defaultProps, m) w[T] === void 0 && (w[T] = m[T]);
-    return { $$typeof: t, type: h, key: I, ref: D, props: w, _owner: a.current };
-  }
-  return Ee.Fragment = n, Ee.jsx = d, Ee.jsxs = d, Ee;
+var N = /* @__PURE__ */ ((e) => (e.Off = "Off", e.All = "All", e.One = "One", e))(N || {}), ze = { exports: {} }, Se = {};
+var _t;
+function An() {
+  if (_t) return Se;
+  _t = 1;
+  var e = Lt, t = /* @__PURE__ */ Symbol.for("react.element"), r = /* @__PURE__ */ Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, a = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, o = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function c(f, p, m) {
+    var P, w = {}, q = null, F = null;
+    m !== void 0 && (q = "" + m), p.key !== void 0 && (q = "" + p.key), p.ref !== void 0 && (F = p.ref);
+    for (P in p) i.call(p, P) && !o.hasOwnProperty(P) && (w[P] = p[P]);
+    if (f && f.defaultProps) for (P in p = f.defaultProps, p) w[P] === void 0 && (w[P] = p[P]);
+    return { $$typeof: t, type: f, key: q, ref: F, props: w, _owner: a.current };
+  }
+  return Se.Fragment = r, Se.jsx = c, Se.jsxs = c, Se;
 }
-var Ce = {};
-var Rt;
-function In() {
-  return Rt || (Rt = 1, process.env.NODE_ENV !== "production" && (function() {
-    var e = Dt, t = 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"), d = Symbol.for("react.provider"), h = Symbol.for("react.context"), m = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), T = Symbol.for("react.suspense_list"), w = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), D = Symbol.for("react.offscreen"), M = Symbol.iterator, H = "@@iterator";
-    function Q(r) {
-      if (r === null || typeof r != "object")
+var Ee = {};
+var kt;
+function Dn() {
+  return kt || (kt = 1, process.env.NODE_ENV !== "production" && (function() {
+    var e = Lt, t = /* @__PURE__ */ Symbol.for("react.element"), r = /* @__PURE__ */ Symbol.for("react.portal"), i = /* @__PURE__ */ Symbol.for("react.fragment"), a = /* @__PURE__ */ Symbol.for("react.strict_mode"), o = /* @__PURE__ */ Symbol.for("react.profiler"), c = /* @__PURE__ */ Symbol.for("react.provider"), f = /* @__PURE__ */ Symbol.for("react.context"), p = /* @__PURE__ */ Symbol.for("react.forward_ref"), m = /* @__PURE__ */ Symbol.for("react.suspense"), P = /* @__PURE__ */ Symbol.for("react.suspense_list"), w = /* @__PURE__ */ Symbol.for("react.memo"), q = /* @__PURE__ */ Symbol.for("react.lazy"), F = /* @__PURE__ */ Symbol.for("react.offscreen"), k = Symbol.iterator, H = "@@iterator";
+    function Z(n) {
+      if (n === null || typeof n != "object")
         return null;
-      var s = M && r[M] || r[H];
-      return typeof s == "function" ? s : null;
+      var l = k && n[k] || n[H];
+      return typeof l == "function" ? l : null;
     }
-    var B = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-    function R(r) {
+    var L = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    function I(n) {
       {
-        for (var s = arguments.length, u = new Array(s > 1 ? s - 1 : 0), v = 1; v < s; v++)
-          u[v - 1] = arguments[v];
-        F("error", r, u);
+        for (var l = arguments.length, d = new Array(l > 1 ? l - 1 : 0), h = 1; h < l; h++)
+          d[h - 1] = arguments[h];
+        A("error", n, d);
       }
     }
-    function F(r, s, u) {
+    function A(n, l, d) {
       {
-        var v = B.ReactDebugCurrentFrame, E = v.getStackAddendum();
-        E !== "" && (s += "%s", u = u.concat([E]));
-        var S = u.map(function(b) {
+        var h = L.ReactDebugCurrentFrame, S = h.getStackAddendum();
+        S !== "" && (l += "%s", d = d.concat([S]));
+        var T = d.map(function(b) {
           return String(b);
         });
-        S.unshift("Warning: " + s), Function.prototype.apply.call(console[r], console, S);
+        T.unshift("Warning: " + l), Function.prototype.apply.call(console[n], console, T);
       }
     }
-    var _ = !1, c = !1, L = !1, me = !1, Se = !1, Pe;
-    Pe = Symbol.for("react.module.reference");
-    function Ve(r) {
-      return !!(typeof r == "string" || typeof r == "function" || r === i || r === l || Se || r === a || r === p || r === T || me || r === D || _ || c || L || typeof r == "object" && r !== null && (r.$$typeof === I || r.$$typeof === w || r.$$typeof === d || r.$$typeof === h || r.$$typeof === m || // This needs to include all possible module reference object
+    var x = !1, u = !1, V = !1, ye = !1, Oe = !1, _e;
+    _e = /* @__PURE__ */ Symbol.for("react.module.reference");
+    function We(n) {
+      return !!(typeof n == "string" || typeof n == "function" || n === i || n === o || Oe || n === a || n === m || n === P || ye || n === F || x || u || V || typeof n == "object" && n !== null && (n.$$typeof === q || n.$$typeof === w || n.$$typeof === c || n.$$typeof === f || n.$$typeof === p || // 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 === Pe || r.getModuleId !== void 0));
+      n.$$typeof === _e || n.getModuleId !== void 0));
     }
-    function Ye(r, s, u) {
-      var v = r.displayName;
-      if (v)
-        return v;
-      var E = s.displayName || s.name || "";
-      return E !== "" ? u + "(" + E + ")" : u;
+    function He(n, l, d) {
+      var h = n.displayName;
+      if (h)
+        return h;
+      var S = l.displayName || l.name || "";
+      return S !== "" ? d + "(" + S + ")" : d;
     }
-    function we(r) {
-      return r.displayName || "Context";
+    function ke(n) {
+      return n.displayName || "Context";
     }
-    function K(r) {
-      if (r == null)
+    function K(n) {
+      if (n == null)
         return null;
-      if (typeof r.tag == "number" && R("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) {
+      if (typeof n.tag == "number" && I("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof n == "function")
+        return n.displayName || n.name || null;
+      if (typeof n == "string")
+        return n;
+      switch (n) {
         case i:
           return "Fragment";
-        case n:
+        case r:
           return "Portal";
-        case l:
+        case o:
           return "Profiler";
         case a:
           return "StrictMode";
-        case p:
+        case m:
           return "Suspense";
-        case T:
+        case P:
           return "SuspenseList";
       }
-      if (typeof r == "object")
-        switch (r.$$typeof) {
-          case h:
-            var s = r;
-            return we(s) + ".Consumer";
-          case d:
-            var u = r;
-            return we(u._context) + ".Provider";
-          case m:
-            return Ye(r, r.render, "ForwardRef");
+      if (typeof n == "object")
+        switch (n.$$typeof) {
+          case f:
+            var l = n;
+            return ke(l) + ".Consumer";
+          case c:
+            var d = n;
+            return ke(d._context) + ".Provider";
+          case p:
+            return He(n, n.render, "ForwardRef");
           case w:
-            var v = r.displayName || null;
-            return v !== null ? v : K(r.type) || "Memo";
-          case I: {
-            var E = r, S = E._payload, b = E._init;
+            var h = n.displayName || null;
+            return h !== null ? h : K(n.type) || "Memo";
+          case q: {
+            var S = n, T = S._payload, b = S._init;
             try {
-              return K(b(S));
+              return K(b(T));
             } catch {
               return null;
             }
@@ -129,103 +129,103 @@ function In() {
         }
       return null;
     }
-    var ee = Object.assign, ie = 0, Re, Oe, he, _e, ve, ke, Ae;
-    function Me() {
+    var ee = Object.assign, ne = 0, Ae, De, he, Me, me, Fe, Ne;
+    function $e() {
     }
-    Me.__reactDisabledLog = !0;
-    function We() {
+    $e.__reactDisabledLog = !0;
+    function Ge() {
       {
-        if (ie === 0) {
-          Re = console.log, Oe = console.info, he = console.warn, _e = console.error, ve = console.group, ke = console.groupCollapsed, Ae = console.groupEnd;
-          var r = {
+        if (ne === 0) {
+          Ae = console.log, De = console.info, he = console.warn, Me = console.error, me = console.group, Fe = console.groupCollapsed, Ne = console.groupEnd;
+          var n = {
             configurable: !0,
             enumerable: !0,
-            value: Me,
+            value: $e,
             writable: !0
           };
           Object.defineProperties(console, {
-            info: r,
-            log: r,
-            warn: r,
-            error: r,
-            group: r,
-            groupCollapsed: r,
-            groupEnd: r
+            info: n,
+            log: n,
+            warn: n,
+            error: n,
+            group: n,
+            groupCollapsed: n,
+            groupEnd: n
           });
         }
-        ie++;
+        ne++;
       }
     }
-    function Ue() {
+    function Je() {
       {
-        if (ie--, ie === 0) {
-          var r = {
+        if (ne--, ne === 0) {
+          var n = {
             configurable: !0,
             enumerable: !0,
             writable: !0
           };
           Object.defineProperties(console, {
-            log: ee({}, r, {
-              value: Re
+            log: ee({}, n, {
+              value: Ae
             }),
-            info: ee({}, r, {
-              value: Oe
+            info: ee({}, n, {
+              value: De
             }),
-            warn: ee({}, r, {
+            warn: ee({}, n, {
               value: he
             }),
-            error: ee({}, r, {
-              value: _e
+            error: ee({}, n, {
+              value: Me
             }),
-            group: ee({}, r, {
-              value: ve
+            group: ee({}, n, {
+              value: me
             }),
-            groupCollapsed: ee({}, r, {
-              value: ke
+            groupCollapsed: ee({}, n, {
+              value: Fe
             }),
-            groupEnd: ee({}, r, {
-              value: Ae
+            groupEnd: ee({}, n, {
+              value: Ne
             })
           });
         }
-        ie < 0 && R("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+        ne < 0 && I("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
       }
     }
-    var pe = B.ReactCurrentDispatcher, ye;
-    function le(r, s, u) {
+    var ve = L.ReactCurrentDispatcher, ge;
+    function ce(n, l, d) {
       {
-        if (ye === void 0)
+        if (ge === void 0)
           try {
             throw Error();
-          } catch (E) {
-            var v = E.stack.trim().match(/\n( *(at )?)/);
-            ye = v && v[1] || "";
+          } catch (S) {
+            var h = S.stack.trim().match(/\n( *(at )?)/);
+            ge = h && h[1] || "";
           }
         return `
-` + ye + r;
+` + ge + n;
       }
     }
-    var ge = !1, ce;
+    var Pe = !1, ue;
     {
-      var qe = typeof WeakMap == "function" ? WeakMap : Map;
-      ce = new qe();
+      var Qe = typeof WeakMap == "function" ? WeakMap : Map;
+      ue = new Qe();
     }
-    function f(r, s) {
-      if (!r || ge)
+    function y(n, l) {
+      if (!n || Pe)
         return "";
       {
-        var u = ce.get(r);
-        if (u !== void 0)
-          return u;
+        var d = ue.get(n);
+        if (d !== void 0)
+          return d;
       }
-      var v;
-      ge = !0;
-      var E = Error.prepareStackTrace;
+      var h;
+      Pe = !0;
+      var S = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var S;
-      S = pe.current, pe.current = null, We();
+      var T;
+      T = ve.current, ve.current = null, Ge();
       try {
-        if (s) {
+        if (l) {
           var b = function() {
             throw Error();
           };
@@ -236,196 +236,196 @@ function In() {
           }), typeof Reflect == "object" && Reflect.construct) {
             try {
               Reflect.construct(b, []);
-            } catch (V) {
-              v = V;
+            } catch (U) {
+              h = U;
             }
-            Reflect.construct(r, [], b);
+            Reflect.construct(n, [], b);
           } else {
             try {
               b.call();
-            } catch (V) {
-              v = V;
+            } catch (U) {
+              h = U;
             }
-            r.call(b.prototype);
+            n.call(b.prototype);
           }
         } else {
           try {
             throw Error();
-          } catch (V) {
-            v = V;
+          } catch (U) {
+            h = U;
           }
-          r();
+          n();
         }
-      } catch (V) {
-        if (V && v && typeof V.stack == "string") {
-          for (var g = V.stack.split(`
-`), z = v.stack.split(`
-`), k = g.length - 1, j = z.length - 1; k >= 1 && j >= 0 && g[k] !== z[j]; )
-            j--;
-          for (; k >= 1 && j >= 0; k--, j--)
-            if (g[k] !== z[j]) {
-              if (k !== 1 || j !== 1)
+      } catch (U) {
+        if (U && h && typeof U.stack == "string") {
+          for (var g = U.stack.split(`
+`), j = h.stack.split(`
+`), O = g.length - 1, D = j.length - 1; O >= 1 && D >= 0 && g[O] !== j[D]; )
+            D--;
+          for (; O >= 1 && D >= 0; O--, D--)
+            if (g[O] !== j[D]) {
+              if (O !== 1 || D !== 1)
                 do
-                  if (k--, j--, j < 0 || g[k] !== z[j]) {
+                  if (O--, D--, D < 0 || g[O] !== j[D]) {
                     var G = `
-` + g[k].replace(" at new ", " at ");
-                    return r.displayName && G.includes("<anonymous>") && (G = G.replace("<anonymous>", r.displayName)), typeof r == "function" && ce.set(r, G), G;
+` + g[O].replace(" at new ", " at ");
+                    return n.displayName && G.includes("<anonymous>") && (G = G.replace("<anonymous>", n.displayName)), typeof n == "function" && ue.set(n, G), G;
                   }
-                while (k >= 1 && j >= 0);
+                while (O >= 1 && D >= 0);
               break;
             }
         }
       } finally {
-        ge = !1, pe.current = S, Ue(), Error.prepareStackTrace = E;
+        Pe = !1, ve.current = T, Je(), Error.prepareStackTrace = S;
       }
-      var fe = r ? r.displayName || r.name : "", ae = fe ? le(fe) : "";
-      return typeof r == "function" && ce.set(r, ae), ae;
+      var pe = n ? n.displayName || n.name : "", ae = pe ? ce(pe) : "";
+      return typeof n == "function" && ue.set(n, ae), ae;
     }
-    function be(r, s, u) {
-      return f(r, !1);
+    function be(n, l, d) {
+      return y(n, !1);
     }
-    function ue(r) {
-      var s = r.prototype;
-      return !!(s && s.isReactComponent);
+    function de(n) {
+      var l = n.prototype;
+      return !!(l && l.isReactComponent);
     }
-    function oe(r, s, u) {
-      if (r == null)
+    function ie(n, l, d) {
+      if (n == null)
         return "";
-      if (typeof r == "function")
-        return f(r, ue(r));
-      if (typeof r == "string")
-        return le(r);
-      switch (r) {
-        case p:
-          return le("Suspense");
-        case T:
-          return le("SuspenseList");
+      if (typeof n == "function")
+        return y(n, de(n));
+      if (typeof n == "string")
+        return ce(n);
+      switch (n) {
+        case m:
+          return ce("Suspense");
+        case P:
+          return ce("SuspenseList");
       }
-      if (typeof r == "object")
-        switch (r.$$typeof) {
-          case m:
-            return be(r.render);
+      if (typeof n == "object")
+        switch (n.$$typeof) {
+          case p:
+            return be(n.render);
           case w:
-            return oe(r.type, s, u);
-          case I: {
-            var v = r, E = v._payload, S = v._init;
+            return ie(n.type, l, d);
+          case q: {
+            var h = n, S = h._payload, T = h._init;
             try {
-              return oe(S(E), s, u);
+              return ie(T(S), l, d);
             } catch {
             }
           }
         }
       return "";
     }
-    var Te = Object.prototype.hasOwnProperty, dt = {}, ft = B.ReactDebugCurrentFrame;
-    function Fe(r) {
-      if (r) {
-        var s = r._owner, u = oe(r.type, r._source, s ? s.type : null);
-        ft.setExtraStackFrame(u);
+    var we = Object.prototype.hasOwnProperty, yt = {}, ht = L.ReactDebugCurrentFrame;
+    function je(n) {
+      if (n) {
+        var l = n._owner, d = ie(n.type, n._source, l ? l.type : null);
+        ht.setExtraStackFrame(d);
       } else
-        ft.setExtraStackFrame(null);
+        ht.setExtraStackFrame(null);
     }
-    function ar(r, s, u, v, E) {
+    function yr(n, l, d, h, S) {
       {
-        var S = Function.call.bind(Te);
-        for (var b in r)
-          if (S(r, b)) {
+        var T = Function.call.bind(we);
+        for (var b in n)
+          if (T(n, b)) {
             var g = void 0;
             try {
-              if (typeof r[b] != "function") {
-                var z = 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 z.name = "Invariant Violation", z;
+              if (typeof n[b] != "function") {
+                var j = Error((h || "React class") + ": " + d + " type `" + b + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof n[b] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw j.name = "Invariant Violation", j;
               }
-              g = r[b](s, b, v, u, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (k) {
-              g = k;
+              g = n[b](l, b, h, d, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (O) {
+              g = O;
             }
-            g && !(g instanceof Error) && (Fe(E), R("%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), Fe(null)), g instanceof Error && !(g.message in dt) && (dt[g.message] = !0, Fe(E), R("Failed %s type: %s", u, g.message), Fe(null));
+            g && !(g instanceof Error) && (je(S), 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).", h || "React class", d, b, typeof g), je(null)), g instanceof Error && !(g.message in yt) && (yt[g.message] = !0, je(S), I("Failed %s type: %s", d, g.message), je(null));
           }
       }
     }
-    var sr = Array.isArray;
-    function He(r) {
-      return sr(r);
+    var hr = Array.isArray;
+    function Ke(n) {
+      return hr(n);
     }
-    function lr(r) {
+    function mr(n) {
       {
-        var s = typeof Symbol == "function" && Symbol.toStringTag, u = s && r[Symbol.toStringTag] || r.constructor.name || "Object";
-        return u;
+        var l = typeof Symbol == "function" && Symbol.toStringTag, d = l && n[Symbol.toStringTag] || n.constructor.name || "Object";
+        return d;
       }
     }
-    function cr(r) {
+    function vr(n) {
       try {
-        return mt(r), !1;
+        return mt(n), !1;
       } catch {
         return !0;
       }
     }
-    function mt(r) {
-      return "" + r;
+    function mt(n) {
+      return "" + n;
     }
-    function ht(r) {
-      if (cr(r))
-        return R("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", lr(r)), mt(r);
+    function vt(n) {
+      if (vr(n))
+        return I("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", mr(n)), mt(n);
     }
-    var vt = B.ReactCurrentOwner, ur = {
+    var gt = L.ReactCurrentOwner, gr = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
-    }, pt, yt;
-    function dr(r) {
-      if (Te.call(r, "ref")) {
-        var s = Object.getOwnPropertyDescriptor(r, "ref").get;
-        if (s && s.isReactWarning)
+    }, Pt, bt;
+    function Pr(n) {
+      if (we.call(n, "ref")) {
+        var l = Object.getOwnPropertyDescriptor(n, "ref").get;
+        if (l && l.isReactWarning)
           return !1;
       }
-      return r.ref !== void 0;
+      return n.ref !== void 0;
     }
-    function fr(r) {
-      if (Te.call(r, "key")) {
-        var s = Object.getOwnPropertyDescriptor(r, "key").get;
-        if (s && s.isReactWarning)
+    function br(n) {
+      if (we.call(n, "key")) {
+        var l = Object.getOwnPropertyDescriptor(n, "key").get;
+        if (l && l.isReactWarning)
           return !1;
       }
-      return r.key !== void 0;
+      return n.key !== void 0;
     }
-    function mr(r, s) {
-      typeof r.ref == "string" && vt.current;
+    function wr(n, l) {
+      typeof n.ref == "string" && gt.current;
     }
-    function hr(r, s) {
+    function Sr(n, l) {
       {
-        var u = function() {
-          pt || (pt = !0, R("%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));
+        var d = 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)", l));
         };
-        u.isReactWarning = !0, Object.defineProperty(r, "key", {
-          get: u,
+        d.isReactWarning = !0, Object.defineProperty(n, "key", {
+          get: d,
           configurable: !0
         });
       }
     }
-    function vr(r, s) {
+    function Er(n, l) {
       {
-        var u = function() {
-          yt || (yt = !0, R("%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));
+        var d = function() {
+          bt || (bt = !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)", l));
         };
-        u.isReactWarning = !0, Object.defineProperty(r, "ref", {
-          get: u,
+        d.isReactWarning = !0, Object.defineProperty(n, "ref", {
+          get: d,
           configurable: !0
         });
       }
     }
-    var pr = function(r, s, u, v, E, S, b) {
+    var Rr = function(n, l, d, h, S, T, b) {
       var g = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: t,
         // Built-in properties that belong on the element
-        type: r,
-        key: s,
-        ref: u,
+        type: n,
+        key: l,
+        ref: d,
         props: b,
         // Record the component responsible for creating this element.
-        _owner: S
+        _owner: T
       };
       return g._store = {}, Object.defineProperty(g._store, "validated", {
         configurable: !1,
@@ -436,361 +436,361 @@ function In() {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: v
+        value: h
       }), Object.defineProperty(g, "_source", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
-        value: E
+        value: S
       }), Object.freeze && (Object.freeze(g.props), Object.freeze(g)), g;
     };
-    function yr(r, s, u, v, E) {
+    function Tr(n, l, d, h, S) {
       {
-        var S, b = {}, g = null, z = null;
-        u !== void 0 && (ht(u), g = "" + u), fr(s) && (ht(s.key), g = "" + s.key), dr(s) && (z = s.ref, mr(s, E));
-        for (S in s)
-          Te.call(s, S) && !ur.hasOwnProperty(S) && (b[S] = s[S]);
-        if (r && r.defaultProps) {
-          var k = r.defaultProps;
-          for (S in k)
-            b[S] === void 0 && (b[S] = k[S]);
+        var T, b = {}, g = null, j = null;
+        d !== void 0 && (vt(d), g = "" + d), br(l) && (vt(l.key), g = "" + l.key), Pr(l) && (j = l.ref, wr(l, S));
+        for (T in l)
+          we.call(l, T) && !gr.hasOwnProperty(T) && (b[T] = l[T]);
+        if (n && n.defaultProps) {
+          var O = n.defaultProps;
+          for (T in O)
+            b[T] === void 0 && (b[T] = O[T]);
         }
-        if (g || z) {
-          var j = typeof r == "function" ? r.displayName || r.name || "Unknown" : r;
-          g && hr(b, j), z && vr(b, j);
+        if (g || j) {
+          var D = typeof n == "function" ? n.displayName || n.name || "Unknown" : n;
+          g && Sr(b, D), j && Er(b, D);
         }
-        return pr(r, g, z, E, v, vt.current, b);
+        return Rr(n, g, j, S, h, gt.current, b);
       }
     }
-    var Ge = B.ReactCurrentOwner, gt = B.ReactDebugCurrentFrame;
-    function de(r) {
-      if (r) {
-        var s = r._owner, u = oe(r.type, r._source, s ? s.type : null);
-        gt.setExtraStackFrame(u);
+    var Be = L.ReactCurrentOwner, wt = L.ReactDebugCurrentFrame;
+    function fe(n) {
+      if (n) {
+        var l = n._owner, d = ie(n.type, n._source, l ? l.type : null);
+        wt.setExtraStackFrame(d);
       } else
-        gt.setExtraStackFrame(null);
+        wt.setExtraStackFrame(null);
     }
-    var Je;
-    Je = !1;
-    function Ke(r) {
-      return typeof r == "object" && r !== null && r.$$typeof === t;
+    var Xe;
+    Xe = !1;
+    function Ze(n) {
+      return typeof n == "object" && n !== null && n.$$typeof === t;
     }
-    function bt() {
+    function St() {
       {
-        if (Ge.current) {
-          var r = K(Ge.current.type);
-          if (r)
+        if (Be.current) {
+          var n = K(Be.current.type);
+          if (n)
             return `
 
-Check the render method of \`` + r + "`.";
+Check the render method of \`` + n + "`.";
         }
         return "";
       }
     }
-    function gr(r) {
+    function Cr(n) {
       return "";
     }
-    var Tt = {};
-    function br(r) {
+    var Et = {};
+    function Ir(n) {
       {
-        var s = bt();
-        if (!s) {
-          var u = typeof r == "string" ? r : r.displayName || r.name;
-          u && (s = `
+        var l = St();
+        if (!l) {
+          var d = typeof n == "string" ? n : n.displayName || n.name;
+          d && (l = `
 
-Check the top-level render call using <` + u + ">.");
+Check the top-level render call using <` + d + ">.");
         }
-        return s;
+        return l;
       }
     }
-    function Et(r, s) {
+    function Rt(n, l) {
       {
-        if (!r._store || r._store.validated || r.key != null)
+        if (!n._store || n._store.validated || n.key != null)
           return;
-        r._store.validated = !0;
-        var u = br(s);
-        if (Tt[u])
+        n._store.validated = !0;
+        var d = Ir(l);
+        if (Et[d])
           return;
-        Tt[u] = !0;
-        var v = "";
-        r && r._owner && r._owner !== Ge.current && (v = " It was passed a child from " + K(r._owner.type) + "."), de(r), R('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), de(null);
+        Et[d] = !0;
+        var h = "";
+        n && n._owner && n._owner !== Be.current && (h = " It was passed a child from " + K(n._owner.type) + "."), fe(n), I('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', d, h), fe(null);
       }
     }
-    function Ct(r, s) {
+    function Tt(n, l) {
       {
-        if (typeof r != "object")
+        if (typeof n != "object")
           return;
-        if (He(r))
-          for (var u = 0; u < r.length; u++) {
-            var v = r[u];
-            Ke(v) && Et(v, s);
+        if (Ke(n))
+          for (var d = 0; d < n.length; d++) {
+            var h = n[d];
+            Ze(h) && Rt(h, l);
           }
-        else if (Ke(r))
-          r._store && (r._store.validated = !0);
-        else if (r) {
-          var E = Q(r);
-          if (typeof E == "function" && E !== r.entries)
-            for (var S = E.call(r), b; !(b = S.next()).done; )
-              Ke(b.value) && Et(b.value, s);
+        else if (Ze(n))
+          n._store && (n._store.validated = !0);
+        else if (n) {
+          var S = Z(n);
+          if (typeof S == "function" && S !== n.entries)
+            for (var T = S.call(n), b; !(b = T.next()).done; )
+              Ze(b.value) && Rt(b.value, l);
         }
       }
     }
-    function Tr(r) {
+    function xr(n) {
       {
-        var s = r.type;
-        if (s == null || typeof s == "string")
+        var l = n.type;
+        if (l == null || typeof l == "string")
           return;
-        var u;
-        if (typeof s == "function")
-          u = s.propTypes;
-        else if (typeof s == "object" && (s.$$typeof === m || // Note: Memo only checks outer props here.
+        var d;
+        if (typeof l == "function")
+          d = l.propTypes;
+        else if (typeof l == "object" && (l.$$typeof === p || // Note: Memo only checks outer props here.
         // Inner props are checked in the reconciler.
-        s.$$typeof === w))
-          u = s.propTypes;
+        l.$$typeof === w))
+          d = l.propTypes;
         else
           return;
-        if (u) {
-          var v = K(s);
-          ar(u, r.props, "prop", v, r);
-        } else if (s.PropTypes !== void 0 && !Je) {
-          Je = !0;
-          var E = K(s);
-          R("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", E || "Unknown");
+        if (d) {
+          var h = K(l);
+          yr(d, n.props, "prop", h, n);
+        } else if (l.PropTypes !== void 0 && !Xe) {
+          Xe = !0;
+          var S = K(l);
+          I("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", S || "Unknown");
         }
-        typeof s.getDefaultProps == "function" && !s.getDefaultProps.isReactClassApproved && R("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+        typeof l.getDefaultProps == "function" && !l.getDefaultProps.isReactClassApproved && I("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function Er(r) {
+    function Or(n) {
       {
-        for (var s = Object.keys(r.props), u = 0; u < s.length; u++) {
-          var v = s[u];
-          if (v !== "children" && v !== "key") {
-            de(r), R("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", v), de(null);
+        for (var l = Object.keys(n.props), d = 0; d < l.length; d++) {
+          var h = l[d];
+          if (h !== "children" && h !== "key") {
+            fe(n), I("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", h), fe(null);
             break;
           }
         }
-        r.ref !== null && (de(r), R("Invalid attribute `ref` supplied to `React.Fragment`."), de(null));
+        n.ref !== null && (fe(n), I("Invalid attribute `ref` supplied to `React.Fragment`."), fe(null));
       }
     }
-    var xt = {};
-    function It(r, s, u, v, E, S) {
+    var Ct = {};
+    function It(n, l, d, h, S, T) {
       {
-        var b = Ve(r);
+        var b = We(n);
         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 z = gr();
-          z ? g += z : g += bt();
-          var k;
-          r === null ? k = "null" : He(r) ? k = "array" : r !== void 0 && r.$$typeof === t ? (k = "<" + (K(r.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : k = typeof r, R("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", k, g);
+          (n === void 0 || typeof n == "object" && n !== null && Object.keys(n).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 j = Cr();
+          j ? g += j : g += St();
+          var O;
+          n === null ? O = "null" : Ke(n) ? O = "array" : n !== void 0 && n.$$typeof === t ? (O = "<" + (K(n.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : O = typeof n, 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 j = yr(r, s, u, E, S);
-        if (j == null)
-          return j;
+        var D = Tr(n, l, d, S, T);
+        if (D == null)
+          return D;
         if (b) {
-          var G = s.children;
+          var G = l.children;
           if (G !== void 0)
-            if (v)
-              if (He(G)) {
-                for (var fe = 0; fe < G.length; fe++)
-                  Ct(G[fe], r);
+            if (h)
+              if (Ke(G)) {
+                for (var pe = 0; pe < G.length; pe++)
+                  Tt(G[pe], n);
                 Object.freeze && Object.freeze(G);
               } else
-                R("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+                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
-              Ct(G, r);
+              Tt(G, n);
         }
-        if (Te.call(s, "key")) {
-          var ae = K(r), V = Object.keys(s).filter(function(wr) {
-            return wr !== "key";
-          }), Xe = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
-          if (!xt[ae + Xe]) {
-            var Pr = V.length > 0 ? "{" + V.join(": ..., ") + ": ...}" : "{}";
-            R(`A props object containing a "key" prop is being spread into JSX:
+        if (we.call(l, "key")) {
+          var ae = K(n), U = Object.keys(l).filter(function(Fr) {
+            return Fr !== "key";
+          }), et = U.length > 0 ? "{key: someKey, " + U.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!Ct[ae + et]) {
+            var Mr = U.length > 0 ? "{" + U.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} />`, Xe, ae, Pr, ae), xt[ae + Xe] = !0;
+  <%s key={someKey} {...props} />`, et, ae, Mr, ae), Ct[ae + et] = !0;
           }
         }
-        return r === i ? Er(j) : Tr(j), j;
+        return n === i ? Or(D) : xr(D), D;
       }
     }
-    function Cr(r, s, u) {
-      return It(r, s, u, !0);
+    function _r(n, l, d) {
+      return It(n, l, d, !0);
     }
-    function xr(r, s, u) {
-      return It(r, s, u, !1);
+    function kr(n, l, d) {
+      return It(n, l, d, !1);
     }
-    var Ir = xr, Sr = Cr;
-    Ce.Fragment = i, Ce.jsx = Ir, Ce.jsxs = Sr;
-  })()), Ce;
+    var Ar = kr, Dr = _r;
+    Ee.Fragment = i, Ee.jsx = Ar, Ee.jsxs = Dr;
+  })()), Ee;
 }
-var Ot;
-function Sn() {
-  return Ot || (Ot = 1, process.env.NODE_ENV === "production" ? je.exports = xn() : je.exports = In()), je.exports;
+var At;
+function Mn() {
+  return At || (At = 1, process.env.NODE_ENV === "production" ? ze.exports = An() : ze.exports = Dn()), ze.exports;
 }
-var xe = Sn(), Ne = { exports: {} }, C = {};
-var _t;
-function Pn() {
-  if (_t) return C;
-  _t = 1;
-  var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, i = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, l = e ? Symbol.for("react.profiler") : 60114, d = e ? Symbol.for("react.provider") : 60109, h = e ? Symbol.for("react.context") : 60110, m = e ? Symbol.for("react.async_mode") : 60111, p = e ? Symbol.for("react.concurrent_mode") : 60111, T = e ? Symbol.for("react.forward_ref") : 60112, w = e ? Symbol.for("react.suspense") : 60113, I = e ? Symbol.for("react.suspense_list") : 60120, D = e ? Symbol.for("react.memo") : 60115, M = e ? Symbol.for("react.lazy") : 60116, H = e ? Symbol.for("react.block") : 60121, Q = e ? Symbol.for("react.fundamental") : 60117, B = e ? Symbol.for("react.responder") : 60118, R = e ? Symbol.for("react.scope") : 60119;
-  function F(c) {
-    if (typeof c == "object" && c !== null) {
-      var L = c.$$typeof;
-      switch (L) {
+var Ce = Mn(), qe = { exports: {} }, E = {};
+var Dt;
+function Fn() {
+  if (Dt) return E;
+  Dt = 1;
+  var e = typeof Symbol == "function" && Symbol.for, t = e ? /* @__PURE__ */ Symbol.for("react.element") : 60103, r = e ? /* @__PURE__ */ Symbol.for("react.portal") : 60106, i = e ? /* @__PURE__ */ Symbol.for("react.fragment") : 60107, a = e ? /* @__PURE__ */ Symbol.for("react.strict_mode") : 60108, o = e ? /* @__PURE__ */ Symbol.for("react.profiler") : 60114, c = e ? /* @__PURE__ */ Symbol.for("react.provider") : 60109, f = e ? /* @__PURE__ */ Symbol.for("react.context") : 60110, p = e ? /* @__PURE__ */ Symbol.for("react.async_mode") : 60111, m = e ? /* @__PURE__ */ Symbol.for("react.concurrent_mode") : 60111, P = e ? /* @__PURE__ */ Symbol.for("react.forward_ref") : 60112, w = e ? /* @__PURE__ */ Symbol.for("react.suspense") : 60113, q = e ? /* @__PURE__ */ Symbol.for("react.suspense_list") : 60120, F = e ? /* @__PURE__ */ Symbol.for("react.memo") : 60115, k = e ? /* @__PURE__ */ Symbol.for("react.lazy") : 60116, H = e ? /* @__PURE__ */ Symbol.for("react.block") : 60121, Z = e ? /* @__PURE__ */ Symbol.for("react.fundamental") : 60117, L = e ? /* @__PURE__ */ Symbol.for("react.responder") : 60118, I = e ? /* @__PURE__ */ Symbol.for("react.scope") : 60119;
+  function A(u) {
+    if (typeof u == "object" && u !== null) {
+      var V = u.$$typeof;
+      switch (V) {
         case t:
-          switch (c = c.type, c) {
-            case m:
+          switch (u = u.type, u) {
             case p:
+            case m:
             case i:
-            case l:
+            case o:
             case a:
             case w:
-              return c;
+              return u;
             default:
-              switch (c = c && c.$$typeof, c) {
-                case h:
-                case T:
-                case M:
-                case D:
-                case d:
-                  return c;
+              switch (u = u && u.$$typeof, u) {
+                case f:
+                case P:
+                case k:
+                case F:
+                case c:
+                  return u;
                 default:
-                  return L;
+                  return V;
               }
           }
-        case n:
-          return L;
+        case r:
+          return V;
       }
     }
   }
-  function _(c) {
-    return F(c) === p;
-  }
-  return C.AsyncMode = m, C.ConcurrentMode = p, C.ContextConsumer = h, C.ContextProvider = d, C.Element = t, C.ForwardRef = T, C.Fragment = i, C.Lazy = M, C.Memo = D, C.Portal = n, C.Profiler = l, C.StrictMode = a, C.Suspense = w, C.isAsyncMode = function(c) {
-    return _(c) || F(c) === m;
-  }, C.isConcurrentMode = _, C.isContextConsumer = function(c) {
-    return F(c) === h;
-  }, C.isContextProvider = function(c) {
-    return F(c) === d;
-  }, C.isElement = function(c) {
-    return typeof c == "object" && c !== null && c.$$typeof === t;
-  }, C.isForwardRef = function(c) {
-    return F(c) === T;
-  }, C.isFragment = function(c) {
-    return F(c) === i;
-  }, C.isLazy = function(c) {
-    return F(c) === M;
-  }, C.isMemo = function(c) {
-    return F(c) === D;
-  }, C.isPortal = function(c) {
-    return F(c) === n;
-  }, C.isProfiler = function(c) {
-    return F(c) === l;
-  }, C.isStrictMode = function(c) {
-    return F(c) === a;
-  }, C.isSuspense = function(c) {
-    return F(c) === w;
-  }, C.isValidElementType = function(c) {
-    return typeof c == "string" || typeof c == "function" || c === i || c === p || c === l || c === a || c === w || c === I || typeof c == "object" && c !== null && (c.$$typeof === M || c.$$typeof === D || c.$$typeof === d || c.$$typeof === h || c.$$typeof === T || c.$$typeof === Q || c.$$typeof === B || c.$$typeof === R || c.$$typeof === H);
-  }, C.typeOf = F, C;
+  function x(u) {
+    return A(u) === m;
+  }
+  return E.AsyncMode = p, E.ConcurrentMode = m, E.ContextConsumer = f, E.ContextProvider = c, E.Element = t, E.ForwardRef = P, E.Fragment = i, E.Lazy = k, E.Memo = F, E.Portal = r, E.Profiler = o, E.StrictMode = a, E.Suspense = w, E.isAsyncMode = function(u) {
+    return x(u) || A(u) === p;
+  }, E.isConcurrentMode = x, E.isContextConsumer = function(u) {
+    return A(u) === f;
+  }, E.isContextProvider = function(u) {
+    return A(u) === c;
+  }, E.isElement = function(u) {
+    return typeof u == "object" && u !== null && u.$$typeof === t;
+  }, E.isForwardRef = function(u) {
+    return A(u) === P;
+  }, E.isFragment = function(u) {
+    return A(u) === i;
+  }, E.isLazy = function(u) {
+    return A(u) === k;
+  }, E.isMemo = function(u) {
+    return A(u) === F;
+  }, E.isPortal = function(u) {
+    return A(u) === r;
+  }, E.isProfiler = function(u) {
+    return A(u) === o;
+  }, E.isStrictMode = function(u) {
+    return A(u) === a;
+  }, E.isSuspense = function(u) {
+    return A(u) === w;
+  }, E.isValidElementType = function(u) {
+    return typeof u == "string" || typeof u == "function" || u === i || u === m || u === o || u === a || u === w || u === q || typeof u == "object" && u !== null && (u.$$typeof === k || u.$$typeof === F || u.$$typeof === c || u.$$typeof === f || u.$$typeof === P || u.$$typeof === Z || u.$$typeof === L || u.$$typeof === I || u.$$typeof === H);
+  }, E.typeOf = A, E;
 }
-var x = {};
-var kt;
-function wn() {
-  return kt || (kt = 1, process.env.NODE_ENV !== "production" && (function() {
-    var e = typeof Symbol == "function" && Symbol.for, t = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, i = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, l = e ? Symbol.for("react.profiler") : 60114, d = e ? Symbol.for("react.provider") : 60109, h = e ? Symbol.for("react.context") : 60110, m = e ? Symbol.for("react.async_mode") : 60111, p = e ? Symbol.for("react.concurrent_mode") : 60111, T = e ? Symbol.for("react.forward_ref") : 60112, w = e ? Symbol.for("react.suspense") : 60113, I = e ? Symbol.for("react.suspense_list") : 60120, D = e ? Symbol.for("react.memo") : 60115, M = e ? Symbol.for("react.lazy") : 60116, H = e ? Symbol.for("react.block") : 60121, Q = e ? Symbol.for("react.fundamental") : 60117, B = e ? Symbol.for("react.responder") : 60118, R = e ? Symbol.for("react.scope") : 60119;
-    function F(f) {
-      return typeof f == "string" || typeof f == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-      f === i || f === p || f === l || f === a || f === w || f === I || typeof f == "object" && f !== null && (f.$$typeof === M || f.$$typeof === D || f.$$typeof === d || f.$$typeof === h || f.$$typeof === T || f.$$typeof === Q || f.$$typeof === B || f.$$typeof === R || f.$$typeof === H);
-    }
-    function _(f) {
-      if (typeof f == "object" && f !== null) {
-        var be = f.$$typeof;
+var R = {};
+var Mt;
+function Nn() {
+  return Mt || (Mt = 1, process.env.NODE_ENV !== "production" && (function() {
+    var e = typeof Symbol == "function" && Symbol.for, t = e ? /* @__PURE__ */ Symbol.for("react.element") : 60103, r = e ? /* @__PURE__ */ Symbol.for("react.portal") : 60106, i = e ? /* @__PURE__ */ Symbol.for("react.fragment") : 60107, a = e ? /* @__PURE__ */ Symbol.for("react.strict_mode") : 60108, o = e ? /* @__PURE__ */ Symbol.for("react.profiler") : 60114, c = e ? /* @__PURE__ */ Symbol.for("react.provider") : 60109, f = e ? /* @__PURE__ */ Symbol.for("react.context") : 60110, p = e ? /* @__PURE__ */ Symbol.for("react.async_mode") : 60111, m = e ? /* @__PURE__ */ Symbol.for("react.concurrent_mode") : 60111, P = e ? /* @__PURE__ */ Symbol.for("react.forward_ref") : 60112, w = e ? /* @__PURE__ */ Symbol.for("react.suspense") : 60113, q = e ? /* @__PURE__ */ Symbol.for("react.suspense_list") : 60120, F = e ? /* @__PURE__ */ Symbol.for("react.memo") : 60115, k = e ? /* @__PURE__ */ Symbol.for("react.lazy") : 60116, H = e ? /* @__PURE__ */ Symbol.for("react.block") : 60121, Z = e ? /* @__PURE__ */ Symbol.for("react.fundamental") : 60117, L = e ? /* @__PURE__ */ Symbol.for("react.responder") : 60118, I = e ? /* @__PURE__ */ Symbol.for("react.scope") : 60119;
+    function A(y) {
+      return typeof y == "string" || typeof y == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+      y === i || y === m || y === o || y === a || y === w || y === q || typeof y == "object" && y !== null && (y.$$typeof === k || y.$$typeof === F || y.$$typeof === c || y.$$typeof === f || y.$$typeof === P || y.$$typeof === Z || y.$$typeof === L || y.$$typeof === I || y.$$typeof === H);
+    }
+    function x(y) {
+      if (typeof y == "object" && y !== null) {
+        var be = y.$$typeof;
         switch (be) {
           case t:
-            var ue = f.type;
-            switch (ue) {
-              case m:
+            var de = y.type;
+            switch (de) {
               case p:
+              case m:
               case i:
-              case l:
+              case o:
               case a:
               case w:
-                return ue;
+                return de;
               default:
-                var oe = ue && ue.$$typeof;
-                switch (oe) {
-                  case h:
-                  case T:
-                  case M:
-                  case D:
-                  case d:
-                    return oe;
+                var ie = de && de.$$typeof;
+                switch (ie) {
+                  case f:
+                  case P:
+                  case k:
+                  case F:
+                  case c:
+                    return ie;
                   default:
                     return be;
                 }
             }
-          case n:
+          case r:
             return be;
         }
       }
     }
-    var c = m, L = p, me = h, Se = d, Pe = t, Ve = T, Ye = i, we = M, K = D, ee = n, ie = l, Re = a, Oe = w, he = !1;
-    function _e(f) {
-      return he || (he = !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.")), ve(f) || _(f) === m;
+    var u = p, V = m, ye = f, Oe = c, _e = t, We = P, He = i, ke = k, K = F, ee = r, ne = o, Ae = a, De = w, he = !1;
+    function Me(y) {
+      return he || (he = !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.")), me(y) || x(y) === p;
     }
-    function ve(f) {
-      return _(f) === p;
+    function me(y) {
+      return x(y) === m;
     }
-    function ke(f) {
-      return _(f) === h;
+    function Fe(y) {
+      return x(y) === f;
     }
-    function Ae(f) {
-      return _(f) === d;
+    function Ne(y) {
+      return x(y) === c;
     }
-    function Me(f) {
-      return typeof f == "object" && f !== null && f.$$typeof === t;
+    function $e(y) {
+      return typeof y == "object" && y !== null && y.$$typeof === t;
     }
-    function We(f) {
-      return _(f) === T;
+    function Ge(y) {
+      return x(y) === P;
     }
-    function Ue(f) {
-      return _(f) === i;
+    function Je(y) {
+      return x(y) === i;
     }
-    function pe(f) {
-      return _(f) === M;
+    function ve(y) {
+      return x(y) === k;
     }
-    function ye(f) {
-      return _(f) === D;
+    function ge(y) {
+      return x(y) === F;
     }
-    function le(f) {
-      return _(f) === n;
+    function ce(y) {
+      return x(y) === r;
     }
-    function ge(f) {
-      return _(f) === l;
+    function Pe(y) {
+      return x(y) === o;
     }
-    function ce(f) {
-      return _(f) === a;
+    function ue(y) {
+      return x(y) === a;
     }
-    function qe(f) {
-      return _(f) === w;
+    function Qe(y) {
+      return x(y) === w;
     }
-    x.AsyncMode = c, x.ConcurrentMode = L, x.ContextConsumer = me, x.ContextProvider = Se, x.Element = Pe, x.ForwardRef = Ve, x.Fragment = Ye, x.Lazy = we, x.Memo = K, x.Portal = ee, x.Profiler = ie, x.StrictMode = Re, x.Suspense = Oe, x.isAsyncMode = _e, x.isConcurrentMode = ve, x.isContextConsumer = ke, x.isContextProvider = Ae, x.isElement = Me, x.isForwardRef = We, x.isFragment = Ue, x.isLazy = pe, x.isMemo = ye, x.isPortal = le, x.isProfiler = ge, x.isStrictMode = ce, x.isSuspense = qe, x.isValidElementType = F, x.typeOf = _;
-  })()), x;
+    R.AsyncMode = u, R.ConcurrentMode = V, R.ContextConsumer = ye, R.ContextProvider = Oe, R.Element = _e, R.ForwardRef = We, R.Fragment = He, R.Lazy = ke, R.Memo = K, R.Portal = ee, R.Profiler = ne, R.StrictMode = Ae, R.Suspense = De, R.isAsyncMode = Me, R.isConcurrentMode = me, R.isContextConsumer = Fe, R.isContextProvider = Ne, R.isElement = $e, R.isForwardRef = Ge, R.isFragment = Je, R.isLazy = ve, R.isMemo = ge, R.isPortal = ce, R.isProfiler = Pe, R.isStrictMode = ue, R.isSuspense = Qe, R.isValidElementType = A, R.typeOf = x;
+  })()), R;
 }
-var At;
-function Rn() {
-  return At || (At = 1, process.env.NODE_ENV === "production" ? Ne.exports = Pn() : Ne.exports = wn()), Ne.exports;
+var Ft;
+function $n() {
+  return Ft || (Ft = 1, process.env.NODE_ENV === "production" ? qe.exports = Fn() : qe.exports = Nn()), qe.exports;
 }
-var Qe, Mt;
-function On() {
-  if (Mt) return Qe;
-  Mt = 1;
-  var e = Rn(), t = {
+var rt, Nt;
+function jn() {
+  if (Nt) return rt;
+  Nt = 1;
+  var e = $n(), t = {
     childContextTypes: !0,
     contextType: !0,
     contextTypes: !0,
@@ -802,7 +802,7 @@ function On() {
     mixins: !0,
     propTypes: !0,
     type: !0
-  }, n = {
+  }, r = {
     name: !0,
     length: !0,
     prototype: !0,
@@ -823,45 +823,45 @@ function On() {
     displayName: !0,
     propTypes: !0,
     type: !0
-  }, l = {};
-  l[e.ForwardRef] = i, l[e.Memo] = a;
-  function d(M) {
-    return e.isMemo(M) ? a : l[M.$$typeof] || t;
+  }, o = {};
+  o[e.ForwardRef] = i, o[e.Memo] = a;
+  function c(k) {
+    return e.isMemo(k) ? a : o[k.$$typeof] || t;
   }
-  var h = Object.defineProperty, m = Object.getOwnPropertyNames, p = Object.getOwnPropertySymbols, T = Object.getOwnPropertyDescriptor, w = Object.getPrototypeOf, I = Object.prototype;
-  function D(M, H, Q) {
+  var f = Object.defineProperty, p = Object.getOwnPropertyNames, m = Object.getOwnPropertySymbols, P = Object.getOwnPropertyDescriptor, w = Object.getPrototypeOf, q = Object.prototype;
+  function F(k, H, Z) {
     if (typeof H != "string") {
-      if (I) {
-        var B = w(H);
-        B && B !== I && D(M, B, Q);
+      if (q) {
+        var L = w(H);
+        L && L !== q && F(k, L, Z);
       }
-      var R = m(H);
-      p && (R = R.concat(p(H)));
-      for (var F = d(M), _ = d(H), c = 0; c < R.length; ++c) {
-        var L = R[c];
-        if (!n[L] && !(Q && Q[L]) && !(_ && _[L]) && !(F && F[L])) {
-          var me = T(H, L);
+      var I = p(H);
+      m && (I = I.concat(m(H)));
+      for (var A = c(k), x = c(H), u = 0; u < I.length; ++u) {
+        var V = I[u];
+        if (!r[V] && !(Z && Z[V]) && !(x && x[V]) && !(A && A[V])) {
+          var ye = P(H, V);
           try {
-            h(M, L, me);
+            f(k, V, ye);
           } catch {
           }
         }
       }
     }
-    return M;
+    return k;
   }
-  return Qe = D, Qe;
+  return rt = F, rt;
 }
-On();
-var _n = !0;
-function kn(e, t, n) {
+jn();
+var zn = !0;
+function qn(e, t, r) {
   var i = "";
-  return n.split(" ").forEach(function(a) {
+  return r.split(" ").forEach(function(a) {
     e[a] !== void 0 ? t.push(e[a] + ";") : a && (i += a + " ");
   }), i;
 }
-var Xt = function(t, n, i) {
-  var a = t.key + "-" + n.name;
+var tr = function(t, r, i) {
+  var a = t.key + "-" + r.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
@@ -871,23 +871,23 @@ var Xt = function(t, n, i) {
   // 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
-  _n === !1) && t.registered[a] === void 0 && (t.registered[a] = n.styles);
-}, An = function(t, n, i) {
-  Xt(t, n, i);
-  var a = t.key + "-" + n.name;
-  if (t.inserted[n.name] === void 0) {
-    var l = n;
+  zn === !1) && t.registered[a] === void 0 && (t.registered[a] = r.styles);
+}, Ln = function(t, r, i) {
+  tr(t, r, i);
+  var a = t.key + "-" + r.name;
+  if (t.inserted[r.name] === void 0) {
+    var o = r;
     do
-      t.insert(n === l ? "." + a : "", l, t.sheet, !0), l = l.next;
-    while (l !== void 0);
+      t.insert(r === o ? "." + a : "", o, t.sheet, !0), o = o.next;
+    while (o !== void 0);
   }
 };
-function Mn(e) {
-  for (var t = 0, n, i = 0, a = e.length; a >= 4; ++i, a -= 4)
-    n = e.charCodeAt(i) & 255 | (e.charCodeAt(++i) & 255) << 8 | (e.charCodeAt(++i) & 255) << 16 | (e.charCodeAt(++i) & 255) << 24, n = /* Math.imul(k, m): */
-    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), n ^= /* k >>> r: */
-    n >>> 24, t = /* Math.imul(k, m): */
-    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16) ^ /* Math.imul(h, m): */
+function Vn(e) {
+  for (var t = 0, r, i = 0, a = e.length; a >= 4; ++i, a -= 4)
+    r = e.charCodeAt(i) & 255 | (e.charCodeAt(++i) & 255) << 8 | (e.charCodeAt(++i) & 255) << 16 | (e.charCodeAt(++i) & 255) << 24, r = /* Math.imul(k, m): */
+    (r & 65535) * 1540483477 + ((r >>> 16) * 59797 << 16), r ^= /* k >>> r: */
+    r >>> 24, t = /* Math.imul(k, m): */
+    (r & 65535) * 1540483477 + ((r >>> 16) * 59797 << 16) ^ /* Math.imul(h, m): */
     (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16);
   switch (a) {
     case 3:
@@ -901,7 +901,7 @@ function Mn(e) {
   return t ^= t >>> 13, t = /* Math.imul(h, m): */
   (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16), ((t ^ t >>> 15) >>> 0).toString(36);
 }
-var Fn = {
+var Un = {
   animationIterationCount: 1,
   aspectRatio: 1,
   borderImageOutset: 1,
@@ -951,265 +951,739 @@ var Fn = {
   strokeOpacity: 1,
   strokeWidth: 1
 };
-function jn(e) {
+function Yn(e) {
   var t = /* @__PURE__ */ Object.create(null);
-  return function(n) {
-    return t[n] === void 0 && (t[n] = e(n)), t[n];
+  return function(r) {
+    return t[r] === void 0 && (t[r] = e(r)), t[r];
   };
 }
-var Nn = /[A-Z]|^ms/g, $n = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Zt = function(t) {
+var Wn = /[A-Z]|^ms/g, Hn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, rr = function(t) {
   return t.charCodeAt(1) === 45;
-}, Ft = function(t) {
+}, $t = function(t) {
   return t != null && typeof t != "boolean";
-}, et = /* @__PURE__ */ jn(function(e) {
-  return Zt(e) ? e : e.replace(Nn, "-$&").toLowerCase();
-}), jt = function(t, n) {
+}, nt = /* @__PURE__ */ Yn(function(e) {
+  return rr(e) ? e : e.replace(Wn, "-$&").toLowerCase();
+}), jt = function(t, r) {
   switch (t) {
     case "animation":
     case "animationName":
-      if (typeof n == "string")
-        return n.replace($n, function(i, a, l) {
-          return X = {
+      if (typeof r == "string")
+        return r.replace(Hn, function(i, a, o) {
+          return B = {
             name: a,
-            styles: l,
-            next: X
+            styles: o,
+            next: B
           }, a;
         });
   }
-  return Fn[t] !== 1 && !Zt(t) && typeof n == "number" && n !== 0 ? n + "px" : n;
+  return Un[t] !== 1 && !rr(t) && typeof r == "number" && r !== 0 ? r + "px" : r;
 };
-function Ie(e, t, n) {
-  if (n == null)
+function Ie(e, t, r) {
+  if (r == null)
     return "";
-  var i = n;
+  var i = r;
   if (i.__emotion_styles !== void 0)
     return i;
-  switch (typeof n) {
+  switch (typeof r) {
     case "boolean":
       return "";
     case "object": {
-      var a = n;
+      var a = r;
       if (a.anim === 1)
-        return X = {
+        return B = {
           name: a.name,
           styles: a.styles,
-          next: X
+          next: B
         }, a.name;
-      var l = n;
-      if (l.styles !== void 0) {
-        var d = l.next;
-        if (d !== void 0)
-          for (; d !== void 0; )
-            X = {
-              name: d.name,
-              styles: d.styles,
-              next: X
-            }, d = d.next;
-        var h = l.styles + ";";
-        return h;
+      var o = r;
+      if (o.styles !== void 0) {
+        var c = o.next;
+        if (c !== void 0)
+          for (; c !== void 0; )
+            B = {
+              name: c.name,
+              styles: c.styles,
+              next: B
+            }, c = c.next;
+        var f = o.styles + ";";
+        return f;
       }
-      return Dn(e, t, n);
+      return Gn(e, t, r);
     }
     case "function": {
       if (e !== void 0) {
-        var m = X, p = n(e);
-        return X = m, Ie(e, t, p);
+        var p = B, m = r(e);
+        return B = p, Ie(e, t, m);
       }
       break;
     }
   }
-  var T = n;
-  return T;
+  var P = r;
+  return P;
 }
-function Dn(e, t, n) {
+function Gn(e, t, r) {
   var i = "";
-  if (Array.isArray(n))
-    for (var a = 0; a < n.length; a++)
-      i += Ie(e, t, n[a]) + ";";
+  if (Array.isArray(r))
+    for (var a = 0; a < r.length; a++)
+      i += Ie(e, t, r[a]) + ";";
   else
-    for (var l in n) {
-      var d = n[l];
-      if (typeof d != "object") {
-        var h = d;
-        Ft(h) && (i += et(l) + ":" + jt(l, h) + ";");
-      } else if (Array.isArray(d) && typeof d[0] == "string" && t == null)
-        for (var m = 0; m < d.length; m++)
-          Ft(d[m]) && (i += et(l) + ":" + jt(l, d[m]) + ";");
+    for (var o in r) {
+      var c = r[o];
+      if (typeof c != "object") {
+        var f = c;
+        $t(f) && (i += nt(o) + ":" + jt(o, f) + ";");
+      } else if (Array.isArray(c) && typeof c[0] == "string" && t == null)
+        for (var p = 0; p < c.length; p++)
+          $t(c[p]) && (i += nt(o) + ":" + jt(o, c[p]) + ";");
       else {
-        var p = Ie(e, t, d);
-        switch (l) {
+        var m = Ie(e, t, c);
+        switch (o) {
           case "animation":
           case "animationName": {
-            i += et(l) + ":" + p + ";";
+            i += nt(o) + ":" + m + ";";
             break;
           }
           default:
-            i += l + "{" + p + "}";
+            i += o + "{" + m + "}";
         }
       }
     }
   return i;
 }
-var Nt = /label:\s*([^\s;{]+)\s*(;|$)/g, X;
-function zn(e, t, n) {
+var zt = /label:\s*([^\s;{]+)\s*(;|$)/g, B;
+function Jn(e, t, r) {
   if (e.length === 1 && typeof e[0] == "object" && e[0] !== null && e[0].styles !== void 0)
     return e[0];
   var i = !0, a = "";
-  X = void 0;
-  var l = e[0];
-  if (l == null || l.raw === void 0)
-    i = !1, a += Ie(n, t, l);
+  B = void 0;
+  var o = e[0];
+  if (o == null || o.raw === void 0)
+    i = !1, a += Ie(r, t, o);
   else {
-    var d = l;
-    a += d[0];
-  }
-  for (var h = 1; h < e.length; h++)
-    if (a += Ie(n, t, e[h]), i) {
-      var m = l;
-      a += m[h];
-    }
-  Nt.lastIndex = 0;
-  for (var p = "", T; (T = Nt.exec(a)) !== null; )
-    p += "-" + T[1];
-  var w = Mn(a) + p;
+    var c = o;
+    a += c[0];
+  }
+  for (var f = 1; f < e.length; f++)
+    if (a += Ie(r, t, e[f]), i) {
+      var p = o;
+      a += p[f];
+    }
+  zt.lastIndex = 0;
+  for (var m = "", P; (P = zt.exec(a)) !== null; )
+    m += "-" + P[1];
+  var w = Vn(a) + m;
   return {
     name: w,
     styles: a,
-    next: X
+    next: B
   };
 }
-var Bn = function(t) {
+var Qn = function(t) {
   return t();
-}, Ln = te.useInsertionEffect ? te.useInsertionEffect : !1, Vn = Ln || Bn, Qt = /* @__PURE__ */ te.createContext(
+}, Kn = te.useInsertionEffect ? te.useInsertionEffect : !1, Bn = Kn || Qn, nr = /* @__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__ */ Mr({
+  typeof HTMLElement < "u" ? /* @__PURE__ */ qr({
     key: "css"
   }) : null
 );
-Qt.Provider;
-var Yn = function(t) {
-  return /* @__PURE__ */ _r(function(n, i) {
-    var a = at(Qt);
-    return t(n, a, i);
+nr.Provider;
+var Xn = function(t) {
+  return /* @__PURE__ */ jr(function(r, i) {
+    var a = ct(nr);
+    return t(r, a, i);
   });
-}, Wn = /* @__PURE__ */ te.createContext({}), Be = {}.hasOwnProperty, it = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", er = function(t, n) {
+}, Zn = /* @__PURE__ */ te.createContext({}), Ue = {}.hasOwnProperty, ot = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", ir = function(t, r) {
   var i = {};
-  for (var a in n)
-    Be.call(n, a) && (i[a] = n[a]);
-  return i[it] = t, i;
-}, Un = function(t) {
-  var n = t.cache, i = t.serialized, a = t.isStringTag;
-  return Xt(n, i, a), Vn(function() {
-    return An(n, i, a);
+  for (var a in r)
+    Ue.call(r, a) && (i[a] = r[a]);
+  return i[ot] = t, i;
+}, ei = function(t) {
+  var r = t.cache, i = t.serialized, a = t.isStringTag;
+  return tr(r, i, a), Bn(function() {
+    return Ln(r, i, a);
   }), null;
-}, qn = /* @__PURE__ */ Yn(function(e, t, n) {
+}, ti = /* @__PURE__ */ Xn(function(e, t, r) {
   var i = e.css;
   typeof i == "string" && t.registered[i] !== void 0 && (i = t.registered[i]);
-  var a = e[it], l = [i], d = "";
-  typeof e.className == "string" ? d = kn(t.registered, l, e.className) : e.className != null && (d = e.className + " ");
-  var h = zn(l, void 0, te.useContext(Wn));
-  d += t.key + "-" + h.name;
-  var m = {};
-  for (var p in e)
-    Be.call(e, p) && p !== "css" && p !== it && (m[p] = e[p]);
-  return m.className = d, n && (m.ref = n), /* @__PURE__ */ te.createElement(te.Fragment, null, /* @__PURE__ */ te.createElement(Un, {
+  var a = e[ot], o = [i], c = "";
+  typeof e.className == "string" ? c = qn(t.registered, o, e.className) : e.className != null && (c = e.className + " ");
+  var f = Jn(o, void 0, te.useContext(Zn));
+  c += t.key + "-" + f.name;
+  var p = {};
+  for (var m in e)
+    Ue.call(e, m) && m !== "css" && m !== ot && (p[m] = e[m]);
+  return p.className = c, r && (p.ref = r), /* @__PURE__ */ te.createElement(te.Fragment, null, /* @__PURE__ */ te.createElement(ei, {
     cache: t,
-    serialized: h,
+    serialized: f,
     isStringTag: typeof a == "string"
-  }), /* @__PURE__ */ te.createElement(a, m));
-}), tr = qn, Le = xe.Fragment, o = function(t, n, i) {
-  return Be.call(n, "css") ? xe.jsx(tr, er(t, n), i) : xe.jsx(t, n, i);
-}, $ = function(t, n, i) {
-  return Be.call(n, "css") ? xe.jsxs(tr, er(t, n), i) : xe.jsxs(t, n, i);
+  }), /* @__PURE__ */ te.createElement(a, p));
+}), ar = ti, Ye = Ce.Fragment, s = function(t, r, i) {
+  return Ue.call(r, "css") ? Ce.jsx(ar, ir(t, r), i) : Ce.jsx(t, r, i);
+}, M = function(t, r, i) {
+  return Ue.call(r, "css") ? Ce.jsxs(ar, ir(t, r), i) : Ce.jsxs(t, r, i);
 };
-const Hn = ({
+const ri = {
+  mediaPlayer: {
+    enablePlaylists: process.env.NODE_ENV !== "production"
+  }
+}, ni = "http://localhost".replace(/\/+$/, "");
+class sr {
+  constructor(t = {}) {
+    this.configuration = t;
+  }
+  set config(t) {
+    this.configuration = t;
+  }
+  get basePath() {
+    return this.configuration.basePath != null ? this.configuration.basePath : ni;
+  }
+  get fetchApi() {
+    return this.configuration.fetchApi;
+  }
+  get middleware() {
+    return this.configuration.middleware || [];
+  }
+  get queryParamsStringify() {
+    return this.configuration.queryParamsStringify || or;
+  }
+  get username() {
+    return this.configuration.username;
+  }
+  get password() {
+    return this.configuration.password;
+  }
+  get apiKey() {
+    const t = this.configuration.apiKey;
+    if (t)
+      return typeof t == "function" ? t : () => t;
+  }
+  get accessToken() {
+    const t = this.configuration.accessToken;
+    if (t)
+      return typeof t == "function" ? t : async () => t;
+  }
+  get headers() {
+    return this.configuration.headers;
+  }
+  get credentials() {
+    return this.configuration.credentials;
+  }
+}
+const ii = new sr();
+class pt {
+  constructor(t = ii) {
+    this.configuration = t, this.middleware = t.middleware;
+  }
+  static jsonRegex = new RegExp("^(:?application/json|[^;/ 	]+/[^;/ 	]+[+]json)[ 	]*(:?;.*)?$", "i");
+  middleware;
+  withMiddleware(...t) {
+    const r = this.clone();
+    return r.middleware = r.middleware.concat(...t), r;
+  }
+  withPreMiddleware(...t) {
+    const r = t.map((i) => ({ pre: i }));
+    return this.withMiddleware(...r);
+  }
+  withPostMiddleware(...t) {
+    const r = t.map((i) => ({ post: i }));
+    return this.withMiddleware(...r);
+  }
+  /**
+   * Check if the given MIME is a JSON MIME.
+   * JSON MIME examples:
+   *   application/json
+   *   application/json; charset=UTF8
+   *   APPLICATION/JSON
+   *   application/vnd.company+json
+   * @param mime - MIME (Multipurpose Internet Mail Extensions)
+   * @return True if the given MIME is JSON, false otherwise.
+   */
+  isJsonMime(t) {
+    return t ? pt.jsonRegex.test(t) : !1;
+  }
+  async request(t, r) {
+    const { url: i, init: a } = await this.createFetchParams(t, r), o = await this.fetchApi(i, a);
+    if (o && o.status >= 200 && o.status < 300)
+      return o;
+    throw new oi(o, "Response returned an error code");
+  }
+  async createFetchParams(t, r) {
+    let i = this.configuration.basePath + t.path;
+    t.query !== void 0 && Object.keys(t.query).length !== 0 && (i += "?" + this.configuration.queryParamsStringify(t.query));
+    const a = Object.assign({}, this.configuration.headers, t.headers);
+    Object.keys(a).forEach((P) => a[P] === void 0 ? delete a[P] : {});
+    const o = typeof r == "function" ? r : async () => r, c = {
+      method: t.method,
+      headers: a,
+      body: t.body,
+      credentials: this.configuration.credentials
+    }, f = {
+      ...c,
+      ...await o({
+        init: c,
+        context: t
+      })
+    };
+    let p;
+    si(f.body) || f.body instanceof URLSearchParams || ai(f.body) ? p = f.body : this.isJsonMime(a["Content-Type"]) ? p = JSON.stringify(f.body) : p = f.body;
+    const m = {
+      ...f,
+      body: p
+    };
+    return { url: i, init: m };
+  }
+  fetchApi = async (t, r) => {
+    let i = { url: t, init: r };
+    for (const o of this.middleware)
+      o.pre && (i = await o.pre({
+        fetch: this.fetchApi,
+        ...i
+      }) || i);
+    let a;
+    try {
+      a = await (this.configuration.fetchApi || fetch)(i.url, i.init);
+    } catch (o) {
+      for (const c of this.middleware)
+        c.onError && (a = await c.onError({
+          fetch: this.fetchApi,
+          url: i.url,
+          init: i.init,
+          error: o,
+          response: a ? a.clone() : void 0
+        }) || a);
+      if (a === void 0)
+        throw o instanceof Error ? new li(o, "The request failed and the interceptors did not return an alternative response") : o;
+    }
+    for (const o of this.middleware)
+      o.post && (a = await o.post({
+        fetch: this.fetchApi,
+        url: i.url,
+        init: i.init,
+        response: a.clone()
+      }) || a);
+    return a;
+  };
+  /**
+   * Create a shallow clone of `this` by constructing a new instance
+   * and then shallow cloning data members.
+   */
+  clone() {
+    const t = this.constructor, r = new t(this.configuration);
+    return r.middleware = this.middleware.slice(), r;
+  }
+}
+function ai(e) {
+  return typeof Blob < "u" && e instanceof Blob;
+}
+function si(e) {
+  return typeof FormData < "u" && e instanceof FormData;
+}
+class oi extends Error {
+  constructor(t, r) {
+    super(r), this.response = t;
+  }
+  name = "ResponseError";
+}
+class li extends Error {
+  constructor(t, r) {
+    super(r), this.cause = t;
+  }
+  name = "FetchError";
+}
+class Re extends Error {
+  constructor(t, r) {
+    super(r), this.field = t;
+  }
+  name = "RequiredError";
+}
+function or(e, t = "") {
+  return Object.keys(e).map((r) => lr(r, e[r], t)).filter((r) => r.length > 0).join("&");
+}
+function lr(e, t, r = "") {
+  const i = r + (r.length ? `[${e}]` : e);
+  if (t instanceof Array) {
+    const a = t.map((o) => encodeURIComponent(String(o))).join(`&${encodeURIComponent(i)}=`);
+    return `${encodeURIComponent(i)}=${a}`;
+  }
+  if (t instanceof Set) {
+    const a = Array.from(t);
+    return lr(e, a, r);
+  }
+  return t instanceof Date ? `${encodeURIComponent(i)}=${encodeURIComponent(t.toISOString())}` : t instanceof Object ? or(t, i) : `${encodeURIComponent(i)}=${encodeURIComponent(String(t))}`;
+}
+class se {
+  constructor(t, r = (i) => i) {
+    this.raw = t, this.transformer = r;
+  }
+  async value() {
+    return this.transformer(await this.raw.json());
+  }
+}
+function cr(e) {
+  return ci(e);
+}
+function ci(e, t) {
+  return e == null ? e : {
+    id: e.id,
+    name: e.name
+  };
+}
+function ui(e) {
+  return di(e);
+}
+function di(e, t) {
+  return e == null ? e : {
+    playlist: cr(e.playlist)
+  };
+}
+function fi(e) {
+  return pi(e);
+}
+function pi(e, t) {
+  return e == null ? e : {
+    items: e.items.map(cr)
+  };
+}
+function yi(e) {
+  return hi(e);
+}
+function hi(e, t) {
+  return e == null ? e : {
+    id: e.id,
+    url: e.url,
+    type: e.type,
+    videoId: e.videoId,
+    title: e.title
+  };
+}
+function mi(e) {
+  return vi(e);
+}
+function vi(e, t) {
+  return e == null ? e : {
+    items: e.items.map(yi)
+  };
+}
+function gi(e) {
+  return Pi(e, !1);
+}
+function Pi(e, t = !1) {
+  return e == null ? e : {
+    name: e.name
+  };
+}
+function bi(e) {
+  return wi(e, !1);
+}
+function wi(e, t = !1) {
+  return e == null ? e : {
+    name: e.name
+  };
+}
+class Si extends pt {
+  /**
+   */
+  async mediaPlayerPlaylistsGetRaw(t) {
+    const r = {}, i = {}, o = await this.request({
+      path: "/media-player/playlists",
+      method: "GET",
+      headers: i,
+      query: r
+    }, t);
+    return new se(o, (c) => fi(c));
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsGet(t) {
+    return await (await this.mediaPlayerPlaylistsGetRaw(t)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdDeleteRaw(t, r) {
+    if (t.id == null)
+      throw new Re(
+        "id",
+        'Required parameter "id" was null or undefined when calling mediaPlayerPlaylistsIdDelete().'
+      );
+    const i = {}, a = {};
+    let o = "/media-player/playlists/{id}";
+    o = o.replace("{id}", encodeURIComponent(String(t.id)));
+    const c = await this.request({
+      path: o,
+      method: "DELETE",
+      headers: a,
+      query: i
+    }, r);
+    return new se(c);
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdDelete(t, r) {
+    return await (await this.mediaPlayerPlaylistsIdDeleteRaw(t, r)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdGetRaw(t, r) {
+    if (t.id == null)
+      throw new Re(
+        "id",
+        'Required parameter "id" was null or undefined when calling mediaPlayerPlaylistsIdGet().'
+      );
+    const i = {}, a = {};
+    let o = "/media-player/playlists/{id}";
+    o = o.replace("{id}", encodeURIComponent(String(t.id)));
+    const c = await this.request({
+      path: o,
+      method: "GET",
+      headers: a,
+      query: i
+    }, r);
+    return new se(c, (f) => ui(f));
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdGet(t, r) {
+    return await (await this.mediaPlayerPlaylistsIdGetRaw(t, r)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdRenamePostRaw(t, r) {
+    if (t.id == null)
+      throw new Re(
+        "id",
+        'Required parameter "id" was null or undefined when calling mediaPlayerPlaylistsIdRenamePost().'
+      );
+    const i = {}, a = {};
+    a["Content-Type"] = "application/json";
+    let o = "/media-player/playlists/{id}:rename";
+    o = o.replace("{id}", encodeURIComponent(String(t.id)));
+    const c = await this.request({
+      path: o,
+      method: "POST",
+      headers: a,
+      query: i,
+      body: bi(t.hydrangeanDivaMediaPlayerEndpointsPlaylistsRenamePlaylistRequest)
+    }, r);
+    return new se(c);
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdRenamePost(t, r) {
+    return await (await this.mediaPlayerPlaylistsIdRenamePostRaw(t, r)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdTracksGetRaw(t, r) {
+    if (t.id == null)
+      throw new Re(
+        "id",
+        'Required parameter "id" was null or undefined when calling mediaPlayerPlaylistsIdTracksGet().'
+      );
+    const i = {}, a = {};
+    let o = "/media-player/playlists/{id}/tracks";
+    o = o.replace("{id}", encodeURIComponent(String(t.id)));
+    const c = await this.request({
+      path: o,
+      method: "GET",
+      headers: a,
+      query: i
+    }, r);
+    return new se(c, (f) => mi(f));
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdTracksGet(t, r) {
+    return await (await this.mediaPlayerPlaylistsIdTracksGetRaw(t, r)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdTracksPutRaw(t, r) {
+    if (t.id == null)
+      throw new Re(
+        "id",
+        'Required parameter "id" was null or undefined when calling mediaPlayerPlaylistsIdTracksPut().'
+      );
+    const i = {}, a = {};
+    let o = "/media-player/playlists/{id}/tracks";
+    o = o.replace("{id}", encodeURIComponent(String(t.id)));
+    const c = await this.request({
+      path: o,
+      method: "PUT",
+      headers: a,
+      query: i
+    }, r);
+    return new se(c);
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsIdTracksPut(t, r) {
+    return await (await this.mediaPlayerPlaylistsIdTracksPutRaw(t, r)).value();
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsPostRaw(t, r) {
+    const i = {}, a = {};
+    a["Content-Type"] = "application/json";
+    const c = await this.request({
+      path: "/media-player/playlists",
+      method: "POST",
+      headers: a,
+      query: i,
+      body: gi(t.hydrangeanDivaMediaPlayerEndpointsPlaylistsCreatePlaylistRequest)
+    }, r);
+    return new se(c);
+  }
+  /**
+   */
+  async mediaPlayerPlaylistsPost(t = {}, r) {
+    return await (await this.mediaPlayerPlaylistsPostRaw(t, r)).value();
+  }
+}
+const Ei = new sr({
+  basePath: new URL("api", window.location.origin).toString()
+}), Ri = new Si(
+  Ei
+), Ti = ({
+  disabled: e,
+  onAddToPlaylist: t
+}) => {
+  const [r, i] = z(!1), [a, o] = z(
+    "loading"
+  );
+  return Vt(() => {
+    Ri.mediaPlayerPlaylistsGet().then(
+      (c) => o(
+        c.items.map((f) => ({
+          key: f.id,
+          label: f.name
+        }))
+      )
+    );
+  }, []), /* @__PURE__ */ s(
+    xe,
+    {
+      panelPaddingSize: "none",
+      button: /* @__PURE__ */ s(
+        Q,
+        {
+          iconType: Te,
+          onClick: () => i(!r),
+          disabled: e,
+          children: "Add to"
+        }
+      ),
+      isOpen: r,
+      closePopover: () => i(!1),
+      children: /* @__PURE__ */ s(
+        Lr,
+        {
+          searchable: !0,
+          searchProps: {
+            compressed: !0
+          },
+          options: a === "loading" ? void 0 : a,
+          isLoading: a === "loading",
+          onChange: async (c, f, p) => {
+            i(!1), await t(p);
+          },
+          singleSelection: !0,
+          children: (c, f) => /* @__PURE__ */ M("div", { style: { width: 240 }, children: [
+            /* @__PURE__ */ s(Vr, { paddingSize: "s", children: f }),
+            c,
+            /* @__PURE__ */ s(Ur, { paddingSize: "s", children: /* @__PURE__ */ s(Q, { size: "s", fullWidth: !0, iconType: Te, children: "New playlist" }) })
+          ] })
+        }
+      )
+    }
+  );
+}, Ci = ({
   onCancel: e,
   onSave: t
 }) => {
-  const n = zr({ prefix: "modalForm" }), [i, a] = W(""), [l, d] = W(""), [h, m] = W(!1);
-  return /* @__PURE__ */ $(Ur, { onClose: e, initialFocus: "[name=url]", children: [
-    /* @__PURE__ */ o(Lr, { children: /* @__PURE__ */ o(Br, { children: "Add video" }) }),
-    /* @__PURE__ */ o(Yr, { children: /* @__PURE__ */ $(
-      Vr,
+  const r = Yr({ prefix: "modalForm" }), [i, a] = z(""), [o, c] = z(""), [f, p] = z(!1);
+  return /* @__PURE__ */ M(Kr, { onClose: e, initialFocus: "[name=url]", children: [
+    /* @__PURE__ */ s(Hr, { children: /* @__PURE__ */ s(Wr, { children: "Add video" }) }),
+    /* @__PURE__ */ s(Jr, { children: /* @__PURE__ */ M(
+      Gr,
       {
-        id: n,
+        id: r,
         component: "form",
-        onSubmit: async (p) => {
-          p.preventDefault();
+        onSubmit: async (m) => {
+          m.preventDefault();
           try {
-            m(!0), await t({ url: i, title: l });
+            p(!0), await t({ url: i, title: o });
           } finally {
-            m(!1);
+            p(!1);
           }
         },
         children: [
-          /* @__PURE__ */ o(rt, { label: "URL", children: /* @__PURE__ */ o(
-            St,
+          /* @__PURE__ */ s(at, { label: "URL", children: /* @__PURE__ */ s(
+            xt,
             {
               name: "url",
               value: i,
-              onChange: (p) => a(p.target.value)
+              onChange: (m) => a(m.target.value)
             }
           ) }),
-          /* @__PURE__ */ o(rt, { label: "Title", children: /* @__PURE__ */ o(
-            St,
+          /* @__PURE__ */ s(at, { label: "Title", children: /* @__PURE__ */ s(
+            xt,
             {
               name: "title",
-              value: l,
-              onChange: (p) => d(p.target.value)
+              value: o,
+              onChange: (m) => c(m.target.value)
             }
           ) })
         ]
       }
     ) }),
-    /* @__PURE__ */ $(Wr, { children: [
-      /* @__PURE__ */ o(Bt, { onClick: e, children: "Cancel" }),
-      /* @__PURE__ */ o(
-        re,
+    /* @__PURE__ */ M(Qr, { children: [
+      /* @__PURE__ */ s(Yt, { onClick: e, children: "Cancel" }),
+      /* @__PURE__ */ s(
+        Q,
         {
           type: "submit",
-          form: n,
+          form: r,
           fill: !0,
           disabled: i.trim().length === 0,
-          isLoading: h,
+          isLoading: f,
           children: "Add video"
         }
       )
     ] })
   ] });
-}, $t = ne(
+}, qt = re(
   ({ onSave: e }) => {
-    const [t, n] = W(!1), i = N(
+    const [t, r] = z(!1), i = $(
       async (a) => {
-        await e(a), n(!1);
+        await e(a), r(!1);
       },
       [e]
     );
-    return /* @__PURE__ */ $(Le, { children: [
-      /* @__PURE__ */ o(
-        re,
+    return /* @__PURE__ */ M(Ye, { children: [
+      /* @__PURE__ */ s(
+        Q,
         {
-          onClick: () => n(!0),
-          iconType: ct,
+          onClick: () => r(!0),
+          iconType: Te,
           color: "primary",
           children: "Add video"
         }
       ),
-      t && /* @__PURE__ */ o(
-        Hn,
+      t && /* @__PURE__ */ s(
+        Ci,
         {
-          onCancel: () => n(!1),
+          onCancel: () => r(!1),
           onSave: i
         }
       )
     ] });
   }
-), rr = {
+), ur = {
   Audio: "",
   Dailymotion: "https://www.dailymotion.com/favicon.ico",
   Niconico: "https://www.nicovideo.jp/favicon.ico",
@@ -1217,11 +1691,11 @@ const Hn = ({
   Twitch: "https://www.twitch.tv/favicon.ico",
   Vimeo: "https://vimeo.com/favicon.ico",
   YouTube: "https://www.youtube.com/favicon.ico"
-}, Gn = P(
+}, Ii = C(
   ({ playQueueStore: e }) => {
-    const { euiTheme: t } = Lt();
-    return /* @__PURE__ */ $(
-      Hr,
+    const { euiTheme: t } = Wt();
+    return /* @__PURE__ */ M(
+      Xr,
       {
         style: {
           position: "sticky",
@@ -1230,50 +1704,50 @@ const Hn = ({
           background: t.colors.backgroundBasePlain
         },
         children: [
-          /* @__PURE__ */ o(qr, { children: /* @__PURE__ */ o(
-            Vt,
+          /* @__PURE__ */ s(Br, { children: /* @__PURE__ */ s(
+            Ht,
             {
               id: "",
               checked: e.allItemsSelected,
-              onChange: (n) => {
-                e.allItemsSelected = n.target.checked;
+              onChange: (r) => {
+                e.allItemsSelected = r.target.checked;
               }
             }
           ) }),
-          /* @__PURE__ */ o(Ze, { width: 24 }),
-          /* @__PURE__ */ o(Ze, { children: "Title" }),
-          /* @__PURE__ */ o(Ze, {})
+          /* @__PURE__ */ s(tt, { width: 24 }),
+          /* @__PURE__ */ s(tt, { children: "Title" }),
+          /* @__PURE__ */ s(tt, {})
         ]
       }
     );
   }
-), Jn = ne(
+), xi = re(
   ({
     item: e,
     closePopover: t
   }) => {
-    const n = De(
+    const r = Ve(
       () => [
         {
           id: 0,
           items: [
             {
               name: "Play first",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await e.playFirst();
               }
             },
             {
               name: "Play next",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await e.playNext();
               }
             },
             {
               name: "Add to play queue",
-              icon: /* @__PURE__ */ o(Y, { type: ct }),
+              icon: /* @__PURE__ */ s(Y, { type: Te }),
               onClick: async () => {
                 t(), await e.addToPlayQueue();
               }
@@ -1283,7 +1757,7 @@ const Hn = ({
             },
             {
               name: "Move to the top",
-              icon: /* @__PURE__ */ o(Y, { type: nn }),
+              icon: /* @__PURE__ */ s(Y, { type: cn }),
               onClick: async () => {
                 t(), e.moveToTop();
               },
@@ -1291,7 +1765,7 @@ const Hn = ({
             },
             {
               name: "Move to the bottom",
-              icon: /* @__PURE__ */ o(Y, { type: on }),
+              icon: /* @__PURE__ */ s(Y, { type: un }),
               onClick: async () => {
                 t(), e.moveToBottom();
               },
@@ -1302,7 +1776,7 @@ const Hn = ({
             },
             {
               name: "Remove to the top",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await e.removeToTop();
               },
@@ -1310,7 +1784,7 @@ const Hn = ({
             },
             {
               name: "Remove others",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await e.removeOthers();
               },
@@ -1321,20 +1795,20 @@ const Hn = ({
       ],
       [t, e]
     );
-    return /* @__PURE__ */ o(st, { initialPanelId: 0, panels: n });
+    return /* @__PURE__ */ s(ut, { initialPanelId: 0, panels: r });
   }
-), Kn = ne(
+), Oi = re(
   ({ item: e }) => {
-    const [t, n] = W(!1), i = N(() => n(!t), [t]), a = N(() => n(!1), []);
-    return /* @__PURE__ */ o(
-      ze,
+    const [t, r] = z(!1), i = $(() => r(!t), [t]), a = $(() => r(!1), []);
+    return /* @__PURE__ */ s(
+      xe,
       {
-        button: /* @__PURE__ */ o(
-          q,
+        button: /* @__PURE__ */ s(
+          W,
           {
             title: "More options",
             "aria-label": "More options",
-            iconType: Ut,
+            iconType: Qt,
             size: "s",
             color: "text",
             onClick: i
@@ -1344,8 +1818,8 @@ const Hn = ({
         closePopover: a,
         panelPaddingSize: "none",
         anchorPosition: "leftCenter",
-        children: /* @__PURE__ */ o(
-          Jn,
+        children: /* @__PURE__ */ s(
+          xi,
           {
             item: e,
             closePopover: a
@@ -1354,14 +1828,14 @@ const Hn = ({
       }
     );
   }
-), Xn = P(
+), _i = C(
   ({ item: e }) => {
-    const t = U();
-    return /* @__PURE__ */ $(nt, { textOnly: !1, hasActions: !0, align: "right", children: [
-      /* @__PURE__ */ o(
-        re,
+    const t = le();
+    return /* @__PURE__ */ M(st, { textOnly: !1, hasActions: !0, align: "right", children: [
+      /* @__PURE__ */ s(
+        Q,
         {
-          iconType: rn,
+          iconType: ln,
           size: "s",
           onClick: async () => {
             e.isCurrent ? await t.setCurrentTime(0) : e.play();
@@ -1369,41 +1843,41 @@ const Hn = ({
           children: "Play"
         }
       ),
-      /* @__PURE__ */ o(
-        re,
+      /* @__PURE__ */ s(
+        Q,
         {
-          iconType: ut,
+          iconType: ft,
           size: "s",
           onClick: e.remove,
           children: "Remove"
         }
       ),
-      /* @__PURE__ */ o(Kn, { item: e })
+      /* @__PURE__ */ s(Oi, { item: e })
     ] });
   }
-), Zn = P(
+), ki = C(
   ({ item: e }) => {
-    const t = U();
-    return /* @__PURE__ */ $(Kr, { isSelected: e.isCurrent, children: [
-      /* @__PURE__ */ o(Gr, { children: /* @__PURE__ */ o(
-        Vt,
+    const t = le();
+    return /* @__PURE__ */ M(tn, { isSelected: e.isCurrent, children: [
+      /* @__PURE__ */ s(Zr, { children: /* @__PURE__ */ s(
+        Ht,
         {
           id: e.id.toString(),
           checked: e.isSelected,
           onChange: e.toggleSelected
         }
       ) }),
-      /* @__PURE__ */ o(nt, { textOnly: !1, children: /* @__PURE__ */ o(
+      /* @__PURE__ */ s(st, { textOnly: !1, children: /* @__PURE__ */ s(
         "img",
         {
-          src: rr[e.type],
+          src: ur[e.type],
           width: 16,
           height: 16,
           alt: e.type
         }
       ) }),
-      /* @__PURE__ */ o(nt, { children: /* @__PURE__ */ o(
-        Jr,
+      /* @__PURE__ */ s(st, { children: /* @__PURE__ */ s(
+        en,
         {
           href: e.url,
           target: "_blank",
@@ -1412,51 +1886,51 @@ const Hn = ({
           children: e.title
         }
       ) }),
-      /* @__PURE__ */ o(Xn, { item: e })
+      /* @__PURE__ */ s(_i, { item: e })
     ] }, e.id);
   }
-), Qn = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    Tn,
+), Ai = C(
+  ({ playQueueStore: e }) => /* @__PURE__ */ s(
+    On,
     {
       tag: "tbody",
       list: e.items,
       setList: (t) => e.setItems(t),
-      children: e.items.map((t) => /* @__PURE__ */ o(Zn, { item: t }, t.id))
+      children: e.items.map((t) => /* @__PURE__ */ s(ki, { item: t }, t.id))
     }
   )
-), ei = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ $(Xr, { children: [
-    /* @__PURE__ */ o(Gn, { playQueueStore: e }),
-    /* @__PURE__ */ o(Qn, { playQueueStore: e })
+), Di = C(
+  ({ playQueueStore: e }) => /* @__PURE__ */ M(rn, { children: [
+    /* @__PURE__ */ s(Ii, { playQueueStore: e }),
+    /* @__PURE__ */ s(Ai, { playQueueStore: e })
   ] })
 );
-function ti(e) {
+function Mi(e) {
   return e !== null && typeof e == "object" && "title" in e && typeof e.title == "string";
 }
-const ri = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    re,
+const Fi = C(
+  ({ playQueueStore: e }) => /* @__PURE__ */ s(
+    Q,
     {
-      iconType: ct,
+      iconType: Te,
       onClick: e.addSelectedItems,
       disabled: e.isEmpty || e.selectedItems.length === 0,
       children: "Add to play queue"
     }
   )
 );
-P(
+C(
   ({ playQueueStore: e }) => {
-    const [t, n] = W(!1);
-    return /* @__PURE__ */ $(Le, { children: [
-      t && /* @__PURE__ */ o(
-        Qr,
+    const [t, r] = z(!1);
+    return /* @__PURE__ */ M(Ye, { children: [
+      t && /* @__PURE__ */ s(
+        an,
         {
           type: "push",
           size: "s",
-          onClose: () => n(!1),
-          children: /* @__PURE__ */ o("div", { style: { blockSize: "100%" }, children: /* @__PURE__ */ o(
-            Zr,
+          onClose: () => r(!1),
+          children: /* @__PURE__ */ s("div", { style: { blockSize: "100%" }, children: /* @__PURE__ */ s(
+            nn,
             {
               language: "json",
               overflowHeight: "100%",
@@ -1471,36 +1945,37 @@ P(
           ) })
         }
       ),
-      /* @__PURE__ */ o(
-        re,
+      /* @__PURE__ */ s(
+        Q,
         {
-          onClick: () => n((i) => !i),
-          iconType: an,
+          onClick: () => r((i) => !i),
+          iconType: dn,
           children: "Developer tools"
         }
       )
     ] });
   }
 );
-const ni = P(
+const Ni = C(
   ({ playQueueStore: e }) => {
-    const { euiTheme: t } = Lt(), n = N(
-      async (i) => {
-        const a = Fr(i.url);
-        if (a !== void 0) {
-          const l = a.extractVideoId(i.url);
-          if (l !== void 0) {
-            const h = await (await fetch(
+    const { euiTheme: t } = Wt(), r = $(async () => {
+    }, []), i = $(
+      async (a) => {
+        const o = Tn(a.url);
+        if (o !== void 0) {
+          const c = o.extractVideoId(a.url);
+          if (c !== void 0) {
+            const p = await (await fetch(
               `https://noembed.com/embed?url=${encodeURIComponent(
-                i.url
+                a.url
               )}`
             )).json();
             await e.addItems([
               e.createItem({
-                url: i.url,
-                type: a.type,
-                videoId: l,
-                title: i.title || (ti(h) ? h.title : l)
+                url: a.url,
+                type: o.type,
+                videoId: c,
+                title: a.title || (Mi(p) ? p.title : c)
               })
             ]);
           }
@@ -1508,9 +1983,9 @@ const ni = P(
       },
       [e]
     );
-    return /* @__PURE__ */ $(Le, { children: [
-      /* @__PURE__ */ $(
-        se,
+    return /* @__PURE__ */ M(Ye, { children: [
+      /* @__PURE__ */ M(
+        oe,
         {
           alignItems: "center",
           gutterSize: "m",
@@ -1521,43 +1996,50 @@ const ni = P(
             background: t.colors.backgroundBasePlain
           },
           children: [
-            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
-              re,
+            /* @__PURE__ */ s(J, { grow: !1, children: /* @__PURE__ */ s(
+              Q,
               {
                 disabled: e.isEmpty || e.selectedItems.length === 0,
                 onClick: e.playSelectedItemsNext,
                 children: "Play next"
               }
             ) }),
-            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(ri, { playQueueStore: e }) }),
-            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
-              re,
+            /* @__PURE__ */ s(J, { grow: !1, children: /* @__PURE__ */ s(Fi, { playQueueStore: e }) }),
+            /* @__PURE__ */ s(J, { grow: !1, children: /* @__PURE__ */ s(
+              Ti,
               {
-                iconType: ut,
+                disabled: !ri.mediaPlayer.enablePlaylists,
+                onAddToPlaylist: r
+              }
+            ) }),
+            /* @__PURE__ */ s(J, { grow: !1, children: /* @__PURE__ */ s(
+              Q,
+              {
+                iconType: ft,
                 onClick: e.removeSelectedItems,
                 disabled: e.isEmpty || e.selectedItems.length === 0,
                 children: "Remove"
               }
             ) }),
-            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
-              re,
+            /* @__PURE__ */ s(J, { grow: !1, children: /* @__PURE__ */ s(
+              Q,
               {
-                iconType: sn,
+                iconType: fn,
                 onClick: e.clear,
                 disabled: e.isEmpty,
                 children: "Clear"
               }
             ) }),
-            /* @__PURE__ */ o(J, { grow: !0 }),
-            /* @__PURE__ */ $(J, { grow: !1, children: [
+            /* @__PURE__ */ s(J, { grow: !0 }),
+            /* @__PURE__ */ M(J, { grow: !1, children: [
               !1,
-              /* @__PURE__ */ o($t, { onSave: n })
+              /* @__PURE__ */ s(qt, { onSave: i })
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ o(
-        Yt,
+      /* @__PURE__ */ s(
+        Gt,
         {
           size: "l",
           style: {
@@ -1568,30 +2050,30 @@ const ni = P(
           }
         }
       ),
-      e.isEmpty ? /* @__PURE__ */ o(
-        en,
+      e.isEmpty ? /* @__PURE__ */ s(
+        sn,
         {
-          title: /* @__PURE__ */ o("h2", { children: "We couldn't find any videos" }),
-          body: /* @__PURE__ */ o("p", { children: "Your video library doesn't contain any video content." }),
-          actions: /* @__PURE__ */ o($t, { onSave: n })
+          title: /* @__PURE__ */ s("h2", { children: "We couldn't find any videos" }),
+          body: /* @__PURE__ */ s("p", { children: "Your video library doesn't contain any video content." }),
+          actions: /* @__PURE__ */ s(qt, { onSave: i })
         }
-      ) : /* @__PURE__ */ o(ei, { playQueueStore: e })
+      ) : /* @__PURE__ */ s(Di, { playQueueStore: e })
     ] });
   }
-), tt = new En({
+), dr = Ut(void 0), fr = () => ct(dr), it = new _n({
   coerceTypes: !0
 });
-function ii(e, t) {
-  let n;
-  if (n = tt.getSchema(t), n === void 0 && (tt.addSchema(e, t), n = tt.getSchema(t)), n === void 0 || n.schema !== e)
+function $i(e, t) {
+  let r;
+  if (r = it.getSchema(t), r === void 0 && (it.addSchema(e, t), r = it.getSchema(t)), r === void 0 || r.schema !== e)
     throw new Error(
       `Invalid schema. Expected: '${JSON.stringify(
         e
-      )}', but got '${JSON.stringify(n?.schema)}'.`
+      )}', but got '${JSON.stringify(r?.schema)}'.`
     );
-  return n;
+  return r;
 }
-const oi = {
+const ji = {
   type: "object",
   properties: {
     url: {
@@ -1608,9 +2090,7 @@ const oi = {
     }
   },
   required: ["url", "type", "videoId", "title"]
-};
-var O = /* @__PURE__ */ ((e) => (e.Off = "Off", e.All = "All", e.One = "One", e))(O || {});
-const ai = {
+}, zi = {
   type: "object",
   properties: {
     version: {
@@ -1619,7 +2099,7 @@ const ai = {
     },
     repeat: {
       type: "string",
-      enum: Object.values(O),
+      enum: Object.values(N),
       nullable: !0
     },
     shuffle: {
@@ -1629,7 +2109,7 @@ const ai = {
     items: {
       type: "array",
       nullable: !0,
-      items: oi
+      items: ji
     },
     currentIndex: {
       type: "integer",
@@ -1637,38 +2117,38 @@ const ai = {
     }
   }
 };
-class $e {
-  constructor(t, n, i) {
-    this.observableStateProvider = t, this.playQueueStore = n, this.dto = i, this.id = $e.nextId++, t.makeObservable(this, {
-      isSelected: Z,
-      isCurrent: A,
-      index: A,
-      isFirst: A,
-      isLast: A,
-      canMoveToTop: A,
-      canMoveToBottom: A,
-      canRemoveToTop: A,
-      canRemoveOthers: A,
-      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
+class Le {
+  constructor(t, r, i) {
+    this.observableStateProvider = t, this.playQueueStore = r, this.dto = i, this.id = Le.nextId++, t.makeObservable(this, {
+      isSelected: X,
+      isCurrent: _,
+      index: _,
+      isFirst: _,
+      isLast: _,
+      canMoveToTop: _,
+      canMoveToBottom: _,
+      canRemoveToTop: _,
+      canRemoveOthers: _,
+      unselect: v,
+      toggleSelected: v.bound,
+      play: v,
+      remove: v.bound,
+      playFirst: v.bound,
+      playNext: v.bound,
+      addToPlayQueue: v.bound,
+      moveToTop: v.bound,
+      moveToBottom: v.bound,
+      removeToTop: v.bound,
+      removeOthers: v.bound
     });
   }
   static nextId = 1;
   id;
   isSelected = !1;
-  static fromDto(t, n, i) {
-    return new $e(
+  static fromDto(t, r, i) {
+    return new Le(
       t,
-      n,
+      r,
       i
     );
   }
@@ -1748,62 +2228,63 @@ class $e {
     return this.playQueueStore.removeOtherItems(this);
   }
 }
-class si {
+class qi {
   constructor(t) {
     this.observableStateProvider = t, t.makeObservable(this, {
-      interacted: Z,
-      items: Z,
-      currentId: Z,
-      repeat: Z,
-      shuffle: Z,
-      localStorageState: A.struct,
-      isEmpty: A,
-      currentItem: A,
-      canPlay: A,
-      canPause: A,
-      hasMultipleItems: A,
-      currentIndex: A,
-      hasPreviousItem: A,
-      hasNextItem: A,
-      isLastItem: A,
-      selectedItems: A,
-      allItemsSelected: A,
-      selectedItemsOrAllItems: A,
-      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
+      interacted: X,
+      items: X,
+      currentId: X,
+      repeat: X,
+      shuffle: X,
+      localStorageState: _.struct,
+      isEmpty: _,
+      currentItem: _,
+      canPlay: _,
+      canPause: _,
+      hasMultipleItems: _,
+      currentIndex: _,
+      hasPreviousItem: _,
+      hasNextItem: _,
+      isLastItem: _,
+      selectedItems: _,
+      allItemsSelected: _,
+      selectedItemsOrAllItems: _,
+      setItems: v,
+      interact: v,
+      clear: v.bound,
+      unselectAll: v,
+      setCurrentItem: v,
+      setNextItems: v,
+      clearAndSetItems: v,
+      playNext: v,
+      playSelectedItemsNext: v.bound,
+      addItems: v,
+      addSelectedItems: v.bound,
+      playFirst: v,
+      moveItem: v,
+      goToFirst: v,
+      removeItems: v,
+      removeSelectedItems: v.bound,
+      removeOtherItems: v,
+      removeItemsAbove: v,
+      toggleRepeat: v.bound,
+      toggleShuffle: v.bound,
+      previous: v,
+      next: v.bound
     });
   }
   interacted = !1;
   items = [];
   currentId;
-  repeat = O.Off;
+  repeat = N.Off;
   shuffle = !1;
   createItem(t) {
-    return $e.fromDto(
-      this.observableStateProvider,
-      this,
-      t
-    );
+    return Le.fromDto(this.observableStateProvider, this, {
+      url: t.url,
+      type: t.type,
+      videoId: t.videoId,
+      title: t.title
+    });
   }
   get localStorageState() {
     return {
@@ -1815,11 +2296,11 @@ class si {
     };
   }
   set localStorageState(t) {
-    this.repeat = t.repeat ?? O.Off, this.shuffle = t.shuffle ?? !1, this.items = t.items?.map((n) => this.createItem(n)) ?? [], this.currentIndex = t.currentIndex;
+    this.repeat = t.repeat ?? N.Off, this.shuffle = t.shuffle ?? !1, this.items = t.items?.map((r) => this.createItem(r)) ?? [], this.currentIndex = t.currentIndex;
   }
   validateLocalStorageState(t) {
-    return ii(
-      ai,
+    return $i(
+      zi,
       "PlayQueueDto"
     )(t);
   }
@@ -1860,8 +2341,8 @@ class si {
     return this.selectedItems.length === this.items.length;
   }
   set allItemsSelected(t) {
-    for (const n of this.items)
-      n.isSelected = t;
+    for (const r of this.items)
+      r.isSelected = t;
   }
   get selectedItemsOrAllItems() {
     return this.selectedItems.length > 0 ? this.selectedItems : this.items;
@@ -1917,47 +2398,50 @@ class si {
       this.clearAndSetItems(t);
       return;
     }
-    const { currentIndex: n } = this;
-    n !== void 0 && (this.interact(), this.items.splice(n, 0, ...t), this.currentIndex = n);
+    const { currentIndex: r } = this;
+    r !== void 0 && (this.interact(), this.items.splice(r, 0, ...t), this.currentIndex = r);
   }
-  moveItem(t, n) {
+  moveItem(t, r) {
     const i = this.items.splice(this.items.indexOf(t), 1)[0];
-    this.items.splice(n, 0, i);
+    this.items.splice(r, 0, i);
+  }
+  async goToFirst() {
+    this.currentIndex !== void 0 && (this.currentIndex = 0);
   }
   async removeItems(t) {
-    const { currentItem: n } = this;
-    Pt(this.items, ...t.filter((l) => l !== n));
+    const { currentItem: r } = this;
+    Ot(this.items, ...t.filter((o) => o !== r));
     const { currentIndex: i, isLastItem: a } = this;
-    Pt(
+    Ot(
       this.items,
-      t.find((l) => l === n)
-    ), this.currentItem !== n && (this.interact(), a ? await this.goToFirst() : this.currentIndex = i);
+      t.find((o) => o === r)
+    ), this.currentItem !== r && (this.interact(), a ? await this.goToFirst() : this.currentIndex = i);
   }
   async removeSelectedItems() {
     await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
   }
   async removeOtherItems(t) {
-    const n = t.id;
+    const r = t.id;
     return this.removeItems(
-      this.items.filter((i) => i.id !== n)
+      this.items.filter((i) => i.id !== r)
     );
   }
   async removeItemsAbove(t) {
-    const n = this.items.indexOf(t);
+    const r = this.items.indexOf(t);
     return this.removeItems(
-      this.items.filter((i, a) => a < n)
+      this.items.filter((i, a) => a < r)
     );
   }
   toggleRepeat() {
     switch (this.repeat) {
-      case O.Off:
-        this.repeat = O.All;
+      case N.Off:
+        this.repeat = N.All;
         break;
-      case O.All:
-        this.repeat = O.One;
+      case N.All:
+        this.repeat = N.One;
         break;
-      case O.One:
-        this.repeat = O.Off;
+      case N.One:
+        this.repeat = N.Off;
         break;
     }
   }
@@ -1970,266 +2454,207 @@ class si {
   async next() {
     this.currentIndex !== void 0 && this.hasNextItem && (this.interact(), this.currentIndex++);
   }
-  async goToFirst() {
-    this.currentIndex !== void 0 && (this.currentIndex = 0);
-  }
 }
-const nr = zt(void 0), Wi = ({
+const Ea = ({
   children: e
 }) => {
-  const [t] = W(
-    () => new si(new Kt())
-  ), n = U();
-  return kr(() => Or(
+  const [t] = z(
+    () => new qi(new er())
+  ), r = le();
+  return Vt(() => $r(
     () => t.currentItem,
     async (i, a) => {
-      i === void 0 || a === void 0 || i.type === a.type && i.videoId === a.videoId && await n.setCurrentTime(0);
+      i === void 0 || a === void 0 || i.type === a.type && i.videoId === a.videoId && await r.setCurrentTime(0);
     }
-  ), [t, n]), /* @__PURE__ */ o(nr.Provider, { value: t, children: e });
-}, ir = () => at(nr), li = ({
+  ), [t, r]), /* @__PURE__ */ s(dr.Provider, { value: t, children: e });
+}, Li = ({
   breadcrumbs: e,
   tabs: t,
-  ...n
+  ...r
 }) => {
-  const i = Cn();
-  return /* @__PURE__ */ o(
-    lt.Header,
+  const i = kn();
+  return /* @__PURE__ */ s(
+    dt.Header,
     {
-      ...n,
-      breadcrumbs: e?.map(({ linkProps: a, ...l }) => ({
-        ...l,
+      ...r,
+      breadcrumbs: e?.map(({ linkProps: a, ...o }) => ({
+        ...o,
         href: a === void 0 ? void 0 : i.buildLocation(
           a
           /* FIXME */
         ).href,
-        onClick: a === void 0 ? void 0 : async (d) => {
-          d.preventDefault(), await i.navigate(a);
+        onClick: a === void 0 ? void 0 : async (c) => {
+          c.preventDefault(), await i.navigate(a);
         }
       })),
-      tabs: t?.map(({ linkProps: a, ...l }) => ({
-        ...l,
+      tabs: t?.map(({ linkProps: a, ...o }) => ({
+        ...o,
         href: a === void 0 ? void 0 : i.buildLocation(
           a
           /* FIXME */
         ).href,
-        onClick: a === void 0 ? void 0 : async (d) => {
-          d.preventDefault(), await i.navigate(a);
+        onClick: a === void 0 ? void 0 : async (c) => {
+          c.preventDefault(), await i.navigate(a);
         }
       }))
     }
   );
-}, Ui = () => {
-  const e = ir();
-  return /* @__PURE__ */ $(Le, { children: [
-    /* @__PURE__ */ o(
-      li,
+}, Ra = () => {
+  const e = fr();
+  return /* @__PURE__ */ M(Ye, { children: [
+    /* @__PURE__ */ s(
+      Li,
       {
         pageTitle: "Play queue",
         rightSideItems: []
       }
     ),
-    /* @__PURE__ */ o(lt.Section, { children: /* @__PURE__ */ o(ni, { playQueueStore: e }) })
+    /* @__PURE__ */ s(dt.Section, { children: /* @__PURE__ */ s(Ni, { playQueueStore: e }) })
   ] });
-}, ci = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    q,
+}, Vi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
     {
       title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
       "aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
-      iconType: e.shuffle ? ln : cn,
+      iconType: e.shuffle ? pn : yn,
       size: "s",
       iconSize: "l",
       onClick: e.toggleShuffle,
-      disabled: !0
+      disabled: !e.canToggleShuffle
     }
   )
-), ui = P(
-  ({ playQueueStore: e }) => {
-    const t = U(), n = N(async () => {
-      if (e.hasPreviousItem) {
-        const i = await t.getCurrentTime();
-        i === void 0 || i < 5 ? await e.previous() : await t.setCurrentTime(0);
-      } else
-        await t.setCurrentTime(0);
-    }, [e, t]);
-    return /* @__PURE__ */ o(
-      q,
-      {
-        title: "Previous",
-        "aria-label": "Previous",
-        iconType: un,
-        size: "s",
-        iconSize: "l",
-        onClick: n,
-        disabled: e.isEmpty
-      }
-    );
-  }
-), di = P(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const n = U(), i = N(async () => {
-      const a = await n.getCurrentTime();
-      a !== void 0 && await n.setCurrentTime(a - 10);
-    }, [n]);
-    return /* @__PURE__ */ o(
-      q,
-      {
-        title: "Skip back 10 seconds",
-        "aria-label": "Skip back 10 seconds",
-        iconType: qt,
-        size: "s",
-        iconSize: "l",
-        onClick: i,
-        disabled: t.isEmpty || !e.controller.supports("setCurrentTime")
-      }
-    );
-  }
-), fi = P(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const n = U();
-    return /* @__PURE__ */ o(
-      q,
-      {
-        title: "Pause",
-        "aria-label": "Pause",
-        iconType: dn,
-        size: "s",
-        iconSize: "l",
-        onClick: () => n.pause(),
-        disabled: !t.canPause || !e.controller.supports("pause")
-      }
-    );
-  }
-), mi = P(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const n = U();
-    return /* @__PURE__ */ o(
-      q,
-      {
-        title: "Play",
-        "aria-label": "Play",
-        iconType: fn,
-        size: "s",
-        iconSize: "l",
-        onClick: () => n.play(),
-        disabled: !t.canPlay || !e.controller.supports("play")
-      }
-    );
-  }
-), hi = P(
-  ({
-    playerStore: e,
-    playQueueStore: t
-  }) => {
-    const n = U(), i = N(async () => {
-      const a = await n.getCurrentTime();
-      a !== void 0 && await n.setCurrentTime(a + 30);
-    }, [n]);
-    return /* @__PURE__ */ o(
-      q,
-      {
-        title: "Skip forward 30 seconds",
-        "aria-label": "Skip forward 30 seconds",
-        iconType: Ht,
-        size: "s",
-        iconSize: "l",
-        onClick: i,
-        disabled: t.isEmpty || !e.controller.supports("setCurrentTime")
-      }
-    );
-  }
-), vi = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    q,
+), Ui = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
+    {
+      title: "Previous",
+      "aria-label": "Previous",
+      iconType: hn,
+      size: "s",
+      iconSize: "l",
+      onClick: e.previous,
+      disabled: !e.canPrevious
+    }
+  )
+), Yi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
+    {
+      title: "Skip back 10 seconds",
+      "aria-label": "Skip back 10 seconds",
+      iconType: Kt,
+      size: "s",
+      iconSize: "l",
+      onClick: e.skipBack10,
+      disabled: !e.canSkipBack10
+    }
+  )
+), Wi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
+    {
+      title: "Pause",
+      "aria-label": "Pause",
+      iconType: mn,
+      size: "s",
+      iconSize: "l",
+      onClick: e.pause,
+      disabled: !e.canPause
+    }
+  )
+), Hi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
+    {
+      title: "Play",
+      "aria-label": "Play",
+      iconType: vn,
+      size: "s",
+      iconSize: "l",
+      onClick: e.play,
+      disabled: !e.canPlay
+    }
+  )
+), Gi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
+    {
+      title: "Skip forward 30 seconds",
+      "aria-label": "Skip forward 30 seconds",
+      iconType: Bt,
+      size: "s",
+      iconSize: "l",
+      onClick: e.skipForward30,
+      disabled: !e.canSkipForward30
+    }
+  )
+), Ji = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
     {
       title: "Next",
       "aria-label": "Next",
-      iconType: mn,
+      iconType: gn,
       size: "s",
       iconSize: "l",
       onClick: e.next,
-      disabled: !e.hasNextItem
+      disabled: !e.canNext
     }
   )
-), pi = {
-  [O.Off]: pn,
-  [O.All]: vn,
-  [O.One]: hn
-}, yi = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    q,
+), Qi = {
+  [N.Off]: wn,
+  [N.All]: bn,
+  [N.One]: Pn
+}, Ki = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
     {
-      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: pi[e.repeat],
+      title: `Repeat: ${e.repeat === N.All ? "All" : e.repeat === N.One ? "One" : "Off"}`,
+      "aria-label": `Repeat: ${e.repeat === N.All ? "All" : e.repeat === N.One ? "One" : "Off"}`,
+      iconType: Qi[e.repeat],
       size: "s",
       iconSize: "l",
-      onClick: e.toggleRepeat
+      onClick: e.toggleRepeat,
+      disabled: !e.canToggleRepeat
     }
   )
-), gi = P(
-  ({
-    playerStore: e,
-    playQueueStore: t
-  }) => /* @__PURE__ */ $(
-    se,
+), Bi = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ M(
+    oe,
     {
       responsive: !1,
       gutterSize: "s",
       justifyContent: "center",
       alignItems: "center",
       children: [
-        /* @__PURE__ */ o(ci, { playQueueStore: t }),
-        /* @__PURE__ */ o(ui, { playQueueStore: t }),
-        /* @__PURE__ */ o(
-          di,
-          {
-            playerStore: e,
-            playQueueStore: t
-          }
-        ),
-        e.playing ? /* @__PURE__ */ o(
-          fi,
-          {
-            playerStore: e,
-            playQueueStore: t
-          }
-        ) : /* @__PURE__ */ o(
-          mi,
-          {
-            playerStore: e,
-            playQueueStore: t
-          }
-        ),
-        /* @__PURE__ */ o(
-          hi,
-          {
-            playerStore: e,
-            playQueueStore: t
-          }
-        ),
-        /* @__PURE__ */ o(vi, { playQueueStore: t }),
-        /* @__PURE__ */ o(yi, { playQueueStore: t })
+        /* @__PURE__ */ s(Vi, { bottomBarStore: e }),
+        /* @__PURE__ */ s(Ui, { bottomBarStore: e }),
+        /* @__PURE__ */ s(Yi, { bottomBarStore: e }),
+        e.playing ? /* @__PURE__ */ s(Wi, { bottomBarStore: e }) : /* @__PURE__ */ s(Hi, { bottomBarStore: e }),
+        /* @__PURE__ */ s(Gi, { bottomBarStore: e }),
+        /* @__PURE__ */ s(Ji, { bottomBarStore: e }),
+        /* @__PURE__ */ s(Ki, { bottomBarStore: e })
       ]
     }
   )
-), bi = ne(
+), Xi = re(
   ({ item: e, closePopover: t }) => {
-    const n = U(), i = De(
+    const r = le(), i = Ve(
       () => [
         {
           id: 0,
           items: [
             {
               name: "Open in new tab",
-              icon: /* @__PURE__ */ o(Y, { type: yn }),
+              icon: /* @__PURE__ */ s(Y, { type: Sn }),
               onClick: async () => {
-                t(), await n.pause(), window.open(e.dto.url, "_blank");
+                t(), await r.pause(), window.open(e.dto.url, "_blank");
               }
             },
             {
               name: "Copy link address",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await navigator.clipboard.writeText(
                   e.dto.url
@@ -2238,7 +2663,7 @@ const nr = zt(void 0), Wi = ({
             },
             {
               name: "Copy link text",
-              icon: /* @__PURE__ */ o(Y, { type: "" }),
+              icon: /* @__PURE__ */ s(Y, { type: "" }),
               onClick: async () => {
                 t(), await navigator.clipboard.writeText(
                   e.dto.title
@@ -2248,20 +2673,20 @@ const nr = zt(void 0), Wi = ({
           ]
         }
       ],
-      [t, n, e]
+      [t, r, e]
     );
-    return /* @__PURE__ */ o(st, { initialPanelId: 0, panels: i });
+    return /* @__PURE__ */ s(ut, { initialPanelId: 0, panels: i });
   }
-), Ti = ne(
+), Zi = re(
   ({ item: e }) => {
-    const [t, n] = W(!1), i = N(() => n(!t), [t]), a = N(() => n(!1), []);
-    return /* @__PURE__ */ o(
-      ze,
+    const [t, r] = z(!1), i = $(() => r(!t), [t]), a = $(() => r(!1), []);
+    return /* @__PURE__ */ s(
+      xe,
       {
-        button: /* @__PURE__ */ o(
-          Bt,
+        button: /* @__PURE__ */ s(
+          Yt,
           {
-            iconType: rr[e.type],
+            iconType: ur[e.type],
             size: "s",
             onClick: i,
             children: e.title
@@ -2271,8 +2696,8 @@ const nr = zt(void 0), Wi = ({
         closePopover: a,
         panelPaddingSize: "none",
         anchorPosition: "upLeft",
-        children: /* @__PURE__ */ o(
-          bi,
+        children: /* @__PURE__ */ s(
+          Xi,
           {
             item: e,
             closePopover: a
@@ -2281,74 +2706,76 @@ const nr = zt(void 0), Wi = ({
       }
     );
   }
-), Ei = P(
-  ({ playQueueStore: e }) => /* @__PURE__ */ o(
-    se,
+), ea = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    oe,
     {
       responsive: !1,
       gutterSize: "s",
       justifyContent: "flexStart",
       alignItems: "center",
-      children: e.currentItem && /* @__PURE__ */ o(Ti, { item: e.currentItem })
+      children: e.currentItem && /* @__PURE__ */ s(Zi, { item: e.currentItem })
     }
   )
-), Ci = P(
-  ({ playerStore: e }) => /* @__PURE__ */ o(
-    q,
+), ta = C(
+  ({ bottomBarStore: e }) => /* @__PURE__ */ s(
+    W,
     {
       title: "Mute",
       "aria-label": "Mute",
-      iconType: Gt,
+      iconType: Xt,
       size: "s",
       iconSize: "l",
-      disabled: !e.controller.supports("setMuted")
+      disabled: !e.playerStore.controller.supports("setMuted")
     }
   )
-), xi = P(
+), ra = C(
   ({
-    playerStore: e,
+    bottomBarStore: e,
     button: t,
-    isOpen: n,
+    isOpen: r,
     closePopover: i
   }) => {
-    const [a, l] = W("0"), d = U();
-    Ar(() => {
-      n && d.getVolume().then((m) => {
-        m !== void 0 && l(Math.floor(m * 100).toString());
+    const [a, o] = z("0"), c = le();
+    zr(() => {
+      r && c.getVolume().then((p) => {
+        p !== void 0 && o(Math.floor(p * 100).toString());
       });
-    }, [n, d]);
-    const h = N(
-      async (m) => {
-        l(m.currentTarget.value), await d.setVolume(Number(m.currentTarget.value) / 100);
+    }, [r, c]);
+    const f = $(
+      async (p) => {
+        o(p.currentTarget.value), await c.setVolume(Number(p.currentTarget.value) / 100);
       },
-      [d]
+      [c]
     );
-    return /* @__PURE__ */ o(
-      ze,
+    return /* @__PURE__ */ s(
+      xe,
       {
         button: t,
-        isOpen: n,
+        isOpen: r,
         closePopover: i,
         anchorPosition: "upRight",
-        children: /* @__PURE__ */ o(rt, { children: /* @__PURE__ */ $(
-          se,
+        children: /* @__PURE__ */ s(at, { children: /* @__PURE__ */ M(
+          oe,
           {
             responsive: !1,
             gutterSize: "s",
             justifyContent: "center",
             alignItems: "center",
             children: [
-              /* @__PURE__ */ o(Ci, { playerStore: e }),
-              /* @__PURE__ */ o(
-                Wt,
+              /* @__PURE__ */ s(ta, { bottomBarStore: e }),
+              /* @__PURE__ */ s(
+                Jt,
                 {
                   min: 0,
                   max: 100,
                   step: 1,
                   value: a,
-                  onChange: h,
+                  onChange: f,
                   css: { blockSize: 32 },
-                  disabled: !e.controller.supports("setVolume")
+                  disabled: !e.playerStore.controller.supports(
+                    "setVolume"
+                  )
                 }
               )
             ]
@@ -2357,103 +2784,98 @@ const nr = zt(void 0), Wi = ({
       }
     );
   }
-), Ii = P(
-  ({ playerStore: e }) => {
-    const [t, n] = W(!1);
-    return /* @__PURE__ */ o(
-      xi,
+), na = C(
+  ({ bottomBarStore: e }) => {
+    const [t, r] = z(!1);
+    return /* @__PURE__ */ s(
+      ra,
       {
-        playerStore: e,
-        button: /* @__PURE__ */ o(
-          q,
+        bottomBarStore: e,
+        button: /* @__PURE__ */ s(
+          W,
           {
             title: "Volume",
             "aria-label": "Volume",
-            iconType: Gt,
+            iconType: Xt,
             size: "s",
             iconSize: "l",
-            onClick: () => n(!t),
-            disabled: !e.controller.supports("getVolume")
+            onClick: () => r(!t),
+            disabled: !e.playerStore.controller.supports(
+              "getVolume"
+            )
           }
         ),
         isOpen: t,
-        closePopover: () => n(!1)
+        closePopover: () => r(!1)
       }
     );
   }
-), Si = ({
+), ia = ({
   onClickPlayQueueButton: e
-}) => /* @__PURE__ */ o(
-  q,
+}) => /* @__PURE__ */ s(
+  W,
   {
     title: "Play queue",
     "aria-label": "Play queue",
-    iconType: bn,
+    iconType: Rn,
     size: "s",
     iconSize: "l",
     onClick: e
   }
-), Pi = P(
+), aa = C(
   ({
-    playerStore: e,
-    playQueueStore: t,
-    closePopover: n
+    bottomBarStore: e,
+    closePopover: t
   }) => {
-    const i = U(), a = N(async () => {
-      const I = await i.getCurrentTime();
-      I !== void 0 && await i.setCurrentTime(I - 10), n();
-    }, [i, n]), l = N(async () => {
-      const I = await i.getCurrentTime();
-      I !== void 0 && await i.setCurrentTime(I + 30), n();
-    }, [i, n]), d = N(
-      async (I) => {
-        await i.setPlaybackRate(I), n();
+    const r = le(), i = $(async () => {
+      await e.skipBack10(), t();
+    }, [e, t]), a = $(async () => {
+      await e.skipForward30(), t();
+    }, [e, t]), o = $(
+      async (w) => {
+        await r.setPlaybackRate(w), t();
       },
-      [i, n]
-    ), h = N(async () => {
-      t.currentItem !== void 0 && await t.removeItems([
-        t.currentItem
-      ]), n();
-    }, [t, n]), [m, p] = W(), T = N(async () => {
-      await e.controller.getPlaybackRate().then((I) => p(I));
-    }, [e]), w = De(
+      [r, t]
+    ), c = $(async () => {
+      e.currentItem !== void 0 && await e.playQueueStore.removeItems([
+        e.currentItem
+      ]), t();
+    }, [e, t]), [f, p] = z(), m = $(async () => {
+      await e.playerStore.controller.getPlaybackRate().then((w) => p(w));
+    }, [e]), P = Ve(
       () => [
         {
           id: 0,
           items: [
             {
               name: "Speed",
-              icon: /* @__PURE__ */ o(Y, { type: gn }),
+              icon: /* @__PURE__ */ s(Y, { type: En }),
               panel: 1,
-              onClick: T,
-              disabled: !e.controller.supports(
+              onClick: m,
+              disabled: !e.playerStore.controller.supports(
                 "getPlaybackRate"
               )
             },
             {
               name: "Skip back 10 seconds",
-              icon: /* @__PURE__ */ o(Y, { type: qt }),
-              onClick: a,
-              disabled: t.isEmpty || !e.controller.supports(
-                "setCurrentTime"
-              )
+              icon: /* @__PURE__ */ s(Y, { type: Kt }),
+              onClick: i,
+              disabled: !e.canSkipBack10
             },
             {
               name: "Skip forward 30 seconds",
-              icon: /* @__PURE__ */ o(Y, { type: Ht }),
-              onClick: l,
-              disabled: t.isEmpty || !e.controller.supports(
-                "setCurrentTime"
-              )
+              icon: /* @__PURE__ */ s(Y, { type: Bt }),
+              onClick: a,
+              disabled: !e.canSkipForward30
             },
             {
               isSeparator: !0
             },
             {
               name: "Remove from play queue",
-              icon: /* @__PURE__ */ o(Y, { type: ut }),
-              onClick: h,
-              disabled: t.isEmpty
+              icon: /* @__PURE__ */ s(Y, { type: ft }),
+              onClick: c,
+              disabled: e.playQueueStore.isEmpty
             }
           ]
         },
@@ -2461,11 +2883,11 @@ const nr = zt(void 0), Wi = ({
           id: 1,
           title: "Speed",
           items: [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2].map(
-            (I) => ({
-              name: I.toString(),
-              onClick: () => d(I),
-              icon: I === m ? "check" : "empty",
-              disabled: !e.controller.supports(
+            (w) => ({
+              name: w.toString(),
+              onClick: () => o(w),
+              icon: w === f ? "check" : "empty",
+              disabled: !e.playerStore.controller.supports(
                 "setPlaybackRate"
               )
             })
@@ -2474,252 +2896,205 @@ const nr = zt(void 0), Wi = ({
       ],
       [
         e,
-        t,
-        T,
+        m,
+        i,
         a,
-        l,
-        h,
-        d,
-        m
+        c,
+        o,
+        f
       ]
     );
-    return /* @__PURE__ */ o(st, { initialPanelId: 0, panels: w });
+    return /* @__PURE__ */ s(ut, { initialPanelId: 0, panels: P });
   }
-), wi = ne(
+), sa = re(
   ({
-    playerStore: e,
-    playQueueStore: t,
-    button: n,
-    isOpen: i,
-    closePopover: a
-  }) => /* @__PURE__ */ o(
-    ze,
+    bottomBarStore: e,
+    button: t,
+    isOpen: r,
+    closePopover: i
+  }) => /* @__PURE__ */ s(
+    xe,
     {
-      button: n,
-      isOpen: i,
-      closePopover: a,
+      button: t,
+      isOpen: r,
+      closePopover: i,
       panelPaddingSize: "none",
       anchorPosition: "upRight",
-      children: /* @__PURE__ */ o(
-        Pi,
+      children: /* @__PURE__ */ s(
+        aa,
         {
-          playerStore: e,
-          playQueueStore: t,
-          closePopover: a
+          bottomBarStore: e,
+          closePopover: i
         }
       )
     }
   )
-), Ri = ne(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const [n, i] = W(!1);
-    return /* @__PURE__ */ o(
-      wi,
+), oa = re(
+  ({ bottomBarStore: e }) => {
+    const [t, r] = z(!1);
+    return /* @__PURE__ */ s(
+      sa,
       {
-        playerStore: e,
-        playQueueStore: t,
-        button: /* @__PURE__ */ o(
-          q,
+        bottomBarStore: e,
+        button: /* @__PURE__ */ s(
+          W,
           {
             title: "More options",
             "aria-label": "More options",
-            iconType: Ut,
+            iconType: Qt,
             size: "s",
             iconSize: "l",
-            onClick: () => i(!n)
+            onClick: () => r(!t)
           }
         ),
-        isOpen: n,
-        closePopover: () => i(!1)
+        isOpen: t,
+        closePopover: () => r(!1)
       }
     );
   }
-), Oi = ne(
+), la = re(
   ({
-    playerStore: e,
-    playQueueStore: t,
-    onClickPlayQueueButton: n
-  }) => /* @__PURE__ */ $(
-    se,
+    bottomBarStore: e,
+    onClickPlayQueueButton: t
+  }) => /* @__PURE__ */ M(
+    oe,
     {
       responsive: !1,
       gutterSize: "s",
       justifyContent: "flexEnd",
       alignItems: "center",
       children: [
-        /* @__PURE__ */ o(Ii, { playerStore: e }),
-        n && /* @__PURE__ */ o(
-          Si,
+        /* @__PURE__ */ s(na, { bottomBarStore: e }),
+        t && /* @__PURE__ */ s(
+          ia,
           {
-            onClickPlayQueueButton: n
+            onClickPlayQueueButton: t
           }
         ),
-        /* @__PURE__ */ o(
-          Ri,
-          {
-            playerStore: e,
-            playQueueStore: t
-          }
-        )
+        /* @__PURE__ */ s(oa, { bottomBarStore: e })
       ]
     }
   )
-), _i = P(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const n = U(), i = N(
-      (d) => {
-        const h = Number(d.currentTarget.value) / 100;
-        e.setPercent(h);
+), ca = C(
+  ({ bottomBarStore: e }) => {
+    const t = le(), r = $(
+      (o) => {
+        const c = Number(o.currentTarget.value) / 100;
+        e.playerStore.setPercent(c);
       },
       [e]
-    ), a = N(
-      (d) => {
-        d.button === 0 && e.setSeeking(!0);
+    ), i = $(
+      (o) => {
+        o.button === 0 && e.playerStore.setSeeking(!0);
       },
       [e]
-    ), l = N(
-      async (d) => {
-        if (d.button === 0) {
-          const h = Number(d.currentTarget.value) / 100;
-          e.setSeeking(!1);
-          const m = await n.getDuration();
-          m !== void 0 && await n.setCurrentTime(m * h);
+    ), a = $(
+      async (o) => {
+        if (o.button === 0) {
+          const c = Number(o.currentTarget.value) / 100;
+          e.playerStore.setSeeking(!1);
+          const f = await t.getDuration();
+          f !== void 0 && await t.setCurrentTime(f * c);
         }
       },
-      [e, n]
+      [e, t]
     );
-    return /* @__PURE__ */ o(
-      Wt,
+    return /* @__PURE__ */ s(
+      Jt,
       {
         min: 0,
         max: 100,
         step: 1e-7,
-        value: e.percent * 100,
-        onChange: i,
-        onMouseDown: a,
-        onMouseUp: l,
+        value: e.playerStore.percent * 100,
+        onChange: r,
+        onMouseDown: i,
+        onMouseUp: a,
         fullWidth: !0,
         showRange: !0,
         css: { blockSize: 32 },
-        disabled: t.isEmpty
+        disabled: e.playQueueStore.isEmpty
       }
     );
   }
-), qi = P(
+), Ta = C(
   ({
-    playerStore: e,
-    playQueueStore: t,
-    onClickPlayQueueButton: n
-  }) => /* @__PURE__ */ o(tn, { paddingSize: "s", children: /* @__PURE__ */ $(se, { direction: "column", gutterSize: "none", children: [
-    /* @__PURE__ */ o(J, { children: /* @__PURE__ */ o(
-      _i,
-      {
-        playerStore: e,
-        playQueueStore: t
-      }
-    ) }),
-    /* @__PURE__ */ o(J, { children: /* @__PURE__ */ $(se, { responsive: !1, children: [
-      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
-        Ei,
+    bottomBarStore: e,
+    onClickPlayQueueButton: t
+  }) => /* @__PURE__ */ s(on, { paddingSize: "s", children: /* @__PURE__ */ M(oe, { direction: "column", gutterSize: "none", children: [
+    /* @__PURE__ */ s(J, { children: /* @__PURE__ */ s(ca, { bottomBarStore: e }) }),
+    /* @__PURE__ */ s(J, { children: /* @__PURE__ */ M(oe, { responsive: !1, children: [
+      /* @__PURE__ */ s(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ s(
+        ea,
         {
-          playQueueStore: t
+          bottomBarStore: e
         }
       ) }),
-      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
-        gi,
+      /* @__PURE__ */ s(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ s(
+        Bi,
         {
-          playerStore: e,
-          playQueueStore: t
+          bottomBarStore: e
         }
       ) }),
-      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
-        Oi,
+      /* @__PURE__ */ s(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ s(
+        la,
         {
-          playerStore: e,
-          playQueueStore: t,
-          onClickPlayQueueButton: n
+          bottomBarStore: e,
+          onClickPlayQueueButton: t
         }
       ) })
     ] }) })
   ] }) })
-), Hi = (e) => /* @__PURE__ */ o(jr, { ...e }), ot = {
+), Ca = (e) => /* @__PURE__ */ s(Cn, { ...e }), lt = {
   width: 400,
   height: 225
-}, Gi = P(
+}, Ia = C(
   ({ children: e }) => {
-    const t = ir();
-    return /* @__PURE__ */ $(
-      lt,
+    const t = fr();
+    return /* @__PURE__ */ M(
+      dt,
       {
         panelled: !0,
         style: {
-          minBlockSize: `max(460px, 100vh - ${Jt}px)`
+          minBlockSize: `max(460px, 100vh - ${Zt}px)`
         },
         children: [
           e,
-          !t.isEmpty && /* @__PURE__ */ o(Yt, { style: { blockSize: ot.height } })
+          !t.isEmpty && /* @__PURE__ */ s(Gt, { style: { blockSize: lt.height } })
         ]
       }
     );
   }
-), Ji = P(
-  ({ playerStore: e, playQueueStore: t }) => {
-    const n = U(), i = N(async () => {
-      t.interacted && await n.play();
-    }, [t, n]), a = N(async () => {
-      switch (t.repeat) {
-        case O.One:
-          await n.setCurrentTime(0);
-          break;
-        case O.Off:
-        case O.All:
-          if (t.isLastItem)
-            switch (t.repeat) {
-              case O.Off:
-                e.onEnded();
-                break;
-              case O.All:
-                t.hasMultipleItems ? await t.goToFirst() : await n.setCurrentTime(0);
-                break;
-            }
-          else
-            await t.next();
-          break;
-      }
-    }, [t, e, n]), l = De(
+), xa = C(
+  ({ miniPlayerStore: e }) => {
+    const t = Ve(
       () => ({
-        services: {
-          [Nr.YouTube]: {
-            host: "https://www.youtube.com"
-          }
-        },
-        onLoaded: i,
+        onLoaded: e.onLoaded,
         onPlay: e.onPlay,
         onPause: e.onPause,
-        onEnded: a,
+        onEnded: e.onEnded,
         onTimeUpdate: e.onTimeUpdate
       }),
-      [e, i, a]
+      [e]
     );
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       "div",
       {
         css: {
           position: "fixed",
           right: 0,
-          bottom: Jt,
-          width: ot.width,
-          height: ot.height,
+          bottom: Zt,
+          width: lt.width,
+          height: lt.height,
           zIndex: 998,
           backgroundColor: "rgb(39, 39, 39)",
           display: "flex",
           flexDirection: "column"
         },
-        children: /* @__PURE__ */ o("div", { css: { flexGrow: 1, backgroundColor: "black" }, children: t.currentItem && /* @__PURE__ */ o(
-          $r,
+        children: /* @__PURE__ */ s("div", { css: { flexGrow: 1, backgroundColor: "black" }, children: e.currentItem && /* @__PURE__ */ s(
+          In,
           {
-            src: t.currentItem.url,
-            options: l,
+            src: e.currentItem.url,
+            options: t,
             onControllerChange: e.onControllerChange
           }
         ) })
@@ -2727,25 +3102,25 @@ const nr = zt(void 0), Wi = ({
     );
   }
 );
-class ki {
-  controller = Dr;
+class ua {
+  controller = xn;
   playing = !1;
   percent = 0;
   seeking = !1;
   constructor(t) {
     t.makeObservable(this, {
-      controller: Z,
-      playing: Z,
-      percent: Z,
-      seeking: Z,
-      setPlaying: y,
-      setPercent: y,
-      setSeeking: y,
-      onControllerChange: y.bound,
-      onPlay: y.bound,
-      onPause: y.bound,
-      onEnded: y.bound,
-      onTimeUpdate: y.bound
+      controller: X,
+      playing: X,
+      percent: X,
+      seeking: X,
+      setPlaying: v,
+      setPercent: v,
+      setSeeking: v,
+      onControllerChange: v.bound,
+      onPlay: v.bound,
+      onPause: v.bound,
+      onEnded: v.bound,
+      onTimeUpdate: v.bound
     });
   }
   setPlaying(t) {
@@ -2773,28 +3148,27 @@ class ki {
     t !== void 0 && (this.seeking || (this.percent = t));
   }
 }
-const or = zt(void 0), Ki = ({
+const pr = Ut(void 0), Oa = ({
   children: e
 }) => {
-  const [t] = W(
-    () => new ki(new Kt())
+  const [t] = z(
+    () => new ua(new er())
   );
-  return /* @__PURE__ */ o(or.Provider, { value: t, children: e });
-}, Xi = () => at(or);
+  return /* @__PURE__ */ s(pr.Provider, { value: t, children: e });
+}, _a = () => ct(pr);
 export {
-  qi as BottomBar,
-  Hi as HydrangeanDivaProvider,
-  Gi as MediaPlayerLayout,
-  Ji as MiniPlayer,
-  Kt as MobXObservableStateProvider,
-  Yi as ObservableStateProvider,
-  ni as PlayQueue,
-  Ui as PlayQueuePage,
-  Wi as PlayQueueStoreProvider,
-  Ki as PlayerStoreProvider,
-  O as RepeatMode,
-  Jt as bottomBarHeight,
-  ir as usePlayQueueStore,
-  Xi as usePlayerStore
+  Ta as BottomBar,
+  Ca as HydrangeanDivaProvider,
+  Ia as MediaPlayerLayout,
+  xa as MiniPlayer,
+  er as MobXObservableStateProvider,
+  Sa as ObservableStateProvider,
+  Ni as PlayQueue,
+  Ra as PlayQueuePage,
+  Ea as PlayQueueStoreProvider,
+  Oa as PlayerStoreProvider,
+  N as RepeatMode,
+  Zt as bottomBarHeight,
+  _a as usePlayerStore
 };
 //# sourceMappingURL=index.es.js.map