krz/brand-bench

 1import { useState } from 'react';
 2import { copyToClipboard } from '../lib/clipboard';
 3
 4interface Props {
 5  text: string;
 6  label?: string;
 7  className?: string;
 8}
 9
10export function CopyButton({ text, label = 'Copy', className = '' }: Props) {
11  const [copied, setCopied] = useState(false);
12
13  const handle = async () => {
14    const ok = await copyToClipboard(text);
15    if (ok) {
16      setCopied(true);
17      setTimeout(() => setCopied(false), 1500);
18    }
19  };
20
21  return (
22    <button
23      type="button"
24      className={`copy-btn${copied ? ' copied' : ''} ${className}`}
25      onClick={handle}
26      title={label}
27    >
28      {copied ? '✓ Copied' : label}
29    </button>
30  );
31}