{
  "name": "avatar",
  "type": "registry:ui",
  "title": "Avatar",
  "description": "Avatar represents a person, team, or account with an image and a reliable text fallback.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0"
  ],
  "files": [
    {
      "path": "src/components/ui/avatar.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Avatar as AvatarPrimitive } from \"@base-ui/react/avatar\";\nimport type React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport function Avatar({\n  className,\n  ...props\n}: AvatarPrimitive.Root.Props): React.ReactElement {\n  return (\n    <AvatarPrimitive.Root\n      className={cn(\n        \"inline-flex size-8 shrink-0 select-none items-center justify-center overflow-hidden rounded-full bg-background align-middle font-medium text-xs\",\n        className,\n      )}\n      data-slot=\"avatar\"\n      {...props}\n    />\n  );\n}\n\nexport function AvatarImage({\n  className,\n  ...props\n}: AvatarPrimitive.Image.Props): React.ReactElement {\n  return (\n    <AvatarPrimitive.Image\n      className={cn(\"size-full object-cover\", className)}\n      data-slot=\"avatar-image\"\n      {...props}\n    />\n  );\n}\n\nexport function AvatarFallback({\n  className,\n  ...props\n}: AvatarPrimitive.Fallback.Props): React.ReactElement {\n  return (\n    <AvatarPrimitive.Fallback\n      className={cn(\n        \"flex size-full items-center justify-center rounded-full bg-muted\",\n        className,\n      )}\n      data-slot=\"avatar-fallback\"\n      {...props}\n    />\n  );\n}\n\nexport { AvatarPrimitive };\n"
    }
  ],
  "categories": [
    "data-display"
  ],
  "docs": "# Avatar\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nAvatar represents a person, team, or account with an image and a reliable text\nfallback.\n\n## Import\n\n`import { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\";`\n\n## Public API\n\n- `AvatarImage` renders the image and `AvatarFallback` renders initials or\n  another short fallback.\n- The root defaults to a 32px circular avatar. Change size or radius with\n  existing system classes on `Avatar`; do not create a parallel size API.\n- Keep `data-slot=\"avatar\"`, `avatar-image`, and `avatar-fallback` intact.\n\n## Public Motion\n\n- Avatar has no local animation. Image and fallback switching remains native to\n  Base UI.\n- Avatar groups are static layout compositions and must not add ad-hoc scale or\n  hover motion.\n\n## Public Accessibility\n\n- Give `AvatarImage` meaningful alt text when the image conveys information.\n  Use empty alt text when a nearby label already names the person.\n- Keep fallback text short and understandable.\n- Provide text outside a visual avatar group that names or summarizes its\n  members.\n- Never communicate identity, role, or status through the image alone.\n\n## Public Agent Guidance\n\n- Use Avatar only for people, teams, or account identity.\n- Do not create wrapper primitives or local size and radius APIs.\n- Preserve the image, fallback, and slot contract.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/data-display/avatar)\n\n- [Registry source](https://ui.siteplane.io/r/avatar.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/data-display/avatar",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}
