/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */
import type { HTMLAttributes } from 'react';
export declare const avatarColors: readonly ["azure", "green", "lime", "magenta", "orange", "yellow"];
type AvatarColor = (typeof avatarColors)[number];
export type AvatarProps = {
    /** The background colour. */
    readonly color?: AvatarColor;
    /** The url for the user’s image. Its centre will be displayed. Should be square and scaled down. */
    readonly imageSrc?: string;
    /** The accessible name for the Avatar when the label provides initials. */
    readonly initialsAccessibleName?: string;
    /** The text content. Should be the user’s initials. The first two characters will be displayed. */
    readonly label: string;
    /** The accessible name for the Avatar when the label is empty. */
    readonly userAccessibleName?: string;
} & Readonly<HTMLAttributes<HTMLSpanElement>>;
/**
 * A circular badge representing a person.
 *
 * @see {@link https://designsystem.amsterdam/?path=/docs/components-feedback-avatar--docs Avatar docs at Amsterdam Design System}
 */
export declare const Avatar: import("react").ForwardRefExoticComponent<{
    /** The background colour. */
    readonly color?: AvatarColor;
    /** The url for the user’s image. Its centre will be displayed. Should be square and scaled down. */
    readonly imageSrc?: string;
    /** The accessible name for the Avatar when the label provides initials. */
    readonly initialsAccessibleName?: string;
    /** The text content. Should be the user’s initials. The first two characters will be displayed. */
    readonly label: string;
    /** The accessible name for the Avatar when the label is empty. */
    readonly userAccessibleName?: string;
} & Readonly<HTMLAttributes<HTMLSpanElement>> & import("react").RefAttributes<HTMLSpanElement>>;
export {};