{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button-20",
  "title": "Copy Button",
  "description": "A copy button component",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button"
  ],
  "files": [
    {
      "path": "src/components/customized/button/button-20.tsx",
      "content": "\"use client\";\n\nimport { Check, Copy } from \"lucide-react\";\nimport React from \"react\";\nimport { Button } from \"@/registry/ui/button\";\n\nconst CopyButton = () => {\n  const { isCopied, copyToClipboard } = useCopyToClipboard();\n  const link = \"https://www.shadcnui-blocks.com\";\n\n  return (\n    <div className=\"flex items-center overflow-hidden rounded-xl border bg-muted/70 p-0.75 ps-0\">\n      <p className=\"max-w-[25ch] select-all overflow-hidden text-ellipsis whitespace-nowrap pr-2 pl-3 text-sm\">\n        {link}\n      </p>\n      <Button onClick={() => copyToClipboard(link)} size=\"icon\">\n        {isCopied ? <Check /> : <Copy />}\n      </Button>\n    </div>\n  );\n};\n\n// @hooks/use-copy-to-clipboard.tsx\nfunction useCopyToClipboard({\n  timeout = 2000,\n  onCopy,\n}: {\n  timeout?: number;\n  onCopy?: () => void;\n} = {}) {\n  const [isCopied, setIsCopied] = React.useState(false);\n\n  const copyToClipboard = (value: string) => {\n    if (typeof window === \"undefined\" || !navigator.clipboard.writeText) {\n      return;\n    }\n\n    if (!value) {\n      return;\n    }\n\n    navigator.clipboard.writeText(value).then(() => {\n      setIsCopied(true);\n\n      if (onCopy) {\n        onCopy();\n      }\n\n      setTimeout(() => {\n        setIsCopied(false);\n      }, timeout);\n    }, console.error);\n  };\n\n  return { isCopied, copyToClipboard };\n}\n\nexport default CopyButton;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}