A component that copies some text to the clipboard when it is clicked.

copyToClipboard.ts

import * as React from "react";

const CopyToClipboard:React.FC<{text:string} & React.HTMLAttributes<HTMLButtonElement>> = ({text, ...props}) => {
  const copyToClipboard = (event:React.MouseEvent<HTMLButtonElement>, str:string) => {
    const el = Object.assign(document.createElement('textarea'),{value:str});
    document.body.appendChild(el);
    el.select();
    document.execCommand('copy');
    document.body.removeChild(el);
  
    props.onClick?.(event);
  };
  
  return <button {...props} onClick={e=>copyToClipboard(e, text)} />
}