import AWCElement from '../../internal/awc-element.js';
import type { BaseImageProps, Layout } from './image.utils.js';
import type { CSSResultGroup } from 'lit';
import type { ImageCdn, UrlTransformer } from 'unpic';
/**
 * @summary A image component for responsive, high-performance images using image CDNs
 * @documentation https://webcomponents.adeliom.io/?path=/docs/components-image--documentation
 * @status experimental
 * @since 1.0
 *
 * @event awc-load - Emitted when the image is loaded successfully.
 * @event awc-error - Emitted if an error occurs while loading.
 * @event awc-abort - Emitted occurs when a download is aborted, not when an error occurs.
 *
 */
export default class AWCImage extends AWCElement implements BaseImageProps<Partial<HTMLImageElement>, CSSStyleDeclaration> {
    static styles: CSSResultGroup;
    /** The image URL */
    src: string;
    /** Defines an alternative text description of the image. */
    alt: string;
    /** The intrinsic height of the image in pixels. Must be an integer without a unit. */
    height?: number;
    /** The intrinsic width of the image in pixels. Must be an integer without a unit. */
    width?: number;
    /** By default, images cover the container. If `objectFit` is set, the property is used to specify how an images should be resized to fit its container. */
    objectFit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' | 'inherit' | 'initial';
    /** The resizing behaviour of the image. */
    layout: Layout;
    /** By default, images are loaded lazily. If `priority` is set to `true`, the image will be loaded eagerly, and will be given high priority by the browser. This is useful for images that are above the fold, particularly large ones such as hero images. */
    priority: boolean;
    /**
     * Either an image URL, CSS gradient or CSS colour value. If set to `auto`, a low-resolution version of the image will be rendered as a background image, with a blurred placeholder effect. This is still loaded from the remote server, so if you can instead provide an inline base64-encoded version of the image or background colour, you should do that instead. Look at [`@unpic/placeholder`](/placeholder/) for a library that can generate these placeholders.
     *
     * Bear in mind that this is not removed after the image loads, so it will be visible if the image has transparency.
     */
    background?: string;
    /** Instead of specifying both `width` and `height`, you can specify can `aspectRatio`. */
    aspectRatio?: number;
    /** By default, the CDN is auto-detected from the `src` URL. If you want to override this, you can specify a CDN object. See the [unpic](https://github.com/ascorbic/unpic) for supported values. */
    cdn?: ImageCdn;
    /** By default, the image breakpoints used in the `srcset` are generated based on the layout and image size. You can override this by specifying an array of breakpoints. The breakpoints are specified as an array of numbers, representing the width of the image in pixels. */
    breakpoints?: number[];
    /** Indicates if the fetching of the image must be done using a CORS request. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#crossorigin) */
    crossOrigin?: 'anonymous' | 'use-credentials';
    /** Provides a hint of the relative priority to use when fetching the image. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#fetchpriority) */
    fetchPriority?: 'high' | 'low';
    /** Indicates how the browser should load the image. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading) */
    loading?: 'eager' | 'lazy';
    /** Provides an image decoding hint to the browser. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#decoding) */
    decoding?: 'sync' | 'async' | 'auto';
    /** A string indicating which referrer to use when fetching the resource. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#referrerpolicy) */
    referrerPolicy?: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
    /** One or more strings separated by commas, indicating a set of source sizes. see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes) */
    sizes?: string;
    /** This Boolean attribute indicates that the image is part of a [server-side map](https://en.wikipedia.org/wiki/Image_map#Server-side). If so, the coordinates where the user clicked on the image are sent to the server. */
    isMap?: boolean;
    /** The partial URL (starting with #) of an image map associated with the element. */
    useMap?: string;
    /** Customized URL Transformer */
    transformer?: UrlTransformer;
    private handleLoad;
    private handleError;
    private handleAbort;
    render(): import("lit-html").TemplateResult<1>;
}