Components
Loading preview...
Code Snippet
@beratberkay
npx shadcn@latest add https://21st.dev/r/beratberkayg/code-snippet"use client";
import { useState } from "react";
import { Button } from "@/components/ui/button";
import { CheckIcon, CopyIcon } from "lucide-react";
interface CopyButtonProps {
value: string;
}
export function CopyButton({ value }: CopyButtonProps) {
const [hasCopied, setHasCopied] = useState(false);
const copyToClipboard = async () => {
// await navigator.clipboard.writeText(value);
setHasCopied(true);
setTimeout(() => setHasCopied(false), 2000);
};
return (
<Button variant="ghost" size="icon" onClick={copyToClipboard}>
{hasCopied ? (
<CheckIcon className="h-4 w-4" color="green" />
) : (
<CopyIcon className="h-4 w-4" />
)}
<span className="sr-only">Copy code</span>
</Button>
);
}