{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "z-avatar",
  "title": "Z Avatar",
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [
    "https://ui.orchid.ai/r/orchid-foundation.json",
    "https://ui.orchid.ai/r/orchid-theme.json"
  ],
  "files": [
    {
      "path": "registry/ui/orchid/spectrum/atoms/z-avatar/z-avatar.tsx",
      "content": "\"use client\";\nimport { useState } from 'react';\nimport { cn } from \"../../../lib/ui-utils\";\ntype AvatarSize = 'xs' | 'sm' | 'md' | 'lg';\ntype Props = {\n    src?: string;\n    alt?: string;\n    fallback?: string;\n    size?: AvatarSize;\n    className?: string;\n    roundedFull?: boolean;\n};\nconst sizeClasses: Record<AvatarSize, string> = {\n    xs: 'size-4 min-w-4 min-h-4 text-copy-xs',\n    sm: 'size-6 min-w-6 min-h-6 text-copy-xs',\n    md: 'size-8 min-w-8 min-h-8 text-copy-xs',\n    lg: 'size-12 min-w-12 min-h-12 text-copy',\n};\nconst imgSizeValues: Record<AvatarSize, number> = {\n    xs: 16,\n    sm: 24,\n    md: 32,\n    lg: 48,\n};\nconst roundedValues: Record<AvatarSize, string> = {\n    xs: 'rounded',\n    sm: 'rounded-lg',\n    md: 'rounded-xl',\n    lg: 'rounded-2xl',\n};\nexport default function ZAvatar({ src, alt, fallback, size = 'sm', roundedFull = true, className, }: Props) {\n    const initials = fallback ? getInitials(fallback) : '?';\n    const [imgError, setImgError] = useState(false);\n    const showImg = src && !imgError;\n    return (<div className={cn('bg-surface border-neutral text-neutral flex items-center justify-center overflow-hidden border font-semibold', roundedFull ? 'rounded-full' : roundedValues[size], sizeClasses[size], className)}>\n      {showImg ? (<img src={src} alt={alt || fallback || 'Avatar'} width={imgSizeValues[size] - 2} height={imgSizeValues[size] - 2} className={cn('bg-surface-strong size-full object-cover', className)} onError={() => setImgError(true)}/>) : (<span className={cn('text-neutral grid place-items-center', sizeClasses[size], className)}>\n          {initials}\n        </span>)}\n    </div>);\n}\nfunction getInitials(name: string): string {\n    return name\n        .split(' ')\n        .map((word) => word.charAt(0).toUpperCase())\n        .slice(0, 1)\n        .join('');\n}\n",
      "type": "registry:ui",
      "target": "@ui/orchid/spectrum/atoms/z-avatar/z-avatar.tsx"
    }
  ],
  "type": "registry:ui"
}