type: typeScript definition improvement

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

AGENTS.md

@@ -343,7 +343,7 @@ export const prepareComponentToken: GetDefaultToken<'ComponentName'> = (token) =
 });
 
 // 3. 样式生成函数
-const genComponentStyle: GenerateStyle<ComponentToken> = (token) => {
+const genComponentStyle: GenerateStyle<ComponentToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     [componentCls]: {
@@ -767,9 +767,14 @@ export const prepareComponentToken: GetDefaultToken<'ComponentName'> = (token) =
   componentPadding: token.paddingXS,
 });
 
-const genComponentStyle: GenerateStyle<ComponentToken> = (token) => {
+const genComponentStyle: GenerateStyle<ComponentToken, CSSObject> = (token) => {
   const { componentCls, fontSize, padding } = token;
-  return { [componentCls]: { fontSize, padding } };
+  return {
+    [componentCls]: {
+      fontSize,
+      padding,
+    },
+  };
 };
 
 export default genStyleHooks(
@@ -837,10 +842,8 @@ export default genStyleHooks(
    - **组件名不用反引号**：组件名（如 Modal、Drawer、Button、Upload.Dragger）不使用 `` ` `` 包裹；属性名、API、token 等仍用反引号
 
 3. **中英文条目句式**：
-   - **中文**：`Emoji 组件名 动词/描述 … [#PR](链接) [@贡献者]`  
-     例：`🐞 Button 修复暗色主题下 \`color\` 的 \`hover\` 与 \`active\` 状态颜色相反的问题。`
-   - **英文**：`Emoji 动词 组件名 描述 … [#PR](链接) [@贡献者]`（动词在前，如 Fix / Add / Support / Remove / Disable / Refactor / Improve / Change）  
-     例：`🐞 Fix Button reversed \`hover\` and \`active\` colors for \`color\` in dark theme.`
+   - **中文**：`Emoji 组件名 动词/描述 … [#PR](链接) [@贡献者]` 例：`🐞 Button 修复暗色主题下 \`color\` 的 \`hover\` 与 \`active\` 状态颜色相反的问题。`
+   - **英文**：`Emoji 动词 组件名 描述 … [#PR](链接) [@贡献者]`（动词在前，如 Fix / Add / Support / Remove / Disable / Refactor / Improve / Change）例：`🐞 Fix Button reversed \`hover\` and \`active\` colors for \`color\` in dark theme.`
 
 4. **分组逻辑**：
    - **多项改动**：同一组件有 2 条及以上改动时，使用 `- 组件名` 作为分类标题（不加粗），具体条目缩进排列，子条中仍须包含组件名

components/_util/wave/style.ts

@@ -1,3 +1,5 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import { genComponentStyleHook } from '../../theme/internal';
 import type { FullToken, GenerateStyle } from '../../theme/internal';
 import { genCssVar } from '../../theme/util/genStyleUtils';
@@ -7,7 +9,7 @@ export interface ComponentToken {}
 
 export interface WaveToken extends FullToken<'Wave'> {}
 
-const genWaveStyle: GenerateStyle<WaveToken> = (token) => {
+const genWaveStyle: GenerateStyle<WaveToken, CSSObject> = (token) => {
   const {
     componentCls,
     colorPrimary,

components/affix/style/index.ts

@@ -1,5 +1,3 @@
-import type { CSSObject } from '@ant-design/cssinjs';
-
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks } from '../../theme/internal';
 
@@ -16,7 +14,7 @@ interface AffixToken extends FullToken<'Affix'> {
 }
 
 // ============================== Shared ==============================
-const genSharedAffixStyle: GenerateStyle<AffixToken> = (token): CSSObject => {
+const genSharedAffixStyle: GenerateStyle<AffixToken> = (token) => {
   const { componentCls } = token;
   return {
     [componentCls]: {

components/alert/style/index.ts

@@ -43,7 +43,7 @@ const genAlertTypeStyle = (
   },
 });
 
-export const genBaseStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSObject => {
+export const genBaseStyle: GenerateStyle<AlertToken, CSSObject> = (token) => {
   const {
     componentCls,
     motionDurationSlow: duration,
@@ -142,7 +142,7 @@ export const genBaseStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSO
   };
 };
 
-export const genTypeStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSObject => {
+export const genTypeStyle: GenerateStyle<AlertToken, CSSObject> = (token) => {
   const {
     componentCls,
 
@@ -191,7 +191,7 @@ export const genTypeStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSO
   };
 };
 
-export const genActionStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSObject => {
+export const genActionStyle: GenerateStyle<AlertToken, CSSObject> = (token) => {
   const {
     componentCls,
     iconCls,

components/anchor/style/index.ts

@@ -1,3 +1,4 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import { resetComponent, textEllipsis } from '../../style';
@@ -45,7 +46,7 @@ interface AnchorToken extends FullToken<'Anchor'> {
 }
 
 // ============================== Shared ==============================
-const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token) => {
+const genSharedAnchorStyle: GenerateStyle<AnchorToken, CSSObject> = (token) => {
   const {
     componentCls,
     holderOffsetBlock,
@@ -131,7 +132,7 @@ const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token) => {
   };
 };
 
-const genSharedAnchorHorizontalStyle: GenerateStyle<AnchorToken> = (token) => {
+const genSharedAnchorHorizontalStyle: GenerateStyle<AnchorToken, CSSObject> = (token) => {
   const { componentCls, motionDurationSlow, lineWidthBold, colorPrimary } = token;
 
   return {

components/app/style/index.ts

@@ -1,3 +1,5 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks } from '../../theme/internal';
 
@@ -7,7 +9,7 @@ export interface ComponentToken {}
 interface AppToken extends FullToken<'App'> {}
 
 // =============================== Base ===============================
-const genBaseStyle: GenerateStyle<AppToken> = (token) => {
+const genBaseStyle: GenerateStyle<AppToken, CSSObject> = (token) => {
   const { componentCls, colorText, fontSize, lineHeight, fontFamily } = token;
   return {
     [componentCls]: {

components/avatar/style/index.ts

@@ -78,7 +78,7 @@ type AvatarToken = FullToken<'Avatar'> & {
   avatarColor: string;
 };
 
-const genBaseStyle: GenerateStyle<AvatarToken> = (token) => {
+const genBaseStyle: GenerateStyle<AvatarToken, CSSObject> = (token) => {
   const {
     antCls,
     componentCls,
@@ -168,7 +168,7 @@ const genBaseStyle: GenerateStyle<AvatarToken> = (token) => {
   };
 };
 
-const genGroupStyle: GenerateStyle<AvatarToken> = (token) => {
+const genGroupStyle: GenerateStyle<AvatarToken, CSSObject> = (token) => {
   const { componentCls, groupBorderColor, groupOverlapping, groupSpace } = token;
 
   return {

components/back-top/style/index.ts

@@ -65,7 +65,7 @@ type BackTopToken = FullToken<'BackTop'> & {
 };
 
 // ============================== Shared ==============================
-const genSharedBackTopStyle: GenerateStyle<BackTopToken, CSSObject> = (token): CSSObject => {
+const genSharedBackTopStyle: GenerateStyle<BackTopToken, CSSObject> = (token) => {
   const { componentCls, backTopFontSize, backTopSize, zIndexPopup } = token;
 
   return {
@@ -109,7 +109,7 @@ const genSharedBackTopStyle: GenerateStyle<BackTopToken, CSSObject> = (token): C
   };
 };
 
-const genMediaBackTopStyle: GenerateStyle<BackTopToken> = (token): CSSObject => {
+const genMediaBackTopStyle: GenerateStyle<BackTopToken, CSSObject> = (token) => {
   const { componentCls, screenMD, screenXS, backTopInlineEndMD, backTopInlineEndXS } = token;
   return {
     [`@media (max-width: ${unit(screenMD)})`]: {

components/badge/style/index.ts

@@ -1,3 +1,4 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { Keyframes, unit } from '@ant-design/cssinjs';
 
 import { resetComponent } from '../../style';
@@ -139,7 +140,7 @@ const antBadgeLoadingCircle = new Keyframes('antBadgeLoadingCircle', {
   },
 });
 
-const genSharedBadgeStyle: GenerateStyle<BadgeToken> = (token) => {
+const genSharedBadgeStyle: GenerateStyle<BadgeToken, CSSObject> = (token) => {
   const {
     componentCls,
     iconCls,
@@ -372,7 +373,7 @@ const genSharedBadgeStyle: GenerateStyle<BadgeToken> = (token) => {
 };
 
 // ============================== Export ==============================
-export const prepareToken: (token: Parameters<GenStyleFn<'Badge'>>[0]) => BadgeToken = (token) => {
+export const prepareToken = (token: Parameters<GenStyleFn<'Badge'>>[0]) => {
   const { fontHeight, lineWidth, marginXS, colorBorderBg } = token;
 
   const badgeFontHeight = fontHeight;

components/badge/style/ribbon.ts

@@ -1,3 +1,4 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import { prepareComponentToken, prepareToken } from '.';
@@ -7,7 +8,7 @@ import type { GenerateStyle } from '../../theme/internal';
 import { genPresetColor, genStyleHooks } from '../../theme/internal';
 
 // ============================== Ribbon ==============================
-const genRibbonStyle: GenerateStyle<BadgeToken> = (token) => {
+const genRibbonStyle: GenerateStyle<BadgeToken, CSSObject> = (token) => {
   const { antCls, badgeFontHeight, marginXS, badgeRibbonOffset, calc } = token;
   const ribbonPrefixCls = `${antCls}-ribbon`;
   const ribbonWrapperPrefixCls = `${antCls}-ribbon-wrapper`;

components/button/style/index.ts

@@ -13,7 +13,7 @@ import genVariantStyle from './variant';
 export type { ComponentToken };
 
 // ============================== Shared ==============================
-const genSharedButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token): CSSObject => {
+const genSharedButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => {
   const {
     componentCls,
     iconCls,
@@ -211,7 +211,7 @@ const genSizeLargeButtonStyle: GenerateStyle<ButtonToken> = (token) => {
   return genButtonStyle(largeToken, `${token.componentCls}-lg`);
 };
 
-const genBlockButtonStyle: GenerateStyle<ButtonToken> = (token) => {
+const genBlockButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     [componentCls]: {

components/button/style/token.ts

@@ -283,9 +283,7 @@ export interface ButtonToken
   buttonIconOnlyFontSize: number | string;
 }
 
-export const prepareToken: (token: Parameters<GenStyleFn<'Button'>>[0]) => ButtonToken = (
-  token,
-) => {
+export const prepareToken = (token: Parameters<GenStyleFn<'Button'>>[0]) => {
   const { paddingInline, onlyIconSize, borderColorDisabled } = token;
 
   const buttonToken = mergeToken<ButtonToken>(token, {
@@ -310,7 +308,7 @@ export const prepareComponentToken: GetDefaultToken<'Button'> = (token) => {
     : '#fff';
 
   const shadowColorTokens = PresetColors.reduce<CSSObject>(
-    (prev: CSSObject, colorKey: PresetColorKey) => ({
+    (prev, colorKey) => ({
       ...prev,
       [`${colorKey}ShadowColor`]: `0 ${unit(token.controlOutlineWidth)} 0 ${getAlphaColor(token[`${colorKey}1`], token.colorBgContainer)}`,
     }),

components/button/style/variant.ts

@@ -1,9 +1,11 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import { PresetColors } from '../../theme/interface';
 import type { GenerateStyle } from '../../theme/interface';
 import { genCssVar } from '../../theme/util/genStyleUtils';
 import type { ButtonToken } from './token';
 
-const genVariantStyle: GenerateStyle<ButtonToken> = (token) => {
+const genVariantStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => {
   const { componentCls, antCls, lineWidth } = token;
 
   const [varName, varRef] = genCssVar(antCls, 'btn');

components/calendar/style/index.ts

@@ -8,7 +8,7 @@ import {
   initPickerPanelToken,
 } from '../../date-picker/style';
 import { resetComponent } from '../../style';
-import type { FullToken, GetDefaultToken } from '../../theme/internal';
+import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 
 export interface ComponentToken {
@@ -67,7 +67,7 @@ interface CalendarToken extends FullToken<'Calendar'>, PickerPanelToken, PanelCo
   dateContentHeight: number | string;
 }
 
-export const genCalendarStyles = (token: CalendarToken): CSSObject => {
+export const genCalendarStyles: GenerateStyle<CalendarToken, CSSObject> = (token) => {
   const { calendarCls, componentCls, fullBg, fullPanelBg, itemActiveBg } = token;
   return {
     [calendarCls]: {

components/carousel/style/index.ts

@@ -1,3 +1,4 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { Keyframes, unit } from '@ant-design/cssinjs';
 
 import { resetComponent } from '../../style';
@@ -48,7 +49,7 @@ interface CarouselToken extends FullToken<'Carousel'> {}
 
 export const DotDuration = '--dot-duration';
 
-const genCarouselStyle: GenerateStyle<CarouselToken> = (token) => {
+const genCarouselStyle: GenerateStyle<CarouselToken, CSSObject> = (token) => {
   const { componentCls, antCls } = token;
 
   return {

components/cascader/style/columns.ts

@@ -6,7 +6,7 @@ import { getStyle as getCheckboxStyle } from '../../checkbox/style';
 import { textEllipsis } from '../../style';
 import type { GenerateStyle } from '../../theme/internal';
 
-const getColumnsStyle: GenerateStyle<CascaderToken> = (token: CascaderToken): CSSInterpolation => {
+const getColumnsStyle: GenerateStyle<CascaderToken, CSSInterpolation> = (token) => {
   const { prefixCls, componentCls } = token;
 
   const cascaderMenuItemCls = `${componentCls}-menu-item`;

components/cascader/style/index.ts

@@ -96,7 +96,6 @@ export const prepareComponentToken = (token: GlobalToken) => {
   const itemPaddingVertical = Math.round(
     (token.controlHeight - token.fontSize * token.lineHeight) / 2,
   );
-
   return {
     controlWidth: 184,
     controlItemWidth: 111,

components/cascader/style/panel.ts

@@ -8,7 +8,7 @@ import type { GenerateStyle } from '../../theme/internal';
 import getColumnsStyle from './columns';
 
 // ============================== Panel ===============================
-const genPanelStyle: GenerateStyle<CascaderToken> = (token: CascaderToken): CSSObject => {
+const genPanelStyle: GenerateStyle<CascaderToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/collapse/style/index.ts

@@ -1,4 +1,5 @@
 import type { CSSProperties } from 'react';
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import { genFocusStyle, resetComponent, resetIcon } from '../../style';
@@ -59,7 +60,7 @@ type CollapseToken = FullToken<'Collapse'> & {
   collapsePanelBorderRadius: number;
 };
 
-export const genBaseStyle: GenerateStyle<CollapseToken> = (token) => {
+export const genBaseStyle: GenerateStyle<CollapseToken, CSSObject> = (token) => {
   const {
     componentCls,
     contentBg,
@@ -269,7 +270,7 @@ export const genBaseStyle: GenerateStyle<CollapseToken> = (token) => {
   };
 };
 
-const genArrowStyle: GenerateStyle<CollapseToken> = (token) => {
+const genArrowStyle: GenerateStyle<CollapseToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   const fixedSelector = `> ${componentCls}-item > ${componentCls}-header ${componentCls}-arrow`;
@@ -283,7 +284,7 @@ const genArrowStyle: GenerateStyle<CollapseToken> = (token) => {
   };
 };
 
-const genBorderlessStyle: GenerateStyle<CollapseToken> = (token) => {
+const genBorderlessStyle: GenerateStyle<CollapseToken, CSSObject> = (token) => {
   const { componentCls, headerBg, borderlessContentPadding, borderlessContentBg, colorBorder } =
     token;
 
@@ -319,7 +320,7 @@ const genBorderlessStyle: GenerateStyle<CollapseToken> = (token) => {
   };
 };
 
-const genGhostStyle: GenerateStyle<CollapseToken> = (token) => {
+const genGhostStyle: GenerateStyle<CollapseToken, CSSObject> = (token) => {
   const { componentCls, paddingSM } = token;
 
   return {

components/color-picker/style/index.ts

@@ -76,7 +76,7 @@ export const genActiveStyle = (
   outline: 0,
 });
 
-const genRtlStyle = (token: ColorPickerToken): CSSObject => {
+const genRtlStyle: GenerateStyle<ColorPickerToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     '&-rtl': {
@@ -133,7 +133,7 @@ const genClearStyle = (
   };
 };
 
-const genStatusStyle = (token: ColorPickerToken): CSSObject => {
+const genStatusStyle: GenerateStyle<ColorPickerToken, CSSObject> = (token) => {
   const {
     componentCls,
     colorError,
@@ -164,7 +164,7 @@ const genStatusStyle = (token: ColorPickerToken): CSSObject => {
     },
   };
 };
-const genSizeStyle = (token: ColorPickerToken): CSSObject => {
+const genSizeStyle: GenerateStyle<ColorPickerToken, CSSObject> = (token) => {
   const {
     componentCls,
     controlHeightLG,

components/date-picker/style/index.ts

@@ -30,7 +30,7 @@ const genPickerPadding = (paddingBlock: number, paddingInline: number): CSSObjec
   };
 };
 
-const genPickerStatusStyle: GenerateStyle<PickerToken> = (token) => {
+const genPickerStatusStyle: GenerateStyle<PickerToken, CSSObject> = (token) => {
   const { componentCls, colorError, colorWarning } = token;
 
   return {

components/date-picker/style/panel.ts

@@ -5,7 +5,7 @@ import { FastColor } from '@ant-design/fast-color';
 import type { GenerateStyle } from '../../theme/internal';
 import type { PickerToken, SharedPickerToken } from './token';
 
-const genPickerCellInnerStyle = (token: SharedPickerToken): CSSObject => {
+const genPickerCellInnerStyle: GenerateStyle<SharedPickerToken, CSSObject> = (token) => {
   const {
     pickerCellCls,
     pickerCellInnerCls,
@@ -141,7 +141,7 @@ const genPickerCellInnerStyle = (token: SharedPickerToken): CSSObject => {
   };
 };
 
-export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
+export const genPanelStyle: GenerateStyle<SharedPickerToken, CSSObject> = (token) => {
   const {
     componentCls,
     pickerCellCls,
@@ -625,7 +625,7 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
   };
 };
 
-const genPickerPanelStyle: GenerateStyle<PickerToken> = (token) => {
+const genPickerPanelStyle: GenerateStyle<PickerToken, CSSObject> = (token) => {
   const {
     componentCls,
     textHeight,

components/date-picker/style/variants.ts

@@ -7,9 +7,10 @@ import {
   genOutlinedStyle,
   genUnderlinedStyle,
 } from '../../input/style/variants';
+import type { GenerateStyle } from '../../theme/interface';
 import type { PickerToken } from './token';
 
-const genVariantsStyle = (token: PickerToken): CSSObject => {
+const genVariantsStyle: GenerateStyle<PickerToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/descriptions/style/index.ts

@@ -62,7 +62,7 @@ export interface ComponentToken {
 
 interface DescriptionsToken extends FullToken<'Descriptions'> {}
 
-const genBorderedStyle = (token: DescriptionsToken): CSSObject => {
+const genBorderedStyle: GenerateStyle<DescriptionsToken, CSSObject> = (token) => {
   const { componentCls, labelBg } = token;
   return {
     [`&${componentCls}-bordered`]: {
@@ -118,7 +118,7 @@ const genBorderedStyle = (token: DescriptionsToken): CSSObject => {
   };
 };
 
-const genDescriptionStyles: GenerateStyle<DescriptionsToken> = (token) => {
+const genDescriptionStyles: GenerateStyle<DescriptionsToken, CSSObject> = (token) => {
   const {
     componentCls,
     extraColor,

components/divider/style/index.ts

@@ -43,7 +43,7 @@ interface DividerToken extends FullToken<'Divider'> {
 }
 
 // ============================== Size ================================
-const genSizeDividerStyle: GenerateStyle<DividerToken> = (token): CSSObject => {
+const genSizeDividerStyle: GenerateStyle<DividerToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {
@@ -63,7 +63,7 @@ const genSizeDividerStyle: GenerateStyle<DividerToken> = (token): CSSObject => {
 };
 
 // ============================== Shared ==============================
-const genSharedDividerStyle: GenerateStyle<DividerToken> = (token): CSSObject => {
+const genSharedDividerStyle: GenerateStyle<DividerToken, CSSObject> = (token) => {
   const {
     componentCls,
     sizePaddingEdgeHorizontal,

components/dropdown/style/status.ts

@@ -1,7 +1,9 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { DropdownToken } from '.';
 import type { GenerateStyle } from '../../theme/internal';
 
-const genStatusStyle: GenerateStyle<DropdownToken> = (token) => {
+const genStatusStyle: GenerateStyle<DropdownToken, CSSObject> = (token) => {
   const { componentCls, menuCls, colorError, colorTextLightSolid } = token;
 
   const itemCls = `${menuCls}-item`;

components/form/style/explain.ts

@@ -1,7 +1,9 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { FormToken } from '.';
 import type { GenerateStyle } from '../../theme/internal';
 
-const genFormValidateMotionStyle: GenerateStyle<FormToken> = (token) => {
+const genFormValidateMotionStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { componentCls, motionDurationFast, motionEaseInOut } = token;
 
   const helpCls = `${componentCls}-show-help`;

components/form/style/fallbackCmp.ts

@@ -4,13 +4,15 @@
  */
 
 // Style as inline component
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import { prepareToken } from '.';
 import type { FormToken } from '.';
 import { genSubStyleComponent } from '../../theme/internal';
 import type { GenerateStyle } from '../../theme/internal';
 
 // ============================= Fallback =============================
-const genFallbackStyle: GenerateStyle<FormToken> = (token) => {
+const genFallbackStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { formItemCls } = token;
 
   return {

components/form/style/index.ts

@@ -85,7 +85,7 @@ export interface FormToken extends FullToken<'Form'> {
   rootPrefixCls: string;
 }
 
-const resetForm = (token: AliasToken): CSSObject => ({
+const resetForm: GenerateStyle<AliasToken, CSSObject> = (token) => ({
   legend: {
     display: 'block',
     width: '100%',
@@ -156,11 +156,10 @@ const genFormSize = (token: FormToken, height: number): CSSObject => {
   };
 };
 
-const genFormStyle: GenerateStyle<FormToken> = (token) => {
+const genFormStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { componentCls } = token;
-
   return {
-    [token.componentCls]: {
+    [componentCls]: {
       ...resetComponent(token),
       ...resetForm(token),
 
@@ -183,7 +182,7 @@ const genFormStyle: GenerateStyle<FormToken> = (token) => {
   };
 };
 
-const genFormItemStyle: GenerateStyle<FormToken> = (token) => {
+const genFormItemStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const {
     formItemCls,
     iconCls,
@@ -424,7 +423,7 @@ const genFormItemStyle: GenerateStyle<FormToken> = (token) => {
   };
 };
 
-const makeVerticalLayoutLabel = (token: FormToken): CSSObject => ({
+const makeVerticalLayoutLabel: GenerateStyle<FormToken, CSSObject> = (token) => ({
   padding: token.verticalLabelPadding,
   margin: token.verticalLabelMargin,
   whiteSpace: 'initial',
@@ -440,7 +439,7 @@ const makeVerticalLayoutLabel = (token: FormToken): CSSObject => ({
   },
 });
 
-const genHorizontalStyle = (token: FormToken): CSSObject => {
+const genHorizontalStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { antCls, formItemCls } = token;
 
   return {
@@ -471,7 +470,7 @@ const genHorizontalStyle = (token: FormToken): CSSObject => {
   };
 };
 
-const genInlineStyle: GenerateStyle<FormToken> = (token) => {
+const genInlineStyle: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { componentCls, formItemCls, inlineItemMarginBottom } = token;
 
   return {
@@ -510,7 +509,7 @@ const genInlineStyle: GenerateStyle<FormToken> = (token) => {
   };
 };
 
-const makeVerticalLayout = (token: FormToken): CSSObject => {
+const makeVerticalLayout: GenerateStyle<FormToken, CSSObject> = (token) => {
   const { componentCls, formItemCls, rootPrefixCls } = token;
 
   return {
@@ -606,10 +605,7 @@ export const prepareComponentToken: GetDefaultToken<'Form'> = (token) => ({
   inlineItemMarginBottom: 0,
 });
 
-export const prepareToken: (
-  token: Parameters<GenStyleFn<'Form'>>[0],
-  rootPrefixCls: string,
-) => FormToken = (token, rootPrefixCls) => {
+export const prepareToken = (token: Parameters<GenStyleFn<'Form'>>[0], rootPrefixCls: string) => {
   const formToken = mergeToken<FormToken>(token, {
     formItemCls: `${token.componentCls}-item`,
     rootPrefixCls,

components/grid/style/index.ts

@@ -21,7 +21,7 @@ interface GridColToken extends FullToken<'Grid'> {
 }
 
 // ============================== Row-Shared ==============================
-const genGridRowStyle: GenerateStyle<GridRowToken> = (token): CSSObject => {
+const genGridRowStyle: GenerateStyle<GridRowToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {
@@ -84,7 +84,7 @@ const genGridRowStyle: GenerateStyle<GridRowToken> = (token): CSSObject => {
 };
 
 // ============================== Col-Shared ==============================
-const genGridColStyle: GenerateStyle<GridColToken> = (token): CSSObject => {
+const genGridColStyle: GenerateStyle<GridColToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/image/style/index.ts

@@ -57,7 +57,7 @@ export const genBoxStyle = (position?: PositionType): CSSObject => ({
   inset: 0,
 });
 
-export const genImageCoverStyle = (token: ImageToken): CSSObject => {
+export const genImageCoverStyle: GenerateStyle<ImageToken, CSSObject> = (token) => {
   const { componentCls, motionDurationSlow, colorTextLightSolid } = token;
   return {
     [componentCls]: {
@@ -90,7 +90,7 @@ export const genImageCoverStyle = (token: ImageToken): CSSObject => {
   };
 };
 
-export const genImagePreviewStyle: GenerateStyle<ImageToken> = (token: ImageToken) => {
+export const genImagePreviewStyle: GenerateStyle<ImageToken, CSSObject> = (token) => {
   const {
     motionEaseOut,
     previewCls,
@@ -255,7 +255,7 @@ export const genImagePreviewStyle: GenerateStyle<ImageToken> = (token: ImageToke
   };
 };
 
-const genImageStyle: GenerateStyle<ImageToken> = (token: ImageToken) => {
+const genImageStyle: GenerateStyle<ImageToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     // ============================== image ==============================
@@ -282,7 +282,7 @@ const genImageStyle: GenerateStyle<ImageToken> = (token: ImageToken) => {
   };
 };
 
-const genPreviewMotion: GenerateStyle<ImageToken> = (token) => {
+const genPreviewMotion: GenerateStyle<ImageToken, CSSObject> = (token) => {
   const { previewCls, motionDurationSlow } = token;
 
   return {

components/input-number/style/index.ts

@@ -1,3 +1,4 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import { genBasicInputStyle, genPlaceholderStyle, initInputToken } from '../../input/style';
@@ -324,7 +325,7 @@ const genInputNumberStyles: GenerateStyle<InputNumberToken> = (token) => {
   ];
 };
 
-const genCompatibleStyles: GenerateStyle<InputNumberToken> = (token: InputNumberToken) => {
+const genCompatibleStyles: GenerateStyle<InputNumberToken, CSSObject> = (token) => {
   const { componentCls, antCls } = token;
 
   return {

components/input/style/index.ts

@@ -347,7 +347,7 @@ export const genInputGroupStyle = (token: InputToken): CSSObject => {
   };
 };
 
-export const genInputStyle: GenerateStyle<InputToken> = (token: InputToken) => {
+export const genInputStyle: GenerateStyle<InputToken, CSSObject> = (token) => {
   const { componentCls, controlHeightSM, lineWidth, calc } = token;
 
   const FIXED_CHROME_COLOR_HEIGHT = 16;
@@ -426,7 +426,7 @@ const genAllowClearStyle = (token: InputToken): CSSObject => {
   };
 };
 
-export const genAffixStyle: GenerateStyle<InputToken> = (token: InputToken) => {
+export const genAffixStyle: GenerateStyle<InputToken, CSSObject> = (token) => {
   const {
     componentCls,
     inputAffixPadding,
@@ -539,7 +539,7 @@ export const genAffixStyle: GenerateStyle<InputToken> = (token: InputToken) => {
   };
 };
 
-const genGroupStyle: GenerateStyle<InputToken> = (token: InputToken) => {
+const genGroupStyle: GenerateStyle<InputToken, CSSObject> = (token) => {
   const { componentCls, borderRadiusLG, borderRadiusSM } = token;
 
   return {
@@ -630,7 +630,7 @@ const genGroupStyle: GenerateStyle<InputToken> = (token: InputToken) => {
 };
 
 // ============================== Range ===============================
-const genRangeStyle: GenerateStyle<InputToken> = (token) => {
+const genRangeStyle: GenerateStyle<InputToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/input/style/otp.ts

@@ -1,10 +1,12 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { GenerateStyle } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 import type { InputToken } from './token';
 import { initComponentToken, initInputToken } from './token';
 
 // =============================== OTP ================================
-const genOTPStyle: GenerateStyle<InputToken> = (token) => {
+const genOTPStyle: GenerateStyle<InputToken, CSSObject> = (token) => {
   const { componentCls, paddingXS } = token;
 
   return {

components/input/style/search.ts

@@ -1,7 +1,9 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { FullToken, GenerateStyle } from '../../theme/internal';
 import { genStyleHooks } from '../../theme/internal';
 
-const genSearchStyle: GenerateStyle<FullToken<'Input'>> = (token) => {
+const genSearchStyle: GenerateStyle<FullToken<'Input'>, CSSObject> = (token) => {
   const { componentCls } = token;
 
   const btnCls = `${componentCls}-btn`;

components/input/style/variants.ts

@@ -1,15 +1,16 @@
 import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
+import type { GenerateStyle } from '../../theme/internal';
 import { mergeToken } from '../../theme/internal';
 import type { InputToken } from './token';
 
-export const genHoverStyle = (token: InputToken): CSSObject => ({
+export const genHoverStyle: GenerateStyle<InputToken, CSSObject> = (token) => ({
   borderColor: token.hoverBorderColor,
   backgroundColor: token.hoverBg,
 });
 
-export const genDisabledStyle = (token: InputToken): CSSObject => ({
+export const genDisabledStyle: GenerateStyle<InputToken, CSSObject> = (token) => ({
   color: token.colorTextDisabled,
   backgroundColor: token.colorBgContainerDisabled,
   borderColor: token.colorBorder,
@@ -133,7 +134,7 @@ const genOutlinedGroupStatusStyle = (
   },
 });
 
-export const genOutlinedGroupStyle = (token: InputToken): CSSObject => ({
+export const genOutlinedGroupStyle: GenerateStyle<InputToken, CSSObject> = (token) => ({
   '&-outlined': {
     [`${token.componentCls}-group`]: {
       '&-addon': {
@@ -308,7 +309,7 @@ const genFilledGroupStatusStyle = (
   },
 });
 
-export const genFilledGroupStyle = (token: InputToken): CSSObject => ({
+export const genFilledGroupStyle: GenerateStyle<InputToken, CSSObject> = (token) => ({
   '&-filled': {
     [`${token.componentCls}-group-addon`]: {
       background: token.colorFillTertiary,

components/list/style/index.ts

@@ -81,7 +81,7 @@ interface ListToken extends FullToken<'List'> {
   minHeight: number | string;
 }
 
-const genBorderedStyle = (token: ListToken): CSSObject => {
+const genBorderedStyle: GenerateStyle<ListToken, CSSObject> = (token) => {
   const {
     listBorderedCls,
     componentCls,
@@ -128,7 +128,7 @@ const genBorderedStyle = (token: ListToken): CSSObject => {
     },
   };
 };
-const genResponsiveStyle = (token: ListToken): CSSObject => {
+const genResponsiveStyle: GenerateStyle<ListToken, CSSObject> = (token) => {
   const { componentCls, screenSM, screenMD, marginLG, marginSM, margin } = token;
   return {
     [`@media screen and (max-width:${screenMD}px)`]: {
@@ -178,7 +178,7 @@ const genResponsiveStyle = (token: ListToken): CSSObject => {
 };
 
 // =============================== Base ===============================
-const genBaseStyle: GenerateStyle<ListToken> = (token) => {
+const genBaseStyle: GenerateStyle<ListToken, CSSObject> = (token) => {
   const {
     componentCls,
     antCls,

components/masonry/style/index.ts

@@ -8,7 +8,7 @@ export interface ComponentToken {}
 
 export interface MasonryToken extends FullToken<'Masonry'> {}
 
-export const genMasonryStyle: GenerateStyle<MasonryToken> = (token: MasonryToken): CSSObject => {
+export const genMasonryStyle: GenerateStyle<MasonryToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   const itemCls = `${componentCls}-item`;

components/menu/style/index.ts

@@ -406,7 +406,7 @@ export interface MenuToken extends FullToken<'Menu'> {
   darkPopupBg: string;
 }
 
-const genMenuItemStyle = (token: MenuToken): CSSObject => {
+const genMenuItemStyle: GenerateStyle<MenuToken, CSSObject> = (token) => {
   const {
     componentCls,
     motionDurationSlow,
@@ -486,7 +486,7 @@ const genMenuItemStyle = (token: MenuToken): CSSObject => {
   };
 };
 
-const genSubMenuArrowStyle = (token: MenuToken): CSSObject => {
+const genSubMenuArrowStyle: GenerateStyle<MenuToken, CSSObject> = (token) => {
   const {
     componentCls,
     motionDurationSlow,

components/modal/style/index.ts

@@ -1,4 +1,5 @@
 import type React from 'react';
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import { getMediaSize } from '../../grid/style';
@@ -396,7 +397,7 @@ const genRTLStyle: GenerateStyle<ModalToken> = (token) => {
   };
 };
 
-const genResponsiveWidthStyle: GenerateStyle<ModalToken> = (token) => {
+const genResponsiveWidthStyle: GenerateStyle<ModalToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   const oriGridMediaSizesMap: Record<string, number> = getMediaSize(token);
@@ -434,7 +435,7 @@ const genResponsiveWidthStyle: GenerateStyle<ModalToken> = (token) => {
 };
 
 // ============================== Export ==============================
-export const prepareToken: (token: Parameters<GenStyleFn<'Modal'>>[0]) => ModalToken = (token) => {
+export const prepareToken = (token: Parameters<GenStyleFn<'Modal'>>[0]) => {
   const headerPaddingVertical = token.padding;
   const headerFontSize = token.fontSizeHeading5;
   const headerLineHeight = token.lineHeightHeading5;

components/notification/style/index.ts

@@ -109,7 +109,7 @@ export interface NotificationToken extends FullToken<'Notification'> {
   notificationProgressHeight: number;
 }
 
-export const genNoticeStyle = (token: NotificationToken): CSSObject => {
+export const genNoticeStyle: GenerateStyle<NotificationToken, CSSObject> = (token) => {
   const {
     iconCls,
     componentCls, // .ant-notification

components/notification/style/stack.ts

@@ -30,7 +30,7 @@ const genPlacementStackStyle = (
   };
 };
 
-const genStackChildrenStyle = (token: NotificationToken): CSSObject => {
+const genStackChildrenStyle: GenerateStyle<NotificationToken, CSSObject> = (token) => {
   const childrenStyle: CSSObject = {};
   for (let i = 1; i < token.notificationStackLayer; i++) {
     childrenStyle[`&:nth-last-child(${i + 1})`] = {

components/progress/style/index.ts

@@ -302,7 +302,7 @@ const genCircleStyle: GenerateStyle<ProgressToken> = (token) => {
 // ====================================================================
 // ==                              Step                              ==
 // ====================================================================
-const genStepStyle: GenerateStyle<ProgressToken> = (token: ProgressToken): CSSObject => {
+const genStepStyle: GenerateStyle<ProgressToken, CSSObject> = (token) => {
   const { componentCls: progressCls } = token;
 
   return {
@@ -337,7 +337,7 @@ const genStepStyle: GenerateStyle<ProgressToken> = (token: ProgressToken): CSSOb
 // ====================================================================
 // ==                           Small Line                           ==
 // ====================================================================
-const genSmallLine: GenerateStyle<ProgressToken> = (token: ProgressToken): CSSObject => {
+const genSmallLine: GenerateStyle<ProgressToken, CSSObject> = (token) => {
   const { componentCls: progressCls, iconCls: iconPrefixCls } = token;
 
   return {

components/rate/style/index.ts

@@ -98,13 +98,13 @@ const genRateStarStyle: GenerateStyle<RateToken, CSSObject> = (token) => {
   };
 };
 
-const genRateRtlStyle = (token: RateToken): CSSObject => ({
+const genRateRtlStyle: GenerateStyle<RateToken, CSSObject> = (token) => ({
   [`&-rtl${token.componentCls}`]: {
     direction: 'rtl',
   },
 });
 
-const genRateStyle: GenerateStyle<RateToken> = (token) => {
+const genRateStyle: GenerateStyle<RateToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/result/style/index.ts

@@ -38,7 +38,7 @@ interface ResultToken extends FullToken<'Result'> {
 }
 
 // ============================== Styles ==============================
-const genBaseStyle: GenerateStyle<ResultToken> = (token): CSSObject => {
+const genBaseStyle: GenerateStyle<ResultToken, CSSObject> = (token) => {
   const {
     componentCls,
     lineHeightHeading3,

components/segmented/style/index.ts

@@ -63,12 +63,12 @@ function getItemDisabledStyle(cls: string, token: SegmentedToken): CSSObject {
   };
 }
 
-function getItemSelectedStyle(token: SegmentedToken): CSSObject {
+const getItemSelectedStyle: GenerateStyle<SegmentedToken, CSSObject> = (token) => {
   return {
     background: token.itemSelectedBg,
     boxShadow: token.boxShadowTertiary,
   };
-}
+};
 
 const segmentedTextEllipsisCss: CSSObject = {
   overflow: 'hidden',
@@ -77,7 +77,7 @@ const segmentedTextEllipsisCss: CSSObject = {
 };
 
 // ============================== Styles ==============================
-const genSegmentedStyle: GenerateStyle<SegmentedToken> = (token: SegmentedToken) => {
+const genSegmentedStyle: GenerateStyle<SegmentedToken, CSSObject> = (token) => {
   const { componentCls, motionDurationSlow, motionEaseInOut, motionDurationMid } = token;
 
   const labelHeight = token

components/select/style/index.ts

@@ -12,7 +12,7 @@ import { prepareComponentToken } from './token';
 export type { ComponentToken };
 
 // =============================== Base ===============================
-const genBaseStyle: GenerateStyle<SelectToken> = (token) => {
+const genBaseStyle: GenerateStyle<SelectToken, CSSObject> = (token) => {
   const { antCls, componentCls, motionDurationMid, inputPaddingHorizontalBase } = token;
 
   const hoverShowClearStyle: CSSObject = {

components/select/style/select-input-customize.ts

@@ -1,7 +1,9 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { GenerateStyle } from '../../theme/interface';
 import type { SelectToken } from './token';
 
-const genSelectInputCustomizeStyle: GenerateStyle<SelectToken> = (token) => {
+const genSelectInputCustomizeStyle: GenerateStyle<SelectToken, CSSObject> = (token) => {
   const { componentCls } = token;
 
   return {

components/select/style/select-input.ts

@@ -89,7 +89,7 @@ const genSelectInputVariantStyle = (
   };
 };
 
-const genSelectInputStyle: GenerateStyle<SelectToken> = (token) => {
+const genSelectInputStyle: GenerateStyle<SelectToken, CSSObject> = (token) => {
   const { componentCls, fontHeight, controlHeight, iconCls, antCls, calc } = token;
   const [varName, varRef] = genCssVar(antCls, 'select');
   return {

components/skeleton/style/index.ts

@@ -74,7 +74,7 @@ const genSkeletonElementSize = (size: number | string): CSSObject => ({
   ...genSkeletonElementCommonSize(size),
 });
 
-const genSkeletonColor = (token: SkeletonToken): CSSObject => ({
+const genSkeletonColor: GenerateStyle<SkeletonToken, CSSObject> = (token) => ({
   background: token.skeletonLoadingBackground,
   backgroundSize: '400% 100%',
   animationName: skeletonClsLoading,
@@ -82,13 +82,14 @@ const genSkeletonColor = (token: SkeletonToken): CSSObject => ({
   animationTimingFunction: 'ease',
   animationIterationCount: 'infinite',
 });
+
 const genSkeletonElementInputSize = (size: number, calc: CSSUtil['calc']): CSSObject => ({
   width: calc(size).mul(5).equal(),
   minWidth: calc(size).mul(5).equal(),
   ...genSkeletonElementCommonSize(size),
 });
 
-const genSkeletonElementAvatar = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementAvatar: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const { skeletonAvatarCls, gradientFromColor, controlHeight, controlHeightLG, controlHeightSM } =
     token;
   return {
@@ -110,7 +111,7 @@ const genSkeletonElementAvatar = (token: SkeletonToken): CSSObject => {
   };
 };
 
-const genSkeletonElementInput = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementInput: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const {
     controlHeight,
     borderRadiusSM,
@@ -139,7 +140,7 @@ const genSkeletonElementInput = (token: SkeletonToken): CSSObject => {
   };
 };
 
-const genSkeletonElementShape = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementShape: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const { gradientFromColor, borderRadiusSM, imageSizeBase, calc } = token;
   return {
     display: 'inline-flex',
@@ -152,7 +153,7 @@ const genSkeletonElementShape = (token: SkeletonToken): CSSObject => {
   };
 };
 
-const genSkeletonElementNode = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementNode: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   return {
     [token.skeletonNodeCls]: {
       ...genSkeletonElementShape(token),
@@ -160,7 +161,7 @@ const genSkeletonElementNode = (token: SkeletonToken): CSSObject => {
   };
 };
 
-const genSkeletonElementImage = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementImage: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const { skeletonImageCls, imageSizeBase, calc } = token;
 
   return {
@@ -209,7 +210,7 @@ const genSkeletonElementButtonSize = (size: number, calc: CSSUtil['calc']): CSSO
   ...genSkeletonElementCommonSize(size),
 });
 
-const genSkeletonElementButton = (token: SkeletonToken): CSSObject => {
+const genSkeletonElementButton: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const {
     borderRadiusSM,
     skeletonButtonCls,
@@ -244,7 +245,7 @@ const genSkeletonElementButton = (token: SkeletonToken): CSSObject => {
 };
 
 // =============================== Base ===============================
-const genBaseStyle: GenerateStyle<SkeletonToken> = (token: SkeletonToken) => {
+const genBaseStyle: GenerateStyle<SkeletonToken, CSSObject> = (token) => {
   const {
     componentCls,
     skeletonAvatarCls,

components/splitter/style/index.ts

@@ -41,7 +41,7 @@ const centerStyle: CSSObject = {
   transform: 'translate(-50%, -50%)',
 };
 
-const genSplitterStyle: GenerateStyle<SplitterToken> = (token: SplitterToken): CSSObject => {
+const genSplitterStyle: GenerateStyle<SplitterToken, CSSObject> = (token) => {
   const {
     componentCls,
     colorFill,

components/statistic/style/index.ts

@@ -19,7 +19,7 @@ export interface ComponentToken {
 
 interface StatisticToken extends FullToken<'Statistic'> {}
 
-const genStatisticStyle: GenerateStyle<StatisticToken> = (token: StatisticToken): CSSObject => {
+const genStatisticStyle: GenerateStyle<StatisticToken, CSSObject> = (token) => {
   const {
     componentCls,
     marginXXS,

components/style/index.tsx

@@ -1,7 +1,7 @@
 import { unit } from '@ant-design/cssinjs';
 import type { CSSObject } from '@ant-design/cssinjs';
 
-import type { AliasToken } from '../theme/internal';
+import type { AliasToken, GenerateStyle } from '../theme/internal';
 
 export const textEllipsis: CSSObject = {
   overflow: 'hidden',
@@ -60,7 +60,7 @@ export const clearFix = (): CSSObject => ({
   },
 });
 
-export const genLinkStyle = (token: AliasToken): CSSObject => ({
+export const genLinkStyle: GenerateStyle<AliasToken, CSSObject> = (token) => ({
   a: {
     color: token.colorLink,
     textDecoration: token.linkDecoration,
@@ -151,7 +151,7 @@ export const genIconStyle = (iconPrefixCls: string): CSSObject => ({
   },
 });
 
-export const operationUnit = (token: AliasToken): CSSObject => ({
+export const operationUnit: GenerateStyle<AliasToken, CSSObject> = (token) => ({
   // FIXME: This use link but is a operation unit. Seems should be a colorPrimary.
   // And Typography use this to generate link style which should not do this.
   color: token.colorLink,

components/style/motion/collapse.ts

@@ -1,6 +1,8 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { AliasToken, GenerateStyle, TokenWithCommonCls } from '../../theme/internal';
 
-const genCollapseMotion: GenerateStyle<TokenWithCommonCls<AliasToken>> = (token) => {
+const genCollapseMotion: GenerateStyle<TokenWithCommonCls<AliasToken>, CSSObject> = (token) => {
   const { componentCls, antCls, motionDurationMid, motionEaseInOut } = token;
   return {
     [componentCls]: {

components/switch/style/index.ts

@@ -331,7 +331,7 @@ const genSwitchInnerStyle: GenerateStyle<SwitchToken, CSSObject> = (token) => {
   };
 };
 
-const genSwitchStyle = (token: SwitchToken): CSSObject => {
+const genSwitchStyle: GenerateStyle<SwitchToken, CSSObject> = (token) => {
   const { componentCls, trackHeight, trackMinWidth } = token;
 
   return {

components/tabs/style/index.ts

@@ -149,7 +149,7 @@ export interface TabsToken extends FullToken<'Tabs'> {
   tabsHorizontalItemMarginRTL: string;
 }
 
-const genCardStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject => {
+const genCardStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const {
     componentCls,
     tabsCardPadding,
@@ -272,7 +272,7 @@ const genCardStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject =>
   };
 };
 
-const genDropdownStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject => {
+const genDropdownStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const { componentCls, itemHoverColor, dropdownEdgeChildVerticalPadding } = token;
   return {
     [`${componentCls}-dropdown`]: {
@@ -361,7 +361,7 @@ const genDropdownStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject
   };
 };
 
-const genPositionStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject => {
+const genPositionStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const {
     componentCls,
     margin,
@@ -600,7 +600,7 @@ const genPositionStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject
   };
 };
 
-const genSizeStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject => {
+const genSizeStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const {
     componentCls,
     cardPaddingSM,
@@ -690,7 +690,7 @@ const genSizeStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject =>
   };
 };
 
-const genTabStyle: GenerateStyle<TabsToken, CSSObject> = (token: TabsToken) => {
+const genTabStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const {
     componentCls,
     itemActiveColor,
@@ -800,7 +800,7 @@ const genTabStyle: GenerateStyle<TabsToken, CSSObject> = (token: TabsToken) => {
   };
 };
 
-const genRtlStyle: GenerateStyle<TabsToken, CSSObject> = (token: TabsToken) => {
+const genRtlStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const { componentCls, tabsHorizontalItemMarginRTL, iconCls, cardGutter, calc } = token;
   const rtlCls = `${componentCls}-rtl`;
   return {
@@ -898,7 +898,7 @@ const genRtlStyle: GenerateStyle<TabsToken, CSSObject> = (token: TabsToken) => {
   };
 };
 
-const genTabsStyle: GenerateStyle<TabsToken> = (token: TabsToken): CSSObject => {
+const genTabsStyle: GenerateStyle<TabsToken, CSSObject> = (token) => {
   const {
     componentCls,
     tabsCardPadding,

components/tag/style/index.ts

@@ -6,7 +6,7 @@ import { FastColor } from '@ant-design/fast-color';
 import { AggregationColor } from '../../color-picker/color';
 import { isBright } from '../../color-picker/components/ColorPresets';
 import { resetComponent } from '../../style';
-import type { FullToken, GenStyleFn, GetDefaultToken } from '../../theme/internal';
+import type { FullToken, GenerateStyle, GenStyleFn, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 
 export interface ComponentToken {
@@ -38,7 +38,7 @@ export interface TagToken extends FullToken<'Tag'> {
 
 // ============================== Styles ==============================
 
-const genBaseStyle = (token: TagToken): CSSInterpolation => {
+const genBaseStyle: GenerateStyle<TagToken, CSSInterpolation> = (token) => {
   const { paddingXXS, lineWidth, tagPaddingHorizontal, componentCls, calc } = token;
   const paddingInline = calc(tagPaddingHorizontal).sub(lineWidth).equal();
   const iconMarginInline = calc(paddingXXS).sub(lineWidth).equal();
@@ -206,7 +206,7 @@ const genBaseStyle = (token: TagToken): CSSInterpolation => {
 };
 
 // ============================== Export ==============================
-export const prepareToken: (token: Parameters<GenStyleFn<'Tag'>>[0]) => TagToken = (token) => {
+export const prepareToken = (token: Parameters<GenStyleFn<'Tag'>>[0]) => {
   const { lineWidth, fontSizeIcon, calc } = token;
   const tagFontSize = token.fontSizeSM;
   const tagToken = mergeToken<TagToken>(token, {

components/transfer/style/index.ts

@@ -42,9 +42,7 @@ interface TransferToken extends FullToken<'Transfer'> {
   transferHeaderVerticalPadding: number;
 }
 
-const genTransferCustomizeStyle: GenerateStyle<TransferToken> = (
-  token: TransferToken,
-): CSSObject => {
+const genTransferCustomizeStyle: GenerateStyle<TransferToken, CSSObject> = (token) => {
   const { antCls, componentCls, listHeight, controlHeightLG } = token;
 
   const tableCls = `${antCls}-table`;
@@ -98,7 +96,7 @@ const genTransferStatusColor = (token: TransferToken, color: string): CSSObject
   };
 };
 
-const genTransferStatusStyle: GenerateStyle<TransferToken> = (token: TransferToken): CSSObject => {
+const genTransferStatusStyle: GenerateStyle<TransferToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     [`${componentCls}-status-error`]: {
@@ -110,7 +108,7 @@ const genTransferStatusStyle: GenerateStyle<TransferToken> = (token: TransferTok
   };
 };
 
-const genTransferListStyle: GenerateStyle<TransferToken> = (token: TransferToken): CSSObject => {
+const genTransferListStyle: GenerateStyle<TransferToken, CSSObject> = (token) => {
   const {
     componentCls,
     colorBorder,
@@ -314,7 +312,7 @@ const genTransferListStyle: GenerateStyle<TransferToken> = (token: TransferToken
   };
 };
 
-const genTransferStyle: GenerateStyle<TransferToken> = (token: TransferToken): CSSObject => {
+const genTransferStyle: GenerateStyle<TransferToken, CSSObject> = (token) => {
   const {
     antCls,
     iconCls,
@@ -358,7 +356,7 @@ const genTransferStyle: GenerateStyle<TransferToken> = (token: TransferToken): C
   };
 };
 
-const genTransferRTLStyle: GenerateStyle<TransferToken> = (token: TransferToken): CSSObject => {
+const genTransferRTLStyle: GenerateStyle<TransferToken, CSSObject> = (token) => {
   const { componentCls } = token;
   return {
     [`${componentCls}-rtl`]: {

components/typography/style/mixins.ts

@@ -34,7 +34,7 @@ const getTitleStyle = (
 export const getTitleStyles: GenerateStyle<TypographyToken, CSSObject> = (token) => {
   const headings = [1, 2, 3, 4, 5] as const;
 
-  const styles = {} as CSSObject;
+  const styles: CSSObject = {};
   headings.forEach((headingLevel) => {
     styles[
       `
@@ -78,7 +78,7 @@ export const getLinkStyles: GenerateStyle<TypographyToken, CSSObject> = (token)
   };
 };
 
-export const getResetStyles: GenerateStyle<TypographyToken, CSSObject> = (token): CSSObject => ({
+export const getResetStyles: GenerateStyle<TypographyToken, CSSObject> = (token) => ({
   code: {
     margin: '0 0.2em',
     paddingInline: '0.4em',

components/upload/style/dragger.ts

@@ -1,9 +1,10 @@
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import type { UploadToken } from '.';
 import type { GenerateStyle } from '../../theme/internal';
 
-const genDraggerStyle: GenerateStyle<UploadToken> = (token) => {
+const genDraggerStyle: GenerateStyle<UploadToken, CSSObject> = (token) => {
   const { componentCls, iconCls } = token;
 
   return {

components/upload/style/index.ts

@@ -1,3 +1,5 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import { resetComponent } from '../../style';
 import { genCollapseMotion } from '../../style/motion';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
@@ -27,7 +29,7 @@ export interface UploadToken extends FullToken<'Upload'> {
   uploadPicCardSize: number | string;
 }
 
-const genBaseStyle: GenerateStyle<UploadToken> = (token) => {
+const genBaseStyle: GenerateStyle<UploadToken, CSSObject> = (token) => {
   const { componentCls, colorTextDisabled } = token;
 
   return {

components/upload/style/picture.ts

@@ -1,11 +1,12 @@
 import { blue } from '@ant-design/colors';
+import type { CSSObject } from '@ant-design/cssinjs';
 import { unit } from '@ant-design/cssinjs';
 
 import type { UploadToken } from '.';
 import { clearFix, textEllipsis } from '../../style';
 import type { GenerateStyle } from '../../theme/internal';
 
-const genPictureStyle: GenerateStyle<UploadToken> = (token) => {
+const genPictureStyle: GenerateStyle<UploadToken, CSSObject> = (token) => {
   const { componentCls, iconCls, uploadThumbnailSize, uploadProgressOffset, calc } = token;
   const listCls = `${componentCls}-list`;
   const itemCls = `${listCls}-item`;
@@ -97,7 +98,7 @@ const genPictureStyle: GenerateStyle<UploadToken> = (token) => {
   };
 };
 
-const genPictureCardStyle: GenerateStyle<UploadToken> = (token) => {
+const genPictureCardStyle: GenerateStyle<UploadToken, CSSObject> = (token) => {
   const { componentCls, iconCls, fontSizeLG, colorTextLightSolid, calc } = token;
 
   const listCls = `${componentCls}-list`;

components/upload/style/rtl.ts

@@ -1,10 +1,11 @@
+import type { CSSObject } from '@ant-design/cssinjs';
+
 import type { UploadToken } from '.';
 import type { GenerateStyle } from '../../theme/internal';
 
 // =========================== Motion ===========================
-const genRtlStyle: GenerateStyle<UploadToken> = (token) => {
+const genRtlStyle: GenerateStyle<UploadToken, CSSObject> = (token) => {
   const { componentCls } = token;
-
   return {
     [`${componentCls}-rtl`]: {
       direction: 'rtl',

package.json

@@ -136,7 +136,7 @@
     "@rc-component/rate": "~1.0.1",
     "@rc-component/resize-observer": "^1.1.1",
     "@rc-component/segmented": "~1.3.0",
-    "@rc-component/select": "~1.6.9",
+    "@rc-component/select": "~1.6.10",
     "@rc-component/slider": "~1.0.1",
     "@rc-component/steps": "~1.2.2",
     "@rc-component/switch": "~1.0.3",
@@ -173,7 +173,7 @@
     "@emotion/css": "^11.13.5",
     "@emotion/react": "^11.14.0",
     "@emotion/server": "^11.11.0",
-    "@eslint-react/eslint-plugin": "2.12.4",
+    "@eslint-react/eslint-plugin": "2.13.0",
     "@ianvs/prettier-plugin-sort-imports": "^4.7.0",
     "@inquirer/prompts": "^8.0.2",
     "@madccc/duplicate-package-checker-webpack-plugin": "^1.0.0",