react-copy-to-clipboard/src/Component.js

Copy-to-clipboard React component

import copy from 'copy-to-clipboard';
import PropTypes from 'prop-types';
import React from 'react';

export class CopyToClipboard extends React.PureComponent {
  static propTypes = {
    text: PropTypes.string.isRequired,
    children: PropTypes.element.isRequired,
    onCopy: PropTypes.func,
    options: PropTypes.shape({
      debug: PropTypes.bool,
      message: PropTypes.string,
      format: PropTypes.string,
    }),
  };

  static defaultProps = {
    onCopy: undefined,
    options: undefined,
  };

  onClick = (event) => {
    const { text, onCopy, children, options } = this.props;

    const elem = React.Children.only(children);

    const result = copy(text, options);

    if (onCopy) {
      onCopy(text, result);
    }

    // Bypass onClick if it was present
    if (elem?.props && typeof elem.props.onClick === 'function') {
      elem.props.onClick(event);
    }
  };

  render() {
    const { text: _text, onCopy: _onCopy, options: _options, children, ...props } = this.props;
    const elem = React.Children.only(children);

    return React.cloneElement(elem, { ...props, onClick: this.onClick });
  }
}