@minto-ai/mt-ui/dist/popover/src/popover.d.ts

UI组件库

import { Options, Placement } from '@popperjs/core';
import { ExtractPropTypes, InjectionKey, PropType, Ref, StyleValue } from 'vue';
interface PopoverInstance {
    hide: () => void;
    show: () => void;
}
type PopoverTriggerType = 'hover' | 'click' | 'manual';
type PopoverEffect = 'light' | 'dark';
type ClassObjectType = Record<string, boolean>;
type ClassType = string | ClassObjectType | ClassType[];
declare const popoverProps: {
    /**
     * 触发方式
     */
    trigger: {
        type: PropType<PopoverTriggerType>;
        default: string;
    };
    /**
     * 显示的内容
     */
    content: {
        type: StringConstructor;
        default: string;
    };
    /**
     * popover 内容的宽度
     */
    width: {
        type: PropType<number | string>;
        validator: (value: number | string) => boolean;
        default: number;
    };
    /**
     * 出现的位置
     */
    placement: {
        type: PropType<Placement>;
        default: string;
    };
    /**
     * 是否禁用
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * popover 内容的偏移量
     */
    offset: {
        type: NumberConstructor;
        default: undefined;
    };
    /**
     * 是否显示
     */
    visible: {
        type: PropType<boolean | null>;
        default: null;
    };
    /**
     * 切换 visible 状态的回调
     */
    'onUpdate:visible': {
        type: PropType<(visible: boolean) => void>;
    };
    /**
     * 是否显示箭头
     */
    showArrow: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * popover 的参数
     */
    popperOptions: {
        type: PropType<Partial<Options>>;
        default: () => {};
    };
    /**
     * popover 策略
     */
    strategy: {
        type: PropType<"absolute" | "fixed">;
        default: string;
    };
    /**
     * popover 回退位置
     */
    fallbackPlacements: {
        type: PropType<Placement[]>;
        default: undefined;
    };
    /**
     * popover 是否开启 GPU 加速
     */
    gpuAcceleration: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * popover 类名
     */
    popperClass: {
        type: PropType<ClassType>;
        default: string;
    };
    /**
     * 延迟显示，单位毫秒
     */
    showAfter: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * 延迟关闭，单位毫秒
     */
    hideAfter: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * 是否自动关闭
     */
    autoClose: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * popover 样式
     */
    popperStyle: {
        type: PropType<StyleValue>;
        default: () => {};
    };
    /**
     * Content 挂载到哪个 DOM 元素
     */
    appendTo: {
        type: PropType<string | HTMLElement>;
        default: string;
    };
    /**
     * Content 主题
     */
    effect: {
        type: PropType<PopoverEffect>;
        default: string;
    };
    /**
     * 是否将 content 作为 HTML 字符串处理
     */
    rawContent: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否虚拟触发
     */
    virtualTriggering: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 虚拟触发的元素
     */
    virtualRef: {
        type: PropType<Ref<HTMLElement | null>>;
        default: () => null;
    };
    /**
     * popover 内容的 z-index
     */
    zIndex: {
        type: NumberConstructor;
    };
    /**
     * 是否可进入
     */
    enterable: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * 是否启用 teleport 功能
     */
    teleported: {
        type: BooleanConstructor;
        default: boolean;
    };
};
interface PopoverEmits {
    'update:visible': [boolean];
    'show': [];
    'hide': [];
    'beforeEnter': [];
    'beforeLeave': [];
}
type PopoverProps = ExtractPropTypes<typeof popoverProps>;
interface MtPopperInjectionContext {
    triggerRef: Ref<HTMLElement | null>;
    contentRef: Ref<HTMLElement | null>;
    arrowRef: Ref<HTMLElement | null>;
    contentVisible: Ref<boolean>;
    onShow: () => void;
    onHide: () => void;
    onToggle: () => void;
}
export declare const POPPER_INJECTION_KEY: InjectionKey<MtPopperInjectionContext>;
interface MtPopperContentInjectionContext {
    arrowRef: Ref<HTMLElement | null>;
}
export declare const POPPER_CONTENT_INJECTION_KEY: InjectionKey<MtPopperContentInjectionContext>;
export type { PopoverEffect, PopoverEmits, PopoverInstance, PopoverProps, PopoverTriggerType, };
export { popoverProps, };