coinley-test 0.0.0 → 0.0.2

package/dist/index.esm.js

@@ -0,0 +1,1057 @@
+import React, { useState, useRef, useEffect, createContext, forwardRef, useContext, useImperativeHandle } from "react";
+import { motion, AnimatePresence } from "framer-motion";
+import { ArrowLeft, X, Sparkles, Wallet, Zap, QrCode, Loader2, ChevronDown, CheckCircle2, Copy, ExternalLink, AlertCircle } from "lucide-react";
+import QRCodeLib from "qrcode";
+import { createCoinleyWalletConfig, CoinleyWalletProvider, WalletModal, useWallet, useWalletConnect, useWalletTransaction, useWalletModal, ConnectButton } from "@coinley/wallet-connect-core";
+import axios from "axios";
+var jsxRuntime = { exports: {} };
+var reactJsxRuntime_production_min = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var f = React, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
+function q(c, a, g) {
+  var b, d = {}, e = null, h = null;
+  void 0 !== g && (e = "" + g);
+  void 0 !== a.key && (e = "" + a.key);
+  void 0 !== a.ref && (h = a.ref);
+  for (b in a) m.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
+  if (c && c.defaultProps) for (b in a = c.defaultProps, a) void 0 === d[b] && (d[b] = a[b]);
+  return { $$typeof: k, type: c, key: e, ref: h, props: d, _owner: n.current };
+}
+reactJsxRuntime_production_min.Fragment = l;
+reactJsxRuntime_production_min.jsx = q;
+reactJsxRuntime_production_min.jsxs = q;
+{
+  jsxRuntime.exports = reactJsxRuntime_production_min;
+}
+var jsxRuntimeExports = jsxRuntime.exports;
+class PaymentAPI {
+  constructor(baseURL, apiKey, apiSecret) {
+    this.apiKey = apiKey;
+    this.apiSecret = apiSecret;
+    this.api = axios.create({
+      baseURL: baseURL.endsWith("/") ? baseURL.slice(0, -1) : baseURL,
+      timeout: 3e4,
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    this.api.interceptors.request.use(
+      (config) => {
+        var _a;
+        config.headers["X-API-Key"] = this.apiKey;
+        config.headers["X-API-Secret"] = this.apiSecret;
+        const token = this.generateMerchantToken();
+        if (token) {
+          config.headers["Authorization"] = `Bearer ${token}`;
+        }
+        console.log("API Request:", {
+          method: (_a = config.method) == null ? void 0 : _a.toUpperCase(),
+          url: config.url,
+          data: config.data
+        });
+        return config;
+      },
+      (error) => {
+        console.error("Request interceptor error:", error);
+        return Promise.reject(error);
+      }
+    );
+    this.api.interceptors.response.use(
+      (response) => {
+        console.log("API Response:", {
+          status: response.status,
+          url: response.config.url,
+          data: response.data
+        });
+        return response;
+      },
+      (error) => {
+        var _a, _b, _c, _d, _e;
+        console.error("API Error:", {
+          status: (_a = error.response) == null ? void 0 : _a.status,
+          data: (_b = error.response) == null ? void 0 : _b.data,
+          message: error.message
+        });
+        if (((_c = error.response) == null ? void 0 : _c.status) === 401) {
+          throw new Error("Authentication failed. Please check your API credentials.");
+        } else if (((_d = error.response) == null ? void 0 : _d.status) === 404) {
+          throw new Error("API endpoint not found. Please check your API URL.");
+        } else if (((_e = error.response) == null ? void 0 : _e.status) >= 500) {
+          throw new Error("Server error. Please try again later.");
+        }
+        throw error;
+      }
+    );
+  }
+  generateMerchantToken() {
+    try {
+      const credentials = `${this.apiKey}:${this.apiSecret}`;
+      return btoa(credentials);
+    } catch (error) {
+      console.error("Failed to generate token:", error);
+      return null;
+    }
+  }
+  async createPayment(params) {
+    var _a, _b;
+    try {
+      const response = await this.api.post("/api/payments/create", params);
+      return response.data;
+    } catch (error) {
+      if ((_b = (_a = error.response) == null ? void 0 : _a.data) == null ? void 0 : _b.error) {
+        throw new Error(error.response.data.error);
+      }
+      throw new Error(error.message || "Failed to create payment");
+    }
+  }
+  async getPayment(paymentId) {
+    var _a, _b;
+    try {
+      const response = await this.api.get(`/api/payments/${paymentId}`);
+      return response.data;
+    } catch (error) {
+      if ((_b = (_a = error.response) == null ? void 0 : _a.data) == null ? void 0 : _b.error) {
+        throw new Error(error.response.data.error);
+      }
+      throw new Error(error.message || "Failed to get payment details");
+    }
+  }
+  async getNetworks() {
+    try {
+      const response = await this.api.get("/api/networks");
+      return response.data;
+    } catch (error) {
+      console.error("Get networks failed:", error);
+      return {
+        networks: [
+          {
+            id: "ethereum",
+            name: "Ethereum",
+            shortName: "ethereum",
+            chainId: "1",
+            type: "ethereum",
+            explorerUrl: "https://etherscan.io",
+            isTestnet: false
+          },
+          {
+            id: "bsc",
+            name: "Binance Smart Chain",
+            shortName: "bsc",
+            chainId: "56",
+            type: "bsc",
+            explorerUrl: "https://bscscan.com",
+            isTestnet: false
+          },
+          {
+            id: "polygon",
+            name: "Polygon",
+            shortName: "polygon",
+            chainId: "137",
+            type: "ethereum",
+            explorerUrl: "https://polygonscan.com",
+            isTestnet: false
+          }
+        ]
+      };
+    }
+  }
+  async getStablecoins() {
+    try {
+      const response = await this.api.get("/api/networks/stablecoins");
+      return response.data;
+    } catch (error) {
+      console.error("Get stablecoins failed:", error);
+      return {
+        stablecoins: [
+          {
+            id: "usdt-eth",
+            name: "Tether USD",
+            symbol: "USDT",
+            contractAddress: "0xdAC17F958D2ee523a2206206994597C13D831ec7",
+            decimals: 6,
+            isStablecoin: true,
+            networkId: "ethereum",
+            Network: {
+              id: "ethereum",
+              name: "Ethereum",
+              shortName: "ethereum",
+              type: "ethereum"
+            }
+          },
+          {
+            id: "usdc-eth",
+            name: "USD Coin",
+            symbol: "USDC",
+            contractAddress: "0xA0b86a33E6441d81d0B93bF9EE0f74ca32F7e6f6",
+            decimals: 6,
+            isStablecoin: true,
+            networkId: "ethereum",
+            Network: {
+              id: "ethereum",
+              name: "Ethereum",
+              shortName: "ethereum",
+              type: "ethereum"
+            }
+          }
+        ]
+      };
+    }
+  }
+  async verifyQRPayment(paymentId) {
+    var _a, _b;
+    try {
+      const response = await this.api.post("/api/payments/verify-qr", {
+        paymentId
+      });
+      return response.data;
+    } catch (error) {
+      if ((_b = (_a = error.response) == null ? void 0 : _a.data) == null ? void 0 : _b.error) {
+        throw new Error(error.response.data.error);
+      }
+      throw new Error(error.message || "Failed to verify payment");
+    }
+  }
+  async processPayment(paymentId, transactionHash, network, senderAddress) {
+    var _a, _b;
+    try {
+      const response = await this.api.post("/api/payments/process", {
+        paymentId,
+        transactionHash,
+        network,
+        senderAddress
+      });
+      return response.data;
+    } catch (error) {
+      if ((_b = (_a = error.response) == null ? void 0 : _a.data) == null ? void 0 : _b.error) {
+        throw new Error(error.response.data.error);
+      }
+      throw new Error(error.message || "Failed to process payment");
+    }
+  }
+  async healthCheck() {
+    try {
+      const response = await this.api.get("/api/health");
+      return response.status === 200;
+    } catch (error) {
+      console.error("Health check failed:", error);
+      return false;
+    }
+  }
+}
+const WalletIntegration = ({
+  selectedNetwork,
+  selectedToken,
+  paymentData,
+  onTransactionSent,
+  onError,
+  isConnecting,
+  setIsConnecting
+}) => {
+  const { isConnected, address } = useWallet();
+  useWalletConnect();
+  const { sendTransaction } = useWalletTransaction();
+  useWalletModal();
+  useEffect(() => {
+    if (isConnected && paymentData && selectedNetwork && selectedToken) {
+      handleSendTransaction();
+    }
+  }, [isConnected, paymentData]);
+  const handleSendTransaction = async () => {
+    var _a;
+    if (!isConnected || !paymentData || !selectedToken) return;
+    try {
+      setIsConnecting(true);
+      const recipientAddress = (_a = paymentData.metadata) == null ? void 0 : _a.recipientWallet;
+      if (!recipientAddress) {
+        throw new Error("Recipient wallet address not found");
+      }
+      let txHash;
+      if (selectedToken.contractAddress) {
+        const amount = (paymentData.totalAmount * Math.pow(10, selectedToken.decimals)).toString();
+        const transferData = `0xa9059cbb${recipientAddress.slice(2).padStart(64, "0")}${parseInt(amount).toString(16).padStart(64, "0")}`;
+        txHash = await sendTransaction({
+          to: selectedToken.contractAddress,
+          data: transferData,
+          value: "0x0"
+        });
+      } else {
+        const value = (paymentData.totalAmount * Math.pow(10, 18)).toString(16);
+        txHash = await sendTransaction({
+          to: recipientAddress,
+          value: `0x${value}`
+        });
+      }
+      if (txHash) {
+        onTransactionSent(txHash);
+      }
+    } catch (error) {
+      console.error("Transaction failed:", error);
+      onError(error.message || "Transaction failed");
+    } finally {
+      setIsConnecting(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center space-y-6", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-16 h-16 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Wallet, { className: "w-8 h-8 text-[#7042D2]" }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold", children: isConnected ? "Send Payment" : "Connect Your Wallet" }),
+    !isConnected ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-600 dark:text-gray-400", children: "Connect your wallet to complete the payment" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        ConnectButton,
+        {
+          theme: "gradient",
+          size: "large",
+          customText: "Connect Wallet"
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-green-600 dark:text-green-400", children: [
+        "✅ Wallet Connected: ",
+        address == null ? void 0 : address.slice(0, 6),
+        "...",
+        address == null ? void 0 : address.slice(-4)
+      ] }),
+      paymentData && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-gray-50 dark:bg-gray-800 rounded-lg p-4 space-y-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Amount:" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-medium", children: [
+            paymentData.totalAmount,
+            " ",
+            selectedToken == null ? void 0 : selectedToken.symbol
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Network:" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: selectedNetwork == null ? void 0 : selectedNetwork.name })
+        ] })
+      ] }),
+      isConnecting && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center space-x-2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Loader2, { className: "w-5 h-5 animate-spin text-[#7042D2]" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Processing transaction..." })
+      ] })
+    ] })
+  ] }) });
+};
+const CoinleyPayment = ({
+  apiKey,
+  apiSecret,
+  apiUrl = "http://localhost:9000",
+  onSuccess,
+  onError,
+  onClose,
+  isOpen,
+  config,
+  theme = "light",
+  merchantName,
+  debug = false
+}) => {
+  const [currentStep, setCurrentStep] = useState("select-method");
+  const [networks, setNetworks] = useState([]);
+  const [tokens, setTokens] = useState([]);
+  const [selectedNetwork, setSelectedNetwork] = useState(null);
+  const [selectedToken, setSelectedToken] = useState(null);
+  const [paymentMethod, setPaymentMethod] = useState(null);
+  const [qrCode, setQrCode] = useState("");
+  const [paymentData, setPaymentData] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState("");
+  const [copied, setCopied] = useState(false);
+  const [txHash, setTxHash] = useState("");
+  const [isConnecting, setIsConnecting] = useState(false);
+  const paymentAPI = useRef(new PaymentAPI(apiUrl, apiKey, apiSecret));
+  const walletConfig = createCoinleyWalletConfig({
+    appName: merchantName || "Coinley Payment",
+    appDescription: "Crypto payment processing",
+    chains: ["ethereum", "polygon", "bsc", "arbitrum"]
+  });
+  useEffect(() => {
+    if (isOpen) {
+      initializePayment();
+    }
+  }, [isOpen]);
+  const initializePayment = async () => {
+    try {
+      setLoading(true);
+      setError("");
+      const [networksRes, tokensRes] = await Promise.all([
+        paymentAPI.current.getNetworks(),
+        paymentAPI.current.getStablecoins()
+      ]);
+      setNetworks(networksRes.networks || []);
+      setTokens(tokensRes.stablecoins || []);
+      if (debug) {
+        console.log("Initialized networks:", networksRes.networks);
+        console.log("Initialized tokens:", tokensRes.stablecoins);
+      }
+    } catch (err) {
+      console.error("Failed to initialize payment:", err);
+      setError("Failed to load payment options. Please try again.");
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleMethodSelect = (method) => {
+    setPaymentMethod(method);
+    setCurrentStep("select-network");
+  };
+  const handleNetworkSelect = async (network) => {
+    setSelectedNetwork(network);
+    const networkTokens = tokens.filter(
+      (token) => {
+        var _a;
+        return ((_a = token.Network) == null ? void 0 : _a.shortName) === network.shortName || token.networkId === network.id;
+      }
+    );
+    if (networkTokens.length > 0) {
+      const preferredToken = networkTokens.find((t) => t.symbol === "USDT") || networkTokens[0];
+      setSelectedToken(preferredToken);
+      await initiatePayment(network, preferredToken);
+    }
+  };
+  const initiatePayment = async (network, token) => {
+    try {
+      setLoading(true);
+      const paymentPayload = {
+        amount: config.amount,
+        currency: token.symbol,
+        network: network.shortName,
+        customerEmail: config.customerEmail,
+        callbackUrl: config.callbackUrl,
+        metadata: {
+          ...config.metadata,
+          paymentMethod,
+          selectedNetwork: network.shortName,
+          selectedToken: token.symbol
+        }
+      };
+      const payment = await paymentAPI.current.createPayment(paymentPayload);
+      setPaymentData(payment.payment);
+      if (paymentMethod === "wallet") {
+        setCurrentStep("wallet-connect");
+      } else {
+        await generateQRCode(payment.payment);
+        setCurrentStep("qr-code");
+      }
+    } catch (err) {
+      console.error("Payment initiation failed:", err);
+      setError(err.message || "Failed to create payment");
+      setCurrentStep("error");
+    } finally {
+      setLoading(false);
+    }
+  };
+  const generateQRCode = async (payment) => {
+    var _a, _b;
+    try {
+      const recipientAddress = ((_a = payment.metadata) == null ? void 0 : _a.recipientWallet) || ((_b = config.merchantWalletAddresses) == null ? void 0 : _b[(selectedNetwork == null ? void 0 : selectedNetwork.shortName) || ""]);
+      if (!recipientAddress) {
+        throw new Error("Recipient wallet address not found");
+      }
+      let qrData = "";
+      if ((selectedNetwork == null ? void 0 : selectedNetwork.type) === "ethereum" || (selectedNetwork == null ? void 0 : selectedNetwork.type) === "bsc") {
+        qrData = (selectedToken == null ? void 0 : selectedToken.contractAddress) ? `ethereum:${selectedToken.contractAddress}/transfer?address=${recipientAddress}&uint256=${payment.totalAmount * Math.pow(10, selectedToken.decimals)}` : `ethereum:${recipientAddress}?value=${payment.totalAmount}e18`;
+      } else if ((selectedNetwork == null ? void 0 : selectedNetwork.type) === "tron") {
+        qrData = `tron:${recipientAddress}?amount=${payment.totalAmount}`;
+      } else {
+        qrData = `${selectedToken == null ? void 0 : selectedToken.symbol}:${recipientAddress}?amount=${payment.totalAmount}`;
+      }
+      const qrCodeDataURL = await QRCodeLib.toDataURL(qrData, {
+        width: 256,
+        margin: 2,
+        color: {
+          dark: theme === "dark" ? "#FFFFFF" : "#000000",
+          light: theme === "dark" ? "#000000" : "#FFFFFF"
+        }
+      });
+      setQrCode(qrCodeDataURL);
+      startPaymentVerification(payment.id);
+    } catch (err) {
+      console.error("QR code generation failed:", err);
+      setError("Failed to generate QR code");
+      setCurrentStep("error");
+    }
+  };
+  const startPaymentVerification = async (paymentId) => {
+    const maxAttempts = 60;
+    let attempts = 0;
+    const checkPayment = async () => {
+      var _a;
+      try {
+        const result = await paymentAPI.current.verifyQRPayment(paymentId);
+        if (result.verified && ((_a = result.payment) == null ? void 0 : _a.transactionHash)) {
+          setTxHash(result.payment.transactionHash);
+          await handlePaymentSuccess(paymentId, result.payment.transactionHash);
+          return true;
+        }
+        attempts++;
+        if (attempts < maxAttempts) {
+          setTimeout(checkPayment, 5e3);
+        } else {
+          setError("Payment verification timeout. Please check your transaction.");
+          setCurrentStep("error");
+        }
+        return false;
+      } catch (err) {
+        console.error("Payment verification error:", err);
+        attempts++;
+        if (attempts < maxAttempts) {
+          setTimeout(checkPayment, 5e3);
+        } else {
+          setError("Payment verification failed");
+          setCurrentStep("error");
+        }
+        return false;
+      }
+    };
+    setTimeout(checkPayment, 2e3);
+  };
+  const handleTransactionSent = async (transactionHash) => {
+    setTxHash(transactionHash);
+    setCurrentStep("processing");
+    try {
+      await paymentAPI.current.processPayment(
+        paymentData.id,
+        transactionHash,
+        (selectedNetwork == null ? void 0 : selectedNetwork.shortName) || "",
+        ""
+      );
+      await handlePaymentSuccess(paymentData.id, transactionHash);
+    } catch (error2) {
+      console.error("Payment processing failed:", error2);
+      await handlePaymentSuccess(paymentData.id, transactionHash);
+    }
+  };
+  const handlePaymentSuccess = async (paymentId, transactionHash) => {
+    setCurrentStep("success");
+    if (onSuccess) {
+      onSuccess(paymentId, transactionHash, {
+        network: selectedNetwork == null ? void 0 : selectedNetwork.name,
+        token: selectedToken == null ? void 0 : selectedToken.symbol,
+        amount: paymentData == null ? void 0 : paymentData.totalAmount,
+        method: paymentMethod
+      });
+    }
+  };
+  const copyToClipboard = async (text) => {
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy:", err);
+    }
+  };
+  const handleClose = () => {
+    setCurrentStep("select-method");
+    setPaymentMethod(null);
+    setSelectedNetwork(null);
+    setSelectedToken(null);
+    setQrCode("");
+    setPaymentData(null);
+    setError("");
+    setTxHash("");
+    if (onClose) {
+      onClose();
+    }
+  };
+  const goBack = () => {
+    if (currentStep === "select-network") {
+      setCurrentStep("select-method");
+    } else if (currentStep === "wallet-connect" || currentStep === "qr-code") {
+      setCurrentStep("select-network");
+    }
+  };
+  if (!isOpen) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(CoinleyWalletProvider, { config: walletConfig, walletConfig: { appName: merchantName || "Coinley Payment" }, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      motion.div,
+      {
+        initial: { scale: 0.9, opacity: 0 },
+        animate: { scale: 1, opacity: 1 },
+        exit: { scale: 0.9, opacity: 0 },
+        className: `relative w-full max-w-md mx-4 rounded-2xl shadow-2xl overflow-hidden ${theme === "dark" ? "bg-gray-900 text-white" : "bg-white text-gray-900"}`,
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative p-6 border-b border-gray-200 dark:border-gray-700", children: [
+            currentStep !== "select-method" && currentStep !== "success" && currentStep !== "error" && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: goBack,
+                className: "absolute left-4 top-6 p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowLeft, { className: "w-5 h-5" })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: handleClose,
+                className: "absolute right-4 top-6 p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(X, { className: "w-5 h-5" })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center space-x-2 mb-2", children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Sparkles, { className: "w-5 h-5 text-[#7042D2]" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-xl font-bold", children: "Pay with Crypto" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Sparkles, { className: "w-5 h-5 text-[#7042D2]" })
+              ] }),
+              merchantName && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-600 dark:text-gray-400 mt-1", children: merchantName }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-2xl font-bold text-[#7042D2]", children: [
+                "$",
+                config.amount.toFixed(2)
+              ] }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-6 min-h-[400px]", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(AnimatePresence, { mode: "wait", children: [
+            currentStep === "select-method" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { x: 20, opacity: 0 },
+                animate: { x: 0, opacity: 1 },
+                exit: { x: -20, opacity: 0 },
+                className: "space-y-4",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-center mb-6", children: "Choose Payment Method" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    motion.button,
+                    {
+                      whileHover: { scale: 1.02 },
+                      whileTap: { scale: 0.98 },
+                      onClick: () => handleMethodSelect("wallet"),
+                      className: "w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-3 bg-[#7042D2] bg-opacity-10 rounded-lg group-hover:bg-opacity-20 transition-colors", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Wallet, { className: "w-6 h-6 text-[#7042D2]" }) }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-left", children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-semibold", children: "Connect Wallet" }),
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-600 dark:text-gray-400", children: "MetaMask, WalletConnect & more" })
+                        ] }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(Zap, { className: "w-5 h-5 text-[#7042D2] ml-auto" })
+                      ] })
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    motion.button,
+                    {
+                      whileHover: { scale: 1.02 },
+                      whileTap: { scale: 0.98 },
+                      onClick: () => handleMethodSelect("qr"),
+                      className: "w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-3 bg-[#7042D2] bg-opacity-10 rounded-lg group-hover:bg-opacity-20 transition-colors", children: /* @__PURE__ */ jsxRuntimeExports.jsx(QrCode, { className: "w-6 h-6 text-[#7042D2]" }) }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-left", children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-semibold", children: "QR Code" }),
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Scan with mobile wallet" })
+                        ] })
+                      ] })
+                    }
+                  )
+                ]
+              },
+              "select-method"
+            ),
+            currentStep === "select-network" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { x: 20, opacity: 0 },
+                animate: { x: 0, opacity: 1 },
+                exit: { x: -20, opacity: 0 },
+                className: "space-y-4",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-center mb-6", children: "Select Network" }),
+                  loading ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex justify-center py-8", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader2, { className: "w-8 h-8 animate-spin text-[#7042D2]" }) }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-3", children: networks.map((network) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    motion.button,
+                    {
+                      whileHover: { scale: 1.02 },
+                      whileTap: { scale: 0.98 },
+                      onClick: () => handleNetworkSelect(network),
+                      className: "w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-4", children: [
+                        network.logo ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+                          "img",
+                          {
+                            src: network.logo,
+                            alt: network.name,
+                            className: "w-8 h-8 rounded-full"
+                          }
+                        ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-8 h-8 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm font-bold text-[#7042D2]", children: network.shortName.charAt(0).toUpperCase() }) }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-left flex-1", children: [
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-semibold", children: network.name }),
+                          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-600 dark:text-gray-400", children: network.shortName.toUpperCase() })
+                        ] }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "w-5 h-5 text-gray-400 transform -rotate-90" })
+                      ] })
+                    },
+                    network.id
+                  )) })
+                ]
+              },
+              "select-network"
+            ),
+            currentStep === "wallet-connect" && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              motion.div,
+              {
+                initial: { x: 20, opacity: 0 },
+                animate: { x: 0, opacity: 1 },
+                exit: { x: -20, opacity: 0 },
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  WalletIntegration,
+                  {
+                    selectedNetwork,
+                    selectedToken,
+                    paymentData,
+                    onTransactionSent: handleTransactionSent,
+                    onError: setError,
+                    isConnecting,
+                    setIsConnecting
+                  }
+                )
+              },
+              "wallet-connect"
+            ),
+            currentStep === "qr-code" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { x: 20, opacity: 0 },
+                animate: { x: 0, opacity: 1 },
+                exit: { x: -20, opacity: 0 },
+                className: "text-center space-y-6",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold", children: "Scan QR Code" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-600 dark:text-gray-400", children: "Use your mobile wallet to scan and pay" })
+                  ] }),
+                  qrCode && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-white p-4 rounded-xl mx-auto inline-block", children: /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: qrCode, alt: "Payment QR Code", className: "w-48 h-48" }) }),
+                  paymentData && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-gray-50 dark:bg-gray-800 rounded-lg p-4 space-y-2", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Network:" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: selectedNetwork == null ? void 0 : selectedNetwork.name })
+                      ] }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center", children: [
+                        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Amount:" }),
+                        /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-medium", children: [
+                          paymentData.totalAmount,
+                          " ",
+                          selectedToken == null ? void 0 : selectedToken.symbol
+                        ] })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center space-x-2 text-sm text-gray-600 dark:text-gray-400", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsx(Loader2, { className: "w-4 h-4 animate-spin" }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Waiting for payment..." })
+                    ] })
+                  ] })
+                ]
+              },
+              "qr-code"
+            ),
+            currentStep === "processing" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { scale: 0.8, opacity: 0 },
+                animate: { scale: 1, opacity: 1 },
+                className: "text-center space-y-6",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-16 h-16 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader2, { className: "w-8 h-8 animate-spin text-[#7042D2]" }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-[#7042D2]", children: "Processing Payment..." }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-600 dark:text-gray-400 mt-2", children: "Your transaction is being processed" })
+                  ] })
+                ]
+              },
+              "processing"
+            ),
+            currentStep === "success" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { scale: 0.8, opacity: 0 },
+                animate: { scale: 1, opacity: 1 },
+                className: "text-center space-y-6",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx(CheckCircle2, { className: "w-8 h-8 text-green-500" }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-green-600", children: "Payment Successful!" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-600 dark:text-gray-400 mt-2", children: "Your payment has been processed successfully" })
+                  ] }),
+                  txHash && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-gray-50 dark:bg-gray-800 rounded-lg p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between items-center", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-600 dark:text-gray-400", children: "Transaction:" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-mono text-sm", children: [
+                        txHash.slice(0, 6),
+                        "...",
+                        txHash.slice(-4)
+                      ] }),
+                      /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "button",
+                        {
+                          onClick: () => copyToClipboard(txHash),
+                          className: "p-1 hover:bg-gray-200 dark:hover:bg-gray-700 rounded",
+                          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Copy, { className: "w-4 h-4" })
+                        }
+                      ),
+                      (selectedNetwork == null ? void 0 : selectedNetwork.explorerUrl) && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                        "a",
+                        {
+                          href: `${selectedNetwork.explorerUrl}/tx/${txHash}`,
+                          target: "_blank",
+                          rel: "noopener noreferrer",
+                          className: "p-1 hover:bg-gray-200 dark:hover:bg-gray-700 rounded",
+                          children: /* @__PURE__ */ jsxRuntimeExports.jsx(ExternalLink, { className: "w-4 h-4" })
+                        }
+                      )
+                    ] })
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    "button",
+                    {
+                      onClick: handleClose,
+                      className: "w-full bg-[#7042D2] text-white py-3 rounded-lg font-semibold hover:bg-[#7042D2]/90 transition-colors",
+                      children: "Close"
+                    }
+                  )
+                ]
+              },
+              "success"
+            ),
+            currentStep === "error" && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              motion.div,
+              {
+                initial: { scale: 0.8, opacity: 0 },
+                animate: { scale: 1, opacity: 1 },
+                className: "text-center space-y-6",
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx(AlertCircle, { className: "w-8 h-8 text-red-500" }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-red-600", children: "Payment Failed" }),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-600 dark:text-gray-400 mt-2", children: error || "Something went wrong. Please try again." })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      "button",
+                      {
+                        onClick: () => {
+                          setCurrentStep("select-method");
+                          setError("");
+                        },
+                        className: "w-full bg-[#7042D2] text-white py-3 rounded-lg font-semibold hover:bg-[#7042D2]/90 transition-colors",
+                        children: "Try Again"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      "button",
+                      {
+                        onClick: handleClose,
+                        className: "w-full border border-gray-300 dark:border-gray-600 py-3 rounded-lg font-semibold hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors",
+                        children: "Close"
+                      }
+                    )
+                  ] })
+                ]
+              },
+              "error"
+            )
+          ] }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-6 py-4 border-t border-gray-200 dark:border-gray-700 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xs text-gray-500", children: [
+            "Powered by ",
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-semibold text-[#7042D2]", children: "Coinley" })
+          ] }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(WalletModal, {})
+  ] });
+};
+const CoinleyContext = createContext(null);
+const CoinleyProvider = ({
+  apiKey,
+  apiSecret,
+  apiUrl,
+  theme = "light",
+  debug = false,
+  children
+}) => {
+  const [isOpen, setIsOpen] = React.useState(false);
+  const [paymentConfig, setPaymentConfig] = React.useState(null);
+  const [callbacks, setCallbacks] = React.useState({});
+  const [merchantName, setMerchantName] = React.useState("");
+  const openPayment = (config, checkoutCallbacks) => {
+    setPaymentConfig(config);
+    if (checkoutCallbacks) {
+      setCallbacks(checkoutCallbacks);
+    }
+    setIsOpen(true);
+  };
+  const closePayment = () => {
+    setIsOpen(false);
+    setPaymentConfig(null);
+    if (callbacks.onClose) {
+      callbacks.onClose();
+    }
+  };
+  const contextValue = {
+    openPayment,
+    closePayment
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(CoinleyContext.Provider, { value: contextValue, children: [
+    children,
+    isOpen && paymentConfig && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      CoinleyPayment,
+      {
+        apiKey,
+        apiSecret,
+        apiUrl,
+        isOpen,
+        config: paymentConfig,
+        theme,
+        debug,
+        merchantName,
+        onSuccess: callbacks.onSuccess,
+        onError: callbacks.onError,
+        onClose: closePayment
+      }
+    )
+  ] });
+};
+const CoinleyCheckout = forwardRef(({
+  customerEmail = "",
+  merchantName = "",
+  onSuccess,
+  onError,
+  onClose,
+  theme = "light",
+  autoOpen = false,
+  testMode = false,
+  debug = false,
+  merchantWalletAddresses = {}
+}, ref) => {
+  const context = useContext(CoinleyContext);
+  if (!context) {
+    throw new Error("CoinleyCheckout must be used within a CoinleyProvider");
+  }
+  const { openPayment, closePayment } = context;
+  const open = (config) => {
+    try {
+      if (debug) {
+        console.log("Opening Coinley checkout with config:", config);
+      }
+      if (!config.amount || config.amount <= 0) {
+        throw new Error("Amount must be greater than 0");
+      }
+      const finalConfig = {
+        ...config,
+        customerEmail: config.customerEmail || customerEmail,
+        merchantWalletAddresses: {
+          ...merchantWalletAddresses,
+          ...config.merchantWalletAddresses
+        },
+        metadata: {
+          ...config.metadata,
+          testMode,
+          checkoutVersion: "1.0.0"
+        }
+      };
+      const checkoutCallbacks = {
+        onSuccess,
+        onError,
+        onClose
+      };
+      openPayment(finalConfig, checkoutCallbacks);
+    } catch (error) {
+      console.error("Failed to open Coinley checkout:", error);
+      if (onError) {
+        onError(error);
+      }
+    }
+  };
+  const close = () => {
+    closePayment();
+  };
+  useImperativeHandle(ref, () => ({
+    open,
+    close
+  }));
+  return null;
+});
+CoinleyCheckout.displayName = "CoinleyCheckout";
+const useCoinley = () => {
+  const context = useContext(CoinleyContext);
+  if (!context) {
+    throw new Error("useCoinley must be used within a CoinleyProvider");
+  }
+  return context;
+};
+const ThemeProvider = ({
+  initialTheme = "light",
+  children
+}) => {
+  const [theme, setTheme] = React.useState(initialTheme);
+  React.useEffect(() => {
+    document.documentElement.setAttribute("data-coinley-theme", theme);
+  }, [theme]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `coinley-theme-${theme}`, children });
+};
+const VERSION = "0.0.0";
+const utils = {
+  formatAmount: (amount, decimals = 2) => amount.toFixed(decimals),
+  truncateAddress: (address, startChars = 6, endChars = 4) => {
+    if (!address) return "";
+    if (address.length <= startChars + endChars) return address;
+    return `${address.slice(0, startChars)}...${address.slice(-endChars)}`;
+  },
+  isValidAddress: (address, network) => {
+    if (!address) return false;
+    switch (network.toLowerCase()) {
+      case "ethereum":
+      case "bsc":
+      case "polygon":
+        return /^0x[a-fA-F0-9]{40}$/.test(address);
+      case "tron":
+        return /^T[a-zA-Z0-9]{33}$/.test(address);
+      case "solana":
+        return /^[1-9A-HJ-NP-Za-km-z]{32,44}$/.test(address);
+      default:
+        return address.length > 0;
+    }
+  },
+  copyToClipboard: async (text) => {
+    try {
+      await navigator.clipboard.writeText(text);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+};
+class CoinleyError extends Error {
+  constructor(message, code) {
+    super(message);
+    this.name = "CoinleyError";
+    this.code = code;
+  }
+}
+const DEFAULT_CONFIG = {
+  theme: "light",
+  debug: false,
+  testMode: false,
+  autoOpen: false
+};
+export {
+  CoinleyCheckout,
+  CoinleyError,
+  CoinleyPayment,
+  CoinleyProvider,
+  DEFAULT_CONFIG,
+  PaymentAPI,
+  ThemeProvider,
+  VERSION,
+  useCoinley,
+  utils
+};
+//# sourceMappingURL=index.esm.js.map