ezr-antd 1.0.0

package/lib/theme/themes/shared/genFontMapToken.d.ts

@@ -0,0 +1,3 @@
+import type { FontMapToken } from '../../interface';
+declare const genFontMapToken: (fontSize: number) => FontMapToken;
+export default genFontMapToken;

package/lib/theme/themes/shared/genFontMapToken.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _genFontSizes = _interopRequireDefault(require("./genFontSizes"));
+const genFontMapToken = fontSize => {
+  const fontSizePairs = (0, _genFontSizes.default)(fontSize);
+  const fontSizes = fontSizePairs.map(pair => pair.size);
+  const lineHeights = fontSizePairs.map(pair => pair.lineHeight);
+  const fontSizeMD = fontSizes[1];
+  const fontSizeSM = fontSizes[0];
+  const fontSizeLG = fontSizes[2];
+  const lineHeight = lineHeights[1];
+  const lineHeightSM = lineHeights[0];
+  const lineHeightLG = lineHeights[2];
+  return {
+    fontSizeSM,
+    fontSize: fontSizeMD,
+    fontSizeLG,
+    fontSizeXL: fontSizes[3],
+    fontSizeHeading1: fontSizes[6],
+    fontSizeHeading2: fontSizes[5],
+    fontSizeHeading3: fontSizes[4],
+    fontSizeHeading4: fontSizes[3],
+    fontSizeHeading5: fontSizes[2],
+    lineHeight,
+    lineHeightLG,
+    lineHeightSM,
+    fontHeight: Math.round(lineHeight * fontSizeMD),
+    fontHeightLG: Math.round(lineHeightLG * fontSizeLG),
+    fontHeightSM: Math.round(lineHeightSM * fontSizeSM),
+    lineHeightHeading1: lineHeights[6],
+    lineHeightHeading2: lineHeights[5],
+    lineHeightHeading3: lineHeights[4],
+    lineHeightHeading4: lineHeights[3],
+    lineHeightHeading5: lineHeights[2]
+  };
+};
+var _default = exports.default = genFontMapToken;

package/lib/theme/themes/shared/genFontSizes.d.ts

@@ -0,0 +1,5 @@
+export declare function getLineHeight(fontSize: number): number;
+export default function getFontSizes(base: number): {
+    size: number;
+    lineHeight: number;
+}[];

package/lib/theme/themes/shared/genFontSizes.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = getFontSizes;
+exports.getLineHeight = getLineHeight;
+function getLineHeight(fontSize) {
+  return (fontSize + 8) / fontSize;
+}
+// https://zhuanlan.zhihu.com/p/32746810
+function getFontSizes(base) {
+  const fontSizes = new Array(10).fill(null).map((_, index) => {
+    const i = index - 1;
+    const baseSize = base * Math.pow(Math.E, i / 5);
+    const intSize = index > 1 ? Math.floor(baseSize) : Math.ceil(baseSize);
+    // Convert to even
+    return Math.floor(intSize / 2) * 2;
+  });
+  fontSizes[1] = base;
+  return fontSizes.map(size => ({
+    size,
+    lineHeight: getLineHeight(size)
+  }));
+}

package/lib/theme/themes/shared/genRadius.d.ts

@@ -0,0 +1,3 @@
+import type { MapToken } from '../../interface';
+declare const genRadius: (radiusBase: number) => Pick<MapToken, "borderRadiusXS" | "borderRadiusSM" | "borderRadiusLG" | "borderRadius" | "borderRadiusOuter">;
+export default genRadius;

package/lib/theme/themes/shared/genRadius.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+const genRadius = radiusBase => {
+  let radiusLG = radiusBase;
+  let radiusSM = radiusBase;
+  let radiusXS = radiusBase;
+  let radiusOuter = radiusBase;
+  // radiusLG
+  if (radiusBase < 6 && radiusBase >= 5) {
+    radiusLG = radiusBase + 1;
+  } else if (radiusBase < 16 && radiusBase >= 6) {
+    radiusLG = radiusBase + 2;
+  } else if (radiusBase >= 16) {
+    radiusLG = 16;
+  }
+  // radiusSM
+  if (radiusBase < 7 && radiusBase >= 5) {
+    radiusSM = 4;
+  } else if (radiusBase < 8 && radiusBase >= 7) {
+    radiusSM = 5;
+  } else if (radiusBase < 14 && radiusBase >= 8) {
+    radiusSM = 6;
+  } else if (radiusBase < 16 && radiusBase >= 14) {
+    radiusSM = 7;
+  } else if (radiusBase >= 16) {
+    radiusSM = 8;
+  }
+  // radiusXS
+  if (radiusBase < 6 && radiusBase >= 2) {
+    radiusXS = 1;
+  } else if (radiusBase >= 6) {
+    radiusXS = 2;
+  }
+  // radiusOuter
+  if (radiusBase > 4 && radiusBase < 8) {
+    radiusOuter = 4;
+  } else if (radiusBase >= 8) {
+    radiusOuter = 6;
+  }
+  return {
+    borderRadius: radiusBase,
+    borderRadiusXS: radiusXS,
+    borderRadiusSM: radiusSM,
+    borderRadiusLG: radiusLG,
+    borderRadiusOuter: radiusOuter
+  };
+};
+var _default = exports.default = genRadius;

