React wrapper for easy integration with clipboard.js (with Flow annotations)

Copy.js

// @flow
import * as React from 'react'
import Clipboard, { type ClipboardType } from 'clipboard'

type Props = {
	text: string,
	onSuccess?: () => any,
	children: React.Node,
}

export default class Copy extends React.PureComponent<Props> {

	el: Element
	clipboard: ClipboardType

	onRef = (node: Element) => this.el = node

	componentDidMount() {
		this.clipboard = new Clipboard(this.el)

		if(this.props.onSuccess) {
			this.clipboard.on('success', this.props.onSuccess)
		}
	}

	componentWillUnmount() {
		this.clipboard.destroy()
	}

	render() {
		const el = React.Children.only(this.props.children)

		return React.cloneElement(el, {
			ref: this.onRef,
			'data-clipboard-text': this.props.text,
		})
	}
}