@c2n/qr-code 0.0.9

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Nguyen Thai Vinh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,9 @@
+# QR Code
+
+Accessible, themeable SVG QR codes for Lit and any framework that supports web components.
+
+```html
+<script type="module" src="@c2n/qr-code"></script>
+
+<c2-qr-code value="https://example.com" aria-label="Example website QR code"></c2-qr-code>
+```

package/dist/qr-code.js

@@ -0,0 +1,1022 @@
+import { LitElement, html, unsafeCSS } from "lit";
+import { property, state } from "lit/decorators.js";
+import { styleMap } from "lit/directives/style-map.js";
+import { customElement } from "@c2n/core/element-helper.js";
+//#region ../../../node_modules/uqr/dist/index.mjs
+var QrCodeDataType = /* @__PURE__ */ ((QrCodeDataType2) => {
+	QrCodeDataType2[QrCodeDataType2["Border"] = -1] = "Border";
+	QrCodeDataType2[QrCodeDataType2["Data"] = 0] = "Data";
+	QrCodeDataType2[QrCodeDataType2["Function"] = 1] = "Function";
+	QrCodeDataType2[QrCodeDataType2["Position"] = 2] = "Position";
+	QrCodeDataType2[QrCodeDataType2["Timing"] = 3] = "Timing";
+	QrCodeDataType2[QrCodeDataType2["Alignment"] = 4] = "Alignment";
+	return QrCodeDataType2;
+})(QrCodeDataType || {});
+var LOW = [0, 1];
+var MEDIUM = [1, 0];
+var QUARTILE = [2, 3];
+var HIGH = [3, 2];
+var EccMap = {
+	L: LOW,
+	M: MEDIUM,
+	Q: QUARTILE,
+	H: HIGH
+};
+var NUMERIC_REGEX = /^\d*$/;
+var ALPHANUMERIC_REGEX = /^[A-Z0-9 $%*+./:-]*$/;
+var ALPHANUMERIC_CHARSET = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ $%*+-./:";
+var MIN_VERSION = 1;
+var MAX_VERSION = 40;
+var PENALTY_N1 = 3;
+var PENALTY_N2 = 3;
+var PENALTY_N3 = 40;
+var PENALTY_N4 = 10;
+var ECC_CODEWORDS_PER_BLOCK = [
+	[
+		-1,
+		7,
+		10,
+		15,
+		20,
+		26,
+		18,
+		20,
+		24,
+		30,
+		18,
+		20,
+		24,
+		26,
+		30,
+		22,
+		24,
+		28,
+		30,
+		28,
+		28,
+		28,
+		28,
+		30,
+		30,
+		26,
+		28,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30
+	],
+	[
+		-1,
+		10,
+		16,
+		26,
+		18,
+		24,
+		16,
+		18,
+		22,
+		22,
+		26,
+		30,
+		22,
+		22,
+		24,
+		24,
+		28,
+		28,
+		26,
+		26,
+		26,
+		26,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28,
+		28
+	],
+	[
+		-1,
+		13,
+		22,
+		18,
+		26,
+		18,
+		24,
+		18,
+		22,
+		20,
+		24,
+		28,
+		26,
+		24,
+		20,
+		30,
+		24,
+		28,
+		28,
+		26,
+		30,
+		28,
+		30,
+		30,
+		30,
+		30,
+		28,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30
+	],
+	[
+		-1,
+		17,
+		28,
+		22,
+		16,
+		22,
+		28,
+		26,
+		26,
+		24,
+		28,
+		24,
+		28,
+		22,
+		24,
+		24,
+		30,
+		28,
+		28,
+		26,
+		28,
+		30,
+		24,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30,
+		30
+	]
+];
+var NUM_ERROR_CORRECTION_BLOCKS = [
+	[
+		-1,
+		1,
+		1,
+		1,
+		1,
+		1,
+		2,
+		2,
+		2,
+		2,
+		4,
+		4,
+		4,
+		4,
+		4,
+		6,
+		6,
+		6,
+		6,
+		7,
+		8,
+		8,
+		9,
+		9,
+		10,
+		12,
+		12,
+		12,
+		13,
+		14,
+		15,
+		16,
+		17,
+		18,
+		19,
+		19,
+		20,
+		21,
+		22,
+		24,
+		25
+	],
+	[
+		-1,
+		1,
+		1,
+		1,
+		2,
+		2,
+		4,
+		4,
+		4,
+		5,
+		5,
+		5,
+		8,
+		9,
+		9,
+		10,
+		10,
+		11,
+		13,
+		14,
+		16,
+		17,
+		17,
+		18,
+		20,
+		21,
+		23,
+		25,
+		26,
+		28,
+		29,
+		31,
+		33,
+		35,
+		37,
+		38,
+		40,
+		43,
+		45,
+		47,
+		49
+	],
+	[
+		-1,
+		1,
+		1,
+		2,
+		2,
+		4,
+		4,
+		6,
+		6,
+		8,
+		8,
+		8,
+		10,
+		12,
+		16,
+		12,
+		17,
+		16,
+		18,
+		21,
+		20,
+		23,
+		23,
+		25,
+		27,
+		29,
+		34,
+		34,
+		35,
+		38,
+		40,
+		43,
+		45,
+		48,
+		51,
+		53,
+		56,
+		59,
+		62,
+		65,
+		68
+	],
+	[
+		-1,
+		1,
+		1,
+		2,
+		4,
+		4,
+		4,
+		5,
+		6,
+		8,
+		8,
+		11,
+		11,
+		16,
+		16,
+		18,
+		16,
+		19,
+		21,
+		25,
+		25,
+		25,
+		34,
+		30,
+		32,
+		35,
+		37,
+		40,
+		42,
+		45,
+		48,
+		51,
+		54,
+		57,
+		60,
+		63,
+		66,
+		70,
+		74,
+		77,
+		81
+	]
+];
+var QrCode$1 = class {
+	constructor(version, ecc, dataCodewords, msk) {
+		this.version = version;
+		this.ecc = ecc;
+		if (version < MIN_VERSION || version > MAX_VERSION) throw new RangeError("Version value out of range");
+		if (msk < -1 || msk > 7) throw new RangeError("Mask value out of range");
+		this.size = version * 4 + 17;
+		const row = Array.from({ length: this.size }).fill(false);
+		for (let i = 0; i < this.size; i++) {
+			this.modules.push(row.slice());
+			this.types.push(row.map(() => 0));
+		}
+		this.drawFunctionPatterns();
+		const allCodewords = this.addEccAndInterleave(dataCodewords);
+		this.drawCodewords(allCodewords);
+		if (msk === -1) {
+			let minPenalty = 1e9;
+			for (let i = 0; i < 8; i++) {
+				this.applyMask(i);
+				this.drawFormatBits(i);
+				const penalty = this.getPenaltyScore();
+				if (penalty < minPenalty) {
+					msk = i;
+					minPenalty = penalty;
+				}
+				this.applyMask(i);
+			}
+		}
+		this.mask = msk;
+		this.applyMask(msk);
+		this.drawFormatBits(msk);
+	}
+	size;
+	mask;
+	modules = [];
+	types = [];
+	getModule(x, y) {
+		return x >= 0 && x < this.size && y >= 0 && y < this.size && this.modules[y][x];
+	}
+	drawFunctionPatterns() {
+		for (let i = 0; i < this.size; i++) {
+			this.setFunctionModule(6, i, i % 2 === 0, QrCodeDataType.Timing);
+			this.setFunctionModule(i, 6, i % 2 === 0, QrCodeDataType.Timing);
+		}
+		this.drawFinderPattern(3, 3);
+		this.drawFinderPattern(this.size - 4, 3);
+		this.drawFinderPattern(3, this.size - 4);
+		const alignPatPos = this.getAlignmentPatternPositions();
+		const numAlign = alignPatPos.length;
+		for (let i = 0; i < numAlign; i++) for (let j = 0; j < numAlign; j++) if (!(i === 0 && j === 0 || i === 0 && j === numAlign - 1 || i === numAlign - 1 && j === 0)) this.drawAlignmentPattern(alignPatPos[i], alignPatPos[j]);
+		this.drawFormatBits(0);
+		this.drawVersion();
+	}
+	drawFormatBits(mask) {
+		const data = this.ecc[1] << 3 | mask;
+		let rem = data;
+		for (let i = 0; i < 10; i++) rem = rem << 1 ^ (rem >>> 9) * 1335;
+		const bits = (data << 10 | rem) ^ 21522;
+		for (let i = 0; i <= 5; i++) this.setFunctionModule(8, i, getBit(bits, i));
+		this.setFunctionModule(8, 7, getBit(bits, 6));
+		this.setFunctionModule(8, 8, getBit(bits, 7));
+		this.setFunctionModule(7, 8, getBit(bits, 8));
+		for (let i = 9; i < 15; i++) this.setFunctionModule(14 - i, 8, getBit(bits, i));
+		for (let i = 0; i < 8; i++) this.setFunctionModule(this.size - 1 - i, 8, getBit(bits, i));
+		for (let i = 8; i < 15; i++) this.setFunctionModule(8, this.size - 15 + i, getBit(bits, i));
+		this.setFunctionModule(8, this.size - 8, true);
+	}
+	drawVersion() {
+		if (this.version < 7) return;
+		let rem = this.version;
+		for (let i = 0; i < 12; i++) rem = rem << 1 ^ (rem >>> 11) * 7973;
+		const bits = this.version << 12 | rem;
+		for (let i = 0; i < 18; i++) {
+			const color = getBit(bits, i);
+			const a = this.size - 11 + i % 3;
+			const b = Math.floor(i / 3);
+			this.setFunctionModule(a, b, color);
+			this.setFunctionModule(b, a, color);
+		}
+	}
+	drawFinderPattern(x, y) {
+		for (let dy = -4; dy <= 4; dy++) for (let dx = -4; dx <= 4; dx++) {
+			const dist = Math.max(Math.abs(dx), Math.abs(dy));
+			const xx = x + dx;
+			const yy = y + dy;
+			if (xx >= 0 && xx < this.size && yy >= 0 && yy < this.size) this.setFunctionModule(xx, yy, dist !== 2 && dist !== 4, QrCodeDataType.Position);
+		}
+	}
+	drawAlignmentPattern(x, y) {
+		for (let dy = -2; dy <= 2; dy++) for (let dx = -2; dx <= 2; dx++) this.setFunctionModule(x + dx, y + dy, Math.max(Math.abs(dx), Math.abs(dy)) !== 1, QrCodeDataType.Alignment);
+	}
+	setFunctionModule(x, y, isDark, type = QrCodeDataType.Function) {
+		this.modules[y][x] = isDark;
+		this.types[y][x] = type;
+	}
+	addEccAndInterleave(data) {
+		const ver = this.version;
+		const ecl = this.ecc;
+		if (data.length !== getNumDataCodewords(ver, ecl)) throw new RangeError("Invalid argument");
+		const numBlocks = NUM_ERROR_CORRECTION_BLOCKS[ecl[0]][ver];
+		const blockEccLen = ECC_CODEWORDS_PER_BLOCK[ecl[0]][ver];
+		const rawCodewords = Math.floor(getNumRawDataModules(ver) / 8);
+		const numShortBlocks = numBlocks - rawCodewords % numBlocks;
+		const shortBlockLen = Math.floor(rawCodewords / numBlocks);
+		const blocks = [];
+		const rsDiv = reedSolomonComputeDivisor(blockEccLen);
+		for (let i = 0, k = 0; i < numBlocks; i++) {
+			const dat = data.slice(k, k + shortBlockLen - blockEccLen + (i < numShortBlocks ? 0 : 1));
+			k += dat.length;
+			const ecc = reedSolomonComputeRemainder(dat, rsDiv);
+			if (i < numShortBlocks) dat.push(0);
+			blocks.push(dat.concat(ecc));
+		}
+		const result = [];
+		for (let i = 0; i < blocks[0].length; i++) blocks.forEach((block, j) => {
+			if (i !== shortBlockLen - blockEccLen || j >= numShortBlocks) result.push(block[i]);
+		});
+		return result;
+	}
+	drawCodewords(data) {
+		if (data.length !== Math.floor(getNumRawDataModules(this.version) / 8)) throw new RangeError("Invalid argument");
+		let i = 0;
+		for (let right = this.size - 1; right >= 1; right -= 2) {
+			if (right === 6) right = 5;
+			for (let vert = 0; vert < this.size; vert++) for (let j = 0; j < 2; j++) {
+				const x = right - j;
+				const y = (right + 1 & 2) === 0 ? this.size - 1 - vert : vert;
+				if (!this.types[y][x] && i < data.length * 8) {
+					this.modules[y][x] = getBit(data[i >>> 3], 7 - (i & 7));
+					i++;
+				}
+			}
+		}
+	}
+	applyMask(mask) {
+		if (mask < 0 || mask > 7) throw new RangeError("Mask value out of range");
+		for (let y = 0; y < this.size; y++) for (let x = 0; x < this.size; x++) {
+			let invert;
+			switch (mask) {
+				case 0:
+					invert = (x + y) % 2 === 0;
+					break;
+				case 1:
+					invert = y % 2 === 0;
+					break;
+				case 2:
+					invert = x % 3 === 0;
+					break;
+				case 3:
+					invert = (x + y) % 3 === 0;
+					break;
+				case 4:
+					invert = (Math.floor(x / 3) + Math.floor(y / 2)) % 2 === 0;
+					break;
+				case 5:
+					invert = x * y % 2 + x * y % 3 === 0;
+					break;
+				case 6:
+					invert = (x * y % 2 + x * y % 3) % 2 === 0;
+					break;
+				case 7:
+					invert = ((x + y) % 2 + x * y % 3) % 2 === 0;
+					break;
+				default: throw new Error("Unreachable");
+			}
+			if (!this.types[y][x] && invert) this.modules[y][x] = !this.modules[y][x];
+		}
+	}
+	getPenaltyScore() {
+		let result = 0;
+		for (let y = 0; y < this.size; y++) {
+			let runColor = false;
+			let runX = 0;
+			const runHistory = [
+				0,
+				0,
+				0,
+				0,
+				0,
+				0,
+				0
+			];
+			for (let x = 0; x < this.size; x++) if (this.modules[y][x] === runColor) {
+				runX++;
+				if (runX === 5) result += PENALTY_N1;
+				else if (runX > 5) result++;
+			} else {
+				this.finderPenaltyAddHistory(runX, runHistory);
+				if (!runColor) result += this.finderPenaltyCountPatterns(runHistory) * PENALTY_N3;
+				runColor = this.modules[y][x];
+				runX = 1;
+			}
+			result += this.finderPenaltyTerminateAndCount(runColor, runX, runHistory) * PENALTY_N3;
+		}
+		for (let x = 0; x < this.size; x++) {
+			let runColor = false;
+			let runY = 0;
+			const runHistory = [
+				0,
+				0,
+				0,
+				0,
+				0,
+				0,
+				0
+			];
+			for (let y = 0; y < this.size; y++) if (this.modules[y][x] === runColor) {
+				runY++;
+				if (runY === 5) result += PENALTY_N1;
+				else if (runY > 5) result++;
+			} else {
+				this.finderPenaltyAddHistory(runY, runHistory);
+				if (!runColor) result += this.finderPenaltyCountPatterns(runHistory) * PENALTY_N3;
+				runColor = this.modules[y][x];
+				runY = 1;
+			}
+			result += this.finderPenaltyTerminateAndCount(runColor, runY, runHistory) * PENALTY_N3;
+		}
+		for (let y = 0; y < this.size - 1; y++) for (let x = 0; x < this.size - 1; x++) {
+			const color = this.modules[y][x];
+			if (color === this.modules[y][x + 1] && color === this.modules[y + 1][x] && color === this.modules[y + 1][x + 1]) result += PENALTY_N2;
+		}
+		let dark = 0;
+		for (const row of this.modules) dark = row.reduce((sum, color) => sum + (color ? 1 : 0), dark);
+		const total = this.size * this.size;
+		const k = Math.ceil(Math.abs(dark * 20 - total * 10) / total) - 1;
+		result += k * PENALTY_N4;
+		return result;
+	}
+	getAlignmentPatternPositions() {
+		if (this.version === 1) return [];
+		else {
+			const numAlign = Math.floor(this.version / 7) + 2;
+			const step = this.version === 32 ? 26 : Math.ceil((this.version * 4 + 4) / (numAlign * 2 - 2)) * 2;
+			const result = [6];
+			for (let pos = this.size - 7; result.length < numAlign; pos -= step) result.splice(1, 0, pos);
+			return result;
+		}
+	}
+	finderPenaltyCountPatterns(runHistory) {
+		const n = runHistory[1];
+		const core = n > 0 && runHistory[2] === n && runHistory[3] === n * 3 && runHistory[4] === n && runHistory[5] === n;
+		return (core && runHistory[0] >= n * 4 && runHistory[6] >= n ? 1 : 0) + (core && runHistory[6] >= n * 4 && runHistory[0] >= n ? 1 : 0);
+	}
+	finderPenaltyTerminateAndCount(currentRunColor, currentRunLength, runHistory) {
+		if (currentRunColor) {
+			this.finderPenaltyAddHistory(currentRunLength, runHistory);
+			currentRunLength = 0;
+		}
+		currentRunLength += this.size;
+		this.finderPenaltyAddHistory(currentRunLength, runHistory);
+		return this.finderPenaltyCountPatterns(runHistory);
+	}
+	finderPenaltyAddHistory(currentRunLength, runHistory) {
+		if (runHistory[0] === 0) currentRunLength += this.size;
+		runHistory.pop();
+		runHistory.unshift(currentRunLength);
+	}
+};
+function appendBits(val, len, bb) {
+	if (len < 0 || len > 31 || val >>> len !== 0) throw new RangeError("Value out of range");
+	for (let i = len - 1; i >= 0; i--) bb.push(val >>> i & 1);
+}
+function getBit(x, i) {
+	return (x >>> i & 1) !== 0;
+}
+var QrSegment = class {
+	constructor(mode, numChars, bitData) {
+		this.mode = mode;
+		this.numChars = numChars;
+		this.bitData = bitData;
+		if (numChars < 0) throw new RangeError("Invalid argument");
+		this.bitData = bitData.slice();
+	}
+	getData() {
+		return this.bitData.slice();
+	}
+};
+var MODE_NUMERIC = [
+	1,
+	10,
+	12,
+	14
+];
+var MODE_ALPHANUMERIC = [
+	2,
+	9,
+	11,
+	13
+];
+var MODE_BYTE = [
+	4,
+	8,
+	16,
+	16
+];
+function numCharCountBits(mode, ver) {
+	return mode[Math.floor((ver + 7) / 17) + 1];
+}
+function makeBytes(data) {
+	const bb = [];
+	for (const b of data) appendBits(b, 8, bb);
+	return new QrSegment(MODE_BYTE, data.length, bb);
+}
+function makeNumeric(digits) {
+	if (!isNumeric(digits)) throw new RangeError("String contains non-numeric characters");
+	const bb = [];
+	for (let i = 0; i < digits.length;) {
+		const n = Math.min(digits.length - i, 3);
+		appendBits(Number.parseInt(digits.substring(i, i + n), 10), n * 3 + 1, bb);
+		i += n;
+	}
+	return new QrSegment(MODE_NUMERIC, digits.length, bb);
+}
+function makeAlphanumeric(text) {
+	if (!isAlphanumeric(text)) throw new RangeError("String contains unencodable characters in alphanumeric mode");
+	const bb = [];
+	let i = 0;
+	for (; i + 2 <= text.length; i += 2) {
+		let temp = ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)) * 45;
+		temp += ALPHANUMERIC_CHARSET.indexOf(text.charAt(i + 1));
+		appendBits(temp, 11, bb);
+	}
+	if (i < text.length) appendBits(ALPHANUMERIC_CHARSET.indexOf(text.charAt(i)), 6, bb);
+	return new QrSegment(MODE_ALPHANUMERIC, text.length, bb);
+}
+function makeSegments(text) {
+	if (text === "") return [];
+	else if (isNumeric(text)) return [makeNumeric(text)];
+	else if (isAlphanumeric(text)) return [makeAlphanumeric(text)];
+	else return [makeBytes(toUtf8ByteArray(text))];
+}
+function isNumeric(text) {
+	return NUMERIC_REGEX.test(text);
+}
+function isAlphanumeric(text) {
+	return ALPHANUMERIC_REGEX.test(text);
+}
+function getTotalBits(segs, version) {
+	let result = 0;
+	for (const seg of segs) {
+		const ccbits = numCharCountBits(seg.mode, version);
+		if (seg.numChars >= 1 << ccbits) return Number.POSITIVE_INFINITY;
+		result += 4 + ccbits + seg.bitData.length;
+	}
+	return result;
+}
+function toUtf8ByteArray(str) {
+	str = encodeURI(str);
+	const result = [];
+	for (let i = 0; i < str.length; i++) if (str.charAt(i) !== "%") result.push(str.charCodeAt(i));
+	else {
+		result.push(Number.parseInt(str.substring(i + 1, i + 3), 16));
+		i += 2;
+	}
+	return result;
+}
+function getNumRawDataModules(ver) {
+	if (ver < MIN_VERSION || ver > MAX_VERSION) throw new RangeError("Version number out of range");
+	let result = (16 * ver + 128) * ver + 64;
+	if (ver >= 2) {
+		const numAlign = Math.floor(ver / 7) + 2;
+		result -= (25 * numAlign - 10) * numAlign - 55;
+		if (ver >= 7) result -= 36;
+	}
+	return result;
+}
+function getNumDataCodewords(ver, ecl) {
+	return Math.floor(getNumRawDataModules(ver) / 8) - ECC_CODEWORDS_PER_BLOCK[ecl[0]][ver] * NUM_ERROR_CORRECTION_BLOCKS[ecl[0]][ver];
+}
+function reedSolomonComputeDivisor(degree) {
+	if (degree < 1 || degree > 255) throw new RangeError("Degree out of range");
+	const result = [];
+	for (let i = 0; i < degree - 1; i++) result.push(0);
+	result.push(1);
+	let root = 1;
+	for (let i = 0; i < degree; i++) {
+		for (let j = 0; j < result.length; j++) {
+			result[j] = reedSolomonMultiply(result[j], root);
+			if (j + 1 < result.length) result[j] ^= result[j + 1];
+		}
+		root = reedSolomonMultiply(root, 2);
+	}
+	return result;
+}
+function reedSolomonComputeRemainder(data, divisor) {
+	const result = divisor.map((_) => 0);
+	for (const b of data) {
+		const factor = b ^ result.shift();
+		result.push(0);
+		divisor.forEach((coef, i) => result[i] ^= reedSolomonMultiply(coef, factor));
+	}
+	return result;
+}
+function reedSolomonMultiply(x, y) {
+	if (x >>> 8 !== 0 || y >>> 8 !== 0) throw new RangeError("Byte out of range");
+	let z = 0;
+	for (let i = 7; i >= 0; i--) {
+		z = z << 1 ^ (z >>> 7) * 285;
+		z ^= (y >>> i & 1) * x;
+	}
+	return z;
+}
+function encodeSegments(segs, ecl, minVersion = 1, maxVersion = 40, mask = -1, boostEcl = true) {
+	if (!(MIN_VERSION <= minVersion && minVersion <= maxVersion && maxVersion <= MAX_VERSION) || mask < -1 || mask > 7) throw new RangeError("Invalid value");
+	let version;
+	let dataUsedBits;
+	for (version = minVersion;; version++) {
+		const dataCapacityBits2 = getNumDataCodewords(version, ecl) * 8;
+		const usedBits = getTotalBits(segs, version);
+		if (usedBits <= dataCapacityBits2) {
+			dataUsedBits = usedBits;
+			break;
+		}
+		if (version >= maxVersion) throw new RangeError("Data too long");
+	}
+	for (const newEcl of [
+		MEDIUM,
+		QUARTILE,
+		HIGH
+	]) if (boostEcl && dataUsedBits <= getNumDataCodewords(version, newEcl) * 8) ecl = newEcl;
+	const bb = [];
+	for (const seg of segs) {
+		appendBits(seg.mode[0], 4, bb);
+		appendBits(seg.numChars, numCharCountBits(seg.mode, version), bb);
+		for (const b of seg.getData()) bb.push(b);
+	}
+	const dataCapacityBits = getNumDataCodewords(version, ecl) * 8;
+	appendBits(0, Math.min(4, dataCapacityBits - bb.length), bb);
+	appendBits(0, (8 - bb.length % 8) % 8, bb);
+	for (let padByte = 236; bb.length < dataCapacityBits; padByte ^= 253) appendBits(padByte, 8, bb);
+	const dataCodewords = Array.from({ length: Math.ceil(bb.length / 8) }, () => 0);
+	bb.forEach((b, i) => dataCodewords[i >>> 3] |= b << 7 - (i & 7));
+	return new QrCode$1(version, ecl, dataCodewords, mask);
+}
+function encode(data, options) {
+	const { ecc = "L", boostEcc = false, minVersion = 1, maxVersion = 40, maskPattern = -1, border = 1 } = options || {};
+	const segment = typeof data === "string" ? makeSegments(data) : Array.isArray(data) ? [makeBytes(data)] : void 0;
+	if (!segment) throw new Error(`uqr only supports encoding string and binary data, but got: ${typeof data}`);
+	const qr = encodeSegments(segment, EccMap[ecc], minVersion, maxVersion, maskPattern, boostEcc);
+	const result = addBorder({
+		version: qr.version,
+		maskPattern: qr.mask,
+		size: qr.size,
+		data: qr.modules,
+		types: qr.types
+	}, border);
+	if (options?.invert) result.data = result.data.map((row) => row.map((mod) => !mod));
+	options?.onEncoded?.(result);
+	return result;
+}
+function addBorder(input, border = 1) {
+	if (!border) return input;
+	const { size } = input;
+	const newSize = size + border * 2;
+	input.size = newSize;
+	input.data.forEach((row) => {
+		for (let i = 0; i < border; i++) {
+			row.unshift(false);
+			row.push(false);
+		}
+	});
+	for (let i = 0; i < border; i++) {
+		input.data.unshift(Array.from({ length: newSize }, (_) => false));
+		input.data.push(Array.from({ length: newSize }, (_) => false));
+	}
+	const b = QrCodeDataType.Border;
+	input.types.forEach((row) => {
+		for (let i = 0; i < border; i++) {
+			row.unshift(b);
+			row.push(b);
+		}
+	});
+	for (let i = 0; i < border; i++) {
+		input.types.unshift(Array.from({ length: newSize }, (_) => b));
+		input.types.push(Array.from({ length: newSize }, (_) => b));
+	}
+	return input;
+}
+//#endregion
+//#region src/qr-code.scss?inline
+var qr_code_default = "/* ex : var((width: 24px), width, c2-checkbox)  returns var(--c2-checkbox-width, 24px) */\n:host {\n  display: inline-flex;\n  vertical-align: middle;\n}\n\n:host([hidden]),\n.center[hidden] {\n  display: none;\n}\n\n.container,\n.placeholder {\n  box-sizing: border-box;\n  width: var(--c2-qr-code--size,200px);\n  height: var(--c2-qr-code--size,200px);\n  border-radius: var(--c2-qr-code__container--border-radius,8px);\n}\n\n.container {\n  position: relative;\n  display: inline-flex;\n  overflow: hidden;\n  background: var(--c2-qr-code__background--color,#ffffff);\n}\n\n.code {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.background {\n  fill: var(--c2-qr-code__background--color,#ffffff);\n}\n\n.modules {\n  fill: var(--c2-qr-code__module--color,#18181b);\n}\n\n.placeholder {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border: 1px dashed #bcbcc6;\n  color: var(--c2-qr-code__placeholder--color,#71717a);\n  font-size: var(--c2-qr-code__placeholder--font-size,12px);\n  text-align: center;\n}\n\n.center {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: flex;\n  box-sizing: border-box;\n  width: var(--c2-qr-code__center--size,20%);\n  height: var(--c2-qr-code__center--size,20%);\n  padding: var(--c2-qr-code__center--padding,4px);\n  transform: translate(-50%, -50%);\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--c2-qr-code__center--border-radius,6px);\n  background: var(--c2-qr-code__center--background-color,#ffffff);\n}\n\n::slotted([slot=center]) {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}";
+//#endregion
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/decorate.js
+function __decorate(decorators, target, key, desc) {
+	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+	return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+//#endregion
+//#region src/qr-code.ts
+var QrCode = class QrCode extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.value = "";
+		this.size = 200;
+		this.errorCorrection = "M";
+		this.margin = 4;
+		this.boostErrorCorrection = false;
+		this.ariaLabel = null;
+		this.modules = [];
+		this.encodingError = null;
+		this.hasCenter = false;
+	}
+	static {
+		this.styles = unsafeCSS(qr_code_default);
+	}
+	willUpdate(changed) {
+		if (changed.has("size")) this.size = Number.isFinite(this.size) ? Math.max(0, Math.floor(this.size)) : 200;
+		if (changed.has("margin")) this.margin = Number.isFinite(this.margin) ? Math.max(0, Math.floor(this.margin)) : 4;
+		if (changed.has("errorCorrection") && ![
+			"L",
+			"M",
+			"Q",
+			"H"
+		].includes(this.errorCorrection)) this.errorCorrection = "M";
+		if (changed.has("value") || changed.has("margin") || changed.has("errorCorrection") || changed.has("boostErrorCorrection")) this.encodeValue();
+	}
+	/** Returns a standalone SVG string using the component's current value and options. */
+	toSVG() {
+		if (!this.modules.length) return "";
+		const dimension = this.modules.length;
+		const foreground = this.resolvedColor("--c2-qr-code__module--color", "#18181b");
+		return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${dimension} ${dimension}" shape-rendering="crispEdges"><rect width="${dimension}" height="${dimension}" fill="${this.resolvedColor("--c2-qr-code__background--color", "#ffffff")}"/><path d="${this.modulePath}" fill="${foreground}"/></svg>`;
+	}
+	/** Returns a data URL for the current code. PNG export requires a browser document. */
+	async toDataURL(format = "png", scale = 4) {
+		const svg = this.toSVG();
+		if (!svg) return "";
+		const svgUrl = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+		if (format === "svg") return svgUrl;
+		const image = new Image();
+		image.src = svgUrl;
+		await image.decode();
+		const outputSize = Math.max(1, (this.size || 200) * Math.max(1, scale));
+		const canvas = document.createElement("canvas");
+		canvas.width = outputSize;
+		canvas.height = outputSize;
+		const context = canvas.getContext("2d");
+		if (!context) throw new Error("Canvas rendering is unavailable.");
+		context.imageSmoothingEnabled = false;
+		context.drawImage(image, 0, 0, outputSize, outputSize);
+		return canvas.toDataURL("image/png");
+	}
+	/** Downloads the current QR code as SVG or PNG. */
+	async download(filename = "qr-code", format = "png") {
+		const url = await this.toDataURL(format);
+		if (!url) return;
+		const anchor = document.createElement("a");
+		anchor.href = url;
+		anchor.download = `${filename}.${format}`;
+		anchor.click();
+	}
+	encodeValue() {
+		if (!this.value) {
+			this.modules = [];
+			this.encodingError = null;
+			return;
+		}
+		try {
+			this.modules = encode(this.value, {
+				ecc: this.errorCorrection,
+				border: this.margin,
+				boostEcc: this.boostErrorCorrection
+			}).data;
+			this.encodingError = null;
+		} catch (cause) {
+			const error = cause instanceof Error ? cause : new Error(String(cause));
+			this.modules = [];
+			this.encodingError = error;
+			queueMicrotask(() => this.dispatchEvent(new CustomEvent("qr-code-error", {
+				detail: {
+					error,
+					value: this.value
+				},
+				bubbles: true,
+				composed: true
+			})));
+		}
+	}
+	resolvedColor(name, fallback) {
+		if (typeof getComputedStyle !== "function") return fallback;
+		return getComputedStyle(this).getPropertyValue(name).trim() || fallback;
+	}
+	get modulePath() {
+		return this.modules.flatMap((row, y) => row.flatMap((active, x) => active ? `M${x} ${y}h1v1h-1z` : [])).join("");
+	}
+	handleCenterSlot(event) {
+		this.hasCenter = event.target.assignedElements().length > 0;
+	}
+	render() {
+		const label = this.ariaLabel || "QR code";
+		const hostSize = this.size > 0 ? `${this.size}px` : void 0;
+		if (!this.modules.length) return html`<div class="placeholder" style=${styleMap({
+			width: hostSize,
+			height: hostSize
+		})} role="img" aria-label=${label}>
+        ${this.encodingError ? "Unable to generate QR code" : "No value"}
+      </div>`;
+		const dimension = this.modules.length;
+		return html`
+      <div class="container" style=${styleMap({
+			width: hostSize,
+			height: hostSize
+		})}>
+        <svg class="code" viewBox="0 0 ${dimension} ${dimension}" role="img" aria-label=${label} shape-rendering="crispEdges">
+          <rect class="background" width=${dimension} height=${dimension}></rect>
+          <path class="modules" d=${this.modulePath}></path>
+        </svg>
+        <div class="center" ?hidden=${!this.hasCenter}><slot name="center" @slotchange=${this.handleCenterSlot}></slot></div>
+      </div>
+    `;
+	}
+};
+__decorate([property({ type: String })], QrCode.prototype, "value", void 0);
+__decorate([property({
+	type: Number,
+	reflect: true
+})], QrCode.prototype, "size", void 0);
+__decorate([property({
+	type: String,
+	attribute: "error-correction",
+	reflect: true
+})], QrCode.prototype, "errorCorrection", void 0);
+__decorate([property({
+	type: Number,
+	reflect: true
+})], QrCode.prototype, "margin", void 0);
+__decorate([property({
+	type: Boolean,
+	attribute: "boost-error-correction",
+	reflect: true
+})], QrCode.prototype, "boostErrorCorrection", void 0);
+__decorate([property({ attribute: "aria-label" })], QrCode.prototype, "ariaLabel", void 0);
+__decorate([state()], QrCode.prototype, "modules", void 0);
+__decorate([state()], QrCode.prototype, "encodingError", void 0);
+__decorate([state()], QrCode.prototype, "hasCenter", void 0);
+QrCode = __decorate([customElement("c2-qr-code")], QrCode);
+//#endregion
+export { QrCode };

