UNPKG

130 kBJavaScriptView Raw
1var styled = (function (React,ReactDOM) {
2 'use strict';
3
4 var React__default = 'default' in React ? React['default'] : React;
5 ReactDOM = ReactDOM && ReactDOM.hasOwnProperty('default') ? ReactDOM['default'] : ReactDOM;
6
7 //
8 function isStyledComponent(target) {
9 return target && typeof target.styledComponentId === 'string';
10 }
11
12 //
13
14 var interleave = (function (strings, interpolations) {
15 var result = [strings[0]];
16
17 for (var i = 0, len = interpolations.length; i < len; i += 1) {
18 result.push(interpolations[i], strings[i + 1]);
19 }
20
21 return result;
22 });
23
24 var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
25 return typeof obj;
26 } : function (obj) {
27 return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
28 };
29
30 var classCallCheck = function (instance, Constructor) {
31 if (!(instance instanceof Constructor)) {
32 throw new TypeError("Cannot call a class as a function");
33 }
34 };
35
36 var createClass = function () {
37 function defineProperties(target, props) {
38 for (var i = 0; i < props.length; i++) {
39 var descriptor = props[i];
40 descriptor.enumerable = descriptor.enumerable || false;
41 descriptor.configurable = true;
42 if ("value" in descriptor) descriptor.writable = true;
43 Object.defineProperty(target, descriptor.key, descriptor);
44 }
45 }
46
47 return function (Constructor, protoProps, staticProps) {
48 if (protoProps) defineProperties(Constructor.prototype, protoProps);
49 if (staticProps) defineProperties(Constructor, staticProps);
50 return Constructor;
51 };
52 }();
53
54 var _extends = Object.assign || function (target) {
55 for (var i = 1; i < arguments.length; i++) {
56 var source = arguments[i];
57
58 for (var key in source) {
59 if (Object.prototype.hasOwnProperty.call(source, key)) {
60 target[key] = source[key];
61 }
62 }
63 }
64
65 return target;
66 };
67
68 var inherits = function (subClass, superClass) {
69 if (typeof superClass !== "function" && superClass !== null) {
70 throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
71 }
72
73 subClass.prototype = Object.create(superClass && superClass.prototype, {
74 constructor: {
75 value: subClass,
76 enumerable: false,
77 writable: true,
78 configurable: true
79 }
80 });
81 if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
82 };
83
84 var objectWithoutProperties = function (obj, keys) {
85 var target = {};
86
87 for (var i in obj) {
88 if (keys.indexOf(i) >= 0) continue;
89 if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
90 target[i] = obj[i];
91 }
92
93 return target;
94 };
95
96 var possibleConstructorReturn = function (self, call) {
97 if (!self) {
98 throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
99 }
100
101 return call && (typeof call === "object" || typeof call === "function") ? call : self;
102 };
103
104 //
105 var isPlainObject = (function (x) {
106 return (typeof x === 'undefined' ? 'undefined' : _typeof(x)) === 'object' && x.constructor === Object;
107 });
108
109 //
110 var EMPTY_ARRAY = Object.freeze([]);
111 var EMPTY_OBJECT = Object.freeze({});
112
113 //
114 function isFunction(test) {
115 return typeof test === 'function';
116 }
117
118 function unwrapExports (x) {
119 return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
120 }
121
122 function createCommonjsModule(fn, module) {
123 return module = { exports: {} }, fn(module, module.exports), module.exports;
124 }
125
126 var reactIs_production_min = createCommonjsModule(function (module, exports) {
127 Object.defineProperty(exports,"__esModule",{value:!0});
128 var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.forward_ref"):60112,n=b?Symbol.for("react.placeholder"):60113;
129 function q(a){if("object"===typeof a&&null!==a){var p=a.$$typeof;switch(p){case c:switch(a=a.type,a){case l:case e:case g:case f:return a;default:switch(a=a&&a.$$typeof,a){case k:case m:case h:return a;default:return p}}case d:return p}}}exports.typeOf=q;exports.AsyncMode=l;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=m;exports.Fragment=e;exports.Profiler=g;exports.Portal=d;exports.StrictMode=f;
130 exports.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===l||a===g||a===f||a===n||"object"===typeof a&&null!==a&&("function"===typeof a.then||a.$$typeof===h||a.$$typeof===k||a.$$typeof===m)};exports.isAsyncMode=function(a){return q(a)===l};exports.isContextConsumer=function(a){return q(a)===k};exports.isContextProvider=function(a){return q(a)===h};exports.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};
131 exports.isForwardRef=function(a){return q(a)===m};exports.isFragment=function(a){return q(a)===e};exports.isProfiler=function(a){return q(a)===g};exports.isPortal=function(a){return q(a)===d};exports.isStrictMode=function(a){return q(a)===f};
132 });
133
134 unwrapExports(reactIs_production_min);
135 var reactIs_production_min_1 = reactIs_production_min.typeOf;
136 var reactIs_production_min_2 = reactIs_production_min.AsyncMode;
137 var reactIs_production_min_3 = reactIs_production_min.ContextConsumer;
138 var reactIs_production_min_4 = reactIs_production_min.ContextProvider;
139 var reactIs_production_min_5 = reactIs_production_min.Element;
140 var reactIs_production_min_6 = reactIs_production_min.ForwardRef;
141 var reactIs_production_min_7 = reactIs_production_min.Fragment;
142 var reactIs_production_min_8 = reactIs_production_min.Profiler;
143 var reactIs_production_min_9 = reactIs_production_min.Portal;
144 var reactIs_production_min_10 = reactIs_production_min.StrictMode;
145 var reactIs_production_min_11 = reactIs_production_min.isValidElementType;
146 var reactIs_production_min_12 = reactIs_production_min.isAsyncMode;
147 var reactIs_production_min_13 = reactIs_production_min.isContextConsumer;
148 var reactIs_production_min_14 = reactIs_production_min.isContextProvider;
149 var reactIs_production_min_15 = reactIs_production_min.isElement;
150 var reactIs_production_min_16 = reactIs_production_min.isForwardRef;
151 var reactIs_production_min_17 = reactIs_production_min.isFragment;
152 var reactIs_production_min_18 = reactIs_production_min.isProfiler;
153 var reactIs_production_min_19 = reactIs_production_min.isPortal;
154 var reactIs_production_min_20 = reactIs_production_min.isStrictMode;
155
156 var reactIs_development = createCommonjsModule(function (module, exports) {
157
158
159
160 {
161 (function() {
162
163 Object.defineProperty(exports, '__esModule', { value: true });
164
165 // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
166 // nor polyfill, then a plain number is used for performance.
167 var hasSymbol = typeof Symbol === 'function' && Symbol.for;
168
169 var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
170 var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
171 var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
172 var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
173 var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
174 var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
175 var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace;
176 var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
177 var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
178 var REACT_PLACEHOLDER_TYPE = hasSymbol ? Symbol.for('react.placeholder') : 0xead1;
179
180 function isValidElementType(type) {
181 return typeof type === 'string' || typeof type === 'function' ||
182 // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
183 type === REACT_FRAGMENT_TYPE || type === REACT_ASYNC_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_PLACEHOLDER_TYPE || typeof type === 'object' && type !== null && (typeof type.then === 'function' || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE);
184 }
185
186 function typeOf(object) {
187 if (typeof object === 'object' && object !== null) {
188 var $$typeof = object.$$typeof;
189
190 switch ($$typeof) {
191 case REACT_ELEMENT_TYPE:
192 var type = object.type;
193
194 switch (type) {
195 case REACT_ASYNC_MODE_TYPE:
196 case REACT_FRAGMENT_TYPE:
197 case REACT_PROFILER_TYPE:
198 case REACT_STRICT_MODE_TYPE:
199 return type;
200 default:
201 var $$typeofType = type && type.$$typeof;
202
203 switch ($$typeofType) {
204 case REACT_CONTEXT_TYPE:
205 case REACT_FORWARD_REF_TYPE:
206 case REACT_PROVIDER_TYPE:
207 return $$typeofType;
208 default:
209 return $$typeof;
210 }
211 }
212 case REACT_PORTAL_TYPE:
213 return $$typeof;
214 }
215 }
216
217 return undefined;
218 }
219
220 var AsyncMode = REACT_ASYNC_MODE_TYPE;
221 var ContextConsumer = REACT_CONTEXT_TYPE;
222 var ContextProvider = REACT_PROVIDER_TYPE;
223 var Element = REACT_ELEMENT_TYPE;
224 var ForwardRef = REACT_FORWARD_REF_TYPE;
225 var Fragment = REACT_FRAGMENT_TYPE;
226 var Profiler = REACT_PROFILER_TYPE;
227 var Portal = REACT_PORTAL_TYPE;
228 var StrictMode = REACT_STRICT_MODE_TYPE;
229
230 function isAsyncMode(object) {
231 return typeOf(object) === REACT_ASYNC_MODE_TYPE;
232 }
233 function isContextConsumer(object) {
234 return typeOf(object) === REACT_CONTEXT_TYPE;
235 }
236 function isContextProvider(object) {
237 return typeOf(object) === REACT_PROVIDER_TYPE;
238 }
239 function isElement(object) {
240 return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
241 }
242 function isForwardRef(object) {
243 return typeOf(object) === REACT_FORWARD_REF_TYPE;
244 }
245 function isFragment(object) {
246 return typeOf(object) === REACT_FRAGMENT_TYPE;
247 }
248 function isProfiler(object) {
249 return typeOf(object) === REACT_PROFILER_TYPE;
250 }
251 function isPortal(object) {
252 return typeOf(object) === REACT_PORTAL_TYPE;
253 }
254 function isStrictMode(object) {
255 return typeOf(object) === REACT_STRICT_MODE_TYPE;
256 }
257
258 exports.typeOf = typeOf;
259 exports.AsyncMode = AsyncMode;
260 exports.ContextConsumer = ContextConsumer;
261 exports.ContextProvider = ContextProvider;
262 exports.Element = Element;
263 exports.ForwardRef = ForwardRef;
264 exports.Fragment = Fragment;
265 exports.Profiler = Profiler;
266 exports.Portal = Portal;
267 exports.StrictMode = StrictMode;
268 exports.isValidElementType = isValidElementType;
269 exports.isAsyncMode = isAsyncMode;
270 exports.isContextConsumer = isContextConsumer;
271 exports.isContextProvider = isContextProvider;
272 exports.isElement = isElement;
273 exports.isForwardRef = isForwardRef;
274 exports.isFragment = isFragment;
275 exports.isProfiler = isProfiler;
276 exports.isPortal = isPortal;
277 exports.isStrictMode = isStrictMode;
278 })();
279 }
280 });
281
282 unwrapExports(reactIs_development);
283 var reactIs_development_1 = reactIs_development.typeOf;
284 var reactIs_development_2 = reactIs_development.AsyncMode;
285 var reactIs_development_3 = reactIs_development.ContextConsumer;
286 var reactIs_development_4 = reactIs_development.ContextProvider;
287 var reactIs_development_5 = reactIs_development.Element;
288 var reactIs_development_6 = reactIs_development.ForwardRef;
289 var reactIs_development_7 = reactIs_development.Fragment;
290 var reactIs_development_8 = reactIs_development.Profiler;
291 var reactIs_development_9 = reactIs_development.Portal;
292 var reactIs_development_10 = reactIs_development.StrictMode;
293 var reactIs_development_11 = reactIs_development.isValidElementType;
294 var reactIs_development_12 = reactIs_development.isAsyncMode;
295 var reactIs_development_13 = reactIs_development.isContextConsumer;
296 var reactIs_development_14 = reactIs_development.isContextProvider;
297 var reactIs_development_15 = reactIs_development.isElement;
298 var reactIs_development_16 = reactIs_development.isForwardRef;
299 var reactIs_development_17 = reactIs_development.isFragment;
300 var reactIs_development_18 = reactIs_development.isProfiler;
301 var reactIs_development_19 = reactIs_development.isPortal;
302 var reactIs_development_20 = reactIs_development.isStrictMode;
303
304 var reactIs = createCommonjsModule(function (module) {
305
306 {
307 module.exports = reactIs_development;
308 }
309 });
310 var reactIs_1 = reactIs.isElement;
311 var reactIs_2 = reactIs.isValidElementType;
312 var reactIs_3 = reactIs.ForwardRef;
313
314 //
315
316 function getComponentName(target) {
317 return target.displayName || target.name || 'Component';
318 }
319
320 //
321
322
323 var SC_ATTR = typeof process !== 'undefined' && process.env.SC_ATTR || 'data-styled';
324
325 var SC_VERSION_ATTR = 'data-styled-version';
326
327 var SC_STREAM_ATTR = 'data-styled-streamed';
328
329 var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
330
331 // Shared empty execution context when generating static styles
332 var STATIC_EXECUTION_CONTEXT = {};
333
334 //
335
336
337 /**
338 * Parse errors.md and turn it into a simple hash of code: message
339 */
340 var ERRORS = {
341 "1": "Cannot create styled-component for component: %s.\n\n",
342 "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",
343 "3": "Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.\n\n",
344 "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",
345 "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",
346 "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",
347 "7": "ThemeProvider: Please return an object from your \"theme\" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n",
348 "8": "ThemeProvider: Please make your \"theme\" prop an object.\n\n",
349 "9": "Missing document `<head>`\n\n",
350 "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",
351 "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",
352 "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 (see https://www.styled-components.com/docs/api#css), which ensures the styles are injected correctly.\n"
353 };
354
355 /**
356 * super basic version of sprintf
357 */
358 function format() {
359 for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
360 args[_key] = arguments[_key];
361 }
362
363 var a = args[0];
364 var b = [];
365 var c = void 0;
366
367 for (c = 1; c < args.length; c += 1) {
368 b.push(args[c]);
369 }
370
371 b.forEach(function (d) {
372 a = a.replace(/%[a-z]/, d);
373 });
374
375 return a;
376 }
377
378 /**
379 * Create an error file out of errors.md for development and a simple web link to the full errors
380 * in production mode.
381 */
382
383 var StyledComponentsError = function (_Error) {
384 inherits(StyledComponentsError, _Error);
385
386 function StyledComponentsError(code) {
387 classCallCheck(this, StyledComponentsError);
388
389 for (var _len2 = arguments.length, interpolations = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
390 interpolations[_key2 - 1] = arguments[_key2];
391 }
392
393 if (false) {
394 var _this;
395 } else {
396 var _this = possibleConstructorReturn(this, _Error.call(this, format.apply(undefined, [ERRORS[code]].concat(interpolations)).trim()));
397 }
398 return possibleConstructorReturn(_this);
399 }
400
401 return StyledComponentsError;
402 }(Error);
403
404 //
405 var SC_COMPONENT_ID = /^[^\S\n]*?\/\* sc-component-id:\s*(\S+)\s+\*\//gm;
406
407 var extractComps = (function (maybeCSS) {
408 var css = '' + (maybeCSS || ''); // Definitely a string, and a clone
409 var existingComponents = [];
410 css.replace(SC_COMPONENT_ID, function (match, componentId, matchIndex) {
411 existingComponents.push({ componentId: componentId, matchIndex: matchIndex });
412 return match;
413 });
414 return existingComponents.map(function (_ref, i) {
415 var componentId = _ref.componentId,
416 matchIndex = _ref.matchIndex;
417
418 var nextComp = existingComponents[i + 1];
419 var cssFromDOM = nextComp ? css.slice(matchIndex, nextComp.matchIndex) : css.slice(matchIndex);
420 return { componentId: componentId, cssFromDOM: cssFromDOM };
421 });
422 });
423
424 var stylis_min = createCommonjsModule(function (module, exports) {
425 !function(e){module.exports=e(null);}(function e(a){var c=/^\0+/g,r=/[\0\r\f]/g,s=/: */g,t=/zoo|gra/,i=/([,: ])(transform)/g,f=/,+\s*(?![^(]*[)])/g,n=/ +\s*(?![^(]*[)])/g,l=/ *[\0] */g,o=/,\r+?/g,h=/([\t\r\n ])*\f?&/g,u=/:global\(((?:[^\(\)\[\]]*|\[.*\]|\([^\(\)]*\))*)\)/g,d=/\W+/g,b=/@(k\w+)\s*(\S*)\s*/,k=/::(place)/g,p=/:(read-only)/g,g=/\s+(?=[{\];=:>])/g,A=/([[}=:>])\s+/g,C=/(\{[^{]+?);(?=\})/g,w=/\s{2,}/g,v=/([^\(])(:+) */g,m=/[svh]\w+-[tblr]{2}/,x=/\(\s*(.*)\s*\)/g,$=/([\s\S]*?);/g,y=/-self|flex-/g,O=/[^]*?(:[rp][el]a[\w-]+)[^]*/,j=/stretch|:\s*\w+\-(?:conte|avail)/,z=/([^-])(image-set\()/,F="-webkit-",N="-moz-",S="-ms-",B=59,W=125,q=123,D=40,E=41,G=91,H=93,I=10,J=13,K=9,L=64,M=32,P=38,Q=45,R=95,T=42,U=44,V=58,X=39,Y=34,Z=47,_=62,ee=43,ae=126,ce=0,re=12,se=11,te=107,ie=109,fe=115,ne=112,le=111,oe=105,he=99,ue=100,de=112,be=1,ke=1,pe=0,ge=1,Ae=1,Ce=1,we=0,ve=0,me=0,xe=[],$e=[],ye=0,Oe=null,je=-2,ze=-1,Fe=0,Ne=1,Se=2,Be=3,We=0,qe=1,De="",Ee="",Ge="";function He(e,a,s,t,i){for(var f,n,o=0,h=0,u=0,d=0,g=0,A=0,C=0,w=0,m=0,$=0,y=0,O=0,j=0,z=0,R=0,we=0,$e=0,Oe=0,je=0,ze=s.length,Je=ze-1,Re="",Te="",Ue="",Ve="",Xe="",Ye="";R<ze;){if(C=s.charCodeAt(R),R===Je)if(h+d+u+o!==0){if(0!==h)C=h===Z?I:Z;d=u=o=0,ze++,Je++;}if(h+d+u+o===0){if(R===Je){if(we>0)Te=Te.replace(r,"");if(Te.trim().length>0){switch(C){case M:case K:case B:case J:case I:break;default:Te+=s.charAt(R);}C=B;}}if(1===$e)switch(C){case q:case W:case B:case Y:case X:case D:case E:case U:$e=0;case K:case J:case I:case M:break;default:for($e=0,je=R,g=C,R--,C=B;je<ze;)switch(s.charCodeAt(je++)){case I:case J:case B:++R,C=g,je=ze;break;case V:if(we>0)++R,C=g;case q:je=ze;}}switch(C){case q:for(g=(Te=Te.trim()).charCodeAt(0),y=1,je=++R;R<ze;){switch(C=s.charCodeAt(R)){case q:y++;break;case W:y--;break;case Z:switch(A=s.charCodeAt(R+1)){case T:case Z:R=Qe(A,R,Je,s);}break;case G:C++;case D:C++;case Y:case X:for(;R++<Je&&s.charCodeAt(R)!==C;);}if(0===y)break;R++;}if(Ue=s.substring(je,R),g===ce)g=(Te=Te.replace(c,"").trim()).charCodeAt(0);switch(g){case L:if(we>0)Te=Te.replace(r,"");switch(A=Te.charCodeAt(1)){case ue:case ie:case fe:case Q:f=a;break;default:f=xe;}if(je=(Ue=He(a,f,Ue,A,i+1)).length,me>0&&0===je)je=Te.length;if(ye>0)if(f=Ie(xe,Te,Oe),n=Pe(Be,Ue,f,a,ke,be,je,A,i,t),Te=f.join(""),void 0!==n)if(0===(je=(Ue=n.trim()).length))A=0,Ue="";if(je>0)switch(A){case fe:Te=Te.replace(x,Me);case ue:case ie:case Q:Ue=Te+"{"+Ue+"}";break;case te:if(Ue=(Te=Te.replace(b,"$1 $2"+(qe>0?De:"")))+"{"+Ue+"}",1===Ae||2===Ae&&Le("@"+Ue,3))Ue="@"+F+Ue+"@"+Ue;else Ue="@"+Ue;break;default:if(Ue=Te+Ue,t===de)Ve+=Ue,Ue="";}else Ue="";break;default:Ue=He(a,Ie(a,Te,Oe),Ue,t,i+1);}Xe+=Ue,O=0,$e=0,z=0,we=0,Oe=0,j=0,Te="",Ue="",C=s.charCodeAt(++R);break;case W:case B:if((je=(Te=(we>0?Te.replace(r,""):Te).trim()).length)>1){if(0===z)if((g=Te.charCodeAt(0))===Q||g>96&&g<123)je=(Te=Te.replace(" ",":")).length;if(ye>0)if(void 0!==(n=Pe(Ne,Te,a,e,ke,be,Ve.length,t,i,t)))if(0===(je=(Te=n.trim()).length))Te="\0\0";switch(g=Te.charCodeAt(0),A=Te.charCodeAt(1),g){case ce:break;case L:if(A===oe||A===he){Ye+=Te+s.charAt(R);break}default:if(Te.charCodeAt(je-1)===V)break;Ve+=Ke(Te,g,A,Te.charCodeAt(2));}}O=0,$e=0,z=0,we=0,Oe=0,Te="",C=s.charCodeAt(++R);}}switch(C){case J:case I:if(h+d+u+o+ve===0)switch($){case E:case X:case Y:case L:case ae:case _:case T:case ee:case Z:case Q:case V:case U:case B:case q:case W:break;default:if(z>0)$e=1;}if(h===Z)h=0;else if(ge+O===0&&t!==te&&Te.length>0)we=1,Te+="\0";if(ye*We>0)Pe(Fe,Te,a,e,ke,be,Ve.length,t,i,t);be=1,ke++;break;case B:case W:if(h+d+u+o===0){be++;break}default:switch(be++,Re=s.charAt(R),C){case K:case M:if(d+o+h===0)switch(w){case U:case V:case K:case M:Re="";break;default:if(C!==M)Re=" ";}break;case ce:Re="\\0";break;case re:Re="\\f";break;case se:Re="\\v";break;case P:if(d+h+o===0&&ge>0)Oe=1,we=1,Re="\f"+Re;break;case 108:if(d+h+o+pe===0&&z>0)switch(R-z){case 2:if(w===ne&&s.charCodeAt(R-3)===V)pe=w;case 8:if(m===le)pe=m;}break;case V:if(d+h+o===0)z=R;break;case U:if(h+u+d+o===0)we=1,Re+="\r";break;case Y:case X:if(0===h)d=d===C?0:0===d?C:d;break;case G:if(d+h+u===0)o++;break;case H:if(d+h+u===0)o--;break;case E:if(d+h+o===0)u--;break;case D:if(d+h+o===0){if(0===O)switch(2*w+3*m){case 533:break;default:y=0,O=1;}u++;}break;case L:if(h+u+d+o+z+j===0)j=1;break;case T:case Z:if(d+o+u>0)break;switch(h){case 0:switch(2*C+3*s.charCodeAt(R+1)){case 235:h=Z;break;case 220:je=R,h=T;}break;case T:if(C===Z&&w===T&&je+2!==R){if(33===s.charCodeAt(je+2))Ve+=s.substring(je,R+1);Re="",h=0;}}}if(0===h){if(ge+d+o+j===0&&t!==te&&C!==B)switch(C){case U:case ae:case _:case ee:case E:case D:if(0===O){switch(w){case K:case M:case I:case J:Re+="\0";break;default:Re="\0"+Re+(C===U?"":"\0");}we=1;}else switch(C){case D:if(z+7===R&&108===w)z=0;O=++y;break;case E:if(0==(O=--y))we=1,Re+="\0";}break;case K:case M:switch(w){case ce:case q:case W:case B:case U:case re:case K:case M:case I:case J:break;default:if(0===O)we=1,Re+="\0";}}if(Te+=Re,C!==M&&C!==K)$=C;}}m=w,w=C,R++;}if(je=Ve.length,me>0)if(0===je&&0===Xe.length&&0===a[0].length==false)if(t!==ie||1===a.length&&(ge>0?Ee:Ge)===a[0])je=a.join(",").length+2;if(je>0){if(f=0===ge&&t!==te?function(e){for(var a,c,s=0,t=e.length,i=Array(t);s<t;++s){for(var f=e[s].split(l),n="",o=0,h=0,u=0,d=0,b=f.length;o<b;++o){if(0===(h=(c=f[o]).length)&&b>1)continue;if(u=n.charCodeAt(n.length-1),d=c.charCodeAt(0),a="",0!==o)switch(u){case T:case ae:case _:case ee:case M:case D:break;default:a=" ";}switch(d){case P:c=a+Ee;case ae:case _:case ee:case M:case E:case D:break;case G:c=a+c+Ee;break;case V:switch(2*c.charCodeAt(1)+3*c.charCodeAt(2)){case 530:if(Ce>0){c=a+c.substring(8,h-1);break}default:if(o<1||f[o-1].length<1)c=a+Ee+c;}break;case U:a="";default:if(h>1&&c.indexOf(":")>0)c=a+c.replace(v,"$1"+Ee+"$2");else c=a+c+Ee;}n+=c;}i[s]=n.replace(r,"").trim();}return i}(a):a,ye>0)if(void 0!==(n=Pe(Se,Ve,f,e,ke,be,je,t,i,t))&&0===(Ve=n).length)return Ye+Ve+Xe;if(Ve=f.join(",")+"{"+Ve+"}",Ae*pe!=0){if(2===Ae&&!Le(Ve,2))pe=0;switch(pe){case le:Ve=Ve.replace(p,":"+N+"$1")+Ve;break;case ne:Ve=Ve.replace(k,"::"+F+"input-$1")+Ve.replace(k,"::"+N+"$1")+Ve.replace(k,":"+S+"input-$1")+Ve;}pe=0;}}return Ye+Ve+Xe}function Ie(e,a,c){var r=a.trim().split(o),s=r,t=r.length,i=e.length;switch(i){case 0:case 1:for(var f=0,n=0===i?"":e[0]+" ";f<t;++f)s[f]=Je(n,s[f],c,i).trim();break;default:f=0;var l=0;for(s=[];f<t;++f)for(var h=0;h<i;++h)s[l++]=Je(e[h]+" ",r[f],c,i).trim();}return s}function Je(e,a,c,r){var s=a,t=s.charCodeAt(0);if(t<33)t=(s=s.trim()).charCodeAt(0);switch(t){case P:switch(ge+r){case 0:case 1:if(0===e.trim().length)break;default:return s.replace(h,"$1"+e.trim())}break;case V:switch(s.charCodeAt(1)){case 103:if(Ce>0&&ge>0)return s.replace(u,"$1").replace(h,"$1"+Ge);break;default:return e.trim()+s.replace(h,"$1"+e.trim())}default:if(c*ge>0&&s.indexOf("\f")>0)return s.replace(h,(e.charCodeAt(0)===V?"":"$1")+e.trim())}return e+s}function Ke(e,a,c,r){var l,o=0,h=e+";",u=2*a+3*c+4*r;if(944===u)return function(e){var a=e.length,c=e.indexOf(":",9)+1,r=e.substring(0,c).trim(),s=e.substring(c,a-1).trim();switch(e.charCodeAt(9)*qe){case 0:break;case Q:if(110!==e.charCodeAt(10))break;default:for(var t=s.split((s="",f)),i=0,c=0,a=t.length;i<a;c=0,++i){for(var l=t[i],o=l.split(n);l=o[c];){var h=l.charCodeAt(0);if(1===qe&&(h>L&&h<90||h>96&&h<123||h===R||h===Q&&l.charCodeAt(1)!==Q))switch(isNaN(parseFloat(l))+(-1!==l.indexOf("("))){case 1:switch(l){case"infinite":case"alternate":case"backwards":case"running":case"normal":case"forwards":case"both":case"none":case"linear":case"ease":case"ease-in":case"ease-out":case"ease-in-out":case"paused":case"reverse":case"alternate-reverse":case"inherit":case"initial":case"unset":case"step-start":case"step-end":break;default:l+=De;}}o[c++]=l;}s+=(0===i?"":",")+o.join(" ");}}if(s=r+s+";",1===Ae||2===Ae&&Le(s,1))return F+s+s;return s}(h);else if(0===Ae||2===Ae&&!Le(h,1))return h;switch(u){case 1015:return 97===h.charCodeAt(10)?F+h+h:h;case 951:return 116===h.charCodeAt(3)?F+h+h:h;case 963:return 110===h.charCodeAt(5)?F+h+h:h;case 1009:if(100!==h.charCodeAt(4))break;case 969:case 942:return F+h+h;case 978:return F+h+N+h+h;case 1019:case 983:return F+h+N+h+S+h+h;case 883:if(h.charCodeAt(8)===Q)return F+h+h;if(h.indexOf("image-set(",11)>0)return h.replace(z,"$1"+F+"$2")+h;return h;case 932:if(h.charCodeAt(4)===Q)switch(h.charCodeAt(5)){case 103:return F+"box-"+h.replace("-grow","")+F+h+S+h.replace("grow","positive")+h;case 115:return F+h+S+h.replace("shrink","negative")+h;case 98:return F+h+S+h.replace("basis","preferred-size")+h}return F+h+S+h+h;case 964:return F+h+S+"flex-"+h+h;case 1023:if(99!==h.charCodeAt(8))break;return l=h.substring(h.indexOf(":",15)).replace("flex-","").replace("space-between","justify"),F+"box-pack"+l+F+h+S+"flex-pack"+l+h;case 1005:return t.test(h)?h.replace(s,":"+F)+h.replace(s,":"+N)+h:h;case 1e3:switch(o=(l=h.substring(13).trim()).indexOf("-")+1,l.charCodeAt(0)+l.charCodeAt(o)){case 226:l=h.replace(m,"tb");break;case 232:l=h.replace(m,"tb-rl");break;case 220:l=h.replace(m,"lr");break;default:return h}return F+h+S+l+h;case 1017:if(-1===h.indexOf("sticky",9))return h;case 975:switch(o=(h=e).length-10,u=(l=(33===h.charCodeAt(o)?h.substring(0,o):h).substring(e.indexOf(":",7)+1).trim()).charCodeAt(0)+(0|l.charCodeAt(7))){case 203:if(l.charCodeAt(8)<111)break;case 115:h=h.replace(l,F+l)+";"+h;break;case 207:case 102:h=h.replace(l,F+(u>102?"inline-":"")+"box")+";"+h.replace(l,F+l)+";"+h.replace(l,S+l+"box")+";"+h;}return h+";";case 938:if(h.charCodeAt(5)===Q)switch(h.charCodeAt(6)){case 105:return l=h.replace("-items",""),F+h+F+"box-"+l+S+"flex-"+l+h;case 115:return F+h+S+"flex-item-"+h.replace(y,"")+h;default:return F+h+S+"flex-line-pack"+h.replace("align-content","").replace(y,"")+h}break;case 973:case 989:if(h.charCodeAt(3)!==Q||122===h.charCodeAt(4))break;case 931:case 953:if(true===j.test(e))if(115===(l=e.substring(e.indexOf(":")+1)).charCodeAt(0))return Ke(e.replace("stretch","fill-available"),a,c,r).replace(":fill-available",":stretch");else return h.replace(l,F+l)+h.replace(l,N+l.replace("fill-",""))+h;break;case 962:if(h=F+h+(102===h.charCodeAt(5)?S+h:"")+h,c+r===211&&105===h.charCodeAt(13)&&h.indexOf("transform",10)>0)return h.substring(0,h.indexOf(";",27)+1).replace(i,"$1"+F+"$2")+h}return h}function Le(e,a){var c=e.indexOf(1===a?":":"{"),r=e.substring(0,3!==a?c:10),s=e.substring(c+1,e.length-1);return Oe(2!==a?r:r.replace(O,"$1"),s,a)}function Me(e,a){var c=Ke(a,a.charCodeAt(0),a.charCodeAt(1),a.charCodeAt(2));return c!==a+";"?c.replace($," or ($1)").substring(4):"("+a+")"}function Pe(e,a,c,r,s,t,i,f,n,l){for(var o,h=0,u=a;h<ye;++h)switch(o=$e[h].call(Te,e,u,c,r,s,t,i,f,n,l)){case void 0:case false:case true:case null:break;default:u=o;}switch(u){case void 0:case false:case true:case null:case a:break;default:return u}}function Qe(e,a,c,r){for(var s=a+1;s<c;++s)switch(r.charCodeAt(s)){case Z:if(e===T)if(r.charCodeAt(s-1)===T&&a+2!==s)return s+1;break;case I:if(e===Z)return s+1}return s}function Re(e){for(var a in e){var c=e[a];switch(a){case"keyframe":qe=0|c;break;case"global":Ce=0|c;break;case"cascade":ge=0|c;break;case"compress":we=0|c;break;case"semicolon":ve=0|c;break;case"preserve":me=0|c;break;case"prefix":if(Oe=null,!c)Ae=0;else if("function"!=typeof c)Ae=1;else Ae=2,Oe=c;}}return Re}function Te(a,c){if(void 0!==this&&this.constructor===Te)return e(a);var s=a,t=s.charCodeAt(0);if(t<33)t=(s=s.trim()).charCodeAt(0);if(qe>0)De=s.replace(d,t===G?"":"-");if(t=1,1===ge)Ge=s;else Ee=s;var i,f=[Ge];if(ye>0)if(void 0!==(i=Pe(ze,c,f,f,ke,be,0,0,0,0))&&"string"==typeof i)c=i;var n=He(xe,f,c,0,0);if(ye>0)if(void 0!==(i=Pe(je,n,f,f,ke,be,n.length,0,0,0))&&"string"!=typeof(n=i))t=0;return De="",Ge="",Ee="",pe=0,ke=1,be=1,we*t==0?n:n.replace(r,"").replace(g,"").replace(A,"$1").replace(C,"$1").replace(w," ")}if(Te.use=function e(a){switch(a){case void 0:case null:ye=$e.length=0;break;default:switch(a.constructor){case Array:for(var c=0,r=a.length;c<r;++c)e(a[c]);break;case Function:$e[ye++]=a;break;case Boolean:We=0|!!a;}}return e},Te.set=Re,void 0!==a)Re(a);return Te});
426
427 });
428
429 var stylisRuleSheet = createCommonjsModule(function (module, exports) {
430 (function (factory) {
431 module['exports'] = factory();
432 }(function () {
433
434 return function (insertRule) {
435 var delimiter = '/*|*/';
436 var needle = delimiter+'}';
437
438 function toSheet (block) {
439 if (block)
440 try {
441 insertRule(block + '}');
442 } catch (e) {}
443 }
444
445 return function ruleSheet (context, content, selectors, parents, line, column, length, ns, depth, at) {
446 switch (context) {
447 // property
448 case 1:
449 // @import
450 if (depth === 0 && content.charCodeAt(0) === 64)
451 return insertRule(content+';'), ''
452 break
453 // selector
454 case 2:
455 if (ns === 0)
456 return content + delimiter
457 break
458 // at-rule
459 case 3:
460 switch (ns) {
461 // @font-face, @page
462 case 102:
463 case 112:
464 return insertRule(selectors[0]+content), ''
465 default:
466 return content + (at === 0 ? delimiter : '')
467 }
468 case -2:
469 content.split(needle).forEach(toSheet);
470 }
471 }
472 }
473 }));
474 });
475
476 //
477
478 var COMMENT_REGEX = /^\s*\/\/.*$/gm;
479
480 // NOTE: This stylis instance is only used to split rules from SSR'd style tags
481 var stylisSplitter = new stylis_min({
482 global: false,
483 cascade: true,
484 keyframe: false,
485 prefix: false,
486 compress: false,
487 semicolon: true
488 });
489
490 var stylis = new stylis_min({
491 global: false,
492 cascade: true,
493 keyframe: false,
494 prefix: true,
495 compress: false,
496 semicolon: false // NOTE: This means "autocomplete missing semicolons"
497 });
498
499 // Wrap `insertRulePlugin to build a list of rules,
500 // and then make our own plugin to return the rules. This
501 // makes it easier to hook into the existing SSR architecture
502
503 var parsingRules = [];
504
505 // eslint-disable-next-line consistent-return
506 var returnRulesPlugin = function returnRulesPlugin(context) {
507 if (context === -2) {
508 var parsedRules = parsingRules;
509 parsingRules = [];
510 return parsedRules;
511 }
512 };
513
514 var parseRulesPlugin = stylisRuleSheet(function (rule) {
515 parsingRules.push(rule);
516 });
517
518 var _componentId = void 0;
519 var _selector = void 0;
520 var _selectorRegexp = void 0;
521
522 var selfReferenceReplacer = function selfReferenceReplacer(match, offset, string) {
523 if (
524 // the first self-ref is always untouched
525 offset > 0 &&
526 // there should be at least two self-refs to do a replacement (.b > .b)
527 string.slice(0, offset).indexOf(_selector) !== -1 &&
528 // no consecutive self refs (.b.b); that is a precedence boost and treated differently
529 string.slice(offset - _selector.length, offset) !== _selector) {
530 return '.' + _componentId;
531 }
532
533 return match;
534 };
535
536 /**
537 * When writing a style like
538 *
539 * & + & {
540 * color: red;
541 * }
542 *
543 * The second ampersand should be a reference to the static component class. stylis
544 * has no knowledge of static class so we have to intelligently replace the base selector.
545 */
546 var selfReferenceReplacementPlugin = function selfReferenceReplacementPlugin(context, _, selectors) {
547 if (context === 2 && selectors.length && selectors[0].lastIndexOf(_selector) > 0) {
548 // eslint-disable-next-line no-param-reassign
549 selectors[0] = selectors[0].replace(_selectorRegexp, selfReferenceReplacer);
550 }
551 };
552
553 stylis.use([selfReferenceReplacementPlugin, parseRulesPlugin, returnRulesPlugin]);
554 stylisSplitter.use([parseRulesPlugin, returnRulesPlugin]);
555
556 var splitByRules = function splitByRules(css) {
557 return stylisSplitter('', css);
558 };
559
560 function stringifyRules(rules, selector, prefix) {
561 var componentId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '&';
562
563 var flatCSS = rules.join('').replace(COMMENT_REGEX, ''); // replace JS comments
564
565 var cssStr = selector && prefix ? prefix + ' ' + selector + ' { ' + flatCSS + ' }' : flatCSS;
566
567 // stylis has no concept of state to be passed to plugins
568 // but since JS is single=threaded, we can rely on that to ensure
569 // these properties stay in sync with the current stylis run
570 _componentId = componentId;
571 _selector = selector;
572 _selectorRegexp = new RegExp('\\' + _selector + '\\b', 'g');
573
574 return stylis(prefix || !selector ? '' : selector, cssStr);
575 }
576
577 //
578 /* eslint-disable camelcase, no-undef */
579
580 var getNonce = (function () {
581 return typeof __webpack_nonce__ !== 'undefined' ? __webpack_nonce__ : null;
582 });
583
584 //
585 // Helper to call a given function, only once
586 var once = (function (cb) {
587 var called = false;
588
589 return function () {
590 if (!called) {
591 called = true;
592 cb();
593 }
594 };
595 });
596
597 //
598 /* These are helpers for the StyleTags to keep track of the injected
599 * rule names for each (component) ID that they're keeping track of.
600 * They're crucial for detecting whether a name has already been
601 * injected.
602 * (This excludes rehydrated names) */
603
604 /* adds a new ID:name pairing to a names dictionary */
605 var addNameForId = function addNameForId(names, id, name) {
606 if (name) {
607 // eslint-disable-next-line no-param-reassign
608 var namesForId = names[id] || (names[id] = Object.create(null));
609 namesForId[name] = true;
610 }
611 };
612
613 /* resets an ID entirely by overwriting it in the dictionary */
614 var resetIdNames = function resetIdNames(names, id) {
615 // eslint-disable-next-line no-param-reassign
616 names[id] = Object.create(null);
617 };
618
619 /* factory for a names dictionary checking the existance of an ID:name pairing */
620 var hasNameForId = function hasNameForId(names) {
621 return function (id, name) {
622 return names[id] !== undefined && names[id][name];
623 };
624 };
625
626 /* stringifies names for the html/element output */
627 var stringifyNames = function stringifyNames(names) {
628 var str = '';
629 // eslint-disable-next-line guard-for-in
630 for (var id in names) {
631 str += Object.keys(names[id]).join(' ') + ' ';
632 }
633 return str.trim();
634 };
635
636 /* clones the nested names dictionary */
637 var cloneNames = function cloneNames(names) {
638 var clone = Object.create(null);
639 // eslint-disable-next-line guard-for-in
640 for (var id in names) {
641 clone[id] = _extends({}, names[id]);
642 }
643 return clone;
644 };
645
646 //
647
648 //
649
650 /* this marker separates component styles and is important for rehydration */
651 var makeTextMarker = function makeTextMarker(id) {
652 return '\n/* sc-component-id: ' + id + ' */\n';
653 };
654
655 /* create a new style tag after lastEl */
656 var makeStyleTag = function makeStyleTag(target, tagEl, insertBefore) {
657 var el = document.createElement('style');
658 el.setAttribute(SC_ATTR, '');
659 el.setAttribute(SC_VERSION_ATTR, "4.0.2");
660
661 var nonce = getNonce();
662 if (nonce) {
663 el.setAttribute('nonce', nonce);
664 }
665
666 /* Work around insertRule quirk in EdgeHTML */
667 el.appendChild(document.createTextNode(''));
668
669 if (target && !tagEl) {
670 /* Append to target when no previous element was passed */
671 target.appendChild(el);
672 } else {
673 if (!tagEl || !target || !tagEl.parentNode) {
674 throw new StyledComponentsError(6);
675 }
676
677 /* Insert new style tag after the previous one */
678 tagEl.parentNode.insertBefore(el, insertBefore ? tagEl : tagEl.nextSibling);
679 }
680
681 return el;
682 };
683
684 /* takes a css factory function and outputs an html styled tag factory */
685 var wrapAsHtmlTag = function wrapAsHtmlTag(css, names) {
686 return function (additionalAttrs) {
687 var nonce = getNonce();
688 var attrs = [nonce && 'nonce="' + nonce + '"', SC_ATTR + '="' + stringifyNames(names) + '"', SC_VERSION_ATTR + '="' + "4.0.2" + '"', additionalAttrs];
689
690 var htmlAttr = attrs.filter(Boolean).join(' ');
691 return '<style ' + htmlAttr + '>' + css() + '</style>';
692 };
693 };
694
695 /* takes a css factory function and outputs an element factory */
696 var wrapAsElement = function wrapAsElement(css, names) {
697 return function () {
698 var _props;
699
700 var props = (_props = {}, _props[SC_ATTR] = stringifyNames(names), _props[SC_VERSION_ATTR] = "4.0.2", _props);
701
702 var nonce = getNonce();
703 if (nonce) {
704 // $FlowFixMe
705 props.nonce = nonce;
706 }
707
708 // eslint-disable-next-line react/no-danger
709 return React__default.createElement('style', _extends({}, props, { dangerouslySetInnerHTML: { __html: css() } }));
710 };
711 };
712
713 var getIdsFromMarkersFactory = function getIdsFromMarkersFactory(markers) {
714 return function () {
715 return Object.keys(markers);
716 };
717 };
718
719 var makeTextNode = function makeTextNode(id) {
720 return document.createTextNode(makeTextMarker(id));
721 };
722
723 var makeBrowserTag = function makeBrowserTag(el, getImportRuleTag) {
724 var names = Object.create(null);
725 var markers = Object.create(null);
726
727 var extractImport = getImportRuleTag !== undefined;
728
729 /* indicates whther getImportRuleTag was called */
730 var usedImportRuleTag = false;
731
732 var insertMarker = function insertMarker(id) {
733 var prev = markers[id];
734 if (prev !== undefined) {
735 return prev;
736 }
737
738 markers[id] = makeTextNode(id);
739 el.appendChild(markers[id]);
740 names[id] = Object.create(null);
741
742 return markers[id];
743 };
744
745 var insertRules = function insertRules(id, cssRules, name) {
746 var marker = insertMarker(id);
747 var importRules = [];
748 var cssRulesSize = cssRules.length;
749
750 for (var i = 0; i < cssRulesSize; i += 1) {
751 var rule = cssRules[i];
752 var mayHaveImport = extractImport;
753 if (mayHaveImport && rule.indexOf('@import') !== -1) {
754 importRules.push(rule);
755 } else {
756 mayHaveImport = false;
757 var separator = i === cssRulesSize - 1 ? '' : ' ';
758 marker.appendData('' + rule + separator);
759 }
760 }
761
762 addNameForId(names, id, name);
763
764 if (extractImport && importRules.length > 0) {
765 usedImportRuleTag = true;
766 // $FlowFixMe
767 getImportRuleTag().insertRules(id + '-import', importRules);
768 }
769 };
770
771 var removeRules = function removeRules(id) {
772 var marker = markers[id];
773 if (marker === undefined) return;
774
775 /* create new empty text node and replace the current one */
776 var newMarker = makeTextNode(id);
777 el.replaceChild(newMarker, marker);
778 markers[id] = newMarker;
779 resetIdNames(names, id);
780
781 if (extractImport && usedImportRuleTag) {
782 // $FlowFixMe
783 getImportRuleTag().removeRules(id + '-import');
784 }
785 };
786
787 var css = function css() {
788 var str = '';
789
790 // eslint-disable-next-line guard-for-in
791 for (var id in markers) {
792 str += markers[id].data;
793 }
794
795 return str;
796 };
797
798 return {
799 clone: function clone() {
800 throw new StyledComponentsError(5);
801 },
802
803 css: css,
804 getIds: getIdsFromMarkersFactory(markers),
805 hasNameForId: hasNameForId(names),
806 insertMarker: insertMarker,
807 insertRules: insertRules,
808 removeRules: removeRules,
809 sealed: false,
810 styleTag: el,
811 toElement: wrapAsElement(css, names),
812 toHTML: wrapAsHtmlTag(css, names)
813 };
814 };
815
816 var makeServerTag = function makeServerTag(namesArg, markersArg) {
817 var names = namesArg === undefined ? Object.create(null) : namesArg;
818 var markers = markersArg === undefined ? Object.create(null) : markersArg;
819
820 var insertMarker = function insertMarker(id) {
821 var prev = markers[id];
822 if (prev !== undefined) {
823 return prev;
824 }
825
826 return markers[id] = [''];
827 };
828
829 var insertRules = function insertRules(id, cssRules, name) {
830 var marker = insertMarker(id);
831 marker[0] += cssRules.join(' ');
832 addNameForId(names, id, name);
833 };
834
835 var removeRules = function removeRules(id) {
836 var marker = markers[id];
837 if (marker === undefined) return;
838 marker[0] = '';
839 resetIdNames(names, id);
840 };
841
842 var css = function css() {
843 var str = '';
844 // eslint-disable-next-line guard-for-in
845 for (var id in markers) {
846 var cssForId = markers[id][0];
847 if (cssForId) {
848 str += makeTextMarker(id) + cssForId;
849 }
850 }
851 return str;
852 };
853
854 var clone = function clone() {
855 var namesClone = cloneNames(names);
856 var markersClone = Object.create(null);
857
858 // eslint-disable-next-line guard-for-in
859 for (var id in markers) {
860 markersClone[id] = [markers[id][0]];
861 }
862
863 return makeServerTag(namesClone, markersClone);
864 };
865
866 var tag = {
867 clone: clone,
868 css: css,
869 getIds: getIdsFromMarkersFactory(markers),
870 hasNameForId: hasNameForId(names),
871 insertMarker: insertMarker,
872 insertRules: insertRules,
873 removeRules: removeRules,
874 sealed: false,
875 styleTag: null,
876 toElement: wrapAsElement(css, names),
877 toHTML: wrapAsHtmlTag(css, names)
878 };
879
880 return tag;
881 };
882
883 var makeTag = function makeTag(target, tagEl, forceServer, insertBefore, getImportRuleTag) {
884 if (IS_BROWSER && !forceServer) {
885 var el = makeStyleTag(target, tagEl, insertBefore);
886
887 {
888 return makeBrowserTag(el, getImportRuleTag);
889 }
890 }
891
892 return makeServerTag();
893 };
894
895 /* wraps a given tag so that rehydration is performed once when necessary */
896 var makeRehydrationTag = function makeRehydrationTag(tag, els, extracted, immediateRehydration) {
897 /* rehydration function that adds all rules to the new tag */
898 var rehydrate = once(function () {
899 /* add all extracted components to the new tag */
900 for (var i = 0, len = extracted.length; i < len; i += 1) {
901 var _extracted$i = extracted[i],
902 componentId = _extracted$i.componentId,
903 cssFromDOM = _extracted$i.cssFromDOM;
904
905 var cssRules = splitByRules(cssFromDOM);
906 tag.insertRules(componentId, cssRules);
907 }
908
909 /* remove old HTMLStyleElements, since they have been rehydrated */
910 for (var _i = 0, _len = els.length; _i < _len; _i += 1) {
911 var el = els[_i];
912 if (el.parentNode) {
913 el.parentNode.removeChild(el);
914 }
915 }
916 });
917
918 if (immediateRehydration) rehydrate();
919
920 return _extends({}, tag, {
921
922 /* add rehydration hook to methods */
923 insertMarker: function insertMarker(id) {
924 rehydrate();
925 return tag.insertMarker(id);
926 },
927
928 insertRules: function insertRules(id, cssRules, name) {
929 rehydrate();
930 return tag.insertRules(id, cssRules, name);
931 },
932
933 removeRules: function removeRules(id) {
934 rehydrate();
935 return tag.removeRules(id);
936 }
937 });
938 };
939
940 //
941
942 var SPLIT_REGEX = /\s+/;
943
944 /* determine the maximum number of components before tags are sharded */
945 var MAX_SIZE = void 0;
946 if (IS_BROWSER) {
947 /* in speedy mode we can keep a lot more rules in a sheet before a slowdown can be expected */
948 MAX_SIZE = 40;
949 } else {
950 /* for servers we do not need to shard at all */
951 MAX_SIZE = -1;
952 }
953
954 var sheetRunningId = 0;
955 var master = void 0;
956
957 var StyleSheet = function () {
958
959 /* a map from ids to tags */
960
961 /* deferred rules for a given id */
962
963 /* this is used for not reinjecting rules via hasNameForId() */
964
965 /* when rules for an id are removed using remove() we have to ignore rehydratedNames for it */
966
967 /* a list of tags belonging to this StyleSheet */
968
969 /* a tag for import rules */
970
971 /* current capacity until a new tag must be created */
972
973 /* children (aka clones) of this StyleSheet inheriting all and future injections */
974
975 function StyleSheet() {
976 var _this = this;
977
978 var target = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : IS_BROWSER ? document.head : null;
979 var forceServer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
980 classCallCheck(this, StyleSheet);
981
982 this.getImportRuleTag = function () {
983 var importRuleTag = _this.importRuleTag;
984
985 if (importRuleTag !== undefined) {
986 return importRuleTag;
987 }
988
989 var firstTag = _this.tags[0];
990 var insertBefore = true;
991
992 return _this.importRuleTag = makeTag(_this.target, firstTag ? firstTag.styleTag : null, _this.forceServer, insertBefore);
993 };
994
995 sheetRunningId += 1;
996 this.id = sheetRunningId;
997 this.forceServer = forceServer;
998 this.target = forceServer ? null : target;
999 this.tagMap = {};
1000 this.deferred = {};
1001 this.rehydratedNames = {};
1002 this.ignoreRehydratedNames = {};
1003 this.tags = [];
1004 this.capacity = 1;
1005 this.clones = [];
1006 }
1007
1008 /* rehydrate all SSR'd style tags */
1009
1010
1011 StyleSheet.prototype.rehydrate = function rehydrate() {
1012 if (!IS_BROWSER || this.forceServer) {
1013 return this;
1014 }
1015 var els = [];
1016 var extracted = [];
1017 var isStreamed = false;
1018
1019 /* retrieve all of our SSR style elements from the DOM */
1020 var nodes = document.querySelectorAll('style[' + SC_ATTR + '][' + SC_VERSION_ATTR + '="' + "4.0.2" + '"]');
1021 var nodesSize = nodes.length;
1022
1023 /* abort rehydration if no previous style tags were found */
1024 if (nodesSize === 0) {
1025 return this;
1026 }
1027
1028 for (var i = 0; i < nodesSize; i += 1) {
1029 // $FlowFixMe: We can trust that all elements in this query are style elements
1030 var el = nodes[i];
1031
1032 /* check if style tag is a streamed tag */
1033 if (!isStreamed) isStreamed = !!el.getAttribute(SC_STREAM_ATTR);
1034
1035 /* retrieve all component names */
1036 var elNames = (el.getAttribute(SC_ATTR) || '').trim().split(SPLIT_REGEX);
1037 var elNamesSize = elNames.length;
1038 for (var j = 0; j < elNamesSize; j += 1) {
1039 var name = elNames[j];
1040 /* add rehydrated name to sheet to avoid readding styles */
1041 this.rehydratedNames[name] = true;
1042 }
1043
1044 /* extract all components and their CSS */
1045 extracted.push.apply(extracted, extractComps(el.textContent));
1046
1047 /* store original HTMLStyleElement */
1048 els.push(el);
1049 }
1050
1051 /* abort rehydration if nothing was extracted */
1052 var extractedSize = extracted.length;
1053 if (extractedSize === 0) {
1054 return this;
1055 }
1056
1057 /* create a tag to be used for rehydration */
1058 var tag = this.makeTag(null);
1059 var rehydrationTag = makeRehydrationTag(tag, els, extracted, isStreamed);
1060
1061 /* reset capacity and adjust MAX_SIZE by the initial size of the rehydration */
1062 this.capacity = Math.max(1, MAX_SIZE - extractedSize);
1063 this.tags.push(rehydrationTag);
1064
1065 /* retrieve all component ids */
1066 for (var _j = 0; _j < extractedSize; _j += 1) {
1067 this.tagMap[extracted[_j].componentId] = rehydrationTag;
1068 }
1069
1070 return this;
1071 };
1072
1073 /* retrieve a "master" instance of StyleSheet which is typically used when no other is available
1074 * The master StyleSheet is targeted by createGlobalStyle, keyframes, and components outside of any
1075 * StyleSheetManager's context */
1076
1077
1078 /* reset the internal "master" instance */
1079 StyleSheet.reset = function reset() {
1080 var forceServer = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
1081
1082 master = new StyleSheet(undefined, forceServer).rehydrate();
1083 };
1084
1085 /* adds "children" to the StyleSheet that inherit all of the parents' rules
1086 * while their own rules do not affect the parent */
1087
1088
1089 StyleSheet.prototype.clone = function clone() {
1090 var sheet = new StyleSheet(this.target, this.forceServer);
1091
1092 /* add to clone array */
1093 this.clones.push(sheet);
1094
1095 /* clone all tags */
1096 sheet.tags = this.tags.map(function (tag) {
1097 var ids = tag.getIds();
1098 var newTag = tag.clone();
1099
1100 /* reconstruct tagMap */
1101 for (var i = 0; i < ids.length; i += 1) {
1102 sheet.tagMap[ids[i]] = newTag;
1103 }
1104
1105 return newTag;
1106 });
1107
1108 /* clone other maps */
1109 sheet.rehydratedNames = _extends({}, this.rehydratedNames);
1110 sheet.deferred = _extends({}, this.deferred);
1111
1112 return sheet;
1113 };
1114
1115 /* force StyleSheet to create a new tag on the next injection */
1116
1117
1118 StyleSheet.prototype.sealAllTags = function sealAllTags() {
1119 this.capacity = 1;
1120
1121 this.tags.forEach(function (tag) {
1122 // eslint-disable-next-line no-param-reassign
1123 tag.sealed = true;
1124 });
1125 };
1126
1127 StyleSheet.prototype.makeTag = function makeTag$$1(tag) {
1128 var lastEl = tag ? tag.styleTag : null;
1129 var insertBefore = false;
1130
1131 return makeTag(this.target, lastEl, this.forceServer, insertBefore, this.getImportRuleTag);
1132 };
1133
1134 /* get a tag for a given componentId, assign the componentId to one, or shard */
1135 StyleSheet.prototype.getTagForId = function getTagForId(id) {
1136 /* simply return a tag, when the componentId was already assigned one */
1137 var prev = this.tagMap[id];
1138 if (prev !== undefined && !prev.sealed) {
1139 return prev;
1140 }
1141
1142 var tag = this.tags[this.tags.length - 1];
1143
1144 /* shard (create a new tag) if the tag is exhausted (See MAX_SIZE) */
1145 this.capacity -= 1;
1146
1147 if (this.capacity === 0) {
1148 this.capacity = MAX_SIZE;
1149 tag = this.makeTag(tag);
1150 this.tags.push(tag);
1151 }
1152
1153 return this.tagMap[id] = tag;
1154 };
1155
1156 /* mainly for createGlobalStyle to check for its id */
1157
1158
1159 StyleSheet.prototype.hasId = function hasId(id) {
1160 return this.tagMap[id] !== undefined;
1161 };
1162
1163 /* caching layer checking id+name to already have a corresponding tag and injected rules */
1164
1165
1166 StyleSheet.prototype.hasNameForId = function hasNameForId(id, name) {
1167 /* exception for rehydrated names which are checked separately */
1168 if (this.ignoreRehydratedNames[id] === undefined && this.rehydratedNames[name]) {
1169 return true;
1170 }
1171
1172 var tag = this.tagMap[id];
1173 return tag !== undefined && tag.hasNameForId(id, name);
1174 };
1175
1176 /* registers a componentId and registers it on its tag */
1177
1178
1179 StyleSheet.prototype.deferredInject = function deferredInject(id, cssRules) {
1180 /* don't inject when the id is already registered */
1181 if (this.tagMap[id] !== undefined) return;
1182
1183 var clones = this.clones;
1184
1185 for (var i = 0; i < clones.length; i += 1) {
1186 clones[i].deferredInject(id, cssRules);
1187 }
1188
1189 this.getTagForId(id).insertMarker(id);
1190 this.deferred[id] = cssRules;
1191 };
1192
1193 /* injects rules for a given id with a name that will need to be cached */
1194
1195
1196 StyleSheet.prototype.inject = function inject(id, cssRules, name) {
1197 var clones = this.clones;
1198
1199
1200 for (var i = 0; i < clones.length; i += 1) {
1201 clones[i].inject(id, cssRules, name);
1202 }
1203
1204 var tag = this.getTagForId(id);
1205
1206 /* add deferred rules for component */
1207 if (this.deferred[id] !== undefined) {
1208 // Combine passed cssRules with previously deferred CSS rules
1209 // NOTE: We cannot mutate the deferred array itself as all clones
1210 // do the same (see clones[i].inject)
1211 var rules = this.deferred[id].concat(cssRules);
1212 tag.insertRules(id, rules, name);
1213
1214 this.deferred[id] = undefined;
1215 } else {
1216 tag.insertRules(id, cssRules, name);
1217 }
1218 };
1219
1220 /* removes all rules for a given id, which doesn't remove its marker but resets it */
1221
1222
1223 StyleSheet.prototype.remove = function remove(id) {
1224 var tag = this.tagMap[id];
1225 if (tag === undefined) return;
1226
1227 var clones = this.clones;
1228
1229 for (var i = 0; i < clones.length; i += 1) {
1230 clones[i].remove(id);
1231 }
1232
1233 /* remove all rules from the tag */
1234 tag.removeRules(id);
1235
1236 /* ignore possible rehydrated names */
1237 this.ignoreRehydratedNames[id] = true;
1238
1239 /* delete possible deferred rules */
1240 this.deferred[id] = undefined;
1241 };
1242
1243 StyleSheet.prototype.toHTML = function toHTML() {
1244 return this.tags.map(function (tag) {
1245 return tag.toHTML();
1246 }).join('');
1247 };
1248
1249 StyleSheet.prototype.toReactElements = function toReactElements() {
1250 var id = this.id;
1251
1252
1253 return this.tags.map(function (tag, i) {
1254 var key = 'sc-' + id + '-' + i;
1255 return React.cloneElement(tag.toElement(), { key: key });
1256 });
1257 };
1258
1259 createClass(StyleSheet, null, [{
1260 key: 'master',
1261 get: function get$$1() {
1262 return master || (master = new StyleSheet().rehydrate());
1263 }
1264
1265 /* NOTE: This is just for backwards-compatibility with jest-styled-components */
1266
1267 }, {
1268 key: 'instance',
1269 get: function get$$1() {
1270 return StyleSheet.master;
1271 }
1272 }]);
1273 return StyleSheet;
1274 }();
1275
1276 //
1277
1278 var Keyframes = function () {
1279 function Keyframes(name, rules) {
1280 var _this = this;
1281
1282 classCallCheck(this, Keyframes);
1283
1284 this.inject = function (styleSheet) {
1285 if (!styleSheet.hasNameForId(_this.id, _this.name)) {
1286 styleSheet.inject(_this.id, _this.rules, _this.name);
1287 }
1288 };
1289
1290 this.toString = function () {
1291 throw new StyledComponentsError(12, String(_this.name));
1292 };
1293
1294 this.name = name;
1295 this.rules = rules;
1296
1297 this.id = 'sc-keyframes-' + name;
1298 }
1299
1300 Keyframes.prototype.getName = function getName() {
1301 return this.name;
1302 };
1303
1304 return Keyframes;
1305 }();
1306
1307 //
1308
1309 /**
1310 * inlined version of
1311 * https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/hyphenateStyleName.js
1312 */
1313
1314 var uppercasePattern = /([A-Z])/g;
1315 var msPattern = /^ms-/;
1316
1317 /**
1318 * Hyphenates a camelcased CSS property name, for example:
1319 *
1320 * > hyphenateStyleName('backgroundColor')
1321 * < "background-color"
1322 * > hyphenateStyleName('MozTransition')
1323 * < "-moz-transition"
1324 * > hyphenateStyleName('msTransition')
1325 * < "-ms-transition"
1326 *
1327 * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
1328 * is converted to `-ms-`.
1329 *
1330 * @param {string} string
1331 * @return {string}
1332 */
1333 function hyphenateStyleName(string) {
1334 return string.replace(uppercasePattern, '-$1').toLowerCase().replace(msPattern, '-ms-');
1335 }
1336
1337 //
1338
1339 var objToCss = function objToCss(obj, prevKey) {
1340 var css = Object.keys(obj).filter(function (key) {
1341 var chunk = obj[key];
1342 return chunk !== undefined && chunk !== null && chunk !== false && chunk !== '';
1343 }).map(function (key) {
1344 if (isPlainObject(obj[key])) return objToCss(obj[key], key);
1345 return hyphenateStyleName(key) + ': ' + obj[key] + ';';
1346 }).join(' ');
1347 return prevKey ? prevKey + ' {\n ' + css + '\n}' : css;
1348 };
1349
1350 /**
1351 * It's falsish not falsy because 0 is allowed.
1352 */
1353 var isFalsish = function isFalsish(chunk) {
1354 return chunk === undefined || chunk === null || chunk === false || chunk === '';
1355 };
1356
1357 function flatten(chunk, executionContext, styleSheet) {
1358 if (Array.isArray(chunk)) {
1359 var ruleSet = [];
1360
1361 for (var i = 0, len = chunk.length, result; i < len; i += 1) {
1362 result = flatten(chunk[i], executionContext, styleSheet);
1363
1364 if (result === null) continue;else if (Array.isArray(result)) ruleSet.push.apply(ruleSet, result);else ruleSet.push(result);
1365 }
1366
1367 return ruleSet;
1368 }
1369
1370 if (isFalsish(chunk)) {
1371 return null;
1372 }
1373
1374 /* Handle other components */
1375 if (isStyledComponent(chunk)) {
1376 return '.' + chunk.styledComponentId;
1377 }
1378
1379 /* Either execute or defer the function */
1380 if (isFunction(chunk)) {
1381 if (executionContext) {
1382 {
1383 /* Warn if not referring styled component */
1384 try {
1385 // eslint-disable-next-line new-cap
1386 if (reactIs_1(new chunk(executionContext))) {
1387 console.warn(getComponentName(chunk) + ' 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.');
1388 }
1389 // eslint-disable-next-line no-empty
1390 } catch (e) {}
1391 }
1392
1393 return flatten(chunk(executionContext), executionContext, styleSheet);
1394 } else return chunk;
1395 }
1396
1397 if (chunk instanceof Keyframes) {
1398 if (styleSheet) {
1399 chunk.inject(styleSheet);
1400 return chunk.getName();
1401 } else return chunk;
1402 }
1403
1404 /* Handle objects */
1405 return isPlainObject(chunk) ? objToCss(chunk) : chunk.toString();
1406 }
1407
1408 //
1409
1410 function css(styles) {
1411 for (var _len = arguments.length, interpolations = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
1412 interpolations[_key - 1] = arguments[_key];
1413 }
1414
1415 if (isFunction(styles) || isPlainObject(styles)) {
1416 // $FlowFixMe
1417 return flatten(interleave(EMPTY_ARRAY, [styles].concat(interpolations)));
1418 }
1419
1420 // $FlowFixMe
1421 return flatten(interleave(styles, interpolations));
1422 }
1423
1424 /*
1425 object-assign
1426 (c) Sindre Sorhus
1427 @license MIT
1428 */
1429 /* eslint-disable no-unused-vars */
1430 var getOwnPropertySymbols = Object.getOwnPropertySymbols;
1431 var hasOwnProperty = Object.prototype.hasOwnProperty;
1432 var propIsEnumerable = Object.prototype.propertyIsEnumerable;
1433
1434 function toObject(val) {
1435 if (val === null || val === undefined) {
1436 throw new TypeError('Object.assign cannot be called with null or undefined');
1437 }
1438
1439 return Object(val);
1440 }
1441
1442 function shouldUseNative() {
1443 try {
1444 if (!Object.assign) {
1445 return false;
1446 }
1447
1448 // Detect buggy property enumeration order in older V8 versions.
1449
1450 // https://bugs.chromium.org/p/v8/issues/detail?id=4118
1451 var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
1452 test1[5] = 'de';
1453 if (Object.getOwnPropertyNames(test1)[0] === '5') {
1454 return false;
1455 }
1456
1457 // https://bugs.chromium.org/p/v8/issues/detail?id=3056
1458 var test2 = {};
1459 for (var i = 0; i < 10; i++) {
1460 test2['_' + String.fromCharCode(i)] = i;
1461 }
1462 var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
1463 return test2[n];
1464 });
1465 if (order2.join('') !== '0123456789') {
1466 return false;
1467 }
1468
1469 // https://bugs.chromium.org/p/v8/issues/detail?id=3056
1470 var test3 = {};
1471 'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
1472 test3[letter] = letter;
1473 });
1474 if (Object.keys(Object.assign({}, test3)).join('') !==
1475 'abcdefghijklmnopqrst') {
1476 return false;
1477 }
1478
1479 return true;
1480 } catch (err) {
1481 // We don't expect any of the above to throw, but better to be safe.
1482 return false;
1483 }
1484 }
1485
1486 var objectAssign = shouldUseNative() ? Object.assign : function (target, source) {
1487 var from;
1488 var to = toObject(target);
1489 var symbols;
1490
1491 for (var s = 1; s < arguments.length; s++) {
1492 from = Object(arguments[s]);
1493
1494 for (var key in from) {
1495 if (hasOwnProperty.call(from, key)) {
1496 to[key] = from[key];
1497 }
1498 }
1499
1500 if (getOwnPropertySymbols) {
1501 symbols = getOwnPropertySymbols(from);
1502 for (var i = 0; i < symbols.length; i++) {
1503 if (propIsEnumerable.call(from, symbols[i])) {
1504 to[symbols[i]] = from[symbols[i]];
1505 }
1506 }
1507 }
1508 }
1509
1510 return to;
1511 };
1512
1513 /**
1514 * Copyright (c) 2013-present, Facebook, Inc.
1515 *
1516 * This source code is licensed under the MIT license found in the
1517 * LICENSE file in the root directory of this source tree.
1518 */
1519
1520 var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
1521
1522 var ReactPropTypesSecret_1 = ReactPropTypesSecret;
1523
1524 var printWarning = function() {};
1525
1526 {
1527 var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
1528 var loggedTypeFailures = {};
1529
1530 printWarning = function(text) {
1531 var message = 'Warning: ' + text;
1532 if (typeof console !== 'undefined') {
1533 console.error(message);
1534 }
1535 try {
1536 // --- Welcome to debugging React ---
1537 // This error was thrown as a convenience so that you can use this stack
1538 // to find the callsite that caused this warning to fire.
1539 throw new Error(message);
1540 } catch (x) {}
1541 };
1542 }
1543
1544 /**
1545 * Assert that the values match with the type specs.
1546 * Error messages are memorized and will only be shown once.
1547 *
1548 * @param {object} typeSpecs Map of name to a ReactPropType
1549 * @param {object} values Runtime values that need to be type-checked
1550 * @param {string} location e.g. "prop", "context", "child context"
1551 * @param {string} componentName Name of the component for error messages.
1552 * @param {?Function} getStack Returns the component stack.
1553 * @private
1554 */
1555 function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
1556 {
1557 for (var typeSpecName in typeSpecs) {
1558 if (typeSpecs.hasOwnProperty(typeSpecName)) {
1559 var error;
1560 // Prop type validation may throw. In case they do, we don't want to
1561 // fail the render phase where it didn't fail before. So we log it.
1562 // After these have been cleaned up, we'll let them throw.
1563 try {
1564 // This is intentionally an invariant that gets caught. It's the same
1565 // behavior as without this statement except with a better message.
1566 if (typeof typeSpecs[typeSpecName] !== 'function') {
1567 var err = Error(
1568 (componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +
1569 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.'
1570 );
1571 err.name = 'Invariant Violation';
1572 throw err;
1573 }
1574 error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$1);
1575 } catch (ex) {
1576 error = ex;
1577 }
1578 if (error && !(error instanceof Error)) {
1579 printWarning(
1580 (componentName || 'React class') + ': type specification of ' +
1581 location + ' `' + typeSpecName + '` is invalid; the type checker ' +
1582 'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
1583 'You may have forgotten to pass an argument to the type checker ' +
1584 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
1585 'shape all require an argument).'
1586 );
1587
1588 }
1589 if (error instanceof Error && !(error.message in loggedTypeFailures)) {
1590 // Only monitor this failure once because there tends to be a lot of the
1591 // same error.
1592 loggedTypeFailures[error.message] = true;
1593
1594 var stack = getStack ? getStack() : '';
1595
1596 printWarning(
1597 'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
1598 );
1599 }
1600 }
1601 }
1602 }
1603 }
1604
1605 var checkPropTypes_1 = checkPropTypes;
1606
1607 var printWarning$1 = function() {};
1608
1609 {
1610 printWarning$1 = function(text) {
1611 var message = 'Warning: ' + text;
1612 if (typeof console !== 'undefined') {
1613 console.error(message);
1614 }
1615 try {
1616 // --- Welcome to debugging React ---
1617 // This error was thrown as a convenience so that you can use this stack
1618 // to find the callsite that caused this warning to fire.
1619 throw new Error(message);
1620 } catch (x) {}
1621 };
1622 }
1623
1624 function emptyFunctionThatReturnsNull() {
1625 return null;
1626 }
1627
1628 var factoryWithTypeCheckers = function(isValidElement, throwOnDirectAccess) {
1629 /* global Symbol */
1630 var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
1631 var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
1632
1633 /**
1634 * Returns the iterator method function contained on the iterable object.
1635 *
1636 * Be sure to invoke the function with the iterable as context:
1637 *
1638 * var iteratorFn = getIteratorFn(myIterable);
1639 * if (iteratorFn) {
1640 * var iterator = iteratorFn.call(myIterable);
1641 * ...
1642 * }
1643 *
1644 * @param {?object} maybeIterable
1645 * @return {?function}
1646 */
1647 function getIteratorFn(maybeIterable) {
1648 var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
1649 if (typeof iteratorFn === 'function') {
1650 return iteratorFn;
1651 }
1652 }
1653
1654 /**
1655 * Collection of methods that allow declaration and validation of props that are
1656 * supplied to React components. Example usage:
1657 *
1658 * var Props = require('ReactPropTypes');
1659 * var MyArticle = React.createClass({
1660 * propTypes: {
1661 * // An optional string prop named "description".
1662 * description: Props.string,
1663 *
1664 * // A required enum prop named "category".
1665 * category: Props.oneOf(['News','Photos']).isRequired,
1666 *
1667 * // A prop named "dialog" that requires an instance of Dialog.
1668 * dialog: Props.instanceOf(Dialog).isRequired
1669 * },
1670 * render: function() { ... }
1671 * });
1672 *
1673 * A more formal specification of how these methods are used:
1674 *
1675 * type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
1676 * decl := ReactPropTypes.{type}(.isRequired)?
1677 *
1678 * Each and every declaration produces a function with the same signature. This
1679 * allows the creation of custom validation functions. For example:
1680 *
1681 * var MyLink = React.createClass({
1682 * propTypes: {
1683 * // An optional string or URI prop named "href".
1684 * href: function(props, propName, componentName) {
1685 * var propValue = props[propName];
1686 * if (propValue != null && typeof propValue !== 'string' &&
1687 * !(propValue instanceof URI)) {
1688 * return new Error(
1689 * 'Expected a string or an URI for ' + propName + ' in ' +
1690 * componentName
1691 * );
1692 * }
1693 * }
1694 * },
1695 * render: function() {...}
1696 * });
1697 *
1698 * @internal
1699 */
1700
1701 var ANONYMOUS = '<<anonymous>>';
1702
1703 // Important!
1704 // Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
1705 var ReactPropTypes = {
1706 array: createPrimitiveTypeChecker('array'),
1707 bool: createPrimitiveTypeChecker('boolean'),
1708 func: createPrimitiveTypeChecker('function'),
1709 number: createPrimitiveTypeChecker('number'),
1710 object: createPrimitiveTypeChecker('object'),
1711 string: createPrimitiveTypeChecker('string'),
1712 symbol: createPrimitiveTypeChecker('symbol'),
1713
1714 any: createAnyTypeChecker(),
1715 arrayOf: createArrayOfTypeChecker,
1716 element: createElementTypeChecker(),
1717 instanceOf: createInstanceTypeChecker,
1718 node: createNodeChecker(),
1719 objectOf: createObjectOfTypeChecker,
1720 oneOf: createEnumTypeChecker,
1721 oneOfType: createUnionTypeChecker,
1722 shape: createShapeTypeChecker,
1723 exact: createStrictShapeTypeChecker,
1724 };
1725
1726 /**
1727 * inlined Object.is polyfill to avoid requiring consumers ship their own
1728 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
1729 */
1730 /*eslint-disable no-self-compare*/
1731 function is(x, y) {
1732 // SameValue algorithm
1733 if (x === y) {
1734 // Steps 1-5, 7-10
1735 // Steps 6.b-6.e: +0 != -0
1736 return x !== 0 || 1 / x === 1 / y;
1737 } else {
1738 // Step 6.a: NaN == NaN
1739 return x !== x && y !== y;
1740 }
1741 }
1742 /*eslint-enable no-self-compare*/
1743
1744 /**
1745 * We use an Error-like object for backward compatibility as people may call
1746 * PropTypes directly and inspect their output. However, we don't use real
1747 * Errors anymore. We don't inspect their stack anyway, and creating them
1748 * is prohibitively expensive if they are created too often, such as what
1749 * happens in oneOfType() for any type before the one that matched.
1750 */
1751 function PropTypeError(message) {
1752 this.message = message;
1753 this.stack = '';
1754 }
1755 // Make `instanceof Error` still work for returned errors.
1756 PropTypeError.prototype = Error.prototype;
1757
1758 function createChainableTypeChecker(validate) {
1759 {
1760 var manualPropTypeCallCache = {};
1761 var manualPropTypeWarningCount = 0;
1762 }
1763 function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
1764 componentName = componentName || ANONYMOUS;
1765 propFullName = propFullName || propName;
1766
1767 if (secret !== ReactPropTypesSecret_1) {
1768 if (throwOnDirectAccess) {
1769 // New behavior only for users of `prop-types` package
1770 var err = new Error(
1771 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
1772 'Use `PropTypes.checkPropTypes()` to call them. ' +
1773 'Read more at http://fb.me/use-check-prop-types'
1774 );
1775 err.name = 'Invariant Violation';
1776 throw err;
1777 } else if (typeof console !== 'undefined') {
1778 // Old behavior for people using React.PropTypes
1779 var cacheKey = componentName + ':' + propName;
1780 if (
1781 !manualPropTypeCallCache[cacheKey] &&
1782 // Avoid spamming the console because they are often not actionable except for lib authors
1783 manualPropTypeWarningCount < 3
1784 ) {
1785 printWarning$1(
1786 'You are manually calling a React.PropTypes validation ' +
1787 'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
1788 'and will throw in the standalone `prop-types` package. ' +
1789 'You may be seeing this warning due to a third-party PropTypes ' +
1790 'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.'
1791 );
1792 manualPropTypeCallCache[cacheKey] = true;
1793 manualPropTypeWarningCount++;
1794 }
1795 }
1796 }
1797 if (props[propName] == null) {
1798 if (isRequired) {
1799 if (props[propName] === null) {
1800 return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
1801 }
1802 return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
1803 }
1804 return null;
1805 } else {
1806 return validate(props, propName, componentName, location, propFullName);
1807 }
1808 }
1809
1810 var chainedCheckType = checkType.bind(null, false);
1811 chainedCheckType.isRequired = checkType.bind(null, true);
1812
1813 return chainedCheckType;
1814 }
1815
1816 function createPrimitiveTypeChecker(expectedType) {
1817 function validate(props, propName, componentName, location, propFullName, secret) {
1818 var propValue = props[propName];
1819 var propType = getPropType(propValue);
1820 if (propType !== expectedType) {
1821 // `propValue` being instance of, say, date/regexp, pass the 'object'
1822 // check, but we can offer a more precise error message here rather than
1823 // 'of type `object`'.
1824 var preciseType = getPreciseType(propValue);
1825
1826 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'));
1827 }
1828 return null;
1829 }
1830 return createChainableTypeChecker(validate);
1831 }
1832
1833 function createAnyTypeChecker() {
1834 return createChainableTypeChecker(emptyFunctionThatReturnsNull);
1835 }
1836
1837 function createArrayOfTypeChecker(typeChecker) {
1838 function validate(props, propName, componentName, location, propFullName) {
1839 if (typeof typeChecker !== 'function') {
1840 return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
1841 }
1842 var propValue = props[propName];
1843 if (!Array.isArray(propValue)) {
1844 var propType = getPropType(propValue);
1845 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
1846 }
1847 for (var i = 0; i < propValue.length; i++) {
1848 var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret_1);
1849 if (error instanceof Error) {
1850 return error;
1851 }
1852 }
1853 return null;
1854 }
1855 return createChainableTypeChecker(validate);
1856 }
1857
1858 function createElementTypeChecker() {
1859 function validate(props, propName, componentName, location, propFullName) {
1860 var propValue = props[propName];
1861 if (!isValidElement(propValue)) {
1862 var propType = getPropType(propValue);
1863 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
1864 }
1865 return null;
1866 }
1867 return createChainableTypeChecker(validate);
1868 }
1869
1870 function createInstanceTypeChecker(expectedClass) {
1871 function validate(props, propName, componentName, location, propFullName) {
1872 if (!(props[propName] instanceof expectedClass)) {
1873 var expectedClassName = expectedClass.name || ANONYMOUS;
1874 var actualClassName = getClassName(props[propName]);
1875 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
1876 }
1877 return null;
1878 }
1879 return createChainableTypeChecker(validate);
1880 }
1881
1882 function createEnumTypeChecker(expectedValues) {
1883 if (!Array.isArray(expectedValues)) {
1884 printWarning$1('Invalid argument supplied to oneOf, expected an instance of array.');
1885 return emptyFunctionThatReturnsNull;
1886 }
1887
1888 function validate(props, propName, componentName, location, propFullName) {
1889 var propValue = props[propName];
1890 for (var i = 0; i < expectedValues.length; i++) {
1891 if (is(propValue, expectedValues[i])) {
1892 return null;
1893 }
1894 }
1895
1896 var valuesString = JSON.stringify(expectedValues);
1897 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + propValue + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
1898 }
1899 return createChainableTypeChecker(validate);
1900 }
1901
1902 function createObjectOfTypeChecker(typeChecker) {
1903 function validate(props, propName, componentName, location, propFullName) {
1904 if (typeof typeChecker !== 'function') {
1905 return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
1906 }
1907 var propValue = props[propName];
1908 var propType = getPropType(propValue);
1909 if (propType !== 'object') {
1910 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
1911 }
1912 for (var key in propValue) {
1913 if (propValue.hasOwnProperty(key)) {
1914 var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
1915 if (error instanceof Error) {
1916 return error;
1917 }
1918 }
1919 }
1920 return null;
1921 }
1922 return createChainableTypeChecker(validate);
1923 }
1924
1925 function createUnionTypeChecker(arrayOfTypeCheckers) {
1926 if (!Array.isArray(arrayOfTypeCheckers)) {
1927 printWarning$1('Invalid argument supplied to oneOfType, expected an instance of array.');
1928 return emptyFunctionThatReturnsNull;
1929 }
1930
1931 for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
1932 var checker = arrayOfTypeCheckers[i];
1933 if (typeof checker !== 'function') {
1934 printWarning$1(
1935 'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
1936 'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
1937 );
1938 return emptyFunctionThatReturnsNull;
1939 }
1940 }
1941
1942 function validate(props, propName, componentName, location, propFullName) {
1943 for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
1944 var checker = arrayOfTypeCheckers[i];
1945 if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret_1) == null) {
1946 return null;
1947 }
1948 }
1949
1950 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`.'));
1951 }
1952 return createChainableTypeChecker(validate);
1953 }
1954
1955 function createNodeChecker() {
1956 function validate(props, propName, componentName, location, propFullName) {
1957 if (!isNode(props[propName])) {
1958 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
1959 }
1960 return null;
1961 }
1962 return createChainableTypeChecker(validate);
1963 }
1964
1965 function createShapeTypeChecker(shapeTypes) {
1966 function validate(props, propName, componentName, location, propFullName) {
1967 var propValue = props[propName];
1968 var propType = getPropType(propValue);
1969 if (propType !== 'object') {
1970 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
1971 }
1972 for (var key in shapeTypes) {
1973 var checker = shapeTypes[key];
1974 if (!checker) {
1975 continue;
1976 }
1977 var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
1978 if (error) {
1979 return error;
1980 }
1981 }
1982 return null;
1983 }
1984 return createChainableTypeChecker(validate);
1985 }
1986
1987 function createStrictShapeTypeChecker(shapeTypes) {
1988 function validate(props, propName, componentName, location, propFullName) {
1989 var propValue = props[propName];
1990 var propType = getPropType(propValue);
1991 if (propType !== 'object') {
1992 return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
1993 }
1994 // We need to check all keys in case some are required but missing from
1995 // props.
1996 var allKeys = objectAssign({}, props[propName], shapeTypes);
1997 for (var key in allKeys) {
1998 var checker = shapeTypes[key];
1999 if (!checker) {
2000 return new PropTypeError(
2001 'Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' +
2002 '\nBad object: ' + JSON.stringify(props[propName], null, ' ') +
2003 '\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' ')
2004 );
2005 }
2006 var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
2007 if (error) {
2008 return error;
2009 }
2010 }
2011 return null;
2012 }
2013
2014 return createChainableTypeChecker(validate);
2015 }
2016
2017 function isNode(propValue) {
2018 switch (typeof propValue) {
2019 case 'number':
2020 case 'string':
2021 case 'undefined':
2022 return true;
2023 case 'boolean':
2024 return !propValue;
2025 case 'object':
2026 if (Array.isArray(propValue)) {
2027 return propValue.every(isNode);
2028 }
2029 if (propValue === null || isValidElement(propValue)) {
2030 return true;
2031 }
2032
2033 var iteratorFn = getIteratorFn(propValue);
2034 if (iteratorFn) {
2035 var iterator = iteratorFn.call(propValue);
2036 var step;
2037 if (iteratorFn !== propValue.entries) {
2038 while (!(step = iterator.next()).done) {
2039 if (!isNode(step.value)) {
2040 return false;
2041 }
2042 }
2043 } else {
2044 // Iterator will provide entry [k,v] tuples rather than values.
2045 while (!(step = iterator.next()).done) {
2046 var entry = step.value;
2047 if (entry) {
2048 if (!isNode(entry[1])) {
2049 return false;
2050 }
2051 }
2052 }
2053 }
2054 } else {
2055 return false;
2056 }
2057
2058 return true;
2059 default:
2060 return false;
2061 }
2062 }
2063
2064 function isSymbol(propType, propValue) {
2065 // Native Symbol.
2066 if (propType === 'symbol') {
2067 return true;
2068 }
2069
2070 // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
2071 if (propValue['@@toStringTag'] === 'Symbol') {
2072 return true;
2073 }
2074
2075 // Fallback for non-spec compliant Symbols which are polyfilled.
2076 if (typeof Symbol === 'function' && propValue instanceof Symbol) {
2077 return true;
2078 }
2079
2080 return false;
2081 }
2082
2083 // Equivalent of `typeof` but with special handling for array and regexp.
2084 function getPropType(propValue) {
2085 var propType = typeof propValue;
2086 if (Array.isArray(propValue)) {
2087 return 'array';
2088 }
2089 if (propValue instanceof RegExp) {
2090 // Old webkits (at least until Android 4.0) return 'function' rather than
2091 // 'object' for typeof a RegExp. We'll normalize this here so that /bla/
2092 // passes PropTypes.object.
2093 return 'object';
2094 }
2095 if (isSymbol(propType, propValue)) {
2096 return 'symbol';
2097 }
2098 return propType;
2099 }
2100
2101 // This handles more types than `getPropType`. Only used for error messages.
2102 // See `createPrimitiveTypeChecker`.
2103 function getPreciseType(propValue) {
2104 if (typeof propValue === 'undefined' || propValue === null) {
2105 return '' + propValue;
2106 }
2107 var propType = getPropType(propValue);
2108 if (propType === 'object') {
2109 if (propValue instanceof Date) {
2110 return 'date';
2111 } else if (propValue instanceof RegExp) {
2112 return 'regexp';
2113 }
2114 }
2115 return propType;
2116 }
2117
2118 // Returns a string that is postfixed to a warning about an invalid type.
2119 // For example, "undefined" or "of type array"
2120 function getPostfixForTypeWarning(value) {
2121 var type = getPreciseType(value);
2122 switch (type) {
2123 case 'array':
2124 case 'object':
2125 return 'an ' + type;
2126 case 'boolean':
2127 case 'date':
2128 case 'regexp':
2129 return 'a ' + type;
2130 default:
2131 return type;
2132 }
2133 }
2134
2135 // Returns class name of the object, if any.
2136 function getClassName(propValue) {
2137 if (!propValue.constructor || !propValue.constructor.name) {
2138 return ANONYMOUS;
2139 }
2140 return propValue.constructor.name;
2141 }
2142
2143 ReactPropTypes.checkPropTypes = checkPropTypes_1;
2144 ReactPropTypes.PropTypes = ReactPropTypes;
2145
2146 return ReactPropTypes;
2147 };
2148
2149 var propTypes = createCommonjsModule(function (module) {
2150 /**
2151 * Copyright (c) 2013-present, Facebook, Inc.
2152 *
2153 * This source code is licensed under the MIT license found in the
2154 * LICENSE file in the root directory of this source tree.
2155 */
2156
2157 {
2158 var REACT_ELEMENT_TYPE = (typeof Symbol === 'function' &&
2159 Symbol.for &&
2160 Symbol.for('react.element')) ||
2161 0xeac7;
2162
2163 var isValidElement = function(object) {
2164 return typeof object === 'object' &&
2165 object !== null &&
2166 object.$$typeof === REACT_ELEMENT_TYPE;
2167 };
2168
2169 // By explicitly using `prop-types` you are opting into new development behavior.
2170 // http://fb.me/prop-types-in-prod
2171 var throwOnDirectAccess = true;
2172 module.exports = factoryWithTypeCheckers(isValidElement, throwOnDirectAccess);
2173 }
2174 });
2175
2176 //
2177
2178 function isStaticRules(rules, attrs) {
2179 for (var i = 0; i < rules.length; i += 1) {
2180 var rule = rules[i];
2181
2182 // recursive case
2183 if (Array.isArray(rule) && !isStaticRules(rule)) {
2184 return false;
2185 } else if (isFunction(rule) && !isStyledComponent(rule)) {
2186 // functions are allowed to be static if they're just being
2187 // used to get the classname of a nested styled component
2188 return false;
2189 }
2190 }
2191
2192 if (attrs !== undefined) {
2193 // eslint-disable-next-line guard-for-in, no-restricted-syntax
2194 for (var key in attrs) {
2195 var value = attrs[key];
2196 if (isFunction(value)) {
2197 return false;
2198 }
2199 }
2200 }
2201
2202 return true;
2203 }
2204
2205 //
2206
2207 var GlobalStyle = function () {
2208 function GlobalStyle(rules, componentId) {
2209 classCallCheck(this, GlobalStyle);
2210
2211 this.rules = rules;
2212 this.componentId = componentId;
2213 this.isStatic = isStaticRules(rules);
2214
2215 if (!StyleSheet.master.hasId(componentId)) {
2216 StyleSheet.master.deferredInject(componentId, []);
2217 }
2218 }
2219
2220 GlobalStyle.prototype.createStyles = function createStyles(executionContext, styleSheet) {
2221 var flatCSS = flatten(this.rules, executionContext, styleSheet);
2222 var css = stringifyRules(flatCSS, '');
2223
2224 styleSheet.inject(this.componentId, css);
2225 };
2226
2227 GlobalStyle.prototype.removeStyles = function removeStyles(styleSheet) {
2228 var componentId = this.componentId;
2229
2230 if (styleSheet.hasId(componentId)) {
2231 styleSheet.remove(componentId);
2232 }
2233 };
2234
2235 // TODO: overwrite in-place instead of remove+create?
2236
2237
2238 GlobalStyle.prototype.renderStyles = function renderStyles(executionContext, styleSheet) {
2239 this.removeStyles(styleSheet);
2240 this.createStyles(executionContext, styleSheet);
2241 };
2242
2243 return GlobalStyle;
2244 }();
2245
2246 var simpleIsEqual = function simpleIsEqual(a, b) {
2247 return a === b;
2248 };
2249
2250 function index (resultFn, isEqual) {
2251 if (isEqual === void 0) {
2252 isEqual = simpleIsEqual;
2253 }
2254
2255 var lastThis;
2256 var lastArgs = [];
2257 var lastResult;
2258 var calledOnce = false;
2259
2260 var isNewArgEqualToLast = function isNewArgEqualToLast(newArg, index) {
2261 return isEqual(newArg, lastArgs[index]);
2262 };
2263
2264 var result = function result() {
2265 for (var _len = arguments.length, newArgs = new Array(_len), _key = 0; _key < _len; _key++) {
2266 newArgs[_key] = arguments[_key];
2267 }
2268
2269 if (calledOnce && lastThis === this && newArgs.length === lastArgs.length && newArgs.every(isNewArgEqualToLast)) {
2270 return lastResult;
2271 }
2272
2273 lastResult = resultFn.apply(this, newArgs);
2274 calledOnce = true;
2275 lastThis = this;
2276 lastArgs = newArgs;
2277 return lastResult;
2278 };
2279
2280 return result;
2281 }
2282
2283 //
2284
2285 var ServerStyleSheet = function () {
2286 function ServerStyleSheet() {
2287 classCallCheck(this, ServerStyleSheet);
2288
2289 /* The master sheet might be reset, so keep a reference here */
2290 this.masterSheet = StyleSheet.master;
2291 this.instance = this.masterSheet.clone();
2292 this.sealed = false;
2293 }
2294
2295 /**
2296 * Mark the ServerStyleSheet as being fully emitted and manually GC it from the
2297 * StyleSheet singleton.
2298 */
2299
2300
2301 ServerStyleSheet.prototype.seal = function seal() {
2302 if (!this.sealed) {
2303 /* Remove sealed StyleSheets from the master sheet */
2304 var index = this.masterSheet.clones.indexOf(this.instance);
2305 this.masterSheet.clones.splice(index, 1);
2306 this.sealed = true;
2307 }
2308 };
2309
2310 ServerStyleSheet.prototype.collectStyles = function collectStyles(children) {
2311 if (this.sealed) {
2312 throw new StyledComponentsError(2);
2313 }
2314
2315 return React__default.createElement(
2316 StyleSheetManager,
2317 { sheet: this.instance },
2318 children
2319 );
2320 };
2321
2322 ServerStyleSheet.prototype.getStyleTags = function getStyleTags() {
2323 this.seal();
2324 return this.instance.toHTML();
2325 };
2326
2327 ServerStyleSheet.prototype.getStyleElement = function getStyleElement() {
2328 this.seal();
2329 return this.instance.toReactElements();
2330 };
2331
2332 ServerStyleSheet.prototype.interleaveWithNodeStream = function interleaveWithNodeStream(readableStream) {
2333 var _this = this;
2334
2335 {
2336 throw new StyledComponentsError(3);
2337 }
2338
2339 /* the tag index keeps track of which tags have already been emitted */
2340 var instance = this.instance;
2341
2342 var instanceTagIndex = 0;
2343
2344 var streamAttr = SC_STREAM_ATTR + '="true"';
2345
2346 var transformer = new stream.Transform({
2347 transform: function appendStyleChunks(chunk, /* encoding */_, callback) {
2348 var tags = instance.tags;
2349
2350 var html = '';
2351
2352 /* retrieve html for each new style tag */
2353 for (; instanceTagIndex < tags.length; instanceTagIndex += 1) {
2354 var tag = tags[instanceTagIndex];
2355 html += tag.toHTML(streamAttr);
2356 }
2357
2358 /* force our StyleSheets to emit entirely new tags */
2359 instance.sealAllTags();
2360
2361 /* prepend style html to chunk */
2362 this.push(html + chunk);
2363 callback();
2364 }
2365 });
2366
2367 readableStream.on('end', function () {
2368 return _this.seal();
2369 });
2370 readableStream.on('error', function (err) {
2371 _this.seal();
2372
2373 // forward the error to the transform stream
2374 transformer.emit('error', err);
2375 });
2376
2377 return readableStream.pipe(transformer);
2378 };
2379
2380 return ServerStyleSheet;
2381 }();
2382
2383 //
2384
2385 var StyleSheetContext = React.createContext();
2386
2387 var StyleSheetConsumer = StyleSheetContext.Consumer;
2388
2389 var StyleSheetManager = function (_Component) {
2390 inherits(StyleSheetManager, _Component);
2391
2392 function StyleSheetManager(props) {
2393 classCallCheck(this, StyleSheetManager);
2394
2395 var _this = possibleConstructorReturn(this, _Component.call(this, props));
2396
2397 _this.getContext = index(_this.getContext);
2398 return _this;
2399 }
2400
2401 StyleSheetManager.prototype.getContext = function getContext(sheet, target) {
2402 if (sheet) {
2403 return sheet;
2404 } else if (target) {
2405 return new StyleSheet(target);
2406 } else {
2407 throw new StyledComponentsError(4);
2408 }
2409 };
2410
2411 StyleSheetManager.prototype.render = function render() {
2412 var _props = this.props,
2413 children = _props.children,
2414 sheet = _props.sheet,
2415 target = _props.target;
2416
2417 var context = this.getContext(sheet, target);
2418 return React__default.createElement(
2419 StyleSheetContext.Provider,
2420 { value: context },
2421 React__default.Children.only(children)
2422 );
2423 };
2424
2425 return StyleSheetManager;
2426 }(React.Component);
2427 StyleSheetManager.propTypes = {
2428 sheet: propTypes.oneOfType([propTypes.instanceOf(StyleSheet), propTypes.instanceOf(ServerStyleSheet)]),
2429
2430 target: propTypes.shape({
2431 appendChild: propTypes.func.isRequired
2432 })
2433 };
2434
2435 //
2436
2437 var determineTheme = (function (props, fallbackTheme) {
2438 var defaultProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : EMPTY_OBJECT;
2439
2440 // Props should take precedence over ThemeProvider, which should take precedence over
2441 // defaultProps, but React automatically puts defaultProps on props.
2442
2443 /* eslint-disable react/prop-types, flowtype-errors/show-errors */
2444 var isDefaultTheme = defaultProps ? props.theme === defaultProps.theme : false;
2445 var theme = props.theme && !isDefaultTheme ? props.theme : fallbackTheme || defaultProps.theme;
2446 /* eslint-enable */
2447
2448 return theme;
2449 });
2450
2451 //
2452
2453 var ThemeContext = React.createContext();
2454
2455 var ThemeConsumer = ThemeContext.Consumer;
2456
2457 /**
2458 * Provide a theme to an entire react component tree via context
2459 */
2460
2461 var ThemeProvider = function (_Component) {
2462 inherits(ThemeProvider, _Component);
2463
2464 function ThemeProvider(props) {
2465 classCallCheck(this, ThemeProvider);
2466
2467 var _this = possibleConstructorReturn(this, _Component.call(this, props));
2468
2469 _this.getContext = index(_this.getContext.bind(_this));
2470 _this.renderInner = _this.renderInner.bind(_this);
2471 return _this;
2472 }
2473
2474 ThemeProvider.prototype.render = function render() {
2475 if (!this.props.children) return null;
2476
2477 return React__default.createElement(
2478 ThemeContext.Consumer,
2479 null,
2480 this.renderInner
2481 );
2482 };
2483
2484 ThemeProvider.prototype.renderInner = function renderInner(outerTheme) {
2485 var context = this.getContext(this.props.theme, outerTheme);
2486
2487 return React__default.createElement(
2488 ThemeContext.Provider,
2489 { value: context },
2490 React__default.Children.only(this.props.children)
2491 );
2492 };
2493
2494 /**
2495 * Get the theme from the props, supporting both (outerTheme) => {}
2496 * as well as object notation
2497 */
2498
2499
2500 ThemeProvider.prototype.getTheme = function getTheme(theme, outerTheme) {
2501 if (isFunction(theme)) {
2502 var mergedTheme = theme(outerTheme);
2503
2504 if (mergedTheme === null || Array.isArray(mergedTheme) || (typeof mergedTheme === 'undefined' ? 'undefined' : _typeof(mergedTheme)) !== 'object') {
2505 throw new StyledComponentsError(7);
2506 }
2507
2508 return mergedTheme;
2509 }
2510
2511 if (theme === null || Array.isArray(theme) || (typeof theme === 'undefined' ? 'undefined' : _typeof(theme)) !== 'object') {
2512 throw new StyledComponentsError(8);
2513 }
2514
2515 return _extends({}, outerTheme, theme);
2516 };
2517
2518 ThemeProvider.prototype.getContext = function getContext(theme, outerTheme) {
2519 return this.getTheme(theme, outerTheme);
2520 };
2521
2522 return ThemeProvider;
2523 }(React.Component);
2524
2525 //
2526 // Source: https://github.com/garycourt/murmurhash-js/blob/master/murmurhash2_gc.js
2527 function murmurhash(c) {
2528 for (var e = c.length | 0, a = e | 0, d = 0, b; e >= 4;) {
2529 b = c.charCodeAt(d) & 255 | (c.charCodeAt(++d) & 255) << 8 | (c.charCodeAt(++d) & 255) << 16 | (c.charCodeAt(++d) & 255) << 24, b = 1540483477 * (b & 65535) + ((1540483477 * (b >>> 16) & 65535) << 16), b ^= b >>> 24, b = 1540483477 * (b & 65535) + ((1540483477 * (b >>> 16) & 65535) << 16), a = 1540483477 * (a & 65535) + ((1540483477 * (a >>> 16) & 65535) << 16) ^ b, e -= 4, ++d;
2530 }
2531 switch (e) {
2532 case 3:
2533 a ^= (c.charCodeAt(d + 2) & 255) << 16;
2534 case 2:
2535 a ^= (c.charCodeAt(d + 1) & 255) << 8;
2536 case 1:
2537 a ^= c.charCodeAt(d) & 255, a = 1540483477 * (a & 65535) + ((1540483477 * (a >>> 16) & 65535) << 16);
2538 }
2539 a ^= a >>> 13;
2540 a = 1540483477 * (a & 65535) + ((1540483477 * (a >>> 16) & 65535) << 16);
2541 return (a ^ a >>> 15) >>> 0;
2542 }
2543
2544 //
2545
2546 // place our cache into shared context so it'll persist between HMRs
2547 if (IS_BROWSER) {
2548 window.scCGSHMRCache = {};
2549 }
2550
2551 function createGlobalStyle(strings) {
2552 for (var _len = arguments.length, interpolations = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
2553 interpolations[_key - 1] = arguments[_key];
2554 }
2555
2556 var rules = css.apply(undefined, [strings].concat(interpolations));
2557 var id = 'sc-global-' + murmurhash(JSON.stringify(rules));
2558 var style = new GlobalStyle(rules, id);
2559
2560 var GlobalStyleComponent = function (_React$Component) {
2561 inherits(GlobalStyleComponent, _React$Component);
2562
2563 function GlobalStyleComponent() {
2564 classCallCheck(this, GlobalStyleComponent);
2565
2566 var _this = possibleConstructorReturn(this, _React$Component.call(this));
2567
2568 var _this$constructor = _this.constructor,
2569 globalStyle = _this$constructor.globalStyle,
2570 styledComponentId = _this$constructor.styledComponentId;
2571
2572
2573 if (IS_BROWSER) {
2574 window.scCGSHMRCache[styledComponentId] = (window.scCGSHMRCache[styledComponentId] || 0) + 1;
2575 }
2576
2577 /**
2578 * This fixes HMR compatiblility. Don't ask me why, but this combination of
2579 * caching the closure variables via statics and then persisting the statics in
2580 * state works across HMR where no other combination did. ¯\_(ツ)_/¯
2581 */
2582 _this.state = {
2583 globalStyle: globalStyle,
2584 styledComponentId: styledComponentId
2585 };
2586 return _this;
2587 }
2588
2589 GlobalStyleComponent.prototype.componentDidMount = function componentDidMount() {
2590 if (IS_BROWSER && window.scCGSHMRCache[this.state.styledComponentId] > 1 && !this.props.suppressMultiMountWarning) {
2591 console.warn('The global style component ' + this.state.styledComponentId + ' was composed and rendered multiple times in your React component tree. Only the last-rendered copy will have its styles remain in <head> (or your StyleSheetManager target.)');
2592 }
2593 };
2594
2595 GlobalStyleComponent.prototype.componentWillUnmount = function componentWillUnmount() {
2596 if (window.scCGSHMRCache[this.state.styledComponentId]) {
2597 window.scCGSHMRCache[this.state.styledComponentId] -= 1;
2598 }
2599 /**
2600 * Depending on the order "render" is called this can cause the styles to be lost
2601 * until the next render pass of the remaining instance, which may
2602 * not be immediate.
2603 */
2604 if (window.scCGSHMRCache[this.state.styledComponentId] === 0) {
2605 this.state.globalStyle.removeStyles(this.styleSheet);
2606 }
2607 };
2608
2609 GlobalStyleComponent.prototype.render = function render() {
2610 var _this2 = this;
2611
2612 if (React__default.Children.count(this.props.children)) {
2613 console.warn('The global style component ' + this.state.styledComponentId + ' was given child JSX. createGlobalStyle does not render children.');
2614 }
2615
2616 return React__default.createElement(
2617 StyleSheetConsumer,
2618 null,
2619 function (styleSheet) {
2620 _this2.styleSheet = styleSheet || StyleSheet.master;
2621
2622 var globalStyle = _this2.state.globalStyle;
2623
2624
2625 if (globalStyle.isStatic) {
2626 globalStyle.renderStyles(STATIC_EXECUTION_CONTEXT, _this2.styleSheet);
2627
2628 return null;
2629 } else {
2630 return React__default.createElement(
2631 ThemeConsumer,
2632 null,
2633 function (theme) {
2634 var defaultProps = _this2.constructor.defaultProps;
2635
2636
2637 var context = _extends({}, _this2.props);
2638
2639 if (typeof theme !== 'undefined') {
2640 context.theme = determineTheme(_this2.props, theme, defaultProps);
2641 }
2642
2643 globalStyle.renderStyles(context, _this2.styleSheet);
2644
2645 return null;
2646 }
2647 );
2648 }
2649 }
2650 );
2651 };
2652
2653 return GlobalStyleComponent;
2654 }(React__default.Component);
2655
2656 GlobalStyleComponent.defaultProps = {
2657 suppressMultiMountWarning: false
2658 };
2659 GlobalStyleComponent.globalStyle = style;
2660 GlobalStyleComponent.styledComponentId = id;
2661 GlobalStyleComponent.propTypes = {
2662 suppressMultiMountWarning: propTypes.bool
2663 };
2664
2665
2666 return GlobalStyleComponent;
2667 }
2668
2669 //
2670 /* eslint-disable no-bitwise */
2671
2672 /* This is the "capacity" of our alphabet i.e. 2x26 for all letters plus their capitalised
2673 * counterparts */
2674 var charsLength = 52;
2675
2676 /* start at 75 for 'a' until 'z' (25) and then start at 65 for capitalised letters */
2677 var getAlphabeticChar = function getAlphabeticChar(code) {
2678 return String.fromCharCode(code + (code > 25 ? 39 : 97));
2679 };
2680
2681 /* input a number, usually a hash and convert it to base-52 */
2682 function generateAlphabeticName(code) {
2683 var name = '';
2684 var x = void 0;
2685
2686 /* get a char and divide by alphabet-length */
2687 for (x = code; x > charsLength; x = Math.floor(x / charsLength)) {
2688 name = getAlphabeticChar(x % charsLength) + name;
2689 }
2690
2691 return getAlphabeticChar(x % charsLength) + name;
2692 }
2693
2694 //
2695
2696 var replaceWhitespace = function replaceWhitespace(str) {
2697 return str.replace(/\s|\\n/g, '');
2698 };
2699
2700 function keyframes(strings) {
2701 /* Warning if you've used keyframes on React Native */
2702 if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
2703 console.warn('`keyframes` cannot be used on ReactNative, only on the web. To do animation in ReactNative please use Animated.');
2704 }
2705
2706 for (var _len = arguments.length, interpolations = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
2707 interpolations[_key - 1] = arguments[_key];
2708 }
2709
2710 var rules = css.apply(undefined, [strings].concat(interpolations));
2711
2712 var name = generateAlphabeticName(murmurhash(replaceWhitespace(JSON.stringify(rules))));
2713
2714 return new Keyframes(name, stringifyRules(rules, name, '@keyframes'));
2715 }
2716
2717 var _TYPE_STATICS;
2718
2719 var REACT_STATICS = {
2720 childContextTypes: true,
2721 contextTypes: true,
2722 defaultProps: true,
2723 displayName: true,
2724 getDerivedStateFromProps: true,
2725 propTypes: true,
2726 type: true
2727 };
2728
2729 var KNOWN_STATICS = {
2730 name: true,
2731 length: true,
2732 prototype: true,
2733 caller: true,
2734 callee: true,
2735 arguments: true,
2736 arity: true
2737 };
2738
2739 var TYPE_STATICS = (_TYPE_STATICS = {}, _TYPE_STATICS[reactIs_3] = {
2740 $$typeof: true,
2741 render: true
2742 }, _TYPE_STATICS);
2743
2744 var defineProperty$1 = Object.defineProperty,
2745 getOwnPropertyNames = Object.getOwnPropertyNames,
2746 _Object$getOwnPropert = Object.getOwnPropertySymbols,
2747 getOwnPropertySymbols$1 = _Object$getOwnPropert === undefined ? function () {
2748 return [];
2749 } : _Object$getOwnPropert,
2750 getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor,
2751 getPrototypeOf = Object.getPrototypeOf,
2752 objectPrototype = Object.prototype;
2753 var arrayPrototype = Array.prototype;
2754
2755
2756 function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
2757 if (typeof sourceComponent !== 'string') {
2758 // don't hoist over string (html) components
2759
2760 var inheritedComponent = getPrototypeOf(sourceComponent);
2761
2762 if (inheritedComponent && inheritedComponent !== objectPrototype) {
2763 hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
2764 }
2765
2766 var keys = arrayPrototype.concat(getOwnPropertyNames(sourceComponent),
2767 // $FlowFixMe
2768 getOwnPropertySymbols$1(sourceComponent));
2769
2770 var targetStatics = TYPE_STATICS[targetComponent.$$typeof] || REACT_STATICS;
2771
2772 var sourceStatics = TYPE_STATICS[sourceComponent.$$typeof] || REACT_STATICS;
2773
2774 var i = keys.length;
2775 var descriptor = void 0;
2776 var key = void 0;
2777
2778 // eslint-disable-next-line no-plusplus
2779 while (i--) {
2780 key = keys[i];
2781
2782 if (
2783 // $FlowFixMe
2784 !KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) &&
2785 // $FlowFixMe
2786 !(targetStatics && targetStatics[key])) {
2787 descriptor = getOwnPropertyDescriptor(sourceComponent, key);
2788
2789 if (descriptor) {
2790 try {
2791 // Avoid failures from read-only properties
2792 defineProperty$1(targetComponent, key, descriptor);
2793 } catch (e) {
2794 /* fail silently */
2795 }
2796 }
2797 }
2798 }
2799
2800 return targetComponent;
2801 }
2802
2803 return targetComponent;
2804 }
2805
2806 //
2807
2808 var withTheme = (function (Component) {
2809 var WithTheme = React__default.forwardRef(function (props, ref) {
2810 return React__default.createElement(
2811 ThemeConsumer,
2812 null,
2813 function (theme) {
2814 // $FlowFixMe
2815 var defaultProps = Component.defaultProps;
2816
2817 var themeProp = determineTheme(props, theme, defaultProps);
2818
2819 if (themeProp === undefined) {
2820 // eslint-disable-next-line no-console
2821 console.warn('[withTheme] You are not using a ThemeProvider nor passing a theme prop or a theme in defaultProps in component class ' + getComponentName(Component));
2822 }
2823
2824 return React__default.createElement(Component, _extends({}, props, { theme: themeProp, ref: ref }));
2825 }
2826 );
2827 });
2828
2829 hoistNonReactStatics(WithTheme, Component);
2830
2831 WithTheme.displayName = 'WithTheme(' + getComponentName(Component) + ')';
2832
2833 return WithTheme;
2834 });
2835
2836 //
2837
2838 /* eslint-disable */
2839 var __DO_NOT_USE_OR_YOU_WILL_BE_HAUNTED_BY_SPOOKY_GHOSTS = {
2840 StyleSheet: StyleSheet
2841 };
2842
2843 //
2844
2845 /* Warning if you've imported this file on React Native */
2846 if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
2847 // eslint-disable-next-line no-console
2848 console.warn("It looks like you've imported 'styled-components' on React Native.\n" + "Perhaps you're looking to import 'styled-components/native'?\n" + 'Read more about this at https://www.styled-components.com/docs/basics#react-native');
2849 }
2850
2851 /* Warning if there are several instances of styled-components */
2852 if (typeof window !== 'undefined' && typeof navigator !== 'undefined' && typeof navigator.userAgent === 'string' && navigator.userAgent.indexOf('Node.js') === -1 && navigator.userAgent.indexOf('jsdom') === -1) {
2853 window['__styled-components-init__'] = window['__styled-components-init__'] || 0;
2854
2855 if (window['__styled-components-init__'] === 1) {
2856 // eslint-disable-next-line no-console
2857 console.warn("It looks like there are several instances of 'styled-components' initialized in this application. " + 'This may cause dynamic styles not rendering properly, errors happening during rehydration process ' + 'and makes your application bigger without a good reason.\n\n' + 'See https://s-c.sh/2BAXzed for more info.');
2858 }
2859
2860 window['__styled-components-init__'] += 1;
2861 }
2862
2863 var secondary = /*#__PURE__*/Object.freeze({
2864 css: css,
2865 keyframes: keyframes,
2866 createGlobalStyle: createGlobalStyle,
2867 isStyledComponent: isStyledComponent,
2868 ThemeConsumer: ThemeConsumer,
2869 ThemeProvider: ThemeProvider,
2870 withTheme: withTheme,
2871 ServerStyleSheet: ServerStyleSheet,
2872 StyleSheetManager: StyleSheetManager,
2873 __DO_NOT_USE_OR_YOU_WILL_BE_HAUNTED_BY_SPOOKY_GHOSTS: __DO_NOT_USE_OR_YOU_WILL_BE_HAUNTED_BY_SPOOKY_GHOSTS
2874 });
2875
2876 //
2877
2878 function constructWithOptions(componentConstructor, tag) {
2879 var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : EMPTY_OBJECT;
2880
2881 if (!reactIs_2(tag)) {
2882 throw new StyledComponentsError(1, String(tag));
2883 }
2884
2885 /* This is callable directly as a template function */
2886 // $FlowFixMe: Not typed to avoid destructuring arguments
2887 var templateFunction = function templateFunction() {
2888 return componentConstructor(tag, options, css.apply(undefined, arguments));
2889 };
2890
2891 /* If config methods are called, wrap up a new template function and merge options */
2892 templateFunction.withConfig = function (config) {
2893 return constructWithOptions(componentConstructor, tag, _extends({}, options, config));
2894 };
2895 templateFunction.attrs = function (attrs) {
2896 return constructWithOptions(componentConstructor, tag, _extends({}, options, {
2897 attrs: _extends({}, options.attrs || EMPTY_OBJECT, attrs)
2898 }));
2899 };
2900
2901 return templateFunction;
2902 }
2903
2904 function memoize(fn) {
2905 var cache = {};
2906 return function (arg) {
2907 if (cache[arg] === undefined) cache[arg] = fn(arg);
2908 return cache[arg];
2909 };
2910 }
2911
2912 var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|default|defer|dir|disabled|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|itemProp|itemScope|itemType|itemID|itemRef|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class)|(on[A-Z].*)|((data|aria|x)-.*))$/i;
2913 var index$1 = memoize(reactPropsRegex.test.bind(reactPropsRegex));
2914
2915 //
2916
2917 //
2918
2919 var isHMREnabled = typeof module !== 'undefined' && module.hot;
2920
2921 /* combines hashStr (murmurhash) and nameGenerator for convenience */
2922 var hasher = function hasher(str) {
2923 return generateAlphabeticName(murmurhash(str));
2924 };
2925
2926 /*
2927 ComponentStyle is all the CSS-specific stuff, not
2928 the React-specific stuff.
2929 */
2930
2931 var ComponentStyle = function () {
2932 function ComponentStyle(rules, attrs, componentId) {
2933 classCallCheck(this, ComponentStyle);
2934
2935 this.rules = rules;
2936 this.isStatic = !isHMREnabled && isStaticRules(rules, attrs);
2937 this.componentId = componentId;
2938
2939 if (!StyleSheet.master.hasId(componentId)) {
2940 var placeholder = ['.' + componentId + ' {}'];
2941
2942 StyleSheet.master.deferredInject(componentId, placeholder);
2943 }
2944 }
2945
2946 /*
2947 * Flattens a rule set into valid CSS
2948 * Hashes it, wraps the whole chunk in a .hash1234 {}
2949 * Returns the hash to be injected on render()
2950 * */
2951
2952
2953 ComponentStyle.prototype.generateAndInjectStyles = function generateAndInjectStyles(executionContext, styleSheet) {
2954 var isStatic = this.isStatic,
2955 componentId = this.componentId,
2956 lastClassName = this.lastClassName;
2957
2958 if (IS_BROWSER && isStatic && lastClassName !== undefined && styleSheet.hasNameForId(componentId, lastClassName)) {
2959 return lastClassName;
2960 }
2961
2962 var flatCSS = flatten(this.rules, executionContext, styleSheet);
2963 var name = hasher(this.componentId + flatCSS.join(''));
2964 if (!styleSheet.hasNameForId(componentId, name)) {
2965 styleSheet.inject(this.componentId, stringifyRules(flatCSS, '.' + name, undefined, componentId), name);
2966 }
2967
2968 this.lastClassName = name;
2969 return name;
2970 };
2971
2972 ComponentStyle.generateName = function generateName(str) {
2973 return hasher(str);
2974 };
2975
2976 return ComponentStyle;
2977 }();
2978
2979 //
2980
2981 var LIMIT = 200;
2982
2983 var createWarnTooManyClasses = (function (displayName) {
2984 var generatedClasses = {};
2985 var warningSeen = false;
2986
2987 return function (className) {
2988 if (!warningSeen) {
2989 generatedClasses[className] = true;
2990 if (Object.keys(generatedClasses).length >= LIMIT) {
2991 // Unable to find latestRule in test environment.
2992 /* eslint-disable no-console, prefer-template */
2993 console.warn('Over ' + LIMIT + ' classes were generated for component ' + displayName + '. \n' + 'Consider using the attrs method, together with a style object for frequently changed styles.\n' + 'Example:\n' + ' const Component = styled.div.attrs({\n' + ' style: ({ background }) => ({\n' + ' background,\n' + ' }),\n' + ' })`width: 100%;`\n\n' + ' <Component />');
2994 warningSeen = true;
2995 generatedClasses = {};
2996 }
2997 }
2998 };
2999 });
3000
3001 //
3002 var escapeRegex = /[[\].#*$><+~=|^:(),"'`-]+/g;
3003 var dashesAtEnds = /(^-|-$)/g;
3004
3005 /**
3006 * TODO: Explore using CSS.escape when it becomes more available
3007 * in evergreen browsers.
3008 */
3009 function escape(str) {
3010 return str
3011 // Replace all possible CSS selectors
3012 .replace(escapeRegex, '-')
3013
3014 // Remove extraneous hyphens at the start and end
3015 .replace(dashesAtEnds, '');
3016 }
3017
3018 //
3019
3020 function isTag(target) /* : %checks */{
3021 return typeof target === 'string';
3022 }
3023
3024 //
3025
3026 function generateDisplayName(target) {
3027 return isTag(target) ? 'styled.' + target : 'Styled(' + getComponentName(target) + ')';
3028 }
3029
3030 //
3031 function isDerivedReactComponent(fn) {
3032 return !!(fn && fn.prototype && fn.prototype.isReactComponent);
3033 }
3034
3035 //
3036
3037 var classNameUseCheckInjector = (function (target) {
3038 var elementClassName = '';
3039
3040 var targetCDM = target.componentDidMount;
3041
3042 // eslint-disable-next-line no-param-reassign
3043 target.componentDidMount = function componentDidMount() {
3044 if (typeof targetCDM === 'function') {
3045 targetCDM.call(this);
3046 }
3047
3048 var classNames = elementClassName.replace(/ +/g, ' ').trim().split(' ');
3049 // eslint-disable-next-line react/no-find-dom-node
3050 var node = ReactDOM.findDOMNode(this);
3051 var selector = classNames.map(function (s) {
3052 return '.' + s;
3053 }).join('');
3054
3055 if (node && node.nodeType === 1 && !classNames.every(function (className) {
3056 return node.classList && node.classList.contains(className);
3057 }) && !node.querySelector(selector)) {
3058 console.warn('It looks like you\'ve wrapped styled() around your React component (' + getComponentName(this.props.forwardedClass.target) + '), but the className prop is not being passed down to a child. No styles will be rendered unless className is composed within your React component.');
3059 }
3060 };
3061
3062 var prevRenderInner = target.renderInner;
3063
3064 // eslint-disable-next-line no-param-reassign
3065 target.renderInner = function renderInner() {
3066 for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
3067 args[_key] = arguments[_key];
3068 }
3069
3070 var element = prevRenderInner.apply(this, args);
3071
3072 elementClassName = element.props.className;
3073
3074 return element;
3075 };
3076 });
3077
3078 //
3079
3080 var identifiers = {};
3081
3082 /* We depend on components having unique IDs */
3083 function generateId(_ComponentStyle, _displayName, parentComponentId) {
3084 var displayName = typeof _displayName !== 'string' ? 'sc' : escape(_displayName);
3085
3086 /**
3087 * This ensures uniqueness if two components happen to share
3088 * the same displayName.
3089 */
3090 var nr = (identifiers[displayName] || 0) + 1;
3091 identifiers[displayName] = nr;
3092
3093 var componentId = displayName + '-' + _ComponentStyle.generateName(displayName + nr);
3094
3095 return parentComponentId ? parentComponentId + '-' + componentId : componentId;
3096 }
3097
3098 var warnInnerRef = once(function () {
3099 return (
3100 // eslint-disable-next-line no-console
3101 console.warn('The "innerRef" API has been removed in styled-components v4 in favor of React 16 ref forwarding, use "ref" instead like a typical component.')
3102 );
3103 });
3104
3105 // $FlowFixMe
3106
3107 var StyledComponent = function (_Component) {
3108 inherits(StyledComponent, _Component);
3109
3110 function StyledComponent() {
3111 classCallCheck(this, StyledComponent);
3112
3113 var _this = possibleConstructorReturn(this, _Component.call(this));
3114
3115 _this.attrs = {};
3116
3117 _this.renderOuter = _this.renderOuter.bind(_this);
3118 _this.renderInner = _this.renderInner.bind(_this);
3119
3120 if (IS_BROWSER) {
3121 classNameUseCheckInjector(_this);
3122 }
3123 return _this;
3124 }
3125
3126 StyledComponent.prototype.render = function render() {
3127 return React__default.createElement(
3128 StyleSheetConsumer,
3129 null,
3130 this.renderOuter
3131 );
3132 };
3133
3134 StyledComponent.prototype.renderOuter = function renderOuter(styleSheet) {
3135 this.styleSheet = styleSheet;
3136
3137 return React__default.createElement(
3138 ThemeConsumer,
3139 null,
3140 this.renderInner
3141 );
3142 };
3143
3144 StyledComponent.prototype.renderInner = function renderInner(theme) {
3145 var _props$forwardedClass = this.props.forwardedClass,
3146 componentStyle = _props$forwardedClass.componentStyle,
3147 defaultProps = _props$forwardedClass.defaultProps,
3148 styledComponentId = _props$forwardedClass.styledComponentId,
3149 target = _props$forwardedClass.target;
3150
3151
3152 var generatedClassName = void 0;
3153 if (componentStyle.isStatic) {
3154 generatedClassName = this.generateAndInjectStyles(EMPTY_OBJECT, this.props, this.styleSheet);
3155 } else if (theme !== undefined) {
3156 generatedClassName = this.generateAndInjectStyles(determineTheme(this.props, theme, defaultProps), this.props, this.styleSheet);
3157 } else {
3158 generatedClassName = this.generateAndInjectStyles(this.props.theme || EMPTY_OBJECT, this.props, this.styleSheet);
3159 }
3160 var elementToBeCreated = this.props.as || this.attrs.as || target;
3161 var isTargetTag = isTag(elementToBeCreated);
3162
3163 var propsForElement = _extends({}, this.attrs);
3164
3165 var key = void 0;
3166 // eslint-disable-next-line guard-for-in
3167 for (key in this.props) {
3168 if (key === 'innerRef') {
3169 warnInnerRef();
3170 }
3171
3172 if (key === 'forwardedClass' || key === 'as') continue;else if (key === 'forwardedRef') propsForElement.ref = this.props[key];else if (!isTargetTag || index$1(key)) {
3173 // Don't pass through non HTML tags through to HTML elements
3174 propsForElement[key] = key === 'style' && key in this.attrs ? _extends({}, this.attrs[key], this.props[key]) : this.props[key];
3175 }
3176 }
3177
3178 propsForElement.className = [this.props.className, styledComponentId, this.attrs.className, generatedClassName].filter(Boolean).join(' ');
3179
3180 return React.createElement(elementToBeCreated, propsForElement);
3181 };
3182
3183 StyledComponent.prototype.buildExecutionContext = function buildExecutionContext(theme, props, attrs) {
3184 var context = _extends({}, props, { theme: theme });
3185
3186 if (attrs === undefined) return context;
3187
3188 this.attrs = {};
3189
3190 var attr = void 0;
3191 var key = void 0;
3192
3193 /* eslint-disable guard-for-in */
3194 for (key in attrs) {
3195 attr = attrs[key];
3196
3197 this.attrs[key] = isFunction(attr) && !isDerivedReactComponent(attr) && !isStyledComponent(attr) ? attr(context) : attr;
3198 }
3199 /* eslint-enable */
3200
3201 return _extends({}, context, this.attrs);
3202 };
3203
3204 StyledComponent.prototype.generateAndInjectStyles = function generateAndInjectStyles(theme, props) {
3205 var styleSheet = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : StyleSheet.master;
3206 var _props$forwardedClass2 = props.forwardedClass,
3207 attrs = _props$forwardedClass2.attrs,
3208 componentStyle = _props$forwardedClass2.componentStyle,
3209 warnTooManyClasses = _props$forwardedClass2.warnTooManyClasses;
3210
3211 // statically styled-components don't need to build an execution context object,
3212 // and shouldn't be increasing the number of class names
3213
3214 if (componentStyle.isStatic && attrs === undefined) {
3215 return componentStyle.generateAndInjectStyles(EMPTY_OBJECT, styleSheet);
3216 }
3217
3218 var className = componentStyle.generateAndInjectStyles(this.buildExecutionContext(theme, props, props.forwardedClass.attrs), styleSheet);
3219
3220 if (warnTooManyClasses) {
3221 warnTooManyClasses(className);
3222 }
3223
3224 return className;
3225 };
3226
3227 return StyledComponent;
3228 }(React.Component);
3229
3230 function createStyledComponent(target, options, rules) {
3231 var isTargetStyledComp = isStyledComponent(target);
3232 var isClass = !isTag(target);
3233
3234 var _options$displayName = options.displayName,
3235 displayName = _options$displayName === undefined ? generateDisplayName(target) : _options$displayName,
3236 _options$componentId = options.componentId,
3237 componentId = _options$componentId === undefined ? generateId(ComponentStyle, options.displayName, options.parentComponentId) : _options$componentId,
3238 _options$ParentCompon = options.ParentComponent,
3239 ParentComponent = _options$ParentCompon === undefined ? StyledComponent : _options$ParentCompon,
3240 attrs = options.attrs;
3241
3242
3243 var styledComponentId = options.displayName && options.componentId ? escape(options.displayName) + '-' + options.componentId : options.componentId || componentId;
3244
3245 // fold the underlying StyledComponent attrs up (implicit extend)
3246 var finalAttrs =
3247 // $FlowFixMe
3248 isTargetStyledComp && target.attrs ? _extends({}, target.attrs, attrs) : attrs;
3249
3250 var componentStyle = new ComponentStyle(isTargetStyledComp ? // fold the underlying StyledComponent rules up (implicit extend)
3251 // $FlowFixMe
3252 target.componentStyle.rules.concat(rules) : rules, finalAttrs, styledComponentId);
3253
3254 /**
3255 * forwardRef creates a new interim component, which we'll take advantage of
3256 * instead of extending ParentComponent to create _another_ interim class
3257 */
3258 var WrappedStyledComponent = React__default.forwardRef(function (props, ref) {
3259 return React__default.createElement(ParentComponent, _extends({}, props, { forwardedClass: WrappedStyledComponent, forwardedRef: ref }));
3260 });
3261
3262 // $FlowFixMe
3263 WrappedStyledComponent.attrs = finalAttrs;
3264 // $FlowFixMe
3265 WrappedStyledComponent.componentStyle = componentStyle;
3266 WrappedStyledComponent.displayName = displayName;
3267 // $FlowFixMe
3268 WrappedStyledComponent.styledComponentId = styledComponentId;
3269
3270 // fold the underlying StyledComponent target up since we folded the styles
3271 // $FlowFixMe
3272 WrappedStyledComponent.target = isTargetStyledComp ? target.target : target;
3273
3274 // $FlowFixMe
3275 WrappedStyledComponent.withComponent = function withComponent(tag) {
3276 var previousComponentId = options.componentId,
3277 optionsToCopy = objectWithoutProperties(options, ['componentId']);
3278
3279
3280 var newComponentId = previousComponentId && previousComponentId + '-' + (isTag(tag) ? tag : escape(getComponentName(tag)));
3281
3282 var newOptions = _extends({}, optionsToCopy, {
3283 attrs: finalAttrs,
3284 componentId: newComponentId,
3285 ParentComponent: ParentComponent
3286 });
3287
3288 return createStyledComponent(tag, newOptions, rules);
3289 };
3290
3291 {
3292 // $FlowFixMe
3293 WrappedStyledComponent.warnTooManyClasses = createWarnTooManyClasses(displayName);
3294 }
3295
3296 if (isClass) {
3297 hoistNonReactStatics(WrappedStyledComponent, target, {
3298 // all SC-specific things should not be hoisted
3299 attrs: true,
3300 componentStyle: true,
3301 displayName: true,
3302 styledComponentId: true,
3303 target: true,
3304 warnTooManyClasses: true,
3305 withComponent: true
3306 });
3307 }
3308
3309 return WrappedStyledComponent;
3310 }
3311
3312 //
3313 // Thanks to ReactDOMFactories for this handy list!
3314
3315 var domElements = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr',
3316
3317 // SVG
3318 'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];
3319
3320 //
3321
3322 var styled = function styled(tag) {
3323 return constructWithOptions(createStyledComponent, tag);
3324 };
3325
3326 // Shorthands for all valid HTML Elements
3327 domElements.forEach(function (domElement) {
3328 styled[domElement] = styled(domElement);
3329 });
3330
3331 //
3332
3333 /**
3334 * eliminates the need to do styled.default since the other APIs
3335 * are directly assigned as properties to the main function
3336 * */
3337 // eslint-disable-next-line guard-for-in
3338 for (var key in secondary) {
3339 styled[key] = secondary[key];
3340 }
3341
3342 return styled;
3343
3344}(React,ReactDOM));
3345;window.styled = styled;
3346//# sourceMappingURL=styled-components.js.map