diff options
| author | Christian Cleberg <[email protected]> | 2026-04-18 22:32:53 -0500 |
|---|---|---|
| committer | Christian Cleberg <[email protected]> | 2026-04-18 22:32:53 -0500 |
| commit | 580e798e16346eb894eb899edac82d2efdf40adc (patch) | |
| tree | 6dec3b7db678f781138b40d34da37d21ac8fbe7d /src/components/CopyButton.tsx | |
| download | brand-bench-580e798e16346eb894eb899edac82d2efdf40adc.tar.gz brand-bench-580e798e16346eb894eb899edac82d2efdf40adc.tar.bz2 brand-bench-580e798e16346eb894eb899edac82d2efdf40adc.zip | |
initial commit
Diffstat (limited to 'src/components/CopyButton.tsx')
| -rw-r--r-- | src/components/CopyButton.tsx | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/src/components/CopyButton.tsx b/src/components/CopyButton.tsx new file mode 100644 index 0000000..18a7433 --- /dev/null +++ b/src/components/CopyButton.tsx @@ -0,0 +1,31 @@ +import { useState } from 'react'; +import { copyToClipboard } from '../lib/clipboard'; + +interface Props { + text: string; + label?: string; + className?: string; +} + +export function CopyButton({ text, label = 'Copy', className = '' }: Props) { + const [copied, setCopied] = useState(false); + + const handle = async () => { + const ok = await copyToClipboard(text); + if (ok) { + setCopied(true); + setTimeout(() => setCopied(false), 1500); + } + }; + + return ( + <button + type="button" + className={`copy-btn${copied ? ' copied' : ''} ${className}`} + onClick={handle} + title={label} + > + {copied ? '✓ Copied' : label} + </button> + ); +} |
