coinley-test 0.0.59 → 0.0.60

package/dist/index.esm.js

@@ -1302,7 +1302,7 @@ let SimplePaymentAPI$1 = class SimplePaymentAPI {
     });
   }
 };
-let SimpleMetaMaskWallet$1 = class SimpleMetaMaskWallet {
+class SimpleMetaMaskWallet {
   constructor() {
     this.account = null;
     this.chainId = null;
@@ -1440,7 +1440,7 @@ let SimpleMetaMaskWallet$1 = class SimpleMetaMaskWallet {
   isConnected() {
     return !!this.account;
   }
-};
+}
 const SimpleCoinleyPayment = ({
   apiKey,
   apiSecret,
@@ -1462,7 +1462,7 @@ const SimpleCoinleyPayment = ({
   const [paymentData, setPaymentData] = useState(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState("");
-  const [wallet, setWallet] = useState(new SimpleMetaMaskWallet$1());
+  const [wallet, setWallet] = useState(new SimpleMetaMaskWallet());
   const [walletConnected, setWalletConnected] = useState(false);
   const [processing, setProcessing] = useState(false);
   const api = useRef(new SimplePaymentAPI$1(apiUrl, apiKey, apiSecret));
@@ -1481,7 +1481,7 @@ const SimpleCoinleyPayment = ({
     setError("");
     setWalletConnected(false);
     setProcessing(false);
-    setWallet(new SimpleMetaMaskWallet$1());
+    setWallet(new SimpleMetaMaskWallet());
   };
   const loadData = async () => {
     var _a2, _b2;
@@ -1914,260 +1914,180 @@ class SimplePaymentAPI2 {
     });
   }
 }
-class SimpleMetaMaskWallet2 {
+class UniversalWalletManager {
   constructor() {
-    this.account = null;
-    this.chainId = null;
-    this.walletType = "metamask";
+    this.connectedWallet = null;
+    this.walletType = null;
   }
-  async connect() {
+  // Detect all available wallets
+  getAvailableWallets() {
+    const wallets = [];
     if (!window.ethereum) {
-      throw new Error("No Ethereum wallet found. Please install MetaMask extension.");
+      return wallets;
     }
-    let metamaskProvider = null;
-    try {
-      console.log("🦊 Starting MetaMask connection process...");
-      if (window.ethereum.providers && Array.isArray(window.ethereum.providers)) {
-        console.log("🔍 Searching in providers array...");
-        metamaskProvider = window.ethereum.providers.find((provider) => {
-          var _a;
-          const isMetaMask = provider.isMetaMask === true;
-          const notRabby = provider.isRabby !== true;
-          const hasMetaMaskProps = provider._metamask || ((_a = provider.constructor) == null ? void 0 : _a.name) === "MetaMaskInpageProvider";
-          console.log("🔍 Provider check:", { isMetaMask, notRabby, hasMetaMaskProps });
-          return isMetaMask && notRabby || hasMetaMaskProps;
-        });
-        if (metamaskProvider) {
-          console.log("🦊 Found MetaMask in providers array!");
-        }
-      }
-      if (!metamaskProvider) {
-        console.log("🔍 Checking main ethereum provider...");
-        if (window.ethereum.isMetaMask === true && window.ethereum.isRabby !== true) {
-          metamaskProvider = window.ethereum;
-          console.log("🦊 Using main ethereum provider as MetaMask!");
-        } else if (window.ethereum._metamask) {
-          metamaskProvider = window.ethereum;
-          console.log("🦊 Using main ethereum provider (has _metamask property)!");
-        }
-      }
-      if (!metamaskProvider && window.ethereum.providers) {
-        console.log("🔍 Forcing MetaMask selection...");
-        metamaskProvider = window.ethereum.providers.find(
-          (provider) => provider.isMetaMask || provider._metamask
-        );
-        if (metamaskProvider) {
-          console.log("🦊 Found potential MetaMask provider!");
-        }
-      }
-      if (!metamaskProvider && (window.ethereum.isMetaMask || window.ethereum._metamask)) {
-        console.log("🔍 Last resort - using main ethereum provider...");
-        metamaskProvider = window.ethereum;
-      }
-      if (!metamaskProvider) {
-        console.log("🔍 No MetaMask provider found, trying direct connection...");
-        metamaskProvider = window.ethereum;
-      }
-      console.log("🦊 Attempting MetaMask connection with provider:", metamaskProvider);
-      const accounts = await metamaskProvider.request({
-        method: "eth_requestAccounts"
+    if (this.isMetaMaskAvailable()) {
+      wallets.push({
+        type: "metamask",
+        name: "MetaMask",
+        icon: "🦊",
+        description: "Connect using MetaMask wallet",
+        color: "orange",
+        isInstalled: true
       });
-      if (!accounts || accounts.length === 0) {
-        throw new Error("No accounts found. Please unlock MetaMask and try again.");
-      }
-      const chainId = await metamaskProvider.request({
-        method: "eth_chainId"
+    }
+    if (this.isRabbyAvailable()) {
+      wallets.push({
+        type: "rabby",
+        name: "Rabby",
+        icon: "🐰",
+        description: "Connect using Rabby wallet",
+        color: "blue",
+        isInstalled: true
       });
-      this.account = accounts[0];
-      this.chainId = chainId;
-      this.provider = metamaskProvider;
-      console.log("✅ MetaMask connected successfully:");
-      console.log("  Account:", this.account);
-      console.log("  Chain ID:", this.chainId);
-      return { account: this.account, chainId: this.chainId };
-    } catch (error) {
-      console.error("❌ MetaMask connection failed:", error);
-      if (error.code === 4001) {
-        throw new Error("Connection rejected. Please approve the connection in MetaMask.");
-      } else if (error.message.includes("User rejected")) {
-        throw new Error("Connection cancelled. Please try again and approve the connection.");
-      } else if (error.message.includes("Already processing")) {
-        throw new Error("MetaMask is busy. Please wait a moment and try again.");
-      } else {
-        throw new Error(`MetaMask connection failed: ${error.message}`);
-      }
     }
+    console.log("🔍 Available wallets detected:", wallets.map((w) => w.name));
+    return wallets;
   }
-  async sendTransaction(txParams) {
-    if (!this.account || !this.provider) {
-      throw new Error("MetaMask wallet not connected");
+  // Improved MetaMask detection
+  isMetaMaskAvailable() {
+    if (!window.ethereum) return false;
+    if (window.ethereum.isMetaMask && !window.ethereum.isRabby && !window.ethereum.providers) {
+      return true;
     }
-    try {
-      console.log("🦊 Sending MetaMask transaction:", txParams);
-      const fullTxParams = {
-        ...txParams,
-        from: this.account
-      };
-      try {
-        const gasEstimate = await this.provider.request({
-          method: "eth_estimateGas",
-          params: [fullTxParams]
-        });
-        const gasLimit = Math.floor(parseInt(gasEstimate, 16) * 1.2);
-        fullTxParams.gas = `0x${gasLimit.toString(16)}`;
-        console.log("⛽ MetaMask Gas estimate:", parseInt(gasEstimate, 16));
-        console.log("⛽ MetaMask Gas limit (with buffer):", gasLimit);
-      } catch (gasError) {
-        console.warn("MetaMask gas estimation failed:", gasError);
-        fullTxParams.gas = "0x15F90";
-      }
-      console.log("📤 MetaMask Final transaction params:", fullTxParams);
-      const txHash = await this.provider.request({
-        method: "eth_sendTransaction",
-        params: [fullTxParams]
+    if (window.ethereum.providers && Array.isArray(window.ethereum.providers)) {
+      return window.ethereum.providers.some((provider) => {
+        return provider.isMetaMask === true && provider.isRabby !== true || provider._metamask && !provider.isRabby;
       });
-      console.log("✅ MetaMask Transaction sent successfully:", txHash);
-      return txHash;
-    } catch (error) {
-      console.error("MetaMask 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 {
-        throw new Error(error.message || "Transaction failed");
-      }
     }
+    if (window.ethereum._metamask && !window.ethereum.isRabby) {
+      return true;
+    }
+    return false;
   }
-  isConnected() {
-    return !!this.account;
-  }
-}
-class SimpleRabbyWallet {
-  constructor() {
-    this.account = null;
-    this.chainId = null;
-    this.walletType = "rabby";
-    this.provider = null;
+  // Improved Rabby detection
+  isRabbyAvailable() {
+    if (!window.ethereum) return false;
+    if (window.ethereum.isRabby === true) {
+      return true;
+    }
+    if (window.ethereum.providers && Array.isArray(window.ethereum.providers)) {
+      return window.ethereum.providers.some((provider) => provider.isRabby === true);
+    }
+    if (window.rabby) {
+      return true;
+    }
+    return false;
   }
-  async connect() {
+  // Get the correct provider for a specific wallet
+  getProviderForWallet(walletType) {
     if (!window.ethereum) {
-      throw new Error("No Ethereum wallet found. Please install Rabby wallet.");
+      throw new Error("No Ethereum wallet found");
     }
-    let rabbyProvider = null;
-    try {
-      console.log("🐰 Starting Rabby connection process...");
+    let targetProvider = null;
+    if (walletType === "metamask") {
       if (window.ethereum.providers && Array.isArray(window.ethereum.providers)) {
-        console.log("🔍 Searching for Rabby in providers array...");
-        rabbyProvider = window.ethereum.providers.find((provider) => {
-          var _a;
-          const isRabby = provider.isRabby === true;
-          const hasRabbyProps = ((_a = provider.constructor) == null ? void 0 : _a.name) === "RabbyWalletProvider";
-          console.log("🔍 Provider check for Rabby:", { isRabby, hasRabbyProps });
-          return isRabby || hasRabbyProps;
+        targetProvider = window.ethereum.providers.find((provider) => {
+          return provider.isMetaMask === true && provider.isRabby !== true || provider._metamask && !provider.isRabby;
         });
-        if (rabbyProvider) {
-          console.log("🐰 Found Rabby in providers array!");
-        }
       }
-      if (!rabbyProvider) {
-        console.log("🔍 Checking main ethereum provider for Rabby...");
-        if (window.ethereum.isRabby === true) {
-          rabbyProvider = window.ethereum;
-          console.log("🐰 Using main ethereum provider as Rabby!");
-        }
+      if (!targetProvider && window.ethereum.isMetaMask && !window.ethereum.isRabby) {
+        targetProvider = window.ethereum;
       }
-      if (!rabbyProvider && window.rabby) {
-        console.log("🔍 Found window.rabby object...");
-        if (window.rabby.ethereum) {
-          rabbyProvider = window.rabby.ethereum;
-          console.log("🐰 Using window.rabby.ethereum!");
-        } else {
-          rabbyProvider = window.rabby;
-          console.log("🐰 Using window.rabby directly!");
-        }
+      if (!targetProvider && window.ethereum._metamask && !window.ethereum.isRabby) {
+        targetProvider = window.ethereum;
       }
-      if (!rabbyProvider && window.ethereum.providers) {
-        console.log("🔍 Forcing Rabby selection...");
-        rabbyProvider = window.ethereum.providers.find(
-          (provider) => provider.isRabby === true
-        );
-        if (rabbyProvider) {
-          console.log("🐰 Found Rabby provider via force selection!");
-        }
+      if (!targetProvider) {
+        throw new Error("MetaMask not found. Please install MetaMask extension.");
+      }
+    } else if (walletType === "rabby") {
+      if (window.ethereum.providers && Array.isArray(window.ethereum.providers)) {
+        targetProvider = window.ethereum.providers.find((provider) => provider.isRabby === true);
+      }
+      if (!targetProvider && window.ethereum.isRabby === true) {
+        targetProvider = window.ethereum;
       }
-      if (!rabbyProvider && window.ethereum.isRabby) {
-        console.log("🔍 Last resort - using main ethereum provider for Rabby...");
-        rabbyProvider = window.ethereum;
+      if (!targetProvider && window.rabby) {
+        targetProvider = window.rabby.ethereum || window.rabby;
       }
-      if (!rabbyProvider) {
-        console.log("🔍 No Rabby provider found, trying direct connection...");
-        rabbyProvider = window.ethereum;
+      if (!targetProvider) {
+        throw new Error("Rabby wallet not found. Please install Rabby extension.");
       }
-      console.log("🐰 Attempting Rabby connection with provider:", rabbyProvider);
-      const accounts = await rabbyProvider.request({
+    }
+    return targetProvider;
+  }
+  // Connect to a specific wallet
+  async connect(walletType) {
+    try {
+      console.log(`🔗 Attempting to connect to ${walletType}...`);
+      const provider = this.getProviderForWallet(walletType);
+      console.log(`✅ ${walletType} provider found:`, {
+        isMetaMask: provider.isMetaMask,
+        isRabby: provider.isRabby,
+        hasMetaMask: !!provider._metamask
+      });
+      const accounts = await provider.request({
         method: "eth_requestAccounts"
       });
       if (!accounts || accounts.length === 0) {
-        throw new Error("No accounts found. Please unlock Rabby and try again.");
+        throw new Error(`No accounts found. Please unlock ${walletType} and try again.`);
       }
-      const chainId = await rabbyProvider.request({
+      const chainId = await provider.request({
         method: "eth_chainId"
       });
-      this.account = accounts[0];
-      this.chainId = chainId;
-      this.provider = rabbyProvider;
-      console.log("✅ Rabby wallet connected successfully:");
-      console.log("  Account:", this.account);
-      console.log("  Chain ID:", this.chainId);
-      return { account: this.account, chainId: this.chainId };
+      this.connectedWallet = {
+        account: accounts[0],
+        chainId,
+        provider,
+        walletType
+      };
+      this.walletType = walletType;
+      console.log(`✅ ${walletType} connected successfully:`, {
+        account: accounts[0],
+        chainId
+      });
+      return this.connectedWallet;
     } catch (error) {
-      console.error("❌ Rabby wallet connection failed:", error);
+      console.error(`❌ ${walletType} connection failed:`, error);
       if (error.code === 4001) {
-        throw new Error("Connection rejected. Please approve the connection in Rabby.");
+        throw new Error(`Connection rejected. Please approve the connection in ${walletType}.`);
       } else if (error.message.includes("User rejected")) {
-        throw new Error("Connection cancelled. Please try again and approve the connection.");
-      } else if (error.message.includes("Already processing")) {
-        throw new Error("Rabby is busy. Please wait a moment and try again.");
+        throw new Error(`Connection cancelled. Please try again and approve the connection.`);
       } else {
-        throw new Error(`Rabby connection failed: ${error.message}`);
+        throw new Error(`${walletType} connection failed: ${error.message}`);
       }
     }
   }
+  // Send transaction using connected wallet
   async sendTransaction(txParams) {
-    if (!this.account || !this.provider) {
-      throw new Error("Rabby wallet not connected");
+    if (!this.connectedWallet) {
+      throw new Error("No wallet connected");
     }
     try {
-      console.log("🐰 Sending Rabby wallet transaction:", txParams);
+      console.log(`📤 Sending transaction via ${this.walletType}:`, txParams);
       const fullTxParams = {
         ...txParams,
-        from: this.account
+        from: this.connectedWallet.account
       };
       try {
-        const gasEstimate = await this.provider.request({
+        const gasEstimate = await this.connectedWallet.provider.request({
           method: "eth_estimateGas",
           params: [fullTxParams]
         });
         const gasLimit = Math.floor(parseInt(gasEstimate, 16) * 1.2);
         fullTxParams.gas = `0x${gasLimit.toString(16)}`;
-        console.log("⛽ Rabby Gas estimate:", parseInt(gasEstimate, 16));
-        console.log("⛽ Rabby Gas limit (with buffer):", gasLimit);
+        console.log(`⛽ Gas estimate: ${parseInt(gasEstimate, 16)}, limit: ${gasLimit}`);
       } catch (gasError) {
-        console.warn("Rabby gas estimation failed:", gasError);
+        console.warn("Gas estimation failed:", gasError);
         fullTxParams.gas = "0x15F90";
       }
-      console.log("📤 Rabby Final transaction params:", fullTxParams);
-      const txHash = await this.provider.request({
+      const txHash = await this.connectedWallet.provider.request({
         method: "eth_sendTransaction",
         params: [fullTxParams]
       });
-      console.log("✅ Rabby Transaction sent successfully:", txHash);
+      console.log(`✅ Transaction sent successfully via ${this.walletType}:`, txHash);
       return txHash;
     } catch (error) {
-      console.error("Rabby Transaction failed:", error);
+      console.error(`❌ Transaction failed via ${this.walletType}:`, error);
       if (error.code === 4001) {
         throw new Error("Transaction cancelled by user");
       } else if (error.message.includes("insufficient funds")) {
@@ -2179,8 +2099,18 @@ class SimpleRabbyWallet {
       }
     }
   }
+  // Check if wallet is connected
   isConnected() {
-    return !!this.account;
+    return !!this.connectedWallet;
+  }
+  // Get connected wallet info
+  getConnectedWallet() {
+    return this.connectedWallet;
+  }
+  // Disconnect wallet
+  disconnect() {
+    this.connectedWallet = null;
+    this.walletType = null;
   }
 }
 const CMC_LOGO_BASE_URL = "https://s2.coinmarketcap.com/static/img/coins/64x64";
@@ -2523,46 +2453,15 @@ const WalletSelector = ({
   connectedWallet,
   loading
 }) => {
+  var _a, _b;
   const [selectedWalletType, setSelectedWalletType] = useState(null);
-  const isWalletInstalled = (walletType) => {
-    var _a, _b, _c, _d, _e;
-    switch (walletType) {
-      case "metamask":
-        if ((_a = window.ethereum) == null ? void 0 : _a.providers) {
-          return window.ethereum.providers.some((provider) => provider.isMetaMask && !provider.isRabby);
-        }
-        return ((_b = window.ethereum) == null ? void 0 : _b.isMetaMask) && !((_c = window.ethereum) == null ? void 0 : _c.isRabby);
-      case "rabby":
-        if ((_d = window.ethereum) == null ? void 0 : _d.providers) {
-          return window.ethereum.providers.some((provider) => provider.isRabby);
-        }
-        return (_e = window.ethereum) == null ? void 0 : _e.isRabby;
-      default:
-        return false;
-    }
-  };
+  const walletManager = useRef(new UniversalWalletManager());
   const getAvailableWallets = () => {
     if (!selectedNetwork) return [];
-    const wallets = [];
     if (["ethereum", "bsc", "polygon", "arbitrum", "optimism", "avalanche", "solana"].includes(selectedNetwork.shortName)) {
-      wallets.push({
-        type: "metamask",
-        name: "MetaMask",
-        icon: "🦊",
-        description: "Connect using MetaMask wallet",
-        isInstalled: isWalletInstalled("metamask"),
-        color: "orange"
-      });
-      wallets.push({
-        type: "rabby",
-        name: "Rabby",
-        icon: "🐰",
-        description: "Connect using Rabby wallet",
-        isInstalled: isWalletInstalled("rabby"),
-        color: "blue"
-      });
+      return walletManager.current.getAvailableWallets();
     }
-    return wallets;
+    return [];
   };
   const availableWallets = getAvailableWallets();
   const handleWalletClick = async (walletType) => {
@@ -2574,10 +2473,25 @@ const WalletSelector = ({
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-500", children: "Please select a network first" }) });
   }
   if (availableWallets.length === 0) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-gray-500", children: [
-      "No compatible wallets found for ",
-      selectedNetwork.name
-    ] }) });
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center p-4", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-gray-500 mb-4", children: [
+        "No compatible wallets found for ",
+        selectedNetwork.name
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-3 bg-amber-50 rounded-lg border border-amber-200", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-sm text-amber-800", style: { fontFamily: "Bricolage Grotesque, sans-serif" }, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium mb-2", children: "💡 Install a compatible wallet:" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1 text-xs", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            "• ",
+            /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: "https://metamask.io", target: "_blank", rel: "noopener noreferrer", className: "text-amber-700 underline hover:text-amber-900", children: "Install MetaMask" })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+            "• ",
+            /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: "https://rabby.io", target: "_blank", rel: "noopener noreferrer", className: "text-amber-700 underline hover:text-amber-900", children: "Install Rabby Wallet" })
+          ] })
+        ] })
+      ] }) })
+    ] });
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-3", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("h4", { className: "text-sm font-medium text-gray-700 mb-3", style: { fontFamily: "Bricolage Grotesque, sans-serif" }, children: [
@@ -2589,8 +2503,8 @@ const WalletSelector = ({
       "button",
       {
         onClick: () => handleWalletClick(wallet.type),
-        disabled: loading || !wallet.isInstalled,
-        className: `w-full p-4 border-2 rounded-xl text-left transition-all duration-200 ${(connectedWallet == null ? void 0 : connectedWallet.walletType) === wallet.type ? "border-green-500 bg-green-50" : wallet.isInstalled ? "border-gray-200 hover:border-[#7042D2]/50 hover:bg-[#7042D2]/5" : "border-gray-200 bg-gray-50 opacity-50 cursor-not-allowed"}`,
+        disabled: loading,
+        className: `w-full p-4 border-2 rounded-xl text-left transition-all duration-200 ${(connectedWallet == null ? void 0 : connectedWallet.walletType) === wallet.type ? "border-green-500 bg-green-50" : "border-gray-200 hover:border-[#7042D2]/50 hover:bg-[#7042D2]/5"}`,
         style: { fontFamily: "Bricolage Grotesque, sans-serif" },
         children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center space-x-3", children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-2xl", children: wallet.icon }),
@@ -2599,24 +2513,22 @@ const WalletSelector = ({
               wallet.name,
               wallet.type === "rabby" && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ml-2 px-2 py-1 bg-blue-100 text-blue-700 text-xs rounded-full", children: "NEW" })
             ] }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-500", children: !wallet.isInstalled ? `Please install ${wallet.name} extension` : (connectedWallet == null ? void 0 : connectedWallet.walletType) === wallet.type ? "✅ Connected" : wallet.description })
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm text-gray-500", children: (connectedWallet == null ? void 0 : connectedWallet.walletType) === wallet.type ? "✅ Connected" : wallet.description })
           ] }),
           loading && selectedWalletType === wallet.type && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "animate-spin rounded-full h-5 w-5 border-b-2 border-[#7042D2]" })
         ] })
       },
       wallet.type
     )),
-    availableWallets.some((w) => !w.isInstalled) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-4 p-3 bg-amber-50 rounded-lg border border-amber-200", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-sm text-amber-800", style: { fontFamily: "Bricolage Grotesque, sans-serif" }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium mb-2", children: "💡 Need to install a wallet?" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-1 text-xs", children: [
-        !isWalletInstalled("metamask") && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-          "• ",
-          /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: "https://metamask.io", target: "_blank", rel: "noopener noreferrer", className: "text-amber-700 underline hover:text-amber-900", children: "Install MetaMask" })
-        ] }),
-        !isWalletInstalled("rabby") && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-          "• ",
-          /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: "https://rabby.io", target: "_blank", rel: "noopener noreferrer", className: "text-amber-700 underline hover:text-amber-900", children: "Install Rabby Wallet" })
-        ] })
+    connectedWallet && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-4 p-3 bg-green-50 rounded-lg border border-green-200", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-sm text-green-800 text-center", style: { fontFamily: "Bricolage Grotesque, sans-serif" }, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: "✅ Wallet Connected" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs mt-1", children: [
+        (_a = connectedWallet.account) == null ? void 0 : _a.slice(0, 6),
+        "...",
+        (_b = connectedWallet.account) == null ? void 0 : _b.slice(-4),
+        " (",
+        connectedWallet.walletType,
+        ")"
       ] })
     ] }) })
   ] });
