import type React from 'react';
import type { IconName } from './icons.generated';
declare const COLOR: {
    readonly inherit: 'text-inherit';
    readonly inverted: 'text-inverted';
    readonly primary: 'text-primary';
    readonly secondary: 'text-secondary';
    readonly 'accent-blue': 'text-accent-blue';
    readonly 'feedback-green': 'text-feedback-green';
    readonly 'feedback-orange': 'text-feedback-orange';
    readonly 'feedback-red': 'text-feedback-red';
    readonly 'always-white': 'text-always-white';
    readonly 'always-black': 'text-always-black';
};
export type IconColor = keyof typeof COLOR | 'currentColor';
export type IconProps = {
    /**
     * The name of the icon in the 1.0 icon system.
     */
    icon: IconName;
    /**
     * The size of the icon in pixels.
     *
     * Sizes 12 and 16 will use a smaller, simplified icon asset.
     */
    size: 12 | 16 | 24 | 32 | 40 | 48 | 64 | 80;
    /**
     * Use the filled variant of the icon, typically for active or selected states.
     */
    filled?: boolean;
    /**
     * By default icons use the primary foreground color.
     *
     * To change color together with the surrounding text, such as when hovering a button,
     * use `currentColor` or `inherit`.
     */
    color?: IconColor;
    /**
     * Custom class name, merged with existing classes.
     */
    className?: string;
    /**
     * Alternate text.
     *
     * May be omitted if the icon is purely decorational or if the alternate text is already present,
     * such as in a button that already has a label.
     */
    alt?: string;
    /**
     * The loading strategy for the icon image.
     *
     * @default 'lazy'
     */
    loading?: 'eager' | 'lazy';
    hidden?: boolean;
    id?: string;
    title?: string;
    dir?: string;
    lang?: string;
    slot?: string;
    style?: React.CSSProperties;
    onAnimationEnd?: React.AnimationEventHandler<HTMLImageElement>;
    onAnimationStart?: React.AnimationEventHandler<HTMLImageElement>;
    onTransitionEnd?: React.TransitionEventHandler<HTMLImageElement>;
};
/**
 * Icon renders an `img` with a src on the volvocars.com CDN.
 *
 * By default icons use the primary foreground color. To change color together with the surrounding text,
 * such as when hovering a button, use `color="currentColor"` to inherit the surrounding `color`.
 *
 * To create a clickable icon, see [IconButton](https://developer.volvocars.com/design-system/web/?path=/docs/components-iconbutton--docs).
 */
export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLImageElement>>;
export {};