1
This commit is contained in:
+7
@@ -0,0 +1,7 @@
|
||||
/**
|
||||
* This hook is only for cssVar to add root className for components.
|
||||
* If root ClassName is needed, this hook could be refactored with `-root`
|
||||
* @param prefixCls
|
||||
*/
|
||||
declare const useCSSVarCls: (prefixCls: string) => string;
|
||||
export default useCSSVarCls;
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
/**
|
||||
* This hook is only for cssVar to add root className for components.
|
||||
* If root ClassName is needed, this hook could be refactored with `-root`
|
||||
* @param prefixCls
|
||||
*/
|
||||
const useCSSVarCls = prefixCls => `${prefixCls}-css-var`;
|
||||
var _default = exports.default = useCSSVarCls;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
declare function useConfig(): {
|
||||
componentDisabled: boolean;
|
||||
componentSize: import("../SizeContext").SizeType;
|
||||
};
|
||||
export default useConfig;
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _react = require("react");
|
||||
var _DisabledContext = _interopRequireDefault(require("../DisabledContext"));
|
||||
var _SizeContext = _interopRequireDefault(require("../SizeContext"));
|
||||
function useConfig() {
|
||||
const componentDisabled = (0, _react.useContext)(_DisabledContext.default);
|
||||
const componentSize = (0, _react.useContext)(_SizeContext.default);
|
||||
return {
|
||||
componentDisabled,
|
||||
componentSize
|
||||
};
|
||||
}
|
||||
var _default = exports.default = useConfig;
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import type { SizeType } from '../SizeContext';
|
||||
declare const useSize: <T extends string | undefined | number | object>(customSize?: T | ((ctxSize: SizeType) => T)) => T;
|
||||
export default useSize;
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _react = _interopRequireDefault(require("react"));
|
||||
var _SizeContext = _interopRequireDefault(require("../SizeContext"));
|
||||
const useSize = customSize => {
|
||||
const size = _react.default.useContext(_SizeContext.default);
|
||||
const mergedSize = _react.default.useMemo(() => {
|
||||
if (!customSize) {
|
||||
return size;
|
||||
}
|
||||
if (typeof customSize === 'string') {
|
||||
return customSize ?? size;
|
||||
}
|
||||
if (typeof customSize === 'function') {
|
||||
return customSize(size);
|
||||
}
|
||||
return size;
|
||||
}, [customSize, size]);
|
||||
return mergedSize;
|
||||
};
|
||||
var _default = exports.default = useSize;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import type { ThemeConfig } from '../context';
|
||||
export default function useTheme(theme?: ThemeConfig, parentTheme?: ThemeConfig, config?: {
|
||||
prefixCls?: string;
|
||||
}): ThemeConfig | undefined;
|
||||
+66
@@ -0,0 +1,66 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useTheme;
|
||||
var _react = require("react");
|
||||
var _useMemo = _interopRequireDefault(require("@rc-component/util/lib/hooks/useMemo"));
|
||||
var _isEqual = _interopRequireDefault(require("@rc-component/util/lib/isEqual"));
|
||||
var _is = require("../../_util/is");
|
||||
var _warning = require("../../_util/warning");
|
||||
var _internal = require("../../theme/internal");
|
||||
function useTheme(theme, parentTheme, config) {
|
||||
const warning = (0, _warning.devUseWarning)('ConfigProvider');
|
||||
const themeConfig = theme || {};
|
||||
const parentThemeConfig = themeConfig.inherit === false || !parentTheme ? {
|
||||
..._internal.defaultConfig,
|
||||
hashed: parentTheme?.hashed ?? _internal.defaultConfig.hashed,
|
||||
cssVar: parentTheme?.cssVar
|
||||
} : parentTheme;
|
||||
// Generate a unique key for cssVar
|
||||
const themeKey = (0, _react.useId)();
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
const cssVarEnabled = themeConfig.cssVar || parentThemeConfig.cssVar;
|
||||
const validKey = !!((0, _is.isPlainObject)(themeConfig.cssVar) && themeConfig.cssVar?.key || themeKey);
|
||||
process.env.NODE_ENV !== "production" ? warning(!cssVarEnabled || validKey, 'breaking', 'Missing key in `cssVar` config. Please upgrade to React 18 or set `cssVar.key` manually in each ConfigProvider inside `cssVar` enabled ConfigProvider.') : void 0;
|
||||
}
|
||||
return (0, _useMemo.default)(() => {
|
||||
if (!theme) {
|
||||
return parentTheme;
|
||||
}
|
||||
// Override
|
||||
const mergedComponents = {
|
||||
...parentThemeConfig.components
|
||||
};
|
||||
Object.keys(theme.components || {}).forEach(componentName => {
|
||||
mergedComponents[componentName] = {
|
||||
...mergedComponents[componentName],
|
||||
...theme.components[componentName]
|
||||
};
|
||||
});
|
||||
const cssVarKey = `css-var-${themeKey.replace(/:/g, '')}`;
|
||||
const mergedCssVar = {
|
||||
prefix: config?.prefixCls,
|
||||
// Same as prefixCls by default
|
||||
...parentThemeConfig.cssVar,
|
||||
...themeConfig.cssVar,
|
||||
key: themeConfig.cssVar?.key || cssVarKey
|
||||
};
|
||||
// Base token
|
||||
return {
|
||||
...parentThemeConfig,
|
||||
...themeConfig,
|
||||
token: {
|
||||
...parentThemeConfig.token,
|
||||
...themeConfig.token
|
||||
},
|
||||
components: mergedComponents,
|
||||
cssVar: mergedCssVar
|
||||
};
|
||||
}, [themeConfig, parentThemeConfig], (prev, next) => prev.some((prevTheme, index) => {
|
||||
const nextTheme = next[index];
|
||||
return !(0, _isEqual.default)(prevTheme, nextTheme, true);
|
||||
}));
|
||||
}
|
||||
Reference in New Issue
Block a user