package/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "@c2n/qr-code",
+  "version": "0.0.9",
+  "type": "module",
+  "main": "dist/qr-code.js",
+  "exports": {
+    ".": {
+      "types": "./types/src/qr-code.d.ts",
+      "default": "./dist/qr-code.js"
+    },
+    "./react": {
+      "types": "./react.d.ts",
+      "default": "./react.js"
+    },
+    "./vue": {
+      "types": "./vue.d.ts",
+      "default": "./vue.js"
+    },
+    "./custom-elements.json": "./custom-elements.json"
+  },
+  "files": [
+    "dist",
+    "types",
+    "react.d.ts",
+    "react.js",
+    "vue.d.ts",
+    "vue.js"
+  ],
+  "keywords": [
+    "qr-code",
+    "web component",
+    "lit"
+  ],
+  "license": "MIT",
+  "author": "code2nguyen@gmail.com",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org",
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/code2nguyen/web-components.git"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "wireit",
+    "build:only": "vite build",
+    "type-check": "wireit"
+  },
+  "wireit": {
+    "type-check": {
+      "dependencies": [
+        "../../core:build"
+      ],
+      "command": "tsc -p tsconfig.lib.json --composite false"
+    },
+    "build": {
+      "dependencies": [
+        "type-check"
+      ],
+      "command": "vite build"
+    }
+  },
+  "dependencies": {
+    "@c2n/core": "0.0.9",
+    "lit": "3.3.3",
+    "uqr": "^0.1.3"
+  },
+  "devDependencies": {
+    "@c2n/config": "*"
+  },
+  "customElements": "custom-elements.json",
+  "gitHead": "e4768cce5e0fbd5bc3165cd493a1e8d57cf0fff4"
+}

