@aigamo/hydrangean-diva 0.0.1-alpha.12 → 0.0.1-alpha.13

package/dist/index.es.js

@@ -5,19 +5,19 @@ import { makeObservable as Rr, action as y, computed as _, observable as te, rea
 import * as re from "react";
 import zt, { forwardRef as Or, useContext as st, memo as Z, useState as q, useCallback as $, createContext as Lt, useEffect as _r, useLayoutEffect as Ar, useMemo as Vt } from "react";
 import kr from "@emotion/cache";
-import { EuiButton as ne, EuiModalHeaderTitle as Mr, EuiModalHeader as Fr, EuiForm as jr, EuiFormRow as tt, EuiFieldText as It, EuiModalBody as Nr, EuiModalFooter as $r, EuiButtonEmpty as Dr, EuiModal as zr, useEuiTheme as Yt, EuiCheckbox as Bt, EuiTableHeaderCellCheckbox as Lr, EuiTableHeader as Vr, EuiContextMenuItem as Yr, EuiContextMenuPanel as Br, EuiTableRowCell as rt, EuiTableRowCellCheckbox as Wr, EuiLink as Ur, EuiTableRow as qr, EuiTable as Hr, EuiButtonIcon as K, EuiPopover as lt, EuiIcon as H, EuiHorizontalRule as Pt, EuiTableHeaderCell as Xe, EuiCodeBlock as Gr, EuiFlyout as Jr, EuiFlexGroup as me, EuiFlexItem as G, EuiSpacer as Wt, EuiEmptyPrompt as Kr, EuiPageTemplate as nt, EuiRange as Ut, EuiContextMenu as Xr, EuiBottomBar as Zr } from "@elastic/eui";
-import { AddRegular as ct, PlayRegular as Qr, DismissRegular as ut, MoreHorizontalFilled as qt, ArrowUploadRegular as en, ArrowDownloadRegular as tn, WindowDevToolsRegular as rn, DeleteRegular as nn, Speaker2Regular as Ht, TopSpeedRegular as on, SkipBack10Regular as an, SkipForward30Regular as sn, ArrowRepeat1Filled as ln, ArrowRepeatAllFilled as cn, ArrowRepeatAllOffFilled as un, ArrowShuffleFilled as fn, ArrowShuffleOffFilled as dn, PreviousFilled as mn, PauseFilled as hn, PlayFilled as vn, NextFilled as pn } from "@fluentui/react-icons";
+import { EuiButton as ne, EuiModalHeaderTitle as Mr, EuiModalHeader as Fr, EuiForm as jr, EuiFormRow as tt, EuiFieldText as It, EuiModalBody as Nr, EuiModalFooter as $r, EuiButtonEmpty as Dr, EuiModal as zr, useEuiTheme as Yt, EuiCheckbox as Bt, EuiTableHeaderCellCheckbox as Lr, EuiTableHeader as Vr, EuiContextMenuItem as Yr, EuiContextMenuPanel as Br, EuiTableRowCell as rt, EuiTableRowCellCheckbox as Wr, EuiLink as Ur, EuiTableRow as qr, EuiTable as Hr, EuiButtonIcon as G, EuiPopover as lt, EuiIcon as H, EuiHorizontalRule as Pt, EuiTableHeaderCell as Xe, EuiCodeBlock as Gr, EuiFlyout as Jr, EuiFlexGroup as me, EuiFlexItem as J, EuiSpacer as Wt, EuiEmptyPrompt as Kr, EuiPageTemplate as nt, EuiRange as Ut, EuiContextMenu as Xr, EuiBottomBar as Zr } from "@elastic/eui";
+import { AddRegular as ct, PlayRegular as Qr, DismissRegular as ut, MoreHorizontalFilled as qt, ArrowUploadRegular as en, ArrowDownloadRegular as tn, WindowDevToolsRegular as rn, DeleteRegular as nn, Speaker2Regular as Ht, TopSpeedRegular as on, SkipBack10Regular as an, SkipForward30Regular as sn, ArrowRepeat1Filled as ln, ArrowRepeatAllFilled as cn, ArrowRepeatAllOffFilled as un, ArrowShuffleFilled as fn, ArrowShuffleOffFilled as dn, PreviousFilled as mn, PauseFilled as hn, PlayFilled as vn, NextFilled as pn, NavigationPlayRegular as yn } from "@fluentui/react-icons";
 import { observer as Y } from "mobx-react-lite";
-import { findVideoService as yn, useNostalgicDiva as ie, NostalgicDiva as gn } from "@aigamo/nostalgic-diva";
-import { ReactSortable as bn } from "react-sortablejs";
+import { findVideoService as gn, useNostalgicDiva as ie, NostalgicDiva as bn } from "@aigamo/nostalgic-diva";
+import { ReactSortable as En } from "react-sortablejs";
 import { pull as Rt } from "lodash-es";
-import En from "ajv";
+import Tn from "ajv";
 class Gt {
   makeObservable(e, n) {
     return Rr(e, n);
   }
 }
-class wi {
+class _i {
   makeObservable(e, n) {
     return e;
   }
@@ -33,7 +33,7 @@ var $e = { exports: {} }, xe = {};
  * LICENSE file in the root directory of this source tree.
  */
 var wt;
-function Tn() {
+function xn() {
   if (wt) return xe;
   wt = 1;
   var t = zt, e = Symbol.for("react.element"), n = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, a = t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
@@ -57,7 +57,7 @@ var Se = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Ot;
-function xn() {
+function Sn() {
   return Ot || (Ot = 1, process.env.NODE_ENV !== "production" && function() {
     var t = zt, e = Symbol.for("react.element"), n = Symbol.for("react.portal"), i = Symbol.for("react.fragment"), a = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), f = Symbol.for("react.provider"), h = Symbol.for("react.context"), m = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), E = Symbol.for("react.suspense_list"), P = Symbol.for("react.memo"), D = Symbol.for("react.lazy"), j = Symbol.for("react.offscreen"), A = Symbol.iterator, B = "@@iterator";
     function Q(r) {
@@ -103,7 +103,7 @@ function xn() {
     function Oe(r) {
       return r.displayName || "Context";
     }
-    function J(r) {
+    function K(r) {
       if (r == null)
         return null;
       if (typeof r.tag == "number" && I("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof r == "function")
@@ -136,11 +136,11 @@ function xn() {
             return Ye(r, r.render, "ForwardRef");
           case P:
             var v = r.displayName || null;
-            return v !== null ? v : J(r.type) || "Memo";
+            return v !== null ? v : K(r.type) || "Memo";
           case D: {
             var T = r, C = T._payload, b = T._init;
             try {
-              return J(b(C));
+              return K(b(C));
             } catch {
               return null;
             }
@@ -497,7 +497,7 @@ function xn() {
     function bt() {
       {
         if (He.current) {
-          var r = J(He.current.type);
+          var r = K(He.current.type);
           if (r)
             return `
 
@@ -532,7 +532,7 @@ Check the top-level render call using <` + u + ">.");
           return;
         Et[u] = !0;
         var v = "";
-        r && r._owner && r._owner !== He.current && (v = " It was passed a child from " + J(r._owner.type) + "."), fe(r), I('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, v), fe(null);
+        r && r._owner && r._owner !== He.current && (v = " It was passed a child from " + K(r._owner.type) + "."), fe(r), I('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, v), fe(null);
       }
     }
     function xt(r, s) {
@@ -569,11 +569,11 @@ Check the top-level render call using <` + u + ">.");
         else
           return;
         if (u) {
-          var v = J(s);
+          var v = K(s);
           nr(u, r.props, "prop", v, r);
         } else if (s.PropTypes !== void 0 && !Ge) {
           Ge = !0;
-          var T = J(s);
+          var T = K(s);
           I("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", T || "Unknown");
         }
         typeof s.getDefaultProps == "function" && !s.getDefaultProps.isReactClassApproved && I("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
@@ -601,7 +601,7 @@ Check the top-level render call using <` + u + ">.");
           var N = vr();
           N ? g += N : g += bt();
           var O;
-          r === null ? O = "null" : qe(r) ? O = "array" : r !== void 0 && r.$$typeof === e ? (O = "<" + (J(r.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : O = typeof r, I("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", O, g);
+          r === null ? O = "null" : qe(r) ? O = "array" : r !== void 0 && r.$$typeof === e ? (O = "<" + (K(r.type) || "Unknown") + " />", g = " Did you accidentally export a JSX literal instead of a component?") : O = typeof r, I("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", O, g);
         }
         var M = hr(r, s, u, T, C);
         if (M == null)
@@ -620,7 +620,7 @@ Check the top-level render call using <` + u + ">.");
               xt(W, r);
         }
         if (Te.call(s, "key")) {
-          var se = J(r), V = Object.keys(s).filter(function(Cr) {
+          var se = K(r), V = Object.keys(s).filter(function(Cr) {
             return Cr !== "key";
           }), Ke = V.length > 0 ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}";
           if (!St[se + Ke]) {
@@ -647,10 +647,10 @@ React keys must be passed directly to JSX without using spread:
   }()), Se;
 }
 var _t;
-function Sn() {
-  return _t || (_t = 1, process.env.NODE_ENV === "production" ? $e.exports = Tn() : $e.exports = xn()), $e.exports;
+function Cn() {
+  return _t || (_t = 1, process.env.NODE_ENV === "production" ? $e.exports = xn() : $e.exports = Sn()), $e.exports;
 }
-var Ie = Sn(), De = { exports: {} }, x = {};
+var Ie = Cn(), De = { exports: {} }, x = {};
 /** @license React v16.13.1
  * react-is.production.min.js
  *
@@ -660,7 +660,7 @@ var Ie = Sn(), De = { exports: {} }, x = {};
  * LICENSE file in the root directory of this source tree.
  */
 var At;
-function Cn() {
+function In() {
   if (At) return x;
   At = 1;
   var t = typeof Symbol == "function" && Symbol.for, e = t ? Symbol.for("react.element") : 60103, n = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, l = t ? Symbol.for("react.profiler") : 60114, f = t ? Symbol.for("react.provider") : 60109, h = t ? Symbol.for("react.context") : 60110, m = t ? Symbol.for("react.async_mode") : 60111, p = t ? Symbol.for("react.concurrent_mode") : 60111, E = t ? Symbol.for("react.forward_ref") : 60112, P = t ? Symbol.for("react.suspense") : 60113, D = t ? Symbol.for("react.suspense_list") : 60120, j = t ? Symbol.for("react.memo") : 60115, A = t ? Symbol.for("react.lazy") : 60116, B = t ? Symbol.for("react.block") : 60121, Q = t ? Symbol.for("react.fundamental") : 60117, z = t ? Symbol.for("react.responder") : 60118, I = t ? Symbol.for("react.scope") : 60119;
@@ -735,7 +735,7 @@ var S = {};
  * LICENSE file in the root directory of this source tree.
  */
 var kt;
-function In() {
+function Pn() {
   return kt || (kt = 1, process.env.NODE_ENV !== "production" && function() {
     var t = typeof Symbol == "function" && Symbol.for, e = t ? Symbol.for("react.element") : 60103, n = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, l = t ? Symbol.for("react.profiler") : 60114, f = t ? Symbol.for("react.provider") : 60109, h = t ? Symbol.for("react.context") : 60110, m = t ? Symbol.for("react.async_mode") : 60111, p = t ? Symbol.for("react.concurrent_mode") : 60111, E = t ? Symbol.for("react.forward_ref") : 60112, P = t ? Symbol.for("react.suspense") : 60113, D = t ? Symbol.for("react.suspense_list") : 60120, j = t ? Symbol.for("react.memo") : 60115, A = t ? Symbol.for("react.lazy") : 60116, B = t ? Symbol.for("react.block") : 60121, Q = t ? Symbol.for("react.fundamental") : 60117, z = t ? Symbol.for("react.responder") : 60118, I = t ? Symbol.for("react.scope") : 60119;
     function k(d) {
@@ -774,7 +774,7 @@ function In() {
         }
       }
     }
-    var c = m, L = p, he = h, Re = f, we = e, Ve = E, Ye = i, Oe = A, J = j, ee = n, oe = l, _e = a, Ae = P, ve = !1;
+    var c = m, L = p, he = h, Re = f, we = e, Ve = E, Ye = i, Oe = A, K = j, ee = n, oe = l, _e = a, Ae = P, ve = !1;
     function ke(d) {
       return ve || (ve = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), pe(d) || w(d) === m;
     }
@@ -814,18 +814,18 @@ function In() {
     function Ue(d) {
       return w(d) === P;
     }
-    S.AsyncMode = c, S.ConcurrentMode = L, S.ContextConsumer = he, S.ContextProvider = Re, S.Element = we, S.ForwardRef = Ve, S.Fragment = Ye, S.Lazy = Oe, S.Memo = J, S.Portal = ee, S.Profiler = oe, S.StrictMode = _e, S.Suspense = Ae, S.isAsyncMode = ke, S.isConcurrentMode = pe, S.isContextConsumer = Me, S.isContextProvider = Fe, S.isElement = je, S.isForwardRef = Be, S.isFragment = We, S.isLazy = ye, S.isMemo = ge, S.isPortal = le, S.isProfiler = be, S.isStrictMode = ce, S.isSuspense = Ue, S.isValidElementType = k, S.typeOf = w;
+    S.AsyncMode = c, S.ConcurrentMode = L, S.ContextConsumer = he, S.ContextProvider = Re, S.Element = we, S.ForwardRef = Ve, S.Fragment = Ye, S.Lazy = Oe, S.Memo = K, S.Portal = ee, S.Profiler = oe, S.StrictMode = _e, S.Suspense = Ae, S.isAsyncMode = ke, S.isConcurrentMode = pe, S.isContextConsumer = Me, S.isContextProvider = Fe, S.isElement = je, S.isForwardRef = Be, S.isFragment = We, S.isLazy = ye, S.isMemo = ge, S.isPortal = le, S.isProfiler = be, S.isStrictMode = ce, S.isSuspense = Ue, S.isValidElementType = k, S.typeOf = w;
   }()), S;
 }
 var Mt;
-function Pn() {
-  return Mt || (Mt = 1, process.env.NODE_ENV === "production" ? De.exports = Cn() : De.exports = In()), De.exports;
+function Rn() {
+  return Mt || (Mt = 1, process.env.NODE_ENV === "production" ? De.exports = In() : De.exports = Pn()), De.exports;
 }
 var Ze, Ft;
-function Rn() {
+function wn() {
   if (Ft) return Ze;
   Ft = 1;
-  var t = Pn(), e = {
+  var t = Rn(), e = {
     childContextTypes: !0,
     contextType: !0,
     contextTypes: !0,
@@ -887,9 +887,9 @@ function Rn() {
   }
   return Ze = j, Ze;
 }
-Rn();
-var wn = !0;
-function On(t, e, n) {
+wn();
+var On = !0;
+function _n(t, e, n) {
   var i = "";
   return n.split(" ").forEach(function(a) {
     t[a] !== void 0 ? e.push(t[a] + ";") : a && (i += a + " ");
@@ -906,8 +906,8 @@ var Jt = function(e, 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
-  wn === !1) && e.registered[a] === void 0 && (e.registered[a] = n.styles);
-}, _n = function(e, n, i) {
+  On === !1) && e.registered[a] === void 0 && (e.registered[a] = n.styles);
+}, An = function(e, n, i) {
   Jt(e, n, i);
   var a = e.key + "-" + n.name;
   if (e.inserted[n.name] === void 0) {
@@ -917,7 +917,7 @@ var Jt = function(e, n, i) {
     while (l !== void 0);
   }
 };
-function An(t) {
+function kn(t) {
   for (var e = 0, n, i = 0, a = t.length; a >= 4; ++i, a -= 4)
     n = t.charCodeAt(i) & 255 | (t.charCodeAt(++i) & 255) << 8 | (t.charCodeAt(++i) & 255) << 16 | (t.charCodeAt(++i) & 255) << 24, n = /* Math.imul(k, m): */
     (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), n ^= /* k >>> r: */
@@ -936,7 +936,7 @@ function An(t) {
   return e ^= e >>> 13, e = /* Math.imul(h, m): */
   (e & 65535) * 1540483477 + ((e >>> 16) * 59797 << 16), ((e ^ e >>> 15) >>> 0).toString(36);
 }
-var kn = {
+var Mn = {
   animationIterationCount: 1,
   aspectRatio: 1,
   borderImageOutset: 1,
@@ -986,24 +986,24 @@ var kn = {
   strokeOpacity: 1,
   strokeWidth: 1
 };
-function Mn(t) {
+function Fn(t) {
   var e = /* @__PURE__ */ Object.create(null);
   return function(n) {
     return e[n] === void 0 && (e[n] = t(n)), e[n];
   };
 }
-var Fn = /[A-Z]|^ms/g, jn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Kt = function(e) {
+var jn = /[A-Z]|^ms/g, Nn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Kt = function(e) {
   return e.charCodeAt(1) === 45;
 }, jt = function(e) {
   return e != null && typeof e != "boolean";
-}, Qe = /* @__PURE__ */ Mn(function(t) {
-  return Kt(t) ? t : t.replace(Fn, "-$&").toLowerCase();
+}, Qe = /* @__PURE__ */ Fn(function(t) {
+  return Kt(t) ? t : t.replace(jn, "-$&").toLowerCase();
 }), Nt = function(e, n) {
   switch (e) {
     case "animation":
     case "animationName":
       if (typeof n == "string")
-        return n.replace(jn, function(i, a, l) {
+        return n.replace(Nn, function(i, a, l) {
           return X = {
             name: a,
             styles: l,
@@ -1011,7 +1011,7 @@ var Fn = /[A-Z]|^ms/g, jn = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Kt = function(e) {
           }, a;
         });
   }
-  return kn[e] !== 1 && !Kt(e) && typeof n == "number" && n !== 0 ? n + "px" : n;
+  return Mn[e] !== 1 && !Kt(e) && typeof n == "number" && n !== 0 ? n + "px" : n;
 };
 function Pe(t, e, n) {
   if (n == null)
@@ -1043,7 +1043,7 @@ function Pe(t, e, n) {
         var h = l.styles + ";";
         return h;
       }
-      return Nn(t, e, n);
+      return $n(t, e, n);
     }
     case "function": {
       if (t !== void 0) {
@@ -1056,7 +1056,7 @@ function Pe(t, e, n) {
   var E = n;
   return E;
 }
-function Nn(t, e, n) {
+function $n(t, e, n) {
   var i = "";
   if (Array.isArray(n))
     for (var a = 0; a < n.length; a++)
@@ -1086,7 +1086,7 @@ function Nn(t, e, n) {
   return i;
 }
 var $t = /label:\s*([^\s;{]+)\s*(;|$)/g, X;
-function $n(t, e, n) {
+function Dn(t, e, n) {
   if (t.length === 1 && typeof t[0] == "object" && t[0] !== null && t[0].styles !== void 0)
     return t[0];
   var i = !0, a = "";
@@ -1106,16 +1106,16 @@ function $n(t, e, n) {
   $t.lastIndex = 0;
   for (var p = "", E; (E = $t.exec(a)) !== null; )
     p += "-" + E[1];
-  var P = An(a) + p;
+  var P = kn(a) + p;
   return {
     name: P,
     styles: a,
     next: X
   };
 }
-var Dn = function(e) {
+var zn = function(e) {
   return e();
-}, zn = re.useInsertionEffect ? re.useInsertionEffect : !1, Ln = zn || Dn, Xt = /* @__PURE__ */ re.createContext(
+}, Ln = re.useInsertionEffect ? re.useInsertionEffect : !1, Vn = Ln || zn, Xt = /* @__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
@@ -1127,42 +1127,42 @@ var Dn = function(e) {
   }) : null
 );
 Xt.Provider;
-var Vn = function(e) {
+var Yn = function(e) {
   return /* @__PURE__ */ Or(function(n, i) {
     var a = st(Xt);
     return e(n, a, i);
   });
-}, Yn = /* @__PURE__ */ re.createContext({}), ze = {}.hasOwnProperty, it = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", Zt = function(e, n) {
+}, Bn = /* @__PURE__ */ re.createContext({}), ze = {}.hasOwnProperty, it = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", Zt = function(e, n) {
   var i = {};
   for (var a in n)
     ze.call(n, a) && (i[a] = n[a]);
   return i[it] = e, i;
-}, Bn = function(e) {
+}, Wn = function(e) {
   var n = e.cache, i = e.serialized, a = e.isStringTag;
-  return Jt(n, i, a), Ln(function() {
-    return _n(n, i, a);
+  return Jt(n, i, a), Vn(function() {
+    return An(n, i, a);
   }), null;
-}, Wn = /* @__PURE__ */ Vn(function(t, e, n) {
+}, Un = /* @__PURE__ */ Yn(function(t, e, n) {
   var i = t.css;
   typeof i == "string" && e.registered[i] !== void 0 && (i = e.registered[i]);
   var a = t[it], l = [i], f = "";
-  typeof t.className == "string" ? f = On(e.registered, l, t.className) : t.className != null && (f = t.className + " ");
-  var h = $n(l, void 0, re.useContext(Yn));
+  typeof t.className == "string" ? f = _n(e.registered, l, t.className) : t.className != null && (f = t.className + " ");
+  var h = Dn(l, void 0, re.useContext(Bn));
   f += e.key + "-" + h.name;
   var m = {};
   for (var p in t)
     ze.call(t, p) && p !== "css" && p !== it && (m[p] = t[p]);
-  return m.className = f, n && (m.ref = n), /* @__PURE__ */ re.createElement(re.Fragment, null, /* @__PURE__ */ re.createElement(Bn, {
+  return m.className = f, n && (m.ref = n), /* @__PURE__ */ re.createElement(re.Fragment, null, /* @__PURE__ */ re.createElement(Wn, {
     cache: e,
     serialized: h,
     isStringTag: typeof a == "string"
   }), /* @__PURE__ */ re.createElement(a, m));
-}), Qt = Wn, Le = Ie.Fragment, o = function(e, n, i) {
+}), Qt = Un, Le = Ie.Fragment, o = function(e, n, i) {
   return ze.call(n, "css") ? Ie.jsx(Qt, Zt(e, n), i) : Ie.jsx(e, n, i);
 }, F = function(e, n, i) {
   return ze.call(n, "css") ? Ie.jsxs(Qt, Zt(e, n), i) : Ie.jsxs(e, n, i);
 };
-const Un = ({
+const qn = ({
   onCancel: t,
   onSave: e
 }) => {
@@ -1209,14 +1209,14 @@ const Un = ({
     ] })
   ] });
 };
-function qn(t) {
+function Hn(t) {
   return t !== null && typeof t == "object" && "title" in t && typeof t.title == "string";
 }
 const Dt = Z(
   ({ playQueueStore: t }) => {
     const [e, n] = q(!1), i = $(
       async (a) => {
-        const l = yn(a.url);
+        const l = gn(a.url);
         if (l !== void 0) {
           const f = l.extractVideoId(a.url);
           if (f !== void 0) {
@@ -1230,7 +1230,7 @@ const Dt = Z(
                 url: a.url,
                 type: l.type,
                 videoId: f,
-                title: a.title || (qn(m) ? m.title : f)
+                title: a.title || (Hn(m) ? m.title : f)
               })
             ]);
           }
@@ -1250,7 +1250,7 @@ const Dt = Z(
         }
       ),
       e && /* @__PURE__ */ o(
-        Un,
+        qn,
         {
           onCancel: () => n(!1),
           onSave: i
@@ -1258,7 +1258,7 @@ const Dt = Z(
       )
     ] });
   }
-), Hn = Y(
+), Gn = Y(
   ({ playQueueStore: t }) => {
     const { euiTheme: e } = Yt();
     return /* @__PURE__ */ F(
@@ -1288,7 +1288,7 @@ const Dt = Z(
       }
     );
   }
-), Gn = Z(
+), Jn = Z(
   ({
     item: t,
     closePopover: e
@@ -1372,14 +1372,14 @@ const Dt = Z(
       )
     ] });
   }
-), Jn = Z(
+), Kn = Z(
   ({ item: t }) => {
     const [e, n] = q(!1), i = $(() => n(!e), [e]), a = $(() => n(!1), []);
     return /* @__PURE__ */ o(
       lt,
       {
         button: /* @__PURE__ */ o(
-          K,
+          G,
           {
             title: "More options",
             "aria-label": "More options",
@@ -1394,7 +1394,7 @@ const Dt = Z(
         panelPaddingSize: "none",
         anchorPosition: "leftCenter",
         children: /* @__PURE__ */ o(
-          Gn,
+          Jn,
           {
             item: t,
             closePopover: a
@@ -1403,7 +1403,7 @@ const Dt = Z(
       }
     );
   }
-), Kn = Y(
+), Xn = Y(
   ({ item: t }) => {
     const e = ie();
     return /* @__PURE__ */ F(rt, { textOnly: !1, hasActions: !0, align: "right", children: [
@@ -1427,10 +1427,10 @@ const Dt = Z(
           children: "Remove"
         }
       ),
-      /* @__PURE__ */ o(Jn, { item: t })
+      /* @__PURE__ */ o(Kn, { item: t })
     ] });
   }
-), Xn = {
+), Zn = {
   Audio: "",
   Dailymotion: "https://www.dailymotion.com/favicon.ico",
   Niconico: "https://www.nicovideo.jp/favicon.ico",
@@ -1438,7 +1438,7 @@ const Dt = Z(
   Twitch: "https://www.twitch.tv/favicon.ico",
   Vimeo: "https://vimeo.com/favicon.ico",
   YouTube: "https://www.youtube.com/favicon.ico"
-}, Zn = Y(
+}, Qn = Y(
   ({ item: t }) => {
     const e = ie();
     return /* @__PURE__ */ F(qr, { isSelected: t.isCurrent, children: [
@@ -1453,7 +1453,7 @@ const Dt = Z(
       /* @__PURE__ */ o(rt, { textOnly: !1, children: /* @__PURE__ */ o(
         "img",
         {
-          src: Xn[t.type],
+          src: Zn[t.type],
           width: 16,
           height: 16,
           alt: t.type
@@ -1469,23 +1469,23 @@ const Dt = Z(
           children: t.title
         }
       ) }),
-      /* @__PURE__ */ o(Kn, { item: t })
+      /* @__PURE__ */ o(Xn, { item: t })
     ] }, t.id);
   }
-), Qn = Y(
+), ei = Y(
   ({ playQueueStore: t }) => /* @__PURE__ */ o(
-    bn,
+    En,
     {
       tag: "tbody",
       list: t.items,
       setList: (e) => t.setItems(e),
-      children: t.items.map((e) => /* @__PURE__ */ o(Zn, { item: e }, e.id))
+      children: t.items.map((e) => /* @__PURE__ */ o(Qn, { item: e }, e.id))
     }
   )
-), ei = Y(
+), ti = Y(
   ({ playQueueStore: t }) => /* @__PURE__ */ F(Hr, { children: [
-    /* @__PURE__ */ o(Hn, { playQueueStore: t }),
-    /* @__PURE__ */ o(Qn, { playQueueStore: t })
+    /* @__PURE__ */ o(Gn, { playQueueStore: t }),
+    /* @__PURE__ */ o(ei, { playQueueStore: t })
   ] })
 );
 Y(
@@ -1525,7 +1525,7 @@ Y(
     ] });
   }
 );
-const ti = Y(
+const ri = Y(
   ({ playQueueStore: t }) => {
     const { euiTheme: e } = Yt();
     return /* @__PURE__ */ F(Le, { children: [
@@ -1541,7 +1541,7 @@ const ti = Y(
             background: e.colors.backgroundBasePlain
           },
           children: [
-            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
               ne,
               {
                 disabled: t.isEmpty || t.selectedItems.length === 0,
@@ -1549,7 +1549,7 @@ const ti = Y(
                 children: "Play next"
               }
             ) }),
-            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
               ne,
               {
                 iconType: ct,
@@ -1558,7 +1558,7 @@ const ti = Y(
                 children: "Add to play queue"
               }
             ) }),
-            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
               ne,
               {
                 iconType: ut,
@@ -1567,7 +1567,7 @@ const ti = Y(
                 children: "Remove"
               }
             ) }),
-            /* @__PURE__ */ o(G, { grow: !1, children: /* @__PURE__ */ o(
+            /* @__PURE__ */ o(J, { grow: !1, children: /* @__PURE__ */ o(
               ne,
               {
                 iconType: nn,
@@ -1576,8 +1576,8 @@ const ti = Y(
                 children: "Clear"
               }
             ) }),
-            /* @__PURE__ */ o(G, { grow: !0 }),
-            /* @__PURE__ */ F(G, { grow: !1, children: [
+            /* @__PURE__ */ o(J, { grow: !0 }),
+            /* @__PURE__ */ F(J, { grow: !1, children: [
               !1,
               /* @__PURE__ */ o(Dt, { playQueueStore: t })
             ] })
@@ -1603,10 +1603,10 @@ const ti = Y(
           body: /* @__PURE__ */ o("p", { children: "Your video library doesn't contain any video content." }),
           actions: /* @__PURE__ */ o(Dt, { playQueueStore: t })
         }
-      ) : /* @__PURE__ */ o(ei, { playQueueStore: t })
+      ) : /* @__PURE__ */ o(ti, { playQueueStore: t })
     ] });
   }
-), Oi = Y(
+), Ai = Y(
   ({ playQueueStore: t }) => /* @__PURE__ */ F(Le, { children: [
     /* @__PURE__ */ o(
       nt.Header,
@@ -1615,12 +1615,12 @@ const ti = Y(
         rightSideItems: []
       }
     ),
-    /* @__PURE__ */ o(nt.Section, { children: /* @__PURE__ */ o(ti, { playQueueStore: t }) })
+    /* @__PURE__ */ o(nt.Section, { children: /* @__PURE__ */ o(ri, { playQueueStore: t }) })
   ] })
-), et = new En({
+), et = new Tn({
   coerceTypes: !0
 });
-function ri(t, e) {
+function ni(t, e) {
   let n;
   if (n = et.getSchema(e), n === void 0 && (et.addSchema(t, e), n = et.getSchema(e)), n === void 0 || n.schema !== t)
     throw new Error(
@@ -1630,7 +1630,7 @@ function ri(t, e) {
     );
   return n;
 }
-const ni = {
+const ii = {
   type: "object",
   properties: {
     url: {
@@ -1649,7 +1649,7 @@ const ni = {
   required: ["url", "type", "videoId", "title"]
 };
 var R = /* @__PURE__ */ ((t) => (t.Off = "Off", t.All = "All", t.One = "One", t))(R || {});
-const ii = {
+const oi = {
   type: "object",
   properties: {
     version: {
@@ -1668,7 +1668,7 @@ const ii = {
     items: {
       type: "array",
       nullable: !0,
-      items: ni
+      items: ii
     },
     currentIndex: {
       type: "integer",
@@ -1787,7 +1787,7 @@ const ii = {
 };
 U(Ce, "nextId", 1);
 let ot = Ce;
-class oi {
+class ai {
   constructor(e) {
     U(this, "interacted", !1);
     U(this, "items", []);
@@ -1858,8 +1858,8 @@ class oi {
     this.repeat = e.repeat ?? R.Off, this.shuffle = e.shuffle ?? !1, this.items = ((n = e.items) == null ? void 0 : n.map((i) => this.createItem(i))) ?? [], this.currentIndex = e.currentIndex;
   }
   validateLocalStorageState(e) {
-    return ri(
-      ii,
+    return ni(
+      oi,
       "PlayQueueDto"
     )(e);
   }
@@ -2015,11 +2015,11 @@ class oi {
     this.currentIndex !== void 0 && (this.currentIndex = 0);
   }
 }
-const er = Lt(void 0), _i = ({
+const er = Lt(void 0), ki = ({
   children: t
 }) => {
   const [e] = q(
-    () => new oi(new Gt())
+    () => new ai(new Gt())
   ), n = ie();
   return _r(() => wr(
     () => e.currentItem,
@@ -2027,7 +2027,7 @@ const er = Lt(void 0), _i = ({
       i === void 0 || a === void 0 || i.type === a.type && i.videoId === a.videoId && await n.setCurrentTime(0);
     }
   ), [e, n]), /* @__PURE__ */ o(er.Provider, { value: e, children: t });
-}, ai = () => st(er), tr = 81, si = Y(
+}, si = () => st(er), tr = 81, li = Y(
   ({ playerStore: t, playQueueStore: e }) => {
     const n = ie(), i = $(
       (f) => {
@@ -2068,7 +2068,7 @@ const er = Lt(void 0), _i = ({
       }
     );
   }
-), li = Z(
+), ci = Z(
   ({ button: t, isOpen: e, closePopover: n }) => {
     const [i, a] = q("0"), l = ie();
     Ar(() => {
@@ -2098,7 +2098,7 @@ const er = Lt(void 0), _i = ({
             alignItems: "center",
             children: [
               /* @__PURE__ */ o(
-                K,
+                G,
                 {
                   title: "Mute",
                   "aria-label": "Mute",
@@ -2124,7 +2124,7 @@ const er = Lt(void 0), _i = ({
       }
     );
   }
-), ci = Z(
+), ui = Z(
   ({
     playQueueStore: t,
     closePopover: e
@@ -2200,7 +2200,7 @@ const er = Lt(void 0), _i = ({
     );
     return /* @__PURE__ */ o(Xr, { initialPanelId: 0, panels: m });
   }
-), ui = Z(
+), fi = Z(
   ({
     playQueueStore: t,
     button: e,
@@ -2215,7 +2215,7 @@ const er = Lt(void 0), _i = ({
       panelPaddingSize: "none",
       anchorPosition: "upRight",
       children: /* @__PURE__ */ o(
-        ci,
+        ui,
         {
           playQueueStore: t,
           closePopover: i
@@ -2223,11 +2223,11 @@ const er = Lt(void 0), _i = ({
       )
     }
   )
-), fi = {
+), di = {
   [R.Off]: un,
   [R.All]: cn,
   [R.One]: ln
-}, di = Y(
+}, mi = Y(
   ({
     playerStore: t,
     playQueueStore: e
@@ -2248,7 +2248,7 @@ const er = Lt(void 0), _i = ({
         alignItems: "center",
         children: [
           /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: `Shuffle: ${e.shuffle ? "On" : "Off"}`,
               "aria-label": `Shuffle: ${e.shuffle ? "On" : "Off"}`,
@@ -2260,7 +2260,7 @@ const er = Lt(void 0), _i = ({
             }
           ),
           /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: "Previous",
               "aria-label": "Previous",
@@ -2272,7 +2272,7 @@ const er = Lt(void 0), _i = ({
             }
           ),
           t.playing ? /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: "Pause",
               "aria-label": "Pause",
@@ -2283,7 +2283,7 @@ const er = Lt(void 0), _i = ({
               disabled: !e.canPlay
             }
           ) : /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: "Play",
               "aria-label": "Play",
@@ -2295,7 +2295,7 @@ const er = Lt(void 0), _i = ({
             }
           ),
           /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: "Next",
               "aria-label": "Next",
@@ -2307,11 +2307,11 @@ const er = Lt(void 0), _i = ({
             }
           ),
           /* @__PURE__ */ o(
-            K,
+            G,
             {
               title: `Repeat: ${e.repeat === R.All ? "All" : e.repeat === R.One ? "One" : "Off"}`,
               "aria-label": `Repeat: ${e.repeat === R.All ? "All" : e.repeat === R.One ? "One" : "Off"}`,
-              iconType: fi[e.repeat],
+              iconType: di[e.repeat],
               size: "s",
               iconSize: "l",
               onClick: e.toggleRepeat
@@ -2321,13 +2321,13 @@ const er = Lt(void 0), _i = ({
       }
     );
   }
-), mi = Z(() => {
+), hi = Z(() => {
   const [t, e] = q(!1);
   return /* @__PURE__ */ o(
-    li,
+    ci,
     {
       button: /* @__PURE__ */ o(
-        K,
+        G,
         {
           title: "Volume",
           "aria-label": "Volume",
@@ -2341,15 +2341,27 @@ const er = Lt(void 0), _i = ({
       closePopover: () => e(!1)
     }
   );
-}), hi = Z(
+}), vi = ({
+  onClickPlayQueueButton: t
+}) => /* @__PURE__ */ o(
+  G,
+  {
+    title: "Play queue",
+    "aria-label": "Play queue",
+    iconType: yn,
+    size: "s",
+    iconSize: "l",
+    onClick: t
+  }
+), pi = Z(
   ({ playQueueStore: t }) => {
     const [e, n] = q(!1);
     return /* @__PURE__ */ o(
-      ui,
+      fi,
       {
         playQueueStore: t,
         button: /* @__PURE__ */ o(
-          K,
+          G,
           {
             title: "More options",
             "aria-label": "More options",
@@ -2364,8 +2376,11 @@ const er = Lt(void 0), _i = ({
       }
     );
   }
-), vi = Z(
-  ({ playQueueStore: t }) => /* @__PURE__ */ F(
+), yi = Z(
+  ({
+    playQueueStore: t,
+    onClickPlayQueueButton: e
+  }) => /* @__PURE__ */ F(
     me,
     {
       responsive: !1,
@@ -2373,33 +2388,44 @@ const er = Lt(void 0), _i = ({
       justifyContent: "flexEnd",
       alignItems: "center",
       children: [
-        /* @__PURE__ */ o(mi, {}),
-        /* @__PURE__ */ o(hi, { playQueueStore: t })
+        /* @__PURE__ */ o(hi, {}),
+        e && /* @__PURE__ */ o(
+          vi,
+          {
+            onClickPlayQueueButton: e
+          }
+        ),
+        /* @__PURE__ */ o(pi, { playQueueStore: t })
       ]
     }
   )
-), Ai = Y(
-  ({ playerStore: t, playQueueStore: e }) => /* @__PURE__ */ o(Zr, { paddingSize: "s", children: /* @__PURE__ */ F(me, { direction: "column", gutterSize: "none", children: [
-    /* @__PURE__ */ o(G, { children: /* @__PURE__ */ o(
-      si,
+), Mi = Y(
+  ({
+    playerStore: t,
+    playQueueStore: e,
+    onClickPlayQueueButton: n
+  }) => /* @__PURE__ */ o(Zr, { paddingSize: "s", children: /* @__PURE__ */ F(me, { direction: "column", gutterSize: "none", children: [
+    /* @__PURE__ */ o(J, { children: /* @__PURE__ */ o(
+      li,
       {
         playerStore: t,
         playQueueStore: e
       }
     ) }),
-    /* @__PURE__ */ o(G, { children: /* @__PURE__ */ F(me, { responsive: !1, children: [
-      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" } }),
-      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
-        di,
+    /* @__PURE__ */ o(J, { children: /* @__PURE__ */ F(me, { responsive: !1, children: [
+      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" } }),
+      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
+        mi,
         {
           playerStore: t,
           playQueueStore: e
         }
       ) }),
-      /* @__PURE__ */ o(G, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
-        vi,
+      /* @__PURE__ */ o(J, { css: { width: "calc(100% / 3)" }, children: /* @__PURE__ */ o(
+        yi,
         {
-          playQueueStore: e
+          playQueueStore: e,
+          onClickPlayQueueButton: n
         }
       ) })
     ] }) })
@@ -2407,7 +2433,7 @@ const er = Lt(void 0), _i = ({
 ), at = {
   width: 16 * 25,
   height: 9 * 25
-}, ki = Y(
+}, Fi = Y(
   ({ playerStore: t, playQueueStore: e }) => {
     const n = ie(), i = $(async () => {
       e.interacted && await n.play();
@@ -2456,7 +2482,7 @@ const er = Lt(void 0), _i = ({
           flexDirection: "column"
         },
         children: /* @__PURE__ */ o("div", { css: { flexGrow: 1, backgroundColor: "black" }, children: e.currentItem && /* @__PURE__ */ o(
-          gn,
+          bn,
           {
             src: e.currentItem.url,
             options: l
@@ -2465,9 +2491,9 @@ const er = Lt(void 0), _i = ({
       }
     );
   }
-), Mi = Y(
+), ji = Y(
   ({ children: t }) => {
-    const e = ai();
+    const e = si();
     return /* @__PURE__ */ F(
       nt,
       {
@@ -2483,7 +2509,7 @@ const er = Lt(void 0), _i = ({
     );
   }
 );
-class pi {
+class gi {
   constructor(e) {
     U(this, "playing", !1);
     U(this, "percent", 0);
@@ -2523,27 +2549,27 @@ class pi {
     e !== void 0 && (this.seeking || (this.percent = e));
   }
 }
-const rr = Lt(void 0), Fi = ({
+const rr = Lt(void 0), Ni = ({
   children: t
 }) => {
   const [e] = q(
-    () => new pi(new Gt())
+    () => new gi(new Gt())
   );
   return /* @__PURE__ */ o(rr.Provider, { value: e, children: t });
-}, ji = () => st(rr);
+}, $i = () => st(rr);
 export {
-  Ai as BottomBar,
-  Oi as HydrangeanDiva,
-  Mi as MediaPlayerLayout,
-  ki as MiniPlayer,
+  Mi as BottomBar,
+  Ai as HydrangeanDiva,
+  ji as MediaPlayerLayout,
+  Fi as MiniPlayer,
   Gt as MobXObservableStateProvider,
-  wi as ObservableStateProvider,
-  _i as PlayQueueStoreProvider,
-  Fi as PlayerStoreProvider,
+  _i as ObservableStateProvider,
+  ki as PlayQueueStoreProvider,
+  Ni as PlayerStoreProvider,
   R as RepeatMode,
   tr as bottomBarHeight,
   at as miniPlayerSize,
-  ai as usePlayQueueStore,
-  ji as usePlayerStore
+  si as usePlayQueueStore,
+  $i as usePlayerStore
 };
 //# sourceMappingURL=index.es.js.map