@redsift/table 8.0.0-alpha.2 → 8.0.0-alpha.3

package/index.js

@@ -3,7 +3,7 @@ export { getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOpera
 import * as React from 'react';
 import React__default, { forwardRef, useRef, useState, useEffect } from 'react';
 import { Icon, Flexbox, Button, Checkbox, Shield } from '@redsift/design-system';
-import { mdiSync, mdiChevronUp, mdiChevronDown, mdiChevronRight, mdiFilterVariant } from '@redsift/icons';
+import { mdiSync, mdiFilterVariant, mdiViewColumn, mdiChevronUp, mdiChevronDown, mdiViewHeadline, mdiViewSequential, mdiViewStream, mdiChevronRight, mdiTrayArrowDown } from '@redsift/icons';
 import emStyled from '@emotion/styled';
 import { Global, ThemeContext } from '@emotion/react';
 import * as ReactDOM from 'react-dom';
@@ -50,8 +50,8 @@ function _defineProperty(obj, key, value) {
   }
   return obj;
 }
-function _extends$3() {
-  _extends$3 = Object.assign ? Object.assign.bind() : function (target) {
+function _extends$2() {
+  _extends$2 = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -62,9 +62,9 @@ function _extends$3() {
     }
     return target;
   };
-  return _extends$3.apply(this, arguments);
+  return _extends$2.apply(this, arguments);
 }
-function _objectWithoutPropertiesLoose$4(source, excluded) {
+function _objectWithoutPropertiesLoose$2(source, excluded) {
   if (source == null) return {};
   var target = {};
   var sourceKeys = Object.keys(source);
@@ -78,7 +78,7 @@ function _objectWithoutPropertiesLoose$4(source, excluded) {
 }
 function _objectWithoutProperties(source, excluded) {
   if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose$4(source, excluded);
+  var target = _objectWithoutPropertiesLoose$2(source, excluded);
   var key, i;
   if (Object.getOwnPropertySymbols) {
     var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
@@ -159,13 +159,13 @@ var propTypes = {
   set exports(v){ propTypesExports = v; },
 };
 
-var reactIsExports$1 = {};
-var reactIs$1 = {
-  get exports(){ return reactIsExports$1; },
-  set exports(v){ reactIsExports$1 = v; },
+var reactIsExports$2 = {};
+var reactIs$2 = {
+  get exports(){ return reactIsExports$2; },
+  set exports(v){ reactIsExports$2 = v; },
 };
 
-var reactIs_production_min$1 = {};
+var reactIs_production_min$2 = {};
 
 /** @license React v16.13.1
  * react-is.production.min.js
@@ -175,14 +175,14 @@ var reactIs_production_min$1 = {};
  * 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$2=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$2=b$1?Symbol.for("react.context"):60110,l$2=b$1?Symbol.for("react.async_mode"):60111,m$2=b$1?Symbol.for("react.concurrent_mode"):60111,n$2=b$1?Symbol.for("react.forward_ref"):60112,p$2=b$1?Symbol.for("react.suspense"):60113,q$2=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$2:case m$2:case e$1:case g$1:case f$2:case p$2:return a;default:switch(a=a&&a.$$typeof,a){case k$2:case n$2: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$2;reactIs_production_min$1.ConcurrentMode=m$2;reactIs_production_min$1.ContextConsumer=k$2;reactIs_production_min$1.ContextProvider=h$1;reactIs_production_min$1.Element=c$1;reactIs_production_min$1.ForwardRef=n$2;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$2;reactIs_production_min$1.Suspense=p$2;reactIs_production_min$1.isAsyncMode=function(a){return A(a)||z(a)===l$2};reactIs_production_min$1.isConcurrentMode=A;reactIs_production_min$1.isContextConsumer=function(a){return z(a)===k$2};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$2};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$2};reactIs_production_min$1.isSuspense=function(a){return z(a)===p$2};
-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$2||a===p$2||a===q$2||"object"===typeof a&&null!==a&&(a.$$typeof===t$1||a.$$typeof===r$1||a.$$typeof===h$1||a.$$typeof===k$2||a.$$typeof===n$2||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v$1)};reactIs_production_min$1.typeOf=z;
+var b$2="function"===typeof Symbol&&Symbol.for,c$2=b$2?Symbol.for("react.element"):60103,d$2=b$2?Symbol.for("react.portal"):60106,e$2=b$2?Symbol.for("react.fragment"):60107,f$3=b$2?Symbol.for("react.strict_mode"):60108,g$2=b$2?Symbol.for("react.profiler"):60114,h$2=b$2?Symbol.for("react.provider"):60109,k$3=b$2?Symbol.for("react.context"):60110,l$3=b$2?Symbol.for("react.async_mode"):60111,m$3=b$2?Symbol.for("react.concurrent_mode"):60111,n$3=b$2?Symbol.for("react.forward_ref"):60112,p$3=b$2?Symbol.for("react.suspense"):60113,q$3=b$2?
+Symbol.for("react.suspense_list"):60120,r$2=b$2?Symbol.for("react.memo"):60115,t$1=b$2?Symbol.for("react.lazy"):60116,v$2=b$2?Symbol.for("react.block"):60121,w$1=b$2?Symbol.for("react.fundamental"):60117,x$1=b$2?Symbol.for("react.responder"):60118,y$1=b$2?Symbol.for("react.scope"):60119;
+function z$1(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c$2:switch(a=a.type,a){case l$3:case m$3:case e$2:case g$2:case f$3:case p$3:return a;default:switch(a=a&&a.$$typeof,a){case k$3:case n$3:case t$1:case r$2:case h$2:return a;default:return u}}case d$2:return u}}}function A$1(a){return z$1(a)===m$3}reactIs_production_min$2.AsyncMode=l$3;reactIs_production_min$2.ConcurrentMode=m$3;reactIs_production_min$2.ContextConsumer=k$3;reactIs_production_min$2.ContextProvider=h$2;reactIs_production_min$2.Element=c$2;reactIs_production_min$2.ForwardRef=n$3;reactIs_production_min$2.Fragment=e$2;reactIs_production_min$2.Lazy=t$1;reactIs_production_min$2.Memo=r$2;reactIs_production_min$2.Portal=d$2;
+reactIs_production_min$2.Profiler=g$2;reactIs_production_min$2.StrictMode=f$3;reactIs_production_min$2.Suspense=p$3;reactIs_production_min$2.isAsyncMode=function(a){return A$1(a)||z$1(a)===l$3};reactIs_production_min$2.isConcurrentMode=A$1;reactIs_production_min$2.isContextConsumer=function(a){return z$1(a)===k$3};reactIs_production_min$2.isContextProvider=function(a){return z$1(a)===h$2};reactIs_production_min$2.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c$2};reactIs_production_min$2.isForwardRef=function(a){return z$1(a)===n$3};reactIs_production_min$2.isFragment=function(a){return z$1(a)===e$2};reactIs_production_min$2.isLazy=function(a){return z$1(a)===t$1};
+reactIs_production_min$2.isMemo=function(a){return z$1(a)===r$2};reactIs_production_min$2.isPortal=function(a){return z$1(a)===d$2};reactIs_production_min$2.isProfiler=function(a){return z$1(a)===g$2};reactIs_production_min$2.isStrictMode=function(a){return z$1(a)===f$3};reactIs_production_min$2.isSuspense=function(a){return z$1(a)===p$3};
+reactIs_production_min$2.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e$2||a===m$3||a===g$2||a===f$3||a===p$3||a===q$3||"object"===typeof a&&null!==a&&(a.$$typeof===t$1||a.$$typeof===r$2||a.$$typeof===h$2||a.$$typeof===k$3||a.$$typeof===n$3||a.$$typeof===w$1||a.$$typeof===x$1||a.$$typeof===y$1||a.$$typeof===v$2)};reactIs_production_min$2.typeOf=z$1;
 
-var reactIs_development$1 = {};
+var reactIs_development$2 = {};
 
 /** @license React v16.13.1
  * react-is.development.js
@@ -332,45 +332,45 @@ function isSuspense(object) {
   return typeOf(object) === REACT_SUSPENSE_TYPE;
 }
 
-reactIs_development$1.AsyncMode = AsyncMode;
-reactIs_development$1.ConcurrentMode = ConcurrentMode;
-reactIs_development$1.ContextConsumer = ContextConsumer;
-reactIs_development$1.ContextProvider = ContextProvider;
-reactIs_development$1.Element = Element;
-reactIs_development$1.ForwardRef = ForwardRef;
-reactIs_development$1.Fragment = Fragment;
-reactIs_development$1.Lazy = Lazy;
-reactIs_development$1.Memo = Memo;
-reactIs_development$1.Portal = Portal;
-reactIs_development$1.Profiler = Profiler;
-reactIs_development$1.StrictMode = StrictMode;
-reactIs_development$1.Suspense = Suspense;
-reactIs_development$1.isAsyncMode = isAsyncMode;
-reactIs_development$1.isConcurrentMode = isConcurrentMode;
-reactIs_development$1.isContextConsumer = isContextConsumer;
-reactIs_development$1.isContextProvider = isContextProvider;
-reactIs_development$1.isElement = isElement;
-reactIs_development$1.isForwardRef = isForwardRef;
-reactIs_development$1.isFragment = isFragment;
-reactIs_development$1.isLazy = isLazy;
-reactIs_development$1.isMemo = isMemo;
-reactIs_development$1.isPortal = isPortal;
-reactIs_development$1.isProfiler = isProfiler;
-reactIs_development$1.isStrictMode = isStrictMode;
-reactIs_development$1.isSuspense = isSuspense;
-reactIs_development$1.isValidElementType = isValidElementType;
-reactIs_development$1.typeOf = typeOf;
+reactIs_development$2.AsyncMode = AsyncMode;
+reactIs_development$2.ConcurrentMode = ConcurrentMode;
+reactIs_development$2.ContextConsumer = ContextConsumer;
+reactIs_development$2.ContextProvider = ContextProvider;
+reactIs_development$2.Element = Element;
+reactIs_development$2.ForwardRef = ForwardRef;
+reactIs_development$2.Fragment = Fragment;
+reactIs_development$2.Lazy = Lazy;
+reactIs_development$2.Memo = Memo;
+reactIs_development$2.Portal = Portal;
+reactIs_development$2.Profiler = Profiler;
+reactIs_development$2.StrictMode = StrictMode;
+reactIs_development$2.Suspense = Suspense;
+reactIs_development$2.isAsyncMode = isAsyncMode;
+reactIs_development$2.isConcurrentMode = isConcurrentMode;
+reactIs_development$2.isContextConsumer = isContextConsumer;
+reactIs_development$2.isContextProvider = isContextProvider;
+reactIs_development$2.isElement = isElement;
+reactIs_development$2.isForwardRef = isForwardRef;
+reactIs_development$2.isFragment = isFragment;
+reactIs_development$2.isLazy = isLazy;
+reactIs_development$2.isMemo = isMemo;
+reactIs_development$2.isPortal = isPortal;
+reactIs_development$2.isProfiler = isProfiler;
+reactIs_development$2.isStrictMode = isStrictMode;
+reactIs_development$2.isSuspense = isSuspense;
+reactIs_development$2.isValidElementType = isValidElementType;
+reactIs_development$2.typeOf = typeOf;
   })();
 }
 
 (function (module) {
 
 	if (process.env.NODE_ENV === 'production') {
-	  module.exports = reactIs_production_min$1;
+	  module.exports = reactIs_production_min$2;
 	} else {
-	  module.exports = reactIs_development$1;
+	  module.exports = reactIs_development$2;
 	}
-} (reactIs$1));
+} (reactIs$2));
 
 /*
 object-assign
@@ -583,7 +583,7 @@ var checkPropTypes_1 = checkPropTypes$1;
  * LICENSE file in the root directory of this source tree.
  */
 
-var ReactIs$1 = reactIsExports$1;
+var ReactIs$1 = reactIsExports$2;
 var assign = objectAssign;
 
 var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
@@ -1255,7 +1255,7 @@ var factoryWithThrowingShims = function() {
  */
 
 if (process.env.NODE_ENV !== 'production') {
-  var ReactIs = reactIsExports$1;
+  var ReactIs = reactIsExports$2;
 
   // By explicitly using `prop-types` you are opting into new development behavior.
   // http://fb.me/prop-types-in-prod
@@ -1387,13 +1387,13 @@ function formatMuiErrorMessage(code) {
   /* eslint-enable prefer-template */
 }
 
-var reactIsExports = {};
-var reactIs = {
-  get exports(){ return reactIsExports; },
-  set exports(v){ reactIsExports = v; },
+var reactIsExports$1 = {};
+var reactIs$1 = {
+  get exports(){ return reactIsExports$1; },
+  set exports(v){ reactIsExports$1 = v; },
 };
 
-var reactIs_production_min = {};
+var reactIs_production_min$1 = {};
 
 /**
  * @license React
@@ -1404,13 +1404,13 @@ var reactIs_production_min = {};
  * 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$1=Symbol.for("react.profiler"),g=Symbol.for("react.provider"),h=Symbol.for("react.context"),k$1=Symbol.for("react.server_context"),l$1=Symbol.for("react.forward_ref"),m$1=Symbol.for("react.suspense"),n$1=Symbol.for("react.suspense_list"),p$1=Symbol.for("react.memo"),q$1=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$1:case e:case m$1:case n$1:return a;default:switch(a=a&&a.$$typeof,a){case k$1:case h:case l$1:case q$1:case p$1: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$1;reactIs_production_min.Fragment=d;reactIs_production_min.Lazy=q$1;reactIs_production_min.Memo=p$1;reactIs_production_min.Portal=c;reactIs_production_min.Profiler=f$1;reactIs_production_min.StrictMode=e;reactIs_production_min.Suspense=m$1;
-reactIs_production_min.SuspenseList=n$1;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$1};reactIs_production_min.isFragment=function(a){return v(a)===d};reactIs_production_min.isLazy=function(a){return v(a)===q$1};reactIs_production_min.isMemo=function(a){return v(a)===p$1};
-reactIs_production_min.isPortal=function(a){return v(a)===c};reactIs_production_min.isProfiler=function(a){return v(a)===f$1};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$1};
-reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===d||a===f$1||a===e||a===m$1||a===n$1||a===t||"object"===typeof a&&null!==a&&(a.$$typeof===q$1||a.$$typeof===p$1||a.$$typeof===g||a.$$typeof===h||a.$$typeof===l$1||a.$$typeof===u||void 0!==a.getModuleId)?!0:!1};reactIs_production_min.typeOf=v;
+var b$1=Symbol.for("react.element"),c$1=Symbol.for("react.portal"),d$1=Symbol.for("react.fragment"),e$1=Symbol.for("react.strict_mode"),f$2=Symbol.for("react.profiler"),g$1=Symbol.for("react.provider"),h$1=Symbol.for("react.context"),k$2=Symbol.for("react.server_context"),l$2=Symbol.for("react.forward_ref"),m$2=Symbol.for("react.suspense"),n$2=Symbol.for("react.suspense_list"),p$2=Symbol.for("react.memo"),q$2=Symbol.for("react.lazy"),t=Symbol.for("react.offscreen"),u$1;u$1=Symbol.for("react.module.reference");
+function v$1(a){if("object"===typeof a&&null!==a){var r=a.$$typeof;switch(r){case b$1:switch(a=a.type,a){case d$1:case f$2:case e$1:case m$2:case n$2:return a;default:switch(a=a&&a.$$typeof,a){case k$2:case h$1:case l$2:case q$2:case p$2:case g$1:return a;default:return r}}case c$1:return r}}}reactIs_production_min$1.ContextConsumer=h$1;reactIs_production_min$1.ContextProvider=g$1;reactIs_production_min$1.Element=b$1;reactIs_production_min$1.ForwardRef=l$2;reactIs_production_min$1.Fragment=d$1;reactIs_production_min$1.Lazy=q$2;reactIs_production_min$1.Memo=p$2;reactIs_production_min$1.Portal=c$1;reactIs_production_min$1.Profiler=f$2;reactIs_production_min$1.StrictMode=e$1;reactIs_production_min$1.Suspense=m$2;
+reactIs_production_min$1.SuspenseList=n$2;reactIs_production_min$1.isAsyncMode=function(){return !1};reactIs_production_min$1.isConcurrentMode=function(){return !1};reactIs_production_min$1.isContextConsumer=function(a){return v$1(a)===h$1};reactIs_production_min$1.isContextProvider=function(a){return v$1(a)===g$1};reactIs_production_min$1.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===b$1};reactIs_production_min$1.isForwardRef=function(a){return v$1(a)===l$2};reactIs_production_min$1.isFragment=function(a){return v$1(a)===d$1};reactIs_production_min$1.isLazy=function(a){return v$1(a)===q$2};reactIs_production_min$1.isMemo=function(a){return v$1(a)===p$2};
+reactIs_production_min$1.isPortal=function(a){return v$1(a)===c$1};reactIs_production_min$1.isProfiler=function(a){return v$1(a)===f$2};reactIs_production_min$1.isStrictMode=function(a){return v$1(a)===e$1};reactIs_production_min$1.isSuspense=function(a){return v$1(a)===m$2};reactIs_production_min$1.isSuspenseList=function(a){return v$1(a)===n$2};
+reactIs_production_min$1.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===d$1||a===f$2||a===e$1||a===m$2||a===n$2||a===t||"object"===typeof a&&null!==a&&(a.$$typeof===q$2||a.$$typeof===p$2||a.$$typeof===g$1||a.$$typeof===h$1||a.$$typeof===l$2||a.$$typeof===u$1||void 0!==a.getModuleId)?!0:!1};reactIs_production_min$1.typeOf=v$1;
 
-var reactIs_development = {};
+var reactIs_development$1 = {};
 
 /**
  * @license React
@@ -1600,45 +1600,45 @@ function isSuspenseList(object) {
   return typeOf(object) === REACT_SUSPENSE_LIST_TYPE;
 }
 
-reactIs_development.ContextConsumer = ContextConsumer;
-reactIs_development.ContextProvider = ContextProvider;
-reactIs_development.Element = Element;
-reactIs_development.ForwardRef = ForwardRef;
-reactIs_development.Fragment = Fragment;
-reactIs_development.Lazy = Lazy;
-reactIs_development.Memo = Memo;
-reactIs_development.Portal = Portal;
-reactIs_development.Profiler = Profiler;
-reactIs_development.StrictMode = StrictMode;
-reactIs_development.Suspense = Suspense;
-reactIs_development.SuspenseList = SuspenseList;
-reactIs_development.isAsyncMode = isAsyncMode;
-reactIs_development.isConcurrentMode = isConcurrentMode;
-reactIs_development.isContextConsumer = isContextConsumer;
-reactIs_development.isContextProvider = isContextProvider;
-reactIs_development.isElement = isElement;
-reactIs_development.isForwardRef = isForwardRef;
-reactIs_development.isFragment = isFragment;
-reactIs_development.isLazy = isLazy;
-reactIs_development.isMemo = isMemo;
-reactIs_development.isPortal = isPortal;
-reactIs_development.isProfiler = isProfiler;
-reactIs_development.isStrictMode = isStrictMode;
-reactIs_development.isSuspense = isSuspense;
-reactIs_development.isSuspenseList = isSuspenseList;
-reactIs_development.isValidElementType = isValidElementType;
-reactIs_development.typeOf = typeOf;
+reactIs_development$1.ContextConsumer = ContextConsumer;
+reactIs_development$1.ContextProvider = ContextProvider;
+reactIs_development$1.Element = Element;
+reactIs_development$1.ForwardRef = ForwardRef;
+reactIs_development$1.Fragment = Fragment;
+reactIs_development$1.Lazy = Lazy;
+reactIs_development$1.Memo = Memo;
+reactIs_development$1.Portal = Portal;
+reactIs_development$1.Profiler = Profiler;
+reactIs_development$1.StrictMode = StrictMode;
+reactIs_development$1.Suspense = Suspense;
+reactIs_development$1.SuspenseList = SuspenseList;
+reactIs_development$1.isAsyncMode = isAsyncMode;
+reactIs_development$1.isConcurrentMode = isConcurrentMode;
+reactIs_development$1.isContextConsumer = isContextConsumer;
+reactIs_development$1.isContextProvider = isContextProvider;
+reactIs_development$1.isElement = isElement;
+reactIs_development$1.isForwardRef = isForwardRef;
+reactIs_development$1.isFragment = isFragment;
+reactIs_development$1.isLazy = isLazy;
+reactIs_development$1.isMemo = isMemo;
+reactIs_development$1.isPortal = isPortal;
+reactIs_development$1.isProfiler = isProfiler;
+reactIs_development$1.isStrictMode = isStrictMode;
+reactIs_development$1.isSuspense = isSuspense;
+reactIs_development$1.isSuspenseList = isSuspenseList;
+reactIs_development$1.isValidElementType = isValidElementType;
+reactIs_development$1.typeOf = typeOf;
   })();
 }
 
 (function (module) {
 
 	if (process.env.NODE_ENV === 'production') {
-	  module.exports = reactIs_production_min;
+	  module.exports = reactIs_production_min$1;
 	} else {
-	  module.exports = reactIs_development;
+	  module.exports = reactIs_development$1;
 	}
-} (reactIs));
+} (reactIs$1));
 
 // Simplified polyfill for IE11 support
 // https://github.com/JamesMGreene/Function.name/blob/58b314d4a983110c3682f1228f845d39ccca1817/Function.name.js#L3
@@ -1675,9 +1675,9 @@ function getDisplayName(Component) {
   // TypeScript can't have components as objects but they exist in the form of `memo` or `Suspense`
   if (typeof Component === 'object') {
     switch (Component.$$typeof) {
-      case reactIsExports.ForwardRef:
+      case reactIsExports$1.ForwardRef:
         return getWrappedName(Component, Component.render, 'ForwardRef');
-      case reactIsExports.Memo:
+      case reactIsExports$1.Memo:
         return getWrappedName(Component, Component.type, 'memo');
       default:
         return undefined;
@@ -2074,8 +2074,8 @@ var reactJsxRuntime_production_min = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var f=React__default,k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};
-function q(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.call(a,b)&&!p.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,type:c,key:e,ref:h,props:d,_owner:n.current}}reactJsxRuntime_production_min.Fragment=l;reactJsxRuntime_production_min.jsx=q;reactJsxRuntime_production_min.jsxs=q;
+var f$1=React__default,k$1=Symbol.for("react.element"),l$1=Symbol.for("react.fragment"),m$1=Object.prototype.hasOwnProperty,n$1=f$1.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p$1={key:!0,ref:!0,__self:!0,__source:!0};
+function q$1(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$1.call(a,b)&&!p$1.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$1,type:c,key:e,ref:h,props:d,_owner:n$1.current}}reactJsxRuntime_production_min.Fragment=l$1;reactJsxRuntime_production_min.jsx=q$1;reactJsxRuntime_production_min.jsxs=q$1;
 
 var reactJsxRuntime_development = {};
 
@@ -3448,8 +3448,8 @@ const internal_processStyles = (tag, processor) => {
   }
 };
 
-function _extends$2() {
-  _extends$2 = Object.assign ? Object.assign.bind() : function (target) {
+function _extends$1() {
+  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key in source) {
@@ -3460,10 +3460,10 @@ function _extends$2() {
     }
     return target;
   };
-  return _extends$2.apply(this, arguments);
+  return _extends$1.apply(this, arguments);
 }
 
-function _objectWithoutPropertiesLoose$3(source, excluded) {
+function _objectWithoutPropertiesLoose$1(source, excluded) {
   if (source == null) return {};
   var target = {};
   var sourceKeys = Object.keys(source);
@@ -3476,7 +3476,7 @@ function _objectWithoutPropertiesLoose$3(source, excluded) {
   return target;
 }
 
-const _excluded$B = ["values", "unit", "step"];
+const _excluded$E = ["values", "unit", "step"];
 const sortBreakpointsValues = values => {
   const breakpointsAsArray = Object.keys(values).map(key => ({
     key,
@@ -3485,7 +3485,7 @@ const sortBreakpointsValues = values => {
   // Sort in ascending order
   breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);
   return breakpointsAsArray.reduce((acc, obj) => {
-    return _extends$2({}, acc, {
+    return _extends$1({}, acc, {
       [obj.key]: obj.val
     });
   }, {});
@@ -3511,7 +3511,7 @@ function createBreakpoints(breakpoints) {
       unit = 'px',
       step = 5
     } = breakpoints,
-    other = _objectWithoutPropertiesLoose$3(breakpoints, _excluded$B);
+    other = _objectWithoutPropertiesLoose$1(breakpoints, _excluded$E);
   const sortedValues = sortBreakpointsValues(values);
   const keys = Object.keys(sortedValues);
   function up(key) {
@@ -3543,7 +3543,7 @@ function createBreakpoints(breakpoints) {
     }
     return between(key, keys[keys.indexOf(key) + 1]).replace('@media', '@media not all and');
   }
-  return _extends$2({
+  return _extends$1({
     keys,
     values: sortedValues,
     up,
@@ -4540,7 +4540,7 @@ const styleFunctionSx = unstable_createStyleFunctionSx();
 styleFunctionSx.filterProps = ['sx'];
 var styleFunctionSx$1 = styleFunctionSx;
 
-const _excluded$A = ["breakpoints", "palette", "spacing", "shape"];
+const _excluded$D = ["breakpoints", "palette", "spacing", "shape"];
 function createTheme$1(options = {}, ...args) {
   const {
       breakpoints: breakpointsInput = {},
@@ -4548,7 +4548,7 @@ function createTheme$1(options = {}, ...args) {
       spacing: spacingInput,
       shape: shapeInput = {}
     } = options,
-    other = _objectWithoutPropertiesLoose$3(options, _excluded$A);
+    other = _objectWithoutPropertiesLoose$1(options, _excluded$D);
   const breakpoints = createBreakpoints(breakpointsInput);
   const spacing = createSpacing(spacingInput);
   let muiTheme = deepmerge({
@@ -4556,14 +4556,14 @@ function createTheme$1(options = {}, ...args) {
     direction: 'ltr',
     components: {},
     // Inject component definitions.
-    palette: _extends$2({
+    palette: _extends$1({
       mode: 'light'
     }, paletteInput),
     spacing,
-    shape: _extends$2({}, shape$1, shapeInput)
+    shape: _extends$1({}, shape$1, shapeInput)
   }, other);
   muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
-  muiTheme.unstable_sxConfig = _extends$2({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
+  muiTheme.unstable_sxConfig = _extends$1({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
   muiTheme.unstable_sx = function sx(props) {
     return styleFunctionSx$1({
       sx: props,
@@ -4616,7 +4616,7 @@ process.env.NODE_ENV !== "production" ? GlobalStyles$1.propTypes /* remove-propt
   themeId: propTypesExports.string
 } : void 0;
 
-const _excluded$z = ["sx"];
+const _excluded$C = ["sx"];
 const splitProps = props => {
   var _props$theme$unstable, _props$theme;
   const result = {
@@ -4637,7 +4637,7 @@ function extendSxProp(props) {
   const {
       sx: inSx
     } = props,
-    other = _objectWithoutPropertiesLoose$3(props, _excluded$z);
+    other = _objectWithoutPropertiesLoose$1(props, _excluded$C);
   const {
     systemProps,
     otherProps
@@ -4651,19 +4651,19 @@ function extendSxProp(props) {
       if (!isPlainObject(result)) {
         return systemProps;
       }
-      return _extends$2({}, systemProps, result);
+      return _extends$1({}, systemProps, result);
     };
   } else {
-    finalSx = _extends$2({}, systemProps, inSx);
+    finalSx = _extends$1({}, systemProps, inSx);
   }
-  return _extends$2({}, otherProps, {
+  return _extends$1({}, 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}
+function r$1(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$1(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$1(e))&&(n&&(n+=" "),n+=t);return n}
 
-const _excluded$y = ["className", "component"];
+const _excluded$B = ["className", "component"];
 function createBox(options = {}) {
   const {
     themeId,
@@ -4681,8 +4681,8 @@ function createBox(options = {}) {
         className,
         component = 'div'
       } = _extendSxProp,
-      other = _objectWithoutPropertiesLoose$3(_extendSxProp, _excluded$y);
-    return /*#__PURE__*/jsxRuntimeExports.jsx(BoxRoot, _extends$2({
+      other = _objectWithoutPropertiesLoose$1(_extendSxProp, _excluded$B);
+    return /*#__PURE__*/jsxRuntimeExports.jsx(BoxRoot, _extends$1({
       as: component,
       ref: ref,
       className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
@@ -4692,7 +4692,7 @@ function createBox(options = {}) {
   return Box;
 }
 
-const _excluded$x = ["variant"];
+const _excluded$A = ["variant"];
 function isEmpty$3(string) {
   return string.length === 0;
 }
@@ -4706,7 +4706,7 @@ function propsToClassKey(props) {
   const {
       variant
     } = props,
-    other = _objectWithoutPropertiesLoose$3(props, _excluded$x);
+    other = _objectWithoutPropertiesLoose$1(props, _excluded$A);
   let classKey = variant || '';
   Object.keys(other).sort().forEach(key => {
     if (key === 'color') {
@@ -4718,7 +4718,7 @@ function propsToClassKey(props) {
   return classKey;
 }
 
-const _excluded$w = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
+const _excluded$z = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
 function isEmpty$2(obj) {
   return Object.keys(obj).length === 0;
 }
@@ -4795,8 +4795,8 @@ function createStyled(input = {}) {
     slotShouldForwardProp = shouldForwardProp
   } = input;
   const systemSx = props => {
-    return styleFunctionSx$1(_extends$2({}, props, {
-      theme: resolveTheme(_extends$2({}, props, {
+    return styleFunctionSx$1(_extends$1({}, props, {
+      theme: resolveTheme(_extends$1({}, props, {
         defaultTheme,
         themeId
       }))
@@ -4813,7 +4813,7 @@ function createStyled(input = {}) {
         skipSx: inputSkipSx,
         overridesResolver
       } = inputOptions,
-      options = _objectWithoutPropertiesLoose$3(inputOptions, _excluded$w);
+      options = _objectWithoutPropertiesLoose$1(inputOptions, _excluded$z);
 
     // 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;
@@ -4834,7 +4834,7 @@ function createStyled(input = {}) {
       // for string (html) tag, preserve the behavior in emotion & styled-components.
       shouldForwardPropOption = undefined;
     }
-    const defaultStyledResolver = styled$2(tag, _extends$2({
+    const defaultStyledResolver = styled$2(tag, _extends$1({
       shouldForwardProp: shouldForwardPropOption,
       label
     }, options));
@@ -4844,8 +4844,8 @@ function createStyled(input = {}) {
         // 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 ? props => {
-          return stylesArg(_extends$2({}, props, {
-            theme: resolveTheme(_extends$2({}, props, {
+          return stylesArg(_extends$1({}, props, {
+            theme: resolveTheme(_extends$1({}, props, {
               defaultTheme,
               themeId
             }))
@@ -4855,7 +4855,7 @@ function createStyled(input = {}) {
       let transformedStyleArg = styleArg;
       if (componentName && overridesResolver) {
         expressionsWithDefaultTheme.push(props => {
-          const theme = resolveTheme(_extends$2({}, props, {
+          const theme = resolveTheme(_extends$1({}, props, {
             defaultTheme,
             themeId
           }));
@@ -4863,7 +4863,7 @@ function createStyled(input = {}) {
           if (styleOverrides) {
             const resolvedStyleOverrides = {};
             Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {
-              resolvedStyleOverrides[slotKey] = typeof slotStyle === 'function' ? slotStyle(_extends$2({}, props, {
+              resolvedStyleOverrides[slotKey] = typeof slotStyle === 'function' ? slotStyle(_extends$1({}, props, {
                 theme
               })) : slotStyle;
             });
@@ -4874,7 +4874,7 @@ function createStyled(input = {}) {
       }
       if (componentName && !skipVariantsResolver) {
         expressionsWithDefaultTheme.push(props => {
-          const theme = resolveTheme(_extends$2({}, props, {
+          const theme = resolveTheme(_extends$1({}, props, {
             defaultTheme,
             themeId
           }));
@@ -4896,8 +4896,8 @@ function createStyled(input = {}) {
       // 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 = props => styleArg(_extends$2({}, props, {
-          theme: resolveTheme(_extends$2({}, props, {
+        transformedStyleArg = props => styleArg(_extends$1({}, props, {
+          theme: resolveTheme(_extends$1({}, props, {
             defaultTheme,
             themeId
           }))
@@ -5192,8 +5192,8 @@ function lighten(color, coefficient) {
 
 var THEME_ID = '$$material';
 
-function _extends$1() {
-  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
+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) {
@@ -5204,10 +5204,10 @@ function _extends$1() {
     }
     return target;
   };
-  return _extends$1.apply(this, arguments);
+  return _extends.apply(this, arguments);
 }
 
-function _objectWithoutPropertiesLoose$2(source, excluded) {
+function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
   var sourceKeys = Object.keys(source);
@@ -5221,7 +5221,7 @@ function _objectWithoutPropertiesLoose$2(source, excluded) {
 }
 
 function createMixins(breakpoints, mixins) {
-  return _extends$1({
+  return _extends({
     toolbar: {
       minHeight: 56,
       [breakpoints.up('xs')]: {
@@ -5368,7 +5368,7 @@ const green = {
 };
 var green$1 = green;
 
-const _excluded$v = ["mode", "contrastThreshold", "tonalOffset"];
+const _excluded$y = ["mode", "contrastThreshold", "tonalOffset"];
 const light = {
   // The colors used to style the text.
   text: {
@@ -5537,7 +5537,7 @@ function createPalette(palette) {
       contrastThreshold = 3,
       tonalOffset = 0.2
     } = palette,
-    other = _objectWithoutPropertiesLoose$2(palette, _excluded$v);
+    other = _objectWithoutPropertiesLoose(palette, _excluded$y);
   const primary = palette.primary || getDefaultPrimary(mode);
   const secondary = palette.secondary || getDefaultSecondary(mode);
   const error = palette.error || getDefaultError(mode);
@@ -5565,7 +5565,7 @@ function createPalette(palette) {
     lightShade = 300,
     darkShade = 700
   }) => {
-    color = _extends$1({}, color);
+    color = _extends({}, color);
     if (!color.main && color[mainShade]) {
       color.main = color[mainShade];
     }
@@ -5605,9 +5605,9 @@ const theme2 = createTheme({ palette: {
       console.error(`MUI: The palette mode \`${mode}\` is not supported.`);
     }
   }
-  const paletteOutput = deepmerge(_extends$1({
+  const paletteOutput = deepmerge(_extends({
     // A collection of common colors.
-    common: _extends$1({}, common$1),
+    common: _extends({}, common$1),
     // prevent mutable object.
     // The palette mode, can be light or dark.
     mode,
@@ -5661,7 +5661,7 @@ const theme2 = createTheme({ palette: {
   return paletteOutput;
 }
 
-const _excluded$u = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
+const _excluded$x = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
 function round(value) {
   return Math.round(value * 1e5) / 1e5;
 }
@@ -5692,7 +5692,7 @@ function createTypography(palette, typography) {
       allVariants,
       pxToRem: pxToRem2
     } = _ref,
-    other = _objectWithoutPropertiesLoose$2(_ref, _excluded$u);
+    other = _objectWithoutPropertiesLoose(_ref, _excluded$x);
   if (process.env.NODE_ENV !== 'production') {
     if (typeof fontSize !== 'number') {
       console.error('MUI: `fontSize` is required to be a number.');
@@ -5703,7 +5703,7 @@ function createTypography(palette, typography) {
   }
   const coef = fontSize / 14;
   const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);
-  const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends$1({
+  const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({
     fontFamily,
     fontWeight,
     fontSize: pxToRem(size),
@@ -5734,7 +5734,7 @@ function createTypography(palette, typography) {
       letterSpacing: 'inherit'
     }
   };
-  return deepmerge(_extends$1({
+  return deepmerge(_extends({
     htmlFontSize,
     pxToRem,
     fontFamily,
@@ -5759,7 +5759,7 @@ function createShadow(...px) {
 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)];
 var shadows$1 = shadows;
 
-const _excluded$t = ["duration", "easing", "delay"];
+const _excluded$w = ["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 = {
@@ -5802,15 +5802,15 @@ function getAutoHeightDuration(height) {
   return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);
 }
 function createTransitions(inputTransitions) {
-  const mergedEasing = _extends$1({}, easing, inputTransitions.easing);
-  const mergedDuration = _extends$1({}, duration, inputTransitions.duration);
+  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,
-      other = _objectWithoutPropertiesLoose$2(options, _excluded$t);
+      other = _objectWithoutPropertiesLoose(options, _excluded$w);
     if (process.env.NODE_ENV !== 'production') {
       const isString = value => typeof value === 'string';
       // IE11 support, replace with Number.isNaN
@@ -5834,7 +5834,7 @@ function createTransitions(inputTransitions) {
     }
     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$1({
+  return _extends({
     getAutoHeightDuration,
     create
   }, inputTransitions, {
@@ -5857,7 +5857,7 @@ const zIndex = {
 };
 var zIndex$1 = zIndex;
 
-const _excluded$s = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
+const _excluded$v = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
 function createTheme(options = {}, ...args) {
   const {
       mixins: mixinsInput = {},
@@ -5865,7 +5865,7 @@ function createTheme(options = {}, ...args) {
       transitions: transitionsInput = {},
       typography: typographyInput = {}
     } = options,
-    other = _objectWithoutPropertiesLoose$2(options, _excluded$s);
+    other = _objectWithoutPropertiesLoose(options, _excluded$v);
   if (options.vars) {
     throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`vars\` is a private field used for CSS variables support.
 Please use another name.` : formatMuiErrorMessage(18));
@@ -5879,7 +5879,7 @@ Please use another name.` : formatMuiErrorMessage(18));
     shadows: shadows$1.slice(),
     typography: createTypography(palette, typographyInput),
     transitions: createTransitions(transitionsInput),
-    zIndex: _extends$1({}, zIndex$1)
+    zIndex: _extends({}, zIndex$1)
   });
   muiTheme = deepmerge(muiTheme, other);
   muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
@@ -5913,7 +5913,7 @@ Please use another name.` : formatMuiErrorMessage(18));
       }
     });
   }
-  muiTheme.unstable_sxConfig = _extends$1({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
+  muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig$1, other == null ? void 0 : other.unstable_sxConfig);
   muiTheme.unstable_sx = function sx(props) {
     return styleFunctionSx$1({
       sx: props,
@@ -5996,21 +5996,6 @@ process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
 } : void 0;
 var Box$1 = Box;
 
-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);
-}
-
 /**
  * Determines if a given element is a DOM element name (i.e. not a React component).
  */
@@ -6093,19 +6078,6 @@ function resolveComponentProps(componentProps, ownerState) {
   return componentProps;
 }
 
-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;
-}
-
 /**
  * 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`.
@@ -6190,7 +6162,7 @@ function mergeSlotProps(parameters) {
   };
 }
 
-const _excluded$r = ["elementType", "externalSlotProps", "ownerState"];
+const _excluded$u = ["elementType", "externalSlotProps", "ownerState"];
 /**
  * @ignore - do not document.
  * Builds the props to be passed into the slot of an unstyled component.
@@ -6206,7 +6178,7 @@ function useSlotProps(parameters) {
       externalSlotProps,
       ownerState
     } = parameters,
-    rest = _objectWithoutPropertiesLoose$1(parameters, _excluded$r);
+    rest = _objectWithoutPropertiesLoose(parameters, _excluded$u);
   const resolvedComponentsProps = resolveComponentProps(externalSlotProps, ownerState);
   const {
     props: mergedProps,
@@ -6844,7 +6816,7 @@ function getModalUtilityClass(slot) {
 }
 generateUtilityClasses('MuiModal', ['root', 'hidden', 'backdrop']);
 
-const _excluded$q = ["children", "closeAfterTransition", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onKeyDown", "open", "onTransitionEnter", "onTransitionExited", "slotProps", "slots"];
+const _excluded$t = ["children", "closeAfterTransition", "container", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "manager", "onBackdropClick", "onClose", "onKeyDown", "open", "onTransitionEnter", "onTransitionExited", "slotProps", "slots"];
 const useUtilityClasses$i = ownerState => {
   const {
     open,
@@ -6913,7 +6885,7 @@ const Modal$2 = /*#__PURE__*/React.forwardRef(function Modal(props, forwardedRef
       slotProps = {},
       slots = {}
     } = props,
-    other = _objectWithoutPropertiesLoose$1(props, _excluded$q);
+    other = _objectWithoutPropertiesLoose(props, _excluded$t);
   // TODO: `modal`` must change its type in this file to match the type of methods
   // provided by `ModalManager`
   const manager = managerProp;
@@ -7203,7 +7175,7 @@ process.env.NODE_ENV !== "production" ? Modal$2.propTypes /* remove-proptypes */
 } : void 0;
 var ModalUnstyled = Modal$2;
 
-const _excluded$p = ["onChange", "maxRows", "minRows", "style", "value"];
+const _excluded$s = ["onChange", "maxRows", "minRows", "style", "value"];
 function getStyleValue(value) {
   return parseInt(value, 10) || 0;
 }
@@ -7245,7 +7217,7 @@ const TextareaAutosize = /*#__PURE__*/React.forwardRef(function TextareaAutosize
       style,
       value
     } = props,
-    other = _objectWithoutPropertiesLoose$1(props, _excluded$p);
+    other = _objectWithoutPropertiesLoose(props, _excluded$s);
   const {
     current: isControlled
   } = React.useRef(value != null);
@@ -7486,7 +7458,7 @@ function useFormControl() {
 }
 
 function GlobalStyles(props) {
-  return /*#__PURE__*/jsxRuntimeExports.jsx(GlobalStyles$1, _extends$1({}, props, {
+  return /*#__PURE__*/jsxRuntimeExports.jsx(GlobalStyles$1, _extends({}, props, {
     defaultTheme: defaultTheme$2,
     themeId: THEME_ID
   }));
@@ -7539,7 +7511,7 @@ function getInputBaseUtilityClass(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']);
 var inputBaseClasses$1 = inputBaseClasses;
 
-const _excluded$o = ["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 _excluded$r = ["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
@@ -7582,7 +7554,7 @@ const InputBaseRoot = styled$1('div', {
 })(({
   theme,
   ownerState
-}) => _extends$1({}, theme.typography.body1, {
+}) => _extends({}, theme.typography.body1, {
   color: (theme.vars || theme).palette.text.primary,
   lineHeight: '1.4375em',
   // 23px
@@ -7596,7 +7568,7 @@ const InputBaseRoot = styled$1('div', {
     color: (theme.vars || theme).palette.text.disabled,
     cursor: 'default'
   }
-}, ownerState.multiline && _extends$1({
+}, ownerState.multiline && _extends({
   padding: '4px 0 5px'
 }, ownerState.size === 'small' && {
   paddingTop: 1
@@ -7612,7 +7584,7 @@ const InputBaseComponent = styled$1('input', {
   ownerState
 }) => {
   const light = theme.palette.mode === 'light';
-  const placeholder = _extends$1({
+  const placeholder = _extends({
     color: 'currentColor'
   }, theme.vars ? {
     opacity: theme.vars.opacity.inputPlaceholder
@@ -7631,7 +7603,7 @@ const InputBaseComponent = styled$1('input', {
   } : {
     opacity: light ? 0.42 : 0.5
   };
-  return _extends$1({
+  return _extends({
     font: 'inherit',
     letterSpacing: 'inherit',
     color: 'currentColor',
@@ -7770,7 +7742,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
       type = 'text',
       value: valueProp
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$o);
+    other = _objectWithoutPropertiesLoose(props, _excluded$r);
   const value = inputPropsProp.value != null ? inputPropsProp.value : valueProp;
   const {
     current: isControlled
@@ -7905,13 +7877,13 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
           console.warn('MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set.');
         }
       }
-      inputProps = _extends$1({
+      inputProps = _extends({
         type: undefined,
         minRows: rows,
         maxRows: rows
       }, inputProps);
     } else {
-      inputProps = _extends$1({
+      inputProps = _extends({
         type: undefined,
         maxRows,
         minRows
@@ -7930,7 +7902,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
       muiFormControl.setAdornedStart(Boolean(startAdornment));
     }
   }, [muiFormControl, startAdornment]);
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     color: fcs.color || 'primary',
     disabled: fcs.disabled,
     endAdornment,
@@ -7948,10 +7920,10 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
   const Root = slots.root || components.Root || InputBaseRoot;
   const rootProps = slotProps.root || componentsProps.root || {};
   const Input = slots.input || components.Input || InputBaseComponent;
-  inputProps = _extends$1({}, inputProps, (_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input);
+  inputProps = _extends({}, inputProps, (_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input);
   return /*#__PURE__*/jsxRuntimeExports.jsxs(React.Fragment, {
-    children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/jsxRuntimeExports.jsxs(Root, _extends$1({}, rootProps, !isHostComponent(Root) && {
-      ownerState: _extends$1({}, ownerState, rootProps.ownerState)
+    children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/jsxRuntimeExports.jsxs(Root, _extends({}, rootProps, !isHostComponent(Root) && {
+      ownerState: _extends({}, ownerState, rootProps.ownerState)
     }, {
       ref: ref,
       onClick: handleClick
@@ -7959,7 +7931,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
       className: clsx(classes.root, rootProps.className, className, readOnly && 'MuiInputBase-readOnly'),
       children: [startAdornment, /*#__PURE__*/jsxRuntimeExports.jsx(FormControlContext$1.Provider, {
         value: null,
-        children: /*#__PURE__*/jsxRuntimeExports.jsx(Input, _extends$1({
+        children: /*#__PURE__*/jsxRuntimeExports.jsx(Input, _extends({
           ownerState: ownerState,
           "aria-invalid": fcs.error,
           "aria-describedby": ariaDescribedby,
@@ -7980,7 +7952,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
           type: type
         }, inputProps, !isHostComponent(Input) && {
           as: InputComponent,
-          ownerState: _extends$1({}, ownerState, inputProps.ownerState)
+          ownerState: _extends({}, ownerState, inputProps.ownerState)
         }, {
           ref: handleInputRef,
           className: clsx(classes.input, inputProps.className, readOnly && 'MuiInputBase-readOnly'),
@@ -7988,7 +7960,7 @@ const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref)
           onChange: handleChange,
           onFocus: handleFocus
         }))
-      }), endAdornment, renderSuffix ? renderSuffix(_extends$1({}, fcs, {
+      }), endAdornment, renderSuffix ? renderSuffix(_extends({}, fcs, {
         startAdornment
       })) : null]
     }))]
@@ -8229,10 +8201,10 @@ var InputBase$1 = InputBase;
 function getInputUtilityClass(slot) {
   return generateUtilityClass('MuiInput', slot);
 }
-const inputClasses = _extends$1({}, inputBaseClasses$1, generateUtilityClasses('MuiInput', ['root', 'underline', 'input']));
+const inputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiInput', ['root', 'underline', 'input']));
 var inputClasses$1 = inputClasses;
 
-const _excluded$n = ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"];
+const _excluded$q = ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"];
 const useUtilityClasses$g = ownerState => {
   const {
     classes,
@@ -8243,7 +8215,7 @@ const useUtilityClasses$g = ownerState => {
     input: ['input']
   };
   const composedClasses = composeClasses(slots, getInputUtilityClass, classes);
-  return _extends$1({}, classes, composedClasses);
+  return _extends({}, classes, composedClasses);
 };
 const InputRoot = styled$1(InputBaseRoot, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -8264,7 +8236,7 @@ const InputRoot = styled$1(InputBaseRoot, {
   if (theme.vars) {
     bottomLineColor = `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})`;
   }
-  return _extends$1({
+  return _extends({
     position: 'relative'
   }, ownerState.formControl && {
     'label + &': {
@@ -8345,7 +8317,7 @@ const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
       slots = {},
       type = 'text'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$n);
+    other = _objectWithoutPropertiesLoose(props, _excluded$q);
   const classes = useUtilityClasses$g(props);
   const ownerState = {
     disableUnderline
@@ -8358,7 +8330,7 @@ const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
   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__*/jsxRuntimeExports.jsx(InputBase$1, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(InputBase$1, _extends({
     slots: {
       root: RootSlot,
       input: InputSlot
@@ -8565,10 +8537,10 @@ var Input$1 = Input;
 function getFilledInputUtilityClass(slot) {
   return generateUtilityClass('MuiFilledInput', slot);
 }
-const filledInputClasses = _extends$1({}, inputBaseClasses$1, generateUtilityClasses('MuiFilledInput', ['root', 'underline', 'input']));
+const filledInputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiFilledInput', ['root', 'underline', 'input']));
 var filledInputClasses$1 = filledInputClasses;
 
-const _excluded$m = ["disableUnderline", "components", "componentsProps", "fullWidth", "hiddenLabel", "inputComponent", "multiline", "slotProps", "slots", "type"];
+const _excluded$p = ["disableUnderline", "components", "componentsProps", "fullWidth", "hiddenLabel", "inputComponent", "multiline", "slotProps", "slots", "type"];
 const useUtilityClasses$f = ownerState => {
   const {
     classes,
@@ -8579,7 +8551,7 @@ const useUtilityClasses$f = ownerState => {
     input: ['input']
   };
   const composedClasses = composeClasses(slots, getFilledInputUtilityClass, classes);
-  return _extends$1({}, classes, composedClasses);
+  return _extends({}, classes, composedClasses);
 };
 const FilledInputRoot = styled$1(InputBaseRoot, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -8601,7 +8573,7 @@ const FilledInputRoot = styled$1(InputBaseRoot, {
   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$1({
+  return _extends({
     position: 'relative',
     backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor,
     borderTopLeftRadius: (theme.vars || theme).shape.borderRadius,
@@ -8674,7 +8646,7 @@ const FilledInputRoot = styled$1(InputBaseRoot, {
     paddingLeft: 12
   }, ownerState.endAdornment && {
     paddingRight: 12
-  }, ownerState.multiline && _extends$1({
+  }, ownerState.multiline && _extends({
     padding: '25px 12px 8px'
   }, ownerState.size === 'small' && {
     paddingTop: 21,
@@ -8691,7 +8663,7 @@ const FilledInputInput = styled$1(InputBaseComponent, {
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   paddingTop: 25,
   paddingRight: 12,
   paddingBottom: 8,
@@ -8752,8 +8724,8 @@ const FilledInput = /*#__PURE__*/React.forwardRef(function FilledInput(inProps,
       slots = {},
       type = 'text'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$m);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$p);
+  const ownerState = _extends({}, props, {
     fullWidth,
     inputComponent,
     multiline,
@@ -8771,7 +8743,7 @@ const FilledInput = /*#__PURE__*/React.forwardRef(function FilledInput(inProps,
   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__*/jsxRuntimeExports.jsx(InputBase$1, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(InputBase$1, _extends({
     slots: {
       root: RootSlot,
       input: InputSlot
@@ -8983,7 +8955,7 @@ FilledInput.muiName = 'Input';
 var FilledInput$1 = FilledInput;
 
 var _span$2;
-const _excluded$l = ["children", "classes", "className", "label", "notched"];
+const _excluded$o = ["children", "classes", "className", "label", "notched"];
 const NotchedOutlineRoot$1 = styled$1('fieldset')({
   textAlign: 'left',
   position: 'absolute',
@@ -9003,7 +8975,7 @@ const NotchedOutlineRoot$1 = styled$1('fieldset')({
 const NotchedOutlineLegend = styled$1('legend')(({
   ownerState,
   theme
-}) => _extends$1({
+}) => _extends({
   float: 'unset',
   // Fix conflict with bootstrap
   width: 'auto',
@@ -9017,7 +8989,7 @@ const NotchedOutlineLegend = styled$1('legend')(({
     duration: 150,
     easing: theme.transitions.easing.easeOut
   })
-}, ownerState.withLabel && _extends$1({
+}, ownerState.withLabel && _extends({
   display: 'block',
   // Fix conflict with normalize.css and sanitize.css
   padding: 0,
@@ -9056,13 +9028,13 @@ function NotchedOutline(props) {
       label,
       notched
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$l);
+    other = _objectWithoutPropertiesLoose(props, _excluded$o);
   const withLabel = label != null && label !== '';
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     notched,
     withLabel
   });
-  return /*#__PURE__*/jsxRuntimeExports.jsx(NotchedOutlineRoot$1, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(NotchedOutlineRoot$1, _extends({
     "aria-hidden": true,
     className: className,
     ownerState: ownerState
@@ -9110,10 +9082,10 @@ process.env.NODE_ENV !== "production" ? NotchedOutline.propTypes = {
 function getOutlinedInputUtilityClass(slot) {
   return generateUtilityClass('MuiOutlinedInput', slot);
 }
-const outlinedInputClasses = _extends$1({}, inputBaseClasses$1, generateUtilityClasses('MuiOutlinedInput', ['root', 'notchedOutline', 'input']));
+const outlinedInputClasses = _extends({}, inputBaseClasses$1, generateUtilityClasses('MuiOutlinedInput', ['root', 'notchedOutline', 'input']));
 var outlinedInputClasses$1 = outlinedInputClasses;
 
-const _excluded$k = ["components", "fullWidth", "inputComponent", "label", "multiline", "notched", "slots", "type"];
+const _excluded$n = ["components", "fullWidth", "inputComponent", "label", "multiline", "notched", "slots", "type"];
 const useUtilityClasses$e = ownerState => {
   const {
     classes
@@ -9124,7 +9096,7 @@ const useUtilityClasses$e = ownerState => {
     input: ['input']
   };
   const composedClasses = composeClasses(slots, getOutlinedInputUtilityClass, classes);
-  return _extends$1({}, classes, composedClasses);
+  return _extends({}, classes, composedClasses);
 };
 const OutlinedInputRoot = styled$1(InputBaseRoot, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -9136,7 +9108,7 @@ const OutlinedInputRoot = styled$1(InputBaseRoot, {
   ownerState
 }) => {
   const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
-  return _extends$1({
+  return _extends({
     position: 'relative',
     borderRadius: (theme.vars || theme).shape.borderRadius,
     [`&:hover .${outlinedInputClasses$1.notchedOutline}`]: {
@@ -9162,7 +9134,7 @@ const OutlinedInputRoot = styled$1(InputBaseRoot, {
     paddingLeft: 14
   }, ownerState.endAdornment && {
     paddingRight: 14
-  }, ownerState.multiline && _extends$1({
+  }, ownerState.multiline && _extends({
     padding: '16.5px 14px'
   }, ownerState.size === 'small' && {
     padding: '8.5px 14px'
@@ -9187,7 +9159,7 @@ const OutlinedInputInput = styled$1(InputBaseComponent, {
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   padding: '16.5px 14px'
 }, !theme.vars && {
   '&:-webkit-autofill': {
@@ -9232,7 +9204,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
       slots = {},
       type = 'text'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$k);
+    other = _objectWithoutPropertiesLoose(props, _excluded$n);
   const classes = useUtilityClasses$e(props);
   const muiFormControl = useFormControl();
   const fcs = formControlState({
@@ -9240,7 +9212,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
     muiFormControl,
     states: ['required']
   });
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     color: fcs.color || 'primary',
     disabled: fcs.disabled,
     error: fcs.error,
@@ -9254,7 +9226,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
   });
   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__*/jsxRuntimeExports.jsx(InputBase$1, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(InputBase$1, _extends({
     slots: {
       root: RootSlot,
       input: InputSlot
@@ -9273,7 +9245,7 @@ const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inPro
     ref: ref,
     type: type
   }, other, {
-    classes: _extends$1({}, classes, {
+    classes: _extends({}, classes, {
       notchedOutline: null
     })
   }));
@@ -9453,7 +9425,7 @@ function getFormLabelUtilityClasses(slot) {
 const formLabelClasses = generateUtilityClasses('MuiFormLabel', ['root', 'colorSecondary', 'focused', 'disabled', 'error', 'filled', 'required', 'asterisk']);
 var formLabelClasses$1 = formLabelClasses;
 
-const _excluded$j = ["children", "className", "color", "component", "disabled", "error", "filled", "focused", "required"];
+const _excluded$m = ["children", "className", "color", "component", "disabled", "error", "filled", "focused", "required"];
 const useUtilityClasses$d = ownerState => {
   const {
     classes,
@@ -9476,12 +9448,12 @@ const FormLabelRoot = styled$1('label', {
   overridesResolver: ({
     ownerState
   }, styles) => {
-    return _extends$1({}, styles.root, ownerState.color === 'secondary' && styles.colorSecondary, ownerState.filled && styles.filled);
+    return _extends({}, styles.root, ownerState.color === 'secondary' && styles.colorSecondary, ownerState.filled && styles.filled);
   }
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   color: (theme.vars || theme).palette.text.secondary
 }, theme.typography.body1, {
   lineHeight: '1.4375em',
@@ -9518,14 +9490,14 @@ const FormLabel = /*#__PURE__*/React.forwardRef(function FormLabel(inProps, ref)
       className,
       component = 'label'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$j);
+    other = _objectWithoutPropertiesLoose(props, _excluded$m);
   const muiFormControl = useFormControl();
   const fcs = formControlState({
     props,
     muiFormControl,
     states: ['color', 'required', 'focused', 'disabled', 'error', 'filled']
   });
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     color: fcs.color || 'primary',
     component,
     disabled: fcs.disabled,
@@ -9535,7 +9507,7 @@ const FormLabel = /*#__PURE__*/React.forwardRef(function FormLabel(inProps, ref)
     required: fcs.required
   });
   const classes = useUtilityClasses$d(ownerState);
-  return /*#__PURE__*/jsxRuntimeExports.jsxs(FormLabelRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsxs(FormLabelRoot, _extends({
     as: component,
     ownerState: ownerState,
     className: clsx(classes.root, className),
@@ -9609,7 +9581,7 @@ function getInputLabelUtilityClasses(slot) {
 }
 generateUtilityClasses('MuiInputLabel', ['root', 'focused', 'disabled', 'error', 'required', 'asterisk', 'formControl', 'sizeSmall', 'shrink', 'animated', 'standard', 'filled', 'outlined']);
 
-const _excluded$i = ["disableAnimation", "margin", "shrink", "variant", "className"];
+const _excluded$l = ["disableAnimation", "margin", "shrink", "variant", "className"];
 const useUtilityClasses$c = ownerState => {
   const {
     classes,
@@ -9625,7 +9597,7 @@ const useUtilityClasses$c = ownerState => {
     asterisk: [required && 'asterisk']
   };
   const composedClasses = composeClasses(slots, getInputLabelUtilityClasses, classes);
-  return _extends$1({}, classes, composedClasses);
+  return _extends({}, classes, composedClasses);
 };
 const InputLabelRoot = styled$1(FormLabel$1, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
@@ -9642,7 +9614,7 @@ const InputLabelRoot = styled$1(FormLabel$1, {
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   display: 'block',
   transformOrigin: 'top left',
   whiteSpace: 'nowrap',
@@ -9667,7 +9639,7 @@ const InputLabelRoot = styled$1(FormLabel$1, {
     duration: theme.transitions.duration.shorter,
     easing: theme.transitions.easing.easeOut
   })
-}, ownerState.variant === 'filled' && _extends$1({
+}, 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.
@@ -9678,14 +9650,14 @@ const InputLabelRoot = styled$1(FormLabel$1, {
   maxWidth: 'calc(100% - 24px)'
 }, ownerState.size === 'small' && {
   transform: 'translate(12px, 13px) scale(1)'
-}, ownerState.shrink && _extends$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$1({
+})), ownerState.variant === 'outlined' && _extends({
   // see comment above on filled.zIndex
   zIndex: 1,
   pointerEvents: 'none',
@@ -9711,7 +9683,7 @@ const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, re
       shrink: shrinkProp,
       className
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$i);
+    other = _objectWithoutPropertiesLoose(props, _excluded$l);
   const muiFormControl = useFormControl();
   let shrink = shrinkProp;
   if (typeof shrink === 'undefined' && muiFormControl) {
@@ -9722,7 +9694,7 @@ const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, re
     muiFormControl,
     states: ['size', 'variant', 'required']
   });
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     disableAnimation,
     formControl: muiFormControl,
     shrink,
@@ -9731,7 +9703,7 @@ const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, re
     required: fcs.required
   });
   const classes = useUtilityClasses$c(ownerState);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(InputLabelRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(InputLabelRoot, _extends({
     "data-shrink": shrink,
     ownerState: ownerState,
     ref: ref,
@@ -9814,7 +9786,7 @@ function getFormControlUtilityClasses(slot) {
 }
 generateUtilityClasses('MuiFormControl', ['root', 'marginNone', 'marginNormal', 'marginDense', 'fullWidth', 'disabled']);
 
-const _excluded$h = ["children", "className", "color", "component", "disabled", "error", "focused", "fullWidth", "hiddenLabel", "margin", "required", "size", "variant"];
+const _excluded$k = ["children", "className", "color", "component", "disabled", "error", "focused", "fullWidth", "hiddenLabel", "margin", "required", "size", "variant"];
 const useUtilityClasses$b = ownerState => {
   const {
     classes,
@@ -9832,11 +9804,11 @@ const FormControlRoot = styled$1('div', {
   overridesResolver: ({
     ownerState
   }, styles) => {
-    return _extends$1({}, styles.root, styles[`margin${capitalize(ownerState.margin)}`], ownerState.fullWidth && styles.fullWidth);
+    return _extends({}, styles.root, styles[`margin${capitalize(ownerState.margin)}`], ownerState.fullWidth && styles.fullWidth);
   }
 })(({
   ownerState
-}) => _extends$1({
+}) => _extends({
   display: 'inline-flex',
   flexDirection: 'column',
   position: 'relative',
@@ -9900,8 +9872,8 @@ const FormControl = /*#__PURE__*/React.forwardRef(function FormControl(inProps,
       size = 'medium',
       variant = 'outlined'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$h);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$k);
+  const ownerState = _extends({}, props, {
     color,
     component,
     disabled,
@@ -9997,7 +9969,7 @@ const FormControl = /*#__PURE__*/React.forwardRef(function FormControl(inProps,
   }, [adornedStart, color, disabled, error, filled, focused, fullWidth, hiddenLabel, registerEffect, required, size, variant]);
   return /*#__PURE__*/jsxRuntimeExports.jsx(FormControlContext$1.Provider, {
     value: childContext,
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(FormControlRoot, _extends$1({
+    children: /*#__PURE__*/jsxRuntimeExports.jsx(FormControlRoot, _extends({
       as: component,
       ownerState: ownerState,
       className: clsx(classes.root, className),
@@ -10096,7 +10068,7 @@ const formHelperTextClasses = generateUtilityClasses('MuiFormHelperText', ['root
 var formHelperTextClasses$1 = formHelperTextClasses;
 
 var _span$1;
-const _excluded$g = ["children", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"];
+const _excluded$j = ["children", "className", "component", "disabled", "error", "filled", "focused", "margin", "required", "variant"];
 const useUtilityClasses$a = ownerState => {
   const {
     classes,
@@ -10125,7 +10097,7 @@ const FormHelperTextRoot = styled$1('p', {
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   color: (theme.vars || theme).palette.text.secondary
 }, theme.typography.caption, {
   textAlign: 'left',
@@ -10155,14 +10127,14 @@ const FormHelperText = /*#__PURE__*/React.forwardRef(function FormHelperText(inP
       className,
       component = 'p'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$g);
+    other = _objectWithoutPropertiesLoose(props, _excluded$j);
   const muiFormControl = useFormControl();
   const fcs = formControlState({
     props,
     muiFormControl,
     states: ['variant', 'size', 'disabled', 'error', 'filled', 'focused', 'required']
   });
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     component,
     contained: fcs.variant === 'filled' || fcs.variant === 'outlined',
     variant: fcs.variant,
@@ -10174,7 +10146,7 @@ const FormHelperText = /*#__PURE__*/React.forwardRef(function FormHelperText(inP
     required: fcs.required
   });
   const classes = useUtilityClasses$a(ownerState);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(FormHelperTextRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(FormHelperTextRoot, _extends({
     as: component,
     ownerState: ownerState,
     className: clsx(classes.root, className),
@@ -10247,58 +10219,313 @@ process.env.NODE_ENV !== "production" ? FormHelperText.propTypes /* remove-propt
 } : void 0;
 var FormHelperText$1 = FormHelperText;
 
-/**
- * @ignore - internal component.
+var reactIsExports = {};
+var reactIs = {
+  get exports(){ return reactIsExports; },
+  set exports(v){ reactIsExports = v; },
+};
+
+var reactIs_production_min = {};
+
+/** @license React v17.0.2
+ * 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.
  */
-const ListContext = /*#__PURE__*/React.createContext({});
-if (process.env.NODE_ENV !== 'production') {
-  ListContext.displayName = 'ListContext';
-}
-var ListContext$1 = ListContext;
+var b=60103,c=60106,d=60107,e=60108,f=60114,g=60109,h=60110,k=60112,l=60113,m=60120,n=60115,p=60116,q=60121,r=60122,u=60117,v=60129,w=60131;
+if("function"===typeof Symbol&&Symbol.for){var x=Symbol.for;b=x("react.element");c=x("react.portal");d=x("react.fragment");e=x("react.strict_mode");f=x("react.profiler");g=x("react.provider");h=x("react.context");k=x("react.forward_ref");l=x("react.suspense");m=x("react.suspense_list");n=x("react.memo");p=x("react.lazy");q=x("react.block");r=x("react.server.block");u=x("react.fundamental");v=x("react.debug_trace_mode");w=x("react.legacy_hidden");}
+function y(a){if("object"===typeof a&&null!==a){var t=a.$$typeof;switch(t){case b:switch(a=a.type,a){case d:case f:case e:case l:case m:return a;default:switch(a=a&&a.$$typeof,a){case h:case k:case p:case n:case g:return a;default:return t}}case c:return t}}}var z=g,A=b,B=k,C=d,D=p,E=n,F=c,G=f,H=e,I=l;reactIs_production_min.ContextConsumer=h;reactIs_production_min.ContextProvider=z;reactIs_production_min.Element=A;reactIs_production_min.ForwardRef=B;reactIs_production_min.Fragment=C;reactIs_production_min.Lazy=D;reactIs_production_min.Memo=E;reactIs_production_min.Portal=F;reactIs_production_min.Profiler=G;reactIs_production_min.StrictMode=H;
+reactIs_production_min.Suspense=I;reactIs_production_min.isAsyncMode=function(){return !1};reactIs_production_min.isConcurrentMode=function(){return !1};reactIs_production_min.isContextConsumer=function(a){return y(a)===h};reactIs_production_min.isContextProvider=function(a){return y(a)===g};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===b};reactIs_production_min.isForwardRef=function(a){return y(a)===k};reactIs_production_min.isFragment=function(a){return y(a)===d};reactIs_production_min.isLazy=function(a){return y(a)===p};reactIs_production_min.isMemo=function(a){return y(a)===n};
+reactIs_production_min.isPortal=function(a){return y(a)===c};reactIs_production_min.isProfiler=function(a){return y(a)===f};reactIs_production_min.isStrictMode=function(a){return y(a)===e};reactIs_production_min.isSuspense=function(a){return y(a)===l};reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===d||a===f||a===v||a===e||a===l||a===m||a===w||"object"===typeof a&&null!==a&&(a.$$typeof===p||a.$$typeof===n||a.$$typeof===g||a.$$typeof===h||a.$$typeof===k||a.$$typeof===u||a.$$typeof===q||a[0]===r)?!0:!1};
+reactIs_production_min.typeOf=y;
 
-function getListUtilityClass(slot) {
-  return generateUtilityClass('MuiList', slot);
-}
-generateUtilityClasses('MuiList', ['root', 'padding', 'dense', 'subheader']);
+var reactIs_development = {};
 
-const _excluded$f = ["children", "className", "component", "dense", "disablePadding", "subheader"];
-const useUtilityClasses$9 = 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];
+/** @license React v17.0.2
+ * react-is.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+if (process.env.NODE_ENV !== "production") {
+  (function() {
+
+// ATTENTION
+// When adding new symbols to this file,
+// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
+// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
+// nor polyfill, then a plain number is used for performance.
+var REACT_ELEMENT_TYPE = 0xeac7;
+var REACT_PORTAL_TYPE = 0xeaca;
+var REACT_FRAGMENT_TYPE = 0xeacb;
+var REACT_STRICT_MODE_TYPE = 0xeacc;
+var REACT_PROFILER_TYPE = 0xead2;
+var REACT_PROVIDER_TYPE = 0xeacd;
+var REACT_CONTEXT_TYPE = 0xeace;
+var REACT_FORWARD_REF_TYPE = 0xead0;
+var REACT_SUSPENSE_TYPE = 0xead1;
+var REACT_SUSPENSE_LIST_TYPE = 0xead8;
+var REACT_MEMO_TYPE = 0xead3;
+var REACT_LAZY_TYPE = 0xead4;
+var REACT_BLOCK_TYPE = 0xead9;
+var REACT_SERVER_BLOCK_TYPE = 0xeada;
+var REACT_FUNDAMENTAL_TYPE = 0xead5;
+var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
+var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
+
+if (typeof Symbol === 'function' && Symbol.for) {
+  var symbolFor = Symbol.for;
+  REACT_ELEMENT_TYPE = symbolFor('react.element');
+  REACT_PORTAL_TYPE = symbolFor('react.portal');
+  REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
+  REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
+  REACT_PROFILER_TYPE = symbolFor('react.profiler');
+  REACT_PROVIDER_TYPE = symbolFor('react.provider');
+  REACT_CONTEXT_TYPE = symbolFor('react.context');
+  REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
+  REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
+  REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
+  REACT_MEMO_TYPE = symbolFor('react.memo');
+  REACT_LAZY_TYPE = symbolFor('react.lazy');
+  REACT_BLOCK_TYPE = symbolFor('react.block');
+  REACT_SERVER_BLOCK_TYPE = symbolFor('react.server.block');
+  REACT_FUNDAMENTAL_TYPE = symbolFor('react.fundamental');
+  symbolFor('react.scope');
+  symbolFor('react.opaque.id');
+  REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
+  symbolFor('react.offscreen');
+  REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
+}
+
+// Filter certain DOM attributes (e.g. src, href) if their values are empty strings.
+
+var enableScopeAPI = false; // Experimental Create Event Handle API.
+
+function isValidElementType(type) {
+  if (typeof type === 'string' || typeof type === 'function') {
+    return true;
+  } // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
+
+
+  if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || type === REACT_DEBUG_TRACING_MODE_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_LEGACY_HIDDEN_TYPE || enableScopeAPI ) {
+    return true;
   }
-})(({
-  ownerState
-}) => _extends$1({
-  listStyle: 'none',
-  margin: 0,
-  padding: 0,
-  position: 'relative'
-}, !ownerState.disablePadding && {
-  paddingTop: 8,
-  paddingBottom: 8
-}, ownerState.subheader && {
-  paddingTop: 0
-}));
-const List = /*#__PURE__*/React.forwardRef(function List(inProps, ref) {
-  const props = useThemeProps({
-    props: inProps,
+
+  if (typeof type === 'object' && type !== null) {
+    if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_BLOCK_TYPE || type[0] === REACT_SERVER_BLOCK_TYPE) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+function typeOf(object) {
+  if (typeof object === 'object' && object !== null) {
+    var $$typeof = object.$$typeof;
+
+    switch ($$typeof) {
+      case REACT_ELEMENT_TYPE:
+        var type = object.type;
+
+        switch (type) {
+          case REACT_FRAGMENT_TYPE:
+          case REACT_PROFILER_TYPE:
+          case REACT_STRICT_MODE_TYPE:
+          case REACT_SUSPENSE_TYPE:
+          case REACT_SUSPENSE_LIST_TYPE:
+            return type;
+
+          default:
+            var $$typeofType = type && type.$$typeof;
+
+            switch ($$typeofType) {
+              case REACT_CONTEXT_TYPE:
+              case REACT_FORWARD_REF_TYPE:
+              case REACT_LAZY_TYPE:
+              case REACT_MEMO_TYPE:
+              case REACT_PROVIDER_TYPE:
+                return $$typeofType;
+
+              default:
+                return $$typeof;
+            }
+
+        }
+
+      case REACT_PORTAL_TYPE:
+        return $$typeof;
+    }
+  }
+
+  return undefined;
+}
+var ContextConsumer = REACT_CONTEXT_TYPE;
+var ContextProvider = REACT_PROVIDER_TYPE;
+var Element = REACT_ELEMENT_TYPE;
+var ForwardRef = REACT_FORWARD_REF_TYPE;
+var Fragment = REACT_FRAGMENT_TYPE;
+var Lazy = REACT_LAZY_TYPE;
+var Memo = REACT_MEMO_TYPE;
+var Portal = REACT_PORTAL_TYPE;
+var Profiler = REACT_PROFILER_TYPE;
+var StrictMode = REACT_STRICT_MODE_TYPE;
+var Suspense = REACT_SUSPENSE_TYPE;
+var hasWarnedAboutDeprecatedIsAsyncMode = false;
+var hasWarnedAboutDeprecatedIsConcurrentMode = false; // AsyncMode should be deprecated
+
+function isAsyncMode(object) {
+  {
+    if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+      hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
+
+      console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 18+.');
+    }
+  }
+
+  return false;
+}
+function isConcurrentMode(object) {
+  {
+    if (!hasWarnedAboutDeprecatedIsConcurrentMode) {
+      hasWarnedAboutDeprecatedIsConcurrentMode = true; // Using console['warn'] to evade Babel and ESLint
+
+      console['warn']('The ReactIs.isConcurrentMode() alias has been deprecated, ' + 'and will be removed in React 18+.');
+    }
+  }
+
+  return false;
+}
+function isContextConsumer(object) {
+  return typeOf(object) === REACT_CONTEXT_TYPE;
+}
+function isContextProvider(object) {
+  return typeOf(object) === REACT_PROVIDER_TYPE;
+}
+function isElement(object) {
+  return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+}
+function isForwardRef(object) {
+  return typeOf(object) === REACT_FORWARD_REF_TYPE;
+}
+function isFragment(object) {
+  return typeOf(object) === REACT_FRAGMENT_TYPE;
+}
+function isLazy(object) {
+  return typeOf(object) === REACT_LAZY_TYPE;
+}
+function isMemo(object) {
+  return typeOf(object) === REACT_MEMO_TYPE;
+}
+function isPortal(object) {
+  return typeOf(object) === REACT_PORTAL_TYPE;
+}
+function isProfiler(object) {
+  return typeOf(object) === REACT_PROFILER_TYPE;
+}
+function isStrictMode(object) {
+  return typeOf(object) === REACT_STRICT_MODE_TYPE;
+}
+function isSuspense(object) {
+  return typeOf(object) === REACT_SUSPENSE_TYPE;
+}
+
+reactIs_development.ContextConsumer = ContextConsumer;
+reactIs_development.ContextProvider = ContextProvider;
+reactIs_development.Element = Element;
+reactIs_development.ForwardRef = ForwardRef;
+reactIs_development.Fragment = Fragment;
+reactIs_development.Lazy = Lazy;
+reactIs_development.Memo = Memo;
+reactIs_development.Portal = Portal;
+reactIs_development.Profiler = Profiler;
+reactIs_development.StrictMode = StrictMode;
+reactIs_development.Suspense = Suspense;
+reactIs_development.isAsyncMode = isAsyncMode;
+reactIs_development.isConcurrentMode = isConcurrentMode;
+reactIs_development.isContextConsumer = isContextConsumer;
+reactIs_development.isContextProvider = isContextProvider;
+reactIs_development.isElement = isElement;
+reactIs_development.isForwardRef = isForwardRef;
+reactIs_development.isFragment = isFragment;
+reactIs_development.isLazy = isLazy;
+reactIs_development.isMemo = isMemo;
+reactIs_development.isPortal = isPortal;
+reactIs_development.isProfiler = isProfiler;
+reactIs_development.isStrictMode = isStrictMode;
+reactIs_development.isSuspense = isSuspense;
+reactIs_development.isValidElementType = isValidElementType;
+reactIs_development.typeOf = typeOf;
+  })();
+}
+
+(function (module) {
+
+	if (process.env.NODE_ENV === 'production') {
+	  module.exports = reactIs_production_min;
+	} else {
+	  module.exports = reactIs_development;
+	}
+} (reactIs));
+
+/**
+ * @ignore - internal component.
+ */
+const ListContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  ListContext.displayName = 'ListContext';
+}
+var ListContext$1 = ListContext;
+
+function getListUtilityClass(slot) {
+  return generateUtilityClass('MuiList', slot);
+}
+generateUtilityClasses('MuiList', ['root', 'padding', 'dense', 'subheader']);
+
+const _excluded$i = ["children", "className", "component", "dense", "disablePadding", "subheader"];
+const useUtilityClasses$9 = 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__*/React.forwardRef(function List(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
     name: 'MuiList'
   });
   const {
@@ -10309,11 +10536,11 @@ const List = /*#__PURE__*/React.forwardRef(function List(inProps, ref) {
       disablePadding = false,
       subheader
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$f);
+    other = _objectWithoutPropertiesLoose(props, _excluded$i);
   const context = React.useMemo(() => ({
     dense
   }), [dense]);
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     component,
     dense,
     disablePadding
@@ -10321,7 +10548,7 @@ const List = /*#__PURE__*/React.forwardRef(function List(inProps, ref) {
   const classes = useUtilityClasses$9(ownerState);
   return /*#__PURE__*/jsxRuntimeExports.jsx(ListContext$1.Provider, {
     value: context,
-    children: /*#__PURE__*/jsxRuntimeExports.jsxs(ListRoot, _extends$1({
+    children: /*#__PURE__*/jsxRuntimeExports.jsxs(ListRoot, _extends({
       as: component,
       className: clsx(classes.root, className),
       ref: ref,
@@ -10376,7 +10603,7 @@ process.env.NODE_ENV !== "production" ? List.propTypes /* remove-proptypes */ =
 } : void 0;
 var List$1 = List;
 
-const _excluded$e = ["actions", "autoFocus", "autoFocusItem", "children", "className", "disabledItemsFocusable", "disableListWrap", "onKeyDown", "variant"];
+const _excluded$h = ["actions", "autoFocus", "autoFocusItem", "children", "className", "disabledItemsFocusable", "disableListWrap", "onKeyDown", "variant"];
 function nextItem(list, item, disableListWrap) {
   if (list === item) {
     return list.firstChild;
@@ -10458,7 +10685,7 @@ const MenuList = /*#__PURE__*/React.forwardRef(function MenuList(props, ref) {
       onKeyDown,
       variant = 'selectedMenu'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$e);
+    other = _objectWithoutPropertiesLoose(props, _excluded$h);
   const listRef = React.useRef(null);
   const textCriteriaRef = React.useRef({
     keys: [],
@@ -10547,6 +10774,13 @@ const MenuList = /*#__PURE__*/React.forwardRef(function MenuList(props, ref) {
   // item and use the first valid item as a fallback
   React.Children.forEach(children, (child, index) => {
     if (! /*#__PURE__*/React.isValidElement(child)) {
+      if (activeItemIndex === index) {
+        activeItemIndex += 1;
+        if (activeItemIndex >= children.length) {
+          // there are no focusable items within the list.
+          activeItemIndex = -1;
+        }
+      }
       return;
     }
     if (process.env.NODE_ENV !== 'production') {
@@ -10582,7 +10816,7 @@ const MenuList = /*#__PURE__*/React.forwardRef(function MenuList(props, ref) {
     }
     return child;
   });
-  return /*#__PURE__*/jsxRuntimeExports.jsx(List$1, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(List$1, _extends({
     role: "menu",
     ref: handleRef,
     className: className,
@@ -10617,176 +10851,27 @@ process.env.NODE_ENV !== "production" ? MenuList.propTypes /* remove-proptypes *
    */
   className: propTypesExports.string,
   /**
-   * If `true`, will allow focus on disabled items.
-   * @default false
-   */
-  disabledItemsFocusable: propTypesExports.bool,
-  /**
-   * If `true`, the menu items will not wrap focus.
-   * @default false
-   */
-  disableListWrap: propTypesExports.bool,
-  /**
-   * @ignore
-   */
-  onKeyDown: propTypesExports.func,
-  /**
-   * The variant to use. Use `menu` to prevent selected items from impacting the initial focus
-   * and the vertical alignment relative to the anchor element.
-   * @default 'selectedMenu'
-   */
-  variant: propTypesExports.oneOf(['menu', 'selectedMenu'])
-} : void 0;
-var MenuList$1 = MenuList;
-
-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$8 = 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$1({
-    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$1({
-    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__*/React.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$1({}, props, {
-    component,
-    elevation,
-    square,
-    variant
-  });
-  const classes = useUtilityClasses$8(ownerState);
-  if (process.env.NODE_ENV !== 'production') {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    const theme = useTheme();
-    if (theme.shadows[elevation] === undefined) {
-      console.error([`MUI: The elevation provided <Paper elevation={${elevation}}> is not available in the theme.`, `Please make sure that \`theme.shadows[${elevation}]\` is defined.`].join('\n'));
-    }
-  }
-  return /*#__PURE__*/jsxRuntimeExports.jsx(PaperRoot, _extends$1({
-    as: component,
-    ownerState: ownerState,
-    className: clsx(classes.root, className),
-    ref: ref
-  }, other));
-});
-process.env.NODE_ENV !== "production" ? Paper.propTypes /* remove-proptypes */ = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit the d.ts file and run "yarn proptypes"     |
-  // ----------------------------------------------------------------------
-  /**
-   * The content of the component.
-   */
-  children: propTypesExports.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: propTypesExports.object,
-  /**
-   * @ignore
-   */
-  className: propTypesExports.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: propTypesExports.elementType,
-  /**
-   * Shadow depth, corresponds to `dp` in the spec.
-   * It accepts values between 0 and 24 inclusive.
-   * @default 1
-   */
-  elevation: chainPropTypes(integerPropType, props => {
-    const {
-      elevation,
-      variant
-    } = props;
-    if (elevation > 0 && variant === 'outlined') {
-      return new Error(`MUI: Combining \`elevation={${elevation}}\` with \`variant="${variant}"\` has no effect. Either use \`elevation={0}\` or use a different \`variant\`.`);
-    }
-    return null;
-  }),
-  /**
-   * If `true`, rounded corners are disabled.
+   * If `true`, will allow focus on disabled items.
    * @default false
    */
-  square: propTypesExports.bool,
+  disabledItemsFocusable: propTypesExports.bool,
   /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
+   * If `true`, the menu items will not wrap focus.
+   * @default false
    */
-  sx: propTypesExports.oneOfType([propTypesExports.arrayOf(propTypesExports.oneOfType([propTypesExports.func, propTypesExports.object, propTypesExports.bool])), propTypesExports.func, propTypesExports.object]),
+  disableListWrap: propTypesExports.bool,
   /**
-   * The variant to use.
-   * @default 'elevation'
+   * @ignore
    */
-  variant: propTypesExports /* @typescript-to-proptypes-ignore */.oneOfType([propTypesExports.oneOf(['elevation', 'outlined']), propTypesExports.string])
+  onKeyDown: propTypesExports.func,
+  /**
+   * The variant to use. Use `menu` to prevent selected items from impacting the initial focus
+   * and the vertical alignment relative to the anchor element.
+   * @default 'selectedMenu'
+   */
+  variant: propTypesExports.oneOf(['menu', 'selectedMenu'])
 } : void 0;
-var Paper$1 = Paper;
-
-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;
-}
+var MenuList$1 = MenuList;
 
 function _setPrototypeOf(o, p) {
   _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
@@ -11462,7 +11547,7 @@ function getTransitionProps(props, options) {
   };
 }
 
-const _excluded$c = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
+const _excluded$g = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
 function getScale(value) {
   return `scale(${value}, ${value ** 2})`;
 }
@@ -11506,7 +11591,7 @@ const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
       // eslint-disable-next-line react/prop-types
       TransitionComponent = Transition$1
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$c);
+    other = _objectWithoutPropertiesLoose(props, _excluded$g);
   const timer = React.useRef();
   const autoTimeout = React.useRef();
   const theme = useTheme();
@@ -11608,7 +11693,7 @@ const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
       clearTimeout(timer.current);
     };
   }, []);
-  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends({
     appear: appear,
     in: inProp,
     nodeRef: nodeRef,
@@ -11622,8 +11707,8 @@ const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
     timeout: timeout === 'auto' ? null : timeout
   }, other, {
     children: (state, childProps) => {
-      return /*#__PURE__*/React.cloneElement(children, _extends$1({
-        style: _extends$1({
+      return /*#__PURE__*/React.cloneElement(children, _extends({
+        style: _extends({
           opacity: 0,
           transform: getScale(0.75),
           visibility: state === 'exited' && !inProp ? 'hidden' : undefined
@@ -11710,7 +11795,7 @@ process.env.NODE_ENV !== "production" ? Grow.propTypes /* remove-proptypes */ =
 Grow.muiSupportAuto = true;
 var Grow$1 = Grow;
 
-const _excluded$b = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
+const _excluded$f = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
 const styles = {
   entering: {
     opacity: 1
@@ -11747,7 +11832,7 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
       // eslint-disable-next-line react/prop-types
       TransitionComponent = Transition$1
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$b);
+    other = _objectWithoutPropertiesLoose(props, _excluded$f);
   const nodeRef = React.useRef(null);
   const handleRef = useForkRef(nodeRef, children.ref, ref);
   const normalizedTransitionCallback = callback => maybeIsAppearing => {
@@ -11802,7 +11887,7 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
       addEndListener(nodeRef.current, next);
     }
   };
-  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends({
     appear: appear,
     in: inProp,
     nodeRef: nodeRef ,
@@ -11816,8 +11901,8 @@ const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
     timeout: timeout
   }, other, {
     children: (state, childProps) => {
-      return /*#__PURE__*/React.cloneElement(children, _extends$1({
-        style: _extends$1({
+      return /*#__PURE__*/React.cloneElement(children, _extends({
+        style: _extends({
           opacity: 0,
           visibility: state === 'exited' && !inProp ? 'hidden' : undefined
         }, styles[state], style, children.props.style),
@@ -11908,8 +11993,8 @@ function getBackdropUtilityClass(slot) {
 }
 generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);
 
-const _excluded$a = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
-const useUtilityClasses$7 = ownerState => {
+const _excluded$e = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
+const useUtilityClasses$8 = ownerState => {
   const {
     classes,
     invisible
@@ -11930,7 +12015,7 @@ const BackdropRoot = styled$1('div', {
   }
 })(({
   ownerState
-}) => _extends$1({
+}) => _extends({
   position: 'fixed',
   display: 'flex',
   alignItems: 'center',
@@ -11963,23 +12048,23 @@ const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
       TransitionComponent = Fade$1,
       transitionDuration
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$a);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$e);
+  const ownerState = _extends({}, props, {
     component,
     invisible
   });
-  const classes = useUtilityClasses$7(ownerState);
+  const classes = useUtilityClasses$8(ownerState);
   const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
-  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends({
     in: open,
     timeout: transitionDuration
   }, other, {
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(BackdropRoot, _extends$1({
+    children: /*#__PURE__*/jsxRuntimeExports.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$1({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
+      ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
       classes: classes,
       ref: ref,
       children: children
@@ -12084,7 +12169,7 @@ process.env.NODE_ENV !== "production" ? Backdrop.propTypes /* remove-proptypes *
 } : void 0;
 var Backdrop$1 = Backdrop;
 
-const _excluded$9 = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "open", "slotProps", "slots", "theme"];
+const _excluded$d = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "open", "slotProps", "slots", "theme"];
 const ModalRoot = styled$1('div', {
   name: 'MuiModal',
   slot: 'Root',
@@ -12097,7 +12182,7 @@ const ModalRoot = styled$1('div', {
 })(({
   theme,
   ownerState
-}) => _extends$1({
+}) => _extends({
   position: 'fixed',
   zIndex: (theme.vars || theme).zIndex.modal,
   right: 0,
@@ -12163,7 +12248,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
       // eslint-disable-next-line react/prop-types
       theme
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$9);
+    other = _objectWithoutPropertiesLoose(props, _excluded$d);
   const [exited, setExited] = React.useState(true);
   const commonProps = {
     container,
@@ -12180,26 +12265,26 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
     onClose,
     open
   };
-  const ownerState = _extends$1({}, props, commonProps, {
+  const ownerState = _extends({}, props, commonProps, {
     exited
   });
   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__*/jsxRuntimeExports.jsx(ModalUnstyled, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(ModalUnstyled, _extends({
     slots: {
       root: RootSlot,
       backdrop: BackdropSlot
     },
     slotProps: {
-      root: () => _extends$1({}, resolveComponentProps(rootSlotProps, ownerState), !isHostComponent(RootSlot) && {
+      root: () => _extends({}, resolveComponentProps(rootSlotProps, ownerState), !isHostComponent(RootSlot) && {
         as: component,
         theme
       }, {
         className: clsx(className, rootSlotProps == null ? void 0 : rootSlotProps.className, classes == null ? void 0 : classes.root, !ownerState.open && ownerState.exited && (classes == null ? void 0 : classes.hidden))
       }),
-      backdrop: () => _extends$1({}, BackdropProps, resolveComponentProps(backdropSlotProps, ownerState), {
+      backdrop: () => _extends({}, BackdropProps, resolveComponentProps(backdropSlotProps, ownerState), {
         className: clsx(backdropSlotProps == null ? void 0 : backdropSlotProps.className, BackdropProps == null ? void 0 : BackdropProps.className, classes == null ? void 0 : classes.backdrop)
       })
     },
@@ -12382,13 +12467,150 @@ process.env.NODE_ENV !== "production" ? Modal.propTypes /* remove-proptypes */ =
 } : void 0;
 var Modal$1 = Modal;
 
+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$c = ["className", "component", "elevation", "square", "variant"];
+const useUtilityClasses$7 = 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__*/React.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(props, _excluded$c);
+  const ownerState = _extends({}, props, {
+    component,
+    elevation,
+    square,
+    variant
+  });
+  const classes = useUtilityClasses$7(ownerState);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const theme = useTheme();
+    if (theme.shadows[elevation] === undefined) {
+      console.error([`MUI: The elevation provided <Paper elevation={${elevation}}> is not available in the theme.`, `Please make sure that \`theme.shadows[${elevation}]\` is defined.`].join('\n'));
+    }
+  }
+  return /*#__PURE__*/jsxRuntimeExports.jsx(PaperRoot, _extends({
+    as: component,
+    ownerState: ownerState,
+    className: clsx(classes.root, className),
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Paper.propTypes /* remove-proptypes */ = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the component.
+   */
+  children: propTypesExports.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: propTypesExports.object,
+  /**
+   * @ignore
+   */
+  className: propTypesExports.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: propTypesExports.elementType,
+  /**
+   * Shadow depth, corresponds to `dp` in the spec.
+   * It accepts values between 0 and 24 inclusive.
+   * @default 1
+   */
+  elevation: chainPropTypes(integerPropType, props => {
+    const {
+      elevation,
+      variant
+    } = props;
+    if (elevation > 0 && variant === 'outlined') {
+      return new Error(`MUI: Combining \`elevation={${elevation}}\` with \`variant="${variant}"\` has no effect. Either use \`elevation={0}\` or use a different \`variant\`.`);
+    }
+    return null;
+  }),
+  /**
+   * If `true`, rounded corners are disabled.
+   * @default false
+   */
+  square: propTypesExports.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: propTypesExports.oneOfType([propTypesExports.arrayOf(propTypesExports.oneOfType([propTypesExports.func, propTypesExports.object, propTypesExports.bool])), propTypesExports.func, propTypesExports.object]),
+  /**
+   * The variant to use.
+   * @default 'elevation'
+   */
+  variant: propTypesExports /* @typescript-to-proptypes-ignore */.oneOfType([propTypesExports.oneOf(['elevation', 'outlined']), propTypesExports.string])
+} : void 0;
+var PaperBase = Paper;
+
 function getPopoverUtilityClass(slot) {
   return generateUtilityClass('MuiPopover', slot);
 }
 generateUtilityClasses('MuiPopover', ['root', 'paper']);
 
-const _excluded$8 = ["onEntering"],
-  _excluded2$2 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"];
+const _excluded$b = ["onEntering"],
+  _excluded2$1 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "slots", "slotProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps"],
+  _excluded3 = ["slotProps"];
 function getOffsetTop(rect, vertical) {
   let offset = 0;
   if (typeof vertical === 'number') {
@@ -12432,7 +12654,7 @@ const PopoverRoot = styled$1(Modal$1, {
   slot: 'Root',
   overridesResolver: (props, styles) => styles.root
 })({});
-const PopoverPaper = styled$1(Paper$1, {
+const PopoverPaper = styled$1(PaperBase, {
   name: 'MuiPopover',
   slot: 'Paper',
   overridesResolver: (props, styles) => styles.paper
@@ -12450,6 +12672,7 @@ const PopoverPaper = styled$1(Paper$1, {
   outline: 0
 });
 const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
+  var _slotProps$paper, _slots$root, _slots$paper;
   const props = useThemeProps({
     props: inProps,
     name: 'MuiPopover'
@@ -12469,7 +12692,9 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
       elevation = 8,
       marginThreshold = 16,
       open,
-      PaperProps = {},
+      PaperProps: PaperPropsProp = {},
+      slots,
+      slotProps,
       transformOrigin = {
         vertical: 'top',
         horizontal: 'left'
@@ -12480,16 +12705,17 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
         onEntering
       } = {}
     } = props,
-    TransitionProps = _objectWithoutPropertiesLoose$2(props.TransitionProps, _excluded$8),
-    other = _objectWithoutPropertiesLoose$2(props, _excluded2$2);
+    TransitionProps = _objectWithoutPropertiesLoose(props.TransitionProps, _excluded$b),
+    other = _objectWithoutPropertiesLoose(props, _excluded2$1);
+  const externalPaperSlotProps = (_slotProps$paper = slotProps == null ? void 0 : slotProps.paper) != null ? _slotProps$paper : PaperPropsProp;
   const paperRef = React.useRef();
-  const handlePaperRef = useForkRef(paperRef, PaperProps.ref);
-  const ownerState = _extends$1({}, props, {
+  const handlePaperRef = useForkRef(paperRef, externalPaperSlotProps.ref);
+  const ownerState = _extends({}, props, {
     anchorOrigin,
     anchorReference,
     elevation,
     marginThreshold,
-    PaperProps,
+    externalPaperSlotProps,
     transformOrigin,
     TransitionComponent,
     transitionDuration: transitionDurationProp,
@@ -12654,34 +12880,54 @@ const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
   // 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__*/jsxRuntimeExports.jsx(PopoverRoot, _extends$1({
-    BackdropProps: {
-      invisible: true
+  const RootSlot = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : PopoverRoot;
+  const PaperSlot = (_slots$paper = slots == null ? void 0 : slots.paper) != null ? _slots$paper : PopoverPaper;
+  const paperProps = useSlotProps({
+    elementType: PaperSlot,
+    externalSlotProps: _extends({}, externalPaperSlotProps, {
+      style: isPositioned ? externalPaperSlotProps.style : _extends({}, externalPaperSlotProps.style, {
+        opacity: 0
+      })
+    }),
+    additionalProps: {
+      elevation,
+      ref: handlePaperRef
     },
-    className: clsx(classes.root, className),
-    container: container,
-    open: open,
-    ref: ref,
-    ownerState: ownerState
-  }, other, {
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends$1({
+    ownerState,
+    className: clsx(classes.paper, externalPaperSlotProps == null ? void 0 : externalPaperSlotProps.className)
+  });
+  const _useSlotProps = useSlotProps({
+      elementType: RootSlot,
+      externalSlotProps: (slotProps == null ? void 0 : slotProps.root) || {},
+      externalForwardedProps: other,
+      additionalProps: {
+        ref,
+        slotProps: {
+          backdrop: {
+            invisible: true
+          }
+        },
+        container,
+        open
+      },
+      ownerState,
+      className: clsx(classes.root, className)
+    }),
+    {
+      slotProps: rootSlotPropsProp
+    } = _useSlotProps,
+    rootProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded3);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(RootSlot, _extends({}, rootProps, !isHostComponent(RootSlot) && {
+    slotProps: rootSlotPropsProp
+  }, {
+    children: /*#__PURE__*/jsxRuntimeExports.jsx(TransitionComponent, _extends({
       appear: true,
       in: open,
       onEntering: handleEntering,
       onExited: handleExited,
       timeout: transitionDuration
     }, TransitionProps, {
-      children: /*#__PURE__*/jsxRuntimeExports.jsx(PopoverPaper, _extends$1({
-        elevation: elevation
-      }, PaperProps, {
-        ref: handlePaperRef,
-        className: clsx(classes.paper, PaperProps.className)
-      }, isPositioned ? undefined : {
-        style: _extends$1({}, PaperProps.style, {
-          opacity: 0
-        })
-      }, {
-        ownerState: ownerState,
+      children: /*#__PURE__*/jsxRuntimeExports.jsx(PaperSlot, _extends({}, paperProps, {
         children: children
       }))
     }))
@@ -12787,11 +13033,34 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */
   open: propTypesExports.bool.isRequired,
   /**
    * Props applied to the [`Paper`](/material-ui/api/paper/) element.
+   *
+   * This prop is an alias for `slotProps.paper` and will be overriden by it if both are used.
+   * @deprecated Use `slotProps.paper` instead.
+   *
    * @default {}
    */
   PaperProps: propTypesExports /* @typescript-to-proptypes-ignore */.shape({
     component: elementTypeAcceptingRef$1
   }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * @default {}
+   */
+  slotProps: propTypesExports.shape({
+    paper: propTypesExports.oneOfType([propTypesExports.func, propTypesExports.object]),
+    root: propTypesExports.oneOfType([propTypesExports.func, propTypesExports.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * @default {}
+   */
+  slots: propTypesExports.shape({
+    paper: propTypesExports.elementType,
+    root: propTypesExports.elementType
+  }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
@@ -12841,8 +13110,8 @@ function getMenuUtilityClass(slot) {
 }
 generateUtilityClasses('MuiMenu', ['root', 'paper', 'list']);
 
-const _excluded$7 = ["onEntering"],
-  _excluded2$1 = ["autoFocus", "children", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant"];
+const _excluded$a = ["onEntering"],
+  _excluded2 = ["autoFocus", "children", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant"];
 const RTL_ORIGIN = {
   vertical: 'top',
   horizontal: 'right'
@@ -12868,7 +13137,7 @@ const MenuRoot = styled$1(Popover$1, {
   slot: 'Root',
   overridesResolver: (props, styles) => styles.root
 })({});
-const MenuPaper = styled$1(Paper$1, {
+const MenuPaper = styled$1(PopoverPaper, {
   name: 'MuiMenu',
   slot: 'Paper',
   overridesResolver: (props, styles) => styles.paper
@@ -12908,11 +13177,11 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       } = {},
       variant = 'selectedMenu'
     } = props,
-    TransitionProps = _objectWithoutPropertiesLoose$2(props.TransitionProps, _excluded$7),
-    other = _objectWithoutPropertiesLoose$2(props, _excluded2$1);
+    TransitionProps = _objectWithoutPropertiesLoose(props.TransitionProps, _excluded$a),
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
   const theme = useTheme();
   const isRtl = theme.direction === 'rtl';
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     autoFocus,
     disableAutoFocusItem,
     MenuListProps,
@@ -12968,31 +13237,34 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       }
     }
   });
-  return /*#__PURE__*/jsxRuntimeExports.jsx(MenuRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsx(MenuRoot, _extends({
     onClose: onClose,
     anchorOrigin: {
       vertical: 'bottom',
       horizontal: isRtl ? 'right' : 'left'
     },
     transformOrigin: isRtl ? RTL_ORIGIN : LTR_ORIGIN,
-    PaperProps: _extends$1({
-      as: MenuPaper
-    }, PaperProps, {
-      classes: _extends$1({}, PaperProps.classes, {
-        root: classes.paper
+    slots: {
+      paper: MenuPaper
+    },
+    slotProps: {
+      paper: _extends({}, PaperProps, {
+        classes: _extends({}, PaperProps.classes, {
+          root: classes.paper
+        })
       })
-    }),
+    },
     className: classes.root,
     open: open,
     ref: ref,
     transitionDuration: transitionDuration,
-    TransitionProps: _extends$1({
+    TransitionProps: _extends({
       onEntering: handleEntering
     }, TransitionProps),
     ownerState: ownerState
   }, other, {
     classes: PopoverClasses,
-    children: /*#__PURE__*/jsxRuntimeExports.jsx(MenuMenuList, _extends$1({
+    children: /*#__PURE__*/jsxRuntimeExports.jsx(MenuMenuList, _extends({
       onKeyDown: handleListKeyDown,
       actions: menuListActionsRef,
       autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem),
@@ -13095,7 +13367,7 @@ function getNativeSelectUtilityClasses(slot) {
 const nativeSelectClasses = generateUtilityClasses('MuiNativeSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput', 'error']);
 var nativeSelectClasses$1 = nativeSelectClasses;
 
-const _excluded$6 = ["className", "disabled", "error", "IconComponent", "inputRef", "variant"];
+const _excluded$9 = ["className", "disabled", "error", "IconComponent", "inputRef", "variant"];
 const useUtilityClasses$4 = ownerState => {
   const {
     classes,
@@ -13114,7 +13386,7 @@ const useUtilityClasses$4 = ownerState => {
 const nativeSelectSelectStyles = ({
   ownerState,
   theme
-}) => _extends$1({
+}) => _extends({
   MozAppearance: 'none',
   // Reset
   WebkitAppearance: 'none',
@@ -13125,7 +13397,7 @@ const nativeSelectSelectStyles = ({
   borderRadius: 0,
   // Reset
   cursor: 'pointer',
-  '&:focus': _extends$1({}, theme.vars ? {
+  '&: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)'
@@ -13181,7 +13453,7 @@ const NativeSelectSelect = styled$1('select', {
 const nativeSelectIconStyles = ({
   ownerState,
   theme
-}) => _extends$1({
+}) => _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',
@@ -13224,15 +13496,15 @@ const NativeSelectInput = /*#__PURE__*/React.forwardRef(function NativeSelectInp
       inputRef,
       variant = 'standard'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$6);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$9);
+  const ownerState = _extends({}, props, {
     disabled,
     variant,
     error
   });
   const classes = useUtilityClasses$4(ownerState);
   return /*#__PURE__*/jsxRuntimeExports.jsxs(React.Fragment, {
-    children: [/*#__PURE__*/jsxRuntimeExports.jsx(NativeSelectSelect, _extends$1({
+    children: [/*#__PURE__*/jsxRuntimeExports.jsx(NativeSelectSelect, _extends({
       ownerState: ownerState,
       className: clsx(classes.select, className),
       disabled: disabled,
@@ -13309,7 +13581,7 @@ const selectClasses = generateUtilityClasses('MuiSelect', ['select', 'multiple',
 var selectClasses$1 = selectClasses;
 
 var _span;
-const _excluded$5 = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "error", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
+const _excluded$8 = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "error", "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',
@@ -13431,7 +13703,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       value: valueProp,
       variant = 'standard'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$5);
+    other = _objectWithoutPropertiesLoose(props, _excluded$8);
   const [value, setValueState] = useControlled({
     controlled: valueProp,
     default: defaultValue,
@@ -13713,7 +13985,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     tabIndex = disabled ? null : 0;
   }
   const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     variant,
     value,
     open,
@@ -13721,7 +13993,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   });
   const classes = useUtilityClasses$3(ownerState);
   return /*#__PURE__*/jsxRuntimeExports.jsxs(React.Fragment, {
-    children: [/*#__PURE__*/jsxRuntimeExports.jsx(SelectSelect, _extends$1({
+    children: [/*#__PURE__*/jsxRuntimeExports.jsx(SelectSelect, _extends({
       ref: handleDisplayRef,
       tabIndex: tabIndex,
       role: "button",
@@ -13746,7 +14018,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         className: "notranslate",
         children: "\u200B"
       })) : display
-    })), /*#__PURE__*/jsxRuntimeExports.jsx(SelectNativeInput, _extends$1({
+    })), /*#__PURE__*/jsxRuntimeExports.jsx(SelectNativeInput, _extends({
       "aria-invalid": error,
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,
@@ -13762,7 +14034,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       as: IconComponent,
       className: classes.icon,
       ownerState: ownerState
-    }), /*#__PURE__*/jsxRuntimeExports.jsx(Menu$1, _extends$1({
+    }), /*#__PURE__*/jsxRuntimeExports.jsx(Menu$1, _extends({
       id: `menu-${name || ''}`,
       anchorEl: anchorElement,
       open: open,
@@ -13776,13 +14048,13 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         horizontal: 'center'
       }
     }, MenuProps, {
-      MenuListProps: _extends$1({
+      MenuListProps: _extends({
         'aria-labelledby': labelId,
         role: 'listbox',
         disableListWrap: true
       }, MenuProps.MenuListProps),
-      PaperProps: _extends$1({}, MenuProps.PaperProps, {
-        style: _extends$1({
+      PaperProps: _extends({}, MenuProps.PaperProps, {
+        style: _extends({
           minWidth: menuMinWidth
         }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
       }),
@@ -13942,7 +14214,7 @@ function getSvgIconUtilityClass(slot) {
 }
 generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
 
-const _excluded$4 = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
+const _excluded$7 = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
 const useUtilityClasses$2 = ownerState => {
   const {
     color,
@@ -14008,8 +14280,8 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
       titleAccess,
       viewBox = '0 0 24 24'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$4);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$7);
+  const ownerState = _extends({}, props, {
     color,
     component,
     fontSize,
@@ -14022,7 +14294,7 @@ const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
     more.viewBox = viewBox;
   }
   const classes = useUtilityClasses$2(ownerState);
-  return /*#__PURE__*/jsxRuntimeExports.jsxs(SvgIconRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsxs(SvgIconRoot, _extends({
     as: component,
     className: clsx(classes.root, className),
     focusable: "false",
@@ -14114,7 +14386,7 @@ var SvgIcon$1 = SvgIcon;
 
 function createSvgIcon(path, displayName) {
   function Component(props, ref) {
-    return /*#__PURE__*/jsxRuntimeExports.jsx(SvgIcon$1, _extends$1({
+    return /*#__PURE__*/jsxRuntimeExports.jsx(SvgIcon$1, _extends({
       "data-testid": `${displayName}Icon`,
       ref: ref
     }, props, {
@@ -14134,7 +14406,7 @@ var ArrowDropDownIcon = createSvgIcon( /*#__PURE__*/jsxRuntimeExports.jsx("path"
   d: "M7 10l5 5 5-5z"
 }), 'ArrowDropDown');
 
-const _excluded$3 = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
+const _excluded$6 = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"];
 const useUtilityClasses$1 = ownerState => {
   const {
     classes
@@ -14178,7 +14450,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
       SelectDisplayProps,
       variant: variantProp = 'outlined'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$3);
+    other = _objectWithoutPropertiesLoose(props, _excluded$6);
   const inputComponent = native ? NativeSelectInput$1 : SelectInput$1;
   const muiFormControl = useFormControl();
   const fcs = formControlState({
@@ -14187,7 +14459,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     states: ['variant', 'error']
   });
   const variant = fcs.variant || variantProp;
-  const ownerState = _extends$1({}, props, {
+  const ownerState = _extends({}, props, {
     variant,
     classes: classesProp
   });
@@ -14206,11 +14478,11 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   }[variant];
   const inputComponentRef = useForkRef(ref, InputComponent.ref);
   return /*#__PURE__*/jsxRuntimeExports.jsx(React.Fragment, {
-    children: /*#__PURE__*/React.cloneElement(InputComponent, _extends$1({
+    children: /*#__PURE__*/React.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$1({
+      inputProps: _extends({
         children,
         error: fcs.error,
         IconComponent,
@@ -14230,7 +14502,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
         onOpen,
         open,
         renderValue,
-        SelectDisplayProps: _extends$1({
+        SelectDisplayProps: _extends({
           id
         }, SelectDisplayProps)
       }, inputProps, {
@@ -14401,7 +14673,7 @@ function getTextFieldUtilityClass(slot) {
 }
 generateUtilityClasses('MuiTextField', ['root']);
 
-const _excluded$2 = ["autoComplete", "autoFocus", "children", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "placeholder", "required", "rows", "select", "SelectProps", "type", "value", "variant"];
+const _excluded$5 = ["autoComplete", "autoFocus", "children", "className", "color", "defaultValue", "disabled", "error", "FormHelperTextProps", "fullWidth", "helperText", "id", "InputLabelProps", "inputProps", "InputProps", "inputRef", "label", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "placeholder", "required", "rows", "select", "SelectProps", "type", "value", "variant"];
 const variantComponent = {
   standard: Input$1,
   filled: FilledInput$1,
@@ -14494,8 +14766,8 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
       value,
       variant = 'outlined'
     } = props,
-    other = _objectWithoutPropertiesLoose$2(props, _excluded$2);
-  const ownerState = _extends$1({}, props, {
+    other = _objectWithoutPropertiesLoose(props, _excluded$5);
+  const ownerState = _extends({}, props, {
     autoFocus,
     color,
     disabled,
@@ -14530,7 +14802,7 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
   const helperTextId = helperText && id ? `${id}-helper-text` : undefined;
   const inputLabelId = label && id ? `${id}-label` : undefined;
   const InputComponent = variantComponent[variant];
-  const InputElement = /*#__PURE__*/jsxRuntimeExports.jsx(InputComponent, _extends$1({
+  const InputElement = /*#__PURE__*/jsxRuntimeExports.jsx(InputComponent, _extends({
     "aria-describedby": helperTextId,
     autoComplete: autoComplete,
     autoFocus: autoFocus,
@@ -14552,7 +14824,7 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
     placeholder: placeholder,
     inputProps: inputProps
   }, InputMore, InputProps));
-  return /*#__PURE__*/jsxRuntimeExports.jsxs(TextFieldRoot, _extends$1({
+  return /*#__PURE__*/jsxRuntimeExports.jsxs(TextFieldRoot, _extends({
     className: clsx(classes.root, className),
     disabled: disabled,
     error: error,
@@ -14563,12 +14835,12 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
     variant: variant,
     ownerState: ownerState
   }, other, {
-    children: [label != null && label !== '' && /*#__PURE__*/jsxRuntimeExports.jsx(InputLabel$1, _extends$1({
+    children: [label != null && label !== '' && /*#__PURE__*/jsxRuntimeExports.jsx(InputLabel$1, _extends({
       htmlFor: id,
       id: inputLabelId
     }, InputLabelProps, {
       children: label
-    })), select ? /*#__PURE__*/jsxRuntimeExports.jsx(Select$1, _extends$1({
+    })), select ? /*#__PURE__*/jsxRuntimeExports.jsx(Select$1, _extends({
       "aria-describedby": helperTextId,
       id: id,
       labelId: inputLabelId,
@@ -14576,7 +14848,7 @@ const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref)
       input: InputElement
     }, SelectProps, {
       children: children
-    })) : InputElement, helperText && /*#__PURE__*/jsxRuntimeExports.jsx(FormHelperText$1, _extends$1({
+    })) : InputElement, helperText && /*#__PURE__*/jsxRuntimeExports.jsx(FormHelperText$1, _extends({
       id: helperTextId
     }, FormHelperTextProps, {
       children: helperText
@@ -15040,14 +15312,14 @@ const StyledDataGrid = styled$3.div`
   width: 100%;
 
   .MuiDataGrid-root {
-    font-family: var(--redsift-typography-datagrid-font-family);
+    font-family: var(--redsift-typography-datagrid-header-font-family);
     border: none;
   }
 
   .MuiDataGrid-row {
-    font-family: var(--redsift-typography-datagrid-row-font-family);
-    font-size: var(--redsift-typography-datagrid-row-font-size);
-    font-weight: var(--redsift-typography-datagrid-row-font-weight);
+    font-family: var(--redsift-typography-datagrid-cell-font-family);
+    font-size: var(--redsift-typography-datagrid-cell-font-size);
+    font-weight: var(--redsift-typography-datagrid-cell-font-weight);
   }
 
   .MuiDataGrid-columnHeaderTitle {
@@ -15066,14 +15338,14 @@ const StyledDataGrid = styled$3.div`
 
   .MuiTablePagination-root {
     .MuiTablePagination-selectLabel {
-      font-family: var(--redsift-typography-datagrid-font-family);
+      font-family: var(--redsift-typography-datagrid-header-font-family);
     }
     .MuiTablePagination-displayedRows {
-      font-family: var(--redsift-typography-datagrid-row-font-family);
+      font-family: var(--redsift-typography-datagrid-cell-font-family);
     }
 
     .MuiInputBase-root {
-      font-family: var(--redsift-typography-datagrid-row-font-family);
+      font-family: var(--redsift-typography-datagrid-cell-font-family);
     }
   }
 
@@ -15082,15 +15354,15 @@ const StyledDataGrid = styled$3.div`
   }
 
   .MuiDataGrid-rowCount {
-    font-family: var(--redsift-typography-datagrid-row-font-family);
+    font-family: var(--redsift-typography-datagrid-cell-font-family);
   }
 
   .MuiTablePagination-displayedRows {
-    font-family: var(--redsift-typography-datagrid-row-font-family);
+    font-family: var(--redsift-typography-datagrid-cell-font-family);
   }
 
   .MuiBadge-standard {
-    font-family: var(--redsift-typography-datagrid-row-font-family);
+    font-family: var(--redsift-typography-datagrid-cell-font-family);
   }
 `;
 
@@ -15129,13 +15401,13 @@ const Toolbar = props => {
     densityButtonProps,
     densityButtonRef
   } = props;
-  return /*#__PURE__*/React__default.createElement(GridToolbarWrapper, null, /*#__PURE__*/React__default.createElement(GridToolbarContainer, null, /*#__PURE__*/React__default.createElement(Flexbox, null, hasFilterButton ? /*#__PURE__*/React__default.createElement(GridToolbarFilterButton, _extends$3({}, filterButtonProps, {
+  return /*#__PURE__*/React__default.createElement(GridToolbarWrapper, null, /*#__PURE__*/React__default.createElement(GridToolbarContainer, null, /*#__PURE__*/React__default.createElement(Flexbox, null, hasFilterButton ? /*#__PURE__*/React__default.createElement(GridToolbarFilterButton, _extends$2({}, filterButtonProps, {
     ref: filterButtonRef
-  })) : null, hasColumnsButton ? /*#__PURE__*/React__default.createElement(GridToolbarColumnsButton, _extends$3({}, columnsButtonProps, {
+  })) : null, hasColumnsButton ? /*#__PURE__*/React__default.createElement(GridToolbarColumnsButton, _extends$2({}, columnsButtonProps, {
     ref: columnsButtonRef
-  })) : null, hasDensityButton ? /*#__PURE__*/React__default.createElement(GridToolbarDensitySelector, _extends$3({}, densityButtonProps, {
+  })) : null, hasDensityButton ? /*#__PURE__*/React__default.createElement(GridToolbarDensitySelector, _extends$2({}, densityButtonProps, {
     ref: densityButtonRef
-  })) : null, hasExportButton ? /*#__PURE__*/React__default.createElement(GridToolbarExport, _extends$3({
+  })) : null, hasExportButton ? /*#__PURE__*/React__default.createElement(GridToolbarExport, _extends$2({
     csvOptions: {
       allColumns: true,
       fileName: 'csv',
@@ -15154,35 +15426,76 @@ const Toolbar = props => {
   })) : null)));
 };
 
-const _excluded$1 = ["className", "filterModel", "hideToolbar", "height", "license", "onFilterModelChange", "rows"],
-  _excluded2 = ["onClick"],
-  _excluded3 = ["checked", "indeterminate", "disabled", "onChange"];
+const _excluded$4 = ["displayName", "fontSize"];
+const muiIconToDSIcon = {
+  ColumnFilteredIcon: mdiFilterVariant,
+  ColumnSelectorIcon: mdiViewColumn,
+  ColumnSortedAscendingIcon: mdiChevronUp,
+  ColumnSortedDescendingIcon: mdiChevronDown,
+  DensityCompactIcon: mdiViewHeadline,
+  DensityStandardIcon: mdiViewSequential,
+  DensityComfortableIcon: mdiViewStream,
+  DetailPanelCollapseIcon: mdiChevronDown,
+  DetailPanelExpandIcon: mdiChevronRight,
+  ExportIcon: mdiTrayArrowDown,
+  OpenFilterButtonIcon: mdiFilterVariant
+};
+const BaseIcon = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      displayName,
+      fontSize = 'small'
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded$4);
+  return /*#__PURE__*/React__default.createElement(Icon, _extends$2({}, forwardedProps, forwardedProps.inputProps, {
+    ref: ref,
+    size: fontSize,
+    icon: muiIconToDSIcon[displayName]
+  }));
+});
+
+const _excluded$3 = ["children", "onClick", "startIcon"];
+const BaseButton = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      children,
+      onClick,
+      startIcon
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded$3);
+  return /*#__PURE__*/React__default.createElement(Button, _extends$2({}, forwardedProps, {
+    onPress: onClick,
+    ref: ref,
+    variant: "unstyled",
+    size: "small",
+    isActive: props['aria-expanded'] === 'true'
+  }), startIcon, children);
+});
+
+const _excluded$2 = ["checked", "indeterminate", "disabled", "onChange"];
+const BaseCheckbox = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+      checked,
+      indeterminate,
+      disabled,
+      onChange
+    } = props,
+    forwardedProps = _objectWithoutProperties(props, _excluded$2);
+  return /*#__PURE__*/React__default.createElement(Checkbox, _extends$2({}, forwardedProps, forwardedProps.inputProps, {
+    isSelected: checked && !indeterminate,
+    isColored: false,
+    isDisabled: disabled,
+    isIndeterminate: indeterminate,
+    ref: ref,
+    onChange: (isChecked, value, name, event) => onChange(event)
+  }));
+});
+
+const _excluded$1 = ["className", "filterModel", "hideToolbar", "height", "license", "onFilterModelChange", "rows"];
 const COMPONENT_NAME$1 = 'DataGrid';
 const CLASSNAME$1 = 'redsift-datagrid';
 const DEFAULT_PROPS = {
   license: process.env.MUI_LICENSE_KEY,
   height: '500px'
 };
-const ColumnSortedAscendingIcon = () => /*#__PURE__*/React__default.createElement(Icon, {
-  icon: mdiChevronUp,
-  size: "small"
-});
-const ColumnSortedDescendingIcon = () => /*#__PURE__*/React__default.createElement(Icon, {
-  icon: mdiChevronDown,
-  size: "small"
-});
-const DetailPanelExpandIcon = () => /*#__PURE__*/React__default.createElement(Icon, {
-  icon: mdiChevronRight,
-  size: "small"
-});
-const DetailPanelCollapseIcon = () => /*#__PURE__*/React__default.createElement(Icon, {
-  icon: mdiChevronDown,
-  size: "small"
-});
-const ColumnFilteredIcon = () => /*#__PURE__*/React__default.createElement(Icon, {
-  icon: mdiFilterVariant,
-  size: "small"
-});
 const DataGrid = /*#__PURE__*/forwardRef((props, ref) => {
   var _props$componentsProp;
   const datagridRef = ref || useRef();
@@ -15215,45 +15528,46 @@ const DataGrid = /*#__PURE__*/forwardRef((props, ref) => {
     ref: datagridRef,
     className: classNames(DataGrid.className, className),
     $height: height
-  }, /*#__PURE__*/React__default.createElement(DataGridPro, _extends$3({}, forwardedProps, {
+  }, /*#__PURE__*/React__default.createElement(DataGridPro, _extends$2({}, forwardedProps, {
     rows: rows,
     filterModel: filterModel,
     onFilterModelChange: onFilterModelChange,
     components: _objectSpread2(_objectSpread2({
-      BaseButton: /*#__PURE__*/forwardRef((props, ref) => {
-        const {
-            onClick
-          } = props,
-          forwardedProps = _objectWithoutProperties(props, _excluded2);
-        return /*#__PURE__*/React__default.createElement(Button, _extends$3({}, forwardedProps, {
-          onPress: onClick,
-          ref: ref,
-          variant: "unstyled"
-        }));
-      }),
-      BaseCheckbox: /*#__PURE__*/forwardRef((props, ref) => {
-        const {
-            checked,
-            indeterminate,
-            disabled,
-            onChange
-          } = props,
-          forwardedProps = _objectWithoutProperties(props, _excluded3);
-        return /*#__PURE__*/React__default.createElement(Checkbox, _extends$3({}, forwardedProps, forwardedProps.inputProps, {
-          isSelected: checked && !indeterminate,
-          isColored: false,
-          isDisabled: disabled,
-          isIndeterminate: indeterminate,
-          ref: ref,
-          onChange: (isChecked, value, name, event) => onChange(event)
-        }));
-      }),
-      ColumnFilteredIcon,
-      ColumnSortedAscendingIcon,
-      ColumnSortedDescendingIcon,
-      DetailPanelExpandIcon,
-      DetailPanelCollapseIcon,
-      OpenFilterButtonIcon: ColumnFilteredIcon
+      BaseButton,
+      BaseCheckbox,
+      ColumnFilteredIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "ColumnFilteredIcon"
+      })),
+      ColumnSelectorIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "ColumnSelectorIcon"
+      })),
+      ColumnSortedAscendingIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "ColumnSortedAscendingIcon"
+      })),
+      ColumnSortedDescendingIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "ColumnSortedDescendingIcon"
+      })),
+      DensityCompactIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "DensityCompactIcon"
+      })),
+      DensityStandardIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "DensityStandardIcon"
+      })),
+      DensityComfortableIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "DensityComfortableIcon"
+      })),
+      DetailPanelCollapseIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "DetailPanelCollapseIcon"
+      })),
+      DetailPanelExpandIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "DetailPanelExpandIcon"
+      })),
+      ExportIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "ExportIcon"
+      })),
+      OpenFilterButtonIcon: props => /*#__PURE__*/React__default.createElement(BaseIcon, _extends$2({}, props, {
+        displayName: "OpenFilterButtonIcon"
+      }))
     }, !hideToolbar && {
       Toolbar
     }), props.components),
@@ -15307,7 +15621,7 @@ const TextCell = /*#__PURE__*/forwardRef((props, ref) => {
       shieldVariant
     } = props,
     forwardedProps = _objectWithoutProperties(props, _excluded);
-  return /*#__PURE__*/React__default.createElement(StyledTextCell, _extends$3({}, forwardedProps, {
+  return /*#__PURE__*/React__default.createElement(StyledTextCell, _extends$2({}, forwardedProps, {
     className: classNames(TextCell.className, className),
     ref: textCellRef
   }), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, shieldVariant ? /*#__PURE__*/React__default.createElement(Shield, {