chore: update type modal (#2711)

Author: binhaoCen

types/modal.d.ts

@@ -3,7 +3,7 @@
 // Definitions: https://github.com/vueComponent/ant-design-vue/types
 
 import { AntdComponent } from './component';
-import { VNode } from 'vue';
+import { VNode, CSSProperties, VNodeChild } from 'vue';
 import { TreeNode } from './tree-node';
 import { Button } from './button/button';
 
@@ -39,10 +39,15 @@ export interface ModalOptions {
    * Modal content
    * @type string | VNode | (h) => VNode
    */
-  content?: any;
-
+  content?:  VNodeChild | JSX.Element;
+  /**
+   * custom icon (Added in 1.14.0)
+   */
   icon?: VNode | Function;
-
+  /**
+   * Whether show mask or not.
+   * @default true
+   */
   mask?: boolean;
 
   /**
@@ -89,7 +94,7 @@ export interface ModalOptions {
    * Title
    * @type string | VNode | (h) => VNode
    */
-  title?: any;
+  title?:  VNodeChild | JSX.Element;
 
   /**
    * Width of the modal dialog
@@ -104,8 +109,13 @@ export interface ModalOptions {
    * @type number
    */
   zIndex?: number;
-
-  dialogStyle?: object;
+  /**
+   * Style of floating layer, typically used at least for adjusting the position.
+   */
+  dialogStyle?: CSSProperties
+  /**
+   * className of floating layer.
+   */
   dialogClass?: string;
 
   /**
@@ -123,7 +133,9 @@ export interface ModalOptions {
    * @type Function
    */
   onOk?: () => any;
-
+  /**
+   * The parent context of the popup is generally used to get the parent provider, such as the configuration of ConfigProvider
+   */
   parentContext?: object;
 }
 
@@ -141,150 +153,153 @@ export interface ModalConfirm {
 }
 
 export declare class Modal extends AntdComponent {
-  /**
+  $props: {
+    /**
    * Specify a function that will be called when modal is closed completely.
    * @type Function
    */
-  afterClose: () => any;
-
-  /**
-   * Body style for modal body element. Such as height, padding etc.
-   * @default {}
-   * @type object
-   */
-  bodyStyle: object;
-
-  /**
-   * Text of the Cancel button
-   * @default 'cancel'
-   * @type string
-   */
-  cancelText: string;
-
-  /**
-   * Centered Modal
-   * @default false
-   * @type boolean
-   */
-  centered: boolean;
-
-  /**
-   * Whether a close (x) button is visible on top right of the modal dialog or not
-   * @default true
-   * @type boolean
-   */
-  closable: boolean;
-
-  closeIcon: any;
-
-  /**
-   * Whether to apply loading visual effect for OK button or not
-   * @default false
-   * @type boolean
-   */
-  confirmLoading: boolean;
-
-  /**
-   * Whether to unmount child components on onClose
-   * @default false
-   * @type boolean
-   */
-  destroyOnClose: boolean;
-
-  /**
-   * Footer content, set as :footer="null" when you don't need default buttons
-   * @default OK and Cancel buttons
-   * @type any (string | slot)
-   */
-  footer: any;
-
-  /**
-   * Return the mount node for Modal
-   * @default () => document.body
-   * @type Function
-   */
-  getContainer: (instance: any) => HTMLElement;
-
-  /**
-   * Whether show mask or not.
-   * @default true
-   * @type boolean
-   */
-  mask: boolean;
-
-  /**
-   * Whether to close the modal dialog when the mask (area outside the modal) is clicked
-   * @default true
-   * @type boolean
-   */
-  maskClosable: boolean;
-
-  /**
-   * Style for modal's mask element.
-   * @default {}
-   * @type object
-   */
-  maskStyle: object;
-
-  /**
-   * Text of the OK button
-   * @default 'OK'
-   * @type string
-   */
-  okText: string;
-
-  /**
-   * Button type of the OK button
-   * @default 'primary'
-   * @type string
-   */
-  okType: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default';
-
-  /**
-   * The ok button props, follow jsx rules
-   * @type object
-   */
-  okButtonProps: { props: Button; on: {} };
-
-  /**
-   * The cancel button props, follow jsx rules
-   * @type object
-   */
-  cancelButtonProps: { props: Button; on: {} };
-
-  /**
-   * The modal dialog's title
-   * @type any (string | slot)
-   */
-  title: any;
-
-  /**
-   * Whether the modal dialog is visible or not
-   * @default false
-   * @type boolean
-   */
-  visible: boolean;
-
-  /**
-   * Width of the modal dialog
-   * @default 520
-   * @type string | number
-   */
-  width: string | number;
-
-  /**
-   * The class name of the container of the modal dialog
-   * @type string
-   */
-  wrapClassName: string;
-
-  /**
-   * The z-index of the Modal
-   * @default 1000
-   * @type number
-   */
-  zIndex: number;
-
+    afterClose?: () => any;
+
+    /**
+     * Body style for modal body element. Such as height, padding etc.
+     * @default {}
+     * @type object
+     */
+    bodyStyle?: CSSProperties;
+
+    /**
+     * Text of the Cancel button
+     * @default 'cancel'
+     * @type string
+     */
+    cancelText?: string;
+
+    /**
+     * Centered Modal
+     * @default false
+     * @type boolean
+     */
+    centered?: boolean;
+
+    /**
+     * Whether a close (x) button is visible on top right of the modal dialog or not
+     * @default true
+     * @type boolean
+     */
+    closable?: boolean;
+    /**
+     * Whether a close (x) button is visible on top right of the modal dialog or not
+     */
+    closeIcon?: VNodeChild | JSX.Element;
+
+    /**
+     * Whether to apply loading visual effect for OK button or not
+     * @default false
+     * @type boolean
+     */
+    confirmLoading?: boolean;
+
+    /**
+     * Whether to unmount child components on onClose
+     * @default false
+     * @type boolean
+     */
+    destroyOnClose?: boolean;
+
+    /**
+     * Footer content, set as :footer="null" when you don't need default buttons
+     * @default OK and Cancel buttons
+     * @type any (string | slot)
+     */
+    footer?: VNodeChild | JSX.Element;
+
+    /**
+     * Return the mount node for Modal
+     * @default () => document.body
+     * @type Function
+     */
+    getContainer?: (instance: any) => HTMLElement;
+
+    /**
+     * Whether show mask or not.
+     * @default true
+     * @type boolean
+     */
+    mask?: boolean;
+
+    /**
+     * Whether to close the modal dialog when the mask (area outside the modal) is clicked
+     * @default true
+     * @type boolean
+     */
+    maskClosable?: boolean;
+
+    /**
+     * Style for modal's mask element.
+     * @default {}
+     * @type object
+     */
+    maskStyle?: CSSProperties;
+
+    /**
+     * Text of the OK button
+     * @default 'OK'
+     * @type string
+     */
+    okText?: string;
+
+    /**
+     * Button type of the OK button
+     * @default 'primary'
+     * @type string
+     */
+    okType?: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default';
+
+    /**
+     * The ok button props, follow jsx rules
+     * @type object
+     */
+    okButtonProps?: { props: Button; on: {} };
+
+    /**
+     * The cancel button props, follow jsx rules
+     * @type object
+     */
+    cancelButtonProps?: { props: Button; on: {} };
+
+    /**
+     * The modal dialog's title
+     * @type any (string | slot)
+     */
+    title?:  VNodeChild | JSX.Element;
+
+    /**
+     * Whether the modal dialog is visible or not
+     * @default false
+     * @type boolean
+     */
+    visible?: boolean;
+
+    /**
+     * Width of the modal dialog
+     * @default 520
+     * @type string | number
+     */
+    width?: string | number;
+
+    /**
+     * The class name of the container of the modal dialog
+     * @type string
+     */
+    wrapClassName?: string;
+
+    /**
+     * The z-index of the Modal
+     * @default 1000
+     * @type number
+     */
+    zIndex?: number;
+  }
   static info(options: ModalOptions): ModalConfirm;
   static success(options: ModalOptions): ModalConfirm;
   static error(options: ModalOptions): ModalConfirm;