@kwantis-id3/frontend-library 0.14.1 → 0.15.0

package/README.md

@@ -26,6 +26,7 @@ pnpm add @kwantis-id3/frontend-library
 
 Note that the library uses @emotion/styled and @emotion/react as dev dependencies. Installing them in your project may cause conflicts.
 The library however offers its own styled utility, that can be used to create styled components.
+<br><br>
 
 ## Usage
 The library has various components, each one with its own documentation. Please refer to the storybook documentation for more information.
@@ -51,7 +52,7 @@ The following are under development or on our roadmap:
 
 
 You can find various examples of usage in the projects stories.
-
+<br><br>
 ## Theming
 The library internally uses the [emotion](https://emotion.sh/docs/introduction) library for styling. By default, the library uses a default theme, that looks like this:
 
@@ -103,6 +104,115 @@ declare module "@kwantis-id3/frontend-library" {
 }
 ```
 
+### Fetching the theme from an API
+In case you fetch the theme from an API, there are a couple of things you need to do to avoid complications.
+
+#### 1. Handling non-native theme keys
+The library uses the `ThemeColorsObject` interface to define the theme colors. This interface is used to define the default theme, and to extend it with custom properties, as discussed in the previous section.
+
+If you fetch the theme from an API, it is **strongly** advised to use a default theme containing the additional keys, and then override it with the fetched one.
+
+Otherwise, the additional keys in the theme may be `undefined`, and accessing them before the theme has finished fetching will cause an error.
+
+Here's an example on how to do it, using react query, assuming that the theme has been extended with a `newColor` property:
+
+```ts
+import { ThemeContextProvider, ThemeContextProps } from "@kwantis-id3/frontend-library";
+import { useQuery } from "react-query";
+
+const App = () => {
+  const defaultTheme: ThemeContextProps = {
+    colors: {
+      primary: { main: "#cccccc", contrastText: "#cccccc" },
+      secondary: { main: "#cccccc", contrastText: "#cccccc" },
+      tertiary: { main: "#cccccc", contrastText: "#cccccc" },
+      statusOk: { main: "#cccccc", contrastText: "#cccccc" },
+      statusWarning: { main: "#cccccc", contrastText: "#cccccc" },
+      statusCritical: { main: "#cccccc", contrastText: "#cccccc" },
+      statusNeutral: { main: "#cccccc", contrastText: "#cccccc" },
+      newColor: { main: "#cccccc", contrastText: "#cccccc" },
+    }
+  }
+
+  const fetchedTheme = useQuery({
+    queryKey: ["theme"],
+    queryFn: getColors,
+    initialData: defaultTheme,
+  });
+
+  return (
+    <ThemeContextProvider theme={fetchedTheme.data}>
+      {...}
+    </ThemeContextProvider>
+  )
+}
+```
+
+#### 2. Avoiding FOUC
+If you fetch the theme from an API, you may experience a FOUC (Flash Of Unstyled Content) when the theme is being fetched.
+
+This is because the default theme (either being the one native to the library, or a custom one like in the previous section) is applied before the fetched one is ready, and the two may have some differences (especially if your application needs to be deployed on various instances with different themes).
+
+To avoid this, you have 3 possible solutions:
+1. Do not render the application until the theme is ready
+2. Store the theme in the local storage, and use it as the default theme. Please note that this approach will still show the FOUC in the following cases:
+    - The user has never visited the application before
+    - The user has cleared the local storage / is using a different browser or device
+    - The user has visited the application before, but the theme has changed since then
+3. Use the `initialData` property of the `useQuery` hook to pass a default theme, since useQuery automatically caches the queries data. This approach will still show the FOUC in the following cases:
+    - The user has never visited the application before
+    - The user has cleared the local storage / is using a different browser or device
+    - The user has visited the application before, but the theme has changed since then
+
+For case 3, the code remains unchanged from the previous section, so here's an example without react query for case 2:
+
+```ts
+import { ThemeContextProvider, ThemeContextProps } from "@kwantis-id3/frontend-library";
+import React, { useEffect, useState } from "react";
+import axios from "axios";
+
+const App = () => {
+  const defaultTheme: ThemeContextProps = {
+    colors: {
+      primary: { main: "#cccccc", contrastText: "#cccccc" },
+      secondary: { main: "#cccccc", contrastText: "#cccccc" },
+      tertiary: { main: "#cccccc", contrastText: "#cccccc" },
+      statusOk: { main: "#cccccc", contrastText: "#cccccc" },
+      statusWarning: { main: "#cccccc", contrastText: "#cccccc" },
+      statusCritical: { main: "#cccccc", contrastText: "#cccccc" },
+      statusNeutral: { main: "#cccccc", contrastText: "#cccccc" },
+      newColor: { main: "#cccccc", contrastText: "#cccccc" },
+    }
+  }
+
+  const [theme, setTheme] = React.useState(() => { //initialize state with default or localstorage value
+    const localTheme = localStorage.getItem("myStoredTheme");
+    if (localTheme) {
+      return JSON.parse(localTheme) as ThemeContextProps;
+    }
+    return defaultTheme;
+  });
+
+  useEffect(() => {
+    axios.get<ThemeContextProps>("theme")
+    .then((response) => {
+      setTheme(response.data);
+      localStorage.setItem("myStoredTheme", JSON.stringify(response.data));
+    })
+    .catch ((error) => {
+      console.log(error);
+    })
+  }, []);
+
+  return (
+    <ThemeContextProvider theme={theme}>
+      {...}
+    </ThemeContextProvider>
+  )
+}
+
+```
+
 ## The useThemeContext hook
 The library exports a `useThemeContext` hook, that can be used to access the theme object from any component,
 exposing a `ThemeProperties` object.
@@ -131,7 +241,13 @@ const primaryColor = theme.colors.primary.main;
 const primaryColor = theme.getColor("primary");
 ```
 
-Basically, the property `getColor` can recognise if you are passing a key of the theme, and return it’s corresponding object, or if you are passing it a hex string, or a rgb string, and so on.
+Basically, the property `getColor` can be used to:
+- Access the theme colors, in 2 ways:
+  - Access the color directly, if the passed string is a valid key of the `ThemeColorsObject` interface. This is the same as accessing the color directly from the `colors` property, giving you access to the possible custom properties that you may have added to the theme.
+  - Access the color through a path, if the passed string is a valid path of the `ThemeColorsObject` interface. This returns a `Color` object, that has only the `main` and `contrastText` properties, where `main` is the color that you are accessing, and `contrastText` is generated automatically to grant the best readability possible.
+- Generate a valid `Color` object, if the passed string is a valid hex code or css color function
+
+
 
 In the latter case, the contrastText property will automatically be generated to grant the best readability possible.
 
@@ -140,6 +256,9 @@ If the passed string is not a valid color, the function will default to the prim
   const tertiartyColor = theme.getColor("tertiary");
   console.log(tertiaryColor); // { main: "#7dcfb6", contrastText: "#ffffff" }
 
+  const tertiartyTextColor = theme.getColor("tertiary.contrastText");
+  console.log(tertiaryTextColor); // { main: "#ffffff", contrastText: "#000000"}
+
   const fuchsia = theme.getColor("fuchsia");
   console.log(fuchsia); // { main: "fuchsia", contrastText: "#000000" }
 
@@ -152,12 +271,15 @@ If the passed string is not a valid color, the function will default to the prim
 
 ## The Color prop
 Each component that has a **color** prop, accepts a string.
-The string can be a color name, a hex code, or a css color function.
+The string can be a color name, a color path, a hex code, or a css color function.
 
 ```tsx
 // Color name
 <Button color="primary" />
 
+// Color path
+<Button color="primary.contrastText" />
+
 // Hex code
 <Button color="#1d4e89" />
 
@@ -199,5 +321,5 @@ const MyComponent = () => {
   return <StyledDiv $bgColor="red">I'm red!</StyledDiv>;
 };
 ```
-It's important that the props defined this way are prefixed with a `$` sign, to avoid conflicts.
+It's important that the props defined this way are prefixed with a `$` sign, to avoid conflicts with the native HTML props.
 

package/dist/esm/index.js

@@ -6,7 +6,7 @@ import*as e from"react";import t,{useLayoutEffect as u,useContext as n,createEle
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */Re={get exports(){return Ne},set exports(e){Ne=e}},"production"===process.env.NODE_ENV?Re.exports=function(){if(Te)return ke;Te=1;var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,u=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,r=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,a=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,c=e?Symbol.for("react.concurrent_mode"):60111,l=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,f=e?Symbol.for("react.memo"):60115,g=e?Symbol.for("react.lazy"):60116,b=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,m=e?Symbol.for("react.responder"):60118,A=e?Symbol.for("react.scope"):60119;function C(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:switch(e=e.type){case s:case c:case n:case o:case r:case d:return e;default:switch(e=e&&e.$$typeof){case a:case l:case g:case f:case i:return e;default:return p}}case u:return p}}}function v(e){return C(e)===c}return ke.AsyncMode=s,ke.ConcurrentMode=c,ke.ContextConsumer=a,ke.ContextProvider=i,ke.Element=t,ke.ForwardRef=l,ke.Fragment=n,ke.Lazy=g,ke.Memo=f,ke.Portal=u,ke.Profiler=o,ke.StrictMode=r,ke.Suspense=d,ke.isAsyncMode=function(e){return v(e)||C(e)===s},ke.isConcurrentMode=v,ke.isContextConsumer=function(e){return C(e)===a},ke.isContextProvider=function(e){return C(e)===i},ke.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},ke.isForwardRef=function(e){return C(e)===l},ke.isFragment=function(e){return C(e)===n},ke.isLazy=function(e){return C(e)===g},ke.isMemo=function(e){return C(e)===f},ke.isPortal=function(e){return C(e)===u},ke.isProfiler=function(e){return C(e)===o},ke.isStrictMode=function(e){return C(e)===r},ke.isSuspense=function(e){return C(e)===d},ke.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===c||e===o||e===r||e===d||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===g||e.$$typeof===f||e.$$typeof===i||e.$$typeof===a||e.$$typeof===l||e.$$typeof===h||e.$$typeof===m||e.$$typeof===A||e.$$typeof===b)},ke.typeOf=C,ke}():Re.exports=(Ve||(Ve=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,u=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,r=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,a=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,c=e?Symbol.for("react.concurrent_mode"):60111,l=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,f=e?Symbol.for("react.memo"):60115,g=e?Symbol.for("react.lazy"):60116,b=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,m=e?Symbol.for("react.responder"):60118,A=e?Symbol.for("react.scope"):60119;function C(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:var b=e.type;switch(b){case s:case c:case n:case o:case r:case d:return b;default:var h=b&&b.$$typeof;switch(h){case a:case l:case g:case f:case i:return h;default:return p}}case u:return p}}}var v=s,E=c,y=a,I=i,F=t,B=l,x=n,D=g,w=f,G=u,O=o,T=r,N=d,k=!1;function V(e){return C(e)===c}Se.AsyncMode=v,Se.ConcurrentMode=E,Se.ContextConsumer=y,Se.ContextProvider=I,Se.Element=F,Se.ForwardRef=B,Se.Fragment=x,Se.Lazy=D,Se.Memo=w,Se.Portal=G,Se.Profiler=O,Se.StrictMode=T,Se.Suspense=N,Se.isAsyncMode=function(e){return k||(k=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),V(e)||C(e)===s},Se.isConcurrentMode=V,Se.isContextConsumer=function(e){return C(e)===a},Se.isContextProvider=function(e){return C(e)===i},Se.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Se.isForwardRef=function(e){return C(e)===l},Se.isFragment=function(e){return C(e)===n},Se.isLazy=function(e){return C(e)===g},Se.isMemo=function(e){return C(e)===f},Se.isPortal=function(e){return C(e)===u},Se.isProfiler=function(e){return C(e)===o},Se.isStrictMode=function(e){return C(e)===r},Se.isSuspense=function(e){return C(e)===d},Se.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===c||e===o||e===r||e===d||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===g||e.$$typeof===f||e.$$typeof===i||e.$$typeof===a||e.$$typeof===l||e.$$typeof===h||e.$$typeof===m||e.$$typeof===A||e.$$typeof===b)},Se.typeOf=C}()),Se);var We=Ne,Ze={};Ze[We.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},Ze[We.Memo]={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0};var Xe="undefined"!=typeof document;function Me(e,t,u){var n="";return u.split(" ").forEach((function(u){void 0!==e[u]?t.push(e[u]+";"):n+=u+" "})),n}var Pe=function(e,t,u){var n=e.key+"-"+t.name;(!1===u||!1===Xe&&void 0!==e.compat)&&void 0===e.registered[n]&&(e.registered[n]=t.styles)},He=function(e,t,u){Pe(e,t,u);var n=e.key+"-"+t.name;if(void 0===e.inserted[t.name]){var r="",o=t;do{var i=e.insert(t===o?"."+n:"",o,e.sheet,!0);Xe||void 0===i||(r+=i),o=o.next}while(void 0!==o);if(!Xe&&0!==r.length)return r}};var Le={animationIterationCount:1,borderImageOutset:1,borderImageSlice:1,borderImageWidth:1,boxFlex:1,boxFlexGroup:1,boxOrdinalGroup:1,columnCount:1,columns:1,flex:1,flexGrow:1,flexPositive:1,flexShrink:1,flexNegative:1,flexOrder:1,gridRow:1,gridRowEnd:1,gridRowSpan:1,gridRowStart:1,gridColumn:1,gridColumnEnd:1,gridColumnSpan:1,gridColumnStart:1,msGridRow:1,msGridRowSpan:1,msGridColumn:1,msGridColumnSpan:1,fontWeight:1,lineHeight:1,opacity:1,order:1,orphans:1,tabSize:1,widows:1,zIndex:1,zoom:1,WebkitLineClamp:1,fillOpacity:1,floodOpacity:1,stopOpacity:1,strokeDasharray:1,strokeDashoffset:1,strokeMiterlimit:1,strokeOpacity:1,strokeWidth:1},je="You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences",ze="You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).",Ye=/[A-Z]|^ms/g,Je=/_EMO_([^_]+?)_([^]*?)_EMO_/g,_e=function(e){return 45===e.charCodeAt(1)},Ue=function(e){return null!=e&&"boolean"!=typeof e},Qe=fe((function(e){return _e(e)?e:e.replace(Ye,"-$&").toLowerCase()})),$e=function(e,t){switch(e){case"animation":case"animationName":if("string"==typeof t)return t.replace(Je,(function(e,t,u){return at={name:t,styles:u,next:at},t}))}return 1===Le[e]||_e(e)||"number"!=typeof t||0===t?t:t+"px"};if("production"!==process.env.NODE_ENV){var Ke=/(var|attr|counters?|url|element|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/,qe=["normal","none","initial","inherit","unset"],et=$e,tt=/^-ms-/,ut=/-(.)/g,nt={};$e=function(e,t){if("content"===e&&("string"!=typeof t||-1===qe.indexOf(t)&&!Ke.test(t)&&(t.charAt(0)!==t.charAt(t.length-1)||'"'!==t.charAt(0)&&"'"!==t.charAt(0))))throw new Error("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\""+t+"\"'`");var u=et(e,t);return""===u||_e(e)||-1===e.indexOf("-")||void 0!==nt[e]||(nt[e]=!0,console.error("Using kebab-case for css properties in objects is not supported. Did you mean "+e.replace(tt,"ms-").replace(ut,(function(e,t){return t.toUpperCase()}))+"?")),u}}var rt="Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform.";function ot(e,t,u){if(null==u)return"";if(void 0!==u.__emotion_styles){if("production"!==process.env.NODE_ENV&&"NO_COMPONENT_SELECTOR"===u.toString())throw new Error(rt);return u}switch(typeof u){case"boolean":return"";case"object":if(1===u.anim)return at={name:u.name,styles:u.styles,next:at},u.name;if(void 0!==u.styles){var n=u.next;if(void 0!==n)for(;void 0!==n;)at={name:n.name,styles:n.styles,next:at},n=n.next;var r=u.styles+";";return"production"!==process.env.NODE_ENV&&void 0!==u.map&&(r+=u.map),r}return function(e,t,u){var n="";if(Array.isArray(u))for(var r=0;r<u.length;r++)n+=ot(e,t,u[r])+";";else for(var o in u){var i=u[o];if("object"!=typeof i)null!=t&&void 0!==t[i]?n+=o+"{"+t[i]+"}":Ue(i)&&(n+=Qe(o)+":"+$e(o,i)+";");else{if("NO_COMPONENT_SELECTOR"===o&&"production"!==process.env.NODE_ENV)throw new Error(rt);if(!Array.isArray(i)||"string"!=typeof i[0]||null!=t&&void 0!==t[i[0]]){var a=ot(e,t,i);switch(o){case"animation":case"animationName":n+=Qe(o)+":"+a+";";break;default:"production"!==process.env.NODE_ENV&&"undefined"===o&&console.error(ze),n+=o+"{"+a+"}"}}else for(var s=0;s<i.length;s++)Ue(i[s])&&(n+=Qe(o)+":"+$e(o,i[s])+";")}}return n}(e,t,u);case"function":if(void 0!==e){var o=at,i=u(e);return at=o,ot(e,t,i)}"production"!==process.env.NODE_ENV&&console.error("Functions that are interpolated in css calls will be stringified.\nIf you want to have a css call based on props, create a function that returns a css call like this\nlet dynamicStyle = (props) => css`color: ${props.color}`\nIt can be called directly with props or interpolated in a styled call like this\nlet SomeComponent = styled('div')`${dynamicStyle}`");break;case"string":if("production"!==process.env.NODE_ENV){var a=[],s=u.replace(Je,(function(e,t,u){var n="animation"+a.length;return a.push("const "+n+" = keyframes`"+u.replace(/^@keyframes animation-\w+/,"")+"`"),"${"+n+"}"}));a.length&&console.error("`keyframes` output got interpolated into plain string, please wrap it with `css`.\n\nInstead of doing this:\n\n"+[].concat(a,["`"+s+"`"]).join("\n")+"\n\nYou should wrap it with `css` like this:\n\ncss`"+s+"`")}}if(null==t)return u;var c=t[u];return void 0!==c?c:u}var it,at,st=/label:\s*([^\s;\n{]+)\s*(;|$)/g;"production"!==process.env.NODE_ENV&&(it=/\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g);var ct=function(e,t,u){if(1===e.length&&"object"==typeof e[0]&&null!==e[0]&&void 0!==e[0].styles)return e[0];var n=!0,r="";at=void 0;var o,i=e[0];null==i||void 0===i.raw?(n=!1,r+=ot(u,t,i)):("production"!==process.env.NODE_ENV&&void 0===i[0]&&console.error(je),r+=i[0]);for(var a=1;a<e.length;a++)r+=ot(u,t,e[a]),n&&("production"!==process.env.NODE_ENV&&void 0===i[a]&&console.error(je),r+=i[a]);"production"!==process.env.NODE_ENV&&(r=r.replace(it,(function(e){return o=e,""}))),st.lastIndex=0;for(var s,c="";null!==(s=st.exec(r));)c+="-"+s[1];var l=function(e){for(var t,u=0,n=0,r=e.length;r>=4;++n,r-=4)t=1540483477*(65535&(t=255&e.charCodeAt(n)|(255&e.charCodeAt(++n))<<8|(255&e.charCodeAt(++n))<<16|(255&e.charCodeAt(++n))<<24))+(59797*(t>>>16)<<16),u=1540483477*(65535&(t^=t>>>24))+(59797*(t>>>16)<<16)^1540483477*(65535&u)+(59797*(u>>>16)<<16);switch(r){case 3:u^=(255&e.charCodeAt(n+2))<<16;case 2:u^=(255&e.charCodeAt(n+1))<<8;case 1:u=1540483477*(65535&(u^=255&e.charCodeAt(n)))+(59797*(u>>>16)<<16)}return(((u=1540483477*(65535&(u^=u>>>13))+(59797*(u>>>16)<<16))^u>>>15)>>>0).toString(36)}(r)+c;return"production"!==process.env.NODE_ENV?{name:l,styles:r,map:o,next:at,toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}}:{name:l,styles:r,next:at}},lt="undefined"!=typeof document,dt=function(e){return e()},pt=!!e.useInsertionEffect&&e.useInsertionEffect,ft=lt&&pt||dt,gt=pt||u,bt="undefined"!=typeof document,ht={}.hasOwnProperty,mt=o("undefined"!=typeof HTMLElement?De({key:"css"}):null);"production"!==process.env.NODE_ENV&&(mt.displayName="EmotionCacheContext"),mt.Provider;var At=function(e){return i((function(t,u){var r=n(mt);return e(t,r,u)}))};bt||(At=function(e){return function(t){var u=n(mt);return null===u?(u=De({key:"css"}),r(mt.Provider,{value:u},e(t,u))):e(t,u)}});var Ct=o({});"production"!==process.env.NODE_ENV&&(Ct.displayName="EmotionThemeContext");var vt=pe((function(e){return pe((function(t){return function(e,t){if("function"==typeof t){var u=t(e);if("production"!==process.env.NODE_ENV&&(null==u||"object"!=typeof u||Array.isArray(u)))throw new Error("[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!");return u}if("production"!==process.env.NODE_ENV&&(null==t||"object"!=typeof t||Array.isArray(t)))throw new Error("[ThemeProvider] Please make your theme prop a plain object");return we({},e,t)}(e,t)}))})),Et=function(e){var t=n(Ct);return e.theme!==t&&(t=vt(t)(e.theme)),r(Ct.Provider,{value:t},e.children)},yt=function(e){var t=e.split(".");return t[t.length-1]},It=function(e){var t=/^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(e);return t||(t=/^([A-Za-z0-9$.]+)@/.exec(e))?yt(t[1]):void 0},Ft=new Set(["renderWithHooks","processChild","finishClassComponent","renderToString"]),Bt=function(e){return e.replace(/\$/g,"-")},xt="__EMOTION_TYPE_PLEASE_DO_NOT_USE__",Dt="__EMOTION_LABEL_PLEASE_DO_NOT_USE__",wt=function(e,t){if("production"!==process.env.NODE_ENV&&"string"==typeof t.css&&-1!==t.css.indexOf(":"))throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`"+t.css+"`");var u={};for(var n in t)ht.call(t,n)&&(u[n]=t[n]);if(u[xt]=e,"production"!==process.env.NODE_ENV&&t.css&&("object"!=typeof t.css||"string"!=typeof t.css.name||-1===t.css.name.indexOf("-"))){var r=function(e){if(e)for(var t=e.split("\n"),u=0;u<t.length;u++){var n=It(t[u]);if(n){if(Ft.has(n))break;if(/^[A-Z]/.test(n))return Bt(n)}}}((new Error).stack);r&&(u[Dt]=r)}return u},Gt=function(e){var t=e.cache,u=e.serialized,n=e.isStringTag;Pe(t,u,n);var o=ft((function(){return He(t,u,n)}));if(!bt&&void 0!==o){for(var i,a=u.name,s=u.next;void 0!==s;)a+=" "+s.name,s=s.next;return r("style",((i={})["data-emotion"]=t.key+" "+a,i.dangerouslySetInnerHTML={__html:o},i.nonce=t.sheet.nonce,i))}return null},Ot=At((function(e,t,u){var o=e.css;"string"==typeof o&&void 0!==t.registered[o]&&(o=t.registered[o]);var i=e[xt],s=[o],c="";"string"==typeof e.className?c=Me(t.registered,s,e.className):null!=e.className&&(c=e.className+" ");var l=ct(s,void 0,n(Ct));if("production"!==process.env.NODE_ENV&&-1===l.name.indexOf("-")){var d=e[Dt];d&&(l=ct([l,"label:"+d+";"]))}c+=t.key+"-"+l.name;var p={};for(var f in e)!ht.call(e,f)||"css"===f||f===xt||"production"!==process.env.NODE_ENV&&f===Dt||(p[f]=e[f]);return p.ref=u,p.className=c,r(a,null,r(Gt,{cache:t,serialized:l,isStringTag:"string"==typeof i}),r(i,p))}));function Tt(e,t,u){return ht.call(t,"css")?g(Ot,wt(e,t),u):g(e,t,u)}function Nt(e,t,u){return ht.call(t,"css")?b(Ot,wt(e,t),u):b(e,t,u)}"production"!==process.env.NODE_ENV&&(Ot.displayName="EmotionCssPropInternal");var kt=function(e,t){var u=arguments;if(null==t||!ht.call(t,"css"))return r.apply(void 0,u);var n=u.length,o=new Array(n);o[0]=Ot,o[1]=wt(e,t);for(var i=2;i<n;i++)o[i]=u[i];return r.apply(null,o)},Vt=!1,Rt=At((function(e,t){"production"===process.env.NODE_ENV||Vt||!e.className&&!e.css||(console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?"),Vt=!0);var u=e.styles,o=ct([u],void 0,n(Ct));if(!bt){for(var i,a=o.name,c=o.styles,l=o.next;void 0!==l;)a+=" "+l.name,c+=l.styles,l=l.next;var d=!0===t.compat,p=t.insert("",{name:a,styles:c},t.sheet,d);return d?null:r("style",((i={})["data-emotion"]=t.key+"-global "+a,i.dangerouslySetInnerHTML={__html:p},i.nonce=t.sheet.nonce,i))}var f=s();return gt((function(){var e=t.key+"-global",u=new t.sheet.constructor({key:e,nonce:t.sheet.nonce,container:t.sheet.container,speedy:t.sheet.isSpeedy}),n=!1,r=document.querySelector('style[data-emotion="'+e+" "+o.name+'"]');return t.sheet.tags.length&&(u.before=t.sheet.tags[0]),null!==r&&(n=!0,r.setAttribute("data-emotion",e),u.hydrate([r])),f.current=[u,n],function(){u.flush()}}),[t]),gt((function(){var e=f.current,u=e[0];if(e[1])e[1]=!1;else{if(void 0!==o.next&&He(t,o.next,!0),u.tags.length){var n=u.tags[u.tags.length-1].nextElementSibling;u.before=n,u.flush()}t.insert("",o,u,!1)}}),[t,o.name]),null}));function St(){for(var e=arguments.length,t=new Array(e),u=0;u<e;u++)t[u]=arguments[u];return ct(t)}"production"!==process.env.NODE_ENV&&(Rt.displayName="EmotionGlobal");var Wt=function e(t){for(var u=t.length,n=0,r="";n<u;n++){var o=t[n];if(null!=o){var i=void 0;switch(typeof o){case"boolean":break;case"object":if(Array.isArray(o))i=e(o);else for(var a in"production"!==process.env.NODE_ENV&&void 0!==o.styles&&void 0!==o.name&&console.error("You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component."),i="",o)o[a]&&a&&(i&&(i+=" "),i+=a);break;default:i=o}i&&(r&&(r+=" "),r+=i)}}return r};var Zt=function(e){var t,u=e.cache,n=e.serializedArr,o=ft((function(){for(var e="",t=0;t<n.length;t++){var r=He(u,n[t],!1);bt||void 0===r||(e+=r)}if(!bt)return e}));return bt||0===o.length?null:r("style",((t={})["data-emotion"]=u.key+" "+n.map((function(e){return e.name})).join(" "),t.dangerouslySetInnerHTML={__html:o},t.nonce=u.sheet.nonce,t))},Xt=At((function(e,t){var u=!1,o=[],i=function(){if(u&&"production"!==process.env.NODE_ENV)throw new Error("css can only be used during render");for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];var i=ct(n,t.registered);return o.push(i),Pe(t,i,!1),t.key+"-"+i.name},s={css:i,cx:function(){if(u&&"production"!==process.env.NODE_ENV)throw new Error("cx can only be used during render");for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return function(e,t,u){var n=[],r=Me(e,n,u);return n.length<2?u:r+t(n)}(t.registered,i,Wt(n))},theme:n(Ct)},c=e.children(s);return u=!0,r(a,null,r(Zt,{cache:t,serializedArr:o}),c)}));if("production"!==process.env.NODE_ENV&&(Xt.displayName="EmotionClassNames"),"production"!==process.env.NODE_ENV){var Mt="undefined"!=typeof document,Pt="undefined"!=typeof jest||"undefined"!=typeof vi;if(Mt&&!Pt){var Ht="undefined"!=typeof globalThis?globalThis:Mt?window:global,Lt="__EMOTION_REACT_"+"11.10.6".split(".")[0]+"__";Ht[Lt]&&console.warn("You are loading @emotion/react when it is already loaded. Running multiple instances may cause problems. This can happen if multiple versions are used, or if multiple builds of the same version are used."),Ht[Lt]=!0}}function jt(e){return jt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},jt(e)}var zt=/^\s+/,Yt=/\s+$/;function Jt(e,t){if(t=t||{},(e=e||"")instanceof Jt)return e;if(!(this instanceof Jt))return new Jt(e,t);var u=function(e){var t={r:0,g:0,b:0},u=1,n=null,r=null,o=null,i=!1,a=!1;"string"==typeof e&&(e=function(e){e=e.replace(zt,"").replace(Yt,"").toLowerCase();var t,u=!1;if(lu[e])e=lu[e],u=!0;else if("transparent"==e)return{r:0,g:0,b:0,a:0,format:"name"};if(t=Iu.rgb.exec(e))return{r:t[1],g:t[2],b:t[3]};if(t=Iu.rgba.exec(e))return{r:t[1],g:t[2],b:t[3],a:t[4]};if(t=Iu.hsl.exec(e))return{h:t[1],s:t[2],l:t[3]};if(t=Iu.hsla.exec(e))return{h:t[1],s:t[2],l:t[3],a:t[4]};if(t=Iu.hsv.exec(e))return{h:t[1],s:t[2],v:t[3]};if(t=Iu.hsva.exec(e))return{h:t[1],s:t[2],v:t[3],a:t[4]};if(t=Iu.hex8.exec(e))return{r:bu(t[1]),g:bu(t[2]),b:bu(t[3]),a:Cu(t[4]),format:u?"name":"hex8"};if(t=Iu.hex6.exec(e))return{r:bu(t[1]),g:bu(t[2]),b:bu(t[3]),format:u?"name":"hex"};if(t=Iu.hex4.exec(e))return{r:bu(t[1]+""+t[1]),g:bu(t[2]+""+t[2]),b:bu(t[3]+""+t[3]),a:Cu(t[4]+""+t[4]),format:u?"name":"hex8"};if(t=Iu.hex3.exec(e))return{r:bu(t[1]+""+t[1]),g:bu(t[2]+""+t[2]),b:bu(t[3]+""+t[3]),format:u?"name":"hex"};return!1}(e));"object"==jt(e)&&(Fu(e.r)&&Fu(e.g)&&Fu(e.b)?(s=e.r,c=e.g,l=e.b,t={r:255*fu(s,255),g:255*fu(c,255),b:255*fu(l,255)},i=!0,a="%"===String(e.r).substr(-1)?"prgb":"rgb"):Fu(e.h)&&Fu(e.s)&&Fu(e.v)?(n=mu(e.s),r=mu(e.v),t=function(e,t,u){e=6*fu(e,360),t=fu(t,100),u=fu(u,100);var n=Math.floor(e),r=e-n,o=u*(1-t),i=u*(1-r*t),a=u*(1-(1-r)*t),s=n%6,c=[u,i,o,o,a,u][s],l=[a,u,u,i,o,o][s],d=[o,o,a,u,u,i][s];return{r:255*c,g:255*l,b:255*d}}(e.h,n,r),i=!0,a="hsv"):Fu(e.h)&&Fu(e.s)&&Fu(e.l)&&(n=mu(e.s),o=mu(e.l),t=function(e,t,u){var n,r,o;function i(e,t,u){return u<0&&(u+=1),u>1&&(u-=1),u<1/6?e+6*(t-e)*u:u<.5?t:u<2/3?e+(t-e)*(2/3-u)*6:e}if(e=fu(e,360),t=fu(t,100),u=fu(u,100),0===t)n=r=o=u;else{var a=u<.5?u*(1+t):u+t-u*t,s=2*u-a;n=i(s,a,e+1/3),r=i(s,a,e),o=i(s,a,e-1/3)}return{r:255*n,g:255*r,b:255*o}}(e.h,n,o),i=!0,a="hsl"),e.hasOwnProperty("a")&&(u=e.a));var s,c,l;return u=pu(u),{ok:i,format:e.format||a,r:Math.min(255,Math.max(t.r,0)),g:Math.min(255,Math.max(t.g,0)),b:Math.min(255,Math.max(t.b,0)),a:u}}(e);this._originalInput=e,this._r=u.r,this._g=u.g,this._b=u.b,this._a=u.a,this._roundA=Math.round(100*this._a)/100,this._format=t.format||u.format,this._gradientType=t.gradientType,this._r<1&&(this._r=Math.round(this._r)),this._g<1&&(this._g=Math.round(this._g)),this._b<1&&(this._b=Math.round(this._b)),this._ok=u.ok}function _t(e,t,u){e=fu(e,255),t=fu(t,255),u=fu(u,255);var n,r,o=Math.max(e,t,u),i=Math.min(e,t,u),a=(o+i)/2;if(o==i)n=r=0;else{var s=o-i;switch(r=a>.5?s/(2-o-i):s/(o+i),o){case e:n=(t-u)/s+(t<u?6:0);break;case t:n=(u-e)/s+2;break;case u:n=(e-t)/s+4}n/=6}return{h:n,s:r,l:a}}function Ut(e,t,u){e=fu(e,255),t=fu(t,255),u=fu(u,255);var n,r,o=Math.max(e,t,u),i=Math.min(e,t,u),a=o,s=o-i;if(r=0===o?0:s/o,o==i)n=0;else{switch(o){case e:n=(t-u)/s+(t<u?6:0);break;case t:n=(u-e)/s+2;break;case u:n=(e-t)/s+4}n/=6}return{h:n,s:r,v:a}}function Qt(e,t,u,n){var r=[hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16))];return n&&r[0].charAt(0)==r[0].charAt(1)&&r[1].charAt(0)==r[1].charAt(1)&&r[2].charAt(0)==r[2].charAt(1)?r[0].charAt(0)+r[1].charAt(0)+r[2].charAt(0):r.join("")}function $t(e,t,u,n){return[hu(Au(n)),hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16))].join("")}function Kt(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.s-=t/100,u.s=gu(u.s),Jt(u)}function qt(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.s+=t/100,u.s=gu(u.s),Jt(u)}function eu(e){return Jt(e).desaturate(100)}function tu(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.l+=t/100,u.l=gu(u.l),Jt(u)}function uu(e,t){t=0===t?0:t||10;var u=Jt(e).toRgb();return u.r=Math.max(0,Math.min(255,u.r-Math.round(-t/100*255))),u.g=Math.max(0,Math.min(255,u.g-Math.round(-t/100*255))),u.b=Math.max(0,Math.min(255,u.b-Math.round(-t/100*255))),Jt(u)}function nu(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.l-=t/100,u.l=gu(u.l),Jt(u)}function ru(e,t){var u=Jt(e).toHsl(),n=(u.h+t)%360;return u.h=n<0?360+n:n,Jt(u)}function ou(e){var t=Jt(e).toHsl();return t.h=(t.h+180)%360,Jt(t)}function iu(e,t){if(isNaN(t)||t<=0)throw new Error("Argument to polyad must be a positive number");for(var u=Jt(e).toHsl(),n=[Jt(e)],r=360/t,o=1;o<t;o++)n.push(Jt({h:(u.h+o*r)%360,s:u.s,l:u.l}));return n}function au(e){var t=Jt(e).toHsl(),u=t.h;return[Jt(e),Jt({h:(u+72)%360,s:t.s,l:t.l}),Jt({h:(u+216)%360,s:t.s,l:t.l})]}function su(e,t,u){t=t||6,u=u||30;var n=Jt(e).toHsl(),r=360/u,o=[Jt(e)];for(n.h=(n.h-(r*t>>1)+720)%360;--t;)n.h=(n.h+r)%360,o.push(Jt(n));return o}function cu(e,t){t=t||6;for(var u=Jt(e).toHsv(),n=u.h,r=u.s,o=u.v,i=[],a=1/t;t--;)i.push(Jt({h:n,s:r,v:o})),o=(o+a)%1;return i}Jt.prototype={isDark:function(){return this.getBrightness()<128},isLight:function(){return!this.isDark()},isValid:function(){return this._ok},getOriginalInput:function(){return this._originalInput},getFormat:function(){return this._format},getAlpha:function(){return this._a},getBrightness:function(){var e=this.toRgb();return(299*e.r+587*e.g+114*e.b)/1e3},getLuminance:function(){var e,t,u,n=this.toRgb();return e=n.r/255,t=n.g/255,u=n.b/255,.2126*(e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4))+.7152*(t<=.03928?t/12.92:Math.pow((t+.055)/1.055,2.4))+.0722*(u<=.03928?u/12.92:Math.pow((u+.055)/1.055,2.4))},setAlpha:function(e){return this._a=pu(e),this._roundA=Math.round(100*this._a)/100,this},toHsv:function(){var e=Ut(this._r,this._g,this._b);return{h:360*e.h,s:e.s,v:e.v,a:this._a}},toHsvString:function(){var e=Ut(this._r,this._g,this._b),t=Math.round(360*e.h),u=Math.round(100*e.s),n=Math.round(100*e.v);return 1==this._a?"hsv("+t+", "+u+"%, "+n+"%)":"hsva("+t+", "+u+"%, "+n+"%, "+this._roundA+")"},toHsl:function(){var e=_t(this._r,this._g,this._b);return{h:360*e.h,s:e.s,l:e.l,a:this._a}},toHslString:function(){var e=_t(this._r,this._g,this._b),t=Math.round(360*e.h),u=Math.round(100*e.s),n=Math.round(100*e.l);return 1==this._a?"hsl("+t+", "+u+"%, "+n+"%)":"hsla("+t+", "+u+"%, "+n+"%, "+this._roundA+")"},toHex:function(e){return Qt(this._r,this._g,this._b,e)},toHexString:function(e){return"#"+this.toHex(e)},toHex8:function(e){return function(e,t,u,n,r){var o=[hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16)),hu(Au(n))];if(r&&o[0].charAt(0)==o[0].charAt(1)&&o[1].charAt(0)==o[1].charAt(1)&&o[2].charAt(0)==o[2].charAt(1)&&o[3].charAt(0)==o[3].charAt(1))return o[0].charAt(0)+o[1].charAt(0)+o[2].charAt(0)+o[3].charAt(0);return o.join("")}(this._r,this._g,this._b,this._a,e)},toHex8String:function(e){return"#"+this.toHex8(e)},toRgb:function(){return{r:Math.round(this._r),g:Math.round(this._g),b:Math.round(this._b),a:this._a}},toRgbString:function(){return 1==this._a?"rgb("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+")":"rgba("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+", "+this._roundA+")"},toPercentageRgb:function(){return{r:Math.round(100*fu(this._r,255))+"%",g:Math.round(100*fu(this._g,255))+"%",b:Math.round(100*fu(this._b,255))+"%",a:this._a}},toPercentageRgbString:function(){return 1==this._a?"rgb("+Math.round(100*fu(this._r,255))+"%, "+Math.round(100*fu(this._g,255))+"%, "+Math.round(100*fu(this._b,255))+"%)":"rgba("+Math.round(100*fu(this._r,255))+"%, "+Math.round(100*fu(this._g,255))+"%, "+Math.round(100*fu(this._b,255))+"%, "+this._roundA+")"},toName:function(){return 0===this._a?"transparent":!(this._a<1)&&(du[Qt(this._r,this._g,this._b,!0)]||!1)},toFilter:function(e){var t="#"+$t(this._r,this._g,this._b,this._a),u=t,n=this._gradientType?"GradientType = 1, ":"";if(e){var r=Jt(e);u="#"+$t(r._r,r._g,r._b,r._a)}return"progid:DXImageTransform.Microsoft.gradient("+n+"startColorstr="+t+",endColorstr="+u+")"},toString:function(e){var t=!!e;e=e||this._format;var u=!1,n=this._a<1&&this._a>=0;return t||!n||"hex"!==e&&"hex6"!==e&&"hex3"!==e&&"hex4"!==e&&"hex8"!==e&&"name"!==e?("rgb"===e&&(u=this.toRgbString()),"prgb"===e&&(u=this.toPercentageRgbString()),"hex"!==e&&"hex6"!==e||(u=this.toHexString()),"hex3"===e&&(u=this.toHexString(!0)),"hex4"===e&&(u=this.toHex8String(!0)),"hex8"===e&&(u=this.toHex8String()),"name"===e&&(u=this.toName()),"hsl"===e&&(u=this.toHslString()),"hsv"===e&&(u=this.toHsvString()),u||this.toHexString()):"name"===e&&0===this._a?this.toName():this.toRgbString()},clone:function(){return Jt(this.toString())},_applyModification:function(e,t){var u=e.apply(null,[this].concat([].slice.call(t)));return this._r=u._r,this._g=u._g,this._b=u._b,this.setAlpha(u._a),this},lighten:function(){return this._applyModification(tu,arguments)},brighten:function(){return this._applyModification(uu,arguments)},darken:function(){return this._applyModification(nu,arguments)},desaturate:function(){return this._applyModification(Kt,arguments)},saturate:function(){return this._applyModification(qt,arguments)},greyscale:function(){return this._applyModification(eu,arguments)},spin:function(){return this._applyModification(ru,arguments)},_applyCombination:function(e,t){return e.apply(null,[this].concat([].slice.call(t)))},analogous:function(){return this._applyCombination(su,arguments)},complement:function(){return this._applyCombination(ou,arguments)},monochromatic:function(){return this._applyCombination(cu,arguments)},splitcomplement:function(){return this._applyCombination(au,arguments)},triad:function(){return this._applyCombination(iu,[3])},tetrad:function(){return this._applyCombination(iu,[4])}},Jt.fromRatio=function(e,t){if("object"==jt(e)){var u={};for(var n in e)e.hasOwnProperty(n)&&(u[n]="a"===n?e[n]:mu(e[n]));e=u}return Jt(e,t)},Jt.equals=function(e,t){return!(!e||!t)&&Jt(e).toRgbString()==Jt(t).toRgbString()},Jt.random=function(){return Jt.fromRatio({r:Math.random(),g:Math.random(),b:Math.random()})},Jt.mix=function(e,t,u){u=0===u?0:u||50;var n=Jt(e).toRgb(),r=Jt(t).toRgb(),o=u/100;return Jt({r:(r.r-n.r)*o+n.r,g:(r.g-n.g)*o+n.g,b:(r.b-n.b)*o+n.b,a:(r.a-n.a)*o+n.a})},Jt.readability=function(e,t){var u=Jt(e),n=Jt(t);return(Math.max(u.getLuminance(),n.getLuminance())+.05)/(Math.min(u.getLuminance(),n.getLuminance())+.05)},Jt.isReadable=function(e,t,u){var n,r,o=Jt.readability(e,t);switch(r=!1,(n=function(e){var t,u;t=((e=e||{level:"AA",size:"small"}).level||"AA").toUpperCase(),u=(e.size||"small").toLowerCase(),"AA"!==t&&"AAA"!==t&&(t="AA");"small"!==u&&"large"!==u&&(u="small");return{level:t,size:u}}(u)).level+n.size){case"AAsmall":case"AAAlarge":r=o>=4.5;break;case"AAlarge":r=o>=3;break;case"AAAsmall":r=o>=7}return r},Jt.mostReadable=function(e,t,u){var n,r,o,i,a=null,s=0;r=(u=u||{}).includeFallbackColors,o=u.level,i=u.size;for(var c=0;c<t.length;c++)(n=Jt.readability(e,t[c]))>s&&(s=n,a=Jt(t[c]));return Jt.isReadable(e,a,{level:o,size:i})||!r?a:(u.includeFallbackColors=!1,Jt.mostReadable(e,["#fff","#000"],u))};var lu=Jt.names={aliceblue:"f0f8ff",antiquewhite:"faebd7",aqua:"0ff",aquamarine:"7fffd4",azure:"f0ffff",beige:"f5f5dc",bisque:"ffe4c4",black:"000",blanchedalmond:"ffebcd",blue:"00f",blueviolet:"8a2be2",brown:"a52a2a",burlywood:"deb887",burntsienna:"ea7e5d",cadetblue:"5f9ea0",chartreuse:"7fff00",chocolate:"d2691e",coral:"ff7f50",cornflowerblue:"6495ed",cornsilk:"fff8dc",crimson:"dc143c",cyan:"0ff",darkblue:"00008b",darkcyan:"008b8b",darkgoldenrod:"b8860b",darkgray:"a9a9a9",darkgreen:"006400",darkgrey:"a9a9a9",darkkhaki:"bdb76b",darkmagenta:"8b008b",darkolivegreen:"556b2f",darkorange:"ff8c00",darkorchid:"9932cc",darkred:"8b0000",darksalmon:"e9967a",darkseagreen:"8fbc8f",darkslateblue:"483d8b",darkslategray:"2f4f4f",darkslategrey:"2f4f4f",darkturquoise:"00ced1",darkviolet:"9400d3",deeppink:"ff1493",deepskyblue:"00bfff",dimgray:"696969",dimgrey:"696969",dodgerblue:"1e90ff",firebrick:"b22222",floralwhite:"fffaf0",forestgreen:"228b22",fuchsia:"f0f",gainsboro:"dcdcdc",ghostwhite:"f8f8ff",gold:"ffd700",goldenrod:"daa520",gray:"808080",green:"008000",greenyellow:"adff2f",grey:"808080",honeydew:"f0fff0",hotpink:"ff69b4",indianred:"cd5c5c",indigo:"4b0082",ivory:"fffff0",khaki:"f0e68c",lavender:"e6e6fa",lavenderblush:"fff0f5",lawngreen:"7cfc00",lemonchiffon:"fffacd",lightblue:"add8e6",lightcoral:"f08080",lightcyan:"e0ffff",lightgoldenrodyellow:"fafad2",lightgray:"d3d3d3",lightgreen:"90ee90",lightgrey:"d3d3d3",lightpink:"ffb6c1",lightsalmon:"ffa07a",lightseagreen:"20b2aa",lightskyblue:"87cefa",lightslategray:"789",lightslategrey:"789",lightsteelblue:"b0c4de",lightyellow:"ffffe0",lime:"0f0",limegreen:"32cd32",linen:"faf0e6",magenta:"f0f",maroon:"800000",mediumaquamarine:"66cdaa",mediumblue:"0000cd",mediumorchid:"ba55d3",mediumpurple:"9370db",mediumseagreen:"3cb371",mediumslateblue:"7b68ee",mediumspringgreen:"00fa9a",mediumturquoise:"48d1cc",mediumvioletred:"c71585",midnightblue:"191970",mintcream:"f5fffa",mistyrose:"ffe4e1",moccasin:"ffe4b5",navajowhite:"ffdead",navy:"000080",oldlace:"fdf5e6",olive:"808000",olivedrab:"6b8e23",orange:"ffa500",orangered:"ff4500",orchid:"da70d6",palegoldenrod:"eee8aa",palegreen:"98fb98",paleturquoise:"afeeee",palevioletred:"db7093",papayawhip:"ffefd5",peachpuff:"ffdab9",peru:"cd853f",pink:"ffc0cb",plum:"dda0dd",powderblue:"b0e0e6",purple:"800080",rebeccapurple:"663399",red:"f00",rosybrown:"bc8f8f",royalblue:"4169e1",saddlebrown:"8b4513",salmon:"fa8072",sandybrown:"f4a460",seagreen:"2e8b57",seashell:"fff5ee",sienna:"a0522d",silver:"c0c0c0",skyblue:"87ceeb",slateblue:"6a5acd",slategray:"708090",slategrey:"708090",snow:"fffafa",springgreen:"00ff7f",steelblue:"4682b4",tan:"d2b48c",teal:"008080",thistle:"d8bfd8",tomato:"ff6347",turquoise:"40e0d0",violet:"ee82ee",wheat:"f5deb3",white:"fff",whitesmoke:"f5f5f5",yellow:"ff0",yellowgreen:"9acd32"},du=Jt.hexNames=function(e){var t={};for(var u in e)e.hasOwnProperty(u)&&(t[e[u]]=u);return t}(lu);function pu(e){return e=parseFloat(e),(isNaN(e)||e<0||e>1)&&(e=1),e}function fu(e,t){(function(e){return"string"==typeof e&&-1!=e.indexOf(".")&&1===parseFloat(e)})(e)&&(e="100%");var u=function(e){return"string"==typeof e&&-1!=e.indexOf("%")}(e);return e=Math.min(t,Math.max(0,parseFloat(e))),u&&(e=parseInt(e*t,10)/100),Math.abs(e-t)<1e-6?1:e%t/parseFloat(t)}function gu(e){return Math.min(1,Math.max(0,e))}function bu(e){return parseInt(e,16)}function hu(e){return 1==e.length?"0"+e:""+e}function mu(e){return e<=1&&(e=100*e+"%"),e}function Au(e){return Math.round(255*parseFloat(e)).toString(16)}function Cu(e){return bu(e)/255}var vu,Eu,yu,Iu=(Eu="[\\s|\\(]+("+(vu="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)")+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")\\s*\\)?",yu="[\\s|\\(]+("+vu+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")\\s*\\)?",{CSS_UNIT:new RegExp(vu),rgb:new RegExp("rgb"+Eu),rgba:new RegExp("rgba"+yu),hsl:new RegExp("hsl"+Eu),hsla:new RegExp("hsla"+yu),hsv:new RegExp("hsv"+Eu),hsva:new RegExp("hsva"+yu),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/});function Fu(e){return!!Iu.CSS_UNIT.exec(e)}const Bu={colors:{primary:{main:"#1d4e89",contrastText:"#ffffff"},secondary:{main:"#00b2ca",contrastText:"#ffffff"},tertiary:{main:"#7dcfb6",contrastText:"#ffffff"},statusOk:{main:"#00e200",contrastText:"#ffffff"},statusWarning:{main:"#efff00",contrastText:"#000000"},statusCritical:{main:"#ff3838",contrastText:"#ffffff"},statusNeutral:{main:"#7b8089",contrastText:"#ffffff"}}},xu=t.createContext(Bu),Du=e=>{const u=c((()=>e.theme?e.theme:Bu),[e.theme]);return t.createElement(xu.Provider,{value:u},t.createElement(Et,{theme:u},e.children))},wu=()=>{const e=n(Ct),t=(u=e,0===Object.keys(u).length?Bu:e);var u;return{colors:t.colors,getColor:e=>{if(t.colors[e])return t.colors[e];const u=Jt(e);return u.isValid()?{main:e,contrastText:Jt.mostReadable(u,["#fff","#000"]).toHexString()}:t.colors.primary}}},Gu=t=>{const u=wu(),n=e.useMemo((()=>t.color?u.getColor(t.color||"primary"):u.colors.primary),[t.color,u]),r=_n.button`
+ */Re={get exports(){return Ne},set exports(e){Ne=e}},"production"===process.env.NODE_ENV?Re.exports=function(){if(Te)return ke;Te=1;var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,u=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,r=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,a=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,c=e?Symbol.for("react.concurrent_mode"):60111,l=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,f=e?Symbol.for("react.memo"):60115,g=e?Symbol.for("react.lazy"):60116,b=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,m=e?Symbol.for("react.responder"):60118,A=e?Symbol.for("react.scope"):60119;function C(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:switch(e=e.type){case s:case c:case n:case o:case r:case d:return e;default:switch(e=e&&e.$$typeof){case a:case l:case g:case f:case i:return e;default:return p}}case u:return p}}}function v(e){return C(e)===c}return ke.AsyncMode=s,ke.ConcurrentMode=c,ke.ContextConsumer=a,ke.ContextProvider=i,ke.Element=t,ke.ForwardRef=l,ke.Fragment=n,ke.Lazy=g,ke.Memo=f,ke.Portal=u,ke.Profiler=o,ke.StrictMode=r,ke.Suspense=d,ke.isAsyncMode=function(e){return v(e)||C(e)===s},ke.isConcurrentMode=v,ke.isContextConsumer=function(e){return C(e)===a},ke.isContextProvider=function(e){return C(e)===i},ke.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},ke.isForwardRef=function(e){return C(e)===l},ke.isFragment=function(e){return C(e)===n},ke.isLazy=function(e){return C(e)===g},ke.isMemo=function(e){return C(e)===f},ke.isPortal=function(e){return C(e)===u},ke.isProfiler=function(e){return C(e)===o},ke.isStrictMode=function(e){return C(e)===r},ke.isSuspense=function(e){return C(e)===d},ke.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===c||e===o||e===r||e===d||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===g||e.$$typeof===f||e.$$typeof===i||e.$$typeof===a||e.$$typeof===l||e.$$typeof===h||e.$$typeof===m||e.$$typeof===A||e.$$typeof===b)},ke.typeOf=C,ke}():Re.exports=(Ve||(Ve=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,t=e?Symbol.for("react.element"):60103,u=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,r=e?Symbol.for("react.strict_mode"):60108,o=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,a=e?Symbol.for("react.context"):60110,s=e?Symbol.for("react.async_mode"):60111,c=e?Symbol.for("react.concurrent_mode"):60111,l=e?Symbol.for("react.forward_ref"):60112,d=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,f=e?Symbol.for("react.memo"):60115,g=e?Symbol.for("react.lazy"):60116,b=e?Symbol.for("react.block"):60121,h=e?Symbol.for("react.fundamental"):60117,m=e?Symbol.for("react.responder"):60118,A=e?Symbol.for("react.scope"):60119;function C(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case t:var b=e.type;switch(b){case s:case c:case n:case o:case r:case d:return b;default:var h=b&&b.$$typeof;switch(h){case a:case l:case g:case f:case i:return h;default:return p}}case u:return p}}}var v=s,E=c,y=a,I=i,F=t,B=l,x=n,D=g,w=f,G=u,O=o,T=r,N=d,k=!1;function V(e){return C(e)===c}Se.AsyncMode=v,Se.ConcurrentMode=E,Se.ContextConsumer=y,Se.ContextProvider=I,Se.Element=F,Se.ForwardRef=B,Se.Fragment=x,Se.Lazy=D,Se.Memo=w,Se.Portal=G,Se.Profiler=O,Se.StrictMode=T,Se.Suspense=N,Se.isAsyncMode=function(e){return k||(k=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),V(e)||C(e)===s},Se.isConcurrentMode=V,Se.isContextConsumer=function(e){return C(e)===a},Se.isContextProvider=function(e){return C(e)===i},Se.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},Se.isForwardRef=function(e){return C(e)===l},Se.isFragment=function(e){return C(e)===n},Se.isLazy=function(e){return C(e)===g},Se.isMemo=function(e){return C(e)===f},Se.isPortal=function(e){return C(e)===u},Se.isProfiler=function(e){return C(e)===o},Se.isStrictMode=function(e){return C(e)===r},Se.isSuspense=function(e){return C(e)===d},Se.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===c||e===o||e===r||e===d||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===g||e.$$typeof===f||e.$$typeof===i||e.$$typeof===a||e.$$typeof===l||e.$$typeof===h||e.$$typeof===m||e.$$typeof===A||e.$$typeof===b)},Se.typeOf=C}()),Se);var We=Ne,Ze={};Ze[We.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},Ze[We.Memo]={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0};var Xe="undefined"!=typeof document;function Me(e,t,u){var n="";return u.split(" ").forEach((function(u){void 0!==e[u]?t.push(e[u]+";"):n+=u+" "})),n}var Pe=function(e,t,u){var n=e.key+"-"+t.name;(!1===u||!1===Xe&&void 0!==e.compat)&&void 0===e.registered[n]&&(e.registered[n]=t.styles)},He=function(e,t,u){Pe(e,t,u);var n=e.key+"-"+t.name;if(void 0===e.inserted[t.name]){var r="",o=t;do{var i=e.insert(t===o?"."+n:"",o,e.sheet,!0);Xe||void 0===i||(r+=i),o=o.next}while(void 0!==o);if(!Xe&&0!==r.length)return r}};var Le={animationIterationCount:1,borderImageOutset:1,borderImageSlice:1,borderImageWidth:1,boxFlex:1,boxFlexGroup:1,boxOrdinalGroup:1,columnCount:1,columns:1,flex:1,flexGrow:1,flexPositive:1,flexShrink:1,flexNegative:1,flexOrder:1,gridRow:1,gridRowEnd:1,gridRowSpan:1,gridRowStart:1,gridColumn:1,gridColumnEnd:1,gridColumnSpan:1,gridColumnStart:1,msGridRow:1,msGridRowSpan:1,msGridColumn:1,msGridColumnSpan:1,fontWeight:1,lineHeight:1,opacity:1,order:1,orphans:1,tabSize:1,widows:1,zIndex:1,zoom:1,WebkitLineClamp:1,fillOpacity:1,floodOpacity:1,stopOpacity:1,strokeDasharray:1,strokeDashoffset:1,strokeMiterlimit:1,strokeOpacity:1,strokeWidth:1},je="You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences",ze="You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).",Ye=/[A-Z]|^ms/g,Je=/_EMO_([^_]+?)_([^]*?)_EMO_/g,_e=function(e){return 45===e.charCodeAt(1)},Ue=function(e){return null!=e&&"boolean"!=typeof e},Qe=fe((function(e){return _e(e)?e:e.replace(Ye,"-$&").toLowerCase()})),$e=function(e,t){switch(e){case"animation":case"animationName":if("string"==typeof t)return t.replace(Je,(function(e,t,u){return at={name:t,styles:u,next:at},t}))}return 1===Le[e]||_e(e)||"number"!=typeof t||0===t?t:t+"px"};if("production"!==process.env.NODE_ENV){var Ke=/(var|attr|counters?|url|element|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/,qe=["normal","none","initial","inherit","unset"],et=$e,tt=/^-ms-/,ut=/-(.)/g,nt={};$e=function(e,t){if("content"===e&&("string"!=typeof t||-1===qe.indexOf(t)&&!Ke.test(t)&&(t.charAt(0)!==t.charAt(t.length-1)||'"'!==t.charAt(0)&&"'"!==t.charAt(0))))throw new Error("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\""+t+"\"'`");var u=et(e,t);return""===u||_e(e)||-1===e.indexOf("-")||void 0!==nt[e]||(nt[e]=!0,console.error("Using kebab-case for css properties in objects is not supported. Did you mean "+e.replace(tt,"ms-").replace(ut,(function(e,t){return t.toUpperCase()}))+"?")),u}}var rt="Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform.";function ot(e,t,u){if(null==u)return"";if(void 0!==u.__emotion_styles){if("production"!==process.env.NODE_ENV&&"NO_COMPONENT_SELECTOR"===u.toString())throw new Error(rt);return u}switch(typeof u){case"boolean":return"";case"object":if(1===u.anim)return at={name:u.name,styles:u.styles,next:at},u.name;if(void 0!==u.styles){var n=u.next;if(void 0!==n)for(;void 0!==n;)at={name:n.name,styles:n.styles,next:at},n=n.next;var r=u.styles+";";return"production"!==process.env.NODE_ENV&&void 0!==u.map&&(r+=u.map),r}return function(e,t,u){var n="";if(Array.isArray(u))for(var r=0;r<u.length;r++)n+=ot(e,t,u[r])+";";else for(var o in u){var i=u[o];if("object"!=typeof i)null!=t&&void 0!==t[i]?n+=o+"{"+t[i]+"}":Ue(i)&&(n+=Qe(o)+":"+$e(o,i)+";");else{if("NO_COMPONENT_SELECTOR"===o&&"production"!==process.env.NODE_ENV)throw new Error(rt);if(!Array.isArray(i)||"string"!=typeof i[0]||null!=t&&void 0!==t[i[0]]){var a=ot(e,t,i);switch(o){case"animation":case"animationName":n+=Qe(o)+":"+a+";";break;default:"production"!==process.env.NODE_ENV&&"undefined"===o&&console.error(ze),n+=o+"{"+a+"}"}}else for(var s=0;s<i.length;s++)Ue(i[s])&&(n+=Qe(o)+":"+$e(o,i[s])+";")}}return n}(e,t,u);case"function":if(void 0!==e){var o=at,i=u(e);return at=o,ot(e,t,i)}"production"!==process.env.NODE_ENV&&console.error("Functions that are interpolated in css calls will be stringified.\nIf you want to have a css call based on props, create a function that returns a css call like this\nlet dynamicStyle = (props) => css`color: ${props.color}`\nIt can be called directly with props or interpolated in a styled call like this\nlet SomeComponent = styled('div')`${dynamicStyle}`");break;case"string":if("production"!==process.env.NODE_ENV){var a=[],s=u.replace(Je,(function(e,t,u){var n="animation"+a.length;return a.push("const "+n+" = keyframes`"+u.replace(/^@keyframes animation-\w+/,"")+"`"),"${"+n+"}"}));a.length&&console.error("`keyframes` output got interpolated into plain string, please wrap it with `css`.\n\nInstead of doing this:\n\n"+[].concat(a,["`"+s+"`"]).join("\n")+"\n\nYou should wrap it with `css` like this:\n\ncss`"+s+"`")}}if(null==t)return u;var c=t[u];return void 0!==c?c:u}var it,at,st=/label:\s*([^\s;\n{]+)\s*(;|$)/g;"production"!==process.env.NODE_ENV&&(it=/\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g);var ct=function(e,t,u){if(1===e.length&&"object"==typeof e[0]&&null!==e[0]&&void 0!==e[0].styles)return e[0];var n=!0,r="";at=void 0;var o,i=e[0];null==i||void 0===i.raw?(n=!1,r+=ot(u,t,i)):("production"!==process.env.NODE_ENV&&void 0===i[0]&&console.error(je),r+=i[0]);for(var a=1;a<e.length;a++)r+=ot(u,t,e[a]),n&&("production"!==process.env.NODE_ENV&&void 0===i[a]&&console.error(je),r+=i[a]);"production"!==process.env.NODE_ENV&&(r=r.replace(it,(function(e){return o=e,""}))),st.lastIndex=0;for(var s,c="";null!==(s=st.exec(r));)c+="-"+s[1];var l=function(e){for(var t,u=0,n=0,r=e.length;r>=4;++n,r-=4)t=1540483477*(65535&(t=255&e.charCodeAt(n)|(255&e.charCodeAt(++n))<<8|(255&e.charCodeAt(++n))<<16|(255&e.charCodeAt(++n))<<24))+(59797*(t>>>16)<<16),u=1540483477*(65535&(t^=t>>>24))+(59797*(t>>>16)<<16)^1540483477*(65535&u)+(59797*(u>>>16)<<16);switch(r){case 3:u^=(255&e.charCodeAt(n+2))<<16;case 2:u^=(255&e.charCodeAt(n+1))<<8;case 1:u=1540483477*(65535&(u^=255&e.charCodeAt(n)))+(59797*(u>>>16)<<16)}return(((u=1540483477*(65535&(u^=u>>>13))+(59797*(u>>>16)<<16))^u>>>15)>>>0).toString(36)}(r)+c;return"production"!==process.env.NODE_ENV?{name:l,styles:r,map:o,next:at,toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}}:{name:l,styles:r,next:at}},lt="undefined"!=typeof document,dt=function(e){return e()},pt=!!e.useInsertionEffect&&e.useInsertionEffect,ft=lt&&pt||dt,gt=pt||u,bt="undefined"!=typeof document,ht={}.hasOwnProperty,mt=o("undefined"!=typeof HTMLElement?De({key:"css"}):null);"production"!==process.env.NODE_ENV&&(mt.displayName="EmotionCacheContext"),mt.Provider;var At=function(e){return i((function(t,u){var r=n(mt);return e(t,r,u)}))};bt||(At=function(e){return function(t){var u=n(mt);return null===u?(u=De({key:"css"}),r(mt.Provider,{value:u},e(t,u))):e(t,u)}});var Ct=o({});"production"!==process.env.NODE_ENV&&(Ct.displayName="EmotionThemeContext");var vt=pe((function(e){return pe((function(t){return function(e,t){if("function"==typeof t){var u=t(e);if("production"!==process.env.NODE_ENV&&(null==u||"object"!=typeof u||Array.isArray(u)))throw new Error("[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!");return u}if("production"!==process.env.NODE_ENV&&(null==t||"object"!=typeof t||Array.isArray(t)))throw new Error("[ThemeProvider] Please make your theme prop a plain object");return we({},e,t)}(e,t)}))})),Et=function(e){var t=n(Ct);return e.theme!==t&&(t=vt(t)(e.theme)),r(Ct.Provider,{value:t},e.children)},yt=function(e){var t=e.split(".");return t[t.length-1]},It=function(e){var t=/^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(e);return t||(t=/^([A-Za-z0-9$.]+)@/.exec(e))?yt(t[1]):void 0},Ft=new Set(["renderWithHooks","processChild","finishClassComponent","renderToString"]),Bt=function(e){return e.replace(/\$/g,"-")},xt="__EMOTION_TYPE_PLEASE_DO_NOT_USE__",Dt="__EMOTION_LABEL_PLEASE_DO_NOT_USE__",wt=function(e,t){if("production"!==process.env.NODE_ENV&&"string"==typeof t.css&&-1!==t.css.indexOf(":"))throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`"+t.css+"`");var u={};for(var n in t)ht.call(t,n)&&(u[n]=t[n]);if(u[xt]=e,"production"!==process.env.NODE_ENV&&t.css&&("object"!=typeof t.css||"string"!=typeof t.css.name||-1===t.css.name.indexOf("-"))){var r=function(e){if(e)for(var t=e.split("\n"),u=0;u<t.length;u++){var n=It(t[u]);if(n){if(Ft.has(n))break;if(/^[A-Z]/.test(n))return Bt(n)}}}((new Error).stack);r&&(u[Dt]=r)}return u},Gt=function(e){var t=e.cache,u=e.serialized,n=e.isStringTag;Pe(t,u,n);var o=ft((function(){return He(t,u,n)}));if(!bt&&void 0!==o){for(var i,a=u.name,s=u.next;void 0!==s;)a+=" "+s.name,s=s.next;return r("style",((i={})["data-emotion"]=t.key+" "+a,i.dangerouslySetInnerHTML={__html:o},i.nonce=t.sheet.nonce,i))}return null},Ot=At((function(e,t,u){var o=e.css;"string"==typeof o&&void 0!==t.registered[o]&&(o=t.registered[o]);var i=e[xt],s=[o],c="";"string"==typeof e.className?c=Me(t.registered,s,e.className):null!=e.className&&(c=e.className+" ");var l=ct(s,void 0,n(Ct));if("production"!==process.env.NODE_ENV&&-1===l.name.indexOf("-")){var d=e[Dt];d&&(l=ct([l,"label:"+d+";"]))}c+=t.key+"-"+l.name;var p={};for(var f in e)!ht.call(e,f)||"css"===f||f===xt||"production"!==process.env.NODE_ENV&&f===Dt||(p[f]=e[f]);return p.ref=u,p.className=c,r(a,null,r(Gt,{cache:t,serialized:l,isStringTag:"string"==typeof i}),r(i,p))}));function Tt(e,t,u){return ht.call(t,"css")?g(Ot,wt(e,t),u):g(e,t,u)}function Nt(e,t,u){return ht.call(t,"css")?b(Ot,wt(e,t),u):b(e,t,u)}"production"!==process.env.NODE_ENV&&(Ot.displayName="EmotionCssPropInternal");var kt=function(e,t){var u=arguments;if(null==t||!ht.call(t,"css"))return r.apply(void 0,u);var n=u.length,o=new Array(n);o[0]=Ot,o[1]=wt(e,t);for(var i=2;i<n;i++)o[i]=u[i];return r.apply(null,o)},Vt=!1,Rt=At((function(e,t){"production"===process.env.NODE_ENV||Vt||!e.className&&!e.css||(console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?"),Vt=!0);var u=e.styles,o=ct([u],void 0,n(Ct));if(!bt){for(var i,a=o.name,c=o.styles,l=o.next;void 0!==l;)a+=" "+l.name,c+=l.styles,l=l.next;var d=!0===t.compat,p=t.insert("",{name:a,styles:c},t.sheet,d);return d?null:r("style",((i={})["data-emotion"]=t.key+"-global "+a,i.dangerouslySetInnerHTML={__html:p},i.nonce=t.sheet.nonce,i))}var f=s();return gt((function(){var e=t.key+"-global",u=new t.sheet.constructor({key:e,nonce:t.sheet.nonce,container:t.sheet.container,speedy:t.sheet.isSpeedy}),n=!1,r=document.querySelector('style[data-emotion="'+e+" "+o.name+'"]');return t.sheet.tags.length&&(u.before=t.sheet.tags[0]),null!==r&&(n=!0,r.setAttribute("data-emotion",e),u.hydrate([r])),f.current=[u,n],function(){u.flush()}}),[t]),gt((function(){var e=f.current,u=e[0];if(e[1])e[1]=!1;else{if(void 0!==o.next&&He(t,o.next,!0),u.tags.length){var n=u.tags[u.tags.length-1].nextElementSibling;u.before=n,u.flush()}t.insert("",o,u,!1)}}),[t,o.name]),null}));function St(){for(var e=arguments.length,t=new Array(e),u=0;u<e;u++)t[u]=arguments[u];return ct(t)}"production"!==process.env.NODE_ENV&&(Rt.displayName="EmotionGlobal");var Wt=function e(t){for(var u=t.length,n=0,r="";n<u;n++){var o=t[n];if(null!=o){var i=void 0;switch(typeof o){case"boolean":break;case"object":if(Array.isArray(o))i=e(o);else for(var a in"production"!==process.env.NODE_ENV&&void 0!==o.styles&&void 0!==o.name&&console.error("You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component."),i="",o)o[a]&&a&&(i&&(i+=" "),i+=a);break;default:i=o}i&&(r&&(r+=" "),r+=i)}}return r};var Zt=function(e){var t,u=e.cache,n=e.serializedArr,o=ft((function(){for(var e="",t=0;t<n.length;t++){var r=He(u,n[t],!1);bt||void 0===r||(e+=r)}if(!bt)return e}));return bt||0===o.length?null:r("style",((t={})["data-emotion"]=u.key+" "+n.map((function(e){return e.name})).join(" "),t.dangerouslySetInnerHTML={__html:o},t.nonce=u.sheet.nonce,t))},Xt=At((function(e,t){var u=!1,o=[],i=function(){if(u&&"production"!==process.env.NODE_ENV)throw new Error("css can only be used during render");for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];var i=ct(n,t.registered);return o.push(i),Pe(t,i,!1),t.key+"-"+i.name},s={css:i,cx:function(){if(u&&"production"!==process.env.NODE_ENV)throw new Error("cx can only be used during render");for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return function(e,t,u){var n=[],r=Me(e,n,u);return n.length<2?u:r+t(n)}(t.registered,i,Wt(n))},theme:n(Ct)},c=e.children(s);return u=!0,r(a,null,r(Zt,{cache:t,serializedArr:o}),c)}));if("production"!==process.env.NODE_ENV&&(Xt.displayName="EmotionClassNames"),"production"!==process.env.NODE_ENV){var Mt="undefined"!=typeof document,Pt="undefined"!=typeof jest||"undefined"!=typeof vi;if(Mt&&!Pt){var Ht="undefined"!=typeof globalThis?globalThis:Mt?window:global,Lt="__EMOTION_REACT_"+"11.10.6".split(".")[0]+"__";Ht[Lt]&&console.warn("You are loading @emotion/react when it is already loaded. Running multiple instances may cause problems. This can happen if multiple versions are used, or if multiple builds of the same version are used."),Ht[Lt]=!0}}function jt(e){return jt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},jt(e)}var zt=/^\s+/,Yt=/\s+$/;function Jt(e,t){if(t=t||{},(e=e||"")instanceof Jt)return e;if(!(this instanceof Jt))return new Jt(e,t);var u=function(e){var t={r:0,g:0,b:0},u=1,n=null,r=null,o=null,i=!1,a=!1;"string"==typeof e&&(e=function(e){e=e.replace(zt,"").replace(Yt,"").toLowerCase();var t,u=!1;if(lu[e])e=lu[e],u=!0;else if("transparent"==e)return{r:0,g:0,b:0,a:0,format:"name"};if(t=Iu.rgb.exec(e))return{r:t[1],g:t[2],b:t[3]};if(t=Iu.rgba.exec(e))return{r:t[1],g:t[2],b:t[3],a:t[4]};if(t=Iu.hsl.exec(e))return{h:t[1],s:t[2],l:t[3]};if(t=Iu.hsla.exec(e))return{h:t[1],s:t[2],l:t[3],a:t[4]};if(t=Iu.hsv.exec(e))return{h:t[1],s:t[2],v:t[3]};if(t=Iu.hsva.exec(e))return{h:t[1],s:t[2],v:t[3],a:t[4]};if(t=Iu.hex8.exec(e))return{r:bu(t[1]),g:bu(t[2]),b:bu(t[3]),a:Cu(t[4]),format:u?"name":"hex8"};if(t=Iu.hex6.exec(e))return{r:bu(t[1]),g:bu(t[2]),b:bu(t[3]),format:u?"name":"hex"};if(t=Iu.hex4.exec(e))return{r:bu(t[1]+""+t[1]),g:bu(t[2]+""+t[2]),b:bu(t[3]+""+t[3]),a:Cu(t[4]+""+t[4]),format:u?"name":"hex8"};if(t=Iu.hex3.exec(e))return{r:bu(t[1]+""+t[1]),g:bu(t[2]+""+t[2]),b:bu(t[3]+""+t[3]),format:u?"name":"hex"};return!1}(e));"object"==jt(e)&&(Fu(e.r)&&Fu(e.g)&&Fu(e.b)?(s=e.r,c=e.g,l=e.b,t={r:255*fu(s,255),g:255*fu(c,255),b:255*fu(l,255)},i=!0,a="%"===String(e.r).substr(-1)?"prgb":"rgb"):Fu(e.h)&&Fu(e.s)&&Fu(e.v)?(n=mu(e.s),r=mu(e.v),t=function(e,t,u){e=6*fu(e,360),t=fu(t,100),u=fu(u,100);var n=Math.floor(e),r=e-n,o=u*(1-t),i=u*(1-r*t),a=u*(1-(1-r)*t),s=n%6,c=[u,i,o,o,a,u][s],l=[a,u,u,i,o,o][s],d=[o,o,a,u,u,i][s];return{r:255*c,g:255*l,b:255*d}}(e.h,n,r),i=!0,a="hsv"):Fu(e.h)&&Fu(e.s)&&Fu(e.l)&&(n=mu(e.s),o=mu(e.l),t=function(e,t,u){var n,r,o;function i(e,t,u){return u<0&&(u+=1),u>1&&(u-=1),u<1/6?e+6*(t-e)*u:u<.5?t:u<2/3?e+(t-e)*(2/3-u)*6:e}if(e=fu(e,360),t=fu(t,100),u=fu(u,100),0===t)n=r=o=u;else{var a=u<.5?u*(1+t):u+t-u*t,s=2*u-a;n=i(s,a,e+1/3),r=i(s,a,e),o=i(s,a,e-1/3)}return{r:255*n,g:255*r,b:255*o}}(e.h,n,o),i=!0,a="hsl"),e.hasOwnProperty("a")&&(u=e.a));var s,c,l;return u=pu(u),{ok:i,format:e.format||a,r:Math.min(255,Math.max(t.r,0)),g:Math.min(255,Math.max(t.g,0)),b:Math.min(255,Math.max(t.b,0)),a:u}}(e);this._originalInput=e,this._r=u.r,this._g=u.g,this._b=u.b,this._a=u.a,this._roundA=Math.round(100*this._a)/100,this._format=t.format||u.format,this._gradientType=t.gradientType,this._r<1&&(this._r=Math.round(this._r)),this._g<1&&(this._g=Math.round(this._g)),this._b<1&&(this._b=Math.round(this._b)),this._ok=u.ok}function _t(e,t,u){e=fu(e,255),t=fu(t,255),u=fu(u,255);var n,r,o=Math.max(e,t,u),i=Math.min(e,t,u),a=(o+i)/2;if(o==i)n=r=0;else{var s=o-i;switch(r=a>.5?s/(2-o-i):s/(o+i),o){case e:n=(t-u)/s+(t<u?6:0);break;case t:n=(u-e)/s+2;break;case u:n=(e-t)/s+4}n/=6}return{h:n,s:r,l:a}}function Ut(e,t,u){e=fu(e,255),t=fu(t,255),u=fu(u,255);var n,r,o=Math.max(e,t,u),i=Math.min(e,t,u),a=o,s=o-i;if(r=0===o?0:s/o,o==i)n=0;else{switch(o){case e:n=(t-u)/s+(t<u?6:0);break;case t:n=(u-e)/s+2;break;case u:n=(e-t)/s+4}n/=6}return{h:n,s:r,v:a}}function Qt(e,t,u,n){var r=[hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16))];return n&&r[0].charAt(0)==r[0].charAt(1)&&r[1].charAt(0)==r[1].charAt(1)&&r[2].charAt(0)==r[2].charAt(1)?r[0].charAt(0)+r[1].charAt(0)+r[2].charAt(0):r.join("")}function $t(e,t,u,n){return[hu(Au(n)),hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16))].join("")}function Kt(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.s-=t/100,u.s=gu(u.s),Jt(u)}function qt(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.s+=t/100,u.s=gu(u.s),Jt(u)}function eu(e){return Jt(e).desaturate(100)}function tu(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.l+=t/100,u.l=gu(u.l),Jt(u)}function uu(e,t){t=0===t?0:t||10;var u=Jt(e).toRgb();return u.r=Math.max(0,Math.min(255,u.r-Math.round(-t/100*255))),u.g=Math.max(0,Math.min(255,u.g-Math.round(-t/100*255))),u.b=Math.max(0,Math.min(255,u.b-Math.round(-t/100*255))),Jt(u)}function nu(e,t){t=0===t?0:t||10;var u=Jt(e).toHsl();return u.l-=t/100,u.l=gu(u.l),Jt(u)}function ru(e,t){var u=Jt(e).toHsl(),n=(u.h+t)%360;return u.h=n<0?360+n:n,Jt(u)}function ou(e){var t=Jt(e).toHsl();return t.h=(t.h+180)%360,Jt(t)}function iu(e,t){if(isNaN(t)||t<=0)throw new Error("Argument to polyad must be a positive number");for(var u=Jt(e).toHsl(),n=[Jt(e)],r=360/t,o=1;o<t;o++)n.push(Jt({h:(u.h+o*r)%360,s:u.s,l:u.l}));return n}function au(e){var t=Jt(e).toHsl(),u=t.h;return[Jt(e),Jt({h:(u+72)%360,s:t.s,l:t.l}),Jt({h:(u+216)%360,s:t.s,l:t.l})]}function su(e,t,u){t=t||6,u=u||30;var n=Jt(e).toHsl(),r=360/u,o=[Jt(e)];for(n.h=(n.h-(r*t>>1)+720)%360;--t;)n.h=(n.h+r)%360,o.push(Jt(n));return o}function cu(e,t){t=t||6;for(var u=Jt(e).toHsv(),n=u.h,r=u.s,o=u.v,i=[],a=1/t;t--;)i.push(Jt({h:n,s:r,v:o})),o=(o+a)%1;return i}Jt.prototype={isDark:function(){return this.getBrightness()<128},isLight:function(){return!this.isDark()},isValid:function(){return this._ok},getOriginalInput:function(){return this._originalInput},getFormat:function(){return this._format},getAlpha:function(){return this._a},getBrightness:function(){var e=this.toRgb();return(299*e.r+587*e.g+114*e.b)/1e3},getLuminance:function(){var e,t,u,n=this.toRgb();return e=n.r/255,t=n.g/255,u=n.b/255,.2126*(e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4))+.7152*(t<=.03928?t/12.92:Math.pow((t+.055)/1.055,2.4))+.0722*(u<=.03928?u/12.92:Math.pow((u+.055)/1.055,2.4))},setAlpha:function(e){return this._a=pu(e),this._roundA=Math.round(100*this._a)/100,this},toHsv:function(){var e=Ut(this._r,this._g,this._b);return{h:360*e.h,s:e.s,v:e.v,a:this._a}},toHsvString:function(){var e=Ut(this._r,this._g,this._b),t=Math.round(360*e.h),u=Math.round(100*e.s),n=Math.round(100*e.v);return 1==this._a?"hsv("+t+", "+u+"%, "+n+"%)":"hsva("+t+", "+u+"%, "+n+"%, "+this._roundA+")"},toHsl:function(){var e=_t(this._r,this._g,this._b);return{h:360*e.h,s:e.s,l:e.l,a:this._a}},toHslString:function(){var e=_t(this._r,this._g,this._b),t=Math.round(360*e.h),u=Math.round(100*e.s),n=Math.round(100*e.l);return 1==this._a?"hsl("+t+", "+u+"%, "+n+"%)":"hsla("+t+", "+u+"%, "+n+"%, "+this._roundA+")"},toHex:function(e){return Qt(this._r,this._g,this._b,e)},toHexString:function(e){return"#"+this.toHex(e)},toHex8:function(e){return function(e,t,u,n,r){var o=[hu(Math.round(e).toString(16)),hu(Math.round(t).toString(16)),hu(Math.round(u).toString(16)),hu(Au(n))];if(r&&o[0].charAt(0)==o[0].charAt(1)&&o[1].charAt(0)==o[1].charAt(1)&&o[2].charAt(0)==o[2].charAt(1)&&o[3].charAt(0)==o[3].charAt(1))return o[0].charAt(0)+o[1].charAt(0)+o[2].charAt(0)+o[3].charAt(0);return o.join("")}(this._r,this._g,this._b,this._a,e)},toHex8String:function(e){return"#"+this.toHex8(e)},toRgb:function(){return{r:Math.round(this._r),g:Math.round(this._g),b:Math.round(this._b),a:this._a}},toRgbString:function(){return 1==this._a?"rgb("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+")":"rgba("+Math.round(this._r)+", "+Math.round(this._g)+", "+Math.round(this._b)+", "+this._roundA+")"},toPercentageRgb:function(){return{r:Math.round(100*fu(this._r,255))+"%",g:Math.round(100*fu(this._g,255))+"%",b:Math.round(100*fu(this._b,255))+"%",a:this._a}},toPercentageRgbString:function(){return 1==this._a?"rgb("+Math.round(100*fu(this._r,255))+"%, "+Math.round(100*fu(this._g,255))+"%, "+Math.round(100*fu(this._b,255))+"%)":"rgba("+Math.round(100*fu(this._r,255))+"%, "+Math.round(100*fu(this._g,255))+"%, "+Math.round(100*fu(this._b,255))+"%, "+this._roundA+")"},toName:function(){return 0===this._a?"transparent":!(this._a<1)&&(du[Qt(this._r,this._g,this._b,!0)]||!1)},toFilter:function(e){var t="#"+$t(this._r,this._g,this._b,this._a),u=t,n=this._gradientType?"GradientType = 1, ":"";if(e){var r=Jt(e);u="#"+$t(r._r,r._g,r._b,r._a)}return"progid:DXImageTransform.Microsoft.gradient("+n+"startColorstr="+t+",endColorstr="+u+")"},toString:function(e){var t=!!e;e=e||this._format;var u=!1,n=this._a<1&&this._a>=0;return t||!n||"hex"!==e&&"hex6"!==e&&"hex3"!==e&&"hex4"!==e&&"hex8"!==e&&"name"!==e?("rgb"===e&&(u=this.toRgbString()),"prgb"===e&&(u=this.toPercentageRgbString()),"hex"!==e&&"hex6"!==e||(u=this.toHexString()),"hex3"===e&&(u=this.toHexString(!0)),"hex4"===e&&(u=this.toHex8String(!0)),"hex8"===e&&(u=this.toHex8String()),"name"===e&&(u=this.toName()),"hsl"===e&&(u=this.toHslString()),"hsv"===e&&(u=this.toHsvString()),u||this.toHexString()):"name"===e&&0===this._a?this.toName():this.toRgbString()},clone:function(){return Jt(this.toString())},_applyModification:function(e,t){var u=e.apply(null,[this].concat([].slice.call(t)));return this._r=u._r,this._g=u._g,this._b=u._b,this.setAlpha(u._a),this},lighten:function(){return this._applyModification(tu,arguments)},brighten:function(){return this._applyModification(uu,arguments)},darken:function(){return this._applyModification(nu,arguments)},desaturate:function(){return this._applyModification(Kt,arguments)},saturate:function(){return this._applyModification(qt,arguments)},greyscale:function(){return this._applyModification(eu,arguments)},spin:function(){return this._applyModification(ru,arguments)},_applyCombination:function(e,t){return e.apply(null,[this].concat([].slice.call(t)))},analogous:function(){return this._applyCombination(su,arguments)},complement:function(){return this._applyCombination(ou,arguments)},monochromatic:function(){return this._applyCombination(cu,arguments)},splitcomplement:function(){return this._applyCombination(au,arguments)},triad:function(){return this._applyCombination(iu,[3])},tetrad:function(){return this._applyCombination(iu,[4])}},Jt.fromRatio=function(e,t){if("object"==jt(e)){var u={};for(var n in e)e.hasOwnProperty(n)&&(u[n]="a"===n?e[n]:mu(e[n]));e=u}return Jt(e,t)},Jt.equals=function(e,t){return!(!e||!t)&&Jt(e).toRgbString()==Jt(t).toRgbString()},Jt.random=function(){return Jt.fromRatio({r:Math.random(),g:Math.random(),b:Math.random()})},Jt.mix=function(e,t,u){u=0===u?0:u||50;var n=Jt(e).toRgb(),r=Jt(t).toRgb(),o=u/100;return Jt({r:(r.r-n.r)*o+n.r,g:(r.g-n.g)*o+n.g,b:(r.b-n.b)*o+n.b,a:(r.a-n.a)*o+n.a})},Jt.readability=function(e,t){var u=Jt(e),n=Jt(t);return(Math.max(u.getLuminance(),n.getLuminance())+.05)/(Math.min(u.getLuminance(),n.getLuminance())+.05)},Jt.isReadable=function(e,t,u){var n,r,o=Jt.readability(e,t);switch(r=!1,(n=function(e){var t,u;t=((e=e||{level:"AA",size:"small"}).level||"AA").toUpperCase(),u=(e.size||"small").toLowerCase(),"AA"!==t&&"AAA"!==t&&(t="AA");"small"!==u&&"large"!==u&&(u="small");return{level:t,size:u}}(u)).level+n.size){case"AAsmall":case"AAAlarge":r=o>=4.5;break;case"AAlarge":r=o>=3;break;case"AAAsmall":r=o>=7}return r},Jt.mostReadable=function(e,t,u){var n,r,o,i,a=null,s=0;r=(u=u||{}).includeFallbackColors,o=u.level,i=u.size;for(var c=0;c<t.length;c++)(n=Jt.readability(e,t[c]))>s&&(s=n,a=Jt(t[c]));return Jt.isReadable(e,a,{level:o,size:i})||!r?a:(u.includeFallbackColors=!1,Jt.mostReadable(e,["#fff","#000"],u))};var lu=Jt.names={aliceblue:"f0f8ff",antiquewhite:"faebd7",aqua:"0ff",aquamarine:"7fffd4",azure:"f0ffff",beige:"f5f5dc",bisque:"ffe4c4",black:"000",blanchedalmond:"ffebcd",blue:"00f",blueviolet:"8a2be2",brown:"a52a2a",burlywood:"deb887",burntsienna:"ea7e5d",cadetblue:"5f9ea0",chartreuse:"7fff00",chocolate:"d2691e",coral:"ff7f50",cornflowerblue:"6495ed",cornsilk:"fff8dc",crimson:"dc143c",cyan:"0ff",darkblue:"00008b",darkcyan:"008b8b",darkgoldenrod:"b8860b",darkgray:"a9a9a9",darkgreen:"006400",darkgrey:"a9a9a9",darkkhaki:"bdb76b",darkmagenta:"8b008b",darkolivegreen:"556b2f",darkorange:"ff8c00",darkorchid:"9932cc",darkred:"8b0000",darksalmon:"e9967a",darkseagreen:"8fbc8f",darkslateblue:"483d8b",darkslategray:"2f4f4f",darkslategrey:"2f4f4f",darkturquoise:"00ced1",darkviolet:"9400d3",deeppink:"ff1493",deepskyblue:"00bfff",dimgray:"696969",dimgrey:"696969",dodgerblue:"1e90ff",firebrick:"b22222",floralwhite:"fffaf0",forestgreen:"228b22",fuchsia:"f0f",gainsboro:"dcdcdc",ghostwhite:"f8f8ff",gold:"ffd700",goldenrod:"daa520",gray:"808080",green:"008000",greenyellow:"adff2f",grey:"808080",honeydew:"f0fff0",hotpink:"ff69b4",indianred:"cd5c5c",indigo:"4b0082",ivory:"fffff0",khaki:"f0e68c",lavender:"e6e6fa",lavenderblush:"fff0f5",lawngreen:"7cfc00",lemonchiffon:"fffacd",lightblue:"add8e6",lightcoral:"f08080",lightcyan:"e0ffff",lightgoldenrodyellow:"fafad2",lightgray:"d3d3d3",lightgreen:"90ee90",lightgrey:"d3d3d3",lightpink:"ffb6c1",lightsalmon:"ffa07a",lightseagreen:"20b2aa",lightskyblue:"87cefa",lightslategray:"789",lightslategrey:"789",lightsteelblue:"b0c4de",lightyellow:"ffffe0",lime:"0f0",limegreen:"32cd32",linen:"faf0e6",magenta:"f0f",maroon:"800000",mediumaquamarine:"66cdaa",mediumblue:"0000cd",mediumorchid:"ba55d3",mediumpurple:"9370db",mediumseagreen:"3cb371",mediumslateblue:"7b68ee",mediumspringgreen:"00fa9a",mediumturquoise:"48d1cc",mediumvioletred:"c71585",midnightblue:"191970",mintcream:"f5fffa",mistyrose:"ffe4e1",moccasin:"ffe4b5",navajowhite:"ffdead",navy:"000080",oldlace:"fdf5e6",olive:"808000",olivedrab:"6b8e23",orange:"ffa500",orangered:"ff4500",orchid:"da70d6",palegoldenrod:"eee8aa",palegreen:"98fb98",paleturquoise:"afeeee",palevioletred:"db7093",papayawhip:"ffefd5",peachpuff:"ffdab9",peru:"cd853f",pink:"ffc0cb",plum:"dda0dd",powderblue:"b0e0e6",purple:"800080",rebeccapurple:"663399",red:"f00",rosybrown:"bc8f8f",royalblue:"4169e1",saddlebrown:"8b4513",salmon:"fa8072",sandybrown:"f4a460",seagreen:"2e8b57",seashell:"fff5ee",sienna:"a0522d",silver:"c0c0c0",skyblue:"87ceeb",slateblue:"6a5acd",slategray:"708090",slategrey:"708090",snow:"fffafa",springgreen:"00ff7f",steelblue:"4682b4",tan:"d2b48c",teal:"008080",thistle:"d8bfd8",tomato:"ff6347",turquoise:"40e0d0",violet:"ee82ee",wheat:"f5deb3",white:"fff",whitesmoke:"f5f5f5",yellow:"ff0",yellowgreen:"9acd32"},du=Jt.hexNames=function(e){var t={};for(var u in e)e.hasOwnProperty(u)&&(t[e[u]]=u);return t}(lu);function pu(e){return e=parseFloat(e),(isNaN(e)||e<0||e>1)&&(e=1),e}function fu(e,t){(function(e){return"string"==typeof e&&-1!=e.indexOf(".")&&1===parseFloat(e)})(e)&&(e="100%");var u=function(e){return"string"==typeof e&&-1!=e.indexOf("%")}(e);return e=Math.min(t,Math.max(0,parseFloat(e))),u&&(e=parseInt(e*t,10)/100),Math.abs(e-t)<1e-6?1:e%t/parseFloat(t)}function gu(e){return Math.min(1,Math.max(0,e))}function bu(e){return parseInt(e,16)}function hu(e){return 1==e.length?"0"+e:""+e}function mu(e){return e<=1&&(e=100*e+"%"),e}function Au(e){return Math.round(255*parseFloat(e)).toString(16)}function Cu(e){return bu(e)/255}var vu,Eu,yu,Iu=(Eu="[\\s|\\(]+("+(vu="(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)")+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")\\s*\\)?",yu="[\\s|\\(]+("+vu+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")[,|\\s]+("+vu+")\\s*\\)?",{CSS_UNIT:new RegExp(vu),rgb:new RegExp("rgb"+Eu),rgba:new RegExp("rgba"+yu),hsl:new RegExp("hsl"+Eu),hsla:new RegExp("hsla"+yu),hsv:new RegExp("hsv"+Eu),hsva:new RegExp("hsva"+yu),hex3:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex6:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,hex4:/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,hex8:/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/});function Fu(e){return!!Iu.CSS_UNIT.exec(e)}const Bu={colors:{primary:{main:"#1d4e89",contrastText:"#ffffff"},secondary:{main:"#00b2ca",contrastText:"#ffffff"},tertiary:{main:"#7dcfb6",contrastText:"#ffffff"},statusOk:{main:"#00e200",contrastText:"#ffffff"},statusWarning:{main:"#efff00",contrastText:"#000000"},statusCritical:{main:"#ff3838",contrastText:"#ffffff"},statusNeutral:{main:"#7b8089",contrastText:"#ffffff"}}},xu=t.createContext(Bu),Du=e=>{const u=c((()=>e.theme?e.theme:Bu),[e.theme]);return t.createElement(xu.Provider,{value:u},t.createElement(Et,{theme:u},e.children))};const wu=()=>{const e=n(Ct),t=(u=e,0===Object.keys(u).length?Bu:e);var u;return{colors:t.colors,getColor:e=>{if(t.colors[e])return t.colors[e];const u=function(e,t){const u=t.split(".");let n=e;for(const e of u){if(!n||"object"!=typeof n||!(e in n))return;n=n[e]}return n}(Object.assign({},t.colors),e);if(u&&"string"==typeof u){const e=Jt(u);if(e.isValid())return{main:u,contrastText:Jt.mostReadable(e,["#fff","#000"]).toHexString()}}const n=Jt(e);return n.isValid()?{main:e,contrastText:Jt.mostReadable(n,["#fff","#000"]).toHexString()}:t.colors.primary}}},Gu=t=>{const u=wu(),n=e.useMemo((()=>t.color?u.getColor(t.color||"primary"):u.colors.primary),[t.color,u]),r=_n.button`
     padding: 1em 1.2em;
     transition: 0.25s;
     border-radius: 4px;