cs
This commit is contained in:
20
node_modules/@ant-design/cssinjs/lib/hooks/useCSSVarRegister.d.ts
generated
vendored
Normal file
20
node_modules/@ant-design/cssinjs/lib/hooks/useCSSVarRegister.d.ts
generated
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
import type { TokenWithCSSVar } from '../util/css-variables';
|
||||
import type { ExtractStyle } from './useGlobalCache';
|
||||
export declare const CSS_VAR_PREFIX = "cssVar";
|
||||
type CSSVarCacheValue<V, T extends Record<string, V> = Record<string, V>> = [
|
||||
cssVarToken: TokenWithCSSVar<V, T>,
|
||||
cssVarStr: string,
|
||||
styleId: string,
|
||||
cssVarKey: string
|
||||
];
|
||||
declare const useCSSVarRegister: <V, T extends Record<string, V>>(config: {
|
||||
path: string[];
|
||||
key: string;
|
||||
prefix?: string;
|
||||
unitless?: Record<string, boolean>;
|
||||
ignore?: Record<string, boolean>;
|
||||
scope?: string;
|
||||
token: any;
|
||||
}, fn: () => T) => CSSVarCacheValue<V, T>;
|
||||
export declare const extract: ExtractStyle<CSSVarCacheValue<any>>;
|
||||
export default useCSSVarRegister;
|
||||
97
node_modules/@ant-design/cssinjs/lib/hooks/useCSSVarRegister.js
generated
vendored
Normal file
97
node_modules/@ant-design/cssinjs/lib/hooks/useCSSVarRegister.js
generated
vendored
Normal file
@@ -0,0 +1,97 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.extract = exports.default = exports.CSS_VAR_PREFIX = void 0;
|
||||
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
||||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
||||
var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS");
|
||||
var _react = require("react");
|
||||
var _StyleContext = _interopRequireWildcard(require("../StyleContext"));
|
||||
var _util = require("../util");
|
||||
var _cssVariables = require("../util/css-variables");
|
||||
var _useGlobalCache = _interopRequireDefault(require("./useGlobalCache"));
|
||||
var _useStyleRegister = require("./useStyleRegister");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
var CSS_VAR_PREFIX = exports.CSS_VAR_PREFIX = 'cssVar';
|
||||
var useCSSVarRegister = function useCSSVarRegister(config, fn) {
|
||||
var key = config.key,
|
||||
prefix = config.prefix,
|
||||
unitless = config.unitless,
|
||||
ignore = config.ignore,
|
||||
token = config.token,
|
||||
_config$scope = config.scope,
|
||||
scope = _config$scope === void 0 ? '' : _config$scope;
|
||||
var _useContext = (0, _react.useContext)(_StyleContext.default),
|
||||
instanceId = _useContext.cache.instanceId,
|
||||
container = _useContext.container;
|
||||
var tokenKey = token._tokenKey;
|
||||
var stylePath = [].concat((0, _toConsumableArray2.default)(config.path), [key, scope, tokenKey]);
|
||||
var cache = (0, _useGlobalCache.default)(CSS_VAR_PREFIX, stylePath, function () {
|
||||
var originToken = fn();
|
||||
var _transformToken = (0, _cssVariables.transformToken)(originToken, key, {
|
||||
prefix: prefix,
|
||||
unitless: unitless,
|
||||
ignore: ignore,
|
||||
scope: scope
|
||||
}),
|
||||
_transformToken2 = (0, _slicedToArray2.default)(_transformToken, 2),
|
||||
mergedToken = _transformToken2[0],
|
||||
cssVarsStr = _transformToken2[1];
|
||||
var styleId = (0, _useStyleRegister.uniqueHash)(stylePath, cssVarsStr);
|
||||
return [mergedToken, cssVarsStr, styleId, key];
|
||||
}, function (_ref) {
|
||||
var _ref2 = (0, _slicedToArray2.default)(_ref, 3),
|
||||
styleId = _ref2[2];
|
||||
if (_util.isClientSide) {
|
||||
(0, _dynamicCSS.removeCSS)(styleId, {
|
||||
mark: _StyleContext.ATTR_MARK,
|
||||
attachTo: container
|
||||
});
|
||||
}
|
||||
}, function (_ref3) {
|
||||
var _ref4 = (0, _slicedToArray2.default)(_ref3, 3),
|
||||
cssVarsStr = _ref4[1],
|
||||
styleId = _ref4[2];
|
||||
if (!cssVarsStr) {
|
||||
return;
|
||||
}
|
||||
var style = (0, _dynamicCSS.updateCSS)(cssVarsStr, styleId, {
|
||||
mark: _StyleContext.ATTR_MARK,
|
||||
prepend: 'queue',
|
||||
attachTo: container,
|
||||
priority: -999
|
||||
});
|
||||
style[_StyleContext.CSS_IN_JS_INSTANCE] = instanceId;
|
||||
|
||||
// Used for `useCacheToken` to remove on batch when token removed
|
||||
style.setAttribute(_StyleContext.ATTR_TOKEN, key);
|
||||
});
|
||||
return cache;
|
||||
};
|
||||
var extract = exports.extract = function extract(cache, effectStyles, options) {
|
||||
var _cache = (0, _slicedToArray2.default)(cache, 4),
|
||||
styleStr = _cache[1],
|
||||
styleId = _cache[2],
|
||||
cssVarKey = _cache[3];
|
||||
var _ref5 = options || {},
|
||||
plain = _ref5.plain;
|
||||
if (!styleStr) {
|
||||
return null;
|
||||
}
|
||||
var order = -999;
|
||||
|
||||
// ====================== Style ======================
|
||||
// Used for rc-util
|
||||
var sharedAttrs = {
|
||||
'data-rc-order': 'prependQueue',
|
||||
'data-rc-priority': "".concat(order)
|
||||
};
|
||||
var styleText = (0, _util.toStyleStr)(styleStr, cssVarKey, styleId, sharedAttrs, plain);
|
||||
return [order, styleId, styleText];
|
||||
};
|
||||
var _default = exports.default = useCSSVarRegister;
|
||||
68
node_modules/@ant-design/cssinjs/lib/hooks/useCacheToken.d.ts
generated
vendored
Normal file
68
node_modules/@ant-design/cssinjs/lib/hooks/useCacheToken.d.ts
generated
vendored
Normal file
@@ -0,0 +1,68 @@
|
||||
import type Theme from '../theme/Theme';
|
||||
import type { ExtractStyle } from './useGlobalCache';
|
||||
export interface Option<DerivativeToken, DesignToken> {
|
||||
/**
|
||||
* Generate token with salt.
|
||||
* This is used to generate different hashId even same derivative token for different version.
|
||||
*/
|
||||
salt?: string;
|
||||
override?: object;
|
||||
/**
|
||||
* Format token as you need. Such as:
|
||||
*
|
||||
* - rename token
|
||||
* - merge token
|
||||
* - delete token
|
||||
*
|
||||
* This should always be the same since it's one time process.
|
||||
* It's ok to useMemo outside but this has better cache strategy.
|
||||
*/
|
||||
formatToken?: (mergedToken: any) => DerivativeToken;
|
||||
/**
|
||||
* Get final token with origin token, override token and theme.
|
||||
* The parameters do not contain formatToken since it's passed by user.
|
||||
* @param origin The original token.
|
||||
* @param override Extra tokens to override.
|
||||
* @param theme Theme instance. Could get derivative token by `theme.getDerivativeToken`
|
||||
*/
|
||||
getComputedToken?: (origin: DesignToken, override: object, theme: Theme<any, any>) => DerivativeToken;
|
||||
/**
|
||||
* Transform token to css variables.
|
||||
*/
|
||||
cssVar?: {
|
||||
/** Prefix for css variables */
|
||||
prefix?: string;
|
||||
/** Tokens that should not be appended with unit */
|
||||
unitless?: Record<string, boolean>;
|
||||
/** Tokens that should not be transformed to css variables */
|
||||
ignore?: Record<string, boolean>;
|
||||
/** Tokens that preserves origin value */
|
||||
preserve?: Record<string, boolean>;
|
||||
/** Key for current theme. Useful for customizing and should be unique */
|
||||
key?: string;
|
||||
};
|
||||
}
|
||||
export declare const getComputedToken: <DerivativeToken = object, DesignToken = DerivativeToken>(originToken: DesignToken, overrideToken: object, theme: Theme<any, any>, format?: ((token: DesignToken) => DerivativeToken) | undefined) => any;
|
||||
export declare const TOKEN_PREFIX = "token";
|
||||
type TokenCacheValue<DerivativeToken> = [
|
||||
token: DerivativeToken & {
|
||||
_tokenKey: string;
|
||||
_themeKey: string;
|
||||
},
|
||||
hashId: string,
|
||||
realToken: DerivativeToken & {
|
||||
_tokenKey: string;
|
||||
},
|
||||
cssVarStr: string,
|
||||
cssVarKey: string
|
||||
];
|
||||
/**
|
||||
* Cache theme derivative token as global shared one
|
||||
* @param theme Theme entity
|
||||
* @param tokens List of tokens, used for cache. Please do not dynamic generate object directly
|
||||
* @param option Additional config
|
||||
* @returns Call Theme.getDerivativeToken(tokenObject) to get token
|
||||
*/
|
||||
export default function useCacheToken<DerivativeToken = object, DesignToken = DerivativeToken>(theme: Theme<any, any>, tokens: Partial<DesignToken>[], option?: Option<DerivativeToken, DesignToken>): TokenCacheValue<DerivativeToken>;
|
||||
export declare const extract: ExtractStyle<TokenCacheValue<any>>;
|
||||
export {};
|
||||
174
node_modules/@ant-design/cssinjs/lib/hooks/useCacheToken.js
generated
vendored
Normal file
174
node_modules/@ant-design/cssinjs/lib/hooks/useCacheToken.js
generated
vendored
Normal file
@@ -0,0 +1,174 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.TOKEN_PREFIX = void 0;
|
||||
exports.default = useCacheToken;
|
||||
exports.getComputedToken = exports.extract = void 0;
|
||||
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
||||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
||||
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
||||
var _hash = _interopRequireDefault(require("@emotion/hash"));
|
||||
var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS");
|
||||
var _react = require("react");
|
||||
var _StyleContext = _interopRequireWildcard(require("../StyleContext"));
|
||||
var _util = require("../util");
|
||||
var _cssVariables = require("../util/css-variables");
|
||||
var _useGlobalCache = _interopRequireDefault(require("./useGlobalCache"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
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, instanceId) {
|
||||
if (typeof document !== 'undefined') {
|
||||
var styles = document.querySelectorAll("style[".concat(_StyleContext.ATTR_TOKEN, "=\"").concat(key, "\"]"));
|
||||
styles.forEach(function (style) {
|
||||
if (style[_StyleContext.CSS_IN_JS_INSTANCE] === instanceId) {
|
||||
var _style$parentNode;
|
||||
(_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 || _style$parentNode.removeChild(style);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
var TOKEN_THRESHOLD = 0;
|
||||
|
||||
// Remove will check current keys first
|
||||
function cleanTokenStyle(tokenKey, instanceId) {
|
||||
tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) - 1);
|
||||
var cleanableKeyList = new Set();
|
||||
tokenKeys.forEach(function (value, key) {
|
||||
if (value <= 0) cleanableKeyList.add(key);
|
||||
});
|
||||
|
||||
// Should keep tokens under threshold for not to insert style too often
|
||||
if (tokenKeys.size - cleanableKeyList.size > TOKEN_THRESHOLD) {
|
||||
cleanableKeyList.forEach(function (key) {
|
||||
removeStyleTags(key, instanceId);
|
||||
tokenKeys.delete(key);
|
||||
});
|
||||
}
|
||||
}
|
||||
var getComputedToken = exports.getComputedToken = function getComputedToken(originToken, overrideToken, theme, format) {
|
||||
var derivativeToken = theme.getDerivativeToken(originToken);
|
||||
|
||||
// Merge with override
|
||||
var mergedDerivativeToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, derivativeToken), overrideToken);
|
||||
|
||||
// Format if needed
|
||||
if (format) {
|
||||
mergedDerivativeToken = format(mergedDerivativeToken);
|
||||
}
|
||||
return mergedDerivativeToken;
|
||||
};
|
||||
var TOKEN_PREFIX = exports.TOKEN_PREFIX = 'token';
|
||||
/**
|
||||
* Cache theme derivative token as global shared one
|
||||
* @param theme Theme entity
|
||||
* @param tokens List of tokens, used for cache. Please do not dynamic generate object directly
|
||||
* @param option Additional config
|
||||
* @returns Call Theme.getDerivativeToken(tokenObject) to get token
|
||||
*/
|
||||
function useCacheToken(theme, tokens) {
|
||||
var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
||||
var _useContext = (0, _react.useContext)(_StyleContext.default),
|
||||
instanceId = _useContext.cache.instanceId,
|
||||
container = _useContext.container;
|
||||
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,
|
||||
compute = option.getComputedToken,
|
||||
cssVar = option.cssVar;
|
||||
|
||||
// Basic - We do basic cache here
|
||||
var mergedToken = (0, _util.memoResult)(function () {
|
||||
return Object.assign.apply(Object, [{}].concat((0, _toConsumableArray2.default)(tokens)));
|
||||
}, tokens);
|
||||
var tokenStr = (0, _util.flattenToken)(mergedToken);
|
||||
var overrideTokenStr = (0, _util.flattenToken)(override);
|
||||
var cssVarStr = cssVar ? (0, _util.flattenToken)(cssVar) : '';
|
||||
var cachedToken = (0, _useGlobalCache.default)(TOKEN_PREFIX, [salt, theme.id, tokenStr, overrideTokenStr, cssVarStr], function () {
|
||||
var _cssVar$key;
|
||||
var mergedDerivativeToken = compute ? compute(mergedToken, override, theme) : getComputedToken(mergedToken, override, theme, formatToken);
|
||||
|
||||
// Replace token value with css variables
|
||||
var actualToken = (0, _objectSpread2.default)({}, mergedDerivativeToken);
|
||||
var cssVarsStr = '';
|
||||
if (!!cssVar) {
|
||||
var _transformToken = (0, _cssVariables.transformToken)(mergedDerivativeToken, cssVar.key, {
|
||||
prefix: cssVar.prefix,
|
||||
ignore: cssVar.ignore,
|
||||
unitless: cssVar.unitless,
|
||||
preserve: cssVar.preserve
|
||||
});
|
||||
var _transformToken2 = (0, _slicedToArray2.default)(_transformToken, 2);
|
||||
mergedDerivativeToken = _transformToken2[0];
|
||||
cssVarsStr = _transformToken2[1];
|
||||
}
|
||||
|
||||
// Optimize for `useStyleRegister` performance
|
||||
var tokenKey = (0, _util.token2key)(mergedDerivativeToken, salt);
|
||||
mergedDerivativeToken._tokenKey = tokenKey;
|
||||
actualToken._tokenKey = (0, _util.token2key)(actualToken, salt);
|
||||
var themeKey = (_cssVar$key = cssVar === null || cssVar === void 0 ? void 0 : cssVar.key) !== null && _cssVar$key !== void 0 ? _cssVar$key : tokenKey;
|
||||
mergedDerivativeToken._themeKey = themeKey;
|
||||
recordCleanToken(themeKey);
|
||||
var hashId = "".concat(hashPrefix, "-").concat((0, _hash.default)(tokenKey));
|
||||
mergedDerivativeToken._hashId = hashId; // Not used
|
||||
|
||||
return [mergedDerivativeToken, hashId, actualToken, cssVarsStr, (cssVar === null || cssVar === void 0 ? void 0 : cssVar.key) || ''];
|
||||
}, function (cache) {
|
||||
// Remove token will remove all related style
|
||||
cleanTokenStyle(cache[0]._themeKey, instanceId);
|
||||
}, function (_ref) {
|
||||
var _ref2 = (0, _slicedToArray2.default)(_ref, 4),
|
||||
token = _ref2[0],
|
||||
cssVarsStr = _ref2[3];
|
||||
if (cssVar && cssVarsStr) {
|
||||
var style = (0, _dynamicCSS.updateCSS)(cssVarsStr, (0, _hash.default)("css-variables-".concat(token._themeKey)), {
|
||||
mark: _StyleContext.ATTR_MARK,
|
||||
prepend: 'queue',
|
||||
attachTo: container,
|
||||
priority: -999
|
||||
});
|
||||
style[_StyleContext.CSS_IN_JS_INSTANCE] = instanceId;
|
||||
|
||||
// Used for `useCacheToken` to remove on batch when token removed
|
||||
style.setAttribute(_StyleContext.ATTR_TOKEN, token._themeKey);
|
||||
}
|
||||
});
|
||||
return cachedToken;
|
||||
}
|
||||
var extract = exports.extract = function extract(cache, effectStyles, options) {
|
||||
var _cache = (0, _slicedToArray2.default)(cache, 5),
|
||||
realToken = _cache[2],
|
||||
styleStr = _cache[3],
|
||||
cssVarKey = _cache[4];
|
||||
var _ref3 = options || {},
|
||||
plain = _ref3.plain;
|
||||
if (!styleStr) {
|
||||
return null;
|
||||
}
|
||||
var styleId = realToken._tokenKey;
|
||||
var order = -999;
|
||||
|
||||
// ====================== Style ======================
|
||||
// Used for rc-util
|
||||
var sharedAttrs = {
|
||||
'data-rc-order': 'prependQueue',
|
||||
'data-rc-priority': "".concat(order)
|
||||
};
|
||||
var styleText = (0, _util.toStyleStr)(styleStr, cssVarKey, styleId, sharedAttrs, plain);
|
||||
return [order, styleId, styleText];
|
||||
};
|
||||
10
node_modules/@ant-design/cssinjs/lib/hooks/useCompatibleInsertionEffect.d.ts
generated
vendored
Normal file
10
node_modules/@ant-design/cssinjs/lib/hooks/useCompatibleInsertionEffect.d.ts
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import type { EffectCallback } from 'react';
|
||||
import * as React from 'react';
|
||||
type UseCompatibleInsertionEffect = (renderEffect: EffectCallback, effect: (polyfill?: boolean) => ReturnType<EffectCallback>, deps: React.DependencyList) => void;
|
||||
/**
|
||||
* Compatible `useInsertionEffect`
|
||||
* will use `useInsertionEffect` if React version >= 18,
|
||||
* otherwise use `useInsertionEffectPolyfill`.
|
||||
*/
|
||||
declare const useCompatibleInsertionEffect: UseCompatibleInsertionEffect;
|
||||
export default useCompatibleInsertionEffect;
|
||||
44
node_modules/@ant-design/cssinjs/lib/hooks/useCompatibleInsertionEffect.js
generated
vendored
Normal file
44
node_modules/@ant-design/cssinjs/lib/hooks/useCompatibleInsertionEffect.js
generated
vendored
Normal file
@@ -0,0 +1,44 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
||||
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
// import canUseDom from 'rc-util/lib/Dom/canUseDom';
|
||||
|
||||
// We need fully clone React function here
|
||||
// to avoid webpack warning React 17 do not export `useId`
|
||||
var fullClone = (0, _objectSpread2.default)({}, React);
|
||||
var useInsertionEffect = fullClone.useInsertionEffect;
|
||||
/**
|
||||
* Polyfill `useInsertionEffect` for React < 18
|
||||
* @param renderEffect will be executed in `useMemo`, and do not have callback
|
||||
* @param effect will be executed in `useLayoutEffect`
|
||||
* @param deps
|
||||
*/
|
||||
var useInsertionEffectPolyfill = function useInsertionEffectPolyfill(renderEffect, effect, deps) {
|
||||
React.useMemo(renderEffect, deps);
|
||||
(0, _useLayoutEffect.default)(function () {
|
||||
return effect(true);
|
||||
}, deps);
|
||||
};
|
||||
|
||||
/**
|
||||
* Compatible `useInsertionEffect`
|
||||
* will use `useInsertionEffect` if React version >= 18,
|
||||
* otherwise use `useInsertionEffectPolyfill`.
|
||||
*/
|
||||
var useCompatibleInsertionEffect = useInsertionEffect ? function (renderEffect, effect, deps) {
|
||||
return useInsertionEffect(function () {
|
||||
renderEffect();
|
||||
return effect();
|
||||
}, deps);
|
||||
} : useInsertionEffectPolyfill;
|
||||
var _default = exports.default = useCompatibleInsertionEffect;
|
||||
3
node_modules/@ant-design/cssinjs/lib/hooks/useEffectCleanupRegister.d.ts
generated
vendored
Normal file
3
node_modules/@ant-design/cssinjs/lib/hooks/useEffectCleanupRegister.d.ts
generated
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
import * as React from 'react';
|
||||
declare const useEffectCleanupRegister: (deps?: React.DependencyList) => (fn: () => void) => void;
|
||||
export default useEffectCleanupRegister;
|
||||
52
node_modules/@ant-design/cssinjs/lib/hooks/useEffectCleanupRegister.js
generated
vendored
Normal file
52
node_modules/@ant-design/cssinjs/lib/hooks/useEffectCleanupRegister.js
generated
vendored
Normal file
@@ -0,0 +1,52 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
||||
var _warning = require("rc-util/lib/warning");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
var fullClone = (0, _objectSpread2.default)({}, React);
|
||||
var useInsertionEffect = fullClone.useInsertionEffect;
|
||||
|
||||
// DO NOT register functions in useEffect cleanup function, or functions that registered will never be called.
|
||||
var useCleanupRegister = function useCleanupRegister(deps) {
|
||||
var effectCleanups = [];
|
||||
var cleanupFlag = false;
|
||||
function register(fn) {
|
||||
if (cleanupFlag) {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
(0, _warning.warning)(false, '[Ant Design CSS-in-JS] You are registering a cleanup function after unmount, which will not have any effect.');
|
||||
}
|
||||
return;
|
||||
}
|
||||
effectCleanups.push(fn);
|
||||
}
|
||||
React.useEffect(function () {
|
||||
// Compatible with strict mode
|
||||
cleanupFlag = false;
|
||||
return function () {
|
||||
cleanupFlag = true;
|
||||
if (effectCleanups.length) {
|
||||
effectCleanups.forEach(function (fn) {
|
||||
return fn();
|
||||
});
|
||||
}
|
||||
};
|
||||
}, deps);
|
||||
return register;
|
||||
};
|
||||
var useRun = function useRun() {
|
||||
return function (fn) {
|
||||
fn();
|
||||
};
|
||||
};
|
||||
|
||||
// Only enable register in React 18
|
||||
var useEffectCleanupRegister = typeof useInsertionEffect !== 'undefined' ? useCleanupRegister : useRun;
|
||||
var _default = exports.default = useEffectCleanupRegister;
|
||||
5
node_modules/@ant-design/cssinjs/lib/hooks/useGlobalCache.d.ts
generated
vendored
Normal file
5
node_modules/@ant-design/cssinjs/lib/hooks/useGlobalCache.d.ts
generated
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
import { type KeyType } from '../Cache';
|
||||
export type ExtractStyle<CacheValue> = (cache: CacheValue, effectStyles: Record<string, boolean>, options?: {
|
||||
plain?: boolean;
|
||||
}) => [order: number, styleId: string, style: string] | null;
|
||||
export default function useGlobalCache<CacheType>(prefix: string, keyPath: KeyType[], cacheFn: () => CacheType, onCacheRemove?: (cache: CacheType, fromHMR: boolean) => void, onCacheEffect?: (cachedValue: CacheType) => void): CacheType;
|
||||
108
node_modules/@ant-design/cssinjs/lib/hooks/useGlobalCache.js
generated
vendored
Normal file
108
node_modules/@ant-design/cssinjs/lib/hooks/useGlobalCache.js
generated
vendored
Normal file
@@ -0,0 +1,108 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useGlobalCache;
|
||||
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
||||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _Cache = require("../Cache");
|
||||
var _StyleContext = _interopRequireDefault(require("../StyleContext"));
|
||||
var _useCompatibleInsertionEffect = _interopRequireDefault(require("./useCompatibleInsertionEffect"));
|
||||
var _useEffectCleanupRegister = _interopRequireDefault(require("./useEffectCleanupRegister"));
|
||||
var _useHMR = _interopRequireDefault(require("./useHMR"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function useGlobalCache(prefix, keyPath, cacheFn, onCacheRemove,
|
||||
// Add additional effect trigger by `useInsertionEffect`
|
||||
onCacheEffect) {
|
||||
var _React$useContext = React.useContext(_StyleContext.default),
|
||||
globalCache = _React$useContext.cache;
|
||||
var fullPath = [prefix].concat((0, _toConsumableArray2.default)(keyPath));
|
||||
var fullPathStr = (0, _Cache.pathKey)(fullPath);
|
||||
var register = (0, _useEffectCleanupRegister.default)([fullPathStr]);
|
||||
var HMRUpdate = (0, _useHMR.default)();
|
||||
var buildCache = function buildCache(updater) {
|
||||
globalCache.opUpdate(fullPathStr, function (prevCache) {
|
||||
var _ref = prevCache || [undefined, undefined],
|
||||
_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) {
|
||||
onCacheRemove === null || onCacheRemove === void 0 || onCacheRemove(tmpCache, HMRUpdate);
|
||||
tmpCache = null;
|
||||
}
|
||||
var mergedCache = tmpCache || cacheFn();
|
||||
var data = [times, mergedCache];
|
||||
|
||||
// Call updater if need additional logic
|
||||
return updater ? updater(data) : data;
|
||||
});
|
||||
};
|
||||
|
||||
// Create cache
|
||||
React.useMemo(function () {
|
||||
buildCache();
|
||||
}, /* eslint-disable react-hooks/exhaustive-deps */
|
||||
[fullPathStr]
|
||||
/* eslint-enable */);
|
||||
var cacheEntity = globalCache.opGet(fullPathStr);
|
||||
|
||||
// HMR clean the cache but not trigger `useMemo` again
|
||||
// Let's fallback of this
|
||||
// ref https://github.com/ant-design/cssinjs/issues/127
|
||||
if (process.env.NODE_ENV !== 'production' && !cacheEntity) {
|
||||
buildCache();
|
||||
cacheEntity = globalCache.opGet(fullPathStr);
|
||||
}
|
||||
var cacheContent = cacheEntity[1];
|
||||
|
||||
// Remove if no need anymore
|
||||
(0, _useCompatibleInsertionEffect.default)(function () {
|
||||
onCacheEffect === null || onCacheEffect === void 0 || onCacheEffect(cacheContent);
|
||||
}, function (polyfill) {
|
||||
// It's bad to call build again in effect.
|
||||
// But we have to do this since StrictMode will call effect twice
|
||||
// which will clear cache on the first time.
|
||||
buildCache(function (_ref3) {
|
||||
var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
|
||||
times = _ref4[0],
|
||||
cache = _ref4[1];
|
||||
if (polyfill && times === 0) {
|
||||
onCacheEffect === null || onCacheEffect === void 0 || onCacheEffect(cacheContent);
|
||||
}
|
||||
return [times + 1, cache];
|
||||
});
|
||||
return function () {
|
||||
globalCache.opUpdate(fullPathStr, function (prevCache) {
|
||||
var _ref5 = prevCache || [],
|
||||
_ref6 = (0, _slicedToArray2.default)(_ref5, 2),
|
||||
_ref6$ = _ref6[0],
|
||||
times = _ref6$ === void 0 ? 0 : _ref6$,
|
||||
cache = _ref6[1];
|
||||
var nextCount = times - 1;
|
||||
if (nextCount === 0) {
|
||||
// Always remove styles in useEffect callback
|
||||
register(function () {
|
||||
// With polyfill, registered callback will always be called synchronously
|
||||
// But without polyfill, it will be called in effect clean up,
|
||||
// And by that time this cache is cleaned up.
|
||||
if (polyfill || !globalCache.opGet(fullPathStr)) {
|
||||
onCacheRemove === null || onCacheRemove === void 0 || onCacheRemove(cache, false);
|
||||
}
|
||||
});
|
||||
return null;
|
||||
}
|
||||
return [times - 1, cache];
|
||||
});
|
||||
};
|
||||
}, [fullPathStr]);
|
||||
return cacheContent;
|
||||
}
|
||||
3
node_modules/@ant-design/cssinjs/lib/hooks/useHMR.d.ts
generated
vendored
Normal file
3
node_modules/@ant-design/cssinjs/lib/hooks/useHMR.d.ts
generated
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
declare function useProdHMR(): boolean;
|
||||
declare const _default: typeof useProdHMR;
|
||||
export default _default;
|
||||
30
node_modules/@ant-design/cssinjs/lib/hooks/useHMR.js
generated
vendored
Normal file
30
node_modules/@ant-design/cssinjs/lib/hooks/useHMR.js
generated
vendored
Normal file
@@ -0,0 +1,30 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
function useProdHMR() {
|
||||
return false;
|
||||
}
|
||||
var webpackHMR = false;
|
||||
function useDevHMR() {
|
||||
return webpackHMR;
|
||||
}
|
||||
var _default = exports.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 && typeof window !== 'undefined') {
|
||||
// Use `globalThis` first, and `window` for older browsers
|
||||
// const win = globalThis as any;
|
||||
var win = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : null;
|
||||
if (win && typeof win.webpackHotUpdate === 'function') {
|
||||
var originWebpackHotUpdate = win.webpackHotUpdate;
|
||||
win.webpackHotUpdate = function () {
|
||||
webpackHMR = true;
|
||||
setTimeout(function () {
|
||||
webpackHMR = false;
|
||||
}, 0);
|
||||
return originWebpackHotUpdate.apply(void 0, arguments);
|
||||
};
|
||||
}
|
||||
}
|
||||
77
node_modules/@ant-design/cssinjs/lib/hooks/useStyleRegister.d.ts
generated
vendored
Normal file
77
node_modules/@ant-design/cssinjs/lib/hooks/useStyleRegister.d.ts
generated
vendored
Normal file
@@ -0,0 +1,77 @@
|
||||
import type * as CSS from 'csstype';
|
||||
import * as React from 'react';
|
||||
import type { Theme, Transformer } from '..';
|
||||
import type Keyframes from '../Keyframes';
|
||||
import type { Linter } from '../linters';
|
||||
import type { HashPriority } from '../StyleContext';
|
||||
import type { ExtractStyle } from './useGlobalCache';
|
||||
declare const SKIP_CHECK = "_skip_check_";
|
||||
declare const MULTI_VALUE = "_multi_value_";
|
||||
export interface LayerConfig {
|
||||
name: string;
|
||||
dependencies?: string[];
|
||||
}
|
||||
export type CSSProperties = Omit<CSS.PropertiesFallback<number | string>, 'animationName'> & {
|
||||
animationName?: CSS.PropertiesFallback<number | string>['animationName'] | Keyframes;
|
||||
};
|
||||
export type CSSPropertiesWithMultiValues = {
|
||||
[K in keyof CSSProperties]: CSSProperties[K] | readonly Extract<CSSProperties[K], string>[] | {
|
||||
[SKIP_CHECK]?: boolean;
|
||||
[MULTI_VALUE]?: boolean;
|
||||
value: CSSProperties[K] | CSSProperties[K][];
|
||||
};
|
||||
};
|
||||
export type CSSPseudos = {
|
||||
[K in CSS.Pseudos]?: CSSObject;
|
||||
};
|
||||
type ArrayCSSInterpolation = readonly CSSInterpolation[];
|
||||
export type InterpolationPrimitive = null | undefined | boolean | number | string | CSSObject;
|
||||
export type CSSInterpolation = InterpolationPrimitive | ArrayCSSInterpolation | Keyframes;
|
||||
export type CSSOthersObject = Record<string, CSSInterpolation>;
|
||||
export interface CSSObject extends CSSPropertiesWithMultiValues, CSSPseudos, CSSOthersObject {
|
||||
}
|
||||
export declare function normalizeStyle(styleStr: string): string;
|
||||
export interface ParseConfig {
|
||||
hashId?: string;
|
||||
hashPriority?: HashPriority;
|
||||
layer?: LayerConfig;
|
||||
path?: string;
|
||||
transformers?: Transformer[];
|
||||
linters?: Linter[];
|
||||
}
|
||||
export interface ParseInfo {
|
||||
root?: boolean;
|
||||
injectHash?: boolean;
|
||||
parentSelectors: string[];
|
||||
}
|
||||
export declare const parseStyle: (interpolation: CSSInterpolation, config?: ParseConfig, { root, injectHash, parentSelectors }?: ParseInfo) => [parsedStr: string, effectStyle: Record<string, string>];
|
||||
export declare function uniqueHash(path: (string | number)[], styleStr: string): string;
|
||||
export declare const STYLE_PREFIX = "style";
|
||||
type StyleCacheValue = [
|
||||
styleStr: string,
|
||||
tokenKey: string,
|
||||
styleId: string,
|
||||
effectStyle: Record<string, string>,
|
||||
clientOnly: boolean | undefined,
|
||||
order: number
|
||||
];
|
||||
/**
|
||||
* Register a style to the global style sheet.
|
||||
*/
|
||||
export default function useStyleRegister(info: {
|
||||
theme: Theme<any, any>;
|
||||
token: any;
|
||||
path: string[];
|
||||
hashId?: string;
|
||||
layer?: LayerConfig;
|
||||
nonce?: string | (() => string);
|
||||
clientOnly?: boolean;
|
||||
/**
|
||||
* Tell cssinjs the insert order of style.
|
||||
* It's useful when you need to insert style
|
||||
* before other style to overwrite for the same selector priority.
|
||||
*/
|
||||
order?: number;
|
||||
}, styleFn: () => CSSInterpolation): (node: React.ReactElement) => React.JSX.Element;
|
||||
export declare const extract: ExtractStyle<StyleCacheValue>;
|
||||
export {};
|
||||
440
node_modules/@ant-design/cssinjs/lib/hooks/useStyleRegister.js
generated
vendored
Normal file
440
node_modules/@ant-design/cssinjs/lib/hooks/useStyleRegister.js
generated
vendored
Normal file
@@ -0,0 +1,440 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
||||
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.STYLE_PREFIX = void 0;
|
||||
exports.default = useStyleRegister;
|
||||
exports.extract = void 0;
|
||||
exports.normalizeStyle = normalizeStyle;
|
||||
exports.parseStyle = void 0;
|
||||
exports.uniqueHash = uniqueHash;
|
||||
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
||||
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
||||
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
||||
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
||||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
||||
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
||||
var _hash = _interopRequireDefault(require("@emotion/hash"));
|
||||
var _dynamicCSS = require("rc-util/lib/Dom/dynamicCSS");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _unitless = _interopRequireDefault(require("@emotion/unitless"));
|
||||
var _stylis = require("stylis");
|
||||
var _linters = require("../linters");
|
||||
var _StyleContext = _interopRequireWildcard(require("../StyleContext"));
|
||||
var _util = require("../util");
|
||||
var _cacheMapUtil = require("../util/cacheMapUtil");
|
||||
var _useGlobalCache3 = _interopRequireDefault(require("./useGlobalCache"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
// @ts-ignore
|
||||
|
||||
var SKIP_CHECK = '_skip_check_';
|
||||
var MULTI_VALUE = '_multi_value_';
|
||||
// ============================================================================
|
||||
// == Parser ==
|
||||
// ============================================================================
|
||||
// Preprocessor style content to browser support one
|
||||
function normalizeStyle(styleStr) {
|
||||
var serialized = (0, _stylis.serialize)((0, _stylis.compile)(styleStr), _stylis.stringify);
|
||||
return serialized.replace(/\{%%%\:[^;];}/g, ';');
|
||||
}
|
||||
function isCompoundCSSProperty(value) {
|
||||
return (0, _typeof2.default)(value) === 'object' && value && (SKIP_CHECK in value || MULTI_VALUE in value);
|
||||
}
|
||||
|
||||
// 注入 hash 值
|
||||
function injectSelectorHash(key, hashId, hashPriority) {
|
||||
if (!hashId) {
|
||||
return key;
|
||||
}
|
||||
var hashClassName = ".".concat(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 firstPath = fullPath[0] || '';
|
||||
var htmlElement = ((_firstPath$match = firstPath.match(/^\w+/)) === null || _firstPath$match === void 0 ? void 0 : _firstPath$match[0]) || '';
|
||||
firstPath = "".concat(htmlElement).concat(hashSelector).concat(firstPath.slice(htmlElement.length));
|
||||
return [firstPath].concat((0, _toConsumableArray2.default)(fullPath.slice(1))).join(' ');
|
||||
});
|
||||
return keys.join(',');
|
||||
}
|
||||
// Parse CSSObject to style content
|
||||
var parseStyle = exports.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,
|
||||
parentSelectors: []
|
||||
},
|
||||
root = _ref.root,
|
||||
injectHash = _ref.injectHash,
|
||||
parentSelectors = _ref.parentSelectors;
|
||||
var hashId = config.hashId,
|
||||
layer = config.layer,
|
||||
path = config.path,
|
||||
hashPriority = config.hashPriority,
|
||||
_config$transformers = config.transformers,
|
||||
transformers = _config$transformers === void 0 ? [] : _config$transformers,
|
||||
_config$linters = config.linters,
|
||||
linters = _config$linters === void 0 ? [] : _config$linters;
|
||||
var styleStr = '';
|
||||
var effectStyle = {};
|
||||
function parseKeyframes(keyframes) {
|
||||
var animationName = keyframes.getName(hashId);
|
||||
if (!effectStyle[animationName]) {
|
||||
var _parseStyle = parseStyle(keyframes.style, config, {
|
||||
root: false,
|
||||
parentSelectors: parentSelectors
|
||||
}),
|
||||
_parseStyle2 = (0, _slicedToArray2.default)(_parseStyle, 1),
|
||||
_parsedStr = _parseStyle2[0];
|
||||
effectStyle[animationName] = "@keyframes ".concat(keyframes.getName(hashId)).concat(_parsedStr);
|
||||
}
|
||||
}
|
||||
function flattenList(list) {
|
||||
var fullList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
||||
list.forEach(function (item) {
|
||||
if (Array.isArray(item)) {
|
||||
flattenList(item, fullList);
|
||||
} else if (item) {
|
||||
fullList.push(item);
|
||||
}
|
||||
});
|
||||
return fullList;
|
||||
}
|
||||
var flattenStyleList = flattenList(Array.isArray(interpolation) ? interpolation : [interpolation]);
|
||||
flattenStyleList.forEach(function (originStyle) {
|
||||
// Only root level can use raw string
|
||||
var style = typeof originStyle === 'string' && !root ? {} : originStyle;
|
||||
if (typeof style === 'string') {
|
||||
styleStr += "".concat(style, "\n");
|
||||
} else if (style._keyframe) {
|
||||
// Keyframe
|
||||
parseKeyframes(style);
|
||||
} else {
|
||||
var mergedStyle = transformers.reduce(function (prev, trans) {
|
||||
var _trans$visit;
|
||||
return (trans === null || trans === void 0 || (_trans$visit = trans.visit) === null || _trans$visit === void 0 ? void 0 : _trans$visit.call(trans, prev)) || prev;
|
||||
}, style);
|
||||
|
||||
// Normal CSSObject
|
||||
Object.keys(mergedStyle).forEach(function (key) {
|
||||
var value = mergedStyle[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;
|
||||
|
||||
// 拆分多个选择器
|
||||
if ((root || injectHash) && hashId) {
|
||||
if (mergedKey.startsWith('@')) {
|
||||
// 略过媒体查询,交给子节点继续插入 hashId
|
||||
subInjectHash = true;
|
||||
} else if (mergedKey === '&') {
|
||||
// 抹掉 root selector 上的单个 &
|
||||
mergedKey = injectSelectorHash('', hashId, hashPriority);
|
||||
} else {
|
||||
// 注入 hashId
|
||||
mergedKey = injectSelectorHash(key, hashId, hashPriority);
|
||||
}
|
||||
} else if (root && !hashId && (mergedKey === '&' || mergedKey === '')) {
|
||||
// In case of `{ '&': { a: { color: 'red' } } }` or `{ '': { a: { color: 'red' } } }` without hashId,
|
||||
// we will get `&{a:{color:red;}}` or `{a:{color:red;}}` string for stylis to compile.
|
||||
// But it does not conform to stylis syntax,
|
||||
// and finally we will get `{color:red;}` as css, which is wrong.
|
||||
// So we need to remove key in root, and treat child `{ a: { color: 'red' } }` as root.
|
||||
mergedKey = '';
|
||||
nextRoot = true;
|
||||
}
|
||||
var _parseStyle3 = parseStyle(value, config, {
|
||||
root: nextRoot,
|
||||
injectHash: subInjectHash,
|
||||
parentSelectors: [].concat((0, _toConsumableArray2.default)(parentSelectors), [mergedKey])
|
||||
}),
|
||||
_parseStyle4 = (0, _slicedToArray2.default)(_parseStyle3, 2),
|
||||
_parsedStr2 = _parseStyle4[0],
|
||||
childEffectStyle = _parseStyle4[1];
|
||||
effectStyle = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, effectStyle), childEffectStyle);
|
||||
styleStr += "".concat(mergedKey).concat(_parsedStr2);
|
||||
} else {
|
||||
var _value;
|
||||
function appendStyle(cssKey, cssValue) {
|
||||
if (process.env.NODE_ENV !== 'production' && ((0, _typeof2.default)(value) !== 'object' || !(value !== null && value !== void 0 && value[SKIP_CHECK]))) {
|
||||
[_linters.contentQuotesLinter, _linters.hashedAnimationLinter].concat((0, _toConsumableArray2.default)(linters)).forEach(function (linter) {
|
||||
return linter(cssKey, cssValue, {
|
||||
path: path,
|
||||
hashId: hashId,
|
||||
parentSelectors: parentSelectors
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 如果是样式则直接插入
|
||||
var styleName = cssKey.replace(/[A-Z]/g, function (match) {
|
||||
return "-".concat(match.toLowerCase());
|
||||
});
|
||||
|
||||
// Auto suffix with px
|
||||
var formatValue = cssValue;
|
||||
if (!_unitless.default[cssKey] && typeof formatValue === 'number' && formatValue !== 0) {
|
||||
formatValue = "".concat(formatValue, "px");
|
||||
}
|
||||
|
||||
// handle animationName & Keyframe value
|
||||
if (cssKey === 'animationName' && cssValue !== null && cssValue !== void 0 && cssValue._keyframe) {
|
||||
parseKeyframes(cssValue);
|
||||
formatValue = cssValue.getName(hashId);
|
||||
}
|
||||
styleStr += "".concat(styleName, ":").concat(formatValue, ";");
|
||||
}
|
||||
var actualValue = (_value = value === null || value === void 0 ? void 0 : value.value) !== null && _value !== void 0 ? _value : value;
|
||||
if ((0, _typeof2.default)(value) === 'object' && value !== null && value !== void 0 && value[MULTI_VALUE] && Array.isArray(actualValue)) {
|
||||
actualValue.forEach(function (item) {
|
||||
appendStyle(key, item);
|
||||
});
|
||||
} else {
|
||||
appendStyle(key, actualValue);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
if (!root) {
|
||||
styleStr = "{".concat(styleStr, "}");
|
||||
} else if (layer) {
|
||||
// fixme: https://github.com/thysultan/stylis/pull/339
|
||||
if (styleStr) {
|
||||
styleStr = "@layer ".concat(layer.name, " {").concat(styleStr, "}");
|
||||
}
|
||||
if (layer.dependencies) {
|
||||
effectStyle["@layer ".concat(layer.name)] = layer.dependencies.map(function (deps) {
|
||||
return "@layer ".concat(deps, ", ").concat(layer.name, ";");
|
||||
}).join('\n');
|
||||
}
|
||||
}
|
||||
return [styleStr, effectStyle];
|
||||
};
|
||||
|
||||
// ============================================================================
|
||||
// == Register ==
|
||||
// ============================================================================
|
||||
function uniqueHash(path, styleStr) {
|
||||
return (0, _hash.default)("".concat(path.join('%')).concat(styleStr));
|
||||
}
|
||||
function Empty() {
|
||||
return null;
|
||||
}
|
||||
var STYLE_PREFIX = exports.STYLE_PREFIX = 'style';
|
||||
/**
|
||||
* Register a style to the global style sheet.
|
||||
*/
|
||||
function useStyleRegister(info, styleFn) {
|
||||
var token = info.token,
|
||||
path = info.path,
|
||||
hashId = info.hashId,
|
||||
layer = info.layer,
|
||||
nonce = info.nonce,
|
||||
clientOnly = info.clientOnly,
|
||||
_info$order = info.order,
|
||||
order = _info$order === void 0 ? 0 : _info$order;
|
||||
var _React$useContext = React.useContext(_StyleContext.default),
|
||||
autoClear = _React$useContext.autoClear,
|
||||
mock = _React$useContext.mock,
|
||||
defaultCache = _React$useContext.defaultCache,
|
||||
hashPriority = _React$useContext.hashPriority,
|
||||
container = _React$useContext.container,
|
||||
ssrInline = _React$useContext.ssrInline,
|
||||
transformers = _React$useContext.transformers,
|
||||
linters = _React$useContext.linters,
|
||||
cache = _React$useContext.cache,
|
||||
enableLayer = _React$useContext.layer;
|
||||
var tokenKey = token._tokenKey;
|
||||
var fullPath = [tokenKey];
|
||||
if (enableLayer) {
|
||||
fullPath.push('layer');
|
||||
}
|
||||
fullPath.push.apply(fullPath, (0, _toConsumableArray2.default)(path));
|
||||
|
||||
// Check if need insert style
|
||||
var isMergedClientSide = _util.isClientSide;
|
||||
if (process.env.NODE_ENV !== 'production' && mock !== undefined) {
|
||||
isMergedClientSide = mock === 'client';
|
||||
}
|
||||
var _useGlobalCache = (0, _useGlobalCache3.default)(STYLE_PREFIX, fullPath,
|
||||
// Create cache if needed
|
||||
function () {
|
||||
var cachePath = fullPath.join('|');
|
||||
|
||||
// Get style from SSR inline style directly
|
||||
if ((0, _cacheMapUtil.existPath)(cachePath)) {
|
||||
var _getStyleAndHash = (0, _cacheMapUtil.getStyleAndHash)(cachePath),
|
||||
_getStyleAndHash2 = (0, _slicedToArray2.default)(_getStyleAndHash, 2),
|
||||
inlineCacheStyleStr = _getStyleAndHash2[0],
|
||||
styleHash = _getStyleAndHash2[1];
|
||||
if (inlineCacheStyleStr) {
|
||||
return [inlineCacheStyleStr, tokenKey, styleHash, {}, clientOnly, order];
|
||||
}
|
||||
}
|
||||
|
||||
// Generate style
|
||||
var styleObj = styleFn();
|
||||
var _parseStyle5 = parseStyle(styleObj, {
|
||||
hashId: hashId,
|
||||
hashPriority: hashPriority,
|
||||
layer: enableLayer ? layer : undefined,
|
||||
path: path.join('-'),
|
||||
transformers: transformers,
|
||||
linters: linters
|
||||
}),
|
||||
_parseStyle6 = (0, _slicedToArray2.default)(_parseStyle5, 2),
|
||||
parsedStyle = _parseStyle6[0],
|
||||
effectStyle = _parseStyle6[1];
|
||||
var styleStr = normalizeStyle(parsedStyle);
|
||||
var styleId = uniqueHash(fullPath, styleStr);
|
||||
return [styleStr, tokenKey, styleId, effectStyle, clientOnly, order];
|
||||
},
|
||||
// Remove cache if no need
|
||||
function (_ref2, fromHMR) {
|
||||
var _ref3 = (0, _slicedToArray2.default)(_ref2, 3),
|
||||
styleId = _ref3[2];
|
||||
if ((fromHMR || autoClear) && _util.isClientSide) {
|
||||
(0, _dynamicCSS.removeCSS)(styleId, {
|
||||
mark: _StyleContext.ATTR_MARK,
|
||||
attachTo: container
|
||||
});
|
||||
}
|
||||
},
|
||||
// Effect: Inject style here
|
||||
function (_ref4) {
|
||||
var _ref5 = (0, _slicedToArray2.default)(_ref4, 4),
|
||||
styleStr = _ref5[0],
|
||||
_ = _ref5[1],
|
||||
styleId = _ref5[2],
|
||||
effectStyle = _ref5[3];
|
||||
if (isMergedClientSide && styleStr !== _cacheMapUtil.CSS_FILE_STYLE) {
|
||||
var mergedCSSConfig = {
|
||||
mark: _StyleContext.ATTR_MARK,
|
||||
prepend: enableLayer ? false : 'queue',
|
||||
attachTo: container,
|
||||
priority: order
|
||||
};
|
||||
var nonceStr = typeof nonce === 'function' ? nonce() : nonce;
|
||||
if (nonceStr) {
|
||||
mergedCSSConfig.csp = {
|
||||
nonce: nonceStr
|
||||
};
|
||||
}
|
||||
|
||||
// ================= Split Effect Style =================
|
||||
// We will split effectStyle here since @layer should be at the top level
|
||||
var effectLayerKeys = [];
|
||||
var effectRestKeys = [];
|
||||
Object.keys(effectStyle).forEach(function (key) {
|
||||
if (key.startsWith('@layer')) {
|
||||
effectLayerKeys.push(key);
|
||||
} else {
|
||||
effectRestKeys.push(key);
|
||||
}
|
||||
});
|
||||
|
||||
// ================= Inject Layer Style =================
|
||||
// Inject layer style
|
||||
effectLayerKeys.forEach(function (effectKey) {
|
||||
(0, _dynamicCSS.updateCSS)(normalizeStyle(effectStyle[effectKey]), "_layer-".concat(effectKey), (0, _objectSpread2.default)((0, _objectSpread2.default)({}, mergedCSSConfig), {}, {
|
||||
prepend: true
|
||||
}));
|
||||
});
|
||||
|
||||
// ==================== Inject Style ====================
|
||||
// Inject style
|
||||
var style = (0, _dynamicCSS.updateCSS)(styleStr, styleId, mergedCSSConfig);
|
||||
style[_StyleContext.CSS_IN_JS_INSTANCE] = cache.instanceId;
|
||||
|
||||
// Used for `useCacheToken` to remove on batch when token removed
|
||||
style.setAttribute(_StyleContext.ATTR_TOKEN, tokenKey);
|
||||
|
||||
// Debug usage. Dev only
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
style.setAttribute(_StyleContext.ATTR_CACHE_PATH, fullPath.join('|'));
|
||||
}
|
||||
|
||||
// ================ Inject Effect Style =================
|
||||
// Inject client side effect style
|
||||
effectRestKeys.forEach(function (effectKey) {
|
||||
(0, _dynamicCSS.updateCSS)(normalizeStyle(effectStyle[effectKey]), "_effect-".concat(effectKey), mergedCSSConfig);
|
||||
});
|
||||
}
|
||||
}),
|
||||
_useGlobalCache2 = (0, _slicedToArray2.default)(_useGlobalCache, 3),
|
||||
cachedStyleStr = _useGlobalCache2[0],
|
||||
cachedTokenKey = _useGlobalCache2[1],
|
||||
cachedStyleId = _useGlobalCache2[2];
|
||||
return function (node) {
|
||||
var styleNode;
|
||||
if (!ssrInline || isMergedClientSide || !defaultCache) {
|
||||
styleNode = /*#__PURE__*/React.createElement(Empty, null);
|
||||
} else {
|
||||
styleNode = /*#__PURE__*/React.createElement("style", (0, _extends2.default)({}, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _StyleContext.ATTR_TOKEN, cachedTokenKey), _StyleContext.ATTR_MARK, cachedStyleId), {
|
||||
dangerouslySetInnerHTML: {
|
||||
__html: cachedStyleStr
|
||||
}
|
||||
}));
|
||||
}
|
||||
return /*#__PURE__*/React.createElement(React.Fragment, null, styleNode, node);
|
||||
};
|
||||
}
|
||||
var extract = exports.extract = function extract(cache, effectStyles, options) {
|
||||
var _cache = (0, _slicedToArray2.default)(cache, 6),
|
||||
styleStr = _cache[0],
|
||||
tokenKey = _cache[1],
|
||||
styleId = _cache[2],
|
||||
effectStyle = _cache[3],
|
||||
clientOnly = _cache[4],
|
||||
order = _cache[5];
|
||||
var _ref7 = options || {},
|
||||
plain = _ref7.plain;
|
||||
|
||||
// Skip client only style
|
||||
if (clientOnly) {
|
||||
return null;
|
||||
}
|
||||
var keyStyleText = styleStr;
|
||||
|
||||
// ====================== Share ======================
|
||||
// Used for rc-util
|
||||
var sharedAttrs = {
|
||||
'data-rc-order': 'prependQueue',
|
||||
'data-rc-priority': "".concat(order)
|
||||
};
|
||||
|
||||
// ====================== Style ======================
|
||||
keyStyleText = (0, _util.toStyleStr)(styleStr, tokenKey, styleId, sharedAttrs, plain);
|
||||
|
||||
// =============== Create effect style ===============
|
||||
if (effectStyle) {
|
||||
Object.keys(effectStyle).forEach(function (effectKey) {
|
||||
// Effect style can be reused
|
||||
if (!effectStyles[effectKey]) {
|
||||
effectStyles[effectKey] = true;
|
||||
var effectStyleStr = normalizeStyle(effectStyle[effectKey]);
|
||||
var effectStyleHTML = (0, _util.toStyleStr)(effectStyleStr, tokenKey, "_effect-".concat(effectKey), sharedAttrs, plain);
|
||||
if (effectKey.startsWith('@layer')) {
|
||||
keyStyleText = effectStyleHTML + keyStyleText;
|
||||
} else {
|
||||
keyStyleText += effectStyleHTML;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
return [order, styleId, keyStyleText];
|
||||
};
|
||||
Reference in New Issue
Block a user