@liquid-js/qr-code-styling 1.6.0-rc.4 → 1.6.0

package/lib/qr-code-styling-node.js

@@ -1,1287 +1,1279 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var fileType = require('file-type');
 var jsdom = require('jsdom');
 var fetch = require('node-fetch');
 var sharp = require('sharp');
 var qrcode = require('qrcode-generator');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var fetch__default = /*#__PURE__*/_interopDefaultLegacy(fetch);
-var sharp__default = /*#__PURE__*/_interopDefaultLegacy(sharp);
-var qrcode__default = /*#__PURE__*/_interopDefaultLegacy(qrcode);
-
-exports.DotType = void 0;
-(function (DotType) {
-    DotType["dots"] = "dots";
-    DotType["rounded"] = "rounded";
-    DotType["classy"] = "classy";
-    DotType["classyRounded"] = "classy-rounded";
-    DotType["square"] = "square";
-    DotType["extraRounded"] = "extra-rounded";
-})(exports.DotType || (exports.DotType = {}));
-exports.CornerDotType = void 0;
-(function (CornerDotType) {
-    CornerDotType["dot"] = "dot";
-    CornerDotType["square"] = "square";
-})(exports.CornerDotType || (exports.CornerDotType = {}));
-exports.CornerSquareType = void 0;
-(function (CornerSquareType) {
-    CornerSquareType["dot"] = "dot";
-    CornerSquareType["square"] = "square";
-    CornerSquareType["extraRounded"] = "extra-rounded";
-})(exports.CornerSquareType || (exports.CornerSquareType = {}));
-exports.GradientType = void 0;
-(function (GradientType) {
-    GradientType["radial"] = "radial";
-    GradientType["linear"] = "linear";
-})(exports.GradientType || (exports.GradientType = {}));
-exports.ShapeType = void 0;
-(function (ShapeType) {
-    ShapeType["square"] = "square";
-    ShapeType["circle"] = "circle";
-})(exports.ShapeType || (exports.ShapeType = {}));
-const TypeNumber = Array(41)
-    .fill(0)
-    .map((_, i) => i);
-exports.ErrorCorrectionLevel = void 0;
-(function (ErrorCorrectionLevel) {
-    ErrorCorrectionLevel["L"] = "L";
-    ErrorCorrectionLevel["M"] = "M";
-    ErrorCorrectionLevel["Q"] = "Q";
-    ErrorCorrectionLevel["H"] = "H";
-})(exports.ErrorCorrectionLevel || (exports.ErrorCorrectionLevel = {}));
-exports.Mode = void 0;
-(function (Mode) {
-    Mode["numeric"] = "Numeric";
-    Mode["alphanumeric"] = "Alphanumeric";
-    Mode["byte"] = "Byte";
-    Mode["kanji"] = "Kanji";
-})(exports.Mode || (exports.Mode = {}));
-exports.FileExtension = void 0;
-(function (FileExtension) {
-    FileExtension["svg"] = "svg";
-    FileExtension["png"] = "png";
-    FileExtension["jpeg"] = "jpeg";
-    FileExtension["webp"] = "webp";
+exports.DotType = void 0;
+(function (DotType) {
+    DotType["dots"] = "dots";
+    DotType["rounded"] = "rounded";
+    DotType["classy"] = "classy";
+    DotType["classyRounded"] = "classy-rounded";
+    DotType["square"] = "square";
+    DotType["extraRounded"] = "extra-rounded";
+})(exports.DotType || (exports.DotType = {}));
+exports.CornerDotType = void 0;
+(function (CornerDotType) {
+    CornerDotType["dot"] = "dot";
+    CornerDotType["square"] = "square";
+})(exports.CornerDotType || (exports.CornerDotType = {}));
+exports.CornerSquareType = void 0;
+(function (CornerSquareType) {
+    CornerSquareType["dot"] = "dot";
+    CornerSquareType["square"] = "square";
+    CornerSquareType["extraRounded"] = "extra-rounded";
+})(exports.CornerSquareType || (exports.CornerSquareType = {}));
+exports.GradientType = void 0;
+(function (GradientType) {
+    GradientType["radial"] = "radial";
+    GradientType["linear"] = "linear";
+})(exports.GradientType || (exports.GradientType = {}));
+exports.ShapeType = void 0;
+(function (ShapeType) {
+    ShapeType["square"] = "square";
+    ShapeType["circle"] = "circle";
+})(exports.ShapeType || (exports.ShapeType = {}));
+const TypeNumber = Array(41)
+    .fill(0)
+    .map((_, i) => i);
+exports.ErrorCorrectionLevel = void 0;
+(function (ErrorCorrectionLevel) {
+    ErrorCorrectionLevel["L"] = "L";
+    ErrorCorrectionLevel["M"] = "M";
+    ErrorCorrectionLevel["Q"] = "Q";
+    ErrorCorrectionLevel["H"] = "H";
+})(exports.ErrorCorrectionLevel || (exports.ErrorCorrectionLevel = {}));
+exports.Mode = void 0;
+(function (Mode) {
+    Mode["numeric"] = "Numeric";
+    Mode["alphanumeric"] = "Alphanumeric";
+    Mode["byte"] = "Byte";
+    Mode["kanji"] = "Kanji";
+})(exports.Mode || (exports.Mode = {}));
+exports.FileExtension = void 0;
+(function (FileExtension) {
+    FileExtension["svg"] = "svg";
+    FileExtension["png"] = "png";
+    FileExtension["jpeg"] = "jpeg";
+    FileExtension["webp"] = "webp";
 })(exports.FileExtension || (exports.FileExtension = {}));
 
-const ErrorCorrectionPercents = {
-    [exports.ErrorCorrectionLevel.L]: 0.07,
-    [exports.ErrorCorrectionLevel.M]: 0.15,
-    [exports.ErrorCorrectionLevel.Q]: 0.25,
-    [exports.ErrorCorrectionLevel.H]: 0.3
+const ErrorCorrectionPercents = {
+    [exports.ErrorCorrectionLevel.L]: 0.07,
+    [exports.ErrorCorrectionLevel.M]: 0.15,
+    [exports.ErrorCorrectionLevel.Q]: 0.25,
+    [exports.ErrorCorrectionLevel.H]: 0.3
 };
 
-function getMode(data) {
-    switch (true) {
-        case /^[0-9]*$/.test(data):
-            return exports.Mode.numeric;
-        case /^[0-9A-Z $%*+\-./:]*$/.test(data):
-            return exports.Mode.alphanumeric;
-        default:
-            return exports.Mode.byte;
-    }
+function getMode(data) {
+    switch (true) {
+        case /^[0-9]*$/.test(data):
+            return exports.Mode.numeric;
+        case /^[0-9A-Z $%*+\-./:]*$/.test(data):
+            return exports.Mode.alphanumeric;
+        default:
+            return exports.Mode.byte;
+    }
 }
 
-const isObject = (obj) => !!obj && typeof obj === "object" && !Array.isArray(obj);
-function mergeDeep(target, ...sources) {
-    if (!sources.length)
-        return target;
-    const source = sources.shift();
-    if (source === undefined || !isObject(target) || !isObject(source))
-        return target;
-    target = { ...target };
-    Object.keys(source).forEach((key) => {
-        const targetValue = target[key];
-        const sourceValue = source[key];
-        if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
-            target[key] = sourceValue;
-        }
-        else if (isObject(targetValue) && isObject(sourceValue)) {
-            target[key] = mergeDeep(Object.assign({}, targetValue), sourceValue);
-        }
-        else {
-            target[key] = sourceValue;
-        }
-    });
-    return mergeDeep(target, ...sources);
+const isObject = (obj) => !!obj && typeof obj === "object" && !Array.isArray(obj);
+function mergeDeep(target, ...sources) {
+    if (!sources.length)
+        return target;
+    const source = sources.shift();
+    if (source === undefined || !isObject(target) || !isObject(source))
+        return target;
+    target = { ...target };
+    Object.keys(source).forEach((key) => {
+        const targetValue = target[key];
+        const sourceValue = source[key];
+        if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
+            target[key] = sourceValue;
+        }
+        else if (isObject(targetValue) && isObject(sourceValue)) {
+            target[key] = mergeDeep(Object.assign({}, targetValue), sourceValue);
+        }
+        else {
+            target[key] = sourceValue;
+        }
+    });
+    return mergeDeep(target, ...sources);
 }
 
-function sanitizeGradient(gradient) {
-    const newGradient = { ...gradient };
-    if (!newGradient.colorStops || !newGradient.colorStops.length) {
-        throw "Field 'colorStops' is required in gradient";
-    }
-    if (newGradient.rotation) {
-        newGradient.rotation = Number(newGradient.rotation);
-    }
-    else {
-        newGradient.rotation = 0;
-    }
-    newGradient.colorStops = newGradient.colorStops.map((colorStop) => ({
-        ...colorStop,
-        offset: Number(colorStop.offset)
-    }));
-    return newGradient;
-}
-function sanitizeOptions(options) {
-    const newOptions = { ...options };
-    newOptions.imageOptions = {
-        ...newOptions.imageOptions,
-        hideBackgroundDots: Boolean(newOptions.imageOptions.hideBackgroundDots),
-        imageSize: Math.min(1, Number(newOptions.imageOptions.imageSize)) || 1,
-        margin: Number(newOptions.imageOptions.margin)
-    };
-    newOptions.dotsOptions = {
-        ...newOptions.dotsOptions
-    };
-    if (newOptions.dotsOptions.gradient) {
-        newOptions.dotsOptions.gradient = sanitizeGradient(newOptions.dotsOptions.gradient);
-    }
-    if (newOptions.cornersSquareOptions) {
-        newOptions.cornersSquareOptions = {
-            ...newOptions.cornersSquareOptions
-        };
-        if (newOptions.cornersSquareOptions.gradient) {
-            newOptions.cornersSquareOptions.gradient = sanitizeGradient(newOptions.cornersSquareOptions.gradient);
-        }
-    }
-    if (newOptions.cornersDotOptions) {
-        newOptions.cornersDotOptions = {
-            ...newOptions.cornersDotOptions
-        };
-        if (newOptions.cornersDotOptions.gradient) {
-            newOptions.cornersDotOptions.gradient = sanitizeGradient(newOptions.cornersDotOptions.gradient);
-        }
-    }
-    if (newOptions.backgroundOptions) {
-        newOptions.backgroundOptions = {
-            ...newOptions.backgroundOptions
-        };
-        if (newOptions.backgroundOptions.gradient) {
-            newOptions.backgroundOptions.gradient = sanitizeGradient(newOptions.backgroundOptions.gradient);
-        }
-    }
-    if (!newOptions.document)
-        newOptions.document = document;
-    return newOptions;
+function sanitizeGradient(gradient) {
+    const newGradient = { ...gradient };
+    if (!newGradient.colorStops || !newGradient.colorStops.length) {
+        throw "Field 'colorStops' is required in gradient";
+    }
+    if (newGradient.rotation) {
+        newGradient.rotation = Number(newGradient.rotation);
+    }
+    else {
+        newGradient.rotation = 0;
+    }
+    newGradient.colorStops = newGradient.colorStops.map((colorStop) => ({
+        ...colorStop,
+        offset: Number(colorStop.offset)
+    }));
+    return newGradient;
+}
+function sanitizeOptions(options) {
+    const newOptions = { ...options };
+    newOptions.imageOptions = {
+        ...newOptions.imageOptions,
+        hideBackgroundDots: Boolean(newOptions.imageOptions.hideBackgroundDots),
+        imageSize: Math.min(1, Number(newOptions.imageOptions.imageSize)) || 1,
+        margin: Number(newOptions.imageOptions.margin)
+    };
+    newOptions.dotsOptions = {
+        ...newOptions.dotsOptions
+    };
+    if (newOptions.dotsOptions.gradient) {
+        newOptions.dotsOptions.gradient = sanitizeGradient(newOptions.dotsOptions.gradient);
+    }
+    if (newOptions.cornersSquareOptions) {
+        newOptions.cornersSquareOptions = {
+            ...newOptions.cornersSquareOptions
+        };
+        if (newOptions.cornersSquareOptions.gradient) {
+            newOptions.cornersSquareOptions.gradient = sanitizeGradient(newOptions.cornersSquareOptions.gradient);
+        }
+    }
+    if (newOptions.cornersDotOptions) {
+        newOptions.cornersDotOptions = {
+            ...newOptions.cornersDotOptions
+        };
+        if (newOptions.cornersDotOptions.gradient) {
+            newOptions.cornersDotOptions.gradient = sanitizeGradient(newOptions.cornersDotOptions.gradient);
+        }
+    }
+    if (newOptions.backgroundOptions) {
+        newOptions.backgroundOptions = {
+            ...newOptions.backgroundOptions
+        };
+        if (newOptions.backgroundOptions.gradient) {
+            newOptions.backgroundOptions.gradient = sanitizeGradient(newOptions.backgroundOptions.gradient);
+        }
+    }
+    if (!newOptions.document)
+        newOptions.document = document;
+    return newOptions;
 }
 
-const defaultOptions = {
-    document: undefined,
-    shape: exports.ShapeType.square,
-    width: undefined,
-    height: undefined,
-    data: "",
-    qrOptions: {
-        typeNumber: TypeNumber[0],
-        mode: undefined,
-        errorCorrectionLevel: exports.ErrorCorrectionLevel.Q
-    },
-    imageOptions: {
-        hideBackgroundDots: true,
-        imageSize: 0.4,
-        crossOrigin: undefined,
-        margin: 0
-    },
-    dotsOptions: {
-        type: exports.DotType.square,
-        color: "#000"
-    }
+const defaultOptions = {
+    document: undefined,
+    shape: exports.ShapeType.square,
+    width: undefined,
+    height: undefined,
+    data: "",
+    qrOptions: {
+        typeNumber: TypeNumber[0],
+        mode: undefined,
+        errorCorrectionLevel: exports.ErrorCorrectionLevel.Q
+    },
+    imageOptions: {
+        hideBackgroundDots: true,
+        imageSize: 0.4,
+        crossOrigin: undefined,
+        margin: 0
+    },
+    dotsOptions: {
+        type: exports.DotType.square,
+        color: "#000"
+    }
 };
 
-class QRCornerDot {
-    constructor({ svg, type, document }) {
-        this._svg = svg;
-        this._type = type;
-        this._document = document;
-    }
-    draw(x, y, size, rotation) {
-        const type = this._type;
-        let drawFunction;
-        switch (type) {
-            case exports.CornerDotType.square:
-                drawFunction = this._drawSquare;
-                break;
-            case exports.CornerDotType.dot:
-            default:
-                drawFunction = this._drawDot;
-        }
-        drawFunction.call(this, { x, y, size, rotation });
-    }
-    _rotateFigure({ x, y, size, rotation = 0, draw }) {
-        const cx = x + size / 2;
-        const cy = y + size / 2;
-        draw();
-        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
-    }
-    _basicDot(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "circle");
-                this._element.setAttribute("cx", String(x + size / 2));
-                this._element.setAttribute("cy", String(y + size / 2));
-                this._element.setAttribute("r", String(size / 2));
-            }
-        });
-    }
-    _basicSquare(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
-                this._element.setAttribute("x", String(x));
-                this._element.setAttribute("y", String(y));
-                this._element.setAttribute("width", String(size));
-                this._element.setAttribute("height", String(size));
-            }
-        });
-    }
-    _drawDot({ x, y, size, rotation }) {
-        this._basicDot({ x, y, size, rotation });
-    }
-    _drawSquare({ x, y, size, rotation }) {
-        this._basicSquare({ x, y, size, rotation });
-    }
+class QRCornerDot {
+    constructor({ svg, type, document }) {
+        this._svg = svg;
+        this._type = type;
+        this._document = document;
+    }
+    draw(x, y, size, rotation) {
+        const type = this._type;
+        let drawFunction;
+        switch (type) {
+            case exports.CornerDotType.square:
+                drawFunction = this._drawSquare;
+                break;
+            case exports.CornerDotType.dot:
+            default:
+                drawFunction = this._drawDot;
+        }
+        drawFunction.call(this, { x, y, size, rotation });
+    }
+    _rotateFigure({ x, y, size, rotation = 0, draw }) {
+        const cx = x + size / 2;
+        const cy = y + size / 2;
+        draw();
+        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
+    }
+    _basicDot(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "circle");
+                this._element.setAttribute("cx", String(x + size / 2));
+                this._element.setAttribute("cy", String(y + size / 2));
+                this._element.setAttribute("r", String(size / 2));
+            }
+        });
+    }
+    _basicSquare(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
+                this._element.setAttribute("x", String(x));
+                this._element.setAttribute("y", String(y));
+                this._element.setAttribute("width", String(size));
+                this._element.setAttribute("height", String(size));
+            }
+        });
+    }
+    _drawDot({ x, y, size, rotation }) {
+        this._basicDot({ x, y, size, rotation });
+    }
+    _drawSquare({ x, y, size, rotation }) {
+        this._basicSquare({ x, y, size, rotation });
+    }
 }
 
