Added CopyButton component
This commit is contained in:
34
src/components/ui/copy-button.tsx
Normal file
34
src/components/ui/copy-button.tsx
Normal file
@@ -0,0 +1,34 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import * as React from "react";
|
||||||
|
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { CopyIcon } from "@radix-ui/react-icons";
|
||||||
|
|
||||||
|
import { useClipboard } from "@/lib/hooks";
|
||||||
|
|
||||||
|
const CopyButton = React.forwardRef<
|
||||||
|
React.ElementRef<typeof Button>,
|
||||||
|
React.ComponentPropsWithoutRef<typeof Button> & {
|
||||||
|
valueToCopy: string;
|
||||||
|
}
|
||||||
|
>(({ className, valueToCopy, ...props }, ref) => {
|
||||||
|
const copyToClipboard = useClipboard(valueToCopy);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Button
|
||||||
|
ref={ref}
|
||||||
|
variant={"ghost"}
|
||||||
|
size={"icon"}
|
||||||
|
className={className}
|
||||||
|
onClick={copyToClipboard}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<CopyIcon className="size-4" />
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
export { CopyButton };
|
||||||
Reference in New Issue
Block a user