react-click-copy-code
Copies any child component's code to clipboard. Great for example pages.
Install
yarn add react-click-copy-code
Usage
import React Component from 'react' import ClickCopy from 'react-click-copy-code' { return <ClickCopy> /* Put anything you want in here. Including subcomponents. */ <ClickCopy.Items> /* Components to copy go inside here. */ <Icon = = /> </ClickCopy.Items> /* Optional Source and Notification friends */ <ClickCopy.Source /> <ClickCopy.Notification /> </ClickCopy> }
Properties
ClickCopy
Property | Type | Default | Description |
---|---|---|---|
copyText | string | 'Click to copy!' | Text shown in notification when ready to copy. |
formattingOptions | object | { showDefaultProps: false } | Any option from react-element-to-jsx-string options |
errorText | string | 'Oops. Try again.' | Text shown in notification when copy action fails. |
onClick | function | Copies text and sets state to success/fail. | Function called when element is clicked. Custom will be called alongside default. |
onError | function | Resets state to ready to copy. | Function called when copy action fails. Custom will be called alongside default. |
onSuccess | function | Resets state to ready to copy. | Function called when when copy action succeeds. Custom will be called alongside default. |
sourceOverwrite | string | ----------- | Optional text to be copied to the clipboard in place of the source contained in the Items subcomponent. |
successText | string | 'Copied!' | Text shown in notification when copy action succeeds. |
ClickCopy.Items
This space intentionally left blank — no props for the Items
!
ClickCopy.Notification
Property | Type | Default | Description |
---|---|---|---|
background | string | #001eff | Set background color of notification overlay. |
color | string | white | Set text color of notification overlay. |
font | string | monospace | Set font family of notification overlay. |
className | string | ----------- | Composes with internal classes. |
style | object | ----------- | Overwrites internal style attributes. |
ClickCopy.Source
Property | Type | Default | Description |
---|---|---|---|
background | string | #dadadd | Set background color of source box. |
color | string | #53535c | Set text color of source box. |
font | string | monospace | Set font family of source box. |
className | string | ---- | Composes with internal classes. |
style | object | ---- | Overwrites internal style attributes. |
License
MIT © hydrate.io