import type { ExtractPropTypes, PropType } from 'vue';

/**
 * u-mask 组件 props 类型定义
 * @description 遮罩层，支持自定义样式、缩放、动画等
 */
export const MaskProps = {
    /** 自定义根节点样式 */
    customStyle: {
        type: [String, Object] as PropType<string | Record<string, any>>,
        default: () => ({})
    },
    /** 自定义根节点样式类 */
    customClass: {
        type: String as unknown as PropType<string>,
        default: ''
    },
    /** 是否显示遮罩 */
    show: {
        type: Boolean,
        default: false
    },
    /** 层级z-index */
    zIndex: {
        type: [Number, String] as PropType<number | string>,
        default: ''
    },
    /** 遮罩的动画样式，是否使用zoom进行scale进行缩放 */
    zoom: {
        type: Boolean,
        default: true
    },
    /** 遮罩的过渡时间，单位为ms */
    duration: {
        type: [Number, String] as PropType<number | string>,
        default: 300
    },
    /** 是否可以通过点击遮罩进行关闭 */
    maskClickAble: {
        type: Boolean,
        default: true
    }
};

/**
 * u-mask 组件 props 类型
 */
export type MaskProps = ExtractPropTypes<typeof MaskProps>;