Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@ant-design/cssinjs
Advanced tools
@ant-design/cssinjs - npm Package Compare versions
Comparing version 0.0.0-alpha.54 to 0.0.0-alpha.60
| import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck"; | ||
| import _createClass from "@babel/runtime/helpers/esm/createClass"; | ||
| var Entity = /*#__PURE__*/function () { | ||
| function Entity() { | ||
| _classCallCheck(this, Entity); | ||
| this.cache = new Map(); | ||
| } | ||
| _createClass(Entity, [{ | ||
@@ -22,3 +19,2 @@ key: "get", | ||
| var nextValue = valueFn(prevValue); | ||
| if (nextValue === null) { | ||
@@ -31,6 +27,4 @@ this.cache.delete(path); | ||
| }]); | ||
| return Entity; | ||
| }(); | ||
| export default Entity; |
@@ -8,12 +8,10 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2"; | ||
| import { flattenToken, token2key } from '../util'; | ||
| var EMPTY_OVERRIDE = {}; // Generate different prefix to make user selector break in production env. | ||
| var EMPTY_OVERRIDE = {}; | ||
| // Generate different prefix to make user selector break in production env. | ||
| // This helps developer not to do style override directly on the hash id. | ||
| var hashPrefix = process.env.NODE_ENV !== 'production' ? 'css-dev-only-do-not-override' : 'css'; | ||
| var tokenKeys = new Map(); | ||
| function recordCleanToken(tokenKey) { | ||
| tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) + 1); | ||
| } | ||
| function removeStyleTags(key) { | ||
@@ -25,3 +23,2 @@ if (typeof document !== 'undefined') { | ||
| var _style$parentNode; | ||
| (_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style); | ||
@@ -31,5 +28,4 @@ } | ||
| } | ||
| } // Remove will check current keys first | ||
| } | ||
| // Remove will check current keys first | ||
| function cleanTokenStyle(tokenKey) { | ||
@@ -42,3 +38,2 @@ tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) - 1); | ||
| }); | ||
| if (cleanableKeyList.length < tokenKeyList.length) { | ||
@@ -58,12 +53,10 @@ cleanableKeyList.forEach(function (key) { | ||
| */ | ||
| export default function useCacheToken(theme, tokens) { | ||
| var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
| var _option$salt = option.salt, | ||
| salt = _option$salt === void 0 ? '' : _option$salt, | ||
| _option$override = option.override, | ||
| override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override, | ||
| formatToken = option.formatToken; // Basic - We do basic cache here | ||
| salt = _option$salt === void 0 ? '' : _option$salt, | ||
| _option$override = option.override, | ||
| override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override, | ||
| formatToken = option.formatToken; | ||
| // Basic - We do basic cache here | ||
| var mergedToken = React.useMemo(function () { | ||
@@ -79,12 +72,10 @@ return Object.assign.apply(Object, [{}].concat(_toConsumableArray(tokens))); | ||
| var cachedToken = useGlobalCache('token', [salt, theme.id, tokenStr, overrideTokenStr], function () { | ||
| var derivativeToken = theme.getDerivativeToken(mergedToken); // Merge with override | ||
| var mergedDerivativeToken = _objectSpread(_objectSpread({}, derivativeToken), override); // Format if needed | ||
| var derivativeToken = theme.getDerivativeToken(mergedToken); | ||
| // Merge with override | ||
| var mergedDerivativeToken = _objectSpread(_objectSpread({}, derivativeToken), override); | ||
| // Format if needed | ||
| if (formatToken) { | ||
| mergedDerivativeToken = formatToken(mergedDerivativeToken); | ||
| } // Optimize for `useStyleRegister` performance | ||
| } | ||
| // Optimize for `useStyleRegister` performance | ||
| var tokenKey = token2key(mergedDerivativeToken, salt); | ||
@@ -95,3 +86,2 @@ mergedDerivativeToken._tokenKey = tokenKey; | ||
| mergedDerivativeToken._hashId = hashId; // Not used | ||
| return [mergedDerivativeToken, hashId]; | ||
@@ -98,0 +88,0 @@ }, function (cache) { |
@@ -8,18 +8,15 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray"; | ||
| var _React$useContext = React.useContext(StyleContext), | ||
| globalCache = _React$useContext.cache; | ||
| globalCache = _React$useContext.cache; | ||
| var fullPath = [prefix].concat(_toConsumableArray(keyPath)); | ||
| var HMRUpdate = useHMR(); // Create cache | ||
| var HMRUpdate = useHMR(); | ||
| // Create cache | ||
| React.useMemo(function () { | ||
| globalCache.update(fullPath, function (prevCache) { | ||
| var _ref = prevCache || [], | ||
| _ref2 = _slicedToArray(_ref, 2), | ||
| _ref2$ = _ref2[0], | ||
| times = _ref2$ === void 0 ? 0 : _ref2$, | ||
| cache = _ref2[1]; // HMR should always ignore cache since developer may change it | ||
| _ref2 = _slicedToArray(_ref, 2), | ||
| _ref2$ = _ref2[0], | ||
| times = _ref2$ === void 0 ? 0 : _ref2$, | ||
| cache = _ref2[1]; | ||
| // HMR should always ignore cache since developer may change it | ||
| var tmpCache = cache; | ||
| if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) { | ||
@@ -29,10 +26,8 @@ onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(tmpCache, HMRUpdate); | ||
| } | ||
| var mergedCache = tmpCache || cacheFn(); | ||
| return [times + 1, mergedCache]; | ||
| }); | ||
| }, | ||
| /* eslint-disable react-hooks/exhaustive-deps */ | ||
| [fullPath.join('_')]); // Remove if no need anymore | ||
| }, /* eslint-disable react-hooks/exhaustive-deps */ | ||
| [fullPath.join('_')]); | ||
| // Remove if no need anymore | ||
| React.useEffect(function () { | ||
@@ -42,9 +37,7 @@ return function () { | ||
| var _ref3 = prevCache || [], | ||
| _ref4 = _slicedToArray(_ref3, 2), | ||
| _ref4$ = _ref4[0], | ||
| times = _ref4$ === void 0 ? 0 : _ref4$, | ||
| cache = _ref4[1]; | ||
| _ref4 = _slicedToArray(_ref3, 2), | ||
| _ref4$ = _ref4[0], | ||
| times = _ref4$ === void 0 ? 0 : _ref4$, | ||
| cache = _ref4[1]; | ||
| var nextCount = times - 1; | ||
| if (nextCount === 0) { | ||
@@ -54,3 +47,2 @@ onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(cache, false); | ||
| } | ||
| return [times - 1, cache]; | ||
@@ -57,0 +49,0 @@ }); |
| function useProdHMR() { | ||
| return false; | ||
| } | ||
| var webpackHMR = false; | ||
| function useDevHMR() { | ||
| return webpackHMR; | ||
| } | ||
| export default process.env.NODE_ENV === 'production' ? useProdHMR : useDevHMR; // Webpack `module.hot.accept` do not support any deps update trigger | ||
| export default process.env.NODE_ENV === 'production' ? useProdHMR : useDevHMR; | ||
| // Webpack `module.hot.accept` do not support any deps update trigger | ||
| // We have to hack handler to force mark as HRM | ||
| if (process.env.NODE_ENV !== 'production' && typeof module !== 'undefined' && module && module.hot) { | ||
| var win = window; | ||
| if (typeof win.webpackHotUpdate === 'function') { | ||
| var originWebpackHotUpdate = win.webpackHotUpdate; | ||
| win.webpackHotUpdate = function () { | ||
@@ -21,0 +16,0 @@ webpackHMR = true; |
@@ -9,4 +9,4 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; | ||
| import canUseDom from "rc-util/es/Dom/canUseDom"; | ||
| import hash from '@emotion/hash'; // @ts-ignore | ||
| import hash from '@emotion/hash'; | ||
| // @ts-ignore | ||
| import unitless from '@emotion/unitless'; | ||
@@ -18,7 +18,7 @@ import { compile, serialize, stringify } from 'stylis'; | ||
| var isClientSide = canUseDom(); | ||
| var SKIP_CHECK = '_skip_check_'; // ============================================================================ | ||
| var SKIP_CHECK = '_skip_check_'; | ||
| // ============================================================================ | ||
| // == Parser == | ||
| // ============================================================================ | ||
| // Preprocessor style content to browser support one | ||
| export function normalizeStyle(styleStr) { | ||
@@ -28,9 +28,7 @@ var serialized = serialize(compile(styleStr), stringify); | ||
| } | ||
| function isCompoundCSSProperty(value) { | ||
| return _typeof(value) === 'object' && value && SKIP_CHECK in value; | ||
| } | ||
| export var animationStatistics = {}; // 注入 hash 值 | ||
| export var animationStatistics = {}; | ||
| // 注入 hash 值 | ||
| function injectSelectorHash(key, hashId, hashPriority) { | ||
@@ -40,11 +38,9 @@ if (!hashId) { | ||
| } | ||
| var hashClassName = ".".concat(hashId); | ||
| var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName; // 注入 hashId | ||
| var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName; | ||
| // 注入 hashId | ||
| var keys = key.split(',').map(function (k) { | ||
| var _firstPath$match; | ||
| var fullPath = k.trim().split(/\s+/); // 如果 Selector 第一个是 HTML Element，那我们就插到它的后面。反之，就插到最前面。 | ||
| var fullPath = k.trim().split(/\s+/); | ||
| // 如果 Selector 第一个是 HTML Element，那我们就插到它的后面。反之，就插到最前面。 | ||
| var firstPath = fullPath[0] || ''; | ||
@@ -56,20 +52,16 @@ var htmlElement = ((_firstPath$match = firstPath.match(/^\w+/)) === null || _firstPath$match === void 0 ? void 0 : _firstPath$match[0]) || ''; | ||
| return keys.join(','); | ||
| } // Parse CSSObject to style content | ||
| } | ||
| // Parse CSSObject to style content | ||
| export var parseStyle = function parseStyle(interpolation) { | ||
| var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
| var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : { | ||
| root: true | ||
| }, | ||
| root = _ref.root, | ||
| injectHash = _ref.injectHash; | ||
| root: true | ||
| }, | ||
| root = _ref.root, | ||
| injectHash = _ref.injectHash; | ||
| var hashId = config.hashId, | ||
| layer = config.layer, | ||
| path = config.path, | ||
| hashPriority = config.hashPriority; | ||
| layer = config.layer, | ||
| path = config.path, | ||
| hashPriority = config.hashPriority; | ||
| var styleStr = ''; | ||
| function parseKeyframes(keyframes) { | ||
@@ -79,3 +71,2 @@ if (animationStatistics[keyframes.getName(hashId)]) { | ||
| } | ||
| animationStatistics[keyframes.getName(hashId)] = true; | ||
@@ -86,3 +77,2 @@ return "@keyframes ".concat(keyframes.getName(hashId)).concat(parseStyle(keyframes.style, config, { | ||
| } | ||
| function flattenList(list) { | ||
@@ -99,3 +89,2 @@ var fullList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : []; | ||
| } | ||
| var flattenStyleList = flattenList(Array.isArray(interpolation) ? interpolation : [interpolation]); | ||
@@ -105,3 +94,2 @@ flattenStyleList.forEach(function (originStyle) { | ||
| var style = typeof originStyle === 'string' && !root ? {} : originStyle; | ||
| if (typeof style === 'string') { | ||
@@ -116,10 +104,9 @@ styleStr += "".concat(style, "\n"); | ||
| var value = style[key]; | ||
| if (_typeof(value) === 'object' && value && (key !== 'animationName' || !value._keyframe) && !isCompoundCSSProperty(value)) { | ||
| var subInjectHash = false; // 当成嵌套对象来处理 | ||
| var mergedKey = key.trim(); // Whether treat child as root. In most case it is false. | ||
| var nextRoot = false; // 拆分多个选择器 | ||
| var subInjectHash = false; | ||
| // 当成嵌套对象来处理 | ||
| var mergedKey = key.trim(); | ||
| // Whether treat child as root. In most case it is false. | ||
| var nextRoot = false; | ||
| // 拆分多个选择器 | ||
| if ((root || injectHash) && hashId) { | ||
@@ -142,3 +129,2 @@ if (mergedKey.startsWith('@')) { | ||
| } | ||
| styleStr += "".concat(mergedKey).concat(parseStyle(value, _objectSpread(_objectSpread({}, config), {}, { | ||
@@ -152,5 +138,3 @@ path: "".concat(path, " -> ").concat(mergedKey) | ||
| var _value$value; | ||
| var actualValue = (_value$value = value === null || value === void 0 ? void 0 : value.value) !== null && _value$value !== void 0 ? _value$value : value; | ||
| if (process.env.NODE_ENV !== 'production' && (_typeof(value) !== 'object' || !(value === null || value === void 0 ? void 0 : value[SKIP_CHECK]))) { | ||
@@ -161,16 +145,13 @@ styleValidate(key, actualValue, { | ||
| }); | ||
| } // 如果是样式则直接插入 | ||
| } | ||
| // 如果是样式则直接插入 | ||
| var styleName = key.replace(/[A-Z]/g, function (match) { | ||
| return "-".concat(match.toLowerCase()); | ||
| }); // Auto suffix with px | ||
| }); | ||
| // Auto suffix with px | ||
| var formatValue = actualValue; | ||
| if (!unitless[key] && typeof formatValue === 'number' && formatValue !== 0) { | ||
| formatValue = "".concat(formatValue, "px"); | ||
| } // handle animationName & Keyframe value | ||
| } | ||
| // handle animationName & Keyframe value | ||
| if (key === 'animationName' && (value === null || value === void 0 ? void 0 : value._keyframe)) { | ||
@@ -180,3 +161,2 @@ styleStr += parseKeyframes(value); | ||
| } | ||
| styleStr += "".concat(styleName, ":").concat(formatValue, ";"); | ||
@@ -187,3 +167,2 @@ } | ||
| }); | ||
| if (!root) { | ||
@@ -194,4 +173,4 @@ styleStr = "{".concat(styleStr, "}"); | ||
| var layerName = layerCells[layerCells.length - 1].trim(); | ||
| styleStr = "@layer ".concat(layerName, " {").concat(styleStr, "}"); // Order of layer if needed | ||
| styleStr = "@layer ".concat(layerName, " {").concat(styleStr, "}"); | ||
| // Order of layer if needed | ||
| if (layerCells.length > 1) { | ||
@@ -202,12 +181,10 @@ // zombieJ: stylis do not support layer order, so we need to handle it manually. | ||
| } | ||
| return styleStr; | ||
| }; // ============================================================================ | ||
| }; | ||
| // ============================================================================ | ||
| // == Register == | ||
| // ============================================================================ | ||
| function uniqueHash(path, styleStr) { | ||
| return hash("".concat(path.join('%')).concat(styleStr)); | ||
| } | ||
| function Empty() { | ||
@@ -219,72 +196,63 @@ return null; | ||
| */ | ||
| export default function useStyleRegister(info, styleFn) { | ||
| var token = info.token, | ||
| path = info.path, | ||
| hashId = info.hashId, | ||
| layer = info.layer; | ||
| path = info.path, | ||
| hashId = info.hashId, | ||
| layer = info.layer; | ||
| var _React$useContext = React.useContext(StyleContext), | ||
| autoClear = _React$useContext.autoClear, | ||
| mock = _React$useContext.mock, | ||
| defaultCache = _React$useContext.defaultCache, | ||
| hashPriority = _React$useContext.hashPriority; | ||
| autoClear = _React$useContext.autoClear, | ||
| mock = _React$useContext.mock, | ||
| defaultCache = _React$useContext.defaultCache, | ||
| hashPriority = _React$useContext.hashPriority; | ||
| var tokenKey = token._tokenKey; | ||
| var fullPath = [tokenKey].concat(_toConsumableArray(path)); // Check if need insert style | ||
| var fullPath = [tokenKey].concat(_toConsumableArray(path)); | ||
| // Check if need insert style | ||
| var isMergedClientSide = isClientSide; | ||
| if (process.env.NODE_ENV !== 'production' && mock !== undefined) { | ||
| isMergedClientSide = mock === 'client'; | ||
| } | ||
| var _useGlobalCache = useGlobalCache('style', fullPath, // Create cache if needed | ||
| function () { | ||
| var styleObj = styleFn(); | ||
| var styleStr = normalizeStyle(parseStyle(styleObj, { | ||
| hashId: hashId, | ||
| hashPriority: hashPriority, | ||
| layer: layer, | ||
| path: path.join('-') | ||
| })); | ||
| var styleId = uniqueHash(fullPath, styleStr); // Clear animation statistics | ||
| animationStatistics = {}; | ||
| if (isMergedClientSide) { | ||
| var style = updateCSS(styleStr, styleId, { | ||
| mark: ATTR_MARK, | ||
| prepend: 'queue' | ||
| }); | ||
| style[CSS_IN_JS_INSTANCE] = CSS_IN_JS_INSTANCE_ID; // Used for `useCacheToken` to remove on batch when token removed | ||
| style.setAttribute(ATTR_TOKEN, tokenKey); // Dev usage to find which cache path made this easily | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| style.setAttribute(ATTR_DEV_CACHE_PATH, fullPath.join('|')); | ||
| var _useGlobalCache = useGlobalCache('style', fullPath, | ||
| // Create cache if needed | ||
| function () { | ||
| var styleObj = styleFn(); | ||
| var styleStr = normalizeStyle(parseStyle(styleObj, { | ||
| hashId: hashId, | ||
| hashPriority: hashPriority, | ||
| layer: layer, | ||
| path: path.join('-') | ||
| })); | ||
| var styleId = uniqueHash(fullPath, styleStr); | ||
| // Clear animation statistics | ||
| animationStatistics = {}; | ||
| if (isMergedClientSide) { | ||
| var style = updateCSS(styleStr, styleId, { | ||
| mark: ATTR_MARK, | ||
| prepend: 'queue' | ||
| }); | ||
| style[CSS_IN_JS_INSTANCE] = CSS_IN_JS_INSTANCE_ID; | ||
| // Used for `useCacheToken` to remove on batch when token removed | ||
| style.setAttribute(ATTR_TOKEN, tokenKey); | ||
| // Dev usage to find which cache path made this easily | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| style.setAttribute(ATTR_DEV_CACHE_PATH, fullPath.join('|')); | ||
| } | ||
| } | ||
| } | ||
| return [styleStr, tokenKey, styleId]; | ||
| }, // Remove cache if no need | ||
| function (_ref2, fromHMR) { | ||
| var _ref3 = _slicedToArray(_ref2, 3), | ||
| return [styleStr, tokenKey, styleId]; | ||
| }, | ||
| // Remove cache if no need | ||
| function (_ref2, fromHMR) { | ||
| var _ref3 = _slicedToArray(_ref2, 3), | ||
| styleId = _ref3[2]; | ||
| if ((fromHMR || autoClear) && isClientSide) { | ||
| removeCSS(styleId, { | ||
| mark: ATTR_MARK | ||
| }); | ||
| } | ||
| }), | ||
| _useGlobalCache2 = _slicedToArray(_useGlobalCache, 3), | ||
| cachedStyleStr = _useGlobalCache2[0], | ||
| cachedTokenKey = _useGlobalCache2[1], | ||
| cachedStyleId = _useGlobalCache2[2]; | ||
| if ((fromHMR || autoClear) && isClientSide) { | ||
| removeCSS(styleId, { | ||
| mark: ATTR_MARK | ||
| }); | ||
| } | ||
| }), | ||
| _useGlobalCache2 = _slicedToArray(_useGlobalCache, 3), | ||
| cachedStyleStr = _useGlobalCache2[0], | ||
| cachedTokenKey = _useGlobalCache2[1], | ||
| cachedStyleId = _useGlobalCache2[2]; | ||
| return function (node) { | ||
| var styleNode; | ||
| if (isMergedClientSide || !defaultCache) { | ||
@@ -294,3 +262,2 @@ styleNode = /*#__PURE__*/React.createElement(Empty, null); | ||
| var _objectSpread2; | ||
| styleNode = /*#__PURE__*/React.createElement("style", _objectSpread(_objectSpread({}, (_objectSpread2 = {}, _defineProperty(_objectSpread2, ATTR_TOKEN, cachedTokenKey), _defineProperty(_objectSpread2, ATTR_MARK, cachedStyleId), _objectSpread2)), {}, { | ||
@@ -302,9 +269,8 @@ dangerouslySetInnerHTML: { | ||
| } | ||
| return /*#__PURE__*/React.createElement(React.Fragment, null, styleNode, node); | ||
| }; | ||
| } // ============================================================================ | ||
| } | ||
| // ============================================================================ | ||
| // == SSR == | ||
| // ============================================================================ | ||
| export function extractStyle(cache) { | ||
@@ -314,11 +280,10 @@ // prefix with `style` is used for `useStyleRegister` to cache style context | ||
| return key.startsWith('style%'); | ||
| }); // const tokenStyles: Record<string, string[]> = {}; | ||
| }); | ||
| // const tokenStyles: Record<string, string[]> = {}; | ||
| var styleText = ''; | ||
| styleKeys.forEach(function (key) { | ||
| var _cache$cache$get$ = _slicedToArray(cache.cache.get(key)[1], 3), | ||
| styleStr = _cache$cache$get$[0], | ||
| tokenKey = _cache$cache$get$[1], | ||
| styleId = _cache$cache$get$[2]; | ||
| styleStr = _cache$cache$get$[0], | ||
| tokenKey = _cache$cache$get$[1], | ||
| styleId = _cache$cache$get$[2]; | ||
| styleText += "<style ".concat(ATTR_TOKEN, "=\"").concat(tokenKey, "\" ").concat(ATTR_MARK, "=\"").concat(styleId, "\">").concat(styleStr, "</style>"); | ||
@@ -325,0 +290,0 @@ }); |
| import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck"; | ||
| import _createClass from "@babel/runtime/helpers/esm/createClass"; | ||
| var Keyframe = /*#__PURE__*/function () { | ||
| function Keyframe(name, style) { | ||
| _classCallCheck(this, Keyframe); | ||
| this.name = void 0; | ||
@@ -14,3 +12,2 @@ this.style = void 0; | ||
| } | ||
| _createClass(Keyframe, [{ | ||
@@ -23,6 +20,4 @@ key: "getName", | ||
| }]); | ||
| return Keyframe; | ||
| }(); | ||
| export default Keyframe; |
@@ -5,4 +5,4 @@ import * as React from 'react'; | ||
| export var ATTR_MARK = 'data-css-hash'; | ||
| export var ATTR_DEV_CACHE_PATH = 'data-dev-cache-path'; // Mark css-in-js instance in style element | ||
| export var ATTR_DEV_CACHE_PATH = 'data-dev-cache-path'; | ||
| // Mark css-in-js instance in style element | ||
| export var CSS_IN_JS_INSTANCE = '__cssinjs_instance__'; | ||
@@ -13,15 +13,14 @@ export var CSS_IN_JS_INSTANCE_ID = Math.random().toString(12).slice(2); | ||
| var styles = document.body.querySelectorAll("style[".concat(ATTR_MARK, "]")); | ||
| var firstChild = document.head.firstChild; | ||
| Array.from(styles).forEach(function (style) { | ||
| style[CSS_IN_JS_INSTANCE] = style[CSS_IN_JS_INSTANCE] || CSS_IN_JS_INSTANCE_ID; | ||
| document.head.appendChild(style); | ||
| }); // Deduplicate of moved styles | ||
| document.head.insertBefore(style, firstChild); | ||
| }); | ||
| // Deduplicate of moved styles | ||
| var styleHash = {}; | ||
| Array.from(document.querySelectorAll("style[".concat(ATTR_MARK, "]"))).forEach(function (style) { | ||
| var hash = style.getAttribute(ATTR_MARK); | ||
| if (styleHash[hash]) { | ||
| if (style[CSS_IN_JS_INSTANCE] === CSS_IN_JS_INSTANCE_ID) { | ||
| var _style$parentNode; | ||
| (_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style); | ||
@@ -34,3 +33,2 @@ } | ||
| } | ||
| return new CacheEntity(); | ||
@@ -45,14 +43,12 @@ } | ||
| var autoClear = props.autoClear, | ||
| mock = props.mock, | ||
| cache = props.cache, | ||
| hashPriority = props.hashPriority, | ||
| children = props.children; | ||
| mock = props.mock, | ||
| cache = props.cache, | ||
| hashPriority = props.hashPriority, | ||
| children = props.children; | ||
| var _React$useContext = React.useContext(StyleContext), | ||
| parentCache = _React$useContext.cache, | ||
| parentAutoClear = _React$useContext.autoClear, | ||
| parentMock = _React$useContext.mock, | ||
| parentDefaultCache = _React$useContext.defaultCache, | ||
| parentHashPriority = _React$useContext.hashPriority; | ||
| parentCache = _React$useContext.cache, | ||
| parentAutoClear = _React$useContext.autoClear, | ||
| parentMock = _React$useContext.mock, | ||
| parentDefaultCache = _React$useContext.defaultCache, | ||
| parentHashPriority = _React$useContext.hashPriority; | ||
| var context = React.useMemo(function () { | ||
@@ -59,0 +55,0 @@ return { |
@@ -7,12 +7,10 @@ import ThemeCache from './ThemeCache'; | ||
| */ | ||
| export default function createTheme(derivatives) { | ||
| var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives]; // Create new theme if not exist | ||
| var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives]; | ||
| // Create new theme if not exist | ||
| if (!cacheThemes.has(derivativeArr)) { | ||
| cacheThemes.set(derivativeArr, new Theme(derivativeArr)); | ||
| } // Get theme from cache and return | ||
| } | ||
| // Get theme from cache and return | ||
| return cacheThemes.get(derivativeArr); | ||
| } |
@@ -9,7 +9,5 @@ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck"; | ||
| */ | ||
| var Theme = /*#__PURE__*/function () { | ||
| function Theme(derivatives) { | ||
| _classCallCheck(this, Theme); | ||
| this.derivatives = void 0; | ||
@@ -19,10 +17,7 @@ this.id = void 0; | ||
| this.id = uuid; | ||
| if (derivatives.length === 0) { | ||
| warning(derivatives.length > 0, '[Ant Design CSS-in-JS] Theme should have at least one derivative function.'); | ||
| } | ||
| uuid += 1; | ||
| } | ||
| _createClass(Theme, [{ | ||
@@ -36,6 +31,4 @@ key: "getDerivativeToken", | ||
| }]); | ||
| return Theme; | ||
| }(); | ||
| export { Theme as default }; |
@@ -8,3 +8,2 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray"; | ||
| } | ||
| for (var i = 0; i < left.length; i++) { | ||
@@ -15,10 +14,7 @@ if (left[i] !== right[i]) { | ||
| } | ||
| return true; | ||
| } | ||
| var ThemeCache = /*#__PURE__*/function () { | ||
| function ThemeCache() { | ||
| _classCallCheck(this, ThemeCache); | ||
| this.cache = void 0; | ||
@@ -31,3 +27,2 @@ this.keys = void 0; | ||
| } | ||
| _createClass(ThemeCache, [{ | ||
@@ -42,3 +37,2 @@ key: "size", | ||
| var _cache2, _cache3; | ||
| var updateCallTimes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
@@ -53,11 +47,8 @@ var cache = { | ||
| var _cache, _cache$map; | ||
| cache = (_cache = cache) === null || _cache === void 0 ? void 0 : (_cache$map = _cache.map) === null || _cache$map === void 0 ? void 0 : _cache$map.get(derivative); | ||
| } | ||
| }); | ||
| if (((_cache2 = cache) === null || _cache2 === void 0 ? void 0 : _cache2.value) && updateCallTimes) { | ||
| cache.value[1] = this.cacheCallTimes++; | ||
| } | ||
| return (_cache3 = cache) === null || _cache3 === void 0 ? void 0 : _cache3.value; | ||
@@ -69,3 +60,2 @@ } | ||
| var _this$internalGet; | ||
| return (_this$internalGet = this.internalGet(derivativeOption, true)) === null || _this$internalGet === void 0 ? void 0 : _this$internalGet[0]; | ||
@@ -82,3 +72,2 @@ } | ||
| var _this = this; | ||
| // New cache | ||
@@ -88,20 +77,15 @@ if (!this.has(derivativeOption)) { | ||
| var _this$keys$reduce = this.keys.reduce(function (result, key) { | ||
| var _result = _slicedToArray(result, 2), | ||
| var _result = _slicedToArray(result, 2), | ||
| callTimes = _result[1]; | ||
| if (_this.internalGet(key)[1] < callTimes) { | ||
| return [key, _this.internalGet(key)[1]]; | ||
| } | ||
| return result; | ||
| }, [this.keys[0], this.cacheCallTimes]), | ||
| _this$keys$reduce2 = _slicedToArray(_this$keys$reduce, 1), | ||
| targetKey = _this$keys$reduce2[0]; | ||
| if (_this.internalGet(key)[1] < callTimes) { | ||
| return [key, _this.internalGet(key)[1]]; | ||
| } | ||
| return result; | ||
| }, [this.keys[0], this.cacheCallTimes]), | ||
| _this$keys$reduce2 = _slicedToArray(_this$keys$reduce, 1), | ||
| targetKey = _this$keys$reduce2[0]; | ||
| this.delete(targetKey); | ||
| } | ||
| this.keys.push(derivativeOption); | ||
| } | ||
| var cache = this.cache; | ||
@@ -115,3 +99,2 @@ derivativeOption.forEach(function (derivative, index) { | ||
| var cacheValue = cache.get(derivative); | ||
| if (!cacheValue) { | ||
@@ -124,3 +107,2 @@ cache.set(derivative, { | ||
| } | ||
| cache = cache.get(derivative).map; | ||
@@ -134,6 +116,4 @@ } | ||
| var cache = currentCache.get(derivatives[0]); | ||
| if (derivatives.length === 1) { | ||
| var _cache$value; | ||
| if (!cache.map) { | ||
@@ -146,12 +126,8 @@ currentCache.delete(derivatives[0]); | ||
| } | ||
| return (_cache$value = cache.value) === null || _cache$value === void 0 ? void 0 : _cache$value[0]; | ||
| } | ||
| var result = this.deleteByPath(cache.map, derivatives.slice(1)); | ||
| if ((!cache.map || cache.map.size === 0) && !cache.value) { | ||
| currentCache.delete(derivatives[0]); | ||
| } | ||
| return result; | ||
@@ -169,12 +145,9 @@ } | ||
| } | ||
| return undefined; | ||
| } | ||
| }]); | ||
| return ThemeCache; | ||
| }(); | ||
| ThemeCache.MAX_CACHE_SIZE = 20; | ||
| ThemeCache.MAX_CACHE_OFFSET = 5; | ||
| export { ThemeCache as default }; |
@@ -11,3 +11,2 @@ import _typeof from "@babel/runtime/helpers/esm/typeof"; | ||
| str += key; | ||
| if (value && _typeof(value) === 'object') { | ||
@@ -24,3 +23,2 @@ str += flattenToken(value); | ||
| */ | ||
| export function token2key(token, slat) { | ||
@@ -35,4 +33,3 @@ return hash("".concat(slat, "_").concat(flattenToken(token))); | ||
| var path = info.path, | ||
| hashId = info.hashId; | ||
| hashId = info.hashId; | ||
| switch (key) { | ||
@@ -43,9 +40,6 @@ case 'content': | ||
| var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset']; | ||
| 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) !== "'")) { | ||
| warning("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"".concat(value, "\"'`"), path); | ||
| } | ||
| return; | ||
| case 'marginLeft': | ||
@@ -71,3 +65,2 @@ case 'marginRight': | ||
| return; | ||
| case 'margin': | ||
@@ -82,3 +75,2 @@ case 'padding': | ||
| }); | ||
| if (valueArr.length === 4 && valueArr[1] !== valueArr[3]) { | ||
@@ -88,5 +80,3 @@ warning("You seem to be using '".concat(key, "' property with different left ").concat(key, " and right ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), path); | ||
| } | ||
| return; | ||
| case 'clear': | ||
@@ -97,5 +87,3 @@ case 'textAlign': | ||
| } | ||
| return; | ||
| case 'borderRadius': | ||
@@ -110,24 +98,19 @@ if (typeof value === 'string') { | ||
| } | ||
| var radiusArr = group.split(' ').map(function (item) { | ||
| return item.trim(); | ||
| }); // borderRadius: '2px 4px' | ||
| }); | ||
| // borderRadius: '2px 4px' | ||
| if (radiusArr.length >= 2 && radiusArr[0] !== radiusArr[1]) { | ||
| return true; | ||
| } // borderRadius: '4px 4px 2px' | ||
| } | ||
| // borderRadius: '4px 4px 2px' | ||
| if (radiusArr.length === 3 && radiusArr[1] !== radiusArr[2]) { | ||
| return true; | ||
| } // borderRadius: '4px 4px 2px 4px' | ||
| } | ||
| // borderRadius: '4px 4px 2px 4px' | ||
| if (radiusArr.length === 4 && radiusArr[2] !== radiusArr[3]) { | ||
| return true; | ||
| } | ||
| return result; | ||
| }, false); | ||
| if (invalid) { | ||
@@ -137,5 +120,3 @@ warning("You seem to be using non-logical value '".concat(value, "' of ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), path); | ||
| } | ||
| return; | ||
| case 'animation': | ||
@@ -145,3 +126,2 @@ if (hashId && value !== 'none') { | ||
| } | ||
| default: | ||
@@ -153,7 +133,5 @@ return; | ||
| var layerWidth = '903px'; | ||
| function supportSelector(styleStr, handleElement) { | ||
| if (canUseDom()) { | ||
| var _ele$parentNode; | ||
| updateCSS(styleStr, layerKey); | ||
@@ -166,3 +144,2 @@ var ele = document.createElement('div'); | ||
| document.body.appendChild(ele); | ||
| if (process.env.NODE_ENV !== 'production') { | ||
@@ -172,3 +149,2 @@ ele.innerHTML = 'Test'; | ||
| } | ||
| var support = getComputedStyle(ele).width === layerWidth; | ||
@@ -179,6 +155,4 @@ (_ele$parentNode = ele.parentNode) === null || _ele$parentNode === void 0 ? void 0 : _ele$parentNode.removeChild(ele); | ||
| } | ||
| return false; | ||
| } | ||
| var canLayer = undefined; | ||
@@ -191,4 +165,3 @@ export function supportLayer() { | ||
| } | ||
| return canLayer; | ||
| } |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -9,7 +8,4 @@ value: true | ||
| exports.default = void 0; | ||
| var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); | ||
| var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); | ||
| var Entity = /*#__PURE__*/function () { | ||
@@ -20,3 +16,2 @@ function Entity() { | ||
| } | ||
| (0, _createClass2.default)(Entity, [{ | ||
@@ -33,3 +28,2 @@ key: "get", | ||
| var nextValue = valueFn(prevValue); | ||
| if (nextValue === null) { | ||
@@ -44,4 +38,3 @@ this.cache.delete(path); | ||
| }(); | ||
| var _default = Entity; | ||
| exports.default = _default; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| var _typeof = require("@babel/runtime/helpers/typeof"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -11,31 +9,19 @@ value: true | ||
| exports.default = useCacheToken; | ||
| var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2")); | ||
| var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray")); | ||
| var React = _interopRequireWildcard(require("react")); | ||
| var _hash = _interopRequireDefault(require("@emotion/hash")); | ||
| var _StyleContext = require("../StyleContext"); | ||
| var _useGlobalCache = _interopRequireDefault(require("./useGlobalCache")); | ||
| var _util = require("../util"); | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } | ||
| var EMPTY_OVERRIDE = {}; // Generate different prefix to make user selector break in production env. | ||
| var EMPTY_OVERRIDE = {}; | ||
| // Generate different prefix to make user selector break in production env. | ||
| // This helps developer not to do style override directly on the hash id. | ||
| var hashPrefix = process.env.NODE_ENV !== 'production' ? 'css-dev-only-do-not-override' : 'css'; | ||
| var tokenKeys = new Map(); | ||
| function recordCleanToken(tokenKey) { | ||
| tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) + 1); | ||
| } | ||
| function removeStyleTags(key) { | ||
@@ -47,3 +33,2 @@ if (typeof document !== 'undefined') { | ||
| var _style$parentNode; | ||
| (_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style); | ||
@@ -53,5 +38,4 @@ } | ||
| } | ||
| } // Remove will check current keys first | ||
| } | ||
| // Remove will check current keys first | ||
| function cleanTokenStyle(tokenKey) { | ||
@@ -64,3 +48,2 @@ tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) - 1); | ||
| }); | ||
| if (cleanableKeyList.length < tokenKeyList.length) { | ||
@@ -80,12 +63,10 @@ cleanableKeyList.forEach(function (key) { | ||
| */ | ||
| function useCacheToken(theme, tokens) { | ||
| var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
| var _option$salt = option.salt, | ||
| salt = _option$salt === void 0 ? '' : _option$salt, | ||
| _option$override = option.override, | ||
| override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override, | ||
| formatToken = option.formatToken; // Basic - We do basic cache here | ||
| salt = _option$salt === void 0 ? '' : _option$salt, | ||
| _option$override = option.override, | ||
| override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override, | ||
| formatToken = option.formatToken; | ||
| // Basic - We do basic cache here | ||
| var mergedToken = React.useMemo(function () { | ||
@@ -101,11 +82,10 @@ return Object.assign.apply(Object, [{}].concat((0, _toConsumableArray2.default)(tokens))); | ||
| var cachedToken = (0, _useGlobalCache.default)('token', [salt, theme.id, tokenStr, overrideTokenStr], function () { | ||
| var derivativeToken = theme.getDerivativeToken(mergedToken); // Merge with override | ||
| var mergedDerivativeToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, derivativeToken), override); // Format if needed | ||
| var derivativeToken = theme.getDerivativeToken(mergedToken); | ||
| // Merge with override | ||
| var mergedDerivativeToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, derivativeToken), override); | ||
| // Format if needed | ||
| if (formatToken) { | ||
| mergedDerivativeToken = formatToken(mergedDerivativeToken); | ||
| } // Optimize for `useStyleRegister` performance | ||
| } | ||
| // Optimize for `useStyleRegister` performance | ||
| var tokenKey = (0, _util.token2key)(mergedDerivativeToken, salt); | ||
@@ -116,3 +96,2 @@ mergedDerivativeToken._tokenKey = tokenKey; | ||
| mergedDerivativeToken._hashId = hashId; // Not used | ||
| return [mergedDerivativeToken, hashId]; | ||
@@ -119,0 +98,0 @@ }, function (cache) { |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| var _typeof = require("@babel/runtime/helpers/typeof"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -11,35 +9,24 @@ value: true | ||
| exports.default = useClientCache; | ||
| var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); | ||
| var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray")); | ||
| var React = _interopRequireWildcard(require("react")); | ||
| var _StyleContext = _interopRequireDefault(require("../StyleContext")); | ||
| var _useHMR = _interopRequireDefault(require("./useHMR")); | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } | ||
| function useClientCache(prefix, keyPath, cacheFn, onCacheRemove) { | ||
| var _React$useContext = React.useContext(_StyleContext.default), | ||
| globalCache = _React$useContext.cache; | ||
| globalCache = _React$useContext.cache; | ||
| var fullPath = [prefix].concat((0, _toConsumableArray2.default)(keyPath)); | ||
| var HMRUpdate = (0, _useHMR.default)(); // Create cache | ||
| var HMRUpdate = (0, _useHMR.default)(); | ||
| // Create cache | ||
| React.useMemo(function () { | ||
| globalCache.update(fullPath, function (prevCache) { | ||
| var _ref = prevCache || [], | ||
| _ref2 = (0, _slicedToArray2.default)(_ref, 2), | ||
| _ref2$ = _ref2[0], | ||
| times = _ref2$ === void 0 ? 0 : _ref2$, | ||
| cache = _ref2[1]; // HMR should always ignore cache since developer may change it | ||
| _ref2 = (0, _slicedToArray2.default)(_ref, 2), | ||
| _ref2$ = _ref2[0], | ||
| times = _ref2$ === void 0 ? 0 : _ref2$, | ||
| cache = _ref2[1]; | ||
| // HMR should always ignore cache since developer may change it | ||
| var tmpCache = cache; | ||
| if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) { | ||
@@ -49,10 +36,8 @@ onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(tmpCache, HMRUpdate); | ||
| } | ||
| var mergedCache = tmpCache || cacheFn(); | ||
| return [times + 1, mergedCache]; | ||
| }); | ||
| }, | ||
| /* eslint-disable react-hooks/exhaustive-deps */ | ||
| [fullPath.join('_')]); // Remove if no need anymore | ||
| }, /* eslint-disable react-hooks/exhaustive-deps */ | ||
| [fullPath.join('_')]); | ||
| // Remove if no need anymore | ||
| React.useEffect(function () { | ||
@@ -62,9 +47,7 @@ return function () { | ||
| var _ref3 = prevCache || [], | ||
| _ref4 = (0, _slicedToArray2.default)(_ref3, 2), | ||
| _ref4$ = _ref4[0], | ||
| times = _ref4$ === void 0 ? 0 : _ref4$, | ||
| cache = _ref4[1]; | ||
| _ref4 = (0, _slicedToArray2.default)(_ref3, 2), | ||
| _ref4$ = _ref4[0], | ||
| times = _ref4$ === void 0 ? 0 : _ref4$, | ||
| cache = _ref4[1]; | ||
| var nextCount = times - 1; | ||
| if (nextCount === 0) { | ||
@@ -74,3 +57,2 @@ onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(cache, false); | ||
| } | ||
| return [times - 1, cache]; | ||
@@ -77,0 +59,0 @@ }); |
@@ -7,25 +7,16 @@ "use strict"; | ||
| exports.default = void 0; | ||
| function useProdHMR() { | ||
| return false; | ||
| } | ||
| var webpackHMR = false; | ||
| function useDevHMR() { | ||
| return webpackHMR; | ||
| } | ||
| var _default = process.env.NODE_ENV === 'production' ? useProdHMR : useDevHMR; // Webpack `module.hot.accept` do not support any deps update trigger | ||
| // We have to hack handler to force mark as HRM | ||
| exports.default = _default; | ||
| if (process.env.NODE_ENV !== 'production' && typeof module !== 'undefined' && module && module.hot) { | ||
| var win = window; | ||
| if (typeof win.webpackHotUpdate === 'function') { | ||
| var originWebpackHotUpdate = win.webpackHotUpdate; | ||
| win.webpackHotUpdate = function () { | ||
@@ -32,0 +23,0 @@ webpackHMR = true; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| var _typeof3 = require("@babel/runtime/helpers/typeof"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -15,42 +13,26 @@ value: true | ||
| exports.parseStyle = void 0; | ||
| var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); | ||
| var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); | ||
| var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2")); | ||
| var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray")); | ||
| var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof")); | ||
| var React = _interopRequireWildcard(require("react")); | ||
| var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS"); | ||
| var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom")); | ||
| var _hash = _interopRequireDefault(require("@emotion/hash")); | ||
| var _unitless = _interopRequireDefault(require("@emotion/unitless")); | ||
| var _stylis = require("stylis"); | ||
| var _useGlobalCache3 = _interopRequireDefault(require("./useGlobalCache")); | ||
| var _StyleContext = _interopRequireWildcard(require("../StyleContext")); | ||
| var _util = require("../util"); | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } | ||
| // @ts-ignore | ||
| // @ts-ignore | ||
| var isClientSide = (0, _canUseDom.default)(); | ||
| var SKIP_CHECK = '_skip_check_'; // ============================================================================ | ||
| var SKIP_CHECK = '_skip_check_'; | ||
| // ============================================================================ | ||
| // == Parser == | ||
| // ============================================================================ | ||
| // Preprocessor style content to browser support one | ||
| function normalizeStyle(styleStr) { | ||
@@ -60,11 +42,8 @@ var serialized = (0, _stylis.serialize)((0, _stylis.compile)(styleStr), _stylis.stringify); | ||
| } | ||
| function isCompoundCSSProperty(value) { | ||
| return (0, _typeof2.default)(value) === 'object' && value && SKIP_CHECK in value; | ||
| } | ||
| var animationStatistics = {}; // 注入 hash 值 | ||
| var animationStatistics = {}; | ||
| // 注入 hash 值 | ||
| exports.animationStatistics = animationStatistics; | ||
| function injectSelectorHash(key, hashId, hashPriority) { | ||
@@ -74,11 +53,9 @@ if (!hashId) { | ||
| } | ||
| var hashClassName = ".".concat(hashId); | ||
| var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName; // 注入 hashId | ||
| var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName; | ||
| // 注入 hashId | ||
| var keys = key.split(',').map(function (k) { | ||
| var _firstPath$match; | ||
| var fullPath = k.trim().split(/\s+/); // 如果 Selector 第一个是 HTML Element，那我们就插到它的后面。反之，就插到最前面。 | ||
| var fullPath = k.trim().split(/\s+/); | ||
| // 如果 Selector 第一个是 HTML Element，那我们就插到它的后面。反之，就插到最前面。 | ||
| var firstPath = fullPath[0] || ''; | ||
@@ -90,20 +67,16 @@ var htmlElement = ((_firstPath$match = firstPath.match(/^\w+/)) === null || _firstPath$match === void 0 ? void 0 : _firstPath$match[0]) || ''; | ||
| return keys.join(','); | ||
| } // Parse CSSObject to style content | ||
| } | ||
| // Parse CSSObject to style content | ||
| var parseStyle = function parseStyle(interpolation) { | ||
| var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
| var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : { | ||
| root: true | ||
| }, | ||
| root = _ref.root, | ||
| injectHash = _ref.injectHash; | ||
| root: true | ||
| }, | ||
| root = _ref.root, | ||
| injectHash = _ref.injectHash; | ||
| var hashId = config.hashId, | ||
| layer = config.layer, | ||
| path = config.path, | ||
| hashPriority = config.hashPriority; | ||
| layer = config.layer, | ||
| path = config.path, | ||
| hashPriority = config.hashPriority; | ||
| var styleStr = ''; | ||
| function parseKeyframes(keyframes) { | ||
@@ -113,3 +86,2 @@ if (animationStatistics[keyframes.getName(hashId)]) { | ||
| } | ||
| animationStatistics[keyframes.getName(hashId)] = true; | ||
@@ -120,3 +92,2 @@ return "@keyframes ".concat(keyframes.getName(hashId)).concat(parseStyle(keyframes.style, config, { | ||
| } | ||
| function flattenList(list) { | ||
@@ -133,3 +104,2 @@ var fullList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : []; | ||
| } | ||
| var flattenStyleList = flattenList(Array.isArray(interpolation) ? interpolation : [interpolation]); | ||
@@ -139,3 +109,2 @@ flattenStyleList.forEach(function (originStyle) { | ||
| var style = typeof originStyle === 'string' && !root ? {} : originStyle; | ||
| if (typeof style === 'string') { | ||
@@ -150,10 +119,9 @@ styleStr += "".concat(style, "\n"); | ||
| var value = style[key]; | ||
| if ((0, _typeof2.default)(value) === 'object' && value && (key !== 'animationName' || !value._keyframe) && !isCompoundCSSProperty(value)) { | ||
| var subInjectHash = false; // 当成嵌套对象来处理 | ||
| var mergedKey = key.trim(); // Whether treat child as root. In most case it is false. | ||
| var nextRoot = false; // 拆分多个选择器 | ||
| var subInjectHash = false; | ||
| // 当成嵌套对象来处理 | ||
| var mergedKey = key.trim(); | ||
| // Whether treat child as root. In most case it is false. | ||
| var nextRoot = false; | ||
| // 拆分多个选择器 | ||
| if ((root || injectHash) && hashId) { | ||
@@ -176,3 +144,2 @@ if (mergedKey.startsWith('@')) { | ||
| } | ||
| styleStr += "".concat(mergedKey).concat(parseStyle(value, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, config), {}, { | ||
@@ -186,5 +153,3 @@ path: "".concat(path, " -> ").concat(mergedKey) | ||
| var _value$value; | ||
| var actualValue = (_value$value = value === null || value === void 0 ? void 0 : value.value) !== null && _value$value !== void 0 ? _value$value : value; | ||
| if (process.env.NODE_ENV !== 'production' && ((0, _typeof2.default)(value) !== 'object' || !(value === null || value === void 0 ? void 0 : value[SKIP_CHECK]))) { | ||
@@ -195,16 +160,13 @@ (0, _util.styleValidate)(key, actualValue, { | ||
| }); | ||
| } // 如果是样式则直接插入 | ||
| } | ||
| // 如果是样式则直接插入 | ||
| var styleName = key.replace(/[A-Z]/g, function (match) { | ||
| return "-".concat(match.toLowerCase()); | ||
| }); // Auto suffix with px | ||
| }); | ||
| // Auto suffix with px | ||
| var formatValue = actualValue; | ||
| if (!_unitless.default[key] && typeof formatValue === 'number' && formatValue !== 0) { | ||
| formatValue = "".concat(formatValue, "px"); | ||
| } // handle animationName & Keyframe value | ||
| } | ||
| // handle animationName & Keyframe value | ||
| if (key === 'animationName' && (value === null || value === void 0 ? void 0 : value._keyframe)) { | ||
@@ -214,3 +176,2 @@ styleStr += parseKeyframes(value); | ||
| } | ||
| styleStr += "".concat(styleName, ":").concat(formatValue, ";"); | ||
@@ -221,3 +182,2 @@ } | ||
| }); | ||
| if (!root) { | ||
@@ -228,4 +188,4 @@ styleStr = "{".concat(styleStr, "}"); | ||
| var layerName = layerCells[layerCells.length - 1].trim(); | ||
| styleStr = "@layer ".concat(layerName, " {").concat(styleStr, "}"); // Order of layer if needed | ||
| styleStr = "@layer ".concat(layerName, " {").concat(styleStr, "}"); | ||
| // Order of layer if needed | ||
| if (layerCells.length > 1) { | ||
@@ -236,15 +196,11 @@ // zombieJ: stylis do not support layer order, so we need to handle it manually. | ||
| } | ||
| return styleStr; | ||
| }; // ============================================================================ | ||
| }; | ||
| // ============================================================================ | ||
| // == Register == | ||
| // ============================================================================ | ||
| exports.parseStyle = parseStyle; | ||
| function uniqueHash(path, styleStr) { | ||
| return (0, _hash.default)("".concat(path.join('%')).concat(styleStr)); | ||
| } | ||
| function Empty() { | ||
@@ -256,72 +212,63 @@ return null; | ||
| */ | ||
| function useStyleRegister(info, styleFn) { | ||
| var token = info.token, | ||
| path = info.path, | ||
| hashId = info.hashId, | ||
| layer = info.layer; | ||
| path = info.path, | ||
| hashId = info.hashId, | ||
| layer = info.layer; | ||
| var _React$useContext = React.useContext(_StyleContext.default), | ||
| autoClear = _React$useContext.autoClear, | ||
| mock = _React$useContext.mock, | ||
| defaultCache = _React$useContext.defaultCache, | ||
| hashPriority = _React$useContext.hashPriority; | ||
| autoClear = _React$useContext.autoClear, | ||
| mock = _React$useContext.mock, | ||
| defaultCache = _React$useContext.defaultCache, | ||
| hashPriority = _React$useContext.hashPriority; | ||
| var tokenKey = token._tokenKey; | ||
| var fullPath = [tokenKey].concat((0, _toConsumableArray2.default)(path)); // Check if need insert style | ||
| var fullPath = [tokenKey].concat((0, _toConsumableArray2.default)(path)); | ||
| // Check if need insert style | ||
| var isMergedClientSide = isClientSide; | ||
| if (process.env.NODE_ENV !== 'production' && mock !== undefined) { | ||
| isMergedClientSide = mock === 'client'; | ||
| } | ||
| var _useGlobalCache = (0, _useGlobalCache3.default)('style', fullPath, // Create cache if needed | ||
| function () { | ||
| var styleObj = styleFn(); | ||
| var styleStr = normalizeStyle(parseStyle(styleObj, { | ||
| hashId: hashId, | ||
| hashPriority: hashPriority, | ||
| layer: layer, | ||
| path: path.join('-') | ||
| })); | ||
| var styleId = uniqueHash(fullPath, styleStr); // Clear animation statistics | ||
| exports.animationStatistics = animationStatistics = {}; | ||
| if (isMergedClientSide) { | ||
| var style = (0, _dynamicCSS.updateCSS)(styleStr, styleId, { | ||
| mark: _StyleContext.ATTR_MARK, | ||
| prepend: 'queue' | ||
| }); | ||
| style[_StyleContext.CSS_IN_JS_INSTANCE] = _StyleContext.CSS_IN_JS_INSTANCE_ID; // Used for `useCacheToken` to remove on batch when token removed | ||
| style.setAttribute(_StyleContext.ATTR_TOKEN, tokenKey); // Dev usage to find which cache path made this easily | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| style.setAttribute(_StyleContext.ATTR_DEV_CACHE_PATH, fullPath.join('|')); | ||
| var _useGlobalCache = (0, _useGlobalCache3.default)('style', fullPath, | ||
| // Create cache if needed | ||
| function () { | ||
| var styleObj = styleFn(); | ||
| var styleStr = normalizeStyle(parseStyle(styleObj, { | ||
| hashId: hashId, | ||
| hashPriority: hashPriority, | ||
| layer: layer, | ||
| path: path.join('-') | ||
| })); | ||
| var styleId = uniqueHash(fullPath, styleStr); | ||
| // Clear animation statistics | ||
| exports.animationStatistics = animationStatistics = {}; | ||
| if (isMergedClientSide) { | ||
| var style = (0, _dynamicCSS.updateCSS)(styleStr, styleId, { | ||
| mark: _StyleContext.ATTR_MARK, | ||
| prepend: 'queue' | ||
| }); | ||
| style[_StyleContext.CSS_IN_JS_INSTANCE] = _StyleContext.CSS_IN_JS_INSTANCE_ID; | ||
| // Used for `useCacheToken` to remove on batch when token removed | ||
| style.setAttribute(_StyleContext.ATTR_TOKEN, tokenKey); | ||
| // Dev usage to find which cache path made this easily | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| style.setAttribute(_StyleContext.ATTR_DEV_CACHE_PATH, fullPath.join('|')); | ||
| } | ||
| } | ||
| } | ||
| return [styleStr, tokenKey, styleId]; | ||
| }, // Remove cache if no need | ||
| function (_ref2, fromHMR) { | ||
| var _ref3 = (0, _slicedToArray2.default)(_ref2, 3), | ||
| return [styleStr, tokenKey, styleId]; | ||
| }, | ||
| // Remove cache if no need | ||
| function (_ref2, fromHMR) { | ||
| var _ref3 = (0, _slicedToArray2.default)(_ref2, 3), | ||
| styleId = _ref3[2]; | ||
| if ((fromHMR || autoClear) && isClientSide) { | ||
| (0, _dynamicCSS.removeCSS)(styleId, { | ||
| mark: _StyleContext.ATTR_MARK | ||
| }); | ||
| } | ||
| }), | ||
| _useGlobalCache2 = (0, _slicedToArray2.default)(_useGlobalCache, 3), | ||
| cachedStyleStr = _useGlobalCache2[0], | ||
| cachedTokenKey = _useGlobalCache2[1], | ||
| cachedStyleId = _useGlobalCache2[2]; | ||
| if ((fromHMR || autoClear) && isClientSide) { | ||
| (0, _dynamicCSS.removeCSS)(styleId, { | ||
| mark: _StyleContext.ATTR_MARK | ||
| }); | ||
| } | ||
| }), | ||
| _useGlobalCache2 = (0, _slicedToArray2.default)(_useGlobalCache, 3), | ||
| cachedStyleStr = _useGlobalCache2[0], | ||
| cachedTokenKey = _useGlobalCache2[1], | ||
| cachedStyleId = _useGlobalCache2[2]; | ||
| return function (node) { | ||
| var styleNode; | ||
| if (isMergedClientSide || !defaultCache) { | ||
@@ -331,3 +278,2 @@ styleNode = /*#__PURE__*/React.createElement(Empty, null); | ||
| var _objectSpread2; | ||
| styleNode = /*#__PURE__*/React.createElement("style", (0, _objectSpread3.default)((0, _objectSpread3.default)({}, (_objectSpread2 = {}, (0, _defineProperty2.default)(_objectSpread2, _StyleContext.ATTR_TOKEN, cachedTokenKey), (0, _defineProperty2.default)(_objectSpread2, _StyleContext.ATTR_MARK, cachedStyleId), _objectSpread2)), {}, { | ||
@@ -339,10 +285,8 @@ dangerouslySetInnerHTML: { | ||
| } | ||
| return /*#__PURE__*/React.createElement(React.Fragment, null, styleNode, node); | ||
| }; | ||
| } // ============================================================================ | ||
| } | ||
| // ============================================================================ | ||
| // == SSR == | ||
| // ============================================================================ | ||
| function extractStyle(cache) { | ||
@@ -352,11 +296,10 @@ // prefix with `style` is used for `useStyleRegister` to cache style context | ||
| return key.startsWith('style%'); | ||
| }); // const tokenStyles: Record<string, string[]> = {}; | ||
| }); | ||
| // const tokenStyles: Record<string, string[]> = {}; | ||
| var styleText = ''; | ||
| styleKeys.forEach(function (key) { | ||
| var _cache$cache$get$ = (0, _slicedToArray2.default)(cache.cache.get(key)[1], 3), | ||
| styleStr = _cache$cache$get$[0], | ||
| tokenKey = _cache$cache$get$[1], | ||
| styleId = _cache$cache$get$[2]; | ||
| styleStr = _cache$cache$get$[0], | ||
| tokenKey = _cache$cache$get$[1], | ||
| styleId = _cache$cache$get$[2]; | ||
| styleText += "<style ".concat(_StyleContext.ATTR_TOKEN, "=\"").concat(tokenKey, "\" ").concat(_StyleContext.ATTR_MARK, "=\"").concat(styleId, "\">").concat(styleStr, "</style>"); | ||
@@ -363,0 +306,0 @@ }); |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| var _typeof = require("@babel/runtime/helpers/typeof"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -58,15 +56,8 @@ value: true | ||
| }); | ||
| var _useStyleRegister = _interopRequireWildcard(require("./hooks/useStyleRegister")); | ||
| var _useCacheToken = _interopRequireDefault(require("./hooks/useCacheToken")); | ||
| var _StyleContext = require("./StyleContext"); | ||
| var _Keyframes = _interopRequireDefault(require("./Keyframes")); | ||
| var _theme = require("./theme"); | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -9,7 +8,4 @@ value: true | ||
| exports.default = void 0; | ||
| var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); | ||
| var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); | ||
| var Keyframe = /*#__PURE__*/function () { | ||
@@ -24,3 +20,2 @@ function Keyframe(name, style) { | ||
| } | ||
| (0, _createClass2.default)(Keyframe, [{ | ||
@@ -35,4 +30,3 @@ key: "getName", | ||
| }(); | ||
| var _default = Keyframe; | ||
| exports.default = _default; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| var _typeof = require("@babel/runtime/helpers/typeof"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -13,11 +11,6 @@ value: true | ||
| exports.default = void 0; | ||
| var React = _interopRequireWildcard(require("react")); | ||
| var _Cache = _interopRequireDefault(require("./Cache")); | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } | ||
| var ATTR_TOKEN = 'data-token-hash'; | ||
@@ -27,4 +20,4 @@ exports.ATTR_TOKEN = ATTR_TOKEN; | ||
| exports.ATTR_MARK = ATTR_MARK; | ||
| var ATTR_DEV_CACHE_PATH = 'data-dev-cache-path'; // Mark css-in-js instance in style element | ||
| var ATTR_DEV_CACHE_PATH = 'data-dev-cache-path'; | ||
| // Mark css-in-js instance in style element | ||
| exports.ATTR_DEV_CACHE_PATH = ATTR_DEV_CACHE_PATH; | ||
@@ -35,19 +28,17 @@ var CSS_IN_JS_INSTANCE = '__cssinjs_instance__'; | ||
| exports.CSS_IN_JS_INSTANCE_ID = CSS_IN_JS_INSTANCE_ID; | ||
| function createCache() { | ||
| if (typeof document !== 'undefined') { | ||
| var styles = document.body.querySelectorAll("style[".concat(ATTR_MARK, "]")); | ||
| var firstChild = document.head.firstChild; | ||
| Array.from(styles).forEach(function (style) { | ||
| style[CSS_IN_JS_INSTANCE] = style[CSS_IN_JS_INSTANCE] || CSS_IN_JS_INSTANCE_ID; | ||
| document.head.appendChild(style); | ||
| }); // Deduplicate of moved styles | ||
| document.head.insertBefore(style, firstChild); | ||
| }); | ||
| // Deduplicate of moved styles | ||
| var styleHash = {}; | ||
| Array.from(document.querySelectorAll("style[".concat(ATTR_MARK, "]"))).forEach(function (style) { | ||
| var hash = style.getAttribute(ATTR_MARK); | ||
| if (styleHash[hash]) { | ||
| if (style[CSS_IN_JS_INSTANCE] === CSS_IN_JS_INSTANCE_ID) { | ||
| var _style$parentNode; | ||
| (_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style); | ||
@@ -60,6 +51,4 @@ } | ||
| } | ||
| return new _Cache.default(); | ||
| } | ||
| var StyleContext = /*#__PURE__*/React.createContext({ | ||
@@ -70,17 +59,14 @@ hashPriority: 'low', | ||
| }); | ||
| var StyleProvider = function StyleProvider(props) { | ||
| var autoClear = props.autoClear, | ||
| mock = props.mock, | ||
| cache = props.cache, | ||
| hashPriority = props.hashPriority, | ||
| children = props.children; | ||
| mock = props.mock, | ||
| cache = props.cache, | ||
| hashPriority = props.hashPriority, | ||
| children = props.children; | ||
| var _React$useContext = React.useContext(StyleContext), | ||
| parentCache = _React$useContext.cache, | ||
| parentAutoClear = _React$useContext.autoClear, | ||
| parentMock = _React$useContext.mock, | ||
| parentDefaultCache = _React$useContext.defaultCache, | ||
| parentHashPriority = _React$useContext.hashPriority; | ||
| parentCache = _React$useContext.cache, | ||
| parentAutoClear = _React$useContext.autoClear, | ||
| parentMock = _React$useContext.mock, | ||
| parentDefaultCache = _React$useContext.defaultCache, | ||
| parentHashPriority = _React$useContext.hashPriority; | ||
| var context = React.useMemo(function () { | ||
@@ -99,5 +85,4 @@ return { | ||
| }; | ||
| exports.StyleProvider = StyleProvider; | ||
| var _default = StyleContext; | ||
| exports.default = _default; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -9,7 +8,4 @@ value: true | ||
| exports.default = createTheme; | ||
| var _ThemeCache = _interopRequireDefault(require("./ThemeCache")); | ||
| var _Theme = _interopRequireDefault(require("./Theme")); | ||
| var cacheThemes = new _ThemeCache.default(); | ||
@@ -19,12 +15,10 @@ /** | ||
| */ | ||
| function createTheme(derivatives) { | ||
| var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives]; // Create new theme if not exist | ||
| var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives]; | ||
| // Create new theme if not exist | ||
| if (!cacheThemes.has(derivativeArr)) { | ||
| cacheThemes.set(derivativeArr, new _Theme.default(derivativeArr)); | ||
| } // Get theme from cache and return | ||
| } | ||
| // Get theme from cache and return | ||
| return cacheThemes.get(derivativeArr); | ||
| } |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -26,7 +25,4 @@ value: true | ||
| }); | ||
| var _createTheme = _interopRequireDefault(require("./createTheme")); | ||
| var _Theme = _interopRequireDefault(require("./Theme")); | ||
| var _ThemeCache = _interopRequireDefault(require("./ThemeCache")); |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -9,9 +8,5 @@ value: true | ||
| exports.default = void 0; | ||
| var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); | ||
| var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); | ||
| var _warning = require("rc-util/lib/warning"); | ||
| var uuid = 0; | ||
@@ -22,3 +17,2 @@ /** | ||
| */ | ||
| var Theme = /*#__PURE__*/function () { | ||
@@ -31,10 +25,7 @@ function Theme(derivatives) { | ||
| this.id = uuid; | ||
| if (derivatives.length === 0) { | ||
| (0, _warning.warning)(derivatives.length > 0, '[Ant Design CSS-in-JS] Theme should have at least one derivative function.'); | ||
| } | ||
| uuid += 1; | ||
| } | ||
| (0, _createClass2.default)(Theme, [{ | ||
@@ -50,3 +41,2 @@ key: "getDerivativeToken", | ||
| }(); | ||
| exports.default = Theme; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -10,9 +9,5 @@ value: true | ||
| exports.sameDerivativeOption = sameDerivativeOption; | ||
| var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); | ||
| var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); | ||
| var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); | ||
| function sameDerivativeOption(left, right) { | ||
@@ -22,3 +17,2 @@ if (left.length !== right.length) { | ||
| } | ||
| for (var i = 0; i < left.length; i++) { | ||
@@ -29,6 +23,4 @@ if (left[i] !== right[i]) { | ||
| } | ||
| return true; | ||
| } | ||
| var ThemeCache = /*#__PURE__*/function () { | ||
@@ -44,3 +36,2 @@ function ThemeCache() { | ||
| } | ||
| (0, _createClass2.default)(ThemeCache, [{ | ||
@@ -55,3 +46,2 @@ key: "size", | ||
| var _cache2, _cache3; | ||
| var updateCallTimes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; | ||
@@ -66,11 +56,8 @@ var cache = { | ||
| var _cache, _cache$map; | ||
| cache = (_cache = cache) === null || _cache === void 0 ? void 0 : (_cache$map = _cache.map) === null || _cache$map === void 0 ? void 0 : _cache$map.get(derivative); | ||
| } | ||
| }); | ||
| if (((_cache2 = cache) === null || _cache2 === void 0 ? void 0 : _cache2.value) && updateCallTimes) { | ||
| cache.value[1] = this.cacheCallTimes++; | ||
| } | ||
| return (_cache3 = cache) === null || _cache3 === void 0 ? void 0 : _cache3.value; | ||
@@ -82,3 +69,2 @@ } | ||
| var _this$internalGet; | ||
| return (_this$internalGet = this.internalGet(derivativeOption, true)) === null || _this$internalGet === void 0 ? void 0 : _this$internalGet[0]; | ||
@@ -95,3 +81,2 @@ } | ||
| var _this = this; | ||
| // New cache | ||
@@ -101,20 +86,15 @@ if (!this.has(derivativeOption)) { | ||
| var _this$keys$reduce = this.keys.reduce(function (result, key) { | ||
| var _result = (0, _slicedToArray2.default)(result, 2), | ||
| var _result = (0, _slicedToArray2.default)(result, 2), | ||
| callTimes = _result[1]; | ||
| if (_this.internalGet(key)[1] < callTimes) { | ||
| return [key, _this.internalGet(key)[1]]; | ||
| } | ||
| return result; | ||
| }, [this.keys[0], this.cacheCallTimes]), | ||
| _this$keys$reduce2 = (0, _slicedToArray2.default)(_this$keys$reduce, 1), | ||
| targetKey = _this$keys$reduce2[0]; | ||
| if (_this.internalGet(key)[1] < callTimes) { | ||
| return [key, _this.internalGet(key)[1]]; | ||
| } | ||
| return result; | ||
| }, [this.keys[0], this.cacheCallTimes]), | ||
| _this$keys$reduce2 = (0, _slicedToArray2.default)(_this$keys$reduce, 1), | ||
| targetKey = _this$keys$reduce2[0]; | ||
| this.delete(targetKey); | ||
| } | ||
| this.keys.push(derivativeOption); | ||
| } | ||
| var cache = this.cache; | ||
@@ -128,3 +108,2 @@ derivativeOption.forEach(function (derivative, index) { | ||
| var cacheValue = cache.get(derivative); | ||
| if (!cacheValue) { | ||
@@ -137,3 +116,2 @@ cache.set(derivative, { | ||
| } | ||
| cache = cache.get(derivative).map; | ||
@@ -147,6 +125,4 @@ } | ||
| var cache = currentCache.get(derivatives[0]); | ||
| if (derivatives.length === 1) { | ||
| var _cache$value; | ||
| if (!cache.map) { | ||
@@ -159,12 +135,8 @@ currentCache.delete(derivatives[0]); | ||
| } | ||
| return (_cache$value = cache.value) === null || _cache$value === void 0 ? void 0 : _cache$value[0]; | ||
| } | ||
| var result = this.deleteByPath(cache.map, derivatives.slice(1)); | ||
| if ((!cache.map || cache.map.size === 0) && !cache.value) { | ||
| currentCache.delete(derivatives[0]); | ||
| } | ||
| return result; | ||
@@ -182,3 +154,2 @@ } | ||
| } | ||
| return undefined; | ||
@@ -189,5 +160,4 @@ } | ||
| }(); | ||
| exports.default = ThemeCache; | ||
| ThemeCache.MAX_CACHE_SIZE = 20; | ||
| ThemeCache.MAX_CACHE_OFFSET = 5; |
| "use strict"; | ||
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -13,13 +12,7 @@ value: true | ||
| exports.warning = warning; | ||
| var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof")); | ||
| var _hash = _interopRequireDefault(require("@emotion/hash")); | ||
| var _warning = _interopRequireDefault(require("rc-util/lib/warning")); | ||
| var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS"); | ||
| var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom")); | ||
| function flattenToken(token) { | ||
@@ -30,3 +23,2 @@ var str = ''; | ||
| str += key; | ||
| if (value && (0, _typeof2.default)(value) === 'object') { | ||
@@ -43,17 +35,12 @@ str += flattenToken(value); | ||
| */ | ||
| function token2key(token, slat) { | ||
| return (0, _hash.default)("".concat(slat, "_").concat(flattenToken(token))); | ||
| } | ||
| function warning(message, path) { | ||
| (0, _warning.default)(false, "[Ant Design CSS-in-JS] ".concat(path ? "Error in '".concat(path, "': ") : '').concat(message)); | ||
| } | ||
| var styleValidate = function styleValidate(key, value) { | ||
| var info = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
| var path = info.path, | ||
| hashId = info.hashId; | ||
| hashId = info.hashId; | ||
| switch (key) { | ||
@@ -64,9 +51,6 @@ case 'content': | ||
| var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset']; | ||
| 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) !== "'")) { | ||
| warning("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"".concat(value, "\"'`"), path); | ||
| } | ||
| return; | ||
| case 'marginLeft': | ||
@@ -92,3 +76,2 @@ case 'marginRight': | ||
| return; | ||
| case 'margin': | ||
@@ -103,3 +86,2 @@ case 'padding': | ||
| }); | ||
| if (valueArr.length === 4 && valueArr[1] !== valueArr[3]) { | ||
@@ -109,5 +91,3 @@ warning("You seem to be using '".concat(key, "' property with different left ").concat(key, " and right ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), path); | ||
| } | ||
| return; | ||
| case 'clear': | ||
@@ -118,5 +98,3 @@ case 'textAlign': | ||
| } | ||
| return; | ||
| case 'borderRadius': | ||
@@ -131,24 +109,19 @@ if (typeof value === 'string') { | ||
| } | ||
| var radiusArr = group.split(' ').map(function (item) { | ||
| return item.trim(); | ||
| }); // borderRadius: '2px 4px' | ||
| }); | ||
| // borderRadius: '2px 4px' | ||
| if (radiusArr.length >= 2 && radiusArr[0] !== radiusArr[1]) { | ||
| return true; | ||
| } // borderRadius: '4px 4px 2px' | ||
| } | ||
| // borderRadius: '4px 4px 2px' | ||
| if (radiusArr.length === 3 && radiusArr[1] !== radiusArr[2]) { | ||
| return true; | ||
| } // borderRadius: '4px 4px 2px 4px' | ||
| } | ||
| // borderRadius: '4px 4px 2px 4px' | ||
| if (radiusArr.length === 4 && radiusArr[2] !== radiusArr[3]) { | ||
| return true; | ||
| } | ||
| return result; | ||
| }, false); | ||
| if (invalid) { | ||
@@ -158,5 +131,3 @@ warning("You seem to be using non-logical value '".concat(value, "' of ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), path); | ||
| } | ||
| return; | ||
| case 'animation': | ||
@@ -166,3 +137,2 @@ if (hashId && value !== 'none') { | ||
| } | ||
| default: | ||
@@ -172,11 +142,8 @@ return; | ||
| }; | ||
| exports.styleValidate = styleValidate; | ||
| var layerKey = "layer-".concat(Date.now(), "-").concat(Math.random()).replace(/\./g, ''); | ||
| var layerWidth = '903px'; | ||
| function supportSelector(styleStr, handleElement) { | ||
| if ((0, _canUseDom.default)()) { | ||
| var _ele$parentNode; | ||
| (0, _dynamicCSS.updateCSS)(styleStr, layerKey); | ||
@@ -189,3 +156,2 @@ var ele = document.createElement('div'); | ||
| document.body.appendChild(ele); | ||
| if (process.env.NODE_ENV !== 'production') { | ||
@@ -195,3 +161,2 @@ ele.innerHTML = 'Test'; | ||
| } | ||
| var support = getComputedStyle(ele).width === layerWidth; | ||
@@ -202,8 +167,5 @@ (_ele$parentNode = ele.parentNode) === null || _ele$parentNode === void 0 ? void 0 : _ele$parentNode.removeChild(ele); | ||
| } | ||
| return false; | ||
| } | ||
| var canLayer = undefined; | ||
| function supportLayer() { | ||
@@ -215,4 +177,3 @@ if (canLayer === undefined) { | ||
| } | ||
| return canLayer; | ||
| } |
| { | ||
| "name": "@ant-design/cssinjs", | ||
| "version": "0.0.0-alpha.54", | ||
| "version": "0.0.0-alpha.60", | ||
| "description": "Component level cssinjs resolution for antd", | ||
@@ -85,9 +85,3 @@ "keywords": [ | ||
| } | ||
| }, | ||
| "cnpm": { | ||
| "mode": "npm" | ||
| }, | ||
| "tnpm": { | ||
| "mode": "npm" | ||
| } | ||
| } |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by3.36%
2335
Worsened metrics
- Total package byte prevSize
- decreased by-0.08%
106613
No dependency changes