ngwr 6.0.0 → 7.0.0

package/fesm2022/ngwr-qr.mjs

@@ -1,8 +1,7 @@
 import { isPlatformBrowser } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, PLATFORM_ID, ElementRef, signal, numberAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, HostBinding, ViewChild, Input } from '@angular/core';
-import { WrAbstractBase } from 'ngwr/cdk';
-import { WrIconService } from 'ngwr/icon';
+import { input, viewChild, inject, PLATFORM_ID, effect, ViewEncapsulation, Component } from '@angular/core';
+import { numAttr } from 'ngwr/utils';
 
 /* eslint-disable */
 // @ts-nocheck
@@ -49,6 +48,8 @@ var qrcodegen;
      * (Note that all ways require supplying the desired error correction level.)
      */
     class QrCode {
+        version;
+        errorCorrectionLevel;
         /*-- Static factory functions (high level) --*/
         // Returns a QR Code representing the given Unicode text string at the given error correction level.
         // As a conservative upper bound, this function is guaranteed to succeed for strings that have 738 or fewer
@@ -128,6 +129,19 @@ var qrcodegen;
             // Create the QR Code object
             return new QrCode(version, ecl, dataCodewords, mask);
         }
+        /*-- Fields --*/
+        // The width and height of this QR Code, measured in modules, between
+        // 21 and 177 (inclusive). This is equal to version * 4 + 17.
+        size;
+        // The index of the mask pattern used in this QR Code, which is between 0 and 7 (inclusive).
+        // Even if a QR Code is created with automatic masking requested (mask = -1),
+        // the resulting object still has a mask value between 0 and 7.
+        mask;
+        // The modules of this QR Code (false = light, true = dark).
+        // Immutable after constructor finishes. Accessed through getModule().
+        modules = [];
+        // Indicates function modules that are not subjected to masking. Discarded when constructor finishes.
+        isFunction = [];
         /*-- Constructor (low level) and fields --*/
         // Creates a new QR Code with the given version number,
         // error correction level, data codeword bytes, and mask number.
@@ -141,11 +155,6 @@ var qrcodegen;
         errorCorrectionLevel, dataCodewords, msk) {
             this.version = version;
             this.errorCorrectionLevel = errorCorrectionLevel;
-            // The modules of this QR Code (false = light, true = dark).
-            // Immutable after constructor finishes. Accessed through getModule().
-            this.modules = [];
-            // Indicates function modules that are not subjected to masking. Discarded when constructor finishes.
-            this.isFunction = [];
             // Check scalar arguments
             if (version < QrCode.MIN_VERSION || version > QrCode.MAX_VERSION)
                 throw new RangeError('Version value out of range');
@@ -588,15 +597,15 @@ var qrcodegen;
         }
         /*-- Constants and tables --*/
         // The minimum version number supported in the QR Code Model 2 standard.
-        static { this.MIN_VERSION = 1; }
+        static MIN_VERSION = 1;
         // The maximum version number supported in the QR Code Model 2 standard.
-        static { this.MAX_VERSION = 40; }
+        static MAX_VERSION = 40;
         // For use in getPenaltyScore(), when evaluating which mask is best.
-        static { this.PENALTY_N1 = 3; }
-        static { this.PENALTY_N2 = 3; }
-        static { this.PENALTY_N3 = 40; }
-        static { this.PENALTY_N4 = 10; }
-        static { this.ECC_CODEWORDS_PER_BLOCK = [
+        static PENALTY_N1 = 3;
+        static PENALTY_N2 = 3;
+        static PENALTY_N3 = 40;
+        static PENALTY_N4 = 10;
+        static ECC_CODEWORDS_PER_BLOCK = [
             // Version: (note that index 0 is for padding, and is set to an illegal value)
             //0,  1,  2,  3,  4,  5,  6,  7,  8,  9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40    Error correction level
             [
@@ -615,8 +624,8 @@ var qrcodegen;
                 -1, 17, 28, 22, 16, 22, 28, 26, 26, 24, 28, 24, 28, 22, 24, 24, 30, 28, 28, 26, 28, 30, 24, 30, 30, 30, 30, 30,
                 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30,
             ], // High
-        ]; }
-        static { this.NUM_ERROR_CORRECTION_BLOCKS = [
+        ];
+        static NUM_ERROR_CORRECTION_BLOCKS = [
             // Version: (note that index 0 is for padding, and is set to an illegal value)
             //0, 1, 2, 3, 4, 5, 6, 7, 8, 9,10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40    Error correction level
             [
@@ -635,7 +644,7 @@ var qrcodegen;
                 -1, 1, 1, 2, 4, 4, 4, 5, 6, 8, 8, 11, 11, 16, 16, 18, 16, 19, 21, 25, 25, 25, 34, 30, 32, 35, 37, 40, 42, 45,
                 48, 51, 54, 57, 60, 63, 66, 70, 74, 77, 81,
             ], // High
-        ]; }
+        ];
     }
     qrcodegen.QrCode = QrCode;
     // Appends the given number of low-order bits of the given value