-class QRCornerSquare {
-    constructor({ svg, type, document }) {
-        this._svg = svg;
-        this._type = type;
-        this._document = document;
-    }
-    draw(x, y, size, rotation) {
-        const type = this._type;
-        let drawFunction;
-        switch (type) {
-            case exports.CornerSquareType.square:
-                drawFunction = this._drawSquare;
-                break;
-            case exports.CornerSquareType.extraRounded:
-                drawFunction = this._drawExtraRounded;
-                break;
-            case exports.CornerSquareType.dot:
-            default:
-                drawFunction = this._drawDot;
-        }
-        drawFunction.call(this, { x, y, size, rotation });
-    }
-    _rotateFigure({ x, y, size, rotation = 0, draw }) {
-        const cx = x + size / 2;
-        const cy = y + size / 2;
-        draw();
-        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
-    }
-    _basicDot(args) {
-        const { size, x, y } = args;
-        const dotSize = size / 7;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("clip-rule", "evenodd");
-                this._element.setAttribute("d", `M ${x + size / 2} ${y}` + // M cx, y //  Move to top of ring
-                    `a ${size / 2} ${size / 2} 0 1 0 0.1 0` + // a outerRadius, outerRadius, 0, 1, 0, 1, 0 // Draw outer arc, but don't close it
-                    `z` + // Z // Close the outer shape
-                    `m 0 ${dotSize}` + // m -1 outerRadius-innerRadius // Move to top point of inner radius
-                    `a ${size / 2 - dotSize} ${size / 2 - dotSize} 0 1 1 -0.1 0` + // a innerRadius, innerRadius, 0, 1, 1, -1, 0 // Draw inner arc, but don't close it
-                    `Z` // Z // Close the inner ring. Actually will still work without, but inner ring will have one unit missing in stroke
-                );
-            }
-        });
-    }
-    _basicSquare(args) {
-        const { size, x, y } = args;
-        const dotSize = size / 7;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("clip-rule", "evenodd");
-                this._element.setAttribute("d", `M ${x} ${y}` +
-                    `v ${size}` +
-                    `h ${size}` +
-                    `v ${-size}` +
-                    `z` +
-                    `M ${x + dotSize} ${y + dotSize}` +
-                    `h ${size - 2 * dotSize}` +
-                    `v ${size - 2 * dotSize}` +
-                    `h ${-size + 2 * dotSize}` +
-                    `z`);
-            }
-        });
-    }
-    _basicExtraRounded(args) {
-        const { size, x, y } = args;
-        const dotSize = size / 7;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("clip-rule", "evenodd");
-                this._element.setAttribute("d", `M ${x} ${y + 2.5 * dotSize}` +
-                    `v ${2 * dotSize}` +
-                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${dotSize * 2.5} ${dotSize * 2.5}` +
-                    `h ${2 * dotSize}` +
-                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${dotSize * 2.5} ${-dotSize * 2.5}` +
-                    `v ${-2 * dotSize}` +
-                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${-dotSize * 2.5} ${-dotSize * 2.5}` +
-                    `h ${-2 * dotSize}` +
-                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${-dotSize * 2.5} ${dotSize * 2.5}` +
-                    `M ${x + 2.5 * dotSize} ${y + dotSize}` +
-                    `h ${2 * dotSize}` +
-                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${dotSize * 1.5} ${dotSize * 1.5}` +
-                    `v ${2 * dotSize}` +
-                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${-dotSize * 1.5} ${dotSize * 1.5}` +
-                    `h ${-2 * dotSize}` +
-                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${-dotSize * 1.5} ${-dotSize * 1.5}` +
-                    `v ${-2 * dotSize}` +
-                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${dotSize * 1.5} ${-dotSize * 1.5}`);
-            }
-        });
-    }
-    _drawDot({ x, y, size, rotation }) {
-        this._basicDot({ x, y, size, rotation });
-    }
-    _drawSquare({ x, y, size, rotation }) {
-        this._basicSquare({ x, y, size, rotation });
-    }
-    _drawExtraRounded({ x, y, size, rotation }) {
-        this._basicExtraRounded({ x, y, size, rotation });
-    }
+class QRCornerSquare {
+    constructor({ svg, type, document }) {
+        this._svg = svg;
+        this._type = type;
+        this._document = document;
+    }
+    draw(x, y, size, rotation) {
+        const type = this._type;
+        let drawFunction;
+        switch (type) {
+            case exports.CornerSquareType.square:
+                drawFunction = this._drawSquare;
+                break;
+            case exports.CornerSquareType.extraRounded:
+                drawFunction = this._drawExtraRounded;
+                break;
+            case exports.CornerSquareType.dot:
+            default:
+                drawFunction = this._drawDot;
+        }
+        drawFunction.call(this, { x, y, size, rotation });
+    }
+    _rotateFigure({ x, y, size, rotation = 0, draw }) {
+        const cx = x + size / 2;
+        const cy = y + size / 2;
+        draw();
+        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
+    }
+    _basicDot(args) {
+        const { size, x, y } = args;
+        const dotSize = size / 7;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("clip-rule", "evenodd");
+                this._element.setAttribute("d", `M ${x + size / 2} ${y}` + // M cx, y //  Move to top of ring
+                    `a ${size / 2} ${size / 2} 0 1 0 0.1 0` + // a outerRadius, outerRadius, 0, 1, 0, 1, 0 // Draw outer arc, but don't close it
+                    `z` + // Z // Close the outer shape
+                    `m 0 ${dotSize}` + // m -1 outerRadius-innerRadius // Move to top point of inner radius
+                    `a ${size / 2 - dotSize} ${size / 2 - dotSize} 0 1 1 -0.1 0` + // a innerRadius, innerRadius, 0, 1, 1, -1, 0 // Draw inner arc, but don't close it
+                    `Z` // Z // Close the inner ring. Actually will still work without, but inner ring will have one unit missing in stroke
+                );
+            }
+        });
+    }
+    _basicSquare(args) {
+        const { size, x, y } = args;
+        const dotSize = size / 7;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("clip-rule", "evenodd");
+                this._element.setAttribute("d", `M ${x} ${y}` +
+                    `v ${size}` +
+                    `h ${size}` +
+                    `v ${-size}` +
+                    `z` +
+                    `M ${x + dotSize} ${y + dotSize}` +
+                    `h ${size - 2 * dotSize}` +
+                    `v ${size - 2 * dotSize}` +
+                    `h ${-size + 2 * dotSize}` +
+                    `z`);
+            }
+        });
+    }
+    _basicExtraRounded(args) {
+        const { size, x, y } = args;
+        const dotSize = size / 7;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("clip-rule", "evenodd");
+                this._element.setAttribute("d", `M ${x} ${y + 2.5 * dotSize}` +
+                    `v ${2 * dotSize}` +
+                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${dotSize * 2.5} ${dotSize * 2.5}` +
+                    `h ${2 * dotSize}` +
+                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${dotSize * 2.5} ${-dotSize * 2.5}` +
+                    `v ${-2 * dotSize}` +
+                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${-dotSize * 2.5} ${-dotSize * 2.5}` +
+                    `h ${-2 * dotSize}` +
+                    `a ${2.5 * dotSize} ${2.5 * dotSize}, 0, 0, 0, ${-dotSize * 2.5} ${dotSize * 2.5}` +
+                    `M ${x + 2.5 * dotSize} ${y + dotSize}` +
+                    `h ${2 * dotSize}` +
+                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${dotSize * 1.5} ${dotSize * 1.5}` +
+                    `v ${2 * dotSize}` +
+                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${-dotSize * 1.5} ${dotSize * 1.5}` +
+                    `h ${-2 * dotSize}` +
+                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${-dotSize * 1.5} ${-dotSize * 1.5}` +
+                    `v ${-2 * dotSize}` +
+                    `a ${1.5 * dotSize} ${1.5 * dotSize}, 0, 0, 1, ${dotSize * 1.5} ${-dotSize * 1.5}`);
+            }
+        });
+    }
+    _drawDot({ x, y, size, rotation }) {
+        this._basicDot({ x, y, size, rotation });
+    }
+    _drawSquare({ x, y, size, rotation }) {
+        this._basicSquare({ x, y, size, rotation });
+    }
+    _drawExtraRounded({ x, y, size, rotation }) {
+        this._basicExtraRounded({ x, y, size, rotation });
+    }
 }
 