package/react.d.ts

@@ -0,0 +1,24 @@
+// GENERATED by @c2n/framework-types. Do not edit by hand.
+//
+// JSX types for the custom elements of @c2n/qr-code. Import once, anywhere in the program:
+//
+//     import '@c2n/qr-code/react'
+//
+// Register the elements at module scope before React renders, or React writes an object prop as an
+// attribute and it stringifies.
+
+import type { DetailedHTMLProps, HTMLAttributes } from 'react'
+import type { QrCode } from '@c2n/qr-code'
+
+/** Standard React host-element attributes plus the element's own public properties. */
+type C2Props<T> = DetailedHTMLProps<HTMLAttributes<T>, T> & Partial<Omit<T, keyof HTMLElement>>
+
+declare module 'react' {
+  namespace JSX {
+    interface IntrinsicElements {
+      'c2-qr-code': C2Props<QrCode>
+    }
+  }
+}
+
+export {}

package/react.js

@@ -0,0 +1,3 @@
+// GENERATED by @c2n/framework-types. Do not edit by hand.
+// Types only — see the matching .d.ts.
+export {}

package/types/src/qr-code.d.ts

@@ -0,0 +1,71 @@
+import { LitElement, type PropertyValues } from 'lit';
+import type { TypedAddEventListener, TypedRemoveEventListener } from '@c2n/core/event-helper.js';
+export type QrCodeErrorCorrection = 'L' | 'M' | 'Q' | 'H';
+export interface QrCodeErrorEventDetail {
+    error: Error;
+    value: string;
+}
+/** Events fired by {@link QrCode}, keyed for `addEventListener`. */
+export interface QrCodeEventMap {
+    'qr-code-error': CustomEvent<QrCodeErrorEventDetail>;
+}
+export interface QrCode {
+    addEventListener: TypedAddEventListener<QrCode, QrCodeEventMap>;
+    removeEventListener: TypedRemoveEventListener<QrCode, QrCodeEventMap>;
+}
+/**
+ * Generates an accessible, themeable SVG QR code without sending its value to a remote service.
+ *
+ * @tag c2-qr-code
+ *
+ * @slot center - Optional logo or mark centered over the code. Prefer `error-correction="H"` and keep the mark small so the code remains scannable.
+ *
+ * @event {CustomEvent<QrCodeErrorEventDetail>} qr-code-error - Fired when the value cannot be encoded. `detail` contains the error and rejected value.
+ *
+ * @cssproperty {pixel} [--c2-qr-code--size=200px]
+ * @cssproperty {color} [--c2-qr-code__module--color=#18181b]
+ * @cssproperty {color} [--c2-qr-code__background--color=#ffffff]
+ * @cssproperty {border-radius} [--c2-qr-code__container--border-radius=8px]
+ * @cssproperty {color} [--c2-qr-code__placeholder--color=#71717a]
+ * @cssproperty {font-size} [--c2-qr-code__placeholder--font-size=12px]
+ * @cssproperty {length} [--c2-qr-code__center--size=20%]
+ * @cssproperty {color} [--c2-qr-code__center--background-color=#ffffff]
+ * @cssproperty {padding} [--c2-qr-code__center--padding=4px]
+ * @cssproperty {border-radius} [--c2-qr-code__center--border-radius=6px]
+ */
+export declare class QrCode extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Text or URL encoded by the QR code. */
+    value: string;
+    /** Rendered width and height in CSS pixels. Set to `0` to use `--c2-qr-code--size`. */
+    size: number;
+    /** Error correction level: L (7%), M (15%), Q (25%), or H (30%). */
+    errorCorrection: QrCodeErrorCorrection;
+    /** Quiet-zone width measured in QR modules. Four is recommended for reliable scanning. */
+    margin: number;
+    /** Raises error correction when the encoded version has spare capacity. */
+    boostErrorCorrection: boolean;
+    /** Accessible name announced for the generated image. Defaults to `QR code`. */
+    ariaLabel: string | null;
+    private modules;
+    private encodingError;
+    private hasCenter;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    /** Returns a standalone SVG string using the component's current value and options. */
+    toSVG(): string;
+    /** Returns a data URL for the current code. PNG export requires a browser document. */
+    toDataURL(format?: 'svg' | 'png', scale?: number): Promise<string>;
+    /** Downloads the current QR code as SVG or PNG. */
+    download(filename?: string, format?: 'svg' | 'png'): Promise<void>;
+    private encodeValue;
+    private resolvedColor;
+    private get modulePath();
+    private handleCenterSlot;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'c2-qr-code': QrCode;
+    }
+}
+//# sourceMappingURL=qr-code.d.ts.map

