1.0.3 • Published 6 months ago
webcomponent-qr-reader v1.0.3
<qr-reader>
Web Component for reading QR Codes.
Demo
Install
npm install webcomponent-qr-reader
Usage
import 'webcomponent-qr-reader'
const reader = document.querySelector('qr-reader')
reader.addEventListener('read', event => {
console.log(event.detail)
})
<qr-reader></qr-reader>
Custom element name
import QRReader from 'webcomponent-qr-reader/qr-reader'
customElements.define('myapp-reader', QRReader)
<myapp-reader></myapp-reader>
Custom styles
Use the part
pseudo-element to style shadow DOM elements:
qr-reader::part(video) {}
Options
Attribute | Options | Default | Description |
---|---|---|---|
scanInterval | int. | 100 | Scan interval time in ms. |
debounceTime | int | 2000 | Time to ignore subsequent reads in ms. |
Contributing
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
Changelog
- v1.0.0 October 23, 2023 * Complete re-write
- v0.0.3 September 18, 2013 * jsqrcode it's not called from the component. It needs now to be added as a dependency.
- v0.0.2 September 18, 2013 * First working version of the component.
- v0.0.1 September 16, 2013 * Started project using boilerplate-element