{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sources",
  "type": "registry:ui",
  "title": "Sources",
  "description": "Grounded-answer sources list and hoverable inline citations.",
  "dependencies": [
    "motion",
    "lucide-react"
  ],
  "registryDependencies": [
    "https://seamui.dev/r/utils.json",
    "https://seamui.dev/r/motion.json",
    "https://seamui.dev/r/avatar.json",
    "https://seamui.dev/r/badge.json",
    "https://seamui.dev/r/button.json",
    "https://seamui.dev/r/collapsible.json",
    "https://seamui.dev/r/preview-card.json"
  ],
  "files": [
    {
      "path": "registry/seam/ui/sources.tsx",
      "content": "\"use client\"\n\nimport type * as React from \"react\"\nimport { ChevronDown, ExternalLink } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"./avatar\"\nimport { Badge, badgeVariants } from \"./badge\"\nimport { Button } from \"./button\"\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n} from \"./collapsible\"\nimport {\n  PreviewCard,\n  PreviewCardContent,\n  PreviewCardTrigger,\n} from \"./preview-card\"\n\n// The \"used N sources\" disclosure that grounds an answer.\nfunction Sources({\n  className,\n  ...props\n}: React.ComponentProps<typeof Collapsible>) {\n  return (\n    <Collapsible\n      data-slot=\"sources\"\n      className={cn(\"w-full\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SourcesTrigger({\n  className,\n  count,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsibleTrigger> & { count?: number }) {\n  return (\n    <CollapsibleTrigger\n      data-slot=\"sources-trigger\"\n      // Single-trigger Collapsible (no roving focus) → wear the Button\n      // component: ghost press-dim + haptic tap come from the foundation.\n      render={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className={cn(\n            \"group/sources text-muted-foreground w-fit gap-1.5 font-normal\",\n            className\n          )}\n        />\n      }\n      {...props}\n    >\n      {children ?? (\n        <>\n          Used\n          <Badge variant=\"muted\" aria-hidden className=\"shadow-none\">\n            {count}\n          </Badge>\n          sources\n        </>\n      )}\n      <ChevronDown className=\"size-3.5 transition-transform duration-200 group-data-[panel-open]/sources:rotate-180 motion-reduce:transition-none\" />\n    </CollapsibleTrigger>\n  )\n}\n\nfunction SourcesContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CollapsibleContent>) {\n  return (\n    <CollapsibleContent data-slot=\"sources-content\" {...props}>\n      <div className={cn(\"flex flex-col gap-0.5 pt-1\", className)}>\n        {children}\n      </div>\n    </CollapsibleContent>\n  )\n}\n\n// A favicon-and-title link. The favicon dogfoods Avatar (squared) with a\n// numeric fallback; the external-link glyph reveals on hover/focus.\nfunction Source({\n  className,\n  href,\n  title,\n  favicon,\n  index,\n  children,\n  ...props\n}: Omit<React.ComponentProps<\"a\">, \"title\"> & {\n  title?: React.ReactNode\n  favicon?: string\n  index?: number\n}) {\n  return (\n    <a\n      data-slot=\"source\"\n      href={href}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n      className={cn(\n        \"group/source hover:bg-accent flex items-center gap-2 rounded-md squircle px-2 py-1.5 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/50\",\n        className\n      )}\n      {...props}\n    >\n      <Avatar className=\"size-5 rounded-sm\">\n        {favicon ? <AvatarImage src={favicon} alt=\"\" /> : null}\n        <AvatarFallback className=\"rounded-sm text-[0.625rem]\">\n          {index ?? \"•\"}\n        </AvatarFallback>\n      </Avatar>\n      <span className=\"min-w-0 flex-1 truncate\">{children ?? title}</span>\n      <ExternalLink className=\"text-muted-foreground size-3.5 shrink-0 opacity-0 transition-opacity group-hover/source:opacity-100 group-focus-visible/source:opacity-100 motion-reduce:transition-none\" />\n    </a>\n  )\n}\n\n// A superscript citation chip in running text. It's quiet metadata carved into\n// the prose (debossed muted Badge), and it's a real link — focusable, and the\n// preview opens on focus as well as hover.\nfunction InlineCitation({\n  className,\n  href,\n  title,\n  favicon,\n  index,\n  children,\n  ...props\n}: Omit<React.ComponentProps<\"a\">, \"title\"> & {\n  title?: React.ReactNode\n  favicon?: string\n  index?: number\n}) {\n  return (\n    <PreviewCard>\n      <PreviewCardTrigger\n        data-slot=\"inline-citation\"\n        href={href}\n        target=\"_blank\"\n        rel=\"noreferrer\"\n        className={cn(\n          badgeVariants({ variant: \"muted\" }),\n          \"mx-0.5 h-4 min-w-4 -translate-y-[0.35em] px-1 text-[0.65rem] align-super no-underline\",\n          className\n        )}\n        {...props}\n      >\n        {index ?? children}\n      </PreviewCardTrigger>\n      <PreviewCardContent className=\"w-72 p-3\">\n        <a\n          href={href}\n          target=\"_blank\"\n          rel=\"noreferrer\"\n          className=\"flex items-center gap-2.5 outline-none\"\n        >\n          <Avatar className=\"size-7 rounded-sm\">\n            {favicon ? <AvatarImage src={favicon} alt=\"\" /> : null}\n            <AvatarFallback className=\"rounded-sm text-[0.65rem]\">\n              {index ?? \"•\"}\n            </AvatarFallback>\n          </Avatar>\n          <div className=\"min-w-0\">\n            <div className=\"truncate text-sm font-medium\">{title}</div>\n            <div className=\"text-muted-foreground truncate text-xs\">{href}</div>\n          </div>\n        </a>\n      </PreviewCardContent>\n    </PreviewCard>\n  )\n}\n\nexport { Sources, SourcesTrigger, SourcesContent, Source, InlineCitation }\n",
      "type": "registry:ui",
      "target": "components/ui/sources.tsx"
    }
  ]
}