import { IEventDetail, IEventEmitter } from '@breadstone/mosaik-elements';
import { CssAspectRatio, CssLength } from '@breadstone/mosaik-themes';
import { ImageFit } from '../../../Types/ImageFit';
import { ImageLegendPosition } from '../../../Types/ImageLegendPosition';
import type { ImageState } from '../../../Types/ImageState';
import { CustomElement } from '../../Abstracts/CustomElement';
import type { IImageElementProps } from './IImageElementProps';
declare const ImageElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Dimensionable").IDimensionableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * Image - A responsive image container with advanced loading states and layout control.
 *
 * Provides comprehensive image handling with loading indicators, error states, aspect ratio control,
 * and flexible content placement. Supports various fit modes, lazy loading, and accessibility features.
 * Includes built-in placeholder states and legend positioning for rich media presentation.
 *
 * @name ImageElement
 * @element mosaik-image
 * @category Media
 *
 * @slot - Default content overlaid on the image
 * @slot empty - Content shown when no image source is provided
 * @slot failed - Content displayed when image loading fails
 * @slot pending - Content shown while image is loading
 * @slot legend - Caption or description content positioned around the image
 *
 * @csspart image - The main image element container
 * @csspart placeholder - Container for loading, error, and empty states
 * @csspart legend - Caption or description container
 * @csspart content - Overlay content container
 *
 * @cssprop --image-aspect-ratio - Aspect ratio constraint for the image container
 * @cssprop --image-object-fit - How the image fits within its container (cover, contain, fill, etc.)
 * @cssprop --image-border-radius - Border radius applied to the image
 * @cssprop --image-placeholder-color - Background color for placeholder states
 * @cssprop --image-legend-position - Position of the legend relative to image
 *
 * @dependency TextElement - For legend text rendering
 * @dependency ProgressRingElement - For loading state indicator
 * @dependency IconElement - For error and empty state icons
 *
 * @example
 * ```html
 * <!-- Basic image -->
 * <mosaik-image src="photo.jpg" alt="Landscape photo"></mosaik-image>
 *
 * <!-- Image with aspect ratio and fit mode -->
 * <mosaik-image
 *   src="portrait.jpg"
 *   aspect-ratio="4/3"
 *   fit="cover"
 *   alt="Portrait photo">
 * </mosaik-image>
 *
 * <!-- Image with legend and custom placeholder -->
 * <mosaik-image src="gallery/image1.jpg" legend-position="bottom">
 *   <span slot="legend">Beautiful sunset over mountains</span>
 *   <div slot="failed">
 *     <mosaik-icon data="M..."></mosaik-icon>
 *     <p>Image not available</p>
 *   </div>
 * </mosaik-image>
 *
 * <!-- Lazy loaded image with overlay content -->
 * <mosaik-image
 *   src="hero-bg.jpg"
 *   loading="lazy"
 *   aspect-ratio="16/9">
 *   <div class="hero-content">
 *     <h1>Welcome</h1>
 *     <p>Discover amazing content</p>
 *   </div>
 * </mosaik-image>
 * ```
 *
 * @fires loaded - Emitted when image successfully loads
 * @fires failed - Emitted when image loading fails
 *
 * @public
 */
export declare class ImageElement extends ImageElement_base implements IImageElementProps {
    private readonly _loaded;
    private readonly _failed;
    private _alt;
    private _src;
    private _srcset;
    private _state;
    private _fit;
    private _showFailed;
    private _showEmpty;
    private _showPending;
    private _legend;
    private _legendPosition;
    private _ratio;
    /**
     * @public
     */
    constructor();
    /**
     * Returns the `{@link is}` property.
     * The `{@link is}` property represents natural name of this element.
     *
     * @public
     * @static
     * @readonly
     */
    static get is(): string;
    /**
     * Gets or sets the `alt` property.
     *
     * @public
     * @attr
     */
    get alt(): string;
    set alt(value: string);
    /**
     * Gets or sets the `src` property.
     *
     * @public
     * @attr
     */
    get src(): string;
    set src(value: string);
    /**
     * Gets or sets the `srcset` property.
     *
     * @public
     * @attr
     */
    get srcset(): string;
    set srcset(value: string);
    /**
     * Gets or sets the `showFailed` property.
     *
     * @public
     */
    get showFailed(): boolean;
    set showFailed(value: boolean);
    /**
     * Gets or sets the `showEmpty` property.
     *
     * @public
     */
    get showEmpty(): boolean;
    set showEmpty(value: boolean);
    /**
     * Gets or sets the `showEmpty` property.
     *
     * @public
     */
    get showPending(): boolean;
    set showPending(value: boolean);
    /**
     * Gets or sets the `fit` property.
     *
     * @public
     * @attr
     */
    get fit(): ImageFit;
    set fit(value: ImageFit);
    /**
     * Gets or sets the `legend` property.
     *
     * @public
     * @attr
     */
    get legend(): string;
    set legend(value: string);
    /**
     * Gets or sets the `legendPosition` property.
     *
     * @public
     * @attr
     */
    get legendPosition(): ImageLegendPosition;
    set legendPosition(value: ImageLegendPosition);
    /**
      * Returns the `state` property.
      *
      * @public
      * @readonly
      */
    get state(): ImageState;
    private set state(value);
    /**
     * Gets or sets the `ratio` property.
     *
     * @public
     * @attr
     */
    get ratio(): CssAspectRatio;
    set ratio(value: CssAspectRatio);
    /**
     * Called when the image is loaded.
     * Provides reference to `IEventDetail` as event detail.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get loaded(): IEventEmitter<IEventDetail<this>>;
    /**
     * Called when the image load is failed.
     * Provides reference to `IEventDetail<ThisParameterType>` as event detail.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get failed(): IEventEmitter<IEventDetail<this>>;
    /**
     * @protected
     */
    protected onWidthPropertyChanged(_prev?: CssLength, next?: CssLength): void;
    /**
     * @protected
     */
    protected onHeightPropertyChanged(_prev?: CssLength, next?: CssLength): void;
    /**
     * @protected
     */
    protected onRatioPropertyChanged(_prev?: CssAspectRatio, next?: CssAspectRatio): void;
    /**
     * @template
     * @protected
     */
    onImageError(): void;
    /**
     * @template
     * @protected
     */
    onImageLoad(): void;
}
/**
* @public
*/
export declare namespace ImageElement {
    type Props = IImageElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-image': ImageElement;
    }
    interface HTMLElementEventMap {
        loaded: CustomEvent<IEventDetail>;
        failed: CustomEvent<IEventDetail>;
    }
}
export {};
//# sourceMappingURL=ImageElement.d.ts.map