/**
 * Props for val-image component.
 *
 * @property src - The image source URL.
 * @property alt - The alt text for the image.
 * @property mode - The display mode ('rounded' | 'circular' | 'box').
 * @property shaded - Whether the image has a shaded effect.
 * @property bordered - Whether the image has a border.
 * @property limited - Whether the image is limited in size (optional).
 * @property dark - Whether the image uses a dark style (optional).
 * @property size - The image size ('small' | 'medium' | 'large' | 'xlarge').
 * @property width - The image width in px (optional).
 * @property height - The image height in px (optional).
 * @property alignment - The alignment of the image container ('left' | 'center' | 'right').
 * @property caption - Optional caption text below the image.
 * @property captionSize - Size of the caption text ('small' | 'medium' | 'large').
 * @property containerClass - Additional CSS classes for the container.
 * @property previewMode - Enable full-screen preview with zoom capabilities (optional).
 */
export type ImageMetadata = {
    src: string;
    alt: string;
    mode: 'rounded' | 'circular' | 'box';
    shaded: boolean;
    bordered: boolean;
    limited?: boolean;
    dark?: boolean;
    size: 'small' | 'medium' | 'large' | 'xlarge';
    width?: number;
    height?: number;
    alignment?: 'left' | 'center' | 'right';
    caption?: string;
    captionSize?: 'small' | 'medium' | 'large';
    containerClass?: string;
    flex?: boolean;
    previewMode?: boolean;
};