import React, { ReactNode } from "react"; import { StyledProps } from "../_type"; import { AttachContainer } from "../_util/get-overlay-root"; /** * 对话框组件配置 */ export interface ModalProps extends StyledProps { /** * 对话框内容 */ children?: ReactNode; /** * 对话框是否可见 */ visible?: boolean; /** * 对话框的标题 * 如果禁用关闭图标的同时,没有传入对话框标题,则不渲染标题 */ caption?: string | JSX.Element; /** * 对话框尺寸,决定对话框的宽度 * - `"s"` 小尺寸对话框,宽度 480px * - `"m"` 默认尺寸对话框,宽度 550px * - `"l"` 大尺寸对话框,宽度 800px * - `"xl"` 超大尺寸对话框,宽度 950px * - `"auto"` 自动适应宽度 * - 传入数字/百分比可以自定义宽度 */ size?: "s" | "m" | "l" | "xl" | "auto" | number | string; /** * 对话框关闭时回调 */ onClose?: () => void; /** * 对话框关闭动画结束时回调 */ onExited?: () => void; /** * 默认 ESC 键会触发 `onClose` 的调用,设置为 `true` 禁止该行为 * @default false */ disableEscape?: boolean; /** * 是否禁用关闭图标 * 如果禁用关闭图标的同时,没有传入对话框标题,则不渲染标题 * @default false */ disableCloseIcon?: boolean; /** * 是否启用点击遮罩关闭 * @default false */ maskClosable?: boolean; /** * 关闭时是否销毁 Modal 中元素 * @default true * @since 2.3.0 */ destroyOnClose?: boolean; /** * 挂载组件的节点 * @default document.body * @since 2.5.0 */ popupContainer?: AttachContainer; /** * 遮罩样式 * @since 2.5.4 */ maskStyle?: React.CSSProperties; } /** * 全局配置 */ export interface ModelConfigOptions extends Pick { } /** * 模态对话框组件 */ export declare const Modal: React.FunctionComponent> & { /** * 渲染对话框的主要内容 */ Body: React.ForwardRefExoticComponent>; /** * 渲染对话框的底部内容 */ Footer: React.ForwardRefExoticComponent>; /** * 对话框消息内容,可置于 Body: */ Message: React.ForwardRefExoticComponent>; /** * 全局配置 */ config: (options?: ModelConfigOptions) => void; };