{"$schema":"https://ui.logic2b.com/schema/registry-item.json","name":"avatar","type":"registry:ui","description":"An image element with a fallback for representing a user, built on Radix Avatar.","dependencies":["radix-ui"],"registryDependencies":["utils"],"files":[{"path":"ui/avatar.tsx","type":"registry:ui","content":"\"use client\"\n\nimport * as React from \"react\"\nimport { Avatar as AvatarPrimitive } from \"radix-ui\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Avatar({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root>) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      className={cn(\n        \"relative flex size-8 shrink-0 overflow-hidden rounded-full\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarImage({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn(\"aspect-square size-full\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarFallback({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        \"bg-muted flex size-full items-center justify-center rounded-full\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Avatar, AvatarImage, AvatarFallback }\n"}],"categories":["data-display"],"accessibility":{"support":"primitive","pattern":"image with fallback","primitive":"Radix Avatar","keyboard":[],"aria":["The image forwards its accessible name; the fallback text remains available when the image cannot load."],"consumer":["Provide useful alt text for informative avatars and empty alt text when the nearby name is redundant."]},"api":{"source":"src/ui/avatar.tsx","exports":[{"name":"Avatar","kind":"component","propsType":"React.ComponentProps<typeof AvatarPrimitive.Root>"},{"name":"AvatarImage","kind":"component","propsType":"React.ComponentProps<typeof AvatarPrimitive.Image>"},{"name":"AvatarFallback","kind":"component","propsType":"React.ComponentProps<typeof AvatarPrimitive.Fallback>"}]}}