@prass/betterimage/index.d.mts

BetterImage is a Next.js-focused library for building optimized image components with advanced features, including fallback animations. It enhances Next.js's built-in Image component, offering seamless optimization and an improved user experience for your

import * as next_image from 'next/image';
import next_image__default from 'next/image';
import * as next_dist_shared_lib_get_img_props from 'next/dist/shared/lib/get-img-props';
import * as React from 'react';
import React__default from 'react';

/**
 * This is a type for the props of the `div` element.
 * It is used as a type for the `Root` component.
 */
type RProps = React__default.ComponentPropsWithoutRef<"div">;
/**
 * This is a type for the props of the `Image` component.
 * It is used as a type for the `BetterImage` component.
 */
type IProps = React__default.ComponentPropsWithoutRef<typeof next_image__default>;
/**
 * This is a type for the props of the `Fallback` component.
 * It is used as a type for the `Fallback` component.
 */
type FProps = React__default.ComponentPropsWithoutRef<"div"> & {
    /**
     * An optional number prop that specifies how long to wait before rendering
     * the fallback element.
     */
    delay?: number;
    /**
     * An optional string prop that specifies the content of the fallback element.
     */
    onFailString?: string;
};

declare const Root: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
declare const Image: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref" | "loading" | "height" | "width" | "alt" | "src" | "srcSet"> & {
    src: string | next_dist_shared_lib_get_img_props.StaticImport;
    alt: string;
    width?: number | `${number}`;
    height?: number | `${number}`;
    fill?: boolean;
    loader?: next_image.ImageLoader;
    quality?: number | `${number}`;
    priority?: boolean;
    loading?: "eager" | "lazy" | undefined;
    placeholder?: next_dist_shared_lib_get_img_props.PlaceholderValue;
    blurDataURL?: string;
    unoptimized?: boolean;
    overrideSrc?: string;
    onLoadingComplete?: next_dist_shared_lib_get_img_props.OnLoadingComplete;
    layout?: string;
    objectFit?: string;
    objectPosition?: string;
    lazyBoundary?: string;
    lazyRoot?: string;
} & React.RefAttributes<HTMLImageElement | null>, "ref"> & React.RefAttributes<HTMLImageElement>>;
declare const Fallback: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
    delay?: number;
    onFailString?: string;
} & React.RefAttributes<HTMLDivElement>>;
type RootProps = RProps;
type ImageProps = IProps;
type FallbackProps = FProps;

export { Fallback, type FallbackProps, Image, type ImageProps, Root, type RootProps };