import type { PrimitivePropsWithRef } from '../utils/primitive.js'; /** Lifecycle of the {@link AvatarImage}'s underlying image load. */ export type ImageLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error'; /** @internal Shared image-loading state distributed from {@link Avatar} to its parts via context. Not part of the public API. */ export interface AvatarContextValue { imageLoadingStatus: ImageLoadingStatus; onImageLoadingStatusChange: (status: ImageLoadingStatus) => void; /** The root's `label`, used as the image's default `alt` so every state announces the same name. */ label: string | undefined; /** Whether the root is marked decorative, which forces `alt=""` on the image. */ decorative: boolean; } /** Props for the {@link Avatar} root. */ export interface AvatarProps extends PrimitivePropsWithRef<'span'> { /** * The avatar's accessible name, applied as `aria-label` on the root and used as the image's default `alt`. * @default undefined — the name is whatever the Image's `alt` or the Fallback's text happens to be. */ label?: string | undefined; /** * Marks the avatar decorative: sets `aria-hidden="true"` on the root and forces `alt=""` on the Image part. * @default false */ decorative?: boolean | undefined; /** * The image to load. Without it the Fallback renders directly. Ignored when `children` is given. * @default undefined */ src?: string | undefined; /** * The person or entity's name, used to derive the Fallback's initials and, when `label` is absent, the root's accessible name. Ignored when `children` is given. * @default undefined */ name?: string | undefined; /** * Delay before the derived Fallback appears, to avoid a flash on fast connections. Ignored when `children` is given. * @default 0 — no delay. */ fallbackDelayMs?: number | undefined; /** * Corner rung the skin rounds the avatar by, mirrored to `data-shape`. * @default undefined — the skin's own default corner. */ shape?: 'circle' | 'rounded' | 'square' | (string & {}) | undefined; /** * Size rung the skin scales the avatar by, mirrored to `data-size`. * @default undefined — the skin's own default size. */ size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined; } /** Props for {@link AvatarImage} — renders an `` that reports its own load status so {@link Avatar} can show {@link AvatarFallback} until it loads. */ export interface AvatarImageProps extends PrimitivePropsWithRef<'img'> { /** * Fires whenever the image's loading status changes. * @default undefined — no-op if omitted. */ onLoadingStatusChange?: ((status: ImageLoadingStatus) => void) | undefined; } /** Props for {@link AvatarFallback} — rendered in place of {@link AvatarImage} while it loads, fails, or is absent. */ export interface AvatarFallbackProps extends PrimitivePropsWithRef<'span'> { /** * Delay before showing the fallback, to avoid a flash on fast connections. * @default undefined — renders immediately, with no delay. */ delayMs?: number | undefined; }