package/lib/theme/themes/shared/genSizeMapToken.d.ts

@@ -0,0 +1,2 @@
+import type { SeedToken, SizeMapToken } from '../../interface';
+export default function genSizeMapToken(token: SeedToken): SizeMapToken;

package/lib/theme/themes/shared/genSizeMapToken.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = genSizeMapToken;
+function genSizeMapToken(token) {
+  const {
+    sizeUnit,
+    sizeStep
+  } = token;
+  return {
+    sizeXXL: sizeUnit * (sizeStep + 8),
+    // 48
+    sizeXL: sizeUnit * (sizeStep + 4),
+    // 32
+    sizeLG: sizeUnit * (sizeStep + 2),
+    // 24
+    sizeMD: sizeUnit * (sizeStep + 1),
+    // 20
+    sizeMS: sizeUnit * sizeStep,
+    // 16
+    size: sizeUnit * sizeStep,
+    // 16
+    sizeSM: sizeUnit * (sizeStep - 1),
+    // 12
+    sizeXS: sizeUnit * (sizeStep - 2),
+    // 8
+    sizeXXS: sizeUnit * (sizeStep - 3) // 4
+  };
+}

package/lib/theme/useToken.d.ts

@@ -0,0 +1,19 @@
+import type { Theme } from '@ant-design/cssinjs';
+import type { DesignTokenProviderProps } from './context';
+import type { AliasToken, GlobalToken, SeedToken } from './interface';
+export declare const unitless: {
+    [key in keyof AliasToken]?: boolean;
+};
+export declare const ignore: {
+    [key in keyof AliasToken]?: boolean;
+};
+export declare const getComputedToken: (originToken: SeedToken, overrideToken: DesignTokenProviderProps["components"] & {
+    override?: Partial<AliasToken>;
+}, theme: Theme<any, any>) => any;
+export default function useToken(): [
+    theme: Theme<SeedToken, AliasToken>,
+    token: GlobalToken,
+    hashId: string,
+    realToken: GlobalToken,
+    cssVar?: DesignTokenProviderProps['cssVar']
+];

package/lib/theme/useToken.js

