@cainiaofe/cn-ui-m
Version:
90 lines (89 loc) • 2.55 kB
TypeScript
import React, { ReactNode } from 'react';
import type { CnButtonProps } from "../../cn-button";
import type { CnModalProps } from "../../cn-modal";
export interface CnDrawerButtonProps extends CnButtonProps {
children?: string | React.ReactNode;
visible?: boolean;
}
export interface CnDrawerProps extends CnModalProps {
/**
* 是否显示
*/
visible: boolean;
/**
* 容器的className
*/
containerClassName?: string;
/**
* 位于页面的位置
* 可选值:'top', 'right', 'bottom', 'left'
*/
placement?: 'top' | 'bottom' | 'left' | 'right';
/**
* 标题
*/
title?: string;
/**
* 标题(如有)的水平对齐方式
*/
titleAlign?: 'left' | 'center';
/**
* 宽度,仅在 placement是 left right 的时候生效
*/
width?: number | string;
/**
* 高度,仅在 placement是 top bottom 的时候生效
*/
height?: number | string;
/**
* 控制对话框关闭的方式,值可以为字符串或者布尔值,其中字符串是由以下值组成:
close 表示点击关闭按钮可以关闭对话框
mask 表示点击遮罩区域可以关闭对话框
esc 表示按下 esc 键可以关闭对话框
如 'close' 或 'close,esc,mask'
如果设置为 true,则以上关闭方式全部生效
如果设置为 false,则以上关闭方式全部失效
*/
closeMode?: string[];
/**
* 对话框关闭时触发的回调函数
签名:
Function(trigger: String, event: Object) => void
参数:
trigger: {String} 关闭触发行为的描述字符串
event: {Object} 关闭时事件对象
*/
onClose?: (reason?: string, e?: any) => void;
/**
* 弹层内容
*/
children?: ReactNode;
/**
* 应用于确定按钮的属性对象
*/
okProps?: CnDrawerButtonProps;
/**
* 在点击确定按钮时触发的回调函数
*/
onOk?: (event: React.MouseEvent) => void;
/**
* 在点击取消按钮时触发的回调函数
*/
onCancel?: (event: React.MouseEvent) => void;
/**
* 应用于取消按钮的属性对象
*/
cancelProps?: CnDrawerButtonProps;
/**
* 底部内容,设置为 false,则不进行显示
*/
footer?: boolean | ReactNode;
/**
* 取消内部自动生成的 CnCard
*/
noCard?: boolean;
/**
* 是否嵌入模式,如果开启嵌入模式, drawer 会取消内边距和上方圆角。
*/
embeddable?: boolean;
}