ngx-qrcode2/fesm2015/ngx-qrcode2.js

An Angular component for generating QRCodes

import { __decorate } from 'tslib';
import { Renderer2, Input, ViewChild, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
import QRCode from 'qrcode';

var NgxQrcodeElementTypes;
(function (NgxQrcodeElementTypes) {
    NgxQrcodeElementTypes["URL"] = "url";
    NgxQrcodeElementTypes["IMG"] = "img";
    NgxQrcodeElementTypes["CANVAS"] = "canvas";
})(NgxQrcodeElementTypes || (NgxQrcodeElementTypes = {}));
var NgxQrcodeErrorCorrectionLevels;
(function (NgxQrcodeErrorCorrectionLevels) {
    NgxQrcodeErrorCorrectionLevels["LOW"] = "L";
    NgxQrcodeErrorCorrectionLevels["MEDIUM"] = "M";
    NgxQrcodeErrorCorrectionLevels["QUARTILE"] = "Q";
    NgxQrcodeErrorCorrectionLevels["HIGH"] = "H";
})(NgxQrcodeErrorCorrectionLevels || (NgxQrcodeErrorCorrectionLevels = {}));

const DEFAULT_VALUES = {
    elementType: NgxQrcodeElementTypes.URL,
    cssClass: 'qrcode',
    value: 'https://www.techiediaries.com',
    version: '',
    errorCorrectionLevel: NgxQrcodeErrorCorrectionLevels.MEDIUM,
    margin: 4,
    scale: 4,
    width: 10,
    colorDark: '#000',
    colorLight: '#FFF'
};

let QrcodeComponent = class QrcodeComponent {
    constructor(renderer) {
        this.renderer = renderer;
        this.elementType = DEFAULT_VALUES.elementType;
        this.cssClass = DEFAULT_VALUES.cssClass;
        this.value = DEFAULT_VALUES.value;
        this.version = DEFAULT_VALUES.version;
        this.errorCorrectionLevel = DEFAULT_VALUES.errorCorrectionLevel;
        this.margin = DEFAULT_VALUES.margin;
        this.scale = DEFAULT_VALUES.scale;
        this.width = DEFAULT_VALUES.width;
        this.colorDark = DEFAULT_VALUES.colorDark;
        this.colorLight = DEFAULT_VALUES.colorLight;
    }
    ngOnChanges() {
        this.createQRCode();
    }
    createQRCode() {
        if (!this.value) {
            return;
        }
        let element;
        switch (this.elementType) {
            case NgxQrcodeElementTypes.CANVAS:
                element = this.renderer.createElement('canvas');
                this.toCanvas(element).then(() => {
                    this.renderElement(element);
                }).catch(e => {
                    this.removeElementChildren();
                    console.error(e);
                });
                break;
            default:
                element = this.renderer.createElement('img');
                this.toDataURL().then((src) => {
                    element.setAttribute('src', src);
                    if (this.alt) {
                        element.setAttribute('alt', this.alt);
                    }
                    this.renderElement(element);
                }).catch(e => {
                    this.removeElementChildren();
                    console.error(e);
                });
        }
    }
    toDataURL() {
        return QRCode.toDataURL(this.value, {
            version: this.version,
            errorCorrectionLevel: this.errorCorrectionLevel,
            margin: this.margin,
            scale: this.scale,
            width: this.width,
            color: {
                dark: this.colorDark,
                light: this.colorLight
            }
        });
    }
    toCanvas(canvas) {
        return QRCode.toCanvas(canvas, this.value, {
            version: this.version,
            errorCorrectionLevel: this.errorCorrectionLevel,
            margin: this.margin,
            scale: this.scale,
            width: this.width,
            color: {
                dark: this.colorDark,
                light: this.colorLight
            }
        });
    }
    renderElement(element) {
        this.removeElementChildren();
        this.renderer.appendChild(this.qrcElement.nativeElement, element);
    }
    removeElementChildren() {
        for (const node of this.qrcElement.nativeElement.childNodes) {
            this.renderer.removeChild(this.qrcElement.nativeElement, node);
        }
    }
};
QrcodeComponent.ctorParameters = () => [
    { type: Renderer2 }
];
__decorate([
    Input()
], QrcodeComponent.prototype, "elementType", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "cssClass", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "alt", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "value", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "version", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "errorCorrectionLevel", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "margin", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "scale", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "width", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "colorDark", void 0);
__decorate([
    Input()
], QrcodeComponent.prototype, "colorLight", void 0);
__decorate([
    ViewChild('qrcElement')
], QrcodeComponent.prototype, "qrcElement", void 0);
QrcodeComponent = __decorate([
    Component({
        selector: 'ngx-qrcode',
        template: `
    <div #qrcElement [class]="cssClass"></div>`,
        changeDetection: ChangeDetectionStrategy.OnPush
    })
], QrcodeComponent);

let NgxQRCodeModule = class NgxQRCodeModule {
};
NgxQRCodeModule = __decorate([
    NgModule({
        declarations: [QrcodeComponent],
        exports: [QrcodeComponent]
    })
], NgxQRCodeModule);

/*
 * Public API Surface of ngx-qrcode
 */

/**
 * Generated bundle index. Do not edit.
 */

export { NgxQRCodeModule, NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels, QrcodeComponent };
//# sourceMappingURL=ngx-qrcode2.js.map