import * as i0 from '@angular/core';
import { QueryList } from '@angular/core';
import * as i1 from '@eui/components/shared';
import { BaseStatesDirective } from '@eui/components/shared';

/**
 * Component representing an avatar badge.
 * This badge can be positioned at the top or bottom of the avatar and is used
 * to display additional information or status indicators.
 *
 * The component uses content projection to allow any content to be displayed inside the badge.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *     <eui-avatar-text>eUI</eui-avatar-text>
 *     <eui-avatar-badge>
 *         <eui-badge euiDanger euiSizeS>7</eui-badge>
 *     </eui-avatar-badge>
 * </eui-avatar>
 * ```
 */
declare class EuiAvatarBadgeComponent {
    /**
     * Whether the avatar should have a shadow effect
     * @default false
     */
    isPositionBottom: boolean;
    /**
     * Gets the CSS classes to be applied to the host element.
     * Combines the base class with a modifier class based on the position.
     * @returns {string} The combined CSS classes.
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarBadgeComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarBadgeComponent, "eui-avatar-badge", never, { "isPositionBottom": { "alias": "isPositionBottom"; "required": false; }; }, {}, never, ["*"], true, never>;
    static ngAcceptInputType_isPositionBottom: unknown;
}

/**
 * @description
 * Component representing an avatar icon.
 * This component serves as a container for icons within an avatar.
 * It applies the appropriate styling and structure needed for avatar icons.
 *
 * The component simply wraps its content with the 'eui-avatar-icon' class styling.
 * Used for displaying icons as avatar content instead of images or text.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *     <eui-avatar-icon>
 *         <eui-icon-svg icon="eui-user" />
 *     </eui-avatar-icon>
 * </eui-avatar>
 * ```
 */
declare class EuiAvatarIconComponent {
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarIconComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarIconComponent, "eui-avatar-icon", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Component representing an avatar image.
 * Displays an image for an avatar with fallback to a default image when none is provided.
 * Uses the application's configured assets base URL for the default image path.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *    <eui-avatar-image imageUrl="assets/images/profile-avatar.png"></eui-avatar-image>
 * </eui-avatar>
 * ```
 */
declare class EuiAvatarImageComponent {
    /** CSS class applied to the host element */
    get cssClasses(): string;
    /**
     * URL of the image to be displayed in the avatar.
     * If not provided, a default image will be used.
     */
    imageUrl: any;
    /**
     * The final image URL to be used in the template.
     * This will be either the provided imageUrl or a default image URL.
     */
    imageUrlGenerated: string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarImageComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarImageComponent, "eui-avatar-image", never, { "imageUrl": { "alias": "imageUrl"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * @description
 * Component for displaying textual content alongside an avatar.
 * Serves as a container for avatar-content-label and avatar-content-sublabel subcomponents.
 * Typically used to show user name and additional information like email or role.
 * Content is projected via ng-content and styled to align properly with the avatar.
 * Must be used within an eui-avatar parent component for proper layout.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *   <eui-avatar-image src="user.jpg"></eui-avatar-image>
 *   <eui-avatar-content>
 *     <eui-avatar-content-label>John Doe</eui-avatar-content-label>
 *     <eui-avatar-content-sublabel>john.doe@ec.europa.eu</eui-avatar-content-sublabel>
 *   </eui-avatar-content>
 * </eui-avatar>
 * ```
 *
 * ### Accessibility
 * - Content is readable by screen readers in natural reading order
 * - Label and sublabel are semantically grouped for context
 * - Use meaningful text that identifies the user or entity
 *
 * ### Notes
 * - Must be direct child of eui-avatar component
 * - Typically contains eui-avatar-content-label and eui-avatar-content-sublabel
 * - Layout can be reversed using isReverse on parent eui-avatar
 * - Automatically styled to align with avatar size variants
 */
declare class EuiAvatarContentComponent {
    /**
     * Binds the CSS class 'eui-avatar-list' to the host element.
     * This class provides the styling necessary for arranging avatars in a list.
     * @returns {string} The CSS class name
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarContentComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarContentComponent, "eui-avatar-content", never, {}, {}, never, ["eui-avatar-content-label", "eui-avatar-content-sublabel"], true, never>;
}

/**
 * @description
 * Component for displaying a list of avatars.
 * This component serves as a container that arranges multiple avatars in a visually
 * coherent group, typically with slight overlapping to save space.
 *
 * The component uses content projection to allow placing multiple avatar components
 * within it and applies appropriate styling via the 'eui-avatar-list' CSS class.
 *
 * @usageNotes
 * ```html
 * <eui-avatar-list>
 *     <eui-avatar euiSizeS>
 *         <eui-avatar-image imageUrl="assets/images/avatars/small/panda.png"></eui-avatar-image>
 *     </eui-avatar>
 *     <eui-avatar euiSizeS>
 *         <eui-avatar-image imageUrl="assets/images/avatars/small/cat.png"></eui-avatar-image>
 *     </eui-avatar>
 *     <eui-avatar euiSizeS>
 *         <eui-avatar-image imageUrl="assets/images/avatars/small/bear.png"></eui-avatar-image>
 *     </eui-avatar>
 * </eui-avatar-list>
 */
declare class EuiAvatarListComponent {
    /**
     * Binds the CSS class 'eui-avatar-list' to the host element.
     * This class provides the styling necessary for arranging avatars in a list.
     * @returns {string} The CSS class name
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarListComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarListComponent, "eui-avatar-list", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Component for displaying text content within an avatar.
 * This component serves as a container for text that appears inside an avatar,
 * such as initials or short text identifiers.
 *
 * The component applies the 'eui-avatar-text' class to provide appropriate styling
 * for text displayed within an avatar context. It uses content projection to allow
 * any text content to be displayed inside.
 *
 * @usageNotes
 * ```html
 * <eui-avatar euiSizeS>
 *     <eui-avatar-text>eUI</eui-avatar-text>
 *     <eui-avatar-badge>
 *         <eui-badge euiDanger euiSizeS>7</eui-badge>
 *     </eui-avatar-badge>
 * </eui-avatar>
 * ```
 */
declare class EuiAvatarTextComponent {
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarTextComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarTextComponent, "eui-avatar-text", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Component for displaying avatars in the EUI design system.
 *
 * An avatar is a visual representation of a user or entity and can contain
 * an image, text, or an icon. This component serves as the container for
 * various avatar subcomponents, such as EuiAvatarImage, EuiAvatarText,
 * EuiAvatarIcon, and EuiAvatarBadge.
 *
 * The component supports various customizations, including colors (via state directives),
 * sizes, shapes, and appearance modifiers.
 *
 * @usageNotes
 * #### Text avatar
 * ```html
 * <eui-avatar euiPrimary>
 *   <eui-avatar-text>JD</eui-avatar-text>
 * </eui-avatar>
 * ```
 *
 * #### Image avatar with badge
 * ```html
 * <eui-avatar euiSizeL>
 *   <eui-avatar-image src="user.jpg" alt="John Doe"></eui-avatar-image>
 *   <eui-avatar-badge euiSuccess></eui-avatar-badge>
 * </eui-avatar>
 * ```
 *
 * #### Icon avatar with square shape
 * ```html
 * <eui-avatar euiInfo [isShapeSquare]="true">
 *   <eui-avatar-icon iconSvgName="user:outline"></eui-avatar-icon>
 * </eui-avatar>
 * ```
 *
 * #### Avatar with content (name and email)
 * ```html
 * <eui-avatar>
 *   <eui-avatar-image src="user.jpg"></eui-avatar-image>
 *   <eui-avatar-content>
 *     <eui-avatar-content-label>John Doe</eui-avatar-content-label>
 *     <eui-avatar-content-sublabel>john.doe@example.com</eui-avatar-content-sublabel>
 *   </eui-avatar-content>
 * </eui-avatar>
 * ```
 *
 * ### Accessibility
 * - Uses role="status" for screen reader announcements
 * - aria-label provides context about the avatar (defaults to "avatar")
 * - Image avatars should include alt text via eui-avatar-image
 * - Text avatars are automatically readable by screen readers
 * - Badge status changes are announced when present
 *
 * ### Notes
 * - Default shape is circular, use isShapeSquare for square avatars
 * - Size variants: euiSizeXS, euiSizeS (default), euiSizeL, euiSizeXL, euiSize2XL
 * - Color variants: euiPrimary, euiSecondary, euiSuccess, euiInfo, euiWarning, euiDanger
 * - Use hasNoBackground to remove background color (useful for image avatars)
 * - isReverse flips the layout when used with eui-avatar-content
 * - colorPalette accepts custom color palette names for extended theming
 * - hasShadow adds depth with shadow effect
 * - euiOutline adds border outline styling
 */
declare class EuiAvatarComponent {
    /**
     * Data attribute for E2E testing
     * @default 'eui-avatar'
     */
    e2eAttr: string;
    /**
     * ARIA role for accessibility
     * @default 'status'
     */
    role: string;
    /**
     * ARIA label for accessibility
     * @default 'avatar'
     */
    ariaLabel: string | null;
    /**
     * Whether the avatar should have a shadow effect
     * @default false
     */
    hasShadow: boolean;
    /**
     * Whether the avatar shape should be square instead of circular
     * @default false
     */
    isShapeSquare: boolean;
    /**
     * Whether the avatar should have no background color
     * @default false
     */
    hasNoBackground: boolean;
    /**
     * Whether the avatar reverse layout with content
     * @default false
     */
    isReverse: boolean;
    /**
     * Extra color palette to be used on the avatar.
     */
    colorPalette: string;
    avatarImage: QueryList<EuiAvatarImageComponent>;
    /**
     * Reference to the BaseStatesDirective providing state-based styling
     * @internal
     */
    protected baseStatesDirective: BaseStatesDirective;
    /**
     * Gets the CSS classes to be applied to the host element.
     * Combines base classes with modifier classes.
     * @returns {string} The combined CSS classes
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarComponent, "div[euiAvatar], span[euiAvatar], eui-avatar", never, { "e2eAttr": { "alias": "e2eAttr"; "required": false; }; "ariaLabel": { "alias": "aria-label"; "required": false; }; "hasShadow": { "alias": "hasShadow"; "required": false; }; "isShapeSquare": { "alias": "isShapeSquare"; "required": false; }; "hasNoBackground": { "alias": "hasNoBackground"; "required": false; }; "isReverse": { "alias": "isReverse"; "required": false; }; "colorPalette": { "alias": "colorPalette"; "required": false; }; }, {}, ["avatarImage"], ["eui-avatar-icon", "eui-avatar-text", "eui-avatar-image", "eui-avatar-badge", "eui-avatar-content"], true, [{ directive: typeof i1.BaseStatesDirective; inputs: { "euiPrimary": "euiPrimary"; "euiSecondary": "euiSecondary"; "euiSuccess": "euiSuccess"; "euiInfo": "euiInfo"; "euiWarning": "euiWarning"; "euiDanger": "euiDanger"; "euiVariant": "euiVariant"; "euiSizeXS": "euiSizeXS"; "euiSizeS": "euiSizeS"; "euiSizeL": "euiSizeL"; "euiSizeXL": "euiSizeXL"; "euiSize2XL": "euiSize2XL"; "euiSizeVariant": "euiSizeVariant"; "euiOutline": "euiOutline"; }; outputs: {}; }]>;
    static ngAcceptInputType_hasShadow: unknown;
    static ngAcceptInputType_isShapeSquare: unknown;
    static ngAcceptInputType_hasNoBackground: unknown;
    static ngAcceptInputType_isReverse: unknown;
}

/**
 * @description
 * Component for displaying secondary label text within avatar content.
 * Typically used to show additional information like email, role, or status.
 * Content is projected via ng-content and styled as secondary/subdued text.
 * Must be used within eui-avatar-content for proper styling and layout.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *   <eui-avatar-text>JD</eui-avatar-text>
 *   <eui-avatar-content>
 *     <eui-avatar-content-label>John Doe</eui-avatar-content-label>
 *     <eui-avatar-content-sublabel>john.doe@ec.europa.eu</eui-avatar-content-sublabel>
 *   </eui-avatar-content>
 * </eui-avatar>
 * ```
 *
 * ### Accessibility
 * - Text content is directly readable by screen readers
 * - Appears after label in reading order
 * - Provides additional context about the user or entity
 *
 * ### Notes
 * - Must be child of eui-avatar-content component
 * - Styled as secondary/muted text
 * - Typically displays email, role, department, or status
 * - Optional - can be omitted if only primary label is needed
 */
declare class EuiAvatarContentSublabelComponent {
    /**
     * Binds the CSS class 'eui-avatar-list' to the host element.
     * This class provides the styling necessary for arranging avatars in a list.
     * @returns {string} The CSS class name
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarContentSublabelComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarContentSublabelComponent, "eui-avatar-content-sublabel", never, {}, {}, never, ["*"], true, never>;
}

/**
 * @description
 * Component for displaying the primary label text within avatar content.
 * Typically used to show the user's name or primary identifier.
 * Content is projected via ng-content and styled as the main text line.
 * Must be used within eui-avatar-content for proper styling and layout.
 *
 * @usageNotes
 * ```html
 * <eui-avatar>
 *   <eui-avatar-image src="user.jpg"></eui-avatar-image>
 *   <eui-avatar-content>
 *     <eui-avatar-content-label>John Doe</eui-avatar-content-label>
 *     <eui-avatar-content-sublabel>Developer</eui-avatar-content-sublabel>
 *   </eui-avatar-content>
 * </eui-avatar>
 * ```
 *
 * ### Accessibility
 * - Text content is directly readable by screen readers
 * - Appears first in reading order before sublabel
 * - Use concise, meaningful text for user identification
 *
 * ### Notes
 * - Must be child of eui-avatar-content component
 * - Styled as primary/prominent text
 * - Typically displays user name or entity title
 * - Can be used alone without sublabel if needed
 */
declare class EuiAvatarContentLabelComponent {
    /**
     * Binds the CSS class 'eui-avatar-list' to the host element.
     * This class provides the styling necessary for arranging avatars in a list.
     * @returns {string} The CSS class name
     */
    cssClasses(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<EuiAvatarContentLabelComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<EuiAvatarContentLabelComponent, "eui-avatar-content-label", never, {}, {}, never, ["*"], true, never>;
}

declare const EUI_AVATAR: readonly [typeof EuiAvatarComponent, typeof EuiAvatarIconComponent, typeof EuiAvatarTextComponent, typeof EuiAvatarImageComponent, typeof EuiAvatarBadgeComponent, typeof EuiAvatarListComponent, typeof EuiAvatarContentComponent, typeof EuiAvatarContentLabelComponent, typeof EuiAvatarContentSublabelComponent];

export { EUI_AVATAR, EuiAvatarBadgeComponent, EuiAvatarComponent, EuiAvatarContentComponent, EuiAvatarContentLabelComponent, EuiAvatarContentSublabelComponent, EuiAvatarIconComponent, EuiAvatarImageComponent, EuiAvatarListComponent, EuiAvatarTextComponent };
//# sourceMappingURL=eui-components-eui-avatar.d.ts.map
