jamis/lib/r-dialog/types.d.ts

一种支持通过JSON配置方式生成页面的组件库

import type { ActionObject, BaseSchemaScoped, BaseSchemaWithoutType, RendererEvent, RendererProps, SchemaClassName, SchemaExpression } from 'jamis-core';
import type { CSSProperties, PropsWithChildren } from 'react';
import type { ActionSchema, IModalStore, SchemaCollection, SizeUnit } from '../types';
export type { IModalStore } from './ModalStore';
export interface CommonDialogDrawer extends BaseSchemaScoped {
    /**
     * 默认不用填写，自动会创建确认和取消按钮。
     */
    actions?: Array<ActionSchema | ({
        children: JSX.Element | ((props: any, schema?: any) => JSX.Element) | null;
        actionType: undefined;
    } & BaseSchemaWithoutType)>;
    /**
     * 内容区域
     */
    body?: SchemaCollection;
    /**
     * 配置 Body 容器 className
     */
    bodyClassName?: SchemaClassName;
    /**
     * 元素`.cxd-Modal-content`的样式类
     */
    contentClassName?: SchemaClassName;
    /**
     * 是否支持按 ESC 关闭 Dialog
     */
    closeOnEsc?: boolean;
    /**
     * 是否支持点其它区域关闭 Dialog
     */
    closeOnOutside?: boolean;
    /**
     * Dialog 大小
     */
    size?: SizeUnit;
    sizeExpr?: SchemaExpression;
    /**
     * Dialog 宽度
     */
    width?: string | number;
    /**
     * Dialog 高度
     */
    height?: string | number;
    /**
     * 请通过配置 title 设置标题
     */
    title?: SchemaCollection;
    titleClassName?: SchemaClassName;
    header?: SchemaCollection;
    headerClassName?: SchemaClassName;
    footerClassName?: SchemaClassName;
    actionsClassName?: SchemaClassName;
    /**
     * 影响自动生成的按钮，如果自己配置了按钮这个配置无效。
     */
    confirm?: boolean;
    /**
     * 确认按钮的文本
     */
    confirmText?: string;
    /**
     * 取消按钮的文本
     */
    cancelText?: string;
    /**
     * 是否显示关闭按钮
     */
    showCloseButton?: boolean;
    /**
     * 是否显示错误信息
     */
    showErrorMsg?: boolean;
    /**
     * 是否显示 spinner
     */
    showLoading?: boolean;
    /**
     * 关闭弹窗的回调
     * @deprecated 使用 `cancel` 事件替代
     */
    onClose?: (confirmed?: boolean) => void;
    /**
     * 弹窗确认回调
     * @deprecated 使用 `confirm` 事件替代
     */
    onConfirm?: (values: Array<object>, action: ActionObject, ctx: object, targets: Array<any>) => void;
}
/**
 * Dialog 弹框渲染器。
 */
export interface DialogSchema extends CommonDialogDrawer {
    type: 'dialog';
}
export interface DialogSchemaBase extends Omit<DialogSchema, 'type'> {
    type?: 'dialog';
}
export interface DialogProps extends RendererProps, Omit<DialogSchema, 'className' | 'data'> {
    children?: React.ReactNode | ((props?: any) => React.ReactNode);
    store: IModalStore;
    show?: boolean;
    lazyRender?: boolean;
    wrapperComponent: React.ElementType;
    lazySchema?: (props: DialogProps) => SchemaCollection;
    dispatchEvent: (event: IDialogEvent, data?: any) => Promise<RendererEvent>;
    onClose: (confirmed?: boolean) => void;
    onConfirm: (values: Array<object>, action: ActionObject, ctx: object, targets: Array<any>) => void;
}
export type IDialogEvent = 'cancel' | 'confirm' | 'close';
/**
 * Drawer 抽出式弹框。
 *
 */
export interface DrawerSchema extends CommonDialogDrawer {
    type: 'drawer';
    /**
     * 从什么位置弹出
     */
    position?: DrawerPosition;
    /**
     * 是否可以拖动弹窗大小
     */
    resizable?: boolean;
    resizableOn?: SchemaExpression;
    /**
     * 是否显示蒙层
     */
    overlay?: boolean;
}
export interface DrawerSchemaBase extends Omit<DrawerSchema, 'type'> {
    type?: 'drawer';
}
export interface DrawerRendererProps extends RendererProps, Omit<DrawerSchema, 'className' | 'data' | 'onClose'> {
    onClose: () => void;
    children?: React.ReactNode | ((props?: any) => React.ReactNode);
    wrapperComponent: React.ElementType;
    lazySchema?: (props: DrawerRendererProps) => SchemaCollection;
    store: IModalStore;
    show?: boolean;
    drawerContainer?: () => HTMLElement;
}
export type DrawerPosition = 'top' | 'right' | 'bottom' | 'left';
export interface DrawerProps extends PropsWithChildren {
    className?: string;
    contentClassName?: SchemaClassName;
    /** 等同于 contentClassName */
    bodyClassName?: SchemaClassName;
    size: SizeUnit;
    overlay: boolean;
    onHide: (e: any) => void;
    closeOnEsc?: boolean;
    container: any;
    show?: boolean;
    showCloseButton?: boolean;
    width?: number | string;
    height?: number | string;
    position: DrawerPosition;
    disabled?: boolean;
    closeOnOutside?: boolean;
    resizable?: boolean;
    style?: CSSProperties;
    onExited?: () => void;
    onEntered?: () => void;
}