Gathering detailed insights and metrics for react-copy-to-clipboard
Gathering detailed insights and metrics for react-copy-to-clipboard
Copy-to-clipboard React component
Installations
npm install react-copy-to-clipboardDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
16.13.2
NPM Version
8.3.2
Releases
19
Languages
2
JavaScript
CSS
JavaScript (91.64%)
CSS (8.36%)
Developer
nkbt
Download Statistics
Total Downloads
276,207,911
Last Day
61,517
Last Week
1,396,275
Last Month
5,938,835
Last Year
65,614,257
GitHub Statistics
MIT License
2,359 Stars
525 Commits
128 Forks
18 Watchers
2 Branches
19 Contributors
Updated on May 07, 2025
Bundle Size
6.09 kB
Minified
2.38 kB
Minified + Gzipped
Maintainers
1
Package Meta Information
Latest Version
5.1.0
Package Id
react-copy-to-clipboard@5.1.0
Unpacked Size
39.68 kB
Size
10.24 kB
File Count
9
NPM Version
8.3.2
Node Version
16.13.2
Total Downloads
Cumulative downloads
Total Downloads
276,207,911
Last Day
10.5%
61,517
Compared to previous day
Last Week
-5.6%
1,396,275
Compared to previous week
Last Month
-0%
5,938,835
Compared to previous month
Last Year
15.7%
65,614,257
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
2
Peer Dependencies
1
Dev Dependencies
29
@babel/cli@babel/core@babel/eslint-parser@babel/plugin-proposal-class-properties@babel/plugin-proposal-object-rest-spread@babel/preset-env@babel/preset-react@babel/registerbabel-loaderbabel-plugin-transform-react-remove-prop-typescss-loaderdepcheckeslinteslint-config-airbnbeslint-plugin-importeslint-plugin-jsx-a11yeslint-plugin-reacteslint-plugin-react-hooksgh-pageshtml-webpack-pluginhtml-webpack-tags-pluginmini-css-extract-pluginreactreact-domstyle-loadertapewebpackwebpack-cliwebpack-dev-server
react-copy-to-clipboard 
Copy to clipboard React component
Based on copy-to-clipboard
Would try to use execCommand with fallback to IE specific clipboardData interface and finally, fallback to simple prompt with proper text content & 'Copy to clipboard: Ctrl+C, Enter'
Installation
NPM
1npm install --save react-copy-to-clipboard
Don't forget to manually install peer dependencies (react) if you use npm@3.
1998 Script Tag:
1<script src="https://unpkg.com/react@16.0.0/umd/react.production.min.js"></script> 2<script src="https://unpkg.com/react-copy-to-clipboard/build/react-copy-to-clipboard.js"></script> 3(Module exposed as `CopyToClipboard`)
Live design system demo
Simple web demo
http://nkbt.github.io/react-copy-to-clipboard
Codepen demo
http://codepen.io/nkbt/pen/eNPoQv
Usage
1import React from 'react'; 2import ReactDOM from 'react-dom'; 3import {CopyToClipboard} from 'react-copy-to-clipboard'; 4 5class App extends React.Component { 6 state = { 7 value: '', 8 copied: false, 9 }; 10 11 render() { 12 return ( 13 <div> 14 <input value={this.state.value} 15 onChange={({target: {value}}) => this.setState({value, copied: false})} /> 16 17 <CopyToClipboard text={this.state.value} 18 onCopy={() => this.setState({copied: true})}> 19 <span>Copy to clipboard with span</span> 20 </CopyToClipboard> 21 22 <CopyToClipboard text={this.state.value} 23 onCopy={() => this.setState({copied: true})}> 24 <button>Copy to clipboard with button</button> 25 </CopyToClipboard> 26 27 {this.state.copied ? <span style={{color: 'red'}}>Copied.</span> : null} 28 </div> 29 ); 30 } 31} 32 33const appRoot = document.createElement('div'); 34document.body.appendChild(appRoot); 35ReactDOM.render(<App />, appRoot);
Options
text: PropTypes.string.isRequired
Text to be copied to clipboard
onCopy: PropTypes.func
Optional callback, will be called when text is copied
onCopy(text, result)
result (bool): Returns true if copied successfully, else false.
options: PropTypes.shape({debug: bool, message: string})
Optional copy-to-clipboard options.
See API docs for details
children: PropTypes.node.isRequired
CopyToClipboard is a simple wrapping component, it does not render any tags, so it requires the only child element to be present, which will be used to capture clicks.
1<CopyToClipboard text="Hello!"> 2 <button>Copy to clipboard</button> 3</CopyToClipboard>
Development and testing
Currently is being developed and tested with the latest stable Node 8 on OSX.
To run example covering all CopyToClipboard features, use yarn start, which will compile example/Example.js
1git clone git@github.com:nkbt/react-copy-to-clipboard.git 2cd react-copy-to-clipboard 3yarn install 4yarn start 5 6# then 7open http://localhost:8080
Tests
1# to run ESLint check 2yarn lint 3 4# to run tests 5yarn test 6 7# to run end-to-end tests 8# first, run `selenium/standalone-firefox:3.4.0` docker image 9docker run -p 4444:4444 selenium/standalone-firefox:3.4.0 10# then run test 11yarn e2e
License
MIT
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 1/10 approved changesets -- score normalized to 1
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 24 are checked with a SAST tool
Reason
46 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q
- Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c
- Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc
- Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp
- Warn: Project is vulnerable to: GHSA-8mmm-9v2q-x3f9
- Warn: Project is vulnerable to: GHSA-rc47-6667-2j5j
- Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27
- Warn: Project is vulnerable to: GHSA-4www-5p9h-95mh
- Warn: Project is vulnerable to: GHSA-9gqv-wp59-fq42
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-76p7-773f-r4q5
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
- Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-hc6q-2mpp-qw7j
- Warn: Project is vulnerable to: GHSA-4vvj-4cpr-p986
- Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
- Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
Score
2.1
/10
Last Scanned on 2025-05-26
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More