import { ComponentPropsWithoutRef } from 'react';
import { LayoutUtilProps } from '../../../types';
import { AvatarBaseProps } from './AvatarBase';
/**
 * Props for the Avatar component
 * @property {string} name - Full name of the user. Used for alt text and screen reader announcements
 * @property {string} [color] - Custom color of the avatar. Should maintain sufficient contrast ratio for accessibility
 * @property {string} [image] - Image source to be used for avatar. Falls back to initials if image fails to load
 * @property {Extract<Size, "small" | "medium" | "large">} [size] - Size of the Avatar
 * @property {"online" | "offline"} [status] - Online status of the Avatar
 * @extends ComponentPropsWithoutRef<"span">
 * @extends Omit<AvatarBaseProps, "initials">
 * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
 */
export type AvatarProps = ComponentPropsWithoutRef<"span"> & Omit<AvatarBaseProps, "initials"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">;
/**
 * Avatar component for displaying user avatars with initials or images.
 *
 * Features:
 * - Displays user initials when no image is provided
 * - Supports custom colors and sizes
 * - Shows online/offline status
 * - Fully accessible with screen reader support
 * - Automatic image fallback handling
 * - Supports layout utilities for positioning and spacing
 *
 * @example
 * <Avatar
 *   name="John Doe"
 *   image="https://example.com/avatar.jpg"
 *   size="medium"
 *   status="online"
 * />
 */
export declare const Avatar: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & Omit<AvatarBaseProps, "initials"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & import('react').RefAttributes<HTMLSpanElement>> & {
    /**
     * AvatarGroup component for displaying multiple avatars in a group.
     *
     * Features:
     * - Displays multiple avatars in a stacked layout
     * - Handles overflow with a count indicator
     * - Maintains consistent sizing across all avatars
     * - Supports custom styling and layout
     * - Automatically adjusts z-index for proper stacking
     * - Fully accessible with screen reader support
     *
     * @example
     * <Avatar.Group max={3}>
     *   <Avatar name="John Doe" />
     *   <Avatar name="Jane Smith" />
     *   <Avatar name="Bob Johnson" />
     *   <Avatar name="Alice Brown" />
     * </Avatar.Group>
     */
    Group: import('react').ForwardRefExoticComponent<LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
        max?: number;
    } & import('react').RefAttributes<HTMLSpanElement>>;
};