Copy element text content or input values to the clipboard.
$ npm install --save @github/clipboard-copy-element
Import as ES modules:
import '@github/clipboard-copy-element'With a script tag:
<script type="module" src="./node_modules/@github/clipboard-copy-element/dist/index.js"><clipboard-copy for="blob-path" class="btn btn-sm BtnGroup-item">
Copy path
</clipboard-copy>
<div id="blob-path">src/index.js</div><clipboard-copy value="src/index.js">Copy</clipboard-copy><clipboard-copy for="blob-path">Copy</clipboard-copy>
<div id="blob-path">src/index.js</div><clipboard-copy for="blob-path">Copy</clipboard-copy>
<input id="blob-path" value="src/index.js"><clipboard-copy for="blob-path">Copy full URL</clipboard-copy>
<a id="blob-path" href="/path/to#my-blob">Link text will not be copied</a>After copying to the clipboard, a clipboard-copy event is dispatched from
the <clipboard-copy> element:
document.addEventListener('clipboard-copy', function(event) {
const button = event.target
button.classList.add('highlight')
})Browsers without native custom element support require a polyfill.
- Chrome
- Firefox
- Safari
- Microsoft Edge
npm install
npm test
Distributed under the MIT license. See LICENSE for details.