@@ -2930,10 +2842,7 @@ const EnhancedSimpleCoinleyPayment = ({
   const [paymentData, setPaymentData] = useState(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState("");
-  const [wallets, setWallets] = useState({
-    metamask: new SimpleMetaMaskWallet2(),
-    rabby: new SimpleRabbyWallet()
-  });
+  const walletManager = useRef(new UniversalWalletManager());
   const [selectedWalletType, setSelectedWalletType] = useState(null);
   const [connectedWallet, setConnectedWallet] = useState(null);
   const [processing, setProcessing] = useState(false);
@@ -2955,10 +2864,7 @@ const EnhancedSimpleCoinleyPayment = ({
     setConnectedWallet(null);
     setSelectedWalletType(null);
     setProcessing(false);
-    setWallets({
-      metamask: new SimpleMetaMaskWallet2(),
-      rabby: new SimpleRabbyWallet()
-    });
+    walletManager.current.disconnect();
     setPaymentType("wallet");
   };
   const loadData = async () => {
@@ -3012,13 +2918,9 @@ const EnhancedSimpleCoinleyPayment = ({
     try {
       setLoading(true);
       setError("");
-      const wallet = wallets[walletType];
-      if (!wallet) {
-        throw new Error(`Wallet ${walletType} not found`);
-      }
       console.log(`🔗 Connecting to ${walletType} wallet...`);
-      const connection = await wallet.connect();
-      setConnectedWallet(wallet);
+      const connection = await walletManager.current.connect(walletType);
+      setConnectedWallet(connection);
       setSelectedWalletType(walletType);
       console.log(`✅ ${walletType} wallet connected successfully:`, connection.account);
     } catch (err) {
@@ -3045,7 +2947,6 @@ const EnhancedSimpleCoinleyPayment = ({
           selectedNetwork: selectedNetwork.shortName,
           selectedToken: selectedToken.symbol,
           walletType: selectedWalletType
-          // Include wallet type in metadata
         }
       };
       console.log("🔄 Creating payment:", paymentPayload);
@@ -3062,7 +2963,7 @@ const EnhancedSimpleCoinleyPayment = ({
   };
   const sendTransaction = async () => {
     var _a2, _b2;
-    if (!connectedWallet) {
+    if (!walletManager.current.isConnected()) {
       setError("No wallet connected");
       return;
     }
@@ -3075,7 +2976,6 @@ const EnhancedSimpleCoinleyPayment = ({
       }
       console.log(`🔄 Preparing ${selectedWalletType} transaction to:`, recipientAddress);
       let txParams;
-      let txHash;
       if (["metamask", "rabby"].includes(selectedWalletType)) {
         if (selectedToken.contractAddress) {
           const decimals = selectedToken.decimals || 6;
@@ -3109,7 +3009,7 @@ const EnhancedSimpleCoinleyPayment = ({
         }
       }
       setCurrentStep("processing");
-      txHash = await connectedWallet.sendTransaction(txParams);
+      const txHash = await walletManager.current.sendTransaction(txParams);
       console.log(`✅ ${selectedWalletType} transaction sent! Hash:`, txHash);
       setTimeout(() => {
         setCurrentStep("success");
@@ -3119,7 +3019,6 @@ const EnhancedSimpleCoinleyPayment = ({
           amount: paymentData.totalAmount,
           method: paymentMethod,
           walletType: selectedWalletType
-          // Include wallet type in callback
         });
       }, 2e3);
     } catch (err) {
@@ -3303,6 +3202,7 @@ const EnhancedSimpleCoinleyPayment = ({
                   setSelectedToken(null);
                   setConnectedWallet(null);
                   setSelectedWalletType(null);
+                  walletManager.current.disconnect();
                 },
                 placeholder: "Choose your network...",
                 renderOption: renderNetworkOption,