{
  "name": "Avatar",
  "type": "component",
  "export": "@gtmi/strix-react/atoms/avatar",
  "path": "src/atoms/avatar/avatar.tsx",
  "figma": null,
  "figmaAbsent": "Base UI primitive. Figma draws no standalone avatar — `.cellphone-avatar` is `ChannelAvatar`, a sender identity block. This is the image primitive only.",
  "since": "0.2.0",
  "description": "A person or account as an image with a text fallback, plus a status badge and an overlapping group. Composed from Avatar > AvatarImage + AvatarFallback, with AvatarBadge, AvatarGroup and AvatarGroupCount.",
  "props": [
    {
      "name": "size",
      "type": "'sm' | 'md' | 'lg'",
      "default": "md",
      "description": "24/32/40px, matching the Figma Avatar set."
    },
    {
      "name": "shape",
      "type": "'circle' | 'rounded'",
      "default": "circle",
      "description": "Figma's .cellphone-avatar is a rounded square, which is why this is a variant rather than a hardcoded rounded-full."
    }
  ],
  "parts": [
    {
      "name": "Avatar",
      "description": "The root."
    },
    {
      "name": "AvatarImage",
      "description": "The image. alt is deliberately not defaulted — an avatar beside the name it belongs to is decorative, one that is the only identification is not, and only the caller knows which."
    },
    {
      "name": "AvatarFallback",
      "description": "Shown while loading and on failure. Initials or an icon."
    },
    {
      "name": "AvatarBadge",
      "description": "A status dot. aria-hidden, because a coloured dot conveys status by hue alone (WCAG 1.4.1) and cannot be the only carrier."
    },
    {
      "name": "AvatarGroup",
      "description": "Overlapping avatars with role=group and a name."
    },
    {
      "name": "AvatarGroupCount",
      "description": "The +n overflow, as real text so it is announced."
    }
  ],
  "ai_tags": ["avatar", "user", "presence", "identity"],
  "notes": "THE FALLBACK IS THE POINT, and it is the state nobody tests. An avatar whose image 404s and renders a broken-image glyph is worse than no avatar; Base UI tracks load status and swaps the fallback in, so the failure path belongs to the primitive rather than to a caller's onError handler.\n\nAvatarBadge is aria-hidden deliberately. Status by hue alone is WCAG 1.4.1, so the dot is the visual echo and the text beside the avatar carries the meaning. ring-2 ring-surface-base cuts the dot out of the image beneath it so it stays legible on a busy photo.\n\nAvatarGroup takes role=group and a name because the individual images are decorative once they are a pile — the information is how many and who, and that belongs to the container.\n\nSOURCE: Base UI avatar plus Figma Avatar, Avatar/Email and .cellphone-avatar.",
  "tokens_used": ["--color-surface-hover", "--color-border-focus", "--color-text-primary", "--color-text-secondary"]
}
