@antsoo-lib/components 0.1.11 → 0.1.12

package/src/modal/index.zh-CN.md

@@ -1,165 +0,0 @@
----
-category: Components
-type: 反馈
-title: Modal
-subtitle: 对话框
-cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*wM3qQ5XrhlcAAAAAAAAAAAAADrJ8AQ/original
-coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*fBrgSJBmavgAAAAAAAAAAAAADrJ8AQ/original
----
-
-模态对话框。
-
-## 何时使用
-
-需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用 `Modal` 在当前页面正中打开一个浮层，承载相应的操作。
-
-另外当需要一个简洁的确认框询问用户时，可以使用 `Modal.confirm()` 等语法糖方法。
-
-## API
-
-| 参数              | 说明                                                        | 类型                                   | 默认值              | 版本 |
-| ----------------- | ----------------------------------------------------------- | -------------------------------------- | ------------------- | ---- |
-| afterClose        | Modal 完全关闭后的回调                                      | function                               | -                   |      |
-| bodyStyle         | Modal body 样式                                             | object                                 | {}                  |      |
-| cancelButtonProps | cancel 按钮 props                                           | [ButtonProps](/components/button/#api) | -                   |      |
-| cancelText        | 取消按钮文字                                                | string\| slot                          | 取消                |      |
-| centered          | 垂直居中展示 Modal                                          | boolean                                | `false`             |      |
-| closable          | 是否显示右上角的关闭按钮                                    | boolean                                | true                |      |
-| closeIcon         | 自定义关闭图标                                              | VNode \| slot                          | -                   |      |
-| confirmLoading    | 确定按钮 loading                                            | boolean                                | -                   |      |
-| destroyOnClose    | 关闭时销毁 Modal 里的子元素                                 | boolean                                | false               |      |
-| footer            | 底部内容，当不需要默认底部按钮时，可以设为 `:footer="null"` | string\|slot                           | 确定取消按钮        |      |
-| forceRender       | 强制渲染 Modal                                              | boolean                                | false               |      |
-| getContainer      | 指定 Modal 挂载的 HTML 节点                                 | (instance): HTMLElement                | () => document.body |      |
-| keyboard          | 是否支持键盘 esc 关闭                                       | boolean                                | true                |      |
-| mask              | 是否展示遮罩                                                | boolean                                | true                |      |
-| maskClosable      | 点击蒙层是否允许关闭                                        | boolean                                | true                |      |
-| maskStyle         | 遮罩样式                                                    | object                                 | {}                  |      |
-| okButtonProps     | ok 按钮 props                                               | [ButtonProps](/components/button/#api) | -                   |      |
-| okText            | 确认按钮文字                                                | string\|slot                           | 确定                |      |
-| okType            | 确认按钮类型                                                | string                                 | primary             |      |
-| title             | 标题                                                        | string\|slot                           | -                   |      |
-| open(v-model)     | 对话框是否可见                                              | boolean                                | -                   |      |
-| width             | 宽度                                                        | string\|number                         | 520                 |      |
-| wrapClassName     | 对话框外层容器的类名                                        | string                                 | -                   |      |
-| zIndex            | 设置 Modal 的 `z-index`                                     | number                                 | 1000                |      |
-
-### 事件
-
-| 事件名称 | 说明                                 | 回调参数    |
-| -------- | ------------------------------------ | ----------- |
-| cancel   | 点击遮罩层或右上角叉或取消按钮的回调 | function(e) |
-| ok       | 点击确定回调                         | function(e) |
-
-#### 注意
-
-> `<Modal />` 默认关闭后状态不会自动清空, 如果希望每次打开都是新内容，请设置 `destroyOnClose`。
-
-### Modal.method()
-
-包括：
-
-- `Modal.info`
-- `Modal.success`
-- `Modal.error`
-- `Modal.warning`
-- `Modal.confirm`
-
-以上均为一个函数，参数为 object，具体属性如下：
-
-| 参数              | 说明                                                             | 类型                              | 默认值  | 版本  |
-| ----------------- | ---------------------------------------------------------------- | --------------------------------- | ------- | ----- |
-| appContext        | 弹窗的上下文，一般用于获取全局注册组件、vuex 等内容              | -                                 | -       |       |
-| autoFocusButton   | 指定自动获得焦点的按钮                                           | `null` \| `ok` \| `cancel`        | `ok`    |       |
-| cancelButtonProps | cancel 按钮 props                                                | [ButtonProps](/components/button) | -       |       |
-| cancelText        | 取消按钮文字                                                     | string                            | 取消    |       |
-| centered          | 垂直居中展示 Modal                                               | boolean                           | `false` |       |
-| class             | 容器类名                                                         | string                            | -       |       |
-| closable          | 是否显示右上角的关闭按钮                                         | boolean                           | `false` |       |
-| content           | 内容                                                             | string \|VNode \|function()       | -       |       |
-| footer            | 底部内容，当不需要默认底部按钮时，可以设为 `footer: null`        | string \|VNode \|function()       | -       | 4.0.0 |
-| icon              | 自定义图标（1.14.0 新增）                                        | VNode \| ()=>VNode                | -       |       |
-| keyboard          | 是否支持键盘 esc 关闭                                            | boolean                           | true    |       |
-| mask              | 是否展示遮罩                                                     | boolean                           | true    |       |
-| maskClosable      | 点击蒙层是否允许关闭                                             | boolean                           | `false` |       |
-| okButtonProps     | ok 按钮 props                                                    | [ButtonProps](/components/button) | -       |       |
-| okText            | 确认按钮文字                                                     | string                            | 确定    |       |
-| okType            | 确认按钮类型                                                     | string                            | primary |       |
-| title             | 标题                                                             | string\|VNode \|function()        | -       |       |
-| width             | 宽度                                                             | string\|number                    | 416     |       |
-| wrapClassName     | 对话框外层容器的类名                                             | string                            | -       | 3.2.3 |
-| zIndex            | 设置 Modal 的 `z-index`                                          | number                            | 1000    |       |
-| onCancel          | 取消回调，参数为关闭函数，返回 promise 时 resolve 后自动关闭     | function                          | -       |       |
-| onOk              | 点击确定回调，参数为关闭函数，返回 promise 时 resolve 后自动关闭 | function                          | -       |       |
-
-以上函数调用后，会返回一个引用，可以通过该引用更新和关闭弹窗。
-
-```jsx
-const modal = Modal.info()
-
-modal.update({
-  title: '修改的标题',
-  content: '修改的内容',
-})
-
-modal.destroy()
-```
-
-- `Modal.destroyAll`
-
-使用 `Modal.destroyAll()` 可以销毁弹出的确认窗（即上述的 Modal.info、Modal.success、Modal.error、Modal.warning、Modal.confirm）。通常用于路由监听当中，处理路由前进、后退不能销毁确认对话框的问题，而不用各处去使用实例的返回值进行关闭（modal.destroy() 适用于主动关闭，而不是路由这样被动关闭）
-
-```jsx
-const router = new VueRouter({ ... })
-
-// router change
-router.beforeEach((to, from, next) => {
-  Modal.destroyAll();
-})
-```
-
-### Modal.useModal()
-
-当你需要使用 Context 时，可以通过 `Modal.useModal` 创建一个 `contextHolder` 插入子节点中。通过 hooks 创建的临时 Modal 将会得到 `contextHolder` 所在位置的所有上下文。创建的 `modal` 对象拥有与 [`Modal.method`](#modalmethod) 相同的创建通知方法。
-
-```html
-<template>
-  <contextHolder />
-  <!-- <component :is='contextHolder'/> -->
-</template>
-<script setup>
-  import { Modal } from 'ant-design-vue'
-
-  const [modal, contextHolder] = Modal.useModal()
-
-  modal.confirm({
-    // ...
-  })
-</script>
-```
-
-## FAQ
-
-### 为什么 Modal 方法不能获取 全局注册组件、context、vuex 等内容和 ConfigProvider `locale/prefixCls/theme` 配置， 以及不能响应式更新数据 ？
-
-直接调用 Modal 方法，组件会通过 `Vue.render` 动态创建新的 Vue 实体。其 context 与当前代码所在 context 并不相同，因而无法获取 context 信息。
-
-当你需要 context 信息（例如使用全局注册的组件）时，可以通过 Modal.useModal 方法会返回 modal 实体以及 contextHolder 节点。将其插入到你需要获取 context 位置即可：
-
-```html
-<template>
-  <contextHolder />
-  <!-- <component :is='contextHolder'/> -->
-</template>
-<script setup>
-  import { Modal } from 'ant-design-vue'
-
-  const [modal, contextHolder] = Modal.useModal()
-
-  modal.confirm({
-    // ...
-  })
-</script>
-```
-
-> 可通过 [App 包裹组件](/components/app-cn) 简化`useModal`等方法需要手动植入 contextHolder 的问题。

package/src/modal/locale.ts

@@ -1,28 +0,0 @@
-import defaultLocale from '../locale/en_US'
-
-export interface ModalLocale {
-  okText: string
-  cancelText: string
-  justOkText: string
-}
-
-let runtimeLocale: ModalLocale = {
-  ...(defaultLocale.Modal as ModalLocale),
-}
-
-export function changeConfirmLocale(newLocale?: ModalLocale) {
-  if (newLocale) {
-    runtimeLocale = {
-      ...runtimeLocale,
-      ...newLocale,
-    }
-  } else {
-    runtimeLocale = {
-      ...(defaultLocale.Modal as ModalLocale),
-    }
-  }
-}
-
-export function getConfirmLocale() {
-  return runtimeLocale
-}

package/src/modal/style/index.ts

@@ -1,466 +0,0 @@
-import type { CSSProperties } from 'vue'
-
-import { clearFix, genFocusStyle, resetComponent } from '../../style'
-import { initFadeMotion, initZoomMotion } from '../../style/motion'
-import type { AliasToken, FullToken, GenerateStyle } from '../../theme/internal'
-import { genComponentStyleHook, mergeToken } from '../../theme/internal'
-import type { TokenWithCommonCls } from '../../theme/util/genComponentStyleHook'
-
-/** Component only token. Which will handle additional calculation of alias token */
-export interface ComponentToken {
-  // Component token here
-}
-
-export interface ModalToken extends FullToken<'Modal'> {
-  // Custom token here
-  modalBodyPadding: number
-  modalHeaderBg: string
-  modalHeaderPadding: string
-  modalHeaderBorderWidth: number
-  modalHeaderBorderStyle: string
-  modalHeaderTitleLineHeight: number
-  modalHeaderTitleFontSize: number
-  modalHeaderBorderColorSplit: string
-  modalHeaderCloseSize: number
-  modalContentBg: string
-  modalHeadingColor: string
-  modalCloseColor: string
-  modalCloseBtnSize: number
-  modalFooterBg: string
-  modalFooterBorderColorSplit: string
-  modalFooterBorderStyle: string
-  modalFooterPaddingVertical: number
-  modalFooterPaddingHorizontal: number
-  modalFooterBorderWidth: number
-  modalConfirmTitleFontSize: number
-  modalIconHoverColor: string
-  modalConfirmIconSize: number
-}
-
-function box(position: CSSProperties['position']): CSSProperties {
-  return {
-    position,
-    top: 0,
-    insetInlineEnd: 0,
-    bottom: 0,
-    insetInlineStart: 0,
-  }
-}
-
-export const genModalMaskStyle: GenerateStyle<TokenWithCommonCls<AliasToken>> = (token) => {
-  const { componentCls } = token
-
-  return [
-    {
-      [`${componentCls}-root`]: {
-        [`${componentCls}${token.antCls}-zoom-enter, ${componentCls}${token.antCls}-zoom-appear`]: {
-          // reset scale avoid mousePosition bug
-          transform: 'none',
-          opacity: 0,
-          animationDuration: token.motionDurationSlow,
-          // https://github.com/ant-design/ant-design/issues/11777
-          userSelect: 'none',
-        },
-
-        [`${componentCls}${token.antCls}-zoom-leave ${componentCls}-content`]: {
-          pointerEvents: 'none',
-        },
-
-        [`${componentCls}-mask`]: {
-          ...box('fixed'),
-          zIndex: token.zIndexPopupBase,
-          height: '100%',
-          backgroundColor: token.colorBgMask,
-          [`${componentCls}-hidden`]: {
-            display: 'none',
-          },
-        },
-
-        [`${componentCls}-wrap`]: {
-          ...box('fixed'),
-          overflow: 'auto',
-          outline: 0,
-          WebkitOverflowScrolling: 'touch',
-        },
-      },
-    },
-    { [`${componentCls}-root`]: initFadeMotion(token) },
-  ]
-}
-
-const genModalStyle: GenerateStyle<ModalToken> = (token) => {
-  const { componentCls } = token
-
-  return [
-    // ======================== Root =========================
-    {
-      [`${componentCls}-root`]: {
-        [`${componentCls}-wrap`]: {
-          zIndex: token.zIndexPopupBase,
-          position: 'fixed',
-          inset: 0,
-          overflow: 'auto',
-          outline: 0,
-          WebkitOverflowScrolling: 'touch',
-        },
-        [`${componentCls}-wrap-rtl`]: {
-          direction: 'rtl',
-        },
-
-        [`${componentCls}-centered`]: {
-          textAlign: 'center',
-
-          '&::before': {
-            display: 'inline-block',
-            width: 0,
-            height: '100%',
-            verticalAlign: 'middle',
-            content: '""',
-          },
-          [componentCls]: {
-            top: 0,
-            display: 'inline-block',
-            paddingBottom: 0,
-            textAlign: 'start',
-            verticalAlign: 'middle',
-          },
-        },
-
-        [`@media (max-width: ${token.screenSMMax})`]: {
-          [componentCls]: {
-            maxWidth: 'calc(100vw - 16px)',
-            margin: `${token.marginXS} auto`,
-          },
-          [`${componentCls}-centered`]: {
-            [componentCls]: {
-              flex: 1,
-            },
-          },
-        },
-      },
-    },
-
-    // ======================== Modal ========================
-    {
-      [componentCls]: {
-        ...resetComponent(token),
-        pointerEvents: 'none',
-        position: 'relative',
-        top: 100,
-        width: 'auto',
-        maxWidth: `calc(100vw - ${token.margin * 2}px)`,
-        margin: '0 auto',
-        paddingBottom: token.paddingLG,
-
-        [`${componentCls}-title`]: {
-          margin: 0,
-          color: token.modalHeadingColor,
-          fontWeight: token.fontWeightStrong,
-          fontSize: token.modalHeaderTitleFontSize,
-          lineHeight: token.modalHeaderTitleLineHeight,
-          wordWrap: 'break-word',
-        },
-
-        [`${componentCls}-content`]: {
-          position: 'relative',
-          backgroundColor: token.modalContentBg,
-          backgroundClip: 'padding-box',
-          border: 0,
-          borderRadius: token.borderRadiusLG,
-          boxShadow: token.boxShadowSecondary,
-          pointerEvents: 'auto',
-          padding: `${token.paddingMD}px ${token.paddingContentHorizontalLG}px`,
-        },
-
-        [`${componentCls}-close`]: {
-          position: 'absolute',
-          top: (token.modalHeaderCloseSize - token.modalCloseBtnSize) / 2,
-          insetInlineEnd: (token.modalHeaderCloseSize - token.modalCloseBtnSize) / 2,
-          zIndex: token.zIndexPopupBase + 10,
-          padding: 0,
-          color: token.modalCloseColor,
-          fontWeight: token.fontWeightStrong,
-          lineHeight: 1,
-          textDecoration: 'none',
-          background: 'transparent',
-          borderRadius: token.borderRadiusSM,
-          width: token.modalConfirmIconSize,
-          height: token.modalConfirmIconSize,
-          border: 0,
-          outline: 0,
-          cursor: 'pointer',
-          transition: `color ${token.motionDurationMid}, background-color ${token.motionDurationMid}`,
-
-          '&-x': {
-            display: 'block',
-            fontSize: token.fontSizeLG,
-            fontStyle: 'normal',
-            lineHeight: `${token.modalCloseBtnSize}px`,
-            textAlign: 'center',
-            textTransform: 'none',
-            textRendering: 'auto',
-          },
-
-          '&:hover': {
-            color: token.modalIconHoverColor,
-            backgroundColor: token.wireframe ? 'transparent' : token.colorFillContent,
-            textDecoration: 'none',
-          },
-
-          '&:active': {
-            backgroundColor: token.wireframe ? 'transparent' : token.colorFillContentHover,
-          },
-
-          ...genFocusStyle(token),
-        },
-
-        [`${componentCls}-header`]: {
-          color: token.colorText,
-          background: token.modalHeaderBg,
-          borderRadius: `${token.borderRadiusLG}px ${token.borderRadiusLG}px 0 0`,
-          marginBottom: token.marginXS,
-        },
-
-        [`${componentCls}-body`]: {
-          fontSize: token.fontSize,
-          lineHeight: token.lineHeight,
-          wordWrap: 'break-word',
-        },
-
-        [`${componentCls}-footer`]: {
-          textAlign: 'end',
-          background: token.modalFooterBg,
-          marginTop: token.marginSM,
-
-          [`${token.antCls}-btn + ${token.antCls}-btn:not(${token.antCls}-dropdown-trigger)`]: {
-            marginBottom: 0,
-            marginInlineStart: token.marginXS,
-          },
-        },
-
-        [`${componentCls}-open`]: {
-          overflow: 'hidden',
-        },
-      },
-    },
-
-    // ======================== Pure =========================
-    {
-      [`${componentCls}-pure-panel`]: {
-        top: 'auto',
-        padding: 0,
-        display: 'flex',
-        flexDirection: 'column',
-
-        [`${componentCls}-content,
-          ${componentCls}-body,
-          ${componentCls}-confirm-body-wrapper`]: {
-          display: 'flex',
-          flexDirection: 'column',
-          flex: 'auto',
-        },
-
-        [`${componentCls}-confirm-body`]: {
-          marginBottom: 'auto',
-        },
-      },
-    },
-  ]
-}
-
-const genModalConfirmStyle: GenerateStyle<ModalToken> = (token) => {
-  const { componentCls } = token
-  const confirmComponentCls = `${componentCls}-confirm`
-
-  return {
-    [confirmComponentCls]: {
-      '&-rtl': {
-        direction: 'rtl',
-      },
-      [`${token.antCls}-modal-header`]: {
-        display: 'none',
-      },
-      [`${confirmComponentCls}-body-wrapper`]: {
-        ...clearFix(),
-      },
-      [`${confirmComponentCls}-body`]: {
-        display: 'flex',
-        flexWrap: 'wrap',
-        alignItems: 'center',
-
-        [`${confirmComponentCls}-title`]: {
-          flex: '0 0 100%',
-          display: 'block',
-          // create BFC to avoid
-          // https://user-images.githubusercontent.com/507615/37702510-ba844e06-2d2d-11e8-9b67-8e19be57f445.png
-          overflow: 'hidden',
-          color: token.colorTextHeading,
-          fontWeight: token.fontWeightStrong,
-          fontSize: token.modalHeaderTitleFontSize,
-          lineHeight: token.modalHeaderTitleLineHeight,
-
-          [`+ ${confirmComponentCls}-content`]: {
-            marginBlockStart: token.marginXS,
-            flexBasis: '100%',
-            maxWidth: `calc(100% - ${token.modalConfirmIconSize + token.marginSM}px)`,
-          },
-        },
-
-        [`${confirmComponentCls}-content`]: {
-          color: token.colorText,
-          fontSize: token.fontSize,
-        },
-
-        [`> ${token.iconCls}`]: {
-          flex: 'none',
-          marginInlineEnd: token.marginSM,
-          fontSize: token.modalConfirmIconSize,
-
-          [`+ ${confirmComponentCls}-title`]: {
-            flex: 1,
-          },
-
-          // `content` after `icon` should set marginLeft
-          [`+ ${confirmComponentCls}-title + ${confirmComponentCls}-content`]: {
-            marginInlineStart: token.modalConfirmIconSize + token.marginSM,
-          },
-        },
-      },
-      [`${confirmComponentCls}-btns`]: {
-        textAlign: 'end',
-        marginTop: token.marginSM,
-
-        [`${token.antCls}-btn + ${token.antCls}-btn`]: {
-          marginBottom: 0,
-          marginInlineStart: token.marginXS,
-        },
-      },
-    },
-
-    [`${confirmComponentCls}-error ${confirmComponentCls}-body > ${token.iconCls}`]: {
-      color: token.colorError,
-    },
-
-    [`${confirmComponentCls}-warning ${confirmComponentCls}-body > ${token.iconCls},
-        ${confirmComponentCls}-confirm ${confirmComponentCls}-body > ${token.iconCls}`]: {
-      color: token.colorWarning,
-    },
-
-    [`${confirmComponentCls}-info ${confirmComponentCls}-body > ${token.iconCls}`]: {
-      color: token.colorInfo,
-    },
-
-    [`${confirmComponentCls}-success ${confirmComponentCls}-body > ${token.iconCls}`]: {
-      color: token.colorSuccess,
-    },
-
-    // https://github.com/ant-design/ant-design/issues/37329
-    [`${componentCls}-zoom-leave ${componentCls}-btns`]: {
-      pointerEvents: 'none',
-    },
-  }
-}
-
-const genRTLStyle: GenerateStyle<ModalToken> = (token) => {
-  const { componentCls } = token
-  return {
-    [`${componentCls}-root`]: {
-      [`${componentCls}-wrap-rtl`]: {
-        direction: 'rtl',
-
-        [`${componentCls}-confirm-body`]: {
-          direction: 'rtl',
-        },
-      },
-    },
-  }
-}
-
-const genWireframeStyle: GenerateStyle<ModalToken> = (token) => {
-  const { componentCls, antCls } = token
-  const confirmComponentCls = `${componentCls}-confirm`
-
-  return {
-    [componentCls]: {
-      [`${componentCls}-content`]: {
-        padding: 0,
-      },
-
-      [`${componentCls}-header`]: {
-        padding: token.modalHeaderPadding,
-        borderBottom: `${token.modalHeaderBorderWidth}px ${token.modalHeaderBorderStyle} ${token.modalHeaderBorderColorSplit}`,
-        marginBottom: 0,
-      },
-
-      [`${componentCls}-body`]: {
-        padding: token.modalBodyPadding,
-      },
-
-      [`${componentCls}-footer`]: {
-        padding: `${token.modalFooterPaddingVertical}px ${token.modalFooterPaddingHorizontal}px`,
-        borderTop: `${token.modalFooterBorderWidth}px ${token.modalFooterBorderStyle} ${token.modalFooterBorderColorSplit}`,
-        borderRadius: `0 0 ${token.borderRadiusLG}px ${token.borderRadiusLG}px`,
-        marginTop: 0,
-      },
-    },
-
-    [confirmComponentCls]: {
-      [`${antCls}-modal-body`]: {
-        padding: `${token.padding * 2}px ${token.padding * 2}px ${token.paddingLG}px`,
-      },
-      [`${confirmComponentCls}-body`]: {
-        [`> ${token.iconCls}`]: {
-          marginInlineEnd: token.margin,
-
-          // `content` after `icon` should set marginLeft
-          [`+ ${confirmComponentCls}-title + ${confirmComponentCls}-content`]: {
-            marginInlineStart: token.modalConfirmIconSize + token.margin,
-          },
-        },
-      },
-      [`${confirmComponentCls}-btns`]: {
-        marginTop: token.marginLG,
-      },
-    },
-  }
-}
-
-// ============================== Export ==============================
-export default genComponentStyleHook('Modal', (token) => {
-  const headerPaddingVertical = token.padding
-  const headerFontSize = token.fontSizeHeading5
-  const headerLineHeight = token.lineHeightHeading5
-
-  const modalToken = mergeToken<ModalToken>(token, {
-    modalBodyPadding: token.paddingLG,
-    modalHeaderBg: token.colorBgElevated,
-    modalHeaderPadding: `${headerPaddingVertical}px ${token.paddingLG}px`,
-    modalHeaderBorderWidth: token.lineWidth,
-    modalHeaderBorderStyle: token.lineType,
-    modalHeaderTitleLineHeight: headerLineHeight,
-    modalHeaderTitleFontSize: headerFontSize,
-    modalHeaderBorderColorSplit: token.colorSplit,
-    modalHeaderCloseSize: headerLineHeight * headerFontSize + headerPaddingVertical * 2,
-    modalContentBg: token.colorBgElevated,
-    modalHeadingColor: token.colorTextHeading,
-    modalCloseColor: token.colorTextDescription,
-    modalFooterBg: 'transparent',
-    modalFooterBorderColorSplit: token.colorSplit,
-    modalFooterBorderStyle: token.lineType,
-    modalFooterPaddingVertical: token.paddingXS,
-    modalFooterPaddingHorizontal: token.padding,
-    modalFooterBorderWidth: token.lineWidth,
-    modalConfirmTitleFontSize: token.fontSizeLG,
-    modalIconHoverColor: token.colorIconHover,
-    modalConfirmIconSize: token.fontSize * token.lineHeight,
-    modalCloseBtnSize: token.controlHeightLG * 0.55,
-  })
-  return [
-    genModalStyle(modalToken),
-    genModalConfirmStyle(modalToken),
-    genRTLStyle(modalToken),
-    genModalMaskStyle(modalToken),
-    token.wireframe && genWireframeStyle(modalToken),
-    initZoomMotion(modalToken, 'zoom'),
-  ]
-})