-class QRDot {
-    constructor({ svg, type, document }) {
-        this._svg = svg;
-        this._type = type;
-        this._document = document;
-    }
-    draw(x, y, size, getNeighbor) {
-        const type = this._type;
-        let drawFunction;
-        switch (type) {
-            case exports.DotType.dots:
-                drawFunction = this._drawDot;
-                break;
-            case exports.DotType.classy:
-                drawFunction = this._drawClassy;
-                break;
-            case exports.DotType.classyRounded:
-                drawFunction = this._drawClassyRounded;
-                break;
-            case exports.DotType.rounded:
-                drawFunction = this._drawRounded;
-                break;
-            case exports.DotType.extraRounded:
-                drawFunction = this._drawExtraRounded;
-                break;
-            case exports.DotType.square:
-            default:
-                drawFunction = this._drawSquare;
-        }
-        drawFunction.call(this, { x, y, size, getNeighbor });
-    }
-    _rotateFigure({ x, y, size, rotation = 0, draw }) {
-        const cx = x + size / 2;
-        const cy = y + size / 2;
-        draw();
-        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
-    }
-    _basicDot(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "circle");
-                this._element.setAttribute("cx", String(x + size / 2));
-                this._element.setAttribute("cy", String(y + size / 2));
-                this._element.setAttribute("r", String(size / 2));
-            }
-        });
-    }
-    _basicSquare(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
-                this._element.setAttribute("x", String(x));
-                this._element.setAttribute("y", String(y));
-                this._element.setAttribute("width", String(size));
-                this._element.setAttribute("height", String(size));
-            }
-        });
-    }
-    //if rotation === 0 - right side is rounded
-    _basicSideRounded(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
-                    `v ${size}` + //draw line to left bottom corner
-                    `h ${size / 2}` + //draw line to left bottom corner + half of size right
-                    `a ${size / 2} ${size / 2}, 0, 0, 0, 0 ${-size}` // draw rounded corner
-                );
-            }
-        });
-    }
-    //if rotation === 0 - top right corner is rounded
-    _basicCornerRounded(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
-                    `v ${size}` + //draw line to left bottom corner
-                    `h ${size}` + //draw line to right bottom corner
-                    `v ${-size / 2}` + //draw line to right bottom corner + half of size top
-                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${-size / 2} ${-size / 2}` // draw rounded corner
-                );
-            }
-        });
-    }
-    //if rotation === 0 - top right corner is rounded
-    _basicCornerExtraRounded(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
-                    `v ${size}` + //draw line to left bottom corner
-                    `h ${size}` + //draw line to right bottom corner
-                    `a ${size} ${size}, 0, 0, 0, ${-size} ${-size}` // draw rounded top right corner
-                );
-            }
-        });
-    }
-    //if rotation === 0 - left bottom and right top corners are rounded
-    _basicCornersRounded(args) {
-        const { size, x, y } = args;
-        this._rotateFigure({
-            ...args,
-            draw: () => {
-                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
-                this._element.setAttribute("d", `M ${x} ${y}` + //go to left top position
-                    `v ${size / 2}` + //draw line to left top corner + half of size bottom
-                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${size / 2} ${size / 2}` + // draw rounded left bottom corner
-                    `h ${size / 2}` + //draw line to right bottom corner
-                    `v ${-size / 2}` + //draw line to right bottom corner + half of size top
-                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${-size / 2} ${-size / 2}` // draw rounded right top corner
-                );
-            }
-        });
-    }
-    _drawDot({ x, y, size }) {
-        this._basicDot({ x, y, size, rotation: 0 });
-    }
-    _drawSquare({ x, y, size }) {
-        this._basicSquare({ x, y, size, rotation: 0 });
-    }
-    _drawRounded({ x, y, size, getNeighbor }) {
-        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
-        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
-        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
-        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
-        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
-        if (neighborsCount === 0) {
-            this._basicDot({ x, y, size, rotation: 0 });
-            return;
-        }
-        if (neighborsCount > 2 || (leftNeighbor && rightNeighbor) || (topNeighbor && bottomNeighbor)) {
-            this._basicSquare({ x, y, size, rotation: 0 });
-            return;
-        }
-        if (neighborsCount === 2) {
-            let rotation = 0;
-            if (leftNeighbor && topNeighbor) {
-                rotation = Math.PI / 2;
-            }
-            else if (topNeighbor && rightNeighbor) {
-                rotation = Math.PI;
-            }
-            else if (rightNeighbor && bottomNeighbor) {
-                rotation = -Math.PI / 2;
-            }
-            this._basicCornerRounded({ x, y, size, rotation });
-            return;
-        }
-        if (neighborsCount === 1) {
-            let rotation = 0;
-            if (topNeighbor) {
-                rotation = Math.PI / 2;
-            }
-            else if (rightNeighbor) {
-                rotation = Math.PI;
-            }
-            else if (bottomNeighbor) {
-                rotation = -Math.PI / 2;
-            }
-            this._basicSideRounded({ x, y, size, rotation });
-            return;
-        }
-    }
-    _drawExtraRounded({ x, y, size, getNeighbor }) {
-        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
-        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
-        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
-        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
-        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
-        if (neighborsCount === 0) {
-            this._basicDot({ x, y, size, rotation: 0 });
-            return;
-        }
-        if (neighborsCount > 2 || (leftNeighbor && rightNeighbor) || (topNeighbor && bottomNeighbor)) {
-            this._basicSquare({ x, y, size, rotation: 0 });
-            return;
-        }
-        if (neighborsCount === 2) {
-            let rotation = 0;
-            if (leftNeighbor && topNeighbor) {
-                rotation = Math.PI / 2;
-            }
-            else if (topNeighbor && rightNeighbor) {
-                rotation = Math.PI;
-            }
-            else if (rightNeighbor && bottomNeighbor) {
-                rotation = -Math.PI / 2;
-            }
-            this._basicCornerExtraRounded({ x, y, size, rotation });
-            return;
-        }
-        if (neighborsCount === 1) {
-            let rotation = 0;
-            if (topNeighbor) {
-                rotation = Math.PI / 2;
-            }
-            else if (rightNeighbor) {
-                rotation = Math.PI;
-            }
-            else if (bottomNeighbor) {
-                rotation = -Math.PI / 2;
-            }
-            this._basicSideRounded({ x, y, size, rotation });
-            return;
-        }
-    }
-    _drawClassy({ x, y, size, getNeighbor }) {
-        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
-        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
-        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
-        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
-        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
-        if (neighborsCount === 0) {
-            this._basicCornersRounded({ x, y, size, rotation: Math.PI / 2 });
-            return;
-        }
-        if (!leftNeighbor && !topNeighbor) {
-            this._basicCornerRounded({ x, y, size, rotation: -Math.PI / 2 });
-            return;
-        }
-        if (!rightNeighbor && !bottomNeighbor) {
-            this._basicCornerRounded({ x, y, size, rotation: Math.PI / 2 });
-            return;
-        }
-        this._basicSquare({ x, y, size, rotation: 0 });
-    }
-    _drawClassyRounded({ x, y, size, getNeighbor }) {
-        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
-        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
-        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
-        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
-        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
-        if (neighborsCount === 0) {
-            this._basicCornersRounded({ x, y, size, rotation: Math.PI / 2 });
-            return;
-        }
-        if (!leftNeighbor && !topNeighbor) {
-            this._basicCornerExtraRounded({ x, y, size, rotation: -Math.PI / 2 });
-            return;
-        }
-        if (!rightNeighbor && !bottomNeighbor) {
-            this._basicCornerExtraRounded({ x, y, size, rotation: Math.PI / 2 });
-            return;
-        }
-        this._basicSquare({ x, y, size, rotation: 0 });
-    }
+class QRDot {
+    constructor({ svg, type, document }) {
+        this._svg = svg;
+        this._type = type;
+        this._document = document;
+    }
+    draw(x, y, size, getNeighbor) {
+        const type = this._type;
+        let drawFunction;
+        switch (type) {
+            case exports.DotType.dots:
+                drawFunction = this._drawDot;
+                break;
+            case exports.DotType.classy:
+                drawFunction = this._drawClassy;
+                break;
+            case exports.DotType.classyRounded:
+                drawFunction = this._drawClassyRounded;
+                break;
+            case exports.DotType.rounded:
+                drawFunction = this._drawRounded;
+                break;
+            case exports.DotType.extraRounded:
+                drawFunction = this._drawExtraRounded;
+                break;
+            case exports.DotType.square:
+            default:
+                drawFunction = this._drawSquare;
+        }
+        drawFunction.call(this, { x, y, size, getNeighbor });
+    }
+    _rotateFigure({ x, y, size, rotation = 0, draw }) {
+        const cx = x + size / 2;
+        const cy = y + size / 2;
+        draw();
+        this._element?.setAttribute("transform", `rotate(${(180 * rotation) / Math.PI},${cx},${cy})`);
+    }
+    _basicDot(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "circle");
+                this._element.setAttribute("cx", String(x + size / 2));
+                this._element.setAttribute("cy", String(y + size / 2));
+                this._element.setAttribute("r", String(size / 2));
+            }
+        });
+    }
+    _basicSquare(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
+                this._element.setAttribute("x", String(x));
+                this._element.setAttribute("y", String(y));
+                this._element.setAttribute("width", String(size));
+                this._element.setAttribute("height", String(size));
+            }
+        });
+    }
+    //if rotation === 0 - right side is rounded
+    _basicSideRounded(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
+                    `v ${size}` + //draw line to left bottom corner
+                    `h ${size / 2}` + //draw line to left bottom corner + half of size right
+                    `a ${size / 2} ${size / 2}, 0, 0, 0, 0 ${-size}` // draw rounded corner
+                );
+            }
+        });
+    }
+    //if rotation === 0 - top right corner is rounded
+    _basicCornerRounded(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
+                    `v ${size}` + //draw line to left bottom corner
+                    `h ${size}` + //draw line to right bottom corner
+                    `v ${-size / 2}` + //draw line to right bottom corner + half of size top
+                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${-size / 2} ${-size / 2}` // draw rounded corner
+                );
+            }
+        });
+    }
+    //if rotation === 0 - top right corner is rounded
+    _basicCornerExtraRounded(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("d", `M ${x} ${y}` + //go to top left position
+                    `v ${size}` + //draw line to left bottom corner
+                    `h ${size}` + //draw line to right bottom corner
+                    `a ${size} ${size}, 0, 0, 0, ${-size} ${-size}` // draw rounded top right corner
+                );
+            }
+        });
+    }
+    //if rotation === 0 - left bottom and right top corners are rounded
+    _basicCornersRounded(args) {
+        const { size, x, y } = args;
+        this._rotateFigure({
+            ...args,
+            draw: () => {
+                this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "path");
+                this._element.setAttribute("d", `M ${x} ${y}` + //go to left top position
+                    `v ${size / 2}` + //draw line to left top corner + half of size bottom
+                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${size / 2} ${size / 2}` + // draw rounded left bottom corner
+                    `h ${size / 2}` + //draw line to right bottom corner
+                    `v ${-size / 2}` + //draw line to right bottom corner + half of size top
+                    `a ${size / 2} ${size / 2}, 0, 0, 0, ${-size / 2} ${-size / 2}` // draw rounded right top corner
+                );
+            }
+        });
+    }
+    _drawDot({ x, y, size }) {
+        this._basicDot({ x, y, size, rotation: 0 });
+    }
+    _drawSquare({ x, y, size }) {
+        this._basicSquare({ x, y, size, rotation: 0 });
+    }
+    _drawRounded({ x, y, size, getNeighbor }) {
+        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
+        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
+        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
+        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
+        if (neighborsCount === 0) {
+            this._basicDot({ x, y, size, rotation: 0 });
+            return;
+        }
+        if (neighborsCount > 2 || (leftNeighbor && rightNeighbor) || (topNeighbor && bottomNeighbor)) {
+            this._basicSquare({ x, y, size, rotation: 0 });
+            return;
+        }
+        if (neighborsCount === 2) {
+            let rotation = 0;
+            if (leftNeighbor && topNeighbor) {
+                rotation = Math.PI / 2;
+            }
+            else if (topNeighbor && rightNeighbor) {
+                rotation = Math.PI;
+            }
+            else if (rightNeighbor && bottomNeighbor) {
+                rotation = -Math.PI / 2;
+            }
+            this._basicCornerRounded({ x, y, size, rotation });
+            return;
+        }
+        if (neighborsCount === 1) {
+            let rotation = 0;
+            if (topNeighbor) {
+                rotation = Math.PI / 2;
+            }
+            else if (rightNeighbor) {
+                rotation = Math.PI;
+            }
+            else if (bottomNeighbor) {
+                rotation = -Math.PI / 2;
+            }
+            this._basicSideRounded({ x, y, size, rotation });
+            return;
+        }
+    }
+    _drawExtraRounded({ x, y, size, getNeighbor }) {
+        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
+        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
+        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
+        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
+        if (neighborsCount === 0) {
+            this._basicDot({ x, y, size, rotation: 0 });
+            return;
+        }
+        if (neighborsCount > 2 || (leftNeighbor && rightNeighbor) || (topNeighbor && bottomNeighbor)) {
+            this._basicSquare({ x, y, size, rotation: 0 });
+            return;
+        }
+        if (neighborsCount === 2) {
+            let rotation = 0;
+            if (leftNeighbor && topNeighbor) {
+                rotation = Math.PI / 2;
+            }
+            else if (topNeighbor && rightNeighbor) {
+                rotation = Math.PI;
+            }
+            else if (rightNeighbor && bottomNeighbor) {
+                rotation = -Math.PI / 2;
+            }
+            this._basicCornerExtraRounded({ x, y, size, rotation });
+            return;
+        }
+        if (neighborsCount === 1) {
+            let rotation = 0;
+            if (topNeighbor) {
+                rotation = Math.PI / 2;
+            }
+            else if (rightNeighbor) {
+                rotation = Math.PI;
+            }
+            else if (bottomNeighbor) {
+                rotation = -Math.PI / 2;
+            }
+            this._basicSideRounded({ x, y, size, rotation });
+            return;
+        }
+    }
+    _drawClassy({ x, y, size, getNeighbor }) {
+        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
+        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
+        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
+        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
+        if (neighborsCount === 0) {
+            this._basicCornersRounded({ x, y, size, rotation: Math.PI / 2 });
+            return;
+        }
+        if (!leftNeighbor && !topNeighbor) {
+            this._basicCornerRounded({ x, y, size, rotation: -Math.PI / 2 });
+            return;
+        }
+        if (!rightNeighbor && !bottomNeighbor) {
+            this._basicCornerRounded({ x, y, size, rotation: Math.PI / 2 });
+            return;
+        }
+        this._basicSquare({ x, y, size, rotation: 0 });
+    }
+    _drawClassyRounded({ x, y, size, getNeighbor }) {
+        const leftNeighbor = getNeighbor ? +getNeighbor(-1, 0) : 0;
+        const rightNeighbor = getNeighbor ? +getNeighbor(1, 0) : 0;
+        const topNeighbor = getNeighbor ? +getNeighbor(0, -1) : 0;
+        const bottomNeighbor = getNeighbor ? +getNeighbor(0, 1) : 0;
+        const neighborsCount = leftNeighbor + rightNeighbor + topNeighbor + bottomNeighbor;
+        if (neighborsCount === 0) {
+            this._basicCornersRounded({ x, y, size, rotation: Math.PI / 2 });
+            return;
+        }
+        if (!leftNeighbor && !topNeighbor) {
+            this._basicCornerExtraRounded({ x, y, size, rotation: -Math.PI / 2 });
+            return;
+        }
+        if (!rightNeighbor && !bottomNeighbor) {
+            this._basicCornerExtraRounded({ x, y, size, rotation: Math.PI / 2 });
+            return;
+        }
+        this._basicSquare({ x, y, size, rotation: 0 });
+    }
 }
 
-function calculateImageSize({ originalHeight, originalWidth, maxHiddenDots, maxHiddenAxisDots, dotSize }) {
-    const hideDots = { x: 0, y: 0 };
-    const imageSize = { x: 0, y: 0 };
-    if (originalHeight <= 0 || originalWidth <= 0 || maxHiddenDots <= 0 || dotSize <= 0) {
-        return {
-            height: 0,
-            width: 0,
-            hideYDots: 0,
-            hideXDots: 0
-        };
-    }
-    const k = originalHeight / originalWidth;
-    //Getting the maximum possible axis hidden dots
-    hideDots.x = Math.floor(Math.sqrt(maxHiddenDots / k));
-    //The count of hidden dot's can't be less than 1
-    if (hideDots.x <= 0)
-        hideDots.x = 1;
-    //Check the limit of the maximum allowed axis hidden dots
-    if (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.x)
-        hideDots.x = maxHiddenAxisDots;
-    //The count of dots should be odd
-    if (hideDots.x % 2 === 0)
-        hideDots.x--;
-    imageSize.x = hideDots.x * dotSize;
-    //Calculate opposite axis hidden dots based on axis value.
-    //The value will be odd.
-    //We use ceil to prevent dots covering by the image.
-    hideDots.y = 1 + 2 * Math.ceil((hideDots.x * k - 1) / 2);
-    imageSize.y = Math.round(imageSize.x * k);
-    //If the result dots count is bigger than max - then decrease size and calculate again
-    if (hideDots.y * hideDots.x > maxHiddenDots || (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.y)) {
-        if (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.y) {
-            hideDots.y = maxHiddenAxisDots;
-            if (hideDots.y % 2 === 0)
-                hideDots.x--;
-        }
-        else {
-            hideDots.y -= 2;
-        }
-        imageSize.y = hideDots.y * dotSize;
-        hideDots.x = 1 + 2 * Math.ceil((hideDots.y / k - 1) / 2);
-        imageSize.x = Math.round(imageSize.y / k);
-    }
-    return {
-        height: imageSize.y,
-        width: imageSize.x,
-        hideYDots: hideDots.y,
-        hideXDots: hideDots.x
-    };
+function calculateImageSize({ originalHeight, originalWidth, maxHiddenDots, maxHiddenAxisDots, dotSize }) {
+    const hideDots = { x: 0, y: 0 };
+    const imageSize = { x: 0, y: 0 };
+    if (originalHeight <= 0 || originalWidth <= 0 || maxHiddenDots <= 0 || dotSize <= 0) {
+        return {
+            height: 0,
+            width: 0,
+            hideYDots: 0,
+            hideXDots: 0
+        };
+    }
+    const k = originalHeight / originalWidth;
+    //Getting the maximum possible axis hidden dots
+    hideDots.x = Math.floor(Math.sqrt(maxHiddenDots / k));
+    //The count of hidden dot's can't be less than 1
+    if (hideDots.x <= 0)
+        hideDots.x = 1;
+    //Check the limit of the maximum allowed axis hidden dots
+    if (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.x)
+        hideDots.x = maxHiddenAxisDots;
+    //The count of dots should be odd
+    if (hideDots.x % 2 === 0)
+        hideDots.x--;
+    imageSize.x = hideDots.x * dotSize;
+    //Calculate opposite axis hidden dots based on axis value.
+    //The value will be odd.
+    //We use ceil to prevent dots covering by the image.
+    hideDots.y = 1 + 2 * Math.ceil((hideDots.x * k - 1) / 2);
+    imageSize.y = Math.round(imageSize.x * k);
+    //If the result dots count is bigger than max - then decrease size and calculate again
+    if (hideDots.y * hideDots.x > maxHiddenDots || (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.y)) {
+        if (maxHiddenAxisDots && maxHiddenAxisDots < hideDots.y) {
+            hideDots.y = maxHiddenAxisDots;
+            if (hideDots.y % 2 === 0)
+                hideDots.x--;
+        }
+        else {
+            hideDots.y -= 2;
+        }
+        imageSize.y = hideDots.y * dotSize;
+        hideDots.x = 1 + 2 * Math.ceil((hideDots.y / k - 1) / 2);
+        imageSize.x = Math.round(imageSize.y / k);
+    }
+    return {
+        height: imageSize.y,
+        width: imageSize.x,
+        hideYDots: hideDots.y,
+        hideXDots: hideDots.x
+    };
 }
 
-const browserImageTools = {
-    toDataURL(url) {
-        return new Promise((resolve, reject) => {
-            if (typeof url == "string") {
-                const xhr = new XMLHttpRequest();
-                xhr.onload = function () {
-                    const reader = new FileReader();
-                    reader.onloadend = function () {
-                        resolve(reader.result);
-                    };
-                    reader.readAsDataURL(xhr.response);
-                };
-                xhr.onerror = xhr.onabort = xhr.ontimeout = reject;
-                xhr.open("GET", url);
-                xhr.responseType = "blob";
-                xhr.send();
-            }
-            else {
-                const reader = new FileReader();
-                reader.onloadend = function () {
-                    resolve(reader.result);
-                };
-                reader.readAsDataURL(url);
-            }
-        });
-    },
-    getSize(options) {
-        return new Promise((resolve, reject) => {
-            if (!options.image) {
-                return reject("Image is not defined");
-            }
-            const image = new Image();
-            if (typeof options.imageOptions.crossOrigin === "string") {
-                image.crossOrigin = options.imageOptions.crossOrigin;
-            }
-            image.onload = () => {
-                resolve({ width: image.width, height: image.height });
-            };
-            image.onerror = image.onabort = reject;
-            if (typeof options.image == "string")
-                image.src = options.image;
-            else
-                browserImageTools
-                    .toDataURL(options.image)
-                    .then((url) => (image.src = url))
-                    .catch(reject);
-        });
-    }
+const browserImageTools = {
+    toDataURL(url) {
+        return new Promise((resolve, reject) => {
+            if (typeof url == "string") {
+                const xhr = new XMLHttpRequest();
+                xhr.onload = function () {
+                    const reader = new FileReader();
+                    reader.onloadend = function () {
+                        resolve(reader.result);
+                    };
+                    reader.readAsDataURL(xhr.response);
+                };
+                xhr.onerror = xhr.onabort = xhr.ontimeout = reject;
+                xhr.open("GET", url);
+                xhr.responseType = "blob";
+                xhr.send();
+            }
+            else {
+                const reader = new FileReader();
+                reader.onloadend = function () {
+                    resolve(reader.result);
+                };
+                reader.readAsDataURL(url);
+            }
+        });
+    },
+    getSize(options) {
+        return new Promise((resolve, reject) => {
+            if (!options.image) {
+                return reject("Image is not defined");
+            }
+            const image = new Image();
+            if (typeof options.imageOptions.crossOrigin === "string") {
+                image.crossOrigin = options.imageOptions.crossOrigin;
+            }
+            image.onload = () => {
+                resolve({ width: image.width, height: image.height });
+            };
+            image.onerror = image.onabort = reject;
+            if (typeof options.image == "string")
+                image.src = options.image;
+            else
+                browserImageTools
+                    .toDataURL(options.image)
+                    .then((url) => (image.src = url))
+                    .catch(reject);
+        });
+    }
 };
 
-const squareMask = [
-    [1, 1, 1, 1, 1, 1, 1],
-    [1, 0, 0, 0, 0, 0, 1],
-    [1, 0, 0, 0, 0, 0, 1],
-    [1, 0, 0, 0, 0, 0, 1],
-    [1, 0, 0, 0, 0, 0, 1],
-    [1, 0, 0, 0, 0, 0, 1],
-    [1, 1, 1, 1, 1, 1, 1]
-];
-const dotMask = [
-    [0, 0, 0, 0, 0, 0, 0],
-    [0, 0, 0, 0, 0, 0, 0],
-    [0, 0, 1, 1, 1, 0, 0],
-    [0, 0, 1, 1, 1, 0, 0],
-    [0, 0, 1, 1, 1, 0, 0],
-    [0, 0, 0, 0, 0, 0, 0],
-    [0, 0, 0, 0, 0, 0, 0]
-];
-class QRSVG {
-    //TODO don't pass all options to this class
-    constructor(options) {
-        this._document = options.document;
-        this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "svg");
-        this._element.setAttribute("width", String(options.width));
-        this._element.setAttribute("height", String(options.height));
-        this._element.setAttribute("viewBox", `0 0 ${options.width} ${options.height}`);
-        this._defs = this._document.createElementNS("http://www.w3.org/2000/svg", "defs");
-        this._element.appendChild(this._defs);
-        this._imageTools = options.imageTools || browserImageTools;
-        this._options = options;
-    }
-    get width() {
-        return this._options.width;
-    }
-    get height() {
-        return this._options.height;
-    }
-    getElement() {
-        return this._element;
-    }
-    async drawQR(qr) {
-        const count = qr.getModuleCount();
-        const minSize = Math.min(this._options.width, this._options.height);
-        const realQRSize = this._options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
-        const dotSize = Math.floor(realQRSize / count);
-        let drawImageSize = {
-            hideXDots: 0,
-            hideYDots: 0,
-            width: 0,
-            height: 0
-        };
-        this._qr = qr;
-        if (this._options.image) {
-            //We need it to get image size
-            const size = await this._imageTools.getSize(this._options);
-            const { imageOptions, qrOptions } = this._options;
-            const coverLevel = imageOptions.imageSize * ErrorCorrectionPercents[qrOptions.errorCorrectionLevel];
-            const maxHiddenDots = Math.floor(coverLevel * count * count);
-            drawImageSize = calculateImageSize({
-                originalWidth: size.width,
-                originalHeight: size.height,
-                maxHiddenDots,
-                maxHiddenAxisDots: count - 14,
-                dotSize
-            });
-        }
-        this.drawBackground();
-        this.drawDots((i, j) => {
-            if (this._options.imageOptions.hideBackgroundDots) {
-                if (i >= (count - drawImageSize.hideXDots) / 2 &&
-                    i < (count + drawImageSize.hideXDots) / 2 &&
-                    j >= (count - drawImageSize.hideYDots) / 2 &&
-                    j < (count + drawImageSize.hideYDots) / 2) {
-                    return false;
-                }
-            }
-            if (squareMask[i]?.[j] || squareMask[i - count + 7]?.[j] || squareMask[i]?.[j - count + 7]) {
-                return false;
-            }
-            if (dotMask[i]?.[j] || dotMask[i - count + 7]?.[j] || dotMask[i]?.[j - count + 7]) {
-                return false;
-            }
-            return true;
-        });
-        this.drawCorners();
-        if (this._options.image) {
-            await this.drawImage({ width: drawImageSize.width, height: drawImageSize.height, count, dotSize });
-        }
-    }
-    drawBackground() {
-        const element = this._element;
-        const options = this._options;
-        if (element && options.backgroundOptions) {
-            const gradientOptions = options.backgroundOptions.gradient;
-            const color = options.backgroundOptions.color;
-            this._createColor({
-                options: gradientOptions,
-                color: color,
-                additionalRotation: 0,
-                x: 0,
-                y: 0,
-                height: options.height,
-                width: options.width,
-                name: "background-color"
-            });
-            const size = Math.min(options.width, options.height);
-            const element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
-            this._backgroundClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
-            this._backgroundClipPath.setAttribute("id", "clip-path-background-color");
-            this._defs.appendChild(this._backgroundClipPath);
-            element.setAttribute("x", String((options.width - size) / 2));
-            element.setAttribute("y", String((options.height - size) / 2));
-            element.setAttribute("width", String(size));
-            element.setAttribute("height", String(size));
-            element.setAttribute("rx", String((size / 2) * (options.backgroundOptions.round || 0)));
-            this._backgroundClipPath.appendChild(element);
-        }
-    }
-    drawDots(filter) {
-        if (!this._qr) {
-            throw "QR code is not defined";
-        }
-        const options = this._options;
-        const count = this._qr.getModuleCount();
-        if (count > options.width || count > options.height) {
-            throw "The canvas is too small.";
-        }
-        const minSize = Math.min(options.width, options.height);
-        const realQRSize = options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
-        const dotSize = Math.floor(realQRSize / count);
-        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
-        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
-        const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
-        this._dotsClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
-        this._dotsClipPath.setAttribute("id", "clip-path-dot-color");
-        this._defs.appendChild(this._dotsClipPath);
-        this._createColor({
-            options: options.dotsOptions?.gradient,
-            color: options.dotsOptions.color,
-            additionalRotation: 0,
-            x: 0,
-            y: 0,
-            height: options.height,
-            width: options.width,
-            name: "dot-color"
-        });
-        for (let i = 0; i < count; i++) {
-            for (let j = 0; j < count; j++) {
-                if (filter && !filter(i, j)) {
-                    continue;
-                }
-                if (!this._qr?.isDark(i, j)) {
-                    continue;
-                }
-                dot.draw(xBeginning + i * dotSize, yBeginning + j * dotSize, dotSize, (xOffset, yOffset) => {
-                    if (i + xOffset < 0 || j + yOffset < 0 || i + xOffset >= count || j + yOffset >= count)
-                        return false;
-                    if (filter && !filter(i + xOffset, j + yOffset))
-                        return false;
-                    return !!this._qr && this._qr.isDark(i + xOffset, j + yOffset);
-                });
-                if (dot._element && this._dotsClipPath) {
-                    this._dotsClipPath.appendChild(dot._element);
-                }
-            }
-        }
-        if (options.shape === exports.ShapeType.circle) {
-            const additionalDots = Math.floor((minSize / dotSize - count) / 2);
-            const fakeCount = count + additionalDots * 2;
-            const xFakeBeginning = xBeginning - additionalDots * dotSize;
-            const yFakeBeginning = yBeginning - additionalDots * dotSize;
-            const fakeMatrix = [];
-            const center = Math.floor(fakeCount / 2);
-            for (let i = 0; i < fakeCount; i++) {
-                fakeMatrix[i] = [];
-                for (let j = 0; j < fakeCount; j++) {
-                    if (i >= additionalDots - 1 &&
-                        i <= fakeCount - additionalDots &&
-                        j >= additionalDots - 1 &&
-                        j <= fakeCount - additionalDots) {
-                        fakeMatrix[i][j] = 0;
-                        continue;
-                    }
-                    if (Math.sqrt((i - center) * (i - center) + (j - center) * (j - center)) > center) {
-                        fakeMatrix[i][j] = 0;
-                        continue;
-                    }
-                    //Get random dots from QR code to show it outside of QR code
-                    fakeMatrix[i][j] = this._qr.isDark(j - 2 * additionalDots < 0 ? j : j >= count ? j - 2 * additionalDots : j - additionalDots, i - 2 * additionalDots < 0 ? i : i >= count ? i - 2 * additionalDots : i - additionalDots)
-                        ? 1
-                        : 0;
-                }
-            }
-            for (let i = 0; i < fakeCount; i++) {
-                for (let j = 0; j < fakeCount; j++) {
-                    if (!fakeMatrix[i][j])
-                        continue;
-                    dot.draw(xFakeBeginning + i * dotSize, yFakeBeginning + j * dotSize, dotSize, (xOffset, yOffset) => {
-                        return !!fakeMatrix[i + xOffset]?.[j + yOffset];
-                    });
-                    if (dot._element && this._dotsClipPath) {
-                        this._dotsClipPath.appendChild(dot._element);
-                    }
-                }
-            }
-        }
-    }
-    drawCorners() {
-        if (!this._qr) {
-            throw "QR code is not defined";
-        }
-        const element = this._element;
-        const options = this._options;
-        if (!element) {
-            throw "Element code is not defined";
-        }
-        const count = this._qr.getModuleCount();
-        const minSize = Math.min(options.width, options.height);
-        const realQRSize = options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
-        const dotSize = Math.floor(realQRSize / count);
-        const cornersSquareSize = dotSize * 7;
-        const cornersDotSize = dotSize * 3;
-        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
-        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
-        [
-            [0, 0, 0],
-            [1, 0, Math.PI / 2],
-            [0, 1, -Math.PI / 2]
-        ].forEach(([column, row, rotation]) => {
-            const x = xBeginning + column * dotSize * (count - 7);
-            const y = yBeginning + row * dotSize * (count - 7);
-            let cornersSquareClipPath = this._dotsClipPath;
-            let cornersDotClipPath = this._dotsClipPath;
-            if (options.cornersSquareOptions?.gradient || options.cornersSquareOptions?.color) {
-                cornersSquareClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
-                cornersSquareClipPath.setAttribute("id", `clip-path-corners-square-color-${column}-${row}`);
-                this._defs.appendChild(cornersSquareClipPath);
-                this._cornersSquareClipPath = this._cornersDotClipPath = cornersDotClipPath = cornersSquareClipPath;
-                this._createColor({
-                    options: options.cornersSquareOptions?.gradient,
-                    color: options.cornersSquareOptions?.color,
-                    additionalRotation: rotation,
-                    x,
-                    y,
-                    height: cornersSquareSize,
-                    width: cornersSquareSize,
-                    name: `corners-square-color-${column}-${row}`
-                });
-            }
-            if (options.cornersSquareOptions?.type) {
-                const cornersSquare = new QRCornerSquare({
-                    svg: this._element,
-                    type: options.cornersSquareOptions.type,
-                    document: this._document
-                });
-                cornersSquare.draw(x, y, cornersSquareSize, rotation);
-                if (cornersSquare._element && cornersSquareClipPath) {
-                    cornersSquareClipPath.appendChild(cornersSquare._element);
-                }
-            }
-            else {
-                const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
-                for (let i = 0; i < squareMask.length; i++) {
-                    for (let j = 0; j < squareMask[i].length; j++) {
-                        if (!squareMask[i]?.[j]) {
-                            continue;
-                        }
-                        dot.draw(x + i * dotSize, y + j * dotSize, dotSize, (xOffset, yOffset) => !!squareMask[i + xOffset]?.[j + yOffset]);
-                        if (dot._element && cornersSquareClipPath) {
-                            cornersSquareClipPath.appendChild(dot._element);
-                        }
-                    }
-                }
-            }
-            if (options.cornersDotOptions?.gradient || options.cornersDotOptions?.color) {
-                cornersDotClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
-                cornersDotClipPath.setAttribute("id", `clip-path-corners-dot-color-${column}-${row}`);
-                this._defs.appendChild(cornersDotClipPath);
-                this._cornersDotClipPath = cornersDotClipPath;
-                this._createColor({
-                    options: options.cornersDotOptions?.gradient,
-                    color: options.cornersDotOptions?.color,
-                    additionalRotation: rotation,
-                    x: x + dotSize * 2,
-                    y: y + dotSize * 2,
-                    height: cornersDotSize,
-                    width: cornersDotSize,
-                    name: `corners-dot-color-${column}-${row}`
-                });
-            }
-            if (options.cornersDotOptions?.type) {
-                const cornersDot = new QRCornerDot({
-                    svg: this._element,
-                    type: options.cornersDotOptions.type,
-                    document: this._document
-                });
-                cornersDot.draw(x + dotSize * 2, y + dotSize * 2, cornersDotSize, rotation);
-                if (cornersDot._element && cornersDotClipPath) {
-                    cornersDotClipPath.appendChild(cornersDot._element);
-                }
-            }
-            else {
-                const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
-                for (let i = 0; i < dotMask.length; i++) {
-                    for (let j = 0; j < dotMask[i].length; j++) {
-                        if (!dotMask[i]?.[j]) {
-                            continue;
-                        }
-                        dot.draw(x + i * dotSize, y + j * dotSize, dotSize, (xOffset, yOffset) => !!dotMask[i + xOffset]?.[j + yOffset]);
-                        if (dot._element && cornersDotClipPath) {
-                            cornersDotClipPath.appendChild(dot._element);
-                        }
-                    }
-                }
-            }
-        });
-    }
-    async drawImage({ width, height, count, dotSize }) {
-        const options = this._options;
-        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
-        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
-        const margin = options.imageOptions.margin * dotSize;
-        const dx = xBeginning + margin + (count * dotSize - width) / 2;
-        const dy = yBeginning + margin + (count * dotSize - height) / 2;
-        const dw = width - margin * 2;
-        const dh = height - margin * 2;
-        const imageUrl = await this._imageTools.toDataURL(options.image || "");
-        let image = this._document.createElementNS("http://www.w3.org/2000/svg", "image");
-        image.setAttribute("href", imageUrl || "");
-        if (imageUrl.startsWith("data:image/svg+xml;")) {
-            let data = imageUrl.substring(19);
-            const i = data.indexOf(",");
-            const encoding = data.substring(0, i);
-            data = data.substring(i + 1);
-            switch (encoding) {
-                case "base64":
-                    data = typeof atob == "function" ? atob(data) : Buffer.from(data, "base64").toString("utf8");
-                    break;
-                default:
-                    data = "";
-                    break;
-            }
-            if (data) {
-                const container = this._document.createElement("div");
-                container.innerHTML = data;
-                const rootEl = container.querySelector("svg");
-                if (rootEl)
-                    image = rootEl;
-            }
-        }
-        image.setAttribute("x", String(dx));
-        image.setAttribute("y", String(dy));
-        image.setAttribute("width", `${dw}px`);
-        image.setAttribute("height", `${dh}px`);
-        this._element.appendChild(image);
-    }
-    _createColor({ options, color, additionalRotation, x, y, height, width, name }) {
-        const size = width > height ? width : height;
-        const rect = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
-        rect.setAttribute("x", String(x));
-        rect.setAttribute("y", String(y));
-        rect.setAttribute("height", String(height));
-        rect.setAttribute("width", String(width));
-        rect.setAttribute("clip-path", `url('#clip-path-${name}')`);
-        if (options) {
-            let gradient;
-            if (options.type === exports.GradientType.radial) {
-                gradient = this._document.createElementNS("http://www.w3.org/2000/svg", "radialGradient");
-                gradient.setAttribute("id", name);
-                gradient.setAttribute("gradientUnits", "userSpaceOnUse");
-                gradient.setAttribute("fx", String(x + width / 2));
-                gradient.setAttribute("fy", String(y + height / 2));
-                gradient.setAttribute("cx", String(x + width / 2));
-                gradient.setAttribute("cy", String(y + height / 2));
-                gradient.setAttribute("r", String(size / 2));
-            }
-            else {
-                const rotation = ((options.rotation || 0) + additionalRotation) % (2 * Math.PI);
-                const positiveRotation = (rotation + 2 * Math.PI) % (2 * Math.PI);
-                let x0 = x + width / 2;
-                let y0 = y + height / 2;
-                let x1 = x + width / 2;
-                let y1 = y + height / 2;
-                if ((positiveRotation >= 0 && positiveRotation <= 0.25 * Math.PI) ||
-                    (positiveRotation > 1.75 * Math.PI && positiveRotation <= 2 * Math.PI)) {
-                    x0 = x0 - width / 2;
-                    y0 = y0 - (height / 2) * Math.tan(rotation);
-                    x1 = x1 + width / 2;
-                    y1 = y1 + (height / 2) * Math.tan(rotation);
-                }
-                else if (positiveRotation > 0.25 * Math.PI && positiveRotation <= 0.75 * Math.PI) {
-                    y0 = y0 - height / 2;
-                    x0 = x0 - width / 2 / Math.tan(rotation);
-                    y1 = y1 + height / 2;
-                    x1 = x1 + width / 2 / Math.tan(rotation);
-                }
-                else if (positiveRotation > 0.75 * Math.PI && positiveRotation <= 1.25 * Math.PI) {
-                    x0 = x0 + width / 2;
-                    y0 = y0 + (height / 2) * Math.tan(rotation);
-                    x1 = x1 - width / 2;
-                    y1 = y1 - (height / 2) * Math.tan(rotation);
-                }
-                else if (positiveRotation > 1.25 * Math.PI && positiveRotation <= 1.75 * Math.PI) {
-                    y0 = y0 + height / 2;
-                    x0 = x0 + width / 2 / Math.tan(rotation);
-                    y1 = y1 - height / 2;
-                    x1 = x1 - width / 2 / Math.tan(rotation);
-                }
-                gradient = this._document.createElementNS("http://www.w3.org/2000/svg", "linearGradient");
-                gradient.setAttribute("id", name);
-                gradient.setAttribute("gradientUnits", "userSpaceOnUse");
-                gradient.setAttribute("x1", String(Math.round(x0)));
-                gradient.setAttribute("y1", String(Math.round(y0)));
-                gradient.setAttribute("x2", String(Math.round(x1)));
-                gradient.setAttribute("y2", String(Math.round(y1)));
-            }
-            options.colorStops.forEach(({ offset, color }) => {
-                const stop = this._document.createElementNS("http://www.w3.org/2000/svg", "stop");
-                stop.setAttribute("offset", `${100 * offset}%`);
-                stop.setAttribute("stop-color", color);
-                gradient.appendChild(stop);
-            });
-            rect.setAttribute("fill", `url('#${name}')`);
-            this._defs.appendChild(gradient);
-        }
-        else if (color) {
-            rect.setAttribute("fill", color);
-        }
-        this._element.appendChild(rect);
-    }
+const squareMask = [
+    [1, 1, 1, 1, 1, 1, 1],
+    [1, 0, 0, 0, 0, 0, 1],
+    [1, 0, 0, 0, 0, 0, 1],
+    [1, 0, 0, 0, 0, 0, 1],
+    [1, 0, 0, 0, 0, 0, 1],
+    [1, 0, 0, 0, 0, 0, 1],
+    [1, 1, 1, 1, 1, 1, 1]
+];
+const dotMask = [
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 1, 1, 1, 0, 0],
+    [0, 0, 1, 1, 1, 0, 0],
+    [0, 0, 1, 1, 1, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0]
+];
+class QRSVG {
+    //TODO don't pass all options to this class
+    constructor(options) {
+        this._document = options.document;
+        this._element = this._document.createElementNS("http://www.w3.org/2000/svg", "svg");
+        this._element.setAttribute("width", String(options.width));
+        this._element.setAttribute("height", String(options.height));
+        this._element.setAttribute("viewBox", `0 0 ${options.width} ${options.height}`);
+        this._defs = this._document.createElementNS("http://www.w3.org/2000/svg", "defs");
+        this._element.appendChild(this._defs);
+        this._imageTools = options.imageTools || browserImageTools;
+        this._options = options;
+    }
+    get width() {
+        return this._options.width;
+    }
+    get height() {
+        return this._options.height;
+    }
+    getElement() {
+        return this._element;
+    }
+    async drawQR(qr) {
+        const count = qr.getModuleCount();
+        const minSize = Math.min(this._options.width, this._options.height);
+        const realQRSize = this._options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
+        const dotSize = Math.floor(realQRSize / count);
+        let drawImageSize = {
+            hideXDots: 0,
+            hideYDots: 0,
+            width: 0,
+            height: 0
+        };
+        this._qr = qr;
+        if (this._options.image) {
+            //We need it to get image size
+            const size = await this._imageTools.getSize(this._options);
+            const { imageOptions, qrOptions } = this._options;
+            const coverLevel = imageOptions.imageSize * ErrorCorrectionPercents[qrOptions.errorCorrectionLevel];
+            const maxHiddenDots = Math.floor(coverLevel * count * count);
+            drawImageSize = calculateImageSize({
+                originalWidth: size.width,
+                originalHeight: size.height,
+                maxHiddenDots,
+                maxHiddenAxisDots: count - 14,
+                dotSize
+            });
+        }
+        this.drawBackground();
+        this.drawDots((i, j) => {
+            if (this._options.imageOptions.hideBackgroundDots) {
+                if (i >= (count - drawImageSize.hideXDots) / 2 &&
+                    i < (count + drawImageSize.hideXDots) / 2 &&
+                    j >= (count - drawImageSize.hideYDots) / 2 &&
+                    j < (count + drawImageSize.hideYDots) / 2) {
+                    return false;
+                }
+            }
+            if (squareMask[i]?.[j] || squareMask[i - count + 7]?.[j] || squareMask[i]?.[j - count + 7]) {
+                return false;
+            }
+            if (dotMask[i]?.[j] || dotMask[i - count + 7]?.[j] || dotMask[i]?.[j - count + 7]) {
+                return false;
+            }
+            return true;
+        });
+        this.drawCorners();
+        if (this._options.image) {
+            await this.drawImage({ width: drawImageSize.width, height: drawImageSize.height, count, dotSize });
+        }
+    }
+    drawBackground() {
+        const element = this._element;
+        const options = this._options;
+        if (element && options.backgroundOptions) {
+            const gradientOptions = options.backgroundOptions.gradient;
+            const color = options.backgroundOptions.color;
+            this._createColor({
+                options: gradientOptions,
+                color: color,
+                additionalRotation: 0,
+                x: 0,
+                y: 0,
+                height: options.height,
+                width: options.width,
+                name: "background-color"
+            });
+            const size = Math.min(options.width, options.height);
+            const element = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
+            this._backgroundClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
+            this._backgroundClipPath.setAttribute("id", "clip-path-background-color");
+            this._defs.appendChild(this._backgroundClipPath);
+            element.setAttribute("x", String((options.width - size) / 2));
+            element.setAttribute("y", String((options.height - size) / 2));
+            element.setAttribute("width", String(size));
+            element.setAttribute("height", String(size));
+            element.setAttribute("rx", String((size / 2) * (options.backgroundOptions.round || 0)));
+            this._backgroundClipPath.appendChild(element);
+        }
+    }
+    drawDots(filter) {
+        if (!this._qr) {
+            throw "QR code is not defined";
+        }
+        const options = this._options;
+        const count = this._qr.getModuleCount();
+        if (count > options.width || count > options.height) {
+            throw "The canvas is too small.";
+        }
+        const minSize = Math.min(options.width, options.height);
+        const realQRSize = options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
+        const dotSize = Math.floor(realQRSize / count);
+        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
+        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
+        const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
+        this._dotsClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
+        this._dotsClipPath.setAttribute("id", "clip-path-dot-color");
+        this._defs.appendChild(this._dotsClipPath);
+        this._createColor({
+            options: options.dotsOptions?.gradient,
+            color: options.dotsOptions.color,
+            additionalRotation: 0,
+            x: 0,
+            y: 0,
+            height: options.height,
+            width: options.width,
+            name: "dot-color"
+        });
+        for (let i = 0; i < count; i++) {
+            for (let j = 0; j < count; j++) {
+                if (filter && !filter(i, j)) {
+                    continue;
+                }
+                if (!this._qr?.isDark(i, j)) {
+                    continue;
+                }
+                dot.draw(xBeginning + i * dotSize, yBeginning + j * dotSize, dotSize, (xOffset, yOffset) => {
+                    if (i + xOffset < 0 || j + yOffset < 0 || i + xOffset >= count || j + yOffset >= count)
+                        return false;
+                    if (filter && !filter(i + xOffset, j + yOffset))
+                        return false;
+                    return !!this._qr && this._qr.isDark(i + xOffset, j + yOffset);
+                });
+                if (dot._element && this._dotsClipPath) {
+                    this._dotsClipPath.appendChild(dot._element);
+                }
+            }
+        }
+        if (options.shape === exports.ShapeType.circle) {
+            const additionalDots = Math.floor((minSize / dotSize - count) / 2);
+            const fakeCount = count + additionalDots * 2;
+            const xFakeBeginning = xBeginning - additionalDots * dotSize;
+            const yFakeBeginning = yBeginning - additionalDots * dotSize;
+            const fakeMatrix = [];
+            const center = Math.floor(fakeCount / 2);
+            for (let i = 0; i < fakeCount; i++) {
+                fakeMatrix[i] = [];
+                for (let j = 0; j < fakeCount; j++) {
+                    if (i >= additionalDots - 1 &&
+                        i <= fakeCount - additionalDots &&
+                        j >= additionalDots - 1 &&
+                        j <= fakeCount - additionalDots) {
+                        fakeMatrix[i][j] = 0;
+                        continue;
+                    }
+                    if (Math.sqrt((i - center) * (i - center) + (j - center) * (j - center)) > center) {
+                        fakeMatrix[i][j] = 0;
+                        continue;
+                    }
+                    //Get random dots from QR code to show it outside of QR code
+                    fakeMatrix[i][j] = this._qr.isDark(j - 2 * additionalDots < 0 ? j : j >= count ? j - 2 * additionalDots : j - additionalDots, i - 2 * additionalDots < 0 ? i : i >= count ? i - 2 * additionalDots : i - additionalDots)
+                        ? 1
+                        : 0;
+                }
+            }
+            for (let i = 0; i < fakeCount; i++) {
+                for (let j = 0; j < fakeCount; j++) {
+                    if (!fakeMatrix[i][j])
+                        continue;
+                    dot.draw(xFakeBeginning + i * dotSize, yFakeBeginning + j * dotSize, dotSize, (xOffset, yOffset) => {
+                        return !!fakeMatrix[i + xOffset]?.[j + yOffset];
+                    });
+                    if (dot._element && this._dotsClipPath) {
+                        this._dotsClipPath.appendChild(dot._element);
+                    }
+                }
+            }
+        }
+    }
+    drawCorners() {
+        if (!this._qr) {
+            throw "QR code is not defined";
+        }
+        const element = this._element;
+        const options = this._options;
+        if (!element) {
+            throw "Element code is not defined";
+        }
+        const count = this._qr.getModuleCount();
+        const minSize = Math.min(options.width, options.height);
+        const realQRSize = options.shape === exports.ShapeType.circle ? minSize / Math.sqrt(2) : minSize;
+        const dotSize = Math.floor(realQRSize / count);
+        const cornersSquareSize = dotSize * 7;
+        const cornersDotSize = dotSize * 3;
+        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
+        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
+        [
+            [0, 0, 0],
+            [1, 0, Math.PI / 2],
+            [0, 1, -Math.PI / 2]
+        ].forEach(([column, row, rotation]) => {
+            const x = xBeginning + column * dotSize * (count - 7);
+            const y = yBeginning + row * dotSize * (count - 7);
+            let cornersSquareClipPath = this._dotsClipPath;
+            let cornersDotClipPath = this._dotsClipPath;
+            if (options.cornersSquareOptions?.gradient || options.cornersSquareOptions?.color) {
+                cornersSquareClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
+                cornersSquareClipPath.setAttribute("id", `clip-path-corners-square-color-${column}-${row}`);
+                this._defs.appendChild(cornersSquareClipPath);
+                this._cornersSquareClipPath = this._cornersDotClipPath = cornersDotClipPath = cornersSquareClipPath;
+                this._createColor({
+                    options: options.cornersSquareOptions?.gradient,
+                    color: options.cornersSquareOptions?.color,
+                    additionalRotation: rotation,
+                    x,
+                    y,
+                    height: cornersSquareSize,
+                    width: cornersSquareSize,
+                    name: `corners-square-color-${column}-${row}`
+                });
+            }
+            if (options.cornersSquareOptions?.type) {
+                const cornersSquare = new QRCornerSquare({
+                    svg: this._element,
+                    type: options.cornersSquareOptions.type,
+                    document: this._document
+                });
+                cornersSquare.draw(x, y, cornersSquareSize, rotation);
+                if (cornersSquare._element && cornersSquareClipPath) {
+                    cornersSquareClipPath.appendChild(cornersSquare._element);
+                }
+            }
+            else {
+                const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
+                for (let i = 0; i < squareMask.length; i++) {
+                    for (let j = 0; j < squareMask[i].length; j++) {
+                        if (!squareMask[i]?.[j]) {
+                            continue;
+                        }
+                        dot.draw(x + i * dotSize, y + j * dotSize, dotSize, (xOffset, yOffset) => !!squareMask[i + xOffset]?.[j + yOffset]);
+                        if (dot._element && cornersSquareClipPath) {
+                            cornersSquareClipPath.appendChild(dot._element);
+                        }
+                    }
+                }
+            }
+            if (options.cornersDotOptions?.gradient || options.cornersDotOptions?.color) {
+                cornersDotClipPath = this._document.createElementNS("http://www.w3.org/2000/svg", "clipPath");
+                cornersDotClipPath.setAttribute("id", `clip-path-corners-dot-color-${column}-${row}`);
+                this._defs.appendChild(cornersDotClipPath);
+                this._cornersDotClipPath = cornersDotClipPath;
+                this._createColor({
+                    options: options.cornersDotOptions?.gradient,
+                    color: options.cornersDotOptions?.color,
+                    additionalRotation: rotation,
+                    x: x + dotSize * 2,
+                    y: y + dotSize * 2,
+                    height: cornersDotSize,
+                    width: cornersDotSize,
+                    name: `corners-dot-color-${column}-${row}`
+                });
+            }
+            if (options.cornersDotOptions?.type) {
+                const cornersDot = new QRCornerDot({
+                    svg: this._element,
+                    type: options.cornersDotOptions.type,
+                    document: this._document
+                });
+                cornersDot.draw(x + dotSize * 2, y + dotSize * 2, cornersDotSize, rotation);
+                if (cornersDot._element && cornersDotClipPath) {
+                    cornersDotClipPath.appendChild(cornersDot._element);
+                }
+            }
+            else {
+                const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
+                for (let i = 0; i < dotMask.length; i++) {
+                    for (let j = 0; j < dotMask[i].length; j++) {
+                        if (!dotMask[i]?.[j]) {
+                            continue;
+                        }
+                        dot.draw(x + i * dotSize, y + j * dotSize, dotSize, (xOffset, yOffset) => !!dotMask[i + xOffset]?.[j + yOffset]);
+                        if (dot._element && cornersDotClipPath) {
+                            cornersDotClipPath.appendChild(dot._element);
+                        }
+                    }
+                }
+            }
+        });
+    }
+    async drawImage({ width, height, count, dotSize }) {
+        const options = this._options;
+        const xBeginning = Math.floor((options.width - count * dotSize) / 2);
+        const yBeginning = Math.floor((options.height - count * dotSize) / 2);
+        const margin = options.imageOptions.margin * dotSize;
+        const dx = xBeginning + margin + (count * dotSize - width) / 2;
+        const dy = yBeginning + margin + (count * dotSize - height) / 2;
+        const dw = width - margin * 2;
+        const dh = height - margin * 2;
+        const imageUrl = await this._imageTools.toDataURL(options.image || "");
+        let image = this._document.createElementNS("http://www.w3.org/2000/svg", "image");
+        image.setAttribute("href", imageUrl || "");
+        if (imageUrl.startsWith("data:image/svg+xml;")) {
+            let data = imageUrl.substring(19);
+            const i = data.indexOf(",");
+            const encoding = data.substring(0, i);
+            data = data.substring(i + 1);
+            switch (encoding) {
+                case "base64":
+                    data = typeof atob == "function" ? atob(data) : Buffer.from(data, "base64").toString("utf8");
+                    break;
+                default:
+                    data = "";
+                    break;
+            }
+            if (data) {
+                const container = this._document.createElement("div");
+                container.innerHTML = data;
+                const rootEl = container.querySelector("svg");
+                if (rootEl)
+                    image = rootEl;
+            }
+        }
+        image.setAttribute("x", String(dx));
+        image.setAttribute("y", String(dy));
+        image.setAttribute("width", `${dw}px`);
+        image.setAttribute("height", `${dh}px`);
+        this._element.appendChild(image);
+    }
+    _createColor({ options, color, additionalRotation, x, y, height, width, name }) {
+        const size = width > height ? width : height;
+        const rect = this._document.createElementNS("http://www.w3.org/2000/svg", "rect");
+        rect.setAttribute("x", String(x));
+        rect.setAttribute("y", String(y));
+        rect.setAttribute("height", String(height));
+        rect.setAttribute("width", String(width));
+        rect.setAttribute("clip-path", `url('#clip-path-${name}')`);
+        if (options) {
+            let gradient;
+            if (options.type === exports.GradientType.radial) {
+                gradient = this._document.createElementNS("http://www.w3.org/2000/svg", "radialGradient");
+                gradient.setAttribute("id", name);
+                gradient.setAttribute("gradientUnits", "userSpaceOnUse");
+                gradient.setAttribute("fx", String(x + width / 2));
+                gradient.setAttribute("fy", String(y + height / 2));
+                gradient.setAttribute("cx", String(x + width / 2));
+                gradient.setAttribute("cy", String(y + height / 2));
+                gradient.setAttribute("r", String(size / 2));
+            }
+            else {
+                const rotation = ((options.rotation || 0) + additionalRotation) % (2 * Math.PI);
+                const positiveRotation = (rotation + 2 * Math.PI) % (2 * Math.PI);
+                let x0 = x + width / 2;
+                let y0 = y + height / 2;
+                let x1 = x + width / 2;
+                let y1 = y + height / 2;
+                if ((positiveRotation >= 0 && positiveRotation <= 0.25 * Math.PI) ||
+                    (positiveRotation > 1.75 * Math.PI && positiveRotation <= 2 * Math.PI)) {
+                    x0 = x0 - width / 2;
+                    y0 = y0 - (height / 2) * Math.tan(rotation);
+                    x1 = x1 + width / 2;
+                    y1 = y1 + (height / 2) * Math.tan(rotation);
+                }
+                else if (positiveRotation > 0.25 * Math.PI && positiveRotation <= 0.75 * Math.PI) {
+                    y0 = y0 - height / 2;
+                    x0 = x0 - width / 2 / Math.tan(rotation);
+                    y1 = y1 + height / 2;
+                    x1 = x1 + width / 2 / Math.tan(rotation);
+                }
+                else if (positiveRotation > 0.75 * Math.PI && positiveRotation <= 1.25 * Math.PI) {
+                    x0 = x0 + width / 2;
+                    y0 = y0 + (height / 2) * Math.tan(rotation);
+                    x1 = x1 - width / 2;
+                    y1 = y1 - (height / 2) * Math.tan(rotation);
+                }
+                else if (positiveRotation > 1.25 * Math.PI && positiveRotation <= 1.75 * Math.PI) {
+                    y0 = y0 + height / 2;
+                    x0 = x0 + width / 2 / Math.tan(rotation);
+                    y1 = y1 - height / 2;
+                    x1 = x1 - width / 2 / Math.tan(rotation);
+                }
+                gradient = this._document.createElementNS("http://www.w3.org/2000/svg", "linearGradient");
+                gradient.setAttribute("id", name);
+                gradient.setAttribute("gradientUnits", "userSpaceOnUse");
+                gradient.setAttribute("x1", String(Math.round(x0)));
+                gradient.setAttribute("y1", String(Math.round(y0)));
+                gradient.setAttribute("x2", String(Math.round(x1)));
+                gradient.setAttribute("y2", String(Math.round(y1)));
+            }
+            options.colorStops.forEach(({ offset, color }) => {
+                const stop = this._document.createElementNS("http://www.w3.org/2000/svg", "stop");
+                stop.setAttribute("offset", `${100 * offset}%`);
+                stop.setAttribute("stop-color", color);
+                gradient.appendChild(stop);
+            });
+            rect.setAttribute("fill", `url('#${name}')`);
+            this._defs.appendChild(gradient);
+        }
+        else if (color) {
+            rect.setAttribute("fill", color);
+        }
+        this._element.appendChild(rect);
+    }
 }
 
-class QRCodeStyling$1 {
-    constructor(options) {
-        this._options = options ? sanitizeOptions(mergeDeep(defaultOptions, options)) : defaultOptions;
-        this.update();
-    }
-    static _clearContainer(container) {
-        if (container) {
-            container.innerHTML = "";
-        }
-    }
-    _setupSvg() {
-        if (!this._qr) {
-            return;
-        }
-        this._options.width = this._options.height = 10 * this._qr.getModuleCount();
-        const qrSVG = new QRSVG(this._options);
-        this._svg = qrSVG.getElement();
-        this._svgDrawingPromise = qrSVG.drawQR(this._qr).then(() => {
-            if (!this._svg)
-                return;
-            this._extension?.(qrSVG.getElement(), this._options);
-        });
-    }
-    async _getElement() {
-        if (!this._qr)
-            throw "QR code is empty";
-        if (!this._svg || !this._svgDrawingPromise) {
-            this._setupSvg();
-        }
-        await this._svgDrawingPromise;
-        return this._svg;
-    }
-    update(options) {
-        QRCodeStyling$1._clearContainer(this._container);
-        this._options = options ? sanitizeOptions(mergeDeep(this._options, options)) : this._options;
-        if (!this._options.data) {
-            return;
-        }
-        this._qr = qrcode__default["default"](this._options.qrOptions.typeNumber, this._options.qrOptions.errorCorrectionLevel);
-        this._qr.addData(this._options.data, this._options.qrOptions.mode || getMode(this._options.data));
-        this._qr.make();
-        this._setupSvg();
-        this.append(this._container);
-    }
-    append(container) {
-        if (!container) {
-            return;
-        }
-        if (typeof container.appendChild !== "function") {
-            throw "Container should be a single DOM node";
-        }
-        if (this._svg) {
-            container.appendChild(this._svg);
-        }
-        this._container = container;
-    }
-    applyExtension(extension) {
-        if (!extension) {
-            throw "Extension function should be defined.";
-        }
-        this._extension = extension;
-        this.update();
-    }
-    deleteExtension() {
-        this._extension = undefined;
-        this.update();
-    }
-    async serialize() {
-        if (!this._qr)
-            throw "QR code is empty";
-        const element = await this._getElement();
-        if (!element) {
-            return;
-        }
-        const serializer = new XMLSerializer();
-        let source = serializer.serializeToString(element);
-        source = '<?xml version="1.0" standalone="no"?>\r\n' + source;
-        return source;
-    }
-}
+let QRCodeStyling$1 = class QRCodeStyling {
+    constructor(options) {
+        this._options = options ? sanitizeOptions(mergeDeep(defaultOptions, options)) : defaultOptions;
+        this.update();
+    }
+    static _clearContainer(container) {
+        if (container) {
+            container.innerHTML = "";
+        }
+    }
+    _setupSvg() {
+        if (!this._qr) {
+            return;
+        }
+        this._options.width = this._options.height = 10 * this._qr.getModuleCount();
+        const qrSVG = new QRSVG(this._options);
+        this._svg = qrSVG.getElement();
+        this._svgDrawingPromise = qrSVG.drawQR(this._qr).then(() => {
+            if (!this._svg)
+                return;
+            this._extension?.(qrSVG.getElement(), this._options);
+        });
+    }
+    async _getElement() {
+        if (!this._qr)
+            throw "QR code is empty";
+        if (!this._svg || !this._svgDrawingPromise) {
+            this._setupSvg();
+        }
+        await this._svgDrawingPromise;
+        return this._svg;
+    }
+    update(options) {
+        QRCodeStyling._clearContainer(this._container);
+        this._options = options ? sanitizeOptions(mergeDeep(this._options, options)) : this._options;
+        if (!this._options.data) {
+            return;
+        }
+        this._qr = qrcode(this._options.qrOptions.typeNumber, this._options.qrOptions.errorCorrectionLevel);
+        this._qr.addData(this._options.data, this._options.qrOptions.mode || getMode(this._options.data));
+        this._qr.make();
+        this._setupSvg();
+        this.append(this._container);
+    }
+    append(container) {
+        if (!container) {
+            return;
+        }
+        if (typeof container.appendChild !== "function") {
+            throw "Container should be a single DOM node";
+        }
+        if (this._svg) {
+            container.appendChild(this._svg);
+        }
+        this._container = container;
+    }
+    applyExtension(extension) {
+        if (!extension) {
+            throw "Extension function should be defined.";
+        }
+        this._extension = extension;
+        this.update();
+    }
+    deleteExtension() {
+        this._extension = undefined;
+        this.update();
+    }
+    async serialize() {
+        if (!this._qr)
+            throw "QR code is empty";
+        const element = await this._getElement();
+        if (!element) {
+            return;
+        }
+        const serializer = new XMLSerializer();
+        let source = serializer.serializeToString(element);
+        source = '<?xml version="1.0" standalone="no"?>\r\n' + source;
+        return source;
+    }
+};
 
-class QRCodeStyling extends QRCodeStyling$1 {
-    constructor(options) {
-        const dom = new jsdom.JSDOM("<!DOCTYPE html>");
-        const imageCache = new Map();
-        const loadImage = async (url) => {
-            if (typeof url == "string") {
-                let pr = imageCache.get(url);
-                if (pr)
-                    return pr;
-                pr = fetch__default["default"](url).then((res) => res
-                    .arrayBuffer()
-                    .then((buff) => Buffer.from(buff))
-                    .then(async (data) => ({
-                    contentType: res.headers.get("Content-Type") || (await fileType.fromBuffer(data).then((r) => r?.mime)),
-                    data
-                })));
-                imageCache.set(url, pr);
-                return pr;
-            }
-            else {
-                const buff = Buffer.from(url);
-                const mime = await fileType.fromBuffer(buff).then((r) => r?.mime);
-                return {
-                    contentType: mime,
-                    data: buff
-                };
-            }
-        };
-        global.XMLSerializer = dom.window.XMLSerializer;
-        super({
-            ...options,
-            document: options.document || dom.window.document,
-            imageTools: options.imageTools || {
-                toDataURL: (url) => loadImage(url).then(({ contentType, data }) => `data:${contentType?.replace("application/xml", "image/svg+xml")};base64,${data.toString("base64")}`),
-                getSize: async (options) => {
-                    if (!options.image) {
-                        throw new Error("Image is not defined");
-                    }
-                    const { data } = Buffer.isBuffer(options.image) ? { data: options.image } : await loadImage(options.image);
-                    const meta = await sharp__default["default"](data).metadata();
-                    return {
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        width: meta.width,
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        height: meta.height
-                    };
-                }
-            }
-        });
-    }
+class QRCodeStyling extends QRCodeStyling$1 {
+    constructor(options) {
+        const dom = new jsdom.JSDOM("<!DOCTYPE html>");
+        const imageCache = new Map();
+        const loadImage = async (url) => {
+            if (typeof url == "string") {
+                let pr = imageCache.get(url);
+                if (pr)
+                    return pr;
+                pr = fetch(url).then((res) => res
+                    .arrayBuffer()
+                    .then((buff) => Buffer.from(buff))
+                    .then(async (data) => ({
+                    contentType: res.headers.get("Content-Type") || (await fileType.fromBuffer(data).then((r) => r?.mime)),
+                    data
+                })));
+                imageCache.set(url, pr);
+                return pr;
+            }
+            else {
+                const buff = Buffer.from(url);
+                const mime = await fileType.fromBuffer(buff).then((r) => r?.mime);
+                return {
+                    contentType: mime,
+                    data: buff
+                };
+            }
+        };
+        global.XMLSerializer = dom.window.XMLSerializer;
+        super({
+            ...options,
+            document: options.document || dom.window.document,
+            imageTools: options.imageTools || {
+                toDataURL: (url) => loadImage(url).then(({ contentType, data }) => `data:${contentType?.replace("application/xml", "image/svg+xml")};base64,${data.toString("base64")}`),
+                getSize: async (options) => {
+                    if (!options.image) {
+                        throw new Error("Image is not defined");
+                    }
+                    const { data } = Buffer.isBuffer(options.image) ? { data: options.image } : await loadImage(options.image);
+                    const meta = await sharp(data).metadata();
+                    return {
+                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                        width: meta.width,
+                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                        height: meta.height
+                    };
+                }
+            }
+        });
+    }
 }
 
 exports.ErrorCorrectionPercents = ErrorCorrectionPercents;