useCopyToClipboard.md

useCopyToClipboard

Copy text to a user's clipboard.

Usage

const Demo = () => {
  const [text, setText] = React.useState('');
  const [state, copyToClipboard] = useCopyToClipboard();

  return (
    <div>
      <input value={text} onChange={e => setText(e.target.value)} />
      <button type="button" onClick={() => copyToClipboard(text)}>copy text</button>
      {state.error
        ? <p>Unable to copy value: {state.error.message}</p>
        : state.value && <p>Copied {state.value}</p>}
    </div>
  )
}

Reference

const [{value, error, noUserInteraction}, copyToClipboard] = useCopyToClipboard();

• value — value that was copied to clipboard, undefined when nothing was copied.
• error — caught error when trying to copy to clipboard.
• noUserInteraction — boolean indicating if user interaction was required to copy the value to clipboard to expose full API from underlying copy-to-clipboard library.