@pnkx-lib/ui 1.9.434 → 1.9.437
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/style.css +2 -2
- package/es/chunks/{AntdIcon-gUuMvf83.js → AntdIcon-D_ySRKRj.js} +3 -3
- package/es/chunks/{CloseOutlined-D9hb-IcI.js → CloseOutlined-B3y9Maz0.js} +1 -1
- package/es/chunks/{DownOutlined-CkHKgaSi.js → DownOutlined-BlKl-wuu.js} +1 -1
- package/es/chunks/{InboxOutlined-Kgn4qaDi.js → InboxOutlined-CLTSIXAX.js} +1 -1
- package/es/chunks/{index-D7kJLZIi.js → index-t0ynpS_n.js} +2 -2
- package/es/fields/DatePicker.js +2 -2
- package/es/fields/Input.js +47 -47
- package/es/fields/Select.js +24 -24
- package/es/fields/TinyMCE.js +16 -71
- package/es/fields/Upload.js +1 -1
- package/es/index.js +1 -3
- package/es/ui/BreadcrumbHeading.js +2 -2
- package/es/ui/ExportFile.js +1 -1
- package/es/ui/Heading.js +2 -2
- package/es/ui/ImportFile.js +2 -2
- package/es/ui/Layout.js +4927 -1
- package/es/ui/SearchFilterForm.js +1 -1
- package/es/{chunks/logo-header-DG8abRGF.js → ui/Sidebar/index.js} +504 -4
- package/es/ui/UploadComponent.js +1 -1
- package/es/ui/UploadMultiple.js +1 -1
- package/es/ui/index.js +69 -71
- package/package.json +1 -1
- package/types/components/hooks/useBreadcrumb.d.ts +2 -2
- package/types/components/ui/{SidebarV3 → Sidebar}/components/ContentArea.d.ts +1 -1
- package/types/components/ui/{SidebarV3 → Sidebar}/components/MainMenu/EachItem.d.ts +5 -5
- package/types/components/ui/{SidebarV3 → Sidebar}/components/MainMenu/index.d.ts +4 -4
- package/types/components/ui/{SidebarV3 → Sidebar}/components/MainSidebar.d.ts +3 -3
- package/types/components/ui/{SidebarV3/components/SidebarV3.d.ts → Sidebar/components/Sidebar.d.ts} +1 -1
- package/types/components/ui/{SidebarV3 → Sidebar}/hooks.d.ts +3 -3
- package/types/components/ui/Sidebar/index.d.ts +2 -0
- package/types/components/ui/{SidebarV3 → Sidebar}/types.d.ts +3 -3
- package/types/components/ui/Sidebar/utils.d.ts +2 -0
- package/types/components/ui/index.d.ts +1 -3
- package/types/components/utils/routeUtils.d.ts +2 -2
- package/types/constants/table.d.ts +6 -0
- package/types/ui/Sidebar/index.d.ts +2 -0
- package/es/chunks/BellIcon-Bv07EhTB.js +0 -45
- package/es/chunks/layout-C0dbwkpb.js +0 -4929
- package/es/ui/Sidebar.js +0 -412
- package/es/ui/SidebarV2.js +0 -303
- package/es/ui/SidebarV3/index.js +0 -465
- package/types/components/ui/Sidebar.d.ts +0 -23
- package/types/components/ui/SidebarV2.d.ts +0 -20
- package/types/components/ui/SidebarV3/index.d.ts +0 -2
- package/types/components/ui/SidebarV3/utils.d.ts +0 -2
- package/types/ui/Sidebar.d.ts +0 -2
- package/types/ui/SidebarV2.d.ts +0 -2
- package/types/ui/SidebarV3/index.d.ts +0 -2
- /package/types/components/ui/{SidebarV3 → Sidebar}/components/Header.d.ts +0 -0
- /package/types/components/ui/{SidebarV3 → Sidebar}/components/SearchHeader.d.ts +0 -0
- /package/types/components/ui/{SidebarV3 → Sidebar}/components/UserInfoSection.d.ts +0 -0
|
@@ -1,4929 +0,0 @@
|
|
|
1
|
-
import { _ as _typeof, c as _arrayLikeToArray, a as _unsupportedIterableToArray, b as _defineProperty } from './defineProperty-CTLrw71t.js';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import React__default, { useContext, createContext, useState, useEffect, useRef } from 'react';
|
|
4
|
-
import { c as className } from './index-D7kJLZIi.js';
|
|
5
|
-
import { _ as _createClass, a as _classCallCheck, b as _inherits, c as _createSuper, d as _assertThisInitialized } from './createSuper-C90IQ42g.js';
|
|
6
|
-
import { I as Icon, _ as _extends, w as warningOnce, a as _slicedToArray, b as warning$1, c as canUseDom, d as _objectSpread2, u as updateCSS, r as removeCSS, e as _arrayWithHoles, f as _nonIterableRest, g as resetWarned$1, F as FastColor, h as generate, p as presetPrimaryColors, i as presetPalettes, j as _objectWithoutProperties, k as IconContext } from './AntdIcon-gUuMvf83.js';
|
|
7
|
-
|
|
8
|
-
// This icon file is generated automatically.
|
|
9
|
-
var BarsOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "0 0 1024 1024", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M912 192H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 284H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 284H328c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h584c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM104 228a56 56 0 10112 0 56 56 0 10-112 0zm0 284a56 56 0 10112 0 56 56 0 10-112 0zm0 284a56 56 0 10112 0 56 56 0 10-112 0z" } }] }, "name": "bars", "theme": "outlined" };
|
|
10
|
-
|
|
11
|
-
var BarsOutlined = function BarsOutlined(props, ref) {
|
|
12
|
-
return /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
|
|
13
|
-
ref: ref,
|
|
14
|
-
icon: BarsOutlined$1
|
|
15
|
-
}));
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
/** */
|
|
19
|
-
var RefIcon$2 = /*#__PURE__*/React.forwardRef(BarsOutlined);
|
|
20
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
21
|
-
RefIcon$2.displayName = 'BarsOutlined';
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// This icon file is generated automatically.
|
|
25
|
-
var LeftOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z" } }] }, "name": "left", "theme": "outlined" };
|
|
26
|
-
|
|
27
|
-
var LeftOutlined = function LeftOutlined(props, ref) {
|
|
28
|
-
return /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
|
|
29
|
-
ref: ref,
|
|
30
|
-
icon: LeftOutlined$1
|
|
31
|
-
}));
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
/** */
|
|
35
|
-
var RefIcon$1 = /*#__PURE__*/React.forwardRef(LeftOutlined);
|
|
36
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
37
|
-
RefIcon$1.displayName = 'LeftOutlined';
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
// This icon file is generated automatically.
|
|
41
|
-
var RightOutlined$1 = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z" } }] }, "name": "right", "theme": "outlined" };
|
|
42
|
-
|
|
43
|
-
var RightOutlined = function RightOutlined(props, ref) {
|
|
44
|
-
return /*#__PURE__*/React.createElement(Icon, _extends({}, props, {
|
|
45
|
-
ref: ref,
|
|
46
|
-
icon: RightOutlined$1
|
|
47
|
-
}));
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
/** */
|
|
51
|
-
var RefIcon = /*#__PURE__*/React.forwardRef(RightOutlined);
|
|
52
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
53
|
-
RefIcon.displayName = 'RightOutlined';
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
function useMemo(getValue, condition, shouldUpdate) {
|
|
57
|
-
var cacheRef = React.useRef({});
|
|
58
|
-
if (!('value' in cacheRef.current) || shouldUpdate(cacheRef.current.condition, condition)) {
|
|
59
|
-
cacheRef.current.value = getValue();
|
|
60
|
-
cacheRef.current.condition = condition;
|
|
61
|
-
}
|
|
62
|
-
return cacheRef.current.value;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
var REACT_ELEMENT_TYPE_18 = Symbol.for('react.element');
|
|
66
|
-
var REACT_ELEMENT_TYPE_19 = Symbol.for('react.transitional.element');
|
|
67
|
-
var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* Compatible with React 18 or 19 to check if node is a Fragment.
|
|
71
|
-
*/
|
|
72
|
-
function isFragment(object) {
|
|
73
|
-
return (
|
|
74
|
-
// Base object type
|
|
75
|
-
object && _typeof(object) === 'object' && (
|
|
76
|
-
// React Element type
|
|
77
|
-
object.$$typeof === REACT_ELEMENT_TYPE_18 || object.$$typeof === REACT_ELEMENT_TYPE_19) &&
|
|
78
|
-
// React Fragment type
|
|
79
|
-
object.type === REACT_FRAGMENT_TYPE
|
|
80
|
-
);
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
function _arrayWithoutHoles(r) {
|
|
84
|
-
if (Array.isArray(r)) return _arrayLikeToArray(r);
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
function _iterableToArray(r) {
|
|
88
|
-
if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
function _nonIterableSpread() {
|
|
92
|
-
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
function _toConsumableArray(r) {
|
|
96
|
-
return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
function omit(obj, fields) {
|
|
100
|
-
var clone = Object.assign({}, obj);
|
|
101
|
-
if (Array.isArray(fields)) {
|
|
102
|
-
fields.forEach(function (key) {
|
|
103
|
-
delete clone[key];
|
|
104
|
-
});
|
|
105
|
-
}
|
|
106
|
-
return clone;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
/* eslint-disable */
|
|
110
|
-
// Inspired by https://github.com/garycourt/murmurhash-js
|
|
111
|
-
// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
|
|
112
|
-
function murmur2(str) {
|
|
113
|
-
// 'm' and 'r' are mixing constants generated offline.
|
|
114
|
-
// They're not really 'magic', they just happen to work well.
|
|
115
|
-
// const m = 0x5bd1e995;
|
|
116
|
-
// const r = 24;
|
|
117
|
-
// Initialize the hash
|
|
118
|
-
var h = 0; // Mix 4 bytes at a time into the hash
|
|
119
|
-
|
|
120
|
-
var k,
|
|
121
|
-
i = 0,
|
|
122
|
-
len = str.length;
|
|
123
|
-
|
|
124
|
-
for (; len >= 4; ++i, len -= 4) {
|
|
125
|
-
k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
|
|
126
|
-
k =
|
|
127
|
-
/* Math.imul(k, m): */
|
|
128
|
-
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
|
|
129
|
-
k ^=
|
|
130
|
-
/* k >>> r: */
|
|
131
|
-
k >>> 24;
|
|
132
|
-
h =
|
|
133
|
-
/* Math.imul(k, m): */
|
|
134
|
-
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
|
|
135
|
-
/* Math.imul(h, m): */
|
|
136
|
-
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
137
|
-
} // Handle the last few bytes of the input array
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
switch (len) {
|
|
141
|
-
case 3:
|
|
142
|
-
h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
|
|
143
|
-
|
|
144
|
-
case 2:
|
|
145
|
-
h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
|
|
146
|
-
|
|
147
|
-
case 1:
|
|
148
|
-
h ^= str.charCodeAt(i) & 0xff;
|
|
149
|
-
h =
|
|
150
|
-
/* Math.imul(h, m): */
|
|
151
|
-
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
152
|
-
} // Do a few final mixes of the hash to ensure the last few
|
|
153
|
-
// bytes are well-incorporated.
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
h ^= h >>> 13;
|
|
157
|
-
h =
|
|
158
|
-
/* Math.imul(h, m): */
|
|
159
|
-
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
160
|
-
return ((h ^ h >>> 15) >>> 0).toString(36);
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
/**
|
|
164
|
-
* Deeply compares two object literals.
|
|
165
|
-
* @param obj1 object 1
|
|
166
|
-
* @param obj2 object 2
|
|
167
|
-
* @param shallow shallow compare
|
|
168
|
-
* @returns
|
|
169
|
-
*/
|
|
170
|
-
function isEqual(obj1, obj2) {
|
|
171
|
-
var shallow = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
172
|
-
// https://github.com/mapbox/mapbox-gl-js/pull/5979/files#diff-fde7145050c47cc3a306856efd5f9c3016e86e859de9afbd02c879be5067e58f
|
|
173
|
-
var refSet = new Set();
|
|
174
|
-
function deepEqual(a, b) {
|
|
175
|
-
var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
|
|
176
|
-
var circular = refSet.has(a);
|
|
177
|
-
warningOnce(!circular, 'Warning: There may be circular references');
|
|
178
|
-
if (circular) {
|
|
179
|
-
return false;
|
|
180
|
-
}
|
|
181
|
-
if (a === b) {
|
|
182
|
-
return true;
|
|
183
|
-
}
|
|
184
|
-
if (shallow && level > 1) {
|
|
185
|
-
return false;
|
|
186
|
-
}
|
|
187
|
-
refSet.add(a);
|
|
188
|
-
var newLevel = level + 1;
|
|
189
|
-
if (Array.isArray(a)) {
|
|
190
|
-
if (!Array.isArray(b) || a.length !== b.length) {
|
|
191
|
-
return false;
|
|
192
|
-
}
|
|
193
|
-
for (var i = 0; i < a.length; i++) {
|
|
194
|
-
if (!deepEqual(a[i], b[i], newLevel)) {
|
|
195
|
-
return false;
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
return true;
|
|
199
|
-
}
|
|
200
|
-
if (a && b && _typeof(a) === 'object' && _typeof(b) === 'object') {
|
|
201
|
-
var keys = Object.keys(a);
|
|
202
|
-
if (keys.length !== Object.keys(b).length) {
|
|
203
|
-
return false;
|
|
204
|
-
}
|
|
205
|
-
return keys.every(function (key) {
|
|
206
|
-
return deepEqual(a[key], b[key], newLevel);
|
|
207
|
-
});
|
|
208
|
-
}
|
|
209
|
-
// other
|
|
210
|
-
return false;
|
|
211
|
-
}
|
|
212
|
-
return deepEqual(obj1, obj2);
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
// [times, realValue]
|
|
216
|
-
|
|
217
|
-
var SPLIT = '%';
|
|
218
|
-
|
|
219
|
-
/** Connect key with `SPLIT` */
|
|
220
|
-
function pathKey(keys) {
|
|
221
|
-
return keys.join(SPLIT);
|
|
222
|
-
}
|
|
223
|
-
var Entity = /*#__PURE__*/function () {
|
|
224
|
-
function Entity(instanceId) {
|
|
225
|
-
_classCallCheck(this, Entity);
|
|
226
|
-
_defineProperty(this, "instanceId", void 0);
|
|
227
|
-
/** @private Internal cache map. Do not access this directly */
|
|
228
|
-
_defineProperty(this, "cache", new Map());
|
|
229
|
-
this.instanceId = instanceId;
|
|
230
|
-
}
|
|
231
|
-
_createClass(Entity, [{
|
|
232
|
-
key: "get",
|
|
233
|
-
value: function get(keys) {
|
|
234
|
-
return this.opGet(pathKey(keys));
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
/** A fast get cache with `get` concat. */
|
|
238
|
-
}, {
|
|
239
|
-
key: "opGet",
|
|
240
|
-
value: function opGet(keyPathStr) {
|
|
241
|
-
return this.cache.get(keyPathStr) || null;
|
|
242
|
-
}
|
|
243
|
-
}, {
|
|
244
|
-
key: "update",
|
|
245
|
-
value: function update(keys, valueFn) {
|
|
246
|
-
return this.opUpdate(pathKey(keys), valueFn);
|
|
247
|
-
}
|
|
248
|
-
|
|
249
|
-
/** A fast get cache with `get` concat. */
|
|
250
|
-
}, {
|
|
251
|
-
key: "opUpdate",
|
|
252
|
-
value: function opUpdate(keyPathStr, valueFn) {
|
|
253
|
-
var prevValue = this.cache.get(keyPathStr);
|
|
254
|
-
var nextValue = valueFn(prevValue);
|
|
255
|
-
if (nextValue === null) {
|
|
256
|
-
this.cache.delete(keyPathStr);
|
|
257
|
-
} else {
|
|
258
|
-
this.cache.set(keyPathStr, nextValue);
|
|
259
|
-
}
|
|
260
|
-
}
|
|
261
|
-
}]);
|
|
262
|
-
return Entity;
|
|
263
|
-
}();
|
|
264
|
-
|
|
265
|
-
var ATTR_TOKEN = 'data-token-hash';
|
|
266
|
-
var ATTR_MARK = 'data-css-hash';
|
|
267
|
-
var ATTR_CACHE_PATH = 'data-cache-path';
|
|
268
|
-
|
|
269
|
-
// Mark css-in-js instance in style element
|
|
270
|
-
var CSS_IN_JS_INSTANCE = '__cssinjs_instance__';
|
|
271
|
-
function createCache() {
|
|
272
|
-
var cssinjsInstanceId = Math.random().toString(12).slice(2);
|
|
273
|
-
|
|
274
|
-
// Tricky SSR: Move all inline style to the head.
|
|
275
|
-
// PS: We do not recommend tricky mode.
|
|
276
|
-
if (typeof document !== 'undefined' && document.head && document.body) {
|
|
277
|
-
var styles = document.body.querySelectorAll("style[".concat(ATTR_MARK, "]")) || [];
|
|
278
|
-
var firstChild = document.head.firstChild;
|
|
279
|
-
Array.from(styles).forEach(function (style) {
|
|
280
|
-
style[CSS_IN_JS_INSTANCE] = style[CSS_IN_JS_INSTANCE] || cssinjsInstanceId;
|
|
281
|
-
|
|
282
|
-
// Not force move if no head
|
|
283
|
-
if (style[CSS_IN_JS_INSTANCE] === cssinjsInstanceId) {
|
|
284
|
-
document.head.insertBefore(style, firstChild);
|
|
285
|
-
}
|
|
286
|
-
});
|
|
287
|
-
|
|
288
|
-
// Deduplicate of moved styles
|
|
289
|
-
var styleHash = {};
|
|
290
|
-
Array.from(document.querySelectorAll("style[".concat(ATTR_MARK, "]"))).forEach(function (style) {
|
|
291
|
-
var hash = style.getAttribute(ATTR_MARK);
|
|
292
|
-
if (styleHash[hash]) {
|
|
293
|
-
if (style[CSS_IN_JS_INSTANCE] === cssinjsInstanceId) {
|
|
294
|
-
var _style$parentNode;
|
|
295
|
-
(_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 || _style$parentNode.removeChild(style);
|
|
296
|
-
}
|
|
297
|
-
} else {
|
|
298
|
-
styleHash[hash] = true;
|
|
299
|
-
}
|
|
300
|
-
});
|
|
301
|
-
}
|
|
302
|
-
return new Entity(cssinjsInstanceId);
|
|
303
|
-
}
|
|
304
|
-
var StyleContext = /*#__PURE__*/React.createContext({
|
|
305
|
-
hashPriority: 'low',
|
|
306
|
-
cache: createCache(),
|
|
307
|
-
defaultCache: true
|
|
308
|
-
});
|
|
309
|
-
|
|
310
|
-
// ================================== Cache ==================================
|
|
311
|
-
|
|
312
|
-
function sameDerivativeOption(left, right) {
|
|
313
|
-
if (left.length !== right.length) {
|
|
314
|
-
return false;
|
|
315
|
-
}
|
|
316
|
-
for (var i = 0; i < left.length; i++) {
|
|
317
|
-
if (left[i] !== right[i]) {
|
|
318
|
-
return false;
|
|
319
|
-
}
|
|
320
|
-
}
|
|
321
|
-
return true;
|
|
322
|
-
}
|
|
323
|
-
var ThemeCache = /*#__PURE__*/function () {
|
|
324
|
-
function ThemeCache() {
|
|
325
|
-
_classCallCheck(this, ThemeCache);
|
|
326
|
-
_defineProperty(this, "cache", void 0);
|
|
327
|
-
_defineProperty(this, "keys", void 0);
|
|
328
|
-
_defineProperty(this, "cacheCallTimes", void 0);
|
|
329
|
-
this.cache = new Map();
|
|
330
|
-
this.keys = [];
|
|
331
|
-
this.cacheCallTimes = 0;
|
|
332
|
-
}
|
|
333
|
-
_createClass(ThemeCache, [{
|
|
334
|
-
key: "size",
|
|
335
|
-
value: function size() {
|
|
336
|
-
return this.keys.length;
|
|
337
|
-
}
|
|
338
|
-
}, {
|
|
339
|
-
key: "internalGet",
|
|
340
|
-
value: function internalGet(derivativeOption) {
|
|
341
|
-
var _cache2, _cache3;
|
|
342
|
-
var updateCallTimes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
343
|
-
var cache = {
|
|
344
|
-
map: this.cache
|
|
345
|
-
};
|
|
346
|
-
derivativeOption.forEach(function (derivative) {
|
|
347
|
-
if (!cache) {
|
|
348
|
-
cache = undefined;
|
|
349
|
-
} else {
|
|
350
|
-
var _cache;
|
|
351
|
-
cache = (_cache = cache) === null || _cache === void 0 || (_cache = _cache.map) === null || _cache === void 0 ? void 0 : _cache.get(derivative);
|
|
352
|
-
}
|
|
353
|
-
});
|
|
354
|
-
if ((_cache2 = cache) !== null && _cache2 !== void 0 && _cache2.value && updateCallTimes) {
|
|
355
|
-
cache.value[1] = this.cacheCallTimes++;
|
|
356
|
-
}
|
|
357
|
-
return (_cache3 = cache) === null || _cache3 === void 0 ? void 0 : _cache3.value;
|
|
358
|
-
}
|
|
359
|
-
}, {
|
|
360
|
-
key: "get",
|
|
361
|
-
value: function get(derivativeOption) {
|
|
362
|
-
var _this$internalGet;
|
|
363
|
-
return (_this$internalGet = this.internalGet(derivativeOption, true)) === null || _this$internalGet === void 0 ? void 0 : _this$internalGet[0];
|
|
364
|
-
}
|
|
365
|
-
}, {
|
|
366
|
-
key: "has",
|
|
367
|
-
value: function has(derivativeOption) {
|
|
368
|
-
return !!this.internalGet(derivativeOption);
|
|
369
|
-
}
|
|
370
|
-
}, {
|
|
371
|
-
key: "set",
|
|
372
|
-
value: function set(derivativeOption, value) {
|
|
373
|
-
var _this = this;
|
|
374
|
-
// New cache
|
|
375
|
-
if (!this.has(derivativeOption)) {
|
|
376
|
-
if (this.size() + 1 > ThemeCache.MAX_CACHE_SIZE + ThemeCache.MAX_CACHE_OFFSET) {
|
|
377
|
-
var _this$keys$reduce = this.keys.reduce(function (result, key) {
|
|
378
|
-
var _result = _slicedToArray(result, 2),
|
|
379
|
-
callTimes = _result[1];
|
|
380
|
-
if (_this.internalGet(key)[1] < callTimes) {
|
|
381
|
-
return [key, _this.internalGet(key)[1]];
|
|
382
|
-
}
|
|
383
|
-
return result;
|
|
384
|
-
}, [this.keys[0], this.cacheCallTimes]),
|
|
385
|
-
_this$keys$reduce2 = _slicedToArray(_this$keys$reduce, 1),
|
|
386
|
-
targetKey = _this$keys$reduce2[0];
|
|
387
|
-
this.delete(targetKey);
|
|
388
|
-
}
|
|
389
|
-
this.keys.push(derivativeOption);
|
|
390
|
-
}
|
|
391
|
-
var cache = this.cache;
|
|
392
|
-
derivativeOption.forEach(function (derivative, index) {
|
|
393
|
-
if (index === derivativeOption.length - 1) {
|
|
394
|
-
cache.set(derivative, {
|
|
395
|
-
value: [value, _this.cacheCallTimes++]
|
|
396
|
-
});
|
|
397
|
-
} else {
|
|
398
|
-
var cacheValue = cache.get(derivative);
|
|
399
|
-
if (!cacheValue) {
|
|
400
|
-
cache.set(derivative, {
|
|
401
|
-
map: new Map()
|
|
402
|
-
});
|
|
403
|
-
} else if (!cacheValue.map) {
|
|
404
|
-
cacheValue.map = new Map();
|
|
405
|
-
}
|
|
406
|
-
cache = cache.get(derivative).map;
|
|
407
|
-
}
|
|
408
|
-
});
|
|
409
|
-
}
|
|
410
|
-
}, {
|
|
411
|
-
key: "deleteByPath",
|
|
412
|
-
value: function deleteByPath(currentCache, derivatives) {
|
|
413
|
-
var cache = currentCache.get(derivatives[0]);
|
|
414
|
-
if (derivatives.length === 1) {
|
|
415
|
-
var _cache$value;
|
|
416
|
-
if (!cache.map) {
|
|
417
|
-
currentCache.delete(derivatives[0]);
|
|
418
|
-
} else {
|
|
419
|
-
currentCache.set(derivatives[0], {
|
|
420
|
-
map: cache.map
|
|
421
|
-
});
|
|
422
|
-
}
|
|
423
|
-
return (_cache$value = cache.value) === null || _cache$value === void 0 ? void 0 : _cache$value[0];
|
|
424
|
-
}
|
|
425
|
-
var result = this.deleteByPath(cache.map, derivatives.slice(1));
|
|
426
|
-
if ((!cache.map || cache.map.size === 0) && !cache.value) {
|
|
427
|
-
currentCache.delete(derivatives[0]);
|
|
428
|
-
}
|
|
429
|
-
return result;
|
|
430
|
-
}
|
|
431
|
-
}, {
|
|
432
|
-
key: "delete",
|
|
433
|
-
value: function _delete(derivativeOption) {
|
|
434
|
-
// If cache exists
|
|
435
|
-
if (this.has(derivativeOption)) {
|
|
436
|
-
this.keys = this.keys.filter(function (item) {
|
|
437
|
-
return !sameDerivativeOption(item, derivativeOption);
|
|
438
|
-
});
|
|
439
|
-
return this.deleteByPath(this.cache, derivativeOption);
|
|
440
|
-
}
|
|
441
|
-
return undefined;
|
|
442
|
-
}
|
|
443
|
-
}]);
|
|
444
|
-
return ThemeCache;
|
|
445
|
-
}();
|
|
446
|
-
_defineProperty(ThemeCache, "MAX_CACHE_SIZE", 20);
|
|
447
|
-
_defineProperty(ThemeCache, "MAX_CACHE_OFFSET", 5);
|
|
448
|
-
|
|
449
|
-
var uuid = 0;
|
|
450
|
-
|
|
451
|
-
/**
|
|
452
|
-
* Theme with algorithms to derive tokens from design tokens.
|
|
453
|
-
* Use `createTheme` first which will help to manage the theme instance cache.
|
|
454
|
-
*/
|
|
455
|
-
var Theme = /*#__PURE__*/function () {
|
|
456
|
-
function Theme(derivatives) {
|
|
457
|
-
_classCallCheck(this, Theme);
|
|
458
|
-
_defineProperty(this, "derivatives", void 0);
|
|
459
|
-
_defineProperty(this, "id", void 0);
|
|
460
|
-
this.derivatives = Array.isArray(derivatives) ? derivatives : [derivatives];
|
|
461
|
-
this.id = uuid;
|
|
462
|
-
if (derivatives.length === 0) {
|
|
463
|
-
warning$1(derivatives.length > 0, '[Ant Design CSS-in-JS] Theme should have at least one derivative function.');
|
|
464
|
-
}
|
|
465
|
-
uuid += 1;
|
|
466
|
-
}
|
|
467
|
-
_createClass(Theme, [{
|
|
468
|
-
key: "getDerivativeToken",
|
|
469
|
-
value: function getDerivativeToken(token) {
|
|
470
|
-
return this.derivatives.reduce(function (result, derivative) {
|
|
471
|
-
return derivative(token, result);
|
|
472
|
-
}, undefined);
|
|
473
|
-
}
|
|
474
|
-
}]);
|
|
475
|
-
return Theme;
|
|
476
|
-
}();
|
|
477
|
-
|
|
478
|
-
var cacheThemes = new ThemeCache();
|
|
479
|
-
|
|
480
|
-
/**
|
|
481
|
-
* Same as new Theme, but will always return same one if `derivative` not changed.
|
|
482
|
-
*/
|
|
483
|
-
function createTheme(derivatives) {
|
|
484
|
-
var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives];
|
|
485
|
-
// Create new theme if not exist
|
|
486
|
-
if (!cacheThemes.has(derivativeArr)) {
|
|
487
|
-
cacheThemes.set(derivativeArr, new Theme(derivativeArr));
|
|
488
|
-
}
|
|
489
|
-
|
|
490
|
-
// Get theme from cache and return
|
|
491
|
-
return cacheThemes.get(derivativeArr);
|
|
492
|
-
}
|
|
493
|
-
|
|
494
|
-
// Create a cache for memo concat
|
|
495
|
-
|
|
496
|
-
var resultCache = new WeakMap();
|
|
497
|
-
var RESULT_VALUE = {};
|
|
498
|
-
function memoResult(callback, deps) {
|
|
499
|
-
var current = resultCache;
|
|
500
|
-
for (var i = 0; i < deps.length; i += 1) {
|
|
501
|
-
var dep = deps[i];
|
|
502
|
-
if (!current.has(dep)) {
|
|
503
|
-
current.set(dep, new WeakMap());
|
|
504
|
-
}
|
|
505
|
-
current = current.get(dep);
|
|
506
|
-
}
|
|
507
|
-
if (!current.has(RESULT_VALUE)) {
|
|
508
|
-
current.set(RESULT_VALUE, callback());
|
|
509
|
-
}
|
|
510
|
-
return current.get(RESULT_VALUE);
|
|
511
|
-
}
|
|
512
|
-
|
|
513
|
-
// Create a cache here to avoid always loop generate
|
|
514
|
-
var flattenTokenCache = new WeakMap();
|
|
515
|
-
|
|
516
|
-
/**
|
|
517
|
-
* Flatten token to string, this will auto cache the result when token not change
|
|
518
|
-
*/
|
|
519
|
-
function flattenToken(token) {
|
|
520
|
-
var str = flattenTokenCache.get(token) || '';
|
|
521
|
-
if (!str) {
|
|
522
|
-
Object.keys(token).forEach(function (key) {
|
|
523
|
-
var value = token[key];
|
|
524
|
-
str += key;
|
|
525
|
-
if (value instanceof Theme) {
|
|
526
|
-
str += value.id;
|
|
527
|
-
} else if (value && _typeof(value) === 'object') {
|
|
528
|
-
str += flattenToken(value);
|
|
529
|
-
} else {
|
|
530
|
-
str += value;
|
|
531
|
-
}
|
|
532
|
-
});
|
|
533
|
-
|
|
534
|
-
// https://github.com/ant-design/ant-design/issues/48386
|
|
535
|
-
// Should hash the string to avoid style tag name too long
|
|
536
|
-
str = murmur2(str);
|
|
537
|
-
|
|
538
|
-
// Put in cache
|
|
539
|
-
flattenTokenCache.set(token, str);
|
|
540
|
-
}
|
|
541
|
-
return str;
|
|
542
|
-
}
|
|
543
|
-
|
|
544
|
-
/**
|
|
545
|
-
* Convert derivative token to key string
|
|
546
|
-
*/
|
|
547
|
-
function token2key(token, salt) {
|
|
548
|
-
return murmur2("".concat(salt, "_").concat(flattenToken(token)));
|
|
549
|
-
}
|
|
550
|
-
var isClientSide = canUseDom();
|
|
551
|
-
function unit$1(num) {
|
|
552
|
-
if (typeof num === 'number') {
|
|
553
|
-
return "".concat(num, "px");
|
|
554
|
-
}
|
|
555
|
-
return num;
|
|
556
|
-
}
|
|
557
|
-
|
|
558
|
-
var token2CSSVar = function token2CSSVar(token) {
|
|
559
|
-
var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
560
|
-
return "--".concat(prefix ? "".concat(prefix, "-") : '').concat(token).replace(/([a-z0-9])([A-Z])/g, '$1-$2').replace(/([A-Z]+)([A-Z][a-z0-9]+)/g, '$1-$2').replace(/([a-z])([A-Z0-9])/g, '$1-$2').toLowerCase();
|
|
561
|
-
};
|
|
562
|
-
var serializeCSSVar = function serializeCSSVar(cssVars, hashId, options) {
|
|
563
|
-
if (!Object.keys(cssVars).length) {
|
|
564
|
-
return '';
|
|
565
|
-
}
|
|
566
|
-
return ".".concat(hashId).concat(options !== null && options !== void 0 && options.scope ? ".".concat(options.scope) : '', "{").concat(Object.entries(cssVars).map(function (_ref) {
|
|
567
|
-
var _ref2 = _slicedToArray(_ref, 2),
|
|
568
|
-
key = _ref2[0],
|
|
569
|
-
value = _ref2[1];
|
|
570
|
-
return "".concat(key, ":").concat(value, ";");
|
|
571
|
-
}).join(''), "}");
|
|
572
|
-
};
|
|
573
|
-
var transformToken = function transformToken(token, themeKey, config) {
|
|
574
|
-
var cssVars = {};
|
|
575
|
-
var result = {};
|
|
576
|
-
Object.entries(token).forEach(function (_ref3) {
|
|
577
|
-
var _config$preserve, _config$ignore;
|
|
578
|
-
var _ref4 = _slicedToArray(_ref3, 2),
|
|
579
|
-
key = _ref4[0],
|
|
580
|
-
value = _ref4[1];
|
|
581
|
-
if (config !== null && config !== void 0 && (_config$preserve = config.preserve) !== null && _config$preserve !== void 0 && _config$preserve[key]) {
|
|
582
|
-
result[key] = value;
|
|
583
|
-
} else if ((typeof value === 'string' || typeof value === 'number') && !(config !== null && config !== void 0 && (_config$ignore = config.ignore) !== null && _config$ignore !== void 0 && _config$ignore[key])) {
|
|
584
|
-
var _config$unitless;
|
|
585
|
-
var cssVar = token2CSSVar(key, config === null || config === void 0 ? void 0 : config.prefix);
|
|
586
|
-
cssVars[cssVar] = typeof value === 'number' && !(config !== null && config !== void 0 && (_config$unitless = config.unitless) !== null && _config$unitless !== void 0 && _config$unitless[key]) ? "".concat(value, "px") : String(value);
|
|
587
|
-
result[key] = "var(".concat(cssVar, ")");
|
|
588
|
-
}
|
|
589
|
-
});
|
|
590
|
-
return [result, serializeCSSVar(cssVars, themeKey, {
|
|
591
|
-
scope: config === null || config === void 0 ? void 0 : config.scope
|
|
592
|
-
})];
|
|
593
|
-
};
|
|
594
|
-
|
|
595
|
-
/**
|
|
596
|
-
* Wrap `React.useLayoutEffect` which will not throw warning message in test env
|
|
597
|
-
*/
|
|
598
|
-
var useInternalLayoutEffect = process.env.NODE_ENV !== 'test' && canUseDom() ? React.useLayoutEffect : React.useEffect;
|
|
599
|
-
var useLayoutEffect = function useLayoutEffect(callback, deps) {
|
|
600
|
-
var firstMountRef = React.useRef(true);
|
|
601
|
-
useInternalLayoutEffect(function () {
|
|
602
|
-
return callback(firstMountRef.current);
|
|
603
|
-
}, deps);
|
|
604
|
-
|
|
605
|
-
// We tell react that first mount has passed
|
|
606
|
-
useInternalLayoutEffect(function () {
|
|
607
|
-
firstMountRef.current = false;
|
|
608
|
-
return function () {
|
|
609
|
-
firstMountRef.current = true;
|
|
610
|
-
};
|
|
611
|
-
}, []);
|
|
612
|
-
};
|
|
613
|
-
|
|
614
|
-
// We need fully clone React function here
|
|
615
|
-
// to avoid webpack warning React 17 do not export `useId`
|
|
616
|
-
var fullClone$2 = _objectSpread2({}, React);
|
|
617
|
-
var useInsertionEffect$1 = fullClone$2.useInsertionEffect;
|
|
618
|
-
/**
|
|
619
|
-
* Polyfill `useInsertionEffect` for React < 18
|
|
620
|
-
* @param renderEffect will be executed in `useMemo`, and do not have callback
|
|
621
|
-
* @param effect will be executed in `useLayoutEffect`
|
|
622
|
-
* @param deps
|
|
623
|
-
*/
|
|
624
|
-
var useInsertionEffectPolyfill = function useInsertionEffectPolyfill(renderEffect, effect, deps) {
|
|
625
|
-
React.useMemo(renderEffect, deps);
|
|
626
|
-
useLayoutEffect(function () {
|
|
627
|
-
return effect(true);
|
|
628
|
-
}, deps);
|
|
629
|
-
};
|
|
630
|
-
|
|
631
|
-
/**
|
|
632
|
-
* Compatible `useInsertionEffect`
|
|
633
|
-
* will use `useInsertionEffect` if React version >= 18,
|
|
634
|
-
* otherwise use `useInsertionEffectPolyfill`.
|
|
635
|
-
*/
|
|
636
|
-
var useCompatibleInsertionEffect = useInsertionEffect$1 ? function (renderEffect, effect, deps) {
|
|
637
|
-
return useInsertionEffect$1(function () {
|
|
638
|
-
renderEffect();
|
|
639
|
-
return effect();
|
|
640
|
-
}, deps);
|
|
641
|
-
} : useInsertionEffectPolyfill;
|
|
642
|
-
|
|
643
|
-
var fullClone$1 = _objectSpread2({}, React);
|
|
644
|
-
var useInsertionEffect = fullClone$1.useInsertionEffect;
|
|
645
|
-
|
|
646
|
-
// DO NOT register functions in useEffect cleanup function, or functions that registered will never be called.
|
|
647
|
-
var useCleanupRegister = function useCleanupRegister(deps) {
|
|
648
|
-
var effectCleanups = [];
|
|
649
|
-
var cleanupFlag = false;
|
|
650
|
-
function register(fn) {
|
|
651
|
-
if (cleanupFlag) {
|
|
652
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
653
|
-
warning$1(false, '[Ant Design CSS-in-JS] You are registering a cleanup function after unmount, which will not have any effect.');
|
|
654
|
-
}
|
|
655
|
-
return;
|
|
656
|
-
}
|
|
657
|
-
effectCleanups.push(fn);
|
|
658
|
-
}
|
|
659
|
-
React.useEffect(function () {
|
|
660
|
-
// Compatible with strict mode
|
|
661
|
-
cleanupFlag = false;
|
|
662
|
-
return function () {
|
|
663
|
-
cleanupFlag = true;
|
|
664
|
-
if (effectCleanups.length) {
|
|
665
|
-
effectCleanups.forEach(function (fn) {
|
|
666
|
-
return fn();
|
|
667
|
-
});
|
|
668
|
-
}
|
|
669
|
-
};
|
|
670
|
-
}, deps);
|
|
671
|
-
return register;
|
|
672
|
-
};
|
|
673
|
-
var useRun = function useRun() {
|
|
674
|
-
return function (fn) {
|
|
675
|
-
fn();
|
|
676
|
-
};
|
|
677
|
-
};
|
|
678
|
-
|
|
679
|
-
// Only enable register in React 18
|
|
680
|
-
var useEffectCleanupRegister = typeof useInsertionEffect !== 'undefined' ? useCleanupRegister : useRun;
|
|
681
|
-
|
|
682
|
-
function useProdHMR() {
|
|
683
|
-
return false;
|
|
684
|
-
}
|
|
685
|
-
var webpackHMR = false;
|
|
686
|
-
function useDevHMR() {
|
|
687
|
-
return webpackHMR;
|
|
688
|
-
}
|
|
689
|
-
const useHMR = process.env.NODE_ENV === 'production' ? useProdHMR : useDevHMR;
|
|
690
|
-
|
|
691
|
-
// Webpack `module.hot.accept` do not support any deps update trigger
|
|
692
|
-
// We have to hack handler to force mark as HRM
|
|
693
|
-
if (process.env.NODE_ENV !== 'production' && typeof module !== 'undefined' && module && module.hot && typeof window !== 'undefined') {
|
|
694
|
-
// Use `globalThis` first, and `window` for older browsers
|
|
695
|
-
// const win = globalThis as any;
|
|
696
|
-
var win = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : null;
|
|
697
|
-
if (win && typeof win.webpackHotUpdate === 'function') {
|
|
698
|
-
var originWebpackHotUpdate = win.webpackHotUpdate;
|
|
699
|
-
win.webpackHotUpdate = function () {
|
|
700
|
-
webpackHMR = true;
|
|
701
|
-
setTimeout(function () {
|
|
702
|
-
webpackHMR = false;
|
|
703
|
-
}, 0);
|
|
704
|
-
return originWebpackHotUpdate.apply(void 0, arguments);
|
|
705
|
-
};
|
|
706
|
-
}
|
|
707
|
-
}
|
|
708
|
-
|
|
709
|
-
function useGlobalCache(prefix, keyPath, cacheFn, onCacheRemove,
|
|
710
|
-
// Add additional effect trigger by `useInsertionEffect`
|
|
711
|
-
onCacheEffect) {
|
|
712
|
-
var _React$useContext = React.useContext(StyleContext),
|
|
713
|
-
globalCache = _React$useContext.cache;
|
|
714
|
-
var fullPath = [prefix].concat(_toConsumableArray(keyPath));
|
|
715
|
-
var fullPathStr = pathKey(fullPath);
|
|
716
|
-
var register = useEffectCleanupRegister([fullPathStr]);
|
|
717
|
-
var HMRUpdate = useHMR();
|
|
718
|
-
var buildCache = function buildCache(updater) {
|
|
719
|
-
globalCache.opUpdate(fullPathStr, function (prevCache) {
|
|
720
|
-
var _ref = prevCache || [undefined, undefined],
|
|
721
|
-
_ref2 = _slicedToArray(_ref, 2),
|
|
722
|
-
_ref2$ = _ref2[0],
|
|
723
|
-
times = _ref2$ === void 0 ? 0 : _ref2$,
|
|
724
|
-
cache = _ref2[1];
|
|
725
|
-
|
|
726
|
-
// HMR should always ignore cache since developer may change it
|
|
727
|
-
var tmpCache = cache;
|
|
728
|
-
if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) {
|
|
729
|
-
onCacheRemove === null || onCacheRemove === void 0 || onCacheRemove(tmpCache, HMRUpdate);
|
|
730
|
-
tmpCache = null;
|
|
731
|
-
}
|
|
732
|
-
var mergedCache = tmpCache || cacheFn();
|
|
733
|
-
var data = [times, mergedCache];
|
|
734
|
-
|
|
735
|
-
// Call updater if need additional logic
|
|
736
|
-
return updater ? updater(data) : data;
|
|
737
|
-
});
|
|
738
|
-
};
|
|
739
|
-
|
|
740
|
-
// Create cache
|
|
741
|
-
React.useMemo(function () {
|
|
742
|
-
buildCache();
|
|
743
|
-
}, /* eslint-disable react-hooks/exhaustive-deps */
|
|
744
|
-
[fullPathStr]
|
|
745
|
-
/* eslint-enable */);
|
|
746
|
-
|
|
747
|
-
var cacheEntity = globalCache.opGet(fullPathStr);
|
|
748
|
-
|
|
749
|
-
// HMR clean the cache but not trigger `useMemo` again
|
|
750
|
-
// Let's fallback of this
|
|
751
|
-
// ref https://github.com/ant-design/cssinjs/issues/127
|
|
752
|
-
if (process.env.NODE_ENV !== 'production' && !cacheEntity) {
|
|
753
|
-
buildCache();
|
|
754
|
-
cacheEntity = globalCache.opGet(fullPathStr);
|
|
755
|
-
}
|
|
756
|
-
var cacheContent = cacheEntity[1];
|
|
757
|
-
|
|
758
|
-
// Remove if no need anymore
|
|
759
|
-
useCompatibleInsertionEffect(function () {
|
|
760
|
-
onCacheEffect === null || onCacheEffect === void 0 || onCacheEffect(cacheContent);
|
|
761
|
-
}, function (polyfill) {
|
|
762
|
-
// It's bad to call build again in effect.
|
|
763
|
-
// But we have to do this since StrictMode will call effect twice
|
|
764
|
-
// which will clear cache on the first time.
|
|
765
|
-
buildCache(function (_ref3) {
|
|
766
|
-
var _ref4 = _slicedToArray(_ref3, 2),
|
|
767
|
-
times = _ref4[0],
|
|
768
|
-
cache = _ref4[1];
|
|
769
|
-
if (polyfill && times === 0) {
|
|
770
|
-
onCacheEffect === null || onCacheEffect === void 0 || onCacheEffect(cacheContent);
|
|
771
|
-
}
|
|
772
|
-
return [times + 1, cache];
|
|
773
|
-
});
|
|
774
|
-
return function () {
|
|
775
|
-
globalCache.opUpdate(fullPathStr, function (prevCache) {
|
|
776
|
-
var _ref5 = prevCache || [],
|
|
777
|
-
_ref6 = _slicedToArray(_ref5, 2),
|
|
778
|
-
_ref6$ = _ref6[0],
|
|
779
|
-
times = _ref6$ === void 0 ? 0 : _ref6$,
|
|
780
|
-
cache = _ref6[1];
|
|
781
|
-
var nextCount = times - 1;
|
|
782
|
-
if (nextCount === 0) {
|
|
783
|
-
// Always remove styles in useEffect callback
|
|
784
|
-
register(function () {
|
|
785
|
-
// With polyfill, registered callback will always be called synchronously
|
|
786
|
-
// But without polyfill, it will be called in effect clean up,
|
|
787
|
-
// And by that time this cache is cleaned up.
|
|
788
|
-
if (polyfill || !globalCache.opGet(fullPathStr)) {
|
|
789
|
-
onCacheRemove === null || onCacheRemove === void 0 || onCacheRemove(cache, false);
|
|
790
|
-
}
|
|
791
|
-
});
|
|
792
|
-
return null;
|
|
793
|
-
}
|
|
794
|
-
return [times - 1, cache];
|
|
795
|
-
});
|
|
796
|
-
};
|
|
797
|
-
}, [fullPathStr]);
|
|
798
|
-
return cacheContent;
|
|
799
|
-
}
|
|
800
|
-
|
|
801
|
-
var EMPTY_OVERRIDE = {};
|
|
802
|
-
|
|
803
|
-
// Generate different prefix to make user selector break in production env.
|
|
804
|
-
// This helps developer not to do style override directly on the hash id.
|
|
805
|
-
var hashPrefix = process.env.NODE_ENV !== 'production' ? 'css-dev-only-do-not-override' : 'css';
|
|
806
|
-
var tokenKeys = new Map();
|
|
807
|
-
function recordCleanToken(tokenKey) {
|
|
808
|
-
tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) + 1);
|
|
809
|
-
}
|
|
810
|
-
function removeStyleTags(key, instanceId) {
|
|
811
|
-
if (typeof document !== 'undefined') {
|
|
812
|
-
var styles = document.querySelectorAll("style[".concat(ATTR_TOKEN, "=\"").concat(key, "\"]"));
|
|
813
|
-
styles.forEach(function (style) {
|
|
814
|
-
if (style[CSS_IN_JS_INSTANCE] === instanceId) {
|
|
815
|
-
var _style$parentNode;
|
|
816
|
-
(_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 || _style$parentNode.removeChild(style);
|
|
817
|
-
}
|
|
818
|
-
});
|
|
819
|
-
}
|
|
820
|
-
}
|
|
821
|
-
var TOKEN_THRESHOLD = 0;
|
|
822
|
-
|
|
823
|
-
// Remove will check current keys first
|
|
824
|
-
function cleanTokenStyle(tokenKey, instanceId) {
|
|
825
|
-
tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) - 1);
|
|
826
|
-
var tokenKeyList = Array.from(tokenKeys.keys());
|
|
827
|
-
var cleanableKeyList = tokenKeyList.filter(function (key) {
|
|
828
|
-
var count = tokenKeys.get(key) || 0;
|
|
829
|
-
return count <= 0;
|
|
830
|
-
});
|
|
831
|
-
|
|
832
|
-
// Should keep tokens under threshold for not to insert style too often
|
|
833
|
-
if (tokenKeyList.length - cleanableKeyList.length > TOKEN_THRESHOLD) {
|
|
834
|
-
cleanableKeyList.forEach(function (key) {
|
|
835
|
-
removeStyleTags(key, instanceId);
|
|
836
|
-
tokenKeys.delete(key);
|
|
837
|
-
});
|
|
838
|
-
}
|
|
839
|
-
}
|
|
840
|
-
var getComputedToken$1 = function getComputedToken(originToken, overrideToken, theme, format) {
|
|
841
|
-
var derivativeToken = theme.getDerivativeToken(originToken);
|
|
842
|
-
|
|
843
|
-
// Merge with override
|
|
844
|
-
var mergedDerivativeToken = _objectSpread2(_objectSpread2({}, derivativeToken), overrideToken);
|
|
845
|
-
|
|
846
|
-
// Format if needed
|
|
847
|
-
if (format) {
|
|
848
|
-
mergedDerivativeToken = format(mergedDerivativeToken);
|
|
849
|
-
}
|
|
850
|
-
return mergedDerivativeToken;
|
|
851
|
-
};
|
|
852
|
-
var TOKEN_PREFIX = 'token';
|
|
853
|
-
/**
|
|
854
|
-
* Cache theme derivative token as global shared one
|
|
855
|
-
* @param theme Theme entity
|
|
856
|
-
* @param tokens List of tokens, used for cache. Please do not dynamic generate object directly
|
|
857
|
-
* @param option Additional config
|
|
858
|
-
* @returns Call Theme.getDerivativeToken(tokenObject) to get token
|
|
859
|
-
*/
|
|
860
|
-
function useCacheToken(theme, tokens) {
|
|
861
|
-
var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
862
|
-
var _useContext = useContext(StyleContext),
|
|
863
|
-
instanceId = _useContext.cache.instanceId,
|
|
864
|
-
container = _useContext.container;
|
|
865
|
-
var _option$salt = option.salt,
|
|
866
|
-
salt = _option$salt === void 0 ? '' : _option$salt,
|
|
867
|
-
_option$override = option.override,
|
|
868
|
-
override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override,
|
|
869
|
-
formatToken = option.formatToken,
|
|
870
|
-
compute = option.getComputedToken,
|
|
871
|
-
cssVar = option.cssVar;
|
|
872
|
-
|
|
873
|
-
// Basic - We do basic cache here
|
|
874
|
-
var mergedToken = memoResult(function () {
|
|
875
|
-
return Object.assign.apply(Object, [{}].concat(_toConsumableArray(tokens)));
|
|
876
|
-
}, tokens);
|
|
877
|
-
var tokenStr = flattenToken(mergedToken);
|
|
878
|
-
var overrideTokenStr = flattenToken(override);
|
|
879
|
-
var cssVarStr = cssVar ? flattenToken(cssVar) : '';
|
|
880
|
-
var cachedToken = useGlobalCache(TOKEN_PREFIX, [salt, theme.id, tokenStr, overrideTokenStr, cssVarStr], function () {
|
|
881
|
-
var _cssVar$key;
|
|
882
|
-
var mergedDerivativeToken = compute ? compute(mergedToken, override, theme) : getComputedToken$1(mergedToken, override, theme, formatToken);
|
|
883
|
-
|
|
884
|
-
// Replace token value with css variables
|
|
885
|
-
var actualToken = _objectSpread2({}, mergedDerivativeToken);
|
|
886
|
-
var cssVarsStr = '';
|
|
887
|
-
if (!!cssVar) {
|
|
888
|
-
var _transformToken = transformToken(mergedDerivativeToken, cssVar.key, {
|
|
889
|
-
prefix: cssVar.prefix,
|
|
890
|
-
ignore: cssVar.ignore,
|
|
891
|
-
unitless: cssVar.unitless,
|
|
892
|
-
preserve: cssVar.preserve
|
|
893
|
-
});
|
|
894
|
-
var _transformToken2 = _slicedToArray(_transformToken, 2);
|
|
895
|
-
mergedDerivativeToken = _transformToken2[0];
|
|
896
|
-
cssVarsStr = _transformToken2[1];
|
|
897
|
-
}
|
|
898
|
-
|
|
899
|
-
// Optimize for `useStyleRegister` performance
|
|
900
|
-
var tokenKey = token2key(mergedDerivativeToken, salt);
|
|
901
|
-
mergedDerivativeToken._tokenKey = tokenKey;
|
|
902
|
-
actualToken._tokenKey = token2key(actualToken, salt);
|
|
903
|
-
var themeKey = (_cssVar$key = cssVar === null || cssVar === void 0 ? void 0 : cssVar.key) !== null && _cssVar$key !== void 0 ? _cssVar$key : tokenKey;
|
|
904
|
-
mergedDerivativeToken._themeKey = themeKey;
|
|
905
|
-
recordCleanToken(themeKey);
|
|
906
|
-
var hashId = "".concat(hashPrefix, "-").concat(murmur2(tokenKey));
|
|
907
|
-
mergedDerivativeToken._hashId = hashId; // Not used
|
|
908
|
-
|
|
909
|
-
return [mergedDerivativeToken, hashId, actualToken, cssVarsStr, (cssVar === null || cssVar === void 0 ? void 0 : cssVar.key) || ''];
|
|
910
|
-
}, function (cache) {
|
|
911
|
-
// Remove token will remove all related style
|
|
912
|
-
cleanTokenStyle(cache[0]._themeKey, instanceId);
|
|
913
|
-
}, function (_ref) {
|
|
914
|
-
var _ref2 = _slicedToArray(_ref, 4),
|
|
915
|
-
token = _ref2[0],
|
|
916
|
-
cssVarsStr = _ref2[3];
|
|
917
|
-
if (cssVar && cssVarsStr) {
|
|
918
|
-
var style = updateCSS(cssVarsStr, murmur2("css-variables-".concat(token._themeKey)), {
|
|
919
|
-
mark: ATTR_MARK,
|
|
920
|
-
prepend: 'queue',
|
|
921
|
-
attachTo: container,
|
|
922
|
-
priority: -999
|
|
923
|
-
});
|
|
924
|
-
style[CSS_IN_JS_INSTANCE] = instanceId;
|
|
925
|
-
|
|
926
|
-
// Used for `useCacheToken` to remove on batch when token removed
|
|
927
|
-
style.setAttribute(ATTR_TOKEN, token._themeKey);
|
|
928
|
-
}
|
|
929
|
-
});
|
|
930
|
-
return cachedToken;
|
|
931
|
-
}
|
|
932
|
-
|
|
933
|
-
var unitlessKeys = {
|
|
934
|
-
animationIterationCount: 1,
|
|
935
|
-
borderImageOutset: 1,
|
|
936
|
-
borderImageSlice: 1,
|
|
937
|
-
borderImageWidth: 1,
|
|
938
|
-
boxFlex: 1,
|
|
939
|
-
boxFlexGroup: 1,
|
|
940
|
-
boxOrdinalGroup: 1,
|
|
941
|
-
columnCount: 1,
|
|
942
|
-
columns: 1,
|
|
943
|
-
flex: 1,
|
|
944
|
-
flexGrow: 1,
|
|
945
|
-
flexPositive: 1,
|
|
946
|
-
flexShrink: 1,
|
|
947
|
-
flexNegative: 1,
|
|
948
|
-
flexOrder: 1,
|
|
949
|
-
gridRow: 1,
|
|
950
|
-
gridRowEnd: 1,
|
|
951
|
-
gridRowSpan: 1,
|
|
952
|
-
gridRowStart: 1,
|
|
953
|
-
gridColumn: 1,
|
|
954
|
-
gridColumnEnd: 1,
|
|
955
|
-
gridColumnSpan: 1,
|
|
956
|
-
gridColumnStart: 1,
|
|
957
|
-
msGridRow: 1,
|
|
958
|
-
msGridRowSpan: 1,
|
|
959
|
-
msGridColumn: 1,
|
|
960
|
-
msGridColumnSpan: 1,
|
|
961
|
-
fontWeight: 1,
|
|
962
|
-
lineHeight: 1,
|
|
963
|
-
opacity: 1,
|
|
964
|
-
order: 1,
|
|
965
|
-
orphans: 1,
|
|
966
|
-
tabSize: 1,
|
|
967
|
-
widows: 1,
|
|
968
|
-
zIndex: 1,
|
|
969
|
-
zoom: 1,
|
|
970
|
-
WebkitLineClamp: 1,
|
|
971
|
-
// SVG-related properties
|
|
972
|
-
fillOpacity: 1,
|
|
973
|
-
floodOpacity: 1,
|
|
974
|
-
stopOpacity: 1,
|
|
975
|
-
strokeDasharray: 1,
|
|
976
|
-
strokeDashoffset: 1,
|
|
977
|
-
strokeMiterlimit: 1,
|
|
978
|
-
strokeOpacity: 1,
|
|
979
|
-
strokeWidth: 1
|
|
980
|
-
};
|
|
981
|
-
|
|
982
|
-
var COMMENT = 'comm';
|
|
983
|
-
var RULESET = 'rule';
|
|
984
|
-
var DECLARATION = 'decl';
|
|
985
|
-
var IMPORT = '@import';
|
|
986
|
-
var NAMESPACE = '@namespace';
|
|
987
|
-
var KEYFRAMES = '@keyframes';
|
|
988
|
-
var LAYER = '@layer';
|
|
989
|
-
|
|
990
|
-
/**
|
|
991
|
-
* @param {number}
|
|
992
|
-
* @return {number}
|
|
993
|
-
*/
|
|
994
|
-
var abs = Math.abs;
|
|
995
|
-
|
|
996
|
-
/**
|
|
997
|
-
* @param {number}
|
|
998
|
-
* @return {string}
|
|
999
|
-
*/
|
|
1000
|
-
var from = String.fromCharCode;
|
|
1001
|
-
|
|
1002
|
-
/**
|
|
1003
|
-
* @param {string} value
|
|
1004
|
-
* @return {string}
|
|
1005
|
-
*/
|
|
1006
|
-
function trim (value) {
|
|
1007
|
-
return value.trim()
|
|
1008
|
-
}
|
|
1009
|
-
|
|
1010
|
-
/**
|
|
1011
|
-
* @param {string} value
|
|
1012
|
-
* @param {(string|RegExp)} pattern
|
|
1013
|
-
* @param {string} replacement
|
|
1014
|
-
* @return {string}
|
|
1015
|
-
*/
|
|
1016
|
-
function replace (value, pattern, replacement) {
|
|
1017
|
-
return value.replace(pattern, replacement)
|
|
1018
|
-
}
|
|
1019
|
-
|
|
1020
|
-
/**
|
|
1021
|
-
* @param {string} value
|
|
1022
|
-
* @param {string} search
|
|
1023
|
-
* @param {number} position
|
|
1024
|
-
* @return {number}
|
|
1025
|
-
*/
|
|
1026
|
-
function indexof (value, search, position) {
|
|
1027
|
-
return value.indexOf(search, position)
|
|
1028
|
-
}
|
|
1029
|
-
|
|
1030
|
-
/**
|
|
1031
|
-
* @param {string} value
|
|
1032
|
-
* @param {number} index
|
|
1033
|
-
* @return {number}
|
|
1034
|
-
*/
|
|
1035
|
-
function charat (value, index) {
|
|
1036
|
-
return value.charCodeAt(index) | 0
|
|
1037
|
-
}
|
|
1038
|
-
|
|
1039
|
-
/**
|
|
1040
|
-
* @param {string} value
|
|
1041
|
-
* @param {number} begin
|
|
1042
|
-
* @param {number} end
|
|
1043
|
-
* @return {string}
|
|
1044
|
-
*/
|
|
1045
|
-
function substr (value, begin, end) {
|
|
1046
|
-
return value.slice(begin, end)
|
|
1047
|
-
}
|
|
1048
|
-
|
|
1049
|
-
/**
|
|
1050
|
-
* @param {string} value
|
|
1051
|
-
* @return {number}
|
|
1052
|
-
*/
|
|
1053
|
-
function strlen (value) {
|
|
1054
|
-
return value.length
|
|
1055
|
-
}
|
|
1056
|
-
|
|
1057
|
-
/**
|
|
1058
|
-
* @param {any[]} value
|
|
1059
|
-
* @return {number}
|
|
1060
|
-
*/
|
|
1061
|
-
function sizeof (value) {
|
|
1062
|
-
return value.length
|
|
1063
|
-
}
|
|
1064
|
-
|
|
1065
|
-
/**
|
|
1066
|
-
* @param {any} value
|
|
1067
|
-
* @param {any[]} array
|
|
1068
|
-
* @return {any}
|
|
1069
|
-
*/
|
|
1070
|
-
function append (value, array) {
|
|
1071
|
-
return array.push(value), value
|
|
1072
|
-
}
|
|
1073
|
-
|
|
1074
|
-
var line = 1;
|
|
1075
|
-
var column = 1;
|
|
1076
|
-
var length = 0;
|
|
1077
|
-
var position = 0;
|
|
1078
|
-
var character = 0;
|
|
1079
|
-
var characters = '';
|
|
1080
|
-
|
|
1081
|
-
/**
|
|
1082
|
-
* @param {string} value
|
|
1083
|
-
* @param {object | null} root
|
|
1084
|
-
* @param {object | null} parent
|
|
1085
|
-
* @param {string} type
|
|
1086
|
-
* @param {string[] | string} props
|
|
1087
|
-
* @param {object[] | string} children
|
|
1088
|
-
* @param {object[]} siblings
|
|
1089
|
-
* @param {number} length
|
|
1090
|
-
*/
|
|
1091
|
-
function node (value, root, parent, type, props, children, length, siblings) {
|
|
1092
|
-
return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: '', siblings: siblings}
|
|
1093
|
-
}
|
|
1094
|
-
|
|
1095
|
-
/**
|
|
1096
|
-
* @return {number}
|
|
1097
|
-
*/
|
|
1098
|
-
function char () {
|
|
1099
|
-
return character
|
|
1100
|
-
}
|
|
1101
|
-
|
|
1102
|
-
/**
|
|
1103
|
-
* @return {number}
|
|
1104
|
-
*/
|
|
1105
|
-
function prev () {
|
|
1106
|
-
character = position > 0 ? charat(characters, --position) : 0;
|
|
1107
|
-
|
|
1108
|
-
if (column--, character === 10)
|
|
1109
|
-
column = 1, line--;
|
|
1110
|
-
|
|
1111
|
-
return character
|
|
1112
|
-
}
|
|
1113
|
-
|
|
1114
|
-
/**
|
|
1115
|
-
* @return {number}
|
|
1116
|
-
*/
|
|
1117
|
-
function next () {
|
|
1118
|
-
character = position < length ? charat(characters, position++) : 0;
|
|
1119
|
-
|
|
1120
|
-
if (column++, character === 10)
|
|
1121
|
-
column = 1, line++;
|
|
1122
|
-
|
|
1123
|
-
return character
|
|
1124
|
-
}
|
|
1125
|
-
|
|
1126
|
-
/**
|
|
1127
|
-
* @return {number}
|
|
1128
|
-
*/
|
|
1129
|
-
function peek () {
|
|
1130
|
-
return charat(characters, position)
|
|
1131
|
-
}
|
|
1132
|
-
|
|
1133
|
-
/**
|
|
1134
|
-
* @return {number}
|
|
1135
|
-
*/
|
|
1136
|
-
function caret () {
|
|
1137
|
-
return position
|
|
1138
|
-
}
|
|
1139
|
-
|
|
1140
|
-
/**
|
|
1141
|
-
* @param {number} begin
|
|
1142
|
-
* @param {number} end
|
|
1143
|
-
* @return {string}
|
|
1144
|
-
*/
|
|
1145
|
-
function slice (begin, end) {
|
|
1146
|
-
return substr(characters, begin, end)
|
|
1147
|
-
}
|
|
1148
|
-
|
|
1149
|
-
/**
|
|
1150
|
-
* @param {number} type
|
|
1151
|
-
* @return {number}
|
|
1152
|
-
*/
|
|
1153
|
-
function token (type) {
|
|
1154
|
-
switch (type) {
|
|
1155
|
-
// \0 \t \n \r \s whitespace token
|
|
1156
|
-
case 0: case 9: case 10: case 13: case 32:
|
|
1157
|
-
return 5
|
|
1158
|
-
// ! + , / > @ ~ isolate token
|
|
1159
|
-
case 33: case 43: case 44: case 47: case 62: case 64: case 126:
|
|
1160
|
-
// ; { } breakpoint token
|
|
1161
|
-
case 59: case 123: case 125:
|
|
1162
|
-
return 4
|
|
1163
|
-
// : accompanied token
|
|
1164
|
-
case 58:
|
|
1165
|
-
return 3
|
|
1166
|
-
// " ' ( [ opening delimit token
|
|
1167
|
-
case 34: case 39: case 40: case 91:
|
|
1168
|
-
return 2
|
|
1169
|
-
// ) ] closing delimit token
|
|
1170
|
-
case 41: case 93:
|
|
1171
|
-
return 1
|
|
1172
|
-
}
|
|
1173
|
-
|
|
1174
|
-
return 0
|
|
1175
|
-
}
|
|
1176
|
-
|
|
1177
|
-
/**
|
|
1178
|
-
* @param {string} value
|
|
1179
|
-
* @return {any[]}
|
|
1180
|
-
*/
|
|
1181
|
-
function alloc (value) {
|
|
1182
|
-
return line = column = 1, length = strlen(characters = value), position = 0, []
|
|
1183
|
-
}
|
|
1184
|
-
|
|
1185
|
-
/**
|
|
1186
|
-
* @param {any} value
|
|
1187
|
-
* @return {any}
|
|
1188
|
-
*/
|
|
1189
|
-
function dealloc (value) {
|
|
1190
|
-
return characters = '', value
|
|
1191
|
-
}
|
|
1192
|
-
|
|
1193
|
-
/**
|
|
1194
|
-
* @param {number} type
|
|
1195
|
-
* @return {string}
|
|
1196
|
-
*/
|
|
1197
|
-
function delimit (type) {
|
|
1198
|
-
return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
|
|
1199
|
-
}
|
|
1200
|
-
|
|
1201
|
-
/**
|
|
1202
|
-
* @param {number} type
|
|
1203
|
-
* @return {string}
|
|
1204
|
-
*/
|
|
1205
|
-
function whitespace (type) {
|
|
1206
|
-
while (character = peek())
|
|
1207
|
-
if (character < 33)
|
|
1208
|
-
next();
|
|
1209
|
-
else
|
|
1210
|
-
break
|
|
1211
|
-
|
|
1212
|
-
return token(type) > 2 || token(character) > 3 ? '' : ' '
|
|
1213
|
-
}
|
|
1214
|
-
|
|
1215
|
-
/**
|
|
1216
|
-
* @param {number} index
|
|
1217
|
-
* @param {number} count
|
|
1218
|
-
* @return {string}
|
|
1219
|
-
*/
|
|
1220
|
-
function escaping (index, count) {
|
|
1221
|
-
while (--count && next())
|
|
1222
|
-
// not 0-9 A-F a-f
|
|
1223
|
-
if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
|
|
1224
|
-
break
|
|
1225
|
-
|
|
1226
|
-
return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
|
|
1227
|
-
}
|
|
1228
|
-
|
|
1229
|
-
/**
|
|
1230
|
-
* @param {number} type
|
|
1231
|
-
* @return {number}
|
|
1232
|
-
*/
|
|
1233
|
-
function delimiter (type) {
|
|
1234
|
-
while (next())
|
|
1235
|
-
switch (character) {
|
|
1236
|
-
// ] ) " '
|
|
1237
|
-
case type:
|
|
1238
|
-
return position
|
|
1239
|
-
// " '
|
|
1240
|
-
case 34: case 39:
|
|
1241
|
-
if (type !== 34 && type !== 39)
|
|
1242
|
-
delimiter(character);
|
|
1243
|
-
break
|
|
1244
|
-
// (
|
|
1245
|
-
case 40:
|
|
1246
|
-
if (type === 41)
|
|
1247
|
-
delimiter(type);
|
|
1248
|
-
break
|
|
1249
|
-
// \
|
|
1250
|
-
case 92:
|
|
1251
|
-
next();
|
|
1252
|
-
break
|
|
1253
|
-
}
|
|
1254
|
-
|
|
1255
|
-
return position
|
|
1256
|
-
}
|
|
1257
|
-
|
|
1258
|
-
/**
|
|
1259
|
-
* @param {number} type
|
|
1260
|
-
* @param {number} index
|
|
1261
|
-
* @return {number}
|
|
1262
|
-
*/
|
|
1263
|
-
function commenter (type, index) {
|
|
1264
|
-
while (next())
|
|
1265
|
-
// //
|
|
1266
|
-
if (type + character === 47 + 10)
|
|
1267
|
-
break
|
|
1268
|
-
// /*
|
|
1269
|
-
else if (type + character === 42 + 42 && peek() === 47)
|
|
1270
|
-
break
|
|
1271
|
-
|
|
1272
|
-
return '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())
|
|
1273
|
-
}
|
|
1274
|
-
|
|
1275
|
-
/**
|
|
1276
|
-
* @param {number} index
|
|
1277
|
-
* @return {string}
|
|
1278
|
-
*/
|
|
1279
|
-
function identifier (index) {
|
|
1280
|
-
while (!token(peek()))
|
|
1281
|
-
next();
|
|
1282
|
-
|
|
1283
|
-
return slice(index, position)
|
|
1284
|
-
}
|
|
1285
|
-
|
|
1286
|
-
/**
|
|
1287
|
-
* @param {string} value
|
|
1288
|
-
* @return {object[]}
|
|
1289
|
-
*/
|
|
1290
|
-
function compile (value) {
|
|
1291
|
-
return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))
|
|
1292
|
-
}
|
|
1293
|
-
|
|
1294
|
-
/**
|
|
1295
|
-
* @param {string} value
|
|
1296
|
-
* @param {object} root
|
|
1297
|
-
* @param {object?} parent
|
|
1298
|
-
* @param {string[]} rule
|
|
1299
|
-
* @param {string[]} rules
|
|
1300
|
-
* @param {string[]} rulesets
|
|
1301
|
-
* @param {number[]} pseudo
|
|
1302
|
-
* @param {number[]} points
|
|
1303
|
-
* @param {string[]} declarations
|
|
1304
|
-
* @return {object}
|
|
1305
|
-
*/
|
|
1306
|
-
function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
|
|
1307
|
-
var index = 0;
|
|
1308
|
-
var offset = 0;
|
|
1309
|
-
var length = pseudo;
|
|
1310
|
-
var atrule = 0;
|
|
1311
|
-
var property = 0;
|
|
1312
|
-
var previous = 0;
|
|
1313
|
-
var variable = 1;
|
|
1314
|
-
var scanning = 1;
|
|
1315
|
-
var ampersand = 1;
|
|
1316
|
-
var character = 0;
|
|
1317
|
-
var type = '';
|
|
1318
|
-
var props = rules;
|
|
1319
|
-
var children = rulesets;
|
|
1320
|
-
var reference = rule;
|
|
1321
|
-
var characters = type;
|
|
1322
|
-
|
|
1323
|
-
while (scanning)
|
|
1324
|
-
switch (previous = character, character = next()) {
|
|
1325
|
-
// (
|
|
1326
|
-
case 40:
|
|
1327
|
-
if (previous != 108 && charat(characters, length - 1) == 58) {
|
|
1328
|
-
if (indexof(characters += replace(delimit(character), '&', '&\f'), '&\f', abs(index ? points[index - 1] : 0)) != -1)
|
|
1329
|
-
ampersand = -1;
|
|
1330
|
-
break
|
|
1331
|
-
}
|
|
1332
|
-
// " ' [
|
|
1333
|
-
case 34: case 39: case 91:
|
|
1334
|
-
characters += delimit(character);
|
|
1335
|
-
break
|
|
1336
|
-
// \t \n \r \s
|
|
1337
|
-
case 9: case 10: case 13: case 32:
|
|
1338
|
-
characters += whitespace(previous);
|
|
1339
|
-
break
|
|
1340
|
-
// \
|
|
1341
|
-
case 92:
|
|
1342
|
-
characters += escaping(caret() - 1, 7);
|
|
1343
|
-
continue
|
|
1344
|
-
// /
|
|
1345
|
-
case 47:
|
|
1346
|
-
switch (peek()) {
|
|
1347
|
-
case 42: case 47:
|
|
1348
|
-
append(comment(commenter(next(), caret()), root, parent, declarations), declarations);
|
|
1349
|
-
if ((token(previous || 1) == 5 || token(peek() || 1) == 5) && strlen(characters) && substr(characters, -1, void 0) !== ' ') characters += ' ';
|
|
1350
|
-
break
|
|
1351
|
-
default:
|
|
1352
|
-
characters += '/';
|
|
1353
|
-
}
|
|
1354
|
-
break
|
|
1355
|
-
// {
|
|
1356
|
-
case 123 * variable:
|
|
1357
|
-
points[index++] = strlen(characters) * ampersand;
|
|
1358
|
-
// } ; \0
|
|
1359
|
-
case 125 * variable: case 59: case 0:
|
|
1360
|
-
switch (character) {
|
|
1361
|
-
// \0 }
|
|
1362
|
-
case 0: case 125: scanning = 0;
|
|
1363
|
-
// ;
|
|
1364
|
-
case 59 + offset: if (ampersand == -1) characters = replace(characters, /\f/g, '');
|
|
1365
|
-
if (property > 0 && (strlen(characters) - length || (variable === 0 && previous === 47)))
|
|
1366
|
-
append(property > 32 ? declaration(characters + ';', rule, parent, length - 1, declarations) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2, declarations), declarations);
|
|
1367
|
-
break
|
|
1368
|
-
// @ ;
|
|
1369
|
-
case 59: characters += ';';
|
|
1370
|
-
// { rule/at-rule
|
|
1371
|
-
default:
|
|
1372
|
-
append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length, rulesets), rulesets);
|
|
1373
|
-
|
|
1374
|
-
if (character === 123)
|
|
1375
|
-
if (offset === 0)
|
|
1376
|
-
parse(characters, root, reference, reference, props, rulesets, length, points, children);
|
|
1377
|
-
else {
|
|
1378
|
-
switch (atrule) {
|
|
1379
|
-
// c(ontainer)
|
|
1380
|
-
case 99:
|
|
1381
|
-
if (charat(characters, 3) === 110) break
|
|
1382
|
-
// l(ayer)
|
|
1383
|
-
case 108:
|
|
1384
|
-
if (charat(characters, 2) === 97) break
|
|
1385
|
-
default:
|
|
1386
|
-
offset = 0;
|
|
1387
|
-
// d(ocument) m(edia) s(upports)
|
|
1388
|
-
case 100: case 109: case 115:
|
|
1389
|
-
}
|
|
1390
|
-
if (offset) parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length, children), children), rules, children, length, points, rule ? props : children);
|
|
1391
|
-
else parse(characters, reference, reference, reference, [''], children, 0, points, children);
|
|
1392
|
-
}
|
|
1393
|
-
}
|
|
1394
|
-
|
|
1395
|
-
index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo;
|
|
1396
|
-
break
|
|
1397
|
-
// :
|
|
1398
|
-
case 58:
|
|
1399
|
-
length = 1 + strlen(characters), property = previous;
|
|
1400
|
-
default:
|
|
1401
|
-
if (variable < 1)
|
|
1402
|
-
if (character == 123)
|
|
1403
|
-
--variable;
|
|
1404
|
-
else if (character == 125 && variable++ == 0 && prev() == 125)
|
|
1405
|
-
continue
|
|
1406
|
-
|
|
1407
|
-
switch (characters += from(character), character * variable) {
|
|
1408
|
-
// &
|
|
1409
|
-
case 38:
|
|
1410
|
-
ampersand = offset > 0 ? 1 : (characters += '\f', -1);
|
|
1411
|
-
break
|
|
1412
|
-
// ,
|
|
1413
|
-
case 44:
|
|
1414
|
-
points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1;
|
|
1415
|
-
break
|
|
1416
|
-
// @
|
|
1417
|
-
case 64:
|
|
1418
|
-
// -
|
|
1419
|
-
if (peek() === 45)
|
|
1420
|
-
characters += delimit(next());
|
|
1421
|
-
|
|
1422
|
-
atrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++;
|
|
1423
|
-
break
|
|
1424
|
-
// -
|
|
1425
|
-
case 45:
|
|
1426
|
-
if (previous === 45 && strlen(characters) == 2)
|
|
1427
|
-
variable = 0;
|
|
1428
|
-
}
|
|
1429
|
-
}
|
|
1430
|
-
|
|
1431
|
-
return rulesets
|
|
1432
|
-
}
|
|
1433
|
-
|
|
1434
|
-
/**
|
|
1435
|
-
* @param {string} value
|
|
1436
|
-
* @param {object} root
|
|
1437
|
-
* @param {object?} parent
|
|
1438
|
-
* @param {number} index
|
|
1439
|
-
* @param {number} offset
|
|
1440
|
-
* @param {string[]} rules
|
|
1441
|
-
* @param {number[]} points
|
|
1442
|
-
* @param {string} type
|
|
1443
|
-
* @param {string[]} props
|
|
1444
|
-
* @param {string[]} children
|
|
1445
|
-
* @param {number} length
|
|
1446
|
-
* @param {object[]} siblings
|
|
1447
|
-
* @return {object}
|
|
1448
|
-
*/
|
|
1449
|
-
function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length, siblings) {
|
|
1450
|
-
var post = offset - 1;
|
|
1451
|
-
var rule = offset === 0 ? rules : [''];
|
|
1452
|
-
var size = sizeof(rule);
|
|
1453
|
-
|
|
1454
|
-
for (var i = 0, j = 0, k = 0; i < index; ++i)
|
|
1455
|
-
for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)
|
|
1456
|
-
if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\f/g, rule[x])))
|
|
1457
|
-
props[k++] = z;
|
|
1458
|
-
|
|
1459
|
-
return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length, siblings)
|
|
1460
|
-
}
|
|
1461
|
-
|
|
1462
|
-
/**
|
|
1463
|
-
* @param {number} value
|
|
1464
|
-
* @param {object} root
|
|
1465
|
-
* @param {object?} parent
|
|
1466
|
-
* @param {object[]} siblings
|
|
1467
|
-
* @return {object}
|
|
1468
|
-
*/
|
|
1469
|
-
function comment (value, root, parent, siblings) {
|
|
1470
|
-
return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0, siblings)
|
|
1471
|
-
}
|
|
1472
|
-
|
|
1473
|
-
/**
|
|
1474
|
-
* @param {string} value
|
|
1475
|
-
* @param {object} root
|
|
1476
|
-
* @param {object?} parent
|
|
1477
|
-
* @param {number} length
|
|
1478
|
-
* @param {object[]} siblings
|
|
1479
|
-
* @return {object}
|
|
1480
|
-
*/
|
|
1481
|
-
function declaration (value, root, parent, length, siblings) {
|
|
1482
|
-
return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length, siblings)
|
|
1483
|
-
}
|
|
1484
|
-
|
|
1485
|
-
/**
|
|
1486
|
-
* @param {object[]} children
|
|
1487
|
-
* @param {function} callback
|
|
1488
|
-
* @return {string}
|
|
1489
|
-
*/
|
|
1490
|
-
function serialize (children, callback) {
|
|
1491
|
-
var output = '';
|
|
1492
|
-
|
|
1493
|
-
for (var i = 0; i < children.length; i++)
|
|
1494
|
-
output += callback(children[i], i, children, callback) || '';
|
|
1495
|
-
|
|
1496
|
-
return output
|
|
1497
|
-
}
|
|
1498
|
-
|
|
1499
|
-
/**
|
|
1500
|
-
* @param {object} element
|
|
1501
|
-
* @param {number} index
|
|
1502
|
-
* @param {object[]} children
|
|
1503
|
-
* @param {function} callback
|
|
1504
|
-
* @return {string}
|
|
1505
|
-
*/
|
|
1506
|
-
function stringify (element, index, children, callback) {
|
|
1507
|
-
switch (element.type) {
|
|
1508
|
-
case LAYER: if (element.children.length) break
|
|
1509
|
-
case IMPORT: case NAMESPACE: case DECLARATION: return element.return = element.return || element.value
|
|
1510
|
-
case COMMENT: return ''
|
|
1511
|
-
case KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'
|
|
1512
|
-
case RULESET: if (!strlen(element.value = element.props.join(','))) return ''
|
|
1513
|
-
}
|
|
1514
|
-
|
|
1515
|
-
return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
|
|
1516
|
-
}
|
|
1517
|
-
|
|
1518
|
-
function lintWarning(message, info) {
|
|
1519
|
-
var path = info.path,
|
|
1520
|
-
parentSelectors = info.parentSelectors;
|
|
1521
|
-
warningOnce(false, "[Ant Design CSS-in-JS] ".concat(path ? "Error in ".concat(path, ": ") : '').concat(message).concat(parentSelectors.length ? " Selector: ".concat(parentSelectors.join(' | ')) : ''));
|
|
1522
|
-
}
|
|
1523
|
-
|
|
1524
|
-
var linter$1 = function linter(key, value, info) {
|
|
1525
|
-
if (key === 'content') {
|
|
1526
|
-
// From emotion: https://github.com/emotion-js/emotion/blob/main/packages/serialize/src/index.js#L63
|
|
1527
|
-
var contentValuePattern = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/;
|
|
1528
|
-
var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];
|
|
1529
|
-
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) !== "'")) {
|
|
1530
|
-
lintWarning("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"".concat(value, "\"'`."), info);
|
|
1531
|
-
}
|
|
1532
|
-
}
|
|
1533
|
-
};
|
|
1534
|
-
|
|
1535
|
-
var linter = function linter(key, value, info) {
|
|
1536
|
-
if (key === 'animation') {
|
|
1537
|
-
if (info.hashId && value !== 'none') {
|
|
1538
|
-
lintWarning("You seem to be using hashed animation '".concat(value, "', in which case 'animationName' with Keyframe as value is recommended."), info);
|
|
1539
|
-
}
|
|
1540
|
-
}
|
|
1541
|
-
};
|
|
1542
|
-
|
|
1543
|
-
var ATTR_CACHE_MAP = 'data-ant-cssinjs-cache-path';
|
|
1544
|
-
|
|
1545
|
-
/**
|
|
1546
|
-
* This marks style from the css file.
|
|
1547
|
-
* Which means not exist in `<style />` tag.
|
|
1548
|
-
*/
|
|
1549
|
-
var CSS_FILE_STYLE = '_FILE_STYLE__';
|
|
1550
|
-
var cachePathMap;
|
|
1551
|
-
var fromCSSFile = true;
|
|
1552
|
-
function prepare() {
|
|
1553
|
-
if (!cachePathMap) {
|
|
1554
|
-
cachePathMap = {};
|
|
1555
|
-
if (canUseDom()) {
|
|
1556
|
-
var div = document.createElement('div');
|
|
1557
|
-
div.className = ATTR_CACHE_MAP;
|
|
1558
|
-
div.style.position = 'fixed';
|
|
1559
|
-
div.style.visibility = 'hidden';
|
|
1560
|
-
div.style.top = '-9999px';
|
|
1561
|
-
document.body.appendChild(div);
|
|
1562
|
-
var content = getComputedStyle(div).content || '';
|
|
1563
|
-
content = content.replace(/^"/, '').replace(/"$/, '');
|
|
1564
|
-
|
|
1565
|
-
// Fill data
|
|
1566
|
-
content.split(';').forEach(function (item) {
|
|
1567
|
-
var _item$split = item.split(':'),
|
|
1568
|
-
_item$split2 = _slicedToArray(_item$split, 2),
|
|
1569
|
-
path = _item$split2[0],
|
|
1570
|
-
hash = _item$split2[1];
|
|
1571
|
-
cachePathMap[path] = hash;
|
|
1572
|
-
});
|
|
1573
|
-
|
|
1574
|
-
// Remove inline record style
|
|
1575
|
-
var inlineMapStyle = document.querySelector("style[".concat(ATTR_CACHE_MAP, "]"));
|
|
1576
|
-
if (inlineMapStyle) {
|
|
1577
|
-
var _inlineMapStyle$paren;
|
|
1578
|
-
fromCSSFile = false;
|
|
1579
|
-
(_inlineMapStyle$paren = inlineMapStyle.parentNode) === null || _inlineMapStyle$paren === void 0 || _inlineMapStyle$paren.removeChild(inlineMapStyle);
|
|
1580
|
-
}
|
|
1581
|
-
document.body.removeChild(div);
|
|
1582
|
-
}
|
|
1583
|
-
}
|
|
1584
|
-
}
|
|
1585
|
-
function existPath(path) {
|
|
1586
|
-
prepare();
|
|
1587
|
-
return !!cachePathMap[path];
|
|
1588
|
-
}
|
|
1589
|
-
function getStyleAndHash(path) {
|
|
1590
|
-
var hash = cachePathMap[path];
|
|
1591
|
-
var styleStr = null;
|
|
1592
|
-
if (hash && canUseDom()) {
|
|
1593
|
-
if (fromCSSFile) {
|
|
1594
|
-
styleStr = CSS_FILE_STYLE;
|
|
1595
|
-
} else {
|
|
1596
|
-
var _style = document.querySelector("style[".concat(ATTR_MARK, "=\"").concat(cachePathMap[path], "\"]"));
|
|
1597
|
-
if (_style) {
|
|
1598
|
-
styleStr = _style.innerHTML;
|
|
1599
|
-
} else {
|
|
1600
|
-
// Clean up since not exist anymore
|
|
1601
|
-
delete cachePathMap[path];
|
|
1602
|
-
}
|
|
1603
|
-
}
|
|
1604
|
-
}
|
|
1605
|
-
return [styleStr, hash];
|
|
1606
|
-
}
|
|
1607
|
-
|
|
1608
|
-
var SKIP_CHECK = '_skip_check_';
|
|
1609
|
-
var MULTI_VALUE = '_multi_value_';
|
|
1610
|
-
// ============================================================================
|
|
1611
|
-
// == Parser ==
|
|
1612
|
-
// ============================================================================
|
|
1613
|
-
// Preprocessor style content to browser support one
|
|
1614
|
-
function normalizeStyle(styleStr) {
|
|
1615
|
-
var serialized = serialize(compile(styleStr), stringify);
|
|
1616
|
-
return serialized.replace(/\{%%%\:[^;];}/g, ';');
|
|
1617
|
-
}
|
|
1618
|
-
function isCompoundCSSProperty(value) {
|
|
1619
|
-
return _typeof(value) === 'object' && value && (SKIP_CHECK in value || MULTI_VALUE in value);
|
|
1620
|
-
}
|
|
1621
|
-
|
|
1622
|
-
// 注入 hash 值
|
|
1623
|
-
function injectSelectorHash(key, hashId, hashPriority) {
|
|
1624
|
-
if (!hashId) {
|
|
1625
|
-
return key;
|
|
1626
|
-
}
|
|
1627
|
-
var hashClassName = ".".concat(hashId);
|
|
1628
|
-
var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName;
|
|
1629
|
-
|
|
1630
|
-
// 注入 hashId
|
|
1631
|
-
var keys = key.split(',').map(function (k) {
|
|
1632
|
-
var _firstPath$match;
|
|
1633
|
-
var fullPath = k.trim().split(/\s+/);
|
|
1634
|
-
|
|
1635
|
-
// 如果 Selector 第一个是 HTML Element,那我们就插到它的后面。反之,就插到最前面。
|
|
1636
|
-
var firstPath = fullPath[0] || '';
|
|
1637
|
-
var htmlElement = ((_firstPath$match = firstPath.match(/^\w+/)) === null || _firstPath$match === void 0 ? void 0 : _firstPath$match[0]) || '';
|
|
1638
|
-
firstPath = "".concat(htmlElement).concat(hashSelector).concat(firstPath.slice(htmlElement.length));
|
|
1639
|
-
return [firstPath].concat(_toConsumableArray(fullPath.slice(1))).join(' ');
|
|
1640
|
-
});
|
|
1641
|
-
return keys.join(',');
|
|
1642
|
-
}
|
|
1643
|
-
// Parse CSSObject to style content
|
|
1644
|
-
var parseStyle = function parseStyle(interpolation) {
|
|
1645
|
-
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
1646
|
-
var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
|
|
1647
|
-
root: true,
|
|
1648
|
-
parentSelectors: []
|
|
1649
|
-
},
|
|
1650
|
-
root = _ref.root,
|
|
1651
|
-
injectHash = _ref.injectHash,
|
|
1652
|
-
parentSelectors = _ref.parentSelectors;
|
|
1653
|
-
var hashId = config.hashId,
|
|
1654
|
-
layer = config.layer,
|
|
1655
|
-
path = config.path,
|
|
1656
|
-
hashPriority = config.hashPriority,
|
|
1657
|
-
_config$transformers = config.transformers,
|
|
1658
|
-
transformers = _config$transformers === void 0 ? [] : _config$transformers,
|
|
1659
|
-
_config$linters = config.linters,
|
|
1660
|
-
linters = _config$linters === void 0 ? [] : _config$linters;
|
|
1661
|
-
var styleStr = '';
|
|
1662
|
-
var effectStyle = {};
|
|
1663
|
-
function parseKeyframes(keyframes) {
|
|
1664
|
-
var animationName = keyframes.getName(hashId);
|
|
1665
|
-
if (!effectStyle[animationName]) {
|
|
1666
|
-
var _parseStyle = parseStyle(keyframes.style, config, {
|
|
1667
|
-
root: false,
|
|
1668
|
-
parentSelectors: parentSelectors
|
|
1669
|
-
}),
|
|
1670
|
-
_parseStyle2 = _slicedToArray(_parseStyle, 1),
|
|
1671
|
-
_parsedStr = _parseStyle2[0];
|
|
1672
|
-
effectStyle[animationName] = "@keyframes ".concat(keyframes.getName(hashId)).concat(_parsedStr);
|
|
1673
|
-
}
|
|
1674
|
-
}
|
|
1675
|
-
function flattenList(list) {
|
|
1676
|
-
var fullList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
1677
|
-
list.forEach(function (item) {
|
|
1678
|
-
if (Array.isArray(item)) {
|
|
1679
|
-
flattenList(item, fullList);
|
|
1680
|
-
} else if (item) {
|
|
1681
|
-
fullList.push(item);
|
|
1682
|
-
}
|
|
1683
|
-
});
|
|
1684
|
-
return fullList;
|
|
1685
|
-
}
|
|
1686
|
-
var flattenStyleList = flattenList(Array.isArray(interpolation) ? interpolation : [interpolation]);
|
|
1687
|
-
flattenStyleList.forEach(function (originStyle) {
|
|
1688
|
-
// Only root level can use raw string
|
|
1689
|
-
var style = typeof originStyle === 'string' && !root ? {} : originStyle;
|
|
1690
|
-
if (typeof style === 'string') {
|
|
1691
|
-
styleStr += "".concat(style, "\n");
|
|
1692
|
-
} else if (style._keyframe) {
|
|
1693
|
-
// Keyframe
|
|
1694
|
-
parseKeyframes(style);
|
|
1695
|
-
} else {
|
|
1696
|
-
var mergedStyle = transformers.reduce(function (prev, trans) {
|
|
1697
|
-
var _trans$visit;
|
|
1698
|
-
return (trans === null || trans === void 0 || (_trans$visit = trans.visit) === null || _trans$visit === void 0 ? void 0 : _trans$visit.call(trans, prev)) || prev;
|
|
1699
|
-
}, style);
|
|
1700
|
-
|
|
1701
|
-
// Normal CSSObject
|
|
1702
|
-
Object.keys(mergedStyle).forEach(function (key) {
|
|
1703
|
-
var value = mergedStyle[key];
|
|
1704
|
-
if (_typeof(value) === 'object' && value && (key !== 'animationName' || !value._keyframe) && !isCompoundCSSProperty(value)) {
|
|
1705
|
-
var subInjectHash = false;
|
|
1706
|
-
|
|
1707
|
-
// 当成嵌套对象来处理
|
|
1708
|
-
var mergedKey = key.trim();
|
|
1709
|
-
// Whether treat child as root. In most case it is false.
|
|
1710
|
-
var nextRoot = false;
|
|
1711
|
-
|
|
1712
|
-
// 拆分多个选择器
|
|
1713
|
-
if ((root || injectHash) && hashId) {
|
|
1714
|
-
if (mergedKey.startsWith('@')) {
|
|
1715
|
-
// 略过媒体查询,交给子节点继续插入 hashId
|
|
1716
|
-
subInjectHash = true;
|
|
1717
|
-
} else if (mergedKey === '&') {
|
|
1718
|
-
// 抹掉 root selector 上的单个 &
|
|
1719
|
-
mergedKey = injectSelectorHash('', hashId, hashPriority);
|
|
1720
|
-
} else {
|
|
1721
|
-
// 注入 hashId
|
|
1722
|
-
mergedKey = injectSelectorHash(key, hashId, hashPriority);
|
|
1723
|
-
}
|
|
1724
|
-
} else if (root && !hashId && (mergedKey === '&' || mergedKey === '')) {
|
|
1725
|
-
// In case of `{ '&': { a: { color: 'red' } } }` or `{ '': { a: { color: 'red' } } }` without hashId,
|
|
1726
|
-
// we will get `&{a:{color:red;}}` or `{a:{color:red;}}` string for stylis to compile.
|
|
1727
|
-
// But it does not conform to stylis syntax,
|
|
1728
|
-
// and finally we will get `{color:red;}` as css, which is wrong.
|
|
1729
|
-
// So we need to remove key in root, and treat child `{ a: { color: 'red' } }` as root.
|
|
1730
|
-
mergedKey = '';
|
|
1731
|
-
nextRoot = true;
|
|
1732
|
-
}
|
|
1733
|
-
var _parseStyle3 = parseStyle(value, config, {
|
|
1734
|
-
root: nextRoot,
|
|
1735
|
-
injectHash: subInjectHash,
|
|
1736
|
-
parentSelectors: [].concat(_toConsumableArray(parentSelectors), [mergedKey])
|
|
1737
|
-
}),
|
|
1738
|
-
_parseStyle4 = _slicedToArray(_parseStyle3, 2),
|
|
1739
|
-
_parsedStr2 = _parseStyle4[0],
|
|
1740
|
-
childEffectStyle = _parseStyle4[1];
|
|
1741
|
-
effectStyle = _objectSpread2(_objectSpread2({}, effectStyle), childEffectStyle);
|
|
1742
|
-
styleStr += "".concat(mergedKey).concat(_parsedStr2);
|
|
1743
|
-
} else {
|
|
1744
|
-
var _value;
|
|
1745
|
-
function appendStyle(cssKey, cssValue) {
|
|
1746
|
-
if (process.env.NODE_ENV !== 'production' && (_typeof(value) !== 'object' || !(value !== null && value !== void 0 && value[SKIP_CHECK]))) {
|
|
1747
|
-
[linter$1, linter].concat(_toConsumableArray(linters)).forEach(function (linter) {
|
|
1748
|
-
return linter(cssKey, cssValue, {
|
|
1749
|
-
path: path,
|
|
1750
|
-
hashId: hashId,
|
|
1751
|
-
parentSelectors: parentSelectors
|
|
1752
|
-
});
|
|
1753
|
-
});
|
|
1754
|
-
}
|
|
1755
|
-
|
|
1756
|
-
// 如果是样式则直接插入
|
|
1757
|
-
var styleName = cssKey.replace(/[A-Z]/g, function (match) {
|
|
1758
|
-
return "-".concat(match.toLowerCase());
|
|
1759
|
-
});
|
|
1760
|
-
|
|
1761
|
-
// Auto suffix with px
|
|
1762
|
-
var formatValue = cssValue;
|
|
1763
|
-
if (!unitlessKeys[cssKey] && typeof formatValue === 'number' && formatValue !== 0) {
|
|
1764
|
-
formatValue = "".concat(formatValue, "px");
|
|
1765
|
-
}
|
|
1766
|
-
|
|
1767
|
-
// handle animationName & Keyframe value
|
|
1768
|
-
if (cssKey === 'animationName' && cssValue !== null && cssValue !== void 0 && cssValue._keyframe) {
|
|
1769
|
-
parseKeyframes(cssValue);
|
|
1770
|
-
formatValue = cssValue.getName(hashId);
|
|
1771
|
-
}
|
|
1772
|
-
styleStr += "".concat(styleName, ":").concat(formatValue, ";");
|
|
1773
|
-
}
|
|
1774
|
-
var actualValue = (_value = value === null || value === void 0 ? void 0 : value.value) !== null && _value !== void 0 ? _value : value;
|
|
1775
|
-
if (_typeof(value) === 'object' && value !== null && value !== void 0 && value[MULTI_VALUE] && Array.isArray(actualValue)) {
|
|
1776
|
-
actualValue.forEach(function (item) {
|
|
1777
|
-
appendStyle(key, item);
|
|
1778
|
-
});
|
|
1779
|
-
} else {
|
|
1780
|
-
appendStyle(key, actualValue);
|
|
1781
|
-
}
|
|
1782
|
-
}
|
|
1783
|
-
});
|
|
1784
|
-
}
|
|
1785
|
-
});
|
|
1786
|
-
if (!root) {
|
|
1787
|
-
styleStr = "{".concat(styleStr, "}");
|
|
1788
|
-
} else if (layer) {
|
|
1789
|
-
// fixme: https://github.com/thysultan/stylis/pull/339
|
|
1790
|
-
if (styleStr) {
|
|
1791
|
-
styleStr = "@layer ".concat(layer.name, " {").concat(styleStr, "}");
|
|
1792
|
-
}
|
|
1793
|
-
if (layer.dependencies) {
|
|
1794
|
-
effectStyle["@layer ".concat(layer.name)] = layer.dependencies.map(function (deps) {
|
|
1795
|
-
return "@layer ".concat(deps, ", ").concat(layer.name, ";");
|
|
1796
|
-
}).join('\n');
|
|
1797
|
-
}
|
|
1798
|
-
}
|
|
1799
|
-
return [styleStr, effectStyle];
|
|
1800
|
-
};
|
|
1801
|
-
|
|
1802
|
-
// ============================================================================
|
|
1803
|
-
// == Register ==
|
|
1804
|
-
// ============================================================================
|
|
1805
|
-
function uniqueHash(path, styleStr) {
|
|
1806
|
-
return murmur2("".concat(path.join('%')).concat(styleStr));
|
|
1807
|
-
}
|
|
1808
|
-
function Empty() {
|
|
1809
|
-
return null;
|
|
1810
|
-
}
|
|
1811
|
-
var STYLE_PREFIX = 'style';
|
|
1812
|
-
/**
|
|
1813
|
-
* Register a style to the global style sheet.
|
|
1814
|
-
*/
|
|
1815
|
-
function useStyleRegister(info, styleFn) {
|
|
1816
|
-
var token = info.token,
|
|
1817
|
-
path = info.path,
|
|
1818
|
-
hashId = info.hashId,
|
|
1819
|
-
layer = info.layer,
|
|
1820
|
-
nonce = info.nonce,
|
|
1821
|
-
clientOnly = info.clientOnly,
|
|
1822
|
-
_info$order = info.order,
|
|
1823
|
-
order = _info$order === void 0 ? 0 : _info$order;
|
|
1824
|
-
var _React$useContext = React.useContext(StyleContext),
|
|
1825
|
-
autoClear = _React$useContext.autoClear,
|
|
1826
|
-
mock = _React$useContext.mock,
|
|
1827
|
-
defaultCache = _React$useContext.defaultCache,
|
|
1828
|
-
hashPriority = _React$useContext.hashPriority,
|
|
1829
|
-
container = _React$useContext.container,
|
|
1830
|
-
ssrInline = _React$useContext.ssrInline,
|
|
1831
|
-
transformers = _React$useContext.transformers,
|
|
1832
|
-
linters = _React$useContext.linters,
|
|
1833
|
-
cache = _React$useContext.cache,
|
|
1834
|
-
enableLayer = _React$useContext.layer;
|
|
1835
|
-
var tokenKey = token._tokenKey;
|
|
1836
|
-
var fullPath = [tokenKey];
|
|
1837
|
-
if (enableLayer) {
|
|
1838
|
-
fullPath.push('layer');
|
|
1839
|
-
}
|
|
1840
|
-
fullPath.push.apply(fullPath, _toConsumableArray(path));
|
|
1841
|
-
|
|
1842
|
-
// Check if need insert style
|
|
1843
|
-
var isMergedClientSide = isClientSide;
|
|
1844
|
-
if (process.env.NODE_ENV !== 'production' && mock !== undefined) {
|
|
1845
|
-
isMergedClientSide = mock === 'client';
|
|
1846
|
-
}
|
|
1847
|
-
var _useGlobalCache = useGlobalCache(STYLE_PREFIX, fullPath,
|
|
1848
|
-
// Create cache if needed
|
|
1849
|
-
function () {
|
|
1850
|
-
var cachePath = fullPath.join('|');
|
|
1851
|
-
|
|
1852
|
-
// Get style from SSR inline style directly
|
|
1853
|
-
if (existPath(cachePath)) {
|
|
1854
|
-
var _getStyleAndHash = getStyleAndHash(cachePath),
|
|
1855
|
-
_getStyleAndHash2 = _slicedToArray(_getStyleAndHash, 2),
|
|
1856
|
-
inlineCacheStyleStr = _getStyleAndHash2[0],
|
|
1857
|
-
styleHash = _getStyleAndHash2[1];
|
|
1858
|
-
if (inlineCacheStyleStr) {
|
|
1859
|
-
return [inlineCacheStyleStr, tokenKey, styleHash, {}, clientOnly, order];
|
|
1860
|
-
}
|
|
1861
|
-
}
|
|
1862
|
-
|
|
1863
|
-
// Generate style
|
|
1864
|
-
var styleObj = styleFn();
|
|
1865
|
-
var _parseStyle5 = parseStyle(styleObj, {
|
|
1866
|
-
hashId: hashId,
|
|
1867
|
-
hashPriority: hashPriority,
|
|
1868
|
-
layer: enableLayer ? layer : undefined,
|
|
1869
|
-
path: path.join('-'),
|
|
1870
|
-
transformers: transformers,
|
|
1871
|
-
linters: linters
|
|
1872
|
-
}),
|
|
1873
|
-
_parseStyle6 = _slicedToArray(_parseStyle5, 2),
|
|
1874
|
-
parsedStyle = _parseStyle6[0],
|
|
1875
|
-
effectStyle = _parseStyle6[1];
|
|
1876
|
-
var styleStr = normalizeStyle(parsedStyle);
|
|
1877
|
-
var styleId = uniqueHash(fullPath, styleStr);
|
|
1878
|
-
return [styleStr, tokenKey, styleId, effectStyle, clientOnly, order];
|
|
1879
|
-
},
|
|
1880
|
-
// Remove cache if no need
|
|
1881
|
-
function (_ref2, fromHMR) {
|
|
1882
|
-
var _ref3 = _slicedToArray(_ref2, 3),
|
|
1883
|
-
styleId = _ref3[2];
|
|
1884
|
-
if ((fromHMR || autoClear) && isClientSide) {
|
|
1885
|
-
removeCSS(styleId, {
|
|
1886
|
-
mark: ATTR_MARK
|
|
1887
|
-
});
|
|
1888
|
-
}
|
|
1889
|
-
},
|
|
1890
|
-
// Effect: Inject style here
|
|
1891
|
-
function (_ref4) {
|
|
1892
|
-
var _ref5 = _slicedToArray(_ref4, 4),
|
|
1893
|
-
styleStr = _ref5[0],
|
|
1894
|
-
styleId = _ref5[2],
|
|
1895
|
-
effectStyle = _ref5[3];
|
|
1896
|
-
if (isMergedClientSide && styleStr !== CSS_FILE_STYLE) {
|
|
1897
|
-
var mergedCSSConfig = {
|
|
1898
|
-
mark: ATTR_MARK,
|
|
1899
|
-
prepend: enableLayer ? false : 'queue',
|
|
1900
|
-
attachTo: container,
|
|
1901
|
-
priority: order
|
|
1902
|
-
};
|
|
1903
|
-
var nonceStr = typeof nonce === 'function' ? nonce() : nonce;
|
|
1904
|
-
if (nonceStr) {
|
|
1905
|
-
mergedCSSConfig.csp = {
|
|
1906
|
-
nonce: nonceStr
|
|
1907
|
-
};
|
|
1908
|
-
}
|
|
1909
|
-
|
|
1910
|
-
// ================= Split Effect Style =================
|
|
1911
|
-
// We will split effectStyle here since @layer should be at the top level
|
|
1912
|
-
var effectLayerKeys = [];
|
|
1913
|
-
var effectRestKeys = [];
|
|
1914
|
-
Object.keys(effectStyle).forEach(function (key) {
|
|
1915
|
-
if (key.startsWith('@layer')) {
|
|
1916
|
-
effectLayerKeys.push(key);
|
|
1917
|
-
} else {
|
|
1918
|
-
effectRestKeys.push(key);
|
|
1919
|
-
}
|
|
1920
|
-
});
|
|
1921
|
-
|
|
1922
|
-
// ================= Inject Layer Style =================
|
|
1923
|
-
// Inject layer style
|
|
1924
|
-
effectLayerKeys.forEach(function (effectKey) {
|
|
1925
|
-
updateCSS(normalizeStyle(effectStyle[effectKey]), "_layer-".concat(effectKey), _objectSpread2(_objectSpread2({}, mergedCSSConfig), {}, {
|
|
1926
|
-
prepend: true
|
|
1927
|
-
}));
|
|
1928
|
-
});
|
|
1929
|
-
|
|
1930
|
-
// ==================== Inject Style ====================
|
|
1931
|
-
// Inject style
|
|
1932
|
-
var style = updateCSS(styleStr, styleId, mergedCSSConfig);
|
|
1933
|
-
style[CSS_IN_JS_INSTANCE] = cache.instanceId;
|
|
1934
|
-
|
|
1935
|
-
// Used for `useCacheToken` to remove on batch when token removed
|
|
1936
|
-
style.setAttribute(ATTR_TOKEN, tokenKey);
|
|
1937
|
-
|
|
1938
|
-
// Debug usage. Dev only
|
|
1939
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
1940
|
-
style.setAttribute(ATTR_CACHE_PATH, fullPath.join('|'));
|
|
1941
|
-
}
|
|
1942
|
-
|
|
1943
|
-
// ================ Inject Effect Style =================
|
|
1944
|
-
// Inject client side effect style
|
|
1945
|
-
effectRestKeys.forEach(function (effectKey) {
|
|
1946
|
-
updateCSS(normalizeStyle(effectStyle[effectKey]), "_effect-".concat(effectKey), mergedCSSConfig);
|
|
1947
|
-
});
|
|
1948
|
-
}
|
|
1949
|
-
}),
|
|
1950
|
-
_useGlobalCache2 = _slicedToArray(_useGlobalCache, 3),
|
|
1951
|
-
cachedStyleStr = _useGlobalCache2[0],
|
|
1952
|
-
cachedTokenKey = _useGlobalCache2[1],
|
|
1953
|
-
cachedStyleId = _useGlobalCache2[2];
|
|
1954
|
-
return function (node) {
|
|
1955
|
-
var styleNode;
|
|
1956
|
-
if (!ssrInline || isMergedClientSide || !defaultCache) {
|
|
1957
|
-
styleNode = /*#__PURE__*/React.createElement(Empty, null);
|
|
1958
|
-
} else {
|
|
1959
|
-
var _ref6;
|
|
1960
|
-
styleNode = /*#__PURE__*/React.createElement("style", _extends({}, (_ref6 = {}, _defineProperty(_ref6, ATTR_TOKEN, cachedTokenKey), _defineProperty(_ref6, ATTR_MARK, cachedStyleId), _ref6), {
|
|
1961
|
-
dangerouslySetInnerHTML: {
|
|
1962
|
-
__html: cachedStyleStr
|
|
1963
|
-
}
|
|
1964
|
-
}));
|
|
1965
|
-
}
|
|
1966
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, styleNode, node);
|
|
1967
|
-
};
|
|
1968
|
-
}
|
|
1969
|
-
|
|
1970
|
-
var CSS_VAR_PREFIX = 'cssVar';
|
|
1971
|
-
var useCSSVarRegister = function useCSSVarRegister(config, fn) {
|
|
1972
|
-
var key = config.key,
|
|
1973
|
-
prefix = config.prefix,
|
|
1974
|
-
unitless = config.unitless,
|
|
1975
|
-
ignore = config.ignore,
|
|
1976
|
-
token = config.token,
|
|
1977
|
-
_config$scope = config.scope,
|
|
1978
|
-
scope = _config$scope === void 0 ? '' : _config$scope;
|
|
1979
|
-
var _useContext = useContext(StyleContext),
|
|
1980
|
-
instanceId = _useContext.cache.instanceId,
|
|
1981
|
-
container = _useContext.container;
|
|
1982
|
-
var tokenKey = token._tokenKey;
|
|
1983
|
-
var stylePath = [].concat(_toConsumableArray(config.path), [key, scope, tokenKey]);
|
|
1984
|
-
var cache = useGlobalCache(CSS_VAR_PREFIX, stylePath, function () {
|
|
1985
|
-
var originToken = fn();
|
|
1986
|
-
var _transformToken = transformToken(originToken, key, {
|
|
1987
|
-
prefix: prefix,
|
|
1988
|
-
unitless: unitless,
|
|
1989
|
-
ignore: ignore,
|
|
1990
|
-
scope: scope
|
|
1991
|
-
}),
|
|
1992
|
-
_transformToken2 = _slicedToArray(_transformToken, 2),
|
|
1993
|
-
mergedToken = _transformToken2[0],
|
|
1994
|
-
cssVarsStr = _transformToken2[1];
|
|
1995
|
-
var styleId = uniqueHash(stylePath, cssVarsStr);
|
|
1996
|
-
return [mergedToken, cssVarsStr, styleId, key];
|
|
1997
|
-
}, function (_ref) {
|
|
1998
|
-
var _ref2 = _slicedToArray(_ref, 3),
|
|
1999
|
-
styleId = _ref2[2];
|
|
2000
|
-
if (isClientSide) {
|
|
2001
|
-
removeCSS(styleId, {
|
|
2002
|
-
mark: ATTR_MARK
|
|
2003
|
-
});
|
|
2004
|
-
}
|
|
2005
|
-
}, function (_ref3) {
|
|
2006
|
-
var _ref4 = _slicedToArray(_ref3, 3),
|
|
2007
|
-
cssVarsStr = _ref4[1],
|
|
2008
|
-
styleId = _ref4[2];
|
|
2009
|
-
if (!cssVarsStr) {
|
|
2010
|
-
return;
|
|
2011
|
-
}
|
|
2012
|
-
var style = updateCSS(cssVarsStr, styleId, {
|
|
2013
|
-
mark: ATTR_MARK,
|
|
2014
|
-
prepend: 'queue',
|
|
2015
|
-
attachTo: container,
|
|
2016
|
-
priority: -999
|
|
2017
|
-
});
|
|
2018
|
-
style[CSS_IN_JS_INSTANCE] = instanceId;
|
|
2019
|
-
|
|
2020
|
-
// Used for `useCacheToken` to remove on batch when token removed
|
|
2021
|
-
style.setAttribute(ATTR_TOKEN, key);
|
|
2022
|
-
});
|
|
2023
|
-
return cache;
|
|
2024
|
-
};
|
|
2025
|
-
|
|
2026
|
-
function _toArray(r) {
|
|
2027
|
-
return _arrayWithHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableRest();
|
|
2028
|
-
}
|
|
2029
|
-
|
|
2030
|
-
function get(entity, path) {
|
|
2031
|
-
var current = entity;
|
|
2032
|
-
for (var i = 0; i < path.length; i += 1) {
|
|
2033
|
-
if (current === null || current === undefined) {
|
|
2034
|
-
return undefined;
|
|
2035
|
-
}
|
|
2036
|
-
current = current[path[i]];
|
|
2037
|
-
}
|
|
2038
|
-
return current;
|
|
2039
|
-
}
|
|
2040
|
-
|
|
2041
|
-
function internalSet(entity, paths, value, removeIfUndefined) {
|
|
2042
|
-
if (!paths.length) {
|
|
2043
|
-
return value;
|
|
2044
|
-
}
|
|
2045
|
-
var _paths = _toArray(paths),
|
|
2046
|
-
path = _paths[0],
|
|
2047
|
-
restPath = _paths.slice(1);
|
|
2048
|
-
var clone;
|
|
2049
|
-
if (!entity && typeof path === 'number') {
|
|
2050
|
-
clone = [];
|
|
2051
|
-
} else if (Array.isArray(entity)) {
|
|
2052
|
-
clone = _toConsumableArray(entity);
|
|
2053
|
-
} else {
|
|
2054
|
-
clone = _objectSpread2({}, entity);
|
|
2055
|
-
}
|
|
2056
|
-
|
|
2057
|
-
// Delete prop if `removeIfUndefined` and value is undefined
|
|
2058
|
-
if (removeIfUndefined && value === undefined && restPath.length === 1) {
|
|
2059
|
-
delete clone[path][restPath[0]];
|
|
2060
|
-
} else {
|
|
2061
|
-
clone[path] = internalSet(clone[path], restPath, value, removeIfUndefined);
|
|
2062
|
-
}
|
|
2063
|
-
return clone;
|
|
2064
|
-
}
|
|
2065
|
-
function set(entity, paths, value) {
|
|
2066
|
-
var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
2067
|
-
// Do nothing if `removeIfUndefined` and parent object not exist
|
|
2068
|
-
if (paths.length && removeIfUndefined && value === undefined && !get(entity, paths.slice(0, -1))) {
|
|
2069
|
-
return entity;
|
|
2070
|
-
}
|
|
2071
|
-
return internalSet(entity, paths, value, removeIfUndefined);
|
|
2072
|
-
}
|
|
2073
|
-
function isObject(obj) {
|
|
2074
|
-
return _typeof(obj) === 'object' && obj !== null && Object.getPrototypeOf(obj) === Object.prototype;
|
|
2075
|
-
}
|
|
2076
|
-
function createEmpty(source) {
|
|
2077
|
-
return Array.isArray(source) ? [] : {};
|
|
2078
|
-
}
|
|
2079
|
-
var keys = typeof Reflect === 'undefined' ? Object.keys : Reflect.ownKeys;
|
|
2080
|
-
|
|
2081
|
-
/**
|
|
2082
|
-
* Merge objects which will create
|
|
2083
|
-
*/
|
|
2084
|
-
function merge$1() {
|
|
2085
|
-
for (var _len = arguments.length, sources = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2086
|
-
sources[_key] = arguments[_key];
|
|
2087
|
-
}
|
|
2088
|
-
var clone = createEmpty(sources[0]);
|
|
2089
|
-
sources.forEach(function (src) {
|
|
2090
|
-
function internalMerge(path, parentLoopSet) {
|
|
2091
|
-
var loopSet = new Set(parentLoopSet);
|
|
2092
|
-
var value = get(src, path);
|
|
2093
|
-
var isArr = Array.isArray(value);
|
|
2094
|
-
if (isArr || isObject(value)) {
|
|
2095
|
-
// Only add not loop obj
|
|
2096
|
-
if (!loopSet.has(value)) {
|
|
2097
|
-
loopSet.add(value);
|
|
2098
|
-
var originValue = get(clone, path);
|
|
2099
|
-
if (isArr) {
|
|
2100
|
-
// Array will always be override
|
|
2101
|
-
clone = set(clone, path, []);
|
|
2102
|
-
} else if (!originValue || _typeof(originValue) !== 'object') {
|
|
2103
|
-
// Init container if not exist
|
|
2104
|
-
clone = set(clone, path, createEmpty(value));
|
|
2105
|
-
}
|
|
2106
|
-
keys(value).forEach(function (key) {
|
|
2107
|
-
internalMerge([].concat(_toConsumableArray(path), [key]), loopSet);
|
|
2108
|
-
});
|
|
2109
|
-
}
|
|
2110
|
-
} else {
|
|
2111
|
-
clone = set(clone, path, value);
|
|
2112
|
-
}
|
|
2113
|
-
}
|
|
2114
|
-
internalMerge([]);
|
|
2115
|
-
});
|
|
2116
|
-
return clone;
|
|
2117
|
-
}
|
|
2118
|
-
|
|
2119
|
-
function noop$1() {}
|
|
2120
|
-
let deprecatedWarnList = null;
|
|
2121
|
-
function resetWarned() {
|
|
2122
|
-
deprecatedWarnList = null;
|
|
2123
|
-
resetWarned$1();
|
|
2124
|
-
}
|
|
2125
|
-
// eslint-disable-next-line import/no-mutable-exports
|
|
2126
|
-
let warning = noop$1;
|
|
2127
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
2128
|
-
warning = (valid, component, message) => {
|
|
2129
|
-
warningOnce(valid, `[antd: ${component}] ${message}`);
|
|
2130
|
-
// StrictMode will inject console which will not throw warning in React 17.
|
|
2131
|
-
if (process.env.NODE_ENV === 'test') {
|
|
2132
|
-
resetWarned();
|
|
2133
|
-
}
|
|
2134
|
-
};
|
|
2135
|
-
}
|
|
2136
|
-
const WarningContext = /*#__PURE__*/React.createContext({});
|
|
2137
|
-
/**
|
|
2138
|
-
* This is a hook but we not named as `useWarning`
|
|
2139
|
-
* since this is only used in development.
|
|
2140
|
-
* We should always wrap this in `if (process.env.NODE_ENV !== 'production')` condition
|
|
2141
|
-
*/
|
|
2142
|
-
const devUseWarning = process.env.NODE_ENV !== 'production' ? component => {
|
|
2143
|
-
const {
|
|
2144
|
-
strict
|
|
2145
|
-
} = React.useContext(WarningContext);
|
|
2146
|
-
const typeWarning = (valid, type, message) => {
|
|
2147
|
-
if (!valid) {
|
|
2148
|
-
if (strict === false && type === 'deprecated') {
|
|
2149
|
-
const existWarning = deprecatedWarnList;
|
|
2150
|
-
if (!deprecatedWarnList) {
|
|
2151
|
-
deprecatedWarnList = {};
|
|
2152
|
-
}
|
|
2153
|
-
deprecatedWarnList[component] = deprecatedWarnList[component] || [];
|
|
2154
|
-
if (!deprecatedWarnList[component].includes(message || '')) {
|
|
2155
|
-
deprecatedWarnList[component].push(message || '');
|
|
2156
|
-
}
|
|
2157
|
-
// Warning for the first time
|
|
2158
|
-
if (!existWarning) {
|
|
2159
|
-
console.warn('[antd] There exists deprecated usage in your code:', deprecatedWarnList);
|
|
2160
|
-
}
|
|
2161
|
-
} else {
|
|
2162
|
-
process.env.NODE_ENV !== "production" ? warning(valid, component, message) : void 0;
|
|
2163
|
-
}
|
|
2164
|
-
}
|
|
2165
|
-
};
|
|
2166
|
-
typeWarning.deprecated = (valid, oldProp, newProp, message) => {
|
|
2167
|
-
typeWarning(valid, 'deprecated', `\`${oldProp}\` is deprecated. Please use \`${newProp}\` instead.${message ? ` ${message}` : ''}`);
|
|
2168
|
-
};
|
|
2169
|
-
return typeWarning;
|
|
2170
|
-
} : () => {
|
|
2171
|
-
const noopWarning = () => {};
|
|
2172
|
-
noopWarning.deprecated = noop$1;
|
|
2173
|
-
return noopWarning;
|
|
2174
|
-
};
|
|
2175
|
-
|
|
2176
|
-
// ZombieJ: We export single file here since
|
|
2177
|
-
// ConfigProvider use this which will make loop deps
|
|
2178
|
-
// to import whole `rc-field-form`
|
|
2179
|
-
const ValidateMessagesContext = /*#__PURE__*/createContext(undefined);
|
|
2180
|
-
|
|
2181
|
-
const typeTemplate = '${label} is not a valid ${type}';
|
|
2182
|
-
const localeValues = {
|
|
2183
|
-
Modal: {
|
|
2184
|
-
okText: 'OK',
|
|
2185
|
-
cancelText: 'Cancel',
|
|
2186
|
-
justOkText: 'OK'
|
|
2187
|
-
},
|
|
2188
|
-
Form: {
|
|
2189
|
-
optional: '(optional)',
|
|
2190
|
-
defaultValidateMessages: {
|
|
2191
|
-
default: 'Field validation error for ${label}',
|
|
2192
|
-
required: 'Please enter ${label}',
|
|
2193
|
-
enum: '${label} must be one of [${enum}]',
|
|
2194
|
-
whitespace: '${label} cannot be a blank character',
|
|
2195
|
-
date: {
|
|
2196
|
-
format: '${label} date format is invalid',
|
|
2197
|
-
parse: '${label} cannot be converted to a date',
|
|
2198
|
-
invalid: '${label} is an invalid date'
|
|
2199
|
-
},
|
|
2200
|
-
types: {
|
|
2201
|
-
string: typeTemplate,
|
|
2202
|
-
method: typeTemplate,
|
|
2203
|
-
array: typeTemplate,
|
|
2204
|
-
object: typeTemplate,
|
|
2205
|
-
number: typeTemplate,
|
|
2206
|
-
date: typeTemplate,
|
|
2207
|
-
boolean: typeTemplate,
|
|
2208
|
-
integer: typeTemplate,
|
|
2209
|
-
float: typeTemplate,
|
|
2210
|
-
regexp: typeTemplate,
|
|
2211
|
-
email: typeTemplate,
|
|
2212
|
-
url: typeTemplate,
|
|
2213
|
-
hex: typeTemplate
|
|
2214
|
-
},
|
|
2215
|
-
string: {
|
|
2216
|
-
len: '${label} must be ${len} characters',
|
|
2217
|
-
min: '${label} must be at least ${min} characters',
|
|
2218
|
-
max: '${label} must be up to ${max} characters',
|
|
2219
|
-
range: '${label} must be between ${min}-${max} characters'
|
|
2220
|
-
},
|
|
2221
|
-
number: {
|
|
2222
|
-
len: '${label} must be equal to ${len}',
|
|
2223
|
-
min: '${label} must be minimum ${min}',
|
|
2224
|
-
max: '${label} must be maximum ${max}',
|
|
2225
|
-
range: '${label} must be between ${min}-${max}'
|
|
2226
|
-
},
|
|
2227
|
-
array: {
|
|
2228
|
-
len: 'Must be ${len} ${label}',
|
|
2229
|
-
min: 'At least ${min} ${label}',
|
|
2230
|
-
max: 'At most ${max} ${label}',
|
|
2231
|
-
range: 'The amount of ${label} must be between ${min}-${max}'
|
|
2232
|
-
},
|
|
2233
|
-
pattern: {
|
|
2234
|
-
mismatch: '${label} does not match the pattern ${pattern}'
|
|
2235
|
-
}
|
|
2236
|
-
}
|
|
2237
|
-
}};
|
|
2238
|
-
|
|
2239
|
-
Object.assign({}, localeValues.Modal);
|
|
2240
|
-
let localeList = [];
|
|
2241
|
-
const generateLocale = () => localeList.reduce((merged, locale) => Object.assign(Object.assign({}, merged), locale), localeValues.Modal);
|
|
2242
|
-
function changeConfirmLocale(newLocale) {
|
|
2243
|
-
if (newLocale) {
|
|
2244
|
-
const cloneLocale = Object.assign({}, newLocale);
|
|
2245
|
-
localeList.push(cloneLocale);
|
|
2246
|
-
generateLocale();
|
|
2247
|
-
return () => {
|
|
2248
|
-
localeList = localeList.filter(locale => locale !== cloneLocale);
|
|
2249
|
-
generateLocale();
|
|
2250
|
-
};
|
|
2251
|
-
}
|
|
2252
|
-
Object.assign({}, localeValues.Modal);
|
|
2253
|
-
}
|
|
2254
|
-
|
|
2255
|
-
const LocaleContext = /*#__PURE__*/createContext(undefined);
|
|
2256
|
-
|
|
2257
|
-
const ANT_MARK = 'internalMark';
|
|
2258
|
-
const LocaleProvider = props => {
|
|
2259
|
-
const {
|
|
2260
|
-
locale = {},
|
|
2261
|
-
children,
|
|
2262
|
-
_ANT_MARK__
|
|
2263
|
-
} = props;
|
|
2264
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
2265
|
-
const warning = devUseWarning('LocaleProvider');
|
|
2266
|
-
process.env.NODE_ENV !== "production" ? warning(_ANT_MARK__ === ANT_MARK, 'deprecated', '`LocaleProvider` is deprecated. Please use `locale` with `ConfigProvider` instead: http://u.ant.design/locale') : void 0;
|
|
2267
|
-
}
|
|
2268
|
-
React.useEffect(() => {
|
|
2269
|
-
const clearLocale = changeConfirmLocale(locale === null || locale === void 0 ? void 0 : locale.Modal);
|
|
2270
|
-
return clearLocale;
|
|
2271
|
-
}, [locale]);
|
|
2272
|
-
const getMemoizedContextValue = React.useMemo(() => Object.assign(Object.assign({}, locale), {
|
|
2273
|
-
exist: true
|
|
2274
|
-
}), [locale]);
|
|
2275
|
-
return /*#__PURE__*/React.createElement(LocaleContext.Provider, {
|
|
2276
|
-
value: getMemoizedContextValue
|
|
2277
|
-
}, children);
|
|
2278
|
-
};
|
|
2279
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
2280
|
-
LocaleProvider.displayName = 'LocaleProvider';
|
|
2281
|
-
}
|
|
2282
|
-
|
|
2283
|
-
const defaultPresetColors = {
|
|
2284
|
-
blue: '#1677FF',
|
|
2285
|
-
purple: '#722ED1',
|
|
2286
|
-
cyan: '#13C2C2',
|
|
2287
|
-
green: '#52C41A',
|
|
2288
|
-
magenta: '#EB2F96',
|
|
2289
|
-
/**
|
|
2290
|
-
* @deprecated Use magenta instead
|
|
2291
|
-
*/
|
|
2292
|
-
pink: '#EB2F96',
|
|
2293
|
-
red: '#F5222D',
|
|
2294
|
-
orange: '#FA8C16',
|
|
2295
|
-
yellow: '#FADB14',
|
|
2296
|
-
volcano: '#FA541C',
|
|
2297
|
-
geekblue: '#2F54EB',
|
|
2298
|
-
gold: '#FAAD14',
|
|
2299
|
-
lime: '#A0D911'
|
|
2300
|
-
};
|
|
2301
|
-
const seedToken = Object.assign(Object.assign({}, defaultPresetColors), {
|
|
2302
|
-
// Color
|
|
2303
|
-
colorPrimary: '#1677ff',
|
|
2304
|
-
colorSuccess: '#52c41a',
|
|
2305
|
-
colorWarning: '#faad14',
|
|
2306
|
-
colorError: '#ff4d4f',
|
|
2307
|
-
colorInfo: '#1677ff',
|
|
2308
|
-
colorLink: '',
|
|
2309
|
-
colorTextBase: '',
|
|
2310
|
-
colorBgBase: '',
|
|
2311
|
-
// Font
|
|
2312
|
-
fontFamily: `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
|
|
2313
|
-
'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
|
|
2314
|
-
'Noto Color Emoji'`,
|
|
2315
|
-
fontFamilyCode: `'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace`,
|
|
2316
|
-
fontSize: 14,
|
|
2317
|
-
// Line
|
|
2318
|
-
lineWidth: 1,
|
|
2319
|
-
lineType: 'solid',
|
|
2320
|
-
// Motion
|
|
2321
|
-
motionUnit: 0.1,
|
|
2322
|
-
motionBase: 0,
|
|
2323
|
-
motionEaseOutCirc: 'cubic-bezier(0.08, 0.82, 0.17, 1)',
|
|
2324
|
-
motionEaseInOutCirc: 'cubic-bezier(0.78, 0.14, 0.15, 0.86)',
|
|
2325
|
-
motionEaseOut: 'cubic-bezier(0.215, 0.61, 0.355, 1)',
|
|
2326
|
-
motionEaseInOut: 'cubic-bezier(0.645, 0.045, 0.355, 1)',
|
|
2327
|
-
motionEaseOutBack: 'cubic-bezier(0.12, 0.4, 0.29, 1.46)',
|
|
2328
|
-
motionEaseInBack: 'cubic-bezier(0.71, -0.46, 0.88, 0.6)',
|
|
2329
|
-
motionEaseInQuint: 'cubic-bezier(0.755, 0.05, 0.855, 0.06)',
|
|
2330
|
-
motionEaseOutQuint: 'cubic-bezier(0.23, 1, 0.32, 1)',
|
|
2331
|
-
// Radius
|
|
2332
|
-
borderRadius: 6,
|
|
2333
|
-
// Size
|
|
2334
|
-
sizeUnit: 4,
|
|
2335
|
-
sizeStep: 4,
|
|
2336
|
-
sizePopupArrow: 16,
|
|
2337
|
-
// Control Base
|
|
2338
|
-
controlHeight: 32,
|
|
2339
|
-
// zIndex
|
|
2340
|
-
zIndexBase: 0,
|
|
2341
|
-
zIndexPopupBase: 1000,
|
|
2342
|
-
// Image
|
|
2343
|
-
opacityImage: 1,
|
|
2344
|
-
// Wireframe
|
|
2345
|
-
wireframe: false,
|
|
2346
|
-
// Motion
|
|
2347
|
-
motion: true
|
|
2348
|
-
});
|
|
2349
|
-
|
|
2350
|
-
function genColorMapToken(seed, {
|
|
2351
|
-
generateColorPalettes,
|
|
2352
|
-
generateNeutralColorPalettes
|
|
2353
|
-
}) {
|
|
2354
|
-
const {
|
|
2355
|
-
colorSuccess: colorSuccessBase,
|
|
2356
|
-
colorWarning: colorWarningBase,
|
|
2357
|
-
colorError: colorErrorBase,
|
|
2358
|
-
colorInfo: colorInfoBase,
|
|
2359
|
-
colorPrimary: colorPrimaryBase,
|
|
2360
|
-
colorBgBase,
|
|
2361
|
-
colorTextBase
|
|
2362
|
-
} = seed;
|
|
2363
|
-
const primaryColors = generateColorPalettes(colorPrimaryBase);
|
|
2364
|
-
const successColors = generateColorPalettes(colorSuccessBase);
|
|
2365
|
-
const warningColors = generateColorPalettes(colorWarningBase);
|
|
2366
|
-
const errorColors = generateColorPalettes(colorErrorBase);
|
|
2367
|
-
const infoColors = generateColorPalettes(colorInfoBase);
|
|
2368
|
-
const neutralColors = generateNeutralColorPalettes(colorBgBase, colorTextBase);
|
|
2369
|
-
// Color Link
|
|
2370
|
-
const colorLink = seed.colorLink || seed.colorInfo;
|
|
2371
|
-
const linkColors = generateColorPalettes(colorLink);
|
|
2372
|
-
const colorErrorBgFilledHover = new FastColor(errorColors[1]).mix(new FastColor(errorColors[3]), 50).toHexString();
|
|
2373
|
-
return Object.assign(Object.assign({}, neutralColors), {
|
|
2374
|
-
colorPrimaryBg: primaryColors[1],
|
|
2375
|
-
colorPrimaryBgHover: primaryColors[2],
|
|
2376
|
-
colorPrimaryBorder: primaryColors[3],
|
|
2377
|
-
colorPrimaryBorderHover: primaryColors[4],
|
|
2378
|
-
colorPrimaryHover: primaryColors[5],
|
|
2379
|
-
colorPrimary: primaryColors[6],
|
|
2380
|
-
colorPrimaryActive: primaryColors[7],
|
|
2381
|
-
colorPrimaryTextHover: primaryColors[8],
|
|
2382
|
-
colorPrimaryText: primaryColors[9],
|
|
2383
|
-
colorPrimaryTextActive: primaryColors[10],
|
|
2384
|
-
colorSuccessBg: successColors[1],
|
|
2385
|
-
colorSuccessBgHover: successColors[2],
|
|
2386
|
-
colorSuccessBorder: successColors[3],
|
|
2387
|
-
colorSuccessBorderHover: successColors[4],
|
|
2388
|
-
colorSuccessHover: successColors[4],
|
|
2389
|
-
colorSuccess: successColors[6],
|
|
2390
|
-
colorSuccessActive: successColors[7],
|
|
2391
|
-
colorSuccessTextHover: successColors[8],
|
|
2392
|
-
colorSuccessText: successColors[9],
|
|
2393
|
-
colorSuccessTextActive: successColors[10],
|
|
2394
|
-
colorErrorBg: errorColors[1],
|
|
2395
|
-
colorErrorBgHover: errorColors[2],
|
|
2396
|
-
colorErrorBgFilledHover,
|
|
2397
|
-
colorErrorBgActive: errorColors[3],
|
|
2398
|
-
colorErrorBorder: errorColors[3],
|
|
2399
|
-
colorErrorBorderHover: errorColors[4],
|
|
2400
|
-
colorErrorHover: errorColors[5],
|
|
2401
|
-
colorError: errorColors[6],
|
|
2402
|
-
colorErrorActive: errorColors[7],
|
|
2403
|
-
colorErrorTextHover: errorColors[8],
|
|
2404
|
-
colorErrorText: errorColors[9],
|
|
2405
|
-
colorErrorTextActive: errorColors[10],
|
|
2406
|
-
colorWarningBg: warningColors[1],
|
|
2407
|
-
colorWarningBgHover: warningColors[2],
|
|
2408
|
-
colorWarningBorder: warningColors[3],
|
|
2409
|
-
colorWarningBorderHover: warningColors[4],
|
|
2410
|
-
colorWarningHover: warningColors[4],
|
|
2411
|
-
colorWarning: warningColors[6],
|
|
2412
|
-
colorWarningActive: warningColors[7],
|
|
2413
|
-
colorWarningTextHover: warningColors[8],
|
|
2414
|
-
colorWarningText: warningColors[9],
|
|
2415
|
-
colorWarningTextActive: warningColors[10],
|
|
2416
|
-
colorInfoBg: infoColors[1],
|
|
2417
|
-
colorInfoBgHover: infoColors[2],
|
|
2418
|
-
colorInfoBorder: infoColors[3],
|
|
2419
|
-
colorInfoBorderHover: infoColors[4],
|
|
2420
|
-
colorInfoHover: infoColors[4],
|
|
2421
|
-
colorInfo: infoColors[6],
|
|
2422
|
-
colorInfoActive: infoColors[7],
|
|
2423
|
-
colorInfoTextHover: infoColors[8],
|
|
2424
|
-
colorInfoText: infoColors[9],
|
|
2425
|
-
colorInfoTextActive: infoColors[10],
|
|
2426
|
-
colorLinkHover: linkColors[4],
|
|
2427
|
-
colorLink: linkColors[6],
|
|
2428
|
-
colorLinkActive: linkColors[7],
|
|
2429
|
-
colorBgMask: new FastColor('#000').setA(0.45).toRgbString(),
|
|
2430
|
-
colorWhite: '#fff'
|
|
2431
|
-
});
|
|
2432
|
-
}
|
|
2433
|
-
|
|
2434
|
-
const genRadius = radiusBase => {
|
|
2435
|
-
let radiusLG = radiusBase;
|
|
2436
|
-
let radiusSM = radiusBase;
|
|
2437
|
-
let radiusXS = radiusBase;
|
|
2438
|
-
let radiusOuter = radiusBase;
|
|
2439
|
-
// radiusLG
|
|
2440
|
-
if (radiusBase < 6 && radiusBase >= 5) {
|
|
2441
|
-
radiusLG = radiusBase + 1;
|
|
2442
|
-
} else if (radiusBase < 16 && radiusBase >= 6) {
|
|
2443
|
-
radiusLG = radiusBase + 2;
|
|
2444
|
-
} else if (radiusBase >= 16) {
|
|
2445
|
-
radiusLG = 16;
|
|
2446
|
-
}
|
|
2447
|
-
// radiusSM
|
|
2448
|
-
if (radiusBase < 7 && radiusBase >= 5) {
|
|
2449
|
-
radiusSM = 4;
|
|
2450
|
-
} else if (radiusBase < 8 && radiusBase >= 7) {
|
|
2451
|
-
radiusSM = 5;
|
|
2452
|
-
} else if (radiusBase < 14 && radiusBase >= 8) {
|
|
2453
|
-
radiusSM = 6;
|
|
2454
|
-
} else if (radiusBase < 16 && radiusBase >= 14) {
|
|
2455
|
-
radiusSM = 7;
|
|
2456
|
-
} else if (radiusBase >= 16) {
|
|
2457
|
-
radiusSM = 8;
|
|
2458
|
-
}
|
|
2459
|
-
// radiusXS
|
|
2460
|
-
if (radiusBase < 6 && radiusBase >= 2) {
|
|
2461
|
-
radiusXS = 1;
|
|
2462
|
-
} else if (radiusBase >= 6) {
|
|
2463
|
-
radiusXS = 2;
|
|
2464
|
-
}
|
|
2465
|
-
// radiusOuter
|
|
2466
|
-
if (radiusBase > 4 && radiusBase < 8) {
|
|
2467
|
-
radiusOuter = 4;
|
|
2468
|
-
} else if (radiusBase >= 8) {
|
|
2469
|
-
radiusOuter = 6;
|
|
2470
|
-
}
|
|
2471
|
-
return {
|
|
2472
|
-
borderRadius: radiusBase,
|
|
2473
|
-
borderRadiusXS: radiusXS,
|
|
2474
|
-
borderRadiusSM: radiusSM,
|
|
2475
|
-
borderRadiusLG: radiusLG,
|
|
2476
|
-
borderRadiusOuter: radiusOuter
|
|
2477
|
-
};
|
|
2478
|
-
};
|
|
2479
|
-
|
|
2480
|
-
function genCommonMapToken(token) {
|
|
2481
|
-
const {
|
|
2482
|
-
motionUnit,
|
|
2483
|
-
motionBase,
|
|
2484
|
-
borderRadius,
|
|
2485
|
-
lineWidth
|
|
2486
|
-
} = token;
|
|
2487
|
-
return Object.assign({
|
|
2488
|
-
// motion
|
|
2489
|
-
motionDurationFast: `${(motionBase + motionUnit).toFixed(1)}s`,
|
|
2490
|
-
motionDurationMid: `${(motionBase + motionUnit * 2).toFixed(1)}s`,
|
|
2491
|
-
motionDurationSlow: `${(motionBase + motionUnit * 3).toFixed(1)}s`,
|
|
2492
|
-
// line
|
|
2493
|
-
lineWidthBold: lineWidth + 1
|
|
2494
|
-
}, genRadius(borderRadius));
|
|
2495
|
-
}
|
|
2496
|
-
|
|
2497
|
-
const genControlHeight = token => {
|
|
2498
|
-
const {
|
|
2499
|
-
controlHeight
|
|
2500
|
-
} = token;
|
|
2501
|
-
return {
|
|
2502
|
-
controlHeightSM: controlHeight * 0.75,
|
|
2503
|
-
controlHeightXS: controlHeight * 0.5,
|
|
2504
|
-
controlHeightLG: controlHeight * 1.25
|
|
2505
|
-
};
|
|
2506
|
-
};
|
|
2507
|
-
|
|
2508
|
-
function getLineHeight(fontSize) {
|
|
2509
|
-
return (fontSize + 8) / fontSize;
|
|
2510
|
-
}
|
|
2511
|
-
// https://zhuanlan.zhihu.com/p/32746810
|
|
2512
|
-
function getFontSizes(base) {
|
|
2513
|
-
const fontSizes = Array.from({
|
|
2514
|
-
length: 10
|
|
2515
|
-
}).map((_, index) => {
|
|
2516
|
-
const i = index - 1;
|
|
2517
|
-
const baseSize = base * Math.pow(Math.E, i / 5);
|
|
2518
|
-
const intSize = index > 1 ? Math.floor(baseSize) : Math.ceil(baseSize);
|
|
2519
|
-
// Convert to even
|
|
2520
|
-
return Math.floor(intSize / 2) * 2;
|
|
2521
|
-
});
|
|
2522
|
-
fontSizes[1] = base;
|
|
2523
|
-
return fontSizes.map(size => ({
|
|
2524
|
-
size,
|
|
2525
|
-
lineHeight: getLineHeight(size)
|
|
2526
|
-
}));
|
|
2527
|
-
}
|
|
2528
|
-
|
|
2529
|
-
const genFontMapToken = fontSize => {
|
|
2530
|
-
const fontSizePairs = getFontSizes(fontSize);
|
|
2531
|
-
const fontSizes = fontSizePairs.map(pair => pair.size);
|
|
2532
|
-
const lineHeights = fontSizePairs.map(pair => pair.lineHeight);
|
|
2533
|
-
const fontSizeMD = fontSizes[1];
|
|
2534
|
-
const fontSizeSM = fontSizes[0];
|
|
2535
|
-
const fontSizeLG = fontSizes[2];
|
|
2536
|
-
const lineHeight = lineHeights[1];
|
|
2537
|
-
const lineHeightSM = lineHeights[0];
|
|
2538
|
-
const lineHeightLG = lineHeights[2];
|
|
2539
|
-
return {
|
|
2540
|
-
fontSizeSM,
|
|
2541
|
-
fontSize: fontSizeMD,
|
|
2542
|
-
fontSizeLG,
|
|
2543
|
-
fontSizeXL: fontSizes[3],
|
|
2544
|
-
fontSizeHeading1: fontSizes[6],
|
|
2545
|
-
fontSizeHeading2: fontSizes[5],
|
|
2546
|
-
fontSizeHeading3: fontSizes[4],
|
|
2547
|
-
fontSizeHeading4: fontSizes[3],
|
|
2548
|
-
fontSizeHeading5: fontSizes[2],
|
|
2549
|
-
lineHeight,
|
|
2550
|
-
lineHeightLG,
|
|
2551
|
-
lineHeightSM,
|
|
2552
|
-
fontHeight: Math.round(lineHeight * fontSizeMD),
|
|
2553
|
-
fontHeightLG: Math.round(lineHeightLG * fontSizeLG),
|
|
2554
|
-
fontHeightSM: Math.round(lineHeightSM * fontSizeSM),
|
|
2555
|
-
lineHeightHeading1: lineHeights[6],
|
|
2556
|
-
lineHeightHeading2: lineHeights[5],
|
|
2557
|
-
lineHeightHeading3: lineHeights[4],
|
|
2558
|
-
lineHeightHeading4: lineHeights[3],
|
|
2559
|
-
lineHeightHeading5: lineHeights[2]
|
|
2560
|
-
};
|
|
2561
|
-
};
|
|
2562
|
-
|
|
2563
|
-
function genSizeMapToken(token) {
|
|
2564
|
-
const {
|
|
2565
|
-
sizeUnit,
|
|
2566
|
-
sizeStep
|
|
2567
|
-
} = token;
|
|
2568
|
-
return {
|
|
2569
|
-
sizeXXL: sizeUnit * (sizeStep + 8),
|
|
2570
|
-
// 48
|
|
2571
|
-
sizeXL: sizeUnit * (sizeStep + 4),
|
|
2572
|
-
// 32
|
|
2573
|
-
sizeLG: sizeUnit * (sizeStep + 2),
|
|
2574
|
-
// 24
|
|
2575
|
-
sizeMD: sizeUnit * (sizeStep + 1),
|
|
2576
|
-
// 20
|
|
2577
|
-
sizeMS: sizeUnit * sizeStep,
|
|
2578
|
-
// 16
|
|
2579
|
-
size: sizeUnit * sizeStep,
|
|
2580
|
-
// 16
|
|
2581
|
-
sizeSM: sizeUnit * (sizeStep - 1),
|
|
2582
|
-
// 12
|
|
2583
|
-
sizeXS: sizeUnit * (sizeStep - 2),
|
|
2584
|
-
// 8
|
|
2585
|
-
sizeXXS: sizeUnit * (sizeStep - 3) // 4
|
|
2586
|
-
};
|
|
2587
|
-
}
|
|
2588
|
-
|
|
2589
|
-
const getAlphaColor$1 = (baseColor, alpha) => new FastColor(baseColor).setA(alpha).toRgbString();
|
|
2590
|
-
const getSolidColor = (baseColor, brightness) => {
|
|
2591
|
-
const instance = new FastColor(baseColor);
|
|
2592
|
-
return instance.darken(brightness).toHexString();
|
|
2593
|
-
};
|
|
2594
|
-
|
|
2595
|
-
const generateColorPalettes = baseColor => {
|
|
2596
|
-
const colors = generate(baseColor);
|
|
2597
|
-
return {
|
|
2598
|
-
1: colors[0],
|
|
2599
|
-
2: colors[1],
|
|
2600
|
-
3: colors[2],
|
|
2601
|
-
4: colors[3],
|
|
2602
|
-
5: colors[4],
|
|
2603
|
-
6: colors[5],
|
|
2604
|
-
7: colors[6],
|
|
2605
|
-
8: colors[4],
|
|
2606
|
-
9: colors[5],
|
|
2607
|
-
10: colors[6]
|
|
2608
|
-
// 8: colors[7],
|
|
2609
|
-
// 9: colors[8],
|
|
2610
|
-
// 10: colors[9],
|
|
2611
|
-
};
|
|
2612
|
-
};
|
|
2613
|
-
const generateNeutralColorPalettes = (bgBaseColor, textBaseColor) => {
|
|
2614
|
-
const colorBgBase = bgBaseColor || '#fff';
|
|
2615
|
-
const colorTextBase = textBaseColor || '#000';
|
|
2616
|
-
return {
|
|
2617
|
-
colorBgBase,
|
|
2618
|
-
colorTextBase,
|
|
2619
|
-
colorText: getAlphaColor$1(colorTextBase, 0.88),
|
|
2620
|
-
colorTextSecondary: getAlphaColor$1(colorTextBase, 0.65),
|
|
2621
|
-
colorTextTertiary: getAlphaColor$1(colorTextBase, 0.45),
|
|
2622
|
-
colorTextQuaternary: getAlphaColor$1(colorTextBase, 0.25),
|
|
2623
|
-
colorFill: getAlphaColor$1(colorTextBase, 0.15),
|
|
2624
|
-
colorFillSecondary: getAlphaColor$1(colorTextBase, 0.06),
|
|
2625
|
-
colorFillTertiary: getAlphaColor$1(colorTextBase, 0.04),
|
|
2626
|
-
colorFillQuaternary: getAlphaColor$1(colorTextBase, 0.02),
|
|
2627
|
-
colorBgSolid: getAlphaColor$1(colorTextBase, 1),
|
|
2628
|
-
colorBgSolidHover: getAlphaColor$1(colorTextBase, 0.75),
|
|
2629
|
-
colorBgSolidActive: getAlphaColor$1(colorTextBase, 0.95),
|
|
2630
|
-
colorBgLayout: getSolidColor(colorBgBase, 4),
|
|
2631
|
-
colorBgContainer: getSolidColor(colorBgBase, 0),
|
|
2632
|
-
colorBgElevated: getSolidColor(colorBgBase, 0),
|
|
2633
|
-
colorBgSpotlight: getAlphaColor$1(colorTextBase, 0.85),
|
|
2634
|
-
colorBgBlur: 'transparent',
|
|
2635
|
-
colorBorder: getSolidColor(colorBgBase, 15),
|
|
2636
|
-
colorBorderSecondary: getSolidColor(colorBgBase, 6)
|
|
2637
|
-
};
|
|
2638
|
-
};
|
|
2639
|
-
|
|
2640
|
-
function derivative(token) {
|
|
2641
|
-
// pink is deprecated name of magenta, keep this for backwards compatibility
|
|
2642
|
-
presetPrimaryColors.pink = presetPrimaryColors.magenta;
|
|
2643
|
-
presetPalettes.pink = presetPalettes.magenta;
|
|
2644
|
-
const colorPalettes = Object.keys(defaultPresetColors).map(colorKey => {
|
|
2645
|
-
const colors = token[colorKey] === presetPrimaryColors[colorKey] ? presetPalettes[colorKey] : generate(token[colorKey]);
|
|
2646
|
-
return Array.from({
|
|
2647
|
-
length: 10
|
|
2648
|
-
}, () => 1).reduce((prev, _, i) => {
|
|
2649
|
-
prev[`${colorKey}-${i + 1}`] = colors[i];
|
|
2650
|
-
prev[`${colorKey}${i + 1}`] = colors[i];
|
|
2651
|
-
return prev;
|
|
2652
|
-
}, {});
|
|
2653
|
-
}).reduce((prev, cur) => {
|
|
2654
|
-
// biome-ignore lint/style/noParameterAssign: it is a reduce
|
|
2655
|
-
prev = Object.assign(Object.assign({}, prev), cur);
|
|
2656
|
-
return prev;
|
|
2657
|
-
}, {});
|
|
2658
|
-
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, token), colorPalettes), genColorMapToken(token, {
|
|
2659
|
-
generateColorPalettes,
|
|
2660
|
-
generateNeutralColorPalettes
|
|
2661
|
-
})), genFontMapToken(token.fontSize)), genSizeMapToken(token)), genControlHeight(token)), genCommonMapToken(token));
|
|
2662
|
-
}
|
|
2663
|
-
|
|
2664
|
-
const defaultTheme = createTheme(derivative);
|
|
2665
|
-
|
|
2666
|
-
// ================================ Context =================================
|
|
2667
|
-
// To ensure snapshot stable. We disable hashed in test env.
|
|
2668
|
-
const defaultConfig = {
|
|
2669
|
-
token: seedToken,
|
|
2670
|
-
override: {
|
|
2671
|
-
override: seedToken
|
|
2672
|
-
},
|
|
2673
|
-
hashed: true
|
|
2674
|
-
};
|
|
2675
|
-
const DesignTokenContext = /*#__PURE__*/React__default.createContext(defaultConfig);
|
|
2676
|
-
|
|
2677
|
-
const defaultPrefixCls = 'ant';
|
|
2678
|
-
const defaultIconPrefixCls = 'anticon';
|
|
2679
|
-
const defaultGetPrefixCls = (suffixCls, customizePrefixCls) => {
|
|
2680
|
-
if (customizePrefixCls) {
|
|
2681
|
-
return customizePrefixCls;
|
|
2682
|
-
}
|
|
2683
|
-
return suffixCls ? `${defaultPrefixCls}-${suffixCls}` : defaultPrefixCls;
|
|
2684
|
-
};
|
|
2685
|
-
// zombieJ: 🚨 Do not pass `defaultRenderEmpty` here since it will cause circular dependency.
|
|
2686
|
-
const ConfigContext = /*#__PURE__*/React.createContext({
|
|
2687
|
-
// We provide a default function for Context without provider
|
|
2688
|
-
getPrefixCls: defaultGetPrefixCls,
|
|
2689
|
-
iconPrefixCls: defaultIconPrefixCls
|
|
2690
|
-
});
|
|
2691
|
-
const EMPTY_OBJECT = {};
|
|
2692
|
-
/**
|
|
2693
|
-
* Get ConfigProvider configured component props.
|
|
2694
|
-
* This help to reduce bundle size for saving `?.` operator.
|
|
2695
|
-
* Do not use as `useMemo` deps since we do not cache the object here.
|
|
2696
|
-
*
|
|
2697
|
-
* NOTE: not refactor this with `useMemo` since memo will cost another memory space,
|
|
2698
|
-
* which will waste both compare calculation & memory.
|
|
2699
|
-
*/
|
|
2700
|
-
function useComponentConfig(propName) {
|
|
2701
|
-
const context = React.useContext(ConfigContext);
|
|
2702
|
-
const {
|
|
2703
|
-
getPrefixCls,
|
|
2704
|
-
direction,
|
|
2705
|
-
getPopupContainer
|
|
2706
|
-
} = context;
|
|
2707
|
-
const propValue = context[propName];
|
|
2708
|
-
return Object.assign(Object.assign({
|
|
2709
|
-
classNames: EMPTY_OBJECT,
|
|
2710
|
-
styles: EMPTY_OBJECT
|
|
2711
|
-
}, propValue), {
|
|
2712
|
-
getPrefixCls,
|
|
2713
|
-
direction,
|
|
2714
|
-
getPopupContainer
|
|
2715
|
-
});
|
|
2716
|
-
}
|
|
2717
|
-
|
|
2718
|
-
const dynamicStyleMark = `-ant-${Date.now()}-${Math.random()}`;
|
|
2719
|
-
function getStyle(globalPrefixCls, theme) {
|
|
2720
|
-
const variables = {};
|
|
2721
|
-
const formatColor = (color, updater) => {
|
|
2722
|
-
let clone = color.clone();
|
|
2723
|
-
clone = (updater === null || updater === void 0 ? void 0 : updater(clone)) || clone;
|
|
2724
|
-
return clone.toRgbString();
|
|
2725
|
-
};
|
|
2726
|
-
const fillColor = (colorVal, type) => {
|
|
2727
|
-
const baseColor = new FastColor(colorVal);
|
|
2728
|
-
const colorPalettes = generate(baseColor.toRgbString());
|
|
2729
|
-
variables[`${type}-color`] = formatColor(baseColor);
|
|
2730
|
-
variables[`${type}-color-disabled`] = colorPalettes[1];
|
|
2731
|
-
variables[`${type}-color-hover`] = colorPalettes[4];
|
|
2732
|
-
variables[`${type}-color-active`] = colorPalettes[6];
|
|
2733
|
-
variables[`${type}-color-outline`] = baseColor.clone().setA(0.2).toRgbString();
|
|
2734
|
-
variables[`${type}-color-deprecated-bg`] = colorPalettes[0];
|
|
2735
|
-
variables[`${type}-color-deprecated-border`] = colorPalettes[2];
|
|
2736
|
-
};
|
|
2737
|
-
// ================ Primary Color ================
|
|
2738
|
-
if (theme.primaryColor) {
|
|
2739
|
-
fillColor(theme.primaryColor, 'primary');
|
|
2740
|
-
const primaryColor = new FastColor(theme.primaryColor);
|
|
2741
|
-
const primaryColors = generate(primaryColor.toRgbString());
|
|
2742
|
-
// Legacy - We should use semantic naming standard
|
|
2743
|
-
primaryColors.forEach((color, index) => {
|
|
2744
|
-
variables[`primary-${index + 1}`] = color;
|
|
2745
|
-
});
|
|
2746
|
-
// Deprecated
|
|
2747
|
-
variables['primary-color-deprecated-l-35'] = formatColor(primaryColor, c => c.lighten(35));
|
|
2748
|
-
variables['primary-color-deprecated-l-20'] = formatColor(primaryColor, c => c.lighten(20));
|
|
2749
|
-
variables['primary-color-deprecated-t-20'] = formatColor(primaryColor, c => c.tint(20));
|
|
2750
|
-
variables['primary-color-deprecated-t-50'] = formatColor(primaryColor, c => c.tint(50));
|
|
2751
|
-
variables['primary-color-deprecated-f-12'] = formatColor(primaryColor, c => c.setA(c.a * 0.12));
|
|
2752
|
-
const primaryActiveColor = new FastColor(primaryColors[0]);
|
|
2753
|
-
variables['primary-color-active-deprecated-f-30'] = formatColor(primaryActiveColor, c => c.setA(c.a * 0.3));
|
|
2754
|
-
variables['primary-color-active-deprecated-d-02'] = formatColor(primaryActiveColor, c => c.darken(2));
|
|
2755
|
-
}
|
|
2756
|
-
// ================ Success Color ================
|
|
2757
|
-
if (theme.successColor) {
|
|
2758
|
-
fillColor(theme.successColor, 'success');
|
|
2759
|
-
}
|
|
2760
|
-
// ================ Warning Color ================
|
|
2761
|
-
if (theme.warningColor) {
|
|
2762
|
-
fillColor(theme.warningColor, 'warning');
|
|
2763
|
-
}
|
|
2764
|
-
// ================= Error Color =================
|
|
2765
|
-
if (theme.errorColor) {
|
|
2766
|
-
fillColor(theme.errorColor, 'error');
|
|
2767
|
-
}
|
|
2768
|
-
// ================= Info Color ==================
|
|
2769
|
-
if (theme.infoColor) {
|
|
2770
|
-
fillColor(theme.infoColor, 'info');
|
|
2771
|
-
}
|
|
2772
|
-
// Convert to css variables
|
|
2773
|
-
const cssList = Object.keys(variables).map(key => `--${globalPrefixCls}-${key}: ${variables[key]};`);
|
|
2774
|
-
return `
|
|
2775
|
-
:root {
|
|
2776
|
-
${cssList.join('\n')}
|
|
2777
|
-
}
|
|
2778
|
-
`.trim();
|
|
2779
|
-
}
|
|
2780
|
-
function registerTheme(globalPrefixCls, theme) {
|
|
2781
|
-
const style = getStyle(globalPrefixCls, theme);
|
|
2782
|
-
if (canUseDom()) {
|
|
2783
|
-
updateCSS(style, `${dynamicStyleMark}-dynamic-theme`);
|
|
2784
|
-
} else {
|
|
2785
|
-
process.env.NODE_ENV !== "production" ? warning(false, 'ConfigProvider', 'SSR do not support dynamic theme with css variables.') : void 0;
|
|
2786
|
-
}
|
|
2787
|
-
}
|
|
2788
|
-
|
|
2789
|
-
const DisabledContext = /*#__PURE__*/React.createContext(false);
|
|
2790
|
-
const DisabledContextProvider = ({
|
|
2791
|
-
children,
|
|
2792
|
-
disabled
|
|
2793
|
-
}) => {
|
|
2794
|
-
const originDisabled = React.useContext(DisabledContext);
|
|
2795
|
-
return /*#__PURE__*/React.createElement(DisabledContext.Provider, {
|
|
2796
|
-
value: disabled !== null && disabled !== void 0 ? disabled : originDisabled
|
|
2797
|
-
}, children);
|
|
2798
|
-
};
|
|
2799
|
-
|
|
2800
|
-
const SizeContext = /*#__PURE__*/React.createContext(undefined);
|
|
2801
|
-
const SizeContextProvider = ({
|
|
2802
|
-
children,
|
|
2803
|
-
size
|
|
2804
|
-
}) => {
|
|
2805
|
-
const originSize = React.useContext(SizeContext);
|
|
2806
|
-
return /*#__PURE__*/React.createElement(SizeContext.Provider, {
|
|
2807
|
-
value: size || originSize
|
|
2808
|
-
}, children);
|
|
2809
|
-
};
|
|
2810
|
-
|
|
2811
|
-
function useConfig() {
|
|
2812
|
-
const componentDisabled = useContext(DisabledContext);
|
|
2813
|
-
const componentSize = useContext(SizeContext);
|
|
2814
|
-
return {
|
|
2815
|
-
componentDisabled,
|
|
2816
|
-
componentSize
|
|
2817
|
-
};
|
|
2818
|
-
}
|
|
2819
|
-
|
|
2820
|
-
var AbstractCalculator = /*#__PURE__*/_createClass(function AbstractCalculator() {
|
|
2821
|
-
_classCallCheck(this, AbstractCalculator);
|
|
2822
|
-
});
|
|
2823
|
-
|
|
2824
|
-
var CALC_UNIT = 'CALC_UNIT';
|
|
2825
|
-
var regexp = new RegExp(CALC_UNIT, 'g');
|
|
2826
|
-
function unit(value) {
|
|
2827
|
-
if (typeof value === 'number') {
|
|
2828
|
-
return "".concat(value).concat(CALC_UNIT);
|
|
2829
|
-
}
|
|
2830
|
-
return value;
|
|
2831
|
-
}
|
|
2832
|
-
var CSSCalculator = /*#__PURE__*/function (_AbstractCalculator) {
|
|
2833
|
-
_inherits(CSSCalculator, _AbstractCalculator);
|
|
2834
|
-
var _super = _createSuper(CSSCalculator);
|
|
2835
|
-
function CSSCalculator(num, unitlessCssVar) {
|
|
2836
|
-
var _this;
|
|
2837
|
-
_classCallCheck(this, CSSCalculator);
|
|
2838
|
-
_this = _super.call(this);
|
|
2839
|
-
_defineProperty(_assertThisInitialized(_this), "result", '');
|
|
2840
|
-
_defineProperty(_assertThisInitialized(_this), "unitlessCssVar", void 0);
|
|
2841
|
-
_defineProperty(_assertThisInitialized(_this), "lowPriority", void 0);
|
|
2842
|
-
var numType = _typeof(num);
|
|
2843
|
-
_this.unitlessCssVar = unitlessCssVar;
|
|
2844
|
-
if (num instanceof CSSCalculator) {
|
|
2845
|
-
_this.result = "(".concat(num.result, ")");
|
|
2846
|
-
} else if (numType === 'number') {
|
|
2847
|
-
_this.result = unit(num);
|
|
2848
|
-
} else if (numType === 'string') {
|
|
2849
|
-
_this.result = num;
|
|
2850
|
-
}
|
|
2851
|
-
return _this;
|
|
2852
|
-
}
|
|
2853
|
-
_createClass(CSSCalculator, [{
|
|
2854
|
-
key: "add",
|
|
2855
|
-
value: function add(num) {
|
|
2856
|
-
if (num instanceof CSSCalculator) {
|
|
2857
|
-
this.result = "".concat(this.result, " + ").concat(num.getResult());
|
|
2858
|
-
} else if (typeof num === 'number' || typeof num === 'string') {
|
|
2859
|
-
this.result = "".concat(this.result, " + ").concat(unit(num));
|
|
2860
|
-
}
|
|
2861
|
-
this.lowPriority = true;
|
|
2862
|
-
return this;
|
|
2863
|
-
}
|
|
2864
|
-
}, {
|
|
2865
|
-
key: "sub",
|
|
2866
|
-
value: function sub(num) {
|
|
2867
|
-
if (num instanceof CSSCalculator) {
|
|
2868
|
-
this.result = "".concat(this.result, " - ").concat(num.getResult());
|
|
2869
|
-
} else if (typeof num === 'number' || typeof num === 'string') {
|
|
2870
|
-
this.result = "".concat(this.result, " - ").concat(unit(num));
|
|
2871
|
-
}
|
|
2872
|
-
this.lowPriority = true;
|
|
2873
|
-
return this;
|
|
2874
|
-
}
|
|
2875
|
-
}, {
|
|
2876
|
-
key: "mul",
|
|
2877
|
-
value: function mul(num) {
|
|
2878
|
-
if (this.lowPriority) {
|
|
2879
|
-
this.result = "(".concat(this.result, ")");
|
|
2880
|
-
}
|
|
2881
|
-
if (num instanceof CSSCalculator) {
|
|
2882
|
-
this.result = "".concat(this.result, " * ").concat(num.getResult(true));
|
|
2883
|
-
} else if (typeof num === 'number' || typeof num === 'string') {
|
|
2884
|
-
this.result = "".concat(this.result, " * ").concat(num);
|
|
2885
|
-
}
|
|
2886
|
-
this.lowPriority = false;
|
|
2887
|
-
return this;
|
|
2888
|
-
}
|
|
2889
|
-
}, {
|
|
2890
|
-
key: "div",
|
|
2891
|
-
value: function div(num) {
|
|
2892
|
-
if (this.lowPriority) {
|
|
2893
|
-
this.result = "(".concat(this.result, ")");
|
|
2894
|
-
}
|
|
2895
|
-
if (num instanceof CSSCalculator) {
|
|
2896
|
-
this.result = "".concat(this.result, " / ").concat(num.getResult(true));
|
|
2897
|
-
} else if (typeof num === 'number' || typeof num === 'string') {
|
|
2898
|
-
this.result = "".concat(this.result, " / ").concat(num);
|
|
2899
|
-
}
|
|
2900
|
-
this.lowPriority = false;
|
|
2901
|
-
return this;
|
|
2902
|
-
}
|
|
2903
|
-
}, {
|
|
2904
|
-
key: "getResult",
|
|
2905
|
-
value: function getResult(force) {
|
|
2906
|
-
return this.lowPriority || force ? "(".concat(this.result, ")") : this.result;
|
|
2907
|
-
}
|
|
2908
|
-
}, {
|
|
2909
|
-
key: "equal",
|
|
2910
|
-
value: function equal(options) {
|
|
2911
|
-
var _this2 = this;
|
|
2912
|
-
var _ref = options || {},
|
|
2913
|
-
cssUnit = _ref.unit;
|
|
2914
|
-
var mergedUnit = true;
|
|
2915
|
-
if (typeof cssUnit === 'boolean') {
|
|
2916
|
-
mergedUnit = cssUnit;
|
|
2917
|
-
} else if (Array.from(this.unitlessCssVar).some(function (cssVar) {
|
|
2918
|
-
return _this2.result.includes(cssVar);
|
|
2919
|
-
})) {
|
|
2920
|
-
mergedUnit = false;
|
|
2921
|
-
}
|
|
2922
|
-
this.result = this.result.replace(regexp, mergedUnit ? 'px' : '');
|
|
2923
|
-
if (typeof this.lowPriority !== 'undefined') {
|
|
2924
|
-
return "calc(".concat(this.result, ")");
|
|
2925
|
-
}
|
|
2926
|
-
return this.result;
|
|
2927
|
-
}
|
|
2928
|
-
}]);
|
|
2929
|
-
return CSSCalculator;
|
|
2930
|
-
}(AbstractCalculator);
|
|
2931
|
-
|
|
2932
|
-
var NumCalculator = /*#__PURE__*/function (_AbstractCalculator) {
|
|
2933
|
-
_inherits(NumCalculator, _AbstractCalculator);
|
|
2934
|
-
var _super = _createSuper(NumCalculator);
|
|
2935
|
-
function NumCalculator(num) {
|
|
2936
|
-
var _this;
|
|
2937
|
-
_classCallCheck(this, NumCalculator);
|
|
2938
|
-
_this = _super.call(this);
|
|
2939
|
-
_defineProperty(_assertThisInitialized(_this), "result", 0);
|
|
2940
|
-
if (num instanceof NumCalculator) {
|
|
2941
|
-
_this.result = num.result;
|
|
2942
|
-
} else if (typeof num === 'number') {
|
|
2943
|
-
_this.result = num;
|
|
2944
|
-
}
|
|
2945
|
-
return _this;
|
|
2946
|
-
}
|
|
2947
|
-
_createClass(NumCalculator, [{
|
|
2948
|
-
key: "add",
|
|
2949
|
-
value: function add(num) {
|
|
2950
|
-
if (num instanceof NumCalculator) {
|
|
2951
|
-
this.result += num.result;
|
|
2952
|
-
} else if (typeof num === 'number') {
|
|
2953
|
-
this.result += num;
|
|
2954
|
-
}
|
|
2955
|
-
return this;
|
|
2956
|
-
}
|
|
2957
|
-
}, {
|
|
2958
|
-
key: "sub",
|
|
2959
|
-
value: function sub(num) {
|
|
2960
|
-
if (num instanceof NumCalculator) {
|
|
2961
|
-
this.result -= num.result;
|
|
2962
|
-
} else if (typeof num === 'number') {
|
|
2963
|
-
this.result -= num;
|
|
2964
|
-
}
|
|
2965
|
-
return this;
|
|
2966
|
-
}
|
|
2967
|
-
}, {
|
|
2968
|
-
key: "mul",
|
|
2969
|
-
value: function mul(num) {
|
|
2970
|
-
if (num instanceof NumCalculator) {
|
|
2971
|
-
this.result *= num.result;
|
|
2972
|
-
} else if (typeof num === 'number') {
|
|
2973
|
-
this.result *= num;
|
|
2974
|
-
}
|
|
2975
|
-
return this;
|
|
2976
|
-
}
|
|
2977
|
-
}, {
|
|
2978
|
-
key: "div",
|
|
2979
|
-
value: function div(num) {
|
|
2980
|
-
if (num instanceof NumCalculator) {
|
|
2981
|
-
this.result /= num.result;
|
|
2982
|
-
} else if (typeof num === 'number') {
|
|
2983
|
-
this.result /= num;
|
|
2984
|
-
}
|
|
2985
|
-
return this;
|
|
2986
|
-
}
|
|
2987
|
-
}, {
|
|
2988
|
-
key: "equal",
|
|
2989
|
-
value: function equal() {
|
|
2990
|
-
return this.result;
|
|
2991
|
-
}
|
|
2992
|
-
}]);
|
|
2993
|
-
return NumCalculator;
|
|
2994
|
-
}(AbstractCalculator);
|
|
2995
|
-
|
|
2996
|
-
var genCalc = function genCalc(type, unitlessCssVar) {
|
|
2997
|
-
var Calculator = type === 'css' ? CSSCalculator : NumCalculator;
|
|
2998
|
-
return function (num) {
|
|
2999
|
-
return new Calculator(num, unitlessCssVar);
|
|
3000
|
-
};
|
|
3001
|
-
};
|
|
3002
|
-
|
|
3003
|
-
var getCompVarPrefix = function getCompVarPrefix(component, prefix) {
|
|
3004
|
-
return "".concat([prefix, component.replace(/([A-Z]+)([A-Z][a-z]+)/g, '$1-$2').replace(/([a-z])([A-Z])/g, '$1-$2')].filter(Boolean).join('-'));
|
|
3005
|
-
};
|
|
3006
|
-
|
|
3007
|
-
function getComponentToken(component, token, defaultToken, options) {
|
|
3008
|
-
var customToken = _objectSpread2({}, token[component]);
|
|
3009
|
-
if (options !== null && options !== void 0 && options.deprecatedTokens) {
|
|
3010
|
-
var deprecatedTokens = options.deprecatedTokens;
|
|
3011
|
-
deprecatedTokens.forEach(function (_ref) {
|
|
3012
|
-
var _ref2 = _slicedToArray(_ref, 2),
|
|
3013
|
-
oldTokenKey = _ref2[0],
|
|
3014
|
-
newTokenKey = _ref2[1];
|
|
3015
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
3016
|
-
warningOnce(!(customToken !== null && customToken !== void 0 && customToken[oldTokenKey]), "Component Token `".concat(String(oldTokenKey), "` of ").concat(String(component), " is deprecated. Please use `").concat(String(newTokenKey), "` instead."));
|
|
3017
|
-
}
|
|
3018
|
-
|
|
3019
|
-
// Should wrap with `if` clause, or there will be `undefined` in object.
|
|
3020
|
-
if (customToken !== null && customToken !== void 0 && customToken[oldTokenKey] || customToken !== null && customToken !== void 0 && customToken[newTokenKey]) {
|
|
3021
|
-
var _customToken$newToken;
|
|
3022
|
-
(_customToken$newToken = customToken[newTokenKey]) !== null && _customToken$newToken !== void 0 ? _customToken$newToken : customToken[newTokenKey] = customToken === null || customToken === void 0 ? void 0 : customToken[oldTokenKey];
|
|
3023
|
-
}
|
|
3024
|
-
});
|
|
3025
|
-
}
|
|
3026
|
-
var mergedToken = _objectSpread2(_objectSpread2({}, defaultToken), customToken);
|
|
3027
|
-
|
|
3028
|
-
// Remove same value as global token to minimize size
|
|
3029
|
-
Object.keys(mergedToken).forEach(function (key) {
|
|
3030
|
-
if (mergedToken[key] === token[key]) {
|
|
3031
|
-
delete mergedToken[key];
|
|
3032
|
-
}
|
|
3033
|
-
});
|
|
3034
|
-
return mergedToken;
|
|
3035
|
-
}
|
|
3036
|
-
|
|
3037
|
-
var enableStatistic = process.env.NODE_ENV !== 'production' || typeof CSSINJS_STATISTIC !== 'undefined';
|
|
3038
|
-
var recording = true;
|
|
3039
|
-
|
|
3040
|
-
/**
|
|
3041
|
-
* This function will do as `Object.assign` in production. But will use Object.defineProperty:get to
|
|
3042
|
-
* pass all value access in development. To support statistic field usage with alias token.
|
|
3043
|
-
*/
|
|
3044
|
-
function merge() {
|
|
3045
|
-
for (var _len = arguments.length, objs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
3046
|
-
objs[_key] = arguments[_key];
|
|
3047
|
-
}
|
|
3048
|
-
/* istanbul ignore next */
|
|
3049
|
-
if (!enableStatistic) {
|
|
3050
|
-
return Object.assign.apply(Object, [{}].concat(objs));
|
|
3051
|
-
}
|
|
3052
|
-
recording = false;
|
|
3053
|
-
var ret = {};
|
|
3054
|
-
objs.forEach(function (obj) {
|
|
3055
|
-
if (_typeof(obj) !== 'object') {
|
|
3056
|
-
return;
|
|
3057
|
-
}
|
|
3058
|
-
var keys = Object.keys(obj);
|
|
3059
|
-
keys.forEach(function (key) {
|
|
3060
|
-
Object.defineProperty(ret, key, {
|
|
3061
|
-
configurable: true,
|
|
3062
|
-
enumerable: true,
|
|
3063
|
-
get: function get() {
|
|
3064
|
-
return obj[key];
|
|
3065
|
-
}
|
|
3066
|
-
});
|
|
3067
|
-
});
|
|
3068
|
-
});
|
|
3069
|
-
recording = true;
|
|
3070
|
-
return ret;
|
|
3071
|
-
}
|
|
3072
|
-
|
|
3073
|
-
/** @internal Internal Usage. Not use in your production. */
|
|
3074
|
-
var statistic = {};
|
|
3075
|
-
|
|
3076
|
-
/* istanbul ignore next */
|
|
3077
|
-
function noop() {}
|
|
3078
|
-
|
|
3079
|
-
/** Statistic token usage case. Should use `merge` function if you do not want spread record. */
|
|
3080
|
-
var statisticToken = function statisticToken(token) {
|
|
3081
|
-
var tokenKeys;
|
|
3082
|
-
var proxy = token;
|
|
3083
|
-
var flush = noop;
|
|
3084
|
-
if (enableStatistic && typeof Proxy !== 'undefined') {
|
|
3085
|
-
tokenKeys = new Set();
|
|
3086
|
-
proxy = new Proxy(token, {
|
|
3087
|
-
get: function get(obj, prop) {
|
|
3088
|
-
if (recording) {
|
|
3089
|
-
var _tokenKeys;
|
|
3090
|
-
(_tokenKeys = tokenKeys) === null || _tokenKeys === void 0 || _tokenKeys.add(prop);
|
|
3091
|
-
}
|
|
3092
|
-
return obj[prop];
|
|
3093
|
-
}
|
|
3094
|
-
});
|
|
3095
|
-
flush = function flush(componentName, componentToken) {
|
|
3096
|
-
var _statistic$componentN;
|
|
3097
|
-
statistic[componentName] = {
|
|
3098
|
-
global: Array.from(tokenKeys),
|
|
3099
|
-
component: _objectSpread2(_objectSpread2({}, (_statistic$componentN = statistic[componentName]) === null || _statistic$componentN === void 0 ? void 0 : _statistic$componentN.component), componentToken)
|
|
3100
|
-
};
|
|
3101
|
-
};
|
|
3102
|
-
}
|
|
3103
|
-
return {
|
|
3104
|
-
token: proxy,
|
|
3105
|
-
keys: tokenKeys,
|
|
3106
|
-
flush: flush
|
|
3107
|
-
};
|
|
3108
|
-
};
|
|
3109
|
-
|
|
3110
|
-
function getDefaultComponentToken(component, token, getDefaultToken) {
|
|
3111
|
-
if (typeof getDefaultToken === 'function') {
|
|
3112
|
-
var _token$component;
|
|
3113
|
-
return getDefaultToken(merge(token, (_token$component = token[component]) !== null && _token$component !== void 0 ? _token$component : {}));
|
|
3114
|
-
}
|
|
3115
|
-
return getDefaultToken !== null && getDefaultToken !== void 0 ? getDefaultToken : {};
|
|
3116
|
-
}
|
|
3117
|
-
|
|
3118
|
-
function genMaxMin(type) {
|
|
3119
|
-
if (type === 'js') {
|
|
3120
|
-
return {
|
|
3121
|
-
max: Math.max,
|
|
3122
|
-
min: Math.min
|
|
3123
|
-
};
|
|
3124
|
-
}
|
|
3125
|
-
return {
|
|
3126
|
-
max: function max() {
|
|
3127
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
3128
|
-
args[_key] = arguments[_key];
|
|
3129
|
-
}
|
|
3130
|
-
return "max(".concat(args.map(function (value) {
|
|
3131
|
-
return unit$1(value);
|
|
3132
|
-
}).join(','), ")");
|
|
3133
|
-
},
|
|
3134
|
-
min: function min() {
|
|
3135
|
-
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
3136
|
-
args[_key2] = arguments[_key2];
|
|
3137
|
-
}
|
|
3138
|
-
return "min(".concat(args.map(function (value) {
|
|
3139
|
-
return unit$1(value);
|
|
3140
|
-
}).join(','), ")");
|
|
3141
|
-
}
|
|
3142
|
-
};
|
|
3143
|
-
}
|
|
3144
|
-
|
|
3145
|
-
var BEAT_LIMIT = 1000 * 60 * 10;
|
|
3146
|
-
|
|
3147
|
-
/**
|
|
3148
|
-
* A helper class to map keys to values.
|
|
3149
|
-
* It supports both primitive keys and object keys.
|
|
3150
|
-
*/
|
|
3151
|
-
var ArrayKeyMap = /*#__PURE__*/function () {
|
|
3152
|
-
function ArrayKeyMap() {
|
|
3153
|
-
_classCallCheck(this, ArrayKeyMap);
|
|
3154
|
-
_defineProperty(this, "map", new Map());
|
|
3155
|
-
// Use WeakMap to avoid memory leak
|
|
3156
|
-
_defineProperty(this, "objectIDMap", new WeakMap());
|
|
3157
|
-
_defineProperty(this, "nextID", 0);
|
|
3158
|
-
_defineProperty(this, "lastAccessBeat", new Map());
|
|
3159
|
-
// We will clean up the cache when reach the limit
|
|
3160
|
-
_defineProperty(this, "accessBeat", 0);
|
|
3161
|
-
}
|
|
3162
|
-
_createClass(ArrayKeyMap, [{
|
|
3163
|
-
key: "set",
|
|
3164
|
-
value: function set(keys, value) {
|
|
3165
|
-
// New set will trigger clear
|
|
3166
|
-
this.clear();
|
|
3167
|
-
|
|
3168
|
-
// Set logic
|
|
3169
|
-
var compositeKey = this.getCompositeKey(keys);
|
|
3170
|
-
this.map.set(compositeKey, value);
|
|
3171
|
-
this.lastAccessBeat.set(compositeKey, Date.now());
|
|
3172
|
-
}
|
|
3173
|
-
}, {
|
|
3174
|
-
key: "get",
|
|
3175
|
-
value: function get(keys) {
|
|
3176
|
-
var compositeKey = this.getCompositeKey(keys);
|
|
3177
|
-
var cache = this.map.get(compositeKey);
|
|
3178
|
-
this.lastAccessBeat.set(compositeKey, Date.now());
|
|
3179
|
-
this.accessBeat += 1;
|
|
3180
|
-
return cache;
|
|
3181
|
-
}
|
|
3182
|
-
}, {
|
|
3183
|
-
key: "getCompositeKey",
|
|
3184
|
-
value: function getCompositeKey(keys) {
|
|
3185
|
-
var _this = this;
|
|
3186
|
-
var ids = keys.map(function (key) {
|
|
3187
|
-
if (key && _typeof(key) === 'object') {
|
|
3188
|
-
return "obj_".concat(_this.getObjectID(key));
|
|
3189
|
-
}
|
|
3190
|
-
return "".concat(_typeof(key), "_").concat(key);
|
|
3191
|
-
});
|
|
3192
|
-
return ids.join('|');
|
|
3193
|
-
}
|
|
3194
|
-
}, {
|
|
3195
|
-
key: "getObjectID",
|
|
3196
|
-
value: function getObjectID(obj) {
|
|
3197
|
-
if (this.objectIDMap.has(obj)) {
|
|
3198
|
-
return this.objectIDMap.get(obj);
|
|
3199
|
-
}
|
|
3200
|
-
var id = this.nextID;
|
|
3201
|
-
this.objectIDMap.set(obj, id);
|
|
3202
|
-
this.nextID += 1;
|
|
3203
|
-
return id;
|
|
3204
|
-
}
|
|
3205
|
-
}, {
|
|
3206
|
-
key: "clear",
|
|
3207
|
-
value: function clear() {
|
|
3208
|
-
var _this2 = this;
|
|
3209
|
-
if (this.accessBeat > 10000) {
|
|
3210
|
-
var now = Date.now();
|
|
3211
|
-
this.lastAccessBeat.forEach(function (beat, key) {
|
|
3212
|
-
if (now - beat > BEAT_LIMIT) {
|
|
3213
|
-
_this2.map.delete(key);
|
|
3214
|
-
_this2.lastAccessBeat.delete(key);
|
|
3215
|
-
}
|
|
3216
|
-
});
|
|
3217
|
-
this.accessBeat = 0;
|
|
3218
|
-
}
|
|
3219
|
-
}
|
|
3220
|
-
}]);
|
|
3221
|
-
return ArrayKeyMap;
|
|
3222
|
-
}();
|
|
3223
|
-
var uniqueMap = new ArrayKeyMap();
|
|
3224
|
-
|
|
3225
|
-
/**
|
|
3226
|
-
* Like `useMemo`, but this hook result will be shared across all instances.
|
|
3227
|
-
*/
|
|
3228
|
-
function useUniqueMemo(memoFn, deps) {
|
|
3229
|
-
return React__default.useMemo(function () {
|
|
3230
|
-
var cachedValue = uniqueMap.get(deps);
|
|
3231
|
-
if (cachedValue) {
|
|
3232
|
-
return cachedValue;
|
|
3233
|
-
}
|
|
3234
|
-
var newValue = memoFn();
|
|
3235
|
-
uniqueMap.set(deps, newValue);
|
|
3236
|
-
return newValue;
|
|
3237
|
-
}, deps);
|
|
3238
|
-
}
|
|
3239
|
-
|
|
3240
|
-
/**
|
|
3241
|
-
* Provide a default hook since not everyone needs to config this.
|
|
3242
|
-
*/
|
|
3243
|
-
var useDefaultCSP = function useDefaultCSP() {
|
|
3244
|
-
return {};
|
|
3245
|
-
};
|
|
3246
|
-
|
|
3247
|
-
function genStyleUtils(config) {
|
|
3248
|
-
// Dependency inversion for preparing basic config.
|
|
3249
|
-
var _config$useCSP = config.useCSP,
|
|
3250
|
-
useCSP = _config$useCSP === void 0 ? useDefaultCSP : _config$useCSP,
|
|
3251
|
-
useToken = config.useToken,
|
|
3252
|
-
usePrefix = config.usePrefix,
|
|
3253
|
-
getResetStyles = config.getResetStyles,
|
|
3254
|
-
getCommonStyle = config.getCommonStyle,
|
|
3255
|
-
getCompUnitless = config.getCompUnitless;
|
|
3256
|
-
function genStyleHooks(component, styleFn, getDefaultToken, options) {
|
|
3257
|
-
var componentName = Array.isArray(component) ? component[0] : component;
|
|
3258
|
-
function prefixToken(key) {
|
|
3259
|
-
return "".concat(String(componentName)).concat(key.slice(0, 1).toUpperCase()).concat(key.slice(1));
|
|
3260
|
-
}
|
|
3261
|
-
|
|
3262
|
-
// Fill unitless
|
|
3263
|
-
var originUnitless = (options === null || options === void 0 ? void 0 : options.unitless) || {};
|
|
3264
|
-
var originCompUnitless = typeof getCompUnitless === 'function' ? getCompUnitless(component) : {};
|
|
3265
|
-
var compUnitless = _objectSpread2(_objectSpread2({}, originCompUnitless), {}, _defineProperty({}, prefixToken('zIndexPopup'), true));
|
|
3266
|
-
Object.keys(originUnitless).forEach(function (key) {
|
|
3267
|
-
compUnitless[prefixToken(key)] = originUnitless[key];
|
|
3268
|
-
});
|
|
3269
|
-
|
|
3270
|
-
// Options
|
|
3271
|
-
var mergedOptions = _objectSpread2(_objectSpread2({}, options), {}, {
|
|
3272
|
-
unitless: compUnitless,
|
|
3273
|
-
prefixToken: prefixToken
|
|
3274
|
-
});
|
|
3275
|
-
|
|
3276
|
-
// Hooks
|
|
3277
|
-
var useStyle = genComponentStyleHook(component, styleFn, getDefaultToken, mergedOptions);
|
|
3278
|
-
var useCSSVar = genCSSVarRegister(componentName, getDefaultToken, mergedOptions);
|
|
3279
|
-
return function (prefixCls) {
|
|
3280
|
-
var rootCls = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : prefixCls;
|
|
3281
|
-
var _useStyle = useStyle(prefixCls, rootCls),
|
|
3282
|
-
_useStyle2 = _slicedToArray(_useStyle, 2),
|
|
3283
|
-
hashId = _useStyle2[1];
|
|
3284
|
-
var _useCSSVar = useCSSVar(rootCls),
|
|
3285
|
-
_useCSSVar2 = _slicedToArray(_useCSSVar, 2),
|
|
3286
|
-
wrapCSSVar = _useCSSVar2[0],
|
|
3287
|
-
cssVarCls = _useCSSVar2[1];
|
|
3288
|
-
return [wrapCSSVar, hashId, cssVarCls];
|
|
3289
|
-
};
|
|
3290
|
-
}
|
|
3291
|
-
function genCSSVarRegister(component, getDefaultToken, options) {
|
|
3292
|
-
var compUnitless = options.unitless,
|
|
3293
|
-
_options$injectStyle = options.injectStyle,
|
|
3294
|
-
injectStyle = _options$injectStyle === void 0 ? true : _options$injectStyle,
|
|
3295
|
-
prefixToken = options.prefixToken,
|
|
3296
|
-
ignore = options.ignore;
|
|
3297
|
-
var CSSVarRegister = function CSSVarRegister(_ref) {
|
|
3298
|
-
var rootCls = _ref.rootCls,
|
|
3299
|
-
_ref$cssVar = _ref.cssVar,
|
|
3300
|
-
cssVar = _ref$cssVar === void 0 ? {} : _ref$cssVar;
|
|
3301
|
-
var _useToken = useToken(),
|
|
3302
|
-
realToken = _useToken.realToken;
|
|
3303
|
-
useCSSVarRegister({
|
|
3304
|
-
path: [component],
|
|
3305
|
-
prefix: cssVar.prefix,
|
|
3306
|
-
key: cssVar.key,
|
|
3307
|
-
unitless: compUnitless,
|
|
3308
|
-
ignore: ignore,
|
|
3309
|
-
token: realToken,
|
|
3310
|
-
scope: rootCls
|
|
3311
|
-
}, function () {
|
|
3312
|
-
var defaultToken = getDefaultComponentToken(component, realToken, getDefaultToken);
|
|
3313
|
-
var componentToken = getComponentToken(component, realToken, defaultToken, {
|
|
3314
|
-
deprecatedTokens: options === null || options === void 0 ? void 0 : options.deprecatedTokens
|
|
3315
|
-
});
|
|
3316
|
-
Object.keys(defaultToken).forEach(function (key) {
|
|
3317
|
-
componentToken[prefixToken(key)] = componentToken[key];
|
|
3318
|
-
delete componentToken[key];
|
|
3319
|
-
});
|
|
3320
|
-
return componentToken;
|
|
3321
|
-
});
|
|
3322
|
-
return null;
|
|
3323
|
-
};
|
|
3324
|
-
var useCSSVar = function useCSSVar(rootCls) {
|
|
3325
|
-
var _useToken2 = useToken(),
|
|
3326
|
-
cssVar = _useToken2.cssVar;
|
|
3327
|
-
return [function (node) {
|
|
3328
|
-
return injectStyle && cssVar ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CSSVarRegister, {
|
|
3329
|
-
rootCls: rootCls,
|
|
3330
|
-
cssVar: cssVar,
|
|
3331
|
-
component: component
|
|
3332
|
-
}), node) : node;
|
|
3333
|
-
}, cssVar === null || cssVar === void 0 ? void 0 : cssVar.key];
|
|
3334
|
-
};
|
|
3335
|
-
return useCSSVar;
|
|
3336
|
-
}
|
|
3337
|
-
function genComponentStyleHook(componentName, styleFn, getDefaultToken) {
|
|
3338
|
-
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
3339
|
-
var cells = Array.isArray(componentName) ? componentName : [componentName, componentName];
|
|
3340
|
-
var _cells = _slicedToArray(cells, 1),
|
|
3341
|
-
component = _cells[0];
|
|
3342
|
-
var concatComponent = cells.join('-');
|
|
3343
|
-
var mergedLayer = config.layer || {
|
|
3344
|
-
name: 'antd'
|
|
3345
|
-
};
|
|
3346
|
-
|
|
3347
|
-
// Return new style hook
|
|
3348
|
-
return function (prefixCls) {
|
|
3349
|
-
var rootCls = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : prefixCls;
|
|
3350
|
-
var _useToken3 = useToken(),
|
|
3351
|
-
theme = _useToken3.theme,
|
|
3352
|
-
realToken = _useToken3.realToken,
|
|
3353
|
-
hashId = _useToken3.hashId,
|
|
3354
|
-
token = _useToken3.token,
|
|
3355
|
-
cssVar = _useToken3.cssVar;
|
|
3356
|
-
var _usePrefix = usePrefix(),
|
|
3357
|
-
rootPrefixCls = _usePrefix.rootPrefixCls,
|
|
3358
|
-
iconPrefixCls = _usePrefix.iconPrefixCls;
|
|
3359
|
-
var csp = useCSP();
|
|
3360
|
-
var type = cssVar ? 'css' : 'js';
|
|
3361
|
-
|
|
3362
|
-
// Use unique memo to share the result across all instances
|
|
3363
|
-
var calc = useUniqueMemo(function () {
|
|
3364
|
-
var unitlessCssVar = new Set();
|
|
3365
|
-
if (cssVar) {
|
|
3366
|
-
Object.keys(options.unitless || {}).forEach(function (key) {
|
|
3367
|
-
// Some component proxy the AliasToken (e.g. Image) and some not (e.g. Modal)
|
|
3368
|
-
// We should both pass in `unitlessCssVar` to make sure the CSSVar can be unitless.
|
|
3369
|
-
unitlessCssVar.add(token2CSSVar(key, cssVar.prefix));
|
|
3370
|
-
unitlessCssVar.add(token2CSSVar(key, getCompVarPrefix(component, cssVar.prefix)));
|
|
3371
|
-
});
|
|
3372
|
-
}
|
|
3373
|
-
return genCalc(type, unitlessCssVar);
|
|
3374
|
-
}, [type, component, cssVar === null || cssVar === void 0 ? void 0 : cssVar.prefix]);
|
|
3375
|
-
var _genMaxMin = genMaxMin(type),
|
|
3376
|
-
max = _genMaxMin.max,
|
|
3377
|
-
min = _genMaxMin.min;
|
|
3378
|
-
|
|
3379
|
-
// Shared config
|
|
3380
|
-
var sharedConfig = {
|
|
3381
|
-
theme: theme,
|
|
3382
|
-
token: token,
|
|
3383
|
-
hashId: hashId,
|
|
3384
|
-
nonce: function nonce() {
|
|
3385
|
-
return csp.nonce;
|
|
3386
|
-
},
|
|
3387
|
-
clientOnly: options.clientOnly,
|
|
3388
|
-
layer: mergedLayer,
|
|
3389
|
-
// antd is always at top of styles
|
|
3390
|
-
order: options.order || -999
|
|
3391
|
-
};
|
|
3392
|
-
|
|
3393
|
-
// This if statement is safe, as it will only be used if the generator has the function. It's not dynamic.
|
|
3394
|
-
if (typeof getResetStyles === 'function') {
|
|
3395
|
-
// Generate style for all need reset tags.
|
|
3396
|
-
useStyleRegister(_objectSpread2(_objectSpread2({}, sharedConfig), {}, {
|
|
3397
|
-
clientOnly: false,
|
|
3398
|
-
path: ['Shared', rootPrefixCls]
|
|
3399
|
-
}), function () {
|
|
3400
|
-
return getResetStyles(token, {
|
|
3401
|
-
prefix: {
|
|
3402
|
-
rootPrefixCls: rootPrefixCls,
|
|
3403
|
-
iconPrefixCls: iconPrefixCls
|
|
3404
|
-
},
|
|
3405
|
-
csp: csp
|
|
3406
|
-
});
|
|
3407
|
-
});
|
|
3408
|
-
}
|
|
3409
|
-
var wrapSSR = useStyleRegister(_objectSpread2(_objectSpread2({}, sharedConfig), {}, {
|
|
3410
|
-
path: [concatComponent, prefixCls, iconPrefixCls]
|
|
3411
|
-
}), function () {
|
|
3412
|
-
if (options.injectStyle === false) {
|
|
3413
|
-
return [];
|
|
3414
|
-
}
|
|
3415
|
-
var _statisticToken = statisticToken(token),
|
|
3416
|
-
proxyToken = _statisticToken.token,
|
|
3417
|
-
flush = _statisticToken.flush;
|
|
3418
|
-
var defaultComponentToken = getDefaultComponentToken(component, realToken, getDefaultToken);
|
|
3419
|
-
var componentCls = ".".concat(prefixCls);
|
|
3420
|
-
var componentToken = getComponentToken(component, realToken, defaultComponentToken, {
|
|
3421
|
-
deprecatedTokens: options.deprecatedTokens
|
|
3422
|
-
});
|
|
3423
|
-
if (cssVar && defaultComponentToken && _typeof(defaultComponentToken) === 'object') {
|
|
3424
|
-
Object.keys(defaultComponentToken).forEach(function (key) {
|
|
3425
|
-
defaultComponentToken[key] = "var(".concat(token2CSSVar(key, getCompVarPrefix(component, cssVar.prefix)), ")");
|
|
3426
|
-
});
|
|
3427
|
-
}
|
|
3428
|
-
var mergedToken = merge(proxyToken, {
|
|
3429
|
-
componentCls: componentCls,
|
|
3430
|
-
prefixCls: prefixCls,
|
|
3431
|
-
iconCls: ".".concat(iconPrefixCls),
|
|
3432
|
-
antCls: ".".concat(rootPrefixCls),
|
|
3433
|
-
calc: calc,
|
|
3434
|
-
// @ts-ignore
|
|
3435
|
-
max: max,
|
|
3436
|
-
// @ts-ignore
|
|
3437
|
-
min: min
|
|
3438
|
-
}, cssVar ? defaultComponentToken : componentToken);
|
|
3439
|
-
var styleInterpolation = styleFn(mergedToken, {
|
|
3440
|
-
hashId: hashId,
|
|
3441
|
-
prefixCls: prefixCls,
|
|
3442
|
-
rootPrefixCls: rootPrefixCls,
|
|
3443
|
-
iconPrefixCls: iconPrefixCls
|
|
3444
|
-
});
|
|
3445
|
-
flush(component, componentToken);
|
|
3446
|
-
var commonStyle = typeof getCommonStyle === 'function' ? getCommonStyle(mergedToken, prefixCls, rootCls, options.resetFont) : null;
|
|
3447
|
-
return [options.resetStyle === false ? null : commonStyle, styleInterpolation];
|
|
3448
|
-
});
|
|
3449
|
-
return [wrapSSR, hashId];
|
|
3450
|
-
};
|
|
3451
|
-
}
|
|
3452
|
-
function genSubStyleComponent(componentName, styleFn, getDefaultToken) {
|
|
3453
|
-
var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
3454
|
-
var useStyle = genComponentStyleHook(componentName, styleFn, getDefaultToken, _objectSpread2({
|
|
3455
|
-
resetStyle: false,
|
|
3456
|
-
// Sub Style should default after root one
|
|
3457
|
-
order: -998
|
|
3458
|
-
}, options));
|
|
3459
|
-
var StyledComponent = function StyledComponent(_ref2) {
|
|
3460
|
-
var prefixCls = _ref2.prefixCls,
|
|
3461
|
-
_ref2$rootCls = _ref2.rootCls,
|
|
3462
|
-
rootCls = _ref2$rootCls === void 0 ? prefixCls : _ref2$rootCls;
|
|
3463
|
-
useStyle(prefixCls, rootCls);
|
|
3464
|
-
return null;
|
|
3465
|
-
};
|
|
3466
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
3467
|
-
StyledComponent.displayName = "SubStyle_".concat(String(Array.isArray(componentName) ? componentName.join('.') : componentName));
|
|
3468
|
-
}
|
|
3469
|
-
return StyledComponent;
|
|
3470
|
-
}
|
|
3471
|
-
return {
|
|
3472
|
-
genStyleHooks: genStyleHooks,
|
|
3473
|
-
genSubStyleComponent: genSubStyleComponent,
|
|
3474
|
-
genComponentStyleHook: genComponentStyleHook
|
|
3475
|
-
};
|
|
3476
|
-
}
|
|
3477
|
-
|
|
3478
|
-
const version = '5.25.3';
|
|
3479
|
-
|
|
3480
|
-
function isStableColor(color) {
|
|
3481
|
-
return color >= 0 && color <= 255;
|
|
3482
|
-
}
|
|
3483
|
-
function getAlphaColor(frontColor, backgroundColor) {
|
|
3484
|
-
const {
|
|
3485
|
-
r: fR,
|
|
3486
|
-
g: fG,
|
|
3487
|
-
b: fB,
|
|
3488
|
-
a: originAlpha
|
|
3489
|
-
} = new FastColor(frontColor).toRgb();
|
|
3490
|
-
if (originAlpha < 1) {
|
|
3491
|
-
return frontColor;
|
|
3492
|
-
}
|
|
3493
|
-
const {
|
|
3494
|
-
r: bR,
|
|
3495
|
-
g: bG,
|
|
3496
|
-
b: bB
|
|
3497
|
-
} = new FastColor(backgroundColor).toRgb();
|
|
3498
|
-
for (let fA = 0.01; fA <= 1; fA += 0.01) {
|
|
3499
|
-
const r = Math.round((fR - bR * (1 - fA)) / fA);
|
|
3500
|
-
const g = Math.round((fG - bG * (1 - fA)) / fA);
|
|
3501
|
-
const b = Math.round((fB - bB * (1 - fA)) / fA);
|
|
3502
|
-
if (isStableColor(r) && isStableColor(g) && isStableColor(b)) {
|
|
3503
|
-
return new FastColor({
|
|
3504
|
-
r,
|
|
3505
|
-
g,
|
|
3506
|
-
b,
|
|
3507
|
-
a: Math.round(fA * 100) / 100
|
|
3508
|
-
}).toRgbString();
|
|
3509
|
-
}
|
|
3510
|
-
}
|
|
3511
|
-
// fallback
|
|
3512
|
-
/* istanbul ignore next */
|
|
3513
|
-
return new FastColor({
|
|
3514
|
-
r: fR,
|
|
3515
|
-
g: fG,
|
|
3516
|
-
b: fB,
|
|
3517
|
-
a: 1
|
|
3518
|
-
}).toRgbString();
|
|
3519
|
-
}
|
|
3520
|
-
|
|
3521
|
-
var __rest$4 = undefined && undefined.__rest || function (s, e) {
|
|
3522
|
-
var t = {};
|
|
3523
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
3524
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
3525
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
3526
|
-
}
|
|
3527
|
-
return t;
|
|
3528
|
-
};
|
|
3529
|
-
/**
|
|
3530
|
-
* Seed (designer) > Derivative (designer) > Alias (developer).
|
|
3531
|
-
*
|
|
3532
|
-
* Merge seed & derivative & override token and generate alias token for developer.
|
|
3533
|
-
*/
|
|
3534
|
-
function formatToken(derivativeToken) {
|
|
3535
|
-
const {
|
|
3536
|
-
override
|
|
3537
|
-
} = derivativeToken,
|
|
3538
|
-
restToken = __rest$4(derivativeToken, ["override"]);
|
|
3539
|
-
const overrideTokens = Object.assign({}, override);
|
|
3540
|
-
Object.keys(seedToken).forEach(token => {
|
|
3541
|
-
delete overrideTokens[token];
|
|
3542
|
-
});
|
|
3543
|
-
const mergedToken = Object.assign(Object.assign({}, restToken), overrideTokens);
|
|
3544
|
-
const screenXS = 480;
|
|
3545
|
-
const screenSM = 576;
|
|
3546
|
-
const screenMD = 768;
|
|
3547
|
-
const screenLG = 992;
|
|
3548
|
-
const screenXL = 1200;
|
|
3549
|
-
const screenXXL = 1600;
|
|
3550
|
-
// Motion
|
|
3551
|
-
if (mergedToken.motion === false) {
|
|
3552
|
-
const fastDuration = '0s';
|
|
3553
|
-
mergedToken.motionDurationFast = fastDuration;
|
|
3554
|
-
mergedToken.motionDurationMid = fastDuration;
|
|
3555
|
-
mergedToken.motionDurationSlow = fastDuration;
|
|
3556
|
-
}
|
|
3557
|
-
// Generate alias token
|
|
3558
|
-
const aliasToken = Object.assign(Object.assign(Object.assign({}, mergedToken), {
|
|
3559
|
-
// ============== Background ============== //
|
|
3560
|
-
colorFillContent: mergedToken.colorFillSecondary,
|
|
3561
|
-
colorFillContentHover: mergedToken.colorFill,
|
|
3562
|
-
colorFillAlter: mergedToken.colorFillQuaternary,
|
|
3563
|
-
colorBgContainerDisabled: mergedToken.colorFillTertiary,
|
|
3564
|
-
// ============== Split ============== //
|
|
3565
|
-
colorBorderBg: mergedToken.colorBgContainer,
|
|
3566
|
-
colorSplit: getAlphaColor(mergedToken.colorBorderSecondary, mergedToken.colorBgContainer),
|
|
3567
|
-
// ============== Text ============== //
|
|
3568
|
-
colorTextPlaceholder: mergedToken.colorTextQuaternary,
|
|
3569
|
-
colorTextDisabled: mergedToken.colorTextQuaternary,
|
|
3570
|
-
colorTextHeading: mergedToken.colorText,
|
|
3571
|
-
colorTextLabel: mergedToken.colorTextSecondary,
|
|
3572
|
-
colorTextDescription: mergedToken.colorTextTertiary,
|
|
3573
|
-
colorTextLightSolid: mergedToken.colorWhite,
|
|
3574
|
-
colorHighlight: mergedToken.colorError,
|
|
3575
|
-
colorBgTextHover: mergedToken.colorFillSecondary,
|
|
3576
|
-
colorBgTextActive: mergedToken.colorFill,
|
|
3577
|
-
colorIcon: mergedToken.colorTextTertiary,
|
|
3578
|
-
colorIconHover: mergedToken.colorText,
|
|
3579
|
-
colorErrorOutline: getAlphaColor(mergedToken.colorErrorBg, mergedToken.colorBgContainer),
|
|
3580
|
-
colorWarningOutline: getAlphaColor(mergedToken.colorWarningBg, mergedToken.colorBgContainer),
|
|
3581
|
-
// Font
|
|
3582
|
-
fontSizeIcon: mergedToken.fontSizeSM,
|
|
3583
|
-
// Line
|
|
3584
|
-
lineWidthFocus: mergedToken.lineWidth * 3,
|
|
3585
|
-
// Control
|
|
3586
|
-
lineWidth: mergedToken.lineWidth,
|
|
3587
|
-
controlOutlineWidth: mergedToken.lineWidth * 2,
|
|
3588
|
-
// Checkbox size and expand icon size
|
|
3589
|
-
controlInteractiveSize: mergedToken.controlHeight / 2,
|
|
3590
|
-
controlItemBgHover: mergedToken.colorFillTertiary,
|
|
3591
|
-
controlItemBgActive: mergedToken.colorPrimaryBg,
|
|
3592
|
-
controlItemBgActiveHover: mergedToken.colorPrimaryBgHover,
|
|
3593
|
-
controlItemBgActiveDisabled: mergedToken.colorFill,
|
|
3594
|
-
controlTmpOutline: mergedToken.colorFillQuaternary,
|
|
3595
|
-
controlOutline: getAlphaColor(mergedToken.colorPrimaryBg, mergedToken.colorBgContainer),
|
|
3596
|
-
lineType: mergedToken.lineType,
|
|
3597
|
-
borderRadius: mergedToken.borderRadius,
|
|
3598
|
-
borderRadiusXS: mergedToken.borderRadiusXS,
|
|
3599
|
-
borderRadiusSM: mergedToken.borderRadiusSM,
|
|
3600
|
-
borderRadiusLG: mergedToken.borderRadiusLG,
|
|
3601
|
-
fontWeightStrong: 600,
|
|
3602
|
-
opacityLoading: 0.65,
|
|
3603
|
-
linkDecoration: 'none',
|
|
3604
|
-
linkHoverDecoration: 'none',
|
|
3605
|
-
linkFocusDecoration: 'none',
|
|
3606
|
-
controlPaddingHorizontal: 12,
|
|
3607
|
-
controlPaddingHorizontalSM: 8,
|
|
3608
|
-
paddingXXS: mergedToken.sizeXXS,
|
|
3609
|
-
paddingXS: mergedToken.sizeXS,
|
|
3610
|
-
paddingSM: mergedToken.sizeSM,
|
|
3611
|
-
padding: mergedToken.size,
|
|
3612
|
-
paddingMD: mergedToken.sizeMD,
|
|
3613
|
-
paddingLG: mergedToken.sizeLG,
|
|
3614
|
-
paddingXL: mergedToken.sizeXL,
|
|
3615
|
-
paddingContentHorizontalLG: mergedToken.sizeLG,
|
|
3616
|
-
paddingContentVerticalLG: mergedToken.sizeMS,
|
|
3617
|
-
paddingContentHorizontal: mergedToken.sizeMS,
|
|
3618
|
-
paddingContentVertical: mergedToken.sizeSM,
|
|
3619
|
-
paddingContentHorizontalSM: mergedToken.size,
|
|
3620
|
-
paddingContentVerticalSM: mergedToken.sizeXS,
|
|
3621
|
-
marginXXS: mergedToken.sizeXXS,
|
|
3622
|
-
marginXS: mergedToken.sizeXS,
|
|
3623
|
-
marginSM: mergedToken.sizeSM,
|
|
3624
|
-
margin: mergedToken.size,
|
|
3625
|
-
marginMD: mergedToken.sizeMD,
|
|
3626
|
-
marginLG: mergedToken.sizeLG,
|
|
3627
|
-
marginXL: mergedToken.sizeXL,
|
|
3628
|
-
marginXXL: mergedToken.sizeXXL,
|
|
3629
|
-
boxShadow: `
|
|
3630
|
-
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
3631
|
-
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
3632
|
-
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
3633
|
-
`,
|
|
3634
|
-
boxShadowSecondary: `
|
|
3635
|
-
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
3636
|
-
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
3637
|
-
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
3638
|
-
`,
|
|
3639
|
-
boxShadowTertiary: `
|
|
3640
|
-
0 1px 2px 0 rgba(0, 0, 0, 0.03),
|
|
3641
|
-
0 1px 6px -1px rgba(0, 0, 0, 0.02),
|
|
3642
|
-
0 2px 4px 0 rgba(0, 0, 0, 0.02)
|
|
3643
|
-
`,
|
|
3644
|
-
screenXS,
|
|
3645
|
-
screenXSMin: screenXS,
|
|
3646
|
-
screenXSMax: screenSM - 1,
|
|
3647
|
-
screenSM,
|
|
3648
|
-
screenSMMin: screenSM,
|
|
3649
|
-
screenSMMax: screenMD - 1,
|
|
3650
|
-
screenMD,
|
|
3651
|
-
screenMDMin: screenMD,
|
|
3652
|
-
screenMDMax: screenLG - 1,
|
|
3653
|
-
screenLG,
|
|
3654
|
-
screenLGMin: screenLG,
|
|
3655
|
-
screenLGMax: screenXL - 1,
|
|
3656
|
-
screenXL,
|
|
3657
|
-
screenXLMin: screenXL,
|
|
3658
|
-
screenXLMax: screenXXL - 1,
|
|
3659
|
-
screenXXL,
|
|
3660
|
-
screenXXLMin: screenXXL,
|
|
3661
|
-
boxShadowPopoverArrow: '2px 2px 5px rgba(0, 0, 0, 0.05)',
|
|
3662
|
-
boxShadowCard: `
|
|
3663
|
-
0 1px 2px -2px ${new FastColor('rgba(0, 0, 0, 0.16)').toRgbString()},
|
|
3664
|
-
0 3px 6px 0 ${new FastColor('rgba(0, 0, 0, 0.12)').toRgbString()},
|
|
3665
|
-
0 5px 12px 4px ${new FastColor('rgba(0, 0, 0, 0.09)').toRgbString()}
|
|
3666
|
-
`,
|
|
3667
|
-
boxShadowDrawerRight: `
|
|
3668
|
-
-6px 0 16px 0 rgba(0, 0, 0, 0.08),
|
|
3669
|
-
-3px 0 6px -4px rgba(0, 0, 0, 0.12),
|
|
3670
|
-
-9px 0 28px 8px rgba(0, 0, 0, 0.05)
|
|
3671
|
-
`,
|
|
3672
|
-
boxShadowDrawerLeft: `
|
|
3673
|
-
6px 0 16px 0 rgba(0, 0, 0, 0.08),
|
|
3674
|
-
3px 0 6px -4px rgba(0, 0, 0, 0.12),
|
|
3675
|
-
9px 0 28px 8px rgba(0, 0, 0, 0.05)
|
|
3676
|
-
`,
|
|
3677
|
-
boxShadowDrawerUp: `
|
|
3678
|
-
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
3679
|
-
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
3680
|
-
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
3681
|
-
`,
|
|
3682
|
-
boxShadowDrawerDown: `
|
|
3683
|
-
0 -6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
3684
|
-
0 -3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
3685
|
-
0 -9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
3686
|
-
`,
|
|
3687
|
-
boxShadowTabsOverflowLeft: 'inset 10px 0 8px -8px rgba(0, 0, 0, 0.08)',
|
|
3688
|
-
boxShadowTabsOverflowRight: 'inset -10px 0 8px -8px rgba(0, 0, 0, 0.08)',
|
|
3689
|
-
boxShadowTabsOverflowTop: 'inset 0 10px 8px -8px rgba(0, 0, 0, 0.08)',
|
|
3690
|
-
boxShadowTabsOverflowBottom: 'inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08)'
|
|
3691
|
-
}), overrideTokens);
|
|
3692
|
-
return aliasToken;
|
|
3693
|
-
}
|
|
3694
|
-
|
|
3695
|
-
var __rest$3 = undefined && undefined.__rest || function (s, e) {
|
|
3696
|
-
var t = {};
|
|
3697
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
3698
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
3699
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
3700
|
-
}
|
|
3701
|
-
return t;
|
|
3702
|
-
};
|
|
3703
|
-
const unitless = {
|
|
3704
|
-
lineHeight: true,
|
|
3705
|
-
lineHeightSM: true,
|
|
3706
|
-
lineHeightLG: true,
|
|
3707
|
-
lineHeightHeading1: true,
|
|
3708
|
-
lineHeightHeading2: true,
|
|
3709
|
-
lineHeightHeading3: true,
|
|
3710
|
-
lineHeightHeading4: true,
|
|
3711
|
-
lineHeightHeading5: true,
|
|
3712
|
-
opacityLoading: true,
|
|
3713
|
-
fontWeightStrong: true,
|
|
3714
|
-
zIndexPopupBase: true,
|
|
3715
|
-
zIndexBase: true,
|
|
3716
|
-
opacityImage: true
|
|
3717
|
-
};
|
|
3718
|
-
const ignore = {
|
|
3719
|
-
size: true,
|
|
3720
|
-
sizeSM: true,
|
|
3721
|
-
sizeLG: true,
|
|
3722
|
-
sizeMD: true,
|
|
3723
|
-
sizeXS: true,
|
|
3724
|
-
sizeXXS: true,
|
|
3725
|
-
sizeMS: true,
|
|
3726
|
-
sizeXL: true,
|
|
3727
|
-
sizeXXL: true,
|
|
3728
|
-
sizeUnit: true,
|
|
3729
|
-
sizeStep: true,
|
|
3730
|
-
motionBase: true,
|
|
3731
|
-
motionUnit: true
|
|
3732
|
-
};
|
|
3733
|
-
const preserve = {
|
|
3734
|
-
screenXS: true,
|
|
3735
|
-
screenXSMin: true,
|
|
3736
|
-
screenXSMax: true,
|
|
3737
|
-
screenSM: true,
|
|
3738
|
-
screenSMMin: true,
|
|
3739
|
-
screenSMMax: true,
|
|
3740
|
-
screenMD: true,
|
|
3741
|
-
screenMDMin: true,
|
|
3742
|
-
screenMDMax: true,
|
|
3743
|
-
screenLG: true,
|
|
3744
|
-
screenLGMin: true,
|
|
3745
|
-
screenLGMax: true,
|
|
3746
|
-
screenXL: true,
|
|
3747
|
-
screenXLMin: true,
|
|
3748
|
-
screenXLMax: true,
|
|
3749
|
-
screenXXL: true,
|
|
3750
|
-
screenXXLMin: true
|
|
3751
|
-
};
|
|
3752
|
-
const getComputedToken = (originToken, overrideToken, theme) => {
|
|
3753
|
-
const derivativeToken = theme.getDerivativeToken(originToken);
|
|
3754
|
-
const {
|
|
3755
|
-
override
|
|
3756
|
-
} = overrideToken,
|
|
3757
|
-
components = __rest$3(overrideToken, ["override"]);
|
|
3758
|
-
// Merge with override
|
|
3759
|
-
let mergedDerivativeToken = Object.assign(Object.assign({}, derivativeToken), {
|
|
3760
|
-
override
|
|
3761
|
-
});
|
|
3762
|
-
// Format if needed
|
|
3763
|
-
mergedDerivativeToken = formatToken(mergedDerivativeToken);
|
|
3764
|
-
if (components) {
|
|
3765
|
-
Object.entries(components).forEach(([key, value]) => {
|
|
3766
|
-
const {
|
|
3767
|
-
theme: componentTheme
|
|
3768
|
-
} = value,
|
|
3769
|
-
componentTokens = __rest$3(value, ["theme"]);
|
|
3770
|
-
let mergedComponentToken = componentTokens;
|
|
3771
|
-
if (componentTheme) {
|
|
3772
|
-
mergedComponentToken = getComputedToken(Object.assign(Object.assign({}, mergedDerivativeToken), componentTokens), {
|
|
3773
|
-
override: componentTokens
|
|
3774
|
-
}, componentTheme);
|
|
3775
|
-
}
|
|
3776
|
-
mergedDerivativeToken[key] = mergedComponentToken;
|
|
3777
|
-
});
|
|
3778
|
-
}
|
|
3779
|
-
return mergedDerivativeToken;
|
|
3780
|
-
};
|
|
3781
|
-
// ================================== Hook ==================================
|
|
3782
|
-
function useToken() {
|
|
3783
|
-
const {
|
|
3784
|
-
token: rootDesignToken,
|
|
3785
|
-
hashed,
|
|
3786
|
-
theme,
|
|
3787
|
-
override,
|
|
3788
|
-
cssVar
|
|
3789
|
-
} = React__default.useContext(DesignTokenContext);
|
|
3790
|
-
const salt = `${version}-${hashed || ''}`;
|
|
3791
|
-
const mergedTheme = theme || defaultTheme;
|
|
3792
|
-
const [token, hashId, realToken] = useCacheToken(mergedTheme, [seedToken, rootDesignToken], {
|
|
3793
|
-
salt,
|
|
3794
|
-
override,
|
|
3795
|
-
getComputedToken,
|
|
3796
|
-
// formatToken will not be consumed after 1.15.0 with getComputedToken.
|
|
3797
|
-
// But token will break if @ant-design/cssinjs is under 1.15.0 without it
|
|
3798
|
-
formatToken,
|
|
3799
|
-
cssVar: cssVar && {
|
|
3800
|
-
prefix: cssVar.prefix,
|
|
3801
|
-
key: cssVar.key,
|
|
3802
|
-
unitless,
|
|
3803
|
-
ignore,
|
|
3804
|
-
preserve
|
|
3805
|
-
}
|
|
3806
|
-
});
|
|
3807
|
-
return [mergedTheme, realToken, hashed ? hashId : '', token, cssVar];
|
|
3808
|
-
}
|
|
3809
|
-
|
|
3810
|
-
const resetIcon = () => ({
|
|
3811
|
-
display: 'inline-flex',
|
|
3812
|
-
alignItems: 'center',
|
|
3813
|
-
color: 'inherit',
|
|
3814
|
-
fontStyle: 'normal',
|
|
3815
|
-
lineHeight: 0,
|
|
3816
|
-
textAlign: 'center',
|
|
3817
|
-
textTransform: 'none',
|
|
3818
|
-
// for SVG icon, see https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
|
|
3819
|
-
verticalAlign: '-0.125em',
|
|
3820
|
-
textRendering: 'optimizeLegibility',
|
|
3821
|
-
'-webkit-font-smoothing': 'antialiased',
|
|
3822
|
-
'-moz-osx-font-smoothing': 'grayscale',
|
|
3823
|
-
'> *': {
|
|
3824
|
-
lineHeight: 1
|
|
3825
|
-
},
|
|
3826
|
-
svg: {
|
|
3827
|
-
display: 'inline-block'
|
|
3828
|
-
}
|
|
3829
|
-
});
|
|
3830
|
-
const genLinkStyle = token => ({
|
|
3831
|
-
a: {
|
|
3832
|
-
color: token.colorLink,
|
|
3833
|
-
textDecoration: token.linkDecoration,
|
|
3834
|
-
backgroundColor: 'transparent',
|
|
3835
|
-
// remove the gray background on active links in IE 10.
|
|
3836
|
-
outline: 'none',
|
|
3837
|
-
cursor: 'pointer',
|
|
3838
|
-
transition: `color ${token.motionDurationSlow}`,
|
|
3839
|
-
'-webkit-text-decoration-skip': 'objects',
|
|
3840
|
-
// remove gaps in links underline in iOS 8+ and Safari 8+.
|
|
3841
|
-
'&:hover': {
|
|
3842
|
-
color: token.colorLinkHover
|
|
3843
|
-
},
|
|
3844
|
-
'&:active': {
|
|
3845
|
-
color: token.colorLinkActive
|
|
3846
|
-
},
|
|
3847
|
-
'&:active, &:hover': {
|
|
3848
|
-
textDecoration: token.linkHoverDecoration,
|
|
3849
|
-
outline: 0
|
|
3850
|
-
},
|
|
3851
|
-
// https://github.com/ant-design/ant-design/issues/22503
|
|
3852
|
-
'&:focus': {
|
|
3853
|
-
textDecoration: token.linkFocusDecoration,
|
|
3854
|
-
outline: 0
|
|
3855
|
-
},
|
|
3856
|
-
'&[disabled]': {
|
|
3857
|
-
color: token.colorTextDisabled,
|
|
3858
|
-
cursor: 'not-allowed'
|
|
3859
|
-
}
|
|
3860
|
-
}
|
|
3861
|
-
});
|
|
3862
|
-
const genCommonStyle = (token, componentPrefixCls, rootCls, resetFont) => {
|
|
3863
|
-
const prefixSelector = `[class^="${componentPrefixCls}"], [class*=" ${componentPrefixCls}"]`;
|
|
3864
|
-
const rootPrefixSelector = rootCls ? `.${rootCls}` : prefixSelector;
|
|
3865
|
-
const resetStyle = {
|
|
3866
|
-
boxSizing: 'border-box',
|
|
3867
|
-
'&::before, &::after': {
|
|
3868
|
-
boxSizing: 'border-box'
|
|
3869
|
-
}
|
|
3870
|
-
};
|
|
3871
|
-
let resetFontStyle = {};
|
|
3872
|
-
if (resetFont !== false) {
|
|
3873
|
-
resetFontStyle = {
|
|
3874
|
-
fontFamily: token.fontFamily,
|
|
3875
|
-
fontSize: token.fontSize
|
|
3876
|
-
};
|
|
3877
|
-
}
|
|
3878
|
-
return {
|
|
3879
|
-
[rootPrefixSelector]: Object.assign(Object.assign(Object.assign({}, resetFontStyle), resetStyle), {
|
|
3880
|
-
[prefixSelector]: resetStyle
|
|
3881
|
-
})
|
|
3882
|
-
};
|
|
3883
|
-
};
|
|
3884
|
-
const genIconStyle = iconPrefixCls => ({
|
|
3885
|
-
[`.${iconPrefixCls}`]: Object.assign(Object.assign({}, resetIcon()), {
|
|
3886
|
-
[`.${iconPrefixCls} .${iconPrefixCls}-icon`]: {
|
|
3887
|
-
display: 'block'
|
|
3888
|
-
}
|
|
3889
|
-
})
|
|
3890
|
-
});
|
|
3891
|
-
|
|
3892
|
-
const {
|
|
3893
|
-
genStyleHooks} = genStyleUtils({
|
|
3894
|
-
usePrefix: () => {
|
|
3895
|
-
const {
|
|
3896
|
-
getPrefixCls,
|
|
3897
|
-
iconPrefixCls
|
|
3898
|
-
} = useContext(ConfigContext);
|
|
3899
|
-
const rootPrefixCls = getPrefixCls();
|
|
3900
|
-
return {
|
|
3901
|
-
rootPrefixCls,
|
|
3902
|
-
iconPrefixCls
|
|
3903
|
-
};
|
|
3904
|
-
},
|
|
3905
|
-
useToken: () => {
|
|
3906
|
-
const [theme, realToken, hashId, token, cssVar] = useToken();
|
|
3907
|
-
return {
|
|
3908
|
-
theme,
|
|
3909
|
-
realToken,
|
|
3910
|
-
hashId,
|
|
3911
|
-
token,
|
|
3912
|
-
cssVar
|
|
3913
|
-
};
|
|
3914
|
-
},
|
|
3915
|
-
useCSP: () => {
|
|
3916
|
-
const {
|
|
3917
|
-
csp
|
|
3918
|
-
} = useContext(ConfigContext);
|
|
3919
|
-
return csp !== null && csp !== void 0 ? csp : {};
|
|
3920
|
-
},
|
|
3921
|
-
getResetStyles: (token, config) => {
|
|
3922
|
-
var _a;
|
|
3923
|
-
const linkStyle = genLinkStyle(token);
|
|
3924
|
-
return [linkStyle, {
|
|
3925
|
-
'&': linkStyle
|
|
3926
|
-
}, genIconStyle((_a = config === null || config === void 0 ? void 0 : config.prefix.iconPrefixCls) !== null && _a !== void 0 ? _a : defaultIconPrefixCls)];
|
|
3927
|
-
},
|
|
3928
|
-
getCommonStyle: genCommonStyle,
|
|
3929
|
-
getCompUnitless: () => unitless
|
|
3930
|
-
});
|
|
3931
|
-
|
|
3932
|
-
const useResetIconStyle = (iconPrefixCls, csp) => {
|
|
3933
|
-
const [theme, token] = useToken();
|
|
3934
|
-
// Generate style for icons
|
|
3935
|
-
return useStyleRegister({
|
|
3936
|
-
token,
|
|
3937
|
-
hashId: '',
|
|
3938
|
-
path: ['ant-design-icons', iconPrefixCls],
|
|
3939
|
-
nonce: () => csp === null || csp === void 0 ? void 0 : csp.nonce,
|
|
3940
|
-
layer: {
|
|
3941
|
-
name: 'antd'
|
|
3942
|
-
}
|
|
3943
|
-
}, () => [genIconStyle(iconPrefixCls)]);
|
|
3944
|
-
};
|
|
3945
|
-
|
|
3946
|
-
const fullClone = Object.assign({}, React);
|
|
3947
|
-
const {
|
|
3948
|
-
useId
|
|
3949
|
-
} = fullClone;
|
|
3950
|
-
const useEmptyId = () => '';
|
|
3951
|
-
const useThemeKey = typeof useId === 'undefined' ? useEmptyId : useId;
|
|
3952
|
-
|
|
3953
|
-
function useTheme(theme, parentTheme, config) {
|
|
3954
|
-
var _a, _b;
|
|
3955
|
-
const warning = devUseWarning('ConfigProvider');
|
|
3956
|
-
const themeConfig = theme || {};
|
|
3957
|
-
const parentThemeConfig = themeConfig.inherit === false || !parentTheme ? Object.assign(Object.assign({}, defaultConfig), {
|
|
3958
|
-
hashed: (_a = parentTheme === null || parentTheme === void 0 ? void 0 : parentTheme.hashed) !== null && _a !== void 0 ? _a : defaultConfig.hashed,
|
|
3959
|
-
cssVar: parentTheme === null || parentTheme === void 0 ? void 0 : parentTheme.cssVar
|
|
3960
|
-
}) : parentTheme;
|
|
3961
|
-
const themeKey = useThemeKey();
|
|
3962
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
3963
|
-
const cssVarEnabled = themeConfig.cssVar || parentThemeConfig.cssVar;
|
|
3964
|
-
const validKey = !!(typeof themeConfig.cssVar === 'object' && ((_b = themeConfig.cssVar) === null || _b === void 0 ? void 0 : _b.key) || themeKey);
|
|
3965
|
-
process.env.NODE_ENV !== "production" ? warning(!cssVarEnabled || validKey, 'breaking', 'Missing key in `cssVar` config. Please upgrade to React 18 or set `cssVar.key` manually in each ConfigProvider inside `cssVar` enabled ConfigProvider.') : void 0;
|
|
3966
|
-
}
|
|
3967
|
-
return useMemo(() => {
|
|
3968
|
-
var _a, _b;
|
|
3969
|
-
if (!theme) {
|
|
3970
|
-
return parentTheme;
|
|
3971
|
-
}
|
|
3972
|
-
// Override
|
|
3973
|
-
const mergedComponents = Object.assign({}, parentThemeConfig.components);
|
|
3974
|
-
Object.keys(theme.components || {}).forEach(componentName => {
|
|
3975
|
-
mergedComponents[componentName] = Object.assign(Object.assign({}, mergedComponents[componentName]), theme.components[componentName]);
|
|
3976
|
-
});
|
|
3977
|
-
const cssVarKey = `css-var-${themeKey.replace(/:/g, '')}`;
|
|
3978
|
-
const mergedCssVar = ((_a = themeConfig.cssVar) !== null && _a !== void 0 ? _a : parentThemeConfig.cssVar) && Object.assign(Object.assign(Object.assign({
|
|
3979
|
-
prefix: config === null || config === void 0 ? void 0 : config.prefixCls
|
|
3980
|
-
}, typeof parentThemeConfig.cssVar === 'object' ? parentThemeConfig.cssVar : {}), typeof themeConfig.cssVar === 'object' ? themeConfig.cssVar : {}), {
|
|
3981
|
-
key: typeof themeConfig.cssVar === 'object' && ((_b = themeConfig.cssVar) === null || _b === void 0 ? void 0 : _b.key) || cssVarKey
|
|
3982
|
-
});
|
|
3983
|
-
// Base token
|
|
3984
|
-
return Object.assign(Object.assign(Object.assign({}, parentThemeConfig), themeConfig), {
|
|
3985
|
-
token: Object.assign(Object.assign({}, parentThemeConfig.token), themeConfig.token),
|
|
3986
|
-
components: mergedComponents,
|
|
3987
|
-
cssVar: mergedCssVar
|
|
3988
|
-
});
|
|
3989
|
-
}, [themeConfig, parentThemeConfig], (prev, next) => prev.some((prevTheme, index) => {
|
|
3990
|
-
const nextTheme = next[index];
|
|
3991
|
-
return !isEqual(prevTheme, nextTheme, true);
|
|
3992
|
-
}));
|
|
3993
|
-
}
|
|
3994
|
-
|
|
3995
|
-
var _excluded = ["children"];
|
|
3996
|
-
var Context = /*#__PURE__*/React.createContext({});
|
|
3997
|
-
function MotionProvider(_ref) {
|
|
3998
|
-
var children = _ref.children,
|
|
3999
|
-
props = _objectWithoutProperties(_ref, _excluded);
|
|
4000
|
-
return /*#__PURE__*/React.createElement(Context.Provider, {
|
|
4001
|
-
value: props
|
|
4002
|
-
}, children);
|
|
4003
|
-
}
|
|
4004
|
-
|
|
4005
|
-
function MotionWrapper(props) {
|
|
4006
|
-
const {
|
|
4007
|
-
children
|
|
4008
|
-
} = props;
|
|
4009
|
-
const [, token] = useToken();
|
|
4010
|
-
const {
|
|
4011
|
-
motion
|
|
4012
|
-
} = token;
|
|
4013
|
-
const needWrapMotionProviderRef = React.useRef(false);
|
|
4014
|
-
needWrapMotionProviderRef.current = needWrapMotionProviderRef.current || motion === false;
|
|
4015
|
-
if (needWrapMotionProviderRef.current) {
|
|
4016
|
-
return /*#__PURE__*/React.createElement(MotionProvider, {
|
|
4017
|
-
motion: motion
|
|
4018
|
-
}, children);
|
|
4019
|
-
}
|
|
4020
|
-
return children;
|
|
4021
|
-
}
|
|
4022
|
-
|
|
4023
|
-
/**
|
|
4024
|
-
* Warning for ConfigProviderProps.
|
|
4025
|
-
* This will be empty function in production.
|
|
4026
|
-
*/
|
|
4027
|
-
const PropWarning = /*#__PURE__*/React.memo(({
|
|
4028
|
-
dropdownMatchSelectWidth
|
|
4029
|
-
}) => {
|
|
4030
|
-
const warning = devUseWarning('ConfigProvider');
|
|
4031
|
-
warning.deprecated(dropdownMatchSelectWidth === undefined, 'dropdownMatchSelectWidth', 'popupMatchSelectWidth');
|
|
4032
|
-
return null;
|
|
4033
|
-
});
|
|
4034
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4035
|
-
PropWarning.displayName = 'PropWarning';
|
|
4036
|
-
}
|
|
4037
|
-
const PropWarning$1 = process.env.NODE_ENV !== 'production' ? PropWarning : () => null;
|
|
4038
|
-
|
|
4039
|
-
var __rest$2 = undefined && undefined.__rest || function (s, e) {
|
|
4040
|
-
var t = {};
|
|
4041
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
4042
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
4043
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
4044
|
-
}
|
|
4045
|
-
return t;
|
|
4046
|
-
};
|
|
4047
|
-
// These props is used by `useContext` directly in sub component
|
|
4048
|
-
const PASSED_PROPS = ['getTargetContainer', 'getPopupContainer', 'renderEmpty', 'input', 'pagination', 'form', 'select', 'button'];
|
|
4049
|
-
let globalPrefixCls;
|
|
4050
|
-
function getGlobalPrefixCls() {
|
|
4051
|
-
return globalPrefixCls || defaultPrefixCls;
|
|
4052
|
-
}
|
|
4053
|
-
function isLegacyTheme(theme) {
|
|
4054
|
-
return Object.keys(theme).some(key => key.endsWith('Color'));
|
|
4055
|
-
}
|
|
4056
|
-
const setGlobalConfig = props => {
|
|
4057
|
-
const {
|
|
4058
|
-
prefixCls,
|
|
4059
|
-
theme} = props;
|
|
4060
|
-
if (prefixCls !== undefined) {
|
|
4061
|
-
globalPrefixCls = prefixCls;
|
|
4062
|
-
}
|
|
4063
|
-
if (theme) {
|
|
4064
|
-
if (isLegacyTheme(theme)) {
|
|
4065
|
-
process.env.NODE_ENV !== "production" ? warning(false, 'ConfigProvider', '`config` of css variable theme is not work in v5. Please use new `theme` config instead.') : void 0;
|
|
4066
|
-
registerTheme(getGlobalPrefixCls(), theme);
|
|
4067
|
-
}
|
|
4068
|
-
}
|
|
4069
|
-
};
|
|
4070
|
-
const ProviderChildren = props => {
|
|
4071
|
-
const {
|
|
4072
|
-
children,
|
|
4073
|
-
csp: customCsp,
|
|
4074
|
-
autoInsertSpaceInButton,
|
|
4075
|
-
alert,
|
|
4076
|
-
anchor,
|
|
4077
|
-
form,
|
|
4078
|
-
locale,
|
|
4079
|
-
componentSize,
|
|
4080
|
-
direction,
|
|
4081
|
-
space,
|
|
4082
|
-
splitter,
|
|
4083
|
-
virtual,
|
|
4084
|
-
dropdownMatchSelectWidth,
|
|
4085
|
-
popupMatchSelectWidth,
|
|
4086
|
-
popupOverflow,
|
|
4087
|
-
legacyLocale,
|
|
4088
|
-
parentContext,
|
|
4089
|
-
iconPrefixCls: customIconPrefixCls,
|
|
4090
|
-
theme,
|
|
4091
|
-
componentDisabled,
|
|
4092
|
-
segmented,
|
|
4093
|
-
statistic,
|
|
4094
|
-
spin,
|
|
4095
|
-
calendar,
|
|
4096
|
-
carousel,
|
|
4097
|
-
cascader,
|
|
4098
|
-
collapse,
|
|
4099
|
-
typography,
|
|
4100
|
-
checkbox,
|
|
4101
|
-
descriptions,
|
|
4102
|
-
divider,
|
|
4103
|
-
drawer,
|
|
4104
|
-
skeleton,
|
|
4105
|
-
steps,
|
|
4106
|
-
image,
|
|
4107
|
-
layout,
|
|
4108
|
-
list,
|
|
4109
|
-
mentions,
|
|
4110
|
-
modal,
|
|
4111
|
-
progress,
|
|
4112
|
-
result,
|
|
4113
|
-
slider,
|
|
4114
|
-
breadcrumb,
|
|
4115
|
-
menu,
|
|
4116
|
-
pagination,
|
|
4117
|
-
input,
|
|
4118
|
-
textArea,
|
|
4119
|
-
empty,
|
|
4120
|
-
badge,
|
|
4121
|
-
radio,
|
|
4122
|
-
rate,
|
|
4123
|
-
switch: SWITCH,
|
|
4124
|
-
transfer,
|
|
4125
|
-
avatar,
|
|
4126
|
-
message,
|
|
4127
|
-
tag,
|
|
4128
|
-
table,
|
|
4129
|
-
card,
|
|
4130
|
-
tabs,
|
|
4131
|
-
timeline,
|
|
4132
|
-
timePicker,
|
|
4133
|
-
upload,
|
|
4134
|
-
notification,
|
|
4135
|
-
tree,
|
|
4136
|
-
colorPicker,
|
|
4137
|
-
datePicker,
|
|
4138
|
-
rangePicker,
|
|
4139
|
-
flex,
|
|
4140
|
-
wave,
|
|
4141
|
-
dropdown,
|
|
4142
|
-
warning: warningConfig,
|
|
4143
|
-
tour,
|
|
4144
|
-
tooltip,
|
|
4145
|
-
popover,
|
|
4146
|
-
popconfirm,
|
|
4147
|
-
floatButtonGroup,
|
|
4148
|
-
variant,
|
|
4149
|
-
inputNumber,
|
|
4150
|
-
treeSelect
|
|
4151
|
-
} = props;
|
|
4152
|
-
// =================================== Context ===================================
|
|
4153
|
-
const getPrefixCls = React.useCallback((suffixCls, customizePrefixCls) => {
|
|
4154
|
-
const {
|
|
4155
|
-
prefixCls
|
|
4156
|
-
} = props;
|
|
4157
|
-
if (customizePrefixCls) {
|
|
4158
|
-
return customizePrefixCls;
|
|
4159
|
-
}
|
|
4160
|
-
const mergedPrefixCls = prefixCls || parentContext.getPrefixCls('');
|
|
4161
|
-
return suffixCls ? `${mergedPrefixCls}-${suffixCls}` : mergedPrefixCls;
|
|
4162
|
-
}, [parentContext.getPrefixCls, props.prefixCls]);
|
|
4163
|
-
const iconPrefixCls = customIconPrefixCls || parentContext.iconPrefixCls || defaultIconPrefixCls;
|
|
4164
|
-
const csp = customCsp || parentContext.csp;
|
|
4165
|
-
useResetIconStyle(iconPrefixCls, csp);
|
|
4166
|
-
const mergedTheme = useTheme(theme, parentContext.theme, {
|
|
4167
|
-
prefixCls: getPrefixCls('')
|
|
4168
|
-
});
|
|
4169
|
-
const baseConfig = {
|
|
4170
|
-
csp,
|
|
4171
|
-
autoInsertSpaceInButton,
|
|
4172
|
-
alert,
|
|
4173
|
-
anchor,
|
|
4174
|
-
locale: locale || legacyLocale,
|
|
4175
|
-
direction,
|
|
4176
|
-
space,
|
|
4177
|
-
splitter,
|
|
4178
|
-
virtual,
|
|
4179
|
-
popupMatchSelectWidth: popupMatchSelectWidth !== null && popupMatchSelectWidth !== void 0 ? popupMatchSelectWidth : dropdownMatchSelectWidth,
|
|
4180
|
-
popupOverflow,
|
|
4181
|
-
getPrefixCls,
|
|
4182
|
-
iconPrefixCls,
|
|
4183
|
-
theme: mergedTheme,
|
|
4184
|
-
segmented,
|
|
4185
|
-
statistic,
|
|
4186
|
-
spin,
|
|
4187
|
-
calendar,
|
|
4188
|
-
carousel,
|
|
4189
|
-
cascader,
|
|
4190
|
-
collapse,
|
|
4191
|
-
typography,
|
|
4192
|
-
checkbox,
|
|
4193
|
-
descriptions,
|
|
4194
|
-
divider,
|
|
4195
|
-
drawer,
|
|
4196
|
-
skeleton,
|
|
4197
|
-
steps,
|
|
4198
|
-
image,
|
|
4199
|
-
input,
|
|
4200
|
-
textArea,
|
|
4201
|
-
layout,
|
|
4202
|
-
list,
|
|
4203
|
-
mentions,
|
|
4204
|
-
modal,
|
|
4205
|
-
progress,
|
|
4206
|
-
result,
|
|
4207
|
-
slider,
|
|
4208
|
-
breadcrumb,
|
|
4209
|
-
menu,
|
|
4210
|
-
pagination,
|
|
4211
|
-
empty,
|
|
4212
|
-
badge,
|
|
4213
|
-
radio,
|
|
4214
|
-
rate,
|
|
4215
|
-
switch: SWITCH,
|
|
4216
|
-
transfer,
|
|
4217
|
-
avatar,
|
|
4218
|
-
message,
|
|
4219
|
-
tag,
|
|
4220
|
-
table,
|
|
4221
|
-
card,
|
|
4222
|
-
tabs,
|
|
4223
|
-
timeline,
|
|
4224
|
-
timePicker,
|
|
4225
|
-
upload,
|
|
4226
|
-
notification,
|
|
4227
|
-
tree,
|
|
4228
|
-
colorPicker,
|
|
4229
|
-
datePicker,
|
|
4230
|
-
rangePicker,
|
|
4231
|
-
flex,
|
|
4232
|
-
wave,
|
|
4233
|
-
dropdown,
|
|
4234
|
-
warning: warningConfig,
|
|
4235
|
-
tour,
|
|
4236
|
-
tooltip,
|
|
4237
|
-
popover,
|
|
4238
|
-
popconfirm,
|
|
4239
|
-
floatButtonGroup,
|
|
4240
|
-
variant,
|
|
4241
|
-
inputNumber,
|
|
4242
|
-
treeSelect
|
|
4243
|
-
};
|
|
4244
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4245
|
-
const warningFn = devUseWarning('ConfigProvider');
|
|
4246
|
-
warningFn(!('autoInsertSpaceInButton' in props), 'deprecated', '`autoInsertSpaceInButton` is deprecated. Please use `{ button: { autoInsertSpace: boolean }}` instead.');
|
|
4247
|
-
}
|
|
4248
|
-
const config = Object.assign({}, parentContext);
|
|
4249
|
-
Object.keys(baseConfig).forEach(key => {
|
|
4250
|
-
if (baseConfig[key] !== undefined) {
|
|
4251
|
-
config[key] = baseConfig[key];
|
|
4252
|
-
}
|
|
4253
|
-
});
|
|
4254
|
-
// Pass the props used by `useContext` directly with child component.
|
|
4255
|
-
// These props should merged into `config`.
|
|
4256
|
-
PASSED_PROPS.forEach(propName => {
|
|
4257
|
-
const propValue = props[propName];
|
|
4258
|
-
if (propValue) {
|
|
4259
|
-
config[propName] = propValue;
|
|
4260
|
-
}
|
|
4261
|
-
});
|
|
4262
|
-
if (typeof autoInsertSpaceInButton !== 'undefined') {
|
|
4263
|
-
// merge deprecated api
|
|
4264
|
-
config.button = Object.assign({
|
|
4265
|
-
autoInsertSpace: autoInsertSpaceInButton
|
|
4266
|
-
}, config.button);
|
|
4267
|
-
}
|
|
4268
|
-
// https://github.com/ant-design/ant-design/issues/27617
|
|
4269
|
-
const memoedConfig = useMemo(() => config, config, (prevConfig, currentConfig) => {
|
|
4270
|
-
const prevKeys = Object.keys(prevConfig);
|
|
4271
|
-
const currentKeys = Object.keys(currentConfig);
|
|
4272
|
-
return prevKeys.length !== currentKeys.length || prevKeys.some(key => prevConfig[key] !== currentConfig[key]);
|
|
4273
|
-
});
|
|
4274
|
-
const {
|
|
4275
|
-
layer
|
|
4276
|
-
} = React.useContext(StyleContext);
|
|
4277
|
-
const memoIconContextValue = React.useMemo(() => ({
|
|
4278
|
-
prefixCls: iconPrefixCls,
|
|
4279
|
-
csp,
|
|
4280
|
-
layer: layer ? 'antd' : undefined
|
|
4281
|
-
}), [iconPrefixCls, csp, layer]);
|
|
4282
|
-
let childNode = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PropWarning$1, {
|
|
4283
|
-
dropdownMatchSelectWidth: dropdownMatchSelectWidth
|
|
4284
|
-
}), children);
|
|
4285
|
-
const validateMessages = React.useMemo(() => {
|
|
4286
|
-
var _a, _b, _c, _d;
|
|
4287
|
-
return merge$1(((_a = localeValues.Form) === null || _a === void 0 ? void 0 : _a.defaultValidateMessages) || {}, ((_c = (_b = memoedConfig.locale) === null || _b === void 0 ? void 0 : _b.Form) === null || _c === void 0 ? void 0 : _c.defaultValidateMessages) || {}, ((_d = memoedConfig.form) === null || _d === void 0 ? void 0 : _d.validateMessages) || {}, (form === null || form === void 0 ? void 0 : form.validateMessages) || {});
|
|
4288
|
-
}, [memoedConfig, form === null || form === void 0 ? void 0 : form.validateMessages]);
|
|
4289
|
-
if (Object.keys(validateMessages).length > 0) {
|
|
4290
|
-
childNode = /*#__PURE__*/React.createElement(ValidateMessagesContext.Provider, {
|
|
4291
|
-
value: validateMessages
|
|
4292
|
-
}, childNode);
|
|
4293
|
-
}
|
|
4294
|
-
if (locale) {
|
|
4295
|
-
childNode = /*#__PURE__*/React.createElement(LocaleProvider, {
|
|
4296
|
-
locale: locale,
|
|
4297
|
-
_ANT_MARK__: ANT_MARK
|
|
4298
|
-
}, childNode);
|
|
4299
|
-
}
|
|
4300
|
-
{
|
|
4301
|
-
childNode = /*#__PURE__*/React.createElement(IconContext.Provider, {
|
|
4302
|
-
value: memoIconContextValue
|
|
4303
|
-
}, childNode);
|
|
4304
|
-
}
|
|
4305
|
-
if (componentSize) {
|
|
4306
|
-
childNode = /*#__PURE__*/React.createElement(SizeContextProvider, {
|
|
4307
|
-
size: componentSize
|
|
4308
|
-
}, childNode);
|
|
4309
|
-
}
|
|
4310
|
-
// =================================== Motion ===================================
|
|
4311
|
-
childNode = /*#__PURE__*/React.createElement(MotionWrapper, null, childNode);
|
|
4312
|
-
// ================================ Dynamic theme ================================
|
|
4313
|
-
const memoTheme = React.useMemo(() => {
|
|
4314
|
-
const _a = mergedTheme || {},
|
|
4315
|
-
{
|
|
4316
|
-
algorithm,
|
|
4317
|
-
token,
|
|
4318
|
-
components,
|
|
4319
|
-
cssVar
|
|
4320
|
-
} = _a,
|
|
4321
|
-
rest = __rest$2(_a, ["algorithm", "token", "components", "cssVar"]);
|
|
4322
|
-
const themeObj = algorithm && (!Array.isArray(algorithm) || algorithm.length > 0) ? createTheme(algorithm) : defaultTheme;
|
|
4323
|
-
const parsedComponents = {};
|
|
4324
|
-
Object.entries(components || {}).forEach(([componentName, componentToken]) => {
|
|
4325
|
-
const parsedToken = Object.assign({}, componentToken);
|
|
4326
|
-
if ('algorithm' in parsedToken) {
|
|
4327
|
-
if (parsedToken.algorithm === true) {
|
|
4328
|
-
parsedToken.theme = themeObj;
|
|
4329
|
-
} else if (Array.isArray(parsedToken.algorithm) || typeof parsedToken.algorithm === 'function') {
|
|
4330
|
-
parsedToken.theme = createTheme(parsedToken.algorithm);
|
|
4331
|
-
}
|
|
4332
|
-
delete parsedToken.algorithm;
|
|
4333
|
-
}
|
|
4334
|
-
parsedComponents[componentName] = parsedToken;
|
|
4335
|
-
});
|
|
4336
|
-
const mergedToken = Object.assign(Object.assign({}, seedToken), token);
|
|
4337
|
-
return Object.assign(Object.assign({}, rest), {
|
|
4338
|
-
theme: themeObj,
|
|
4339
|
-
token: mergedToken,
|
|
4340
|
-
components: parsedComponents,
|
|
4341
|
-
override: Object.assign({
|
|
4342
|
-
override: mergedToken
|
|
4343
|
-
}, parsedComponents),
|
|
4344
|
-
cssVar: cssVar
|
|
4345
|
-
});
|
|
4346
|
-
}, [mergedTheme]);
|
|
4347
|
-
if (theme) {
|
|
4348
|
-
childNode = /*#__PURE__*/React.createElement(DesignTokenContext.Provider, {
|
|
4349
|
-
value: memoTheme
|
|
4350
|
-
}, childNode);
|
|
4351
|
-
}
|
|
4352
|
-
// ================================== Warning ===================================
|
|
4353
|
-
if (memoedConfig.warning) {
|
|
4354
|
-
childNode = /*#__PURE__*/React.createElement(WarningContext.Provider, {
|
|
4355
|
-
value: memoedConfig.warning
|
|
4356
|
-
}, childNode);
|
|
4357
|
-
}
|
|
4358
|
-
// =================================== Render ===================================
|
|
4359
|
-
if (componentDisabled !== undefined) {
|
|
4360
|
-
childNode = /*#__PURE__*/React.createElement(DisabledContextProvider, {
|
|
4361
|
-
disabled: componentDisabled
|
|
4362
|
-
}, childNode);
|
|
4363
|
-
}
|
|
4364
|
-
return /*#__PURE__*/React.createElement(ConfigContext.Provider, {
|
|
4365
|
-
value: memoedConfig
|
|
4366
|
-
}, childNode);
|
|
4367
|
-
};
|
|
4368
|
-
const ConfigProvider = props => {
|
|
4369
|
-
const context = React.useContext(ConfigContext);
|
|
4370
|
-
const antLocale = React.useContext(LocaleContext);
|
|
4371
|
-
return /*#__PURE__*/React.createElement(ProviderChildren, Object.assign({
|
|
4372
|
-
parentContext: context,
|
|
4373
|
-
legacyLocale: antLocale
|
|
4374
|
-
}, props));
|
|
4375
|
-
};
|
|
4376
|
-
ConfigProvider.ConfigContext = ConfigContext;
|
|
4377
|
-
ConfigProvider.SizeContext = SizeContext;
|
|
4378
|
-
ConfigProvider.config = setGlobalConfig;
|
|
4379
|
-
ConfigProvider.useConfig = useConfig;
|
|
4380
|
-
Object.defineProperty(ConfigProvider, 'SizeContext', {
|
|
4381
|
-
get: () => {
|
|
4382
|
-
process.env.NODE_ENV !== "production" ? warning(false, 'ConfigProvider', 'ConfigProvider.SizeContext is deprecated. Please use `ConfigProvider.useConfig().componentSize` instead.') : void 0;
|
|
4383
|
-
return SizeContext;
|
|
4384
|
-
}
|
|
4385
|
-
});
|
|
4386
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4387
|
-
ConfigProvider.displayName = 'ConfigProvider';
|
|
4388
|
-
}
|
|
4389
|
-
|
|
4390
|
-
const LayoutContext = /*#__PURE__*/React.createContext({
|
|
4391
|
-
siderHook: {
|
|
4392
|
-
addSider: () => null,
|
|
4393
|
-
removeSider: () => null
|
|
4394
|
-
}
|
|
4395
|
-
});
|
|
4396
|
-
|
|
4397
|
-
function toArray(children) {
|
|
4398
|
-
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
4399
|
-
var ret = [];
|
|
4400
|
-
React__default.Children.forEach(children, function (child) {
|
|
4401
|
-
if ((child === undefined || child === null) && !option.keepEmpty) {
|
|
4402
|
-
return;
|
|
4403
|
-
}
|
|
4404
|
-
if (Array.isArray(child)) {
|
|
4405
|
-
ret = ret.concat(toArray(child));
|
|
4406
|
-
} else if (isFragment(child) && child.props) {
|
|
4407
|
-
ret = ret.concat(toArray(child.props.children, option));
|
|
4408
|
-
} else {
|
|
4409
|
-
ret.push(child);
|
|
4410
|
-
}
|
|
4411
|
-
});
|
|
4412
|
-
return ret;
|
|
4413
|
-
}
|
|
4414
|
-
|
|
4415
|
-
const addMediaQueryListener = (mql, handler) => {
|
|
4416
|
-
// Don't delete here, please keep the code compatible
|
|
4417
|
-
if (typeof (mql === null || mql === void 0 ? void 0 : mql.addEventListener) !== 'undefined') {
|
|
4418
|
-
mql.addEventListener('change', handler);
|
|
4419
|
-
} else if (typeof (mql === null || mql === void 0 ? void 0 : mql.addListener) !== 'undefined') {
|
|
4420
|
-
mql.addListener(handler);
|
|
4421
|
-
}
|
|
4422
|
-
};
|
|
4423
|
-
const removeMediaQueryListener = (mql, handler) => {
|
|
4424
|
-
// Don't delete here, please keep the code compatible
|
|
4425
|
-
if (typeof (mql === null || mql === void 0 ? void 0 : mql.removeEventListener) !== 'undefined') {
|
|
4426
|
-
mql.removeEventListener('change', handler);
|
|
4427
|
-
} else if (typeof (mql === null || mql === void 0 ? void 0 : mql.removeListener) !== 'undefined') {
|
|
4428
|
-
mql.removeListener(handler);
|
|
4429
|
-
}
|
|
4430
|
-
};
|
|
4431
|
-
|
|
4432
|
-
const genLayoutStyle = token => {
|
|
4433
|
-
const {
|
|
4434
|
-
antCls,
|
|
4435
|
-
// .ant
|
|
4436
|
-
componentCls,
|
|
4437
|
-
// .ant-layout
|
|
4438
|
-
colorText,
|
|
4439
|
-
footerBg,
|
|
4440
|
-
headerHeight,
|
|
4441
|
-
headerPadding,
|
|
4442
|
-
headerColor,
|
|
4443
|
-
footerPadding,
|
|
4444
|
-
fontSize,
|
|
4445
|
-
bodyBg,
|
|
4446
|
-
headerBg
|
|
4447
|
-
} = token;
|
|
4448
|
-
return {
|
|
4449
|
-
[componentCls]: {
|
|
4450
|
-
display: 'flex',
|
|
4451
|
-
flex: 'auto',
|
|
4452
|
-
flexDirection: 'column',
|
|
4453
|
-
/* fix firefox can't set height smaller than content on flex item */
|
|
4454
|
-
minHeight: 0,
|
|
4455
|
-
background: bodyBg,
|
|
4456
|
-
'&, *': {
|
|
4457
|
-
boxSizing: 'border-box'
|
|
4458
|
-
},
|
|
4459
|
-
[`&${componentCls}-has-sider`]: {
|
|
4460
|
-
flexDirection: 'row',
|
|
4461
|
-
[`> ${componentCls}, > ${componentCls}-content`]: {
|
|
4462
|
-
// https://segmentfault.com/a/1190000019498300
|
|
4463
|
-
width: 0
|
|
4464
|
-
}
|
|
4465
|
-
},
|
|
4466
|
-
[`${componentCls}-header, &${componentCls}-footer`]: {
|
|
4467
|
-
flex: '0 0 auto'
|
|
4468
|
-
},
|
|
4469
|
-
// RTL
|
|
4470
|
-
'&-rtl': {
|
|
4471
|
-
direction: 'rtl'
|
|
4472
|
-
}
|
|
4473
|
-
},
|
|
4474
|
-
// ==================== Header ====================
|
|
4475
|
-
[`${componentCls}-header`]: {
|
|
4476
|
-
height: headerHeight,
|
|
4477
|
-
padding: headerPadding,
|
|
4478
|
-
color: headerColor,
|
|
4479
|
-
lineHeight: unit$1(headerHeight),
|
|
4480
|
-
background: headerBg,
|
|
4481
|
-
// Other components/menu/style/index.less line:686
|
|
4482
|
-
// Integration with header element so menu items have the same height
|
|
4483
|
-
[`${antCls}-menu`]: {
|
|
4484
|
-
lineHeight: 'inherit'
|
|
4485
|
-
}
|
|
4486
|
-
},
|
|
4487
|
-
// ==================== Footer ====================
|
|
4488
|
-
[`${componentCls}-footer`]: {
|
|
4489
|
-
padding: footerPadding,
|
|
4490
|
-
color: colorText,
|
|
4491
|
-
fontSize,
|
|
4492
|
-
background: footerBg
|
|
4493
|
-
},
|
|
4494
|
-
// =================== Content ====================
|
|
4495
|
-
[`${componentCls}-content`]: {
|
|
4496
|
-
flex: 'auto',
|
|
4497
|
-
color: colorText,
|
|
4498
|
-
// fix firefox can't set height smaller than content on flex item
|
|
4499
|
-
minHeight: 0
|
|
4500
|
-
}
|
|
4501
|
-
};
|
|
4502
|
-
};
|
|
4503
|
-
const prepareComponentToken = token => {
|
|
4504
|
-
const {
|
|
4505
|
-
colorBgLayout,
|
|
4506
|
-
controlHeight,
|
|
4507
|
-
controlHeightLG,
|
|
4508
|
-
colorText,
|
|
4509
|
-
controlHeightSM,
|
|
4510
|
-
marginXXS,
|
|
4511
|
-
colorTextLightSolid,
|
|
4512
|
-
colorBgContainer
|
|
4513
|
-
} = token;
|
|
4514
|
-
const paddingInline = controlHeightLG * 1.25;
|
|
4515
|
-
return {
|
|
4516
|
-
// Deprecated
|
|
4517
|
-
colorBgHeader: '#001529',
|
|
4518
|
-
colorBgBody: colorBgLayout,
|
|
4519
|
-
colorBgTrigger: '#002140',
|
|
4520
|
-
bodyBg: colorBgLayout,
|
|
4521
|
-
headerBg: '#001529',
|
|
4522
|
-
headerHeight: controlHeight * 2,
|
|
4523
|
-
headerPadding: `0 ${paddingInline}px`,
|
|
4524
|
-
headerColor: colorText,
|
|
4525
|
-
footerPadding: `${controlHeightSM}px ${paddingInline}px`,
|
|
4526
|
-
footerBg: colorBgLayout,
|
|
4527
|
-
siderBg: '#001529',
|
|
4528
|
-
triggerHeight: controlHeightLG + marginXXS * 2,
|
|
4529
|
-
triggerBg: '#002140',
|
|
4530
|
-
triggerColor: colorTextLightSolid,
|
|
4531
|
-
zeroTriggerWidth: controlHeightLG,
|
|
4532
|
-
zeroTriggerHeight: controlHeightLG,
|
|
4533
|
-
lightSiderBg: colorBgContainer,
|
|
4534
|
-
lightTriggerBg: colorBgContainer,
|
|
4535
|
-
lightTriggerColor: colorText
|
|
4536
|
-
};
|
|
4537
|
-
};
|
|
4538
|
-
// ============================== Export ==============================
|
|
4539
|
-
const DEPRECATED_TOKENS = [['colorBgBody', 'bodyBg'], ['colorBgHeader', 'headerBg'], ['colorBgTrigger', 'triggerBg']];
|
|
4540
|
-
const useStyle$1 = genStyleHooks('Layout', token => [genLayoutStyle(token)], prepareComponentToken, {
|
|
4541
|
-
deprecatedTokens: DEPRECATED_TOKENS
|
|
4542
|
-
});
|
|
4543
|
-
|
|
4544
|
-
const genSiderStyle = token => {
|
|
4545
|
-
const {
|
|
4546
|
-
componentCls,
|
|
4547
|
-
siderBg,
|
|
4548
|
-
motionDurationMid,
|
|
4549
|
-
motionDurationSlow,
|
|
4550
|
-
antCls,
|
|
4551
|
-
triggerHeight,
|
|
4552
|
-
triggerColor,
|
|
4553
|
-
triggerBg,
|
|
4554
|
-
headerHeight,
|
|
4555
|
-
zeroTriggerWidth,
|
|
4556
|
-
zeroTriggerHeight,
|
|
4557
|
-
borderRadiusLG,
|
|
4558
|
-
lightSiderBg,
|
|
4559
|
-
lightTriggerColor,
|
|
4560
|
-
lightTriggerBg,
|
|
4561
|
-
bodyBg
|
|
4562
|
-
} = token;
|
|
4563
|
-
return {
|
|
4564
|
-
[componentCls]: {
|
|
4565
|
-
position: 'relative',
|
|
4566
|
-
// fix firefox can't set width smaller than content on flex item
|
|
4567
|
-
minWidth: 0,
|
|
4568
|
-
background: siderBg,
|
|
4569
|
-
transition: `all ${motionDurationMid}, background 0s`,
|
|
4570
|
-
'&-has-trigger': {
|
|
4571
|
-
paddingBottom: triggerHeight
|
|
4572
|
-
},
|
|
4573
|
-
'&-right': {
|
|
4574
|
-
order: 1
|
|
4575
|
-
},
|
|
4576
|
-
[`${componentCls}-children`]: {
|
|
4577
|
-
height: '100%',
|
|
4578
|
-
// Hack for fixing margin collapse bug
|
|
4579
|
-
// https://github.com/ant-design/ant-design/issues/7967
|
|
4580
|
-
// solution from https://stackoverflow.com/a/33132624/3040605
|
|
4581
|
-
marginTop: -0.1,
|
|
4582
|
-
paddingTop: 0.1,
|
|
4583
|
-
[`${antCls}-menu${antCls}-menu-inline-collapsed`]: {
|
|
4584
|
-
width: 'auto'
|
|
4585
|
-
}
|
|
4586
|
-
},
|
|
4587
|
-
[`&-zero-width ${componentCls}-children`]: {
|
|
4588
|
-
overflow: 'hidden'
|
|
4589
|
-
},
|
|
4590
|
-
[`${componentCls}-trigger`]: {
|
|
4591
|
-
position: 'fixed',
|
|
4592
|
-
bottom: 0,
|
|
4593
|
-
zIndex: 1,
|
|
4594
|
-
height: triggerHeight,
|
|
4595
|
-
color: triggerColor,
|
|
4596
|
-
lineHeight: unit$1(triggerHeight),
|
|
4597
|
-
textAlign: 'center',
|
|
4598
|
-
background: triggerBg,
|
|
4599
|
-
cursor: 'pointer',
|
|
4600
|
-
transition: `all ${motionDurationMid}`
|
|
4601
|
-
},
|
|
4602
|
-
[`${componentCls}-zero-width-trigger`]: {
|
|
4603
|
-
position: 'absolute',
|
|
4604
|
-
top: headerHeight,
|
|
4605
|
-
insetInlineEnd: token.calc(zeroTriggerWidth).mul(-1).equal(),
|
|
4606
|
-
zIndex: 1,
|
|
4607
|
-
width: zeroTriggerWidth,
|
|
4608
|
-
height: zeroTriggerHeight,
|
|
4609
|
-
color: triggerColor,
|
|
4610
|
-
fontSize: token.fontSizeXL,
|
|
4611
|
-
display: 'flex',
|
|
4612
|
-
alignItems: 'center',
|
|
4613
|
-
justifyContent: 'center',
|
|
4614
|
-
background: siderBg,
|
|
4615
|
-
borderRadius: `0 ${unit$1(borderRadiusLG)} ${unit$1(borderRadiusLG)} 0`,
|
|
4616
|
-
cursor: 'pointer',
|
|
4617
|
-
transition: `background ${motionDurationSlow} ease`,
|
|
4618
|
-
'&::after': {
|
|
4619
|
-
position: 'absolute',
|
|
4620
|
-
inset: 0,
|
|
4621
|
-
background: 'transparent',
|
|
4622
|
-
transition: `all ${motionDurationSlow}`,
|
|
4623
|
-
content: '""'
|
|
4624
|
-
},
|
|
4625
|
-
'&:hover::after': {
|
|
4626
|
-
background: `rgba(255, 255, 255, 0.2)`
|
|
4627
|
-
},
|
|
4628
|
-
'&-right': {
|
|
4629
|
-
insetInlineStart: token.calc(zeroTriggerWidth).mul(-1).equal(),
|
|
4630
|
-
borderRadius: `${unit$1(borderRadiusLG)} 0 0 ${unit$1(borderRadiusLG)}`
|
|
4631
|
-
}
|
|
4632
|
-
},
|
|
4633
|
-
// Light
|
|
4634
|
-
'&-light': {
|
|
4635
|
-
background: lightSiderBg,
|
|
4636
|
-
[`${componentCls}-trigger`]: {
|
|
4637
|
-
color: lightTriggerColor,
|
|
4638
|
-
background: lightTriggerBg
|
|
4639
|
-
},
|
|
4640
|
-
[`${componentCls}-zero-width-trigger`]: {
|
|
4641
|
-
color: lightTriggerColor,
|
|
4642
|
-
background: lightTriggerBg,
|
|
4643
|
-
border: `1px solid ${bodyBg}`,
|
|
4644
|
-
// Safe to modify to any other color
|
|
4645
|
-
borderInlineStart: 0
|
|
4646
|
-
}
|
|
4647
|
-
}
|
|
4648
|
-
}
|
|
4649
|
-
};
|
|
4650
|
-
};
|
|
4651
|
-
const useStyle = genStyleHooks(['Layout', 'Sider'], token => [genSiderStyle(token)], prepareComponentToken, {
|
|
4652
|
-
deprecatedTokens: DEPRECATED_TOKENS
|
|
4653
|
-
});
|
|
4654
|
-
|
|
4655
|
-
var __rest$1 = undefined && undefined.__rest || function (s, e) {
|
|
4656
|
-
var t = {};
|
|
4657
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
4658
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
4659
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
4660
|
-
}
|
|
4661
|
-
return t;
|
|
4662
|
-
};
|
|
4663
|
-
const dimensionMaxMap = {
|
|
4664
|
-
xs: '479.98px',
|
|
4665
|
-
sm: '575.98px',
|
|
4666
|
-
md: '767.98px',
|
|
4667
|
-
lg: '991.98px',
|
|
4668
|
-
xl: '1199.98px',
|
|
4669
|
-
xxl: '1599.98px'
|
|
4670
|
-
};
|
|
4671
|
-
const isNumeric = value => !Number.isNaN(Number.parseFloat(value)) && isFinite(value);
|
|
4672
|
-
const SiderContext = /*#__PURE__*/React.createContext({});
|
|
4673
|
-
const generateId = (() => {
|
|
4674
|
-
let i = 0;
|
|
4675
|
-
return (prefix = '') => {
|
|
4676
|
-
i += 1;
|
|
4677
|
-
return `${prefix}${i}`;
|
|
4678
|
-
};
|
|
4679
|
-
})();
|
|
4680
|
-
const Sider = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
4681
|
-
const {
|
|
4682
|
-
prefixCls: customizePrefixCls,
|
|
4683
|
-
className: className$1,
|
|
4684
|
-
trigger,
|
|
4685
|
-
children,
|
|
4686
|
-
defaultCollapsed = false,
|
|
4687
|
-
theme = 'dark',
|
|
4688
|
-
style = {},
|
|
4689
|
-
collapsible = false,
|
|
4690
|
-
reverseArrow = false,
|
|
4691
|
-
width = 200,
|
|
4692
|
-
collapsedWidth = 80,
|
|
4693
|
-
zeroWidthTriggerStyle,
|
|
4694
|
-
breakpoint,
|
|
4695
|
-
onCollapse,
|
|
4696
|
-
onBreakpoint
|
|
4697
|
-
} = props,
|
|
4698
|
-
otherProps = __rest$1(props, ["prefixCls", "className", "trigger", "children", "defaultCollapsed", "theme", "style", "collapsible", "reverseArrow", "width", "collapsedWidth", "zeroWidthTriggerStyle", "breakpoint", "onCollapse", "onBreakpoint"]);
|
|
4699
|
-
const {
|
|
4700
|
-
siderHook
|
|
4701
|
-
} = useContext(LayoutContext);
|
|
4702
|
-
const [collapsed, setCollapsed] = useState('collapsed' in props ? props.collapsed : defaultCollapsed);
|
|
4703
|
-
const [below, setBelow] = useState(false);
|
|
4704
|
-
useEffect(() => {
|
|
4705
|
-
if ('collapsed' in props) {
|
|
4706
|
-
setCollapsed(props.collapsed);
|
|
4707
|
-
}
|
|
4708
|
-
}, [props.collapsed]);
|
|
4709
|
-
const handleSetCollapsed = (value, type) => {
|
|
4710
|
-
if (!('collapsed' in props)) {
|
|
4711
|
-
setCollapsed(value);
|
|
4712
|
-
}
|
|
4713
|
-
onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse(value, type);
|
|
4714
|
-
};
|
|
4715
|
-
// =========================== Prefix ===========================
|
|
4716
|
-
const {
|
|
4717
|
-
getPrefixCls,
|
|
4718
|
-
direction
|
|
4719
|
-
} = useContext(ConfigContext);
|
|
4720
|
-
const prefixCls = getPrefixCls('layout-sider', customizePrefixCls);
|
|
4721
|
-
const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
|
|
4722
|
-
// ========================= Responsive =========================
|
|
4723
|
-
const responsiveHandlerRef = useRef(null);
|
|
4724
|
-
responsiveHandlerRef.current = mql => {
|
|
4725
|
-
setBelow(mql.matches);
|
|
4726
|
-
onBreakpoint === null || onBreakpoint === void 0 ? void 0 : onBreakpoint(mql.matches);
|
|
4727
|
-
if (collapsed !== mql.matches) {
|
|
4728
|
-
handleSetCollapsed(mql.matches, 'responsive');
|
|
4729
|
-
}
|
|
4730
|
-
};
|
|
4731
|
-
useEffect(() => {
|
|
4732
|
-
function responsiveHandler(mql) {
|
|
4733
|
-
var _a;
|
|
4734
|
-
return (_a = responsiveHandlerRef.current) === null || _a === void 0 ? void 0 : _a.call(responsiveHandlerRef, mql);
|
|
4735
|
-
}
|
|
4736
|
-
let mql;
|
|
4737
|
-
if (typeof (window === null || window === void 0 ? void 0 : window.matchMedia) !== 'undefined' && breakpoint && breakpoint in dimensionMaxMap) {
|
|
4738
|
-
mql = window.matchMedia(`screen and (max-width: ${dimensionMaxMap[breakpoint]})`);
|
|
4739
|
-
addMediaQueryListener(mql, responsiveHandler);
|
|
4740
|
-
responsiveHandler(mql);
|
|
4741
|
-
}
|
|
4742
|
-
return () => {
|
|
4743
|
-
removeMediaQueryListener(mql, responsiveHandler);
|
|
4744
|
-
};
|
|
4745
|
-
}, [breakpoint]); // in order to accept dynamic 'breakpoint' property, we need to add 'breakpoint' into dependency array.
|
|
4746
|
-
useEffect(() => {
|
|
4747
|
-
const uniqueId = generateId('ant-sider-');
|
|
4748
|
-
siderHook.addSider(uniqueId);
|
|
4749
|
-
return () => siderHook.removeSider(uniqueId);
|
|
4750
|
-
}, []);
|
|
4751
|
-
const toggle = () => {
|
|
4752
|
-
handleSetCollapsed(!collapsed, 'clickTrigger');
|
|
4753
|
-
};
|
|
4754
|
-
const divProps = omit(otherProps, ['collapsed']);
|
|
4755
|
-
const rawWidth = collapsed ? collapsedWidth : width;
|
|
4756
|
-
// use "px" as fallback unit for width
|
|
4757
|
-
const siderWidth = isNumeric(rawWidth) ? `${rawWidth}px` : String(rawWidth);
|
|
4758
|
-
// special trigger when collapsedWidth == 0
|
|
4759
|
-
const zeroWidthTrigger = parseFloat(String(collapsedWidth || 0)) === 0 ? (/*#__PURE__*/React.createElement("span", {
|
|
4760
|
-
onClick: toggle,
|
|
4761
|
-
className: className(`${prefixCls}-zero-width-trigger`, `${prefixCls}-zero-width-trigger-${reverseArrow ? 'right' : 'left'}`),
|
|
4762
|
-
style: zeroWidthTriggerStyle
|
|
4763
|
-
}, trigger || /*#__PURE__*/React.createElement(RefIcon$2, null))) : null;
|
|
4764
|
-
const reverseIcon = direction === 'rtl' === !reverseArrow;
|
|
4765
|
-
const iconObj = {
|
|
4766
|
-
expanded: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon, null) : /*#__PURE__*/React.createElement(RefIcon$1, null),
|
|
4767
|
-
collapsed: reverseIcon ? /*#__PURE__*/React.createElement(RefIcon$1, null) : /*#__PURE__*/React.createElement(RefIcon, null)
|
|
4768
|
-
};
|
|
4769
|
-
const status = collapsed ? 'collapsed' : 'expanded';
|
|
4770
|
-
const defaultTrigger = iconObj[status];
|
|
4771
|
-
const triggerDom = trigger !== null ? zeroWidthTrigger || (/*#__PURE__*/React.createElement("div", {
|
|
4772
|
-
className: `${prefixCls}-trigger`,
|
|
4773
|
-
onClick: toggle,
|
|
4774
|
-
style: {
|
|
4775
|
-
width: siderWidth
|
|
4776
|
-
}
|
|
4777
|
-
}, trigger || defaultTrigger)) : null;
|
|
4778
|
-
const divStyle = Object.assign(Object.assign({}, style), {
|
|
4779
|
-
flex: `0 0 ${siderWidth}`,
|
|
4780
|
-
maxWidth: siderWidth,
|
|
4781
|
-
minWidth: siderWidth,
|
|
4782
|
-
width: siderWidth
|
|
4783
|
-
});
|
|
4784
|
-
const siderCls = className(prefixCls, `${prefixCls}-${theme}`, {
|
|
4785
|
-
[`${prefixCls}-collapsed`]: !!collapsed,
|
|
4786
|
-
[`${prefixCls}-has-trigger`]: collapsible && trigger !== null && !zeroWidthTrigger,
|
|
4787
|
-
[`${prefixCls}-below`]: !!below,
|
|
4788
|
-
[`${prefixCls}-zero-width`]: parseFloat(siderWidth) === 0
|
|
4789
|
-
}, className$1, hashId, cssVarCls);
|
|
4790
|
-
const contextValue = React.useMemo(() => ({
|
|
4791
|
-
siderCollapsed: collapsed
|
|
4792
|
-
}), [collapsed]);
|
|
4793
|
-
return wrapCSSVar(/*#__PURE__*/React.createElement(SiderContext.Provider, {
|
|
4794
|
-
value: contextValue
|
|
4795
|
-
}, /*#__PURE__*/React.createElement("aside", Object.assign({
|
|
4796
|
-
className: siderCls
|
|
4797
|
-
}, divProps, {
|
|
4798
|
-
style: divStyle,
|
|
4799
|
-
ref: ref
|
|
4800
|
-
}), /*#__PURE__*/React.createElement("div", {
|
|
4801
|
-
className: `${prefixCls}-children`
|
|
4802
|
-
}, children), collapsible || below && zeroWidthTrigger ? triggerDom : null)));
|
|
4803
|
-
});
|
|
4804
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4805
|
-
Sider.displayName = 'Sider';
|
|
4806
|
-
}
|
|
4807
|
-
|
|
4808
|
-
function useHasSider(siders, children, hasSider) {
|
|
4809
|
-
if (typeof hasSider === 'boolean') {
|
|
4810
|
-
return hasSider;
|
|
4811
|
-
}
|
|
4812
|
-
if (siders.length) {
|
|
4813
|
-
return true;
|
|
4814
|
-
}
|
|
4815
|
-
const childNodes = toArray(children);
|
|
4816
|
-
return childNodes.some(node => node.type === Sider);
|
|
4817
|
-
}
|
|
4818
|
-
|
|
4819
|
-
var __rest = undefined && undefined.__rest || function (s, e) {
|
|
4820
|
-
var t = {};
|
|
4821
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
4822
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
4823
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
4824
|
-
}
|
|
4825
|
-
return t;
|
|
4826
|
-
};
|
|
4827
|
-
function generator({
|
|
4828
|
-
suffixCls,
|
|
4829
|
-
tagName,
|
|
4830
|
-
displayName
|
|
4831
|
-
}) {
|
|
4832
|
-
return BasicComponent => {
|
|
4833
|
-
const Adapter = /*#__PURE__*/React.forwardRef((props, ref) => (/*#__PURE__*/React.createElement(BasicComponent, Object.assign({
|
|
4834
|
-
ref: ref,
|
|
4835
|
-
suffixCls: suffixCls,
|
|
4836
|
-
tagName: tagName
|
|
4837
|
-
}, props))));
|
|
4838
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4839
|
-
Adapter.displayName = displayName;
|
|
4840
|
-
}
|
|
4841
|
-
return Adapter;
|
|
4842
|
-
};
|
|
4843
|
-
}
|
|
4844
|
-
const Basic = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
4845
|
-
const {
|
|
4846
|
-
prefixCls: customizePrefixCls,
|
|
4847
|
-
suffixCls,
|
|
4848
|
-
className: className$1,
|
|
4849
|
-
tagName: TagName
|
|
4850
|
-
} = props,
|
|
4851
|
-
others = __rest(props, ["prefixCls", "suffixCls", "className", "tagName"]);
|
|
4852
|
-
const {
|
|
4853
|
-
getPrefixCls
|
|
4854
|
-
} = React.useContext(ConfigContext);
|
|
4855
|
-
const prefixCls = getPrefixCls('layout', customizePrefixCls);
|
|
4856
|
-
const [wrapSSR, hashId, cssVarCls] = useStyle$1(prefixCls);
|
|
4857
|
-
const prefixWithSuffixCls = suffixCls ? `${prefixCls}-${suffixCls}` : prefixCls;
|
|
4858
|
-
return wrapSSR(/*#__PURE__*/React.createElement(TagName, Object.assign({
|
|
4859
|
-
className: className(customizePrefixCls || prefixWithSuffixCls, className$1, hashId, cssVarCls),
|
|
4860
|
-
ref: ref
|
|
4861
|
-
}, others)));
|
|
4862
|
-
});
|
|
4863
|
-
const BasicLayout = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
4864
|
-
const {
|
|
4865
|
-
direction
|
|
4866
|
-
} = React.useContext(ConfigContext);
|
|
4867
|
-
const [siders, setSiders] = React.useState([]);
|
|
4868
|
-
const {
|
|
4869
|
-
prefixCls: customizePrefixCls,
|
|
4870
|
-
className: className$1,
|
|
4871
|
-
rootClassName,
|
|
4872
|
-
children,
|
|
4873
|
-
hasSider,
|
|
4874
|
-
tagName: Tag,
|
|
4875
|
-
style
|
|
4876
|
-
} = props,
|
|
4877
|
-
others = __rest(props, ["prefixCls", "className", "rootClassName", "children", "hasSider", "tagName", "style"]);
|
|
4878
|
-
const passedProps = omit(others, ['suffixCls']);
|
|
4879
|
-
const {
|
|
4880
|
-
getPrefixCls,
|
|
4881
|
-
className: contextClassName,
|
|
4882
|
-
style: contextStyle
|
|
4883
|
-
} = useComponentConfig('layout');
|
|
4884
|
-
const prefixCls = getPrefixCls('layout', customizePrefixCls);
|
|
4885
|
-
const mergedHasSider = useHasSider(siders, children, hasSider);
|
|
4886
|
-
const [wrapCSSVar, hashId, cssVarCls] = useStyle$1(prefixCls);
|
|
4887
|
-
const classString = className(prefixCls, {
|
|
4888
|
-
[`${prefixCls}-has-sider`]: mergedHasSider,
|
|
4889
|
-
[`${prefixCls}-rtl`]: direction === 'rtl'
|
|
4890
|
-
}, contextClassName, className$1, rootClassName, hashId, cssVarCls);
|
|
4891
|
-
const contextValue = React.useMemo(() => ({
|
|
4892
|
-
siderHook: {
|
|
4893
|
-
addSider: id => {
|
|
4894
|
-
setSiders(prev => [].concat(_toConsumableArray(prev), [id]));
|
|
4895
|
-
},
|
|
4896
|
-
removeSider: id => {
|
|
4897
|
-
setSiders(prev => prev.filter(currentId => currentId !== id));
|
|
4898
|
-
}
|
|
4899
|
-
}
|
|
4900
|
-
}), []);
|
|
4901
|
-
return wrapCSSVar(/*#__PURE__*/React.createElement(LayoutContext.Provider, {
|
|
4902
|
-
value: contextValue
|
|
4903
|
-
}, /*#__PURE__*/React.createElement(Tag, Object.assign({
|
|
4904
|
-
ref: ref,
|
|
4905
|
-
className: classString,
|
|
4906
|
-
style: Object.assign(Object.assign({}, contextStyle), style)
|
|
4907
|
-
}, passedProps), children)));
|
|
4908
|
-
});
|
|
4909
|
-
const Layout = generator({
|
|
4910
|
-
tagName: 'div',
|
|
4911
|
-
displayName: 'Layout'
|
|
4912
|
-
})(BasicLayout);
|
|
4913
|
-
const Header = generator({
|
|
4914
|
-
suffixCls: 'header',
|
|
4915
|
-
tagName: 'header',
|
|
4916
|
-
displayName: 'Header'
|
|
4917
|
-
})(Basic);
|
|
4918
|
-
const Footer = generator({
|
|
4919
|
-
suffixCls: 'footer',
|
|
4920
|
-
tagName: 'footer',
|
|
4921
|
-
displayName: 'Footer'
|
|
4922
|
-
})(Basic);
|
|
4923
|
-
const Content = generator({
|
|
4924
|
-
suffixCls: 'content',
|
|
4925
|
-
tagName: 'main',
|
|
4926
|
-
displayName: 'Content'
|
|
4927
|
-
})(Basic);
|
|
4928
|
-
|
|
4929
|
-
export { Content as C, Footer as F, Header as H, Layout as L, SiderContext as S, Sider as a };
|