/** * AutoRender ViewTag SDK Types * Type definitions for image transformation and URL generation */ interface CreateARConfig { baseUrl?: string; workspace: string; defaults?: { f?: string; q?: string | number; [key: string]: any; }; deviceBreakpoints?: number[]; imageBreakpoints?: number[]; /** * Emit a `2x` candidate in `responsiveImageAttributes` srcsets. Default `true`. * It does not affect `url()` or `transformString()` — a single URL is never * device-derived, so that it is identical on the server and in the browser. */ enableDPR?: boolean; enableResponsive?: boolean; } interface TransformOptions { w?: number; h?: number; fit?: 'crop' | 'fill' | 'fit' | 'scale'; ar?: string; position?: 'p_c' | 'p_tl' | 'p_tr' | 'p_bl' | 'p_br' | 'p_t' | 'p_b' | 'p_l' | 'p_r' | 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top' | 'bottom' | 'left' | 'right'; position_strategy?: 'entropy' | 'attention'; focus?: string; /** Video trim: start offset in seconds → `so_{n}` */ so?: number; /** Video trim: end offset in seconds → `eo_{n}` */ eo?: number; r?: number | 'portrait' | 'landscape'; z?: number; flip?: 'h' | 'v' | 'hv' | 'vh'; br?: number; f?: string; q?: string | number; bg?: string; dpr?: number; improve?: boolean | string | { mode?: 'indoor' | 'outdoor'; blend?: number; }; unsharpMask?: number; saturation?: number; contrast?: number; brightness?: number; gamma?: number; sharpen?: boolean | number; grayscale?: boolean; blackwhite?: number; hue?: number; warmth?: number; tint?: number; normalize?: boolean; invert?: boolean; fade?: number; vignette?: number; highlights?: number; shadows?: number; exposure?: number; structure?: number; autoEnhance?: boolean; temperature?: number; linear?: string; recomb?: string; threshold?: number | string; convolve?: string; unflatten?: boolean; flatten?: boolean; median?: number; blur?: number; extend?: string; affine?: string; extract?: 'red' | 'r' | 'green' | 'g' | 'blue' | 'b' | 'alpha' | 'a'; ensureAlpha?: boolean; removeAlpha?: string; layers?: LayerOptions[]; blend?: 'screen' | 'overlay' | 'multiply' | 'mask' | 'anti_removal'; [key: string]: any; } interface LayerOptions { type: 'text' | 'image'; text?: string; fontFamily?: string; fontSize?: number; fontStyle?: 'bold' | 'italic' | 'underline' | 'bold_italic' | 'bold_underline' | 'italic_underline' | 'bold_italic_underline'; align?: 'left' | 'center' | 'right'; fontColor?: string; imagePath?: string; layerType?: 'overlay' | 'underlay'; x?: number; y?: number; placement?: 'none' | 'north' | 'south' | 'east' | 'west' | 'center' | 'north-west' | 'north-east' | 'south-west' | 'south-east' | 'north west' | 'north east' | 'south west' | 'south east'; rotation?: number; opacity?: number; width?: number; height?: number; blendMode?: 'screen' | 'overlay' | 'multiply' | 'mask' | 'anti_removal'; crop?: 'resize' | 'crop' | 'fill' | 'fit' | 'scale'; aspectRatio?: string; quality?: number | string; format?: string; background?: string; position?: string; borderRadius?: number; flip?: 'h' | 'v' | 'hv' | 'vh'; /** Image layer only (`lzoom_`). */ zoom?: number; enhance?: LayerEnhancementOptions; } interface LayerEnhancementOptions { improve?: boolean | string | { mode?: 'indoor' | 'outdoor'; blend?: number; }; sharpen?: number; brightness?: number; saturation?: number; contrast?: number; hue?: number; warmth?: number; tint?: number; normalize?: boolean; invert?: boolean; fade?: number; vignette?: number; highlights?: number; shadows?: number; exposure?: number; structure?: number; autoEnhance?: boolean; temperature?: number; blackwhite?: number; gamma?: number; unsharpMask?: number; grayscale?: boolean; [key: string]: any; } interface ResponsiveOptions { /** Workspace-relative asset path (e.g. `products/shoe.jpg`) or `https://...` / `http://...` for remote fetch via `fetch_` prefix. */ src: string; width?: number; sizes?: string; transform?: TransformOptions; breakpoints?: number[]; } interface ResponsiveAttributes { src: string; srcSet: string; sizes?: string; width?: number; } interface ARInstance { url(src: string, transform?: TransformOptions): string; transformString(transform: TransformOptions): string; responsiveImageAttributes(options: ResponsiveOptions): ResponsiveAttributes; getDPR(): number; } /** * Main AutoRender client factory * Creates an AR instance with URL building and responsive image capabilities */ declare function createAR(config: CreateARConfig): ARInstance; /** * Browser format detection utilities * Detects which image formats the browser supports */ /** * Detect the best image format supported by the browser * Priority: AVIF > WebP > JPEG * Uses synchronous detection for immediate results */ declare function detectBestFormat(): string; /** * Get the best format synchronously (uses cached value or detects) */ declare function getBestFormatSync(): string; /** * Reset cached format (useful for testing) */ declare function resetFormatCache(): void; /** * URL builder for AutoRender image URLs */ /** * Workspace path segment for `ar.url()` / ARImage `src`. * * - Relative paths (`products/shoe.jpg`): each path segment is encoded separately. * - Absolute URLs (`https://demo.com/photo.jpg`): emitted as `fetch_`. */ declare function encodeAssetPathForDelivery(src: string): string; declare function buildImageUrl(baseUrl: string, workspace: string, src: string, transform?: TransformOptions, defaults?: { f?: string; q?: string | number; [key: string]: any; }, enableDPR?: boolean): string; /** * Transformation builder - converts TransformOptions to URL transformation string * with deterministic sorting */ /** Output format is GIF — omit DPR and quality in delivery URLs (e.g. ARImage / animated GIF). */ declare function isGifFormatOutput(transform?: TransformOptions | null): boolean; /** * Build transformation string from options * Transformations are sorted alphabetically by param prefix */ /** * `enableDPR` defaults to `false`: reading the device ratio here makes the URL * depend on which machine rendered it — 1 on the server, 2 on a retina client — * so an SSR app ships one `src` and hydrates a different one, which costs a * React attribute mismatch and a second network fetch. A single URL cannot be * ratio-correct for every screen anyway; that is what the `1x`/`2x` candidates * in `responsiveImageAttributes` are for. Pass `true` to opt back in. */ declare function buildTransformString(transform: TransformOptions, defaults?: { f?: string; q?: string | number; [key: string]: any; }, enableDPR?: boolean): string; export { type ARInstance, type CreateARConfig, type LayerEnhancementOptions, type LayerOptions, type ResponsiveAttributes, type ResponsiveOptions, type TransformOptions, buildImageUrl, buildTransformString, createAR, detectBestFormat, encodeAssetPathForDelivery, getBestFormatSync, isGifFormatOutput, resetFormatCache };