{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "link-preview",
  "type": "registry:ui",
  "title": "Link preview",
  "description": "A rich link card with an optional 2:1 cover image, title, two line description and the URL, opening in a new tab. Good for chat messages, posts and bookmarks.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/aspect-ratio.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/link-preview.tsx",
      "type": "registry:ui",
      "target": "components/ui/link-preview.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { AspectRatio } from \"@/components/ui/aspect-ratio\"\n\nfunction LinkPreview({\n  url,\n  title,\n  description,\n  image,\n  className,\n}: {\n  url: string\n  title: string\n  description?: string\n  image?: string\n  className?: string\n}) {\n  return (\n    <a\n      data-slot=\"link-preview\"\n      href={url}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n      className={cn(\n        \"block overflow-hidden rounded-xl border border-border bg-surface outline-none transition-[border-color] duration-[70ms]\",\n        \"hover:border-fg-subtle focus-visible:ring-2 focus-visible:ring-accent\",\n        className\n      )}\n    >\n      {image ? (\n        <AspectRatio ratio={2}>\n          {/* eslint-disable-next-line @next/next/no-img-element */}\n          <img src={image} alt=\"\" className=\"absolute inset-0 size-full object-cover\" />\n        </AspectRatio>\n      ) : null}\n      <div className=\"space-y-1 p-3\">\n        <p className=\"text-sm font-medium text-fg\">{title}</p>\n        {description ? <p className=\"line-clamp-2 text-xs text-fg-muted\">{description}</p> : null}\n        <p className=\"truncate text-[11px] text-fg-subtle\">{url}</p>\n      </div>\n    </a>\n  )\n}\nexport { LinkPreview }\n"
    }
  ]
}