hongluan-ui/lib/components/thumb/src/thumb.d.ts

Hongluan Component Library for Vue 3

import type { ExtractPropTypes, PropType } from 'vue';
import type Thumb from './thumb.vue';
export declare const thumbProps: {
    appendToBody: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * @description when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode.
     */
    hideOnClickModal: BooleanConstructor;
    /**
     * @description image source, same as native.
     */
    src: {
        type: StringConstructor;
        default: string;
    };
    /**
     * @description indicate how the image should be resized to fit its container, same as [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).
     */
    fit: {
        type: StringConstructor;
        default: string;
    };
    /**
     * @description whether to use lazy load.
     */
    lazy: BooleanConstructor;
    /**
     * @description Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading)
     */
    loading: {
        type: PropType<"lazy" | "eager">;
    };
    /**
     * @description the container to add scroll listener when using lazy load.
     */
    scrollContainer: PropType<string | HTMLElement>;
    /**
     * @description allow big image preview.
     */
    previewSrcList: {
        type: PropType<string[]>;
        default: () => string[];
    };
    /**
     * @description whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`.
     */
    previewTeleported: BooleanConstructor;
    /**
     * @description set image preview z-index.
     */
    zIndex: {
        type: NumberConstructor;
    };
    size: {
        type: PropType<"xxxs" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl">;
        validator: (val: string) => boolean;
    };
    type: {
        type: PropType<"success" | "info" | "warning" | "danger" | "link" | "primary">;
        validator: (val: string) => boolean;
    };
    round: BooleanConstructor;
    radius: BooleanConstructor;
    bordered: BooleanConstructor;
    effect: StringConstructor;
    full: BooleanConstructor;
    /**
     * @description initial preview image index, less than the length of `url-list`.
     */
    initialIndex: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * @description whether the viewer preview is infinite.
     */
    infinite: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * @description whether the image-viewer can be closed by pressing ESC.
     */
    closeOnPressEscape: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * @description the zoom rate of the image viewer zoom event
     */
    zoomRate: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * @description the min scale of the image viewer zoom event.
     */
    minScale: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * @description the max scale of the image viewer zoom event.
     */
    maxScale: {
        type: NumberConstructor;
        default: number;
    };
    /**
     * @description set HTML attribute: crossorigin.
     */
    crossorigin: {
        type: PropType<"" | "anonymous" | "use-credentials">;
    };
};
export declare type ThumbProps = ExtractPropTypes<typeof thumbProps>;
export declare const thumbEmits: {
    load: (evt: Event) => boolean;
    error: (evt: Event) => boolean;
    switch: (val: number) => boolean;
    close: () => boolean;
    show: () => boolean;
};
export declare type ThumbEmits = typeof thumbEmits;
export declare type ThumbInstance = InstanceType<typeof Thumb>;