Этот скрипт недоступен для установки пользователем. Он является библиотекой, которая подключается к другим скриптам мета-ключом // @require https://update.sleazyfork.org/scripts/492591/1360875/pixareafun%20picture%20overlay.js
// ==UserScript==
// @name pixarea.fun picture overlay
// @namespace http://tampermonkey.net/
// @version V2.0
// @description pixarea.fun overley system script
// @author d0064
// @require https://update.greasyfork.org/scripts/492591/1360873/pixareafun%20picture%20overlay.js
// @match https://pixarea.fun/
// @icon https://www.google.com/s2/favicons?sz=64&domain=ngrok-free.app
// @grant none
// ==/UserScript==
function _mergeNamespaces(n, m) {s
for (var i = 0; i < m.length; i++) {
const e = m[i];
if (typeof e !== 'string' && !Array.isArray(e)) { for (const k in e) {
if (k !== 'default' && !(k in n)) {
const d = Object.getOwnPropertyDescriptor(e, k);
if (d) {
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: () => e[k]
});
}
}
} }
}
return Object.freeze(Object.defineProperty(n, Symbol.toStringTag, { value: 'Module' }));
}
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
function getDefaultExportFromCjs(x) {
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
}
function getAugmentedNamespace(n) {
if (n.__esModule) return n;
var f = n.default;
if (typeof f == "function") {
var a = function a() {
if (this instanceof a) {
var args = [null];
args.push.apply(args, arguments);
var Ctor = Function.bind.apply(f, args);
return new Ctor();
}
return f.apply(this, arguments);
};
a.prototype = f.prototype;
} else a = {};
Object.defineProperty(a, '__esModule', {
value: true
});
Object.keys(n).forEach(function (k) {
var d = Object.getOwnPropertyDescriptor(n, k);
Object.defineProperty(a, k, d.get ? d : {
enumerable: true,
get: function () {
return n[k];
}
});
});
return a;
}
var jsxRuntimeExports = {};
var jsxRuntime$1 = {
get exports(){ return jsxRuntimeExports; },
set exports(v){ jsxRuntimeExports = v; },
};
var reactJsxRuntime_production_min = {};
var reactExports = {};
var react = {
get exports(){ return reactExports; },
set exports(v){ reactExports = v; },
};
var react_production_min = {};
/**
* @license React
* react.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var l$5=Symbol.for("react.element"),n$6=Symbol.for("react.portal"),p$7=Symbol.for("react.fragment"),q$6=Symbol.for("react.strict_mode"),r$5=Symbol.for("react.profiler"),t$5=Symbol.for("react.provider"),u$4=Symbol.for("react.context"),v$5=Symbol.for("react.forward_ref"),w$3=Symbol.for("react.suspense"),x$2=Symbol.for("react.memo"),y$2=Symbol.for("react.lazy"),z$3=Symbol.iterator;function A$3(a){if(null===a||"object"!==typeof a)return null;a=z$3&&a[z$3]||a["@@iterator"];return "function"===typeof a?a:null}
var B$2={isMounted:function(){return !1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},C$1=Object.assign,D$2={};function E$2(a,b,e){this.props=a;this.context=b;this.refs=D$2;this.updater=e||B$2;}E$2.prototype.isReactComponent={};
E$2.prototype.setState=function(a,b){if("object"!==typeof a&&"function"!==typeof a&&null!=a)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,a,b,"setState");};E$2.prototype.forceUpdate=function(a){this.updater.enqueueForceUpdate(this,a,"forceUpdate");};function F$1(){}F$1.prototype=E$2.prototype;function G$2(a,b,e){this.props=a;this.context=b;this.refs=D$2;this.updater=e||B$2;}var H$2=G$2.prototype=new F$1;
H$2.constructor=G$2;C$1(H$2,E$2.prototype);H$2.isPureReactComponent=!0;var I$2=Array.isArray,J=Object.prototype.hasOwnProperty,K$1={current:null},L$2={key:!0,ref:!0,__self:!0,__source:!0};
function M$2(a,b,e){var d,c={},k=null,h=null;if(null!=b)for(d in void 0!==b.ref&&(h=b.ref),void 0!==b.key&&(k=""+b.key),b)J.call(b,d)&&!L$2.hasOwnProperty(d)&&(c[d]=b[d]);var g=arguments.length-2;if(1===g)c.children=e;else if(1<g){for(var f=Array(g),m=0;m<g;m++)f[m]=arguments[m+2];c.children=f;}if(a&&a.defaultProps)for(d in g=a.defaultProps,g)void 0===c[d]&&(c[d]=g[d]);return {$$typeof:l$5,type:a,key:k,ref:h,props:c,_owner:K$1.current}}
function N$2(a,b){return {$$typeof:l$5,type:a.type,key:b,ref:a.ref,props:a.props,_owner:a._owner}}function O$2(a){return "object"===typeof a&&null!==a&&a.$$typeof===l$5}function escape(a){var b={"=":"=0",":":"=2"};return "$"+a.replace(/[=:]/g,function(a){return b[a]})}var P$2=/\/+/g;function Q$2(a,b){return "object"===typeof a&&null!==a&&null!=a.key?escape(""+a.key):b.toString(36)}
function R$2(a,b,e,d,c){var k=typeof a;if("undefined"===k||"boolean"===k)a=null;var h=!1;if(null===a)h=!0;else switch(k){case "string":case "number":h=!0;break;case "object":switch(a.$$typeof){case l$5:case n$6:h=!0;}}if(h)return h=a,c=c(h),a=""===d?"."+Q$2(h,0):d,I$2(c)?(e="",null!=a&&(e=a.replace(P$2,"$&/")+"/"),R$2(c,b,e,"",function(a){return a})):null!=c&&(O$2(c)&&(c=N$2(c,e+(!c.key||h&&h.key===c.key?"":(""+c.key).replace(P$2,"$&/")+"/")+a)),b.push(c)),1;h=0;d=""===d?".":d+":";if(I$2(a))for(var g=0;g<a.length;g++){k=
a[g];var f=d+Q$2(k,g);h+=R$2(k,b,e,f,c);}else if(f=A$3(a),"function"===typeof f)for(a=f.call(a),g=0;!(k=a.next()).done;)k=k.value,f=d+Q$2(k,g++),h+=R$2(k,b,e,f,c);else if("object"===k)throw b=String(a),Error("Objects are not valid as a React child (found: "+("[object Object]"===b?"object with keys {"+Object.keys(a).join(", ")+"}":b)+"). If you meant to render a collection of children, use an array instead.");return h}
function S$2(a,b,e){if(null==a)return a;var d=[],c=0;R$2(a,d,"","",function(a){return b.call(e,a,c++)});return d}function T$1(a){if(-1===a._status){var b=a._result;b=b();b.then(function(b){if(0===a._status||-1===a._status)a._status=1,a._result=b;},function(b){if(0===a._status||-1===a._status)a._status=2,a._result=b;});-1===a._status&&(a._status=0,a._result=b);}if(1===a._status)return a._result.default;throw a._result;}
var U$2={current:null},V$1={transition:null},W$2={ReactCurrentDispatcher:U$2,ReactCurrentBatchConfig:V$1,ReactCurrentOwner:K$1};react_production_min.Children={map:S$2,forEach:function(a,b,e){S$2(a,function(){b.apply(this,arguments);},e);},count:function(a){var b=0;S$2(a,function(){b++;});return b},toArray:function(a){return S$2(a,function(a){return a})||[]},only:function(a){if(!O$2(a))throw Error("React.Children.only expected to receive a single React element child.");return a}};react_production_min.Component=E$2;react_production_min.Fragment=p$7;
react_production_min.Profiler=r$5;react_production_min.PureComponent=G$2;react_production_min.StrictMode=q$6;react_production_min.Suspense=w$3;react_production_min.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=W$2;
react_production_min.cloneElement=function(a,b,e){if(null===a||void 0===a)throw Error("React.cloneElement(...): The argument must be a React element, but you passed "+a+".");var d=C$1({},a.props),c=a.key,k=a.ref,h=a._owner;if(null!=b){void 0!==b.ref&&(k=b.ref,h=K$1.current);void 0!==b.key&&(c=""+b.key);if(a.type&&a.type.defaultProps)var g=a.type.defaultProps;for(f in b)J.call(b,f)&&!L$2.hasOwnProperty(f)&&(d[f]=void 0===b[f]&&void 0!==g?g[f]:b[f]);}var f=arguments.length-2;if(1===f)d.children=e;else if(1<f){g=Array(f);
for(var m=0;m<f;m++)g[m]=arguments[m+2];d.children=g;}return {$$typeof:l$5,type:a.type,key:c,ref:k,props:d,_owner:h}};react_production_min.createContext=function(a){a={$$typeof:u$4,_currentValue:a,_currentValue2:a,_threadCount:0,Provider:null,Consumer:null,_defaultValue:null,_globalName:null};a.Provider={$$typeof:t$5,_context:a};return a.Consumer=a};react_production_min.createElement=M$2;react_production_min.createFactory=function(a){var b=M$2.bind(null,a);b.type=a;return b};react_production_min.createRef=function(){return {current:null}};
react_production_min.forwardRef=function(a){return {$$typeof:v$5,render:a}};react_production_min.isValidElement=O$2;react_production_min.lazy=function(a){return {$$typeof:y$2,_payload:{_status:-1,_result:a},_init:T$1}};react_production_min.memo=function(a,b){return {$$typeof:x$2,type:a,compare:void 0===b?null:b}};react_production_min.startTransition=function(a){var b=V$1.transition;V$1.transition={};try{a();}finally{V$1.transition=b;}};react_production_min.unstable_act=function(){throw Error("act(...) is not supported in production builds of React.");};
react_production_min.useCallback=function(a,b){return U$2.current.useCallback(a,b)};react_production_min.useContext=function(a){return U$2.current.useContext(a)};react_production_min.useDebugValue=function(){};react_production_min.useDeferredValue=function(a){return U$2.current.useDeferredValue(a)};react_production_min.useEffect=function(a,b){return U$2.current.useEffect(a,b)};react_production_min.useId=function(){return U$2.current.useId()};react_production_min.useImperativeHandle=function(a,b,e){return U$2.current.useImperativeHandle(a,b,e)};
react_production_min.useInsertionEffect=function(a,b){return U$2.current.useInsertionEffect(a,b)};react_production_min.useLayoutEffect=function(a,b){return U$2.current.useLayoutEffect(a,b)};react_production_min.useMemo=function(a,b){return U$2.current.useMemo(a,b)};react_production_min.useReducer=function(a,b,e){return U$2.current.useReducer(a,b,e)};react_production_min.useRef=function(a){return U$2.current.useRef(a)};react_production_min.useState=function(a){return U$2.current.useState(a)};react_production_min.useSyncExternalStore=function(a,b,e){return U$2.current.useSyncExternalStore(a,b,e)};
react_production_min.useTransition=function(){return U$2.current.useTransition()};react_production_min.version="18.2.0";
(function (module) {
{
module.exports = react_production_min;
}
} (react));
const React = /*@__PURE__*/getDefaultExportFromCjs(reactExports);
const React$1 = /*#__PURE__*/_mergeNamespaces({
__proto__: null,
default: React
}, [reactExports]);
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var f$3=reactExports,k$4=Symbol.for("react.element"),l$4=Symbol.for("react.fragment"),m$5=Object.prototype.hasOwnProperty,n$5=f$3.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p$6={key:!0,ref:!0,__self:!0,__source:!0};
function q$5(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=""+g);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m$5.call(a,b)&&!p$6.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return {$$typeof:k$4,type:c,key:e,ref:h,props:d,_owner:n$5.current}}reactJsxRuntime_production_min.Fragment=l$4;reactJsxRuntime_production_min.jsx=q$5;reactJsxRuntime_production_min.jsxs=q$5;
(function (module) {
{
module.exports = reactJsxRuntime_production_min;
}
} (jsxRuntime$1));
const Fragment = jsxRuntimeExports.Fragment;
const jsx = jsxRuntimeExports.jsx;
const jsxs = jsxRuntimeExports.jsxs;
const jsxRuntime = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
__proto__: null,
Fragment,
jsx,
jsxs
}, Symbol.toStringTag, { value: 'Module' }));
const window$1 = typeof globalThis.window !== "undefined" ? globalThis.window : void 0;
const logger = {
isLogLevelEnabled(level) {
if (typeof window$1 === "undefined")
return true;
if (typeof window$1.logLevel === "number") {
return window$1.logLevel >= level;
}
window$1.logLevel = 0;
return level <= 0;
},
log(a, ...args) {
if (logger.isLogLevelEnabled(2 /* info */)) {
console.log(a, ...args);
}
},
logWarn(a, ...args) {
if (logger.isLogLevelEnabled(1 /* warn */)) {
console.warn(a, ...args);
}
},
logError(a, ...args) {
if (logger.isLogLevelEnabled(0 /* error */)) {
console.error(a, ...args);
}
}
};
function n$4(n){for(var r=arguments.length,t=Array(r>1?r-1:0),e=1;e<r;e++)t[e-1]=arguments[e];throw Error("[Immer] minified error nr: "+n+(t.length?" "+t.map((function(n){return "'"+n+"'"})).join(","):"")+". Find the full error at: https://bit.ly/3cXEKWf")}function r$4(n){return !!n&&!!n[Q$1]}function t$4(n){var r;return !!n&&(function(n){if(!n||"object"!=typeof n)return !1;var r=Object.getPrototypeOf(n);if(null===r)return !0;var t=Object.hasOwnProperty.call(r,"constructor")&&r.constructor;return t===Object||"function"==typeof t&&Function.toString.call(t)===Z$1}(n)||Array.isArray(n)||!!n[L$1]||!!(null===(r=n.constructor)||void 0===r?void 0:r[L$1])||s(n)||v$4(n))}function i(n,r,t){void 0===t&&(t=!1),0===o(n)?(t?Object.keys:nn)(n).forEach((function(e){t&&"symbol"==typeof e||r(e,n[e],n);})):n.forEach((function(t,e){return r(e,t,n)}));}function o(n){var r=n[Q$1];return r?r.i>3?r.i-4:r.i:Array.isArray(n)?1:s(n)?2:v$4(n)?3:0}function u$3(n,r){return 2===o(n)?n.has(r):Object.prototype.hasOwnProperty.call(n,r)}function a(n,r){return 2===o(n)?n.get(r):n[r]}function f$2(n,r,t){var e=o(n);2===e?n.set(r,t):3===e?n.add(t):n[r]=t;}function c$2(n,r){return n===r?0!==n||1/n==1/r:n!=n&&r!=r}function s(n){return X$1&&n instanceof Map}function v$4(n){return q$4&&n instanceof Set}function p$5(n){return n.o||n.t}function l$3(n){if(Array.isArray(n))return Array.prototype.slice.call(n);var r=rn(n);delete r[Q$1];for(var t=nn(r),e=0;e<t.length;e++){var i=t[e],o=r[i];!1===o.writable&&(o.writable=!0,o.configurable=!0),(o.get||o.set)&&(r[i]={configurable:!0,writable:!0,enumerable:o.enumerable,value:n[i]});}return Object.create(Object.getPrototypeOf(n),r)}function d$2(n,e){return void 0===e&&(e=!1),y$1(n)||r$4(n)||!t$4(n)||(o(n)>1&&(n.set=n.add=n.clear=n.delete=h$4),Object.freeze(n),e&&i(n,(function(n,r){return d$2(r,!0)}),!0)),n}function h$4(){n$4(2);}function y$1(n){return null==n||"object"!=typeof n||Object.isFrozen(n)}function b$2(r){var t=tn[r];return t||n$4(18,r),t}function m$4(n,r){tn[n]||(tn[n]=r);}function _$1(){return U$1}function j(n,r){r&&(b$2("Patches"),n.u=[],n.s=[],n.v=r);}function O$1(n){g$2(n),n.p.forEach(S$1),n.p=null;}function g$2(n){n===U$1&&(U$1=n.l);}function w$2(n){return U$1={p:[],l:U$1,h:n,m:!0,_:0}}function S$1(n){var r=n[Q$1];0===r.i||1===r.i?r.j():r.O=!0;}function P$1(r,e){e._=e.p.length;var i=e.p[0],o=void 0!==r&&r!==i;return e.h.g||b$2("ES5").S(e,r,o),o?(i[Q$1].P&&(O$1(e),n$4(4)),t$4(r)&&(r=M$1(e,r),e.l||x$1(e,r)),e.u&&b$2("Patches").M(i[Q$1].t,r,e.u,e.s)):r=M$1(e,i,[]),O$1(e),e.u&&e.v(e.u,e.s),r!==H$1?r:void 0}function M$1(n,r,t){if(y$1(r))return r;var e=r[Q$1];if(!e)return i(r,(function(i,o){return A$2(n,e,r,i,o,t)}),!0),r;if(e.A!==n)return r;if(!e.P)return x$1(n,e.t,!0),e.t;if(!e.I){e.I=!0,e.A._--;var o=4===e.i||5===e.i?e.o=l$3(e.k):e.o,u=o,a=!1;3===e.i&&(u=new Set(o),o.clear(),a=!0),i(u,(function(r,i){return A$2(n,e,o,r,i,t,a)})),x$1(n,o,!1),t&&n.u&&b$2("Patches").N(e,t,n.u,n.s);}return e.o}function A$2(e,i,o,a,c,s,v){if(r$4(c)){var p=M$1(e,c,s&&i&&3!==i.i&&!u$3(i.R,a)?s.concat(a):void 0);if(f$2(o,a,p),!r$4(p))return;e.m=!1;}else v&&o.add(c);if(t$4(c)&&!y$1(c)){if(!e.h.D&&e._<1)return;M$1(e,c),i&&i.A.l||x$1(e,c);}}function x$1(n,r,t){void 0===t&&(t=!1),!n.l&&n.h.D&&n.m&&d$2(r,t);}function z$2(n,r){var t=n[Q$1];return (t?p$5(t):n)[r]}function I$1(n,r){if(r in n)for(var t=Object.getPrototypeOf(n);t;){var e=Object.getOwnPropertyDescriptor(t,r);if(e)return e;t=Object.getPrototypeOf(t);}}function k$3(n){n.P||(n.P=!0,n.l&&k$3(n.l));}function E$1(n){n.o||(n.o=l$3(n.t));}function N$1(n,r,t){var e=s(r)?b$2("MapSet").F(r,t):v$4(r)?b$2("MapSet").T(r,t):n.g?function(n,r){var t=Array.isArray(n),e={i:t?1:0,A:r?r.A:_$1(),P:!1,I:!1,R:{},l:r,t:n,k:null,o:null,j:null,C:!1},i=e,o=en;t&&(i=[e],o=on);var u=Proxy.revocable(i,o),a=u.revoke,f=u.proxy;return e.k=f,e.j=a,f}(r,t):b$2("ES5").J(r,t);return (t?t.A:_$1()).p.push(e),e}function R$1(e){return r$4(e)||n$4(22,e),function n(r){if(!t$4(r))return r;var e,u=r[Q$1],c=o(r);if(u){if(!u.P&&(u.i<4||!b$2("ES5").K(u)))return u.t;u.I=!0,e=D$1(r,c),u.I=!1;}else e=D$1(r,c);return i(e,(function(r,t){u&&a(u.t,r)===t||f$2(e,r,n(t));})),3===c?new Set(e):e}(e)}function D$1(n,r){switch(r){case 2:return new Map(n);case 3:return Array.from(n)}return l$3(n)}function F(){function t(n,r){var t=s[n];return t?t.enumerable=r:s[n]=t={configurable:!0,enumerable:r,get:function(){var r=this[Q$1];return en.get(r,n)},set:function(r){var t=this[Q$1];en.set(t,n,r);}},t}function e(n){for(var r=n.length-1;r>=0;r--){var t=n[r][Q$1];if(!t.P)switch(t.i){case 5:a(t)&&k$3(t);break;case 4:o(t)&&k$3(t);}}}function o(n){for(var r=n.t,t=n.k,e=nn(t),i=e.length-1;i>=0;i--){var o=e[i];if(o!==Q$1){var a=r[o];if(void 0===a&&!u$3(r,o))return !0;var f=t[o],s=f&&f[Q$1];if(s?s.t!==a:!c$2(f,a))return !0}}var v=!!r[Q$1];return e.length!==nn(r).length+(v?0:1)}function a(n){var r=n.k;if(r.length!==n.t.length)return !0;var t=Object.getOwnPropertyDescriptor(r,r.length-1);if(t&&!t.get)return !0;for(var e=0;e<r.length;e++)if(!r.hasOwnProperty(e))return !0;return !1}var s={};m$4("ES5",{J:function(n,r){var e=Array.isArray(n),i=function(n,r){if(n){for(var e=Array(r.length),i=0;i<r.length;i++)Object.defineProperty(e,""+i,t(i,!0));return e}var o=rn(r);delete o[Q$1];for(var u=nn(o),a=0;a<u.length;a++){var f=u[a];o[f]=t(f,n||!!o[f].enumerable);}return Object.create(Object.getPrototypeOf(r),o)}(e,n),o={i:e?5:4,A:r?r.A:_$1(),P:!1,I:!1,R:{},l:r,t:n,k:i,o:null,O:!1,C:!1};return Object.defineProperty(i,Q$1,{value:o,writable:!0}),i},S:function(n,t,o){o?r$4(t)&&t[Q$1].A===n&&e(n.p):(n.u&&function n(r){if(r&&"object"==typeof r){var t=r[Q$1];if(t){var e=t.t,o=t.k,f=t.R,c=t.i;if(4===c)i(o,(function(r){r!==Q$1&&(void 0!==e[r]||u$3(e,r)?f[r]||n(o[r]):(f[r]=!0,k$3(t)));})),i(e,(function(n){void 0!==o[n]||u$3(o,n)||(f[n]=!1,k$3(t));}));else if(5===c){if(a(t)&&(k$3(t),f.length=!0),o.length<e.length)for(var s=o.length;s<e.length;s++)f[s]=!1;else for(var v=e.length;v<o.length;v++)f[v]=!0;for(var p=Math.min(o.length,e.length),l=0;l<p;l++)o.hasOwnProperty(l)||(f[l]=!0),void 0===f[l]&&n(o[l]);}}}}(n.p[0]),e(n.p));},K:function(n){return 4===n.i?o(n):a(n)}});}var G$1,U$1,W$1="undefined"!=typeof Symbol&&"symbol"==typeof Symbol("x"),X$1="undefined"!=typeof Map,q$4="undefined"!=typeof Set,B$1="undefined"!=typeof Proxy&&void 0!==Proxy.revocable&&"undefined"!=typeof Reflect,H$1=W$1?Symbol.for("immer-nothing"):((G$1={})["immer-nothing"]=!0,G$1),L$1=W$1?Symbol.for("immer-draftable"):"__$immer_draftable",Q$1=W$1?Symbol.for("immer-state"):"__$immer_state",Z$1=""+Object.prototype.constructor,nn="undefined"!=typeof Reflect&&Reflect.ownKeys?Reflect.ownKeys:void 0!==Object.getOwnPropertySymbols?function(n){return Object.getOwnPropertyNames(n).concat(Object.getOwnPropertySymbols(n))}:Object.getOwnPropertyNames,rn=Object.getOwnPropertyDescriptors||function(n){var r={};return nn(n).forEach((function(t){r[t]=Object.getOwnPropertyDescriptor(n,t);})),r},tn={},en={get:function(n,r){if(r===Q$1)return n;var e=p$5(n);if(!u$3(e,r))return function(n,r,t){var e,i=I$1(r,t);return i?"value"in i?i.value:null===(e=i.get)||void 0===e?void 0:e.call(n.k):void 0}(n,e,r);var i=e[r];return n.I||!t$4(i)?i:i===z$2(n.t,r)?(E$1(n),n.o[r]=N$1(n.A.h,i,n)):i},has:function(n,r){return r in p$5(n)},ownKeys:function(n){return Reflect.ownKeys(p$5(n))},set:function(n,r,t){var e=I$1(p$5(n),r);if(null==e?void 0:e.set)return e.set.call(n.k,t),!0;if(!n.P){var i=z$2(p$5(n),r),o=null==i?void 0:i[Q$1];if(o&&o.t===t)return n.o[r]=t,n.R[r]=!1,!0;if(c$2(t,i)&&(void 0!==t||u$3(n.t,r)))return !0;E$1(n),k$3(n);}return n.o[r]===t&&(void 0!==t||r in n.o)||Number.isNaN(t)&&Number.isNaN(n.o[r])||(n.o[r]=t,n.R[r]=!0),!0},deleteProperty:function(n,r){return void 0!==z$2(n.t,r)||r in n.t?(n.R[r]=!1,E$1(n),k$3(n)):delete n.R[r],n.o&&delete n.o[r],!0},getOwnPropertyDescriptor:function(n,r){var t=p$5(n),e=Reflect.getOwnPropertyDescriptor(t,r);return e?{writable:!0,configurable:1!==n.i||"length"!==r,enumerable:e.enumerable,value:t[r]}:e},defineProperty:function(){n$4(11);},getPrototypeOf:function(n){return Object.getPrototypeOf(n.t)},setPrototypeOf:function(){n$4(12);}},on={};i(en,(function(n,r){on[n]=function(){return arguments[0]=arguments[0][0],r.apply(this,arguments)};})),on.deleteProperty=function(r,t){return on.set.call(this,r,t,void 0)},on.set=function(r,t,e){return en.set.call(this,r[0],t,e,r[0])};var un=function(){function e(r){var e=this;this.g=B$1,this.D=!0,this.produce=function(r,i,o){if("function"==typeof r&&"function"!=typeof i){var u=i;i=r;var a=e;return function(n){var r=this;void 0===n&&(n=u);for(var t=arguments.length,e=Array(t>1?t-1:0),o=1;o<t;o++)e[o-1]=arguments[o];return a.produce(n,(function(n){var t;return (t=i).call.apply(t,[r,n].concat(e))}))}}var f;if("function"!=typeof i&&n$4(6),void 0!==o&&"function"!=typeof o&&n$4(7),t$4(r)){var c=w$2(e),s=N$1(e,r,void 0),v=!0;try{f=i(s),v=!1;}finally{v?O$1(c):g$2(c);}return "undefined"!=typeof Promise&&f instanceof Promise?f.then((function(n){return j(c,o),P$1(n,c)}),(function(n){throw O$1(c),n})):(j(c,o),P$1(f,c))}if(!r||"object"!=typeof r){if(void 0===(f=i(r))&&(f=r),f===H$1&&(f=void 0),e.D&&d$2(f,!0),o){var p=[],l=[];b$2("Patches").M(r,f,p,l),o(p,l);}return f}n$4(21,r);},this.produceWithPatches=function(n,r){if("function"==typeof n)return function(r){for(var t=arguments.length,i=Array(t>1?t-1:0),o=1;o<t;o++)i[o-1]=arguments[o];return e.produceWithPatches(r,(function(r){return n.apply(void 0,[r].concat(i))}))};var t,i,o=e.produce(n,r,(function(n,r){t=n,i=r;}));return "undefined"!=typeof Promise&&o instanceof Promise?o.then((function(n){return [n,t,i]})):[o,t,i]},"boolean"==typeof(null==r?void 0:r.useProxies)&&this.setUseProxies(r.useProxies),"boolean"==typeof(null==r?void 0:r.autoFreeze)&&this.setAutoFreeze(r.autoFreeze);}var i=e.prototype;return i.createDraft=function(e){t$4(e)||n$4(8),r$4(e)&&(e=R$1(e));var i=w$2(this),o=N$1(this,e,void 0);return o[Q$1].C=!0,g$2(i),o},i.finishDraft=function(r,t){var e=r&&r[Q$1];var i=e.A;return j(i,t),P$1(void 0,i)},i.setAutoFreeze=function(n){this.D=n;},i.setUseProxies=function(r){r&&!B$1&&n$4(20),this.g=r;},i.applyPatches=function(n,t){var e;for(e=t.length-1;e>=0;e--){var i=t[e];if(0===i.path.length&&"replace"===i.op){n=i.value;break}}e>-1&&(t=t.slice(e+1));var o=b$2("Patches").$;return r$4(n)?o(n,t):this.produce(n,(function(n){return o(n,t)}))},e}(),an=new un,fn=an.produce;an.produceWithPatches.bind(an);an.setAutoFreeze.bind(an);an.setUseProxies.bind(an);an.applyPatches.bind(an);an.createDraft.bind(an);an.finishDraft.bind(an);
function _typeof$2(obj) {
"@babel/helpers - typeof";
return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
}, _typeof$2(obj);
}
function _toPrimitive(input, hint) {
if (_typeof$2(input) !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (_typeof$2(res) !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return _typeof$2(key) === "symbol" ? key : String(key);
}
function _defineProperty$6(obj, key, value) {
key = _toPropertyKey(key);
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function ownKeys$5(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
enumerableOnly && (symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
})), keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = null != arguments[i] ? arguments[i] : {};
i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) {
_defineProperty$6(target, key, source[key]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
/**
* Adapted from React: https://github.com/facebook/react/blob/master/packages/shared/formatProdErrorMessage.js
*
* Do not require this module directly! Use normal throw error calls. These messages will be replaced with error codes
* during build.
* @param {number} code
*/
function formatProdErrorMessage(code) {
return "Minified Redux error #" + code + "; visit https://redux.js.org/Errors?code=" + code + " for the full message or " + 'use the non-minified dev environment for full errors. ';
}
// Inlined version of the `symbol-observable` polyfill
var $$observable = (function () {
return typeof Symbol === 'function' && Symbol.observable || '@@observable';
})();
/**
* These are private action types reserved by Redux.
* For any unknown actions, you must return the current state.
* If the current state is undefined, you must return the initial state.
* Do not reference these action types directly in your code.
*/
var randomString = function randomString() {
return Math.random().toString(36).substring(7).split('').join('.');
};
var ActionTypes = {
INIT: "@@redux/INIT" + randomString(),
REPLACE: "@@redux/REPLACE" + randomString(),
PROBE_UNKNOWN_ACTION: function PROBE_UNKNOWN_ACTION() {
return "@@redux/PROBE_UNKNOWN_ACTION" + randomString();
}
};
/**
* @param {any} obj The object to inspect.
* @returns {boolean} True if the argument appears to be a plain object.
*/
function isPlainObject$2(obj) {
if (typeof obj !== 'object' || obj === null) return false;
var proto = obj;
while (Object.getPrototypeOf(proto) !== null) {
proto = Object.getPrototypeOf(proto);
}
return Object.getPrototypeOf(obj) === proto;
}
/**
* @deprecated
*
* **We recommend using the `configureStore` method
* of the `@reduxjs/toolkit` package**, which replaces `createStore`.
*
* Redux Toolkit is our recommended approach for writing Redux logic today,
* including store setup, reducers, data fetching, and more.
*
* **For more details, please read this Redux docs page:**
* **https://redux.js.org/introduction/why-rtk-is-redux-today**
*
* `configureStore` from Redux Toolkit is an improved version of `createStore` that
* simplifies setup and helps avoid common bugs.
*
* You should not be using the `redux` core package by itself today, except for learning purposes.
* The `createStore` method from the core `redux` package will not be removed, but we encourage
* all users to migrate to using Redux Toolkit for all Redux code.
*
* If you want to use `createStore` without this visual deprecation warning, use
* the `legacy_createStore` import instead:
*
* `import { legacy_createStore as createStore} from 'redux'`
*
*/
function createStore(reducer, preloadedState, enhancer) {
var _ref2;
if (typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments[3] === 'function') {
throw new Error(formatProdErrorMessage(0) );
}
if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
enhancer = preloadedState;
preloadedState = undefined;
}
if (typeof enhancer !== 'undefined') {
if (typeof enhancer !== 'function') {
throw new Error(formatProdErrorMessage(1) );
}
return enhancer(createStore)(reducer, preloadedState);
}
if (typeof reducer !== 'function') {
throw new Error(formatProdErrorMessage(2) );
}
var currentReducer = reducer;
var currentState = preloadedState;
var currentListeners = [];
var nextListeners = currentListeners;
var isDispatching = false;
/**
* This makes a shallow copy of currentListeners so we can use
* nextListeners as a temporary list while dispatching.
*
* This prevents any bugs around consumers calling
* subscribe/unsubscribe in the middle of a dispatch.
*/
function ensureCanMutateNextListeners() {
if (nextListeners === currentListeners) {
nextListeners = currentListeners.slice();
}
}
/**
* Reads the state tree managed by the store.
*
* @returns {any} The current state tree of your application.
*/
function getState() {
if (isDispatching) {
throw new Error(formatProdErrorMessage(3) );
}
return currentState;
}
/**
* Adds a change listener. It will be called any time an action is dispatched,
* and some part of the state tree may potentially have changed. You may then
* call `getState()` to read the current state tree inside the callback.
*
* You may call `dispatch()` from a change listener, with the following
* caveats:
*
* 1. The subscriptions are snapshotted just before every `dispatch()` call.
* If you subscribe or unsubscribe while the listeners are being invoked, this
* will not have any effect on the `dispatch()` that is currently in progress.
* However, the next `dispatch()` call, whether nested or not, will use a more
* recent snapshot of the subscription list.
*
* 2. The listener should not expect to see all state changes, as the state
* might have been updated multiple times during a nested `dispatch()` before
* the listener is called. It is, however, guaranteed that all subscribers
* registered before the `dispatch()` started will be called with the latest
* state by the time it exits.
*
* @param {Function} listener A callback to be invoked on every dispatch.
* @returns {Function} A function to remove this change listener.
*/
function subscribe(listener) {
if (typeof listener !== 'function') {
throw new Error(formatProdErrorMessage(4) );
}
if (isDispatching) {
throw new Error(formatProdErrorMessage(5) );
}
var isSubscribed = true;
ensureCanMutateNextListeners();
nextListeners.push(listener);
return function unsubscribe() {
if (!isSubscribed) {
return;
}
if (isDispatching) {
throw new Error(formatProdErrorMessage(6) );
}
isSubscribed = false;
ensureCanMutateNextListeners();
var index = nextListeners.indexOf(listener);
nextListeners.splice(index, 1);
currentListeners = null;
};
}
/**
* Dispatches an action. It is the only way to trigger a state change.
*
* The `reducer` function, used to create the store, will be called with the
* current state tree and the given `action`. Its return value will
* be considered the **next** state of the tree, and the change listeners
* will be notified.
*
* The base implementation only supports plain object actions. If you want to
* dispatch a Promise, an Observable, a thunk, or something else, you need to
* wrap your store creating function into the corresponding middleware. For
* example, see the documentation for the `redux-thunk` package. Even the
* middleware will eventually dispatch plain object actions using this method.
*
* @param {Object} action A plain object representing “what changed”. It is
* a good idea to keep actions serializable so you can record and replay user
* sessions, or use the time travelling `redux-devtools`. An action must have
* a `type` property which may not be `undefined`. It is a good idea to use
* string constants for action types.
*
* @returns {Object} For convenience, the same action object you dispatched.
*
* Note that, if you use a custom middleware, it may wrap `dispatch()` to
* return something else (for example, a Promise you can await).
*/
function dispatch(action) {
if (!isPlainObject$2(action)) {
throw new Error(formatProdErrorMessage(7) );
}
if (typeof action.type === 'undefined') {
throw new Error(formatProdErrorMessage(8) );
}
if (isDispatching) {
throw new Error(formatProdErrorMessage(9) );
}
try {
isDispatching = true;
currentState = currentReducer(currentState, action);
} finally {
isDispatching = false;
}
var listeners = currentListeners = nextListeners;
for (var i = 0; i < listeners.length; i++) {
var listener = listeners[i];
listener();
}
return action;
}
/**
* Replaces the reducer currently used by the store to calculate the state.
*
* You might need this if your app implements code splitting and you want to
* load some of the reducers dynamically. You might also need this if you
* implement a hot reloading mechanism for Redux.
*
* @param {Function} nextReducer The reducer for the store to use instead.
* @returns {void}
*/
function replaceReducer(nextReducer) {
if (typeof nextReducer !== 'function') {
throw new Error(formatProdErrorMessage(10) );
}
currentReducer = nextReducer; // This action has a similiar effect to ActionTypes.INIT.
// Any reducers that existed in both the new and old rootReducer
// will receive the previous state. This effectively populates
// the new state tree with any relevant data from the old one.
dispatch({
type: ActionTypes.REPLACE
});
}
/**
* Interoperability point for observable/reactive libraries.
* @returns {observable} A minimal observable of state changes.
* For more information, see the observable proposal:
* https://github.com/tc39/proposal-observable
*/
function observable() {
var _ref;
var outerSubscribe = subscribe;
return _ref = {
/**
* The minimal observable subscription method.
* @param {Object} observer Any object that can be used as an observer.
* The observer object should have a `next` method.
* @returns {subscription} An object with an `unsubscribe` method that can
* be used to unsubscribe the observable from the store, and prevent further
* emission of values from the observable.
*/
subscribe: function subscribe(observer) {
if (typeof observer !== 'object' || observer === null) {
throw new Error(formatProdErrorMessage(11) );
}
function observeState() {
if (observer.next) {
observer.next(getState());
}
}
observeState();
var unsubscribe = outerSubscribe(observeState);
return {
unsubscribe: unsubscribe
};
}
}, _ref[$$observable] = function () {
return this;
}, _ref;
} // When a store is created, an "INIT" action is dispatched so that every
// reducer returns their initial state. This effectively populates
// the initial state tree.
dispatch({
type: ActionTypes.INIT
});
return _ref2 = {
dispatch: dispatch,
subscribe: subscribe,
getState: getState,
replaceReducer: replaceReducer
}, _ref2[$$observable] = observable, _ref2;
}
function assertReducerShape(reducers) {
Object.keys(reducers).forEach(function (key) {
var reducer = reducers[key];
var initialState = reducer(undefined, {
type: ActionTypes.INIT
});
if (typeof initialState === 'undefined') {
throw new Error(formatProdErrorMessage(12) );
}
if (typeof reducer(undefined, {
type: ActionTypes.PROBE_UNKNOWN_ACTION()
}) === 'undefined') {
throw new Error(formatProdErrorMessage(13) );
}
});
}
/**
* Turns an object whose values are different reducer functions, into a single
* reducer function. It will call every child reducer, and gather their results
* into a single state object, whose keys correspond to the keys of the passed
* reducer functions.
*
* @param {Object} reducers An object whose values correspond to different
* reducer functions that need to be combined into one. One handy way to obtain
* it is to use ES6 `import * as reducers` syntax. The reducers may never return
* undefined for any action. Instead, they should return their initial state
* if the state passed to them was undefined, and the current state for any
* unrecognized action.
*
* @returns {Function} A reducer function that invokes every reducer inside the
* passed object, and builds a state object with the same shape.
*/
function combineReducers(reducers) {
var reducerKeys = Object.keys(reducers);
var finalReducers = {};
for (var i = 0; i < reducerKeys.length; i++) {
var key = reducerKeys[i];
if (typeof reducers[key] === 'function') {
finalReducers[key] = reducers[key];
}
}
var finalReducerKeys = Object.keys(finalReducers); // This is used to make sure we don't warn about the same
var shapeAssertionError;
try {
assertReducerShape(finalReducers);
} catch (e) {
shapeAssertionError = e;
}
return function combination(state, action) {
if (state === void 0) {
state = {};
}
if (shapeAssertionError) {
throw shapeAssertionError;
}
var hasChanged = false;
var nextState = {};
for (var _i = 0; _i < finalReducerKeys.length; _i++) {
var _key = finalReducerKeys[_i];
var reducer = finalReducers[_key];
var previousStateForKey = state[_key];
var nextStateForKey = reducer(previousStateForKey, action);
if (typeof nextStateForKey === 'undefined') {
action && action.type;
throw new Error(formatProdErrorMessage(14) );
}
nextState[_key] = nextStateForKey;
hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
}
hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;
return hasChanged ? nextState : state;
};
}
/**
* Composes single-argument functions from right to left. The rightmost
* function can take multiple arguments as it provides the signature for
* the resulting composite function.
*
* @param {...Function} funcs The functions to compose.
* @returns {Function} A function obtained by composing the argument functions
* from right to left. For example, compose(f, g, h) is identical to doing
* (...args) => f(g(h(...args))).
*/
function compose$1() {
for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) {
funcs[_key] = arguments[_key];
}
if (funcs.length === 0) {
return function (arg) {
return arg;
};
}
if (funcs.length === 1) {
return funcs[0];
}
return funcs.reduce(function (a, b) {
return function () {
return a(b.apply(void 0, arguments));
};
});
}
/**
* Creates a store enhancer that applies middleware to the dispatch method
* of the Redux store. This is handy for a variety of tasks, such as expressing
* asynchronous actions in a concise manner, or logging every action payload.
*
* See `redux-thunk` package as an example of the Redux middleware.
*
* Because middleware is potentially asynchronous, this should be the first
* store enhancer in the composition chain.
*
* Note that each middleware will be given the `dispatch` and `getState` functions
* as named arguments.
*
* @param {...Function} middlewares The middleware chain to be applied.
* @returns {Function} A store enhancer applying the middleware.
*/
function applyMiddleware() {
for (var _len = arguments.length, middlewares = new Array(_len), _key = 0; _key < _len; _key++) {
middlewares[_key] = arguments[_key];
}
return function (createStore) {
return function () {
var store = createStore.apply(void 0, arguments);
var _dispatch = function dispatch() {
throw new Error(formatProdErrorMessage(15) );
};
var middlewareAPI = {
getState: store.getState,
dispatch: function dispatch() {
return _dispatch.apply(void 0, arguments);
}
};
var chain = middlewares.map(function (middleware) {
return middleware(middlewareAPI);
});
_dispatch = compose$1.apply(void 0, chain)(store.dispatch);
return _objectSpread2(_objectSpread2({}, store), {}, {
dispatch: _dispatch
});
};
};
}
// Cache implementation based on Erik Rasmussen's `lru-memoize`:
// https://github.com/erikras/lru-memoize
var NOT_FOUND = 'NOT_FOUND';
function createSingletonCache(equals) {
var entry;
return {
get: function get(key) {
if (entry && equals(entry.key, key)) {
return entry.value;
}
return NOT_FOUND;
},
put: function put(key, value) {
entry = {
key: key,
value: value
};
},
getEntries: function getEntries() {
return entry ? [entry] : [];
},
clear: function clear() {
entry = undefined;
}
};
}
function createLruCache(maxSize, equals) {
var entries = [];
function get(key) {
var cacheIndex = entries.findIndex(function (entry) {
return equals(key, entry.key);
}); // We found a cached entry
if (cacheIndex > -1) {
var entry = entries[cacheIndex]; // Cached entry not at top of cache, move it to the top
if (cacheIndex > 0) {
entries.splice(cacheIndex, 1);
entries.unshift(entry);
}
return entry.value;
} // No entry found in cache, return sentinel
return NOT_FOUND;
}
function put(key, value) {
if (get(key) === NOT_FOUND) {
// TODO Is unshift slow?
entries.unshift({
key: key,
value: value
});
if (entries.length > maxSize) {
entries.pop();
}
}
}
function getEntries() {
return entries;
}
function clear() {
entries = [];
}
return {
get: get,
put: put,
getEntries: getEntries,
clear: clear
};
}
var defaultEqualityCheck = function defaultEqualityCheck(a, b) {
return a === b;
};
function createCacheKeyComparator(equalityCheck) {
return function areArgumentsShallowlyEqual(prev, next) {
if (prev === null || next === null || prev.length !== next.length) {
return false;
} // Do this in a for loop (and not a `forEach` or an `every`) so we can determine equality as fast as possible.
var length = prev.length;
for (var i = 0; i < length; i++) {
if (!equalityCheck(prev[i], next[i])) {
return false;
}
}
return true;
};
}
// defaultMemoize now supports a configurable cache size with LRU behavior,
// and optional comparison of the result value with existing values
function defaultMemoize(func, equalityCheckOrOptions) {
var providedOptions = typeof equalityCheckOrOptions === 'object' ? equalityCheckOrOptions : {
equalityCheck: equalityCheckOrOptions
};
var _providedOptions$equa = providedOptions.equalityCheck,
equalityCheck = _providedOptions$equa === void 0 ? defaultEqualityCheck : _providedOptions$equa,
_providedOptions$maxS = providedOptions.maxSize,
maxSize = _providedOptions$maxS === void 0 ? 1 : _providedOptions$maxS,
resultEqualityCheck = providedOptions.resultEqualityCheck;
var comparator = createCacheKeyComparator(equalityCheck);
var cache = maxSize === 1 ? createSingletonCache(comparator) : createLruCache(maxSize, comparator); // we reference arguments instead of spreading them for performance reasons
function memoized() {
var value = cache.get(arguments);
if (value === NOT_FOUND) {
// @ts-ignore
value = func.apply(null, arguments);
if (resultEqualityCheck) {
var entries = cache.getEntries();
var matchingEntry = entries.find(function (entry) {
return resultEqualityCheck(entry.value, value);
});
if (matchingEntry) {
value = matchingEntry.value;
}
}
cache.put(arguments, value);
}
return value;
}
memoized.clearCache = function () {
return cache.clear();
};
return memoized;
}
function getDependencies(funcs) {
var dependencies = Array.isArray(funcs[0]) ? funcs[0] : funcs;
if (!dependencies.every(function (dep) {
return typeof dep === 'function';
})) {
var dependencyTypes = dependencies.map(function (dep) {
return typeof dep === 'function' ? "function " + (dep.name || 'unnamed') + "()" : typeof dep;
}).join(', ');
throw new Error("createSelector expects all input-selectors to be functions, but received the following types: [" + dependencyTypes + "]");
}
return dependencies;
}
function createSelectorCreator(memoize) {
for (var _len = arguments.length, memoizeOptionsFromArgs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
memoizeOptionsFromArgs[_key - 1] = arguments[_key];
}
var createSelector = function createSelector() {
for (var _len2 = arguments.length, funcs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
funcs[_key2] = arguments[_key2];
}
var _recomputations = 0;
var _lastResult; // Due to the intricacies of rest params, we can't do an optional arg after `...funcs`.
// So, start by declaring the default value here.
// (And yes, the words 'memoize' and 'options' appear too many times in this next sequence.)
var directlyPassedOptions = {
memoizeOptions: undefined
}; // Normally, the result func or "output selector" is the last arg
var resultFunc = funcs.pop(); // If the result func is actually an _object_, assume it's our options object
if (typeof resultFunc === 'object') {
directlyPassedOptions = resultFunc; // and pop the real result func off
resultFunc = funcs.pop();
}
if (typeof resultFunc !== 'function') {
throw new Error("createSelector expects an output function after the inputs, but received: [" + typeof resultFunc + "]");
} // Determine which set of options we're using. Prefer options passed directly,
// but fall back to options given to createSelectorCreator.
var _directlyPassedOption = directlyPassedOptions,
_directlyPassedOption2 = _directlyPassedOption.memoizeOptions,
memoizeOptions = _directlyPassedOption2 === void 0 ? memoizeOptionsFromArgs : _directlyPassedOption2; // Simplifying assumption: it's unlikely that the first options arg of the provided memoizer
// is an array. In most libs I've looked at, it's an equality function or options object.
// Based on that, if `memoizeOptions` _is_ an array, we assume it's a full
// user-provided array of options. Otherwise, it must be just the _first_ arg, and so
// we wrap it in an array so we can apply it.
var finalMemoizeOptions = Array.isArray(memoizeOptions) ? memoizeOptions : [memoizeOptions];
var dependencies = getDependencies(funcs);
var memoizedResultFunc = memoize.apply(void 0, [function recomputationWrapper() {
_recomputations++; // apply arguments instead of spreading for performance.
return resultFunc.apply(null, arguments);
}].concat(finalMemoizeOptions)); // If a selector is called with the exact same arguments we don't need to traverse our dependencies again.
var selector = memoize(function dependenciesChecker() {
var params = [];
var length = dependencies.length;
for (var i = 0; i < length; i++) {
// apply arguments instead of spreading and mutate a local list of params for performance.
// @ts-ignore
params.push(dependencies[i].apply(null, arguments));
} // apply arguments instead of spreading for performance.
_lastResult = memoizedResultFunc.apply(null, params);
return _lastResult;
});
Object.assign(selector, {
resultFunc: resultFunc,
memoizedResultFunc: memoizedResultFunc,
dependencies: dependencies,
lastResult: function lastResult() {
return _lastResult;
},
recomputations: function recomputations() {
return _recomputations;
},
resetRecomputations: function resetRecomputations() {
return _recomputations = 0;
}
});
return selector;
}; // @ts-ignore
return createSelector;
}
var createSelector = /* #__PURE__ */createSelectorCreator(defaultMemoize);
/** A function that accepts a potential "extra argument" value to be injected later,
* and returns an instance of the thunk middleware that uses that value
*/
function createThunkMiddleware(extraArgument) {
// Standard Redux middleware definition pattern:
// See: https://redux.js.org/tutorials/fundamentals/part-4-store#writing-custom-middleware
var middleware = function middleware(_ref) {
var dispatch = _ref.dispatch,
getState = _ref.getState;
return function (next) {
return function (action) {
// The thunk middleware looks for any functions that were passed to `store.dispatch`.
// If this "action" is really a function, call it and return the result.
if (typeof action === 'function') {
// Inject the store's `dispatch` and `getState` methods, as well as any "extra arg"
return action(dispatch, getState, extraArgument);
} // Otherwise, pass the action down the middleware chain as usual
return next(action);
};
};
};
return middleware;
}
var thunk = createThunkMiddleware(); // Attach the factory function so users can create a customized version
// with whatever "extra arg" they want to inject into their thunks
thunk.withExtraArgument = createThunkMiddleware;
const thunkMiddleware = thunk;
var __extends = (globalThis && globalThis.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __generator$1 = (globalThis && globalThis.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
var __spreadArray$1 = (globalThis && globalThis.__spreadArray) || function (to, from) {
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
to[j] = from[i];
return to;
};
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = function (obj, key, value) { return key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value: value }) : obj[key] = value; };
var __spreadValues = function (a, b) {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var _i = 0, _c = __getOwnPropSymbols(b); _i < _c.length; _i++) {
var prop = _c[_i];
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = function (a, b) { return __defProps(a, __getOwnPropDescs(b)); };
var __async = function (__this, __arguments, generator) {
return new Promise(function (resolve, reject) {
var fulfilled = function (value) {
try {
step(generator.next(value));
}
catch (e) {
reject(e);
}
};
var rejected = function (value) {
try {
step(generator.throw(value));
}
catch (e) {
reject(e);
}
};
var step = function (x) { return x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected); };
step((generator = generator.apply(__this, __arguments)).next());
});
};
var composeWithDevTools = typeof window !== "undefined" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : function () {
if (arguments.length === 0)
return void 0;
if (typeof arguments[0] === "object")
return compose$1;
return compose$1.apply(null, arguments);
};
// src/isPlainObject.ts
function isPlainObject$1(value) {
if (typeof value !== "object" || value === null)
return false;
var proto = Object.getPrototypeOf(value);
if (proto === null)
return true;
var baseProto = proto;
while (Object.getPrototypeOf(baseProto) !== null) {
baseProto = Object.getPrototypeOf(baseProto);
}
return proto === baseProto;
}
var MiddlewareArray = /** @class */ (function (_super) {
__extends(MiddlewareArray, _super);
function MiddlewareArray() {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
var _this = _super.apply(this, args) || this;
Object.setPrototypeOf(_this, MiddlewareArray.prototype);
return _this;
}
Object.defineProperty(MiddlewareArray, Symbol.species, {
get: function () {
return MiddlewareArray;
},
enumerable: false,
configurable: true
});
MiddlewareArray.prototype.concat = function () {
var arr = [];
for (var _i = 0; _i < arguments.length; _i++) {
arr[_i] = arguments[_i];
}
return _super.prototype.concat.apply(this, arr);
};
MiddlewareArray.prototype.prepend = function () {
var arr = [];
for (var _i = 0; _i < arguments.length; _i++) {
arr[_i] = arguments[_i];
}
if (arr.length === 1 && Array.isArray(arr[0])) {
return new (MiddlewareArray.bind.apply(MiddlewareArray, __spreadArray$1([void 0], arr[0].concat(this))))();
}
return new (MiddlewareArray.bind.apply(MiddlewareArray, __spreadArray$1([void 0], arr.concat(this))))();
};
return MiddlewareArray;
}(Array));
function freezeDraftable(val) {
return t$4(val) ? fn(val, function () {
}) : val;
}
// src/getDefaultMiddleware.ts
function isBoolean(x) {
return typeof x === "boolean";
}
function curryGetDefaultMiddleware() {
return function curriedGetDefaultMiddleware(options) {
return getDefaultMiddleware(options);
};
}
function getDefaultMiddleware(options) {
if (options === void 0) { options = {}; }
var _c = options.thunk, thunk = _c === void 0 ? true : _c; options.immutableCheck; options.serializableCheck;
var middlewareArray = new MiddlewareArray();
if (thunk) {
if (isBoolean(thunk)) {
middlewareArray.push(thunkMiddleware);
}
else {
middlewareArray.push(thunkMiddleware.withExtraArgument(thunk.extraArgument));
}
}
return middlewareArray;
}
// src/configureStore.ts
var IS_PRODUCTION = "production" === "production";
function configureStore(options) {
var curriedGetDefaultMiddleware = curryGetDefaultMiddleware();
var _c = options || {}, _d = _c.reducer, reducer = _d === void 0 ? void 0 : _d, _e = _c.middleware, middleware = _e === void 0 ? curriedGetDefaultMiddleware() : _e, _f = _c.devTools, devTools = _f === void 0 ? true : _f, _g = _c.preloadedState, preloadedState = _g === void 0 ? void 0 : _g, _h = _c.enhancers, enhancers = _h === void 0 ? void 0 : _h;
var rootReducer;
if (typeof reducer === "function") {
rootReducer = reducer;
}
else if (isPlainObject$1(reducer)) {
rootReducer = combineReducers(reducer);
}
else {
throw new Error('"reducer" is a required argument, and must be a function or an object of functions that can be passed to combineReducers');
}
var finalMiddleware = middleware;
if (typeof finalMiddleware === "function") {
finalMiddleware = finalMiddleware(curriedGetDefaultMiddleware);
}
var middlewareEnhancer = applyMiddleware.apply(void 0, finalMiddleware);
var finalCompose = compose$1;
if (devTools) {
finalCompose = composeWithDevTools(__spreadValues({
trace: !IS_PRODUCTION
}, typeof devTools === "object" && devTools));
}
var storeEnhancers = [middlewareEnhancer];
if (Array.isArray(enhancers)) {
storeEnhancers = __spreadArray$1([middlewareEnhancer], enhancers);
}
else if (typeof enhancers === "function") {
storeEnhancers = enhancers(storeEnhancers);
}
var composedEnhancer = finalCompose.apply(void 0, storeEnhancers);
return createStore(rootReducer, preloadedState, composedEnhancer);
}
// src/createAction.ts
function createAction(type, prepareAction) {
function actionCreator() {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
if (prepareAction) {
var prepared = prepareAction.apply(void 0, args);
if (!prepared) {
throw new Error("prepareAction did not return an object");
}
return __spreadValues(__spreadValues({
type: type,
payload: prepared.payload
}, "meta" in prepared && { meta: prepared.meta }), "error" in prepared && { error: prepared.error });
}
return { type: type, payload: args[0] };
}
actionCreator.toString = function () { return "" + type; };
actionCreator.type = type;
actionCreator.match = function (action) { return action.type === type; };
return actionCreator;
}
// src/mapBuilders.ts
function executeReducerBuilderCallback(builderCallback) {
var actionsMap = {};
var actionMatchers = [];
var defaultCaseReducer;
var builder = {
addCase: function (typeOrActionCreator, reducer) {
var type = typeof typeOrActionCreator === "string" ? typeOrActionCreator : typeOrActionCreator.type;
if (type in actionsMap) {
throw new Error("addCase cannot be called with two reducers for the same action type");
}
actionsMap[type] = reducer;
return builder;
},
addMatcher: function (matcher, reducer) {
actionMatchers.push({ matcher: matcher, reducer: reducer });
return builder;
},
addDefaultCase: function (reducer) {
defaultCaseReducer = reducer;
return builder;
}
};
builderCallback(builder);
return [actionsMap, actionMatchers, defaultCaseReducer];
}
// src/createReducer.ts
function isStateFunction(x) {
return typeof x === "function";
}
function createReducer(initialState, mapOrBuilderCallback, actionMatchers, defaultCaseReducer) {
if (actionMatchers === void 0) { actionMatchers = []; }
var _c = typeof mapOrBuilderCallback === "function" ? executeReducerBuilderCallback(mapOrBuilderCallback) : [mapOrBuilderCallback, actionMatchers, defaultCaseReducer], actionsMap = _c[0], finalActionMatchers = _c[1], finalDefaultCaseReducer = _c[2];
var getInitialState;
if (isStateFunction(initialState)) {
getInitialState = function () { return freezeDraftable(initialState()); };
}
else {
var frozenInitialState_1 = freezeDraftable(initialState);
getInitialState = function () { return frozenInitialState_1; };
}
function reducer(state, action) {
if (state === void 0) { state = getInitialState(); }
var caseReducers = __spreadArray$1([
actionsMap[action.type]
], finalActionMatchers.filter(function (_c) {
var matcher = _c.matcher;
return matcher(action);
}).map(function (_c) {
var reducer2 = _c.reducer;
return reducer2;
}));
if (caseReducers.filter(function (cr) { return !!cr; }).length === 0) {
caseReducers = [finalDefaultCaseReducer];
}
return caseReducers.reduce(function (previousState, caseReducer) {
if (caseReducer) {
if (r$4(previousState)) {
var draft = previousState;
var result = caseReducer(draft, action);
if (result === void 0) {
return previousState;
}
return result;
}
else if (!t$4(previousState)) {
var result = caseReducer(previousState, action);
if (result === void 0) {
if (previousState === null) {
return previousState;
}
throw Error("A case reducer on a non-draftable value must not return undefined");
}
return result;
}
else {
return fn(previousState, function (draft) {
return caseReducer(draft, action);
});
}
}
return previousState;
}, state);
}
reducer.getInitialState = getInitialState;
return reducer;
}
function getType2(slice, actionKey) {
return slice + "/" + actionKey;
}
function createSlice(options) {
var name = options.name;
if (!name) {
throw new Error("`name` is a required option for createSlice");
}
if (typeof process !== "undefined" && "production" === "development") {
if (options.initialState === void 0) {
console.error("You must provide an `initialState` value that is not `undefined`. You may have misspelled `initialState`");
}
}
var initialState = typeof options.initialState == "function" ? options.initialState : freezeDraftable(options.initialState);
var reducers = options.reducers || {};
var reducerNames = Object.keys(reducers);
var sliceCaseReducersByName = {};
var sliceCaseReducersByType = {};
var actionCreators = {};
reducerNames.forEach(function (reducerName) {
var maybeReducerWithPrepare = reducers[reducerName];
var type = getType2(name, reducerName);
var caseReducer;
var prepareCallback;
if ("reducer" in maybeReducerWithPrepare) {
caseReducer = maybeReducerWithPrepare.reducer;
prepareCallback = maybeReducerWithPrepare.prepare;
}
else {
caseReducer = maybeReducerWithPrepare;
}
sliceCaseReducersByName[reducerName] = caseReducer;
sliceCaseReducersByType[type] = caseReducer;
actionCreators[reducerName] = prepareCallback ? createAction(type, prepareCallback) : createAction(type);
});
function buildReducer() {
var _c = typeof options.extraReducers === "function" ? executeReducerBuilderCallback(options.extraReducers) : [options.extraReducers], _d = _c[0], extraReducers = _d === void 0 ? {} : _d, _e = _c[1], actionMatchers = _e === void 0 ? [] : _e, _f = _c[2], defaultCaseReducer = _f === void 0 ? void 0 : _f;
var finalCaseReducers = __spreadValues(__spreadValues({}, extraReducers), sliceCaseReducersByType);
return createReducer(initialState, function (builder) {
for (var key in finalCaseReducers) {
builder.addCase(key, finalCaseReducers[key]);
}
for (var _i = 0, actionMatchers_1 = actionMatchers; _i < actionMatchers_1.length; _i++) {
var m = actionMatchers_1[_i];
builder.addMatcher(m.matcher, m.reducer);
}
if (defaultCaseReducer) {
builder.addDefaultCase(defaultCaseReducer);
}
});
}
var _reducer;
return {
name: name,
reducer: function (state, action) {
if (!_reducer)
_reducer = buildReducer();
return _reducer(state, action);
},
actions: actionCreators,
caseReducers: sliceCaseReducersByName,
getInitialState: function () {
if (!_reducer)
_reducer = buildReducer();
return _reducer.getInitialState();
}
};
}
// src/nanoid.ts
var urlAlphabet = "ModuleSymbhasOwnPr-0123456789ABCDEFGHNRVfgctiUvz_KqYTJkLxpZXIjQW";
var nanoid = function (size) {
if (size === void 0) { size = 21; }
var id = "";
var i = size;
while (i--) {
id += urlAlphabet[Math.random() * 64 | 0];
}
return id;
};
// src/createAsyncThunk.ts
var commonProperties = [
"name",
"message",
"stack",
"code"
];
var RejectWithValue = /** @class */ (function () {
function RejectWithValue(payload, meta) {
this.payload = payload;
this.meta = meta;
}
return RejectWithValue;
}());
var FulfillWithMeta = /** @class */ (function () {
function FulfillWithMeta(payload, meta) {
this.payload = payload;
this.meta = meta;
}
return FulfillWithMeta;
}());
var miniSerializeError = function (value) {
if (typeof value === "object" && value !== null) {
var simpleError = {};
for (var _i = 0, commonProperties_1 = commonProperties; _i < commonProperties_1.length; _i++) {
var property = commonProperties_1[_i];
if (typeof value[property] === "string") {
simpleError[property] = value[property];
}
}
return simpleError;
}
return { message: String(value) };
};
var createAsyncThunk = (function () {
function createAsyncThunk2(typePrefix, payloadCreator, options) {
var fulfilled = createAction(typePrefix + "/fulfilled", function (payload, requestId, arg, meta) { return ({
payload: payload,
meta: __spreadProps(__spreadValues({}, meta || {}), {
arg: arg,
requestId: requestId,
requestStatus: "fulfilled"
})
}); });
var pending = createAction(typePrefix + "/pending", function (requestId, arg, meta) { return ({
payload: void 0,
meta: __spreadProps(__spreadValues({}, meta || {}), {
arg: arg,
requestId: requestId,
requestStatus: "pending"
})
}); });
var rejected = createAction(typePrefix + "/rejected", function (error, requestId, arg, payload, meta) { return ({
payload: payload,
error: (options && options.serializeError || miniSerializeError)(error || "Rejected"),
meta: __spreadProps(__spreadValues({}, meta || {}), {
arg: arg,
requestId: requestId,
rejectedWithValue: !!payload,
requestStatus: "rejected",
aborted: (error == null ? void 0 : error.name) === "AbortError",
condition: (error == null ? void 0 : error.name) === "ConditionError"
})
}); });
var AC = typeof AbortController !== "undefined" ? AbortController : /** @class */ (function () {
function class_1() {
this.signal = {
aborted: false,
addEventListener: function () {
},
dispatchEvent: function () {
return false;
},
onabort: function () {
},
removeEventListener: function () {
},
reason: void 0,
throwIfAborted: function () {
}
};
}
class_1.prototype.abort = function () {
};
return class_1;
}());
function actionCreator(arg) {
return function (dispatch, getState, extra) {
var requestId = (options == null ? void 0 : options.idGenerator) ? options.idGenerator(arg) : nanoid();
var abortController = new AC();
var abortReason;
function abort(reason) {
abortReason = reason;
abortController.abort();
}
var promise2 = function () {
return __async(this, null, function () {
var _a, _b, finalAction, conditionResult, abortedPromise, err_1, skipDispatch;
return __generator$1(this, function (_c) {
switch (_c.label) {
case 0:
_c.trys.push([0, 4, , 5]);
conditionResult = (_a = options == null ? void 0 : options.condition) == null ? void 0 : _a.call(options, arg, { getState: getState, extra: extra });
if (!isThenable(conditionResult)) return [3 /*break*/, 2];
return [4 /*yield*/, conditionResult];
case 1:
conditionResult = _c.sent();
_c.label = 2;
case 2:
if (conditionResult === false || abortController.signal.aborted) {
throw {
name: "ConditionError",
message: "Aborted due to condition callback returning false."
};
}
abortedPromise = new Promise(function (_, reject) { return abortController.signal.addEventListener("abort", function () { return reject({
name: "AbortError",
message: abortReason || "Aborted"
}); }); });
dispatch(pending(requestId, arg, (_b = options == null ? void 0 : options.getPendingMeta) == null ? void 0 : _b.call(options, { requestId: requestId, arg: arg }, { getState: getState, extra: extra })));
return [4 /*yield*/, Promise.race([
abortedPromise,
Promise.resolve(payloadCreator(arg, {
dispatch: dispatch,
getState: getState,
extra: extra,
requestId: requestId,
signal: abortController.signal,
abort: abort,
rejectWithValue: function (value, meta) {
return new RejectWithValue(value, meta);
},
fulfillWithValue: function (value, meta) {
return new FulfillWithMeta(value, meta);
}
})).then(function (result) {
if (result instanceof RejectWithValue) {
throw result;
}
if (result instanceof FulfillWithMeta) {
return fulfilled(result.payload, requestId, arg, result.meta);
}
return fulfilled(result, requestId, arg);
})
])];
case 3:
finalAction = _c.sent();
return [3 /*break*/, 5];
case 4:
err_1 = _c.sent();
finalAction = err_1 instanceof RejectWithValue ? rejected(null, requestId, arg, err_1.payload, err_1.meta) : rejected(err_1, requestId, arg);
return [3 /*break*/, 5];
case 5:
skipDispatch = options && !options.dispatchConditionRejection && rejected.match(finalAction) && finalAction.meta.condition;
if (!skipDispatch) {
dispatch(finalAction);
}
return [2 /*return*/, finalAction];
}
});
});
}();
return Object.assign(promise2, {
abort: abort,
requestId: requestId,
arg: arg,
unwrap: function () {
return promise2.then(unwrapResult);
}
});
};
}
return Object.assign(actionCreator, {
pending: pending,
rejected: rejected,
fulfilled: fulfilled,
typePrefix: typePrefix
});
}
createAsyncThunk2.withTypes = function () { return createAsyncThunk2; };
return createAsyncThunk2;
})();
function unwrapResult(action) {
if (action.meta && action.meta.rejectedWithValue) {
throw action.payload;
}
if (action.error) {
throw action.error;
}
return action.payload;
}
function isThenable(value) {
return value !== null && typeof value === "object" && typeof value.then === "function";
}
// src/tsHelpers.ts
var hasMatchFunction = function (v) {
return v && typeof v.match === "function";
};
// src/matchers.ts
var matches = function (matcher, action) {
if (hasMatchFunction(matcher)) {
return matcher.match(action);
}
else {
return matcher(action);
}
};
function isAnyOf() {
var matchers = [];
for (var _i = 0; _i < arguments.length; _i++) {
matchers[_i] = arguments[_i];
}
return function (action) {
return matchers.some(function (matcher) { return matches(matcher, action); });
};
}
// src/listenerMiddleware/utils.ts
var assertFunction = function (func, expected) {
if (typeof func !== "function") {
throw new TypeError(expected + " is not a function");
}
};
var noop$2 = function () {
};
var catchRejection = function (promise2, onError) {
if (onError === void 0) { onError = noop$2; }
promise2.catch(onError);
return promise2;
};
var addAbortSignalListener = function (abortSignal, callback) {
abortSignal.addEventListener("abort", callback, { once: true });
return function () { return abortSignal.removeEventListener("abort", callback); };
};
var abortControllerWithReason = function (abortController, reason) {
var signal = abortController.signal;
if (signal.aborted) {
return;
}
if (!("reason" in signal)) {
Object.defineProperty(signal, "reason", {
enumerable: true,
value: reason,
configurable: true,
writable: true
});
}
abortController.abort(reason);
};
// src/listenerMiddleware/exceptions.ts
var task = "task";
var listener = "listener";
var completed = "completed";
var cancelled = "cancelled";
var taskCancelled = "task-" + cancelled;
var taskCompleted = "task-" + completed;
var listenerCancelled = listener + "-" + cancelled;
var listenerCompleted = listener + "-" + completed;
var TaskAbortError = /** @class */ (function () {
function TaskAbortError(code) {
this.code = code;
this.name = "TaskAbortError";
this.message = task + " " + cancelled + " (reason: " + code + ")";
}
return TaskAbortError;
}());
// src/listenerMiddleware/task.ts
var validateActive = function (signal) {
if (signal.aborted) {
throw new TaskAbortError(signal.reason);
}
};
function raceWithSignal(signal, promise2) {
var cleanup = noop$2;
return new Promise(function (resolve, reject) {
var notifyRejection = function () { return reject(new TaskAbortError(signal.reason)); };
if (signal.aborted) {
notifyRejection();
return;
}
cleanup = addAbortSignalListener(signal, notifyRejection);
promise2.finally(function () { return cleanup(); }).then(resolve, reject);
}).finally(function () {
cleanup = noop$2;
});
}
var runTask = function (task2, cleanUp) { return __async(void 0, null, function () {
var value, error_1;
return __generator$1(this, function (_c) {
switch (_c.label) {
case 0:
_c.trys.push([0, 3, 4, 5]);
return [4 /*yield*/, Promise.resolve()];
case 1:
_c.sent();
return [4 /*yield*/, task2()];
case 2:
value = _c.sent();
return [2 /*return*/, {
status: "ok",
value: value
}];
case 3:
error_1 = _c.sent();
return [2 /*return*/, {
status: error_1 instanceof TaskAbortError ? "cancelled" : "rejected",
error: error_1
}];
case 4:
cleanUp == null ? void 0 : cleanUp();
return [7 /*endfinally*/];
case 5: return [2 /*return*/];
}
});
}); };
var createPause = function (signal) {
return function (promise2) {
return catchRejection(raceWithSignal(signal, promise2).then(function (output) {
validateActive(signal);
return output;
}));
};
};
var createDelay = function (signal) {
var pause = createPause(signal);
return function (timeoutMs) {
return pause(new Promise(function (resolve) { return setTimeout(resolve, timeoutMs); }));
};
};
// src/listenerMiddleware/index.ts
var assign$1 = Object.assign;
var INTERNAL_NIL_TOKEN = {};
var alm = "listenerMiddleware";
var createFork = function (parentAbortSignal) {
var linkControllers = function (controller) { return addAbortSignalListener(parentAbortSignal, function () { return abortControllerWithReason(controller, parentAbortSignal.reason); }); };
return function (taskExecutor) {
assertFunction(taskExecutor, "taskExecutor");
var childAbortController = new AbortController();
linkControllers(childAbortController);
var result = runTask(function () { return __async(void 0, null, function () {
var result2;
return __generator$1(this, function (_c) {
switch (_c.label) {
case 0:
validateActive(parentAbortSignal);
validateActive(childAbortController.signal);
return [4 /*yield*/, taskExecutor({
pause: createPause(childAbortController.signal),
delay: createDelay(childAbortController.signal),
signal: childAbortController.signal
})];
case 1:
result2 = _c.sent();
validateActive(childAbortController.signal);
return [2 /*return*/, result2];
}
});
}); }, function () { return abortControllerWithReason(childAbortController, taskCompleted); });
return {
result: createPause(parentAbortSignal)(result),
cancel: function () {
abortControllerWithReason(childAbortController, taskCancelled);
}
};
};
};
var createTakePattern = function (startListening, signal) {
var take = function (predicate, timeout) { return __async(void 0, null, function () {
var unsubscribe, tuplePromise, promises, output;
return __generator$1(this, function (_c) {
switch (_c.label) {
case 0:
validateActive(signal);
unsubscribe = function () {
};
tuplePromise = new Promise(function (resolve, reject) {
var stopListening = startListening({
predicate: predicate,
effect: function (action, listenerApi) {
listenerApi.unsubscribe();
resolve([
action,
listenerApi.getState(),
listenerApi.getOriginalState()
]);
}
});
unsubscribe = function () {
stopListening();
reject();
};
});
promises = [
tuplePromise
];
if (timeout != null) {
promises.push(new Promise(function (resolve) { return setTimeout(resolve, timeout, null); }));
}
_c.label = 1;
case 1:
_c.trys.push([1, , 3, 4]);
return [4 /*yield*/, raceWithSignal(signal, Promise.race(promises))];
case 2:
output = _c.sent();
validateActive(signal);
return [2 /*return*/, output];
case 3:
unsubscribe();
return [7 /*endfinally*/];
case 4: return [2 /*return*/];
}
});
}); };
return function (predicate, timeout) { return catchRejection(take(predicate, timeout)); };
};
var getListenerEntryPropsFrom = function (options) {
var type = options.type, actionCreator = options.actionCreator, matcher = options.matcher, predicate = options.predicate, effect = options.effect;
if (type) {
predicate = createAction(type).match;
}
else if (actionCreator) {
type = actionCreator.type;
predicate = actionCreator.match;
}
else if (matcher) {
predicate = matcher;
}
else if (predicate) ;
else {
throw new Error("Creating or removing a listener requires one of the known fields for matching an action");
}
assertFunction(effect, "options.listener");
return { predicate: predicate, type: type, effect: effect };
};
var createListenerEntry = function (options) {
var _c = getListenerEntryPropsFrom(options), type = _c.type, predicate = _c.predicate, effect = _c.effect;
var id = nanoid();
var entry = {
id: id,
effect: effect,
type: type,
predicate: predicate,
pending: new Set(),
unsubscribe: function () {
throw new Error("Unsubscribe not initialized");
}
};
return entry;
};
var cancelActiveListeners = function (entry) {
entry.pending.forEach(function (controller) {
abortControllerWithReason(controller, listenerCancelled);
});
};
var createClearListenerMiddleware = function (listenerMap) {
return function () {
listenerMap.forEach(cancelActiveListeners);
listenerMap.clear();
};
};
var safelyNotifyError = function (errorHandler, errorToNotify, errorInfo) {
try {
errorHandler(errorToNotify, errorInfo);
}
catch (errorHandlerError) {
setTimeout(function () {
throw errorHandlerError;
}, 0);
}
};
var addListener = createAction(alm + "/add");
var clearAllListeners = createAction(alm + "/removeAll");
var removeListener = createAction(alm + "/remove");
var defaultErrorHandler = function () {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
console.error.apply(console, __spreadArray$1([alm + "/error"], args));
};
function createListenerMiddleware(middlewareOptions) {
var _this = this;
if (middlewareOptions === void 0) { middlewareOptions = {}; }
var listenerMap = new Map();
var extra = middlewareOptions.extra, _c = middlewareOptions.onError, onError = _c === void 0 ? defaultErrorHandler : _c;
assertFunction(onError, "onError");
var insertEntry = function (entry) {
entry.unsubscribe = function () { return listenerMap.delete(entry.id); };
listenerMap.set(entry.id, entry);
return function (cancelOptions) {
entry.unsubscribe();
if (cancelOptions == null ? void 0 : cancelOptions.cancelActive) {
cancelActiveListeners(entry);
}
};
};
var findListenerEntry = function (comparator) {
for (var _i = 0, _c = Array.from(listenerMap.values()); _i < _c.length; _i++) {
var entry = _c[_i];
if (comparator(entry)) {
return entry;
}
}
return void 0;
};
var startListening = function (options) {
var entry = findListenerEntry(function (existingEntry) { return existingEntry.effect === options.effect; });
if (!entry) {
entry = createListenerEntry(options);
}
return insertEntry(entry);
};
var stopListening = function (options) {
var _c = getListenerEntryPropsFrom(options), type = _c.type, effect = _c.effect, predicate = _c.predicate;
var entry = findListenerEntry(function (entry2) {
var matchPredicateOrType = typeof type === "string" ? entry2.type === type : entry2.predicate === predicate;
return matchPredicateOrType && entry2.effect === effect;
});
if (entry) {
entry.unsubscribe();
if (options.cancelActive) {
cancelActiveListeners(entry);
}
}
return !!entry;
};
var notifyListener = function (entry, action, api, getOriginalState) { return __async(_this, null, function () {
var internalTaskController, take, listenerError_1;
return __generator$1(this, function (_c) {
switch (_c.label) {
case 0:
internalTaskController = new AbortController();
take = createTakePattern(startListening, internalTaskController.signal);
_c.label = 1;
case 1:
_c.trys.push([1, 3, 4, 5]);
entry.pending.add(internalTaskController);
return [4 /*yield*/, Promise.resolve(entry.effect(action, assign$1({}, api, {
getOriginalState: getOriginalState,
condition: function (predicate, timeout) { return take(predicate, timeout).then(Boolean); },
take: take,
delay: createDelay(internalTaskController.signal),
pause: createPause(internalTaskController.signal),
extra: extra,
signal: internalTaskController.signal,
fork: createFork(internalTaskController.signal),
unsubscribe: entry.unsubscribe,
subscribe: function () {
listenerMap.set(entry.id, entry);
},
cancelActiveListeners: function () {
entry.pending.forEach(function (controller, _, set) {
if (controller !== internalTaskController) {
abortControllerWithReason(controller, listenerCancelled);
set.delete(controller);
}
});
}
})))];
case 2:
_c.sent();
return [3 /*break*/, 5];
case 3:
listenerError_1 = _c.sent();
if (!(listenerError_1 instanceof TaskAbortError)) {
safelyNotifyError(onError, listenerError_1, {
raisedBy: "effect"
});
}
return [3 /*break*/, 5];
case 4:
abortControllerWithReason(internalTaskController, listenerCompleted);
entry.pending.delete(internalTaskController);
return [7 /*endfinally*/];
case 5: return [2 /*return*/];
}
});
}); };
var clearListenerMiddleware = createClearListenerMiddleware(listenerMap);
var middleware = function (api) { return function (next) { return function (action) {
if (addListener.match(action)) {
return startListening(action.payload);
}
if (clearAllListeners.match(action)) {
clearListenerMiddleware();
return;
}
if (removeListener.match(action)) {
return stopListening(action.payload);
}
var originalState = api.getState();
var getOriginalState = function () {
if (originalState === INTERNAL_NIL_TOKEN) {
throw new Error(alm + ": getOriginalState can only be called synchronously");
}
return originalState;
};
var result;
try {
result = next(action);
if (listenerMap.size > 0) {
var currentState = api.getState();
var listenerEntries = Array.from(listenerMap.values());
for (var _i = 0, listenerEntries_1 = listenerEntries; _i < listenerEntries_1.length; _i++) {
var entry = listenerEntries_1[_i];
var runListener = false;
try {
runListener = entry.predicate(action, currentState, originalState);
}
catch (predicateError) {
runListener = false;
safelyNotifyError(onError, predicateError, {
raisedBy: "predicate"
});
}
if (!runListener) {
continue;
}
notifyListener(entry, action, api, getOriginalState);
}
}
}
finally {
originalState = INTERNAL_NIL_TOKEN;
}
return result;
}; }; };
return {
middleware: middleware,
startListening: startListening,
stopListening: stopListening,
clearListeners: clearListenerMiddleware
};
}
var promise;
typeof queueMicrotask === "function" ? queueMicrotask.bind(typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : globalThis) : function (cb) { return (promise || (promise = Promise.resolve())).then(cb).catch(function (err) { return setTimeout(function () {
throw err;
}, 0); }); };
// src/index.ts
F();
const initialState$7 = {
gameGui: {
hoverPixel: {
x: 0,
y: 0
},
viewScale: 1,
viewCenter: {
x: 0,
y: 0
},
waitDate: new Date()
},
canvas: {
palette: [],
reservedColorCount: 0,
id: 0,
canvasSize: 1,
selectedColor: 0,
maxTimeoutMs: 100,
timeoutOnBaseMs: 100,
timeoutOnPlacedMs: 100,
latestPixelReturnCooldownMs: 0
}
};
const gameSlice = createSlice({
initialState: initialState$7,
name: "game",
reducers: {
setHoverPixel: (state, action) => {
state.gameGui.hoverPixel = action.payload;
},
setViewScale: (state, action) => {
state.gameGui.viewScale = action.payload;
},
setViewCenter: (state, action) => {
state.gameGui.viewCenter = action.payload;
},
setPalette: (state, action) => {
state.canvas.palette = action.payload;
},
setReservedColorCount: (state, action) => {
state.canvas.reservedColorCount = action.payload;
},
setCanvasId: (state, action) => {
state.canvas.id = action.payload;
},
setCanvasSize: (state, action) => {
state.canvas.canvasSize = action.payload;
},
setSelectedColor: (state, action) => {
state.canvas.selectedColor = action.payload;
},
setWaitDate: (state, action) => {
state.gameGui.waitDate = action.payload;
},
setMaxTimeoutMs: (state, action) => {
state.canvas.maxTimeoutMs = action.payload;
},
setTimeoutOnBaseMs: (state, action) => {
state.canvas.timeoutOnBaseMs = action.payload;
},
setTimeoutOnPlacedMs: (state, action) => {
state.canvas.timeoutOnPlacedMs = action.payload;
},
setLatestPixelReturnCooldown: (state, action) => {
state.canvas.latestPixelReturnCooldownMs = action.payload;
}
}
});
createSelector((state) => state.game.canvas.selectedColor, (currentSelectedColor) => currentSelectedColor);
const selectHoverPixel = createSelector((state) => state.game.gameGui.hoverPixel, (hoverPixel) => hoverPixel);
const selectCanvasReservedColorCount = createSelector((state) => state.game.canvas.reservedColorCount, (reservedColorCount) => reservedColorCount);
const selectCanvasPalette = createSelector((state) => state.game.canvas.palette, (palette) => palette);
const selectCanvasId = createSelector((state) => state.game.canvas.id, (id) => id);
createSelector((state) => state.game.canvas.maxTimeoutMs, (maxTimeoutMs) => maxTimeoutMs);
createSelector((state) => state.game.canvas.timeoutOnBaseMs, (timeoutOnBaseMs) => timeoutOnBaseMs);
createSelector((state) => state.game.canvas.timeoutOnPlacedMs, (timeoutOnPlacedMs) => timeoutOnPlacedMs);
createSelector((state) => state.game.canvas.latestPixelReturnCooldownMs, (latestPixelReturnCooldownMs) => latestPixelReturnCooldownMs);
const selectCanvasUserPalette = createSelector(selectCanvasReservedColorCount, selectCanvasPalette, (reservedColorCount, palette) => {
return palette.slice(reservedColorCount);
});
const selectGameViewCenter = createSelector((state) => state.game.gameGui.viewCenter, (viewCenter) => viewCenter);
const selectGameViewScale = createSelector((state) => state.game.gameGui.viewScale, (viewScale) => viewScale);
createSelector((state) => state.game.gameGui.waitDate, (waitDate) => waitDate);
const selectCanvasSize = createSelector((state) => state.game.canvas.canvasSize, (canvasSize) => canvasSize);
const colorConverter = {
getClosestColorFromPalette(gamePalette, reservedOffset, r, g, b) {
const idx = this.convertActualColorFromPalette(gamePalette, reservedOffset, r, g, b);
return this.getActualColorFromPalette(gamePalette, idx);
},
convertActualColorFromPalette(gamePalette, reservedOffset, r, g, b) {
const resultColorIdx = gamePalette.map((color, i) => {
if (i < reservedOffset)
return void 0;
const difference = Math.sqrt((r - color[0]) ** 2 + (g - color[1]) ** 2 + (b - color[2]) ** 2);
return {
difference,
color,
index: i
};
}).filter((a) => !!a).map((a) => a).sort((aa, bb) => aa.difference - bb.difference)[0]?.index;
if (resultColorIdx === void 0)
throw new Error(`Color not found ${r}, ${g}, ${b} from ${JSON.stringify(gamePalette)}`);
return resultColorIdx;
},
getActualColorFromPalette(gamePalette, color) {
const colorData = gamePalette[color];
if (!colorData)
return null;
return [colorData[0], colorData[1], colorData[2]];
},
areColorsEqual(gamePalette, c1, c2) {
if (c1 === c2) {
return true;
}
const color1 = gamePalette[c1];
const color2 = gamePalette[c2];
if (!color1 || !color2)
return c1 === c2;
let areEqual = true;
areEqual = areEqual && color1[0] === color2[0];
areEqual = areEqual && color1[1] === color2[1];
areEqual = areEqual && color1[2] === color2[2];
return areEqual;
},
parseColor(colorStr) {
const r = parseInt(colorStr.substr(1, 2), 16);
const g = parseInt(colorStr.substr(3, 2), 16);
const b = parseInt(colorStr.substr(5, 2), 16);
return [r, g, b];
}
};
var shimExports = {};
var shim = {
get exports(){ return shimExports; },
set exports(v){ shimExports = v; },
};
var useSyncExternalStoreShim_production_min = {};
/**
* @license React
* use-sync-external-store-shim.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var e$2=reactExports;function h$3(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var k$2="function"===typeof Object.is?Object.is:h$3,l$2=e$2.useState,m$3=e$2.useEffect,n$3=e$2.useLayoutEffect,p$4=e$2.useDebugValue;function q$3(a,b){var d=b(),f=l$2({inst:{value:d,getSnapshot:b}}),c=f[0].inst,g=f[1];n$3(function(){c.value=d;c.getSnapshot=b;r$3(c)&&g({inst:c});},[a,d,b]);m$3(function(){r$3(c)&&g({inst:c});return a(function(){r$3(c)&&g({inst:c});})},[a]);p$4(d);return d}
function r$3(a){var b=a.getSnapshot;a=a.value;try{var d=b();return !k$2(a,d)}catch(f){return !0}}function t$3(a,b){return b()}var u$2="undefined"===typeof window||"undefined"===typeof window.document||"undefined"===typeof window.document.createElement?t$3:q$3;useSyncExternalStoreShim_production_min.useSyncExternalStore=void 0!==e$2.useSyncExternalStore?e$2.useSyncExternalStore:u$2;
(function (module) {
{
module.exports = useSyncExternalStoreShim_production_min;
}
} (shim));
var withSelectorExports = {};
var withSelector = {
get exports(){ return withSelectorExports; },
set exports(v){ withSelectorExports = v; },
};
var withSelector_production_min = {};
/**
* @license React
* use-sync-external-store-shim/with-selector.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var h$2=reactExports,n$2=shimExports;function p$3(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var q$2="function"===typeof Object.is?Object.is:p$3,r$2=n$2.useSyncExternalStore,t$2=h$2.useRef,u$1=h$2.useEffect,v$3=h$2.useMemo,w$1=h$2.useDebugValue;
withSelector_production_min.useSyncExternalStoreWithSelector=function(a,b,e,l,g){var c=t$2(null);if(null===c.current){var f={hasValue:!1,value:null};c.current=f;}else f=c.current;c=v$3(function(){function a(a){if(!c){c=!0;d=a;a=l(a);if(void 0!==g&&f.hasValue){var b=f.value;if(g(b,a))return k=b}return k=a}b=k;if(q$2(d,a))return b;var e=l(a);if(void 0!==g&&g(b,e))return b;d=a;return k=e}var c=!1,d,k,m=void 0===e?null:e;return [function(){return a(b())},null===m?void 0:function(){return a(m())}]},[b,e,l,g]);var d=r$2(a,c[0],c[1]);
u$1(function(){f.hasValue=!0;f.value=d;},[d]);w$1(d);return d};
(function (module) {
{
module.exports = withSelector_production_min;
}
} (withSelector));
var reactDomExports = {};
var reactDom = {
get exports(){ return reactDomExports; },
set exports(v){ reactDomExports = v; },
};
var reactDom_production_min = {};
var schedulerExports = {};
var scheduler = {
get exports(){ return schedulerExports; },
set exports(v){ schedulerExports = v; },
};
var scheduler_production_min = {};
/**
* @license React
* scheduler.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
(function (exports) {
function f(a,b){var c=a.length;a.push(b);a:for(;0<c;){var d=c-1>>>1,e=a[d];if(0<g(e,b))a[d]=b,a[c]=e,c=d;else break a}}function h(a){return 0===a.length?null:a[0]}function k(a){if(0===a.length)return null;var b=a[0],c=a.pop();if(c!==b){a[0]=c;a:for(var d=0,e=a.length,w=e>>>1;d<w;){var m=2*(d+1)-1,C=a[m],n=m+1,x=a[n];if(0>g(C,c))n<e&&0>g(x,C)?(a[d]=x,a[n]=c,d=n):(a[d]=C,a[m]=c,d=m);else if(n<e&&0>g(x,c))a[d]=x,a[n]=c,d=n;else break a}}return b}
function g(a,b){var c=a.sortIndex-b.sortIndex;return 0!==c?c:a.id-b.id}if("object"===typeof performance&&"function"===typeof performance.now){var l=performance;exports.unstable_now=function(){return l.now()};}else {var p=Date,q=p.now();exports.unstable_now=function(){return p.now()-q};}var r=[],t=[],u=1,v=null,y=3,z=!1,A=!1,B=!1,D="function"===typeof setTimeout?setTimeout:null,E="function"===typeof clearTimeout?clearTimeout:null,F="undefined"!==typeof setImmediate?setImmediate:null;
"undefined"!==typeof navigator&&void 0!==navigator.scheduling&&void 0!==navigator.scheduling.isInputPending&&navigator.scheduling.isInputPending.bind(navigator.scheduling);function G(a){for(var b=h(t);null!==b;){if(null===b.callback)k(t);else if(b.startTime<=a)k(t),b.sortIndex=b.expirationTime,f(r,b);else break;b=h(t);}}function H(a){B=!1;G(a);if(!A)if(null!==h(r))A=!0,I(J);else {var b=h(t);null!==b&&K(H,b.startTime-a);}}
function J(a,b){A=!1;B&&(B=!1,E(L),L=-1);z=!0;var c=y;try{G(b);for(v=h(r);null!==v&&(!(v.expirationTime>b)||a&&!M());){var d=v.callback;if("function"===typeof d){v.callback=null;y=v.priorityLevel;var e=d(v.expirationTime<=b);b=exports.unstable_now();"function"===typeof e?v.callback=e:v===h(r)&&k(r);G(b);}else k(r);v=h(r);}if(null!==v)var w=!0;else {var m=h(t);null!==m&&K(H,m.startTime-b);w=!1;}return w}finally{v=null,y=c,z=!1;}}var N=!1,O=null,L=-1,P=5,Q=-1;
function M(){return exports.unstable_now()-Q<P?!1:!0}function R(){if(null!==O){var a=exports.unstable_now();Q=a;var b=!0;try{b=O(!0,a);}finally{b?S():(N=!1,O=null);}}else N=!1;}var S;if("function"===typeof F)S=function(){F(R);};else if("undefined"!==typeof MessageChannel){var T=new MessageChannel,U=T.port2;T.port1.onmessage=R;S=function(){U.postMessage(null);};}else S=function(){D(R,0);};function I(a){O=a;N||(N=!0,S());}function K(a,b){L=D(function(){a(exports.unstable_now());},b);}
exports.unstable_IdlePriority=5;exports.unstable_ImmediatePriority=1;exports.unstable_LowPriority=4;exports.unstable_NormalPriority=3;exports.unstable_Profiling=null;exports.unstable_UserBlockingPriority=2;exports.unstable_cancelCallback=function(a){a.callback=null;};exports.unstable_continueExecution=function(){A||z||(A=!0,I(J));};
exports.unstable_forceFrameRate=function(a){0>a||125<a?console.error("forceFrameRate takes a positive int between 0 and 125, forcing frame rates higher than 125 fps is not supported"):P=0<a?Math.floor(1E3/a):5;};exports.unstable_getCurrentPriorityLevel=function(){return y};exports.unstable_getFirstCallbackNode=function(){return h(r)};exports.unstable_next=function(a){switch(y){case 1:case 2:case 3:var b=3;break;default:b=y;}var c=y;y=b;try{return a()}finally{y=c;}};exports.unstable_pauseExecution=function(){};
exports.unstable_requestPaint=function(){};exports.unstable_runWithPriority=function(a,b){switch(a){case 1:case 2:case 3:case 4:case 5:break;default:a=3;}var c=y;y=a;try{return b()}finally{y=c;}};
exports.unstable_scheduleCallback=function(a,b,c){var d=exports.unstable_now();"object"===typeof c&&null!==c?(c=c.delay,c="number"===typeof c&&0<c?d+c:d):c=d;switch(a){case 1:var e=-1;break;case 2:e=250;break;case 5:e=1073741823;break;case 4:e=1E4;break;default:e=5E3;}e=c+e;a={id:u++,callback:b,priorityLevel:a,startTime:c,expirationTime:e,sortIndex:-1};c>d?(a.sortIndex=c,f(t,a),null===h(r)&&a===h(t)&&(B?(E(L),L=-1):B=!0,K(H,c-d))):(a.sortIndex=e,f(r,a),A||z||(A=!0,I(J)));return a};
exports.unstable_shouldYield=M;exports.unstable_wrapCallback=function(a){var b=y;return function(){var c=y;y=b;try{return a.apply(this,arguments)}finally{y=c;}}};
} (scheduler_production_min));
(function (module) {
{
module.exports = scheduler_production_min;
}
} (scheduler));
/**
* @license React
* react-dom.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var aa=reactExports,ca=schedulerExports;function p$2(a){for(var b="https://reactjs.org/docs/error-decoder.html?invariant="+a,c=1;c<arguments.length;c++)b+="&args[]="+encodeURIComponent(arguments[c]);return "Minified React error #"+a+"; visit "+b+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."}var da=new Set,ea={};function fa(a,b){ha(a,b);ha(a+"Capture",b);}
function ha(a,b){ea[a]=b;for(a=0;a<b.length;a++)da.add(b[a]);}
var ia=!("undefined"===typeof window||"undefined"===typeof window.document||"undefined"===typeof window.document.createElement),ja=Object.prototype.hasOwnProperty,ka=/^[:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD][:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,la=
{},ma={};function oa(a){if(ja.call(ma,a))return !0;if(ja.call(la,a))return !1;if(ka.test(a))return ma[a]=!0;la[a]=!0;return !1}function pa(a,b,c,d){if(null!==c&&0===c.type)return !1;switch(typeof b){case "function":case "symbol":return !0;case "boolean":if(d)return !1;if(null!==c)return !c.acceptsBooleans;a=a.toLowerCase().slice(0,5);return "data-"!==a&&"aria-"!==a;default:return !1}}
function qa(a,b,c,d){if(null===b||"undefined"===typeof b||pa(a,b,c,d))return !0;if(d)return !1;if(null!==c)switch(c.type){case 3:return !b;case 4:return !1===b;case 5:return isNaN(b);case 6:return isNaN(b)||1>b}return !1}function v$2(a,b,c,d,e,f,g){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=e;this.mustUseProperty=c;this.propertyName=a;this.type=b;this.sanitizeURL=f;this.removeEmptyString=g;}var z$1={};
"children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(a){z$1[a]=new v$2(a,0,!1,a,null,!1,!1);});[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(a){var b=a[0];z$1[b]=new v$2(b,1,!1,a[1],null,!1,!1);});["contentEditable","draggable","spellCheck","value"].forEach(function(a){z$1[a]=new v$2(a,2,!1,a.toLowerCase(),null,!1,!1);});
["autoReverse","externalResourcesRequired","focusable","preserveAlpha"].forEach(function(a){z$1[a]=new v$2(a,2,!1,a,null,!1,!1);});"allowFullScreen async autoFocus autoPlay controls default defer disabled disablePictureInPicture disableRemotePlayback formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope".split(" ").forEach(function(a){z$1[a]=new v$2(a,3,!1,a.toLowerCase(),null,!1,!1);});
["checked","multiple","muted","selected"].forEach(function(a){z$1[a]=new v$2(a,3,!0,a,null,!1,!1);});["capture","download"].forEach(function(a){z$1[a]=new v$2(a,4,!1,a,null,!1,!1);});["cols","rows","size","span"].forEach(function(a){z$1[a]=new v$2(a,6,!1,a,null,!1,!1);});["rowSpan","start"].forEach(function(a){z$1[a]=new v$2(a,5,!1,a.toLowerCase(),null,!1,!1);});var ra=/[\-:]([a-z])/g;function sa(a){return a[1].toUpperCase()}
"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach(function(a){var b=a.replace(ra,
sa);z$1[b]=new v$2(b,1,!1,a,null,!1,!1);});"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type".split(" ").forEach(function(a){var b=a.replace(ra,sa);z$1[b]=new v$2(b,1,!1,a,"http://www.w3.org/1999/xlink",!1,!1);});["xml:base","xml:lang","xml:space"].forEach(function(a){var b=a.replace(ra,sa);z$1[b]=new v$2(b,1,!1,a,"http://www.w3.org/XML/1998/namespace",!1,!1);});["tabIndex","crossOrigin"].forEach(function(a){z$1[a]=new v$2(a,1,!1,a.toLowerCase(),null,!1,!1);});
z$1.xlinkHref=new v$2("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1);["src","href","action","formAction"].forEach(function(a){z$1[a]=new v$2(a,1,!1,a.toLowerCase(),null,!0,!0);});
function ta(a,b,c,d){var e=z$1.hasOwnProperty(b)?z$1[b]:null;if(null!==e?0!==e.type:d||!(2<b.length)||"o"!==b[0]&&"O"!==b[0]||"n"!==b[1]&&"N"!==b[1])qa(b,c,e,d)&&(c=null),d||null===e?oa(b)&&(null===c?a.removeAttribute(b):a.setAttribute(b,""+c)):e.mustUseProperty?a[e.propertyName]=null===c?3===e.type?!1:"":c:(b=e.attributeName,d=e.attributeNamespace,null===c?a.removeAttribute(b):(e=e.type,c=3===e||4===e&&!0===c?"":""+c,d?a.setAttributeNS(d,b,c):a.setAttribute(b,c)));}
var ua=aa.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,va=Symbol.for("react.element"),wa=Symbol.for("react.portal"),ya=Symbol.for("react.fragment"),za=Symbol.for("react.strict_mode"),Aa=Symbol.for("react.profiler"),Ba=Symbol.for("react.provider"),Ca=Symbol.for("react.context"),Da=Symbol.for("react.forward_ref"),Ea=Symbol.for("react.suspense"),Fa=Symbol.for("react.suspense_list"),Ga=Symbol.for("react.memo"),Ha=Symbol.for("react.lazy");var Ia=Symbol.for("react.offscreen");var Ja=Symbol.iterator;function Ka(a){if(null===a||"object"!==typeof a)return null;a=Ja&&a[Ja]||a["@@iterator"];return "function"===typeof a?a:null}var A$1=Object.assign,La;function Ma(a){if(void 0===La)try{throw Error();}catch(c){var b=c.stack.trim().match(/\n( *(at )?)/);La=b&&b[1]||"";}return "\n"+La+a}var Na=!1;
function Oa(a,b){if(!a||Na)return "";Na=!0;var c=Error.prepareStackTrace;Error.prepareStackTrace=void 0;try{if(b)if(b=function(){throw Error();},Object.defineProperty(b.prototype,"props",{set:function(){throw Error();}}),"object"===typeof Reflect&&Reflect.construct){try{Reflect.construct(b,[]);}catch(l){var d=l;}Reflect.construct(a,[],b);}else {try{b.call();}catch(l){d=l;}a.call(b.prototype);}else {try{throw Error();}catch(l){d=l;}a();}}catch(l){if(l&&d&&"string"===typeof l.stack){for(var e=l.stack.split("\n"),
f=d.stack.split("\n"),g=e.length-1,h=f.length-1;1<=g&&0<=h&&e[g]!==f[h];)h--;for(;1<=g&&0<=h;g--,h--)if(e[g]!==f[h]){if(1!==g||1!==h){do if(g--,h--,0>h||e[g]!==f[h]){var k="\n"+e[g].replace(" at new "," at ");a.displayName&&k.includes("<anonymous>")&&(k=k.replace("<anonymous>",a.displayName));return k}while(1<=g&&0<=h)}break}}}finally{Na=!1,Error.prepareStackTrace=c;}return (a=a?a.displayName||a.name:"")?Ma(a):""}
function Pa(a){switch(a.tag){case 5:return Ma(a.type);case 16:return Ma("Lazy");case 13:return Ma("Suspense");case 19:return Ma("SuspenseList");case 0:case 2:case 15:return a=Oa(a.type,!1),a;case 11:return a=Oa(a.type.render,!1),a;case 1:return a=Oa(a.type,!0),a;default:return ""}}
function Qa(a){if(null==a)return null;if("function"===typeof a)return a.displayName||a.name||null;if("string"===typeof a)return a;switch(a){case ya:return "Fragment";case wa:return "Portal";case Aa:return "Profiler";case za:return "StrictMode";case Ea:return "Suspense";case Fa:return "SuspenseList"}if("object"===typeof a)switch(a.$$typeof){case Ca:return (a.displayName||"Context")+".Consumer";case Ba:return (a._context.displayName||"Context")+".Provider";case Da:var b=a.render;a=a.displayName;a||(a=b.displayName||
b.name||"",a=""!==a?"ForwardRef("+a+")":"ForwardRef");return a;case Ga:return b=a.displayName||null,null!==b?b:Qa(a.type)||"Memo";case Ha:b=a._payload;a=a._init;try{return Qa(a(b))}catch(c){}}return null}
function Ra(a){var b=a.type;switch(a.tag){case 24:return "Cache";case 9:return (b.displayName||"Context")+".Consumer";case 10:return (b._context.displayName||"Context")+".Provider";case 18:return "DehydratedFragment";case 11:return a=b.render,a=a.displayName||a.name||"",b.displayName||(""!==a?"ForwardRef("+a+")":"ForwardRef");case 7:return "Fragment";case 5:return b;case 4:return "Portal";case 3:return "Root";case 6:return "Text";case 16:return Qa(b);case 8:return b===za?"StrictMode":"Mode";case 22:return "Offscreen";
case 12:return "Profiler";case 21:return "Scope";case 13:return "Suspense";case 19:return "SuspenseList";case 25:return "TracingMarker";case 1:case 0:case 17:case 2:case 14:case 15:if("function"===typeof b)return b.displayName||b.name||null;if("string"===typeof b)return b}return null}function Sa(a){switch(typeof a){case "boolean":case "number":case "string":case "undefined":return a;case "object":return a;default:return ""}}
function Ta(a){var b=a.type;return (a=a.nodeName)&&"input"===a.toLowerCase()&&("checkbox"===b||"radio"===b)}
function Ua(a){var b=Ta(a)?"checked":"value",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=""+a[b];if(!a.hasOwnProperty(b)&&"undefined"!==typeof c&&"function"===typeof c.get&&"function"===typeof c.set){var e=c.get,f=c.set;Object.defineProperty(a,b,{configurable:!0,get:function(){return e.call(this)},set:function(a){d=""+a;f.call(this,a);}});Object.defineProperty(a,b,{enumerable:c.enumerable});return {getValue:function(){return d},setValue:function(a){d=""+a;},stopTracking:function(){a._valueTracker=
null;delete a[b];}}}}function Va(a){a._valueTracker||(a._valueTracker=Ua(a));}function Wa(a){if(!a)return !1;var b=a._valueTracker;if(!b)return !0;var c=b.getValue();var d="";a&&(d=Ta(a)?a.checked?"true":"false":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}function Xa(a){a=a||("undefined"!==typeof document?document:void 0);if("undefined"===typeof a)return null;try{return a.activeElement||a.body}catch(b){return a.body}}
function Ya(a,b){var c=b.checked;return A$1({},b,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=c?c:a._wrapperState.initialChecked})}function Za(a,b){var c=null==b.defaultValue?"":b.defaultValue,d=null!=b.checked?b.checked:b.defaultChecked;c=Sa(null!=b.value?b.value:c);a._wrapperState={initialChecked:d,initialValue:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value};}function ab(a,b){b=b.checked;null!=b&&ta(a,"checked",b,!1);}
function bb(a,b){ab(a,b);var c=Sa(b.value),d=b.type;if(null!=c)if("number"===d){if(0===c&&""===a.value||a.value!=c)a.value=""+c;}else a.value!==""+c&&(a.value=""+c);else if("submit"===d||"reset"===d){a.removeAttribute("value");return}b.hasOwnProperty("value")?cb(a,b.type,c):b.hasOwnProperty("defaultValue")&&cb(a,b.type,Sa(b.defaultValue));null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked);}
function db(a,b,c){if(b.hasOwnProperty("value")||b.hasOwnProperty("defaultValue")){var d=b.type;if(!("submit"!==d&&"reset"!==d||void 0!==b.value&&null!==b.value))return;b=""+a._wrapperState.initialValue;c||b===a.value||(a.value=b);a.defaultValue=b;}c=a.name;""!==c&&(a.name="");a.defaultChecked=!!a._wrapperState.initialChecked;""!==c&&(a.name=c);}
function cb(a,b,c){if("number"!==b||Xa(a.ownerDocument)!==a)null==c?a.defaultValue=""+a._wrapperState.initialValue:a.defaultValue!==""+c&&(a.defaultValue=""+c);}var eb=Array.isArray;
function fb(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e<c.length;e++)b["$"+c[e]]=!0;for(c=0;c<a.length;c++)e=b.hasOwnProperty("$"+a[c].value),a[c].selected!==e&&(a[c].selected=e),e&&d&&(a[c].defaultSelected=!0);}else {c=""+Sa(c);b=null;for(e=0;e<a.length;e++){if(a[e].value===c){a[e].selected=!0;d&&(a[e].defaultSelected=!0);return}null!==b||a[e].disabled||(b=a[e]);}null!==b&&(b.selected=!0);}}
function gb(a,b){if(null!=b.dangerouslySetInnerHTML)throw Error(p$2(91));return A$1({},b,{value:void 0,defaultValue:void 0,children:""+a._wrapperState.initialValue})}function hb(a,b){var c=b.value;if(null==c){c=b.children;b=b.defaultValue;if(null!=c){if(null!=b)throw Error(p$2(92));if(eb(c)){if(1<c.length)throw Error(p$2(93));c=c[0];}b=c;}null==b&&(b="");c=b;}a._wrapperState={initialValue:Sa(c)};}
function ib(a,b){var c=Sa(b.value),d=Sa(b.defaultValue);null!=c&&(c=""+c,c!==a.value&&(a.value=c),null==b.defaultValue&&a.defaultValue!==c&&(a.defaultValue=c));null!=d&&(a.defaultValue=""+d);}function jb(a){var b=a.textContent;b===a._wrapperState.initialValue&&""!==b&&null!==b&&(a.value=b);}function kb(a){switch(a){case "svg":return "http://www.w3.org/2000/svg";case "math":return "http://www.w3.org/1998/Math/MathML";default:return "http://www.w3.org/1999/xhtml"}}
function lb(a,b){return null==a||"http://www.w3.org/1999/xhtml"===a?kb(b):"http://www.w3.org/2000/svg"===a&&"foreignObject"===b?"http://www.w3.org/1999/xhtml":a}
var mb,nb=function(a){return "undefined"!==typeof MSApp&&MSApp.execUnsafeLocalFunction?function(b,c,d,e){MSApp.execUnsafeLocalFunction(function(){return a(b,c,d,e)});}:a}(function(a,b){if("http://www.w3.org/2000/svg"!==a.namespaceURI||"innerHTML"in a)a.innerHTML=b;else {mb=mb||document.createElement("div");mb.innerHTML="<svg>"+b.valueOf().toString()+"</svg>";for(b=mb.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild);}});
function ob(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b;}
var pb={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,
zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},qb=["Webkit","ms","Moz","O"];Object.keys(pb).forEach(function(a){qb.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);pb[b]=pb[a];});});function rb(a,b,c){return null==b||"boolean"===typeof b||""===b?"":c||"number"!==typeof b||0===b||pb.hasOwnProperty(a)&&pb[a]?(""+b).trim():b+"px"}
function sb(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf("--"),e=rb(c,b[c],d);"float"===c&&(c="cssFloat");d?a.setProperty(c,e):a[c]=e;}}var tb=A$1({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0});
function ub(a,b){if(b){if(tb[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML))throw Error(p$2(137,a));if(null!=b.dangerouslySetInnerHTML){if(null!=b.children)throw Error(p$2(60));if("object"!==typeof b.dangerouslySetInnerHTML||!("__html"in b.dangerouslySetInnerHTML))throw Error(p$2(61));}if(null!=b.style&&"object"!==typeof b.style)throw Error(p$2(62));}}
function vb(a,b){if(-1===a.indexOf("-"))return "string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return !1;default:return !0}}var wb=null;function xb(a){a=a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}var yb=null,zb=null,Ab=null;
function Bb(a){if(a=Cb(a)){if("function"!==typeof yb)throw Error(p$2(280));var b=a.stateNode;b&&(b=Db(b),yb(a.stateNode,a.type,b));}}function Eb(a){zb?Ab?Ab.push(a):Ab=[a]:zb=a;}function Fb(){if(zb){var a=zb,b=Ab;Ab=zb=null;Bb(a);if(b)for(a=0;a<b.length;a++)Bb(b[a]);}}function Gb(a,b){return a(b)}function Hb(){}var Ib=!1;function Jb(a,b,c){if(Ib)return a(b,c);Ib=!0;try{return Gb(a,b,c)}finally{if(Ib=!1,null!==zb||null!==Ab)Hb(),Fb();}}
function Kb(a,b){var c=a.stateNode;if(null===c)return null;var d=Db(c);if(null===d)return null;c=d[b];a:switch(b){case "onClick":case "onClickCapture":case "onDoubleClick":case "onDoubleClickCapture":case "onMouseDown":case "onMouseDownCapture":case "onMouseMove":case "onMouseMoveCapture":case "onMouseUp":case "onMouseUpCapture":case "onMouseEnter":(d=!d.disabled)||(a=a.type,d=!("button"===a||"input"===a||"select"===a||"textarea"===a));a=!d;break a;default:a=!1;}if(a)return null;if(c&&"function"!==
typeof c)throw Error(p$2(231,b,typeof c));return c}var Lb=!1;if(ia)try{var Mb={};Object.defineProperty(Mb,"passive",{get:function(){Lb=!0;}});window.addEventListener("test",Mb,Mb);window.removeEventListener("test",Mb,Mb);}catch(a){Lb=!1;}function Nb(a,b,c,d,e,f,g,h,k){var l=Array.prototype.slice.call(arguments,3);try{b.apply(c,l);}catch(m){this.onError(m);}}var Ob=!1,Pb=null,Qb=!1,Rb=null,Sb={onError:function(a){Ob=!0;Pb=a;}};function Tb(a,b,c,d,e,f,g,h,k){Ob=!1;Pb=null;Nb.apply(Sb,arguments);}
function Ub(a,b,c,d,e,f,g,h,k){Tb.apply(this,arguments);if(Ob){if(Ob){var l=Pb;Ob=!1;Pb=null;}else throw Error(p$2(198));Qb||(Qb=!0,Rb=l);}}function Vb(a){var b=a,c=a;if(a.alternate)for(;b.return;)b=b.return;else {a=b;do b=a,0!==(b.flags&4098)&&(c=b.return),a=b.return;while(a)}return 3===b.tag?c:null}function Wb(a){if(13===a.tag){var b=a.memoizedState;null===b&&(a=a.alternate,null!==a&&(b=a.memoizedState));if(null!==b)return b.dehydrated}return null}function Xb(a){if(Vb(a)!==a)throw Error(p$2(188));}
function Yb(a){var b=a.alternate;if(!b){b=Vb(a);if(null===b)throw Error(p$2(188));return b!==a?null:a}for(var c=a,d=b;;){var e=c.return;if(null===e)break;var f=e.alternate;if(null===f){d=e.return;if(null!==d){c=d;continue}break}if(e.child===f.child){for(f=e.child;f;){if(f===c)return Xb(e),a;if(f===d)return Xb(e),b;f=f.sibling;}throw Error(p$2(188));}if(c.return!==d.return)c=e,d=f;else {for(var g=!1,h=e.child;h;){if(h===c){g=!0;c=e;d=f;break}if(h===d){g=!0;d=e;c=f;break}h=h.sibling;}if(!g){for(h=f.child;h;){if(h===
c){g=!0;c=f;d=e;break}if(h===d){g=!0;d=f;c=e;break}h=h.sibling;}if(!g)throw Error(p$2(189));}}if(c.alternate!==d)throw Error(p$2(190));}if(3!==c.tag)throw Error(p$2(188));return c.stateNode.current===c?a:b}function Zb(a){a=Yb(a);return null!==a?$b(a):null}function $b(a){if(5===a.tag||6===a.tag)return a;for(a=a.child;null!==a;){var b=$b(a);if(null!==b)return b;a=a.sibling;}return null}
var ac=ca.unstable_scheduleCallback,bc=ca.unstable_cancelCallback,cc=ca.unstable_shouldYield,dc=ca.unstable_requestPaint,B=ca.unstable_now,ec=ca.unstable_getCurrentPriorityLevel,fc=ca.unstable_ImmediatePriority,gc=ca.unstable_UserBlockingPriority,hc=ca.unstable_NormalPriority,ic=ca.unstable_LowPriority,jc=ca.unstable_IdlePriority,kc=null,lc=null;function mc(a){if(lc&&"function"===typeof lc.onCommitFiberRoot)try{lc.onCommitFiberRoot(kc,a,void 0,128===(a.current.flags&128));}catch(b){}}
var oc=Math.clz32?Math.clz32:nc,pc=Math.log,qc=Math.LN2;function nc(a){a>>>=0;return 0===a?32:31-(pc(a)/qc|0)|0}var rc=64,sc=4194304;
function tc(a){switch(a&-a){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return a&4194240;case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:return a&130023424;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 1073741824;
default:return a}}function uc(a,b){var c=a.pendingLanes;if(0===c)return 0;var d=0,e=a.suspendedLanes,f=a.pingedLanes,g=c&268435455;if(0!==g){var h=g&~e;0!==h?d=tc(h):(f&=g,0!==f&&(d=tc(f)));}else g=c&~e,0!==g?d=tc(g):0!==f&&(d=tc(f));if(0===d)return 0;if(0!==b&&b!==d&&0===(b&e)&&(e=d&-d,f=b&-b,e>=f||16===e&&0!==(f&4194240)))return b;0!==(d&4)&&(d|=c&16);b=a.entangledLanes;if(0!==b)for(a=a.entanglements,b&=d;0<b;)c=31-oc(b),e=1<<c,d|=a[c],b&=~e;return d}
function vc(a,b){switch(a){case 1:case 2:case 4:return b+250;case 8:case 16:case 32:case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return b+5E3;case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:return -1;case 134217728:case 268435456:case 536870912:case 1073741824:return -1;default:return -1}}
function wc(a,b){for(var c=a.suspendedLanes,d=a.pingedLanes,e=a.expirationTimes,f=a.pendingLanes;0<f;){var g=31-oc(f),h=1<<g,k=e[g];if(-1===k){if(0===(h&c)||0!==(h&d))e[g]=vc(h,b);}else k<=b&&(a.expiredLanes|=h);f&=~h;}}function xc(a){a=a.pendingLanes&-1073741825;return 0!==a?a:a&1073741824?1073741824:0}function yc(){var a=rc;rc<<=1;0===(rc&4194240)&&(rc=64);return a}function zc(a){for(var b=[],c=0;31>c;c++)b.push(a);return b}
function Ac(a,b,c){a.pendingLanes|=b;536870912!==b&&(a.suspendedLanes=0,a.pingedLanes=0);a=a.eventTimes;b=31-oc(b);a[b]=c;}function Bc(a,b){var c=a.pendingLanes&~b;a.pendingLanes=b;a.suspendedLanes=0;a.pingedLanes=0;a.expiredLanes&=b;a.mutableReadLanes&=b;a.entangledLanes&=b;b=a.entanglements;var d=a.eventTimes;for(a=a.expirationTimes;0<c;){var e=31-oc(c),f=1<<e;b[e]=0;d[e]=-1;a[e]=-1;c&=~f;}}
function Cc(a,b){var c=a.entangledLanes|=b;for(a=a.entanglements;c;){var d=31-oc(c),e=1<<d;e&b|a[d]&b&&(a[d]|=b);c&=~e;}}var C=0;function Dc(a){a&=-a;return 1<a?4<a?0!==(a&268435455)?16:536870912:4:1}var Ec,Fc,Gc,Hc,Ic,Jc=!1,Kc=[],Lc=null,Mc=null,Nc=null,Oc=new Map,Pc=new Map,Qc=[],Rc="mousedown mouseup touchcancel touchend touchstart auxclick dblclick pointercancel pointerdown pointerup dragend dragstart drop compositionend compositionstart keydown keypress keyup input textInput copy cut paste click change contextmenu reset submit".split(" ");
function Sc(a,b){switch(a){case "focusin":case "focusout":Lc=null;break;case "dragenter":case "dragleave":Mc=null;break;case "mouseover":case "mouseout":Nc=null;break;case "pointerover":case "pointerout":Oc.delete(b.pointerId);break;case "gotpointercapture":case "lostpointercapture":Pc.delete(b.pointerId);}}
function Tc(a,b,c,d,e,f){if(null===a||a.nativeEvent!==f)return a={blockedOn:b,domEventName:c,eventSystemFlags:d,nativeEvent:f,targetContainers:[e]},null!==b&&(b=Cb(b),null!==b&&Fc(b)),a;a.eventSystemFlags|=d;b=a.targetContainers;null!==e&&-1===b.indexOf(e)&&b.push(e);return a}
function Uc(a,b,c,d,e){switch(b){case "focusin":return Lc=Tc(Lc,a,b,c,d,e),!0;case "dragenter":return Mc=Tc(Mc,a,b,c,d,e),!0;case "mouseover":return Nc=Tc(Nc,a,b,c,d,e),!0;case "pointerover":var f=e.pointerId;Oc.set(f,Tc(Oc.get(f)||null,a,b,c,d,e));return !0;case "gotpointercapture":return f=e.pointerId,Pc.set(f,Tc(Pc.get(f)||null,a,b,c,d,e)),!0}return !1}
function Vc(a){var b=Wc(a.target);if(null!==b){var c=Vb(b);if(null!==c)if(b=c.tag,13===b){if(b=Wb(c),null!==b){a.blockedOn=b;Ic(a.priority,function(){Gc(c);});return}}else if(3===b&&c.stateNode.current.memoizedState.isDehydrated){a.blockedOn=3===c.tag?c.stateNode.containerInfo:null;return}}a.blockedOn=null;}
function Xc(a){if(null!==a.blockedOn)return !1;for(var b=a.targetContainers;0<b.length;){var c=Yc(a.domEventName,a.eventSystemFlags,b[0],a.nativeEvent);if(null===c){c=a.nativeEvent;var d=new c.constructor(c.type,c);wb=d;c.target.dispatchEvent(d);wb=null;}else return b=Cb(c),null!==b&&Fc(b),a.blockedOn=c,!1;b.shift();}return !0}function Zc(a,b,c){Xc(a)&&c.delete(b);}function $c(){Jc=!1;null!==Lc&&Xc(Lc)&&(Lc=null);null!==Mc&&Xc(Mc)&&(Mc=null);null!==Nc&&Xc(Nc)&&(Nc=null);Oc.forEach(Zc);Pc.forEach(Zc);}
function ad(a,b){a.blockedOn===b&&(a.blockedOn=null,Jc||(Jc=!0,ca.unstable_scheduleCallback(ca.unstable_NormalPriority,$c)));}
function bd(a){function b(b){return ad(b,a)}if(0<Kc.length){ad(Kc[0],a);for(var c=1;c<Kc.length;c++){var d=Kc[c];d.blockedOn===a&&(d.blockedOn=null);}}null!==Lc&&ad(Lc,a);null!==Mc&&ad(Mc,a);null!==Nc&&ad(Nc,a);Oc.forEach(b);Pc.forEach(b);for(c=0;c<Qc.length;c++)d=Qc[c],d.blockedOn===a&&(d.blockedOn=null);for(;0<Qc.length&&(c=Qc[0],null===c.blockedOn);)Vc(c),null===c.blockedOn&&Qc.shift();}var cd=ua.ReactCurrentBatchConfig,dd=!0;
function ed(a,b,c,d){var e=C,f=cd.transition;cd.transition=null;try{C=1,fd(a,b,c,d);}finally{C=e,cd.transition=f;}}function gd(a,b,c,d){var e=C,f=cd.transition;cd.transition=null;try{C=4,fd(a,b,c,d);}finally{C=e,cd.transition=f;}}
function fd(a,b,c,d){if(dd){var e=Yc(a,b,c,d);if(null===e)hd(a,b,d,id,c),Sc(a,d);else if(Uc(e,a,b,c,d))d.stopPropagation();else if(Sc(a,d),b&4&&-1<Rc.indexOf(a)){for(;null!==e;){var f=Cb(e);null!==f&&Ec(f);f=Yc(a,b,c,d);null===f&&hd(a,b,d,id,c);if(f===e)break;e=f;}null!==e&&d.stopPropagation();}else hd(a,b,d,null,c);}}var id=null;
function Yc(a,b,c,d){id=null;a=xb(d);a=Wc(a);if(null!==a)if(b=Vb(a),null===b)a=null;else if(c=b.tag,13===c){a=Wb(b);if(null!==a)return a;a=null;}else if(3===c){if(b.stateNode.current.memoizedState.isDehydrated)return 3===b.tag?b.stateNode.containerInfo:null;a=null;}else b!==a&&(a=null);id=a;return null}
function jd(a){switch(a){case "cancel":case "click":case "close":case "contextmenu":case "copy":case "cut":case "auxclick":case "dblclick":case "dragend":case "dragstart":case "drop":case "focusin":case "focusout":case "input":case "invalid":case "keydown":case "keypress":case "keyup":case "mousedown":case "mouseup":case "paste":case "pause":case "play":case "pointercancel":case "pointerdown":case "pointerup":case "ratechange":case "reset":case "resize":case "seeked":case "submit":case "touchcancel":case "touchend":case "touchstart":case "volumechange":case "change":case "selectionchange":case "textInput":case "compositionstart":case "compositionend":case "compositionupdate":case "beforeblur":case "afterblur":case "beforeinput":case "blur":case "fullscreenchange":case "focus":case "hashchange":case "popstate":case "select":case "selectstart":return 1;case "drag":case "dragenter":case "dragexit":case "dragleave":case "dragover":case "mousemove":case "mouseout":case "mouseover":case "pointermove":case "pointerout":case "pointerover":case "scroll":case "toggle":case "touchmove":case "wheel":case "mouseenter":case "mouseleave":case "pointerenter":case "pointerleave":return 4;
case "message":switch(ec()){case fc:return 1;case gc:return 4;case hc:case ic:return 16;case jc:return 536870912;default:return 16}default:return 16}}var kd=null,ld=null,md=null;function nd(){if(md)return md;var a,b=ld,c=b.length,d,e="value"in kd?kd.value:kd.textContent,f=e.length;for(a=0;a<c&&b[a]===e[a];a++);var g=c-a;for(d=1;d<=g&&b[c-d]===e[f-d];d++);return md=e.slice(a,1<d?1-d:void 0)}
function od(a){var b=a.keyCode;"charCode"in a?(a=a.charCode,0===a&&13===b&&(a=13)):a=b;10===a&&(a=13);return 32<=a||13===a?a:0}function pd(){return !0}function qd(){return !1}
function rd(a){function b(b,d,e,f,g){this._reactName=b;this._targetInst=e;this.type=d;this.nativeEvent=f;this.target=g;this.currentTarget=null;for(var c in a)a.hasOwnProperty(c)&&(b=a[c],this[c]=b?b(f):f[c]);this.isDefaultPrevented=(null!=f.defaultPrevented?f.defaultPrevented:!1===f.returnValue)?pd:qd;this.isPropagationStopped=qd;return this}A$1(b.prototype,{preventDefault:function(){this.defaultPrevented=!0;var a=this.nativeEvent;a&&(a.preventDefault?a.preventDefault():"unknown"!==typeof a.returnValue&&
(a.returnValue=!1),this.isDefaultPrevented=pd);},stopPropagation:function(){var a=this.nativeEvent;a&&(a.stopPropagation?a.stopPropagation():"unknown"!==typeof a.cancelBubble&&(a.cancelBubble=!0),this.isPropagationStopped=pd);},persist:function(){},isPersistent:pd});return b}
var sd={eventPhase:0,bubbles:0,cancelable:0,timeStamp:function(a){return a.timeStamp||Date.now()},defaultPrevented:0,isTrusted:0},td=rd(sd),ud=A$1({},sd,{view:0,detail:0}),vd=rd(ud),wd,xd,yd,Ad=A$1({},ud,{screenX:0,screenY:0,clientX:0,clientY:0,pageX:0,pageY:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,getModifierState:zd,button:0,buttons:0,relatedTarget:function(a){return void 0===a.relatedTarget?a.fromElement===a.srcElement?a.toElement:a.fromElement:a.relatedTarget},movementX:function(a){if("movementX"in
a)return a.movementX;a!==yd&&(yd&&"mousemove"===a.type?(wd=a.screenX-yd.screenX,xd=a.screenY-yd.screenY):xd=wd=0,yd=a);return wd},movementY:function(a){return "movementY"in a?a.movementY:xd}}),Bd=rd(Ad),Cd=A$1({},Ad,{dataTransfer:0}),Dd=rd(Cd),Ed=A$1({},ud,{relatedTarget:0}),Fd=rd(Ed),Gd=A$1({},sd,{animationName:0,elapsedTime:0,pseudoElement:0}),Hd=rd(Gd),Id=A$1({},sd,{clipboardData:function(a){return "clipboardData"in a?a.clipboardData:window.clipboardData}}),Jd=rd(Id),Kd=A$1({},sd,{data:0}),Ld=rd(Kd),Md={Esc:"Escape",
Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},Nd={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4",116:"F5",117:"F6",118:"F7",
119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"},Od={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"};function Pd(a){var b=this.nativeEvent;return b.getModifierState?b.getModifierState(a):(a=Od[a])?!!b[a]:!1}function zd(){return Pd}
var Qd=A$1({},ud,{key:function(a){if(a.key){var b=Md[a.key]||a.key;if("Unidentified"!==b)return b}return "keypress"===a.type?(a=od(a),13===a?"Enter":String.fromCharCode(a)):"keydown"===a.type||"keyup"===a.type?Nd[a.keyCode]||"Unidentified":""},code:0,location:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,repeat:0,locale:0,getModifierState:zd,charCode:function(a){return "keypress"===a.type?od(a):0},keyCode:function(a){return "keydown"===a.type||"keyup"===a.type?a.keyCode:0},which:function(a){return "keypress"===
a.type?od(a):"keydown"===a.type||"keyup"===a.type?a.keyCode:0}}),Rd=rd(Qd),Sd=A$1({},Ad,{pointerId:0,width:0,height:0,pressure:0,tangentialPressure:0,tiltX:0,tiltY:0,twist:0,pointerType:0,isPrimary:0}),Td=rd(Sd),Ud=A$1({},ud,{touches:0,targetTouches:0,changedTouches:0,altKey:0,metaKey:0,ctrlKey:0,shiftKey:0,getModifierState:zd}),Vd=rd(Ud),Wd=A$1({},sd,{propertyName:0,elapsedTime:0,pseudoElement:0}),Xd=rd(Wd),Yd=A$1({},Ad,{deltaX:function(a){return "deltaX"in a?a.deltaX:"wheelDeltaX"in a?-a.wheelDeltaX:0},
deltaY:function(a){return "deltaY"in a?a.deltaY:"wheelDeltaY"in a?-a.wheelDeltaY:"wheelDelta"in a?-a.wheelDelta:0},deltaZ:0,deltaMode:0}),Zd=rd(Yd),$d=[9,13,27,32],ae=ia&&"CompositionEvent"in window,be=null;ia&&"documentMode"in document&&(be=document.documentMode);var ce=ia&&"TextEvent"in window&&!be,de=ia&&(!ae||be&&8<be&&11>=be),ee=String.fromCharCode(32),fe=!1;
function ge(a,b){switch(a){case "keyup":return -1!==$d.indexOf(b.keyCode);case "keydown":return 229!==b.keyCode;case "keypress":case "mousedown":case "focusout":return !0;default:return !1}}function he(a){a=a.detail;return "object"===typeof a&&"data"in a?a.data:null}var ie=!1;function je(a,b){switch(a){case "compositionend":return he(b);case "keypress":if(32!==b.which)return null;fe=!0;return ee;case "textInput":return a=b.data,a===ee&&fe?null:a;default:return null}}
function ke(a,b){if(ie)return "compositionend"===a||!ae&&ge(a,b)?(a=nd(),md=ld=kd=null,ie=!1,a):null;switch(a){case "paste":return null;case "keypress":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1<b.char.length)return b.char;if(b.which)return String.fromCharCode(b.which)}return null;case "compositionend":return de&&"ko"!==b.locale?null:b.data;default:return null}}
var le={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};function me(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return "input"===b?!!le[a.type]:"textarea"===b?!0:!1}function ne(a,b,c,d){Eb(d);b=oe(b,"onChange");0<b.length&&(c=new td("onChange","change",null,c,d),a.push({event:c,listeners:b}));}var pe=null,qe=null;function re(a){se(a,0);}function te(a){var b=ue(a);if(Wa(b))return a}
function ve(a,b){if("change"===a)return b}var we=!1;if(ia){var xe;if(ia){var ye="oninput"in document;if(!ye){var ze=document.createElement("div");ze.setAttribute("oninput","return;");ye="function"===typeof ze.oninput;}xe=ye;}else xe=!1;we=xe&&(!document.documentMode||9<document.documentMode);}function Ae(){pe&&(pe.detachEvent("onpropertychange",Be),qe=pe=null);}function Be(a){if("value"===a.propertyName&&te(qe)){var b=[];ne(b,qe,a,xb(a));Jb(re,b);}}
function Ce(a,b,c){"focusin"===a?(Ae(),pe=b,qe=c,pe.attachEvent("onpropertychange",Be)):"focusout"===a&&Ae();}function De(a){if("selectionchange"===a||"keyup"===a||"keydown"===a)return te(qe)}function Ee(a,b){if("click"===a)return te(b)}function Fe(a,b){if("input"===a||"change"===a)return te(b)}function Ge(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var He="function"===typeof Object.is?Object.is:Ge;
function Ie(a,b){if(He(a,b))return !0;if("object"!==typeof a||null===a||"object"!==typeof b||null===b)return !1;var c=Object.keys(a),d=Object.keys(b);if(c.length!==d.length)return !1;for(d=0;d<c.length;d++){var e=c[d];if(!ja.call(b,e)||!He(a[e],b[e]))return !1}return !0}function Je(a){for(;a&&a.firstChild;)a=a.firstChild;return a}
function Ke(a,b){var c=Je(a);a=0;for(var d;c;){if(3===c.nodeType){d=a+c.textContent.length;if(a<=b&&d>=b)return {node:c,offset:b-a};a=d;}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode;}c=void 0;}c=Je(c);}}function Le(a,b){return a&&b?a===b?!0:a&&3===a.nodeType?!1:b&&3===b.nodeType?Le(a,b.parentNode):"contains"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1}
function Me(){for(var a=window,b=Xa();b instanceof a.HTMLIFrameElement;){try{var c="string"===typeof b.contentWindow.location.href;}catch(d){c=!1;}if(c)a=b.contentWindow;else break;b=Xa(a.document);}return b}function Ne(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&("text"===a.type||"search"===a.type||"tel"===a.type||"url"===a.type||"password"===a.type)||"textarea"===b||"true"===a.contentEditable)}
function Oe(a){var b=Me(),c=a.focusedElem,d=a.selectionRange;if(b!==c&&c&&c.ownerDocument&&Le(c.ownerDocument.documentElement,c)){if(null!==d&&Ne(c))if(b=d.start,a=d.end,void 0===a&&(a=b),"selectionStart"in c)c.selectionStart=b,c.selectionEnd=Math.min(a,c.value.length);else if(a=(b=c.ownerDocument||document)&&b.defaultView||window,a.getSelection){a=a.getSelection();var e=c.textContent.length,f=Math.min(d.start,e);d=void 0===d.end?f:Math.min(d.end,e);!a.extend&&f>d&&(e=d,d=f,f=e);e=Ke(c,f);var g=Ke(c,
d);e&&g&&(1!==a.rangeCount||a.anchorNode!==e.node||a.anchorOffset!==e.offset||a.focusNode!==g.node||a.focusOffset!==g.offset)&&(b=b.createRange(),b.setStart(e.node,e.offset),a.removeAllRanges(),f>d?(a.addRange(b),a.extend(g.node,g.offset)):(b.setEnd(g.node,g.offset),a.addRange(b)));}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});"function"===typeof c.focus&&c.focus();for(c=0;c<b.length;c++)a=b[c],a.element.scrollLeft=a.left,a.element.scrollTop=a.top;}}
var Pe=ia&&"documentMode"in document&&11>=document.documentMode,Qe=null,Re=null,Se=null,Te=!1;
function Ue(a,b,c){var d=c.window===c?c.document:9===c.nodeType?c:c.ownerDocument;Te||null==Qe||Qe!==Xa(d)||(d=Qe,"selectionStart"in d&&Ne(d)?d={start:d.selectionStart,end:d.selectionEnd}:(d=(d.ownerDocument&&d.ownerDocument.defaultView||window).getSelection(),d={anchorNode:d.anchorNode,anchorOffset:d.anchorOffset,focusNode:d.focusNode,focusOffset:d.focusOffset}),Se&&Ie(Se,d)||(Se=d,d=oe(Re,"onSelect"),0<d.length&&(b=new td("onSelect","select",null,b,c),a.push({event:b,listeners:d}),b.target=Qe)));}
function Ve(a,b){var c={};c[a.toLowerCase()]=b.toLowerCase();c["Webkit"+a]="webkit"+b;c["Moz"+a]="moz"+b;return c}var We={animationend:Ve("Animation","AnimationEnd"),animationiteration:Ve("Animation","AnimationIteration"),animationstart:Ve("Animation","AnimationStart"),transitionend:Ve("Transition","TransitionEnd")},Xe={},Ye={};
ia&&(Ye=document.createElement("div").style,"AnimationEvent"in window||(delete We.animationend.animation,delete We.animationiteration.animation,delete We.animationstart.animation),"TransitionEvent"in window||delete We.transitionend.transition);function Ze(a){if(Xe[a])return Xe[a];if(!We[a])return a;var b=We[a],c;for(c in b)if(b.hasOwnProperty(c)&&c in Ye)return Xe[a]=b[c];return a}var $e=Ze("animationend"),af=Ze("animationiteration"),bf=Ze("animationstart"),cf=Ze("transitionend"),df=new Map,ef="abort auxClick cancel canPlay canPlayThrough click close contextMenu copy cut drag dragEnd dragEnter dragExit dragLeave dragOver dragStart drop durationChange emptied encrypted ended error gotPointerCapture input invalid keyDown keyPress keyUp load loadedData loadedMetadata loadStart lostPointerCapture mouseDown mouseMove mouseOut mouseOver mouseUp paste pause play playing pointerCancel pointerDown pointerMove pointerOut pointerOver pointerUp progress rateChange reset resize seeked seeking stalled submit suspend timeUpdate touchCancel touchEnd touchStart volumeChange scroll toggle touchMove waiting wheel".split(" ");
function ff(a,b){df.set(a,b);fa(b,[a]);}for(var gf=0;gf<ef.length;gf++){var hf=ef[gf],jf=hf.toLowerCase(),kf=hf[0].toUpperCase()+hf.slice(1);ff(jf,"on"+kf);}ff($e,"onAnimationEnd");ff(af,"onAnimationIteration");ff(bf,"onAnimationStart");ff("dblclick","onDoubleClick");ff("focusin","onFocus");ff("focusout","onBlur");ff(cf,"onTransitionEnd");ha("onMouseEnter",["mouseout","mouseover"]);ha("onMouseLeave",["mouseout","mouseover"]);ha("onPointerEnter",["pointerout","pointerover"]);
ha("onPointerLeave",["pointerout","pointerover"]);fa("onChange","change click focusin focusout input keydown keyup selectionchange".split(" "));fa("onSelect","focusout contextmenu dragend focusin keydown keyup mousedown mouseup selectionchange".split(" "));fa("onBeforeInput",["compositionend","keypress","textInput","paste"]);fa("onCompositionEnd","compositionend focusout keydown keypress keyup mousedown".split(" "));fa("onCompositionStart","compositionstart focusout keydown keypress keyup mousedown".split(" "));
fa("onCompositionUpdate","compositionupdate focusout keydown keypress keyup mousedown".split(" "));var lf="abort canplay canplaythrough durationchange emptied encrypted ended error loadeddata loadedmetadata loadstart pause play playing progress ratechange resize seeked seeking stalled suspend timeupdate volumechange waiting".split(" "),mf=new Set("cancel close invalid load scroll toggle".split(" ").concat(lf));
function nf(a,b,c){var d=a.type||"unknown-event";a.currentTarget=c;Ub(d,b,void 0,a);a.currentTarget=null;}
function se(a,b){b=0!==(b&4);for(var c=0;c<a.length;c++){var d=a[c],e=d.event;d=d.listeners;a:{var f=void 0;if(b)for(var g=d.length-1;0<=g;g--){var h=d[g],k=h.instance,l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;nf(e,h,l);f=k;}else for(g=0;g<d.length;g++){h=d[g];k=h.instance;l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;nf(e,h,l);f=k;}}}if(Qb)throw a=Rb,Qb=!1,Rb=null,a;}
function D(a,b){var c=b[of];void 0===c&&(c=b[of]=new Set);var d=a+"__bubble";c.has(d)||(pf(b,a,2,!1),c.add(d));}function qf(a,b,c){var d=0;b&&(d|=4);pf(c,a,d,b);}var rf="_reactListening"+Math.random().toString(36).slice(2);function sf(a){if(!a[rf]){a[rf]=!0;da.forEach(function(b){"selectionchange"!==b&&(mf.has(b)||qf(b,!1,a),qf(b,!0,a));});var b=9===a.nodeType?a:a.ownerDocument;null===b||b[rf]||(b[rf]=!0,qf("selectionchange",!1,b));}}
function pf(a,b,c,d){switch(jd(b)){case 1:var e=ed;break;case 4:e=gd;break;default:e=fd;}c=e.bind(null,b,c,a);e=void 0;!Lb||"touchstart"!==b&&"touchmove"!==b&&"wheel"!==b||(e=!0);d?void 0!==e?a.addEventListener(b,c,{capture:!0,passive:e}):a.addEventListener(b,c,!0):void 0!==e?a.addEventListener(b,c,{passive:e}):a.addEventListener(b,c,!1);}
function hd(a,b,c,d,e){var f=d;if(0===(b&1)&&0===(b&2)&&null!==d)a:for(;;){if(null===d)return;var g=d.tag;if(3===g||4===g){var h=d.stateNode.containerInfo;if(h===e||8===h.nodeType&&h.parentNode===e)break;if(4===g)for(g=d.return;null!==g;){var k=g.tag;if(3===k||4===k)if(k=g.stateNode.containerInfo,k===e||8===k.nodeType&&k.parentNode===e)return;g=g.return;}for(;null!==h;){g=Wc(h);if(null===g)return;k=g.tag;if(5===k||6===k){d=f=g;continue a}h=h.parentNode;}}d=d.return;}Jb(function(){var d=f,e=xb(c),g=[];
a:{var h=df.get(a);if(void 0!==h){var k=td,n=a;switch(a){case "keypress":if(0===od(c))break a;case "keydown":case "keyup":k=Rd;break;case "focusin":n="focus";k=Fd;break;case "focusout":n="blur";k=Fd;break;case "beforeblur":case "afterblur":k=Fd;break;case "click":if(2===c.button)break a;case "auxclick":case "dblclick":case "mousedown":case "mousemove":case "mouseup":case "mouseout":case "mouseover":case "contextmenu":k=Bd;break;case "drag":case "dragend":case "dragenter":case "dragexit":case "dragleave":case "dragover":case "dragstart":case "drop":k=
Dd;break;case "touchcancel":case "touchend":case "touchmove":case "touchstart":k=Vd;break;case $e:case af:case bf:k=Hd;break;case cf:k=Xd;break;case "scroll":k=vd;break;case "wheel":k=Zd;break;case "copy":case "cut":case "paste":k=Jd;break;case "gotpointercapture":case "lostpointercapture":case "pointercancel":case "pointerdown":case "pointermove":case "pointerout":case "pointerover":case "pointerup":k=Td;}var t=0!==(b&4),J=!t&&"scroll"===a,x=t?null!==h?h+"Capture":null:h;t=[];for(var w=d,u;null!==
w;){u=w;var F=u.stateNode;5===u.tag&&null!==F&&(u=F,null!==x&&(F=Kb(w,x),null!=F&&t.push(tf(w,F,u))));if(J)break;w=w.return;}0<t.length&&(h=new k(h,n,null,c,e),g.push({event:h,listeners:t}));}}if(0===(b&7)){a:{h="mouseover"===a||"pointerover"===a;k="mouseout"===a||"pointerout"===a;if(h&&c!==wb&&(n=c.relatedTarget||c.fromElement)&&(Wc(n)||n[uf]))break a;if(k||h){h=e.window===e?e:(h=e.ownerDocument)?h.defaultView||h.parentWindow:window;if(k){if(n=c.relatedTarget||c.toElement,k=d,n=n?Wc(n):null,null!==
n&&(J=Vb(n),n!==J||5!==n.tag&&6!==n.tag))n=null;}else k=null,n=d;if(k!==n){t=Bd;F="onMouseLeave";x="onMouseEnter";w="mouse";if("pointerout"===a||"pointerover"===a)t=Td,F="onPointerLeave",x="onPointerEnter",w="pointer";J=null==k?h:ue(k);u=null==n?h:ue(n);h=new t(F,w+"leave",k,c,e);h.target=J;h.relatedTarget=u;F=null;Wc(e)===d&&(t=new t(x,w+"enter",n,c,e),t.target=u,t.relatedTarget=J,F=t);J=F;if(k&&n)b:{t=k;x=n;w=0;for(u=t;u;u=vf(u))w++;u=0;for(F=x;F;F=vf(F))u++;for(;0<w-u;)t=vf(t),w--;for(;0<u-w;)x=
vf(x),u--;for(;w--;){if(t===x||null!==x&&t===x.alternate)break b;t=vf(t);x=vf(x);}t=null;}else t=null;null!==k&&wf(g,h,k,t,!1);null!==n&&null!==J&&wf(g,J,n,t,!0);}}}a:{h=d?ue(d):window;k=h.nodeName&&h.nodeName.toLowerCase();if("select"===k||"input"===k&&"file"===h.type)var na=ve;else if(me(h))if(we)na=Fe;else {na=De;var xa=Ce;}else (k=h.nodeName)&&"input"===k.toLowerCase()&&("checkbox"===h.type||"radio"===h.type)&&(na=Ee);if(na&&(na=na(a,d))){ne(g,na,c,e);break a}xa&&xa(a,h,d);"focusout"===a&&(xa=h._wrapperState)&&
xa.controlled&&"number"===h.type&&cb(h,"number",h.value);}xa=d?ue(d):window;switch(a){case "focusin":if(me(xa)||"true"===xa.contentEditable)Qe=xa,Re=d,Se=null;break;case "focusout":Se=Re=Qe=null;break;case "mousedown":Te=!0;break;case "contextmenu":case "mouseup":case "dragend":Te=!1;Ue(g,c,e);break;case "selectionchange":if(Pe)break;case "keydown":case "keyup":Ue(g,c,e);}var $a;if(ae)b:{switch(a){case "compositionstart":var ba="onCompositionStart";break b;case "compositionend":ba="onCompositionEnd";
break b;case "compositionupdate":ba="onCompositionUpdate";break b}ba=void 0;}else ie?ge(a,c)&&(ba="onCompositionEnd"):"keydown"===a&&229===c.keyCode&&(ba="onCompositionStart");ba&&(de&&"ko"!==c.locale&&(ie||"onCompositionStart"!==ba?"onCompositionEnd"===ba&&ie&&($a=nd()):(kd=e,ld="value"in kd?kd.value:kd.textContent,ie=!0)),xa=oe(d,ba),0<xa.length&&(ba=new Ld(ba,a,null,c,e),g.push({event:ba,listeners:xa}),$a?ba.data=$a:($a=he(c),null!==$a&&(ba.data=$a))));if($a=ce?je(a,c):ke(a,c))d=oe(d,"onBeforeInput"),
0<d.length&&(e=new Ld("onBeforeInput","beforeinput",null,c,e),g.push({event:e,listeners:d}),e.data=$a);}se(g,b);});}function tf(a,b,c){return {instance:a,listener:b,currentTarget:c}}function oe(a,b){for(var c=b+"Capture",d=[];null!==a;){var e=a,f=e.stateNode;5===e.tag&&null!==f&&(e=f,f=Kb(a,c),null!=f&&d.unshift(tf(a,f,e)),f=Kb(a,b),null!=f&&d.push(tf(a,f,e)));a=a.return;}return d}function vf(a){if(null===a)return null;do a=a.return;while(a&&5!==a.tag);return a?a:null}
function wf(a,b,c,d,e){for(var f=b._reactName,g=[];null!==c&&c!==d;){var h=c,k=h.alternate,l=h.stateNode;if(null!==k&&k===d)break;5===h.tag&&null!==l&&(h=l,e?(k=Kb(c,f),null!=k&&g.unshift(tf(c,k,h))):e||(k=Kb(c,f),null!=k&&g.push(tf(c,k,h))));c=c.return;}0!==g.length&&a.push({event:b,listeners:g});}var xf=/\r\n?/g,yf=/\u0000|\uFFFD/g;function zf(a){return ("string"===typeof a?a:""+a).replace(xf,"\n").replace(yf,"")}function Af(a,b,c){b=zf(b);if(zf(a)!==b&&c)throw Error(p$2(425));}function Bf(){}
var Cf=null,Df=null;function Ef(a,b){return "textarea"===a||"noscript"===a||"string"===typeof b.children||"number"===typeof b.children||"object"===typeof b.dangerouslySetInnerHTML&&null!==b.dangerouslySetInnerHTML&&null!=b.dangerouslySetInnerHTML.__html}
var Ff="function"===typeof setTimeout?setTimeout:void 0,Gf="function"===typeof clearTimeout?clearTimeout:void 0,Hf="function"===typeof Promise?Promise:void 0,Jf="function"===typeof queueMicrotask?queueMicrotask:"undefined"!==typeof Hf?function(a){return Hf.resolve(null).then(a).catch(If)}:Ff;function If(a){setTimeout(function(){throw a;});}
function Kf(a,b){var c=b,d=0;do{var e=c.nextSibling;a.removeChild(c);if(e&&8===e.nodeType)if(c=e.data,"/$"===c){if(0===d){a.removeChild(e);bd(b);return}d--;}else "$"!==c&&"$?"!==c&&"$!"!==c||d++;c=e;}while(c);bd(b);}function Lf(a){for(;null!=a;a=a.nextSibling){var b=a.nodeType;if(1===b||3===b)break;if(8===b){b=a.data;if("$"===b||"$!"===b||"$?"===b)break;if("/$"===b)return null}}return a}
function Mf(a){a=a.previousSibling;for(var b=0;a;){if(8===a.nodeType){var c=a.data;if("$"===c||"$!"===c||"$?"===c){if(0===b)return a;b--;}else "/$"===c&&b++;}a=a.previousSibling;}return null}var Nf=Math.random().toString(36).slice(2),Of="__reactFiber$"+Nf,Pf="__reactProps$"+Nf,uf="__reactContainer$"+Nf,of="__reactEvents$"+Nf,Qf="__reactListeners$"+Nf,Rf="__reactHandles$"+Nf;
function Wc(a){var b=a[Of];if(b)return b;for(var c=a.parentNode;c;){if(b=c[uf]||c[Of]){c=b.alternate;if(null!==b.child||null!==c&&null!==c.child)for(a=Mf(a);null!==a;){if(c=a[Of])return c;a=Mf(a);}return b}a=c;c=a.parentNode;}return null}function Cb(a){a=a[Of]||a[uf];return !a||5!==a.tag&&6!==a.tag&&13!==a.tag&&3!==a.tag?null:a}function ue(a){if(5===a.tag||6===a.tag)return a.stateNode;throw Error(p$2(33));}function Db(a){return a[Pf]||null}var Sf=[],Tf=-1;function Uf(a){return {current:a}}
function E(a){0>Tf||(a.current=Sf[Tf],Sf[Tf]=null,Tf--);}function G(a,b){Tf++;Sf[Tf]=a.current;a.current=b;}var Vf={},H=Uf(Vf),Wf=Uf(!1),Xf=Vf;function Yf(a,b){var c=a.type.contextTypes;if(!c)return Vf;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e}
function Zf(a){a=a.childContextTypes;return null!==a&&void 0!==a}function $f(){E(Wf);E(H);}function ag(a,b,c){if(H.current!==Vf)throw Error(p$2(168));G(H,b);G(Wf,c);}function bg(a,b,c){var d=a.stateNode;b=b.childContextTypes;if("function"!==typeof d.getChildContext)return c;d=d.getChildContext();for(var e in d)if(!(e in b))throw Error(p$2(108,Ra(a)||"Unknown",e));return A$1({},c,d)}
function cg(a){a=(a=a.stateNode)&&a.__reactInternalMemoizedMergedChildContext||Vf;Xf=H.current;G(H,a);G(Wf,Wf.current);return !0}function dg(a,b,c){var d=a.stateNode;if(!d)throw Error(p$2(169));c?(a=bg(a,b,Xf),d.__reactInternalMemoizedMergedChildContext=a,E(Wf),E(H),G(H,a)):E(Wf);G(Wf,c);}var eg=null,fg=!1,gg=!1;function hg(a){null===eg?eg=[a]:eg.push(a);}function ig(a){fg=!0;hg(a);}
function jg(){if(!gg&&null!==eg){gg=!0;var a=0,b=C;try{var c=eg;for(C=1;a<c.length;a++){var d=c[a];do d=d(!0);while(null!==d)}eg=null;fg=!1;}catch(e){throw null!==eg&&(eg=eg.slice(a+1)),ac(fc,jg),e;}finally{C=b,gg=!1;}}return null}var kg=[],lg=0,mg=null,ng=0,og=[],pg=0,qg=null,rg=1,sg="";function tg(a,b){kg[lg++]=ng;kg[lg++]=mg;mg=a;ng=b;}
function ug(a,b,c){og[pg++]=rg;og[pg++]=sg;og[pg++]=qg;qg=a;var d=rg;a=sg;var e=32-oc(d)-1;d&=~(1<<e);c+=1;var f=32-oc(b)+e;if(30<f){var g=e-e%5;f=(d&(1<<g)-1).toString(32);d>>=g;e-=g;rg=1<<32-oc(b)+e|c<<e|d;sg=f+a;}else rg=1<<f|c<<e|d,sg=a;}function vg(a){null!==a.return&&(tg(a,1),ug(a,1,0));}function wg(a){for(;a===mg;)mg=kg[--lg],kg[lg]=null,ng=kg[--lg],kg[lg]=null;for(;a===qg;)qg=og[--pg],og[pg]=null,sg=og[--pg],og[pg]=null,rg=og[--pg],og[pg]=null;}var xg=null,yg=null,I=!1,zg=null;
function Ag(a,b){var c=Bg(5,null,null,0);c.elementType="DELETED";c.stateNode=b;c.return=a;b=a.deletions;null===b?(a.deletions=[c],a.flags|=16):b.push(c);}
function Cg(a,b){switch(a.tag){case 5:var c=a.type;b=1!==b.nodeType||c.toLowerCase()!==b.nodeName.toLowerCase()?null:b;return null!==b?(a.stateNode=b,xg=a,yg=Lf(b.firstChild),!0):!1;case 6:return b=""===a.pendingProps||3!==b.nodeType?null:b,null!==b?(a.stateNode=b,xg=a,yg=null,!0):!1;case 13:return b=8!==b.nodeType?null:b,null!==b?(c=null!==qg?{id:rg,overflow:sg}:null,a.memoizedState={dehydrated:b,treeContext:c,retryLane:1073741824},c=Bg(18,null,null,0),c.stateNode=b,c.return=a,a.child=c,xg=a,yg=
null,!0):!1;default:return !1}}function Dg(a){return 0!==(a.mode&1)&&0===(a.flags&128)}function Eg(a){if(I){var b=yg;if(b){var c=b;if(!Cg(a,b)){if(Dg(a))throw Error(p$2(418));b=Lf(c.nextSibling);var d=xg;b&&Cg(a,b)?Ag(d,c):(a.flags=a.flags&-4097|2,I=!1,xg=a);}}else {if(Dg(a))throw Error(p$2(418));a.flags=a.flags&-4097|2;I=!1;xg=a;}}}function Fg(a){for(a=a.return;null!==a&&5!==a.tag&&3!==a.tag&&13!==a.tag;)a=a.return;xg=a;}
function Gg(a){if(a!==xg)return !1;if(!I)return Fg(a),I=!0,!1;var b;(b=3!==a.tag)&&!(b=5!==a.tag)&&(b=a.type,b="head"!==b&&"body"!==b&&!Ef(a.type,a.memoizedProps));if(b&&(b=yg)){if(Dg(a))throw Hg(),Error(p$2(418));for(;b;)Ag(a,b),b=Lf(b.nextSibling);}Fg(a);if(13===a.tag){a=a.memoizedState;a=null!==a?a.dehydrated:null;if(!a)throw Error(p$2(317));a:{a=a.nextSibling;for(b=0;a;){if(8===a.nodeType){var c=a.data;if("/$"===c){if(0===b){yg=Lf(a.nextSibling);break a}b--;}else "$"!==c&&"$!"!==c&&"$?"!==c||b++;}a=a.nextSibling;}yg=
null;}}else yg=xg?Lf(a.stateNode.nextSibling):null;return !0}function Hg(){for(var a=yg;a;)a=Lf(a.nextSibling);}function Ig(){yg=xg=null;I=!1;}function Jg(a){null===zg?zg=[a]:zg.push(a);}var Kg=ua.ReactCurrentBatchConfig;function Lg(a,b){if(a&&a.defaultProps){b=A$1({},b);a=a.defaultProps;for(var c in a)void 0===b[c]&&(b[c]=a[c]);return b}return b}var Mg=Uf(null),Ng=null,Og=null,Pg=null;function Qg(){Pg=Og=Ng=null;}function Rg(a){var b=Mg.current;E(Mg);a._currentValue=b;}
function Sg(a,b,c){for(;null!==a;){var d=a.alternate;(a.childLanes&b)!==b?(a.childLanes|=b,null!==d&&(d.childLanes|=b)):null!==d&&(d.childLanes&b)!==b&&(d.childLanes|=b);if(a===c)break;a=a.return;}}function Tg(a,b){Ng=a;Pg=Og=null;a=a.dependencies;null!==a&&null!==a.firstContext&&(0!==(a.lanes&b)&&(Ug=!0),a.firstContext=null);}
function Vg(a){var b=a._currentValue;if(Pg!==a)if(a={context:a,memoizedValue:b,next:null},null===Og){if(null===Ng)throw Error(p$2(308));Og=a;Ng.dependencies={lanes:0,firstContext:a};}else Og=Og.next=a;return b}var Wg=null;function Xg(a){null===Wg?Wg=[a]:Wg.push(a);}function Yg(a,b,c,d){var e=b.interleaved;null===e?(c.next=c,Xg(b)):(c.next=e.next,e.next=c);b.interleaved=c;return Zg(a,d)}
function Zg(a,b){a.lanes|=b;var c=a.alternate;null!==c&&(c.lanes|=b);c=a;for(a=a.return;null!==a;)a.childLanes|=b,c=a.alternate,null!==c&&(c.childLanes|=b),c=a,a=a.return;return 3===c.tag?c.stateNode:null}var $g=!1;function ah(a){a.updateQueue={baseState:a.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,interleaved:null,lanes:0},effects:null};}
function bh(a,b){a=a.updateQueue;b.updateQueue===a&&(b.updateQueue={baseState:a.baseState,firstBaseUpdate:a.firstBaseUpdate,lastBaseUpdate:a.lastBaseUpdate,shared:a.shared,effects:a.effects});}function ch(a,b){return {eventTime:a,lane:b,tag:0,payload:null,callback:null,next:null}}
function dh(a,b,c){var d=a.updateQueue;if(null===d)return null;d=d.shared;if(0!==(K&2)){var e=d.pending;null===e?b.next=b:(b.next=e.next,e.next=b);d.pending=b;return Zg(a,c)}e=d.interleaved;null===e?(b.next=b,Xg(d)):(b.next=e.next,e.next=b);d.interleaved=b;return Zg(a,c)}function eh(a,b,c){b=b.updateQueue;if(null!==b&&(b=b.shared,0!==(c&4194240))){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c);}}
function fh(a,b){var c=a.updateQueue,d=a.alternate;if(null!==d&&(d=d.updateQueue,c===d)){var e=null,f=null;c=c.firstBaseUpdate;if(null!==c){do{var g={eventTime:c.eventTime,lane:c.lane,tag:c.tag,payload:c.payload,callback:c.callback,next:null};null===f?e=f=g:f=f.next=g;c=c.next;}while(null!==c);null===f?e=f=b:f=f.next=b;}else e=f=b;c={baseState:d.baseState,firstBaseUpdate:e,lastBaseUpdate:f,shared:d.shared,effects:d.effects};a.updateQueue=c;return}a=c.lastBaseUpdate;null===a?c.firstBaseUpdate=b:a.next=
b;c.lastBaseUpdate=b;}
function gh(a,b,c,d){var e=a.updateQueue;$g=!1;var f=e.firstBaseUpdate,g=e.lastBaseUpdate,h=e.shared.pending;if(null!==h){e.shared.pending=null;var k=h,l=k.next;k.next=null;null===g?f=l:g.next=l;g=k;var m=a.alternate;null!==m&&(m=m.updateQueue,h=m.lastBaseUpdate,h!==g&&(null===h?m.firstBaseUpdate=l:h.next=l,m.lastBaseUpdate=k));}if(null!==f){var q=e.baseState;g=0;m=l=k=null;h=f;do{var r=h.lane,y=h.eventTime;if((d&r)===r){null!==m&&(m=m.next={eventTime:y,lane:0,tag:h.tag,payload:h.payload,callback:h.callback,
next:null});a:{var n=a,t=h;r=b;y=c;switch(t.tag){case 1:n=t.payload;if("function"===typeof n){q=n.call(y,q,r);break a}q=n;break a;case 3:n.flags=n.flags&-65537|128;case 0:n=t.payload;r="function"===typeof n?n.call(y,q,r):n;if(null===r||void 0===r)break a;q=A$1({},q,r);break a;case 2:$g=!0;}}null!==h.callback&&0!==h.lane&&(a.flags|=64,r=e.effects,null===r?e.effects=[h]:r.push(h));}else y={eventTime:y,lane:r,tag:h.tag,payload:h.payload,callback:h.callback,next:null},null===m?(l=m=y,k=q):m=m.next=y,g|=r;
h=h.next;if(null===h)if(h=e.shared.pending,null===h)break;else r=h,h=r.next,r.next=null,e.lastBaseUpdate=r,e.shared.pending=null;}while(1);null===m&&(k=q);e.baseState=k;e.firstBaseUpdate=l;e.lastBaseUpdate=m;b=e.shared.interleaved;if(null!==b){e=b;do g|=e.lane,e=e.next;while(e!==b)}else null===f&&(e.shared.lanes=0);hh|=g;a.lanes=g;a.memoizedState=q;}}
function ih(a,b,c){a=b.effects;b.effects=null;if(null!==a)for(b=0;b<a.length;b++){var d=a[b],e=d.callback;if(null!==e){d.callback=null;d=c;if("function"!==typeof e)throw Error(p$2(191,e));e.call(d);}}}var jh=(new aa.Component).refs;function kh(a,b,c,d){b=a.memoizedState;c=c(d,b);c=null===c||void 0===c?b:A$1({},b,c);a.memoizedState=c;0===a.lanes&&(a.updateQueue.baseState=c);}
var nh={isMounted:function(a){return (a=a._reactInternals)?Vb(a)===a:!1},enqueueSetState:function(a,b,c){a=a._reactInternals;var d=L(),e=lh(a),f=ch(d,e);f.payload=b;void 0!==c&&null!==c&&(f.callback=c);b=dh(a,f,e);null!==b&&(mh(b,a,e,d),eh(b,a,e));},enqueueReplaceState:function(a,b,c){a=a._reactInternals;var d=L(),e=lh(a),f=ch(d,e);f.tag=1;f.payload=b;void 0!==c&&null!==c&&(f.callback=c);b=dh(a,f,e);null!==b&&(mh(b,a,e,d),eh(b,a,e));},enqueueForceUpdate:function(a,b){a=a._reactInternals;var c=L(),d=
lh(a),e=ch(c,d);e.tag=2;void 0!==b&&null!==b&&(e.callback=b);b=dh(a,e,d);null!==b&&(mh(b,a,d,c),eh(b,a,d));}};function oh(a,b,c,d,e,f,g){a=a.stateNode;return "function"===typeof a.shouldComponentUpdate?a.shouldComponentUpdate(d,f,g):b.prototype&&b.prototype.isPureReactComponent?!Ie(c,d)||!Ie(e,f):!0}
function ph(a,b,c){var d=!1,e=Vf;var f=b.contextType;"object"===typeof f&&null!==f?f=Vg(f):(e=Zf(b)?Xf:H.current,d=b.contextTypes,f=(d=null!==d&&void 0!==d)?Yf(a,e):Vf);b=new b(c,f);a.memoizedState=null!==b.state&&void 0!==b.state?b.state:null;b.updater=nh;a.stateNode=b;b._reactInternals=a;d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=e,a.__reactInternalMemoizedMaskedChildContext=f);return b}
function qh(a,b,c,d){a=b.state;"function"===typeof b.componentWillReceiveProps&&b.componentWillReceiveProps(c,d);"function"===typeof b.UNSAFE_componentWillReceiveProps&&b.UNSAFE_componentWillReceiveProps(c,d);b.state!==a&&nh.enqueueReplaceState(b,b.state,null);}
function rh(a,b,c,d){var e=a.stateNode;e.props=c;e.state=a.memoizedState;e.refs=jh;ah(a);var f=b.contextType;"object"===typeof f&&null!==f?e.context=Vg(f):(f=Zf(b)?Xf:H.current,e.context=Yf(a,f));e.state=a.memoizedState;f=b.getDerivedStateFromProps;"function"===typeof f&&(kh(a,b,f,c),e.state=a.memoizedState);"function"===typeof b.getDerivedStateFromProps||"function"===typeof e.getSnapshotBeforeUpdate||"function"!==typeof e.UNSAFE_componentWillMount&&"function"!==typeof e.componentWillMount||(b=e.state,
"function"===typeof e.componentWillMount&&e.componentWillMount(),"function"===typeof e.UNSAFE_componentWillMount&&e.UNSAFE_componentWillMount(),b!==e.state&&nh.enqueueReplaceState(e,e.state,null),gh(a,c,e,d),e.state=a.memoizedState);"function"===typeof e.componentDidMount&&(a.flags|=4194308);}
function sh(a,b,c){a=c.ref;if(null!==a&&"function"!==typeof a&&"object"!==typeof a){if(c._owner){c=c._owner;if(c){if(1!==c.tag)throw Error(p$2(309));var d=c.stateNode;}if(!d)throw Error(p$2(147,a));var e=d,f=""+a;if(null!==b&&null!==b.ref&&"function"===typeof b.ref&&b.ref._stringRef===f)return b.ref;b=function(a){var b=e.refs;b===jh&&(b=e.refs={});null===a?delete b[f]:b[f]=a;};b._stringRef=f;return b}if("string"!==typeof a)throw Error(p$2(284));if(!c._owner)throw Error(p$2(290,a));}return a}
function th(a,b){a=Object.prototype.toString.call(b);throw Error(p$2(31,"[object Object]"===a?"object with keys {"+Object.keys(b).join(", ")+"}":a));}function uh(a){var b=a._init;return b(a._payload)}
function vh(a){function b(b,c){if(a){var d=b.deletions;null===d?(b.deletions=[c],b.flags|=16):d.push(c);}}function c(c,d){if(!a)return null;for(;null!==d;)b(c,d),d=d.sibling;return null}function d(a,b){for(a=new Map;null!==b;)null!==b.key?a.set(b.key,b):a.set(b.index,b),b=b.sibling;return a}function e(a,b){a=wh(a,b);a.index=0;a.sibling=null;return a}function f(b,c,d){b.index=d;if(!a)return b.flags|=1048576,c;d=b.alternate;if(null!==d)return d=d.index,d<c?(b.flags|=2,c):d;b.flags|=2;return c}function g(b){a&&
null===b.alternate&&(b.flags|=2);return b}function h(a,b,c,d){if(null===b||6!==b.tag)return b=xh(c,a.mode,d),b.return=a,b;b=e(b,c);b.return=a;return b}function k(a,b,c,d){var f=c.type;if(f===ya)return m(a,b,c.props.children,d,c.key);if(null!==b&&(b.elementType===f||"object"===typeof f&&null!==f&&f.$$typeof===Ha&&uh(f)===b.type))return d=e(b,c.props),d.ref=sh(a,b,c),d.return=a,d;d=yh(c.type,c.key,c.props,null,a.mode,d);d.ref=sh(a,b,c);d.return=a;return d}function l(a,b,c,d){if(null===b||4!==b.tag||
b.stateNode.containerInfo!==c.containerInfo||b.stateNode.implementation!==c.implementation)return b=zh(c,a.mode,d),b.return=a,b;b=e(b,c.children||[]);b.return=a;return b}function m(a,b,c,d,f){if(null===b||7!==b.tag)return b=Ah(c,a.mode,d,f),b.return=a,b;b=e(b,c);b.return=a;return b}function q(a,b,c){if("string"===typeof b&&""!==b||"number"===typeof b)return b=xh(""+b,a.mode,c),b.return=a,b;if("object"===typeof b&&null!==b){switch(b.$$typeof){case va:return c=yh(b.type,b.key,b.props,null,a.mode,c),
c.ref=sh(a,null,b),c.return=a,c;case wa:return b=zh(b,a.mode,c),b.return=a,b;case Ha:var d=b._init;return q(a,d(b._payload),c)}if(eb(b)||Ka(b))return b=Ah(b,a.mode,c,null),b.return=a,b;th(a,b);}return null}function r(a,b,c,d){var e=null!==b?b.key:null;if("string"===typeof c&&""!==c||"number"===typeof c)return null!==e?null:h(a,b,""+c,d);if("object"===typeof c&&null!==c){switch(c.$$typeof){case va:return c.key===e?k(a,b,c,d):null;case wa:return c.key===e?l(a,b,c,d):null;case Ha:return e=c._init,r(a,
b,e(c._payload),d)}if(eb(c)||Ka(c))return null!==e?null:m(a,b,c,d,null);th(a,c);}return null}function y(a,b,c,d,e){if("string"===typeof d&&""!==d||"number"===typeof d)return a=a.get(c)||null,h(b,a,""+d,e);if("object"===typeof d&&null!==d){switch(d.$$typeof){case va:return a=a.get(null===d.key?c:d.key)||null,k(b,a,d,e);case wa:return a=a.get(null===d.key?c:d.key)||null,l(b,a,d,e);case Ha:var f=d._init;return y(a,b,c,f(d._payload),e)}if(eb(d)||Ka(d))return a=a.get(c)||null,m(b,a,d,e,null);th(b,d);}return null}
function n(e,g,h,k){for(var l=null,m=null,u=g,w=g=0,x=null;null!==u&&w<h.length;w++){u.index>w?(x=u,u=null):x=u.sibling;var n=r(e,u,h[w],k);if(null===n){null===u&&(u=x);break}a&&u&&null===n.alternate&&b(e,u);g=f(n,g,w);null===m?l=n:m.sibling=n;m=n;u=x;}if(w===h.length)return c(e,u),I&&tg(e,w),l;if(null===u){for(;w<h.length;w++)u=q(e,h[w],k),null!==u&&(g=f(u,g,w),null===m?l=u:m.sibling=u,m=u);I&&tg(e,w);return l}for(u=d(e,u);w<h.length;w++)x=y(u,e,w,h[w],k),null!==x&&(a&&null!==x.alternate&&u.delete(null===
x.key?w:x.key),g=f(x,g,w),null===m?l=x:m.sibling=x,m=x);a&&u.forEach(function(a){return b(e,a)});I&&tg(e,w);return l}function t(e,g,h,k){var l=Ka(h);if("function"!==typeof l)throw Error(p$2(150));h=l.call(h);if(null==h)throw Error(p$2(151));for(var u=l=null,m=g,w=g=0,x=null,n=h.next();null!==m&&!n.done;w++,n=h.next()){m.index>w?(x=m,m=null):x=m.sibling;var t=r(e,m,n.value,k);if(null===t){null===m&&(m=x);break}a&&m&&null===t.alternate&&b(e,m);g=f(t,g,w);null===u?l=t:u.sibling=t;u=t;m=x;}if(n.done)return c(e,
m),I&&tg(e,w),l;if(null===m){for(;!n.done;w++,n=h.next())n=q(e,n.value,k),null!==n&&(g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);I&&tg(e,w);return l}for(m=d(e,m);!n.done;w++,n=h.next())n=y(m,e,w,n.value,k),null!==n&&(a&&null!==n.alternate&&m.delete(null===n.key?w:n.key),g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);a&&m.forEach(function(a){return b(e,a)});I&&tg(e,w);return l}function J(a,d,f,h){"object"===typeof f&&null!==f&&f.type===ya&&null===f.key&&(f=f.props.children);if("object"===typeof f&&null!==f){switch(f.$$typeof){case va:a:{for(var k=
f.key,l=d;null!==l;){if(l.key===k){k=f.type;if(k===ya){if(7===l.tag){c(a,l.sibling);d=e(l,f.props.children);d.return=a;a=d;break a}}else if(l.elementType===k||"object"===typeof k&&null!==k&&k.$$typeof===Ha&&uh(k)===l.type){c(a,l.sibling);d=e(l,f.props);d.ref=sh(a,l,f);d.return=a;a=d;break a}c(a,l);break}else b(a,l);l=l.sibling;}f.type===ya?(d=Ah(f.props.children,a.mode,h,f.key),d.return=a,a=d):(h=yh(f.type,f.key,f.props,null,a.mode,h),h.ref=sh(a,d,f),h.return=a,a=h);}return g(a);case wa:a:{for(l=f.key;null!==
d;){if(d.key===l)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[]);d.return=a;a=d;break a}else {c(a,d);break}else b(a,d);d=d.sibling;}d=zh(f,a.mode,h);d.return=a;a=d;}return g(a);case Ha:return l=f._init,J(a,d,l(f._payload),h)}if(eb(f))return n(a,d,f,h);if(Ka(f))return t(a,d,f,h);th(a,f);}return "string"===typeof f&&""!==f||"number"===typeof f?(f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f),d.return=a,a=d):
(c(a,d),d=xh(f,a.mode,h),d.return=a,a=d),g(a)):c(a,d)}return J}var Bh=vh(!0),Ch=vh(!1),Dh={},Eh=Uf(Dh),Fh=Uf(Dh),Gh=Uf(Dh);function Hh(a){if(a===Dh)throw Error(p$2(174));return a}function Ih(a,b){G(Gh,b);G(Fh,a);G(Eh,Dh);a=b.nodeType;switch(a){case 9:case 11:b=(b=b.documentElement)?b.namespaceURI:lb(null,"");break;default:a=8===a?b.parentNode:b,b=a.namespaceURI||null,a=a.tagName,b=lb(b,a);}E(Eh);G(Eh,b);}function Jh(){E(Eh);E(Fh);E(Gh);}
function Kh(a){Hh(Gh.current);var b=Hh(Eh.current);var c=lb(b,a.type);b!==c&&(G(Fh,a),G(Eh,c));}function Lh(a){Fh.current===a&&(E(Eh),E(Fh));}var M=Uf(0);
function Mh(a){for(var b=a;null!==b;){if(13===b.tag){var c=b.memoizedState;if(null!==c&&(c=c.dehydrated,null===c||"$?"===c.data||"$!"===c.data))return b}else if(19===b.tag&&void 0!==b.memoizedProps.revealOrder){if(0!==(b.flags&128))return b}else if(null!==b.child){b.child.return=b;b=b.child;continue}if(b===a)break;for(;null===b.sibling;){if(null===b.return||b.return===a)return null;b=b.return;}b.sibling.return=b.return;b=b.sibling;}return null}var Nh=[];
function Oh(){for(var a=0;a<Nh.length;a++)Nh[a]._workInProgressVersionPrimary=null;Nh.length=0;}var Ph=ua.ReactCurrentDispatcher,Qh=ua.ReactCurrentBatchConfig,Rh=0,N=null,O=null,P=null,Sh=!1,Th=!1,Uh=0,Vh=0;function Q(){throw Error(p$2(321));}function Wh(a,b){if(null===b)return !1;for(var c=0;c<b.length&&c<a.length;c++)if(!He(a[c],b[c]))return !1;return !0}
function Xh(a,b,c,d,e,f){Rh=f;N=b;b.memoizedState=null;b.updateQueue=null;b.lanes=0;Ph.current=null===a||null===a.memoizedState?Yh:Zh;a=c(d,e);if(Th){f=0;do{Th=!1;Uh=0;if(25<=f)throw Error(p$2(301));f+=1;P=O=null;b.updateQueue=null;Ph.current=$h;a=c(d,e);}while(Th)}Ph.current=ai;b=null!==O&&null!==O.next;Rh=0;P=O=N=null;Sh=!1;if(b)throw Error(p$2(300));return a}function bi(){var a=0!==Uh;Uh=0;return a}
function ci(){var a={memoizedState:null,baseState:null,baseQueue:null,queue:null,next:null};null===P?N.memoizedState=P=a:P=P.next=a;return P}function di(){if(null===O){var a=N.alternate;a=null!==a?a.memoizedState:null;}else a=O.next;var b=null===P?N.memoizedState:P.next;if(null!==b)P=b,O=a;else {if(null===a)throw Error(p$2(310));O=a;a={memoizedState:O.memoizedState,baseState:O.baseState,baseQueue:O.baseQueue,queue:O.queue,next:null};null===P?N.memoizedState=P=a:P=P.next=a;}return P}
function ei(a,b){return "function"===typeof b?b(a):b}
function fi(a){var b=di(),c=b.queue;if(null===c)throw Error(p$2(311));c.lastRenderedReducer=a;var d=O,e=d.baseQueue,f=c.pending;if(null!==f){if(null!==e){var g=e.next;e.next=f.next;f.next=g;}d.baseQueue=e=f;c.pending=null;}if(null!==e){f=e.next;d=d.baseState;var h=g=null,k=null,l=f;do{var m=l.lane;if((Rh&m)===m)null!==k&&(k=k.next={lane:0,action:l.action,hasEagerState:l.hasEagerState,eagerState:l.eagerState,next:null}),d=l.hasEagerState?l.eagerState:a(d,l.action);else {var q={lane:m,action:l.action,hasEagerState:l.hasEagerState,
eagerState:l.eagerState,next:null};null===k?(h=k=q,g=d):k=k.next=q;N.lanes|=m;hh|=m;}l=l.next;}while(null!==l&&l!==f);null===k?g=d:k.next=h;He(d,b.memoizedState)||(Ug=!0);b.memoizedState=d;b.baseState=g;b.baseQueue=k;c.lastRenderedState=d;}a=c.interleaved;if(null!==a){e=a;do f=e.lane,N.lanes|=f,hh|=f,e=e.next;while(e!==a)}else null===e&&(c.lanes=0);return [b.memoizedState,c.dispatch]}
function gi(a){var b=di(),c=b.queue;if(null===c)throw Error(p$2(311));c.lastRenderedReducer=a;var d=c.dispatch,e=c.pending,f=b.memoizedState;if(null!==e){c.pending=null;var g=e=e.next;do f=a(f,g.action),g=g.next;while(g!==e);He(f,b.memoizedState)||(Ug=!0);b.memoizedState=f;null===b.baseQueue&&(b.baseState=f);c.lastRenderedState=f;}return [f,d]}function hi(){}
function ii(a,b){var c=N,d=di(),e=b(),f=!He(d.memoizedState,e);f&&(d.memoizedState=e,Ug=!0);d=d.queue;ji(ki.bind(null,c,d,a),[a]);if(d.getSnapshot!==b||f||null!==P&&P.memoizedState.tag&1){c.flags|=2048;li(9,mi.bind(null,c,d,e,b),void 0,null);if(null===R)throw Error(p$2(349));0!==(Rh&30)||ni(c,b,e);}return e}function ni(a,b,c){a.flags|=16384;a={getSnapshot:b,value:c};b=N.updateQueue;null===b?(b={lastEffect:null,stores:null},N.updateQueue=b,b.stores=[a]):(c=b.stores,null===c?b.stores=[a]:c.push(a));}
function mi(a,b,c,d){b.value=c;b.getSnapshot=d;oi(b)&&pi(a);}function ki(a,b,c){return c(function(){oi(b)&&pi(a);})}function oi(a){var b=a.getSnapshot;a=a.value;try{var c=b();return !He(a,c)}catch(d){return !0}}function pi(a){var b=Zg(a,1);null!==b&&mh(b,a,1,-1);}
function qi(a){var b=ci();"function"===typeof a&&(a=a());b.memoizedState=b.baseState=a;a={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:ei,lastRenderedState:a};b.queue=a;a=a.dispatch=ri.bind(null,N,a);return [b.memoizedState,a]}
function li(a,b,c,d){a={tag:a,create:b,destroy:c,deps:d,next:null};b=N.updateQueue;null===b?(b={lastEffect:null,stores:null},N.updateQueue=b,b.lastEffect=a.next=a):(c=b.lastEffect,null===c?b.lastEffect=a.next=a:(d=c.next,c.next=a,a.next=d,b.lastEffect=a));return a}function si(){return di().memoizedState}function ti(a,b,c,d){var e=ci();N.flags|=a;e.memoizedState=li(1|b,c,void 0,void 0===d?null:d);}
function ui(a,b,c,d){var e=di();d=void 0===d?null:d;var f=void 0;if(null!==O){var g=O.memoizedState;f=g.destroy;if(null!==d&&Wh(d,g.deps)){e.memoizedState=li(b,c,f,d);return}}N.flags|=a;e.memoizedState=li(1|b,c,f,d);}function vi(a,b){return ti(8390656,8,a,b)}function ji(a,b){return ui(2048,8,a,b)}function wi(a,b){return ui(4,2,a,b)}function xi(a,b){return ui(4,4,a,b)}
function yi(a,b){if("function"===typeof b)return a=a(),b(a),function(){b(null);};if(null!==b&&void 0!==b)return a=a(),b.current=a,function(){b.current=null;}}function zi(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return ui(4,4,yi.bind(null,b,a),c)}function Ai(){}function Bi(a,b){var c=di();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Wh(b,d[1]))return d[0];c.memoizedState=[a,b];return a}
function Ci(a,b){var c=di();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Wh(b,d[1]))return d[0];a=a();c.memoizedState=[a,b];return a}function Di(a,b,c){if(0===(Rh&21))return a.baseState&&(a.baseState=!1,Ug=!0),a.memoizedState=c;He(c,b)||(c=yc(),N.lanes|=c,hh|=c,a.baseState=!0);return b}function Ei(a,b){var c=C;C=0!==c&&4>c?c:4;a(!0);var d=Qh.transition;Qh.transition={};try{a(!1),b();}finally{C=c,Qh.transition=d;}}function Fi(){return di().memoizedState}
function Gi(a,b,c){var d=lh(a);c={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(Hi(a))Ii(b,c);else if(c=Yg(a,b,c,d),null!==c){var e=L();mh(c,a,d,e);Ji(c,b,d);}}
function ri(a,b,c){var d=lh(a),e={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(Hi(a))Ii(b,e);else {var f=a.alternate;if(0===a.lanes&&(null===f||0===f.lanes)&&(f=b.lastRenderedReducer,null!==f))try{var g=b.lastRenderedState,h=f(g,c);e.hasEagerState=!0;e.eagerState=h;if(He(h,g)){var k=b.interleaved;null===k?(e.next=e,Xg(b)):(e.next=k.next,k.next=e);b.interleaved=e;return}}catch(l){}finally{}c=Yg(a,b,e,d);null!==c&&(e=L(),mh(c,a,d,e),Ji(c,b,d));}}
function Hi(a){var b=a.alternate;return a===N||null!==b&&b===N}function Ii(a,b){Th=Sh=!0;var c=a.pending;null===c?b.next=b:(b.next=c.next,c.next=b);a.pending=b;}function Ji(a,b,c){if(0!==(c&4194240)){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c);}}
var ai={readContext:Vg,useCallback:Q,useContext:Q,useEffect:Q,useImperativeHandle:Q,useInsertionEffect:Q,useLayoutEffect:Q,useMemo:Q,useReducer:Q,useRef:Q,useState:Q,useDebugValue:Q,useDeferredValue:Q,useTransition:Q,useMutableSource:Q,useSyncExternalStore:Q,useId:Q,unstable_isNewReconciler:!1},Yh={readContext:Vg,useCallback:function(a,b){ci().memoizedState=[a,void 0===b?null:b];return a},useContext:Vg,useEffect:vi,useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return ti(4194308,
4,yi.bind(null,b,a),c)},useLayoutEffect:function(a,b){return ti(4194308,4,a,b)},useInsertionEffect:function(a,b){return ti(4,2,a,b)},useMemo:function(a,b){var c=ci();b=void 0===b?null:b;a=a();c.memoizedState=[a,b];return a},useReducer:function(a,b,c){var d=ci();b=void 0!==c?c(b):b;d.memoizedState=d.baseState=b;a={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:a,lastRenderedState:b};d.queue=a;a=a.dispatch=Gi.bind(null,N,a);return [d.memoizedState,a]},useRef:function(a){var b=
ci();a={current:a};return b.memoizedState=a},useState:qi,useDebugValue:Ai,useDeferredValue:function(a){return ci().memoizedState=a},useTransition:function(){var a=qi(!1),b=a[0];a=Ei.bind(null,a[1]);ci().memoizedState=a;return [b,a]},useMutableSource:function(){},useSyncExternalStore:function(a,b,c){var d=N,e=ci();if(I){if(void 0===c)throw Error(p$2(407));c=c();}else {c=b();if(null===R)throw Error(p$2(349));0!==(Rh&30)||ni(d,b,c);}e.memoizedState=c;var f={value:c,getSnapshot:b};e.queue=f;vi(ki.bind(null,d,
f,a),[a]);d.flags|=2048;li(9,mi.bind(null,d,f,c,b),void 0,null);return c},useId:function(){var a=ci(),b=R.identifierPrefix;if(I){var c=sg;var d=rg;c=(d&~(1<<32-oc(d)-1)).toString(32)+c;b=":"+b+"R"+c;c=Uh++;0<c&&(b+="H"+c.toString(32));b+=":";}else c=Vh++,b=":"+b+"r"+c.toString(32)+":";return a.memoizedState=b},unstable_isNewReconciler:!1},Zh={readContext:Vg,useCallback:Bi,useContext:Vg,useEffect:ji,useImperativeHandle:zi,useInsertionEffect:wi,useLayoutEffect:xi,useMemo:Ci,useReducer:fi,useRef:si,useState:function(){return fi(ei)},
useDebugValue:Ai,useDeferredValue:function(a){var b=di();return Di(b,O.memoizedState,a)},useTransition:function(){var a=fi(ei)[0],b=di().memoizedState;return [a,b]},useMutableSource:hi,useSyncExternalStore:ii,useId:Fi,unstable_isNewReconciler:!1},$h={readContext:Vg,useCallback:Bi,useContext:Vg,useEffect:ji,useImperativeHandle:zi,useInsertionEffect:wi,useLayoutEffect:xi,useMemo:Ci,useReducer:gi,useRef:si,useState:function(){return gi(ei)},useDebugValue:Ai,useDeferredValue:function(a){var b=di();return null===
O?b.memoizedState=a:Di(b,O.memoizedState,a)},useTransition:function(){var a=gi(ei)[0],b=di().memoizedState;return [a,b]},useMutableSource:hi,useSyncExternalStore:ii,useId:Fi,unstable_isNewReconciler:!1};function Ki(a,b){try{var c="",d=b;do c+=Pa(d),d=d.return;while(d);var e=c;}catch(f){e="\nError generating stack: "+f.message+"\n"+f.stack;}return {value:a,source:b,stack:e,digest:null}}function Li(a,b,c){return {value:a,source:null,stack:null!=c?c:null,digest:null!=b?b:null}}
function Mi(a,b){try{console.error(b.value);}catch(c){setTimeout(function(){throw c;});}}var Ni="function"===typeof WeakMap?WeakMap:Map;function Oi(a,b,c){c=ch(-1,c);c.tag=3;c.payload={element:null};var d=b.value;c.callback=function(){Pi||(Pi=!0,Qi=d);Mi(a,b);};return c}
function Ri(a,b,c){c=ch(-1,c);c.tag=3;var d=a.type.getDerivedStateFromError;if("function"===typeof d){var e=b.value;c.payload=function(){return d(e)};c.callback=function(){Mi(a,b);};}var f=a.stateNode;null!==f&&"function"===typeof f.componentDidCatch&&(c.callback=function(){Mi(a,b);"function"!==typeof d&&(null===Si?Si=new Set([this]):Si.add(this));var c=b.stack;this.componentDidCatch(b.value,{componentStack:null!==c?c:""});});return c}
function Ti(a,b,c){var d=a.pingCache;if(null===d){d=a.pingCache=new Ni;var e=new Set;d.set(b,e);}else e=d.get(b),void 0===e&&(e=new Set,d.set(b,e));e.has(c)||(e.add(c),a=Ui.bind(null,a,b,c),b.then(a,a));}function Vi(a){do{var b;if(b=13===a.tag)b=a.memoizedState,b=null!==b?null!==b.dehydrated?!0:!1:!0;if(b)return a;a=a.return;}while(null!==a);return null}
function Wi(a,b,c,d,e){if(0===(a.mode&1))return a===b?a.flags|=65536:(a.flags|=128,c.flags|=131072,c.flags&=-52805,1===c.tag&&(null===c.alternate?c.tag=17:(b=ch(-1,1),b.tag=2,dh(c,b,1))),c.lanes|=1),a;a.flags|=65536;a.lanes=e;return a}var Xi=ua.ReactCurrentOwner,Ug=!1;function Yi(a,b,c,d){b.child=null===a?Ch(b,null,c,d):Bh(b,a.child,c,d);}
function Zi(a,b,c,d,e){c=c.render;var f=b.ref;Tg(b,e);d=Xh(a,b,c,d,f,e);c=bi();if(null!==a&&!Ug)return b.updateQueue=a.updateQueue,b.flags&=-2053,a.lanes&=~e,$i(a,b,e);I&&c&&vg(b);b.flags|=1;Yi(a,b,d,e);return b.child}
function aj(a,b,c,d,e){if(null===a){var f=c.type;if("function"===typeof f&&!bj(f)&&void 0===f.defaultProps&&null===c.compare&&void 0===c.defaultProps)return b.tag=15,b.type=f,cj(a,b,f,d,e);a=yh(c.type,null,d,b,b.mode,e);a.ref=b.ref;a.return=b;return b.child=a}f=a.child;if(0===(a.lanes&e)){var g=f.memoizedProps;c=c.compare;c=null!==c?c:Ie;if(c(g,d)&&a.ref===b.ref)return $i(a,b,e)}b.flags|=1;a=wh(f,d);a.ref=b.ref;a.return=b;return b.child=a}
function cj(a,b,c,d,e){if(null!==a){var f=a.memoizedProps;if(Ie(f,d)&&a.ref===b.ref)if(Ug=!1,b.pendingProps=d=f,0!==(a.lanes&e))0!==(a.flags&131072)&&(Ug=!0);else return b.lanes=a.lanes,$i(a,b,e)}return dj(a,b,c,d,e)}
function ej(a,b,c){var d=b.pendingProps,e=d.children,f=null!==a?a.memoizedState:null;if("hidden"===d.mode)if(0===(b.mode&1))b.memoizedState={baseLanes:0,cachePool:null,transitions:null},G(fj,gj),gj|=c;else {if(0===(c&1073741824))return a=null!==f?f.baseLanes|c:c,b.lanes=b.childLanes=1073741824,b.memoizedState={baseLanes:a,cachePool:null,transitions:null},b.updateQueue=null,G(fj,gj),gj|=a,null;b.memoizedState={baseLanes:0,cachePool:null,transitions:null};d=null!==f?f.baseLanes:c;G(fj,gj);gj|=d;}else null!==
f?(d=f.baseLanes|c,b.memoizedState=null):d=c,G(fj,gj),gj|=d;Yi(a,b,e,c);return b.child}function hj(a,b){var c=b.ref;if(null===a&&null!==c||null!==a&&a.ref!==c)b.flags|=512,b.flags|=2097152;}function dj(a,b,c,d,e){var f=Zf(c)?Xf:H.current;f=Yf(b,f);Tg(b,e);c=Xh(a,b,c,d,f,e);d=bi();if(null!==a&&!Ug)return b.updateQueue=a.updateQueue,b.flags&=-2053,a.lanes&=~e,$i(a,b,e);I&&d&&vg(b);b.flags|=1;Yi(a,b,c,e);return b.child}
function ij(a,b,c,d,e){if(Zf(c)){var f=!0;cg(b);}else f=!1;Tg(b,e);if(null===b.stateNode)jj(a,b),ph(b,c,d),rh(b,c,d,e),d=!0;else if(null===a){var g=b.stateNode,h=b.memoizedProps;g.props=h;var k=g.context,l=c.contextType;"object"===typeof l&&null!==l?l=Vg(l):(l=Zf(c)?Xf:H.current,l=Yf(b,l));var m=c.getDerivedStateFromProps,q="function"===typeof m||"function"===typeof g.getSnapshotBeforeUpdate;q||"function"!==typeof g.UNSAFE_componentWillReceiveProps&&"function"!==typeof g.componentWillReceiveProps||
(h!==d||k!==l)&&qh(b,g,d,l);$g=!1;var r=b.memoizedState;g.state=r;gh(b,d,g,e);k=b.memoizedState;h!==d||r!==k||Wf.current||$g?("function"===typeof m&&(kh(b,c,m,d),k=b.memoizedState),(h=$g||oh(b,c,h,d,r,k,l))?(q||"function"!==typeof g.UNSAFE_componentWillMount&&"function"!==typeof g.componentWillMount||("function"===typeof g.componentWillMount&&g.componentWillMount(),"function"===typeof g.UNSAFE_componentWillMount&&g.UNSAFE_componentWillMount()),"function"===typeof g.componentDidMount&&(b.flags|=4194308)):
("function"===typeof g.componentDidMount&&(b.flags|=4194308),b.memoizedProps=d,b.memoizedState=k),g.props=d,g.state=k,g.context=l,d=h):("function"===typeof g.componentDidMount&&(b.flags|=4194308),d=!1);}else {g=b.stateNode;bh(a,b);h=b.memoizedProps;l=b.type===b.elementType?h:Lg(b.type,h);g.props=l;q=b.pendingProps;r=g.context;k=c.contextType;"object"===typeof k&&null!==k?k=Vg(k):(k=Zf(c)?Xf:H.current,k=Yf(b,k));var y=c.getDerivedStateFromProps;(m="function"===typeof y||"function"===typeof g.getSnapshotBeforeUpdate)||
"function"!==typeof g.UNSAFE_componentWillReceiveProps&&"function"!==typeof g.componentWillReceiveProps||(h!==q||r!==k)&&qh(b,g,d,k);$g=!1;r=b.memoizedState;g.state=r;gh(b,d,g,e);var n=b.memoizedState;h!==q||r!==n||Wf.current||$g?("function"===typeof y&&(kh(b,c,y,d),n=b.memoizedState),(l=$g||oh(b,c,l,d,r,n,k)||!1)?(m||"function"!==typeof g.UNSAFE_componentWillUpdate&&"function"!==typeof g.componentWillUpdate||("function"===typeof g.componentWillUpdate&&g.componentWillUpdate(d,n,k),"function"===typeof g.UNSAFE_componentWillUpdate&&
g.UNSAFE_componentWillUpdate(d,n,k)),"function"===typeof g.componentDidUpdate&&(b.flags|=4),"function"===typeof g.getSnapshotBeforeUpdate&&(b.flags|=1024)):("function"!==typeof g.componentDidUpdate||h===a.memoizedProps&&r===a.memoizedState||(b.flags|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&r===a.memoizedState||(b.flags|=1024),b.memoizedProps=d,b.memoizedState=n),g.props=d,g.state=n,g.context=k,d=l):("function"!==typeof g.componentDidUpdate||h===a.memoizedProps&&r===
a.memoizedState||(b.flags|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&r===a.memoizedState||(b.flags|=1024),d=!1);}return kj(a,b,c,d,f,e)}
function kj(a,b,c,d,e,f){hj(a,b);var g=0!==(b.flags&128);if(!d&&!g)return e&&dg(b,c,!1),$i(a,b,f);d=b.stateNode;Xi.current=b;var h=g&&"function"!==typeof c.getDerivedStateFromError?null:d.render();b.flags|=1;null!==a&&g?(b.child=Bh(b,a.child,null,f),b.child=Bh(b,null,h,f)):Yi(a,b,h,f);b.memoizedState=d.state;e&&dg(b,c,!0);return b.child}function lj(a){var b=a.stateNode;b.pendingContext?ag(a,b.pendingContext,b.pendingContext!==b.context):b.context&&ag(a,b.context,!1);Ih(a,b.containerInfo);}
function mj(a,b,c,d,e){Ig();Jg(e);b.flags|=256;Yi(a,b,c,d);return b.child}var nj={dehydrated:null,treeContext:null,retryLane:0};function oj(a){return {baseLanes:a,cachePool:null,transitions:null}}
function pj(a,b,c){var d=b.pendingProps,e=M.current,f=!1,g=0!==(b.flags&128),h;(h=g)||(h=null!==a&&null===a.memoizedState?!1:0!==(e&2));if(h)f=!0,b.flags&=-129;else if(null===a||null!==a.memoizedState)e|=1;G(M,e&1);if(null===a){Eg(b);a=b.memoizedState;if(null!==a&&(a=a.dehydrated,null!==a))return 0===(b.mode&1)?b.lanes=1:"$!"===a.data?b.lanes=8:b.lanes=1073741824,null;g=d.children;a=d.fallback;return f?(d=b.mode,f=b.child,g={mode:"hidden",children:g},0===(d&1)&&null!==f?(f.childLanes=0,f.pendingProps=
g):f=qj(g,d,0,null),a=Ah(a,d,c,null),f.return=b,a.return=b,f.sibling=a,b.child=f,b.child.memoizedState=oj(c),b.memoizedState=nj,a):rj(b,g)}e=a.memoizedState;if(null!==e&&(h=e.dehydrated,null!==h))return sj(a,b,g,d,h,e,c);if(f){f=d.fallback;g=b.mode;e=a.child;h=e.sibling;var k={mode:"hidden",children:d.children};0===(g&1)&&b.child!==e?(d=b.child,d.childLanes=0,d.pendingProps=k,b.deletions=null):(d=wh(e,k),d.subtreeFlags=e.subtreeFlags&14680064);null!==h?f=wh(h,f):(f=Ah(f,g,c,null),f.flags|=2);f.return=
b;d.return=b;d.sibling=f;b.child=d;d=f;f=b.child;g=a.child.memoizedState;g=null===g?oj(c):{baseLanes:g.baseLanes|c,cachePool:null,transitions:g.transitions};f.memoizedState=g;f.childLanes=a.childLanes&~c;b.memoizedState=nj;return d}f=a.child;a=f.sibling;d=wh(f,{mode:"visible",children:d.children});0===(b.mode&1)&&(d.lanes=c);d.return=b;d.sibling=null;null!==a&&(c=b.deletions,null===c?(b.deletions=[a],b.flags|=16):c.push(a));b.child=d;b.memoizedState=null;return d}
function rj(a,b){b=qj({mode:"visible",children:b},a.mode,0,null);b.return=a;return a.child=b}function tj(a,b,c,d){null!==d&&Jg(d);Bh(b,a.child,null,c);a=rj(b,b.pendingProps.children);a.flags|=2;b.memoizedState=null;return a}
function sj(a,b,c,d,e,f,g){if(c){if(b.flags&256)return b.flags&=-257,d=Li(Error(p$2(422))),tj(a,b,g,d);if(null!==b.memoizedState)return b.child=a.child,b.flags|=128,null;f=d.fallback;e=b.mode;d=qj({mode:"visible",children:d.children},e,0,null);f=Ah(f,e,g,null);f.flags|=2;d.return=b;f.return=b;d.sibling=f;b.child=d;0!==(b.mode&1)&&Bh(b,a.child,null,g);b.child.memoizedState=oj(g);b.memoizedState=nj;return f}if(0===(b.mode&1))return tj(a,b,g,null);if("$!"===e.data){d=e.nextSibling&&e.nextSibling.dataset;
if(d)var h=d.dgst;d=h;f=Error(p$2(419));d=Li(f,d,void 0);return tj(a,b,g,d)}h=0!==(g&a.childLanes);if(Ug||h){d=R;if(null!==d){switch(g&-g){case 4:e=2;break;case 16:e=8;break;case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:e=32;break;case 536870912:e=268435456;break;default:e=0;}e=0!==(e&(d.suspendedLanes|g))?0:e;
0!==e&&e!==f.retryLane&&(f.retryLane=e,Zg(a,e),mh(d,a,e,-1));}uj();d=Li(Error(p$2(421)));return tj(a,b,g,d)}if("$?"===e.data)return b.flags|=128,b.child=a.child,b=vj.bind(null,a),e._reactRetry=b,null;a=f.treeContext;yg=Lf(e.nextSibling);xg=b;I=!0;zg=null;null!==a&&(og[pg++]=rg,og[pg++]=sg,og[pg++]=qg,rg=a.id,sg=a.overflow,qg=b);b=rj(b,d.children);b.flags|=4096;return b}function wj(a,b,c){a.lanes|=b;var d=a.alternate;null!==d&&(d.lanes|=b);Sg(a.return,b,c);}
function xj(a,b,c,d,e){var f=a.memoizedState;null===f?a.memoizedState={isBackwards:b,rendering:null,renderingStartTime:0,last:d,tail:c,tailMode:e}:(f.isBackwards=b,f.rendering=null,f.renderingStartTime=0,f.last=d,f.tail=c,f.tailMode=e);}
function yj(a,b,c){var d=b.pendingProps,e=d.revealOrder,f=d.tail;Yi(a,b,d.children,c);d=M.current;if(0!==(d&2))d=d&1|2,b.flags|=128;else {if(null!==a&&0!==(a.flags&128))a:for(a=b.child;null!==a;){if(13===a.tag)null!==a.memoizedState&&wj(a,c,b);else if(19===a.tag)wj(a,c,b);else if(null!==a.child){a.child.return=a;a=a.child;continue}if(a===b)break a;for(;null===a.sibling;){if(null===a.return||a.return===b)break a;a=a.return;}a.sibling.return=a.return;a=a.sibling;}d&=1;}G(M,d);if(0===(b.mode&1))b.memoizedState=
null;else switch(e){case "forwards":c=b.child;for(e=null;null!==c;)a=c.alternate,null!==a&&null===Mh(a)&&(e=c),c=c.sibling;c=e;null===c?(e=b.child,b.child=null):(e=c.sibling,c.sibling=null);xj(b,!1,e,c,f);break;case "backwards":c=null;e=b.child;for(b.child=null;null!==e;){a=e.alternate;if(null!==a&&null===Mh(a)){b.child=e;break}a=e.sibling;e.sibling=c;c=e;e=a;}xj(b,!0,c,null,f);break;case "together":xj(b,!1,null,null,void 0);break;default:b.memoizedState=null;}return b.child}
function jj(a,b){0===(b.mode&1)&&null!==a&&(a.alternate=null,b.alternate=null,b.flags|=2);}function $i(a,b,c){null!==a&&(b.dependencies=a.dependencies);hh|=b.lanes;if(0===(c&b.childLanes))return null;if(null!==a&&b.child!==a.child)throw Error(p$2(153));if(null!==b.child){a=b.child;c=wh(a,a.pendingProps);b.child=c;for(c.return=b;null!==a.sibling;)a=a.sibling,c=c.sibling=wh(a,a.pendingProps),c.return=b;c.sibling=null;}return b.child}
function zj(a,b,c){switch(b.tag){case 3:lj(b);Ig();break;case 5:Kh(b);break;case 1:Zf(b.type)&&cg(b);break;case 4:Ih(b,b.stateNode.containerInfo);break;case 10:var d=b.type._context,e=b.memoizedProps.value;G(Mg,d._currentValue);d._currentValue=e;break;case 13:d=b.memoizedState;if(null!==d){if(null!==d.dehydrated)return G(M,M.current&1),b.flags|=128,null;if(0!==(c&b.child.childLanes))return pj(a,b,c);G(M,M.current&1);a=$i(a,b,c);return null!==a?a.sibling:null}G(M,M.current&1);break;case 19:d=0!==(c&
b.childLanes);if(0!==(a.flags&128)){if(d)return yj(a,b,c);b.flags|=128;}e=b.memoizedState;null!==e&&(e.rendering=null,e.tail=null,e.lastEffect=null);G(M,M.current);if(d)break;else return null;case 22:case 23:return b.lanes=0,ej(a,b,c)}return $i(a,b,c)}var Aj,Bj,Cj,Dj;
Aj=function(a,b){for(var c=b.child;null!==c;){if(5===c.tag||6===c.tag)a.appendChild(c.stateNode);else if(4!==c.tag&&null!==c.child){c.child.return=c;c=c.child;continue}if(c===b)break;for(;null===c.sibling;){if(null===c.return||c.return===b)return;c=c.return;}c.sibling.return=c.return;c=c.sibling;}};Bj=function(){};
Cj=function(a,b,c,d){var e=a.memoizedProps;if(e!==d){a=b.stateNode;Hh(Eh.current);var f=null;switch(c){case "input":e=Ya(a,e);d=Ya(a,d);f=[];break;case "select":e=A$1({},e,{value:void 0});d=A$1({},d,{value:void 0});f=[];break;case "textarea":e=gb(a,e);d=gb(a,d);f=[];break;default:"function"!==typeof e.onClick&&"function"===typeof d.onClick&&(a.onclick=Bf);}ub(c,d);var g;c=null;for(l in e)if(!d.hasOwnProperty(l)&&e.hasOwnProperty(l)&&null!=e[l])if("style"===l){var h=e[l];for(g in h)h.hasOwnProperty(g)&&
(c||(c={}),c[g]="");}else "dangerouslySetInnerHTML"!==l&&"children"!==l&&"suppressContentEditableWarning"!==l&&"suppressHydrationWarning"!==l&&"autoFocus"!==l&&(ea.hasOwnProperty(l)?f||(f=[]):(f=f||[]).push(l,null));for(l in d){var k=d[l];h=null!=e?e[l]:void 0;if(d.hasOwnProperty(l)&&k!==h&&(null!=k||null!=h))if("style"===l)if(h){for(g in h)!h.hasOwnProperty(g)||k&&k.hasOwnProperty(g)||(c||(c={}),c[g]="");for(g in k)k.hasOwnProperty(g)&&h[g]!==k[g]&&(c||(c={}),c[g]=k[g]);}else c||(f||(f=[]),f.push(l,
c)),c=k;else "dangerouslySetInnerHTML"===l?(k=k?k.__html:void 0,h=h?h.__html:void 0,null!=k&&h!==k&&(f=f||[]).push(l,k)):"children"===l?"string"!==typeof k&&"number"!==typeof k||(f=f||[]).push(l,""+k):"suppressContentEditableWarning"!==l&&"suppressHydrationWarning"!==l&&(ea.hasOwnProperty(l)?(null!=k&&"onScroll"===l&&D("scroll",a),f||h===k||(f=[])):(f=f||[]).push(l,k));}c&&(f=f||[]).push("style",c);var l=f;if(b.updateQueue=l)b.flags|=4;}};Dj=function(a,b,c,d){c!==d&&(b.flags|=4);};
function Ej(a,b){if(!I)switch(a.tailMode){case "hidden":b=a.tail;for(var c=null;null!==b;)null!==b.alternate&&(c=b),b=b.sibling;null===c?a.tail=null:c.sibling=null;break;case "collapsed":c=a.tail;for(var d=null;null!==c;)null!==c.alternate&&(d=c),c=c.sibling;null===d?b||null===a.tail?a.tail=null:a.tail.sibling=null:d.sibling=null;}}
function S(a){var b=null!==a.alternate&&a.alternate.child===a.child,c=0,d=0;if(b)for(var e=a.child;null!==e;)c|=e.lanes|e.childLanes,d|=e.subtreeFlags&14680064,d|=e.flags&14680064,e.return=a,e=e.sibling;else for(e=a.child;null!==e;)c|=e.lanes|e.childLanes,d|=e.subtreeFlags,d|=e.flags,e.return=a,e=e.sibling;a.subtreeFlags|=d;a.childLanes=c;return b}
function Fj(a,b,c){var d=b.pendingProps;wg(b);switch(b.tag){case 2:case 16:case 15:case 0:case 11:case 7:case 8:case 12:case 9:case 14:return S(b),null;case 1:return Zf(b.type)&&$f(),S(b),null;case 3:d=b.stateNode;Jh();E(Wf);E(H);Oh();d.pendingContext&&(d.context=d.pendingContext,d.pendingContext=null);if(null===a||null===a.child)Gg(b)?b.flags|=4:null===a||a.memoizedState.isDehydrated&&0===(b.flags&256)||(b.flags|=1024,null!==zg&&(Gj(zg),zg=null));Bj(a,b);S(b);return null;case 5:Lh(b);var e=Hh(Gh.current);
c=b.type;if(null!==a&&null!=b.stateNode)Cj(a,b,c,d,e),a.ref!==b.ref&&(b.flags|=512,b.flags|=2097152);else {if(!d){if(null===b.stateNode)throw Error(p$2(166));S(b);return null}a=Hh(Eh.current);if(Gg(b)){d=b.stateNode;c=b.type;var f=b.memoizedProps;d[Of]=b;d[Pf]=f;a=0!==(b.mode&1);switch(c){case "dialog":D("cancel",d);D("close",d);break;case "iframe":case "object":case "embed":D("load",d);break;case "video":case "audio":for(e=0;e<lf.length;e++)D(lf[e],d);break;case "source":D("error",d);break;case "img":case "image":case "link":D("error",
d);D("load",d);break;case "details":D("toggle",d);break;case "input":Za(d,f);D("invalid",d);break;case "select":d._wrapperState={wasMultiple:!!f.multiple};D("invalid",d);break;case "textarea":hb(d,f),D("invalid",d);}ub(c,f);e=null;for(var g in f)if(f.hasOwnProperty(g)){var h=f[g];"children"===g?"string"===typeof h?d.textContent!==h&&(!0!==f.suppressHydrationWarning&&Af(d.textContent,h,a),e=["children",h]):"number"===typeof h&&d.textContent!==""+h&&(!0!==f.suppressHydrationWarning&&Af(d.textContent,
h,a),e=["children",""+h]):ea.hasOwnProperty(g)&&null!=h&&"onScroll"===g&&D("scroll",d);}switch(c){case "input":Va(d);db(d,f,!0);break;case "textarea":Va(d);jb(d);break;case "select":case "option":break;default:"function"===typeof f.onClick&&(d.onclick=Bf);}d=e;b.updateQueue=d;null!==d&&(b.flags|=4);}else {g=9===e.nodeType?e:e.ownerDocument;"http://www.w3.org/1999/xhtml"===a&&(a=kb(c));"http://www.w3.org/1999/xhtml"===a?"script"===c?(a=g.createElement("div"),a.innerHTML="<script>\x3c/script>",a=a.removeChild(a.firstChild)):
"string"===typeof d.is?a=g.createElement(c,{is:d.is}):(a=g.createElement(c),"select"===c&&(g=a,d.multiple?g.multiple=!0:d.size&&(g.size=d.size))):a=g.createElementNS(a,c);a[Of]=b;a[Pf]=d;Aj(a,b,!1,!1);b.stateNode=a;a:{g=vb(c,d);switch(c){case "dialog":D("cancel",a);D("close",a);e=d;break;case "iframe":case "object":case "embed":D("load",a);e=d;break;case "video":case "audio":for(e=0;e<lf.length;e++)D(lf[e],a);e=d;break;case "source":D("error",a);e=d;break;case "img":case "image":case "link":D("error",
a);D("load",a);e=d;break;case "details":D("toggle",a);e=d;break;case "input":Za(a,d);e=Ya(a,d);D("invalid",a);break;case "option":e=d;break;case "select":a._wrapperState={wasMultiple:!!d.multiple};e=A$1({},d,{value:void 0});D("invalid",a);break;case "textarea":hb(a,d);e=gb(a,d);D("invalid",a);break;default:e=d;}ub(c,e);h=e;for(f in h)if(h.hasOwnProperty(f)){var k=h[f];"style"===f?sb(a,k):"dangerouslySetInnerHTML"===f?(k=k?k.__html:void 0,null!=k&&nb(a,k)):"children"===f?"string"===typeof k?("textarea"!==
c||""!==k)&&ob(a,k):"number"===typeof k&&ob(a,""+k):"suppressContentEditableWarning"!==f&&"suppressHydrationWarning"!==f&&"autoFocus"!==f&&(ea.hasOwnProperty(f)?null!=k&&"onScroll"===f&&D("scroll",a):null!=k&&ta(a,f,k,g));}switch(c){case "input":Va(a);db(a,d,!1);break;case "textarea":Va(a);jb(a);break;case "option":null!=d.value&&a.setAttribute("value",""+Sa(d.value));break;case "select":a.multiple=!!d.multiple;f=d.value;null!=f?fb(a,!!d.multiple,f,!1):null!=d.defaultValue&&fb(a,!!d.multiple,d.defaultValue,
!0);break;default:"function"===typeof e.onClick&&(a.onclick=Bf);}switch(c){case "button":case "input":case "select":case "textarea":d=!!d.autoFocus;break a;case "img":d=!0;break a;default:d=!1;}}d&&(b.flags|=4);}null!==b.ref&&(b.flags|=512,b.flags|=2097152);}S(b);return null;case 6:if(a&&null!=b.stateNode)Dj(a,b,a.memoizedProps,d);else {if("string"!==typeof d&&null===b.stateNode)throw Error(p$2(166));c=Hh(Gh.current);Hh(Eh.current);if(Gg(b)){d=b.stateNode;c=b.memoizedProps;d[Of]=b;if(f=d.nodeValue!==c)if(a=
xg,null!==a)switch(a.tag){case 3:Af(d.nodeValue,c,0!==(a.mode&1));break;case 5:!0!==a.memoizedProps.suppressHydrationWarning&&Af(d.nodeValue,c,0!==(a.mode&1));}f&&(b.flags|=4);}else d=(9===c.nodeType?c:c.ownerDocument).createTextNode(d),d[Of]=b,b.stateNode=d;}S(b);return null;case 13:E(M);d=b.memoizedState;if(null===a||null!==a.memoizedState&&null!==a.memoizedState.dehydrated){if(I&&null!==yg&&0!==(b.mode&1)&&0===(b.flags&128))Hg(),Ig(),b.flags|=98560,f=!1;else if(f=Gg(b),null!==d&&null!==d.dehydrated){if(null===
a){if(!f)throw Error(p$2(318));f=b.memoizedState;f=null!==f?f.dehydrated:null;if(!f)throw Error(p$2(317));f[Of]=b;}else Ig(),0===(b.flags&128)&&(b.memoizedState=null),b.flags|=4;S(b);f=!1;}else null!==zg&&(Gj(zg),zg=null),f=!0;if(!f)return b.flags&65536?b:null}if(0!==(b.flags&128))return b.lanes=c,b;d=null!==d;d!==(null!==a&&null!==a.memoizedState)&&d&&(b.child.flags|=8192,0!==(b.mode&1)&&(null===a||0!==(M.current&1)?0===T&&(T=3):uj()));null!==b.updateQueue&&(b.flags|=4);S(b);return null;case 4:return Jh(),
Bj(a,b),null===a&&sf(b.stateNode.containerInfo),S(b),null;case 10:return Rg(b.type._context),S(b),null;case 17:return Zf(b.type)&&$f(),S(b),null;case 19:E(M);f=b.memoizedState;if(null===f)return S(b),null;d=0!==(b.flags&128);g=f.rendering;if(null===g)if(d)Ej(f,!1);else {if(0!==T||null!==a&&0!==(a.flags&128))for(a=b.child;null!==a;){g=Mh(a);if(null!==g){b.flags|=128;Ej(f,!1);d=g.updateQueue;null!==d&&(b.updateQueue=d,b.flags|=4);b.subtreeFlags=0;d=c;for(c=b.child;null!==c;)f=c,a=d,f.flags&=14680066,
g=f.alternate,null===g?(f.childLanes=0,f.lanes=a,f.child=null,f.subtreeFlags=0,f.memoizedProps=null,f.memoizedState=null,f.updateQueue=null,f.dependencies=null,f.stateNode=null):(f.childLanes=g.childLanes,f.lanes=g.lanes,f.child=g.child,f.subtreeFlags=0,f.deletions=null,f.memoizedProps=g.memoizedProps,f.memoizedState=g.memoizedState,f.updateQueue=g.updateQueue,f.type=g.type,a=g.dependencies,f.dependencies=null===a?null:{lanes:a.lanes,firstContext:a.firstContext}),c=c.sibling;G(M,M.current&1|2);return b.child}a=
a.sibling;}null!==f.tail&&B()>Hj&&(b.flags|=128,d=!0,Ej(f,!1),b.lanes=4194304);}else {if(!d)if(a=Mh(g),null!==a){if(b.flags|=128,d=!0,c=a.updateQueue,null!==c&&(b.updateQueue=c,b.flags|=4),Ej(f,!0),null===f.tail&&"hidden"===f.tailMode&&!g.alternate&&!I)return S(b),null}else 2*B()-f.renderingStartTime>Hj&&1073741824!==c&&(b.flags|=128,d=!0,Ej(f,!1),b.lanes=4194304);f.isBackwards?(g.sibling=b.child,b.child=g):(c=f.last,null!==c?c.sibling=g:b.child=g,f.last=g);}if(null!==f.tail)return b=f.tail,f.rendering=
b,f.tail=b.sibling,f.renderingStartTime=B(),b.sibling=null,c=M.current,G(M,d?c&1|2:c&1),b;S(b);return null;case 22:case 23:return Ij(),d=null!==b.memoizedState,null!==a&&null!==a.memoizedState!==d&&(b.flags|=8192),d&&0!==(b.mode&1)?0!==(gj&1073741824)&&(S(b),b.subtreeFlags&6&&(b.flags|=8192)):S(b),null;case 24:return null;case 25:return null}throw Error(p$2(156,b.tag));}
function Jj(a,b){wg(b);switch(b.tag){case 1:return Zf(b.type)&&$f(),a=b.flags,a&65536?(b.flags=a&-65537|128,b):null;case 3:return Jh(),E(Wf),E(H),Oh(),a=b.flags,0!==(a&65536)&&0===(a&128)?(b.flags=a&-65537|128,b):null;case 5:return Lh(b),null;case 13:E(M);a=b.memoizedState;if(null!==a&&null!==a.dehydrated){if(null===b.alternate)throw Error(p$2(340));Ig();}a=b.flags;return a&65536?(b.flags=a&-65537|128,b):null;case 19:return E(M),null;case 4:return Jh(),null;case 10:return Rg(b.type._context),null;case 22:case 23:return Ij(),
null;case 24:return null;default:return null}}var Kj=!1,U=!1,Lj="function"===typeof WeakSet?WeakSet:Set,V=null;function Mj(a,b){var c=a.ref;if(null!==c)if("function"===typeof c)try{c(null);}catch(d){W(a,b,d);}else c.current=null;}function Nj(a,b,c){try{c();}catch(d){W(a,b,d);}}var Oj=!1;
function Pj(a,b){Cf=dd;a=Me();if(Ne(a)){if("selectionStart"in a)var c={start:a.selectionStart,end:a.selectionEnd};else a:{c=(c=a.ownerDocument)&&c.defaultView||window;var d=c.getSelection&&c.getSelection();if(d&&0!==d.rangeCount){c=d.anchorNode;var e=d.anchorOffset,f=d.focusNode;d=d.focusOffset;try{c.nodeType,f.nodeType;}catch(F){c=null;break a}var g=0,h=-1,k=-1,l=0,m=0,q=a,r=null;b:for(;;){for(var y;;){q!==c||0!==e&&3!==q.nodeType||(h=g+e);q!==f||0!==d&&3!==q.nodeType||(k=g+d);3===q.nodeType&&(g+=
q.nodeValue.length);if(null===(y=q.firstChild))break;r=q;q=y;}for(;;){if(q===a)break b;r===c&&++l===e&&(h=g);r===f&&++m===d&&(k=g);if(null!==(y=q.nextSibling))break;q=r;r=q.parentNode;}q=y;}c=-1===h||-1===k?null:{start:h,end:k};}else c=null;}c=c||{start:0,end:0};}else c=null;Df={focusedElem:a,selectionRange:c};dd=!1;for(V=b;null!==V;)if(b=V,a=b.child,0!==(b.subtreeFlags&1028)&&null!==a)a.return=b,V=a;else for(;null!==V;){b=V;try{var n=b.alternate;if(0!==(b.flags&1024))switch(b.tag){case 0:case 11:case 15:break;
case 1:if(null!==n){var t=n.memoizedProps,J=n.memoizedState,x=b.stateNode,w=x.getSnapshotBeforeUpdate(b.elementType===b.type?t:Lg(b.type,t),J);x.__reactInternalSnapshotBeforeUpdate=w;}break;case 3:var u=b.stateNode.containerInfo;1===u.nodeType?u.textContent="":9===u.nodeType&&u.documentElement&&u.removeChild(u.documentElement);break;case 5:case 6:case 4:case 17:break;default:throw Error(p$2(163));}}catch(F){W(b,b.return,F);}a=b.sibling;if(null!==a){a.return=b.return;V=a;break}V=b.return;}n=Oj;Oj=!1;return n}
function Qj(a,b,c){var d=b.updateQueue;d=null!==d?d.lastEffect:null;if(null!==d){var e=d=d.next;do{if((e.tag&a)===a){var f=e.destroy;e.destroy=void 0;void 0!==f&&Nj(b,c,f);}e=e.next;}while(e!==d)}}function Rj(a,b){b=b.updateQueue;b=null!==b?b.lastEffect:null;if(null!==b){var c=b=b.next;do{if((c.tag&a)===a){var d=c.create;c.destroy=d();}c=c.next;}while(c!==b)}}function Sj(a){var b=a.ref;if(null!==b){var c=a.stateNode;switch(a.tag){case 5:a=c;break;default:a=c;}"function"===typeof b?b(a):b.current=a;}}
function Tj(a){var b=a.alternate;null!==b&&(a.alternate=null,Tj(b));a.child=null;a.deletions=null;a.sibling=null;5===a.tag&&(b=a.stateNode,null!==b&&(delete b[Of],delete b[Pf],delete b[of],delete b[Qf],delete b[Rf]));a.stateNode=null;a.return=null;a.dependencies=null;a.memoizedProps=null;a.memoizedState=null;a.pendingProps=null;a.stateNode=null;a.updateQueue=null;}function Uj(a){return 5===a.tag||3===a.tag||4===a.tag}
function Vj(a){a:for(;;){for(;null===a.sibling;){if(null===a.return||Uj(a.return))return null;a=a.return;}a.sibling.return=a.return;for(a=a.sibling;5!==a.tag&&6!==a.tag&&18!==a.tag;){if(a.flags&2)continue a;if(null===a.child||4===a.tag)continue a;else a.child.return=a,a=a.child;}if(!(a.flags&2))return a.stateNode}}
function Wj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?8===c.nodeType?c.parentNode.insertBefore(a,b):c.insertBefore(a,b):(8===c.nodeType?(b=c.parentNode,b.insertBefore(a,c)):(b=c,b.appendChild(a)),c=c._reactRootContainer,null!==c&&void 0!==c||null!==b.onclick||(b.onclick=Bf));else if(4!==d&&(a=a.child,null!==a))for(Wj(a,b,c),a=a.sibling;null!==a;)Wj(a,b,c),a=a.sibling;}
function Xj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?c.insertBefore(a,b):c.appendChild(a);else if(4!==d&&(a=a.child,null!==a))for(Xj(a,b,c),a=a.sibling;null!==a;)Xj(a,b,c),a=a.sibling;}var X=null,Yj=!1;function Zj(a,b,c){for(c=c.child;null!==c;)ak(a,b,c),c=c.sibling;}
function ak(a,b,c){if(lc&&"function"===typeof lc.onCommitFiberUnmount)try{lc.onCommitFiberUnmount(kc,c);}catch(h){}switch(c.tag){case 5:U||Mj(c,b);case 6:var d=X,e=Yj;X=null;Zj(a,b,c);X=d;Yj=e;null!==X&&(Yj?(a=X,c=c.stateNode,8===a.nodeType?a.parentNode.removeChild(c):a.removeChild(c)):X.removeChild(c.stateNode));break;case 18:null!==X&&(Yj?(a=X,c=c.stateNode,8===a.nodeType?Kf(a.parentNode,c):1===a.nodeType&&Kf(a,c),bd(a)):Kf(X,c.stateNode));break;case 4:d=X;e=Yj;X=c.stateNode.containerInfo;Yj=!0;
Zj(a,b,c);X=d;Yj=e;break;case 0:case 11:case 14:case 15:if(!U&&(d=c.updateQueue,null!==d&&(d=d.lastEffect,null!==d))){e=d=d.next;do{var f=e,g=f.destroy;f=f.tag;void 0!==g&&(0!==(f&2)?Nj(c,b,g):0!==(f&4)&&Nj(c,b,g));e=e.next;}while(e!==d)}Zj(a,b,c);break;case 1:if(!U&&(Mj(c,b),d=c.stateNode,"function"===typeof d.componentWillUnmount))try{d.props=c.memoizedProps,d.state=c.memoizedState,d.componentWillUnmount();}catch(h){W(c,b,h);}Zj(a,b,c);break;case 21:Zj(a,b,c);break;case 22:c.mode&1?(U=(d=U)||null!==
c.memoizedState,Zj(a,b,c),U=d):Zj(a,b,c);break;default:Zj(a,b,c);}}function bk(a){var b=a.updateQueue;if(null!==b){a.updateQueue=null;var c=a.stateNode;null===c&&(c=a.stateNode=new Lj);b.forEach(function(b){var d=ck.bind(null,a,b);c.has(b)||(c.add(b),b.then(d,d));});}}
function dk(a,b){var c=b.deletions;if(null!==c)for(var d=0;d<c.length;d++){var e=c[d];try{var f=a,g=b,h=g;a:for(;null!==h;){switch(h.tag){case 5:X=h.stateNode;Yj=!1;break a;case 3:X=h.stateNode.containerInfo;Yj=!0;break a;case 4:X=h.stateNode.containerInfo;Yj=!0;break a}h=h.return;}if(null===X)throw Error(p$2(160));ak(f,g,e);X=null;Yj=!1;var k=e.alternate;null!==k&&(k.return=null);e.return=null;}catch(l){W(e,b,l);}}if(b.subtreeFlags&12854)for(b=b.child;null!==b;)ek(b,a),b=b.sibling;}
function ek(a,b){var c=a.alternate,d=a.flags;switch(a.tag){case 0:case 11:case 14:case 15:dk(b,a);fk(a);if(d&4){try{Qj(3,a,a.return),Rj(3,a);}catch(t){W(a,a.return,t);}try{Qj(5,a,a.return);}catch(t){W(a,a.return,t);}}break;case 1:dk(b,a);fk(a);d&512&&null!==c&&Mj(c,c.return);break;case 5:dk(b,a);fk(a);d&512&&null!==c&&Mj(c,c.return);if(a.flags&32){var e=a.stateNode;try{ob(e,"");}catch(t){W(a,a.return,t);}}if(d&4&&(e=a.stateNode,null!=e)){var f=a.memoizedProps,g=null!==c?c.memoizedProps:f,h=a.type,k=a.updateQueue;
a.updateQueue=null;if(null!==k)try{"input"===h&&"radio"===f.type&&null!=f.name&&ab(e,f);vb(h,g);var l=vb(h,f);for(g=0;g<k.length;g+=2){var m=k[g],q=k[g+1];"style"===m?sb(e,q):"dangerouslySetInnerHTML"===m?nb(e,q):"children"===m?ob(e,q):ta(e,m,q,l);}switch(h){case "input":bb(e,f);break;case "textarea":ib(e,f);break;case "select":var r=e._wrapperState.wasMultiple;e._wrapperState.wasMultiple=!!f.multiple;var y=f.value;null!=y?fb(e,!!f.multiple,y,!1):r!==!!f.multiple&&(null!=f.defaultValue?fb(e,!!f.multiple,
f.defaultValue,!0):fb(e,!!f.multiple,f.multiple?[]:"",!1));}e[Pf]=f;}catch(t){W(a,a.return,t);}}break;case 6:dk(b,a);fk(a);if(d&4){if(null===a.stateNode)throw Error(p$2(162));e=a.stateNode;f=a.memoizedProps;try{e.nodeValue=f;}catch(t){W(a,a.return,t);}}break;case 3:dk(b,a);fk(a);if(d&4&&null!==c&&c.memoizedState.isDehydrated)try{bd(b.containerInfo);}catch(t){W(a,a.return,t);}break;case 4:dk(b,a);fk(a);break;case 13:dk(b,a);fk(a);e=a.child;e.flags&8192&&(f=null!==e.memoizedState,e.stateNode.isHidden=f,!f||
null!==e.alternate&&null!==e.alternate.memoizedState||(gk=B()));d&4&&bk(a);break;case 22:m=null!==c&&null!==c.memoizedState;a.mode&1?(U=(l=U)||m,dk(b,a),U=l):dk(b,a);fk(a);if(d&8192){l=null!==a.memoizedState;if((a.stateNode.isHidden=l)&&!m&&0!==(a.mode&1))for(V=a,m=a.child;null!==m;){for(q=V=m;null!==V;){r=V;y=r.child;switch(r.tag){case 0:case 11:case 14:case 15:Qj(4,r,r.return);break;case 1:Mj(r,r.return);var n=r.stateNode;if("function"===typeof n.componentWillUnmount){d=r;c=r.return;try{b=d,n.props=
b.memoizedProps,n.state=b.memoizedState,n.componentWillUnmount();}catch(t){W(d,c,t);}}break;case 5:Mj(r,r.return);break;case 22:if(null!==r.memoizedState){hk(q);continue}}null!==y?(y.return=r,V=y):hk(q);}m=m.sibling;}a:for(m=null,q=a;;){if(5===q.tag){if(null===m){m=q;try{e=q.stateNode,l?(f=e.style,"function"===typeof f.setProperty?f.setProperty("display","none","important"):f.display="none"):(h=q.stateNode,k=q.memoizedProps.style,g=void 0!==k&&null!==k&&k.hasOwnProperty("display")?k.display:null,h.style.display=
rb("display",g));}catch(t){W(a,a.return,t);}}}else if(6===q.tag){if(null===m)try{q.stateNode.nodeValue=l?"":q.memoizedProps;}catch(t){W(a,a.return,t);}}else if((22!==q.tag&&23!==q.tag||null===q.memoizedState||q===a)&&null!==q.child){q.child.return=q;q=q.child;continue}if(q===a)break a;for(;null===q.sibling;){if(null===q.return||q.return===a)break a;m===q&&(m=null);q=q.return;}m===q&&(m=null);q.sibling.return=q.return;q=q.sibling;}}break;case 19:dk(b,a);fk(a);d&4&&bk(a);break;case 21:break;default:dk(b,
a),fk(a);}}function fk(a){var b=a.flags;if(b&2){try{a:{for(var c=a.return;null!==c;){if(Uj(c)){var d=c;break a}c=c.return;}throw Error(p$2(160));}switch(d.tag){case 5:var e=d.stateNode;d.flags&32&&(ob(e,""),d.flags&=-33);var f=Vj(a);Xj(a,f,e);break;case 3:case 4:var g=d.stateNode.containerInfo,h=Vj(a);Wj(a,h,g);break;default:throw Error(p$2(161));}}catch(k){W(a,a.return,k);}a.flags&=-3;}b&4096&&(a.flags&=-4097);}function ik(a,b,c){V=a;jk(a);}
function jk(a,b,c){for(var d=0!==(a.mode&1);null!==V;){var e=V,f=e.child;if(22===e.tag&&d){var g=null!==e.memoizedState||Kj;if(!g){var h=e.alternate,k=null!==h&&null!==h.memoizedState||U;h=Kj;var l=U;Kj=g;if((U=k)&&!l)for(V=e;null!==V;)g=V,k=g.child,22===g.tag&&null!==g.memoizedState?kk(e):null!==k?(k.return=g,V=k):kk(e);for(;null!==f;)V=f,jk(f),f=f.sibling;V=e;Kj=h;U=l;}lk(a);}else 0!==(e.subtreeFlags&8772)&&null!==f?(f.return=e,V=f):lk(a);}}
function lk(a){for(;null!==V;){var b=V;if(0!==(b.flags&8772)){var c=b.alternate;try{if(0!==(b.flags&8772))switch(b.tag){case 0:case 11:case 15:U||Rj(5,b);break;case 1:var d=b.stateNode;if(b.flags&4&&!U)if(null===c)d.componentDidMount();else {var e=b.elementType===b.type?c.memoizedProps:Lg(b.type,c.memoizedProps);d.componentDidUpdate(e,c.memoizedState,d.__reactInternalSnapshotBeforeUpdate);}var f=b.updateQueue;null!==f&&ih(b,f,d);break;case 3:var g=b.updateQueue;if(null!==g){c=null;if(null!==b.child)switch(b.child.tag){case 5:c=
b.child.stateNode;break;case 1:c=b.child.stateNode;}ih(b,g,c);}break;case 5:var h=b.stateNode;if(null===c&&b.flags&4){c=h;var k=b.memoizedProps;switch(b.type){case "button":case "input":case "select":case "textarea":k.autoFocus&&c.focus();break;case "img":k.src&&(c.src=k.src);}}break;case 6:break;case 4:break;case 12:break;case 13:if(null===b.memoizedState){var l=b.alternate;if(null!==l){var m=l.memoizedState;if(null!==m){var q=m.dehydrated;null!==q&&bd(q);}}}break;case 19:case 17:case 21:case 22:case 23:case 25:break;
default:throw Error(p$2(163));}U||b.flags&512&&Sj(b);}catch(r){W(b,b.return,r);}}if(b===a){V=null;break}c=b.sibling;if(null!==c){c.return=b.return;V=c;break}V=b.return;}}function hk(a){for(;null!==V;){var b=V;if(b===a){V=null;break}var c=b.sibling;if(null!==c){c.return=b.return;V=c;break}V=b.return;}}
function kk(a){for(;null!==V;){var b=V;try{switch(b.tag){case 0:case 11:case 15:var c=b.return;try{Rj(4,b);}catch(k){W(b,c,k);}break;case 1:var d=b.stateNode;if("function"===typeof d.componentDidMount){var e=b.return;try{d.componentDidMount();}catch(k){W(b,e,k);}}var f=b.return;try{Sj(b);}catch(k){W(b,f,k);}break;case 5:var g=b.return;try{Sj(b);}catch(k){W(b,g,k);}}}catch(k){W(b,b.return,k);}if(b===a){V=null;break}var h=b.sibling;if(null!==h){h.return=b.return;V=h;break}V=b.return;}}
var mk=Math.ceil,nk=ua.ReactCurrentDispatcher,ok=ua.ReactCurrentOwner,pk=ua.ReactCurrentBatchConfig,K=0,R=null,Y=null,Z=0,gj=0,fj=Uf(0),T=0,qk=null,hh=0,rk=0,sk=0,tk=null,uk=null,gk=0,Hj=Infinity,vk=null,Pi=!1,Qi=null,Si=null,wk=!1,xk=null,yk=0,zk=0,Ak=null,Bk=-1,Ck=0;function L(){return 0!==(K&6)?B():-1!==Bk?Bk:Bk=B()}
function lh(a){if(0===(a.mode&1))return 1;if(0!==(K&2)&&0!==Z)return Z&-Z;if(null!==Kg.transition)return 0===Ck&&(Ck=yc()),Ck;a=C;if(0!==a)return a;a=window.event;a=void 0===a?16:jd(a.type);return a}function mh(a,b,c,d){if(50<zk)throw zk=0,Ak=null,Error(p$2(185));Ac(a,c,d);if(0===(K&2)||a!==R)a===R&&(0===(K&2)&&(rk|=c),4===T&&Dk(a,Z)),Ek(a,d),1===c&&0===K&&0===(b.mode&1)&&(Hj=B()+500,fg&&jg());}
function Ek(a,b){var c=a.callbackNode;wc(a,b);var d=uc(a,a===R?Z:0);if(0===d)null!==c&&bc(c),a.callbackNode=null,a.callbackPriority=0;else if(b=d&-d,a.callbackPriority!==b){null!=c&&bc(c);if(1===b)0===a.tag?ig(Fk.bind(null,a)):hg(Fk.bind(null,a)),Jf(function(){0===(K&6)&&jg();}),c=null;else {switch(Dc(d)){case 1:c=fc;break;case 4:c=gc;break;case 16:c=hc;break;case 536870912:c=jc;break;default:c=hc;}c=Gk(c,Hk.bind(null,a));}a.callbackPriority=b;a.callbackNode=c;}}
function Hk(a,b){Bk=-1;Ck=0;if(0!==(K&6))throw Error(p$2(327));var c=a.callbackNode;if(Ik()&&a.callbackNode!==c)return null;var d=uc(a,a===R?Z:0);if(0===d)return null;if(0!==(d&30)||0!==(d&a.expiredLanes)||b)b=Jk(a,d);else {b=d;var e=K;K|=2;var f=Kk();if(R!==a||Z!==b)vk=null,Hj=B()+500,Lk(a,b);do try{Mk();break}catch(h){Nk(a,h);}while(1);Qg();nk.current=f;K=e;null!==Y?b=0:(R=null,Z=0,b=T);}if(0!==b){2===b&&(e=xc(a),0!==e&&(d=e,b=Ok(a,e)));if(1===b)throw c=qk,Lk(a,0),Dk(a,d),Ek(a,B()),c;if(6===b)Dk(a,d);
else {e=a.current.alternate;if(0===(d&30)&&!Pk(e)&&(b=Jk(a,d),2===b&&(f=xc(a),0!==f&&(d=f,b=Ok(a,f))),1===b))throw c=qk,Lk(a,0),Dk(a,d),Ek(a,B()),c;a.finishedWork=e;a.finishedLanes=d;switch(b){case 0:case 1:throw Error(p$2(345));case 2:Qk(a,uk,vk);break;case 3:Dk(a,d);if((d&130023424)===d&&(b=gk+500-B(),10<b)){if(0!==uc(a,0))break;e=a.suspendedLanes;if((e&d)!==d){L();a.pingedLanes|=a.suspendedLanes&e;break}a.timeoutHandle=Ff(Qk.bind(null,a,uk,vk),b);break}Qk(a,uk,vk);break;case 4:Dk(a,d);if((d&4194240)===
d)break;b=a.eventTimes;for(e=-1;0<d;){var g=31-oc(d);f=1<<g;g=b[g];g>e&&(e=g);d&=~f;}d=e;d=B()-d;d=(120>d?120:480>d?480:1080>d?1080:1920>d?1920:3E3>d?3E3:4320>d?4320:1960*mk(d/1960))-d;if(10<d){a.timeoutHandle=Ff(Qk.bind(null,a,uk,vk),d);break}Qk(a,uk,vk);break;case 5:Qk(a,uk,vk);break;default:throw Error(p$2(329));}}}Ek(a,B());return a.callbackNode===c?Hk.bind(null,a):null}
function Ok(a,b){var c=tk;a.current.memoizedState.isDehydrated&&(Lk(a,b).flags|=256);a=Jk(a,b);2!==a&&(b=uk,uk=c,null!==b&&Gj(b));return a}function Gj(a){null===uk?uk=a:uk.push.apply(uk,a);}
function Pk(a){for(var b=a;;){if(b.flags&16384){var c=b.updateQueue;if(null!==c&&(c=c.stores,null!==c))for(var d=0;d<c.length;d++){var e=c[d],f=e.getSnapshot;e=e.value;try{if(!He(f(),e))return !1}catch(g){return !1}}}c=b.child;if(b.subtreeFlags&16384&&null!==c)c.return=b,b=c;else {if(b===a)break;for(;null===b.sibling;){if(null===b.return||b.return===a)return !0;b=b.return;}b.sibling.return=b.return;b=b.sibling;}}return !0}
function Dk(a,b){b&=~sk;b&=~rk;a.suspendedLanes|=b;a.pingedLanes&=~b;for(a=a.expirationTimes;0<b;){var c=31-oc(b),d=1<<c;a[c]=-1;b&=~d;}}function Fk(a){if(0!==(K&6))throw Error(p$2(327));Ik();var b=uc(a,0);if(0===(b&1))return Ek(a,B()),null;var c=Jk(a,b);if(0!==a.tag&&2===c){var d=xc(a);0!==d&&(b=d,c=Ok(a,d));}if(1===c)throw c=qk,Lk(a,0),Dk(a,b),Ek(a,B()),c;if(6===c)throw Error(p$2(345));a.finishedWork=a.current.alternate;a.finishedLanes=b;Qk(a,uk,vk);Ek(a,B());return null}
function Rk(a,b){var c=K;K|=1;try{return a(b)}finally{K=c,0===K&&(Hj=B()+500,fg&&jg());}}function Sk(a){null!==xk&&0===xk.tag&&0===(K&6)&&Ik();var b=K;K|=1;var c=pk.transition,d=C;try{if(pk.transition=null,C=1,a)return a()}finally{C=d,pk.transition=c,K=b,0===(K&6)&&jg();}}function Ij(){gj=fj.current;E(fj);}
function Lk(a,b){a.finishedWork=null;a.finishedLanes=0;var c=a.timeoutHandle;-1!==c&&(a.timeoutHandle=-1,Gf(c));if(null!==Y)for(c=Y.return;null!==c;){var d=c;wg(d);switch(d.tag){case 1:d=d.type.childContextTypes;null!==d&&void 0!==d&&$f();break;case 3:Jh();E(Wf);E(H);Oh();break;case 5:Lh(d);break;case 4:Jh();break;case 13:E(M);break;case 19:E(M);break;case 10:Rg(d.type._context);break;case 22:case 23:Ij();}c=c.return;}R=a;Y=a=wh(a.current,null);Z=gj=b;T=0;qk=null;sk=rk=hh=0;uk=tk=null;if(null!==Wg){for(b=
0;b<Wg.length;b++)if(c=Wg[b],d=c.interleaved,null!==d){c.interleaved=null;var e=d.next,f=c.pending;if(null!==f){var g=f.next;f.next=e;d.next=g;}c.pending=d;}Wg=null;}return a}
function Nk(a,b){do{var c=Y;try{Qg();Ph.current=ai;if(Sh){for(var d=N.memoizedState;null!==d;){var e=d.queue;null!==e&&(e.pending=null);d=d.next;}Sh=!1;}Rh=0;P=O=N=null;Th=!1;Uh=0;ok.current=null;if(null===c||null===c.return){T=1;qk=b;Y=null;break}a:{var f=a,g=c.return,h=c,k=b;b=Z;h.flags|=32768;if(null!==k&&"object"===typeof k&&"function"===typeof k.then){var l=k,m=h,q=m.tag;if(0===(m.mode&1)&&(0===q||11===q||15===q)){var r=m.alternate;r?(m.updateQueue=r.updateQueue,m.memoizedState=r.memoizedState,
m.lanes=r.lanes):(m.updateQueue=null,m.memoizedState=null);}var y=Vi(g);if(null!==y){y.flags&=-257;Wi(y,g,h,f,b);y.mode&1&&Ti(f,l,b);b=y;k=l;var n=b.updateQueue;if(null===n){var t=new Set;t.add(k);b.updateQueue=t;}else n.add(k);break a}else {if(0===(b&1)){Ti(f,l,b);uj();break a}k=Error(p$2(426));}}else if(I&&h.mode&1){var J=Vi(g);if(null!==J){0===(J.flags&65536)&&(J.flags|=256);Wi(J,g,h,f,b);Jg(Ki(k,h));break a}}f=k=Ki(k,h);4!==T&&(T=2);null===tk?tk=[f]:tk.push(f);f=g;do{switch(f.tag){case 3:f.flags|=65536;
b&=-b;f.lanes|=b;var x=Oi(f,k,b);fh(f,x);break a;case 1:h=k;var w=f.type,u=f.stateNode;if(0===(f.flags&128)&&("function"===typeof w.getDerivedStateFromError||null!==u&&"function"===typeof u.componentDidCatch&&(null===Si||!Si.has(u)))){f.flags|=65536;b&=-b;f.lanes|=b;var F=Ri(f,h,b);fh(f,F);break a}}f=f.return;}while(null!==f)}Tk(c);}catch(na){b=na;Y===c&&null!==c&&(Y=c=c.return);continue}break}while(1)}function Kk(){var a=nk.current;nk.current=ai;return null===a?ai:a}
function uj(){if(0===T||3===T||2===T)T=4;null===R||0===(hh&268435455)&&0===(rk&268435455)||Dk(R,Z);}function Jk(a,b){var c=K;K|=2;var d=Kk();if(R!==a||Z!==b)vk=null,Lk(a,b);do try{Uk();break}catch(e){Nk(a,e);}while(1);Qg();K=c;nk.current=d;if(null!==Y)throw Error(p$2(261));R=null;Z=0;return T}function Uk(){for(;null!==Y;)Vk(Y);}function Mk(){for(;null!==Y&&!cc();)Vk(Y);}function Vk(a){var b=Wk(a.alternate,a,gj);a.memoizedProps=a.pendingProps;null===b?Tk(a):Y=b;ok.current=null;}
function Tk(a){var b=a;do{var c=b.alternate;a=b.return;if(0===(b.flags&32768)){if(c=Fj(c,b,gj),null!==c){Y=c;return}}else {c=Jj(c,b);if(null!==c){c.flags&=32767;Y=c;return}if(null!==a)a.flags|=32768,a.subtreeFlags=0,a.deletions=null;else {T=6;Y=null;return}}b=b.sibling;if(null!==b){Y=b;return}Y=b=a;}while(null!==b);0===T&&(T=5);}function Qk(a,b,c){var d=C,e=pk.transition;try{pk.transition=null,C=1,Xk(a,b,c,d);}finally{pk.transition=e,C=d;}return null}
function Xk(a,b,c,d){do Ik();while(null!==xk);if(0!==(K&6))throw Error(p$2(327));c=a.finishedWork;var e=a.finishedLanes;if(null===c)return null;a.finishedWork=null;a.finishedLanes=0;if(c===a.current)throw Error(p$2(177));a.callbackNode=null;a.callbackPriority=0;var f=c.lanes|c.childLanes;Bc(a,f);a===R&&(Y=R=null,Z=0);0===(c.subtreeFlags&2064)&&0===(c.flags&2064)||wk||(wk=!0,Gk(hc,function(){Ik();return null}));f=0!==(c.flags&15990);if(0!==(c.subtreeFlags&15990)||f){f=pk.transition;pk.transition=null;
var g=C;C=1;var h=K;K|=4;ok.current=null;Pj(a,c);ek(c,a);Oe(Df);dd=!!Cf;Df=Cf=null;a.current=c;ik(c);dc();K=h;C=g;pk.transition=f;}else a.current=c;wk&&(wk=!1,xk=a,yk=e);f=a.pendingLanes;0===f&&(Si=null);mc(c.stateNode);Ek(a,B());if(null!==b)for(d=a.onRecoverableError,c=0;c<b.length;c++)e=b[c],d(e.value,{componentStack:e.stack,digest:e.digest});if(Pi)throw Pi=!1,a=Qi,Qi=null,a;0!==(yk&1)&&0!==a.tag&&Ik();f=a.pendingLanes;0!==(f&1)?a===Ak?zk++:(zk=0,Ak=a):zk=0;jg();return null}
function Ik(){if(null!==xk){var a=Dc(yk),b=pk.transition,c=C;try{pk.transition=null;C=16>a?16:a;if(null===xk)var d=!1;else {a=xk;xk=null;yk=0;if(0!==(K&6))throw Error(p$2(331));var e=K;K|=4;for(V=a.current;null!==V;){var f=V,g=f.child;if(0!==(V.flags&16)){var h=f.deletions;if(null!==h){for(var k=0;k<h.length;k++){var l=h[k];for(V=l;null!==V;){var m=V;switch(m.tag){case 0:case 11:case 15:Qj(8,m,f);}var q=m.child;if(null!==q)q.return=m,V=q;else for(;null!==V;){m=V;var r=m.sibling,y=m.return;Tj(m);if(m===
l){V=null;break}if(null!==r){r.return=y;V=r;break}V=y;}}}var n=f.alternate;if(null!==n){var t=n.child;if(null!==t){n.child=null;do{var J=t.sibling;t.sibling=null;t=J;}while(null!==t)}}V=f;}}if(0!==(f.subtreeFlags&2064)&&null!==g)g.return=f,V=g;else b:for(;null!==V;){f=V;if(0!==(f.flags&2048))switch(f.tag){case 0:case 11:case 15:Qj(9,f,f.return);}var x=f.sibling;if(null!==x){x.return=f.return;V=x;break b}V=f.return;}}var w=a.current;for(V=w;null!==V;){g=V;var u=g.child;if(0!==(g.subtreeFlags&2064)&&null!==
u)u.return=g,V=u;else b:for(g=w;null!==V;){h=V;if(0!==(h.flags&2048))try{switch(h.tag){case 0:case 11:case 15:Rj(9,h);}}catch(na){W(h,h.return,na);}if(h===g){V=null;break b}var F=h.sibling;if(null!==F){F.return=h.return;V=F;break b}V=h.return;}}K=e;jg();if(lc&&"function"===typeof lc.onPostCommitFiberRoot)try{lc.onPostCommitFiberRoot(kc,a);}catch(na){}d=!0;}return d}finally{C=c,pk.transition=b;}}return !1}function Yk(a,b,c){b=Ki(c,b);b=Oi(a,b,1);a=dh(a,b,1);b=L();null!==a&&(Ac(a,1,b),Ek(a,b));}
function W(a,b,c){if(3===a.tag)Yk(a,a,c);else for(;null!==b;){if(3===b.tag){Yk(b,a,c);break}else if(1===b.tag){var d=b.stateNode;if("function"===typeof b.type.getDerivedStateFromError||"function"===typeof d.componentDidCatch&&(null===Si||!Si.has(d))){a=Ki(c,a);a=Ri(b,a,1);b=dh(b,a,1);a=L();null!==b&&(Ac(b,1,a),Ek(b,a));break}}b=b.return;}}
function Ui(a,b,c){var d=a.pingCache;null!==d&&d.delete(b);b=L();a.pingedLanes|=a.suspendedLanes&c;R===a&&(Z&c)===c&&(4===T||3===T&&(Z&130023424)===Z&&500>B()-gk?Lk(a,0):sk|=c);Ek(a,b);}function Zk(a,b){0===b&&(0===(a.mode&1)?b=1:(b=sc,sc<<=1,0===(sc&130023424)&&(sc=4194304)));var c=L();a=Zg(a,b);null!==a&&(Ac(a,b,c),Ek(a,c));}function vj(a){var b=a.memoizedState,c=0;null!==b&&(c=b.retryLane);Zk(a,c);}
function ck(a,b){var c=0;switch(a.tag){case 13:var d=a.stateNode;var e=a.memoizedState;null!==e&&(c=e.retryLane);break;case 19:d=a.stateNode;break;default:throw Error(p$2(314));}null!==d&&d.delete(b);Zk(a,c);}var Wk;
Wk=function(a,b,c){if(null!==a)if(a.memoizedProps!==b.pendingProps||Wf.current)Ug=!0;else {if(0===(a.lanes&c)&&0===(b.flags&128))return Ug=!1,zj(a,b,c);Ug=0!==(a.flags&131072)?!0:!1;}else Ug=!1,I&&0!==(b.flags&1048576)&&ug(b,ng,b.index);b.lanes=0;switch(b.tag){case 2:var d=b.type;jj(a,b);a=b.pendingProps;var e=Yf(b,H.current);Tg(b,c);e=Xh(null,b,d,a,e,c);var f=bi();b.flags|=1;"object"===typeof e&&null!==e&&"function"===typeof e.render&&void 0===e.$$typeof?(b.tag=1,b.memoizedState=null,b.updateQueue=
null,Zf(d)?(f=!0,cg(b)):f=!1,b.memoizedState=null!==e.state&&void 0!==e.state?e.state:null,ah(b),e.updater=nh,b.stateNode=e,e._reactInternals=b,rh(b,d,a,c),b=kj(null,b,d,!0,f,c)):(b.tag=0,I&&f&&vg(b),Yi(null,b,e,c),b=b.child);return b;case 16:d=b.elementType;a:{jj(a,b);a=b.pendingProps;e=d._init;d=e(d._payload);b.type=d;e=b.tag=$k(d);a=Lg(d,a);switch(e){case 0:b=dj(null,b,d,a,c);break a;case 1:b=ij(null,b,d,a,c);break a;case 11:b=Zi(null,b,d,a,c);break a;case 14:b=aj(null,b,d,Lg(d.type,a),c);break a}throw Error(p$2(306,
d,""));}return b;case 0:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Lg(d,e),dj(a,b,d,e,c);case 1:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Lg(d,e),ij(a,b,d,e,c);case 3:a:{lj(b);if(null===a)throw Error(p$2(387));d=b.pendingProps;f=b.memoizedState;e=f.element;bh(a,b);gh(b,d,null,c);var g=b.memoizedState;d=g.element;if(f.isDehydrated)if(f={element:d,isDehydrated:!1,cache:g.cache,pendingSuspenseBoundaries:g.pendingSuspenseBoundaries,transitions:g.transitions},b.updateQueue.baseState=
f,b.memoizedState=f,b.flags&256){e=Ki(Error(p$2(423)),b);b=mj(a,b,d,c,e);break a}else if(d!==e){e=Ki(Error(p$2(424)),b);b=mj(a,b,d,c,e);break a}else for(yg=Lf(b.stateNode.containerInfo.firstChild),xg=b,I=!0,zg=null,c=Ch(b,null,d,c),b.child=c;c;)c.flags=c.flags&-3|4096,c=c.sibling;else {Ig();if(d===e){b=$i(a,b,c);break a}Yi(a,b,d,c);}b=b.child;}return b;case 5:return Kh(b),null===a&&Eg(b),d=b.type,e=b.pendingProps,f=null!==a?a.memoizedProps:null,g=e.children,Ef(d,e)?g=null:null!==f&&Ef(d,f)&&(b.flags|=32),
hj(a,b),Yi(a,b,g,c),b.child;case 6:return null===a&&Eg(b),null;case 13:return pj(a,b,c);case 4:return Ih(b,b.stateNode.containerInfo),d=b.pendingProps,null===a?b.child=Bh(b,null,d,c):Yi(a,b,d,c),b.child;case 11:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Lg(d,e),Zi(a,b,d,e,c);case 7:return Yi(a,b,b.pendingProps,c),b.child;case 8:return Yi(a,b,b.pendingProps.children,c),b.child;case 12:return Yi(a,b,b.pendingProps.children,c),b.child;case 10:a:{d=b.type._context;e=b.pendingProps;f=b.memoizedProps;
g=e.value;G(Mg,d._currentValue);d._currentValue=g;if(null!==f)if(He(f.value,g)){if(f.children===e.children&&!Wf.current){b=$i(a,b,c);break a}}else for(f=b.child,null!==f&&(f.return=b);null!==f;){var h=f.dependencies;if(null!==h){g=f.child;for(var k=h.firstContext;null!==k;){if(k.context===d){if(1===f.tag){k=ch(-1,c&-c);k.tag=2;var l=f.updateQueue;if(null!==l){l=l.shared;var m=l.pending;null===m?k.next=k:(k.next=m.next,m.next=k);l.pending=k;}}f.lanes|=c;k=f.alternate;null!==k&&(k.lanes|=c);Sg(f.return,
c,b);h.lanes|=c;break}k=k.next;}}else if(10===f.tag)g=f.type===b.type?null:f.child;else if(18===f.tag){g=f.return;if(null===g)throw Error(p$2(341));g.lanes|=c;h=g.alternate;null!==h&&(h.lanes|=c);Sg(g,c,b);g=f.sibling;}else g=f.child;if(null!==g)g.return=f;else for(g=f;null!==g;){if(g===b){g=null;break}f=g.sibling;if(null!==f){f.return=g.return;g=f;break}g=g.return;}f=g;}Yi(a,b,e.children,c);b=b.child;}return b;case 9:return e=b.type,d=b.pendingProps.children,Tg(b,c),e=Vg(e),d=d(e),b.flags|=1,Yi(a,b,d,c),
b.child;case 14:return d=b.type,e=Lg(d,b.pendingProps),e=Lg(d.type,e),aj(a,b,d,e,c);case 15:return cj(a,b,b.type,b.pendingProps,c);case 17:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Lg(d,e),jj(a,b),b.tag=1,Zf(d)?(a=!0,cg(b)):a=!1,Tg(b,c),ph(b,d,e),rh(b,d,e,c),kj(null,b,d,!0,a,c);case 19:return yj(a,b,c);case 22:return ej(a,b,c)}throw Error(p$2(156,b.tag));};function Gk(a,b){return ac(a,b)}
function al(a,b,c,d){this.tag=a;this.key=c;this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null;this.index=0;this.ref=null;this.pendingProps=b;this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null;this.mode=d;this.subtreeFlags=this.flags=0;this.deletions=null;this.childLanes=this.lanes=0;this.alternate=null;}function Bg(a,b,c,d){return new al(a,b,c,d)}function bj(a){a=a.prototype;return !(!a||!a.isReactComponent)}
function $k(a){if("function"===typeof a)return bj(a)?1:0;if(void 0!==a&&null!==a){a=a.$$typeof;if(a===Da)return 11;if(a===Ga)return 14}return 2}
function wh(a,b){var c=a.alternate;null===c?(c=Bg(a.tag,b,a.key,a.mode),c.elementType=a.elementType,c.type=a.type,c.stateNode=a.stateNode,c.alternate=a,a.alternate=c):(c.pendingProps=b,c.type=a.type,c.flags=0,c.subtreeFlags=0,c.deletions=null);c.flags=a.flags&14680064;c.childLanes=a.childLanes;c.lanes=a.lanes;c.child=a.child;c.memoizedProps=a.memoizedProps;c.memoizedState=a.memoizedState;c.updateQueue=a.updateQueue;b=a.dependencies;c.dependencies=null===b?null:{lanes:b.lanes,firstContext:b.firstContext};
c.sibling=a.sibling;c.index=a.index;c.ref=a.ref;return c}
function yh(a,b,c,d,e,f){var g=2;d=a;if("function"===typeof a)bj(a)&&(g=1);else if("string"===typeof a)g=5;else a:switch(a){case ya:return Ah(c.children,e,f,b);case za:g=8;e|=8;break;case Aa:return a=Bg(12,c,b,e|2),a.elementType=Aa,a.lanes=f,a;case Ea:return a=Bg(13,c,b,e),a.elementType=Ea,a.lanes=f,a;case Fa:return a=Bg(19,c,b,e),a.elementType=Fa,a.lanes=f,a;case Ia:return qj(c,e,f,b);default:if("object"===typeof a&&null!==a)switch(a.$$typeof){case Ba:g=10;break a;case Ca:g=9;break a;case Da:g=11;
break a;case Ga:g=14;break a;case Ha:g=16;d=null;break a}throw Error(p$2(130,null==a?a:typeof a,""));}b=Bg(g,c,b,e);b.elementType=a;b.type=d;b.lanes=f;return b}function Ah(a,b,c,d){a=Bg(7,a,d,b);a.lanes=c;return a}function qj(a,b,c,d){a=Bg(22,a,d,b);a.elementType=Ia;a.lanes=c;a.stateNode={isHidden:!1};return a}function xh(a,b,c){a=Bg(6,a,null,b);a.lanes=c;return a}
function zh(a,b,c){b=Bg(4,null!==a.children?a.children:[],a.key,b);b.lanes=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}
function bl(a,b,c,d,e){this.tag=b;this.containerInfo=a;this.finishedWork=this.pingCache=this.current=this.pendingChildren=null;this.timeoutHandle=-1;this.callbackNode=this.pendingContext=this.context=null;this.callbackPriority=0;this.eventTimes=zc(0);this.expirationTimes=zc(-1);this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0;this.entanglements=zc(0);this.identifierPrefix=d;this.onRecoverableError=e;this.mutableSourceEagerHydrationData=
null;}function cl(a,b,c,d,e,f,g,h,k){a=new bl(a,b,c,h,k);1===b?(b=1,!0===f&&(b|=8)):b=0;f=Bg(3,null,null,b);a.current=f;f.stateNode=a;f.memoizedState={element:d,isDehydrated:c,cache:null,transitions:null,pendingSuspenseBoundaries:null};ah(f);return a}function dl(a,b,c){var d=3<arguments.length&&void 0!==arguments[3]?arguments[3]:null;return {$$typeof:wa,key:null==d?null:""+d,children:a,containerInfo:b,implementation:c}}
function el(a){if(!a)return Vf;a=a._reactInternals;a:{if(Vb(a)!==a||1!==a.tag)throw Error(p$2(170));var b=a;do{switch(b.tag){case 3:b=b.stateNode.context;break a;case 1:if(Zf(b.type)){b=b.stateNode.__reactInternalMemoizedMergedChildContext;break a}}b=b.return;}while(null!==b);throw Error(p$2(171));}if(1===a.tag){var c=a.type;if(Zf(c))return bg(a,c,b)}return b}
function fl(a,b,c,d,e,f,g,h,k){a=cl(c,d,!0,a,e,f,g,h,k);a.context=el(null);c=a.current;d=L();e=lh(c);f=ch(d,e);f.callback=void 0!==b&&null!==b?b:null;dh(c,f,e);a.current.lanes=e;Ac(a,e,d);Ek(a,d);return a}function gl(a,b,c,d){var e=b.current,f=L(),g=lh(e);c=el(c);null===b.context?b.context=c:b.pendingContext=c;b=ch(f,g);b.payload={element:a};d=void 0===d?null:d;null!==d&&(b.callback=d);a=dh(e,b,g);null!==a&&(mh(a,e,g,f),eh(a,e,g));return g}
function hl(a){a=a.current;if(!a.child)return null;switch(a.child.tag){case 5:return a.child.stateNode;default:return a.child.stateNode}}function il(a,b){a=a.memoizedState;if(null!==a&&null!==a.dehydrated){var c=a.retryLane;a.retryLane=0!==c&&c<b?c:b;}}function jl(a,b){il(a,b);(a=a.alternate)&&il(a,b);}function kl(){return null}var ll="function"===typeof reportError?reportError:function(a){console.error(a);};function ml(a){this._internalRoot=a;}
nl.prototype.render=ml.prototype.render=function(a){var b=this._internalRoot;if(null===b)throw Error(p$2(409));gl(a,b,null,null);};nl.prototype.unmount=ml.prototype.unmount=function(){var a=this._internalRoot;if(null!==a){this._internalRoot=null;var b=a.containerInfo;Sk(function(){gl(null,a,null,null);});b[uf]=null;}};function nl(a){this._internalRoot=a;}
nl.prototype.unstable_scheduleHydration=function(a){if(a){var b=Hc();a={blockedOn:null,target:a,priority:b};for(var c=0;c<Qc.length&&0!==b&&b<Qc[c].priority;c++);Qc.splice(c,0,a);0===c&&Vc(a);}};function ol(a){return !(!a||1!==a.nodeType&&9!==a.nodeType&&11!==a.nodeType)}function pl(a){return !(!a||1!==a.nodeType&&9!==a.nodeType&&11!==a.nodeType&&(8!==a.nodeType||" react-mount-point-unstable "!==a.nodeValue))}function ql(){}
function rl(a,b,c,d,e){if(e){if("function"===typeof d){var f=d;d=function(){var a=hl(g);f.call(a);};}var g=fl(b,d,a,0,null,!1,!1,"",ql);a._reactRootContainer=g;a[uf]=g.current;sf(8===a.nodeType?a.parentNode:a);Sk();return g}for(;e=a.lastChild;)a.removeChild(e);if("function"===typeof d){var h=d;d=function(){var a=hl(k);h.call(a);};}var k=cl(a,0,!1,null,null,!1,!1,"",ql);a._reactRootContainer=k;a[uf]=k.current;sf(8===a.nodeType?a.parentNode:a);Sk(function(){gl(b,k,c,d);});return k}
function sl(a,b,c,d,e){var f=c._reactRootContainer;if(f){var g=f;if("function"===typeof e){var h=e;e=function(){var a=hl(g);h.call(a);};}gl(b,g,a,e);}else g=rl(c,b,a,e,d);return hl(g)}Ec=function(a){switch(a.tag){case 3:var b=a.stateNode;if(b.current.memoizedState.isDehydrated){var c=tc(b.pendingLanes);0!==c&&(Cc(b,c|1),Ek(b,B()),0===(K&6)&&(Hj=B()+500,jg()));}break;case 13:Sk(function(){var b=Zg(a,1);if(null!==b){var c=L();mh(b,a,1,c);}}),jl(a,1);}};
Fc=function(a){if(13===a.tag){var b=Zg(a,134217728);if(null!==b){var c=L();mh(b,a,134217728,c);}jl(a,134217728);}};Gc=function(a){if(13===a.tag){var b=lh(a),c=Zg(a,b);if(null!==c){var d=L();mh(c,a,b,d);}jl(a,b);}};Hc=function(){return C};Ic=function(a,b){var c=C;try{return C=a,b()}finally{C=c;}};
yb=function(a,b,c){switch(b){case "input":bb(a,c);b=c.name;if("radio"===c.type&&null!=b){for(c=a;c.parentNode;)c=c.parentNode;c=c.querySelectorAll("input[name="+JSON.stringify(""+b)+'][type="radio"]');for(b=0;b<c.length;b++){var d=c[b];if(d!==a&&d.form===a.form){var e=Db(d);if(!e)throw Error(p$2(90));Wa(d);bb(d,e);}}}break;case "textarea":ib(a,c);break;case "select":b=c.value,null!=b&&fb(a,!!c.multiple,b,!1);}};Gb=Rk;Hb=Sk;
var tl={usingClientEntryPoint:!1,Events:[Cb,ue,Db,Eb,Fb,Rk]},ul={findFiberByHostInstance:Wc,bundleType:0,version:"18.2.0",rendererPackageName:"react-dom"};
var vl={bundleType:ul.bundleType,version:ul.version,rendererPackageName:ul.rendererPackageName,rendererConfig:ul.rendererConfig,overrideHookState:null,overrideHookStateDeletePath:null,overrideHookStateRenamePath:null,overrideProps:null,overridePropsDeletePath:null,overridePropsRenamePath:null,setErrorHandler:null,setSuspenseHandler:null,scheduleUpdate:null,currentDispatcherRef:ua.ReactCurrentDispatcher,findHostInstanceByFiber:function(a){a=Zb(a);return null===a?null:a.stateNode},findFiberByHostInstance:ul.findFiberByHostInstance||
kl,findHostInstancesForRefresh:null,scheduleRefresh:null,scheduleRoot:null,setRefreshHandler:null,getCurrentFiber:null,reconcilerVersion:"18.2.0-next-9e3b772b8-20220608"};if("undefined"!==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__){var wl=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!wl.isDisabled&&wl.supportsFiber)try{kc=wl.inject(vl),lc=wl;}catch(a){}}reactDom_production_min.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=tl;
reactDom_production_min.createPortal=function(a,b){var c=2<arguments.length&&void 0!==arguments[2]?arguments[2]:null;if(!ol(b))throw Error(p$2(200));return dl(a,b,null,c)};reactDom_production_min.createRoot=function(a,b){if(!ol(a))throw Error(p$2(299));var c=!1,d="",e=ll;null!==b&&void 0!==b&&(!0===b.unstable_strictMode&&(c=!0),void 0!==b.identifierPrefix&&(d=b.identifierPrefix),void 0!==b.onRecoverableError&&(e=b.onRecoverableError));b=cl(a,1,!1,null,null,c,!1,d,e);a[uf]=b.current;sf(8===a.nodeType?a.parentNode:a);return new ml(b)};
reactDom_production_min.findDOMNode=function(a){if(null==a)return null;if(1===a.nodeType)return a;var b=a._reactInternals;if(void 0===b){if("function"===typeof a.render)throw Error(p$2(188));a=Object.keys(a).join(",");throw Error(p$2(268,a));}a=Zb(b);a=null===a?null:a.stateNode;return a};reactDom_production_min.flushSync=function(a){return Sk(a)};reactDom_production_min.hydrate=function(a,b,c){if(!pl(b))throw Error(p$2(200));return sl(null,a,b,!0,c)};
reactDom_production_min.hydrateRoot=function(a,b,c){if(!ol(a))throw Error(p$2(405));var d=null!=c&&c.hydratedSources||null,e=!1,f="",g=ll;null!==c&&void 0!==c&&(!0===c.unstable_strictMode&&(e=!0),void 0!==c.identifierPrefix&&(f=c.identifierPrefix),void 0!==c.onRecoverableError&&(g=c.onRecoverableError));b=fl(b,null,a,1,null!=c?c:null,e,!1,f,g);a[uf]=b.current;sf(a);if(d)for(a=0;a<d.length;a++)c=d[a],e=c._getVersion,e=e(c._source),null==b.mutableSourceEagerHydrationData?b.mutableSourceEagerHydrationData=[c,e]:b.mutableSourceEagerHydrationData.push(c,
e);return new nl(b)};reactDom_production_min.render=function(a,b,c){if(!pl(b))throw Error(p$2(200));return sl(null,a,b,!1,c)};reactDom_production_min.unmountComponentAtNode=function(a){if(!pl(a))throw Error(p$2(40));return a._reactRootContainer?(Sk(function(){sl(null,null,a,!1,function(){a._reactRootContainer=null;a[uf]=null;});}),!0):!1};reactDom_production_min.unstable_batchedUpdates=Rk;
reactDom_production_min.unstable_renderSubtreeIntoContainer=function(a,b,c,d){if(!pl(c))throw Error(p$2(200));if(null==a||void 0===a._reactInternals)throw Error(p$2(38));return sl(a,b,c,!1,d)};reactDom_production_min.version="18.2.0-next-9e3b772b8-20220608";
(function (module) {
function checkDCE() {
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
if (
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' ||
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function'
) {
return;
}
try {
// Verify that the code above has been dead code eliminated (DCE'd).
__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE);
} catch (err) {
// DevTools shouldn't crash React, no matter what.
// We should still report in case we break this code.
console.error(err);
}
}
{
// DCE check should happen before ReactDOM bundle executes so that
// DevTools can report bad minification during injection.
checkDCE();
module.exports = reactDom_production_min;
}
} (reactDom));
const ReactDOM = /*@__PURE__*/getDefaultExportFromCjs(reactDomExports);
// Default to a dummy "batch" implementation that just runs the callback
function defaultNoopBatch(callback) {
callback();
}
let batch = defaultNoopBatch; // Allow injecting another batching function later
const setBatch = newBatch => batch = newBatch; // Supply a getter just to skip dealing with ESM bindings
const getBatch = () => batch;
const ReactReduxContext = /*#__PURE__*/reactExports.createContext(null);
/**
* A hook to access the value of the `ReactReduxContext`. This is a low-level
* hook that you should usually not need to call directly.
*
* @returns {any} the value of the `ReactReduxContext`
*
* @example
*
* import React from 'react'
* import { useReduxContext } from 'react-redux'
*
* export const CounterComponent = () => {
* const { store } = useReduxContext()
* return <div>{store.getState()}</div>
* }
*/
function useReduxContext() {
const contextValue = reactExports.useContext(ReactReduxContext);
return contextValue;
}
const notInitialized = () => {
throw new Error('uSES not initialized!');
};
let useSyncExternalStoreWithSelector = notInitialized;
const initializeUseSelector = fn => {
useSyncExternalStoreWithSelector = fn;
};
const refEquality = (a, b) => a === b;
/**
* Hook factory, which creates a `useSelector` hook bound to a given context.
*
* @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
* @returns {Function} A `useSelector` hook bound to the specified context.
*/
function createSelectorHook(context = ReactReduxContext) {
const useReduxContext$1 = context === ReactReduxContext ? useReduxContext : () => reactExports.useContext(context);
return function useSelector(selector, equalityFn = refEquality) {
const {
store,
subscription,
getServerState
} = useReduxContext$1();
const selectedState = useSyncExternalStoreWithSelector(subscription.addNestedSub, store.getState, getServerState || store.getState, selector, equalityFn);
reactExports.useDebugValue(selectedState);
return selectedState;
};
}
/**
* A hook to access the redux store's state. This hook takes a selector function
* as an argument. The selector is called with the store state.
*
* This hook takes an optional equality comparison function as the second parameter
* that allows you to customize the way the selected state is compared to determine
* whether the component needs to be re-rendered.
*
* @param {Function} selector the selector function
* @param {Function=} equalityFn the function that will be used to determine equality
*
* @returns {any} the selected state
*
* @example
*
* import React from 'react'
* import { useSelector } from 'react-redux'
*
* export const CounterComponent = () => {
* const counter = useSelector(state => state.counter)
* return <div>{counter}</div>
* }
*/
const useSelector = /*#__PURE__*/createSelectorHook();
function _extends() {
_extends = Object.assign ? Object.assign.bind() : function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
function _objectWithoutPropertiesLoose$2(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
var reactIsExports$1 = {};
var reactIs$2 = {
get exports(){ return reactIsExports$1; },
set exports(v){ reactIsExports$1 = v; },
};
var reactIs_production_min$1 = {};
/** @license React v16.13.1
* react-is.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var b$1="function"===typeof Symbol&&Symbol.for,c$1=b$1?Symbol.for("react.element"):60103,d$1=b$1?Symbol.for("react.portal"):60106,e$1=b$1?Symbol.for("react.fragment"):60107,f$1=b$1?Symbol.for("react.strict_mode"):60108,g$1=b$1?Symbol.for("react.profiler"):60114,h$1=b$1?Symbol.for("react.provider"):60109,k$1=b$1?Symbol.for("react.context"):60110,l$1=b$1?Symbol.for("react.async_mode"):60111,m$2=b$1?Symbol.for("react.concurrent_mode"):60111,n$1=b$1?Symbol.for("react.forward_ref"):60112,p$1=b$1?Symbol.for("react.suspense"):60113,q$1=b$1?
Symbol.for("react.suspense_list"):60120,r$1=b$1?Symbol.for("react.memo"):60115,t$1=b$1?Symbol.for("react.lazy"):60116,v$1=b$1?Symbol.for("react.block"):60121,w=b$1?Symbol.for("react.fundamental"):60117,x=b$1?Symbol.for("react.responder"):60118,y=b$1?Symbol.for("react.scope"):60119;
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c$1:switch(a=a.type,a){case l$1:case m$2:case e$1:case g$1:case f$1:case p$1:return a;default:switch(a=a&&a.$$typeof,a){case k$1:case n$1:case t$1:case r$1:case h$1:return a;default:return u}}case d$1:return u}}}function A(a){return z(a)===m$2}reactIs_production_min$1.AsyncMode=l$1;reactIs_production_min$1.ConcurrentMode=m$2;reactIs_production_min$1.ContextConsumer=k$1;reactIs_production_min$1.ContextProvider=h$1;reactIs_production_min$1.Element=c$1;reactIs_production_min$1.ForwardRef=n$1;reactIs_production_min$1.Fragment=e$1;reactIs_production_min$1.Lazy=t$1;reactIs_production_min$1.Memo=r$1;reactIs_production_min$1.Portal=d$1;
reactIs_production_min$1.Profiler=g$1;reactIs_production_min$1.StrictMode=f$1;reactIs_production_min$1.Suspense=p$1;reactIs_production_min$1.isAsyncMode=function(a){return A(a)||z(a)===l$1};reactIs_production_min$1.isConcurrentMode=A;reactIs_production_min$1.isContextConsumer=function(a){return z(a)===k$1};reactIs_production_min$1.isContextProvider=function(a){return z(a)===h$1};reactIs_production_min$1.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c$1};reactIs_production_min$1.isForwardRef=function(a){return z(a)===n$1};reactIs_production_min$1.isFragment=function(a){return z(a)===e$1};reactIs_production_min$1.isLazy=function(a){return z(a)===t$1};
reactIs_production_min$1.isMemo=function(a){return z(a)===r$1};reactIs_production_min$1.isPortal=function(a){return z(a)===d$1};reactIs_production_min$1.isProfiler=function(a){return z(a)===g$1};reactIs_production_min$1.isStrictMode=function(a){return z(a)===f$1};reactIs_production_min$1.isSuspense=function(a){return z(a)===p$1};
reactIs_production_min$1.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e$1||a===m$2||a===g$1||a===f$1||a===p$1||a===q$1||"object"===typeof a&&null!==a&&(a.$$typeof===t$1||a.$$typeof===r$1||a.$$typeof===h$1||a.$$typeof===k$1||a.$$typeof===n$1||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v$1)};reactIs_production_min$1.typeOf=z;
(function (module) {
{
module.exports = reactIs_production_min$1;
}
} (reactIs$2));
var reactIs$1 = reactIsExports$1;
var FORWARD_REF_STATICS = {
'$$typeof': true,
render: true,
defaultProps: true,
displayName: true,
propTypes: true
};
var MEMO_STATICS = {
'$$typeof': true,
compare: true,
defaultProps: true,
displayName: true,
propTypes: true,
type: true
};
var TYPE_STATICS = {};
TYPE_STATICS[reactIs$1.ForwardRef] = FORWARD_REF_STATICS;
TYPE_STATICS[reactIs$1.Memo] = MEMO_STATICS;
var reactIsExports = {};
var reactIs = {
get exports(){ return reactIsExports; },
set exports(v){ reactIsExports = v; },
};
var reactIs_production_min = {};
/**
* @license React
* react-is.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var b=Symbol.for("react.element"),c=Symbol.for("react.portal"),d=Symbol.for("react.fragment"),e=Symbol.for("react.strict_mode"),f=Symbol.for("react.profiler"),g=Symbol.for("react.provider"),h=Symbol.for("react.context"),k=Symbol.for("react.server_context"),l=Symbol.for("react.forward_ref"),m$1=Symbol.for("react.suspense"),n=Symbol.for("react.suspense_list"),p=Symbol.for("react.memo"),q=Symbol.for("react.lazy"),t=Symbol.for("react.offscreen"),u;u=Symbol.for("react.module.reference");
function v(a){if("object"===typeof a&&null!==a){var r=a.$$typeof;switch(r){case b:switch(a=a.type,a){case d:case f:case e:case m$1:case n:return a;default:switch(a=a&&a.$$typeof,a){case k:case h:case l:case q:case p:case g:return a;default:return r}}case c:return r}}}reactIs_production_min.ContextConsumer=h;reactIs_production_min.ContextProvider=g;reactIs_production_min.Element=b;reactIs_production_min.ForwardRef=l;reactIs_production_min.Fragment=d;reactIs_production_min.Lazy=q;reactIs_production_min.Memo=p;reactIs_production_min.Portal=c;reactIs_production_min.Profiler=f;reactIs_production_min.StrictMode=e;reactIs_production_min.Suspense=m$1;
reactIs_production_min.SuspenseList=n;reactIs_production_min.isAsyncMode=function(){return !1};reactIs_production_min.isConcurrentMode=function(){return !1};reactIs_production_min.isContextConsumer=function(a){return v(a)===h};reactIs_production_min.isContextProvider=function(a){return v(a)===g};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===b};reactIs_production_min.isForwardRef=function(a){return v(a)===l};reactIs_production_min.isFragment=function(a){return v(a)===d};reactIs_production_min.isLazy=function(a){return v(a)===q};reactIs_production_min.isMemo=function(a){return v(a)===p};
reactIs_production_min.isPortal=function(a){return v(a)===c};reactIs_production_min.isProfiler=function(a){return v(a)===f};reactIs_production_min.isStrictMode=function(a){return v(a)===e};reactIs_production_min.isSuspense=function(a){return v(a)===m$1};reactIs_production_min.isSuspenseList=function(a){return v(a)===n};
reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===d||a===f||a===e||a===m$1||a===n||a===t||"object"===typeof a&&null!==a&&(a.$$typeof===q||a.$$typeof===p||a.$$typeof===g||a.$$typeof===h||a.$$typeof===l||a.$$typeof===u||void 0!==a.getModuleId)?!0:!1};reactIs_production_min.typeOf=v;
(function (module) {
{
module.exports = reactIs_production_min;
}
} (reactIs));
// well as nesting subscriptions of descendant components, so that we can ensure the
// ancestor components re-render before descendants
function createListenerCollection() {
const batch = getBatch();
let first = null;
let last = null;
return {
clear() {
first = null;
last = null;
},
notify() {
batch(() => {
let listener = first;
while (listener) {
listener.callback();
listener = listener.next;
}
});
},
get() {
let listeners = [];
let listener = first;
while (listener) {
listeners.push(listener);
listener = listener.next;
}
return listeners;
},
subscribe(callback) {
let isSubscribed = true;
let listener = last = {
callback,
next: null,
prev: last
};
if (listener.prev) {
listener.prev.next = listener;
} else {
first = listener;
}
return function unsubscribe() {
if (!isSubscribed || first === null) return;
isSubscribed = false;
if (listener.next) {
listener.next.prev = listener.prev;
} else {
last = listener.prev;
}
if (listener.prev) {
listener.prev.next = listener.next;
} else {
first = listener.next;
}
};
}
};
}
const nullListeners = {
notify() {},
get: () => []
};
function createSubscription(store, parentSub) {
let unsubscribe;
let listeners = nullListeners;
function addNestedSub(listener) {
trySubscribe();
return listeners.subscribe(listener);
}
function notifyNestedSubs() {
listeners.notify();
}
function handleChangeWrapper() {
if (subscription.onStateChange) {
subscription.onStateChange();
}
}
function isSubscribed() {
return Boolean(unsubscribe);
}
function trySubscribe() {
if (!unsubscribe) {
unsubscribe = parentSub ? parentSub.addNestedSub(handleChangeWrapper) : store.subscribe(handleChangeWrapper);
listeners = createListenerCollection();
}
}
function tryUnsubscribe() {
if (unsubscribe) {
unsubscribe();
unsubscribe = undefined;
listeners.clear();
listeners = nullListeners;
}
}
const subscription = {
addNestedSub,
notifyNestedSubs,
handleChangeWrapper,
isSubscribed,
trySubscribe,
tryUnsubscribe,
getListeners: () => listeners
};
return subscription;
}
// To get around it, we can conditionally useEffect on the server (no-op) and
// useLayoutEffect in the browser. We need useLayoutEffect to ensure the store
// subscription callback always has the selector from the latest render commit
// available, otherwise a store update may happen between render and the effect,
// which may cause missed updates; we also must ensure the store subscription
// is created synchronously, otherwise a store update may occur before the
// subscription is created and an inconsistent state may be observed
// Matches logic in React's `shared/ExecutionEnvironment` file
const canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined');
const useIsomorphicLayoutEffect = canUseDOM ? reactExports.useLayoutEffect : reactExports.useEffect;
function Provider({
store,
context,
children,
serverState
}) {
const contextValue = reactExports.useMemo(() => {
const subscription = createSubscription(store);
return {
store,
subscription,
getServerState: serverState ? () => serverState : undefined
};
}, [store, serverState]);
const previousState = reactExports.useMemo(() => store.getState(), [store]);
useIsomorphicLayoutEffect(() => {
const {
subscription
} = contextValue;
subscription.onStateChange = subscription.notifyNestedSubs;
subscription.trySubscribe();
if (previousState !== store.getState()) {
subscription.notifyNestedSubs();
}
return () => {
subscription.tryUnsubscribe();
subscription.onStateChange = undefined;
};
}, [contextValue, previousState]);
const Context = context || ReactReduxContext; // @ts-ignore 'AnyAction' is assignable to the constraint of type 'A', but 'A' could be instantiated with a different subtype
return /*#__PURE__*/React.createElement(Context.Provider, {
value: contextValue
}, children);
}
/**
* Hook factory, which creates a `useStore` hook bound to a given context.
*
* @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
* @returns {Function} A `useStore` hook bound to the specified context.
*/
function createStoreHook(context = ReactReduxContext) {
const useReduxContext$1 = // @ts-ignore
context === ReactReduxContext ? useReduxContext : () => reactExports.useContext(context);
return function useStore() {
const {
store
} = useReduxContext$1(); // @ts-ignore
return store;
};
}
/**
* A hook to access the redux store.
*
* @returns {any} the redux store
*
* @example
*
* import React from 'react'
* import { useStore } from 'react-redux'
*
* export const ExampleComponent = () => {
* const store = useStore()
* return <div>{store.getState()}</div>
* }
*/
const useStore = /*#__PURE__*/createStoreHook();
/**
* Hook factory, which creates a `useDispatch` hook bound to a given context.
*
* @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
* @returns {Function} A `useDispatch` hook bound to the specified context.
*/
function createDispatchHook(context = ReactReduxContext) {
const useStore$1 = // @ts-ignore
context === ReactReduxContext ? useStore : createStoreHook(context);
return function useDispatch() {
const store = useStore$1(); // @ts-ignore
return store.dispatch;
};
}
/**
* A hook to access the redux `dispatch` function.
*
* @returns {any|function} redux store's `dispatch` function
*
* @example
*
* import React, { useCallback } from 'react'
* import { useDispatch } from 'react-redux'
*
* export const CounterComponent = ({ value }) => {
* const dispatch = useDispatch()
* const increaseCounter = useCallback(() => dispatch({ type: 'increase-counter' }), [])
* return (
* <div>
* <span>{value}</span>
* <button onClick={increaseCounter}>Increase counter</button>
* </div>
* )
* }
*/
const useDispatch = /*#__PURE__*/createDispatchHook();
// The primary entry point assumes we're working with standard ReactDOM/RN, but
initializeUseSelector(withSelectorExports.useSyncExternalStoreWithSelector);
// with standard React renderers (ReactDOM, React Native)
setBatch(reactDomExports.unstable_batchedUpdates);
const useAppDispatch = () => useDispatch();
const useAppSelector = useSelector;
/**
* @license
* Copyright 2019 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
const proxyMarker = Symbol("Comlink.proxy");
const createEndpoint = Symbol("Comlink.endpoint");
const releaseProxy = Symbol("Comlink.releaseProxy");
const finalizer = Symbol("Comlink.finalizer");
const throwMarker = Symbol("Comlink.thrown");
const isObject$1 = (val) => (typeof val === "object" && val !== null) || typeof val === "function";
/**
* Internal transfer handle to handle objects marked to proxy.
*/
const proxyTransferHandler = {
canHandle: (val) => isObject$1(val) && val[proxyMarker],
serialize(obj) {
const { port1, port2 } = new MessageChannel();
expose(obj, port1);
return [port2, [port2]];
},
deserialize(port) {
port.start();
return wrap(port);
},
};
/**
* Internal transfer handler to handle thrown exceptions.
*/
const throwTransferHandler = {
canHandle: (value) => isObject$1(value) && throwMarker in value,
serialize({ value }) {
let serialized;
if (value instanceof Error) {
serialized = {
isError: true,
value: {
message: value.message,
name: value.name,
stack: value.stack,
},
};
}
else {
serialized = { isError: false, value };
}
return [serialized, []];
},
deserialize(serialized) {
if (serialized.isError) {
throw Object.assign(new Error(serialized.value.message), serialized.value);
}
throw serialized.value;
},
};
/**
* Allows customizing the serialization of certain values.
*/
const transferHandlers = new Map([
["proxy", proxyTransferHandler],
["throw", throwTransferHandler],
]);
function isAllowedOrigin(allowedOrigins, origin) {
for (const allowedOrigin of allowedOrigins) {
if (origin === allowedOrigin || allowedOrigin === "*") {
return true;
}
if (allowedOrigin instanceof RegExp && allowedOrigin.test(origin)) {
return true;
}
}
return false;
}
function expose(obj, ep = self, allowedOrigins = ["*"]) {
ep.addEventListener("message", function callback(ev) {
if (!ev || !ev.data) {
return;
}
if (!isAllowedOrigin(allowedOrigins, ev.origin)) {
console.warn(`Invalid origin '${ev.origin}' for comlink proxy`);
return;
}
const { id, type, path } = Object.assign({ path: [] }, ev.data);
const argumentList = (ev.data.argumentList || []).map(fromWireValue);
let returnValue;
try {
const parent = path.slice(0, -1).reduce((obj, prop) => obj[prop], obj);
const rawValue = path.reduce((obj, prop) => obj[prop], obj);
switch (type) {
case "GET" /* MessageType.GET */:
{
returnValue = rawValue;
}
break;
case "SET" /* MessageType.SET */:
{
parent[path.slice(-1)[0]] = fromWireValue(ev.data.value);
returnValue = true;
}
break;
case "APPLY" /* MessageType.APPLY */:
{
returnValue = rawValue.apply(parent, argumentList);
}
break;
case "CONSTRUCT" /* MessageType.CONSTRUCT */:
{
const value = new rawValue(...argumentList);
returnValue = proxy(value);
}
break;
case "ENDPOINT" /* MessageType.ENDPOINT */:
{
const { port1, port2 } = new MessageChannel();
expose(obj, port2);
returnValue = transfer(port1, [port1]);
}
break;
case "RELEASE" /* MessageType.RELEASE */:
{
returnValue = undefined;
}
break;
default:
return;
}
}
catch (value) {
returnValue = { value, [throwMarker]: 0 };
}
Promise.resolve(returnValue)
.catch((value) => {
return { value, [throwMarker]: 0 };
})
.then((returnValue) => {
const [wireValue, transferables] = toWireValue(returnValue);
ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);
if (type === "RELEASE" /* MessageType.RELEASE */) {
// detach and deactive after sending release response above.
ep.removeEventListener("message", callback);
closeEndPoint(ep);
if (finalizer in obj && typeof obj[finalizer] === "function") {
obj[finalizer]();
}
}
})
.catch((error) => {
// Send Serialization Error To Caller
const [wireValue, transferables] = toWireValue({
value: new TypeError("Unserializable return value"),
[throwMarker]: 0,
});
ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);
});
});
if (ep.start) {
ep.start();
}
}
function isMessagePort(endpoint) {
return endpoint.constructor.name === "MessagePort";
}
function closeEndPoint(endpoint) {
if (isMessagePort(endpoint))
endpoint.close();
}
function wrap(ep, target) {
return createProxy(ep, [], target);
}
function throwIfProxyReleased(isReleased) {
if (isReleased) {
throw new Error("Proxy has been released and is not useable");
}
}
function releaseEndpoint(ep) {
return requestResponseMessage(ep, {
type: "RELEASE" /* MessageType.RELEASE */,
}).then(() => {
closeEndPoint(ep);
});
}
const proxyCounter = new WeakMap();
const proxyFinalizers = "FinalizationRegistry" in self &&
new FinalizationRegistry((ep) => {
const newCount = (proxyCounter.get(ep) || 0) - 1;
proxyCounter.set(ep, newCount);
if (newCount === 0) {
releaseEndpoint(ep);
}
});
function registerProxy(proxy, ep) {
const newCount = (proxyCounter.get(ep) || 0) + 1;
proxyCounter.set(ep, newCount);
if (proxyFinalizers) {
proxyFinalizers.register(proxy, ep, proxy);
}
}
function unregisterProxy(proxy) {
if (proxyFinalizers) {
proxyFinalizers.unregister(proxy);
}
}
function createProxy(ep, path = [], target = function () { }) {
let isProxyReleased = false;
const proxy = new Proxy(target, {
get(_target, prop) {
throwIfProxyReleased(isProxyReleased);
if (prop === releaseProxy) {
return () => {
unregisterProxy(proxy);
releaseEndpoint(ep);
isProxyReleased = true;
};
}
if (prop === "then") {
if (path.length === 0) {
return { then: () => proxy };
}
const r = requestResponseMessage(ep, {
type: "GET" /* MessageType.GET */,
path: path.map((p) => p.toString()),
}).then(fromWireValue);
return r.then.bind(r);
}
return createProxy(ep, [...path, prop]);
},
set(_target, prop, rawValue) {
throwIfProxyReleased(isProxyReleased);
// FIXME: ES6 Proxy Handler `set` methods are supposed to return a
// boolean. To show good will, we return true asynchronously ¯\_(ツ)_/¯
const [value, transferables] = toWireValue(rawValue);
return requestResponseMessage(ep, {
type: "SET" /* MessageType.SET */,
path: [...path, prop].map((p) => p.toString()),
value,
}, transferables).then(fromWireValue);
},
apply(_target, _thisArg, rawArgumentList) {
throwIfProxyReleased(isProxyReleased);
const last = path[path.length - 1];
if (last === createEndpoint) {
return requestResponseMessage(ep, {
type: "ENDPOINT" /* MessageType.ENDPOINT */,
}).then(fromWireValue);
}
// We just pretend that `bind()` didn’t happen.
if (last === "bind") {
return createProxy(ep, path.slice(0, -1));
}
const [argumentList, transferables] = processArguments(rawArgumentList);
return requestResponseMessage(ep, {
type: "APPLY" /* MessageType.APPLY */,
path: path.map((p) => p.toString()),
argumentList,
}, transferables).then(fromWireValue);
},
construct(_target, rawArgumentList) {
throwIfProxyReleased(isProxyReleased);
const [argumentList, transferables] = processArguments(rawArgumentList);
return requestResponseMessage(ep, {
type: "CONSTRUCT" /* MessageType.CONSTRUCT */,
path: path.map((p) => p.toString()),
argumentList,
}, transferables).then(fromWireValue);
},
});
registerProxy(proxy, ep);
return proxy;
}
function myFlat(arr) {
return Array.prototype.concat.apply([], arr);
}
function processArguments(argumentList) {
const processed = argumentList.map(toWireValue);
return [processed.map((v) => v[0]), myFlat(processed.map((v) => v[1]))];
}
const transferCache = new WeakMap();
function transfer(obj, transfers) {
transferCache.set(obj, transfers);
return obj;
}
function proxy(obj) {
return Object.assign(obj, { [proxyMarker]: true });
}
function toWireValue(value) {
for (const [name, handler] of transferHandlers) {
if (handler.canHandle(value)) {
const [serializedValue, transferables] = handler.serialize(value);
return [
{
type: "HANDLER" /* WireValueType.HANDLER */,
name,
value: serializedValue,
},
transferables,
];
}
}
return [
{
type: "RAW" /* WireValueType.RAW */,
value,
},
transferCache.get(value) || [],
];
}
function fromWireValue(value) {
switch (value.type) {
case "HANDLER" /* WireValueType.HANDLER */:
return transferHandlers.get(value.name).deserialize(value.value);
case "RAW" /* WireValueType.RAW */:
return value.value;
}
}
function requestResponseMessage(ep, msg, transfers) {
return new Promise((resolve) => {
const id = generateUUID();
ep.addEventListener("message", function l(ev) {
if (!ev.data || !ev.data.id || ev.data.id !== id) {
return;
}
ep.removeEventListener("message", l);
resolve(ev.data);
});
if (ep.start) {
ep.start();
}
ep.postMessage(Object.assign({ id }, msg), transfers);
});
}
function generateUUID() {
return new Array(4)
.fill(0)
.map(() => Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(16))
.join("-");
}
const encodedJs = "KGZ1bmN0aW9uICgpIHsKICAgICd1c2Ugc3RyaWN0JzsKCiAgICAvKioKICAgICAqIEBsaWNlbnNlCiAgICAgKiBDb3B5cmlnaHQgMjAxOSBHb29nbGUgTExDCiAgICAgKiBTUERYLUxpY2Vuc2UtSWRlbnRpZmllcjogQXBhY2hlLTIuMAogICAgICovCiAgICBjb25zdCBwcm94eU1hcmtlciA9IFN5bWJvbCgiQ29tbGluay5wcm94eSIpOwogICAgY29uc3QgY3JlYXRlRW5kcG9pbnQgPSBTeW1ib2woIkNvbWxpbmsuZW5kcG9pbnQiKTsKICAgIGNvbnN0IHJlbGVhc2VQcm94eSA9IFN5bWJvbCgiQ29tbGluay5yZWxlYXNlUHJveHkiKTsKICAgIGNvbnN0IGZpbmFsaXplciA9IFN5bWJvbCgiQ29tbGluay5maW5hbGl6ZXIiKTsKICAgIGNvbnN0IHRocm93TWFya2VyID0gU3ltYm9sKCJDb21saW5rLnRocm93biIpOwogICAgY29uc3QgaXNPYmplY3QgPSAodmFsKSA9PiAodHlwZW9mIHZhbCA9PT0gIm9iamVjdCIgJiYgdmFsICE9PSBudWxsKSB8fCB0eXBlb2YgdmFsID09PSAiZnVuY3Rpb24iOwogICAgLyoqCiAgICAgKiBJbnRlcm5hbCB0cmFuc2ZlciBoYW5kbGUgdG8gaGFuZGxlIG9iamVjdHMgbWFya2VkIHRvIHByb3h5LgogICAgICovCiAgICBjb25zdCBwcm94eVRyYW5zZmVySGFuZGxlciA9IHsKICAgICAgICBjYW5IYW5kbGU6ICh2YWwpID0+IGlzT2JqZWN0KHZhbCkgJiYgdmFsW3Byb3h5TWFya2VyXSwKICAgICAgICBzZXJpYWxpemUob2JqKSB7CiAgICAgICAgICAgIGNvbnN0IHsgcG9ydDEsIHBvcnQyIH0gPSBuZXcgTWVzc2FnZUNoYW5uZWwoKTsKICAgICAgICAgICAgZXhwb3NlKG9iaiwgcG9ydDEpOwogICAgICAgICAgICByZXR1cm4gW3BvcnQyLCBbcG9ydDJdXTsKICAgICAgICB9LAogICAgICAgIGRlc2VyaWFsaXplKHBvcnQpIHsKICAgICAgICAgICAgcG9ydC5zdGFydCgpOwogICAgICAgICAgICByZXR1cm4gd3JhcChwb3J0KTsKICAgICAgICB9LAogICAgfTsKICAgIC8qKgogICAgICogSW50ZXJuYWwgdHJhbnNmZXIgaGFuZGxlciB0byBoYW5kbGUgdGhyb3duIGV4Y2VwdGlvbnMuCiAgICAgKi8KICAgIGNvbnN0IHRocm93VHJhbnNmZXJIYW5kbGVyID0gewogICAgICAgIGNhbkhhbmRsZTogKHZhbHVlKSA9PiBpc09iamVjdCh2YWx1ZSkgJiYgdGhyb3dNYXJrZXIgaW4gdmFsdWUsCiAgICAgICAgc2VyaWFsaXplKHsgdmFsdWUgfSkgewogICAgICAgICAgICBsZXQgc2VyaWFsaXplZDsKICAgICAgICAgICAgaWYgKHZhbHVlIGluc3RhbmNlb2YgRXJyb3IpIHsKICAgICAgICAgICAgICAgIHNlcmlhbGl6ZWQgPSB7CiAgICAgICAgICAgICAgICAgICAgaXNFcnJvcjogdHJ1ZSwKICAgICAgICAgICAgICAgICAgICB2YWx1ZTogewogICAgICAgICAgICAgICAgICAgICAgICBtZXNzYWdlOiB2YWx1ZS5tZXNzYWdlLAogICAgICAgICAgICAgICAgICAgICAgICBuYW1lOiB2YWx1ZS5uYW1lLAogICAgICAgICAgICAgICAgICAgICAgICBzdGFjazogdmFsdWUuc3RhY2ssCiAgICAgICAgICAgICAgICAgICAgfSwKICAgICAgICAgICAgICAgIH07CiAgICAgICAgICAgIH0KICAgICAgICAgICAgZWxzZSB7CiAgICAgICAgICAgICAgICBzZXJpYWxpemVkID0geyBpc0Vycm9yOiBmYWxzZSwgdmFsdWUgfTsKICAgICAgICAgICAgfQogICAgICAgICAgICByZXR1cm4gW3NlcmlhbGl6ZWQsIFtdXTsKICAgICAgICB9LAogICAgICAgIGRlc2VyaWFsaXplKHNlcmlhbGl6ZWQpIHsKICAgICAgICAgICAgaWYgKHNlcmlhbGl6ZWQuaXNFcnJvcikgewogICAgICAgICAgICAgICAgdGhyb3cgT2JqZWN0LmFzc2lnbihuZXcgRXJyb3Ioc2VyaWFsaXplZC52YWx1ZS5tZXNzYWdlKSwgc2VyaWFsaXplZC52YWx1ZSk7CiAgICAgICAgICAgIH0KICAgICAgICAgICAgdGhyb3cgc2VyaWFsaXplZC52YWx1ZTsKICAgICAgICB9LAogICAgfTsKICAgIC8qKgogICAgICogQWxsb3dzIGN1c3RvbWl6aW5nIHRoZSBzZXJpYWxpemF0aW9uIG9mIGNlcnRhaW4gdmFsdWVzLgogICAgICovCiAgICBjb25zdCB0cmFuc2ZlckhhbmRsZXJzID0gbmV3IE1hcChbCiAgICAgICAgWyJwcm94eSIsIHByb3h5VHJhbnNmZXJIYW5kbGVyXSwKICAgICAgICBbInRocm93IiwgdGhyb3dUcmFuc2ZlckhhbmRsZXJdLAogICAgXSk7CiAgICBmdW5jdGlvbiBpc0FsbG93ZWRPcmlnaW4oYWxsb3dlZE9yaWdpbnMsIG9yaWdpbikgewogICAgICAgIGZvciAoY29uc3QgYWxsb3dlZE9yaWdpbiBvZiBhbGxvd2VkT3JpZ2lucykgewogICAgICAgICAgICBpZiAob3JpZ2luID09PSBhbGxvd2VkT3JpZ2luIHx8IGFsbG93ZWRPcmlnaW4gPT09ICIqIikgewogICAgICAgICAgICAgICAgcmV0dXJuIHRydWU7CiAgICAgICAgICAgIH0KICAgICAgICAgICAgaWYgKGFsbG93ZWRPcmlnaW4gaW5zdGFuY2VvZiBSZWdFeHAgJiYgYWxsb3dlZE9yaWdpbi50ZXN0KG9yaWdpbikpIHsKICAgICAgICAgICAgICAgIHJldHVybiB0cnVlOwogICAgICAgICAgICB9CiAgICAgICAgfQogICAgICAgIHJldHVybiBmYWxzZTsKICAgIH0KICAgIGZ1bmN0aW9uIGV4cG9zZShvYmosIGVwID0gc2VsZiwgYWxsb3dlZE9yaWdpbnMgPSBbIioiXSkgewogICAgICAgIGVwLmFkZEV2ZW50TGlzdGVuZXIoIm1lc3NhZ2UiLCBmdW5jdGlvbiBjYWxsYmFjayhldikgewogICAgICAgICAgICBpZiAoIWV2IHx8ICFldi5kYXRhKSB7CiAgICAgICAgICAgICAgICByZXR1cm47CiAgICAgICAgICAgIH0KICAgICAgICAgICAgaWYgKCFpc0FsbG93ZWRPcmlnaW4oYWxsb3dlZE9yaWdpbnMsIGV2Lm9yaWdpbikpIHsKICAgICAgICAgICAgICAgIGNvbnNvbGUud2FybihgSW52YWxpZCBvcmlnaW4gJyR7ZXYub3JpZ2lufScgZm9yIGNvbWxpbmsgcHJveHlgKTsKICAgICAgICAgICAgICAgIHJldHVybjsKICAgICAgICAgICAgfQogICAgICAgICAgICBjb25zdCB7IGlkLCB0eXBlLCBwYXRoIH0gPSBPYmplY3QuYXNzaWduKHsgcGF0aDogW10gfSwgZXYuZGF0YSk7CiAgICAgICAgICAgIGNvbnN0IGFyZ3VtZW50TGlzdCA9IChldi5kYXRhLmFyZ3VtZW50TGlzdCB8fCBbXSkubWFwKGZyb21XaXJlVmFsdWUpOwogICAgICAgICAgICBsZXQgcmV0dXJuVmFsdWU7CiAgICAgICAgICAgIHRyeSB7CiAgICAgICAgICAgICAgICBjb25zdCBwYXJlbnQgPSBwYXRoLnNsaWNlKDAsIC0xKS5yZWR1Y2UoKG9iaiwgcHJvcCkgPT4gb2JqW3Byb3BdLCBvYmopOwogICAgICAgICAgICAgICAgY29uc3QgcmF3VmFsdWUgPSBwYXRoLnJlZHVjZSgob2JqLCBwcm9wKSA9PiBvYmpbcHJvcF0sIG9iaik7CiAgICAgICAgICAgICAgICBzd2l0Y2ggKHR5cGUpIHsKICAgICAgICAgICAgICAgICAgICBjYXNlICJHRVQiIC8qIE1lc3NhZ2VUeXBlLkdFVCAqLzoKICAgICAgICAgICAgICAgICAgICAgICAgewogICAgICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuVmFsdWUgPSByYXdWYWx1ZTsKICAgICAgICAgICAgICAgICAgICAgICAgfQogICAgICAgICAgICAgICAgICAgICAgICBicmVhazsKICAgICAgICAgICAgICAgICAgICBjYXNlICJTRVQiIC8qIE1lc3NhZ2VUeXBlLlNFVCAqLzoKICAgICAgICAgICAgICAgICAgICAgICAgewogICAgICAgICAgICAgICAgICAgICAgICAgICAgcGFyZW50W3BhdGguc2xpY2UoLTEpWzBdXSA9IGZyb21XaXJlVmFsdWUoZXYuZGF0YS52YWx1ZSk7CiAgICAgICAgICAgICAgICAgICAgICAgICAgICByZXR1cm5WYWx1ZSA9IHRydWU7CiAgICAgICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICAgICAgICAgICAgY2FzZSAiQVBQTFkiIC8qIE1lc3NhZ2VUeXBlLkFQUExZICovOgogICAgICAgICAgICAgICAgICAgICAgICB7CiAgICAgICAgICAgICAgICAgICAgICAgICAgICByZXR1cm5WYWx1ZSA9IHJhd1ZhbHVlLmFwcGx5KHBhcmVudCwgYXJndW1lbnRMaXN0KTsKICAgICAgICAgICAgICAgICAgICAgICAgfQogICAgICAgICAgICAgICAgICAgICAgICBicmVhazsKICAgICAgICAgICAgICAgICAgICBjYXNlICJDT05TVFJVQ1QiIC8qIE1lc3NhZ2VUeXBlLkNPTlNUUlVDVCAqLzoKICAgICAgICAgICAgICAgICAgICAgICAgewogICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgdmFsdWUgPSBuZXcgcmF3VmFsdWUoLi4uYXJndW1lbnRMaXN0KTsKICAgICAgICAgICAgICAgICAgICAgICAgICAgIHJldHVyblZhbHVlID0gcHJveHkodmFsdWUpOwogICAgICAgICAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICAgICAgICAgIGJyZWFrOwogICAgICAgICAgICAgICAgICAgIGNhc2UgIkVORFBPSU5UIiAvKiBNZXNzYWdlVHlwZS5FTkRQT0lOVCAqLzoKICAgICAgICAgICAgICAgICAgICAgICAgewogICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgeyBwb3J0MSwgcG9ydDIgfSA9IG5ldyBNZXNzYWdlQ2hhbm5lbCgpOwogICAgICAgICAgICAgICAgICAgICAgICAgICAgZXhwb3NlKG9iaiwgcG9ydDIpOwogICAgICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuVmFsdWUgPSB0cmFuc2Zlcihwb3J0MSwgW3BvcnQxXSk7CiAgICAgICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICAgICAgICAgICAgY2FzZSAiUkVMRUFTRSIgLyogTWVzc2FnZVR5cGUuUkVMRUFTRSAqLzoKICAgICAgICAgICAgICAgICAgICAgICAgewogICAgICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuVmFsdWUgPSB1bmRlZmluZWQ7CiAgICAgICAgICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICAgICAgICAgICAgZGVmYXVsdDoKICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuOwogICAgICAgICAgICAgICAgfQogICAgICAgICAgICB9CiAgICAgICAgICAgIGNhdGNoICh2YWx1ZSkgewogICAgICAgICAgICAgICAgcmV0dXJuVmFsdWUgPSB7IHZhbHVlLCBbdGhyb3dNYXJrZXJdOiAwIH07CiAgICAgICAgICAgIH0KICAgICAgICAgICAgUHJvbWlzZS5yZXNvbHZlKHJldHVyblZhbHVlKQogICAgICAgICAgICAgICAgLmNhdGNoKCh2YWx1ZSkgPT4gewogICAgICAgICAgICAgICAgcmV0dXJuIHsgdmFsdWUsIFt0aHJvd01hcmtlcl06IDAgfTsKICAgICAgICAgICAgfSkKICAgICAgICAgICAgICAgIC50aGVuKChyZXR1cm5WYWx1ZSkgPT4gewogICAgICAgICAgICAgICAgY29uc3QgW3dpcmVWYWx1ZSwgdHJhbnNmZXJhYmxlc10gPSB0b1dpcmVWYWx1ZShyZXR1cm5WYWx1ZSk7CiAgICAgICAgICAgICAgICBlcC5wb3N0TWVzc2FnZShPYmplY3QuYXNzaWduKE9iamVjdC5hc3NpZ24oe30sIHdpcmVWYWx1ZSksIHsgaWQgfSksIHRyYW5zZmVyYWJsZXMpOwogICAgICAgICAgICAgICAgaWYgKHR5cGUgPT09ICJSRUxFQVNFIiAvKiBNZXNzYWdlVHlwZS5SRUxFQVNFICovKSB7CiAgICAgICAgICAgICAgICAgICAgLy8gZGV0YWNoIGFuZCBkZWFjdGl2ZSBhZnRlciBzZW5kaW5nIHJlbGVhc2UgcmVzcG9uc2UgYWJvdmUuCiAgICAgICAgICAgICAgICAgICAgZXAucmVtb3ZlRXZlbnRMaXN0ZW5lcigibWVzc2FnZSIsIGNhbGxiYWNrKTsKICAgICAgICAgICAgICAgICAgICBjbG9zZUVuZFBvaW50KGVwKTsKICAgICAgICAgICAgICAgICAgICBpZiAoZmluYWxpemVyIGluIG9iaiAmJiB0eXBlb2Ygb2JqW2ZpbmFsaXplcl0gPT09ICJmdW5jdGlvbiIpIHsKICAgICAgICAgICAgICAgICAgICAgICAgb2JqW2ZpbmFsaXplcl0oKTsKICAgICAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgIH0pCiAgICAgICAgICAgICAgICAuY2F0Y2goKGVycm9yKSA9PiB7CiAgICAgICAgICAgICAgICAvLyBTZW5kIFNlcmlhbGl6YXRpb24gRXJyb3IgVG8gQ2FsbGVyCiAgICAgICAgICAgICAgICBjb25zdCBbd2lyZVZhbHVlLCB0cmFuc2ZlcmFibGVzXSA9IHRvV2lyZVZhbHVlKHsKICAgICAgICAgICAgICAgICAgICB2YWx1ZTogbmV3IFR5cGVFcnJvcigiVW5zZXJpYWxpemFibGUgcmV0dXJuIHZhbHVlIiksCiAgICAgICAgICAgICAgICAgICAgW3Rocm93TWFya2VyXTogMCwKICAgICAgICAgICAgICAgIH0pOwogICAgICAgICAgICAgICAgZXAucG9zdE1lc3NhZ2UoT2JqZWN0LmFzc2lnbihPYmplY3QuYXNzaWduKHt9LCB3aXJlVmFsdWUpLCB7IGlkIH0pLCB0cmFuc2ZlcmFibGVzKTsKICAgICAgICAgICAgfSk7CiAgICAgICAgfSk7CiAgICAgICAgaWYgKGVwLnN0YXJ0KSB7CiAgICAgICAgICAgIGVwLnN0YXJ0KCk7CiAgICAgICAgfQogICAgfQogICAgZnVuY3Rpb24gaXNNZXNzYWdlUG9ydChlbmRwb2ludCkgewogICAgICAgIHJldHVybiBlbmRwb2ludC5jb25zdHJ1Y3Rvci5uYW1lID09PSAiTWVzc2FnZVBvcnQiOwogICAgfQogICAgZnVuY3Rpb24gY2xvc2VFbmRQb2ludChlbmRwb2ludCkgewogICAgICAgIGlmIChpc01lc3NhZ2VQb3J0KGVuZHBvaW50KSkKICAgICAgICAgICAgZW5kcG9pbnQuY2xvc2UoKTsKICAgIH0KICAgIGZ1bmN0aW9uIHdyYXAoZXAsIHRhcmdldCkgewogICAgICAgIHJldHVybiBjcmVhdGVQcm94eShlcCwgW10sIHRhcmdldCk7CiAgICB9CiAgICBmdW5jdGlvbiB0aHJvd0lmUHJveHlSZWxlYXNlZChpc1JlbGVhc2VkKSB7CiAgICAgICAgaWYgKGlzUmVsZWFzZWQpIHsKICAgICAgICAgICAgdGhyb3cgbmV3IEVycm9yKCJQcm94eSBoYXMgYmVlbiByZWxlYXNlZCBhbmQgaXMgbm90IHVzZWFibGUiKTsKICAgICAgICB9CiAgICB9CiAgICBmdW5jdGlvbiByZWxlYXNlRW5kcG9pbnQoZXApIHsKICAgICAgICByZXR1cm4gcmVxdWVzdFJlc3BvbnNlTWVzc2FnZShlcCwgewogICAgICAgICAgICB0eXBlOiAiUkVMRUFTRSIgLyogTWVzc2FnZVR5cGUuUkVMRUFTRSAqLywKICAgICAgICB9KS50aGVuKCgpID0+IHsKICAgICAgICAgICAgY2xvc2VFbmRQb2ludChlcCk7CiAgICAgICAgfSk7CiAgICB9CiAgICBjb25zdCBwcm94eUNvdW50ZXIgPSBuZXcgV2Vha01hcCgpOwogICAgY29uc3QgcHJveHlGaW5hbGl6ZXJzID0gIkZpbmFsaXphdGlvblJlZ2lzdHJ5IiBpbiBzZWxmICYmCiAgICAgICAgbmV3IEZpbmFsaXphdGlvblJlZ2lzdHJ5KChlcCkgPT4gewogICAgICAgICAgICBjb25zdCBuZXdDb3VudCA9IChwcm94eUNvdW50ZXIuZ2V0KGVwKSB8fCAwKSAtIDE7CiAgICAgICAgICAgIHByb3h5Q291bnRlci5zZXQoZXAsIG5ld0NvdW50KTsKICAgICAgICAgICAgaWYgKG5ld0NvdW50ID09PSAwKSB7CiAgICAgICAgICAgICAgICByZWxlYXNlRW5kcG9pbnQoZXApOwogICAgICAgICAgICB9CiAgICAgICAgfSk7CiAgICBmdW5jdGlvbiByZWdpc3RlclByb3h5KHByb3h5LCBlcCkgewogICAgICAgIGNvbnN0IG5ld0NvdW50ID0gKHByb3h5Q291bnRlci5nZXQoZXApIHx8IDApICsgMTsKICAgICAgICBwcm94eUNvdW50ZXIuc2V0KGVwLCBuZXdDb3VudCk7CiAgICAgICAgaWYgKHByb3h5RmluYWxpemVycykgewogICAgICAgICAgICBwcm94eUZpbmFsaXplcnMucmVnaXN0ZXIocHJveHksIGVwLCBwcm94eSk7CiAgICAgICAgfQogICAgfQogICAgZnVuY3Rpb24gdW5yZWdpc3RlclByb3h5KHByb3h5KSB7CiAgICAgICAgaWYgKHByb3h5RmluYWxpemVycykgewogICAgICAgICAgICBwcm94eUZpbmFsaXplcnMudW5yZWdpc3Rlcihwcm94eSk7CiAgICAgICAgfQogICAgfQogICAgZnVuY3Rpb24gY3JlYXRlUHJveHkoZXAsIHBhdGggPSBbXSwgdGFyZ2V0ID0gZnVuY3Rpb24gKCkgeyB9KSB7CiAgICAgICAgbGV0IGlzUHJveHlSZWxlYXNlZCA9IGZhbHNlOwogICAgICAgIGNvbnN0IHByb3h5ID0gbmV3IFByb3h5KHRhcmdldCwgewogICAgICAgICAgICBnZXQoX3RhcmdldCwgcHJvcCkgewogICAgICAgICAgICAgICAgdGhyb3dJZlByb3h5UmVsZWFzZWQoaXNQcm94eVJlbGVhc2VkKTsKICAgICAgICAgICAgICAgIGlmIChwcm9wID09PSByZWxlYXNlUHJveHkpIHsKICAgICAgICAgICAgICAgICAgICByZXR1cm4gKCkgPT4gewogICAgICAgICAgICAgICAgICAgICAgICB1bnJlZ2lzdGVyUHJveHkocHJveHkpOwogICAgICAgICAgICAgICAgICAgICAgICByZWxlYXNlRW5kcG9pbnQoZXApOwogICAgICAgICAgICAgICAgICAgICAgICBpc1Byb3h5UmVsZWFzZWQgPSB0cnVlOwogICAgICAgICAgICAgICAgICAgIH07CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICBpZiAocHJvcCA9PT0gInRoZW4iKSB7CiAgICAgICAgICAgICAgICAgICAgaWYgKHBhdGgubGVuZ3RoID09PSAwKSB7CiAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiB7IHRoZW46ICgpID0+IHByb3h5IH07CiAgICAgICAgICAgICAgICAgICAgfQogICAgICAgICAgICAgICAgICAgIGNvbnN0IHIgPSByZXF1ZXN0UmVzcG9uc2VNZXNzYWdlKGVwLCB7CiAgICAgICAgICAgICAgICAgICAgICAgIHR5cGU6ICJHRVQiIC8qIE1lc3NhZ2VUeXBlLkdFVCAqLywKICAgICAgICAgICAgICAgICAgICAgICAgcGF0aDogcGF0aC5tYXAoKHApID0+IHAudG9TdHJpbmcoKSksCiAgICAgICAgICAgICAgICAgICAgfSkudGhlbihmcm9tV2lyZVZhbHVlKTsKICAgICAgICAgICAgICAgICAgICByZXR1cm4gci50aGVuLmJpbmQocik7CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICByZXR1cm4gY3JlYXRlUHJveHkoZXAsIFsuLi5wYXRoLCBwcm9wXSk7CiAgICAgICAgICAgIH0sCiAgICAgICAgICAgIHNldChfdGFyZ2V0LCBwcm9wLCByYXdWYWx1ZSkgewogICAgICAgICAgICAgICAgdGhyb3dJZlByb3h5UmVsZWFzZWQoaXNQcm94eVJlbGVhc2VkKTsKICAgICAgICAgICAgICAgIC8vIEZJWE1FOiBFUzYgUHJveHkgSGFuZGxlciBgc2V0YCBtZXRob2RzIGFyZSBzdXBwb3NlZCB0byByZXR1cm4gYQogICAgICAgICAgICAgICAgLy8gYm9vbGVhbi4gVG8gc2hvdyBnb29kIHdpbGwsIHdlIHJldHVybiB0cnVlIGFzeW5jaHJvbm91c2x5IMKvXF8o44OEKV8vwq8KICAgICAgICAgICAgICAgIGNvbnN0IFt2YWx1ZSwgdHJhbnNmZXJhYmxlc10gPSB0b1dpcmVWYWx1ZShyYXdWYWx1ZSk7CiAgICAgICAgICAgICAgICByZXR1cm4gcmVxdWVzdFJlc3BvbnNlTWVzc2FnZShlcCwgewogICAgICAgICAgICAgICAgICAgIHR5cGU6ICJTRVQiIC8qIE1lc3NhZ2VUeXBlLlNFVCAqLywKICAgICAgICAgICAgICAgICAgICBwYXRoOiBbLi4ucGF0aCwgcHJvcF0ubWFwKChwKSA9PiBwLnRvU3RyaW5nKCkpLAogICAgICAgICAgICAgICAgICAgIHZhbHVlLAogICAgICAgICAgICAgICAgfSwgdHJhbnNmZXJhYmxlcykudGhlbihmcm9tV2lyZVZhbHVlKTsKICAgICAgICAgICAgfSwKICAgICAgICAgICAgYXBwbHkoX3RhcmdldCwgX3RoaXNBcmcsIHJhd0FyZ3VtZW50TGlzdCkgewogICAgICAgICAgICAgICAgdGhyb3dJZlByb3h5UmVsZWFzZWQoaXNQcm94eVJlbGVhc2VkKTsKICAgICAgICAgICAgICAgIGNvbnN0IGxhc3QgPSBwYXRoW3BhdGgubGVuZ3RoIC0gMV07CiAgICAgICAgICAgICAgICBpZiAobGFzdCA9PT0gY3JlYXRlRW5kcG9pbnQpIHsKICAgICAgICAgICAgICAgICAgICByZXR1cm4gcmVxdWVzdFJlc3BvbnNlTWVzc2FnZShlcCwgewogICAgICAgICAgICAgICAgICAgICAgICB0eXBlOiAiRU5EUE9JTlQiIC8qIE1lc3NhZ2VUeXBlLkVORFBPSU5UICovLAogICAgICAgICAgICAgICAgICAgIH0pLnRoZW4oZnJvbVdpcmVWYWx1ZSk7CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICAvLyBXZSBqdXN0IHByZXRlbmQgdGhhdCBgYmluZCgpYCBkaWRu4oCZdCBoYXBwZW4uCiAgICAgICAgICAgICAgICBpZiAobGFzdCA9PT0gImJpbmQiKSB7CiAgICAgICAgICAgICAgICAgICAgcmV0dXJuIGNyZWF0ZVByb3h5KGVwLCBwYXRoLnNsaWNlKDAsIC0xKSk7CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICBjb25zdCBbYXJndW1lbnRMaXN0LCB0cmFuc2ZlcmFibGVzXSA9IHByb2Nlc3NBcmd1bWVudHMocmF3QXJndW1lbnRMaXN0KTsKICAgICAgICAgICAgICAgIHJldHVybiByZXF1ZXN0UmVzcG9uc2VNZXNzYWdlKGVwLCB7CiAgICAgICAgICAgICAgICAgICAgdHlwZTogIkFQUExZIiAvKiBNZXNzYWdlVHlwZS5BUFBMWSAqLywKICAgICAgICAgICAgICAgICAgICBwYXRoOiBwYXRoLm1hcCgocCkgPT4gcC50b1N0cmluZygpKSwKICAgICAgICAgICAgICAgICAgICBhcmd1bWVudExpc3QsCiAgICAgICAgICAgICAgICB9LCB0cmFuc2ZlcmFibGVzKS50aGVuKGZyb21XaXJlVmFsdWUpOwogICAgICAgICAgICB9LAogICAgICAgICAgICBjb25zdHJ1Y3QoX3RhcmdldCwgcmF3QXJndW1lbnRMaXN0KSB7CiAgICAgICAgICAgICAgICB0aHJvd0lmUHJveHlSZWxlYXNlZChpc1Byb3h5UmVsZWFzZWQpOwogICAgICAgICAgICAgICAgY29uc3QgW2FyZ3VtZW50TGlzdCwgdHJhbnNmZXJhYmxlc10gPSBwcm9jZXNzQXJndW1lbnRzKHJhd0FyZ3VtZW50TGlzdCk7CiAgICAgICAgICAgICAgICByZXR1cm4gcmVxdWVzdFJlc3BvbnNlTWVzc2FnZShlcCwgewogICAgICAgICAgICAgICAgICAgIHR5cGU6ICJDT05TVFJVQ1QiIC8qIE1lc3NhZ2VUeXBlLkNPTlNUUlVDVCAqLywKICAgICAgICAgICAgICAgICAgICBwYXRoOiBwYXRoLm1hcCgocCkgPT4gcC50b1N0cmluZygpKSwKICAgICAgICAgICAgICAgICAgICBhcmd1bWVudExpc3QsCiAgICAgICAgICAgICAgICB9LCB0cmFuc2ZlcmFibGVzKS50aGVuKGZyb21XaXJlVmFsdWUpOwogICAgICAgICAgICB9LAogICAgICAgIH0pOwogICAgICAgIHJlZ2lzdGVyUHJveHkocHJveHksIGVwKTsKICAgICAgICByZXR1cm4gcHJveHk7CiAgICB9CiAgICBmdW5jdGlvbiBteUZsYXQoYXJyKSB7CiAgICAgICAgcmV0dXJuIEFycmF5LnByb3RvdHlwZS5jb25jYXQuYXBwbHkoW10sIGFycik7CiAgICB9CiAgICBmdW5jdGlvbiBwcm9jZXNzQXJndW1lbnRzKGFyZ3VtZW50TGlzdCkgewogICAgICAgIGNvbnN0IHByb2Nlc3NlZCA9IGFyZ3VtZW50TGlzdC5tYXAodG9XaXJlVmFsdWUpOwogICAgICAgIHJldHVybiBbcHJvY2Vzc2VkLm1hcCgodikgPT4gdlswXSksIG15RmxhdChwcm9jZXNzZWQubWFwKCh2KSA9PiB2WzFdKSldOwogICAgfQogICAgY29uc3QgdHJhbnNmZXJDYWNoZSA9IG5ldyBXZWFrTWFwKCk7CiAgICBmdW5jdGlvbiB0cmFuc2ZlcihvYmosIHRyYW5zZmVycykgewogICAgICAgIHRyYW5zZmVyQ2FjaGUuc2V0KG9iaiwgdHJhbnNmZXJzKTsKICAgICAgICByZXR1cm4gb2JqOwogICAgfQogICAgZnVuY3Rpb24gcHJveHkob2JqKSB7CiAgICAgICAgcmV0dXJuIE9iamVjdC5hc3NpZ24ob2JqLCB7IFtwcm94eU1hcmtlcl06IHRydWUgfSk7CiAgICB9CiAgICBmdW5jdGlvbiB0b1dpcmVWYWx1ZSh2YWx1ZSkgewogICAgICAgIGZvciAoY29uc3QgW25hbWUsIGhhbmRsZXJdIG9mIHRyYW5zZmVySGFuZGxlcnMpIHsKICAgICAgICAgICAgaWYgKGhhbmRsZXIuY2FuSGFuZGxlKHZhbHVlKSkgewogICAgICAgICAgICAgICAgY29uc3QgW3NlcmlhbGl6ZWRWYWx1ZSwgdHJhbnNmZXJhYmxlc10gPSBoYW5kbGVyLnNlcmlhbGl6ZSh2YWx1ZSk7CiAgICAgICAgICAgICAgICByZXR1cm4gWwogICAgICAgICAgICAgICAgICAgIHsKICAgICAgICAgICAgICAgICAgICAgICAgdHlwZTogIkhBTkRMRVIiIC8qIFdpcmVWYWx1ZVR5cGUuSEFORExFUiAqLywKICAgICAgICAgICAgICAgICAgICAgICAgbmFtZSwKICAgICAgICAgICAgICAgICAgICAgICAgdmFsdWU6IHNlcmlhbGl6ZWRWYWx1ZSwKICAgICAgICAgICAgICAgICAgICB9LAogICAgICAgICAgICAgICAgICAgIHRyYW5zZmVyYWJsZXMsCiAgICAgICAgICAgICAgICBdOwogICAgICAgICAgICB9CiAgICAgICAgfQogICAgICAgIHJldHVybiBbCiAgICAgICAgICAgIHsKICAgICAgICAgICAgICAgIHR5cGU6ICJSQVciIC8qIFdpcmVWYWx1ZVR5cGUuUkFXICovLAogICAgICAgICAgICAgICAgdmFsdWUsCiAgICAgICAgICAgIH0sCiAgICAgICAgICAgIHRyYW5zZmVyQ2FjaGUuZ2V0KHZhbHVlKSB8fCBbXSwKICAgICAgICBdOwogICAgfQogICAgZnVuY3Rpb24gZnJvbVdpcmVWYWx1ZSh2YWx1ZSkgewogICAgICAgIHN3aXRjaCAodmFsdWUudHlwZSkgewogICAgICAgICAgICBjYXNlICJIQU5ETEVSIiAvKiBXaXJlVmFsdWVUeXBlLkhBTkRMRVIgKi86CiAgICAgICAgICAgICAgICByZXR1cm4gdHJhbnNmZXJIYW5kbGVycy5nZXQodmFsdWUubmFtZSkuZGVzZXJpYWxpemUodmFsdWUudmFsdWUpOwogICAgICAgICAgICBjYXNlICJSQVciIC8qIFdpcmVWYWx1ZVR5cGUuUkFXICovOgogICAgICAgICAgICAgICAgcmV0dXJuIHZhbHVlLnZhbHVlOwogICAgICAgIH0KICAgIH0KICAgIGZ1bmN0aW9uIHJlcXVlc3RSZXNwb25zZU1lc3NhZ2UoZXAsIG1zZywgdHJhbnNmZXJzKSB7CiAgICAgICAgcmV0dXJuIG5ldyBQcm9taXNlKChyZXNvbHZlKSA9PiB7CiAgICAgICAgICAgIGNvbnN0IGlkID0gZ2VuZXJhdGVVVUlEKCk7CiAgICAgICAgICAgIGVwLmFkZEV2ZW50TGlzdGVuZXIoIm1lc3NhZ2UiLCBmdW5jdGlvbiBsKGV2KSB7CiAgICAgICAgICAgICAgICBpZiAoIWV2LmRhdGEgfHwgIWV2LmRhdGEuaWQgfHwgZXYuZGF0YS5pZCAhPT0gaWQpIHsKICAgICAgICAgICAgICAgICAgICByZXR1cm47CiAgICAgICAgICAgICAgICB9CiAgICAgICAgICAgICAgICBlcC5yZW1vdmVFdmVudExpc3RlbmVyKCJtZXNzYWdlIiwgbCk7CiAgICAgICAgICAgICAgICByZXNvbHZlKGV2LmRhdGEpOwogICAgICAgICAgICB9KTsKICAgICAgICAgICAgaWYgKGVwLnN0YXJ0KSB7CiAgICAgICAgICAgICAgICBlcC5zdGFydCgpOwogICAgICAgICAgICB9CiAgICAgICAgICAgIGVwLnBvc3RNZXNzYWdlKE9iamVjdC5hc3NpZ24oeyBpZCB9LCBtc2cpLCB0cmFuc2ZlcnMpOwogICAgICAgIH0pOwogICAgfQogICAgZnVuY3Rpb24gZ2VuZXJhdGVVVUlEKCkgewogICAgICAgIHJldHVybiBuZXcgQXJyYXkoNCkKICAgICAgICAgICAgLmZpbGwoMCkKICAgICAgICAgICAgLm1hcCgoKSA9PiBNYXRoLmZsb29yKE1hdGgucmFuZG9tKCkgKiBOdW1iZXIuTUFYX1NBRkVfSU5URUdFUikudG9TdHJpbmcoMTYpKQogICAgICAgICAgICAuam9pbigiLSIpOwogICAgfQoKICAgIGNvbnN0IGNvbG9yQ29udmVydGVyID0gewogICAgICBnZXRDbG9zZXN0Q29sb3JGcm9tUGFsZXR0ZShnYW1lUGFsZXR0ZSwgcmVzZXJ2ZWRPZmZzZXQsIHIsIGcsIGIpIHsKICAgICAgICBjb25zdCBpZHggPSB0aGlzLmNvbnZlcnRBY3R1YWxDb2xvckZyb21QYWxldHRlKGdhbWVQYWxldHRlLCByZXNlcnZlZE9mZnNldCwgciwgZywgYik7CiAgICAgICAgcmV0dXJuIHRoaXMuZ2V0QWN0dWFsQ29sb3JGcm9tUGFsZXR0ZShnYW1lUGFsZXR0ZSwgaWR4KTsKICAgICAgfSwKICAgICAgY29udmVydEFjdHVhbENvbG9yRnJvbVBhbGV0dGUoZ2FtZVBhbGV0dGUsIHJlc2VydmVkT2Zmc2V0LCByLCBnLCBiKSB7CiAgICAgICAgY29uc3QgcmVzdWx0Q29sb3JJZHggPSBnYW1lUGFsZXR0ZS5tYXAoKGNvbG9yLCBpKSA9PiB7CiAgICAgICAgICBpZiAoaSA8IHJlc2VydmVkT2Zmc2V0KQogICAgICAgICAgICByZXR1cm4gdm9pZCAwOwogICAgICAgICAgY29uc3QgZGlmZmVyZW5jZSA9IE1hdGguc3FydCgociAtIGNvbG9yWzBdKSAqKiAyICsgKGcgLSBjb2xvclsxXSkgKiogMiArIChiIC0gY29sb3JbMl0pICoqIDIpOwogICAgICAgICAgcmV0dXJuIHsKICAgICAgICAgICAgZGlmZmVyZW5jZSwKICAgICAgICAgICAgY29sb3IsCiAgICAgICAgICAgIGluZGV4OiBpCiAgICAgICAgICB9OwogICAgICAgIH0pLmZpbHRlcigoYSkgPT4gISFhKS5tYXAoKGEpID0+IGEpLnNvcnQoKGFhLCBiYikgPT4gYWEuZGlmZmVyZW5jZSAtIGJiLmRpZmZlcmVuY2UpWzBdPy5pbmRleDsKICAgICAgICBpZiAocmVzdWx0Q29sb3JJZHggPT09IHZvaWQgMCkKICAgICAgICAgIHRocm93IG5ldyBFcnJvcihgQ29sb3Igbm90IGZvdW5kICR7cn0sICR7Z30sICR7Yn0gZnJvbSAke0pTT04uc3RyaW5naWZ5KGdhbWVQYWxldHRlKX1gKTsKICAgICAgICByZXR1cm4gcmVzdWx0Q29sb3JJZHg7CiAgICAgIH0sCiAgICAgIGdldEFjdHVhbENvbG9yRnJvbVBhbGV0dGUoZ2FtZVBhbGV0dGUsIGNvbG9yKSB7CiAgICAgICAgY29uc3QgY29sb3JEYXRhID0gZ2FtZVBhbGV0dGVbY29sb3JdOwogICAgICAgIGlmICghY29sb3JEYXRhKQogICAgICAgICAgcmV0dXJuIG51bGw7CiAgICAgICAgcmV0dXJuIFtjb2xvckRhdGFbMF0sIGNvbG9yRGF0YVsxXSwgY29sb3JEYXRhWzJdXTsKICAgICAgfSwKICAgICAgYXJlQ29sb3JzRXF1YWwoZ2FtZVBhbGV0dGUsIGMxLCBjMikgewogICAgICAgIGlmIChjMSA9PT0gYzIpIHsKICAgICAgICAgIHJldHVybiB0cnVlOwogICAgICAgIH0KICAgICAgICBjb25zdCBjb2xvcjEgPSBnYW1lUGFsZXR0ZVtjMV07CiAgICAgICAgY29uc3QgY29sb3IyID0gZ2FtZVBhbGV0dGVbYzJdOwogICAgICAgIGlmICghY29sb3IxIHx8ICFjb2xvcjIpCiAgICAgICAgICByZXR1cm4gYzEgPT09IGMyOwogICAgICAgIGxldCBhcmVFcXVhbCA9IHRydWU7CiAgICAgICAgYXJlRXF1YWwgPSBhcmVFcXVhbCAmJiBjb2xvcjFbMF0gPT09IGNvbG9yMlswXTsKICAgICAgICBhcmVFcXVhbCA9IGFyZUVxdWFsICYmIGNvbG9yMVsxXSA9PT0gY29sb3IyWzFdOwogICAgICAgIGFyZUVxdWFsID0gYXJlRXF1YWwgJiYgY29sb3IxWzJdID09PSBjb2xvcjJbMl07CiAgICAgICAgcmV0dXJuIGFyZUVxdWFsOwogICAgICB9LAogICAgICBwYXJzZUNvbG9yKGNvbG9yU3RyKSB7CiAgICAgICAgY29uc3QgciA9IHBhcnNlSW50KGNvbG9yU3RyLnN1YnN0cigxLCAyKSwgMTYpOwogICAgICAgIGNvbnN0IGcgPSBwYXJzZUludChjb2xvclN0ci5zdWJzdHIoMywgMiksIDE2KTsKICAgICAgICBjb25zdCBiID0gcGFyc2VJbnQoY29sb3JTdHIuc3Vic3RyKDUsIDIpLCAxNik7CiAgICAgICAgcmV0dXJuIFtyLCBnLCBiXTsKICAgICAgfQogICAgfTsKCiAgICBjb25zdCBwaWN0dXJlQ29udmVydGVyID0gewogICAgICBhc3luYyBpc0ltYWdlVmFsaWRDb3JzKHVybCkgewogICAgICAgIHRyeSB7CiAgICAgICAgICBjb25zdCByZXNwb25zZSA9IGF3YWl0IGZldGNoKHVybCk7CiAgICAgICAgfSBjYXRjaCAoZXJyb3IpIHsKICAgICAgICAgIHJldHVybiBmYWxzZTsKICAgICAgICB9CiAgICAgICAgcmV0dXJuIHRydWU7CiAgICAgIH0sCiAgICAgIGFzeW5jIGFwcGx5TW9kaWZpY2F0aW9uc1RvSW1hZ2VEYXRhKGNvbG9yUGFsZXR0ZSwgaW1hZ2VEYXRhLCBtb2RpZmllckNvbnZlcnRDb2xvcnMsIGJyaWdodGVuQnksIG1vZGlmaWVyU21vbFBpeGVscykgewogICAgICAgIHJldHVybiBuZXcgUHJvbWlzZSgocmVzb2x2ZSkgPT4gewogICAgICAgICAgY29uc3Qgb3V0SW1hZ2VEYXRhID0gbmV3IEltYWdlRGF0YShpbWFnZURhdGEud2lkdGgsIGltYWdlRGF0YS5oZWlnaHQpOwogICAgICAgICAgb3V0SW1hZ2VEYXRhLmRhdGEuc2V0KGltYWdlRGF0YS5kYXRhKTsKICAgICAgICAgIGlmIChtb2RpZmllckNvbnZlcnRDb2xvcnMpIHsKICAgICAgICAgICAgZm9yIChsZXQgeSA9IDA7IHkgPCBvdXRJbWFnZURhdGEuaGVpZ2h0OyB5KyspIHsKICAgICAgICAgICAgICBmb3IgKGxldCB4ID0gMDsgeCA8IG91dEltYWdlRGF0YS53aWR0aDsgeCsrKSB7CiAgICAgICAgICAgICAgICBjb25zdCBpZHggPSBvdXRJbWFnZURhdGEud2lkdGggKiB5ICsgeCA8PCAyOwogICAgICAgICAgICAgICAgY29uc3Qgb3JpZ2luYWxSID0gaW1hZ2VEYXRhLmRhdGFbaWR4ICsgMF0gPz8gMDsKICAgICAgICAgICAgICAgIGNvbnN0IG9yaWdpbmFsRyA9IGltYWdlRGF0YS5kYXRhW2lkeCArIDFdID8/IDA7CiAgICAgICAgICAgICAgICBjb25zdCBvcmlnaW5hbEIgPSBpbWFnZURhdGEuZGF0YVtpZHggKyAyXSA/PyAwOwogICAgICAgICAgICAgICAgY29uc3Qgb3JpZ2luYWxBID0gaW1hZ2VEYXRhLmRhdGFbaWR4ICsgM10gPz8gMDsKICAgICAgICAgICAgICAgIGNvbnN0IHIgPSBNYXRoLm1pbihvcmlnaW5hbFIgKyBicmlnaHRlbkJ5LCAyNTUpOwogICAgICAgICAgICAgICAgY29uc3QgZyA9IE1hdGgubWluKG9yaWdpbmFsRyArIGJyaWdodGVuQnksIDI1NSk7CiAgICAgICAgICAgICAgICBjb25zdCBiID0gTWF0aC5taW4ob3JpZ2luYWxCICsgYnJpZ2h0ZW5CeSwgMjU1KTsKICAgICAgICAgICAgICAgIGNvbnN0IHJlc3VsdEFyciA9IGNvbG9yQ29udmVydGVyLmdldENsb3Nlc3RDb2xvckZyb21QYWxldHRlKGNvbG9yUGFsZXR0ZSwgMCwgciwgZywgYik7CiAgICAgICAgICAgICAgICBpZiAoIXJlc3VsdEFycikgOyBlbHNlIHsKICAgICAgICAgICAgICAgICAgY29uc3QgW2NvbnZlcnRlZFIsIGNvbnZlcnRlZEcsIGNvbnZlcnRlZEJdID0gcmVzdWx0QXJyOwogICAgICAgICAgICAgICAgICBvdXRJbWFnZURhdGEuZGF0YVtpZHggKyAwXSA9IGNvbnZlcnRlZFI7CiAgICAgICAgICAgICAgICAgIG91dEltYWdlRGF0YS5kYXRhW2lkeCArIDFdID0gY29udmVydGVkRzsKICAgICAgICAgICAgICAgICAgb3V0SW1hZ2VEYXRhLmRhdGFbaWR4ICsgMl0gPSBjb252ZXJ0ZWRCOwogICAgICAgICAgICAgICAgICBvdXRJbWFnZURhdGEuZGF0YVtpZHggKyAzXSA9IG9yaWdpbmFsQSA+IDMwID8gMjU1IDogMDsKICAgICAgICAgICAgICAgIH0KICAgICAgICAgICAgICB9CiAgICAgICAgICAgIH0KICAgICAgICAgIH0KICAgICAgICAgIGlmIChtb2RpZmllclNtb2xQaXhlbHMpIHsKICAgICAgICAgICAgY29uc3Qgc21vbFBpeGVsc011bHRpcGxpZXIgPSAzOwogICAgICAgICAgICBjb25zdCBzbW9sUGl4ZWxzSW1hZ2VEYXRhID0gbmV3IEltYWdlRGF0YShvdXRJbWFnZURhdGEud2lkdGggKiBzbW9sUGl4ZWxzTXVsdGlwbGllciwgb3V0SW1hZ2VEYXRhLmhlaWdodCAqIHNtb2xQaXhlbHNNdWx0aXBsaWVyKTsKICAgICAgICAgICAgZm9yIChsZXQgb3V0WSA9IDA7IG91dFkgPCBvdXRJbWFnZURhdGEuaGVpZ2h0OyBvdXRZKyspIHsKICAgICAgICAgICAgICBmb3IgKGxldCBvdXRYID0gMDsgb3V0WCA8IG91dEltYWdlRGF0YS53aWR0aDsgb3V0WCsrKSB7CiAgICAgICAgICAgICAgICBjb25zdCBvdXRJZHggPSBvdXRJbWFnZURhdGEud2lkdGggKiBvdXRZICsgb3V0WCA8PCAyOwogICAgICAgICAgICAgICAgY29uc3Qgb3V0UiA9IG91dEltYWdlRGF0YS5kYXRhW291dElkeCArIDBdID8/IDA7CiAgICAgICAgICAgICAgICBjb25zdCBvdXRHID0gb3V0SW1hZ2VEYXRhLmRhdGFbb3V0SWR4ICsgMV0gPz8gMDsKICAgICAgICAgICAgICAgIGNvbnN0IG91dEIgPSBvdXRJbWFnZURhdGEuZGF0YVtvdXRJZHggKyAyXSA/PyAwOwogICAgICAgICAgICAgICAgY29uc3Qgb3V0QSA9IG91dEltYWdlRGF0YS5kYXRhW291dElkeCArIDNdID8/IDA7CiAgICAgICAgICAgICAgICBjb25zdCBzbW9sWCA9IG91dFggKiBzbW9sUGl4ZWxzTXVsdGlwbGllciArIE1hdGguZmxvb3Ioc21vbFBpeGVsc011bHRpcGxpZXIgLyAyKTsKICAgICAgICAgICAgICAgIGNvbnN0IHNtb2xZID0gb3V0WSAqIHNtb2xQaXhlbHNNdWx0aXBsaWVyICsgTWF0aC5mbG9vcihzbW9sUGl4ZWxzTXVsdGlwbGllciAvIDIpOwogICAgICAgICAgICAgICAgY29uc3Qgc21vbElkeCA9IHNtb2xZICogc21vbFBpeGVsc0ltYWdlRGF0YS53aWR0aCArIHNtb2xYIDw8IDI7CiAgICAgICAgICAgICAgICBzbW9sUGl4ZWxzSW1hZ2VEYXRhLmRhdGFbc21vbElkeCArIDBdID0gb3V0UjsKICAgICAgICAgICAgICAgIHNtb2xQaXhlbHNJbWFnZURhdGEuZGF0YVtzbW9sSWR4ICsgMV0gPSBvdXRHOwogICAgICAgICAgICAgICAgc21vbFBpeGVsc0ltYWdlRGF0YS5kYXRhW3Ntb2xJZHggKyAyXSA9IG91dEI7CiAgICAgICAgICAgICAgICBzbW9sUGl4ZWxzSW1hZ2VEYXRhLmRhdGFbc21vbElkeCArIDNdID0gb3V0QTsKICAgICAgICAgICAgICB9CiAgICAgICAgICAgIH0KICAgICAgICAgICAgcmVzb2x2ZShzbW9sUGl4ZWxzSW1hZ2VEYXRhKTsKICAgICAgICAgICAgcmV0dXJuOwogICAgICAgICAgfQogICAgICAgICAgcmVzb2x2ZShvdXRJbWFnZURhdGEpOwogICAgICAgIH0pOwogICAgICB9CiAgICB9OwoKICAgIGV4cG9zZShwaWN0dXJlQ29udmVydGVyKTsKCn0pKCk7Cg==";
const blob = typeof window !== "undefined" && window.Blob && new Blob([atob(encodedJs)], { type: "text/javascript;charset=utf-8" });
function WorkerWrapper() {
const objURL = blob && (window.URL || window.webkitURL).createObjectURL(blob);
try {
return objURL ? new Worker(objURL) : new Worker("data:application/javascript;base64," + encodedJs);
} finally {
objURL && (window.URL || window.webkitURL).revokeObjectURL(objURL);
}
}
const worker = new WorkerWrapper();
const pictureConverterApi = wrap(worker);
async function tryReadingImageData(url, abortSignal) {
try {
return await loadImageDrawOnCanvasGetData(url, abortSignal);
} catch (error) {
logger.logError(`Error loading image: url: ${url} ${error}`);
return void 0;
}
}
async function loadImageDrawOnCanvasGetData(url, abortSignal) {
const img = new Image();
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
if (!ctx)
throw new Error("Can't get context");
const clearCallbacks = () => {
img.onload = null;
img.onerror = null;
img.src = "";
abortSignal.onabort = null;
};
const imageData = await new Promise((resolve, reject) => {
img.onerror = () => {
reject(new Error("Image load error"));
clearCallbacks();
};
img.onload = () => {
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
try {
resolve(ctx.getImageData(0, 0, img.width, img.height));
} catch (error) {
if (!window.location.protocol.startsWith("http"))
reject(error);
fetch(url, {
signal: abortSignal
}).then((response) => response.blob()).then((blob) => new File([blob], "image.png", {
type: "image/png"
})).then((file) => loadImageDrawOnCanvasGetData(URL.createObjectURL(file), abortSignal).finally(() => URL.revokeObjectURL(url))).then(resolve);
}
};
abortSignal.onabort = () => {
reject(new Error("Aborted"));
clearCallbacks();
};
img.src = url;
});
clearCallbacks();
return imageData;
}
function delay(timeout) {
return new Promise((resolve) => {
setTimeout(resolve, timeout);
});
}
const setInputImageAction = createAsyncThunk("imageProcessing/setInputImage", async (input, {
dispatch,
getState
}) => {
await dispatch(clearInputImageAction());
const file = typeof input !== "string" ? input : void 0;
const url = typeof input === "string" ? input : void 0;
return {
file,
url
};
});
const clearInputImageAction = createAsyncThunk("imageProcessing/clearInputImage", async (_, {
dispatch,
getState
}) => {
dispatch(clearOutputImageAction());
});
const clearOutputImageAction = createAsyncThunk("imageProcessing/clearOutputImage", async (_, {
getState
}) => {
getState().processedImages.outputImage.abortController?.abort();
});
function useReadingInputImageProcess() {
const inputFile = useAppSelector(selectInputFile);
const inputUrl = useAppSelector(selectInputUrl);
const dispatch = useAppDispatch();
reactExports.useEffect(() => {
dispatch(startNewImageReadingProcess());
}, [inputFile, inputUrl]);
}
const startNewImageReadingProcess = createAsyncThunk("imageProcessing/startNewImageReadingProcess", async (_, {
dispatch,
getState
}) => {
const url = selectInputUrl(getState());
const file = selectInputFile(getState());
const abortController = new AbortController();
if (url)
return tryReadingImageData(url, abortController.signal);
if (file != null) {
const fileUrl = URL.createObjectURL(file);
delay(0).then(() => URL.revokeObjectURL(fileUrl));
return tryReadingImageData(fileUrl, abortController.signal);
}
return void 0;
});
const startProcessingOutputImage = createAsyncThunk("imageProcessing/startProcessingOutputImage", async (_, {
getState
}) => {
const palette = selectCanvasUserPalette(getState());
const modifierShouldConvertColors = selectModifierShouldConvertColors(getState());
const modifierImageBrightness = selectModifierImageBrightness(getState());
const modifierSmolPixels = selectModifierSmolPixels(getState());
const inputImageData = selectInputImageData(getState());
if (inputImageData == null)
throw new Error("Can't process output image without input image data");
const abortController = new AbortController();
const outImageData = await new Promise((resolve, reject) => {
abortController.signal.onabort = () => reject(new Error("aborted"));
pictureConverterApi.applyModificationsToImageData(palette, inputImageData, modifierShouldConvertColors, modifierImageBrightness, modifierSmolPixels).then((imageData) => {
resolve(imageData);
}).catch((error) => {
reject(error);
});
});
return {
outImageData,
abortController
};
});
const loadSavedConfigurations = createAsyncThunk("imageProcessing/loadSavedConfigurations", async (_, {
dispatch,
getState
}) => {
return JSON.parse(localStorage.getItem("OverlaySavedConfigurationsv2") || "[]");
});
const initialState$6 = {
savedConfigs: [],
overlayEnabled: true,
overlayImage: {
inputImage: {}
},
placementConfiguration: {
yOffset: 0,
xOffset: 0,
transparency: 92,
isFollowMouseActive: false,
autoSelectColor: false
},
modifications: {
imageBrightness: 0,
shouldConvertColors: false,
smolPixels: false
},
isBotModalVisible: false,
browserWindow: {
innerWidth: 100,
innerHeight: 100
}
};
const overlaySlice = createSlice({
initialState: initialState$6,
name: "overlay",
reducers: {
setPlacementXOffset: (state, action) => {
state.placementConfiguration.xOffset = action.payload;
},
setPlacementYOffset: (state, action) => {
state.placementConfiguration.yOffset = action.payload;
},
setPlacementTransparency: (state, action) => {
state.placementConfiguration.transparency = action.payload;
},
togglePlacementFollowMouse: (state) => {
state.placementConfiguration.isFollowMouseActive = !state.placementConfiguration.isFollowMouseActive;
},
setPlacementIsFollowMouseActive: (state, action) => {
state.placementConfiguration.isFollowMouseActive = action.payload;
},
setPlacementAutoSelectColor: (state, action) => {
state.placementConfiguration.autoSelectColor = action.payload;
},
setModifierImageBrightness: (state, action) => {
state.modifications.imageBrightness = action.payload;
},
setModifierShouldConvertColors: (state, action) => {
state.modifications.shouldConvertColors = action.payload;
},
setModifierSmolPixels: (state, action) => {
state.modifications.smolPixels = action.payload;
},
setOverlayEnabled: (state, action) => {
state.overlayEnabled = action.payload;
},
setWindowSize: (state, action) => {
state.browserWindow = action.payload;
},
saveConfiguration: (state, action) => {
const savedConfigurations = state.savedConfigs;
const existingConfiguration = savedConfigurations.find((c) => c.imageUrl === action.payload.imageUrl);
if (existingConfiguration != null) {
existingConfiguration.modifiers = action.payload.modifiers;
existingConfiguration.placementConfiguration = action.payload.placementConfiguration;
} else {
savedConfigurations.push(action.payload);
}
},
removeSavedConfig: (state, action) => {
const savedConfigurations = state.savedConfigs;
const existingConfiguration = savedConfigurations.find((c) => c.imageUrl === action.payload);
if (existingConfiguration) {
savedConfigurations.splice(savedConfigurations.indexOf(existingConfiguration), 1);
}
}
},
extraReducers: (builder) => {
builder.addCase(setInputImageAction.fulfilled, (state, action) => {
state.overlayImage.inputImage.url = action.payload.url;
state.overlayImage.inputImage.file = action.payload.file;
});
builder.addCase(clearInputImageAction.fulfilled, (state) => {
state.overlayImage.inputImage.file = void 0;
state.overlayImage.inputImage.url = void 0;
});
builder.addCase(loadSavedConfigurations.fulfilled, (state, action) => {
state.savedConfigs = action.payload;
});
}
});
const selectInputUrl = createSelector((state) => state.overlay.overlayImage.inputImage.url, (url) => url);
const selectInputImageData = createSelector((state) => state.processedImages.inputImage.loadedImage.imageData, (imageData) => imageData);
const selectIsModificationsAvailable = createSelector(selectInputImageData, (inputImageData) => {
return !!inputImageData;
});
const selectInputFile = createSelector((state) => state.overlay.overlayImage.inputImage.file, (file) => file);
const selectFileName = createSelector(selectInputFile, selectInputUrl, (file, url) => {
const fileName = file?.name ?? url?.split("/").pop();
if (fileName) {
return {
fileName,
fileExtension: fileName.split(".").pop(),
fileNameWithoutExtension: fileName.split(".").slice(0, -1).join(".")
};
}
return void 0;
});
const selectShouldShowPlacementConfiguration = createSelector(selectInputFile, selectInputUrl, (file, url) => file || url);
const selectPlacementXOffset = createSelector((state) => state.overlay.placementConfiguration.xOffset, (xOffset) => xOffset);
const selectPlacementYOffset = createSelector((state) => state.overlay.placementConfiguration.yOffset, (yOffset) => yOffset);
const selectPlacementTransparency = createSelector((state) => state.overlay.placementConfiguration.transparency, (transparency) => transparency);
const selectPlacementIsFollowMouseActive = createSelector((state) => state.overlay.placementConfiguration.isFollowMouseActive, (isFollowMouseActive) => isFollowMouseActive);
const selectPlacementAutoSelectColor = createSelector((state) => state.overlay.placementConfiguration.autoSelectColor, (autoSelectColor) => autoSelectColor);
const selectModifierImageBrightness = createSelector((state) => state.overlay.modifications.imageBrightness, (imageBrightness) => imageBrightness);
const selectModifierShouldConvertColors = createSelector((state) => state.overlay.modifications.shouldConvertColors, (shouldConvertColors) => shouldConvertColors);
const selectModifierSmolPixels = createSelector((state) => state.overlay.modifications.smolPixels, (smolPixels) => smolPixels);
const selectIsOverlayEnabled = createSelector((state) => state.overlay.overlayEnabled, (overlayEnabled) => overlayEnabled);
const selectInputImageLoadingStatus = createSelector((state) => state.processedImages.inputImage.loadedImage.status, (status) => status);
const selectIsOutputImageProcessing = createSelector((state) => state.processedImages.outputImage.isProcessing, (isProcessing) => isProcessing);
const selectOutputImageData = createSelector((state) => state.processedImages.outputImage.isProcessing, (state) => state.processedImages.outputImage.imageData, (state) => state.processedImages.outputImage.abortController, (isProcessing, imageData, abortController) => {
if (!isProcessing && imageData) {
return imageData;
}
return void 0;
});
const selectRenderImageData = createSelector(selectOutputImageData, selectInputImageData, (outputImageData, inputImageData) => {
return outputImageData || inputImageData;
});
const selectShouldShowImageFromData = createSelector(selectRenderImageData, (imageData) => !!imageData);
const selectShouldShowImageFromUrl = createSelector(selectShouldShowImageFromData, selectInputFile, selectInputUrl, (shouldShowImageFromData, file, url) => {
if (shouldShowImageFromData)
return false;
if (file || url)
return true;
return false;
});
createSelector(selectInputUrl, selectOutputImageData, (url, imageData) => {
return imageData || url;
});
const selectWindowSize = createSelector((state) => state.overlay.browserWindow.innerHeight, (state) => state.overlay.browserWindow.innerWidth, (innerHeight, innerWidth) => {
return {
innerHeight,
innerWidth
};
});
const selectOverlayOffsetCoordsOnScreen = createSelector(selectWindowSize, selectGameViewCenter, selectPlacementXOffset, selectPlacementYOffset, selectGameViewScale, (windowSize, gameViewCenter, xOffset, yOffset, viewScale) => {
const leftOffset = windowSize.innerWidth / 2 - (gameViewCenter.x - xOffset) * viewScale;
const topOffset = windowSize.innerHeight / 2 - (gameViewCenter.y - yOffset) * viewScale;
return {
leftOffset,
topOffset
};
});
const selectCurrentHoverPixelOnOutputImageColorIndexInPalette = createSelector(selectPlacementAutoSelectColor, selectModifierSmolPixels, selectHoverPixel, selectPlacementXOffset, selectPlacementYOffset, selectRenderImageData, selectCanvasPalette, selectCanvasReservedColorCount, (autoSelectColor, modifierSmolPixels, hoverPixel, placementXOffset, placementYOffset, renderImageData, palette, reservedColorCount) => {
if (!autoSelectColor)
return void 0;
if (!renderImageData)
return void 0;
const smolPixelsCanvasSizeModifier = modifierSmolPixels ? 3 : 1;
const smolPixelsCanvasExtraOffsetToMiddle = Math.floor(smolPixelsCanvasSizeModifier / 2);
const offsetXInImage = (hoverPixel.x - placementXOffset) * smolPixelsCanvasSizeModifier + smolPixelsCanvasExtraOffsetToMiddle;
const offsetYInImage = (hoverPixel.y - placementYOffset) * smolPixelsCanvasSizeModifier + smolPixelsCanvasExtraOffsetToMiddle;
if (offsetXInImage < 0 || offsetXInImage >= renderImageData.width || offsetYInImage < 0 || offsetYInImage >= renderImageData.height)
return void 0;
const idx = renderImageData.width * offsetYInImage + offsetXInImage << 2;
const r = renderImageData.data[idx + 0];
const g = renderImageData.data[idx + 1];
const b = renderImageData.data[idx + 2];
const a = renderImageData.data[idx + 3];
if (r == null || g == null || b == null || a == null)
return void 0;
if (a < 30)
return void 0;
const colorIndex = colorConverter.convertActualColorFromPalette(palette, reservedColorCount, r, g, b);
return colorIndex;
});
const selectSavedConfigurations = createSelector((state) => state.overlay.savedConfigs, (savedConfigurations) => savedConfigurations);
const selectCurrentStateAsConfiguration = createSelector(selectInputUrl, selectPlacementXOffset, selectPlacementYOffset, selectPlacementTransparency, selectPlacementAutoSelectColor, selectModifierImageBrightness, selectModifierShouldConvertColors, (inputUrl, xOffset, yOffset, transparency, autoSelectColor, imageBrightness, shouldConvertColors) => {
if (!inputUrl)
return void 0;
return {
imageUrl: inputUrl,
modifiers: {
autoSelectColor,
imageBrightness,
shouldConvertColors
},
placementConfiguration: {
xOffset,
yOffset,
transparency
}
};
});
function commonjsRequire(path) {
throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
}
var localforageExports = {};
var localforage$1 = {
get exports(){ return localforageExports; },
set exports(v){ localforageExports = v; },
};
/*!
localForage -- Offline Storage, Improved
Version 1.10.0
https://localforage.github.io/localForage
(c) 2013-2017 Mozilla, Apache License 2.0
*/
(function (module, exports) {
(function(f){{module.exports=f();}})(function(){return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof commonjsRequire=="function"&&commonjsRequire;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw (f.code="MODULE_NOT_FOUND", f)}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r);}return n[o].exports}var i=typeof commonjsRequire=="function"&&commonjsRequire;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(_dereq_,module,exports){
(function (global){
var Mutation = global.MutationObserver || global.WebKitMutationObserver;
var scheduleDrain;
{
if (Mutation) {
var called = 0;
var observer = new Mutation(nextTick);
var element = global.document.createTextNode('');
observer.observe(element, {
characterData: true
});
scheduleDrain = function () {
element.data = (called = ++called % 2);
};
} else if (!global.setImmediate && typeof global.MessageChannel !== 'undefined') {
var channel = new global.MessageChannel();
channel.port1.onmessage = nextTick;
scheduleDrain = function () {
channel.port2.postMessage(0);
};
} else if ('document' in global && 'onreadystatechange' in global.document.createElement('script')) {
scheduleDrain = function () {
// Create a <script> element; its readystatechange event will be fired asynchronously once it is inserted
// into the document. Do so, thus queuing up the task. Remember to clean up once it's been called.
var scriptEl = global.document.createElement('script');
scriptEl.onreadystatechange = function () {
nextTick();
scriptEl.onreadystatechange = null;
scriptEl.parentNode.removeChild(scriptEl);
scriptEl = null;
};
global.document.documentElement.appendChild(scriptEl);
};
} else {
scheduleDrain = function () {
setTimeout(nextTick, 0);
};
}
}
var draining;
var queue = [];
//named nextTick for less confusing stack traces
function nextTick() {
draining = true;
var i, oldQueue;
var len = queue.length;
while (len) {
oldQueue = queue;
queue = [];
i = -1;
while (++i < len) {
oldQueue[i]();
}
len = queue.length;
}
draining = false;
}
module.exports = immediate;
function immediate(task) {
if (queue.push(task) === 1 && !draining) {
scheduleDrain();
}
}
}).call(this,typeof commonjsGlobal !== "undefined" ? commonjsGlobal : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {});
},{}],2:[function(_dereq_,module,exports){
var immediate = _dereq_(1);
/* istanbul ignore next */
function INTERNAL() {}
var handlers = {};
var REJECTED = ['REJECTED'];
var FULFILLED = ['FULFILLED'];
var PENDING = ['PENDING'];
module.exports = Promise;
function Promise(resolver) {
if (typeof resolver !== 'function') {
throw new TypeError('resolver must be a function');
}
this.state = PENDING;
this.queue = [];
this.outcome = void 0;
if (resolver !== INTERNAL) {
safelyResolveThenable(this, resolver);
}
}
Promise.prototype["catch"] = function (onRejected) {
return this.then(null, onRejected);
};
Promise.prototype.then = function (onFulfilled, onRejected) {
if (typeof onFulfilled !== 'function' && this.state === FULFILLED ||
typeof onRejected !== 'function' && this.state === REJECTED) {
return this;
}
var promise = new this.constructor(INTERNAL);
if (this.state !== PENDING) {
var resolver = this.state === FULFILLED ? onFulfilled : onRejected;
unwrap(promise, resolver, this.outcome);
} else {
this.queue.push(new QueueItem(promise, onFulfilled, onRejected));
}
return promise;
};
function QueueItem(promise, onFulfilled, onRejected) {
this.promise = promise;
if (typeof onFulfilled === 'function') {
this.onFulfilled = onFulfilled;
this.callFulfilled = this.otherCallFulfilled;
}
if (typeof onRejected === 'function') {
this.onRejected = onRejected;
this.callRejected = this.otherCallRejected;
}
}
QueueItem.prototype.callFulfilled = function (value) {
handlers.resolve(this.promise, value);
};
QueueItem.prototype.otherCallFulfilled = function (value) {
unwrap(this.promise, this.onFulfilled, value);
};
QueueItem.prototype.callRejected = function (value) {
handlers.reject(this.promise, value);
};
QueueItem.prototype.otherCallRejected = function (value) {
unwrap(this.promise, this.onRejected, value);
};
function unwrap(promise, func, value) {
immediate(function () {
var returnValue;
try {
returnValue = func(value);
} catch (e) {
return handlers.reject(promise, e);
}
if (returnValue === promise) {
handlers.reject(promise, new TypeError('Cannot resolve promise with itself'));
} else {
handlers.resolve(promise, returnValue);
}
});
}
handlers.resolve = function (self, value) {
var result = tryCatch(getThen, value);
if (result.status === 'error') {
return handlers.reject(self, result.value);
}
var thenable = result.value;
if (thenable) {
safelyResolveThenable(self, thenable);
} else {
self.state = FULFILLED;
self.outcome = value;
var i = -1;
var len = self.queue.length;
while (++i < len) {
self.queue[i].callFulfilled(value);
}
}
return self;
};
handlers.reject = function (self, error) {
self.state = REJECTED;
self.outcome = error;
var i = -1;
var len = self.queue.length;
while (++i < len) {
self.queue[i].callRejected(error);
}
return self;
};
function getThen(obj) {
// Make sure we only access the accessor once as required by the spec
var then = obj && obj.then;
if (obj && (typeof obj === 'object' || typeof obj === 'function') && typeof then === 'function') {
return function appyThen() {
then.apply(obj, arguments);
};
}
}
function safelyResolveThenable(self, thenable) {
// Either fulfill, reject or reject with error
var called = false;
function onError(value) {
if (called) {
return;
}
called = true;
handlers.reject(self, value);
}
function onSuccess(value) {
if (called) {
return;
}
called = true;
handlers.resolve(self, value);
}
function tryToUnwrap() {
thenable(onSuccess, onError);
}
var result = tryCatch(tryToUnwrap);
if (result.status === 'error') {
onError(result.value);
}
}
function tryCatch(func, value) {
var out = {};
try {
out.value = func(value);
out.status = 'success';
} catch (e) {
out.status = 'error';
out.value = e;
}
return out;
}
Promise.resolve = resolve;
function resolve(value) {
if (value instanceof this) {
return value;
}
return handlers.resolve(new this(INTERNAL), value);
}
Promise.reject = reject;
function reject(reason) {
var promise = new this(INTERNAL);
return handlers.reject(promise, reason);
}
Promise.all = all;
function all(iterable) {
var self = this;
if (Object.prototype.toString.call(iterable) !== '[object Array]') {
return this.reject(new TypeError('must be an array'));
}
var len = iterable.length;
var called = false;
if (!len) {
return this.resolve([]);
}
var values = new Array(len);
var resolved = 0;
var i = -1;
var promise = new this(INTERNAL);
while (++i < len) {
allResolver(iterable[i], i);
}
return promise;
function allResolver(value, i) {
self.resolve(value).then(resolveFromAll, function (error) {
if (!called) {
called = true;
handlers.reject(promise, error);
}
});
function resolveFromAll(outValue) {
values[i] = outValue;
if (++resolved === len && !called) {
called = true;
handlers.resolve(promise, values);
}
}
}
}
Promise.race = race;
function race(iterable) {
var self = this;
if (Object.prototype.toString.call(iterable) !== '[object Array]') {
return this.reject(new TypeError('must be an array'));
}
var len = iterable.length;
var called = false;
if (!len) {
return this.resolve([]);
}
var i = -1;
var promise = new this(INTERNAL);
while (++i < len) {
resolver(iterable[i]);
}
return promise;
function resolver(value) {
self.resolve(value).then(function (response) {
if (!called) {
called = true;
handlers.resolve(promise, response);
}
}, function (error) {
if (!called) {
called = true;
handlers.reject(promise, error);
}
});
}
}
},{"1":1}],3:[function(_dereq_,module,exports){
(function (global){
if (typeof global.Promise !== 'function') {
global.Promise = _dereq_(2);
}
}).call(this,typeof commonjsGlobal !== "undefined" ? commonjsGlobal : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {});
},{"2":2}],4:[function(_dereq_,module,exports){
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function getIDB() {
/* global indexedDB,webkitIndexedDB,mozIndexedDB,OIndexedDB,msIndexedDB */
try {
if (typeof indexedDB !== 'undefined') {
return indexedDB;
}
if (typeof webkitIndexedDB !== 'undefined') {
return webkitIndexedDB;
}
if (typeof mozIndexedDB !== 'undefined') {
return mozIndexedDB;
}
if (typeof OIndexedDB !== 'undefined') {
return OIndexedDB;
}
if (typeof msIndexedDB !== 'undefined') {
return msIndexedDB;
}
} catch (e) {
return;
}
}
var idb = getIDB();
function isIndexedDBValid() {
try {
// Initialize IndexedDB; fall back to vendor-prefixed versions
// if needed.
if (!idb || !idb.open) {
return false;
}
// We mimic PouchDB here;
//
// We test for openDatabase because IE Mobile identifies itself
// as Safari. Oh the lulz...
var isSafari = typeof openDatabase !== 'undefined' && /(Safari|iPhone|iPad|iPod)/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent) && !/BlackBerry/.test(navigator.platform);
var hasFetch = typeof fetch === 'function' && fetch.toString().indexOf('[native code') !== -1;
// Safari <10.1 does not meet our requirements for IDB support
// (see: https://github.com/pouchdb/pouchdb/issues/5572).
// Safari 10.1 shipped with fetch, we can use that to detect it.
// Note: this creates issues with `window.fetch` polyfills and
// overrides; see:
// https://github.com/localForage/localForage/issues/856
return (!isSafari || hasFetch) && typeof indexedDB !== 'undefined' &&
// some outdated implementations of IDB that appear on Samsung
// and HTC Android devices <4.4 are missing IDBKeyRange
// See: https://github.com/mozilla/localForage/issues/128
// See: https://github.com/mozilla/localForage/issues/272
typeof IDBKeyRange !== 'undefined';
} catch (e) {
return false;
}
}
// Abstracts constructing a Blob object, so it also works in older
// browsers that don't support the native Blob constructor. (i.e.
// old QtWebKit versions, at least).
// Abstracts constructing a Blob object, so it also works in older
// browsers that don't support the native Blob constructor. (i.e.
// old QtWebKit versions, at least).
function createBlob(parts, properties) {
/* global BlobBuilder,MSBlobBuilder,MozBlobBuilder,WebKitBlobBuilder */
parts = parts || [];
properties = properties || {};
try {
return new Blob(parts, properties);
} catch (e) {
if (e.name !== 'TypeError') {
throw e;
}
var Builder = typeof BlobBuilder !== 'undefined' ? BlobBuilder : typeof MSBlobBuilder !== 'undefined' ? MSBlobBuilder : typeof MozBlobBuilder !== 'undefined' ? MozBlobBuilder : WebKitBlobBuilder;
var builder = new Builder();
for (var i = 0; i < parts.length; i += 1) {
builder.append(parts[i]);
}
return builder.getBlob(properties.type);
}
}
// This is CommonJS because lie is an external dependency, so Rollup
// can just ignore it.
if (typeof Promise === 'undefined') {
// In the "nopromises" build this will just throw if you don't have
// a global promise object, but it would throw anyway later.
_dereq_(3);
}
var Promise$1 = Promise;
function executeCallback(promise, callback) {
if (callback) {
promise.then(function (result) {
callback(null, result);
}, function (error) {
callback(error);
});
}
}
function executeTwoCallbacks(promise, callback, errorCallback) {
if (typeof callback === 'function') {
promise.then(callback);
}
if (typeof errorCallback === 'function') {
promise["catch"](errorCallback);
}
}
function normalizeKey(key) {
// Cast the key to a string, as that's all we can set as a key.
if (typeof key !== 'string') {
console.warn(key + ' used as a key, but it is not a string.');
key = String(key);
}
return key;
}
function getCallback() {
if (arguments.length && typeof arguments[arguments.length - 1] === 'function') {
return arguments[arguments.length - 1];
}
}
// Some code originally from async_storage.js in
// [Gaia](https://github.com/mozilla-b2g/gaia).
var DETECT_BLOB_SUPPORT_STORE = 'local-forage-detect-blob-support';
var supportsBlobs = void 0;
var dbContexts = {};
var toString = Object.prototype.toString;
// Transaction Modes
var READ_ONLY = 'readonly';
var READ_WRITE = 'readwrite';
// Transform a binary string to an array buffer, because otherwise
// weird stuff happens when you try to work with the binary string directly.
// It is known.
// From http://stackoverflow.com/questions/14967647/ (continues on next line)
// encode-decode-image-with-base64-breaks-image (2013-04-21)
function _binStringToArrayBuffer(bin) {
var length = bin.length;
var buf = new ArrayBuffer(length);
var arr = new Uint8Array(buf);
for (var i = 0; i < length; i++) {
arr[i] = bin.charCodeAt(i);
}
return buf;
}
//
// Blobs are not supported in all versions of IndexedDB, notably
// Chrome <37 and Android <5. In those versions, storing a blob will throw.
//
// Various other blob bugs exist in Chrome v37-42 (inclusive).
// Detecting them is expensive and confusing to users, and Chrome 37-42
// is at very low usage worldwide, so we do a hacky userAgent check instead.
//
// content-type bug: https://code.google.com/p/chromium/issues/detail?id=408120
// 404 bug: https://code.google.com/p/chromium/issues/detail?id=447916
// FileReader bug: https://code.google.com/p/chromium/issues/detail?id=447836
//
// Code borrowed from PouchDB. See:
// https://github.com/pouchdb/pouchdb/blob/master/packages/node_modules/pouchdb-adapter-idb/src/blobSupport.js
//
function _checkBlobSupportWithoutCaching(idb) {
return new Promise$1(function (resolve) {
var txn = idb.transaction(DETECT_BLOB_SUPPORT_STORE, READ_WRITE);
var blob = createBlob(['']);
txn.objectStore(DETECT_BLOB_SUPPORT_STORE).put(blob, 'key');
txn.onabort = function (e) {
// If the transaction aborts now its due to not being able to
// write to the database, likely due to the disk being full
e.preventDefault();
e.stopPropagation();
resolve(false);
};
txn.oncomplete = function () {
var matchedChrome = navigator.userAgent.match(/Chrome\/(\d+)/);
var matchedEdge = navigator.userAgent.match(/Edge\//);
// MS Edge pretends to be Chrome 42:
// https://msdn.microsoft.com/en-us/library/hh869301%28v=vs.85%29.aspx
resolve(matchedEdge || !matchedChrome || parseInt(matchedChrome[1], 10) >= 43);
};
})["catch"](function () {
return false; // error, so assume unsupported
});
}
function _checkBlobSupport(idb) {
if (typeof supportsBlobs === 'boolean') {
return Promise$1.resolve(supportsBlobs);
}
return _checkBlobSupportWithoutCaching(idb).then(function (value) {
supportsBlobs = value;
return supportsBlobs;
});
}
function _deferReadiness(dbInfo) {
var dbContext = dbContexts[dbInfo.name];
// Create a deferred object representing the current database operation.
var deferredOperation = {};
deferredOperation.promise = new Promise$1(function (resolve, reject) {
deferredOperation.resolve = resolve;
deferredOperation.reject = reject;
});
// Enqueue the deferred operation.
dbContext.deferredOperations.push(deferredOperation);
// Chain its promise to the database readiness.
if (!dbContext.dbReady) {
dbContext.dbReady = deferredOperation.promise;
} else {
dbContext.dbReady = dbContext.dbReady.then(function () {
return deferredOperation.promise;
});
}
}
function _advanceReadiness(dbInfo) {
var dbContext = dbContexts[dbInfo.name];
// Dequeue a deferred operation.
var deferredOperation = dbContext.deferredOperations.pop();
// Resolve its promise (which is part of the database readiness
// chain of promises).
if (deferredOperation) {
deferredOperation.resolve();
return deferredOperation.promise;
}
}
function _rejectReadiness(dbInfo, err) {
var dbContext = dbContexts[dbInfo.name];
// Dequeue a deferred operation.
var deferredOperation = dbContext.deferredOperations.pop();
// Reject its promise (which is part of the database readiness
// chain of promises).
if (deferredOperation) {
deferredOperation.reject(err);
return deferredOperation.promise;
}
}
function _getConnection(dbInfo, upgradeNeeded) {
return new Promise$1(function (resolve, reject) {
dbContexts[dbInfo.name] = dbContexts[dbInfo.name] || createDbContext();
if (dbInfo.db) {
if (upgradeNeeded) {
_deferReadiness(dbInfo);
dbInfo.db.close();
} else {
return resolve(dbInfo.db);
}
}
var dbArgs = [dbInfo.name];
if (upgradeNeeded) {
dbArgs.push(dbInfo.version);
}
var openreq = idb.open.apply(idb, dbArgs);
if (upgradeNeeded) {
openreq.onupgradeneeded = function (e) {
var db = openreq.result;
try {
db.createObjectStore(dbInfo.storeName);
if (e.oldVersion <= 1) {
// Added when support for blob shims was added
db.createObjectStore(DETECT_BLOB_SUPPORT_STORE);
}
} catch (ex) {
if (ex.name === 'ConstraintError') {
console.warn('The database "' + dbInfo.name + '"' + ' has been upgraded from version ' + e.oldVersion + ' to version ' + e.newVersion + ', but the storage "' + dbInfo.storeName + '" already exists.');
} else {
throw ex;
}
}
};
}
openreq.onerror = function (e) {
e.preventDefault();
reject(openreq.error);
};
openreq.onsuccess = function () {
var db = openreq.result;
db.onversionchange = function (e) {
// Triggered when the database is modified (e.g. adding an objectStore) or
// deleted (even when initiated by other sessions in different tabs).
// Closing the connection here prevents those operations from being blocked.
// If the database is accessed again later by this instance, the connection
// will be reopened or the database recreated as needed.
e.target.close();
};
resolve(db);
_advanceReadiness(dbInfo);
};
});
}
function _getOriginalConnection(dbInfo) {
return _getConnection(dbInfo, false);
}
function _getUpgradedConnection(dbInfo) {
return _getConnection(dbInfo, true);
}
function _isUpgradeNeeded(dbInfo, defaultVersion) {
if (!dbInfo.db) {
return true;
}
var isNewStore = !dbInfo.db.objectStoreNames.contains(dbInfo.storeName);
var isDowngrade = dbInfo.version < dbInfo.db.version;
var isUpgrade = dbInfo.version > dbInfo.db.version;
if (isDowngrade) {
// If the version is not the default one
// then warn for impossible downgrade.
if (dbInfo.version !== defaultVersion) {
console.warn('The database "' + dbInfo.name + '"' + " can't be downgraded from version " + dbInfo.db.version + ' to version ' + dbInfo.version + '.');
}
// Align the versions to prevent errors.
dbInfo.version = dbInfo.db.version;
}
if (isUpgrade || isNewStore) {
// If the store is new then increment the version (if needed).
// This will trigger an "upgradeneeded" event which is required
// for creating a store.
if (isNewStore) {
var incVersion = dbInfo.db.version + 1;
if (incVersion > dbInfo.version) {
dbInfo.version = incVersion;
}
}
return true;
}
return false;
}
// encode a blob for indexeddb engines that don't support blobs
function _encodeBlob(blob) {
return new Promise$1(function (resolve, reject) {
var reader = new FileReader();
reader.onerror = reject;
reader.onloadend = function (e) {
var base64 = btoa(e.target.result || '');
resolve({
__local_forage_encoded_blob: true,
data: base64,
type: blob.type
});
};
reader.readAsBinaryString(blob);
});
}
// decode an encoded blob
function _decodeBlob(encodedBlob) {
var arrayBuff = _binStringToArrayBuffer(atob(encodedBlob.data));
return createBlob([arrayBuff], { type: encodedBlob.type });
}
// is this one of our fancy encoded blobs?
function _isEncodedBlob(value) {
return value && value.__local_forage_encoded_blob;
}
// Specialize the default `ready()` function by making it dependent
// on the current database operations. Thus, the driver will be actually
// ready when it's been initialized (default) *and* there are no pending
// operations on the database (initiated by some other instances).
function _fullyReady(callback) {
var self = this;
var promise = self._initReady().then(function () {
var dbContext = dbContexts[self._dbInfo.name];
if (dbContext && dbContext.dbReady) {
return dbContext.dbReady;
}
});
executeTwoCallbacks(promise, callback, callback);
return promise;
}
// Try to establish a new db connection to replace the
// current one which is broken (i.e. experiencing
// InvalidStateError while creating a transaction).
function _tryReconnect(dbInfo) {
_deferReadiness(dbInfo);
var dbContext = dbContexts[dbInfo.name];
var forages = dbContext.forages;
for (var i = 0; i < forages.length; i++) {
var forage = forages[i];
if (forage._dbInfo.db) {
forage._dbInfo.db.close();
forage._dbInfo.db = null;
}
}
dbInfo.db = null;
return _getOriginalConnection(dbInfo).then(function (db) {
dbInfo.db = db;
if (_isUpgradeNeeded(dbInfo)) {
// Reopen the database for upgrading.
return _getUpgradedConnection(dbInfo);
}
return db;
}).then(function (db) {
// store the latest db reference
// in case the db was upgraded
dbInfo.db = dbContext.db = db;
for (var i = 0; i < forages.length; i++) {
forages[i]._dbInfo.db = db;
}
})["catch"](function (err) {
_rejectReadiness(dbInfo, err);
throw err;
});
}
// FF doesn't like Promises (micro-tasks) and IDDB store operations,
// so we have to do it with callbacks
function createTransaction(dbInfo, mode, callback, retries) {
if (retries === undefined) {
retries = 1;
}
try {
var tx = dbInfo.db.transaction(dbInfo.storeName, mode);
callback(null, tx);
} catch (err) {
if (retries > 0 && (!dbInfo.db || err.name === 'InvalidStateError' || err.name === 'NotFoundError')) {
return Promise$1.resolve().then(function () {
if (!dbInfo.db || err.name === 'NotFoundError' && !dbInfo.db.objectStoreNames.contains(dbInfo.storeName) && dbInfo.version <= dbInfo.db.version) {
// increase the db version, to create the new ObjectStore
if (dbInfo.db) {
dbInfo.version = dbInfo.db.version + 1;
}
// Reopen the database for upgrading.
return _getUpgradedConnection(dbInfo);
}
}).then(function () {
return _tryReconnect(dbInfo).then(function () {
createTransaction(dbInfo, mode, callback, retries - 1);
});
})["catch"](callback);
}
callback(err);
}
}
function createDbContext() {
return {
// Running localForages sharing a database.
forages: [],
// Shared database.
db: null,
// Database readiness (promise).
dbReady: null,
// Deferred operations on the database.
deferredOperations: []
};
}
// Open the IndexedDB database (automatically creates one if one didn't
// previously exist), using any options set in the config.
function _initStorage(options) {
var self = this;
var dbInfo = {
db: null
};
if (options) {
for (var i in options) {
dbInfo[i] = options[i];
}
}
// Get the current context of the database;
var dbContext = dbContexts[dbInfo.name];
// ...or create a new context.
if (!dbContext) {
dbContext = createDbContext();
// Register the new context in the global container.
dbContexts[dbInfo.name] = dbContext;
}
// Register itself as a running localForage in the current context.
dbContext.forages.push(self);
// Replace the default `ready()` function with the specialized one.
if (!self._initReady) {
self._initReady = self.ready;
self.ready = _fullyReady;
}
// Create an array of initialization states of the related localForages.
var initPromises = [];
function ignoreErrors() {
// Don't handle errors here,
// just makes sure related localForages aren't pending.
return Promise$1.resolve();
}
for (var j = 0; j < dbContext.forages.length; j++) {
var forage = dbContext.forages[j];
if (forage !== self) {
// Don't wait for itself...
initPromises.push(forage._initReady()["catch"](ignoreErrors));
}
}
// Take a snapshot of the related localForages.
var forages = dbContext.forages.slice(0);
// Initialize the connection process only when
// all the related localForages aren't pending.
return Promise$1.all(initPromises).then(function () {
dbInfo.db = dbContext.db;
// Get the connection or open a new one without upgrade.
return _getOriginalConnection(dbInfo);
}).then(function (db) {
dbInfo.db = db;
if (_isUpgradeNeeded(dbInfo, self._defaultConfig.version)) {
// Reopen the database for upgrading.
return _getUpgradedConnection(dbInfo);
}
return db;
}).then(function (db) {
dbInfo.db = dbContext.db = db;
self._dbInfo = dbInfo;
// Share the final connection amongst related localForages.
for (var k = 0; k < forages.length; k++) {
var forage = forages[k];
if (forage !== self) {
// Self is already up-to-date.
forage._dbInfo.db = dbInfo.db;
forage._dbInfo.version = dbInfo.version;
}
}
});
}
function getItem(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_ONLY, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var req = store.get(key);
req.onsuccess = function () {
var value = req.result;
if (value === undefined) {
value = null;
}
if (_isEncodedBlob(value)) {
value = _decodeBlob(value);
}
resolve(value);
};
req.onerror = function () {
reject(req.error);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
// Iterate over all items stored in database.
function iterate(iterator, callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_ONLY, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var req = store.openCursor();
var iterationNumber = 1;
req.onsuccess = function () {
var cursor = req.result;
if (cursor) {
var value = cursor.value;
if (_isEncodedBlob(value)) {
value = _decodeBlob(value);
}
var result = iterator(value, cursor.key, iterationNumber++);
// when the iterator callback returns any
// (non-`undefined`) value, then we stop
// the iteration immediately
if (result !== void 0) {
resolve(result);
} else {
cursor["continue"]();
}
} else {
resolve();
}
};
req.onerror = function () {
reject(req.error);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function setItem(key, value, callback) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
var dbInfo;
self.ready().then(function () {
dbInfo = self._dbInfo;
if (toString.call(value) === '[object Blob]') {
return _checkBlobSupport(dbInfo.db).then(function (blobSupport) {
if (blobSupport) {
return value;
}
return _encodeBlob(value);
});
}
return value;
}).then(function (value) {
createTransaction(self._dbInfo, READ_WRITE, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
// The reason we don't _save_ null is because IE 10 does
// not support saving the `null` type in IndexedDB. How
// ironic, given the bug below!
// See: https://github.com/mozilla/localForage/issues/161
if (value === null) {
value = undefined;
}
var req = store.put(value, key);
transaction.oncomplete = function () {
// Cast to undefined so the value passed to
// callback/promise is the same as what one would get out
// of `getItem()` later. This leads to some weirdness
// (setItem('foo', undefined) will return `null`), but
// it's not my fault localStorage is our baseline and that
// it's weird.
if (value === undefined) {
value = null;
}
resolve(value);
};
transaction.onabort = transaction.onerror = function () {
var err = req.error ? req.error : req.transaction.error;
reject(err);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function removeItem(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_WRITE, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
// We use a Grunt task to make this safe for IE and some
// versions of Android (including those used by Cordova).
// Normally IE won't like `.delete()` and will insist on
// using `['delete']()`, but we have a build step that
// fixes this for us now.
var req = store["delete"](key);
transaction.oncomplete = function () {
resolve();
};
transaction.onerror = function () {
reject(req.error);
};
// The request will be also be aborted if we've exceeded our storage
// space.
transaction.onabort = function () {
var err = req.error ? req.error : req.transaction.error;
reject(err);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function clear(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_WRITE, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var req = store.clear();
transaction.oncomplete = function () {
resolve();
};
transaction.onabort = transaction.onerror = function () {
var err = req.error ? req.error : req.transaction.error;
reject(err);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function length(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_ONLY, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var req = store.count();
req.onsuccess = function () {
resolve(req.result);
};
req.onerror = function () {
reject(req.error);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function key(n, callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
if (n < 0) {
resolve(null);
return;
}
self.ready().then(function () {
createTransaction(self._dbInfo, READ_ONLY, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var advanced = false;
var req = store.openKeyCursor();
req.onsuccess = function () {
var cursor = req.result;
if (!cursor) {
// this means there weren't enough keys
resolve(null);
return;
}
if (n === 0) {
// We have the first key, return it if that's what they
// wanted.
resolve(cursor.key);
} else {
if (!advanced) {
// Otherwise, ask the cursor to skip ahead n
// records.
advanced = true;
cursor.advance(n);
} else {
// When we get here, we've got the nth key.
resolve(cursor.key);
}
}
};
req.onerror = function () {
reject(req.error);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function keys(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
createTransaction(self._dbInfo, READ_ONLY, function (err, transaction) {
if (err) {
return reject(err);
}
try {
var store = transaction.objectStore(self._dbInfo.storeName);
var req = store.openKeyCursor();
var keys = [];
req.onsuccess = function () {
var cursor = req.result;
if (!cursor) {
resolve(keys);
return;
}
keys.push(cursor.key);
cursor["continue"]();
};
req.onerror = function () {
reject(req.error);
};
} catch (e) {
reject(e);
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function dropInstance(options, callback) {
callback = getCallback.apply(this, arguments);
var currentConfig = this.config();
options = typeof options !== 'function' && options || {};
if (!options.name) {
options.name = options.name || currentConfig.name;
options.storeName = options.storeName || currentConfig.storeName;
}
var self = this;
var promise;
if (!options.name) {
promise = Promise$1.reject('Invalid arguments');
} else {
var isCurrentDb = options.name === currentConfig.name && self._dbInfo.db;
var dbPromise = isCurrentDb ? Promise$1.resolve(self._dbInfo.db) : _getOriginalConnection(options).then(function (db) {
var dbContext = dbContexts[options.name];
var forages = dbContext.forages;
dbContext.db = db;
for (var i = 0; i < forages.length; i++) {
forages[i]._dbInfo.db = db;
}
return db;
});
if (!options.storeName) {
promise = dbPromise.then(function (db) {
_deferReadiness(options);
var dbContext = dbContexts[options.name];
var forages = dbContext.forages;
db.close();
for (var i = 0; i < forages.length; i++) {
var forage = forages[i];
forage._dbInfo.db = null;
}
var dropDBPromise = new Promise$1(function (resolve, reject) {
var req = idb.deleteDatabase(options.name);
req.onerror = function () {
var db = req.result;
if (db) {
db.close();
}
reject(req.error);
};
req.onblocked = function () {
// Closing all open connections in onversionchange handler should prevent this situation, but if
// we do get here, it just means the request remains pending - eventually it will succeed or error
console.warn('dropInstance blocked for database "' + options.name + '" until all open connections are closed');
};
req.onsuccess = function () {
var db = req.result;
if (db) {
db.close();
}
resolve(db);
};
});
return dropDBPromise.then(function (db) {
dbContext.db = db;
for (var i = 0; i < forages.length; i++) {
var _forage = forages[i];
_advanceReadiness(_forage._dbInfo);
}
})["catch"](function (err) {
(_rejectReadiness(options, err) || Promise$1.resolve())["catch"](function () {});
throw err;
});
});
} else {
promise = dbPromise.then(function (db) {
if (!db.objectStoreNames.contains(options.storeName)) {
return;
}
var newVersion = db.version + 1;
_deferReadiness(options);
var dbContext = dbContexts[options.name];
var forages = dbContext.forages;
db.close();
for (var i = 0; i < forages.length; i++) {
var forage = forages[i];
forage._dbInfo.db = null;
forage._dbInfo.version = newVersion;
}
var dropObjectPromise = new Promise$1(function (resolve, reject) {
var req = idb.open(options.name, newVersion);
req.onerror = function (err) {
var db = req.result;
db.close();
reject(err);
};
req.onupgradeneeded = function () {
var db = req.result;
db.deleteObjectStore(options.storeName);
};
req.onsuccess = function () {
var db = req.result;
db.close();
resolve(db);
};
});
return dropObjectPromise.then(function (db) {
dbContext.db = db;
for (var j = 0; j < forages.length; j++) {
var _forage2 = forages[j];
_forage2._dbInfo.db = db;
_advanceReadiness(_forage2._dbInfo);
}
})["catch"](function (err) {
(_rejectReadiness(options, err) || Promise$1.resolve())["catch"](function () {});
throw err;
});
});
}
}
executeCallback(promise, callback);
return promise;
}
var asyncStorage = {
_driver: 'asyncStorage',
_initStorage: _initStorage,
_support: isIndexedDBValid(),
iterate: iterate,
getItem: getItem,
setItem: setItem,
removeItem: removeItem,
clear: clear,
length: length,
key: key,
keys: keys,
dropInstance: dropInstance
};
function isWebSQLValid() {
return typeof openDatabase === 'function';
}
// Sadly, the best way to save binary data in WebSQL/localStorage is serializing
// it to Base64, so this is how we store it to prevent very strange errors with less
// verbose ways of binary <-> string data storage.
var BASE_CHARS = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
var BLOB_TYPE_PREFIX = '~~local_forage_type~';
var BLOB_TYPE_PREFIX_REGEX = /^~~local_forage_type~([^~]+)~/;
var SERIALIZED_MARKER = '__lfsc__:';
var SERIALIZED_MARKER_LENGTH = SERIALIZED_MARKER.length;
// OMG the serializations!
var TYPE_ARRAYBUFFER = 'arbf';
var TYPE_BLOB = 'blob';
var TYPE_INT8ARRAY = 'si08';
var TYPE_UINT8ARRAY = 'ui08';
var TYPE_UINT8CLAMPEDARRAY = 'uic8';
var TYPE_INT16ARRAY = 'si16';
var TYPE_INT32ARRAY = 'si32';
var TYPE_UINT16ARRAY = 'ur16';
var TYPE_UINT32ARRAY = 'ui32';
var TYPE_FLOAT32ARRAY = 'fl32';
var TYPE_FLOAT64ARRAY = 'fl64';
var TYPE_SERIALIZED_MARKER_LENGTH = SERIALIZED_MARKER_LENGTH + TYPE_ARRAYBUFFER.length;
var toString$1 = Object.prototype.toString;
function stringToBuffer(serializedString) {
// Fill the string into a ArrayBuffer.
var bufferLength = serializedString.length * 0.75;
var len = serializedString.length;
var i;
var p = 0;
var encoded1, encoded2, encoded3, encoded4;
if (serializedString[serializedString.length - 1] === '=') {
bufferLength--;
if (serializedString[serializedString.length - 2] === '=') {
bufferLength--;
}
}
var buffer = new ArrayBuffer(bufferLength);
var bytes = new Uint8Array(buffer);
for (i = 0; i < len; i += 4) {
encoded1 = BASE_CHARS.indexOf(serializedString[i]);
encoded2 = BASE_CHARS.indexOf(serializedString[i + 1]);
encoded3 = BASE_CHARS.indexOf(serializedString[i + 2]);
encoded4 = BASE_CHARS.indexOf(serializedString[i + 3]);
/*jslint bitwise: true */
bytes[p++] = encoded1 << 2 | encoded2 >> 4;
bytes[p++] = (encoded2 & 15) << 4 | encoded3 >> 2;
bytes[p++] = (encoded3 & 3) << 6 | encoded4 & 63;
}
return buffer;
}
// Converts a buffer to a string to store, serialized, in the backend
// storage library.
function bufferToString(buffer) {
// base64-arraybuffer
var bytes = new Uint8Array(buffer);
var base64String = '';
var i;
for (i = 0; i < bytes.length; i += 3) {
/*jslint bitwise: true */
base64String += BASE_CHARS[bytes[i] >> 2];
base64String += BASE_CHARS[(bytes[i] & 3) << 4 | bytes[i + 1] >> 4];
base64String += BASE_CHARS[(bytes[i + 1] & 15) << 2 | bytes[i + 2] >> 6];
base64String += BASE_CHARS[bytes[i + 2] & 63];
}
if (bytes.length % 3 === 2) {
base64String = base64String.substring(0, base64String.length - 1) + '=';
} else if (bytes.length % 3 === 1) {
base64String = base64String.substring(0, base64String.length - 2) + '==';
}
return base64String;
}
// Serialize a value, afterwards executing a callback (which usually
// instructs the `setItem()` callback/promise to be executed). This is how
// we store binary data with localStorage.
function serialize(value, callback) {
var valueType = '';
if (value) {
valueType = toString$1.call(value);
}
// Cannot use `value instanceof ArrayBuffer` or such here, as these
// checks fail when running the tests using casper.js...
//
// TODO: See why those tests fail and use a better solution.
if (value && (valueType === '[object ArrayBuffer]' || value.buffer && toString$1.call(value.buffer) === '[object ArrayBuffer]')) {
// Convert binary arrays to a string and prefix the string with
// a special marker.
var buffer;
var marker = SERIALIZED_MARKER;
if (value instanceof ArrayBuffer) {
buffer = value;
marker += TYPE_ARRAYBUFFER;
} else {
buffer = value.buffer;
if (valueType === '[object Int8Array]') {
marker += TYPE_INT8ARRAY;
} else if (valueType === '[object Uint8Array]') {
marker += TYPE_UINT8ARRAY;
} else if (valueType === '[object Uint8ClampedArray]') {
marker += TYPE_UINT8CLAMPEDARRAY;
} else if (valueType === '[object Int16Array]') {
marker += TYPE_INT16ARRAY;
} else if (valueType === '[object Uint16Array]') {
marker += TYPE_UINT16ARRAY;
} else if (valueType === '[object Int32Array]') {
marker += TYPE_INT32ARRAY;
} else if (valueType === '[object Uint32Array]') {
marker += TYPE_UINT32ARRAY;
} else if (valueType === '[object Float32Array]') {
marker += TYPE_FLOAT32ARRAY;
} else if (valueType === '[object Float64Array]') {
marker += TYPE_FLOAT64ARRAY;
} else {
callback(new Error('Failed to get type for BinaryArray'));
}
}
callback(marker + bufferToString(buffer));
} else if (valueType === '[object Blob]') {
// Conver the blob to a binaryArray and then to a string.
var fileReader = new FileReader();
fileReader.onload = function () {
// Backwards-compatible prefix for the blob type.
var str = BLOB_TYPE_PREFIX + value.type + '~' + bufferToString(this.result);
callback(SERIALIZED_MARKER + TYPE_BLOB + str);
};
fileReader.readAsArrayBuffer(value);
} else {
try {
callback(JSON.stringify(value));
} catch (e) {
console.error("Couldn't convert value into a JSON string: ", value);
callback(null, e);
}
}
}
// Deserialize data we've inserted into a value column/field. We place
// special markers into our strings to mark them as encoded; this isn't
// as nice as a meta field, but it's the only sane thing we can do whilst
// keeping localStorage support intact.
//
// Oftentimes this will just deserialize JSON content, but if we have a
// special marker (SERIALIZED_MARKER, defined above), we will extract
// some kind of arraybuffer/binary data/typed array out of the string.
function deserialize(value) {
// If we haven't marked this string as being specially serialized (i.e.
// something other than serialized JSON), we can just return it and be
// done with it.
if (value.substring(0, SERIALIZED_MARKER_LENGTH) !== SERIALIZED_MARKER) {
return JSON.parse(value);
}
// The following code deals with deserializing some kind of Blob or
// TypedArray. First we separate out the type of data we're dealing
// with from the data itself.
var serializedString = value.substring(TYPE_SERIALIZED_MARKER_LENGTH);
var type = value.substring(SERIALIZED_MARKER_LENGTH, TYPE_SERIALIZED_MARKER_LENGTH);
var blobType;
// Backwards-compatible blob type serialization strategy.
// DBs created with older versions of localForage will simply not have the blob type.
if (type === TYPE_BLOB && BLOB_TYPE_PREFIX_REGEX.test(serializedString)) {
var matcher = serializedString.match(BLOB_TYPE_PREFIX_REGEX);
blobType = matcher[1];
serializedString = serializedString.substring(matcher[0].length);
}
var buffer = stringToBuffer(serializedString);
// Return the right type based on the code/type set during
// serialization.
switch (type) {
case TYPE_ARRAYBUFFER:
return buffer;
case TYPE_BLOB:
return createBlob([buffer], { type: blobType });
case TYPE_INT8ARRAY:
return new Int8Array(buffer);
case TYPE_UINT8ARRAY:
return new Uint8Array(buffer);
case TYPE_UINT8CLAMPEDARRAY:
return new Uint8ClampedArray(buffer);
case TYPE_INT16ARRAY:
return new Int16Array(buffer);
case TYPE_UINT16ARRAY:
return new Uint16Array(buffer);
case TYPE_INT32ARRAY:
return new Int32Array(buffer);
case TYPE_UINT32ARRAY:
return new Uint32Array(buffer);
case TYPE_FLOAT32ARRAY:
return new Float32Array(buffer);
case TYPE_FLOAT64ARRAY:
return new Float64Array(buffer);
default:
throw new Error('Unkown type: ' + type);
}
}
var localforageSerializer = {
serialize: serialize,
deserialize: deserialize,
stringToBuffer: stringToBuffer,
bufferToString: bufferToString
};
/*
* Includes code from:
*
* base64-arraybuffer
* https://github.com/niklasvh/base64-arraybuffer
*
* Copyright (c) 2012 Niklas von Hertzen
* Licensed under the MIT license.
*/
function createDbTable(t, dbInfo, callback, errorCallback) {
t.executeSql('CREATE TABLE IF NOT EXISTS ' + dbInfo.storeName + ' ' + '(id INTEGER PRIMARY KEY, key unique, value)', [], callback, errorCallback);
}
// Open the WebSQL database (automatically creates one if one didn't
// previously exist), using any options set in the config.
function _initStorage$1(options) {
var self = this;
var dbInfo = {
db: null
};
if (options) {
for (var i in options) {
dbInfo[i] = typeof options[i] !== 'string' ? options[i].toString() : options[i];
}
}
var dbInfoPromise = new Promise$1(function (resolve, reject) {
// Open the database; the openDatabase API will automatically
// create it for us if it doesn't exist.
try {
dbInfo.db = openDatabase(dbInfo.name, String(dbInfo.version), dbInfo.description, dbInfo.size);
} catch (e) {
return reject(e);
}
// Create our key/value table if it doesn't exist.
dbInfo.db.transaction(function (t) {
createDbTable(t, dbInfo, function () {
self._dbInfo = dbInfo;
resolve();
}, function (t, error) {
reject(error);
});
}, reject);
});
dbInfo.serializer = localforageSerializer;
return dbInfoPromise;
}
function tryExecuteSql(t, dbInfo, sqlStatement, args, callback, errorCallback) {
t.executeSql(sqlStatement, args, callback, function (t, error) {
if (error.code === error.SYNTAX_ERR) {
t.executeSql('SELECT name FROM sqlite_master ' + "WHERE type='table' AND name = ?", [dbInfo.storeName], function (t, results) {
if (!results.rows.length) {
// if the table is missing (was deleted)
// re-create it table and retry
createDbTable(t, dbInfo, function () {
t.executeSql(sqlStatement, args, callback, errorCallback);
}, errorCallback);
} else {
errorCallback(t, error);
}
}, errorCallback);
} else {
errorCallback(t, error);
}
}, errorCallback);
}
function getItem$1(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'SELECT * FROM ' + dbInfo.storeName + ' WHERE key = ? LIMIT 1', [key], function (t, results) {
var result = results.rows.length ? results.rows.item(0).value : null;
// Check to see if this is serialized content we need to
// unpack.
if (result) {
result = dbInfo.serializer.deserialize(result);
}
resolve(result);
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function iterate$1(iterator, callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'SELECT * FROM ' + dbInfo.storeName, [], function (t, results) {
var rows = results.rows;
var length = rows.length;
for (var i = 0; i < length; i++) {
var item = rows.item(i);
var result = item.value;
// Check to see if this is serialized content
// we need to unpack.
if (result) {
result = dbInfo.serializer.deserialize(result);
}
result = iterator(result, item.key, i + 1);
// void(0) prevents problems with redefinition
// of `undefined`.
if (result !== void 0) {
resolve(result);
return;
}
}
resolve();
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function _setItem(key, value, callback, retriesLeft) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
// The localStorage API doesn't return undefined values in an
// "expected" way, so undefined is always cast to null in all
// drivers. See: https://github.com/mozilla/localForage/pull/42
if (value === undefined) {
value = null;
}
// Save the original value to pass to the callback.
var originalValue = value;
var dbInfo = self._dbInfo;
dbInfo.serializer.serialize(value, function (value, error) {
if (error) {
reject(error);
} else {
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'INSERT OR REPLACE INTO ' + dbInfo.storeName + ' ' + '(key, value) VALUES (?, ?)', [key, value], function () {
resolve(originalValue);
}, function (t, error) {
reject(error);
});
}, function (sqlError) {
// The transaction failed; check
// to see if it's a quota error.
if (sqlError.code === sqlError.QUOTA_ERR) {
// We reject the callback outright for now, but
// it's worth trying to re-run the transaction.
// Even if the user accepts the prompt to use
// more storage on Safari, this error will
// be called.
//
// Try to re-run the transaction.
if (retriesLeft > 0) {
resolve(_setItem.apply(self, [key, originalValue, callback, retriesLeft - 1]));
return;
}
reject(sqlError);
}
});
}
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function setItem$1(key, value, callback) {
return _setItem.apply(this, [key, value, callback, 1]);
}
function removeItem$1(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'DELETE FROM ' + dbInfo.storeName + ' WHERE key = ?', [key], function () {
resolve();
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
// Deletes every item in the table.
// TODO: Find out if this resets the AUTO_INCREMENT number.
function clear$1(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'DELETE FROM ' + dbInfo.storeName, [], function () {
resolve();
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
// Does a simple `COUNT(key)` to get the number of items stored in
// localForage.
function length$1(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
// Ahhh, SQL makes this one soooooo easy.
tryExecuteSql(t, dbInfo, 'SELECT COUNT(key) as c FROM ' + dbInfo.storeName, [], function (t, results) {
var result = results.rows.item(0).c;
resolve(result);
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
// Return the key located at key index X; essentially gets the key from a
// `WHERE id = ?`. This is the most efficient way I can think to implement
// this rarely-used (in my experience) part of the API, but it can seem
// inconsistent, because we do `INSERT OR REPLACE INTO` on `setItem()`, so
// the ID of each key will change every time it's updated. Perhaps a stored
// procedure for the `setItem()` SQL would solve this problem?
// TODO: Don't change ID on `setItem()`.
function key$1(n, callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'SELECT key FROM ' + dbInfo.storeName + ' WHERE id = ? LIMIT 1', [n + 1], function (t, results) {
var result = results.rows.length ? results.rows.item(0).key : null;
resolve(result);
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
function keys$1(callback) {
var self = this;
var promise = new Promise$1(function (resolve, reject) {
self.ready().then(function () {
var dbInfo = self._dbInfo;
dbInfo.db.transaction(function (t) {
tryExecuteSql(t, dbInfo, 'SELECT key FROM ' + dbInfo.storeName, [], function (t, results) {
var keys = [];
for (var i = 0; i < results.rows.length; i++) {
keys.push(results.rows.item(i).key);
}
resolve(keys);
}, function (t, error) {
reject(error);
});
});
})["catch"](reject);
});
executeCallback(promise, callback);
return promise;
}
// https://www.w3.org/TR/webdatabase/#databases
// > There is no way to enumerate or delete the databases available for an origin from this API.
function getAllStoreNames(db) {
return new Promise$1(function (resolve, reject) {
db.transaction(function (t) {
t.executeSql('SELECT name FROM sqlite_master ' + "WHERE type='table' AND name <> '__WebKitDatabaseInfoTable__'", [], function (t, results) {
var storeNames = [];
for (var i = 0; i < results.rows.length; i++) {
storeNames.push(results.rows.item(i).name);
}
resolve({
db: db,
storeNames: storeNames
});
}, function (t, error) {
reject(error);
});
}, function (sqlError) {
reject(sqlError);
});
});
}
function dropInstance$1(options, callback) {
callback = getCallback.apply(this, arguments);
var currentConfig = this.config();
options = typeof options !== 'function' && options || {};
if (!options.name) {
options.name = options.name || currentConfig.name;
options.storeName = options.storeName || currentConfig.storeName;
}
var self = this;
var promise;
if (!options.name) {
promise = Promise$1.reject('Invalid arguments');
} else {
promise = new Promise$1(function (resolve) {
var db;
if (options.name === currentConfig.name) {
// use the db reference of the current instance
db = self._dbInfo.db;
} else {
db = openDatabase(options.name, '', '', 0);
}
if (!options.storeName) {
// drop all database tables
resolve(getAllStoreNames(db));
} else {
resolve({
db: db,
storeNames: [options.storeName]
});
}
}).then(function (operationInfo) {
return new Promise$1(function (resolve, reject) {
operationInfo.db.transaction(function (t) {
function dropTable(storeName) {
return new Promise$1(function (resolve, reject) {
t.executeSql('DROP TABLE IF EXISTS ' + storeName, [], function () {
resolve();
}, function (t, error) {
reject(error);
});
});
}
var operations = [];
for (var i = 0, len = operationInfo.storeNames.length; i < len; i++) {
operations.push(dropTable(operationInfo.storeNames[i]));
}
Promise$1.all(operations).then(function () {
resolve();
})["catch"](function (e) {
reject(e);
});
}, function (sqlError) {
reject(sqlError);
});
});
});
}
executeCallback(promise, callback);
return promise;
}
var webSQLStorage = {
_driver: 'webSQLStorage',
_initStorage: _initStorage$1,
_support: isWebSQLValid(),
iterate: iterate$1,
getItem: getItem$1,
setItem: setItem$1,
removeItem: removeItem$1,
clear: clear$1,
length: length$1,
key: key$1,
keys: keys$1,
dropInstance: dropInstance$1
};
function isLocalStorageValid() {
try {
return typeof localStorage !== 'undefined' && 'setItem' in localStorage &&
// in IE8 typeof localStorage.setItem === 'object'
!!localStorage.setItem;
} catch (e) {
return false;
}
}
function _getKeyPrefix(options, defaultConfig) {
var keyPrefix = options.name + '/';
if (options.storeName !== defaultConfig.storeName) {
keyPrefix += options.storeName + '/';
}
return keyPrefix;
}
// Check if localStorage throws when saving an item
function checkIfLocalStorageThrows() {
var localStorageTestKey = '_localforage_support_test';
try {
localStorage.setItem(localStorageTestKey, true);
localStorage.removeItem(localStorageTestKey);
return false;
} catch (e) {
return true;
}
}
// Check if localStorage is usable and allows to save an item
// This method checks if localStorage is usable in Safari Private Browsing
// mode, or in any other case where the available quota for localStorage
// is 0 and there wasn't any saved items yet.
function _isLocalStorageUsable() {
return !checkIfLocalStorageThrows() || localStorage.length > 0;
}
// Config the localStorage backend, using options set in the config.
function _initStorage$2(options) {
var self = this;
var dbInfo = {};
if (options) {
for (var i in options) {
dbInfo[i] = options[i];
}
}
dbInfo.keyPrefix = _getKeyPrefix(options, self._defaultConfig);
if (!_isLocalStorageUsable()) {
return Promise$1.reject();
}
self._dbInfo = dbInfo;
dbInfo.serializer = localforageSerializer;
return Promise$1.resolve();
}
// Remove all keys from the datastore, effectively destroying all data in
// the app's key/value store!
function clear$2(callback) {
var self = this;
var promise = self.ready().then(function () {
var keyPrefix = self._dbInfo.keyPrefix;
for (var i = localStorage.length - 1; i >= 0; i--) {
var key = localStorage.key(i);
if (key.indexOf(keyPrefix) === 0) {
localStorage.removeItem(key);
}
}
});
executeCallback(promise, callback);
return promise;
}
// Retrieve an item from the store. Unlike the original async_storage
// library in Gaia, we don't modify return values at all. If a key's value
// is `undefined`, we pass that value to the callback function.
function getItem$2(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = self.ready().then(function () {
var dbInfo = self._dbInfo;
var result = localStorage.getItem(dbInfo.keyPrefix + key);
// If a result was found, parse it from the serialized
// string into a JS object. If result isn't truthy, the key
// is likely undefined and we'll pass it straight to the
// callback.
if (result) {
result = dbInfo.serializer.deserialize(result);
}
return result;
});
executeCallback(promise, callback);
return promise;
}
// Iterate over all items in the store.
function iterate$2(iterator, callback) {
var self = this;
var promise = self.ready().then(function () {
var dbInfo = self._dbInfo;
var keyPrefix = dbInfo.keyPrefix;
var keyPrefixLength = keyPrefix.length;
var length = localStorage.length;
// We use a dedicated iterator instead of the `i` variable below
// so other keys we fetch in localStorage aren't counted in
// the `iterationNumber` argument passed to the `iterate()`
// callback.
//
// See: github.com/mozilla/localForage/pull/435#discussion_r38061530
var iterationNumber = 1;
for (var i = 0; i < length; i++) {
var key = localStorage.key(i);
if (key.indexOf(keyPrefix) !== 0) {
continue;
}
var value = localStorage.getItem(key);
// If a result was found, parse it from the serialized
// string into a JS object. If result isn't truthy, the
// key is likely undefined and we'll pass it straight
// to the iterator.
if (value) {
value = dbInfo.serializer.deserialize(value);
}
value = iterator(value, key.substring(keyPrefixLength), iterationNumber++);
if (value !== void 0) {
return value;
}
}
});
executeCallback(promise, callback);
return promise;
}
// Same as localStorage's key() method, except takes a callback.
function key$2(n, callback) {
var self = this;
var promise = self.ready().then(function () {
var dbInfo = self._dbInfo;
var result;
try {
result = localStorage.key(n);
} catch (error) {
result = null;
}
// Remove the prefix from the key, if a key is found.
if (result) {
result = result.substring(dbInfo.keyPrefix.length);
}
return result;
});
executeCallback(promise, callback);
return promise;
}
function keys$2(callback) {
var self = this;
var promise = self.ready().then(function () {
var dbInfo = self._dbInfo;
var length = localStorage.length;
var keys = [];
for (var i = 0; i < length; i++) {
var itemKey = localStorage.key(i);
if (itemKey.indexOf(dbInfo.keyPrefix) === 0) {
keys.push(itemKey.substring(dbInfo.keyPrefix.length));
}
}
return keys;
});
executeCallback(promise, callback);
return promise;
}
// Supply the number of keys in the datastore to the callback function.
function length$2(callback) {
var self = this;
var promise = self.keys().then(function (keys) {
return keys.length;
});
executeCallback(promise, callback);
return promise;
}
// Remove an item from the store, nice and simple.
function removeItem$2(key, callback) {
var self = this;
key = normalizeKey(key);
var promise = self.ready().then(function () {
var dbInfo = self._dbInfo;
localStorage.removeItem(dbInfo.keyPrefix + key);
});
executeCallback(promise, callback);
return promise;
}
// Set a key's value and run an optional callback once the value is set.
// Unlike Gaia's implementation, the callback function is passed the value,
// in case you want to operate on that value only after you're sure it
// saved, or something like that.
function setItem$2(key, value, callback) {
var self = this;
key = normalizeKey(key);
var promise = self.ready().then(function () {
// Convert undefined values to null.
// https://github.com/mozilla/localForage/pull/42
if (value === undefined) {
value = null;
}
// Save the original value to pass to the callback.
var originalValue = value;
return new Promise$1(function (resolve, reject) {
var dbInfo = self._dbInfo;
dbInfo.serializer.serialize(value, function (value, error) {
if (error) {
reject(error);
} else {
try {
localStorage.setItem(dbInfo.keyPrefix + key, value);
resolve(originalValue);
} catch (e) {
// localStorage capacity exceeded.
// TODO: Make this a specific error/event.
if (e.name === 'QuotaExceededError' || e.name === 'NS_ERROR_DOM_QUOTA_REACHED') {
reject(e);
}
reject(e);
}
}
});
});
});
executeCallback(promise, callback);
return promise;
}
function dropInstance$2(options, callback) {
callback = getCallback.apply(this, arguments);
options = typeof options !== 'function' && options || {};
if (!options.name) {
var currentConfig = this.config();
options.name = options.name || currentConfig.name;
options.storeName = options.storeName || currentConfig.storeName;
}
var self = this;
var promise;
if (!options.name) {
promise = Promise$1.reject('Invalid arguments');
} else {
promise = new Promise$1(function (resolve) {
if (!options.storeName) {
resolve(options.name + '/');
} else {
resolve(_getKeyPrefix(options, self._defaultConfig));
}
}).then(function (keyPrefix) {
for (var i = localStorage.length - 1; i >= 0; i--) {
var key = localStorage.key(i);
if (key.indexOf(keyPrefix) === 0) {
localStorage.removeItem(key);
}
}
});
}
executeCallback(promise, callback);
return promise;
}
var localStorageWrapper = {
_driver: 'localStorageWrapper',
_initStorage: _initStorage$2,
_support: isLocalStorageValid(),
iterate: iterate$2,
getItem: getItem$2,
setItem: setItem$2,
removeItem: removeItem$2,
clear: clear$2,
length: length$2,
key: key$2,
keys: keys$2,
dropInstance: dropInstance$2
};
var sameValue = function sameValue(x, y) {
return x === y || typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y);
};
var includes = function includes(array, searchElement) {
var len = array.length;
var i = 0;
while (i < len) {
if (sameValue(array[i], searchElement)) {
return true;
}
i++;
}
return false;
};
var isArray = Array.isArray || function (arg) {
return Object.prototype.toString.call(arg) === '[object Array]';
};
// Drivers are stored here when `defineDriver()` is called.
// They are shared across all instances of localForage.
var DefinedDrivers = {};
var DriverSupport = {};
var DefaultDrivers = {
INDEXEDDB: asyncStorage,
WEBSQL: webSQLStorage,
LOCALSTORAGE: localStorageWrapper
};
var DefaultDriverOrder = [DefaultDrivers.INDEXEDDB._driver, DefaultDrivers.WEBSQL._driver, DefaultDrivers.LOCALSTORAGE._driver];
var OptionalDriverMethods = ['dropInstance'];
var LibraryMethods = ['clear', 'getItem', 'iterate', 'key', 'keys', 'length', 'removeItem', 'setItem'].concat(OptionalDriverMethods);
var DefaultConfig = {
description: '',
driver: DefaultDriverOrder.slice(),
name: 'localforage',
// Default DB size is _JUST UNDER_ 5MB, as it's the highest size
// we can use without a prompt.
size: 4980736,
storeName: 'keyvaluepairs',
version: 1.0
};
function callWhenReady(localForageInstance, libraryMethod) {
localForageInstance[libraryMethod] = function () {
var _args = arguments;
return localForageInstance.ready().then(function () {
return localForageInstance[libraryMethod].apply(localForageInstance, _args);
});
};
}
function extend() {
for (var i = 1; i < arguments.length; i++) {
var arg = arguments[i];
if (arg) {
for (var _key in arg) {
if (arg.hasOwnProperty(_key)) {
if (isArray(arg[_key])) {
arguments[0][_key] = arg[_key].slice();
} else {
arguments[0][_key] = arg[_key];
}
}
}
}
}
return arguments[0];
}
var LocalForage = function () {
function LocalForage(options) {
_classCallCheck(this, LocalForage);
for (var driverTypeKey in DefaultDrivers) {
if (DefaultDrivers.hasOwnProperty(driverTypeKey)) {
var driver = DefaultDrivers[driverTypeKey];
var driverName = driver._driver;
this[driverTypeKey] = driverName;
if (!DefinedDrivers[driverName]) {
// we don't need to wait for the promise,
// since the default drivers can be defined
// in a blocking manner
this.defineDriver(driver);
}
}
}
this._defaultConfig = extend({}, DefaultConfig);
this._config = extend({}, this._defaultConfig, options);
this._driverSet = null;
this._initDriver = null;
this._ready = false;
this._dbInfo = null;
this._wrapLibraryMethodsWithReady();
this.setDriver(this._config.driver)["catch"](function () {});
}
// Set any config values for localForage; can be called anytime before
// the first API call (e.g. `getItem`, `setItem`).
// We loop through options so we don't overwrite existing config
// values.
LocalForage.prototype.config = function config(options) {
// If the options argument is an object, we use it to set values.
// Otherwise, we return either a specified config value or all
// config values.
if ((typeof options === 'undefined' ? 'undefined' : _typeof(options)) === 'object') {
// If localforage is ready and fully initialized, we can't set
// any new configuration values. Instead, we return an error.
if (this._ready) {
return new Error("Can't call config() after localforage " + 'has been used.');
}
for (var i in options) {
if (i === 'storeName') {
options[i] = options[i].replace(/\W/g, '_');
}
if (i === 'version' && typeof options[i] !== 'number') {
return new Error('Database version must be a number.');
}
this._config[i] = options[i];
}
// after all config options are set and
// the driver option is used, try setting it
if ('driver' in options && options.driver) {
return this.setDriver(this._config.driver);
}
return true;
} else if (typeof options === 'string') {
return this._config[options];
} else {
return this._config;
}
};
// Used to define a custom driver, shared across all instances of
// localForage.
LocalForage.prototype.defineDriver = function defineDriver(driverObject, callback, errorCallback) {
var promise = new Promise$1(function (resolve, reject) {
try {
var driverName = driverObject._driver;
var complianceError = new Error('Custom driver not compliant; see ' + 'https://mozilla.github.io/localForage/#definedriver');
// A driver name should be defined and not overlap with the
// library-defined, default drivers.
if (!driverObject._driver) {
reject(complianceError);
return;
}
var driverMethods = LibraryMethods.concat('_initStorage');
for (var i = 0, len = driverMethods.length; i < len; i++) {
var driverMethodName = driverMethods[i];
// when the property is there,
// it should be a method even when optional
var isRequired = !includes(OptionalDriverMethods, driverMethodName);
if ((isRequired || driverObject[driverMethodName]) && typeof driverObject[driverMethodName] !== 'function') {
reject(complianceError);
return;
}
}
var configureMissingMethods = function configureMissingMethods() {
var methodNotImplementedFactory = function methodNotImplementedFactory(methodName) {
return function () {
var error = new Error('Method ' + methodName + ' is not implemented by the current driver');
var promise = Promise$1.reject(error);
executeCallback(promise, arguments[arguments.length - 1]);
return promise;
};
};
for (var _i = 0, _len = OptionalDriverMethods.length; _i < _len; _i++) {
var optionalDriverMethod = OptionalDriverMethods[_i];
if (!driverObject[optionalDriverMethod]) {
driverObject[optionalDriverMethod] = methodNotImplementedFactory(optionalDriverMethod);
}
}
};
configureMissingMethods();
var setDriverSupport = function setDriverSupport(support) {
if (DefinedDrivers[driverName]) {
console.info('Redefining LocalForage driver: ' + driverName);
}
DefinedDrivers[driverName] = driverObject;
DriverSupport[driverName] = support;
// don't use a then, so that we can define
// drivers that have simple _support methods
// in a blocking manner
resolve();
};
if ('_support' in driverObject) {
if (driverObject._support && typeof driverObject._support === 'function') {
driverObject._support().then(setDriverSupport, reject);
} else {
setDriverSupport(!!driverObject._support);
}
} else {
setDriverSupport(true);
}
} catch (e) {
reject(e);
}
});
executeTwoCallbacks(promise, callback, errorCallback);
return promise;
};
LocalForage.prototype.driver = function driver() {
return this._driver || null;
};
LocalForage.prototype.getDriver = function getDriver(driverName, callback, errorCallback) {
var getDriverPromise = DefinedDrivers[driverName] ? Promise$1.resolve(DefinedDrivers[driverName]) : Promise$1.reject(new Error('Driver not found.'));
executeTwoCallbacks(getDriverPromise, callback, errorCallback);
return getDriverPromise;
};
LocalForage.prototype.getSerializer = function getSerializer(callback) {
var serializerPromise = Promise$1.resolve(localforageSerializer);
executeTwoCallbacks(serializerPromise, callback);
return serializerPromise;
};
LocalForage.prototype.ready = function ready(callback) {
var self = this;
var promise = self._driverSet.then(function () {
if (self._ready === null) {
self._ready = self._initDriver();
}
return self._ready;
});
executeTwoCallbacks(promise, callback, callback);
return promise;
};
LocalForage.prototype.setDriver = function setDriver(drivers, callback, errorCallback) {
var self = this;
if (!isArray(drivers)) {
drivers = [drivers];
}
var supportedDrivers = this._getSupportedDrivers(drivers);
function setDriverToConfig() {
self._config.driver = self.driver();
}
function extendSelfWithDriver(driver) {
self._extend(driver);
setDriverToConfig();
self._ready = self._initStorage(self._config);
return self._ready;
}
function initDriver(supportedDrivers) {
return function () {
var currentDriverIndex = 0;
function driverPromiseLoop() {
while (currentDriverIndex < supportedDrivers.length) {
var driverName = supportedDrivers[currentDriverIndex];
currentDriverIndex++;
self._dbInfo = null;
self._ready = null;
return self.getDriver(driverName).then(extendSelfWithDriver)["catch"](driverPromiseLoop);
}
setDriverToConfig();
var error = new Error('No available storage method found.');
self._driverSet = Promise$1.reject(error);
return self._driverSet;
}
return driverPromiseLoop();
};
}
// There might be a driver initialization in progress
// so wait for it to finish in order to avoid a possible
// race condition to set _dbInfo
var oldDriverSetDone = this._driverSet !== null ? this._driverSet["catch"](function () {
return Promise$1.resolve();
}) : Promise$1.resolve();
this._driverSet = oldDriverSetDone.then(function () {
var driverName = supportedDrivers[0];
self._dbInfo = null;
self._ready = null;
return self.getDriver(driverName).then(function (driver) {
self._driver = driver._driver;
setDriverToConfig();
self._wrapLibraryMethodsWithReady();
self._initDriver = initDriver(supportedDrivers);
});
})["catch"](function () {
setDriverToConfig();
var error = new Error('No available storage method found.');
self._driverSet = Promise$1.reject(error);
return self._driverSet;
});
executeTwoCallbacks(this._driverSet, callback, errorCallback);
return this._driverSet;
};
LocalForage.prototype.supports = function supports(driverName) {
return !!DriverSupport[driverName];
};
LocalForage.prototype._extend = function _extend(libraryMethodsAndProperties) {
extend(this, libraryMethodsAndProperties);
};
LocalForage.prototype._getSupportedDrivers = function _getSupportedDrivers(drivers) {
var supportedDrivers = [];
for (var i = 0, len = drivers.length; i < len; i++) {
var driverName = drivers[i];
if (this.supports(driverName)) {
supportedDrivers.push(driverName);
}
}
return supportedDrivers;
};
LocalForage.prototype._wrapLibraryMethodsWithReady = function _wrapLibraryMethodsWithReady() {
// Add a stub for each driver API method that delays the call to the
// corresponding driver method until localForage is ready. These stubs
// will be replaced by the driver methods as soon as the driver is
// loaded, so there is no performance impact.
for (var i = 0, len = LibraryMethods.length; i < len; i++) {
callWhenReady(this, LibraryMethods[i]);
}
};
LocalForage.prototype.createInstance = function createInstance(options) {
return new LocalForage(options);
};
return LocalForage;
}();
// The actual localForage object that we expose as a module or via a
// global. It's extended by pulling in one of our other libraries.
var localforage_js = new LocalForage();
module.exports = localforage_js;
},{"3":3}]},{},[4])(4)
});
} (localforage$1));
const localforage = localforageExports;
var KEY_PREFIX = 'persist:';
var FLUSH = 'persist/FLUSH';
var REHYDRATE = 'persist/REHYDRATE';
var PAUSE = 'persist/PAUSE';
var PERSIST = 'persist/PERSIST';
var PURGE = 'persist/PURGE';
var REGISTER = 'persist/REGISTER';
var DEFAULT_VERSION = -1;
function _typeof$1(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); }
function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(source, true).forEach(function (key) { _defineProperty$5(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty$5(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/*
autoMergeLevel1:
- merges 1 level of substate
- skips substate if already modified
*/
function autoMergeLevel1(inboundState, originalState, reducedState, _ref) {
_ref.debug;
var newState = _objectSpread$4({}, reducedState); // only rehydrate if inboundState exists and is an object
if (inboundState && _typeof$1(inboundState) === 'object') {
Object.keys(inboundState).forEach(function (key) {
// ignore _persist data
if (key === '_persist') return; // if reducer modifies substate, skip auto rehydration
if (originalState[key] !== reducedState[key]) {
return;
} // otherwise hard set the new value
newState[key] = inboundState[key];
});
}
return newState;
}
// @TODO remove once flow < 0.63 support is no longer required.
function createPersistoid(config) {
// defaults
var blacklist = config.blacklist || null;
var whitelist = config.whitelist || null;
var transforms = config.transforms || [];
var throttle = config.throttle || 0;
var storageKey = "".concat(config.keyPrefix !== undefined ? config.keyPrefix : KEY_PREFIX).concat(config.key);
var storage = config.storage;
var serialize;
if (config.serialize === false) {
serialize = function serialize(x) {
return x;
};
} else if (typeof config.serialize === 'function') {
serialize = config.serialize;
} else {
serialize = defaultSerialize;
}
var writeFailHandler = config.writeFailHandler || null; // initialize stateful values
var lastState = {};
var stagedState = {};
var keysToProcess = [];
var timeIterator = null;
var writePromise = null;
var update = function update(state) {
// add any changed keys to the queue
Object.keys(state).forEach(function (key) {
if (!passWhitelistBlacklist(key)) return; // is keyspace ignored? noop
if (lastState[key] === state[key]) return; // value unchanged? noop
if (keysToProcess.indexOf(key) !== -1) return; // is key already queued? noop
keysToProcess.push(key); // add key to queue
}); //if any key is missing in the new state which was present in the lastState,
//add it for processing too
Object.keys(lastState).forEach(function (key) {
if (state[key] === undefined && passWhitelistBlacklist(key) && keysToProcess.indexOf(key) === -1 && lastState[key] !== undefined) {
keysToProcess.push(key);
}
}); // start the time iterator if not running (read: throttle)
if (timeIterator === null) {
timeIterator = setInterval(processNextKey, throttle);
}
lastState = state;
};
function processNextKey() {
if (keysToProcess.length === 0) {
if (timeIterator) clearInterval(timeIterator);
timeIterator = null;
return;
}
var key = keysToProcess.shift();
var endState = transforms.reduce(function (subState, transformer) {
return transformer.in(subState, key, lastState);
}, lastState[key]);
if (endState !== undefined) {
try {
stagedState[key] = serialize(endState);
} catch (err) {
console.error('redux-persist/createPersistoid: error serializing state', err);
}
} else {
//if the endState is undefined, no need to persist the existing serialized content
delete stagedState[key];
}
if (keysToProcess.length === 0) {
writeStagedState();
}
}
function writeStagedState() {
// cleanup any removed keys just before write.
Object.keys(stagedState).forEach(function (key) {
if (lastState[key] === undefined) {
delete stagedState[key];
}
});
writePromise = storage.setItem(storageKey, serialize(stagedState)).catch(onWriteFail);
}
function passWhitelistBlacklist(key) {
if (whitelist && whitelist.indexOf(key) === -1 && key !== '_persist') return false;
if (blacklist && blacklist.indexOf(key) !== -1) return false;
return true;
}
function onWriteFail(err) {
// @TODO add fail handlers (typically storage full)
if (writeFailHandler) writeFailHandler(err);
if (err && "production" !== 'production') {
console.error('Error storing data', err);
}
}
var flush = function flush() {
while (keysToProcess.length !== 0) {
processNextKey();
}
return writePromise || Promise.resolve();
}; // return `persistoid`
return {
update: update,
flush: flush
};
} // @NOTE in the future this may be exposed via config
function defaultSerialize(data) {
return JSON.stringify(data);
}
function getStoredState(config) {
var transforms = config.transforms || [];
var storageKey = "".concat(config.keyPrefix !== undefined ? config.keyPrefix : KEY_PREFIX).concat(config.key);
var storage = config.storage;
config.debug;
var deserialize;
if (config.deserialize === false) {
deserialize = function deserialize(x) {
return x;
};
} else if (typeof config.deserialize === 'function') {
deserialize = config.deserialize;
} else {
deserialize = defaultDeserialize;
}
return storage.getItem(storageKey).then(function (serialized) {
if (!serialized) return undefined;else {
try {
var state = {};
var rawState = deserialize(serialized);
Object.keys(rawState).forEach(function (key) {
state[key] = transforms.reduceRight(function (subState, transformer) {
return transformer.out(subState, key, rawState);
}, deserialize(rawState[key]));
});
return state;
} catch (err) {
throw err;
}
}
});
}
function defaultDeserialize(serial) {
return JSON.parse(serial);
}
function purgeStoredState(config) {
var storage = config.storage;
var storageKey = "".concat(config.keyPrefix !== undefined ? config.keyPrefix : KEY_PREFIX).concat(config.key);
return storage.removeItem(storageKey, warnIfRemoveError);
}
function warnIfRemoveError(err) {
if (err && "production" !== 'production') {
console.error('redux-persist/purgeStoredState: Error purging data stored state', err);
}
}
function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(source, true).forEach(function (key) { _defineProperty$4(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties$1(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose$1(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose$1(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var DEFAULT_TIMEOUT = 5000;
/*
@TODO add validation / handling for:
- persisting a reducer which has nested _persist
- handling actions that fire before reydrate is called
*/
function persistReducer(config, baseReducer) {
var version = config.version !== undefined ? config.version : DEFAULT_VERSION;
config.debug || false;
var stateReconciler = config.stateReconciler === undefined ? autoMergeLevel1 : config.stateReconciler;
var getStoredState$1 = config.getStoredState || getStoredState;
var timeout = config.timeout !== undefined ? config.timeout : DEFAULT_TIMEOUT;
var _persistoid = null;
var _purge = false;
var _paused = true;
var conditionalUpdate = function conditionalUpdate(state) {
// update the persistoid only if we are rehydrated and not paused
state._persist.rehydrated && _persistoid && !_paused && _persistoid.update(state);
return state;
};
return function (state, action) {
var _ref = state || {},
_persist = _ref._persist,
rest = _objectWithoutProperties$1(_ref, ["_persist"]); // $FlowIgnore need to update State type
var restState = rest;
if (action.type === PERSIST) {
var _sealed = false;
var _rehydrate = function _rehydrate(payload, err) {
if (!_sealed) {
action.rehydrate(config.key, payload, err);
_sealed = true;
}
};
timeout && setTimeout(function () {
!_sealed && _rehydrate(undefined, new Error("redux-persist: persist timed out for persist key \"".concat(config.key, "\"")));
}, timeout); // @NOTE PERSIST resumes if paused.
_paused = false; // @NOTE only ever create persistoid once, ensure we call it at least once, even if _persist has already been set
if (!_persistoid) _persistoid = createPersistoid(config); // @NOTE PERSIST can be called multiple times, noop after the first
if (_persist) {
// We still need to call the base reducer because there might be nested
// uses of persistReducer which need to be aware of the PERSIST action
return _objectSpread$3({}, baseReducer(restState, action), {
_persist: _persist
});
}
if (typeof action.rehydrate !== 'function' || typeof action.register !== 'function') throw new Error('redux-persist: either rehydrate or register is not a function on the PERSIST action. This can happen if the action is being replayed. This is an unexplored use case, please open an issue and we will figure out a resolution.');
action.register(config.key);
getStoredState$1(config).then(function (restoredState) {
var migrate = config.migrate || function (s, v) {
return Promise.resolve(s);
};
migrate(restoredState, version).then(function (migratedState) {
_rehydrate(migratedState);
}, function (migrateErr) {
_rehydrate(undefined, migrateErr);
});
}, function (err) {
_rehydrate(undefined, err);
});
return _objectSpread$3({}, baseReducer(restState, action), {
_persist: {
version: version,
rehydrated: false
}
});
} else if (action.type === PURGE) {
_purge = true;
action.result(purgeStoredState(config));
return _objectSpread$3({}, baseReducer(restState, action), {
_persist: _persist
});
} else if (action.type === FLUSH) {
action.result(_persistoid && _persistoid.flush());
return _objectSpread$3({}, baseReducer(restState, action), {
_persist: _persist
});
} else if (action.type === PAUSE) {
_paused = true;
} else if (action.type === REHYDRATE) {
// noop on restState if purging
if (_purge) return _objectSpread$3({}, restState, {
_persist: _objectSpread$3({}, _persist, {
rehydrated: true
}) // @NOTE if key does not match, will continue to default else below
});
if (action.key === config.key) {
var reducedState = baseReducer(restState, action);
var inboundState = action.payload; // only reconcile state if stateReconciler and inboundState are both defined
var reconciledRest = stateReconciler !== false && inboundState !== undefined ? stateReconciler(inboundState, state, reducedState, config) : reducedState;
var _newState = _objectSpread$3({}, reconciledRest, {
_persist: _objectSpread$3({}, _persist, {
rehydrated: true
})
});
return conditionalUpdate(_newState);
}
} // if we have not already handled PERSIST, straight passthrough
if (!_persist) return baseReducer(state, action); // run base reducer:
// is state modified ? return original : return updated
var newState = baseReducer(restState, action);
if (newState === restState) return state;
return conditionalUpdate(_objectSpread$3({}, newState, {
_persist: _persist
}));
};
}
function _toConsumableArray$2(arr) { return _arrayWithoutHoles$2(arr) || _iterableToArray$2(arr) || _nonIterableSpread$2(); }
function _nonIterableSpread$2() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray$2(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles$2(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(source, true).forEach(function (key) { _defineProperty$3(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var initialState$5 = {
registry: [],
bootstrapped: false
};
var persistorReducer = function persistorReducer() {
var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState$5;
var action = arguments.length > 1 ? arguments[1] : undefined;
switch (action.type) {
case REGISTER:
return _objectSpread$2({}, state, {
registry: [].concat(_toConsumableArray$2(state.registry), [action.key])
});
case REHYDRATE:
var firstIndex = state.registry.indexOf(action.key);
var registry = _toConsumableArray$2(state.registry);
registry.splice(firstIndex, 1);
return _objectSpread$2({}, state, {
registry: registry,
bootstrapped: registry.length === 0
});
default:
return state;
}
};
function persistStore(store, options, cb) {
var boostrappedCb = cb || false;
var _pStore = createStore(persistorReducer, initialState$5, options && options.enhancer ? options.enhancer : undefined);
var register = function register(key) {
_pStore.dispatch({
type: REGISTER,
key: key
});
};
var rehydrate = function rehydrate(key, payload, err) {
var rehydrateAction = {
type: REHYDRATE,
payload: payload,
err: err,
key: key // dispatch to `store` to rehydrate and `persistor` to track result
};
store.dispatch(rehydrateAction);
_pStore.dispatch(rehydrateAction);
if (boostrappedCb && persistor.getState().bootstrapped) {
boostrappedCb();
boostrappedCb = false;
}
};
var persistor = _objectSpread$2({}, _pStore, {
purge: function purge() {
var results = [];
store.dispatch({
type: PURGE,
result: function result(purgeResult) {
results.push(purgeResult);
}
});
return Promise.all(results);
},
flush: function flush() {
var results = [];
store.dispatch({
type: FLUSH,
result: function result(flushResult) {
results.push(flushResult);
}
});
return Promise.all(results);
},
pause: function pause() {
store.dispatch({
type: PAUSE
});
},
persist: function persist() {
store.dispatch({
type: PERSIST,
register: register,
rehydrate: rehydrate
});
}
});
if (!(options && options.manualPersist)) {
persistor.persist();
}
return persistor;
}
const initialState$4 = {
chunks: []
};
const chunkDataSlice = createSlice({
initialState: initialState$4,
name: "chunkData",
reducers: {
addChunk: (state, action) => {
state.chunks.push(action.payload);
},
setPixel: (state, action) => {
const {
chunkX,
chunkY,
pixels
} = action.payload;
const chunk = state.chunks.find((x) => x.chunkX === chunkX && x.chunkY === chunkY);
if (!chunk || chunk.fetching)
return;
pixels.forEach((p) => {
chunk.chunkData.set([p.color], p.offsetInChunk);
});
}
},
extraReducers: (builder) => {
builder.addCase(fetchChunkDataAction.pending, (state, action) => {
const foundChunk = state.chunks.some((x) => x.chunkX === action.meta.arg.chunkX && x.chunkY === action.meta.arg.chunkY);
if (!foundChunk) {
state.chunks.push({
chunkX: action.meta.arg.chunkX,
chunkY: action.meta.arg.chunkY,
fetching: true
});
return;
}
state.chunks = state.chunks.map((c) => {
if (c.chunkX === action.meta.arg.chunkX && c.chunkY === action.meta.arg.chunkY) {
return {
chunkX: action.meta.arg.chunkX,
chunkY: action.meta.arg.chunkY,
fetching: true
};
}
return c;
});
});
builder.addCase(fetchChunkDataAction.fulfilled, (state, action) => {
const foundChunk = state.chunks.some((x) => x.chunkX === action.meta.arg.chunkX && x.chunkY === action.meta.arg.chunkY);
if (!foundChunk) {
state.chunks.push({
chunkX: action.meta.arg.chunkX,
chunkY: action.meta.arg.chunkY,
chunkData: action.payload,
fetching: false
});
return;
}
state.chunks = state.chunks.map((chunk) => {
if (chunk.chunkX === action.meta.arg.chunkX && chunk.chunkY === action.meta.arg.chunkY) {
return {
chunkX: action.meta.arg.chunkX,
chunkY: action.meta.arg.chunkY,
fetching: false,
chunkData: action.payload
};
}
return chunk;
});
});
builder.addCase(fetchChunkDataAction.rejected, (state, action) => {
state.chunks = state.chunks.filter((x) => x.chunkX !== action.meta.arg.chunkX && x.chunkY !== action.meta.arg.chunkY);
});
}
});
const fetchChunkDataAction = createAsyncThunk("chunkData/fetchChunkData", async (chunkCoords, {
getState
}) => {
const canvasId = selectCanvasId(getState());
const chunkData = await fetch(`/chunks/${canvasId}/${chunkCoords.chunkX}/${chunkCoords.chunkY}.bmp`).then((x) => x.arrayBuffer()).then((x) => new Uint8Array(x));
return chunkData;
});
function isStringOrNumber(value) {
return typeof value === 'string' || typeof value === 'number';
}
var FlatObjectCache = /*#__PURE__*/function () {
function FlatObjectCache() {
this._cache = {};
}
var _proto = FlatObjectCache.prototype;
_proto.set = function set(key, selectorFn) {
this._cache[key] = selectorFn;
};
_proto.get = function get(key) {
return this._cache[key];
};
_proto.remove = function remove(key) {
delete this._cache[key];
};
_proto.clear = function clear() {
this._cache = {};
};
_proto.isValidCacheKey = function isValidCacheKey(cacheKey) {
return isStringOrNumber(cacheKey);
};
return FlatObjectCache;
}();
var defaultCacheCreator = FlatObjectCache;
var defaultCacheKeyValidator = function defaultCacheKeyValidator() {
return true;
};
function createCachedSelector() {
for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) {
funcs[_key] = arguments[_key];
}
return function (polymorphicOptions, legacyOptions) {
if (legacyOptions) {
throw new Error('[re-reselect] "options" as second argument is not supported anymore. Please provide an option object as single argument.');
}
var options = typeof polymorphicOptions === 'function' ? {
keySelector: polymorphicOptions
} : Object.assign({}, polymorphicOptions); // https://github.com/reduxjs/reselect/blob/v4.0.0/src/index.js#L54
var recomputations = 0;
var resultFunc = funcs.pop();
var dependencies = Array.isArray(funcs[0]) ? funcs[0] : [].concat(funcs);
var resultFuncWithRecomputations = function resultFuncWithRecomputations() {
recomputations++;
return resultFunc.apply(void 0, arguments);
};
funcs.push(resultFuncWithRecomputations);
var cache = options.cacheObject || new defaultCacheCreator();
var selectorCreator = options.selectorCreator || createSelector;
var isValidCacheKey = cache.isValidCacheKey || defaultCacheKeyValidator;
if (options.keySelectorCreator) {
options.keySelector = options.keySelectorCreator({
keySelector: options.keySelector,
inputSelectors: dependencies,
resultFunc: resultFunc
});
} // Application receives this function
var selector = function selector() {
var cacheKey = options.keySelector.apply(options, arguments);
if (isValidCacheKey(cacheKey)) {
var cacheResponse = cache.get(cacheKey);
if (cacheResponse === undefined) {
cacheResponse = selectorCreator.apply(void 0, funcs);
cache.set(cacheKey, cacheResponse);
}
return cacheResponse.apply(void 0, arguments);
}
console.warn("[re-reselect] Invalid cache key \"" + cacheKey + "\" has been returned by keySelector function.");
return undefined;
}; // Further selector methods
selector.getMatchingSelector = function () {
var cacheKey = options.keySelector.apply(options, arguments); // @NOTE It might update cache hit count in LRU-like caches
return cache.get(cacheKey);
};
selector.removeMatchingSelector = function () {
var cacheKey = options.keySelector.apply(options, arguments);
cache.remove(cacheKey);
};
selector.clearCache = function () {
cache.clear();
};
selector.resultFunc = resultFunc;
selector.dependencies = dependencies;
selector.cache = cache;
selector.recomputations = function () {
return recomputations;
};
selector.resetRecomputations = function () {
return recomputations = 0;
};
selector.keySelector = options.keySelector;
return selector;
};
}
function gameCoordsToScreen(gameCoords, windowSize, viewCenter, viewScale) {
const gameCoordsOffsetX = gameCoords.x - viewCenter.x;
const gameCoordsOffsetY = gameCoords.y - viewCenter.y;
const screenCoordsX = windowSize.width / 2 + gameCoordsOffsetX * viewScale;
const screenCoordsY = windowSize.height / 2 + gameCoordsOffsetY * viewScale;
return {
clientX: Math.floor(screenCoordsX),
clientY: Math.floor(screenCoordsY)
};
}
const initialState$3 = {
pixelsToPlaceQueue: {},
pixelPlaceQueueEnabled: false
};
const pixelPlacementSlice = createSlice({
initialState: initialState$3,
name: "pixelPlacement",
reducers: {
addPixelsToPlaceQueue: (state, action) => {
action.payload.pixels.forEach(({
coord,
color
}) => {
const pixelId = coord.x + action.payload.canvasSize / 2 + (coord.y + action.payload.canvasSize / 2) * action.payload.canvasSize;
state.pixelsToPlaceQueue[pixelId] = {
coord,
color
};
});
},
removePixelsFromPlaceQueue: (state, action) => {
action.payload.pixels.forEach(({
coord
}) => {
const pixelId = coord.x + action.payload.canvasSize / 2 + (coord.y + action.payload.canvasSize / 2) * action.payload.canvasSize;
delete state.pixelsToPlaceQueue[pixelId];
});
},
setPixelPlaceQueueEnabled: (state, action) => {
state.pixelPlaceQueueEnabled = action.payload;
}
}
});
const selectPixelPlaceQueueEnabled = createSelector((state) => state.pixelPlacement.pixelPlaceQueueEnabled, (pixelPlaceQueueEnabled) => pixelPlaceQueueEnabled);
const selectPixelsToPlaceQueue = createSelector((state) => state.pixelPlacement.pixelsToPlaceQueue, (pixelsToPlaceQueue) => pixelsToPlaceQueue);
const selectPixelsToPlaceIds = createSelector((state) => state.pixelPlacement.pixelsToPlaceQueue, (pixelsToPlaceQueue) => Object.keys(pixelsToPlaceQueue).map((key) => parseInt(key, 10)));
createSelector(selectPixelsToPlaceIds, selectPixelsToPlaceQueue, (pixelsToPlaceIds, pixelsToPlaceQueue) => {
const first = pixelsToPlaceIds[0];
if (!first)
return void 0;
return pixelsToPlaceQueue[first];
});
const splitRenderCanvasSize$1 = 1024;
const selectRenderCanvasCoords = createCachedSelector(selectCanvasSize, (_, renderCanvasId) => renderCanvasId, (canvasSize, renderCanvasId) => {
const splitCanvasesWidth = Math.ceil(canvasSize / splitRenderCanvasSize$1);
const renderCanvasXCorner = Math.floor(renderCanvasId % splitCanvasesWidth) * splitRenderCanvasSize$1 - canvasSize / 2;
const renderCanvasYCorner = Math.floor(renderCanvasId / splitCanvasesWidth) * splitRenderCanvasSize$1 - canvasSize / 2;
return {
renderCanvasXCorner,
renderCanvasYCorner
};
})((_, renderCanvasId) => renderCanvasId);
const selectPixelIdsToPlaceByRenderCanvasId = createSelector(selectPixelsToPlaceIds, selectCanvasSize, (pixelsToPlaceIds, canvasSize) => {
const splitCanvasesWidth = Math.ceil(canvasSize / splitRenderCanvasSize$1);
const dict = pixelsToPlaceIds.reduce((acc, pixelId) => {
const x = pixelId % canvasSize;
const y = Math.floor(pixelId / canvasSize);
const splitRenderCanvasX = Math.floor(x / splitRenderCanvasSize$1);
const splitRenderCanvasY = Math.floor(y / splitRenderCanvasSize$1);
const splitRenderCanvasId = splitRenderCanvasX + splitRenderCanvasY * splitCanvasesWidth;
const foundAccumulator = acc[splitRenderCanvasId];
if (!foundAccumulator) {
acc[splitRenderCanvasId] = [pixelId];
return acc;
}
foundAccumulator.push(pixelId);
return acc;
}, {});
return dict;
});
const selectMainCanvasTopLeftScreenCoords = createSelector(selectCanvasSize, selectWindowSize, selectGameViewCenter, selectGameViewScale, (canvasSize, windowSize, gameViewCenter, gameViewScale) => {
return gameCoordsToScreen({
x: -canvasSize / 2,
y: -canvasSize / 2
}, {
height: windowSize.innerHeight,
width: windowSize.innerWidth
}, gameViewCenter, gameViewScale);
});
const selectPixelsToPlaceRenderCanvasIds = createSelector(selectPixelIdsToPlaceByRenderCanvasId, (pixelIdsToPlaceByRenderCanvasId) => Object.keys(pixelIdsToPlaceByRenderCanvasId).map((key) => parseInt(key, 10)));
const selectPixelsToPlaceBySplitRenderCanvasId = createCachedSelector(selectPixelIdsToPlaceByRenderCanvasId, selectPixelsToPlaceQueue, selectCanvasSize, (_, renderCanvasId) => renderCanvasId, (pixelIdsToPlaceByRenderCanvasId, pixelsToPlaceQueue, canvasSize, renderCanvasId) => {
const splitCanvasesWidth = Math.ceil(canvasSize / splitRenderCanvasSize$1);
const splitRenderCanvasX = Math.floor(renderCanvasId % splitCanvasesWidth);
const splitRenderCanvasY = Math.floor(renderCanvasId / splitCanvasesWidth);
const splitRenderCanvasId = splitRenderCanvasX + splitRenderCanvasY * splitCanvasesWidth;
const pixelIdsToPlace = pixelIdsToPlaceByRenderCanvasId[splitRenderCanvasId];
if (!pixelIdsToPlace)
return [];
return pixelIdsToPlace.map((pixelId) => pixelsToPlaceQueue[pixelId]).filter((pixel) => !!pixel).map((pixel) => pixel);
})((_, renderCanvasId) => renderCanvasId);
const initialState$2 = {
inputImage: {
loadedImage: {
status: "none"
}
},
outputImage: {
isProcessing: false
}
};
const processedImagesSlice = createSlice({
initialState: initialState$2,
name: "processedImages",
reducers: {},
extraReducers: (builder) => {
builder.addCase(startNewImageReadingProcess.pending, (state) => {
state.inputImage.loadedImage.status = "loading";
state.inputImage.loadedImage.error = void 0;
});
builder.addCase(startNewImageReadingProcess.fulfilled, (state, action) => {
state.inputImage.loadedImage.status = "loaded";
state.inputImage.loadedImage.imageData = action.payload;
});
builder.addCase(startNewImageReadingProcess.rejected, (state, action) => {
state.inputImage.loadedImage.status = "error";
state.inputImage.loadedImage.error = action.error.message;
});
builder.addCase(clearInputImageAction.fulfilled, (state) => {
state.inputImage.loadedImage.status = "none";
state.inputImage.loadedImage.error = void 0;
state.inputImage.loadedImage.imageData = void 0;
});
builder.addCase(startProcessingOutputImage.pending, (state) => {
state.outputImage.isProcessing = true;
});
builder.addCase(startProcessingOutputImage.fulfilled, (state, action) => {
state.outputImage.isProcessing = false;
state.outputImage.imageData = action.payload.outImageData;
state.outputImage.abortController = action.payload.abortController;
});
builder.addCase(clearOutputImageAction.fulfilled, (state) => {
state.outputImage.imageData = void 0;
state.outputImage.abortController = void 0;
state.outputImage.isProcessing = false;
});
}
});
const listenerMiddleware = createListenerMiddleware();
const startAppListening = listenerMiddleware.startListening;
const reduxPersistedStorage = localforage.createInstance({
name: "picture_overlay",
storeName: "redux_persisted"
});
const commonPersistReducerParams = {
serialize: false,
deserialize: false,
storage: reduxPersistedStorage
};
const persistedOverlayReducer = persistReducer({
...commonPersistReducerParams,
key: "overlay"
}, overlaySlice.reducer);
function configureAppStore() {
return configureStore({
reducer: {
overlay: persistedOverlayReducer,
game: gameSlice.reducer,
chunkData: chunkDataSlice.reducer,
pixelPlacement: pixelPlacementSlice.reducer,
processedImages: processedImagesSlice.reducer
},
devTools: false,
middleware(getDefaultMiddleware) {
return getDefaultMiddleware().concat([listenerMiddleware.middleware]);
}
});
}
const store = configureAppStore();
const persistor = persistStore(store);
function isStoreFromRedux(store) {
if (typeof store !== "object")
return false;
if (!store.dispatch)
return false;
if (!store.getState)
return false;
if (!store.subscribe)
return false;
return true;
}
function getStoreFromReactInternalEl(el) {
if (el.tag !== 0 || !el.child)
return void 0;
if (el.child.tag !== 10)
return void 0;
if (!el.child.memoizedProps)
return void 0;
const childStore = el.child.memoizedProps?.value?.store;
if (!isStoreFromRedux(childStore))
return void 0;
const parentStore = el.memoizedProps?.store;
if (!isStoreFromRedux(parentStore))
return void 0;
if (childStore !== parentStore)
return void 0;
return parentStore;
}
function findReactRootContainerEl() {
return document.getElementById("app");
}
function findStoreInRoot(el) {
const reactContainerName = Object.keys(el).filter((k) => k.startsWith("__reactContainer"))[0];
if (!reactContainerName)
throw new Error("couldn't find internal react root");
const root = el[reactContainerName];
let checkedReactInternalElement = root;
while (checkedReactInternalElement.child) {
const store = getStoreFromReactInternalEl(checkedReactInternalElement);
if (store)
return store;
checkedReactInternalElement = checkedReactInternalElement.child;
}
return void 0;
}
function findPageReduxStore() {
const reactRootEl = findReactRootContainerEl();
if (!reactRootEl)
throw new Error("Couldn't find React root container");
const store = findStoreInRoot(reactRootEl);
if (!store)
throw new Error("Couldn't find Redux store");
return store;
}
const usePageReduxStoreSelector = (selector) => {
const store = usePageReduxStore();
const [selectedResult, setSelectedResult] = reactExports.useState();
reactExports.useEffect(() => {
if (!store)
return void 0;
setSelectedResult(selector(store.getState()));
const unsubscribe = store.subscribe(() => {
setSelectedResult(selector(store.getState()));
});
return () => unsubscribe();
}, [store, selector]);
return selectedResult;
};
const usePageReduxStoreDispatch = () => {
const store = usePageReduxStore();
if (!store)
return void 0;
return store.dispatch;
};
function pageReduxStoreSelectColorAction(colorIndex) {
return {
type: "SELECT_COLOR",
color: colorIndex
};
}
function setViewCoordinates(view) {
return {
type: "SET_VIEW_COORDINATES",
view
};
}
function usePageReduxStore() {
const [pageReduxStore, setPageReduxStore] = reactExports.useState();
reactExports.useEffect(() => {
let timeout;
try {
setPageReduxStore(findPageReduxStore());
} catch (error) {
logger.log("Error while finding redux store", error, "retrying in 1 second");
timeout = setTimeout(() => {
setPageReduxStore(findPageReduxStore());
}, 1e3);
}
return () => {
if (timeout)
clearTimeout(timeout);
};
}, [setPageReduxStore]);
return pageReduxStore;
}
const selectPageStatePixelWaitDate = createSelector((state) => state.user.wait, (pixelWaitDate) => pixelWaitDate);
const selectPageStateCurrentSelectedColor = createSelector((state) => state.canvas.selectedColor, (currentSelectedColor) => currentSelectedColor);
const selectPageStateHoverPixel = createSelector((state) => state.canvas.hover?.[0], (state) => state.canvas.hover?.[1], (hoverPixelX, hoverPixelY) => {
if (hoverPixelX == null || hoverPixelY == null)
return void 0;
return {
x: hoverPixelX,
y: hoverPixelY
};
});
const selectPageStateViewScale = createSelector((state) => state.canvas.viewscale, (viewScale) => viewScale);
const selectPageStateCanvasViewCenter = createSelector((state) => state.canvas.view[0], (state) => state.canvas.view[1], (viewX, viewY) => {
if (viewX == null || viewY == null)
return void 0;
return {
x: viewX,
y: viewY
};
});
const selectPageStateRoundedCanvasViewCenter = createSelector(selectPageStateCanvasViewCenter, (view) => view ? {
x: Math.round(view.x),
y: Math.round(view.y)
} : void 0);
const selectPageStateCanvasPalette = createSelector((state) => state.canvas.palette.abgr, (paletteAbgr) => {
return Array.from(new Uint32Array(paletteAbgr)).map((abgr) => {
const b = (abgr & 16711680) >>> 16;
const g = (abgr & 65280) >>> 8;
const r = abgr & 255;
return [r, g, b];
});
});
const selectPageStateCanvasReservedColors = createSelector((state) => state.canvas.clrIgnore, (reservedColors) => reservedColors);
const selectPageStateCanvasId = createSelector((state) => state.canvas.canvasId, (canvasId) => canvasId);
const selectPageStateCanvasSize = createSelector((state) => state.canvas.canvasSize, (size) => size);
const selectPageStateCanvasMaxTimeoutMs = createSelector((state) => state.canvas.canvases[state.canvas.canvasId]?.cds, (canvasMaxTimeout) => canvasMaxTimeout);
const selectPageStateCanvasTimeoutOnBaseMs = createSelector((state) => state.canvas.canvases[state.canvas.canvasId]?.bcd, (canvasTimeoutOnBase) => canvasTimeoutOnBase);
const selectPaseStateCanvasTimeoutOnPlacedMs = createSelector((state) => state.canvas.canvases[state.canvas.canvasId]?.pcd, (canvasTimeoutOnPlaced) => canvasTimeoutOnPlaced);
function executeAllHooks(retryCounter = 0) {
try {
hookForAutoSelectColor();
hookForHoverPixel();
} catch (error) {
if (retryCounter > 5) {
logger.logError("failed to executeAllHooks multiple times. Rethrowing exception", error);
throw error;
}
const retryInMs = (retryCounter + 1) * 1e3;
logger.log("failed to executeAllHooks", error, "retrying in", retryInMs);
setTimeout(() => {
executeAllHooks(retryCounter + 1);
}, retryInMs);
}
}
function hookForAutoSelectColor() {
const pageStore = findPageReduxStore();
const pageDispatch = pageStore.dispatch;
let lastColorIndex;
store.subscribe(() => {
const colorIndex = selectCurrentHoverPixelOnOutputImageColorIndexInPalette(store.getState());
if (colorIndex !== void 0 && colorIndex !== lastColorIndex) {
lastColorIndex = colorIndex;
pageDispatch(pageReduxStoreSelectColorAction(colorIndex));
}
});
}
function hookForHoverPixel() {
const pageStore = findPageReduxStore();
let lastHoverPixel;
pageStore.subscribe(() => {
let hoverPixel = selectPageStateHoverPixel(pageStore.getState());
if (hoverPixel) {
if (hoverPixel !== lastHoverPixel) {
lastHoverPixel = hoverPixel;
store.dispatch(gameSlice.actions.setHoverPixel(hoverPixel));
}
return;
}
hoverPixel = selectPageStateRoundedCanvasViewCenter(pageStore.getState());
if (hoverPixel) {
if (hoverPixel !== lastHoverPixel) {
lastHoverPixel = hoverPixel;
store.dispatch(gameSlice.actions.setHoverPixel(hoverPixel));
}
}
});
}
var createRoot;
var m = reactDomExports;
{
createRoot = m.createRoot;
m.hydrateRoot;
}
function _setPrototypeOf$1(o, p) {
_setPrototypeOf$1 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf$1(o, p);
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf$1(subClass, superClass);
}
var changedArray = function changedArray(a, b) {
if (a === void 0) {
a = [];
}
if (b === void 0) {
b = [];
}
return a.length !== b.length || a.some(function (item, index) {
return !Object.is(item, b[index]);
});
};
var initialState$1 = {
error: null
};
var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
_inheritsLoose(ErrorBoundary, _React$Component);
function ErrorBoundary() {
var _this;
for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
_args[_key] = arguments[_key];
}
_this = _React$Component.call.apply(_React$Component, [this].concat(_args)) || this;
_this.state = initialState$1;
_this.resetErrorBoundary = function () {
var _this$props;
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
_this.props.onReset == null ? void 0 : (_this$props = _this.props).onReset.apply(_this$props, args);
_this.reset();
};
return _this;
}
ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) {
return {
error: error
};
};
var _proto = ErrorBoundary.prototype;
_proto.reset = function reset() {
this.setState(initialState$1);
};
_proto.componentDidCatch = function componentDidCatch(error, info) {
var _this$props$onError, _this$props2;
(_this$props$onError = (_this$props2 = this.props).onError) == null ? void 0 : _this$props$onError.call(_this$props2, error, info);
};
_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
var error = this.state.error;
var resetKeys = this.props.resetKeys; // There's an edge case where if the thing that triggered the error
// happens to *also* be in the resetKeys array, we'd end up resetting
// the error boundary immediately. This would likely trigger a second
// error to be thrown.
// So we make sure that we don't check the resetKeys on the first call
// of cDU after the error is set
if (error !== null && prevState.error !== null && changedArray(prevProps.resetKeys, resetKeys)) {
var _this$props$onResetKe, _this$props3;
(_this$props$onResetKe = (_this$props3 = this.props).onResetKeysChange) == null ? void 0 : _this$props$onResetKe.call(_this$props3, prevProps.resetKeys, resetKeys);
this.reset();
}
};
_proto.render = function render() {
var error = this.state.error;
var _this$props4 = this.props,
fallbackRender = _this$props4.fallbackRender,
FallbackComponent = _this$props4.FallbackComponent,
fallback = _this$props4.fallback;
if (error !== null) {
var _props = {
error: error,
resetErrorBoundary: this.resetErrorBoundary
};
if ( /*#__PURE__*/reactExports.isValidElement(fallback)) {
return fallback;
} else if (typeof fallbackRender === 'function') {
return fallbackRender(_props);
} else if (FallbackComponent) {
return /*#__PURE__*/reactExports.createElement(FallbackComponent, _props);
} else {
throw new Error('react-error-boundary requires either a fallback, fallbackRender, or FallbackComponent prop');
}
}
return this.props.children;
};
return ErrorBoundary;
}(reactExports.Component);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized$1(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized$1(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var PersistGate =
/*#__PURE__*/
function (_PureComponent) {
_inherits(PersistGate, _PureComponent);
function PersistGate() {
var _getPrototypeOf2;
var _this;
_classCallCheck(this, PersistGate);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(PersistGate)).call.apply(_getPrototypeOf2, [this].concat(args)));
_defineProperty$2(_assertThisInitialized$1(_this), "state", {
bootstrapped: false
});
_defineProperty$2(_assertThisInitialized$1(_this), "_unsubscribe", void 0);
_defineProperty$2(_assertThisInitialized$1(_this), "handlePersistorState", function () {
var persistor = _this.props.persistor;
var _persistor$getState = persistor.getState(),
bootstrapped = _persistor$getState.bootstrapped;
if (bootstrapped) {
if (_this.props.onBeforeLift) {
Promise.resolve(_this.props.onBeforeLift()).finally(function () {
return _this.setState({
bootstrapped: true
});
});
} else {
_this.setState({
bootstrapped: true
});
}
_this._unsubscribe && _this._unsubscribe();
}
});
return _this;
}
_createClass(PersistGate, [{
key: "componentDidMount",
value: function componentDidMount() {
this._unsubscribe = this.props.persistor.subscribe(this.handlePersistorState);
this.handlePersistorState();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this._unsubscribe && this._unsubscribe();
}
}, {
key: "render",
value: function render() {
if (typeof this.props.children === 'function') {
return this.props.children(this.state.bootstrapped);
}
return this.state.bootstrapped ? this.props.children : this.props.loading;
}
}]);
return PersistGate;
}(reactExports.PureComponent);
_defineProperty$2(PersistGate, "defaultProps", {
children: null,
loading: null
});
/**
* Exports a boolean value reporting whether is client side or server side by checking on the window object
*/
const isClient = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
/**
* Exports a boolean value reporting whether the given API is supported or not
*/
const isApiSupported = (api) => (typeof window !== 'undefined' ? api in window : false);
const cache = new Map();
/**
* A tiny wrapper around console.warn that makes sure the message is only displayed once.
* Used mainly to avoid polluting server side logs
* @param message
*/
const warnOnce = (message) => {
if (cache.has(message))
return;
cache.set(message, true);
// eslint-disable-next-line no-console
console.warn(message);
};
const errorMessage = 'matchMedia is not supported, this could happen both because window.matchMedia is not supported by'
+ ' your current browser or you\'re using the useMediaQuery hook whilst server side rendering.';
/**
* Accepts a media query string then uses the
* [window.matchMedia](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia) API to determine if it
* matches with the current document.<br />
* It also monitor the document changes to detect when it matches or stops matching the media query.<br />
* Returns the validity state of the given media query.
*
*/
const useMediaQuery = (mediaQuery) => {
if (!isClient || !isApiSupported('matchMedia')) {
warnOnce(errorMessage);
return false;
}
const [isVerified, setIsVerified] = reactExports.useState(!!window.matchMedia(mediaQuery).matches);
reactExports.useEffect(() => {
const mediaQueryList = window.matchMedia(mediaQuery);
const documentChangeHandler = () => setIsVerified(!!mediaQueryList.matches);
try {
mediaQueryList.addEventListener('change', documentChangeHandler);
}
catch (e) {
// Safari isn't supporting mediaQueryList.addEventListener
mediaQueryList.addListener(documentChangeHandler);
}
documentChangeHandler();
return () => {
try {
mediaQueryList.removeEventListener('change', documentChangeHandler);
}
catch (e) {
// Safari isn't supporting mediaQueryList.removeEventListener
mediaQueryList.removeListener(documentChangeHandler);
}
};
}, [mediaQuery]);
return isVerified;
};
/* eslint-disable @typescript-eslint/no-explicit-any */
const objectFromEntries = !Object
.fromEntries
? (entries) => {
if (!entries || !entries[Symbol.iterator]) {
throw new Error("Object.fromEntries() requires a single iterable argument");
}
const o = {};
Object.keys(entries).forEach(key => {
const [k, v] = entries[key];
o[k] = v;
});
return o;
}
: Object.fromEntries;
/** Object.keys() with types */
function objectKeys(o) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return Object.keys(o);
}
/** https://docs.tsafe.dev/assert */
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function assert(condition, msg) {
if (!condition) {
throw new Error(msg);
}
}
/* eslint-disable @typescript-eslint/no-explicit-any */
/** https://docs.tsafe.dev/typeguard */
function typeGuard(_value, isMatched) {
return isMatched;
}
/** Copy pasted from
* https://github.com/emotion-js/emotion/blob/23f43ab9f24d44219b0b007a00f4ac681fe8712e/packages/react/src/class-names.js#L17-L63
**/
const classnames = (args) => {
const len = args.length;
let i = 0;
let cls = "";
for (; i < len; i++) {
const arg = args[i];
if (arg == null)
continue;
let toAdd;
switch (typeof arg) {
case "boolean":
break;
case "object": {
if (Array.isArray(arg)) {
toAdd = classnames(arg);
}
else {
assert(!typeGuard(arg, false));
toAdd = "";
for (const k in arg) {
if (arg[k] && k) {
toAdd && (toAdd += " ");
toAdd += k;
}
}
}
break;
}
default: {
toAdd = arg;
}
}
if (toAdd) {
cls && (cls += " ");
cls += toAdd;
}
}
return cls;
};
/* eslint-disable */
// Inspired by https://github.com/garycourt/murmurhash-js
// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
function murmur2(str) {
// 'm' and 'r' are mixing constants generated offline.
// They're not really 'magic', they just happen to work well.
// const m = 0x5bd1e995;
// const r = 24;
// Initialize the hash
var h = 0; // Mix 4 bytes at a time into the hash
var k,
i = 0,
len = str.length;
for (; len >= 4; ++i, len -= 4) {
k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
k =
/* Math.imul(k, m): */
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
k ^=
/* k >>> r: */
k >>> 24;
h =
/* Math.imul(k, m): */
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
} // Handle the last few bytes of the input array
switch (len) {
case 3:
h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
case 2:
h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
case 1:
h ^= str.charCodeAt(i) & 0xff;
h =
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
} // Do a few final mixes of the hash to ensure the last few
// bytes are well-incorporated.
h ^= h >>> 13;
h =
/* Math.imul(h, m): */
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
return ((h ^ h >>> 15) >>> 0).toString(36);
}
var unitlessKeys = {
animationIterationCount: 1,
borderImageOutset: 1,
borderImageSlice: 1,
borderImageWidth: 1,
boxFlex: 1,
boxFlexGroup: 1,
boxOrdinalGroup: 1,
columnCount: 1,
columns: 1,
flex: 1,
flexGrow: 1,
flexPositive: 1,
flexShrink: 1,
flexNegative: 1,
flexOrder: 1,
gridRow: 1,
gridRowEnd: 1,
gridRowSpan: 1,
gridRowStart: 1,
gridColumn: 1,
gridColumnEnd: 1,
gridColumnSpan: 1,
gridColumnStart: 1,
msGridRow: 1,
msGridRowSpan: 1,
msGridColumn: 1,
msGridColumnSpan: 1,
fontWeight: 1,
lineHeight: 1,
opacity: 1,
order: 1,
orphans: 1,
tabSize: 1,
widows: 1,
zIndex: 1,
zoom: 1,
WebkitLineClamp: 1,
// SVG-related properties
fillOpacity: 1,
floodOpacity: 1,
stopOpacity: 1,
strokeDasharray: 1,
strokeDashoffset: 1,
strokeMiterlimit: 1,
strokeOpacity: 1,
strokeWidth: 1
};
function memoize$1(fn) {
var cache = Object.create(null);
return function (arg) {
if (cache[arg] === undefined) cache[arg] = fn(arg);
return cache[arg];
};
}
var hyphenateRegex = /[A-Z]|^ms/g;
var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
var isCustomProperty = function isCustomProperty(property) {
return property.charCodeAt(1) === 45;
};
var isProcessableValue = function isProcessableValue(value) {
return value != null && typeof value !== 'boolean';
};
var processStyleName = /* #__PURE__ */memoize$1(function (styleName) {
return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();
});
var processStyleValue = function processStyleValue(key, value) {
switch (key) {
case 'animation':
case 'animationName':
{
if (typeof value === 'string') {
return value.replace(animationRegex, function (match, p1, p2) {
cursor = {
name: p1,
styles: p2,
next: cursor
};
return p1;
});
}
}
}
if (unitlessKeys[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {
return value + 'px';
}
return value;
};
var noComponentSelectorMessage = 'Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.';
function handleInterpolation(mergedProps, registered, interpolation) {
if (interpolation == null) {
return '';
}
if (interpolation.__emotion_styles !== undefined) {
return interpolation;
}
switch (typeof interpolation) {
case 'boolean':
{
return '';
}
case 'object':
{
if (interpolation.anim === 1) {
cursor = {
name: interpolation.name,
styles: interpolation.styles,
next: cursor
};
return interpolation.name;
}
if (interpolation.styles !== undefined) {
var next = interpolation.next;
if (next !== undefined) {
// not the most efficient thing ever but this is a pretty rare case
// and there will be very few iterations of this generally
while (next !== undefined) {
cursor = {
name: next.name,
styles: next.styles,
next: cursor
};
next = next.next;
}
}
var styles = interpolation.styles + ";";
return styles;
}
return createStringFromObject(mergedProps, registered, interpolation);
}
case 'function':
{
if (mergedProps !== undefined) {
var previousCursor = cursor;
var result = interpolation(mergedProps);
cursor = previousCursor;
return handleInterpolation(mergedProps, registered, result);
}
break;
}
} // finalize string values (regular strings and functions interpolated into css calls)
if (registered == null) {
return interpolation;
}
var cached = registered[interpolation];
return cached !== undefined ? cached : interpolation;
}
function createStringFromObject(mergedProps, registered, obj) {
var string = '';
if (Array.isArray(obj)) {
for (var i = 0; i < obj.length; i++) {
string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
}
} else {
for (var _key in obj) {
var value = obj[_key];
if (typeof value !== 'object') {
if (registered != null && registered[value] !== undefined) {
string += _key + "{" + registered[value] + "}";
} else if (isProcessableValue(value)) {
string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
}
} else {
if (_key === 'NO_COMPONENT_SELECTOR' && "production" !== 'production') {
throw new Error(noComponentSelectorMessage);
}
if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
for (var _i = 0; _i < value.length; _i++) {
if (isProcessableValue(value[_i])) {
string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
}
}
} else {
var interpolated = handleInterpolation(mergedProps, registered, value);
switch (_key) {
case 'animation':
case 'animationName':
{
string += processStyleName(_key) + ":" + interpolated + ";";
break;
}
default:
{
string += _key + "{" + interpolated + "}";
}
}
}
}
}
}
return string;
}
var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
// keyframes are stored on the SerializedStyles object as a linked list
var cursor;
var serializeStyles = function serializeStyles(args, registered, mergedProps) {
if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
return args[0];
}
var stringMode = true;
var styles = '';
cursor = undefined;
var strings = args[0];
if (strings == null || strings.raw === undefined) {
stringMode = false;
styles += handleInterpolation(mergedProps, registered, strings);
} else {
styles += strings[0];
} // we start at 1 since we've already handled the first arg
for (var i = 1; i < args.length; i++) {
styles += handleInterpolation(mergedProps, registered, args[i]);
if (stringMode) {
styles += strings[i];
}
}
labelPattern.lastIndex = 0;
var identifierName = '';
var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5
while ((match = labelPattern.exec(styles)) !== null) {
identifierName += '-' + // $FlowFixMe we know it's not null
match[1];
}
var name = murmur2(styles) + identifierName;
return {
name: name,
styles: styles,
next: cursor
};
};
var isBrowser = "object" !== 'undefined';
function getRegisteredStyles(registered, registeredStyles, classNames) {
var rawClassName = '';
classNames.split(' ').forEach(function (className) {
if (registered[className] !== undefined) {
registeredStyles.push(registered[className] + ";");
} else {
rawClassName += className + " ";
}
});
return rawClassName;
}
var registerStyles = function registerStyles(cache, serialized, isStringTag) {
var className = cache.key + "-" + serialized.name;
if ( // we only need to add the styles to the registered cache if the
// class name could be used further down
// the tree but if it's a string tag, we know it won't
// so we don't have to add it to registered cache.
// this improves memory usage since we can avoid storing the whole style string
(isStringTag === false || // we need to always store it if we're in compat mode and
// in node since emotion-server relies on whether a style is in
// the registered cache to know whether a style is global or not
// also, note that this check will be dead code eliminated in the browser
isBrowser === false ) && cache.registered[className] === undefined) {
cache.registered[className] = serialized.styles;
}
};
var insertStyles = function insertStyles(cache, serialized, isStringTag) {
registerStyles(cache, serialized, isStringTag);
var className = cache.key + "-" + serialized.name;
if (cache.inserted[serialized.name] === undefined) {
var current = serialized;
do {
cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
current = current.next;
} while (current !== undefined);
}
};
/** Like react's useMemo but with guarantee that the fn
* won't be invoked again if deps hasn't change */
function useGuaranteedMemo(fn, deps) {
const ref = reactExports.useRef();
if (!ref.current ||
deps.length !== ref.current.prevDeps.length ||
ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0) {
ref.current = {
"v": fn(),
"prevDeps": [...deps],
};
}
return ref.current.v;
}
function matchCSSObject(arg) {
return (arg instanceof Object &&
!("styles" in arg) &&
!("length" in arg) &&
!("__emotion_styles" in arg));
}
const { createCssAndCx } = (() => {
function merge(registered, css, className) {
const registeredStyles = [];
const rawClassName = getRegisteredStyles(registered, registeredStyles, className);
if (registeredStyles.length < 2) {
return className;
}
return rawClassName + css(registeredStyles);
}
function createCssAndCx(params) {
const { cache } = params;
const css = (...args) => {
const serialized = serializeStyles(args, cache.registered);
insertStyles(cache, serialized, false);
const className = `${cache.key}-${serialized.name}`;
scope: {
const arg = args[0];
if (!matchCSSObject(arg)) {
break scope;
}
increaseSpecificityToTakePrecedenceOverMediaQueries.saveClassNameCSSObjectMapping(cache, className, arg);
}
return className;
};
const cx = (...args) => {
const className = classnames(args);
const feat27FixedClassnames = increaseSpecificityToTakePrecedenceOverMediaQueries.fixClassName(cache, className, css);
return merge(cache.registered, css, feat27FixedClassnames);
//return merge(cache.registered, css, className);
};
return { css, cx };
}
return { createCssAndCx };
})();
function createUseCssAndCx(params) {
const { useCache } = params;
function useCssAndCx() {
const cache = useCache();
const { css, cx } = useGuaranteedMemo(() => createCssAndCx({ cache }), [cache]);
return { css, cx };
}
return { useCssAndCx };
}
// https://github.com/garronej/tss-react/issues/27
const increaseSpecificityToTakePrecedenceOverMediaQueries = (() => {
const cssObjectMapByCache = new WeakMap();
return {
"saveClassNameCSSObjectMapping": (cache, className, cssObject) => {
let cssObjectMap = cssObjectMapByCache.get(cache);
if (cssObjectMap === undefined) {
cssObjectMap = new Map();
cssObjectMapByCache.set(cache, cssObjectMap);
}
cssObjectMap.set(className, cssObject);
},
"fixClassName": (() => {
function fix(classNameCSSObjects) {
let isThereAnyMediaQueriesInPreviousClasses = false;
return classNameCSSObjects.map(([className, cssObject]) => {
if (cssObject === undefined) {
return className;
}
let out;
if (!isThereAnyMediaQueriesInPreviousClasses) {
out = className;
for (const key in cssObject) {
if (key.startsWith("@media")) {
isThereAnyMediaQueriesInPreviousClasses = true;
break;
}
}
}
else {
out = {
"&&": cssObject,
};
}
return out;
});
}
return (cache, className, css) => {
const cssObjectMap = cssObjectMapByCache.get(cache);
return classnames(fix(className
.split(" ")
.map(className => [
className,
cssObjectMap === null || cssObjectMap === void 0 ? void 0 : cssObjectMap.get(className),
])).map(classNameOrCSSObject => typeof classNameOrCSSObject === "string"
? classNameOrCSSObject
: css(classNameOrCSSObject)));
};
})(),
};
})();
/* eslint-disable @typescript-eslint/no-explicit-any */
/**
* useEffect(
* ()=> { ... },
* [ { "foo": "bar" } ]
* )
* => The callback will be invoked every render.
* because { "foo": "bar" } is a new instance every render.
*
* useEffect(
* ()=> { ... },
* [ getDependencyArrayRef({ "foo": "bar" }) ]
* );
* => The callback will only be invoked once.
*
* The optimization will be enabled only if obj is
* of the form Record<string, string | number | undefined | null>
* overwise the object is returned (the function is the identity function).
*/
function getDependencyArrayRef(obj) {
if (!(obj instanceof Object) || typeof obj === "function") {
return obj;
}
const arr = [];
for (const key in obj) {
const value = obj[key];
const typeofValue = typeof value;
if (!(typeofValue === "string" ||
(typeofValue === "number" && !isNaN(value)) ||
typeofValue === "boolean" ||
value === undefined ||
value === null)) {
return obj;
}
arr.push(`${key}:${typeofValue}_${value}`);
}
return "xSqLiJdLMd9s" + arr.join("|");
}
/* eslint-disable @typescript-eslint/ban-types */
function mergeClasses(classesFromUseStyles, classesFromProps, cx) {
//NOTE: We use this test to be resilient in case classesFromProps is not of the expected type.
if (!(classesFromProps instanceof Object)) {
return classesFromUseStyles;
}
const out = {};
objectKeys(classesFromUseStyles).forEach(ruleName => (out[ruleName] = cx(classesFromUseStyles[ruleName], classesFromProps[ruleName])));
objectKeys(classesFromProps).forEach(ruleName => {
if (ruleName in classesFromUseStyles) {
return;
}
const className = classesFromProps[ruleName];
//...Same here, that why we don't do className === undefined
if (typeof className !== "string") {
return;
}
out[ruleName] = className;
});
return out;
}
/*
Based off glamor's StyleSheet, thanks Sunil ❤️
high performance StyleSheet for css-in-js systems
- uses multiple style tags behind the scenes for millions of rules
- uses `insertRule` for appending in production for *much* faster performance
// usage
import { StyleSheet } from '@emotion/sheet'
let styleSheet = new StyleSheet({ key: '', container: document.head })
styleSheet.insert('#box { border: 1px solid red; }')
- appends a css rule into the stylesheet
styleSheet.flush()
- empties the stylesheet of all its contents
*/
// $FlowFixMe
function sheetForTag(tag) {
if (tag.sheet) {
// $FlowFixMe
return tag.sheet;
} // this weirdness brought to you by firefox
/* istanbul ignore next */
for (var i = 0; i < document.styleSheets.length; i++) {
if (document.styleSheets[i].ownerNode === tag) {
// $FlowFixMe
return document.styleSheets[i];
}
}
}
function createStyleElement(options) {
var tag = document.createElement('style');
tag.setAttribute('data-emotion', options.key);
if (options.nonce !== undefined) {
tag.setAttribute('nonce', options.nonce);
}
tag.appendChild(document.createTextNode(''));
tag.setAttribute('data-s', '');
return tag;
}
var StyleSheet = /*#__PURE__*/function () {
// Using Node instead of HTMLElement since container may be a ShadowRoot
function StyleSheet(options) {
var _this = this;
this._insertTag = function (tag) {
var before;
if (_this.tags.length === 0) {
if (_this.insertionPoint) {
before = _this.insertionPoint.nextSibling;
} else if (_this.prepend) {
before = _this.container.firstChild;
} else {
before = _this.before;
}
} else {
before = _this.tags[_this.tags.length - 1].nextSibling;
}
_this.container.insertBefore(tag, before);
_this.tags.push(tag);
};
this.isSpeedy = options.speedy === undefined ? "production" === 'production' : options.speedy;
this.tags = [];
this.ctr = 0;
this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets
this.key = options.key;
this.container = options.container;
this.prepend = options.prepend;
this.insertionPoint = options.insertionPoint;
this.before = null;
}
var _proto = StyleSheet.prototype;
_proto.hydrate = function hydrate(nodes) {
nodes.forEach(this._insertTag);
};
_proto.insert = function insert(rule) {
// the max length is how many rules we have per style tag, it's 65000 in speedy mode
// it's 1 in dev because we insert source maps that map a single rule to a location
// and you can only have one source map per style tag
if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
this._insertTag(createStyleElement(this));
}
var tag = this.tags[this.tags.length - 1];
if (this.isSpeedy) {
var sheet = sheetForTag(tag);
try {
// this is the ultrafast version, works across browsers
// the big drawback is that the css won't be editable in devtools
sheet.insertRule(rule, sheet.cssRules.length);
} catch (e) {
}
} else {
tag.appendChild(document.createTextNode(rule));
}
this.ctr++;
};
_proto.flush = function flush() {
// $FlowFixMe
this.tags.forEach(function (tag) {
return tag.parentNode && tag.parentNode.removeChild(tag);
});
this.tags = [];
this.ctr = 0;
};
return StyleSheet;
}();
var MS = '-ms-';
var MOZ = '-moz-';
var WEBKIT = '-webkit-';
var COMMENT = 'comm';
var RULESET = 'rule';
var DECLARATION = 'decl';
var IMPORT = '@import';
var KEYFRAMES = '@keyframes';
/**
* @param {number}
* @return {number}
*/
var abs = Math.abs;
/**
* @param {number}
* @return {string}
*/
var from = String.fromCharCode;
/**
* @param {object}
* @return {object}
*/
var assign = Object.assign;
/**
* @param {string} value
* @param {number} length
* @return {number}
*/
function hash$2 (value, length) {
return charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0
}
/**
* @param {string} value
* @return {string}
*/
function trim (value) {
return value.trim()
}
/**
* @param {string} value
* @param {RegExp} pattern
* @return {string?}
*/
function match (value, pattern) {
return (value = pattern.exec(value)) ? value[0] : value
}
/**
* @param {string} value
* @param {(string|RegExp)} pattern
* @param {string} replacement
* @return {string}
*/
function replace (value, pattern, replacement) {
return value.replace(pattern, replacement)
}
/**
* @param {string} value
* @param {string} search
* @return {number}
*/
function indexof (value, search) {
return value.indexOf(search)
}
/**
* @param {string} value
* @param {number} index
* @return {number}
*/
function charat (value, index) {
return value.charCodeAt(index) | 0
}
/**
* @param {string} value
* @param {number} begin
* @param {number} end
* @return {string}
*/
function substr (value, begin, end) {
return value.slice(begin, end)
}
/**
* @param {string} value
* @return {number}
*/
function strlen (value) {
return value.length
}
/**
* @param {any[]} value
* @return {number}
*/
function sizeof (value) {
return value.length
}
/**
* @param {any} value
* @param {any[]} array
* @return {any}
*/
function append (value, array) {
return array.push(value), value
}
/**
* @param {string[]} array
* @param {function} callback
* @return {string}
*/
function combine (array, callback) {
return array.map(callback).join('')
}
var line = 1;
var column = 1;
var length = 0;
var position = 0;
var character = 0;
var characters = '';
/**
* @param {string} value
* @param {object | null} root
* @param {object | null} parent
* @param {string} type
* @param {string[] | string} props
* @param {object[] | string} children
* @param {number} length
*/
function node (value, root, parent, type, props, children, length) {
return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}
}
/**
* @param {object} root
* @param {object} props
* @return {object}
*/
function copy (root, props) {
return assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)
}
/**
* @return {number}
*/
function char () {
return character
}
/**
* @return {number}
*/
function prev () {
character = position > 0 ? charat(characters, --position) : 0;
if (column--, character === 10)
column = 1, line--;
return character
}
/**
* @return {number}
*/
function next () {
character = position < length ? charat(characters, position++) : 0;
if (column++, character === 10)
column = 1, line++;
return character
}
/**
* @return {number}
*/
function peek () {
return charat(characters, position)
}
/**
* @return {number}
*/
function caret () {
return position
}
/**
* @param {number} begin
* @param {number} end
* @return {string}
*/
function slice$1 (begin, end) {
return substr(characters, begin, end)
}
/**
* @param {number} type
* @return {number}
*/
function token (type) {
switch (type) {
// \0 \t \n \r \s whitespace token
case 0: case 9: case 10: case 13: case 32:
return 5
// ! + , / > @ ~ isolate token
case 33: case 43: case 44: case 47: case 62: case 64: case 126:
// ; { } breakpoint token
case 59: case 123: case 125:
return 4
// : accompanied token
case 58:
return 3
// " ' ( [ opening delimit token
case 34: case 39: case 40: case 91:
return 2
// ) ] closing delimit token
case 41: case 93:
return 1
}
return 0
}
/**
* @param {string} value
* @return {any[]}
*/
function alloc (value) {
return line = column = 1, length = strlen(characters = value), position = 0, []
}
/**
* @param {any} value
* @return {any}
*/
function dealloc (value) {
return characters = '', value
}
/**
* @param {number} type
* @return {string}
*/
function delimit (type) {
return trim(slice$1(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
}
/**
* @param {number} type
* @return {string}
*/
function whitespace (type) {
while (character = peek())
if (character < 33)
next();
else
break
return token(type) > 2 || token(character) > 3 ? '' : ' '
}
/**
* @param {number} index
* @param {number} count
* @return {string}
*/
function escaping (index, count) {
while (--count && next())
// not 0-9 A-F a-f
if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
break
return slice$1(index, caret() + (count < 6 && peek() == 32 && next() == 32))
}
/**
* @param {number} type
* @return {number}
*/
function delimiter (type) {
while (next())
switch (character) {
// ] ) " '
case type:
return position
// " '
case 34: case 39:
if (type !== 34 && type !== 39)
delimiter(character);
break
// (
case 40:
if (type === 41)
delimiter(type);
break
// \
case 92:
next();
break
}
return position
}
/**
* @param {number} type
* @param {number} index
* @return {number}
*/
function commenter (type, index) {
while (next())
// //
if (type + character === 47 + 10)
break
// /*
else if (type + character === 42 + 42 && peek() === 47)
break
return '/*' + slice$1(index, position - 1) + '*' + from(type === 47 ? type : next())
}
/**
* @param {number} index
* @return {string}
*/
function identifier (index) {
while (!token(peek()))
next();
return slice$1(index, position)
}
/**
* @param {string} value
* @return {object[]}
*/
function compile (value) {
return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {string[]} rule
* @param {string[]} rules
* @param {string[]} rulesets
* @param {number[]} pseudo
* @param {number[]} points
* @param {string[]} declarations
* @return {object}
*/
function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
var index = 0;
var offset = 0;
var length = pseudo;
var atrule = 0;
var property = 0;
var previous = 0;
var variable = 1;
var scanning = 1;
var ampersand = 1;
var character = 0;
var type = '';
var props = rules;
var children = rulesets;
var reference = rule;
var characters = type;
while (scanning)
switch (previous = character, character = next()) {
// (
case 40:
if (previous != 108 && charat(characters, length - 1) == 58) {
if (indexof(characters += replace(delimit(character), '&', '&\f'), '&\f') != -1)
ampersand = -1;
break
}
// " ' [
case 34: case 39: case 91:
characters += delimit(character);
break
// \t \n \r \s
case 9: case 10: case 13: case 32:
characters += whitespace(previous);
break
// \
case 92:
characters += escaping(caret() - 1, 7);
continue
// /
case 47:
switch (peek()) {
case 42: case 47:
append(comment(commenter(next(), caret()), root, parent), declarations);
break
default:
characters += '/';
}
break
// {
case 123 * variable:
points[index++] = strlen(characters) * ampersand;
// } ; \0
case 125 * variable: case 59: case 0:
switch (character) {
// \0 }
case 0: case 125: scanning = 0;
// ;
case 59 + offset:
if (property > 0 && (strlen(characters) - length))
append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations);
break
// @ ;
case 59: characters += ';';
// { rule/at-rule
default:
append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets);
if (character === 123)
if (offset === 0)
parse(characters, root, reference, reference, props, rulesets, length, points, children);
else
switch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {
// d m s
case 100: case 109: case 115:
parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children);
break
default:
parse(characters, reference, reference, reference, [''], children, 0, points, children);
}
}
index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo;
break
// :
case 58:
length = 1 + strlen(characters), property = previous;
default:
if (variable < 1)
if (character == 123)
--variable;
else if (character == 125 && variable++ == 0 && prev() == 125)
continue
switch (characters += from(character), character * variable) {
// &
case 38:
ampersand = offset > 0 ? 1 : (characters += '\f', -1);
break
// ,
case 44:
points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1;
break
// @
case 64:
// -
if (peek() === 45)
characters += delimit(next());
atrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++;
break
// -
case 45:
if (previous === 45 && strlen(characters) == 2)
variable = 0;
}
}
return rulesets
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {number} index
* @param {number} offset
* @param {string[]} rules
* @param {number[]} points
* @param {string} type
* @param {string[]} props
* @param {string[]} children
* @param {number} length
* @return {object}
*/
function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {
var post = offset - 1;
var rule = offset === 0 ? rules : [''];
var size = sizeof(rule);
for (var i = 0, j = 0, k = 0; i < index; ++i)
for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)
if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\f/g, rule[x])))
props[k++] = z;
return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length)
}
/**
* @param {number} value
* @param {object} root
* @param {object?} parent
* @return {object}
*/
function comment (value, root, parent) {
return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0)
}
/**
* @param {string} value
* @param {object} root
* @param {object?} parent
* @param {number} length
* @return {object}
*/
function declaration (value, root, parent, length) {
return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length)
}
/**
* @param {object[]} children
* @param {function} callback
* @return {string}
*/
function serialize (children, callback) {
var output = '';
var length = sizeof(children);
for (var i = 0; i < length; i++)
output += callback(children[i], i, children, callback) || '';
return output
}
/**
* @param {object} element
* @param {number} index
* @param {object[]} children
* @param {function} callback
* @return {string}
*/
function stringify (element, index, children, callback) {
switch (element.type) {
case IMPORT: case DECLARATION: return element.return = element.return || element.value
case COMMENT: return ''
case KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'
case RULESET: element.value = element.props.join(',');
}
return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
}
/**
* @param {function[]} collection
* @return {function}
*/
function middleware (collection) {
var length = sizeof(collection);
return function (element, index, children, callback) {
var output = '';
for (var i = 0; i < length; i++)
output += collection[i](element, index, children, callback) || '';
return output
}
}
/**
* @param {function} callback
* @return {function}
*/
function rulesheet (callback) {
return function (element) {
if (!element.root)
if (element = element.return)
callback(element);
}
}
var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {
var previous = 0;
var character = 0;
while (true) {
previous = character;
character = peek(); // &\f
if (previous === 38 && character === 12) {
points[index] = 1;
}
if (token(character)) {
break;
}
next();
}
return slice$1(begin, position);
};
var toRules = function toRules(parsed, points) {
// pretend we've started with a comma
var index = -1;
var character = 44;
do {
switch (token(character)) {
case 0:
// &\f
if (character === 38 && peek() === 12) {
// this is not 100% correct, we don't account for literal sequences here - like for example quoted strings
// stylis inserts \f after & to know when & where it should replace this sequence with the context selector
// and when it should just concatenate the outer and inner selectors
// it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here
points[index] = 1;
}
parsed[index] += identifierWithPointTracking(position - 1, points, index);
break;
case 2:
parsed[index] += delimit(character);
break;
case 4:
// comma
if (character === 44) {
// colon
parsed[++index] = peek() === 58 ? '&\f' : '';
points[index] = parsed[index].length;
break;
}
// fallthrough
default:
parsed[index] += from(character);
}
} while (character = next());
return parsed;
};
var getRules = function getRules(value, points) {
return dealloc(toRules(alloc(value), points));
}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11
var fixedElements = /* #__PURE__ */new WeakMap();
var compat = function compat(element) {
if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo
// negative .length indicates that this rule has been already prefixed
element.length < 1) {
return;
}
var value = element.value,
parent = element.parent;
var isImplicitRule = element.column === parent.column && element.line === parent.line;
while (parent.type !== 'rule') {
parent = parent.parent;
if (!parent) return;
} // short-circuit for the simplest case
if (element.props.length === 1 && value.charCodeAt(0) !== 58
/* colon */
&& !fixedElements.get(parent)) {
return;
} // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)
// then the props has already been manipulated beforehand as they that array is shared between it and its "rule parent"
if (isImplicitRule) {
return;
}
fixedElements.set(element, true);
var points = [];
var rules = getRules(value, points);
var parentRules = parent.props;
for (var i = 0, k = 0; i < rules.length; i++) {
for (var j = 0; j < parentRules.length; j++, k++) {
element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i];
}
}
};
var removeLabel = function removeLabel(element) {
if (element.type === 'decl') {
var value = element.value;
if ( // charcode for l
value.charCodeAt(0) === 108 && // charcode for b
value.charCodeAt(2) === 98) {
// this ignores label
element["return"] = '';
element.value = '';
}
}
};
/* eslint-disable no-fallthrough */
function prefix(value, length) {
switch (hash$2(value, length)) {
// color-adjust
case 5103:
return WEBKIT + 'print-' + value + value;
// animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
case 5737:
case 4201:
case 3177:
case 3433:
case 1641:
case 4457:
case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
case 5572:
case 6356:
case 5844:
case 3191:
case 6645:
case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
case 6391:
case 5879:
case 5623:
case 6135:
case 4599:
case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
case 4215:
case 6389:
case 5109:
case 5365:
case 5621:
case 3829:
return WEBKIT + value + value;
// appearance, user-select, transform, hyphens, text-size-adjust
case 5349:
case 4246:
case 4810:
case 6968:
case 2756:
return WEBKIT + value + MOZ + value + MS + value + value;
// flex, flex-direction
case 6828:
case 4268:
return WEBKIT + value + MS + value + value;
// order
case 6165:
return WEBKIT + value + MS + 'flex-' + value + value;
// align-items
case 5187:
return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;
// align-self
case 5443:
return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;
// align-content
case 4675:
return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;
// flex-shrink
case 5548:
return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;
// flex-basis
case 5292:
return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;
// flex-grow
case 6060:
return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;
// transition
case 4554:
return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;
// cursor
case 6187:
return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;
// background, background-image
case 5495:
case 3959:
return replace(value, /(image-set\([^]*)/, WEBKIT + '$1' + '$`$1');
// justify-content
case 4968:
return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;
// (margin|padding)-inline-(start|end)
case 4095:
case 3583:
case 4068:
case 2532:
return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;
// (min|max)?(width|height|inline-size|block-size)
case 8116:
case 7059:
case 5753:
case 5535:
case 5445:
case 5701:
case 4933:
case 4677:
case 5533:
case 5789:
case 5021:
case 4765:
// stretch, max-content, min-content, fill-available
if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {
// (m)ax-content, (m)in-content
case 109:
// -
if (charat(value, length + 4) !== 45) break;
// (f)ill-available, (f)it-content
case 102:
return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
// (s)tretch
case 115:
return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;
}
break;
// position: sticky
case 4949:
// (s)ticky?
if (charat(value, length + 1) !== 115) break;
// display: (flex|inline-flex)
case 6444:
switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
// stic(k)y
case 107:
return replace(value, ':', ':' + WEBKIT) + value;
// (inline-)?fl(e)x
case 101:
return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;
}
break;
// writing-mode
case 5936:
switch (charat(value, length + 11)) {
// vertical-l(r)
case 114:
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
// vertical-r(l)
case 108:
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
// horizontal(-)tb
case 45:
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
}
return WEBKIT + value + MS + value + value;
}
return value;
}
var prefixer = function prefixer(element, index, children, callback) {
if (element.length > -1) if (!element["return"]) switch (element.type) {
case DECLARATION:
element["return"] = prefix(element.value, element.length);
break;
case KEYFRAMES:
return serialize([copy(element, {
value: replace(element.value, '@', '@' + WEBKIT)
})], callback);
case RULESET:
if (element.length) return combine(element.props, function (value) {
switch (match(value, /(::plac\w+|:read-\w+)/)) {
// :read-(only|write)
case ':read-only':
case ':read-write':
return serialize([copy(element, {
props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]
})], callback);
// :placeholder
case '::placeholder':
return serialize([copy(element, {
props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]
}), copy(element, {
props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]
}), copy(element, {
props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]
})], callback);
}
return '';
});
}
};
var defaultStylisPlugins = [prefixer];
var createCache = function createCache(options) {
var key = options.key;
if ( key === 'css') {
var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])"); // get SSRed styles out of the way of React's hydration
// document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)
// note this very very intentionally targets all style elements regardless of the key to ensure
// that creating a cache works inside of render of a React component
Array.prototype.forEach.call(ssrStyles, function (node) {
// we want to only move elements which have a space in the data-emotion attribute value
// because that indicates that it is an Emotion 11 server-side rendered style elements
// while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector
// Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)
// so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles
// will not result in the Emotion 10 styles being destroyed
var dataEmotionAttribute = node.getAttribute('data-emotion');
if (dataEmotionAttribute.indexOf(' ') === -1) {
return;
}
document.head.appendChild(node);
node.setAttribute('data-s', '');
});
}
var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;
var inserted = {};
var container;
var nodesToHydrate = [];
{
container = options.container || document.head;
Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which
// means that the style elements we're looking at are only Emotion 11 server-rendered style elements
document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
for (var i = 1; i < attrib.length; i++) {
inserted[attrib[i]] = true;
}
nodesToHydrate.push(node);
});
}
var _insert;
var omnipresentPlugins = [compat, removeLabel];
{
var currentSheet;
var finalizingPlugins = [stringify, rulesheet(function (rule) {
currentSheet.insert(rule);
})];
var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));
var stylis = function stylis(styles) {
return serialize(compile(styles), serializer);
};
_insert = function insert(selector, serialized, sheet, shouldCache) {
currentSheet = sheet;
stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
if (shouldCache) {
cache.inserted[serialized.name] = true;
}
};
}
var cache = {
key: key,
sheet: new StyleSheet({
key: key,
container: container,
nonce: options.nonce,
speedy: options.speedy,
prepend: options.prepend,
insertionPoint: options.insertionPoint
}),
nonce: options.nonce,
inserted: inserted,
registered: {},
insert: _insert
};
cache.sheet.hydrate(nodesToHydrate);
return cache;
};
var syncFallback = function syncFallback(create) {
return create();
};
var useInsertionEffect = React$1['useInsertion' + 'Effect'] ? React$1['useInsertion' + 'Effect'] : false;
var useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;
var useInsertionEffectWithLayoutFallback = useInsertionEffect || reactExports.useLayoutEffect;
var EmotionCacheContext = /* #__PURE__ */reactExports.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 !== 'undefined' ? /* #__PURE__ */createCache({
key: 'css'
}) : null);
EmotionCacheContext.Provider;
var __unsafe_useEmotionCache = function useEmotionCache() {
return reactExports.useContext(EmotionCacheContext);
};
var withEmotionCache = function withEmotionCache(func) {
// $FlowFixMe
return /*#__PURE__*/reactExports.forwardRef(function (props, ref) {
// the cache will never be null in the browser
var cache = reactExports.useContext(EmotionCacheContext);
return func(props, cache, ref);
});
};
var ThemeContext$2 = /* #__PURE__ */reactExports.createContext({});
// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
// initial client-side render from SSR, use place of hydrating tag
var Global = /* #__PURE__ */withEmotionCache(function (props, cache) {
var styles = props.styles;
var serialized = serializeStyles([styles], undefined, reactExports.useContext(ThemeContext$2));
// but it is based on a constant that will never change at runtime
// it's effectively like having two implementations and switching them out
// so it's not actually breaking anything
var sheetRef = reactExports.useRef();
useInsertionEffectWithLayoutFallback(function () {
var key = cache.key + "-global"; // use case of https://github.com/emotion-js/emotion/issues/2675
var sheet = new cache.sheet.constructor({
key: key,
nonce: cache.sheet.nonce,
container: cache.sheet.container,
speedy: cache.sheet.isSpeedy
});
var rehydrating = false; // $FlowFixMe
var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
if (cache.sheet.tags.length) {
sheet.before = cache.sheet.tags[0];
}
if (node !== null) {
rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
node.setAttribute('data-emotion', key);
sheet.hydrate([node]);
}
sheetRef.current = [sheet, rehydrating];
return function () {
sheet.flush();
};
}, [cache]);
useInsertionEffectWithLayoutFallback(function () {
var sheetRefCurrent = sheetRef.current;
var sheet = sheetRefCurrent[0],
rehydrating = sheetRefCurrent[1];
if (rehydrating) {
sheetRefCurrent[1] = false;
return;
}
if (serialized.next !== undefined) {
// insert keyframes
insertStyles(cache, serialized.next, true);
}
if (sheet.tags.length) {
// if this doesn't exist then it will be null so the style element will be appended
var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
sheet.before = element;
sheet.flush();
}
cache.insert("", serialized, sheet, false);
}, [cache, serialized.name]);
return null;
});
function css() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return serializeStyles(args);
}
var keyframes = function keyframes() {
var insertable = css.apply(void 0, arguments);
var name = "animation-" + insertable.name; // $FlowFixMe
return {
name: name,
styles: "@keyframes " + name + "{" + insertable.styles + "}",
anim: 1,
toString: function toString() {
return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
}
};
};
let counter = 0;
function createMakeStyles(params) {
const { useTheme, cache: cacheProvidedAtInception } = params;
function useCache() {
var _a;
const contextualCache = __unsafe_useEmotionCache();
const cacheExplicitlyProvidedForTss = useCacheProvidedByProvider();
const cacheToBeUsed = (_a = cacheProvidedAtInception !== null && cacheProvidedAtInception !== void 0 ? cacheProvidedAtInception : cacheExplicitlyProvidedForTss) !== null && _a !== void 0 ? _a : contextualCache;
if (cacheToBeUsed === null) {
throw new Error([
"In order to get SSR working with tss-react you need to explicitly provide an Emotion cache.",
"MUI users be aware: This is not an error strictly related to tss-react, with or without tss-react,",
"MUI needs an Emotion cache to be provided for SSR to work.",
"Here is the MUI documentation related to SSR setup: https://mui.com/material-ui/guides/server-rendering/",
"TSS provides helper that makes the process of setting up SSR easier: https://docs.tss-react.dev/ssr",
].join("\n"));
}
return cacheToBeUsed;
}
const { useCssAndCx } = createUseCssAndCx({ useCache });
/** returns useStyle. */
function makeStyles(params) {
const { name: nameOrWrappedName, uniqId = counter++ } = params !== null && params !== void 0 ? params : {};
const name = typeof nameOrWrappedName !== "object"
? nameOrWrappedName
: Object.keys(nameOrWrappedName)[0];
return function (cssObjectByRuleNameOrGetCssObjectByRuleName) {
const getCssObjectByRuleName = typeof cssObjectByRuleNameOrGetCssObjectByRuleName ===
"function"
? cssObjectByRuleNameOrGetCssObjectByRuleName
: () => cssObjectByRuleNameOrGetCssObjectByRuleName;
return function useStyles(params, styleOverrides) {
var _a, _b;
const theme = useTheme();
const { css, cx } = useCssAndCx();
const cache = useCache();
let classes = reactExports.useMemo(() => {
const refClassesCache = {};
const refClasses = typeof Proxy !== "undefined" &&
new Proxy({}, {
"get": (_target, propertyKey) => {
if (typeof propertyKey === "symbol") {
assert(false);
}
return (refClassesCache[propertyKey] = `${cache.key}-${uniqId}${name !== undefined ? `-${name}` : ""}-${propertyKey}-ref`);
},
});
const cssObjectByRuleName = getCssObjectByRuleName(theme, params, refClasses || {});
const classes = objectFromEntries(objectKeys(cssObjectByRuleName).map(ruleName => {
const cssObject = cssObjectByRuleName[ruleName];
if (!cssObject.label) {
cssObject.label = `${name !== undefined ? `${name}-` : ""}${ruleName}`;
}
return [
ruleName,
`${css(cssObject)}${typeGuard(ruleName, ruleName in refClassesCache)
? ` ${refClassesCache[ruleName]}`
: ""}`,
];
}));
objectKeys(refClassesCache).forEach(ruleName => {
if (ruleName in classes) {
return;
}
classes[ruleName] =
refClassesCache[ruleName];
});
return classes;
}, [cache, css, cx, theme, getDependencyArrayRef(params)]);
const propsClasses = styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props.classes;
classes = reactExports.useMemo(() => mergeClasses(classes, propsClasses, cx), [classes, getDependencyArrayRef(propsClasses), cx]);
{
let cssObjectByRuleNameOrGetCssObjectByRuleName = undefined;
try {
cssObjectByRuleNameOrGetCssObjectByRuleName =
name !== undefined
? (_b = (_a = theme.components) === null || _a === void 0 ? void 0 : _a[name]) === null || _b === void 0 ? void 0 : _b.styleOverrides
: undefined;
// eslint-disable-next-line no-empty
}
catch (_c) { }
const themeClasses = reactExports.useMemo(() => {
if (!cssObjectByRuleNameOrGetCssObjectByRuleName) {
return undefined;
}
const themeClasses = {};
for (const ruleName in cssObjectByRuleNameOrGetCssObjectByRuleName) {
const cssObjectOrGetCssObject = cssObjectByRuleNameOrGetCssObjectByRuleName[ruleName];
if (!(cssObjectOrGetCssObject instanceof Object)) {
continue;
}
themeClasses[ruleName] = css(typeof cssObjectOrGetCssObject === "function"
? cssObjectOrGetCssObject(Object.assign({ theme, "ownerState": styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState }, styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props))
: cssObjectOrGetCssObject);
}
return themeClasses;
}, [
cssObjectByRuleNameOrGetCssObjectByRuleName ===
undefined
? undefined
: JSON.stringify(cssObjectByRuleNameOrGetCssObjectByRuleName),
getDependencyArrayRef(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props),
getDependencyArrayRef(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState),
css,
]);
classes = reactExports.useMemo(() => mergeClasses(classes, themeClasses, cx), [classes, themeClasses, cx]);
}
return {
classes,
theme,
css,
cx,
};
};
};
}
function useStyles() {
const theme = useTheme();
const { css, cx } = useCssAndCx();
return { theme, css, cx };
}
return { makeStyles, useStyles };
}
const reactContext = reactExports.createContext(undefined);
function useCacheProvidedByProvider() {
const cacheExplicitlyProvidedForTss = reactExports.useContext(reactContext);
return cacheExplicitlyProvidedForTss;
}
/** @see <https://docs.tsafe.dev/capitalize> */
function capitalize$1(str) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return (str.charAt(0).toUpperCase() + str.slice(1));
}
var __rest = (globalThis && globalThis.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
function createWithStyles(params) {
const { useTheme, cache } = params;
const { makeStyles } = createMakeStyles({ useTheme, cache });
function withStyles(Component, cssObjectByRuleNameOrGetCssObjectByRuleName, params) {
const Component_ = typeof Component === "string"
? (() => {
const tag = Component;
const Out = function (_a) {
var { children } = _a, props = __rest(_a, ["children"]);
return reactExports.createElement(tag, props, children);
};
Object.defineProperty(Out, "name", {
"value": capitalize$1(tag),
});
return Out;
})()
: Component;
/**
* Get component name for wrapping
* @see https://reactjs.org/docs/higher-order-components.html#convention-wrap-the-display-name-for-easy-debugging
*/
const name = (() => {
{
const { name: nameOrWrappedName } = params !== null && params !== void 0 ? params : {};
if (nameOrWrappedName !== undefined) {
return typeof nameOrWrappedName !== "object"
? nameOrWrappedName
: Object.keys(nameOrWrappedName)[0];
}
}
{
const displayName = Component_.displayName;
if (typeof displayName === "string" && displayName !== "") {
return displayName;
}
}
{
const { name } = Component_;
if (name) {
return name;
}
}
})();
const useStyles = makeStyles(Object.assign(Object.assign({}, params), { name }))(typeof cssObjectByRuleNameOrGetCssObjectByRuleName === "function"
? (theme, props, classes) => incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName(theme, props, classes))
: incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName));
function getHasNonRootClasses(classes) {
for (const name in classes) {
if (name === "root") {
continue;
}
return true;
}
return false;
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const Out = reactExports.forwardRef(function (props, ref) {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { className, classes: _classes } = props, rest = __rest(props, ["className", "classes"]);
const { classes, cx } = useStyles(props, { props });
return (React.createElement(Component_, Object.assign({ ref: ref, className: getHasNonRootClasses(classes)
? className
: cx(classes.root, className) }, (typeof Component === "string" ? {} : { classes }), rest)));
});
if (name !== undefined) {
Out.displayName = `${capitalize$1(name)}WithStyles`;
Object.defineProperty(Out, "name", { "value": Out.displayName });
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return Out;
}
return { withStyles };
}
function incorporateMediaQueries(cssObjectByRuleNameWithMediaQueries) {
const cssObjectByRuleName = {};
const cssObjectByRuleNameWithMediaQueriesByMediaQuery = {};
Object.keys(cssObjectByRuleNameWithMediaQueries).forEach(ruleNameOrMediaQuery => ((ruleNameOrMediaQuery.startsWith("@media")
? cssObjectByRuleNameWithMediaQueriesByMediaQuery
: cssObjectByRuleName)[ruleNameOrMediaQuery] =
cssObjectByRuleNameWithMediaQueries[ruleNameOrMediaQuery]));
Object.keys(cssObjectByRuleNameWithMediaQueriesByMediaQuery).forEach(mediaQuery => {
const cssObjectByRuleNameBis = cssObjectByRuleNameWithMediaQueriesByMediaQuery[mediaQuery];
Object.keys(cssObjectByRuleNameBis).forEach(ruleName => {
var _a;
return (cssObjectByRuleName[ruleName] = Object.assign(Object.assign({}, ((_a = cssObjectByRuleName[ruleName]) !== null && _a !== void 0 ? _a : {})), { [mediaQuery]: cssObjectByRuleNameBis[ruleName] }));
});
});
return cssObjectByRuleName;
}
function GlobalStyles$2(props) {
const { styles } = props;
return React.createElement(Global, { styles: css(styles) });
}
/** @see <https://docs.tss-react.dev/api/makestyles> */
function createMakeAndWithStyles(params) {
return Object.assign(Object.assign({}, createMakeStyles(params)), createWithStyles(params));
}
const common = {
black: '#000',
white: '#fff'
};
const common$1 = common;
const red = {
50: '#ffebee',
100: '#ffcdd2',
200: '#ef9a9a',
300: '#e57373',
400: '#ef5350',
500: '#f44336',
600: '#e53935',
700: '#d32f2f',
800: '#c62828',
900: '#b71c1c',
A100: '#ff8a80',
A200: '#ff5252',
A400: '#ff1744',
A700: '#d50000'
};
const red$1 = red;
const purple = {
50: '#f3e5f5',
100: '#e1bee7',
200: '#ce93d8',
300: '#ba68c8',
400: '#ab47bc',
500: '#9c27b0',
600: '#8e24aa',
700: '#7b1fa2',
800: '#6a1b9a',
900: '#4a148c',
A100: '#ea80fc',
A200: '#e040fb',
A400: '#d500f9',
A700: '#aa00ff'
};
const purple$1 = purple;
const blue = {
50: '#e3f2fd',
100: '#bbdefb',
200: '#90caf9',
300: '#64b5f6',
400: '#42a5f5',
500: '#2196f3',
600: '#1e88e5',
700: '#1976d2',
800: '#1565c0',
900: '#0d47a1',
A100: '#82b1ff',
A200: '#448aff',
A400: '#2979ff',
A700: '#2962ff'
};
const blue$1 = blue;
const lightBlue = {
50: '#e1f5fe',
100: '#b3e5fc',
200: '#81d4fa',
300: '#4fc3f7',
400: '#29b6f6',
500: '#03a9f4',
600: '#039be5',
700: '#0288d1',
800: '#0277bd',
900: '#01579b',
A100: '#80d8ff',
A200: '#40c4ff',
A400: '#00b0ff',
A700: '#0091ea'
};
const lightBlue$1 = lightBlue;
const green = {
50: '#e8f5e9',
100: '#c8e6c9',
200: '#a5d6a7',
300: '#81c784',
400: '#66bb6a',
500: '#4caf50',
600: '#43a047',
700: '#388e3c',
800: '#2e7d32',
900: '#1b5e20',
A100: '#b9f6ca',
A200: '#69f0ae',
A400: '#00e676',
A700: '#00c853'
};
const green$1 = green;
const orange = {
50: '#fff3e0',
100: '#ffe0b2',
200: '#ffcc80',
300: '#ffb74d',
400: '#ffa726',
500: '#ff9800',
600: '#fb8c00',
700: '#f57c00',
800: '#ef6c00',
900: '#e65100',
A100: '#ffd180',
A200: '#ffab40',
A400: '#ff9100',
A700: '#ff6d00'
};
const orange$1 = orange;
const grey = {
50: '#fafafa',
100: '#f5f5f5',
200: '#eeeeee',
300: '#e0e0e0',
400: '#bdbdbd',
500: '#9e9e9e',
600: '#757575',
700: '#616161',
800: '#424242',
900: '#212121',
A100: '#f5f5f5',
A200: '#eeeeee',
A400: '#bdbdbd',
A700: '#616161'
};
const grey$1 = grey;
function isPlainObject(item) {
return item !== null && typeof item === 'object' && item.constructor === Object;
}
function deepClone(source) {
if (!isPlainObject(source)) {
return source;
}
const output = {};
Object.keys(source).forEach(key => {
output[key] = deepClone(source[key]);
});
return output;
}
function deepmerge(target, source, options = {
clone: true
}) {
const output = options.clone ? _extends({}, target) : target;
if (isPlainObject(target) && isPlainObject(source)) {
Object.keys(source).forEach(key => {
// Avoid prototype pollution
if (key === '__proto__') {
return;
}
if (isPlainObject(source[key]) && key in target && isPlainObject(target[key])) {
// Since `output` is a clone of `target` and we have narrowed `target` in this block we can cast to the same type.
output[key] = deepmerge(target[key], source[key], options);
} else if (options.clone) {
output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];
} else {
output[key] = source[key];
}
});
}
return output;
}
var propTypesExports = {};
var propTypes = {
get exports(){ return propTypesExports; },
set exports(v){ propTypesExports = v; },
};
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ReactPropTypesSecret$1 = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
var ReactPropTypesSecret_1 = ReactPropTypesSecret$1;
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ReactPropTypesSecret = ReactPropTypesSecret_1;
function emptyFunction() {}
function emptyFunctionWithReset() {}
emptyFunctionWithReset.resetWarningCache = emptyFunction;
var factoryWithThrowingShims = function() {
function shim(props, propName, componentName, location, propFullName, secret) {
if (secret === ReactPropTypesSecret) {
// It is still safe when called from React.
return;
}
var err = new Error(
'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
'Use PropTypes.checkPropTypes() to call them. ' +
'Read more at http://fb.me/use-check-prop-types'
);
err.name = 'Invariant Violation';
throw err;
} shim.isRequired = shim;
function getShim() {
return shim;
} // Important!
// Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
var ReactPropTypes = {
array: shim,
bigint: shim,
bool: shim,
func: shim,
number: shim,
object: shim,
string: shim,
symbol: shim,
any: shim,
arrayOf: getShim,
element: shim,
elementType: shim,
instanceOf: getShim,
node: shim,
objectOf: getShim,
oneOf: getShim,
oneOfType: getShim,
shape: getShim,
exact: getShim,
checkPropTypes: emptyFunctionWithReset,
resetWarningCache: emptyFunction
};
ReactPropTypes.PropTypes = ReactPropTypes;
return ReactPropTypes;
};
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
{
// By explicitly using `prop-types` you are opting into new production behavior.
// http://fb.me/prop-types-in-prod
propTypes.exports = factoryWithThrowingShims();
}
/**
* WARNING: Don't import this directly.
* Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.
* @param {number} code
*/
function formatMuiErrorMessage(code) {
// Apply babel-plugin-transform-template-literals in loose mode
// loose mode is safe iff we're concatenating primitives
// see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose
/* eslint-disable prefer-template */
let url = 'https://mui.com/production-error/?code=' + code;
for (let i = 1; i < arguments.length; i += 1) {
// rest params over-transpile for this case
// eslint-disable-next-line prefer-rest-params
url += '&args[]=' + encodeURIComponent(arguments[i]);
}
return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';
/* eslint-enable prefer-template */
}
// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.
//
// A strict capitalization should uppercase the first letter of each word in the sentence.
// We only handle the first word.
function capitalize(string) {
if (typeof string !== 'string') {
throw new Error(formatMuiErrorMessage(7));
}
return string.charAt(0).toUpperCase() + string.slice(1);
}
/**
* Safe chained function.
*
* Will only create a new function if needed,
* otherwise will pass back existing functions or null.
*/
function createChainedFunction(...funcs) {
return funcs.reduce((acc, func) => {
if (func == null) {
return acc;
}
return function chainedFunction(...args) {
acc.apply(this, args);
func.apply(this, args);
};
}, () => {});
}
// Corresponds to 10 frames at 60 Hz.
// A few bytes payload overhead when lodash/debounce is ~3 kB and debounce ~300 B.
function debounce$1(func, wait = 166) {
let timeout;
function debounced(...args) {
const later = () => {
func.apply(this, args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
}
debounced.clear = () => {
clearTimeout(timeout);
};
return debounced;
}
function deprecatedPropType(validator, reason) {
{
return () => null;
}
}
function isMuiElement(element, muiNames) {
return /*#__PURE__*/reactExports.isValidElement(element) && muiNames.indexOf(element.type.muiName) !== -1;
}
function ownerDocument(node) {
return node && node.ownerDocument || document;
}
function ownerWindow(node) {
const doc = ownerDocument(node);
return doc.defaultView || window;
}
function requirePropFactory(componentNameInError, Component) {
{
return () => null;
}
}
/**
* TODO v5: consider making it private
*
* passes {value} to {ref}
*
* WARNING: Be sure to only call this inside a callback that is passed as a ref.
* Otherwise, make sure to cleanup the previous {ref} if it changes. See
* https://github.com/mui/material-ui/issues/13539
*
* Useful if you want to expose the ref of an inner component to the public API
* while still using it inside the component.
* @param ref A ref callback or ref object. If anything falsy, this is a no-op.
*/
function setRef(ref, value) {
if (typeof ref === 'function') {
ref(value);
} else if (ref) {
ref.current = value;
}
}
const useEnhancedEffect = typeof window !== 'undefined' ? reactExports.useLayoutEffect : reactExports.useEffect;
const useEnhancedEffect$1 = useEnhancedEffect;
let globalId = 0;
function useGlobalId(idOverride) {
const [defaultId, setDefaultId] = reactExports.useState(idOverride);
const id = idOverride || defaultId;
reactExports.useEffect(() => {
if (defaultId == null) {
// Fallback to this default id when possible.
// Use the incrementing value for client-side rendering only.
// We can't use it server-side.
// If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
globalId += 1;
setDefaultId(`mui-${globalId}`);
}
}, [defaultId]);
return id;
}
// eslint-disable-next-line no-useless-concat -- Workaround for https://github.com/webpack/webpack/issues/14814
const maybeReactUseId = React$1['useId' + ''];
/**
*
* @example <div id={useId()} />
* @param idOverride
* @returns {string}
*/
function useId(idOverride) {
if (maybeReactUseId !== undefined) {
const reactId = maybeReactUseId();
return idOverride != null ? idOverride : reactId;
}
// eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
return useGlobalId(idOverride);
}
function unsupportedProp(props, propName, componentName, location, propFullName) {
{
return null;
}
}
/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */
function useControlled({
controlled,
default: defaultProp,
name,
state = 'value'
}) {
// isControlled is ignored in the hook dependency lists as it should never change.
const {
current: isControlled
} = reactExports.useRef(controlled !== undefined);
const [valueState, setValue] = reactExports.useState(defaultProp);
const value = isControlled ? controlled : valueState;
const setValueIfUncontrolled = reactExports.useCallback(newValue => {
if (!isControlled) {
setValue(newValue);
}
}, []);
return [value, setValueIfUncontrolled];
}
/**
* https://github.com/facebook/react/issues/14099#issuecomment-440013892
*/
function useEventCallback(fn) {
const ref = reactExports.useRef(fn);
useEnhancedEffect$1(() => {
ref.current = fn;
});
return reactExports.useCallback((...args) =>
// @ts-expect-error hide `this`
// tslint:disable-next-line:ban-comma-operator
(0, ref.current)(...args), []);
}
function useForkRef(...refs) {
/**
* This will create a new function if the refs passed to this hook change and are all defined.
* This means react will call the old forkRef with `null` and the new forkRef
* with the ref. Cleanup naturally emerges from this behavior.
*/
return reactExports.useMemo(() => {
if (refs.every(ref => ref == null)) {
return null;
}
return instance => {
refs.forEach(ref => {
setRef(ref, instance);
});
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, refs);
}
// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js
let hadKeyboardEvent = true;
let hadFocusVisibleRecently = false;
let hadFocusVisibleRecentlyTimeout;
const inputTypesWhitelist = {
text: true,
search: true,
url: true,
tel: true,
email: true,
password: true,
number: true,
date: true,
month: true,
week: true,
time: true,
datetime: true,
'datetime-local': true
};
/**
* Computes whether the given element should automatically trigger the
* `focus-visible` class being added, i.e. whether it should always match
* `:focus-visible` when focused.
* @param {Element} node
* @returns {boolean}
*/
function focusTriggersKeyboardModality(node) {
const {
type,
tagName
} = node;
if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) {
return true;
}
if (tagName === 'TEXTAREA' && !node.readOnly) {
return true;
}
if (node.isContentEditable) {
return true;
}
return false;
}
/**
* Keep track of our keyboard modality state with `hadKeyboardEvent`.
* If the most recent user interaction was via the keyboard;
* and the key press did not include a meta, alt/option, or control key;
* then the modality is keyboard. Otherwise, the modality is not keyboard.
* @param {KeyboardEvent} event
*/
function handleKeyDown(event) {
if (event.metaKey || event.altKey || event.ctrlKey) {
return;
}
hadKeyboardEvent = true;
}
/**
* If at any point a user clicks with a pointing device, ensure that we change
* the modality away from keyboard.
* This avoids the situation where a user presses a key on an already focused
* element, and then clicks on a different element, focusing it with a
* pointing device, while we still think we're in keyboard modality.
*/
function handlePointerDown() {
hadKeyboardEvent = false;
}
function handleVisibilityChange() {
if (this.visibilityState === 'hidden') {
// If the tab becomes active again, the browser will handle calling focus
// on the element (Safari actually calls it twice).
// If this tab change caused a blur on an element with focus-visible,
// re-apply the class when the user switches back to the tab.
if (hadFocusVisibleRecently) {
hadKeyboardEvent = true;
}
}
}
function prepare(doc) {
doc.addEventListener('keydown', handleKeyDown, true);
doc.addEventListener('mousedown', handlePointerDown, true);
doc.addEventListener('pointerdown', handlePointerDown, true);
doc.addEventListener('touchstart', handlePointerDown, true);
doc.addEventListener('visibilitychange', handleVisibilityChange, true);
}
function isFocusVisible(event) {
const {
target
} = event;
try {
return target.matches(':focus-visible');
} catch (error) {
// Browsers not implementing :focus-visible will throw a SyntaxError.
// We use our own heuristic for those browsers.
// Rethrow might be better if it's not the expected error but do we really
// want to crash if focus-visible malfunctioned?
}
// No need for validFocusTarget check. The user does that by attaching it to
// focusable events only.
return hadKeyboardEvent || focusTriggersKeyboardModality(target);
}
function useIsFocusVisible() {
const ref = reactExports.useCallback(node => {
if (node != null) {
prepare(node.ownerDocument);
}
}, []);
const isFocusVisibleRef = reactExports.useRef(false);
/**
* Should be called if a blur event is fired
*/
function handleBlurVisible() {
// checking against potential state variable does not suffice if we focus and blur synchronously.
// React wouldn't have time to trigger a re-render so `focusVisible` would be stale.
// Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.
// This doesn't work in IE11 due to https://github.com/facebook/react/issues/3751
// TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).
if (isFocusVisibleRef.current) {
// To detect a tab/window switch, we look for a blur event followed
// rapidly by a visibility change.
// If we don't see a visibility change within 100ms, it's probably a
// regular focus change.
hadFocusVisibleRecently = true;
window.clearTimeout(hadFocusVisibleRecentlyTimeout);
hadFocusVisibleRecentlyTimeout = window.setTimeout(() => {
hadFocusVisibleRecently = false;
}, 100);
isFocusVisibleRef.current = false;
return true;
}
return false;
}
/**
* Should be called if a blur event is fired
*/
function handleFocusVisible(event) {
if (isFocusVisible(event)) {
isFocusVisibleRef.current = true;
return true;
}
return false;
}
return {
isFocusVisibleRef,
onFocus: handleFocusVisible,
onBlur: handleBlurVisible,
ref
};
}
// A change of the browser zoom change the scrollbar size.
// Credit https://github.com/twbs/bootstrap/blob/488fd8afc535ca3a6ad4dc581f5e89217b6a36ac/js/src/util/scrollbar.js#L14-L18
function getScrollbarSize(doc) {
// https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
const documentWidth = doc.documentElement.clientWidth;
return Math.abs(window.innerWidth - documentWidth);
}
const visuallyHidden = {
border: 0,
clip: 'rect(0 0 0 0)',
height: '1px',
margin: -1,
overflow: 'hidden',
padding: 0,
position: 'absolute',
whiteSpace: 'nowrap',
width: '1px'
};
const visuallyHidden$1 = visuallyHidden;
/**
* Add keys, values of `defaultProps` that does not exist in `props`
* @param {object} defaultProps
* @param {object} props
* @returns {object} resolved props
*/
function resolveProps(defaultProps, props) {
const output = _extends({}, props);
Object.keys(defaultProps).forEach(propName => {
if (propName.toString().match(/^(components|slots)$/)) {
output[propName] = _extends({}, defaultProps[propName], output[propName]);
} else if (propName.toString().match(/^(componentsProps|slotProps)$/)) {
const defaultSlotProps = defaultProps[propName] || {};
const slotProps = props[propName];
output[propName] = {};
if (!slotProps || !Object.keys(slotProps)) {
// Reduce the iteration if the slot props is empty
output[propName] = defaultSlotProps;
} else if (!defaultSlotProps || !Object.keys(defaultSlotProps)) {
// Reduce the iteration if the default slot props is empty
output[propName] = slotProps;
} else {
output[propName] = _extends({}, slotProps);
Object.keys(defaultSlotProps).forEach(slotPropName => {
output[propName][slotPropName] = resolveProps(defaultSlotProps[slotPropName], slotProps[slotPropName]);
});
}
} else if (output[propName] === undefined) {
output[propName] = defaultProps[propName];
}
});
return output;
}
function composeClasses(slots, getUtilityClass, classes) {
const output = {};
Object.keys(slots).forEach(
// `Objet.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.
// @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208
slot => {
output[slot] = slots[slot].reduce((acc, key) => {
if (key) {
acc.push(getUtilityClass(key));
if (classes && classes[key]) {
acc.push(classes[key]);
}
}
return acc;
}, []).join(' ');
});
return output;
}
const defaultGenerator = componentName => componentName;
const createClassNameGenerator = () => {
let generate = defaultGenerator;
return {
configure(generator) {
generate = generator;
},
generate(componentName) {
return generate(componentName);
},
reset() {
generate = defaultGenerator;
}
};
};
const ClassNameGenerator = createClassNameGenerator();
const ClassNameGenerator$1 = ClassNameGenerator;
const globalStateClassesMapping = {
active: 'active',
checked: 'checked',
completed: 'completed',
disabled: 'disabled',
error: 'error',
expanded: 'expanded',
focused: 'focused',
focusVisible: 'focusVisible',
required: 'required',
selected: 'selected'
};
function generateUtilityClass(componentName, slot, globalStatePrefix = 'Mui') {
const globalStateClass = globalStateClassesMapping[slot];
return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator$1.generate(componentName)}-${slot}`;
}
function generateUtilityClasses(componentName, slots, globalStatePrefix = 'Mui') {
const result = {};
slots.forEach(slot => {
result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);
});
return result;
}
var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23
var isPropValid = /* #__PURE__ */memoize$1(function (prop) {
return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
/* o */
&& prop.charCodeAt(1) === 110
/* n */
&& prop.charCodeAt(2) < 91;
}
/* Z+1 */
);
var testOmitPropsOnStringTag = isPropValid;
var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
return key !== 'theme';
};
var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
return typeof tag === 'string' && // 96 is one less than the char code
// for "a" so this is checking that
// it's a lowercase character
tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
};
var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
var shouldForwardProp;
if (options) {
var optionsShouldForwardProp = options.shouldForwardProp;
shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
} : optionsShouldForwardProp;
}
if (typeof shouldForwardProp !== 'function' && isReal) {
shouldForwardProp = tag.__emotion_forwardProp;
}
return shouldForwardProp;
};
var Insertion = function Insertion(_ref) {
var cache = _ref.cache,
serialized = _ref.serialized,
isStringTag = _ref.isStringTag;
registerStyles(cache, serialized, isStringTag);
useInsertionEffectAlwaysWithSyncFallback(function () {
return insertStyles(cache, serialized, isStringTag);
});
return null;
};
var createStyled$1 = function createStyled(tag, options) {
var isReal = tag.__emotion_real === tag;
var baseTag = isReal && tag.__emotion_base || tag;
var identifierName;
var targetClassName;
if (options !== undefined) {
identifierName = options.label;
targetClassName = options.target;
}
var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
var shouldUseAs = !defaultShouldForwardProp('as');
return function () {
var args = arguments;
var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
if (identifierName !== undefined) {
styles.push("label:" + identifierName + ";");
}
if (args[0] == null || args[0].raw === undefined) {
styles.push.apply(styles, args);
} else {
styles.push(args[0][0]);
var len = args.length;
var i = 1;
for (; i < len; i++) {
styles.push(args[i], args[0][i]);
}
} // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class
var Styled = withEmotionCache(function (props, cache, ref) {
var FinalTag = shouldUseAs && props.as || baseTag;
var className = '';
var classInterpolations = [];
var mergedProps = props;
if (props.theme == null) {
mergedProps = {};
for (var key in props) {
mergedProps[key] = props[key];
}
mergedProps.theme = reactExports.useContext(ThemeContext$2);
}
if (typeof props.className === 'string') {
className = getRegisteredStyles(cache.registered, classInterpolations, props.className);
} else if (props.className != null) {
className = props.className + " ";
}
var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
className += cache.key + "-" + serialized.name;
if (targetClassName !== undefined) {
className += " " + targetClassName;
}
var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
var newProps = {};
for (var _key in props) {
if (shouldUseAs && _key === 'as') continue;
if ( // $FlowFixMe
finalShouldForwardProp(_key)) {
newProps[_key] = props[_key];
}
}
newProps.className = className;
newProps.ref = ref;
return /*#__PURE__*/reactExports.createElement(reactExports.Fragment, null, /*#__PURE__*/reactExports.createElement(Insertion, {
cache: cache,
serialized: serialized,
isStringTag: typeof FinalTag === 'string'
}), /*#__PURE__*/reactExports.createElement(FinalTag, newProps));
});
Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
Styled.defaultProps = tag.defaultProps;
Styled.__emotion_real = Styled;
Styled.__emotion_base = baseTag;
Styled.__emotion_styles = styles;
Styled.__emotion_forwardProp = shouldForwardProp;
Object.defineProperty(Styled, 'toString', {
value: function value() {
if (targetClassName === undefined && "production" !== 'production') {
return 'NO_COMPONENT_SELECTOR';
} // $FlowFixMe: coerce undefined to string
return "." + targetClassName;
}
});
Styled.withComponent = function (nextTag, nextOptions) {
return createStyled(nextTag, _extends({}, options, nextOptions, {
shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
})).apply(void 0, styles);
};
return Styled;
};
};
var tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr', // SVG
'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];
var newStyled = createStyled$1.bind();
tags.forEach(function (tagName) {
// $FlowFixMe: we can ignore this because its exposed type is defined by the CreateStyled type
newStyled[tagName] = newStyled(tagName);
});
const emStyled = newStyled;
function isEmpty$4(obj) {
return obj === undefined || obj === null || Object.keys(obj).length === 0;
}
function GlobalStyles$1(props) {
const {
styles,
defaultTheme = {}
} = props;
const globalStyles = typeof styles === 'function' ? themeInput => styles(isEmpty$4(themeInput) ? defaultTheme : themeInput) : styles;
return /*#__PURE__*/jsx(Global, {
styles: globalStyles
});
}
/** @license MUI v5.11.0
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
function styled$2(tag, options) {
const stylesFactory = emStyled(tag, options);
return stylesFactory;
}
// eslint-disable-next-line @typescript-eslint/naming-convention
const internal_processStyles = (tag, processor) => {
// Emotion attaches all the styles as `__emotion_styles`.
// Ref: https://github.com/emotion-js/emotion/blob/16d971d0da229596d6bcc39d282ba9753c9ee7cf/packages/styled/src/base.js#L186
if (Array.isArray(tag.__emotion_styles)) {
tag.__emotion_styles = processor(tag.__emotion_styles);
}
};
function merge(acc, item) {
if (!item) {
return acc;
}
return deepmerge(acc, item, {
clone: false // No need to clone deep, it's way faster.
});
}
// The breakpoint **start** at this value.
// For instance with the first breakpoint xs: [xs, sm[.
const values$1 = {
xs: 0,
// phone
sm: 600,
// tablet
md: 900,
// small laptop
lg: 1200,
// desktop
xl: 1536 // large screen
};
const defaultBreakpoints = {
// Sorted ASC by size. That's important.
// It can't be configured as it's used statically for propTypes.
keys: ['xs', 'sm', 'md', 'lg', 'xl'],
up: key => `@media (min-width:${values$1[key]}px)`
};
function handleBreakpoints(props, propValue, styleFromPropValue) {
const theme = props.theme || {};
if (Array.isArray(propValue)) {
const themeBreakpoints = theme.breakpoints || defaultBreakpoints;
return propValue.reduce((acc, item, index) => {
acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);
return acc;
}, {});
}
if (typeof propValue === 'object') {
const themeBreakpoints = theme.breakpoints || defaultBreakpoints;
return Object.keys(propValue).reduce((acc, breakpoint) => {
// key is breakpoint
if (Object.keys(themeBreakpoints.values || values$1).indexOf(breakpoint) !== -1) {
const mediaKey = themeBreakpoints.up(breakpoint);
acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
} else {
const cssKey = breakpoint;
acc[cssKey] = propValue[cssKey];
}
return acc;
}, {});
}
const output = styleFromPropValue(propValue);
return output;
}
function createEmptyBreakpointObject(breakpointsInput = {}) {
var _breakpointsInput$key;
const breakpointsInOrder = (_breakpointsInput$key = breakpointsInput.keys) == null ? void 0 : _breakpointsInput$key.reduce((acc, key) => {
const breakpointStyleKey = breakpointsInput.up(key);
acc[breakpointStyleKey] = {};
return acc;
}, {});
return breakpointsInOrder || {};
}
function removeUnusedBreakpoints(breakpointKeys, style) {
return breakpointKeys.reduce((acc, key) => {
const breakpointOutput = acc[key];
const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;
if (isBreakpointUnused) {
delete acc[key];
}
return acc;
}, style);
}
function getPath(obj, path, checkVars = true) {
if (!path || typeof path !== 'string') {
return null;
}
// Check if CSS variables are used
if (obj && obj.vars && checkVars) {
const val = `vars.${path}`.split('.').reduce((acc, item) => acc && acc[item] ? acc[item] : null, obj);
if (val != null) {
return val;
}
}
return path.split('.').reduce((acc, item) => {
if (acc && acc[item] != null) {
return acc[item];
}
return null;
}, obj);
}
function getStyleValue$1(themeMapping, transform, propValueFinal, userValue = propValueFinal) {
let value;
if (typeof themeMapping === 'function') {
value = themeMapping(propValueFinal);
} else if (Array.isArray(themeMapping)) {
value = themeMapping[propValueFinal] || userValue;
} else {
value = getPath(themeMapping, propValueFinal) || userValue;
}
if (transform) {
value = transform(value, userValue, themeMapping);
}
return value;
}
function style$1(options) {
const {
prop,
cssProperty = options.prop,
themeKey,
transform
} = options;
// false positive
// eslint-disable-next-line react/function-component-definition
const fn = props => {
if (props[prop] == null) {
return null;
}
const propValue = props[prop];
const theme = props.theme;
const themeMapping = getPath(theme, themeKey) || {};
const styleFromPropValue = propValueFinal => {
let value = getStyleValue$1(themeMapping, transform, propValueFinal);
if (propValueFinal === value && typeof propValueFinal === 'string') {
// Haven't found value
value = getStyleValue$1(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);
}
if (cssProperty === false) {
return value;
}
return {
[cssProperty]: value
};
};
return handleBreakpoints(props, propValue, styleFromPropValue);
};
fn.propTypes = {};
fn.filterProps = [prop];
return fn;
}
function compose(...styles) {
const handlers = styles.reduce((acc, style) => {
style.filterProps.forEach(prop => {
acc[prop] = style;
});
return acc;
}, {});
// false positive
// eslint-disable-next-line react/function-component-definition
const fn = props => {
return Object.keys(props).reduce((acc, prop) => {
if (handlers[prop]) {
return merge(acc, handlers[prop](props));
}
return acc;
}, {});
};
fn.propTypes = {};
fn.filterProps = styles.reduce((acc, style) => acc.concat(style.filterProps), []);
return fn;
}
function memoize(fn) {
const cache = {};
return arg => {
if (cache[arg] === undefined) {
cache[arg] = fn(arg);
}
return cache[arg];
};
}
const properties = {
m: 'margin',
p: 'padding'
};
const directions = {
t: 'Top',
r: 'Right',
b: 'Bottom',
l: 'Left',
x: ['Left', 'Right'],
y: ['Top', 'Bottom']
};
const aliases = {
marginX: 'mx',
marginY: 'my',
paddingX: 'px',
paddingY: 'py'
};
// memoize() impact:
// From 300,000 ops/sec
// To 350,000 ops/sec
const getCssProperties = memoize(prop => {
// It's not a shorthand notation.
if (prop.length > 2) {
if (aliases[prop]) {
prop = aliases[prop];
} else {
return [prop];
}
}
const [a, b] = prop.split('');
const property = properties[a];
const direction = directions[b] || '';
return Array.isArray(direction) ? direction.map(dir => property + dir) : [property + direction];
});
const marginKeys = ['m', 'mt', 'mr', 'mb', 'ml', 'mx', 'my', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd'];
const paddingKeys = ['p', 'pt', 'pr', 'pb', 'pl', 'px', 'py', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'paddingX', 'paddingY', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd'];
[...marginKeys, ...paddingKeys];
function createUnaryUnit(theme, themeKey, defaultValue, propName) {
var _getPath;
const themeSpacing = (_getPath = getPath(theme, themeKey, false)) != null ? _getPath : defaultValue;
if (typeof themeSpacing === 'number') {
return abs => {
if (typeof abs === 'string') {
return abs;
}
return themeSpacing * abs;
};
}
if (Array.isArray(themeSpacing)) {
return abs => {
if (typeof abs === 'string') {
return abs;
}
return themeSpacing[abs];
};
}
if (typeof themeSpacing === 'function') {
return themeSpacing;
}
return () => undefined;
}
function createUnarySpacing(theme) {
return createUnaryUnit(theme, 'spacing', 8);
}
function getValue(transformer, propValue) {
if (typeof propValue === 'string' || propValue == null) {
return propValue;
}
const abs = Math.abs(propValue);
const transformed = transformer(abs);
if (propValue >= 0) {
return transformed;
}
if (typeof transformed === 'number') {
return -transformed;
}
return `-${transformed}`;
}
function getStyleFromPropValue(cssProperties, transformer) {
return propValue => cssProperties.reduce((acc, cssProperty) => {
acc[cssProperty] = getValue(transformer, propValue);
return acc;
}, {});
}
function resolveCssProperty(props, keys, prop, transformer) {
// Using a hash computation over an array iteration could be faster, but with only 28 items,
// it's doesn't worth the bundle size.
if (keys.indexOf(prop) === -1) {
return null;
}
const cssProperties = getCssProperties(prop);
const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);
const propValue = props[prop];
return handleBreakpoints(props, propValue, styleFromPropValue);
}
function style(props, keys) {
const transformer = createUnarySpacing(props.theme);
return Object.keys(props).map(prop => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});
}
function margin(props) {
return style(props, marginKeys);
}
margin.propTypes = {};
margin.filterProps = marginKeys;
function padding(props) {
return style(props, paddingKeys);
}
padding.propTypes = {};
padding.filterProps = paddingKeys;
function borderTransform(value) {
if (typeof value !== 'number') {
return value;
}
return `${value}px solid`;
}
const border = style$1({
prop: 'border',
themeKey: 'borders',
transform: borderTransform
});
const borderTop = style$1({
prop: 'borderTop',
themeKey: 'borders',
transform: borderTransform
});
const borderRight = style$1({
prop: 'borderRight',
themeKey: 'borders',
transform: borderTransform
});
const borderBottom = style$1({
prop: 'borderBottom',
themeKey: 'borders',
transform: borderTransform
});
const borderLeft = style$1({
prop: 'borderLeft',
themeKey: 'borders',
transform: borderTransform
});
const borderColor = style$1({
prop: 'borderColor',
themeKey: 'palette'
});
const borderTopColor = style$1({
prop: 'borderTopColor',
themeKey: 'palette'
});
const borderRightColor = style$1({
prop: 'borderRightColor',
themeKey: 'palette'
});
const borderBottomColor = style$1({
prop: 'borderBottomColor',
themeKey: 'palette'
});
const borderLeftColor = style$1({
prop: 'borderLeftColor',
themeKey: 'palette'
});
// false positive
// eslint-disable-next-line react/function-component-definition
const borderRadius = props => {
if (props.borderRadius !== undefined && props.borderRadius !== null) {
const transformer = createUnaryUnit(props.theme, 'shape.borderRadius', 4);
const styleFromPropValue = propValue => ({
borderRadius: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.borderRadius, styleFromPropValue);
}
return null;
};
borderRadius.propTypes = {};
borderRadius.filterProps = ['borderRadius'];
compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius);
// false positive
// eslint-disable-next-line react/function-component-definition
const gap = props => {
if (props.gap !== undefined && props.gap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8);
const styleFromPropValue = propValue => ({
gap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.gap, styleFromPropValue);
}
return null;
};
gap.propTypes = {};
gap.filterProps = ['gap'];
// false positive
// eslint-disable-next-line react/function-component-definition
const columnGap = props => {
if (props.columnGap !== undefined && props.columnGap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8);
const styleFromPropValue = propValue => ({
columnGap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.columnGap, styleFromPropValue);
}
return null;
};
columnGap.propTypes = {};
columnGap.filterProps = ['columnGap'];
// false positive
// eslint-disable-next-line react/function-component-definition
const rowGap = props => {
if (props.rowGap !== undefined && props.rowGap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8);
const styleFromPropValue = propValue => ({
rowGap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.rowGap, styleFromPropValue);
}
return null;
};
rowGap.propTypes = {};
rowGap.filterProps = ['rowGap'];
const gridColumn = style$1({
prop: 'gridColumn'
});
const gridRow = style$1({
prop: 'gridRow'
});
const gridAutoFlow = style$1({
prop: 'gridAutoFlow'
});
const gridAutoColumns = style$1({
prop: 'gridAutoColumns'
});
const gridAutoRows = style$1({
prop: 'gridAutoRows'
});
const gridTemplateColumns = style$1({
prop: 'gridTemplateColumns'
});
const gridTemplateRows = style$1({
prop: 'gridTemplateRows'
});
const gridTemplateAreas = style$1({
prop: 'gridTemplateAreas'
});
const gridArea = style$1({
prop: 'gridArea'
});
compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);
function paletteTransform(value, userValue) {
if (userValue === 'grey') {
return userValue;
}
return value;
}
const color = style$1({
prop: 'color',
themeKey: 'palette',
transform: paletteTransform
});
const bgcolor = style$1({
prop: 'bgcolor',
cssProperty: 'backgroundColor',
themeKey: 'palette',
transform: paletteTransform
});
const backgroundColor = style$1({
prop: 'backgroundColor',
themeKey: 'palette',
transform: paletteTransform
});
compose(color, bgcolor, backgroundColor);
function sizingTransform(value) {
return value <= 1 && value !== 0 ? `${value * 100}%` : value;
}
const width = style$1({
prop: 'width',
transform: sizingTransform
});
const maxWidth = props => {
if (props.maxWidth !== undefined && props.maxWidth !== null) {
const styleFromPropValue = propValue => {
var _props$theme, _props$theme$breakpoi, _props$theme$breakpoi2;
const breakpoint = ((_props$theme = props.theme) == null ? void 0 : (_props$theme$breakpoi = _props$theme.breakpoints) == null ? void 0 : (_props$theme$breakpoi2 = _props$theme$breakpoi.values) == null ? void 0 : _props$theme$breakpoi2[propValue]) || values$1[propValue];
return {
maxWidth: breakpoint || sizingTransform(propValue)
};
};
return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
}
return null;
};
maxWidth.filterProps = ['maxWidth'];
const minWidth = style$1({
prop: 'minWidth',
transform: sizingTransform
});
const height = style$1({
prop: 'height',
transform: sizingTransform
});
const maxHeight = style$1({
prop: 'maxHeight',
transform: sizingTransform
});
const minHeight = style$1({
prop: 'minHeight',
transform: sizingTransform
});
style$1({
prop: 'size',
cssProperty: 'width',
transform: sizingTransform
});
style$1({
prop: 'size',
cssProperty: 'height',
transform: sizingTransform
});
const boxSizing = style$1({
prop: 'boxSizing'
});
compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);
const defaultSxConfig = {
// borders
border: {
themeKey: 'borders',
transform: borderTransform
},
borderTop: {
themeKey: 'borders',
transform: borderTransform
},
borderRight: {
themeKey: 'borders',
transform: borderTransform
},
borderBottom: {
themeKey: 'borders',
transform: borderTransform
},
borderLeft: {
themeKey: 'borders',
transform: borderTransform
},
borderColor: {
themeKey: 'palette'
},
borderTopColor: {
themeKey: 'palette'
},
borderRightColor: {
themeKey: 'palette'
},
borderBottomColor: {
themeKey: 'palette'
},
borderLeftColor: {
themeKey: 'palette'
},
borderRadius: {
themeKey: 'shape.borderRadius',
style: borderRadius
},
// palette
color: {
themeKey: 'palette',
transform: paletteTransform
},
bgcolor: {
themeKey: 'palette',
cssProperty: 'backgroundColor',
transform: paletteTransform
},
backgroundColor: {
themeKey: 'palette',
transform: paletteTransform
},
// spacing
p: {
style: padding
},
pt: {
style: padding
},
pr: {
style: padding
},
pb: {
style: padding
},
pl: {
style: padding
},
px: {
style: padding
},
py: {
style: padding
},
padding: {
style: padding
},
paddingTop: {
style: padding
},
paddingRight: {
style: padding
},
paddingBottom: {
style: padding
},
paddingLeft: {
style: padding
},
paddingX: {
style: padding
},
paddingY: {
style: padding
},
paddingInline: {
style: padding
},
paddingInlineStart: {
style: padding
},
paddingInlineEnd: {
style: padding
},
paddingBlock: {
style: padding
},
paddingBlockStart: {
style: padding
},
paddingBlockEnd: {
style: padding
},
m: {
style: margin
},
mt: {
style: margin
},
mr: {
style: margin
},
mb: {
style: margin
},
ml: {
style: margin
},
mx: {
style: margin
},
my: {
style: margin
},
margin: {
style: margin
},
marginTop: {
style: margin
},
marginRight: {
style: margin
},
marginBottom: {
style: margin
},
marginLeft: {
style: margin
},
marginX: {
style: margin
},
marginY: {
style: margin
},
marginInline: {
style: margin
},
marginInlineStart: {
style: margin
},
marginInlineEnd: {
style: margin
},
marginBlock: {
style: margin
},
marginBlockStart: {
style: margin
},
marginBlockEnd: {
style: margin
},
// display
displayPrint: {
cssProperty: false,
transform: value => ({
'@media print': {
display: value
}
})
},
display: {},
overflow: {},
textOverflow: {},
visibility: {},
whiteSpace: {},
// flexbox
flexBasis: {},
flexDirection: {},
flexWrap: {},
justifyContent: {},
alignItems: {},
alignContent: {},
order: {},
flex: {},
flexGrow: {},
flexShrink: {},
alignSelf: {},
justifyItems: {},
justifySelf: {},
// grid
gap: {
style: gap
},
rowGap: {
style: rowGap
},
columnGap: {
style: columnGap
},
gridColumn: {},
gridRow: {},
gridAutoFlow: {},
gridAutoColumns: {},
gridAutoRows: {},
gridTemplateColumns: {},
gridTemplateRows: {},
gridTemplateAreas: {},
gridArea: {},
// positions
position: {},
zIndex: {
themeKey: 'zIndex'
},
top: {},
right: {},
bottom: {},
left: {},
// shadows
boxShadow: {
themeKey: 'shadows'
},
// sizing
width: {
transform: sizingTransform
},
maxWidth: {
style: maxWidth
},
minWidth: {
transform: sizingTransform
},
height: {
transform: sizingTransform
},
maxHeight: {
transform: sizingTransform
},
minHeight: {
transform: sizingTransform
},
boxSizing: {},
// typography
fontFamily: {
themeKey: 'typography'
},
fontSize: {
themeKey: 'typography'
},
fontStyle: {
themeKey: 'typography'
},
fontWeight: {
themeKey: 'typography'
},
letterSpacing: {},
textTransform: {},
lineHeight: {},
textAlign: {},
typography: {
cssProperty: false,
themeKey: 'typography'
}
};
const defaultSxConfig$1 = defaultSxConfig;
function objectsHaveSameKeys(...objects) {
const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);
const union = new Set(allKeys);
return objects.every(object => union.size === Object.keys(object).length);
}
function callIfFn(maybeFn, arg) {
return typeof maybeFn === 'function' ? maybeFn(arg) : maybeFn;
}
// eslint-disable-next-line @typescript-eslint/naming-convention
function unstable_createStyleFunctionSx() {
function getThemeValue(prop, val, theme, config) {
const props = {
[prop]: val,
theme
};
const options = config[prop];
if (!options) {
return {
[prop]: val
};
}
const {
cssProperty = prop,
themeKey,
transform,
style
} = options;
if (val == null) {
return null;
}
const themeMapping = getPath(theme, themeKey) || {};
if (style) {
return style(props);
}
const styleFromPropValue = propValueFinal => {
let value = getStyleValue$1(themeMapping, transform, propValueFinal);
if (propValueFinal === value && typeof propValueFinal === 'string') {
// Haven't found value
value = getStyleValue$1(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);
}
if (cssProperty === false) {
return value;
}
return {
[cssProperty]: value
};
};
return handleBreakpoints(props, val, styleFromPropValue);
}
function styleFunctionSx(props) {
var _theme$unstable_sxCon;
const {
sx,
theme = {}
} = props || {};
if (!sx) {
return null; // Emotion & styled-components will neglect null
}
const config = (_theme$unstable_sxCon = theme.unstable_sxConfig) != null ? _theme$unstable_sxCon : defaultSxConfig$1;
/*
* Receive `sxInput` as object or callback
* and then recursively check keys & values to create media query object styles.
* (the result will be used in `styled`)
*/
function traverse(sxInput) {
let sxObject = sxInput;
if (typeof sxInput === 'function') {
sxObject = sxInput(theme);
} else if (typeof sxInput !== 'object') {
// value
return sxInput;
}
if (!sxObject) {
return null;
}
const emptyBreakpoints = createEmptyBreakpointObject(theme.breakpoints);
const breakpointsKeys = Object.keys(emptyBreakpoints);
let css = emptyBreakpoints;
Object.keys(sxObject).forEach(styleKey => {
const value = callIfFn(sxObject[styleKey], theme);
if (value !== null && value !== undefined) {
if (typeof value === 'object') {
if (config[styleKey]) {
css = merge(css, getThemeValue(styleKey, value, theme, config));
} else {
const breakpointsValues = handleBreakpoints({
theme
}, value, x => ({
[styleKey]: x
}));
if (objectsHaveSameKeys(breakpointsValues, value)) {
css[styleKey] = styleFunctionSx({
sx: value,
theme
});
} else {
css = merge(css, breakpointsValues);
}
}
} else {
css = merge(css, getThemeValue(styleKey, value, theme, config));
}
}
});
return removeUnusedBreakpoints(breakpointsKeys, css);
}
return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);
}
return styleFunctionSx;
}
const styleFunctionSx = unstable_createStyleFunctionSx();
styleFunctionSx.filterProps = ['sx'];
const styleFunctionSx$1 = styleFunctionSx;
const _excluded$S = ["sx"];
const splitProps = props => {
var _props$theme$unstable, _props$theme;
const result = {
systemProps: {},
otherProps: {}
};
const config = (_props$theme$unstable = props == null ? void 0 : (_props$theme = props.theme) == null ? void 0 : _props$theme.unstable_sxConfig) != null ? _props$theme$unstable : defaultSxConfig$1;
Object.keys(props).forEach(prop => {
if (config[prop]) {
result.systemProps[prop] = props[prop];
} else {
result.otherProps[prop] = props[prop];
}
});
return result;
};
function extendSxProp(props) {
const {
sx: inSx
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$S);
const {
systemProps,
otherProps
} = splitProps(other);
let finalSx;
if (Array.isArray(inSx)) {
finalSx = [systemProps, ...inSx];
} else if (typeof inSx === 'function') {
finalSx = (...args) => {
const result = inSx(...args);
if (!isPlainObject(result)) {
return systemProps;
}
return _extends({}, systemProps, result);
};
} else {
finalSx = _extends({}, systemProps, inSx);
}
return _extends({}, otherProps, {
sx: finalSx
});
}
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
const _excluded$R = ["values", "unit", "step"];
const sortBreakpointsValues = values => {
const breakpointsAsArray = Object.keys(values).map(key => ({
key,
val: values[key]
})) || [];
// Sort in ascending order
breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);
return breakpointsAsArray.reduce((acc, obj) => {
return _extends({}, acc, {
[obj.key]: obj.val
});
}, {});
};
// Keep in mind that @media is inclusive by the CSS specification.
function createBreakpoints(breakpoints) {
const {
// The breakpoint **start** at this value.
// For instance with the first breakpoint xs: [xs, sm).
values = {
xs: 0,
// phone
sm: 600,
// tablet
md: 900,
// small laptop
lg: 1200,
// desktop
xl: 1536 // large screen
},
unit = 'px',
step = 5
} = breakpoints,
other = _objectWithoutPropertiesLoose$2(breakpoints, _excluded$R);
const sortedValues = sortBreakpointsValues(values);
const keys = Object.keys(sortedValues);
function up(key) {
const value = typeof values[key] === 'number' ? values[key] : key;
return `@media (min-width:${value}${unit})`;
}
function down(key) {
const value = typeof values[key] === 'number' ? values[key] : key;
return `@media (max-width:${value - step / 100}${unit})`;
}
function between(start, end) {
const endIndex = keys.indexOf(end);
return `@media (min-width:${typeof values[start] === 'number' ? values[start] : start}${unit}) and ` + `(max-width:${(endIndex !== -1 && typeof values[keys[endIndex]] === 'number' ? values[keys[endIndex]] : end) - step / 100}${unit})`;
}
function only(key) {
if (keys.indexOf(key) + 1 < keys.length) {
return between(key, keys[keys.indexOf(key) + 1]);
}
return up(key);
}
function not(key) {
// handle first and last key separately, for better readability
const keyIndex = keys.indexOf(key);
if (keyIndex === 0) {
return up(keys[1]);
}
if (keyIndex === keys.length - 1) {
return down(keys[keyIndex]);
}
return between(key, keys[keys.indexOf(key) + 1]).replace('@media', '@media not all and');
}
return _extends({
keys,
values: sortedValues,
up,
down,
between,
only,
not,
unit
}, other);
}
const shape = {
borderRadius: 4
};
const shape$1 = shape;
/* tslint:enable:unified-signatures */
function createSpacing(spacingInput = 8) {
// Already transformed.
if (spacingInput.mui) {
return spacingInput;
}
// Material Design layouts are visually balanced. Most measurements align to an 8dp grid, which aligns both spacing and the overall layout.
// Smaller components, such as icons, can align to a 4dp grid.
// https://m2.material.io/design/layout/understanding-layout.html
const transform = createUnarySpacing({
spacing: spacingInput
});
const spacing = (...argsInput) => {
const args = argsInput.length === 0 ? [1] : argsInput;
return args.map(argument => {
const output = transform(argument);
return typeof output === 'number' ? `${output}px` : output;
}).join(' ');
};
spacing.mui = true;
return spacing;
}
const _excluded$Q = ["breakpoints", "palette", "spacing", "shape"];
function createTheme$1(options = {}, ...args) {
const {
breakpoints: breakpointsInput = {},
palette: paletteInput = {},
spacing: spacingInput,
shape: shapeInput = {}
} = options,
other = _objectWithoutPropertiesLoose$2(options, _excluded$Q);
const breakpoints = createBreakpoints(breakpointsInput);
const spacing = createSpacing(spacingInput);
let muiTheme = deepmerge({
breakpoints,
direction: 'ltr',
components: {},
// Inject component definitions.
palette: _extends({
mode: 'light'
}, paletteInput),
spacing,
shape: _extends({}, shape$1, shapeInput)
}, other);
muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
muiTheme.unstable_sx = function sx(props) {
return styleFunctionSx$1({
sx: props,
theme: this
});
};
return muiTheme;
}
const ThemeContext = /*#__PURE__*/reactExports.createContext(null);
const ThemeContext$1 = ThemeContext;
function useTheme$3() {
const theme = reactExports.useContext(ThemeContext$1);
return theme;
}
const hasSymbol = typeof Symbol === 'function' && Symbol.for;
const nested = hasSymbol ? Symbol.for('mui.nested') : '__THEME_NESTED__';
function mergeOuterLocalTheme(outerTheme, localTheme) {
if (typeof localTheme === 'function') {
const mergedTheme = localTheme(outerTheme);
return mergedTheme;
}
return _extends({}, outerTheme, localTheme);
}
/**
* This component takes a `theme` prop.
* It makes the `theme` available down the React tree thanks to React context.
* This component should preferably be used at **the root of your component tree**.
*/
function ThemeProvider$1(props) {
const {
children,
theme: localTheme
} = props;
const outerTheme = useTheme$3();
const theme = reactExports.useMemo(() => {
const output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme);
if (output != null) {
output[nested] = outerTheme !== null;
}
return output;
}, [localTheme, outerTheme]);
return /*#__PURE__*/jsx(ThemeContext$1.Provider, {
value: theme,
children: children
});
}
function isObjectEmpty(obj) {
return Object.keys(obj).length === 0;
}
function useTheme$2(defaultTheme = null) {
const contextTheme = useTheme$3();
return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme : contextTheme;
}
const systemDefaultTheme$1 = createTheme$1();
function useTheme$1(defaultTheme = systemDefaultTheme$1) {
return useTheme$2(defaultTheme);
}
const _excluded$P = ["className", "component"];
function createBox(options = {}) {
const {
defaultTheme,
defaultClassName = 'MuiBox-root',
generateClassName
} = options;
const BoxRoot = styled$2('div', {
shouldForwardProp: prop => prop !== 'theme' && prop !== 'sx' && prop !== 'as'
})(styleFunctionSx$1);
const Box = /*#__PURE__*/reactExports.forwardRef(function Box(inProps, ref) {
const theme = useTheme$1(defaultTheme);
const _extendSxProp = extendSxProp(inProps),
{
className,
component = 'div'
} = _extendSxProp,
other = _objectWithoutPropertiesLoose$2(_extendSxProp, _excluded$P);
return /*#__PURE__*/jsx(BoxRoot, _extends({
as: component,
ref: ref,
className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
theme: theme
}, other));
});
return Box;
}
const _excluded$O = ["variant"];
function isEmpty$3(string) {
return string.length === 0;
}
/**
* Generates string classKey based on the properties provided. It starts with the
* variant if defined, and then it appends all other properties in alphabetical order.
* @param {object} props - the properties for which the classKey should be created.
*/
function propsToClassKey(props) {
const {
variant
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$O);
let classKey = variant || '';
Object.keys(other).sort().forEach(key => {
if (key === 'color') {
classKey += isEmpty$3(classKey) ? props[key] : capitalize(props[key]);
} else {
classKey += `${isEmpty$3(classKey) ? key : capitalize(key)}${capitalize(props[key].toString())}`;
}
});
return classKey;
}
const _excluded$N = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"],
_excluded2$4 = ["theme"],
_excluded3$1 = ["theme"];
function isEmpty$2(obj) {
return Object.keys(obj).length === 0;
}
// https://github.com/emotion-js/emotion/blob/26ded6109fcd8ca9875cc2ce4564fee678a3f3c5/packages/styled/src/utils.js#L40
function isStringTag(tag) {
return typeof tag === 'string' &&
// 96 is one less than the char code
// for "a" so this is checking that
// it's a lowercase character
tag.charCodeAt(0) > 96;
}
const getStyleOverrides = (name, theme) => {
if (theme.components && theme.components[name] && theme.components[name].styleOverrides) {
return theme.components[name].styleOverrides;
}
return null;
};
const getVariantStyles = (name, theme) => {
let variants = [];
if (theme && theme.components && theme.components[name] && theme.components[name].variants) {
variants = theme.components[name].variants;
}
const variantsStyles = {};
variants.forEach(definition => {
const key = propsToClassKey(definition.props);
variantsStyles[key] = definition.style;
});
return variantsStyles;
};
const variantsResolver = (props, styles, theme, name) => {
var _theme$components, _theme$components$nam;
const {
ownerState = {}
} = props;
const variantsStyles = [];
const themeVariants = theme == null ? void 0 : (_theme$components = theme.components) == null ? void 0 : (_theme$components$nam = _theme$components[name]) == null ? void 0 : _theme$components$nam.variants;
if (themeVariants) {
themeVariants.forEach(themeVariant => {
let isMatch = true;
Object.keys(themeVariant.props).forEach(key => {
if (ownerState[key] !== themeVariant.props[key] && props[key] !== themeVariant.props[key]) {
isMatch = false;
}
});
if (isMatch) {
variantsStyles.push(styles[propsToClassKey(themeVariant.props)]);
}
});
}
return variantsStyles;
};
// Update /system/styled/#api in case if this changes
function shouldForwardProp(prop) {
return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
}
const systemDefaultTheme = createTheme$1();
function createStyled(input = {}) {
const {
defaultTheme = systemDefaultTheme,
rootShouldForwardProp = shouldForwardProp,
slotShouldForwardProp = shouldForwardProp
} = input;
const systemSx = props => {
const theme = isEmpty$2(props.theme) ? defaultTheme : props.theme;
return styleFunctionSx$1(_extends({}, props, {
theme
}));
};
systemSx.__mui_systemSx = true;
return (tag, inputOptions = {}) => {
// Filter out the `sx` style function from the previous styled component to prevent unnecessary styles generated by the composite components.
internal_processStyles(tag, styles => styles.filter(style => !(style != null && style.__mui_systemSx)));
const {
name: componentName,
slot: componentSlot,
skipVariantsResolver: inputSkipVariantsResolver,
skipSx: inputSkipSx,
overridesResolver
} = inputOptions,
options = _objectWithoutPropertiesLoose$2(inputOptions, _excluded$N);
// if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.
const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver : componentSlot && componentSlot !== 'Root' || false;
const skipSx = inputSkipSx || false;
let label;
let shouldForwardPropOption = shouldForwardProp;
if (componentSlot === 'Root') {
shouldForwardPropOption = rootShouldForwardProp;
} else if (componentSlot) {
// any other slot specified
shouldForwardPropOption = slotShouldForwardProp;
} else if (isStringTag(tag)) {
// for string (html) tag, preserve the behavior in emotion & styled-components.
shouldForwardPropOption = undefined;
}
const defaultStyledResolver = styled$2(tag, _extends({
shouldForwardProp: shouldForwardPropOption,
label
}, options));
const muiStyledResolver = (styleArg, ...expressions) => {
const expressionsWithDefaultTheme = expressions ? expressions.map(stylesArg => {
// On the server Emotion doesn't use React.forwardRef for creating components, so the created
// component stays as a function. This condition makes sure that we do not interpolate functions
// which are basically components used as a selectors.
return typeof stylesArg === 'function' && stylesArg.__emotion_real !== stylesArg ? _ref => {
let {
theme: themeInput
} = _ref,
other = _objectWithoutPropertiesLoose$2(_ref, _excluded2$4);
return stylesArg(_extends({
theme: isEmpty$2(themeInput) ? defaultTheme : themeInput
}, other));
} : stylesArg;
}) : [];
let transformedStyleArg = styleArg;
if (componentName && overridesResolver) {
expressionsWithDefaultTheme.push(props => {
const theme = isEmpty$2(props.theme) ? defaultTheme : props.theme;
const styleOverrides = getStyleOverrides(componentName, theme);
if (styleOverrides) {
const resolvedStyleOverrides = {};
Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {
resolvedStyleOverrides[slotKey] = typeof slotStyle === 'function' ? slotStyle(_extends({}, props, {
theme
})) : slotStyle;
});
return overridesResolver(props, resolvedStyleOverrides);
}
return null;
});
}
if (componentName && !skipVariantsResolver) {
expressionsWithDefaultTheme.push(props => {
const theme = isEmpty$2(props.theme) ? defaultTheme : props.theme;
return variantsResolver(props, getVariantStyles(componentName, theme), theme, componentName);
});
}
if (!skipSx) {
expressionsWithDefaultTheme.push(systemSx);
}
const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;
if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {
const placeholders = new Array(numOfCustomFnsApplied).fill('');
// If the type is array, than we need to add placeholders in the template for the overrides, variants and the sx styles.
transformedStyleArg = [...styleArg, ...placeholders];
transformedStyleArg.raw = [...styleArg.raw, ...placeholders];
} else if (typeof styleArg === 'function' &&
// On the server Emotion doesn't use React.forwardRef for creating components, so the created
// component stays as a function. This condition makes sure that we do not interpolate functions
// which are basically components used as a selectors.
styleArg.__emotion_real !== styleArg) {
// If the type is function, we need to define the default theme.
transformedStyleArg = _ref2 => {
let {
theme: themeInput
} = _ref2,
other = _objectWithoutPropertiesLoose$2(_ref2, _excluded3$1);
return styleArg(_extends({
theme: isEmpty$2(themeInput) ? defaultTheme : themeInput
}, other));
};
}
const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);
return Component;
};
if (defaultStyledResolver.withConfig) {
muiStyledResolver.withConfig = defaultStyledResolver.withConfig;
}
return muiStyledResolver;
};
}
function getThemeProps(params) {
const {
theme,
name,
props
} = params;
if (!theme || !theme.components || !theme.components[name] || !theme.components[name].defaultProps) {
return props;
}
return resolveProps(theme.components[name].defaultProps, props);
}
function useThemeProps$1({
props,
name,
defaultTheme
}) {
const theme = useTheme$1(defaultTheme);
const mergedProps = getThemeProps({
theme,
name,
props
});
return mergedProps;
}
/**
* Returns a number whose value is limited to the given range.
* @param {number} value The value to be clamped
* @param {number} min The lower boundary of the output range
* @param {number} max The upper boundary of the output range
* @returns {number} A number in the range [min, max]
*/
function clamp$2(value, min = 0, max = 1) {
return Math.min(Math.max(min, value), max);
}
/**
* Converts a color from CSS hex format to CSS rgb format.
* @param {string} color - Hex color, i.e. #nnn or #nnnnnn
* @returns {string} A CSS rgb color string
*/
function hexToRgb(color) {
color = color.slice(1);
const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');
let colors = color.match(re);
if (colors && colors[0].length === 1) {
colors = colors.map(n => n + n);
}
return colors ? `rgb${colors.length === 4 ? 'a' : ''}(${colors.map((n, index) => {
return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000;
}).join(', ')})` : '';
}
/**
* Returns an object with the type and values of a color.
*
* Note: Does not support rgb % values.
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
* @returns {object} - A MUI color object: {type: string, values: number[]}
*/
function decomposeColor(color) {
// Idempotent
if (color.type) {
return color;
}
if (color.charAt(0) === '#') {
return decomposeColor(hexToRgb(color));
}
const marker = color.indexOf('(');
const type = color.substring(0, marker);
if (['rgb', 'rgba', 'hsl', 'hsla', 'color'].indexOf(type) === -1) {
throw new Error(formatMuiErrorMessage(9, color));
}
let values = color.substring(marker + 1, color.length - 1);
let colorSpace;
if (type === 'color') {
values = values.split(' ');
colorSpace = values.shift();
if (values.length === 4 && values[3].charAt(0) === '/') {
values[3] = values[3].slice(1);
}
if (['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].indexOf(colorSpace) === -1) {
throw new Error(formatMuiErrorMessage(10, colorSpace));
}
} else {
values = values.split(',');
}
values = values.map(value => parseFloat(value));
return {
type,
values,
colorSpace
};
}
/**
* Converts a color object with type and values to a string.
* @param {object} color - Decomposed color
* @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla', 'color'
* @param {array} color.values - [n,n,n] or [n,n,n,n]
* @returns {string} A CSS color string
*/
function recomposeColor(color) {
const {
type,
colorSpace
} = color;
let {
values
} = color;
if (type.indexOf('rgb') !== -1) {
// Only convert the first 3 values to int (i.e. not alpha)
values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
} else if (type.indexOf('hsl') !== -1) {
values[1] = `${values[1]}%`;
values[2] = `${values[2]}%`;
}
if (type.indexOf('color') !== -1) {
values = `${colorSpace} ${values.join(' ')}`;
} else {
values = `${values.join(', ')}`;
}
return `${type}(${values})`;
}
/**
* Converts a color from hsl format to rgb format.
* @param {string} color - HSL color values
* @returns {string} rgb color values
*/
function hslToRgb(color) {
color = decomposeColor(color);
const {
values
} = color;
const h = values[0];
const s = values[1] / 100;
const l = values[2] / 100;
const a = s * Math.min(l, 1 - l);
const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
let type = 'rgb';
const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];
if (color.type === 'hsla') {
type += 'a';
rgb.push(values[3]);
}
return recomposeColor({
type,
values: rgb
});
}
/**
* The relative brightness of any point in a color space,
* normalized to 0 for darkest black and 1 for lightest white.
*
* Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
* @returns {number} The relative brightness of the color in the range 0 - 1
*/
function getLuminance(color) {
color = decomposeColor(color);
let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;
rgb = rgb.map(val => {
if (color.type !== 'color') {
val /= 255; // normalized
}
return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;
});
// Truncate at 3 digits
return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
}
/**
* Calculates the contrast ratio between two colors.
*
* Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
* @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @returns {number} A contrast ratio value in the range 0 - 21.
*/
function getContrastRatio(foreground, background) {
const lumA = getLuminance(foreground);
const lumB = getLuminance(background);
return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
}
/**
* Sets the absolute transparency of a color.
* Any existing alpha values are overwritten.
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
* @param {number} value - value to set the alpha channel to in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function alpha(color, value) {
color = decomposeColor(color);
value = clamp$2(value);
if (color.type === 'rgb' || color.type === 'hsl') {
color.type += 'a';
}
if (color.type === 'color') {
color.values[3] = `/${value}`;
} else {
color.values[3] = value;
}
return recomposeColor(color);
}
/**
* Darkens a color.
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
* @param {number} coefficient - multiplier in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function darken(color, coefficient) {
color = decomposeColor(color);
coefficient = clamp$2(coefficient);
if (color.type.indexOf('hsl') !== -1) {
color.values[2] *= 1 - coefficient;
} else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {
for (let i = 0; i < 3; i += 1) {
color.values[i] *= 1 - coefficient;
}
}
return recomposeColor(color);
}
/**
* Lightens a color.
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
* @param {number} coefficient - multiplier in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function lighten(color, coefficient) {
color = decomposeColor(color);
coefficient = clamp$2(coefficient);
if (color.type.indexOf('hsl') !== -1) {
color.values[2] += (100 - color.values[2]) * coefficient;
} else if (color.type.indexOf('rgb') !== -1) {
for (let i = 0; i < 3; i += 1) {
color.values[i] += (255 - color.values[i]) * coefficient;
}
} else if (color.type.indexOf('color') !== -1) {
for (let i = 0; i < 3; i += 1) {
color.values[i] += (1 - color.values[i]) * coefficient;
}
}
return recomposeColor(color);
}
const EMPTY_THEME = {};
function InnerThemeProvider(props) {
const theme = useTheme$1();
return /*#__PURE__*/jsx(ThemeContext$2.Provider, {
value: typeof theme === 'object' ? theme : EMPTY_THEME,
children: props.children
});
}
/**
* This component makes the `theme` available down the React tree.
* It should preferably be used at **the root of your component tree**.
*/
function ThemeProvider(props) {
const {
children,
theme: localTheme
} = props;
return /*#__PURE__*/jsx(ThemeProvider$1, {
theme: localTheme,
children: /*#__PURE__*/jsx(InnerThemeProvider, {
children: children
})
});
}
function createMixins(breakpoints, mixins) {
return _extends({
toolbar: {
minHeight: 56,
[breakpoints.up('xs')]: {
'@media (orientation: landscape)': {
minHeight: 48
}
},
[breakpoints.up('sm')]: {
minHeight: 64
}
}
}, mixins);
}
const _excluded$M = ["mode", "contrastThreshold", "tonalOffset"];
const light = {
// The colors used to style the text.
text: {
// The most important text.
primary: 'rgba(0, 0, 0, 0.87)',
// Secondary text.
secondary: 'rgba(0, 0, 0, 0.6)',
// Disabled text have even lower visual prominence.
disabled: 'rgba(0, 0, 0, 0.38)'
},
// The color used to divide different elements.
divider: 'rgba(0, 0, 0, 0.12)',
// The background colors used to style the surfaces.
// Consistency between these values is important.
background: {
paper: common$1.white,
default: common$1.white
},
// The colors used to style the action elements.
action: {
// The color of an active action like an icon button.
active: 'rgba(0, 0, 0, 0.54)',
// The color of an hovered action.
hover: 'rgba(0, 0, 0, 0.04)',
hoverOpacity: 0.04,
// The color of a selected action.
selected: 'rgba(0, 0, 0, 0.08)',
selectedOpacity: 0.08,
// The color of a disabled action.
disabled: 'rgba(0, 0, 0, 0.26)',
// The background color of a disabled action.
disabledBackground: 'rgba(0, 0, 0, 0.12)',
disabledOpacity: 0.38,
focus: 'rgba(0, 0, 0, 0.12)',
focusOpacity: 0.12,
activatedOpacity: 0.12
}
};
const dark = {
text: {
primary: common$1.white,
secondary: 'rgba(255, 255, 255, 0.7)',
disabled: 'rgba(255, 255, 255, 0.5)',
icon: 'rgba(255, 255, 255, 0.5)'
},
divider: 'rgba(255, 255, 255, 0.12)',
background: {
paper: '#121212',
default: '#121212'
},
action: {
active: common$1.white,
hover: 'rgba(255, 255, 255, 0.08)',
hoverOpacity: 0.08,
selected: 'rgba(255, 255, 255, 0.16)',
selectedOpacity: 0.16,
disabled: 'rgba(255, 255, 255, 0.3)',
disabledBackground: 'rgba(255, 255, 255, 0.12)',
disabledOpacity: 0.38,
focus: 'rgba(255, 255, 255, 0.12)',
focusOpacity: 0.12,
activatedOpacity: 0.24
}
};
function addLightOrDark(intent, direction, shade, tonalOffset) {
const tonalOffsetLight = tonalOffset.light || tonalOffset;
const tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5;
if (!intent[direction]) {
if (intent.hasOwnProperty(shade)) {
intent[direction] = intent[shade];
} else if (direction === 'light') {
intent.light = lighten(intent.main, tonalOffsetLight);
} else if (direction === 'dark') {
intent.dark = darken(intent.main, tonalOffsetDark);
}
}
}
function getDefaultPrimary(mode = 'light') {
if (mode === 'dark') {
return {
main: blue$1[200],
light: blue$1[50],
dark: blue$1[400]
};
}
return {
main: blue$1[700],
light: blue$1[400],
dark: blue$1[800]
};
}
function getDefaultSecondary(mode = 'light') {
if (mode === 'dark') {
return {
main: purple$1[200],
light: purple$1[50],
dark: purple$1[400]
};
}
return {
main: purple$1[500],
light: purple$1[300],
dark: purple$1[700]
};
}
function getDefaultError(mode = 'light') {
if (mode === 'dark') {
return {
main: red$1[500],
light: red$1[300],
dark: red$1[700]
};
}
return {
main: red$1[700],
light: red$1[400],
dark: red$1[800]
};
}
function getDefaultInfo(mode = 'light') {
if (mode === 'dark') {
return {
main: lightBlue$1[400],
light: lightBlue$1[300],
dark: lightBlue$1[700]
};
}
return {
main: lightBlue$1[700],
light: lightBlue$1[500],
dark: lightBlue$1[900]
};
}
function getDefaultSuccess(mode = 'light') {
if (mode === 'dark') {
return {
main: green$1[400],
light: green$1[300],
dark: green$1[700]
};
}
return {
main: green$1[800],
light: green$1[500],
dark: green$1[900]
};
}
function getDefaultWarning(mode = 'light') {
if (mode === 'dark') {
return {
main: orange$1[400],
light: orange$1[300],
dark: orange$1[700]
};
}
return {
main: '#ed6c02',
// closest to orange[800] that pass 3:1.
light: orange$1[500],
dark: orange$1[900]
};
}
function createPalette(palette) {
const {
mode = 'light',
contrastThreshold = 3,
tonalOffset = 0.2
} = palette,
other = _objectWithoutPropertiesLoose$2(palette, _excluded$M);
const primary = palette.primary || getDefaultPrimary(mode);
const secondary = palette.secondary || getDefaultSecondary(mode);
const error = palette.error || getDefaultError(mode);
const info = palette.info || getDefaultInfo(mode);
const success = palette.success || getDefaultSuccess(mode);
const warning = palette.warning || getDefaultWarning(mode);
// Use the same logic as
// Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59
// and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54
function getContrastText(background) {
const contrastText = getContrastRatio(background, dark.text.primary) >= contrastThreshold ? dark.text.primary : light.text.primary;
return contrastText;
}
const augmentColor = ({
color,
name,
mainShade = 500,
lightShade = 300,
darkShade = 700
}) => {
color = _extends({}, color);
if (!color.main && color[mainShade]) {
color.main = color[mainShade];
}
if (!color.hasOwnProperty('main')) {
throw new Error(formatMuiErrorMessage(11, name ? ` (${name})` : '', mainShade));
}
if (typeof color.main !== 'string') {
throw new Error(formatMuiErrorMessage(12, name ? ` (${name})` : '', JSON.stringify(color.main)));
}
addLightOrDark(color, 'light', lightShade, tonalOffset);
addLightOrDark(color, 'dark', darkShade, tonalOffset);
if (!color.contrastText) {
color.contrastText = getContrastText(color.main);
}
return color;
};
const modes = {
dark,
light
};
const paletteOutput = deepmerge(_extends({
// A collection of common colors.
common: _extends({}, common$1),
// prevent mutable object.
// The palette mode, can be light or dark.
mode,
// The colors used to represent primary interface elements for a user.
primary: augmentColor({
color: primary,
name: 'primary'
}),
// The colors used to represent secondary interface elements for a user.
secondary: augmentColor({
color: secondary,
name: 'secondary',
mainShade: 'A400',
lightShade: 'A200',
darkShade: 'A700'
}),
// The colors used to represent interface elements that the user should be made aware of.
error: augmentColor({
color: error,
name: 'error'
}),
// The colors used to represent potentially dangerous actions or important messages.
warning: augmentColor({
color: warning,
name: 'warning'
}),
// The colors used to present information to the user that is neutral and not necessarily important.
info: augmentColor({
color: info,
name: 'info'
}),
// The colors used to indicate the successful completion of an action that user triggered.
success: augmentColor({
color: success,
name: 'success'
}),
// The grey colors.
grey: grey$1,
// Used by `getContrastText()` to maximize the contrast between
// the background and the text.
contrastThreshold,
// Takes a background color and returns the text color that maximizes the contrast.
getContrastText,
// Generate a rich color object.
augmentColor,
// Used by the functions below to shift a color's luminance by approximately
// two indexes within its tonal palette.
// E.g., shift from Red 500 to Red 300 or Red 700.
tonalOffset
}, modes[mode]), other);
return paletteOutput;
}
const _excluded$L = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
function round$2(value) {
return Math.round(value * 1e5) / 1e5;
}
const caseAllCaps = {
textTransform: 'uppercase'
};
const defaultFontFamily = '"Roboto", "Helvetica", "Arial", sans-serif';
/**
* @see @link{https://m2.material.io/design/typography/the-type-system.html}
* @see @link{https://m2.material.io/design/typography/understanding-typography.html}
*/
function createTypography(palette, typography) {
const _ref = typeof typography === 'function' ? typography(palette) : typography,
{
fontFamily = defaultFontFamily,
// The default font size of the Material Specification.
fontSize = 14,
// px
fontWeightLight = 300,
fontWeightRegular = 400,
fontWeightMedium = 500,
fontWeightBold = 700,
// Tell MUI what's the font-size on the html element.
// 16px is the default font-size used by browsers.
htmlFontSize = 16,
// Apply the CSS properties to all the variants.
allVariants,
pxToRem: pxToRem2
} = _ref,
other = _objectWithoutPropertiesLoose$2(_ref, _excluded$L);
const coef = fontSize / 14;
const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);
const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({
fontFamily,
fontWeight,
fontSize: pxToRem(size),
// Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/
lineHeight
}, fontFamily === defaultFontFamily ? {
letterSpacing: `${round$2(letterSpacing / size)}em`
} : {}, casing, allVariants);
const variants = {
h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),
h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),
h3: buildVariant(fontWeightRegular, 48, 1.167, 0),
h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),
h5: buildVariant(fontWeightRegular, 24, 1.334, 0),
h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),
subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),
subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),
body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),
body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),
button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),
caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),
overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps)
};
return deepmerge(_extends({
htmlFontSize,
pxToRem,
fontFamily,
fontSize,
fontWeightLight,
fontWeightRegular,
fontWeightMedium,
fontWeightBold
}, variants), other, {
clone: false // No need to clone deep
});
}
const shadowKeyUmbraOpacity = 0.2;
const shadowKeyPenumbraOpacity = 0.14;
const shadowAmbientShadowOpacity = 0.12;
function createShadow(...px) {
return [`${px[0]}px ${px[1]}px ${px[2]}px ${px[3]}px rgba(0,0,0,${shadowKeyUmbraOpacity})`, `${px[4]}px ${px[5]}px ${px[6]}px ${px[7]}px rgba(0,0,0,${shadowKeyPenumbraOpacity})`, `${px[8]}px ${px[9]}px ${px[10]}px ${px[11]}px rgba(0,0,0,${shadowAmbientShadowOpacity})`].join(',');
}
// Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss
const shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
const shadows$1 = shadows;
const _excluded$K = ["duration", "easing", "delay"];
// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves
// to learn the context in which each easing should be used.
const easing = {
// This is the most common easing curve.
easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',
// Objects enter the screen at full velocity from off-screen and
// slowly decelerate to a resting point.
easeOut: 'cubic-bezier(0.0, 0, 0.2, 1)',
// Objects leave the screen at full velocity. They do not decelerate when off-screen.
easeIn: 'cubic-bezier(0.4, 0, 1, 1)',
// The sharp curve is used by objects that may return to the screen at any time.
sharp: 'cubic-bezier(0.4, 0, 0.6, 1)'
};
// Follow https://m2.material.io/guidelines/motion/duration-easing.html#duration-easing-common-durations
// to learn when use what timing
const duration = {
shortest: 150,
shorter: 200,
short: 250,
// most basic recommended timing
standard: 300,
// this is to be used in complex animations
complex: 375,
// recommended when something is entering screen
enteringScreen: 225,
// recommended when something is leaving screen
leavingScreen: 195
};
function formatMs(milliseconds) {
return `${Math.round(milliseconds)}ms`;
}
function getAutoHeightDuration(height) {
if (!height) {
return 0;
}
const constant = height / 36;
// https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10
return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);
}
function createTransitions(inputTransitions) {
const mergedEasing = _extends({}, easing, inputTransitions.easing);
const mergedDuration = _extends({}, duration, inputTransitions.duration);
const create = (props = ['all'], options = {}) => {
const {
duration: durationOption = mergedDuration.standard,
easing: easingOption = mergedEasing.easeInOut,
delay = 0
} = options;
_objectWithoutPropertiesLoose$2(options, _excluded$K);
return (Array.isArray(props) ? props : [props]).map(animatedProp => `${animatedProp} ${typeof durationOption === 'string' ? durationOption : formatMs(durationOption)} ${easingOption} ${typeof delay === 'string' ? delay : formatMs(delay)}`).join(',');
};
return _extends({
getAutoHeightDuration,
create
}, inputTransitions, {
easing: mergedEasing,
duration: mergedDuration
});
}
// We need to centralize the zIndex definitions as they work
// like global values in the browser.
const zIndex = {
mobileStepper: 1000,
fab: 1050,
speedDial: 1050,
appBar: 1100,
drawer: 1200,
modal: 1300,
snackbar: 1400,
tooltip: 1500
};
const zIndex$1 = zIndex;
const _excluded$J = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
function createTheme(options = {}, ...args) {
const {
mixins: mixinsInput = {},
palette: paletteInput = {},
transitions: transitionsInput = {},
typography: typographyInput = {}
} = options,
other = _objectWithoutPropertiesLoose$2(options, _excluded$J);
if (options.vars) {
throw new Error(formatMuiErrorMessage(18));
}
const palette = createPalette(paletteInput);
const systemTheme = createTheme$1(options);
let muiTheme = deepmerge(systemTheme, {
mixins: createMixins(systemTheme.breakpoints, mixinsInput),
palette,
// Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.
shadows: shadows$1.slice(),
typography: createTypography(palette, typographyInput),
transitions: createTransitions(transitionsInput),
zIndex: _extends({}, zIndex$1)
});
muiTheme = deepmerge(muiTheme, other);
muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
muiTheme.unstable_sx = function sx(props) {
return styleFunctionSx$1({
sx: props,
theme: this
});
};
return muiTheme;
}
const defaultTheme$1 = createTheme();
const defaultTheme$2 = defaultTheme$1;
function useTheme() {
const theme = useTheme$1(defaultTheme$2);
return theme;
}
function useThemeProps({
props,
name
}) {
return useThemeProps$1({
props,
name,
defaultTheme: defaultTheme$2
});
}
const rootShouldForwardProp = prop => shouldForwardProp(prop) && prop !== 'classes';
const slotShouldForwardProp = shouldForwardProp;
const styled = createStyled({
defaultTheme: defaultTheme$2,
rootShouldForwardProp
});
const styled$1 = styled;
// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61
const getOverlayAlpha = elevation => {
let alphaValue;
if (elevation < 1) {
alphaValue = 5.11916 * elevation ** 2;
} else {
alphaValue = 4.5 * Math.log(elevation + 1) + 2;
}
return (alphaValue / 100).toFixed(2);
};
const getOverlayAlpha$1 = getOverlayAlpha;
/**
* Determines if a given element is a DOM element name (i.e. not a React component).
*/
function isHostComponent(element) {
return typeof element === 'string';
}
/**
* Type of the ownerState based on the type of an element it applies to.
* This resolves to the provided OwnerState for React components and `undefined` for host components.
* Falls back to `OwnerState | undefined` when the exact type can't be determined in development time.
*/
/**
* Appends the ownerState object to the props, merging with the existing one if necessary.
*
* @param elementType Type of the element that owns the `existingProps`. If the element is a DOM node or undefined, `ownerState` is not applied.
* @param otherProps Props of the element.
* @param ownerState
*/
function appendOwnerState(elementType, otherProps, ownerState) {
if (elementType === undefined || isHostComponent(elementType)) {
return otherProps;
}
return _extends({}, otherProps, {
ownerState: _extends({}, otherProps.ownerState, ownerState)
});
}
/**
* Extracts event handlers from a given object.
* A prop is considered an event handler if it is a function and its name starts with `on`.
*
* @param object An object to extract event handlers from.
* @param excludeKeys An array of keys to exclude from the returned object.
*/
function extractEventHandlers(object, excludeKeys = []) {
if (object === undefined) {
return {};
}
const result = {};
Object.keys(object).filter(prop => prop.match(/^on[A-Z]/) && typeof object[prop] === 'function' && !excludeKeys.includes(prop)).forEach(prop => {
result[prop] = object[prop];
});
return result;
}
/**
* If `componentProps` is a function, calls it with the provided `ownerState`.
* Otherwise, just returns `componentProps`.
*/
function resolveComponentProps(componentProps, ownerState) {
if (typeof componentProps === 'function') {
return componentProps(ownerState);
}
return componentProps;
}
/**
* Removes event handlers from the given object.
* A field is considered an event handler if it is a function with a name beginning with `on`.
*
* @param object Object to remove event handlers from.
* @returns Object with event handlers removed.
*/
function omitEventHandlers(object) {
if (object === undefined) {
return {};
}
const result = {};
Object.keys(object).filter(prop => !(prop.match(/^on[A-Z]/) && typeof object[prop] === 'function')).forEach(prop => {
result[prop] = object[prop];
});
return result;
}
/**
* Merges the slot component internal props (usually coming from a hook)
* with the externally provided ones.
*
* The merge order is (the latter overrides the former):
* 1. The internal props (specified as a getter function to work with get*Props hook result)
* 2. Additional props (specified internally on an unstyled component)
* 3. External props specified on the owner component. These should only be used on a root slot.
* 4. External props specified in the `slotProps.*` prop.
* 5. The `className` prop - combined from all the above.
* @param parameters
* @returns
*/
function mergeSlotProps(parameters) {
const {
getSlotProps,
additionalProps,
externalSlotProps,
externalForwardedProps,
className
} = parameters;
if (!getSlotProps) {
// The simpler case - getSlotProps is not defined, so no internal event handlers are defined,
// so we can simply merge all the props without having to worry about extracting event handlers.
const joinedClasses = clsx(externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className, className, additionalProps == null ? void 0 : additionalProps.className);
const mergedStyle = _extends({}, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);
const props = _extends({}, additionalProps, externalForwardedProps, externalSlotProps);
if (joinedClasses.length > 0) {
props.className = joinedClasses;
}
if (Object.keys(mergedStyle).length > 0) {
props.style = mergedStyle;
}
return {
props,
internalRef: undefined
};
}
// In this case, getSlotProps is responsible for calling the external event handlers.
// We don't need to include them in the merged props because of this.
const eventHandlers = extractEventHandlers(_extends({}, externalForwardedProps, externalSlotProps));
const componentsPropsWithoutEventHandlers = omitEventHandlers(externalSlotProps);
const otherPropsWithoutEventHandlers = omitEventHandlers(externalForwardedProps);
const internalSlotProps = getSlotProps(eventHandlers);
// The order of classes is important here.
// Emotion (that we use in libraries consuming MUI Base) depends on this order
// to properly override style. It requires the most important classes to be last
// (see https://github.com/mui/material-ui/pull/33205) for the related discussion.
const joinedClasses = clsx(internalSlotProps == null ? void 0 : internalSlotProps.className, additionalProps == null ? void 0 : additionalProps.className, className, externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className);
const mergedStyle = _extends({}, internalSlotProps == null ? void 0 : internalSlotProps.style, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);
const props = _extends({}, internalSlotProps, additionalProps, otherPropsWithoutEventHandlers, componentsPropsWithoutEventHandlers);
if (joinedClasses.length > 0) {
props.className = joinedClasses;
}
if (Object.keys(mergedStyle).length > 0) {
props.style = mergedStyle;
}
return {
props,
internalRef: internalSlotProps.ref
};
}
const _excluded$I = ["elementType", "externalSlotProps", "ownerState"];
/**
* Builds the props to be passed into the slot of an unstyled component.
* It merges the internal props of the component with the ones supplied by the user, allowing to customize the behavior.
* If the slot component is not a host component, it also merges in the `ownerState`.
*
* @param parameters.getSlotProps - A function that returns the props to be passed to the slot component.
*/
function useSlotProps(parameters) {
var _parameters$additiona;
const {
elementType,
externalSlotProps,
ownerState
} = parameters,
rest = _objectWithoutPropertiesLoose$2(parameters, _excluded$I);
const resolvedComponentsProps = resolveComponentProps(externalSlotProps, ownerState);
const {
props: mergedProps,
internalRef
} = mergeSlotProps(_extends({}, rest, {
externalSlotProps: resolvedComponentsProps
}));
const ref = useForkRef(internalRef, resolvedComponentsProps == null ? void 0 : resolvedComponentsProps.ref, (_parameters$additiona = parameters.additionalProps) == null ? void 0 : _parameters$additiona.ref);
const props = appendOwnerState(elementType, _extends({}, mergedProps, {
ref
}), ownerState);
return props;
}
/* eslint-disable consistent-return, jsx-a11y/no-noninteractive-tabindex */
// Inspired by https://github.com/focus-trap/tabbable
const candidatesSelector = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])'].join(',');
function getTabIndex(node) {
const tabindexAttr = parseInt(node.getAttribute('tabindex') || '', 10);
if (!Number.isNaN(tabindexAttr)) {
return tabindexAttr;
}
// Browsers do not return `tabIndex` correctly for contentEditable nodes;
// https://bugs.chromium.org/p/chromium/issues/detail?id=661108&q=contenteditable%20tabindex&can=2
// so if they don't have a tabindex attribute specifically set, assume it's 0.
// in Chrome, <details/>, <audio controls/> and <video controls/> elements get a default
// `tabIndex` of -1 when the 'tabindex' attribute isn't specified in the DOM,
// yet they are still part of the regular tab order; in FF, they get a default
// `tabIndex` of 0; since Chrome still puts those elements in the regular tab
// order, consider their tab index to be 0.
if (node.contentEditable === 'true' || (node.nodeName === 'AUDIO' || node.nodeName === 'VIDEO' || node.nodeName === 'DETAILS') && node.getAttribute('tabindex') === null) {
return 0;
}
return node.tabIndex;
}
function isNonTabbableRadio(node) {
if (node.tagName !== 'INPUT' || node.type !== 'radio') {
return false;
}
if (!node.name) {
return false;
}
const getRadio = selector => node.ownerDocument.querySelector(`input[type="radio"]${selector}`);
let roving = getRadio(`[name="${node.name}"]:checked`);
if (!roving) {
roving = getRadio(`[name="${node.name}"]`);
}
return roving !== node;
}
function isNodeMatchingSelectorFocusable(node) {
if (node.disabled || node.tagName === 'INPUT' && node.type === 'hidden' || isNonTabbableRadio(node)) {
return false;
}
return true;
}
function defaultGetTabbable(root) {
const regularTabNodes = [];
const orderedTabNodes = [];
Array.from(root.querySelectorAll(candidatesSelector)).forEach((node, i) => {
const nodeTabIndex = getTabIndex(node);
if (nodeTabIndex === -1 || !isNodeMatchingSelectorFocusable(node)) {
return;
}
if (nodeTabIndex === 0) {
regularTabNodes.push(node);
} else {
orderedTabNodes.push({
documentOrder: i,
tabIndex: nodeTabIndex,
node: node
});
}
});
return orderedTabNodes.sort((a, b) => a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex).map(a => a.node).concat(regularTabNodes);
}
function defaultIsEnabled() {
return true;
}
/**
* Utility component that locks focus inside the component.
*
* Demos:
*
* - [Focus Trap](https://mui.com/base/react-focus-trap/)
*
* API:
*
* - [FocusTrap API](https://mui.com/base/api/focus-trap/)
*/
function FocusTrap(props) {
const {
children,
disableAutoFocus = false,
disableEnforceFocus = false,
disableRestoreFocus = false,
getTabbable = defaultGetTabbable,
isEnabled = defaultIsEnabled,
open
} = props;
const ignoreNextEnforceFocus = reactExports.useRef(false);
const sentinelStart = reactExports.useRef(null);
const sentinelEnd = reactExports.useRef(null);
const nodeToRestore = reactExports.useRef(null);
const reactFocusEventTarget = reactExports.useRef(null);
// This variable is useful when disableAutoFocus is true.
// It waits for the active element to move into the component to activate.
const activated = reactExports.useRef(false);
const rootRef = reactExports.useRef(null);
// @ts-expect-error TODO upstream fix
const handleRef = useForkRef(children.ref, rootRef);
const lastKeydown = reactExports.useRef(null);
reactExports.useEffect(() => {
// We might render an empty child.
if (!open || !rootRef.current) {
return;
}
activated.current = !disableAutoFocus;
}, [disableAutoFocus, open]);
reactExports.useEffect(() => {
// We might render an empty child.
if (!open || !rootRef.current) {
return;
}
const doc = ownerDocument(rootRef.current);
if (!rootRef.current.contains(doc.activeElement)) {
if (!rootRef.current.hasAttribute('tabIndex')) {
rootRef.current.setAttribute('tabIndex', '-1');
}
if (activated.current) {
rootRef.current.focus();
}
}
return () => {
// restoreLastFocus()
if (!disableRestoreFocus) {
// In IE11 it is possible for document.activeElement to be null resulting
// in nodeToRestore.current being null.
// Not all elements in IE11 have a focus method.
// Once IE11 support is dropped the focus() call can be unconditional.
if (nodeToRestore.current && nodeToRestore.current.focus) {
ignoreNextEnforceFocus.current = true;
nodeToRestore.current.focus();
}
nodeToRestore.current = null;
}
};
// Missing `disableRestoreFocus` which is fine.
// We don't support changing that prop on an open FocusTrap
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [open]);
reactExports.useEffect(() => {
// We might render an empty child.
if (!open || !rootRef.current) {
return;
}
const doc = ownerDocument(rootRef.current);
const contain = nativeEvent => {
const {
current: rootElement
} = rootRef;
// Cleanup functions are executed lazily in React 17.
// Contain can be called between the component being unmounted and its cleanup function being run.
if (rootElement === null) {
return;
}
if (!doc.hasFocus() || disableEnforceFocus || !isEnabled() || ignoreNextEnforceFocus.current) {
ignoreNextEnforceFocus.current = false;
return;
}
if (!rootElement.contains(doc.activeElement)) {
// if the focus event is not coming from inside the children's react tree, reset the refs
if (nativeEvent && reactFocusEventTarget.current !== nativeEvent.target || doc.activeElement !== reactFocusEventTarget.current) {
reactFocusEventTarget.current = null;
} else if (reactFocusEventTarget.current !== null) {
return;
}
if (!activated.current) {
return;
}
let tabbable = [];
if (doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current) {
tabbable = getTabbable(rootRef.current);
}
if (tabbable.length > 0) {
var _lastKeydown$current, _lastKeydown$current2;
const isShiftTab = Boolean(((_lastKeydown$current = lastKeydown.current) == null ? void 0 : _lastKeydown$current.shiftKey) && ((_lastKeydown$current2 = lastKeydown.current) == null ? void 0 : _lastKeydown$current2.key) === 'Tab');
const focusNext = tabbable[0];
const focusPrevious = tabbable[tabbable.length - 1];
if (typeof focusNext !== 'string' && typeof focusPrevious !== 'string') {
if (isShiftTab) {
focusPrevious.focus();
} else {
focusNext.focus();
}
}
} else {
rootElement.focus();
}
}
};
const loopFocus = nativeEvent => {
lastKeydown.current = nativeEvent;
if (disableEnforceFocus || !isEnabled() || nativeEvent.key !== 'Tab') {
return;
}
// Make sure the next tab starts from the right place.
// doc.activeElement refers to the origin.
if (doc.activeElement === rootRef.current && nativeEvent.shiftKey) {
// We need to ignore the next contain as
// it will try to move the focus back to the rootRef element.
ignoreNextEnforceFocus.current = true;
if (sentinelEnd.current) {
sentinelEnd.current.focus();
}
}
};
doc.addEventListener('focusin', contain);
doc.addEventListener('keydown', loopFocus, true);
// With Edge, Safari and Firefox, no focus related events are fired when the focused area stops being a focused area.
// e.g. https://bugzilla.mozilla.org/show_bug.cgi?id=559561.
// Instead, we can look if the active element was restored on the BODY element.
//
// The whatwg spec defines how the browser should behave but does not explicitly mention any events:
// https://html.spec.whatwg.org/multipage/interaction.html#focus-fixup-rule.
const interval = setInterval(() => {
if (doc.activeElement && doc.activeElement.tagName === 'BODY') {
contain(null);
}
}, 50);
return () => {
clearInterval(interval);
doc.removeEventListener('focusin', contain);
doc.removeEventListener('keydown', loopFocus, true);
};
}, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open, getTabbable]);
const onFocus = event => {
if (nodeToRestore.current === null) {
nodeToRestore.current = event.relatedTarget;
}
activated.current = true;
reactFocusEventTarget.current = event.target;
const childrenPropsHandler = children.props.onFocus;
if (childrenPropsHandler) {
childrenPropsHandler(event);
}
};
const handleFocusSentinel = event => {
if (nodeToRestore.current === null) {
nodeToRestore.current = event.relatedTarget;
}
activated.current = true;
};
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/jsx("div", {
tabIndex: open ? 0 : -1,
onFocus: handleFocusSentinel,
ref: sentinelStart,
"data-testid": "sentinelStart"
}), /*#__PURE__*/reactExports.cloneElement(children, {
ref: handleRef,
onFocus
}), /*#__PURE__*/jsx("div", {
tabIndex: open ? 0 : -1,
onFocus: handleFocusSentinel,
ref: sentinelEnd,
"data-testid": "sentinelEnd"
})]
});
}
var top = 'top';
var bottom = 'bottom';
var right = 'right';
var left = 'left';
var auto = 'auto';
var basePlacements = [top, bottom, right, left];
var start = 'start';
var end = 'end';
var clippingParents = 'clippingParents';
var viewport = 'viewport';
var popper = 'popper';
var reference = 'reference';
var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {
return acc.concat([placement + "-" + start, placement + "-" + end]);
}, []);
var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {
return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
}, []); // modifiers that need to read the DOM
var beforeRead = 'beforeRead';
var read = 'read';
var afterRead = 'afterRead'; // pure-logic modifiers
var beforeMain = 'beforeMain';
var main = 'main';
var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)
var beforeWrite = 'beforeWrite';
var write = 'write';
var afterWrite = 'afterWrite';
var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
function getNodeName(element) {
return element ? (element.nodeName || '').toLowerCase() : null;
}
function getWindow(node) {
if (node == null) {
return window;
}
if (node.toString() !== '[object Window]') {
var ownerDocument = node.ownerDocument;
return ownerDocument ? ownerDocument.defaultView || window : window;
}
return node;
}
function isElement(node) {
var OwnElement = getWindow(node).Element;
return node instanceof OwnElement || node instanceof Element;
}
function isHTMLElement$1(node) {
var OwnElement = getWindow(node).HTMLElement;
return node instanceof OwnElement || node instanceof HTMLElement;
}
function isShadowRoot(node) {
// IE 11 has no ShadowRoot
if (typeof ShadowRoot === 'undefined') {
return false;
}
var OwnElement = getWindow(node).ShadowRoot;
return node instanceof OwnElement || node instanceof ShadowRoot;
}
// and applies them to the HTMLElements such as popper and arrow
function applyStyles(_ref) {
var state = _ref.state;
Object.keys(state.elements).forEach(function (name) {
var style = state.styles[name] || {};
var attributes = state.attributes[name] || {};
var element = state.elements[name]; // arrow is optional + virtual elements
if (!isHTMLElement$1(element) || !getNodeName(element)) {
return;
} // Flow doesn't support to extend this property, but it's the most
// effective way to apply styles to an HTMLElement
// $FlowFixMe[cannot-write]
Object.assign(element.style, style);
Object.keys(attributes).forEach(function (name) {
var value = attributes[name];
if (value === false) {
element.removeAttribute(name);
} else {
element.setAttribute(name, value === true ? '' : value);
}
});
});
}
function effect$2(_ref2) {
var state = _ref2.state;
var initialStyles = {
popper: {
position: state.options.strategy,
left: '0',
top: '0',
margin: '0'
},
arrow: {
position: 'absolute'
},
reference: {}
};
Object.assign(state.elements.popper.style, initialStyles.popper);
state.styles = initialStyles;
if (state.elements.arrow) {
Object.assign(state.elements.arrow.style, initialStyles.arrow);
}
return function () {
Object.keys(state.elements).forEach(function (name) {
var element = state.elements[name];
var attributes = state.attributes[name] || {};
var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them
var style = styleProperties.reduce(function (style, property) {
style[property] = '';
return style;
}, {}); // arrow is optional + virtual elements
if (!isHTMLElement$1(element) || !getNodeName(element)) {
return;
}
Object.assign(element.style, style);
Object.keys(attributes).forEach(function (attribute) {
element.removeAttribute(attribute);
});
});
};
} // eslint-disable-next-line import/no-unused-modules
const applyStyles$1 = {
name: 'applyStyles',
enabled: true,
phase: 'write',
fn: applyStyles,
effect: effect$2,
requires: ['computeStyles']
};
function getBasePlacement(placement) {
return placement.split('-')[0];
}
var max = Math.max;
var min = Math.min;
var round$1 = Math.round;
function getUAString() {
var uaData = navigator.userAgentData;
if (uaData != null && uaData.brands) {
return uaData.brands.map(function (item) {
return item.brand + "/" + item.version;
}).join(' ');
}
return navigator.userAgent;
}
function isLayoutViewport() {
return !/^((?!chrome|android).)*safari/i.test(getUAString());
}
function getBoundingClientRect(element, includeScale, isFixedStrategy) {
if (includeScale === void 0) {
includeScale = false;
}
if (isFixedStrategy === void 0) {
isFixedStrategy = false;
}
var clientRect = element.getBoundingClientRect();
var scaleX = 1;
var scaleY = 1;
if (includeScale && isHTMLElement$1(element)) {
scaleX = element.offsetWidth > 0 ? round$1(clientRect.width) / element.offsetWidth || 1 : 1;
scaleY = element.offsetHeight > 0 ? round$1(clientRect.height) / element.offsetHeight || 1 : 1;
}
var _ref = isElement(element) ? getWindow(element) : window,
visualViewport = _ref.visualViewport;
var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
var width = clientRect.width / scaleX;
var height = clientRect.height / scaleY;
return {
width: width,
height: height,
top: y,
right: x + width,
bottom: y + height,
left: x,
x: x,
y: y
};
}
// means it doesn't take into account transforms.
function getLayoutRect(element) {
var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.
// Fixes https://github.com/popperjs/popper-core/issues/1223
var width = element.offsetWidth;
var height = element.offsetHeight;
if (Math.abs(clientRect.width - width) <= 1) {
width = clientRect.width;
}
if (Math.abs(clientRect.height - height) <= 1) {
height = clientRect.height;
}
return {
x: element.offsetLeft,
y: element.offsetTop,
width: width,
height: height
};
}
function contains(parent, child) {
var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method
if (parent.contains(child)) {
return true;
} // then fallback to custom implementation with Shadow DOM support
else if (rootNode && isShadowRoot(rootNode)) {
var next = child;
do {
if (next && parent.isSameNode(next)) {
return true;
} // $FlowFixMe[prop-missing]: need a better way to handle this...
next = next.parentNode || next.host;
} while (next);
} // Give up, the result is false
return false;
}
function getComputedStyle(element) {
return getWindow(element).getComputedStyle(element);
}
function isTableElement(element) {
return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;
}
function getDocumentElement(element) {
// $FlowFixMe[incompatible-return]: assume body is always available
return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]
element.document) || window.document).documentElement;
}
function getParentNode(element) {
if (getNodeName(element) === 'html') {
return element;
}
return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
// $FlowFixMe[incompatible-return]
// $FlowFixMe[prop-missing]
element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
element.parentNode || ( // DOM Element detected
isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
// $FlowFixMe[incompatible-call]: HTMLElement is a Node
getDocumentElement(element) // fallback
);
}
function getTrueOffsetParent(element) {
if (!isHTMLElement$1(element) || // https://github.com/popperjs/popper-core/issues/837
getComputedStyle(element).position === 'fixed') {
return null;
}
return element.offsetParent;
} // `.offsetParent` reports `null` for fixed elements, while absolute elements
// return the containing block
function getContainingBlock(element) {
var isFirefox = /firefox/i.test(getUAString());
var isIE = /Trident/i.test(getUAString());
if (isIE && isHTMLElement$1(element)) {
// In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
var elementCss = getComputedStyle(element);
if (elementCss.position === 'fixed') {
return null;
}
}
var currentNode = getParentNode(element);
if (isShadowRoot(currentNode)) {
currentNode = currentNode.host;
}
while (isHTMLElement$1(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
// create a containing block.
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {
return currentNode;
} else {
currentNode = currentNode.parentNode;
}
}
return null;
} // Gets the closest ancestor positioned element. Handles some edge cases,
// such as table ancestors and cross browser bugs.
function getOffsetParent(element) {
var window = getWindow(element);
var offsetParent = getTrueOffsetParent(element);
while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
offsetParent = getTrueOffsetParent(offsetParent);
}
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {
return window;
}
return offsetParent || getContainingBlock(element) || window;
}
function getMainAxisFromPlacement(placement) {
return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
}
function within(min$1, value, max$1) {
return max(min$1, min(value, max$1));
}
function withinMaxClamp(min, value, max) {
var v = within(min, value, max);
return v > max ? max : v;
}
function getFreshSideObject() {
return {
top: 0,
right: 0,
bottom: 0,
left: 0
};
}
function mergePaddingObject(paddingObject) {
return Object.assign({}, getFreshSideObject(), paddingObject);
}
function expandToHashMap(value, keys) {
return keys.reduce(function (hashMap, key) {
hashMap[key] = value;
return hashMap;
}, {});
}
var toPaddingObject = function toPaddingObject(padding, state) {
padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
placement: state.placement
})) : padding;
return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
};
function arrow(_ref) {
var _state$modifiersData$;
var state = _ref.state,
name = _ref.name,
options = _ref.options;
var arrowElement = state.elements.arrow;
var popperOffsets = state.modifiersData.popperOffsets;
var basePlacement = getBasePlacement(state.placement);
var axis = getMainAxisFromPlacement(basePlacement);
var isVertical = [left, right].indexOf(basePlacement) >= 0;
var len = isVertical ? 'height' : 'width';
if (!arrowElement || !popperOffsets) {
return;
}
var paddingObject = toPaddingObject(options.padding, state);
var arrowRect = getLayoutRect(arrowElement);
var minProp = axis === 'y' ? top : left;
var maxProp = axis === 'y' ? bottom : right;
var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
var startDiff = popperOffsets[axis] - state.rects.reference[axis];
var arrowOffsetParent = getOffsetParent(arrowElement);
var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
// outside of the popper bounds
var min = paddingObject[minProp];
var max = clientSize - arrowRect[len] - paddingObject[maxProp];
var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
var offset = within(min, center, max); // Prevents breaking syntax highlighting...
var axisProp = axis;
state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
}
function effect$1(_ref2) {
var state = _ref2.state,
options = _ref2.options;
var _options$element = options.element,
arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
if (arrowElement == null) {
return;
} // CSS selector
if (typeof arrowElement === 'string') {
arrowElement = state.elements.popper.querySelector(arrowElement);
if (!arrowElement) {
return;
}
}
if (!contains(state.elements.popper, arrowElement)) {
return;
}
state.elements.arrow = arrowElement;
} // eslint-disable-next-line import/no-unused-modules
const arrow$1 = {
name: 'arrow',
enabled: true,
phase: 'main',
fn: arrow,
effect: effect$1,
requires: ['popperOffsets'],
requiresIfExists: ['preventOverflow']
};
function getVariation(placement) {
return placement.split('-')[1];
}
var unsetSides = {
top: 'auto',
right: 'auto',
bottom: 'auto',
left: 'auto'
}; // Round the offsets to the nearest suitable subpixel based on the DPR.
// Zooming can change the DPR, but it seems to report a value that will
// cleanly divide the values into the appropriate subpixels.
function roundOffsetsByDPR(_ref) {
var x = _ref.x,
y = _ref.y;
var win = window;
var dpr = win.devicePixelRatio || 1;
return {
x: round$1(x * dpr) / dpr || 0,
y: round$1(y * dpr) / dpr || 0
};
}
function mapToStyles(_ref2) {
var _Object$assign2;
var popper = _ref2.popper,
popperRect = _ref2.popperRect,
placement = _ref2.placement,
variation = _ref2.variation,
offsets = _ref2.offsets,
position = _ref2.position,
gpuAcceleration = _ref2.gpuAcceleration,
adaptive = _ref2.adaptive,
roundOffsets = _ref2.roundOffsets,
isFixed = _ref2.isFixed;
var _offsets$x = offsets.x,
x = _offsets$x === void 0 ? 0 : _offsets$x,
_offsets$y = offsets.y,
y = _offsets$y === void 0 ? 0 : _offsets$y;
var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
x: x,
y: y
}) : {
x: x,
y: y
};
x = _ref3.x;
y = _ref3.y;
var hasX = offsets.hasOwnProperty('x');
var hasY = offsets.hasOwnProperty('y');
var sideX = left;
var sideY = top;
var win = window;
if (adaptive) {
var offsetParent = getOffsetParent(popper);
var heightProp = 'clientHeight';
var widthProp = 'clientWidth';
if (offsetParent === getWindow(popper)) {
offsetParent = getDocumentElement(popper);
if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {
heightProp = 'scrollHeight';
widthProp = 'scrollWidth';
}
} // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it
offsetParent = offsetParent;
if (placement === top || (placement === left || placement === right) && variation === end) {
sideY = bottom;
var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
offsetParent[heightProp];
y -= offsetY - popperRect.height;
y *= gpuAcceleration ? 1 : -1;
}
if (placement === left || (placement === top || placement === bottom) && variation === end) {
sideX = right;
var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
offsetParent[widthProp];
x -= offsetX - popperRect.width;
x *= gpuAcceleration ? 1 : -1;
}
}
var commonStyles = Object.assign({
position: position
}, adaptive && unsetSides);
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
x: x,
y: y
}) : {
x: x,
y: y
};
x = _ref4.x;
y = _ref4.y;
if (gpuAcceleration) {
var _Object$assign;
return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
}
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
}
function computeStyles(_ref5) {
var state = _ref5.state,
options = _ref5.options;
var _options$gpuAccelerat = options.gpuAcceleration,
gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
_options$adaptive = options.adaptive,
adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
_options$roundOffsets = options.roundOffsets,
roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
var commonStyles = {
placement: getBasePlacement(state.placement),
variation: getVariation(state.placement),
popper: state.elements.popper,
popperRect: state.rects.popper,
gpuAcceleration: gpuAcceleration,
isFixed: state.options.strategy === 'fixed'
};
if (state.modifiersData.popperOffsets != null) {
state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
offsets: state.modifiersData.popperOffsets,
position: state.options.strategy,
adaptive: adaptive,
roundOffsets: roundOffsets
})));
}
if (state.modifiersData.arrow != null) {
state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
offsets: state.modifiersData.arrow,
position: 'absolute',
adaptive: false,
roundOffsets: roundOffsets
})));
}
state.attributes.popper = Object.assign({}, state.attributes.popper, {
'data-popper-placement': state.placement
});
} // eslint-disable-next-line import/no-unused-modules
const computeStyles$1 = {
name: 'computeStyles',
enabled: true,
phase: 'beforeWrite',
fn: computeStyles,
data: {}
};
var passive = {
passive: true
};
function effect(_ref) {
var state = _ref.state,
instance = _ref.instance,
options = _ref.options;
var _options$scroll = options.scroll,
scroll = _options$scroll === void 0 ? true : _options$scroll,
_options$resize = options.resize,
resize = _options$resize === void 0 ? true : _options$resize;
var window = getWindow(state.elements.popper);
var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
if (scroll) {
scrollParents.forEach(function (scrollParent) {
scrollParent.addEventListener('scroll', instance.update, passive);
});
}
if (resize) {
window.addEventListener('resize', instance.update, passive);
}
return function () {
if (scroll) {
scrollParents.forEach(function (scrollParent) {
scrollParent.removeEventListener('scroll', instance.update, passive);
});
}
if (resize) {
window.removeEventListener('resize', instance.update, passive);
}
};
} // eslint-disable-next-line import/no-unused-modules
const eventListeners = {
name: 'eventListeners',
enabled: true,
phase: 'write',
fn: function fn() {},
effect: effect,
data: {}
};
var hash$1 = {
left: 'right',
right: 'left',
bottom: 'top',
top: 'bottom'
};
function getOppositePlacement(placement) {
return placement.replace(/left|right|bottom|top/g, function (matched) {
return hash$1[matched];
});
}
var hash = {
start: 'end',
end: 'start'
};
function getOppositeVariationPlacement(placement) {
return placement.replace(/start|end/g, function (matched) {
return hash[matched];
});
}
function getWindowScroll(node) {
var win = getWindow(node);
var scrollLeft = win.pageXOffset;
var scrollTop = win.pageYOffset;
return {
scrollLeft: scrollLeft,
scrollTop: scrollTop
};
}
function getWindowScrollBarX(element) {
// If <html> has a CSS width greater than the viewport, then this will be
// incorrect for RTL.
// Popper 1 is broken in this case and never had a bug report so let's assume
// it's not an issue. I don't think anyone ever specifies width on <html>
// anyway.
// Browsers where the left scrollbar doesn't cause an issue report `0` for
// this (e.g. Edge 2019, IE11, Safari)
return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
}
function getViewportRect(element, strategy) {
var win = getWindow(element);
var html = getDocumentElement(element);
var visualViewport = win.visualViewport;
var width = html.clientWidth;
var height = html.clientHeight;
var x = 0;
var y = 0;
if (visualViewport) {
width = visualViewport.width;
height = visualViewport.height;
var layoutViewport = isLayoutViewport();
if (layoutViewport || !layoutViewport && strategy === 'fixed') {
x = visualViewport.offsetLeft;
y = visualViewport.offsetTop;
}
}
return {
width: width,
height: height,
x: x + getWindowScrollBarX(element),
y: y
};
}
// of the `<html>` and `<body>` rect bounds if horizontally scrollable
function getDocumentRect(element) {
var _element$ownerDocumen;
var html = getDocumentElement(element);
var winScroll = getWindowScroll(element);
var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
var y = -winScroll.scrollTop;
if (getComputedStyle(body || html).direction === 'rtl') {
x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
}
return {
width: width,
height: height,
x: x,
y: y
};
}
function isScrollParent(element) {
// Firefox wants us to check `-x` and `-y` variations as well
var _getComputedStyle = getComputedStyle(element),
overflow = _getComputedStyle.overflow,
overflowX = _getComputedStyle.overflowX,
overflowY = _getComputedStyle.overflowY;
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
}
function getScrollParent(node) {
if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {
// $FlowFixMe[incompatible-return]: assume body is always available
return node.ownerDocument.body;
}
if (isHTMLElement$1(node) && isScrollParent(node)) {
return node;
}
return getScrollParent(getParentNode(node));
}
/*
given a DOM element, return the list of all scroll parents, up the list of ancesors
until we get to the top window object. This list is what we attach scroll listeners
to, because if any of these parent elements scroll, we'll need to re-calculate the
reference element's position.
*/
function listScrollParents(element, list) {
var _element$ownerDocumen;
if (list === void 0) {
list = [];
}
var scrollParent = getScrollParent(element);
var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
var win = getWindow(scrollParent);
var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
var updatedList = list.concat(target);
return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
updatedList.concat(listScrollParents(getParentNode(target)));
}
function rectToClientRect(rect) {
return Object.assign({}, rect, {
left: rect.x,
top: rect.y,
right: rect.x + rect.width,
bottom: rect.y + rect.height
});
}
function getInnerBoundingClientRect(element, strategy) {
var rect = getBoundingClientRect(element, false, strategy === 'fixed');
rect.top = rect.top + element.clientTop;
rect.left = rect.left + element.clientLeft;
rect.bottom = rect.top + element.clientHeight;
rect.right = rect.left + element.clientWidth;
rect.width = element.clientWidth;
rect.height = element.clientHeight;
rect.x = rect.left;
rect.y = rect.top;
return rect;
}
function getClientRectFromMixedType(element, clippingParent, strategy) {
return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
} // A "clipping parent" is an overflowable container with the characteristic of
// clipping (or hiding) overflowing elements with a position different from
// `initial`
function getClippingParents(element) {
var clippingParents = listScrollParents(getParentNode(element));
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
var clipperElement = canEscapeClipping && isHTMLElement$1(element) ? getOffsetParent(element) : element;
if (!isElement(clipperElement)) {
return [];
} // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414
return clippingParents.filter(function (clippingParent) {
return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';
});
} // Gets the maximum area that the element is visible in due to any number of
// clipping parents
function getClippingRect(element, boundary, rootBoundary, strategy) {
var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
var firstClippingParent = clippingParents[0];
var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
var rect = getClientRectFromMixedType(element, clippingParent, strategy);
accRect.top = max(rect.top, accRect.top);
accRect.right = min(rect.right, accRect.right);
accRect.bottom = min(rect.bottom, accRect.bottom);
accRect.left = max(rect.left, accRect.left);
return accRect;
}, getClientRectFromMixedType(element, firstClippingParent, strategy));
clippingRect.width = clippingRect.right - clippingRect.left;
clippingRect.height = clippingRect.bottom - clippingRect.top;
clippingRect.x = clippingRect.left;
clippingRect.y = clippingRect.top;
return clippingRect;
}
function computeOffsets(_ref) {
var reference = _ref.reference,
element = _ref.element,
placement = _ref.placement;
var basePlacement = placement ? getBasePlacement(placement) : null;
var variation = placement ? getVariation(placement) : null;
var commonX = reference.x + reference.width / 2 - element.width / 2;
var commonY = reference.y + reference.height / 2 - element.height / 2;
var offsets;
switch (basePlacement) {
case top:
offsets = {
x: commonX,
y: reference.y - element.height
};
break;
case bottom:
offsets = {
x: commonX,
y: reference.y + reference.height
};
break;
case right:
offsets = {
x: reference.x + reference.width,
y: commonY
};
break;
case left:
offsets = {
x: reference.x - element.width,
y: commonY
};
break;
default:
offsets = {
x: reference.x,
y: reference.y
};
}
var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
if (mainAxis != null) {
var len = mainAxis === 'y' ? 'height' : 'width';
switch (variation) {
case start:
offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);
break;
case end:
offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);
break;
}
}
return offsets;
}
function detectOverflow(state, options) {
if (options === void 0) {
options = {};
}
var _options = options,
_options$placement = _options.placement,
placement = _options$placement === void 0 ? state.placement : _options$placement,
_options$strategy = _options.strategy,
strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,
_options$boundary = _options.boundary,
boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
_options$rootBoundary = _options.rootBoundary,
rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,
_options$elementConte = _options.elementContext,
elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,
_options$altBoundary = _options.altBoundary,
altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,
_options$padding = _options.padding,
padding = _options$padding === void 0 ? 0 : _options$padding;
var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
var altContext = elementContext === popper ? reference : popper;
var popperRect = state.rects.popper;
var element = state.elements[altBoundary ? altContext : elementContext];
var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
var referenceClientRect = getBoundingClientRect(state.elements.reference);
var popperOffsets = computeOffsets({
reference: referenceClientRect,
element: popperRect,
strategy: 'absolute',
placement: placement
});
var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect
// 0 or negative = within the clipping rect
var overflowOffsets = {
top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
right: elementClientRect.right - clippingClientRect.right + paddingObject.right
};
var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element
if (elementContext === popper && offsetData) {
var offset = offsetData[placement];
Object.keys(overflowOffsets).forEach(function (key) {
var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';
overflowOffsets[key] += offset[axis] * multiply;
});
}
return overflowOffsets;
}
function computeAutoPlacement(state, options) {
if (options === void 0) {
options = {};
}
var _options = options,
placement = _options.placement,
boundary = _options.boundary,
rootBoundary = _options.rootBoundary,
padding = _options.padding,
flipVariations = _options.flipVariations,
_options$allowedAutoP = _options.allowedAutoPlacements,
allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
var variation = getVariation(placement);
var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {
return getVariation(placement) === variation;
}) : basePlacements;
var allowedPlacements = placements$1.filter(function (placement) {
return allowedAutoPlacements.indexOf(placement) >= 0;
});
if (allowedPlacements.length === 0) {
allowedPlacements = placements$1;
} // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
var overflows = allowedPlacements.reduce(function (acc, placement) {
acc[placement] = detectOverflow(state, {
placement: placement,
boundary: boundary,
rootBoundary: rootBoundary,
padding: padding
})[getBasePlacement(placement)];
return acc;
}, {});
return Object.keys(overflows).sort(function (a, b) {
return overflows[a] - overflows[b];
});
}
function getExpandedFallbackPlacements(placement) {
if (getBasePlacement(placement) === auto) {
return [];
}
var oppositePlacement = getOppositePlacement(placement);
return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
}
function flip(_ref) {
var state = _ref.state,
options = _ref.options,
name = _ref.name;
if (state.modifiersData[name]._skip) {
return;
}
var _options$mainAxis = options.mainAxis,
checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
_options$altAxis = options.altAxis,
checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,
specifiedFallbackPlacements = options.fallbackPlacements,
padding = options.padding,
boundary = options.boundary,
rootBoundary = options.rootBoundary,
altBoundary = options.altBoundary,
_options$flipVariatio = options.flipVariations,
flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,
allowedAutoPlacements = options.allowedAutoPlacements;
var preferredPlacement = state.options.placement;
var basePlacement = getBasePlacement(preferredPlacement);
var isBasePlacement = basePlacement === preferredPlacement;
var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {
return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {
placement: placement,
boundary: boundary,
rootBoundary: rootBoundary,
padding: padding,
flipVariations: flipVariations,
allowedAutoPlacements: allowedAutoPlacements
}) : placement);
}, []);
var referenceRect = state.rects.reference;
var popperRect = state.rects.popper;
var checksMap = new Map();
var makeFallbackChecks = true;
var firstFittingPlacement = placements[0];
for (var i = 0; i < placements.length; i++) {
var placement = placements[i];
var _basePlacement = getBasePlacement(placement);
var isStartVariation = getVariation(placement) === start;
var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
var len = isVertical ? 'width' : 'height';
var overflow = detectOverflow(state, {
placement: placement,
boundary: boundary,
rootBoundary: rootBoundary,
altBoundary: altBoundary,
padding: padding
});
var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
if (referenceRect[len] > popperRect[len]) {
mainVariationSide = getOppositePlacement(mainVariationSide);
}
var altVariationSide = getOppositePlacement(mainVariationSide);
var checks = [];
if (checkMainAxis) {
checks.push(overflow[_basePlacement] <= 0);
}
if (checkAltAxis) {
checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
}
if (checks.every(function (check) {
return check;
})) {
firstFittingPlacement = placement;
makeFallbackChecks = false;
break;
}
checksMap.set(placement, checks);
}
if (makeFallbackChecks) {
// `2` may be desired in some cases – research later
var numberOfChecks = flipVariations ? 3 : 1;
var _loop = function _loop(_i) {
var fittingPlacement = placements.find(function (placement) {
var checks = checksMap.get(placement);
if (checks) {
return checks.slice(0, _i).every(function (check) {
return check;
});
}
});
if (fittingPlacement) {
firstFittingPlacement = fittingPlacement;
return "break";
}
};
for (var _i = numberOfChecks; _i > 0; _i--) {
var _ret = _loop(_i);
if (_ret === "break") break;
}
}
if (state.placement !== firstFittingPlacement) {
state.modifiersData[name]._skip = true;
state.placement = firstFittingPlacement;
state.reset = true;
}
} // eslint-disable-next-line import/no-unused-modules
const flip$1 = {
name: 'flip',
enabled: true,
phase: 'main',
fn: flip,
requiresIfExists: ['offset'],
data: {
_skip: false
}
};
function getSideOffsets(overflow, rect, preventedOffsets) {
if (preventedOffsets === void 0) {
preventedOffsets = {
x: 0,
y: 0
};
}
return {
top: overflow.top - rect.height - preventedOffsets.y,
right: overflow.right - rect.width + preventedOffsets.x,
bottom: overflow.bottom - rect.height + preventedOffsets.y,
left: overflow.left - rect.width - preventedOffsets.x
};
}
function isAnySideFullyClipped(overflow) {
return [top, right, bottom, left].some(function (side) {
return overflow[side] >= 0;
});
}
function hide(_ref) {
var state = _ref.state,
name = _ref.name;
var referenceRect = state.rects.reference;
var popperRect = state.rects.popper;
var preventedOffsets = state.modifiersData.preventOverflow;
var referenceOverflow = detectOverflow(state, {
elementContext: 'reference'
});
var popperAltOverflow = detectOverflow(state, {
altBoundary: true
});
var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
state.modifiersData[name] = {
referenceClippingOffsets: referenceClippingOffsets,
popperEscapeOffsets: popperEscapeOffsets,
isReferenceHidden: isReferenceHidden,
hasPopperEscaped: hasPopperEscaped
};
state.attributes.popper = Object.assign({}, state.attributes.popper, {
'data-popper-reference-hidden': isReferenceHidden,
'data-popper-escaped': hasPopperEscaped
});
} // eslint-disable-next-line import/no-unused-modules
const hide$1 = {
name: 'hide',
enabled: true,
phase: 'main',
requiresIfExists: ['preventOverflow'],
fn: hide
};
function distanceAndSkiddingToXY(placement, rects, offset) {
var basePlacement = getBasePlacement(placement);
var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {
placement: placement
})) : offset,
skidding = _ref[0],
distance = _ref[1];
skidding = skidding || 0;
distance = (distance || 0) * invertDistance;
return [left, right].indexOf(basePlacement) >= 0 ? {
x: distance,
y: skidding
} : {
x: skidding,
y: distance
};
}
function offset(_ref2) {
var state = _ref2.state,
options = _ref2.options,
name = _ref2.name;
var _options$offset = options.offset,
offset = _options$offset === void 0 ? [0, 0] : _options$offset;
var data = placements.reduce(function (acc, placement) {
acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);
return acc;
}, {});
var _data$state$placement = data[state.placement],
x = _data$state$placement.x,
y = _data$state$placement.y;
if (state.modifiersData.popperOffsets != null) {
state.modifiersData.popperOffsets.x += x;
state.modifiersData.popperOffsets.y += y;
}
state.modifiersData[name] = data;
} // eslint-disable-next-line import/no-unused-modules
const offset$1 = {
name: 'offset',
enabled: true,
phase: 'main',
requires: ['popperOffsets'],
fn: offset
};
function popperOffsets(_ref) {
var state = _ref.state,
name = _ref.name;
// Offsets are the actual position the popper needs to have to be
// properly positioned near its reference element
// This is the most basic placement, and will be adjusted by
// the modifiers in the next step
state.modifiersData[name] = computeOffsets({
reference: state.rects.reference,
element: state.rects.popper,
strategy: 'absolute',
placement: state.placement
});
} // eslint-disable-next-line import/no-unused-modules
const popperOffsets$1 = {
name: 'popperOffsets',
enabled: true,
phase: 'read',
fn: popperOffsets,
data: {}
};
function getAltAxis(axis) {
return axis === 'x' ? 'y' : 'x';
}
function preventOverflow(_ref) {
var state = _ref.state,
options = _ref.options,
name = _ref.name;
var _options$mainAxis = options.mainAxis,
checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
_options$altAxis = options.altAxis,
checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
boundary = options.boundary,
rootBoundary = options.rootBoundary,
altBoundary = options.altBoundary,
padding = options.padding,
_options$tether = options.tether,
tether = _options$tether === void 0 ? true : _options$tether,
_options$tetherOffset = options.tetherOffset,
tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
var overflow = detectOverflow(state, {
boundary: boundary,
rootBoundary: rootBoundary,
padding: padding,
altBoundary: altBoundary
});
var basePlacement = getBasePlacement(state.placement);
var variation = getVariation(state.placement);
var isBasePlacement = !variation;
var mainAxis = getMainAxisFromPlacement(basePlacement);
var altAxis = getAltAxis(mainAxis);
var popperOffsets = state.modifiersData.popperOffsets;
var referenceRect = state.rects.reference;
var popperRect = state.rects.popper;
var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
placement: state.placement
})) : tetherOffset;
var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
mainAxis: tetherOffsetValue,
altAxis: tetherOffsetValue
} : Object.assign({
mainAxis: 0,
altAxis: 0
}, tetherOffsetValue);
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
var data = {
x: 0,
y: 0
};
if (!popperOffsets) {
return;
}
if (checkMainAxis) {
var _offsetModifierState$;
var mainSide = mainAxis === 'y' ? top : left;
var altSide = mainAxis === 'y' ? bottom : right;
var len = mainAxis === 'y' ? 'height' : 'width';
var offset = popperOffsets[mainAxis];
var min$1 = offset + overflow[mainSide];
var max$1 = offset - overflow[altSide];
var additive = tether ? -popperRect[len] / 2 : 0;
var minLen = variation === start ? referenceRect[len] : popperRect[len];
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
// outside the reference bounds
var arrowElement = state.elements.arrow;
var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
width: 0,
height: 0
};
var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
var arrowPaddingMin = arrowPaddingObject[mainSide];
var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
// to include its full size in the calculation. If the reference is small
// and near the edge of a boundary, the popper can overflow even if the
// reference is not overflowing as well (e.g. virtual elements with no
// width or height)
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
var tetherMax = offset + maxOffset - offsetModifierValue;
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
popperOffsets[mainAxis] = preventedOffset;
data[mainAxis] = preventedOffset - offset;
}
if (checkAltAxis) {
var _offsetModifierState$2;
var _mainSide = mainAxis === 'x' ? top : left;
var _altSide = mainAxis === 'x' ? bottom : right;
var _offset = popperOffsets[altAxis];
var _len = altAxis === 'y' ? 'height' : 'width';
var _min = _offset + overflow[_mainSide];
var _max = _offset - overflow[_altSide];
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
popperOffsets[altAxis] = _preventedOffset;
data[altAxis] = _preventedOffset - _offset;
}
state.modifiersData[name] = data;
} // eslint-disable-next-line import/no-unused-modules
const preventOverflow$1 = {
name: 'preventOverflow',
enabled: true,
phase: 'main',
fn: preventOverflow,
requiresIfExists: ['offset']
};
function getHTMLElementScroll(element) {
return {
scrollLeft: element.scrollLeft,
scrollTop: element.scrollTop
};
}
function getNodeScroll(node) {
if (node === getWindow(node) || !isHTMLElement$1(node)) {
return getWindowScroll(node);
} else {
return getHTMLElementScroll(node);
}
}
function isElementScaled(element) {
var rect = element.getBoundingClientRect();
var scaleX = round$1(rect.width) / element.offsetWidth || 1;
var scaleY = round$1(rect.height) / element.offsetHeight || 1;
return scaleX !== 1 || scaleY !== 1;
} // Returns the composite rect of an element relative to its offsetParent.
// Composite means it takes into account transforms as well as layout.
function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
if (isFixed === void 0) {
isFixed = false;
}
var isOffsetParentAnElement = isHTMLElement$1(offsetParent);
var offsetParentIsScaled = isHTMLElement$1(offsetParent) && isElementScaled(offsetParent);
var documentElement = getDocumentElement(offsetParent);
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
var scroll = {
scrollLeft: 0,
scrollTop: 0
};
var offsets = {
x: 0,
y: 0
};
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078
isScrollParent(documentElement)) {
scroll = getNodeScroll(offsetParent);
}
if (isHTMLElement$1(offsetParent)) {
offsets = getBoundingClientRect(offsetParent, true);
offsets.x += offsetParent.clientLeft;
offsets.y += offsetParent.clientTop;
} else if (documentElement) {
offsets.x = getWindowScrollBarX(documentElement);
}
}
return {
x: rect.left + scroll.scrollLeft - offsets.x,
y: rect.top + scroll.scrollTop - offsets.y,
width: rect.width,
height: rect.height
};
}
function order(modifiers) {
var map = new Map();
var visited = new Set();
var result = [];
modifiers.forEach(function (modifier) {
map.set(modifier.name, modifier);
}); // On visiting object, check for its dependencies and visit them recursively
function sort(modifier) {
visited.add(modifier.name);
var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
requires.forEach(function (dep) {
if (!visited.has(dep)) {
var depModifier = map.get(dep);
if (depModifier) {
sort(depModifier);
}
}
});
result.push(modifier);
}
modifiers.forEach(function (modifier) {
if (!visited.has(modifier.name)) {
// check for visited object
sort(modifier);
}
});
return result;
}
function orderModifiers(modifiers) {
// order based on dependencies
var orderedModifiers = order(modifiers); // order based on phase
return modifierPhases.reduce(function (acc, phase) {
return acc.concat(orderedModifiers.filter(function (modifier) {
return modifier.phase === phase;
}));
}, []);
}
function debounce(fn) {
var pending;
return function () {
if (!pending) {
pending = new Promise(function (resolve) {
Promise.resolve().then(function () {
pending = undefined;
resolve(fn());
});
});
}
return pending;
};
}
function mergeByName(modifiers) {
var merged = modifiers.reduce(function (merged, current) {
var existing = merged[current.name];
merged[current.name] = existing ? Object.assign({}, existing, current, {
options: Object.assign({}, existing.options, current.options),
data: Object.assign({}, existing.data, current.data)
}) : current;
return merged;
}, {}); // IE11 does not support Object.values
return Object.keys(merged).map(function (key) {
return merged[key];
});
}
var DEFAULT_OPTIONS = {
placement: 'bottom',
modifiers: [],
strategy: 'absolute'
};
function areValidElements() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return !args.some(function (element) {
return !(element && typeof element.getBoundingClientRect === 'function');
});
}
function popperGenerator(generatorOptions) {
if (generatorOptions === void 0) {
generatorOptions = {};
}
var _generatorOptions = generatorOptions,
_generatorOptions$def = _generatorOptions.defaultModifiers,
defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
_generatorOptions$def2 = _generatorOptions.defaultOptions,
defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
return function createPopper(reference, popper, options) {
if (options === void 0) {
options = defaultOptions;
}
var state = {
placement: 'bottom',
orderedModifiers: [],
options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
modifiersData: {},
elements: {
reference: reference,
popper: popper
},
attributes: {},
styles: {}
};
var effectCleanupFns = [];
var isDestroyed = false;
var instance = {
state: state,
setOptions: function setOptions(setOptionsAction) {
var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
cleanupModifierEffects();
state.options = Object.assign({}, defaultOptions, state.options, options);
state.scrollParents = {
reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
popper: listScrollParents(popper)
}; // Orders the modifiers based on their dependencies and `phase`
// properties
var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
state.orderedModifiers = orderedModifiers.filter(function (m) {
return m.enabled;
}); // Validate the provided modifiers so that the consumer will get warned
runModifierEffects();
return instance.update();
},
// Sync update – it will always be executed, even if not necessary. This
// is useful for low frequency updates where sync behavior simplifies the
// logic.
// For high frequency updates (e.g. `resize` and `scroll` events), always
// prefer the async Popper#update method
forceUpdate: function forceUpdate() {
if (isDestroyed) {
return;
}
var _state$elements = state.elements,
reference = _state$elements.reference,
popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
// anymore
if (!areValidElements(reference, popper)) {
return;
} // Store the reference and popper rects to be read by modifiers
state.rects = {
reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
popper: getLayoutRect(popper)
}; // Modifiers have the ability to reset the current update cycle. The
// most common use case for this is the `flip` modifier changing the
// placement, which then needs to re-run all the modifiers, because the
// logic was previously ran for the previous placement and is therefore
// stale/incorrect
state.reset = false;
state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
// is filled with the initial data specified by the modifier. This means
// it doesn't persist and is fresh on each update.
// To ensure persistent data, use `${name}#persistent`
state.orderedModifiers.forEach(function (modifier) {
return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
});
for (var index = 0; index < state.orderedModifiers.length; index++) {
if (state.reset === true) {
state.reset = false;
index = -1;
continue;
}
var _state$orderedModifie = state.orderedModifiers[index],
fn = _state$orderedModifie.fn,
_state$orderedModifie2 = _state$orderedModifie.options,
_options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
name = _state$orderedModifie.name;
if (typeof fn === 'function') {
state = fn({
state: state,
options: _options,
name: name,
instance: instance
}) || state;
}
}
},
// Async and optimistically optimized update – it will not be executed if
// not necessary (debounced to run at most once-per-tick)
update: debounce(function () {
return new Promise(function (resolve) {
instance.forceUpdate();
resolve(state);
});
}),
destroy: function destroy() {
cleanupModifierEffects();
isDestroyed = true;
}
};
if (!areValidElements(reference, popper)) {
return instance;
}
instance.setOptions(options).then(function (state) {
if (!isDestroyed && options.onFirstUpdate) {
options.onFirstUpdate(state);
}
}); // Modifiers have the ability to execute arbitrary code before the first
// update cycle runs. They will be executed in the same order as the update
// cycle. This is useful when a modifier adds some persistent data that
// other modifiers need to use, but the modifier is run after the dependent
// one.
function runModifierEffects() {
state.orderedModifiers.forEach(function (_ref3) {
var name = _ref3.name,
_ref3$options = _ref3.options,
options = _ref3$options === void 0 ? {} : _ref3$options,
effect = _ref3.effect;
if (typeof effect === 'function') {
var cleanupFn = effect({
state: state,
name: name,
instance: instance,
options: options
});
var noopFn = function noopFn() {};
effectCleanupFns.push(cleanupFn || noopFn);
}
});
}
function cleanupModifierEffects() {
effectCleanupFns.forEach(function (fn) {
return fn();
});
effectCleanupFns = [];
}
return instance;
};
}
var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
var createPopper = /*#__PURE__*/popperGenerator({
defaultModifiers: defaultModifiers
}); // eslint-disable-next-line import/no-unused-modules
function getContainer$1(container) {
return typeof container === 'function' ? container() : container;
}
/**
* Portals provide a first-class way to render children into a DOM node
* that exists outside the DOM hierarchy of the parent component.
*
* Demos:
*
* - [Portal](https://mui.com/base/react-portal/)
*
* API:
*
* - [Portal API](https://mui.com/base/api/portal/)
*/
const Portal = /*#__PURE__*/reactExports.forwardRef(function Portal(props, ref) {
const {
children,
container,
disablePortal = false
} = props;
const [mountNode, setMountNode] = reactExports.useState(null);
// @ts-expect-error TODO upstream fix
const handleRef = useForkRef( /*#__PURE__*/reactExports.isValidElement(children) ? children.ref : null, ref);
useEnhancedEffect$1(() => {
if (!disablePortal) {
setMountNode(getContainer$1(container) || document.body);
}
}, [container, disablePortal]);
useEnhancedEffect$1(() => {
if (mountNode && !disablePortal) {
setRef(ref, mountNode);
return () => {
setRef(ref, null);
};
}
return undefined;
}, [ref, mountNode, disablePortal]);
if (disablePortal) {
if ( /*#__PURE__*/reactExports.isValidElement(children)) {
const newProps = {
ref: handleRef
};
return /*#__PURE__*/reactExports.cloneElement(children, newProps);
}
return /*#__PURE__*/jsx(reactExports.Fragment, {
children: children
});
}
return /*#__PURE__*/jsx(reactExports.Fragment, {
children: mountNode ? /*#__PURE__*/reactDomExports.createPortal(children, mountNode) : mountNode
});
});
const Portal$1 = Portal;
function getPopperUnstyledUtilityClass(slot) {
return generateUtilityClass('MuiPopperUnstyled', slot);
}
generateUtilityClasses('MuiPopperUnstyled', ['root']);
const _excluded$H = ["anchorEl", "children", "component", "direction", "disablePortal", "modifiers", "open", "ownerState", "placement", "popperOptions", "popperRef", "slotProps", "slots", "TransitionProps"],
_excluded2$3 = ["anchorEl", "children", "container", "direction", "disablePortal", "keepMounted", "modifiers", "open", "placement", "popperOptions", "popperRef", "style", "transition", "slotProps", "slots"];
function flipPlacement(placement, direction) {
if (direction === 'ltr') {
return placement;
}
switch (placement) {
case 'bottom-end':
return 'bottom-start';
case 'bottom-start':
return 'bottom-end';
case 'top-end':
return 'top-start';
case 'top-start':
return 'top-end';
default:
return placement;
}
}
function resolveAnchorEl$1(anchorEl) {
return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
}
function isHTMLElement(element) {
return element.nodeType !== undefined;
}
const useUtilityClasses$y = () => {
const slots = {
root: ['root']
};
return composeClasses(slots, getPopperUnstyledUtilityClass, {});
};
const defaultPopperOptions = {};
const PopperTooltip = /*#__PURE__*/reactExports.forwardRef(function PopperTooltip(props, ref) {
var _ref;
const {
anchorEl,
children,
component,
direction,
disablePortal,
modifiers,
open,
ownerState,
placement: initialPlacement,
popperOptions,
popperRef: popperRefProp,
slotProps = {},
slots = {},
TransitionProps
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$H);
const tooltipRef = reactExports.useRef(null);
const ownRef = useForkRef(tooltipRef, ref);
const popperRef = reactExports.useRef(null);
const handlePopperRef = useForkRef(popperRef, popperRefProp);
const handlePopperRefRef = reactExports.useRef(handlePopperRef);
useEnhancedEffect$1(() => {
handlePopperRefRef.current = handlePopperRef;
}, [handlePopperRef]);
reactExports.useImperativeHandle(popperRefProp, () => popperRef.current, []);
const rtlPlacement = flipPlacement(initialPlacement, direction);
/**
* placement initialized from prop but can change during lifetime if modifiers.flip.
* modifiers.flip is essentially a flip for controlled/uncontrolled behavior
*/
const [placement, setPlacement] = reactExports.useState(rtlPlacement);
const [resolvedAnchorElement, setResolvedAnchorElement] = reactExports.useState(resolveAnchorEl$1(anchorEl));
reactExports.useEffect(() => {
if (popperRef.current) {
popperRef.current.forceUpdate();
}
});
reactExports.useEffect(() => {
if (anchorEl) {
setResolvedAnchorElement(resolveAnchorEl$1(anchorEl));
}
}, [anchorEl]);
useEnhancedEffect$1(() => {
if (!resolvedAnchorElement || !open) {
return undefined;
}
const handlePopperUpdate = data => {
setPlacement(data.placement);
};
let popperModifiers = [{
name: 'preventOverflow',
options: {
altBoundary: disablePortal
}
}, {
name: 'flip',
options: {
altBoundary: disablePortal
}
}, {
name: 'onUpdate',
enabled: true,
phase: 'afterWrite',
fn: ({
state
}) => {
handlePopperUpdate(state);
}
}];
if (modifiers != null) {
popperModifiers = popperModifiers.concat(modifiers);
}
if (popperOptions && popperOptions.modifiers != null) {
popperModifiers = popperModifiers.concat(popperOptions.modifiers);
}
const popper = createPopper(resolvedAnchorElement, tooltipRef.current, _extends({
placement: rtlPlacement
}, popperOptions, {
modifiers: popperModifiers
}));
handlePopperRefRef.current(popper);
return () => {
popper.destroy();
handlePopperRefRef.current(null);
};
}, [resolvedAnchorElement, disablePortal, modifiers, open, popperOptions, rtlPlacement]);
const childProps = {
placement: placement
};
if (TransitionProps !== null) {
childProps.TransitionProps = TransitionProps;
}
const classes = useUtilityClasses$y();
const Root = (_ref = component != null ? component : slots.root) != null ? _ref : 'div';
const rootProps = useSlotProps({
elementType: Root,
externalSlotProps: slotProps.root,
externalForwardedProps: other,
additionalProps: {
role: 'tooltip',
ref: ownRef
},
ownerState: _extends({}, props, ownerState),
className: classes.root
});
return /*#__PURE__*/jsx(Root, _extends({}, rootProps, {
children: typeof children === 'function' ? children(childProps) : children
}));
});
/**
* Poppers rely on the 3rd party library [Popper.js](https://popper.js.org/docs/v2/) for positioning.
*
* Demos:
*
* - [Unstyled Popper](https://mui.com/base/react-popper/)
*
* API:
*
* - [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/)
*/
const PopperUnstyled = /*#__PURE__*/reactExports.forwardRef(function PopperUnstyled(props, ref) {
const {
anchorEl,
children,
container: containerProp,
direction = 'ltr',
disablePortal = false,
keepMounted = false,
modifiers,
open,
placement = 'bottom',
popperOptions = defaultPopperOptions,
popperRef,
style,
transition = false,
slotProps = {},
slots = {}
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded2$3);
const [exited, setExited] = reactExports.useState(true);
const handleEnter = () => {
setExited(false);
};
const handleExited = () => {
setExited(true);
};
if (!keepMounted && !open && (!transition || exited)) {
return null;
}
// If the container prop is provided, use that
// If the anchorEl prop is provided, use its parent body element as the container
// If neither are provided let the Modal take care of choosing the container
let container;
if (containerProp) {
container = containerProp;
} else if (anchorEl) {
const resolvedAnchorEl = resolveAnchorEl$1(anchorEl);
container = resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body : ownerDocument(null).body;
}
const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined;
const transitionProps = transition ? {
in: open,
onEnter: handleEnter,
onExited: handleExited
} : undefined;
return /*#__PURE__*/jsx(Portal$1, {
disablePortal: disablePortal,
container: container,
children: /*#__PURE__*/jsx(PopperTooltip, _extends({
anchorEl: anchorEl,
direction: direction,
disablePortal: disablePortal,
modifiers: modifiers,
ref: ref,
open: transition ? !exited : open,
placement: placement,
popperOptions: popperOptions,
popperRef: popperRef,
slotProps: slotProps,
slots: slots
}, other, {
style: _extends({
// Prevents scroll issue, waiting for Popper.js to add this style once initiated.
position: 'fixed',
// Fix Popper.js display issue
top: 0,
left: 0,
display
}, style),
TransitionProps: transitionProps,
children: children
}))
});
});
const PopperUnstyled$1 = PopperUnstyled;
// Is a vertical scrollbar displayed?
function isOverflowing(container) {
const doc = ownerDocument(container);
if (doc.body === container) {
return ownerWindow(container).innerWidth > doc.documentElement.clientWidth;
}
return container.scrollHeight > container.clientHeight;
}
function ariaHidden(element, show) {
if (show) {
element.setAttribute('aria-hidden', 'true');
} else {
element.removeAttribute('aria-hidden');
}
}
function getPaddingRight(element) {
return parseInt(ownerWindow(element).getComputedStyle(element).paddingRight, 10) || 0;
}
function isAriaHiddenForbiddenOnElement(element) {
// The forbidden HTML tags are the ones from ARIA specification that
// can be children of body and can't have aria-hidden attribute.
// cf. https://www.w3.org/TR/html-aria/#docconformance
const forbiddenTagNames = ['TEMPLATE', 'SCRIPT', 'STYLE', 'LINK', 'MAP', 'META', 'NOSCRIPT', 'PICTURE', 'COL', 'COLGROUP', 'PARAM', 'SLOT', 'SOURCE', 'TRACK'];
const isForbiddenTagName = forbiddenTagNames.indexOf(element.tagName) !== -1;
const isInputHidden = element.tagName === 'INPUT' && element.getAttribute('type') === 'hidden';
return isForbiddenTagName || isInputHidden;
}
function ariaHiddenSiblings(container, mountElement, currentElement, elementsToExclude, show) {
const blacklist = [mountElement, currentElement, ...elementsToExclude];
[].forEach.call(container.children, element => {
const isNotExcludedElement = blacklist.indexOf(element) === -1;
const isNotForbiddenElement = !isAriaHiddenForbiddenOnElement(element);
if (isNotExcludedElement && isNotForbiddenElement) {
ariaHidden(element, show);
}
});
}
function findIndexOf(items, callback) {
let idx = -1;
items.some((item, index) => {
if (callback(item)) {
idx = index;
return true;
}
return false;
});
return idx;
}
function handleContainer(containerInfo, props) {
const restoreStyle = [];
const container = containerInfo.container;
if (!props.disableScrollLock) {
if (isOverflowing(container)) {
// Compute the size before applying overflow hidden to avoid any scroll jumps.
const scrollbarSize = getScrollbarSize(ownerDocument(container));
restoreStyle.push({
value: container.style.paddingRight,
property: 'padding-right',
el: container
});
// Use computed style, here to get the real padding to add our scrollbar width.
container.style.paddingRight = `${getPaddingRight(container) + scrollbarSize}px`;
// .mui-fixed is a global helper.
const fixedElements = ownerDocument(container).querySelectorAll('.mui-fixed');
[].forEach.call(fixedElements, element => {
restoreStyle.push({
value: element.style.paddingRight,
property: 'padding-right',
el: element
});
element.style.paddingRight = `${getPaddingRight(element) + scrollbarSize}px`;
});
}
let scrollContainer;
if (container.parentNode instanceof DocumentFragment) {
scrollContainer = ownerDocument(container).body;
} else {
// Improve Gatsby support
// https://css-tricks.com/snippets/css/force-vertical-scrollbar/
const parent = container.parentElement;
const containerWindow = ownerWindow(container);
scrollContainer = (parent == null ? void 0 : parent.nodeName) === 'HTML' && containerWindow.getComputedStyle(parent).overflowY === 'scroll' ? parent : container;
}
// Block the scroll even if no scrollbar is visible to account for mobile keyboard
// screensize shrink.
restoreStyle.push({
value: scrollContainer.style.overflow,
property: 'overflow',
el: scrollContainer
}, {
value: scrollContainer.style.overflowX,
property: 'overflow-x',
el: scrollContainer
}, {
value: scrollContainer.style.overflowY,
property: 'overflow-y',
el: scrollContainer
});
scrollContainer.style.overflow = 'hidden';
}
const restore = () => {
restoreStyle.forEach(({
value,
el,
property
}) => {
if (value) {
el.style.setProperty(property, value);
} else {
el.style.removeProperty(property);
}
});
};
return restore;
}
function getHiddenSiblings(container) {
const hiddenSiblings = [];
[].forEach.call(container.children, element => {
if (element.getAttribute('aria-hidden') === 'true') {
hiddenSiblings.push(element);
}
});
return hiddenSiblings;
}
/**
* @ignore - do not document.
*
* Proper state management for containers and the modals in those containers.
* Simplified, but inspired by react-overlay's ModalManager class.
* Used by the Modal to ensure proper styling of containers.
*/
class ModalManager {
constructor() {
this.containers = void 0;
this.modals = void 0;
this.modals = [];
this.containers = [];
}
add(modal, container) {
let modalIndex = this.modals.indexOf(modal);
if (modalIndex !== -1) {
return modalIndex;
}
modalIndex = this.modals.length;
this.modals.push(modal);
// If the modal we are adding is already in the DOM.
if (modal.modalRef) {
ariaHidden(modal.modalRef, false);
}
const hiddenSiblings = getHiddenSiblings(container);
ariaHiddenSiblings(container, modal.mount, modal.modalRef, hiddenSiblings, true);
const containerIndex = findIndexOf(this.containers, item => item.container === container);
if (containerIndex !== -1) {
this.containers[containerIndex].modals.push(modal);
return modalIndex;
}
this.containers.push({
modals: [modal],
container,
restore: null,
hiddenSiblings
});
return modalIndex;
}
mount(modal, props) {
const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);
const containerInfo = this.containers[containerIndex];
if (!containerInfo.restore) {
containerInfo.restore = handleContainer(containerInfo, props);
}
}
remove(modal, ariaHiddenState = true) {
const modalIndex = this.modals.indexOf(modal);
if (modalIndex === -1) {
return modalIndex;
}
const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);
const containerInfo = this.containers[containerIndex];
containerInfo.modals.splice(containerInfo.modals.indexOf(modal), 1);
this.modals.splice(modalIndex, 1);
// If that was the last modal in a container, clean up the container.
if (containerInfo.modals.length === 0) {
// The modal might be closed before it had the chance to be mounted in the DOM.
if (containerInfo.restore) {
containerInfo.restore();
}
if (modal.modalRef) {
// In case the modal wasn't in the DOM yet.
ariaHidden(modal.modalRef, ariaHiddenState);
}
ariaHiddenSiblings(containerInfo.container, modal.mount, modal.modalRef, containerInfo.hiddenSiblings, false);
this.containers.splice(containerIndex, 1);
} else {
// Otherwise make sure the next top modal is visible to a screen reader.
const nextTop = containerInfo.modals[containerInfo.modals.length - 1];
// as soon as a modal is adding its modalRef is undefined. it can't set
// aria-hidden because the dom element doesn't exist either
// when modal was unmounted before modalRef gets null
if (nextTop.modalRef) {
ariaHidden(nextTop.modalRef, false);
}
}
return modalIndex;
}
isTopModal(modal) {
return this.modals.length > 0 && this.modals[this.modals.length - 1] === modal;
}
}
function getModalUtilityClass(slot) {
return generateUtilityClass('MuiModal', slot);
}
generateUtilityClasses('MuiModal', ['root', 'hidden']);
const _excluded$G = ["children", "classes", "closeAfterTransition", "component", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onKeyDown", "open", "onTransitionEnter", "onTransitionExited", "slotProps", "slots"];
const useUtilityClasses$x = ownerState => {
const {
open,
exited,
classes
} = ownerState;
const slots = {
root: ['root', !open && exited && 'hidden'],
backdrop: ['backdrop']
};
return composeClasses(slots, getModalUtilityClass, classes);
};
function getContainer(container) {
return typeof container === 'function' ? container() : container;
}
function getHasTransition(children) {
return children ? children.props.hasOwnProperty('in') : false;
}
// A modal manager used to track and manage the state of open Modals.
// Modals don't open on the server so this won't conflict with concurrent requests.
const defaultManager = new ModalManager();
/**
* Modal is a lower-level construct that is leveraged by the following components:
*
* * [Dialog](https://mui.com/material-ui/api/dialog/)
* * [Drawer](https://mui.com/material-ui/api/drawer/)
* * [Menu](https://mui.com/material-ui/api/menu/)
* * [Popover](https://mui.com/material-ui/api/popover/)
*
* If you are creating a modal dialog, you probably want to use the [Dialog](https://mui.com/material-ui/api/dialog/) component
* rather than directly using Modal.
*
* This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals).
*
* Demos:
*
* - [Unstyled Modal](https://mui.com/base/react-modal/)
*
* API:
*
* - [ModalUnstyled API](https://mui.com/base/api/modal-unstyled/)
*/
const ModalUnstyled = /*#__PURE__*/reactExports.forwardRef(function ModalUnstyled(props, forwardedRef) {
var _props$ariaHidden, _ref;
const {
children,
classes: classesProp,
closeAfterTransition = false,
component,
container,
disableAutoFocus = false,
disableEnforceFocus = false,
disableEscapeKeyDown = false,
disablePortal = false,
disableRestoreFocus = false,
disableScrollLock = false,
hideBackdrop = false,
keepMounted = false,
// private
manager = defaultManager,
onBackdropClick,
onClose,
onKeyDown,
open,
onTransitionEnter,
onTransitionExited,
slotProps = {},
slots = {}
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$G);
const [exited, setExited] = reactExports.useState(!open);
const modal = reactExports.useRef({});
const mountNodeRef = reactExports.useRef(null);
const modalRef = reactExports.useRef(null);
const handleRef = useForkRef(modalRef, forwardedRef);
const hasTransition = getHasTransition(children);
const ariaHiddenProp = (_props$ariaHidden = props['aria-hidden']) != null ? _props$ariaHidden : true;
const getDoc = () => ownerDocument(mountNodeRef.current);
const getModal = () => {
modal.current.modalRef = modalRef.current;
modal.current.mountNode = mountNodeRef.current;
return modal.current;
};
const handleMounted = () => {
manager.mount(getModal(), {
disableScrollLock
});
// Fix a bug on Chrome where the scroll isn't initially 0.
if (modalRef.current) {
modalRef.current.scrollTop = 0;
}
};
const handleOpen = useEventCallback(() => {
const resolvedContainer = getContainer(container) || getDoc().body;
manager.add(getModal(), resolvedContainer);
// The element was already mounted.
if (modalRef.current) {
handleMounted();
}
});
const isTopModal = reactExports.useCallback(() => manager.isTopModal(getModal()), [manager]);
const handlePortalRef = useEventCallback(node => {
mountNodeRef.current = node;
if (!node || !modalRef.current) {
return;
}
if (open && isTopModal()) {
handleMounted();
} else {
ariaHidden(modalRef.current, ariaHiddenProp);
}
});
const handleClose = reactExports.useCallback(() => {
manager.remove(getModal(), ariaHiddenProp);
}, [manager, ariaHiddenProp]);
reactExports.useEffect(() => {
return () => {
handleClose();
};
}, [handleClose]);
reactExports.useEffect(() => {
if (open) {
handleOpen();
} else if (!hasTransition || !closeAfterTransition) {
handleClose();
}
}, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);
const ownerState = _extends({}, props, {
classes: classesProp,
closeAfterTransition,
disableAutoFocus,
disableEnforceFocus,
disableEscapeKeyDown,
disablePortal,
disableRestoreFocus,
disableScrollLock,
exited,
hideBackdrop,
keepMounted
});
const classes = useUtilityClasses$x(ownerState);
const handleEnter = () => {
setExited(false);
if (onTransitionEnter) {
onTransitionEnter();
}
};
const handleExited = () => {
setExited(true);
if (onTransitionExited) {
onTransitionExited();
}
if (closeAfterTransition) {
handleClose();
}
};
const handleBackdropClick = event => {
if (event.target !== event.currentTarget) {
return;
}
if (onBackdropClick) {
onBackdropClick(event);
}
if (onClose) {
onClose(event, 'backdropClick');
}
};
const handleKeyDown = event => {
if (onKeyDown) {
onKeyDown(event);
}
// The handler doesn't take event.defaultPrevented into account:
//
// event.preventDefault() is meant to stop default behaviors like
// clicking a checkbox to check it, hitting a button to submit a form,
// and hitting left arrow to move the cursor in a text input etc.
// Only special HTML elements have these default behaviors.
if (event.key !== 'Escape' || !isTopModal()) {
return;
}
if (!disableEscapeKeyDown) {
// Swallow the event, in case someone is listening for the escape key on the body.
event.stopPropagation();
if (onClose) {
onClose(event, 'escapeKeyDown');
}
}
};
const childProps = {};
if (children.props.tabIndex === undefined) {
childProps.tabIndex = '-1';
}
// It's a Transition like component
if (hasTransition) {
childProps.onEnter = createChainedFunction(handleEnter, children.props.onEnter);
childProps.onExited = createChainedFunction(handleExited, children.props.onExited);
}
const Root = (_ref = component != null ? component : slots.root) != null ? _ref : 'div';
const rootProps = useSlotProps({
elementType: Root,
externalSlotProps: slotProps.root,
externalForwardedProps: other,
additionalProps: {
ref: handleRef,
role: 'presentation',
onKeyDown: handleKeyDown
},
className: classes.root,
ownerState
});
const BackdropComponent = slots.backdrop;
const backdropProps = useSlotProps({
elementType: BackdropComponent,
externalSlotProps: slotProps.backdrop,
additionalProps: {
'aria-hidden': true,
onClick: handleBackdropClick,
open
},
className: classes.backdrop,
ownerState
});
if (!keepMounted && !open && (!hasTransition || exited)) {
return null;
}
return /*#__PURE__*/jsx(Portal$1
// @ts-expect-error TODO: include ref to MUI Base Portal props
, {
ref: handlePortalRef,
container: container,
disablePortal: disablePortal,
children: /*#__PURE__*/jsxs(Root, _extends({}, rootProps, {
children: [!hideBackdrop && BackdropComponent ? /*#__PURE__*/jsx(BackdropComponent, _extends({}, backdropProps)) : null, /*#__PURE__*/jsx(FocusTrap, {
disableEnforceFocus: disableEnforceFocus,
disableAutoFocus: disableAutoFocus,
disableRestoreFocus: disableRestoreFocus,
isEnabled: isTopModal,
open: open,
children: /*#__PURE__*/reactExports.cloneElement(children, childProps)
})]
}))
});
});
const ModalUnstyled$1 = ModalUnstyled;
const INTENTIONAL_DRAG_COUNT_THRESHOLD = 2;
function asc(a, b) {
return a - b;
}
function clamp$1(value, min, max) {
if (value == null) {
return min;
}
return Math.min(Math.max(min, value), max);
}
function findClosest(values, currentValue) {
var _values$reduce;
const {
index: closestIndex
} = (_values$reduce = values.reduce((acc, value, index) => {
const distance = Math.abs(currentValue - value);
if (acc === null || distance < acc.distance || distance === acc.distance) {
return {
distance,
index
};
}
return acc;
}, null)) != null ? _values$reduce : {};
return closestIndex;
}
function trackFinger(event, touchId) {
// The event is TouchEvent
if (touchId.current !== undefined && event.changedTouches) {
const touchEvent = event;
for (let i = 0; i < touchEvent.changedTouches.length; i += 1) {
const touch = touchEvent.changedTouches[i];
if (touch.identifier === touchId.current) {
return {
x: touch.clientX,
y: touch.clientY
};
}
}
return false;
}
// The event is MouseEvent
return {
x: event.clientX,
y: event.clientY
};
}
function valueToPercent$1(value, min, max) {
return (value - min) * 100 / (max - min);
}
function percentToValue(percent, min, max) {
return (max - min) * percent + min;
}
function getDecimalPrecision(num) {
// This handles the case when num is very small (0.00000001), js will turn this into 1e-8.
// When num is bigger than 1 or less than -1 it won't get converted to this notation so it's fine.
if (Math.abs(num) < 1) {
const parts = num.toExponential().split('e-');
const matissaDecimalPart = parts[0].split('.')[1];
return (matissaDecimalPart ? matissaDecimalPart.length : 0) + parseInt(parts[1], 10);
}
const decimalPart = num.toString().split('.')[1];
return decimalPart ? decimalPart.length : 0;
}
function roundValueToStep(value, step, min) {
const nearest = Math.round((value - min) / step) * step + min;
return Number(nearest.toFixed(getDecimalPrecision(step)));
}
function setValueIndex({
values,
newValue,
index
}) {
const output = values.slice();
output[index] = newValue;
return output.sort(asc);
}
function focusThumb({
sliderRef,
activeIndex,
setActive
}) {
var _sliderRef$current, _doc$activeElement;
const doc = ownerDocument(sliderRef.current);
if (!((_sliderRef$current = sliderRef.current) != null && _sliderRef$current.contains(doc.activeElement)) || Number(doc == null ? void 0 : (_doc$activeElement = doc.activeElement) == null ? void 0 : _doc$activeElement.getAttribute('data-index')) !== activeIndex) {
var _sliderRef$current2;
(_sliderRef$current2 = sliderRef.current) == null ? void 0 : _sliderRef$current2.querySelector(`[type="range"][data-index="${activeIndex}"]`).focus();
}
if (setActive) {
setActive(activeIndex);
}
}
const axisProps = {
horizontal: {
offset: percent => ({
left: `${percent}%`
}),
leap: percent => ({
width: `${percent}%`
})
},
'horizontal-reverse': {
offset: percent => ({
right: `${percent}%`
}),
leap: percent => ({
width: `${percent}%`
})
},
vertical: {
offset: percent => ({
bottom: `${percent}%`
}),
leap: percent => ({
height: `${percent}%`
})
}
};
const Identity$1 = x => x;
// TODO: remove support for Safari < 13.
// https://caniuse.com/#search=touch-action
//
// Safari, on iOS, supports touch action since v13.
// Over 80% of the iOS phones are compatible
// in August 2020.
// Utilizing the CSS.supports method to check if touch-action is supported.
// Since CSS.supports is supported on all but Edge@12 and IE and touch-action
// is supported on both Edge@12 and IE if CSS.supports is not available that means that
// touch-action will be supported
let cachedSupportsTouchActionNone;
function doesSupportTouchActionNone() {
if (cachedSupportsTouchActionNone === undefined) {
if (typeof CSS !== 'undefined' && typeof CSS.supports === 'function') {
cachedSupportsTouchActionNone = CSS.supports('touch-action', 'none');
} else {
cachedSupportsTouchActionNone = true;
}
}
return cachedSupportsTouchActionNone;
}
function useSlider(parameters) {
const {
'aria-labelledby': ariaLabelledby,
defaultValue,
disabled = false,
disableSwap = false,
isRtl = false,
marks: marksProp = false,
max = 100,
min = 0,
name,
onChange,
onChangeCommitted,
orientation = 'horizontal',
ref,
scale = Identity$1,
step = 1,
tabIndex,
value: valueProp
} = parameters;
const touchId = reactExports.useRef();
// We can't use the :active browser pseudo-classes.
// - The active state isn't triggered when clicking on the rail.
// - The active state isn't transferred when inversing a range slider.
const [active, setActive] = reactExports.useState(-1);
const [open, setOpen] = reactExports.useState(-1);
const [dragging, setDragging] = reactExports.useState(false);
const moveCount = reactExports.useRef(0);
const [valueDerived, setValueState] = useControlled({
controlled: valueProp,
default: defaultValue != null ? defaultValue : min,
name: 'Slider'
});
const handleChange = onChange && ((event, value, thumbIndex) => {
// Redefine target to allow name and value to be read.
// This allows seamless integration with the most popular form libraries.
// https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
// Clone the event to not override `target` of the original event.
const nativeEvent = event.nativeEvent || event;
// @ts-ignore The nativeEvent is function, not object
const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
Object.defineProperty(clonedEvent, 'target', {
writable: true,
value: {
value,
name
}
});
onChange(clonedEvent, value, thumbIndex);
});
const range = Array.isArray(valueDerived);
let values = range ? valueDerived.slice().sort(asc) : [valueDerived];
values = values.map(value => clamp$1(value, min, max));
const marks = marksProp === true && step !== null ? [...Array(Math.floor((max - min) / step) + 1)].map((_, index) => ({
value: min + step * index
})) : marksProp || [];
const marksValues = marks.map(mark => mark.value);
const {
isFocusVisibleRef,
onBlur: handleBlurVisible,
onFocus: handleFocusVisible,
ref: focusVisibleRef
} = useIsFocusVisible();
const [focusedThumbIndex, setFocusedThumbIndex] = reactExports.useState(-1);
const sliderRef = reactExports.useRef();
const handleFocusRef = useForkRef(focusVisibleRef, sliderRef);
const handleRef = useForkRef(ref, handleFocusRef);
const createHandleHiddenInputFocus = otherHandlers => event => {
var _otherHandlers$onFocu;
const index = Number(event.currentTarget.getAttribute('data-index'));
handleFocusVisible(event);
if (isFocusVisibleRef.current === true) {
setFocusedThumbIndex(index);
}
setOpen(index);
otherHandlers == null ? void 0 : (_otherHandlers$onFocu = otherHandlers.onFocus) == null ? void 0 : _otherHandlers$onFocu.call(otherHandlers, event);
};
const createHandleHiddenInputBlur = otherHandlers => event => {
var _otherHandlers$onBlur;
handleBlurVisible(event);
if (isFocusVisibleRef.current === false) {
setFocusedThumbIndex(-1);
}
setOpen(-1);
otherHandlers == null ? void 0 : (_otherHandlers$onBlur = otherHandlers.onBlur) == null ? void 0 : _otherHandlers$onBlur.call(otherHandlers, event);
};
useEnhancedEffect$1(() => {
if (disabled && sliderRef.current.contains(document.activeElement)) {
var _document$activeEleme;
// This is necessary because Firefox and Safari will keep focus
// on a disabled element:
// https://codesandbox.io/s/mui-pr-22247-forked-h151h?file=/src/App.js
// @ts-ignore
(_document$activeEleme = document.activeElement) == null ? void 0 : _document$activeEleme.blur();
}
}, [disabled]);
if (disabled && active !== -1) {
setActive(-1);
}
if (disabled && focusedThumbIndex !== -1) {
setFocusedThumbIndex(-1);
}
const createHandleHiddenInputChange = otherHandlers => event => {
var _otherHandlers$onChan;
(_otherHandlers$onChan = otherHandlers.onChange) == null ? void 0 : _otherHandlers$onChan.call(otherHandlers, event);
const index = Number(event.currentTarget.getAttribute('data-index'));
const value = values[index];
const marksIndex = marksValues.indexOf(value);
// @ts-ignore
let newValue = event.target.valueAsNumber;
if (marks && step == null) {
newValue = newValue < value ? marksValues[marksIndex - 1] : marksValues[marksIndex + 1];
}
newValue = clamp$1(newValue, min, max);
if (marks && step == null) {
const currentMarkIndex = marksValues.indexOf(values[index]);
newValue = newValue < values[index] ? marksValues[currentMarkIndex - 1] : marksValues[currentMarkIndex + 1];
}
if (range) {
// Bound the new value to the thumb's neighbours.
if (disableSwap) {
newValue = clamp$1(newValue, values[index - 1] || -Infinity, values[index + 1] || Infinity);
}
const previousValue = newValue;
newValue = setValueIndex({
values,
newValue,
index
});
let activeIndex = index;
// Potentially swap the index if needed.
if (!disableSwap) {
activeIndex = newValue.indexOf(previousValue);
}
focusThumb({
sliderRef,
activeIndex
});
}
setValueState(newValue);
setFocusedThumbIndex(index);
if (handleChange) {
handleChange(event, newValue, index);
}
if (onChangeCommitted) {
onChangeCommitted(event, newValue);
}
};
const previousIndex = reactExports.useRef();
let axis = orientation;
if (isRtl && orientation === 'horizontal') {
axis += '-reverse';
}
const getFingerNewValue = ({
finger,
move = false
}) => {
const {
current: slider
} = sliderRef;
const {
width,
height,
bottom,
left
} = slider.getBoundingClientRect();
let percent;
if (axis.indexOf('vertical') === 0) {
percent = (bottom - finger.y) / height;
} else {
percent = (finger.x - left) / width;
}
if (axis.indexOf('-reverse') !== -1) {
percent = 1 - percent;
}
let newValue;
newValue = percentToValue(percent, min, max);
if (step) {
newValue = roundValueToStep(newValue, step, min);
} else {
const closestIndex = findClosest(marksValues, newValue);
newValue = marksValues[closestIndex];
}
newValue = clamp$1(newValue, min, max);
let activeIndex = 0;
if (range) {
if (!move) {
activeIndex = findClosest(values, newValue);
} else {
activeIndex = previousIndex.current;
}
// Bound the new value to the thumb's neighbours.
if (disableSwap) {
newValue = clamp$1(newValue, values[activeIndex - 1] || -Infinity, values[activeIndex + 1] || Infinity);
}
const previousValue = newValue;
newValue = setValueIndex({
values,
newValue,
index: activeIndex
});
// Potentially swap the index if needed.
if (!(disableSwap && move)) {
activeIndex = newValue.indexOf(previousValue);
previousIndex.current = activeIndex;
}
}
return {
newValue,
activeIndex
};
};
const handleTouchMove = useEventCallback(nativeEvent => {
const finger = trackFinger(nativeEvent, touchId);
if (!finger) {
return;
}
moveCount.current += 1;
// Cancel move in case some other element consumed a mouseup event and it was not fired.
// @ts-ignore buttons doesn't not exists on touch event
if (nativeEvent.type === 'mousemove' && nativeEvent.buttons === 0) {
// eslint-disable-next-line @typescript-eslint/no-use-before-define
handleTouchEnd(nativeEvent);
return;
}
const {
newValue,
activeIndex
} = getFingerNewValue({
finger,
move: true
});
focusThumb({
sliderRef,
activeIndex,
setActive
});
setValueState(newValue);
if (!dragging && moveCount.current > INTENTIONAL_DRAG_COUNT_THRESHOLD) {
setDragging(true);
}
if (handleChange && newValue !== valueDerived) {
handleChange(nativeEvent, newValue, activeIndex);
}
});
const handleTouchEnd = useEventCallback(nativeEvent => {
const finger = trackFinger(nativeEvent, touchId);
setDragging(false);
if (!finger) {
return;
}
const {
newValue
} = getFingerNewValue({
finger,
move: true
});
setActive(-1);
if (nativeEvent.type === 'touchend') {
setOpen(-1);
}
if (onChangeCommitted) {
onChangeCommitted(nativeEvent, newValue);
}
touchId.current = undefined;
// eslint-disable-next-line @typescript-eslint/no-use-before-define
stopListening();
});
const handleTouchStart = useEventCallback(nativeEvent => {
if (disabled) {
return;
}
// If touch-action: none; is not supported we need to prevent the scroll manually.
if (!doesSupportTouchActionNone()) {
nativeEvent.preventDefault();
}
const touch = nativeEvent.changedTouches[0];
if (touch != null) {
// A number that uniquely identifies the current finger in the touch session.
touchId.current = touch.identifier;
}
const finger = trackFinger(nativeEvent, touchId);
if (finger !== false) {
const {
newValue,
activeIndex
} = getFingerNewValue({
finger
});
focusThumb({
sliderRef,
activeIndex,
setActive
});
setValueState(newValue);
if (handleChange) {
handleChange(nativeEvent, newValue, activeIndex);
}
}
moveCount.current = 0;
const doc = ownerDocument(sliderRef.current);
doc.addEventListener('touchmove', handleTouchMove);
doc.addEventListener('touchend', handleTouchEnd);
});
const stopListening = reactExports.useCallback(() => {
const doc = ownerDocument(sliderRef.current);
doc.removeEventListener('mousemove', handleTouchMove);
doc.removeEventListener('mouseup', handleTouchEnd);
doc.removeEventListener('touchmove', handleTouchMove);
doc.removeEventListener('touchend', handleTouchEnd);
}, [handleTouchEnd, handleTouchMove]);
reactExports.useEffect(() => {
const {
current: slider
} = sliderRef;
slider.addEventListener('touchstart', handleTouchStart, {
passive: doesSupportTouchActionNone()
});
return () => {
// @ts-ignore
slider.removeEventListener('touchstart', handleTouchStart, {
passive: doesSupportTouchActionNone()
});
stopListening();
};
}, [stopListening, handleTouchStart]);
reactExports.useEffect(() => {
if (disabled) {
stopListening();
}
}, [disabled, stopListening]);
const createHandleMouseDown = otherHandlers => event => {
var _otherHandlers$onMous;
(_otherHandlers$onMous = otherHandlers.onMouseDown) == null ? void 0 : _otherHandlers$onMous.call(otherHandlers, event);
if (disabled) {
return;
}
if (event.defaultPrevented) {
return;
}
// Only handle left clicks
if (event.button !== 0) {
return;
}
// Avoid text selection
event.preventDefault();
const finger = trackFinger(event, touchId);
if (finger !== false) {
const {
newValue,
activeIndex
} = getFingerNewValue({
finger
});
focusThumb({
sliderRef,
activeIndex,
setActive
});
setValueState(newValue);
if (handleChange) {
handleChange(event, newValue, activeIndex);
}
}
moveCount.current = 0;
const doc = ownerDocument(sliderRef.current);
doc.addEventListener('mousemove', handleTouchMove);
doc.addEventListener('mouseup', handleTouchEnd);
};
const trackOffset = valueToPercent$1(range ? values[0] : min, min, max);
const trackLeap = valueToPercent$1(values[values.length - 1], min, max) - trackOffset;
const getRootProps = (otherHandlers = {}) => {
const ownEventHandlers = {
onMouseDown: createHandleMouseDown(otherHandlers || {})
};
const mergedEventHandlers = _extends({}, otherHandlers, ownEventHandlers);
return _extends({
ref: handleRef
}, mergedEventHandlers);
};
const createHandleMouseOver = otherHandlers => event => {
var _otherHandlers$onMous2;
(_otherHandlers$onMous2 = otherHandlers.onMouseOver) == null ? void 0 : _otherHandlers$onMous2.call(otherHandlers, event);
const index = Number(event.currentTarget.getAttribute('data-index'));
setOpen(index);
};
const createHandleMouseLeave = otherHandlers => event => {
var _otherHandlers$onMous3;
(_otherHandlers$onMous3 = otherHandlers.onMouseLeave) == null ? void 0 : _otherHandlers$onMous3.call(otherHandlers, event);
setOpen(-1);
};
const getThumbProps = (otherHandlers = {}) => {
const ownEventHandlers = {
onMouseOver: createHandleMouseOver(otherHandlers || {}),
onMouseLeave: createHandleMouseLeave(otherHandlers || {})
};
return _extends({}, otherHandlers, ownEventHandlers);
};
const getHiddenInputProps = (otherHandlers = {}) => {
var _parameters$step;
const ownEventHandlers = {
onChange: createHandleHiddenInputChange(otherHandlers || {}),
onFocus: createHandleHiddenInputFocus(otherHandlers || {}),
onBlur: createHandleHiddenInputBlur(otherHandlers || {})
};
const mergedEventHandlers = _extends({}, otherHandlers, ownEventHandlers);
return _extends({
tabIndex,
'aria-labelledby': ariaLabelledby,
'aria-orientation': orientation,
'aria-valuemax': scale(max),
'aria-valuemin': scale(min),
name,
type: 'range',
min: parameters.min,
max: parameters.max,
step: (_parameters$step = parameters.step) != null ? _parameters$step : undefined,
disabled
}, mergedEventHandlers, {
style: _extends({}, visuallyHidden$1, {
direction: isRtl ? 'rtl' : 'ltr',
// So that VoiceOver's focus indicator matches the thumb's dimensions
width: '100%',
height: '100%'
})
});
};
return {
active,
axis: axis,
axisProps,
dragging,
focusedThumbIndex,
getHiddenInputProps,
getRootProps,
getThumbProps,
marks: marks,
open,
range,
trackLeap,
trackOffset,
values
};
}
const _excluded$F = ["onChange", "maxRows", "minRows", "style", "value"];
function getStyleValue(computedStyle, property) {
return parseInt(computedStyle[property], 10) || 0;
}
const styles$2 = {
shadow: {
// Visibility needed to hide the extra text area on iPads
visibility: 'hidden',
// Remove from the content flow
position: 'absolute',
// Ignore the scrollbar width
overflow: 'hidden',
height: 0,
top: 0,
left: 0,
// Create a new layer, increase the isolation of the computed values
transform: 'translateZ(0)'
}
};
function isEmpty$1(obj) {
return obj === undefined || obj === null || Object.keys(obj).length === 0;
}
const TextareaAutosize = /*#__PURE__*/reactExports.forwardRef(function TextareaAutosize(props, ref) {
const {
onChange,
maxRows,
minRows = 1,
style,
value
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$F);
const {
current: isControlled
} = reactExports.useRef(value != null);
const inputRef = reactExports.useRef(null);
const handleRef = useForkRef(ref, inputRef);
const shadowRef = reactExports.useRef(null);
const renders = reactExports.useRef(0);
const [state, setState] = reactExports.useState({});
const getUpdatedState = reactExports.useCallback(() => {
const input = inputRef.current;
const containerWindow = ownerWindow(input);
const computedStyle = containerWindow.getComputedStyle(input);
// If input's width is shrunk and it's not visible, don't sync height.
if (computedStyle.width === '0px') {
return {};
}
const inputShallow = shadowRef.current;
inputShallow.style.width = computedStyle.width;
inputShallow.value = input.value || props.placeholder || 'x';
if (inputShallow.value.slice(-1) === '\n') {
// Certain fonts which overflow the line height will cause the textarea
// to report a different scrollHeight depending on whether the last line
// is empty. Make it non-empty to avoid this issue.
inputShallow.value += ' ';
}
const boxSizing = computedStyle['box-sizing'];
const padding = getStyleValue(computedStyle, 'padding-bottom') + getStyleValue(computedStyle, 'padding-top');
const border = getStyleValue(computedStyle, 'border-bottom-width') + getStyleValue(computedStyle, 'border-top-width');
// The height of the inner content
const innerHeight = inputShallow.scrollHeight;
// Measure height of a textarea with a single row
inputShallow.value = 'x';
const singleRowHeight = inputShallow.scrollHeight;
// The height of the outer content
let outerHeight = innerHeight;
if (minRows) {
outerHeight = Math.max(Number(minRows) * singleRowHeight, outerHeight);
}
if (maxRows) {
outerHeight = Math.min(Number(maxRows) * singleRowHeight, outerHeight);
}
outerHeight = Math.max(outerHeight, singleRowHeight);
// Take the box sizing into account for applying this value as a style.
const outerHeightStyle = outerHeight + (boxSizing === 'border-box' ? padding + border : 0);
const overflow = Math.abs(outerHeight - innerHeight) <= 1;
return {
outerHeightStyle,
overflow
};
}, [maxRows, minRows, props.placeholder]);
const updateState = (prevState, newState) => {
const {
outerHeightStyle,
overflow
} = newState;
// Need a large enough difference to update the height.
// This prevents infinite rendering loop.
if (renders.current < 20 && (outerHeightStyle > 0 && Math.abs((prevState.outerHeightStyle || 0) - outerHeightStyle) > 1 || prevState.overflow !== overflow)) {
renders.current += 1;
return {
overflow,
outerHeightStyle
};
}
return prevState;
};
const syncHeight = reactExports.useCallback(() => {
const newState = getUpdatedState();
if (isEmpty$1(newState)) {
return;
}
setState(prevState => {
return updateState(prevState, newState);
});
}, [getUpdatedState]);
const syncHeightWithFlushSycn = () => {
const newState = getUpdatedState();
if (isEmpty$1(newState)) {
return;
}
// In React 18, state updates in a ResizeObserver's callback are happening after the paint which causes flickering
// when doing some visual updates in it. Using flushSync ensures that the dom will be painted after the states updates happen
// Related issue - https://github.com/facebook/react/issues/24331
reactDomExports.flushSync(() => {
setState(prevState => {
return updateState(prevState, newState);
});
});
};
reactExports.useEffect(() => {
const handleResize = debounce$1(() => {
renders.current = 0;
// If the TextareaAutosize component is replaced by Suspense with a fallback, the last
// ResizeObserver's handler that runs because of the change in the layout is trying to
// access a dom node that is no longer there (as the fallback component is being shown instead).
// See https://github.com/mui/material-ui/issues/32640
if (inputRef.current) {
syncHeightWithFlushSycn();
}
});
const containerWindow = ownerWindow(inputRef.current);
containerWindow.addEventListener('resize', handleResize);
let resizeObserver;
if (typeof ResizeObserver !== 'undefined') {
resizeObserver = new ResizeObserver(handleResize);
resizeObserver.observe(inputRef.current);
}
return () => {
handleResize.clear();
containerWindow.removeEventListener('resize', handleResize);
if (resizeObserver) {
resizeObserver.disconnect();
}
};
});
useEnhancedEffect$1(() => {
syncHeight();
});
reactExports.useEffect(() => {
renders.current = 0;
}, [value]);
const handleChange = event => {
renders.current = 0;
if (!isControlled) {
syncHeight();
}
if (onChange) {
onChange(event);
}
};
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/jsx("textarea", _extends({
value: value,
onChange: handleChange,
ref: handleRef
// Apply the rows prop to get a "correct" first SSR paint
,
rows: minRows,
style: _extends({
height: state.outerHeightStyle,
// Need a large enough difference to allow scrolling.
// This prevents infinite rendering loop.
overflow: state.overflow ? 'hidden' : null
}, style)
}, other)), /*#__PURE__*/jsx("textarea", {
"aria-hidden": true,
className: props.className,
readOnly: true,
ref: shadowRef,
tabIndex: -1,
style: _extends({}, styles$2.shadow, style, {
padding: 0
})
})]
});
});
const TextareaAutosize$1 = TextareaAutosize;
function getSvgIconUtilityClass(slot) {
return generateUtilityClass('MuiSvgIcon', slot);
}
generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
const _excluded$E = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
const useUtilityClasses$w = ownerState => {
const {
color,
fontSize,
classes
} = ownerState;
const slots = {
root: ['root', color !== 'inherit' && `color${capitalize(color)}`, `fontSize${capitalize(fontSize)}`]
};
return composeClasses(slots, getSvgIconUtilityClass, classes);
};
const SvgIconRoot = styled$1('svg', {
name: 'MuiSvgIcon',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.color !== 'inherit' && styles[`color${capitalize(ownerState.color)}`], styles[`fontSize${capitalize(ownerState.fontSize)}`]];
}
})(({
theme,
ownerState
}) => {
var _theme$transitions, _theme$transitions$cr, _theme$transitions2, _theme$transitions2$d, _theme$typography, _theme$typography$pxT, _theme$typography2, _theme$typography2$px, _theme$typography3, _theme$typography3$px, _palette$ownerState$c, _palette, _palette$ownerState$c2, _palette2, _palette2$action, _palette3, _palette3$action;
return {
userSelect: 'none',
width: '1em',
height: '1em',
display: 'inline-block',
fill: 'currentColor',
flexShrink: 0,
transition: (_theme$transitions = theme.transitions) == null ? void 0 : (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {
duration: (_theme$transitions2 = theme.transitions) == null ? void 0 : (_theme$transitions2$d = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2$d.shorter
}),
fontSize: {
inherit: 'inherit',
small: ((_theme$typography = theme.typography) == null ? void 0 : (_theme$typography$pxT = _theme$typography.pxToRem) == null ? void 0 : _theme$typography$pxT.call(_theme$typography, 20)) || '1.25rem',
medium: ((_theme$typography2 = theme.typography) == null ? void 0 : (_theme$typography2$px = _theme$typography2.pxToRem) == null ? void 0 : _theme$typography2$px.call(_theme$typography2, 24)) || '1.5rem',
large: ((_theme$typography3 = theme.typography) == null ? void 0 : (_theme$typography3$px = _theme$typography3.pxToRem) == null ? void 0 : _theme$typography3$px.call(_theme$typography3, 35)) || '2.1875rem'
}[ownerState.fontSize],
// TODO v5 deprecate, v6 remove for sx
color: (_palette$ownerState$c = (_palette = (theme.vars || theme).palette) == null ? void 0 : (_palette$ownerState$c2 = _palette[ownerState.color]) == null ? void 0 : _palette$ownerState$c2.main) != null ? _palette$ownerState$c : {
action: (_palette2 = (theme.vars || theme).palette) == null ? void 0 : (_palette2$action = _palette2.action) == null ? void 0 : _palette2$action.active,
disabled: (_palette3 = (theme.vars || theme).palette) == null ? void 0 : (_palette3$action = _palette3.action) == null ? void 0 : _palette3$action.disabled,
inherit: undefined
}[ownerState.color]
};
});
const SvgIcon = /*#__PURE__*/reactExports.forwardRef(function SvgIcon(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiSvgIcon'
});
const {
children,
className,
color = 'inherit',
component = 'svg',
fontSize = 'medium',
htmlColor,
inheritViewBox = false,
titleAccess,
viewBox = '0 0 24 24'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$E);
const ownerState = _extends({}, props, {
color,
component,
fontSize,
instanceFontSize: inProps.fontSize,
inheritViewBox,
viewBox
});
const more = {};
if (!inheritViewBox) {
more.viewBox = viewBox;
}
const classes = useUtilityClasses$w(ownerState);
return /*#__PURE__*/jsxs(SvgIconRoot, _extends({
as: component,
className: clsx(classes.root, className),
focusable: "false",
color: htmlColor,
"aria-hidden": titleAccess ? undefined : true,
role: titleAccess ? 'img' : undefined,
ref: ref
}, more, other, {
ownerState: ownerState,
children: [children, titleAccess ? /*#__PURE__*/jsx("title", {
children: titleAccess
}) : null]
}));
});
SvgIcon.muiName = 'SvgIcon';
const SvgIcon$1 = SvgIcon;
function createSvgIcon$1(path, displayName) {
function Component(props, ref) {
return /*#__PURE__*/jsx(SvgIcon$1, _extends({
"data-testid": `${displayName}Icon`,
ref: ref
}, props, {
children: path
}));
}
Component.muiName = SvgIcon$1.muiName;
return /*#__PURE__*/reactExports.memo( /*#__PURE__*/reactExports.forwardRef(Component));
}
// TODO: remove this export once ClassNameGenerator is stable
// eslint-disable-next-line @typescript-eslint/naming-convention
const unstable_ClassNameGenerator = {
configure: generator => {
ClassNameGenerator$1.configure(generator);
}
};
const utils = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
__proto__: null,
capitalize,
createChainedFunction,
createSvgIcon: createSvgIcon$1,
debounce: debounce$1,
deprecatedPropType,
isMuiElement,
ownerDocument,
ownerWindow,
requirePropFactory,
setRef,
unstable_ClassNameGenerator,
unstable_useEnhancedEffect: useEnhancedEffect$1,
unstable_useId: useId,
unsupportedProp,
useControlled,
useEventCallback,
useForkRef,
useIsFocusVisible
}, Symbol.toStringTag, { value: 'Module' }));
const config = {
disabled: false
};
const TransitionGroupContext = React.createContext(null);
var forceReflow = function forceReflow(node) {
return node.scrollTop;
};
var UNMOUNTED = 'unmounted';
var EXITED = 'exited';
var ENTERING = 'entering';
var ENTERED = 'entered';
var EXITING = 'exiting';
/**
* The Transition component lets you describe a transition from one component
* state to another _over time_ with a simple declarative API. Most commonly
* it's used to animate the mounting and unmounting of a component, but can also
* be used to describe in-place transition states as well.
*
* ---
*
* **Note**: `Transition` is a platform-agnostic base component. If you're using
* transitions in CSS, you'll probably want to use
* [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)
* instead. It inherits all the features of `Transition`, but contains
* additional features necessary to play nice with CSS transitions (hence the
* name of the component).
*
* ---
*
* By default the `Transition` component does not alter the behavior of the
* component it renders, it only tracks "enter" and "exit" states for the
* components. It's up to you to give meaning and effect to those states. For
* example we can add styles to a component when it enters or exits:
*
* ```jsx
* import { Transition } from 'react-transition-group';
*
* const duration = 300;
*
* const defaultStyle = {
* transition: `opacity ${duration}ms ease-in-out`,
* opacity: 0,
* }
*
* const transitionStyles = {
* entering: { opacity: 1 },
* entered: { opacity: 1 },
* exiting: { opacity: 0 },
* exited: { opacity: 0 },
* };
*
* const Fade = ({ in: inProp }) => (
* <Transition in={inProp} timeout={duration}>
* {state => (
* <div style={{
* ...defaultStyle,
* ...transitionStyles[state]
* }}>
* I'm a fade Transition!
* </div>
* )}
* </Transition>
* );
* ```
*
* There are 4 main states a Transition can be in:
* - `'entering'`
* - `'entered'`
* - `'exiting'`
* - `'exited'`
*
* Transition state is toggled via the `in` prop. When `true` the component
* begins the "Enter" stage. During this stage, the component will shift from
* its current transition state, to `'entering'` for the duration of the
* transition and then to the `'entered'` stage once it's complete. Let's take
* the following example (we'll use the
* [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):
*
* ```jsx
* function App() {
* const [inProp, setInProp] = useState(false);
* return (
* <div>
* <Transition in={inProp} timeout={500}>
* {state => (
* // ...
* )}
* </Transition>
* <button onClick={() => setInProp(true)}>
* Click to Enter
* </button>
* </div>
* );
* }
* ```
*
* When the button is clicked the component will shift to the `'entering'` state
* and stay there for 500ms (the value of `timeout`) before it finally switches
* to `'entered'`.
*
* When `in` is `false` the same thing happens except the state moves from
* `'exiting'` to `'exited'`.
*/
var Transition = /*#__PURE__*/function (_React$Component) {
_inheritsLoose(Transition, _React$Component);
function Transition(props, context) {
var _this;
_this = _React$Component.call(this, props, context) || this;
var parentGroup = context; // In the context of a TransitionGroup all enters are really appears
var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
var initialStatus;
_this.appearStatus = null;
if (props.in) {
if (appear) {
initialStatus = EXITED;
_this.appearStatus = ENTERING;
} else {
initialStatus = ENTERED;
}
} else {
if (props.unmountOnExit || props.mountOnEnter) {
initialStatus = UNMOUNTED;
} else {
initialStatus = EXITED;
}
}
_this.state = {
status: initialStatus
};
_this.nextCallback = null;
return _this;
}
Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
var nextIn = _ref.in;
if (nextIn && prevState.status === UNMOUNTED) {
return {
status: EXITED
};
}
return null;
} // getSnapshotBeforeUpdate(prevProps) {
// let nextStatus = null
// if (prevProps !== this.props) {
// const { status } = this.state
// if (this.props.in) {
// if (status !== ENTERING && status !== ENTERED) {
// nextStatus = ENTERING
// }
// } else {
// if (status === ENTERING || status === ENTERED) {
// nextStatus = EXITING
// }
// }
// }
// return { nextStatus }
// }
;
var _proto = Transition.prototype;
_proto.componentDidMount = function componentDidMount() {
this.updateStatus(true, this.appearStatus);
};
_proto.componentDidUpdate = function componentDidUpdate(prevProps) {
var nextStatus = null;
if (prevProps !== this.props) {
var status = this.state.status;
if (this.props.in) {
if (status !== ENTERING && status !== ENTERED) {
nextStatus = ENTERING;
}
} else {
if (status === ENTERING || status === ENTERED) {
nextStatus = EXITING;
}
}
}
this.updateStatus(false, nextStatus);
};
_proto.componentWillUnmount = function componentWillUnmount() {
this.cancelNextCallback();
};
_proto.getTimeouts = function getTimeouts() {
var timeout = this.props.timeout;
var exit, enter, appear;
exit = enter = appear = timeout;
if (timeout != null && typeof timeout !== 'number') {
exit = timeout.exit;
enter = timeout.enter; // TODO: remove fallback for next major
appear = timeout.appear !== undefined ? timeout.appear : enter;
}
return {
exit: exit,
enter: enter,
appear: appear
};
};
_proto.updateStatus = function updateStatus(mounting, nextStatus) {
if (mounting === void 0) {
mounting = false;
}
if (nextStatus !== null) {
// nextStatus will always be ENTERING or EXITING.
this.cancelNextCallback();
if (nextStatus === ENTERING) {
if (this.props.unmountOnExit || this.props.mountOnEnter) {
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
// With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
// To make the animation happen, we have to separate each rendering and avoid being processed as batched.
if (node) forceReflow(node);
}
this.performEnter(mounting);
} else {
this.performExit();
}
} else if (this.props.unmountOnExit && this.state.status === EXITED) {
this.setState({
status: UNMOUNTED
});
}
};
_proto.performEnter = function performEnter(mounting) {
var _this2 = this;
var enter = this.props.enter;
var appearing = this.context ? this.context.isMounting : mounting;
var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],
maybeNode = _ref2[0],
maybeAppearing = _ref2[1];
var timeouts = this.getTimeouts();
var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED
// if we are mounting and running this it means appear _must_ be set
if (!mounting && !enter || config.disabled) {
this.safeSetState({
status: ENTERED
}, function () {
_this2.props.onEntered(maybeNode);
});
return;
}
this.props.onEnter(maybeNode, maybeAppearing);
this.safeSetState({
status: ENTERING
}, function () {
_this2.props.onEntering(maybeNode, maybeAppearing);
_this2.onTransitionEnd(enterTimeout, function () {
_this2.safeSetState({
status: ENTERED
}, function () {
_this2.props.onEntered(maybeNode, maybeAppearing);
});
});
});
};
_proto.performExit = function performExit() {
var _this3 = this;
var exit = this.props.exit;
var timeouts = this.getTimeouts();
var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED
if (!exit || config.disabled) {
this.safeSetState({
status: EXITED
}, function () {
_this3.props.onExited(maybeNode);
});
return;
}
this.props.onExit(maybeNode);
this.safeSetState({
status: EXITING
}, function () {
_this3.props.onExiting(maybeNode);
_this3.onTransitionEnd(timeouts.exit, function () {
_this3.safeSetState({
status: EXITED
}, function () {
_this3.props.onExited(maybeNode);
});
});
});
};
_proto.cancelNextCallback = function cancelNextCallback() {
if (this.nextCallback !== null) {
this.nextCallback.cancel();
this.nextCallback = null;
}
};
_proto.safeSetState = function safeSetState(nextState, callback) {
// This shouldn't be necessary, but there are weird race conditions with
// setState callbacks and unmounting in testing, so always make sure that
// we can cancel any pending setState callbacks after we unmount.
callback = this.setNextCallback(callback);
this.setState(nextState, callback);
};
_proto.setNextCallback = function setNextCallback(callback) {
var _this4 = this;
var active = true;
this.nextCallback = function (event) {
if (active) {
active = false;
_this4.nextCallback = null;
callback(event);
}
};
this.nextCallback.cancel = function () {
active = false;
};
return this.nextCallback;
};
_proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
this.setNextCallback(handler);
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
if (!node || doesNotHaveTimeoutOrListener) {
setTimeout(this.nextCallback, 0);
return;
}
if (this.props.addEndListener) {
var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],
maybeNode = _ref3[0],
maybeNextCallback = _ref3[1];
this.props.addEndListener(maybeNode, maybeNextCallback);
}
if (timeout != null) {
setTimeout(this.nextCallback, timeout);
}
};
_proto.render = function render() {
var status = this.state.status;
if (status === UNMOUNTED) {
return null;
}
var _this$props = this.props,
children = _this$props.children;
_this$props.in;
_this$props.mountOnEnter;
_this$props.unmountOnExit;
_this$props.appear;
_this$props.enter;
_this$props.exit;
_this$props.timeout;
_this$props.addEndListener;
_this$props.onEnter;
_this$props.onEntering;
_this$props.onEntered;
_this$props.onExit;
_this$props.onExiting;
_this$props.onExited;
_this$props.nodeRef;
var childProps = _objectWithoutPropertiesLoose$2(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
return (
/*#__PURE__*/
// allows for nested Transitions
React.createElement(TransitionGroupContext.Provider, {
value: null
}, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
);
};
return Transition;
}(React.Component);
Transition.contextType = TransitionGroupContext;
Transition.propTypes = {}; // Name the function so it is clearer in the documentation
function noop$1() {}
Transition.defaultProps = {
in: false,
mountOnEnter: false,
unmountOnExit: false,
appear: false,
enter: true,
exit: true,
onEnter: noop$1,
onEntering: noop$1,
onEntered: noop$1,
onExit: noop$1,
onExiting: noop$1,
onExited: noop$1
};
Transition.UNMOUNTED = UNMOUNTED;
Transition.EXITED = EXITED;
Transition.ENTERING = ENTERING;
Transition.ENTERED = ENTERED;
Transition.EXITING = EXITING;
const Transition$1 = Transition;
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
/**
* Given `this.props.children`, return an object mapping key to child.
*
* @param {*} children `this.props.children`
* @return {object} Mapping of key to child
*/
function getChildMapping(children, mapFn) {
var mapper = function mapper(child) {
return mapFn && reactExports.isValidElement(child) ? mapFn(child) : child;
};
var result = Object.create(null);
if (children) reactExports.Children.map(children, function (c) {
return c;
}).forEach(function (child) {
// run the map function here instead so that the key is the computed one
result[child.key] = mapper(child);
});
return result;
}
/**
* When you're adding or removing children some may be added or removed in the
* same render pass. We want to show *both* since we want to simultaneously
* animate elements in and out. This function takes a previous set of keys
* and a new set of keys and merges them with its best guess of the correct
* ordering. In the future we may expose some of the utilities in
* ReactMultiChild to make this easy, but for now React itself does not
* directly have this concept of the union of prevChildren and nextChildren
* so we implement it here.
*
* @param {object} prev prev children as returned from
* `ReactTransitionChildMapping.getChildMapping()`.
* @param {object} next next children as returned from
* `ReactTransitionChildMapping.getChildMapping()`.
* @return {object} a key set that contains all keys in `prev` and all keys
* in `next` in a reasonable order.
*/
function mergeChildMappings(prev, next) {
prev = prev || {};
next = next || {};
function getValueForKey(key) {
return key in next ? next[key] : prev[key];
} // For each key of `next`, the list of keys to insert before that key in
// the combined list
var nextKeysPending = Object.create(null);
var pendingKeys = [];
for (var prevKey in prev) {
if (prevKey in next) {
if (pendingKeys.length) {
nextKeysPending[prevKey] = pendingKeys;
pendingKeys = [];
}
} else {
pendingKeys.push(prevKey);
}
}
var i;
var childMapping = {};
for (var nextKey in next) {
if (nextKeysPending[nextKey]) {
for (i = 0; i < nextKeysPending[nextKey].length; i++) {
var pendingNextKey = nextKeysPending[nextKey][i];
childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey);
}
}
childMapping[nextKey] = getValueForKey(nextKey);
} // Finally, add the keys which didn't appear before any key in `next`
for (i = 0; i < pendingKeys.length; i++) {
childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]);
}
return childMapping;
}
function getProp(child, prop, props) {
return props[prop] != null ? props[prop] : child.props[prop];
}
function getInitialChildMapping(props, onExited) {
return getChildMapping(props.children, function (child) {
return reactExports.cloneElement(child, {
onExited: onExited.bind(null, child),
in: true,
appear: getProp(child, 'appear', props),
enter: getProp(child, 'enter', props),
exit: getProp(child, 'exit', props)
});
});
}
function getNextChildMapping(nextProps, prevChildMapping, onExited) {
var nextChildMapping = getChildMapping(nextProps.children);
var children = mergeChildMappings(prevChildMapping, nextChildMapping);
Object.keys(children).forEach(function (key) {
var child = children[key];
if (!reactExports.isValidElement(child)) return;
var hasPrev = (key in prevChildMapping);
var hasNext = (key in nextChildMapping);
var prevChild = prevChildMapping[key];
var isLeaving = reactExports.isValidElement(prevChild) && !prevChild.props.in; // item is new (entering)
if (hasNext && (!hasPrev || isLeaving)) {
// console.log('entering', key)
children[key] = reactExports.cloneElement(child, {
onExited: onExited.bind(null, child),
in: true,
exit: getProp(child, 'exit', nextProps),
enter: getProp(child, 'enter', nextProps)
});
} else if (!hasNext && hasPrev && !isLeaving) {
// item is old (exiting)
// console.log('leaving', key)
children[key] = reactExports.cloneElement(child, {
in: false
});
} else if (hasNext && hasPrev && reactExports.isValidElement(prevChild)) {
// item hasn't changed transition states
// copy over the last transition props;
// console.log('unchanged', key)
children[key] = reactExports.cloneElement(child, {
onExited: onExited.bind(null, child),
in: prevChild.props.in,
exit: getProp(child, 'exit', nextProps),
enter: getProp(child, 'enter', nextProps)
});
}
});
return children;
}
var values = Object.values || function (obj) {
return Object.keys(obj).map(function (k) {
return obj[k];
});
};
var defaultProps$1 = {
component: 'div',
childFactory: function childFactory(child) {
return child;
}
};
/**
* The `<TransitionGroup>` component manages a set of transition components
* (`<Transition>` and `<CSSTransition>`) in a list. Like with the transition
* components, `<TransitionGroup>` is a state machine for managing the mounting
* and unmounting of components over time.
*
* Consider the example below. As items are removed or added to the TodoList the
* `in` prop is toggled automatically by the `<TransitionGroup>`.
*
* Note that `<TransitionGroup>` does not define any animation behavior!
* Exactly _how_ a list item animates is up to the individual transition
* component. This means you can mix and match animations across different list
* items.
*/
var TransitionGroup = /*#__PURE__*/function (_React$Component) {
_inheritsLoose(TransitionGroup, _React$Component);
function TransitionGroup(props, context) {
var _this;
_this = _React$Component.call(this, props, context) || this;
var handleExited = _this.handleExited.bind(_assertThisInitialized(_this)); // Initial children should all be entering, dependent on appear
_this.state = {
contextValue: {
isMounting: true
},
handleExited: handleExited,
firstRender: true
};
return _this;
}
var _proto = TransitionGroup.prototype;
_proto.componentDidMount = function componentDidMount() {
this.mounted = true;
this.setState({
contextValue: {
isMounting: false
}
});
};
_proto.componentWillUnmount = function componentWillUnmount() {
this.mounted = false;
};
TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) {
var prevChildMapping = _ref.children,
handleExited = _ref.handleExited,
firstRender = _ref.firstRender;
return {
children: firstRender ? getInitialChildMapping(nextProps, handleExited) : getNextChildMapping(nextProps, prevChildMapping, handleExited),
firstRender: false
};
} // node is `undefined` when user provided `nodeRef` prop
;
_proto.handleExited = function handleExited(child, node) {
var currentChildMapping = getChildMapping(this.props.children);
if (child.key in currentChildMapping) return;
if (child.props.onExited) {
child.props.onExited(node);
}
if (this.mounted) {
this.setState(function (state) {
var children = _extends({}, state.children);
delete children[child.key];
return {
children: children
};
});
}
};
_proto.render = function render() {
var _this$props = this.props,
Component = _this$props.component,
childFactory = _this$props.childFactory,
props = _objectWithoutPropertiesLoose$2(_this$props, ["component", "childFactory"]);
var contextValue = this.state.contextValue;
var children = values(this.state.children).map(childFactory);
delete props.appear;
delete props.enter;
delete props.exit;
if (Component === null) {
return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
value: contextValue
}, children);
}
return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
value: contextValue
}, /*#__PURE__*/React.createElement(Component, props, children));
};
return TransitionGroup;
}(React.Component);
TransitionGroup.propTypes = {};
TransitionGroup.defaultProps = defaultProps$1;
const TransitionGroup$1 = TransitionGroup;
const reflow = node => node.scrollTop;
function getTransitionProps(props, options) {
var _style$transitionDura, _style$transitionTimi;
const {
timeout,
easing,
style = {}
} = props;
return {
duration: (_style$transitionDura = style.transitionDuration) != null ? _style$transitionDura : typeof timeout === 'number' ? timeout : timeout[options.mode] || 0,
easing: (_style$transitionTimi = style.transitionTimingFunction) != null ? _style$transitionTimi : typeof easing === 'object' ? easing[options.mode] : easing,
delay: style.transitionDelay
};
}
function getPaperUtilityClass(slot) {
return generateUtilityClass('MuiPaper', slot);
}
generateUtilityClasses('MuiPaper', ['root', 'rounded', 'outlined', 'elevation', 'elevation0', 'elevation1', 'elevation2', 'elevation3', 'elevation4', 'elevation5', 'elevation6', 'elevation7', 'elevation8', 'elevation9', 'elevation10', 'elevation11', 'elevation12', 'elevation13', 'elevation14', 'elevation15', 'elevation16', 'elevation17', 'elevation18', 'elevation19', 'elevation20', 'elevation21', 'elevation22', 'elevation23', 'elevation24']);
const _excluded$D = ["className", "component", "elevation", "square", "variant"];
const useUtilityClasses$v = ownerState => {
const {
square,
elevation,
variant,
classes
} = ownerState;
const slots = {
root: ['root', variant, !square && 'rounded', variant === 'elevation' && `elevation${elevation}`]
};
return composeClasses(slots, getPaperUtilityClass, classes);
};
const PaperRoot = styled$1('div', {
name: 'MuiPaper',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, styles[ownerState.variant], !ownerState.square && styles.rounded, ownerState.variant === 'elevation' && styles[`elevation${ownerState.elevation}`]];
}
})(({
theme,
ownerState
}) => {
var _theme$vars$overlays;
return _extends({
backgroundColor: (theme.vars || theme).palette.background.paper,
color: (theme.vars || theme).palette.text.primary,
transition: theme.transitions.create('box-shadow')
}, !ownerState.square && {
borderRadius: theme.shape.borderRadius
}, ownerState.variant === 'outlined' && {
border: `1px solid ${(theme.vars || theme).palette.divider}`
}, ownerState.variant === 'elevation' && _extends({
boxShadow: (theme.vars || theme).shadows[ownerState.elevation]
}, !theme.vars && theme.palette.mode === 'dark' && {
backgroundImage: `linear-gradient(${alpha('#fff', getOverlayAlpha$1(ownerState.elevation))}, ${alpha('#fff', getOverlayAlpha$1(ownerState.elevation))})`
}, theme.vars && {
backgroundImage: (_theme$vars$overlays = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays[ownerState.elevation]
}));
});
const Paper = /*#__PURE__*/reactExports.forwardRef(function Paper(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiPaper'
});
const {
className,
component = 'div',
elevation = 1,
square = false,
variant = 'elevation'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$D);
const ownerState = _extends({}, props, {
component,
elevation,
square,
variant
});
const classes = useUtilityClasses$v(ownerState);
return /*#__PURE__*/jsx(PaperRoot, _extends({
as: component,
ownerState: ownerState,
className: clsx(classes.root, className),
ref: ref
}, other));
});
const Paper$1 = Paper;
function Ripple(props) {
const {
className,
classes,
pulsate = false,
rippleX,
rippleY,
rippleSize,
in: inProp,
onExited,
timeout
} = props;
const [leaving, setLeaving] = reactExports.useState(false);
const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
const rippleStyles = {
width: rippleSize,
height: rippleSize,
top: -(rippleSize / 2) + rippleY,
left: -(rippleSize / 2) + rippleX
};
const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
if (!inProp && !leaving) {
setLeaving(true);
}
reactExports.useEffect(() => {
if (!inProp && onExited != null) {
// react-transition-group#onExited
const timeoutId = setTimeout(onExited, timeout);
return () => {
clearTimeout(timeoutId);
};
}
return undefined;
}, [onExited, inProp, timeout]);
return /*#__PURE__*/jsx("span", {
className: rippleClassName,
style: rippleStyles,
children: /*#__PURE__*/jsx("span", {
className: childClassName
})
});
}
const touchRippleClasses = generateUtilityClasses('MuiTouchRipple', ['root', 'ripple', 'rippleVisible', 'ripplePulsate', 'child', 'childLeaving', 'childPulsate']);
const touchRippleClasses$1 = touchRippleClasses;
const _excluded$C = ["center", "classes", "className"];
let _ = t => t,
_t,
_t2,
_t3,
_t4;
const DURATION = 550;
const DELAY_RIPPLE = 80;
const enterKeyframe = keyframes(_t || (_t = _`
0% {
transform: scale(0);
opacity: 0.1;
}
100% {
transform: scale(1);
opacity: 0.3;
}
`));
const exitKeyframe = keyframes(_t2 || (_t2 = _`
0% {
opacity: 1;
}
100% {
opacity: 0;
}
`));
const pulsateKeyframe = keyframes(_t3 || (_t3 = _`
0% {
transform: scale(1);
}
50% {
transform: scale(0.92);
}
100% {
transform: scale(1);
}
`));
const TouchRippleRoot = styled$1('span', {
name: 'MuiTouchRipple',
slot: 'Root'
})({
overflow: 'hidden',
pointerEvents: 'none',
position: 'absolute',
zIndex: 0,
top: 0,
right: 0,
bottom: 0,
left: 0,
borderRadius: 'inherit'
});
// This `styled()` function invokes keyframes. `styled-components` only supports keyframes
// in string templates. Do not convert these styles in JS object as it will break.
const TouchRippleRipple = styled$1(Ripple, {
name: 'MuiTouchRipple',
slot: 'Ripple'
})(_t4 || (_t4 = _`
opacity: 0;
position: absolute;
&.${0} {
opacity: 0.3;
transform: scale(1);
animation-name: ${0};
animation-duration: ${0}ms;
animation-timing-function: ${0};
}
&.${0} {
animation-duration: ${0}ms;
}
& .${0} {
opacity: 1;
display: block;
width: 100%;
height: 100%;
border-radius: 50%;
background-color: currentColor;
}
& .${0} {
opacity: 0;
animation-name: ${0};
animation-duration: ${0}ms;
animation-timing-function: ${0};
}
& .${0} {
position: absolute;
/* @noflip */
left: 0px;
top: 0;
animation-name: ${0};
animation-duration: 2500ms;
animation-timing-function: ${0};
animation-iteration-count: infinite;
animation-delay: 200ms;
}
`), touchRippleClasses$1.rippleVisible, enterKeyframe, DURATION, ({
theme
}) => theme.transitions.easing.easeInOut, touchRippleClasses$1.ripplePulsate, ({
theme
}) => theme.transitions.duration.shorter, touchRippleClasses$1.child, touchRippleClasses$1.childLeaving, exitKeyframe, DURATION, ({
theme
}) => theme.transitions.easing.easeInOut, touchRippleClasses$1.childPulsate, pulsateKeyframe, ({
theme
}) => theme.transitions.easing.easeInOut);
/**
* @ignore - internal component.
*
* TODO v5: Make private
*/
const TouchRipple = /*#__PURE__*/reactExports.forwardRef(function TouchRipple(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiTouchRipple'
});
const {
center: centerProp = false,
classes = {},
className
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$C);
const [ripples, setRipples] = reactExports.useState([]);
const nextKey = reactExports.useRef(0);
const rippleCallback = reactExports.useRef(null);
reactExports.useEffect(() => {
if (rippleCallback.current) {
rippleCallback.current();
rippleCallback.current = null;
}
}, [ripples]);
// Used to filter out mouse emulated events on mobile.
const ignoringMouseDown = reactExports.useRef(false);
// We use a timer in order to only show the ripples for touch "click" like events.
// We don't want to display the ripple for touch scroll events.
const startTimer = reactExports.useRef(null);
// This is the hook called once the previous timeout is ready.
const startTimerCommit = reactExports.useRef(null);
const container = reactExports.useRef(null);
reactExports.useEffect(() => {
return () => {
clearTimeout(startTimer.current);
};
}, []);
const startCommit = reactExports.useCallback(params => {
const {
pulsate,
rippleX,
rippleY,
rippleSize,
cb
} = params;
setRipples(oldRipples => [...oldRipples, /*#__PURE__*/jsx(TouchRippleRipple, {
classes: {
ripple: clsx(classes.ripple, touchRippleClasses$1.ripple),
rippleVisible: clsx(classes.rippleVisible, touchRippleClasses$1.rippleVisible),
ripplePulsate: clsx(classes.ripplePulsate, touchRippleClasses$1.ripplePulsate),
child: clsx(classes.child, touchRippleClasses$1.child),
childLeaving: clsx(classes.childLeaving, touchRippleClasses$1.childLeaving),
childPulsate: clsx(classes.childPulsate, touchRippleClasses$1.childPulsate)
},
timeout: DURATION,
pulsate: pulsate,
rippleX: rippleX,
rippleY: rippleY,
rippleSize: rippleSize
}, nextKey.current)]);
nextKey.current += 1;
rippleCallback.current = cb;
}, [classes]);
const start = reactExports.useCallback((event = {}, options = {}, cb = () => {}) => {
const {
pulsate = false,
center = centerProp || options.pulsate,
fakeElement = false // For test purposes
} = options;
if ((event == null ? void 0 : event.type) === 'mousedown' && ignoringMouseDown.current) {
ignoringMouseDown.current = false;
return;
}
if ((event == null ? void 0 : event.type) === 'touchstart') {
ignoringMouseDown.current = true;
}
const element = fakeElement ? null : container.current;
const rect = element ? element.getBoundingClientRect() : {
width: 0,
height: 0,
left: 0,
top: 0
};
// Get the size of the ripple
let rippleX;
let rippleY;
let rippleSize;
if (center || event === undefined || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {
rippleX = Math.round(rect.width / 2);
rippleY = Math.round(rect.height / 2);
} else {
const {
clientX,
clientY
} = event.touches && event.touches.length > 0 ? event.touches[0] : event;
rippleX = Math.round(clientX - rect.left);
rippleY = Math.round(clientY - rect.top);
}
if (center) {
rippleSize = Math.sqrt((2 * rect.width ** 2 + rect.height ** 2) / 3);
// For some reason the animation is broken on Mobile Chrome if the size is even.
if (rippleSize % 2 === 0) {
rippleSize += 1;
}
} else {
const sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2;
const sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2;
rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);
}
// Touche devices
if (event != null && event.touches) {
// check that this isn't another touchstart due to multitouch
// otherwise we will only clear a single timer when unmounting while two
// are running
if (startTimerCommit.current === null) {
// Prepare the ripple effect.
startTimerCommit.current = () => {
startCommit({
pulsate,
rippleX,
rippleY,
rippleSize,
cb
});
};
// Delay the execution of the ripple effect.
startTimer.current = setTimeout(() => {
if (startTimerCommit.current) {
startTimerCommit.current();
startTimerCommit.current = null;
}
}, DELAY_RIPPLE); // We have to make a tradeoff with this value.
}
} else {
startCommit({
pulsate,
rippleX,
rippleY,
rippleSize,
cb
});
}
}, [centerProp, startCommit]);
const pulsate = reactExports.useCallback(() => {
start({}, {
pulsate: true
});
}, [start]);
const stop = reactExports.useCallback((event, cb) => {
clearTimeout(startTimer.current);
// The touch interaction occurs too quickly.
// We still want to show ripple effect.
if ((event == null ? void 0 : event.type) === 'touchend' && startTimerCommit.current) {
startTimerCommit.current();
startTimerCommit.current = null;
startTimer.current = setTimeout(() => {
stop(event, cb);
});
return;
}
startTimerCommit.current = null;
setRipples(oldRipples => {
if (oldRipples.length > 0) {
return oldRipples.slice(1);
}
return oldRipples;
});
rippleCallback.current = cb;
}, []);
reactExports.useImperativeHandle(ref, () => ({
pulsate,
start,
stop
}), [pulsate, start, stop]);
return /*#__PURE__*/jsx(TouchRippleRoot, _extends({
className: clsx(touchRippleClasses$1.root, classes.root, className),
ref: container
}, other, {
children: /*#__PURE__*/jsx(TransitionGroup$1, {
component: null,
exit: true,
children: ripples
})
}));
});
const TouchRipple$1 = TouchRipple;
function getButtonBaseUtilityClass(slot) {
return generateUtilityClass('MuiButtonBase', slot);
}
const buttonBaseClasses = generateUtilityClasses('MuiButtonBase', ['root', 'disabled', 'focusVisible']);
const buttonBaseClasses$1 = buttonBaseClasses;
const _excluded$B = ["action", "centerRipple", "children", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "LinkComponent", "onBlur", "onClick", "onContextMenu", "onDragLeave", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "tabIndex", "TouchRippleProps", "touchRippleRef", "type"];
const useUtilityClasses$u = ownerState => {
const {
disabled,
focusVisible,
focusVisibleClassName,
classes
} = ownerState;
const slots = {
root: ['root', disabled && 'disabled', focusVisible && 'focusVisible']
};
const composedClasses = composeClasses(slots, getButtonBaseUtilityClass, classes);
if (focusVisible && focusVisibleClassName) {
composedClasses.root += ` ${focusVisibleClassName}`;
}
return composedClasses;
};
const ButtonBaseRoot = styled$1('button', {
name: 'MuiButtonBase',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
position: 'relative',
boxSizing: 'border-box',
WebkitTapHighlightColor: 'transparent',
backgroundColor: 'transparent',
// Reset default value
// We disable the focus ring for mouse, touch and keyboard users.
outline: 0,
border: 0,
margin: 0,
// Remove the margin in Safari
borderRadius: 0,
padding: 0,
// Remove the padding in Firefox
cursor: 'pointer',
userSelect: 'none',
verticalAlign: 'middle',
MozAppearance: 'none',
// Reset
WebkitAppearance: 'none',
// Reset
textDecoration: 'none',
// So we take precedent over the style of a native <a /> element.
color: 'inherit',
'&::-moz-focus-inner': {
borderStyle: 'none' // Remove Firefox dotted outline.
},
[`&.${buttonBaseClasses$1.disabled}`]: {
pointerEvents: 'none',
// Disable link interactions
cursor: 'default'
},
'@media print': {
colorAdjust: 'exact'
}
});
/**
* `ButtonBase` contains as few styles as possible.
* It aims to be a simple building block for creating a button.
* It contains a load of style reset and some focus/ripple logic.
*/
const ButtonBase = /*#__PURE__*/reactExports.forwardRef(function ButtonBase(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiButtonBase'
});
const {
action,
centerRipple = false,
children,
className,
component = 'button',
disabled = false,
disableRipple = false,
disableTouchRipple = false,
focusRipple = false,
LinkComponent = 'a',
onBlur,
onClick,
onContextMenu,
onDragLeave,
onFocus,
onFocusVisible,
onKeyDown,
onKeyUp,
onMouseDown,
onMouseLeave,
onMouseUp,
onTouchEnd,
onTouchMove,
onTouchStart,
tabIndex = 0,
TouchRippleProps,
touchRippleRef,
type
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$B);
const buttonRef = reactExports.useRef(null);
const rippleRef = reactExports.useRef(null);
const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
const {
isFocusVisibleRef,
onFocus: handleFocusVisible,
onBlur: handleBlurVisible,
ref: focusVisibleRef
} = useIsFocusVisible();
const [focusVisible, setFocusVisible] = reactExports.useState(false);
if (disabled && focusVisible) {
setFocusVisible(false);
}
reactExports.useImperativeHandle(action, () => ({
focusVisible: () => {
setFocusVisible(true);
buttonRef.current.focus();
}
}), []);
const [mountedState, setMountedState] = reactExports.useState(false);
reactExports.useEffect(() => {
setMountedState(true);
}, []);
const enableTouchRipple = mountedState && !disableRipple && !disabled;
reactExports.useEffect(() => {
if (focusVisible && focusRipple && !disableRipple && mountedState) {
rippleRef.current.pulsate();
}
}, [disableRipple, focusRipple, focusVisible, mountedState]);
function useRippleHandler(rippleAction, eventCallback, skipRippleAction = disableTouchRipple) {
return useEventCallback(event => {
if (eventCallback) {
eventCallback(event);
}
const ignore = skipRippleAction;
if (!ignore && rippleRef.current) {
rippleRef.current[rippleAction](event);
}
return true;
});
}
const handleMouseDown = useRippleHandler('start', onMouseDown);
const handleContextMenu = useRippleHandler('stop', onContextMenu);
const handleDragLeave = useRippleHandler('stop', onDragLeave);
const handleMouseUp = useRippleHandler('stop', onMouseUp);
const handleMouseLeave = useRippleHandler('stop', event => {
if (focusVisible) {
event.preventDefault();
}
if (onMouseLeave) {
onMouseLeave(event);
}
});
const handleTouchStart = useRippleHandler('start', onTouchStart);
const handleTouchEnd = useRippleHandler('stop', onTouchEnd);
const handleTouchMove = useRippleHandler('stop', onTouchMove);
const handleBlur = useRippleHandler('stop', event => {
handleBlurVisible(event);
if (isFocusVisibleRef.current === false) {
setFocusVisible(false);
}
if (onBlur) {
onBlur(event);
}
}, false);
const handleFocus = useEventCallback(event => {
// Fix for https://github.com/facebook/react/issues/7769
if (!buttonRef.current) {
buttonRef.current = event.currentTarget;
}
handleFocusVisible(event);
if (isFocusVisibleRef.current === true) {
setFocusVisible(true);
if (onFocusVisible) {
onFocusVisible(event);
}
}
if (onFocus) {
onFocus(event);
}
});
const isNonNativeButton = () => {
const button = buttonRef.current;
return component && component !== 'button' && !(button.tagName === 'A' && button.href);
};
/**
* IE11 shim for https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/repeat
*/
const keydownRef = reactExports.useRef(false);
const handleKeyDown = useEventCallback(event => {
// Check if key is already down to avoid repeats being counted as multiple activations
if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === ' ') {
keydownRef.current = true;
rippleRef.current.stop(event, () => {
rippleRef.current.start(event);
});
}
if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') {
event.preventDefault();
}
if (onKeyDown) {
onKeyDown(event);
}
// Keyboard accessibility for non interactive elements
if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter' && !disabled) {
event.preventDefault();
if (onClick) {
onClick(event);
}
}
});
const handleKeyUp = useEventCallback(event => {
// calling preventDefault in keyUp on a <button> will not dispatch a click event if Space is pressed
// https://codesandbox.io/s/button-keyup-preventdefault-dn7f0
if (focusRipple && event.key === ' ' && rippleRef.current && focusVisible && !event.defaultPrevented) {
keydownRef.current = false;
rippleRef.current.stop(event, () => {
rippleRef.current.pulsate(event);
});
}
if (onKeyUp) {
onKeyUp(event);
}
// Keyboard accessibility for non interactive elements
if (onClick && event.target === event.currentTarget && isNonNativeButton() && event.key === ' ' && !event.defaultPrevented) {
onClick(event);
}
});
let ComponentProp = component;
if (ComponentProp === 'button' && (other.href || other.to)) {
ComponentProp = LinkComponent;
}
const buttonProps = {};
if (ComponentProp === 'button') {
buttonProps.type = type === undefined ? 'button' : type;
buttonProps.disabled = disabled;
} else {
if (!other.href && !other.to) {
buttonProps.role = 'button';
}
if (disabled) {
buttonProps['aria-disabled'] = disabled;
}
}
const handleRef = useForkRef(ref, focusVisibleRef, buttonRef);
const ownerState = _extends({}, props, {
centerRipple,
component,
disabled,
disableRipple,
disableTouchRipple,
focusRipple,
tabIndex,
focusVisible
});
const classes = useUtilityClasses$u(ownerState);
return /*#__PURE__*/jsxs(ButtonBaseRoot, _extends({
as: ComponentProp,
className: clsx(classes.root, className),
ownerState: ownerState,
onBlur: handleBlur,
onClick: onClick,
onContextMenu: handleContextMenu,
onFocus: handleFocus,
onKeyDown: handleKeyDown,
onKeyUp: handleKeyUp,
onMouseDown: handleMouseDown,
onMouseLeave: handleMouseLeave,
onMouseUp: handleMouseUp,
onDragLeave: handleDragLeave,
onTouchEnd: handleTouchEnd,
onTouchMove: handleTouchMove,
onTouchStart: handleTouchStart,
ref: handleRef,
tabIndex: disabled ? -1 : tabIndex,
type: type
}, buttonProps, other, {
children: [children, enableTouchRipple ?
/*#__PURE__*/
/* TouchRipple is only needed client-side, x2 boost on the server. */
jsx(TouchRipple$1, _extends({
ref: handleRippleRef,
center: centerRipple
}, TouchRippleProps)) : null]
}));
});
const ButtonBase$1 = ButtonBase;
function getIconButtonUtilityClass(slot) {
return generateUtilityClass('MuiIconButton', slot);
}
const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
const iconButtonClasses$1 = iconButtonClasses;
const _excluded$A = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
const useUtilityClasses$t = ownerState => {
const {
classes,
disabled,
color,
edge,
size
} = ownerState;
const slots = {
root: ['root', disabled && 'disabled', color !== 'default' && `color${capitalize(color)}`, edge && `edge${capitalize(edge)}`, `size${capitalize(size)}`]
};
return composeClasses(slots, getIconButtonUtilityClass, classes);
};
const IconButtonRoot = styled$1(ButtonBase$1, {
name: 'MuiIconButton',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`], ownerState.edge && styles[`edge${capitalize(ownerState.edge)}`], styles[`size${capitalize(ownerState.size)}`]];
}
})(({
theme,
ownerState
}) => _extends({
textAlign: 'center',
flex: '0 0 auto',
fontSize: theme.typography.pxToRem(24),
padding: 8,
borderRadius: '50%',
overflow: 'visible',
// Explicitly set the default value to solve a bug on IE11.
color: (theme.vars || theme).palette.action.active,
transition: theme.transitions.create('background-color', {
duration: theme.transitions.duration.shortest
})
}, !ownerState.disableRipple && {
'&:hover': {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.activeChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.action.active, theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
}
}, ownerState.edge === 'start' && {
marginLeft: ownerState.size === 'small' ? -3 : -12
}, ownerState.edge === 'end' && {
marginRight: ownerState.size === 'small' ? -3 : -12
}), ({
theme,
ownerState
}) => {
var _palette;
const palette = (_palette = (theme.vars || theme).palette) == null ? void 0 : _palette[ownerState.color];
return _extends({}, ownerState.color === 'inherit' && {
color: 'inherit'
}, ownerState.color !== 'inherit' && ownerState.color !== 'default' && _extends({
color: palette == null ? void 0 : palette.main
}, !ownerState.disableRipple && {
'&:hover': _extends({}, palette && {
backgroundColor: theme.vars ? `rgba(${palette.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(palette.main, theme.palette.action.hoverOpacity)
}, {
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
})
}), ownerState.size === 'small' && {
padding: 5,
fontSize: theme.typography.pxToRem(18)
}, ownerState.size === 'large' && {
padding: 12,
fontSize: theme.typography.pxToRem(28)
}, {
[`&.${iconButtonClasses$1.disabled}`]: {
backgroundColor: 'transparent',
color: (theme.vars || theme).palette.action.disabled
}
});
});
/**
* Refer to the [Icons](/material-ui/icons/) section of the documentation
* regarding the available icon options.
*/
const IconButton = /*#__PURE__*/reactExports.forwardRef(function IconButton(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiIconButton'
});
const {
edge = false,
children,
className,
color = 'default',
disabled = false,
disableFocusRipple = false,
size = 'medium'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$A);
const ownerState = _extends({}, props, {
edge,
color,
disabled,
disableFocusRipple,
size
});
const classes = useUtilityClasses$t(ownerState);
return /*#__PURE__*/jsx(IconButtonRoot, _extends({
className: clsx(classes.root, className),
centerRipple: true,
focusRipple: !disableFocusRipple,
disabled: disabled,
ref: ref,
ownerState: ownerState
}, other, {
children: children
}));
});
const IconButton$1 = IconButton;
function getTypographyUtilityClass(slot) {
return generateUtilityClass('MuiTypography', slot);
}
generateUtilityClasses('MuiTypography', ['root', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'inherit', 'button', 'caption', 'overline', 'alignLeft', 'alignRight', 'alignCenter', 'alignJustify', 'noWrap', 'gutterBottom', 'paragraph']);
const _excluded$z = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
const useUtilityClasses$s = ownerState => {
const {
align,
gutterBottom,
noWrap,
paragraph,
variant,
classes
} = ownerState;
const slots = {
root: ['root', variant, ownerState.align !== 'inherit' && `align${capitalize(align)}`, gutterBottom && 'gutterBottom', noWrap && 'noWrap', paragraph && 'paragraph']
};
return composeClasses(slots, getTypographyUtilityClass, classes);
};
const TypographyRoot = styled$1('span', {
name: 'MuiTypography',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.variant && styles[ownerState.variant], ownerState.align !== 'inherit' && styles[`align${capitalize(ownerState.align)}`], ownerState.noWrap && styles.noWrap, ownerState.gutterBottom && styles.gutterBottom, ownerState.paragraph && styles.paragraph];
}
})(({
theme,
ownerState
}) => _extends({
margin: 0
}, ownerState.variant && theme.typography[ownerState.variant], ownerState.align !== 'inherit' && {
textAlign: ownerState.align
}, ownerState.noWrap && {
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap'
}, ownerState.gutterBottom && {
marginBottom: '0.35em'
}, ownerState.paragraph && {
marginBottom: 16
}));
const defaultVariantMapping = {
h1: 'h1',
h2: 'h2',
h3: 'h3',
h4: 'h4',
h5: 'h5',
h6: 'h6',
subtitle1: 'h6',
subtitle2: 'h6',
body1: 'p',
body2: 'p',
inherit: 'p'
};
// TODO v6: deprecate these color values in v5.x and remove the transformation in v6
const colorTransformations = {
primary: 'primary.main',
textPrimary: 'text.primary',
secondary: 'secondary.main',
textSecondary: 'text.secondary',
error: 'error.main'
};
const transformDeprecatedColors = color => {
return colorTransformations[color] || color;
};
const Typography = /*#__PURE__*/reactExports.forwardRef(function Typography(inProps, ref) {
const themeProps = useThemeProps({
props: inProps,
name: 'MuiTypography'
});
const color = transformDeprecatedColors(themeProps.color);
const props = extendSxProp(_extends({}, themeProps, {
color
}));
const {
align = 'inherit',
className,
component,
gutterBottom = false,
noWrap = false,
paragraph = false,
variant = 'body1',
variantMapping = defaultVariantMapping
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$z);
const ownerState = _extends({}, props, {
align,
color,
className,
component,
gutterBottom,
noWrap,
paragraph,
variant,
variantMapping
});
const Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
const classes = useUtilityClasses$s(ownerState);
return /*#__PURE__*/jsx(TypographyRoot, _extends({
as: Component,
ref: ref,
ownerState: ownerState,
className: clsx(classes.root, className)
}, other));
});
const Typography$1 = Typography;
const _excluded$y = ["components", "componentsProps", "slots", "slotProps"];
const PopperRoot = styled$1(PopperUnstyled$1, {
name: 'MuiPopper',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({});
/**
*
* Demos:
*
* - [Autocomplete](https://mui.com/material-ui/react-autocomplete/)
* - [Menu](https://mui.com/material-ui/react-menu/)
* - [Popper](https://mui.com/material-ui/react-popper/)
*
* API:
*
* - [Popper API](https://mui.com/material-ui/api/popper/)
*/
const Popper = /*#__PURE__*/reactExports.forwardRef(function Popper(inProps, ref) {
var _slots$root;
const theme = useTheme$2();
const props = useThemeProps({
props: inProps,
name: 'MuiPopper'
});
const {
components,
componentsProps,
slots,
slotProps
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$y);
const RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;
return /*#__PURE__*/jsx(PopperRoot, _extends({
direction: theme == null ? void 0 : theme.direction,
slots: {
root: RootComponent
},
slotProps: slotProps != null ? slotProps : componentsProps
}, other, {
ref: ref
}));
});
const Popper$1 = Popper;
function formControlState({
props,
states,
muiFormControl
}) {
return states.reduce((acc, state) => {
acc[state] = props[state];
if (muiFormControl) {
if (typeof props[state] === 'undefined') {
acc[state] = muiFormControl[state];
}
}
return acc;
}, {});
}
/**
* @ignore - internal component.
*/
const FormControlContext = /*#__PURE__*/reactExports.createContext(undefined);
const FormControlContext$1 = FormControlContext;
function useFormControl() {
return reactExports.useContext(FormControlContext$1);
}
function GlobalStyles(props) {
return /*#__PURE__*/jsx(GlobalStyles$1, _extends({}, props, {
defaultTheme: defaultTheme$2
}));
}
// Supports determination of isControlled().
// Controlled input accepts its current value as a prop.
//
// @see https://facebook.github.io/react/docs/forms.html#controlled-components
// @param value
// @returns {boolean} true if string (including '') or number (including zero)
function hasValue(value) {
return value != null && !(Array.isArray(value) && value.length === 0);
}
// Determine if field is empty or filled.
// Response determines if label is presented above field or as placeholder.
//
// @param obj
// @param SSR
// @returns {boolean} False when not present or empty string.
// True when any number or string with length.
function isFilled(obj, SSR = false) {
return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
}
// Determine if an Input is adorned on start.
// It's corresponding to the left with LTR.
//
// @param obj
// @returns {boolean} False when no adornments.
// True when adorned at the start.
function isAdornedStart(obj) {
return obj.startAdornment;
}
function getInputBaseUtilityClass(slot) {
return generateUtilityClass('MuiInputBase', slot);
}
const inputBaseClasses = generateUtilityClasses('MuiInputBase', ['root', 'formControl', 'focused', 'disabled', 'adornedStart', 'adornedEnd', 'error', 'sizeSmall', 'multiline', 'colorSecondary', 'fullWidth', 'hiddenLabel', 'readOnly', 'input', 'inputSizeSmall', 'inputMultiline', 'inputTypeSearch', 'inputAdornedStart', 'inputAdornedEnd', 'inputHiddenLabel']);
const inputBaseClasses$1 = inputBaseClasses;
const _excluded$x = ["aria-describedby", "autoComplete", "autoFocus", "className", "color", "components", "componentsProps", "defaultValue", "disabled", "disableInjectingGlobalStyles", "endAdornment", "error", "fullWidth", "id", "inputComponent", "inputProps", "inputRef", "margin", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "renderSuffix", "rows", "size", "slotProps", "slots", "startAdornment", "type", "value"];
const rootOverridesResolver = (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.formControl && styles.formControl, ownerState.startAdornment && styles.adornedStart, ownerState.endAdornment && styles.adornedEnd, ownerState.error && styles.error, ownerState.size === 'small' && styles.sizeSmall, ownerState.multiline && styles.multiline, ownerState.color && styles[`color${capitalize(ownerState.color)}`], ownerState.fullWidth && styles.fullWidth, ownerState.hiddenLabel && styles.hiddenLabel];
};
const inputOverridesResolver = (props, styles) => {
const {
ownerState
} = props;
return [styles.input, ownerState.size === 'small' && styles.inputSizeSmall, ownerState.multiline && styles.inputMultiline, ownerState.type === 'search' && styles.inputTypeSearch, ownerState.startAdornment && styles.inputAdornedStart, ownerState.endAdornment && styles.inputAdornedEnd, ownerState.hiddenLabel && styles.inputHiddenLabel];
};
const useUtilityClasses$r = ownerState => {
const {
classes,
color,
disabled,
error,
endAdornment,
focused,
formControl,
fullWidth,
hiddenLabel,
multiline,
readOnly,
size,
startAdornment,
type
} = ownerState;
const slots = {
root: ['root', `color${capitalize(color)}`, disabled && 'disabled', error && 'error', fullWidth && 'fullWidth', focused && 'focused', formControl && 'formControl', size === 'small' && 'sizeSmall', multiline && 'multiline', startAdornment && 'adornedStart', endAdornment && 'adornedEnd', hiddenLabel && 'hiddenLabel', readOnly && 'readOnly'],
input: ['input', disabled && 'disabled', type === 'search' && 'inputTypeSearch', multiline && 'inputMultiline', size === 'small' && 'inputSizeSmall', hiddenLabel && 'inputHiddenLabel', startAdornment && 'inputAdornedStart', endAdornment && 'inputAdornedEnd', readOnly && 'readOnly']
};
return composeClasses(slots, getInputBaseUtilityClass, classes);
};
const InputBaseRoot = styled$1('div', {
name: 'MuiInputBase',
slot: 'Root',
overridesResolver: rootOverridesResolver
})(({
theme,
ownerState
}) => _extends({}, theme.typography.body1, {
color: (theme.vars || theme).palette.text.primary,
lineHeight: '1.4375em',
// 23px
boxSizing: 'border-box',
// Prevent padding issue with fullWidth.
position: 'relative',
cursor: 'text',
display: 'inline-flex',
alignItems: 'center',
[`&.${inputBaseClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.text.disabled,
cursor: 'default'
}
}, ownerState.multiline && _extends({
padding: '4px 0 5px'
}, ownerState.size === 'small' && {
paddingTop: 1
}), ownerState.fullWidth && {
width: '100%'
}));
const InputBaseComponent = styled$1('input', {
name: 'MuiInputBase',
slot: 'Input',
overridesResolver: inputOverridesResolver
})(({
theme,
ownerState
}) => {
const light = theme.palette.mode === 'light';
const placeholder = _extends({
color: 'currentColor'
}, theme.vars ? {
opacity: theme.vars.opacity.inputPlaceholder
} : {
opacity: light ? 0.42 : 0.5
}, {
transition: theme.transitions.create('opacity', {
duration: theme.transitions.duration.shorter
})
});
const placeholderHidden = {
opacity: '0 !important'
};
const placeholderVisible = theme.vars ? {
opacity: theme.vars.opacity.inputPlaceholder
} : {
opacity: light ? 0.42 : 0.5
};
return _extends({
font: 'inherit',
letterSpacing: 'inherit',
color: 'currentColor',
padding: '4px 0 5px',
border: 0,
boxSizing: 'content-box',
background: 'none',
height: '1.4375em',
// Reset 23pxthe native input line-height
margin: 0,
// Reset for Safari
WebkitTapHighlightColor: 'transparent',
display: 'block',
// Make the flex item shrink with Firefox
minWidth: 0,
width: '100%',
// Fix IE11 width issue
animationName: 'mui-auto-fill-cancel',
animationDuration: '10ms',
'&::-webkit-input-placeholder': placeholder,
'&::-moz-placeholder': placeholder,
// Firefox 19+
'&:-ms-input-placeholder': placeholder,
// IE11
'&::-ms-input-placeholder': placeholder,
// Edge
'&:focus': {
outline: 0
},
// Reset Firefox invalid required input style
'&:invalid': {
boxShadow: 'none'
},
'&::-webkit-search-decoration': {
// Remove the padding when type=search.
WebkitAppearance: 'none'
},
// Show and hide the placeholder logic
[`label[data-shrink=false] + .${inputBaseClasses$1.formControl} &`]: {
'&::-webkit-input-placeholder': placeholderHidden,
'&::-moz-placeholder': placeholderHidden,
// Firefox 19+
'&:-ms-input-placeholder': placeholderHidden,
// IE11
'&::-ms-input-placeholder': placeholderHidden,
// Edge
'&:focus::-webkit-input-placeholder': placeholderVisible,
'&:focus::-moz-placeholder': placeholderVisible,
// Firefox 19+
'&:focus:-ms-input-placeholder': placeholderVisible,
// IE11
'&:focus::-ms-input-placeholder': placeholderVisible // Edge
},
[`&.${inputBaseClasses$1.disabled}`]: {
opacity: 1,
// Reset iOS opacity
WebkitTextFillColor: (theme.vars || theme).palette.text.disabled // Fix opacity Safari bug
},
'&:-webkit-autofill': {
animationDuration: '5000s',
animationName: 'mui-auto-fill'
}
}, ownerState.size === 'small' && {
paddingTop: 1
}, ownerState.multiline && {
height: 'auto',
resize: 'none',
padding: 0,
paddingTop: 0
}, ownerState.type === 'search' && {
// Improve type search style.
MozAppearance: 'textfield'
});
});
const inputGlobalStyles = /*#__PURE__*/jsx(GlobalStyles, {
styles: {
'@keyframes mui-auto-fill': {
from: {
display: 'block'
}
},
'@keyframes mui-auto-fill-cancel': {
from: {
display: 'block'
}
}
}
});
/**
* `InputBase` contains as few styles as possible.
* It aims to be a simple building block for creating an input.
* It contains a load of style reset and some state logic.
*/
const InputBase = /*#__PURE__*/reactExports.forwardRef(function InputBase(inProps, ref) {
var _slotProps$input;
const props = useThemeProps({
props: inProps,
name: 'MuiInputBase'
});
const {
'aria-describedby': ariaDescribedby,
autoComplete,
autoFocus,
className,
components = {},
componentsProps = {},
defaultValue,
disabled,
disableInjectingGlobalStyles,
endAdornment,
fullWidth = false,
id,
inputComponent = 'input',
inputProps: inputPropsProp = {},
inputRef: inputRefProp,
maxRows,
minRows,
multiline = false,
name,
onBlur,
onChange,
onClick,
onFocus,
onKeyDown,
onKeyUp,
placeholder,
readOnly,
renderSuffix,
rows,
slotProps = {},
slots = {},
startAdornment,
type = 'text',
value: valueProp
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$x);
const value = inputPropsProp.value != null ? inputPropsProp.value : valueProp;
const {
current: isControlled
} = reactExports.useRef(value != null);
const inputRef = reactExports.useRef();
const handleInputRefWarning = reactExports.useCallback(instance => {
}, []);
const handleInputRef = useForkRef(inputRef, inputRefProp, inputPropsProp.ref, handleInputRefWarning);
const [focused, setFocused] = reactExports.useState(false);
const muiFormControl = useFormControl();
const fcs = formControlState({
props,
muiFormControl,
states: ['color', 'disabled', 'error', 'hiddenLabel', 'size', 'required', 'filled']
});
fcs.focused = muiFormControl ? muiFormControl.focused : focused;
// The blur won't fire when the disabled state is set on a focused input.
// We need to book keep the focused state manually.
reactExports.useEffect(() => {
if (!muiFormControl && disabled && focused) {
setFocused(false);
if (onBlur) {
onBlur();
}
}
}, [muiFormControl, disabled, focused, onBlur]);
const onFilled = muiFormControl && muiFormControl.onFilled;
const onEmpty = muiFormControl && muiFormControl.onEmpty;
const checkDirty = reactExports.useCallback(obj => {
if (isFilled(obj)) {
if (onFilled) {
onFilled();
}
} else if (onEmpty) {
onEmpty();
}
}, [onFilled, onEmpty]);
useEnhancedEffect$1(() => {
if (isControlled) {
checkDirty({
value
});
}
}, [value, checkDirty, isControlled]);
const handleFocus = event => {
// Fix a bug with IE11 where the focus/blur events are triggered
// while the component is disabled.
if (fcs.disabled) {
event.stopPropagation();
return;
}
if (onFocus) {
onFocus(event);
}
if (inputPropsProp.onFocus) {
inputPropsProp.onFocus(event);
}
if (muiFormControl && muiFormControl.onFocus) {
muiFormControl.onFocus(event);
} else {
setFocused(true);
}
};
const handleBlur = event => {
if (onBlur) {
onBlur(event);
}
if (inputPropsProp.onBlur) {
inputPropsProp.onBlur(event);
}
if (muiFormControl && muiFormControl.onBlur) {
muiFormControl.onBlur(event);
} else {
setFocused(false);
}
};
const handleChange = (event, ...args) => {
if (!isControlled) {
const element = event.target || inputRef.current;
if (element == null) {
throw new Error(formatMuiErrorMessage(1));
}
checkDirty({
value: element.value
});
}
if (inputPropsProp.onChange) {
inputPropsProp.onChange(event, ...args);
}
// Perform in the willUpdate
if (onChange) {
onChange(event, ...args);
}
};
// Check the input state on mount, in case it was filled by the user
// or auto filled by the browser before the hydration (for SSR).
reactExports.useEffect(() => {
checkDirty(inputRef.current);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
const handleClick = event => {
if (inputRef.current && event.currentTarget === event.target) {
inputRef.current.focus();
}
if (onClick) {
onClick(event);
}
};
let InputComponent = inputComponent;
let inputProps = inputPropsProp;
if (multiline && InputComponent === 'input') {
if (rows) {
inputProps = _extends({
type: undefined,
minRows: rows,
maxRows: rows
}, inputProps);
} else {
inputProps = _extends({
type: undefined,
maxRows,
minRows
}, inputProps);
}
InputComponent = TextareaAutosize$1;
}
const handleAutoFill = event => {
// Provide a fake value as Chrome might not let you access it for security reasons.
checkDirty(event.animationName === 'mui-auto-fill-cancel' ? inputRef.current : {
value: 'x'
});
};
reactExports.useEffect(() => {
if (muiFormControl) {
muiFormControl.setAdornedStart(Boolean(startAdornment));
}
}, [muiFormControl, startAdornment]);
const ownerState = _extends({}, props, {
color: fcs.color || 'primary',
disabled: fcs.disabled,
endAdornment,
error: fcs.error,
focused: fcs.focused,
formControl: muiFormControl,
fullWidth,
hiddenLabel: fcs.hiddenLabel,
multiline,
size: fcs.size,
startAdornment,
type
});
const classes = useUtilityClasses$r(ownerState);
const Root = slots.root || components.Root || InputBaseRoot;
const rootProps = slotProps.root || componentsProps.root || {};
const Input = slots.input || components.Input || InputBaseComponent;
inputProps = _extends({}, inputProps, (_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input);
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/jsxs(Root, _extends({}, rootProps, !isHostComponent(Root) && {
ownerState: _extends({}, ownerState, rootProps.ownerState)
}, {
ref: ref,
onClick: handleClick
}, other, {
className: clsx(classes.root, rootProps.className, className),
children: [startAdornment, /*#__PURE__*/jsx(FormControlContext$1.Provider, {
value: null,
children: /*#__PURE__*/jsx(Input, _extends({
ownerState: ownerState,
"aria-invalid": fcs.error,
"aria-describedby": ariaDescribedby,
autoComplete: autoComplete,
autoFocus: autoFocus,
defaultValue: defaultValue,
disabled: fcs.disabled,
id: id,
onAnimationStart: handleAutoFill,
name: name,
placeholder: placeholder,
readOnly: readOnly,
required: fcs.required,
rows: rows,
value: value,
onKeyDown: onKeyDown,
onKeyUp: onKeyUp,
type: type
}, inputProps, !isHostComponent(Input) && {
as: InputComponent,
ownerState: _extends({}, ownerState, inputProps.ownerState)
}, {
ref: handleInputRef,
className: clsx(classes.input, inputProps.className),
onBlur: handleBlur,
onChange: handleChange,
onFocus: handleFocus
}))
}), endAdornment, renderSuffix ? renderSuffix(_extends({}, fcs, {
startAdornment
})) : null]
}))]
});
});
const InputBase$1 = InputBase;
function getInputUtilityClass(slot) {
return generateUtilityClass('MuiInput', slot);
}
const inputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiInput', ['root', 'underline', 'input']));
const inputClasses$1 = inputClasses;
function getOutlinedInputUtilityClass(slot) {
return generateUtilityClass('MuiOutlinedInput', slot);
}
const outlinedInputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiOutlinedInput', ['root', 'notchedOutline', 'input']));
const outlinedInputClasses$1 = outlinedInputClasses;
function getFilledInputUtilityClass(slot) {
return generateUtilityClass('MuiFilledInput', slot);
}
const filledInputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiFilledInput', ['root', 'underline', 'input']));
const filledInputClasses$1 = filledInputClasses;
const ArrowDropDownIcon = createSvgIcon$1( /*#__PURE__*/jsx("path", {
d: "M7 10l5 5 5-5z"
}), 'ArrowDropDown');
const _excluded$w = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
const styles$1 = {
entering: {
opacity: 1
},
entered: {
opacity: 1
}
};
/**
* The Fade transition is used by the [Modal](/material-ui/react-modal/) component.
* It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
*/
const Fade = /*#__PURE__*/reactExports.forwardRef(function Fade(props, ref) {
const theme = useTheme();
const defaultTimeout = {
enter: theme.transitions.duration.enteringScreen,
exit: theme.transitions.duration.leavingScreen
};
const {
addEndListener,
appear = true,
children,
easing,
in: inProp,
onEnter,
onEntered,
onEntering,
onExit,
onExited,
onExiting,
style,
timeout = defaultTimeout,
// eslint-disable-next-line react/prop-types
TransitionComponent = Transition$1
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$w);
const nodeRef = reactExports.useRef(null);
const handleRef = useForkRef(nodeRef, children.ref, ref);
const normalizedTransitionCallback = callback => maybeIsAppearing => {
if (callback) {
const node = nodeRef.current;
// onEnterXxx and onExitXxx callbacks have a different arguments.length value.
if (maybeIsAppearing === undefined) {
callback(node);
} else {
callback(node, maybeIsAppearing);
}
}
};
const handleEntering = normalizedTransitionCallback(onEntering);
const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
reflow(node); // So the animation always start from the start.
const transitionProps = getTransitionProps({
style,
timeout,
easing
}, {
mode: 'enter'
});
node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);
node.style.transition = theme.transitions.create('opacity', transitionProps);
if (onEnter) {
onEnter(node, isAppearing);
}
});
const handleEntered = normalizedTransitionCallback(onEntered);
const handleExiting = normalizedTransitionCallback(onExiting);
const handleExit = normalizedTransitionCallback(node => {
const transitionProps = getTransitionProps({
style,
timeout,
easing
}, {
mode: 'exit'
});
node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);
node.style.transition = theme.transitions.create('opacity', transitionProps);
if (onExit) {
onExit(node);
}
});
const handleExited = normalizedTransitionCallback(onExited);
const handleAddEndListener = next => {
if (addEndListener) {
// Old call signature before `react-transition-group` implemented `nodeRef`
addEndListener(nodeRef.current, next);
}
};
return /*#__PURE__*/jsx(TransitionComponent, _extends({
appear: appear,
in: inProp,
nodeRef: nodeRef ,
onEnter: handleEnter,
onEntered: handleEntered,
onEntering: handleEntering,
onExit: handleExit,
onExited: handleExited,
onExiting: handleExiting,
addEndListener: handleAddEndListener,
timeout: timeout
}, other, {
children: (state, childProps) => {
return /*#__PURE__*/reactExports.cloneElement(children, _extends({
style: _extends({
opacity: 0,
visibility: state === 'exited' && !inProp ? 'hidden' : undefined
}, styles$1[state], style, children.props.style),
ref: handleRef
}, childProps));
}
}));
});
const Fade$1 = Fade;
function getBackdropUtilityClass(slot) {
return generateUtilityClass('MuiBackdrop', slot);
}
generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);
const _excluded$v = ["children", "component", "components", "componentsProps", "className", "invisible", "open", "slotProps", "slots", "transitionDuration", "TransitionComponent"];
const useUtilityClasses$q = ownerState => {
const {
classes,
invisible
} = ownerState;
const slots = {
root: ['root', invisible && 'invisible']
};
return composeClasses(slots, getBackdropUtilityClass, classes);
};
const BackdropRoot = styled$1('div', {
name: 'MuiBackdrop',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.invisible && styles.invisible];
}
})(({
ownerState
}) => _extends({
position: 'fixed',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
right: 0,
bottom: 0,
top: 0,
left: 0,
backgroundColor: 'rgba(0, 0, 0, 0.5)',
WebkitTapHighlightColor: 'transparent'
}, ownerState.invisible && {
backgroundColor: 'transparent'
}));
const Backdrop = /*#__PURE__*/reactExports.forwardRef(function Backdrop(inProps, ref) {
var _slotProps$root, _ref, _slots$root;
const props = useThemeProps({
props: inProps,
name: 'MuiBackdrop'
});
const {
children,
component = 'div',
components = {},
componentsProps = {},
className,
invisible = false,
open,
slotProps = {},
slots = {},
transitionDuration,
// eslint-disable-next-line react/prop-types
TransitionComponent = Fade$1
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$v);
const ownerState = _extends({}, props, {
component,
invisible
});
const classes = useUtilityClasses$q(ownerState);
const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
return /*#__PURE__*/jsx(TransitionComponent, _extends({
in: open,
timeout: transitionDuration
}, other, {
children: /*#__PURE__*/jsx(BackdropRoot, _extends({
"aria-hidden": true
}, rootSlotProps, {
as: (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : component,
className: clsx(classes.root, className, rootSlotProps == null ? void 0 : rootSlotProps.className),
ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
classes: classes,
ref: ref,
children: children
}))
}));
});
const Backdrop$1 = Backdrop;
const shouldSpreadAdditionalProps = Slot => {
return !Slot || !isHostComponent(Slot);
};
const shouldSpreadAdditionalProps$1 = shouldSpreadAdditionalProps;
const defaultTheme = createTheme();
const Box = createBox({
defaultTheme,
defaultClassName: 'MuiBox-root',
generateClassName: ClassNameGenerator$1.generate
});
const Box$1 = Box;
function getButtonUtilityClass(slot) {
return generateUtilityClass('MuiButton', slot);
}
const buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);
const buttonClasses$1 = buttonClasses;
/**
* @ignore - internal component.
*/
const ButtonGroupContext = /*#__PURE__*/reactExports.createContext({});
const ButtonGroupContext$1 = ButtonGroupContext;
const _excluded$u = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"];
const useUtilityClasses$p = ownerState => {
const {
color,
disableElevation,
fullWidth,
size,
variant,
classes
} = ownerState;
const slots = {
root: ['root', variant, `${variant}${capitalize(color)}`, `size${capitalize(size)}`, `${variant}Size${capitalize(size)}`, color === 'inherit' && 'colorInherit', disableElevation && 'disableElevation', fullWidth && 'fullWidth'],
label: ['label'],
startIcon: ['startIcon', `iconSize${capitalize(size)}`],
endIcon: ['endIcon', `iconSize${capitalize(size)}`]
};
const composedClasses = composeClasses(slots, getButtonUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const commonIconStyles = ownerState => _extends({}, ownerState.size === 'small' && {
'& > *:nth-of-type(1)': {
fontSize: 18
}
}, ownerState.size === 'medium' && {
'& > *:nth-of-type(1)': {
fontSize: 20
}
}, ownerState.size === 'large' && {
'& > *:nth-of-type(1)': {
fontSize: 22
}
});
const ButtonRoot = styled$1(ButtonBase$1, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiButton',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color)}`], styles[`size${capitalize(ownerState.size)}`], styles[`${ownerState.variant}Size${capitalize(ownerState.size)}`], ownerState.color === 'inherit' && styles.colorInherit, ownerState.disableElevation && styles.disableElevation, ownerState.fullWidth && styles.fullWidth];
}
})(({
theme,
ownerState
}) => {
var _theme$palette$getCon, _theme$palette;
return _extends({}, theme.typography.button, {
minWidth: 64,
padding: '6px 16px',
borderRadius: (theme.vars || theme).shape.borderRadius,
transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color', 'color'], {
duration: theme.transitions.duration.short
}),
'&:hover': _extends({
textDecoration: 'none',
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
}, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
}, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
border: `1px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
}, ownerState.variant === 'contained' && {
backgroundColor: (theme.vars || theme).palette.grey.A100,
boxShadow: (theme.vars || theme).shadows[4],
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
boxShadow: (theme.vars || theme).shadows[2],
backgroundColor: (theme.vars || theme).palette.grey[300]
}
}, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
backgroundColor: (theme.vars || theme).palette[ownerState.color].dark,
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: (theme.vars || theme).palette[ownerState.color].main
}
}),
'&:active': _extends({}, ownerState.variant === 'contained' && {
boxShadow: (theme.vars || theme).shadows[8]
}),
[`&.${buttonClasses$1.focusVisible}`]: _extends({}, ownerState.variant === 'contained' && {
boxShadow: (theme.vars || theme).shadows[6]
}),
[`&.${buttonClasses$1.disabled}`]: _extends({
color: (theme.vars || theme).palette.action.disabled
}, ownerState.variant === 'outlined' && {
border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`
}, ownerState.variant === 'contained' && {
color: (theme.vars || theme).palette.action.disabled,
boxShadow: (theme.vars || theme).shadows[0],
backgroundColor: (theme.vars || theme).palette.action.disabledBackground
})
}, ownerState.variant === 'text' && {
padding: '6px 8px'
}, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
color: (theme.vars || theme).palette[ownerState.color].main
}, ownerState.variant === 'outlined' && {
padding: '5px 15px',
border: '1px solid currentColor'
}, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
color: (theme.vars || theme).palette[ownerState.color].main,
border: theme.vars ? `1px solid rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : `1px solid ${alpha(theme.palette[ownerState.color].main, 0.5)}`
}, ownerState.variant === 'contained' && {
color: theme.vars ?
// this is safe because grey does not change between default light/dark mode
theme.vars.palette.text.primary : (_theme$palette$getCon = (_theme$palette = theme.palette).getContrastText) == null ? void 0 : _theme$palette$getCon.call(_theme$palette, theme.palette.grey[300]),
backgroundColor: (theme.vars || theme).palette.grey[300],
boxShadow: (theme.vars || theme).shadows[2]
}, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
color: (theme.vars || theme).palette[ownerState.color].contrastText,
backgroundColor: (theme.vars || theme).palette[ownerState.color].main
}, ownerState.color === 'inherit' && {
color: 'inherit',
borderColor: 'currentColor'
}, ownerState.size === 'small' && ownerState.variant === 'text' && {
padding: '4px 5px',
fontSize: theme.typography.pxToRem(13)
}, ownerState.size === 'large' && ownerState.variant === 'text' && {
padding: '8px 11px',
fontSize: theme.typography.pxToRem(15)
}, ownerState.size === 'small' && ownerState.variant === 'outlined' && {
padding: '3px 9px',
fontSize: theme.typography.pxToRem(13)
}, ownerState.size === 'large' && ownerState.variant === 'outlined' && {
padding: '7px 21px',
fontSize: theme.typography.pxToRem(15)
}, ownerState.size === 'small' && ownerState.variant === 'contained' && {
padding: '4px 10px',
fontSize: theme.typography.pxToRem(13)
}, ownerState.size === 'large' && ownerState.variant === 'contained' && {
padding: '8px 22px',
fontSize: theme.typography.pxToRem(15)
}, ownerState.fullWidth && {
width: '100%'
});
}, ({
ownerState
}) => ownerState.disableElevation && {
boxShadow: 'none',
'&:hover': {
boxShadow: 'none'
},
[`&.${buttonClasses$1.focusVisible}`]: {
boxShadow: 'none'
},
'&:active': {
boxShadow: 'none'
},
[`&.${buttonClasses$1.disabled}`]: {
boxShadow: 'none'
}
});
const ButtonStartIcon = styled$1('span', {
name: 'MuiButton',
slot: 'StartIcon',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.startIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
}
})(({
ownerState
}) => _extends({
display: 'inherit',
marginRight: 8,
marginLeft: -4
}, ownerState.size === 'small' && {
marginLeft: -2
}, commonIconStyles(ownerState)));
const ButtonEndIcon = styled$1('span', {
name: 'MuiButton',
slot: 'EndIcon',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.endIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
}
})(({
ownerState
}) => _extends({
display: 'inherit',
marginRight: -4,
marginLeft: 8
}, ownerState.size === 'small' && {
marginRight: -2
}, commonIconStyles(ownerState)));
const Button = /*#__PURE__*/reactExports.forwardRef(function Button(inProps, ref) {
// props priority: `inProps` > `contextProps` > `themeDefaultProps`
const contextProps = reactExports.useContext(ButtonGroupContext$1);
const resolvedProps = resolveProps(contextProps, inProps);
const props = useThemeProps({
props: resolvedProps,
name: 'MuiButton'
});
const {
children,
color = 'primary',
component = 'button',
className,
disabled = false,
disableElevation = false,
disableFocusRipple = false,
endIcon: endIconProp,
focusVisibleClassName,
fullWidth = false,
size = 'medium',
startIcon: startIconProp,
type,
variant = 'text'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$u);
const ownerState = _extends({}, props, {
color,
component,
disabled,
disableElevation,
disableFocusRipple,
fullWidth,
size,
type,
variant
});
const classes = useUtilityClasses$p(ownerState);
const startIcon = startIconProp && /*#__PURE__*/jsx(ButtonStartIcon, {
className: classes.startIcon,
ownerState: ownerState,
children: startIconProp
});
const endIcon = endIconProp && /*#__PURE__*/jsx(ButtonEndIcon, {
className: classes.endIcon,
ownerState: ownerState,
children: endIconProp
});
return /*#__PURE__*/jsxs(ButtonRoot, _extends({
ownerState: ownerState,
className: clsx(contextProps.className, classes.root, className),
component: component,
disabled: disabled,
focusRipple: !disableFocusRipple,
focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
ref: ref,
type: type
}, other, {
classes: classes,
children: [startIcon, children, endIcon]
}));
});
const Button$1 = Button;
function getSwitchBaseUtilityClass(slot) {
return generateUtilityClass('PrivateSwitchBase', slot);
}
generateUtilityClasses('PrivateSwitchBase', ['root', 'checked', 'disabled', 'input', 'edgeStart', 'edgeEnd']);
const _excluded$t = ["autoFocus", "checked", "checkedIcon", "className", "defaultChecked", "disabled", "disableFocusRipple", "edge", "icon", "id", "inputProps", "inputRef", "name", "onBlur", "onChange", "onFocus", "readOnly", "required", "tabIndex", "type", "value"];
const useUtilityClasses$o = ownerState => {
const {
classes,
checked,
disabled,
edge
} = ownerState;
const slots = {
root: ['root', checked && 'checked', disabled && 'disabled', edge && `edge${capitalize(edge)}`],
input: ['input']
};
return composeClasses(slots, getSwitchBaseUtilityClass, classes);
};
const SwitchBaseRoot = styled$1(ButtonBase$1)(({
ownerState
}) => _extends({
padding: 9,
borderRadius: '50%'
}, ownerState.edge === 'start' && {
marginLeft: ownerState.size === 'small' ? -3 : -12
}, ownerState.edge === 'end' && {
marginRight: ownerState.size === 'small' ? -3 : -12
}));
const SwitchBaseInput = styled$1('input')({
cursor: 'inherit',
position: 'absolute',
opacity: 0,
width: '100%',
height: '100%',
top: 0,
left: 0,
margin: 0,
padding: 0,
zIndex: 1
});
/**
* @ignore - internal component.
*/
const SwitchBase = /*#__PURE__*/reactExports.forwardRef(function SwitchBase(props, ref) {
const {
autoFocus,
checked: checkedProp,
checkedIcon,
className,
defaultChecked,
disabled: disabledProp,
disableFocusRipple = false,
edge = false,
icon,
id,
inputProps,
inputRef,
name,
onBlur,
onChange,
onFocus,
readOnly,
required = false,
tabIndex,
type,
value
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$t);
const [checked, setCheckedState] = useControlled({
controlled: checkedProp,
default: Boolean(defaultChecked),
name: 'SwitchBase',
state: 'checked'
});
const muiFormControl = useFormControl();
const handleFocus = event => {
if (onFocus) {
onFocus(event);
}
if (muiFormControl && muiFormControl.onFocus) {
muiFormControl.onFocus(event);
}
};
const handleBlur = event => {
if (onBlur) {
onBlur(event);
}
if (muiFormControl && muiFormControl.onBlur) {
muiFormControl.onBlur(event);
}
};
const handleInputChange = event => {
// Workaround for https://github.com/facebook/react/issues/9023
if (event.nativeEvent.defaultPrevented) {
return;
}
const newChecked = event.target.checked;
setCheckedState(newChecked);
if (onChange) {
// TODO v6: remove the second argument.
onChange(event, newChecked);
}
};
let disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
const hasLabelFor = type === 'checkbox' || type === 'radio';
const ownerState = _extends({}, props, {
checked,
disabled,
disableFocusRipple,
edge
});
const classes = useUtilityClasses$o(ownerState);
return /*#__PURE__*/jsxs(SwitchBaseRoot, _extends({
component: "span",
className: clsx(classes.root, className),
centerRipple: true,
focusRipple: !disableFocusRipple,
disabled: disabled,
tabIndex: null,
role: undefined,
onFocus: handleFocus,
onBlur: handleBlur,
ownerState: ownerState,
ref: ref
}, other, {
children: [/*#__PURE__*/jsx(SwitchBaseInput, _extends({
autoFocus: autoFocus,
checked: checkedProp,
defaultChecked: defaultChecked,
className: classes.input,
disabled: disabled,
id: hasLabelFor && id,
name: name,
onChange: handleInputChange,
readOnly: readOnly,
ref: inputRef,
required: required,
ownerState: ownerState,
tabIndex: tabIndex,
type: type
}, type === 'checkbox' && value === undefined ? {} : {
value
}, inputProps)), checked ? checkedIcon : icon]
}));
});
const SwitchBase$1 = SwitchBase;
const CheckBoxOutlineBlankIcon = createSvgIcon$1( /*#__PURE__*/jsx("path", {
d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
}), 'CheckBoxOutlineBlank');
const CheckBoxIcon = createSvgIcon$1( /*#__PURE__*/jsx("path", {
d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
}), 'CheckBox');
const IndeterminateCheckBoxIcon = createSvgIcon$1( /*#__PURE__*/jsx("path", {
d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z"
}), 'IndeterminateCheckBox');
function getCheckboxUtilityClass(slot) {
return generateUtilityClass('MuiCheckbox', slot);
}
const checkboxClasses = generateUtilityClasses('MuiCheckbox', ['root', 'checked', 'disabled', 'indeterminate', 'colorPrimary', 'colorSecondary']);
const checkboxClasses$1 = checkboxClasses;
const _excluded$s = ["checkedIcon", "color", "icon", "indeterminate", "indeterminateIcon", "inputProps", "size", "className"];
const useUtilityClasses$n = ownerState => {
const {
classes,
indeterminate,
color
} = ownerState;
const slots = {
root: ['root', indeterminate && 'indeterminate', `color${capitalize(color)}`]
};
const composedClasses = composeClasses(slots, getCheckboxUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const CheckboxRoot = styled$1(SwitchBase$1, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiCheckbox',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.indeterminate && styles.indeterminate, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`]];
}
})(({
theme,
ownerState
}) => _extends({
color: (theme.vars || theme).palette.text.secondary
}, !ownerState.disableRipple && {
'&:hover': {
backgroundColor: theme.vars ? `rgba(${ownerState.color === 'default' ? theme.vars.palette.action.activeChannel : theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(ownerState.color === 'default' ? theme.palette.action.active : theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
}
}, ownerState.color !== 'default' && {
[`&.${checkboxClasses$1.checked}, &.${checkboxClasses$1.indeterminate}`]: {
color: (theme.vars || theme).palette[ownerState.color].main
},
[`&.${checkboxClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.action.disabled
}
}));
const defaultCheckedIcon = /*#__PURE__*/jsx(CheckBoxIcon, {});
const defaultIcon = /*#__PURE__*/jsx(CheckBoxOutlineBlankIcon, {});
const defaultIndeterminateIcon = /*#__PURE__*/jsx(IndeterminateCheckBoxIcon, {});
const Checkbox = /*#__PURE__*/reactExports.forwardRef(function Checkbox(inProps, ref) {
var _icon$props$fontSize, _indeterminateIcon$pr;
const props = useThemeProps({
props: inProps,
name: 'MuiCheckbox'
});
const {
checkedIcon = defaultCheckedIcon,
color = 'primary',
icon: iconProp = defaultIcon,
indeterminate = false,
indeterminateIcon: indeterminateIconProp = defaultIndeterminateIcon,
inputProps,
size = 'medium',
className
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$s);
const icon = indeterminate ? indeterminateIconProp : iconProp;
const indeterminateIcon = indeterminate ? indeterminateIconProp : checkedIcon;
const ownerState = _extends({}, props, {
color,
indeterminate,
size
});
const classes = useUtilityClasses$n(ownerState);
return /*#__PURE__*/jsx(CheckboxRoot, _extends({
type: "checkbox",
inputProps: _extends({
'data-indeterminate': indeterminate
}, inputProps),
icon: /*#__PURE__*/reactExports.cloneElement(icon, {
fontSize: (_icon$props$fontSize = icon.props.fontSize) != null ? _icon$props$fontSize : size
}),
checkedIcon: /*#__PURE__*/reactExports.cloneElement(indeterminateIcon, {
fontSize: (_indeterminateIcon$pr = indeterminateIcon.props.fontSize) != null ? _indeterminateIcon$pr : size
}),
ownerState: ownerState,
ref: ref,
className: clsx(classes.root, className)
}, other, {
classes: classes
}));
});
const Checkbox$1 = Checkbox;
const html = (theme, enableColorScheme) => _extends({
WebkitFontSmoothing: 'antialiased',
// Antialiasing.
MozOsxFontSmoothing: 'grayscale',
// Antialiasing.
// Change from `box-sizing: content-box` so that `width`
// is not affected by `padding` or `border`.
boxSizing: 'border-box',
// Fix font resize problem in iOS
WebkitTextSizeAdjust: '100%'
}, enableColorScheme && !theme.vars && {
colorScheme: theme.palette.mode
});
const body = theme => _extends({
color: (theme.vars || theme).palette.text.primary
}, theme.typography.body1, {
backgroundColor: (theme.vars || theme).palette.background.default,
'@media print': {
// Save printer ink.
backgroundColor: (theme.vars || theme).palette.common.white
}
});
const _excluded$r = ["BackdropComponent", "BackdropProps", "closeAfterTransition", "children", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "slotProps", "slots", "theme"];
const extendUtilityClasses = ownerState => {
return ownerState.classes;
};
const ModalRoot = styled$1('div', {
name: 'MuiModal',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, !ownerState.open && ownerState.exited && styles.hidden];
}
})(({
theme,
ownerState
}) => _extends({
position: 'fixed',
zIndex: (theme.vars || theme).zIndex.modal,
right: 0,
bottom: 0,
top: 0,
left: 0
}, !ownerState.open && ownerState.exited && {
visibility: 'hidden'
}));
const ModalBackdrop = styled$1(Backdrop$1, {
name: 'MuiModal',
slot: 'Backdrop',
overridesResolver: (props, styles) => {
return styles.backdrop;
}
})({
zIndex: -1
});
/**
* Modal is a lower-level construct that is leveraged by the following components:
*
* - [Dialog](/material-ui/api/dialog/)
* - [Drawer](/material-ui/api/drawer/)
* - [Menu](/material-ui/api/menu/)
* - [Popover](/material-ui/api/popover/)
*
* If you are creating a modal dialog, you probably want to use the [Dialog](/material-ui/api/dialog/) component
* rather than directly using Modal.
*
* This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals).
*/
const Modal = /*#__PURE__*/reactExports.forwardRef(function Modal(inProps, ref) {
var _ref, _slots$root, _ref2, _slots$backdrop, _slotProps$root, _slotProps$backdrop;
const props = useThemeProps({
name: 'MuiModal',
props: inProps
});
const {
BackdropComponent = ModalBackdrop,
BackdropProps,
closeAfterTransition = false,
children,
component,
components = {},
componentsProps = {},
disableAutoFocus = false,
disableEnforceFocus = false,
disableEscapeKeyDown = false,
disablePortal = false,
disableRestoreFocus = false,
disableScrollLock = false,
hideBackdrop = false,
keepMounted = false,
slotProps,
slots,
// eslint-disable-next-line react/prop-types
theme
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$r);
const [exited, setExited] = reactExports.useState(true);
const commonProps = {
closeAfterTransition,
disableAutoFocus,
disableEnforceFocus,
disableEscapeKeyDown,
disablePortal,
disableRestoreFocus,
disableScrollLock,
hideBackdrop,
keepMounted
};
const ownerState = _extends({}, props, commonProps, {
exited
});
const classes = extendUtilityClasses(ownerState);
const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : ModalRoot;
const BackdropSlot = (_ref2 = (_slots$backdrop = slots == null ? void 0 : slots.backdrop) != null ? _slots$backdrop : components.Backdrop) != null ? _ref2 : BackdropComponent;
const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
const backdropSlotProps = (_slotProps$backdrop = slotProps == null ? void 0 : slotProps.backdrop) != null ? _slotProps$backdrop : componentsProps.backdrop;
return /*#__PURE__*/jsx(ModalUnstyled$1, _extends({
slots: {
root: RootSlot,
backdrop: BackdropSlot
},
slotProps: {
root: () => _extends({}, resolveComponentProps(rootSlotProps, ownerState), !isHostComponent(RootSlot) && {
as: component,
theme
}),
backdrop: () => _extends({}, BackdropProps, resolveComponentProps(backdropSlotProps, ownerState))
},
onTransitionEnter: () => setExited(false),
onTransitionExited: () => setExited(true),
ref: ref
}, other, {
classes: classes
}, commonProps, {
children: children
}));
});
const Modal$1 = Modal;
function getDialogUtilityClass(slot) {
return generateUtilityClass('MuiDialog', slot);
}
const dialogClasses = generateUtilityClasses('MuiDialog', ['root', 'scrollPaper', 'scrollBody', 'container', 'paper', 'paperScrollPaper', 'paperScrollBody', 'paperWidthFalse', 'paperWidthXs', 'paperWidthSm', 'paperWidthMd', 'paperWidthLg', 'paperWidthXl', 'paperFullWidth', 'paperFullScreen']);
const dialogClasses$1 = dialogClasses;
const DialogContext = /*#__PURE__*/reactExports.createContext({});
const DialogContext$1 = DialogContext;
const _excluded$q = ["aria-describedby", "aria-labelledby", "BackdropComponent", "BackdropProps", "children", "className", "disableEscapeKeyDown", "fullScreen", "fullWidth", "maxWidth", "onBackdropClick", "onClose", "open", "PaperComponent", "PaperProps", "scroll", "TransitionComponent", "transitionDuration", "TransitionProps"];
const DialogBackdrop = styled$1(Backdrop$1, {
name: 'MuiDialog',
slot: 'Backdrop',
overrides: (props, styles) => styles.backdrop
})({
// Improve scrollable dialog support.
zIndex: -1
});
const useUtilityClasses$m = ownerState => {
const {
classes,
scroll,
maxWidth,
fullWidth,
fullScreen
} = ownerState;
const slots = {
root: ['root'],
container: ['container', `scroll${capitalize(scroll)}`],
paper: ['paper', `paperScroll${capitalize(scroll)}`, `paperWidth${capitalize(String(maxWidth))}`, fullWidth && 'paperFullWidth', fullScreen && 'paperFullScreen']
};
return composeClasses(slots, getDialogUtilityClass, classes);
};
const DialogRoot = styled$1(Modal$1, {
name: 'MuiDialog',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({
'@media print': {
// Use !important to override the Modal inline-style.
position: 'absolute !important'
}
});
const DialogContainer = styled$1('div', {
name: 'MuiDialog',
slot: 'Container',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.container, styles[`scroll${capitalize(ownerState.scroll)}`]];
}
})(({
ownerState
}) => _extends({
height: '100%',
'@media print': {
height: 'auto'
},
// We disable the focus ring for mouse, touch and keyboard users.
outline: 0
}, ownerState.scroll === 'paper' && {
display: 'flex',
justifyContent: 'center',
alignItems: 'center'
}, ownerState.scroll === 'body' && {
overflowY: 'auto',
overflowX: 'hidden',
textAlign: 'center',
'&:after': {
content: '""',
display: 'inline-block',
verticalAlign: 'middle',
height: '100%',
width: '0'
}
}));
const DialogPaper = styled$1(Paper$1, {
name: 'MuiDialog',
slot: 'Paper',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.paper, styles[`scrollPaper${capitalize(ownerState.scroll)}`], styles[`paperWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fullWidth && styles.paperFullWidth, ownerState.fullScreen && styles.paperFullScreen];
}
})(({
theme,
ownerState
}) => _extends({
margin: 32,
position: 'relative',
overflowY: 'auto',
// Fix IE11 issue, to remove at some point.
'@media print': {
overflowY: 'visible',
boxShadow: 'none'
}
}, ownerState.scroll === 'paper' && {
display: 'flex',
flexDirection: 'column',
maxHeight: 'calc(100% - 64px)'
}, ownerState.scroll === 'body' && {
display: 'inline-block',
verticalAlign: 'middle',
textAlign: 'left' // 'initial' doesn't work on IE11
}, !ownerState.maxWidth && {
maxWidth: 'calc(100% - 64px)'
}, ownerState.maxWidth === 'xs' && {
maxWidth: theme.breakpoints.unit === 'px' ? Math.max(theme.breakpoints.values.xs, 444) : `${theme.breakpoints.values.xs}${theme.breakpoints.unit}`,
[`&.${dialogClasses$1.paperScrollBody}`]: {
[theme.breakpoints.down(Math.max(theme.breakpoints.values.xs, 444) + 32 * 2)]: {
maxWidth: 'calc(100% - 64px)'
}
}
}, ownerState.maxWidth && ownerState.maxWidth !== 'xs' && {
maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`,
[`&.${dialogClasses$1.paperScrollBody}`]: {
[theme.breakpoints.down(theme.breakpoints.values[ownerState.maxWidth] + 32 * 2)]: {
maxWidth: 'calc(100% - 64px)'
}
}
}, ownerState.fullWidth && {
width: 'calc(100% - 64px)'
}, ownerState.fullScreen && {
margin: 0,
width: '100%',
maxWidth: '100%',
height: '100%',
maxHeight: 'none',
borderRadius: 0,
[`&.${dialogClasses$1.paperScrollBody}`]: {
margin: 0,
maxWidth: '100%'
}
}));
/**
* Dialogs are overlaid modal paper based components with a backdrop.
*/
const Dialog = /*#__PURE__*/reactExports.forwardRef(function Dialog(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiDialog'
});
const theme = useTheme();
const defaultTransitionDuration = {
enter: theme.transitions.duration.enteringScreen,
exit: theme.transitions.duration.leavingScreen
};
const {
'aria-describedby': ariaDescribedby,
'aria-labelledby': ariaLabelledbyProp,
BackdropComponent,
BackdropProps,
children,
className,
disableEscapeKeyDown = false,
fullScreen = false,
fullWidth = false,
maxWidth = 'sm',
onBackdropClick,
onClose,
open,
PaperComponent = Paper$1,
PaperProps = {},
scroll = 'paper',
TransitionComponent = Fade$1,
transitionDuration = defaultTransitionDuration,
TransitionProps
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$q);
const ownerState = _extends({}, props, {
disableEscapeKeyDown,
fullScreen,
fullWidth,
maxWidth,
scroll
});
const classes = useUtilityClasses$m(ownerState);
const backdropClick = reactExports.useRef();
const handleMouseDown = event => {
// We don't want to close the dialog when clicking the dialog content.
// Make sure the event starts and ends on the same DOM element.
backdropClick.current = event.target === event.currentTarget;
};
const handleBackdropClick = event => {
// Ignore the events not coming from the "backdrop".
if (!backdropClick.current) {
return;
}
backdropClick.current = null;
if (onBackdropClick) {
onBackdropClick(event);
}
if (onClose) {
onClose(event, 'backdropClick');
}
};
const ariaLabelledby = useId(ariaLabelledbyProp);
const dialogContextValue = reactExports.useMemo(() => {
return {
titleId: ariaLabelledby
};
}, [ariaLabelledby]);
return /*#__PURE__*/jsx(DialogRoot, _extends({
className: clsx(classes.root, className),
closeAfterTransition: true,
components: {
Backdrop: DialogBackdrop
},
componentsProps: {
backdrop: _extends({
transitionDuration,
as: BackdropComponent
}, BackdropProps)
},
disableEscapeKeyDown: disableEscapeKeyDown,
onClose: onClose,
open: open,
ref: ref,
onClick: handleBackdropClick,
ownerState: ownerState
}, other, {
children: /*#__PURE__*/jsx(TransitionComponent, _extends({
appear: true,
in: open,
timeout: transitionDuration,
role: "presentation"
}, TransitionProps, {
children: /*#__PURE__*/jsx(DialogContainer, {
className: clsx(classes.container),
onMouseDown: handleMouseDown,
ownerState: ownerState,
children: /*#__PURE__*/jsx(DialogPaper, _extends({
as: PaperComponent,
elevation: 24,
role: "dialog",
"aria-describedby": ariaDescribedby,
"aria-labelledby": ariaLabelledby
}, PaperProps, {
className: clsx(classes.paper, PaperProps.className),
ownerState: ownerState,
children: /*#__PURE__*/jsx(DialogContext$1.Provider, {
value: dialogContextValue,
children: children
})
}))
})
}))
}));
});
const Dialog$1 = Dialog;
function getDialogActionsUtilityClass(slot) {
return generateUtilityClass('MuiDialogActions', slot);
}
generateUtilityClasses('MuiDialogActions', ['root', 'spacing']);
const _excluded$p = ["className", "disableSpacing"];
const useUtilityClasses$l = ownerState => {
const {
classes,
disableSpacing
} = ownerState;
const slots = {
root: ['root', !disableSpacing && 'spacing']
};
return composeClasses(slots, getDialogActionsUtilityClass, classes);
};
const DialogActionsRoot = styled$1('div', {
name: 'MuiDialogActions',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, !ownerState.disableSpacing && styles.spacing];
}
})(({
ownerState
}) => _extends({
display: 'flex',
alignItems: 'center',
padding: 8,
justifyContent: 'flex-end',
flex: '0 0 auto'
}, !ownerState.disableSpacing && {
'& > :not(:first-of-type)': {
marginLeft: 8
}
}));
const DialogActions = /*#__PURE__*/reactExports.forwardRef(function DialogActions(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiDialogActions'
});
const {
className,
disableSpacing = false
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$p);
const ownerState = _extends({}, props, {
disableSpacing
});
const classes = useUtilityClasses$l(ownerState);
return /*#__PURE__*/jsx(DialogActionsRoot, _extends({
className: clsx(classes.root, className),
ownerState: ownerState,
ref: ref
}, other));
});
const DialogActions$1 = DialogActions;
function getDialogContentUtilityClass(slot) {
return generateUtilityClass('MuiDialogContent', slot);
}
generateUtilityClasses('MuiDialogContent', ['root', 'dividers']);
function getDialogTitleUtilityClass(slot) {
return generateUtilityClass('MuiDialogTitle', slot);
}
const dialogTitleClasses = generateUtilityClasses('MuiDialogTitle', ['root']);
const dialogTitleClasses$1 = dialogTitleClasses;
const _excluded$o = ["className", "dividers"];
const useUtilityClasses$k = ownerState => {
const {
classes,
dividers
} = ownerState;
const slots = {
root: ['root', dividers && 'dividers']
};
return composeClasses(slots, getDialogContentUtilityClass, classes);
};
const DialogContentRoot = styled$1('div', {
name: 'MuiDialogContent',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.dividers && styles.dividers];
}
})(({
theme,
ownerState
}) => _extends({
flex: '1 1 auto',
// Add iOS momentum scrolling for iOS < 13.0
WebkitOverflowScrolling: 'touch',
overflowY: 'auto',
padding: '20px 24px'
}, ownerState.dividers ? {
padding: '16px 24px',
borderTop: `1px solid ${(theme.vars || theme).palette.divider}`,
borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`
} : {
[`.${dialogTitleClasses$1.root} + &`]: {
paddingTop: 0
}
}));
const DialogContent = /*#__PURE__*/reactExports.forwardRef(function DialogContent(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiDialogContent'
});
const {
className,
dividers = false
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$o);
const ownerState = _extends({}, props, {
dividers
});
const classes = useUtilityClasses$k(ownerState);
return /*#__PURE__*/jsx(DialogContentRoot, _extends({
className: clsx(classes.root, className),
ownerState: ownerState,
ref: ref
}, other));
});
const DialogContent$1 = DialogContent;
const _excluded$n = ["className", "id"];
const useUtilityClasses$j = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root']
};
return composeClasses(slots, getDialogTitleUtilityClass, classes);
};
const DialogTitleRoot = styled$1(Typography$1, {
name: 'MuiDialogTitle',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({
padding: '16px 24px',
flex: '0 0 auto'
});
const DialogTitle = /*#__PURE__*/reactExports.forwardRef(function DialogTitle(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiDialogTitle'
});
const {
className,
id: idProp
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$n);
const ownerState = props;
const classes = useUtilityClasses$j(ownerState);
const {
titleId: id = idProp
} = reactExports.useContext(DialogContext$1);
return /*#__PURE__*/jsx(DialogTitleRoot, _extends({
component: "h2",
className: clsx(classes.root, className),
ownerState: ownerState,
ref: ref,
variant: "h6",
id: id
}, other));
});
const DialogTitle$1 = DialogTitle;
const dividerClasses = generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
const dividerClasses$1 = dividerClasses;
const _excluded$m = ["disableUnderline", "components", "componentsProps", "fullWidth", "hiddenLabel", "inputComponent", "multiline", "slotProps", "slots", "type"];
const useUtilityClasses$i = ownerState => {
const {
classes,
disableUnderline
} = ownerState;
const slots = {
root: ['root', !disableUnderline && 'underline'],
input: ['input']
};
const composedClasses = composeClasses(slots, getFilledInputUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const FilledInputRoot = styled$1(InputBaseRoot, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiFilledInput',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [...rootOverridesResolver(props, styles), !ownerState.disableUnderline && styles.underline];
}
})(({
theme,
ownerState
}) => {
var _palette;
const light = theme.palette.mode === 'light';
const bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';
const backgroundColor = light ? 'rgba(0, 0, 0, 0.06)' : 'rgba(255, 255, 255, 0.09)';
const hoverBackground = light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.13)';
const disabledBackground = light ? 'rgba(0, 0, 0, 0.12)' : 'rgba(255, 255, 255, 0.12)';
return _extends({
position: 'relative',
backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor,
borderTopLeftRadius: (theme.vars || theme).shape.borderRadius,
borderTopRightRadius: (theme.vars || theme).shape.borderRadius,
transition: theme.transitions.create('background-color', {
duration: theme.transitions.duration.shorter,
easing: theme.transitions.easing.easeOut
}),
'&:hover': {
backgroundColor: theme.vars ? theme.vars.palette.FilledInput.hoverBg : hoverBackground,
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor
}
},
[`&.${filledInputClasses$1.focused}`]: {
backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor
},
[`&.${filledInputClasses$1.disabled}`]: {
backgroundColor: theme.vars ? theme.vars.palette.FilledInput.disabledBg : disabledBackground
}
}, !ownerState.disableUnderline && {
'&:after': {
borderBottom: `2px solid ${(_palette = (theme.vars || theme).palette[ownerState.color || 'primary']) == null ? void 0 : _palette.main}`,
left: 0,
bottom: 0,
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
content: '""',
position: 'absolute',
right: 0,
transform: 'scaleX(0)',
transition: theme.transitions.create('transform', {
duration: theme.transitions.duration.shorter,
easing: theme.transitions.easing.easeOut
}),
pointerEvents: 'none' // Transparent to the hover style.
},
[`&.${filledInputClasses$1.focused}:after`]: {
// translateX(0) is a workaround for Safari transform scale bug
// See https://github.com/mui/material-ui/issues/31766
transform: 'scaleX(1) translateX(0)'
},
[`&.${filledInputClasses$1.error}`]: {
'&:before, &:after': {
borderBottomColor: (theme.vars || theme).palette.error.main
}
},
'&:before': {
borderBottom: `1px solid ${theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})` : bottomLineColor}`,
left: 0,
bottom: 0,
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
content: '"\\00a0"',
position: 'absolute',
right: 0,
transition: theme.transitions.create('border-bottom-color', {
duration: theme.transitions.duration.shorter
}),
pointerEvents: 'none' // Transparent to the hover style.
},
[`&:hover:not(.${filledInputClasses$1.disabled}, .${filledInputClasses$1.error}):before`]: {
borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`
},
[`&.${filledInputClasses$1.disabled}:before`]: {
borderBottomStyle: 'dotted'
}
}, ownerState.startAdornment && {
paddingLeft: 12
}, ownerState.endAdornment && {
paddingRight: 12
}, ownerState.multiline && _extends({
padding: '25px 12px 8px'
}, ownerState.size === 'small' && {
paddingTop: 21,
paddingBottom: 4
}, ownerState.hiddenLabel && {
paddingTop: 16,
paddingBottom: 17
}));
});
const FilledInputInput = styled$1(InputBaseComponent, {
name: 'MuiFilledInput',
slot: 'Input',
overridesResolver: inputOverridesResolver
})(({
theme,
ownerState
}) => _extends({
paddingTop: 25,
paddingRight: 12,
paddingBottom: 8,
paddingLeft: 12
}, !theme.vars && {
'&:-webkit-autofill': {
WebkitBoxShadow: theme.palette.mode === 'light' ? null : '0 0 0 100px #266798 inset',
WebkitTextFillColor: theme.palette.mode === 'light' ? null : '#fff',
caretColor: theme.palette.mode === 'light' ? null : '#fff',
borderTopLeftRadius: 'inherit',
borderTopRightRadius: 'inherit'
}
}, theme.vars && {
'&:-webkit-autofill': {
borderTopLeftRadius: 'inherit',
borderTopRightRadius: 'inherit'
},
[theme.getColorSchemeSelector('dark')]: {
'&:-webkit-autofill': {
WebkitBoxShadow: '0 0 0 100px #266798 inset',
WebkitTextFillColor: '#fff',
caretColor: '#fff'
}
}
}, ownerState.size === 'small' && {
paddingTop: 21,
paddingBottom: 4
}, ownerState.hiddenLabel && {
paddingTop: 16,
paddingBottom: 17
}, ownerState.multiline && {
paddingTop: 0,
paddingBottom: 0,
paddingLeft: 0,
paddingRight: 0
}, ownerState.startAdornment && {
paddingLeft: 0
}, ownerState.endAdornment && {
paddingRight: 0
}, ownerState.hiddenLabel && ownerState.size === 'small' && {
paddingTop: 8,
paddingBottom: 9
}));
const FilledInput = /*#__PURE__*/reactExports.forwardRef(function FilledInput(inProps, ref) {
var _ref, _slots$root, _ref2, _slots$input;
const props = useThemeProps({
props: inProps,
name: 'MuiFilledInput'
});
const {
components = {},
componentsProps: componentsPropsProp,
fullWidth = false,
// declare here to prevent spreading to DOM
inputComponent = 'input',
multiline = false,
slotProps,
slots = {},
type = 'text'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$m);
const ownerState = _extends({}, props, {
fullWidth,
inputComponent,
multiline,
type
});
const classes = useUtilityClasses$i(props);
const filledInputComponentsProps = {
root: {
ownerState
},
input: {
ownerState
}
};
const componentsProps = (slotProps != null ? slotProps : componentsPropsProp) ? deepmerge(slotProps != null ? slotProps : componentsPropsProp, filledInputComponentsProps) : filledInputComponentsProps;
const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : FilledInputRoot;
const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : FilledInputInput;
return /*#__PURE__*/jsx(InputBase$1, _extends({
slots: {
root: RootSlot,
input: InputSlot
},
componentsProps: componentsProps,
fullWidth: fullWidth,
inputComponent: inputComponent,
multiline: multiline,
ref: ref,
type: type
}, other, {
classes: classes
}));
});
FilledInput.muiName = 'Input';
const FilledInput$1 = FilledInput;
function getFormControlUtilityClasses(slot) {
return generateUtilityClass('MuiFormControl', slot);
}
generateUtilityClasses('MuiFormControl', ['root', 'marginNone', 'marginNormal', 'marginDense', 'fullWidth', 'disabled']);
const _excluded$l = ["children", "className", "color", "component", "disabled", "error", "focused", "fullWidth", "hiddenLabel", "margin", "required", "size", "variant"];
const useUtilityClasses$h = ownerState => {
const {
classes,
margin,
fullWidth
} = ownerState;
const slots = {
root: ['root', margin !== 'none' && `margin${capitalize(margin)}`, fullWidth && 'fullWidth']
};
return composeClasses(slots, getFormControlUtilityClasses, classes);
};
const FormControlRoot = styled$1('div', {
name: 'MuiFormControl',
slot: 'Root',
overridesResolver: ({
ownerState
}, styles) => {
return _extends({}, styles.root, styles[`margin${capitalize(ownerState.margin)}`], ownerState.fullWidth && styles.fullWidth);
}
})(({
ownerState
}) => _extends({
display: 'inline-flex',
flexDirection: 'column',
position: 'relative',
// Reset fieldset default style.
minWidth: 0,
padding: 0,
margin: 0,
border: 0,
verticalAlign: 'top'
}, ownerState.margin === 'normal' && {
marginTop: 16,
marginBottom: 8
}, ownerState.margin === 'dense' && {
marginTop: 8,
marginBottom: 4
}, ownerState.fullWidth && {
width: '100%'
}));
/**
* Provides context such as filled/focused/error/required for form inputs.
* Relying on the context provides high flexibility and ensures that the state always stays
* consistent across the children of the `FormControl`.
* This context is used by the following components:
*
* - FormLabel
* - FormHelperText
* - Input
* - InputLabel
*
* You can find one composition example below and more going to [the demos](/material-ui/react-text-field/#components).
*
* ```jsx
* <FormControl>
* <InputLabel htmlFor="my-input">Email address</InputLabel>
* <Input id="my-input" aria-describedby="my-helper-text" />
* <FormHelperText id="my-helper-text">We'll never share your email.</FormHelperText>
* </FormControl>
* ```
*
* ⚠️ Only one `InputBase` can be used within a FormControl because it creates visual inconsistencies.
* For instance, only one input can be focused at the same time, the state shouldn't be shared.
*/
const FormControl = /*#__PURE__*/reactExports.forwardRef(function FormControl(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiFormControl'
});
const {
children,
className,
color = 'primary',
component = 'div',
disabled = false,
error = false,
focused: visuallyFocused,
fullWidth = false,
hiddenLabel = false,
margin = 'none',
required = false,
size = 'medium',
variant = 'outlined'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$l);
const ownerState = _extends({}, props, {
color,
component,
disabled,
error,
fullWidth,
hiddenLabel,
margin,
required,
size,
variant
});
const classes = useUtilityClasses$h(ownerState);
const [adornedStart, setAdornedStart] = reactExports.useState(() => {
// We need to iterate through the children and find the Input in order
// to fully support server-side rendering.
let initialAdornedStart = false;
if (children) {
reactExports.Children.forEach(children, child => {
if (!isMuiElement(child, ['Input', 'Select'])) {
return;
}
const input = isMuiElement(child, ['Select']) ? child.props.input : child;
if (input && isAdornedStart(input.props)) {
initialAdornedStart = true;
}
});
}
return initialAdornedStart;
});
const [filled, setFilled] = reactExports.useState(() => {
// We need to iterate through the children and find the Input in order
// to fully support server-side rendering.
let initialFilled = false;
if (children) {
reactExports.Children.forEach(children, child => {
if (!isMuiElement(child, ['Input', 'Select'])) {
return;
}
if (isFilled(child.props, true)) {
initialFilled = true;
}
});
}
return initialFilled;
});
const [focusedState, setFocused] = reactExports.useState(false);
if (disabled && focusedState) {
setFocused(false);
}
const focused = visuallyFocused !== undefined && !disabled ? visuallyFocused : focusedState;
let registerEffect;
const childContext = reactExports.useMemo(() => {
return {
adornedStart,
setAdornedStart,
color,
disabled,
error,
filled,
focused,
fullWidth,
hiddenLabel,
size,
onBlur: () => {
setFocused(false);
},
onEmpty: () => {
setFilled(false);
},
onFilled: () => {
setFilled(true);
},
onFocus: () => {
setFocused(true);
},
registerEffect,
required,
variant
};
}, [adornedStart, color, disabled, error, filled, focused, fullWidth, hiddenLabel, registerEffect, required, size, variant]);
return /*#__PURE__*/jsx(FormControlContext$1.Provider, {
value: childContext,
children: /*#__PURE__*/jsx(FormControlRoot, _extends({
as: component,
ownerState: ownerState,
className: clsx(classes.root, className),
ref: ref
}, other, {
children: children
}))
});
});
const FormControl$1 = FormControl;
function getFormControlLabelUtilityClasses(slot) {
return generateUtilityClass('MuiFormControlLabel', slot);
}
const formControlLabelClasses = generateUtilityClasses('MuiFormControlLabel', ['root', 'labelPlacementStart', 'labelPlacementTop', 'labelPlacementBottom', 'disabled', 'label', 'error']);
const formControlLabelClasses$1 = formControlLabelClasses;
const _excluded$k = ["checked", "className", "componentsProps", "control", "disabled", "disableTypography", "inputRef", "label", "labelPlacement", "name", "onChange", "slotProps", "value"];
const useUtilityClasses$g = ownerState => {
const {
classes,
disabled,
labelPlacement,
error
} = ownerState;
const slots = {
root: ['root', disabled && 'disabled', `labelPlacement${capitalize(labelPlacement)}`, error && 'error'],
label: ['label', disabled && 'disabled']
};
return composeClasses(slots, getFormControlLabelUtilityClasses, classes);
};
const FormControlLabelRoot = styled$1('label', {
name: 'MuiFormControlLabel',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [{
[`& .${formControlLabelClasses$1.label}`]: styles.label
}, styles.root, styles[`labelPlacement${capitalize(ownerState.labelPlacement)}`]];
}
})(({
theme,
ownerState
}) => _extends({
display: 'inline-flex',
alignItems: 'center',
cursor: 'pointer',
// For correct alignment with the text.
verticalAlign: 'middle',
WebkitTapHighlightColor: 'transparent',
marginLeft: -11,
marginRight: 16,
// used for row presentation of radio/checkbox
[`&.${formControlLabelClasses$1.disabled}`]: {
cursor: 'default'
}
}, ownerState.labelPlacement === 'start' && {
flexDirection: 'row-reverse',
marginLeft: 16,
// used for row presentation of radio/checkbox
marginRight: -11
}, ownerState.labelPlacement === 'top' && {
flexDirection: 'column-reverse',
marginLeft: 16
}, ownerState.labelPlacement === 'bottom' && {
flexDirection: 'column',
marginLeft: 16
}, {
[`& .${formControlLabelClasses$1.label}`]: {
[`&.${formControlLabelClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.text.disabled
}
}
}));
/**
* Drop-in replacement of the `Radio`, `Switch` and `Checkbox` component.
* Use this component if you want to display an extra label.
*/
const FormControlLabel = /*#__PURE__*/reactExports.forwardRef(function FormControlLabel(inProps, ref) {
var _slotProps$typography;
const props = useThemeProps({
props: inProps,
name: 'MuiFormControlLabel'
});
const {
className,
componentsProps = {},
control,
disabled: disabledProp,
disableTypography,
label: labelProp,
labelPlacement = 'end',
slotProps = {}
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$k);
const muiFormControl = useFormControl();
let disabled = disabledProp;
if (typeof disabled === 'undefined' && typeof control.props.disabled !== 'undefined') {
disabled = control.props.disabled;
}
if (typeof disabled === 'undefined' && muiFormControl) {
disabled = muiFormControl.disabled;
}
const controlProps = {
disabled
};
['checked', 'name', 'onChange', 'value', 'inputRef'].forEach(key => {
if (typeof control.props[key] === 'undefined' && typeof props[key] !== 'undefined') {
controlProps[key] = props[key];
}
});
const fcs = formControlState({
props,
muiFormControl,
states: ['error']
});
const ownerState = _extends({}, props, {
disabled,
labelPlacement,
error: fcs.error
});
const classes = useUtilityClasses$g(ownerState);
const typographySlotProps = (_slotProps$typography = slotProps.typography) != null ? _slotProps$typography : componentsProps.typography;
let label = labelProp;
if (label != null && label.type !== Typography$1 && !disableTypography) {
label = /*#__PURE__*/jsx(Typography$1, _extends({
component: "span"
}, typographySlotProps, {
className: clsx(classes.label, typographySlotProps == null ? void 0 : typographySlotProps.className),
children: label
}));
}
return /*#__PURE__*/jsxs(FormControlLabelRoot, _extends({
className: clsx(classes.root, className),
ownerState: ownerState,
ref: ref
}, other, {
children: [/*#__PURE__*/reactExports.cloneElement(control, controlProps), label]
}));
});
const FormControlLabel$1 = FormControlLabel;
function getFormHelperTextUtilityClasses(slot) {
return generateUtilityClass('MuiFormHelperText', slot);
}
const formHelperTextClasses = generateUtilityClasses('MuiFormHelperText', ['root', 'error', 'disabled', 'sizeSmall', 'sizeMedium', 'contained', 'focused', 'filled', 'required']);
const formHelperTextClasses$1 = formHelperTextClasses;
var _span$2;
const _excluded$j = ["children", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"];
const useUtilityClasses$f = ownerState => {
const {
classes,
contained,
size,
disabled,
error,
filled,
focused,
required
} = ownerState;
const slots = {
root: ['root', disabled && 'disabled', error && 'error', size && `size${capitalize(size)}`, contained && 'contained', focused && 'focused', filled && 'filled', required && 'required']
};
return composeClasses(slots, getFormHelperTextUtilityClasses, classes);
};
const FormHelperTextRoot = styled$1('p', {
name: 'MuiFormHelperText',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.size && styles[`size${capitalize(ownerState.size)}`], ownerState.contained && styles.contained, ownerState.filled && styles.filled];
}
})(({
theme,
ownerState
}) => _extends({
color: (theme.vars || theme).palette.text.secondary
}, theme.typography.caption, {
textAlign: 'left',
marginTop: 3,
marginRight: 0,
marginBottom: 0,
marginLeft: 0,
[`&.${formHelperTextClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.text.disabled
},
[`&.${formHelperTextClasses$1.error}`]: {
color: (theme.vars || theme).palette.error.main
}
}, ownerState.size === 'small' && {
marginTop: 4
}, ownerState.contained && {
marginLeft: 14,
marginRight: 14
}));
const FormHelperText = /*#__PURE__*/reactExports.forwardRef(function FormHelperText(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiFormHelperText'
});
const {
children,
className,
component = 'p'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$j);
const muiFormControl = useFormControl();
const fcs = formControlState({
props,
muiFormControl,
states: ['variant', 'size', 'disabled', 'error', 'filled', 'focused', 'required']
});
const ownerState = _extends({}, props, {
component,
contained: fcs.variant === 'filled' || fcs.variant === 'outlined',
variant: fcs.variant,
size: fcs.size,
disabled: fcs.disabled,
error: fcs.error,
filled: fcs.filled,
focused: fcs.focused,
required: fcs.required
});
const classes = useUtilityClasses$f(ownerState);
return /*#__PURE__*/jsx(FormHelperTextRoot, _extends({
as: component,
ownerState: ownerState,
className: clsx(classes.root, className),
ref: ref
}, other, {
children: children === ' ' ? // notranslate needed while Google Translate will not fix zero-width space issue
_span$2 || (_span$2 = /*#__PURE__*/jsx("span", {
className: "notranslate",
children: "\u200B"
})) : children
}));
});
const FormHelperText$1 = FormHelperText;
function getFormLabelUtilityClasses(slot) {
return generateUtilityClass('MuiFormLabel', slot);
}
const formLabelClasses = generateUtilityClasses('MuiFormLabel', ['root', 'colorSecondary', 'focused', 'disabled', 'error', 'filled', 'required', 'asterisk']);
const formLabelClasses$1 = formLabelClasses;
const _excluded$i = ["children", "className", "color", "component", "disabled", "error", "filled", "focused", "required"];
const useUtilityClasses$e = ownerState => {
const {
classes,
color,
focused,
disabled,
error,
filled,
required
} = ownerState;
const slots = {
root: ['root', `color${capitalize(color)}`, disabled && 'disabled', error && 'error', filled && 'filled', focused && 'focused', required && 'required'],
asterisk: ['asterisk', error && 'error']
};
return composeClasses(slots, getFormLabelUtilityClasses, classes);
};
const FormLabelRoot = styled$1('label', {
name: 'MuiFormLabel',
slot: 'Root',
overridesResolver: ({
ownerState
}, styles) => {
return _extends({}, styles.root, ownerState.color === 'secondary' && styles.colorSecondary, ownerState.filled && styles.filled);
}
})(({
theme,
ownerState
}) => _extends({
color: (theme.vars || theme).palette.text.secondary
}, theme.typography.body1, {
lineHeight: '1.4375em',
padding: 0,
position: 'relative',
[`&.${formLabelClasses$1.focused}`]: {
color: (theme.vars || theme).palette[ownerState.color].main
},
[`&.${formLabelClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.text.disabled
},
[`&.${formLabelClasses$1.error}`]: {
color: (theme.vars || theme).palette.error.main
}
}));
const AsteriskComponent = styled$1('span', {
name: 'MuiFormLabel',
slot: 'Asterisk',
overridesResolver: (props, styles) => styles.asterisk
})(({
theme
}) => ({
[`&.${formLabelClasses$1.error}`]: {
color: (theme.vars || theme).palette.error.main
}
}));
const FormLabel = /*#__PURE__*/reactExports.forwardRef(function FormLabel(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiFormLabel'
});
const {
children,
className,
component = 'label'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$i);
const muiFormControl = useFormControl();
const fcs = formControlState({
props,
muiFormControl,
states: ['color', 'required', 'focused', 'disabled', 'error', 'filled']
});
const ownerState = _extends({}, props, {
color: fcs.color || 'primary',
component,
disabled: fcs.disabled,
error: fcs.error,
filled: fcs.filled,
focused: fcs.focused,
required: fcs.required
});
const classes = useUtilityClasses$e(ownerState);
return /*#__PURE__*/jsxs(FormLabelRoot, _extends({
as: component,
ownerState: ownerState,
className: clsx(classes.root, className),
ref: ref
}, other, {
children: [children, fcs.required && /*#__PURE__*/jsxs(AsteriskComponent, {
ownerState: ownerState,
"aria-hidden": true,
className: classes.asterisk,
children: ["\u2009", '*']
})]
}));
});
const FormLabel$1 = FormLabel;
const _excluded$h = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
function getScale(value) {
return `scale(${value}, ${value ** 2})`;
}
const styles = {
entering: {
opacity: 1,
transform: getScale(1)
},
entered: {
opacity: 1,
transform: 'none'
}
};
/*
TODO v6: remove
Conditionally apply a workaround for the CSS transition bug in Safari 15.4 / WebKit browsers.
*/
const isWebKit154 = typeof navigator !== 'undefined' && /^((?!chrome|android).)*(safari|mobile)/i.test(navigator.userAgent) && /(os |version\/)15(.|_)4/i.test(navigator.userAgent);
/**
* The Grow transition is used by the [Tooltip](/material-ui/react-tooltip/) and
* [Popover](/material-ui/react-popover/) components.
* It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
*/
const Grow = /*#__PURE__*/reactExports.forwardRef(function Grow(props, ref) {
const {
addEndListener,
appear = true,
children,
easing,
in: inProp,
onEnter,
onEntered,
onEntering,
onExit,
onExited,
onExiting,
style,
timeout = 'auto',
// eslint-disable-next-line react/prop-types
TransitionComponent = Transition$1
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$h);
const timer = reactExports.useRef();
const autoTimeout = reactExports.useRef();
const theme = useTheme();
const nodeRef = reactExports.useRef(null);
const handleRef = useForkRef(nodeRef, children.ref, ref);
const normalizedTransitionCallback = callback => maybeIsAppearing => {
if (callback) {
const node = nodeRef.current;
// onEnterXxx and onExitXxx callbacks have a different arguments.length value.
if (maybeIsAppearing === undefined) {
callback(node);
} else {
callback(node, maybeIsAppearing);
}
}
};
const handleEntering = normalizedTransitionCallback(onEntering);
const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
reflow(node); // So the animation always start from the start.
const {
duration: transitionDuration,
delay,
easing: transitionTimingFunction
} = getTransitionProps({
style,
timeout,
easing
}, {
mode: 'enter'
});
let duration;
if (timeout === 'auto') {
duration = theme.transitions.getAutoHeightDuration(node.clientHeight);
autoTimeout.current = duration;
} else {
duration = transitionDuration;
}
node.style.transition = [theme.transitions.create('opacity', {
duration,
delay
}), theme.transitions.create('transform', {
duration: isWebKit154 ? duration : duration * 0.666,
delay,
easing: transitionTimingFunction
})].join(',');
if (onEnter) {
onEnter(node, isAppearing);
}
});
const handleEntered = normalizedTransitionCallback(onEntered);
const handleExiting = normalizedTransitionCallback(onExiting);
const handleExit = normalizedTransitionCallback(node => {
const {
duration: transitionDuration,
delay,
easing: transitionTimingFunction
} = getTransitionProps({
style,
timeout,
easing
}, {
mode: 'exit'
});
let duration;
if (timeout === 'auto') {
duration = theme.transitions.getAutoHeightDuration(node.clientHeight);
autoTimeout.current = duration;
} else {
duration = transitionDuration;
}
node.style.transition = [theme.transitions.create('opacity', {
duration,
delay
}), theme.transitions.create('transform', {
duration: isWebKit154 ? duration : duration * 0.666,
delay: isWebKit154 ? delay : delay || duration * 0.333,
easing: transitionTimingFunction
})].join(',');
node.style.opacity = 0;
node.style.transform = getScale(0.75);
if (onExit) {
onExit(node);
}
});
const handleExited = normalizedTransitionCallback(onExited);
const handleAddEndListener = next => {
if (timeout === 'auto') {
timer.current = setTimeout(next, autoTimeout.current || 0);
}
if (addEndListener) {
// Old call signature before `react-transition-group` implemented `nodeRef`
addEndListener(nodeRef.current, next);
}
};
reactExports.useEffect(() => {
return () => {
clearTimeout(timer.current);
};
}, []);
return /*#__PURE__*/jsx(TransitionComponent, _extends({
appear: appear,
in: inProp,
nodeRef: nodeRef,
onEnter: handleEnter,
onEntered: handleEntered,
onEntering: handleEntering,
onExit: handleExit,
onExited: handleExited,
onExiting: handleExiting,
addEndListener: handleAddEndListener,
timeout: timeout === 'auto' ? null : timeout
}, other, {
children: (state, childProps) => {
return /*#__PURE__*/reactExports.cloneElement(children, _extends({
style: _extends({
opacity: 0,
transform: getScale(0.75),
visibility: state === 'exited' && !inProp ? 'hidden' : undefined
}, styles[state], style, children.props.style),
ref: handleRef
}, childProps));
}
}));
});
Grow.muiSupportAuto = true;
const Grow$1 = Grow;
const _excluded$g = ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"];
const useUtilityClasses$d = ownerState => {
const {
classes,
disableUnderline
} = ownerState;
const slots = {
root: ['root', !disableUnderline && 'underline'],
input: ['input']
};
const composedClasses = composeClasses(slots, getInputUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const InputRoot = styled$1(InputBaseRoot, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiInput',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [...rootOverridesResolver(props, styles), !ownerState.disableUnderline && styles.underline];
}
})(({
theme,
ownerState
}) => {
const light = theme.palette.mode === 'light';
let bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';
if (theme.vars) {
bottomLineColor = `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})`;
}
return _extends({
position: 'relative'
}, ownerState.formControl && {
'label + &': {
marginTop: 16
}
}, !ownerState.disableUnderline && {
'&:after': {
borderBottom: `2px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
left: 0,
bottom: 0,
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
content: '""',
position: 'absolute',
right: 0,
transform: 'scaleX(0)',
transition: theme.transitions.create('transform', {
duration: theme.transitions.duration.shorter,
easing: theme.transitions.easing.easeOut
}),
pointerEvents: 'none' // Transparent to the hover style.
},
[`&.${inputClasses$1.focused}:after`]: {
// translateX(0) is a workaround for Safari transform scale bug
// See https://github.com/mui/material-ui/issues/31766
transform: 'scaleX(1) translateX(0)'
},
[`&.${inputClasses$1.error}`]: {
'&:before, &:after': {
borderBottomColor: (theme.vars || theme).palette.error.main
}
},
'&:before': {
borderBottom: `1px solid ${bottomLineColor}`,
left: 0,
bottom: 0,
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
content: '"\\00a0"',
position: 'absolute',
right: 0,
transition: theme.transitions.create('border-bottom-color', {
duration: theme.transitions.duration.shorter
}),
pointerEvents: 'none' // Transparent to the hover style.
},
[`&:hover:not(.${inputClasses$1.disabled}, .${inputClasses$1.error}):before`]: {
borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
borderBottom: `1px solid ${bottomLineColor}`
}
},
[`&.${inputClasses$1.disabled}:before`]: {
borderBottomStyle: 'dotted'
}
});
});
const InputInput = styled$1(InputBaseComponent, {
name: 'MuiInput',
slot: 'Input',
overridesResolver: inputOverridesResolver
})({});
const Input = /*#__PURE__*/reactExports.forwardRef(function Input(inProps, ref) {
var _ref, _slots$root, _ref2, _slots$input;
const props = useThemeProps({
props: inProps,
name: 'MuiInput'
});
const {
disableUnderline,
components = {},
componentsProps: componentsPropsProp,
fullWidth = false,
inputComponent = 'input',
multiline = false,
slotProps,
slots = {},
type = 'text'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$g);
const classes = useUtilityClasses$d(props);
const ownerState = {
disableUnderline
};
const inputComponentsProps = {
root: {
ownerState
}
};
const componentsProps = (slotProps != null ? slotProps : componentsPropsProp) ? deepmerge(slotProps != null ? slotProps : componentsPropsProp, inputComponentsProps) : inputComponentsProps;
const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : InputRoot;
const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : InputInput;
return /*#__PURE__*/jsx(InputBase$1, _extends({
slots: {
root: RootSlot,
input: InputSlot
},
slotProps: componentsProps,
fullWidth: fullWidth,
inputComponent: inputComponent,
multiline: multiline,
ref: ref,
type: type
}, other, {
classes: classes
}));
});
Input.muiName = 'Input';
const Input$1 = Input;
function getInputLabelUtilityClasses(slot) {
return generateUtilityClass('MuiInputLabel', slot);
}
generateUtilityClasses('MuiInputLabel', ['root', 'focused', 'disabled', 'error', 'required', 'asterisk', 'formControl', 'sizeSmall', 'shrink', 'animated', 'standard', 'filled', 'outlined']);
const _excluded$f = ["disableAnimation", "margin", "shrink", "variant", "className"];
const useUtilityClasses$c = ownerState => {
const {
classes,
formControl,
size,
shrink,
disableAnimation,
variant,
required
} = ownerState;
const slots = {
root: ['root', formControl && 'formControl', !disableAnimation && 'animated', shrink && 'shrink', size === 'small' && 'sizeSmall', variant],
asterisk: [required && 'asterisk']
};
const composedClasses = composeClasses(slots, getInputLabelUtilityClasses, classes);
return _extends({}, classes, composedClasses);
};
const InputLabelRoot = styled$1(FormLabel$1, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiInputLabel',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [{
[`& .${formLabelClasses$1.asterisk}`]: styles.asterisk
}, styles.root, ownerState.formControl && styles.formControl, ownerState.size === 'small' && styles.sizeSmall, ownerState.shrink && styles.shrink, !ownerState.disableAnimation && styles.animated, styles[ownerState.variant]];
}
})(({
theme,
ownerState
}) => _extends({
display: 'block',
transformOrigin: 'top left',
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
maxWidth: '100%'
}, ownerState.formControl && {
position: 'absolute',
left: 0,
top: 0,
// slight alteration to spec spacing to match visual spec result
transform: 'translate(0, 20px) scale(1)'
}, ownerState.size === 'small' && {
// Compensation for the `Input.inputSizeSmall` style.
transform: 'translate(0, 17px) scale(1)'
}, ownerState.shrink && {
transform: 'translate(0, -1.5px) scale(0.75)',
transformOrigin: 'top left',
maxWidth: '133%'
}, !ownerState.disableAnimation && {
transition: theme.transitions.create(['color', 'transform', 'max-width'], {
duration: theme.transitions.duration.shorter,
easing: theme.transitions.easing.easeOut
})
}, ownerState.variant === 'filled' && _extends({
// Chrome's autofill feature gives the input field a yellow background.
// Since the input field is behind the label in the HTML tree,
// the input field is drawn last and hides the label with an opaque background color.
// zIndex: 1 will raise the label above opaque background-colors of input.
zIndex: 1,
pointerEvents: 'none',
transform: 'translate(12px, 16px) scale(1)',
maxWidth: 'calc(100% - 24px)'
}, ownerState.size === 'small' && {
transform: 'translate(12px, 13px) scale(1)'
}, ownerState.shrink && _extends({
userSelect: 'none',
pointerEvents: 'auto',
transform: 'translate(12px, 7px) scale(0.75)',
maxWidth: 'calc(133% - 24px)'
}, ownerState.size === 'small' && {
transform: 'translate(12px, 4px) scale(0.75)'
})), ownerState.variant === 'outlined' && _extends({
// see comment above on filled.zIndex
zIndex: 1,
pointerEvents: 'none',
transform: 'translate(14px, 16px) scale(1)',
maxWidth: 'calc(100% - 24px)'
}, ownerState.size === 'small' && {
transform: 'translate(14px, 9px) scale(1)'
}, ownerState.shrink && {
userSelect: 'none',
pointerEvents: 'auto',
maxWidth: 'calc(133% - 24px)',
transform: 'translate(14px, -9px) scale(0.75)'
})));
const InputLabel = /*#__PURE__*/reactExports.forwardRef(function InputLabel(inProps, ref) {
const props = useThemeProps({
name: 'MuiInputLabel',
props: inProps
});
const {
disableAnimation = false,
shrink: shrinkProp,
className
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$f);
const muiFormControl = useFormControl();
let shrink = shrinkProp;
if (typeof shrink === 'undefined' && muiFormControl) {
shrink = muiFormControl.filled || muiFormControl.focused || muiFormControl.adornedStart;
}
const fcs = formControlState({
props,
muiFormControl,
states: ['size', 'variant', 'required']
});
const ownerState = _extends({}, props, {
disableAnimation,
formControl: muiFormControl,
shrink,
size: fcs.size,
variant: fcs.variant,
required: fcs.required
});
const classes = useUtilityClasses$c(ownerState);
return /*#__PURE__*/jsx(InputLabelRoot, _extends({
"data-shrink": shrink,
ownerState: ownerState,
ref: ref,
className: clsx(classes.root, className)
}, other, {
classes: classes
}));
});
const InputLabel$1 = InputLabel;
/**
* @ignore - internal component.
*/
const ListContext = /*#__PURE__*/reactExports.createContext({});
const ListContext$1 = ListContext;
function getListUtilityClass(slot) {
return generateUtilityClass('MuiList', slot);
}
generateUtilityClasses('MuiList', ['root', 'padding', 'dense', 'subheader']);
const _excluded$e = ["children", "className", "component", "dense", "disablePadding", "subheader"];
const useUtilityClasses$b = ownerState => {
const {
classes,
disablePadding,
dense,
subheader
} = ownerState;
const slots = {
root: ['root', !disablePadding && 'padding', dense && 'dense', subheader && 'subheader']
};
return composeClasses(slots, getListUtilityClass, classes);
};
const ListRoot = styled$1('ul', {
name: 'MuiList',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, !ownerState.disablePadding && styles.padding, ownerState.dense && styles.dense, ownerState.subheader && styles.subheader];
}
})(({
ownerState
}) => _extends({
listStyle: 'none',
margin: 0,
padding: 0,
position: 'relative'
}, !ownerState.disablePadding && {
paddingTop: 8,
paddingBottom: 8
}, ownerState.subheader && {
paddingTop: 0
}));
const List = /*#__PURE__*/reactExports.forwardRef(function List(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiList'
});
const {
children,
className,
component = 'ul',
dense = false,
disablePadding = false,
subheader
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$e);
const context = reactExports.useMemo(() => ({
dense
}), [dense]);
const ownerState = _extends({}, props, {
component,
dense,
disablePadding
});
const classes = useUtilityClasses$b(ownerState);
return /*#__PURE__*/jsx(ListContext$1.Provider, {
value: context,
children: /*#__PURE__*/jsxs(ListRoot, _extends({
as: component,
className: clsx(classes.root, className),
ref: ref,
ownerState: ownerState
}, other, {
children: [subheader, children]
}))
});
});
const List$1 = List;
const listItemIconClasses = generateUtilityClasses('MuiListItemIcon', ['root', 'alignItemsFlexStart']);
const listItemIconClasses$1 = listItemIconClasses;
const listItemTextClasses = generateUtilityClasses('MuiListItemText', ['root', 'multiline', 'dense', 'inset', 'primary', 'secondary']);
const listItemTextClasses$1 = listItemTextClasses;
const _excluded$d = ["actions", "autoFocus", "autoFocusItem", "children", "className", "disabledItemsFocusable", "disableListWrap", "onKeyDown", "variant"];
function nextItem(list, item, disableListWrap) {
if (list === item) {
return list.firstChild;
}
if (item && item.nextElementSibling) {
return item.nextElementSibling;
}
return disableListWrap ? null : list.firstChild;
}
function previousItem(list, item, disableListWrap) {
if (list === item) {
return disableListWrap ? list.firstChild : list.lastChild;
}
if (item && item.previousElementSibling) {
return item.previousElementSibling;
}
return disableListWrap ? null : list.lastChild;
}
function textCriteriaMatches(nextFocus, textCriteria) {
if (textCriteria === undefined) {
return true;
}
let text = nextFocus.innerText;
if (text === undefined) {
// jsdom doesn't support innerText
text = nextFocus.textContent;
}
text = text.trim().toLowerCase();
if (text.length === 0) {
return false;
}
if (textCriteria.repeating) {
return text[0] === textCriteria.keys[0];
}
return text.indexOf(textCriteria.keys.join('')) === 0;
}
function moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, traversalFunction, textCriteria) {
let wrappedOnce = false;
let nextFocus = traversalFunction(list, currentFocus, currentFocus ? disableListWrap : false);
while (nextFocus) {
// Prevent infinite loop.
if (nextFocus === list.firstChild) {
if (wrappedOnce) {
return false;
}
wrappedOnce = true;
}
// Same logic as useAutocomplete.js
const nextFocusDisabled = disabledItemsFocusable ? false : nextFocus.disabled || nextFocus.getAttribute('aria-disabled') === 'true';
if (!nextFocus.hasAttribute('tabindex') || !textCriteriaMatches(nextFocus, textCriteria) || nextFocusDisabled) {
// Move to the next element.
nextFocus = traversalFunction(list, nextFocus, disableListWrap);
} else {
nextFocus.focus();
return true;
}
}
return false;
}
/**
* A permanently displayed menu following https://www.w3.org/WAI/ARIA/apg/patterns/menubutton/.
* It's exposed to help customization of the [`Menu`](/material-ui/api/menu/) component if you
* use it separately you need to move focus into the component manually. Once
* the focus is placed inside the component it is fully keyboard accessible.
*/
const MenuList = /*#__PURE__*/reactExports.forwardRef(function MenuList(props, ref) {
const {
// private
// eslint-disable-next-line react/prop-types
actions,
autoFocus = false,
autoFocusItem = false,
children,
className,
disabledItemsFocusable = false,
disableListWrap = false,
onKeyDown,
variant = 'selectedMenu'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$d);
const listRef = reactExports.useRef(null);
const textCriteriaRef = reactExports.useRef({
keys: [],
repeating: true,
previousKeyMatched: true,
lastTime: null
});
useEnhancedEffect$1(() => {
if (autoFocus) {
listRef.current.focus();
}
}, [autoFocus]);
reactExports.useImperativeHandle(actions, () => ({
adjustStyleForScrollbar: (containerElement, theme) => {
// Let's ignore that piece of logic if users are already overriding the width
// of the menu.
const noExplicitWidth = !listRef.current.style.width;
if (containerElement.clientHeight < listRef.current.clientHeight && noExplicitWidth) {
const scrollbarSize = `${getScrollbarSize(ownerDocument(containerElement))}px`;
listRef.current.style[theme.direction === 'rtl' ? 'paddingLeft' : 'paddingRight'] = scrollbarSize;
listRef.current.style.width = `calc(100% + ${scrollbarSize})`;
}
return listRef.current;
}
}), []);
const handleKeyDown = event => {
const list = listRef.current;
const key = event.key;
/**
* @type {Element} - will always be defined since we are in a keydown handler
* attached to an element. A keydown event is either dispatched to the activeElement
* or document.body or document.documentElement. Only the first case will
* trigger this specific handler.
*/
const currentFocus = ownerDocument(list).activeElement;
if (key === 'ArrowDown') {
// Prevent scroll of the page
event.preventDefault();
moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, nextItem);
} else if (key === 'ArrowUp') {
event.preventDefault();
moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, previousItem);
} else if (key === 'Home') {
event.preventDefault();
moveFocus(list, null, disableListWrap, disabledItemsFocusable, nextItem);
} else if (key === 'End') {
event.preventDefault();
moveFocus(list, null, disableListWrap, disabledItemsFocusable, previousItem);
} else if (key.length === 1) {
const criteria = textCriteriaRef.current;
const lowerKey = key.toLowerCase();
const currTime = performance.now();
if (criteria.keys.length > 0) {
// Reset
if (currTime - criteria.lastTime > 500) {
criteria.keys = [];
criteria.repeating = true;
criteria.previousKeyMatched = true;
} else if (criteria.repeating && lowerKey !== criteria.keys[0]) {
criteria.repeating = false;
}
}
criteria.lastTime = currTime;
criteria.keys.push(lowerKey);
const keepFocusOnCurrent = currentFocus && !criteria.repeating && textCriteriaMatches(currentFocus, criteria);
if (criteria.previousKeyMatched && (keepFocusOnCurrent || moveFocus(list, currentFocus, false, disabledItemsFocusable, nextItem, criteria))) {
event.preventDefault();
} else {
criteria.previousKeyMatched = false;
}
}
if (onKeyDown) {
onKeyDown(event);
}
};
const handleRef = useForkRef(listRef, ref);
/**
* the index of the item should receive focus
* in a `variant="selectedMenu"` it's the first `selected` item
* otherwise it's the very first item.
*/
let activeItemIndex = -1;
// since we inject focus related props into children we have to do a lookahead
// to check if there is a `selected` item. We're looking for the last `selected`
// item and use the first valid item as a fallback
reactExports.Children.forEach(children, (child, index) => {
if (! /*#__PURE__*/reactExports.isValidElement(child)) {
return;
}
if (!child.props.disabled) {
if (variant === 'selectedMenu' && child.props.selected) {
activeItemIndex = index;
} else if (activeItemIndex === -1) {
activeItemIndex = index;
}
}
});
const items = reactExports.Children.map(children, (child, index) => {
if (index === activeItemIndex) {
const newChildProps = {};
if (autoFocusItem) {
newChildProps.autoFocus = true;
}
if (child.props.tabIndex === undefined && variant === 'selectedMenu') {
newChildProps.tabIndex = 0;
}
return /*#__PURE__*/reactExports.cloneElement(child, newChildProps);
}
return child;
});
return /*#__PURE__*/jsx(List$1, _extends({
role: "menu",
ref: handleRef,
className: className,
onKeyDown: handleKeyDown,
tabIndex: autoFocus ? 0 : -1
}, other, {
children: items
}));
});
const MenuList$1 = MenuList;
function getPopoverUtilityClass(slot) {
return generateUtilityClass('MuiPopover', slot);
}
generateUtilityClasses('MuiPopover', ['root', 'paper']);
const _excluded$c = ["onEntering"],
_excluded2$2 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"];
function getOffsetTop(rect, vertical) {
let offset = 0;
if (typeof vertical === 'number') {
offset = vertical;
} else if (vertical === 'center') {
offset = rect.height / 2;
} else if (vertical === 'bottom') {
offset = rect.height;
}
return offset;
}
function getOffsetLeft(rect, horizontal) {
let offset = 0;
if (typeof horizontal === 'number') {
offset = horizontal;
} else if (horizontal === 'center') {
offset = rect.width / 2;
} else if (horizontal === 'right') {
offset = rect.width;
}
return offset;
}
function getTransformOriginValue(transformOrigin) {
return [transformOrigin.horizontal, transformOrigin.vertical].map(n => typeof n === 'number' ? `${n}px` : n).join(' ');
}
function resolveAnchorEl(anchorEl) {
return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
}
const useUtilityClasses$a = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root'],
paper: ['paper']
};
return composeClasses(slots, getPopoverUtilityClass, classes);
};
const PopoverRoot = styled$1(Modal$1, {
name: 'MuiPopover',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({});
const PopoverPaper = styled$1(Paper$1, {
name: 'MuiPopover',
slot: 'Paper',
overridesResolver: (props, styles) => styles.paper
})({
position: 'absolute',
overflowY: 'auto',
overflowX: 'hidden',
// So we see the popover when it's empty.
// It's most likely on issue on userland.
minWidth: 16,
minHeight: 16,
maxWidth: 'calc(100% - 32px)',
maxHeight: 'calc(100% - 32px)',
// We disable the focus ring for mouse, touch and keyboard users.
outline: 0
});
const Popover = /*#__PURE__*/reactExports.forwardRef(function Popover(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiPopover'
});
const {
action,
anchorEl,
anchorOrigin = {
vertical: 'top',
horizontal: 'left'
},
anchorPosition,
anchorReference = 'anchorEl',
children,
className,
container: containerProp,
elevation = 8,
marginThreshold = 16,
open,
PaperProps = {},
transformOrigin = {
vertical: 'top',
horizontal: 'left'
},
TransitionComponent = Grow$1,
transitionDuration: transitionDurationProp = 'auto',
TransitionProps: {
onEntering
} = {}
} = props,
TransitionProps = _objectWithoutPropertiesLoose$2(props.TransitionProps, _excluded$c),
other = _objectWithoutPropertiesLoose$2(props, _excluded2$2);
const paperRef = reactExports.useRef();
const handlePaperRef = useForkRef(paperRef, PaperProps.ref);
const ownerState = _extends({}, props, {
anchorOrigin,
anchorReference,
elevation,
marginThreshold,
PaperProps,
transformOrigin,
TransitionComponent,
transitionDuration: transitionDurationProp,
TransitionProps
});
const classes = useUtilityClasses$a(ownerState);
// Returns the top/left offset of the position
// to attach to on the anchor element (or body if none is provided)
const getAnchorOffset = reactExports.useCallback(() => {
if (anchorReference === 'anchorPosition') {
return anchorPosition;
}
const resolvedAnchorEl = resolveAnchorEl(anchorEl);
// If an anchor element wasn't provided, just use the parent body element of this Popover
const anchorElement = resolvedAnchorEl && resolvedAnchorEl.nodeType === 1 ? resolvedAnchorEl : ownerDocument(paperRef.current).body;
const anchorRect = anchorElement.getBoundingClientRect();
return {
top: anchorRect.top + getOffsetTop(anchorRect, anchorOrigin.vertical),
left: anchorRect.left + getOffsetLeft(anchorRect, anchorOrigin.horizontal)
};
}, [anchorEl, anchorOrigin.horizontal, anchorOrigin.vertical, anchorPosition, anchorReference]);
// Returns the base transform origin using the element
const getTransformOrigin = reactExports.useCallback(elemRect => {
return {
vertical: getOffsetTop(elemRect, transformOrigin.vertical),
horizontal: getOffsetLeft(elemRect, transformOrigin.horizontal)
};
}, [transformOrigin.horizontal, transformOrigin.vertical]);
const getPositioningStyle = reactExports.useCallback(element => {
const elemRect = {
width: element.offsetWidth,
height: element.offsetHeight
};
// Get the transform origin point on the element itself
const elemTransformOrigin = getTransformOrigin(elemRect);
if (anchorReference === 'none') {
return {
top: null,
left: null,
transformOrigin: getTransformOriginValue(elemTransformOrigin)
};
}
// Get the offset of the anchoring element
const anchorOffset = getAnchorOffset();
// Calculate element positioning
let top = anchorOffset.top - elemTransformOrigin.vertical;
let left = anchorOffset.left - elemTransformOrigin.horizontal;
const bottom = top + elemRect.height;
const right = left + elemRect.width;
// Use the parent window of the anchorEl if provided
const containerWindow = ownerWindow(resolveAnchorEl(anchorEl));
// Window thresholds taking required margin into account
const heightThreshold = containerWindow.innerHeight - marginThreshold;
const widthThreshold = containerWindow.innerWidth - marginThreshold;
// Check if the vertical axis needs shifting
if (top < marginThreshold) {
const diff = top - marginThreshold;
top -= diff;
elemTransformOrigin.vertical += diff;
} else if (bottom > heightThreshold) {
const diff = bottom - heightThreshold;
top -= diff;
elemTransformOrigin.vertical += diff;
}
// Check if the horizontal axis needs shifting
if (left < marginThreshold) {
const diff = left - marginThreshold;
left -= diff;
elemTransformOrigin.horizontal += diff;
} else if (right > widthThreshold) {
const diff = right - widthThreshold;
left -= diff;
elemTransformOrigin.horizontal += diff;
}
return {
top: `${Math.round(top)}px`,
left: `${Math.round(left)}px`,
transformOrigin: getTransformOriginValue(elemTransformOrigin)
};
}, [anchorEl, anchorReference, getAnchorOffset, getTransformOrigin, marginThreshold]);
const [isPositioned, setIsPositioned] = reactExports.useState(open);
const setPositioningStyles = reactExports.useCallback(() => {
const element = paperRef.current;
if (!element) {
return;
}
const positioning = getPositioningStyle(element);
if (positioning.top !== null) {
element.style.top = positioning.top;
}
if (positioning.left !== null) {
element.style.left = positioning.left;
}
element.style.transformOrigin = positioning.transformOrigin;
setIsPositioned(true);
}, [getPositioningStyle]);
const handleEntering = (element, isAppearing) => {
if (onEntering) {
onEntering(element, isAppearing);
}
setPositioningStyles();
};
const handleExited = () => {
setIsPositioned(false);
};
reactExports.useEffect(() => {
if (open) {
setPositioningStyles();
}
});
reactExports.useImperativeHandle(action, () => open ? {
updatePosition: () => {
setPositioningStyles();
}
} : null, [open, setPositioningStyles]);
reactExports.useEffect(() => {
if (!open) {
return undefined;
}
const handleResize = debounce$1(() => {
setPositioningStyles();
});
const containerWindow = ownerWindow(anchorEl);
containerWindow.addEventListener('resize', handleResize);
return () => {
handleResize.clear();
containerWindow.removeEventListener('resize', handleResize);
};
}, [anchorEl, open, setPositioningStyles]);
let transitionDuration = transitionDurationProp;
if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
transitionDuration = undefined;
}
// If the container prop is provided, use that
// If the anchorEl prop is provided, use its parent body element as the container
// If neither are provided let the Modal take care of choosing the container
const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
return /*#__PURE__*/jsx(PopoverRoot, _extends({
BackdropProps: {
invisible: true
},
className: clsx(classes.root, className),
container: container,
open: open,
ref: ref,
ownerState: ownerState
}, other, {
children: /*#__PURE__*/jsx(TransitionComponent, _extends({
appear: true,
in: open,
onEntering: handleEntering,
onExited: handleExited,
timeout: transitionDuration
}, TransitionProps, {
children: /*#__PURE__*/jsx(PopoverPaper, _extends({
elevation: elevation
}, PaperProps, {
ref: handlePaperRef,
className: clsx(classes.paper, PaperProps.className)
}, isPositioned ? undefined : {
style: _extends({}, PaperProps.style, {
opacity: 0
})
}, {
ownerState: ownerState,
children: children
}))
}))
}));
});
const Popover$1 = Popover;
function getMenuUtilityClass(slot) {
return generateUtilityClass('MuiMenu', slot);
}
generateUtilityClasses('MuiMenu', ['root', 'paper', 'list']);
const _excluded$b = ["onEntering"],
_excluded2$1 = ["autoFocus", "children", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant"];
const RTL_ORIGIN = {
vertical: 'top',
horizontal: 'right'
};
const LTR_ORIGIN = {
vertical: 'top',
horizontal: 'left'
};
const useUtilityClasses$9 = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root'],
paper: ['paper'],
list: ['list']
};
return composeClasses(slots, getMenuUtilityClass, classes);
};
const MenuRoot = styled$1(Popover$1, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiMenu',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({});
const MenuPaper = styled$1(Paper$1, {
name: 'MuiMenu',
slot: 'Paper',
overridesResolver: (props, styles) => styles.paper
})({
// specZ: The maximum height of a simple menu should be one or more rows less than the view
// height. This ensures a tapable area outside of the simple menu with which to dismiss
// the menu.
maxHeight: 'calc(100% - 96px)',
// Add iOS momentum scrolling for iOS < 13.0
WebkitOverflowScrolling: 'touch'
});
const MenuMenuList = styled$1(MenuList$1, {
name: 'MuiMenu',
slot: 'List',
overridesResolver: (props, styles) => styles.list
})({
// We disable the focus ring for mouse, touch and keyboard users.
outline: 0
});
const Menu = /*#__PURE__*/reactExports.forwardRef(function Menu(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiMenu'
});
const {
autoFocus = true,
children,
disableAutoFocusItem = false,
MenuListProps = {},
onClose,
open,
PaperProps = {},
PopoverClasses,
transitionDuration = 'auto',
TransitionProps: {
onEntering
} = {},
variant = 'selectedMenu'
} = props,
TransitionProps = _objectWithoutPropertiesLoose$2(props.TransitionProps, _excluded$b),
other = _objectWithoutPropertiesLoose$2(props, _excluded2$1);
const theme = useTheme();
const isRtl = theme.direction === 'rtl';
const ownerState = _extends({}, props, {
autoFocus,
disableAutoFocusItem,
MenuListProps,
onEntering,
PaperProps,
transitionDuration,
TransitionProps,
variant
});
const classes = useUtilityClasses$9(ownerState);
const autoFocusItem = autoFocus && !disableAutoFocusItem && open;
const menuListActionsRef = reactExports.useRef(null);
const handleEntering = (element, isAppearing) => {
if (menuListActionsRef.current) {
menuListActionsRef.current.adjustStyleForScrollbar(element, theme);
}
if (onEntering) {
onEntering(element, isAppearing);
}
};
const handleListKeyDown = event => {
if (event.key === 'Tab') {
event.preventDefault();
if (onClose) {
onClose(event, 'tabKeyDown');
}
}
};
/**
* the index of the item should receive focus
* in a `variant="selectedMenu"` it's the first `selected` item
* otherwise it's the very first item.
*/
let activeItemIndex = -1;
// since we inject focus related props into children we have to do a lookahead
// to check if there is a `selected` item. We're looking for the last `selected`
// item and use the first valid item as a fallback
reactExports.Children.map(children, (child, index) => {
if (! /*#__PURE__*/reactExports.isValidElement(child)) {
return;
}
if (!child.props.disabled) {
if (variant === 'selectedMenu' && child.props.selected) {
activeItemIndex = index;
} else if (activeItemIndex === -1) {
activeItemIndex = index;
}
}
});
return /*#__PURE__*/jsx(MenuRoot, _extends({
onClose: onClose,
anchorOrigin: {
vertical: 'bottom',
horizontal: isRtl ? 'right' : 'left'
},
transformOrigin: isRtl ? RTL_ORIGIN : LTR_ORIGIN,
PaperProps: _extends({
component: MenuPaper
}, PaperProps, {
classes: _extends({}, PaperProps.classes, {
root: classes.paper
})
}),
className: classes.root,
open: open,
ref: ref,
transitionDuration: transitionDuration,
TransitionProps: _extends({
onEntering: handleEntering
}, TransitionProps),
ownerState: ownerState
}, other, {
classes: PopoverClasses,
children: /*#__PURE__*/jsx(MenuMenuList, _extends({
onKeyDown: handleListKeyDown,
actions: menuListActionsRef,
autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem),
autoFocusItem: autoFocusItem,
variant: variant
}, MenuListProps, {
className: clsx(classes.list, MenuListProps.className),
children: children
}))
}));
});
const Menu$1 = Menu;
function getMenuItemUtilityClass(slot) {
return generateUtilityClass('MuiMenuItem', slot);
}
const menuItemClasses = generateUtilityClasses('MuiMenuItem', ['root', 'focusVisible', 'dense', 'disabled', 'divider', 'gutters', 'selected']);
const menuItemClasses$1 = menuItemClasses;
const _excluded$a = ["autoFocus", "component", "dense", "divider", "disableGutters", "focusVisibleClassName", "role", "tabIndex", "className"];
const overridesResolver = (props, styles) => {
const {
ownerState
} = props;
return [styles.root, ownerState.dense && styles.dense, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];
};
const useUtilityClasses$8 = ownerState => {
const {
disabled,
dense,
divider,
disableGutters,
selected,
classes
} = ownerState;
const slots = {
root: ['root', dense && 'dense', disabled && 'disabled', !disableGutters && 'gutters', divider && 'divider', selected && 'selected']
};
const composedClasses = composeClasses(slots, getMenuItemUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const MenuItemRoot = styled$1(ButtonBase$1, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiMenuItem',
slot: 'Root',
overridesResolver
})(({
theme,
ownerState
}) => _extends({}, theme.typography.body1, {
display: 'flex',
justifyContent: 'flex-start',
alignItems: 'center',
position: 'relative',
textDecoration: 'none',
minHeight: 48,
paddingTop: 6,
paddingBottom: 6,
boxSizing: 'border-box',
whiteSpace: 'nowrap'
}, !ownerState.disableGutters && {
paddingLeft: 16,
paddingRight: 16
}, ownerState.divider && {
borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,
backgroundClip: 'padding-box'
}, {
'&:hover': {
textDecoration: 'none',
backgroundColor: (theme.vars || theme).palette.action.hover,
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: 'transparent'
}
},
[`&.${menuItemClasses$1.selected}`]: {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
[`&.${menuItemClasses$1.focusVisible}`]: {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
}
},
[`&.${menuItemClasses$1.selected}:hover`]: {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
}
},
[`&.${menuItemClasses$1.focusVisible}`]: {
backgroundColor: (theme.vars || theme).palette.action.focus
},
[`&.${menuItemClasses$1.disabled}`]: {
opacity: (theme.vars || theme).palette.action.disabledOpacity
},
[`& + .${dividerClasses$1.root}`]: {
marginTop: theme.spacing(1),
marginBottom: theme.spacing(1)
},
[`& + .${dividerClasses$1.inset}`]: {
marginLeft: 52
},
[`& .${listItemTextClasses$1.root}`]: {
marginTop: 0,
marginBottom: 0
},
[`& .${listItemTextClasses$1.inset}`]: {
paddingLeft: 36
},
[`& .${listItemIconClasses$1.root}`]: {
minWidth: 36
}
}, !ownerState.dense && {
[theme.breakpoints.up('sm')]: {
minHeight: 'auto'
}
}, ownerState.dense && _extends({
minHeight: 32,
// https://m2.material.io/components/menus#specs > Dense
paddingTop: 4,
paddingBottom: 4
}, theme.typography.body2, {
[`& .${listItemIconClasses$1.root} svg`]: {
fontSize: '1.25rem'
}
})));
const MenuItem = /*#__PURE__*/reactExports.forwardRef(function MenuItem(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiMenuItem'
});
const {
autoFocus = false,
component = 'li',
dense = false,
divider = false,
disableGutters = false,
focusVisibleClassName,
role = 'menuitem',
tabIndex: tabIndexProp,
className
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$a);
const context = reactExports.useContext(ListContext$1);
const childContext = reactExports.useMemo(() => ({
dense: dense || context.dense || false,
disableGutters
}), [context.dense, dense, disableGutters]);
const menuItemRef = reactExports.useRef(null);
useEnhancedEffect$1(() => {
if (autoFocus) {
if (menuItemRef.current) {
menuItemRef.current.focus();
}
}
}, [autoFocus]);
const ownerState = _extends({}, props, {
dense: childContext.dense,
divider,
disableGutters
});
const classes = useUtilityClasses$8(props);
const handleRef = useForkRef(menuItemRef, ref);
let tabIndex;
if (!props.disabled) {
tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;
}
return /*#__PURE__*/jsx(ListContext$1.Provider, {
value: childContext,
children: /*#__PURE__*/jsx(MenuItemRoot, _extends({
ref: handleRef,
role: role,
tabIndex: tabIndex,
component: component,
focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
className: clsx(classes.root, className)
}, other, {
ownerState: ownerState,
classes: classes
}))
});
});
const MenuItem$1 = MenuItem;
function getNativeSelectUtilityClasses(slot) {
return generateUtilityClass('MuiNativeSelect', slot);
}
const nativeSelectClasses = generateUtilityClasses('MuiNativeSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
const nativeSelectClasses$1 = nativeSelectClasses;
const _excluded$9 = ["className", "disabled", "IconComponent", "inputRef", "variant"];
const useUtilityClasses$7 = ownerState => {
const {
classes,
variant,
disabled,
multiple,
open
} = ownerState;
const slots = {
select: ['select', variant, disabled && 'disabled', multiple && 'multiple'],
icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled']
};
return composeClasses(slots, getNativeSelectUtilityClasses, classes);
};
const nativeSelectSelectStyles = ({
ownerState,
theme
}) => _extends({
MozAppearance: 'none',
// Reset
WebkitAppearance: 'none',
// Reset
// When interacting quickly, the text can end up selected.
// Native select can't be selected either.
userSelect: 'none',
borderRadius: 0,
// Reset
cursor: 'pointer',
'&:focus': _extends({}, theme.vars ? {
backgroundColor: `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.05)`
} : {
backgroundColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)'
}, {
borderRadius: 0 // Reset Chrome style
}),
// Remove IE11 arrow
'&::-ms-expand': {
display: 'none'
},
[`&.${nativeSelectClasses$1.disabled}`]: {
cursor: 'default'
},
'&[multiple]': {
height: 'auto'
},
'&:not([multiple]) option, &:not([multiple]) optgroup': {
backgroundColor: (theme.vars || theme).palette.background.paper
},
// Bump specificity to allow extending custom inputs
'&&&': {
paddingRight: 24,
minWidth: 16 // So it doesn't collapse.
}
}, ownerState.variant === 'filled' && {
'&&&': {
paddingRight: 32
}
}, ownerState.variant === 'outlined' && {
borderRadius: (theme.vars || theme).shape.borderRadius,
'&:focus': {
borderRadius: (theme.vars || theme).shape.borderRadius // Reset the reset for Chrome style
},
'&&&': {
paddingRight: 32
}
});
const NativeSelectSelect = styled$1('select', {
name: 'MuiNativeSelect',
slot: 'Select',
shouldForwardProp: rootShouldForwardProp,
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.select, styles[ownerState.variant], {
[`&.${nativeSelectClasses$1.multiple}`]: styles.multiple
}];
}
})(nativeSelectSelectStyles);
const nativeSelectIconStyles = ({
ownerState,
theme
}) => _extends({
// We use a position absolute over a flexbox in order to forward the pointer events
// to the input and to support wrapping tags..
position: 'absolute',
right: 0,
top: 'calc(50% - .5em)',
// Center vertically, height is 1em
pointerEvents: 'none',
// Don't block pointer events on the select under the icon.
color: (theme.vars || theme).palette.action.active,
[`&.${nativeSelectClasses$1.disabled}`]: {
color: (theme.vars || theme).palette.action.disabled
}
}, ownerState.open && {
transform: 'rotate(180deg)'
}, ownerState.variant === 'filled' && {
right: 7
}, ownerState.variant === 'outlined' && {
right: 7
});
const NativeSelectIcon = styled$1('svg', {
name: 'MuiNativeSelect',
slot: 'Icon',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
}
})(nativeSelectIconStyles);
/**
* @ignore - internal component.
*/
const NativeSelectInput = /*#__PURE__*/reactExports.forwardRef(function NativeSelectInput(props, ref) {
const {
className,
disabled,
IconComponent,
inputRef,
variant = 'standard'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$9);
const ownerState = _extends({}, props, {
disabled,
variant
});
const classes = useUtilityClasses$7(ownerState);
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/jsx(NativeSelectSelect, _extends({
ownerState: ownerState,
className: clsx(classes.select, className),
disabled: disabled,
ref: inputRef || ref
}, other)), props.multiple ? null : /*#__PURE__*/jsx(NativeSelectIcon, {
as: IconComponent,
ownerState: ownerState,
className: classes.icon
})]
});
});
const NativeSelectInput$1 = NativeSelectInput;
var _span$1;
const _excluded$8 = ["children", "classes", "className", "label", "notched"];
const NotchedOutlineRoot$1 = styled$1('fieldset')({
textAlign: 'left',
position: 'absolute',
bottom: 0,
right: 0,
top: -5,
left: 0,
margin: 0,
padding: '0 8px',
pointerEvents: 'none',
borderRadius: 'inherit',
borderStyle: 'solid',
borderWidth: 1,
overflow: 'hidden',
minWidth: '0%'
});
const NotchedOutlineLegend = styled$1('legend')(({
ownerState,
theme
}) => _extends({
float: 'unset',
// Fix conflict with bootstrap
width: 'auto',
// Fix conflict with bootstrap
overflow: 'hidden'
}, !ownerState.withLabel && {
padding: 0,
lineHeight: '11px',
// sync with `height` in `legend` styles
transition: theme.transitions.create('width', {
duration: 150,
easing: theme.transitions.easing.easeOut
})
}, ownerState.withLabel && _extends({
display: 'block',
// Fix conflict with normalize.css and sanitize.css
padding: 0,
height: 11,
// sync with `lineHeight` in `legend` styles
fontSize: '0.75em',
visibility: 'hidden',
maxWidth: 0.01,
transition: theme.transitions.create('max-width', {
duration: 50,
easing: theme.transitions.easing.easeOut
}),
whiteSpace: 'nowrap',
'& > span': {
paddingLeft: 5,
paddingRight: 5,
display: 'inline-block',
opacity: 0,
visibility: 'visible'
}
}, ownerState.notched && {
maxWidth: '100%',
transition: theme.transitions.create('max-width', {
duration: 100,
easing: theme.transitions.easing.easeOut,
delay: 50
})
})));
/**
* @ignore - internal component.
*/
function NotchedOutline(props) {
const {
className,
label,
notched
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$8);
const withLabel = label != null && label !== '';
const ownerState = _extends({}, props, {
notched,
withLabel
});
return /*#__PURE__*/jsx(NotchedOutlineRoot$1, _extends({
"aria-hidden": true,
className: className,
ownerState: ownerState
}, other, {
children: /*#__PURE__*/jsx(NotchedOutlineLegend, {
ownerState: ownerState,
children: withLabel ? /*#__PURE__*/jsx("span", {
children: label
}) : // notranslate needed while Google Translate will not fix zero-width space issue
_span$1 || (_span$1 = /*#__PURE__*/jsx("span", {
className: "notranslate",
children: "\u200B"
}))
})
}));
}
const _excluded$7 = ["components", "fullWidth", "inputComponent", "label", "multiline", "notched", "slots", "type"];
const useUtilityClasses$6 = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root'],
notchedOutline: ['notchedOutline'],
input: ['input']
};
const composedClasses = composeClasses(slots, getOutlinedInputUtilityClass, classes);
return _extends({}, classes, composedClasses);
};
const OutlinedInputRoot = styled$1(InputBaseRoot, {
shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
name: 'MuiOutlinedInput',
slot: 'Root',
overridesResolver: rootOverridesResolver
})(({
theme,
ownerState
}) => {
const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
return _extends({
position: 'relative',
borderRadius: (theme.vars || theme).shape.borderRadius,
[`&:hover .${outlinedInputClasses$1.notchedOutline}`]: {
borderColor: (theme.vars || theme).palette.text.primary
},
// Reset on touch devices, it doesn't add specificity
'@media (hover: none)': {
[`&:hover .${outlinedInputClasses$1.notchedOutline}`]: {
borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
}
},
[`&.${outlinedInputClasses$1.focused} .${outlinedInputClasses$1.notchedOutline}`]: {
borderColor: (theme.vars || theme).palette[ownerState.color].main,
borderWidth: 2
},
[`&.${outlinedInputClasses$1.error} .${outlinedInputClasses$1.notchedOutline}`]: {
borderColor: (theme.vars || theme).palette.error.main
},
[`&.${outlinedInputClasses$1.disabled} .${outlinedInputClasses$1.notchedOutline}`]: {
borderColor: (theme.vars || theme).palette.action.disabled
}
}, ownerState.startAdornment && {
paddingLeft: 14
}, ownerState.endAdornment && {
paddingRight: 14
}, ownerState.multiline && _extends({
padding: '16.5px 14px'
}, ownerState.size === 'small' && {
padding: '8.5px 14px'
}));
});
const NotchedOutlineRoot = styled$1(NotchedOutline, {
name: 'MuiOutlinedInput',
slot: 'NotchedOutline',
overridesResolver: (props, styles) => styles.notchedOutline
})(({
theme
}) => {
const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
return {
borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
};
});
const OutlinedInputInput = styled$1(InputBaseComponent, {
name: 'MuiOutlinedInput',
slot: 'Input',
overridesResolver: inputOverridesResolver
})(({
theme,
ownerState
}) => _extends({
padding: '16.5px 14px'
}, !theme.vars && {
'&:-webkit-autofill': {
WebkitBoxShadow: theme.palette.mode === 'light' ? null : '0 0 0 100px #266798 inset',
WebkitTextFillColor: theme.palette.mode === 'light' ? null : '#fff',
caretColor: theme.palette.mode === 'light' ? null : '#fff',
borderRadius: 'inherit'
}
}, theme.vars && {
'&:-webkit-autofill': {
borderRadius: 'inherit'
},
[theme.getColorSchemeSelector('dark')]: {
'&:-webkit-autofill': {
WebkitBoxShadow: '0 0 0 100px #266798 inset',
WebkitTextFillColor: '#fff',
caretColor: '#fff'
}
}
}, ownerState.size === 'small' && {
padding: '8.5px 14px'
}, ownerState.multiline && {
padding: 0
}, ownerState.startAdornment && {
paddingLeft: 0
}, ownerState.endAdornment && {
paddingRight: 0
}));
const OutlinedInput = /*#__PURE__*/reactExports.forwardRef(function OutlinedInput(inProps, ref) {
var _ref, _slots$root, _ref2, _slots$input, _React$Fragment;
const props = useThemeProps({
props: inProps,
name: 'MuiOutlinedInput'
});
const {
components = {},
fullWidth = false,
inputComponent = 'input',
label,
multiline = false,
notched,
slots = {},
type = 'text'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$7);
const classes = useUtilityClasses$6(props);
const muiFormControl = useFormControl();
const fcs = formControlState({
props,
muiFormControl,
states: ['required']
});
const ownerState = _extends({}, props, {
color: fcs.color || 'primary',
disabled: fcs.disabled,
error: fcs.error,
focused: fcs.focused,
formControl: muiFormControl,
fullWidth,
hiddenLabel: fcs.hiddenLabel,
multiline,
size: fcs.size,
type
});
const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : OutlinedInputRoot;
const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : OutlinedInputInput;
return /*#__PURE__*/jsx(InputBase$1, _extends({
slots: {
root: RootSlot,
input: InputSlot
},
renderSuffix: state => /*#__PURE__*/jsx(NotchedOutlineRoot, {
ownerState: ownerState,
className: classes.notchedOutline,
label: label != null && label !== '' && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [label, "\xA0", '*']
})) : label,
notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused)
}),
fullWidth: fullWidth,
inputComponent: inputComponent,
multiline: multiline,
ref: ref,
type: type
}, other, {
classes: _extends({}, classes, {
notchedOutline: null
})
}));
});
OutlinedInput.muiName = 'Input';
const OutlinedInput$1 = OutlinedInput;
function getScopedCssBaselineUtilityClass(slot) {
return generateUtilityClass('MuiScopedCssBaseline', slot);
}
generateUtilityClasses('MuiScopedCssBaseline', ['root']);
const _excluded$6 = ["className", "component", "enableColorScheme"];
const useUtilityClasses$5 = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root']
};
return composeClasses(slots, getScopedCssBaselineUtilityClass, classes);
};
const ScopedCssBaselineRoot = styled$1('div', {
name: 'MuiScopedCssBaseline',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})(({
theme,
ownerState
}) => {
const colorSchemeStyles = {};
if (ownerState.enableColorScheme && theme.colorSchemes) {
Object.entries(theme.colorSchemes).forEach(([key, scheme]) => {
var _scheme$palette;
colorSchemeStyles[`&${theme.getColorSchemeSelector(key).replace(/\s*&/, '')}`] = {
colorScheme: (_scheme$palette = scheme.palette) == null ? void 0 : _scheme$palette.mode
};
});
}
return _extends({}, html(theme, ownerState.enableColorScheme), body(theme), {
'& *, & *::before, & *::after': {
boxSizing: 'inherit'
},
'& strong, & b': {
fontWeight: theme.typography.fontWeightBold
}
}, colorSchemeStyles);
});
const ScopedCssBaseline = /*#__PURE__*/reactExports.forwardRef(function ScopedCssBaseline(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiScopedCssBaseline'
});
const {
className,
component = 'div'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$6);
const ownerState = _extends({}, props, {
component
});
const classes = useUtilityClasses$5(ownerState);
return /*#__PURE__*/jsx(ScopedCssBaselineRoot, _extends({
as: component,
className: clsx(classes.root, className),
ref: ref,
ownerState: ownerState
}, other));
});
const ScopedCssBaseline$1 = ScopedCssBaseline;
function getSelectUtilityClasses(slot) {
return generateUtilityClass('MuiSelect', slot);
}
const selectClasses = generateUtilityClasses('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
const selectClasses$1 = selectClasses;
var _span;
const _excluded$5 = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
const SelectSelect = styled$1('div', {
name: 'MuiSelect',
slot: 'Select',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [
// Win specificity over the input base
{
[`&.${selectClasses$1.select}`]: styles.select
}, {
[`&.${selectClasses$1.select}`]: styles[ownerState.variant]
}, {
[`&.${selectClasses$1.multiple}`]: styles.multiple
}];
}
})(nativeSelectSelectStyles, {
// Win specificity over the input base
[`&.${selectClasses$1.select}`]: {
height: 'auto',
// Resets for multiple select with chips
minHeight: '1.4375em',
// Required for select\text-field height consistency
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
overflow: 'hidden'
}
});
const SelectIcon = styled$1('svg', {
name: 'MuiSelect',
slot: 'Icon',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
}
})(nativeSelectIconStyles);
const SelectNativeInput = styled$1('input', {
shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'classes',
name: 'MuiSelect',
slot: 'NativeInput',
overridesResolver: (props, styles) => styles.nativeInput
})({
bottom: 0,
left: 0,
position: 'absolute',
opacity: 0,
pointerEvents: 'none',
width: '100%',
boxSizing: 'border-box'
});
function areEqualValues(a, b) {
if (typeof b === 'object' && b !== null) {
return a === b;
}
// The value could be a number, the DOM will stringify it anyway.
return String(a) === String(b);
}
function isEmpty(display) {
return display == null || typeof display === 'string' && !display.trim();
}
const useUtilityClasses$4 = ownerState => {
const {
classes,
variant,
disabled,
multiple,
open
} = ownerState;
const slots = {
select: ['select', variant, disabled && 'disabled', multiple && 'multiple'],
icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled'],
nativeInput: ['nativeInput']
};
return composeClasses(slots, getSelectUtilityClasses, classes);
};
/**
* @ignore - internal component.
*/
const SelectInput = /*#__PURE__*/reactExports.forwardRef(function SelectInput(props, ref) {
const {
'aria-describedby': ariaDescribedby,
'aria-label': ariaLabel,
autoFocus,
autoWidth,
children,
className,
defaultOpen,
defaultValue,
disabled,
displayEmpty,
IconComponent,
inputRef: inputRefProp,
labelId,
MenuProps = {},
multiple,
name,
onBlur,
onChange,
onClose,
onFocus,
onOpen,
open: openProp,
readOnly,
renderValue,
SelectDisplayProps = {},
tabIndex: tabIndexProp,
value: valueProp,
variant = 'standard'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$5);
const [value, setValueState] = useControlled({
controlled: valueProp,
default: defaultValue,
name: 'Select'
});
const [openState, setOpenState] = useControlled({
controlled: openProp,
default: defaultOpen,
name: 'Select'
});
const inputRef = reactExports.useRef(null);
const displayRef = reactExports.useRef(null);
const [displayNode, setDisplayNode] = reactExports.useState(null);
const {
current: isOpenControlled
} = reactExports.useRef(openProp != null);
const [menuMinWidthState, setMenuMinWidthState] = reactExports.useState();
const handleRef = useForkRef(ref, inputRefProp);
const handleDisplayRef = reactExports.useCallback(node => {
displayRef.current = node;
if (node) {
setDisplayNode(node);
}
}, []);
const anchorElement = displayNode == null ? void 0 : displayNode.parentNode;
reactExports.useImperativeHandle(handleRef, () => ({
focus: () => {
displayRef.current.focus();
},
node: inputRef.current,
value
}), [value]);
// Resize menu on `defaultOpen` automatic toggle.
reactExports.useEffect(() => {
if (defaultOpen && openState && displayNode && !isOpenControlled) {
setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
displayRef.current.focus();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [displayNode, autoWidth]);
// `isOpenControlled` is ignored because the component should never switch between controlled and uncontrolled modes.
// `defaultOpen` and `openState` are ignored to avoid unnecessary callbacks.
reactExports.useEffect(() => {
if (autoFocus) {
displayRef.current.focus();
}
}, [autoFocus]);
reactExports.useEffect(() => {
if (!labelId) {
return undefined;
}
const label = ownerDocument(displayRef.current).getElementById(labelId);
if (label) {
const handler = () => {
if (getSelection().isCollapsed) {
displayRef.current.focus();
}
};
label.addEventListener('click', handler);
return () => {
label.removeEventListener('click', handler);
};
}
return undefined;
}, [labelId]);
const update = (open, event) => {
if (open) {
if (onOpen) {
onOpen(event);
}
} else if (onClose) {
onClose(event);
}
if (!isOpenControlled) {
setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
setOpenState(open);
}
};
const handleMouseDown = event => {
// Ignore everything but left-click
if (event.button !== 0) {
return;
}
// Hijack the default focus behavior.
event.preventDefault();
displayRef.current.focus();
update(true, event);
};
const handleClose = event => {
update(false, event);
};
const childrenArray = reactExports.Children.toArray(children);
// Support autofill.
const handleChange = event => {
const index = childrenArray.map(child => child.props.value).indexOf(event.target.value);
if (index === -1) {
return;
}
const child = childrenArray[index];
setValueState(child.props.value);
if (onChange) {
onChange(event, child);
}
};
const handleItemClick = child => event => {
let newValue;
// We use the tabindex attribute to signal the available options.
if (!event.currentTarget.hasAttribute('tabindex')) {
return;
}
if (multiple) {
newValue = Array.isArray(value) ? value.slice() : [];
const itemIndex = value.indexOf(child.props.value);
if (itemIndex === -1) {
newValue.push(child.props.value);
} else {
newValue.splice(itemIndex, 1);
}
} else {
newValue = child.props.value;
}
if (child.props.onClick) {
child.props.onClick(event);
}
if (value !== newValue) {
setValueState(newValue);
if (onChange) {
// Redefine target to allow name and value to be read.
// This allows seamless integration with the most popular form libraries.
// https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
// Clone the event to not override `target` of the original event.
const nativeEvent = event.nativeEvent || event;
const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
Object.defineProperty(clonedEvent, 'target', {
writable: true,
value: {
value: newValue,
name
}
});
onChange(clonedEvent, child);
}
}
if (!multiple) {
update(false, event);
}
};
const handleKeyDown = event => {
if (!readOnly) {
const validKeys = [' ', 'ArrowUp', 'ArrowDown',
// The native select doesn't respond to enter on macOS, but it's recommended by
// https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-select-only.html
'Enter'];
if (validKeys.indexOf(event.key) !== -1) {
event.preventDefault();
update(true, event);
}
}
};
const open = displayNode !== null && openState;
const handleBlur = event => {
// if open event.stopImmediatePropagation
if (!open && onBlur) {
// Preact support, target is read only property on a native event.
Object.defineProperty(event, 'target', {
writable: true,
value: {
value,
name
}
});
onBlur(event);
}
};
delete other['aria-invalid'];
let display;
let displaySingle;
const displayMultiple = [];
let computeDisplay = false;
// No need to display any value if the field is empty.
if (isFilled({
value
}) || displayEmpty) {
if (renderValue) {
display = renderValue(value);
} else {
computeDisplay = true;
}
}
const items = childrenArray.map((child, index, arr) => {
var _arr$, _arr$$props, _arr$2, _arr$2$props;
if (! /*#__PURE__*/reactExports.isValidElement(child)) {
return null;
}
let selected;
if (multiple) {
if (!Array.isArray(value)) {
throw new Error(formatMuiErrorMessage(2));
}
selected = value.some(v => areEqualValues(v, child.props.value));
if (selected && computeDisplay) {
displayMultiple.push(child.props.children);
}
} else {
selected = areEqualValues(value, child.props.value);
if (selected && computeDisplay) {
displaySingle = child.props.children;
}
}
if (child.props.value === undefined) {
return /*#__PURE__*/reactExports.cloneElement(child, {
'aria-readonly': true,
role: 'option'
});
}
const isFirstSelectableElement = () => {
if (value) {
return selected;
}
const firstSelectableElement = arr.find(item => {
var _item$props;
return (item == null ? void 0 : (_item$props = item.props) == null ? void 0 : _item$props.value) !== undefined && item.props.disabled !== true;
});
if (child === firstSelectableElement) {
return true;
}
return selected;
};
return /*#__PURE__*/reactExports.cloneElement(child, {
'aria-selected': selected ? 'true' : 'false',
onClick: handleItemClick(child),
onKeyUp: event => {
if (event.key === ' ') {
// otherwise our MenuItems dispatches a click event
// it's not behavior of the native <option> and causes
// the select to close immediately since we open on space keydown
event.preventDefault();
}
if (child.props.onKeyUp) {
child.props.onKeyUp(event);
}
},
role: 'option',
selected: ((_arr$ = arr[0]) == null ? void 0 : (_arr$$props = _arr$.props) == null ? void 0 : _arr$$props.value) === undefined || ((_arr$2 = arr[0]) == null ? void 0 : (_arr$2$props = _arr$2.props) == null ? void 0 : _arr$2$props.disabled) === true ? isFirstSelectableElement() : selected,
value: undefined,
// The value is most likely not a valid HTML attribute.
'data-value': child.props.value // Instead, we provide it as a data attribute.
});
});
if (computeDisplay) {
if (multiple) {
if (displayMultiple.length === 0) {
display = null;
} else {
display = displayMultiple.reduce((output, child, index) => {
output.push(child);
if (index < displayMultiple.length - 1) {
output.push(', ');
}
return output;
}, []);
}
} else {
display = displaySingle;
}
}
// Avoid performing a layout computation in the render method.
let menuMinWidth = menuMinWidthState;
if (!autoWidth && isOpenControlled && displayNode) {
menuMinWidth = anchorElement.clientWidth;
}
let tabIndex;
if (typeof tabIndexProp !== 'undefined') {
tabIndex = tabIndexProp;
} else {
tabIndex = disabled ? null : 0;
}
const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
const ownerState = _extends({}, props, {
variant,
value,
open
});
const classes = useUtilityClasses$4(ownerState);
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/jsx(SelectSelect, _extends({
ref: handleDisplayRef,
tabIndex: tabIndex,
role: "button",
"aria-disabled": disabled ? 'true' : undefined,
"aria-expanded": open ? 'true' : 'false',
"aria-haspopup": "listbox",
"aria-label": ariaLabel,
"aria-labelledby": [labelId, buttonId].filter(Boolean).join(' ') || undefined,
"aria-describedby": ariaDescribedby,
onKeyDown: handleKeyDown,
onMouseDown: disabled || readOnly ? null : handleMouseDown,
onBlur: handleBlur,
onFocus: onFocus
}, SelectDisplayProps, {
ownerState: ownerState,
className: clsx(SelectDisplayProps.className, classes.select, className)
// The id is required for proper a11y
,
id: buttonId,
children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
_span || (_span = /*#__PURE__*/jsx("span", {
className: "notranslate",
children: "\u200B"
})) : display
})), /*#__PURE__*/jsx(SelectNativeInput, _extends({
value: Array.isArray(value) ? value.join(',') : value,
name: name,
ref: inputRef,
"aria-hidden": true,
onChange: handleChange,
tabIndex: -1,
disabled: disabled,
className: classes.nativeInput,
autoFocus: autoFocus,
ownerState: ownerState
}, other)), /*#__PURE__*/jsx(SelectIcon, {
as: IconComponent,
className: classes.icon,
ownerState: ownerState
}), /*#__PURE__*/jsx(Menu$1, _extends({
id: `menu-${name || ''}`,
anchorEl: anchorElement,
open: open,
onClose: handleClose,
anchorOrigin: {
vertical: 'bottom',
horizontal: 'center'
},
transformOrigin: {
vertical: 'top',
horizontal: 'center'
}
}, MenuProps, {
MenuListProps: _extends({
'aria-labelledby': labelId,
role: 'listbox',
disableListWrap: true
}, MenuProps.MenuListProps),
PaperProps: _extends({}, MenuProps.PaperProps, {
style: _extends({
minWidth: menuMinWidth
}, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
}),
children: items
}))]
});
});
const SelectInput$1 = SelectInput;
var _StyledInput, _StyledFilledInput;
const _excluded$4 = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
const useUtilityClasses$3 = ownerState => {
const {
classes
} = ownerState;
return classes;
};
const styledRootConfig = {
name: 'MuiSelect',
overridesResolver: (props, styles) => styles.root,
shouldForwardProp: prop => rootShouldForwardProp(prop) && prop !== 'variant',
slot: 'Root'
};
const StyledInput = styled$1(Input$1, styledRootConfig)('');
const StyledOutlinedInput = styled$1(OutlinedInput$1, styledRootConfig)('');
const StyledFilledInput = styled$1(FilledInput$1, styledRootConfig)('');
const Select = /*#__PURE__*/reactExports.forwardRef(function Select(inProps, ref) {
const props = useThemeProps({
name: 'MuiSelect',
props: inProps
});
const {
autoWidth = false,
children,
classes: classesProp = {},
className,
defaultOpen = false,
displayEmpty = false,
IconComponent = ArrowDropDownIcon,
id,
input,
inputProps,
label,
labelId,
MenuProps,
multiple = false,
native = false,
onClose,
onOpen,
open,
renderValue,
SelectDisplayProps,
variant: variantProp = 'outlined'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$4);
const inputComponent = native ? NativeSelectInput$1 : SelectInput$1;
const muiFormControl = useFormControl();
const fcs = formControlState({
props,
muiFormControl,
states: ['variant']
});
const variant = fcs.variant || variantProp;
const InputComponent = input || {
standard: _StyledInput || (_StyledInput = /*#__PURE__*/jsx(StyledInput, {})),
outlined: /*#__PURE__*/jsx(StyledOutlinedInput, {
label: label
}),
filled: _StyledFilledInput || (_StyledFilledInput = /*#__PURE__*/jsx(StyledFilledInput, {}))
}[variant];
const ownerState = _extends({}, props, {
variant,
classes: classesProp
});
const classes = useUtilityClasses$3(ownerState);
const inputComponentRef = useForkRef(ref, InputComponent.ref);
return /*#__PURE__*/jsx(reactExports.Fragment, {
children: /*#__PURE__*/reactExports.cloneElement(InputComponent, _extends({
// Most of the logic is implemented in `SelectInput`.
// The `Select` component is a simple API wrapper to expose something better to play with.
inputComponent,
inputProps: _extends({
children,
IconComponent,
variant,
type: undefined,
// We render a select. We can ignore the type provided by the `Input`.
multiple
}, native ? {
id
} : {
autoWidth,
defaultOpen,
displayEmpty,
labelId,
MenuProps,
onClose,
onOpen,
open,
renderValue,
SelectDisplayProps: _extends({
id
}, SelectDisplayProps)
}, inputProps, {
classes: inputProps ? deepmerge(classes, inputProps.classes) : classes
}, input ? input.props.inputProps : {})
}, multiple && native && variant === 'outlined' ? {
notched: true
} : {}, {
ref: inputComponentRef,
className: clsx(InputComponent.props.className, className)
}, !input && {
variant
}, other))
});
});
Select.muiName = 'Select';
const Select$1 = Select;
function getSliderUtilityClass(slot) {
return generateUtilityClass('MuiSlider', slot);
}
const sliderClasses = generateUtilityClasses('MuiSlider', ['root', 'active', 'colorPrimary', 'colorSecondary', 'disabled', 'dragging', 'focusVisible', 'mark', 'markActive', 'marked', 'markLabel', 'markLabelActive', 'rail', 'sizeSmall', 'thumb', 'thumbColorPrimary', 'thumbColorSecondary', 'track', 'trackInverted', 'trackFalse', 'thumbSizeSmall', 'valueLabel', 'valueLabelOpen', 'valueLabelCircle', 'valueLabelLabel', 'vertical']);
const sliderClasses$1 = sliderClasses;
const useValueLabelClasses = props => {
const {
open
} = props;
const utilityClasses = {
offset: clsx(open && sliderClasses$1.valueLabelOpen),
circle: sliderClasses$1.valueLabelCircle,
label: sliderClasses$1.valueLabelLabel
};
return utilityClasses;
};
/**
* @ignore - internal component.
*/
function SliderValueLabel(props) {
const {
children,
className,
value
} = props;
const classes = useValueLabelClasses(props);
if (!children) {
return null;
}
return /*#__PURE__*/reactExports.cloneElement(children, {
className: clsx(children.props.className)
}, /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [children.props.children, /*#__PURE__*/jsx("span", {
className: clsx(classes.offset, className),
"aria-hidden": true,
children: /*#__PURE__*/jsx("span", {
className: classes.circle,
children: /*#__PURE__*/jsx("span", {
className: classes.label,
children: value
})
})
})]
}));
}
const _excluded$3 = ["aria-label", "aria-valuetext", "aria-labelledby", "component", "components", "componentsProps", "color", "classes", "className", "disableSwap", "disabled", "getAriaLabel", "getAriaValueText", "marks", "max", "min", "name", "onChange", "onChangeCommitted", "orientation", "size", "step", "scale", "slotProps", "slots", "tabIndex", "track", "value", "valueLabelDisplay", "valueLabelFormat"];
const valueToPercent = (value, min, max) => (value - min) * 100 / (max - min);
function Identity(x) {
return x;
}
const SliderRoot = styled$1('span', {
name: 'MuiSlider',
slot: 'Root',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.root, styles[`color${capitalize(ownerState.color)}`], ownerState.size !== 'medium' && styles[`size${capitalize(ownerState.size)}`], ownerState.marked && styles.marked, ownerState.orientation === 'vertical' && styles.vertical, ownerState.track === 'inverted' && styles.trackInverted, ownerState.track === false && styles.trackFalse];
}
})(({
theme,
ownerState
}) => _extends({
borderRadius: 12,
boxSizing: 'content-box',
display: 'inline-block',
position: 'relative',
cursor: 'pointer',
touchAction: 'none',
color: (theme.vars || theme).palette[ownerState.color].main,
WebkitTapHighlightColor: 'transparent'
}, ownerState.orientation === 'horizontal' && _extends({
height: 4,
width: '100%',
padding: '13px 0',
// The primary input mechanism of the device includes a pointing device of limited accuracy.
'@media (pointer: coarse)': {
// Reach 42px touch target, about ~8mm on screen.
padding: '20px 0'
}
}, ownerState.size === 'small' && {
height: 2
}, ownerState.marked && {
marginBottom: 20
}), ownerState.orientation === 'vertical' && _extends({
height: '100%',
width: 4,
padding: '0 13px',
// The primary input mechanism of the device includes a pointing device of limited accuracy.
'@media (pointer: coarse)': {
// Reach 42px touch target, about ~8mm on screen.
padding: '0 20px'
}
}, ownerState.size === 'small' && {
width: 2
}, ownerState.marked && {
marginRight: 44
}), {
'@media print': {
colorAdjust: 'exact'
},
[`&.${sliderClasses$1.disabled}`]: {
pointerEvents: 'none',
cursor: 'default',
color: (theme.vars || theme).palette.grey[400]
},
[`&.${sliderClasses$1.dragging}`]: {
[`& .${sliderClasses$1.thumb}, & .${sliderClasses$1.track}`]: {
transition: 'none'
}
}
}));
const SliderRail = styled$1('span', {
name: 'MuiSlider',
slot: 'Rail',
overridesResolver: (props, styles) => styles.rail
})(({
ownerState
}) => _extends({
display: 'block',
position: 'absolute',
borderRadius: 'inherit',
backgroundColor: 'currentColor',
opacity: 0.38
}, ownerState.orientation === 'horizontal' && {
width: '100%',
height: 'inherit',
top: '50%',
transform: 'translateY(-50%)'
}, ownerState.orientation === 'vertical' && {
height: '100%',
width: 'inherit',
left: '50%',
transform: 'translateX(-50%)'
}, ownerState.track === 'inverted' && {
opacity: 1
}));
const SliderTrack = styled$1('span', {
name: 'MuiSlider',
slot: 'Track',
overridesResolver: (props, styles) => styles.track
})(({
theme,
ownerState
}) => {
const color =
// Same logic as the LinearProgress track color
theme.palette.mode === 'light' ? lighten(theme.palette[ownerState.color].main, 0.62) : darken(theme.palette[ownerState.color].main, 0.5);
return _extends({
display: 'block',
position: 'absolute',
borderRadius: 'inherit',
border: '1px solid currentColor',
backgroundColor: 'currentColor',
transition: theme.transitions.create(['left', 'width', 'bottom', 'height'], {
duration: theme.transitions.duration.shortest
})
}, ownerState.size === 'small' && {
border: 'none'
}, ownerState.orientation === 'horizontal' && {
height: 'inherit',
top: '50%',
transform: 'translateY(-50%)'
}, ownerState.orientation === 'vertical' && {
width: 'inherit',
left: '50%',
transform: 'translateX(-50%)'
}, ownerState.track === false && {
display: 'none'
}, ownerState.track === 'inverted' && {
backgroundColor: theme.vars ? theme.vars.palette.Slider[`${ownerState.color}Track`] : color,
borderColor: theme.vars ? theme.vars.palette.Slider[`${ownerState.color}Track`] : color
});
});
const SliderThumb = styled$1('span', {
name: 'MuiSlider',
slot: 'Thumb',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.thumb, styles[`thumbColor${capitalize(ownerState.color)}`], ownerState.size !== 'medium' && styles[`thumbSize${capitalize(ownerState.size)}`]];
}
})(({
theme,
ownerState
}) => _extends({
position: 'absolute',
width: 20,
height: 20,
boxSizing: 'border-box',
borderRadius: '50%',
outline: 0,
backgroundColor: 'currentColor',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
transition: theme.transitions.create(['box-shadow', 'left', 'bottom'], {
duration: theme.transitions.duration.shortest
})
}, ownerState.size === 'small' && {
width: 12,
height: 12
}, ownerState.orientation === 'horizontal' && {
top: '50%',
transform: 'translate(-50%, -50%)'
}, ownerState.orientation === 'vertical' && {
left: '50%',
transform: 'translate(-50%, 50%)'
}, {
'&:before': _extends({
position: 'absolute',
content: '""',
borderRadius: 'inherit',
width: '100%',
height: '100%',
boxShadow: (theme.vars || theme).shadows[2]
}, ownerState.size === 'small' && {
boxShadow: 'none'
}),
'&::after': {
position: 'absolute',
content: '""',
borderRadius: '50%',
// 42px is the hit target
width: 42,
height: 42,
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)'
},
[`&:hover, &.${sliderClasses$1.focusVisible}`]: {
boxShadow: `0px 0px 0px 8px ${theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.16)` : alpha(theme.palette[ownerState.color].main, 0.16)}`,
'@media (hover: none)': {
boxShadow: 'none'
}
},
[`&.${sliderClasses$1.active}`]: {
boxShadow: `0px 0px 0px 14px ${theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.16)` : alpha(theme.palette[ownerState.color].main, 0.16)}`
},
[`&.${sliderClasses$1.disabled}`]: {
'&:hover': {
boxShadow: 'none'
}
}
}));
const StyledSliderValueLabel = styled$1(SliderValueLabel, {
name: 'MuiSlider',
slot: 'ValueLabel',
overridesResolver: (props, styles) => styles.valueLabel
})(({
theme,
ownerState
}) => _extends({
[`&.${sliderClasses$1.valueLabelOpen}`]: {
transform: 'translateY(-100%) scale(1)'
},
zIndex: 1,
whiteSpace: 'nowrap'
}, theme.typography.body2, {
fontWeight: 500,
transition: theme.transitions.create(['transform'], {
duration: theme.transitions.duration.shortest
}),
transform: 'translateY(-100%) scale(0)',
position: 'absolute',
backgroundColor: (theme.vars || theme).palette.grey[600],
borderRadius: 2,
color: (theme.vars || theme).palette.common.white,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
padding: '0.25rem 0.75rem'
}, ownerState.orientation === 'horizontal' && {
top: '-10px',
transformOrigin: 'bottom center',
'&:before': {
position: 'absolute',
content: '""',
width: 8,
height: 8,
transform: 'translate(-50%, 50%) rotate(45deg)',
backgroundColor: 'inherit',
bottom: 0,
left: '50%'
}
}, ownerState.orientation === 'vertical' && {
right: '30px',
top: '24px',
transformOrigin: 'right center',
'&:before': {
position: 'absolute',
content: '""',
width: 8,
height: 8,
transform: 'translate(-50%, 50%) rotate(45deg)',
backgroundColor: 'inherit',
right: '-20%',
top: '25%'
}
}, ownerState.size === 'small' && {
fontSize: theme.typography.pxToRem(12),
padding: '0.25rem 0.5rem'
}));
const SliderMark = styled$1('span', {
name: 'MuiSlider',
slot: 'Mark',
shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'markActive',
overridesResolver: (props, styles) => {
const {
markActive
} = props;
return [styles.mark, markActive && styles.markActive];
}
})(({
theme,
ownerState,
markActive
}) => _extends({
position: 'absolute',
width: 2,
height: 2,
borderRadius: 1,
backgroundColor: 'currentColor'
}, ownerState.orientation === 'horizontal' && {
top: '50%',
transform: 'translate(-1px, -50%)'
}, ownerState.orientation === 'vertical' && {
left: '50%',
transform: 'translate(-50%, 1px)'
}, markActive && {
backgroundColor: (theme.vars || theme).palette.background.paper,
opacity: 0.8
}));
const SliderMarkLabel = styled$1('span', {
name: 'MuiSlider',
slot: 'MarkLabel',
shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'markLabelActive',
overridesResolver: (props, styles) => styles.markLabel
})(({
theme,
ownerState,
markLabelActive
}) => _extends({}, theme.typography.body2, {
color: (theme.vars || theme).palette.text.secondary,
position: 'absolute',
whiteSpace: 'nowrap'
}, ownerState.orientation === 'horizontal' && {
top: 30,
transform: 'translateX(-50%)',
'@media (pointer: coarse)': {
top: 40
}
}, ownerState.orientation === 'vertical' && {
left: 36,
transform: 'translateY(50%)',
'@media (pointer: coarse)': {
left: 44
}
}, markLabelActive && {
color: (theme.vars || theme).palette.text.primary
}));
const useUtilityClasses$2 = ownerState => {
const {
disabled,
dragging,
marked,
orientation,
track,
classes,
color,
size
} = ownerState;
const slots = {
root: ['root', disabled && 'disabled', dragging && 'dragging', marked && 'marked', orientation === 'vertical' && 'vertical', track === 'inverted' && 'trackInverted', track === false && 'trackFalse', color && `color${capitalize(color)}`, size && `size${capitalize(size)}`],
rail: ['rail'],
track: ['track'],
mark: ['mark'],
markActive: ['markActive'],
markLabel: ['markLabel'],
markLabelActive: ['markLabelActive'],
valueLabel: ['valueLabel'],
thumb: ['thumb', disabled && 'disabled', size && `thumbSize${capitalize(size)}`, color && `thumbColor${capitalize(color)}`],
active: ['active'],
disabled: ['disabled'],
focusVisible: ['focusVisible']
};
return composeClasses(slots, getSliderUtilityClass, classes);
};
const Forward = ({
children
}) => children;
const Slider = /*#__PURE__*/reactExports.forwardRef(function Slider(inputProps, ref) {
var _ref, _slots$root, _ref2, _slots$rail, _ref3, _slots$track, _ref4, _slots$thumb, _ref5, _slots$valueLabel, _ref6, _slots$mark, _ref7, _slots$markLabel, _ref8, _slots$input, _slotProps$root, _slotProps$rail, _slotProps$track, _slotProps$thumb, _slotProps$valueLabel, _slotProps$mark, _slotProps$markLabel, _slotProps$input;
const props = useThemeProps({
props: inputProps,
name: 'MuiSlider'
});
const theme = useTheme();
const isRtl = theme.direction === 'rtl';
const {
'aria-label': ariaLabel,
'aria-valuetext': ariaValuetext,
'aria-labelledby': ariaLabelledby,
// eslint-disable-next-line react/prop-types
component = 'span',
components = {},
componentsProps = {},
color = 'primary',
classes: classesProp,
// eslint-disable-next-line react/prop-types
className,
disableSwap = false,
disabled = false,
getAriaLabel,
getAriaValueText,
marks: marksProp = false,
max = 100,
min = 0,
orientation = 'horizontal',
size = 'medium',
step = 1,
scale = Identity,
slotProps,
slots,
track = 'normal',
valueLabelDisplay = 'off',
valueLabelFormat = Identity
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$3);
const ownerState = _extends({}, props, {
isRtl,
max,
min,
classes: classesProp,
disabled,
disableSwap,
orientation,
marks: marksProp,
color,
size,
step,
scale,
track,
valueLabelDisplay,
valueLabelFormat
});
const {
axisProps,
getRootProps,
getHiddenInputProps,
getThumbProps,
open,
active,
axis,
focusedThumbIndex,
range,
dragging,
marks,
values,
trackOffset,
trackLeap
} = useSlider(_extends({}, ownerState, {
ref
}));
ownerState.marked = marks.length > 0 && marks.some(mark => mark.label);
ownerState.dragging = dragging;
ownerState.focusedThumbIndex = focusedThumbIndex;
const classes = useUtilityClasses$2(ownerState);
// support both `slots` and `components` for backward compatibility
const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : SliderRoot;
const RailSlot = (_ref2 = (_slots$rail = slots == null ? void 0 : slots.rail) != null ? _slots$rail : components.Rail) != null ? _ref2 : SliderRail;
const TrackSlot = (_ref3 = (_slots$track = slots == null ? void 0 : slots.track) != null ? _slots$track : components.Track) != null ? _ref3 : SliderTrack;
const ThumbSlot = (_ref4 = (_slots$thumb = slots == null ? void 0 : slots.thumb) != null ? _slots$thumb : components.Thumb) != null ? _ref4 : SliderThumb;
const ValueLabelSlot = (_ref5 = (_slots$valueLabel = slots == null ? void 0 : slots.valueLabel) != null ? _slots$valueLabel : components.ValueLabel) != null ? _ref5 : StyledSliderValueLabel;
const MarkSlot = (_ref6 = (_slots$mark = slots == null ? void 0 : slots.mark) != null ? _slots$mark : components.Mark) != null ? _ref6 : SliderMark;
const MarkLabelSlot = (_ref7 = (_slots$markLabel = slots == null ? void 0 : slots.markLabel) != null ? _slots$markLabel : components.MarkLabel) != null ? _ref7 : SliderMarkLabel;
const InputSlot = (_ref8 = (_slots$input = slots == null ? void 0 : slots.input) != null ? _slots$input : components.Input) != null ? _ref8 : 'input';
const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
const railSlotProps = (_slotProps$rail = slotProps == null ? void 0 : slotProps.rail) != null ? _slotProps$rail : componentsProps.rail;
const trackSlotProps = (_slotProps$track = slotProps == null ? void 0 : slotProps.track) != null ? _slotProps$track : componentsProps.track;
const thumbSlotProps = (_slotProps$thumb = slotProps == null ? void 0 : slotProps.thumb) != null ? _slotProps$thumb : componentsProps.thumb;
const valueLabelSlotProps = (_slotProps$valueLabel = slotProps == null ? void 0 : slotProps.valueLabel) != null ? _slotProps$valueLabel : componentsProps.valueLabel;
const markSlotProps = (_slotProps$mark = slotProps == null ? void 0 : slotProps.mark) != null ? _slotProps$mark : componentsProps.mark;
const markLabelSlotProps = (_slotProps$markLabel = slotProps == null ? void 0 : slotProps.markLabel) != null ? _slotProps$markLabel : componentsProps.markLabel;
const inputSlotProps = (_slotProps$input = slotProps == null ? void 0 : slotProps.input) != null ? _slotProps$input : componentsProps.input;
const rootProps = useSlotProps({
elementType: RootSlot,
getSlotProps: getRootProps,
externalSlotProps: rootSlotProps,
externalForwardedProps: other,
additionalProps: _extends({}, shouldSpreadAdditionalProps$1(RootSlot) && {
as: component
}),
ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
className: [classes.root, className]
});
const railProps = useSlotProps({
elementType: RailSlot,
externalSlotProps: railSlotProps,
ownerState,
className: classes.rail
});
const trackProps = useSlotProps({
elementType: TrackSlot,
externalSlotProps: trackSlotProps,
additionalProps: {
style: _extends({}, axisProps[axis].offset(trackOffset), axisProps[axis].leap(trackLeap))
},
ownerState: _extends({}, ownerState, trackSlotProps == null ? void 0 : trackSlotProps.ownerState),
className: classes.track
});
const thumbProps = useSlotProps({
elementType: ThumbSlot,
getSlotProps: getThumbProps,
externalSlotProps: thumbSlotProps,
ownerState: _extends({}, ownerState, thumbSlotProps == null ? void 0 : thumbSlotProps.ownerState)
});
const valueLabelProps = useSlotProps({
elementType: ValueLabelSlot,
externalSlotProps: valueLabelSlotProps,
ownerState: _extends({}, ownerState, valueLabelSlotProps == null ? void 0 : valueLabelSlotProps.ownerState),
className: classes.valueLabel
});
const markProps = useSlotProps({
elementType: MarkSlot,
externalSlotProps: markSlotProps,
ownerState,
className: classes.mark
});
const markLabelProps = useSlotProps({
elementType: MarkLabelSlot,
externalSlotProps: markLabelSlotProps,
ownerState
});
const inputSliderProps = useSlotProps({
elementType: InputSlot,
getSlotProps: getHiddenInputProps,
externalSlotProps: inputSlotProps,
ownerState
});
return /*#__PURE__*/jsxs(RootSlot, _extends({}, rootProps, {
children: [/*#__PURE__*/jsx(RailSlot, _extends({}, railProps)), /*#__PURE__*/jsx(TrackSlot, _extends({}, trackProps)), marks.filter(mark => mark.value >= min && mark.value <= max).map((mark, index) => {
const percent = valueToPercent(mark.value, min, max);
const style = axisProps[axis].offset(percent);
let markActive;
if (track === false) {
markActive = values.indexOf(mark.value) !== -1;
} else {
markActive = track === 'normal' && (range ? mark.value >= values[0] && mark.value <= values[values.length - 1] : mark.value <= values[0]) || track === 'inverted' && (range ? mark.value <= values[0] || mark.value >= values[values.length - 1] : mark.value >= values[0]);
}
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/jsx(MarkSlot, _extends({
"data-index": index
}, markProps, !isHostComponent(MarkSlot) && {
markActive
}, {
style: _extends({}, style, markProps.style),
className: clsx(markProps.className, markActive && classes.markActive)
})), mark.label != null ? /*#__PURE__*/jsx(MarkLabelSlot, _extends({
"aria-hidden": true,
"data-index": index
}, markLabelProps, !isHostComponent(MarkLabelSlot) && {
markLabelActive: markActive
}, {
style: _extends({}, style, markLabelProps.style),
className: clsx(classes.markLabel, markLabelProps.className, markActive && classes.markLabelActive),
children: mark.label
})) : null]
}, index);
}), values.map((value, index) => {
const percent = valueToPercent(value, min, max);
const style = axisProps[axis].offset(percent);
const ValueLabelComponent = valueLabelDisplay === 'off' ? Forward : ValueLabelSlot;
return /*#__PURE__*/jsx(reactExports.Fragment, {
children: /*#__PURE__*/jsx(ValueLabelComponent, _extends({}, !isHostComponent(ValueLabelComponent) && {
valueLabelFormat,
valueLabelDisplay,
value: typeof valueLabelFormat === 'function' ? valueLabelFormat(scale(value), index) : valueLabelFormat,
index,
open: open === index || active === index || valueLabelDisplay === 'on',
disabled
}, valueLabelProps, {
children: /*#__PURE__*/jsx(ThumbSlot, _extends({
"data-index": index,
"data-focusvisible": focusedThumbIndex === index
}, thumbProps, {
className: clsx(classes.thumb, thumbProps.className, active === index && classes.active, focusedThumbIndex === index && classes.focusVisible),
style: _extends({}, style, {
pointerEvents: disableSwap && active !== index ? 'none' : undefined
}, thumbProps.style),
children: /*#__PURE__*/jsx(InputSlot, _extends({
"data-index": index,
"aria-label": getAriaLabel ? getAriaLabel(index) : ariaLabel,
"aria-valuenow": scale(value),
"aria-labelledby": ariaLabelledby,
"aria-valuetext": getAriaValueText ? getAriaValueText(scale(value), index) : ariaValuetext,
value: values[index]
}, inputSliderProps))
}))
}))
}, index);
})]
}));
});
const Slider$1 = Slider;
function getTooltipUtilityClass(slot) {
return generateUtilityClass('MuiTooltip', slot);
}
const tooltipClasses = generateUtilityClasses('MuiTooltip', ['popper', 'popperInteractive', 'popperArrow', 'popperClose', 'tooltip', 'tooltipArrow', 'touch', 'tooltipPlacementLeft', 'tooltipPlacementRight', 'tooltipPlacementTop', 'tooltipPlacementBottom', 'arrow']);
const tooltipClasses$1 = tooltipClasses;
const _excluded$2 = ["arrow", "children", "classes", "components", "componentsProps", "describeChild", "disableFocusListener", "disableHoverListener", "disableInteractive", "disableTouchListener", "enterDelay", "enterNextDelay", "enterTouchDelay", "followCursor", "id", "leaveDelay", "leaveTouchDelay", "onClose", "onOpen", "open", "placement", "PopperComponent", "PopperProps", "slotProps", "slots", "title", "TransitionComponent", "TransitionProps"];
function round(value) {
return Math.round(value * 1e5) / 1e5;
}
const useUtilityClasses$1 = ownerState => {
const {
classes,
disableInteractive,
arrow,
touch,
placement
} = ownerState;
const slots = {
popper: ['popper', !disableInteractive && 'popperInteractive', arrow && 'popperArrow'],
tooltip: ['tooltip', arrow && 'tooltipArrow', touch && 'touch', `tooltipPlacement${capitalize(placement.split('-')[0])}`],
arrow: ['arrow']
};
return composeClasses(slots, getTooltipUtilityClass, classes);
};
const TooltipPopper = styled$1(Popper$1, {
name: 'MuiTooltip',
slot: 'Popper',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.popper, !ownerState.disableInteractive && styles.popperInteractive, ownerState.arrow && styles.popperArrow, !ownerState.open && styles.popperClose];
}
})(({
theme,
ownerState,
open
}) => _extends({
zIndex: (theme.vars || theme).zIndex.tooltip,
pointerEvents: 'none'
}, !ownerState.disableInteractive && {
pointerEvents: 'auto'
}, !open && {
pointerEvents: 'none'
}, ownerState.arrow && {
[`&[data-popper-placement*="bottom"] .${tooltipClasses$1.arrow}`]: {
top: 0,
marginTop: '-0.71em',
'&::before': {
transformOrigin: '0 100%'
}
},
[`&[data-popper-placement*="top"] .${tooltipClasses$1.arrow}`]: {
bottom: 0,
marginBottom: '-0.71em',
'&::before': {
transformOrigin: '100% 0'
}
},
[`&[data-popper-placement*="right"] .${tooltipClasses$1.arrow}`]: _extends({}, !ownerState.isRtl ? {
left: 0,
marginLeft: '-0.71em'
} : {
right: 0,
marginRight: '-0.71em'
}, {
height: '1em',
width: '0.71em',
'&::before': {
transformOrigin: '100% 100%'
}
}),
[`&[data-popper-placement*="left"] .${tooltipClasses$1.arrow}`]: _extends({}, !ownerState.isRtl ? {
right: 0,
marginRight: '-0.71em'
} : {
left: 0,
marginLeft: '-0.71em'
}, {
height: '1em',
width: '0.71em',
'&::before': {
transformOrigin: '0 0'
}
})
}));
const TooltipTooltip = styled$1('div', {
name: 'MuiTooltip',
slot: 'Tooltip',
overridesResolver: (props, styles) => {
const {
ownerState
} = props;
return [styles.tooltip, ownerState.touch && styles.touch, ownerState.arrow && styles.tooltipArrow, styles[`tooltipPlacement${capitalize(ownerState.placement.split('-')[0])}`]];
}
})(({
theme,
ownerState
}) => _extends({
backgroundColor: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.92),
borderRadius: (theme.vars || theme).shape.borderRadius,
color: (theme.vars || theme).palette.common.white,
fontFamily: theme.typography.fontFamily,
padding: '4px 8px',
fontSize: theme.typography.pxToRem(11),
maxWidth: 300,
margin: 2,
wordWrap: 'break-word',
fontWeight: theme.typography.fontWeightMedium
}, ownerState.arrow && {
position: 'relative',
margin: 0
}, ownerState.touch && {
padding: '8px 16px',
fontSize: theme.typography.pxToRem(14),
lineHeight: `${round(16 / 14)}em`,
fontWeight: theme.typography.fontWeightRegular
}, {
[`.${tooltipClasses$1.popper}[data-popper-placement*="left"] &`]: _extends({
transformOrigin: 'right center'
}, !ownerState.isRtl ? _extends({
marginRight: '14px'
}, ownerState.touch && {
marginRight: '24px'
}) : _extends({
marginLeft: '14px'
}, ownerState.touch && {
marginLeft: '24px'
})),
[`.${tooltipClasses$1.popper}[data-popper-placement*="right"] &`]: _extends({
transformOrigin: 'left center'
}, !ownerState.isRtl ? _extends({
marginLeft: '14px'
}, ownerState.touch && {
marginLeft: '24px'
}) : _extends({
marginRight: '14px'
}, ownerState.touch && {
marginRight: '24px'
})),
[`.${tooltipClasses$1.popper}[data-popper-placement*="top"] &`]: _extends({
transformOrigin: 'center bottom',
marginBottom: '14px'
}, ownerState.touch && {
marginBottom: '24px'
}),
[`.${tooltipClasses$1.popper}[data-popper-placement*="bottom"] &`]: _extends({
transformOrigin: 'center top',
marginTop: '14px'
}, ownerState.touch && {
marginTop: '24px'
})
}));
const TooltipArrow = styled$1('span', {
name: 'MuiTooltip',
slot: 'Arrow',
overridesResolver: (props, styles) => styles.arrow
})(({
theme
}) => ({
overflow: 'hidden',
position: 'absolute',
width: '1em',
height: '0.71em' /* = width / sqrt(2) = (length of the hypotenuse) */,
boxSizing: 'border-box',
color: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.9),
'&::before': {
content: '""',
margin: 'auto',
display: 'block',
width: '100%',
height: '100%',
backgroundColor: 'currentColor',
transform: 'rotate(45deg)'
}
}));
let hystersisOpen = false;
let hystersisTimer = null;
let cursorPosition = {
x: 0,
y: 0
};
function composeEventHandler(handler, eventHandler) {
return event => {
if (eventHandler) {
eventHandler(event);
}
handler(event);
};
}
// TODO v6: Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps.
const Tooltip = /*#__PURE__*/reactExports.forwardRef(function Tooltip(inProps, ref) {
var _ref, _slots$popper, _ref2, _ref3, _slots$transition, _ref4, _slots$tooltip, _ref5, _slots$arrow, _slotProps$popper, _ref6, _slotProps$popper2, _slotProps$transition, _slotProps$tooltip, _ref7, _slotProps$tooltip2, _slotProps$arrow, _ref8, _slotProps$arrow2;
const props = useThemeProps({
props: inProps,
name: 'MuiTooltip'
});
const {
arrow = false,
children,
components = {},
componentsProps = {},
describeChild = false,
disableFocusListener = false,
disableHoverListener = false,
disableInteractive: disableInteractiveProp = false,
disableTouchListener = false,
enterDelay = 100,
enterNextDelay = 0,
enterTouchDelay = 700,
followCursor = false,
id: idProp,
leaveDelay = 0,
leaveTouchDelay = 1500,
onClose,
onOpen,
open: openProp,
placement = 'bottom',
PopperComponent: PopperComponentProp,
PopperProps = {},
slotProps = {},
slots = {},
title,
TransitionComponent: TransitionComponentProp = Grow$1,
TransitionProps
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$2);
const theme = useTheme();
const isRtl = theme.direction === 'rtl';
const [childNode, setChildNode] = reactExports.useState();
const [arrowRef, setArrowRef] = reactExports.useState(null);
const ignoreNonTouchEvents = reactExports.useRef(false);
const disableInteractive = disableInteractiveProp || followCursor;
const closeTimer = reactExports.useRef();
const enterTimer = reactExports.useRef();
const leaveTimer = reactExports.useRef();
const touchTimer = reactExports.useRef();
const [openState, setOpenState] = useControlled({
controlled: openProp,
default: false,
name: 'Tooltip',
state: 'open'
});
let open = openState;
const id = useId(idProp);
const prevUserSelect = reactExports.useRef();
const stopTouchInteraction = reactExports.useCallback(() => {
if (prevUserSelect.current !== undefined) {
document.body.style.WebkitUserSelect = prevUserSelect.current;
prevUserSelect.current = undefined;
}
clearTimeout(touchTimer.current);
}, []);
reactExports.useEffect(() => {
return () => {
clearTimeout(closeTimer.current);
clearTimeout(enterTimer.current);
clearTimeout(leaveTimer.current);
stopTouchInteraction();
};
}, [stopTouchInteraction]);
const handleOpen = event => {
clearTimeout(hystersisTimer);
hystersisOpen = true;
// The mouseover event will trigger for every nested element in the tooltip.
// We can skip rerendering when the tooltip is already open.
// We are using the mouseover event instead of the mouseenter event to fix a hide/show issue.
setOpenState(true);
if (onOpen && !open) {
onOpen(event);
}
};
const handleClose = useEventCallback(
/**
* @param {React.SyntheticEvent | Event} event
*/
event => {
clearTimeout(hystersisTimer);
hystersisTimer = setTimeout(() => {
hystersisOpen = false;
}, 800 + leaveDelay);
setOpenState(false);
if (onClose && open) {
onClose(event);
}
clearTimeout(closeTimer.current);
closeTimer.current = setTimeout(() => {
ignoreNonTouchEvents.current = false;
}, theme.transitions.duration.shortest);
});
const handleEnter = event => {
if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
return;
}
// Remove the title ahead of time.
// We don't want to wait for the next render commit.
// We would risk displaying two tooltips at the same time (native + this one).
if (childNode) {
childNode.removeAttribute('title');
}
clearTimeout(enterTimer.current);
clearTimeout(leaveTimer.current);
if (enterDelay || hystersisOpen && enterNextDelay) {
enterTimer.current = setTimeout(() => {
handleOpen(event);
}, hystersisOpen ? enterNextDelay : enterDelay);
} else {
handleOpen(event);
}
};
const handleLeave = event => {
clearTimeout(enterTimer.current);
clearTimeout(leaveTimer.current);
leaveTimer.current = setTimeout(() => {
handleClose(event);
}, leaveDelay);
};
const {
isFocusVisibleRef,
onBlur: handleBlurVisible,
onFocus: handleFocusVisible,
ref: focusVisibleRef
} = useIsFocusVisible();
// We don't necessarily care about the focusVisible state (which is safe to access via ref anyway).
// We just need to re-render the Tooltip if the focus-visible state changes.
const [, setChildIsFocusVisible] = reactExports.useState(false);
const handleBlur = event => {
handleBlurVisible(event);
if (isFocusVisibleRef.current === false) {
setChildIsFocusVisible(false);
handleLeave(event);
}
};
const handleFocus = event => {
// Workaround for https://github.com/facebook/react/issues/7769
// The autoFocus of React might trigger the event before the componentDidMount.
// We need to account for this eventuality.
if (!childNode) {
setChildNode(event.currentTarget);
}
handleFocusVisible(event);
if (isFocusVisibleRef.current === true) {
setChildIsFocusVisible(true);
handleEnter(event);
}
};
const detectTouchStart = event => {
ignoreNonTouchEvents.current = true;
const childrenProps = children.props;
if (childrenProps.onTouchStart) {
childrenProps.onTouchStart(event);
}
};
const handleMouseOver = handleEnter;
const handleMouseLeave = handleLeave;
const handleTouchStart = event => {
detectTouchStart(event);
clearTimeout(leaveTimer.current);
clearTimeout(closeTimer.current);
stopTouchInteraction();
prevUserSelect.current = document.body.style.WebkitUserSelect;
// Prevent iOS text selection on long-tap.
document.body.style.WebkitUserSelect = 'none';
touchTimer.current = setTimeout(() => {
document.body.style.WebkitUserSelect = prevUserSelect.current;
handleEnter(event);
}, enterTouchDelay);
};
const handleTouchEnd = event => {
if (children.props.onTouchEnd) {
children.props.onTouchEnd(event);
}
stopTouchInteraction();
clearTimeout(leaveTimer.current);
leaveTimer.current = setTimeout(() => {
handleClose(event);
}, leaveTouchDelay);
};
reactExports.useEffect(() => {
if (!open) {
return undefined;
}
/**
* @param {KeyboardEvent} nativeEvent
*/
function handleKeyDown(nativeEvent) {
// IE11, Edge (prior to using Bink?) use 'Esc'
if (nativeEvent.key === 'Escape' || nativeEvent.key === 'Esc') {
handleClose(nativeEvent);
}
}
document.addEventListener('keydown', handleKeyDown);
return () => {
document.removeEventListener('keydown', handleKeyDown);
};
}, [handleClose, open]);
const handleRef = useForkRef(children.ref, focusVisibleRef, setChildNode, ref);
// There is no point in displaying an empty tooltip.
if (!title && title !== 0) {
open = false;
}
const popperRef = reactExports.useRef();
const handleMouseMove = event => {
const childrenProps = children.props;
if (childrenProps.onMouseMove) {
childrenProps.onMouseMove(event);
}
cursorPosition = {
x: event.clientX,
y: event.clientY
};
if (popperRef.current) {
popperRef.current.update();
}
};
const nameOrDescProps = {};
const titleIsString = typeof title === 'string';
if (describeChild) {
nameOrDescProps.title = !open && titleIsString && !disableHoverListener ? title : null;
nameOrDescProps['aria-describedby'] = open ? id : null;
} else {
nameOrDescProps['aria-label'] = titleIsString ? title : null;
nameOrDescProps['aria-labelledby'] = open && !titleIsString ? id : null;
}
const childrenProps = _extends({}, nameOrDescProps, other, children.props, {
className: clsx(other.className, children.props.className),
onTouchStart: detectTouchStart,
ref: handleRef
}, followCursor ? {
onMouseMove: handleMouseMove
} : {});
const interactiveWrapperListeners = {};
if (!disableTouchListener) {
childrenProps.onTouchStart = handleTouchStart;
childrenProps.onTouchEnd = handleTouchEnd;
}
if (!disableHoverListener) {
childrenProps.onMouseOver = composeEventHandler(handleMouseOver, childrenProps.onMouseOver);
childrenProps.onMouseLeave = composeEventHandler(handleMouseLeave, childrenProps.onMouseLeave);
if (!disableInteractive) {
interactiveWrapperListeners.onMouseOver = handleMouseOver;
interactiveWrapperListeners.onMouseLeave = handleMouseLeave;
}
}
if (!disableFocusListener) {
childrenProps.onFocus = composeEventHandler(handleFocus, childrenProps.onFocus);
childrenProps.onBlur = composeEventHandler(handleBlur, childrenProps.onBlur);
if (!disableInteractive) {
interactiveWrapperListeners.onFocus = handleFocus;
interactiveWrapperListeners.onBlur = handleBlur;
}
}
const popperOptions = reactExports.useMemo(() => {
var _PopperProps$popperOp;
let tooltipModifiers = [{
name: 'arrow',
enabled: Boolean(arrowRef),
options: {
element: arrowRef,
padding: 4
}
}];
if ((_PopperProps$popperOp = PopperProps.popperOptions) != null && _PopperProps$popperOp.modifiers) {
tooltipModifiers = tooltipModifiers.concat(PopperProps.popperOptions.modifiers);
}
return _extends({}, PopperProps.popperOptions, {
modifiers: tooltipModifiers
});
}, [arrowRef, PopperProps]);
const ownerState = _extends({}, props, {
isRtl,
arrow,
disableInteractive,
placement,
PopperComponentProp,
touch: ignoreNonTouchEvents.current
});
const classes = useUtilityClasses$1(ownerState);
const PopperComponent = (_ref = (_slots$popper = slots.popper) != null ? _slots$popper : components.Popper) != null ? _ref : TooltipPopper;
const TransitionComponent = (_ref2 = (_ref3 = (_slots$transition = slots.transition) != null ? _slots$transition : components.Transition) != null ? _ref3 : TransitionComponentProp) != null ? _ref2 : Grow$1;
const TooltipComponent = (_ref4 = (_slots$tooltip = slots.tooltip) != null ? _slots$tooltip : components.Tooltip) != null ? _ref4 : TooltipTooltip;
const ArrowComponent = (_ref5 = (_slots$arrow = slots.arrow) != null ? _slots$arrow : components.Arrow) != null ? _ref5 : TooltipArrow;
const popperProps = appendOwnerState(PopperComponent, _extends({}, PopperProps, (_slotProps$popper = slotProps.popper) != null ? _slotProps$popper : componentsProps.popper, {
className: clsx(classes.popper, PopperProps == null ? void 0 : PopperProps.className, (_ref6 = (_slotProps$popper2 = slotProps.popper) != null ? _slotProps$popper2 : componentsProps.popper) == null ? void 0 : _ref6.className)
}), ownerState);
const transitionProps = appendOwnerState(TransitionComponent, _extends({}, TransitionProps, (_slotProps$transition = slotProps.transition) != null ? _slotProps$transition : componentsProps.transition), ownerState);
const tooltipProps = appendOwnerState(TooltipComponent, _extends({}, (_slotProps$tooltip = slotProps.tooltip) != null ? _slotProps$tooltip : componentsProps.tooltip, {
className: clsx(classes.tooltip, (_ref7 = (_slotProps$tooltip2 = slotProps.tooltip) != null ? _slotProps$tooltip2 : componentsProps.tooltip) == null ? void 0 : _ref7.className)
}), ownerState);
const tooltipArrowProps = appendOwnerState(ArrowComponent, _extends({}, (_slotProps$arrow = slotProps.arrow) != null ? _slotProps$arrow : componentsProps.arrow, {
className: clsx(classes.arrow, (_ref8 = (_slotProps$arrow2 = slotProps.arrow) != null ? _slotProps$arrow2 : componentsProps.arrow) == null ? void 0 : _ref8.className)
}), ownerState);
return /*#__PURE__*/jsxs(reactExports.Fragment, {
children: [/*#__PURE__*/reactExports.cloneElement(children, childrenProps), /*#__PURE__*/jsx(PopperComponent, _extends({
as: PopperComponentProp != null ? PopperComponentProp : Popper$1,
placement: placement,
anchorEl: followCursor ? {
getBoundingClientRect: () => ({
top: cursorPosition.y,
left: cursorPosition.x,
right: cursorPosition.x,
bottom: cursorPosition.y,
width: 0,
height: 0
})
} : childNode,
popperRef: popperRef,
open: childNode ? open : false,
id: id,
transition: true
}, interactiveWrapperListeners, popperProps, {
popperOptions: popperOptions,
children: ({
TransitionProps: TransitionPropsInner
}) => /*#__PURE__*/jsx(TransitionComponent, _extends({
timeout: theme.transitions.duration.shorter
}, TransitionPropsInner, transitionProps, {
children: /*#__PURE__*/jsxs(TooltipComponent, _extends({}, tooltipProps, {
children: [title, arrow ? /*#__PURE__*/jsx(ArrowComponent, _extends({}, tooltipArrowProps, {
ref: setArrowRef
})) : null]
}))
}))
}))]
});
});
const Tooltip$1 = Tooltip;
function getTextFieldUtilityClass(slot) {
return generateUtilityClass('MuiTextField', slot);
}
generateUtilityClasses('MuiTextField', ['root']);
const _excluded$1 = ["autoComplete", "autoFocus", "children", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onFocus", "placeholder", "required", "rows", "select", "SelectProps", "type", "value", "variant"];
const variantComponent = {
standard: Input$1,
filled: FilledInput$1,
outlined: OutlinedInput$1
};
const useUtilityClasses = ownerState => {
const {
classes
} = ownerState;
const slots = {
root: ['root']
};
return composeClasses(slots, getTextFieldUtilityClass, classes);
};
const TextFieldRoot = styled$1(FormControl$1, {
name: 'MuiTextField',
slot: 'Root',
overridesResolver: (props, styles) => styles.root
})({});
/**
* The `TextField` is a convenience wrapper for the most common cases (80%).
* It cannot be all things to all people, otherwise the API would grow out of control.
*
* ## Advanced Configuration
*
* It's important to understand that the text field is a simple abstraction
* on top of the following components:
*
* - [FormControl](/material-ui/api/form-control/)
* - [InputLabel](/material-ui/api/input-label/)
* - [FilledInput](/material-ui/api/filled-input/)
* - [OutlinedInput](/material-ui/api/outlined-input/)
* - [Input](/material-ui/api/input/)
* - [FormHelperText](/material-ui/api/form-helper-text/)
*
* If you wish to alter the props applied to the `input` element, you can do so as follows:
*
* ```jsx
* const inputProps = {
* step: 300,
* };
*
* return <TextField id="time" type="time" inputProps={inputProps} />;
* ```
*
* For advanced cases, please look at the source of TextField by clicking on the
* "Edit this page" button above. Consider either:
*
* - using the upper case props for passing values directly to the components
* - using the underlying components directly as shown in the demos
*/
const TextField = /*#__PURE__*/reactExports.forwardRef(function TextField(inProps, ref) {
const props = useThemeProps({
props: inProps,
name: 'MuiTextField'
});
const {
autoComplete,
autoFocus = false,
children,
className,
color = 'primary',
defaultValue,
disabled = false,
error = false,
FormHelperTextProps,
fullWidth = false,
helperText,
id: idOverride,
InputLabelProps,
inputProps,
InputProps,
inputRef,
label,
maxRows,
minRows,
multiline = false,
name,
onBlur,
onChange,
onFocus,
placeholder,
required = false,
rows,
select = false,
SelectProps,
type,
value,
variant = 'outlined'
} = props,
other = _objectWithoutPropertiesLoose$2(props, _excluded$1);
const ownerState = _extends({}, props, {
autoFocus,
color,
disabled,
error,
fullWidth,
multiline,
required,
select,
variant
});
const classes = useUtilityClasses(ownerState);
const InputMore = {};
if (variant === 'outlined') {
if (InputLabelProps && typeof InputLabelProps.shrink !== 'undefined') {
InputMore.notched = InputLabelProps.shrink;
}
InputMore.label = label;
}
if (select) {
// unset defaults from textbox inputs
if (!SelectProps || !SelectProps.native) {
InputMore.id = undefined;
}
InputMore['aria-describedby'] = undefined;
}
const id = useId(idOverride);
const helperTextId = helperText && id ? `${id}-helper-text` : undefined;
const inputLabelId = label && id ? `${id}-label` : undefined;
const InputComponent = variantComponent[variant];
const InputElement = /*#__PURE__*/jsx(InputComponent, _extends({
"aria-describedby": helperTextId,
autoComplete: autoComplete,
autoFocus: autoFocus,
defaultValue: defaultValue,
fullWidth: fullWidth,
multiline: multiline,
name: name,
rows: rows,
maxRows: maxRows,
minRows: minRows,
type: type,
value: value,
id: id,
inputRef: inputRef,
onBlur: onBlur,
onChange: onChange,
onFocus: onFocus,
placeholder: placeholder,
inputProps: inputProps
}, InputMore, InputProps));
return /*#__PURE__*/jsxs(TextFieldRoot, _extends({
className: clsx(classes.root, className),
disabled: disabled,
error: error,
fullWidth: fullWidth,
ref: ref,
required: required,
color: color,
variant: variant,
ownerState: ownerState
}, other, {
children: [label != null && label !== '' && /*#__PURE__*/jsx(InputLabel$1, _extends({
htmlFor: id,
id: inputLabelId
}, InputLabelProps, {
children: label
})), select ? /*#__PURE__*/jsx(Select$1, _extends({
"aria-describedby": helperTextId,
id: id,
labelId: inputLabelId,
value: value,
input: InputElement
}, SelectProps, {
children: children
})) : InputElement, helperText && /*#__PURE__*/jsx(FormHelperText$1, _extends({
id: helperTextId
}, FormHelperTextProps, {
children: helperText
}))]
}));
});
const TextField$1 = TextField;
const lightThemeOptions = {
palette: {
mode: "light",
primary: {
main: "#885200",
contrastText: "#ffffff",
light: "#ffddb8",
dark: "#2c1700"
},
secondary: {
main: "#715a41",
contrastText: "#ffffff",
light: "#fdddbd",
dark: "#281805"
},
error: {
main: "#ba1b1b",
contrastText: "#ffffff",
light: "#ffdad4",
dark: "#410001"
},
divider: "#837568"
}
};
const darkThemeOptions = {
palette: {
mode: "dark",
primary: {
main: "#ffb85f",
contrastText: "#482900",
light: "#673d00",
dark: "#ffddb8"
},
secondary: {
main: "#dfc1a2",
contrastText: "#3f2d17",
light: "#58432b",
dark: "#fdddbd"
},
error: {
main: "#ffb4a9",
contrastText: "#680003",
light: "#930006",
dark: "#ffdad4"
},
divider: "#9d8e81"
}
};
const lightTheme = createTheme(lightThemeOptions);
const darkTheme = createTheme(darkThemeOptions);
const useAppTheme = () => {
const isDarkTheme = useMediaQuery("(prefers-color-scheme: dark)");
const theme = isDarkTheme ? darkTheme : lightTheme;
return theme;
};
const {
makeStyles: makeStyles$1,
withStyles
} = createMakeAndWithStyles({
useTheme: useAppTheme
});
let createNanoEvents = () => ({
events: {},
emit(event, ...args) {
let callbacks = this.events[event] || [];
for (let i = 0, length = callbacks.length; i < length; i++) {
callbacks[i](...args);
}
},
on(event, cb) {
this.events[event]?.push(cb) || (this.events[event] = [cb]);
return () => {
this.events[event] = this.events[event]?.filter(i => cb !== i);
}
}
});
const viewPortEvents = createNanoEvents();
class Viewport {
constructor() {
this.onMutationEvent = (mutations) => {
mutations.forEach((mutation) => {
if (mutation.type !== "childList") {
return;
}
mutation.removedNodes.forEach((node) => {
if (node === this.currentActiveViewport) {
logger.log("Active viewport was removed");
this.removeHooks();
this.currentActiveViewport = void 0;
}
});
mutation.addedNodes.forEach((node) => {
if (node.nodeName.toUpperCase() !== "CANVAS") {
return;
}
const canvasNode = node;
if (Viewport.isViewportElement(canvasNode)) {
logger.log("Active viewport was added");
this.resetViewport(canvasNode);
}
});
});
};
this.onTouchStartHookPassive = (e) => {
if (!this.currentActiveViewport)
return;
viewPortEvents.emit("touchStartPassive", e, this.currentActiveViewport);
};
this.onMouseMoveHookPassive = (e) => {
if (!this.currentActiveViewport) {
return;
}
viewPortEvents.emit("mouseMovePassive", e, this.currentActiveViewport);
};
this.onMouseDownHookPassive = (e) => {
if (!this.currentActiveViewport) {
return;
}
viewPortEvents.emit("mouseDownPassive", e, this.currentActiveViewport);
};
this.onMouseUpHookPassive = (e) => {
if (!this.currentActiveViewport) {
return;
}
viewPortEvents.emit("mouseUpPassive", e, this.currentActiveViewport);
};
this.onWheelHookPassive = (e) => {
if (!this.currentActiveViewport) {
return;
}
viewPortEvents.emit("wheelPassive", e, this.currentActiveViewport);
};
this.onMouseDownDocumentCaptureHook = (e) => {
if (e.target !== this.currentActiveViewport)
return;
viewPortEvents.emit("mouseDownCaptured", e, this.currentActiveViewport);
};
logger.log("Trying to find viewport...");
const canvases = document.getElementsByTagName("canvas");
const viewport2 = Array.from(canvases).find((c) => Viewport.isViewportElement(c) && this.currentActiveViewport !== c);
if (viewport2) {
logger.log("Viewport found.");
this.resetViewport(viewport2);
}
if (!this.currentActiveViewport) {
logger.log("Viewport not found...");
}
const mutationObserver = new MutationObserver(this.onMutationEvent);
mutationObserver.observe(document.body, {
childList: true
});
document.addEventListener("mousedown", this.onMouseDownDocumentCaptureHook, true);
}
static isViewportElement(element) {
if (element.tagName.toUpperCase() !== "CANVAS")
return false;
if (!element.className.includes("viewport"))
return false;
return true;
}
resetViewport(canvas) {
this.removeHooks();
this.currentActiveViewport = canvas;
this.initHooks();
}
initHooks() {
if (!this.currentActiveViewport)
return;
this.currentActiveViewport.addEventListener("touchstart", this.onTouchStartHookPassive, {
passive: true
});
this.currentActiveViewport.addEventListener("mousemove", this.onMouseMoveHookPassive, {
passive: true
});
this.currentActiveViewport.addEventListener("mousedown", this.onMouseDownHookPassive, {
passive: true
});
this.currentActiveViewport.addEventListener("mouseup", this.onMouseUpHookPassive, {
passive: true
});
this.currentActiveViewport.addEventListener("wheel", this.onWheelHookPassive, {
passive: true
});
if (this.currentActiveViewport.onmousedown) {
const originalMouseDown = this.currentActiveViewport.onmousedown;
this.currentActiveViewport.onmousedown = null;
this.currentActiveViewport.addEventListener("mousedown", originalMouseDown);
}
}
removeHooks() {
this.currentActiveViewport?.removeEventListener("touchstart", this.onTouchStartHookPassive);
this.currentActiveViewport?.removeEventListener("mousemove", this.onMouseMoveHookPassive);
this.currentActiveViewport?.removeEventListener("mousedown", this.onMouseDownHookPassive);
this.currentActiveViewport?.removeEventListener("mouseup", this.onMouseUpHookPassive);
this.currentActiveViewport?.removeEventListener("wheel", this.onWheelHookPassive);
}
}
new Viewport();
var PixelUpdateReturnCode = /* @__PURE__ */ ((PixelUpdateReturnCode2) => {
PixelUpdateReturnCode2[PixelUpdateReturnCode2["success"] = 0] = "success";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["canvasDoesntExist"] = 1] = "canvasDoesntExist";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["xOutOfBounds"] = 2] = "xOutOfBounds";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["yOutOfBounds"] = 3] = "yOutOfBounds";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["zOutOfBounds"] = 4] = "zOutOfBounds";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["colorOutOfBounds"] = 5] = "colorOutOfBounds";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["notLoggedIn"] = 6] = "notLoggedIn";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["notEnoughPixelsPlaced"] = 7] = "notEnoughPixelsPlaced";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["protectedPixel"] = 8] = "protectedPixel";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["cooldownLimitReached"] = 9] = "cooldownLimitReached";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["catchaNeeded"] = 10] = "catchaNeeded";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["proxyDetected"] = 11] = "proxyDetected";
PixelUpdateReturnCode2[PixelUpdateReturnCode2["needToBeInTop10"] = 12] = "needToBeInTop10";
return PixelUpdateReturnCode2;
})(PixelUpdateReturnCode || {});
const pixelReturnPacket = {
OP_CODE: 195,
hydrate(data) {
const retCode = data.getUint8(1);
const waitMs = data.getUint32(2);
const coolDownSeconds = data.getInt16(6);
const pixelIndex = data.getUint8(8);
return {
retCode,
waitMs,
coolDownSeconds,
pixelIndex
};
},
dehydrate(retCode, wait, coolDown, pxlCnt) {
const buffer = new ArrayBuffer(1 + 1 + 4 + 2 + 1);
const bufferView = new DataView(buffer);
bufferView.setUint8(0, pixelReturnPacket.OP_CODE);
bufferView.setUint8(1, retCode);
bufferView.setUint32(2, wait);
const coolDownSeconds = Math.round(coolDown / 1e3);
bufferView.setInt16(6, coolDownSeconds);
bufferView.setUint8(8, pxlCnt);
return buffer;
}
};
const pixelUpdatePacket = {
OP_CODE: 193,
hydrate(data) {
const chunkX = data.getUint8(1);
const chunkY = data.getUint8(2);
const pixels = [];
let off = data.byteLength;
while (off > 3) {
const color = data.getUint8(off -= 1);
const offsetL = data.getUint16(off -= 2);
const offsetH = data.getUint8(off -= 1) << 16;
pixels.push({
offsetInChunk: offsetH | offsetL,
color
});
}
return {
chunkX,
chunkY,
pixels
};
},
dehydrate(chunkX, chunkY, pixels) {
const buffer = new ArrayBuffer(1 + 1 + 1 + pixels.length * 4);
const view = new DataView(buffer);
view.setUint8(0, pixelUpdatePacket.OP_CODE);
view.setUint8(1, chunkX);
view.setUint8(2, chunkY);
let cnt = 2;
pixels.forEach(({
offsetInChunk,
color
}) => {
view.setUint8(cnt += 1, offsetInChunk >>> 16);
view.setUint16(cnt += 1, offsetInChunk & 65535);
view.setUint8(cnt += 2, color);
});
return buffer;
}
};
const webSocketSenderEvents = createNanoEvents();
const originalSend = WebSocket.prototype.send;
WebSocket.prototype.send = function newSend(data) {
webSocketWrapper.resetWs(this);
if (data instanceof ArrayBuffer) {
const dataView = new DataView(data);
const opCode = dataView.getUint8(0);
switch (opCode) {
case pixelUpdatePacket.OP_CODE: {
const updateData = pixelUpdatePacket.hydrate(dataView);
webSocketSenderEvents.emit("pixelUpdate", updateData);
const isToggledPlacementQueue = selectPixelPlaceQueueEnabled(store.getState());
if (!webSocketWrapper.isLocalEvent && isToggledPlacementQueue) {
Promise.resolve().then(() => {
const fakeReturnPacketData = pixelReturnPacket.dehydrate(PixelUpdateReturnCode.protectedPixel, 0, 0, 0);
const messageEvent = new MessageEvent("message", {
data: fakeReturnPacketData
});
this.dispatchEvent(messageEvent);
});
webSocketSenderEvents.emit("pixelPlacementIntercepted", updateData);
return;
}
break;
}
}
}
originalSend.apply(this, [data]);
};
class WebSocketWrapper {
constructor() {
this.listeners = [];
this.isLocalEvent = false;
}
resetWs(ws) {
if (this.ws === ws)
return;
this.listeners.forEach((x) => this.ws?.removeEventListener(x.type, x.listener));
this.ws = ws;
this.listeners.forEach((x) => this.ws?.addEventListener(x.type, x.listener));
}
send(data) {
this.isLocalEvent = true;
this.ws?.send(data);
this.isLocalEvent = false;
}
subscribe(type, listener) {
this.listeners.push({
type,
listener
});
this.ws?.addEventListener(type, listener);
return () => {
this.ws?.removeEventListener(type, listener);
const index = this.listeners.findIndex((x) => x.type === type && x.listener === listener);
if (index === -1)
return;
this.listeners.splice(index, 1);
};
}
}
const webSocketWrapper = new WebSocketWrapper();
const webSocketEventsEmitter = createNanoEvents();
const webSocketEvents = webSocketEventsEmitter;
webSocketWrapper.subscribe("message", (ev) => {
const {
data
} = ev;
if (typeof data === "string") {
return;
}
if (data instanceof ArrayBuffer) {
if (data.byteLength === 0)
return;
const dataView = new DataView(data);
const opCode = dataView.getUint8(0);
switch (opCode) {
case pixelReturnPacket.OP_CODE: {
const retData = pixelReturnPacket.hydrate(dataView);
webSocketEventsEmitter.emit("pixelReturn", retData);
break;
}
case pixelUpdatePacket.OP_CODE: {
const updateData = pixelUpdatePacket.hydrate(dataView);
webSocketEventsEmitter.emit("pixelUpdate", updateData);
break;
}
default:
logger.log(`Unknown opCode: ${opCode}`);
break;
}
}
});
var colorStringExports = {};
var colorString = {
get exports(){ return colorStringExports; },
set exports(v){ colorStringExports = v; },
};
var colorName = {
"aliceblue": [240, 248, 255],
"antiquewhite": [250, 235, 215],
"aqua": [0, 255, 255],
"aquamarine": [127, 255, 212],
"azure": [240, 255, 255],
"beige": [245, 245, 220],
"bisque": [255, 228, 196],
"black": [0, 0, 0],
"blanchedalmond": [255, 235, 205],
"blue": [0, 0, 255],
"blueviolet": [138, 43, 226],
"brown": [165, 42, 42],
"burlywood": [222, 184, 135],
"cadetblue": [95, 158, 160],
"chartreuse": [127, 255, 0],
"chocolate": [210, 105, 30],
"coral": [255, 127, 80],
"cornflowerblue": [100, 149, 237],
"cornsilk": [255, 248, 220],
"crimson": [220, 20, 60],
"cyan": [0, 255, 255],
"darkblue": [0, 0, 139],
"darkcyan": [0, 139, 139],
"darkgoldenrod": [184, 134, 11],
"darkgray": [169, 169, 169],
"darkgreen": [0, 100, 0],
"darkgrey": [169, 169, 169],
"darkkhaki": [189, 183, 107],
"darkmagenta": [139, 0, 139],
"darkolivegreen": [85, 107, 47],
"darkorange": [255, 140, 0],
"darkorchid": [153, 50, 204],
"darkred": [139, 0, 0],
"darksalmon": [233, 150, 122],
"darkseagreen": [143, 188, 143],
"darkslateblue": [72, 61, 139],
"darkslategray": [47, 79, 79],
"darkslategrey": [47, 79, 79],
"darkturquoise": [0, 206, 209],
"darkviolet": [148, 0, 211],
"deeppink": [255, 20, 147],
"deepskyblue": [0, 191, 255],
"dimgray": [105, 105, 105],
"dimgrey": [105, 105, 105],
"dodgerblue": [30, 144, 255],
"firebrick": [178, 34, 34],
"floralwhite": [255, 250, 240],
"forestgreen": [34, 139, 34],
"fuchsia": [255, 0, 255],
"gainsboro": [220, 220, 220],
"ghostwhite": [248, 248, 255],
"gold": [255, 215, 0],
"goldenrod": [218, 165, 32],
"gray": [128, 128, 128],
"green": [0, 128, 0],
"greenyellow": [173, 255, 47],
"grey": [128, 128, 128],
"honeydew": [240, 255, 240],
"hotpink": [255, 105, 180],
"indianred": [205, 92, 92],
"indigo": [75, 0, 130],
"ivory": [255, 255, 240],
"khaki": [240, 230, 140],
"lavender": [230, 230, 250],
"lavenderblush": [255, 240, 245],
"lawngreen": [124, 252, 0],
"lemonchiffon": [255, 250, 205],
"lightblue": [173, 216, 230],
"lightcoral": [240, 128, 128],
"lightcyan": [224, 255, 255],
"lightgoldenrodyellow": [250, 250, 210],
"lightgray": [211, 211, 211],
"lightgreen": [144, 238, 144],
"lightgrey": [211, 211, 211],
"lightpink": [255, 182, 193],
"lightsalmon": [255, 160, 122],
"lightseagreen": [32, 178, 170],
"lightskyblue": [135, 206, 250],
"lightslategray": [119, 136, 153],
"lightslategrey": [119, 136, 153],
"lightsteelblue": [176, 196, 222],
"lightyellow": [255, 255, 224],
"lime": [0, 255, 0],
"limegreen": [50, 205, 50],
"linen": [250, 240, 230],
"magenta": [255, 0, 255],
"maroon": [128, 0, 0],
"mediumaquamarine": [102, 205, 170],
"mediumblue": [0, 0, 205],
"mediumorchid": [186, 85, 211],
"mediumpurple": [147, 112, 219],
"mediumseagreen": [60, 179, 113],
"mediumslateblue": [123, 104, 238],
"mediumspringgreen": [0, 250, 154],
"mediumturquoise": [72, 209, 204],
"mediumvioletred": [199, 21, 133],
"midnightblue": [25, 25, 112],
"mintcream": [245, 255, 250],
"mistyrose": [255, 228, 225],
"moccasin": [255, 228, 181],
"navajowhite": [255, 222, 173],
"navy": [0, 0, 128],
"oldlace": [253, 245, 230],
"olive": [128, 128, 0],
"olivedrab": [107, 142, 35],
"orange": [255, 165, 0],
"orangered": [255, 69, 0],
"orchid": [218, 112, 214],
"palegoldenrod": [238, 232, 170],
"palegreen": [152, 251, 152],
"paleturquoise": [175, 238, 238],
"palevioletred": [219, 112, 147],
"papayawhip": [255, 239, 213],
"peachpuff": [255, 218, 185],
"peru": [205, 133, 63],
"pink": [255, 192, 203],
"plum": [221, 160, 221],
"powderblue": [176, 224, 230],
"purple": [128, 0, 128],
"rebeccapurple": [102, 51, 153],
"red": [255, 0, 0],
"rosybrown": [188, 143, 143],
"royalblue": [65, 105, 225],
"saddlebrown": [139, 69, 19],
"salmon": [250, 128, 114],
"sandybrown": [244, 164, 96],
"seagreen": [46, 139, 87],
"seashell": [255, 245, 238],
"sienna": [160, 82, 45],
"silver": [192, 192, 192],
"skyblue": [135, 206, 235],
"slateblue": [106, 90, 205],
"slategray": [112, 128, 144],
"slategrey": [112, 128, 144],
"snow": [255, 250, 250],
"springgreen": [0, 255, 127],
"steelblue": [70, 130, 180],
"tan": [210, 180, 140],
"teal": [0, 128, 128],
"thistle": [216, 191, 216],
"tomato": [255, 99, 71],
"turquoise": [64, 224, 208],
"violet": [238, 130, 238],
"wheat": [245, 222, 179],
"white": [255, 255, 255],
"whitesmoke": [245, 245, 245],
"yellow": [255, 255, 0],
"yellowgreen": [154, 205, 50]
};
var simpleSwizzleExports = {};
var simpleSwizzle = {
get exports(){ return simpleSwizzleExports; },
set exports(v){ simpleSwizzleExports = v; },
};
var isArrayish$1 = function isArrayish(obj) {
if (!obj || typeof obj === 'string') {
return false;
}
return obj instanceof Array || Array.isArray(obj) ||
(obj.length >= 0 && (obj.splice instanceof Function ||
(Object.getOwnPropertyDescriptor(obj, (obj.length - 1)) && obj.constructor.name !== 'String')));
};
var isArrayish = isArrayish$1;
var concat = Array.prototype.concat;
var slice = Array.prototype.slice;
var swizzle$1 = simpleSwizzle.exports = function swizzle(args) {
var results = [];
for (var i = 0, len = args.length; i < len; i++) {
var arg = args[i];
if (isArrayish(arg)) {
// http://jsperf.com/javascript-array-concat-vs-push/98
results = concat.call(results, slice.call(arg));
} else {
results.push(arg);
}
}
return results;
};
swizzle$1.wrap = function (fn) {
return function () {
return fn(swizzle$1(arguments));
};
};
/* MIT license */
var colorNames = colorName;
var swizzle = simpleSwizzleExports;
var hasOwnProperty = Object.hasOwnProperty;
var reverseNames = Object.create(null);
// create a list of reverse color names
for (var name in colorNames) {
if (hasOwnProperty.call(colorNames, name)) {
reverseNames[colorNames[name]] = name;
}
}
var cs = colorString.exports = {
to: {},
get: {}
};
cs.get = function (string) {
var prefix = string.substring(0, 3).toLowerCase();
var val;
var model;
switch (prefix) {
case 'hsl':
val = cs.get.hsl(string);
model = 'hsl';
break;
case 'hwb':
val = cs.get.hwb(string);
model = 'hwb';
break;
default:
val = cs.get.rgb(string);
model = 'rgb';
break;
}
if (!val) {
return null;
}
return {model: model, value: val};
};
cs.get.rgb = function (string) {
if (!string) {
return null;
}
var abbr = /^#([a-f0-9]{3,4})$/i;
var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i;
var rgba = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
var keyword = /^(\w+)$/;
var rgb = [0, 0, 0, 1];
var match;
var i;
var hexAlpha;
if (match = string.match(hex)) {
hexAlpha = match[2];
match = match[1];
for (i = 0; i < 3; i++) {
// https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19
var i2 = i * 2;
rgb[i] = parseInt(match.slice(i2, i2 + 2), 16);
}
if (hexAlpha) {
rgb[3] = parseInt(hexAlpha, 16) / 255;
}
} else if (match = string.match(abbr)) {
match = match[1];
hexAlpha = match[3];
for (i = 0; i < 3; i++) {
rgb[i] = parseInt(match[i] + match[i], 16);
}
if (hexAlpha) {
rgb[3] = parseInt(hexAlpha + hexAlpha, 16) / 255;
}
} else if (match = string.match(rgba)) {
for (i = 0; i < 3; i++) {
rgb[i] = parseInt(match[i + 1], 0);
}
if (match[4]) {
if (match[5]) {
rgb[3] = parseFloat(match[4]) * 0.01;
} else {
rgb[3] = parseFloat(match[4]);
}
}
} else if (match = string.match(per)) {
for (i = 0; i < 3; i++) {
rgb[i] = Math.round(parseFloat(match[i + 1]) * 2.55);
}
if (match[4]) {
if (match[5]) {
rgb[3] = parseFloat(match[4]) * 0.01;
} else {
rgb[3] = parseFloat(match[4]);
}
}
} else if (match = string.match(keyword)) {
if (match[1] === 'transparent') {
return [0, 0, 0, 0];
}
if (!hasOwnProperty.call(colorNames, match[1])) {
return null;
}
rgb = colorNames[match[1]];
rgb[3] = 1;
return rgb;
} else {
return null;
}
for (i = 0; i < 3; i++) {
rgb[i] = clamp(rgb[i], 0, 255);
}
rgb[3] = clamp(rgb[3], 0, 1);
return rgb;
};
cs.get.hsl = function (string) {
if (!string) {
return null;
}
var hsl = /^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d\.]+)%\s*,?\s*([+-]?[\d\.]+)%\s*(?:[,|\/]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
var match = string.match(hsl);
if (match) {
var alpha = parseFloat(match[4]);
var h = ((parseFloat(match[1]) % 360) + 360) % 360;
var s = clamp(parseFloat(match[2]), 0, 100);
var l = clamp(parseFloat(match[3]), 0, 100);
var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
return [h, s, l, a];
}
return null;
};
cs.get.hwb = function (string) {
if (!string) {
return null;
}
var hwb = /^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
var match = string.match(hwb);
if (match) {
var alpha = parseFloat(match[4]);
var h = ((parseFloat(match[1]) % 360) + 360) % 360;
var w = clamp(parseFloat(match[2]), 0, 100);
var b = clamp(parseFloat(match[3]), 0, 100);
var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
return [h, w, b, a];
}
return null;
};
cs.to.hex = function () {
var rgba = swizzle(arguments);
return (
'#' +
hexDouble(rgba[0]) +
hexDouble(rgba[1]) +
hexDouble(rgba[2]) +
(rgba[3] < 1
? (hexDouble(Math.round(rgba[3] * 255)))
: '')
);
};
cs.to.rgb = function () {
var rgba = swizzle(arguments);
return rgba.length < 4 || rgba[3] === 1
? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')'
: 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')';
};
cs.to.rgb.percent = function () {
var rgba = swizzle(arguments);
var r = Math.round(rgba[0] / 255 * 100);
var g = Math.round(rgba[1] / 255 * 100);
var b = Math.round(rgba[2] / 255 * 100);
return rgba.length < 4 || rgba[3] === 1
? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)'
: 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')';
};
cs.to.hsl = function () {
var hsla = swizzle(arguments);
return hsla.length < 4 || hsla[3] === 1
? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)'
: 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')';
};
// hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax
// (hwb have alpha optional & 1 is default value)
cs.to.hwb = function () {
var hwba = swizzle(arguments);
var a = '';
if (hwba.length >= 4 && hwba[3] !== 1) {
a = ', ' + hwba[3];
}
return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')';
};
cs.to.keyword = function (rgb) {
return reverseNames[rgb.slice(0, 3)];
};
// helpers
function clamp(num, min, max) {
return Math.min(Math.max(min, num), max);
}
function hexDouble(num) {
var str = Math.round(num).toString(16).toUpperCase();
return (str.length < 2) ? '0' + str : str;
}
/******************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
function __awaiter(thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
}
function __generator(thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (g && (g = 0, op[0] && (_ = 0)), _) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
}
function __read(o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
}
function __spreadArray(to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
}
var COMMON_MIME_TYPES = new Map([
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
['aac', 'audio/aac'],
['abw', 'application/x-abiword'],
['arc', 'application/x-freearc'],
['avif', 'image/avif'],
['avi', 'video/x-msvideo'],
['azw', 'application/vnd.amazon.ebook'],
['bin', 'application/octet-stream'],
['bmp', 'image/bmp'],
['bz', 'application/x-bzip'],
['bz2', 'application/x-bzip2'],
['cda', 'application/x-cdf'],
['csh', 'application/x-csh'],
['css', 'text/css'],
['csv', 'text/csv'],
['doc', 'application/msword'],
['docx', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],
['eot', 'application/vnd.ms-fontobject'],
['epub', 'application/epub+zip'],
['gz', 'application/gzip'],
['gif', 'image/gif'],
['heic', 'image/heic'],
['heif', 'image/heif'],
['htm', 'text/html'],
['html', 'text/html'],
['ico', 'image/vnd.microsoft.icon'],
['ics', 'text/calendar'],
['jar', 'application/java-archive'],
['jpeg', 'image/jpeg'],
['jpg', 'image/jpeg'],
['js', 'text/javascript'],
['json', 'application/json'],
['jsonld', 'application/ld+json'],
['mid', 'audio/midi'],
['midi', 'audio/midi'],
['mjs', 'text/javascript'],
['mp3', 'audio/mpeg'],
['mp4', 'video/mp4'],
['mpeg', 'video/mpeg'],
['mpkg', 'application/vnd.apple.installer+xml'],
['odp', 'application/vnd.oasis.opendocument.presentation'],
['ods', 'application/vnd.oasis.opendocument.spreadsheet'],
['odt', 'application/vnd.oasis.opendocument.text'],
['oga', 'audio/ogg'],
['ogv', 'video/ogg'],
['ogx', 'application/ogg'],
['opus', 'audio/opus'],
['otf', 'font/otf'],
['png', 'image/png'],
['pdf', 'application/pdf'],
['php', 'application/x-httpd-php'],
['ppt', 'application/vnd.ms-powerpoint'],
['pptx', 'application/vnd.openxmlformats-officedocument.presentationml.presentation'],
['rar', 'application/vnd.rar'],
['rtf', 'application/rtf'],
['sh', 'application/x-sh'],
['svg', 'image/svg+xml'],
['swf', 'application/x-shockwave-flash'],
['tar', 'application/x-tar'],
['tif', 'image/tiff'],
['tiff', 'image/tiff'],
['ts', 'video/mp2t'],
['ttf', 'font/ttf'],
['txt', 'text/plain'],
['vsd', 'application/vnd.visio'],
['wav', 'audio/wav'],
['weba', 'audio/webm'],
['webm', 'video/webm'],
['webp', 'image/webp'],
['woff', 'font/woff'],
['woff2', 'font/woff2'],
['xhtml', 'application/xhtml+xml'],
['xls', 'application/vnd.ms-excel'],
['xlsx', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
['xml', 'application/xml'],
['xul', 'application/vnd.mozilla.xul+xml'],
['zip', 'application/zip'],
['7z', 'application/x-7z-compressed'],
// Others
['mkv', 'video/x-matroska'],
['mov', 'video/quicktime'],
['msg', 'application/vnd.ms-outlook']
]);
function toFileWithPath(file, path) {
var f = withMimeType(file);
if (typeof f.path !== 'string') { // on electron, path is already set to the absolute path
var webkitRelativePath = file.webkitRelativePath;
Object.defineProperty(f, 'path', {
value: typeof path === 'string'
? path
// If <input webkitdirectory> is set,
// the File will have a {webkitRelativePath} property
// https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory
: typeof webkitRelativePath === 'string' && webkitRelativePath.length > 0
? webkitRelativePath
: file.name,
writable: false,
configurable: false,
enumerable: true
});
}
return f;
}
function withMimeType(file) {
var name = file.name;
var hasExtension = name && name.lastIndexOf('.') !== -1;
if (hasExtension && !file.type) {
var ext = name.split('.')
.pop().toLowerCase();
var type = COMMON_MIME_TYPES.get(ext);
if (type) {
Object.defineProperty(file, 'type', {
value: type,
writable: false,
configurable: false,
enumerable: true
});
}
}
return file;
}
var FILES_TO_IGNORE = [
// Thumbnail cache files for macOS and Windows
'.DS_Store',
'Thumbs.db' // Windows
];
/**
* Convert a DragEvent's DataTrasfer object to a list of File objects
* NOTE: If some of the items are folders,
* everything will be flattened and placed in the same list but the paths will be kept as a {path} property.
*
* EXPERIMENTAL: A list of https://developer.mozilla.org/en-US/docs/Web/API/FileSystemHandle objects can also be passed as an arg
* and a list of File objects will be returned.
*
* @param evt
*/
function fromEvent(evt) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
if (isObject(evt) && isDataTransfer(evt.dataTransfer)) {
return [2 /*return*/, getDataTransferFiles(evt.dataTransfer, evt.type)];
}
else if (isChangeEvt(evt)) {
return [2 /*return*/, getInputFiles(evt)];
}
else if (Array.isArray(evt) && evt.every(function (item) { return 'getFile' in item && typeof item.getFile === 'function'; })) {
return [2 /*return*/, getFsHandleFiles(evt)];
}
return [2 /*return*/, []];
});
});
}
function isDataTransfer(value) {
return isObject(value);
}
function isChangeEvt(value) {
return isObject(value) && isObject(value.target);
}
function isObject(v) {
return typeof v === 'object' && v !== null;
}
function getInputFiles(evt) {
return fromList(evt.target.files).map(function (file) { return toFileWithPath(file); });
}
// Ee expect each handle to be https://developer.mozilla.org/en-US/docs/Web/API/FileSystemFileHandle
function getFsHandleFiles(handles) {
return __awaiter(this, void 0, void 0, function () {
var files;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, Promise.all(handles.map(function (h) { return h.getFile(); }))];
case 1:
files = _a.sent();
return [2 /*return*/, files.map(function (file) { return toFileWithPath(file); })];
}
});
});
}
function getDataTransferFiles(dt, type) {
return __awaiter(this, void 0, void 0, function () {
var items, files;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!dt.items) return [3 /*break*/, 2];
items = fromList(dt.items)
.filter(function (item) { return item.kind === 'file'; });
// According to https://html.spec.whatwg.org/multipage/dnd.html#dndevents,
// only 'dragstart' and 'drop' has access to the data (source node)
if (type !== 'drop') {
return [2 /*return*/, items];
}
return [4 /*yield*/, Promise.all(items.map(toFilePromises))];
case 1:
files = _a.sent();
return [2 /*return*/, noIgnoredFiles(flatten(files))];
case 2: return [2 /*return*/, noIgnoredFiles(fromList(dt.files)
.map(function (file) { return toFileWithPath(file); }))];
}
});
});
}
function noIgnoredFiles(files) {
return files.filter(function (file) { return FILES_TO_IGNORE.indexOf(file.name) === -1; });
}
// IE11 does not support Array.from()
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Browser_compatibility
// https://developer.mozilla.org/en-US/docs/Web/API/FileList
// https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItemList
function fromList(items) {
if (items === null) {
return [];
}
var files = [];
// tslint:disable: prefer-for-of
for (var i = 0; i < items.length; i++) {
var file = items[i];
files.push(file);
}
return files;
}
// https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItem
function toFilePromises(item) {
if (typeof item.webkitGetAsEntry !== 'function') {
return fromDataTransferItem(item);
}
var entry = item.webkitGetAsEntry();
// Safari supports dropping an image node from a different window and can be retrieved using
// the DataTransferItem.getAsFile() API
// NOTE: FileSystemEntry.file() throws if trying to get the file
if (entry && entry.isDirectory) {
return fromDirEntry(entry);
}
return fromDataTransferItem(item);
}
function flatten(items) {
return items.reduce(function (acc, files) { return __spreadArray(__spreadArray([], __read(acc), false), __read((Array.isArray(files) ? flatten(files) : [files])), false); }, []);
}
function fromDataTransferItem(item) {
var file = item.getAsFile();
if (!file) {
return Promise.reject("".concat(item, " is not a File"));
}
var fwp = toFileWithPath(file);
return Promise.resolve(fwp);
}
// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemEntry
function fromEntry(entry) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
return [2 /*return*/, entry.isDirectory ? fromDirEntry(entry) : fromFileEntry(entry)];
});
});
}
// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryEntry
function fromDirEntry(entry) {
var reader = entry.createReader();
return new Promise(function (resolve, reject) {
var entries = [];
function readEntries() {
var _this = this;
// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryEntry/createReader
// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryReader/readEntries
reader.readEntries(function (batch) { return __awaiter(_this, void 0, void 0, function () {
var files, err_1, items;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!!batch.length) return [3 /*break*/, 5];
_a.label = 1;
case 1:
_a.trys.push([1, 3, , 4]);
return [4 /*yield*/, Promise.all(entries)];
case 2:
files = _a.sent();
resolve(files);
return [3 /*break*/, 4];
case 3:
err_1 = _a.sent();
reject(err_1);
return [3 /*break*/, 4];
case 4: return [3 /*break*/, 6];
case 5:
items = Promise.all(batch.map(fromEntry));
entries.push(items);
// Continue reading
readEntries();
_a.label = 6;
case 6: return [2 /*return*/];
}
});
}); }, function (err) {
reject(err);
});
}
readEntries();
});
}
// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemFileEntry
function fromFileEntry(entry) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
return [2 /*return*/, new Promise(function (resolve, reject) {
entry.file(function (file) {
var fwp = toFileWithPath(file, entry.fullPath);
resolve(fwp);
}, function (err) {
reject(err);
});
})];
});
});
}
var _default$7 = function (file, acceptedFiles) {
if (file && acceptedFiles) {
var acceptedFilesArray = Array.isArray(acceptedFiles) ? acceptedFiles : acceptedFiles.split(',');
var fileName = file.name || '';
var mimeType = (file.type || '').toLowerCase();
var baseMimeType = mimeType.replace(/\/.*$/, '');
return acceptedFilesArray.some(function (type) {
var validType = type.trim().toLowerCase();
if (validType.charAt(0) === '.') {
return fileName.toLowerCase().endsWith(validType);
} else if (validType.endsWith('/*')) {
// This is something like a image/* mime type
return baseMimeType === validType.replace(/\/.*$/, '');
}
return mimeType === validType;
});
}
return true;
};
function _toConsumableArray$1(arr) { return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread$1(); }
function _nonIterableSpread$1() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray$1(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles$1(arr) { if (Array.isArray(arr)) return _arrayLikeToArray$1(arr); }
function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _slicedToArray$1(arr, i) { return _arrayWithHoles$1(arr) || _iterableToArrayLimit$1(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest$1(); }
function _nonIterableRest$1() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); }
function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit$1(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles$1(arr) { if (Array.isArray(arr)) return arr; }
var FILE_INVALID_TYPE = "file-invalid-type";
var FILE_TOO_LARGE = "file-too-large";
var FILE_TOO_SMALL = "file-too-small";
var TOO_MANY_FILES = "too-many-files";
var getInvalidTypeRejectionErr = function getInvalidTypeRejectionErr(accept) {
accept = Array.isArray(accept) && accept.length === 1 ? accept[0] : accept;
var messageSuffix = Array.isArray(accept) ? "one of ".concat(accept.join(", ")) : accept;
return {
code: FILE_INVALID_TYPE,
message: "File type must be ".concat(messageSuffix)
};
};
var getTooLargeRejectionErr = function getTooLargeRejectionErr(maxSize) {
return {
code: FILE_TOO_LARGE,
message: "File is larger than ".concat(maxSize, " ").concat(maxSize === 1 ? "byte" : "bytes")
};
};
var getTooSmallRejectionErr = function getTooSmallRejectionErr(minSize) {
return {
code: FILE_TOO_SMALL,
message: "File is smaller than ".concat(minSize, " ").concat(minSize === 1 ? "byte" : "bytes")
};
};
var TOO_MANY_FILES_REJECTION = {
code: TOO_MANY_FILES,
message: "Too many files"
}; // Firefox versions prior to 53 return a bogus MIME type for every file drag, so dragovers with
// that MIME type will always be accepted
function fileAccepted(file, accept) {
var isAcceptable = file.type === "application/x-moz-file" || _default$7(file, accept);
return [isAcceptable, isAcceptable ? null : getInvalidTypeRejectionErr(accept)];
}
function fileMatchSize(file, minSize, maxSize) {
if (isDefined(file.size)) {
if (isDefined(minSize) && isDefined(maxSize)) {
if (file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)];
if (file.size < minSize) return [false, getTooSmallRejectionErr(minSize)];
} else if (isDefined(minSize) && file.size < minSize) return [false, getTooSmallRejectionErr(minSize)];else if (isDefined(maxSize) && file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)];
}
return [true, null];
}
function isDefined(value) {
return value !== undefined && value !== null;
}
/**
*
* @param {object} options
* @param {File[]} options.files
* @param {string|string[]} [options.accept]
* @param {number} [options.minSize]
* @param {number} [options.maxSize]
* @param {boolean} [options.multiple]
* @param {number} [options.maxFiles]
* @param {(f: File) => FileError|FileError[]|null} [options.validator]
* @returns
*/
function allFilesAccepted(_ref) {
var files = _ref.files,
accept = _ref.accept,
minSize = _ref.minSize,
maxSize = _ref.maxSize,
multiple = _ref.multiple,
maxFiles = _ref.maxFiles,
validator = _ref.validator;
if (!multiple && files.length > 1 || multiple && maxFiles >= 1 && files.length > maxFiles) {
return false;
}
return files.every(function (file) {
var _fileAccepted = fileAccepted(file, accept),
_fileAccepted2 = _slicedToArray$1(_fileAccepted, 1),
accepted = _fileAccepted2[0];
var _fileMatchSize = fileMatchSize(file, minSize, maxSize),
_fileMatchSize2 = _slicedToArray$1(_fileMatchSize, 1),
sizeMatch = _fileMatchSize2[0];
var customErrors = validator ? validator(file) : null;
return accepted && sizeMatch && !customErrors;
});
} // React's synthetic events has event.isPropagationStopped,
// but to remain compatibility with other libs (Preact) fall back
// to check event.cancelBubble
function isPropagationStopped(event) {
if (typeof event.isPropagationStopped === "function") {
return event.isPropagationStopped();
} else if (typeof event.cancelBubble !== "undefined") {
return event.cancelBubble;
}
return false;
}
function isEvtWithFiles(event) {
if (!event.dataTransfer) {
return !!event.target && !!event.target.files;
} // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/types
// https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types#file
return Array.prototype.some.call(event.dataTransfer.types, function (type) {
return type === "Files" || type === "application/x-moz-file";
});
}
function onDocumentDragOver(event) {
event.preventDefault();
}
function isIe(userAgent) {
return userAgent.indexOf("MSIE") !== -1 || userAgent.indexOf("Trident/") !== -1;
}
function isEdge(userAgent) {
return userAgent.indexOf("Edge/") !== -1;
}
function isIeOrEdge() {
var userAgent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.navigator.userAgent;
return isIe(userAgent) || isEdge(userAgent);
}
/**
* This is intended to be used to compose event handlers
* They are executed in order until one of them calls `event.isPropagationStopped()`.
* Note that the check is done on the first invoke too,
* meaning that if propagation was stopped before invoking the fns,
* no handlers will be executed.
*
* @param {Function} fns the event hanlder functions
* @return {Function} the event handler to add to an element
*/
function composeEventHandlers() {
for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
fns[_key] = arguments[_key];
}
return function (event) {
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
args[_key2 - 1] = arguments[_key2];
}
return fns.some(function (fn) {
if (!isPropagationStopped(event) && fn) {
fn.apply(void 0, [event].concat(args));
}
return isPropagationStopped(event);
});
};
}
/**
* canUseFileSystemAccessAPI checks if the [File System Access API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API)
* is supported by the browser.
* @returns {boolean}
*/
function canUseFileSystemAccessAPI() {
return "showOpenFilePicker" in window;
}
/**
* Convert the `{accept}` dropzone prop to the
* `{types}` option for https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker
*
* @param {AcceptProp} accept
* @returns {{accept: string[]}[]}
*/
function pickerOptionsFromAccept(accept) {
if (isDefined(accept)) {
var acceptForPicker = Object.entries(accept).filter(function (_ref2) {
var _ref3 = _slicedToArray$1(_ref2, 2),
mimeType = _ref3[0],
ext = _ref3[1];
var ok = true;
if (!isMIMEType(mimeType)) {
console.warn("Skipped \"".concat(mimeType, "\" because it is not a valid MIME type. Check https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types for a list of valid MIME types."));
ok = false;
}
if (!Array.isArray(ext) || !ext.every(isExt)) {
console.warn("Skipped \"".concat(mimeType, "\" because an invalid file extension was provided."));
ok = false;
}
return ok;
}).reduce(function (agg, _ref4) {
var _ref5 = _slicedToArray$1(_ref4, 2),
mimeType = _ref5[0],
ext = _ref5[1];
return _objectSpread$1(_objectSpread$1({}, agg), {}, _defineProperty$1({}, mimeType, ext));
}, {});
return [{
// description is required due to https://crbug.com/1264708
description: "Files",
accept: acceptForPicker
}];
}
return accept;
}
/**
* Convert the `{accept}` dropzone prop to an array of MIME types/extensions.
* @param {AcceptProp} accept
* @returns {string}
*/
function acceptPropAsAcceptAttr(accept) {
if (isDefined(accept)) {
return Object.entries(accept).reduce(function (a, _ref6) {
var _ref7 = _slicedToArray$1(_ref6, 2),
mimeType = _ref7[0],
ext = _ref7[1];
return [].concat(_toConsumableArray$1(a), [mimeType], _toConsumableArray$1(ext));
}, []) // Silently discard invalid entries as pickerOptionsFromAccept warns about these
.filter(function (v) {
return isMIMEType(v) || isExt(v);
}).join(",");
}
return undefined;
}
/**
* Check if v is an exception caused by aborting a request (e.g window.showOpenFilePicker()).
*
* See https://developer.mozilla.org/en-US/docs/Web/API/DOMException.
* @param {any} v
* @returns {boolean} True if v is an abort exception.
*/
function isAbort(v) {
return v instanceof DOMException && (v.name === "AbortError" || v.code === v.ABORT_ERR);
}
/**
* Check if v is a security error.
*
* See https://developer.mozilla.org/en-US/docs/Web/API/DOMException.
* @param {any} v
* @returns {boolean} True if v is a security error.
*/
function isSecurityError(v) {
return v instanceof DOMException && (v.name === "SecurityError" || v.code === v.SECURITY_ERR);
}
/**
* Check if v is a MIME type string.
*
* See accepted format: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers.
*
* @param {string} v
*/
function isMIMEType(v) {
return v === "audio/*" || v === "video/*" || v === "image/*" || v === "text/*" || /\w+\/[-+.\w]+/g.test(v);
}
/**
* Check if v is a file extension.
* @param {string} v
*/
function isExt(v) {
return /^.*\.[\w]+$/.test(v);
}
/**
* @typedef {Object.<string, string[]>} AcceptProp
*/
/**
* @typedef {object} FileError
* @property {string} message
* @property {ErrorCode|string} code
*/
/**
* @typedef {"file-invalid-type"|"file-too-large"|"file-too-small"|"too-many-files"} ErrorCode
*/
var _excluded = ["children"],
_excluded2 = ["open"],
_excluded3 = ["refKey", "role", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnter", "onDragOver", "onDragLeave", "onDrop"],
_excluded4 = ["refKey", "onChange", "onClick"];
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Convenience wrapper component for the `useDropzone` hook
*
* ```jsx
* <Dropzone>
* {({getRootProps, getInputProps}) => (
* <div {...getRootProps()}>
* <input {...getInputProps()} />
* <p>Drag 'n' drop some files here, or click to select files</p>
* </div>
* )}
* </Dropzone>
* ```
*/
var Dropzone = /*#__PURE__*/reactExports.forwardRef(function (_ref, ref) {
var children = _ref.children,
params = _objectWithoutProperties(_ref, _excluded);
var _useDropzone = useDropzone(params),
open = _useDropzone.open,
props = _objectWithoutProperties(_useDropzone, _excluded2);
reactExports.useImperativeHandle(ref, function () {
return {
open: open
};
}, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element
return /*#__PURE__*/React.createElement(reactExports.Fragment, null, children(_objectSpread(_objectSpread({}, props), {}, {
open: open
})));
});
Dropzone.displayName = "Dropzone"; // Add default props for react-docgen
var defaultProps = {
disabled: false,
getFilesFromEvent: fromEvent,
maxSize: Infinity,
minSize: 0,
multiple: true,
maxFiles: 0,
preventDropOnDocument: true,
noClick: false,
noKeyboard: false,
noDrag: false,
noDragEventsBubbling: false,
validator: null,
useFsAccessApi: true,
autoFocus: false
};
Dropzone.defaultProps = defaultProps;
Dropzone.propTypes = {
/**
* Render function that exposes the dropzone state and prop getter fns
*
* @param {object} params
* @param {Function} params.getRootProps Returns the props you should apply to the root drop container you render
* @param {Function} params.getInputProps Returns the props you should apply to hidden file input you render
* @param {Function} params.open Open the native file selection dialog
* @param {boolean} params.isFocused Dropzone area is in focus
* @param {boolean} params.isFileDialogActive File dialog is opened
* @param {boolean} params.isDragActive Active drag is in progress
* @param {boolean} params.isDragAccept Dragged files are accepted
* @param {boolean} params.isDragReject Some dragged files are rejected
* @param {File[]} params.acceptedFiles Accepted files
* @param {FileRejection[]} params.fileRejections Rejected files and why they were rejected
*/
children: propTypesExports.func,
/**
* Set accepted file types.
* Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information.
* Keep in mind that mime type determination is not reliable across platforms. CSV files,
* for example, are reported as text/plain under macOS but as application/vnd.ms-excel under
* Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276).
*/
accept: propTypesExports.objectOf(propTypesExports.arrayOf(propTypesExports.string)),
/**
* Allow drag 'n' drop (or selection from the file dialog) of multiple files
*/
multiple: propTypesExports.bool,
/**
* If false, allow dropped items to take over the current browser window
*/
preventDropOnDocument: propTypesExports.bool,
/**
* If true, disables click to open the native file selection dialog
*/
noClick: propTypesExports.bool,
/**
* If true, disables SPACE/ENTER to open the native file selection dialog.
* Note that it also stops tracking the focus state.
*/
noKeyboard: propTypesExports.bool,
/**
* If true, disables drag 'n' drop
*/
noDrag: propTypesExports.bool,
/**
* If true, stops drag event propagation to parents
*/
noDragEventsBubbling: propTypesExports.bool,
/**
* Minimum file size (in bytes)
*/
minSize: propTypesExports.number,
/**
* Maximum file size (in bytes)
*/
maxSize: propTypesExports.number,
/**
* Maximum accepted number of files
* The default value is 0 which means there is no limitation to how many files are accepted.
*/
maxFiles: propTypesExports.number,
/**
* Enable/disable the dropzone
*/
disabled: propTypesExports.bool,
/**
* Use this to provide a custom file aggregator
*
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
*/
getFilesFromEvent: propTypesExports.func,
/**
* Cb for when closing the file dialog with no selection
*/
onFileDialogCancel: propTypesExports.func,
/**
* Cb for when opening the file dialog
*/
onFileDialogOpen: propTypesExports.func,
/**
* Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API
* to open the file picker instead of using an `<input type="file">` click event.
*/
useFsAccessApi: propTypesExports.bool,
/**
* Set to true to focus the root element on render
*/
autoFocus: propTypesExports.bool,
/**
* Cb for when the `dragenter` event occurs.
*
* @param {DragEvent} event
*/
onDragEnter: propTypesExports.func,
/**
* Cb for when the `dragleave` event occurs
*
* @param {DragEvent} event
*/
onDragLeave: propTypesExports.func,
/**
* Cb for when the `dragover` event occurs
*
* @param {DragEvent} event
*/
onDragOver: propTypesExports.func,
/**
* Cb for when the `drop` event occurs.
* Note that this callback is invoked after the `getFilesFromEvent` callback is done.
*
* Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props.
* `accept` must be a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) or a valid file extension.
* If `multiple` is set to false and additional files are dropped,
* all files besides the first will be rejected.
* Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well.
*
* Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected.
* If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props.
*
* `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server.
* For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library:
*
* ```js
* function onDrop(acceptedFiles) {
* const req = request.post('/upload')
* acceptedFiles.forEach(file => {
* req.attach(file.name, file)
* })
* req.end(callback)
* }
* ```
*
* @param {File[]} acceptedFiles
* @param {FileRejection[]} fileRejections
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
*/
onDrop: propTypesExports.func,
/**
* Cb for when the `drop` event occurs.
* Note that if no files are accepted, this callback is not invoked.
*
* @param {File[]} files
* @param {(DragEvent|Event)} event
*/
onDropAccepted: propTypesExports.func,
/**
* Cb for when the `drop` event occurs.
* Note that if no files are rejected, this callback is not invoked.
*
* @param {FileRejection[]} fileRejections
* @param {(DragEvent|Event)} event
*/
onDropRejected: propTypesExports.func,
/**
* Cb for when there's some error from any of the promises.
*
* @param {Error} error
*/
onError: propTypesExports.func,
/**
* Custom validation function. It must return null if there's no errors.
* @param {File} file
* @returns {FileError|FileError[]|null}
*/
validator: propTypesExports.func
};
/**
* A function that is invoked for the `dragenter`,
* `dragover` and `dragleave` events.
* It is not invoked if the items are not files (such as link, text, etc.).
*
* @callback dragCb
* @param {DragEvent} event
*/
/**
* A function that is invoked for the `drop` or input change event.
* It is not invoked if the items are not files (such as link, text, etc.).
*
* @callback dropCb
* @param {File[]} acceptedFiles List of accepted files
* @param {FileRejection[]} fileRejections List of rejected files and why they were rejected
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
*/
/**
* A function that is invoked for the `drop` or input change event.
* It is not invoked if the items are files (such as link, text, etc.).
*
* @callback dropAcceptedCb
* @param {File[]} files List of accepted files that meet the given criteria
* (`accept`, `multiple`, `minSize`, `maxSize`)
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
*/
/**
* A function that is invoked for the `drop` or input change event.
*
* @callback dropRejectedCb
* @param {File[]} files List of rejected files that do not meet the given criteria
* (`accept`, `multiple`, `minSize`, `maxSize`)
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
*/
/**
* A function that is used aggregate files,
* in a asynchronous fashion, from drag or input change events.
*
* @callback getFilesFromEvent
* @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)
* @returns {(File[]|Promise<File[]>)}
*/
/**
* An object with the current dropzone state.
*
* @typedef {object} DropzoneState
* @property {boolean} isFocused Dropzone area is in focus
* @property {boolean} isFileDialogActive File dialog is opened
* @property {boolean} isDragActive Active drag is in progress
* @property {boolean} isDragAccept Dragged files are accepted
* @property {boolean} isDragReject Some dragged files are rejected
* @property {File[]} acceptedFiles Accepted files
* @property {FileRejection[]} fileRejections Rejected files and why they were rejected
*/
/**
* An object with the dropzone methods.
*
* @typedef {object} DropzoneMethods
* @property {Function} getRootProps Returns the props you should apply to the root drop container you render
* @property {Function} getInputProps Returns the props you should apply to hidden file input you render
* @property {Function} open Open the native file selection dialog
*/
var initialState = {
isFocused: false,
isFileDialogActive: false,
isDragActive: false,
isDragAccept: false,
isDragReject: false,
acceptedFiles: [],
fileRejections: []
};
/**
* A React hook that creates a drag 'n' drop area.
*
* ```jsx
* function MyDropzone(props) {
* const {getRootProps, getInputProps} = useDropzone({
* onDrop: acceptedFiles => {
* // do something with the File objects, e.g. upload to some server
* }
* });
* return (
* <div {...getRootProps()}>
* <input {...getInputProps()} />
* <p>Drag and drop some files here, or click to select files</p>
* </div>
* )
* }
* ```
*
* @function useDropzone
*
* @param {object} props
* @param {import("./utils").AcceptProp} [props.accept] Set accepted file types.
* Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information.
* Keep in mind that mime type determination is not reliable across platforms. CSV files,
* for example, are reported as text/plain under macOS but as application/vnd.ms-excel under
* Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276).
* @param {boolean} [props.multiple=true] Allow drag 'n' drop (or selection from the file dialog) of multiple files
* @param {boolean} [props.preventDropOnDocument=true] If false, allow dropped items to take over the current browser window
* @param {boolean} [props.noClick=false] If true, disables click to open the native file selection dialog
* @param {boolean} [props.noKeyboard=false] If true, disables SPACE/ENTER to open the native file selection dialog.
* Note that it also stops tracking the focus state.
* @param {boolean} [props.noDrag=false] If true, disables drag 'n' drop
* @param {boolean} [props.noDragEventsBubbling=false] If true, stops drag event propagation to parents
* @param {number} [props.minSize=0] Minimum file size (in bytes)
* @param {number} [props.maxSize=Infinity] Maximum file size (in bytes)
* @param {boolean} [props.disabled=false] Enable/disable the dropzone
* @param {getFilesFromEvent} [props.getFilesFromEvent] Use this to provide a custom file aggregator
* @param {Function} [props.onFileDialogCancel] Cb for when closing the file dialog with no selection
* @param {boolean} [props.useFsAccessApi] Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API
* to open the file picker instead of using an `<input type="file">` click event.
* @param {boolean} autoFocus Set to true to auto focus the root element.
* @param {Function} [props.onFileDialogOpen] Cb for when opening the file dialog
* @param {dragCb} [props.onDragEnter] Cb for when the `dragenter` event occurs.
* @param {dragCb} [props.onDragLeave] Cb for when the `dragleave` event occurs
* @param {dragCb} [props.onDragOver] Cb for when the `dragover` event occurs
* @param {dropCb} [props.onDrop] Cb for when the `drop` event occurs.
* Note that this callback is invoked after the `getFilesFromEvent` callback is done.
*
* Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props.
* `accept` must be an object with keys as a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) and the value an array of file extensions (optional).
* If `multiple` is set to false and additional files are dropped,
* all files besides the first will be rejected.
* Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well.
*
* Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected.
* If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props.
*
* `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server.
* For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library:
*
* ```js
* function onDrop(acceptedFiles) {
* const req = request.post('/upload')
* acceptedFiles.forEach(file => {
* req.attach(file.name, file)
* })
* req.end(callback)
* }
* ```
* @param {dropAcceptedCb} [props.onDropAccepted]
* @param {dropRejectedCb} [props.onDropRejected]
* @param {(error: Error) => void} [props.onError]
*
* @returns {DropzoneState & DropzoneMethods}
*/
function useDropzone() {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
accept = _defaultProps$props.accept,
disabled = _defaultProps$props.disabled,
getFilesFromEvent = _defaultProps$props.getFilesFromEvent,
maxSize = _defaultProps$props.maxSize,
minSize = _defaultProps$props.minSize,
multiple = _defaultProps$props.multiple,
maxFiles = _defaultProps$props.maxFiles,
onDragEnter = _defaultProps$props.onDragEnter,
onDragLeave = _defaultProps$props.onDragLeave,
onDragOver = _defaultProps$props.onDragOver,
onDrop = _defaultProps$props.onDrop,
onDropAccepted = _defaultProps$props.onDropAccepted,
onDropRejected = _defaultProps$props.onDropRejected,
onFileDialogCancel = _defaultProps$props.onFileDialogCancel,
onFileDialogOpen = _defaultProps$props.onFileDialogOpen,
useFsAccessApi = _defaultProps$props.useFsAccessApi,
autoFocus = _defaultProps$props.autoFocus,
preventDropOnDocument = _defaultProps$props.preventDropOnDocument,
noClick = _defaultProps$props.noClick,
noKeyboard = _defaultProps$props.noKeyboard,
noDrag = _defaultProps$props.noDrag,
noDragEventsBubbling = _defaultProps$props.noDragEventsBubbling,
onError = _defaultProps$props.onError,
validator = _defaultProps$props.validator;
var acceptAttr = reactExports.useMemo(function () {
return acceptPropAsAcceptAttr(accept);
}, [accept]);
var pickerTypes = reactExports.useMemo(function () {
return pickerOptionsFromAccept(accept);
}, [accept]);
var onFileDialogOpenCb = reactExports.useMemo(function () {
return typeof onFileDialogOpen === "function" ? onFileDialogOpen : noop;
}, [onFileDialogOpen]);
var onFileDialogCancelCb = reactExports.useMemo(function () {
return typeof onFileDialogCancel === "function" ? onFileDialogCancel : noop;
}, [onFileDialogCancel]);
/**
* @constant
* @type {React.MutableRefObject<HTMLElement>}
*/
var rootRef = reactExports.useRef(null);
var inputRef = reactExports.useRef(null);
var _useReducer = reactExports.useReducer(reducer, initialState),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
var isFocused = state.isFocused,
isFileDialogActive = state.isFileDialogActive;
var fsAccessApiWorksRef = reactExports.useRef(typeof window !== "undefined" && window.isSecureContext && useFsAccessApi && canUseFileSystemAccessAPI()); // Update file dialog active state when the window is focused on
var onWindowFocus = function onWindowFocus() {
// Execute the timeout only if the file dialog is opened in the browser
if (!fsAccessApiWorksRef.current && isFileDialogActive) {
setTimeout(function () {
if (inputRef.current) {
var files = inputRef.current.files;
if (!files.length) {
dispatch({
type: "closeDialog"
});
onFileDialogCancelCb();
}
}
}, 300);
}
};
reactExports.useEffect(function () {
window.addEventListener("focus", onWindowFocus, false);
return function () {
window.removeEventListener("focus", onWindowFocus, false);
};
}, [inputRef, isFileDialogActive, onFileDialogCancelCb, fsAccessApiWorksRef]);
var dragTargetsRef = reactExports.useRef([]);
var onDocumentDrop = function onDocumentDrop(event) {
if (rootRef.current && rootRef.current.contains(event.target)) {
// If we intercepted an event for our instance, let it propagate down to the instance's onDrop handler
return;
}
event.preventDefault();
dragTargetsRef.current = [];
};
reactExports.useEffect(function () {
if (preventDropOnDocument) {
document.addEventListener("dragover", onDocumentDragOver, false);
document.addEventListener("drop", onDocumentDrop, false);
}
return function () {
if (preventDropOnDocument) {
document.removeEventListener("dragover", onDocumentDragOver);
document.removeEventListener("drop", onDocumentDrop);
}
};
}, [rootRef, preventDropOnDocument]); // Auto focus the root when autoFocus is true
reactExports.useEffect(function () {
if (!disabled && autoFocus && rootRef.current) {
rootRef.current.focus();
}
return function () {};
}, [rootRef, autoFocus, disabled]);
var onErrCb = reactExports.useCallback(function (e) {
if (onError) {
onError(e);
} else {
// Let the user know something's gone wrong if they haven't provided the onError cb.
console.error(e);
}
}, [onError]);
var onDragEnterCb = reactExports.useCallback(function (event) {
event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done
event.persist();
stopPropagation(event);
dragTargetsRef.current = [].concat(_toConsumableArray(dragTargetsRef.current), [event.target]);
if (isEvtWithFiles(event)) {
Promise.resolve(getFilesFromEvent(event)).then(function (files) {
if (isPropagationStopped(event) && !noDragEventsBubbling) {
return;
}
var fileCount = files.length;
var isDragAccept = fileCount > 0 && allFilesAccepted({
files: files,
accept: acceptAttr,
minSize: minSize,
maxSize: maxSize,
multiple: multiple,
maxFiles: maxFiles,
validator: validator
});
var isDragReject = fileCount > 0 && !isDragAccept;
dispatch({
isDragAccept: isDragAccept,
isDragReject: isDragReject,
isDragActive: true,
type: "setDraggedFiles"
});
if (onDragEnter) {
onDragEnter(event);
}
}).catch(function (e) {
return onErrCb(e);
});
}
}, [getFilesFromEvent, onDragEnter, onErrCb, noDragEventsBubbling, acceptAttr, minSize, maxSize, multiple, maxFiles, validator]);
var onDragOverCb = reactExports.useCallback(function (event) {
event.preventDefault();
event.persist();
stopPropagation(event);
var hasFiles = isEvtWithFiles(event);
if (hasFiles && event.dataTransfer) {
try {
event.dataTransfer.dropEffect = "copy";
} catch (_unused) {}
/* eslint-disable-line no-empty */
}
if (hasFiles && onDragOver) {
onDragOver(event);
}
return false;
}, [onDragOver, noDragEventsBubbling]);
var onDragLeaveCb = reactExports.useCallback(function (event) {
event.preventDefault();
event.persist();
stopPropagation(event); // Only deactivate once the dropzone and all children have been left
var targets = dragTargetsRef.current.filter(function (target) {
return rootRef.current && rootRef.current.contains(target);
}); // Make sure to remove a target present multiple times only once
// (Firefox may fire dragenter/dragleave multiple times on the same element)
var targetIdx = targets.indexOf(event.target);
if (targetIdx !== -1) {
targets.splice(targetIdx, 1);
}
dragTargetsRef.current = targets;
if (targets.length > 0) {
return;
}
dispatch({
type: "setDraggedFiles",
isDragActive: false,
isDragAccept: false,
isDragReject: false
});
if (isEvtWithFiles(event) && onDragLeave) {
onDragLeave(event);
}
}, [rootRef, onDragLeave, noDragEventsBubbling]);
var setFiles = reactExports.useCallback(function (files, event) {
var acceptedFiles = [];
var fileRejections = [];
files.forEach(function (file) {
var _fileAccepted = fileAccepted(file, acceptAttr),
_fileAccepted2 = _slicedToArray(_fileAccepted, 2),
accepted = _fileAccepted2[0],
acceptError = _fileAccepted2[1];
var _fileMatchSize = fileMatchSize(file, minSize, maxSize),
_fileMatchSize2 = _slicedToArray(_fileMatchSize, 2),
sizeMatch = _fileMatchSize2[0],
sizeError = _fileMatchSize2[1];
var customErrors = validator ? validator(file) : null;
if (accepted && sizeMatch && !customErrors) {
acceptedFiles.push(file);
} else {
var errors = [acceptError, sizeError];
if (customErrors) {
errors = errors.concat(customErrors);
}
fileRejections.push({
file: file,
errors: errors.filter(function (e) {
return e;
})
});
}
});
if (!multiple && acceptedFiles.length > 1 || multiple && maxFiles >= 1 && acceptedFiles.length > maxFiles) {
// Reject everything and empty accepted files
acceptedFiles.forEach(function (file) {
fileRejections.push({
file: file,
errors: [TOO_MANY_FILES_REJECTION]
});
});
acceptedFiles.splice(0);
}
dispatch({
acceptedFiles: acceptedFiles,
fileRejections: fileRejections,
type: "setFiles"
});
if (onDrop) {
onDrop(acceptedFiles, fileRejections, event);
}
if (fileRejections.length > 0 && onDropRejected) {
onDropRejected(fileRejections, event);
}
if (acceptedFiles.length > 0 && onDropAccepted) {
onDropAccepted(acceptedFiles, event);
}
}, [dispatch, multiple, acceptAttr, minSize, maxSize, maxFiles, onDrop, onDropAccepted, onDropRejected, validator]);
var onDropCb = reactExports.useCallback(function (event) {
event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done
event.persist();
stopPropagation(event);
dragTargetsRef.current = [];
if (isEvtWithFiles(event)) {
Promise.resolve(getFilesFromEvent(event)).then(function (files) {
if (isPropagationStopped(event) && !noDragEventsBubbling) {
return;
}
setFiles(files, event);
}).catch(function (e) {
return onErrCb(e);
});
}
dispatch({
type: "reset"
});
}, [getFilesFromEvent, setFiles, onErrCb, noDragEventsBubbling]); // Fn for opening the file dialog programmatically
var openFileDialog = reactExports.useCallback(function () {
// No point to use FS access APIs if context is not secure
// https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts#feature_detection
if (fsAccessApiWorksRef.current) {
dispatch({
type: "openDialog"
});
onFileDialogOpenCb(); // https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker
var opts = {
multiple: multiple,
types: pickerTypes
};
window.showOpenFilePicker(opts).then(function (handles) {
return getFilesFromEvent(handles);
}).then(function (files) {
setFiles(files, null);
dispatch({
type: "closeDialog"
});
}).catch(function (e) {
// AbortError means the user canceled
if (isAbort(e)) {
onFileDialogCancelCb(e);
dispatch({
type: "closeDialog"
});
} else if (isSecurityError(e)) {
fsAccessApiWorksRef.current = false; // CORS, so cannot use this API
// Try using the input
if (inputRef.current) {
inputRef.current.value = null;
inputRef.current.click();
} else {
onErrCb(new Error("Cannot open the file picker because the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API is not supported and no <input> was provided."));
}
} else {
onErrCb(e);
}
});
return;
}
if (inputRef.current) {
dispatch({
type: "openDialog"
});
onFileDialogOpenCb();
inputRef.current.value = null;
inputRef.current.click();
}
}, [dispatch, onFileDialogOpenCb, onFileDialogCancelCb, useFsAccessApi, setFiles, onErrCb, pickerTypes, multiple]); // Cb to open the file dialog when SPACE/ENTER occurs on the dropzone
var onKeyDownCb = reactExports.useCallback(function (event) {
// Ignore keyboard events bubbling up the DOM tree
if (!rootRef.current || !rootRef.current.isEqualNode(event.target)) {
return;
}
if (event.key === " " || event.key === "Enter" || event.keyCode === 32 || event.keyCode === 13) {
event.preventDefault();
openFileDialog();
}
}, [rootRef, openFileDialog]); // Update focus state for the dropzone
var onFocusCb = reactExports.useCallback(function () {
dispatch({
type: "focus"
});
}, []);
var onBlurCb = reactExports.useCallback(function () {
dispatch({
type: "blur"
});
}, []); // Cb to open the file dialog when click occurs on the dropzone
var onClickCb = reactExports.useCallback(function () {
if (noClick) {
return;
} // In IE11/Edge the file-browser dialog is blocking, therefore, use setTimeout()
// to ensure React can handle state changes
// See: https://github.com/react-dropzone/react-dropzone/issues/450
if (isIeOrEdge()) {
setTimeout(openFileDialog, 0);
} else {
openFileDialog();
}
}, [noClick, openFileDialog]);
var composeHandler = function composeHandler(fn) {
return disabled ? null : fn;
};
var composeKeyboardHandler = function composeKeyboardHandler(fn) {
return noKeyboard ? null : composeHandler(fn);
};
var composeDragHandler = function composeDragHandler(fn) {
return noDrag ? null : composeHandler(fn);
};
var stopPropagation = function stopPropagation(event) {
if (noDragEventsBubbling) {
event.stopPropagation();
}
};
var getRootProps = reactExports.useMemo(function () {
return function () {
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref2$refKey = _ref2.refKey,
refKey = _ref2$refKey === void 0 ? "ref" : _ref2$refKey,
role = _ref2.role,
onKeyDown = _ref2.onKeyDown,
onFocus = _ref2.onFocus,
onBlur = _ref2.onBlur,
onClick = _ref2.onClick,
onDragEnter = _ref2.onDragEnter,
onDragOver = _ref2.onDragOver,
onDragLeave = _ref2.onDragLeave,
onDrop = _ref2.onDrop,
rest = _objectWithoutProperties(_ref2, _excluded3);
return _objectSpread(_objectSpread(_defineProperty({
onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)),
onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)),
onBlur: composeKeyboardHandler(composeEventHandlers(onBlur, onBlurCb)),
onClick: composeHandler(composeEventHandlers(onClick, onClickCb)),
onDragEnter: composeDragHandler(composeEventHandlers(onDragEnter, onDragEnterCb)),
onDragOver: composeDragHandler(composeEventHandlers(onDragOver, onDragOverCb)),
onDragLeave: composeDragHandler(composeEventHandlers(onDragLeave, onDragLeaveCb)),
onDrop: composeDragHandler(composeEventHandlers(onDrop, onDropCb)),
role: typeof role === "string" && role !== "" ? role : "presentation"
}, refKey, rootRef), !disabled && !noKeyboard ? {
tabIndex: 0
} : {}), rest);
};
}, [rootRef, onKeyDownCb, onFocusCb, onBlurCb, onClickCb, onDragEnterCb, onDragOverCb, onDragLeaveCb, onDropCb, noKeyboard, noDrag, disabled]);
var onInputElementClick = reactExports.useCallback(function (event) {
event.stopPropagation();
}, []);
var getInputProps = reactExports.useMemo(function () {
return function () {
var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref3$refKey = _ref3.refKey,
refKey = _ref3$refKey === void 0 ? "ref" : _ref3$refKey,
onChange = _ref3.onChange,
onClick = _ref3.onClick,
rest = _objectWithoutProperties(_ref3, _excluded4);
var inputProps = _defineProperty({
accept: acceptAttr,
multiple: multiple,
type: "file",
style: {
display: "none"
},
onChange: composeHandler(composeEventHandlers(onChange, onDropCb)),
onClick: composeHandler(composeEventHandlers(onClick, onInputElementClick)),
tabIndex: -1
}, refKey, inputRef);
return _objectSpread(_objectSpread({}, inputProps), rest);
};
}, [inputRef, accept, multiple, onDropCb, disabled]);
return _objectSpread(_objectSpread({}, state), {}, {
isFocused: isFocused && !disabled,
getRootProps: getRootProps,
getInputProps: getInputProps,
rootRef: rootRef,
inputRef: inputRef,
open: composeHandler(openFileDialog)
});
}
/**
* @param {DropzoneState} state
* @param {{type: string} & DropzoneState} action
* @returns {DropzoneState}
*/
function reducer(state, action) {
/* istanbul ignore next */
switch (action.type) {
case "focus":
return _objectSpread(_objectSpread({}, state), {}, {
isFocused: true
});
case "blur":
return _objectSpread(_objectSpread({}, state), {}, {
isFocused: false
});
case "openDialog":
return _objectSpread(_objectSpread({}, initialState), {}, {
isFileDialogActive: true
});
case "closeDialog":
return _objectSpread(_objectSpread({}, state), {}, {
isFileDialogActive: false
});
case "setDraggedFiles":
return _objectSpread(_objectSpread({}, state), {}, {
isDragActive: action.isDragActive,
isDragAccept: action.isDragAccept,
isDragReject: action.isDragReject
});
case "setFiles":
return _objectSpread(_objectSpread({}, state), {}, {
acceptedFiles: action.acceptedFiles,
fileRejections: action.fileRejections
});
case "reset":
return _objectSpread({}, initialState);
default:
return state;
}
}
function noop() {}
var ExpandLess = {};
var interopRequireDefaultExports = {};
var interopRequireDefault = {
get exports(){ return interopRequireDefaultExports; },
set exports(v){ interopRequireDefaultExports = v; },
};
(function (module) {
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
"default": obj
};
}
module.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports["default"] = module.exports;
} (interopRequireDefault));
var createSvgIcon = {};
const require$$0 = /*@__PURE__*/getAugmentedNamespace(utils);
var hasRequiredCreateSvgIcon;
function requireCreateSvgIcon () {
if (hasRequiredCreateSvgIcon) return createSvgIcon;
hasRequiredCreateSvgIcon = 1;
(function (exports) {
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "default", {
enumerable: true,
get: function () {
return _utils.createSvgIcon;
}
});
var _utils = require$$0;
} (createSvgIcon));
return createSvgIcon;
}
const require$$2 = /*@__PURE__*/getAugmentedNamespace(jsxRuntime);
var _interopRequireDefault$6 = interopRequireDefaultExports;
Object.defineProperty(ExpandLess, "__esModule", {
value: true
});
var default_1$6 = ExpandLess.default = void 0;
var _createSvgIcon$6 = _interopRequireDefault$6(requireCreateSvgIcon());
var _jsxRuntime$6 = require$$2;
var _default$6 = (0, _createSvgIcon$6.default)( /*#__PURE__*/(0, _jsxRuntime$6.jsx)("path", {
d: "m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"
}), 'ExpandLess');
default_1$6 = ExpandLess.default = _default$6;
var Palette = {};
var _interopRequireDefault$5 = interopRequireDefaultExports;
Object.defineProperty(Palette, "__esModule", {
value: true
});
var default_1$5 = Palette.default = void 0;
var _createSvgIcon$5 = _interopRequireDefault$5(requireCreateSvgIcon());
var _jsxRuntime$5 = require$$2;
var _default$5 = (0, _createSvgIcon$5.default)( /*#__PURE__*/(0, _jsxRuntime$5.jsx)("path", {
d: "M12 2C6.49 2 2 6.49 2 12s4.49 10 10 10c1.38 0 2.5-1.12 2.5-2.5 0-.61-.23-1.2-.64-1.67-.08-.1-.13-.21-.13-.33 0-.28.22-.5.5-.5H16c3.31 0 6-2.69 6-6 0-4.96-4.49-9-10-9zm5.5 11c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm-3-4c-.83 0-1.5-.67-1.5-1.5S13.67 6 14.5 6s1.5.67 1.5 1.5S15.33 9 14.5 9zM5 11.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5S7.33 13 6.5 13 5 12.33 5 11.5zm6-4c0 .83-.67 1.5-1.5 1.5S8 8.33 8 7.5 8.67 6 9.5 6s1.5.67 1.5 1.5z"
}), 'Palette');
default_1$5 = Palette.default = _default$5;
var Save = {};
var _interopRequireDefault$4 = interopRequireDefaultExports;
Object.defineProperty(Save, "__esModule", {
value: true
});
var default_1$4 = Save.default = void 0;
var _createSvgIcon$4 = _interopRequireDefault$4(requireCreateSvgIcon());
var _jsxRuntime$4 = require$$2;
var _default$4 = (0, _createSvgIcon$4.default)( /*#__PURE__*/(0, _jsxRuntime$4.jsx)("path", {
d: "M17 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V7l-4-4zm-5 16c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3zm3-10H5V5h10v4z"
}), 'Save');
default_1$4 = Save.default = _default$4;
var DeleteForever = {};
var _interopRequireDefault$3 = interopRequireDefaultExports;
Object.defineProperty(DeleteForever, "__esModule", {
value: true
});
var default_1$3 = DeleteForever.default = void 0;
var _createSvgIcon$3 = _interopRequireDefault$3(requireCreateSvgIcon());
var _jsxRuntime$3 = require$$2;
var _default$3 = (0, _createSvgIcon$3.default)( /*#__PURE__*/(0, _jsxRuntime$3.jsx)("path", {
d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zm2.46-7.12 1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12zM15.5 4l-1-1h-5l-1 1H5v2h14V4z"
}), 'DeleteForever');
default_1$3 = DeleteForever.default = _default$3;
const useStyles$7 = makeStyles$1()({
configDropDownElement: {
height: "2em",
"max-width": "24em",
color: "black",
"text-decoration": "none",
display: "flex"
},
configDropDownElImg: {
display: "inline-block",
height: "100%",
width: "15%"
},
configDropDownElImgImg: {
"max-height": "100%",
"max-width": "100%"
},
configDropDownElText: {
height: "100%",
width: "60%",
"white-space": "nowrap",
overflow: "hidden",
"text-overflow": "ellipsis",
display: "inline-block"
},
configDropDownElDelete: {
height: "100%",
width: "12%",
position: "absolute",
right: "0"
}
});
const ConfigDropDownElement = (props) => {
const {
classes
} = useStyles$7();
const {
config,
onDeleteCallback
} = props;
const onDeleteElementClicked = (event) => {
event.stopPropagation();
onDeleteCallback(config);
};
return /* @__PURE__ */ jsxs("div", { className: classes.configDropDownElement, children: [
/* @__PURE__ */ jsx("div", { className: classes.configDropDownElImg, children: /* @__PURE__ */ jsx("img", { alt: "saved config preview", className: classes.configDropDownElImgImg, src: config.imageUrl }) }),
/* @__PURE__ */ jsx("p", { className: classes.configDropDownElText, children: config.imageUrl }),
/* @__PURE__ */ jsx(IconButton$1, { className: classes.configDropDownElDelete, onClick: onDeleteElementClicked, children: /* @__PURE__ */ jsx(default_1$3, {}) })
] });
};
const useStyles$6 = makeStyles$1()({
configDropDownSelector: {
"min-width": "10em",
margin: "0.4em"
},
configDropDownSaveIcon: {
"vertical-align": "bottom"
},
dropDownWrapper: {
display: "flex"
}
});
const usePageReduxStoreSetViewCoordsAction = () => {
const dispatch = usePageReduxStoreDispatch();
return (x, y) => {
if (dispatch)
dispatch(setViewCoordinates([x, y]));
};
};
const useSavedConfigurations = () => {
reactExports.useEffect(() => {
const unsubscribeSaveConfig = startAppListening({
matcher: isAnyOf(overlaySlice.actions.saveConfiguration, overlaySlice.actions.removeSavedConfig),
effect: (action, listenerApi) => {
const savedConfigurations = selectSavedConfigurations(listenerApi.getState());
localStorage.setItem("OverlaySavedConfigurationsv2", JSON.stringify(savedConfigurations));
}
});
return () => unsubscribeSaveConfig();
});
return useAppSelector(selectSavedConfigurations);
};
const ConfigDropDown = () => {
const {
classes
} = useStyles$6();
const dispatch = useAppDispatch();
const savedConfigurations = useSavedConfigurations();
const inputUrl = useAppSelector(selectInputUrl);
const currentStateAsConfiguration = useAppSelector(selectCurrentStateAsConfiguration);
const setViewCoords = usePageReduxStoreSetViewCoordsAction();
const onApplyConfig = (config) => {
dispatch(setInputImageAction(config.imageUrl));
dispatch(overlaySlice.actions.setModifierImageBrightness(config.modifiers.imageBrightness));
dispatch(overlaySlice.actions.setModifierShouldConvertColors(config.modifiers.shouldConvertColors));
dispatch(overlaySlice.actions.setPlacementAutoSelectColor(config.modifiers.autoSelectColor));
dispatch(overlaySlice.actions.setPlacementXOffset(config.placementConfiguration.xOffset));
dispatch(overlaySlice.actions.setPlacementYOffset(config.placementConfiguration.yOffset));
dispatch(overlaySlice.actions.setPlacementTransparency(config.placementConfiguration.transparency));
setViewCoords(config.placementConfiguration.xOffset, config.placementConfiguration.yOffset);
};
const onLoadConfigByUrl = (url) => {
const config = savedConfigurations.find((c) => c.imageUrl === url);
if (config)
onApplyConfig(config);
else
logger.logError("Tried to load config from url, but not found in saved");
};
const onSaveActiveConfiguration = () => {
if (currentStateAsConfiguration)
dispatch(overlaySlice.actions.saveConfiguration(currentStateAsConfiguration));
};
const onRemoveConfig = (config) => {
dispatch(overlaySlice.actions.removeSavedConfig(config.imageUrl));
};
return /* @__PURE__ */ jsxs("div", { className: classes.dropDownWrapper, children: [
/* @__PURE__ */ jsxs(FormControl$1, { children: [
/* @__PURE__ */ jsx(InputLabel$1, { id: "saved-config-dropdown-label", children: "Load saved config" }),
/* @__PURE__ */ jsx(Select$1, { className: classes.configDropDownSelector, labelId: "saved-config-dropdown-label", value: inputUrl ?? "", onChange: (value) => {
if (typeof value.target.value === "string")
onLoadConfigByUrl(value.target.value);
}, children: savedConfigurations.map((config) => /* @__PURE__ */ jsx(MenuItem$1, { value: config.imageUrl, children: /* @__PURE__ */ jsx(ConfigDropDownElement, { config, onDeleteCallback: onRemoveConfig }, config.imageUrl) }, config.imageUrl)) })
] }),
inputUrl ? /* @__PURE__ */ jsx(Tooltip$1, { title: "Save current config", children: /* @__PURE__ */ jsx(IconButton$1, { onClick: onSaveActiveConfiguration, children: /* @__PURE__ */ jsx(default_1$4, {}) }) }) : null
] });
};
var AttachFile = {};
var _interopRequireDefault$2 = interopRequireDefaultExports;
Object.defineProperty(AttachFile, "__esModule", {
value: true
});
var default_1$2 = AttachFile.default = void 0;
var _createSvgIcon$2 = _interopRequireDefault$2(requireCreateSvgIcon());
var _jsxRuntime$2 = require$$2;
var _default$2 = (0, _createSvgIcon$2.default)( /*#__PURE__*/(0, _jsxRuntime$2.jsx)("path", {
d: "M16.5 6v11.5c0 2.21-1.79 4-4 4s-4-1.79-4-4V5c0-1.38 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5v10.5c0 .55-.45 1-1 1s-1-.45-1-1V6H10v9.5c0 1.38 1.12 2.5 2.5 2.5s2.5-1.12 2.5-2.5V5c0-2.21-1.79-4-4-4S7 2.79 7 5v12.5c0 3.04 2.46 5.5 5.5 5.5s5.5-2.46 5.5-5.5V6h-1.5z"
}), 'AttachFile');
default_1$2 = AttachFile.default = _default$2;
var Warning = {};
var _interopRequireDefault$1 = interopRequireDefaultExports;
Object.defineProperty(Warning, "__esModule", {
value: true
});
var default_1$1 = Warning.default = void 0;
var _createSvgIcon$1 = _interopRequireDefault$1(requireCreateSvgIcon());
var _jsxRuntime$1 = require$$2;
var _default$1 = (0, _createSvgIcon$1.default)( /*#__PURE__*/(0, _jsxRuntime$1.jsx)("path", {
d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
}), 'Warning');
default_1$1 = Warning.default = _default$1;
const useClipboardPasteFile = (onPaste, mimeTypeRegex) => {
reactExports.useEffect(() => {
const handlePaste = (e) => {
const {
clipboardData
} = e;
if (!clipboardData)
return;
const {
items
} = clipboardData;
if (!items)
return;
const files = Array.from(items).filter((i) => i.kind === "file" && i.type.match(mimeTypeRegex)).map((i) => i.getAsFile());
if (files.length === 0)
return;
const matchedFile = files[0];
if (!matchedFile)
return;
onPaste(matchedFile);
};
document.addEventListener("paste", handlePaste);
return () => document.removeEventListener("paste", handlePaste);
}, [onPaste, mimeTypeRegex]);
};
function useDebounce(value, delay) {
const [debouncedValue, setDebouncedValue] = reactExports.useState(value);
reactExports.useEffect(() => {
const handler = setTimeout(() => {
setDebouncedValue(value);
}, delay);
return () => {
clearTimeout(handler);
};
}, [value, delay]);
return debouncedValue;
}
const useIsFocused = () => {
const [isFocused, setIsFocused] = reactExports.useState(false);
const onFocus = reactExports.useCallback(() => setIsFocused(true), []);
const onBlur = reactExports.useCallback(() => setIsFocused(false), []);
return {
isFocused,
elementProps: {
onFocus,
onBlur
}
};
};
const useStyles$5 = makeStyles$1()({
inputWithMargin: {
margin: "0.4em"
},
invisibleFileInput: {
display: "none"
},
inputWrapper: {
display: "flex"
}
});
const OverlayUrlInput = () => {
const {
isFocused,
elementProps
} = useIsFocused();
const [inputUrl, setInputUrl] = React.useState("");
const {
classes
} = useStyles$5();
const inputImageDebouced = useDebounce(inputUrl, 500);
const dispatch = useAppDispatch();
const inputUrlState = useAppSelector(selectInputUrl);
const handleUrlInputChange = (e) => {
setInputUrl(e.target.value);
};
const isFirstRun = reactExports.useRef(true);
reactExports.useEffect(() => {
if (!isFocused)
return;
if (!isFirstRun.current)
dispatch(setInputImageAction(inputImageDebouced));
isFirstRun.current = false;
}, [dispatch, inputImageDebouced, isFocused]);
reactExports.useEffect(() => {
setInputUrl(inputUrlState ?? "");
}, [inputUrlState]);
return /* @__PURE__ */ jsx("div", { className: classes.inputWrapper, children: /* @__PURE__ */ jsx(TextField$1, { ...elementProps, className: classes.inputWithMargin, label: "Url", type: "string", value: inputUrl ?? "", onChange: handleUrlInputChange, helperText: "Http url to an image" }) });
};
const useStyles$4 = makeStyles$1()((theme) => ({
dropzoneEl: {
border: "1px dashed #ccc",
borderRadius: "5px",
cursor: "pointer",
height: "200px",
margin: "20px auto",
textAlign: "center",
width: "200px",
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center"
},
dropzoneText: {
color: theme.palette.text.secondary
}
}));
const InputImageModal = (props) => {
const {
isOpen,
onClose
} = props;
const {
classes
} = useStyles$4();
const dispatch = useAppDispatch();
const theme = useAppTheme();
const onReceiveFile = reactExports.useCallback((file) => {
dispatch(setInputImageAction(file));
onClose();
}, [dispatch, onClose]);
useClipboardPasteFile(onReceiveFile, "image.*");
const onDrop = reactExports.useCallback((acceptedFiles) => {
const file = acceptedFiles[0];
if (file)
onReceiveFile(file);
}, [onReceiveFile]);
return /* @__PURE__ */ jsxs(Dialog$1, { open: isOpen, onClose, children: [
/* @__PURE__ */ jsx(DialogTitle$1, { children: "Select overlay image" }),
/* @__PURE__ */ jsxs(DialogContent$1, { children: [
/* @__PURE__ */ jsx(OverlayUrlInput, {}),
/* @__PURE__ */ jsx(Typography$1, { sx: {
margin: "1em 0em 1em 0"
}, variant: "body1", children: "CTRL + V to paste image from clipboard" }),
/* @__PURE__ */ jsx(Dropzone, { onDrop, accept: {
"image/*": [".png", ".gif", ".jpeg", ".jpg"]
}, children: ({
getRootProps,
getInputProps,
isDragActive,
isDragAccept
}) => /* @__PURE__ */ jsxs("div", { ...getRootProps({
className: classes.dropzoneEl
}), style: {
borderColor: isDragAccept ? theme.palette.success.main : void 0
}, children: [
/* @__PURE__ */ jsx("input", { ...getInputProps(), hidden: true }),
/* @__PURE__ */ jsx("span", { children: isDragActive ? "📂" : "📁" }),
/* @__PURE__ */ jsx("p", { className: classes.dropzoneText, children: "Drag'n'drop images, or click to select files" })
] }) })
] }),
/* @__PURE__ */ jsx(DialogActions$1, { children: /* @__PURE__ */ jsx(Button$1, { onClick: onClose, children: "Close" }) })
] });
};
var Share = {};
var _interopRequireDefault = interopRequireDefaultExports;
Object.defineProperty(Share, "__esModule", {
value: true
});
var default_1 = Share.default = void 0;
var _createSvgIcon = _interopRequireDefault(requireCreateSvgIcon());
var _jsxRuntime = require$$2;
var _default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
d: "M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z"
}), 'Share');
default_1 = Share.default = _default;
function getModalStyle() {
const top = 50;
const left = 50;
return {
top: `${top}%`,
left: `${left}%`,
transform: `translate(-${top}%, -${left}%)`
};
}
const useStyles$3 = makeStyles$1()((theme) => ({
paper: {
position: "absolute",
width: 400,
backgroundColor: theme.palette.background.paper,
border: "2px solid #000",
boxShadow: theme.shadows[5],
padding: theme.spacing(2, 4, 3)
}
}));
const ShareOverlayModal = (props) => {
const {
isOpen,
setIsOpen
} = props;
const {
classes
} = useStyles$3();
const [modalStyle] = reactExports.useState(getModalStyle);
const [sharedInput, setSharedInput] = reactExports.useState();
const [sharedInputParsed, setSharedInputParsed] = reactExports.useState();
const dispatch = useAppDispatch();
const currentConfiguration = useAppSelector(selectCurrentStateAsConfiguration);
const setViewCoords = usePageReduxStoreSetViewCoordsAction();
reactExports.useEffect(() => {
try {
if (sharedInput)
setSharedInputParsed(JSON.parse(sharedInput));
else
setSharedInputParsed(void 0);
} catch (error) {
setSharedInputParsed(void 0);
}
}, [sharedInput]);
if (!isOpen)
return null;
const handleClose = () => {
setIsOpen(false);
};
const onApplyConfig = (config) => {
dispatch(setInputImageAction(config.imageUrl));
dispatch(overlaySlice.actions.setModifierImageBrightness(config.modifiers.imageBrightness));
dispatch(overlaySlice.actions.setModifierShouldConvertColors(config.modifiers.shouldConvertColors));
dispatch(overlaySlice.actions.setPlacementAutoSelectColor(config.modifiers.autoSelectColor));
dispatch(overlaySlice.actions.setPlacementXOffset(config.placementConfiguration.xOffset));
dispatch(overlaySlice.actions.setPlacementYOffset(config.placementConfiguration.yOffset));
dispatch(overlaySlice.actions.setPlacementTransparency(config.placementConfiguration.transparency));
setViewCoords(config.placementConfiguration.xOffset, config.placementConfiguration.yOffset);
handleClose();
};
const fillFromOverlay = () => {
const fillStr = JSON.stringify(currentConfiguration);
setSharedInput(fillStr);
navigator.clipboard.writeText(fillStr);
};
const handleApplyConfig = () => {
if (sharedInputParsed)
onApplyConfig(sharedInputParsed);
};
return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Modal$1, { open: isOpen, onClose: handleClose, children: /* @__PURE__ */ jsxs("div", { style: modalStyle, className: classes.paper, children: [
/* @__PURE__ */ jsx(DialogTitle$1, { children: "Share your overlay" }),
/* @__PURE__ */ jsx(TextField$1, { label: "Shared overlay", type: "string", value: sharedInput, onChange: (e) => {
setSharedInput(e.target.value);
} }),
sharedInput ? sharedInputParsed ? "ok" : "not ok" : null,
/* @__PURE__ */ jsx(Button$1, { onClick: handleApplyConfig, disabled: sharedInputParsed == null, children: "Apply" }),
/* @__PURE__ */ jsx("br", {}),
/* @__PURE__ */ jsx(Button$1, { onClick: fillFromOverlay, disabled: currentConfiguration == null, children: "Fill from active overlay" })
] }) }) });
};
const ShareOverlayButton = () => {
const [isShareOverlayOpen, setIsShareOverlayOpen] = React.useState(false);
return /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(Tooltip$1, { title: "Share current overlay or import", children: /* @__PURE__ */ jsx(IconButton$1, { onClick: () => setIsShareOverlayOpen(!isShareOverlayOpen), children: /* @__PURE__ */ jsx(default_1, {}) }) }),
isShareOverlayOpen && /* @__PURE__ */ jsx(ShareOverlayModal, { isOpen: isShareOverlayOpen, setIsOpen: (isOpen) => setIsShareOverlayOpen(isOpen) })
] });
};
const useStyles$2 = makeStyles$1()({
inputWithMargin: {
margin: "0.4em"
},
fileNameWithoutExtension: {
whiteSpace: "nowrap",
textOverflow: "ellipsis",
overflow: "hidden"
}
});
function useFollowMouseConfiguration() {
const dispatch = useAppDispatch();
const placementIsFollowMouseActive = useAppSelector(selectPlacementIsFollowMouseActive);
const hoverPixel = useAppSelector(selectHoverPixel);
reactExports.useEffect(() => {
if (placementIsFollowMouseActive) {
dispatch(overlaySlice.actions.setPlacementXOffset(hoverPixel.x));
dispatch(overlaySlice.actions.setPlacementYOffset(hoverPixel.y));
}
}, [dispatch, placementIsFollowMouseActive, hoverPixel]);
reactExports.useEffect(() => {
return viewPortEvents.on("mouseUpPassive", (e) => {
if (e.button !== 0)
return;
dispatch(overlaySlice.actions.setPlacementIsFollowMouseActive(false));
});
}, [dispatch]);
}
const OverlayConfig = () => {
useFollowMouseConfiguration();
const [isInputImageModalOpen, setIsInputImageModalOpen] = React.useState(false);
const {
classes
} = useStyles$2();
const dispatch = useAppDispatch();
const isModificationsAvailable = useAppSelector(selectIsModificationsAvailable);
const inputUrl = useAppSelector(selectInputUrl);
const selectedFileName = useAppSelector(selectFileName);
const shouldShowPlacementConfiguration = useAppSelector(selectShouldShowPlacementConfiguration);
const placementXOffset = useAppSelector(selectPlacementXOffset);
const placementYOffset = useAppSelector(selectPlacementYOffset);
const placementTransparency = useAppSelector(selectPlacementTransparency);
const placementIsFollowMouseActive = useAppSelector(selectPlacementIsFollowMouseActive);
const placementAutoSelectColor = useAppSelector(selectPlacementAutoSelectColor);
const modifierShouldConvertColors = useAppSelector(selectModifierShouldConvertColors);
const isOutputImageProcessing = useAppSelector(selectIsOutputImageProcessing);
const modifierImageBrightness = useAppSelector(selectModifierImageBrightness);
const inputImageLoadingStatus = useAppSelector(selectInputImageLoadingStatus);
const modifierSmolPixels = useAppSelector(selectModifierSmolPixels);
const handleClearInput = () => {
dispatch(clearInputImageAction());
};
const handleXOffsetChange = (e) => {
const numValue = parseInt(e.target.value, 10);
if (Number.isNaN(numValue))
return;
if (numValue !== placementXOffset)
dispatch(overlaySlice.actions.setPlacementXOffset(numValue));
};
const handleYOffsetChange = (e) => {
const numValue = parseInt(e.target.value, 10);
if (Number.isNaN(numValue))
return;
if (numValue !== placementYOffset)
dispatch(overlaySlice.actions.setPlacementYOffset(numValue));
};
const handleTransparencyChange = (e, value) => {
if (typeof value !== "number") {
return;
}
dispatch(overlaySlice.actions.setPlacementTransparency(value));
};
const handleFollowMouseChange = () => {
dispatch(overlaySlice.actions.setPlacementIsFollowMouseActive(!placementIsFollowMouseActive));
};
const handleShouldConvertColorsChange = (e) => {
dispatch(overlaySlice.actions.setModifierShouldConvertColors(e.target.checked));
};
const handleAutoSelectColorChange = (e) => {
dispatch(overlaySlice.actions.setPlacementAutoSelectColor(e.target.checked));
};
const handleImageBrightnessChange = (e, value) => {
if (typeof value !== "number" || isOutputImageProcessing) {
return;
}
dispatch(overlaySlice.actions.setModifierImageBrightness(value));
};
const handleSmolPixelsChange = (e) => {
dispatch(overlaySlice.actions.setModifierSmolPixels(e.target.checked));
};
return /* @__PURE__ */ jsxs(Box$1, { component: "form", children: [
/* @__PURE__ */ jsx(InputImageModal, { isOpen: isInputImageModalOpen, onClose: () => setIsInputImageModalOpen(false) }),
selectedFileName && /* @__PURE__ */ jsxs("div", { style: {
display: "flex"
}, children: [
/* @__PURE__ */ jsxs(Typography$1, { className: classes.fileNameWithoutExtension, variant: "h6", children: [
selectedFileName.fileNameWithoutExtension,
"."
] }),
/* @__PURE__ */ jsx(Typography$1, { variant: "h6", children: selectedFileName.fileExtension })
] }),
/* @__PURE__ */ jsx(Tooltip$1, { title: "Select Overlay image", children: /* @__PURE__ */ jsx(IconButton$1, { onClick: () => setIsInputImageModalOpen(!isInputImageModalOpen), children: /* @__PURE__ */ jsx(default_1$2, {}) }) }),
/* @__PURE__ */ jsx(ShareOverlayButton, {}),
!isModificationsAvailable && inputUrl && inputImageLoadingStatus === "error" && /* @__PURE__ */ jsx(Tooltip$1, { title: "Some features will not work. Most likely that current url does not support CORS requests. Some example sites that work: https://postimages.org/, https://imgur.com/, https://dropbox.com/ (For dropbox modify the url before using, replace 'www.dropbox.' with 'dl.dropboxusercontent.' )", children: /* @__PURE__ */ jsx(default_1$1, {}) }),
shouldShowPlacementConfiguration && /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(Button$1, { onClick: handleClearInput, children: "Clear input" }),
/* @__PURE__ */ jsx(TextField$1, { className: classes.inputWithMargin, label: "X", type: "number", value: placementXOffset, onInput: handleXOffsetChange }),
/* @__PURE__ */ jsx(TextField$1, { className: classes.inputWithMargin, label: "Y", type: "number", value: placementYOffset, onInput: handleYOffsetChange }),
/* @__PURE__ */ jsx(Button$1, { variant: placementIsFollowMouseActive ? "outlined" : void 0, onClick: handleFollowMouseChange, children: "Position with mouse" }),
/* @__PURE__ */ jsx("br", {}),
/* @__PURE__ */ jsx(Typography$1, { id: "transparency-slider", gutterBottom: true, children: "Transparency" }),
/* @__PURE__ */ jsx(Slider$1, { defaultValue: 70, getAriaValueText: (v) => {
return v.toString(10);
}, "aria-labelledby": "transparency-slider", valueLabelDisplay: "auto", step: 1, min: 0, max: 100, value: placementTransparency, onChange: handleTransparencyChange }),
/* @__PURE__ */ jsx("br", {})
] }),
isModificationsAvailable && /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(Tooltip$1, { title: "Show only small colored boxes in the middle of pixels", children: /* @__PURE__ */ jsx(FormControlLabel$1, { control: /* @__PURE__ */ jsx(Checkbox$1, { color: "primary", checked: modifierSmolPixels, onChange: handleSmolPixelsChange }), label: "Smol pixels", labelPlacement: "end" }) }),
/* @__PURE__ */ jsx(FormControlLabel$1, { control: /* @__PURE__ */ jsx(Checkbox$1, { color: "primary", checked: modifierShouldConvertColors, onChange: handleShouldConvertColorsChange }), label: "Convert colors", labelPlacement: "end" }),
/* @__PURE__ */ jsx("br", {}),
/* @__PURE__ */ jsx(Tooltip$1, { title: "Will try to only place colors matching the image", children: /* @__PURE__ */ jsx(FormControlLabel$1, { control: /* @__PURE__ */ jsx(Checkbox$1, { color: "primary", checked: placementAutoSelectColor, onChange: handleAutoSelectColorChange }), label: "Auto color*", labelPlacement: "end" }) }),
/* @__PURE__ */ jsx("br", {}),
/* @__PURE__ */ jsxs("div", { style: {
display: modifierShouldConvertColors ? "" : "none"
}, children: [
/* @__PURE__ */ jsx(Typography$1, { id: "brightness-slider", gutterBottom: true, children: "Image brightness" }),
/* @__PURE__ */ jsx(Slider$1, { disabled: isOutputImageProcessing, defaultValue: 15, getAriaValueText: (v) => {
return v.toString(10);
}, "aria-labelledby": "brightness-slider", valueLabelDisplay: "auto", step: 1, min: -20, max: 20, value: modifierImageBrightness, onChange: handleImageBrightnessChange })
] }),
/* @__PURE__ */ jsx("br", {})
] })
] });
};
const makeStyles = createMakeStyles({
useTheme
});
const useStyles$1 = makeStyles.makeStyles()((theme, props) => {
const {
isMinimized
} = props;
const backgroundColor = colorStringExports.get.rgb(theme.palette.background.paper);
backgroundColor[3] = 0.9;
return {
modalRoot: {
position: "absolute",
right: "0.9em",
top: "0.1em",
width: isMinimized ? void 0 : "15em",
border: "1px solid rgb(0, 0, 0)",
backgroundColor: colorStringExports.to.rgb(backgroundColor),
padding: "5px",
fontSize: "0.9em",
overflowY: "auto",
overflowX: "hidden",
maxHeight: "calc(100vh - 1.5em)"
}
};
});
const ConfigurationModal = () => {
const [isModalMinimized, setIsModalMinimized] = React.useState(false);
const {
classes
} = useStyles$1({
isMinimized: isModalMinimized
});
const dispatch = useAppDispatch();
const isOverlayEnabled = useAppSelector(selectIsOverlayEnabled);
const onDrop = reactExports.useCallback((acceptedFiles) => {
const file = acceptedFiles[0];
if (file)
dispatch(setInputImageAction(file));
}, [dispatch]);
const {
getRootProps,
getInputProps,
isDragActive
} = useDropzone({
onDrop,
accept: {
"image/*": [".png", ".gif", ".jpeg", ".jpg"]
},
noClick: true
});
const handleToggleOverlayOnOff = (e) => {
dispatch(overlaySlice.actions.setOverlayEnabled(e.target.checked));
};
return /* @__PURE__ */ jsxs("div", { ...getRootProps(), className: classes.modalRoot, style: {
border: isDragActive ? "3px dashed red" : void 0
}, children: [
!isModalMinimized && /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx("input", { ...getInputProps(), hidden: true }),
/* @__PURE__ */ jsx(Tooltip$1, { title: "Toggle on/off Overlay. Shortcut: O", children: /* @__PURE__ */ jsx(FormControlLabel$1, { control: /* @__PURE__ */ jsx(Checkbox$1, { color: "primary", checked: isOverlayEnabled, onChange: handleToggleOverlayOnOff }), label: "Image Overlay", labelPlacement: "end" }) }),
/* @__PURE__ */ jsx("div", { style: {
display: isOverlayEnabled ? "" : "none"
}, children: /* @__PURE__ */ jsxs("div", { style: {
display: isModalMinimized ? "none" : ""
}, children: [
/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(OverlayConfig, {}) }),
/* @__PURE__ */ jsx(ConfigDropDown, {})
] }) })
] }),
/* @__PURE__ */ jsx(IconButton$1, { onClick: () => setIsModalMinimized(!isModalMinimized), children: isModalMinimized ? /* @__PURE__ */ jsx(default_1$5, {}) : /* @__PURE__ */ jsx(default_1$6, {}) })
] });
};
const useStyles = makeStyles$1()({
overlayImage: {
position: "absolute",
left: 0,
top: 0,
pointerEvents: "none",
transformOrigin: "top left",
imageRendering: "pixelated"
},
overlayImageSplitChunk: {
transform: `scale(${1 / 3})`,
transformOrigin: "top left",
position: "absolute",
pointerEvents: "none"
},
overlayImageSplitChunkWrapper: {
position: "fixed",
pointerEvents: "none",
transformOrigin: "top left",
imageRendering: "pixelated"
}
});
const splitRenderCanvasSize = 1024;
const PixelQueueSplitCanvas = (props) => {
const {
splitRenderCanvasId
} = props;
const {
classes
} = useStyles();
const canvasRef = reactExports.useRef(null);
const canvasPalette = useAppSelector(selectCanvasPalette);
const pixelsToPlaceBySplitRenderCanvasId = useAppSelector((state) => selectPixelsToPlaceBySplitRenderCanvasId(state, splitRenderCanvasId));
const {
renderCanvasXCorner,
renderCanvasYCorner
} = useAppSelector((state) => selectRenderCanvasCoords(state, splitRenderCanvasId));
const canvasSize = useAppSelector(selectCanvasSize);
reactExports.useEffect(() => {
reactExports.startTransition(() => {
const canvas = canvasRef.current;
if (!canvas)
return;
const imageDataWidth = splitRenderCanvasSize * 3;
const imageData = new ImageData(imageDataWidth, imageDataWidth);
canvas.width = imageData.width;
canvas.height = imageData.height;
pixelsToPlaceBySplitRenderCanvasId.forEach((x) => {
const currentXOffsetFromCorner = x.coord.x - renderCanvasXCorner;
const currentYOffsetFromCorner = x.coord.y - renderCanvasYCorner;
const rgb = colorConverter.getActualColorFromPalette(canvasPalette, x.color);
if (!rgb)
return;
const idx = currentXOffsetFromCorner * 3 + 1 + (currentYOffsetFromCorner * 3 + 1) * imageDataWidth << 2;
const [r, g, b] = rgb;
imageData.data[idx] = r;
imageData.data[idx + 1] = g;
imageData.data[idx + 2] = b;
imageData.data[idx + 3] = 255;
});
canvas.getContext("2d")?.putImageData(imageData, 0, 0);
});
}, [canvasPalette, pixelsToPlaceBySplitRenderCanvasId, renderCanvasXCorner, renderCanvasYCorner]);
return /* @__PURE__ */ jsx("canvas", { ref: canvasRef, className: classes.overlayImageSplitChunk, style: {
left: renderCanvasXCorner + canvasSize / 2,
top: renderCanvasYCorner + canvasSize / 2
} }, splitRenderCanvasId);
};
const PlaceQueuePixels = () => {
const {
classes
} = useStyles();
const viewScale = useAppSelector(selectGameViewScale);
const renderCanvasIds = useAppSelector(selectPixelsToPlaceRenderCanvasIds);
const canvasTopLeftOnScreen = useAppSelector(selectMainCanvasTopLeftScreenCoords);
return /* @__PURE__ */ jsx("div", { className: classes.overlayImageSplitChunkWrapper, style: {
left: canvasTopLeftOnScreen.clientX,
top: canvasTopLeftOnScreen.clientY,
transform: `scale(${viewScale})`
}, children: renderCanvasIds.map((x) => /* @__PURE__ */ jsx(PixelQueueSplitCanvas, { splitRenderCanvasId: x }, x)) });
};
const OverlayImageCanvas = () => {
const imageData = useAppSelector(selectRenderImageData);
const {
classes
} = useStyles();
const canvasRef = reactExports.useRef(null);
const {
leftOffset,
topOffset
} = useAppSelector(selectOverlayOffsetCoordsOnScreen);
const opacity = useAppSelector(selectPlacementTransparency) / 100;
const viewScale = useAppSelector(selectGameViewScale);
const modifierSmolPixels = useAppSelector(selectModifierSmolPixels);
const canvasScaleModifier = modifierSmolPixels ? 1 / 3 : 1;
reactExports.useEffect(() => {
if (!imageData)
return;
const canvas = canvasRef.current;
if (!canvas)
return;
canvas.width = imageData.width;
canvas.height = imageData.height;
const ctx = canvas.getContext("2d");
ctx?.putImageData(imageData, 0, 0);
}, [imageData]);
if (!imageData)
return /* @__PURE__ */ jsx("div", { children: "missing image data" });
return /* @__PURE__ */ jsx("canvas", { ref: canvasRef, className: classes.overlayImage, style: {
opacity,
transform: `scale(${viewScale * canvasScaleModifier})`,
left: leftOffset,
top: topOffset
} });
};
const useFileUrlFromFile = () => {
const imageFile = useAppSelector(selectInputFile);
const [fileUrl, setFileUrl] = React.useState();
reactExports.useEffect(() => {
if (!imageFile)
return void 0;
const newFileUrl = URL.createObjectURL(imageFile);
setFileUrl(newFileUrl);
return () => {
URL.revokeObjectURL(newFileUrl);
};
}, [imageFile]);
return fileUrl;
};
const useRenderImageUrl = () => {
const imageUrl = useAppSelector(selectInputUrl);
const fileUrl = useFileUrlFromFile();
return fileUrl || imageUrl;
};
const OverlayImageImg = () => {
const imageUrl = useRenderImageUrl();
const {
classes
} = useStyles();
const {
leftOffset,
topOffset
} = useAppSelector(selectOverlayOffsetCoordsOnScreen);
const opacity = useAppSelector(selectPlacementTransparency) / 100;
const viewScale = useAppSelector(selectGameViewScale);
if (!imageUrl)
return /* @__PURE__ */ jsx("div", { children: "missing image url" });
return /* @__PURE__ */ jsx("img", { alt: "", className: classes.overlayImage, src: imageUrl, style: {
opacity,
transform: `scale(${viewScale})`,
left: leftOffset,
top: topOffset
} });
};
const OverlayImage = () => {
const shouldShowImageFromData = useAppSelector(selectShouldShowImageFromData);
const shouldShowImageFromUrl = useAppSelector(selectShouldShowImageFromUrl);
if (shouldShowImageFromData)
return /* @__PURE__ */ jsx(OverlayImageCanvas, {});
if (shouldShowImageFromUrl)
return /* @__PURE__ */ jsx(OverlayImageImg, {});
return /* @__PURE__ */ jsx(PlaceQueuePixels, {});
};
function usePageStoreWaitDate() {
const dispatch = useAppDispatch();
const waitDate = usePageReduxStoreSelector(selectPageStatePixelWaitDate);
reactExports.useEffect(() => {
if (waitDate)
dispatch(gameSlice.actions.setWaitDate(waitDate));
else
dispatch(gameSlice.actions.setWaitDate(new Date()));
}, [dispatch, waitDate]);
}
function usePageStoreCurrentSelectedColor() {
const dispatch = useAppDispatch();
const currentSelectedColor = usePageReduxStoreSelector(selectPageStateCurrentSelectedColor);
reactExports.useEffect(() => {
if (currentSelectedColor)
dispatch(gameSlice.actions.setSelectedColor(currentSelectedColor));
}, [dispatch, currentSelectedColor]);
}
function usePageStoreViewScale() {
const dispatch = useAppDispatch();
const pageViewScale = usePageReduxStoreSelector(selectPageStateViewScale);
reactExports.useEffect(() => {
if (pageViewScale)
dispatch(gameSlice.actions.setViewScale(pageViewScale));
}, [dispatch, pageViewScale]);
}
function usePageStoreViewCenter() {
const dispatch = useAppDispatch();
const pageViewCenter = usePageReduxStoreSelector(selectPageStateCanvasViewCenter);
reactExports.useEffect(() => {
if (pageViewCenter)
dispatch(gameSlice.actions.setViewCenter(pageViewCenter));
}, [dispatch, pageViewCenter]);
}
function usePageStoreCanvasPalette() {
const dispatch = useAppDispatch();
const palette = usePageReduxStoreSelector(selectPageStateCanvasPalette);
reactExports.useEffect(() => {
if (palette)
dispatch(gameSlice.actions.setPalette(palette));
}, [dispatch, palette]);
}
function usePageStoreCanvasReservedColors() {
const dispatch = useAppDispatch();
const reservedColors = usePageReduxStoreSelector(selectPageStateCanvasReservedColors);
reactExports.useEffect(() => {
if (reservedColors)
dispatch(gameSlice.actions.setReservedColorCount(reservedColors ?? 0));
}, [dispatch, reservedColors]);
}
function usePageStoreCanvasId() {
const dispatch = useAppDispatch();
const canvasId = usePageReduxStoreSelector(selectPageStateCanvasId);
const canvasSize = usePageReduxStoreSelector(selectPageStateCanvasSize);
const maxTimeoutMs = usePageReduxStoreSelector(selectPageStateCanvasMaxTimeoutMs);
const timeoutOnBaseMs = usePageReduxStoreSelector(selectPageStateCanvasTimeoutOnBaseMs);
const timeoutOnPlacedMs = usePageReduxStoreSelector(selectPaseStateCanvasTimeoutOnPlacedMs);
reactExports.useEffect(() => {
if (canvasId)
dispatch(gameSlice.actions.setCanvasId(canvasId));
}, [dispatch, canvasId]);
reactExports.useEffect(() => {
if (canvasSize)
dispatch(gameSlice.actions.setCanvasSize(canvasSize));
}, [dispatch, canvasSize]);
reactExports.useEffect(() => {
if (maxTimeoutMs)
dispatch(gameSlice.actions.setMaxTimeoutMs(maxTimeoutMs));
}, [dispatch, maxTimeoutMs]);
reactExports.useEffect(() => {
if (timeoutOnBaseMs)
dispatch(gameSlice.actions.setTimeoutOnBaseMs(timeoutOnBaseMs));
}, [dispatch, timeoutOnBaseMs]);
reactExports.useEffect(() => {
if (timeoutOnPlacedMs)
dispatch(gameSlice.actions.setTimeoutOnPlacedMs(timeoutOnPlacedMs));
}, [dispatch, timeoutOnPlacedMs]);
}
function useWebSocketEvents() {
const dispatch = useAppDispatch();
reactExports.useEffect(() => webSocketEvents.on("pixelUpdate", (data) => dispatch(chunkDataSlice.actions.setPixel(data))), [dispatch]);
}
function useGlobalKeyShortcuts() {
const dispatch = useAppDispatch();
const isOverlayEnabled = useAppSelector(selectIsOverlayEnabled);
const handleToggleOverlay = reactExports.useCallback(() => {
dispatch(overlaySlice.actions.setOverlayEnabled(!isOverlayEnabled));
}, [dispatch, isOverlayEnabled]);
reactExports.useEffect(() => {
const handleKeyDown = (event) => {
const {
target
} = event;
if (!target) {
return;
}
const clickedNodeName = target.tagName || target.nodeName;
if (clickedNodeName === "TEXTAREA") {
return;
}
if (clickedNodeName === "INPUT") {
const inputEl = target;
if (inputEl.type === "text") {
return;
}
}
switch (event.key) {
case "o": {
event.stopImmediatePropagation();
handleToggleOverlay();
break;
}
}
};
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [handleToggleOverlay]);
}
function useLoadSavedConfigurations() {
const dispatch = useAppDispatch();
reactExports.useEffect(() => {
dispatch(loadSavedConfigurations());
}, [dispatch]);
}
function useReprocessOutputImage() {
const dispatch = useAppDispatch();
const url = useAppSelector(selectInputUrl);
const palette = useAppSelector(selectCanvasUserPalette);
const modifierShouldConvertColors = useAppSelector(selectModifierShouldConvertColors);
const modifierImageBrightness = useAppSelector(selectModifierImageBrightness);
const modifierSmolPixels = useAppSelector(selectModifierSmolPixels);
const inputImageData = useAppSelector(selectInputImageData);
reactExports.useEffect(() => {
dispatch(startProcessingOutputImage());
}, [dispatch, url, palette, modifierShouldConvertColors, modifierImageBrightness, modifierSmolPixels, inputImageData]);
}
function useSubscribeToWindowResize() {
const dispatch = useAppDispatch();
reactExports.useEffect(() => {
const handleResize = () => dispatch(overlaySlice.actions.setWindowSize({
innerWidth: window.innerWidth,
innerHeight: window.innerHeight
}));
handleResize();
window.addEventListener("resize", handleResize);
return () => window.removeEventListener("resize", handleResize);
}, [dispatch]);
}
function useAutoHandleTouchInputsToHoverState() {
const dispatch = useAppDispatch();
const windowSize = useAppSelector(selectWindowSize);
const viewScale = useAppSelector(selectGameViewScale);
const viewCenter = useAppSelector(selectGameViewCenter);
reactExports.useEffect(() => {
const handleTouchStart = (event) => {
const touches = event.touches[0];
if (!touches)
return;
const {
innerHeight,
innerWidth
} = windowSize;
const {
clientX,
clientY
} = touches;
const x = Math.floor((clientX - innerWidth / 2) / viewScale + viewCenter.x);
const y = Math.floor((clientY - innerHeight / 2) / viewScale + viewCenter.y);
dispatch(gameSlice.actions.setHoverPixel({
x,
y
}));
};
return viewPortEvents.on("touchStartPassive", handleTouchStart);
}, [dispatch, windowSize, viewScale, viewCenter]);
}
const ProviderPageStateMapper = ({
children
}) => {
useAutoHandleTouchInputsToHoverState();
useSubscribeToWindowResize();
useReprocessOutputImage();
useGlobalKeyShortcuts();
useLoadSavedConfigurations();
usePageStoreWaitDate();
usePageStoreCurrentSelectedColor();
usePageStoreViewScale();
usePageStoreViewCenter();
usePageStoreCanvasPalette();
usePageStoreCanvasReservedColors();
usePageStoreCanvasId();
useWebSocketEvents();
useReadingInputImageProcess();
return /* @__PURE__ */ jsx(Fragment, { children });
};
const App = () => {
const isOverlayEnabled = useAppSelector(selectIsOverlayEnabled);
const [isPageLoaded, setIsPageLoaded] = reactExports.useState(false);
const palette = usePageReduxStoreSelector(selectPageStateCanvasPalette);
reactExports.useEffect(() => {
if (!palette?.length)
return;
setIsPageLoaded(true);
}, [palette]);
if (!isPageLoaded)
return /* @__PURE__ */ jsx(Fragment, { children: "Waiting for page to load" });
return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(ProviderPageStateMapper, { children: [
isOverlayEnabled && /* @__PURE__ */ jsx(OverlayImage, {}),
/* @__PURE__ */ jsx(ConfigurationModal, {})
] }) });
};
const ErrorBoundaryFallbackModal = (props) => {
const {
error,
resetErrorBoundary
} = props;
const [isOpen, setIsOpen] = reactExports.useState(true);
return /* @__PURE__ */ jsxs(Dialog$1, { open: isOpen, onClose: () => setIsOpen(!isOpen), children: [
/* @__PURE__ */ jsx(DialogTitle$1, { children: "Overlay crashed 😢" }),
/* @__PURE__ */ jsxs(DialogContent$1, { children: [
/* @__PURE__ */ jsxs(Typography$1, { variant: "body1", children: [
error.name,
": ",
error.message
] }),
/* @__PURE__ */ jsx(Typography$1, { variant: "body2", children: error.stack ?? "" })
] }),
/* @__PURE__ */ jsxs(DialogActions$1, { children: [
/* @__PURE__ */ jsx(Button$1, { onClick: () => setIsOpen(!isOpen), children: "Close" }),
/* @__PURE__ */ jsx(Button$1, { onClick: resetErrorBoundary, children: "Reset" })
] })
] });
};
const AppProvidersWrapper = () => {
const [appStore, setAppStore] = React.useState(store);
const theme = useAppTheme();
return /* @__PURE__ */ jsx(React.StrictMode, { children: /* @__PURE__ */ jsx(Provider, { store: appStore, children: /* @__PURE__ */ jsxs(PersistGate, { loading: null, persistor, children: [
/* @__PURE__ */ jsx(GlobalStyles$2, { styles: {
body: {
margin: 0,
padding: 0
}
} }),
/* @__PURE__ */ jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsx(ScopedCssBaseline$1, { children: /* @__PURE__ */ jsx(ErrorBoundary, { FallbackComponent: ErrorBoundaryFallbackModal, onReset: () => setAppStore(configureAppStore()), children: /* @__PURE__ */ jsx(App, {}) }) }) })
] }) }) });
};
function init() {
executeAllHooks();
const rootNode = document.createElement("div");
rootNode.id = "PictureOverlay_RootNode";
document.body.prepend(rootNode);
const root = createRoot(rootNode);
root.render(/* @__PURE__ */ jsx(AppProvidersWrapper, {}));
}
if (document.readyState !== "complete") {
document.addEventListener("readystatechange", function readyStateChange() {
if (document.readyState === "complete") {
document.removeEventListener("readystatechange", readyStateChange);
init();
}
});
} else {
init();
}
