Skip to content

chore: update type modal #2711

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 19, 2020
Merged

chore: update type modal #2711

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
313 changes: 164 additions & 149 deletions types/modal.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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';

Expand Down Expand Up @@ -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;

/**
Expand Down Expand Up @@ -89,7 +94,7 @@ export interface ModalOptions {
* Title
* @type string | VNode | (h) => VNode
*/
title?: any;
title?: VNodeChild | JSX.Element;

/**
* Width of the modal dialog
Expand All @@ -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;

/**
Expand All @@ -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;
}

Expand All @@ -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;
Expand Down