{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "social-proof",
  "type": "registry:ui",
  "title": "Social proof",
  "description": "Social proof row of up to five overlapping avatars with initials fallback, next to a count label like 2,000 teams. Built in React for landing page heroes.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/avatar.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/social-proof.tsx",
      "type": "registry:ui",
      "target": "components/ui/social-proof.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\n\n/** A stack of up to five customer avatars beside a short trust line, for hero and signup sections. */\ntype SocialProofProps = {\n  /** The trust line shown next to the avatars. */\n  countLabel?: string\n  /** People to show; only the first five are rendered. */\n  people?: { name: string; src?: string }[]\n  className?: string\n}\n\nconst SAMPLE_PEOPLE = [\n  { name: \"Maya Chen\" },\n  { name: \"Theo Okafor\" },\n  { name: \"Priya Raman\" },\n  { name: \"Sam Lowe\" },\n  { name: \"Ada Novak\" },\n]\n\n/** \"Maya Chen\" → \"MC\"; single words keep their first two letters. */\nfunction initials(name: string) {\n  const parts = name.trim().split(/\\s+/)\n  return (parts.length > 1 ? parts[0][0] + parts[parts.length - 1][0] : name.slice(0, 2)).toUpperCase()\n}\n\nfunction SocialProof({\n  countLabel = \"Trusted by 2,400+ finance teams\",\n  people = SAMPLE_PEOPLE,\n  className,\n}: SocialProofProps) {\n  const shown = people.slice(0, 5)\n  return (\n    <div data-slot=\"social-proof\" className={cn(\"inline-flex items-center gap-3\", className)}>\n      <div className=\"flex -space-x-2\">\n        {shown.map((p) => (\n          <Avatar key={p.name} className=\"size-8 ring-2 ring-bg\">\n            {p.src ? <AvatarImage src={p.src} alt=\"\" /> : null}\n            <AvatarFallback>{initials(p.name)}</AvatarFallback>\n          </Avatar>\n        ))}\n      </div>\n      <p className=\"text-sm text-fg-muted\">{countLabel}</p>\n    </div>\n  )\n}\nexport { SocialProof }\nexport type { SocialProofProps }\n"
    }
  ]
}
