1.0.3 • Published 6 months ago

webcomponent-qr-reader v1.0.3

Weekly downloads
-
License
ISC
Repository
github
Last release
6 months ago

Published on webcomponents.org

<qr-reader>

Web Component for reading QR Codes.

Demo

Check it live.

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

AttributeOptionsDefaultDescription
scanIntervalint.100Scan interval time in ms.
debounceTimeint2000Time to ignore subsequent reads in ms.

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. 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

License

MIT License

1.0.3

6 months ago

1.0.2

7 months ago

1.0.1

7 months ago

1.0.0

7 months ago