@stacksjs/stx/dist/image-optimization/component.d.ts

A performant UI Framework. Powered by Bun.

import { type ImageFormat,  } from './processor';
/**
 * Render an optimized <Image> component
 */
export declare function renderImageComponent(props: ImageComponentProps, context?: ImageRenderContext): ImageRenderResult;
/**
 * Parse Image component from template
 */
export declare function parseImageComponent(content: string): ImageComponentProps | null;
/**
 * Process Image components in template content
 */
export declare function processImageComponents(content: string, processor: (props: ImageComponentProps) => Promise<ImageRenderResult>): Promise<{ html: string; preloadLinks: string[]; styles: string[] }>;
// ============================================================================
// Types
// ============================================================================
export declare interface ImageComponentProps {
  src: string
  alt: string
  width?: number | string
  height?: number | string
  sizes?: string | Record<string, string>
  loading?: 'lazy' | 'eager'
  priority?: boolean
  quality?: number
  placeholder?: 'blur' | 'color' | 'none'
  formats?: ImageFormat[]
  widths?: number[]
  class?: string
  style?: string
  decoding?: 'sync' | 'async' | 'auto'
  fetchpriority?: 'high' | 'low' | 'auto'
  objectFit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down'
  objectPosition?: string
}
export declare interface ImageRenderContext {
  processedImage?: ProcessedImage
  variants?: ImageVariant[]
  optimize?: boolean
  isDev?: boolean
}
export declare interface ImageRenderResult {
  html: string
  preloadLink?: string
  placeholderCss?: string
}