@aigamo/hydrangean-diva 0.0.1-alpha.33 → 0.0.1-alpha.35

package/dist/index.es.js

@@ -1,19 +1,19 @@
-import { makeObservable as zr, action as m, computed as g, observable as Z, reaction as Lr } from "mobx";
+import { makeObservable as Lr, action as m, computed as g, observable as Z, reaction as qr } from "mobx";
 import * as re from "react";
-import Ut, { forwardRef as qr, useContext as Oe, createContext as Ue, useState as $, useEffect as Yt, memo as ne, useCallback as B, useMemo as Ye, useLayoutEffect as Qr } from "react";
+import Ut, { forwardRef as Qr, useContext as Oe, createContext as Ue, useState as $, useEffect as Yt, memo as ne, useCallback as B, useMemo as Ye, useLayoutEffect as Wt } from "react";
 import Vr from "@emotion/cache";
 import Ur from "ajv";
 import { useNostalgicDiva as ce, nullPlayerController as Yr, NostalgicDivaProvider as Wr, findVideoService as Hr, NostalgicDiva as Gr } from "@aigamo/nostalgic-diva";
 import { pull as At } from "lodash-es";
-import { EuiSelectable as Jr, EuiPopoverTitle as Kr, EuiPopoverFooter as Xr, EuiButton as J, EuiPopover as ke, useGeneratedHtmlId as Zr, EuiModalHeaderTitle as en, EuiModalHeader as tn, EuiForm as rn, EuiFormRow as ut, EuiFieldText as Ft, EuiModalBody as nn, EuiModalFooter as an, EuiButtonEmpty as Wt, EuiModal as on, EuiCodeBlock as sn, EuiFlyout as ln, useEuiTheme as Ht, EuiCheckbox as Gt, EuiTableHeaderCellCheckbox as cn, EuiTableHeaderCell as ot, EuiTableHeader as un, EuiIcon as U, EuiContextMenu as mt, EuiButtonIcon as Y, EuiTableRowCell as dt, EuiTableRowCellCheckbox as dn, EuiLink as fn, EuiTableRow as pn, EuiTable as mn, EuiFlexGroup as le, EuiFlexItem as G, EuiSpacer as Jt, EuiEmptyPrompt as hn, EuiPageTemplate as ht, EuiRange as Kt, EuiBottomBar as yn } from "@elastic/eui";
-import { AddRegular as Ee, WindowDevToolsRegular as vn, ArrowUploadRegular as gn, ArrowDownloadRegular as bn, MoreHorizontalFilled as Xt, PlayRegular as Pn, DismissRegular as yt, DeleteRegular as Sn, ArrowShuffleFilled as wn, ArrowShuffleOffFilled as Tn, PreviousFilled as Rn, SkipBack10Regular as Zt, PauseFilled as Cn, PlayFilled as En, SkipForward30Regular as er, NextFilled as In, ArrowRepeat1Filled as xn, ArrowRepeatAllFilled as On, ArrowRepeatAllOffFilled as kn, OpenRegular as _n, Speaker2Regular as tr, TopSpeedRegular as An, NavigationPlayRegular as Fn } from "@fluentui/react-icons";
+import { EuiSelectable as Jr, EuiPopoverTitle as Kr, EuiPopoverFooter as Xr, EuiButton as J, EuiPopover as ke, useGeneratedHtmlId as Zr, EuiModalHeaderTitle as en, EuiModalHeader as tn, EuiForm as rn, EuiFormRow as ut, EuiFieldText as Ft, EuiModalBody as nn, EuiModalFooter as an, EuiButtonEmpty as Ht, EuiModal as on, EuiCodeBlock as sn, EuiFlyout as ln, useEuiTheme as Gt, EuiCheckbox as Jt, EuiTableHeaderCellCheckbox as cn, EuiTableHeaderCell as ot, EuiTableHeader as un, EuiIcon as U, EuiContextMenu as mt, EuiButtonIcon as Y, EuiTableRowCell as dt, EuiTableRowCellCheckbox as dn, EuiLink as fn, EuiTableRow as pn, EuiTable as mn, EuiFlexGroup as le, EuiFlexItem as G, EuiSpacer as Kt, EuiEmptyPrompt as hn, EuiPageTemplate as ht, EuiRange as Xt, EuiBottomBar as yn } from "@elastic/eui";
+import { AddRegular as Ee, WindowDevToolsRegular as vn, ArrowUploadRegular as gn, ArrowDownloadRegular as bn, MoreHorizontalFilled as Zt, PlayRegular as Pn, DismissRegular as yt, DeleteRegular as Sn, ArrowShuffleFilled as wn, ArrowShuffleOffFilled as Tn, PreviousFilled as Rn, SkipBack10Regular as er, PauseFilled as Cn, PlayFilled as En, SkipForward30Regular as tr, NextFilled as In, ArrowRepeat1Filled as xn, ArrowRepeatAllFilled as On, ArrowRepeatAllOffFilled as kn, OpenRegular as _n, Speaker2Regular as rr, TopSpeedRegular as An, NavigationPlayRegular as Fn } from "@fluentui/react-icons";
 import { observer as I } from "mobx-react-lite";
 import { ReactSortable as Mn } from "react-sortablejs";
 import { useRouter as Dn } from "@tanstack/react-router";
