jaci-ui 0.9.0 → 0.9.2

package/dist/components/qr-code/qr-code.js

@@ -1,7 +1,7 @@
 import { cx } from "../../styled-system/css/cx.js";
 import { qrCode } from "../../styled-system/recipes/qr-code.js";
 import { forwardRef } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as QRCodeEncoder from "qrcode";
 //#region src/components/qr-code/qr-code.tsx
 function isFinderCell(row, column, size) {
@@ -12,6 +12,7 @@ function Finder({ x, y, color, background }) {
 		"data-slot": "qr-code-eye",
 		children: [
 			/* @__PURE__ */ jsx("rect", {
+				"data-slot": "qr-code-eye-frame",
 				fill: color,
 				height: "7",
 				rx: "1",
@@ -20,6 +21,7 @@ function Finder({ x, y, color, background }) {
 				y
 			}),
 			/* @__PURE__ */ jsx("rect", {
+				"data-slot": "qr-code-eye-cutout",
 				fill: background,
 				height: "5",
 				rx: "0.75",
@@ -28,6 +30,7 @@ function Finder({ x, y, color, background }) {
 				y: y + 1
 			}),
 			/* @__PURE__ */ jsx("rect", {
+				"data-slot": "qr-code-eyeball",
 				fill: color,
 				height: "3",
 				rx: "0.5",
@@ -38,66 +41,108 @@ function Finder({ x, y, color, background }) {
 		]
 	});
 }
-const QRCode = forwardRef(function QRCode({ background = "transparent", className, errorCorrectionLevel = "Q", fallback, foreground = "currentColor", label = "QR code", margin = 2, size = 192, style, value, ...props }, ref) {
+function escapeXml(value) {
+	return value.replace(/[&<>'"]/g, (character) => {
+		return {
+			"&": "&amp;",
+			"<": "&lt;",
+			">": "&gt;",
+			"'": "&apos;",
+			"\"": "&quot;"
+		}[character] ?? character;
+	});
+}
+function createDownloadSvg({ background, dots, foreground, finderBackground, label, margin, moduleCount }) {
+	const viewBoxSize = moduleCount + margin * 2;
+	const backgroundMarkup = background === "transparent" ? "" : `<rect fill="${escapeXml(background)}" height="${viewBoxSize}" width="${viewBoxSize}" x="0" y="0"/>`;
+	const dotsMarkup = dots.map(([row, column]) => `<circle cx="${margin + column + .5}" cy="${margin + row + .5}" fill="${escapeXml(foreground)}" r="0.43"/>`).join("");
+	const finderMarkup = (x, y) => `<g><rect fill="${escapeXml(foreground)}" height="7" rx="1" width="7" x="${x}" y="${y}"/><rect fill="${escapeXml(finderBackground)}" height="5" rx="0.75" width="5" x="${x + 1}" y="${y + 1}"/><rect fill="${escapeXml(foreground)}" height="3" rx="0.5" width="3" x="${x + 2}" y="${y + 2}"/></g>`;
+	return `<svg xmlns="http://www.w3.org/2000/svg" aria-label="${escapeXml(label)}" role="img" viewBox="0 0 ${viewBoxSize} ${viewBoxSize}">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;
+}
+const QRCode = forwardRef(function QRCode({ background = "#ffffff", className, download = false, downloadLabel = "Download QR code", errorCorrectionLevel = "Q", fallback, foreground = "#18181b", label = "QR code", margin = 2, size = 192, style, value, ...props }, ref) {
 	const safeSize = Number.isFinite(size) && size > 0 ? size : 192;
 	const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;
-	const finderBackground = background === "transparent" ? "white" : background;
+	const finderBackground = background === "transparent" ? "var(--jaci-colors-surface-raised)" : background;
 	try {
 		const code = QRCodeEncoder.create(value, { errorCorrectionLevel });
 		const moduleCount = code.modules.size;
 		const viewBoxSize = moduleCount + safeMargin * 2;
 		const modules = [];
-		for (let row = 0; row < moduleCount; row += 1) for (let column = 0; column < moduleCount; column += 1) if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) modules.push(/* @__PURE__ */ jsx("circle", {
-			cx: safeMargin + column + .5,
-			cy: safeMargin + row + .5,
-			"data-slot": "qr-code-dot",
-			fill: foreground,
-			r: "0.43"
-		}, `${row}-${column}`));
-		return /* @__PURE__ */ jsxs("svg", {
+		const dotCoordinates = [];
+		for (let row = 0; row < moduleCount; row += 1) for (let column = 0; column < moduleCount; column += 1) if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {
+			dotCoordinates.push([row, column]);
+			modules.push(/* @__PURE__ */ jsx("circle", {
+				cx: safeMargin + column + .5,
+				cy: safeMargin + row + .5,
+				"data-slot": "qr-code-dot",
+				fill: foreground,
+				r: "0.43"
+			}, `${row}-${column}`));
+		}
+		const downloadHref = download && `data:image/svg+xml;charset=utf-8,${encodeURIComponent(createDownloadSvg({
+			background,
+			dots: dotCoordinates,
+			foreground,
+			finderBackground: background === "transparent" ? "#ffffff" : background,
+			label,
+			margin: safeMargin,
+			moduleCount
+		}))}`;
+		const downloadFilename = typeof download === "string" ? download : "qrcode.svg";
+		const visualCode = /* @__PURE__ */ jsxs(Fragment, { children: [
+			background !== "transparent" ? /* @__PURE__ */ jsx("rect", {
+				fill: background,
+				height: viewBoxSize,
+				width: viewBoxSize,
+				x: "0",
+				y: "0"
+			}) : null,
+			modules,
+			/* @__PURE__ */ jsx(Finder, {
+				background: finderBackground,
+				color: foreground,
+				x: safeMargin,
+				y: safeMargin
+			}),
+			/* @__PURE__ */ jsx(Finder, {
+				background: finderBackground,
+				color: foreground,
+				x: safeMargin + moduleCount - 7,
+				y: safeMargin
+			}),
+			/* @__PURE__ */ jsx(Finder, {
+				background: finderBackground,
+				color: foreground,
+				x: safeMargin,
+				y: safeMargin + moduleCount - 7
+			})
+		] });
+		const svg = /* @__PURE__ */ jsxs("svg", {
 			...props,
 			ref,
-			"aria-label": label,
+			"aria-hidden": downloadHref ? true : void 0,
+			"aria-label": downloadHref ? void 0 : label,
 			className: cx(qrCode(), className),
 			"data-dot-shape": "circle",
+			"data-download": download ? "true" : void 0,
 			"data-eye-shape": "rounded-square",
 			"data-jaci-component": "qr-code",
 			"data-slot": "qr-code",
 			height: safeSize,
-			role: "img",
+			role: downloadHref ? void 0 : "img",
 			style,
 			viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`,
 			width: safeSize,
-			children: [
-				/* @__PURE__ */ jsx("title", { children: label }),
-				background !== "transparent" ? /* @__PURE__ */ jsx("rect", {
-					fill: background,
-					height: viewBoxSize,
-					width: viewBoxSize,
-					x: "0",
-					y: "0"
-				}) : null,
-				modules,
-				/* @__PURE__ */ jsx(Finder, {
-					background: finderBackground,
-					color: foreground,
-					x: safeMargin,
-					y: safeMargin
-				}),
-				/* @__PURE__ */ jsx(Finder, {
-					background: finderBackground,
-					color: foreground,
-					x: safeMargin + moduleCount - 7,
-					y: safeMargin
-				}),
-				/* @__PURE__ */ jsx(Finder, {
-					background: finderBackground,
-					color: foreground,
-					x: safeMargin,
-					y: safeMargin + moduleCount - 7
-				})
-			]
+			children: [/* @__PURE__ */ jsx("title", { children: label }), visualCode]
 		});
+		return downloadHref ? /* @__PURE__ */ jsx("a", {
+			"aria-label": downloadLabel,
+			"data-jaci-component": "qr-code-download",
+			"data-slot": "qr-code-download",
+			download: downloadFilename,
+			href: downloadHref,
+			children: svg
+		}) : svg;
 	} catch {
 		return /* @__PURE__ */ jsx("span", {
 			"aria-label": label,

package/dist/components/qr-code/qr-code.js.map

@@ -1 +1 @@
-{"version":3,"file":"qr-code.js","names":[],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\"> {\n  value: string;\n  size?: number;\n  margin?: number;\n  errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n  foreground?: string;\n  background?: string;\n  label?: string;\n  fallback?: ReactNode;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n  return (\n    (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n  );\n}\n\nfunction Finder({\n  x,\n  y,\n  color,\n  background,\n}: {\n  x: number;\n  y: number;\n  color: string;\n  background: string;\n}) {\n  return (\n    <g data-slot=\"qr-code-eye\">\n      <rect fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n      <rect fill={background} height=\"5\" rx=\"0.75\" width=\"5\" x={x + 1} y={y + 1} />\n      <rect fill={color} height=\"3\" rx=\"0.5\" width=\"3\" x={x + 2} y={y + 2} />\n    </g>\n  );\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n  {\n    background = \"transparent\",\n    className,\n    errorCorrectionLevel = \"Q\",\n    fallback,\n    foreground = \"currentColor\",\n    label = \"QR code\",\n    margin = 2,\n    size = 192,\n    style,\n    value,\n    ...props\n  },\n  ref,\n) {\n  const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n  const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n  // Finder patterns need a contrasting quiet area between the frame and the\n  // eyeball. Keep the overall SVG transparent by default, but use a white\n  // cutout when no background was supplied so the code remains scannable.\n  const finderBackground = background === \"transparent\" ? \"white\" : background;\n\n  try {\n    const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n    const moduleCount = code.modules.size;\n    const viewBoxSize = moduleCount + safeMargin * 2;\n    const modules: ReactNode[] = [];\n\n    for (let row = 0; row < moduleCount; row += 1) {\n      for (let column = 0; column < moduleCount; column += 1) {\n        if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n          modules.push(\n            <circle\n              cx={safeMargin + column + 0.5}\n              cy={safeMargin + row + 0.5}\n              data-slot=\"qr-code-dot\"\n              fill={foreground}\n              key={`${row}-${column}`}\n              r=\"0.43\"\n            />,\n          );\n        }\n      }\n    }\n\n    return (\n      <svg\n        {...props}\n        ref={ref}\n        aria-label={label}\n        className={cx(qrCode(), className)}\n        data-dot-shape=\"circle\"\n        data-eye-shape=\"rounded-square\"\n        data-jaci-component=\"qr-code\"\n        data-slot=\"qr-code\"\n        height={safeSize}\n        role=\"img\"\n        style={style}\n        viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n        width={safeSize}\n      >\n        <title>{label}</title>\n        {background !== \"transparent\" ? (\n          <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n        ) : null}\n        {modules}\n        <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n        <Finder\n          background={finderBackground}\n          color={foreground}\n          x={safeMargin + moduleCount - 7}\n          y={safeMargin}\n        />\n        <Finder\n          background={finderBackground}\n          color={foreground}\n          x={safeMargin}\n          y={safeMargin + moduleCount - 7}\n        />\n      </svg>\n    );\n  } catch {\n    return (\n      <span\n        aria-label={label}\n        className={cx(qrCode(), className)}\n        data-jaci-component=\"qr-code\"\n        data-slot=\"qr-code\"\n        data-status=\"error\"\n        role=\"img\"\n      >\n        {fallback ?? \"Unable to generate QR code\"}\n      </span>\n    );\n  }\n});\n"],"mappings":";;;;;;AAoBA,SAAS,aAAa,KAAa,QAAgB,MAAc;CAC/D,OACG,MAAM,KAAK,SAAS,KAAO,MAAM,KAAK,UAAU,OAAO,KAAO,OAAO,OAAO,KAAK,SAAS;AAE/F;AAEA,SAAS,OAAO,EACd,GACA,GACA,OACA,cAMC;CACD,OACE,qBAAC,KAAD;EAAG,aAAU;YAAb;GACE,oBAAC,QAAD;IAAM,MAAM;IAAO,QAAO;IAAI,IAAG;IAAI,OAAM;IAAO;IAAM;GAAI,CAAA;GAC5D,oBAAC,QAAD;IAAM,MAAM;IAAY,QAAO;IAAI,IAAG;IAAO,OAAM;IAAI,GAAG,IAAI;IAAG,GAAG,IAAI;GAAI,CAAA;GAC5E,oBAAC,QAAD;IAAM,MAAM;IAAO,QAAO;IAAI,IAAG;IAAM,OAAM;IAAI,GAAG,IAAI;IAAG,GAAG,IAAI;GAAI,CAAA;EACrE;;AAEP;AAEA,MAAa,SAAS,WAAuC,SAAS,OACpE,EACE,aAAa,eACb,WACA,uBAAuB,KACvB,UACA,aAAa,gBACb,QAAQ,WACR,SAAS,GACT,OAAO,KACP,OACA,OACA,GAAG,SAEL,KACA;CACA,MAAM,WAAW,OAAO,SAAS,IAAI,KAAK,OAAO,IAAI,OAAO;CAC5D,MAAM,aAAa,OAAO,SAAS,MAAM,KAAK,UAAU,IAAI,KAAK,MAAM,MAAM,IAAI;CAIjF,MAAM,mBAAmB,eAAe,gBAAgB,UAAU;CAElE,IAAI;EACF,MAAM,OAAO,cAAc,OAAO,OAAO,EAAE,qBAAqB,CAAC;EACjE,MAAM,cAAc,KAAK,QAAQ;EACjC,MAAM,cAAc,cAAc,aAAa;EAC/C,MAAM,UAAuB,CAAC;EAE9B,KAAK,IAAI,MAAM,GAAG,MAAM,aAAa,OAAO,GAC1C,KAAK,IAAI,SAAS,GAAG,SAAS,aAAa,UAAU,GACnD,IAAI,KAAK,QAAQ,IAAI,KAAK,MAAM,KAAK,CAAC,aAAa,KAAK,QAAQ,WAAW,GACzE,QAAQ,KACN,oBAAC,UAAD;GACE,IAAI,aAAa,SAAS;GAC1B,IAAI,aAAa,MAAM;GACvB,aAAU;GACV,MAAM;GAEN,GAAE;EACH,GAFM,GAAG,IAAI,GAAG,QAEhB,CACH;EAKN,OACE,qBAAC,OAAD;GACE,GAAI;GACC;GACL,cAAY;GACZ,WAAW,GAAG,OAAO,GAAG,SAAS;GACjC,kBAAe;GACf,kBAAe;GACf,uBAAoB;GACpB,aAAU;GACV,QAAQ;GACR,MAAK;GACE;GACP,SAAS,OAAO,YAAY,GAAG;GAC/B,OAAO;aAbT;IAeE,oBAAC,SAAD,EAAA,UAAQ,MAAa,CAAA;IACpB,eAAe,gBACd,oBAAC,QAAD;KAAM,MAAM;KAAY,QAAQ;KAAa,OAAO;KAAa,GAAE;KAAI,GAAE;IAAK,CAAA,IAC5E;IACH;IACD,oBAAC,QAAD;KAAQ,YAAY;KAAkB,OAAO;KAAY,GAAG;KAAY,GAAG;IAAa,CAAA;IACxF,oBAAC,QAAD;KACE,YAAY;KACZ,OAAO;KACP,GAAG,aAAa,cAAc;KAC9B,GAAG;IACJ,CAAA;IACD,oBAAC,QAAD;KACE,YAAY;KACZ,OAAO;KACP,GAAG;KACH,GAAG,aAAa,cAAc;IAC/B,CAAA;GACE;;CAET,QAAQ;EACN,OACE,oBAAC,QAAD;GACE,cAAY;GACZ,WAAW,GAAG,OAAO,GAAG,SAAS;GACjC,uBAAoB;GACpB,aAAU;GACV,eAAY;GACZ,MAAK;aAEJ,YAAY;EACT,CAAA;CAEV;AACF,CAAC"}
+{"version":3,"file":"qr-code.js","names":[],"sources":["../../../src/components/qr-code/qr-code.tsx"],"sourcesContent":["import * as QRCodeEncoder from \"qrcode\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { qrCode } from \"../../styled-system/recipes\";\n\nexport type QRCodeErrorCorrectionLevel = \"L\" | \"M\" | \"Q\" | \"H\";\n\nexport interface QRCodeProps\n  extends Omit<ComponentPropsWithoutRef<\"svg\">, \"children\" | \"download\"> {\n  value: string;\n  size?: number;\n  margin?: number;\n  errorCorrectionLevel?: QRCodeErrorCorrectionLevel;\n  foreground?: string;\n  background?: string;\n  label?: string;\n  fallback?: ReactNode;\n  /** Enables a native SVG download link inside the rendered code. */\n  download?: boolean | string;\n  downloadLabel?: string;\n}\n\nfunction isFinderCell(row: number, column: number, size: number) {\n  return (\n    (row < 7 && column < 7) || (row < 7 && column >= size - 7) || (row >= size - 7 && column < 7)\n  );\n}\n\nfunction Finder({\n  x,\n  y,\n  color,\n  background,\n}: {\n  x: number;\n  y: number;\n  color: string;\n  background: string;\n}) {\n  return (\n    <g data-slot=\"qr-code-eye\">\n      <rect data-slot=\"qr-code-eye-frame\" fill={color} height=\"7\" rx=\"1\" width=\"7\" x={x} y={y} />\n      <rect\n        data-slot=\"qr-code-eye-cutout\"\n        fill={background}\n        height=\"5\"\n        rx=\"0.75\"\n        width=\"5\"\n        x={x + 1}\n        y={y + 1}\n      />\n      <rect\n        data-slot=\"qr-code-eyeball\"\n        fill={color}\n        height=\"3\"\n        rx=\"0.5\"\n        width=\"3\"\n        x={x + 2}\n        y={y + 2}\n      />\n    </g>\n  );\n}\n\nfunction escapeXml(value: string) {\n  return value.replace(/[&<>'\"]/g, (character) => {\n    const entities: Record<string, string> = {\n      \"&\": \"&amp;\",\n      \"<\": \"&lt;\",\n      \">\": \"&gt;\",\n      \"'\": \"&apos;\",\n      '\"': \"&quot;\",\n    };\n    return entities[character] ?? character;\n  });\n}\n\nfunction createDownloadSvg({\n  background,\n  dots,\n  foreground,\n  finderBackground,\n  label,\n  margin,\n  moduleCount,\n}: {\n  background: string;\n  dots: readonly [number, number][];\n  foreground: string;\n  finderBackground: string;\n  label: string;\n  margin: number;\n  moduleCount: number;\n}) {\n  const viewBoxSize = moduleCount + margin * 2;\n  const backgroundMarkup =\n    background === \"transparent\"\n      ? \"\"\n      : `<rect fill=\"${escapeXml(background)}\" height=\"${viewBoxSize}\" width=\"${viewBoxSize}\" x=\"0\" y=\"0\"/>`;\n  const dotsMarkup = dots\n    .map(\n      ([row, column]) =>\n        `<circle cx=\"${margin + column + 0.5}\" cy=\"${margin + row + 0.5}\" fill=\"${escapeXml(foreground)}\" r=\"0.43\"/>`,\n    )\n    .join(\"\");\n  const finderMarkup = (x: number, y: number) =>\n    `<g><rect fill=\"${escapeXml(foreground)}\" height=\"7\" rx=\"1\" width=\"7\" x=\"${x}\" y=\"${y}\"/><rect fill=\"${escapeXml(finderBackground)}\" height=\"5\" rx=\"0.75\" width=\"5\" x=\"${x + 1}\" y=\"${y + 1}\"/><rect fill=\"${escapeXml(foreground)}\" height=\"3\" rx=\"0.5\" width=\"3\" x=\"${x + 2}\" y=\"${y + 2}\"/></g>`;\n\n  return `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-label=\"${escapeXml(label)}\" role=\"img\" viewBox=\"0 0 ${viewBoxSize} ${viewBoxSize}\">${backgroundMarkup}${dotsMarkup}${finderMarkup(margin, margin)}${finderMarkup(margin + moduleCount - 7, margin)}${finderMarkup(margin, margin + moduleCount - 7)}</svg>`;\n}\n\nexport const QRCode = forwardRef<SVGSVGElement, QRCodeProps>(function QRCode(\n  {\n    // A QR code needs a deterministic high-contrast base. Inheriting\n    // `currentColor` or a transparent surface can make finder layers merge\n    // in dark scopes, so the defaults intentionally remain black on white.\n    background = \"#ffffff\",\n    className,\n    download = false,\n    downloadLabel = \"Download QR code\",\n    errorCorrectionLevel = \"Q\",\n    fallback,\n    foreground = \"#18181b\",\n    label = \"QR code\",\n    margin = 2,\n    size = 192,\n    style,\n    value,\n    ...props\n  },\n  ref,\n) {\n  const safeSize = Number.isFinite(size) && size > 0 ? size : 192;\n  const safeMargin = Number.isFinite(margin) && margin >= 0 ? Math.floor(margin) : 2;\n  const finderBackground =\n    background === \"transparent\" ? \"var(--jaci-colors-surface-raised)\" : background;\n\n  try {\n    const code = QRCodeEncoder.create(value, { errorCorrectionLevel });\n    const moduleCount = code.modules.size;\n    const viewBoxSize = moduleCount + safeMargin * 2;\n    const modules: ReactNode[] = [];\n    const dotCoordinates: [number, number][] = [];\n\n    for (let row = 0; row < moduleCount; row += 1) {\n      for (let column = 0; column < moduleCount; column += 1) {\n        if (code.modules.get(row, column) && !isFinderCell(row, column, moduleCount)) {\n          dotCoordinates.push([row, column]);\n          modules.push(\n            <circle\n              cx={safeMargin + column + 0.5}\n              cy={safeMargin + row + 0.5}\n              data-slot=\"qr-code-dot\"\n              fill={foreground}\n              key={`${row}-${column}`}\n              r=\"0.43\"\n            />,\n          );\n        }\n      }\n    }\n\n    const downloadHref =\n      download &&\n      `data:image/svg+xml;charset=utf-8,${encodeURIComponent(\n        createDownloadSvg({\n          background,\n          dots: dotCoordinates,\n          foreground,\n          finderBackground: background === \"transparent\" ? \"#ffffff\" : background,\n          label,\n          margin: safeMargin,\n          moduleCount,\n        }),\n      )}`;\n    const downloadFilename = typeof download === \"string\" ? download : \"qrcode.svg\";\n    const visualCode = (\n      <>\n        {background !== \"transparent\" ? (\n          <rect fill={background} height={viewBoxSize} width={viewBoxSize} x=\"0\" y=\"0\" />\n        ) : null}\n        {modules}\n        <Finder background={finderBackground} color={foreground} x={safeMargin} y={safeMargin} />\n        <Finder\n          background={finderBackground}\n          color={foreground}\n          x={safeMargin + moduleCount - 7}\n          y={safeMargin}\n        />\n        <Finder\n          background={finderBackground}\n          color={foreground}\n          x={safeMargin}\n          y={safeMargin + moduleCount - 7}\n        />\n      </>\n    );\n\n    const svg = (\n      <svg\n        {...props}\n        ref={ref}\n        aria-hidden={downloadHref ? true : undefined}\n        aria-label={downloadHref ? undefined : label}\n        className={cx(qrCode(), className)}\n        data-dot-shape=\"circle\"\n        data-download={download ? \"true\" : undefined}\n        data-eye-shape=\"rounded-square\"\n        data-jaci-component=\"qr-code\"\n        data-slot=\"qr-code\"\n        height={safeSize}\n        role={downloadHref ? undefined : \"img\"}\n        style={style}\n        viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n        width={safeSize}\n      >\n        <title>{label}</title>\n        {visualCode}\n      </svg>\n    );\n\n    return downloadHref ? (\n      <a\n        aria-label={downloadLabel}\n        data-jaci-component=\"qr-code-download\"\n        data-slot=\"qr-code-download\"\n        download={downloadFilename}\n        href={downloadHref}\n      >\n        {svg}\n      </a>\n    ) : (\n      svg\n    );\n  } catch {\n    return (\n      <span\n        aria-label={label}\n        className={cx(qrCode(), className)}\n        data-jaci-component=\"qr-code\"\n        data-slot=\"qr-code\"\n        data-status=\"error\"\n        role=\"img\"\n      >\n        {fallback ?? \"Unable to generate QR code\"}\n      </span>\n    );\n  }\n});\n"],"mappings":"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"}