diff --git a/.dumi/scripts/clarity.js b/.dumi/scripts/clarity.js
new file mode 100644
index 0000000000..b36cab890a
--- /dev/null
+++ b/.dumi/scripts/clarity.js
@@ -0,0 +1,14 @@
+/* eslint-disable */
+// https://clarity.microsoft.com
+(function (c, l, a, r, i, t, y) {
+  c[a] =
+    c[a] ||
+    function () {
+      (c[a].q = c[a].q || []).push(arguments);
+    };
+  t = l.createElement(r);
+  t.async = 1;
+  t.src = 'https://www.clarity.ms/tag/' + i;
+  y = l.getElementsByTagName(r)[0];
+  y.parentNode.insertBefore(t, y);
+})(window, document, 'clarity', 'script', 'lyia7jfwui');
diff --git a/.dumi/mirror-modal.js b/.dumi/scripts/mirror-modal.js
similarity index 100%
rename from .dumi/mirror-modal.js
rename to .dumi/scripts/mirror-modal.js
diff --git a/.dumi/theme/builtins/ComponentMeta/index.tsx b/.dumi/theme/builtins/ComponentMeta/index.tsx
index f1d9759997..7b891497b0 100644
--- a/.dumi/theme/builtins/ComponentMeta/index.tsx
+++ b/.dumi/theme/builtins/ComponentMeta/index.tsx
@@ -139,7 +139,7 @@ const ComponentMeta: React.FC<ComponentMetaProps> = (props) => {
       colon={false}
       column={1}
       style={{ marginTop: token.margin }}
-      labelStyle={{ paddingInlineEnd: token.padding, width: 54 }}
+      labelStyle={{ paddingInlineEnd: token.padding, width: 56 }}
       items={
         [
           {
diff --git a/.dumirc.ts b/.dumirc.ts
index e96945a97c..a19b41b59c 100644
--- a/.dumirc.ts
+++ b/.dumirc.ts
@@ -171,7 +171,13 @@ export default defineConfig({
   scripts: [
     {
       async: true,
-      content: fs.readFileSync(path.join(__dirname, '.dumi', 'mirror-modal.js')).toString(),
+      content: fs
+        .readFileSync(path.join(__dirname, '.dumi', 'scripts', 'mirror-modal.js'))
+        .toString(),
+    },
+    {
+      async: true,
+      content: fs.readFileSync(path.join(__dirname, '.dumi', 'scripts', 'clarity.js')).toString(),
     },
   ],
 });
diff --git a/components/_util/ActionButton.tsx b/components/_util/ActionButton.tsx
index b0dd28c11f..db0ba99774 100644
--- a/components/_util/ActionButton.tsx
+++ b/components/_util/ActionButton.tsx
@@ -111,7 +111,7 @@ const ActionButton: React.FC<ActionButtonProps> = (props) => {
       clickedRef.current = false;
     } else {
       returnValueOfOnOk = actionFn();
-      if (!returnValueOfOnOk) {
+      if (!isThenable(returnValueOfOnOk)) {
         onInternalClose();
         return;
       }
diff --git a/components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap
index ebe3c3c045..7986e72923 100644
--- a/components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -12,9 +12,7 @@ Array [
       <button
         aria-label="prev"
         class="slick-arrow slick-prev slick-disabled"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display: block;"
         type="button"
       />
@@ -110,9 +108,7 @@ Array [
       <button
         aria-label="next"
         class="slick-arrow slick-next"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display: block;"
         type="button"
       />
@@ -162,9 +158,7 @@ Array [
       <button
         aria-label="prev"
         class="slick-arrow slick-prev slick-disabled"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display: block;"
         type="button"
       />
@@ -261,9 +255,7 @@ Array [
       <button
         aria-label="next"
         class="slick-arrow slick-next"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display: block;"
         type="button"
       />
@@ -305,11 +297,7 @@ Array [
 ]
 `;
 
-exports[`renders components/carousel/demo/arrows.tsx extend context correctly 2`] = `
-[
-  "Warning: React does not recognize the \`%s\` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase \`%s\` instead. If you accidentally passed it from a parent component, remove it from the DOM element.%s",
-]
-`;
+exports[`renders components/carousel/demo/arrows.tsx extend context correctly 2`] = `[]`;
 
 exports[`renders components/carousel/demo/autoplay.tsx extend context correctly 1`] = `
 <div
diff --git a/components/carousel/__tests__/__snapshots__/demo.test.ts.snap b/components/carousel/__tests__/__snapshots__/demo.test.ts.snap
index 8517ec57cb..50751a7206 100644
--- a/components/carousel/__tests__/__snapshots__/demo.test.ts.snap
+++ b/components/carousel/__tests__/__snapshots__/demo.test.ts.snap
@@ -12,9 +12,7 @@ Array [
       <button
         aria-label="prev"
         class="slick-arrow slick-prev slick-disabled"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display:block"
         type="button"
       />
@@ -110,9 +108,7 @@ Array [
       <button
         aria-label="next"
         class="slick-arrow slick-next"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display:block"
         type="button"
       />
@@ -162,9 +158,7 @@ Array [
       <button
         aria-label="prev"
         class="slick-arrow slick-prev slick-disabled"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display:block"
         type="button"
       />
@@ -260,9 +254,7 @@ Array [
       <button
         aria-label="next"
         class="slick-arrow slick-next"
-        currentslide="0"
         data-role="none"
-        slidecount="4"
         style="display:block"
         type="button"
       />
diff --git a/components/carousel/__tests__/index.test.tsx b/components/carousel/__tests__/index.test.tsx
index 7e91f2d787..247736f546 100644
--- a/components/carousel/__tests__/index.test.tsx
+++ b/components/carousel/__tests__/index.test.tsx
@@ -178,4 +178,18 @@ describe('Carousel', () => {
     await waitFakeTimer();
     expect(ref.current?.innerSlider.state.currentSlide).toBe(1);
   });
+
+  it('no dom recognize warning', async () => {
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+    render(
+      <Carousel arrows>
+        <div>1</div>
+        <div>2</div>
+        <div>3</div>
+      </Carousel>,
+    );
+    await waitFakeTimer();
+    expect(errSpy).not.toHaveBeenCalled();
+    errSpy.mockRestore();
+  });
 });
diff --git a/components/carousel/index.tsx b/components/carousel/index.tsx
index 915b09bdf6..4dd1742dff 100644
--- a/components/carousel/index.tsx
+++ b/components/carousel/index.tsx
@@ -31,12 +31,21 @@ export interface CarouselRef {
   innerSlider: any;
 }
 
+interface ArrowType extends React.ButtonHTMLAttributes<HTMLElement> {
+  currentSlide?: number;
+  slideCount?: number;
+}
+
+function ArrowButton({ currentSlide, slideCount, ...rest }: ArrowType) {
+  return <button type="button" {...rest} />;
+}
+
 const Carousel = React.forwardRef<CarouselRef, CarouselProps>((props, ref) => {
   const {
     dots = true,
     arrows = false,
-    prevArrow = <button type="button" aria-label="prev" />,
-    nextArrow = <button type="button" aria-label="next" />,
+    prevArrow = <ArrowButton aria-label="prev" />,
+    nextArrow = <ArrowButton aria-label="next" />,
     draggable = false,
     waitForAnimate = false,
     dotPosition = 'bottom',
diff --git a/components/icon/index.en-US.md b/components/icon/index.en-US.md
index e5c7cf3f5a..8bfa2e550a 100644
--- a/components/icon/index.en-US.md
+++ b/components/icon/index.en-US.md
@@ -155,10 +155,22 @@ module.exports = {
 };
 ```
 
+You can import SVG icon as a react component by using `vite` and [`vite-plugin-svgr`](https://www.npmjs.com/package/vite-plugin-svgr). `@svgr/webpack`'s `options` [reference](https://github.com/smooth-code/svgr#options).
+
+```js
+// vite.config.js
+export default defineConfig(() => ({
+  // ... other config
+  plugins: [svgr({ svgrOptions: { icon: true } })],
+}));
+```
+
 ```jsx
 import React from 'react';
 import Icon from '@ant-design/icons';
 import MessageSvg from 'path/to/message.svg'; // path to your '*.svg' file.
+
+// import MessageSvg from 'path/to/message.svg?react'; // use vite path to your '*.svg?react' file.
 import ReactDOM from 'react-dom/client';
 
 // in create-react-app:
diff --git a/components/icon/index.zh-CN.md b/components/icon/index.zh-CN.md
index 9e994b37ae..28bf3e1a38 100644
--- a/components/icon/index.zh-CN.md
+++ b/components/icon/index.zh-CN.md
@@ -150,10 +150,22 @@ module.exports = {
 };
 ```
 
+如果使用 `vite`，可以通过配置 [vite-plugin-svgr](https://www.npmjs.com/package/vite-plugin-svgr) 来将 `svg` 图标作为 `React` 组件导入。`vite-plugin-svgr` 的 `options` 选项请参阅 [svgr 文档](https://github.com/smooth-code/svgr#options)。
+
+```js
+// vite.config.js
+export default defineConfig(() => ({
+  // ... other config
+  plugins: [svgr({ svgrOptions: { icon: true } })],
+}));
+```
+
 ```jsx
 import React from 'react';
 import Icon from '@ant-design/icons';
 import MessageSvg from 'path/to/message.svg'; // 你的 '*.svg' 文件路径
+
+// import MessageSvg from 'path/to/message.svg?react'; // 使用vite 你的 '*.svg?react' 文件路径.
 import ReactDOM from 'react-dom/client';
 
 // in create-react-app:
diff --git a/components/input/Input.tsx b/components/input/Input.tsx
index fe4d3d91ab..5011696ffd 100644
--- a/components/input/Input.tsx
+++ b/components/input/Input.tsx
@@ -51,7 +51,6 @@ export function triggerFocus(
         break;
       default:
         element.setSelectionRange(0, len);
-        break;
     }
   }
 }
@@ -172,6 +171,15 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
     </>
   );
 
+  const getAddon = (addon: React.ReactNode) =>
+    addon && (
+      <NoCompactStyle>
+        <NoFormStyle override status>
+          {addon}
+        </NoFormStyle>
+      </NoCompactStyle>
+    );
+
   const mergedAllowClear = getAllowClear(allowClear ?? input?.allowClear);
 
   const [variant, enableVariantCls] = useVariant(customVariant, bordered);
@@ -198,24 +206,8 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
         input?.className,
       )}
       onChange={handleChange}
-      addonAfter={
-        addonAfter && (
-          <NoCompactStyle>
-            <NoFormStyle override status>
-              {addonAfter}
-            </NoFormStyle>
-          </NoCompactStyle>
-        )
-      }
-      addonBefore={
-        addonBefore && (
-          <NoCompactStyle>
-            <NoFormStyle override status>
-              {addonBefore}
-            </NoFormStyle>
-          </NoCompactStyle>
-        )
-      }
+      addonBefore={getAddon(addonBefore)}
+      addonAfter={getAddon(addonAfter)}
       classNames={{
         ...classes,
         ...input?.classNames,
diff --git a/components/input/style/index.ts b/components/input/style/index.ts
index d707c44091..eab0e9103a 100644
--- a/components/input/style/index.ts
+++ b/components/input/style/index.ts
@@ -89,11 +89,7 @@ export const genBasicInputStyle = (token: InputToken): CSSObject => ({
   },
 
   // RTL
-  '&-rtl': {
-    direction: 'rtl',
-  },
-
-  '&-textarea-rtl': {
+  '&-rtl, &-textarea-rtl': {
     direction: 'rtl',
   },
 });
@@ -284,11 +280,7 @@ export const genInputGroupStyle = (token: InputToken): CSSObject => {
         '&:not(:first-child):not(:last-child)': {
           borderInlineEndWidth: token.lineWidth,
 
-          '&:hover': {
-            zIndex: 1,
-          },
-
-          '&:focus': {
+          '&:hover, &:focus': {
             zIndex: 1,
           },
         },
@@ -327,11 +319,7 @@ export const genInputGroupStyle = (token: InputToken): CSSObject => {
         borderInlineEndWidth: token.lineWidth,
         borderRadius: 0,
 
-        '&:hover': {
-          zIndex: 1,
-        },
-
-        '&:focus': {
+        '&:hover, &:focus': {
           zIndex: 1,
         },
       },
@@ -753,7 +741,7 @@ const genSearchInputStyle: GenerateStyle<InputToken> = (token: InputToken) => {
         [`> ${componentCls}-group-addon ${componentCls}-search-button,
         > ${componentCls},
         ${componentCls}-affix-wrapper`]: {
-          '&:hover,&:focus,&:active': {
+          '&:hover, &:focus, &:active': {
             zIndex: 2,
           },
         },
@@ -790,16 +778,11 @@ const genTextAreaStyle: GenerateStyle<InputToken> = (token) => {
         },
       },
 
-      '&-allow-clear': {
-        [`> ${componentCls}`]: {
-          paddingInlineEnd: paddingLG,
-        },
-      },
-
-      [`&-affix-wrapper${textareaPrefixCls}-has-feedback`]: {
-        [`${componentCls}`]: {
-          paddingInlineEnd: paddingLG,
-        },
+      [`
+        &-allow-clear > ${componentCls},
+        &-affix-wrapper${textareaPrefixCls}-has-feedback ${componentCls}
+      `]: {
+        paddingInlineEnd: paddingLG,
       },
 
       [`&-affix-wrapper${componentCls}-affix-wrapper`]: {
diff --git a/components/modal/__tests__/confirm.test.tsx b/components/modal/__tests__/confirm.test.tsx
index 569af3340f..6b1d347fba 100644
--- a/components/modal/__tests__/confirm.test.tsx
+++ b/components/modal/__tests__/confirm.test.tsx
@@ -949,4 +949,24 @@ describe('Modal.confirm triggers callbacks correctly', () => {
     expect(document.querySelector('.ant-btn-primary')?.textContent).toBe('test');
     ConfigProvider.config({ holderRender: undefined });
   });
+
+  it('onCancel and onOk return any results and should be closed', async () => {
+    Modal.confirm({ onOk: () => true });
+    await waitFakeTimer();
+    $$('.ant-btn-primary')[0].click();
+    await waitFakeTimer();
+    expect(document.querySelector('.ant-modal-root')).toBeFalsy();
+
+    Modal.confirm({ onOk: () => false });
+    await waitFakeTimer();
+    $$('.ant-btn-primary')[0].click();
+    await waitFakeTimer();
+    expect(document.querySelector('.ant-modal-root')).toBeFalsy();
+
+    Modal.confirm({ onCancel: () => undefined });
+    await waitFakeTimer();
+    $$('.ant-btn')[0].click();
+    await waitFakeTimer();
+    expect(document.querySelector('.ant-modal-root')).toBeFalsy();
+  });
 });
diff --git a/components/modal/__tests__/type.test.tsx b/components/modal/__tests__/type.test.tsx
index 661923efae..18fe7447dd 100644
--- a/components/modal/__tests__/type.test.tsx
+++ b/components/modal/__tests__/type.test.tsx
@@ -4,8 +4,28 @@ import Modal from '..';
 
 describe('Modal.typescript', () => {
   it('Modal.okType', () => {
-    const form = <Modal okType="danger" />;
+    const modal = <Modal okType="danger" />;
 
-    expect(form).toBeTruthy();
+    expect(modal).toBeTruthy();
+  });
+
+  it('Modal.styles', () => {
+    const style: React.CSSProperties = {
+      position: 'absolute',
+    };
+    const modal = (
+      <Modal
+        styles={{
+          header: style,
+          body: style,
+          footer: style,
+          mask: style,
+          wrapper: style,
+          content: style,
+        }}
+      />
+    );
+
+    expect(modal).toBeTruthy();
   });
 });
diff --git a/components/modal/demo/_semantic.tsx b/components/modal/demo/_semantic.tsx
index 2d033b9366..0547852766 100644
--- a/components/modal/demo/_semantic.tsx
+++ b/components/modal/demo/_semantic.tsx
@@ -32,16 +32,14 @@ const BlockModal = (props: ModalProps) => {
       <Modal
         getContainer={() => divRef.current!}
         {...props}
-        styles={
-          {
-            mask: {
-              position: 'absolute',
-            },
-            wrapper: {
-              position: 'absolute',
-            },
-          } as any
-        }
+        styles={{
+          mask: {
+            position: 'absolute',
+          },
+          wrapper: {
+            position: 'absolute',
+          },
+        }}
         style={{
           top: '50%',
           transform: 'translateY(-50%)',
diff --git a/components/modal/interface.ts b/components/modal/interface.ts
index e4771f0448..23f9dd9323 100644
--- a/components/modal/interface.ts
+++ b/components/modal/interface.ts
@@ -5,13 +5,15 @@ import type { ClosableType } from '../_util/hooks/useClosable';
 import type { ButtonProps, LegacyButtonType } from '../button/button';
 import type { DirectionType } from '../config-provider';
 
-export type ModalFooterRender = (
-  originNode: React.ReactNode,
-  extra: { OkBtn: React.FC; CancelBtn: React.FC },
-) => React.ReactNode;
-interface ModalCommonProps {
-  styles?: Omit<NonNullable<DialogProps['styles']>, 'wrapper'>;
+interface ModalCommonProps extends Omit<DialogProps, 'footer'> {
+  footer?:
+    | React.ReactNode
+    | ((
+        originNode: React.ReactNode,
+        extra: { OkBtn: React.FC; CancelBtn: React.FC },
+      ) => React.ReactNode);
 }
+
 export interface ModalProps extends ModalCommonProps {
   /** Whether the modal dialog is visible or not */
   open?: boolean;
@@ -32,8 +34,6 @@ export interface ModalProps extends ModalCommonProps {
   centered?: boolean;
   /** Width of the modal dialog */
   width?: string | number;
-  /** Footer content */
-  footer?: ModalFooterRender | React.ReactNode;
   /** Text of the OK button */
   okText?: React.ReactNode;
   /** Button `type` of the OK button */
diff --git a/components/select/index.en-US.md b/components/select/index.en-US.md
index 4534d7baa5..a849cd9971 100644
--- a/components/select/index.en-US.md
+++ b/components/select/index.en-US.md
@@ -126,12 +126,10 @@ Common props ref：[Common props](/docs/react/common-props)
 | onChange | Called when select an option or input value change | function(value, option:Option \| Array&lt;Option>) | - |  |
 | onClear | Called when clear | function | - | 4.6.0 |
 | onDeselect | Called when an option is deselected, param is the selected option's value. Only called for `multiple` or `tags`, effective in multiple or tags mode only | function(value: string \| number \| LabeledValue) | - |  |
-| onDropdownVisibleChange | Called when dropdown open | function(open) | - |  |
-| onFocus | Called when focus | function | - |  |
-| onInputKeyDown | Called when key pressed | function | - |  |
-| onMouseEnter | Called when mouse enter | function | - |  |
-| onMouseLeave | Called when mouse leave | function | - |  |
-| onPopupScroll | Called when dropdown scrolls | function | - |  |
+| onDropdownVisibleChange | Called when dropdown open | (open: boolean) => void | - |  |
+| onFocus | Called when focus | (event: FocusEvent) => void | - |  |
+| onInputKeyDown | Called when key pressed | (event: KeyboardEvent) => void | - |  |
+| onPopupScroll | Called when dropdown scrolls | (event: UIEvent) => void | - |  |
 | onSearch | Callback function that is fired when input changed | function(value: string) | - |  |
 | onSelect | Called when an option is selected, the params are option's value (or key) and option instance | function(value: string \| number \| LabeledValue, option: Option) | - |  |
 
diff --git a/components/select/index.zh-CN.md b/components/select/index.zh-CN.md
index b934b9ca47..edad71ec8f 100644
--- a/components/select/index.zh-CN.md
+++ b/components/select/index.zh-CN.md
@@ -127,12 +127,10 @@ return (
 | onChange | 选中 option，或 input 的 value 变化时，调用此函数 | function(value, option:Option \| Array&lt;Option>) | - |  |
 | onClear | 清除内容时回调 | function | - | 4.6.0 |
 | onDeselect | 取消选中时调用，参数为选中项的 value (或 key) 值，仅在 `multiple` 或 `tags` 模式下生效 | function(value: string \| number \| LabeledValue) | - |  |
-| onDropdownVisibleChange | 展开下拉菜单的回调 | function(open) | - |  |
-| onFocus | 获得焦点时回调 | function | - |  |
-| onInputKeyDown | 按键按下时回调 | function | - |  |
-| onMouseEnter | 鼠标移入时回调 | function | - |  |
-| onMouseLeave | 鼠标移出时回调 | function | - |  |
-| onPopupScroll | 下拉列表滚动时的回调 | function | - |  |
+| onDropdownVisibleChange | 展开下拉菜单的回调 | (open: boolean) => void | - |  |
+| onFocus | 获得焦点时回调 | (event: FocusEvent) => void | - |  |
+| onInputKeyDown | 按键按下时回调 | (event: KeyboardEvent) => void | - |  |
+| onPopupScroll | 下拉列表滚动时的回调 | (event: UIEvent) => void | - |  |
 | onSearch | 文本框值变化时回调 | function(value: string) | - |  |
 | onSelect | 被选中时调用，参数为选中项的 value (或 key) 值 | function(value: string \| number \| LabeledValue, option: Option) | - |  |
 
diff --git a/components/spin/index.tsx b/components/spin/index.tsx
index 4c7d4010b0..f8a42d9fb2 100644
--- a/components/spin/index.tsx
+++ b/components/spin/index.tsx
@@ -14,17 +14,29 @@ export type SpinSize = (typeof SpinSizes)[number];
 export type SpinIndicator = React.ReactElement<HTMLElement>;
 
 export interface SpinProps {
+  /** Customize prefix class name */
   prefixCls?: string;
+  /** Additional class name of Spin */
   className?: string;
+  /** Additional root class name of Spin */
   rootClassName?: string;
+  /** Whether Spin is spinning */
   spinning?: boolean;
+  /** Style of Spin */
   style?: React.CSSProperties;
+  /** Size of Spin, options: `small`, `default` and `large` */
   size?: SpinSize;
+  /** Customize description content when Spin has children */
   tip?: React.ReactNode;
+  /** Specifies a delay in milliseconds for loading state (prevent flush) */
   delay?: number;
+  /** The className of wrapper when Spin has children */
   wrapperClassName?: string;
+  /** React node of the spinning indicator */
   indicator?: SpinIndicator;
+  /** Children of Spin */
   children?: React.ReactNode;
+  /** Display a backdrop with the `Spin` component */
   fullscreen?: boolean;
 }
 
diff --git a/components/tree-select/demo/basic.tsx b/components/tree-select/demo/basic.tsx
index 0cd1c35998..bd18b4eb0f 100644
--- a/components/tree-select/demo/basic.tsx
+++ b/components/tree-select/demo/basic.tsx
@@ -1,6 +1,6 @@
-import type { SyntheticEvent } from 'react';
 import React, { useState } from 'react';
 import { TreeSelect } from 'antd';
+import type { TreeSelectProps } from 'antd';
 
 const treeData = [
   {
@@ -57,7 +57,7 @@ const App: React.FC = () => {
     setValue(newValue);
   };
 
-  const onPopupScroll = (e: SyntheticEvent) => {
+  const onPopupScroll: TreeSelectProps['onPopupScroll'] = (e) => {
     console.log('onPopupScroll', e);
   };
 
diff --git a/components/tree-select/index.en-US.md b/components/tree-select/index.en-US.md
index e0d7bef5ba..63602c4191 100644
--- a/components/tree-select/index.en-US.md
+++ b/components/tree-select/index.en-US.md
@@ -86,7 +86,7 @@ Common props ref：[Common props](/docs/react/common-props)
 | onSearch | A callback function, can be executed when the search input changes | function(value: string) | - |  |
 | onSelect | A callback function, can be executed when you select a treeNode | function(value, node, extra) | - |  |
 | onTreeExpand | A callback function, can be executed when treeNode expanded | function(expandedKeys) | - |  |
-| onPopupScroll | Called when dropdown scrolls | (event: MouseEvent) => void | - | 5.17.0 |
+| onPopupScroll | Called when dropdown scrolls | (event: UIEvent) => void | - | 5.17.0 |
 
 ### Tree Methods
 
diff --git a/components/tree-select/index.zh-CN.md b/components/tree-select/index.zh-CN.md
index f7cd874ada..c30c417829 100644
--- a/components/tree-select/index.zh-CN.md
+++ b/components/tree-select/index.zh-CN.md
@@ -87,7 +87,7 @@ demo:
 | onSearch | 文本框值变化时的回调 | function(value: string) | - |  |
 | onSelect | 被选中时调用 | function(value, node, extra) | - |  |
 | onTreeExpand | 展示节点时调用 | function(expandedKeys) | - |  |
-| onPopupScroll | 下拉列表滚动时的回调 | (event: MouseEvent) => void | - | 5.17.0 |
+| onPopupScroll | 下拉列表滚动时的回调 | (event: UIEvent) => void | - | 5.17.0 |
 
 ### Tree 方法
 
diff --git a/components/tree/index.en-US.md b/components/tree/index.en-US.md
index f22c18b802..a0ab586a1e 100644
--- a/components/tree/index.en-US.md
+++ b/components/tree/index.en-US.md
@@ -57,16 +57,16 @@ Common props ref：[Common props](/docs/react/common-props)
 | fieldNames | Customize node title, key, children field name | object | { title: `title`, key: `key`, children: `children` } | 4.17.0 |
 | filterTreeNode | Defines a function to filter (highlight) treeNodes. When the function returns `true`, the corresponding treeNode will be highlighted | function(node) | - |  |
 | height | Config virtual scroll height. Will not support horizontal scroll when enable this | number | - |  |
-| icon | Customize treeNode icon | ReactNode \| (props) => ReactNode | - |  |
+| icon | Insert a custom icon before the title. Need to set `showIcon` to true | ReactNode \| (props) => ReactNode | - |  |
 | loadData | Load data asynchronously | function(node) | - |  |
 | loadedKeys | (Controlled) Set loaded tree nodes. Need work with `loadData` | string\[] | \[] |  |
 | multiple | Allows selecting multiple treeNodes | boolean | false |  |
 | rootStyle | Style on the root element | CSSProperties | - | 4.20.0 |
 | selectable | Whether can be selected | boolean | true |  |
 | selectedKeys | (Controlled) Specifies the keys of the selected treeNodes, multiple selection needs to set `multiple` to true | string\[] | - |  |
-| showIcon | Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to true | boolean | false |  |
+| showIcon | Controls whether to display the `icon` node, no default style | boolean | false |  |
 | showLine | Shows a connecting line | boolean \| {showLeafIcon: ReactNode \| ((props: AntTreeNodeProps) => ReactNode)} | false |  |
-| switcherIcon | Customize collapse/expand icon of tree node | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 |
+| switcherIcon | Customize expand/collapse icons for tree nodes (With default rotate angular style) | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 |
 | titleRender | Customize tree node title render | (nodeData) => ReactNode | - | 4.5.0 |
 | treeData | The treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array&lt;{ key, title, children, \[disabled, selectable] }> | - |  |
 | virtual | Disable virtual scroll when set to false | boolean | true | 4.1.0 |
@@ -131,10 +131,6 @@ Before `3.4.0`: The number of treeNodes can be very large, but when `checkable=t
 
 ## FAQ
 
-### How to hide file icon when use showLine?
-
-File icon realize by using switcherIcon. You can overwrite the style to hide it: <https://codesandbox.io/s/883vo47xp8>
-
 ### Why defaultExpandAll not working on ajax data?
 
 `default` prefix prop only works when initializing. So `defaultExpandAll` has already executed when ajax load data. You can control `expandedKeys` or render Tree when data loaded to realize expanded all.
diff --git a/components/tree/index.zh-CN.md b/components/tree/index.zh-CN.md
index f750e826b1..088b1412b8 100644
--- a/components/tree/index.zh-CN.md
+++ b/components/tree/index.zh-CN.md
@@ -59,16 +59,16 @@ demo:
 | fieldNames | 自定义节点 title、key、children 的字段 | object | { title: `title`, key: `key`, children: `children` } | 4.17.0 |
 | filterTreeNode | 按需筛选树节点（高亮），返回 true | function(node) | - |  |
 | height | 设置虚拟滚动容器高度，设置后内部节点不再支持横向滚动 | number | - |  |
-| icon | 自定义树节点图标。 | ReactNode \| (props) => ReactNode | - |  |
+| icon | 在标题之前插入自定义图标。需要设置 `showIcon` 为 true | ReactNode \| (props) => ReactNode | - |  |
 | loadData | 异步加载数据 | function(node) | - |  |
 | loadedKeys | （受控）已经加载的节点，需要配合 `loadData` 使用 | string\[] | \[] |  |
 | multiple | 支持点选多个节点（节点本身） | boolean | false |  |
 | rootStyle | 添加在 Tree 最外层的 style | CSSProperties | - | 4.20.0 |
 | selectable | 是否可选中 | boolean | true |  |
 | selectedKeys | （受控）设置选中的树节点，多选需设置 `multiple` 为 true | string\[] | - |  |
-| showIcon | 是否展示 TreeNode title 前的图标，没有默认样式，如设置为 true，需要自行定义图标相关样式 | boolean | false |  |
+| showIcon | 控制是否展示 `icon` 节点，没有默认样式 | boolean | false |  |
 | showLine | 是否展示连接线 | boolean \| { showLeafIcon: ReactNode \| ((props: AntTreeNodeProps) => ReactNode) } | false |  |
-| switcherIcon | 自定义树节点的展开/折叠图标 | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 |
+| switcherIcon | 自定义树节点的展开/折叠图标（带有默认 rotate 角度样式） | ReactNode \| ((props: AntTreeNodeProps) => ReactNode) | - | renderProps: 4.20.0 |
 | titleRender | 自定义渲染节点 | (nodeData) => ReactNode | - | 4.5.0 |
 | treeData | treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一） | array&lt;{key, title, children, \[disabled, selectable]}> | - |  |
 | virtual | 设置 false 时关闭虚拟滚动 | boolean | true | 4.1.0 |
@@ -133,10 +133,6 @@ demo:
 
 ## FAQ
 
-### 在 showLine 时，如何隐藏子节点图标？
-
-文件图标通过 switcherIcon 来实现，如果不需要你可以覆盖对应的样式：<https://codesandbox.io/s/883vo47xp8>
-
 ### defaultExpandAll 在异步加载数据时为何不生效？
 
 `default` 前缀属性只有在初始化时生效，因而异步加载数据时 `defaultExpandAll` 已经执行完成。你可以通过受控 `expandedKeys` 或者在数据加载完成后渲染 Tree 来实现全部展开。
diff --git a/package.json b/package.json
index 37af193e7b..e5487b41f5 100644
--- a/package.json
+++ b/package.json
@@ -123,7 +123,7 @@
     "rc-dropdown": "~4.2.0",
     "rc-field-form": "~2.2.0",
     "rc-image": "~7.8.0",
-    "rc-input": "~1.5.0",
+    "rc-input": "~1.5.1",
     "rc-input-number": "~9.1.0",
     "rc-mentions": "~2.13.1",
     "rc-menu": "~9.14.0",