custom-qrcode-browser/lib/index.mjs.map

[](https://github.com/CyrilDesch/custom-qrcode-browser/actions/workflows/continuous-integrations.yaml) [![L

{"version":3,"file":"index.mjs","sources":["../src/encode/QrCodeMatrix.ts","../src/encode/QrCodedText.ts","../src/utils/SvgUtils.ts","../src/style/QrColor.ts","../src/style/shapes/QrBackground.ts","../src/style/shapes/QrPixelShape.ts","../src/style/shapes/QrEyeShape.ts","../src/utils/Neighbors.ts","../src/style/shapes/QrEyeFrameShape.ts","../src/style/shapes/QrLogoShape.ts","../src/style/shapes/QrMatrixPixelShape.ts","../src/style/shapes/QrShape.ts","../src/style/shapes/QrTimingLineShape.ts","../src/options/QrShapes.ts","../src/style/shapes/QrAlignmentPatternShape.ts","../src/mapper/QrShapesMapper.ts","../src/options/QrOptions.ts","../src/style/QrShapesDesigner.ts","../src/encode/QrData.ts","../src/mapper/QrDataMapper.ts","../src/core/QrCodeGenerator.ts"],"sourcesContent":["import type { QrCodedText } from \"./QrCodedText\";\n\nexport enum PixelType {\n  DarkPixel = \"DarkPixel\",\n  Background = \"Background\",\n}\n\n/**\n * Represents a matrix with pixel types for QrCode.\n * The matrix is now a 2D array.\n */\nexport class QrCodeMatrix {\n  private matrix: PixelType[][];\n  public size: number;\n  public origin = 0;\n\n  constructor(size: number) {\n    this.size = size;\n    this.matrix = Array.from({ length: size }, () =>\n      Array(size).fill(PixelType.Background),\n    );\n  }\n\n  /**\n   * Retrieves the pixel type at a given position (i, j).\n   * Throws an error if the indices are out of bounds.\n   */\n  get(i: number, j: number): PixelType {\n    if (this.isOutOfBounds(i, j)) {\n      throw new RangeError(\n        `Index (${i}, ${j}) is out of bounds for a matrix of size ${this.size}.`,\n      );\n    }\n    return this.matrix[i]![j]!;\n  }\n\n  /**\n   * Sets the pixel type at a given position (i, j).\n   * Throws an error if the indices are out of bounds.\n   */\n  set(i: number, j: number, type: PixelType): void {\n    if (this.isOutOfBounds(i, j)) {\n      throw new RangeError(\n        `Index (${i}, ${j}) is out of bounds for a matrix of size ${this.size}.`,\n      );\n    }\n    this.matrix[i]![j] = type;\n  }\n\n  /**\n   * Checks if the given indices are out of bounds.\n   */\n  isOutOfBounds(i: number, j: number): boolean {\n    return i < 0 || i >= this.size || j < 0 || j >= this.size;\n  }\n\n  /**\n   * Converts a byte matrix (base QrCode) into a QrCodeMatrix with pixel types.\n   * Ensures that the input matrix is square.\n   */\n  static fromQrMatrix(byteMatrix: QrCodedText): QrCodeMatrix {\n    const { size } = byteMatrix;\n    const qrMatrix = new QrCodeMatrix(size);\n\n    for (let i = 0; i < size; i++) {\n      for (let j = 0; j < size; j++) {\n        const value = byteMatrix.getModule(i, j);\n        qrMatrix.set(i, j, value ? PixelType.DarkPixel : PixelType.Background);\n      }\n    }\n    return qrMatrix;\n  }\n}\n","type bit = number;\ntype byte = number;\ntype int = number;\n\n/*---- QR Code symbol class ----*/\n\n/*\n * A QR Code symbol, which is a type of two-dimension barcode.\n * Invented by Denso Wave and described in the ISO/IEC 18004 standard.\n * Instances of this class represent an immutable square grid of dark and light cells.\n * The class provides static factory functions to create a QR Code from text or binary data.\n * The class covers the QR Code Model 2 specification, supporting all versions (sizes)\n * from 1 to 40, all 4 error correction levels, and 4 character encoding modes.\n *\n * Ways to create a QR Code object:\n * - High level: Take the payload data and call QrCode.encodeText() or QrCode.encodeBinary().\n * - Mid level: Custom-make the list of segments and call QrCode.encodeSegments().\n * - Low level: Custom-make the array of data codeword bytes (including\n *   segment headers and final padding, excluding error correction codewords),\n *   supply the appropriate version number, and call the QrCode() constructor.\n * (Note that all ways require supplying the desired error correction level.)\n */\nexport class QrCodedText {\n  /*-- Static factory functions (high level) --*/\n\n  // Returns a QR Code representing the given Unicode text string at the given error correction level.\n  // As a conservative upper bound, this function is guaranteed to succeed for strings that have 738 or fewer\n  // Unicode code points (not UTF-16 code units) if the low error correction level is used. The smallest possible\n  // QR Code version is automatically chosen for the output. The ECC level of the result may be higher than the\n  // ecl argument if it can be done without increasing the version.\n  public static encodeText(\n    text: string,\n    ecl: QrErrorCorrectionLevel,\n  ): QrCodedText {\n    const segs: Array<QrSegment> = QrSegment.makeSegments(text);\n    return QrCodedText.encodeSegments(segs, ecl);\n  }\n\n  /*-- Static factory functions (mid level) --*/\n\n  // Returns a QR Code representing the given segments with the given encoding parameters.\n  // The smallest possible QR Code version within the given range is automatically\n  // chosen for the output. Iff boostEcl is true, then the ECC level of the result\n  // may be higher than the ecl argument if it can be done without increasing the\n  // version. The mask number is either between 0 to 7 (inclusive) to force that\n  // mask, or -1 to automatically choose an appropriate mask (which may be slow).\n  // This function allows the user to create a custom sequence of segments that switches\n  // between modes (such as alphanumeric and byte) to encode text in less space.\n  // This is a mid-level API; the high-level API is encodeText() and encodeBinary().\n  public static encodeSegments(\n    segs: Readonly<Array<QrSegment>>,\n    ecl: QrErrorCorrectionLevel,\n    minVersion: int = 1,\n    maxVersion: int = 40,\n    mask: int = -1,\n    boostEcl: boolean = true,\n  ): QrCodedText {\n    if (\n      !(\n        QrCodedText.MIN_VERSION <= minVersion &&\n        minVersion <= maxVersion &&\n        maxVersion <= QrCodedText.MAX_VERSION\n      ) ||\n      mask < -1 ||\n      mask > 7\n    )\n      throw new RangeError(\"Invalid value\");\n\n    // Find the minimal version number to use\n    let version: int;\n    let dataUsedBits: int;\n    for (version = minVersion; ; version++) {\n      const dataCapacityBits: int =\n        QrCodedText.getNumDataCodewords(version, ecl) * 8; // Number of data bits available\n      const usedBits: number = QrSegment.getTotalBits(segs, version);\n      if (usedBits <= dataCapacityBits) {\n        dataUsedBits = usedBits;\n        break; // This version number is found to be suitable\n      }\n      if (version >= maxVersion)\n        // All versions in the range could not fit the given data\n        throw new RangeError(\"Data too long\");\n    }\n\n    // Increase the error correction level while the data still fits in the current version number\n    for (const newEcl of [\n      QrErrorCorrectionLevel.MEDIUM,\n      QrErrorCorrectionLevel.QUARTILE,\n      QrErrorCorrectionLevel.HIGH,\n    ]) {\n      // From low to high\n      if (\n        boostEcl &&\n        dataUsedBits <= QrCodedText.getNumDataCodewords(version, newEcl) * 8\n      )\n        ecl = newEcl;\n    }\n\n    // Concatenate all segments to create the data bit string\n    const bb: Array<bit> = [];\n    for (const seg of segs) {\n      appendBits(seg.mode.modeBits, 4, bb);\n      appendBits(seg.numChars, seg.mode.numCharCountBits(version), bb);\n      for (const b of seg.getData()) bb.push(b);\n    }\n    assert(bb.length == dataUsedBits);\n\n    // Add terminator and pad up to a byte if applicable\n    const dataCapacityBits: int =\n      QrCodedText.getNumDataCodewords(version, ecl) * 8;\n    assert(bb.length <= dataCapacityBits);\n    appendBits(0, Math.min(4, dataCapacityBits - bb.length), bb);\n    appendBits(0, (8 - (bb.length % 8)) % 8, bb);\n    assert(bb.length % 8 == 0);\n\n    // Pad with alternating bytes until data capacity is reached\n    for (\n      let padByte = 0xec;\n      bb.length < dataCapacityBits;\n      padByte ^= 0xec ^ 0x11\n    )\n      appendBits(padByte, 8, bb);\n\n    // Pack bits into bytes in big endian\n    const dataCodewords: Array<byte> = [];\n    while (dataCodewords.length * 8 < bb.length) dataCodewords.push(0);\n    bb.forEach(\n      (b: bit, i: int) =>\n        (dataCodewords[i >>> 3] =\n          (dataCodewords[i >>> 3] ?? 0) | (b << (7 - (i & 7)))),\n    );\n\n    // Create the QR Code object\n    return new QrCodedText(version, ecl, dataCodewords, mask);\n  }\n\n  /*-- Fields --*/\n\n  // The width and height of this QR Code, measured in modules, between\n  // 21 and 177 (inclusive). This is equal to version * 4 + 17.\n  public readonly size: int;\n\n  // The index of the mask pattern used in this QR Code, which is between 0 and 7 (inclusive).\n  // Even if a QR Code is created with automatic masking requested (mask = -1),\n  // the resulting object still has a mask value between 0 and 7.\n  public readonly mask: int;\n\n  // The modules of this QR Code (false = light, true = dark).\n  // Immutable after constructor finishes. Accessed through getModule().\n  public readonly modules: Array<Array<boolean>> = [];\n\n  // Indicates function modules that are not subjected to masking. Discarded when constructor finishes.\n  private readonly isFunction: Array<Array<boolean>> = [];\n\n  /*-- Constructor (low level) and fields --*/\n\n  // Creates a new QR Code with the given version number,\n  // error correction level, data codeword bytes, and mask number.\n  // This is a low-level API that most users should not use directly.\n  // A mid-level API is the encodeSegments() function.\n  public constructor(\n    // The version number of this QR Code, which is between 1 and 40 (inclusive).\n    // This determines the size of this barcode.\n    public readonly version: int,\n\n    // The error correction level used in this QR Code.\n    public readonly errorCorrectionLevel: QrErrorCorrectionLevel,\n\n    dataCodewords: Readonly<Array<byte>>,\n\n    msk: int,\n  ) {\n    // Check scalar arguments\n    if (version < QrCodedText.MIN_VERSION || version > QrCodedText.MAX_VERSION)\n      throw new RangeError(\"Version value out of range\");\n    if (msk < -1 || msk > 7) throw new RangeError(\"Mask value out of range\");\n    this.size = version * 4 + 17;\n\n    // Initialize both grids to be size*size arrays of Boolean false\n    const row: Array<boolean> = [];\n    for (let i = 0; i < this.size; i++) row.push(false);\n    for (let i = 0; i < this.size; i++) {\n      this.modules.push(row.slice()); // Initially all light\n      this.isFunction.push(row.slice());\n    }\n\n    // Compute ECC, draw modules\n    this.drawFunctionPatterns();\n    const allCodewords: Array<byte> = this.addEccAndInterleave(dataCodewords);\n    this.drawCodewords(allCodewords);\n\n    // Do masking\n    if (msk == -1) {\n      // Automatically choose best mask\n      let minPenalty: int = 1000000000;\n      for (let i = 0; i < 8; i++) {\n        this.applyMask(i);\n        this.drawFormatBits(i);\n        const penalty: int = this.getPenaltyScore();\n        if (penalty < minPenalty) {\n          msk = i;\n          minPenalty = penalty;\n        }\n        this.applyMask(i); // Undoes the mask due to XOR\n      }\n    }\n    assert(0 <= msk && msk <= 7);\n    this.mask = msk;\n    this.applyMask(msk); // Apply the final choice of mask\n    this.drawFormatBits(msk); // Overwrite old format bits\n\n    this.isFunction = [];\n  }\n\n  /*-- Accessor methods --*/\n\n  // Returns the color of the module (pixel) at the given coordinates, which is false\n  // for light or true for dark. The top left corner has the coordinates (x=0, y=0).\n  // If the given coordinates are out of bounds, then false (light) is returned.\n  public getModule(x: int, y: int): boolean {\n    return (\n      (0 <= x &&\n        x < this.size &&\n        0 <= y &&\n        y < this.size &&\n        this.modules?.[y]?.[x]) ||\n      false\n    );\n  }\n\n  /*-- Private helper methods for constructor: Drawing function modules --*/\n\n  // Reads this object's version field, and draws and marks all function modules.\n  private drawFunctionPatterns(): void {\n    // Draw horizontal and vertical timing patterns\n    for (let i = 0; i < this.size; i++) {\n      this.setFunctionModule(6, i, i % 2 == 0);\n      this.setFunctionModule(i, 6, i % 2 == 0);\n    }\n\n    // Draw 3 finder patterns (all corners except bottom right; overwrites some timing modules)\n    this.drawFinderPattern(3, 3);\n    this.drawFinderPattern(this.size - 4, 3);\n    this.drawFinderPattern(3, this.size - 4);\n\n    // Draw numerous alignment patterns\n    const alignPatPos: Array<int> = this.getAlignmentPatternPositions();\n    const numAlign: int = alignPatPos.length;\n    for (let i = 0; i < numAlign; i++) {\n      for (let j = 0; j < numAlign; j++) {\n        // Don't draw on the three finder corners\n        if (\n          !(\n            (i == 0 && j == 0) ||\n            (i == 0 && j == numAlign - 1) ||\n            (i == numAlign - 1 && j == 0)\n          )\n        )\n          this.drawAlignmentPattern(alignPatPos[i]!, alignPatPos[j]!);\n      }\n    }\n\n    // Draw configuration data\n    this.drawFormatBits(0); // Dummy mask value; overwritten later in the constructor\n    this.drawVersion();\n  }\n\n  // Draws two copies of the format bits (with its own error correction code)\n  // based on the given mask and this object's error correction level field.\n  private drawFormatBits(mask: int): void {\n    // Calculate error correction code and pack bits\n    const data: int = (this.errorCorrectionLevel.formatBits << 3) | mask; // errCorrLvl is uint2, mask is uint3\n    let rem: int = data;\n    for (let i = 0; i < 10; i++) rem = (rem << 1) ^ ((rem >>> 9) * 0x537);\n    const bits = ((data << 10) | rem) ^ 0x5412; // uint15\n    assert(bits >>> 15 == 0);\n\n    // Draw first copy\n    for (let i = 0; i <= 5; i++) this.setFunctionModule(8, i, getBit(bits, i));\n    this.setFunctionModule(8, 7, getBit(bits, 6));\n    this.setFunctionModule(8, 8, getBit(bits, 7));\n    this.setFunctionModule(7, 8, getBit(bits, 8));\n    for (let i = 9; i < 15; i++)\n      this.setFunctionModule(14 - i, 8, getBit(bits, i));\n\n    // Draw second copy\n    for (let i = 0; i < 8; i++)\n      this.setFunctionModule(this.size - 1 - i, 8, getBit(bits, i));\n    for (let i = 8; i < 15; i++)\n      this.setFunctionModule(8, this.size - 15 + i, getBit(bits, i));\n    this.setFunctionModule(8, this.size - 8, true); // Always dark\n  }\n\n  // Draws two copies of the version bits (with its own error correction code),\n  // based on this object's version field, iff 7 <= version <= 40.\n  private drawVersion(): void {\n    if (this.version < 7) return;\n\n    // Calculate error correction code and pack bits\n    let rem: int = this.version; // version is uint6, in the range [7, 40]\n    for (let i = 0; i < 12; i++) rem = (rem << 1) ^ ((rem >>> 11) * 0x1f25);\n    const bits: int = (this.version << 12) | rem; // uint18\n    assert(bits >>> 18 == 0);\n\n    // Draw two copies\n    for (let i = 0; i < 18; i++) {\n      const color: boolean = getBit(bits, i);\n      const a: int = this.size - 11 + (i % 3);\n      const b: int = Math.floor(i / 3);\n      this.setFunctionModule(a, b, color);\n      this.setFunctionModule(b, a, color);\n    }\n  }\n\n  // Draws a 9*9 finder pattern including the border separator,\n  // with the center module at (x, y). Modules can be out of bounds.\n  private drawFinderPattern(x: int, y: int): void {\n    for (let dy = -4; dy <= 4; dy++) {\n      for (let dx = -4; dx <= 4; dx++) {\n        const dist: int = Math.max(Math.abs(dx), Math.abs(dy)); // Chebyshev/infinity norm\n        const xx: int = x + dx;\n        const yy: int = y + dy;\n        if (0 <= xx && xx < this.size && 0 <= yy && yy < this.size)\n          this.setFunctionModule(xx, yy, dist != 2 && dist != 4);\n      }\n    }\n  }\n\n  // Draws a 5*5 alignment pattern, with the center module\n  // at (x, y). All modules must be in bounds.\n  private drawAlignmentPattern(x: int, y: int): void {\n    for (let dy = -2; dy <= 2; dy++) {\n      for (let dx = -2; dx <= 2; dx++)\n        this.setFunctionModule(\n          x + dx,\n          y + dy,\n          Math.max(Math.abs(dx), Math.abs(dy)) != 1,\n        );\n    }\n  }\n\n  // Sets the color of a module and marks it as a function module.\n  // Only used by the constructor. Coordinates must be in bounds.\n  private setFunctionModule(x: int, y: int, isDark: boolean): void {\n    this.modules[y]![x] = isDark;\n    this.isFunction[y]![x] = true;\n  }\n\n  /*-- Private helper methods for constructor: Codewords and masking --*/\n\n  // Returns a new byte string representing the given data with the appropriate error correction\n  // codewords appended to it, based on this object's version and error correction level.\n  private addEccAndInterleave(data: Readonly<Array<byte>>): Array<byte> {\n    const ver: int = this.version;\n    const ecl: QrErrorCorrectionLevel = this.errorCorrectionLevel;\n    if (data.length != QrCodedText.getNumDataCodewords(ver, ecl))\n      throw new RangeError(\"Invalid argument\");\n\n    // Calculate parameter numbers\n    const numBlocks: int =\n      QrCodedText.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal]![ver]!;\n    const blockEccLen: int =\n      QrCodedText.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal]![ver]!;\n    const rawCodewords: int = Math.floor(\n      QrCodedText.getNumRawDataModules(ver) / 8,\n    );\n    const numShortBlocks: int = numBlocks - (rawCodewords % numBlocks);\n    const shortBlockLen: int = Math.floor(rawCodewords / numBlocks);\n\n    // Split data into blocks and append ECC to each block\n    const blocks: Array<Array<byte>> = [];\n    const rsDiv: Array<byte> =\n      QrCodedText.reedSolomonComputeDivisor(blockEccLen);\n    for (let i = 0, k = 0; i < numBlocks; i++) {\n      const dat: Array<byte> = data.slice(\n        k,\n        k + shortBlockLen - blockEccLen + (i < numShortBlocks ? 0 : 1),\n      );\n      k += dat.length;\n      const ecc: Array<byte> = QrCodedText.reedSolomonComputeRemainder(\n        dat,\n        rsDiv,\n      );\n      if (i < numShortBlocks) dat.push(0);\n      blocks.push(dat.concat(ecc));\n    }\n\n    // Interleave (not concatenate) the bytes from every block into a single sequence\n    const result: Array<byte> = [];\n    for (let i = 0; i < blocks[0]!.length; i++) {\n      blocks.forEach((block, j) => {\n        // Skip the padding byte in short blocks\n        if (i != shortBlockLen - blockEccLen || j >= numShortBlocks)\n          result.push(block[i]!);\n      });\n    }\n    assert(result.length == rawCodewords);\n    return result;\n  }\n\n  // Draws the given sequence of 8-bit codewords (data and error correction) onto the entire\n  // data area of this QR Code. Function modules need to be marked off before this is called.\n  private drawCodewords(data: Readonly<Array<byte>>): void {\n    if (\n      data.length !=\n      Math.floor(QrCodedText.getNumRawDataModules(this.version) / 8)\n    )\n      throw new RangeError(\"Invalid argument\");\n    let i: int = 0; // Bit index into the data\n    // Do the funny zigzag scan\n    for (let right = this.size - 1; right >= 1; right -= 2) {\n      // Index of right column in each column pair\n      if (right == 6) right = 5;\n      for (let vert = 0; vert < this.size; vert++) {\n        // Vertical counter\n        for (let j = 0; j < 2; j++) {\n          const x: int = right - j; // Actual x coordinate\n          const upward: boolean = ((right + 1) & 2) == 0;\n          const y: int = upward ? this.size - 1 - vert : vert; // Actual y coordinate\n          if (!this.isFunction[y]![x] && i < data.length * 8) {\n            this.modules[y]![x] = getBit(data[i >>> 3]!, 7 - (i & 7));\n            i++;\n          }\n          // If this QR Code has any remainder bits (0 to 7), they were assigned as\n          // 0/false/light by the constructor and are left unchanged by this method\n        }\n      }\n    }\n    assert(i == data.length * 8);\n  }\n\n  // XORs the codeword modules in this QR Code with the given mask pattern.\n  // The function modules must be marked and the codeword bits must be drawn\n  // before masking. Due to the arithmetic of XOR, calling applyMask() with\n  // the same mask value a second time will undo the mask. A final well-formed\n  // QR Code needs exactly one (not zero, two, etc.) mask applied.\n  private applyMask(mask: int): void {\n    if (mask < 0 || mask > 7) throw new RangeError(\"Mask value out of range\");\n    for (let y = 0; y < this.size; y++) {\n      for (let x = 0; x < this.size; x++) {\n        let invert: boolean;\n        switch (mask) {\n          case 0:\n            invert = (x + y) % 2 == 0;\n            break;\n          case 1:\n            invert = y % 2 == 0;\n            break;\n          case 2:\n            invert = x % 3 == 0;\n            break;\n          case 3:\n            invert = (x + y) % 3 == 0;\n            break;\n          case 4:\n            invert = (Math.floor(x / 3) + Math.floor(y / 2)) % 2 == 0;\n            break;\n          case 5:\n            invert = ((x * y) % 2) + ((x * y) % 3) == 0;\n            break;\n          case 6:\n            invert = (((x * y) % 2) + ((x * y) % 3)) % 2 == 0;\n            break;\n          case 7:\n            invert = (((x + y) % 2) + ((x * y) % 3)) % 2 == 0;\n            break;\n          default:\n            throw new Error(\"Unreachable\");\n        }\n        if (!this.isFunction[y]![x] && invert)\n          this.modules[y]![x] = !this.modules[y]![x];\n      }\n    }\n  }\n\n  // Calculates and returns the penalty score based on state of this QR Code's current modules.\n  // This is used by the automatic mask choice algorithm to find the mask pattern that yields the lowest score.\n  private getPenaltyScore(): int {\n    let result: int = 0;\n\n    // Adjacent modules in row having same color, and finder-like patterns\n    for (let y = 0; y < this.size; y++) {\n      let runColor = false;\n      let runX = 0;\n      const runHistory = [0, 0, 0, 0, 0, 0, 0];\n      for (let x = 0; x < this.size; x++) {\n        if (this.modules[y]![x] == runColor) {\n          runX++;\n          if (runX == 5) result += QrCodedText.PENALTY_N1;\n          else if (runX > 5) result++;\n        } else {\n          this.finderPenaltyAddHistory(runX, runHistory);\n          if (!runColor)\n            result +=\n              this.finderPenaltyCountPatterns(runHistory) *\n              QrCodedText.PENALTY_N3;\n          runColor = this.modules[y]![x]!;\n          runX = 1;\n        }\n      }\n      result +=\n        this.finderPenaltyTerminateAndCount(runColor, runX, runHistory) *\n        QrCodedText.PENALTY_N3;\n    }\n    // Adjacent modules in column having same color, and finder-like patterns\n    for (let x = 0; x < this.size; x++) {\n      let runColor = false;\n      let runY = 0;\n      const runHistory = [0, 0, 0, 0, 0, 0, 0];\n      for (let y = 0; y < this.size; y++) {\n        if (this.modules[y]![x] == runColor) {\n          runY++;\n          if (runY == 5) result += QrCodedText.PENALTY_N1;\n          else if (runY > 5) result++;\n        } else {\n          this.finderPenaltyAddHistory(runY, runHistory);\n          if (!runColor)\n            result +=\n              this.finderPenaltyCountPatterns(runHistory) *\n              QrCodedText.PENALTY_N3;\n          runColor = this.modules[y]![x]!;\n          runY = 1;\n        }\n      }\n      result +=\n        this.finderPenaltyTerminateAndCount(runColor, runY, runHistory) *\n        QrCodedText.PENALTY_N3;\n    }\n\n    // 2*2 blocks of modules having same color\n    for (let y = 0; y < this.size - 1; y++) {\n      for (let x = 0; x < this.size - 1; x++) {\n        const color: boolean = this.modules[y]![x]!;\n        if (\n          color == this.modules[y]![x + 1] &&\n          color == this.modules[y + 1]![x] &&\n          color == this.modules[y + 1]![x + 1]\n        )\n          result += QrCodedText.PENALTY_N2;\n      }\n    }\n\n    // Balance of dark and light modules\n    let dark: int = 0;\n    for (const row of this.modules)\n      dark = row.reduce((sum, color) => sum + (color ? 1 : 0), dark);\n    const total: int = this.size * this.size; // Note that size is odd, so dark/total != 1/2\n    // Compute the smallest integer k >= 0 such that (45-5k)% <= dark/total <= (55+5k)%\n    const k: int = Math.ceil(Math.abs(dark * 20 - total * 10) / total) - 1;\n    assert(0 <= k && k <= 9);\n    result += k * QrCodedText.PENALTY_N4;\n    assert(0 <= result && result <= 2568888); // Non-tight upper bound based on default values of PENALTY_N1, ..., N4\n    return result;\n  }\n\n  /*-- Private helper functions --*/\n\n  // Returns an ascending list of positions of alignment patterns for this version number.\n  // Each position is in the range [0,177), and are used on both the x and y axes.\n  // This could be implemented as lookup table of 40 variable-length lists of integers.\n  private getAlignmentPatternPositions(): Array<int> {\n    if (this.version == 1) return [];\n    else {\n      const numAlign: int = Math.floor(this.version / 7) + 2;\n      const step: int =\n        Math.floor((this.version * 8 + numAlign * 3 + 5) / (numAlign * 4 - 4)) *\n        2;\n      const result: Array<int> = [6];\n      for (let pos = this.size - 7; result.length < numAlign; pos -= step)\n        result.splice(1, 0, pos);\n      return result;\n    }\n  }\n\n  // Returns the number of data bits that can be stored in a QR Code of the given version number, after\n  // all function modules are excluded. This includes remainder bits, so it might not be a multiple of 8.\n  // The result is in the range [208, 29648]. This could be implemented as a 40-entry lookup table.\n  private static getNumRawDataModules(ver: int): int {\n    if (ver < QrCodedText.MIN_VERSION || ver > QrCodedText.MAX_VERSION)\n      throw new RangeError(\"Version number out of range\");\n    let result: int = (16 * ver + 128) * ver + 64;\n    if (ver >= 2) {\n      const numAlign: int = Math.floor(ver / 7) + 2;\n      result -= (25 * numAlign - 10) * numAlign - 55;\n      if (ver >= 7) result -= 36;\n    }\n    assert(208 <= result && result <= 29648);\n    return result;\n  }\n\n  // Returns the number of 8-bit data (i.e. not error correction) codewords contained in any\n  // QR Code of the given version number and error correction level, with remainder bits discarded.\n  // This stateless pure function could be implemented as a (40*4)-cell lookup table.\n  private static getNumDataCodewords(\n    ver: int,\n    ecl: QrErrorCorrectionLevel,\n  ): int {\n    return (\n      Math.floor(QrCodedText.getNumRawDataModules(ver) / 8) -\n      QrCodedText.ECC_CODEWORDS_PER_BLOCK[ecl.ordinal]![ver]! *\n        QrCodedText.NUM_ERROR_CORRECTION_BLOCKS[ecl.ordinal]![ver]!\n    );\n  }\n\n  // Returns a Reed-Solomon ECC generator polynomial for the given degree. This could be\n  // implemented as a lookup table over all possible parameter values, instead of as an algorithm.\n  private static reedSolomonComputeDivisor(degree: int): Array<byte> {\n    if (degree < 1 || degree > 255) throw new RangeError(\"Degree out of range\");\n    // Polynomial coefficients are stored from highest to lowest power, excluding the leading term which is always 1.\n    // For example the polynomial x^3 + 255x^2 + 8x + 93 is stored as the uint8 array [255, 8, 93].\n    const result: Array<byte> = [];\n    for (let i = 0; i < degree - 1; i++) result.push(0);\n    result.push(1); // Start off with the monomial x^0\n\n    // Compute the product polynomial (x - r^0) * (x - r^1) * (x - r^2) * ... * (x - r^{degree-1}),\n    // and drop the highest monomial term which is always 1x^degree.\n    // Note that r = 0x02, which is a generator element of this field GF(2^8/0x11D).\n    let root = 1;\n    for (let i = 0; i < degree; i++) {\n      // Multiply the current product by (x - r^i)\n      for (let j = 0; j < result.length; j++) {\n        result[j] = QrCodedText.reedSolomonMultiply(result[j]!, root);\n        if (j + 1 < result.length) result[j]! ^= result[j + 1]!;\n      }\n      root = QrCodedText.reedSolomonMultiply(root, 0x02);\n    }\n    return result;\n  }\n\n  // Returns the Reed-Solomon error correction codeword for the given data and divisor polynomials.\n  private static reedSolomonComputeRemainder(\n    data: Readonly<Array<byte>>,\n    divisor: Readonly<Array<byte>>,\n  ): Array<byte> {\n    const result: Array<byte> = divisor.map((_) => 0);\n    for (const b of data) {\n      // Polynomial division\n      const factor: byte = b ^ (result.shift() as byte);\n      result.push(0);\n      divisor.forEach(\n        (coef, i) =>\n          (result[i]! ^= QrCodedText.reedSolomonMultiply(coef, factor)),\n      );\n    }\n    return result;\n  }\n\n  // Returns the product of the two given field elements modulo GF(2^8/0x11D). The arguments and result\n  // are unsigned 8-bit integers. This could be implemented as a lookup table of 256*256 entries of uint8.\n  private static reedSolomonMultiply(x: byte, y: byte): byte {\n    if (x >>> 8 != 0 || y >>> 8 != 0) throw new RangeError(\"Byte out of range\");\n    // Russian peasant multiplication\n    let z: int = 0;\n    for (let i = 7; i >= 0; i--) {\n      z = (z << 1) ^ ((z >>> 7) * 0x11d);\n      z ^= ((y >>> i) & 1) * x;\n    }\n    assert(z >>> 8 == 0);\n    return z;\n  }\n\n  // Can only be called immediately after a light run is added, and\n  // returns either 0, 1, or 2. A helper function for getPenaltyScore().\n  private finderPenaltyCountPatterns(runHistory: Readonly<Array<int>>): int {\n    const n: int = runHistory[1]!;\n    assert(n <= this.size * 3);\n    const core: boolean =\n      n > 0 &&\n      runHistory[2] == n &&\n      runHistory[3] == n * 3 &&\n      runHistory[4] == n &&\n      runHistory[5] == n;\n    return (\n      (core && runHistory[0]! >= n * 4 && runHistory[6]! >= n ? 1 : 0) +\n      (core && runHistory[6]! >= n * 4 && runHistory[0]! >= n ? 1 : 0)\n    );\n  }\n\n  // Must be called at the end of a line (row or column) of modules. A helper function for getPenaltyScore().\n  private finderPenaltyTerminateAndCount(\n    currentRunColor: boolean,\n    currentRunLength: int,\n    runHistory: Array<int>,\n  ): int {\n    if (currentRunColor) {\n      // Terminate dark run\n      this.finderPenaltyAddHistory(currentRunLength, runHistory);\n      currentRunLength = 0;\n    }\n    currentRunLength += this.size; // Add light border to final run\n    this.finderPenaltyAddHistory(currentRunLength, runHistory);\n    return this.finderPenaltyCountPatterns(runHistory);\n  }\n\n  // Pushes the given value to the front and drops the last value. A helper function for getPenaltyScore().\n  private finderPenaltyAddHistory(\n    currentRunLength: int,\n    runHistory: Array<int>,\n  ): void {\n    if (runHistory[0] == 0) currentRunLength += this.size; // Add light border to initial run\n    runHistory.pop();\n    runHistory.unshift(currentRunLength);\n  }\n\n  /*-- Constants and tables --*/\n\n  // The minimum version number supported in the QR Code Model 2 standard.\n  public static readonly MIN_VERSION: int = 1;\n  // The maximum version number supported in the QR Code Model 2 standard.\n  public static readonly MAX_VERSION: int = 40;\n\n  // For use in getPenaltyScore(), when evaluating which mask is best.\n  private static readonly PENALTY_N1: int = 3;\n  private static readonly PENALTY_N2: int = 3;\n  private static readonly PENALTY_N3: int = 40;\n  private static readonly PENALTY_N4: int = 10;\n\n  private static readonly ECC_CODEWORDS_PER_BLOCK: Array<Array<int>> = [\n    // Version: (note that index 0 is for padding, and is set to an illegal value)\n    //0,  1,  2,  3,  4,  5,  6,  7,  8,  9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40    Error correction level\n    [\n      -1, 7, 10, 15, 20, 26, 18, 20, 24, 30, 18, 20, 24, 26, 30, 22, 24, 28, 30,\n      28, 28, 28, 28, 30, 30, 26, 28, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30,\n      30, 30, 30, 30,\n    ], // Low\n    [\n      -1, 10, 16, 26, 18, 24, 16, 18, 22, 22, 26, 30, 22, 22, 24, 24, 28, 28,\n      26, 26, 26, 26, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,\n      28, 28, 28, 28, 28,\n    ], // Medium\n    [\n      -1, 13, 22, 18, 26, 18, 24, 18, 22, 20, 24, 28, 26, 24, 20, 30, 24, 28,\n      28, 26, 30, 28, 30, 30, 30, 30, 28, 30, 30, 30, 30, 30, 30, 30, 30, 30,\n      30, 30, 30, 30, 30,\n    ], // Quartile\n    [\n      -1, 17, 28, 22, 16, 22, 28, 26, 26, 24, 28, 24, 28, 22, 24, 24, 30, 28,\n      28, 26, 28, 30, 24, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30,\n      30, 30, 30, 30, 30,\n    ], // High\n  ];\n\n  private static readonly NUM_ERROR_CORRECTION_BLOCKS: Array<Array<int>> = [\n    // Version: (note that index 0 is for padding, and is set to an illegal value)\n    //0, 1, 2, 3, 4, 5, 6, 7, 8, 9,10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40    Error correction level\n    [\n      -1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 4, 4, 4, 4, 4, 6, 6, 6, 6, 7, 8, 8, 9, 9,\n      10, 12, 12, 12, 13, 14, 15, 16, 17, 18, 19, 19, 20, 21, 22, 24, 25,\n    ], // Low\n    [\n      -1, 1, 1, 1, 2, 2, 4, 4, 4, 5, 5, 5, 8, 9, 9, 10, 10, 11, 13, 14, 16, 17,\n      17, 18, 20, 21, 23, 25, 26, 28, 29, 31, 33, 35, 37, 38, 40, 43, 45, 47,\n      49,\n    ], // Medium\n    [\n      -1, 1, 1, 2, 2, 4, 4, 6, 6, 8, 8, 8, 10, 12, 16, 12, 17, 16, 18, 21, 20,\n      23, 23, 25, 27, 29, 34, 34, 35, 38, 40, 43, 45, 48, 51, 53, 56, 59, 62,\n      65, 68,\n    ], // Quartile\n    [\n      -1, 1, 1, 2, 4, 4, 4, 5, 6, 8, 8, 11, 11, 16, 16, 18, 16, 19, 21, 25, 25,\n      25, 34, 30, 32, 35, 37, 40, 42, 45, 48, 51, 54, 57, 60, 63, 66, 70, 74,\n      77, 81,\n    ], // High\n  ];\n}\n\n// Appends the given number of low-order bits of the given value\n// to the given buffer. Requires 0 <= len <= 31 and 0 <= val < 2^len.\nfunction appendBits(val: int, len: int, bb: Array<bit>): void {\n  if (len < 0 || len > 31 || val >>> len != 0)\n    throw new RangeError(\"Value out of range\");\n  for (\n    let i = len - 1;\n    i >= 0;\n    i-- // Append bit by bit\n  )\n    bb.push((val >>> i) & 1);\n}\n\n// Returns true iff the i'th bit of x is set to 1.\nfunction getBit(x: int, i: int): boolean {\n  return ((x >>> i) & 1) != 0;\n}\n\n// Throws an exception if the given condition is false.\nfunction assert(cond: boolean): void {\n  if (!cond) throw new Error(\"Assertion error\");\n}\n\n/*---- Data segment class ----*/\n\n/*\n * A segment of character/binary/control data in a QR Code symbol.\n * Instances of this class are immutable.\n * The mid-level way to create a segment is to take the payload data\n * and call a static factory function such as QrSegment.makeNumeric().\n * The low-level way to create a segment is to custom-make the bit buffer\n * and call the QrSegment() constructor with appropriate values.\n * This segment class imposes no length restrictions, but QR Codes have restrictions.\n * Even in the most favorable conditions, a QR Code can only hold 7089 characters of data.\n * Any segment longer than this is meaningless for the purpose of generating QR Codes.\n */\nexport class QrSegment {\n  /*-- Static factory functions (mid level) --*/\n\n  // Returns a segment representing the given binary data encoded in\n  // byte mode. All input byte arrays are acceptable. Any text string\n  // can be converted to UTF-8 bytes and encoded as a byte mode segment.\n  public static makeBytes(data: Readonly<Array<byte>>): QrSegment {\n    const bb: Array<bit> = [];\n    for (const b of data) appendBits(b, 8, bb);\n    return new QrSegment(Mode.BYTE, data.length, bb);\n  }\n\n  // Returns a segment representing the given string of decimal digits encoded in numeric mode.\n  public static makeNumeric(digits: string): QrSegment {\n    if (!QrSegment.isNumeric(digits))\n      throw new RangeError(\"String contains non-numeric characters\");\n    const bb: Array<bit> = [];\n    for (let i = 0; i < digits.length; ) {\n      // Consume up to 3 digits per iteration\n      const n: int = Math.min(digits.length - i, 3);\n      appendBits(parseInt(digits.substring(i, i + n), 10), n * 3 + 1, bb);\n      i += n;\n    }\n    return new QrSegment(Mode.NUMERIC, digits.length, bb);\n  }\n\n  // Returns a segment representing the given text string encoded in alphanumeric mode.\n  // The characters allowed are: 0 to 9, A to Z (uppercase only), space,\n  // dollar, percent, asterisk, plus, hyphen, period, slash, colon.\n  public static makeAlphanumeric(text: string): QrSegment {\n    if (!QrSegment.isAlphanumeric(text))\n      throw new RangeError(\n        \"String contains unencodable characters in alphanumeric mode\",\n      );\n    const bb: Array<bit> = [];\n    let i: int;\n    for (i = 0; i + 2 <= text.length; i += 2) {\n      // Process groups of 2\n      let temp: int =\n        QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)) * 45;\n      temp += QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i + 1));\n      appendBits(temp, 11, bb);\n    }\n    if (i < text.length)\n      // 1 character remaining\n      appendBits(QrSegment.ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)), 6, bb);\n    return new QrSegment(Mode.ALPHANUMERIC, text.length, bb);\n  }\n\n  // Returns a new mutable list of zero or more segments to represent the given Unicode text string.\n  // The result may use various segment modes and switch modes to optimize the length of the bit stream.\n  public static makeSegments(text: string): Array<QrSegment> {\n    // Select the most efficient segment encoding automatically\n    if (text == \"\") return [];\n    else if (QrSegment.isNumeric(text)) return [QrSegment.makeNumeric(text)];\n    else if (QrSegment.isAlphanumeric(text))\n      return [QrSegment.makeAlphanumeric(text)];\n    else return [QrSegment.makeBytes(QrSegment.toUtf8ByteArray(text))];\n  }\n\n  // Returns a segment representing an Extended Channel Interpretation\n  // (ECI) designator with the given assignment value.\n  public static makeEci(assignVal: int): QrSegment {\n    const bb: Array<bit> = [];\n    if (assignVal < 0)\n      throw new RangeError(\"ECI assignment value out of range\");\n    else if (assignVal < 1 << 7) appendBits(assignVal, 8, bb);\n    else if (assignVal < 1 << 14) {\n      appendBits(0b10, 2, bb);\n      appendBits(assignVal, 14, bb);\n    } else if (assignVal < 1000000) {\n      appendBits(0b110, 3, bb);\n      appendBits(assignVal, 21, bb);\n    } else throw new RangeError(\"ECI assignment value out of range\");\n    return new QrSegment(Mode.ECI, 0, bb);\n  }\n\n  // Tests whether the given string can be encoded as a segment in numeric mode.\n  // A string is encodable iff each character is in the range 0 to 9.\n  public static isNumeric(text: string): boolean {\n    return QrSegment.NUMERIC_REGEX.test(text);\n  }\n\n  // Tests whether the given string can be encoded as a segment in alphanumeric mode.\n  // A string is encodable iff each character is in the following set: 0 to 9, A to Z\n  // (uppercase only), space, dollar, percent, asterisk, plus, hyphen, period, slash, colon.\n  public static isAlphanumeric(text: string): boolean {\n    return QrSegment.ALPHANUMERIC_REGEX.test(text);\n  }\n\n  /*-- Constructor (low level) and fields --*/\n\n  // Creates a new QR Code segment with the given attributes and data.\n  // The character count (numChars) must agree with the mode and the bit buffer length,\n  // but the constraint isn't checked. The given bit buffer is cloned and stored.\n  public constructor(\n    // The mode indicator of this segment.\n    public readonly mode: Mode,\n\n    // The length of this segment's unencoded data. Measured in characters for\n    // numeric/alphanumeric/kanji mode, bytes for byte mode, and 0 for ECI mode.\n    // Always zero or positive. Not the same as the data's bit length.\n    public readonly numChars: int,\n\n    // The data bits of this segment. Accessed through getData().\n    private readonly bitData: Array<bit>,\n  ) {\n    if (numChars < 0) throw new RangeError(\"Invalid argument\");\n    this.bitData = bitData.slice(); // Make defensive copy\n  }\n\n  /*-- Methods --*/\n\n  // Returns a new copy of the data bits of this segment.\n  public getData(): Array<bit> {\n    return this.bitData.slice(); // Make defensive copy\n  }\n\n  // (Package-private) Calculates and returns the number of bits needed to encode the given segments at\n  // the given version. The result is infinity if a segment has too many characters to fit its length field.\n  public static getTotalBits(\n    segs: Readonly<Array<QrSegment>>,\n    version: int,\n  ): number {\n    let result: number = 0;\n    for (const seg of segs) {\n      const ccbits: int = seg.mode.numCharCountBits(version);\n      if (seg.numChars >= 1 << ccbits) return Infinity; // The segment's length doesn't fit the field's bit width\n      result += 4 + ccbits + seg.bitData.length;\n    }\n    return result;\n  }\n\n  // Returns a new array of bytes representing the given string encoded in UTF-8.\n  private static toUtf8ByteArray(str: string): Array<byte> {\n    str = encodeURI(str);\n    const result: Array<byte> = [];\n    for (let i = 0; i < str.length; i++) {\n      if (str.charAt(i) != \"%\") result.push(str.charCodeAt(i));\n      else {\n        result.push(parseInt(str.substring(i + 1, i + 3), 16));\n        i += 2;\n      }\n    }\n    return result;\n  }\n\n  /*-- Constants --*/\n\n  // Describes precisely all strings that are encodable in numeric mode.\n  private static readonly NUMERIC_REGEX: RegExp = /^[0-9]*$/;\n\n  // Describes precisely all strings that are encodable in alphanumeric mode.\n  private static readonly ALPHANUMERIC_REGEX: RegExp = /^[A-Z0-9 $%*+./:-]*$/;\n\n  // The set of all legal characters in alphanumeric mode,\n  // where each character value maps to the index in the string.\n  private static readonly ALPHANUMERIC_CHARSET: string =\n    \"0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:\";\n}\n\n/*\n * The error correction level in a QR Code symbol. Immutable.\n */\n\nexport type QrErrorCorrectionLevelConfig =\n  | \"LOW\"\n  | \"MEDIUM\"\n  | \"QUARTILE\"\n  | \"HIGH\";\nexport class QrErrorCorrectionLevel {\n  /*-- Constants --*/\n\n  public static readonly LOW = new QrErrorCorrectionLevel(0, 1); // The QR Code can tolerate about  7% erroneous codewords\n  public static readonly MEDIUM = new QrErrorCorrectionLevel(1, 0); // The QR Code can tolerate about 15% erroneous codewords\n  public static readonly QUARTILE = new QrErrorCorrectionLevel(2, 3); // The QR Code can tolerate about 25% erroneous codewords\n  public static readonly HIGH = new QrErrorCorrectionLevel(3, 2); // The QR Code can tolerate about 30% erroneous codewords\n\n  /*-- Constructor and fields --*/\n\n  private constructor(\n    // In the range 0 to 3 (unsigned 2-bit integer).\n    public readonly ordinal: int,\n    // (Package-private) In the range 0 to 3 (unsigned 2-bit integer).\n    public readonly formatBits: int,\n  ) {}\n\n  public static fromString(\n    level: QrErrorCorrectionLevelConfig,\n  ): QrErrorCorrectionLevel {\n    switch (level) {\n      case \"LOW\":\n        return QrErrorCorrectionLevel.LOW;\n      case \"MEDIUM\":\n        return QrErrorCorrectionLevel.MEDIUM;\n      case \"QUARTILE\":\n        return QrErrorCorrectionLevel.QUARTILE;\n      case \"HIGH\":\n        return QrErrorCorrectionLevel.HIGH;\n    }\n  }\n}\n\n/*\n * Describes how a segment's data bits are interpreted. Immutable.\n */\nexport class Mode {\n  /*-- Constants --*/\n\n  public static readonly NUMERIC = new Mode(0x1, [10, 12, 14]);\n  public static readonly ALPHANUMERIC = new Mode(0x2, [9, 11, 13]);\n  public static readonly BYTE = new Mode(0x4, [8, 16, 16]);\n  public static readonly KANJI = new Mode(0x8, [8, 10, 12]);\n  public static readonly ECI = new Mode(0x7, [0, 0, 0]);\n\n  /*-- Constructor and fields --*/\n\n  private constructor(\n    // The mode indicator bits, which is a uint4 value (range 0 to 15).\n    public readonly modeBits: int,\n    // Number of character count bits for three different version ranges.\n    private readonly numBitsCharCount: [int, int, int],\n  ) {}\n\n  /*-- Method --*/\n\n  // (Package-private) Returns the bit width of the character count field for a segment in\n  // this mode in a QR Code at the given version number. The result is in the range [0, 16].\n  public numCharCountBits(ver: int): int {\n    return this.numBitsCharCount[Math.floor((ver + 7) / 17)]!;\n  }\n}\n","export const SVG_NS = \"http://www.w3.org/2000/svg\";\n\n/**\n * Takes a string representing the SVG path data\n * and creates an SVG `<path>` element with the provided data.\n */\nexport function createSvgPathFromString(pathData: string): SVGPathElement {\n  const pathElement = document.createElementNS(SVG_NS, \"path\");\n  pathElement.setAttribute(\"d\", pathData);\n  return pathElement;\n}\n\n/**\n * Takes an array of SVG elements and creates an SVG `<g>` (group) element.\n * All provided elements are appended as children of the group element.\n */\nexport function createSvgGroupFromElements(\n  elements: SVGElement[],\n): SVGGElement {\n  const groupElement = document.createElementNS(SVG_NS, \"g\");\n  for (const element of elements) {\n    groupElement.appendChild(element);\n  }\n  return groupElement;\n}\n\n/**\n * Retrieves the `<defs>` element from the provided SVG element.\n * If no `<defs>` element exists, it creates one and inserts it as the first child of the SVG.\n */\nexport function getDefsElement(mainSvg: SVGElement): SVGDefsElement {\n  let defs = mainSvg.querySelector(\"defs\");\n  if (defs === null) {\n    defs = document.createElementNS(SVG_NS, \"defs\");\n    mainSvg.insertBefore(defs, mainSvg.firstChild);\n  }\n  return defs;\n}\n\n// Increase the viewbox size to reduce the QR code size\nexport function computeViewBoxIncrease(\n  codeMatrixSize: number,\n  sizeRatio: number,\n): number {\n  return codeMatrixSize * ((1 - sizeRatio) / sizeRatio);\n}\n","import { getDefsElement } from \"../utils/SvgUtils\";\n\n/**\n * Interface representing a QR vector color for SVG.\n */\ninterface IQrColor {\n  applyToElement(element: SVGElement, mainSvg: SVGElement): void;\n}\n\n/**\n * Solid color class.\n */\nclass Solid implements IQrColor {\n  constructor(private color: string) {}\n\n  applyToElement(element: SVGElement): void {\n    element.setAttribute(\"fill\", this.color);\n  }\n}\n\n/**\n * Linear gradient class for SVG.\n */\nclass LinearGradient implements IQrColor {\n  private gradientId = `gradient-linear-${Math.random().toString(36).slice(2, 11)}`;\n\n  constructor(\n    private colors: Array<[number, string]>,\n    private orientation: LinearGradientOrientation,\n  ) {}\n\n  applyToElement(element: SVGElement, mainSvg: SVGElement): void {\n    const defs = getDefsElement(mainSvg);\n    if (!defs.querySelector(`#${this.gradientId}`)) {\n      const gradientElement = this.createGradientElement();\n      this.colors.forEach(([offset, color]) =>\n        this.appendStopElement(gradientElement, offset, color),\n      );\n      defs.appendChild(gradientElement);\n    }\n    element.setAttribute(\"fill\", `url(#${this.gradientId})`);\n  }\n\n  private createGradientElement() {\n    const { start, end } = this.orientation;\n    const gradientElement = document.createElementNS(\n      \"http://www.w3.org/2000/svg\",\n      \"linearGradient\",\n    );\n    gradientElement.setAttribute(\"id\", this.gradientId);\n    gradientElement.setAttribute(\"gradientUnits\", \"userSpaceOnUse\");\n    gradientElement.setAttribute(\"x1\", start[0].toString());\n    gradientElement.setAttribute(\"y1\", start[1].toString());\n    gradientElement.setAttribute(\"x2\", end[0].toString());\n    gradientElement.setAttribute(\"y2\", end[1].toString());\n    return gradientElement;\n  }\n\n  private appendStopElement(\n    gradientElement: SVGElement,\n    offset: number,\n    color: string,\n  ) {\n    const stopElement = document.createElementNS(\n      \"http://www.w3.org/2000/svg\",\n      \"stop\",\n    );\n    stopElement.setAttribute(\"offset\", `${offset * 100}%`);\n    stopElement.setAttribute(\"stop-color\", color);\n    gradientElement.appendChild(stopElement);\n  }\n}\n\n/**\n * Radial gradient class for SVG.\n */\nclass RadialGradient implements IQrColor {\n  private gradientId = `gradient-radial-${Math.random().toString(36).slice(2, 11)}`;\n\n  constructor(\n    private colors: Array<[number, string]>,\n    private radius: number = Math.sqrt(2),\n  ) {}\n\n  applyToElement(element: SVGElement, mainSvg: SVGElement): void {\n    const defs = getDefsElement(mainSvg);\n    const gradientElement = this.createGradientElement();\n    this.colors.forEach(([offset, color]) =>\n      this.appendStopElement(gradientElement, offset, color),\n    );\n    defs.appendChild(gradientElement);\n    element.setAttribute(\"fill\", `url(#${this.gradientId})`);\n  }\n\n  private createGradientElement() {\n    const gradientElement = document.createElementNS(\n      \"http://www.w3.org/2000/svg\",\n      \"radialGradient\",\n    );\n    gradientElement.setAttribute(\"id\", this.gradientId);\n    gradientElement.setAttribute(\"cx\", \"0.5\");\n    gradientElement.setAttribute(\"cy\", \"0.5\");\n    gradientElement.setAttribute(\"r\", `${this.radius * 50}%`);\n    return gradientElement;\n  }\n\n  private appendStopElement(\n    gradientElement: SVGElement,\n    offset: number,\n    color: string,\n  ) {\n    const stopElement = document.createElementNS(\n      \"http://www.w3.org/2000/svg\",\n      \"stop\",\n    );\n    stopElement.setAttribute(\"offset\", `${offset * 100}%`);\n    stopElement.setAttri