@@ -0,0 +1,129 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useToken;
+exports.unitless = exports.ignore = exports.getComputedToken = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _cssinjs = require("@ant-design/cssinjs");
+var _version = _interopRequireDefault(require("../version"));
+var _context = require("./context");
+var _seed = _interopRequireDefault(require("./themes/seed"));
+var _alias = _interopRequireDefault(require("./util/alias"));
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+const unitless = exports.unitless = {
+  lineHeight: true,
+  lineHeightSM: true,
+  lineHeightLG: true,
+  lineHeightHeading1: true,
+  lineHeightHeading2: true,
+  lineHeightHeading3: true,
+  lineHeightHeading4: true,
+  lineHeightHeading5: true,
+  opacityLoading: true,
+  fontWeightStrong: true,
+  zIndexPopupBase: true,
+  zIndexBase: true,
+  opacityImage: true
+};
+const ignore = exports.ignore = {
+  size: true,
+  sizeSM: true,
+  sizeLG: true,
+  sizeMD: true,
+  sizeXS: true,
+  sizeXXS: true,
+  sizeMS: true,
+  sizeXL: true,
+  sizeXXL: true,
+  sizeUnit: true,
+  sizeStep: true,
+  motionBase: true,
+  motionUnit: true
+};
+const preserve = {
+  screenXS: true,
+  screenXSMin: true,
+  screenXSMax: true,
+  screenSM: true,
+  screenSMMin: true,
+  screenSMMax: true,
+  screenMD: true,
+  screenMDMin: true,
+  screenMDMax: true,
+  screenLG: true,
+  screenLGMin: true,
+  screenLGMax: true,
+  screenXL: true,
+  screenXLMin: true,
+  screenXLMax: true,
+  screenXXL: true,
+  screenXXLMin: true
+};
+const getComputedToken = (originToken, overrideToken, theme) => {
+  const derivativeToken = theme.getDerivativeToken(originToken);
+  const {
+      override
+    } = overrideToken,
+    components = __rest(overrideToken, ["override"]);
+  // Merge with override
+  let mergedDerivativeToken = Object.assign(Object.assign({}, derivativeToken), {
+    override
+  });
+  // Format if needed
+  mergedDerivativeToken = (0, _alias.default)(mergedDerivativeToken);
+  if (components) {
+    Object.entries(components).forEach(([key, value]) => {
+      const {
+          theme: componentTheme
+        } = value,
+        componentTokens = __rest(value, ["theme"]);
+      let mergedComponentToken = componentTokens;
+      if (componentTheme) {
+        mergedComponentToken = getComputedToken(Object.assign(Object.assign({}, mergedDerivativeToken), componentTokens), {
+          override: componentTokens
+        }, componentTheme);
+      }
+      mergedDerivativeToken[key] = mergedComponentToken;
+    });
+  }
+  return mergedDerivativeToken;
+};
+// ================================== Hook ==================================
+exports.getComputedToken = getComputedToken;
+function useToken() {
+  const {
+    token: rootDesignToken,
+    hashed,
+    theme,
+    override,
+    cssVar
+  } = _react.default.useContext(_context.DesignTokenContext);
+  const salt = `${_version.default}-${hashed || ''}`;
+  const mergedTheme = theme || _context.defaultTheme;
+  const [token, hashId, realToken] = (0, _cssinjs.useCacheToken)(mergedTheme, [_seed.default, rootDesignToken], {
+    salt,
+    override,
+    getComputedToken,
+    // formatToken will not be consumed after 1.15.0 with getComputedToken.
+    // But token will break if @ant-design/cssinjs is under 1.15.0 without it
+    formatToken: _alias.default,
+    cssVar: cssVar && {
+      prefix: cssVar.prefix,
+      key: cssVar.key,
+      unitless,
+      ignore,
+      preserve
+    }
+  });
+  return [mergedTheme, realToken, hashed ? hashId : '', token, cssVar];
+}

package/lib/theme/util/alias.d.ts

@@ -0,0 +1,12 @@
+import type { AliasToken, MapToken, OverrideToken } from '../interface';
+/** Raw merge of `@ant-design/cssinjs` token. Which need additional process */
+type RawMergedToken = MapToken & OverrideToken & {
+    override: Partial<AliasToken>;
+};
+/**
+ * Seed (designer) > Derivative (designer) > Alias (developer).
+ *
+ * Merge seed & derivative & override token and generate alias token for developer.
+ */
+export default function formatToken(derivativeToken: RawMergedToken): AliasToken;
+export {};

package/lib/theme/util/alias.js

