maz-ui/components/MazGallery.d.ts

A standalone components library for Vue.Js 3 & Nuxt.Js 3

import type { MazGalleryImage } from './types';
import { type PropType } from 'vue';
export type { MazGalleryImage } from './types';
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
    /**
     *  Array of string or object: `['https://via.placeholder.com/500', 'https://via.placeholder.com/600']` or `[{ slug: 'https://via.placeholder.com/500', alt: 'image descripton' }, { slug: 'https://via.placeholder.com/600', alt: 'image descripton' }]`
     */
    images: {
        type: PropType<MazGalleryImage[]>;
        default: () => never[];
    };
    /** Images count shown (max: 5) */
    imagesShownCount: {
        type: NumberConstructor;
        default: number;
    };
    /** Remove transparent layer with the remain count (ex: +2) */
    noRemaining: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Height of gallery */
    height: {
        type: (NumberConstructor | StringConstructor)[];
        default: number;
    };
    /** Remove default height - useful to set height with css */
    noHeight: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Width of gallery */
    width: {
        type: (NumberConstructor | StringConstructor)[];
        default: string;
    };
    /** Remove default width */
    noWidth: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable the border radius of the gallery */
    noRadius: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable full size display when clicking on image */
    noZoom: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Layer with photography icon when no images is provided */
    hasEmptyLayer: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Lazy load image - if false, images are directly loaded */
    lazy: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable blur effect on image hover */
    blur: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable scale animation effect on image hover */
    scale: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Choose color of borders between images - Should be a CSS color or CSS variable - Ex: `#000` or `var(--maz-color-bg-light)` */
    separatorColor: {
        type: StringConstructor;
        default: string;
    };
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
    /**
     *  Array of string or object: `['https://via.placeholder.com/500', 'https://via.placeholder.com/600']` or `[{ slug: 'https://via.placeholder.com/500', alt: 'image descripton' }, { slug: 'https://via.placeholder.com/600', alt: 'image descripton' }]`
     */
    images: {
        type: PropType<MazGalleryImage[]>;
        default: () => never[];
    };
    /** Images count shown (max: 5) */
    imagesShownCount: {
        type: NumberConstructor;
        default: number;
    };
    /** Remove transparent layer with the remain count (ex: +2) */
    noRemaining: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Height of gallery */
    height: {
        type: (NumberConstructor | StringConstructor)[];
        default: number;
    };
    /** Remove default height - useful to set height with css */
    noHeight: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Width of gallery */
    width: {
        type: (NumberConstructor | StringConstructor)[];
        default: string;
    };
    /** Remove default width */
    noWidth: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable the border radius of the gallery */
    noRadius: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable full size display when clicking on image */
    noZoom: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Layer with photography icon when no images is provided */
    hasEmptyLayer: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Lazy load image - if false, images are directly loaded */
    lazy: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable blur effect on image hover */
    blur: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Disable scale animation effect on image hover */
    scale: {
        type: BooleanConstructor;
        default: boolean;
    };
    /** Choose color of borders between images - Should be a CSS color or CSS variable - Ex: `#000` or `var(--maz-color-bg-light)` */
    separatorColor: {
        type: StringConstructor;
        default: string;
    };
}>> & Readonly<{}>, {
    blur: boolean;
    width: string | number;
    height: string | number;
    lazy: boolean;
    scale: boolean;
    images: MazGalleryImage[];
    imagesShownCount: number;
    noRemaining: boolean;
    noHeight: boolean;
    noWidth: boolean;
    noRadius: boolean;
    noZoom: boolean;
    hasEmptyLayer: boolean;
    separatorColor: string;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export default _default;