coinley-checkout 0.2.3 → 0.2.4

package/dist/coinley-checkout.es.js

@@ -1106,77 +1106,23 @@ const CoinleyProvider = ({
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsx(CoinleyContext.Provider, { value, children });
 };
-function renderQR(text, size) {
-  const matrix = generateQRMatrix(text);
-  const cellSize = Math.floor(size / matrix.length);
-  const qrSize = cellSize * matrix.length;
-  let svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${qrSize}" height="${qrSize}" viewBox="0 0 ${qrSize} ${qrSize}">`;
-  svg += `<rect width="${qrSize}" height="${qrSize}" fill="white"/>`;
-  for (let y = 0; y < matrix.length; y++) {
-    for (let x = 0; x < matrix.length; x++) {
-      if (matrix[y][x]) {
-        svg += `<rect x="${x * cellSize}" y="${y * cellSize}" width="${cellSize}" height="${cellSize}" fill="black"/>`;
-      }
-    }
-  }
-  svg += "</svg>";
-  return svg;
-}
-function generateQRMatrix(text) {
-  const hash = simpleHash(text);
-  const size = 21;
-  const matrix = Array(size).fill().map(() => Array(size).fill(0));
-  addPositionPattern(matrix, 0, 0);
-  addPositionPattern(matrix, 0, size - 7);
-  addPositionPattern(matrix, size - 7, 0);
-  for (let i = 8; i < size - 8; i++) {
-    matrix[6][i] = i % 2 === 0 ? 1 : 0;
-    matrix[i][6] = i % 2 === 0 ? 1 : 0;
-  }
-  addAlignmentPattern(matrix, size - 9, size - 9);
-  fillData(matrix, hash);
-  return matrix;
-}
-function simpleHash(str) {
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    hash = (hash << 5) - hash + str.charCodeAt(i);
-    hash = hash & hash;
-  }
-  return Math.abs(hash);
-}
-function addPositionPattern(matrix, row, col) {
-  for (let r = 0; r < 7; r++) {
-    for (let c = 0; c < 7; c++) {
-      matrix[row + r][col + c] = r === 0 || r === 6 || c === 0 || c === 6 || r >= 2 && r <= 4 && c >= 2 && c <= 4 ? 1 : 0;
-    }
-  }
-}
-function addAlignmentPattern(matrix, row, col) {
-  for (let r = -2; r <= 2; r++) {
-    for (let c = -2; c <= 2; c++) {
-      matrix[row + r][col + c] = r === -2 || r === 2 || c === -2 || c === 2 || r === 0 && c === 0 ? 1 : 0;
-    }
-  }
-}
-function fillData(matrix, hash) {
-  const size = matrix.length;
-  for (let r = 8; r < size - 8; r++) {
-    for (let c = 8; c < size - 8; c++) {
-      matrix[r][c] = hash * r * c % 5 < 2 ? 1 : 0;
-    }
-  }
-}
 const QRCode = ({
   walletAddress,
   amount,
   currency,
   theme = "light"
 }) => {
-  const qrData = `${currency}:${walletAddress}?amount=${amount}`;
-  const qrSvg = renderQR(qrData, 200);
+  const qrCodeUrl = `https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=${encodeURIComponent(`${currency}:${walletAddress}?amount=${amount}`)}&choe=UTF-8`;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-4 rounded-lg bg-white mb-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: qrSvg } }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-4 rounded-lg bg-white mb-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "img",
+      {
+        src: qrCodeUrl,
+        alt: `QR Code for ${currency} payment`,
+        width: "200",
+        height: "200"
+      }
+    ) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center text-sm text-gray-700", children: "Scan with your wallet app to pay" }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-3 w-full", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xs text-gray-500 mb-1", children: [
@@ -1186,23 +1132,8 @@ const QRCode = ({
         currency,
         " to:"
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs font-mono p-2 rounded overflow-auto break-all bg-gray-100 text-gray-700", children: walletAddress || "0x742d35Cc6634C0532925a3b844Bc454e4438f44e" })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-4 w-full", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 rounded bg-gray-100", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: "text-sm font-medium mb-2 text-gray-800", children: "Payment Instructions" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("ol", { className: "text-xs space-y-2 text-gray-600", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: "1. Open your crypto wallet app" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: "2. Scan the QR code above" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { children: [
-          "3. Confirm the payment amount (",
-          amount,
-          " ",
-          currency,
-          ")"
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("li", { children: '4. Click "Pay Now" button below after sending the payment' })
-      ] })
-    ] }) })
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs font-mono p-2 rounded overflow-auto break-all bg-gray-100 text-gray-700", children: walletAddress })
+    ] })
   ] });
 };
 const PaymentStatus = ({ status, message, theme = "light" }) => {