coinley-checkout 0.5.9 → 0.6.1

package/dist/coinley-checkout.es.js

@@ -20591,11 +20591,13 @@ const PaymentStatus = ({
   status,
   message,
   theme: theme2 = "light",
-  // New props for success screen
+  // Props for success screen
   payment = null,
   transactionHash = null,
   selectedPaymentMethod = null,
-  merchantName = "Merchant"
+  merchantName = "Merchant",
+  onClose = null
+  // The onClose prop for the close button
 }) => {
   const [copiedHash, setCopiedHash] = useState(false);
   const copyTransactionHash = () => __async(void 0, null, function* () {
@@ -20609,6 +20611,12 @@ const PaymentStatus = ({
       }
     }
   });
+  const handleClose = () => {
+    console.log("Payment success screen close button clicked");
+    if (onClose) {
+      onClose();
+    }
+  };
   const formatTransactionHash = (hash2) => {
     if (!hash2)
       return "";
@@ -20728,7 +20736,7 @@ const PaymentStatus = ({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-full p-4 rounded-lg border ${theme2 === "dark" ? "bg-gray-700 border-gray-600" : "bg-gray-50 border-gray-200"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `w-full p-4 rounded-lg border mb-6 ${theme2 === "dark" ? "bg-gray-700 border-gray-600" : "bg-gray-50 border-gray-200"}`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-xs font-medium mb-1 ${theme2 === "dark" ? "text-gray-400" : "text-gray-500"}`, children: "Merchant ID:" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm font-medium ${theme2 === "dark" ? "text-gray-300" : "text-gray-700"}`, children: merchantName })
@@ -20741,7 +20749,16 @@ const PaymentStatus = ({
           /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-xs font-medium mb-1 ${theme2 === "dark" ? "text-gray-400" : "text-gray-500"}`, children: "Recipient:" }),
           /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm font-mono ${theme2 === "dark" ? "text-gray-300" : "text-gray-700"}`, children: (payment == null ? void 0 : payment.recipientWallet) ? formatRecipientAddress(payment.recipientWallet) : "N/A" })
         ] })
-      ] }) })
+      ] }) }),
+      onClose && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          onClick: handleClose,
+          className: "w-full py-3 px-4 bg-[#7042D2] text-white font-medium rounded-2xl text-lg shadow-md hover:bg-[#5b34b1] transition-colors",
+          style: { borderRadius: "1.5rem" },
+          children: "Close"
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center justify-center py-6", children: [
@@ -21140,6 +21157,12 @@ const CoinleyModal = ({
     }
     return "No wallet address configured for this network";
   };
+  const handleSuccessClose = () => {
+    console.log("Success screen close button clicked");
+    if (onClose) {
+      onClose();
+    }
+  };
   const formatAmount = (amount) => {
     return parseFloat(amount).toFixed(2);
   };
@@ -21187,7 +21210,7 @@ const CoinleyModal = ({
             /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: logo, className: "w-auto h-auto", alt: "Coinley Logo" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-lg font-semibold text-gray-800", children: "Payment Details" })
           ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
+          step !== "success" && /* @__PURE__ */ jsxRuntimeExports.jsx(
             "button",
             {
               onClick: onClose,
@@ -21196,7 +21219,7 @@ const CoinleyModal = ({
             }
           )
         ] }),
-        payment && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-6", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
+        payment && step !== "success" && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-6", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-600", children: "Total amount" }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "coinley-amount-display text-5xl font-bold text-[#7042D2] mt-2", children: [
             "$",
@@ -21378,7 +21401,8 @@ const CoinleyModal = ({
             payment,
             transactionHash,
             selectedPaymentMethod,
-            merchantName
+            merchantName,
+            onClose: handleSuccessClose
           }
         ),
         step === "error" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
@@ -21400,7 +21424,7 @@ const CoinleyModal = ({
             }
           )
         ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-xs text-gray-500 flex items-center justify-center gap-1 mt-6", children: [
+        step !== "success" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-xs text-gray-500 flex items-center justify-center gap-1 mt-6", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { children: [
             "Powered by ",
             /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-purple-600", children: "Coinley" }),