'use client'

import { useState } from 'react';

import * as style from './copy.css';

export default function Copy({ className, text, children }: { className?: string, text: string, children: React.ReactNode }) {
	const [copied, set_copied ] = useState(false);
	function make_copy_text(text: string) {
		return () => {
			navigator.clipboard.writeText(text);
			set_copied(true);
			setTimeout(() => { set_copied(false); }, 2000);
		};
	}
	return <button onClick={make_copy_text(text)} className={`${style.copy} ${className ?? ''}`}>{copied ? '[ Copied ]' : '[  Copy  ]'} {children}</button>
}