/** * @author Hanz * @date 2022/1/13 上午10:30 * @description 通知提醒框 */ import React from 'react'; import './index.scss'; export type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'; export type IconType = 'success' | 'info' | 'error' | 'warning'; export interface ConfigProps { /** 消息从顶部弹出时,距离顶部的位置,单位像素 */ top?: number; /** 消息从底部弹出时,距离底部的位置,单位像素 */ bottom?: number; /** 距离左侧的位置,单位像素 */ left?: number; /** 距离右侧的位置,单位像素 */ right?: number; /** 默认自动关闭延时,单位秒 */ duration?: number; /** 弹出位置 */ placement?: NotificationPlacement; /** 配置渲染输出位置 */ getContainer?: () => HTMLElement; /** 自定义关闭图标 */ closeIcon?: React.ReactNode; /** 最大显示数 */ maxCount?: number; } export interface ArgsProps { /** 通知提醒标题 */ message: React.ReactNode; /** 通知提醒内容 */ description?: React.ReactNode; /** 自定义关闭按钮 */ btn?: React.ReactNode; /** 当前通知唯一标志 */ key?: string; /** 关闭时触发 */ onClose?: () => void; /** 默认 5 秒后自动关闭,配置为 null 则不自动关闭 */ duration?: number | null; /** 自定义图标 */ icon?: React.ReactNode; /** 弹出位置 */ placement?: NotificationPlacement; /** style */ style?: React.CSSProperties; /** cls */ className?: string; /** 图标类型 内部使用*/ readonly type?: IconType; /** 点击通知时触发 */ onClick?: () => void; /** 消息从顶部弹出时,距离顶部的位置,单位像素 */ top?: number; /** 消息从底部弹出时,距离底部的位置,单位像素 */ bottom?: number; /** 距离左侧的位置,单位像素 */ left?: number; /** 距离右侧的位置,单位像素 */ right?: number; /** 渲染容器 */ getContainer?: () => HTMLElement; /** 自定义关闭图标 */ closeIcon?: React.ReactNode; } export interface NotificationInstance { success(args: ArgsProps): void; error(args: ArgsProps): void; info(args: ArgsProps): void; warning(args: ArgsProps): void; open(args: ArgsProps): void; } export interface NotificationApi extends NotificationInstance { warn(args: ArgsProps): void; close(key: string): void; config(options: ConfigProps): void; destroy(): void; } declare const _default: NotificationApi; export default _default;