From 7bd08ba2578930ed758b669929c0b3df77377a5a Mon Sep 17 00:00:00 2001 From: MadCcc Date: Mon, 4 Dec 2023 20:07:20 +0800 Subject: [PATCH] fix: less var (#46250) --- components/theme/__tests__/token.test.tsx | 1 + components/theme/interface/index.ts | 1 + components/theme/interface/maps/index.ts | 3 ++- components/theme/interface/presetColors.ts | 9 ++++++- components/theme/themes/dark/index.ts | 28 +++++++++++++++------- components/theme/themes/default/index.ts | 28 +++++++++++++++------- 6 files changed, 50 insertions(+), 20 deletions(-) diff --git a/components/theme/__tests__/token.test.tsx b/components/theme/__tests__/token.test.tsx index afa825618b1f..b6900f1e2d60 100644 --- a/components/theme/__tests__/token.test.tsx +++ b/components/theme/__tests__/token.test.tsx @@ -37,6 +37,7 @@ describe('Theme', () => { expect(result.current!.token).toEqual( expect.objectContaining({ colorPrimary: '#1677ff', + 'blue-6': '#1677ff', }), ); }); diff --git a/components/theme/interface/index.ts b/components/theme/interface/index.ts index 8091dd14389f..274fab0f7f03 100644 --- a/components/theme/interface/index.ts +++ b/components/theme/interface/index.ts @@ -27,6 +27,7 @@ export type { } from './maps'; export { PresetColors } from './presetColors'; export type { + LegacyColorPalettes, ColorPalettes, PresetColorKey, PresetColorType, diff --git a/components/theme/interface/maps/index.ts b/components/theme/interface/maps/index.ts index a67c579615db..29d3f53d7411 100644 --- a/components/theme/interface/maps/index.ts +++ b/components/theme/interface/maps/index.ts @@ -1,4 +1,4 @@ -import type { ColorPalettes } from '../presetColors'; +import type { ColorPalettes, LegacyColorPalettes } from '../presetColors'; import type { SeedToken } from '../seeds'; import type { ColorMapToken } from './colors'; import type { FontMapToken } from './font'; @@ -37,6 +37,7 @@ export interface CommonMapToken extends StyleMapToken { export interface MapToken extends SeedToken, ColorPalettes, + LegacyColorPalettes, ColorMapToken, SizeMapToken, HeightMapToken, diff --git a/components/theme/interface/presetColors.ts b/components/theme/interface/presetColors.ts index 7adcc1a814b1..e160935e6bcd 100644 --- a/components/theme/interface/presetColors.ts +++ b/components/theme/interface/presetColors.ts @@ -14,12 +14,19 @@ export const PresetColors = [ 'gold', ] as const; -export type PresetColorKey = typeof PresetColors[number]; +export type PresetColorKey = (typeof PresetColors)[number]; export type PresetColorType = Record; type ColorPaletteKeyIndex = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10; +export type LegacyColorPalettes = { + /** + * @deprecated + */ + [key in `${keyof PresetColorType}-${ColorPaletteKeyIndex}`]: string; +}; + export type ColorPalettes = { [key in `${keyof PresetColorType}${ColorPaletteKeyIndex}`]: string; }; diff --git a/components/theme/themes/dark/index.ts b/components/theme/themes/dark/index.ts index 684f0f14e2ca..0bdc5d0a1624 100644 --- a/components/theme/themes/dark/index.ts +++ b/components/theme/themes/dark/index.ts @@ -1,6 +1,12 @@ import { generate } from '@ant-design/colors'; import type { DerivativeFunc } from '@ant-design/cssinjs'; -import type { ColorPalettes, MapToken, PresetColorType, SeedToken } from '../../interface'; +import type { + ColorPalettes, + LegacyColorPalettes, + MapToken, + PresetColorType, + SeedToken, +} from '../../interface'; import { defaultPresetColors } from '../seed'; import genColorMapToken from '../shared/genColorMapToken'; import { generateColorPalettes, generateNeutralColorPalettes } from './colors'; @@ -12,17 +18,21 @@ const derivative: DerivativeFunc = (token, mapToken) => { const colors = generate(token[colorKey], { theme: 'dark' }); return new Array(10).fill(1).reduce((prev, _, i) => { + prev[`${colorKey}-${i + 1}`] = colors[i]; prev[`${colorKey}${i + 1}`] = colors[i]; return prev; - }, {}) as ColorPalettes; + }, {}) as ColorPalettes & LegacyColorPalettes; }) - .reduce((prev, cur) => { - prev = { - ...prev, - ...cur, - }; - return prev; - }, {} as ColorPalettes); + .reduce( + (prev, cur) => { + prev = { + ...prev, + ...cur, + }; + return prev; + }, + {} as ColorPalettes & LegacyColorPalettes, + ); const mergedMapToken = mapToken ?? defaultAlgorithm(token); diff --git a/components/theme/themes/default/index.ts b/components/theme/themes/default/index.ts index 08d398a0f704..ec5d07b9ed28 100644 --- a/components/theme/themes/default/index.ts +++ b/components/theme/themes/default/index.ts @@ -1,7 +1,13 @@ import { generate } from '@ant-design/colors'; import genControlHeight from '../shared/genControlHeight'; import genSizeMapToken from '../shared/genSizeMapToken'; -import type { ColorPalettes, MapToken, PresetColorType, SeedToken } from '../../interface'; +import type { + ColorPalettes, + LegacyColorPalettes, + MapToken, + PresetColorType, + SeedToken, +} from '../../interface'; import { defaultPresetColors } from '../seed'; import genColorMapToken from '../shared/genColorMapToken'; import genCommonMapToken from '../shared/genCommonMapToken'; @@ -14,17 +20,21 @@ export default function derivative(token: SeedToken): MapToken { const colors = generate(token[colorKey]); return new Array(10).fill(1).reduce((prev, _, i) => { + prev[`${colorKey}-${i + 1}`] = colors[i]; prev[`${colorKey}${i + 1}`] = colors[i]; return prev; - }, {}) as ColorPalettes; + }, {}) as ColorPalettes & LegacyColorPalettes; }) - .reduce((prev, cur) => { - prev = { - ...prev, - ...cur, - }; - return prev; - }, {} as ColorPalettes); + .reduce( + (prev, cur) => { + prev = { + ...prev, + ...cur, + }; + return prev; + }, + {} as ColorPalettes & LegacyColorPalettes, + ); return { ...token,