ec4b83ee40
Bumps [http-cache-semantics](https://github.com/kornelski/http-cache-semantics) from 4.1.0 to 4.1.1. - [Release notes](https://github.com/kornelski/http-cache-semantics/releases) - [Commits](https://github.com/kornelski/http-cache-semantics/compare/v4.1.0...v4.1.1) --- updated-dependencies: - dependency-name: http-cache-semantics dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> |
||
---|---|---|
.devcontainer | ||
.github/workflows | ||
examples | ||
src | ||
test | ||
.eslintrc.json | ||
.gitignore | ||
CODEOWNERS | ||
LICENSE | ||
README.md | ||
package-lock.json | ||
package.json | ||
rollup.config.js | ||
tsconfig.json |
README.md
<clipboard-copy> element
Copy element text content or input values to the clipboard.
Installation
$ npm install --save @github/clipboard-copy-element
Usage
Script
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">
Markup
<clipboard-copy for="blob-path" class="btn btn-sm BtnGroup-item">
Copy path
</clipboard-copy>
<div id="blob-path">src/index.js</div>
Data sources
Attribute
<clipboard-copy value="src/index.js">Copy</clipboard-copy>
Element content
<clipboard-copy for="blob-path">Copy</clipboard-copy>
<div id="blob-path">src/index.js</div>
Form input
<clipboard-copy for="blob-path">Copy</clipboard-copy>
<input id="blob-path" value="src/index.js">
Hyperlink href
<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>
Events
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')
})
Browser support
Browsers without native custom element support require a polyfill.
- Chrome
- Firefox
- Safari
- Microsoft Edge
Development
npm install
npm test
License
Distributed under the MIT license. See LICENSE for details.