@liquid-js/qr-code-styling 4.0.8 → 4.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,6 +14,7 @@ export declare class QRDot {
14
14
  private basicCornerRounded;
15
15
  private basicCornerExtraRounded;
16
16
  private basicCornersRounded;
17
+ private basicWave;
17
18
  private drawDot;
18
19
  private drawRandomDot;
19
20
  private drawSquare;
@@ -26,4 +27,5 @@ export declare class QRDot {
26
27
  private drawExtraRounded;
27
28
  private drawClassy;
28
29
  private drawClassyRounded;
30
+ private drawWave;
29
31
  }
@@ -45,7 +45,7 @@ function sanitizeGradient(gradient_newGradient) {
45
45
  DotType.extraRounded = "extra-rounded", DotType.verticalLine = "vertical-line",
46
46
  DotType.horizontalLine = "horizontal-line", DotType.classy = "classy", DotType.classyRounded = "classy-rounded",
47
47
  DotType.square = "square", DotType.smallSquare = "small-square", DotType.tinySquare = "tiny-square",
48
- DotType.diamond = "diamond", (CornerDotType = CornerDotType ||= {}).dot = "dot",
48
+ DotType.diamond = "diamond", DotType.wave = "wave", (CornerDotType = CornerDotType ||= {}).dot = "dot",
49
49
  CornerDotType.square = "square", CornerDotType.heart = "heart", CornerDotType.extraRounded = "extra-rounded",
50
50
  CornerDotType.classy = "classy", CornerDotType.outpoint = "outpoint", CornerDotType.inpoint = "inpoint",
51
51
  (CornerSquareType = CornerSquareType ||= {}).dot = "dot", CornerSquareType.square = "square",
@@ -507,6 +507,10 @@ class QRDot {
507
507
  drawFunction = this.drawTinySquare;
508
508
  break;
509
509
 
510
+ case DotType.wave:
511
+ drawFunction = this.drawWave;
512
+ break;
513
+
510
514
  default:
511
515
  drawFunction = this.drawSquare;
512
516
  }
@@ -577,6 +581,16 @@ class QRDot {
577
581
  }
578
582
  });
579
583
  }
584
+ basicWave(args) {
585
+ let {size, x, y} = args, a1 = 5 * Math.PI / 180, a2 = 65 * Math.PI / 180, c23x = size * (.95 - .65 * Math.cos(a1)), c23y = size * (1 - .65 * Math.sin(a1)), c31x = -size * Math.cos(a2) / 2, c31y = -size * Math.sin(a2) / 2;
586
+ this.rotateFigure({
587
+ ...args,
588
+ draw: () => {
589
+ this._element = this.document.createElementNS("http://www.w3.org/2000/svg", "path"),
590
+ this._element.setAttribute("d", svgPath`M ${x} ${y} c 0 ${.65 * size} ${c23x} ${c23y} ${.95 * size} ${size} c ${c31x} ${c31y} ${size * (1 - .95)} ${-size / 2} ${size * (1 - .95)} ${-size} z`);
591
+ }
592
+ });
593
+ }
580
594
  drawDot({x, y, size}) {
581
595
  this.basicDot({
582
596
  x,
@@ -779,6 +793,33 @@ class QRDot {
779
793
  rotation: -Math.PI / 2
780
794
  });
781
795
  }
796
+ drawWave({x, y, size, getNeighbor: bottomNeighbor}) {
797
+ let leftNeighbor = bottomNeighbor ? +bottomNeighbor(-1, 0) : 0, rightNeighbor = bottomNeighbor ? +bottomNeighbor(1, 0) : 0;
798
+ var rotation = bottomNeighbor ? +bottomNeighbor(0, -1) : 0, neighborsCount = leftNeighbor + rightNeighbor + rotation + (bottomNeighbor = bottomNeighbor ? +bottomNeighbor(0, 1) : 0);
799
+ 0 === neighborsCount ? this.basicDot({
800
+ x,
801
+ y,
802
+ size,
803
+ rotation: 0
804
+ }) : neighborsCount > 2 || leftNeighbor && rightNeighbor || rotation && bottomNeighbor ? this.basicSquare({
805
+ x,
806
+ y,
807
+ size,
808
+ rotation: 0
809
+ }) : 2 === neighborsCount ? (neighborsCount = 0, leftNeighbor && rotation ? neighborsCount = Math.PI / 2 : rotation && rightNeighbor ? neighborsCount = Math.PI : rightNeighbor && bottomNeighbor && (neighborsCount = -Math.PI / 2),
810
+ this.basicCornerExtraRounded({
811
+ x,
812
+ y,
813
+ size,
814
+ rotation: neighborsCount
815
+ })) : 1 === neighborsCount && (rotation = 0, rightNeighbor ? rotation = Math.PI / 2 : bottomNeighbor ? rotation = Math.PI : leftNeighbor && (rotation = -Math.PI / 2),
816
+ this.basicWave({
817
+ x,
818
+ y,
819
+ size,
820
+ rotation
821
+ }));
822
+ }
782
823
  }
