import type { VALID_INPUT_FORMATS, VALID_OUTPUT_FORMATS } from './consts.js'; import type { ImageService } from './services/service.js'; export type ImageQualityPreset = 'low' | 'mid' | 'high' | 'max' | (string & {}); export type ImageQuality = ImageQualityPreset | number; export type ImageInputFormat = (typeof VALID_INPUT_FORMATS)[number]; export type ImageOutputFormat = (typeof VALID_OUTPUT_FORMATS)[number] | (string & {}); declare global { var astroAsset: { imageService?: ImageService; addStaticImage?: ((options: ImageTransform) => string) | undefined; staticImages?: Map; }; } /** * Type returned by ESM imports of images and direct calls to imageMetadata */ export interface ImageMetadata { src: string; width: number; height: number; format: ImageInputFormat; orientation?: number; } /** * Options accepted by the image transformation service. */ export type ImageTransform = { src: ImageMetadata | string; width?: number | undefined; height?: number | undefined; quality?: ImageQuality | undefined; format?: ImageOutputFormat | undefined; [key: string]: any; }; export interface GetImageResult { rawOptions: ImageTransform; options: ImageTransform; src: string; attributes: Record; } type WithRequired = T & { [P in K]-?: T[P]; }; type ImageSharedProps = T & { /** * Width of the image, the value of this property will be used to assign the `width` property on the final `img` element. * * For local images, this value will additionally be used to resize the image to the desired width, taking into account the original aspect ratio of the image. * * **Example**: * ```astro * ... * ``` * **Result**: * ```html * ... * ``` */ width?: number | `${number}`; /** * Height of the image, the value of this property will be used to assign the `height` property on the final `img` element. * * For local images, if `width` is not present, this value will additionally be used to resize the image to the desired height, taking into account the original aspect ratio of the image. * * **Example**: * ```astro * ... * ``` * **Result**: * ```html * ... * ``` */ height?: number | `${number}`; }; export type LocalImageProps = ImageSharedProps & { /** * A reference to a local image imported through an ESM import. * * **Example**: * ```js * import myImage from "~/assets/my_image.png"; * ``` * And then refer to the image, like so: * ```astro * ... * ``` */ src: ImageMetadata; /** * Desired output format for the image. Defaults to `webp`. * * **Example**: * ```astro * ... * ``` */ format?: ImageOutputFormat; /** * Desired quality for the image. Value can either be a preset such as `low` or `high`, or a numeric value from 0 to 100. * * The perceptual quality of the output image is service-specific. * For instance, a certain service might decide that `high` results in a very beautiful image, but another could choose for it to be at best passable. * * **Example**: * ```astro * ... * ... * ``` */ quality?: ImageQuality; }; export type RemoteImageProps = WithRequired, 'width' | 'height'> & { /** * URL of a remote image. Can start with a protocol (ex: `https://`) or alternatively `/`, or `Astro.url`, for images in the `public` folder * * Remote images are not optimized, and require both `width` and `height` to be set. * * **Example**: * ``` * ... * ``` */ src: string; }; export {};