@unlazy/nuxt
Version:
Nuxt lazy loading module for placeholder images
66 lines (65 loc) • 2.99 kB
text/typescript
import type { UnLazySource } from 'unlazy';
import type { ImgHTMLAttributes } from 'vue';
type __VLS_Props = {
/** Image source URL to be lazy-loaded. */
src?: ImgHTMLAttributes['src'];
/** Image source set to be lazy-loaded. */
srcSet?: ImgHTMLAttributes['srcset'];
/** Image source URLs for different resolutions. This will render the `<picture>` element instead of `<img>`. */
sources?: UnLazySource[];
/**
* A flag to indicate whether the sizes attribute should be automatically calculated.
* @default false
*/
autoSizes?: boolean;
/** A BlurHash string representing the blurry placeholder image. */
blurhash?: string;
/** A ThumbHash string representing the blurry placeholder image. */
thumbhash?: string;
/** Optional image source URL for a custom placeholder image. Will be ignored if a BlurHash or ThumbHash is provided. */
placeholderSrc?: string;
/** The size of the longer edge (width or height) of the BlurHash image to be decoded, depending on the aspect ratio. This option only applies when the `blurhash` prop is used. */
placeholderSize?: number;
/** Aspect ratio (width / height) of the decoded BlurHash image. Only applies to SSR-decoded placeholder images from a BlurHash string. */
placeholderRatio?: number;
/**
* A flag to indicate whether the image should be lazy-loaded (default) or deferred until this prop is set to `true`. Note: Placeholder images from hashes will still be decoded.
* @default true
*/
lazyLoad?: boolean;
/**
* A flag to indicate whether the image should be preloaded, even if it is not in the viewport yet.
* @default false
*/
preload?: boolean;
/** Whether the ThumbHash or BlurHash should be decoded on the server. Overrides the global module configuration if set. */
ssr?: boolean;
/**
* Allows to specify the loading strategy of the image.
* @default 'lazy'
*/
loading?: ImgHTMLAttributes['loading'];
};
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
imageLoad: (image: HTMLImageElement) => any;
imageError: (image: HTMLImageElement, error: Event) => any;
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
onImageLoad?: ((image: HTMLImageElement) => any) | undefined;
onImageError?: ((image: HTMLImageElement, error: Event) => any) | undefined;
}>, {
blurhash: string;
loading: "lazy" | "eager";
thumbhash: string;
ssr: boolean;
placeholderSize: number;
preload: boolean;
src: string;
srcSet: string;
sources: UnLazySource[];
autoSizes: boolean;
placeholderSrc: string;
placeholderRatio: number;
lazyLoad: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
declare const _default: typeof __VLS_export;
export default _default;