---
/**
 * RustyImage: Bild-URL über RustyCMS /api/transform laden, in public speichern, lokal ausliefern.
 * Nutzung: <RustyImage src={url} width={34} height={50} alt="..." />
 * Unterstützt alle API-Transformationen: width, height, ar, fit, format, quality.
 * Im Svelte-Kontext: RustyImage.svelte verwenden und dort den bereits aufgelösten Pfad als src übergeben.
 */
import { ensureTransformedImage } from '../lib/rusty-image';

interface Props {
  /** Externe Bild-URL (z. B. Contentful). */
  src: string;
  width?: number;
  height?: number;
  /** Aspect ratio, z. B. "1:1" oder "16:9". */
  ar?: string;
  fit?: 'fill' | 'contain' | 'cover';
  format?: 'jpeg' | 'png' | 'webp' | 'avif';
  quality?: number;
  alt?: string;
  class?: string;
  loading?: 'lazy' | 'eager';
}

const { src, width, height, ar, fit, format, quality, alt = '', class: className = '', loading = 'lazy' } = Astro.props;

const resolvedSrc = await ensureTransformedImage(src, {
  width,
  height,
  ar,
  fit,
  format,
  quality,
});
---

<img
  src={resolvedSrc}
  alt={alt}
  width={width}
  height={height}
  class={className}
  loading={loading}
/>