1 | 'use strict';
|
2 |
|
3 | Object.defineProperty(exports, '__esModule', { value: true });
|
4 |
|
5 | var _extends = require('@babel/runtime/helpers/extends');
|
6 | var React = require('react');
|
7 | var isPropValid = require('@emotion/is-prop-valid');
|
8 | var react = require('@emotion/react');
|
9 | var utils = require('@emotion/utils');
|
10 | var serialize = require('@emotion/serialize');
|
11 |
|
12 | function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
|
13 |
|
14 | function _interopNamespace(e) {
|
15 | if (e && e.__esModule) return e;
|
16 | var n = Object.create(null);
|
17 | if (e) {
|
18 | Object.keys(e).forEach(function (k) {
|
19 | if (k !== 'default') {
|
20 | var d = Object.getOwnPropertyDescriptor(e, k);
|
21 | Object.defineProperty(n, k, d.get ? d : {
|
22 | enumerable: true,
|
23 | get: function () {
|
24 | return e[k];
|
25 | }
|
26 | });
|
27 | }
|
28 | });
|
29 | }
|
30 | n['default'] = e;
|
31 | return Object.freeze(n);
|
32 | }
|
33 |
|
34 | var React__namespace = _interopNamespace(React);
|
35 | var isPropValid__default = _interopDefault(isPropValid);
|
36 |
|
37 | var testOmitPropsOnStringTag = isPropValid__default['default'];
|
38 |
|
39 | var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
|
40 | return key !== 'theme';
|
41 | };
|
42 |
|
43 | var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
|
44 | return typeof tag === 'string' &&
|
45 |
|
46 |
|
47 | tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
|
48 | };
|
49 | var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
|
50 | var shouldForwardProp;
|
51 |
|
52 | if (options) {
|
53 | var optionsShouldForwardProp = options.shouldForwardProp;
|
54 | shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
|
55 | return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
|
56 | } : optionsShouldForwardProp;
|
57 | }
|
58 |
|
59 | if (typeof shouldForwardProp !== 'function' && isReal) {
|
60 | shouldForwardProp = tag.__emotion_forwardProp;
|
61 | }
|
62 |
|
63 | return shouldForwardProp;
|
64 | };
|
65 |
|
66 | var isBrowser = typeof document !== 'undefined';
|
67 | var useInsertionEffect = React__namespace['useInsertion' + 'Effect'] ? React__namespace['useInsertion' + 'Effect'] : function useInsertionEffect(create) {
|
68 | create();
|
69 | };
|
70 | function useInsertionEffectMaybe(create) {
|
71 | if (!isBrowser) {
|
72 | return create();
|
73 | }
|
74 |
|
75 | useInsertionEffect(create);
|
76 | }
|
77 |
|
78 | var isBrowser$1 = typeof document !== 'undefined';
|
79 |
|
80 | var Insertion = function Insertion(_ref) {
|
81 | var cache = _ref.cache,
|
82 | serialized = _ref.serialized,
|
83 | isStringTag = _ref.isStringTag;
|
84 | utils.registerStyles(cache, serialized, isStringTag);
|
85 | var rules = useInsertionEffectMaybe(function () {
|
86 | return utils.insertStyles(cache, serialized, isStringTag);
|
87 | });
|
88 |
|
89 | if (!isBrowser$1 && rules !== undefined) {
|
90 | var _ref2;
|
91 |
|
92 | var serializedNames = serialized.name;
|
93 | var next = serialized.next;
|
94 |
|
95 | while (next !== undefined) {
|
96 | serializedNames += ' ' + next.name;
|
97 | next = next.next;
|
98 | }
|
99 |
|
100 | return React.createElement("style", (_ref2 = {}, _ref2["data-emotion"] = cache.key + " " + serializedNames, _ref2.dangerouslySetInnerHTML = {
|
101 | __html: rules
|
102 | }, _ref2.nonce = cache.sheet.nonce, _ref2));
|
103 | }
|
104 |
|
105 | return null;
|
106 | };
|
107 |
|
108 | var createStyled = function createStyled(tag, options) {
|
109 |
|
110 | var isReal = tag.__emotion_real === tag;
|
111 | var baseTag = isReal && tag.__emotion_base || tag;
|
112 | var identifierName;
|
113 | var targetClassName;
|
114 |
|
115 | if (options !== undefined) {
|
116 | identifierName = options.label;
|
117 | targetClassName = options.target;
|
118 | }
|
119 |
|
120 | var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
|
121 | var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
|
122 | var shouldUseAs = !defaultShouldForwardProp('as');
|
123 | return function () {
|
124 | var args = arguments;
|
125 | var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
|
126 |
|
127 | if (identifierName !== undefined) {
|
128 | styles.push("label:" + identifierName + ";");
|
129 | }
|
130 |
|
131 | if (args[0] == null || args[0].raw === undefined) {
|
132 | styles.push.apply(styles, args);
|
133 | } else {
|
134 |
|
135 | styles.push(args[0][0]);
|
136 | var len = args.length;
|
137 | var i = 1;
|
138 |
|
139 | for (; i < len; i++) {
|
140 |
|
141 | styles.push(args[i], args[0][i]);
|
142 | }
|
143 | }
|
144 |
|
145 |
|
146 | var Styled = react.withEmotionCache(function (props, cache, ref) {
|
147 | var FinalTag = shouldUseAs && props.as || baseTag;
|
148 | var className = '';
|
149 | var classInterpolations = [];
|
150 | var mergedProps = props;
|
151 |
|
152 | if (props.theme == null) {
|
153 | mergedProps = {};
|
154 |
|
155 | for (var key in props) {
|
156 | mergedProps[key] = props[key];
|
157 | }
|
158 |
|
159 | mergedProps.theme = React.useContext(react.ThemeContext);
|
160 | }
|
161 |
|
162 | if (typeof props.className === 'string') {
|
163 | className = utils.getRegisteredStyles(cache.registered, classInterpolations, props.className);
|
164 | } else if (props.className != null) {
|
165 | className = props.className + " ";
|
166 | }
|
167 |
|
168 | var serialized = serialize.serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
|
169 | className += cache.key + "-" + serialized.name;
|
170 |
|
171 | if (targetClassName !== undefined) {
|
172 | className += " " + targetClassName;
|
173 | }
|
174 |
|
175 | var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
|
176 | var newProps = {};
|
177 |
|
178 | for (var _key in props) {
|
179 | if (shouldUseAs && _key === 'as') continue;
|
180 |
|
181 | if (
|
182 | finalShouldForwardProp(_key)) {
|
183 | newProps[_key] = props[_key];
|
184 | }
|
185 | }
|
186 |
|
187 | newProps.className = className;
|
188 | newProps.ref = ref;
|
189 | return React.createElement(React.Fragment, null, React.createElement(Insertion, {
|
190 | cache: cache,
|
191 | serialized: serialized,
|
192 | isStringTag: typeof FinalTag === 'string'
|
193 | }), React.createElement(FinalTag, newProps));
|
194 | });
|
195 | Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
|
196 | Styled.defaultProps = tag.defaultProps;
|
197 | Styled.__emotion_real = Styled;
|
198 | Styled.__emotion_base = baseTag;
|
199 | Styled.__emotion_styles = styles;
|
200 | Styled.__emotion_forwardProp = shouldForwardProp;
|
201 | Object.defineProperty(Styled, 'toString', {
|
202 | value: function value() {
|
203 | if (targetClassName === undefined && "production" !== 'production') {
|
204 | return 'NO_COMPONENT_SELECTOR';
|
205 | }
|
206 |
|
207 |
|
208 | return "." + targetClassName;
|
209 | }
|
210 | });
|
211 |
|
212 | Styled.withComponent = function (nextTag, nextOptions) {
|
213 | return createStyled(nextTag, _extends({}, options, nextOptions, {
|
214 | shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
|
215 | })).apply(void 0, styles);
|
216 | };
|
217 |
|
218 | return Styled;
|
219 | };
|
220 | };
|
221 |
|
222 | exports.default = createStyled;
|