Merge branch 'master' into feature-merge-master

.github/workflows/verify-files-modify.yml

@@ -18,6 +18,7 @@ jobs:
           comment: |
             Hi @${{ github.event.pull_request.user.login }}. Thanks for your contribution. The path `.github/` or `scripts/` and `CHANGELOG` `package.json` is only maintained by team members. This current PR will be closed and team members will help on this.
           close: true
+          set-failed: false
 
       - name: verify-less
         uses: actions-cool/verify-files-modify@v1

CHANGELOG.en-US.md

@@ -15,18 +15,38 @@ timeline: true
 
 ---
 
+## 4.18.7
+
+`2022-02-14`
+
+- Typography
+  - 🛠 Fix Typography `useLayoutEffect` warning in SSR. [#33818](https://github.com/ant-design/ant-design/pull/33818) [@SoYoung210](https://github.com/SoYoung210)
+  - 🐞 Fix Typography with `ellipsis` makes screen show the scroll bar in some case. [#34007](https://github.com/ant-design/ant-design/pull/34007)
+  - 🐞 Typography copy click event is now `stopPropagation` by default. [#33998](https://github.com/ant-design/ant-design/pull/33998) [@linxianxi](https://github.com/linxianxi)
+  - 🐞 Fix Typography edit & copy button not trigger by enter key. [#33976](https://github.com/ant-design/ant-design/pull/33976) [@mrwd2009](https://github.com/mrwd2009)
+- 🐞 Fix Form `undefined` text of min/max validators in pl_PL locale. [#34024](https://github.com/ant-design/ant-design/pull/34024) [@MichalPodeszwa](https://github.com/MichalPodeszwa)
+- 🐞 Fix Input.TextArea cut text logic when `maxLength` configured. [#33910](https://github.com/ant-design/ant-design/pull/33910) [@chenyizhongx](https://github.com/chenyizhongx)
+- 💄 Button with `type=default` will provide `.ant-btn-default` className. [#34013](https://github.com/ant-design/ant-design/pull/34013)
+- 💄 Improve Menu `:focus-visible` style. [#34008](https://github.com/ant-design/ant-design/pull/34008)
+- 💄 Fix Pagination and Rate style problem in Safari. [#34002](https://github.com/ant-design/ant-design/pull/34002)
+- 💄 Fix Row and Col component styles when using prefixCls. [#33969](https://github.com/ant-design/ant-design/pull/33969) [@mic-web](https://github.com/mic-web)
+- 🐞 Fix Timeline icons with custom color not working. [#33951](https://github.com/ant-design/ant-design/pull/33951) [@MadCcc](https://github.com/MadCcc)
+- TypeScript
+  - 🤖 Optimize Cascader `onChange` definition with `multiple` prop. [#33947](https://github.com/ant-design/ant-design/pull/33947) [@babycannotsay](https://github.com/babycannotsay)
+
 ## 4.18.6
 
 `2022-02-07`
 
-- 🐞 Hide the empty popover when the props' content is undefined or null. [#33835](https://github.com/ant-design/ant-design/pull/33835) [@DawnLck](https://github.com/DawnLck)
-- 🐞 Fix DatePicker `ref` TypeScript definition. [#33901](https://github.com/ant-design/ant-design/pull/33901) [@Amour1688](https://github.com/Amour1688)
-- 🐞 Fix the problem that tooltip didn't show on ellipsis with rows larger than 1. [#33875](https://github.com/ant-design/ant-design/pull/33875) [@MadCcc](https://github.com/MadCcc)
+- 🐞 Fix the empty Popover displayed when `content` and `title` is undefined or null. [#33835](https://github.com/ant-design/ant-design/pull/33835) [@DawnLck](https://github.com/DawnLck)
+- 🐞 Fix the problem that Tooltip didn't show on `ellipsis` with rows larger than 1. [#33875](https://github.com/ant-design/ant-design/pull/33875)
 - Button
-  - 🐞 Fix the issue that block not work when small size. [#33878](https://github.com/ant-design/ant-design/pull/33878) [@tangjinzhou](https://github.com/tangjinzhou)
-  - 🐞 Clear timer of delayed loading after Button is unmounted. [#33858](https://github.com/ant-design/ant-design/pull/33858) [@mrwd2009](https://github.com/mrwd2009)
-- 🐞 Fix the problem that Tooltip cannot be displayed when it is used with switch in loading state. [#33860](https://github.com/ant-design/ant-design/pull/33860) [@MadCcc](https://github.com/MadCcc)
-- 🐞 fix the upload button sometimes flashes after the upload button is changed from hidden to display when the upload component is a picture-card type. [#33820](https://github.com/ant-design/ant-design/pull/33820) [@credred](https://github.com/credred)
+  - 🐞 Fix the issue that `block` of Button not work when small size. [#33878](https://github.com/ant-design/ant-design/pull/33878) [@tangjinzhou](https://github.com/tangjinzhou)
+  - 🐞 Fix the issue that `loading.delay` of Button cause React memory leak warning [#33858](https://github.com/ant-design/ant-design/pull/33858) [@mrwd2009](https://github.com/mrwd2009)
+- 🐞 Fix the problem that Tooltip cannot be displayed when it is used with Switch in `loading` state. [#33860](https://github.com/ant-design/ant-design/pull/33860)
+- 🐞 Fix the Upload button sometimes flashes after changed from hidden to display when the Upload component is a `picture-card` type. [#33820](https://github.com/ant-design/ant-design/pull/33820) [@credred](https://github.com/credred)
+- TypeScript
+  - 🤖 Fix DatePicker `ref` TypeScript definition. [#33901](https://github.com/ant-design/ant-design/pull/33901) [@Amour1688](https://github.com/Amour1688)
 
 ## 4.18.5
 

CHANGELOG.zh-CN.md

@@ -15,18 +15,38 @@ timeline: true
 
 ---
 
+## 4.18.7
+
+`2022-02-14`
+
+- Typography
+  - 🛠 修复 Typography 在 SSR 渲染时警告 `useLayoutEffect` 的问题。[#33818](https://github.com/ant-design/ant-design/pull/33818) [@SoYoung210](https://github.com/SoYoung210)
+  - 🐞 修复 Typography 配置 `ellipsis` 后在某些情况下会出现滚动条的问题。[#34007](https://github.com/ant-design/ant-design/pull/34007)
+  - 🐞 Typography 复制按钮点击事件不在冒泡。[#33998](https://github.com/ant-design/ant-design/pull/33998) [@linxianxi](https://github.com/linxianxi)
+  - 🐞 修复 Typography 中编辑和拷贝按钮无法响应 Enter 按键的问题。[#33976](https://github.com/ant-design/ant-design/pull/33976) [@mrwd2009](https://github.com/mrwd2009)
+- 🐞 修复 Form 波兰语中表单校验部分文案未定义的问题。[#34024](https://github.com/ant-design/ant-design/pull/34024) [@MichalPodeszwa](https://github.com/MichalPodeszwa)
+- 🐞 修复 Input.TextArea 设置 `maxLength` 时光标位置会影响超出部分截取的问题。[#33910](https://github.com/ant-design/ant-design/pull/33910) [@chenyizhongx](https://github.com/chenyizhongx)
+- 💄 Button 对于 `type=default` 也会提供 `.ant-btn-default` 的样式类名。[#34013](https://github.com/ant-design/ant-design/pull/34013)
+- 💄 优化 Menu `:focus-visible` 的样式。[#34008](https://github.com/ant-design/ant-design/pull/34008)
+- 💄 修复 Pagination 和 Rate 在 Safari 下部分样式丢失的问题，比如分页按钮禁用样式失效。[#34002](https://github.com/ant-design/ant-design/pull/34002)
+- 💄 修复 Row 与 Col 在配置 `prefixCls` 的样式问题。[#33969](https://github.com/ant-design/ant-design/pull/33969) [@mic-web](https://github.com/mic-web)
+- 🐞 修复 Timeline 的自定义图标颜色无效的问题。[#33951](https://github.com/ant-design/ant-design/pull/33951) [@MadCcc](https://github.com/MadCcc)
+- TypeScript
+  - 🤖 优化 Cascader `multiple` 属性对应的 `onChange` 类型推断。[#33947](https://github.com/ant-design/ant-design/pull/33947) [@babycannotsay](https://github.com/babycannotsay)
+
 ## 4.18.6
 
 `2022-02-07`
 
-- 🐞 修复当传入的内容参数和标题参数都为空时，气泡组件仍旧会渲染空气泡的问题。[#33835](https://github.com/ant-design/ant-design/pull/33835) [@DawnLck](https://github.com/DawnLck)
-- 🐞 修复 DatePicker `ref` TypeScript 定义。[#33901](https://github.com/ant-design/ant-design/pull/33901) [@Amour1688](https://github.com/Amour1688)
-- 🐞 修复 Typography ellipsis 行数大于 1 时 Tooltip 不显示的问题。[#33875](https://github.com/ant-design/ant-design/pull/33875) [@MadCcc](https://github.com/MadCcc)
+- 🐞 修复当传入的内容参数和标题参数都为空时，Popover 仍旧会渲染空气泡的问题。[#33835](https://github.com/ant-design/ant-design/pull/33835) [@DawnLck](https://github.com/DawnLck)
+- 🐞 修复 Typography `ellipsis` 行数大于 1 时 Tooltip 不显示的问题。[#33875](https://github.com/ant-design/ant-design/pull/33875)
 - Button
-  - 🐞 修复小尺寸下 Button 组件 block 属性无效的问题[#33878](https://github.com/ant-design/ant-design/pull/33878) [@tangjinzhou](https://github.com/tangjinzhou)
-  - 🐞 Button 组件卸载后，清理延迟加载定时器。[#33858](https://github.com/ant-design/ant-design/pull/33858) [@mrwd2009](https://github.com/mrwd2009)
-- 🐞 修复 Tooltip 套在 loading 状态的 switch 上时无法正常显示的问题。[#33860](https://github.com/ant-design/ant-design/pull/33860) [@MadCcc](https://github.com/MadCcc)
-- 🐞 修复 Upload 组件为 picture-card 类型时，由隐藏上传按钮改为显示后，上传按钮有时会闪烁的问题。[#33820](https://github.com/ant-design/ant-design/pull/33820) [@credred](https://github.com/credred)
+  - 🐞 修复小尺寸下 Button 组件 `block` 属性无效的问题[#33878](https://github.com/ant-design/ant-design/pull/33878) [@tangjinzhou](https://github.com/tangjinzhou)
+  - 🐞 修复 Button 组件 `loading.delay` 定时器未清除导致的内存泄漏警告[#33858](https://github.com/ant-design/ant-design/pull/33858) [@mrwd2009](https://github.com/mrwd2009)
+- 🐞 修复 Tooltip 套在 `loading` 状态的 Switch 上时无法正常显示的问题。[#33860](https://github.com/ant-design/ant-design/pull/33860)
+- 🐞 修复 Upload 组件为 `picture-card` 类型时，由隐藏上传按钮改为显示后，上传按钮有时会闪烁的问题。[#33820](https://github.com/ant-design/ant-design/pull/33820) [@credred](https://github.com/credred)
+- Typescript
+  - 🤖 修复 DatePicker `ref` TypeScript 定义。[#33901](https://github.com/ant-design/ant-design/pull/33901) [@Amour1688](https://github.com/Amour1688)
 
 ## 4.18.5
 

components/affix/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -71,7 +71,7 @@ exports[`renders ./components/affix/demo/on-change.md extend context correctly 1
     class=""
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/affix/__tests__/__snapshots__/demo.test.ts.snap

@@ -71,7 +71,7 @@ exports[`renders ./components/affix/demo/on-change.md correctly 1`] = `
     class=""
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/alert/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -118,7 +118,7 @@ Array [
       class="ant-alert-action"
     >
       <button
-        class="ant-btn ant-btn-sm ant-btn-dangerous"
+        class="ant-btn ant-btn-default ant-btn-sm ant-btn-dangerous"
         type="button"
       >
         <span>
@@ -954,7 +954,7 @@ Array [
 
 exports[`renders ./components/alert/demo/error-boundary.md extend context correctly 1`] = `
 <button
-  class="ant-btn ant-btn-dangerous"
+  class="ant-btn ant-btn-default ant-btn-dangerous"
   type="button"
 >
   <span>

components/alert/__tests__/__snapshots__/demo.test.ts.snap

@@ -118,7 +118,7 @@ Array [
       class="ant-alert-action"
     >
       <button
-        class="ant-btn ant-btn-sm ant-btn-dangerous"
+        class="ant-btn ant-btn-default ant-btn-sm ant-btn-dangerous"
         type="button"
       >
         <span>
@@ -954,7 +954,7 @@ Array [
 
 exports[`renders ./components/alert/demo/error-boundary.md correctly 1`] = `
 <button
-  class="ant-btn ant-btn-dangerous"
+  class="ant-btn ant-btn-default ant-btn-dangerous"
   type="button"
 >
   <span>

components/auto-complete/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -129,7 +129,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md extend cont
             class="ant-input-group-addon"
           >
             <button
-              class="ant-btn ant-btn-lg ant-btn-icon-only ant-input-search-button"
+              class="ant-btn ant-btn-default ant-btn-lg ant-btn-icon-only ant-input-search-button"
               type="button"
             >
               <span
@@ -1395,7 +1395,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
                         class="ant-input-group-addon"
                       >
                         <button
-                          class="ant-btn ant-btn-icon-only ant-input-search-button"
+                          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
                           type="button"
                         >
                           <span
@@ -1618,7 +1618,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
                         class="ant-input-group-addon"
                       >
                         <button
-                          class="ant-btn ant-btn-icon-only ant-input-search-button"
+                          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
                           type="button"
                         >
                           <span

components/auto-complete/__tests__/__snapshots__/demo.test.js.snap

@@ -101,7 +101,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
             class="ant-input-group-addon"
           >
             <button
-              class="ant-btn ant-btn-lg ant-btn-icon-only ant-input-search-button"
+              class="ant-btn ant-btn-default ant-btn-lg ant-btn-icon-only ant-input-search-button"
               type="button"
             >
               <span
@@ -751,7 +751,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
                         class="ant-input-group-addon"
                       >
                         <button
-                          class="ant-btn ant-btn-icon-only ant-input-search-button"
+                          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
                           type="button"
                         >
                           <span
@@ -900,7 +900,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
                         class="ant-input-group-addon"
                       >
                         <button
-                          class="ant-btn ant-btn-icon-only ant-input-search-button"
+                          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
                           type="button"
                         >
                           <span

components/avatar/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -294,7 +294,7 @@ Array [
     </span>
   </span>,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     style="margin:0 16px;vertical-align:middle"
     type="button"
   >
@@ -303,7 +303,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     style="vertical-align:middle"
     type="button"
   >
@@ -869,7 +869,7 @@ exports[`renders ./components/avatar/demo/responsive.md extend context correctly
 exports[`renders ./components/avatar/demo/toggle-debug.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -877,7 +877,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -885,7 +885,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/avatar/__tests__/__snapshots__/demo.test.js.snap

@@ -294,7 +294,7 @@ Array [
     </span>
   </span>,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     style="margin:0 16px;vertical-align:middle"
     type="button"
   >
@@ -303,7 +303,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     style="vertical-align:middle"
     type="button"
   >
@@ -548,7 +548,7 @@ exports[`renders ./components/avatar/demo/responsive.md correctly 1`] = `
 exports[`renders ./components/avatar/demo/toggle-debug.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -556,7 +556,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -564,7 +564,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/badge/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -121,7 +121,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span
@@ -145,7 +145,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span
@@ -173,7 +173,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span

components/badge/__tests__/__snapshots__/demo.test.js.snap

@@ -121,7 +121,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span
@@ -145,7 +145,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span
@@ -173,7 +173,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span

components/button/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -11,7 +11,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -57,7 +57,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-block"
+    class="ant-btn ant-btn-default ant-btn-block"
     type="button"
   >
     <span>
@@ -94,7 +94,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     type="button"
   >
     <span>
@@ -149,7 +149,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -157,7 +157,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     disabled=""
     type="button"
   >
@@ -221,7 +221,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     type="button"
   >
     <span>
@@ -229,7 +229,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     disabled=""
     type="button"
   >
@@ -277,7 +277,7 @@ Array [
     class="site-button-ghost-wrapper"
   >
     <button
-      class="ant-btn ant-btn-background-ghost"
+      class="ant-btn ant-btn-default ant-btn-background-ghost"
       type="button"
     >
       <span>
@@ -285,7 +285,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-background-ghost"
+      class="ant-btn ant-btn-default ant-btn-background-ghost"
       disabled=""
       type="button"
     >
@@ -310,7 +310,7 @@ exports[`renders ./components/button/demo/ghost.md extend context correctly 1`]
     </span>
   </button>
   <button
-    class="ant-btn ant-btn-background-ghost"
+    class="ant-btn ant-btn-default ant-btn-background-ghost"
     type="button"
   >
     <span>
@@ -339,7 +339,7 @@ exports[`renders ./components/button/demo/ghost.md extend context correctly 1`]
 exports[`renders ./components/button/demo/icon.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-icon-only"
     type="button"
   >
     <span
@@ -387,7 +387,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle"
+    class="ant-btn ant-btn-circle ant-btn-primary"
     type="button"
   >
     <span>
@@ -422,7 +422,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-icon-only"
     type="button"
   >
     <span
@@ -470,7 +470,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span
@@ -498,7 +498,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-icon-only"
     type="button"
   >
     <span
@@ -546,7 +546,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span
@@ -573,7 +573,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dashed ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-dashed ant-btn-icon-only"
     type="button"
   >
     <span
@@ -648,7 +648,7 @@ Array [
     </span>
   </button>,
   <a
-    class="ant-btn ant-btn-icon-only"
+    class="ant-btn ant-btn-default ant-btn-icon-only"
     href="https://www.google.com"
   >
     <span
@@ -674,7 +674,7 @@ Array [
   <br />,
   <br />,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -722,7 +722,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg"
     type="button"
   >
     <span>
@@ -757,7 +757,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -805,7 +805,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span
@@ -833,7 +833,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -881,7 +881,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span
@@ -908,7 +908,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dashed ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-dashed ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -983,7 +983,7 @@ Array [
     </span>
   </button>,
   <a
-    class="ant-btn ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-default ant-btn-lg ant-btn-icon-only"
     href="https://www.google.com"
   >
     <span
@@ -1594,7 +1594,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1605,7 +1605,7 @@ Array [
     class="ant-btn-group ant-dropdown-button"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1613,7 +1613,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+      class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
       type="button"
     >
       <span
@@ -1899,7 +1899,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span>
@@ -1949,7 +1949,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -1973,7 +1973,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-round ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-round ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -1997,7 +1997,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-round ant-btn-lg"
+    class="ant-btn ant-btn-round ant-btn-primary ant-btn-lg"
     type="button"
   >
     <span

components/button/__tests__/__snapshots__/demo.test.ts.snap

@@ -11,7 +11,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -57,7 +57,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-block"
+    class="ant-btn ant-btn-default ant-btn-block"
     type="button"
   >
     <span>
@@ -94,7 +94,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     type="button"
   >
     <span>
@@ -149,7 +149,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -157,7 +157,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     disabled=""
     type="button"
   >
@@ -221,7 +221,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     type="button"
   >
     <span>
@@ -229,7 +229,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dangerous"
+    class="ant-btn ant-btn-default ant-btn-dangerous"
     disabled=""
     type="button"
   >
@@ -277,7 +277,7 @@ Array [
     class="site-button-ghost-wrapper"
   >
     <button
-      class="ant-btn ant-btn-background-ghost"
+      class="ant-btn ant-btn-default ant-btn-background-ghost"
       type="button"
     >
       <span>
@@ -285,7 +285,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-background-ghost"
+      class="ant-btn ant-btn-default ant-btn-background-ghost"
       disabled=""
       type="button"
     >
@@ -310,7 +310,7 @@ exports[`renders ./components/button/demo/ghost.md correctly 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn ant-btn-background-ghost"
+    class="ant-btn ant-btn-default ant-btn-background-ghost"
     type="button"
   >
     <span>
@@ -339,7 +339,7 @@ exports[`renders ./components/button/demo/ghost.md correctly 1`] = `
 exports[`renders ./components/button/demo/icon.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-icon-only"
     type="button"
   >
     <span
@@ -363,7 +363,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle"
+    class="ant-btn ant-btn-circle ant-btn-primary"
     type="button"
   >
     <span>
@@ -398,7 +398,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-icon-only"
     type="button"
   >
     <span
@@ -422,7 +422,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span
@@ -450,7 +450,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-icon-only"
     type="button"
   >
     <span
@@ -474,7 +474,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span
@@ -501,7 +501,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dashed ant-btn-circle ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-dashed ant-btn-icon-only"
     type="button"
   >
     <span
@@ -552,7 +552,7 @@ Array [
     </span>
   </button>,
   <a
-    class="ant-btn ant-btn-icon-only"
+    class="ant-btn ant-btn-default ant-btn-icon-only"
     href="https://www.google.com"
   >
     <span
@@ -578,7 +578,7 @@ Array [
   <br />,
   <br />,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -602,7 +602,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg"
     type="button"
   >
     <span>
@@ -637,7 +637,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -661,7 +661,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span
@@ -689,7 +689,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-default ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -713,7 +713,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span
@@ -740,7 +740,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-dashed ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-dashed ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -791,7 +791,7 @@ Array [
     </span>
   </button>,
   <a
-    class="ant-btn ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-default ant-btn-lg ant-btn-icon-only"
     href="https://www.google.com"
   >
     <span
@@ -1258,7 +1258,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1269,7 +1269,7 @@ Array [
     class="ant-btn-group ant-dropdown-button"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1277,7 +1277,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+      class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
       type="button"
     >
       <span
@@ -1379,7 +1379,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-lg"
+    class="ant-btn ant-btn-default ant-btn-lg"
     type="button"
   >
     <span>
@@ -1429,7 +1429,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-circle ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-circle ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -1453,7 +1453,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-round ant-btn-lg ant-btn-icon-only"
+    class="ant-btn ant-btn-round ant-btn-primary ant-btn-lg ant-btn-icon-only"
     type="button"
   >
     <span
@@ -1477,7 +1477,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-btn-primary ant-btn-round ant-btn-lg"
+    class="ant-btn ant-btn-round ant-btn-primary ant-btn-lg"
     type="button"
   >
     <span

components/button/__tests__/__snapshots__/index.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`Button fixbug renders {0} , 0 and {false} 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   0
@@ -11,7 +11,7 @@ exports[`Button fixbug renders {0} , 0 and {false} 1`] = `
 
 exports[`Button fixbug renders {0} , 0 and {false} 2`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -22,14 +22,14 @@ exports[`Button fixbug renders {0} , 0 and {false} 2`] = `
 
 exports[`Button fixbug renders {0} , 0 and {false} 3`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 />
 `;
 
 exports[`Button renders Chinese characters correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -40,7 +40,7 @@ exports[`Button renders Chinese characters correctly 1`] = `
 
 exports[`Button renders Chinese characters correctly 2`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span
@@ -70,7 +70,7 @@ exports[`Button renders Chinese characters correctly 2`] = `
 
 exports[`Button renders Chinese characters correctly 3`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span
@@ -100,7 +100,7 @@ exports[`Button renders Chinese characters correctly 3`] = `
 
 exports[`Button renders Chinese characters correctly 4`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span
@@ -130,7 +130,7 @@ exports[`Button renders Chinese characters correctly 4`] = `
 
 exports[`Button renders Chinese characters correctly 5`] = `
 <button
-  class="ant-btn ant-btn-loading"
+  class="ant-btn ant-btn-default ant-btn-loading"
   type="button"
 >
   <span
@@ -164,7 +164,7 @@ exports[`Button renders Chinese characters correctly 5`] = `
 
 exports[`Button renders Chinese characters correctly 6`] = `
 <button
-  class="ant-btn ant-btn-loading"
+  class="ant-btn ant-btn-default ant-btn-loading"
   type="button"
 >
   <span
@@ -199,7 +199,7 @@ exports[`Button renders Chinese characters correctly 6`] = `
 
 exports[`Button renders Chinese characters correctly 7`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -210,7 +210,7 @@ exports[`Button renders Chinese characters correctly 7`] = `
 
 exports[`Button renders correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -221,21 +221,21 @@ exports[`Button renders correctly 1`] = `
 
 exports[`Button rtl render component should be rendered correctly in RTL direction 1`] = `
 <button
-  class="ant-btn ant-btn-rtl"
+  class="ant-btn ant-btn-default ant-btn-rtl"
   type="button"
 />
 `;
 
 exports[`Button rtl render component should be rendered correctly in RTL direction 2`] = `
 <button
-  class="ant-btn ant-btn-lg ant-btn-rtl"
+  class="ant-btn ant-btn-default ant-btn-lg ant-btn-rtl"
   type="button"
 />
 `;
 
 exports[`Button rtl render component should be rendered correctly in RTL direction 3`] = `
 <button
-  class="ant-btn ant-btn-sm ant-btn-rtl"
+  class="ant-btn ant-btn-default ant-btn-sm ant-btn-rtl"
   type="button"
 />
 `;
@@ -266,7 +266,7 @@ exports[`Button rtl render component should be rendered correctly in RTL directi
 
 exports[`Button should handle fragment as children 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -277,7 +277,7 @@ exports[`Button should handle fragment as children 1`] = `
 
 exports[`Button should merge text if children using variable 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -299,14 +299,14 @@ exports[`Button should not render as link button when href is undefined 1`] = `
 
 exports[`Button should render empty button without errors 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 />
 `;
 
 exports[`Button should support link button 1`] = `
 <a
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   href="https://ant.design"
   target="_blank"
 >

components/button/button.tsx

@@ -136,7 +136,7 @@ const InternalButton: React.ForwardRefRenderFunction<unknown, ButtonProps> = (pr
   const {
     loading = false,
     prefixCls: customizePrefixCls,
-    type,
+    type = 'default',
     danger,
     shape = 'default',
     size: customizeSize,
@@ -237,8 +237,8 @@ const InternalButton: React.ForwardRefRenderFunction<unknown, ButtonProps> = (pr
   const classes = classNames(
     prefixCls,
     {
+      [`${prefixCls}-${shape}`]: shape !== 'default' && shape, // Note: Shape also has `default`
       [`${prefixCls}-${type}`]: type,
-      [`${prefixCls}-${shape}`]: shape !== 'default' && shape,
       [`${prefixCls}-${sizeCls}`]: sizeCls,
       [`${prefixCls}-icon-only`]: !children && children !== 0 && !!iconType,
       [`${prefixCls}-background-ghost`]: ghost && !isUnborderedButtonType(type),

components/card/__tests__/__snapshots__/index.test.js.snap

@@ -152,7 +152,7 @@ exports[`Card title should be vertically aligned 1`] = `
         class="ant-card-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>

components/cascader/__tests__/type.test.tsx

@@ -74,4 +74,18 @@ describe('Cascader.typescript', () => {
     );
     expect(wrapper).toBeTruthy();
   });
+
+  it('single onChange', () => {
+    const wrapper = mount(
+      <Cascader multiple={false} onChange={(values: (string | number)[]) => values} />,
+    );
+    expect(wrapper).toBeTruthy();
+  });
+
+  it('multiple onChange', () => {
+    const wrapper = mount(
+      <Cascader multiple onChange={(values: (string | number)[][]) => values} />,
+    );
+    expect(wrapper).toBeTruthy();
+  });
 });

components/cascader/index.tsx

@@ -2,7 +2,8 @@ import * as React from 'react';
 import classNames from 'classnames';
 import RcCascader from 'rc-cascader';
 import type {
-  CascaderProps as RcCascaderProps,
+  SingleCascaderProps as RcSingleCascaderProps,
+  MultipleCascaderProps as RcMultipleCascaderProps,
   ShowSearchType,
   FieldNames,
   BaseOptionType,
@@ -80,8 +81,16 @@ const defaultSearchRender: ShowSearchType['render'] = (inputValue, path, prefixC
   return optionList;
 };
 
-export interface CascaderProps<DataNodeType>
-  extends Omit<RcCascaderProps, 'checkable' | 'options'> {
+type SingleCascaderProps = Omit<RcSingleCascaderProps, 'checkable' | 'options'> & {
+  multiple?: false;
+};
+type MultipleCascaderProps = Omit<RcMultipleCascaderProps, 'checkable' | 'options'> & {
+  multiple: true;
+};
+
+type UnionCascaderProps = SingleCascaderProps | MultipleCascaderProps;
+
+export type CascaderProps<DataNodeType> = UnionCascaderProps & {
   multiple?: boolean;
   size?: SizeType;
   bordered?: boolean;

components/config-provider/__tests__/__snapshots__/components.test.js.snap

@@ -1173,7 +1173,7 @@ exports[`ConfigProvider components Breadcrumb prefixCls 1`] = `
 exports[`ConfigProvider components Button configProvider 1`] = `
 <div>
   <button
-    class="config-btn"
+    class="config-btn config-btn-default"
     type="button"
   >
     <span>
@@ -1184,7 +1184,7 @@ exports[`ConfigProvider components Button configProvider 1`] = `
     class="config-btn-group"
   >
     <button
-      class="config-btn"
+      class="config-btn config-btn-default"
       type="button"
     >
       <span>
@@ -1192,7 +1192,7 @@ exports[`ConfigProvider components Button configProvider 1`] = `
       </span>
     </button>
     <button
-      class="config-btn"
+      class="config-btn config-btn-default"
       type="button"
     >
       <span>
@@ -1206,7 +1206,7 @@ exports[`ConfigProvider components Button configProvider 1`] = `
 exports[`ConfigProvider components Button configProvider componentSize large 1`] = `
 <div>
   <button
-    class="config-btn config-btn-lg"
+    class="config-btn config-btn-default config-btn-lg"
     type="button"
   >
     <span>
@@ -1217,7 +1217,7 @@ exports[`ConfigProvider components Button configProvider componentSize large 1`]
     class="config-btn-group"
   >
     <button
-      class="config-btn config-btn-lg"
+      class="config-btn config-btn-default config-btn-lg"
       type="button"
     >
       <span>
@@ -1225,7 +1225,7 @@ exports[`ConfigProvider components Button configProvider componentSize large 1`]
       </span>
     </button>
     <button
-      class="config-btn config-btn-lg"
+      class="config-btn config-btn-default config-btn-lg"
       type="button"
     >
       <span>
@@ -1239,7 +1239,7 @@ exports[`ConfigProvider components Button configProvider componentSize large 1`]
 exports[`ConfigProvider components Button configProvider componentSize middle 1`] = `
 <div>
   <button
-    class="config-btn"
+    class="config-btn config-btn-default"
     type="button"
   >
     <span>
@@ -1250,7 +1250,7 @@ exports[`ConfigProvider components Button configProvider componentSize middle 1`
     class="config-btn-group"
   >
     <button
-      class="config-btn"
+      class="config-btn config-btn-default"
       type="button"
     >
       <span>
@@ -1258,7 +1258,7 @@ exports[`ConfigProvider components Button configProvider componentSize middle 1`
       </span>
     </button>
     <button
-      class="config-btn"
+      class="config-btn config-btn-default"
       type="button"
     >
       <span>
@@ -1272,7 +1272,7 @@ exports[`ConfigProvider components Button configProvider componentSize middle 1`
 exports[`ConfigProvider components Button configProvider virtual and dropdownMatchSelectWidth 1`] = `
 <div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1283,7 +1283,7 @@ exports[`ConfigProvider components Button configProvider virtual and dropdownMat
     class="ant-btn-group"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1291,7 +1291,7 @@ exports[`ConfigProvider components Button configProvider virtual and dropdownMat
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1305,7 +1305,7 @@ exports[`ConfigProvider components Button configProvider virtual and dropdownMat
 exports[`ConfigProvider components Button normal 1`] = `
 <div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1316,7 +1316,7 @@ exports[`ConfigProvider components Button normal 1`] = `
     class="ant-btn-group"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1324,7 +1324,7 @@ exports[`ConfigProvider components Button normal 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1338,7 +1338,7 @@ exports[`ConfigProvider components Button normal 1`] = `
 exports[`ConfigProvider components Button prefixCls 1`] = `
 <div>
   <button
-    class="prefix-Button"
+    class="prefix-Button prefix-Button-default"
     type="button"
   >
     <span>
@@ -1349,7 +1349,7 @@ exports[`ConfigProvider components Button prefixCls 1`] = `
     class="prefix-Button"
   >
     <button
-      class="prefix-Button"
+      class="prefix-Button prefix-Button-default"
       type="button"
     >
       <span>
@@ -1357,7 +1357,7 @@ exports[`ConfigProvider components Button prefixCls 1`] = `
       </span>
     </button>
     <button
-      class="prefix-Button"
+      class="prefix-Button prefix-Button-default"
       type="button"
     >
       <span>
@@ -12671,7 +12671,7 @@ exports[`ConfigProvider components Dropdown configProvider 1`] = `
   class="config-btn-group config-dropdown-button"
 >
   <button
-    class="config-btn"
+    class="config-btn config-btn-default"
     type="button"
   >
     <span>
@@ -12679,7 +12679,7 @@ exports[`ConfigProvider components Dropdown configProvider 1`] = `
     </span>
   </button>
   <button
-    class="config-btn config-btn-icon-only config-dropdown-trigger"
+    class="config-btn config-btn-default config-btn-icon-only config-dropdown-trigger"
     type="button"
   >
     <span
@@ -12710,7 +12710,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize large 1
   class="config-btn-group config-dropdown-button"
 >
   <button
-    class="config-btn config-btn-lg"
+    class="config-btn config-btn-default config-btn-lg"
     type="button"
   >
     <span>
@@ -12718,7 +12718,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize large 1
     </span>
   </button>
   <button
-    class="config-btn config-btn-lg config-btn-icon-only config-dropdown-trigger"
+    class="config-btn config-btn-default config-btn-lg config-btn-icon-only config-dropdown-trigger"
     type="button"
   >
     <span
@@ -12749,7 +12749,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize middle
   class="config-btn-group config-dropdown-button"
 >
   <button
-    class="config-btn"
+    class="config-btn config-btn-default"
     type="button"
   >
     <span>
@@ -12757,7 +12757,7 @@ exports[`ConfigProvider components Dropdown configProvider componentSize middle
     </span>
   </button>
   <button
-    class="config-btn config-btn-icon-only config-dropdown-trigger"
+    class="config-btn config-btn-default config-btn-icon-only config-dropdown-trigger"
     type="button"
   >
     <span
@@ -12788,7 +12788,7 @@ exports[`ConfigProvider components Dropdown configProvider virtual and dropdownM
   class="ant-btn-group ant-dropdown-button"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -12796,7 +12796,7 @@ exports[`ConfigProvider components Dropdown configProvider virtual and dropdownM
     </span>
   </button>
   <button
-    class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
     type="button"
   >
     <span
@@ -12827,7 +12827,7 @@ exports[`ConfigProvider components Dropdown normal 1`] = `
   class="ant-btn-group ant-dropdown-button"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -12835,7 +12835,7 @@ exports[`ConfigProvider components Dropdown normal 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
     type="button"
   >
     <span
@@ -12866,7 +12866,7 @@ exports[`ConfigProvider components Dropdown prefixCls 1`] = `
   class="ant-btn-group prefix-Dropdown"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -12874,7 +12874,7 @@ exports[`ConfigProvider components Dropdown prefixCls 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
     type="button"
   >
     <span
@@ -13663,7 +13663,7 @@ exports[`ConfigProvider components Input configProvider 1`] = `
           class="config-input-group-addon"
         >
           <button
-            class="config-btn config-btn-icon-only config-input-search-button"
+            class="config-btn config-btn-default config-btn-icon-only config-input-search-button"
             type="button"
           >
             <span
@@ -13758,7 +13758,7 @@ exports[`ConfigProvider components Input configProvider componentSize large 1`]
           class="config-input-group-addon"
         >
           <button
-            class="config-btn config-btn-lg config-btn-icon-only config-input-search-button"
+            class="config-btn config-btn-default config-btn-lg config-btn-icon-only config-input-search-button"
             type="button"
           >
             <span
@@ -13853,7 +13853,7 @@ exports[`ConfigProvider components Input configProvider componentSize middle 1`]
           class="config-input-group-addon"
         >
           <button
-            class="config-btn config-btn-icon-only config-input-search-button"
+            class="config-btn config-btn-default config-btn-icon-only config-input-search-button"
             type="button"
           >
             <span
@@ -13948,7 +13948,7 @@ exports[`ConfigProvider components Input configProvider virtual and dropdownMatc
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -14043,7 +14043,7 @@ exports[`ConfigProvider components Input normal 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -14138,7 +14138,7 @@ exports[`ConfigProvider components Input prefixCls 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only prefix-Input-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only prefix-Input-button"
             type="button"
           >
             <span
@@ -15624,7 +15624,7 @@ exports[`ConfigProvider components Modal configProvider 1`] = `
             class="config-modal-footer"
           >
             <button
-              class="config-btn"
+              class="config-btn config-btn-default"
               type="button"
             >
               <span>
@@ -15716,7 +15716,7 @@ exports[`ConfigProvider components Modal configProvider componentSize large 1`]
             class="config-modal-footer"
           >
             <button
-              class="config-btn config-btn-lg"
+              class="config-btn config-btn-default config-btn-lg"
               type="button"
             >
               <span>
@@ -15808,7 +15808,7 @@ exports[`ConfigProvider components Modal configProvider componentSize middle 1`]
             class="config-modal-footer"
           >
             <button
-              class="config-btn"
+              class="config-btn config-btn-default"
               type="button"
             >
               <span>
@@ -15900,7 +15900,7 @@ exports[`ConfigProvider components Modal configProvider virtual and dropdownMatc
             class="ant-modal-footer"
           >
             <button
-              class="ant-btn"
+              class="ant-btn ant-btn-default"
               type="button"
             >
               <span>
@@ -15992,7 +15992,7 @@ exports[`ConfigProvider components Modal normal 1`] = `
             class="ant-modal-footer"
           >
             <button
-              class="ant-btn"
+              class="ant-btn ant-btn-default"
               type="button"
             >
               <span>
@@ -16084,7 +16084,7 @@ exports[`ConfigProvider components Modal prefixCls 1`] = `
             class="prefix-Modal-footer"
           >
             <button
-              class="ant-btn"
+              class="ant-btn ant-btn-default"
               type="button"
             >
               <span>
@@ -18091,7 +18091,7 @@ exports[`ConfigProvider components Popconfirm configProvider 1`] = `
               class="config-popover-buttons"
             >
               <button
-                class="config-btn config-btn-sm"
+                class="config-btn config-btn-default config-btn-sm"
                 type="button"
               >
                 <span>
@@ -18174,7 +18174,7 @@ exports[`ConfigProvider components Popconfirm configProvider componentSize large
               class="config-popover-buttons"
             >
               <button
-                class="config-btn config-btn-sm"
+                class="config-btn config-btn-default config-btn-sm"
                 type="button"
               >
                 <span>
@@ -18257,7 +18257,7 @@ exports[`ConfigProvider components Popconfirm configProvider componentSize middl
               class="config-popover-buttons"
             >
               <button
-                class="config-btn config-btn-sm"
+                class="config-btn config-btn-default config-btn-sm"
                 type="button"
               >
                 <span>
@@ -18340,7 +18340,7 @@ exports[`ConfigProvider components Popconfirm configProvider virtual and dropdow
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -18423,7 +18423,7 @@ exports[`ConfigProvider components Popconfirm normal 1`] = `
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -18506,7 +18506,7 @@ exports[`ConfigProvider components Popconfirm prefixCls 1`] = `
               class="prefix-Popconfirm-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>

components/config-provider/__tests__/index.test.js

@@ -54,7 +54,7 @@ describe('ConfigProvider', () => {
       </ConfigProvider>,
     );
 
-    expect(wrapper.find('button').props().className).toEqual('bamboo-btn');
+    expect(wrapper.exists('button.bamboo-btn')).toBeTruthy();
   });
 
   it('dynamic prefixCls', () => {
@@ -76,9 +76,9 @@ describe('ConfigProvider', () => {
 
     const wrapper = mount(<DynamicPrefixCls />);
 
-    expect(wrapper.find('button').last().props().className).toEqual('bamboo-btn');
+    expect(wrapper.exists('button.bamboo-btn')).toBeTruthy();
     wrapper.find('.toggle-button').first().simulate('click');
-    expect(wrapper.find('button').last().props().className).toEqual('light-btn');
+    expect(wrapper.exists('button.light-btn')).toBeTruthy();
   });
 
   it('iconPrefixCls', () => {

components/config-provider/__tests__/theme.test.ts

@@ -14,7 +14,9 @@ describe('ConfigProvider.Theme', () => {
       });
 
       const styles: any[] = Array.from(document.querySelectorAll('style'));
-      const themeStyle = styles.find(style => style['rc-util-key'].includes('-dynamic-theme'));
+      const themeStyle = styles.find(style =>
+        style.getAttribute('rc-util-key').includes('-dynamic-theme'),
+      );
       expect(themeStyle).toBeTruthy();
 
       expect(themeStyle.innerHTML).toContain(`--bamboo-${kebabCase(colorName)}: rgb(0, 0, 255)`);

components/date-picker/generatePicker/interface.ts

@@ -1,18 +0,0 @@
-import type { ComponentClass, ForwardedRef, Component } from 'react';
-import { PickerProps, RangePickerProps } from '.';
-
-export interface CommonPickerMethods {
-  focus: () => void;
-  blur: () => void;
-}
-
-export interface PickerComponentClass<P = {}, S = unknown> extends ComponentClass<P, S> {
-  new (...args: ConstructorParameters<ComponentClass<P, S>>): InstanceType<ComponentClass<P, S>> &
-    CommonPickerMethods;
-}
-
-export type PickerRef<P> = ForwardedRef<Component<P> & CommonPickerMethods>;
-
-export type DatePickRef<DateType> = PickerRef<PickerProps<DateType>>;
-
-export type RangePickerRef<DateType> = PickerRef<RangePickerProps<DateType>>;

components/date-picker/generatePicker/interface.tsx

@@ -1,4 +1,5 @@
-import { ComponentClass } from 'react';
+import type { ComponentClass, ForwardedRef, Component } from 'react';
+import { PickerProps, RangePickerProps } from '.';
 
 export interface CommonPickerMethods {
   focus: () => void;
@@ -9,3 +10,9 @@ export interface PickerComponentClass<P = {}, S = unknown> extends ComponentClas
   new (...args: ConstructorParameters<ComponentClass<P, S>>): InstanceType<ComponentClass<P, S>> &
     CommonPickerMethods;
 }
+
+export type PickerRef<P> = ForwardedRef<Component<P> & CommonPickerMethods>;
+
+export type DatePickRef<DateType> = PickerRef<PickerProps<DateType>>;
+
+export type RangePickerRef<DateType> = PickerRef<RangePickerProps<DateType>>;

components/drawer/__tests__/__snapshots__/DrawerEvent.test.js.snap

@@ -3,7 +3,7 @@
 exports[`Drawer render correctly 1`] = `
 <div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/dropdown/demo/arrow.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -216,7 +216,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -429,7 +429,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -643,7 +643,7 @@ Array [
   </div>,
   <br />,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -856,7 +856,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -2353,7 +2353,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -3081,7 +3081,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -3089,7 +3089,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -3363,7 +3363,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -3371,7 +3371,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -3645,7 +3645,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         disabled=""
         type="button"
       >
@@ -3654,7 +3654,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         disabled=""
         type="button"
       >
@@ -3929,7 +3929,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -3961,7 +3961,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
         </div>
       </div>
       <button
-        class="ant-btn ant-btn-icon-only ant-btn-loading ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -4236,7 +4236,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md extend context co
     style="padding-bottom:8px"
   >
     <button
-      class="ant-btn ant-dropdown-trigger"
+      class="ant-btn ant-btn-default ant-dropdown-trigger"
       type="button"
     >
       <span>
@@ -5350,7 +5350,7 @@ exports[`renders ./components/dropdown/demo/loading.md extend context correctly
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -5358,7 +5358,7 @@ exports[`renders ./components/dropdown/demo/loading.md extend context correctly
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -6819,7 +6819,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -7034,7 +7034,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -7249,7 +7249,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -7473,7 +7473,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -7688,7 +7688,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -7903,7 +7903,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
         style="padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>

components/dropdown/__tests__/__snapshots__/demo.test.js.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/dropdown/demo/arrow.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -11,7 +11,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -19,7 +19,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -28,7 +28,7 @@ Array [
   </button>,
   <br />,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -36,7 +36,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -98,7 +98,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-dropdown-trigger"
     type="button"
   >
     <span>
@@ -157,7 +157,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -165,7 +165,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -198,7 +198,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -206,7 +206,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -239,7 +239,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         disabled=""
         type="button"
       >
@@ -248,7 +248,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         disabled=""
         type="button"
       >
@@ -282,7 +282,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -290,7 +290,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-btn-loading ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -324,7 +324,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
     style="padding-bottom:8px"
   >
     <button
-      class="ant-btn ant-dropdown-trigger"
+      class="ant-btn ant-btn-default ant-dropdown-trigger"
       type="button"
     >
       <span>
@@ -588,7 +588,7 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
       class="ant-btn-group ant-dropdown-button"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -596,7 +596,7 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
         type="button"
       >
         <span
@@ -695,7 +695,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -708,7 +708,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -721,7 +721,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -743,7 +743,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -756,7 +756,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>
@@ -769,7 +769,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
         style="padding-bottom:8px"
       >
         <button
-          class="ant-btn ant-dropdown-trigger"
+          class="ant-btn ant-btn-default ant-dropdown-trigger"
           type="button"
         >
           <span>

components/dropdown/__tests__/__snapshots__/dropdown-button.test.js.snap

@@ -5,11 +5,11 @@ exports[`DropdownButton rtl render component should be rendered correctly in RTL
   class="ant-btn-group ant-btn-group-rtl ant-dropdown-button"
 >
   <button
-    class="ant-btn ant-btn-rtl"
+    class="ant-btn ant-btn-default ant-btn-rtl"
     type="button"
   />
   <button
-    class="ant-btn ant-btn-icon-only ant-btn-rtl ant-dropdown-trigger ant-dropdown-rtl"
+    class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-rtl ant-dropdown-trigger ant-dropdown-rtl"
     type="button"
   >
     <span
@@ -40,11 +40,11 @@ exports[`DropdownButton should support href like Button 1`] = `
   class="ant-btn-group ant-dropdown-button"
 >
   <a
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     href="https://ant.design"
   />
   <button
-    class="ant-btn ant-btn-icon-only ant-dropdown-trigger"
+    class="ant-btn ant-btn-default ant-btn-icon-only ant-dropdown-trigger"
     type="button"
   >
     <span

components/form/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -261,7 +261,7 @@ exports[`renders ./components/form/demo/advanced-search.md extend context correc
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           style="margin:0 8px"
           type="button"
         >
@@ -846,7 +846,7 @@ exports[`renders ./components/form/demo/control-hooks.md extend context correctl
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -1112,7 +1112,7 @@ exports[`renders ./components/form/demo/control-ref.md extend context correctly
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -2747,7 +2747,7 @@ exports[`renders ./components/form/demo/form-context.md extend context correctly
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             style="margin:0 8px"
             type="button"
           >
@@ -2985,7 +2985,7 @@ exports[`renders ./components/form/demo/label-debug.md extend context correctly
           longtextlongtextlongtextlongtextlongtextlongtextlongtext
           <span
             aria-hidden="true"
-            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
           >
             lg
           </span>
@@ -3039,7 +3039,7 @@ exports[`renders ./components/form/demo/label-debug.md extend context correctly
           longtext longtext longtext longtext longtext longtext longtext
           <span
             aria-hidden="true"
-            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
           >
             lg
           </span>
@@ -3920,7 +3920,7 @@ exports[`renders ./components/form/demo/ref-item.md extend context correctly 1`]
     </span>
   </button>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -5157,7 +5157,7 @@ exports[`renders ./components/form/demo/register.md extend context correctly 1`]
               style="padding-left:4px;padding-right:4px"
             >
               <button
-                class="ant-btn"
+                class="ant-btn ant-btn-default"
                 type="button"
               >
                 <span>
@@ -6890,7 +6890,7 @@ exports[`renders ./components/form/demo/size.md extend context correctly 1`] = `
           class="ant-form-item-control-input-content"
         >
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -15825,7 +15825,7 @@ exports[`renders ./components/form/demo/validate-other.md extend context correct
                   type="file"
                 />
                 <button
-                  class="ant-btn"
+                  class="ant-btn ant-btn-default"
                   type="button"
                 >
                   <span
@@ -20729,7 +20729,7 @@ exports[`renders ./components/form/demo/warning-only.md extend context correctly
               class="ant-space-item"
             >
               <button
-                class="ant-btn"
+                class="ant-btn ant-btn-default"
                 type="button"
               >
                 <span>

components/form/__tests__/__snapshots__/demo.test.js.snap

@@ -261,7 +261,7 @@ exports[`renders ./components/form/demo/advanced-search.md correctly 1`] = `
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           style="margin:0 8px"
           type="button"
         >
@@ -747,7 +747,7 @@ exports[`renders ./components/form/demo/control-hooks.md correctly 1`] = `
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -914,7 +914,7 @@ exports[`renders ./components/form/demo/control-ref.md correctly 1`] = `
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -2385,7 +2385,7 @@ exports[`renders ./components/form/demo/form-context.md correctly 1`] = `
             </span>
           </button>
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             style="margin:0 8px"
             type="button"
           >
@@ -2623,7 +2623,7 @@ exports[`renders ./components/form/demo/label-debug.md correctly 1`] = `
           longtextlongtextlongtextlongtextlongtextlongtextlongtext
           <span
             aria-hidden="true"
-            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
           >
             lg
           </span>
@@ -2677,7 +2677,7 @@ exports[`renders ./components/form/demo/label-debug.md correctly 1`] = `
           longtext longtext longtext longtext longtext longtext longtext
           <span
             aria-hidden="true"
-            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+            style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
           >
             lg
           </span>
@@ -3558,7 +3558,7 @@ exports[`renders ./components/form/demo/ref-item.md correctly 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -4404,7 +4404,7 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
               style="padding-left:4px;padding-right:4px"
             >
               <button
-                class="ant-btn"
+                class="ant-btn ant-btn-default"
                 type="button"
               >
                 <span>
@@ -5327,7 +5327,7 @@ exports[`renders ./components/form/demo/size.md correctly 1`] = `
           class="ant-form-item-control-input-content"
         >
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>
@@ -7050,7 +7050,7 @@ exports[`renders ./components/form/demo/validate-other.md correctly 1`] = `
                   type="file"
                 />
                 <button
-                  class="ant-btn"
+                  class="ant-btn ant-btn-default"
                   type="button"
                 >
                   <span
@@ -8720,7 +8720,7 @@ exports[`renders ./components/form/demo/warning-only.md correctly 1`] = `
               class="ant-space-item"
             >
               <button
-                class="ant-btn"
+                class="ant-btn ant-btn-default"
                 type="button"
               >
                 <span>

components/grid/style/index.less

@@ -2,8 +2,11 @@
 @import '../../style/mixins/index';
 @import './mixin';
 
+@row-prefix-cls: ~'@{ant-prefix}-row';
+@col-prefix-cls: ~'@{ant-prefix}-col';
+
 // Grid system
-.@{ant-prefix}-row {
+.@{row-prefix-cls} {
   display: flex;
   flex-flow: row wrap;
 
@@ -19,46 +22,46 @@
 }
 
 // x轴原点
-.@{ant-prefix}-row-start {
+.@{row-prefix-cls}-start {
   justify-content: flex-start;
 }
 
 // x轴居中
-.@{ant-prefix}-row-center {
+.@{row-prefix-cls}-center {
   justify-content: center;
 }
 
 // x轴反方向
-.@{ant-prefix}-row-end {
+.@{row-prefix-cls}-end {
   justify-content: flex-end;
 }
 
 // x轴平分
-.@{ant-prefix}-row-space-between {
+.@{row-prefix-cls}-space-between {
   justify-content: space-between;
 }
 
 // x轴有间隔地平分
-.@{ant-prefix}-row-space-around {
+.@{row-prefix-cls}-space-around {
   justify-content: space-around;
 }
 
 // 顶部对齐
-.@{ant-prefix}-row-top {
+.@{row-prefix-cls}-top {
   align-items: flex-start;
 }
 
 // 居中对齐
-.@{ant-prefix}-row-middle {
+.@{row-prefix-cls}-middle {
   align-items: center;
 }
 
 // 底部对齐
-.@{ant-prefix}-row-bottom {
+.@{row-prefix-cls}-bottom {
   align-items: flex-end;
 }
 
-.@{ant-prefix}-col {
+.@{col-prefix-cls} {
   position: relative;
   max-width: 100%;
   // Prevent columns from collapsing when empty

components/input/TextArea.tsx

@@ -19,6 +19,26 @@ function fixEmojiLength(value: string, maxLength: number) {
   return [...(value || '')].slice(0, maxLength).join('');
 }
 
+function setTriggerValue(
+  isCursorInEnd: boolean,
+  preValue: string,
+  triggerValue: string,
+  maxLength: number,
+) {
+  let newTriggerValue = triggerValue;
+  if (isCursorInEnd) {
+    // 光标在尾部，直接截断
+    newTriggerValue = fixEmojiLength(triggerValue, maxLength!);
+  } else if (
+    [...(preValue || '')].length < triggerValue.length &&
+    [...(triggerValue || '')].length > maxLength!
+  ) {
+    // 光标在中间，如果最后的值超过最大值，则采用原先的值
+    newTriggerValue = preValue;
+  }
+  return newTriggerValue;
+}
+
 export interface TextAreaProps extends RcTextAreaProps {
   allowClear?: boolean;
   bordered?: boolean;
@@ -61,6 +81,8 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
     const clearableInputRef = React.useRef<ClearableLabeledInput>(null);
 
     const [compositing, setCompositing] = React.useState(false);
+    const oldCompositionValueRef = React.useRef<string>();
+    const oldSelectionStartRef = React.useRef<number>(0);
 
     const [value, setValue] = useMergedState(props.defaultValue, {
       value: props.value,
@@ -80,6 +102,10 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
 
     const onInternalCompositionStart: React.CompositionEventHandler<HTMLTextAreaElement> = e => {
       setCompositing(true);
+      // 拼音输入前保存一份旧值
+      oldCompositionValueRef.current = value as string;
+      // 保存旧的光标位置
+      oldSelectionStartRef.current = e.currentTarget.selectionStart;
       onCompositionStart?.(e);
     };
 
@@ -88,9 +114,16 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
 
       let triggerValue = e.currentTarget.value;
       if (hasMaxLength) {
-        triggerValue = fixEmojiLength(triggerValue, maxLength!);
+        const isCursorInEnd =
+          oldSelectionStartRef.current >= maxLength! + 1 ||
+          oldSelectionStartRef.current === oldCompositionValueRef.current?.length;
+        triggerValue = setTriggerValue(
+          isCursorInEnd,
+          oldCompositionValueRef.current as string,
+          triggerValue,
+          maxLength!,
+        );
       }
-
       // Patch composition onChange when value changed
       if (triggerValue !== value) {
         handleSetValue(triggerValue);
@@ -103,9 +136,13 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
     const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
       let triggerValue = e.target.value;
       if (!compositing && hasMaxLength) {
-        triggerValue = fixEmojiLength(triggerValue, maxLength!);
+        // 1. 复制粘贴超过maxlength的情况 2.未超过maxlength的情况
+        const isCursorInEnd =
+          e.target.selectionStart >= maxLength! + 1 ||
+          e.target.selectionStart === triggerValue.length ||
+          !e.target.selectionStart;
+        triggerValue = setTriggerValue(isCursorInEnd, value as string, triggerValue, maxLength!);
       }
-
       handleSetValue(triggerValue);
       resolveOnChange(e.currentTarget, e, onChange, triggerValue);
     };

components/input/__tests__/__snapshots__/Search.test.js.snap

@@ -16,7 +16,7 @@ exports[`Input.Search rtl render component should be rendered correctly in RTL d
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-btn-rtl ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-rtl ant-input-search-button"
         type="button"
       >
         <span
@@ -71,7 +71,7 @@ exports[`Input.Search should support ReactNode suffix without error 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
         type="button"
       >
         <span
@@ -115,7 +115,7 @@ exports[`Input.Search should support addonAfter 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
         type="button"
       >
         <span
@@ -218,7 +218,7 @@ exports[`Input.Search should support addonAfter and suffix for loading 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-btn-loading ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-input-search-button"
         type="button"
       >
         <span
@@ -325,7 +325,7 @@ exports[`Input.Search should support custom Button 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-input-search-button"
+        class="ant-btn ant-btn-default ant-input-search-button"
         type="button"
       >
         <span>
@@ -429,7 +429,7 @@ exports[`Input.Search should support invalid suffix 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
         type="button"
       >
         <span
@@ -473,7 +473,7 @@ exports[`Input.Search should support loading 1`] = `
       class="ant-input-group-addon"
     >
       <button
-        class="ant-btn ant-btn-icon-only ant-btn-loading ant-input-search-button"
+        class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-input-search-button"
         type="button"
       >
         <span

components/input/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -5094,7 +5094,7 @@ exports[`renders ./components/input/demo/focus.md extend context correctly 1`] =
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -5107,7 +5107,7 @@ exports[`renders ./components/input/demo/focus.md extend context correctly 1`] =
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -5120,7 +5120,7 @@ exports[`renders ./components/input/demo/focus.md extend context correctly 1`] =
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -5133,7 +5133,7 @@ exports[`renders ./components/input/demo/focus.md extend context correctly 1`] =
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -5262,7 +5262,7 @@ exports[`renders ./components/input/demo/group.md extend context correctly 1`] =
       value="git@github.com:ant-design/ant-design.git"
     />
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -5510,7 +5510,7 @@ exports[`renders ./components/input/demo/group.md extend context correctly 1`] =
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -5580,7 +5580,7 @@ exports[`renders ./components/input/demo/group.md extend context correctly 1`] =
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -8886,7 +8886,7 @@ exports[`renders ./components/input/demo/search-input.md extend context correctl
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -8962,7 +8962,7 @@ exports[`renders ./components/input/demo/search-input.md extend context correctl
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -9043,7 +9043,7 @@ exports[`renders ./components/input/demo/search-input.md extend context correctl
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -9255,7 +9255,7 @@ Array [
         class="ant-input-group-addon"
       >
         <button
-          class="ant-btn ant-btn-icon-only ant-btn-loading ant-input-search-button"
+          class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-input-search-button"
           type="button"
         >
           <span
@@ -9641,16 +9641,25 @@ exports[`renders ./components/input/demo/status.md extend context correctly 1`]
 `;
 
 exports[`renders ./components/input/demo/textarea.md extend context correctly 1`] = `
-<textarea
-  class="ant-input"
-  rows="4"
-/>
+Array [
+  <textarea
+    class="ant-input"
+    rows="4"
+  />,
+  <br />,
+  <br />,
+  <textarea
+    class="ant-input"
+    placeholder="maxLength is 6"
+    rows="4"
+  />,
+]
 `;
 
 exports[`renders ./components/input/demo/textarea-resize.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     style="margin-bottom:16px"
     type="button"
   >

components/input/__tests__/__snapshots__/demo.test.js.snap

@@ -1311,7 +1311,7 @@ exports[`renders ./components/input/demo/focus.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1324,7 +1324,7 @@ exports[`renders ./components/input/demo/focus.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1337,7 +1337,7 @@ exports[`renders ./components/input/demo/focus.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1350,7 +1350,7 @@ exports[`renders ./components/input/demo/focus.md correctly 1`] = `
         style="margin-right:8px;padding-bottom:8px"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1479,7 +1479,7 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
       value="git@github.com:ant-design/ant-design.git"
     />
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -1621,7 +1621,7 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -1691,7 +1691,7 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -2660,7 +2660,7 @@ exports[`renders ./components/input/demo/search-input.md correctly 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -2736,7 +2736,7 @@ exports[`renders ./components/input/demo/search-input.md correctly 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -2817,7 +2817,7 @@ exports[`renders ./components/input/demo/search-input.md correctly 1`] = `
           class="ant-input-group-addon"
         >
           <button
-            class="ant-btn ant-btn-icon-only ant-input-search-button"
+            class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
             type="button"
           >
             <span
@@ -3029,7 +3029,7 @@ Array [
         class="ant-input-group-addon"
       >
         <button
-          class="ant-btn ant-btn-icon-only ant-btn-loading ant-input-search-button"
+          class="ant-btn ant-btn-default ant-btn-icon-only ant-btn-loading ant-input-search-button"
           type="button"
         >
           <span
@@ -3415,16 +3415,25 @@ exports[`renders ./components/input/demo/status.md correctly 1`] = `
 `;
 
 exports[`renders ./components/input/demo/textarea.md correctly 1`] = `
-<textarea
-  class="ant-input"
-  rows="4"
-/>
+Array [
+  <textarea
+    class="ant-input"
+    rows="4"
+  />,
+  <br />,
+  <br />,
+  <textarea
+    class="ant-input"
+    placeholder="maxLength is 6"
+    rows="4"
+  />,
+]
 `;
 
 exports[`renders ./components/input/demo/textarea-resize.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     style="margin-bottom:16px"
     type="button"
   >

components/input/__tests__/textarea.test.js

@@ -110,6 +110,64 @@ describe('TextArea', () => {
         expect.objectContaining({ target: expect.objectContaining({ value: '竹' }) }),
       );
     });
+
+    // 字符输入
+    it('should not cut off string when cursor position is not at the end', () => {
+      const onChange = jest.fn();
+      const wrapper = mount(<TextArea maxLength={6} defaultValue="123456" onChange={onChange} />);
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 1, value: 'w123456' } });
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 3, value: '123w456' } });
+      expect(wrapper.find('textarea').at(0).getDOMNode().value).toBe('123456');
+    });
+
+    // 拼音输入
+    // 1. 光标位于最后，且当前字符数未达到6个，若选中的字符 + 原字符的长度超过6个，则将最终的字符按照maxlength截断
+    it('when the input method is pinyin and the cursor is at the end, should use maxLength to crop', () => {
+      const onChange = jest.fn();
+      const wrapper = mount(<TextArea maxLength={6} defaultValue="1234" onChange={onChange} />);
+      wrapper.find('textarea').instance().value = '1234'; // enzyme not support change `currentTarget`
+      wrapper.find('textarea').instance().selectionStart = 4;
+      wrapper.find('textarea').simulate('compositionStart');
+
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 9, value: '1234z z z' } });
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 7, value: '1234组织者' } });
+
+      wrapper.find('textarea').instance().value = '1234组织者';
+      wrapper.find('textarea').instance().selectionStart = 7;
+      wrapper.find('textarea').simulate('compositionEnd');
+
+      expect(wrapper.find('textarea').at(0).getDOMNode().value).toBe('1234组织');
+    });
+
+    // 2. 光标位于中间或开头，且当前字符数未达到6个，若选中的字符 + 原字符的长度超过6个，则显示原有字符
+    it('when the input method is Pinyin and the cursor is in the middle, should display the original string', () => {
+      const onChange = jest.fn();
+      const wrapper = mount(<TextArea maxLength={6} defaultValue="1234" onChange={onChange} />);
+      wrapper.find('textarea').instance().value = '1234'; // enzyme not support change `currentTarget`
+      wrapper.find('textarea').instance().selectionStart = 2;
+      wrapper.find('textarea').simulate('compositionStart');
+
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 2, value: '12z z z34' } });
+      wrapper
+        .find('textarea')
+        .simulate('change', { target: { selectionStart: 5, value: '12组织者34' } });
+
+      wrapper.find('textarea').instance().value = '12组织者34';
+      wrapper.find('textarea').instance().selectionStart = 5;
+      wrapper.find('textarea').simulate('compositionEnd');
+
+      expect(wrapper.find('textarea').at(0).getDOMNode().value).toBe('1234');
+    });
   });
 
   it('when prop value not in this.props, resizeTextarea should be called', async () => {

components/input/demo/textarea.md

@@ -18,5 +18,13 @@ import { Input } from 'antd';
 
 const { TextArea } = Input;
 
-ReactDOM.render(<TextArea rows={4} />, mountNode);
+ReactDOM.render(
+  <>
+    <TextArea rows={4} />
+    <br />
+    <br />
+    <TextArea rows={4} placeholder="maxLength is 6" maxLength={6} />
+  </>,
+  mountNode,
+);
 ```

components/locale/pl_PL.tsx

@@ -119,8 +119,8 @@ const localeValues: Locale = {
       },
       array: {
         len: '${label} musi posiadać ${len} elementów',
-        min: '${label} musi posiadać co najmniej ${len} elementów',
-        max: '${label} musi posiadać maksymalnie ${len} elementów',
+        min: '${label} musi posiadać co najmniej ${min} elementów',
+        max: '${label} musi posiadać maksymalnie ${max} elementów',
         range: '${label} musi posiadać między ${min} a ${max} elementów',
       },
       pattern: {

components/mentions/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -137,7 +137,7 @@ exports[`renders ./components/mentions/demo/form.md extend context correctly 1`]
           </button>
              
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>

components/mentions/__tests__/__snapshots__/demo.test.js.snap

@@ -137,7 +137,7 @@ exports[`renders ./components/mentions/demo/form.md correctly 1`] = `
           </button>
              
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>

components/menu/index.en-US.md

@@ -43,7 +43,7 @@ More layouts with navigation: [Layout](/components/layout).
 | mode | Type of menu | `vertical` \| `horizontal` \| `inline` | `vertical` |  |
 | multiple | Allows selection of multiple items | boolean | false |  |
 | openKeys | Array with the keys of currently opened sub-menus | string\[] | - |  |
-| overflowedIndicator | Customized icon when menu is collapsed | ReactNode | - |  |
+| overflowedIndicator | Customized the ellipsis icon when menu is collapsed horizontally | ReactNode | `<EllipsisOutlined />` |  |
 | selectable | Allows selecting menu items | boolean | true |  |
 | selectedKeys | Array with the keys of currently selected menu items | string\[] | - |  |
 | style | Style of the root node | CSSProperties | - |  |

components/menu/index.zh-CN.md

@@ -44,7 +44,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/3XZcjGpvK/Menu.svg
 | mode | 菜单类型，现在支持垂直、水平、和内嵌模式三种 | `vertical` \| `horizontal` \| `inline` | `vertical` |  |
 | multiple | 是否允许多选 | boolean | false |  |
 | openKeys | 当前展开的 SubMenu 菜单项 key 数组 | string\[] | - |  |
-| overflowedIndicator | 自定义 Menu 折叠时的图标 | ReactNode | - |  |
+| overflowedIndicator | 用于自定义 Menu 水平空间不足时的省略收缩的图标 | ReactNode | `<EllipsisOutlined />` |  |
 | selectable | 是否允许选中 | boolean | true |  |
 | selectedKeys | 当前选中的菜单项 key 数组 | string\[] | - |  |
 | style | 根节点样式 | CSSProperties | - |  |

components/menu/style/dark.less

@@ -1,4 +1,19 @@
+.accessibility-focus-dark() {
+  box-shadow: 0 0 0 2px @primary-7;
+}
+
 .@{menu-prefix-cls} {
+  &&-root:focus-visible {
+    .accessibility-focus-dark();
+  }
+
+  &-dark &-item,
+  &-dark &-submenu-title {
+    &:focus-visible {
+      .accessibility-focus-dark();
+    }
+  }
+
   // dark theme
   &&-dark,
   &-dark &-sub,

components/menu/style/index.less

@@ -6,7 +6,7 @@
 @menu-animation-duration-normal: 0.15s;
 
 .accessibility-focus() {
-  box-shadow: 0 0 0 2px @primary-1;
+  box-shadow: 0 0 0 2px @primary-2;
 }
 
 // TODO: Should remove icon style compatible in v5

components/message/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -2,7 +2,7 @@
 
 exports[`renders ./components/message/demo/custom-style.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -13,7 +13,7 @@ exports[`renders ./components/message/demo/custom-style.md extend context correc
 
 exports[`renders ./components/message/demo/duration.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -46,7 +46,7 @@ exports[`renders ./components/message/demo/info.md extend context correctly 1`]
 
 exports[`renders ./components/message/demo/loading.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -64,7 +64,7 @@ exports[`renders ./components/message/demo/other.md extend context correctly 1`]
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -77,7 +77,7 @@ exports[`renders ./components/message/demo/other.md extend context correctly 1`]
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -89,7 +89,7 @@ exports[`renders ./components/message/demo/other.md extend context correctly 1`]
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -102,7 +102,7 @@ exports[`renders ./components/message/demo/other.md extend context correctly 1`]
 
 exports[`renders ./components/message/demo/thenable.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>

components/message/__tests__/__snapshots__/demo.test.js.snap

@@ -2,7 +2,7 @@
 
 exports[`renders ./components/message/demo/custom-style.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -13,7 +13,7 @@ exports[`renders ./components/message/demo/custom-style.md correctly 1`] = `
 
 exports[`renders ./components/message/demo/duration.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -46,7 +46,7 @@ exports[`renders ./components/message/demo/info.md correctly 1`] = `
 
 exports[`renders ./components/message/demo/loading.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -64,7 +64,7 @@ exports[`renders ./components/message/demo/other.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -77,7 +77,7 @@ exports[`renders ./components/message/demo/other.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -89,7 +89,7 @@ exports[`renders ./components/message/demo/other.md correctly 1`] = `
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -102,7 +102,7 @@ exports[`renders ./components/message/demo/other.md correctly 1`] = `
 
 exports[`renders ./components/message/demo/thenable.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>

components/modal/__tests__/__snapshots__/Modal.test.js.snap

@@ -69,7 +69,7 @@ exports[`Modal render correctly 1`] = `
                 class="ant-modal-footer"
               >
                 <button
-                  class="ant-btn"
+                  class="ant-btn ant-btn-default"
                   type="button"
                 >
                   <span>
@@ -225,7 +225,7 @@ exports[`Modal support closeIcon 1`] = `
           class="ant-modal-footer"
         >
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span>

components/modal/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -43,7 +43,7 @@ exports[`renders ./components/modal/demo/confirm.md extend context correctly 1`]
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -56,7 +56,7 @@ exports[`renders ./components/modal/demo/confirm.md extend context correctly 1`]
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -95,7 +95,7 @@ exports[`renders ./components/modal/demo/confirm.md extend context correctly 1`]
 
 exports[`renders ./components/modal/demo/confirm-router.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -135,7 +135,7 @@ exports[`renders ./components/modal/demo/hooks.md extend context correctly 1`] =
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -148,7 +148,7 @@ exports[`renders ./components/modal/demo/hooks.md extend context correctly 1`] =
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -161,7 +161,7 @@ exports[`renders ./components/modal/demo/hooks.md extend context correctly 1`] =
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -173,7 +173,7 @@ exports[`renders ./components/modal/demo/hooks.md extend context correctly 1`] =
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -194,7 +194,7 @@ exports[`renders ./components/modal/demo/info.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -207,7 +207,7 @@ exports[`renders ./components/modal/demo/info.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -220,7 +220,7 @@ exports[`renders ./components/modal/demo/info.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -233,7 +233,7 @@ exports[`renders ./components/modal/demo/info.md extend context correctly 1`] =
     style="padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -265,7 +265,7 @@ exports[`renders ./components/modal/demo/locale.md extend context correctly 1`]
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -278,7 +278,7 @@ exports[`renders ./components/modal/demo/locale.md extend context correctly 1`]
 
 exports[`renders ./components/modal/demo/manual.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -289,7 +289,7 @@ exports[`renders ./components/modal/demo/manual.md extend context correctly 1`]
 
 exports[`renders ./components/modal/demo/modal-render.md extend context correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>

components/modal/__tests__/__snapshots__/demo.test.js.snap

@@ -43,7 +43,7 @@ exports[`renders ./components/modal/demo/confirm.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -56,7 +56,7 @@ exports[`renders ./components/modal/demo/confirm.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -95,7 +95,7 @@ exports[`renders ./components/modal/demo/confirm.md correctly 1`] = `
 
 exports[`renders ./components/modal/demo/confirm-router.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -135,7 +135,7 @@ exports[`renders ./components/modal/demo/hooks.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -148,7 +148,7 @@ exports[`renders ./components/modal/demo/hooks.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -161,7 +161,7 @@ exports[`renders ./components/modal/demo/hooks.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -173,7 +173,7 @@ exports[`renders ./components/modal/demo/hooks.md correctly 1`] = `
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -194,7 +194,7 @@ exports[`renders ./components/modal/demo/info.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -207,7 +207,7 @@ exports[`renders ./components/modal/demo/info.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -220,7 +220,7 @@ exports[`renders ./components/modal/demo/info.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -233,7 +233,7 @@ exports[`renders ./components/modal/demo/info.md correctly 1`] = `
     style="padding-bottom:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -265,7 +265,7 @@ exports[`renders ./components/modal/demo/locale.md correctly 1`] = `
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -278,7 +278,7 @@ exports[`renders ./components/modal/demo/locale.md correctly 1`] = `
 
 exports[`renders ./components/modal/demo/manual.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -289,7 +289,7 @@ exports[`renders ./components/modal/demo/manual.md correctly 1`] = `
 
 exports[`renders ./components/modal/demo/modal-render.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>

components/notification/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -432,7 +432,7 @@ exports[`renders ./components/notification/demo/with-icon.md extend context corr
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -445,7 +445,7 @@ exports[`renders ./components/notification/demo/with-icon.md extend context corr
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -458,7 +458,7 @@ exports[`renders ./components/notification/demo/with-icon.md extend context corr
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -470,7 +470,7 @@ exports[`renders ./components/notification/demo/with-icon.md extend context corr
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/notification/__tests__/__snapshots__/demo.test.js.snap

@@ -432,7 +432,7 @@ exports[`renders ./components/notification/demo/with-icon.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -445,7 +445,7 @@ exports[`renders ./components/notification/demo/with-icon.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -458,7 +458,7 @@ exports[`renders ./components/notification/demo/with-icon.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -470,7 +470,7 @@ exports[`renders ./components/notification/demo/with-icon.md correctly 1`] = `
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/page-header/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -59,7 +59,7 @@ Array [
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -67,7 +67,7 @@ Array [
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -273,7 +273,7 @@ Array [
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -281,7 +281,7 @@ Array [
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -621,7 +621,7 @@ exports[`renders ./components/page-header/demo/content.md extend context correct
       class="ant-page-header-heading-extra"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -629,7 +629,7 @@ exports[`renders ./components/page-header/demo/content.md extend context correct
         </span>
       </button>
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -645,7 +645,7 @@ exports[`renders ./components/page-header/demo/content.md extend context correct
         </span>
       </button>
       <button
-        class="ant-btn ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-dropdown-trigger"
         style="border:none;padding:0"
         type="button"
       >
@@ -1001,7 +1001,7 @@ exports[`renders ./components/page-header/demo/ghost.md extend context correctly
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1009,7 +1009,7 @@ exports[`renders ./components/page-header/demo/ghost.md extend context correctly
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1209,7 +1209,7 @@ exports[`renders ./components/page-header/demo/responsive.md extend context corr
       class="ant-page-header-heading-extra"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -1217,7 +1217,7 @@ exports[`renders ./components/page-header/demo/responsive.md extend context corr
         </span>
       </button>
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>

components/page-header/__tests__/__snapshots__/demo.test.js.snap

@@ -59,7 +59,7 @@ Array [
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -67,7 +67,7 @@ Array [
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -273,7 +273,7 @@ Array [
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -281,7 +281,7 @@ Array [
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -621,7 +621,7 @@ exports[`renders ./components/page-header/demo/content.md correctly 1`] = `
       class="ant-page-header-heading-extra"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -629,7 +629,7 @@ exports[`renders ./components/page-header/demo/content.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -645,7 +645,7 @@ exports[`renders ./components/page-header/demo/content.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn ant-dropdown-trigger"
+        class="ant-btn ant-btn-default ant-dropdown-trigger"
         style="border:none;padding:0"
         type="button"
       >
@@ -799,7 +799,7 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
         class="ant-page-header-heading-extra"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -807,7 +807,7 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
           </span>
         </button>
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1007,7 +1007,7 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
       class="ant-page-header-heading-extra"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -1015,7 +1015,7 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
         </span>
       </button>
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>

components/pagination/style/index.less

@@ -59,7 +59,6 @@
       }
     }
 
-    &:focus-visible,
     &:hover {
       border-color: @primary-color;
       transition: all 0.3s;
@@ -69,6 +68,17 @@
       }
     }
 
+    // cannot merge with `&:hover`
+    // see https://github.com/ant-design/ant-design/pull/34002
+    &:focus-visible {
+      border-color: @primary-color;
+      transition: all 0.3s;
+
+      a {
+        color: @primary-color;
+      }
+    }
+
     &-active {
       font-weight: @pagination-font-weight-active;
       background: @pagination-item-bg-active;
@@ -78,15 +88,21 @@
         color: @primary-color;
       }
 
-      &:focus-visible,
       &:hover {
         border-color: @primary-5;
       }
 
-      &:focus-visible a,
+      &:focus-visible {
+        border-color: @primary-5;
+      }
+
       &:hover a {
         color: @primary-5;
       }
+
+      &:focus-visible a {
+        color: @primary-5;
+      }
     }
   }
 
@@ -130,7 +146,6 @@
       }
     }
 
-    &:focus-visible,
     &:hover {
       .@{pagination-prefix-cls}-item-link-icon {
         opacity: 1;
@@ -139,6 +154,15 @@
         opacity: 0;
       }
     }
+
+    &:focus-visible {
+      .@{pagination-prefix-cls}-item-link-icon {
+        opacity: 1;
+      }
+      .@{pagination-prefix-cls}-item-ellipsis {
+        opacity: 0;
+      }
+    }
   }
 
   &-prev,
@@ -194,7 +218,11 @@
       transition: all 0.3s;
     }
 
-    &:focus-visible .@{pagination-prefix-cls}-item-link,
+    &:focus-visible .@{pagination-prefix-cls}-item-link {
+      color: @primary-color;
+      border-color: @primary-color;
+    }
+
     &:hover .@{pagination-prefix-cls}-item-link {
       color: @primary-color;
       border-color: @primary-color;
@@ -203,7 +231,15 @@
 
   &-disabled {
     &,
-    &:hover,
+    &:hover {
+      cursor: not-allowed;
+      .@{pagination-prefix-cls}-item-link {
+        color: @disabled-color;
+        border-color: @border-color-base;
+        cursor: not-allowed;
+      }
+    }
+
     &:focus-visible {
       cursor: not-allowed;
       .@{pagination-prefix-cls}-item-link {

components/popconfirm/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -64,7 +64,7 @@ Array [
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -149,7 +149,7 @@ Array [
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -234,7 +234,7 @@ exports[`renders ./components/popconfirm/demo/dynamic-trigger.md extend context
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -339,7 +339,7 @@ Array [
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -424,7 +424,7 @@ Array [
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>
@@ -456,7 +456,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -517,7 +517,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -539,7 +539,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -600,7 +600,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -622,7 +622,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -683,7 +683,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -709,7 +709,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -770,7 +770,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -792,7 +792,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -853,7 +853,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -875,7 +875,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -936,7 +936,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -962,7 +962,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1023,7 +1023,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1045,7 +1045,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1106,7 +1106,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1128,7 +1128,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1189,7 +1189,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1215,7 +1215,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1276,7 +1276,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1298,7 +1298,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1359,7 +1359,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1381,7 +1381,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1442,7 +1442,7 @@ exports[`renders ./components/popconfirm/demo/placement.md extend context correc
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -1531,7 +1531,7 @@ Array [
               class="ant-popover-buttons"
             >
               <button
-                class="ant-btn ant-btn-sm"
+                class="ant-btn ant-btn-default ant-btn-sm"
                 type="button"
               >
                 <span>

components/popconfirm/__tests__/__snapshots__/demo.test.js.snap

@@ -69,7 +69,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -77,7 +77,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -85,7 +85,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -97,7 +97,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -105,7 +105,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -113,7 +113,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -125,7 +125,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -133,7 +133,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -141,7 +141,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -153,7 +153,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -161,7 +161,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -169,7 +169,7 @@ exports[`renders ./components/popconfirm/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/popconfirm/__tests__/__snapshots__/index.test.js.snap

@@ -2,8 +2,8 @@
 
 exports[`Popconfirm rtl render component should be rendered correctly in RTL direction 1`] = `<span />`;
 
-exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;
+exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-default ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;
 
-exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;
+exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">code</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-default ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;
 
-exports[`Popconfirm shows content for render functions 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">some-title</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;
+exports[`Popconfirm shows content for render functions 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"><div class=\\"ant-popover-message\\"><span role=\\"img\\" aria-label=\\"exclamation-circle\\" class=\\"anticon anticon-exclamation-circle\\"><svg viewBox=\\"64 64 896 896\\" focusable=\\"false\\" data-icon=\\"exclamation-circle\\" width=\\"1em\\" height=\\"1em\\" fill=\\"currentColor\\" aria-hidden=\\"true\\"><path d=\\"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z\\"></path></svg></span><div class=\\"ant-popover-message-title\\">some-title</div></div><div class=\\"ant-popover-buttons\\"><button type=\\"button\\" class=\\"ant-btn ant-btn-default ant-btn-sm\\"><span>Cancel</span></button><button type=\\"button\\" class=\\"ant-btn ant-btn-primary ant-btn-sm\\"><span>OK</span></button></div></div></div></div>"`;

components/popover/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/popover/demo/arrow-point-at-center.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -49,7 +49,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -201,7 +201,7 @@ Array [
 exports[`renders ./components/popover/demo/hover-with-click.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -294,7 +294,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -344,7 +344,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -394,7 +394,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -448,7 +448,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -498,7 +498,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -548,7 +548,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -602,7 +602,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -652,7 +652,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -702,7 +702,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -756,7 +756,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -806,7 +806,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -856,7 +856,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -912,7 +912,7 @@ exports[`renders ./components/popover/demo/placement.md extend context correctly
 exports[`renders ./components/popover/demo/triggerType.md extend context correctly 1`] = `
 <div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -960,7 +960,7 @@ exports[`renders ./components/popover/demo/triggerType.md extend context correct
     </div>
   </div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1008,7 +1008,7 @@ exports[`renders ./components/popover/demo/triggerType.md extend context correct
     </div>
   </div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/popover/__tests__/__snapshots__/demo.test.js.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/popover/demo/arrow-point-at-center.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -11,7 +11,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -45,7 +45,7 @@ exports[`renders ./components/popover/demo/control.md correctly 1`] = `
 
 exports[`renders ./components/popover/demo/hover-with-click.md correctly 1`] = `
 <button
-  class="ant-btn"
+  class="ant-btn ant-btn-default"
   type="button"
 >
   <span>
@@ -62,7 +62,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -70,7 +70,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -78,7 +78,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -90,7 +90,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -98,7 +98,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -106,7 +106,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -118,7 +118,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -126,7 +126,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -134,7 +134,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -146,7 +146,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -154,7 +154,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -162,7 +162,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -176,7 +176,7 @@ exports[`renders ./components/popover/demo/placement.md correctly 1`] = `
 exports[`renders ./components/popover/demo/triggerType.md correctly 1`] = `
 <div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -184,7 +184,7 @@ exports[`renders ./components/popover/demo/triggerType.md correctly 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -192,7 +192,7 @@ exports[`renders ./components/popover/demo/triggerType.md correctly 1`] = `
     </span>
   </button>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -261,7 +261,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -285,7 +285,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -658,7 +658,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -682,7 +682,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span

components/progress/__tests__/__snapshots__/demo.test.js.snap

@@ -261,7 +261,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -285,7 +285,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -658,7 +658,7 @@ Array [
     class="ant-btn-group"
   >
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span
@@ -682,7 +682,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn ant-btn-icon-only"
+      class="ant-btn ant-btn-default ant-btn-icon-only"
       type="button"
     >
       <span

components/rate/style/index.less

@@ -36,8 +36,7 @@
     > div {
       transition: all 0.3s, outline 0s;
 
-      &:hover,
-      &:focus-visible {
+      &:hover {
         transform: @rate-star-hover-scale;
       }
 
@@ -47,6 +46,7 @@
 
       &:focus-visible {
         outline: 1px dashed @rate-star-color;
+        transform: @rate-star-hover-scale;
       }
     }
 

components/result/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1118,7 +1118,7 @@ exports[`renders ./components/result/demo/error.md extend context correctly 1`]
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1305,7 +1305,7 @@ exports[`renders ./components/result/demo/success.md extend context correctly 1`
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/result/__tests__/__snapshots__/demo.test.js.snap

@@ -1118,7 +1118,7 @@ exports[`renders ./components/result/demo/error.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1305,7 +1305,7 @@ exports[`renders ./components/result/demo/success.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/select/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1533,7 +1533,7 @@ Array [
 exports[`renders ./components/select/demo/custom-dropdown-menu.md extend context correctly 1`] = `
 <div
   class="ant-select ant-select-single ant-select-show-arrow"
-  style="width:240px"
+  style="width:300px"
 >
   <div
     class="ant-select-selector"
@@ -1569,96 +1569,105 @@ exports[`renders ./components/select/demo/custom-dropdown-menu.md extend context
       style="opacity:0;pointer-events:none"
     >
       <div>
-        <div>
+        <div
+          id="undefined_list"
+          role="listbox"
+          style="height:0;width:0;overflow:hidden"
+        >
           <div
-            id="undefined_list"
-            role="listbox"
-            style="height:0;width:0;overflow:hidden"
+            aria-label="jack"
+            aria-selected="false"
+            id="undefined_list_0"
+            role="option"
           >
-            <div
-              aria-label="jack"
-              aria-selected="false"
-              id="undefined_list_0"
-              role="option"
-            >
-              jack
-            </div>
-            <div
-              aria-label="lucy"
-              aria-selected="false"
-              id="undefined_list_1"
-              role="option"
-            >
-              lucy
-            </div>
+            jack
           </div>
           <div
-            class="rc-virtual-list"
-            style="position:relative"
+            aria-label="lucy"
+            aria-selected="false"
+            id="undefined_list_1"
+            role="option"
           >
-            <div
-              class="rc-virtual-list-holder"
-              style="max-height:256px;overflow-y:auto;overflow-anchor:none"
-            >
-              <div>
+            lucy
+          </div>
+        </div>
+        <div
+          class="rc-virtual-list"
+          style="position:relative"
+        >
+          <div
+            class="rc-virtual-list-holder"
+            style="max-height:256px;overflow-y:auto;overflow-anchor:none"
+          >
+            <div>
+              <div
+                class="rc-virtual-list-holder-inner"
+                style="display:flex;flex-direction:column"
+              >
                 <div
-                  class="rc-virtual-list-holder-inner"
-                  style="display:flex;flex-direction:column"
+                  aria-selected="false"
+                  class="ant-select-item ant-select-item-option ant-select-item-option-active"
+                  title="jack"
                 >
                   <div
-                    aria-selected="false"
-                    class="ant-select-item ant-select-item-option ant-select-item-option-active"
-                    title="jack"
+                    class="ant-select-item-option-content"
                   >
-                    <div
-                      class="ant-select-item-option-content"
-                    >
-                      jack
-                    </div>
-                    <span
-                      aria-hidden="true"
-                      class="ant-select-item-option-state"
-                      style="user-select:none;-webkit-user-select:none"
-                      unselectable="on"
-                    />
+                    jack
                   </div>
+                  <span
+                    aria-hidden="true"
+                    class="ant-select-item-option-state"
+                    style="user-select:none;-webkit-user-select:none"
+                    unselectable="on"
+                  />
+                </div>
+                <div
+                  aria-selected="false"
+                  class="ant-select-item ant-select-item-option"
+                  title="lucy"
+                >
                   <div
-                    aria-selected="false"
-                    class="ant-select-item ant-select-item-option"
-                    title="lucy"
+                    class="ant-select-item-option-content"
                   >
-                    <div
-                      class="ant-select-item-option-content"
-                    >
-                      lucy
-                    </div>
-                    <span
-                      aria-hidden="true"
-                      class="ant-select-item-option-state"
-                      style="user-select:none;-webkit-user-select:none"
-                      unselectable="on"
-                    />
+                    lucy
                   </div>
+                  <span
+                    aria-hidden="true"
+                    class="ant-select-item-option-state"
+                    style="user-select:none;-webkit-user-select:none"
+                    unselectable="on"
+                  />
                 </div>
               </div>
             </div>
           </div>
+        </div>
+        <div
+          class="ant-divider ant-divider-horizontal"
+          role="separator"
+          style="margin:8px 0"
+        />
+        <div
+          class="ant-space ant-space-horizontal ant-space-align-center"
+          style="padding:0 8px 4px"
+        >
           <div
-            class="ant-divider ant-divider-horizontal"
-            role="separator"
-            style="margin:4px 0"
-          />
-          <div
-            style="display:flex;flex-wrap:nowrap;padding:8px"
+            class="ant-space-item"
+            style="margin-right:8px"
           >
             <input
               class="ant-input"
-              style="flex:auto"
+              placeholder="Please enter item"
               type="text"
               value=""
             />
+          </div>
+          <div
+            class="ant-space-item"
+          >
             <a
-              style="flex:none;padding:8px;display:block;cursor:pointer"
+              class="ant-typography"
+              style="white-space:nowrap"
             >
               <span
                 aria-label="plus"
@@ -2419,7 +2428,7 @@ exports[`renders ./components/select/demo/debug.md extend context correctly 1`]
     AntDesign
   </span>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/select/__tests__/__snapshots__/demo.test.js.snap

@@ -704,7 +704,7 @@ Array [
 exports[`renders ./components/select/demo/custom-dropdown-menu.md correctly 1`] = `
 <div
   class="ant-select ant-select-single ant-select-show-arrow"
-  style="width:240px"
+  style="width:300px"
 >
   <div
     class="ant-select-selector"
@@ -1059,7 +1059,7 @@ exports[`renders ./components/select/demo/debug.md correctly 1`] = `
     AntDesign
   </span>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/select/demo/custom-dropdown-menu.md

@@ -14,63 +14,51 @@ title:
 Customize the dropdown menu via `dropdownRender`.
 
 ```jsx
-import { Select, Divider, Input } from 'antd';
+import React, { useState } from 'react';
+import { Select, Divider, Input, Typography, Space } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
 
 const { Option } = Select;
 
 let index = 0;
 
-class App extends React.Component {
-  state = {
-    items: ['jack', 'lucy'],
-    name: '',
+const App = () => {
+  const [items, setItems] = useState(['jack', 'lucy']);
+  const [name, setName] = useState('');
+
+  const onNameChange = event => {
+    setName(event.target.value);
   };
 
-  onNameChange = event => {
-    this.setState({
-      name: event.target.value,
-    });
+  const addItem = e => {
+    e.preventDefault();
+    setItems([...items, name || `New item ${index++}`]);
+    setName('');
   };
 
-  addItem = () => {
-    console.log('addItem');
-    const { items, name } = this.state;
-    this.setState({
-      items: [...items, name || `New item ${index++}`],
-      name: '',
-    });
-  };
-
-  render() {
-    const { items, name } = this.state;
-    return (
-      <Select
-        style={{ width: 240 }}
-        placeholder="custom dropdown render"
-        dropdownRender={menu => (
-          <div>
-            {menu}
-            <Divider style={{ margin: '4px 0' }} />
-            <div style={{ display: 'flex', flexWrap: 'nowrap', padding: 8 }}>
-              <Input style={{ flex: 'auto' }} value={name} onChange={this.onNameChange} />
-              <a
-                style={{ flex: 'none', padding: '8px', display: 'block', cursor: 'pointer' }}
-                onClick={this.addItem}
-              >
-                <PlusOutlined /> Add item
-              </a>
-            </div>
-          </div>
-        )}
-      >
-        {items.map(item => (
-          <Option key={item}>{item}</Option>
-        ))}
-      </Select>
-    );
-  }
-}
+  return (
+    <Select
+      style={{ width: 300 }}
+      placeholder="custom dropdown render"
+      dropdownRender={menu => (
+        <>
+          {menu}
+          <Divider style={{ margin: '8px 0' }} />
+          <Space align="center" style={{ padding: '0 8px 4px' }}>
+            <Input placeholder="Please enter item" value={name} onChange={onNameChange} />
+            <Typography.Link onClick={addItem} style={{ whiteSpace: 'nowrap' }}>
+              <PlusOutlined /> Add item
+            </Typography.Link>
+          </Space>
+        </>
+      )}
+    >
+      {items.map(item => (
+        <Option key={item}>{item}</Option>
+      ))}
+    </Select>
+  );
+};
 
 ReactDOM.render(<App />, mountNode);
 ```

components/skeleton/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -61,7 +61,7 @@ exports[`renders ./components/skeleton/demo/children.md extend context correctly
     </p>
   </div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/skeleton/__tests__/__snapshots__/demo.test.js.snap

@@ -61,7 +61,7 @@ exports[`renders ./components/skeleton/demo/children.md correctly 1`] = `
     </p>
   </div>
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/space/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -195,7 +195,7 @@ exports[`renders ./components/space/demo/base.md extend context correctly 1`] =
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -232,7 +232,7 @@ exports[`renders ./components/space/demo/base.md extend context correctly 1`] =
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -293,7 +293,7 @@ exports[`renders ./components/space/demo/base.md extend context correctly 1`] =
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -394,7 +394,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -446,7 +446,7 @@ exports[`renders ./components/space/demo/debug.md extend context correctly 1`] =
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -465,7 +465,7 @@ exports[`renders ./components/space/demo/debug.md extend context correctly 1`] =
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -526,7 +526,7 @@ exports[`renders ./components/space/demo/debug.md extend context correctly 1`] =
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -557,7 +557,7 @@ exports[`renders ./components/space/demo/debug.md extend context correctly 1`] =
       style="display:inline-block;cursor:not-allowed"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         disabled=""
         style="pointer-events:none"
         type="button"
@@ -621,7 +621,7 @@ exports[`renders ./components/space/demo/debug.md extend context correctly 1`] =
                 class="ant-popover-buttons"
               >
                 <button
-                  class="ant-btn ant-btn-sm"
+                  class="ant-btn ant-btn-default ant-btn-sm"
                   type="button"
                 >
                   <span>
@@ -803,7 +803,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -976,7 +976,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -989,7 +989,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1002,7 +1002,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1015,7 +1015,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1028,7 +1028,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1041,7 +1041,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1054,7 +1054,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1067,7 +1067,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1080,7 +1080,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1093,7 +1093,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1106,7 +1106,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1119,7 +1119,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1132,7 +1132,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1145,7 +1145,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1158,7 +1158,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1171,7 +1171,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1184,7 +1184,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1197,7 +1197,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1210,7 +1210,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1223,7 +1223,7 @@ exports[`renders ./components/space/demo/wrap.md extend context correctly 1`] =
     style="padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/space/__tests__/__snapshots__/demo.test.js.snap

@@ -195,7 +195,7 @@ exports[`renders ./components/space/demo/base.md correctly 1`] = `
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -232,7 +232,7 @@ exports[`renders ./components/space/demo/base.md correctly 1`] = `
     class="ant-space-item"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -295,7 +295,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -347,7 +347,7 @@ exports[`renders ./components/space/demo/debug.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -366,7 +366,7 @@ exports[`renders ./components/space/demo/debug.md correctly 1`] = `
     style="margin-right:8px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -383,7 +383,7 @@ exports[`renders ./components/space/demo/debug.md correctly 1`] = `
       style="display:inline-block;cursor:not-allowed"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         disabled=""
         style="pointer-events:none"
         type="button"
@@ -554,7 +554,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -727,7 +727,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -740,7 +740,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -753,7 +753,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -766,7 +766,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -779,7 +779,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -792,7 +792,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -805,7 +805,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -818,7 +818,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -831,7 +831,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -844,7 +844,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -857,7 +857,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -870,7 +870,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -883,7 +883,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -896,7 +896,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -909,7 +909,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -922,7 +922,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -935,7 +935,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -948,7 +948,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -961,7 +961,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="margin-right:8px;padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -974,7 +974,7 @@ exports[`renders ./components/space/demo/wrap.md correctly 1`] = `
     style="padding-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/steps/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1496,7 +1496,7 @@ exports[`renders ./components/steps/demo/progress.md extend context correctly 1`
 exports[`renders ./components/steps/demo/progress-debug.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1504,7 +1504,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1512,7 +1512,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1520,7 +1520,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1528,7 +1528,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1536,7 +1536,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1544,7 +1544,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/steps/__tests__/__snapshots__/demo.test.js.snap

@@ -1376,7 +1376,7 @@ exports[`renders ./components/steps/demo/progress.md correctly 1`] = `
 exports[`renders ./components/steps/demo/progress-debug.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1384,7 +1384,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1392,7 +1392,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1400,7 +1400,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1408,7 +1408,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1416,7 +1416,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -1424,7 +1424,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>

components/table/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1363,7 +1363,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md extend context c
                                   style="margin-right:8px"
                                 >
                                   <button
-                                    class="ant-btn ant-btn-sm"
+                                    class="ant-btn ant-btn-default ant-btn-sm"
                                     style="width:90px"
                                     type="button"
                                   >
@@ -1486,7 +1486,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md extend context c
                                   style="margin-right:8px"
                                 >
                                   <button
-                                    class="ant-btn ant-btn-sm"
+                                    class="ant-btn ant-btn-default ant-btn-sm"
                                     style="width:90px"
                                     type="button"
                                   >
@@ -1687,7 +1687,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.md extend context c
                                   style="margin-right:8px"
                                 >
                                   <button
-                                    class="ant-btn ant-btn-sm"
+                                    class="ant-btn ant-btn-default ant-btn-sm"
                                     style="width:90px"
                                     type="button"
                                   >
@@ -4766,7 +4766,7 @@ exports[`renders ./components/table/demo/edit-cell.md extend context correctly 1
                                   class="ant-popover-buttons"
                                 >
                                   <button
-                                    class="ant-btn ant-btn-sm"
+                                    class="ant-btn ant-btn-default ant-btn-sm"
                                     type="button"
                                   >
                                     <span>
@@ -4873,7 +4873,7 @@ exports[`renders ./components/table/demo/edit-cell.md extend context correctly 1
                                   class="ant-popover-buttons"
                                 >
                                   <button
-                                    class="ant-btn ant-btn-sm"
+                                    class="ant-btn ant-btn-default ant-btn-sm"
                                     type="button"
                                   >
                                     <span>
@@ -16425,7 +16425,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -16438,7 +16438,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -16450,7 +16450,7 @@ Array [
       class="ant-space-item"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>

components/table/__tests__/__snapshots__/demo.test.js.snap

@@ -13145,7 +13145,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -13158,7 +13158,7 @@ Array [
       style="margin-right:8px"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>
@@ -13170,7 +13170,7 @@ Array [
       class="ant-space-item"
     >
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span>

components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -594,7 +594,7 @@ exports[`renders ./components/tabs/demo/custom-add-trigger.md extend context cor
     style="margin-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -945,39 +945,54 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md extend context co
         style="transform:translate(0px, 0px)"
       >
         <div
-          class="ant-tabs-tab ant-tabs-tab-active"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="true"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab ant-tabs-tab-active"
           >
-            tab 1
+            <div
+              aria-selected="true"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 1
+            </div>
           </div>
         </div>
         <div
-          class="ant-tabs-tab"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="false"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab"
           >
-            tab 2
+            <div
+              aria-selected="false"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 2
+            </div>
           </div>
         </div>
         <div
-          class="ant-tabs-tab"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="false"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab"
           >
-            tab 3
+            <div
+              aria-selected="false"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 3
+            </div>
           </div>
         </div>
         <div
@@ -1586,7 +1601,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1693,7 +1708,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn tabs-extra-demo-button"
+          class="ant-btn ant-btn-default tabs-extra-demo-button"
           type="button"
         >
           <span>
@@ -1807,7 +1822,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>

components/tabs/__tests__/__snapshots__/demo.test.js.snap

@@ -518,7 +518,7 @@ exports[`renders ./components/tabs/demo/custom-add-trigger.md correctly 1`] = `
     style="margin-bottom:16px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -831,39 +831,54 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md correctly 1`] = `
         style="transform:translate(0px, 0px)"
       >
         <div
-          class="ant-tabs-tab ant-tabs-tab-active"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="true"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab ant-tabs-tab-active"
           >
-            tab 1
+            <div
+              aria-selected="true"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 1
+            </div>
           </div>
         </div>
         <div
-          class="ant-tabs-tab"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="false"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab"
           >
-            tab 2
+            <div
+              aria-selected="false"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 2
+            </div>
           </div>
         </div>
         <div
-          class="ant-tabs-tab"
+          class=""
+          style="margin-right:24px"
         >
           <div
-            aria-selected="false"
-            class="ant-tabs-tab-btn"
-            role="tab"
-            tabindex="0"
+            class="ant-tabs-tab"
           >
-            tab 3
+            <div
+              aria-selected="false"
+              class="ant-tabs-tab-btn"
+              role="tab"
+              tabindex="0"
+            >
+              tab 3
+            </div>
           </div>
         </div>
         <div
@@ -1396,7 +1411,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>
@@ -1503,7 +1518,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn tabs-extra-demo-button"
+          class="ant-btn ant-btn-default tabs-extra-demo-button"
           type="button"
         >
           <span>
@@ -1598,7 +1613,7 @@ Array [
         class="ant-tabs-extra-content"
       >
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span>

components/tabs/demo/custom-tab-bar-node.md

@@ -7,60 +7,55 @@ title:
 
 ## zh-CN
 
-使用 `react-dnd` 实现标签可拖拽。
+使用 `react-dnd@15+` 实现标签可拖拽。
 
 ## en-US
 
-Use `react-dnd` to make tabs draggable.
+Use `react-dnd@15+` to make tabs draggable.
 
 ```jsx
+import React, { useRef, cloneElement } from 'react';
 import { Tabs } from 'antd';
-import { DndProvider, DragSource, DropTarget } from 'react-dnd';
+import { DndProvider, useDrag, useDrop } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 
 const { TabPane } = Tabs;
 
-// Drag & Drop node
-class TabNode extends React.Component {
-  render() {
-    const { connectDragSource, connectDropTarget, children } = this.props;
+const type = 'DraggableTabNode';
 
-    return connectDragSource(connectDropTarget(children));
-  }
-}
-
-const cardTarget = {
-  drop(props, monitor) {
-    const dragKey = monitor.getItem().index;
-    const hoverKey = props.index;
-
-    if (dragKey === hoverKey) {
-      return;
-    }
-
-    props.moveTabNode(dragKey, hoverKey);
-    monitor.getItem().index = hoverKey;
-  },
+const DraggableTabNode = ({ index, children, moveNode }) => {
+  const ref = useRef();
+  const [{ isOver, dropClassName }, drop] = useDrop({
+    accept: type,
+    collect: monitor => {
+      const { index: dragIndex } = monitor.getItem() || {};
+      if (dragIndex === index) {
+        return {};
+      }
+      return {
+        isOver: monitor.isOver(),
+        dropClassName: 'dropping',
+      };
+    },
+    drop: item => {
+      moveNode(item.index, index);
+    },
+  });
+  const [, drag] = useDrag({
+    type,
+    item: { index },
+    collect: monitor => ({
+      isDragging: monitor.isDragging(),
+    }),
+  });
+  drop(drag(ref));
+  return (
+    <div ref={ref} style={{ marginRight: 24 }} className={isOver ? dropClassName : ''}>
+      {children}
+    </div>
+  );
 };
 
-const cardSource = {
-  beginDrag(props) {
-    return {
-      id: props.id,
-      index: props.index,
-    };
-  },
-};
-
-const WrapTabNode = DropTarget('DND_NODE', cardTarget, connect => ({
-  connectDropTarget: connect.dropTarget(),
-}))(
-  DragSource('DND_NODE', cardSource, (connect, monitor) => ({
-    connectDragSource: connect.dragSource(),
-    isDragging: monitor.isDragging(),
-  }))(TabNode),
-);
-
 class DraggableTabs extends React.Component {
   state = {
     order: [],
@@ -90,9 +85,9 @@ class DraggableTabs extends React.Component {
   renderTabBar = (props, DefaultTabBar) => (
     <DefaultTabBar {...props}>
       {node => (
-        <WrapTabNode key={node.key} index={node.key} moveTabNode={this.moveTabNode}>
+        <DraggableTabNode key={node.key} index={node.key} moveNode={this.moveTabNode}>
           {node}
-        </WrapTabNode>
+        </DraggableTabNode>
       )}
     </DefaultTabBar>
   );
@@ -151,3 +146,10 @@ ReactDOM.render(
   mountNode,
 );
 ```
+
+```css
+.dropping {
+  background: #fefefe;
+  transition: all 0.3s;
+}
+```

components/tag/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -528,7 +528,7 @@ Array [
   </span>,
   <br />,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     type="button"
   >
     <span>

components/tag/__tests__/__snapshots__/demo.test.js.snap

@@ -528,7 +528,7 @@ Array [
   </span>,
   <br />,
   <button
-    class="ant-btn ant-btn-sm"
+    class="ant-btn ant-btn-default ant-btn-sm"
     type="button"
   >
     <span>

components/tooltip/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/tooltip/demo/arrow-point-at-center.md extend context correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -35,7 +35,7 @@ Array [
     </div>
   </div>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -74,7 +74,7 @@ exports[`renders ./components/tooltip/demo/auto-adjust-overflow.md extend contex
   style="overflow:hidden;position:relative;padding:24px;border:1px solid #e9e9e9"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -107,7 +107,7 @@ exports[`renders ./components/tooltip/demo/auto-adjust-overflow.md extend contex
   </div>
   <br />
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -187,7 +187,7 @@ Array [
   </div>,
   <div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -219,7 +219,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -251,7 +251,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -283,7 +283,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -315,7 +315,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -347,7 +347,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -379,7 +379,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -411,7 +411,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -443,7 +443,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -475,7 +475,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -507,7 +507,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -539,7 +539,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -571,7 +571,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -615,7 +615,7 @@ Array [
   </div>,
   <div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -649,7 +649,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -683,7 +683,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -717,7 +717,7 @@ Array [
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -794,7 +794,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -828,7 +828,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -862,7 +862,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -900,7 +900,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -934,7 +934,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -968,7 +968,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1006,7 +1006,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1040,7 +1040,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1074,7 +1074,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1112,7 +1112,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1146,7 +1146,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -1180,7 +1180,7 @@ exports[`renders ./components/tooltip/demo/placement.md extend context correctly
       </div>
     </div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/tooltip/__tests__/__snapshots__/demo.test.js.snap

@@ -3,7 +3,7 @@
 exports[`renders ./components/tooltip/demo/arrow-point-at-center.md correctly 1`] = `
 Array [
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -11,7 +11,7 @@ Array [
     </span>
   </button>,
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -26,7 +26,7 @@ exports[`renders ./components/tooltip/demo/auto-adjust-overflow.md correctly 1`]
   style="overflow:hidden;position:relative;padding:24px;border:1px solid #e9e9e9"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -35,7 +35,7 @@ exports[`renders ./components/tooltip/demo/auto-adjust-overflow.md correctly 1`]
   </button>
   <br />
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     type="button"
   >
     <span>
@@ -65,7 +65,7 @@ Array [
   </div>,
   <div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -73,7 +73,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -81,7 +81,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -89,7 +89,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -97,7 +97,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -105,7 +105,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -113,7 +113,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -121,7 +121,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -129,7 +129,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -137,7 +137,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -145,7 +145,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -153,7 +153,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -161,7 +161,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -181,7 +181,7 @@ Array [
   </div>,
   <div>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -189,7 +189,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -197,7 +197,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -205,7 +205,7 @@ Array [
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -230,7 +230,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
     style="margin-left:70px;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -238,7 +238,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -246,7 +246,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -258,7 +258,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
     style="width:70px;float:left"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -266,7 +266,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -274,7 +274,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -286,7 +286,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
     style="width:70px;margin-left:304px"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -294,7 +294,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -302,7 +302,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -314,7 +314,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
     style="margin-left:70px;clear:both;white-space:nowrap"
   >
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -322,7 +322,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>
@@ -330,7 +330,7 @@ exports[`renders ./components/tooltip/demo/placement.md correctly 1`] = `
       </span>
     </button>
     <button
-      class="ant-btn"
+      class="ant-btn ant-btn-default"
       type="button"
     >
       <span>

components/tooltip/__tests__/__snapshots__/tooltip.test.js.snap

@@ -8,7 +8,7 @@ exports[`Tooltip should hide when mouse leave antd disabled component Button 1`]
   style="display: inline-block; cursor: not-allowed;"
 >
   <button
-    class="ant-btn"
+    class="ant-btn ant-btn-default"
     disabled=""
     style="pointer-events: none;"
     type="button"

components/transfer/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -302,7 +302,7 @@ exports[`renders ./components/transfer/demo/advanced.md extend context correctly
       class="ant-transfer-list-footer"
     >
       <button
-        class="ant-btn ant-btn-sm"
+        class="ant-btn ant-btn-default ant-btn-sm"
         style="float:left;margin:5px"
         type="button"
       >
@@ -670,7 +670,7 @@ exports[`renders ./components/transfer/demo/advanced.md extend context correctly
       class="ant-transfer-list-footer"
     >
       <button
-        class="ant-btn ant-btn-sm"
+        class="ant-btn ant-btn-default ant-btn-sm"
         style="float:right;margin:5px"
         type="button"
       >

components/transfer/__tests__/__snapshots__/demo.test.js.snap

@@ -173,7 +173,7 @@ exports[`renders ./components/transfer/demo/advanced.md correctly 1`] = `
       class="ant-transfer-list-footer"
     >
       <button
-        class="ant-btn ant-btn-sm"
+        class="ant-btn ant-btn-default ant-btn-sm"
         style="float:left;margin:5px"
         type="button"
       >
@@ -412,7 +412,7 @@ exports[`renders ./components/transfer/demo/advanced.md correctly 1`] = `
       class="ant-transfer-list-footer"
     >
       <button
-        class="ant-btn ant-btn-sm"
+        class="ant-btn ant-btn-default ant-btn-sm"
         style="float:right;margin:5px"
         type="button"
       >

components/tree/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -3627,7 +3627,7 @@ exports[`renders ./components/tree/demo/search.md extend context correctly 1`] =
         class="ant-input-group-addon"
       >
         <button
-          class="ant-btn ant-btn-icon-only ant-input-search-button"
+          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
           type="button"
         >
           <span

components/tree/__tests__/__snapshots__/demo.test.js.snap

@@ -3627,7 +3627,7 @@ exports[`renders ./components/tree/demo/search.md correctly 1`] = `
         class="ant-input-group-addon"
       >
         <button
-          class="ant-btn ant-btn-icon-only ant-input-search-button"
+          class="ant-btn ant-btn-default ant-btn-icon-only ant-input-search-button"
           type="button"
         >
           <span

components/typography/Base/Ellipsis.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import toArray from 'rc-util/lib/Children/toArray';
+import useIsomorphicLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
 
 export interface EllipsisProps {
   enabledMeasure?: boolean;
@@ -93,20 +94,20 @@ const Ellipsis = ({ enabledMeasure, children, text, width, rows, onEllipsis }: E
   }, [enabledMeasure, walkingState, children, nodeList, midLen, totalLen]);
 
   // ======================== Walk ========================
-  React.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (enabledMeasure && width && totalLen) {
       setWalkingState(PREPARE);
       setCutLength([0, Math.ceil(totalLen / 2), totalLen]);
     }
   }, [enabledMeasure, width, text, totalLen, rows]);
 
-  React.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (walkingState === PREPARE) {
       setSingleRowHeight(singleRowRef.current?.offsetHeight || 0);
     }
   }, [walkingState]);
 
-  React.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (singleRowHeight) {
       if (walkingState === PREPARE) {
         // Ignore if position is enough
@@ -193,7 +194,7 @@ const Ellipsis = ({ enabledMeasure, children, text, width, rows, onEllipsis }: E
         walkingState !== DONE_WITHOUT_ELLIPSIS && (
           <>
             {/* `l` for top & `g` for bottom measure */}
-            {renderMeasure('lg', singleRowRef, { width: 9999 })}
+            {renderMeasure('lg', singleRowRef, { wordBreak: 'keep-all', whiteSpace: 'nowrap' })}
             {/* {renderMeasureSlice(midLen, midRowRef)} */}
             {walkingState === PREPARE
               ? renderMeasure(children(nodeList, false), midRowRef, measureStyle)

components/typography/Base/index.tsx

@@ -10,6 +10,7 @@ import CheckOutlined from '@ant-design/icons/CheckOutlined';
 import CopyOutlined from '@ant-design/icons/CopyOutlined';
 import ResizeObserver from 'rc-resize-observer';
 import { AutoSizeType } from 'rc-textarea/lib/ResizableTextArea';
+import useIsomorphicLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
 import { ConfigContext } from '../../config-provider';
 import { useLocaleReceiver } from '../../locale-provider/LocaleReceiver';
 import TransButton from '../../_util/transButton';
@@ -168,8 +169,8 @@ const Base = React.forwardRef((props: InternalBlockProps, ref: any) => {
     }
   }, [editing]);
 
-  const onEditClick = (e: React.MouseEvent<HTMLDivElement>) => {
-    e.preventDefault();
+  const onEditClick = (e?: React.MouseEvent<HTMLDivElement>) => {
+    e?.preventDefault();
     triggerEdit(true);
   };
 
@@ -192,8 +193,9 @@ const Base = React.forwardRef((props: InternalBlockProps, ref: any) => {
     clearTimeout(copyIdRef.current!);
   };
 
-  const onCopyClick = (e: React.MouseEvent<HTMLDivElement>) => {
-    e.preventDefault();
+  const onCopyClick = (e?: React.MouseEvent<HTMLDivElement>) => {
+    e?.preventDefault();
+    e?.stopPropagation();
 
     if (copyConfig.text === undefined) {
       copyConfig.text = String(children);
@@ -243,7 +245,7 @@ const Base = React.forwardRef((props: InternalBlockProps, ref: any) => {
     [mergedEnableEllipsis, ellipsisConfig, enableEdit, enableCopy],
   );
 
-  React.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (enableEllipsis && !needMeasureEllipsis) {
       setIsLineClampSupport(isStyleSupport('webkitLineClamp'));
       setIsTextOverflowSupport(isStyleSupport('textOverflow'));

components/typography/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -237,7 +237,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -259,7 +259,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -288,7 +288,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -455,7 +455,7 @@ Array [
      case. Bnt Design, a design language for background applications, is refined by Ant UED Team. Cnt Design, a design language for background applications, is refined by Ant UED Team. Dnt Design, a design language for background applications, is refined by Ant UED Team. Ent Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -529,7 +529,7 @@ Array [
     </div>
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -604,7 +604,7 @@ Array [
       not ellipsis
       <span
         aria-hidden="true"
-        style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+        style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
       >
         lg
       </span>
@@ -633,7 +633,7 @@ exports[`renders ./components/typography/demo/ellipsis-middle.md extend context
   In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency ofdevelopment.
   <span
     aria-hidden="true"
-    style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+    style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
   >
     lg
   </span>
@@ -1593,7 +1593,7 @@ Array [
     To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life--William Shakespeare
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>

components/typography/__tests__/__snapshots__/demo.test.js.snap

@@ -237,7 +237,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -259,7 +259,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -288,7 +288,7 @@ Array [
     Ant Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -407,7 +407,7 @@ Array [
      case. Bnt Design, a design language for background applications, is refined by Ant UED Team. Cnt Design, a design language for background applications, is refined by Ant UED Team. Dnt Design, a design language for background applications, is refined by Ant UED Team. Ent Design, a design language for background applications, is refined by Ant UED Team.
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -457,7 +457,7 @@ Array [
     </div>
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>
@@ -508,7 +508,7 @@ Array [
       not ellipsis
       <span
         aria-hidden="true"
-        style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+        style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
       >
         lg
       </span>
@@ -537,7 +537,7 @@ exports[`renders ./components/typography/demo/ellipsis-middle.md correctly 1`] =
   In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency ofdevelopment.
   <span
     aria-hidden="true"
-    style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+    style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
   >
     lg
   </span>
@@ -1213,7 +1213,7 @@ Array [
     To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life--William Shakespeare
     <span
       aria-hidden="true"
-      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;width:9999px"
+      style="position:fixed;display:block;left:0;top:0;z-index:-9999;visibility:hidden;pointer-events:none;word-break:keep-all;white-space:nowrap"
     >
       lg
     </span>

components/typography/__tests__/copy.test.tsx

@@ -193,5 +193,18 @@ describe('Typography copy', () => {
         tooltipLength: 0,
       });
     });
+
+    it('copy click event stopPropagation', () => {
+      const onDivClick = jest.fn();
+      const wrapper = mount(
+        <div onClick={onDivClick}>
+          <Base component="p" copyable>
+            test copy
+          </Base>
+        </div>,
+      );
+      wrapper.find('.ant-typography-copy').first().simulate('click');
+      expect(onDivClick).not.toBeCalled();
+    });
   });
 });

components/typography/__tests__/enter-key-callback.test.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import KeyCode from 'rc-util/lib/KeyCode';
+import Paragraph from '../Paragraph';
+
+test('Callback on enter key is triggered', () => {
+  const onEditStart = jest.fn();
+  const onCopy = jest.fn();
+
+  const wrapper = mount(
+    <Paragraph
+      copyable={{
+        onCopy,
+      }}
+      editable={{
+        onStart: onEditStart,
+      }}
+    >
+      test
+    </Paragraph>,
+  );
+  const timer: any = 9527;
+  jest.spyOn(window, 'setTimeout').mockReturnValue(timer);
+  jest.spyOn(window, 'clearTimeout');
+  // must copy first, because editing button will hide copy button
+  wrapper.find('.ant-typography-copy').at(0).simulate('keyup', { keyCode: KeyCode.ENTER });
+  wrapper.find('.anticon-edit').at(0).simulate('keyup', { keyCode: KeyCode.ENTER });
+
+  expect(onEditStart.mock.calls.length).toBe(1);
+  expect(onCopy.mock.calls.length).toBe(1);
+  jest.restoreAllMocks();
+});

components/upload/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -70,7 +70,7 @@ exports[`renders ./components/upload/demo/basic.md extend context correctly 1`]
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -242,7 +242,7 @@ exports[`renders ./components/upload/demo/customize-progress-bar.md extend conte
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -294,7 +294,7 @@ exports[`renders ./components/upload/demo/defaultFileList.md extend context corr
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -607,7 +607,7 @@ exports[`renders ./components/upload/demo/directory.md extend context correctly
         webkitdirectory="webkitdirectory"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -720,7 +720,7 @@ exports[`renders ./components/upload/demo/drag-sorting.md extend context correct
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -1924,7 +1924,7 @@ exports[`renders ./components/upload/demo/fileList.md extend context correctly 1
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -2063,7 +2063,7 @@ exports[`renders ./components/upload/demo/max-count.md extend context correctly
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -2117,7 +2117,7 @@ exports[`renders ./components/upload/demo/max-count.md extend context correctly
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -2772,7 +2772,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -3007,7 +3007,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -3244,7 +3244,7 @@ exports[`renders ./components/upload/demo/preview-file.md extend context correct
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3296,7 +3296,7 @@ exports[`renders ./components/upload/demo/transform-file.md extend context corre
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3348,7 +3348,7 @@ exports[`renders ./components/upload/demo/upload-custom-action-icon.md extend co
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3678,7 +3678,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -3741,7 +3741,7 @@ exports[`renders ./components/upload/demo/upload-png-only.md extend context corr
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3819,7 +3819,7 @@ exports[`renders ./components/upload/demo/upload-with-aliyun-oss.md extend conte
                   type="file"
                 />
                 <button
-                  class="ant-btn"
+                  class="ant-btn ant-btn-default"
                   type="button"
                 >
                   <span

components/upload/__tests__/__snapshots__/demo.test.js.snap

@@ -70,7 +70,7 @@ exports[`renders ./components/upload/demo/basic.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -242,7 +242,7 @@ exports[`renders ./components/upload/demo/customize-progress-bar.md correctly 1`
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -294,7 +294,7 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -583,7 +583,7 @@ exports[`renders ./components/upload/demo/directory.md correctly 1`] = `
         webkitdirectory="webkitdirectory"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -696,7 +696,7 @@ exports[`renders ./components/upload/demo/drag-sorting.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -1804,7 +1804,7 @@ exports[`renders ./components/upload/demo/fileList.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -1943,7 +1943,7 @@ exports[`renders ./components/upload/demo/max-count.md correctly 1`] = `
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -1997,7 +1997,7 @@ exports[`renders ./components/upload/demo/max-count.md correctly 1`] = `
             type="file"
           />
           <button
-            class="ant-btn"
+            class="ant-btn ant-btn-default"
             type="button"
           >
             <span
@@ -2628,7 +2628,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -2839,7 +2839,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -3052,7 +3052,7 @@ exports[`renders ./components/upload/demo/preview-file.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3104,7 +3104,7 @@ exports[`renders ./components/upload/demo/transform-file.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3156,7 +3156,7 @@ exports[`renders ./components/upload/demo/upload-custom-action-icon.md correctly
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3462,7 +3462,7 @@ Array [
           type="file"
         />
         <button
-          class="ant-btn"
+          class="ant-btn ant-btn-default"
           type="button"
         >
           <span
@@ -3525,7 +3525,7 @@ exports[`renders ./components/upload/demo/upload-png-only.md correctly 1`] = `
         type="file"
       />
       <button
-        class="ant-btn"
+        class="ant-btn ant-btn-default"
         type="button"
       >
         <span
@@ -3603,7 +3603,7 @@ exports[`renders ./components/upload/demo/upload-with-aliyun-oss.md correctly 1`
                   type="file"
                 />
                 <button
-                  class="ant-btn"
+                  class="ant-btn ant-btn-default"
                   type="button"
                 >
                   <span

docs/react/practical-projects.en-US.md

@@ -100,7 +100,34 @@ export default ProductList;
 
 The file name corresponds to the name of the final model, and you can consume the data in the model through the API provided by the plug-in.
 
-Let's take a simple table as an example. First you need to create a new file `src/models/useProductList.ts`.
+Let's take a simple table as an example. First we create a new file `src/services/product.ts` for remote API.
+
+```tsx
+/*
+export function queryProductList() {
+  return fetch('/api/products').then(res => res.json());
+}
+*/
+// mock request service by setTimeout
+export function queryProductList() {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve([
+        {
+          id: 1,
+          name: 'dva',
+        },
+        {
+          id: 2,
+          name: 'antd',
+        },
+      ]);
+    }, 2000);
+  });
+}
+```
+
+Then you need to create a new file `src/models/useProductList.ts`.
 
 ```tsx
 import { useRequest } from 'umi';

docs/react/practical-projects.zh-CN.md

@@ -97,7 +97,34 @@ export default ProductList;
 
 文件名则对应最终 model 的 name，你可以通过插件提供的 API 来消费 model 中的数据。
 
-我们以一个简单的表格作为示例。首先需要新建文件 `src/models/useProductList.ts`。
+我们以一个简单的表格作为示例。首先新建一个 `src/services/product.ts` 存放产品相关的接口。
+
+```tsx
+/*
+export function queryProductList() {
+  return fetch('/api/products').then(res => res.json());
+}
+*/
+// 先用 setTimeout 模拟一个请求，正常的写法如上所示
+export function queryProductList() {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve([
+        {
+          id: 1,
+          name: 'dva',
+        },
+        {
+          id: 2,
+          name: 'antd',
+        },
+      ]);
+    }, 2000);
+  });
+}
+```
+
+然后新建文件 `src/models/useProductList.ts`。
 
 ```tsx
 import { useRequest } from 'umi';

package.json

@@ -1,6 +1,6 @@
 {
   "name": "antd",
-  "version": "4.18.6",
+  "version": "4.18.7",
   "description": "An enterprise-class UI design language and React components implementation",
   "title": "Ant Design",
   "keywords": [
@@ -247,8 +247,8 @@
     "react": "^17.0.1",
     "react-color": "^2.17.3",
     "react-copy-to-clipboard": "^5.0.1",
-    "react-dnd": "^14.0.1",
-    "react-dnd-html5-backend": "^14.0.0",
+    "react-dnd": "^15.0.0",
+    "react-dnd-html5-backend": "^15.0.0",
     "react-dom": "^17.0.1",
     "react-draggable": "^4.4.3",
     "react-fast-marquee": "^1.2.1",