package/types/src/qr-code.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"qr-code.d.ts","sourceRoot":"","sources":["../../src/qr-code.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAA;AAItE,OAAO,KAAK,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAA;AAIhG,MAAM,MAAM,qBAAqB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAA;AAEzD,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,KAAK,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;CACd;AAED,oEAAoE;AACpE,MAAM,WAAW,cAAc;IAC7B,eAAe,EAAE,WAAW,CAAC,sBAAsB,CAAC,CAAA;CACrD;AAED,MAAM,WAAW,MAAM;IACrB,gBAAgB,EAAE,qBAAqB,CAAC,MAAM,EAAE,cAAc,CAAC,CAAA;IAC/D,mBAAmB,EAAE,wBAAwB,CAAC,MAAM,EAAE,cAAc,CAAC,CAAA;CACtE;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBACa,MAAO,SAAQ,UAAU;IACpC,OAAgB,MAAM,0BAAoB;IAE1C,0CAA0C;IACd,KAAK,SAAK;IAEtC,uFAAuF;IAC5C,IAAI,SAAM;IAErD,oEAAoE;IACM,eAAe,EAAE,qBAAqB,CAAM;IAEtH,0FAA0F;IAC/C,MAAM,SAAI;IAErD,2EAA2E;IACM,oBAAoB,UAAQ;IAE7G,gFAAgF;IAChC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAO;IAEtE,OAAO,CAAC,OAAO,CAAkB;IACjC,OAAO,CAAC,aAAa,CAAqB;IAC1C,OAAO,CAAC,SAAS,CAAQ;cAEf,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOlE,uFAAuF;IACvF,KAAK,IAAI,MAAM;IAQf,uFAAuF;IACjF,SAAS,CAAC,MAAM,GAAE,KAAK,GAAG,KAAa,EAAE,KAAK,SAAI,GAAG,OAAO,CAAC,MAAM,CAAC;IAmB1E,mDAAmD;IAC7C,QAAQ,CAAC,QAAQ,SAAY,EAAE,MAAM,GAAE,KAAK,GAAG,KAAa,GAAG,OAAO,CAAC,IAAI,CAAC;IASlF,OAAO,CAAC,WAAW;IAmBnB,OAAO,CAAC,aAAa;IAKrB,OAAO,KAAK,UAAU,GAErB;IAED,OAAO,CAAC,gBAAgB;IAIf,MAAM;CAmBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,MAAM,CAAA;KACrB;CACF"}

