diff --git a/packages/core/client/package.json b/packages/core/client/package.json
index ea842dd3a6..a66a9d7fc7 100644
--- a/packages/core/client/package.json
+++ b/packages/core/client/package.json
@@ -15,7 +15,7 @@
     "@dnd-kit/modifiers": "^6.0.0",
     "@dnd-kit/sortable": "^6.0.0",
     "@emotion/css": "^11.7.1",
-    "@formily/antd-v5": "^1.1.0",
+    "@formily/antd-v5": "^1.1.1",
     "@formily/core": "^2.2.27",
     "@formily/grid": "^2.2.27",
     "@formily/json-schema": "^2.2.27",
@@ -30,7 +30,7 @@
     "@nocobase/utils": "0.13.0-alpha.3",
     "@types/requirejs": "^2.1.34",
     "ahooks": "^3.7.2",
-    "antd": "^5.7.3",
+    "antd": "5.8.4",
     "antd-style": "^3.3.0",
     "axios": "^0.26.1",
     "classnames": "^2.3.1",
diff --git a/packages/core/client/src/collection-manager/templates/components/PreviewFields.tsx b/packages/core/client/src/collection-manager/templates/components/PreviewFields.tsx
index e6a7dc0cd0..09d063f07a 100644
--- a/packages/core/client/src/collection-manager/templates/components/PreviewFields.tsx
+++ b/packages/core/client/src/collection-manager/templates/components/PreviewFields.tsx
@@ -1,8 +1,6 @@
-import { Cascader } from '@formily/antd-v5';
 import { useField, useForm } from '@formily/react';
-import { Input, Select, Spin, Table, Tag } from 'antd';
+import { Cascader, Input, Select, Spin, Table, Tag } from 'antd';
 import { last } from 'lodash';
-import { boolean } from 'mathjs';
 import React, { useContext, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ResourceActionContext, useCompile } from '../../../';
diff --git a/packages/core/client/src/global-theme/type.ts b/packages/core/client/src/global-theme/type.ts
index 014de53441..40779b727d 100644
--- a/packages/core/client/src/global-theme/type.ts
+++ b/packages/core/client/src/global-theme/type.ts
@@ -1,4 +1,4 @@
-import { MappingAlgorithm } from 'antd/es/config-provider/context';
+import { MappingAlgorithm } from 'antd-style';
 import { OverrideToken } from 'antd/es/theme/interface';
 import { AliasToken } from 'antd/es/theme/internal';
 
diff --git a/packages/core/client/src/schema-component/antd/action/Action.tsx b/packages/core/client/src/schema-component/antd/action/Action.tsx
index 1f75d11c65..bcea781d6a 100644
--- a/packages/core/client/src/schema-component/antd/action/Action.tsx
+++ b/packages/core/client/src/schema-component/antd/action/Action.tsx
@@ -1,5 +1,5 @@
 import { observer, RecursionField, useField, useFieldSchema, useForm } from '@formily/react';
-import { App, Button, Popover } from 'antd';
+import { App, Button } from 'antd';
 import classnames from 'classnames';
 import lodash from 'lodash';
 import React, { useEffect, useState } from 'react';
@@ -11,6 +11,7 @@ import { useRecord } from '../../../record-provider';
 import { SortableItem } from '../../common';
 import { useCompile, useComponent, useDesigner } from '../../hooks';
 import { useProps } from '../../hooks/useProps';
+import { Popover } from '../popover';
 import ActionContainer from './Action.Container';
 import { ActionDesigner } from './Action.Designer';
 import { ActionDrawer } from './Action.Drawer';
diff --git a/packages/core/client/src/schema-component/antd/association-field/InternalPopoverNester.tsx b/packages/core/client/src/schema-component/antd/association-field/InternalPopoverNester.tsx
index ec090f5c91..7b68398587 100644
--- a/packages/core/client/src/schema-component/antd/association-field/InternalPopoverNester.tsx
+++ b/packages/core/client/src/schema-component/antd/association-field/InternalPopoverNester.tsx
@@ -1,13 +1,13 @@
-import { Popover } from 'antd';
-import { css } from '@emotion/css';
 import { EditOutlined } from '@ant-design/icons';
