1 | import * as React from 'react';
|
2 | import { useContext, createElement, createContext, forwardRef, Fragment, useRef, useLayoutEffect } from 'react';
|
3 | import memoize$1 from 'memoizerific';
|
4 | import { logger } from '@storybook/client-logger';
|
5 |
|
6 | function _extends$1() {
|
7 | _extends$1 = Object.assign || function (target) {
|
8 | for (var i = 1; i < arguments.length; i++) {
|
9 | var source = arguments[i];
|
10 |
|
11 | for (var key in source) {
|
12 | if (Object.prototype.hasOwnProperty.call(source, key)) {
|
13 | target[key] = source[key];
|
14 | }
|
15 | }
|
16 | }
|
17 |
|
18 | return target;
|
19 | };
|
20 |
|
21 | return _extends$1.apply(this, arguments);
|
22 | }
|
23 |
|
24 | function memoize(fn) {
|
25 | var cache = Object.create(null);
|
26 | return function (arg) {
|
27 | if (cache[arg] === undefined) cache[arg] = fn(arg);
|
28 | return cache[arg];
|
29 | };
|
30 | }
|
31 |
|
32 | var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/;
|
33 |
|
34 | var isPropValid = memoize(function (prop) {
|
35 | return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
|
36 |
|
37 | && prop.charCodeAt(1) === 110
|
38 |
|
39 | && prop.charCodeAt(2) < 91;
|
40 | }
|
41 |
|
42 | );
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 |
|
49 |
|
50 |
|
51 |
|
52 |
|
53 |
|
54 |
|
55 |
|
56 |
|
57 |
|
58 |
|
59 |
|
60 |
|
61 |
|
62 |
|
63 |
|
64 |
|
65 |
|
66 |
|
67 | function sheetForTag$1(tag) {
|
68 | if (tag.sheet) {
|
69 |
|
70 | return tag.sheet;
|
71 | }
|
72 |
|
73 |
|
74 |
|
75 |
|
76 | for (var i = 0; i < document.styleSheets.length; i++) {
|
77 | if (document.styleSheets[i].ownerNode === tag) {
|
78 |
|
79 | return document.styleSheets[i];
|
80 | }
|
81 | }
|
82 | }
|
83 |
|
84 | function createStyleElement$1(options) {
|
85 | var tag = document.createElement('style');
|
86 | tag.setAttribute('data-emotion', options.key);
|
87 |
|
88 | if (options.nonce !== undefined) {
|
89 | tag.setAttribute('nonce', options.nonce);
|
90 | }
|
91 |
|
92 | tag.appendChild(document.createTextNode(''));
|
93 | tag.setAttribute('data-s', '');
|
94 | return tag;
|
95 | }
|
96 |
|
97 | var StyleSheet$1 = function () {
|
98 | function StyleSheet(options) {
|
99 | var _this = this;
|
100 |
|
101 | this._insertTag = function (tag) {
|
102 | var before;
|
103 |
|
104 | if (_this.tags.length === 0) {
|
105 | if (_this.insertionPoint) {
|
106 | before = _this.insertionPoint.nextSibling;
|
107 | } else if (_this.prepend) {
|
108 | before = _this.container.firstChild;
|
109 | } else {
|
110 | before = _this.before;
|
111 | }
|
112 | } else {
|
113 | before = _this.tags[_this.tags.length - 1].nextSibling;
|
114 | }
|
115 |
|
116 | _this.container.insertBefore(tag, before);
|
117 |
|
118 | _this.tags.push(tag);
|
119 | };
|
120 |
|
121 | this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;
|
122 | this.tags = [];
|
123 | this.ctr = 0;
|
124 | this.nonce = options.nonce;
|
125 |
|
126 | this.key = options.key;
|
127 | this.container = options.container;
|
128 | this.prepend = options.prepend;
|
129 | this.insertionPoint = options.insertionPoint;
|
130 | this.before = null;
|
131 | }
|
132 |
|
133 | var _proto = StyleSheet.prototype;
|
134 |
|
135 | _proto.hydrate = function hydrate(nodes) {
|
136 | nodes.forEach(this._insertTag);
|
137 | };
|
138 |
|
139 | _proto.insert = function insert(rule) {
|
140 |
|
141 |
|
142 |
|
143 | if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
|
144 | this._insertTag(createStyleElement$1(this));
|
145 | }
|
146 |
|
147 | var tag = this.tags[this.tags.length - 1];
|
148 |
|
149 | if (process.env.NODE_ENV !== 'production') {
|
150 | var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;
|
151 |
|
152 | if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {
|
153 |
|
154 |
|
155 |
|
156 | console.error("You're attempting to insert the following rule:\n" + rule + '\n\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');
|
157 | }
|
158 |
|
159 | this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;
|
160 | }
|
161 |
|
162 | if (this.isSpeedy) {
|
163 | var sheet = sheetForTag$1(tag);
|
164 |
|
165 | try {
|
166 |
|
167 |
|
168 | sheet.insertRule(rule, sheet.cssRules.length);
|
169 | } catch (e) {
|
170 | if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear){/.test(rule)) {
|
171 | console.error("There was a problem inserting the following rule: \"" + rule + "\"", e);
|
172 | }
|
173 | }
|
174 | } else {
|
175 | tag.appendChild(document.createTextNode(rule));
|
176 | }
|
177 |
|
178 | this.ctr++;
|
179 | };
|
180 |
|
181 | _proto.flush = function flush() {
|
182 |
|
183 | this.tags.forEach(function (tag) {
|
184 | return tag.parentNode && tag.parentNode.removeChild(tag);
|
185 | });
|
186 | this.tags = [];
|
187 | this.ctr = 0;
|
188 |
|
189 | if (process.env.NODE_ENV !== 'production') {
|
190 | this._alreadyInsertedOrderInsensitiveRule = false;
|
191 | }
|
192 | };
|
193 |
|
194 | return StyleSheet;
|
195 | }();
|
196 |
|
197 | var MS = '-ms-';
|
198 | var MOZ = '-moz-';
|
199 | var WEBKIT = '-webkit-';
|
200 | var COMMENT = 'comm';
|
201 | var RULESET = 'rule';
|
202 | var DECLARATION = 'decl';
|
203 | var IMPORT = '@import';
|
204 | var KEYFRAMES = '@keyframes';
|
205 |
|
206 |
|
207 |
|
208 |
|
209 |
|
210 | var abs = Math.abs;
|
211 |
|
212 |
|
213 |
|
214 |
|
215 |
|
216 | var from = String.fromCharCode;
|
217 |
|
218 |
|
219 |
|
220 |
|
221 |
|
222 | var assign = Object.assign;
|
223 |
|
224 |
|
225 |
|
226 |
|
227 |
|
228 |
|
229 | function hash(value, length) {
|
230 | return (((length << 2 ^ charat(value, 0)) << 2 ^ charat(value, 1)) << 2 ^ charat(value, 2)) << 2 ^ charat(value, 3);
|
231 | }
|
232 |
|
233 |
|
234 |
|
235 |
|
236 |
|
237 |
|
238 | function trim(value) {
|
239 | return value.trim();
|
240 | }
|
241 |
|
242 |
|
243 |
|
244 |
|
245 |
|
246 |
|
247 |
|
248 | function match(value, pattern) {
|
249 | return (value = pattern.exec(value)) ? value[0] : value;
|
250 | }
|
251 |
|
252 |
|
253 |
|
254 |
|
255 |
|
256 |
|
257 |
|
258 |
|
259 | function replace(value, pattern, replacement) {
|
260 | return value.replace(pattern, replacement);
|
261 | }
|
262 |
|
263 |
|
264 |
|
265 |
|
266 |
|
267 |
|
268 |
|
269 | function indexof(value, search) {
|
270 | return value.indexOf(search);
|
271 | }
|
272 |
|
273 |
|
274 |
|
275 |
|
276 |
|
277 |
|
278 |
|
279 | function charat(value, index) {
|
280 | return value.charCodeAt(index) | 0;
|
281 | }
|
282 |
|
283 |
|
284 |
|
285 |
|
286 |
|
287 |
|
288 |
|
289 |
|
290 | function substr(value, begin, end) {
|
291 | return value.slice(begin, end);
|
292 | }
|
293 |
|
294 |
|
295 |
|
296 |
|
297 |
|
298 |
|
299 | function strlen(value) {
|
300 | return value.length;
|
301 | }
|
302 |
|
303 |
|
304 |
|
305 |
|
306 |
|
307 |
|
308 | function sizeof(value) {
|
309 | return value.length;
|
310 | }
|
311 |
|
312 |
|
313 |
|
314 |
|
315 |
|
316 |
|
317 |
|
318 | function append(value, array) {
|
319 | return array.push(value), value;
|
320 | }
|
321 |
|
322 |
|
323 |
|
324 |
|
325 |
|
326 |
|
327 |
|
328 | function combine(array, callback) {
|
329 | return array.map(callback).join('');
|
330 | }
|
331 |
|
332 | var line = 1;
|
333 | var column = 1;
|
334 | var length = 0;
|
335 | var position = 0;
|
336 | var character = 0;
|
337 | var characters = '';
|
338 |
|
339 |
|
340 |
|
341 |
|
342 |
|
343 |
|
344 |
|
345 |
|
346 |
|
347 |
|
348 | function node(value, root, parent, type, props, children, length) {
|
349 | return {
|
350 | value: value,
|
351 | root: root,
|
352 | parent: parent,
|
353 | type: type,
|
354 | props: props,
|
355 | children: children,
|
356 | line: line,
|
357 | column: column,
|
358 | length: length,
|
359 | return: ''
|
360 | };
|
361 | }
|
362 |
|
363 |
|
364 |
|
365 |
|
366 |
|
367 |
|
368 |
|
369 | function copy(root, props) {
|
370 | return assign(node('', null, null, '', null, null, 0), root, {
|
371 | length: -root.length
|
372 | }, props);
|
373 | }
|
374 |
|
375 |
|
376 |
|
377 |
|
378 |
|
379 | function char() {
|
380 | return character;
|
381 | }
|
382 |
|
383 |
|
384 |
|
385 |
|
386 |
|
387 | function prev() {
|
388 | character = position > 0 ? charat(characters, --position) : 0;
|
389 | if (column--, character === 10) column = 1, line--;
|
390 | return character;
|
391 | }
|
392 |
|
393 |
|
394 |
|
395 |
|
396 |
|
397 | function next() {
|
398 | character = position < length ? charat(characters, position++) : 0;
|
399 | if (column++, character === 10) column = 1, line++;
|
400 | return character;
|
401 | }
|
402 |
|
403 |
|
404 |
|
405 |
|
406 |
|
407 | function peek() {
|
408 | return charat(characters, position);
|
409 | }
|
410 |
|
411 |
|
412 |
|
413 |
|
414 |
|
415 | function caret() {
|
416 | return position;
|
417 | }
|
418 |
|
419 |
|
420 |
|
421 |
|
422 |
|
423 |
|
424 |
|
425 | function slice(begin, end) {
|
426 | return substr(characters, begin, end);
|
427 | }
|
428 |
|
429 |
|
430 |
|
431 |
|
432 |
|
433 |
|
434 | function token(type) {
|
435 | switch (type) {
|
436 |
|
437 | case 0:
|
438 | case 9:
|
439 | case 10:
|
440 | case 13:
|
441 | case 32:
|
442 | return 5;
|
443 |
|
444 |
|
445 | case 33:
|
446 | case 43:
|
447 | case 44:
|
448 | case 47:
|
449 | case 62:
|
450 | case 64:
|
451 | case 126:
|
452 |
|
453 | case 59:
|
454 | case 123:
|
455 | case 125:
|
456 | return 4;
|
457 |
|
458 |
|
459 | case 58:
|
460 | return 3;
|
461 |
|
462 |
|
463 | case 34:
|
464 | case 39:
|
465 | case 40:
|
466 | case 91:
|
467 | return 2;
|
468 |
|
469 |
|
470 | case 41:
|
471 | case 93:
|
472 | return 1;
|
473 | }
|
474 |
|
475 | return 0;
|
476 | }
|
477 |
|
478 |
|
479 |
|
480 |
|
481 |
|
482 |
|
483 | function alloc(value) {
|
484 | return line = column = 1, length = strlen(characters = value), position = 0, [];
|
485 | }
|
486 |
|
487 |
|
488 |
|
489 |
|
490 |
|
491 |
|
492 | function dealloc(value) {
|
493 | return characters = '', value;
|
494 | }
|
495 |
|
496 |
|
497 |
|
498 |
|
499 |
|
500 |
|
501 | function delimit(type) {
|
502 | return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)));
|
503 | }
|
504 |
|
505 |
|
506 |
|
507 |
|
508 |
|
509 |
|
510 | function whitespace(type) {
|
511 | while (character = peek()) if (character < 33) next();else break;
|
512 |
|
513 | return token(type) > 2 || token(character) > 3 ? '' : ' ';
|
514 | }
|
515 |
|
516 |
|
517 |
|
518 |
|
519 |
|
520 |
|
521 |
|
522 | function escaping(index, count) {
|
523 | while (--count && next())
|
524 | if (character < 48 || character > 102 || character > 57 && character < 65 || character > 70 && character < 97) break;
|
525 |
|
526 | return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32));
|
527 | }
|
528 |
|
529 |
|
530 |
|
531 |
|
532 |
|
533 |
|
534 | function delimiter(type) {
|
535 | while (next()) switch (character) {
|
536 |
|
537 | case type:
|
538 | return position;
|
539 |
|
540 |
|
541 | case 34:
|
542 | case 39:
|
543 | if (type !== 34 && type !== 39) delimiter(character);
|
544 | break;
|
545 |
|
546 |
|
547 | case 40:
|
548 | if (type === 41) delimiter(type);
|
549 | break;
|
550 |
|
551 |
|
552 | case 92:
|
553 | next();
|
554 | break;
|
555 | }
|
556 |
|
557 | return position;
|
558 | }
|
559 |
|
560 |
|
561 |
|
562 |
|
563 |
|
564 |
|
565 |
|
566 | function commenter(type, index) {
|
567 | while (next())
|
568 | if (type + character === 47 + 10) break;
|
569 | else if (type + character === 42 + 42 && peek() === 47) break;
|
570 |
|
571 | return '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next());
|
572 | }
|
573 |
|
574 |
|
575 |
|
576 |
|
577 |
|
578 |
|
579 | function identifier(index) {
|
580 | while (!token(peek())) next();
|
581 |
|
582 | return slice(index, position);
|
583 | }
|
584 |
|
585 |
|
586 |
|
587 |
|
588 |
|
589 |
|
590 | function compile(value) {
|
591 | return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value));
|
592 | }
|
593 |
|
594 |
|
595 |
|
596 |
|
597 |
|
598 |
|
599 |
|
600 |
|
601 |
|
602 |
|
603 |
|
604 |
|
605 |
|
606 |
|
607 | function parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
|
608 | var index = 0;
|
609 | var offset = 0;
|
610 | var length = pseudo;
|
611 | var atrule = 0;
|
612 | var property = 0;
|
613 | var previous = 0;
|
614 | var variable = 1;
|
615 | var scanning = 1;
|
616 | var ampersand = 1;
|
617 | var character = 0;
|
618 | var type = '';
|
619 | var props = rules;
|
620 | var children = rulesets;
|
621 | var reference = rule;
|
622 | var characters = type;
|
623 |
|
624 | while (scanning) switch (previous = character, character = next()) {
|
625 |
|
626 | case 40:
|
627 | if (previous != 108 && characters.charCodeAt(length - 1) == 58) {
|
628 | if (indexof(characters += replace(delimit(character), '&', '&\f'), '&\f') != -1) ampersand = -1;
|
629 | break;
|
630 | }
|
631 |
|
632 |
|
633 |
|
634 | case 34:
|
635 | case 39:
|
636 | case 91:
|
637 | characters += delimit(character);
|
638 | break;
|
639 |
|
640 |
|
641 | case 9:
|
642 | case 10:
|
643 | case 13:
|
644 | case 32:
|
645 | characters += whitespace(previous);
|
646 | break;
|
647 |
|
648 |
|
649 | case 92:
|
650 | characters += escaping(caret() - 1, 7);
|
651 | continue;
|
652 |
|
653 |
|
654 | case 47:
|
655 | switch (peek()) {
|
656 | case 42:
|
657 | case 47:
|
658 | append(comment(commenter(next(), caret()), root, parent), declarations);
|
659 | break;
|
660 |
|
661 | default:
|
662 | characters += '/';
|
663 | }
|
664 |
|
665 | break;
|
666 |
|
667 |
|
668 | case 123 * variable:
|
669 | points[index++] = strlen(characters) * ampersand;
|
670 |
|
671 |
|
672 | case 125 * variable:
|
673 | case 59:
|
674 | case 0:
|
675 | switch (character) {
|
676 |
|
677 | case 0:
|
678 | case 125:
|
679 | scanning = 0;
|
680 |
|
681 |
|
682 | case 59 + offset:
|
683 | if (property > 0 && strlen(characters) - length) append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations);
|
684 | break;
|
685 |
|
686 |
|
687 | case 59:
|
688 | characters += ';';
|
689 |
|
690 |
|
691 | default:
|
692 | append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets);
|
693 | if (character === 123) if (offset === 0) parse(characters, root, reference, reference, props, rulesets, length, points, children);else switch (atrule) {
|
694 |
|
695 | case 100:
|
696 | case 109:
|
697 | case 115:
|
698 | parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children);
|
699 | break;
|
700 |
|
701 | default:
|
702 | parse(characters, reference, reference, reference, [''], children, 0, points, children);
|
703 | }
|
704 | }
|
705 |
|
706 | index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo;
|
707 | break;
|
708 |
|
709 |
|
710 | case 58:
|
711 | length = 1 + strlen(characters), property = previous;
|
712 |
|
713 | default:
|
714 | if (variable < 1) if (character == 123) --variable;else if (character == 125 && variable++ == 0 && prev() == 125) continue;
|
715 |
|
716 | switch (characters += from(character), character * variable) {
|
717 |
|
718 | case 38:
|
719 | ampersand = offset > 0 ? 1 : (characters += '\f', -1);
|
720 | break;
|
721 |
|
722 |
|
723 | case 44:
|
724 | points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1;
|
725 | break;
|
726 |
|
727 |
|
728 | case 64:
|
729 |
|
730 | if (peek() === 45) characters += delimit(next());
|
731 | atrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++;
|
732 | break;
|
733 |
|
734 |
|
735 | case 45:
|
736 | if (previous === 45 && strlen(characters) == 2) variable = 0;
|
737 | }
|
738 |
|
739 | }
|
740 |
|
741 | return rulesets;
|
742 | }
|
743 |
|
744 |
|
745 |
|
746 |
|
747 |
|
748 |
|
749 |
|
750 |
|
751 |
|
752 |
|
753 |
|
754 |
|
755 |
|
756 |
|
757 |
|
758 |
|
759 | function ruleset(value, root, parent, index, offset, rules, points, type, props, children, length) {
|
760 | var post = offset - 1;
|
761 | var rule = offset === 0 ? rules : [''];
|
762 | var size = sizeof(rule);
|
763 |
|
764 | for (var i = 0, j = 0, k = 0; i < index; ++i) for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x) if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\f/g, rule[x]))) props[k++] = z;
|
765 |
|
766 | return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length);
|
767 | }
|
768 |
|
769 |
|
770 |
|
771 |
|
772 |
|
773 |
|
774 |
|
775 |
|
776 | function comment(value, root, parent) {
|
777 | return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0);
|
778 | }
|
779 |
|
780 |
|
781 |
|
782 |
|
783 |
|
784 |
|
785 |
|
786 |
|
787 |
|
788 | function declaration(value, root, parent, length) {
|
789 | return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length);
|
790 | }
|
791 |
|
792 |
|
793 |
|
794 |
|
795 |
|
796 |
|
797 |
|
798 | function prefix(value, length) {
|
799 | switch (hash(value, length)) {
|
800 |
|
801 | case 5103:
|
802 | return WEBKIT + 'print-' + value + value;
|
803 |
|
804 |
|
805 | case 5737:
|
806 | case 4201:
|
807 | case 3177:
|
808 | case 3433:
|
809 | case 1641:
|
810 | case 4457:
|
811 | case 2921:
|
812 |
|
813 | case 5572:
|
814 | case 6356:
|
815 | case 5844:
|
816 | case 3191:
|
817 | case 6645:
|
818 | case 3005:
|
819 |
|
820 | case 6391:
|
821 | case 5879:
|
822 | case 5623:
|
823 | case 6135:
|
824 | case 4599:
|
825 | case 4855:
|
826 |
|
827 | case 4215:
|
828 | case 6389:
|
829 | case 5109:
|
830 | case 5365:
|
831 | case 5621:
|
832 | case 3829:
|
833 | return WEBKIT + value + value;
|
834 |
|
835 |
|
836 | case 5349:
|
837 | case 4246:
|
838 | case 4810:
|
839 | case 6968:
|
840 | case 2756:
|
841 | return WEBKIT + value + MOZ + value + MS + value + value;
|
842 |
|
843 |
|
844 | case 6828:
|
845 | case 4268:
|
846 | return WEBKIT + value + MS + value + value;
|
847 |
|
848 |
|
849 | case 6165:
|
850 | return WEBKIT + value + MS + 'flex-' + value + value;
|
851 |
|
852 |
|
853 | case 5187:
|
854 | return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;
|
855 |
|
856 |
|
857 | case 5443:
|
858 | return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;
|
859 |
|
860 |
|
861 | case 4675:
|
862 | return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;
|
863 |
|
864 |
|
865 | case 5548:
|
866 | return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;
|
867 |
|
868 |
|
869 | case 5292:
|
870 | return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;
|
871 |
|
872 |
|
873 | case 6060:
|
874 | return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;
|
875 |
|
876 |
|
877 | case 4554:
|
878 | return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;
|
879 |
|
880 |
|
881 | case 6187:
|
882 | return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;
|
883 | // background, background-image
|
884 |
|
885 | case 5495:
|
886 | case 3959:
|
887 | return replace(value, /(image-set\([^]*)/, WEBKIT + '$1' + '$`$1');
|
888 | // justify-content
|
889 |
|
890 | case 4968:
|
891 | return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;
|
892 | // (margin|padding)-inline-(start|end)
|
893 |
|
894 | case 4095:
|
895 | case 3583:
|
896 | case 4068:
|
897 | case 2532:
|
898 | return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;
|
899 | // (min|max)?(width|height|inline-size|block-size)
|
900 |
|
901 | case 8116:
|
902 | case 7059:
|
903 | case 5753:
|
904 | case 5535:
|
905 | case 5445:
|
906 | case 5701:
|
907 | case 4933:
|
908 | case 4677:
|
909 | case 5533:
|
910 | case 5789:
|
911 | case 5021:
|
912 | case 4765:
|
913 | // stretch, max-content, min-content, fill-available
|
914 | if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {
|
915 |
|
916 | case 109:
|
917 |
|
918 | if (charat(value, length + 4) !== 45) break;
|
919 |
|
920 |
|
921 | case 102:
|
922 | return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
|
923 |
|
924 |
|
925 | case 115:
|
926 | return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;
|
927 | }
|
928 | break;
|
929 |
|
930 |
|
931 | case 4949:
|
932 |
|
933 | if (charat(value, length + 1) !== 115) break;
|
934 |
|
935 |
|
936 | case 6444:
|
937 | switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
|
938 |
|
939 | case 107:
|
940 | return replace(value, ':', ':' + WEBKIT) + value;
|
941 |
|
942 |
|
943 | case 101:
|
944 | return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;
|
945 | }
|
946 |
|
947 | break;
|
948 |
|
949 |
|
950 | case 5936:
|
951 | switch (charat(value, length + 11)) {
|
952 |
|
953 | case 114:
|
954 | return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
|
955 |
|
956 |
|
957 | case 108:
|
958 | return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
|
959 |
|
960 |
|
961 | case 45:
|
962 | return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
|
963 | }
|
964 |
|
965 | return WEBKIT + value + MS + value + value;
|
966 | }
|
967 |
|
968 | return value;
|
969 | }
|
970 |
|
971 |
|
972 |
|
973 |
|
974 |
|
975 |
|
976 |
|
977 | function serialize(children, callback) {
|
978 | var output = '';
|
979 | var length = sizeof(children);
|
980 |
|
981 | for (var i = 0; i < length; i++) output += callback(children[i], i, children, callback) || '';
|
982 |
|
983 | return output;
|
984 | }
|
985 |
|
986 |
|
987 |
|
988 |
|
989 |
|
990 |
|
991 |
|
992 |
|
993 |
|
994 | function stringify(element, index, children, callback) {
|
995 | switch (element.type) {
|
996 | case IMPORT:
|
997 | case DECLARATION:
|
998 | return element.return = element.return || element.value;
|
999 |
|
1000 | case COMMENT:
|
1001 | return '';
|
1002 |
|
1003 | case KEYFRAMES:
|
1004 | return element.return = element.value + '{' + serialize(element.children, callback) + '}';
|
1005 |
|
1006 | case RULESET:
|
1007 | element.value = element.props.join(',');
|
1008 | }
|
1009 |
|
1010 | return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : '';
|
1011 | }
|
1012 |
|
1013 |
|
1014 |
|
1015 |
|
1016 |
|
1017 |
|
1018 | function middleware(collection) {
|
1019 | var length = sizeof(collection);
|
1020 | return function (element, index, children, callback) {
|
1021 | var output = '';
|
1022 |
|
1023 | for (var i = 0; i < length; i++) output += collection[i](element, index, children, callback) || '';
|
1024 |
|
1025 | return output;
|
1026 | };
|
1027 | }
|
1028 |
|
1029 |
|
1030 |
|
1031 |
|
1032 |
|
1033 |
|
1034 | function rulesheet(callback) {
|
1035 | return function (element) {
|
1036 | if (!element.root) if (element = element.return) callback(element);
|
1037 | };
|
1038 | }
|
1039 |
|
1040 |
|
1041 |
|
1042 |
|
1043 |
|
1044 |
|
1045 |
|
1046 |
|
1047 | function prefixer(element, index, children, callback) {
|
1048 | if (element.length > -1) if (!element.return) switch (element.type) {
|
1049 | case DECLARATION:
|
1050 | element.return = prefix(element.value, element.length);
|
1051 | break;
|
1052 |
|
1053 | case KEYFRAMES:
|
1054 | return serialize([copy(element, {
|
1055 | value: replace(element.value, '@', '@' + WEBKIT)
|
1056 | })], callback);
|
1057 |
|
1058 | case RULESET:
|
1059 | if (element.length) return combine(element.props, function (value) {
|
1060 | switch (match(value, /(::plac\w+|:read-\w+)/)) {
|
1061 |
|
1062 | case ':read-only':
|
1063 | case ':read-write':
|
1064 | return serialize([copy(element, {
|
1065 | props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]
|
1066 | })], callback);
|
1067 |
|
1068 |
|
1069 | case '::placeholder':
|
1070 | return serialize([copy(element, {
|
1071 | props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]
|
1072 | }), copy(element, {
|
1073 | props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]
|
1074 | }), copy(element, {
|
1075 | props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]
|
1076 | })], callback);
|
1077 | }
|
1078 |
|
1079 | return '';
|
1080 | });
|
1081 | }
|
1082 | }
|
1083 |
|
1084 | var weakMemoize = function weakMemoize(func) {
|
1085 |
|
1086 | var cache = new WeakMap();
|
1087 | return function (arg) {
|
1088 | if (cache.has(arg)) {
|
1089 |
|
1090 | return cache.get(arg);
|
1091 | }
|
1092 |
|
1093 | var ret = func(arg);
|
1094 | cache.set(arg, ret);
|
1095 | return ret;
|
1096 | };
|
1097 | };
|
1098 |
|
1099 | var last = function last(arr) {
|
1100 | return arr.length ? arr[arr.length - 1] : null;
|
1101 | };
|
1102 |
|
1103 |
|
1104 | var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {
|
1105 | var previous = 0;
|
1106 | var character = 0;
|
1107 |
|
1108 | while (true) {
|
1109 | previous = character;
|
1110 | character = peek();
|
1111 |
|
1112 | if (previous === 38 && character === 12) {
|
1113 | points[index] = 1;
|
1114 | }
|
1115 |
|
1116 | if (token(character)) {
|
1117 | break;
|
1118 | }
|
1119 |
|
1120 | next();
|
1121 | }
|
1122 |
|
1123 | return slice(begin, position);
|
1124 | };
|
1125 |
|
1126 | var toRules = function toRules(parsed, points) {
|
1127 |
|
1128 | var index = -1;
|
1129 | var character = 44;
|
1130 |
|
1131 | do {
|
1132 | switch (token(character)) {
|
1133 | case 0:
|
1134 |
|
1135 | if (character === 38 && peek() === 12) {
|
1136 |
|
1137 |
|
1138 |
|
1139 |
|
1140 | points[index] = 1;
|
1141 | }
|
1142 |
|
1143 | parsed[index] += identifierWithPointTracking(position - 1, points, index);
|
1144 | break;
|
1145 |
|
1146 | case 2:
|
1147 | parsed[index] += delimit(character);
|
1148 | break;
|
1149 |
|
1150 | case 4:
|
1151 |
|
1152 | if (character === 44) {
|
1153 |
|
1154 | parsed[++index] = peek() === 58 ? '&\f' : '';
|
1155 | points[index] = parsed[index].length;
|
1156 | break;
|
1157 | }
|
1158 |
|
1159 |
|
1160 |
|
1161 | default:
|
1162 | parsed[index] += from(character);
|
1163 | }
|
1164 | } while (character = next());
|
1165 |
|
1166 | return parsed;
|
1167 | };
|
1168 |
|
1169 | var getRules = function getRules(value, points) {
|
1170 | return dealloc(toRules(alloc(value), points));
|
1171 | };
|
1172 |
|
1173 |
|
1174 | var fixedElements = new WeakMap();
|
1175 |
|
1176 | var compat = function compat(element) {
|
1177 | if (element.type !== 'rule' || !element.parent ||
|
1178 |
|
1179 | element.length < 1) {
|
1180 | return;
|
1181 | }
|
1182 |
|
1183 | var value = element.value,
|
1184 | parent = element.parent;
|
1185 | var isImplicitRule = element.column === parent.column && element.line === parent.line;
|
1186 |
|
1187 | while (parent.type !== 'rule') {
|
1188 | parent = parent.parent;
|
1189 | if (!parent) return;
|
1190 | }
|
1191 |
|
1192 |
|
1193 | if (element.props.length === 1 && value.charCodeAt(0) !== 58
|
1194 |
|
1195 | && !fixedElements.get(parent)) {
|
1196 | return;
|
1197 | }
|
1198 |
|
1199 |
|
1200 |
|
1201 | if (isImplicitRule) {
|
1202 | return;
|
1203 | }
|
1204 |
|
1205 | fixedElements.set(element, true);
|
1206 | var points = [];
|
1207 | var rules = getRules(value, points);
|
1208 | var parentRules = parent.props;
|
1209 |
|
1210 | for (var i = 0, k = 0; i < rules.length; i++) {
|
1211 | for (var j = 0; j < parentRules.length; j++, k++) {
|
1212 | element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i];
|
1213 | }
|
1214 | }
|
1215 | };
|
1216 |
|
1217 | var removeLabel = function removeLabel(element) {
|
1218 | if (element.type === 'decl') {
|
1219 | var value = element.value;
|
1220 |
|
1221 | if (
|
1222 | value.charCodeAt(0) === 108 &&
|
1223 | value.charCodeAt(2) === 98) {
|
1224 |
|
1225 | element["return"] = '';
|
1226 | element.value = '';
|
1227 | }
|
1228 | }
|
1229 | };
|
1230 |
|
1231 | var ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';
|
1232 |
|
1233 | var isIgnoringComment = function isIgnoringComment(element) {
|
1234 | return !!element && element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;
|
1235 | };
|
1236 |
|
1237 | var createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {
|
1238 | return function (element, index, children) {
|
1239 | if (element.type !== 'rule') return;
|
1240 | var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);
|
1241 |
|
1242 | if (unsafePseudoClasses && cache.compat !== true) {
|
1243 | var prevElement = index > 0 ? children[index - 1] : null;
|
1244 |
|
1245 | if (prevElement && isIgnoringComment(last(prevElement.children))) {
|
1246 | return;
|
1247 | }
|
1248 |
|
1249 | unsafePseudoClasses.forEach(function (unsafePseudoClass) {
|
1250 | console.error("The pseudo class \"" + unsafePseudoClass + "\" is potentially unsafe when doing server-side rendering. Try changing it to \"" + unsafePseudoClass.split('-child')[0] + "-of-type\".");
|
1251 | });
|
1252 | }
|
1253 | };
|
1254 | };
|
1255 |
|
1256 | var isImportRule = function isImportRule(element) {
|
1257 | return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;
|
1258 | };
|
1259 |
|
1260 | var isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {
|
1261 | for (var i = index - 1; i >= 0; i--) {
|
1262 | if (!isImportRule(children[i])) {
|
1263 | return true;
|
1264 | }
|
1265 | }
|
1266 |
|
1267 | return false;
|
1268 | };
|
1269 |
|
1270 |
|
1271 |
|
1272 |
|
1273 | var nullifyElement = function nullifyElement(element) {
|
1274 | element.type = '';
|
1275 | element.value = '';
|
1276 | element["return"] = '';
|
1277 | element.children = '';
|
1278 | element.props = '';
|
1279 | };
|
1280 |
|
1281 | var incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {
|
1282 | if (!isImportRule(element)) {
|
1283 | return;
|
1284 | }
|
1285 |
|
1286 | if (element.parent) {
|
1287 | console.error("`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.");
|
1288 | nullifyElement(element);
|
1289 | } else if (isPrependedWithRegularRules(index, children)) {
|
1290 | console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.");
|
1291 | nullifyElement(element);
|
1292 | }
|
1293 | };
|
1294 |
|
1295 | var isBrowser$6 = typeof document !== 'undefined';
|
1296 | var getServerStylisCache = isBrowser$6 ? undefined : weakMemoize(function () {
|
1297 | return memoize(function () {
|
1298 | var cache = {};
|
1299 | return function (name) {
|
1300 | return cache[name];
|
1301 | };
|
1302 | });
|
1303 | });
|
1304 | var defaultStylisPlugins = [prefixer];
|
1305 |
|
1306 | var createCache = function createCache(options) {
|
1307 | var key = options.key;
|
1308 |
|
1309 | if (process.env.NODE_ENV !== 'production' && !key) {
|
1310 | throw new Error("You have to configure `key` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.\n" + "If multiple caches share the same key they might \"fight\" for each other's style elements.");
|
1311 | }
|
1312 |
|
1313 | if (isBrowser$6 && key === 'css') {
|
1314 | var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])");
|
1315 |
|
1316 |
|
1317 |
|
1318 |
|
1319 | Array.prototype.forEach.call(ssrStyles, function (node) {
|
1320 |
|
1321 |
|
1322 |
|
1323 |
|
1324 |
|
1325 |
|
1326 | var dataEmotionAttribute = node.getAttribute('data-emotion');
|
1327 |
|
1328 | if (dataEmotionAttribute.indexOf(' ') === -1) {
|
1329 | return;
|
1330 | }
|
1331 |
|
1332 | document.head.appendChild(node);
|
1333 | node.setAttribute('data-s', '');
|
1334 | });
|
1335 | }
|
1336 |
|
1337 | var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;
|
1338 |
|
1339 | if (process.env.NODE_ENV !== 'production') {
|
1340 |
|
1341 | if (/[^a-z-]/.test(key)) {
|
1342 | throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");
|
1343 | }
|
1344 | }
|
1345 |
|
1346 | var inserted = {};
|
1347 |
|
1348 | var container;
|
1349 | var nodesToHydrate = [];
|
1350 |
|
1351 | if (isBrowser$6) {
|
1352 | container = options.container || document.head;
|
1353 | Array.prototype.forEach.call(
|
1354 |
|
1355 | document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
|
1356 | var attrib = node.getAttribute("data-emotion").split(' ');
|
1357 |
|
1358 | for (var i = 1; i < attrib.length; i++) {
|
1359 | inserted[attrib[i]] = true;
|
1360 | }
|
1361 |
|
1362 | nodesToHydrate.push(node);
|
1363 | });
|
1364 | }
|
1365 |
|
1366 | var _insert;
|
1367 |
|
1368 | var omnipresentPlugins = [compat, removeLabel];
|
1369 |
|
1370 | if (process.env.NODE_ENV !== 'production') {
|
1371 | omnipresentPlugins.push(createUnsafeSelectorsAlarm({
|
1372 | get compat() {
|
1373 | return cache.compat;
|
1374 | }
|
1375 |
|
1376 | }), incorrectImportAlarm);
|
1377 | }
|
1378 |
|
1379 | if (isBrowser$6) {
|
1380 | var currentSheet;
|
1381 | var finalizingPlugins = [stringify, process.env.NODE_ENV !== 'production' ? function (element) {
|
1382 | if (!element.root) {
|
1383 | if (element["return"]) {
|
1384 | currentSheet.insert(element["return"]);
|
1385 | } else if (element.value && element.type !== COMMENT) {
|
1386 |
|
1387 |
|
1388 | currentSheet.insert(element.value + "{}");
|
1389 | }
|
1390 | }
|
1391 | } : rulesheet(function (rule) {
|
1392 | currentSheet.insert(rule);
|
1393 | })];
|
1394 | var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));
|
1395 |
|
1396 | var stylis = function stylis(styles) {
|
1397 | return serialize(compile(styles), serializer);
|
1398 | };
|
1399 |
|
1400 | _insert = function insert(selector, serialized, sheet, shouldCache) {
|
1401 | currentSheet = sheet;
|
1402 |
|
1403 | if (process.env.NODE_ENV !== 'production' && serialized.map !== undefined) {
|
1404 | currentSheet = {
|
1405 | insert: function insert(rule) {
|
1406 | sheet.insert(rule + serialized.map);
|
1407 | }
|
1408 | };
|
1409 | }
|
1410 |
|
1411 | stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
|
1412 |
|
1413 | if (shouldCache) {
|
1414 | cache.inserted[serialized.name] = true;
|
1415 | }
|
1416 | };
|
1417 | } else {
|
1418 | var _finalizingPlugins = [stringify];
|
1419 |
|
1420 | var _serializer = middleware(omnipresentPlugins.concat(stylisPlugins, _finalizingPlugins));
|
1421 |
|
1422 | var _stylis = function _stylis(styles) {
|
1423 | return serialize(compile(styles), _serializer);
|
1424 | };
|
1425 |
|
1426 |
|
1427 | var serverStylisCache = getServerStylisCache(stylisPlugins)(key);
|
1428 |
|
1429 | var getRules = function getRules(selector, serialized) {
|
1430 | var name = serialized.name;
|
1431 |
|
1432 | if (serverStylisCache[name] === undefined) {
|
1433 | serverStylisCache[name] = _stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
|
1434 | }
|
1435 |
|
1436 | return serverStylisCache[name];
|
1437 | };
|
1438 |
|
1439 | _insert = function _insert(selector, serialized, sheet, shouldCache) {
|
1440 | var name = serialized.name;
|
1441 | var rules = getRules(selector, serialized);
|
1442 |
|
1443 | if (cache.compat === undefined) {
|
1444 |
|
1445 |
|
1446 |
|
1447 | if (shouldCache) {
|
1448 | cache.inserted[name] = true;
|
1449 | }
|
1450 |
|
1451 | if (
|
1452 |
|
1453 | process.env.NODE_ENV === 'development' && serialized.map !== undefined) {
|
1454 | return rules + serialized.map;
|
1455 | }
|
1456 |
|
1457 | return rules;
|
1458 | } else {
|
1459 |
|
1460 |
|
1461 |
|
1462 |
|
1463 |
|
1464 |
|
1465 |
|
1466 | if (shouldCache) {
|
1467 | cache.inserted[name] = rules;
|
1468 | } else {
|
1469 | return rules;
|
1470 | }
|
1471 | }
|
1472 | };
|
1473 | }
|
1474 |
|
1475 | var cache = {
|
1476 | key: key,
|
1477 | sheet: new StyleSheet$1({
|
1478 | key: key,
|
1479 | container: container,
|
1480 | nonce: options.nonce,
|
1481 | speedy: options.speedy,
|
1482 | prepend: options.prepend,
|
1483 | insertionPoint: options.insertionPoint
|
1484 | }),
|
1485 | nonce: options.nonce,
|
1486 | inserted: inserted,
|
1487 | registered: {},
|
1488 | insert: _insert
|
1489 | };
|
1490 | cache.sheet.hydrate(nodesToHydrate);
|
1491 | return cache;
|
1492 | };
|
1493 |
|
1494 | var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
1495 | var reactIs$1 = {
|
1496 | exports: {}
|
1497 | };
|
1498 | var reactIs_production_min = {};
|
1499 |
|
1500 |
|
1501 |
|
1502 |
|
1503 |
|
1504 |
|
1505 |
|
1506 |
|
1507 |
|
1508 | var b = "function" === typeof Symbol && Symbol.for,
|
1509 | c = b ? Symbol.for("react.element") : 60103,
|
1510 | d = b ? Symbol.for("react.portal") : 60106,
|
1511 | e = b ? Symbol.for("react.fragment") : 60107,
|
1512 | f = b ? Symbol.for("react.strict_mode") : 60108,
|
1513 | g = b ? Symbol.for("react.profiler") : 60114,
|
1514 | h = b ? Symbol.for("react.provider") : 60109,
|
1515 | k = b ? Symbol.for("react.context") : 60110,
|
1516 | l = b ? Symbol.for("react.async_mode") : 60111,
|
1517 | m = b ? Symbol.for("react.concurrent_mode") : 60111,
|
1518 | n = b ? Symbol.for("react.forward_ref") : 60112,
|
1519 | p = b ? Symbol.for("react.suspense") : 60113,
|
1520 | q = b ? Symbol.for("react.suspense_list") : 60120,
|
1521 | r = b ? Symbol.for("react.memo") : 60115,
|
1522 | t = b ? Symbol.for("react.lazy") : 60116,
|
1523 | v = b ? Symbol.for("react.block") : 60121,
|
1524 | w = b ? Symbol.for("react.fundamental") : 60117,
|
1525 | x = b ? Symbol.for("react.responder") : 60118,
|
1526 | y = b ? Symbol.for("react.scope") : 60119;
|
1527 |
|
1528 | function z(a) {
|
1529 | if ("object" === typeof a && null !== a) {
|
1530 | var u = a.$$typeof;
|
1531 |
|
1532 | switch (u) {
|
1533 | case c:
|
1534 | switch (a = a.type, a) {
|
1535 | case l:
|
1536 | case m:
|
1537 | case e:
|
1538 | case g:
|
1539 | case f:
|
1540 | case p:
|
1541 | return a;
|
1542 |
|
1543 | default:
|
1544 | switch (a = a && a.$$typeof, a) {
|
1545 | case k:
|
1546 | case n:
|
1547 | case t:
|
1548 | case r:
|
1549 | case h:
|
1550 | return a;
|
1551 |
|
1552 | default:
|
1553 | return u;
|
1554 | }
|
1555 |
|
1556 | }
|
1557 |
|
1558 | case d:
|
1559 | return u;
|
1560 | }
|
1561 | }
|
1562 | }
|
1563 |
|
1564 | function A(a) {
|
1565 | return z(a) === m;
|
1566 | }
|
1567 |
|
1568 | reactIs_production_min.AsyncMode = l;
|
1569 | reactIs_production_min.ConcurrentMode = m;
|
1570 | reactIs_production_min.ContextConsumer = k;
|
1571 | reactIs_production_min.ContextProvider = h;
|
1572 | reactIs_production_min.Element = c;
|
1573 | reactIs_production_min.ForwardRef = n;
|
1574 | reactIs_production_min.Fragment = e;
|
1575 | reactIs_production_min.Lazy = t;
|
1576 | reactIs_production_min.Memo = r;
|
1577 | reactIs_production_min.Portal = d;
|
1578 | reactIs_production_min.Profiler = g;
|
1579 | reactIs_production_min.StrictMode = f;
|
1580 | reactIs_production_min.Suspense = p;
|
1581 |
|
1582 | reactIs_production_min.isAsyncMode = function (a) {
|
1583 | return A(a) || z(a) === l;
|
1584 | };
|
1585 |
|
1586 | reactIs_production_min.isConcurrentMode = A;
|
1587 |
|
1588 | reactIs_production_min.isContextConsumer = function (a) {
|
1589 | return z(a) === k;
|
1590 | };
|
1591 |
|
1592 | reactIs_production_min.isContextProvider = function (a) {
|
1593 | return z(a) === h;
|
1594 | };
|
1595 |
|
1596 | reactIs_production_min.isElement = function (a) {
|
1597 | return "object" === typeof a && null !== a && a.$$typeof === c;
|
1598 | };
|
1599 |
|
1600 | reactIs_production_min.isForwardRef = function (a) {
|
1601 | return z(a) === n;
|
1602 | };
|
1603 |
|
1604 | reactIs_production_min.isFragment = function (a) {
|
1605 | return z(a) === e;
|
1606 | };
|
1607 |
|
1608 | reactIs_production_min.isLazy = function (a) {
|
1609 | return z(a) === t;
|
1610 | };
|
1611 |
|
1612 | reactIs_production_min.isMemo = function (a) {
|
1613 | return z(a) === r;
|
1614 | };
|
1615 |
|
1616 | reactIs_production_min.isPortal = function (a) {
|
1617 | return z(a) === d;
|
1618 | };
|
1619 |
|
1620 | reactIs_production_min.isProfiler = function (a) {
|
1621 | return z(a) === g;
|
1622 | };
|
1623 |
|
1624 | reactIs_production_min.isStrictMode = function (a) {
|
1625 | return z(a) === f;
|
1626 | };
|
1627 |
|
1628 | reactIs_production_min.isSuspense = function (a) {
|
1629 | return z(a) === p;
|
1630 | };
|
1631 |
|
1632 | reactIs_production_min.isValidElementType = function (a) {
|
1633 | return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
|
1634 | };
|
1635 |
|
1636 | reactIs_production_min.typeOf = z;
|
1637 | var reactIs_development = {};
|
1638 |
|
1639 |
|
1640 |
|
1641 |
|
1642 |
|
1643 |
|
1644 |
|
1645 |
|
1646 |
|
1647 | if (process.env.NODE_ENV !== "production") {
|
1648 | (function () {
|
1649 |
|
1650 | var hasSymbol = typeof Symbol === 'function' && Symbol.for;
|
1651 | var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
|
1652 | var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
|
1653 | var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
|
1654 | var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
|
1655 | var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
|
1656 | var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
|
1657 | var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace;
|
1658 |
|
1659 |
|
1660 | var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
|
1661 | var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
|
1662 | var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
|
1663 | var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
|
1664 | var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
|
1665 | var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
|
1666 | var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
|
1667 | var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
|
1668 | var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
|
1669 | var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
|
1670 | var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
|
1671 |
|
1672 | function isValidElementType(type) {
|
1673 | return typeof type === 'string' || typeof type === 'function' ||
|
1674 | type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
|
1675 | }
|
1676 |
|
1677 | function typeOf(object) {
|
1678 | if (typeof object === 'object' && object !== null) {
|
1679 | var $$typeof = object.$$typeof;
|
1680 |
|
1681 | switch ($$typeof) {
|
1682 | case REACT_ELEMENT_TYPE:
|
1683 | var type = object.type;
|
1684 |
|
1685 | switch (type) {
|
1686 | case REACT_ASYNC_MODE_TYPE:
|
1687 | case REACT_CONCURRENT_MODE_TYPE:
|
1688 | case REACT_FRAGMENT_TYPE:
|
1689 | case REACT_PROFILER_TYPE:
|
1690 | case REACT_STRICT_MODE_TYPE:
|
1691 | case REACT_SUSPENSE_TYPE:
|
1692 | return type;
|
1693 |
|
1694 | default:
|
1695 | var $$typeofType = type && type.$$typeof;
|
1696 |
|
1697 | switch ($$typeofType) {
|
1698 | case REACT_CONTEXT_TYPE:
|
1699 | case REACT_FORWARD_REF_TYPE:
|
1700 | case REACT_LAZY_TYPE:
|
1701 | case REACT_MEMO_TYPE:
|
1702 | case REACT_PROVIDER_TYPE:
|
1703 | return $$typeofType;
|
1704 |
|
1705 | default:
|
1706 | return $$typeof;
|
1707 | }
|
1708 |
|
1709 | }
|
1710 |
|
1711 | case REACT_PORTAL_TYPE:
|
1712 | return $$typeof;
|
1713 | }
|
1714 | }
|
1715 |
|
1716 | return undefined;
|
1717 | }
|
1718 |
|
1719 |
|
1720 | var AsyncMode = REACT_ASYNC_MODE_TYPE;
|
1721 | var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
|
1722 | var ContextConsumer = REACT_CONTEXT_TYPE;
|
1723 | var ContextProvider = REACT_PROVIDER_TYPE;
|
1724 | var Element = REACT_ELEMENT_TYPE;
|
1725 | var ForwardRef = REACT_FORWARD_REF_TYPE;
|
1726 | var Fragment = REACT_FRAGMENT_TYPE;
|
1727 | var Lazy = REACT_LAZY_TYPE;
|
1728 | var Memo = REACT_MEMO_TYPE;
|
1729 | var Portal = REACT_PORTAL_TYPE;
|
1730 | var Profiler = REACT_PROFILER_TYPE;
|
1731 | var StrictMode = REACT_STRICT_MODE_TYPE;
|
1732 | var Suspense = REACT_SUSPENSE_TYPE;
|
1733 | var hasWarnedAboutDeprecatedIsAsyncMode = false;
|
1734 |
|
1735 | function isAsyncMode(object) {
|
1736 | {
|
1737 | if (!hasWarnedAboutDeprecatedIsAsyncMode) {
|
1738 | hasWarnedAboutDeprecatedIsAsyncMode = true;
|
1739 |
|
1740 | console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
|
1741 | }
|
1742 | }
|
1743 | return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
|
1744 | }
|
1745 |
|
1746 | function isConcurrentMode(object) {
|
1747 | return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
|
1748 | }
|
1749 |
|
1750 | function isContextConsumer(object) {
|
1751 | return typeOf(object) === REACT_CONTEXT_TYPE;
|
1752 | }
|
1753 |
|
1754 | function isContextProvider(object) {
|
1755 | return typeOf(object) === REACT_PROVIDER_TYPE;
|
1756 | }
|
1757 |
|
1758 | function isElement(object) {
|
1759 | return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
1760 | }
|
1761 |
|
1762 | function isForwardRef(object) {
|
1763 | return typeOf(object) === REACT_FORWARD_REF_TYPE;
|
1764 | }
|
1765 |
|
1766 | function isFragment(object) {
|
1767 | return typeOf(object) === REACT_FRAGMENT_TYPE;
|
1768 | }
|
1769 |
|
1770 | function isLazy(object) {
|
1771 | return typeOf(object) === REACT_LAZY_TYPE;
|
1772 | }
|
1773 |
|
1774 | function isMemo(object) {
|
1775 | return typeOf(object) === REACT_MEMO_TYPE;
|
1776 | }
|
1777 |
|
1778 | function isPortal(object) {
|
1779 | return typeOf(object) === REACT_PORTAL_TYPE;
|
1780 | }
|
1781 |
|
1782 | function isProfiler(object) {
|
1783 | return typeOf(object) === REACT_PROFILER_TYPE;
|
1784 | }
|
1785 |
|
1786 | function isStrictMode(object) {
|
1787 | return typeOf(object) === REACT_STRICT_MODE_TYPE;
|
1788 | }
|
1789 |
|
1790 | function isSuspense(object) {
|
1791 | return typeOf(object) === REACT_SUSPENSE_TYPE;
|
1792 | }
|
1793 |
|
1794 | reactIs_development.AsyncMode = AsyncMode;
|
1795 | reactIs_development.ConcurrentMode = ConcurrentMode;
|
1796 | reactIs_development.ContextConsumer = ContextConsumer;
|
1797 | reactIs_development.ContextProvider = ContextProvider;
|
1798 | reactIs_development.Element = Element;
|
1799 | reactIs_development.ForwardRef = ForwardRef;
|
1800 | reactIs_development.Fragment = Fragment;
|
1801 | reactIs_development.Lazy = Lazy;
|
1802 | reactIs_development.Memo = Memo;
|
1803 | reactIs_development.Portal = Portal;
|
1804 | reactIs_development.Profiler = Profiler;
|
1805 | reactIs_development.StrictMode = StrictMode;
|
1806 | reactIs_development.Suspense = Suspense;
|
1807 | reactIs_development.isAsyncMode = isAsyncMode;
|
1808 | reactIs_development.isConcurrentMode = isConcurrentMode;
|
1809 | reactIs_development.isContextConsumer = isContextConsumer;
|
1810 | reactIs_development.isContextProvider = isContextProvider;
|
1811 | reactIs_development.isElement = isElement;
|
1812 | reactIs_development.isForwardRef = isForwardRef;
|
1813 | reactIs_development.isFragment = isFragment;
|
1814 | reactIs_development.isLazy = isLazy;
|
1815 | reactIs_development.isMemo = isMemo;
|
1816 | reactIs_development.isPortal = isPortal;
|
1817 | reactIs_development.isProfiler = isProfiler;
|
1818 | reactIs_development.isStrictMode = isStrictMode;
|
1819 | reactIs_development.isSuspense = isSuspense;
|
1820 | reactIs_development.isValidElementType = isValidElementType;
|
1821 | reactIs_development.typeOf = typeOf;
|
1822 | })();
|
1823 | }
|
1824 |
|
1825 | if (process.env.NODE_ENV === 'production') {
|
1826 | reactIs$1.exports = reactIs_production_min;
|
1827 | } else {
|
1828 | reactIs$1.exports = reactIs_development;
|
1829 | }
|
1830 |
|
1831 | var reactIs = reactIs$1.exports;
|
1832 |
|
1833 |
|
1834 |
|
1835 |
|
1836 |
|
1837 | var REACT_STATICS = {
|
1838 | childContextTypes: true,
|
1839 | contextType: true,
|
1840 | contextTypes: true,
|
1841 | defaultProps: true,
|
1842 | displayName: true,
|
1843 | getDefaultProps: true,
|
1844 | getDerivedStateFromError: true,
|
1845 | getDerivedStateFromProps: true,
|
1846 | mixins: true,
|
1847 | propTypes: true,
|
1848 | type: true
|
1849 | };
|
1850 | var KNOWN_STATICS = {
|
1851 | name: true,
|
1852 | length: true,
|
1853 | prototype: true,
|
1854 | caller: true,
|
1855 | callee: true,
|
1856 | arguments: true,
|
1857 | arity: true
|
1858 | };
|
1859 | var FORWARD_REF_STATICS = {
|
1860 | '$$typeof': true,
|
1861 | render: true,
|
1862 | defaultProps: true,
|
1863 | displayName: true,
|
1864 | propTypes: true
|
1865 | };
|
1866 | var MEMO_STATICS = {
|
1867 | '$$typeof': true,
|
1868 | compare: true,
|
1869 | defaultProps: true,
|
1870 | displayName: true,
|
1871 | propTypes: true,
|
1872 | type: true
|
1873 | };
|
1874 | var TYPE_STATICS = {};
|
1875 | TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
|
1876 | TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
|
1877 |
|
1878 | function getStatics(component) {
|
1879 |
|
1880 | if (reactIs.isMemo(component)) {
|
1881 | return MEMO_STATICS;
|
1882 | }
|
1883 |
|
1884 |
|
1885 | return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
|
1886 | }
|
1887 |
|
1888 | var defineProperty = Object.defineProperty;
|
1889 | var getOwnPropertyNames = Object.getOwnPropertyNames;
|
1890 | var getOwnPropertySymbols = Object.getOwnPropertySymbols;
|
1891 | var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
|
1892 | var getPrototypeOf = Object.getPrototypeOf;
|
1893 | var objectPrototype = Object.prototype;
|
1894 |
|
1895 | function hoistNonReactStatics$2(targetComponent, sourceComponent, blacklist) {
|
1896 | if (typeof sourceComponent !== 'string') {
|
1897 |
|
1898 | if (objectPrototype) {
|
1899 | var inheritedComponent = getPrototypeOf(sourceComponent);
|
1900 |
|
1901 | if (inheritedComponent && inheritedComponent !== objectPrototype) {
|
1902 | hoistNonReactStatics$2(targetComponent, inheritedComponent, blacklist);
|
1903 | }
|
1904 | }
|
1905 |
|
1906 | var keys = getOwnPropertyNames(sourceComponent);
|
1907 |
|
1908 | if (getOwnPropertySymbols) {
|
1909 | keys = keys.concat(getOwnPropertySymbols(sourceComponent));
|
1910 | }
|
1911 |
|
1912 | var targetStatics = getStatics(targetComponent);
|
1913 | var sourceStatics = getStatics(sourceComponent);
|
1914 |
|
1915 | for (var i = 0; i < keys.length; ++i) {
|
1916 | var key = keys[i];
|
1917 |
|
1918 | if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
|
1919 | var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
|
1920 |
|
1921 | try {
|
1922 |
|
1923 | defineProperty(targetComponent, key, descriptor);
|
1924 | } catch (e) {}
|
1925 | }
|
1926 | }
|
1927 | }
|
1928 |
|
1929 | return targetComponent;
|
1930 | }
|
1931 |
|
1932 | var hoistNonReactStatics_cjs = hoistNonReactStatics$2;
|
1933 |
|
1934 |
|
1935 | var hoistNonReactStatics = function (targetComponent, sourceComponent) {
|
1936 | return hoistNonReactStatics_cjs(targetComponent, sourceComponent);
|
1937 | };
|
1938 |
|
1939 | const hoistNonReactStatics$1 = hoistNonReactStatics;
|
1940 | var isBrowser$5 = typeof document !== 'undefined';
|
1941 |
|
1942 | function getRegisteredStyles$1(registered, registeredStyles, classNames) {
|
1943 | var rawClassName = '';
|
1944 | classNames.split(' ').forEach(function (className) {
|
1945 | if (registered[className] !== undefined) {
|
1946 | registeredStyles.push(registered[className] + ";");
|
1947 | } else {
|
1948 | rawClassName += className + " ";
|
1949 | }
|
1950 | });
|
1951 | return rawClassName;
|
1952 | }
|
1953 |
|
1954 | var registerStyles$1 = function registerStyles(cache, serialized, isStringTag) {
|
1955 | var className = cache.key + "-" + serialized.name;
|
1956 |
|
1957 | if (
|
1958 |
|
1959 |
|
1960 |
|
1961 |
|
1962 | (isStringTag === false ||
|
1963 |
|
1964 |
|
1965 |
|
1966 | isBrowser$5 === false && cache.compat !== undefined) && cache.registered[className] === undefined) {
|
1967 | cache.registered[className] = serialized.styles;
|
1968 | }
|
1969 | };
|
1970 |
|
1971 | var insertStyles$1 = function insertStyles(cache, serialized, isStringTag) {
|
1972 | registerStyles$1(cache, serialized, isStringTag);
|
1973 | var className = cache.key + "-" + serialized.name;
|
1974 |
|
1975 | if (cache.inserted[serialized.name] === undefined) {
|
1976 | var stylesForSSR = '';
|
1977 | var current = serialized;
|
1978 |
|
1979 | do {
|
1980 | var maybeStyles = cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
|
1981 |
|
1982 | if (!isBrowser$5 && maybeStyles !== undefined) {
|
1983 | stylesForSSR += maybeStyles;
|
1984 | }
|
1985 |
|
1986 | current = current.next;
|
1987 | } while (current !== undefined);
|
1988 |
|
1989 | if (!isBrowser$5 && stylesForSSR.length !== 0) {
|
1990 | return stylesForSSR;
|
1991 | }
|
1992 | }
|
1993 | };
|
1994 |
|
1995 |
|
1996 |
|
1997 |
|
1998 |
|
1999 | function murmur2(str) {
|
2000 |
|
2001 |
|
2002 |
|
2003 |
|
2004 |
|
2005 | var h = 0;
|
2006 |
|
2007 | var k,
|
2008 | i = 0,
|
2009 | len = str.length;
|
2010 |
|
2011 | for (; len >= 4; ++i, len -= 4) {
|
2012 | k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
|
2013 | k =
|
2014 |
|
2015 | (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
|
2016 | k ^=
|
2017 |
|
2018 | k >>> 24;
|
2019 | h =
|
2020 |
|
2021 | (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
|
2022 |
|
2023 | (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
2024 | }
|
2025 |
|
2026 |
|
2027 | switch (len) {
|
2028 | case 3:
|
2029 | h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
|
2030 |
|
2031 | case 2:
|
2032 | h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
|
2033 |
|
2034 | case 1:
|
2035 | h ^= str.charCodeAt(i) & 0xff;
|
2036 | h =
|
2037 |
|
2038 | (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
2039 | }
|
2040 |
|
2041 |
|
2042 |
|
2043 | h ^= h >>> 13;
|
2044 | h =
|
2045 |
|
2046 | (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
2047 | return ((h ^ h >>> 15) >>> 0).toString(36);
|
2048 | }
|
2049 |
|
2050 | var unitlessKeys = {
|
2051 | animationIterationCount: 1,
|
2052 | borderImageOutset: 1,
|
2053 | borderImageSlice: 1,
|
2054 | borderImageWidth: 1,
|
2055 | boxFlex: 1,
|
2056 | boxFlexGroup: 1,
|
2057 | boxOrdinalGroup: 1,
|
2058 | columnCount: 1,
|
2059 | columns: 1,
|
2060 | flex: 1,
|
2061 | flexGrow: 1,
|
2062 | flexPositive: 1,
|
2063 | flexShrink: 1,
|
2064 | flexNegative: 1,
|
2065 | flexOrder: 1,
|
2066 | gridRow: 1,
|
2067 | gridRowEnd: 1,
|
2068 | gridRowSpan: 1,
|
2069 | gridRowStart: 1,
|
2070 | gridColumn: 1,
|
2071 | gridColumnEnd: 1,
|
2072 | gridColumnSpan: 1,
|
2073 | gridColumnStart: 1,
|
2074 | msGridRow: 1,
|
2075 | msGridRowSpan: 1,
|
2076 | msGridColumn: 1,
|
2077 | msGridColumnSpan: 1,
|
2078 | fontWeight: 1,
|
2079 | lineHeight: 1,
|
2080 | opacity: 1,
|
2081 | order: 1,
|
2082 | orphans: 1,
|
2083 | tabSize: 1,
|
2084 | widows: 1,
|
2085 | zIndex: 1,
|
2086 | zoom: 1,
|
2087 | WebkitLineClamp: 1,
|
2088 |
|
2089 | fillOpacity: 1,
|
2090 | floodOpacity: 1,
|
2091 | stopOpacity: 1,
|
2092 | strokeDasharray: 1,
|
2093 | strokeDashoffset: 1,
|
2094 | strokeMiterlimit: 1,
|
2095 | strokeOpacity: 1,
|
2096 | strokeWidth: 1
|
2097 | };
|
2098 | var ILLEGAL_ESCAPE_SEQUENCE_ERROR$2 = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
|
2099 | var UNDEFINED_AS_OBJECT_KEY_ERROR$1 = "You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).";
|
2100 | var hyphenateRegex$1 = /[A-Z]|^ms/g;
|
2101 | var animationRegex$1 = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
|
2102 |
|
2103 | var isCustomProperty$1 = function isCustomProperty(property) {
|
2104 | return property.charCodeAt(1) === 45;
|
2105 | };
|
2106 |
|
2107 | var isProcessableValue$1 = function isProcessableValue(value) {
|
2108 | return value != null && typeof value !== 'boolean';
|
2109 | };
|
2110 |
|
2111 | var processStyleName$1 = memoize(function (styleName) {
|
2112 | return isCustomProperty$1(styleName) ? styleName : styleName.replace(hyphenateRegex$1, '-$&').toLowerCase();
|
2113 | });
|
2114 |
|
2115 | var processStyleValue$1 = function processStyleValue(key, value) {
|
2116 | switch (key) {
|
2117 | case 'animation':
|
2118 | case 'animationName':
|
2119 | {
|
2120 | if (typeof value === 'string') {
|
2121 | return value.replace(animationRegex$1, function (match, p1, p2) {
|
2122 | cursor$1 = {
|
2123 | name: p1,
|
2124 | styles: p2,
|
2125 | next: cursor$1
|
2126 | };
|
2127 | return p1;
|
2128 | });
|
2129 | }
|
2130 | }
|
2131 | }
|
2132 |
|
2133 | if (unitlessKeys[key] !== 1 && !isCustomProperty$1(key) && typeof value === 'number' && value !== 0) {
|
2134 | return value + 'px';
|
2135 | }
|
2136 |
|
2137 | return value;
|
2138 | };
|
2139 |
|
2140 | if (process.env.NODE_ENV !== 'production') {
|
2141 | var contentValuePattern$1 = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/;
|
2142 | var contentValues$1 = ['normal', 'none', 'initial', 'inherit', 'unset'];
|
2143 | var oldProcessStyleValue$1 = processStyleValue$1;
|
2144 | var msPattern$1 = /^-ms-/;
|
2145 | var hyphenPattern$1 = /-(.)/g;
|
2146 | var hyphenatedCache$1 = {};
|
2147 |
|
2148 | processStyleValue$1 = function processStyleValue(key, value) {
|
2149 | if (key === 'content') {
|
2150 | if (typeof value !== 'string' || contentValues$1.indexOf(value) === -1 && !contentValuePattern$1.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '"' && value.charAt(0) !== "'")) {
|
2151 | throw new Error("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"" + value + "\"'`");
|
2152 | }
|
2153 | }
|
2154 |
|
2155 | var processed = oldProcessStyleValue$1(key, value);
|
2156 |
|
2157 | if (processed !== '' && !isCustomProperty$1(key) && key.indexOf('-') !== -1 && hyphenatedCache$1[key] === undefined) {
|
2158 | hyphenatedCache$1[key] = true;
|
2159 | console.error("Using kebab-case for css properties in objects is not supported. Did you mean " + key.replace(msPattern$1, 'ms-').replace(hyphenPattern$1, function (str, _char) {
|
2160 | return _char.toUpperCase();
|
2161 | }) + "?");
|
2162 | }
|
2163 |
|
2164 | return processed;
|
2165 | };
|
2166 | }
|
2167 |
|
2168 | function handleInterpolation$1(mergedProps, registered, interpolation) {
|
2169 | if (interpolation == null) {
|
2170 | return '';
|
2171 | }
|
2172 |
|
2173 | if (interpolation.__emotion_styles !== undefined) {
|
2174 | if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {
|
2175 | throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');
|
2176 | }
|
2177 |
|
2178 | return interpolation;
|
2179 | }
|
2180 |
|
2181 | switch (typeof interpolation) {
|
2182 | case 'boolean':
|
2183 | {
|
2184 | return '';
|
2185 | }
|
2186 |
|
2187 | case 'object':
|
2188 | {
|
2189 | if (interpolation.anim === 1) {
|
2190 | cursor$1 = {
|
2191 | name: interpolation.name,
|
2192 | styles: interpolation.styles,
|
2193 | next: cursor$1
|
2194 | };
|
2195 | return interpolation.name;
|
2196 | }
|
2197 |
|
2198 | if (interpolation.styles !== undefined) {
|
2199 | var next = interpolation.next;
|
2200 |
|
2201 | if (next !== undefined) {
|
2202 |
|
2203 |
|
2204 | while (next !== undefined) {
|
2205 | cursor$1 = {
|
2206 | name: next.name,
|
2207 | styles: next.styles,
|
2208 | next: cursor$1
|
2209 | };
|
2210 | next = next.next;
|
2211 | }
|
2212 | }
|
2213 |
|
2214 | var styles = interpolation.styles + ";";
|
2215 |
|
2216 | if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {
|
2217 | styles += interpolation.map;
|
2218 | }
|
2219 |
|
2220 | return styles;
|
2221 | }
|
2222 |
|
2223 | return createStringFromObject$1(mergedProps, registered, interpolation);
|
2224 | }
|
2225 |
|
2226 | case 'function':
|
2227 | {
|
2228 | if (mergedProps !== undefined) {
|
2229 | var previousCursor = cursor$1;
|
2230 | var result = interpolation(mergedProps);
|
2231 | cursor$1 = previousCursor;
|
2232 | return handleInterpolation$1(mergedProps, registered, result);
|
2233 | } else if (process.env.NODE_ENV !== 'production') {
|
2234 | console.error('Functions that are interpolated in css calls will be stringified.\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\n' + 'It can be called directly with props or interpolated in a styled call like this\n' + "let SomeComponent = styled('div')`${dynamicStyle}`");
|
2235 | }
|
2236 |
|
2237 | break;
|
2238 | }
|
2239 |
|
2240 | case 'string':
|
2241 | if (process.env.NODE_ENV !== 'production') {
|
2242 | var matched = [];
|
2243 | var replaced = interpolation.replace(animationRegex$1, function (match, p1, p2) {
|
2244 | var fakeVarName = "animation" + matched.length;
|
2245 | matched.push("const " + fakeVarName + " = keyframes`" + p2.replace(/^@keyframes animation-\w+/, '') + "`");
|
2246 | return "${" + fakeVarName + "}";
|
2247 | });
|
2248 |
|
2249 | if (matched.length) {
|
2250 | console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\n\n' + 'Instead of doing this:\n\n' + [].concat(matched, ["`" + replaced + "`"]).join('\n') + '\n\nYou should wrap it with `css` like this:\n\n' + ("css`" + replaced + "`"));
|
2251 | }
|
2252 | }
|
2253 |
|
2254 | break;
|
2255 | }
|
2256 |
|
2257 |
|
2258 | if (registered == null) {
|
2259 | return interpolation;
|
2260 | }
|
2261 |
|
2262 | var cached = registered[interpolation];
|
2263 | return cached !== undefined ? cached : interpolation;
|
2264 | }
|
2265 |
|
2266 | function createStringFromObject$1(mergedProps, registered, obj) {
|
2267 | var string = '';
|
2268 |
|
2269 | if (Array.isArray(obj)) {
|
2270 | for (var i = 0; i < obj.length; i++) {
|
2271 | string += handleInterpolation$1(mergedProps, registered, obj[i]) + ";";
|
2272 | }
|
2273 | } else {
|
2274 | for (var _key in obj) {
|
2275 | var value = obj[_key];
|
2276 |
|
2277 | if (typeof value !== 'object') {
|
2278 | if (registered != null && registered[value] !== undefined) {
|
2279 | string += _key + "{" + registered[value] + "}";
|
2280 | } else if (isProcessableValue$1(value)) {
|
2281 | string += processStyleName$1(_key) + ":" + processStyleValue$1(_key, value) + ";";
|
2282 | }
|
2283 | } else {
|
2284 | if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {
|
2285 | throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');
|
2286 | }
|
2287 |
|
2288 | if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
|
2289 | for (var _i = 0; _i < value.length; _i++) {
|
2290 | if (isProcessableValue$1(value[_i])) {
|
2291 | string += processStyleName$1(_key) + ":" + processStyleValue$1(_key, value[_i]) + ";";
|
2292 | }
|
2293 | }
|
2294 | } else {
|
2295 | var interpolated = handleInterpolation$1(mergedProps, registered, value);
|
2296 |
|
2297 | switch (_key) {
|
2298 | case 'animation':
|
2299 | case 'animationName':
|
2300 | {
|
2301 | string += processStyleName$1(_key) + ":" + interpolated + ";";
|
2302 | break;
|
2303 | }
|
2304 |
|
2305 | default:
|
2306 | {
|
2307 | if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {
|
2308 | console.error(UNDEFINED_AS_OBJECT_KEY_ERROR$1);
|
2309 | }
|
2310 |
|
2311 | string += _key + "{" + interpolated + "}";
|
2312 | }
|
2313 | }
|
2314 | }
|
2315 | }
|
2316 | }
|
2317 | }
|
2318 |
|
2319 | return string;
|
2320 | }
|
2321 |
|
2322 | var labelPattern$1 = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
|
2323 | var sourceMapPattern$1;
|
2324 |
|
2325 | if (process.env.NODE_ENV !== 'production') {
|
2326 | sourceMapPattern$1 = /\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g;
|
2327 | }
|
2328 |
|
2329 |
|
2330 |
|
2331 | var cursor$1;
|
2332 |
|
2333 | var serializeStyles$1 = function serializeStyles(args, registered, mergedProps) {
|
2334 | if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
|
2335 | return args[0];
|
2336 | }
|
2337 |
|
2338 | var stringMode = true;
|
2339 | var styles = '';
|
2340 | cursor$1 = undefined;
|
2341 | var strings = args[0];
|
2342 |
|
2343 | if (strings == null || strings.raw === undefined) {
|
2344 | stringMode = false;
|
2345 | styles += handleInterpolation$1(mergedProps, registered, strings);
|
2346 | } else {
|
2347 | if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {
|
2348 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR$2);
|
2349 | }
|
2350 |
|
2351 | styles += strings[0];
|
2352 | }
|
2353 |
|
2354 |
|
2355 | for (var i = 1; i < args.length; i++) {
|
2356 | styles += handleInterpolation$1(mergedProps, registered, args[i]);
|
2357 |
|
2358 | if (stringMode) {
|
2359 | if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {
|
2360 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR$2);
|
2361 | }
|
2362 |
|
2363 | styles += strings[i];
|
2364 | }
|
2365 | }
|
2366 |
|
2367 | var sourceMap;
|
2368 |
|
2369 | if (process.env.NODE_ENV !== 'production') {
|
2370 | styles = styles.replace(sourceMapPattern$1, function (match) {
|
2371 | sourceMap = match;
|
2372 | return '';
|
2373 | });
|
2374 | }
|
2375 |
|
2376 |
|
2377 | labelPattern$1.lastIndex = 0;
|
2378 | var identifierName = '';
|
2379 | var match;
|
2380 |
|
2381 | while ((match = labelPattern$1.exec(styles)) !== null) {
|
2382 | identifierName += '-' +
|
2383 | match[1];
|
2384 | }
|
2385 |
|
2386 | var name = murmur2(styles) + identifierName;
|
2387 |
|
2388 | if (process.env.NODE_ENV !== 'production') {
|
2389 |
|
2390 | return {
|
2391 | name: name,
|
2392 | styles: styles,
|
2393 | map: sourceMap,
|
2394 | next: cursor$1,
|
2395 | toString: function toString() {
|
2396 | return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
|
2397 | }
|
2398 | };
|
2399 | }
|
2400 |
|
2401 | return {
|
2402 | name: name,
|
2403 | styles: styles,
|
2404 | next: cursor$1
|
2405 | };
|
2406 | };
|
2407 |
|
2408 | var isBrowser$4 = typeof document !== 'undefined';
|
2409 | var hasOwnProperty$1 = {}.hasOwnProperty;
|
2410 | var EmotionCacheContext = createContext(
|
2411 |
|
2412 |
|
2413 |
|
2414 |
|
2415 |
|
2416 | typeof HTMLElement !== 'undefined' ? createCache({
|
2417 | key: 'css'
|
2418 | }) : null);
|
2419 |
|
2420 | if (process.env.NODE_ENV !== 'production') {
|
2421 | EmotionCacheContext.displayName = 'EmotionCacheContext';
|
2422 | }
|
2423 |
|
2424 | var CacheProvider = EmotionCacheContext.Provider;
|
2425 |
|
2426 | var withEmotionCache = function withEmotionCache(func) {
|
2427 |
|
2428 | return forwardRef(function (props, ref) {
|
2429 |
|
2430 | var cache = useContext(EmotionCacheContext);
|
2431 | return func(props, cache, ref);
|
2432 | });
|
2433 | };
|
2434 |
|
2435 | if (!isBrowser$4) {
|
2436 | withEmotionCache = function withEmotionCache(func) {
|
2437 | return function (props) {
|
2438 | var cache = useContext(EmotionCacheContext);
|
2439 |
|
2440 | if (cache === null) {
|
2441 |
|
2442 |
|
2443 |
|
2444 |
|
2445 |
|
2446 | cache = createCache({
|
2447 | key: 'css'
|
2448 | });
|
2449 | return createElement(EmotionCacheContext.Provider, {
|
2450 | value: cache
|
2451 | }, func(props, cache));
|
2452 | } else {
|
2453 | return func(props, cache);
|
2454 | }
|
2455 | };
|
2456 | };
|
2457 | }
|
2458 |
|
2459 | var ThemeContext = createContext({});
|
2460 |
|
2461 | if (process.env.NODE_ENV !== 'production') {
|
2462 | ThemeContext.displayName = 'EmotionThemeContext';
|
2463 | }
|
2464 |
|
2465 | var useTheme$1 = function useTheme() {
|
2466 | return useContext(ThemeContext);
|
2467 | };
|
2468 |
|
2469 | var getTheme = function getTheme(outerTheme, theme) {
|
2470 | if (typeof theme === 'function') {
|
2471 | var mergedTheme = theme(outerTheme);
|
2472 |
|
2473 | if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
|
2474 | throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
|
2475 | }
|
2476 |
|
2477 | return mergedTheme;
|
2478 | }
|
2479 |
|
2480 | if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {
|
2481 | throw new Error('[ThemeProvider] Please make your theme prop a plain object');
|
2482 | }
|
2483 |
|
2484 | return _extends$1({}, outerTheme, theme);
|
2485 | };
|
2486 |
|
2487 | var createCacheWithTheme = weakMemoize(function (outerTheme) {
|
2488 | return weakMemoize(function (theme) {
|
2489 | return getTheme(outerTheme, theme);
|
2490 | });
|
2491 | });
|
2492 |
|
2493 | var ThemeProvider = function ThemeProvider(props) {
|
2494 | var theme = useContext(ThemeContext);
|
2495 |
|
2496 | if (props.theme !== theme) {
|
2497 | theme = createCacheWithTheme(theme)(props.theme);
|
2498 | }
|
2499 |
|
2500 | return createElement(ThemeContext.Provider, {
|
2501 | value: theme
|
2502 | }, props.children);
|
2503 | };
|
2504 |
|
2505 | function withTheme$1(Component) {
|
2506 | var componentName = Component.displayName || Component.name || 'Component';
|
2507 |
|
2508 | var render = function render(props, ref) {
|
2509 | var theme = useContext(ThemeContext);
|
2510 | return createElement(Component, _extends$1({
|
2511 | theme: theme,
|
2512 | ref: ref
|
2513 | }, props));
|
2514 | };
|
2515 |
|
2516 |
|
2517 | var WithTheme = forwardRef(render);
|
2518 | WithTheme.displayName = "WithTheme(" + componentName + ")";
|
2519 | return hoistNonReactStatics$1(WithTheme, Component);
|
2520 | }
|
2521 |
|
2522 | var getLastPart = function getLastPart(functionName) {
|
2523 |
|
2524 |
|
2525 | var parts = functionName.split('.');
|
2526 | return parts[parts.length - 1];
|
2527 | };
|
2528 |
|
2529 | var getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {
|
2530 |
|
2531 | var match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line);
|
2532 | if (match) return getLastPart(match[1]);
|
2533 |
|
2534 | match = /^([A-Za-z0-9$.]+)@/.exec(line);
|
2535 | if (match) return getLastPart(match[1]);
|
2536 | return undefined;
|
2537 | };
|
2538 |
|
2539 | var internalReactFunctionNames = new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']);
|
2540 |
|
2541 |
|
2542 |
|
2543 | var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
|
2544 | return identifier.replace(/\$/g, '-');
|
2545 | };
|
2546 |
|
2547 | var getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {
|
2548 | if (!stackTrace) return undefined;
|
2549 | var lines = stackTrace.split('\n');
|
2550 |
|
2551 | for (var i = 0; i < lines.length; i++) {
|
2552 | var functionName = getFunctionNameFromStackTraceLine(lines[i]);
|
2553 |
|
2554 | if (!functionName) continue;
|
2555 |
|
2556 | if (internalReactFunctionNames.has(functionName)) break;
|
2557 |
|
2558 |
|
2559 | if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);
|
2560 | }
|
2561 |
|
2562 | return undefined;
|
2563 | };
|
2564 |
|
2565 | var isBrowser$1$1 = typeof document !== 'undefined';
|
2566 | var useInsertionEffect$2 = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : function useInsertionEffect(create) {
|
2567 | create();
|
2568 | };
|
2569 |
|
2570 | function useInsertionEffectMaybe$1(create) {
|
2571 | if (!isBrowser$1$1) {
|
2572 | return create();
|
2573 | }
|
2574 |
|
2575 | useInsertionEffect$2(create);
|
2576 | }
|
2577 |
|
2578 | var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
|
2579 | var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
|
2580 |
|
2581 | var createEmotionProps = function createEmotionProps(type, props) {
|
2582 | if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' &&
|
2583 | props.css.indexOf(':') !== -1) {
|
2584 | throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
|
2585 | }
|
2586 |
|
2587 | var newProps = {};
|
2588 |
|
2589 | for (var key in props) {
|
2590 | if (hasOwnProperty$1.call(props, key)) {
|
2591 | newProps[key] = props[key];
|
2592 | }
|
2593 | }
|
2594 |
|
2595 | newProps[typePropName] = type;
|
2596 |
|
2597 |
|
2598 | if (process.env.NODE_ENV !== 'production' && !!props.css && (typeof props.css !== 'object' || typeof props.css.name !== 'string' || props.css.name.indexOf('-') === -1)) {
|
2599 | var label = getLabelFromStackTrace(new Error().stack);
|
2600 | if (label) newProps[labelPropName] = label;
|
2601 | }
|
2602 |
|
2603 | return newProps;
|
2604 | };
|
2605 |
|
2606 | var Insertion$2 = function Insertion(_ref) {
|
2607 | var cache = _ref.cache,
|
2608 | serialized = _ref.serialized,
|
2609 | isStringTag = _ref.isStringTag;
|
2610 | registerStyles$1(cache, serialized, isStringTag);
|
2611 | var rules = useInsertionEffectMaybe$1(function () {
|
2612 | return insertStyles$1(cache, serialized, isStringTag);
|
2613 | });
|
2614 |
|
2615 | if (!isBrowser$4 && rules !== undefined) {
|
2616 | var _ref2;
|
2617 |
|
2618 | var serializedNames = serialized.name;
|
2619 | var next = serialized.next;
|
2620 |
|
2621 | while (next !== undefined) {
|
2622 | serializedNames += ' ' + next.name;
|
2623 | next = next.next;
|
2624 | }
|
2625 |
|
2626 | return createElement("style", (_ref2 = {}, _ref2["data-emotion"] = cache.key + " " + serializedNames, _ref2.dangerouslySetInnerHTML = {
|
2627 | __html: rules
|
2628 | }, _ref2.nonce = cache.sheet.nonce, _ref2));
|
2629 | }
|
2630 |
|
2631 | return null;
|
2632 | };
|
2633 |
|
2634 | var Emotion = withEmotionCache(function (props, cache, ref) {
|
2635 | var cssProp = props.css;
|
2636 |
|
2637 |
|
2638 |
|
2639 | if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
|
2640 | cssProp = cache.registered[cssProp];
|
2641 | }
|
2642 |
|
2643 | var WrappedComponent = props[typePropName];
|
2644 | var registeredStyles = [cssProp];
|
2645 | var className = '';
|
2646 |
|
2647 | if (typeof props.className === 'string') {
|
2648 | className = getRegisteredStyles$1(cache.registered, registeredStyles, props.className);
|
2649 | } else if (props.className != null) {
|
2650 | className = props.className + " ";
|
2651 | }
|
2652 |
|
2653 | var serialized = serializeStyles$1(registeredStyles, undefined, useContext(ThemeContext));
|
2654 |
|
2655 | if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
|
2656 | var labelFromStack = props[labelPropName];
|
2657 |
|
2658 | if (labelFromStack) {
|
2659 | serialized = serializeStyles$1([serialized, 'label:' + labelFromStack + ';']);
|
2660 | }
|
2661 | }
|
2662 |
|
2663 | className += cache.key + "-" + serialized.name;
|
2664 | var newProps = {};
|
2665 |
|
2666 | for (var key in props) {
|
2667 | if (hasOwnProperty$1.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
|
2668 | newProps[key] = props[key];
|
2669 | }
|
2670 | }
|
2671 |
|
2672 | newProps.ref = ref;
|
2673 | newProps.className = className;
|
2674 | return createElement(Fragment, null, createElement(Insertion$2, {
|
2675 | cache: cache,
|
2676 | serialized: serialized,
|
2677 | isStringTag: typeof WrappedComponent === 'string'
|
2678 | }), createElement(WrappedComponent, newProps));
|
2679 | });
|
2680 |
|
2681 | if (process.env.NODE_ENV !== 'production') {
|
2682 | Emotion.displayName = 'EmotionCssPropInternal';
|
2683 | }
|
2684 |
|
2685 |
|
2686 |
|
2687 |
|
2688 |
|
2689 |
|
2690 |
|
2691 |
|
2692 |
|
2693 |
|
2694 |
|
2695 |
|
2696 |
|
2697 |
|
2698 |
|
2699 |
|
2700 |
|
2701 |
|
2702 |
|
2703 |
|
2704 |
|
2705 |
|
2706 |
|
2707 |
|
2708 |
|
2709 | function sheetForTag(tag) {
|
2710 | if (tag.sheet) {
|
2711 |
|
2712 | return tag.sheet;
|
2713 | }
|
2714 |
|
2715 |
|
2716 |
|
2717 |
|
2718 | for (var i = 0; i < document.styleSheets.length; i++) {
|
2719 | if (document.styleSheets[i].ownerNode === tag) {
|
2720 |
|
2721 | return document.styleSheets[i];
|
2722 | }
|
2723 | }
|
2724 | }
|
2725 |
|
2726 | function createStyleElement(options) {
|
2727 | var tag = document.createElement('style');
|
2728 | tag.setAttribute('data-emotion', options.key);
|
2729 |
|
2730 | if (options.nonce !== undefined) {
|
2731 | tag.setAttribute('nonce', options.nonce);
|
2732 | }
|
2733 |
|
2734 | tag.appendChild(document.createTextNode(''));
|
2735 | tag.setAttribute('data-s', '');
|
2736 | return tag;
|
2737 | }
|
2738 |
|
2739 | var StyleSheet = function () {
|
2740 | function StyleSheet(options) {
|
2741 | var _this = this;
|
2742 |
|
2743 | this._insertTag = function (tag) {
|
2744 | var before;
|
2745 |
|
2746 | if (_this.tags.length === 0) {
|
2747 | if (_this.insertionPoint) {
|
2748 | before = _this.insertionPoint.nextSibling;
|
2749 | } else if (_this.prepend) {
|
2750 | before = _this.container.firstChild;
|
2751 | } else {
|
2752 | before = _this.before;
|
2753 | }
|
2754 | } else {
|
2755 | before = _this.tags[_this.tags.length - 1].nextSibling;
|
2756 | }
|
2757 |
|
2758 | _this.container.insertBefore(tag, before);
|
2759 |
|
2760 | _this.tags.push(tag);
|
2761 | };
|
2762 |
|
2763 | this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;
|
2764 | this.tags = [];
|
2765 | this.ctr = 0;
|
2766 | this.nonce = options.nonce;
|
2767 |
|
2768 | this.key = options.key;
|
2769 | this.container = options.container;
|
2770 | this.prepend = options.prepend;
|
2771 | this.insertionPoint = options.insertionPoint;
|
2772 | this.before = null;
|
2773 | }
|
2774 |
|
2775 | var _proto = StyleSheet.prototype;
|
2776 |
|
2777 | _proto.hydrate = function hydrate(nodes) {
|
2778 | nodes.forEach(this._insertTag);
|
2779 | };
|
2780 |
|
2781 | _proto.insert = function insert(rule) {
|
2782 |
|
2783 |
|
2784 |
|
2785 | if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
|
2786 | this._insertTag(createStyleElement(this));
|
2787 | }
|
2788 |
|
2789 | var tag = this.tags[this.tags.length - 1];
|
2790 |
|
2791 | if (process.env.NODE_ENV !== 'production') {
|
2792 | var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;
|
2793 |
|
2794 | if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {
|
2795 |
|
2796 |
|
2797 |
|
2798 | console.error("You're attempting to insert the following rule:\n" + rule + '\n\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');
|
2799 | }
|
2800 |
|
2801 | this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;
|
2802 | }
|
2803 |
|
2804 | if (this.isSpeedy) {
|
2805 | var sheet = sheetForTag(tag);
|
2806 |
|
2807 | try {
|
2808 |
|
2809 |
|
2810 | sheet.insertRule(rule, sheet.cssRules.length);
|
2811 | } catch (e) {
|
2812 | if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear){/.test(rule)) {
|
2813 | console.error("There was a problem inserting the following rule: \"" + rule + "\"", e);
|
2814 | }
|
2815 | }
|
2816 | } else {
|
2817 | tag.appendChild(document.createTextNode(rule));
|
2818 | }
|
2819 |
|
2820 | this.ctr++;
|
2821 | };
|
2822 |
|
2823 | _proto.flush = function flush() {
|
2824 |
|
2825 | this.tags.forEach(function (tag) {
|
2826 | return tag.parentNode && tag.parentNode.removeChild(tag);
|
2827 | });
|
2828 | this.tags = [];
|
2829 | this.ctr = 0;
|
2830 |
|
2831 | if (process.env.NODE_ENV !== 'production') {
|
2832 | this._alreadyInsertedOrderInsensitiveRule = false;
|
2833 | }
|
2834 | };
|
2835 |
|
2836 | return StyleSheet;
|
2837 | }();
|
2838 |
|
2839 | var pkg = {
|
2840 | name: "@emotion/react",
|
2841 | version: "11.8.1",
|
2842 | main: "dist/emotion-react.cjs.js",
|
2843 | module: "dist/emotion-react.esm.js",
|
2844 | browser: {
|
2845 | "./dist/emotion-react.cjs.js": "./dist/emotion-react.browser.cjs.js",
|
2846 | "./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
|
2847 | },
|
2848 | types: "types/index.d.ts",
|
2849 | files: ["src", "dist", "jsx-runtime", "jsx-dev-runtime", "_isolated-hnrs", "types/*.d.ts", "macro.js", "macro.d.ts", "macro.js.flow"],
|
2850 | sideEffects: false,
|
2851 | author: "Emotion Contributors",
|
2852 | license: "MIT",
|
2853 | scripts: {
|
2854 | "test:typescript": "dtslint types"
|
2855 | },
|
2856 | dependencies: {
|
2857 | "@babel/runtime": "^7.13.10",
|
2858 | "@emotion/babel-plugin": "^11.7.1",
|
2859 | "@emotion/cache": "^11.7.1",
|
2860 | "@emotion/serialize": "^1.0.2",
|
2861 | "@emotion/sheet": "^1.1.0",
|
2862 | "@emotion/utils": "^1.1.0",
|
2863 | "@emotion/weak-memoize": "^0.2.5",
|
2864 | "hoist-non-react-statics": "^3.3.1"
|
2865 | },
|
2866 | peerDependencies: {
|
2867 | "@babel/core": "^7.0.0",
|
2868 | react: ">=16.8.0"
|
2869 | },
|
2870 | peerDependenciesMeta: {
|
2871 | "@babel/core": {
|
2872 | optional: true
|
2873 | },
|
2874 | "@types/react": {
|
2875 | optional: true
|
2876 | }
|
2877 | },
|
2878 | devDependencies: {
|
2879 | "@babel/core": "^7.13.10",
|
2880 | "@emotion/css": "11.7.1",
|
2881 | "@emotion/css-prettifier": "1.0.1",
|
2882 | "@emotion/server": "11.4.0",
|
2883 | "@emotion/styled": "11.8.1",
|
2884 | "@types/react": "^16.9.11",
|
2885 | dtslint: "^0.3.0",
|
2886 | "html-tag-names": "^1.1.2",
|
2887 | react: "16.14.0",
|
2888 | "svg-tag-names": "^1.1.1"
|
2889 | },
|
2890 | repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
|
2891 | publishConfig: {
|
2892 | access: "public"
|
2893 | },
|
2894 | "umd:main": "dist/emotion-react.umd.min.js",
|
2895 | preconstruct: {
|
2896 | entrypoints: ["./index.js", "./jsx-runtime.js", "./jsx-dev-runtime.js", "./_isolated-hnrs.js"],
|
2897 | umdName: "emotionReact"
|
2898 | }
|
2899 | };
|
2900 |
|
2901 | var jsx = function jsx(type, props) {
|
2902 | var args = arguments;
|
2903 |
|
2904 | if (props == null || !hasOwnProperty$1.call(props, 'css')) {
|
2905 |
|
2906 | return createElement.apply(undefined, args);
|
2907 | }
|
2908 |
|
2909 | var argsLength = args.length;
|
2910 | var createElementArgArray = new Array(argsLength);
|
2911 | createElementArgArray[0] = Emotion;
|
2912 | createElementArgArray[1] = createEmotionProps(type, props);
|
2913 |
|
2914 | for (var i = 2; i < argsLength; i++) {
|
2915 | createElementArgArray[i] = args[i];
|
2916 | }
|
2917 |
|
2918 |
|
2919 | return createElement.apply(null, createElementArgArray);
|
2920 | };
|
2921 |
|
2922 | var useInsertionEffect$1 = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : useLayoutEffect;
|
2923 | var warnedAboutCssPropForGlobal = false;
|
2924 |
|
2925 |
|
2926 |
|
2927 | var Global$1 = withEmotionCache(function (props, cache) {
|
2928 | if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && (
|
2929 |
|
2930 |
|
2931 |
|
2932 | props.className || props.css)) {
|
2933 | console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
|
2934 | warnedAboutCssPropForGlobal = true;
|
2935 | }
|
2936 |
|
2937 | var styles = props.styles;
|
2938 | var serialized = serializeStyles$1([styles], undefined, useContext(ThemeContext));
|
2939 |
|
2940 | if (!isBrowser$4) {
|
2941 | var _ref;
|
2942 |
|
2943 | var serializedNames = serialized.name;
|
2944 | var serializedStyles = serialized.styles;
|
2945 | var next = serialized.next;
|
2946 |
|
2947 | while (next !== undefined) {
|
2948 | serializedNames += ' ' + next.name;
|
2949 | serializedStyles += next.styles;
|
2950 | next = next.next;
|
2951 | }
|
2952 |
|
2953 | var shouldCache = cache.compat === true;
|
2954 | var rules = cache.insert("", {
|
2955 | name: serializedNames,
|
2956 | styles: serializedStyles
|
2957 | }, cache.sheet, shouldCache);
|
2958 |
|
2959 | if (shouldCache) {
|
2960 | return null;
|
2961 | }
|
2962 |
|
2963 | return createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + "-global " + serializedNames, _ref.dangerouslySetInnerHTML = {
|
2964 | __html: rules
|
2965 | }, _ref.nonce = cache.sheet.nonce, _ref));
|
2966 | }
|
2967 |
|
2968 |
|
2969 |
|
2970 |
|
2971 |
|
2972 | var sheetRef = useRef();
|
2973 | useInsertionEffect$1(function () {
|
2974 | var key = cache.key + "-global";
|
2975 | var sheet = new StyleSheet({
|
2976 | key: key,
|
2977 | nonce: cache.sheet.nonce,
|
2978 | container: cache.sheet.container,
|
2979 | speedy: cache.sheet.isSpeedy
|
2980 | });
|
2981 | var rehydrating = false;
|
2982 |
|
2983 | var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
|
2984 |
|
2985 | if (cache.sheet.tags.length) {
|
2986 | sheet.before = cache.sheet.tags[0];
|
2987 | }
|
2988 |
|
2989 | if (node !== null) {
|
2990 | rehydrating = true;
|
2991 |
|
2992 | node.setAttribute('data-emotion', key);
|
2993 | sheet.hydrate([node]);
|
2994 | }
|
2995 |
|
2996 | sheetRef.current = [sheet, rehydrating];
|
2997 | return function () {
|
2998 | sheet.flush();
|
2999 | };
|
3000 | }, [cache]);
|
3001 | useInsertionEffect$1(function () {
|
3002 | var sheetRefCurrent = sheetRef.current;
|
3003 | var sheet = sheetRefCurrent[0],
|
3004 | rehydrating = sheetRefCurrent[1];
|
3005 |
|
3006 | if (rehydrating) {
|
3007 | sheetRefCurrent[1] = false;
|
3008 | return;
|
3009 | }
|
3010 |
|
3011 | if (serialized.next !== undefined) {
|
3012 |
|
3013 | insertStyles$1(cache, serialized.next, true);
|
3014 | }
|
3015 |
|
3016 | if (sheet.tags.length) {
|
3017 |
|
3018 | var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
|
3019 | sheet.before = element;
|
3020 | sheet.flush();
|
3021 | }
|
3022 |
|
3023 | cache.insert("", serialized, sheet, false);
|
3024 | }, [cache, serialized.name]);
|
3025 | return null;
|
3026 | });
|
3027 |
|
3028 | if (process.env.NODE_ENV !== 'production') {
|
3029 | Global$1.displayName = 'EmotionGlobal';
|
3030 | }
|
3031 |
|
3032 | function css() {
|
3033 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
3034 | args[_key] = arguments[_key];
|
3035 | }
|
3036 |
|
3037 | return serializeStyles$1(args);
|
3038 | }
|
3039 |
|
3040 | var keyframes = function keyframes() {
|
3041 | var insertable = css.apply(void 0, arguments);
|
3042 | var name = "animation-" + insertable.name;
|
3043 |
|
3044 | return {
|
3045 | name: name,
|
3046 | styles: "@keyframes " + name + "{" + insertable.styles + "}",
|
3047 | anim: 1,
|
3048 | toString: function toString() {
|
3049 | return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
|
3050 | }
|
3051 | };
|
3052 | };
|
3053 |
|
3054 | var classnames = function classnames(args) {
|
3055 | var len = args.length;
|
3056 | var i = 0;
|
3057 | var cls = '';
|
3058 |
|
3059 | for (; i < len; i++) {
|
3060 | var arg = args[i];
|
3061 | if (arg == null) continue;
|
3062 | var toAdd = void 0;
|
3063 |
|
3064 | switch (typeof arg) {
|
3065 | case 'boolean':
|
3066 | break;
|
3067 |
|
3068 | case 'object':
|
3069 | {
|
3070 | if (Array.isArray(arg)) {
|
3071 | toAdd = classnames(arg);
|
3072 | } else {
|
3073 | if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
|
3074 | console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
|
3075 | }
|
3076 |
|
3077 | toAdd = '';
|
3078 |
|
3079 | for (var k in arg) {
|
3080 | if (arg[k] && k) {
|
3081 | toAdd && (toAdd += ' ');
|
3082 | toAdd += k;
|
3083 | }
|
3084 | }
|
3085 | }
|
3086 |
|
3087 | break;
|
3088 | }
|
3089 |
|
3090 | default:
|
3091 | {
|
3092 | toAdd = arg;
|
3093 | }
|
3094 | }
|
3095 |
|
3096 | if (toAdd) {
|
3097 | cls && (cls += ' ');
|
3098 | cls += toAdd;
|
3099 | }
|
3100 | }
|
3101 |
|
3102 | return cls;
|
3103 | };
|
3104 |
|
3105 | function merge(registered, css, className) {
|
3106 | var registeredStyles = [];
|
3107 | var rawClassName = getRegisteredStyles$1(registered, registeredStyles, className);
|
3108 |
|
3109 | if (registeredStyles.length < 2) {
|
3110 | return className;
|
3111 | }
|
3112 |
|
3113 | return rawClassName + css(registeredStyles);
|
3114 | }
|
3115 |
|
3116 | var Insertion$1 = function Insertion(_ref) {
|
3117 | var cache = _ref.cache,
|
3118 | serializedArr = _ref.serializedArr;
|
3119 | var rules = useInsertionEffectMaybe$1(function () {
|
3120 | var rules = '';
|
3121 |
|
3122 | for (var i = 0; i < serializedArr.length; i++) {
|
3123 | var res = insertStyles$1(cache, serializedArr[i], false);
|
3124 |
|
3125 | if (!isBrowser$4 && res !== undefined) {
|
3126 | rules += res;
|
3127 | }
|
3128 | }
|
3129 |
|
3130 | if (!isBrowser$4) {
|
3131 | return rules;
|
3132 | }
|
3133 | });
|
3134 |
|
3135 | if (!isBrowser$4 && rules.length !== 0) {
|
3136 | var _ref2;
|
3137 |
|
3138 | return createElement("style", (_ref2 = {}, _ref2["data-emotion"] = cache.key + " " + serializedArr.map(function (serialized) {
|
3139 | return serialized.name;
|
3140 | }).join(' '), _ref2.dangerouslySetInnerHTML = {
|
3141 | __html: rules
|
3142 | }, _ref2.nonce = cache.sheet.nonce, _ref2));
|
3143 | }
|
3144 |
|
3145 | return null;
|
3146 | };
|
3147 |
|
3148 | var ClassNames = withEmotionCache(function (props, cache) {
|
3149 | var hasRendered = false;
|
3150 | var serializedArr = [];
|
3151 |
|
3152 | var css = function css() {
|
3153 | if (hasRendered && process.env.NODE_ENV !== 'production') {
|
3154 | throw new Error('css can only be used during render');
|
3155 | }
|
3156 |
|
3157 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
3158 | args[_key] = arguments[_key];
|
3159 | }
|
3160 |
|
3161 | var serialized = serializeStyles$1(args, cache.registered);
|
3162 | serializedArr.push(serialized);
|
3163 |
|
3164 | registerStyles$1(cache, serialized, false);
|
3165 | return cache.key + "-" + serialized.name;
|
3166 | };
|
3167 |
|
3168 | var cx = function cx() {
|
3169 | if (hasRendered && process.env.NODE_ENV !== 'production') {
|
3170 | throw new Error('cx can only be used during render');
|
3171 | }
|
3172 |
|
3173 | for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
3174 | args[_key2] = arguments[_key2];
|
3175 | }
|
3176 |
|
3177 | return merge(cache.registered, css, classnames(args));
|
3178 | };
|
3179 |
|
3180 | var content = {
|
3181 | css: css,
|
3182 | cx: cx,
|
3183 | theme: useContext(ThemeContext)
|
3184 | };
|
3185 | var ele = props.children(content);
|
3186 | hasRendered = true;
|
3187 | return createElement(Fragment, null, createElement(Insertion$1, {
|
3188 | cache: cache,
|
3189 | serializedArr: serializedArr
|
3190 | }), ele);
|
3191 | });
|
3192 |
|
3193 | if (process.env.NODE_ENV !== 'production') {
|
3194 | ClassNames.displayName = 'EmotionClassNames';
|
3195 | }
|
3196 |
|
3197 | if (process.env.NODE_ENV !== 'production') {
|
3198 | var isBrowser$3 = typeof document !== 'undefined';
|
3199 |
|
3200 | var isJest = typeof jest !== 'undefined';
|
3201 |
|
3202 | if (isBrowser$3 && !isJest) {
|
3203 |
|
3204 | var globalContext =
|
3205 | typeof globalThis !== 'undefined' ? globalThis
|
3206 | : isBrowser$3 ? window : global;
|
3207 | var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
|
3208 |
|
3209 | if (globalContext[globalKey]) {
|
3210 | console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
|
3211 | }
|
3212 |
|
3213 | globalContext[globalKey] = true;
|
3214 | }
|
3215 | }
|
3216 |
|
3217 | var isBrowser$2 = typeof document !== 'undefined';
|
3218 |
|
3219 | function getRegisteredStyles(registered, registeredStyles, classNames) {
|
3220 | var rawClassName = '';
|
3221 | classNames.split(' ').forEach(function (className) {
|
3222 | if (registered[className] !== undefined) {
|
3223 | registeredStyles.push(registered[className] + ";");
|
3224 | } else {
|
3225 | rawClassName += className + " ";
|
3226 | }
|
3227 | });
|
3228 | return rawClassName;
|
3229 | }
|
3230 |
|
3231 | var registerStyles = function registerStyles(cache, serialized, isStringTag) {
|
3232 | var className = cache.key + "-" + serialized.name;
|
3233 |
|
3234 | if (
|
3235 |
|
3236 |
|
3237 |
|
3238 |
|
3239 | (isStringTag === false ||
|
3240 |
|
3241 |
|
3242 |
|
3243 | isBrowser$2 === false && cache.compat !== undefined) && cache.registered[className] === undefined) {
|
3244 | cache.registered[className] = serialized.styles;
|
3245 | }
|
3246 | };
|
3247 |
|
3248 | var insertStyles = function insertStyles(cache, serialized, isStringTag) {
|
3249 | registerStyles(cache, serialized, isStringTag);
|
3250 | var className = cache.key + "-" + serialized.name;
|
3251 |
|
3252 | if (cache.inserted[serialized.name] === undefined) {
|
3253 | var stylesForSSR = '';
|
3254 | var current = serialized;
|
3255 |
|
3256 | do {
|
3257 | var maybeStyles = cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
|
3258 |
|
3259 | if (!isBrowser$2 && maybeStyles !== undefined) {
|
3260 | stylesForSSR += maybeStyles;
|
3261 | }
|
3262 |
|
3263 | current = current.next;
|
3264 | } while (current !== undefined);
|
3265 |
|
3266 | if (!isBrowser$2 && stylesForSSR.length !== 0) {
|
3267 | return stylesForSSR;
|
3268 | }
|
3269 | }
|
3270 | };
|
3271 |
|
3272 | var ILLEGAL_ESCAPE_SEQUENCE_ERROR$1 = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
|
3273 | var UNDEFINED_AS_OBJECT_KEY_ERROR = "You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).";
|
3274 | var hyphenateRegex = /[A-Z]|^ms/g;
|
3275 | var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
|
3276 |
|
3277 | var isCustomProperty = function isCustomProperty(property) {
|
3278 | return property.charCodeAt(1) === 45;
|
3279 | };
|
3280 |
|
3281 | var isProcessableValue = function isProcessableValue(value) {
|
3282 | return value != null && typeof value !== 'boolean';
|
3283 | };
|
3284 |
|
3285 | var processStyleName = memoize(function (styleName) {
|
3286 | return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();
|
3287 | });
|
3288 |
|
3289 | var processStyleValue = function processStyleValue(key, value) {
|
3290 | switch (key) {
|
3291 | case 'animation':
|
3292 | case 'animationName':
|
3293 | {
|
3294 | if (typeof value === 'string') {
|
3295 | return value.replace(animationRegex, function (match, p1, p2) {
|
3296 | cursor = {
|
3297 | name: p1,
|
3298 | styles: p2,
|
3299 | next: cursor
|
3300 | };
|
3301 | return p1;
|
3302 | });
|
3303 | }
|
3304 | }
|
3305 | }
|
3306 |
|
3307 | if (unitlessKeys[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {
|
3308 | return value + 'px';
|
3309 | }
|
3310 |
|
3311 | return value;
|
3312 | };
|
3313 |
|
3314 | if (process.env.NODE_ENV !== 'production') {
|
3315 | var contentValuePattern = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/;
|
3316 | var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];
|
3317 | var oldProcessStyleValue = processStyleValue;
|
3318 | var msPattern = /^-ms-/;
|
3319 | var hyphenPattern = /-(.)/g;
|
3320 | var hyphenatedCache = {};
|
3321 |
|
3322 | processStyleValue = function processStyleValue(key, value) {
|
3323 | if (key === 'content') {
|
3324 | if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '"' && value.charAt(0) !== "'")) {
|
3325 | throw new Error("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"" + value + "\"'`");
|
3326 | }
|
3327 | }
|
3328 |
|
3329 | var processed = oldProcessStyleValue(key, value);
|
3330 |
|
3331 | if (processed !== '' && !isCustomProperty(key) && key.indexOf('-') !== -1 && hyphenatedCache[key] === undefined) {
|
3332 | hyphenatedCache[key] = true;
|
3333 | console.error("Using kebab-case for css properties in objects is not supported. Did you mean " + key.replace(msPattern, 'ms-').replace(hyphenPattern, function (str, _char) {
|
3334 | return _char.toUpperCase();
|
3335 | }) + "?");
|
3336 | }
|
3337 |
|
3338 | return processed;
|
3339 | };
|
3340 | }
|
3341 |
|
3342 | function handleInterpolation(mergedProps, registered, interpolation) {
|
3343 | if (interpolation == null) {
|
3344 | return '';
|
3345 | }
|
3346 |
|
3347 | if (interpolation.__emotion_styles !== undefined) {
|
3348 | if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {
|
3349 | throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');
|
3350 | }
|
3351 |
|
3352 | return interpolation;
|
3353 | }
|
3354 |
|
3355 | switch (typeof interpolation) {
|
3356 | case 'boolean':
|
3357 | {
|
3358 | return '';
|
3359 | }
|
3360 |
|
3361 | case 'object':
|
3362 | {
|
3363 | if (interpolation.anim === 1) {
|
3364 | cursor = {
|
3365 | name: interpolation.name,
|
3366 | styles: interpolation.styles,
|
3367 | next: cursor
|
3368 | };
|
3369 | return interpolation.name;
|
3370 | }
|
3371 |
|
3372 | if (interpolation.styles !== undefined) {
|
3373 | var next = interpolation.next;
|
3374 |
|
3375 | if (next !== undefined) {
|
3376 |
|
3377 |
|
3378 | while (next !== undefined) {
|
3379 | cursor = {
|
3380 | name: next.name,
|
3381 | styles: next.styles,
|
3382 | next: cursor
|
3383 | };
|
3384 | next = next.next;
|
3385 | }
|
3386 | }
|
3387 |
|
3388 | var styles = interpolation.styles + ";";
|
3389 |
|
3390 | if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {
|
3391 | styles += interpolation.map;
|
3392 | }
|
3393 |
|
3394 | return styles;
|
3395 | }
|
3396 |
|
3397 | return createStringFromObject(mergedProps, registered, interpolation);
|
3398 | }
|
3399 |
|
3400 | case 'function':
|
3401 | {
|
3402 | if (mergedProps !== undefined) {
|
3403 | var previousCursor = cursor;
|
3404 | var result = interpolation(mergedProps);
|
3405 | cursor = previousCursor;
|
3406 | return handleInterpolation(mergedProps, registered, result);
|
3407 | } else if (process.env.NODE_ENV !== 'production') {
|
3408 | console.error('Functions that are interpolated in css calls will be stringified.\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\n' + 'It can be called directly with props or interpolated in a styled call like this\n' + "let SomeComponent = styled('div')`${dynamicStyle}`");
|
3409 | }
|
3410 |
|
3411 | break;
|
3412 | }
|
3413 |
|
3414 | case 'string':
|
3415 | if (process.env.NODE_ENV !== 'production') {
|
3416 | var matched = [];
|
3417 | var replaced = interpolation.replace(animationRegex, function (match, p1, p2) {
|
3418 | var fakeVarName = "animation" + matched.length;
|
3419 | matched.push("const " + fakeVarName + " = keyframes`" + p2.replace(/^@keyframes animation-\w+/, '') + "`");
|
3420 | return "${" + fakeVarName + "}";
|
3421 | });
|
3422 |
|
3423 | if (matched.length) {
|
3424 | console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\n\n' + 'Instead of doing this:\n\n' + [].concat(matched, ["`" + replaced + "`"]).join('\n') + '\n\nYou should wrap it with `css` like this:\n\n' + ("css`" + replaced + "`"));
|
3425 | }
|
3426 | }
|
3427 |
|
3428 | break;
|
3429 | }
|
3430 |
|
3431 |
|
3432 | if (registered == null) {
|
3433 | return interpolation;
|
3434 | }
|
3435 |
|
3436 | var cached = registered[interpolation];
|
3437 | return cached !== undefined ? cached : interpolation;
|
3438 | }
|
3439 |
|
3440 | function createStringFromObject(mergedProps, registered, obj) {
|
3441 | var string = '';
|
3442 |
|
3443 | if (Array.isArray(obj)) {
|
3444 | for (var i = 0; i < obj.length; i++) {
|
3445 | string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
|
3446 | }
|
3447 | } else {
|
3448 | for (var _key in obj) {
|
3449 | var value = obj[_key];
|
3450 |
|
3451 | if (typeof value !== 'object') {
|
3452 | if (registered != null && registered[value] !== undefined) {
|
3453 | string += _key + "{" + registered[value] + "}";
|
3454 | } else if (isProcessableValue(value)) {
|
3455 | string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
|
3456 | }
|
3457 | } else {
|
3458 | if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {
|
3459 | throw new Error('Component selectors can only be used in conjunction with @emotion/babel-plugin.');
|
3460 | }
|
3461 |
|
3462 | if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
|
3463 | for (var _i = 0; _i < value.length; _i++) {
|
3464 | if (isProcessableValue(value[_i])) {
|
3465 | string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
|
3466 | }
|
3467 | }
|
3468 | } else {
|
3469 | var interpolated = handleInterpolation(mergedProps, registered, value);
|
3470 |
|
3471 | switch (_key) {
|
3472 | case 'animation':
|
3473 | case 'animationName':
|
3474 | {
|
3475 | string += processStyleName(_key) + ":" + interpolated + ";";
|
3476 | break;
|
3477 | }
|
3478 |
|
3479 | default:
|
3480 | {
|
3481 | if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {
|
3482 | console.error(UNDEFINED_AS_OBJECT_KEY_ERROR);
|
3483 | }
|
3484 |
|
3485 | string += _key + "{" + interpolated + "}";
|
3486 | }
|
3487 | }
|
3488 | }
|
3489 | }
|
3490 | }
|
3491 | }
|
3492 |
|
3493 | return string;
|
3494 | }
|
3495 |
|
3496 | var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
|
3497 | var sourceMapPattern;
|
3498 |
|
3499 | if (process.env.NODE_ENV !== 'production') {
|
3500 | sourceMapPattern = /\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g;
|
3501 | }
|
3502 |
|
3503 |
|
3504 |
|
3505 | var cursor;
|
3506 |
|
3507 | var serializeStyles = function serializeStyles(args, registered, mergedProps) {
|
3508 | if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
|
3509 | return args[0];
|
3510 | }
|
3511 |
|
3512 | var stringMode = true;
|
3513 | var styles = '';
|
3514 | cursor = undefined;
|
3515 | var strings = args[0];
|
3516 |
|
3517 | if (strings == null || strings.raw === undefined) {
|
3518 | stringMode = false;
|
3519 | styles += handleInterpolation(mergedProps, registered, strings);
|
3520 | } else {
|
3521 | if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {
|
3522 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR$1);
|
3523 | }
|
3524 |
|
3525 | styles += strings[0];
|
3526 | }
|
3527 |
|
3528 |
|
3529 | for (var i = 1; i < args.length; i++) {
|
3530 | styles += handleInterpolation(mergedProps, registered, args[i]);
|
3531 |
|
3532 | if (stringMode) {
|
3533 | if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {
|
3534 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR$1);
|
3535 | }
|
3536 |
|
3537 | styles += strings[i];
|
3538 | }
|
3539 | }
|
3540 |
|
3541 | var sourceMap;
|
3542 |
|
3543 | if (process.env.NODE_ENV !== 'production') {
|
3544 | styles = styles.replace(sourceMapPattern, function (match) {
|
3545 | sourceMap = match;
|
3546 | return '';
|
3547 | });
|
3548 | }
|
3549 |
|
3550 |
|
3551 | labelPattern.lastIndex = 0;
|
3552 | var identifierName = '';
|
3553 | var match;
|
3554 |
|
3555 | while ((match = labelPattern.exec(styles)) !== null) {
|
3556 | identifierName += '-' +
|
3557 | match[1];
|
3558 | }
|
3559 |
|
3560 | var name = murmur2(styles) + identifierName;
|
3561 |
|
3562 | if (process.env.NODE_ENV !== 'production') {
|
3563 |
|
3564 | return {
|
3565 | name: name,
|
3566 | styles: styles,
|
3567 | map: sourceMap,
|
3568 | next: cursor,
|
3569 | toString: function toString() {
|
3570 | return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
|
3571 | }
|
3572 | };
|
3573 | }
|
3574 |
|
3575 | return {
|
3576 | name: name,
|
3577 | styles: styles,
|
3578 | next: cursor
|
3579 | };
|
3580 | };
|
3581 |
|
3582 | var testOmitPropsOnStringTag = isPropValid;
|
3583 |
|
3584 | var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
|
3585 | return key !== 'theme';
|
3586 | };
|
3587 |
|
3588 | var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
|
3589 | return typeof tag === 'string' &&
|
3590 |
|
3591 |
|
3592 | tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
|
3593 | };
|
3594 |
|
3595 | var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
|
3596 | var shouldForwardProp;
|
3597 |
|
3598 | if (options) {
|
3599 | var optionsShouldForwardProp = options.shouldForwardProp;
|
3600 | shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
|
3601 | return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
|
3602 | } : optionsShouldForwardProp;
|
3603 | }
|
3604 |
|
3605 | if (typeof shouldForwardProp !== 'function' && isReal) {
|
3606 | shouldForwardProp = tag.__emotion_forwardProp;
|
3607 | }
|
3608 |
|
3609 | return shouldForwardProp;
|
3610 | };
|
3611 |
|
3612 | var isBrowser = typeof document !== 'undefined';
|
3613 | var useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : function useInsertionEffect(create) {
|
3614 | create();
|
3615 | };
|
3616 |
|
3617 | function useInsertionEffectMaybe(create) {
|
3618 | if (!isBrowser) {
|
3619 | return create();
|
3620 | }
|
3621 |
|
3622 | useInsertionEffect(create);
|
3623 | }
|
3624 |
|
3625 | var ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
|
3626 | var isBrowser$1 = typeof document !== 'undefined';
|
3627 |
|
3628 | var Insertion = function Insertion(_ref) {
|
3629 | var cache = _ref.cache,
|
3630 | serialized = _ref.serialized,
|
3631 | isStringTag = _ref.isStringTag;
|
3632 | registerStyles(cache, serialized, isStringTag);
|
3633 | var rules = useInsertionEffectMaybe(function () {
|
3634 | return insertStyles(cache, serialized, isStringTag);
|
3635 | });
|
3636 |
|
3637 | if (!isBrowser$1 && rules !== undefined) {
|
3638 | var _ref2;
|
3639 |
|
3640 | var serializedNames = serialized.name;
|
3641 | var next = serialized.next;
|
3642 |
|
3643 | while (next !== undefined) {
|
3644 | serializedNames += ' ' + next.name;
|
3645 | next = next.next;
|
3646 | }
|
3647 |
|
3648 | return createElement("style", (_ref2 = {}, _ref2["data-emotion"] = cache.key + " " + serializedNames, _ref2.dangerouslySetInnerHTML = {
|
3649 | __html: rules
|
3650 | }, _ref2.nonce = cache.sheet.nonce, _ref2));
|
3651 | }
|
3652 |
|
3653 | return null;
|
3654 | };
|
3655 |
|
3656 | var createStyled = function createStyled(tag, options) {
|
3657 | if (process.env.NODE_ENV !== 'production') {
|
3658 | if (tag === undefined) {
|
3659 | throw new Error('You are trying to create a styled element with an undefined component.\nYou may have forgotten to import it.');
|
3660 | }
|
3661 | }
|
3662 |
|
3663 | var isReal = tag.__emotion_real === tag;
|
3664 | var baseTag = isReal && tag.__emotion_base || tag;
|
3665 | var identifierName;
|
3666 | var targetClassName;
|
3667 |
|
3668 | if (options !== undefined) {
|
3669 | identifierName = options.label;
|
3670 | targetClassName = options.target;
|
3671 | }
|
3672 |
|
3673 | var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
|
3674 | var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
|
3675 | var shouldUseAs = !defaultShouldForwardProp('as');
|
3676 | return function () {
|
3677 | var args = arguments;
|
3678 | var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
|
3679 |
|
3680 | if (identifierName !== undefined) {
|
3681 | styles.push("label:" + identifierName + ";");
|
3682 | }
|
3683 |
|
3684 | if (args[0] == null || args[0].raw === undefined) {
|
3685 | styles.push.apply(styles, args);
|
3686 | } else {
|
3687 | if (process.env.NODE_ENV !== 'production' && args[0][0] === undefined) {
|
3688 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
|
3689 | }
|
3690 |
|
3691 | styles.push(args[0][0]);
|
3692 | var len = args.length;
|
3693 | var i = 1;
|
3694 |
|
3695 | for (; i < len; i++) {
|
3696 | if (process.env.NODE_ENV !== 'production' && args[0][i] === undefined) {
|
3697 | console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
|
3698 | }
|
3699 |
|
3700 | styles.push(args[i], args[0][i]);
|
3701 | }
|
3702 | }
|
3703 |
|
3704 |
|
3705 | var Styled = withEmotionCache(function (props, cache, ref) {
|
3706 | var FinalTag = shouldUseAs && props.as || baseTag;
|
3707 | var className = '';
|
3708 | var classInterpolations = [];
|
3709 | var mergedProps = props;
|
3710 |
|
3711 | if (props.theme == null) {
|
3712 | mergedProps = {};
|
3713 |
|
3714 | for (var key in props) {
|
3715 | mergedProps[key] = props[key];
|
3716 | }
|
3717 |
|
3718 | mergedProps.theme = useContext(ThemeContext);
|
3719 | }
|
3720 |
|
3721 | if (typeof props.className === 'string') {
|
3722 | className = getRegisteredStyles(cache.registered, classInterpolations, props.className);
|
3723 | } else if (props.className != null) {
|
3724 | className = props.className + " ";
|
3725 | }
|
3726 |
|
3727 | var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
|
3728 | className += cache.key + "-" + serialized.name;
|
3729 |
|
3730 | if (targetClassName !== undefined) {
|
3731 | className += " " + targetClassName;
|
3732 | }
|
3733 |
|
3734 | var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
|
3735 | var newProps = {};
|
3736 |
|
3737 | for (var _key in props) {
|
3738 | if (shouldUseAs && _key === 'as') continue;
|
3739 |
|
3740 | if (
|
3741 | finalShouldForwardProp(_key)) {
|
3742 | newProps[_key] = props[_key];
|
3743 | }
|
3744 | }
|
3745 |
|
3746 | newProps.className = className;
|
3747 | newProps.ref = ref;
|
3748 | return createElement(Fragment, null, createElement(Insertion, {
|
3749 | cache: cache,
|
3750 | serialized: serialized,
|
3751 | isStringTag: typeof FinalTag === 'string'
|
3752 | }), createElement(FinalTag, newProps));
|
3753 | });
|
3754 | Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
|
3755 | Styled.defaultProps = tag.defaultProps;
|
3756 | Styled.__emotion_real = Styled;
|
3757 | Styled.__emotion_base = baseTag;
|
3758 | Styled.__emotion_styles = styles;
|
3759 | Styled.__emotion_forwardProp = shouldForwardProp;
|
3760 | Object.defineProperty(Styled, 'toString', {
|
3761 | value: function value() {
|
3762 | if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
|
3763 | return 'NO_COMPONENT_SELECTOR';
|
3764 | }
|
3765 |
|
3766 |
|
3767 | return "." + targetClassName;
|
3768 | }
|
3769 | });
|
3770 |
|
3771 | Styled.withComponent = function (nextTag, nextOptions) {
|
3772 | return createStyled(nextTag, _extends$1({}, options, nextOptions, {
|
3773 | shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
|
3774 | })).apply(void 0, styles);
|
3775 | };
|
3776 |
|
3777 | return Styled;
|
3778 | };
|
3779 | };
|
3780 |
|
3781 | var tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr',
|
3782 | 'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];
|
3783 | var newStyled = createStyled.bind();
|
3784 | tags.forEach(function (tagName) {
|
3785 |
|
3786 | newStyled[tagName] = newStyled(tagName);
|
3787 | });
|
3788 |
|
3789 | function _extends() {
|
3790 | _extends = Object.assign || function (target) {
|
3791 | for (var i = 1; i < arguments.length; i++) {
|
3792 | var source = arguments[i];
|
3793 |
|
3794 | for (var key in source) {
|
3795 | if (Object.prototype.hasOwnProperty.call(source, key)) {
|
3796 | target[key] = source[key];
|
3797 | }
|
3798 | }
|
3799 | }
|
3800 |
|
3801 | return target;
|
3802 | };
|
3803 |
|
3804 | return _extends.apply(this, arguments);
|
3805 | }
|
3806 |
|
3807 | function _assertThisInitialized(self) {
|
3808 | if (self === void 0) {
|
3809 | throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
3810 | }
|
3811 |
|
3812 | return self;
|
3813 | }
|
3814 |
|
3815 | function _setPrototypeOf(o, p) {
|
3816 | _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
3817 | o.__proto__ = p;
|
3818 | return o;
|
3819 | };
|
3820 |
|
3821 | return _setPrototypeOf(o, p);
|
3822 | }
|
3823 |
|
3824 | function _inheritsLoose(subClass, superClass) {
|
3825 | subClass.prototype = Object.create(superClass.prototype);
|
3826 | subClass.prototype.constructor = subClass;
|
3827 |
|
3828 | _setPrototypeOf(subClass, superClass);
|
3829 | }
|
3830 |
|
3831 | function _getPrototypeOf(o) {
|
3832 | _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
|
3833 | return o.__proto__ || Object.getPrototypeOf(o);
|
3834 | };
|
3835 | return _getPrototypeOf(o);
|
3836 | }
|
3837 |
|
3838 | function _isNativeFunction(fn) {
|
3839 | return Function.toString.call(fn).indexOf("[native code]") !== -1;
|
3840 | }
|
3841 |
|
3842 | function _isNativeReflectConstruct() {
|
3843 | if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
3844 | if (Reflect.construct.sham) return false;
|
3845 | if (typeof Proxy === "function") return true;
|
3846 |
|
3847 | try {
|
3848 | Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
3849 | return true;
|
3850 | } catch (e) {
|
3851 | return false;
|
3852 | }
|
3853 | }
|
3854 |
|
3855 | function _construct(Parent, args, Class) {
|
3856 | if (_isNativeReflectConstruct()) {
|
3857 | _construct = Reflect.construct;
|
3858 | } else {
|
3859 | _construct = function _construct(Parent, args, Class) {
|
3860 | var a = [null];
|
3861 | a.push.apply(a, args);
|
3862 | var Constructor = Function.bind.apply(Parent, a);
|
3863 | var instance = new Constructor();
|
3864 | if (Class) _setPrototypeOf(instance, Class.prototype);
|
3865 | return instance;
|
3866 | };
|
3867 | }
|
3868 |
|
3869 | return _construct.apply(null, arguments);
|
3870 | }
|
3871 |
|
3872 | function _wrapNativeSuper(Class) {
|
3873 | var _cache = typeof Map === "function" ? new Map() : undefined;
|
3874 |
|
3875 | _wrapNativeSuper = function _wrapNativeSuper(Class) {
|
3876 | if (Class === null || !_isNativeFunction(Class)) return Class;
|
3877 |
|
3878 | if (typeof Class !== "function") {
|
3879 | throw new TypeError("Super expression must either be null or a function");
|
3880 | }
|
3881 |
|
3882 | if (typeof _cache !== "undefined") {
|
3883 | if (_cache.has(Class)) return _cache.get(Class);
|
3884 |
|
3885 | _cache.set(Class, Wrapper);
|
3886 | }
|
3887 |
|
3888 | function Wrapper() {
|
3889 | return _construct(Class, arguments, _getPrototypeOf(this).constructor);
|
3890 | }
|
3891 |
|
3892 | Wrapper.prototype = Object.create(Class.prototype, {
|
3893 | constructor: {
|
3894 | value: Wrapper,
|
3895 | enumerable: false,
|
3896 | writable: true,
|
3897 | configurable: true
|
3898 | }
|
3899 | });
|
3900 | return _setPrototypeOf(Wrapper, Class);
|
3901 | };
|
3902 |
|
3903 | return _wrapNativeSuper(Class);
|
3904 | }
|
3905 |
|
3906 |
|
3907 |
|
3908 |
|
3909 |
|
3910 |
|
3911 | var ERRORS = {
|
3912 | "1": "Passed invalid arguments to hsl, please pass multiple numbers e.g. hsl(360, 0.75, 0.4) or an object e.g. rgb({ hue: 255, saturation: 0.4, lightness: 0.75 }).\n\n",
|
3913 | "2": "Passed invalid arguments to hsla, please pass multiple numbers e.g. hsla(360, 0.75, 0.4, 0.7) or an object e.g. rgb({ hue: 255, saturation: 0.4, lightness: 0.75, alpha: 0.7 }).\n\n",
|
3914 | "3": "Passed an incorrect argument to a color function, please pass a string representation of a color.\n\n",
|
3915 | "4": "Couldn't generate valid rgb string from %s, it returned %s.\n\n",
|
3916 | "5": "Couldn't parse the color string. Please provide the color as a string in hex, rgb, rgba, hsl or hsla notation.\n\n",
|
3917 | "6": "Passed invalid arguments to rgb, please pass multiple numbers e.g. rgb(255, 205, 100) or an object e.g. rgb({ red: 255, green: 205, blue: 100 }).\n\n",
|
3918 | "7": "Passed invalid arguments to rgba, please pass multiple numbers e.g. rgb(255, 205, 100, 0.75) or an object e.g. rgb({ red: 255, green: 205, blue: 100, alpha: 0.75 }).\n\n",
|
3919 | "8": "Passed invalid argument to toColorString, please pass a RgbColor, RgbaColor, HslColor or HslaColor object.\n\n",
|
3920 | "9": "Please provide a number of steps to the modularScale helper.\n\n",
|
3921 | "10": "Please pass a number or one of the predefined scales to the modularScale helper as the ratio.\n\n",
|
3922 | "11": "Invalid value passed as base to modularScale, expected number or em string but got \"%s\"\n\n",
|
3923 | "12": "Expected a string ending in \"px\" or a number passed as the first argument to %s(), got \"%s\" instead.\n\n",
|
3924 | "13": "Expected a string ending in \"px\" or a number passed as the second argument to %s(), got \"%s\" instead.\n\n",
|
3925 | "14": "Passed invalid pixel value (\"%s\") to %s(), please pass a value like \"12px\" or 12.\n\n",
|
3926 | "15": "Passed invalid base value (\"%s\") to %s(), please pass a value like \"12px\" or 12.\n\n",
|
3927 | "16": "You must provide a template to this method.\n\n",
|
3928 | "17": "You passed an unsupported selector state to this method.\n\n",
|
3929 | "18": "minScreen and maxScreen must be provided as stringified numbers with the same units.\n\n",
|
3930 | "19": "fromSize and toSize must be provided as stringified numbers with the same units.\n\n",
|
3931 | "20": "expects either an array of objects or a single object with the properties prop, fromSize, and toSize.\n\n",
|
3932 | "21": "expects the objects in the first argument array to have the properties `prop`, `fromSize`, and `toSize`.\n\n",
|
3933 | "22": "expects the first argument object to have the properties `prop`, `fromSize`, and `toSize`.\n\n",
|
3934 | "23": "fontFace expects a name of a font-family.\n\n",
|
3935 | "24": "fontFace expects either the path to the font file(s) or a name of a local copy.\n\n",
|
3936 | "25": "fontFace expects localFonts to be an array.\n\n",
|
3937 | "26": "fontFace expects fileFormats to be an array.\n\n",
|
3938 | "27": "radialGradient requries at least 2 color-stops to properly render.\n\n",
|
3939 | "28": "Please supply a filename to retinaImage() as the first argument.\n\n",
|
3940 | "29": "Passed invalid argument to triangle, please pass correct pointingDirection e.g. 'right'.\n\n",
|
3941 | "30": "Passed an invalid value to `height` or `width`. Please provide a pixel based unit.\n\n",
|
3942 | "31": "The animation shorthand only takes 8 arguments. See the specification for more information: http://mdn.io/animation\n\n",
|
3943 | "32": "To pass multiple animations please supply them in arrays, e.g. animation(['rotate', '2s'], ['move', '1s'])\nTo pass a single animation please supply them in simple values, e.g. animation('rotate', '2s')\n\n",
|
3944 | "33": "The animation shorthand arrays can only have 8 elements. See the specification for more information: http://mdn.io/animation\n\n",
|
3945 | "34": "borderRadius expects a radius value as a string or number as the second argument.\n\n",
|
3946 | "35": "borderRadius expects one of \"top\", \"bottom\", \"left\" or \"right\" as the first argument.\n\n",
|
3947 | "36": "Property must be a string value.\n\n",
|
3948 | "37": "Syntax Error at %s.\n\n",
|
3949 | "38": "Formula contains a function that needs parentheses at %s.\n\n",
|
3950 | "39": "Formula is missing closing parenthesis at %s.\n\n",
|
3951 | "40": "Formula has too many closing parentheses at %s.\n\n",
|
3952 | "41": "All values in a formula must have the same unit or be unitless.\n\n",
|
3953 | "42": "Please provide a number of steps to the modularScale helper.\n\n",
|
3954 | "43": "Please pass a number or one of the predefined scales to the modularScale helper as the ratio.\n\n",
|
3955 | "44": "Invalid value passed as base to modularScale, expected number or em/rem string but got %s.\n\n",
|
3956 | "45": "Passed invalid argument to hslToColorString, please pass a HslColor or HslaColor object.\n\n",
|
3957 | "46": "Passed invalid argument to rgbToColorString, please pass a RgbColor or RgbaColor object.\n\n",
|
3958 | "47": "minScreen and maxScreen must be provided as stringified numbers with the same units.\n\n",
|
3959 | "48": "fromSize and toSize must be provided as stringified numbers with the same units.\n\n",
|
3960 | "49": "Expects either an array of objects or a single object with the properties prop, fromSize, and toSize.\n\n",
|
3961 | "50": "Expects the objects in the first argument array to have the properties prop, fromSize, and toSize.\n\n",
|
3962 | "51": "Expects the first argument object to have the properties prop, fromSize, and toSize.\n\n",
|
3963 | "52": "fontFace expects either the path to the font file(s) or a name of a local copy.\n\n",
|
3964 | "53": "fontFace expects localFonts to be an array.\n\n",
|
3965 | "54": "fontFace expects fileFormats to be an array.\n\n",
|
3966 | "55": "fontFace expects a name of a font-family.\n\n",
|
3967 | "56": "linearGradient requries at least 2 color-stops to properly render.\n\n",
|
3968 | "57": "radialGradient requries at least 2 color-stops to properly render.\n\n",
|
3969 | "58": "Please supply a filename to retinaImage() as the first argument.\n\n",
|
3970 | "59": "Passed invalid argument to triangle, please pass correct pointingDirection e.g. 'right'.\n\n",
|
3971 | "60": "Passed an invalid value to `height` or `width`. Please provide a pixel based unit.\n\n",
|
3972 | "61": "Property must be a string value.\n\n",
|
3973 | "62": "borderRadius expects a radius value as a string or number as the second argument.\n\n",
|
3974 | "63": "borderRadius expects one of \"top\", \"bottom\", \"left\" or \"right\" as the first argument.\n\n",
|
3975 | "64": "The animation shorthand only takes 8 arguments. See the specification for more information: http://mdn.io/animation.\n\n",
|
3976 | "65": "To pass multiple animations please supply them in arrays, e.g. animation(['rotate', '2s'], ['move', '1s'])\\nTo pass a single animation please supply them in simple values, e.g. animation('rotate', '2s').\n\n",
|
3977 | "66": "The animation shorthand arrays can only have 8 elements. See the specification for more information: http://mdn.io/animation.\n\n",
|
3978 | "67": "You must provide a template to this method.\n\n",
|
3979 | "68": "You passed an unsupported selector state to this method.\n\n",
|
3980 | "69": "Expected a string ending in \"px\" or a number passed as the first argument to %s(), got %s instead.\n\n",
|
3981 | "70": "Expected a string ending in \"px\" or a number passed as the second argument to %s(), got %s instead.\n\n",
|
3982 | "71": "Passed invalid pixel value %s to %s(), please pass a value like \"12px\" or 12.\n\n",
|
3983 | "72": "Passed invalid base value %s to %s(), please pass a value like \"12px\" or 12.\n\n",
|
3984 | "73": "Please provide a valid CSS variable.\n\n",
|
3985 | "74": "CSS variable not found and no default was provided.\n\n",
|
3986 | "75": "important requires a valid style object, got a %s instead.\n\n",
|
3987 | "76": "fromSize and toSize must be provided as stringified numbers with the same units as minScreen and maxScreen.\n\n",
|
3988 | "77": "remToPx expects a value in \"rem\" but you provided it in \"%s\".\n\n",
|
3989 | "78": "base must be set in \"px\" or \"%\" but you set it in \"%s\".\n"
|
3990 | };
|
3991 |
|
3992 |
|
3993 |
|
3994 |
|
3995 |
|
3996 | function format() {
|
3997 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
3998 | args[_key] = arguments[_key];
|
3999 | }
|
4000 |
|
4001 | var a = args[0];
|
4002 | var b = [];
|
4003 | var c;
|
4004 |
|
4005 | for (c = 1; c < args.length; c += 1) {
|
4006 | b.push(args[c]);
|
4007 | }
|
4008 |
|
4009 | b.forEach(function (d) {
|
4010 | a = a.replace(/%[a-z]/, d);
|
4011 | });
|
4012 | return a;
|
4013 | }
|
4014 |
|
4015 |
|
4016 |
|
4017 |
|
4018 |
|
4019 |
|
4020 |
|
4021 | var PolishedError = function (_Error) {
|
4022 | _inheritsLoose(PolishedError, _Error);
|
4023 |
|
4024 | function PolishedError(code) {
|
4025 | var _this;
|
4026 |
|
4027 | if (process.env.NODE_ENV === 'production') {
|
4028 | _this = _Error.call(this, "An error occurred. See https://github.com/styled-components/polished/blob/main/src/internalHelpers/errors.md#" + code + " for more information.") || this;
|
4029 | } else {
|
4030 | for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
4031 | args[_key2 - 1] = arguments[_key2];
|
4032 | }
|
4033 |
|
4034 | _this = _Error.call(this, format.apply(void 0, [ERRORS[code]].concat(args))) || this;
|
4035 | }
|
4036 |
|
4037 | return _assertThisInitialized(_this);
|
4038 | }
|
4039 |
|
4040 | return PolishedError;
|
4041 | }( _wrapNativeSuper(Error));
|
4042 |
|
4043 | function colorToInt(color) {
|
4044 | return Math.round(color * 255);
|
4045 | }
|
4046 |
|
4047 | function convertToInt(red, green, blue) {
|
4048 | return colorToInt(red) + "," + colorToInt(green) + "," + colorToInt(blue);
|
4049 | }
|
4050 |
|
4051 | function hslToRgb(hue, saturation, lightness, convert) {
|
4052 | if (convert === void 0) {
|
4053 | convert = convertToInt;
|
4054 | }
|
4055 |
|
4056 | if (saturation === 0) {
|
4057 |
|
4058 | return convert(lightness, lightness, lightness);
|
4059 | }
|
4060 |
|
4061 |
|
4062 | var huePrime = (hue % 360 + 360) % 360 / 60;
|
4063 | var chroma = (1 - Math.abs(2 * lightness - 1)) * saturation;
|
4064 | var secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));
|
4065 | var red = 0;
|
4066 | var green = 0;
|
4067 | var blue = 0;
|
4068 |
|
4069 | if (huePrime >= 0 && huePrime < 1) {
|
4070 | red = chroma;
|
4071 | green = secondComponent;
|
4072 | } else if (huePrime >= 1 && huePrime < 2) {
|
4073 | red = secondComponent;
|
4074 | green = chroma;
|
4075 | } else if (huePrime >= 2 && huePrime < 3) {
|
4076 | green = chroma;
|
4077 | blue = secondComponent;
|
4078 | } else if (huePrime >= 3 && huePrime < 4) {
|
4079 | green = secondComponent;
|
4080 | blue = chroma;
|
4081 | } else if (huePrime >= 4 && huePrime < 5) {
|
4082 | red = secondComponent;
|
4083 | blue = chroma;
|
4084 | } else if (huePrime >= 5 && huePrime < 6) {
|
4085 | red = chroma;
|
4086 | blue = secondComponent;
|
4087 | }
|
4088 |
|
4089 | var lightnessModification = lightness - chroma / 2;
|
4090 | var finalRed = red + lightnessModification;
|
4091 | var finalGreen = green + lightnessModification;
|
4092 | var finalBlue = blue + lightnessModification;
|
4093 | return convert(finalRed, finalGreen, finalBlue);
|
4094 | }
|
4095 |
|
4096 | var namedColorMap = {
|
4097 | aliceblue: 'f0f8ff',
|
4098 | antiquewhite: 'faebd7',
|
4099 | aqua: '00ffff',
|
4100 | aquamarine: '7fffd4',
|
4101 | azure: 'f0ffff',
|
4102 | beige: 'f5f5dc',
|
4103 | bisque: 'ffe4c4',
|
4104 | black: '000',
|
4105 | blanchedalmond: 'ffebcd',
|
4106 | blue: '0000ff',
|
4107 | blueviolet: '8a2be2',
|
4108 | brown: 'a52a2a',
|
4109 | burlywood: 'deb887',
|
4110 | cadetblue: '5f9ea0',
|
4111 | chartreuse: '7fff00',
|
4112 | chocolate: 'd2691e',
|
4113 | coral: 'ff7f50',
|
4114 | cornflowerblue: '6495ed',
|
4115 | cornsilk: 'fff8dc',
|
4116 | crimson: 'dc143c',
|
4117 | cyan: '00ffff',
|
4118 | darkblue: '00008b',
|
4119 | darkcyan: '008b8b',
|
4120 | darkgoldenrod: 'b8860b',
|
4121 | darkgray: 'a9a9a9',
|
4122 | darkgreen: '006400',
|
4123 | darkgrey: 'a9a9a9',
|
4124 | darkkhaki: 'bdb76b',
|
4125 | darkmagenta: '8b008b',
|
4126 | darkolivegreen: '556b2f',
|
4127 | darkorange: 'ff8c00',
|
4128 | darkorchid: '9932cc',
|
4129 | darkred: '8b0000',
|
4130 | darksalmon: 'e9967a',
|
4131 | darkseagreen: '8fbc8f',
|
4132 | darkslateblue: '483d8b',
|
4133 | darkslategray: '2f4f4f',
|
4134 | darkslategrey: '2f4f4f',
|
4135 | darkturquoise: '00ced1',
|
4136 | darkviolet: '9400d3',
|
4137 | deeppink: 'ff1493',
|
4138 | deepskyblue: '00bfff',
|
4139 | dimgray: '696969',
|
4140 | dimgrey: '696969',
|
4141 | dodgerblue: '1e90ff',
|
4142 | firebrick: 'b22222',
|
4143 | floralwhite: 'fffaf0',
|
4144 | forestgreen: '228b22',
|
4145 | fuchsia: 'ff00ff',
|
4146 | gainsboro: 'dcdcdc',
|
4147 | ghostwhite: 'f8f8ff',
|
4148 | gold: 'ffd700',
|
4149 | goldenrod: 'daa520',
|
4150 | gray: '808080',
|
4151 | green: '008000',
|
4152 | greenyellow: 'adff2f',
|
4153 | grey: '808080',
|
4154 | honeydew: 'f0fff0',
|
4155 | hotpink: 'ff69b4',
|
4156 | indianred: 'cd5c5c',
|
4157 | indigo: '4b0082',
|
4158 | ivory: 'fffff0',
|
4159 | khaki: 'f0e68c',
|
4160 | lavender: 'e6e6fa',
|
4161 | lavenderblush: 'fff0f5',
|
4162 | lawngreen: '7cfc00',
|
4163 | lemonchiffon: 'fffacd',
|
4164 | lightblue: 'add8e6',
|
4165 | lightcoral: 'f08080',
|
4166 | lightcyan: 'e0ffff',
|
4167 | lightgoldenrodyellow: 'fafad2',
|
4168 | lightgray: 'd3d3d3',
|
4169 | lightgreen: '90ee90',
|
4170 | lightgrey: 'd3d3d3',
|
4171 | lightpink: 'ffb6c1',
|
4172 | lightsalmon: 'ffa07a',
|
4173 | lightseagreen: '20b2aa',
|
4174 | lightskyblue: '87cefa',
|
4175 | lightslategray: '789',
|
4176 | lightslategrey: '789',
|
4177 | lightsteelblue: 'b0c4de',
|
4178 | lightyellow: 'ffffe0',
|
4179 | lime: '0f0',
|
4180 | limegreen: '32cd32',
|
4181 | linen: 'faf0e6',
|
4182 | magenta: 'f0f',
|
4183 | maroon: '800000',
|
4184 | mediumaquamarine: '66cdaa',
|
4185 | mediumblue: '0000cd',
|
4186 | mediumorchid: 'ba55d3',
|
4187 | mediumpurple: '9370db',
|
4188 | mediumseagreen: '3cb371',
|
4189 | mediumslateblue: '7b68ee',
|
4190 | mediumspringgreen: '00fa9a',
|
4191 | mediumturquoise: '48d1cc',
|
4192 | mediumvioletred: 'c71585',
|
4193 | midnightblue: '191970',
|
4194 | mintcream: 'f5fffa',
|
4195 | mistyrose: 'ffe4e1',
|
4196 | moccasin: 'ffe4b5',
|
4197 | navajowhite: 'ffdead',
|
4198 | navy: '000080',
|
4199 | oldlace: 'fdf5e6',
|
4200 | olive: '808000',
|
4201 | olivedrab: '6b8e23',
|
4202 | orange: 'ffa500',
|
4203 | orangered: 'ff4500',
|
4204 | orchid: 'da70d6',
|
4205 | palegoldenrod: 'eee8aa',
|
4206 | palegreen: '98fb98',
|
4207 | paleturquoise: 'afeeee',
|
4208 | palevioletred: 'db7093',
|
4209 | papayawhip: 'ffefd5',
|
4210 | peachpuff: 'ffdab9',
|
4211 | peru: 'cd853f',
|
4212 | pink: 'ffc0cb',
|
4213 | plum: 'dda0dd',
|
4214 | powderblue: 'b0e0e6',
|
4215 | purple: '800080',
|
4216 | rebeccapurple: '639',
|
4217 | red: 'f00',
|
4218 | rosybrown: 'bc8f8f',
|
4219 | royalblue: '4169e1',
|
4220 | saddlebrown: '8b4513',
|
4221 | salmon: 'fa8072',
|
4222 | sandybrown: 'f4a460',
|
4223 | seagreen: '2e8b57',
|
4224 | seashell: 'fff5ee',
|
4225 | sienna: 'a0522d',
|
4226 | silver: 'c0c0c0',
|
4227 | skyblue: '87ceeb',
|
4228 | slateblue: '6a5acd',
|
4229 | slategray: '708090',
|
4230 | slategrey: '708090',
|
4231 | snow: 'fffafa',
|
4232 | springgreen: '00ff7f',
|
4233 | steelblue: '4682b4',
|
4234 | tan: 'd2b48c',
|
4235 | teal: '008080',
|
4236 | thistle: 'd8bfd8',
|
4237 | tomato: 'ff6347',
|
4238 | turquoise: '40e0d0',
|
4239 | violet: 'ee82ee',
|
4240 | wheat: 'f5deb3',
|
4241 | white: 'fff',
|
4242 | whitesmoke: 'f5f5f5',
|
4243 | yellow: 'ff0',
|
4244 | yellowgreen: '9acd32'
|
4245 | };
|
4246 |
|
4247 |
|
4248 |
|
4249 |
|
4250 |
|
4251 | function nameToHex(color) {
|
4252 | if (typeof color !== 'string') return color;
|
4253 | var normalizedColorName = color.toLowerCase();
|
4254 | return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color;
|
4255 | }
|
4256 |
|
4257 | var hexRegex = /^#[a-fA-F0-9]{6}$/;
|
4258 | var hexRgbaRegex = /^#[a-fA-F0-9]{8}$/;
|
4259 | var reducedHexRegex = /^#[a-fA-F0-9]{3}$/;
|
4260 | var reducedRgbaHexRegex = /^#[a-fA-F0-9]{4}$/;
|
4261 | var rgbRegex = /^rgb\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*\)$/i;
|
4262 | var rgbaRegex = /^rgb(?:a)?\(\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,)?\s*(\d{1,3})\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
|
4263 | var hslRegex = /^hsl\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
|
4264 | var hslaRegex = /^hsl(?:a)?\(\s*(\d{0,3}[.]?[0-9]+(?:deg)?)\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,)?\s*(\d{1,3}[.]?[0-9]?)%\s*(?:,|\/)\s*([-+]?\d*[.]?\d+[%]?)\s*\)$/i;
|
4265 |
|
4266 |
|
4267 |
|
4268 |
|
4269 |
|
4270 |
|
4271 |
|
4272 |
|
4273 |
|
4274 |
|
4275 |
|
4276 |
|
4277 | function parseToRgb(color) {
|
4278 | if (typeof color !== 'string') {
|
4279 | throw new PolishedError(3);
|
4280 | }
|
4281 |
|
4282 | var normalizedColor = nameToHex(color);
|
4283 |
|
4284 | if (normalizedColor.match(hexRegex)) {
|
4285 | return {
|
4286 | red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
|
4287 | green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
|
4288 | blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16)
|
4289 | };
|
4290 | }
|
4291 |
|
4292 | if (normalizedColor.match(hexRgbaRegex)) {
|
4293 | var alpha = parseFloat((parseInt("" + normalizedColor[7] + normalizedColor[8], 16) / 255).toFixed(2));
|
4294 | return {
|
4295 | red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
|
4296 | green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
|
4297 | blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16),
|
4298 | alpha: alpha
|
4299 | };
|
4300 | }
|
4301 |
|
4302 | if (normalizedColor.match(reducedHexRegex)) {
|
4303 | return {
|
4304 | red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
|
4305 | green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
|
4306 | blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16)
|
4307 | };
|
4308 | }
|
4309 |
|
4310 | if (normalizedColor.match(reducedRgbaHexRegex)) {
|
4311 | var _alpha = parseFloat((parseInt("" + normalizedColor[4] + normalizedColor[4], 16) / 255).toFixed(2));
|
4312 |
|
4313 | return {
|
4314 | red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
|
4315 | green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
|
4316 | blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16),
|
4317 | alpha: _alpha
|
4318 | };
|
4319 | }
|
4320 |
|
4321 | var rgbMatched = rgbRegex.exec(normalizedColor);
|
4322 |
|
4323 | if (rgbMatched) {
|
4324 | return {
|
4325 | red: parseInt("" + rgbMatched[1], 10),
|
4326 | green: parseInt("" + rgbMatched[2], 10),
|
4327 | blue: parseInt("" + rgbMatched[3], 10)
|
4328 | };
|
4329 | }
|
4330 |
|
4331 | var rgbaMatched = rgbaRegex.exec(normalizedColor.substring(0, 50));
|
4332 |
|
4333 | if (rgbaMatched) {
|
4334 | return {
|
4335 | red: parseInt("" + rgbaMatched[1], 10),
|
4336 | green: parseInt("" + rgbaMatched[2], 10),
|
4337 | blue: parseInt("" + rgbaMatched[3], 10),
|
4338 | alpha: parseFloat("" + rgbaMatched[4]) > 1 ? parseFloat("" + rgbaMatched[4]) / 100 : parseFloat("" + rgbaMatched[4])
|
4339 | };
|
4340 | }
|
4341 |
|
4342 | var hslMatched = hslRegex.exec(normalizedColor);
|
4343 |
|
4344 | if (hslMatched) {
|
4345 | var hue = parseInt("" + hslMatched[1], 10);
|
4346 | var saturation = parseInt("" + hslMatched[2], 10) / 100;
|
4347 | var lightness = parseInt("" + hslMatched[3], 10) / 100;
|
4348 | var rgbColorString = "rgb(" + hslToRgb(hue, saturation, lightness) + ")";
|
4349 | var hslRgbMatched = rgbRegex.exec(rgbColorString);
|
4350 |
|
4351 | if (!hslRgbMatched) {
|
4352 | throw new PolishedError(4, normalizedColor, rgbColorString);
|
4353 | }
|
4354 |
|
4355 | return {
|
4356 | red: parseInt("" + hslRgbMatched[1], 10),
|
4357 | green: parseInt("" + hslRgbMatched[2], 10),
|
4358 | blue: parseInt("" + hslRgbMatched[3], 10)
|
4359 | };
|
4360 | }
|
4361 |
|
4362 | var hslaMatched = hslaRegex.exec(normalizedColor.substring(0, 50));
|
4363 |
|
4364 | if (hslaMatched) {
|
4365 | var _hue = parseInt("" + hslaMatched[1], 10);
|
4366 |
|
4367 | var _saturation = parseInt("" + hslaMatched[2], 10) / 100;
|
4368 |
|
4369 | var _lightness = parseInt("" + hslaMatched[3], 10) / 100;
|
4370 |
|
4371 | var _rgbColorString = "rgb(" + hslToRgb(_hue, _saturation, _lightness) + ")";
|
4372 |
|
4373 | var _hslRgbMatched = rgbRegex.exec(_rgbColorString);
|
4374 |
|
4375 | if (!_hslRgbMatched) {
|
4376 | throw new PolishedError(4, normalizedColor, _rgbColorString);
|
4377 | }
|
4378 |
|
4379 | return {
|
4380 | red: parseInt("" + _hslRgbMatched[1], 10),
|
4381 | green: parseInt("" + _hslRgbMatched[2], 10),
|
4382 | blue: parseInt("" + _hslRgbMatched[3], 10),
|
4383 | alpha: parseFloat("" + hslaMatched[4]) > 1 ? parseFloat("" + hslaMatched[4]) / 100 : parseFloat("" + hslaMatched[4])
|
4384 | };
|
4385 | }
|
4386 |
|
4387 | throw new PolishedError(5);
|
4388 | }
|
4389 |
|
4390 | function rgbToHsl(color) {
|
4391 |
|
4392 | var red = color.red / 255;
|
4393 | var green = color.green / 255;
|
4394 | var blue = color.blue / 255;
|
4395 | var max = Math.max(red, green, blue);
|
4396 | var min = Math.min(red, green, blue);
|
4397 | var lightness = (max + min) / 2;
|
4398 |
|
4399 | if (max === min) {
|
4400 |
|
4401 | if (color.alpha !== undefined) {
|
4402 | return {
|
4403 | hue: 0,
|
4404 | saturation: 0,
|
4405 | lightness: lightness,
|
4406 | alpha: color.alpha
|
4407 | };
|
4408 | } else {
|
4409 | return {
|
4410 | hue: 0,
|
4411 | saturation: 0,
|
4412 | lightness: lightness
|
4413 | };
|
4414 | }
|
4415 | }
|
4416 |
|
4417 | var hue;
|
4418 | var delta = max - min;
|
4419 | var saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);
|
4420 |
|
4421 | switch (max) {
|
4422 | case red:
|
4423 | hue = (green - blue) / delta + (green < blue ? 6 : 0);
|
4424 | break;
|
4425 |
|
4426 | case green:
|
4427 | hue = (blue - red) / delta + 2;
|
4428 | break;
|
4429 |
|
4430 | default:
|
4431 |
|
4432 | hue = (red - green) / delta + 4;
|
4433 | break;
|
4434 | }
|
4435 |
|
4436 | hue *= 60;
|
4437 |
|
4438 | if (color.alpha !== undefined) {
|
4439 | return {
|
4440 | hue: hue,
|
4441 | saturation: saturation,
|
4442 | lightness: lightness,
|
4443 | alpha: color.alpha
|
4444 | };
|
4445 | }
|
4446 |
|
4447 | return {
|
4448 | hue: hue,
|
4449 | saturation: saturation,
|
4450 | lightness: lightness
|
4451 | };
|
4452 | }
|
4453 |
|
4454 |
|
4455 |
|
4456 |
|
4457 |
|
4458 |
|
4459 |
|
4460 |
|
4461 |
|
4462 |
|
4463 |
|
4464 |
|
4465 |
|
4466 | function parseToHsl(color) {
|
4467 |
|
4468 |
|
4469 | return rgbToHsl(parseToRgb(color));
|
4470 | }
|
4471 |
|
4472 |
|
4473 |
|
4474 |
|
4475 |
|
4476 |
|
4477 | var reduceHexValue = function reduceHexValue(value) {
|
4478 | if (value.length === 7 && value[1] === value[2] && value[3] === value[4] && value[5] === value[6]) {
|
4479 | return "#" + value[1] + value[3] + value[5];
|
4480 | }
|
4481 |
|
4482 | return value;
|
4483 | };
|
4484 |
|
4485 | var reduceHexValue$1 = reduceHexValue;
|
4486 |
|
4487 | function numberToHex(value) {
|
4488 | var hex = value.toString(16);
|
4489 | return hex.length === 1 ? "0" + hex : hex;
|
4490 | }
|
4491 |
|
4492 | function colorToHex(color) {
|
4493 | return numberToHex(Math.round(color * 255));
|
4494 | }
|
4495 |
|
4496 | function convertToHex(red, green, blue) {
|
4497 | return reduceHexValue$1("#" + colorToHex(red) + colorToHex(green) + colorToHex(blue));
|
4498 | }
|
4499 |
|
4500 | function hslToHex(hue, saturation, lightness) {
|
4501 | return hslToRgb(hue, saturation, lightness, convertToHex);
|
4502 | }
|
4503 |
|
4504 |
|
4505 |
|
4506 |
|
4507 |
|
4508 |
|
4509 |
|
4510 |
|
4511 |
|
4512 |
|
4513 |
|
4514 |
|
4515 |
|
4516 |
|
4517 |
|
4518 |
|
4519 |
|
4520 |
|
4521 |
|
4522 |
|
4523 |
|
4524 |
|
4525 |
|
4526 |
|
4527 |
|
4528 | function hsl(value, saturation, lightness) {
|
4529 | if (typeof value === 'number' && typeof saturation === 'number' && typeof lightness === 'number') {
|
4530 | return hslToHex(value, saturation, lightness);
|
4531 | } else if (typeof value === 'object' && saturation === undefined && lightness === undefined) {
|
4532 | return hslToHex(value.hue, value.saturation, value.lightness);
|
4533 | }
|
4534 |
|
4535 | throw new PolishedError(1);
|
4536 | }
|
4537 |
|
4538 |
|
4539 |
|
4540 |
|
4541 |
|
4542 |
|
4543 |
|
4544 |
|
4545 |
|
4546 |
|
4547 |
|
4548 |
|
4549 |
|
4550 |
|
4551 |
|
4552 |
|
4553 |
|
4554 |
|
4555 |
|
4556 |
|
4557 |
|
4558 |
|
4559 |
|
4560 |
|
4561 |
|
4562 |
|
4563 |
|
4564 |
|
4565 | function hsla(value, saturation, lightness, alpha) {
|
4566 | if (typeof value === 'number' && typeof saturation === 'number' && typeof lightness === 'number' && typeof alpha === 'number') {
|
4567 | return alpha >= 1 ? hslToHex(value, saturation, lightness) : "rgba(" + hslToRgb(value, saturation, lightness) + "," + alpha + ")";
|
4568 | } else if (typeof value === 'object' && saturation === undefined && lightness === undefined && alpha === undefined) {
|
4569 | return value.alpha >= 1 ? hslToHex(value.hue, value.saturation, value.lightness) : "rgba(" + hslToRgb(value.hue, value.saturation, value.lightness) + "," + value.alpha + ")";
|
4570 | }
|
4571 |
|
4572 | throw new PolishedError(2);
|
4573 | }
|
4574 |
|
4575 |
|
4576 |
|
4577 |
|
4578 |
|
4579 |
|
4580 |
|
4581 |
|
4582 |
|
4583 |
|
4584 |
|
4585 |
|
4586 |
|
4587 |
|
4588 |
|
4589 |
|
4590 |
|
4591 |
|
4592 |
|
4593 |
|
4594 |
|
4595 |
|
4596 |
|
4597 |
|
4598 |
|
4599 | function rgb(value, green, blue) {
|
4600 | if (typeof value === 'number' && typeof green === 'number' && typeof blue === 'number') {
|
4601 | return reduceHexValue$1("#" + numberToHex(value) + numberToHex(green) + numberToHex(blue));
|
4602 | } else if (typeof value === 'object' && green === undefined && blue === undefined) {
|
4603 | return reduceHexValue$1("#" + numberToHex(value.red) + numberToHex(value.green) + numberToHex(value.blue));
|
4604 | }
|
4605 |
|
4606 | throw new PolishedError(6);
|
4607 | }
|
4608 |
|
4609 |
|
4610 |
|
4611 |
|
4612 |
|
4613 |
|
4614 |
|
4615 |
|
4616 |
|
4617 |
|
4618 |
|
4619 |
|
4620 |
|
4621 |
|
4622 |
|
4623 |
|
4624 |
|
4625 |
|
4626 |
|
4627 |
|
4628 |
|
4629 |
|
4630 |
|
4631 |
|
4632 |
|
4633 |
|
4634 |
|
4635 |
|
4636 |
|
4637 |
|
4638 |
|
4639 |
|
4640 |
|
4641 |
|
4642 |
|
4643 |
|
4644 | function rgba(firstValue, secondValue, thirdValue, fourthValue) {
|
4645 | if (typeof firstValue === 'string' && typeof secondValue === 'number') {
|
4646 | var rgbValue = parseToRgb(firstValue);
|
4647 | return "rgba(" + rgbValue.red + "," + rgbValue.green + "," + rgbValue.blue + "," + secondValue + ")";
|
4648 | } else if (typeof firstValue === 'number' && typeof secondValue === 'number' && typeof thirdValue === 'number' && typeof fourthValue === 'number') {
|
4649 | return fourthValue >= 1 ? rgb(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
|
4650 | } else if (typeof firstValue === 'object' && secondValue === undefined && thirdValue === undefined && fourthValue === undefined) {
|
4651 | return firstValue.alpha >= 1 ? rgb(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
|
4652 | }
|
4653 |
|
4654 | throw new PolishedError(7);
|
4655 | }
|
4656 |
|
4657 | var isRgb = function isRgb(color) {
|
4658 | return typeof color.red === 'number' && typeof color.green === 'number' && typeof color.blue === 'number' && (typeof color.alpha !== 'number' || typeof color.alpha === 'undefined');
|
4659 | };
|
4660 |
|
4661 | var isRgba = function isRgba(color) {
|
4662 | return typeof color.red === 'number' && typeof color.green === 'number' && typeof color.blue === 'number' && typeof color.alpha === 'number';
|
4663 | };
|
4664 |
|
4665 | var isHsl = function isHsl(color) {
|
4666 | return typeof color.hue === 'number' && typeof color.saturation === 'number' && typeof color.lightness === 'number' && (typeof color.alpha !== 'number' || typeof color.alpha === 'undefined');
|
4667 | };
|
4668 |
|
4669 | var isHsla = function isHsla(color) {
|
4670 | return typeof color.hue === 'number' && typeof color.saturation === 'number' && typeof color.lightness === 'number' && typeof color.alpha === 'number';
|
4671 | };
|
4672 |
|
4673 |
|
4674 |
|
4675 |
|
4676 |
|
4677 |
|
4678 |
|
4679 |
|
4680 |
|
4681 |
|
4682 |
|
4683 |
|
4684 |
|
4685 |
|
4686 |
|
4687 |
|
4688 |
|
4689 |
|
4690 |
|
4691 |
|
4692 |
|
4693 |
|
4694 |
|
4695 |
|
4696 |
|
4697 |
|
4698 |
|
4699 |
|
4700 |
|
4701 |
|
4702 |
|
4703 |
|
4704 | function toColorString(color) {
|
4705 | if (typeof color !== 'object') throw new PolishedError(8);
|
4706 | if (isRgba(color)) return rgba(color);
|
4707 | if (isRgb(color)) return rgb(color);
|
4708 | if (isHsla(color)) return hsla(color);
|
4709 | if (isHsl(color)) return hsl(color);
|
4710 | throw new PolishedError(8);
|
4711 | }
|
4712 |
|
4713 |
|
4714 |
|
4715 |
|
4716 |
|
4717 | function curried(f, length, acc) {
|
4718 | return function fn() {
|
4719 |
|
4720 | var combined = acc.concat(Array.prototype.slice.call(arguments));
|
4721 | return combined.length >= length ? f.apply(this, combined) : curried(f, length, combined);
|
4722 | };
|
4723 | }
|
4724 |
|
4725 |
|
4726 | function curry(f) {
|
4727 |
|
4728 | return curried(f, f.length, []);
|
4729 | }
|
4730 |
|
4731 | function guard(lowerBoundary, upperBoundary, value) {
|
4732 | return Math.max(lowerBoundary, Math.min(upperBoundary, value));
|
4733 | }
|
4734 |
|
4735 |
|
4736 |
|
4737 |
|
4738 |
|
4739 |
|
4740 |
|
4741 |
|
4742 |
|
4743 |
|
4744 |
|
4745 |
|
4746 |
|
4747 |
|
4748 |
|
4749 |
|
4750 |
|
4751 |
|
4752 |
|
4753 |
|
4754 |
|
4755 |
|
4756 |
|
4757 |
|
4758 |
|
4759 | function darken(amount, color) {
|
4760 | if (color === 'transparent') return color;
|
4761 | var hslColor = parseToHsl(color);
|
4762 | return toColorString(_extends({}, hslColor, {
|
4763 | lightness: guard(0, 1, hslColor.lightness - parseFloat(amount))
|
4764 | }));
|
4765 | }
|
4766 |
|
4767 |
|
4768 | var curriedDarken = curry
|
4769 |
|
4770 | (darken);
|
4771 | var curriedDarken$1 = curriedDarken;
|
4772 |
|
4773 |
|
4774 |
|
4775 |
|
4776 |
|
4777 |
|
4778 |
|
4779 |
|
4780 |
|
4781 |
|
4782 |
|
4783 |
|
4784 |
|
4785 |
|
4786 |
|
4787 |
|
4788 |
|
4789 |
|
4790 |
|
4791 |
|
4792 |
|
4793 |
|
4794 |
|
4795 |
|
4796 | function lighten(amount, color) {
|
4797 | if (color === 'transparent') return color;
|
4798 | var hslColor = parseToHsl(color);
|
4799 | return toColorString(_extends({}, hslColor, {
|
4800 | lightness: guard(0, 1, hslColor.lightness + parseFloat(amount))
|
4801 | }));
|
4802 | }
|
4803 |
|
4804 |
|
4805 | var curriedLighten = curry
|
4806 |
|
4807 | (lighten);
|
4808 | var curriedLighten$1 = curriedLighten;
|
4809 |
|
4810 |
|
4811 |
|
4812 |
|
4813 |
|
4814 |
|
4815 |
|
4816 |
|
4817 |
|
4818 |
|
4819 |
|
4820 |
|
4821 |
|
4822 |
|
4823 |
|
4824 |
|
4825 |
|
4826 |
|
4827 |
|
4828 |
|
4829 |
|
4830 |
|
4831 |
|
4832 |
|
4833 |
|
4834 |
|
4835 |
|
4836 |
|
4837 | function opacify(amount, color) {
|
4838 | if (color === 'transparent') return color;
|
4839 | var parsedColor = parseToRgb(color);
|
4840 | var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;
|
4841 |
|
4842 | var colorWithAlpha = _extends({}, parsedColor, {
|
4843 | alpha: guard(0, 1, (alpha * 100 + parseFloat(amount) * 100) / 100)
|
4844 | });
|
4845 |
|
4846 | return rgba(colorWithAlpha);
|
4847 | }
|
4848 |
|
4849 |
|
4850 | var curriedOpacify = curry
|
4851 |
|
4852 | (opacify);
|
4853 | var curriedOpacify$1 = curriedOpacify;
|
4854 |
|
4855 |
|
4856 |
|
4857 |
|
4858 |
|
4859 |
|
4860 |
|
4861 |
|
4862 |
|
4863 |
|
4864 |
|
4865 |
|
4866 |
|
4867 |
|
4868 |
|
4869 |
|
4870 |
|
4871 |
|
4872 |
|
4873 |
|
4874 |
|
4875 |
|
4876 |
|
4877 |
|
4878 |
|
4879 |
|
4880 |
|
4881 |
|
4882 | function transparentize(amount, color) {
|
4883 | if (color === 'transparent') return color;
|
4884 | var parsedColor = parseToRgb(color);
|
4885 | var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;
|
4886 |
|
4887 | var colorWithAlpha = _extends({}, parsedColor, {
|
4888 | alpha: guard(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)
|
4889 | });
|
4890 |
|
4891 | return rgba(colorWithAlpha);
|
4892 | }
|
4893 |
|
4894 |
|
4895 | var curriedTransparentize = curry
|
4896 |
|
4897 | (transparentize);
|
4898 | var curriedTransparentize$1 = curriedTransparentize;
|
4899 | const color = {
|
4900 |
|
4901 | primary: '#FF4785',
|
4902 | secondary: '#1EA7FD',
|
4903 | tertiary: '#FAFBFC',
|
4904 | ancillary: '#22a699',
|
4905 |
|
4906 | orange: '#FC521F',
|
4907 | gold: '#FFAE00',
|
4908 | green: '#66BF3C',
|
4909 | seafoam: '#37D5D3',
|
4910 | purple: '#6F2CAC',
|
4911 | ultraviolet: '#2A0481',
|
4912 |
|
4913 | lightest: '#FFFFFF',
|
4914 | lighter: '#F8F8F8',
|
4915 | light: '#F3F3F3',
|
4916 | mediumlight: '#EEEEEE',
|
4917 | medium: '#DDDDDD',
|
4918 | mediumdark: '#999999',
|
4919 | dark: '#666666',
|
4920 | darker: '#444444',
|
4921 | darkest: '#333333',
|
4922 |
|
4923 | border: 'rgba(0,0,0,.1)',
|
4924 |
|
4925 | positive: '#66BF3C',
|
4926 | negative: '#FF4400',
|
4927 | warning: '#E69D00',
|
4928 | critical: '#FFFFFF',
|
4929 | defaultText: '#333333',
|
4930 | inverseText: '#FFFFFF'
|
4931 | };
|
4932 | const background = {
|
4933 | app: '#F6F9FC',
|
4934 | bar: '#FFFFFF',
|
4935 | content: color.lightest,
|
4936 | gridCellSize: 10,
|
4937 | hoverable: curriedTransparentize$1(0.93, color.secondary),
|
4938 |
|
4939 | positive: '#E1FFD4',
|
4940 | negative: '#FEDED2',
|
4941 | warning: '#FFF5CF',
|
4942 | critical: '#FF4400'
|
4943 | };
|
4944 | const typography = {
|
4945 | fonts: {
|
4946 | base: ['"Nunito Sans"', '-apple-system', '".SFNSText-Regular"', '"San Francisco"', 'BlinkMacSystemFont', '"Segoe UI"', '"Helvetica Neue"', 'Helvetica', 'Arial', 'sans-serif'].join(', '),
|
4947 | mono: ['ui-monospace', 'Menlo', 'Monaco', '"Roboto Mono"', '"Oxygen Mono"', '"Ubuntu Monospace"', '"Source Code Pro"', '"Droid Sans Mono"', '"Courier New"', 'monospace'].join(', ')
|
4948 | },
|
4949 | weight: {
|
4950 | regular: 400,
|
4951 | bold: 700,
|
4952 | black: 900
|
4953 | },
|
4954 | size: {
|
4955 | s1: 12,
|
4956 | s2: 14,
|
4957 | s3: 16,
|
4958 | m1: 20,
|
4959 | m2: 24,
|
4960 | m3: 28,
|
4961 | l1: 32,
|
4962 | l2: 40,
|
4963 | l3: 48,
|
4964 | code: 90
|
4965 | }
|
4966 | };
|
4967 | const createReset = memoize$1(1)(({
|
4968 | typography
|
4969 | }) => ({
|
4970 | body: {
|
4971 | fontFamily: typography.fonts.base,
|
4972 | fontSize: typography.size.s3,
|
4973 | margin: 0,
|
4974 | WebkitFontSmoothing: 'antialiased',
|
4975 | MozOsxFontSmoothing: 'grayscale',
|
4976 | WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',
|
4977 | WebkitOverflowScrolling: 'touch'
|
4978 | },
|
4979 | '*': {
|
4980 | boxSizing: 'border-box'
|
4981 | },
|
4982 | 'h1, h2, h3, h4, h5, h6': {
|
4983 | fontWeight: typography.weight.regular,
|
4984 | margin: 0,
|
4985 | padding: 0
|
4986 | },
|
4987 | 'button, input, textarea, select': {
|
4988 | fontFamily: 'inherit',
|
4989 | fontSize: 'inherit',
|
4990 | boxSizing: 'border-box'
|
4991 | },
|
4992 | sub: {
|
4993 | fontSize: '0.8em',
|
4994 | bottom: '-0.2em'
|
4995 | },
|
4996 | sup: {
|
4997 | fontSize: '0.8em',
|
4998 | top: '-0.2em'
|
4999 | },
|
5000 | 'b, strong': {
|
5001 | fontWeight: typography.weight.bold
|
5002 | },
|
5003 | hr: {
|
5004 | border: 'none',
|
5005 | borderTop: '1px solid silver',
|
5006 | clear: 'both',
|
5007 | marginBottom: '1.25rem'
|
5008 | },
|
5009 | code: {
|
5010 | fontFamily: typography.fonts.mono,
|
5011 | WebkitFontSmoothing: 'antialiased',
|
5012 | MozOsxFontSmoothing: 'grayscale',
|
5013 | display: 'inline-block',
|
5014 | paddingLeft: 2,
|
5015 | paddingRight: 2,
|
5016 | verticalAlign: 'baseline',
|
5017 | color: 'inherit'
|
5018 | },
|
5019 | pre: {
|
5020 | fontFamily: typography.fonts.mono,
|
5021 | WebkitFontSmoothing: 'antialiased',
|
5022 | MozOsxFontSmoothing: 'grayscale',
|
5023 | lineHeight: '18px',
|
5024 | padding: '11px 1rem',
|
5025 | whiteSpace: 'pre-wrap',
|
5026 | color: 'inherit',
|
5027 | borderRadius: 3,
|
5028 | margin: '1rem 0'
|
5029 | }
|
5030 | }));
|
5031 | const createGlobal = memoize$1(1)(({
|
5032 | color,
|
5033 | background,
|
5034 | typography
|
5035 | }) => {
|
5036 | const resetStyles = createReset({
|
5037 | typography
|
5038 | });
|
5039 | return Object.assign(Object.assign({}, resetStyles), {
|
5040 | body: Object.assign(Object.assign({}, resetStyles.body), {
|
5041 | color: color.defaultText,
|
5042 | background: background.app,
|
5043 | overflow: 'hidden'
|
5044 | }),
|
5045 | hr: Object.assign(Object.assign({}, resetStyles.hr), {
|
5046 | borderTop: `1px solid ${color.border}`
|
5047 | })
|
5048 | });
|
5049 | });
|
5050 | const theme$1 = {
|
5051 | base: 'light',
|
5052 |
|
5053 | colorPrimary: '#FF4785',
|
5054 | colorSecondary: '#1EA7FD',
|
5055 |
|
5056 | appBg: background.app,
|
5057 | appContentBg: color.lightest,
|
5058 | appBorderColor: color.border,
|
5059 | appBorderRadius: 4,
|
5060 |
|
5061 | fontBase: typography.fonts.base,
|
5062 | fontCode: typography.fonts.mono,
|
5063 |
|
5064 | textColor: color.darkest,
|
5065 | textInverseColor: color.lightest,
|
5066 | textMutedColor: color.dark,
|
5067 |
|
5068 | barTextColor: color.mediumdark,
|
5069 | barSelectedColor: color.secondary,
|
5070 | barBg: color.lightest,
|
5071 |
|
5072 | inputBg: color.lightest,
|
5073 | inputBorder: color.border,
|
5074 | inputTextColor: color.darkest,
|
5075 | inputBorderRadius: 4
|
5076 | };
|
5077 | const theme = {
|
5078 | base: 'dark',
|
5079 |
|
5080 | colorPrimary: '#FF4785',
|
5081 | colorSecondary: '#1EA7FD',
|
5082 |
|
5083 | appBg: '#2f2f2f',
|
5084 | appContentBg: color.darkest,
|
5085 | appBorderColor: 'rgba(255,255,255,.1)',
|
5086 | appBorderRadius: 4,
|
5087 |
|
5088 | fontBase: typography.fonts.base,
|
5089 | fontCode: typography.fonts.mono,
|
5090 |
|
5091 | textColor: color.lightest,
|
5092 | textInverseColor: color.darkest,
|
5093 | textMutedColor: color.mediumdark,
|
5094 |
|
5095 | barTextColor: '#999999',
|
5096 | barSelectedColor: color.secondary,
|
5097 | barBg: color.darkest,
|
5098 |
|
5099 | inputBg: '#3f3f3f',
|
5100 | inputBorder: 'rgba(0,0,0,.3)',
|
5101 | inputTextColor: color.lightest,
|
5102 | inputBorderRadius: 4
|
5103 | };
|
5104 | var win;
|
5105 |
|
5106 | if (typeof window !== "undefined") {
|
5107 | win = window;
|
5108 | } else if (typeof commonjsGlobal !== "undefined") {
|
5109 | win = commonjsGlobal;
|
5110 | } else if (typeof self !== "undefined") {
|
5111 | win = self;
|
5112 | } else {
|
5113 | win = {};
|
5114 | }
|
5115 |
|
5116 | var window_1 = win;
|
5117 | const {
|
5118 | window: globalWindow
|
5119 | } = window_1;
|
5120 |
|
5121 | const mkColor = color => ({
|
5122 | color
|
5123 | });
|
5124 |
|
5125 |
|
5126 |
|
5127 | const isColorString = color => {
|
5128 | if (typeof color !== 'string') {
|
5129 | logger.warn(`Color passed to theme object should be a string. Instead ` + `${color}(${typeof color}) was passed.`);
|
5130 | return false;
|
5131 | }
|
5132 |
|
5133 | return true;
|
5134 | };
|
5135 |
|
5136 |
|
5137 |
|
5138 |
|
5139 |
|
5140 | const isValidColorForPolished = color => {
|
5141 | return !/(gradient|var|calc)/.test(color);
|
5142 | };
|
5143 |
|
5144 | const applyPolished = (type, color) => {
|
5145 | if (type === 'darken') {
|
5146 | return rgba(`${curriedDarken$1(1, color)}`, 0.95);
|
5147 | }
|
5148 |
|
5149 | if (type === 'lighten') {
|
5150 | return rgba(`${curriedLighten$1(1, color)}`, 0.95);
|
5151 | }
|
5152 |
|
5153 | return color;
|
5154 | };
|
5155 |
|
5156 | const colorFactory = type => color => {
|
5157 | if (!isColorString(color)) {
|
5158 | return color;
|
5159 | }
|
5160 |
|
5161 | if (!isValidColorForPolished(color)) {
|
5162 | return color;
|
5163 | }
|
5164 |
|
5165 |
|
5166 | try {
|
5167 | return applyPolished(type, color);
|
5168 | } catch (error) {
|
5169 | return color;
|
5170 | }
|
5171 | };
|
5172 |
|
5173 | const lightenColor = colorFactory('lighten');
|
5174 | const darkenColor = colorFactory('darken');
|
5175 |
|
5176 |
|
5177 | const getPreferredColorScheme = () => {
|
5178 | if (!globalWindow || !globalWindow.matchMedia) return 'light';
|
5179 | const isDarkThemePreferred = globalWindow.matchMedia('(prefers-color-scheme: dark)').matches;
|
5180 | if (isDarkThemePreferred) return 'dark';
|
5181 | return 'light';
|
5182 | };
|
5183 |
|
5184 |
|
5185 | const themes = {
|
5186 | light: theme$1,
|
5187 | dark: theme,
|
5188 | normal: theme$1
|
5189 | };
|
5190 | const preferredColorScheme = getPreferredColorScheme();
|
5191 |
|
5192 | const create$1 = (vars = {
|
5193 | base: preferredColorScheme
|
5194 | }, rest) => {
|
5195 | const inherit = Object.assign(Object.assign(Object.assign(Object.assign({}, themes[preferredColorScheme]), themes[vars.base] || {}), vars), {
|
5196 | base: themes[vars.base] ? vars.base : preferredColorScheme
|
5197 | });
|
5198 | return Object.assign(Object.assign(Object.assign({}, rest), inherit), {
|
5199 | barSelectedColor: vars.barSelectedColor || inherit.colorSecondary
|
5200 | });
|
5201 | };
|
5202 |
|
5203 |
|
5204 |
|
5205 |
|
5206 |
|
5207 |
|
5208 |
|
5209 |
|
5210 |
|
5211 |
|
5212 |
|
5213 |
|
5214 |
|
5215 |
|
5216 |
|
5217 |
|
5218 | function __rest(s, e) {
|
5219 | var t = {};
|
5220 |
|
5221 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
5222 |
|
5223 | if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
5224 | if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
5225 | }
|
5226 | return t;
|
5227 | }
|
5228 |
|
5229 | const easing = {
|
5230 | rubber: 'cubic-bezier(0.175, 0.885, 0.335, 1.05)'
|
5231 | };
|
5232 | const rotate360 = keyframes`
|
5233 | from {
|
5234 | transform: rotate(0deg);
|
5235 | }
|
5236 | to {
|
5237 | transform: rotate(360deg);
|
5238 | }
|
5239 | `;
|
5240 | const glow = keyframes`
|
5241 | 0%, 100% { opacity: 1; }
|
5242 | 50% { opacity: .4; }
|
5243 | `;
|
5244 | const float = keyframes`
|
5245 | 0% { transform: translateY(1px); }
|
5246 | 25% { transform: translateY(0px); }
|
5247 | 50% { transform: translateY(-3px); }
|
5248 | 100% { transform: translateY(1px); }
|
5249 | `;
|
5250 | const jiggle = keyframes`
|
5251 | 0%, 100% { transform:translate3d(0,0,0); }
|
5252 | 12.5%, 62.5% { transform:translate3d(-4px,0,0); }
|
5253 | 37.5%, 87.5% { transform: translate3d(4px,0,0); }
|
5254 | `;
|
5255 | const inlineGlow = css`
|
5256 | animation: ${glow} 1.5s ease-in-out infinite;
|
5257 | color: transparent;
|
5258 | cursor: progress;
|
5259 | `;
|
5260 |
|
5261 | const hoverable = css`
|
5262 | transition: all 150ms ease-out;
|
5263 | transform: translate3d(0, 0, 0);
|
5264 |
|
5265 | &:hover {
|
5266 | transform: translate3d(0, -2px, 0);
|
5267 | }
|
5268 |
|
5269 | &:active {
|
5270 | transform: translate3d(0, 0, 0);
|
5271 | }
|
5272 | `;
|
5273 | const animation = {
|
5274 | rotate360,
|
5275 | glow,
|
5276 | float,
|
5277 | jiggle,
|
5278 | inlineGlow,
|
5279 | hoverable
|
5280 | };
|
5281 | const chromeDark = {
|
5282 | BASE_FONT_FAMILY: 'Menlo, monospace',
|
5283 | BASE_FONT_SIZE: '11px',
|
5284 | BASE_LINE_HEIGHT: 1.2,
|
5285 | BASE_BACKGROUND_COLOR: 'rgb(36, 36, 36)',
|
5286 | BASE_COLOR: 'rgb(213, 213, 213)',
|
5287 | OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
|
5288 | OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
|
5289 | OBJECT_NAME_COLOR: 'rgb(227, 110, 236)',
|
5290 | OBJECT_VALUE_NULL_COLOR: 'rgb(127, 127, 127)',
|
5291 | OBJECT_VALUE_UNDEFINED_COLOR: 'rgb(127, 127, 127)',
|
5292 | OBJECT_VALUE_REGEXP_COLOR: 'rgb(233, 63, 59)',
|
5293 | OBJECT_VALUE_STRING_COLOR: 'rgb(233, 63, 59)',
|
5294 | OBJECT_VALUE_SYMBOL_COLOR: 'rgb(233, 63, 59)',
|
5295 | OBJECT_VALUE_NUMBER_COLOR: 'hsl(252, 100%, 75%)',
|
5296 | OBJECT_VALUE_BOOLEAN_COLOR: 'hsl(252, 100%, 75%)',
|
5297 | OBJECT_VALUE_FUNCTION_PREFIX_COLOR: 'rgb(85, 106, 242)',
|
5298 | HTML_TAG_COLOR: 'rgb(93, 176, 215)',
|
5299 | HTML_TAGNAME_COLOR: 'rgb(93, 176, 215)',
|
5300 | HTML_TAGNAME_TEXT_TRANSFORM: 'lowercase',
|
5301 | HTML_ATTRIBUTE_NAME_COLOR: 'rgb(155, 187, 220)',
|
5302 | HTML_ATTRIBUTE_VALUE_COLOR: 'rgb(242, 151, 102)',
|
5303 | HTML_COMMENT_COLOR: 'rgb(137, 137, 137)',
|
5304 | HTML_DOCTYPE_COLOR: 'rgb(192, 192, 192)',
|
5305 | ARROW_COLOR: 'rgb(145, 145, 145)',
|
5306 | ARROW_MARGIN_RIGHT: 3,
|
5307 | ARROW_FONT_SIZE: 12,
|
5308 | ARROW_ANIMATION_DURATION: '0',
|
5309 | TREENODE_FONT_FAMILY: 'Menlo, monospace',
|
5310 | TREENODE_FONT_SIZE: '11px',
|
5311 | TREENODE_LINE_HEIGHT: 1.2,
|
5312 | TREENODE_PADDING_LEFT: 12,
|
5313 | TABLE_BORDER_COLOR: 'rgb(85, 85, 85)',
|
5314 | TABLE_TH_BACKGROUND_COLOR: 'rgb(44, 44, 44)',
|
5315 | TABLE_TH_HOVER_COLOR: 'rgb(48, 48, 48)',
|
5316 | TABLE_SORT_ICON_COLOR: 'black',
|
5317 | TABLE_DATA_BACKGROUND_IMAGE: 'linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 50%, rgba(51, 139, 255, 0.0980392) 50%, rgba(51, 139, 255, 0.0980392))',
|
5318 | TABLE_DATA_BACKGROUND_SIZE: '128px 32px'
|
5319 | };
|
5320 | const chromeLight = {
|
5321 | BASE_FONT_FAMILY: 'Menlo, monospace',
|
5322 | BASE_FONT_SIZE: '11px',
|
5323 | BASE_LINE_HEIGHT: 1.2,
|
5324 | BASE_BACKGROUND_COLOR: 'white',
|
5325 | BASE_COLOR: 'black',
|
5326 | OBJECT_PREVIEW_ARRAY_MAX_PROPERTIES: 10,
|
5327 | OBJECT_PREVIEW_OBJECT_MAX_PROPERTIES: 5,
|
5328 | OBJECT_NAME_COLOR: 'rgb(136, 19, 145)',
|
5329 | OBJECT_VALUE_NULL_COLOR: 'rgb(128, 128, 128)',
|
5330 | OBJECT_VALUE_UNDEFINED_COLOR: 'rgb(128, 128, 128)',
|
5331 | OBJECT_VALUE_REGEXP_COLOR: 'rgb(196, 26, 22)',
|
5332 | OBJECT_VALUE_STRING_COLOR: 'rgb(196, 26, 22)',
|
5333 | OBJECT_VALUE_SYMBOL_COLOR: 'rgb(196, 26, 22)',
|
5334 | OBJECT_VALUE_NUMBER_COLOR: 'rgb(28, 0, 207)',
|
5335 | OBJECT_VALUE_BOOLEAN_COLOR: 'rgb(28, 0, 207)',
|
5336 | OBJECT_VALUE_FUNCTION_PREFIX_COLOR: 'rgb(13, 34, 170)',
|
5337 | HTML_TAG_COLOR: 'rgb(168, 148, 166)',
|
5338 | HTML_TAGNAME_COLOR: 'rgb(136, 18, 128)',
|
5339 | HTML_TAGNAME_TEXT_TRANSFORM: 'lowercase',
|
5340 | HTML_ATTRIBUTE_NAME_COLOR: 'rgb(153, 69, 0)',
|
5341 | HTML_ATTRIBUTE_VALUE_COLOR: 'rgb(26, 26, 166)',
|
5342 | HTML_COMMENT_COLOR: 'rgb(35, 110, 37)',
|
5343 | HTML_DOCTYPE_COLOR: 'rgb(192, 192, 192)',
|
5344 | ARROW_COLOR: '#6e6e6e',
|
5345 | ARROW_MARGIN_RIGHT: 3,
|
5346 | ARROW_FONT_SIZE: 12,
|
5347 | ARROW_ANIMATION_DURATION: '0',
|
5348 | TREENODE_FONT_FAMILY: 'Menlo, monospace',
|
5349 | TREENODE_FONT_SIZE: '11px',
|
5350 | TREENODE_LINE_HEIGHT: 1.2,
|
5351 | TREENODE_PADDING_LEFT: 12,
|
5352 | TABLE_BORDER_COLOR: '#aaa',
|
5353 | TABLE_TH_BACKGROUND_COLOR: '#eee',
|
5354 | TABLE_TH_HOVER_COLOR: 'hsla(0, 0%, 90%, 1)',
|
5355 | TABLE_SORT_ICON_COLOR: '#6e6e6e',
|
5356 | TABLE_DATA_BACKGROUND_IMAGE: 'linear-gradient(to bottom, white, white 50%, rgb(234, 243, 255) 50%, rgb(234, 243, 255))',
|
5357 | TABLE_DATA_BACKGROUND_SIZE: '128px 32px'
|
5358 | };
|
5359 |
|
5360 | const convertColors = colors => Object.entries(colors).reduce((acc, [k, v]) => Object.assign(Object.assign({}, acc), {
|
5361 | [k]: mkColor(v)
|
5362 | }), {});
|
5363 |
|
5364 | const create = ({
|
5365 | colors,
|
5366 | mono
|
5367 | }) => {
|
5368 | const colorsObjs = convertColors(colors);
|
5369 | return {
|
5370 | token: {
|
5371 | fontFamily: mono,
|
5372 | WebkitFontSmoothing: 'antialiased',
|
5373 | '&.tag': colorsObjs.red3,
|
5374 | '&.comment': Object.assign(Object.assign({}, colorsObjs.green1), {
|
5375 | fontStyle: 'italic'
|
5376 | }),
|
5377 | '&.prolog': Object.assign(Object.assign({}, colorsObjs.green1), {
|
5378 | fontStyle: 'italic'
|
5379 | }),
|
5380 | '&.doctype': Object.assign(Object.assign({}, colorsObjs.green1), {
|
5381 | fontStyle: 'italic'
|
5382 | }),
|
5383 | '&.cdata': Object.assign(Object.assign({}, colorsObjs.green1), {
|
5384 | fontStyle: 'italic'
|
5385 | }),
|
5386 | '&.string': colorsObjs.red1,
|
5387 | '&.url': colorsObjs.cyan1,
|
5388 | '&.symbol': colorsObjs.cyan1,
|
5389 | '&.number': colorsObjs.cyan1,
|
5390 | '&.boolean': colorsObjs.cyan1,
|
5391 | '&.variable': colorsObjs.cyan1,
|
5392 | '&.constant': colorsObjs.cyan1,
|
5393 | '&.inserted': colorsObjs.cyan1,
|
5394 | '&.atrule': colorsObjs.blue1,
|
5395 | '&.keyword': colorsObjs.blue1,
|
5396 | '&.attr-value': colorsObjs.blue1,
|
5397 | '&.punctuation': colorsObjs.gray1,
|
5398 | '&.operator': colorsObjs.gray1,
|
5399 | '&.function': colorsObjs.gray1,
|
5400 | '&.deleted': colorsObjs.red2,
|
5401 | '&.important': {
|
5402 | fontWeight: 'bold'
|
5403 | },
|
5404 | '&.bold': {
|
5405 | fontWeight: 'bold'
|
5406 | },
|
5407 | '&.italic': {
|
5408 | fontStyle: 'italic'
|
5409 | },
|
5410 | '&.class-name': colorsObjs.cyan2,
|
5411 | '&.selector': colorsObjs.red3,
|
5412 | '&.attr-name': colorsObjs.red4,
|
5413 | '&.property': colorsObjs.red4,
|
5414 | '&.regex': colorsObjs.red4,
|
5415 | '&.entity': colorsObjs.red4,
|
5416 | '&.directive.tag .tag': Object.assign({
|
5417 | background: '#ffff00'
|
5418 | }, colorsObjs.gray1)
|
5419 | },
|
5420 | 'language-json .token.boolean': colorsObjs.blue1,
|
5421 | 'language-json .token.number': colorsObjs.blue1,
|
5422 | 'language-json .token.property': colorsObjs.cyan2,
|
5423 | namespace: {
|
5424 | opacity: 0.7
|
5425 | }
|
5426 | };
|
5427 | };
|
5428 |
|
5429 | const lightSyntaxColors = {
|
5430 | green1: '#008000',
|
5431 | red1: '#A31515',
|
5432 | red2: '#9a050f',
|
5433 | red3: '#800000',
|
5434 | red4: '#ff0000',
|
5435 | gray1: '#393A34',
|
5436 | cyan1: '#36acaa',
|
5437 | cyan2: '#2B91AF',
|
5438 | blue1: '#0000ff',
|
5439 | blue2: '#00009f'
|
5440 | };
|
5441 | const darkSyntaxColors = {
|
5442 | green1: '#7C7C7C',
|
5443 | red1: '#92C379',
|
5444 | red2: '#9a050f',
|
5445 | red3: '#A8FF60',
|
5446 | red4: '#96CBFE',
|
5447 | gray1: '#EDEDED',
|
5448 | cyan1: '#C6C5FE',
|
5449 | cyan2: '#FFFFB6',
|
5450 | blue1: '#B474DD',
|
5451 | blue2: '#00009f'
|
5452 | };
|
5453 |
|
5454 | const createColors = vars => ({
|
5455 |
|
5456 | primary: vars.colorPrimary,
|
5457 | secondary: vars.colorSecondary,
|
5458 | tertiary: color.tertiary,
|
5459 | ancillary: color.ancillary,
|
5460 |
|
5461 | orange: color.orange,
|
5462 | gold: color.gold,
|
5463 | green: color.green,
|
5464 | seafoam: color.seafoam,
|
5465 | purple: color.purple,
|
5466 | ultraviolet: color.ultraviolet,
|
5467 |
|
5468 | lightest: color.lightest,
|
5469 | lighter: color.lighter,
|
5470 | light: color.light,
|
5471 | mediumlight: color.mediumlight,
|
5472 | medium: color.medium,
|
5473 | mediumdark: color.mediumdark,
|
5474 | dark: color.dark,
|
5475 | darker: color.darker,
|
5476 | darkest: color.darkest,
|
5477 |
|
5478 | border: color.border,
|
5479 |
|
5480 | positive: color.positive,
|
5481 | negative: color.negative,
|
5482 | warning: color.warning,
|
5483 | critical: color.critical,
|
5484 | defaultText: vars.textColor || color.darkest,
|
5485 | inverseText: vars.textInverseColor || color.lightest
|
5486 | });
|
5487 |
|
5488 | const convert = (inherit = themes[getPreferredColorScheme()]) => {
|
5489 | const {
|
5490 | base,
|
5491 | colorPrimary,
|
5492 | colorSecondary,
|
5493 | appBg,
|
5494 | appContentBg,
|
5495 | appBorderColor,
|
5496 | appBorderRadius,
|
5497 | fontBase,
|
5498 | fontCode,
|
5499 | textColor,
|
5500 | textInverseColor,
|
5501 | barTextColor,
|
5502 | barSelectedColor,
|
5503 | barBg,
|
5504 | inputBg,
|
5505 | inputBorder,
|
5506 | inputTextColor,
|
5507 | inputBorderRadius,
|
5508 | brandTitle,
|
5509 | brandUrl,
|
5510 | brandImage,
|
5511 | brandTarget,
|
5512 | gridCellSize
|
5513 | } = inherit,
|
5514 | rest = __rest(inherit, ["base", "colorPrimary", "colorSecondary", "appBg", "appContentBg", "appBorderColor", "appBorderRadius", "fontBase", "fontCode", "textColor", "textInverseColor", "barTextColor", "barSelectedColor", "barBg", "inputBg", "inputBorder", "inputTextColor", "inputBorderRadius", "brandTitle", "brandUrl", "brandImage", "brandTarget", "gridCellSize"]);
|
5515 |
|
5516 | return Object.assign(Object.assign({}, rest || {}), {
|
5517 | base,
|
5518 | color: createColors(inherit),
|
5519 | background: {
|
5520 | app: appBg,
|
5521 | bar: barBg,
|
5522 | content: appContentBg,
|
5523 | gridCellSize: gridCellSize || background.gridCellSize,
|
5524 | hoverable: background.hoverable,
|
5525 | positive: background.positive,
|
5526 | negative: background.negative,
|
5527 | warning: background.warning,
|
5528 | critical: background.critical
|
5529 | },
|
5530 | typography: {
|
5531 | fonts: {
|
5532 | base: fontBase,
|
5533 | mono: fontCode
|
5534 | },
|
5535 | weight: typography.weight,
|
5536 | size: typography.size
|
5537 | },
|
5538 | animation,
|
5539 | easing,
|
5540 | input: {
|
5541 | border: inputBorder,
|
5542 | background: inputBg,
|
5543 | color: inputTextColor,
|
5544 | borderRadius: inputBorderRadius
|
5545 | },
|
5546 |
|
5547 | layoutMargin: 10,
|
5548 | appBorderColor,
|
5549 | appBorderRadius,
|
5550 |
|
5551 | barTextColor,
|
5552 | barSelectedColor: barSelectedColor || colorSecondary,
|
5553 | barBg,
|
5554 |
|
5555 | brand: {
|
5556 | title: brandTitle,
|
5557 | url: brandUrl,
|
5558 | image: brandImage || (brandTitle ? null : undefined),
|
5559 | target: brandTarget
|
5560 | },
|
5561 | code: create({
|
5562 | colors: base === 'light' ? lightSyntaxColors : darkSyntaxColors,
|
5563 | mono: fontCode
|
5564 | }),
|
5565 |
|
5566 |
|
5567 | addonActionsTheme: Object.assign(Object.assign({}, base === 'light' ? chromeLight : chromeDark), {
|
5568 | BASE_FONT_FAMILY: fontCode,
|
5569 | BASE_FONT_SIZE: typography.size.s2 - 1,
|
5570 | BASE_LINE_HEIGHT: '18px',
|
5571 | BASE_BACKGROUND_COLOR: 'transparent',
|
5572 | BASE_COLOR: textColor,
|
5573 | ARROW_COLOR: curriedOpacify$1(0.2, appBorderColor),
|
5574 | ARROW_MARGIN_RIGHT: 4,
|
5575 | ARROW_FONT_SIZE: 8,
|
5576 | TREENODE_FONT_FAMILY: fontCode,
|
5577 | TREENODE_FONT_SIZE: typography.size.s2 - 1,
|
5578 | TREENODE_LINE_HEIGHT: '18px',
|
5579 | TREENODE_PADDING_LEFT: 12
|
5580 | })
|
5581 | });
|
5582 | };
|
5583 |
|
5584 | const isEmpty = o => Object.keys(o).length === 0;
|
5585 |
|
5586 | const isObject = o => o != null && typeof o === 'object';
|
5587 |
|
5588 | const hasOwnProperty = (o, ...args) => Object.prototype.hasOwnProperty.call(o, ...args);
|
5589 |
|
5590 | const deletedDiff = (lhs, rhs) => {
|
5591 | if (lhs === rhs || !isObject(lhs) || !isObject(rhs)) return {};
|
5592 | const l = lhs;
|
5593 | const r = rhs;
|
5594 | return Object.keys(l).reduce((acc, key) => {
|
5595 | if (hasOwnProperty(r, key)) {
|
5596 | const difference = deletedDiff(l[key], r[key]);
|
5597 | if (isObject(difference) && isEmpty(difference)) return acc;
|
5598 | acc[key] = difference;
|
5599 | return acc;
|
5600 | }
|
5601 |
|
5602 | acc[key] = undefined;
|
5603 | return acc;
|
5604 | }, {});
|
5605 | };
|
5606 |
|
5607 | function dedent(templ) {
|
5608 | var values = [];
|
5609 |
|
5610 | for (var _i = 1; _i < arguments.length; _i++) {
|
5611 | values[_i - 1] = arguments[_i];
|
5612 | }
|
5613 |
|
5614 | var strings = Array.from(typeof templ === 'string' ? [templ] : templ);
|
5615 | strings[strings.length - 1] = strings[strings.length - 1].replace(/\r?\n([\t ]*)$/, '');
|
5616 | var indentLengths = strings.reduce(function (arr, str) {
|
5617 | var matches = str.match(/\n([\t ]+|(?!\s).)/g);
|
5618 |
|
5619 | if (matches) {
|
5620 | return arr.concat(matches.map(function (match) {
|
5621 | var _a, _b;
|
5622 |
|
5623 | return (_b = (_a = match.match(/[\t ]/g)) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0;
|
5624 | }));
|
5625 | }
|
5626 |
|
5627 | return arr;
|
5628 | }, []);
|
5629 |
|
5630 | if (indentLengths.length) {
|
5631 | var pattern_1 = new RegExp("\n[\t ]{" + Math.min.apply(Math, indentLengths) + "}", 'g');
|
5632 | strings = strings.map(function (str) {
|
5633 | return str.replace(pattern_1, '\n');
|
5634 | });
|
5635 | }
|
5636 |
|
5637 | strings[0] = strings[0].replace(/^\r?\n/, '');
|
5638 | var string = strings[0];
|
5639 | values.forEach(function (value, i) {
|
5640 | var endentations = string.match(/(?:^|\n)( *)$/);
|
5641 | var endentation = endentations ? endentations[1] : '';
|
5642 | var indentedValue = value;
|
5643 |
|
5644 | if (typeof value === 'string' && value.includes('\n')) {
|
5645 | indentedValue = String(value).split('\n').map(function (str, i) {
|
5646 | return i === 0 ? str : "" + endentation + str;
|
5647 | }).join('\n');
|
5648 | }
|
5649 |
|
5650 | string += indentedValue + strings[i + 1];
|
5651 | });
|
5652 | return string;
|
5653 | }
|
5654 |
|
5655 | const ensure = input => {
|
5656 | if (!input) {
|
5657 | return convert(theme$1);
|
5658 | }
|
5659 |
|
5660 | const missing = deletedDiff(theme$1, input);
|
5661 |
|
5662 | if (Object.keys(missing).length) {
|
5663 | logger.warn(dedent`
|
5664 | Your theme is missing properties, you should update your theme!
|
5665 |
|
5666 | theme-data missing:
|
5667 | `, missing);
|
5668 | }
|
5669 |
|
5670 | return convert(input);
|
5671 | };
|
5672 |
|
5673 |
|
5674 | const useTheme = useTheme$1;
|
5675 | const withTheme = withTheme$1;
|
5676 | const Global = Global$1;
|
5677 | const styled = newStyled;
|
5678 | const ignoreSsrWarning = '/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */';
|
5679 | export { CacheProvider, ClassNames, Global, ThemeProvider, background, color, convert, create$1 as create, createCache, createGlobal, createReset, css, darkenColor as darken, ensure, ignoreSsrWarning, isPropValid, jsx, keyframes, lightenColor as lighten, styled, themes, typography, useTheme, withTheme };
|