styled-components 6.0.0-alpha.7 → 6.0.0-beta.0

package/dist/styled-components.browser.esm.js

@@ -1,2 +1,2 @@
-import e from"@emotion/is-prop-valid";import t,{useRef as n,useState as o,useContext as s,useMemo as r,useEffect as i,createElement as a,useDebugValue as c}from"react";import l from"shallowequal";import{prefixer as u,stringify as d,serialize as h,compile as p,middleware as m,RULESET as f}from"stylis";import y from"@emotion/unitless";const g="undefined"!=typeof process&&(process.env.REACT_APP_SC_ATTR||process.env.SC_ATTR)||"data-styled",S="6.0.0-alpha.7",v="undefined"!=typeof window&&"HTMLElement"in window,w=Boolean("boolean"==typeof SC_DISABLE_SPEEDY?SC_DISABLE_SPEEDY:"undefined"!=typeof process&&void 0!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&""!==process.env.REACT_APP_SC_DISABLE_SPEEDY?"false"!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&process.env.REACT_APP_SC_DISABLE_SPEEDY:"undefined"!=typeof process&&void 0!==process.env.SC_DISABLE_SPEEDY&&""!==process.env.SC_DISABLE_SPEEDY?"false"!==process.env.SC_DISABLE_SPEEDY&&process.env.SC_DISABLE_SPEEDY:"production"!==process.env.NODE_ENV),b={},E=/invalid hook call/i,N=new Set,_=(e,t)=>{if("production"!==process.env.NODE_ENV){const o=`The component ${e}${t?` with the id of "${t}"`:""} has been created dynamically.\nYou may see this warning because you've called styled inside another component.\nTo resolve this only create new StyledComponents outside of any render method and function component.`,s=console.error;try{let e=!0;console.error=(t,...n)=>{E.test(t)?(e=!1,N.delete(o)):s(t,...n)},n(),e&&!N.has(o)&&(console.warn(o),N.add(o))}catch(e){E.test(e.message)&&N.delete(o)}finally{console.error=s}}},$=Object.freeze([]),C=Object.freeze({});function A(e,t,n=C){return e.theme!==n.theme&&e.theme||t||n.theme}var P=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","foreignObject","g","image","line","linearGradient","marker","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"];const I=/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g,O=/(^-|-$)/g;function R(e){return e.replace(I,"-").replace(O,"")}const D=/(a)(d)/gi,j=e=>String.fromCharCode(e+(e>25?39:97));function T(e){let t,n="";for(t=Math.abs(e);t>52;t=t/52|0)n=j(t%52)+n;return(j(t%52)+n).replace(D,"$1-$2")}const x=(e,t)=>{let n=t.length;for(;n;)e=33*e^t.charCodeAt(--n);return e},k=e=>x(5381,e);function V(e){return T(k(e)>>>0)}function z(e){return"production"!==process.env.NODE_ENV&&"string"==typeof e&&e||e.displayName||e.name||"Component"}function B(e){return"string"==typeof e&&("production"===process.env.NODE_ENV||e.charAt(0)===e.charAt(0).toLowerCase())}function M(e){return B(e)?`styled.${e}`:`Styled(${z(e)})`}const L="function"==typeof Symbol&&Symbol.for,F=L?Symbol.for("react.memo"):60115,G=L?Symbol.for("react.forward_ref"):60112,Y={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},H={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},q={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},W={[G]:{$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},[F]:q};function U(e){return("type"in(t=e)&&t.type.$$typeof)===F?q:"$$typeof"in e?W[e.$$typeof]:Y;var t}const J=Object.defineProperty,X=Object.getOwnPropertyNames,Z=Object.getOwnPropertySymbols,K=Object.getOwnPropertyDescriptor,Q=Object.getPrototypeOf,ee=Object.prototype;function te(e,t,n){if("string"!=typeof t){if(ee){const o=Q(t);o&&o!==ee&&te(e,o,n)}let o=X(t);Z&&(o=o.concat(Z(t)));const s=U(e),r=U(t);for(let i=0;i<o.length;++i){const a=o[i];if(!(a in H||n&&n[a]||r&&a in r||s&&a in s)){const n=K(t,a);try{J(e,a,n)}catch(e){}}}}return e}function ne(e){return"object"==typeof e&&"styledComponentId"in e}function oe(e){return!(null===e||"object"!=typeof e||e.constructor&&"Object"!==e.constructor.name||"[object Object]"!==(e.toString?e.toString():Object.prototype.toString.call(e))||"props"in e&&(e.$$typeof||void 0===e.constructor))}function se(e,t,n=!1){if(!n&&!oe(e)&&!Array.isArray(e))return t;if(Array.isArray(t))for(let n=0;n<t.length;n++)e[n]=se(e[n],t[n]);else if(oe(t))for(const n in t)e[n]=se(e[n],t[n]);return e}const re="production"!==process.env.NODE_ENV?{1:"Cannot create styled-component for component: %s.\n\n",2:"Can't collect styles once you've consumed a `ServerStyleSheet`'s styles! `ServerStyleSheet` is a one off instance for each server-side render cycle.\n\n- Are you trying to reuse it across renders?\n- Are you accidentally calling collectStyles twice?\n\n",3:"Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.\n\n",4:"The `StyleSheetManager` expects a valid target or sheet prop!\n\n- Does this error occur on the client and is your target falsy?\n- Does this error occur on the server and is the sheet falsy?\n\n",5:"The clone method cannot be used on the client!\n\n- Are you running in a client-like environment on the server?\n- Are you trying to run SSR on the client?\n\n",6:"Trying to insert a new style tag, but the given Node is unmounted!\n\n- Are you using a custom target that isn't mounted?\n- Does your document not have a valid head element?\n- Have you accidentally removed a style tag manually?\n\n",7:'ThemeProvider: Please return an object from your "theme" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n',8:'ThemeProvider: Please make your "theme" prop an object.\n\n',9:"Missing document `<head>`\n\n",10:"Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021\n\n",11:"_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.\n\n",12:"It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\`\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\n\n",13:"%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.\n\n",14:'ThemeProvider: "theme" prop is required.\n\n',15:"A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to `<StyleSheetManager stylisPlugins={[]}>`, please make sure each plugin is uniquely-named, e.g.\n\n```js\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\n```\n\n",16:"Reached the limit of how many styled components may be created at group %s.\nYou may only create up to 1,073,741,824 components. If you're creating components dynamically,\nas for instance in your render method then you may be running into this limitation.\n\n",17:"CSSStyleSheet could not be found on HTMLStyleElement.\nHas styled-components' style tag been unmounted or altered by another script?\n"}:{};function ie(e,...t){return"production"===process.env.NODE_ENV?new Error(`An error occurred. See https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/utils/errors.md#${e} for more information.${t.length>0?` Args: ${t.join(", ")}`:""}`):new Error(function(...e){let t=e[0];const n=[];for(let t=1,o=e.length;t<o;t+=1)n.push(e[t]);return n.forEach((e=>{t=t.replace(/%[a-z]/,e)})),t}(re[e],...t).trim())}let ae=new Map,ce=new Map,le=1;const ue=e=>{if(ae.has(e))return ae.get(e);for(;ce.has(le);)le++;const t=le++;if("production"!==process.env.NODE_ENV&&((0|t)<0||t>1073741824))throw ie(16,`${t}`);return ae.set(e,t),ce.set(t,e),t},de=e=>ce.get(e),he=(e,t)=>{ae.set(e,t),ce.set(t,e)},pe=`style[${g}][data-styled-version="6.0.0-alpha.7"]`,me=new RegExp(`^${g}\\.g(\\d+)\\[id="([\\w\\d-]+)"\\].*?"([^"]*)`),fe=(e,t,n)=>{const o=n.split(",");let s;for(let n=0,r=o.length;n<r;n++)(s=o[n])&&e.registerName(t,s)},ye=(e,t)=>{const n=(t.textContent??"").split("/*!sc*/\n"),o=[];for(let t=0,s=n.length;t<s;t++){const s=n[t].trim();if(!s)continue;const r=s.match(me);if(r){const t=0|parseInt(r[1],10),n=r[2];0!==t&&(he(n,t),fe(e,n,r[3]),e.getTag().insertRules(t,o)),o.length=0}else o.push(s)}};function ge(){return"undefined"!=typeof __webpack_nonce__?__webpack_nonce__:null}const Se=e=>{const t=document.head,n=e||t,o=document.createElement("style"),s=(e=>{const{childNodes:t}=e;for(let e=t.length;e>=0;e--){const n=t[e];if(n&&1===n.nodeType&&n.hasAttribute(g))return n}})(n),r=void 0!==s?s.nextSibling:null;o.setAttribute(g,"active"),o.setAttribute("data-styled-version","6.0.0-alpha.7");const i=ge();return i&&o.setAttribute("nonce",i),n.insertBefore(o,r),o};let ve=v;const we={isServer:!v,useCSSOMInjection:!w};class be{gs;names;options;server;tag;static registerId(e){return ue(e)}constructor(e=C,t={},n){this.options={...we,...e},this.gs=t,this.names=new Map(n),this.server=!!e.isServer,!this.server&&v&&ve&&(ve=!1,(e=>{const t=document.querySelectorAll(pe);for(let n=0,o=t.length;n<o;n++){const o=t[n];o&&"active"!==o.getAttribute(g)&&(ye(e,o),o.parentNode&&o.parentNode.removeChild(o))}})(this))}reconstructWithOptions(e,t=!0){return new be({...this.options,...e},this.gs,t&&this.names||void 0)}allocateGSInstance(e){return this.gs[e]=(this.gs[e]||0)+1}getTag(){return this.tag||(this.tag=(e=(({isServer:e,useCSSOMInjection:t,target:n})=>e?new class{rules;length;constructor(e){this.rules=[],this.length=0}insertRule(e,t){return e<=this.length&&(this.rules.splice(e,0,t),this.length++,!0)}deleteRule(e){this.rules.splice(e,1),this.length--}getRule(e){return e<this.length?this.rules[e]:""}}(n):t?new class{element;sheet;length;constructor(e){const t=this.element=Se(e);t.appendChild(document.createTextNode("")),this.sheet=(e=>{if(e.sheet)return e.sheet;const{styleSheets:t}=document;for(let n=0,o=t.length;n<o;n++){const o=t[n];if(o.ownerNode===e)return o}throw ie(17)})(t),this.length=0}insertRule(e,t){try{return this.sheet.insertRule(t,e),this.length++,!0}catch(e){return!1}}deleteRule(e){this.sheet.deleteRule(e),this.length--}getRule(e){const t=this.sheet.cssRules[e];return void 0!==t&&"string"==typeof t.cssText?t.cssText:""}}(n):new class{element;nodes;length;constructor(e){const t=this.element=Se(e);this.nodes=t.childNodes,this.length=0}insertRule(e,t){if(e<=this.length&&e>=0){const n=document.createTextNode(t),o=this.nodes[e];return this.element.insertBefore(n,o||null),this.length++,!0}return!1}deleteRule(e){this.element.removeChild(this.nodes[e]),this.length--}getRule(e){return e<this.length?this.nodes[e].textContent:""}}(n))(this.options),new class{groupSizes;length;tag;constructor(e){this.groupSizes=new Uint32Array(512),this.length=512,this.tag=e}indexOfGroup(e){let t=0;for(let n=0;n<e;n++)t+=this.groupSizes[n];return t}insertRules(e,t){if(e>=this.groupSizes.length){const t=this.groupSizes,n=t.length;let o=n;for(;e>=o;)if(o<<=1,o<0)throw ie(16,`${e}`);this.groupSizes=new Uint32Array(o),this.groupSizes.set(t),this.length=o;for(let e=n;e<o;e++)this.groupSizes[e]=0}let n=this.indexOfGroup(e+1);if(Array.isArray(t))for(let o=0,s=t.length;o<s;o++)this.tag.insertRule(n,t[o])&&(this.groupSizes[e]++,n++);else this.tag.insertRule(n,t)&&this.groupSizes[e]++}clearGroup(e){if(e<this.length){const t=this.groupSizes[e],n=this.indexOfGroup(e),o=n+t;this.groupSizes[e]=0;for(let e=n;e<o;e++)this.tag.deleteRule(n)}}getGroup(e){let t="";if(e>=this.length||0===this.groupSizes[e])return t;const n=this.groupSizes[e],o=this.indexOfGroup(e),s=o+n;for(let e=o;e<s;e++)t+=`${this.tag.getRule(e)}/*!sc*/\n`;return t}}(e)));var e}hasNameForId(e,t){return this.names.has(e)&&this.names.get(e).has(t)}registerName(e,t){if(ue(e),this.names.has(e))this.names.get(e).add(t);else{const n=new Set;n.add(t),this.names.set(e,n)}}insertRules(e,t,n){this.registerName(e,t),this.getTag().insertRules(ue(e),n)}clearNames(e){this.names.has(e)&&this.names.get(e).clear()}clearRules(e){this.getTag().clearGroup(ue(e)),this.clearNames(e)}clearTag(){this.tag=void 0}toString(){return(e=>{const t=e.getTag(),{length:n}=t;let o="";for(let s=0;s<n;s++){const n=de(s);if(void 0===n)continue;const r=e.names.get(n),i=t.getGroup(s);if(void 0===r||0===i.length)continue;const a=`${g}.g${s}[id="${n}"]`;let c="";void 0!==r&&r.forEach((e=>{e.length>0&&(c+=`${e},`)})),o+=`${i}${a}{content:"${c}"}/*!sc*/\n`}return o})(this)}}const Ee=/^\s*\/\/.*$/gm,Ne=[":","[",".","#"];function _e({options:e=C,plugins:t=$}=C){let n,o,s,r;const i=(e,t,s)=>0===t&&Ne.includes(s[o.length])||s.match(r)?e:`.${n}`,a=e=>{if(e.type===f&&e.value.includes("&")){const t=e.props;t[0]=t[0].replace(s,i)}},c=(i,c="",l="",f="&")=>{let y=i.replace(Ee,"");n=f,o=c,s=new RegExp(`\\${o}\\b`,"g"),r=new RegExp(`(\\${o}\\b){2,}`);const g=t.slice();return(e.prefix||void 0===e.prefix)&&g.unshift(u),g.push(a,d),h(p(l||c?`${l} ${c} { ${y} }`:y),m(g))};return c.hash=t.length?t.reduce(((e,t)=>(t.name||ie(15),x(e,t.name))),5381).toString():"",c}const $e=t.createContext(void 0),Ce=$e.Consumer,Ae=t.createContext(void 0);Ae.Consumer;const Pe=new be,Ie=_e();function Oe(){return s($e)||Pe}function Re(){return s(Ae)||Ie}function De(e){const[n,s]=o(e.stylisPlugins),a=Oe(),c=r((()=>{let t=a;return e.sheet?t=e.sheet:e.target&&(t=t.reconstructWithOptions({target:e.target},!1)),e.disableCSSOMInjection&&(t=t.reconstructWithOptions({useCSSOMInjection:!1})),t}),[e.disableCSSOMInjection,e.sheet,e.target]),u=r((()=>_e({options:{prefix:!e.disableVendorPrefixes},plugins:n})),[e.disableVendorPrefixes,n]);return i((()=>{l(n,e.stylisPlugins)||s(e.stylisPlugins)}),[e.stylisPlugins]),t.createElement($e.Provider,{value:c},t.createElement(Ae.Provider,{value:u},"production"!==process.env.NODE_ENV?t.Children.only(e.children):e.children))}class je{id;name;rules;constructor(e,t){this.name=e,this.id=`sc-keyframes-${e}`,this.rules=t}inject=(e,t=Ie)=>{const n=this.name+t.hash;e.hasNameForId(this.id,n)||e.insertRules(this.id,n,t(this.rules,n,"@keyframes"))};toString=()=>{throw ie(12,String(this.name))};getName(e=Ie){return this.name+e.hash}}const Te=/([A-Z])/,xe=/([A-Z])/g,ke=/^ms-/,Ve=e=>`-${e.toLowerCase()}`;function ze(e){return Te.test(e)?e.replace(xe,Ve).replace(ke,"-ms-"):e}function Be(e){return"function"==typeof e}const Me=e=>null==e||!1===e||""===e,Le=(e,t)=>{const n=[];for(const t in e)e.hasOwnProperty(t)&&!Me(e[t])&&(Array.isArray(e[t])&&e[t].isCss||Be(e[t])?n.push(`${ze(t)}:`,e[t],";"):oe(e[t])?n.push(...Le(e[t],t)):n.push(`${ze(t)}: ${o=t,s=e[t],null==s||"boolean"==typeof s||""===s?"":"number"!=typeof s||0===s||o in y?String(s).trim():`${s}px`};`));var o,s;return t?[`${t} {`,...n,"}"]:n};function Fe(e,t,n,o){if(Array.isArray(e)){const s=[];for(let r,i=0,a=e.length;i<a;i+=1)r=Fe(e[i],t,n,o),""!==r&&(Array.isArray(r)?s.push(...r):s.push(r));return s}if(Me(e))return"";if(ne(e))return`.${e.styledComponentId}`;if(Be(e)){if("function"!=typeof(s=e)||s.prototype&&s.prototype.isReactComponent||!t)return e;{const s=e,r=s(t);return"production"===process.env.NODE_ENV||"object"!=typeof r||Array.isArray(r)||r instanceof je||oe(r)||console.error(`${z(s)} is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.`),Fe(r,t,n,o)}}var s;return e instanceof je?n?(e.inject(n,o),e.getName(o)):e:oe(e)?Le(e):e.toString()}function Ge(e){for(let t=0;t<e.length;t+=1){const n=e[t];if(Be(n)&&!ne(n))return!1}return!0}const Ye=k("6.0.0-alpha.7");class He{baseHash;baseStyle;componentId;isStatic;rules;staticRulesId;constructor(e,t,n){this.rules=e,this.staticRulesId="",this.isStatic="production"===process.env.NODE_ENV&&(void 0===n||n.isStatic)&&Ge(e),this.componentId=t,this.baseHash=x(Ye,t),this.baseStyle=n,be.registerId(t)}generateAndInjectStyles(e,t,n){const{componentId:o}=this,s=[];if(this.baseStyle&&s.push(this.baseStyle.generateAndInjectStyles(e,t,n)),this.isStatic&&!n.hash)if(this.staticRulesId&&t.hasNameForId(o,this.staticRulesId))s.push(this.staticRulesId);else{const r=Fe(this.rules,e,t,n).join(""),i=T(x(this.baseHash,r)>>>0);if(!t.hasNameForId(o,i)){const e=n(r,`.${i}`,void 0,o);t.insertRules(o,i,e)}s.push(i),this.staticRulesId=i}else{const{length:r}=this.rules;let i=x(this.baseHash,n.hash),a="";for(let o=0;o<r;o++){const s=this.rules[o];if("string"==typeof s)a+=s,"production"!==process.env.NODE_ENV&&(i=x(i,s+o));else if(s){const r=Fe(s,e,t,n),c=Array.isArray(r)?r.join(""):r;i=x(i,c+o),a+=c}}if(a){const e=T(i>>>0);if(!t.hasNameForId(o,e)){const s=n(a,`.${e}`,void 0,o);t.insertRules(o,e,s)}s.push(e)}}return s.join(" ")}}const qe=t.createContext(void 0),We=qe.Consumer;function Ue(e){const n=s(qe),o=r((()=>function(e,t){if(!e)throw ie(14);if(Be(e)){const n=e(t);if("production"!==process.env.NODE_ENV&&(null===n||Array.isArray(n)||"object"!=typeof n))throw ie(7);return n}if(Array.isArray(e)||"object"!=typeof e)throw ie(8);return t?{...t,...e}:e}(e.theme,n)),[e.theme,n]);return e.children?t.createElement(qe.Provider,{value:o},e.children):null}const Je={};function Xe(e,t){const n="string"!=typeof e?"sc":R(e);Je[n]=(Je[n]||0)+1;const o=`${n}-${V("6.0.0-alpha.7"+n+Je[n])}`;return t?`${t}-${o}`:o}function Ze(n,o,r){const i=ne(n),l=n,u=!B(n),{attrs:d=$,componentId:h=Xe(o.displayName,o.parentComponentId),displayName:p=M(n)}=o,m=o.displayName&&o.componentId?`${R(o.displayName)}-${o.componentId}`:o.componentId||h,f=i&&l.attrs?l.attrs.concat(d).filter(Boolean):d;let{shouldForwardProp:y}=o;if(i&&l.shouldForwardProp){const e=l.shouldForwardProp;if(o.shouldForwardProp){const t=o.shouldForwardProp;y=(n,o,s)=>e(n,o,s)&&t(n,o,s)}else y=e}const g=new He(r,m,i?l.componentStyle:void 0),S=g.isStatic&&0===d.length;function v(t,n){return function(t,n,o,r){const{attrs:i,componentStyle:l,defaultProps:u,foldedComponentIds:d,shouldForwardProp:h,styledComponentId:p,target:m}=t;"production"!==process.env.NODE_ENV&&c(p);const f=A(n,s(qe),u),[y,g]=function(e=C,t,n){const o={...t,theme:e},s={};return n.forEach((e=>{const t="function"==typeof e?e(o):e;let n;for(n in t)o[n]=s[n]="className"===n?(r=s[n],i=t[n],r&&i?`${r} ${i}`:r||i):t[n];var r,i})),[o,s]}(f||C,n,i),S=function(e,t,n,o){const s=Oe(),r=Re(),i=t?e.generateAndInjectStyles(C,s,r):e.generateAndInjectStyles(n,s,r);return"production"!==process.env.NODE_ENV&&c(i),"production"!==process.env.NODE_ENV&&!t&&o&&o(i),i}(l,r,y,"production"!==process.env.NODE_ENV?t.warnTooManyClasses:void 0),v=o,w=g.$as||n.$as||g.as||n.as||m,b=B(w),E=g!==n?{...n,...g}:n,N={};for(const t in E)"$"!==t[0]&&"as"!==t&&("forwardedAs"===t?N.as=E[t]:(h?h(t,e,w):!b||e(t))&&(N[t]=E[t]));return n.style&&g.style!==n.style&&(N.style={...n.style,...g.style}),N[b&&-1===P.indexOf(w)?"class":"className"]=d.concat(p,S!==p?S:null,n.className,g.className).filter(Boolean).join(" "),N.ref=v,a(w,N)}(w,t,n,S)}v.displayName=p;let w=t.forwardRef(v);return w.attrs=f,w.componentStyle=g,w.displayName=p,w.shouldForwardProp=y,w.foldedComponentIds=i?l.foldedComponentIds.concat(l.styledComponentId):$,w.styledComponentId=m,w.target=i?l.target:n,w.withComponent=function(e){const{componentId:t,...n}=o,s=t&&`${t}-${B(e)?e:R(z(e))}`;return Ze(e,{...n,attrs:f,componentId:s},r)},Object.defineProperty(w,"defaultProps",{get(){return this._foldedDefaultProps},set(e){this._foldedDefaultProps=i?function(e={},...t){for(const n of t)se(e,n,!0);return e}({},l.defaultProps,e):e}}),"production"!==process.env.NODE_ENV&&(_(p,m),w.warnTooManyClasses=((e,t)=>{let n={},o=!1;return s=>{if(!o&&(n[s]=!0,Object.keys(n).length>=200)){const s=t?` with the id of "${t}"`:"";console.warn(`Over 200 classes were generated for component ${e}${s}.\nConsider using the attrs method, together with a style object for frequently changed styles.\nExample:\n  const Component = styled.div.attrs(props => ({\n    style: {\n      background: props.background,\n    },\n  }))\`width: 100%;\`\n\n  <Component />`),o=!0,n={}}}})(p,m)),w.toString=()=>`.${w.styledComponentId}`,u&&te(w,n,{attrs:!0,componentStyle:!0,displayName:!0,foldedComponentIds:!0,shouldForwardProp:!0,styledComponentId:!0,target:!0,withComponent:!0}),w}function Ke(e,t){const n=[e[0]];for(let o=0,s=t.length;o<s;o+=1)n.push(t[o],e[o+1]);return n}const Qe=e=>(Array.isArray(e)&&(e.isCss=!0),e);function et(e,...t){if(Be(e)||oe(e))return Qe(Fe(Ke($,[e,...t])));const n=e;return 0===t.length&&1===n.length&&"string"==typeof n[0]?n:Qe(Fe(Ke(n,t)))}function tt(e,t,n=C){if(!t)throw ie(1,t);const o=(o,...s)=>e(t,n,et(o,...s));return o.attrs=o=>tt(e,t,{...n,attrs:Array.prototype.concat(n.attrs,o).filter(Boolean)}),o.withConfig=o=>tt(e,t,{...n,...o}),o}const nt=e=>tt(Ze,e),ot=nt;P.forEach((e=>{ot[e]=nt(e)}));class st{componentId;isStatic;rules;constructor(e,t){this.rules=e,this.componentId=t,this.isStatic=Ge(e),be.registerId(this.componentId+1)}createStyles(e,t,n,o){const s=o(Fe(this.rules,t,n,o).join(""),""),r=this.componentId+e;n.insertRules(r,r,s)}removeStyles(e,t){t.clearRules(this.componentId+e)}renderStyles(e,t,n,o){e>2&&be.registerId(this.componentId+e),this.removeStyles(e,n),this.createStyles(e,t,n,o)}}function rt(e,...n){const o=et(e,...n),s=`sc-global-${V(JSON.stringify(o))}`,r=new st(o,s);"production"!==process.env.NODE_ENV&&_(s);const i=e=>{const n=Oe(),i=Re(),c=t.useContext(qe),l=t.useRef(n.allocateGSInstance(s)).current;return"production"!==process.env.NODE_ENV&&t.Children.count(e.children)&&console.warn(`The global style component ${s} was given child JSX. createGlobalStyle does not render children.`),"production"!==process.env.NODE_ENV&&o.some((e=>"string"==typeof e&&-1!==e.indexOf("@import")))&&console.warn("Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical <link> meta tag to the stylesheet, or simply embedding it manually in your index.html <head> section for a simpler app."),n.server&&a(l,e,n,c,i),(t.useInsertionEffect||t.useLayoutEffect)((()=>{if(!n.server)return a(l,e,n,c,i),()=>r.removeStyles(l,n)}),[l,e,n,c,i]),null};function a(e,t,n,o,s){if(r.isStatic)r.renderStyles(e,b,n,s);else{const a={...t,theme:A(t,o,i.defaultProps)};r.renderStyles(e,a,n,s)}}return t.memo(i)}function it(e,...t){"production"!==process.env.NODE_ENV&&"undefined"!=typeof navigator&&"ReactNative"===navigator.product&&console.warn("`keyframes` cannot be used on ReactNative, only on the web. To do animation in ReactNative please use Animated.");const n=et(e,...t).join(""),o=V(n);return new je(o,n)}function at(e){const n=t.forwardRef(((n,o)=>{const s=A(n,t.useContext(qe),e.defaultProps);return"production"!==process.env.NODE_ENV&&void 0===s&&console.warn(`[withTheme] You are not using a ThemeProvider nor passing a theme prop or a theme in defaultProps in component class "${z(e)}"`),t.createElement(e,{...n,theme:s,ref:o})}));return n.displayName=`WithTheme(${z(e)})`,te(n,e)}const ct=()=>s(qe);class lt{instance;sealed;constructor(){this.instance=new be({isServer:!0}),this.sealed=!1}_emitSheetCSS=()=>{const e=this.instance.toString(),t=ge();return`<style ${[t&&`nonce="${t}"`,`${g}="true"`,'data-styled-version="6.0.0-alpha.7"'].filter(Boolean).join(" ")}>${e}</style>`};collectStyles(e){if(this.sealed)throw ie(2);return t.createElement(De,{sheet:this.instance},e)}getStyleTags=()=>{if(this.sealed)throw ie(2);return this._emitSheetCSS()};getStyleElement=()=>{if(this.sealed)throw ie(2);const e={[g]:"","data-styled-version":"6.0.0-alpha.7",dangerouslySetInnerHTML:{__html:this.instance.toString()}},n=ge();return n&&(e.nonce=n),[t.createElement("style",{...e,key:"sc-0-0"})]};interleaveWithNodeStream(e){throw ie(3)}seal=()=>{this.sealed=!0}}const ut={StyleSheet:be,mainSheet:Pe};"production"!==process.env.NODE_ENV&&"undefined"!=typeof navigator&&"ReactNative"===navigator.product&&console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native"),"production"!==process.env.NODE_ENV&&"test"!==process.env.NODE_ENV&&"undefined"!=typeof window&&(window["__styled-components-init__"]||=0,1===window["__styled-components-init__"]&&console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info."),window["__styled-components-init__"]+=1);export{lt as ServerStyleSheet,Ce as StyleSheetConsumer,$e as StyleSheetContext,De as StyleSheetManager,We as ThemeConsumer,qe as ThemeContext,Ue as ThemeProvider,ut as __PRIVATE__,rt as createGlobalStyle,et as css,ot as default,ne as isStyledComponent,it as keyframes,ct as useTheme,S as version,at as withTheme};
+import{__spreadArray as e,__assign as t,__rest as n}from"tslib";import o from"@emotion/is-prop-valid";import r,{useRef as i,useState as s,useContext as a,useMemo as c,useEffect as u,createElement as l,useDebugValue as p}from"react";import d from"shallowequal";import{prefixer as h,stringify as f,serialize as y,compile as m,middleware as v,RULESET as g}from"stylis";import S from"@emotion/unitless";var w="undefined"!=typeof process&&(process.env.REACT_APP_SC_ATTR||process.env.SC_ATTR)||"data-styled",b="6.0.0-beta.0",E="undefined"!=typeof window&&"HTMLElement"in window,N=Boolean("boolean"==typeof SC_DISABLE_SPEEDY?SC_DISABLE_SPEEDY:"undefined"!=typeof process&&void 0!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&""!==process.env.REACT_APP_SC_DISABLE_SPEEDY?"false"!==process.env.REACT_APP_SC_DISABLE_SPEEDY&&process.env.REACT_APP_SC_DISABLE_SPEEDY:"undefined"!=typeof process&&void 0!==process.env.SC_DISABLE_SPEEDY&&""!==process.env.SC_DISABLE_SPEEDY?"false"!==process.env.SC_DISABLE_SPEEDY&&process.env.SC_DISABLE_SPEEDY:"production"!==process.env.NODE_ENV),_={},C=/invalid hook call/i,A=new Set,P=function(t,n){if("production"!==process.env.NODE_ENV){var o=n?' with the id of "'.concat(n,'"'):"",r="The component ".concat(t).concat(o," has been created dynamically.\n")+"You may see this warning because you've called styled inside another component.\nTo resolve this only create new StyledComponents outside of any render method and function component.",s=console.error;try{var a=!0;console.error=function(t){for(var n=[],o=1;o<arguments.length;o++)n[o-1]=arguments[o];C.test(t)?(a=!1,A.delete(r)):s.apply(void 0,e([t],n,!1))},i(),a&&!A.has(r)&&(console.warn(r),A.add(r))}catch(e){C.test(e.message)&&A.delete(r)}finally{console.error=s}}},I=Object.freeze([]),O=Object.freeze({});function D(e,t,n){return void 0===n&&(n=O),e.theme!==n.theme&&e.theme||t||n.theme}var R=["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","foreignObject","g","image","line","linearGradient","marker","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"],j=/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g,T=/(^-|-$)/g;function x(e){return e.replace(j,"-").replace(T,"")}var k=/(a)(d)/gi,V=function(e){return String.fromCharCode(e+(e>25?39:97))};function $(e){var t,n="";for(t=Math.abs(e);t>52;t=t/52|0)n=V(t%52)+n;return(V(t%52)+n).replace(k,"$1-$2")}var B,z=function(e,t){for(var n=t.length;n;)e=33*e^t.charCodeAt(--n);return e},M=function(e){return z(5381,e)};function L(e){return $(M(e)>>>0)}function F(e){return"production"!==process.env.NODE_ENV&&"string"==typeof e&&e||e.displayName||e.name||"Component"}function G(e){return"string"==typeof e&&("production"===process.env.NODE_ENV||e.charAt(0)===e.charAt(0).toLowerCase())}var Y="function"==typeof Symbol&&Symbol.for,q=Y?Symbol.for("react.memo"):60115,H=Y?Symbol.for("react.forward_ref"):60112,W={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},U={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},J={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},X=((B={})[H]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},B[q]=J,B);function Z(e){return("type"in(t=e)&&t.type.$$typeof)===q?J:"$$typeof"in e?X[e.$$typeof]:W;var t}var K=Object.defineProperty,Q=Object.getOwnPropertyNames,ee=Object.getOwnPropertySymbols,te=Object.getOwnPropertyDescriptor,ne=Object.getPrototypeOf,oe=Object.prototype;function re(e,t,n){if("string"!=typeof t){if(oe){var o=ne(t);o&&o!==oe&&re(e,o,n)}var r=Q(t);ee&&(r=r.concat(ee(t)));for(var i=Z(e),s=Z(t),a=0;a<r.length;++a){var c=r[a];if(!(c in U||n&&n[c]||s&&c in s||i&&c in i)){var u=te(t,c);try{K(e,c,u)}catch(e){}}}}return e}function ie(e){return"object"==typeof e&&"styledComponentId"in e}function se(e){return!(null===e||"object"!=typeof e||e.constructor&&"Object"!==e.constructor.name||"[object Object]"!==(e.toString?e.toString():Object.prototype.toString.call(e))||"props"in e&&(e.$$typeof||void 0===e.constructor))}function ae(e,t,n){if(void 0===n&&(n=!1),!n&&!se(e)&&!Array.isArray(e))return t;if(Array.isArray(t))for(var o=0;o<t.length;o++)e[o]=ae(e[o],t[o]);else if(se(t))for(var o in t)e[o]=ae(e[o],t[o]);return e}var ce="production"!==process.env.NODE_ENV?{1:"Cannot create styled-component for component: %s.\n\n",2:"Can't collect styles once you've consumed a `ServerStyleSheet`'s styles! `ServerStyleSheet` is a one off instance for each server-side render cycle.\n\n- Are you trying to reuse it across renders?\n- Are you accidentally calling collectStyles twice?\n\n",3:"Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.\n\n",4:"The `StyleSheetManager` expects a valid target or sheet prop!\n\n- Does this error occur on the client and is your target falsy?\n- Does this error occur on the server and is the sheet falsy?\n\n",5:"The clone method cannot be used on the client!\n\n- Are you running in a client-like environment on the server?\n- Are you trying to run SSR on the client?\n\n",6:"Trying to insert a new style tag, but the given Node is unmounted!\n\n- Are you using a custom target that isn't mounted?\n- Does your document not have a valid head element?\n- Have you accidentally removed a style tag manually?\n\n",7:'ThemeProvider: Please return an object from your "theme" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n',8:'ThemeProvider: Please make your "theme" prop an object.\n\n',9:"Missing document `<head>`\n\n",10:"Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021\n\n",11:"_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.\n\n",12:"It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\`\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\n\n",13:"%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.\n\n",14:'ThemeProvider: "theme" prop is required.\n\n',15:"A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to `<StyleSheetManager stylisPlugins={[]}>`, please make sure each plugin is uniquely-named, e.g.\n\n```js\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\n```\n\n",16:"Reached the limit of how many styled components may be created at group %s.\nYou may only create up to 1,073,741,824 components. If you're creating components dynamically,\nas for instance in your render method then you may be running into this limitation.\n\n",17:"CSSStyleSheet could not be found on HTMLStyleElement.\nHas styled-components' style tag been unmounted or altered by another script?\n"}:{};function ue(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];for(var n=e[0],o=[],r=1,i=e.length;r<i;r+=1)o.push(e[r]);return o.forEach(function(e){n=n.replace(/%[a-z]/,e)}),n}function le(t){for(var n=[],o=1;o<arguments.length;o++)n[o-1]=arguments[o];return"production"===process.env.NODE_ENV?new Error("An error occurred. See https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/utils/errors.md#".concat(t," for more information.").concat(n.length>0?" Args: ".concat(n.join(", ")):"")):new Error(ue.apply(void 0,e([ce[t]],n,!1)).trim())}var pe=function(){function e(e){this.groupSizes=new Uint32Array(512),this.length=512,this.tag=e}return e.prototype.indexOfGroup=function(e){for(var t=0,n=0;n<e;n++)t+=this.groupSizes[n];return t},e.prototype.insertRules=function(e,t){if(e>=this.groupSizes.length){for(var n=this.groupSizes,o=n.length,r=o;e>=r;)if((r<<=1)<0)throw le(16,"".concat(e));this.groupSizes=new Uint32Array(r),this.groupSizes.set(n),this.length=r;for(var i=o;i<r;i++)this.groupSizes[i]=0}var s=this.indexOfGroup(e+1);if(Array.isArray(t)){i=0;for(var a=t.length;i<a;i++)this.tag.insertRule(s,t[i])&&(this.groupSizes[e]++,s++)}else this.tag.insertRule(s,t)&&this.groupSizes[e]++},e.prototype.clearGroup=function(e){if(e<this.length){var t=this.groupSizes[e],n=this.indexOfGroup(e),o=n+t;this.groupSizes[e]=0;for(var r=n;r<o;r++)this.tag.deleteRule(n)}},e.prototype.getGroup=function(e){var t="";if(e>=this.length||0===this.groupSizes[e])return t;for(var n=this.groupSizes[e],o=this.indexOfGroup(e),r=o+n,i=o;i<r;i++)t+="".concat(this.tag.getRule(i)).concat("/*!sc*/\n");return t},e}(),de=new Map,he=new Map,fe=1,ye=function(e){if(de.has(e))return de.get(e);for(;he.has(fe);)fe++;var t=fe++;if("production"!==process.env.NODE_ENV&&((0|t)<0||t>1073741824))throw le(16,"".concat(t));return de.set(e,t),he.set(t,e),t},me=function(e,t){de.set(e,t),he.set(t,e)},ve="style[".concat(w,"][").concat("data-styled-version",'="').concat(b,'"]'),ge=new RegExp("^".concat(w,'\\.g(\\d+)\\[id="([\\w\\d-]+)"\\].*?"([^"]*)')),Se=function(e,t,n){for(var o,r=n.split(","),i=0,s=r.length;i<s;i++)(o=r[i])&&e.registerName(t,o)},we=function(e,t){for(var n,o=(null!==(n=t.textContent)&&void 0!==n?n:"").split("/*!sc*/\n"),r=[],i=0,s=o.length;i<s;i++){var a=o[i].trim();if(a){var c=a.match(ge);if(c){var u=0|parseInt(c[1],10),l=c[2];0!==u&&(me(l,u),Se(e,l,c[3]),e.getTag().insertRules(u,r)),r.length=0}else r.push(a)}}};function be(){return"undefined"!=typeof __webpack_nonce__?__webpack_nonce__:null}var Ee=function(e){var t=document.head,n=e||t,o=document.createElement("style"),r=function(e){for(var t=e.childNodes,n=t.length;n>=0;n--){var o=t[n];if(o&&1===o.nodeType&&o.hasAttribute(w))return o}}(n),i=void 0!==r?r.nextSibling:null;o.setAttribute(w,"active"),o.setAttribute("data-styled-version",b);var s=be();return s&&o.setAttribute("nonce",s),n.insertBefore(o,i),o},Ne=function(){function e(e){var t=this.element=Ee(e);t.appendChild(document.createTextNode("")),this.sheet=function(e){if(e.sheet)return e.sheet;for(var t=document.styleSheets,n=0,o=t.length;n<o;n++){var r=t[n];if(r.ownerNode===e)return r}throw le(17)}(t),this.length=0}return e.prototype.insertRule=function(e,t){try{return this.sheet.insertRule(t,e),this.length++,!0}catch(e){return!1}},e.prototype.deleteRule=function(e){this.sheet.deleteRule(e),this.length--},e.prototype.getRule=function(e){var t=this.sheet.cssRules[e];return void 0!==t&&"string"==typeof t.cssText?t.cssText:""},e}(),_e=function(){function e(e){var t=this.element=Ee(e);this.nodes=t.childNodes,this.length=0}return e.prototype.insertRule=function(e,t){if(e<=this.length&&e>=0){var n=document.createTextNode(t);return this.element.insertBefore(n,this.nodes[e]||null),this.length++,!0}return!1},e.prototype.deleteRule=function(e){this.element.removeChild(this.nodes[e]),this.length--},e.prototype.getRule=function(e){return e<this.length?this.nodes[e].textContent:""},e}(),Ce=function(){function e(e){this.rules=[],this.length=0}return e.prototype.insertRule=function(e,t){return e<=this.length&&(this.rules.splice(e,0,t),this.length++,!0)},e.prototype.deleteRule=function(e){this.rules.splice(e,1),this.length--},e.prototype.getRule=function(e){return e<this.length?this.rules[e]:""},e}(),Ae=E,Pe={isServer:!E,useCSSOMInjection:!N},Ie=function(){function e(e,n,o){void 0===e&&(e=O),void 0===n&&(n={}),this.options=t(t({},Pe),e),this.gs=n,this.names=new Map(o),this.server=!!e.isServer,!this.server&&E&&Ae&&(Ae=!1,function(e){for(var t=document.querySelectorAll(ve),n=0,o=t.length;n<o;n++){var r=t[n];r&&"active"!==r.getAttribute(w)&&(we(e,r),r.parentNode&&r.parentNode.removeChild(r))}}(this))}return e.registerId=function(e){return ye(e)},e.prototype.reconstructWithOptions=function(n,o){return void 0===o&&(o=!0),new e(t(t({},this.options),n),this.gs,o&&this.names||void 0)},e.prototype.allocateGSInstance=function(e){return this.gs[e]=(this.gs[e]||0)+1},e.prototype.getTag=function(){return this.tag||(this.tag=(e=function(e){var t=e.useCSSOMInjection,n=e.target;return e.isServer?new Ce(n):t?new Ne(n):new _e(n)}(this.options),new pe(e)));var e},e.prototype.hasNameForId=function(e,t){return this.names.has(e)&&this.names.get(e).has(t)},e.prototype.registerName=function(e,t){if(ye(e),this.names.has(e))this.names.get(e).add(t);else{var n=new Set;n.add(t),this.names.set(e,n)}},e.prototype.insertRules=function(e,t,n){this.registerName(e,t),this.getTag().insertRules(ye(e),n)},e.prototype.clearNames=function(e){this.names.has(e)&&this.names.get(e).clear()},e.prototype.clearRules=function(e){this.getTag().clearGroup(ye(e)),this.clearNames(e)},e.prototype.clearTag=function(){this.tag=void 0},e.prototype.toString=function(){return function(e){for(var t=e.getTag(),n=t.length,o="",r=function(n){var r=function(e){return he.get(e)}(n);if(void 0===r)return"continue";var i=e.names.get(r),s=t.getGroup(n);if(void 0===i||0===s.length)return"continue";var a="".concat(w,".g").concat(n,'[id="').concat(r,'"]'),c="";void 0!==i&&i.forEach(function(e){e.length>0&&(c+="".concat(e,","))}),o+="".concat(s).concat(a,'{content:"').concat(c,'"}').concat("/*!sc*/\n")},i=0;i<n;i++)r(i);return o}(this)},e}(),Oe=/^\s*\/\/.*$/gm,De=[":","[",".","#"];function Re(e){var t,n,o,r,i=void 0===e?O:e,s=i.options,a=void 0===s?O:s,c=i.plugins,u=void 0===c?I:c,l=function(e,o,i){return 0===o&&De.includes(i[n.length])||i.match(r)?e:".".concat(t)},p=function(e){if(e.type===g&&e.value.includes("&")){var t=e.props;t[0]=t[0].replace(o,l)}},d=function(e,i,s,c){void 0===i&&(i=""),void 0===s&&(s=""),void 0===c&&(c="&");var l=e.replace(Oe,"");t=c,n=i,o=new RegExp("\\".concat(n,"\\b"),"g"),r=new RegExp("(\\".concat(n,"\\b){2,}"));var d=u.slice();return(a.prefix||void 0===a.prefix)&&d.unshift(h),d.push(p,f),y(m(s||i?"".concat(s," ").concat(i," { ").concat(l," }"):l),v(d))};return d.hash=u.length?u.reduce(function(e,t){return t.name||le(15),z(e,t.name)},5381).toString():"",d}var je=r.createContext(void 0),Te=je.Consumer,xe=r.createContext(void 0),ke=new Ie,Ve=Re();function $e(){return a(je)||ke}function Be(){return a(xe)||Ve}function ze(e){var t=s(e.stylisPlugins),n=t[0],o=t[1],i=$e(),a=c(function(){var t=i;return e.sheet?t=e.sheet:e.target&&(t=t.reconstructWithOptions({target:e.target},!1)),e.disableCSSOMInjection&&(t=t.reconstructWithOptions({useCSSOMInjection:!1})),t},[e.disableCSSOMInjection,e.sheet,e.target]),l=c(function(){return Re({options:{prefix:!e.disableVendorPrefixes},plugins:n})},[e.disableVendorPrefixes,n]);return u(function(){d(n,e.stylisPlugins)||o(e.stylisPlugins)},[e.stylisPlugins]),r.createElement(je.Provider,{value:a},r.createElement(xe.Provider,{value:l},"production"!==process.env.NODE_ENV?r.Children.only(e.children):e.children))}var Me=function(){function e(e,t){var n=this;this.inject=function(e,t){void 0===t&&(t=Ve);var o=n.name+t.hash;e.hasNameForId(n.id,o)||e.insertRules(n.id,o,t(n.rules,o,"@keyframes"))},this.toString=function(){throw le(12,String(n.name))},this.name=e,this.id="sc-keyframes-".concat(e),this.rules=t}return e.prototype.getName=function(e){return void 0===e&&(e=Ve),this.name+e.hash},e}(),Le=/([A-Z])/,Fe=/([A-Z])/g,Ge=/^ms-/,Ye=function(e){return"-".concat(e.toLowerCase())};function qe(e){return Le.test(e)?e.replace(Fe,Ye).replace(Ge,"-ms-"):e}function He(e){return"function"==typeof e}var We=function(e){return null==e||!1===e||""===e},Ue=function(t,n){var o,r=[];for(var i in t)t.hasOwnProperty(i)&&!We(t[i])&&(Array.isArray(t[i])&&t[i].isCss||He(t[i])?r.push("".concat(qe(i),":"),t[i],";"):se(t[i])?r.push.apply(r,Ue(t[i],i)):r.push("".concat(qe(i),": ").concat(null==(o=t[i])||"boolean"==typeof o||""===o?"":"number"!=typeof o||0===o||i in S?String(o).trim():"".concat(o,"px"),";")));return n?e(e(["".concat(n," {")],r,!0),["}"],!1):r};function Je(e,t,n,o){if(Array.isArray(e)){for(var r=[],i=0,s=e.length,a=void 0;i<s;i+=1)""!==(a=Je(e[i],t,n,o))&&(Array.isArray(a)?r.push.apply(r,a):r.push(a));return r}if(We(e))return"";if(ie(e))return".".concat(e.styledComponentId);if(He(e)){if("function"!=typeof(u=e)||u.prototype&&u.prototype.isReactComponent||!t)return e;var c=e;return a=c(t),"production"===process.env.NODE_ENV||"object"!=typeof a||Array.isArray(a)||a instanceof Me||se(a)||console.error("".concat(F(c)," is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.")),Je(a,t,n,o)}var u;return e instanceof Me?n?(e.inject(n,o),e.getName(o)):e:se(e)?Ue(e):e.toString()}function Xe(e){for(var t=0;t<e.length;t+=1){var n=e[t];if(He(n)&&!ie(n))return!1}return!0}var Ze=M(b),Ke=function(){function e(e,t,n){this.rules=e,this.staticRulesId="",this.isStatic="production"===process.env.NODE_ENV&&(void 0===n||n.isStatic)&&Xe(e),this.componentId=t,this.baseHash=z(Ze,t),this.baseStyle=n,Ie.registerId(t)}return e.prototype.generateAndInjectStyles=function(e,t,n){var o=this.componentId,r=[];if(this.baseStyle&&r.push(this.baseStyle.generateAndInjectStyles(e,t,n)),this.isStatic&&!n.hash)if(this.staticRulesId&&t.hasNameForId(o,this.staticRulesId))r.push(this.staticRulesId);else{var i=Je(this.rules,e,t,n).join(""),s=$(z(this.baseHash,i)>>>0);if(!t.hasNameForId(o,s)){var a=n(i,".".concat(s),void 0,o);t.insertRules(o,s,a)}r.push(s),this.staticRulesId=s}else{for(var c=this.rules.length,u=z(this.baseHash,n.hash),l="",p=0;p<c;p++){var d=this.rules[p];if("string"==typeof d)l+=d,"production"!==process.env.NODE_ENV&&(u=z(u,d+p));else if(d){var h=Je(d,e,t,n),f=Array.isArray(h)?h.join(""):h;u=z(u,f+p),l+=f}}if(l){var y=$(u>>>0);if(!t.hasNameForId(o,y)){var m=n(l,".".concat(y),void 0,o);t.insertRules(o,y,m)}r.push(y)}}return r.join(" ")},e}(),Qe=r.createContext(void 0),et=Qe.Consumer;function tt(e){var n=a(Qe),o=c(function(){return function(e,n){if(!e)throw le(14);if(He(e)){var o=e(n);if("production"!==process.env.NODE_ENV&&(null===o||Array.isArray(o)||"object"!=typeof o))throw le(7);return o}if(Array.isArray(e)||"object"!=typeof e)throw le(8);return n?t(t({},n),e):e}(e.theme,n)},[e.theme,n]);return e.children?r.createElement(Qe.Provider,{value:o},e.children):null}var nt={};function ot(e,i,s){var c=ie(e),u=e,d=!G(e),h=i.attrs,f=void 0===h?I:h,y=i.componentId,m=void 0===y?function(e,t){var n="string"!=typeof e?"sc":x(e);nt[n]=(nt[n]||0)+1;var o="".concat(n,"-").concat(L(b+n+nt[n]));return t?"".concat(t,"-").concat(o):o}(i.displayName,i.parentComponentId):y,v=i.displayName,g=void 0===v?function(e){return G(e)?"styled.".concat(e):"Styled(".concat(F(e),")")}(e):v,S=i.displayName&&i.componentId?"".concat(x(i.displayName),"-").concat(i.componentId):i.componentId||m,w=c&&u.attrs?u.attrs.concat(f).filter(Boolean):f,E=i.shouldForwardProp;if(c&&u.shouldForwardProp){var N=u.shouldForwardProp;if(i.shouldForwardProp){var _=i.shouldForwardProp;E=function(e,t,n){return N(e,t,n)&&_(e,t,n)}}else E=N}var C=new Ke(s,S,c?u.componentStyle:void 0),A=C.isStatic&&0===f.length;function j(e,n){return function(e,n,r,i){var s=e.attrs,c=e.componentStyle,u=e.defaultProps,d=e.foldedComponentIds,h=e.shouldForwardProp,f=e.styledComponentId,y=e.target;"production"!==process.env.NODE_ENV&&p(f);var m=function(e,n,o){void 0===e&&(e=O);var r=t(t({},n),{theme:e}),i={};return o.forEach(function(e){var t,n,o,s="function"==typeof e?e(r):e;for(t in s)r[t]=i[t]="className"===t?(o=s[t],(n=i[t])&&o?"".concat(n," ").concat(o):n||o):s[t]}),[r,i]}(D(n,a(Qe),u)||O,n,s),v=m[1],g=function(e,t,n,o){var r=$e(),i=Be(),s=e.generateAndInjectStyles(t?O:n,r,i);return"production"!==process.env.NODE_ENV&&p(s),"production"!==process.env.NODE_ENV&&!t&&o&&o(s),s}(c,i,m[0],"production"!==process.env.NODE_ENV?e.warnTooManyClasses:void 0),S=r,w=v.$as||n.$as||v.as||n.as||y,b=G(w),E=v!==n?t(t({},n),v):n,N={};for(var _ in E)"$"!==_[0]&&"as"!==_&&("forwardedAs"===_?N.as=E[_]:(h?h(_,o,w):!b||o(_))&&(N[_]=E[_]));return n.style&&v.style!==n.style&&(N.style=t(t({},n.style),v.style)),N[b&&-1===R.indexOf(w)?"class":"className"]=d.concat(f,g!==f?g:null,n.className,v.className).filter(Boolean).join(" "),N.ref=S,l(w,N)}(T,e,n,A)}j.displayName=g;var T=r.forwardRef(j);return T.attrs=w,T.componentStyle=C,T.displayName=g,T.shouldForwardProp=E,T.foldedComponentIds=c?u.foldedComponentIds.concat(u.styledComponentId):I,T.styledComponentId=S,T.target=c?u.target:e,T.withComponent=function(e){var o=i.componentId,r=n(i,["componentId"]),a=o&&"".concat(o,"-").concat(G(e)?e:x(F(e)));return ot(e,t(t({},r),{attrs:w,componentId:a}),s)},Object.defineProperty(T,"defaultProps",{get:function(){return this._foldedDefaultProps},set:function(e){this._foldedDefaultProps=c?function(e){void 0===e&&(e={});for(var t=[],n=1;n<arguments.length;n++)t[n-1]=arguments[n];for(var o=0,r=t;o<r.length;o++)ae(e,r[o],!0);return e}({},u.defaultProps,e):e}}),"production"!==process.env.NODE_ENV&&(P(g,S),T.warnTooManyClasses=function(e,t){var n={},o=!1;return function(r){if(!o&&(n[r]=!0,Object.keys(n).length>=200)){var i=t?' with the id of "'.concat(t,'"'):"";console.warn("Over ".concat(200," classes were generated for component ").concat(e).concat(i,".\n")+"Consider using the attrs method, together with a style object for frequently changed styles.\nExample:\n  const Component = styled.div.attrs(props => ({\n    style: {\n      background: props.background,\n    },\n  }))`width: 100%;`\n\n  <Component />"),o=!0,n={}}}}(g,S)),T.toString=function(){return".".concat(T.styledComponentId)},d&&re(T,e,{attrs:!0,componentStyle:!0,displayName:!0,foldedComponentIds:!0,shouldForwardProp:!0,styledComponentId:!0,target:!0,withComponent:!0}),T}function rt(e,t){for(var n=[e[0]],o=0,r=t.length;o<r;o+=1)n.push(t[o],e[o+1]);return n}var it=function(e){return Array.isArray(e)&&(e.isCss=!0),e};function st(t){for(var n=[],o=1;o<arguments.length;o++)n[o-1]=arguments[o];if(He(t)||se(t)){var r=t;return it(Je(rt(I,e([r],n,!0))))}var i=t;return 0===n.length&&1===i.length&&"string"==typeof i[0]?i:it(Je(rt(i,n)))}function at(n,o,r){if(void 0===r&&(r=O),!o)throw le(1,o);var i=function(t){for(var i=[],s=1;s<arguments.length;s++)i[s-1]=arguments[s];return n(o,r,st.apply(void 0,e([t],i,!1)))};return i.attrs=function(e){return at(n,o,t(t({},r),{attrs:Array.prototype.concat(r.attrs,e).filter(Boolean)}))},i.withConfig=function(e){return at(n,o,t(t({},r),e))},i}var ct=function(e){return at(ot,e)},ut=ct;R.forEach(function(e){ut[e]=ct(e)});var lt=function(){function e(e,t){this.rules=e,this.componentId=t,this.isStatic=Xe(e),Ie.registerId(this.componentId+1)}return e.prototype.createStyles=function(e,t,n,o){var r=o(Je(this.rules,t,n,o).join(""),""),i=this.componentId+e;n.insertRules(i,i,r)},e.prototype.removeStyles=function(e,t){t.clearRules(this.componentId+e)},e.prototype.renderStyles=function(e,t,n,o){e>2&&Ie.registerId(this.componentId+e),this.removeStyles(e,n),this.createStyles(e,t,n,o)},e}();function pt(n){for(var o=[],i=1;i<arguments.length;i++)o[i-1]=arguments[i];var s=st.apply(void 0,e([n],o,!1)),a="sc-global-".concat(L(JSON.stringify(s))),c=new lt(s,a);"production"!==process.env.NODE_ENV&&P(a);var u=function(e){var t=$e(),n=Be(),o=r.useContext(Qe),i=r.useRef(t.allocateGSInstance(a)).current;return"production"!==process.env.NODE_ENV&&r.Children.count(e.children)&&console.warn("The global style component ".concat(a," was given child JSX. createGlobalStyle does not render children.")),"production"!==process.env.NODE_ENV&&s.some(function(e){return"string"==typeof e&&-1!==e.indexOf("@import")})&&console.warn("Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical <link> meta tag to the stylesheet, or simply embedding it manually in your index.html <head> section for a simpler app."),t.server&&l(i,e,t,o,n),(r.useInsertionEffect||r.useLayoutEffect)(function(){if(!t.server)return l(i,e,t,o,n),function(){return c.removeStyles(i,t)}},[i,e,t,o,n]),null};function l(e,n,o,r,i){if(c.isStatic)c.renderStyles(e,_,o,i);else{var s=t(t({},n),{theme:D(n,r,u.defaultProps)});c.renderStyles(e,s,o,i)}}return r.memo(u)}function dt(t){for(var n=[],o=1;o<arguments.length;o++)n[o-1]=arguments[o];"production"!==process.env.NODE_ENV&&"undefined"!=typeof navigator&&"ReactNative"===navigator.product&&console.warn("`keyframes` cannot be used on ReactNative, only on the web. To do animation in ReactNative please use Animated.");var r=st.apply(void 0,e([t],n,!1)).join(""),i=L(r);return new Me(i,r)}function ht(e){var n=r.forwardRef(function(n,o){var i=D(n,r.useContext(Qe),e.defaultProps);return"production"!==process.env.NODE_ENV&&void 0===i&&console.warn('[withTheme] You are not using a ThemeProvider nor passing a theme prop or a theme in defaultProps in component class "'.concat(F(e),'"')),r.createElement(e,t({},n,{theme:i,ref:o}))});return n.displayName="WithTheme(".concat(F(e),")"),re(n,e)}var ft=function(){return a(Qe)},yt=function(){function e(){var e=this;this._emitSheetCSS=function(){var t=e.instance.toString(),n=be(),o=[n&&'nonce="'.concat(n,'"'),"".concat(w,'="true"'),"".concat("data-styled-version",'="').concat(b,'"')].filter(Boolean).join(" ");return"<style ".concat(o,">").concat(t,"</style>")},this.getStyleTags=function(){if(e.sealed)throw le(2);return e._emitSheetCSS()},this.getStyleElement=function(){var n;if(e.sealed)throw le(2);var o=((n={})[w]="",n["data-styled-version"]=b,n.dangerouslySetInnerHTML={__html:e.instance.toString()},n),i=be();return i&&(o.nonce=i),[r.createElement("style",t({},o,{key:"sc-0-0"}))]},this.seal=function(){e.sealed=!0},this.instance=new Ie({isServer:!0}),this.sealed=!1}return e.prototype.collectStyles=function(e){if(this.sealed)throw le(2);return r.createElement(ze,{sheet:this.instance},e)},e.prototype.interleaveWithNodeStream=function(e){throw le(3)},e}(),mt={StyleSheet:Ie,mainSheet:ke};"production"!==process.env.NODE_ENV&&"undefined"!=typeof navigator&&"ReactNative"===navigator.product&&console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native"),"production"!==process.env.NODE_ENV&&"test"!==process.env.NODE_ENV&&"undefined"!=typeof window&&(window["__styled-components-init__"]||(window["__styled-components-init__"]=0),1===window["__styled-components-init__"]&&console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info."),window["__styled-components-init__"]+=1);export{yt as ServerStyleSheet,Te as StyleSheetConsumer,je as StyleSheetContext,ze as StyleSheetManager,et as ThemeConsumer,Qe as ThemeContext,tt as ThemeProvider,mt as __PRIVATE__,pt as createGlobalStyle,st as css,ut as default,ie as isStyledComponent,dt as keyframes,ft as useTheme,b as version,ht as withTheme};
 //# sourceMappingURL=styled-components.browser.esm.js.map