1 | (function (global, factory) {
|
2 | typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react')) :
|
3 | typeof define === 'function' && define.amd ? define(['react'], factory) :
|
4 | (global = global || self, global.styled = factory(global.React));
|
5 | })(this, (function (React) { 'use strict';
|
6 |
|
7 | var SC_ATTR = (typeof process !== 'undefined' &&
|
8 | typeof process.env !== 'undefined' &&
|
9 | (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR)) ||
|
10 | 'data-styled';
|
11 | var SC_ATTR_ACTIVE = 'active';
|
12 | var SC_ATTR_VERSION = 'data-styled-version';
|
13 | var SC_VERSION = "6.1.8";
|
14 | var SPLITTER = '/*!sc*/\n';
|
15 | var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
|
16 | var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean'
|
17 | ? SC_DISABLE_SPEEDY
|
18 | : typeof process !== 'undefined' &&
|
19 | typeof process.env !== 'undefined' &&
|
20 | typeof process.env.REACT_APP_SC_DISABLE_SPEEDY !== 'undefined' &&
|
21 | process.env.REACT_APP_SC_DISABLE_SPEEDY !== ''
|
22 | ? process.env.REACT_APP_SC_DISABLE_SPEEDY === 'false'
|
23 | ? false
|
24 | : process.env.REACT_APP_SC_DISABLE_SPEEDY
|
25 | : typeof process !== 'undefined' &&
|
26 | typeof process.env !== 'undefined' &&
|
27 | typeof process.env.SC_DISABLE_SPEEDY !== 'undefined' &&
|
28 | process.env.SC_DISABLE_SPEEDY !== ''
|
29 | ? process.env.SC_DISABLE_SPEEDY === 'false'
|
30 | ? false
|
31 | : process.env.SC_DISABLE_SPEEDY
|
32 | : "development" !== 'production');
|
33 |
|
34 | var STATIC_EXECUTION_CONTEXT = {};
|
35 |
|
36 | |
37 |
|
38 |
|
39 |
|
40 |
|
41 |
|
42 |
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 |
|
49 |
|
50 |
|
51 | var __assign = function() {
|
52 | __assign = Object.assign || function __assign(t) {
|
53 | for (var s, i = 1, n = arguments.length; i < n; i++) {
|
54 | s = arguments[i];
|
55 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
56 | }
|
57 | return t;
|
58 | };
|
59 | return __assign.apply(this, arguments);
|
60 | };
|
61 |
|
62 | function __spreadArray(to, from, pack) {
|
63 | if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
64 | if (ar || !(i in from)) {
|
65 | if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
66 | ar[i] = from[i];
|
67 | }
|
68 | }
|
69 | return to.concat(ar || Array.prototype.slice.call(from));
|
70 | }
|
71 |
|
72 | var EMPTY_ARRAY = Object.freeze([]);
|
73 | var EMPTY_OBJECT = Object.freeze({});
|
74 |
|
75 | |
76 |
|
77 |
|
78 |
|
79 |
|
80 |
|
81 |
|
82 |
|
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 |
|
89 |
|
90 |
|
91 | function setToString(object, toStringFn) {
|
92 | Object.defineProperty(object, 'toString', { value: toStringFn });
|
93 | }
|
94 |
|
95 | var errorMap = {
|
96 | '1': 'Cannot create styled-component for component: %s.\n\n',
|
97 | '2': "Can't collect styles once you've consumed a `ServerStyleSheet`'s styles! `ServerStyleSheet` is a one off instance for each server-side render cycle.\n\n- Are you trying to reuse it across renders?\n- Are you accidentally calling collectStyles twice?\n\n",
|
98 | '3': 'Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.\n\n',
|
99 | '4': 'The `StyleSheetManager` expects a valid target or sheet prop!\n\n- Does this error occur on the client and is your target falsy?\n- Does this error occur on the server and is the sheet falsy?\n\n',
|
100 | '5': 'The clone method cannot be used on the client!\n\n- Are you running in a client-like environment on the server?\n- Are you trying to run SSR on the client?\n\n',
|
101 | '6': "Trying to insert a new style tag, but the given Node is unmounted!\n\n- Are you using a custom target that isn't mounted?\n- Does your document not have a valid head element?\n- Have you accidentally removed a style tag manually?\n\n",
|
102 | '7': 'ThemeProvider: Please return an object from your "theme" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n',
|
103 | '8': 'ThemeProvider: Please make your "theme" prop an object.\n\n',
|
104 | '9': 'Missing document `<head>`\n\n',
|
105 | '10': 'Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021\n\n',
|
106 | '11': '_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.\n\n',
|
107 | '12': 'It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\`\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\n\n',
|
108 | '13': '%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.\n\n',
|
109 | '14': 'ThemeProvider: "theme" prop is required.\n\n',
|
110 | '15': "A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to `<StyleSheetManager stylisPlugins={[]}>`, please make sure each plugin is uniquely-named, e.g.\n\n```js\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\n```\n\n",
|
111 | '16': "Reached the limit of how many styled components may be created at group %s.\nYou may only create up to 1,073,741,824 components. If you're creating components dynamically,\nas for instance in your render method then you may be running into this limitation.\n\n",
|
112 | '17': "CSSStyleSheet could not be found on HTMLStyleElement.\nHas styled-components' style tag been unmounted or altered by another script?\n",
|
113 | '18': 'ThemeProvider: Please make sure your useTheme hook is within a `<ThemeProvider>`',
|
114 | };
|
115 |
|
116 | var ERRORS = errorMap ;
|
117 | |
118 |
|
119 |
|
120 | function format() {
|
121 | var args = [];
|
122 | for (var _i = 0; _i < arguments.length; _i++) {
|
123 | args[_i] = arguments[_i];
|
124 | }
|
125 | var a = args[0];
|
126 | var b = [];
|
127 | for (var c = 1, len = args.length; c < len; c += 1) {
|
128 | b.push(args[c]);
|
129 | }
|
130 | b.forEach(function (d) {
|
131 | a = a.replace(/%[a-z]/, d);
|
132 | });
|
133 | return a;
|
134 | }
|
135 | |
136 |
|
137 |
|
138 |
|
139 | function throwStyledComponentsError(code) {
|
140 | var interpolations = [];
|
141 | for (var _i = 1; _i < arguments.length; _i++) {
|
142 | interpolations[_i - 1] = arguments[_i];
|
143 | }
|
144 | {
|
145 | return new Error(format.apply(void 0, __spreadArray([ERRORS[code]], interpolations, false)).trim());
|
146 | }
|
147 | }
|
148 |
|
149 |
|
150 | var makeGroupedTag = function (tag) {
|
151 | return new DefaultGroupedTag(tag);
|
152 | };
|
153 | var BASE_SIZE = 1 << 9;
|
154 | var DefaultGroupedTag = (function () {
|
155 | function DefaultGroupedTag(tag) {
|
156 | this.groupSizes = new Uint32Array(BASE_SIZE);
|
157 | this.length = BASE_SIZE;
|
158 | this.tag = tag;
|
159 | }
|
160 | DefaultGroupedTag.prototype.indexOfGroup = function (group) {
|
161 | var index = 0;
|
162 | for (var i = 0; i < group; i++) {
|
163 | index += this.groupSizes[i];
|
164 | }
|
165 | return index;
|
166 | };
|
167 | DefaultGroupedTag.prototype.insertRules = function (group, rules) {
|
168 | if (group >= this.groupSizes.length) {
|
169 | var oldBuffer = this.groupSizes;
|
170 | var oldSize = oldBuffer.length;
|
171 | var newSize = oldSize;
|
172 | while (group >= newSize) {
|
173 | newSize <<= 1;
|
174 | if (newSize < 0) {
|
175 | throw throwStyledComponentsError(16, "".concat(group));
|
176 | }
|
177 | }
|
178 | this.groupSizes = new Uint32Array(newSize);
|
179 | this.groupSizes.set(oldBuffer);
|
180 | this.length = newSize;
|
181 | for (var i = oldSize; i < newSize; i++) {
|
182 | this.groupSizes[i] = 0;
|
183 | }
|
184 | }
|
185 | var ruleIndex = this.indexOfGroup(group + 1);
|
186 | for (var i = 0, l = rules.length; i < l; i++) {
|
187 | if (this.tag.insertRule(ruleIndex, rules[i])) {
|
188 | this.groupSizes[group]++;
|
189 | ruleIndex++;
|
190 | }
|
191 | }
|
192 | };
|
193 | DefaultGroupedTag.prototype.clearGroup = function (group) {
|
194 | if (group < this.length) {
|
195 | var length_1 = this.groupSizes[group];
|
196 | var startIndex = this.indexOfGroup(group);
|
197 | var endIndex = startIndex + length_1;
|
198 | this.groupSizes[group] = 0;
|
199 | for (var i = startIndex; i < endIndex; i++) {
|
200 | this.tag.deleteRule(startIndex);
|
201 | }
|
202 | }
|
203 | };
|
204 | DefaultGroupedTag.prototype.getGroup = function (group) {
|
205 | var css = '';
|
206 | if (group >= this.length || this.groupSizes[group] === 0) {
|
207 | return css;
|
208 | }
|
209 | var length = this.groupSizes[group];
|
210 | var startIndex = this.indexOfGroup(group);
|
211 | var endIndex = startIndex + length;
|
212 | for (var i = startIndex; i < endIndex; i++) {
|
213 | css += "".concat(this.tag.getRule(i)).concat(SPLITTER);
|
214 | }
|
215 | return css;
|
216 | };
|
217 | return DefaultGroupedTag;
|
218 | }());
|
219 |
|
220 | var MAX_SMI = 1 << (31 - 1);
|
221 | var groupIDRegister = new Map();
|
222 | var reverseRegister = new Map();
|
223 | var nextFreeGroup = 1;
|
224 | var getGroupForId = function (id) {
|
225 | if (groupIDRegister.has(id)) {
|
226 | return groupIDRegister.get(id);
|
227 | }
|
228 | while (reverseRegister.has(nextFreeGroup)) {
|
229 | nextFreeGroup++;
|
230 | }
|
231 | var group = nextFreeGroup++;
|
232 | if (((group | 0) < 0 || group > MAX_SMI)) {
|
233 | throw throwStyledComponentsError(16, "".concat(group));
|
234 | }
|
235 | groupIDRegister.set(id, group);
|
236 | reverseRegister.set(group, id);
|
237 | return group;
|
238 | };
|
239 | var getIdForGroup = function (group) {
|
240 | return reverseRegister.get(group);
|
241 | };
|
242 | var setGroupForId = function (id, group) {
|
243 |
|
244 | nextFreeGroup = group + 1;
|
245 | groupIDRegister.set(id, group);
|
246 | reverseRegister.set(group, id);
|
247 | };
|
248 |
|
249 | var SELECTOR = "style[".concat(SC_ATTR, "][").concat(SC_ATTR_VERSION, "=\"").concat(SC_VERSION, "\"]");
|
250 | var MARKER_RE = new RegExp("^".concat(SC_ATTR, "\\.g(\\d+)\\[id=\"([\\w\\d-]+)\"\\].*?\"([^\"]*)"));
|
251 | var outputSheet = function (sheet) {
|
252 | var tag = sheet.getTag();
|
253 | var length = tag.length;
|
254 | var css = '';
|
255 | var _loop_1 = function (group) {
|
256 | var id = getIdForGroup(group);
|
257 | if (id === undefined)
|
258 | return "continue";
|
259 | var names = sheet.names.get(id);
|
260 | var rules = tag.getGroup(group);
|
261 | if (names === undefined || rules.length === 0)
|
262 | return "continue";
|
263 | var selector = "".concat(SC_ATTR, ".g").concat(group, "[id=\"").concat(id, "\"]");
|
264 | var content = '';
|
265 | if (names !== undefined) {
|
266 | names.forEach(function (name) {
|
267 | if (name.length > 0) {
|
268 | content += "".concat(name, ",");
|
269 | }
|
270 | });
|
271 | }
|
272 |
|
273 |
|
274 | css += "".concat(rules).concat(selector, "{content:\"").concat(content, "\"}").concat(SPLITTER);
|
275 | };
|
276 | for (var group = 0; group < length; group++) {
|
277 | _loop_1(group);
|
278 | }
|
279 | return css;
|
280 | };
|
281 | var rehydrateNamesFromContent = function (sheet, id, content) {
|
282 | var names = content.split(',');
|
283 | var name;
|
284 | for (var i = 0, l = names.length; i < l; i++) {
|
285 | if ((name = names[i])) {
|
286 | sheet.registerName(id, name);
|
287 | }
|
288 | }
|
289 | };
|
290 | var rehydrateSheetFromTag = function (sheet, style) {
|
291 | var _a;
|
292 | var parts = ((_a = style.textContent) !== null && _a !== void 0 ? _a : '').split(SPLITTER);
|
293 | var rules = [];
|
294 | for (var i = 0, l = parts.length; i < l; i++) {
|
295 | var part = parts[i].trim();
|
296 | if (!part)
|
297 | continue;
|
298 | var marker = part.match(MARKER_RE);
|
299 | if (marker) {
|
300 | var group = parseInt(marker[1], 10) | 0;
|
301 | var id = marker[2];
|
302 | if (group !== 0) {
|
303 |
|
304 | setGroupForId(id, group);
|
305 |
|
306 |
|
307 | rehydrateNamesFromContent(sheet, id, marker[3]);
|
308 | sheet.getTag().insertRules(group, rules);
|
309 | }
|
310 | rules.length = 0;
|
311 | }
|
312 | else {
|
313 | rules.push(part);
|
314 | }
|
315 | }
|
316 | };
|
317 | var rehydrateSheet = function (sheet) {
|
318 | var nodes = document.querySelectorAll(SELECTOR);
|
319 | for (var i = 0, l = nodes.length; i < l; i++) {
|
320 | var node = nodes[i];
|
321 | if (node && node.getAttribute(SC_ATTR) !== SC_ATTR_ACTIVE) {
|
322 | rehydrateSheetFromTag(sheet, node);
|
323 | if (node.parentNode) {
|
324 | node.parentNode.removeChild(node);
|
325 | }
|
326 | }
|
327 | }
|
328 | };
|
329 |
|
330 | function getNonce() {
|
331 | return typeof __webpack_nonce__ !== 'undefined' ? __webpack_nonce__ : null;
|
332 | }
|
333 |
|
334 |
|
335 | var findLastStyleTag = function (target) {
|
336 | var arr = Array.from(target.querySelectorAll("style[".concat(SC_ATTR, "]")));
|
337 | return arr[arr.length - 1];
|
338 | };
|
339 |
|
340 | var makeStyleTag = function (target) {
|
341 | var head = document.head;
|
342 | var parent = target || head;
|
343 | var style = document.createElement('style');
|
344 | var prevStyle = findLastStyleTag(parent);
|
345 | var nextSibling = prevStyle !== undefined ? prevStyle.nextSibling : null;
|
346 | style.setAttribute(SC_ATTR, SC_ATTR_ACTIVE);
|
347 | style.setAttribute(SC_ATTR_VERSION, SC_VERSION);
|
348 | var nonce = getNonce();
|
349 | if (nonce)
|
350 | style.setAttribute('nonce', nonce);
|
351 | parent.insertBefore(style, nextSibling);
|
352 | return style;
|
353 | };
|
354 |
|
355 | var getSheet = function (tag) {
|
356 | if (tag.sheet) {
|
357 | return tag.sheet;
|
358 | }
|
359 |
|
360 | var styleSheets = document.styleSheets;
|
361 | for (var i = 0, l = styleSheets.length; i < l; i++) {
|
362 | var sheet = styleSheets[i];
|
363 | if (sheet.ownerNode === tag) {
|
364 | return sheet;
|
365 | }
|
366 | }
|
367 | throw throwStyledComponentsError(17);
|
368 | };
|
369 |
|
370 |
|
371 | var makeTag = function (_a) {
|
372 | var isServer = _a.isServer, useCSSOMInjection = _a.useCSSOMInjection, target = _a.target;
|
373 | if (isServer) {
|
374 | return new VirtualTag(target);
|
375 | }
|
376 | else if (useCSSOMInjection) {
|
377 | return new CSSOMTag(target);
|
378 | }
|
379 | else {
|
380 | return new TextTag(target);
|
381 | }
|
382 | };
|
383 | var CSSOMTag = (function () {
|
384 | function CSSOMTag(target) {
|
385 | this.element = makeStyleTag(target);
|
386 |
|
387 | this.element.appendChild(document.createTextNode(''));
|
388 | this.sheet = getSheet(this.element);
|
389 | this.length = 0;
|
390 | }
|
391 | CSSOMTag.prototype.insertRule = function (index, rule) {
|
392 | try {
|
393 | this.sheet.insertRule(rule, index);
|
394 | this.length++;
|
395 | return true;
|
396 | }
|
397 | catch (_error) {
|
398 | return false;
|
399 | }
|
400 | };
|
401 | CSSOMTag.prototype.deleteRule = function (index) {
|
402 | this.sheet.deleteRule(index);
|
403 | this.length--;
|
404 | };
|
405 | CSSOMTag.prototype.getRule = function (index) {
|
406 | var rule = this.sheet.cssRules[index];
|
407 |
|
408 | if (rule && rule.cssText) {
|
409 | return rule.cssText;
|
410 | }
|
411 | else {
|
412 | return '';
|
413 | }
|
414 | };
|
415 | return CSSOMTag;
|
416 | }());
|
417 |
|
418 | var TextTag = (function () {
|
419 | function TextTag(target) {
|
420 | this.element = makeStyleTag(target);
|
421 | this.nodes = this.element.childNodes;
|
422 | this.length = 0;
|
423 | }
|
424 | TextTag.prototype.insertRule = function (index, rule) {
|
425 | if (index <= this.length && index >= 0) {
|
426 | var node = document.createTextNode(rule);
|
427 | var refNode = this.nodes[index];
|
428 | this.element.insertBefore(node, refNode || null);
|
429 | this.length++;
|
430 | return true;
|
431 | }
|
432 | else {
|
433 | return false;
|
434 | }
|
435 | };
|
436 | TextTag.prototype.deleteRule = function (index) {
|
437 | this.element.removeChild(this.nodes[index]);
|
438 | this.length--;
|
439 | };
|
440 | TextTag.prototype.getRule = function (index) {
|
441 | if (index < this.length) {
|
442 | return this.nodes[index].textContent;
|
443 | }
|
444 | else {
|
445 | return '';
|
446 | }
|
447 | };
|
448 | return TextTag;
|
449 | }());
|
450 |
|
451 | var VirtualTag = (function () {
|
452 | function VirtualTag(_target) {
|
453 | this.rules = [];
|
454 | this.length = 0;
|
455 | }
|
456 | VirtualTag.prototype.insertRule = function (index, rule) {
|
457 | if (index <= this.length) {
|
458 | this.rules.splice(index, 0, rule);
|
459 | this.length++;
|
460 | return true;
|
461 | }
|
462 | else {
|
463 | return false;
|
464 | }
|
465 | };
|
466 | VirtualTag.prototype.deleteRule = function (index) {
|
467 | this.rules.splice(index, 1);
|
468 | this.length--;
|
469 | };
|
470 | VirtualTag.prototype.getRule = function (index) {
|
471 | if (index < this.length) {
|
472 | return this.rules[index];
|
473 | }
|
474 | else {
|
475 | return '';
|
476 | }
|
477 | };
|
478 | return VirtualTag;
|
479 | }());
|
480 |
|
481 | var SHOULD_REHYDRATE = IS_BROWSER;
|
482 | var defaultOptions = {
|
483 | isServer: !IS_BROWSER,
|
484 | useCSSOMInjection: !DISABLE_SPEEDY,
|
485 | };
|
486 |
|
487 | var StyleSheet = (function () {
|
488 | function StyleSheet(options, globalStyles, names) {
|
489 | if (options === void 0) { options = EMPTY_OBJECT; }
|
490 | if (globalStyles === void 0) { globalStyles = {}; }
|
491 | var _this = this;
|
492 | this.options = __assign(__assign({}, defaultOptions), options);
|
493 | this.gs = globalStyles;
|
494 | this.names = new Map(names);
|
495 | this.server = !!options.isServer;
|
496 |
|
497 | if (!this.server && IS_BROWSER && SHOULD_REHYDRATE) {
|
498 | SHOULD_REHYDRATE = false;
|
499 | rehydrateSheet(this);
|
500 | }
|
501 | setToString(this, function () { return outputSheet(_this); });
|
502 | }
|
503 |
|
504 | StyleSheet.registerId = function (id) {
|
505 | return getGroupForId(id);
|
506 | };
|
507 | StyleSheet.prototype.reconstructWithOptions = function (options, withNames) {
|
508 | if (withNames === void 0) { withNames = true; }
|
509 | return new StyleSheet(__assign(__assign({}, this.options), options), this.gs, (withNames && this.names) || undefined);
|
510 | };
|
511 | StyleSheet.prototype.allocateGSInstance = function (id) {
|
512 | return (this.gs[id] = (this.gs[id] || 0) + 1);
|
513 | };
|
514 |
|
515 | StyleSheet.prototype.getTag = function () {
|
516 | return this.tag || (this.tag = makeGroupedTag(makeTag(this.options)));
|
517 | };
|
518 |
|
519 | StyleSheet.prototype.hasNameForId = function (id, name) {
|
520 | return this.names.has(id) && this.names.get(id).has(name);
|
521 | };
|
522 |
|
523 | StyleSheet.prototype.registerName = function (id, name) {
|
524 | getGroupForId(id);
|
525 | if (!this.names.has(id)) {
|
526 | var groupNames = new Set();
|
527 | groupNames.add(name);
|
528 | this.names.set(id, groupNames);
|
529 | }
|
530 | else {
|
531 | this.names.get(id).add(name);
|
532 | }
|
533 | };
|
534 |
|
535 | StyleSheet.prototype.insertRules = function (id, name, rules) {
|
536 | this.registerName(id, name);
|
537 | this.getTag().insertRules(getGroupForId(id), rules);
|
538 | };
|
539 |
|
540 | StyleSheet.prototype.clearNames = function (id) {
|
541 | if (this.names.has(id)) {
|
542 | this.names.get(id).clear();
|
543 | }
|
544 | };
|
545 |
|
546 | StyleSheet.prototype.clearRules = function (id) {
|
547 | this.getTag().clearGroup(getGroupForId(id));
|
548 | this.clearNames(id);
|
549 | };
|
550 |
|
551 | StyleSheet.prototype.clearTag = function () {
|
552 |
|
553 |
|
554 | this.tag = undefined;
|
555 | };
|
556 | return StyleSheet;
|
557 | }());
|
558 |
|
559 |
|
560 |
|
561 | var shallowequal = function shallowEqual(objA, objB, compare, compareContext) {
|
562 | var ret = compare ? compare.call(compareContext, objA, objB) : void 0;
|
563 |
|
564 | if (ret !== void 0) {
|
565 | return !!ret;
|
566 | }
|
567 |
|
568 | if (objA === objB) {
|
569 | return true;
|
570 | }
|
571 |
|
572 | if (typeof objA !== "object" || !objA || typeof objB !== "object" || !objB) {
|
573 | return false;
|
574 | }
|
575 |
|
576 | var keysA = Object.keys(objA);
|
577 | var keysB = Object.keys(objB);
|
578 |
|
579 | if (keysA.length !== keysB.length) {
|
580 | return false;
|
581 | }
|
582 |
|
583 | var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
|
584 |
|
585 |
|
586 | for (var idx = 0; idx < keysA.length; idx++) {
|
587 | var key = keysA[idx];
|
588 |
|
589 | if (!bHasOwnProperty(key)) {
|
590 | return false;
|
591 | }
|
592 |
|
593 | var valueA = objA[key];
|
594 | var valueB = objB[key];
|
595 |
|
596 | ret = compare ? compare.call(compareContext, valueA, valueB, key) : void 0;
|
597 |
|
598 | if (ret === false || (ret === void 0 && valueA !== valueB)) {
|
599 | return false;
|
600 | }
|
601 | }
|
602 |
|
603 | return true;
|
604 | };
|
605 |
|
606 | var e="-ms-";var r="-moz-";var a="-webkit-";var n="comm";var c="rule";var s="decl";var i="@import";var h="@keyframes";var g="@layer";var k=Math.abs;var $=String.fromCharCode;var m=Object.assign;function x(e,r){return O(e,0)^45?(((r<<2^O(e,0))<<2^O(e,1))<<2^O(e,2))<<2^O(e,3):0}function y(e){return e.trim()}function j(e,r){return (e=r.exec(e))?e[0]:e}function z(e,r,a){return e.replace(r,a)}function C(e,r,a){return e.indexOf(r,a)}function O(e,r){return e.charCodeAt(r)|0}function A(e,r,a){return e.slice(r,a)}function M(e){return e.length}function S(e){return e.length}function q(e,r){return r.push(e),e}function B(e,r){return e.map(r).join("")}function D(e,r){return e.filter((function(e){return !j(e,r)}))}var E=1;var F=1;var G=0;var H=0;var I=0;var J="";function K(e,r,a,n,c,s,t,u){return {value:e,root:r,parent:a,type:n,props:c,children:s,line:E,column:F,length:t,return:"",siblings:u}}function L(e,r){return m(K("",null,null,"",null,null,0,e.siblings),e,{length:-e.length},r)}function N(e){while(e.root)e=L(e.root,{children:[e]});q(e,e.siblings);}function P(){return I}function Q(){I=H>0?O(J,--H):0;if(F--,I===10)F=1,E--;return I}function R(){I=H<G?O(J,H++):0;if(F++,I===10)F=1,E++;return I}function T(){return O(J,H)}function U(){return H}function V(e,r){return A(J,e,r)}function W(e){switch(e){case 0:case 9:case 10:case 13:case 32:return 5;case 33:case 43:case 44:case 47:case 62:case 64:case 126:case 59:case 123:case 125:return 4;case 58:return 3;case 34:case 39:case 40:case 91:return 2;case 41:case 93:return 1}return 0}function X(e){return E=F=1,G=M(J=e),H=0,[]}function Y(e){return J="",e}function Z(e){return y(V(H-1,ne(e===91?e+2:e===40?e+1:e)))}function ee(e){while(I=T())if(I<33)R();else break;return W(e)>2||W(I)>3?"":" "}function ae(e,r){while(--r&&R())if(I<48||I>102||I>57&&I<65||I>70&&I<97)break;return V(e,U()+(r<6&&T()==32&&R()==32))}function ne(e){while(R())switch(I){case e:return H;case 34:case 39:if(e!==34&&e!==39)ne(I);break;case 40:if(e===41)ne(e);break;case 92:R();break}return H}function ce(e,r){while(R())if(e+I===47+10)break;else if(e+I===42+42&&T()===47)break;return "/*"+V(r,H-1)+"*"+$(e===47?e:R())}function se(e){while(!W(T()))R();return V(e,H)}function te(e){return Y(ue("",null,null,null,[""],e=X(e),0,[0],e))}function ue(e,r,a,n,c,s,t,u,i){var f=0;var o=0;var l=t;var v=0;var p=0;var h=0;var b=1;var w=1;var d=1;var g=0;var m="";var x=c;var y=s;var j=n;var A=m;while(w)switch(h=g,g=R()){case 40:if(h!=108&&O(A,l-1)==58){if(C(A+=z(Z(g),"&","&\f"),"&\f",k(f?u[f-1]:0))!=-1)d=-1;break}case 34:case 39:case 91:A+=Z(g);break;case 9:case 10:case 13:case 32:A+=ee(h);break;case 92:A+=ae(U()-1,7);continue;case 47:switch(T()){case 42:case 47:q(fe(ce(R(),U()),r,a,i),i);break;default:A+="/";}break;case 123*b:u[f++]=M(A)*d;case 125*b:case 59:case 0:switch(g){case 0:case 125:w=0;case 59+o:if(d==-1)A=z(A,/\f/g,"");if(p>0&&M(A)-l)q(p>32?oe(A+";",n,a,l-1,i):oe(z(A," ","")+";",n,a,l-2,i),i);break;case 59:A+=";";default:q(j=ie(A,r,a,f,o,c,u,m,x=[],y=[],l,s),s);if(g===123)if(o===0)ue(A,r,j,j,x,s,l,u,y);else switch(v===99&&O(A,3)===110?100:v){case 100:case 108:case 109:case 115:ue(e,j,j,n&&q(ie(e,j,j,0,0,c,u,m,c,x=[],l,y),y),c,y,l,u,n?x:y);break;default:ue(A,j,j,j,[""],y,0,u,y);}}f=o=p=0,b=d=1,m=A="",l=t;break;case 58:l=1+M(A),p=h;default:if(b<1)if(g==123)--b;else if(g==125&&b++==0&&Q()==125)continue;switch(A+=$(g),g*b){case 38:d=o>0?1:(A+="\f",-1);break;case 44:u[f++]=(M(A)-1)*d,d=1;break;case 64:if(T()===45)A+=Z(R());v=T(),o=l=M(m=A+=se(U())),g++;break;case 45:if(h===45&&M(A)==2)b=0;}}return s}function ie(e,r,a,n,s,t,u,i,f,o,l,v){var p=s-1;var h=s===0?t:[""];var b=S(h);for(var w=0,d=0,g=0;w<n;++w)for(var $=0,m=A(e,p+1,p=k(d=u[w])),x=e;$<b;++$)if(x=y(d>0?h[$]+" "+m:z(m,/&\f/g,h[$])))f[g++]=x;return K(e,r,a,s===0?c:i,f,o,l,v)}function fe(e,r,a,c){return K(e,r,a,n,$(P()),A(e,2,-2),0,c)}function oe(e,r,a,n,c){return K(e,r,a,s,A(e,0,n),A(e,n+1,-1),n,c)}function le(n,c,s){switch(x(n,c)){case 5103:return a+"print-"+n+n;case 5737:case 4201:case 3177:case 3433:case 1641:case 4457:case 2921:case 5572:case 6356:case 5844:case 3191:case 6645:case 3005:case 6391:case 5879:case 5623:case 6135:case 4599:case 4855:case 4215:case 6389:case 5109:case 5365:case 5621:case 3829:return a+n+n;case 4789:return r+n+n;case 5349:case 4246:case 4810:case 6968:case 2756:return a+n+r+n+e+n+n;case 5936:switch(O(n,c+11)){case 114:return a+n+e+z(n,/[svh]\w+-[tblr]{2}/,"tb")+n;case 108:return a+n+e+z(n,/[svh]\w+-[tblr]{2}/,"tb-rl")+n;case 45:return a+n+e+z(n,/[svh]\w+-[tblr]{2}/,"lr")+n}case 6828:case 4268:case 2903:return a+n+e+n+n;case 6165:return a+n+e+"flex-"+n+n;case 5187:return a+n+z(n,/(\w+).+(:[^]+)/,a+"box-$1$2"+e+"flex-$1$2")+n;case 5443:return a+n+e+"flex-item-"+z(n,/flex-|-self/g,"")+(!j(n,/flex-|baseline/)?e+"grid-row-"+z(n,/flex-|-self/g,""):"")+n;case 4675:return a+n+e+"flex-line-pack"+z(n,/align-content|flex-|-self/g,"")+n;case 5548:return a+n+e+z(n,"shrink","negative")+n;case 5292:return a+n+e+z(n,"basis","preferred-size")+n;case 6060:return a+"box-"+z(n,"-grow","")+a+n+e+z(n,"grow","positive")+n;case 4554:return a+z(n,/([^-])(transform)/g,"$1"+a+"$2")+n;case 6187:return z(z(z(n,/(zoom-|grab)/,a+"$1"),/(image-set)/,a+"$1"),n,"")+n;case 5495:case 3959:return z(n,/(image-set\([^]*)/,a+"$1"+"$`$1");case 4968:return z(z(n,/(.+:)(flex-)?(.*)/,a+"box-pack:$3"+e+"flex-pack:$3"),/s.+-b[^;]+/,"justify")+a+n+n;case 4200:if(!j(n,/flex-|baseline/))return e+"grid-column-align"+A(n,c)+n;break;case 2592:case 3360:return e+z(n,"template-","")+n;case 4384:case 3616:if(s&&s.some((function(e,r){return c=r,j(e.props,/grid-\w+-end/)}))){return ~C(n+(s=s[c].value),"span",0)?n:e+z(n,"-start","")+n+e+"grid-row-span:"+(~C(s,"span",0)?j(s,/\d+/):+j(s,/\d+/)-+j(n,/\d+/))+";"}return e+z(n,"-start","")+n;case 4896:case 4128:return s&&s.some((function(e){return j(e.props,/grid-\w+-start/)}))?n:e+z(z(n,"-end","-span"),"span ","")+n;case 4095:case 3583:case 4068:case 2532:return z(n,/(.+)-inline(.+)/,a+"$1$2")+n;case 8116:case 7059:case 5753:case 5535:case 5445:case 5701:case 4933:case 4677:case 5533:case 5789:case 5021:case 4765:if(M(n)-1-c>6)switch(O(n,c+1)){case 109:if(O(n,c+4)!==45)break;case 102:return z(n,/(.+:)(.+)-([^]+)/,"$1"+a+"$2-$3"+"$1"+r+(O(n,c+3)==108?"$3":"$2-$3"))+n;case 115:return ~C(n,"stretch",0)?le(z(n,"stretch","fill-available"),c,s)+n:n}break;case 5152:case 5920:return z(n,/(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/,(function(r,a,c,s,t,u,i){return e+a+":"+c+i+(s?e+a+"-span:"+(t?u:+u-+c)+i:"")+n}));case 4949:if(O(n,c+6)===121)return z(n,":",":"+a)+n;break;case 6444:switch(O(n,O(n,14)===45?18:11)){case 120:return z(n,/(.+:)([^;\s!]+)(;|(\s+)?!.+)?/,"$1"+a+(O(n,14)===45?"inline-":"")+"box$3"+"$1"+a+"$2$3"+"$1"+e+"$2box$3")+n;case 100:return z(n,":",":"+e)+n}break;case 5719:case 2647:case 2135:case 3927:case 2391:return z(n,"scroll-","scroll-snap-")+n}return n}function ve(e,r){var a="";for(var n=0;n<e.length;n++)a+=r(e[n],n,e,r)||"";return a}function pe(e,r,a,t){switch(e.type){case g:if(e.children.length)break;case i:case s:return e.return=e.return||e.value;case n:return "";case h:return e.return=e.value+"{"+ve(e.children,t)+"}";case c:if(!M(e.value=e.props.join(",")))return ""}return M(a=ve(e.children,t))?e.return=e.value+"{"+a+"}":""}function he(e){var r=S(e);return function(a,n,c,s){var t="";for(var u=0;u<r;u++)t+=e[u](a,n,c,s)||"";return t}}function be(e){return function(r){if(!r.root)if(r=r.return)e(r);}}function we(n,t,u,i){if(n.length>-1)if(!n.return)switch(n.type){case s:n.return=le(n.value,n.length,u);return;case h:return ve([L(n,{value:z(n.value,"@","@"+a)})],i);case c:if(n.length)return B(u=n.props,(function(c){switch(j(c,i=/(::plac\w+|:read-\w+)/)){case":read-only":case":read-write":N(L(n,{props:[z(c,/:(read-\w+)/,":"+r+"$1")]}));N(L(n,{props:[c]}));m(n,{props:D(u,i)});break;case"::placeholder":N(L(n,{props:[z(c,/:(plac\w+)/,":"+a+"input-$1")]}));N(L(n,{props:[z(c,/:(plac\w+)/,":"+r+"$1")]}));N(L(n,{props:[z(c,/:(plac\w+)/,e+"input-$1")]}));N(L(n,{props:[c]}));m(n,{props:D(u,i)});break}return ""}))}}
|
607 |
|
608 | var SEED$1 = 5381;
|
609 |
|
610 |
|
611 |
|
612 | var phash = function (h, x) {
|
613 | var i = x.length;
|
614 | while (i) {
|
615 | h = (h * 33) ^ x.charCodeAt(--i);
|
616 | }
|
617 | return h;
|
618 | };
|
619 |
|
620 | var hash = function (x) {
|
621 | return phash(SEED$1, x);
|
622 | };
|
623 |
|
624 | var AMP_REGEX = /&/g;
|
625 | var COMMENT_REGEX = /^\s*\/\/.*$/gm;
|
626 | |
627 |
|
628 |
|
629 |
|
630 | function recursivelySetNamepace(compiled, namespace) {
|
631 | return compiled.map(function (rule) {
|
632 | if (rule.type === 'rule') {
|
633 |
|
634 | rule.value = "".concat(namespace, " ").concat(rule.value);
|
635 |
|
636 | rule.value = rule.value.replaceAll(',', ",".concat(namespace, " "));
|
637 | rule.props = rule.props.map(function (prop) {
|
638 | return "".concat(namespace, " ").concat(prop);
|
639 | });
|
640 | }
|
641 | if (Array.isArray(rule.children) && rule.type !== '@keyframes') {
|
642 | rule.children = recursivelySetNamepace(rule.children, namespace);
|
643 | }
|
644 | return rule;
|
645 | });
|
646 | }
|
647 | function createStylisInstance(_a) {
|
648 | var _b = _a === void 0 ? EMPTY_OBJECT : _a, _c = _b.options, options = _c === void 0 ? EMPTY_OBJECT : _c, _d = _b.plugins, plugins = _d === void 0 ? EMPTY_ARRAY : _d;
|
649 | var _componentId;
|
650 | var _selector;
|
651 | var _selectorRegexp;
|
652 | var selfReferenceReplacer = function (match, offset, string) {
|
653 | if (
|
654 | |
655 |
|
656 |
|
657 |
|
658 | string.startsWith(_selector) &&
|
659 | string.endsWith(_selector) &&
|
660 | string.replaceAll(_selector, '').length > 0) {
|
661 | return ".".concat(_componentId);
|
662 | }
|
663 | return match;
|
664 | };
|
665 | |
666 |
|
667 |
|
668 |
|
669 |
|
670 |
|
671 |
|
672 |
|
673 |
|
674 |
|
675 |
|
676 |
|
677 | var selfReferenceReplacementPlugin = function (element) {
|
678 | if (element.type === c && element.value.includes('&')) {
|
679 | element.props[0] = element.props[0]
|
680 |
|
681 | .replace(AMP_REGEX, _selector)
|
682 | .replace(_selectorRegexp, selfReferenceReplacer);
|
683 | }
|
684 | };
|
685 | var middlewares = plugins.slice();
|
686 | middlewares.push(selfReferenceReplacementPlugin);
|
687 | |
688 |
|
689 |
|
690 | if (options.prefix) {
|
691 | middlewares.push(we);
|
692 | }
|
693 | middlewares.push(pe);
|
694 | var stringifyRules = function (css, selector,
|
695 | /**
|
696 | * This "prefix" referes to a _selector_ prefix.
|
697 | */
|
698 | prefix, componentId) {
|
699 | if (selector === void 0) { selector = ''; }
|
700 | if (prefix === void 0) { prefix = ''; }
|
701 | if (componentId === void 0) { componentId = '&'; }
|
702 |
|
703 |
|
704 |
|
705 | _componentId = componentId;
|
706 | _selector = selector;
|
707 | _selectorRegexp = new RegExp("\\".concat(_selector, "\\b"), 'g');
|
708 | var flatCSS = css.replace(COMMENT_REGEX, '');
|
709 | var compiled = te(prefix || selector ? "".concat(prefix, " ").concat(selector, " { ").concat(flatCSS, " }") : flatCSS);
|
710 | if (options.namespace) {
|
711 | compiled = recursivelySetNamepace(compiled, options.namespace);
|
712 | }
|
713 | var stack = [];
|
714 | ve(compiled, he(middlewares.concat(be(function (value) { return stack.push(value); }))));
|
715 | return stack;
|
716 | };
|
717 | stringifyRules.hash = plugins.length
|
718 | ? plugins
|
719 | .reduce(function (acc, plugin) {
|
720 | if (!plugin.name) {
|
721 | throwStyledComponentsError(15);
|
722 | }
|
723 | return phash(acc, plugin.name);
|
724 | }, SEED$1)
|
725 | .toString()
|
726 | : '';
|
727 | return stringifyRules;
|
728 | }
|
729 |
|
730 | var mainSheet = new StyleSheet();
|
731 | var mainStylis = createStylisInstance();
|
732 | var StyleSheetContext = React.createContext({
|
733 | shouldForwardProp: undefined,
|
734 | styleSheet: mainSheet,
|
735 | stylis: mainStylis,
|
736 | });
|
737 | var StyleSheetConsumer = StyleSheetContext.Consumer;
|
738 | var StylisContext = React.createContext(undefined);
|
739 | function useStyleSheetContext() {
|
740 | return React.useContext(StyleSheetContext);
|
741 | }
|
742 | function StyleSheetManager(props) {
|
743 | var _a = React.useState(props.stylisPlugins), plugins = _a[0], setPlugins = _a[1];
|
744 | var styleSheet = useStyleSheetContext().styleSheet;
|
745 | var resolvedStyleSheet = React.useMemo(function () {
|
746 | var sheet = styleSheet;
|
747 | if (props.sheet) {
|
748 | sheet = props.sheet;
|
749 | }
|
750 | else if (props.target) {
|
751 | sheet = sheet.reconstructWithOptions({ target: props.target }, false);
|
752 | }
|
753 | if (props.disableCSSOMInjection) {
|
754 | sheet = sheet.reconstructWithOptions({ useCSSOMInjection: false });
|
755 | }
|
756 | return sheet;
|
757 | }, [props.disableCSSOMInjection, props.sheet, props.target, styleSheet]);
|
758 | var stylis = React.useMemo(function () {
|
759 | return createStylisInstance({
|
760 | options: { namespace: props.namespace, prefix: props.enableVendorPrefixes },
|
761 | plugins: plugins,
|
762 | });
|
763 | }, [props.enableVendorPrefixes, props.namespace, plugins]);
|
764 | React.useEffect(function () {
|
765 | if (!shallowequal(plugins, props.stylisPlugins))
|
766 | setPlugins(props.stylisPlugins);
|
767 | }, [props.stylisPlugins]);
|
768 | var styleSheetContextValue = React.useMemo(function () { return ({
|
769 | shouldForwardProp: props.shouldForwardProp,
|
770 | styleSheet: resolvedStyleSheet,
|
771 | stylis: stylis,
|
772 | }); }, [props.shouldForwardProp, resolvedStyleSheet, stylis]);
|
773 | return (React.createElement(StyleSheetContext.Provider, { value: styleSheetContextValue },
|
774 | React.createElement(StylisContext.Provider, { value: stylis }, props.children)));
|
775 | }
|
776 |
|
777 | var Keyframes = (function () {
|
778 | function Keyframes(name, rules) {
|
779 | var _this = this;
|
780 | this.inject = function (styleSheet, stylisInstance) {
|
781 | if (stylisInstance === void 0) { stylisInstance = mainStylis; }
|
782 | var resolvedName = _this.name + stylisInstance.hash;
|
783 | if (!styleSheet.hasNameForId(_this.id, resolvedName)) {
|
784 | styleSheet.insertRules(_this.id, resolvedName, stylisInstance(_this.rules, resolvedName, '@keyframes'));
|
785 | }
|
786 | };
|
787 | this.name = name;
|
788 | this.id = "sc-keyframes-".concat(name);
|
789 | this.rules = rules;
|
790 | setToString(this, function () {
|
791 | throw throwStyledComponentsError(12, String(_this.name));
|
792 | });
|
793 | }
|
794 | Keyframes.prototype.getName = function (stylisInstance) {
|
795 | if (stylisInstance === void 0) { stylisInstance = mainStylis; }
|
796 | return this.name + stylisInstance.hash;
|
797 | };
|
798 | return Keyframes;
|
799 | }());
|
800 |
|
801 | var unitlessKeys = {
|
802 | animationIterationCount: 1,
|
803 | borderImageOutset: 1,
|
804 | borderImageSlice: 1,
|
805 | borderImageWidth: 1,
|
806 | boxFlex: 1,
|
807 | boxFlexGroup: 1,
|
808 | boxOrdinalGroup: 1,
|
809 | columnCount: 1,
|
810 | columns: 1,
|
811 | flex: 1,
|
812 | flexGrow: 1,
|
813 | flexPositive: 1,
|
814 | flexShrink: 1,
|
815 | flexNegative: 1,
|
816 | flexOrder: 1,
|
817 | gridRow: 1,
|
818 | gridRowEnd: 1,
|
819 | gridRowSpan: 1,
|
820 | gridRowStart: 1,
|
821 | gridColumn: 1,
|
822 | gridColumnEnd: 1,
|
823 | gridColumnSpan: 1,
|
824 | gridColumnStart: 1,
|
825 | msGridRow: 1,
|
826 | msGridRowSpan: 1,
|
827 | msGridColumn: 1,
|
828 | msGridColumnSpan: 1,
|
829 | fontWeight: 1,
|
830 | lineHeight: 1,
|
831 | opacity: 1,
|
832 | order: 1,
|
833 | orphans: 1,
|
834 | tabSize: 1,
|
835 | widows: 1,
|
836 | zIndex: 1,
|
837 | zoom: 1,
|
838 | WebkitLineClamp: 1,
|
839 |
|
840 | fillOpacity: 1,
|
841 | floodOpacity: 1,
|
842 | stopOpacity: 1,
|
843 | strokeDasharray: 1,
|
844 | strokeDashoffset: 1,
|
845 | strokeMiterlimit: 1,
|
846 | strokeOpacity: 1,
|
847 | strokeWidth: 1
|
848 | };
|
849 |
|
850 |
|
851 | function addUnitIfNeeded(name, value) {
|
852 |
|
853 | if (value == null || typeof value === 'boolean' || value === '') {
|
854 | return '';
|
855 | }
|
856 | if (typeof value === 'number' && value !== 0 && !(name in unitlessKeys) && !name.startsWith('--')) {
|
857 | return "".concat(value, "px");
|
858 | }
|
859 | return String(value).trim();
|
860 | }
|
861 |
|
862 | function getComponentName(target) {
|
863 | return ((typeof target === 'string' && target ) ||
|
864 | target.displayName ||
|
865 | target.name ||
|
866 | 'Component');
|
867 | }
|
868 |
|
869 | var isUpper = function (c) { return c >= 'A' && c <= 'Z'; };
|
870 | |
871 |
|
872 |
|
873 |
|
874 |
|
875 |
|
876 |
|
877 |
|
878 |
|
879 |
|
880 |
|
881 |
|
882 |
|
883 | function hyphenateStyleName(string) {
|
884 | var output = '';
|
885 | for (var i = 0; i < string.length; i++) {
|
886 | var c = string[i];
|
887 |
|
888 | if (i === 1 && c === '-' && string[0] === '-') {
|
889 | return string;
|
890 | }
|
891 | if (isUpper(c)) {
|
892 | output += '-' + c.toLowerCase();
|
893 | }
|
894 | else {
|
895 | output += c;
|
896 | }
|
897 | }
|
898 | return output.startsWith('ms-') ? '-' + output : output;
|
899 | }
|
900 |
|
901 | function isFunction(test) {
|
902 | return typeof test === 'function';
|
903 | }
|
904 |
|
905 | function isPlainObject(x) {
|
906 | return (x !== null &&
|
907 | typeof x === 'object' &&
|
908 | x.constructor.name === Object.name &&
|
909 |
|
910 | !('props' in x && x.$$typeof));
|
911 | }
|
912 |
|
913 | function isStatelessFunction(test) {
|
914 | return isFunction(test) && !(test.prototype && test.prototype.isReactComponent);
|
915 | }
|
916 |
|
917 | function isStyledComponent(target) {
|
918 | return typeof target === 'object' && 'styledComponentId' in target;
|
919 | }
|
920 |
|
921 | |
922 |
|
923 |
|
924 | var isFalsish = function (chunk) {
|
925 | return chunk === undefined || chunk === null || chunk === false || chunk === '';
|
926 | };
|
927 | var objToCssArray = function (obj) {
|
928 | var rules = [];
|
929 | for (var key in obj) {
|
930 | var val = obj[key];
|
931 | if (!obj.hasOwnProperty(key) || isFalsish(val))
|
932 | continue;
|
933 |
|
934 | if ((Array.isArray(val) && val.isCss) || isFunction(val)) {
|
935 | rules.push("".concat(hyphenateStyleName(key), ":"), val, ';');
|
936 | }
|
937 | else if (isPlainObject(val)) {
|
938 | rules.push.apply(rules, __spreadArray(__spreadArray(["".concat(key, " {")], objToCssArray(val), false), ['}'], false));
|
939 | }
|
940 | else {
|
941 | rules.push("".concat(hyphenateStyleName(key), ": ").concat(addUnitIfNeeded(key, val), ";"));
|
942 | }
|
943 | }
|
944 | return rules;
|
945 | };
|
946 | function flatten(chunk, executionContext, styleSheet, stylisInstance) {
|
947 | if (isFalsish(chunk)) {
|
948 | return [];
|
949 | }
|
950 |
|
951 | if (isStyledComponent(chunk)) {
|
952 | return [".".concat(chunk.styledComponentId)];
|
953 | }
|
954 |
|
955 | if (isFunction(chunk)) {
|
956 | if (isStatelessFunction(chunk) && executionContext) {
|
957 | var result = chunk(executionContext);
|
958 | if (typeof result === 'object' &&
|
959 | !Array.isArray(result) &&
|
960 | !(result instanceof Keyframes) &&
|
961 | !isPlainObject(result) &&
|
962 | result !== null) {
|
963 | console.error("".concat(getComponentName(chunk), " is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details."));
|
964 | }
|
965 | return flatten(result, executionContext, styleSheet, stylisInstance);
|
966 | }
|
967 | else {
|
968 | return [chunk];
|
969 | }
|
970 | }
|
971 | if (chunk instanceof Keyframes) {
|
972 | if (styleSheet) {
|
973 | chunk.inject(styleSheet, stylisInstance);
|
974 | return [chunk.getName(stylisInstance)];
|
975 | }
|
976 | else {
|
977 | return [chunk];
|
978 | }
|
979 | }
|
980 |
|
981 | if (isPlainObject(chunk)) {
|
982 | return objToCssArray(chunk);
|
983 | }
|
984 | if (!Array.isArray(chunk)) {
|
985 | return [chunk.toString()];
|
986 | }
|
987 | return flatMap(chunk, function (chunklet) {
|
988 | return flatten(chunklet, executionContext, styleSheet, stylisInstance);
|
989 | });
|
990 | }
|
991 | function flatMap(array, transform) {
|
992 | return Array.prototype.concat.apply(EMPTY_ARRAY, array.map(transform));
|
993 | }
|
994 |
|
995 | function isStaticRules(rules) {
|
996 | for (var i = 0; i < rules.length; i += 1) {
|
997 | var rule = rules[i];
|
998 | if (isFunction(rule) && !isStyledComponent(rule)) {
|
999 |
|
1000 |
|
1001 | return false;
|
1002 | }
|
1003 | }
|
1004 | return true;
|
1005 | }
|
1006 |
|
1007 | |
1008 |
|
1009 |
|
1010 | function joinStrings(a, b) {
|
1011 | return a && b ? "".concat(a, " ").concat(b) : a || b || '';
|
1012 | }
|
1013 | function joinStringArray(arr, sep) {
|
1014 | if (arr.length === 0) {
|
1015 | return '';
|
1016 | }
|
1017 | var result = arr[0];
|
1018 | for (var i = 1; i < arr.length; i++) {
|
1019 | result += sep ? sep + arr[i] : arr[i];
|
1020 | }
|
1021 | return result;
|
1022 | }
|
1023 |
|
1024 | var GlobalStyle = (function () {
|
1025 | function GlobalStyle(rules, componentId) {
|
1026 | this.rules = rules;
|
1027 | this.componentId = componentId;
|
1028 | this.isStatic = isStaticRules(rules);
|
1029 |
|
1030 |
|
1031 | StyleSheet.registerId(this.componentId + 1);
|
1032 | }
|
1033 | GlobalStyle.prototype.createStyles = function (instance, executionContext, styleSheet, stylis) {
|
1034 | var flatCSS = joinStringArray(flatten(this.rules, executionContext, styleSheet, stylis));
|
1035 | var css = stylis(flatCSS, '');
|
1036 | var id = this.componentId + instance;
|
1037 |
|
1038 | styleSheet.insertRules(id, id, css);
|
1039 | };
|
1040 | GlobalStyle.prototype.removeStyles = function (instance, styleSheet) {
|
1041 | styleSheet.clearRules(this.componentId + instance);
|
1042 | };
|
1043 | GlobalStyle.prototype.renderStyles = function (instance, executionContext, styleSheet, stylis) {
|
1044 | if (instance > 2)
|
1045 | StyleSheet.registerId(this.componentId + instance);
|
1046 |
|
1047 | this.removeStyles(instance, styleSheet);
|
1048 | this.createStyles(instance, executionContext, styleSheet, stylis);
|
1049 | };
|
1050 | return GlobalStyle;
|
1051 | }());
|
1052 |
|
1053 | var ThemeContext = React.createContext(undefined);
|
1054 | var ThemeConsumer = ThemeContext.Consumer;
|
1055 | function mergeTheme(theme, outerTheme) {
|
1056 | if (!theme) {
|
1057 | throw throwStyledComponentsError(14);
|
1058 | }
|
1059 | if (isFunction(theme)) {
|
1060 | var themeFn = theme;
|
1061 | var mergedTheme = themeFn(outerTheme);
|
1062 | if ((mergedTheme === null || Array.isArray(mergedTheme) || typeof mergedTheme !== 'object')) {
|
1063 | throw throwStyledComponentsError(7);
|
1064 | }
|
1065 | return mergedTheme;
|
1066 | }
|
1067 | if (Array.isArray(theme) || typeof theme !== 'object') {
|
1068 | throw throwStyledComponentsError(8);
|
1069 | }
|
1070 | return outerTheme ? __assign(__assign({}, outerTheme), theme) : theme;
|
1071 | }
|
1072 | |
1073 |
|
1074 |
|
1075 |
|
1076 |
|
1077 |
|
1078 |
|
1079 | function useTheme() {
|
1080 | var theme = React.useContext(ThemeContext);
|
1081 | if (!theme) {
|
1082 | throw throwStyledComponentsError(18);
|
1083 | }
|
1084 | return theme;
|
1085 | }
|
1086 | |
1087 |
|
1088 |
|
1089 | function ThemeProvider(props) {
|
1090 | var outerTheme = React.useContext(ThemeContext);
|
1091 | var themeContext = React.useMemo(function () { return mergeTheme(props.theme, outerTheme); }, [props.theme, outerTheme]);
|
1092 | if (!props.children) {
|
1093 | return null;
|
1094 | }
|
1095 | return React.createElement(ThemeContext.Provider, { value: themeContext }, props.children);
|
1096 | }
|
1097 |
|
1098 | var invalidHookCallRe = /invalid hook call/i;
|
1099 | var seen = new Set();
|
1100 | var checkDynamicCreation = function (displayName, componentId) {
|
1101 | {
|
1102 | var parsedIdString = componentId ? " with the id of \"".concat(componentId, "\"") : '';
|
1103 | var message_1 = "The component ".concat(displayName).concat(parsedIdString, " has been created dynamically.\n") +
|
1104 | "You may see this warning because you've called styled inside another component.\n" +
|
1105 | 'To resolve this only create new StyledComponents outside of any render method and function component.';
|
1106 |
|
1107 |
|
1108 |
|
1109 | var originalConsoleError_1 = console.error;
|
1110 | try {
|
1111 | var didNotCallInvalidHook_1 = true;
|
1112 | console.error = function (consoleErrorMessage) {
|
1113 | var consoleErrorArgs = [];
|
1114 | for (var _i = 1; _i < arguments.length; _i++) {
|
1115 | consoleErrorArgs[_i - 1] = arguments[_i];
|
1116 | }
|
1117 |
|
1118 |
|
1119 | if (invalidHookCallRe.test(consoleErrorMessage)) {
|
1120 | didNotCallInvalidHook_1 = false;
|
1121 |
|
1122 | seen.delete(message_1);
|
1123 | }
|
1124 | else {
|
1125 | originalConsoleError_1.apply(void 0, __spreadArray([consoleErrorMessage], consoleErrorArgs, false));
|
1126 | }
|
1127 | };
|
1128 |
|
1129 |
|
1130 | React.useRef();
|
1131 | if (didNotCallInvalidHook_1 && !seen.has(message_1)) {
|
1132 | console.warn(message_1);
|
1133 | seen.add(message_1);
|
1134 | }
|
1135 | }
|
1136 | catch (error) {
|
1137 |
|
1138 |
|
1139 | if (invalidHookCallRe.test(error.message)) {
|
1140 |
|
1141 | seen.delete(message_1);
|
1142 | }
|
1143 | }
|
1144 | finally {
|
1145 | console.error = originalConsoleError_1;
|
1146 | }
|
1147 | }
|
1148 | };
|
1149 |
|
1150 | function determineTheme(props, providedTheme, defaultProps) {
|
1151 | if (defaultProps === void 0) { defaultProps = EMPTY_OBJECT; }
|
1152 | return (props.theme !== defaultProps.theme && props.theme) || providedTheme || defaultProps.theme;
|
1153 | }
|
1154 |
|
1155 | var AD_REPLACER_R = /(a)(d)/gi;
|
1156 | |
1157 |
|
1158 | var charsLength = 52;
|
1159 |
|
1160 | var getAlphabeticChar = function (code) { return String.fromCharCode(code + (code > 25 ? 39 : 97)); };
|
1161 |
|
1162 | function generateAlphabeticName(code) {
|
1163 | var name = '';
|
1164 | var x;
|
1165 |
|
1166 | for (x = Math.abs(code); x > charsLength; x = (x / charsLength) | 0) {
|
1167 | name = getAlphabeticChar(x % charsLength) + name;
|
1168 | }
|
1169 | return (getAlphabeticChar(x % charsLength) + name).replace(AD_REPLACER_R, '$1-$2');
|
1170 | }
|
1171 |
|
1172 | function generateComponentId(str) {
|
1173 | return generateAlphabeticName(hash(str) >>> 0);
|
1174 | }
|
1175 |
|
1176 | function interleave(strings, interpolations) {
|
1177 | var result = [strings[0]];
|
1178 | for (var i = 0, len = interpolations.length; i < len; i += 1) {
|
1179 | result.push(interpolations[i], strings[i + 1]);
|
1180 | }
|
1181 | return result;
|
1182 | }
|
1183 |
|
1184 | |
1185 |
|
1186 |
|
1187 |
|
1188 | var addTag = function (arg) {
|
1189 | return Object.assign(arg, { isCss: true });
|
1190 | };
|
1191 | function css(styles) {
|
1192 | var interpolations = [];
|
1193 | for (var _i = 1; _i < arguments.length; _i++) {
|
1194 | interpolations[_i - 1] = arguments[_i];
|
1195 | }
|
1196 | if (isFunction(styles) || isPlainObject(styles)) {
|
1197 | var styleFunctionOrObject = styles;
|
1198 | return addTag(flatten(interleave(EMPTY_ARRAY, __spreadArray([
|
1199 | styleFunctionOrObject
|
1200 | ], interpolations, true))));
|
1201 | }
|
1202 | var styleStringArray = styles;
|
1203 | if (interpolations.length === 0 &&
|
1204 | styleStringArray.length === 1 &&
|
1205 | typeof styleStringArray[0] === 'string') {
|
1206 | return flatten(styleStringArray);
|
1207 | }
|
1208 | return addTag(flatten(interleave(styleStringArray, interpolations)));
|
1209 | }
|
1210 |
|
1211 | function createGlobalStyle(strings) {
|
1212 | var interpolations = [];
|
1213 | for (var _i = 1; _i < arguments.length; _i++) {
|
1214 | interpolations[_i - 1] = arguments[_i];
|
1215 | }
|
1216 | var rules = css.apply(void 0, __spreadArray([strings], interpolations, false));
|
1217 | var styledComponentId = "sc-global-".concat(generateComponentId(JSON.stringify(rules)));
|
1218 | var globalStyle = new GlobalStyle(rules, styledComponentId);
|
1219 | {
|
1220 | checkDynamicCreation(styledComponentId);
|
1221 | }
|
1222 | var GlobalStyleComponent = function (props) {
|
1223 | var ssc = useStyleSheetContext();
|
1224 | var theme = React.useContext(ThemeContext);
|
1225 | var instanceRef = React.useRef(ssc.styleSheet.allocateGSInstance(styledComponentId));
|
1226 | var instance = instanceRef.current;
|
1227 | if (React.Children.count(props.children)) {
|
1228 | console.warn("The global style component ".concat(styledComponentId, " was given child JSX. createGlobalStyle does not render children."));
|
1229 | }
|
1230 | if (rules.some(function (rule) { return typeof rule === 'string' && rule.indexOf('@import') !== -1; })) {
|
1231 | console.warn("Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical <link> meta tag to the stylesheet, or simply embedding it manually in your index.html <head> section for a simpler app.");
|
1232 | }
|
1233 | if (ssc.styleSheet.server) {
|
1234 | renderStyles(instance, props, ssc.styleSheet, theme, ssc.stylis);
|
1235 | }
|
1236 | {
|
1237 | React.useLayoutEffect(function () {
|
1238 | if (!ssc.styleSheet.server) {
|
1239 | renderStyles(instance, props, ssc.styleSheet, theme, ssc.stylis);
|
1240 | return function () { return globalStyle.removeStyles(instance, ssc.styleSheet); };
|
1241 | }
|
1242 | }, [instance, props, ssc.styleSheet, theme, ssc.stylis]);
|
1243 | }
|
1244 | return null;
|
1245 | };
|
1246 | function renderStyles(instance, props, styleSheet, theme, stylis) {
|
1247 | if (globalStyle.isStatic) {
|
1248 | globalStyle.renderStyles(instance, STATIC_EXECUTION_CONTEXT, styleSheet, stylis);
|
1249 | }
|
1250 | else {
|
1251 | var context = __assign(__assign({}, props), { theme: determineTheme(props, theme, GlobalStyleComponent.defaultProps) });
|
1252 | globalStyle.renderStyles(instance, context, styleSheet, stylis);
|
1253 | }
|
1254 | }
|
1255 | return React.memo(GlobalStyleComponent);
|
1256 | }
|
1257 |
|
1258 | function keyframes(strings) {
|
1259 | var interpolations = [];
|
1260 | for (var _i = 1; _i < arguments.length; _i++) {
|
1261 | interpolations[_i - 1] = arguments[_i];
|
1262 | }
|
1263 |
|
1264 | if (typeof navigator !== 'undefined' &&
|
1265 | navigator.product === 'ReactNative') {
|
1266 | console.warn('`keyframes` cannot be used on ReactNative, only on the web. To do animation in ReactNative please use Animated.');
|
1267 | }
|
1268 | var rules = joinStringArray(css.apply(void 0, __spreadArray([strings], interpolations, false)));
|
1269 | var name = generateComponentId(rules);
|
1270 | return new Keyframes(name, rules);
|
1271 | }
|
1272 |
|
1273 | var _a;
|
1274 | var hasSymbol = typeof Symbol === 'function' && Symbol.for;
|
1275 |
|
1276 | var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
|
1277 | var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
|
1278 | |
1279 |
|
1280 |
|
1281 | var REACT_STATICS = {
|
1282 | childContextTypes: true,
|
1283 | contextType: true,
|
1284 | contextTypes: true,
|
1285 | defaultProps: true,
|
1286 | displayName: true,
|
1287 | getDefaultProps: true,
|
1288 | getDerivedStateFromError: true,
|
1289 | getDerivedStateFromProps: true,
|
1290 | mixins: true,
|
1291 | propTypes: true,
|
1292 | type: true,
|
1293 | };
|
1294 | var KNOWN_STATICS = {
|
1295 | name: true,
|
1296 | length: true,
|
1297 | prototype: true,
|
1298 | caller: true,
|
1299 | callee: true,
|
1300 | arguments: true,
|
1301 | arity: true,
|
1302 | };
|
1303 | var FORWARD_REF_STATICS = {
|
1304 | $$typeof: true,
|
1305 | render: true,
|
1306 | defaultProps: true,
|
1307 | displayName: true,
|
1308 | propTypes: true,
|
1309 | };
|
1310 | var MEMO_STATICS = {
|
1311 | $$typeof: true,
|
1312 | compare: true,
|
1313 | defaultProps: true,
|
1314 | displayName: true,
|
1315 | propTypes: true,
|
1316 | type: true,
|
1317 | };
|
1318 | var TYPE_STATICS = (_a = {},
|
1319 | _a[REACT_FORWARD_REF_TYPE] = FORWARD_REF_STATICS,
|
1320 | _a[REACT_MEMO_TYPE] = MEMO_STATICS,
|
1321 | _a);
|
1322 |
|
1323 | function isMemo(object) {
|
1324 | var $$typeofType = 'type' in object && object.type.$$typeof;
|
1325 | return $$typeofType === REACT_MEMO_TYPE;
|
1326 | }
|
1327 | function getStatics(component) {
|
1328 |
|
1329 | if (isMemo(component)) {
|
1330 | return MEMO_STATICS;
|
1331 | }
|
1332 |
|
1333 | return '$$typeof' in component
|
1334 | ? TYPE_STATICS[component['$$typeof']]
|
1335 | : REACT_STATICS;
|
1336 | }
|
1337 | var defineProperty = Object.defineProperty;
|
1338 | var getOwnPropertyNames = Object.getOwnPropertyNames;
|
1339 | var getOwnPropertySymbols = Object.getOwnPropertySymbols;
|
1340 | var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
|
1341 | var getPrototypeOf = Object.getPrototypeOf;
|
1342 | var objectPrototype = Object.prototype;
|
1343 | function hoistNonReactStatics(targetComponent, sourceComponent, excludelist) {
|
1344 | if (typeof sourceComponent !== 'string') {
|
1345 |
|
1346 | if (objectPrototype) {
|
1347 | var inheritedComponent = getPrototypeOf(sourceComponent);
|
1348 | if (inheritedComponent && inheritedComponent !== objectPrototype) {
|
1349 | hoistNonReactStatics(targetComponent, inheritedComponent, excludelist);
|
1350 | }
|
1351 | }
|
1352 | var keys = getOwnPropertyNames(sourceComponent);
|
1353 | if (getOwnPropertySymbols) {
|
1354 | keys = keys.concat(getOwnPropertySymbols(sourceComponent));
|
1355 | }
|
1356 | var targetStatics = getStatics(targetComponent);
|
1357 | var sourceStatics = getStatics(sourceComponent);
|
1358 | for (var i = 0; i < keys.length; ++i) {
|
1359 | var key = keys[i];
|
1360 | if (!(key in KNOWN_STATICS) &&
|
1361 | !(excludelist && excludelist[key]) &&
|
1362 | !(sourceStatics && key in sourceStatics) &&
|
1363 | !(targetStatics && key in targetStatics)) {
|
1364 | var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
|
1365 | try {
|
1366 |
|
1367 | defineProperty(targetComponent, key, descriptor);
|
1368 | }
|
1369 | catch (e) {
|
1370 |
|
1371 | }
|
1372 | }
|
1373 | }
|
1374 | }
|
1375 | return targetComponent;
|
1376 | }
|
1377 |
|
1378 | function withTheme(Component) {
|
1379 | var WithTheme = React.forwardRef(function (props, ref) {
|
1380 | var theme = React.useContext(ThemeContext);
|
1381 | var themeProp = determineTheme(props, theme, Component.defaultProps);
|
1382 | if (themeProp === undefined) {
|
1383 | console.warn("[withTheme] You are not using a ThemeProvider nor passing a theme prop or a theme in defaultProps in component class \"".concat(getComponentName(Component), "\""));
|
1384 | }
|
1385 | return React.createElement(Component, __assign({}, props, { theme: themeProp, ref: ref }));
|
1386 | });
|
1387 | WithTheme.displayName = "WithTheme(".concat(getComponentName(Component), ")");
|
1388 | return hoistNonReactStatics(WithTheme, Component);
|
1389 | }
|
1390 |
|
1391 | var ServerStyleSheet = (function () {
|
1392 | function ServerStyleSheet() {
|
1393 | var _this = this;
|
1394 | this._emitSheetCSS = function () {
|
1395 | var css = _this.instance.toString();
|
1396 | var nonce = getNonce();
|
1397 | var attrs = [
|
1398 | nonce && "nonce=\"".concat(nonce, "\""),
|
1399 | "".concat(SC_ATTR, "=\"true\""),
|
1400 | "".concat(SC_ATTR_VERSION, "=\"").concat(SC_VERSION, "\""),
|
1401 | ];
|
1402 | var htmlAttr = joinStringArray(attrs.filter(Boolean), ' ');
|
1403 | return "<style ".concat(htmlAttr, ">").concat(css, "</style>");
|
1404 | };
|
1405 | this.getStyleTags = function () {
|
1406 | if (_this.sealed) {
|
1407 | throw throwStyledComponentsError(2);
|
1408 | }
|
1409 | return _this._emitSheetCSS();
|
1410 | };
|
1411 | this.getStyleElement = function () {
|
1412 | var _a;
|
1413 | if (_this.sealed) {
|
1414 | throw throwStyledComponentsError(2);
|
1415 | }
|
1416 | var props = (_a = {},
|
1417 | _a[SC_ATTR] = '',
|
1418 | _a[SC_ATTR_VERSION] = SC_VERSION,
|
1419 | _a.dangerouslySetInnerHTML = {
|
1420 | __html: _this.instance.toString(),
|
1421 | },
|
1422 | _a);
|
1423 | var nonce = getNonce();
|
1424 | if (nonce) {
|
1425 | props.nonce = nonce;
|
1426 | }
|
1427 |
|
1428 | return [React.createElement("style", __assign({}, props, { key: "sc-0-0" }))];
|
1429 | };
|
1430 | this.seal = function () {
|
1431 | _this.sealed = true;
|
1432 | };
|
1433 | this.instance = new StyleSheet({ isServer: true });
|
1434 | this.sealed = false;
|
1435 | }
|
1436 | ServerStyleSheet.prototype.collectStyles = function (children) {
|
1437 | if (this.sealed) {
|
1438 | throw throwStyledComponentsError(2);
|
1439 | }
|
1440 | return React.createElement(StyleSheetManager, { sheet: this.instance }, children);
|
1441 | };
|
1442 |
|
1443 | ServerStyleSheet.prototype.interleaveWithNodeStream = function (input) {
|
1444 | {
|
1445 | throw throwStyledComponentsError(3);
|
1446 | }
|
1447 | };
|
1448 | return ServerStyleSheet;
|
1449 | }());
|
1450 |
|
1451 | var __PRIVATE__ = {
|
1452 | StyleSheet: StyleSheet,
|
1453 | mainSheet: mainSheet,
|
1454 | };
|
1455 |
|
1456 |
|
1457 |
|
1458 | if (typeof navigator !== 'undefined' &&
|
1459 | navigator.product === 'ReactNative') {
|
1460 | console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native");
|
1461 | }
|
1462 | var windowGlobalKey = "__sc-".concat(SC_ATTR, "__");
|
1463 |
|
1464 | if (typeof window !== 'undefined') {
|
1465 |
|
1466 | window[windowGlobalKey] || (window[windowGlobalKey] = 0);
|
1467 |
|
1468 | if (window[windowGlobalKey] === 1) {
|
1469 | console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info.");
|
1470 | }
|
1471 |
|
1472 | window[windowGlobalKey] += 1;
|
1473 | }
|
1474 |
|
1475 | var secondary = Object.freeze({
|
1476 | __proto__: null,
|
1477 | ServerStyleSheet: ServerStyleSheet,
|
1478 | StyleSheetConsumer: StyleSheetConsumer,
|
1479 | StyleSheetContext: StyleSheetContext,
|
1480 | StyleSheetManager: StyleSheetManager,
|
1481 | ThemeConsumer: ThemeConsumer,
|
1482 | ThemeContext: ThemeContext,
|
1483 | ThemeProvider: ThemeProvider,
|
1484 | __PRIVATE__: __PRIVATE__,
|
1485 | createGlobalStyle: createGlobalStyle,
|
1486 | css: css,
|
1487 | isStyledComponent: isStyledComponent,
|
1488 | keyframes: keyframes,
|
1489 | useTheme: useTheme,
|
1490 | version: SC_VERSION,
|
1491 | withTheme: withTheme
|
1492 | });
|
1493 |
|
1494 | function memoize(fn) {
|
1495 | var cache = Object.create(null);
|
1496 | return function (arg) {
|
1497 | if (cache[arg] === undefined) cache[arg] = fn(arg);
|
1498 | return cache[arg];
|
1499 | };
|
1500 | }
|
1501 |
|
1502 | 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)-.*))$/;
|
1503 |
|
1504 | var isPropValid = memoize(function (prop) {
|
1505 | return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
|
1506 |
|
1507 | && prop.charCodeAt(1) === 110
|
1508 |
|
1509 | && prop.charCodeAt(2) < 91;
|
1510 | }
|
1511 |
|
1512 | );
|
1513 |
|
1514 | var LIMIT = 200;
|
1515 | var createWarnTooManyClasses = (function (displayName, componentId) {
|
1516 | var generatedClasses = {};
|
1517 | var warningSeen = false;
|
1518 | return function (className) {
|
1519 | if (!warningSeen) {
|
1520 | generatedClasses[className] = true;
|
1521 | if (Object.keys(generatedClasses).length >= LIMIT) {
|
1522 |
|
1523 | var parsedIdString = componentId ? " with the id of \"".concat(componentId, "\"") : '';
|
1524 | console.warn("Over ".concat(LIMIT, " classes were generated for component ").concat(displayName).concat(parsedIdString, ".\n") +
|
1525 | 'Consider using the attrs method, together with a style object for frequently changed styles.\n' +
|
1526 | 'Example:\n' +
|
1527 | ' const Component = styled.div.attrs(props => ({\n' +
|
1528 | ' style: {\n' +
|
1529 | ' background: props.background,\n' +
|
1530 | ' },\n' +
|
1531 | ' }))`width: 100%;`\n\n' +
|
1532 | ' <Component />');
|
1533 | warningSeen = true;
|
1534 | generatedClasses = {};
|
1535 | }
|
1536 | }
|
1537 | };
|
1538 | });
|
1539 |
|
1540 |
|
1541 | var elements = [
|
1542 | 'a',
|
1543 | 'abbr',
|
1544 | 'address',
|
1545 | 'area',
|
1546 | 'article',
|
1547 | 'aside',
|
1548 | 'audio',
|
1549 | 'b',
|
1550 | 'base',
|
1551 | 'bdi',
|
1552 | 'bdo',
|
1553 | 'big',
|
1554 | 'blockquote',
|
1555 | 'body',
|
1556 | 'br',
|
1557 | 'button',
|
1558 | 'canvas',
|
1559 | 'caption',
|
1560 | 'cite',
|
1561 | 'code',
|
1562 | 'col',
|
1563 | 'colgroup',
|
1564 | 'data',
|
1565 | 'datalist',
|
1566 | 'dd',
|
1567 | 'del',
|
1568 | 'details',
|
1569 | 'dfn',
|
1570 | 'dialog',
|
1571 | 'div',
|
1572 | 'dl',
|
1573 | 'dt',
|
1574 | 'em',
|
1575 | 'embed',
|
1576 | 'fieldset',
|
1577 | 'figcaption',
|
1578 | 'figure',
|
1579 | 'footer',
|
1580 | 'form',
|
1581 | 'h1',
|
1582 | 'h2',
|
1583 | 'h3',
|
1584 | 'h4',
|
1585 | 'h5',
|
1586 | 'h6',
|
1587 | 'header',
|
1588 | 'hgroup',
|
1589 | 'hr',
|
1590 | 'html',
|
1591 | 'i',
|
1592 | 'iframe',
|
1593 | 'img',
|
1594 | 'input',
|
1595 | 'ins',
|
1596 | 'kbd',
|
1597 | 'keygen',
|
1598 | 'label',
|
1599 | 'legend',
|
1600 | 'li',
|
1601 | 'link',
|
1602 | 'main',
|
1603 | 'map',
|
1604 | 'mark',
|
1605 | 'menu',
|
1606 | 'menuitem',
|
1607 | 'meta',
|
1608 | 'meter',
|
1609 | 'nav',
|
1610 | 'noscript',
|
1611 | 'object',
|
1612 | 'ol',
|
1613 | 'optgroup',
|
1614 | 'option',
|
1615 | 'output',
|
1616 | 'p',
|
1617 | 'param',
|
1618 | 'picture',
|
1619 | 'pre',
|
1620 | 'progress',
|
1621 | 'q',
|
1622 | 'rp',
|
1623 | 'rt',
|
1624 | 'ruby',
|
1625 | 's',
|
1626 | 'samp',
|
1627 | 'script',
|
1628 | 'section',
|
1629 | 'select',
|
1630 | 'small',
|
1631 | 'source',
|
1632 | 'span',
|
1633 | 'strong',
|
1634 | 'style',
|
1635 | 'sub',
|
1636 | 'summary',
|
1637 | 'sup',
|
1638 | 'table',
|
1639 | 'tbody',
|
1640 | 'td',
|
1641 | 'textarea',
|
1642 | 'tfoot',
|
1643 | 'th',
|
1644 | 'thead',
|
1645 | 'time',
|
1646 | 'tr',
|
1647 | 'track',
|
1648 | 'u',
|
1649 | 'ul',
|
1650 | 'use',
|
1651 | 'var',
|
1652 | 'video',
|
1653 | 'wbr',
|
1654 | 'circle',
|
1655 | 'clipPath',
|
1656 | 'defs',
|
1657 | 'ellipse',
|
1658 | 'foreignObject',
|
1659 | 'g',
|
1660 | 'image',
|
1661 | 'line',
|
1662 | 'linearGradient',
|
1663 | 'marker',
|
1664 | 'mask',
|
1665 | 'path',
|
1666 | 'pattern',
|
1667 | 'polygon',
|
1668 | 'polyline',
|
1669 | 'radialGradient',
|
1670 | 'rect',
|
1671 | 'stop',
|
1672 | 'svg',
|
1673 | 'text',
|
1674 | 'tspan',
|
1675 | ];
|
1676 | var domElements = new Set(elements);
|
1677 |
|
1678 |
|
1679 |
|
1680 | var escapeRegex = /[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g;
|
1681 | var dashesAtEnds = /(^-|-$)/g;
|
1682 | |
1683 |
|
1684 |
|
1685 |
|
1686 | function escape(str) {
|
1687 | return str
|
1688 | .replace(escapeRegex, '-')
|
1689 | .replace(dashesAtEnds, '');
|
1690 | }
|
1691 |
|
1692 | function isTag(target) {
|
1693 | return (typeof target === 'string' &&
|
1694 | (target.charAt(0) === target.charAt(0).toLowerCase()
|
1695 | ));
|
1696 | }
|
1697 |
|
1698 | function generateDisplayName(target) {
|
1699 | return isTag(target) ? "styled.".concat(target) : "Styled(".concat(getComponentName(target), ")");
|
1700 | }
|
1701 |
|
1702 | function mixinRecursively(target, source, forceMerge) {
|
1703 | if (forceMerge === void 0) { forceMerge = false; }
|
1704 | |
1705 |
|
1706 | if (!forceMerge && !isPlainObject(target) && !Array.isArray(target)) {
|
1707 | return source;
|
1708 | }
|
1709 | if (Array.isArray(source)) {
|
1710 | for (var key = 0; key < source.length; key++) {
|
1711 | target[key] = mixinRecursively(target[key], source[key]);
|
1712 | }
|
1713 | }
|
1714 | else if (isPlainObject(source)) {
|
1715 | for (var key in source) {
|
1716 | target[key] = mixinRecursively(target[key], source[key]);
|
1717 | }
|
1718 | }
|
1719 | return target;
|
1720 | }
|
1721 | |
1722 |
|
1723 |
|
1724 |
|
1725 |
|
1726 | function mixinDeep(target) {
|
1727 | var sources = [];
|
1728 | for (var _i = 1; _i < arguments.length; _i++) {
|
1729 | sources[_i - 1] = arguments[_i];
|
1730 | }
|
1731 | for (var _a = 0, sources_1 = sources; _a < sources_1.length; _a++) {
|
1732 | var source = sources_1[_a];
|
1733 | mixinRecursively(target, source, true);
|
1734 | }
|
1735 | return target;
|
1736 | }
|
1737 |
|
1738 | var SEED = hash(SC_VERSION);
|
1739 | |
1740 |
|
1741 |
|
1742 | var ComponentStyle = (function () {
|
1743 | function ComponentStyle(rules, componentId, baseStyle) {
|
1744 | this.rules = rules;
|
1745 | this.staticRulesId = '';
|
1746 | this.isStatic =
|
1747 | "development" === 'production' ;
|
1748 | this.componentId = componentId;
|
1749 | this.baseHash = phash(SEED, componentId);
|
1750 | this.baseStyle = baseStyle;
|
1751 |
|
1752 |
|
1753 | StyleSheet.registerId(componentId);
|
1754 | }
|
1755 | ComponentStyle.prototype.generateAndInjectStyles = function (executionContext, styleSheet, stylis) {
|
1756 | var names = this.baseStyle
|
1757 | ? this.baseStyle.generateAndInjectStyles(executionContext, styleSheet, stylis)
|
1758 | : '';
|
1759 |
|
1760 | if (this.isStatic && !stylis.hash) {
|
1761 | if (this.staticRulesId && styleSheet.hasNameForId(this.componentId, this.staticRulesId)) {
|
1762 | names = joinStrings(names, this.staticRulesId);
|
1763 | }
|
1764 | else {
|
1765 | var cssStatic = joinStringArray(flatten(this.rules, executionContext, styleSheet, stylis));
|
1766 | var name_1 = generateAlphabeticName(phash(this.baseHash, cssStatic) >>> 0);
|
1767 | if (!styleSheet.hasNameForId(this.componentId, name_1)) {
|
1768 | var cssStaticFormatted = stylis(cssStatic, ".".concat(name_1), undefined, this.componentId);
|
1769 | styleSheet.insertRules(this.componentId, name_1, cssStaticFormatted);
|
1770 | }
|
1771 | names = joinStrings(names, name_1);
|
1772 | this.staticRulesId = name_1;
|
1773 | }
|
1774 | }
|
1775 | else {
|
1776 | var dynamicHash = phash(this.baseHash, stylis.hash);
|
1777 | var css = '';
|
1778 | for (var i = 0; i < this.rules.length; i++) {
|
1779 | var partRule = this.rules[i];
|
1780 | if (typeof partRule === 'string') {
|
1781 | css += partRule;
|
1782 | dynamicHash = phash(dynamicHash, partRule);
|
1783 | }
|
1784 | else if (partRule) {
|
1785 | var partString = joinStringArray(flatten(partRule, executionContext, styleSheet, stylis));
|
1786 |
|
1787 | dynamicHash = phash(dynamicHash, partString + i);
|
1788 | css += partString;
|
1789 | }
|
1790 | }
|
1791 | if (css) {
|
1792 | var name_2 = generateAlphabeticName(dynamicHash >>> 0);
|
1793 | if (!styleSheet.hasNameForId(this.componentId, name_2)) {
|
1794 | styleSheet.insertRules(this.componentId, name_2, stylis(css, ".".concat(name_2), undefined, this.componentId));
|
1795 | }
|
1796 | names = joinStrings(names, name_2);
|
1797 | }
|
1798 | }
|
1799 | return names;
|
1800 | };
|
1801 | return ComponentStyle;
|
1802 | }());
|
1803 |
|
1804 | var identifiers = {};
|
1805 |
|
1806 | function generateId(displayName, parentComponentId) {
|
1807 | var name = typeof displayName !== 'string' ? 'sc' : escape(displayName);
|
1808 |
|
1809 | identifiers[name] = (identifiers[name] || 0) + 1;
|
1810 | var componentId = "".concat(name, "-").concat(generateComponentId(
|
1811 |
|
1812 |
|
1813 | SC_VERSION + name + identifiers[name]));
|
1814 | return parentComponentId ? "".concat(parentComponentId, "-").concat(componentId) : componentId;
|
1815 | }
|
1816 | function useInjectedStyle(componentStyle, resolvedAttrs) {
|
1817 | var ssc = useStyleSheetContext();
|
1818 | var className = componentStyle.generateAndInjectStyles(resolvedAttrs, ssc.styleSheet, ssc.stylis);
|
1819 | React.useDebugValue(className);
|
1820 | return className;
|
1821 | }
|
1822 | function resolveContext(attrs, props, theme) {
|
1823 | var context = __assign(__assign({}, props), {
|
1824 |
|
1825 | className: undefined, theme: theme });
|
1826 | var attrDef;
|
1827 | for (var i = 0; i < attrs.length; i += 1) {
|
1828 | attrDef = attrs[i];
|
1829 | var resolvedAttrDef = isFunction(attrDef) ? attrDef(context) : attrDef;
|
1830 | for (var key in resolvedAttrDef) {
|
1831 | context[key] =
|
1832 | key === 'className'
|
1833 | ? joinStrings(context[key], resolvedAttrDef[key])
|
1834 | : key === 'style'
|
1835 | ? __assign(__assign({}, context[key]), resolvedAttrDef[key]) : resolvedAttrDef[key];
|
1836 | }
|
1837 | }
|
1838 | if (props.className) {
|
1839 | context.className = joinStrings(context.className, props.className);
|
1840 | }
|
1841 | return context;
|
1842 | }
|
1843 | var seenUnknownProps = new Set();
|
1844 | function useStyledComponentImpl(forwardedComponent, props, forwardedRef) {
|
1845 | var componentAttrs = forwardedComponent.attrs, componentStyle = forwardedComponent.componentStyle, defaultProps = forwardedComponent.defaultProps, foldedComponentIds = forwardedComponent.foldedComponentIds, styledComponentId = forwardedComponent.styledComponentId, target = forwardedComponent.target;
|
1846 | var contextTheme = React.useContext(ThemeContext);
|
1847 | var ssc = useStyleSheetContext();
|
1848 | var shouldForwardProp = forwardedComponent.shouldForwardProp || ssc.shouldForwardProp;
|
1849 | React.useDebugValue(styledComponentId);
|
1850 |
|
1851 |
|
1852 |
|
1853 | var theme = determineTheme(props, contextTheme, defaultProps) || EMPTY_OBJECT;
|
1854 | var context = resolveContext(componentAttrs, props, theme);
|
1855 | var elementToBeCreated = context.as || target;
|
1856 | var propsForElement = {};
|
1857 | for (var key in context) {
|
1858 | if (context[key] === undefined) ;
|
1859 | else if (key[0] === '$' || key === 'as' || (key === 'theme' && context.theme === theme)) ;
|
1860 | else if (key === 'forwardedAs') {
|
1861 | propsForElement.as = context.forwardedAs;
|
1862 | }
|
1863 | else if (!shouldForwardProp || shouldForwardProp(key, elementToBeCreated)) {
|
1864 | propsForElement[key] = context[key];
|
1865 | if (!shouldForwardProp &&
|
1866 | "development" === 'development' &&
|
1867 | !isPropValid(key) &&
|
1868 | !seenUnknownProps.has(key) &&
|
1869 |
|
1870 | domElements.has(elementToBeCreated)) {
|
1871 | seenUnknownProps.add(key);
|
1872 | console.warn("styled-components: it looks like an unknown prop \"".concat(key, "\" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)"));
|
1873 | }
|
1874 | }
|
1875 | }
|
1876 | var generatedClassName = useInjectedStyle(componentStyle, context);
|
1877 | if (forwardedComponent.warnTooManyClasses) {
|
1878 | forwardedComponent.warnTooManyClasses(generatedClassName);
|
1879 | }
|
1880 | var classString = joinStrings(foldedComponentIds, styledComponentId);
|
1881 | if (generatedClassName) {
|
1882 | classString += ' ' + generatedClassName;
|
1883 | }
|
1884 | if (context.className) {
|
1885 | classString += ' ' + context.className;
|
1886 | }
|
1887 | propsForElement[
|
1888 |
|
1889 | isTag(elementToBeCreated) &&
|
1890 | !domElements.has(elementToBeCreated)
|
1891 | ? 'class'
|
1892 | : 'className'] = classString;
|
1893 | propsForElement.ref = forwardedRef;
|
1894 | return React.createElement(elementToBeCreated, propsForElement);
|
1895 | }
|
1896 | function createStyledComponent(target, options, rules) {
|
1897 | var isTargetStyledComp = isStyledComponent(target);
|
1898 | var styledComponentTarget = target;
|
1899 | var isCompositeComponent = !isTag(target);
|
1900 | var _a = options.attrs, attrs = _a === void 0 ? EMPTY_ARRAY : _a, _b = options.componentId, componentId = _b === void 0 ? generateId(options.displayName, options.parentComponentId) : _b, _c = options.displayName, displayName = _c === void 0 ? generateDisplayName(target) : _c;
|
1901 | var styledComponentId = options.displayName && options.componentId
|
1902 | ? "".concat(escape(options.displayName), "-").concat(options.componentId)
|
1903 | : options.componentId || componentId;
|
1904 |
|
1905 | var finalAttrs = isTargetStyledComp && styledComponentTarget.attrs
|
1906 | ? styledComponentTarget.attrs.concat(attrs).filter(Boolean)
|
1907 | : attrs;
|
1908 | var shouldForwardProp = options.shouldForwardProp;
|
1909 | if (isTargetStyledComp && styledComponentTarget.shouldForwardProp) {
|
1910 | var shouldForwardPropFn_1 = styledComponentTarget.shouldForwardProp;
|
1911 | if (options.shouldForwardProp) {
|
1912 | var passedShouldForwardPropFn_1 = options.shouldForwardProp;
|
1913 |
|
1914 | shouldForwardProp = function (prop, elementToBeCreated) {
|
1915 | return shouldForwardPropFn_1(prop, elementToBeCreated) &&
|
1916 | passedShouldForwardPropFn_1(prop, elementToBeCreated);
|
1917 | };
|
1918 | }
|
1919 | else {
|
1920 | shouldForwardProp = shouldForwardPropFn_1;
|
1921 | }
|
1922 | }
|
1923 | var componentStyle = new ComponentStyle(rules, styledComponentId, isTargetStyledComp ? styledComponentTarget.componentStyle : undefined);
|
1924 | function forwardRefRender(props, ref) {
|
1925 | return useStyledComponentImpl(WrappedStyledComponent, props, ref);
|
1926 | }
|
1927 | forwardRefRender.displayName = displayName;
|
1928 | |
1929 |
|
1930 |
|
1931 |
|
1932 | var WrappedStyledComponent = React.forwardRef(forwardRefRender);
|
1933 | WrappedStyledComponent.attrs = finalAttrs;
|
1934 | WrappedStyledComponent.componentStyle = componentStyle;
|
1935 | WrappedStyledComponent.displayName = displayName;
|
1936 | WrappedStyledComponent.shouldForwardProp = shouldForwardProp;
|
1937 |
|
1938 |
|
1939 | WrappedStyledComponent.foldedComponentIds = isTargetStyledComp
|
1940 | ? joinStrings(styledComponentTarget.foldedComponentIds, styledComponentTarget.styledComponentId)
|
1941 | : '';
|
1942 | WrappedStyledComponent.styledComponentId = styledComponentId;
|
1943 |
|
1944 | WrappedStyledComponent.target = isTargetStyledComp ? styledComponentTarget.target : target;
|
1945 | Object.defineProperty(WrappedStyledComponent, 'defaultProps', {
|
1946 | get: function () {
|
1947 | return this._foldedDefaultProps;
|
1948 | },
|
1949 | set: function (obj) {
|
1950 | this._foldedDefaultProps = isTargetStyledComp
|
1951 | ? mixinDeep({}, styledComponentTarget.defaultProps, obj)
|
1952 | : obj;
|
1953 | },
|
1954 | });
|
1955 | {
|
1956 | checkDynamicCreation(displayName, styledComponentId);
|
1957 | WrappedStyledComponent.warnTooManyClasses = createWarnTooManyClasses(displayName, styledComponentId);
|
1958 | }
|
1959 | setToString(WrappedStyledComponent, function () { return ".".concat(WrappedStyledComponent.styledComponentId); });
|
1960 | if (isCompositeComponent) {
|
1961 | var compositeComponentTarget = target;
|
1962 | hoistNonReactStatics(WrappedStyledComponent, compositeComponentTarget, {
|
1963 |
|
1964 | attrs: true,
|
1965 | componentStyle: true,
|
1966 | displayName: true,
|
1967 | foldedComponentIds: true,
|
1968 | shouldForwardProp: true,
|
1969 | styledComponentId: true,
|
1970 | target: true,
|
1971 | });
|
1972 | }
|
1973 | return WrappedStyledComponent;
|
1974 | }
|
1975 |
|
1976 | function constructWithOptions(componentConstructor, tag, options) {
|
1977 | if (options === void 0) { options = EMPTY_OBJECT; }
|
1978 | |
1979 |
|
1980 |
|
1981 |
|
1982 |
|
1983 |
|
1984 |
|
1985 | if (!tag) {
|
1986 | throw throwStyledComponentsError(1, tag);
|
1987 | }
|
1988 |
|
1989 | var templateFunction = function (initialStyles) {
|
1990 | var interpolations = [];
|
1991 | for (var _i = 1; _i < arguments.length; _i++) {
|
1992 | interpolations[_i - 1] = arguments[_i];
|
1993 | }
|
1994 | return componentConstructor(tag, options, css.apply(void 0, __spreadArray([initialStyles], interpolations, false)));
|
1995 | };
|
1996 | |
1997 |
|
1998 |
|
1999 |
|
2000 |
|
2001 |
|
2002 | templateFunction.attrs = function (attrs) {
|
2003 | return constructWithOptions(componentConstructor, tag, __assign(__assign({}, options), { attrs: Array.prototype.concat(options.attrs, attrs).filter(Boolean) }));
|
2004 | };
|
2005 | |
2006 |
|
2007 |
|
2008 |
|
2009 | templateFunction.withConfig = function (config) {
|
2010 | return constructWithOptions(componentConstructor, tag, __assign(__assign({}, options), config));
|
2011 | };
|
2012 | return templateFunction;
|
2013 | }
|
2014 |
|
2015 | var baseStyled = function (tag) {
|
2016 | return constructWithOptions(createStyledComponent, tag);
|
2017 | };
|
2018 | var styled = baseStyled;
|
2019 |
|
2020 | domElements.forEach(function (domElement) {
|
2021 |
|
2022 | styled[domElement] = baseStyled(domElement);
|
2023 | });
|
2024 |
|
2025 | |
2026 |
|
2027 |
|
2028 |
|
2029 | for (var key in secondary) {
|
2030 |
|
2031 | styled[key] = secondary[key];
|
2032 | }
|
2033 |
|
2034 | return styled;
|
2035 |
|
2036 | }));
|
2037 |
|