@liquid-js/qr-code-styling 3.0.0-0 → 3.0.0-1

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

@@ -1266,16 +1266,6 @@ class QRSVG {
         const dot = new QRDot({ svg: this._element, type: options.dotsOptions.type, document: this._document });
         [this._dotsMask, this._dotsMaskGroup] = this._createMask("mask-dot-color");
         this._defs.appendChild(this._dotsMask);
-        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)) {
@@ -1296,12 +1286,18 @@ class QRSVG {
                 }
             }
         }
+        let colorX = xBeginning;
+        let colorY = yBeginning;
+        let colorCount = count;
         if (options.shape === ShapeType.circle) {
             const margin = (this._options.backgroundOptions && this._options.backgroundOptions.margin) || 0;
             const additionalDots = Math.floor((minSize / dotSize - count - 2 * margin) / 2);
             const fakeCount = count + additionalDots * 2;
             const xFakeBeginning = xBeginning - additionalDots * dotSize;
             const yFakeBeginning = yBeginning - additionalDots * dotSize;
+            colorX = xFakeBeginning;
+            colorY = yFakeBeginning;
+            colorCount = count + additionalDots * 2;
             const fakeMatrix = [];
             const center = Math.floor(fakeCount / 2);
             for (let i = 0; i < fakeCount; i++) {
@@ -1337,6 +1333,16 @@ class QRSVG {
                 }
             }
         }
+        this._createColor({
+            options: options.dotsOptions?.gradient,
+            color: options.dotsOptions.color,
+            additionalRotation: 0,
+            x: colorX,
+            y: colorY,
+            height: colorCount * dotSize,
+            width: colorCount * dotSize,
+            name: "dot-color"
+        });
     }
     drawCorners() {
         if (!this._qr) {