feat: Button add tokens (#47075)

* feat: default button add tokens * fix: var name
ant-design · Jan 26, 2024 · 3c477ee · 3c477ee
1 parent bb6b475
commit 3c477ee
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 4 deletions.
diff --git a/components/button/style/index.ts b/components/button/style/index.ts
@@ -179,12 +179,14 @@ const genDefaultButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) =>
   ...genHoverActiveButtonStyle(
     token.componentCls,
     {
-      color: token.colorPrimaryHover,
-      borderColor: token.colorPrimaryHover,
+      color: token.defaultHoverColor,
+      borderColor: token.defaultHoverBorderColor,
+      background: token.defaultHoverBg,
     },
     {
-      color: token.colorPrimaryActive,
-      borderColor: token.colorPrimaryActive,
+      color: token.defaultActiveColor,
+      borderColor: token.defaultActiveBorderColor,
+      background: token.defaultActiveBg,
     },
   ),
 

diff --git a/components/button/style/token.ts b/components/button/style/token.ts
@@ -50,6 +50,36 @@ export interface ComponentToken {
    * @descEN Text color of danger button
    */
   dangerColor: string;
+  /**
+   * @desc 默认按钮悬浮态背景色
+   * @descEN Background color of default button when hover
+   */
+  defaultHoverBg: string;
+  /**
+   * @desc 默认按钮悬浮态文本颜色
+   * @descEN Text color of default button when hover
+   */
+  defaultHoverColor: string;
+  /**
+   * @desc 默认按钮悬浮态边框颜色
+   * @descEN Border color of default button
+   */
+  defaultHoverBorderColor: string;
+  /**
+   * @desc 默认按钮激活态背景色
+   * @descEN Background color of default button when active
+   */
+  defaultActiveBg: string;
+  /**
+   * @desc 默认按钮激活态文字颜色
+   * @descEN Text color of default button when active
+   */
+  defaultActiveColor: string;
+  /**
+   * @desc 默认按钮激活态边框颜色
+   * @descEN Border color of default button when active
+   */
+  defaultActiveBorderColor: string;
   /**
    * @desc 禁用状态边框颜色
    * @descEN Border color of disabled button
@@ -214,6 +244,12 @@ export const prepareComponentToken: GetDefaultToken<'Button'> = (token) => {
     defaultBg: token.colorBgContainer,
     defaultBorderColor: token.colorBorder,
     defaultBorderColorDisabled: token.colorBorder,
+    defaultHoverBg: token.colorBgContainer,
+    defaultHoverColor: token.colorPrimaryHover,
+    defaultHoverBorderColor: token.colorPrimaryHover,
+    defaultActiveBg: token.colorBgContainer,
+    defaultActiveColor: token.colorPrimaryActive,
+    defaultActiveBorderColor: token.colorPrimaryActive,
     contentFontSize,
     contentFontSizeSM,
     contentFontSizeLG,