Skip to content

Instantly share code, notes, and snippets.

@rista404 rista404/Copy.js
Created May 21, 2018

Embed
What would you like to do?
React wrapper for easy integration with clipboard.js (with Flow annotations)
// @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,
})
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.