@@ -669,6 +678,9 @@ var qrcodegen;
      * Any segment longer than this is meaningless for the purpose of generating QR Codes.
      */
     class QrSegment {
+        mode;
+        numChars;
+        bitData;
         /*-- Static factory functions (mid level) --*/
         // Returns a segment representing the given binary data encoded in
         // byte mode. All input byte arrays are acceptable. Any text string
@@ -808,28 +820,30 @@ var qrcodegen;
         }
         /*-- Constants --*/
         // Describes precisely all strings that are encodable in numeric mode.
-        static { this.NUMERIC_REGEX = /^[0-9]*$/; }
+        static NUMERIC_REGEX = /^[0-9]*$/;
         // Describes precisely all strings that are encodable in alphanumeric mode.
-        static { this.ALPHANUMERIC_REGEX = /^[A-Z0-9 $%*+.\/:-]*$/; }
+        static ALPHANUMERIC_REGEX = /^[A-Z0-9 $%*+.\/:-]*$/;
         // The set of all legal characters in alphanumeric mode,
         // where each character value maps to the index in the string.
-        static { this.ALPHANUMERIC_CHARSET = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:'; }
+        static ALPHANUMERIC_CHARSET = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:';
     }
     qrcodegen.QrSegment = QrSegment;
 })(qrcodegen || (qrcodegen = {}));
 /*---- Public helper enumeration ----*/
 (function (qrcodegen) {
-    var QrCode;
+    /*
+     * The error correction level in a QR Code symbol. Immutable.
+     */
+    let QrCode;
     (function (QrCode) {
-        /*
-         * The error correction level in a QR Code symbol. Immutable.
-         */
         class Ecc {
+            ordinal;
+            formatBits;
             /*-- Constants --*/
-            static { this.LOW = new Ecc(0, 1); } // The QR Code can tolerate about  7% erroneous codewords
-            static { this.MEDIUM = new Ecc(1, 0); } // The QR Code can tolerate about 15% erroneous codewords
-            static { this.QUARTILE = new Ecc(2, 3); } // The QR Code can tolerate about 25% erroneous codewords
-            static { this.HIGH = new Ecc(3, 2); } // The QR Code can tolerate about 30% erroneous codewords
+            static LOW = new Ecc(0, 1); // The QR Code can tolerate about  7% erroneous codewords
+            static MEDIUM = new Ecc(1, 0); // The QR Code can tolerate about 15% erroneous codewords
+            static QUARTILE = new Ecc(2, 3); // The QR Code can tolerate about 25% erroneous codewords
+            static HIGH = new Ecc(3, 2); // The QR Code can tolerate about 30% erroneous codewords
             /*-- Constructor and fields --*/
             constructor(
             // In the range 0 to 3 (unsigned 2-bit integer).
@@ -842,21 +856,20 @@ var qrcodegen;
         }
         QrCode.Ecc = Ecc;
     })(QrCode = qrcodegen.QrCode || (qrcodegen.QrCode = {}));
-})(qrcodegen || (qrcodegen = {}));
-/*---- Public helper enumeration ----*/
-(function (qrcodegen) {
-    var QrSegment;
+    /*
+     * Describes how a segment's data bits are interpreted. Immutable.
+     */
+    let QrSegment;
     (function (QrSegment) {
-        /*
-         * Describes how a segment's data bits are interpreted. Immutable.
-         */
         class Mode {
+            modeBits;
+            numBitsCharCount;
             /*-- Constants --*/
-            static { this.NUMERIC = new Mode(0x1, [10, 12, 14]); }
-            static { this.ALPHANUMERIC = new Mode(0x2, [9, 11, 13]); }
-            static { this.BYTE = new Mode(0x4, [8, 16, 16]); }
-            static { this.KANJI = new Mode(0x8, [8, 10, 12]); }
-            static { this.ECI = new Mode(0x7, [0, 0, 0]); }
+            static NUMERIC = new Mode(0x1, [10, 12, 14]);
+            static ALPHANUMERIC = new Mode(0x2, [9, 11, 13]);
+            static BYTE = new Mode(0x4, [8, 16, 16]);
+            static KANJI = new Mode(0x8, [8, 10, 12]);
+            static ECI = new Mode(0x7, [0, 0, 0]);
             /*-- Constructor and fields --*/
             constructor(
             // The mode indicator bits, which is a uint4 value (range 0 to 15).
@@ -878,88 +891,73 @@ var qrcodegen;
 })(qrcodegen || (qrcodegen = {}));
 var qrcodegen$1 = qrcodegen;
 
-const DEFAULT_SIZE = 160;
-const DEFAULT_SCALE = 10;
-const DEFAULT_PADDING = 10;
-const DEFAULT_COLOR = '#000000';
-const DEFAULT_BACKGROUND_COLOR = '#FFFFFF';
-const DEFAULT_ICONSIZE = 40;
-const DEFAULT_LEVEL = 'M';
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
 const ERROR_LEVEL_MAP = {
     L: qrcodegen$1.QrCode.Ecc.LOW,
     M: qrcodegen$1.QrCode.Ecc.MEDIUM,
     Q: qrcodegen$1.QrCode.Ecc.QUARTILE,
     H: qrcodegen$1.QrCode.Ecc.HIGH,
 };
-const plotQRCodeData = (value, level = DEFAULT_LEVEL) => {
-    if (!value) {
-        return null;
-    }
-    return qrcodegen$1.QrCode.encodeText(value, ERROR_LEVEL_MAP[level]);
-};
-function drawCanvas(canvas, value, size = DEFAULT_SIZE, scale = DEFAULT_SCALE, padding = DEFAULT_PADDING, color = DEFAULT_COLOR, backgroundColor = DEFAULT_BACKGROUND_COLOR, iconSize = DEFAULT_ICONSIZE, icon) {
-    const ctx = canvas.getContext('2d');
-    const formattedPadding = formatPadding(padding);
-    canvas.style.width = `${size}px`;
-    canvas.style.height = `${size}px`;
-    if (!value) {
-        ctx.fillStyle = 'rgba(0, 0, 0, 0)';
-        ctx.fillRect(0, 0, canvas.width, canvas.height);
-        return;
-    }
-    canvas.width = value.size * scale + formattedPadding[1] + formattedPadding[3];
-    canvas.height = value.size * scale + formattedPadding[0] + formattedPadding[2];
-    if (!icon) {
-        drawCanvasBackground(ctx, canvas.width, canvas.height, scale, backgroundColor);
-        drawCanvasColor(ctx, value, scale, formattedPadding, backgroundColor, color);
-    }
-    else {
-        const iconImg = new Image();
-        iconImg.src = icon;
-        iconImg.crossOrigin = 'anonymous';
-        iconImg.width = iconSize * (canvas.width / size);
-        iconImg.height = iconSize * (canvas.width / size);
-        iconImg.onload = () => {
-            drawCanvasBackground(ctx, canvas.width, canvas.height, scale, backgroundColor);
-            drawCanvasColor(ctx, value, scale, formattedPadding, backgroundColor, color);
-            const iconCoordinate = canvas.width / 2 - (iconSize * (canvas.width / size)) / 2;
-            ctx.fillStyle = backgroundColor;
-            ctx.fillRect(iconCoordinate, iconCoordinate, iconSize * (canvas.width / size), iconSize * (canvas.width / size));
-            ctx.drawImage(iconImg, iconCoordinate + 10, iconCoordinate + 10, iconSize * (canvas.width / size) - 20, iconSize * (canvas.width / size) - 20);
-        };
-        iconImg.onerror = () => {
-            drawCanvasBackground(ctx, canvas.width, canvas.height, scale, backgroundColor);
-            drawCanvasColor(ctx, value, scale, formattedPadding, backgroundColor, color);
-        };
-    }
+const SCALE = 10;
+function drawBackground(ctx, width, height, bgColor) {
+    ctx.fillStyle = bgColor;
+    ctx.fillRect(0, 0, width, height);
 }
-function drawCanvasColor(ctx, value, scale, padding, backgroundColor, color) {
-    for (let y = 0; y < value.size; y++) {
-        for (let x = 0; x < value.size; x++) {
-            ctx.fillStyle = value.getModule(x, y) ? color : backgroundColor;
-            ctx.fillRect(padding[3] + x * scale, padding[0] + y * scale, scale, scale);
+function drawModules(ctx, code, padding, color) {
+    ctx.fillStyle = color;
+    for (let y = 0; y < code.size; y++) {
+        for (let x = 0; x < code.size; x++) {
+            if (code.getModule(x, y)) {
+                ctx.fillRect(padding + x * SCALE, padding + y * SCALE, SCALE, SCALE);
+            }
         }
     }
 }
-function drawCanvasBackground(ctx, width, height, scale, backgroundColor) {
-    for (let y = 0; y < height; y++) {
-        for (let x = 0; x < width; x++) {
-            ctx.fillStyle = backgroundColor;
-            ctx.fillRect(x * scale, y * scale, scale, scale);
-        }
-    }
+function overlayIcon(canvas, ctx, options) {
+    const iconImg = new Image();
+    iconImg.crossOrigin = 'anonymous';
+    iconImg.src = options.iconUrl;
+    const ratio = canvas.width / options.size;
+    const iconPx = (options.iconSize ?? 42) * ratio;
+    const coord = canvas.width / 2 - iconPx / 2;
+    iconImg.onload = () => {
+        ctx.fillStyle = options.bgColor;
+        ctx.fillRect(coord, coord, iconPx, iconPx);
+        ctx.drawImage(iconImg, coord + 10, coord + 10, iconPx - 20, iconPx - 20);
+    };
 }
-function formatPadding(padding) {
-    if (Array.isArray(padding)) {
-        // Build an array of 4 elements and repeat values from padding as necessary to set the value of the array
-        return Array(4)
-            .fill(0)
-            .map((_, index) => padding[index % padding.length]);
+function draw(canvas, options) {
+    const ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    canvas.style.width = `${options.size}px`;
+    canvas.style.height = `${options.size}px`;
+    if (!options.value) {
+        ctx.fillStyle = options.bgColor;
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+        return;
     }
-    else {
-        return [padding, padding, padding, padding];
+    const code = qrcodegen$1.QrCode.encodeText(options.value, ERROR_LEVEL_MAP[options.level]);
+    const padding = options.padding;
+    canvas.width = code.size * SCALE + padding * 2;
+    canvas.height = code.size * SCALE + padding * 2;
+    drawBackground(ctx, canvas.width, canvas.height, options.bgColor);
+    drawModules(ctx, code, padding, options.color);
+    if (options.iconUrl) {
+        overlayIcon(canvas, ctx, options);
     }
 }
+/**
+ * Renders a QR code (with optional center icon) onto the given canvas.
+ *
+ * @internal
+ */
+const drawQrCode = draw;
 
 /**
  * @license
@@ -967,94 +965,74 @@ function formatPadding(padding) {
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
  */
-class WrQrComponent extends WrAbstractBase {
+/**
+ * Renders a QR code on a `<canvas>`.
+ *
+ * @example
+ * ```html
+ * <wr-qr value="https://ngwr.dev" [size]="200" level="H" />
+ * <wr-qr value="..." iconUrl="/logo.png" [iconSize]="48" level="H" />
+ * ```
+ *
+ * @see https://ngwr.dev/components/qrcode
+ */
+class WrQr {
+    /** Text or URL to encode. Required. */
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Error correction level. Use `'H'` if you overlay an icon. @default 'M' */
+    level = input('M', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
+    /** Side length of the rendered canvas, in pixels. @default 160 */
+    size = input(160, { ...(ngDevMode ? { debugName: "size" } : /* istanbul ignore next */ {}), transform: numAttr(160) });
+    /** Outer quiet-zone padding in pixels. @default 10 */
+    padding = input(10, { ...(ngDevMode ? { debugName: "padding" } : /* istanbul ignore next */ {}), transform: numAttr(10) });
+    /** Module (dot) color. @default '#000000' */
+    color = input('#000000', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+    /** Background color of the canvas + host. @default '#ffffff' */
+    bgColor = input('#ffffff', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "bgColor" }] : /* istanbul ignore next */ []));
+    /** Optional image URL or data URL to overlay in the center. */
+    iconUrl = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "iconUrl" }] : /* istanbul ignore next */ []));
+    /** Center icon size in logical pixels. @default 42 */
+    iconSize = input(42, { ...(ngDevMode ? { debugName: "iconSize" } : /* istanbul ignore next */ {}), transform: numAttr(42) });
+    canvas = viewChild('canvas', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canvas" }] : /* istanbul ignore next */ []));
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
     constructor() {
-        super(...arguments);
-        this.class = 'wr-qrcode';
-        this.level = 'M';
-        this.padding = 10;
-        this.color = '#000000';
-        this.bgColor = '#ffffff';
-        this.size = 150;
-        this.icon = null;
-        this.iconSize = 42;
-        this.pid = inject(PLATFORM_ID);
-        this.elRef = inject(ElementRef);
-        this.wrIconService = inject(WrIconService);
-        this.isBrowser = signal(true);
-    }
-    ngOnChanges(changes) {
-        const { value, level, padding, color, bgColor, size, icon, iconSize } = changes;
-        if ((value || level || padding || color || bgColor || size || icon || iconSize) && this.canvas) {
-            this.drawCanvas();
-        }
-        if (bgColor) {
-            this.setElBg();
-        }
-    }
-    ngOnInit() {
-        this.isBrowser.set(isPlatformBrowser(this.pid));
-        this.setElBg();
-    }
-    ngAfterViewInit() {
-        this.drawCanvas();
-    }
-    setElBg() {
-        this.elRef.nativeElement.style.backgroundColor = this.bgColor;
-    }
-    drawCanvas() {
-        if (this.canvas) {
-            let icon = '';
-            if (this.icon && this.wrIconService.registry.has(this.icon)) {
-                const iconData = this.wrIconService.registry.get(this.icon) || '';
-                icon = `data:image/svg+xml;base64,${btoa(iconData)}`;
-            }
-            drawCanvas(this.canvas.nativeElement, plotQRCodeData(this.value, this.level), this.size, 10, this.padding, this.color, this.bgColor, this.iconSize, icon);
-        }
+        effect(() => {
+            // Read every input to register reactive deps
+            const opts = {
+                value: this.value(),
+                size: this.size(),
+                padding: this.padding(),
+                color: this.color(),
+                bgColor: this.bgColor(),
+                level: this.level(),
+                iconUrl: this.iconUrl(),
+                iconSize: this.iconSize(),
+            };
+            if (!this.isBrowser)
+                return;
+            const el = this.canvas()?.nativeElement;
+            if (!el)
+                return;
+            drawQrCode(el, opts);
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: WrQrComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.5", type: WrQrComponent, isStandalone: true, selector: "wr-qr", inputs: { value: "value", level: "level", padding: ["padding", "padding", numberAttribute], color: "color", bgColor: "bgColor", size: ["size", "size", numberAttribute], icon: "icon", iconSize: ["iconSize", "iconSize", numberAttribute] }, host: { properties: { "class": "this.class" } }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (isBrowser()) {\n  <canvas #canvas></canvas>\n}\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrQr, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrQr, isStandalone: true, selector: "wr-qr", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, iconUrl: { classPropertyName: "iconUrl", publicName: "iconUrl", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.background": "bgColor()" }, classAttribute: "wr-qr" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (isBrowser) {\n  <canvas #canvas></canvas>\n}\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: WrQrComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrQr, decorators: [{
             type: Component,
-            args: [{ selector: 'wr-qr', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (isBrowser()) {\n  <canvas #canvas></canvas>\n}\n" }]
-        }], propDecorators: { class: [{
-                type: HostBinding
-            }], canvas: [{
-                type: ViewChild,
-                args: ['canvas', { static: false }]
-            }], value: [{
-                type: Input,
-                args: [{ required: true }]
-            }], level: [{
-                type: Input
-            }], padding: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], color: [{
-                type: Input
-            }], bgColor: [{
-                type: Input
-            }], size: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }], icon: [{
-                type: Input
-            }], iconSize: [{
-                type: Input,
-                args: [{ transform: numberAttribute }]
-            }] } });
-
-/**
- * @license
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
- */
+            args: [{ selector: 'wr-qr', encapsulation: ViewEncapsulation.None, host: { class: 'wr-qr', '[style.background]': 'bgColor()' }, template: "@if (isBrowser) {\n  <canvas #canvas></canvas>\n}\n" }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], iconUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconUrl", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], canvas: [{ type: i0.ViewChild, args: ['canvas', { isSignal: true }] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { WrQrComponent };
+export { WrQr };
 //# sourceMappingURL=ngwr-qr.mjs.map