116 lines
5.1 KiB
JavaScript
116 lines
5.1 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = genComponentStyleHook;
|
|
exports.genSubStyleComponent = void 0;
|
|
var _react = require("react");
|
|
var _cssinjs = require("@ant-design/cssinjs");
|
|
var _rcUtil = require("rc-util");
|
|
var _context = require("../../config-provider/context");
|
|
var _style = require("../../style");
|
|
var _useToken = _interopRequireDefault(require("../useToken"));
|
|
var _statistic = _interopRequireWildcard(require("./statistic"));
|
|
var _useResetIconStyle = _interopRequireDefault(require("./useResetIconStyle"));
|
|
/* eslint-disable no-redeclare */
|
|
|
|
function genComponentStyleHook(componentName, styleFn, getDefaultToken) {
|
|
let options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
const cells = Array.isArray(componentName) ? componentName : [componentName, componentName];
|
|
const [component] = cells;
|
|
const concatComponent = cells.join('-');
|
|
return prefixCls => {
|
|
const [theme, token, hashId] = (0, _useToken.default)();
|
|
const {
|
|
getPrefixCls,
|
|
iconPrefixCls,
|
|
csp
|
|
} = (0, _react.useContext)(_context.ConfigContext);
|
|
const rootPrefixCls = getPrefixCls();
|
|
// Shared config
|
|
const sharedConfig = {
|
|
theme,
|
|
token,
|
|
hashId,
|
|
nonce: () => csp === null || csp === void 0 ? void 0 : csp.nonce,
|
|
clientOnly: options.clientOnly,
|
|
// antd is always at top of styles
|
|
order: options.order || -999
|
|
};
|
|
// Generate style for all a tags in antd component.
|
|
(0, _cssinjs.useStyleRegister)(Object.assign(Object.assign({}, sharedConfig), {
|
|
clientOnly: false,
|
|
path: ['Shared', rootPrefixCls]
|
|
}), () => [{
|
|
// Link
|
|
'&': (0, _style.genLinkStyle)(token)
|
|
}]);
|
|
// Generate style for icons
|
|
(0, _useResetIconStyle.default)(iconPrefixCls);
|
|
return [(0, _cssinjs.useStyleRegister)(Object.assign(Object.assign({}, sharedConfig), {
|
|
path: [concatComponent, prefixCls, iconPrefixCls]
|
|
}), () => {
|
|
const {
|
|
token: proxyToken,
|
|
flush
|
|
} = (0, _statistic.default)(token);
|
|
const customComponentToken = Object.assign({}, token[component]);
|
|
if (options.deprecatedTokens) {
|
|
const {
|
|
deprecatedTokens
|
|
} = options;
|
|
deprecatedTokens.forEach(_ref => {
|
|
let [oldTokenKey, newTokenKey] = _ref;
|
|
var _a;
|
|
if (process.env.NODE_ENV !== 'production') {
|
|
process.env.NODE_ENV !== "production" ? (0, _rcUtil.warning)(!(customComponentToken === null || customComponentToken === void 0 ? void 0 : customComponentToken[oldTokenKey]), `The token '${String(oldTokenKey)}' of ${component} had deprecated, use '${String(newTokenKey)}' instead.`) : void 0;
|
|
}
|
|
// Should wrap with `if` clause, or there will be `undefined` in object.
|
|
if ((customComponentToken === null || customComponentToken === void 0 ? void 0 : customComponentToken[oldTokenKey]) || (customComponentToken === null || customComponentToken === void 0 ? void 0 : customComponentToken[newTokenKey])) {
|
|
(_a = customComponentToken[newTokenKey]) !== null && _a !== void 0 ? _a : customComponentToken[newTokenKey] = customComponentToken === null || customComponentToken === void 0 ? void 0 : customComponentToken[oldTokenKey];
|
|
}
|
|
});
|
|
}
|
|
const defaultComponentToken = typeof getDefaultToken === 'function' ? getDefaultToken((0, _statistic.merge)(proxyToken, customComponentToken !== null && customComponentToken !== void 0 ? customComponentToken : {})) : getDefaultToken;
|
|
const mergedComponentToken = Object.assign(Object.assign({}, defaultComponentToken), customComponentToken);
|
|
const componentCls = `.${prefixCls}`;
|
|
const mergedToken = (0, _statistic.merge)(proxyToken, {
|
|
componentCls,
|
|
prefixCls,
|
|
iconCls: `.${iconPrefixCls}`,
|
|
antCls: `.${rootPrefixCls}`
|
|
}, mergedComponentToken);
|
|
const styleInterpolation = styleFn(mergedToken, {
|
|
hashId,
|
|
prefixCls,
|
|
rootPrefixCls,
|
|
iconPrefixCls,
|
|
overrideComponentToken: customComponentToken
|
|
});
|
|
flush(component, mergedComponentToken);
|
|
return [options.resetStyle === false ? null : (0, _style.genCommonStyle)(token, prefixCls), styleInterpolation];
|
|
}), hashId];
|
|
};
|
|
}
|
|
const genSubStyleComponent = (componentName, styleFn, getDefaultToken, options) => {
|
|
const useStyle = genComponentStyleHook(componentName, styleFn, getDefaultToken, Object.assign({
|
|
resetStyle: false,
|
|
// Sub Style should default after root one
|
|
order: -998
|
|
}, options));
|
|
const StyledComponent = _ref2 => {
|
|
let {
|
|
prefixCls
|
|
} = _ref2;
|
|
useStyle(prefixCls);
|
|
return null;
|
|
};
|
|
if (process.env.NODE_ENV !== 'production') {
|
|
StyledComponent.displayName = `SubStyle_${Array.isArray(componentName) ? componentName.join('.') : componentName}`;
|
|
}
|
|
return StyledComponent;
|
|
};
|
|
exports.genSubStyleComponent = genSubStyleComponent; |