48949ebb3f
A complete blockchain implementation featuring: - synord: Full node with GHOSTDAG consensus - explorer-web: Modern React blockchain explorer with 3D DAG visualization - CLI wallet and tools - Smart contract SDK and example contracts (DEX, NFT, token) - WASM crypto library for browser/mobile
39 lines
1 KiB
TypeScript
39 lines
1 KiB
TypeScript
import { useState } from 'react';
|
|
import { Copy, Check } from 'lucide-react';
|
|
import { copyToClipboard, cn } from '../lib/utils';
|
|
|
|
interface CopyButtonProps {
|
|
text: string;
|
|
className?: string;
|
|
}
|
|
|
|
export default function CopyButton({ text, className }: CopyButtonProps) {
|
|
const [copied, setCopied] = useState(false);
|
|
|
|
const handleCopy = async () => {
|
|
const success = await copyToClipboard(text);
|
|
if (success) {
|
|
setCopied(true);
|
|
setTimeout(() => setCopied(false), 2000);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<button
|
|
onClick={handleCopy}
|
|
className={cn(
|
|
'p-1.5 rounded text-gray-400 hover:text-gray-200 hover:bg-gray-800 transition-colors',
|
|
className
|
|
)}
|
|
title={copied ? 'Copied!' : 'Copy to clipboard'}
|
|
aria-label={copied ? 'Copied to clipboard' : 'Copy to clipboard'}
|
|
aria-live="polite"
|
|
>
|
|
{copied ? (
|
|
<Check size={16} className="text-green-400" aria-hidden="true" />
|
|
) : (
|
|
<Copy size={16} aria-hidden="true" />
|
|
)}
|
|
</button>
|
|
);
|
|
}
|