-const rr = 81;
+const nr = 81;
 class We {
   makeObservable(e, r) {
-    return zr(e, r);
+    return Lr(e, r);
   }
 }
 class Mi {
@@ -325,7 +325,7 @@ function $n() {
       } else
         bt.setExtraStackFrame(null);
     }
-    function gr(n, l, d, v, T) {
+    function br(n, l, d, v, T) {
       {
         var E = Function.call.bind(we);
         for (var S in n)
@@ -344,17 +344,17 @@ function $n() {
           }
       }
     }
-    var br = Array.isArray;
+    var Pr = Array.isArray;
     function tt(n) {
-      return br(n);
+      return Pr(n);
     }
-    function Pr(n) {
+    function Sr(n) {
       {
         var l = typeof Symbol == "function" && Symbol.toStringTag, d = l && n[Symbol.toStringTag] || n.constructor.name || "Object";
         return d;
       }
     }
-    function Sr(n) {
+    function wr(n) {
       try {
         return Pt(n), !1;
       } catch {
@@ -365,16 +365,16 @@ function $n() {
       return "" + n;
     }
     function St(n) {
-      if (Sr(n))
-        return x("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Pr(n)), Pt(n);
+      if (wr(n))
+        return x("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Sr(n)), Pt(n);
     }
-    var wt = q.ReactCurrentOwner, wr = {
+    var wt = q.ReactCurrentOwner, Tr = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
     }, Tt, Rt;
-    function Tr(n) {
+    function Rr(n) {
       if (we.call(n, "ref")) {
         var l = Object.getOwnPropertyDescriptor(n, "ref").get;
         if (l && l.isReactWarning)
@@ -382,7 +382,7 @@ function $n() {
       }
       return n.ref !== void 0;
     }
-    function Rr(n) {
+    function Cr(n) {
       if (we.call(n, "key")) {
         var l = Object.getOwnPropertyDescriptor(n, "key").get;
         if (l && l.isReactWarning)
@@ -390,10 +390,10 @@ function $n() {
       }
       return n.key !== void 0;
     }
-    function Cr(n, l) {
+    function Er(n, l) {
       typeof n.ref == "string" && wt.current;
     }
-    function Er(n, l) {
+    function Ir(n, l) {
       {
         var d = function() {
           Tt || (Tt = !0, x("%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));
@@ -404,7 +404,7 @@ function $n() {
         });
       }
     }
-    function Ir(n, l) {
+    function xr(n, l) {
       {
         var d = function() {
           Rt || (Rt = !0, x("%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));
@@ -415,7 +415,7 @@ function $n() {
         });
       }
     }
-    var xr = function(n, l, d, v, T, E, S) {
+    var Or = function(n, l, d, v, T, E, S) {
       var b = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: e,
@@ -444,12 +444,12 @@ function $n() {
         value: T
       }), Object.freeze && (Object.freeze(b.props), Object.freeze(b)), b;
     };
-    function Or(n, l, d, v, T) {
+    function kr(n, l, d, v, T) {
       {
         var E, S = {}, b = null, j = null;
-        d !== void 0 && (St(d), b = "" + d), Rr(l) && (St(l.key), b = "" + l.key), Tr(l) && (j = l.ref, Cr(l, T));
+        d !== void 0 && (St(d), b = "" + d), Cr(l) && (St(l.key), b = "" + l.key), Rr(l) && (j = l.ref, Er(l, T));
         for (E in l)
-          we.call(l, E) && !wr.hasOwnProperty(E) && (S[E] = l[E]);
+          we.call(l, E) && !Tr.hasOwnProperty(E) && (S[E] = l[E]);
         if (n && n.defaultProps) {
           var _ = n.defaultProps;
           for (E in _)
@@ -457,9 +457,9 @@ function $n() {
         }
         if (b || j) {
           var M = typeof n == "function" ? n.displayName || n.name || "Unknown" : n;
-          b && Er(S, M), j && Ir(S, M);
+          b && Ir(S, M), j && xr(S, M);
         }
-        return xr(n, b, j, T, v, wt.current, S);
+        return Or(n, b, j, T, v, wt.current, S);
       }
     }
     var rt = q.ReactCurrentOwner, Ct = q.ReactDebugCurrentFrame;
@@ -487,11 +487,11 @@ Check the render method of \`` + n + "`.";
         return "";
       }
     }
-    function kr(n) {
+    function _r(n) {
       return "";
     }
     var It = {};
-    function _r(n) {
+    function Ar(n) {
       {
         var l = Et();
         if (!l) {
@@ -508,7 +508,7 @@ Check the top-level render call using <` + d + ">.");
         if (!n._store || n._store.validated || n.key != null)
           return;
         n._store.validated = !0;
-        var d = _r(l);
+        var d = Ar(l);
         if (It[d])
           return;
         It[d] = !0;
@@ -535,7 +535,7 @@ Check the top-level render call using <` + d + ">.");
         }
       }
     }
-    function Ar(n) {
+    function Fr(n) {
       {
         var l = n.type;
         if (l == null || typeof l == "string")
@@ -551,7 +551,7 @@ Check the top-level render call using <` + d + ">.");
           return;
         if (d) {
           var v = K(l);
-          gr(d, n.props, "prop", v, n);
+          br(d, n.props, "prop", v, n);
         } else if (l.PropTypes !== void 0 && !nt) {
           nt = !0;
           var T = K(l);
@@ -560,7 +560,7 @@ Check the top-level render call using <` + d + ">.");
         typeof l.getDefaultProps == "function" && !l.getDefaultProps.isReactClassApproved && x("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function Fr(n) {
+    function Mr(n) {
       {
         for (var l = Object.keys(n.props), d = 0; d < l.length; d++) {
           var v = l[d];
@@ -579,12 +579,12 @@ Check the top-level render call using <` + d + ">.");
         if (!S) {
           var b = "";
           (n === void 0 || typeof n == "object" && n !== null && Object.keys(n).length === 0) && (b += " 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 = kr();
+          var j = _r();
           j ? b += j : b += Et();
           var _;
           n === null ? _ = "null" : tt(n) ? _ = "array" : n !== void 0 && n.$$typeof === e ? (_ = "<" + (K(n.type) || "Unknown") + " />", b = " Did you accidentally export a JSX literal instead of a component?") : _ = typeof n, x("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", _, b);
         }
-        var M = Or(n, l, d, T, E);
+        var M = kr(n, l, d, T, E);
         if (M == null)
           return M;
         if (S) {
@@ -601,30 +601,30 @@ Check the top-level render call using <` + d + ">.");
               Ot(H, n);
         }
         if (we.call(l, "key")) {
-          var oe = K(n), V = Object.keys(l).filter(function(jr) {
-            return jr !== "key";
+          var oe = K(n), V = Object.keys(l).filter(function(zr) {
+            return zr !== "key";
           }), it = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
           if (!kt[oe + it]) {
-            var Br = V.length > 0 ? "{" + V.join(": ..., ") + ": ...}" : "{}";
+            var jr = V.length > 0 ? "{" + V.join(": ..., ") + ": ...}" : "{}";
             x(`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} />`, it, oe, Br, oe), kt[oe + it] = !0;
+  <%s key={someKey} {...props} />`, it, oe, jr, oe), kt[oe + it] = !0;
           }
         }
-        return n === a ? Fr(M) : Ar(M), M;
+        return n === a ? Mr(M) : Fr(M), M;
       }
     }
-    function Mr(n, l, d) {
+    function Dr(n, l, d) {
       return _t(n, l, d, !0);
     }
-    function Dr(n, l, d) {
+    function Nr(n, l, d) {
       return _t(n, l, d, !1);
     }
-    var Nr = Dr, $r = Mr;
-    Re.Fragment = a, Re.jsx = Nr, Re.jsxs = $r;
+    var $r = Nr, Br = Dr;
+    Re.Fragment = a, Re.jsx = $r, Re.jsxs = Br;
   })()), Re;
 }
 var Nt;
@@ -860,7 +860,7 @@ function Vn(t, e, r) {
     t[i] !== void 0 ? e.push(t[i] + ";") : i && (a += i + " ");
   }), a;
 }
-var nr = function(e, r, a) {
+var ar = function(e, r, a) {
   var i = e.key + "-" + r.name;
   // we only need to add the styles to the registered cache if the
   // class name could be used further down
@@ -873,7 +873,7 @@ var nr = function(e, r, a) {
   // also, note that this check will be dead code eliminated in the browser
   Qn === !1) && e.registered[i] === void 0 && (e.registered[i] = r.styles);
 }, Un = function(e, r, a) {
-  nr(e, r, a);
+  ar(e, r, a);
   var i = e.key + "-" + r.name;
   if (e.inserted[r.name] === void 0) {
     var s = r;
@@ -957,12 +957,12 @@ function Hn(t) {
     return e[r] === void 0 && (e[r] = t(r)), e[r];
   };
 }
-var Gn = /[A-Z]|^ms/g, Jn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, ar = function(e) {
+var Gn = /[A-Z]|^ms/g, Jn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, ir = function(e) {
   return e.charCodeAt(1) === 45;
 }, Lt = function(e) {
   return e != null && typeof e != "boolean";
 }, lt = /* @__PURE__ */ Hn(function(t) {
-  return ar(t) ? t : t.replace(Gn, "-$&").toLowerCase();
+  return ir(t) ? t : t.replace(Gn, "-$&").toLowerCase();
 }), qt = function(e, r) {
   switch (e) {
     case "animation":
@@ -976,7 +976,7 @@ var Gn = /[A-Z]|^ms/g, Jn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, ar = function(e) {
           }, i;
         });
   }
-  return Wn[e] !== 1 && !ar(e) && typeof r == "number" && r !== 0 ? r + "px" : r;
+  return Wn[e] !== 1 && !ir(e) && typeof r == "number" && r !== 0 ? r + "px" : r;
 };
 function xe(t, e, r) {
   if (r == null)
@@ -1080,7 +1080,7 @@ function Xn(t, e, r) {
 }
 var Zn = function(e) {
   return e();
-}, ea = re.useInsertionEffect ? re.useInsertionEffect : !1, ta = ea || Zn, ir = /* @__PURE__ */ re.createContext(
+}, ea = re.useInsertionEffect ? re.useInsertionEffect : !1, ta = ea || Zn, or = /* @__PURE__ */ re.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
@@ -1091,20 +1091,20 @@ var Zn = function(e) {
     key: "css"
   }) : null
 );
-ir.Provider;
+or.Provider;
 var ra = function(e) {
-  return /* @__PURE__ */ qr(function(r, a) {
-    var i = Oe(ir);
+  return /* @__PURE__ */ Qr(function(r, a) {
+    var i = Oe(or);
     return e(r, i, a);
   });
-}, na = /* @__PURE__ */ re.createContext({}), He = {}.hasOwnProperty, ft = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", or = function(e, r) {
+}, na = /* @__PURE__ */ re.createContext({}), He = {}.hasOwnProperty, ft = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", sr = function(e, r) {
   var a = {};
   for (var i in r)
     He.call(r, i) && (a[i] = r[i]);
   return a[ft] = e, a;
 }, aa = function(e) {
   var r = e.cache, a = e.serialized, i = e.isStringTag;
-  return nr(r, a, i), ta(function() {
+  return ar(r, a, i), ta(function() {
     return Un(r, a, i);
   }), null;
 }, ia = /* @__PURE__ */ ra(function(t, e, r) {
@@ -1122,10 +1122,10 @@ var ra = function(e) {
     serialized: f,
     isStringTag: typeof i == "string"
   }), /* @__PURE__ */ re.createElement(i, p));
-}), sr = ia, _e = Ie.Fragment, o = function(e, r, a) {
-  return He.call(r, "css") ? Ie.jsx(sr, or(e, r), a) : Ie.jsx(e, r, a);
+}), lr = ia, _e = Ie.Fragment, o = function(e, r, a) {
+  return He.call(r, "css") ? Ie.jsx(lr, sr(e, r), a) : Ie.jsx(e, r, a);
 }, D = function(e, r, a) {
-  return He.call(r, "css") ? Ie.jsxs(sr, or(e, r), a) : Ie.jsxs(e, r, a);
+  return He.call(r, "css") ? Ie.jsxs(lr, sr(e, r), a) : Ie.jsxs(e, r, a);
 };
 const oa = ({
   components: t = [],
@@ -1133,7 +1133,7 @@ const oa = ({
 }) => /* @__PURE__ */ o(_e, { children: t.reduceRight(
   (r, a) => /* @__PURE__ */ o(a, { children: r }),
   e
-) }), lr = Ue(void 0), Ge = () => Oe(lr), ct = new Ur({
+) }), cr = Ue(void 0), Ge = () => Oe(cr), ct = new Ur({
   coerceTypes: !0
 });
 function sa(t, e) {
@@ -1303,7 +1303,6 @@ class Ve {
 class ua {
   constructor(e) {
     this.observableStateProvider = e, e.makeObservable(this, {
-      interacted: Z,
       items: Z,
       currentId: Z,
       repeat: Z,
@@ -1327,7 +1326,6 @@ class ua {
       canPlaySelectedItemsNext: g,
       canRemoveSelectedItems: g,
       setItems: m,
-      interact: m,
       clear: m.bound,
       unselectAll: m,
       selectAll: m,
@@ -1351,7 +1349,6 @@ class ua {
       next: m.bound
     });
   }
-  interacted = !1;
   items = [];
   currentId;
   repeat = O.Off;
@@ -1439,11 +1436,8 @@ class ua {
   setItems(e) {
     this.items = e;
   }
-  interact() {
-    this.interacted = !0;
-  }
   clear() {
-    this.interact(), this.currentIndex = void 0, this.items = [];
+    this.currentIndex = void 0, this.items = [];
   }
   unselectAll() {
     for (const e of this.items)
@@ -1454,7 +1448,7 @@ class ua {
       e.select();
   }
   setCurrentItem(e) {
-    this.interact(), this.currentId = e?.id;
+    this.currentId = e?.id;
   }
   setNextItems(e) {
     this.currentIndex !== void 0 && this.items.splice(this.currentIndex + 1, 0, ...e);
@@ -1492,7 +1486,7 @@ class ua {
       return;
     }
     const { currentIndex: r } = this;
-    r !== void 0 && (this.interact(), this.items.splice(r, 0, ...e), this.currentIndex = r);
+    r !== void 0 && (this.items.splice(r, 0, ...e), this.currentIndex = r);
   }
   moveItem(e, r) {
     const a = this.items.splice(this.items.indexOf(e), 1)[0];
@@ -1508,7 +1502,7 @@ class ua {
     At(
       this.items,
       e.find((s) => s === r)
-    ), this.currentItem !== r && (this.interact(), i ? await this.goToFirst() : this.currentIndex = a);
+    ), this.currentItem !== r && (i ? await this.goToFirst() : this.currentIndex = a);
   }
   async removeSelectedItems() {
     await this.removeItems(this.selectedItemsOrAllItems), this.unselectAll();
@@ -1542,10 +1536,10 @@ class ua {
     this.shuffle = !this.shuffle;
   }
   async previous() {
-    this.currentIndex !== void 0 && this.hasPreviousItem && (this.interact(), this.currentIndex--);
+    this.currentIndex !== void 0 && this.hasPreviousItem && this.currentIndex--;
   }
   async next() {
-    this.currentIndex !== void 0 && this.hasNextItem && (this.interact(), this.currentIndex++);
+    this.currentIndex !== void 0 && this.hasNextItem && this.currentIndex++;
   }
 }
 const da = ({
@@ -1554,13 +1548,13 @@ const da = ({
   const [e] = $(
     () => new ua(new We())
   ), r = ce();
-  return Yt(() => Lr(
+  return Yt(() => qr(
     () => e.currentItem,
     async (a, i) => {
       a === void 0 || i === void 0 || a.type === i.type && a.videoId === i.videoId && await r.setCurrentTime(0);
     }
-  ), [e, r]), /* @__PURE__ */ o(lr.Provider, { value: e, children: t });
-}, cr = Ue(void 0), ur = () => Oe(cr);
+  ), [e, r]), /* @__PURE__ */ o(cr.Provider, { value: e, children: t });
+}, ur = Ue(void 0), dr = () => Oe(ur);
 class fa {
   controller = Yr;
   playing = !1;
@@ -1613,8 +1607,8 @@ const pa = ({
   const [e] = $(
     () => new fa(new We())
   );
-  return /* @__PURE__ */ o(cr.Provider, { value: e, children: t });
-}, dr = Ue(void 0), z = () => Oe(dr);
+  return /* @__PURE__ */ o(ur.Provider, { value: e, children: t });
+}, fr = Ue(void 0), z = () => Oe(fr);
 class ma {
   constructor(e, r, a) {
     this.player = r, this.playQueue = a, e.makeObservable(this, {
@@ -1738,20 +1732,22 @@ class ma {
 const ha = ({
   children: t
 }) => {
-  const e = ur(), r = Ge(), [a] = $(
+  const e = dr(), r = Ge(), [a] = $(
     () => new ma(
       new We(),
       e,
       r
     )
   );
-  return /* @__PURE__ */ o(dr.Provider, { value: a, children: t });
-}, fr = Ue(void 0), ya = () => Oe(fr);
+  return /* @__PURE__ */ o(fr.Provider, { value: a, children: t });
+}, pr = Ue(void 0), ya = () => Oe(pr);
 class va {
   constructor(e, r, a) {
     this.player = r, this.playQueue = a, e.makeObservable(this, {
+      interacted: Z,
       controller: g,
       currentItem: g,
+      interact: m.bound,
       onLoaded: m.bound,
       onPlay: m.bound,
       onPause: m.bound,
@@ -1760,14 +1756,18 @@ class va {
       onControllerChange: m.bound
     });
   }
+  interacted = !1;
   get controller() {
     return this.player.controller;
   }
   get currentItem() {
     return this.playQueue.currentItem;
   }
+  interact() {
+    this.interacted = !0;
+  }
   async onLoaded() {
-    this.playQueue.interacted && await this.controller.play();
+    this.interacted && await this.controller.play();
   }
   onPlay() {
     this.player.onPlay();
@@ -1806,14 +1806,14 @@ class va {
 const ga = ({
   children: t
 }) => {
-  const e = ur(), r = Ge(), [a] = $(
+  const e = dr(), r = Ge(), [a] = $(
     () => new va(
       new We(),
       e,
       r
     )
   );
-  return /* @__PURE__ */ o(fr.Provider, { value: a, children: t });
+  return /* @__PURE__ */ o(pr.Provider, { value: a, children: t });
 }, Di = ({
   children: t,
   nostalgicDivaProps: e
@@ -1833,7 +1833,7 @@ const ga = ({
     enablePlaylists: process.env.NODE_ENV !== "production"
   }
 }, Pa = "http://localhost".replace(/\/+$/, "");
-class pr {
+class mr {
   constructor(e = {}) {
     this.configuration = e;
   }
@@ -1850,7 +1850,7 @@ class pr {
     return this.configuration.middleware || [];
   }
   get queryParamsStringify() {
-    return this.configuration.queryParamsStringify || mr;
+    return this.configuration.queryParamsStringify || hr;
   }
   get username() {
     return this.configuration.username;
@@ -1875,7 +1875,7 @@ class pr {
     return this.configuration.credentials;
   }
 }
-const Sa = new pr();
+const Sa = new mr();
 class vt {
   constructor(e = Sa) {
     this.configuration = e, this.middleware = e.middleware;
@@ -2002,10 +2002,10 @@ class Ce extends Error {
   }
   name = "RequiredError";
 }
-function mr(t, e = "") {
-  return Object.keys(t).map((r) => hr(r, t[r], e)).filter((r) => r.length > 0).join("&");
+function hr(t, e = "") {
+  return Object.keys(t).map((r) => yr(r, t[r], e)).filter((r) => r.length > 0).join("&");
 }
-function hr(t, e, r = "") {
+function yr(t, e, r = "") {
   const a = r + (r.length ? `[${t}]` : t);
   if (e instanceof Array) {
     const i = e.map((s) => encodeURIComponent(String(s))).join(`&${encodeURIComponent(a)}=`);
@@ -2013,9 +2013,9 @@ function hr(t, e, r = "") {
   }
   if (e instanceof Set) {
     const i = Array.from(e);
-    return hr(t, i, r);
+    return yr(t, i, r);
   }
-  return e instanceof Date ? `${encodeURIComponent(a)}=${encodeURIComponent(e.toISOString())}` : e instanceof Object ? mr(e, a) : `${encodeURIComponent(a)}=${encodeURIComponent(String(e))}`;
+  return e instanceof Date ? `${encodeURIComponent(a)}=${encodeURIComponent(e.toISOString())}` : e instanceof Object ? hr(e, a) : `${encodeURIComponent(a)}=${encodeURIComponent(String(e))}`;
 }
 class se {
   constructor(e, r = (a) => a) {
@@ -2025,7 +2025,7 @@ class se {
     return this.transformer(await this.raw.json());
   }
 }
-function yr(t) {
+function vr(t) {
   return Ea(t);
 }
 function Ea(t, e) {
@@ -2039,7 +2039,7 @@ function Ia(t) {
 }
 function xa(t, e) {
   return t == null ? t : {
-    playlist: yr(t.playlist)
+    playlist: vr(t.playlist)
   };
 }
 function Oa(t) {
@@ -2047,7 +2047,7 @@ function Oa(t) {
 }
 function ka(t, e) {
   return t == null ? t : {
-    items: t.items.map(yr)
+    items: t.items.map(vr)
   };
 }
 function _a(t) {
@@ -2245,7 +2245,7 @@ class ja extends vt {
     return await (await this.mediaPlayerPlaylistsPostRaw(e, r)).value();
   }
 }
-const za = new pr({
+const za = new mr({
   basePath: new URL("api", window.location.origin).toString()
 }), La = new ja(
   za
@@ -2343,7 +2343,7 @@ const za = new pr({
       }
     ) }),
     /* @__PURE__ */ D(an, { children: [
-      /* @__PURE__ */ o(Wt, { onClick: t, children: "Cancel" }),
+      /* @__PURE__ */ o(Ht, { onClick: t, children: "Cancel" }),
       /* @__PURE__ */ o(
         J,
         {
@@ -2422,7 +2422,7 @@ I(
     ] });
   }
 );
-const vr = {
+const gr = {
   Audio: "",
   Dailymotion: "https://www.dailymotion.com/favicon.ico",
   Niconico: "https://www.nicovideo.jp/favicon.ico",
@@ -2432,7 +2432,7 @@ const vr = {
   YouTube: "https://www.youtube.com/favicon.ico"
 }, Va = I(
   ({ playQueue: t }) => {
-    const { euiTheme: e } = Ht();
+    const { euiTheme: e } = Gt();
     return /* @__PURE__ */ D(
       un,
       {
@@ -2444,7 +2444,7 @@ const vr = {
         },
         children: [
           /* @__PURE__ */ o(cn, { children: /* @__PURE__ */ o(
-            Gt,
+            Jt,
             {
               id: "",
               checked: t.allItemsSelected,
@@ -2547,7 +2547,7 @@ const vr = {
           {
             title: "More options",
             "aria-label": "More options",
-            iconType: Xt,
+            iconType: Zt,
             size: "s",
             color: "text",
             onClick: a
@@ -2599,7 +2599,7 @@ const vr = {
     const e = ce();
     return /* @__PURE__ */ D(pn, { isSelected: t.isCurrent, children: [
       /* @__PURE__ */ o(dn, { children: /* @__PURE__ */ o(
-        Gt,
+        Jt,
         {
           id: t.id.toString(),
           checked: t.isSelected,
@@ -2609,7 +2609,7 @@ const vr = {
       /* @__PURE__ */ o(dt, { textOnly: !1, children: /* @__PURE__ */ o(
         "img",
         {
-          src: vr[t.type],
+          src: gr[t.type],
           width: 16,
           height: 16,
           alt: t.type
@@ -2659,7 +2659,7 @@ const Xa = I(
   )
 ), Za = I(
   ({ playQueue: t }) => {
-    const { euiTheme: e } = Ht(), r = B(async () => {
+    const { euiTheme: e } = Gt(), r = B(async () => {
     }, []), a = B(
       async (i) => {
         const s = Hr(i.url);
@@ -2738,7 +2738,7 @@ const Xa = I(
         }
       ),
       /* @__PURE__ */ o(
-        Jt,
+        Kt,
         {
           size: "l",
           style: {
@@ -2838,7 +2838,7 @@ const Xa = I(
     {
       title: "Skip back 10 seconds",
       "aria-label": "Skip back 10 seconds",
-      iconType: Zt,
+      iconType: er,
       size: "s",
       iconSize: "l",
       onClick: t.skipBack10,
@@ -2880,7 +2880,7 @@ const Xa = I(
     {
       title: "Skip forward 30 seconds",
       "aria-label": "Skip forward 30 seconds",
-      iconType: er,
+      iconType: tr,
       size: "s",
       iconSize: "l",
       onClick: t.skipForward30,
@@ -2985,9 +2985,9 @@ const Xa = I(
       ke,
       {
         button: /* @__PURE__ */ o(
-          Wt,
+          Ht,
           {
-            iconType: vr[t.type],
+            iconType: gr[t.type],
             size: "s",
             onClick: a,
             children: t.title
@@ -3026,7 +3026,7 @@ const Xa = I(
     {
       title: "Mute",
       "aria-label": "Mute",
-      iconType: tr,
+      iconType: rr,
       size: "s",
       iconSize: "l",
       disabled: !t.controller.supports("setMuted")
@@ -3035,7 +3035,7 @@ const Xa = I(
 }), hi = I(
   ({ button: t, isOpen: e, closePopover: r }) => {
     const a = z(), [i, s] = $("0"), c = ce();
-    Qr(() => {
+    Wt(() => {
       e && c.getVolume().then((p) => {
         p !== void 0 && s(Math.floor(p * 100).toString());
       });
@@ -3063,7 +3063,7 @@ const Xa = I(
             children: [
               /* @__PURE__ */ o(mi, {}),
               /* @__PURE__ */ o(
-                Kt,
+                Xt,
                 {
                   min: 0,
                   max: 100,
@@ -3090,7 +3090,7 @@ const Xa = I(
         {
           title: "Volume",
           "aria-label": "Volume",
-          iconType: tr,
+          iconType: rr,
           size: "s",
           iconSize: "l",
           onClick: () => r(!e),
@@ -3144,13 +3144,13 @@ const Xa = I(
             },
             {
               name: "Skip back 10 seconds",
-              icon: /* @__PURE__ */ o(U, { type: Zt }),
+              icon: /* @__PURE__ */ o(U, { type: er }),
               onClick: a,
               disabled: !e.canSkipBack10
             },
             {
               name: "Skip forward 30 seconds",
-              icon: /* @__PURE__ */ o(U, { type: er }),
+              icon: /* @__PURE__ */ o(U, { type: tr }),
               onClick: i,
               disabled: !e.canSkipForward30
             },
@@ -3218,7 +3218,7 @@ const Xa = I(
         {
           title: "More options",
           "aria-label": "More options",
-          iconType: Xt,
+          iconType: Zt,
           size: "s",
           iconSize: "l",
           onClick: () => e(!t)
@@ -3272,7 +3272,7 @@ const Xa = I(
     [t, e]
   );
   return /* @__PURE__ */ o(
-    Kt,
+    Xt,
     {
       min: 0,
       max: 100,
@@ -3315,13 +3315,15 @@ const Xa = I(
     }),
     [t]
   );
-  return /* @__PURE__ */ o(
+  return Wt(() => (window.addEventListener("click", t.interact, { once: !0 }), () => {
+    window.removeEventListener("click", t.interact);
+  }), [t]), /* @__PURE__ */ o(
     "div",
     {
       css: {
         position: "fixed",
         right: 0,
-        bottom: rr,
+        bottom: nr,
         width: pt.width,
         height: pt.height,
         zIndex: 998,
@@ -3347,11 +3349,11 @@ const Xa = I(
       {
         panelled: !0,
         style: {
-          minBlockSize: `max(460px, 100vh - ${rr}px)`
+          minBlockSize: `max(460px, 100vh - ${nr}px)`
         },
         children: [
           t,
-          !e.isEmpty && /* @__PURE__ */ o(Jt, { style: { blockSize: pt.height } })
+          !e.isEmpty && /* @__PURE__ */ o(Kt, { style: { blockSize: pt.height } })
         ]
       }
     );
@@ -3365,10 +3367,10 @@ export {
   We as MobXObservableStateProvider,
   Mi as ObservableStateProvider,
   Za as PlayQueue,
-  lr as PlayQueueContext,
+  cr as PlayQueueContext,
   Ni as PlayQueuePage,
   O as RepeatMode,
-  rr as bottomBarHeight,
+  nr as bottomBarHeight,
   Ge as usePlayQueue
 };
 //# sourceMappingURL=index.es.js.map