qr-code
qr-code copied to clipboard
Published
20 hours ago •
educastellano
educastellano
Web Component for generating QR codes
<qr-code>
Web Component for generating QR Codes, using (a fork of) qr.js lib.
Demo
Install
npm install webcomponent-qr-code
Usage
import 'webcomponent-qr-code'
<qr-code data="hello world!"></qr-code>
Custom element name:
import QRCode from 'webcomponent-qr-code/qr-code'
customElements.define('myapp-qrcode', QRCode)
<myapp-qrcode data="hello world!"></myapp-qrcode>
Options
| Attribute | Options | Default | Description |
|---|---|---|---|
data |
string | null |
The information encoded by the QR code. |
format |
png, html, svg |
png |
Format of the QR code rendered inside the component. |
modulesize |
int | 5 |
Size of the modules in pixels. |
margin |
int | 4 |
Margin of the QR code in modules. |
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 July 13, 2018
- Use new API customElements.define
- Support for a custom element name
- Keep support for document.register() in /qr-code.es5.js
- v0.1.9 December 9, 2016
- Updated docs
- v0.1.7 April 11, 2015
- Support for SVG
- v0.1.6 April 10, 2015
- Default attributes
- qr.js removed and used as a dependency
- Available in NPM
- v0.1.1 March 31, 2015
- Framework-agnostic webcomponent (no use of Polymer)
- Available in Bower
- v0.0.1 September 18, 2013
- Started project using boilerplate-element
educastellano