@jonyadamit/ngx-qrcode-ivy/fesm2022/jonyadamit-ngx-qrcode-ivy.mjs

An Angular component for generating QRCodes

import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, Input, ViewChild, 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'
};

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);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: QrcodeComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: QrcodeComponent, selector: "ngx-qrcode", inputs: { elementType: "elementType", cssClass: "cssClass", alt: "alt", value: "value", version: "version", errorCorrectionLevel: "errorCorrectionLevel", margin: "margin", scale: "scale", width: "width", colorDark: "colorDark", colorLight: "colorLight" }, viewQueries: [{ propertyName: "qrcElement", first: true, predicate: ["qrcElement"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `<div #qrcElement [class]="cssClass"></div>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: QrcodeComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'ngx-qrcode',
                    template: `<div #qrcElement [class]="cssClass"></div>`,
                    changeDetection: ChangeDetectionStrategy.OnPush
                }]
        }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { elementType: [{
                type: Input
            }], cssClass: [{
                type: Input
            }], alt: [{
                type: Input
            }], value: [{
                type: Input
            }], version: [{
                type: Input
            }], errorCorrectionLevel: [{
                type: Input
            }], margin: [{
                type: Input
            }], scale: [{
                type: Input
            }], width: [{
                type: Input
            }], colorDark: [{
                type: Input
            }], colorLight: [{
                type: Input
            }], qrcElement: [{
                type: ViewChild,
                args: ['qrcElement']
            }] } });

class NgxQRCodeModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NgxQRCodeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: NgxQRCodeModule, declarations: [QrcodeComponent], exports: [QrcodeComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NgxQRCodeModule }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: NgxQRCodeModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [QrcodeComponent],
                    exports: [QrcodeComponent]
                }]
        }] });

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

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

export { NgxQRCodeModule, NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels, QrcodeComponent };
//# sourceMappingURL=jonyadamit-ngx-qrcode-ivy.mjs.map