package/vue.d.ts

@@ -0,0 +1,36 @@
+// GENERATED by @c2n/framework-types. Do not edit by hand.
+//
+// Vue template types for the custom elements of @c2n/qr-code. Import once, anywhere in the program:
+//
+//     import '@c2n/qr-code/vue'
+//
+// Tell the compiler about the tags as well, or every c2-* tag is resolved as a Vue component and renders
+// nothing: template.compilerOptions.isCustomElement = (tag) => tag.startsWith('c2-') in vite.config.ts.
+
+import type { DefineComponent, HTMLAttributes } from 'vue'
+import type { QrCode, QrCodeEventMap } from '@c2n/qr-code'
+
+/** The element's own public properties, plus every attribute Vue understands on a host element. */
+type C2Props<T> = Partial<Omit<T, keyof HTMLElement>> & HTMLAttributes
+
+declare module 'vue' {
+  interface GlobalComponents {
+    'c2-qr-code': DefineComponent<
+      C2Props<QrCode> & {
+        'error-correction'?: unknown
+        'boost-error-correction'?: unknown
+        'aria-label'?: unknown
+        onQrCodeError?: (event: QrCodeEventMap['qr-code-error']) => void
+      }
+    >
+  }
+}
+
+declare module '@vue/runtime-dom' {
+  interface HTMLAttributes {
+    /** Vue's own definition omits it, and slotting a plain element into a component needs it. */
+    slot?: string
+  }
+}
+
+export {}

package/vue.js

@@ -0,0 +1,3 @@
+// GENERATED by @c2n/framework-types. Do not edit by hand.
+// Types only — see the matching .d.ts.
+export {}