+import { css } from '@emotion/css';
 import { observer } from '@formily/react';
 import React, { useContext, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { ReadPrettyInternalViewer } from './InternalViewer';
+import { ActionContext, ActionContextProvider } from '../action/context';
+import { Popover } from '../popover';
 import { InternalNester } from './InternalNester';
+import { ReadPrettyInternalViewer } from './InternalViewer';
 import { useAssociationFieldContext } from './hooks';
-import { ActionContextProvider, ActionContext } from '../action/context';
 
 export const InternaPopoverNester = observer(
   (props) => {
diff --git a/packages/core/client/src/schema-component/antd/date-picker/__tests__/date-picker.test.tsx b/packages/core/client/src/schema-component/antd/date-picker/__tests__/date-picker.test.tsx
index 95ab97a60e..6f9a07d020 100644
--- a/packages/core/client/src/schema-component/antd/date-picker/__tests__/date-picker.test.tsx
+++ b/packages/core/client/src/schema-component/antd/date-picker/__tests__/date-picker.test.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { render, screen, sleep, userEvent, waitFor } from 'testUtils';
 import App1 from '../demos/demo1';
+import App11 from '../demos/demo11';
 import App2 from '../demos/demo2';
 import App3 from '../demos/demo3';
 import App4 from '../demos/demo4';
@@ -68,8 +69,11 @@ describe('DatePicker', () => {
     await userEvent.click(picker);
     await userEvent.type(input, '2023/05/01');
 
-    const selected = document.querySelector('.ant-picker-cell-selected') as HTMLElement;
-    expect(selected).toBeInTheDocument();
+    let selected;
+    await waitFor(() => {
+      selected = document.querySelector('.ant-picker-cell-selected') as HTMLElement;
+      expect(selected).toBeInTheDocument();
+    });
     await userEvent.click(selected);
 
     expect(input).toHaveValue('2023/05/01');
@@ -138,15 +142,20 @@ describe('RangePicker', () => {
     const endInput = getByPlaceholderText('End date');
 
     await userEvent.click(picker);
+    await sleep();
     await userEvent.click(document.querySelector('[title="2023-05-01"]') as HTMLElement);
     await userEvent.click(document.querySelector('[title="2023-05-02"]') as HTMLElement);
 
-    expect(startInput).toHaveValue('2023-05-01');
-    expect(endInput).toHaveValue('2023-05-02');
+    await waitFor(() => expect(startInput).toHaveValue('2023-05-01'));
+    await waitFor(() => expect(endInput).toHaveValue('2023-05-02'));
+
     // Read pretty
-    expect(screen.getByText('2023-05-01~2023-05-02', { selector: '.ant-description-text' })).toBeInTheDocument();
+    await waitFor(() =>
+      expect(screen.getByText('2023-05-01~2023-05-02', { selector: '.ant-description-text' })).toBeInTheDocument(),
+    );
+
     // Value
-    expect(screen.getByText('2023-05-01 ~ 2023-05-02')).toBeInTheDocument();
+    await waitFor(() => expect(screen.getByText('2023-05-01 ~ 2023-05-02')).toBeInTheDocument());
   });
 
   it('showTime=false,gmt=true,utc=true', async () => {
@@ -219,4 +228,25 @@ describe('RangePicker', () => {
       expect(screen.getByText(`${currentDateString}T00:00:00.000Z`)).toBeInTheDocument();
     });
   });
+
+  // fix T-1506
+  it('shortcut', async () => {
+    const { container } = render(<App11 />);
+
+    await sleep();
+
+    const picker = container.querySelector('.ant-picker') as HTMLElement;
+    const startInput = screen.getByPlaceholderText('Start date');
+    const endInput = screen.getByPlaceholderText('End date');
+
+    await userEvent.click(picker);
+
+    // shortcut: Today
+    await userEvent.click(screen.getByText(/today/i));
+    await sleep();
+
+    // 因为 Today 快捷键的值是动态生成的，所以这里没有断言具体的值
+    await waitFor(() => expect(startInput.getAttribute('value')).toBeTruthy());
+    await waitFor(() => expect(endInput.getAttribute('value')).toBeTruthy());
+  });
 });
diff --git a/packages/core/client/src/schema-component/antd/date-picker/demos/demo11.tsx b/packages/core/client/src/schema-component/antd/date-picker/demos/demo11.tsx
new file mode 100644
index 0000000000..1cd60ac4d6
--- /dev/null
+++ b/packages/core/client/src/schema-component/antd/date-picker/demos/demo11.tsx
@@ -0,0 +1,65 @@
+/**
+ * title: DatePicker.RangePicker
+ */
+import { FormItem } from '@formily/antd-v5';
+import { DatePicker, Input, SchemaComponent, SchemaComponentProvider } from '@nocobase/client';
+import React from 'react';
+
+const schema = {
+  type: 'object',
+  properties: {
+    input: {
+      type: 'boolean',
+      title: `Editable`,
+      'x-decorator': 'FormItem',
+      'x-component': 'DatePicker.RangePicker',
+      'x-component-props': {
+        gmt: true,
+      },
+      'x-reactions': [
+        {
+          target: 'read1',
+          fulfill: {
+            state: {
+              value: '{{$self.value}}',
+            },
+          },
+        },
+        {
+          target: 'read2',
+          fulfill: {
+            state: {
+              value: '{{$self.value && $self.value.join(" ~ ")}}',
+            },
+          },
+        },
+      ],
+    },
+    read1: {
+      type: 'boolean',
+      title: `Read pretty`,
+      'x-read-pretty': true,
+      'x-decorator': 'FormItem',
+      'x-component': 'DatePicker.RangePicker',
+      'x-component-props': {
+        gmt: true,
+      },
+    },
+    read2: {
+      type: 'string',
+      title: `Value`,
+      'x-read-pretty': true,
+      'x-decorator': 'FormItem',
+      'x-component': 'Input',
+      'x-component-props': {},
+    },
+  },
+};
+
+export default () => {
+  return (
+    <SchemaComponentProvider components={{ Input, DatePicker, FormItem }}>
+      <SchemaComponent schema={schema} />
+    </SchemaComponentProvider>
+  );
+};
diff --git a/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx b/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
index 2faac33c20..2edc93f6a5 100644
--- a/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
+++ b/packages/core/client/src/schema-component/antd/filter/FilterAction.tsx
@@ -1,13 +1,14 @@
 import { css } from '@emotion/css';
 import { createForm, Field, Form } from '@formily/core';
 import { observer, useField, useFieldSchema, useForm } from '@formily/react';
-import { Button, Popover, Space } from 'antd';
-import React, { createContext, useContext, useMemo, useState } from 'react';
+import { Button, Space } from 'antd';
+import React, { createContext, useCallback, useContext, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FormProvider, SchemaComponent } from '../../core';
 import { useDesignable } from '../../hooks';
 import { useProps } from '../../hooks/useProps';
 import { Action } from '../action';
+import { Popover } from '../popover';
 
 export const FilterActionContext = createContext<any>(null);
 
@@ -20,15 +21,17 @@ export const FilterAction = observer(
     const fieldSchema = useFieldSchema();
     const form = useMemo<Form>(() => props.form || createForm(), []);
     const { options, onSubmit, onReset, ...others } = useProps(props);
+    const onOpenChange = useCallback((visible: boolean): void => {
+      setVisible(visible);
+    }, []);
+
     return (
       <FilterActionContext.Provider value={{ field, fieldSchema, designable, dn }}>
         <Popover
           destroyTooltipOnHide
           placement={'bottomLeft'}
           open={visible}
-          onOpenChange={(visible) => {
-            setVisible(visible);
-          }}
+          onOpenChange={onOpenChange}
           trigger={'click'}
           content={
             <form>
diff --git a/packages/core/client/src/schema-component/antd/icon-picker/IconPicker.tsx b/packages/core/client/src/schema-component/antd/icon-picker/IconPicker.tsx
index 71bafad26f..1062bc4cd9 100644
--- a/packages/core/client/src/schema-component/antd/icon-picker/IconPicker.tsx
+++ b/packages/core/client/src/schema-component/antd/icon-picker/IconPicker.tsx
@@ -2,10 +2,11 @@ import { CloseOutlined, LoadingOutlined } from '@ant-design/icons';
 import { useFormLayout } from '@formily/antd-v5';
 import { connect, mapProps, mapReadPretty } from '@formily/react';
 import { isValid } from '@formily/shared';
-import { Button, Input, Popover } from 'antd';
+import { Button, Input } from 'antd';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Icon, hasIcon, icons } from '../../../icon';
+import { Popover } from '../popover';
 
 function IconField(props: any) {
   const layout = useFormLayout();
diff --git a/packages/core/client/src/schema-component/antd/index.ts b/packages/core/client/src/schema-component/antd/index.ts
index fd5b21bc48..a135753b3b 100644
--- a/packages/core/client/src/schema-component/antd/index.ts
+++ b/packages/core/client/src/schema-component/antd/index.ts
@@ -35,6 +35,7 @@ export * from './page';
 export * from './pagination';
 export * from './password';
 export * from './percent';
+export * from './popover';
 export * from './preview';
 export * from './quick-edit';
 export * from './radio';
diff --git a/packages/core/client/src/schema-component/antd/input/EllipsisWithTooltip.tsx b/packages/core/client/src/schema-component/antd/input/EllipsisWithTooltip.tsx
index 408b66a930..9f97c597b7 100644
--- a/packages/core/client/src/schema-component/antd/input/EllipsisWithTooltip.tsx
+++ b/packages/core/client/src/schema-component/antd/input/EllipsisWithTooltip.tsx
@@ -1,5 +1,5 @@
-import { Popover } from 'antd';
-import React, { CSSProperties, forwardRef, useImperativeHandle, useState, useRef } from 'react';
+import React, { CSSProperties, forwardRef, useImperativeHandle, useRef, useState } from 'react';
+import { Popover } from '../popover';
 
 const getContentWidth = (element) => {
   if (element) {
diff --git a/packages/core/client/src/schema-component/antd/popover/Popover.tsx b/packages/core/client/src/schema-component/antd/popover/Popover.tsx
new file mode 100644
index 0000000000..43fb91db35
--- /dev/null
+++ b/packages/core/client/src/schema-component/antd/popover/Popover.tsx
@@ -0,0 +1,16 @@
+import { Popover as AntdPopover, PopoverProps } from 'antd';
+import React, { useCallback } from 'react';
+
+export const Popover = (props: PopoverProps) => {
+  // 参见：https://github.com/ant-design/ant-design/issues/44119
+  // fix T-1508
+  const avoidClose = useCallback((e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
+    e.stopPropagation();
+  }, []);
+
+  return (
+    <div onClick={avoidClose}>
+      <AntdPopover {...props} />
+    </div>
+  );
+};
diff --git a/packages/core/client/src/schema-component/antd/popover/index.ts b/packages/core/client/src/schema-component/antd/popover/index.ts
new file mode 100644
index 0000000000..8f473de4b9
--- /dev/null
+++ b/packages/core/client/src/schema-component/antd/popover/index.ts
@@ -0,0 +1 @@
+export * from './Popover';
diff --git a/packages/core/client/src/schema-component/antd/quick-edit/QuickEdit.tsx b/packages/core/client/src/schema-component/antd/quick-edit/QuickEdit.tsx
index ed5de34057..e526a9fd43 100644
--- a/packages/core/client/src/schema-component/antd/quick-edit/QuickEdit.tsx
+++ b/packages/core/client/src/schema-component/antd/quick-edit/QuickEdit.tsx
@@ -2,9 +2,9 @@ import { css } from '@emotion/css';
 import { FormItem } from '@formily/antd-v5';
 import { Field, createForm } from '@formily/core';
 import { FormContext, RecursionField, observer, useField, useFieldSchema } from '@formily/react';
-import { Popover } from 'antd';
 import React, { useMemo, useRef } from 'react';
 import { useCollectionManager } from '../../../collection-manager';
+import { Popover } from '../popover';
 
 export const Editable = observer((props) => {
   const field: any = useField();
diff --git a/packages/plugins/charts/src/client/select/CustomSelect.tsx b/packages/plugins/charts/src/client/select/CustomSelect.tsx
index 7061682b55..1e5c364f83 100644
--- a/packages/plugins/charts/src/client/select/CustomSelect.tsx
+++ b/packages/plugins/charts/src/client/select/CustomSelect.tsx
@@ -1,9 +1,9 @@
 import { LoadingOutlined } from '@ant-design/icons';
 import { connect, mapProps, mapReadPretty } from '@formily/react';
 import { isValid } from '@formily/shared';
-import { css, Icon } from '@nocobase/client';
+import { Icon, Popover, css } from '@nocobase/client';
 import type { SelectProps } from 'antd';
-import { Popover, Select as AntdSelect } from 'antd';
+import { Select as AntdSelect } from 'antd';
 import React from 'react';
 import { lang } from '../locale';
 import { ReadPretty } from './ReadPretty';
@@ -35,7 +35,7 @@ const InternalSelect = connect(
       >
         <OptGroup label={lang('Basic charts')}>
           {group1.map((option) => (
-            <Option value={option.key} label={lang(option.title)}>
+            <Option key={option.key} value={option.key} label={lang(option.title)}>
               <Popover
                 placement={'right'}
                 zIndex={99999999999}
@@ -43,9 +43,7 @@ const InternalSelect = connect(
                   <span>
                     {lang(option?.description)
                       ?.split(',')
-                      .map((item) => (
-                        <div>{item}</div>
-                      ))}
+                      .map((item) => <div key={item}>{item}</div>)}
                   </span>
                 )}
                 trigger="hover"
@@ -68,7 +66,7 @@ const InternalSelect = connect(
         </OptGroup>
         <OptGroup label={lang('More charts')}>
           {group2.map((option) => (
-            <Option value={option.key} label={lang(option.title)}>
+            <Option key={option.key} value={option.key} label={lang(option.title)}>
               <Popover
                 placement={'right'}
                 zIndex={99999999999}
@@ -76,9 +74,7 @@ const InternalSelect = connect(
                   <span>
                     {lang(option?.description)
                       ?.split(',')
-                      .map((item) => (
-                        <div>{item}</div>
-                      ))}
+                      .map((item) => <div key={item}>{item}</div>)}
                   </span>
                 )}
                 trigger="hover"
diff --git a/packages/plugins/graph-collection-manager/src/client/GraphDrawPage.tsx b/packages/plugins/graph-collection-manager/src/client/GraphDrawPage.tsx
index 843bad9fef..61da77dec5 100644
--- a/packages/plugins/graph-collection-manager/src/client/GraphDrawPage.tsx
+++ b/packages/plugins/graph-collection-manager/src/client/GraphDrawPage.tsx
@@ -7,11 +7,12 @@ import {
   ShareAltOutlined,
 } from '@ant-design/icons';
 import { Graph } from '@antv/x6';
-import { register } from '@antv/x6-react-shape';
-import { Scroller } from '@antv/x6-plugin-scroller';
 import { MiniMap } from '@antv/x6-plugin-minimap';
+import { Scroller } from '@antv/x6-plugin-scroller';
 import { Selection } from '@antv/x6-plugin-selection';
 import { Snapline } from '@antv/x6-plugin-snapline';
+import { register } from '@antv/x6-react-shape';
+import { css, cx } from '@emotion/css';
 import { SchemaOptionsContext } from '@formily/react';
 import {
   APIClientProvider,
@@ -20,6 +21,7 @@ import {
   CollectionManagerContext,
   CollectionManagerProvider,
   CurrentAppInfoContext,
+  Popover,
   SchemaComponent,
   SchemaComponentOptions,
   Select,
@@ -30,11 +32,10 @@ import {
   useCurrentAppInfo,
   useGlobalTheme,
 } from '@nocobase/client';
-import { css, cx } from '@emotion/css';
-import lodash from 'lodash';
 import { useFullscreen } from 'ahooks';
-import { Button, ConfigProvider, Input, Layout, Menu, Popover, Switch, Tooltip, App, Spin } from 'antd';
+import { App, Button, ConfigProvider, Input, Layout, Menu, Spin, Switch, Tooltip } from 'antd';
 import dagre from 'dagre';
+import lodash from 'lodash';
 import React, { createContext, forwardRef, useContext, useEffect, useLayoutEffect, useState } from 'react';
 import { useAsyncDataSource, useCreateActionAndRefreshCM } from './action-hooks';
 import { AddCollectionAction } from './components/AddCollectionAction';
diff --git a/packages/plugins/graph-collection-manager/src/client/components/Entity.tsx b/packages/plugins/graph-collection-manager/src/client/components/Entity.tsx
index e132356d94..07e80f830c 100644
--- a/packages/plugins/graph-collection-manager/src/client/components/Entity.tsx
+++ b/packages/plugins/graph-collection-manager/src/client/components/Entity.tsx
@@ -1,9 +1,11 @@
 import { DeleteOutlined, DownOutlined, EditOutlined, UpOutlined } from '@ant-design/icons';
-import { uid } from '@formily/shared';
 import { css } from '@emotion/css';
+import { SchemaOptionsContext } from '@formily/react';
+import { uid } from '@formily/shared';
 import {
   CollectionCategroriesContext,
   CollectionProvider,
+  Popover,
   SchemaComponent,
   SchemaComponentProvider,
   Select,
@@ -13,9 +15,8 @@ import {
   useCurrentAppInfo,
   useRecord,
 } from '@nocobase/client';
+import { Badge, Tag } from 'antd';
 import lodash from 'lodash';
-import { SchemaOptionsContext } from '@formily/react';
-import { Badge, Popover, Tag } from 'antd';
 import React, { useContext, useRef, useState } from 'react';
 import {
   useAsyncDataSource,
diff --git a/packages/plugins/localization-management/src/client/Localization.tsx b/packages/plugins/localization-management/src/client/Localization.tsx
index 435213bca4..eaccff8cd7 100644
--- a/packages/plugins/localization-management/src/client/Localization.tsx
+++ b/packages/plugins/localization-management/src/client/Localization.tsx
@@ -4,6 +4,7 @@ import { Field, useField, useForm } from '@formily/react';
 import {
   FormProvider,
   Input,
+  Popover,
   Radio,
   SchemaComponent,
   locale,
@@ -13,7 +14,7 @@ import {
   useResourceActionContext,
   useResourceContext,
 } from '@nocobase/client';
-import { Input as AntdInput, Button, Card, Checkbox, Col, Divider, Popover, Row, Tag, Typography, message } from 'antd';
+import { Input as AntdInput, Button, Card, Checkbox, Col, Divider, Row, Tag, Typography, message } from 'antd';
 import React, { useMemo, useState } from 'react';
 import { useLocalTranslation } from './locale';
 import { localizationSchema } from './schemas/localization';
diff --git a/packages/plugins/theme-editor/src/client/antd-token-previewer/token-panel-pro/TokenContent.tsx b/packages/plugins/theme-editor/src/client/antd-token-previewer/token-panel-pro/TokenContent.tsx
index c679ea58af..05d94011f0 100644
--- a/packages/plugins/theme-editor/src/client/antd-token-previewer/token-panel-pro/TokenContent.tsx
+++ b/packages/plugins/theme-editor/src/client/antd-token-previewer/token-panel-pro/TokenContent.tsx
@@ -1,5 +1,6 @@
 import { CaretRightOutlined, ExpandOutlined, QuestionCircleOutlined } from '@ant-design/icons';
-import { Button, Checkbox, Collapse, ConfigProvider, Popover, Switch, Tooltip, Typography } from 'antd';
+import { Popover } from '@nocobase/client';
+import { Button, Checkbox, Collapse, ConfigProvider, Switch, Tooltip, Typography } from 'antd';
 import type { ThemeConfig } from 'antd/es/config-provider/context';
 import seed from 'antd/es/theme/themes/seed';
 import classNames from 'classnames';
@@ -60,9 +61,10 @@ const useStyle = makeStyle('ColorTokenContent', (token) => ({
         transition: 'box-shadow 0.2s ease-in-out',
         borderRadius: 8,
       },
-      [`> ${token.rootCls}-collapse-item > ${token.rootCls}-collapse-content > ${token.rootCls}-collapse-content-box`]: {
-        paddingBlock: '0 12px',
-      },
+      [`> ${token.rootCls}-collapse-item > ${token.rootCls}-collapse-content > ${token.rootCls}-collapse-content-box`]:
+        {
+          paddingBlock: '0 12px',
+        },
 
       '.token-panel-pro-token-collapse-description': {
         color: token.colorTextTertiary,
diff --git a/yarn.lock b/yarn.lock
index afa58753bb..eb1b55e960 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -174,10 +174,28 @@
     rc-util "^5.35.0"
     stylis "^4.0.13"
 
+"@ant-design/cssinjs@^1.16.0":
+  version "1.16.2"
+  resolved "https://registry.npmmirror.com/@ant-design/cssinjs/-/cssinjs-1.16.2.tgz#4bb4156d721f76043d9a1300038be9f862b1c23a"
+  integrity sha512-W+LT6Xm5sEYZn7ocMAIP9LvX99woxGg1aYu15o608/uUAaJDR7LrxBu/5cnMLa6AQK1829zdoKmRnRFOxAgzEg==
+  dependencies:
+    "@babel/runtime" "^7.11.1"
+    "@emotion/hash" "^0.8.0"
+    "@emotion/unitless" "^0.7.5"
+    classnames "^2.3.1"
+    csstype "^3.0.10"
+    rc-util "^5.35.0"
+    stylis "^4.0.13"
+
 "@ant-design/icons-svg@^4.2.1":
   version "4.2.1"
   resolved "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.2.1.tgz#8630da8eb4471a4aabdaed7d1ff6a97dcb2cf05a"
 
+"@ant-design/icons-svg@^4.3.0":
+  version "4.3.0"
+  resolved "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.3.0.tgz#cd8d3624bba50975e848591cea12cb6be132cd82"
+  integrity sha512-WOgvdH/1Wl8Z7VXigRbCa5djO14zxrNTzvrAQzhWiBQtEKT0uTc8K1ltjKZ8U1gPn/wXhMA8/jE39SJl0WNxSg==
+
 "@ant-design/icons@5.x", "@ant-design/icons@^5.0.0", "@ant-design/icons@^5.1.0", "@ant-design/icons@^5.1.3", "@ant-design/icons@^5.1.4":
   version "5.1.4"
   resolved "https://registry.npmmirror.com/@ant-design/icons/-/icons-5.1.4.tgz#614e29e26d092c2c1c1a2acbc0d84434d8d1474e"
@@ -198,6 +216,18 @@
     classnames "^2.2.6"
     rc-util "^5.9.4"
 
+"@ant-design/icons@^5.2.2":
+  version "5.2.5"
+  resolved "https://registry.npmmirror.com/@ant-design/icons/-/icons-5.2.5.tgz#852474359e271a36e54a4ac115065fae7396277e"
+  integrity sha512-9Jc59v5fl5dzmxqLWtRev3dJwU7Ya9ZheoI6XmZjZiQ7PRtk77rC+Rbt7GJzAPPg43RQ4YO53RE1u8n+Et97vQ==
+  dependencies:
+    "@ant-design/colors" "^7.0.0"
+    "@ant-design/icons-svg" "^4.3.0"
+    "@babel/runtime" "^7.11.2"
+    classnames "^2.2.6"
+    lodash.camelcase "^4.3.0"
+    rc-util "^5.31.1"
+
 "@ant-design/plots@^1.2.5":
   version "1.2.5"
   resolved "https://registry.npmmirror.com/@ant-design/plots/-/plots-1.2.5.tgz#404caf0e2c8d052590fe080c6f0fdf0e0c3119ab"
@@ -3738,7 +3768,7 @@
     intl-messageformat "10.5.0"
     tslib "^2.4.0"
 
-"@formily/antd-v5@1.x", "@formily/antd-v5@^1.1.0":
+"@formily/antd-v5@1.x":
   version "1.1.0"
   resolved "https://registry.npmmirror.com/@formily/antd-v5/-/antd-v5-1.1.0.tgz#e2f20df64c62df348a78b4c44aa17c23a24887d1"
   dependencies:
@@ -3756,6 +3786,25 @@
     classnames "^2.2.6"
     react-sticky-box "^1.0.2"
 
+"@formily/antd-v5@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.npmmirror.com/@formily/antd-v5/-/antd-v5-1.1.1.tgz#b1f103cbb99b88d14ebf66a362e6fd2177046478"
+  integrity sha512-fubuPHWjHVtBNWQ3iGfwy44mIRHSLn7DfvtLIYAdszHt3c4jk3ermUW2hCAeBTd9bX0NXery/VSy+yTd1Myzyg==
+  dependencies:
+    "@ant-design/cssinjs" "^1.3.1"
+    "@ant-design/icons" "^5.0.0"
+    "@dnd-kit/core" "^6.0.0"
+    "@dnd-kit/sortable" "^7.0.0"
+    "@formily/core" "^2.2.0"
+    "@formily/grid" "^2.2.0"
+    "@formily/json-schema" "^2.2.0"
+    "@formily/react" "^2.2.0"
+    "@formily/reactive" "^2.2.0"
+    "@formily/reactive-react" "^2.2.0"
+    "@formily/shared" "^2.2.0"
+    classnames "^2.2.6"
+    react-sticky-box "^1.0.2"
+
 "@formily/core@2.2.27", "@formily/core@2.x", "@formily/core@^2.2.0", "@formily/core@^2.2.27":
   version "2.2.27"
   resolved "https://registry.npmmirror.com/@formily/core/-/core-2.2.27.tgz#9ccb51650a713f27997e6823a5a980c9e013f461"
@@ -5628,6 +5677,19 @@
     rc-resize-observer "^1.3.1"
     rc-util "^5.33.0"
 
+"@rc-component/trigger@^1.15.0":
+  version "1.15.5"
+  resolved "https://registry.npmmirror.com/@rc-component/trigger/-/trigger-1.15.5.tgz#88ae123b4e2edeadb612ba470b6ac502a076895f"
+  integrity sha512-HFjeco/gRGAHN3sBl5ZO44o0W6Y3i8sqCQEYcFT1RJJUb91p/uSIWejPDMzHd3DKAdTbRCM3T45jxs7Kwm17kA==
+  dependencies:
+    "@babel/runtime" "^7.18.3"
+    "@rc-component/portal" "^1.1.0"
+    classnames "^2.3.2"
+    rc-align "^4.0.0"
+    rc-motion "^2.0.0"
+    rc-resize-observer "^1.3.1"
+    rc-util "^5.33.0"
+
 "@react-spring/animated@~9.6.1":
   version "9.6.1"
   resolved "https://registry.npmmirror.com/@react-spring/animated/-/animated-9.6.1.tgz#ccc626d847cbe346f5f8815d0928183c647eb425"
@@ -8718,7 +8780,61 @@ antd-token-previewer@2.0.0-alpha.8, antd-token-previewer@^2.0.0-alpha.6:
     use-debouncy "^4.3.0"
     vanilla-jsoneditor "^0.16.1"
 
-antd@5.x, antd@^5.4.2, antd@^5.5.1, antd@^5.7.3:
+antd@5.8.4:
+  version "5.8.4"
+  resolved "https://registry.npmmirror.com/antd/-/antd-5.8.4.tgz#9225524e8325ebd4bf7a70512fce04a5088c28d4"
+  integrity sha512-DbQUmRWf9GAllZsc9NxL9gnrup75F7iZ0OlFY+mXh31JdSYQLLP07CAOK7z/sdQLQdYnAHWyuWvkb2mrRKxnYA==
+  dependencies:
+    "@ant-design/colors" "^7.0.0"
+    "@ant-design/cssinjs" "^1.16.0"
+    "@ant-design/icons" "^5.2.2"
+    "@ant-design/react-slick" "~1.0.0"
+    "@babel/runtime" "^7.18.3"
+    "@ctrl/tinycolor" "^3.6.0"
+    "@rc-component/color-picker" "~1.4.0"
+    "@rc-component/mutate-observer" "^1.0.0"
+    "@rc-component/tour" "~1.8.1"
+    "@rc-component/trigger" "^1.15.0"
+    classnames "^2.2.6"
+    copy-to-clipboard "^3.2.0"
+    dayjs "^1.11.1"
+    qrcode.react "^3.1.0"
+    rc-cascader "~3.14.0"
+    rc-checkbox "~3.1.0"
+    rc-collapse "~3.7.0"
+    rc-dialog "~9.1.0"
+    rc-drawer "~6.2.0"
+    rc-dropdown "~4.1.0"
+    rc-field-form "~1.36.0"
+    rc-image "~7.1.0"
+    rc-input "~1.1.0"
+    rc-input-number "~8.0.2"
+    rc-mentions "~2.5.0"
+    rc-menu "~9.10.0"
+    rc-motion "^2.7.3"
+    rc-notification "~5.0.4"
+    rc-pagination "~3.6.0"
+    rc-picker "~3.13.0"
+    rc-progress "~3.4.1"
+    rc-rate "~2.12.0"
+    rc-resize-observer "^1.2.0"
+    rc-segmented "~2.2.0"
+    rc-select "~14.7.1"
+    rc-slider "~10.1.0"
+    rc-steps "~6.0.1"
+    rc-switch "~4.1.0"
+    rc-table "~7.32.1"
+    rc-tabs "~12.9.0"
+    rc-textarea "~1.3.3"
+    rc-tooltip "~6.0.0"
+    rc-tree "~5.7.6"
+    rc-tree-select "~5.11.0"
+    rc-upload "~4.3.0"
+    rc-util "^5.32.0"
+    scroll-into-view-if-needed "^3.0.3"
+    throttle-debounce "^5.0.0"
+
+antd@5.x, antd@^5.4.2, antd@^5.5.1:
   version "5.7.3"
   resolved "https://registry.npmmirror.com/antd/-/antd-5.7.3.tgz#3a1b84fa3987554931b9d974efe9cb7454ff1347"
   dependencies:
@@ -22321,6 +22437,18 @@ rc-cascader@~3.12.0:
     rc-tree "~5.7.0"
     rc-util "^5.6.1"
 
+rc-cascader@~3.14.0:
+  version "3.14.1"
+  resolved "https://registry.npmmirror.com/rc-cascader/-/rc-cascader-3.14.1.tgz#495f00b8d047a54fa64df3102f4d6e4a664feaf2"
+  integrity sha512-fCsgjLIQqYZMhFj9UT+x2ZW4uobx7OP5yivcn6Xto5fuxHaldphsryzCeUVmreQOHEo0RP+032Ip9RDzrKVKJA==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+    array-tree-filter "^2.1.0"
+    classnames "^2.3.1"
+    rc-select "~14.7.0"
+    rc-tree "~5.7.0"
+    rc-util "^5.35.0"
+
 rc-checkbox@~3.1.0:
   version "3.1.0"
   resolved "https://registry.npmmirror.com/rc-checkbox/-/rc-checkbox-3.1.0.tgz#6be0d9d8de2cc96fb5e37f9036a1c3e360d0a42d"
@@ -22393,6 +22521,15 @@ rc-field-form@~1.34.0:
     async-validator "^4.1.0"
     rc-util "^5.32.2"
 
+rc-field-form@~1.36.0:
+  version "1.36.2"
+  resolved "https://registry.npmmirror.com/rc-field-form/-/rc-field-form-1.36.2.tgz#0a4e75ab9849e3c2517b8b07c1f97ecd3e52db55"
+  integrity sha512-tCF/JjUsnxW80Gk4E4ZH74ONsaQMxVTRtui6XhQB8DJc4FHWLLa5pP8zwhxtPKC5NaO0QZ0Cv79JggDubn6n2g==
+  dependencies:
+    "@babel/runtime" "^7.18.0"
+    async-validator "^4.1.0"
+    rc-util "^5.32.2"
+
 rc-image@~7.0.0:
   version "7.0.0"
   resolved "https://registry.npmmirror.com/rc-image/-/rc-image-7.0.0.tgz#cad2105dd1708304328bc9c178f7953cb0198403"
@@ -22404,6 +22541,18 @@ rc-image@~7.0.0:
     rc-motion "^2.6.2"
     rc-util "^5.34.1"
 
+rc-image@~7.1.0:
+  version "7.1.3"
+  resolved "https://registry.npmmirror.com/rc-image/-/rc-image-7.1.3.tgz#0072547c7c0a70e6badfb4bee320806c5bf7427b"
+  integrity sha512-foMl1rcit1F0+vgxE5kf0c8TygQcHhILsOohQUL+JMUbzOo3OBFRcehJudYbqbCTArzCecS8nA1irUU9vvgQbg==
+  dependencies:
+    "@babel/runtime" "^7.11.2"
+    "@rc-component/portal" "^1.0.2"
+    classnames "^2.2.6"
+    rc-dialog "~9.1.0"
+    rc-motion "^2.6.2"
+    rc-util "^5.34.1"
+
 rc-input-number@~8.0.2:
   version "8.0.3"
   resolved "https://registry.npmmirror.com/rc-input-number/-/rc-input-number-8.0.3.tgz#208efac9937370d3c987979558e7e4882564af09"
@@ -22479,6 +22628,15 @@ rc-pagination@~3.5.0:
     classnames "^2.2.1"
     rc-util "^5.32.2"
 
+rc-pagination@~3.6.0:
+  version "3.6.1"
+  resolved "https://registry.npmmirror.com/rc-pagination/-/rc-pagination-3.6.1.tgz#2db6678a57cd2f4f29d6c0416e282543af52d0df"
+  integrity sha512-R/sUnKKXx1Nm4kZfUKS3YKa7yEPF1ZkVB/AynQaHt+nMER7h9wPTfliDJFdYo+RM/nk2JD4Yc5QpUq8fIQHeug==
+  dependencies:
+    "@babel/runtime" "^7.10.1"
+    classnames "^2.2.1"
+    rc-util "^5.32.2"
+
 rc-picker@~3.10.0:
   version "3.10.0"
   resolved "https://registry.npmmirror.com/rc-picker/-/rc-picker-3.10.0.tgz#d34e659d88782eb1eac5939a1be0d6ba508f6f42"
@@ -22488,6 +22646,16 @@ rc-picker@~3.10.0:
     classnames "^2.2.1"
     rc-util "^5.30.0"
 
+rc-picker@~3.13.0:
+  version "3.13.0"
+  resolved "https://registry.npmmirror.com/rc-picker/-/rc-picker-3.13.0.tgz#b5bec6dbaa7d8a1e4ca9f4e93863a8a75607a62d"
+  integrity sha512-hJ+1lGkemnvsW+t+PjH9OAehHlj7wdD0G75T1HZj0IeZTqBE/5mmuf8E8MHYATNBqW409lAfk8GwjYm1WVMopg==
+  dependencies:
+    "@babel/runtime" "^7.10.1"
+    "@rc-component/trigger" "^1.5.0"
+    classnames "^2.2.1"
+    rc-util "^5.30.0"
+
 rc-progress@~3.4.1:
   version "3.4.2"
   resolved "https://registry.npmmirror.com/rc-progress/-/rc-progress-3.4.2.tgz#f8df9ee95e790490171ab6b31bf07303cdc79980"
@@ -22546,6 +22714,19 @@ rc-select@~14.5.0:
     rc-util "^5.16.1"
     rc-virtual-list "^3.5.2"
 
+rc-select@~14.7.0, rc-select@~14.7.1:
+  version "14.7.4"
+  resolved "https://registry.npmmirror.com/rc-select/-/rc-select-14.7.4.tgz#742d85861e83604237784f60e2ba9dabcde8eac9"
+  integrity sha512-qRUpvMVXFy6rdHe+qzHXAqyQAfhErC/oY8dcRtoRjoz0lz2Nx3J+lLL5AnEbjnwlS+/kQTJUZ/65WyCwWwcLwQ==
+  dependencies:
+    "@babel/runtime" "^7.10.1"
+    "@rc-component/trigger" "^1.5.0"
+    classnames "2.x"
+    rc-motion "^2.0.1"
+    rc-overflow "^1.3.1"
+    rc-util "^5.16.1"
+    rc-virtual-list "^3.5.2"
+
 rc-slider@~10.1.0:
   version "10.1.1"
   resolved "https://registry.npmmirror.com/rc-slider/-/rc-slider-10.1.1.tgz#5e82036e60b61021aba3ea0e353744dd7c74e104"
@@ -22620,6 +22801,17 @@ rc-tree-select@5.5.5:
     rc-tree "~5.7.0"
     rc-util "^5.16.1"
 
+rc-tree-select@~5.11.0:
+  version "5.11.1"
+  resolved "https://registry.npmmirror.com/rc-tree-select/-/rc-tree-select-5.11.1.tgz#7a667288fae06ec06d362ed85d0902068d801407"
+  integrity sha512-EDG1rYFu1iD2Y8fg0yEmm0LV3XqWOy+SpgOMvO5396NgAZ67t0zVTNK6FQkIxzdXf5ri742BkB/B8+Ah6+0Kxw==
+  dependencies:
+    "@babel/runtime" "^7.10.1"
+    classnames "2.x"
+    rc-select "~14.7.0"
+    rc-tree "~5.7.0"
+    rc-util "^5.16.1"
+
 rc-tree-select@~5.9.0:
   version "5.9.0"
   resolved "https://registry.npmmirror.com/rc-tree-select/-/rc-tree-select-5.9.0.tgz#e8af859ff7751d22b6f4d98941cf13f775686475"