{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "hyperlink",
  "type": "registry:ui",
  "title": "Hyperlink",
  "description": "Hyperlink component with animated underline, smooth hover & customizable style.",
  "author": "Ahdeetai <https://aditya.is-cool.dev>",
  "registryDependencies": [],
  "dependencies": ["clsx", "tailwind-merge"],
  "files": [
    {
      "type": "registry:ui",
      "path": "components/ui/hyperlink.tsx",
      "content": "\"use client\";\nimport React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\ninterface HyperlinkProps {\n  href: string;\n  children: React.ReactNode;\n  className?: string;\n  underlineClassName?: string;\n}\n\nconst Hyperlink: React.FC<HyperlinkProps> = ({\n  href,\n  children,\n  className,\n  underlineClassName,\n}) => {\n  const [isHovered, setIsHovered] = React.useState(false);\n\n  return (\n    <a\n      href={href}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n      className={cn(\n        \"relative inline-block text-sm font-medium tracking-wide text-foreground\",\n        className\n      )}\n    >\n      <span className=\"relative z-10\">{children}</span>\n      <span className=\"absolute left-0 w-full h-[1.5px] bg-muted-foreground/30 -bottom-2\" />\n      <span\n        className={cn(\n          \"absolute left-0 w-full h-[1.5px] bg-foreground transform scale-x-0 transition-transform duration-500 ease-out -bottom-2\",\n          isHovered ? \"scale-x-100 origin-left\" : \"scale-x-0 origin-right\",\n          underlineClassName\n        )}\n      />\n    </a>\n  );\n};\n\nexport { Hyperlink };\n"
    },
    {
      "type": "registry:lib",
      "path": "lib/utils.ts",
      "content": "import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}"
    }
  ]
}
