{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "username-display",
  "type": "registry:block",
  "title": "Username Display",
  "description": "A component for displaying a username with verification badges, copy to clipboard, and truncation.",
  "registryDependencies": [
    "verification-badge",
    "copy-button"
  ],
  "files": [
    {
      "path": "src/components/deso/username-display.tsx",
      "content": "'use client';\n\nimport React from 'react';\nimport { Skeleton } from '@/components/ui/skeleton';\nimport { TooltipProvider } from '@/components/ui/tooltip';\nimport { useUsername, useProfile } from '@/hooks/useProfile';\nimport { cn, truncateText } from '@/lib/utils/deso';\nimport { CopyButton } from './copy-button';\nimport { VerificationBadge } from './verification-badge';\nimport { CheckCircleIcon } from 'lucide-react';\nimport Link from 'next/link';\nimport { Profile } from '@/lib/schemas/deso';\n\nexport interface UsernameDisplayProps {\n  publicKey: string;\n  profile?: Profile;\n  isVerified?: boolean;\n  showVerification?: boolean;\n  truncate?: boolean;\n  maxLength?: number;\n  className?: string;\n  onClick?: () => void;\n  showCopyButton?: boolean;\n  linkToProfile?: boolean;\n  variant?: 'social' | 'token';\n}\n\nexport function UsernameDisplay({\n  publicKey,\n  profile: profileProp,\n  isVerified = false,\n  showVerification = true,\n  truncate = false,\n  maxLength = 20,\n  className,\n  onClick,\n  showCopyButton = false,\n  linkToProfile = false,\n  variant,\n}: UsernameDisplayProps) {\n  const {\n    profile: fetchedProfile,\n    loading,\n    error,\n  } = useProfile(profileProp ? '' : publicKey);\n  const profile = profileProp || fetchedProfile;\n  const username = profile?.username;\n  const verificationStatus = isVerified || profile?.isVerified;\n\n  const handleClick = () => {\n    if (linkToProfile && username) {\n      window.open(`https://diamondapp.com/u/${username}`, '_blank');\n    } else if (onClick) {\n      onClick();\n    }\n  };\n\n  if (loading) {\n    return (\n      <div className={cn('flex items-center gap-2', className)}>\n        <Skeleton className=\"h-4 w-20\" />\n        {showVerification && verificationStatus && <Skeleton className=\"h-4 w-4 rounded-full\" />}\n      </div>\n    );\n  }\n\n  if (error || !username) {\n    return (\n      <div className={cn('flex items-center gap-2 text-muted-foreground', className)}>\n        <span className=\"text-sm\">{username || ''}</span>\n      </div>\n    );\n  }\n\n  const prefix = variant === 'social' ? '@' : variant === 'token' ? '$' : '';\n  let displayText = `${prefix}${username}`;\n  if (truncate) {\n    displayText = truncateText(displayText, maxLength);\n  }\n\n  return (\n    <TooltipProvider>\n      <div className={cn('flex items-center gap-2', className)}>\n        <div\n          className={cn(\n            'flex items-center gap-1',\n            (onClick || linkToProfile) && 'cursor-pointer hover:opacity-80 transition-opacity'\n          )}\n          onClick={handleClick}\n        >\n          <span className=\"font-semibold text-foreground\">{displayText}</span>\n          {showVerification && verificationStatus && (\n            <VerificationBadge isVerified={true} size=\"lg\" />\n          )}\n        </div>\n\n        {showCopyButton && username && <CopyButton textToCopy={username} size=\"sm\" />}\n      </div>\n    </TooltipProvider>\n  );\n}\n\nUsernameDisplay.displayName = 'UsernameDisplay'; ",
      "type": "registry:component",
      "target": "src/components/deso-ui/username-display.tsx"
    }
  ]
}