783
824
 
784
825
  let browserImageTools = {
@@ -833,7 +874,9 @@ function parseColor(base) {
833
874
  };
834
875
  }
835
876
 
836
- let 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 ] ], 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 ] ];
877
+ let 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 ] ], cornerSquareTypes = new Set(Object.values(CornerSquareType));
878
+
879
+ let 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 ] ], cornerDotTypes = new Set(Object.values(CornerDotType));
837
880
 
838
881
  class QRSVG {
839
882
  options;
@@ -1037,7 +1080,7 @@ class QRSVG {
1037
1080
  let x = xBeginning + column_cornersDot * dotSize * (count - 7), y = yBeginning + row * dotSize * (count - 7);
1038
1081
  var cornersDotMaskGroup_cornersSquareMask = this.dotsMask;
1039
1082
  let cornersSquareMaskGroup = this.dotsMaskGroup;
1040
- var cornersDotMask_cornersSquare_dot = this.dotsMask;
1083
+ var val, cornersDotMask_cornersSquare_dot = this.dotsMask;
1041
1084
  if (cornersDotMaskGroup_cornersSquareMask = this.dotsMaskGroup, (options.cornersSquareOptions?.gradient || options.cornersSquareOptions?.color) && ([cornersDotMaskGroup_cornersSquareMask, cornersSquareMaskGroup] = this.createMask(`mask-corners-square-color-${column_cornersDot}-${row}`),
1042
1085
  this.defs.appendChild(cornersDotMaskGroup_cornersSquareMask), cornersDotMask_cornersSquare_dot = cornersDotMaskGroup_cornersSquareMask,
1043
1086
  cornersDotMaskGroup_cornersSquareMask = cornersSquareMaskGroup, this.createColor({
@@ -1049,14 +1092,14 @@ class QRSVG {
1049
1092
  height: cornersSquareSize,
1050
1093
  width: cornersSquareSize,
1051
1094
  name: `corners-square-color-${column_cornersDot}-${row}`
1052
- })), options.cornersSquareOptions?.type) (cornersDotMask_cornersSquare_dot = new QRCornerSquare(options.cornersSquareOptions.type, this.document)).draw({
1095
+ })), val = options.cornersSquareOptions?.type, val && cornerSquareTypes.has(val)) (cornersDotMask_cornersSquare_dot = new QRCornerSquare(options.cornersSquareOptions.type, this.document)).draw({
1053
1096
  x,
1054
1097
  y,
1055
1098
  size: cornersSquareSize,
1056
1099
  rotation: dot
1057
1100
  }), cornersDotMask_cornersSquare_dot.element && cornersSquareMaskGroup && cornersSquareMaskGroup.appendChild(cornersDotMask_cornersSquare_dot.element),
1058
1101
  cornersDotMask_cornersSquare_dot.fill && this.lightDotsMaskGroup && this.lightDotsMaskGroup.appendChild(cornersDotMask_cornersSquare_dot.fill); else {
1059
- cornersDotMask_cornersSquare_dot = new QRDot(options.dotsOptions.type, this.document);
1102
+ cornersDotMask_cornersSquare_dot = new QRDot(options.cornersSquareOptions?.type || options.dotsOptions.type, this.document);
1060
1103
  for (let i = 0; i < squareMask.length; i++) for (let j = 0; j < squareMask[i].length; j++) squareMask[i]?.[j] ? (cornersDotMask_cornersSquare_dot.draw({
1061
1104
  x: x + i * dotSize,
1062
1105
  y: y + j * dotSize,
@@ -1085,13 +1128,15 @@ class QRSVG {
1085
1128
  height: cornersDotSize,
1086
1129
  width: cornersDotSize,
1087
1130
  name: `corners-dot-color-${column_cornersDot}-${row}`
1088
- })), options.cornersDotOptions?.type) (column_cornersDot = new QRCornerDot(options.cornersDotOptions.type, this.document)).draw({
1131
+ })), function(val) {
1132
+ return !(!val || !cornerDotTypes.has(val));
1133
+ }(options.cornersDotOptions?.type)) (column_cornersDot = new QRCornerDot(options.cornersDotOptions.type, this.document)).draw({
1089
1134
  x: x + 2 * dotSize,
1090
1135
  y: y + 2 * dotSize,
1091
1136
  size: cornersDotSize,
1092
1137
  rotation: dot
1093
1138
  }), column_cornersDot.element && cornersDotMaskGroup_cornersSquareMask && cornersDotMaskGroup_cornersSquareMask.appendChild(column_cornersDot.element); else {
1094
- dot = new QRDot(options.dotsOptions.type, this.document);
1139
+ dot = new QRDot(options.cornersDotOptions?.type || options.dotsOptions.type, this.document);
1095
1140
  for (let i = 0; i < dotMask.length; i++) for (let j = 0; j < dotMask[i].length; j++) dotMask[i]?.[j] && (dot.draw({
1096
1141
  x: x + i * dotSize,
1097
1142
  y: y + j * dotSize,