import * as React from 'react'; import type { AlignType as IAlignType, FittingType as IFittingType, UpscaleMethod, ImageTransformOptions, ImagePlaceholderTransformTarget, Encoding } from '@wix/image-kit'; export type FittingType = IFittingType; export type AlignType = IAlignType; type UnitLength = { value: number; type: 'px' | 'em' | 'rem' | 'vh' | 'vw' | 'vmin' | 'vmax'; }; type ImageSharpeningQuality = { quality?: number; unsharpMask?: { radius: number; amount: number; threshold: number; }; }; type ImagePlaceholderDataSrc = { id: string; width: number; height: number; crop: Crop; focalPoint?: FocalPoint; name: string; }; export type ImageAttributesData = { uri?: string; css: { img: Record; container?: Record; }; attr: { img: Record; container: Record; }; transformed: boolean; srcset?: { dpr: string[]; }; }; export type ImagePlaceholderData = { fittingType: FittingType; src: ImagePlaceholderDataSrc; target: ImagePlaceholderTransformTarget; options: Partial; }; export type PlaceholderTransition = 'blur'; export type SourceSet = { mediaQuery: string; displayMode: FittingType; crop?: Crop; focalPoint?: FocalPoint; scrollEffect?: 'parallax' | 'fixed' | 'ImageParallax' | 'ImageReveal'; }; export type ImageInfo = { containerId?: string; alignType?: AlignType; skipMeasure?: boolean; displayMode: FittingType; targetWidth?: number; targetHeight?: number; targetScale?: number; isLQIP?: boolean; isSEOBot?: boolean; lqipTransition?: PlaceholderTransition; imageData: { width: number; height: number; uri: string; name: string; displayMode: FittingType; quality?: ImageSharpeningQuality; devicePixelRatio?: number; focalPoint?: FocalPoint; crop?: Crop; upscaleMethod?: string; scrollEffect?: 'parallax' | 'fixed'; hasAnimation?: boolean; }; sourceSets?: SourceSet[]; hasAnimation?: boolean; encoding?: Encoding; }; export type ImagePlaceholderProps = { /** * Utility for getting URI and CSS for rendering an image placeholder (LQIP) * @param {Object} data * @returns {Object} */ getPlaceholder?: (data: ImagePlaceholderData) => ImageAttributesData; /** * Width of the target element the image will be rendered into */ containerWidth?: number; /** * Height of the target element the image will be rendered into */ containerHeight?: number; }; export type BaseImageProps = ImagePlaceholderProps & { id?: string; /** * The id of component's parent * Necessary for background effects */ containerId?: string; /** * Image uri */ uri: string; /** * Image name */ name?: string; /** * Original image width */ width: number; /** * Original image height */ height: number; /** * Image display mode */ displayMode: FittingType; /** * Indicates whether image has a scroll effect (BackgroundReveal, BackgroundParallax, BackgroundParallaxZoom etc.) */ hasBgScrollEffect?: 'true' | ''; /** * Name of background scroll effect */ bgEffectName?: string; /** * Holds image quality data */ quality?: ImageSharpeningQuality; }; export type ImagePlatformProps = BaseImageProps & { /** * Image alternate text */ alt: string; /** * The pixel ratio of the device */ devicePixelRatio?: number; /** * Alignment of the image */ alignType?: AlignType; /** * Image focalPoint */ focalPoint?: FocalPoint; /** * Image title text */ title?: string; /** * Image crop */ crop?: Crop; /** * Image upscale method */ upscaleMethod?: UpscaleMethod; }; export type FocalPoint = { x: number; y: number; }; export type Crop = { x: number; y: number; width: number; height: number; svgId?: string; flip?: 'vertical' | 'horizontal' | 'both' | 'none'; rotate?: number; }; export type ImageProps = ImagePlatformProps & { targetWidth?: number; targetHeight?: number; targetScale?: number; className?: string; role?: string; crop?: any; bgEffectName?: string; upscaleMethod?: UpscaleMethod; imageStyles?: { [key: string]: string; } | {}; onLoad?: (e: React.SyntheticEvent) => void; onError?: (e: React.SyntheticEvent) => void; shouldUseLQIP?: boolean; getPlaceholder?: (data: any) => any; containerWidth?: number; containerHeight?: number; isInFirstFold?: boolean; placeholderTransition?: PlaceholderTransition; socialAttrs?: SocialAttributes; isSEOBot?: boolean; skipMeasure?: boolean; filterEffectSvgString?: string; filterEffectSvgUrl?: string; hasAnimation?: boolean; encoding?: Encoding; isFluidLayout?: boolean; }; export type WixImageExternalServices = { mutationService?: any; isExperimentOpen?: (experimentName: string) => boolean; getMediaDimensionsByEffect?: any; disableImagesLazyLoading?: boolean; getScreenHeightOverride?: () => number; }; export type WixImageServices = WixImageExternalServices & { imageLoader: any; resizeService?: ResizeObserver; intersectionService?: IntersectionObserver; }; export type WixImageMeasures = { width?: number; height?: number; screenHeight?: number; imgSrc?: string | null; boundingRect?: DOMRect; mediaHeightOverrideType?: 'viewport' | 'fixed' | ''; sourceSetsTargetHeights?: { [key: string]: number; }; srcset?: string; top?: number; left?: number; }; export type WixImageXMeasures = WixImageMeasures & { documentScroll: number; }; export type WixImageDomNodes = Record; export type SocialAttributes = { 'data-pin-nopin'?: boolean | undefined; 'data-pin-url'?: string; 'data-pin-media'?: string; }; export type ImagePresets = { [key: string]: { uri: string; width: number; height: number; }; }; export type EnvConsts = { disableImagesLazyLoading?: boolean; staticMediaUrl: string; mediaRootUrl: string; isViewerMode: boolean; experiments?: Record; devicePixelRatio?: number; externalBaseUrl?: string; hasUserDomainMedia?: boolean; }; export type WowImage = Element & { reLayout: () => void; observeIntersect: () => void; unobserveIntersect: () => void; observeResize: () => void; unobserveResize: () => void; }; export type MediaSizeQuery = { minWidth?: number; maxWidth?: number; minHeight?: number; maxHeight?: number; }; export type ImageMedia = { uri: string; name?: string; width: number; height: number; animated?: boolean; crop?: { x: number; y: number; width: number; height: number; }; quality?: number; alt?: string; }; export type ImageSource = { image: ImageMedia; media?: MediaSizeQuery; sizes: { media?: MediaSizeQuery; size: UnitLength; }[]; targetSizes: number[]; }; export type ImageNGProps = { id: string; alt?: string; sources: ImageSource[]; priority: 'high' | 'low'; decorative?: boolean; role?: 'img' | 'none' | 'presentation'; dataset?: { [key: string]: string; }; }; export {}; //# sourceMappingURL=types.d.ts.map