@@ -0,0 +1,183 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = formatToken;
+var _tinycolor = require("@ctrl/tinycolor");
+var _seed = _interopRequireDefault(require("../themes/seed"));
+var _getAlphaColor = _interopRequireDefault(require("./getAlphaColor"));
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+/**
+ * Seed (designer) > Derivative (designer) > Alias (developer).
+ *
+ * Merge seed & derivative & override token and generate alias token for developer.
+ */
+function formatToken(derivativeToken) {
+  const {
+      override
+    } = derivativeToken,
+    restToken = __rest(derivativeToken, ["override"]);
+  const overrideTokens = Object.assign({}, override);
+  Object.keys(_seed.default).forEach(token => {
+    delete overrideTokens[token];
+  });
+  const mergedToken = Object.assign(Object.assign({}, restToken), overrideTokens);
+  const screenXS = 480;
+  const screenSM = 576;
+  const screenMD = 768;
+  const screenLG = 992;
+  const screenXL = 1200;
+  const screenXXL = 1600;
+  // Motion
+  if (mergedToken.motion === false) {
+    const fastDuration = '0s';
+    mergedToken.motionDurationFast = fastDuration;
+    mergedToken.motionDurationMid = fastDuration;
+    mergedToken.motionDurationSlow = fastDuration;
+  }
+  // Generate alias token
+  const aliasToken = Object.assign(Object.assign(Object.assign({}, mergedToken), {
+    // ============== Background ============== //
+    colorFillContent: mergedToken.colorFillSecondary,
+    colorFillContentHover: mergedToken.colorFill,
+    colorFillAlter: mergedToken.colorFillQuaternary,
+    colorBgContainerDisabled: mergedToken.colorFillTertiary,
+    // ============== Split ============== //
+    colorBorderBg: mergedToken.colorBgContainer,
+    colorSplit: (0, _getAlphaColor.default)(mergedToken.colorBorderSecondary, mergedToken.colorBgContainer),
+    // ============== Text ============== //
+    colorTextPlaceholder: mergedToken.colorTextQuaternary,
+    colorTextDisabled: mergedToken.colorTextQuaternary,
+    colorTextHeading: mergedToken.colorText,
+    colorTextLabel: mergedToken.colorTextSecondary,
+    colorTextDescription: mergedToken.colorTextTertiary,
+    colorTextLightSolid: mergedToken.colorWhite,
+    colorHighlight: mergedToken.colorError,
+    colorBgTextHover: mergedToken.colorFillSecondary,
+    colorBgTextActive: mergedToken.colorFill,
+    colorIcon: mergedToken.colorTextTertiary,
+    colorIconHover: mergedToken.colorText,
+    colorErrorOutline: (0, _getAlphaColor.default)(mergedToken.colorErrorBg, mergedToken.colorBgContainer),
+    colorWarningOutline: (0, _getAlphaColor.default)(mergedToken.colorWarningBg, mergedToken.colorBgContainer),
+    // Font
+    fontSizeIcon: mergedToken.fontSizeSM,
+    // Line
+    lineWidthFocus: mergedToken.lineWidth * 3,
+    // Control
+    lineWidth: mergedToken.lineWidth,
+    controlOutlineWidth: mergedToken.lineWidth * 2,
+    // Checkbox size and expand icon size
+    controlInteractiveSize: mergedToken.controlHeight / 2,
+    controlItemBgHover: mergedToken.colorFillTertiary,
+    controlItemBgActive: mergedToken.colorPrimaryBg,
+    controlItemBgActiveHover: mergedToken.colorPrimaryBgHover,
+    controlItemBgActiveDisabled: mergedToken.colorFill,
+    controlTmpOutline: mergedToken.colorFillQuaternary,
+    controlOutline: (0, _getAlphaColor.default)(mergedToken.colorPrimaryBg, mergedToken.colorBgContainer),
+    lineType: mergedToken.lineType,
+    borderRadius: mergedToken.borderRadius,
+    borderRadiusXS: mergedToken.borderRadiusXS,
+    borderRadiusSM: mergedToken.borderRadiusSM,
+    borderRadiusLG: mergedToken.borderRadiusLG,
+    fontWeightStrong: 600,
+    opacityLoading: 0.65,
+    linkDecoration: 'none',
+    linkHoverDecoration: 'none',
+    linkFocusDecoration: 'none',
+    controlPaddingHorizontal: 12,
+    controlPaddingHorizontalSM: 8,
+    paddingXXS: mergedToken.sizeXXS,
+    paddingXS: mergedToken.sizeXS,
+    paddingSM: mergedToken.sizeSM,
+    padding: mergedToken.size,
+    paddingMD: mergedToken.sizeMD,
+    paddingLG: mergedToken.sizeLG,
+    paddingXL: mergedToken.sizeXL,
+    paddingContentHorizontalLG: mergedToken.sizeLG,
+    paddingContentVerticalLG: mergedToken.sizeMS,
+    paddingContentHorizontal: mergedToken.sizeMS,
+    paddingContentVertical: mergedToken.sizeSM,
+    paddingContentHorizontalSM: mergedToken.size,
+    paddingContentVerticalSM: mergedToken.sizeXS,
+    marginXXS: mergedToken.sizeXXS,
+    marginXS: mergedToken.sizeXS,
+    marginSM: mergedToken.sizeSM,
+    margin: mergedToken.size,
+    marginMD: mergedToken.sizeMD,
+    marginLG: mergedToken.sizeLG,
+    marginXL: mergedToken.sizeXL,
+    marginXXL: mergedToken.sizeXXL,
+    boxShadow: `
+      0 6px 16px 0 rgba(0, 0, 0, 0.08),
+      0 3px 6px -4px rgba(0, 0, 0, 0.12),
+      0 9px 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowSecondary: `
+      0 6px 16px 0 rgba(0, 0, 0, 0.08),
+      0 3px 6px -4px rgba(0, 0, 0, 0.12),
+      0 9px 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowTertiary: `
+      0 1px 2px 0 rgba(0, 0, 0, 0.03),
+      0 1px 6px -1px rgba(0, 0, 0, 0.02),
+      0 2px 4px 0 rgba(0, 0, 0, 0.02)
+    `,
+    screenXS,
+    screenXSMin: screenXS,
+    screenXSMax: screenSM - 1,
+    screenSM,
+    screenSMMin: screenSM,
+    screenSMMax: screenMD - 1,
+    screenMD,
+    screenMDMin: screenMD,
+    screenMDMax: screenLG - 1,
+    screenLG,
+    screenLGMin: screenLG,
+    screenLGMax: screenXL - 1,
+    screenXL,
+    screenXLMin: screenXL,
+    screenXLMax: screenXXL - 1,
+    screenXXL,
+    screenXXLMin: screenXXL,
+    boxShadowPopoverArrow: '2px 2px 5px rgba(0, 0, 0, 0.05)',
+    boxShadowCard: `
+      0 1px 2px -2px ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.16)').toRgbString()},
+      0 3px 6px 0 ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.12)').toRgbString()},
+      0 5px 12px 4px ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.09)').toRgbString()}
+    `,
+    boxShadowDrawerRight: `
+      -6px 0 16px 0 rgba(0, 0, 0, 0.08),
+      -3px 0 6px -4px rgba(0, 0, 0, 0.12),
+      -9px 0 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowDrawerLeft: `
+      6px 0 16px 0 rgba(0, 0, 0, 0.08),
+      3px 0 6px -4px rgba(0, 0, 0, 0.12),
+      9px 0 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowDrawerUp: `
+      0 6px 16px 0 rgba(0, 0, 0, 0.08),
+      0 3px 6px -4px rgba(0, 0, 0, 0.12),
+      0 9px 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowDrawerDown: `
+      0 -6px 16px 0 rgba(0, 0, 0, 0.08),
+      0 -3px 6px -4px rgba(0, 0, 0, 0.12),
+      0 -9px 28px 8px rgba(0, 0, 0, 0.05)
+    `,
+    boxShadowTabsOverflowLeft: 'inset 10px 0 8px -8px rgba(0, 0, 0, 0.08)',
+    boxShadowTabsOverflowRight: 'inset -10px 0 8px -8px rgba(0, 0, 0, 0.08)',
+    boxShadowTabsOverflowTop: 'inset 0 10px 8px -8px rgba(0, 0, 0, 0.08)',
+    boxShadowTabsOverflowBottom: 'inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08)'
+  }), overrideTokens);
+  return aliasToken;
+}

package/lib/theme/util/genPresetColor.d.ts

@@ -0,0 +1,15 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+import type { AliasToken, PresetColorKey, TokenWithCommonCls } from '../internal';
+interface CalcColor {
+    /** token[`${colorKey}-1`] */
+    lightColor: string;
+    /** token[`${colorKey}-3`] */
+    lightBorderColor: string;
+    /** token[`${colorKey}-6`] */
+    darkColor: string;
+    /** token[`${colorKey}-7`] */
+    textColor: string;
+}
+type GenCSS = (colorKey: PresetColorKey, calcColor: CalcColor) => CSSObject;
+export default function genPresetColor<Token extends TokenWithCommonCls<AliasToken>>(token: Token, genCss: GenCSS): CSSObject;
+export {};

package/lib/theme/util/genPresetColor.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = genPresetColor;
+var _interface = require("../interface");
+function genPresetColor(token, genCss) {
+  return _interface.PresetColors.reduce((prev, colorKey) => {
+    const lightColor = token[`${colorKey}1`];
+    const lightBorderColor = token[`${colorKey}3`];
+    const darkColor = token[`${colorKey}6`];
+    const textColor = token[`${colorKey}7`];
+    return Object.assign(Object.assign({}, prev), genCss(colorKey, {
+      lightColor,
+      lightBorderColor,
+      darkColor,
+      textColor
+    }));
+  }, {});
+}

package/lib/theme/util/genStyleUtils.d.ts

@@ -0,0 +1,26 @@
+import type { AliasToken, ComponentTokenMap } from '../interface';
+export declare const genStyleHooks: <C extends keyof ComponentTokenMap>(component: C | [C, string], styleFn: import("@ant-design/cssinjs-utils").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@ant-design/cssinjs-utils").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
+    resetStyle?: boolean;
+    resetFont?: boolean;
+    deprecatedTokens?: [keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>, keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>][] | undefined;
+    unitless?: Partial<Record<keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>, boolean>> | undefined;
+    clientOnly?: boolean;
+    order?: number;
+    injectStyle?: boolean;
+} | undefined) => (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string], genComponentStyleHook: <C_2 extends keyof ComponentTokenMap>(componentName: C_2 | [C_2, string], styleFn: import("@ant-design/cssinjs-utils").GenStyleFn<ComponentTokenMap, AliasToken, C_2>, getDefaultToken?: import("@ant-design/cssinjs-utils").GetDefaultToken<ComponentTokenMap, AliasToken, C_2> | undefined, options?: {
+    resetStyle?: boolean;
+    resetFont?: boolean;
+    deprecatedTokens?: [keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_2], undefined>, keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_2], undefined>][] | undefined;
+    clientOnly?: boolean;
+    order?: number;
+    injectStyle?: boolean;
+    unitless?: Partial<Record<keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_2], undefined>, boolean>> | undefined;
+} | undefined) => (prefixCls: string, rootCls?: string) => import("@ant-design/cssinjs-utils/lib/interface").UseComponentStyleResult, genSubStyleComponent: <C_1 extends keyof ComponentTokenMap>(componentName: C_1 | [C_1, string], styleFn: import("@ant-design/cssinjs-utils").GenStyleFn<ComponentTokenMap, AliasToken, C_1>, getDefaultToken?: import("@ant-design/cssinjs-utils").GetDefaultToken<ComponentTokenMap, AliasToken, C_1> | undefined, options?: {
+    resetStyle?: boolean;
+    resetFont?: boolean;
+    deprecatedTokens?: [keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_1], undefined>, keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_1], undefined>][] | undefined;
+    clientOnly?: boolean;
+    order?: number;
+    injectStyle?: boolean;
+    unitless?: Partial<Record<keyof Exclude<import("@ant-design/cssinjs-utils").OverrideTokenMap<ComponentTokenMap, AliasToken>[C_1], undefined>, boolean>> | undefined;
+} | undefined) => React.FunctionComponent<import("@ant-design/cssinjs-utils/lib/util/genStyleUtils").SubStyleComponentProps>;

package/lib/theme/util/genStyleUtils.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.genSubStyleComponent = exports.genStyleHooks = exports.genComponentStyleHook = void 0;
+var _react = require("react");
+var _cssinjsUtils = require("@ant-design/cssinjs-utils");
+var _context = require("../../config-provider/context");
+var _style = require("../../style");
+var _useToken = _interopRequireWildcard(require("../useToken"));
+var _useResetIconStyle = _interopRequireDefault(require("./useResetIconStyle"));
+const {
+  genStyleHooks,
+  genComponentStyleHook,
+  genSubStyleComponent
+} = (0, _cssinjsUtils.genStyleUtils)({
+  usePrefix: () => {
+    const {
+      getPrefixCls,
+      iconPrefixCls
+    } = (0, _react.useContext)(_context.ConfigContext);
+    const rootPrefixCls = getPrefixCls();
+    return {
+      rootPrefixCls,
+      iconPrefixCls
+    };
+  },
+  useToken: () => {
+    const [theme, realToken, hashId, token, cssVar] = (0, _useToken.default)();
+    return {
+      theme,
+      realToken,
+      hashId,
+      token,
+      cssVar
+    };
+  },
+  useCSP: () => {
+    const {
+      csp,
+      iconPrefixCls
+    } = (0, _react.useContext)(_context.ConfigContext);
+    // Generate style for icons
+    (0, _useResetIconStyle.default)(iconPrefixCls, csp);
+    return csp !== null && csp !== void 0 ? csp : {};
+  },
+  getResetStyles: token => [{
+    '&': (0, _style.genLinkStyle)(token)
+  }],
+  getCommonStyle: _style.genCommonStyle,
+  getCompUnitless: () => _useToken.unitless
+});
+exports.genSubStyleComponent = genSubStyleComponent;
+exports.genComponentStyleHook = genComponentStyleHook;
+exports.genStyleHooks = genStyleHooks;

package/lib/theme/util/getAlphaColor.d.ts

@@ -0,0 +1,2 @@
+declare function getAlphaColor(frontColor: string, backgroundColor: string): string;
+export default getAlphaColor;