diff --git a/components/theme/interface/maps/index.ts b/components/theme/interface/maps/index.ts index 29d3f53d7411..9ed5f3e4aa24 100644 --- a/components/theme/interface/maps/index.ts +++ b/components/theme/interface/maps/index.ts @@ -2,6 +2,7 @@ import type { ColorPalettes, LegacyColorPalettes } from '../presetColors'; import type { SeedToken } from '../seeds'; import type { ColorMapToken } from './colors'; import type { FontMapToken } from './font'; +import type { ScrollBarToken } from './scrollbar'; import type { HeightMapToken, SizeMapToken } from './size'; import type { StyleMapToken } from './style'; @@ -9,6 +10,7 @@ export * from './colors'; export * from './font'; export * from './size'; export * from './style'; +export * from './scrollbar'; export interface CommonMapToken extends StyleMapToken { // Motion @@ -43,4 +45,5 @@ export interface MapToken HeightMapToken, StyleMapToken, FontMapToken, + ScrollBarToken, CommonMapToken {} diff --git a/components/theme/interface/maps/scrollbar.ts b/components/theme/interface/maps/scrollbar.ts new file mode 100644 index 000000000000..0a45a1ae2c4d --- /dev/null +++ b/components/theme/interface/maps/scrollbar.ts @@ -0,0 +1,23 @@ +export interface ScrollBarToken { + /** + * @desc 滚动条颜色 + * @descEN Scrollbar color + * @default auto + * @since 5.16.0 + */ + scrollbarColor: string; + /** + * @desc 滚动条宽度 + * @descEN Scrollbar width + * @default auto + * @since 5.16.0 + */ + scrollbarWidth: string; + /** + * @desc 预留的滚动条空间,以避免滚动条出现时布局变化 + * @descEN Reserved space for scrollbar to avoid layout changes when scrollbar appears + * @default auto + * @since 5.16.0 + */ + scrollbarGutter: string; +} diff --git a/components/theme/themes/default/index.ts b/components/theme/themes/default/index.ts index ec5d07b9ed28..badbd0e3ed58 100644 --- a/components/theme/themes/default/index.ts +++ b/components/theme/themes/default/index.ts @@ -1,6 +1,5 @@ import { generate } from '@ant-design/colors'; -import genControlHeight from '../shared/genControlHeight'; -import genSizeMapToken from '../shared/genSizeMapToken'; + import type { ColorPalettes, LegacyColorPalettes, @@ -11,8 +10,11 @@ import type { import { defaultPresetColors } from '../seed'; import genColorMapToken from '../shared/genColorMapToken'; import genCommonMapToken from '../shared/genCommonMapToken'; -import { generateColorPalettes, generateNeutralColorPalettes } from './colors'; +import genControlHeight from '../shared/genControlHeight'; import genFontMapToken from '../shared/genFontMapToken'; +import genScrollbarToken from '../shared/genScrollbarToken'; +import genSizeMapToken from '../shared/genSizeMapToken'; +import { generateColorPalettes, generateNeutralColorPalettes } from './colors'; export default function derivative(token: SeedToken): MapToken { const colorPalettes = Object.keys(defaultPresetColors) @@ -50,6 +52,8 @@ export default function derivative(token: SeedToken): MapToken { ...genSizeMapToken(token), // Height ...genControlHeight(token), + // Scrollbar + ...genScrollbarToken(), // Others ...genCommonMapToken(token), }; diff --git a/components/theme/themes/shared/genScrollbarToken.ts b/components/theme/themes/shared/genScrollbarToken.ts new file mode 100644 index 000000000000..32f5b41cf8cb --- /dev/null +++ b/components/theme/themes/shared/genScrollbarToken.ts @@ -0,0 +1,11 @@ +import type { ScrollBarToken } from '../../interface/maps'; + +function genScrollbarToken(): ScrollBarToken { + return { + scrollbarColor: 'auto', + scrollbarWidth: 'auto', + scrollbarGutter: 'auto', + }; +} + +export default genScrollbarToken;