coinley-test 0.0.20 → 0.0.22

package/dist/index.esm.js

@@ -1237,7 +1237,607 @@ const ThemeProvider = ({
   }, [theme]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `coinley-theme-${theme}`, children });
 };
-const VERSION = "0.0.0";
+class SimplePaymentAPI {
+  constructor(baseURL, apiKey, apiSecret) {
+    this.baseURL = baseURL.endsWith("/") ? baseURL.slice(0, -1) : baseURL;
+    this.apiKey = apiKey;
+    this.apiSecret = apiSecret;
+  }
+  async request(endpoint, options = {}) {
+    const url = `${this.baseURL}${endpoint}`;
+    const headers = {
+      "Content-Type": "application/json",
+      "X-API-Key": this.apiKey,
+      "X-API-Secret": this.apiSecret,
+      ...options.headers
+    };
+    const response = await fetch(url, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error || `HTTP ${response.status}`);
+    }
+    return response.json();
+  }
+  async getNetworks() {
+    try {
+      return await this.request("/api/networks");
+    } catch (error) {
+      console.error("Failed to fetch networks:", error);
+      return {
+        networks: [
+          { id: "1", name: "Ethereum", shortName: "ethereum", chainId: "0x1", type: "ethereum" },
+          { id: "56", name: "BSC", shortName: "bsc", chainId: "0x38", type: "bsc" }
+        ]
+      };
+    }
+  }
+  async getTokens() {
+    try {
+      return await this.request("/api/networks/stablecoins");
+    } catch (error) {
+      console.error("Failed to fetch tokens:", error);
+      return {
+        stablecoins: [
+          {
+            id: "1",
+            name: "Tether USD",
+            symbol: "USDT",
+            contractAddress: "0xdAC17F958D2ee523a2206206994597C13D831ec7",
+            decimals: 6,
+            networkId: "1",
+            Network: { shortName: "ethereum", name: "Ethereum" }
+          }
+        ]
+      };
+    }
+  }
+  async createPayment(data) {
+    return await this.request("/api/payments/create", {
+      method: "POST",
+      body: JSON.stringify(data)
+    });
+  }
+}
+class SimpleMetaMaskWallet {
+  constructor() {
+    this.account = null;
+    this.chainId = null;
+  }
+  async connect() {
+    if (!window.ethereum) {
+      throw new Error("MetaMask not installed. Please install MetaMask extension.");
+    }
+    if (window.ethereum.providers) {
+      console.log("🔍 Multiple wallets detected:", window.ethereum.providers.length);
+      const metamaskProvider = window.ethereum.providers.find((provider) => provider.isMetaMask);
+      if (!metamaskProvider) {
+        throw new Error("MetaMask not found among installed wallets");
+      }
+      console.log("🦊 Using MetaMask provider specifically");
+      window.ethereum = metamaskProvider;
+    } else if (!window.ethereum.isMetaMask) {
+      throw new Error("Please use MetaMask wallet");
+    }
+    try {
+      console.log("🦊 Requesting MetaMask account access...");
+      const accounts = await window.ethereum.request({
+        method: "eth_requestAccounts"
+      });
+      if (!accounts || accounts.length === 0) {
+        throw new Error("No accounts found in MetaMask");
+      }
+      const chainId = await window.ethereum.request({
+        method: "eth_chainId"
+      });
+      this.account = accounts[0];
+      this.chainId = chainId;
+      console.log("✅ MetaMask connected successfully:");
+      console.log("  Account:", this.account);
+      console.log("  Chain ID:", this.chainId);
+      if (this.account.toLowerCase() !== "0xa0419a048a1469b34a5245f08c0697ba956a56ab") {
+        console.warn("⚠️ Connected to different account than expected");
+        console.warn("  Expected: 0xa0419a048A1469B34a5245f08C0697Ba956a56Ab");
+        console.warn("  Connected:", this.account);
+        throw new Error(`Please switch MetaMask to account 0xa041...56Ab. Currently connected to ${this.account.slice(0, 6)}...${this.account.slice(-4)}`);
+      }
+      return { account: this.account, chainId: this.chainId };
+    } catch (error) {
+      console.error("MetaMask connection failed:", error);
+      throw new Error(error.message || "Failed to connect to MetaMask");
+    }
+  }
+  async sendTransaction(txParams) {
+    if (!this.account) {
+      throw new Error("Wallet not connected");
+    }
+    try {
+      console.log("🦊 Sending MetaMask transaction:", txParams);
+      if (!window.ethereum.isMetaMask) {
+        throw new Error("Not using MetaMask provider");
+      }
+      if (txParams.data && txParams.data.includes("a9059cbb")) {
+        console.log("🔍 Checking USDT balance...");
+        try {
+          const balanceHex = await window.ethereum.request({
+            method: "eth_call",
+            params: [{
+              to: txParams.to,
+              // USDT contract
+              data: `0x70a08231000000000000000000000000${this.account.slice(2)}`
+              // balanceOf(address)
+            }, "latest"]
+          });
+          const balance = parseInt(balanceHex, 16);
+          const balanceUSDT = balance / 1e6;
+          console.log("💰 USDT Balance:", balanceUSDT);
+          const amountHex = txParams.data.slice(-64);
+          const transactionAmount = parseInt(amountHex, 16);
+          const transactionAmountUSDT = transactionAmount / 1e6;
+          console.log("💸 Transaction Amount:", transactionAmountUSDT);
+          if (balance < transactionAmount) {
+            throw new Error(`Insufficient USDT balance. You have ${balanceUSDT} USDT but need ${transactionAmountUSDT} USDT`);
+          }
+        } catch (balanceError) {
+          console.warn("Could not check balance:", balanceError);
+        }
+      }
+      try {
+        const ethBalanceHex = await window.ethereum.request({
+          method: "eth_getBalance",
+          params: [this.account, "latest"]
+        });
+        const ethBalance = parseInt(ethBalanceHex, 16) / Math.pow(10, 18);
+        console.log("⛽ ETH Balance for gas:", ethBalance);
+        if (ethBalance < 1e-3) {
+          throw new Error(`Insufficient ETH for gas fees. You have ${ethBalance.toFixed(4)} ETH but need at least 0.001 ETH`);
+        }
+      } catch (gasError) {
+        console.warn("Could not check ETH balance:", gasError);
+      }
+      const fullTxParams = {
+        ...txParams,
+        from: this.account
+      };
+      try {
+        const gasEstimate = await window.ethereum.request({
+          method: "eth_estimateGas",
+          params: [fullTxParams]
+        });
+        const gasLimit = Math.floor(parseInt(gasEstimate, 16) * 1.2);
+        fullTxParams.gas = `0x${gasLimit.toString(16)}`;
+        console.log("⛽ Gas estimate:", parseInt(gasEstimate, 16));
+        console.log("⛽ Gas limit (with buffer):", gasLimit);
+      } catch (gasError) {
+        console.warn("Gas estimation failed:", gasError);
+        fullTxParams.gas = "0x15F90";
+      }
+      console.log("📤 Final transaction params:", fullTxParams);
+      const txHash = await window.ethereum.request({
+        method: "eth_sendTransaction",
+        params: [fullTxParams]
+      });
+      console.log("✅ Transaction sent successfully:", txHash);
+      return txHash;
+    } catch (error) {
+      console.error("Transaction failed:", error);
+      if (error.code === 4001) {
+        throw new Error("Transaction cancelled by user");
+      } else if (error.message.includes("insufficient funds")) {
+        throw new Error("Insufficient funds in wallet");
+      } else if (error.message.includes("gas")) {
+        throw new Error("Gas estimation failed. You may not have enough ETH for gas fees.");
+      } else if (error.message.includes("invalid opcode")) {
+        throw new Error("Transaction failed - invalid operation. This usually means insufficient token balance or contract interaction failed.");
+      } else {
+        throw new Error(error.message || "Transaction failed");
+      }
+    }
+  }
+  isConnected() {
+    return !!this.account;
+  }
+}
+const SimpleCoinleyPayment = ({
+  apiKey,
+  apiSecret,
+  apiUrl,
+  config,
+  onSuccess,
+  onError,
+  onClose,
+  isOpen,
+  theme = "light"
+}) => {
+  var _a, _b;
+  const [currentStep, setCurrentStep] = useState("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 [paymentData, setPaymentData] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState("");
+  const [wallet, setWallet] = useState(new SimpleMetaMaskWallet());
+  const [walletConnected, setWalletConnected] = useState(false);
+  const [processing, setProcessing] = useState(false);
+  const api = useRef(new SimplePaymentAPI(apiUrl, apiKey, apiSecret));
+  useEffect(() => {
+    if (isOpen) {
+      loadData();
+      resetState();
+    }
+  }, [isOpen]);
+  const resetState = () => {
+    setCurrentStep("method");
+    setSelectedNetwork(null);
+    setSelectedToken(null);
+    setPaymentMethod(null);
+    setPaymentData(null);
+    setError("");
+    setWalletConnected(false);
+    setProcessing(false);
+    setWallet(new SimpleMetaMaskWallet());
+  };
+  const loadData = async () => {
+    var _a2, _b2;
+    try {
+      setLoading(true);
+      setError("");
+      console.log("🔄 Loading networks and tokens...");
+      const [networksRes, tokensRes] = await Promise.all([
+        api.current.getNetworks(),
+        api.current.getTokens()
+      ]);
+      setNetworks(networksRes.networks || []);
+      setTokens(tokensRes.stablecoins || []);
+      console.log("✅ Loaded networks:", (_a2 = networksRes.networks) == null ? void 0 : _a2.length);
+      console.log("✅ Loaded tokens:", (_b2 = tokensRes.stablecoins) == null ? void 0 : _b2.length);
+    } catch (err) {
+      console.error("Failed to load data:", err);
+      setError("Failed to load payment options. Using fallback data.");
+    } finally {
+      setLoading(false);
+    }
+  };
+  const connectWallet = async () => {
+    try {
+      setLoading(true);
+      setError("");
+      const connection = await wallet.connect();
+      setWalletConnected(true);
+      console.log("✅ Wallet connected successfully:", connection.account);
+    } catch (err) {
+      console.error("Wallet connection failed:", err);
+      setError(err.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const createPayment = async () => {
+    try {
+      setLoading(true);
+      setError("");
+      const paymentPayload = {
+        amount: config.amount,
+        currency: selectedToken.symbol,
+        network: selectedNetwork.shortName,
+        customerEmail: config.customerEmail,
+        callbackUrl: config.callbackUrl,
+        metadata: {
+          ...config.metadata,
+          merchantWalletAddresses: config.merchantWalletAddresses,
+          paymentMethod,
+          selectedNetwork: selectedNetwork.shortName,
+          selectedToken: selectedToken.symbol
+        }
+      };
+      console.log("🔄 Creating payment:", paymentPayload);
+      const payment = await api.current.createPayment(paymentPayload);
+      setPaymentData(payment.payment);
+      console.log("✅ Payment created:", payment.payment.id);
+      if (paymentMethod === "wallet") {
+        setCurrentStep("wallet");
+      } else {
+        setCurrentStep("qr");
+      }
+    } catch (err) {
+      console.error("Payment creation failed:", err);
+      setError(err.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const sendTransaction = async () => {
+    var _a2, _b2;
+    try {
+      setProcessing(true);
+      setError("");
+      const recipientAddress = ((_a2 = paymentData.metadata) == null ? void 0 : _a2.recipientWallet) || ((_b2 = config.merchantWalletAddresses) == null ? void 0 : _b2[selectedNetwork.shortName]);
+      if (!recipientAddress) {
+        throw new Error("Merchant wallet address not found");
+      }
+      console.log("🔄 Preparing transaction to:", recipientAddress);
+      let txParams;
+      if (selectedToken.contractAddress) {
+        const decimals = selectedToken.decimals || 6;
+        const amount = Math.floor(paymentData.totalAmount * Math.pow(10, decimals));
+        const methodId = "0xa9059cbb";
+        const recipientPadded = recipientAddress.slice(2).toLowerCase().padStart(64, "0");
+        const amountPadded = amount.toString(16).padStart(64, "0");
+        const data = `${methodId}${recipientPadded}${amountPadded}`;
+        txParams = {
+          to: selectedToken.contractAddress,
+          data,
+          value: "0x0"
+        };
+        console.log("🔄 ERC-20 Transaction:", {
+          token: selectedToken.symbol,
+          amount: paymentData.totalAmount,
+          amountWithDecimals: amount,
+          to: selectedToken.contractAddress,
+          recipient: recipientAddress
+        });
+      } else {
+        const value = Math.floor(paymentData.totalAmount * Math.pow(10, 18));
+        txParams = {
+          to: recipientAddress,
+          value: `0x${value.toString(16)}`
+        };
+        console.log("🔄 Native Transaction:", {
+          amount: paymentData.totalAmount,
+          to: recipientAddress
+        });
+      }
+      const txHash = await wallet.sendTransaction(txParams);
+      console.log("✅ Transaction successful:", txHash);
+      setCurrentStep("success");
+      onSuccess == null ? void 0 : onSuccess(paymentData.id, txHash, {
+        network: selectedNetwork.name,
+        token: selectedToken.symbol,
+        amount: paymentData.totalAmount,
+        method: paymentMethod
+      });
+    } catch (err) {
+      console.error("Transaction failed:", err);
+      setError(err.message);
+    } finally {
+      setProcessing(false);
+    }
+  };
+  if (!isOpen) return null;
+  const isDark = theme === "dark";
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `rounded-lg shadow-xl max-w-md w-full mx-4 ${isDark ? "bg-gray-900 text-white" : "bg-white text-gray-900"}`, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `p-4 border-b flex justify-between items-center ${isDark ? "border-gray-700" : "border-gray-200"}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center flex-1", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-lg font-semibold", children: "Pay with Crypto" }),
+        config.amount && /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-2xl font-bold text-purple-600", children: [
+          "$",
+          config.amount.toFixed(2)
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          onClick: onClose,
+          className: `ml-4 text-gray-500 hover:text-gray-700 ${isDark ? "hover:text-gray-300" : ""}`,
+          children: "✕"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-4 min-h-[400px]", children: [
+      error && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-4 p-3 bg-red-100 text-red-700 rounded border border-red-200", children: [
+        error,
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            onClick: () => setError(""),
+            className: "ml-2 text-red-500 hover:text-red-700",
+            children: "✕"
+          }
+        )
+      ] }),
+      currentStep === "method" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-medium text-center mb-6", children: "Choose Payment Method" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "button",
+            {
+              onClick: () => {
+                setPaymentMethod("wallet");
+                setCurrentStep("network");
+              },
+              className: `w-full p-4 border-2 rounded-lg hover:border-purple-500 text-left flex items-center space-x-3 transition-colors ${isDark ? "border-gray-600 hover:bg-gray-800" : "border-gray-200 hover:bg-gray-50"}`,
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-2xl", children: "🦊" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: "MetaMask Wallet" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-500"}`, children: "Connect and pay instantly" })
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "button",
+            {
+              onClick: () => {
+                setPaymentMethod("qr");
+                setCurrentStep("network");
+              },
+              className: `w-full p-4 border-2 rounded-lg hover:border-purple-500 text-left flex items-center space-x-3 transition-colors ${isDark ? "border-gray-600 hover:bg-gray-800" : "border-gray-200 hover:bg-gray-50"}`,
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-2xl", children: "📱" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: "QR Code" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-500"}`, children: "Scan with mobile wallet" })
+                ] })
+              ]
+            }
+          )
+        ] })
+      ] }),
+      currentStep === "network" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              onClick: () => setCurrentStep("method"),
+              className: `${isDark ? "text-gray-400 hover:text-gray-200" : "text-gray-500 hover:text-gray-700"}`,
+              children: "←"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-medium", children: "Select Network" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-2", children: networks.map((network) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: () => {
+              setSelectedNetwork(network);
+              setCurrentStep("token");
+            },
+            className: `w-full p-3 border rounded-lg hover:border-purple-500 text-left transition-colors ${isDark ? "border-gray-600 hover:bg-gray-800" : "border-gray-200 hover:bg-gray-50"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: network.name }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-500"}`, children: network.shortName.toUpperCase() })
+            ]
+          },
+          network.id
+        )) })
+      ] }),
+      currentStep === "token" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-2", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              onClick: () => setCurrentStep("network"),
+              className: `${isDark ? "text-gray-400 hover:text-gray-200" : "text-gray-500 hover:text-gray-700"}`,
+              children: "←"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("h3", { className: "font-medium", children: [
+            "Select Token on ",
+            selectedNetwork == null ? void 0 : selectedNetwork.name
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "space-y-2", children: tokens.filter((token) => {
+          var _a2;
+          return ((_a2 = token.Network) == null ? void 0 : _a2.shortName) === (selectedNetwork == null ? void 0 : selectedNetwork.shortName);
+        }).map((token) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "button",
+          {
+            onClick: () => {
+              setSelectedToken(token);
+              createPayment();
+            },
+            disabled: loading,
+            className: `w-full p-3 border rounded-lg hover:border-purple-500 text-left flex justify-between transition-colors disabled:opacity-50 ${isDark ? "border-gray-600 hover:bg-gray-800" : "border-gray-200 hover:bg-gray-50"}`,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: token.name }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-500"}`, children: token.symbol })
+              ] }),
+              token.isStablecoin && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "px-2 py-1 bg-green-100 text-green-600 text-xs rounded", children: "Stablecoin" })
+            ]
+          },
+          token.id
+        )) })
+      ] }),
+      currentStep === "wallet" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-medium text-center", children: "Connect & Pay" }),
+        !walletConnected ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center space-y-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-2xl", children: "🦊" }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `${isDark ? "text-gray-300" : "text-gray-600"}`, children: "Connect MetaMask to continue" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              onClick: connectWallet,
+              disabled: loading,
+              className: "w-full bg-purple-600 text-white py-3 px-4 rounded-lg hover:bg-purple-700 disabled:opacity-50 font-medium",
+              children: loading ? "Connecting..." : "Connect MetaMask"
+            }
+          )
+        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-3 bg-green-50 rounded-lg border border-green-200", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-green-600 text-sm font-medium", children: "✅ Wallet Connected" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "font-mono text-xs text-green-700 mt-1", children: [
+              (_a = wallet.account) == null ? void 0 : _a.slice(0, 6),
+              "...",
+              (_b = wallet.account) == null ? void 0 : _b.slice(-4)
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `p-4 rounded-lg space-y-2 ${isDark ? "bg-gray-800" : "bg-gray-50"}`, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between text-sm", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Amount:" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "font-medium", children: [
+                paymentData == null ? void 0 : paymentData.totalAmount,
+                " ",
+                selectedToken == null ? void 0 : selectedToken.symbol
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between text-sm", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Network:" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: selectedNetwork == null ? void 0 : selectedNetwork.name })
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between text-sm", children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Token:" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "font-medium", children: selectedToken == null ? void 0 : selectedToken.name })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "button",
+            {
+              onClick: sendTransaction,
+              disabled: processing,
+              className: "w-full bg-green-600 text-white py-3 px-4 rounded-lg hover:bg-green-700 disabled:opacity-50 font-medium flex items-center justify-center space-x-2",
+              children: processing ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "animate-spin rounded-full h-4 w-4 border-b-2 border-white" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "Sending Transaction..." })
+              ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+                "Send ",
+                paymentData == null ? void 0 : paymentData.totalAmount,
+                " ",
+                selectedToken == null ? void 0 : selectedToken.symbol
+              ] })
+            }
+          )
+        ] })
+      ] }),
+      currentStep === "qr" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center space-y-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-medium", children: "Scan QR Code" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `p-8 rounded-lg ${isDark ? "bg-gray-800" : "bg-gray-100"}`, children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `${isDark ? "text-gray-400" : "text-gray-500"}`, children: "QR Code will appear here" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xs mt-2", children: [
+            "Send ",
+            paymentData == null ? void 0 : paymentData.totalAmount,
+            " ",
+            selectedToken == null ? void 0 : selectedToken.symbol
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xs", children: "to merchant wallet" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-xs ${isDark ? "text-gray-400" : "text-gray-500"}`, children: "Waiting for payment confirmation..." })
+      ] }),
+      currentStep === "success" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center space-y-4", 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("span", { className: "text-2xl", children: "✅" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-medium text-green-600", children: "Payment Successful!" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: `text-sm ${isDark ? "text-gray-300" : "text-gray-600"}`, children: "Your transaction has been sent successfully" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            onClick: onClose,
+            className: "w-full bg-purple-600 text-white py-3 px-4 rounded-lg hover:bg-purple-700 font-medium",
+            children: "Close"
+          }
+        )
+      ] }),
+      loading && currentStep !== "wallet" && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-purple-600" }) })
+    ] })
+  ] }) });
+};
+const SimpleCoinleyProvider = ({ children, ...props }) => children;
+const VERSION = "0.0.1";
 const utils = {
   formatAmount: (amount, decimals = 2) => amount.toFixed(decimals),
   truncateAddress: (address, startChars = 6, endChars = 4) => {
@@ -1289,6 +1889,8 @@ export {
   CoinleyProvider,
   DEFAULT_CONFIG,
   PaymentAPI,
+  SimpleCoinleyPayment,
+  SimpleCoinleyProvider,
   ThemeProvider,
   VERSION,
   useCoinley,