docs: 4.24.9 changelog (#41887 )

* docs: 4.24.9 changelog * docs: update changelog * docs: update changelog * docs: update changelog
chore: 4.x 更新 rc-checkbox, 无新功能 (#41888 )
2026-02-09 10:59:19 +08:00 · 2023-04-20 11:43:59 +08:00 · 2023-04-19 17:41:55 +08:00 · 2023-04-19 15:49:47 +08:00 · 2023-04-17 17:33:32 +08:00 · 2023-04-07 23:47:23 +08:00
197 changed files with 10597 additions and 5004 deletions
--- a/.antd-tools.config.js
+++ b/.antd-tools.config.js
@@ -20,7 +20,7 @@ function finalizeCompile() {
    let componentsLessContent = '';
    // Build components in one file: lib/style/components.less
    fs.readdir(componentsPath, (err, files) => {
-      files.forEach(file => {
+      files.forEach((file) => {
        if (fs.existsSync(path.join(componentsPath, file, 'style', 'index.less'))) {
          componentsLessContent += `@import "../${path.posix.join(
            file,
@@ -192,4 +192,5 @@ module.exports = {
  },
  generateThemeFileContent,
  bail: true,
+  tag: 'latest-4',
 };
--- a/.github/workflows/codeball.yml
+++ b/.github/workflows/codeball.yml
@@ -1,21 +0,0 @@
-name: Codeball
-on:
-  pull_request: {}
-  pull_request_review_comment:
-    types: [created, edited]
-
-jobs:
-  codeball_job:
-    runs-on: ubuntu-latest
-    name: Codeball
-    steps:
-      # Run Codeball on all new Pull Requests and Review Comments! 🚀
-      # For customizations and more documentation, see https://github.com/sturdy-dev/codeball-action
-      - name: Codeball
-        uses: sturdy-dev/codeball-action@v2
-        with:
-          # Settings for "Codeball Approver"
-          approvePullRequests: "false"
-          labelPullRequestsWhenApproved: "true"
-          labelPullRequestsWhenReviewNeeded: "true"
-          failJobsWhenReviewNeeded: "false"
--- a/.github/workflows/compressed-size.yml
+++ b/.github/workflows/compressed-size.yml
@@ -1,31 +0,0 @@
-name: 📦 Compressed Size
-
-on:
-  pull_request:
-    types: [opened, synchronize]
-
-# Cancel prev CI if new commit come
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
-jobs:
-  compressed-size:
-    permissions:
-      contents: read  # for actions/checkout to fetch code
-      pull-requests: write  # for preactjs/compressed-size-action to create PR comments
-    runs-on: ubuntu-latest
-    env:
-      CI_JOB_NUMBER: 1
-
-    steps:
-    - uses: actions/checkout@v3
-    - uses: preactjs/compressed-size-action@v2
-      with:
-        repo-token: "${{ secrets.GITHUB_TOKEN }}"
-        pattern: "./dist/**/*.min.{js,css}"
-        build-script: "dist:esbuild-no-dup-check"
-        clean-script: "clean-lockfiles"
--- a/.github/workflows/preview-build.yml
+++ b/.github/workflows/preview-build.yml
@@ -57,6 +57,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
--- a/.github/workflows/release-helper.yml
+++ b/.github/workflows/release-helper.yml
@@ -23,9 +23,11 @@ jobs:
      - name: release antd
        uses: actions-cool/release-helper@v2
        with:
-          triger: 'tag'
+          trigger: 'tag'
          changelogs: 'CHANGELOG.en-US.md, CHANGELOG.zh-CN.md'
-          branch: 'master'
+          branch: 'master, 4.x-stable'
+          tag: '5*, 4*'
+          latest: '5*'
          dingding-token: ${{ secrets.DINGDING_BOT_TOKEN }}
          dingding-msg: 'CHANGELOG.zh-CN.md'
          msg-title: '# Ant Design {{v}} 发布日志'
@@ -34,27 +36,19 @@ jobs:
          prettier: true
          prerelease-filter: '-, a, b, A, B'

-      - name: notice next
-        uses: actions-cool/release-helper@v2
-        with:
-          triger: 'tag'
-          dingding-token: ${{ secrets.DINGDING_BOT_V5_PRE_TOKEN }}
-          msg-title: '# Ant Design {{v}} 发布日志'
-          msg-poster: 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*zx7LTI_ECSAAAAAAAAAAAABkARQnAQ'
-          msg-footer: '💬 前往 [**Ant Design Releases**]({{url}}) 查看更新日志'
-          prerelease-filter: '-, a, b, A, B'
-          prerelease-notice: true
-
      - name: notice bigfish
        uses: actions-cool/release-helper@v2
        with:
-          triger: 'tag'
+          trigger: 'tag'
          changelogs: 'CHANGELOG.en-US.md, CHANGELOG.zh-CN.md'
-          branch: 'master'
-          dingding-token: ${{ secrets.DINGDING_BOT_BIGFISH_TOKEN }} ${{ secrets.DINGDING_BOT_YUNFENGDIE_TOKEN }}
+          branch: 'master, 4.x-stable'
+          tag: '5*, 4*'
+          latest: '5*'
+          dingding-token: ${{ secrets.DINGDING_BOT_BIGFISH_TOKEN }} ${{ secrets.DINGDING_BOT_BIGFISH_2_TOKEN }} ${{ secrets.DINGDING_BOT_YUNFENGDIE_TOKEN }}
          dingding-msg: 'CHANGELOG.zh-CN.md'
          dingding-delay-minute: 10
          release: false
+          conch-tag: 'conch-v5, conch'
          antd-conch-msg: '🐟 当前 Bigfish 内嵌 antd 版本：'
          msg-title: '# Ant Design {{v}} 发布日志'
          msg-poster: 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*zx7LTI_ECSAAAAAAAAAAAABkARQnAQ'
--- a/.github/workflows/site-deploy.yml
+++ b/.github/workflows/site-deploy.yml
@@ -10,7 +10,7 @@ permissions:
 jobs:
  setup:
    runs-on: ubuntu-latest
-    if: github.event.ref_type == 'tag' && (contains(github.event.ref, '-') == false)
+    if: github.event.ref_type == 'tag' && (contains(github.event.ref, '-') == false || startsWith(github.event.ref, '4.'))
    steps:
      - name: checkout
        uses: actions/checkout@v3
@@ -66,5 +66,6 @@ jobs:
      - name: deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
-          deploy_key: ${{ secrets.ACTIONS_DEPLOY_KEY }}
+          deploy_key: ${{ secrets.SITE_4X_DEPLOY_KEY }}
+          external_repository: ant-design/4x.ant.design
          publish_dir: ./_site
--- a/.github/workflows/size-limit.yml
+++ b/.github/workflows/size-limit.yml
@@ -1,4 +1,4 @@
-name: 📦 Compressed Size(size-limit)
+name: 📦 Size Limit

 on:
  pull_request:
@@ -13,19 +13,53 @@ permissions:
  contents: read

 jobs:
-  compressed-size:
+  size:
    permissions:
-      contents: read  # for actions/checkout to fetch code
-      pull-requests: write  # for preactjs/compressed-size-action to create PR comments
+      contents: read
+      pull-requests: write
    runs-on: ubuntu-latest
    env:
      CI_JOB_NUMBER: 1

    steps:
-    - uses: actions/checkout@v3
-    - uses: andresz1/size-limit-action@v1
-      with:
-        repo-token: "${{ secrets.GITHUB_TOKEN }}"
-        pattern: "./dist/**/*.min.{js,css}"
-        build-script: "dist:esbuild-no-dup-check"
-        clean-script: "clean-lockfiles"
+      - name: checkout
+        uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: cache package-lock.json
+        uses: actions/cache@v3
+        with:
+          path: package-temp-dir
+          key: lock-${{ github.sha }}
+
+      - name: create package-lock.json
+        run: npm i --package-lock-only --ignore-scripts
+
+      - name: hack for single file
+        run: |
+          if [ ! -d "package-temp-dir" ]; then
+            mkdir package-temp-dir
+          fi
+          cp package-lock.json package-temp-dir
+      - name: cache node_modules
+        id: node_modules_cache_id
+        uses: actions/cache@v3
+        with:
+          path: node_modules
+          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+
+      - name: install
+        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
+        run: npm ci
+
+      - name: size-limit
+        uses: ant-design/size-limit-action@master
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          build_script: dist
+          skip_step: install
+        env:
+          NODE_OPTIONS: --max_old_space_size=4096
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -19,6 +19,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: cache package-lock.json
        uses: actions/cache@v3
        with:
@@ -51,6 +55,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -73,6 +81,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -95,6 +107,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -119,6 +135,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -151,6 +171,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -189,6 +213,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -244,6 +272,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -323,7 +355,11 @@ jobs:
    runs-on: ubuntu-latest
    needs: [normal-test]
    steps:
-      - uses: actions/checkout@v3
+      - name: checkout
+        uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
      - uses: actions/download-artifact@v3
        with:
          name: coverage-artifacts
@@ -346,6 +382,10 @@ jobs:
      - name: checkout
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        uses: actions/cache@v3
        with:
@@ -393,6 +433,10 @@ jobs:
        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
        uses: actions/checkout@v3

+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
      - name: restore cache from package-lock.json
        # lib only run in master branch not in pull request
        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
--- a/.gitignore
+++ b/.gitignore
@@ -61,6 +61,9 @@ site/theme/template/NotFound.jsx
 scripts/previewEditor/index.html
 components/version/version.tsx
 components/version/token.tsx
+.dumi
+components/version/token-meta.json
+components/version/token.json

 # Image snapshot diff
 __diff_output__/
--- a/CHANGELOG.en-US.md
+++ b/CHANGELOG.en-US.md
@@ -15,6 +15,80 @@ timeline: true

 ---

+## 4.24.9
+
+`2023-04-19`
+
+- 🆕 Slider add missing `railStyle` for custom style. [#40942](https://github.com/ant-design/ant-design/pull/40942) [@c01nd01r](https://github.com/c01nd01r)
+- 🐞 Fix Select width becomes 0px when search after select something. [#41646](https://github.com/ant-design/ant-design/pull/41646)
+- 🐞 The `displayRender` prompt cannot be used when deleting `multiple`. [#40940](https://github.com/ant-design/ant-design/pull/40940) [@crazyair](https://github.com/crazyair)
+- 💄 Checkbox should use @border-radius-sm. [#40823](https://github.com/ant-design/ant-design/pull/40823)
+- 🐞 Fix TextArea missing active style when focused. [#41281](https://github.com/ant-design/ant-design/pull/41281) [@MuxinFeng](https://github.com/MuxinFeng)
+- 🛠 Adjust Checkbox to remove `checked` when unchecked. [#41888](https://github.com/ant-design/ant-design/pull/41888)
+- TypeScript
+  - 🤖 Adjust CascaderProps definition which has default generic now. [#40960](https://github.com/ant-design/ant-design/pull/40960) [@crazyair](https://github.com/crazyair)
+
+## 4.24.8
+
+`2023-02-13`
+
+- 🐞 Fix Tabs that throw error in some cases. [df09516](https://github.com/ant-design/ant-design/commit/df09516ee542159eb3fa40927eec8981d4581bd0)
+- 🌐 Add missing translation for `pt_BR`. [#40019](https://github.com/ant-design/ant-design/pull/40019) [@rafaelncarvalho](https://github.com/rafaelncarvalho)
+- TypeScript
+  - 🤖 Fix `CompoundedComponent` type error from external module. [#39058](https://github.com/ant-design/ant-design/pull/39058) [@wangcch](https://github.com/wangcch)
+
+## 4.24.7
+
+`2022-12-30`
+
+- 🐞 Fix Tabs slider that cannot resize. [#39867](https://github.com/ant-design/ant-design/pull/39867)
+- 🐞 Fix Input text is missing when `suffix` is applied in Safari. [#39830](https://github.com/ant-design/ant-design/pull/39830) [@ifujustayup](https://github.com/ifujustayup)
+
+## 4.24.6
+
+`2022-12-26`
+
+- 🆕 Dropdown support `autoAdjustOverflow`. [#39741](https://github.com/ant-design/ant-design/pull/39741)
+- 🐞 Fix `justify` and `align` properties are not reactive for Row. [#39706](https://github.com/ant-design/ant-design/pull/39706) [@candy4290](https://github.com/candy4290)
+- 🐞 Fix Drawer that could not be close with `open={false}`. [#39561](https://github.com/ant-design/ant-design/pull/39561)
+- 🐞 Fix Divider `horizontal` align issue in flex layout. [#39334](https://github.com/ant-design/ant-design/pull/39334)
+- 💄 Fix `Dropdown` component dange and disabled style priority issue. [#39434](https://github.com/ant-design/ant-design/pull/39434) [@Wxh16144](https://github.com/Wxh16144)
+- ⌨️ Reset aria-label in Table column. [#39747](https://github.com/ant-design/ant-design/pull/39747) [@kiner-tang](https://github.com/kiner-tang)
+- 🌐 Localization
+  - 🇺🇿 Add uz_UZ locale. [#39353](https://github.com/ant-design/ant-design/pull/39353) [@nodkz](https://github.com/nodkz)
+
+## 4.24.5
+
+`2022-12-05`
+
+- 🐞 Fix Menu.Item with `disabled` not prevent a element clickable. [aa8d7f5](https://github.com/ant-design/ant-design/commit/aa8d7f5) [@二货机器人](https://github.com/二货机器人)
+- 💄 Tweak Popconfirm icon position when `title` have multiple lines. [#39027](https://github.com/ant-design/ant-design/pull/39027) [@justanotheranonymoususer](https://github.com/justanotheranonymoususer)
+- 🐞 Fix Badge the color cannot be customized when `count` is `0`. [#39062](https://github.com/ant-design/ant-design/pull/39062) [@Wxh16144](https://github.com/Wxh16144)
+- 🐞 Fix Card.Meta width is not 100%. [#39039](https://github.com/ant-design/ant-design/pull/39039) [@justanotheranonymoususer](https://github.com/justanotheranonymoususer)
+- 🐞 Fix TimePicker pass to 'popupClassName' will display unexpected warning. [#39010](https://github.com/ant-design/ant-design/pull/39010) [@kiner-tang](https://github.com/kiner-tang)
+- 💄 Fix Steps set `size="small"` with progress not fully display. [#39103](https://github.com/ant-design/ant-design/pull/39103) [@Wxh16144](https://github.com/Wxh16144)
+
+## 4.24.4
+
+`2022-11-25`
+
+- Space.Compact
+  - 💄 Optimize Space.Compact style when wrapping a single child component. [#38913](https://github.com/ant-design/ant-design/pull/38913) [@foryuki](https://github.com/foryuki)
+  - 💄 Optimize Space.Compact style when wrapping Modal, Dropdown, Drawer and other components. [#38887](https://github.com/ant-design/ant-design/pull/38887) [@foryuki](https://github.com/foryuki)
+- 🆕 Mentions support `options` prop. [#38876](https://github.com/ant-design/ant-design/pull/38876) [@heiyu4585](https://github.com/heiyu4585)
+- 🐞 Fix ConfigProvider that `componentDisabled` is not work. [#38886](https://github.com/ant-design/ant-design/pull/38886) [@lidianhao123](https://github.com/lidianhao123)
+- 🐞 Fix Message that `onClose` didn't triggered when `duration` is `0`. [#38669](https://github.com/ant-design/ant-design/pull/38669) [@kiner-tang](https://github.com/kiner-tang)
+
+## 4.24.3
+
+`2022-11-17`
+
+- 🐞 Fix Typography config `prefixCls` not working. [#38586](https://github.com/ant-design/ant-design/pull/38586) [@SavelevMatthew](https://github.com/SavelevMatthew)
+- 🐞 Fix Table should not trigger sorter when pressing Enter in filter dropdown. [#38585](https://github.com/ant-design/ant-design/pull/38585)
+- 🆕 Allow Modal pass `mousePosition` to control animation origin position. [#38584](https://github.com/ant-design/ant-design/pull/38584) [@kiner-tang](https://github.com/kiner-tang)
+- 🐞 Fix Input.Search should not trigger `onSearch` while loading. [#38578](https://github.com/ant-design/ant-design/pull/38578) [@JackLiR8](https://github.com/JackLiR8)
+- 🐞 Fix Breadcrumb throw wrong `overlay` deprecated warning. [#38567](https://github.com/ant-design/ant-design/pull/38567) [@li-jia-nan](https://github.com/li-jia-nan)
+
 ## 4.24.2

 `2022-11-12`
--- a/CHANGELOG.zh-CN.md
+++ b/CHANGELOG.zh-CN.md
@@ -15,6 +15,80 @@ timeline: true

 ---

+## 4.24.9
+
+`2023-04-19`
+
+- 🆕 Slider 补充丢失的 `railStyle` 属性用于自定义样式。[#40942](https://github.com/ant-design/ant-design/pull/40942) [@c01nd01r](https://github.com/c01nd01r)
+- 🐞 修复 Select 在搜索时宽度变为 `0px` 的问题。[#41646](https://github.com/ant-design/ant-design/pull/41646)
+- 🐞 删除 `multiple` 不能使用 displayRender 提示。[#40940](https://github.com/ant-design/ant-design/pull/40940) [@crazyair](https://github.com/crazyair)
+- 💄 Checkbox 默认使用 `@border-radius-sm` 小号圆角。[#40823](https://github.com/ant-design/ant-design/pull/40823)
+- 🐞 修复 TextArea 在聚焦时丢失高亮样式的问题。[#41281](https://github.com/ant-design/ant-design/pull/41281) [@MuxinFeng](https://github.com/MuxinFeng)
+- 🛠 调整 Checkbox 行为，现在未勾选时不再会添加 `checked` 属性。[#41888](https://github.com/ant-design/ant-design/pull/41888)
+- TypeScript
+  - 🤖 调整 Cascader 的 CascaderProps 定义，为泛型提供默认值。[#40960](https://github.com/ant-design/ant-design/pull/40960) [@crazyair](https://github.com/crazyair)
+
+## 4.24.8
+
+`2023-02-13`
+
+- 🐞 修复 Tabs 组件某些情况下报错的问题。[df09516](https://github.com/ant-design/ant-design/commit/df09516ee542159eb3fa40927eec8981d4581bd0)
+- 🌐 补全 `pt_BR` 国际化。[#40019](https://github.com/ant-design/ant-design/pull/40019) [@rafaelncarvalho](https://github.com/rafaelncarvalho)
+- TypeScript
+  - 🤖 修复部分组件 `CompoundedComponent` 类型报错。[#39058](https://github.com/ant-design/ant-design/pull/39058) [@wangcch](https://github.com/wangcch)
+
+## 4.24.7
+
+`2022-12-30`
+
+- 🐞 修复 Tabs 组件滑块不能自动适应宽度的问题。[#39867](https://github.com/ant-design/ant-design/pull/39867)
+- 🐞 修复 Input 在 Safari 下使用 `suffix` 时文字内容丢失的问题。[#39830](https://github.com/ant-design/ant-design/pull/39830) [@ifujustayup](https://github.com/ifujustayup)
+
+## 4.24.6
+
+`2022-12-26`
+
+- 🆕 Dropdown 组件支持 `autoAdjustOverflow` 属性。 (#39741)[62cefca](https://github.com/ant-design/ant-design/commit/62cefca)
+- 🐞 修复 Row 组件 `justify` 和 `align` 属性，动态改变不生效的问题。[#39706](https://github.com/ant-design/ant-design/pull/39706) [@candy4290](https://github.com/candy4290)
+- 🐞 修复 Drawer 组件 `open` 为 false 时无法关闭的问题。[#39561](https://github.com/ant-design/ant-design/pull/39561)
+- 🐞 修复 Divider `horizontal` 在 flex 布局下的对齐问题。[#39334](https://github.com/ant-design/ant-design/pull/39334)
+- 💄 修复 `Dropdown` 组件 `danger` 和 `disabled` 属性同时使用样式问题。[#39434](https://github.com/ant-design/ant-design/pull/39434) [@Wxh16144](https://github.com/Wxh16144)
+- ⌨️ 重置 Table 中列的 aria-label 属性值。[#39747](https://github.com/ant-design/ant-design/pull/39747) [@kiner-tang](https://github.com/kiner-tang)
+- 🌐 国际化
+  - 🇺🇿 支持 uz_UZ 语言。[#39353](https://github.com/ant-design/ant-design/pull/39353) [@nodkz](https://github.com/nodkz)
+
+## 4.24.5
+
+`2022-12-05`
+
+- 🐞 修复 Menu.Item 配置 `disabled` 属性时其中的 a 标签仍可以点击的问题。[aa8d7f5](https://github.com/ant-design/ant-design/commit/aa8d7f5) [@二货机器人](https://github.com/二货机器人)
+- 💄 优化 Popconfirm 内容换行时的图标位置。[#39027](https://github.com/ant-design/ant-design/pull/39027) [@justanotheranonymoususer](https://github.com/justanotheranonymoususer)
+- 🐞 修复 Badge `count` 为 `0` 时无法自定义颜色问题。[#39062](https://github.com/ant-design/ant-design/pull/39062) [@Wxh16144](https://github.com/Wxh16144)
+- 🐞 修复 Card.Meta 宽度没有默认填满容器的问题。[#39039](https://github.com/ant-design/ant-design/pull/39039) [@justanotheranonymoususer](https://github.com/justanotheranonymoususer)
+- 🐞 解决当 TimePicker 传递 `popupClassName` 属性会显示异常警告的问题。[#39010](https://github.com/ant-design/ant-design/pull/39010) [@kiner-tang](https://github.com/kiner-tang)
+- 💄 修复 Steps `size="small"` 第一项带有进度时，进度条显示不全的问题。[#39103](https://github.com/ant-design/ant-design/pull/39103) [@Wxh16144](https://github.com/Wxh16144)
+
+## 4.24.4
+
+`2022-11-25`
+
+- Space.Compact
+  - 💄 优化 Space.Compact 包裹单个子组件时子组件的样式。[#38913](https://github.com/ant-design/ant-design/pull/38913) [@foryuki](https://github.com/foryuki)
+  - 💄 优化 Space.Compact 组件嵌套 Modal，Dropdown，Drawer 等组件时的样式。[#38887](https://github.com/ant-design/ant-design/pull/38887) [@foryuki](https://github.com/foryuki)
+- 🆕 Mentions 支持 `options` 数据驱动。[#38876](https://github.com/ant-design/ant-design/pull/38876) [@heiyu4585](https://github.com/heiyu4585)
+- 🐞 修复 ConfigProvider 组件 `componentDisabled` 失效问题。[#38886](https://github.com/ant-design/ant-design/pull/38886) [@lidianhao123](https://github.com/lidianhao123)
+- 🐞 修复 Message 组件 `duration` 为 `0` 时手动关闭不触发 `onClose` 的问题。[#38669](https://github.com/ant-design/ant-design/pull/38669) [@kiner-tang](https://github.com/kiner-tang)
+
+## 4.24.3
+
+`2022-11-17`
+
+- 🐞 修复 Typography 设置 `prefixCls` 不生效的问题。[#38586](https://github.com/ant-design/ant-design/pull/38586) [@SavelevMatthew](https://github.com/SavelevMatthew)
+- 🐞 修复 Table 在筛选菜单里按回车时会触发排序的问题。[#38585](https://github.com/ant-design/ant-design/pull/38585)
+- 🆕 Modal 允许透传 `mousePosition` 来控制弹框动画原点。[#38584](https://github.com/ant-design/ant-design/pull/38584) [@kiner-tang](https://github.com/kiner-tang)
+- 🐞 修复 Input.Search `loading` 时触发 `onSearch` 的问题。[#38578](https://github.com/ant-design/ant-design/pull/38578) [@JackLiR8](https://github.com/JackLiR8)
+- 🐞 修复 Breadcrumb 报出错误的 `overlay` 警告信息的问题。[#38567](https://github.com/ant-design/ant-design/pull/38567) [@li-jia-nan](https://github.com/li-jia-nan)
+
 ## 4.24.2

 `2022-11-12`
@@ -36,7 +110,7 @@ timeline: true
 - 🐞 修复 Modal.confirm 关闭中确认按钮依旧可能被触发的问题。[#38400](https://github.com/ant-design/ant-design/pull/38400)
 - 🐞 修复在 Drawer `extra` 中使用 Radio.Group 的样式问题。[#38385](https://github.com/ant-design/ant-design/pull/38385)
 - ⌨️ 修复 Table 组件 `aria-label` 出现 `[object Object]` 的问题。[#38389](https://github.com/ant-design/ant-design/pull/38389) [@kiner-tang](https://github.com/kiner-tang)
- ⌨️ Progress 组件增加 `role="progressbar"` 。[#38447](https://github.com/ant-design/ant-design/pull/38447) [@kpustakhod](https://github.com/kpustakhod)
+- ⌨️ Progress 组件增加 `role="progressbar"`。[#38447](https://github.com/ant-design/ant-design/pull/38447) [@kpustakhod](https://github.com/kpustakhod)

 ## 4.24.1

--- a/2
+++ b/2
@@ -1 +1 @@
-ant.design
+4x.ant.design
--- a/README-ja_JP.md
+++ b/README-ja_JP.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -8,7 +8,7 @@

 <div align="center">

-エンタープライズクラスのUI設計言語とReact UIライブラリです。
+エンタープライズクラスの UI 設計言語と React UI ライブラリです。

 [![CI status][github-action-image]][github-action-url] [![codecov][codecov-image]][codecov-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]

@@ -45,7 +45,7 @@

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://ant.design)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://4x.ant.design)

 [English](./README.md) | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md) | [Українською](./README-uk_UA.md) | [Spanish](./README-sp_MX.md) | 日本語

@@ -99,16 +99,16 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'

 ### TypeScript

-`antd` は TypeScript で書かれており、完全な定義がなされています。まずは [TypeScript で使う](https://ant.design/docs/react/use-in-typescript)をチェックしてください。
+`antd` は TypeScript で書かれており、完全な定義がなされています。まずは [TypeScript で使う](https://4x.ant.design/docs/react/use-in-typescript)をチェックしてください。

 ## 🌍 国際化対応

-数十の言語が `antd` でサポートされています。[i18n](https://ant.design/docs/react/i18n) を参照してください。
+数十の言語が `antd` でサポートされています。[i18n](https://4x.ant.design/docs/react/i18n) を参照してください。

 ## 🔗 リンク

- [ホームページ](https://ant.design/)
- [コンポーネントの概要](https://ant.design/components/overview)
+- [ホームページ](https://4x.ant.design/)
+- [コンポーネントの概要](https://4x.ant.design/components/overview)
 - [Ant Design Pro](http://pro.ant.design/)
 - [変更ログ](CHANGELOG.en-US.md)
 - [rc-components](http://react-component.github.io/)
@@ -122,9 +122,9 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
 - [足場マーケット](http://scaffold.ant.design)
 - [開発者向けインストラクション](https://github.com/ant-design/ant-design/wiki/Development)
 - [バージョン管理リリースノート](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://ant.design/docs/react/faq)
- バグレポート用の [CodeSandbox テンプレート](https://u.ant.design/codesandbox-repro)
- [テーマのカスタマイズ](https://ant.design/docs/react/customize-theme)
+- [FAQ](https://4x.ant.design/docs/react/faq)
+- バグレポート用の [CodeSandbox テンプレート](https://u.ant.design/codesandbox-repro-4x)
+- [テーマのカスタマイズ](https://4x.ant.design/docs/react/customize-theme)
 - [コラボレーターへの応募方法](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ 開発
--- a/README-pt_BR.md
+++ b/README-pt_BR.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -45,7 +45,7 @@ Uma solução empresarial de design e biblioteca UI para React.

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://ant.design)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://4x.ant.design)

 [English](./README.md) | Português | [简体中文](./README-zh_CN.md) | [Українською](./README-uk_UA.md) | [Spanish](./README-sp_MX.md) | [日本語](./README-ja_JP.md)

@@ -60,7 +60,7 @@ Uma solução empresarial de design e biblioteca UI para React.

 ## 🖥 Suporte aos ambientes

- Navegadores modernos e Internet Explorer 11 (com [polyfills](https://ant.design/docs/react/getting-started#Compatibility))
+- Navegadores modernos e Internet Explorer 11 (com [polyfills](https://4x.ant.design/docs/react/getting-started#Compatibility))
 - Renderização no lado do servidor (server-side)
 - [Electron](https://www.electronjs.org/)

@@ -99,16 +99,16 @@ import 'antd/dist/antd.css'; // ou 'antd/dist/antd.less'

 ### TypeScript

-Veja [Uso no Typescript](https://ant.design/docs/react/use-in-typescript).
+Veja [Uso no Typescript](https://4x.ant.design/docs/react/use-in-typescript).

 ## 🌍 Internacionalização

-Veja [i18n](https://ant.design/docs/react/i18n).
+Veja [i18n](https://4x.ant.design/docs/react/i18n).

 ## 🔗 Links

- [Página inicial](https://ant.design/)
- [Componentes](https://ant.design/components/overview)
+- [Página inicial](https://4x.ant.design/)
+- [Componentes](https://4x.ant.design/components/overview)
 - [Ant Design Pro](http://pro.ant.design/)
 - [Ant Design Charts](https://charts.ant.design)
 - [Change Log](CHANGELOG.en-US.md)
@@ -124,10 +124,10 @@ Veja [i18n](https://ant.design/docs/react/i18n).
 - [Mercado de páginas](http://scaffold.ant.design)
 - [Instruções ao desenvolvedor](https://github.com/ant-design/ant-design/wiki/Development)
 - [Versionando as notas de atualização](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://ant.design/docs/react/faq)
- [CodeSandbox Template](https://u.ant.design/codesandbox-repro) para relatório de erros
+- [FAQ](https://4x.ant.design/docs/react/faq)
+- [CodeSandbox Template](https://u.ant.design/codesandbox-repro-4x) para relatório de erros
 - [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
- [Customize Theme](https://ant.design/docs/react/customize-theme)
+- [Customize Theme](https://4x.ant.design/docs/react/customize-theme)
 - [How to Apply for Being A Collaborator](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ Desenvolvimento
--- a/README-sp_MX.md
+++ b/README-sp_MX.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -45,7 +45,7 @@ Un lenguaje de diseño de interfaz de usuario de clase empresarial y una bibliot

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://ant.design)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://4x.ant.design)

 [English](./README.md) | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md) | [Українською](./README-uk_UA.md) | Spanish | [日本語](./README-ja_JP.md)

@@ -68,7 +68,7 @@ Un lenguaje de diseño de interfaz de usuario de clase empresarial y una bibliot
 | --- | --- | --- | --- | --- |
 | IE11, Edge | últimas 2 versiones | últimas 2 versiones | últimas 2 versiones | últimas 2 versiones |

-## 📦 Instalar 
+## 📦 Instalar

 ```bash
 npm install antd
@@ -99,16 +99,16 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'

 ### TypeScript

-`antd` está escrito en TypeScript con definiciones completas, ver Usar en TypeScript [Usar en TypeScript](https://ant.design/docs/react/use-in-typescript) para comenzar.
+`antd` está escrito en TypeScript con definiciones completas, ver Usar en TypeScript [Usar en TypeScript](https://4x.ant.design/docs/react/use-in-typescript) para comenzar.

 ## 🌍 Internacionalización

-Docenas de idiomas compatibles en `antd`, ver [i18n](https://ant.design/docs/react/i18n).
+Docenas de idiomas compatibles en `antd`, ver [i18n](https://4x.ant.design/docs/react/i18n).

 ## 🔗 Enlaces

- [Página de Inicio](https://ant.design/)
- [Descripción General de los Componentes](https://ant.design/components/overview)
+- [Página de Inicio](https://4x.ant.design/)
+- [Descripción General de los Componentes](https://4x.ant.design/components/overview)
 - [Ant Design Pro](http://pro.ant.design/)
 - [Cambio de Registro](CHANGELOG.en-US.md)
 - [componentes-rc](http://react-component.github.io/)
@@ -122,9 +122,9 @@ Docenas de idiomas compatibles en `antd`, ver [i18n](https://ant.design/docs/rea
 - [Mercado Scaffold](http://scaffold.ant.design)
 - [Instrucción para Desarrolladores](https://github.com/ant-design/ant-design/wiki/Development)
 - [Nota de la Versión de Control de Versiones](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://ant.design/docs/react/faq)
- [Plantilla de CodeSandbox](https://u.ant.design/codesandbox-repro) para reportes de errores
- [Tema personalizado](https://ant.design/docs/react/customize-theme)
+- [FAQ](https://4x.ant.design/docs/react/faq)
+- [Plantilla de CodeSandbox](https://u.ant.design/codesandbox-repro-4x) para reportes de errores
+- [Tema personalizado](https://4x.ant.design/docs/react/customize-theme)
 - [Cómo Postularse para ser Colaborador](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ Desarrollo
--- a/README-uk_UA.md
+++ b/README-uk_UA.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -45,7 +45,7 @@

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://ant.design)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://4x.ant.design)

 [English](./README.md) | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md) | Українською | [Spanish](./README-sp_MX.md) | [日本語](./README-ja_JP.md)

@@ -99,16 +99,16 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'

 ### TypeScript

-`antd` написано на TypeScript із повною типізацією, вибери [Використання у TypeScript](https://ant.design/docs/react/use-in-typescript) щоб розпочати.
+`antd` написано на TypeScript із повною типізацією, вибери [Використання у TypeScript](https://4x.ant.design/docs/react/use-in-typescript) щоб розпочати.

 ## 🌍 Інтернаціоналізація

-Десятки мов підтримуються в `antd`, дивись [i18n](https://ant.design/docs/react/i18n).
+Десятки мов підтримуються в `antd`, дивись [i18n](https://4x.ant.design/docs/react/i18n).

 ## 🔗 Посилання

- [Домашня сторінка](https://ant.design/)
- [Компоненти](https://ant.design/components/overview)
+- [Домашня сторінка](https://4x.ant.design/)
+- [Компоненти](https://4x.ant.design/components/overview)
 - [Ant Design Pro](http://pro.ant.design/)
 - [Change Log](CHANGELOG.en-US.md)
 - [rc-components](http://react-component.github.io/)
@@ -122,9 +122,9 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
 - [Scaffold Market](http://scaffold.ant.design)
 - [Інструкція розробника](https://github.com/ant-design/ant-design/wiki/Development)
 - [Примітка до випуску версій](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://ant.design/docs/react/faq)
- [CodeSandbox темплейт](https://u.ant.design/codesandbox-repro) для звітів про помилки
- [Кастомізація теми](https://ant.design/docs/react/customize-theme)
+- [FAQ](https://4x.ant.design/docs/react/faq)
+- [CodeSandbox темплейт](https://u.ant.design/codesandbox-repro-4x) для звітів про помилки
+- [Кастомізація теми](https://4x.ant.design/docs/react/customize-theme)
 - [Як подати заявку на участь у програмі Співавторства](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ Розробка
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -45,7 +45,7 @@

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Ey3wTo-5__QAAAAAAAAAAABkARQnAQ)](https://ant.design/index-cn)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Ey3wTo-5__QAAAAAAAAAAABkARQnAQ)](https://4x.ant.design/index-cn)

 [English](./README.md) | [Português](./README-pt_BR.md) | 简体中文 | [Українською](./README-uk_UA.md) | [Spanish](./README-sp_MX.md) | [日本語](./README-ja_JP.md)

@@ -60,7 +60,7 @@

 ## 🖥 兼容环境

- 现代浏览器和 IE11（需要 [polyfills](https://ant.design/docs/react/getting-started-cn#兼容性)）。
+- 现代浏览器和 IE11（需要 [polyfills](https://4x.ant.design/docs/react/getting-started-cn#兼容性)）。
 - 支持服务端渲染。
 - [Electron](https://www.electronjs.org/)

@@ -99,22 +99,22 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'

 ### 🌈 定制主题

-参考 [定制主题](https://ant.design/docs/react/customize-theme-cn) 文档。
+参考 [定制主题](https://4x.ant.design/docs/react/customize-theme-cn) 文档。

 ### 🛡 TypeScript

-参考 [在 TypeScript 中使用](https://ant.design/docs/react/use-in-typescript-cn)。
+参考 [在 TypeScript 中使用](https://4x.ant.design/docs/react/use-in-typescript-cn)。

 ## 🌍 国际化

-参考 [国际化文档](https://ant.design/docs/react/i18n-cn)。
+参考 [国际化文档](https://4x.ant.design/docs/react/i18n-cn)。

 ## 🔗 链接

- [首页](https://ant.design/)
- [所有组件](https://ant.design/components/overview-cn)
+- [首页](https://4x.ant.design/)
+- [所有组件](https://4x.ant.design/components/overview-cn)
 - [Ant Design Pro](http://pro.ant.design/)
- [更新日志](CHANGELOG.en-US.md)
+- [更新日志](CHANGELOG.zh-CN.md)
 - [React 底层基础组件](http://react-component.github.io/)
 - [移动端组件](http://mobile.ant.design)
 - [页面级组件](https://procomponents.ant.design)
@@ -127,10 +127,10 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
 - [设计规范速查手册](https://github.com/ant-design/ant-design/wiki/Ant-Design-%E8%AE%BE%E8%AE%A1%E5%9F%BA%E7%A1%80%E7%AE%80%E7%89%88)
 - [开发者说明](https://github.com/ant-design/ant-design/wiki/Development)
 - [版本发布规则](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [常见问题](https://ant.design/docs/react/faq-cn)
- [CodeSandbox 模板](https://u.ant.design/codesandbox-repro) for bug reports
- [定制主题](https://ant.design/docs/react/customize-theme-cn)
- [国际化](https://ant.design/docs/react/i18n-cn)
+- [常见问题](https://4x.ant.design/docs/react/faq-cn)
+- [CodeSandbox 模板](https://u.ant.design/codesandbox-repro-4x) for bug reports
+- [定制主题](https://4x.ant.design/docs/react/customize-theme-cn)
+- [国际化](https://4x.ant.design/docs/react/i18n-cn)
 - [成为社区协作成员](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ 本地开发
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <a href="https://ant.design">
+  <a href="https://4x.ant.design">
    <img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
  </a>
 </p>
@@ -45,7 +45,7 @@ An enterprise-class UI design language and React UI library.

 </div>

-[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://ant.design)
+[![](https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*Yl83RJhUE7kAAAAAAAAAAABkARQnAQ)](https://4x.ant.design)

 English | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md) | [Українською](./README-uk_UA.md) | [Spanish](./README-sp_MX.md) | [日本語](./README-ja_JP.md)

@@ -99,16 +99,16 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'

 ### TypeScript

-`antd` is written in TypeScript with complete definitions, check [Use in TypeScript](https://ant.design/docs/react/use-in-typescript) to get started.
+`antd` is written in TypeScript with complete definitions, check [Use in TypeScript](https://4x.ant.design/docs/react/use-in-typescript) to get started.

 ## 🌍 Internationalization

-Dozens of languages supported in `antd`, see [i18n](https://ant.design/docs/react/i18n).
+Dozens of languages supported in `antd`, see [i18n](https://4x.ant.design/docs/react/i18n).

 ## 🔗 Links

- [Home page](https://ant.design/)
- [Components Overview](https://ant.design/components/overview)
+- [Home page](https://4x.ant.design/)
+- [Components Overview](https://4x.ant.design/components/overview)
 - [Ant Design Pro](http://pro.ant.design/)
 - [Change Log](CHANGELOG.en-US.md)
 - [rc-components](http://react-component.github.io/)
@@ -122,9 +122,9 @@ Dozens of languages supported in `antd`, see [i18n](https://ant.design/docs/reac
 - [Scaffold Market](http://scaffold.ant.design)
 - [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
 - [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [FAQ](https://ant.design/docs/react/faq)
- [CodeSandbox Template](https://u.ant.design/codesandbox-repro) for bug reports
- [Customize Theme](https://ant.design/docs/react/customize-theme)
+- [FAQ](https://4x.ant.design/docs/react/faq)
+- [CodeSandbox Template](https://u.ant.design/codesandbox-repro-4x) for bug reports
+- [Customize Theme](https://4x.ant.design/docs/react/customize-theme)
 - [How to Apply for Being A Collaborator](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)

 ## ⌨️ Development
--- a/components/alert/index.tsx
+++ b/components/alert/index.tsx
@@ -99,11 +99,11 @@ const CloseIcon: React.FC<CloseIconProps> = props => {
  ) : null;
 };

-interface AlertInterface extends React.FC<AlertProps> {
+type CompoundedComponent = React.FC<AlertProps> & {
  ErrorBoundary: typeof ErrorBoundary;
-}
+};

-const Alert: AlertInterface = ({
+const Alert: CompoundedComponent = ({
  description,
  prefixCls: customizePrefixCls,
  message,
--- a/components/anchor/index.tsx
+++ b/components/anchor/index.tsx
@@ -6,11 +6,11 @@ export { AnchorLinkProps } from './AnchorLink';

 type InternalAnchorType = typeof InternalAnchor;

-interface AnchorInterface extends InternalAnchorType {
+type CompoundedComponent = InternalAnchorType & {
  Link: typeof AnchorLink;
-}
+};

-const Anchor = InternalAnchor as AnchorInterface;
+const Anchor = InternalAnchor as CompoundedComponent;

 Anchor.Link = AnchorLink;
 export default Anchor;
--- a/components/badge/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/badge/tests/snapshots/demo-extend.test.ts.snap
@@ -1332,6 +1332,78 @@ Array [
      style="background:#fa541c"
    />
  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count ant-badge-status-blue"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      style="background:#f0f"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge"
+  >
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-square"
+    >
+      <span
+        class="ant-avatar-string"
+        style="opacity:0"
+      />
+    </span>
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge"
+  >
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-square"
+    >
+      <span
+        class="ant-avatar-string"
+        style="opacity:0"
+      />
+    </span>
+    <sup
+      class="ant-scroll-number ant-badge-count ant-badge-status-blue"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
 ]
 `;

@@ -1357,6 +1429,42 @@ exports[`renders ./components/badge/demo/no-wrapper.md extend context correctly
      />
    </button>
  </div>
+  <div
+    class="ant-space-item"
+    style="margin-right:8px"
+  >
+    <span
+      class="ant-badge ant-badge-not-a-wrapper"
+    >
+      <sup
+        class="ant-scroll-number ant-badge-count ant-badge-multiple-words"
+        data-show="true"
+        style="background:#faad14"
+        title="11"
+      >
+        <span
+          class="ant-scroll-number-only"
+          style="transition:none"
+        >
+          <span
+            class="ant-scroll-number-only-unit current"
+          >
+            1
+          </span>
+        </span>
+        <span
+          class="ant-scroll-number-only"
+          style="transition:none"
+        >
+          <span
+            class="ant-scroll-number-only-unit current"
+          >
+            1
+          </span>
+        </span>
+      </sup>
+    </span>
+  </div>
  <div
    class="ant-space-item"
    style="margin-right:8px"
--- a/components/badge/tests/snapshots/demo.test.ts.snap
+++ b/components/badge/tests/snapshots/demo.test.ts.snap
@@ -1332,6 +1332,78 @@ Array [
      style="background:#fa541c"
    />
  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count ant-badge-status-blue"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      style="background:#f0f"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge"
+  >
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-square"
+    >
+      <span
+        class="ant-avatar-string"
+        style="opacity:0"
+      />
+    </span>
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
+  <span
+    class="ant-badge"
+  >
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-square"
+    >
+      <span
+        class="ant-avatar-string"
+        style="opacity:0"
+      />
+    </span>
+    <sup
+      class="ant-scroll-number ant-badge-count ant-badge-status-blue"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>,
 ]
 `;

@@ -1357,6 +1429,42 @@ exports[`renders ./components/badge/demo/no-wrapper.md correctly 1`] = `
      />
    </button>
  </div>
+  <div
+    class="ant-space-item"
+    style="margin-right:8px"
+  >
+    <span
+      class="ant-badge ant-badge-not-a-wrapper"
+    >
+      <sup
+        class="ant-scroll-number ant-badge-count ant-badge-multiple-words"
+        data-show="true"
+        style="background:#faad14"
+        title="11"
+      >
+        <span
+          class="ant-scroll-number-only"
+          style="transition:none"
+        >
+          <span
+            class="ant-scroll-number-only-unit current"
+          >
+            1
+          </span>
+        </span>
+        <span
+          class="ant-scroll-number-only"
+          style="transition:none"
+        >
+          <span
+            class="ant-scroll-number-only-unit current"
+          >
+            1
+          </span>
+        </span>
+      </sup>
+    </span>
+  </div>
  <div
    class="ant-space-item"
    style="margin-right:8px"
--- a/components/badge/tests/snapshots/index.test.tsx.snap
+++ b/components/badge/tests/snapshots/index.test.tsx.snap
@@ -1,5 +1,58 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

+exports[`Badge Badge should display 0 when count is 0 1`] = `
+<div>
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count ant-badge-status-blue"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>
+  <span
+    class="ant-badge ant-badge-not-a-wrapper"
+  >
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      style="background: rgb(255, 0, 255);"
+      title="0"
+    >
+      0
+    </sup>
+  </span>
+  <span
+    class="ant-badge"
+  >
+    <div>
+      children
+    </div>
+    <sup
+      class="ant-scroll-number ant-badge-count"
+      data-show="true"
+      title="0"
+    >
+      0
+    </sup>
+  </span>
+</div>
+`;
+
 exports[`Badge render Badge status/color when contains children 1`] = `
 <div>
  <span
--- a/components/badge/tests/index.test.tsx
+++ b/components/badge/tests/index.test.tsx
@@ -185,4 +185,21 @@ describe('Badge', () => {

    expect(container.querySelectorAll('.ant-badge > .ant-badge-status-text')).toHaveLength(0);
  });
+
+  // https://github.com/ant-design/ant-design/issues/38965
+  it('Badge should display 0 when count is 0', () => {
+    const { container } = render(
+      <>
+        <Badge count={0} showZero />
+        <Badge count={0} showZero color="blue" />
+        <Badge count={0} showZero color="#f0f" />
+        <Badge count={0} showZero>
+          <div>children</div>
+        </Badge>
+      </>,
+    );
+
+    expect(container).toMatchSnapshot();
+    expect(container.querySelectorAll('[title="0"]')).toHaveLength(4);
+  });
 });
--- a/components/badge/demo/mix.md
+++ b/components/badge/demo/mix.md
@@ -44,6 +44,15 @@ const App: React.FC = () => (
    <Badge dot color="#fa541c">
      <Avatar shape="square" size="large" />
    </Badge>
+    <Badge count={0} showZero />
+    <Badge count={0} showZero color="blue" />
+    <Badge count={0} showZero color="#f0f" />
+    <Badge count={0} showZero>
+      <Avatar shape="square" size="large" />
+    </Badge>
+    <Badge count={0} showZero color="blue">
+      <Avatar shape="square" size="large" />
+    </Badge>
  </>
 );

--- a/components/badge/demo/no-wrapper.md
+++ b/components/badge/demo/no-wrapper.md
@@ -26,6 +26,7 @@ const App: React.FC = () => {
  return (
    <Space>
      <Switch checked={show} onChange={() => setShow(!show)} />
+      <Badge count={show ? 11 : 0} showZero color="#faad14" />
      <Badge count={show ? 25 : 0} />
      <Badge count={show ? <ClockCircleOutlined style={{ color: '#f5222d' }} /> : 0} />
      <Badge
--- a/components/badge/index.tsx
+++ b/components/badge/index.tsx
@@ -12,9 +12,9 @@ import { isPresetColor } from './utils';

 export { ScrollNumberProps } from './ScrollNumber';

-interface CompoundedComponent extends React.FC<BadgeProps> {
+type CompoundedComponent = React.FC<BadgeProps> & {
  Ribbon: typeof Ribbon;
-}
+};

 export interface BadgeProps {
  /** Number to show in badge */
@@ -65,7 +65,7 @@ const Badge: CompoundedComponent = ({

  const isZero = numberedDisplayCount === '0' || numberedDisplayCount === 0;

-  const ignoreCount = count === null || isZero;
+  const ignoreCount = count === null || (isZero && !showZero);

  const hasStatus =
    ((status !== null && status !== undefined) || (color !== null && color !== undefined)) &&
--- a/components/breadcrumb/Breadcrumb.tsx
+++ b/components/breadcrumb/Breadcrumb.tsx
@@ -67,12 +67,12 @@ const addChildPath = (paths: string[], childPath: string, params: any) => {
  return originalPaths;
 };

-interface BreadcrumbInterface extends React.FC<BreadcrumbProps> {
+type CompoundedComponent = React.FC<BreadcrumbProps> & {
  Item: typeof BreadcrumbItem;
  Separator: typeof BreadcrumbSeparator;
-}
+};

-const Breadcrumb: BreadcrumbInterface = ({
+const Breadcrumb: CompoundedComponent = ({
  prefixCls: customizePrefixCls,
  separator = '/',
  style,
--- a/components/breadcrumb/BreadcrumbItem.tsx
+++ b/components/breadcrumb/BreadcrumbItem.tsx
@@ -19,10 +19,10 @@ export interface BreadcrumbItemProps {
  /** @deprecated Please use `menu` instead */
  overlay?: DropdownProps['overlay'];
 }
-interface BreadcrumbItemInterface extends React.FC<BreadcrumbItemProps> {
+type CompoundedComponent = React.FC<BreadcrumbItemProps> & {
  __ANT_BREADCRUMB_ITEM: boolean;
-}
-const BreadcrumbItem: BreadcrumbItemInterface = (props) => {
+};
+const BreadcrumbItem: CompoundedComponent = (props) => {
  const {
    prefixCls: customizePrefixCls,
    separator = '/',
--- a/components/breadcrumb/BreadcrumbSeparator.tsx
+++ b/components/breadcrumb/BreadcrumbSeparator.tsx
@@ -1,12 +1,12 @@
 import * as React from 'react';
 import { ConfigContext } from '../config-provider';

-interface BreadcrumbSeparatorInterface extends React.FC<{ children?: React.ReactNode }> {
+type CompoundedComponent = React.FC<{ children?: React.ReactNode }> & {
  /** @internal */
  __ANT_BREADCRUMB_SEPARATOR: boolean;
-}
+};

-const BreadcrumbSeparator: BreadcrumbSeparatorInterface = ({ children }) => {
+const BreadcrumbSeparator: CompoundedComponent = ({ children }) => {
  const { getPrefixCls } = React.useContext(ConfigContext);
  const prefixCls = getPrefixCls('breadcrumb');

--- a/components/button/button.tsx
+++ b/components/button/button.tsx
@@ -128,12 +128,13 @@ export type NativeButtonProps = {

 export type ButtonProps = Partial<AnchorButtonProps & NativeButtonProps>;

-interface CompoundedComponent
-  extends React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>> {
+type CompoundedComponent = React.ForwardRefExoticComponent<
+  ButtonProps & React.RefAttributes<HTMLElement>
+> & {
  Group: typeof Group;
  /** @internal */
  __ANT_BUTTON: boolean;
-}
+};

 type Loading = number | boolean;

--- a/components/calendar/locale/uz_UZ.tsx
+++ b/components/calendar/locale/uz_UZ.tsx
@@ -0,0 +1,3 @@
+import uzUZ from '../../date-picker/locale/uz_UZ';
+
+export default uzUZ;
--- a/components/card/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/card/tests/snapshots/demo-extend.test.ts.snap
@@ -757,6 +757,7 @@ Array [
            >
              <div
                class="ant-tabs-tab ant-tabs-tab-active"
+                data-node-key="tab1"
              >
                <div
                  aria-disabled="false"
@@ -770,6 +771,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab"
+                data-node-key="tab2"
              >
                <div
                  aria-disabled="false"
@@ -893,6 +895,7 @@ Array [
            >
              <div
                class="ant-tabs-tab"
+                data-node-key="article"
              >
                <div
                  aria-disabled="false"
@@ -906,6 +909,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab ant-tabs-tab-active"
+                data-node-key="app"
              >
                <div
                  aria-disabled="false"
@@ -919,6 +923,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab"
+                data-node-key="project"
              >
                <div
                  aria-disabled="false"
--- a/components/card/tests/snapshots/demo.test.ts.snap
+++ b/components/card/tests/snapshots/demo.test.ts.snap
@@ -757,6 +757,7 @@ Array [
            >
              <div
                class="ant-tabs-tab ant-tabs-tab-active"
+                data-node-key="tab1"
              >
                <div
                  aria-disabled="false"
@@ -770,6 +771,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab"
+                data-node-key="tab2"
              >
                <div
                  aria-disabled="false"
@@ -874,6 +876,7 @@ Array [
            >
              <div
                class="ant-tabs-tab"
+                data-node-key="article"
              >
                <div
                  aria-disabled="false"
@@ -887,6 +890,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab ant-tabs-tab-active"
+                data-node-key="app"
              >
                <div
                  aria-disabled="false"
@@ -900,6 +904,7 @@ Array [
              </div>
              <div
                class="ant-tabs-tab"
+                data-node-key="project"
              >
                <div
                  aria-disabled="false"
--- a/components/card/style/index.less
+++ b/components/card/style/index.less
@@ -243,6 +243,7 @@
    }

    &-detail {
+      flex: 1;
      overflow: hidden;

      > div:not(:last-child) {
--- a/components/cascader/index.tsx
+++ b/components/cascader/index.tsx
@@ -101,7 +101,7 @@ type MultipleCascaderProps = Omit<RcMultipleCascaderProps, 'checkable' | 'option

 type UnionCascaderProps = SingleCascaderProps | MultipleCascaderProps;

-export type CascaderProps<DataNodeType> = UnionCascaderProps & {
+export type CascaderProps<DataNodeType = any> = UnionCascaderProps & {
  multiple?: boolean;
  size?: SizeType;
  disabled?: boolean;
@@ -122,7 +122,7 @@ export interface CascaderRef {
  blur: () => void;
 }

-const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<CascaderRef>) => {
+const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref<CascaderRef>) => {
  const {
    prefixCls: customizePrefixCls,
    size: customizeSize,
@@ -176,12 +176,6 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
    '`dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
  );

-  warning(
-    !multiple || !props.displayRender,
-    'Cascader',
-    '`displayRender` not work on `multiple`. Please use `tagRender` instead.',
-  );
-
  // =================== No Found ====================
  const mergedNotFoundContent = notFoundContent || (renderEmpty || defaultRenderEmpty)('Cascader');

--- a/components/checkbox/tests/snapshots/checkbox.test.tsx.snap
+++ b/components/checkbox/tests/snapshots/checkbox.test.tsx.snap
@@ -10,7 +10,6 @@ exports[`Checkbox rtl render component should be rendered correctly in RTL direc
    <input
      class="ant-checkbox-input"
      type="checkbox"
-      value=""
    />
    <span
      class="ant-checkbox-inner"
--- a/components/checkbox/index.tsx
+++ b/components/checkbox/index.tsx
@@ -6,12 +6,13 @@ import Group from './Group';
 export { CheckboxChangeEvent, CheckboxProps } from './Checkbox';
 export { CheckboxGroupProps, CheckboxOptionType } from './Group';

-interface CompoundedComponent
-  extends React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>> {
+type CompoundedComponent = React.ForwardRefExoticComponent<
+  CheckboxProps & React.RefAttributes<HTMLInputElement>
+> & {
  Group: typeof Group;
  /** @internal */
  __ANT_CHECKBOX: boolean;
-}
+};

 const Checkbox = InternalCheckbox as CompoundedComponent;

--- a/components/collapse/Collapse.tsx
+++ b/components/collapse/Collapse.tsx
@@ -48,11 +48,11 @@ interface PanelProps {
  collapsible?: CollapsibleType;
 }

-interface CollapseInterface extends React.FC<CollapseProps> {
+type CompoundedComponent = React.FC<CollapseProps> & {
  Panel: typeof CollapsePanel;
-}
+};

-const Collapse: CollapseInterface = props => {
+const Collapse: CompoundedComponent = (props) => {
  const { getPrefixCls, direction } = React.useContext(ConfigContext);
  const {
    prefixCls: customizePrefixCls,
--- a/components/config-provider/DisabledContext.tsx
+++ b/components/config-provider/DisabledContext.tsx
@@ -12,7 +12,7 @@ export interface DisabledContextProps {
 export const DisabledContextProvider: React.FC<DisabledContextProps> = ({ children, disabled }) => {
  const originDisabled = React.useContext(DisabledContext);
  return (
-    <DisabledContext.Provider value={disabled || originDisabled}>
+    <DisabledContext.Provider value={disabled ?? originDisabled}>
      {children}
    </DisabledContext.Provider>
  );
--- a/components/config-provider/tests/snapshots/components.test.tsx.snap
+++ b/components/config-provider/tests/snapshots/components.test.tsx.snap
@@ -12091,7 +12091,6 @@ exports[`ConfigProvider components Checkbox configProvider 1`] = `
      <input
        class="config-checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="config-checkbox-inner"
@@ -12118,7 +12117,6 @@ exports[`ConfigProvider components Checkbox configProvider componentDisabled 1`]
        class="config-checkbox-input"
        disabled=""
        type="checkbox"
-        value=""
      />
      <span
        class="config-checkbox-inner"
@@ -12144,7 +12142,6 @@ exports[`ConfigProvider components Checkbox configProvider componentSize large 1
      <input
        class="config-checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="config-checkbox-inner"
@@ -12170,7 +12167,6 @@ exports[`ConfigProvider components Checkbox configProvider componentSize middle
      <input
        class="config-checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="config-checkbox-inner"
@@ -12196,7 +12192,6 @@ exports[`ConfigProvider components Checkbox configProvider virtual and dropdownM
      <input
        class="ant-checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="ant-checkbox-inner"
@@ -12222,7 +12217,6 @@ exports[`ConfigProvider components Checkbox normal 1`] = `
      <input
        class="ant-checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="ant-checkbox-inner"
@@ -12248,7 +12242,6 @@ exports[`ConfigProvider components Checkbox prefixCls 1`] = `
      <input
        class="prefix-Checkbox-input"
        type="checkbox"
-        value=""
      />
      <span
        class="prefix-Checkbox-inner"
@@ -17966,18 +17959,22 @@ HTMLCollection [
        class="config-menu config-menu-sub config-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="config-menu-item-group"
+          role="presentation"
        >
          <div
            class="config-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="config-menu-item-group-list"
+            role="group"
          >
            <li
              class="config-menu-item config-menu-item-only-child"
@@ -18039,18 +18036,22 @@ HTMLCollection [
        class="config-menu config-menu-sub config-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="config-menu-item-group"
+          role="presentation"
        >
          <div
            class="config-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="config-menu-item-group-list"
+            role="group"
          >
            <li
              class="config-menu-item config-menu-item-only-child"
@@ -18112,18 +18113,22 @@ HTMLCollection [
        class="config-menu config-menu-sub config-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="config-menu-item-group"
+          role="presentation"
        >
          <div
            class="config-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="config-menu-item-group-list"
+            role="group"
          >
            <li
              class="config-menu-item config-menu-item-only-child"
@@ -18185,18 +18190,22 @@ HTMLCollection [
        class="config-menu config-menu-sub config-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="config-menu-item-group"
+          role="presentation"
        >
          <div
            class="config-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="config-menu-item-group-list"
+            role="group"
          >
            <li
              class="config-menu-item config-menu-item-only-child"
@@ -18258,18 +18267,22 @@ HTMLCollection [
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -18331,18 +18344,22 @@ HTMLCollection [
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -18404,19 +18421,23 @@ HTMLCollection [
        class="prefix-Menu prefix-Menu-sub prefix-Menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-bamboo-popup"
+        role="menu"
      >
        <li
          class="prefix-Menu-item-group"
          prefixcls="prefix-Menu"
+          role="presentation"
        >
          <div
            class="prefix-Menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="prefix-Menu-item-group-list"
+            role="group"
          >
            <li
              class="prefix-Menu-item prefix-Menu-item-only-child"
@@ -22364,7 +22385,6 @@ exports[`ConfigProvider components Radio configProvider 1`] = `
          checked=""
          class="config-radio-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-inner"
@@ -22388,7 +22408,6 @@ exports[`ConfigProvider components Radio configProvider 1`] = `
          checked=""
          class="config-radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-button-inner"
@@ -22418,7 +22437,6 @@ exports[`ConfigProvider components Radio configProvider componentDisabled 1`] =
          class="config-radio-input"
          disabled=""
          type="radio"
-          value=""
        />
        <span
          class="config-radio-inner"
@@ -22443,7 +22461,6 @@ exports[`ConfigProvider components Radio configProvider componentDisabled 1`] =
          class="config-radio-button-input"
          disabled=""
          type="radio"
-          value=""
        />
        <span
          class="config-radio-button-inner"
@@ -22472,7 +22489,6 @@ exports[`ConfigProvider components Radio configProvider componentSize large 1`]
          checked=""
          class="config-radio-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-inner"
@@ -22496,7 +22512,6 @@ exports[`ConfigProvider components Radio configProvider componentSize large 1`]
          checked=""
          class="config-radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-button-inner"
@@ -22525,7 +22540,6 @@ exports[`ConfigProvider components Radio configProvider componentSize middle 1`]
          checked=""
          class="config-radio-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-inner"
@@ -22549,7 +22563,6 @@ exports[`ConfigProvider components Radio configProvider componentSize middle 1`]
          checked=""
          class="config-radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="config-radio-button-inner"
@@ -22578,7 +22591,6 @@ exports[`ConfigProvider components Radio configProvider virtual and dropdownMatc
          checked=""
          class="ant-radio-input"
          type="radio"
-          value=""
        />
        <span
          class="ant-radio-inner"
@@ -22602,7 +22614,6 @@ exports[`ConfigProvider components Radio configProvider virtual and dropdownMatc
          checked=""
          class="ant-radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="ant-radio-button-inner"
@@ -22631,7 +22642,6 @@ exports[`ConfigProvider components Radio normal 1`] = `
          checked=""
          class="ant-radio-input"
          type="radio"
-          value=""
        />
        <span
          class="ant-radio-inner"
@@ -22655,7 +22665,6 @@ exports[`ConfigProvider components Radio normal 1`] = `
          checked=""
          class="ant-radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="ant-radio-button-inner"
@@ -22684,7 +22693,6 @@ exports[`ConfigProvider components Radio prefixCls 1`] = `
          checked=""
          class="prefix-Radio-input"
          type="radio"
-          value=""
        />
        <span
          class="prefix-Radio-inner"
@@ -22708,7 +22716,6 @@ exports[`ConfigProvider components Radio prefixCls 1`] = `
          checked=""
          class="prefix-Radio-button-input"
          type="radio"
-          value=""
        />
        <span
          class="prefix-Radio-button-inner"
@@ -26947,7 +26954,7 @@ exports[`ConfigProvider components Table configProvider 1`] = `
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="config-table-cell config-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -27070,7 +27077,6 @@ exports[`ConfigProvider components Table configProvider 1`] = `
                                      <input
                                        class="config-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="config-checkbox-inner"
@@ -27253,7 +27259,7 @@ exports[`ConfigProvider components Table configProvider componentDisabled 1`] =
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="config-table-cell config-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -27377,7 +27383,6 @@ exports[`ConfigProvider components Table configProvider componentDisabled 1`] =
                                        class="config-checkbox-input"
                                        disabled=""
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="config-checkbox-inner"
@@ -27561,7 +27566,7 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="config-table-cell config-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -27684,7 +27689,6 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
                                      <input
                                        class="config-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="config-checkbox-inner"
@@ -27867,7 +27871,7 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="config-table-cell config-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -27990,7 +27994,6 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
                                      <input
                                        class="config-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="config-checkbox-inner"
@@ -28173,7 +28176,7 @@ exports[`ConfigProvider components Table configProvider virtual and dropdownMatc
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="ant-table-cell ant-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -28296,7 +28299,6 @@ exports[`ConfigProvider components Table configProvider virtual and dropdownMatc
                                      <input
                                        class="ant-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="ant-checkbox-inner"
@@ -28479,7 +28481,7 @@ exports[`ConfigProvider components Table normal 1`] = `
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="ant-table-cell ant-table-column-has-sorters"
                    tabindex="0"
                  >
@@ -28602,7 +28604,6 @@ exports[`ConfigProvider components Table normal 1`] = `
                                      <input
                                        class="ant-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="ant-checkbox-inner"
@@ -28785,7 +28786,7 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
              >
                <tr>
                  <th
-                    aria-label="this column's title is Name,this column is sortable"
+                    aria-label="Name"
                    class="prefix-Table-cell prefix-Table-column-has-sorters"
                    tabindex="0"
                  >
@@ -28908,7 +28909,6 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
                                      <input
                                        class="ant-checkbox-input"
                                        type="checkbox"
-                                        value=""
                                      />
                                      <span
                                        class="ant-checkbox-inner"
@@ -29080,6 +29080,7 @@ exports[`ConfigProvider components Tabs configProvider 1`] = `
      >
        <div
          class="config-tabs-tab config-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29169,6 +29170,7 @@ exports[`ConfigProvider components Tabs configProvider componentDisabled 1`] = `
      >
        <div
          class="config-tabs-tab config-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29258,6 +29260,7 @@ exports[`ConfigProvider components Tabs configProvider componentSize large 1`] =
      >
        <div
          class="config-tabs-tab config-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29347,6 +29350,7 @@ exports[`ConfigProvider components Tabs configProvider componentSize middle 1`]
      >
        <div
          class="config-tabs-tab config-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29436,6 +29440,7 @@ exports[`ConfigProvider components Tabs configProvider virtual and dropdownMatch
      >
        <div
          class="ant-tabs-tab ant-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29525,6 +29530,7 @@ exports[`ConfigProvider components Tabs normal 1`] = `
      >
        <div
          class="ant-tabs-tab ant-tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -29614,6 +29620,7 @@ exports[`ConfigProvider components Tabs prefixCls 1`] = `
      >
        <div
          class="prefix-Tabs-tab prefix-Tabs-tab-active"
+          data-node-key="Light"
        >
          <div
            aria-controls="rc-tabs-test-panel-Light"
@@ -38716,7 +38723,6 @@ exports[`ConfigProvider components Transfer configProvider 1`] = `
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -38876,7 +38882,6 @@ exports[`ConfigProvider components Transfer configProvider 1`] = `
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -38990,7 +38995,6 @@ exports[`ConfigProvider components Transfer configProvider componentDisabled 1`]
            class="config-checkbox-input"
            disabled=""
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39151,7 +39155,6 @@ exports[`ConfigProvider components Transfer configProvider componentDisabled 1`]
            class="config-checkbox-input"
            disabled=""
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39264,7 +39267,6 @@ exports[`ConfigProvider components Transfer configProvider componentSize large 1
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39424,7 +39426,6 @@ exports[`ConfigProvider components Transfer configProvider componentSize large 1
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39537,7 +39538,6 @@ exports[`ConfigProvider components Transfer configProvider componentSize middle
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39697,7 +39697,6 @@ exports[`ConfigProvider components Transfer configProvider componentSize middle
          <input
            class="config-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="config-checkbox-inner"
@@ -39810,7 +39809,6 @@ exports[`ConfigProvider components Transfer configProvider virtual and dropdownM
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -39970,7 +39968,6 @@ exports[`ConfigProvider components Transfer configProvider virtual and dropdownM
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -40083,7 +40080,6 @@ exports[`ConfigProvider components Transfer normal 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -40243,7 +40239,6 @@ exports[`ConfigProvider components Transfer normal 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -40356,7 +40351,6 @@ exports[`ConfigProvider components Transfer prefixCls 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -40516,7 +40510,6 @@ exports[`ConfigProvider components Transfer prefixCls 1`] = `
          <input
            class="ant-checkbox-input"
            type="checkbox"
-            value=""
          />
          <span
            class="ant-checkbox-inner"
@@ -40627,7 +40620,7 @@ exports[`ConfigProvider components Tree configProvider 1`] = `
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -40692,7 +40685,7 @@ exports[`ConfigProvider components Tree configProvider 1`] = `
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -40785,7 +40778,7 @@ exports[`ConfigProvider components Tree configProvider componentDisabled 1`] = `
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -40850,7 +40843,7 @@ exports[`ConfigProvider components Tree configProvider componentDisabled 1`] = `
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -40943,7 +40936,7 @@ exports[`ConfigProvider components Tree configProvider componentSize large 1`] =
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -41008,7 +41001,7 @@ exports[`ConfigProvider components Tree configProvider componentSize large 1`] =
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -41101,7 +41094,7 @@ exports[`ConfigProvider components Tree configProvider componentSize middle 1`]
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -41166,7 +41159,7 @@ exports[`ConfigProvider components Tree configProvider componentSize middle 1`]
    <div
      aria-hidden="true"
      class="config-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="config-tree-indent"
@@ -41259,7 +41252,7 @@ exports[`ConfigProvider components Tree configProvider virtual and dropdownMatch
    <div
      aria-hidden="true"
      class="ant-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="ant-tree-indent"
@@ -41324,7 +41317,7 @@ exports[`ConfigProvider components Tree configProvider virtual and dropdownMatch
    <div
      aria-hidden="true"
      class="ant-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="ant-tree-indent"
@@ -41417,7 +41410,7 @@ exports[`ConfigProvider components Tree normal 1`] = `
    <div
      aria-hidden="true"
      class="ant-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="ant-tree-indent"
@@ -41482,7 +41475,7 @@ exports[`ConfigProvider components Tree normal 1`] = `
    <div
      aria-hidden="true"
      class="ant-tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="ant-tree-indent"
@@ -41575,7 +41568,7 @@ exports[`ConfigProvider components Tree prefixCls 1`] = `
    <div
      aria-hidden="true"
      class="prefix-Tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="prefix-Tree-indent"
@@ -41640,7 +41633,7 @@ exports[`ConfigProvider components Tree prefixCls 1`] = `
    <div
      aria-hidden="true"
      class="prefix-Tree-treenode"
-      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+      style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
    >
      <div
        class="prefix-Tree-indent"
@@ -41769,7 +41762,7 @@ exports[`ConfigProvider components TreeSelect configProvider 1`] = `
            <div
              aria-hidden="true"
              class="config-select-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="config-select-tree-indent"
@@ -41967,7 +41960,7 @@ exports[`ConfigProvider components TreeSelect configProvider componentSize large
            <div
              aria-hidden="true"
              class="config-select-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="config-select-tree-indent"
@@ -42104,7 +42097,7 @@ exports[`ConfigProvider components TreeSelect configProvider componentSize middl
            <div
              aria-hidden="true"
              class="config-select-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="config-select-tree-indent"
@@ -42241,7 +42234,7 @@ exports[`ConfigProvider components TreeSelect configProvider virtual and dropdow
            <div
              aria-hidden="true"
              class="ant-select-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="ant-select-tree-indent"
@@ -42378,7 +42371,7 @@ exports[`ConfigProvider components TreeSelect normal 1`] = `
            <div
              aria-hidden="true"
              class="ant-select-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="ant-select-tree-indent"
@@ -42515,7 +42508,7 @@ exports[`ConfigProvider components TreeSelect prefixCls 1`] = `
            <div
              aria-hidden="true"
              class="prefix-TreeSelect-tree-treenode"
-              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
+              style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
            >
              <div
                class="prefix-TreeSelect-tree-indent"
--- a/components/config-provider/tests/form.test.tsx
+++ b/components/config-provider/tests/form.test.tsx
@@ -4,6 +4,7 @@ import ConfigProvider from '..';
 import { render } from '../../../tests/utils';
 import type { FormInstance } from '../../form';
 import Form from '../../form';
+import Input from '../../input';
 import zhCN from '../../locale/zh_CN';

 describe('ConfigProvider.Form', () => {
@@ -125,4 +126,24 @@ describe('ConfigProvider.Form', () => {
      expect(container.querySelector('.ant-form-item-no-colon')).toBeFalsy();
    });
  });
+
+  describe('form disabled', () => {
+    it('set Input enabled', () => {
+      const { container } = render(
+        <Form disabled>
+          <ConfigProvider componentDisabled={false}>
+            <Form.Item name="input1" label="启用">
+              <Input />
+            </Form.Item>
+          </ConfigProvider>
+          <Form.Item name="input" label="禁用">
+            <Input />
+          </Form.Item>
+        </Form>,
+      );
+
+      expect(container.querySelector('#input1[disabled]')).toBeFalsy();
+      expect(container.querySelector('#input[disabled]')).toBeTruthy();
+    });
+  });
 });
--- a/components/date-picker/tests/DatePicker.test.tsx
+++ b/components/date-picker/tests/DatePicker.test.tsx
@@ -227,6 +227,12 @@ describe('DatePicker', () => {
      'Warning: [antd: DatePicker] `dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
    );
  });
+  it('DatePicker should show warning when use popupClassName', () => {
+    render(<DatePicker popupClassName="myCustomClassName" />);
+    expect(errorSpy).not.toHaveBeenCalledWith(
+      'Warning: [antd: DatePicker] `dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
+    );
+  });

  it('RangePicker should show warning when use dropdownClassName', () => {
    render(<DatePicker.RangePicker dropdownClassName="myCustomClassName" />);
@@ -235,6 +241,13 @@ describe('DatePicker', () => {
    );
  });

+  it('RangePicker should show warning when use popupClassName', () => {
+    render(<DatePicker.RangePicker popupClassName="myCustomClassName" />);
+    expect(errorSpy).not.toHaveBeenCalledWith(
+      'Warning: [antd: RangePicker] `dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
+    );
+  });
+
  it('DatePicker.RangePicker with defaultPickerValue and showTime', () => {
    const startDate = moment('1982-02-12');
    const endDate = moment('1982-02-22');
--- a/components/date-picker/generatePicker/generateRangePicker.tsx
+++ b/components/date-picker/generatePicker/generateRangePicker.tsx
@@ -109,7 +109,6 @@ export default function generateRangePicker<DateType>(generateConfig: GenerateCo
              }
              disabled={mergedDisabled}
              ref={innerRef}
-              dropdownClassName={popupClassName || dropdownClassName}
              dropdownAlign={transPlacement2DropdownAlign(direction, placement)}
              placeholder={getRangePlaceholder(picker, locale, placeholder)}
              suffixIcon={suffixNode}
@@ -141,6 +140,7 @@ export default function generateRangePicker<DateType>(generateConfig: GenerateCo
              generateConfig={generateConfig}
              components={Components}
              direction={direction}
+              dropdownClassName={popupClassName || dropdownClassName}
            />
          );
        }}
--- a/components/date-picker/generatePicker/generateSinglePicker.tsx
+++ b/components/date-picker/generatePicker/generateSinglePicker.tsx
@@ -95,7 +95,7 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<

        warning(
          !dropdownClassName,
-          'DatePicker',
+          mergedPicker === 'time' ? 'TimePicker' : 'DatePicker',
          '`dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
        );
        // ===================== Size =====================
@@ -128,7 +128,6 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
                  placeholder={getPlaceholder(mergedPicker, locale, placeholder)}
                  suffixIcon={suffixNode}
                  dropdownAlign={transPlacement2DropdownAlign(direction, placement)}
-                  dropdownClassName={popupClassName || dropdownClassName}
                  clearIcon={<CloseCircleFilled />}
                  prevIcon={<span className={`${prefixCls}-prev-icon`} />}
                  nextIcon={<span className={`${prefixCls}-next-icon`} />}
@@ -159,6 +158,7 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
                  components={Components}
                  direction={direction}
                  disabled={mergedDisabled}
+                  dropdownClassName={popupClassName || dropdownClassName}
                />
              );
            }}
--- a/components/date-picker/locale/uz_UZ.tsx
+++ b/components/date-picker/locale/uz_UZ.tsx
@@ -0,0 +1,27 @@
+import CalendarLocale from 'rc-picker/lib/locale/uz_UZ';
+import TimePickerLocale from '../../time-picker/locale/uz_UZ';
+import type { PickerLocale } from '../generatePicker';
+
+// Merge into a locale object
+const locale: PickerLocale = {
+  lang: {
+    placeholder: 'Sanani tanlang',
+    yearPlaceholder: 'Yilni tanlang',
+    quarterPlaceholder: 'Chorakni tanlang',
+    monthPlaceholder: 'Oyni tanlang',
+    weekPlaceholder: 'Haftani tanlang',
+    rangePlaceholder: ['Bosh sana', 'Oxirigi sana'],
+    rangeYearPlaceholder: ['Yilning boshi', 'Yilning oxiri'],
+    rangeMonthPlaceholder: ['Oyning boshi', 'Oyning oxiri'],
+    rangeWeekPlaceholder: ['Haftaning boshi', 'Haftaning oxiri'],
+    ...CalendarLocale,
+  },
+  timePickerLocale: {
+    ...TimePickerLocale,
+  },
+};
+
+// All settings at:
+// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
+
+export default locale;
--- a/components/divider/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/divider/tests/snapshots/demo-extend.test.ts.snap
@@ -33,6 +33,21 @@ Array [
    role="separator"
    style="height:60px;border-color:#7cb305"
  />,
+  <div
+    style="display:flex;flex-direction:column;height:50px;box-shadow:0 0 1px red"
+  >
+    <div
+      class="ant-divider ant-divider-horizontal ant-divider-with-text ant-divider-with-text-left"
+      role="separator"
+      style="background:rgba(0,255,0,0.05)"
+    >
+      <span
+        class="ant-divider-inner-text"
+      >
+        Text
+      </span>
+    </div>
+  </div>,
 ]
 `;

--- a/components/divider/tests/snapshots/demo.test.ts.snap
+++ b/components/divider/tests/snapshots/demo.test.ts.snap
@@ -33,6 +33,21 @@ Array [
    role="separator"
    style="height:60px;border-color:#7cb305"
  />,
+  <div
+    style="display:flex;flex-direction:column;height:50px;box-shadow:0 0 1px red"
+  >
+    <div
+      class="ant-divider ant-divider-horizontal ant-divider-with-text ant-divider-with-text-left"
+      role="separator"
+      style="background:rgba(0,255,0,0.05)"
+    >
+      <span
+        class="ant-divider-inner-text"
+      >
+        Text
+      </span>
+    </div>
+  </div>,
 ]
 `;

--- a/components/divider/demo/customize-style.md
+++ b/components/divider/demo/customize-style.md
@@ -27,6 +27,12 @@ const App: React.FC = () => (
    </Divider>
    <Divider type="vertical" style={{ height: 60, borderColor: '#7cb305' }} />
    <Divider type="vertical" style={{ height: 60, borderColor: '#7cb305' }} dashed />
+
+    <div style={{ display: 'flex', flexDirection: 'column', height: 50, boxShadow: '0 0 1px red' }}>
+      <Divider style={{ background: 'rgba(0,255,0,0.05)' }} orientation="left">
+        Text
+      </Divider>
+    </div>
  </>
 );

--- a/components/divider/style/index.less
+++ b/components/divider/style/index.less
@@ -29,6 +29,7 @@

  &-horizontal&-with-text {
    display: flex;
+    align-items: center;
    margin: 16px 0;
    color: @heading-color;
    font-weight: 500;
@@ -41,7 +42,6 @@
    &::before,
    &::after {
      position: relative;
-      top: 50%;
      width: 50%;
      border-top: @border-width-base solid transparent;
      // Chrome not accept `inherit` in `border-top`
@@ -54,24 +54,20 @@

  &-horizontal&-with-text-left {
    &::before {
-      top: 50%;
      width: @divider-orientation-margin;
    }

    &::after {
-      top: 50%;
      width: 100% - @divider-orientation-margin;
    }
  }

  &-horizontal&-with-text-right {
    &::before {
-      top: 50%;
      width: 100% - @divider-orientation-margin;
    }

    &::after {
-      top: 50%;
      width: @divider-orientation-margin;
    }
  }
--- a/components/drawer/tests/snapshots/demo-extend.test.tsx.snap
+++ b/components/drawer/tests/snapshots/demo-extend.test.tsx.snap
--- a/components/drawer/index.en-US.md
+++ b/components/drawer/index.en-US.md
@@ -33,7 +33,7 @@ A Drawer is a panel that is typically overlaid on top of a page and slides in fr
 | footer | The footer for Drawer | ReactNode | - |  |
 | footerStyle | Style of the drawer footer part | CSSProperties | - |  |
 | forceRender | Prerender Drawer component forcely | boolean | false |  |
-| getContainer | mounted node and display window for Drawer | HTMLElement \| () => HTMLElement \| Selectors \| false | body |  |
+| getContainer | mounted node and display window for Drawer. To match React 18 concurrent requirement, `getContainer` should always return same dom since `4.24.x` | HTMLElement \| () => HTMLElement \| Selectors \| false | body |  |
 | headerStyle | Style of the drawer header part | CSSProperties | - |  |
 | height | Placement is `top` or `bottom`, height of the Drawer dialog | string \| number | 378 |  |
 | keyboard | Whether support press esc to close | boolean | true |  |
--- a/components/drawer/index.tsx
+++ b/components/drawer/index.tsx
@@ -9,6 +9,7 @@ import { NoFormStyle } from '../form/context';
 import { getTransitionName } from '../_util/motion';
 import { tuple } from '../_util/type';
 import warning from '../_util/warning';
+import { NoCompactStyle } from '../space/Compact';

 const SizeTypes = tuple('default', 'large');
 type sizeType = typeof SizeTypes[number];
@@ -163,7 +164,7 @@ function Drawer(props: DrawerProps) {
    motionDeadline: 500,
  };

-  const panelMotion: RcDrawerProps['motion'] = motionPlacement => ({
+  const panelMotion: RcDrawerProps['motion'] = (motionPlacement) => ({
    motionName: getTransitionName(prefixCls, `panel-motion-${motionPlacement}`),
    motionAppear: true,
    motionEnter: true,
@@ -173,35 +174,37 @@ function Drawer(props: DrawerProps) {

  // =========================== Render ===========================
  return (
-    <NoFormStyle status override>
-      <RcDrawer
-        prefixCls={prefixCls}
-        onClose={onClose}
-        {...rest}
-        open={open || visible}
-        mask={mask}
-        push={push}
-        width={mergedWidth}
-        height={mergedHeight}
-        rootClassName={drawerClassName}
-        getContainer={getContainer}
-        afterOpenChange={isOpen => {
-          afterOpenChange?.(isOpen);
-          afterVisibleChange?.(isOpen);
-        }}
-        maskMotion={maskMotion}
-        motion={panelMotion}
-        rootStyle={style}
-      >
-        <div className={`${prefixCls}-wrapper-body`} style={{ ...drawerStyle }}>
-          {renderHeader()}
-          <div className={`${prefixCls}-body`} style={bodyStyle}>
-            {children}
+    <NoCompactStyle>
+      <NoFormStyle status override>
+        <RcDrawer
+          prefixCls={prefixCls}
+          onClose={onClose}
+          {...rest}
+          open={open ?? visible}
+          mask={mask}
+          push={push}
+          width={mergedWidth}
+          height={mergedHeight}
+          rootClassName={drawerClassName}
+          getContainer={getContainer}
+          afterOpenChange={(isOpen) => {
+            afterOpenChange?.(isOpen);
+            afterVisibleChange?.(isOpen);
+          }}
+          maskMotion={maskMotion}
+          motion={panelMotion}
+          rootStyle={style}
+        >
+          <div className={`${prefixCls}-wrapper-body`} style={{ ...drawerStyle }}>
+            {renderHeader()}
+            <div className={`${prefixCls}-body`} style={bodyStyle}>
+              {children}
+            </div>
+            {renderFooter()}
          </div>
-          {renderFooter()}
-        </div>
-      </RcDrawer>
-    </NoFormStyle>
+        </RcDrawer>
+      </NoFormStyle>
+    </NoCompactStyle>
  );
 }

--- a/components/drawer/index.zh-CN.md
+++ b/components/drawer/index.zh-CN.md
@@ -32,7 +32,7 @@ cover: https://img.alicdn.com/imgextra/i4/O1CN019djdZP1OHwXSRGCOW_!!600000000168
 | footer | 抽屉的页脚 | ReactNode | - |  |
 | footerStyle | 抽屉页脚部件的样式 | CSSProperties | - |  |
 | forceRender | 预渲染 Drawer 内元素 | boolean | false |  |
-| getContainer | 指定 Drawer 挂载的节点，**并在容器内展现**，`false` 为挂载在当前位置 | HTMLElement \| () => HTMLElement \| Selectors \| false | body |  |
+| getContainer | 指定 Drawer 挂载的节点，**并在容器内展现**，`false` 为挂载在当前位置。为符合 React 18 concurrent 标准，从 `4.20.x` 起 `getContainer` 需要始终返回唯一 dom 节点 | HTMLElement \| () => HTMLElement \| Selectors \| false | body |  |
 | headerStyle | 用于设置 Drawer 头部的样式 | CSSProperties | - |  |
 | height | 高度, 在 `placement` 为 `top` 或 `bottom` 时使用 | string \| number | 378 |  |
 | keyboard | 是否支持键盘 esc 关闭 | boolean | true |  |
--- a/components/drawer/style/index.tsx
+++ b/components/drawer/style/index.tsx
@@ -1,3 +1,3 @@
-// deps-lint-skip: empty, form
+// deps-lint-skip: empty, form, space
 import '../../style/index.less';
 import './index.less';
--- a/components/dropdown/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/dropdown/tests/snapshots/demo-extend.test.ts.snap
@@ -6432,15 +6432,18 @@ Array [
      >
        <li
          class="ant-dropdown-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-dropdown-menu-item-group-title"
+            role="presentation"
            title="Item Group"
          >
            Item Group
          </div>
          <ul
            class="ant-dropdown-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -6577,18 +6580,22 @@ Array [
              <ul
                class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-dropdown-menu-item-group"
+                  role="presentation"
                >
                  <div
                    class="ant-dropdown-menu-item-group-title"
+                    role="presentation"
                    title="Item 1"
                  >
                    Item 1
                  </div>
                  <ul
                    class="ant-dropdown-menu-item-group-list"
+                    role="group"
                  >
                    <li
                      class="ant-dropdown-menu-item ant-dropdown-menu-item-selected ant-dropdown-menu-item-only-child"
@@ -6660,15 +6667,18 @@ Array [
                </li>
                <li
                  class="ant-dropdown-menu-item-group"
+                  role="presentation"
                >
                  <div
                    class="ant-dropdown-menu-item-group-title"
+                    role="presentation"
                    title="Item 2"
                  >
                    Item 2
                  </div>
                  <ul
                    class="ant-dropdown-menu-item-group-list"
+                    role="group"
                  >
                    <li
                      class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -6809,6 +6819,7 @@ Array [
              <ul
                class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -6924,6 +6935,7 @@ Array [
                      <ul
                        class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                        data-menu-list="true"
+                        role="menu"
                      >
                        <li
                          class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -7066,6 +7078,7 @@ Array [
              <ul
                class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -9342,15 +9355,18 @@ Array [
      >
        <li
          class="ant-dropdown-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-dropdown-menu-item-group-title"
+            role="presentation"
            title="Group title"
          >
            Group title
          </div>
          <ul
            class="ant-dropdown-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -9468,6 +9484,7 @@ Array [
              <ul
                class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
@@ -9587,6 +9604,7 @@ Array [
              <ul
                class="ant-dropdown-menu ant-dropdown-menu-sub ant-dropdown-menu-vertical"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
--- a/components/dropdown/dropdown-button.tsx
+++ b/components/dropdown/dropdown-button.tsx
@@ -27,12 +27,12 @@ export interface DropdownButtonProps extends ButtonGroupProps, DropdownProps {
  buttonsRender?: (buttons: React.ReactNode[]) => React.ReactNode[];
 }

-interface DropdownButtonInterface extends React.FC<DropdownButtonProps> {
+type CompoundedComponent = React.FC<DropdownButtonProps> & {
  /** @internal */
  __ANT_BUTTON: boolean;
-}
+};

-const DropdownButton: DropdownButtonInterface = props => {
+const DropdownButton: CompoundedComponent = (props) => {
  const {
    getPopupContainer: getContextPopupContainer,
    getPrefixCls,
--- a/components/dropdown/dropdown.tsx
+++ b/components/dropdown/dropdown.tsx
@@ -8,11 +8,13 @@ import Menu from '../menu';
 import type { MenuProps } from '../menu';
 import { ConfigContext } from '../config-provider';
 import { OverrideProvider } from '../menu/OverrideContext';
+import type { AdjustOverflow } from '../_util/placements';
 import getPlacements from '../_util/placements';
 import { cloneElement } from '../_util/reactNode';
 import { tuple } from '../_util/type';
 import warning from '../_util/warning';
 import DropdownButton from './dropdown-button';
+import { NoCompactStyle } from '../space/Compact';

 const Placements = tuple(
  'topLeft',
@@ -69,6 +71,7 @@ export interface DropdownProps {
  mouseLeaveDelay?: number;
  openClassName?: string;
  children?: React.ReactNode;
+  autoAdjustOverflow?: boolean | AdjustOverflow;

  // Deprecated
  /** @deprecated Please use `menu` instead */
@@ -79,11 +82,11 @@ export interface DropdownProps {
  onVisibleChange?: (open: boolean) => void;
 }

-interface DropdownInterface extends React.FC<DropdownProps> {
+type CompoundedComponent = React.FC<DropdownProps> & {
  Button: typeof DropdownButton;
-}
+};

-const Dropdown: DropdownInterface = props => {
+const Dropdown: CompoundedComponent = (props) => {
  const {
    getPopupContainer: getContextPopupContainer,
    getPrefixCls,
@@ -157,6 +160,7 @@ const Dropdown: DropdownInterface = props => {
    onOpenChange,
    mouseEnterDelay = 0.15,
    mouseLeaveDelay = 0.1,
+    autoAdjustOverflow = true,
  } = props;

  const prefixCls = getPrefixCls('dropdown', customizePrefixCls);
@@ -197,7 +201,7 @@ const Dropdown: DropdownInterface = props => {

  const builtinPlacements = getPlacements({
    arrowPointAtCenter: typeof arrow === 'object' && arrow.pointAtCenter,
-    autoAdjustOverflow: true,
+    autoAdjustOverflow,
  });

  const onMenuClick = React.useCallback(() => {
@@ -244,7 +248,7 @@ const Dropdown: DropdownInterface = props => {
          );
        }}
      >
-        {overlayNode}
+        <NoCompactStyle>{overlayNode}</NoCompactStyle>
      </OverrideProvider>
    );
  };
--- a/components/dropdown/index.en-US.md
+++ b/components/dropdown/index.en-US.md
@@ -51,6 +51,7 @@ return (
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
 | arrow | Whether the dropdown arrow should be visible | boolean \| { pointAtCenter: boolean } | false |  |
+| autoAdjustOverflow | Whether to adjust dropdown placement automatically when dropdown is off screen | boolean | true | >= 4.24.5 < 5.0.0 \|\| >= 5.2.0 |
 | autoFocus | Focus element in `overlay` when opened | boolean | false | 4.21.0 |
 | disabled | Whether the dropdown menu is disabled | boolean | - |  |
 | destroyPopupOnHide | Whether destroy dropdown when hidden | boolean | false |  |
--- a/components/dropdown/index.zh-CN.md
+++ b/components/dropdown/index.zh-CN.md
@@ -55,6 +55,7 @@ return (
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | arrow | 下拉框箭头是否显示 | boolean \| { pointAtCenter: boolean } | false |  |
+| autoAdjustOverflow | 下拉框被遮挡时自动调整位置 | boolean | true | >= 4.24.5 < 5.0.0 \|\| >= 5.2.0 |
 | autoFocus | 打开后自动聚焦下拉框 | boolean | false | 4.21.0 |
 | disabled | 菜单是否禁用 | boolean | - |  |
 | destroyPopupOnHide | 关闭后是否销毁 Dropdown | boolean | false |  |
--- a/components/dropdown/style/index.less
+++ b/components/dropdown/style/index.less
@@ -221,7 +221,7 @@
        background-color: @item-hover-bg;
      }

-      &-disabled {
+      &&-disabled {
        color: @disabled-color;
        cursor: not-allowed;

--- a/components/empty/index.tsx
+++ b/components/empty/index.tsx
@@ -23,12 +23,12 @@ export interface EmptyProps {
  children?: React.ReactNode;
 }

-interface EmptyType extends React.FC<EmptyProps> {
+type CompoundedComponent = React.FC<EmptyProps> & {
  PRESENTED_IMAGE_DEFAULT: React.ReactNode;
  PRESENTED_IMAGE_SIMPLE: React.ReactNode;
-}
+};

-const Empty: EmptyType = ({
+const Empty: CompoundedComponent = ({
  className,
  prefixCls: customizePrefixCls,
  image = defaultEmptyImg,
--- a/components/form/FormItem/index.tsx
+++ b/components/form/FormItem/index.tsx
@@ -385,11 +385,11 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea

 type InternalFormItemType = typeof InternalFormItem;

-interface FormItemInterface extends InternalFormItemType {
+type CompoundedComponent = InternalFormItemType & {
  useStatus: typeof useFormItemStatus;
-}
+};

-const FormItem = InternalFormItem as FormItemInterface;
+const FormItem = InternalFormItem as CompoundedComponent;
 FormItem.useStatus = useFormItemStatus;

 export default FormItem;
--- a/components/form/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/form/tests/snapshots/demo-extend.test.ts.snap
@@ -2764,7 +2764,7 @@ Array [
                          <div
                            aria-hidden="true"
                            class="ant-select-tree-treenode"
-                            style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden"
+                            style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden;border:0;padding:0"
                          >
                            <div
                              class="ant-select-tree-indent"
@@ -9858,7 +9858,7 @@ exports[`renders ./components/form/demo/size.md extend context correctly 1`] = `
                        <div
                          aria-hidden="true"
                          class="ant-select-tree-treenode"
-                          style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden"
+                          style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden;border:0;padding:0"
                        >
                          <div
                            class="ant-select-tree-indent"
@@ -24379,7 +24379,7 @@ exports[`renders ./components/form/demo/validate-static.md extend context correc
                        <div
                          aria-hidden="true"
                          class="ant-select-tree-treenode"
-                          style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden"
+                          style="position:absolute;pointer-events:none;visibility:hidden;height:0;overflow:hidden;border:0;padding:0"
                        >
                          <div
                            class="ant-select-tree-indent"
--- a/components/form/tests/snapshots/index.test.tsx.snap
+++ b/components/form/tests/snapshots/index.test.tsx.snap
@@ -138,7 +138,6 @@ exports[`Form form should support disabled 1`] = `
                  disabled=""
                  id="disabled"
                  type="checkbox"
-                  value=""
                />
                <span
                  class="ant-checkbox-inner"
--- a/components/form/index.tsx
+++ b/components/form/index.tsx
@@ -9,7 +9,7 @@ import useFormInstance from './hooks/useFormInstance';

 type InternalFormType = typeof InternalForm;

-interface FormInterface extends InternalFormType {
+type CompoundedComponent = InternalFormType & {
  useForm: typeof useForm;
  useFormInstance: typeof useFormInstance;
  useWatch: typeof useWatch;
@@ -20,9 +20,9 @@ interface FormInterface extends InternalFormType {

  /** @deprecated Only for warning usage. Do not use. */
  create: () => void;
-}
+};

-const Form = InternalForm as FormInterface;
+const Form = InternalForm as CompoundedComponent;

 Form.Item = Item;
 Form.List = List;
--- a/components/grid/tests/index.test.tsx
+++ b/components/grid/tests/index.test.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { Col, Row } from '..';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import ResponsiveObserve from '../../_util/responsiveObserve';
 import useBreakpoint from '../hooks/useBreakpoint';
-import { render, act } from '../../../tests/utils';
+import { render, act, fireEvent } from '../../../tests/utils';

 describe('Grid', () => {
  mountTest(Row);
@@ -183,4 +183,26 @@ describe('Grid', () => {
    const { container: container3 } = render(<Row justify={{ lg: 'center' }} />);
    expect(container3.innerHTML).not.toContain('ant-row-center');
  });
+
+  // https://github.com/ant-design/ant-design/issues/39690
+  it('Justify and align properties should reactive for Row', () => {
+    const ReactiveTest = () => {
+      const [justify, setJustify] = useState<any>('start');
+      return (
+        <>
+          <Row justify={justify} align="bottom">
+            <div>button1</div>
+            <div>button</div>
+          </Row>
+          <span onClick={() => setJustify('end')} />
+        </>
+      );
+    };
+    const { container } = render(<ReactiveTest />);
+    expect(container.innerHTML).toContain('ant-row-start');
+    act(() => {
+      fireEvent.click(container.querySelector('span')!);
+    });
+    expect(container.innerHTML).toContain('ant-row-end');
+  });
 });
--- a/components/grid/row.tsx
+++ b/components/grid/row.tsx
@@ -32,6 +32,9 @@ function useMergePropByScreen(oriProp: RowProps['align'] | RowProps['justify'],
  const [prop, setProp] = React.useState(typeof oriProp === 'string' ? oriProp : '');

  const clacMergeAlignOrJustify = () => {
+    if (typeof oriProp === 'string') {
+      setProp(oriProp);
+    }
    if (typeof oriProp !== 'object') {
      return;
    }
--- a/components/image/tests/snapshots/index.test.tsx.snap
+++ b/components/image/tests/snapshots/index.test.tsx.snap
@@ -40,6 +40,146 @@ exports[`Image Default Group preview props 1`] = `
      </div>
    </div>
  </div>
+  <div
+    class="ant-image-preview-operations-wrapper ant-fade-appear ant-fade-appear-start ant-fade"
+  >
+    <ul
+      class="ant-image-preview-operations"
+    >
+      <li
+        class="ant-image-preview-operations-progress"
+      >
+        1 / 1
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-close"
+      >
+        <span
+          aria-label="close"
+          class="anticon anticon-close ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="close"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <path
+              d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
+            />
+          </svg>
+        </span>
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-zoomIn"
+      >
+        <span
+          aria-label="zoom-in"
+          class="anticon anticon-zoom-in ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="zoom-in"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <path
+              d="M637 443H519V309c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v134H325c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h118v134c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V519h118c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm284 424L775 721c122.1-148.9 113.6-369.5-26-509-148-148.1-388.4-148.1-537 0-148.1 148.6-148.1 389 0 537 139.5 139.6 360.1 148.1 509 26l146 146c3.2 2.8 8.3 2.8 11 0l43-43c2.8-2.7 2.8-7.8 0-11zM696 696c-118.8 118.7-311.2 118.7-430 0-118.7-118.8-118.7-311.2 0-430 118.8-118.7 311.2-118.7 430 0 118.7 118.8 118.7 311.2 0 430z"
+            />
+          </svg>
+        </span>
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-zoomOut ant-image-preview-operations-operation-disabled"
+      >
+        <span
+          aria-label="zoom-out"
+          class="anticon anticon-zoom-out ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="zoom-out"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <path
+              d="M637 443H325c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h312c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm284 424L775 721c122.1-148.9 113.6-369.5-26-509-148-148.1-388.4-148.1-537 0-148.1 148.6-148.1 389 0 537 139.5 139.6 360.1 148.1 509 26l146 146c3.2 2.8 8.3 2.8 11 0l43-43c2.8-2.7 2.8-7.8 0-11zM696 696c-118.8 118.7-311.2 118.7-430 0-118.7-118.8-118.7-311.2 0-430 118.8-118.7 311.2-118.7 430 0 118.7 118.8 118.7 311.2 0 430z"
+            />
+          </svg>
+        </span>
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-rotateRight"
+      >
+        <span
+          aria-label="rotate-right"
+          class="anticon anticon-rotate-right ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="rotate-right"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <defs>
+              <style />
+            </defs>
+            <path
+              d="M480.5 251.2c13-1.6 25.9-2.4 38.8-2.5v63.9c0 6.5 7.5 10.1 12.6 6.1L660 217.6c4-3.2 4-9.2 0-12.3l-128-101c-5.1-4-12.6-.4-12.6 6.1l-.2 64c-118.6.5-235.8 53.4-314.6 154.2A399.75 399.75 0 00123.5 631h74.9c-.9-5.3-1.7-10.7-2.4-16.1-5.1-42.1-2.1-84.1 8.9-124.8 11.4-42.2 31-81.1 58.1-115.8 27.2-34.7 60.3-63.2 98.4-84.3 37-20.6 76.9-33.6 119.1-38.8z"
+            />
+            <path
+              d="M880 418H352c-17.7 0-32 14.3-32 32v414c0 17.7 14.3 32 32 32h528c17.7 0 32-14.3 32-32V450c0-17.7-14.3-32-32-32zm-44 402H396V494h440v326z"
+            />
+          </svg>
+        </span>
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-rotateLeft"
+      >
+        <span
+          aria-label="rotate-left"
+          class="anticon anticon-rotate-left ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="rotate-left"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <defs>
+              <style />
+            </defs>
+            <path
+              d="M672 418H144c-17.7 0-32 14.3-32 32v414c0 17.7 14.3 32 32 32h528c17.7 0 32-14.3 32-32V450c0-17.7-14.3-32-32-32zm-44 402H188V494h440v326z"
+            />
+            <path
+              d="M819.3 328.5c-78.8-100.7-196-153.6-314.6-154.2l-.2-64c0-6.5-7.6-10.1-12.6-6.1l-128 101c-4 3.1-3.9 9.1 0 12.3L492 318.6c5.1 4 12.7.4 12.6-6.1v-63.9c12.9.1 25.9.9 38.8 2.5 42.1 5.2 82.1 18.2 119 38.7 38.1 21.2 71.2 49.7 98.4 84.3 27.1 34.7 46.7 73.7 58.1 115.8a325.95 325.95 0 016.5 140.9h74.9c14.8-103.6-11.3-213-81-302.3z"
+            />
+          </svg>
+        </span>
+      </li>
+    </ul>
+  </div>
  <div>
    <div
      class="ant-image-preview-root"
@@ -69,12 +209,11 @@ exports[`Image Default Group preview props 1`] = `
            >
              <div
                class="ant-image-preview-img-wrapper"
-                style="transform: translate3d(0px, 0px, 0);"
              >
                <img
                  class="ant-image-preview-img"
                  src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
-                  style="transform: scale3d(1, 1, 1) rotate(0deg);"
+                  style="transform: translate3d(0px, 0px, 0) scale3d(1, 1, 1) rotate(0deg);"
                />
              </div>
            </div>
@@ -88,148 +227,6 @@ exports[`Image Default Group preview props 1`] = `
      </div>
    </div>
  </div>
-  <div>
-    <div
-      class="ant-image-preview-operations-wrapper ant-fade-appear ant-fade-appear-start ant-fade"
-    >
-      <ul
-        class="ant-image-preview-operations"
-      >
-        <li
-          class="ant-image-preview-operations-progress"
-        >
-          1 / 1
-        </li>
-        <li
-          class="ant-image-preview-operations-operation ant-image-preview-operations-operation-close"
-        >
-          <span
-            aria-label="close"
-            class="anticon anticon-close ant-image-preview-operations-icon"
-            role="img"
-          >
-            <svg
-              aria-hidden="true"
-              data-icon="close"
-              fill="currentColor"
-              focusable="false"
-              height="1em"
-              viewBox="64 64 896 896"
-              width="1em"
-            >
-              <path
-                d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
-              />
-            </svg>
-          </span>
-        </li>
-        <li
-          class="ant-image-preview-operations-operation ant-image-preview-operations-operation-zoomIn"
-        >
-          <span
-            aria-label="zoom-in"
-            class="anticon anticon-zoom-in ant-image-preview-operations-icon"
-            role="img"
-          >
-            <svg
-              aria-hidden="true"
-              data-icon="zoom-in"
-              fill="currentColor"
-              focusable="false"
-              height="1em"
-              viewBox="64 64 896 896"
-              width="1em"
-            >
-              <path
-                d="M637 443H519V309c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v134H325c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h118v134c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V519h118c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm284 424L775 721c122.1-148.9 113.6-369.5-26-509-148-148.1-388.4-148.1-537 0-148.1 148.6-148.1 389 0 537 139.5 139.6 360.1 148.1 509 26l146 146c3.2 2.8 8.3 2.8 11 0l43-43c2.8-2.7 2.8-7.8 0-11zM696 696c-118.8 118.7-311.2 118.7-430 0-118.7-118.8-118.7-311.2 0-430 118.8-118.7 311.2-118.7 430 0 118.7 118.8 118.7 311.2 0 430z"
-              />
-            </svg>
-          </span>
-        </li>
-        <li
-          class="ant-image-preview-operations-operation ant-image-preview-operations-operation-zoomOut ant-image-preview-operations-operation-disabled"
-        >
-          <span
-            aria-label="zoom-out"
-            class="anticon anticon-zoom-out ant-image-preview-operations-icon"
-            role="img"
-          >
-            <svg
-              aria-hidden="true"
-              data-icon="zoom-out"
-              fill="currentColor"
-              focusable="false"
-              height="1em"
-              viewBox="64 64 896 896"
-              width="1em"
-            >
-              <path
-                d="M637 443H325c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h312c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm284 424L775 721c122.1-148.9 113.6-369.5-26-509-148-148.1-388.4-148.1-537 0-148.1 148.6-148.1 389 0 537 139.5 139.6 360.1 148.1 509 26l146 146c3.2 2.8 8.3 2.8 11 0l43-43c2.8-2.7 2.8-7.8 0-11zM696 696c-118.8 118.7-311.2 118.7-430 0-118.7-118.8-118.7-311.2 0-430 118.8-118.7 311.2-118.7 430 0 118.7 118.8 118.7 311.2 0 430z"
-              />
-            </svg>
-          </span>
-        </li>
-        <li
-          class="ant-image-preview-operations-operation ant-image-preview-operations-operation-rotateRight"
-        >
-          <span
-            aria-label="rotate-right"
-            class="anticon anticon-rotate-right ant-image-preview-operations-icon"
-            role="img"
-          >
-            <svg
-              aria-hidden="true"
-              data-icon="rotate-right"
-              fill="currentColor"
-              focusable="false"
-              height="1em"
-              viewBox="64 64 896 896"
-              width="1em"
-            >
-              <defs>
-                <style />
-              </defs>
-              <path
-                d="M480.5 251.2c13-1.6 25.9-2.4 38.8-2.5v63.9c0 6.5 7.5 10.1 12.6 6.1L660 217.6c4-3.2 4-9.2 0-12.3l-128-101c-5.1-4-12.6-.4-12.6 6.1l-.2 64c-118.6.5-235.8 53.4-314.6 154.2A399.75 399.75 0 00123.5 631h74.9c-.9-5.3-1.7-10.7-2.4-16.1-5.1-42.1-2.1-84.1 8.9-124.8 11.4-42.2 31-81.1 58.1-115.8 27.2-34.7 60.3-63.2 98.4-84.3 37-20.6 76.9-33.6 119.1-38.8z"
-              />
-              <path
-                d="M880 418H352c-17.7 0-32 14.3-32 32v414c0 17.7 14.3 32 32 32h528c17.7 0 32-14.3 32-32V450c0-17.7-14.3-32-32-32zm-44 402H396V494h440v326z"
-              />
-            </svg>
-          </span>
-        </li>
-        <li
-          class="ant-image-preview-operations-operation ant-image-preview-operations-operation-rotateLeft"
-        >
-          <span
-            aria-label="rotate-left"
-            class="anticon anticon-rotate-left ant-image-preview-operations-icon"
-            role="img"
-          >
-            <svg
-              aria-hidden="true"
-              data-icon="rotate-left"
-              fill="currentColor"
-              focusable="false"
-              height="1em"
-              viewBox="64 64 896 896"
-              width="1em"
-            >
-              <defs>
-                <style />
-              </defs>
-              <path
-                d="M672 418H144c-17.7 0-32 14.3-32 32v414c0 17.7 14.3 32 32 32h528c17.7 0 32-14.3 32-32V450c0-17.7-14.3-32-32-32zm-44 402H188V494h440v326z"
-              />
-              <path
-                d="M819.3 328.5c-78.8-100.7-196-153.6-314.6-154.2l-.2-64c0-6.5-7.6-10.1-12.6-6.1l-128 101c-4 3.1-3.9 9.1 0 12.3L492 318.6c5.1 4 12.7.4 12.6-6.1v-63.9c12.9.1 25.9.9 38.8 2.5 42.1 5.2 82.1 18.2 119 38.7 38.1 21.2 71.2 49.7 98.4 84.3 27.1 34.7 46.7 73.7 58.1 115.8a325.95 325.95 0 016.5 140.9h74.9c14.8-103.6-11.3-213-81-302.3z"
-              />
-            </svg>
-          </span>
-        </li>
-      </ul>
-    </div>
-  </div>
 </body>
 `;

--- a/components/input-number/index.tsx
+++ b/components/input-number/index.tsx
@@ -11,7 +11,7 @@ import DisabledContext from '../config-provider/DisabledContext';
 import type { SizeType } from '../config-provider/SizeContext';
 import SizeContext from '../config-provider/SizeContext';
 import { FormItemInputContext, NoFormStyle } from '../form/context';
-import { useCompactItemContext } from '../space/Compact';
+import { NoCompactStyle, useCompactItemContext } from '../space/Compact';
 import { cloneElement } from '../_util/reactNode';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
@@ -180,15 +180,19 @@ const InputNumber = React.forwardRef<HTMLInputElement, InputNumberProps>((props,
      <div className={mergedGroupClassName} style={props.style}>
        <div className={mergedWrapperClassName}>
          {addonBeforeNode && (
-            <NoFormStyle status override>
-              {addonBeforeNode}
-            </NoFormStyle>
+            <NoCompactStyle>
+              <NoFormStyle status override>
+                {addonBeforeNode}
+              </NoFormStyle>
+            </NoCompactStyle>
          )}
          {cloneElement(element, { style: null, disabled: mergedDisabled })}
          {addonAfterNode && (
-            <NoFormStyle status override>
-              {addonAfterNode}
-            </NoFormStyle>
+            <NoCompactStyle>
+              <NoFormStyle status override>
+                {addonAfterNode}
+              </NoFormStyle>
+            </NoCompactStyle>
          )}
        </div>
      </div>
--- a/components/input/ClearableLabeledInput.tsx
+++ b/components/input/ClearableLabeledInput.tsx
@@ -78,6 +78,7 @@ class ClearableLabeledInput extends React.Component<ClearableInputProps> {
      value,
      allowClear,
      className,
+      focused,
      style,
      direction,
      bordered,
@@ -101,6 +102,7 @@ class ClearableLabeledInput extends React.Component<ClearableInputProps> {
        hasFeedback,
      ),
      {
+        [`${prefixCls}-affix-wrapper-focused`]: focused,
        [`${prefixCls}-affix-wrapper-rtl`]: direction === 'rtl',
        [`${prefixCls}-affix-wrapper-borderless`]: !bordered,
        // className will go to addon wrapper
--- a/components/input/TextArea.tsx
+++ b/components/input/TextArea.tsx
@@ -73,6 +73,8 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
      onCompositionStart,
      onCompositionEnd,
      onChange,
+      onFocus,
+      onBlur,
      status: customStatus,
      ...props
    },
@@ -97,6 +99,7 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
    const clearableInputRef = React.useRef<ClearableLabeledInput>(null);

    const [compositing, setCompositing] = React.useState(false);
+    const [focused, setFocused] = React.useState(false);
    const oldCompositionValueRef = React.useRef<string>();
    const oldSelectionStartRef = React.useRef<number>(0);

@@ -163,6 +166,20 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
      resolveOnChange(e.currentTarget, e, onChange, triggerValue);
    };

+    const handleBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {
+      setFocused(false);
+      onBlur?.(e);
+    };
+
+    const handleFocus = (e: React.FocusEvent<HTMLTextAreaElement>) => {
+      setFocused(true);
+      onFocus?.(e);
+    };
+
+    React.useEffect(() => {
+      setFocused((prev) => !mergedDisabled && prev);
+    }, [mergedDisabled]);
+
    // ============================== Reset ===============================
    const handleReset = (e: React.MouseEvent<HTMLElement, MouseEvent>) => {
      handleSetValue('');
@@ -197,6 +214,8 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
        prefixCls={prefixCls}
        onCompositionStart={onInternalCompositionStart}
        onChange={handleChange}
+        onBlur={handleBlur}
+        onFocus={handleFocus}
        onCompositionEnd={onInternalCompositionEnd}
        ref={innerRef}
      />
@@ -213,6 +232,7 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
    const textareaNode = (
      <ClearableLabeledInput
        disabled={mergedDisabled}
+        focused={focused}
        {...props}
        prefixCls={prefixCls}
        direction={direction}
--- a/components/input/tests/snapshots/textarea.test.tsx.snap
+++ b/components/input/tests/snapshots/textarea.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`TextArea allowClear should change type when click 1`] = `

 exports[`TextArea allowClear should change type when click 2`] = `
 <span
-  class="ant-input-affix-wrapper ant-input-affix-wrapper-textarea-with-clear-btn"
+  class="ant-input-affix-wrapper ant-input-affix-wrapper-textarea-with-clear-btn ant-input-affix-wrapper-focused"
 >
  <textarea
    class="ant-input"
--- a/components/input/tests/textarea.test.tsx
+++ b/components/input/tests/textarea.test.tsx
@@ -574,4 +574,14 @@ describe('TextArea allowClear', () => {

    textareaSpy.mockRestore();
  });
+
+  it('should have correct className when onFocus and onBlur', () => {
+    const { container } = render(<TextArea allowClear />);
+
+    fireEvent.focus(container.querySelector('textarea')!);
+    expect(container.querySelector('.ant-input-affix-wrapper-focused')).toBeTruthy();
+
+    fireEvent.blur(container.querySelector('textarea')!);
+    expect(container.querySelector('.ant-input-affix-wrapper-focused')).toBeFalsy();
+  });
 });
--- a/components/input/index.tsx
+++ b/components/input/index.tsx
@@ -12,13 +12,14 @@ export { PasswordProps } from './Password';
 export { SearchProps } from './Search';
 export { TextAreaProps } from './TextArea';

-interface CompoundedComponent
-  extends React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputRef>> {
+type CompoundedComponent = React.ForwardRefExoticComponent<
+  InputProps & React.RefAttributes<InputRef>
+> & {
  Group: typeof Group;
  Search: typeof Search;
  TextArea: typeof TextArea;
  Password: typeof Password;
-}
+};

 const Input = InternalInput as CompoundedComponent;

--- a/components/input/style/affix.less
+++ b/components/input/style/affix.less
@@ -24,7 +24,7 @@

    &-disabled {
      .@{ant-prefix}-input[disabled] {
-        background: transparent;
+        background: rgba(255, 255, 255, 0);
      }
    }

--- a/components/layout/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/layout/tests/snapshots/demo-extend.test.ts.snap
@@ -577,6 +577,7 @@ exports[`renders ./components/layout/demo/fixed.md extend context correctly 1`]
            <ul
              class="ant-menu ant-menu-sub ant-menu-vertical"
              data-menu-list="true"
+              role="menu"
            />
          </div>
        </div>
@@ -2107,6 +2108,7 @@ exports[`renders ./components/layout/demo/side.md extend context correctly 1`] =
              <ul
                class="ant-menu ant-menu-sub ant-menu-inline"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -2262,6 +2264,7 @@ exports[`renders ./components/layout/demo/side.md extend context correctly 1`] =
              <ul
                class="ant-menu ant-menu-sub ant-menu-inline"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -3225,6 +3228,7 @@ exports[`renders ./components/layout/demo/top.md extend context correctly 1`] =
            <ul
              class="ant-menu ant-menu-sub ant-menu-vertical"
              data-menu-list="true"
+              role="menu"
            />
          </div>
        </div>
@@ -3790,6 +3794,7 @@ exports[`renders ./components/layout/demo/top-side.md extend context correctly 1
            <ul
              class="ant-menu ant-menu-sub ant-menu-vertical"
              data-menu-list="true"
+              role="menu"
            />
          </div>
        </div>
@@ -3980,6 +3985,7 @@ exports[`renders ./components/layout/demo/top-side.md extend context correctly 1
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -4123,6 +4129,7 @@ exports[`renders ./components/layout/demo/top-side.md extend context correctly 1
              <ul
                class="ant-menu ant-menu-sub ant-menu-inline"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -4310,6 +4317,7 @@ exports[`renders ./components/layout/demo/top-side.md extend context correctly 1
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -4499,6 +4507,7 @@ exports[`renders ./components/layout/demo/top-side.md extend context correctly 1
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -5091,6 +5100,7 @@ exports[`renders ./components/layout/demo/top-side-2.md extend context correctly
            <ul
              class="ant-menu ant-menu-sub ant-menu-vertical"
              data-menu-list="true"
+              role="menu"
            />
          </div>
        </div>
@@ -5233,6 +5243,7 @@ exports[`renders ./components/layout/demo/top-side-2.md extend context correctly
                <ul
                  class="ant-menu ant-menu-sub ant-menu-inline"
                  data-menu-list="true"
+                  role="menu"
                >
                  <li
                    class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -5376,6 +5387,7 @@ exports[`renders ./components/layout/demo/top-side-2.md extend context correctly
            <ul
              class="ant-menu ant-menu-sub ant-menu-inline"
              data-menu-list="true"
+              role="menu"
            >
              <li
                class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -5563,6 +5575,7 @@ exports[`renders ./components/layout/demo/top-side-2.md extend context correctly
                <ul
                  class="ant-menu ant-menu-sub ant-menu-inline"
                  data-menu-list="true"
+                  role="menu"
                >
                  <li
                    class="ant-menu-item ant-menu-item-only-child"
@@ -5752,6 +5765,7 @@ exports[`renders ./components/layout/demo/top-side-2.md extend context correctly
                <ul
                  class="ant-menu ant-menu-sub ant-menu-inline"
                  data-menu-list="true"
+                  role="menu"
                >
                  <li
                    class="ant-menu-item ant-menu-item-only-child"
--- a/components/layout/tests/snapshots/demo.test.ts.snap
+++ b/components/layout/tests/snapshots/demo.test.ts.snap
@@ -1915,6 +1915,7 @@ exports[`renders ./components/layout/demo/top-side.md correctly 1`] = `
              <ul
                class="ant-menu ant-menu-sub ant-menu-inline"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -2227,6 +2228,7 @@ exports[`renders ./components/layout/demo/top-side-2.md correctly 1`] = `
            <ul
              class="ant-menu ant-menu-sub ant-menu-inline"
              data-menu-list="true"
+              role="menu"
            >
              <li
                class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
--- a/components/layout/index.tsx
+++ b/components/layout/index.tsx
@@ -6,14 +6,14 @@ export { SiderProps } from './Sider';

 type InternalLayoutType = typeof InternalLayout;

-interface LayoutType extends InternalLayoutType {
+type CompoundedComponent = InternalLayoutType & {
  Header: typeof Header;
  Footer: typeof Footer;
  Content: typeof Content;
  Sider: typeof Sider;
-}
+};

-const Layout = InternalLayout as LayoutType;
+const Layout = InternalLayout as CompoundedComponent;

 Layout.Header = Header;
 Layout.Footer = Footer;
--- a/components/locale-provider/tests/snapshots/index.test.tsx.snap
+++ b/components/locale-provider/tests/snapshots/index.test.tsx.snap
--- a/components/locale-provider/tests/index.test.tsx
+++ b/components/locale-provider/tests/index.test.tsx
@@ -80,6 +80,7 @@ import tkTK from '../tk_TK';
 import trTR from '../tr_TR';
 import ukUA from '../uk_UA';
 import urPK from '../ur_PK';
+import uzUZ from '../uz_UZ';
 import viVN from '../vi_VN';
 import zhCN from '../zh_CN';
 import zhHK from '../zh_HK';
@@ -146,6 +147,7 @@ const locales = [
  trTR,
  tkTK,
  ukUA,
+  uzUZ,
  viVN,
  idID,
  lvLV,
@@ -204,7 +206,7 @@ describe('Locale Provider', () => {
    MockDate.reset();
  });

-  locales.forEach(locale => {
+  locales.forEach((locale) => {
    it(`should display the text as ${locale.locale}`, () => {
      const { container } = render(
        <LocaleProvider locale={locale}>
@@ -216,7 +218,7 @@ describe('Locale Provider', () => {
  });

  it('should change locale of Modal.xxx', () => {
-    locales.forEach(locale => {
+    locales.forEach((locale) => {
      const { container } = render(
        <LocaleProvider locale={locale}>
          <Modal title="Locale Modal" visible getContainer={false}>
--- a/components/locale-provider/uz_UZ.tsx
+++ b/components/locale-provider/uz_UZ.tsx
@@ -0,0 +1,3 @@
+import locale from '../locale/uz_UZ';
+
+export default locale;
--- a/components/locale/pt_BR.tsx
+++ b/components/locale/pt_BR.tsx
@@ -21,6 +21,7 @@ const localeValues: Locale = {
    filterConfirm: 'OK',
    filterReset: 'Resetar',
    filterEmptyText: 'Sem filtros',
+    filterCheckall: 'Selecionar todos os items',
    emptyText: 'Sem conteúdo',
    selectAll: 'Selecionar página atual',
    selectInvert: 'Inverter seleção',
--- a/components/locale/uz_UZ.tsx
+++ b/components/locale/uz_UZ.tsx
@@ -0,0 +1,133 @@
+/* eslint-disable no-template-curly-in-string */
+
+import Pagination from 'rc-pagination/lib/locale/uz_UZ';
+import Calendar from '../calendar/locale/uz_UZ';
+import DatePicker from '../date-picker/locale/uz_UZ';
+import type { Locale } from '../locale-provider';
+import TimePicker from '../time-picker/locale/uz_UZ';
+
+const typeTemplate: string = '${label} ${type}-ning usulidan emas';
+
+const localeValues: Locale = {
+  locale: 'uz',
+  Pagination,
+  DatePicker,
+  TimePicker,
+  Calendar,
+  global: {
+    placeholder: 'Iltimos tanlang',
+  },
+  Table: {
+    filterTitle: 'Filtr',
+    filterConfirm: 'OK',
+    filterReset: 'Qayta tiklash',
+    filterEmptyText: 'Filtrsiz',
+    emptyText: "Ma'lumot yo'q",
+    selectAll: 'Hammasini tanlash',
+    selectInvert: 'Tanlovni kiritish',
+    selectNone: "Ma'lumotni ochirib tashlash",
+    selectionAll: "Ma'lumotning hammasini tanlash",
+    sortTitle: 'Saralash',
+    expand: 'Satirni kengaytirish',
+    collapse: 'Satirni qisqartirish',
+    triggerDesc: 'Kamayib borish tartibida saralashni bosing',
+    triggerAsc: "Ko'payib borish tartibida saralashni bosing",
+    cancelSort: 'Saralashni yakunlash uchun bosing',
+  },
+  Modal: {
+    okText: 'OK',
+    cancelText: 'Bekor qilish',
+    justOkText: 'OK',
+  },
+  Popconfirm: {
+    okText: 'OK',
+    cancelText: 'Bekor qilish',
+  },
+  Transfer: {
+    titles: ['', ''],
+    searchPlaceholder: 'Qidirish',
+    itemUnit: 'elem.',
+    itemsUnit: 'elem.',
+    remove: "O'chirish",
+    selectAll: "Ma'lumotning hammasini tanlash",
+    selectCurrent: 'Joriy sahifani tanlang',
+    selectInvert: "Kamayib borish tartibida ko'rsatish",
+    removeAll: "Ma'lumotning hammasini ochirish",
+    removeCurrent: 'Joriy sahifani ochirish',
+  },
+  Upload: {
+    uploading: 'Yuklash...',
+    removeFile: 'Faylni ochirish',
+    uploadError: 'Yuklashda xatolik yuz berdi',
+    previewFile: "Faylni oldindan ko'rib chiqish",
+    downloadFile: 'Faylni yuklash',
+  },
+  Empty: {
+    description: "Ma'lumot yo'q",
+  },
+  Icon: {
+    icon: 'belgi',
+  },
+  Text: {
+    edit: 'Tahrirlash',
+    copy: "Kopiya qilish'",
+    copied: 'Kopiya qilingan',
+    expand: 'Ochish',
+  },
+  PageHeader: {
+    back: 'Orqaga',
+  },
+  Form: {
+    defaultValidateMessages: {
+      default: 'Maydonni tekshirish xatosi ${label}',
+      required: 'Iltimos, ${label} kiriting',
+      enum: "${label} [${enum}] dan biri bo'lishi kerak",
+      whitespace: "${label} bo'sh bo'la olmaydi",
+      date: {
+        format: "${label} noto'g'ri sana ko'rinishi",
+        parse: '${label} sanaga aylanmadi',
+        invalid: "${label} noto'g'ri sana hisoblanadi",
+      },
+      types: {
+        string: typeTemplate,
+        method: typeTemplate,
+        array: typeTemplate,
+        object: typeTemplate,
+        number: typeTemplate,
+        date: typeTemplate,
+        boolean: typeTemplate,
+        integer: typeTemplate,
+        float: typeTemplate,
+        regexp: typeTemplate,
+        email: typeTemplate,
+        url: typeTemplate,
+        hex: typeTemplate,
+      },
+      string: {
+        len: "${label} ${len} belgilar bo'lishi kerak",
+        min: "${label} ${min} belgilaridan katta yoki teng bo'lishi kerak",
+        max: "${label} ${max} belgilaridan kam yoki teng bo'lishi kerak",
+        range: "${label} uzunligi ${min} - ${max} belgilar orasida bo'lishi kerak",
+      },
+      number: {
+        len: "${label} ${len}ga teng bo'lishi kerak",
+        min: "${label} ${min} dan katta yoki teng bo'lishi kerak",
+        max: "${label} ${max} dan kam yoki unga teng bo'lishi kerak",
+      },
+      array: {
+        len: "${label} elementlari soni ${len} ga teng bo'lishi kerak",
+        min: "${label} elementlari soni ${min} dan katta yoki teng bo'lishi kerak",
+        max: "${label} elementlari soni ${max} dan kam yoki unga teng bo'lishi kerak",
+        range: "${label} elementlari soni ${min} va ${max} orasida bo'lishi kerak",
+      },
+      pattern: {
+        mismatch: '${label} ${pattern} naqshga mos kelmaydi',
+      },
+    },
+  },
+  Image: {
+    preview: "Oldindan ko'rish",
+  },
+};
+
+export default localeValues;
--- a/components/mentions/tests/index.test.tsx
+++ b/components/mentions/tests/index.test.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import Mentions from '..';
+import Mentions,{ Option } from '..';
 import focusTest from '../../../tests/shared/focusTest';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
@@ -84,4 +84,39 @@ describe('Mentions', () => {
    expect(wrapper.container.querySelectorAll('li.ant-mentions-dropdown-menu-item').length).toBe(1);
    expect(wrapper.container.querySelectorAll('.bamboo-light').length).toBeTruthy();
  });
+  it('do not lose label when use children Option', () => {
+    const wrapper = render( <Mentions
+      style={{ width: '100%' }}
+    >
+      <Mentions.Option value="afc163">Afc163</Mentions.Option>
+      <Mentions.Option value="zombieJ">ZombieJ</Mentions.Option>
+      <Mentions.Option value="yesmeck">Yesmeck</Mentions.Option>
+    </Mentions>);
+    simulateInput(wrapper, '@');
+    const {container} = wrapper
+    fireEvent.mouseEnter(
+      container.querySelector('li.ant-mentions-dropdown-menu-item:last-child')!,
+    );
+    fireEvent.focus(container.querySelector('textarea')!);
+    act(() => {
+      jest.runAllTimers();
+    });
+    expect(
+      wrapper.container.querySelector('.ant-mentions-dropdown-menu-item-active')?.textContent,
+    ).toBe('Yesmeck');
+  });
+  it('warning if use Mentions.Option', () => {
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+    render(
+      <Mentions style={{ width: '100%' }} defaultValue="@afc163">
+        <Option value="afc163">afc163</Option>
+        <Option value="zombieJ">zombieJ</Option>
+        <Option value="yesmeck">yesmeck</Option>
+      </Mentions>,
+    );
+    expect(errorSpy).toHaveBeenCalledWith(
+      'Warning: [antd: Mentions] `Mentions.Option` is deprecated. Please use `options` instead.',
+    );
+  });
+
 });
--- a/components/mentions/demo/async.md
+++ b/components/mentions/demo/async.md
@@ -14,11 +14,10 @@ title:
 async

 ```tsx
+import React, { useCallback, useRef, useState } from 'react';
 import { Mentions } from 'antd';
 import debounce from 'lodash/debounce';
-import React, { useCallback, useRef, useState } from 'react';

-const { Option } = Mentions;
 const App: React.FC = () => {
  const [loading, setLoading] = useState(false);
  const [users, setUsers] = useState<{ login: string; avatar_url: string }[]>([]);
@@ -52,14 +51,22 @@ const App: React.FC = () => {
  };

  return (
-    <Mentions style={{ width: '100%' }} loading={loading} onSearch={onSearch}>
-      {users.map(({ login, avatar_url: avatar }) => (
-        <Option key={login} value={login} className="antd-demo-dynamic-option">
-          <img src={avatar} alt={login} />
-          <span>{login}</span>
-        </Option>
-      ))}
-    </Mentions>
+    <Mentions
+      style={{ width: '100%' }}
+      loading={loading}
+      onSearch={onSearch}
+      options={users.map(({ login, avatar_url: avatar }) => ({
+        key: login,
+        value: login,
+        className: 'antd-demo-dynamic-option',
+        label: (
+          <>
+            <img src={avatar} alt={login} />
+            <span>{login}</span>
+          </>
+        ),
+      }))}
+    />
  );
 };

--- a/components/mentions/demo/autoSize.md
+++ b/components/mentions/demo/autoSize.md
@@ -14,17 +14,28 @@ title:
 Height autoSize.

 ```tsx
-import { Mentions } from 'antd';
 import React from 'react';
-
-const { Option } = Mentions;
+import { Mentions } from 'antd';

 const App: React.FC = () => (
-  <Mentions autoSize style={{ width: '100%' }}>
-    <Option value="afc163">afc163</Option>
-    <Option value="zombieJ">zombieJ</Option>
-    <Option value="yesmeck">yesmeck</Option>
-  </Mentions>
+  <Mentions
+    autoSize
+    style={{ width: '100%' }}
+    options={[
+      {
+        value: 'afc163',
+        label: 'afc163',
+      },
+      {
+        value: 'zombieJ',
+        label: 'zombieJ',
+      },
+      {
+        value: 'yesmeck',
+        label: 'yesmeck',
+      },
+    ]}
+  />
 );

 export default App;
--- a/components/mentions/demo/basic.md
+++ b/components/mentions/demo/basic.md
@@ -14,17 +14,15 @@ title:
 Basic usage.

 ```tsx
-import { Mentions } from 'antd';
-import type { OptionProps } from 'antd/es/mentions';
 import React from 'react';
-
-const { Option } = Mentions;
+import { Mentions } from 'antd';
+import type { MentionsOptionProps } from 'antd/es/mentions';

 const onChange = (value: string) => {
  console.log('Change:', value);
 };

-const onSelect = (option: OptionProps) => {
+const onSelect = (option: MentionsOptionProps) => {
  console.log('select', option);
 };

@@ -34,11 +32,21 @@ const App: React.FC = () => (
    onChange={onChange}
    onSelect={onSelect}
    defaultValue="@afc163"
-  >
-    <Option value="afc163">afc163</Option>
-    <Option value="zombieJ">zombieJ</Option>
-    <Option value="yesmeck">yesmeck</Option>
-  </Mentions>
+    options={[
+      {
+        value: 'afc163',
+        label: 'afc163',
+      },
+      {
+        value: 'zombieJ',
+        label: 'zombieJ',
+      },
+      {
+        value: 'yesmeck',
+        label: 'yesmeck',
+      },
+    ]}
+  />
 );

 export default App;
--- a/components/mentions/demo/form.md
+++ b/components/mentions/demo/form.md
@@ -14,10 +14,10 @@ title:
 Controlled mode, for example, to work with `Form`.

 ```tsx
-import { Button, Form, Mentions } from 'antd';
 import React from 'react';
+import { Button, Form, Mentions } from 'antd';

-const { Option, getMentions } = Mentions;
+const { getMentions } = Mentions;

 const App: React.FC = () => {
  const [form] = Form.useForm();
@@ -52,11 +52,23 @@ const App: React.FC = () => {
        wrapperCol={{ span: 16 }}
        rules={[{ validator: checkMention }]}
      >
-        <Mentions rows={1}>
-          <Option value="afc163">afc163</Option>
-          <Option value="zombieJ">zombieJ</Option>
-          <Option value="yesmeck">yesmeck</Option>
-        </Mentions>
+        <Mentions
+          rows={1}
+          options={[
+            {
+              value: 'afc163',
+              label: 'afc163',
+            },
+            {
+              value: 'zombieJ',
+              label: 'zombieJ',
+            },
+            {
+              value: 'yesmeck',
+              label: 'yesmeck',
+            },
+          ]}
+        />
      </Form.Item>
      <Form.Item
        name="bio"
@@ -65,11 +77,24 @@ const App: React.FC = () => {
        wrapperCol={{ span: 16 }}
        rules={[{ required: true }]}
      >
-        <Mentions rows={3} placeholder="You can use @ to ref user here">
-          <Option value="afc163">afc163</Option>
-          <Option value="zombieJ">zombieJ</Option>
-          <Option value="yesmeck">yesmeck</Option>
-        </Mentions>
+        <Mentions
+          rows={3}
+          placeholder="You can use @ to ref user here"
+          options={[
+            {
+              value: 'afc163',
+              label: 'afc163',
+            },
+            {
+              value: 'zombieJ',
+              label: 'zombieJ',
+            },
+            {
+              value: 'yesmeck',
+              label: 'yesmeck',
+            },
+          ]}
+        />
      </Form.Item>
      <Form.Item wrapperCol={{ span: 14, offset: 6 }}>
        <Button htmlType="submit" type="primary">
--- a/components/mentions/demo/placement.md
+++ b/components/mentions/demo/placement.md
@@ -14,17 +14,28 @@ title:
 Change the suggestions placement.

 ```tsx
-import { Mentions } from 'antd';
 import React from 'react';
-
-const { Option } = Mentions;
+import { Mentions } from 'antd';

 const App: React.FC = () => (
-  <Mentions style={{ width: '100%' }} placement="top">
-    <Option value="afc163">afc163</Option>
-    <Option value="zombieJ">zombieJ</Option>
-    <Option value="yesmeck">yesmeck</Option>
-  </Mentions>
+  <Mentions
+    style={{ width: '100%' }}
+    placement="top"
+    options={[
+      {
+        value: 'afc163',
+        label: 'afc163',
+      },
+      {
+        value: 'zombieJ',
+        label: 'zombieJ',
+      },
+      {
+        value: 'yesmeck',
+        label: 'yesmeck',
+      },
+    ]}
+  />
 );

 export default App;
--- a/components/mentions/demo/prefix.md
+++ b/components/mentions/demo/prefix.md
@@ -14,10 +14,8 @@ title:
 Customize Trigger Token by `prefix` props. Default to `@`, `Array<string>` also supported.

 ```tsx
-import { Mentions } from 'antd';
 import React, { useState } from 'react';
-
-const { Option } = Mentions;
+import { Mentions } from 'antd';

 const MOCK_DATA = {
  '@': ['afc163', 'zombiej', 'yesmeck'],
@@ -39,13 +37,12 @@ const App: React.FC = () => {
      placeholder="input @ to mention people, # to mention tag"
      prefix={['@', '#']}
      onSearch={onSearch}
-    >
-      {(MOCK_DATA[prefix] || []).map(value => (
-        <Option key={value} value={value}>
-          {value}
-        </Option>
-      ))}
-    </Mentions>
+      options={(MOCK_DATA[prefix] || []).map(value => ({
+        key: value,
+        value,
+        label: value,
+      }))}
+    />
  );
 };

--- a/components/mentions/demo/readonly.md
+++ b/components/mentions/demo/readonly.md
@@ -14,28 +14,31 @@ title:
 Configurate `disabled` and `readOnly`.

 ```tsx
-import { Mentions } from 'antd';
 import React from 'react';
+import { Mentions } from 'antd';

-const { Option } = Mentions;
-
-const getOptions = () =>
-  ['afc163', 'zombiej', 'yesmeck'].map(value => (
-    <Option key={value} value={value}>
-      {value}
-    </Option>
-  ));
+const options = ['afc163', 'zombiej', 'yesmeck'].map(value => ({
+  value,
+  key: value,
+  label: value,
+}));

 const App: React.FC = () => (
  <>
    <div style={{ marginBottom: 10 }}>
-      <Mentions style={{ width: '100%' }} placeholder="this is disabled Mentions" disabled>
-        {getOptions()}
-      </Mentions>
+      <Mentions
+        style={{ width: '100%' }}
+        placeholder="this is disabled Mentions"
+        disabled
+        options={options}
+      />
    </div>
-    <Mentions style={{ width: '100%' }} placeholder="this is readOnly Mentions" readOnly>
-      {getOptions()}
-    </Mentions>
+    <Mentions
+      style={{ width: '100%' }}
+      placeholder="this is readOnly Mentions"
+      readOnly
+      options={options}
+    />
  </>
 );

--- a/components/mentions/index.en-US.md
+++ b/components/mentions/index.en-US.md
@@ -11,14 +11,26 @@ Mention component.

 When you need to mention someone or something.

-## API
+### Usage upgrade after 4.24.4
+
+```__react
+import Alert from '../alert';
+ReactDOM.render(<Alert message="After version 4.24.4, we provide a simpler usage <Mentions options={[...]} />  with better performance and potential of writing simpler code style in your applications. Meanwhile, we deprecated the old usage in browser console, we will remove it in antd 5.0." />, mountNode);
+```

 ```jsx
+// works when >=4.24.4, recommended ✅
+const options = [{ value: 'sample', label: 'sample' }];
+return <Mentions options={options} />;
+
+// works when <4.24.4, deprecated when >=4.24.4 🙅🏻‍♀️
 <Mentions onChange={onChange}>
  <Mentions.Option value="sample">Sample</Mentions.Option>
-</Mentions>
+</Mentions>;
 ```

+## API
+
 ### Mention

 | Property | Description | Type | Default | Version |
@@ -41,6 +53,7 @@ When you need to mention someone or something.
 | onResize | The callback function that is triggered when textarea resize | function({ width, height }) | - |  |
 | onSearch | Trigger when prefix hit | (text: string, prefix: string) => void | - |  |
 | onSelect | Trigger when user select the option | (option: OptionProps, prefix: string) => void | - |  |
+| options | Option Configuration | [Options](#Option) | \[] | 4.24.4 |

 ### Mention methods

@@ -53,5 +66,9 @@ When you need to mention someone or something.

 | Property | Description | Type | Default |
 | --- | --- | --- | --- |
-| children | Suggestion content | ReactNode | - |
 | value | The value of suggestion, the value will insert into input filed while selected | string | - |
+| label | Title of the option | React.ReactNode | - |
+| key | The key value of the option | string | - |
+| disabled | Optional | boolean | - |
+| className | className | string | - |
+| style | The style of the option | React.CSSProperties | - |
--- a/components/mentions/index.tsx
+++ b/components/mentions/index.tsx
@@ -3,6 +3,7 @@ import RcMentions from 'rc-mentions';
 import type {
  MentionsProps as RcMentionsProps,
  MentionsRef as RcMentionsRef,
+  DataDrivenOptionProps as MentionsOptionProps,
 } from 'rc-mentions/lib/Mentions';
 import { composeRef } from 'rc-util/lib/ref';
 import * as React from 'react';
@@ -12,6 +13,7 @@ import { FormItemInputContext } from '../form/context';
 import Spin from '../spin';
 import type { InputStatus } from '../_util/statusUtils';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
+import warning from '../_util/warning';

 export const { Option } = RcMentions;

@@ -21,6 +23,8 @@ function loadingFilterOption() {

 export type MentionPlacement = 'top' | 'bottom';

+export type { DataDrivenOptionProps as MentionsOptionProps } from 'rc-mentions/lib/Mentions';
+
 export interface OptionProps {
  value: string;
  children: React.ReactNode;
@@ -30,6 +34,7 @@ export interface OptionProps {
 export interface MentionProps extends RcMentionsProps {
  loading?: boolean;
  status?: InputStatus;
+  options?: MentionsOptionProps[];
 }

 export interface MentionsRef extends RcMentionsRef {}
@@ -48,11 +53,12 @@ interface MentionsEntity {
  value: string;
 }

-interface CompoundedComponent
-  extends React.ForwardRefExoticComponent<MentionProps & React.RefAttributes<MentionsRef>> {
+type CompoundedComponent = React.ForwardRefExoticComponent<
+  MentionProps & React.RefAttributes<MentionsRef>
+> & {
  Option: typeof Option;
  getMentions: (value: string, config?: MentionsConfig) => MentionsEntity[];
-}
+};

 const InternalMentions: React.ForwardRefRenderFunction<MentionsRef, MentionProps> = (
  {
@@ -63,6 +69,7 @@ const InternalMentions: React.ForwardRefRenderFunction<MentionsRef, MentionProps
    filterOption,
    children,
    notFoundContent,
+    options,
    status: customStatus,
    ...restProps
  },
@@ -71,6 +78,16 @@ const InternalMentions: React.ForwardRefRenderFunction<MentionsRef, MentionProps
  const [focused, setFocused] = React.useState(false);
  const innerRef = React.useRef<MentionsRef>();
  const mergedRef = composeRef(ref, innerRef);
+
+  // =================== Warning =====================
+  if (process.env.NODE_ENV !== 'production') {
+    warning(
+      !children,
+      'Mentions',
+      '`Mentions.Option` is deprecated. Please use `options` instead.',
+    );
+  }
+
  const { getPrefixCls, renderEmpty, direction } = React.useContext(ConfigContext);
  const {
    status: contextStatus,
@@ -114,6 +131,16 @@ const InternalMentions: React.ForwardRefRenderFunction<MentionsRef, MentionProps
    return children;
  };

+  const mergedOptions = loading
+    ? [
+        {
+          value: 'ANTD_SEARCHING',
+          disabled: true,
+          label: <Spin size="small" />,
+        },
+      ]
+    : options;
+
  const getFilterOption = (): any => {
    if (loading) {
      return loadingFilterOption;
@@ -145,6 +172,7 @@ const InternalMentions: React.ForwardRefRenderFunction<MentionsRef, MentionProps
      onFocus={onFocus}
      onBlur={onBlur}
      ref={mergedRef as any}
+      options={mergedOptions}
    >
      {getOptions()}
    </RcMentions>
@@ -185,7 +213,7 @@ Mentions.getMentions = (value: string = '', config: MentionsConfig = {}): Mentio
    .map((str = ''): MentionsEntity | null => {
      let hitPrefix: string | null = null;

-      prefixList.some(prefixStr => {
+      prefixList.some((prefixStr) => {
        const startStr = str.slice(0, prefixStr.length);
        if (startStr === prefixStr) {
          hitPrefix = prefixStr;
--- a/components/mentions/index.zh-CN.md
+++ b/components/mentions/index.zh-CN.md
@@ -12,14 +12,26 @@ cover: https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg

 用于在输入中提及某人或某事，常用于发布、聊天或评论功能。

-## API
+### 4.24.4 用法升级
+
+```__react
+import Alert from '../alert';
+ReactDOM.render(<Alert message="在 4.24.4 版本后，我们提供了 <Mentions options={[...]} /> 的简写方式，有更好的性能和更方便的数据组织方式，开发者不再需要自行拼接 JSX。同时我们废弃了原先的写法，你还是可以在 4.x 继续使用，但会在控制台看到警告，并会在 5.0 后移除。" />, mountNode);
+```

 ```jsx
+// >=4.24.4 可用，推荐的写法 ✅
+const options = [{ value: 'sample', label: 'sample' }];
+return <Mentions options={options} />;
+
+// <4.24.4 可用，>=4.24.4 时不推荐 🙅🏻‍♀️
 <Mentions onChange={onChange}>
  <Mentions.Option value="sample">Sample</Mentions.Option>
-</Mentions>
+</Mentions>;
 ```

+## API
+
 ### Mentions

 | 参数 | 说明 | 类型 | 默认值 | 版本 |
@@ -42,6 +54,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg
 | onResize | resize 回调 | function({ width, height }) | - |  |
 | onSearch | 搜索时触发 | (text: string, prefix: string) => void | - |  |
 | onSelect | 选择选项时触发 | (option: OptionProps, prefix: string) => void | - |  |
+| options | 选项配置 | [Options](#Option) | [] | 4.24.4 |

 ### Mentions 方法

@@ -52,7 +65,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg

 ### Option

-| 参数     | 说明           | 类型      | 默认值 |
-| -------- | -------------- | --------- | ------ |
-| children | 选项内容       | ReactNode | -      |
-| value    | 选择时填充的值 | string    | -      |
+| 参数      | 说明           | 类型                | 默认值 |
+| --------- | -------------- | ------------------- | ------ |
+| value     | 选择时填充的值 | string              | -      |
+| label     | 选项的标题     | React.ReactNode     | -      |
+| key       | 选项的 key 值  | string              | -      |
+| disabled  | 是否可选       | boolean             | -      |
+| className | css 类名       | string              | -      |
+| style     | 选项样式       | React.CSSProperties | -      |
--- a/components/menu/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/menu/tests/snapshots/demo-extend.test.ts.snap
@@ -146,6 +146,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          />
        </div>
      </div>
@@ -508,6 +509,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          />
        </div>
      </div>
@@ -732,18 +734,22 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item-group"
+              role="presentation"
            >
              <div
                class="ant-menu-item-group-title"
+                role="presentation"
                title="Item 1"
              >
                Item 1
              </div>
              <ul
                class="ant-menu-item-group-list"
+                role="group"
              >
                <li
                  class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -817,15 +823,18 @@ Array [
            </li>
            <li
              class="ant-menu-item-group"
+              role="presentation"
            >
              <div
                class="ant-menu-item-group-title"
+                role="presentation"
                title="Item 2"
              >
                Item 2
              </div>
              <ul
                class="ant-menu-item-group-list"
+                role="group"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -903,18 +912,22 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -988,15 +1001,18 @@ Array [
        </li>
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 2"
          >
            Item 2
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -1118,6 +1134,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -1216,6 +1233,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -1341,6 +1359,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -1997,6 +2016,7 @@ exports[`renders ./components/menu/demo/inline-collapsed.md extend context corre
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -2140,6 +2160,7 @@ exports[`renders ./components/menu/demo/inline-collapsed.md extend context corre
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -2327,6 +2348,7 @@ exports[`renders ./components/menu/demo/inline-collapsed.md extend context corre
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -2425,6 +2447,7 @@ exports[`renders ./components/menu/demo/inline-collapsed.md extend context corre
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -2810,6 +2833,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -2953,6 +2977,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -3140,6 +3165,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -3238,6 +3264,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -3363,6 +3390,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -3850,6 +3878,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -3951,6 +3980,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -4005,6 +4035,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-vertical"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -4144,6 +4175,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -4630,6 +4662,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -4728,6 +4761,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -4807,6 +4841,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -4905,6 +4940,7 @@ Array [
              <ul
                class="ant-menu ant-menu-sub ant-menu-inline"
                data-menu-list="true"
+                role="menu"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -5028,6 +5064,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -5553,6 +5590,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -5696,6 +5734,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -5883,6 +5922,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -5981,6 +6021,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-inline"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -6106,6 +6147,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -6576,18 +6618,22 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item-group"
+              role="presentation"
            >
              <div
                class="ant-menu-item-group-title"
+                role="presentation"
                title="Item 1"
              >
                Item 1
              </div>
              <ul
                class="ant-menu-item-group-list"
+                role="group"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -6659,15 +6705,18 @@ Array [
            </li>
            <li
              class="ant-menu-item-group"
+              role="presentation"
            >
              <div
                class="ant-menu-item-group-title"
+                role="presentation"
                title="Item 2"
              >
                Item 2
              </div>
              <ul
                class="ant-menu-item-group-list"
+                role="group"
              >
                <li
                  class="ant-menu-item ant-menu-item-only-child"
@@ -6788,6 +6837,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -6883,6 +6933,7 @@ Array [
                  <ul
                    class="ant-menu ant-menu-sub ant-menu-vertical"
                    data-menu-list="true"
+                    role="menu"
                  >
                    <li
                      class="ant-menu-item ant-menu-item-only-child"
@@ -7005,6 +7056,7 @@ Array [
          <ul
            class="ant-menu ant-menu-sub ant-menu-vertical"
            data-menu-list="true"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
--- a/components/menu/tests/snapshots/demo.test.ts.snap
+++ b/components/menu/tests/snapshots/demo.test.ts.snap
@@ -351,18 +351,22 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 1"
          >
            Item 1
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
@@ -392,15 +396,18 @@ Array [
        </li>
        <li
          class="ant-menu-item-group"
+          role="presentation"
        >
          <div
            class="ant-menu-item-group-title"
+            role="presentation"
            title="Item 2"
          >
            Item 2
          </div>
          <ul
            class="ant-menu-item-group-list"
+            role="group"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -691,6 +698,7 @@ exports[`renders ./components/menu/demo/inline-collapsed.md correctly 1`] = `
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -843,6 +851,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -1368,6 +1377,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -1572,6 +1582,7 @@ Array [
      <ul
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-selected ant-menu-item-only-child"
--- a/components/menu/tests/snapshots/index.test.tsx.snap
+++ b/components/menu/tests/snapshots/index.test.tsx.snap
@@ -197,6 +197,7 @@ exports[`Menu all types must be available in the "items" syntax 1`] = `
        class="ant-menu ant-menu-sub ant-menu-inline"
        data-menu-list="true"
        id="rc-menu-uuid-test-submenu-popup"
+        role="menu"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -231,15 +232,18 @@ exports[`Menu all types must be available in the "items" syntax 1`] = `
    />
    <li
      class="ant-menu-item-group"
+      role="presentation"
    >
      <div
        class="ant-menu-item-group-title"
+        role="presentation"
        title="Group"
      >
        Group
      </div>
      <ul
        class="ant-menu-item-group-list"
+        role="group"
      >
        <li
          class="ant-menu-item ant-menu-item-only-child"
@@ -284,6 +288,7 @@ exports[`Menu all types must be available in the "items" syntax 1`] = `
            class="ant-menu ant-menu-sub ant-menu-inline"
            data-menu-list="true"
            id="rc-menu-uuid-test-group-submenu-popup"
+            role="menu"
          >
            <li
              class="ant-menu-item ant-menu-item-only-child"
@@ -344,12 +349,15 @@ HTMLCollection [
    </li>
    <li
      class="ant-menu-item-group"
+      role="presentation"
    >
      <div
        class="ant-menu-item-group-title"
+        role="presentation"
      />
      <ul
        class="ant-menu-item-group-list"
+        role="group"
      />
    </li>
    <li
--- a/components/menu/style/index.less
+++ b/components/menu/style/index.less
@@ -665,6 +665,7 @@

    a {
      color: @disabled-color !important;
+      pointer-events: none;
    }

    > .@{menu-prefix-cls}-submenu-title {
--- a/components/message/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/message/tests/snapshots/demo-extend.test.ts.snap
@@ -45,14 +45,35 @@ 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 ant-btn-default"
-  type="button"
+<div
+  class="ant-space ant-space-horizontal ant-space-align-center"
 >
-  <span>
-    Display a loading indicator
-  </span>
-</button>
+  <div
+    class="ant-space-item"
+    style="margin-right:8px"
+  >
+    <button
+      class="ant-btn ant-btn-default"
+      type="button"
+    >
+      <span>
+        Display a loading indicator
+      </span>
+    </button>
+  </div>
+  <div
+    class="ant-space-item"
+  >
+    <button
+      class="ant-btn ant-btn-default"
+      type="button"
+    >
+      <span>
+        Display a loading and auto hide
+      </span>
+    </button>
+  </div>
+</div>
 `;

 exports[`renders ./components/message/demo/other.md extend context correctly 1`] = `
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
二货爱吃白萝卜	9b59ec8761	docs: 4.24.9 changelog (#41887 ) * docs: 4.24.9 changelog * docs: update changelog * docs: update changelog * docs: update changelog	2023-04-20 11:43:59 +08:00
Amumu	bde604f086	chore: 4.x 更新 rc-checkbox, 无新功能 (#41888 )	2023-04-19 17:41:55 +08:00
二货爱吃白萝卜	a9e968757d	docs: update docs link (#41883 )	2023-04-19 15:49:47 +08:00
Stanislav	0e432de45c	feat: support for railStyle prop to Slider component (#40942 )	2023-04-17 17:33:32 +08:00
afc163	86ebf65297	fix: Select width getting smaller when search (#41646 ) * chore: upgrade rc-select * demo: update select size demo * demo: update select size demo * fix rc-select version * fix rc-select version * demo: fix Select demo	2023-04-07 23:47:23 +08:00
muxin	307b76b478	style: textarea should avtive when focused (#41281 )	2023-03-21 10:42:53 +08:00
Amumu	7ba8c7a8f2	chore: fix ci failed (#41286 ) * chore: fix ci failed * chore: update demo	2023-03-17 00:28:18 +08:00
叶枫	476b70fcf2	fix: 泛型非必传 (#40960 )	2023-02-28 11:03:12 +08:00
叶枫	7a3c4921b1	fix: remove Cascader warning when use displayRender and multiple together (#40940 )	2023-02-28 10:07:35 +08:00
二货爱吃白萝卜	b4015b6370	chore: test clean up log (#40955 )	2023-02-27 23:32:27 +08:00
二货机器人	4a3cd57d81	chore: add missing deps	2023-02-22 13:17:53 +08:00
二货机器人	9c0033029d	docs: rm ood link close #40869	2023-02-22 11:46:43 +08:00
afc163	a42a488075	Update default.less (#40823 )	2023-02-21 18:02:43 +08:00
afc163	c43f2d74e5	test: upgrade github actions node version for 4.x (#40825 ) * test: upgrade github actions node version * chore: upgrade @testing-library/* * chore: upgrade @testing-library/* * fix: preview build * fix: preview build	2023-02-21 16:52:48 +08:00
MadCcc	517cd60f4f	ci: update notification token	2023-02-13 14:14:40 +08:00
MadCcc	77b4f15424	dcos: update changelog date	2023-02-13 11:52:50 +08:00
MadCcc	69ddd95b2e	docs: changelog 4.24.8 (#40561 ) * docs: changelog 4.24.8 * chore: lock eslint-plugin-compat (#40558) * chore: clean * chore: update	2023-02-13 11:38:23 +08:00
Amumu	a22d7be569	chore: fix test failed(4.x) (#40626 ) * chore: fix test failed * lock eslint-plugin-compat * prettier * Revert "prettier" This reverts commit `af183295a5`. * prettier	2023-02-13 11:08:05 +08:00
MadCcc	df09516ee5	chore: bump rc-tabs to 12.5.6	2023-02-06 11:46:57 +08:00
dong	a4ce1bc5ae	fix: dropdown accidental opening of container (#38520 )	2023-01-12 18:27:02 +08:00
Rafael Carvalho	a52033c725	fix: missing translation for Brazilian Portuguese (#40019 ) The filterCheckall "Select all items" locale for the Table Filter is missing in Brazilian Portuguese	2023-01-05 09:47:56 +08:00
Dave	ae62ef7087	[v4] Fix(types): external module type error (CompoundedComponent) (#39058 ) * fix(types): external module type error (CompoundedComponent) * feat(types): export CountdownProps	2023-01-03 11:46:48 +08:00
MadCcc	c5198a4d11	chore: changelog 4.24.7 (#39922 )	2022-12-30 16:09:07 +08:00
Wuxh	6e488bad41	docs: document links point to `4x` (#39909 )	2022-12-30 12:24:23 +08:00
Zack Chang	f24081d1e0	feat: add v5 docVersions (#39872 ) Co-authored-by: zhangjianxiong <zhangjx@tsintergy.com>	2022-12-28 23:59:21 +08:00
MadCcc	21a5510621	chore: bump rc-tabs version (#39867 ) * chore: bump rc-tabs version * chore: update snapshot	2022-12-28 18:09:44 +08:00
ifujustayup	acce38763d	fix(input): fix Input changes color when suffix is applied in Safari (#38627 ) (#39830 )	2022-12-27 16:18:53 +08:00
vagusX	db65137fda	docs: changelog v4.24.6 (#39817 ) * docs: changelog v4.24.6 * Update CHANGELOG.en-US.md Co-authored-by: afc163 <afc163@gmail.com> * Update CHANGELOG.zh-CN.md Co-authored-by: afc163 <afc163@gmail.com> Co-authored-by: afc163 <afc163@gmail.com>	2022-12-26 17:32:05 +08:00
JarvisArt	590c397b12	chore: Image preview interactive optimization (#39813 )	2022-12-26 16:21:10 +08:00
kiner-tang(文辉)	671c6b7e54	fix(table): reset aria-label in table column (#39747 ) * feat: reset aria-label in table column * feat: update snapshots	2022-12-23 10:44:52 +08:00
MadCcc	62cefcae89	feat: Dropdown support autoAdjustOverflow (#39741 ) * feat: Dropdown support autoAdjustOverflow (#39735) * feat: Dropdown support autoAdjustOverflow * docs: api * docs: update api desc * docs: update	2022-12-23 10:40:11 +08:00
ChenXiao	dc6a26f201	fix(grid): fix justify and align properties are not reactive for Row (#39706 ) * fix(grid): fix justify and align properties are not reactive for Row * Update components/grid/__tests__/index.test.tsx Co-authored-by: azro352 <35503478+azro352@users.noreply.github.com> * Update components/grid/__tests__/index.test.tsx Co-authored-by: azro352 <35503478+azro352@users.noreply.github.com>	2022-12-22 10:59:54 +08:00
@linhf2023	c8f4225361	docs: Add FAQ about `@line-height-base` (#39565 )	2022-12-17 15:52:15 +08:00
Wuxh	eb616d479c	fix: fix drop down menu style issue (#39434 ) fix: https://github.com/ant-design/ant-design/issues/39322	2022-12-15 18:36:32 +08:00
MadCcc	00abec4bb3	fix: Drawer should close if open is false (#39561 ) * fix: Drawer should close if open is false * chore: update script * chore: update deps	2022-12-15 12:02:15 +08:00
xrkffgg	aa3bd3f20e	ci: add latest for v5 (#39412 ) * ci: add latest for v5 * Update release-helper.yml	2022-12-09 10:23:15 +08:00
二货爱吃白萝卜	f4d011623e	docs: note for getContainer (#39379 ) * docs: note for getContainer * chore: update gitignore	2022-12-08 00:26:29 +08:00
Paul Damnhorns	c71fece3b1	feat: add uz_UZ locale (#39353 )	2022-12-07 16:59:18 +08:00
afc163	20158b2277	chore: update size-limit.yml (#39338 )	2022-12-07 12:17:30 +08:00
二货爱吃白萝卜	d6ae60cd01	fix: Divider horizontal line align (#39334 ) * fix: divider hor align * test: Update snapshot	2022-12-07 11:42:32 +08:00
二货爱吃白萝卜	5357dedb9e	chore: update limit (#39332 )	2022-12-07 11:10:46 +08:00
二货机器人	50f89ac8a5	chore: tag latest-4	2022-12-06 14:02:33 +08:00
二货机器人	41f506ea65	chore: adjust auto tag	2022-12-06 13:55:46 +08:00
二货爱吃白萝卜	9f0379bd1b	docs: 4.24.5 changelog (#39267 ) * docs: 4.25.5 changelog * test: Update snapshot * chore: fix ci * chore: update script * test: Update snapshot * test: Update snapshot * test: Update snapshot * chore: clean up * chore: clean up bundlesize * chore: back of bundle size	2022-12-06 11:43:45 +08:00
二货机器人	aa8d7f5ca9	fix: MenuItem disabled not block a click	2022-12-01 17:31:28 +08:00
justanotheranonymoususer	c5a4359900	style: popconfirm icon position regression (#39027 )	2022-12-01 14:46:13 +08:00
Wuxh	1da8126123	fix(steps): fix steps style (#39103 ) * docs(steps): update demo * fix(steps): fix steps style fix #39088 * test: update snapshot * fix: update * chore: additional RTL styles	2022-12-01 11:05:42 +08:00
二货爱吃白萝卜	88e360d79d	docs: Update demo (#39127 )	2022-11-30 22:51:06 +08:00
MadCcc	aa1945d9ae	Revert "docs: fix 404" This reverts commit `1f0fbd4dcf`.	2022-11-30 11:27:26 +08:00
Wuxh	647a03af09	fix(badge): fix the color cannot be customized when count is 0 (#39062 ) * test(badge): add case * fix(badge): fix the color cannot be customized when count is 0 * test(badge): update snapshots * docs(badge): update demo * test: update case * test(badge): update snapshots	2022-11-29 09:49:18 +08:00
justanotheranonymoususer	8e8a073c33	fix: Card meta default width (4.x) (#39039 ) * Fix #39025 * Update components/card/style/index.less Co-authored-by: afc163 <afc163@gmail.com> * Update index.less Co-authored-by: afc163 <afc163@gmail.com>	2022-11-28 00:22:17 +08:00
kiner-tang(文辉)	d1ac522d96	fix: TimePicker `popupClassName` unexpect warning (#39010 )	2022-11-27 22:28:29 +08:00
MadCcc	1643cb72b3	chore: add dist-tag v4	2022-11-25 17:09:34 +08:00
MadCcc	50ea91a4de	chore: update snapshot	2022-11-25 16:17:42 +08:00
MadCcc	1f0fbd4dcf	docs: fix 404	2022-11-25 15:50:56 +08:00
MadCcc	a44668f355	docs: 4.24.4 changelog (#38981 ) * docs: 4.24.4 changelog * chore: update changelog	2022-11-25 14:35:11 +08:00
Yuki Zhang	3b48ffa247	fix: v4 Space.Compact when wrapping a single child component (#38913 )	2022-11-24 20:12:20 +08:00
Yuki Zhang	3af410ab3f	fix: context issues for Space.Compact (#38887 )	2022-11-23 22:30:26 +08:00
黑雨	066be35de3	feat: support options (#38876 ) * feat: support options * feat: update package * feat: update package * feat: update doc * feat: update doc * feat: update doc * feat: add test case	2022-11-23 21:00:24 +08:00
dainli	6f4b96567b	bugfix(DisabledContextProvider): fix disabled logic (#38886 ) * bugfix(DisabledContextProvider): fix disabled logic * test: add test for ConfigProvider componentDisabled Co-authored-by: dian.li <dian.li@yunzhanghu.com>	2022-11-23 11:04:23 +08:00
MadCcc	428803924f	chore: update host judgement in modal	2022-11-21 10:44:19 +08:00
afc163	755c3c549f	docs: update default.less github url	2022-11-18 22:51:01 +08:00
二货机器人	90a5a9f583	docs: fix site link ref to v4 github link	2022-11-18 17:34:45 +08:00
MadCcc	d3a7119d03	chore: update mirror host (#38674 ) * chore: update host * chore: rm gitee mirror * chore: lint * chore: ignore crop-imgae	2022-11-18 16:39:28 +08:00
kiner-tang(文辉)	934804763a	fix(message): call onClose after removeNotice (#38669 ) * fix: call onClose after removeNotice * feat: update demo and snapshots * feat: update test case	2022-11-18 16:37:24 +08:00
Amumu	95e097b159	fix(site): fix antd/lib lint error (#38678 ) * fix(site): fix antd/lib lint error * chore: remove antd-img-crop * chore: 4.x * Revert "chore: remove antd-img-crop" This reverts commit `29e15ced65`.	2022-11-18 16:18:44 +08:00
xrkffgg	d903bfc28a	ci: add tag for more branch (#38652 ) * Update release-helper.yml * Update release-helper.yml	2022-11-18 10:46:00 +08:00
afc163	c88ea086f2	Update CHANGELOG.zh-CN.md	2022-11-17 23:38:57 +08:00
二货机器人	5d79e8a448	chore: update CNAME	2022-11-17 17:51:24 +08:00
二货机器人	6d9cf9e132	chore: sync script with next	2022-11-17 16:48:50 +08:00
二货爱吃白萝卜	14884fe585	docs: 4.24.3 changelog (#38623 )	2022-11-17 16:41:24 +08:00
MadCcc	17c7526728	Merge pull request #38577 from ant-design/master chore: sync 4.x	2022-11-17 14:50:17 +08:00
MadCcc	bfe8183e1c	chore: update deploy actions & scripts	2022-11-15 10:54:19 +08:00