mikelpmc / react-use-copy-to-clipboard

React hook to copy the given text to the clipboard

⚛️ React copy to clipboard

React custom hook to copy the given text to the clipboard.

Compatible with Edge and IE11 as well all modern browsers.

Codesandbox demo

How to use

Basic usage

function App() {
  const {isCopied, onCopy} = useCopyToClipboard({text: "Text to copy"});

  return (
    <button type="button" onClick={onCopy}>
      Text is copied: {isCopied ? "Yes! 👍" : "Nope! 👎"}
    </button>
  );
}

Reset the isCopied success state after a given time

You can reset the isCopied flag passing an optional successDuration prop with the desired time in milliseconds.

const {isCopied, onCopy} = useCopyToClipboard({text: "Text to copy", successDuration: 2000});

Author: Mikel Parra [e-mail] | http://github.com/mikelpmc