UNPKG

coinley-test

Version:

Beautiful blockchain payment gateway SDK for seamless crypto payments - React & vanilla js

1 lines 86.8 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("framer-motion"),require("lucide-react"),require("@coinley/wallet-connect-core"),require("axios"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","framer-motion","lucide-react","@coinley/wallet-connect-core","axios","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).CoinleyTest={},e.React,e.FramerMotion,e.LucideReact,e.CoinleyWalletCore,e.axios,e.ReactDOM)}(this,function(e,t,s,a,n,r,o){"use strict";var l={exports:{}},i={},c=t,d=Symbol.for("react.element"),m=Symbol.for("react.fragment"),h=Object.prototype.hasOwnProperty,u=c.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,x={key:!0,ref:!0,__self:!0,__source:!0};function y(e,t,s){var a,n={},r=null,o=null;for(a in void 0!==s&&(r=""+s),void 0!==t.key&&(r=""+t.key),void 0!==t.ref&&(o=t.ref),t)h.call(t,a)&&!x.hasOwnProperty(a)&&(n[a]=t[a]);if(e&&e.defaultProps)for(a in t=e.defaultProps)void 0===n[a]&&(n[a]=t[a]);return{$$typeof:d,type:e,key:r,ref:o,props:n,_owner:u.current}}i.Fragment=m,i.jsx=y,i.jsxs=y,l.exports=i;var g=l.exports;class p{constructor(e,t,s){this.apiKey=t,this.apiSecret=s,this.api=r.create({baseURL:e.endsWith("/")?e.slice(0,-1):e,timeout:3e4,headers:{"Content-Type":"application/json"}}),this.api.interceptors.request.use(e=>{var t;e.headers["X-API-Key"]=this.apiKey,e.headers["X-API-Secret"]=this.apiSecret;const s=this.generateMerchantToken();return s&&(e.headers.Authorization=`Bearer ${s}`),console.log("API Request:",{method:null==(t=e.method)?void 0:t.toUpperCase(),url:e.url,data:e.data}),e},e=>(console.error("Request interceptor error:",e),Promise.reject(e))),this.api.interceptors.response.use(e=>(console.log("API Response:",{status:e.status,url:e.config.url,data:e.data}),e),e=>{var t,s,a,n,r;if(console.error("API Error:",{status:null==(t=e.response)?void 0:t.status,data:null==(s=e.response)?void 0:s.data,message:e.message}),401===(null==(a=e.response)?void 0:a.status))throw new Error("Authentication failed. Please check your API credentials.");if(404===(null==(n=e.response)?void 0:n.status))throw new Error("API endpoint not found. Please check your API URL.");if((null==(r=e.response)?void 0:r.status)>=500)throw new Error("Server error. Please try again later.");throw e})}generateMerchantToken(){try{const e=`${this.apiKey}:${this.apiSecret}`;return btoa(e)}catch(e){return console.error("Failed to generate token:",e),null}}async createPayment(e){var t,s;try{return(await this.api.post("/api/payments/create",e)).data}catch(a){if(null==(s=null==(t=a.response)?void 0:t.data)?void 0:s.error)throw new Error(a.response.data.error);throw new Error(a.message||"Failed to create payment")}}async getPayment(e){var t,s;try{return(await this.api.get(`/api/payments/${e}`)).data}catch(a){if(null==(s=null==(t=a.response)?void 0:t.data)?void 0:s.error)throw new Error(a.response.data.error);throw new Error(a.message||"Failed to get payment details")}}async getNetworks(){try{return(await this.api.get("/api/networks")).data}catch(e){return console.error("Get networks failed:",e),{networks:[{id:"ethereum",name:"Ethereum",shortName:"ethereum",chainId:"1",type:"ethereum",explorerUrl:"https://etherscan.io",isTestnet:!1},{id:"bsc",name:"Binance Smart Chain",shortName:"bsc",chainId:"56",type:"bsc",explorerUrl:"https://bscscan.com",isTestnet:!1},{id:"polygon",name:"Polygon",shortName:"polygon",chainId:"137",type:"ethereum",explorerUrl:"https://polygonscan.com",isTestnet:!1}]}}}async getStablecoins(){try{return(await this.api.get("/api/networks/stablecoins")).data}catch(e){return console.error("Get stablecoins failed:",e),{stablecoins:[{id:"usdt-eth",name:"Tether USD",symbol:"USDT",contractAddress:"0xdAC17F958D2ee523a2206206994597C13D831ec7",decimals:6,isStablecoin:!0,networkId:"ethereum",Network:{id:"ethereum",name:"Ethereum",shortName:"ethereum",type:"ethereum"}},{id:"usdc-eth",name:"USD Coin",symbol:"USDC",contractAddress:"0xA0b86a33E6441d81d0B93bF9EE0f74ca32F7e6f6",decimals:6,isStablecoin:!0,networkId:"ethereum",Network:{id:"ethereum",name:"Ethereum",shortName:"ethereum",type:"ethereum"}}]}}}async verifyQRPayment(e){var t,s;try{return(await this.api.post("/api/payments/verify-qr",{paymentId:e})).data}catch(a){if(null==(s=null==(t=a.response)?void 0:t.data)?void 0:s.error)throw new Error(a.response.data.error);throw new Error(a.message||"Failed to verify payment")}}async processPayment(e,t,s,a){var n,r;try{return(await this.api.post("/api/payments/process",{paymentId:e,transactionHash:t,network:s,senderAddress:a})).data}catch(o){if(null==(r=null==(n=o.response)?void 0:n.data)?void 0:r.error)throw new Error(o.response.data.error);throw new Error(o.message||"Failed to process payment")}}async healthCheck(){try{return 200===(await this.api.get("/api/health")).status}catch(e){return console.error("Health check failed:",e),!1}}}const f=({selectedNetwork:e,selectedToken:t,paymentData:s,config:r,onTransactionSent:o,onError:l,isConnecting:i,setIsConnecting:c})=>{const{isConnected:d,address:m,disconnect:h}=n.useWallet(),{connectWallet:u,isPending:x}=n.useWalletConnect(),{detectedWallets:y,hasWallets:p,walletCount:f}=n.useWalletDetection(),{sendTransaction:b}=n.useWalletTransaction(),{openModal:w}=n.useWalletModal();y.filter(e=>e.name.toLowerCase().includes("metamask")||"injected"===e.provider||e.name.toLowerCase().includes("coinbase")||e.name.toLowerCase().includes("wallet connect"));const j=async e=>{try{if(c(!0),d&&(await h(),await new Promise(e=>setTimeout(e,1e3))),"metamask"===e&&window.ethereum&&window.ethereum.isMetaMask)try{await window.ethereum.request({method:"eth_requestAccounts"}),console.log("✅ Connected directly to MetaMask")}catch(t){throw console.error("MetaMask connection failed:",t),t}else await u(e)}catch(t){console.error("Wallet connection failed:",t),l(t.message||"Failed to connect wallet")}finally{c(!1)}};return g.jsx("div",{className:"text-center space-y-6",children:g.jsxs("div",{className:"space-y-4",children:[g.jsx("div",{className:"w-16 h-16 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center mx-auto",children:g.jsx(a.Wallet,{className:"w-8 h-8 text-[#7042D2]"})}),d?g.jsxs(g.Fragment,{children:[g.jsx("h3",{className:"text-lg font-semibold text-green-600",children:"Wallet Connected ✅"}),g.jsxs("div",{className:"bg-gray-50 dark:bg-gray-800 rounded-lg p-4 space-y-3",children:[g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Address:"}),g.jsxs("div",{className:"flex items-center space-x-2",children:[g.jsxs("span",{className:"font-mono text-sm",children:[null==m?void 0:m.slice(0,6),"...",null==m?void 0:m.slice(-4)]}),g.jsx("button",{onClick:async()=>{try{await h()}catch(e){console.error("Disconnect error:",e)}},className:"text-xs text-red-600 hover:text-red-800",children:"Disconnect"})]})]}),s&&g.jsxs(g.Fragment,{children:[g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Amount:"}),g.jsxs("span",{className:"font-medium",children:[s.totalAmount," ",null==t?void 0:t.symbol]})]}),g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Network:"}),g.jsx("span",{className:"font-medium",children:null==e?void 0:e.name})]})]})]}),g.jsx("button",{onClick:async()=>{var a;if(d&&s&&t)try{c(!0),console.log("🔍 Transaction Debug:"),console.log("Connected wallet address:",m),console.log("Payment data:",s),console.log("Selected token:",t),console.log("Selected network:",e);let n,r=null==(a=s.metadata)?void 0:a.recipientWallet;if(console.log("Merchant recipient address:",r),!r||"string"!=typeof r)throw new Error("Merchant wallet address not found in payment data");if(!r.match(/^0x[a-fA-F0-9]{40}$/))throw new Error(`Invalid merchant address format: ${r}`);if(t.contractAddress){console.log("🔍 ERC-20 Transaction Details:"),console.log("Token contract:",t.contractAddress),console.log("Token decimals:",t.decimals),console.log("Payment amount:",s.totalAmount);const e=t.decimals||6,a=Math.floor(s.totalAmount*Math.pow(10,e));console.log("Calculated amount (with decimals):",a);const o="0xa9059cbb",l=r.slice(2).toLowerCase().padStart(64,"0"),i=a.toString(16).padStart(64,"0"),c=`${o}${l}${i}`;console.log("🔍 Transaction Data:"),console.log("Method ID:",o),console.log("Recipient (padded):",l),console.log("Amount (padded):",i),console.log("Full data:",c);const d={to:t.contractAddress,data:c,value:"0x0"};console.log("📤 Sending ERC-20 transaction:",d),n=await b(d)}else{const e=Math.floor(s.totalAmount*Math.pow(10,18)),t={to:r,value:`0x${e.toString(16)}`};console.log("📤 Sending native transaction:",t),n=await b(t)}n&&(console.log("✅ Transaction sent successfully:",n),o(n))}catch(n){console.error("❌ Transaction failed:",n),l(n.message||"Transaction failed")}finally{c(!1)}else l("Wallet not connected or payment data missing")},disabled:i,className:"w-full bg-[#7042D2] text-white py-4 rounded-lg font-semibold hover:bg-[#7042D2]/90 transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center space-x-2",children:i?g.jsxs(g.Fragment,{children:[g.jsx(a.Loader2,{className:"w-5 h-5 animate-spin"}),g.jsx("span",{children:"Processing Payment..."})]}):g.jsxs(g.Fragment,{children:[g.jsx(a.Zap,{className:"w-5 h-5"}),g.jsx("span",{children:"Send Payment"})]})}),g.jsxs("p",{className:"text-xs text-gray-500",children:["Make sure you have enough ",null==t?void 0:t.symbol," and ETH for gas fees"]})]}):g.jsxs(g.Fragment,{children:[g.jsx("h3",{className:"text-lg font-semibold",children:"Connect Your Wallet"}),g.jsx("p",{className:"text-gray-600 dark:text-gray-400 text-sm",children:"Choose your preferred wallet to complete the payment"}),g.jsxs("div",{className:"space-y-3",children:[g.jsxs("button",{onClick:()=>j("metamask"),disabled:x||i,className:"w-full p-3 border border-gray-300 rounded-lg hover:border-[#7042D2] flex items-center space-x-3 transition-colors disabled:opacity-50",children:[g.jsx("span",{className:"text-xl",children:"🦊"}),g.jsxs("div",{className:"text-left flex-1",children:[g.jsx("div",{className:"font-medium",children:"MetaMask"}),g.jsx("div",{className:"text-xs text-gray-500",children:"Connect with MetaMask"})]})]}),g.jsxs("button",{onClick:()=>{try{console.log("Attempting to open wallet modal..."),w()}catch(e){console.error("Failed to open modal:",e),j("injected")}},disabled:x||i,className:"w-full p-3 border border-gray-300 rounded-lg hover:border-[#7042D2] flex items-center space-x-3 transition-colors disabled:opacity-50",children:[g.jsx("span",{className:"text-xl",children:"💼"}),g.jsxs("div",{className:"text-left flex-1",children:[g.jsx("div",{className:"font-medium",children:"Other Wallets"}),g.jsx("div",{className:"text-xs text-gray-500",children:"Choose from available wallets"})]})]}),g.jsx("button",{onClick:()=>j("injected"),disabled:x||i,className:"w-full p-2 text-sm border border-dashed border-gray-300 rounded-lg hover:border-[#7042D2] transition-colors disabled:opacity-50",children:"Try Direct Connection"})]}),i&&g.jsxs("div",{className:"flex items-center justify-center space-x-2 text-gray-600",children:[g.jsx(a.Loader2,{className:"w-4 h-4 animate-spin"}),g.jsx("span",{children:"Connecting..."})]})]})]})})},b=({apiKey:e,apiSecret:r,apiUrl:o="http://localhost:9000",onSuccess:l,onError:i,onClose:c,isOpen:d,config:m,theme:h="light",merchantName:u,debug:x=!1})=>{const[y,b]=t.useState("select-method"),[w,j]=t.useState([]),[v,N]=t.useState([]),[k,C]=t.useState(null),[S,M]=t.useState(null),[E,T]=t.useState(null),[A,P]=t.useState(""),[D,I]=t.useState(null),[F,$]=t.useState(!1),[L,q]=t.useState(""),[U,W]=t.useState(!1),[B,R]=t.useState(""),[H,O]=t.useState(!1),G=t.useRef(new p(o,e,r)),_=n.createCoinleyWalletConfig({appName:u||"Coinley Payment",appDescription:"Crypto payment processing",chains:[{id:1,name:"Ethereum",network:"ethereum",rpcUrls:{default:{http:["https://eth.llamarpc.com"]}},nativeCurrency:{name:"Ethereum",symbol:"ETH",decimals:18}},{id:56,name:"BNB Smart Chain",network:"bsc",rpcUrls:{default:{http:["https://bsc-dataseed1.binance.org"]}},nativeCurrency:{name:"BNB",symbol:"BNB",decimals:18}}]});t.useEffect(()=>{d&&V()},[d]);const V=async()=>{try{$(!0),q("");const[e,t]=await Promise.all([G.current.getNetworks(),G.current.getStablecoins()]);j(e.networks||[]),N(t.stablecoins||[]),x&&(console.log("Initialized networks:",e.networks),console.log("Initialized tokens:",t.stablecoins))}catch(e){console.error("Failed to initialize payment:",e),q("Failed to load payment options. Please try again.")}finally{$(!1)}},K=e=>{T(e),b("select-network")},z=async(e,t)=>{try{$(!0);const s={amount:m.amount,currency:t.symbol,network:e.shortName,customerEmail:m.customerEmail,callbackUrl:m.callbackUrl,metadata:{...m.metadata,paymentMethod:E,selectedNetwork:e.shortName,selectedToken:t.symbol,merchantWalletAddresses:m.merchantWalletAddresses}};console.log("🔍 Payment payload with merchant wallets:",s);const a=await G.current.createPayment(s);I(a.payment),"wallet"===E?b("wallet-connect"):(await Q(a.payment),b("qr-code"))}catch(s){console.error("Payment initiation failed:",s),q(s.message||"Failed to create payment"),b("error")}finally{$(!1)}},Q=async e=>{var t,s;try{const a=(null==(t=e.metadata)?void 0:t.recipientWallet)||(null==(s=m.merchantWalletAddresses)?void 0:s[(null==k?void 0:k.shortName)||""]);if(!a)throw new Error("Recipient wallet address not found");let n="";n="ethereum"===(null==k?void 0:k.type)||"bsc"===(null==k?void 0:k.type)?(null==S?void 0:S.contractAddress)?`ethereum:${S.contractAddress}/transfer?address=${a}&uint256=${e.totalAmount*Math.pow(10,S.decimals)}`:`ethereum:${a}?value=${e.totalAmount}e18`:"tron"===(null==k?void 0:k.type)?`tron:${a}?amount=${e.totalAmount}`:`${null==S?void 0:S.symbol}:${a}?amount=${e.totalAmount}`,P(a),Y(e.id)}catch(a){console.error("QR code generation failed:",a),q("Failed to generate QR code"),b("error")}},Y=async e=>{let t=0;const s=async()=>{var a;try{const n=await G.current.verifyQRPayment(e);return n.verified&&(null==(a=n.payment)?void 0:a.transactionHash)?(R(n.payment.transactionHash),await X(e,n.payment.transactionHash),!0):(t++,t<60?setTimeout(s,5e3):(q("Payment verification timeout. Please check your transaction."),b("error")),!1)}catch(n){return console.error("Payment verification error:",n),t++,t<60?setTimeout(s,5e3):(q("Payment verification failed"),b("error")),!1}};setTimeout(s,2e3)},X=async(e,t)=>{b("success"),l&&l(e,t,{network:null==k?void 0:k.name,token:null==S?void 0:S.symbol,amount:null==D?void 0:D.totalAmount,method:E})},Z=()=>{b("select-method"),T(null),C(null),M(null),P(""),I(null),q(""),R(""),c&&c()};return d?g.jsxs(n.CoinleyWalletProvider,{config:_,walletConfig:{appName:u||"Coinley Payment"},children:[g.jsx("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 backdrop-blur-sm",children:g.jsxs(s.motion.div,{initial:{scale:.9,opacity:0},animate:{scale:1,opacity:1},exit:{scale:.9,opacity:0},className:"relative w-full max-w-md mx-4 rounded-2xl shadow-2xl overflow-hidden "+("dark"===h?"bg-gray-900 text-white":"bg-white text-gray-900"),children:[g.jsxs("div",{className:"relative p-6 border-b border-gray-200 dark:border-gray-700",children:["select-method"!==y&&"success"!==y&&"error"!==y&&g.jsx("button",{onClick:()=>{if("select-network"===y)b("select-method");else if("select-token"===y)b("select-network");else if("wallet-connect"===y||"qr-code"===y){v.filter(e=>{var t;return(null==(t=e.Network)?void 0:t.shortName)===(null==k?void 0:k.shortName)||e.networkId===(null==k?void 0:k.id)}).length>1?b("select-token"):b("select-network")}},className:"absolute left-4 top-6 p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors",children:g.jsx(a.ArrowLeft,{className:"w-5 h-5"})}),g.jsx("button",{onClick:Z,className:"absolute right-4 top-6 p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors",children:g.jsx(a.X,{className:"w-5 h-5"})}),g.jsxs("div",{className:"text-center",children:[g.jsxs("div",{className:"flex items-center justify-center space-x-2 mb-2",children:[g.jsx(a.Sparkles,{className:"w-5 h-5 text-[#7042D2]"}),g.jsx("h2",{className:"text-xl font-bold",children:"Pay with Crypto"}),g.jsx(a.Sparkles,{className:"w-5 h-5 text-[#7042D2]"})]}),u&&g.jsx("p",{className:"text-sm text-gray-600 dark:text-gray-400 mt-1",children:u}),g.jsx("div",{className:"mt-2",children:g.jsxs("span",{className:"text-2xl font-bold text-[#7042D2]",children:["$",m.amount.toFixed(2)]})})]})]}),g.jsx("div",{className:"p-6 min-h-[400px]",children:g.jsxs(s.AnimatePresence,{mode:"wait",children:["select-method"===y&&g.jsxs(s.motion.div,{initial:{x:20,opacity:0},animate:{x:0,opacity:1},exit:{x:-20,opacity:0},className:"space-y-4",children:[g.jsx("h3",{className:"text-lg font-semibold text-center mb-6",children:"Choose Payment Method"}),g.jsx(s.motion.button,{whileHover:{scale:1.02},whileTap:{scale:.98},onClick:()=>K("wallet"),className:"w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",children:g.jsxs("div",{className:"flex items-center space-x-4",children:[g.jsx("div",{className:"p-3 bg-[#7042D2] bg-opacity-10 rounded-lg group-hover:bg-opacity-20 transition-colors",children:g.jsx(a.Wallet,{className:"w-6 h-6 text-[#7042D2]"})}),g.jsxs("div",{className:"text-left",children:[g.jsx("div",{className:"font-semibold",children:"Connect Wallet"}),g.jsx("div",{className:"text-sm text-gray-600 dark:text-gray-400",children:"MetaMask, WalletConnect & more"})]}),g.jsx(a.Zap,{className:"w-5 h-5 text-[#7042D2] ml-auto"})]})}),g.jsx(s.motion.button,{whileHover:{scale:1.02},whileTap:{scale:.98},onClick:()=>K("qr"),className:"w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",children:g.jsxs("div",{className:"flex items-center space-x-4",children:[g.jsx("div",{className:"p-3 bg-[#7042D2] bg-opacity-10 rounded-lg group-hover:bg-opacity-20 transition-colors",children:g.jsx(a.QrCode,{className:"w-6 h-6 text-[#7042D2]"})}),g.jsxs("div",{className:"text-left",children:[g.jsx("div",{className:"font-semibold",children:"QR Code"}),g.jsx("div",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Scan with mobile wallet"})]})]})})]},"select-method"),"select-network"===y&&g.jsxs(s.motion.div,{initial:{x:20,opacity:0},animate:{x:0,opacity:1},exit:{x:-20,opacity:0},className:"space-y-4",children:[g.jsx("h3",{className:"text-lg font-semibold text-center mb-6",children:"Select Network"}),F?g.jsx("div",{className:"flex justify-center py-8",children:g.jsx(a.Loader2,{className:"w-8 h-8 animate-spin text-[#7042D2]"})}):g.jsx("div",{className:"space-y-3",children:w.map(e=>g.jsx(s.motion.button,{whileHover:{scale:1.02},whileTap:{scale:.98},onClick:()=>(async e=>{C(e);const t=v.filter(t=>{var s;return(null==(s=t.Network)?void 0:s.shortName)===e.shortName||t.networkId===e.id});if(t.length>1)b("select-token");else if(1===t.length){const s=t[0];M(s),await z(e,s)}else q(`No supported tokens found for ${e.name}`),b("error")})(e),className:"w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",children:g.jsxs("div",{className:"flex items-center space-x-4",children:[e.logo?g.jsx("img",{src:e.logo,alt:e.name,className:"w-8 h-8 rounded-full"}):g.jsx("div",{className:"w-8 h-8 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center",children:g.jsx("span",{className:"text-sm font-bold text-[#7042D2]",children:e.shortName.charAt(0).toUpperCase()})}),g.jsxs("div",{className:"text-left flex-1",children:[g.jsx("div",{className:"font-semibold",children:e.name}),g.jsx("div",{className:"text-sm text-gray-600 dark:text-gray-400",children:e.shortName.toUpperCase()})]}),g.jsx(a.ChevronDown,{className:"w-5 h-5 text-gray-400 transform -rotate-90"})]})},e.id))})]},"select-network"),"select-token"===y&&g.jsxs(s.motion.div,{initial:{x:20,opacity:0},animate:{x:0,opacity:1},exit:{x:-20,opacity:0},className:"space-y-4",children:[g.jsxs("h3",{className:"text-lg font-semibold text-center mb-6",children:["Select Token on ",null==k?void 0:k.name]}),F?g.jsx("div",{className:"flex justify-center py-8",children:g.jsx(a.Loader2,{className:"w-8 h-8 animate-spin text-[#7042D2]"})}):g.jsx("div",{className:"space-y-3",children:v.filter(e=>{var t;return(null==(t=e.Network)?void 0:t.shortName)===(null==k?void 0:k.shortName)||e.networkId===(null==k?void 0:k.id)}).map(e=>g.jsx(s.motion.button,{whileHover:{scale:1.02},whileTap:{scale:.98},onClick:()=>(async e=>{M(e),await z(k,e)})(e),className:"w-full p-4 border-2 border-gray-200 dark:border-gray-700 rounded-xl hover:border-[#7042D2] transition-colors group",children:g.jsxs("div",{className:"flex items-center space-x-4",children:[e.logo?g.jsx("img",{src:e.logo,alt:e.symbol,className:"w-8 h-8 rounded-full"}):g.jsx("div",{className:"w-8 h-8 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center",children:g.jsx("span",{className:"text-sm font-bold text-[#7042D2]",children:e.symbol.charAt(0)})}),g.jsxs("div",{className:"text-left flex-1",children:[g.jsx("div",{className:"font-semibold",children:e.name}),g.jsxs("div",{className:"text-sm text-gray-600 dark:text-gray-400",children:[e.symbol,e.isStablecoin&&g.jsx("span",{className:"ml-2 px-2 py-0.5 bg-green-100 text-green-600 text-xs rounded-full",children:"Stablecoin"})]})]}),g.jsx(a.ChevronDown,{className:"w-5 h-5 text-gray-400 transform -rotate-90"})]})},e.id))})]},"select-token"),"wallet-connect"===y&&g.jsx(s.motion.div,{initial:{x:20,opacity:0},animate:{x:0,opacity:1},exit:{x:-20,opacity:0},children:g.jsx(f,{selectedNetwork:k,selectedToken:S,paymentData:D,config:m,onTransactionSent:async e=>{R(e),b("processing");try{await G.current.processPayment(D.id,e,(null==k?void 0:k.shortName)||"",""),await X(D.id,e)}catch(t){console.error("Payment processing failed:",t),await X(D.id,e)}},onError:q,isConnecting:H,setIsConnecting:O})},"wallet-connect"),"qr-code"===y&&g.jsxs(s.motion.div,{initial:{x:20,opacity:0},animate:{x:0,opacity:1},exit:{x:-20,opacity:0},className:"text-center space-y-6",children:[g.jsxs("div",{className:"space-y-4",children:[g.jsx("h3",{className:"text-lg font-semibold",children:"Scan QR Code"}),g.jsx("p",{className:"text-gray-600 dark:text-gray-400",children:"Use your mobile wallet to scan and pay"})]}),A&&g.jsx("div",{className:"bg-white p-4 rounded-xl mx-auto inline-block",children:g.jsxs("div",{className:"w-48 h-48 flex items-center justify-center text-gray-500",children:["QR Code: ",A.slice(0,10),"...",A.slice(-4)]})}),D&&g.jsxs("div",{className:"space-y-3",children:[g.jsxs("div",{className:"bg-gray-50 dark:bg-gray-800 rounded-lg p-4 space-y-2",children:[g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Network:"}),g.jsx("span",{className:"font-medium",children:null==k?void 0:k.name})]}),g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Amount:"}),g.jsxs("span",{className:"font-medium",children:[D.totalAmount," ",null==S?void 0:S.symbol]})]})]}),g.jsxs("div",{className:"flex items-center justify-center space-x-2 text-sm text-gray-600 dark:text-gray-400",children:[g.jsx(a.Loader2,{className:"w-4 h-4 animate-spin"}),g.jsx("span",{children:"Waiting for payment..."})]})]})]},"qr-code"),"processing"===y&&g.jsxs(s.motion.div,{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1},className:"text-center space-y-6",children:[g.jsx("div",{className:"w-16 h-16 bg-[#7042D2] bg-opacity-20 rounded-full flex items-center justify-center mx-auto",children:g.jsx(a.Loader2,{className:"w-8 h-8 animate-spin text-[#7042D2]"})}),g.jsxs("div",{children:[g.jsx("h3",{className:"text-lg font-semibold text-[#7042D2]",children:"Processing Payment..."}),g.jsx("p",{className:"text-gray-600 dark:text-gray-400 mt-2",children:"Your transaction is being processed"})]})]},"processing"),"success"===y&&g.jsxs(s.motion.div,{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1},className:"text-center space-y-6",children:[g.jsx("div",{className:"w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto",children:g.jsx(a.CheckCircle2,{className:"w-8 h-8 text-green-500"})}),g.jsxs("div",{children:[g.jsx("h3",{className:"text-lg font-semibold text-green-600",children:"Payment Successful!"}),g.jsx("p",{className:"text-gray-600 dark:text-gray-400 mt-2",children:"Your payment has been processed successfully"})]}),B&&g.jsx("div",{className:"bg-gray-50 dark:bg-gray-800 rounded-lg p-4",children:g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Transaction:"}),g.jsxs("div",{className:"flex items-center space-x-2",children:[g.jsxs("span",{className:"font-mono text-sm",children:[B.slice(0,6),"...",B.slice(-4)]}),g.jsx("button",{onClick:()=>(async e=>{try{await navigator.clipboard.writeText(e),W(!0),setTimeout(()=>W(!1),2e3)}catch(t){console.error("Failed to copy:",t)}})(B),className:"p-1 hover:bg-gray-200 dark:hover:bg-gray-700 rounded",children:g.jsx(a.Copy,{className:"w-4 h-4"})}),(null==k?void 0:k.explorerUrl)&&g.jsx("a",{href:`${k.explorerUrl}/tx/${B}`,target:"_blank",rel:"noopener noreferrer",className:"p-1 hover:bg-gray-200 dark:hover:bg-gray-700 rounded",children:g.jsx(a.ExternalLink,{className:"w-4 h-4"})})]})]})}),g.jsx("button",{onClick:Z,className:"w-full bg-[#7042D2] text-white py-3 rounded-lg font-semibold hover:bg-[#7042D2]/90 transition-colors",children:"Close"})]},"success"),"error"===y&&g.jsxs(s.motion.div,{initial:{scale:.8,opacity:0},animate:{scale:1,opacity:1},className:"text-center space-y-6",children:[g.jsx("div",{className:"w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mx-auto",children:g.jsx(a.AlertCircle,{className:"w-8 h-8 text-red-500"})}),g.jsxs("div",{children:[g.jsx("h3",{className:"text-lg font-semibold text-red-600",children:"Payment Failed"}),g.jsx("p",{className:"text-gray-600 dark:text-gray-400 mt-2",children:L||"Something went wrong. Please try again."})]}),g.jsxs("div",{className:"space-y-3",children:[g.jsx("button",{onClick:()=>{b("select-method"),q("")},className:"w-full bg-[#7042D2] text-white py-3 rounded-lg font-semibold hover:bg-[#7042D2]/90 transition-colors",children:"Try Again"}),g.jsx("button",{onClick:Z,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")]})}),g.jsx("div",{className:"px-6 py-4 border-t border-gray-200 dark:border-gray-700 text-center",children:g.jsxs("p",{className:"text-xs text-gray-500",children:["Powered by ",g.jsx("span",{className:"font-semibold text-[#7042D2]",children:"Coinley"})]})})]})}),g.jsx(n.WalletModal,{})]}):null},w=t.createContext(null),j=t.forwardRef(({customerEmail:e="",merchantName:s="",onSuccess:a,onError:n,onClose:r,theme:o="light",autoOpen:l=!1,testMode:i=!1,debug:c=!1,merchantWalletAddresses:d={}},m)=>{const h=t.useContext(w);if(!h)throw new Error("CoinleyCheckout must be used within a CoinleyProvider");const{openPayment:u,closePayment:x}=h,y=t=>{try{if(c&&console.log("Opening Coinley checkout with config:",t),!t.amount||t.amount<=0)throw new Error("Amount must be greater than 0");const s={...t,customerEmail:t.customerEmail||e,merchantWalletAddresses:{...d,...t.merchantWalletAddresses},metadata:{...t.metadata,testMode:i,checkoutVersion:"1.0.0"}};u(s,{onSuccess:a,onError:n,onClose:r})}catch(s){console.error("Failed to open Coinley checkout:",s),n&&n(s)}},g=()=>{x()};return t.useImperativeHandle(m,()=>({open:y,close:g})),null});j.displayName="CoinleyCheckout";let v=class{constructor(e,t,s){this.baseURL=e.endsWith("/")?e.slice(0,-1):e,this.apiKey=t,this.apiSecret=s}async request(e,t={}){const s=`${this.baseURL}${e}`,a={"Content-Type":"application/json","X-API-Key":this.apiKey,"X-API-Secret":this.apiSecret,...t.headers},n=await fetch(s,{...t,headers:a});if(!n.ok){const e=await n.json().catch(()=>({}));throw new Error(e.error||`HTTP ${n.status}`)}return n.json()}async getNetworks(){try{return await this.request("/api/networks")}catch(e){return console.error("Failed to fetch networks:",e),{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(e){return console.error("Failed to fetch tokens:",e),{stablecoins:[{id:"1",name:"Tether USD",symbol:"USDT",contractAddress:"0xdAC17F958D2ee523a2206206994597C13D831ec7",decimals:6,networkId:"1",Network:{shortName:"ethereum",name:"Ethereum"}}]}}}async createPayment(e){return await this.request("/api/payments/create",{method:"POST",body:JSON.stringify(e)})}},N=class{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 e=window.ethereum.providers.find(e=>e.isMetaMask);if(!e)throw new Error("MetaMask not found among installed wallets");console.log("🦊 Using MetaMask provider specifically"),window.ethereum=e}else if(!window.ethereum.isMetaMask)throw new Error("Please use MetaMask wallet");try{console.log("🦊 Requesting MetaMask account access...");const e=await window.ethereum.request({method:"eth_requestAccounts"});if(!e||0===e.length)throw new Error("No accounts found in MetaMask");const t=await window.ethereum.request({method:"eth_chainId"});if(this.account=e[0],this.chainId=t,console.log("✅ MetaMask connected successfully:"),console.log(" Account:",this.account),console.log(" Chain ID:",this.chainId),"0xa0419a048a1469b34a5245f08c0697ba956a56ab"!==this.account.toLowerCase())throw console.warn("⚠️ Connected to different account than expected"),console.warn(" Expected: 0xa0419a048A1469B34a5245f08C0697Ba956a56Ab"),console.warn(" Connected:",this.account),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(e){throw console.error("MetaMask connection failed:",e),new Error(e.message||"Failed to connect to MetaMask")}}async sendTransaction(e){if(!this.account)throw new Error("Wallet not connected");try{if(console.log("🦊 Sending MetaMask transaction:",e),!window.ethereum.isMetaMask)throw new Error("Not using MetaMask provider");if(e.data&&e.data.includes("a9059cbb")){console.log("🔍 Checking USDT balance...");try{const t=await window.ethereum.request({method:"eth_call",params:[{to:e.to,data:`0x70a08231000000000000000000000000${this.account.slice(2)}`},"latest"]}),s=parseInt(t,16),a=s/1e6;console.log("💰 USDT Balance:",a);const n=e.data.slice(-64),r=parseInt(n,16),o=r/1e6;if(console.log("💸 Transaction Amount:",o),s<r)throw new Error(`Insufficient USDT balance. You have ${a} USDT but need ${o} USDT`)}catch(t){console.warn("Could not check balance:",t)}}try{const e=await window.ethereum.request({method:"eth_getBalance",params:[this.account,"latest"]}),t=parseInt(e,16)/Math.pow(10,18);if(console.log("⛽ ETH Balance for gas:",t),t<.001)throw new Error(`Insufficient ETH for gas fees. You have ${t.toFixed(4)} ETH but need at least 0.001 ETH`)}catch(s){console.warn("Could not check ETH balance:",s)}const a={...e,from:this.account};try{const e=await window.ethereum.request({method:"eth_estimateGas",params:[a]}),t=Math.floor(1.2*parseInt(e,16));a.gas=`0x${t.toString(16)}`,console.log("⛽ Gas estimate:",parseInt(e,16)),console.log("⛽ Gas limit (with buffer):",t)}catch(s){console.warn("Gas estimation failed:",s),a.gas="0x15F90"}console.log("📤 Final transaction params:",a);const n=await window.ethereum.request({method:"eth_sendTransaction",params:[a]});return console.log("✅ Transaction sent successfully:",n),n}catch(a){throw console.error("Transaction failed:",a),4001===a.code?new Error("Transaction cancelled by user"):a.message.includes("insufficient funds")?new Error("Insufficient funds in wallet"):a.message.includes("gas")?new Error("Gas estimation failed. You may not have enough ETH for gas fees."):a.message.includes("invalid opcode")?new Error("Transaction failed - invalid operation. This usually means insufficient token balance or contract interaction failed."):new Error(a.message||"Transaction failed")}}isConnected(){return!!this.account}};class k{constructor(e,t,s){this.baseURL=e.endsWith("/")?e.slice(0,-1):e,this.apiKey=t,this.apiSecret=s}async request(e,t={}){const s=`${this.baseURL}${e}`,a={"Content-Type":"application/json","X-API-Key":this.apiKey,"X-API-Secret":this.apiSecret,...t.headers},n=await fetch(s,{...t,headers:a});if(!n.ok){const e=await n.json().catch(()=>({}));throw new Error(e.error||`HTTP ${n.status}`)}return n.json()}async getNetworks(){try{return await this.request("/api/networks")}catch(e){return console.error("Failed to fetch networks:",e),{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(e){return console.error("Failed to fetch tokens:",e),{stablecoins:[{id:"1",name:"Tether USD",symbol:"USDT",contractAddress:"0xdAC17F958D2ee523a2206206994597C13D831ec7",decimals:6,networkId:"1",Network:{shortName:"ethereum",name:"Ethereum"}}]}}}async createPayment(e){return await this.request("/api/payments/create",{method:"POST",body:JSON.stringify(e)})}async verifyQRPayment(e){return await this.request("/api/payments/verify-qr",{method:"POST",body:JSON.stringify({paymentId:e})})}}class C{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 e=window.ethereum.providers.find(e=>e.isMetaMask);if(!e)throw new Error("MetaMask not found among installed wallets");console.log("🦊 Using MetaMask provider specifically"),window.ethereum=e}else if(!window.ethereum.isMetaMask)throw new Error("Please use MetaMask wallet");try{console.log("🦊 Requesting MetaMask account access...");const e=await window.ethereum.request({method:"eth_requestAccounts"});if(!e||0===e.length)throw new Error("No accounts found in MetaMask");const t=await window.ethereum.request({method:"eth_chainId"});return this.account=e[0],this.chainId=t,console.log("✅ MetaMask connected successfully:"),console.log(" Account:",this.account),console.log(" Chain ID:",this.chainId),{account:this.account,chainId:this.chainId}}catch(e){throw console.error("MetaMask connection failed:",e),new Error(e.message||"Failed to connect to MetaMask")}}async sendTransaction(e){if(!this.account)throw new Error("Wallet not connected");try{if(console.log("🦊 Sending MetaMask transaction:",e),!window.ethereum.isMetaMask)throw new Error("Not using MetaMask provider");const s={...e,from:this.account};try{const e=await window.ethereum.request({method:"eth_estimateGas",params:[s]}),t=Math.floor(1.2*parseInt(e,16));s.gas=`0x${t.toString(16)}`,console.log("⛽ Gas estimate:",parseInt(e,16)),console.log("⛽ Gas limit (with buffer):",t)}catch(t){console.warn("Gas estimation failed:",t),s.gas="0x15F90"}console.log("📤 Final transaction params:",s);const a=await window.ethereum.request({method:"eth_sendTransaction",params:[s]});return console.log("✅ Transaction sent successfully:",a),a}catch(s){throw console.error("Transaction failed:",s),4001===s.code?new Error("Transaction cancelled by user"):s.message.includes("insufficient funds")?new Error("Insufficient funds in wallet"):s.message.includes("gas")?new Error("Gas estimation failed. You may not have enough ETH for gas fees."):new Error(s.message||"Transaction failed")}}isConnected(){return!!this.account}}const S={bitcoin:1,ethereum:1027,bsc:1839,polygon:3890,tron:1958,solana:5426,algorand:4030,cardano:2010,avalanche:5805,fantom:3513,arbitrum:11841,optimism:11840,USDT:825,USDC:3408,BUSD:4687,DAI:4943,FRAX:6952,TUSD:2563,USDP:5992,USDD:5994,FDUSD:26081,PYUSD:28295,WBTC:3717,LINK:1975,UNI:7083,AAVE:7278,COMP:5692,YFI:5864,MKR:1518,SUSHI:6758,CRV:6538,SNX:2586,UMA:5617,BAL:5728,MANA:1966,SAND:6210,APE:18876,LDO:8e3,GRT:6719,ENS:13855,RPL:2943,SHIB:5994,MATIC:3890,BNB:1839,ADA:2010,SOL:5426,DOT:6636,AVAX:5805,TRX:1958,ALGO:4030,FTM:3513,ARB:11841,OP:11840,"1INCH":8104,DYDX:11156,ICP:8916,FIL:2280,CAKE:7186,RUNE:4157,ALPHA:7232,BNT:1727,KNC:1982,ZRX:1896,REN:2539,LRC:1934,WETH:2396,WMATIC:3890,WBNB:1839,UST:7129,USTC:7129,LUSD:8115,MIM:9681,FEI:8642,TRIBE:8741,RAI:8525,SUSD:2927},M=e=>{if(!e)return null;const t=S[e.toUpperCase()];return t?`https://s2.coinmarketcap.com/static/img/coins/64x64/${t}.png`:null},E={ethereum:M("ethereum"),bsc:M("bsc"),polygon:M("polygon"),tron:M("tron"),solana:M("solana"),algorand:M("algorand"),cardano:M("cardano"),avalanche:M("avalanche"),fantom:M("fantom"),arbitrum:M("arbitrum"),optimism:M("optimism")},T=e=>M(e),A=({options:e=[],value:s,onChange:a,placeholder:n,renderOption:r,getOptionKey:l,getOptionValue:i,getSearchableText:c,disabled:d=!1})=>{const[m,h]=t.useState(!1),[u,x]=t.useState(""),[y,p]=t.useState({top:0,left:0,width:400,maxHeight:450}),f=t.useRef(null),b=t.useRef(null),w=e.filter(e=>(c?c(e):"").toLowerCase().includes(u.toLowerCase())),j=e.find(e=>i(e)===s),v=()=>{if(b.current){const e=window.innerWidth,t=window.innerHeight,s=window.pageYOffset||document.documentElement.scrollTop,a=window.pageXOffset||document.documentElement.scrollLeft,n=Math.min(400,e-40),r=Math.min(450,t-100);p({top:t/2-r/2+s,left:e/2-n/2+a,width:n,maxHeight:r})}};t.useEffect(()=>{const e=e=>{f.current&&!f.current.contains(e.target)&&b.current&&!b.current.contains(e.target)&&(h(!1),x(""))},t=()=>{m&&v()},s=()=>{m&&v()};return m&&(v(),document.addEventListener("mousedown",e),window.addEventListener("scroll",t,!0),window.addEventListener("resize",s)),()=>{document.removeEventListener("mousedown",e),window.removeEventListener("scroll",t,!0),window.removeEventListener("resize",s)}},[m]);const N=m&&g.jsxs(g.Fragment,{children:[g.jsx("div",{className:"fixed inset-0 bg-black bg-opacity-30 transition-opacity",style:{zIndex:999998},onClick:()=>{h(!1),x("")}}),g.jsxs("div",{ref:f,className:"fixed bg-white border-2 border-gray-200 rounded-3xl shadow-2xl overflow-hidden",style:{top:y.top,left:y.left,width:y.width,maxHeight:y.maxHeight,zIndex:999999,transform:"translateZ(0)",boxShadow:"0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.05)"},children:[g.jsxs("div",{className:"flex items-center justify-between p-4 border-b border-gray-200 bg-gradient-to-r from-[#7042D2]/10 to-purple-50",children:[g.jsx("h3",{className:"text-lg font-semibold text-[#7042D2]",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:n||"Select Option"}),g.jsx("button",{onClick:()=>{h(!1),x("")},className:"text-gray-500 hover:text-gray-700 transition-colors p-1 rounded-full hover:bg-gray-100",children:g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),g.jsx("div",{className:"p-4 border-b border-gray-200 bg-gray-50",children:g.jsx("input",{type:"text",placeholder:"Search networks and tokens...",value:u,onChange:e=>x(e.target.value),className:"w-full p-3 border border-gray-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-[#7042D2]/20 focus:border-[#7042D2] text-sm",style:{fontFamily:"Bricolage Grotesque, sans-serif"},autoFocus:!0})}),g.jsx("div",{className:"overflow-y-auto custom-scrollbar",style:{maxHeight:(y.maxHeight||450)-180+"px",minHeight:"200px"},children:0===w.length?g.jsxs("div",{className:"p-8 text-gray-500 text-center",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:[g.jsx("div",{className:"text-4xl mb-3",children:"🔍"}),g.jsx("div",{className:"text-lg mb-2",children:"No options found"}),g.jsx("div",{className:"text-sm text-gray-400",children:"Try a different search term"})]}):g.jsxs(g.Fragment,{children:[g.jsxs("div",{className:"px-4 py-3 bg-gray-50 border-b border-gray-100 text-sm text-gray-600",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:[g.jsx("span",{className:"font-semibold",children:w.length})," option",1!==w.length?"s":""," available"]}),g.jsx("div",{className:"p-2",children:w.map(e=>g.jsx("button",{type:"button",onClick:()=>{a(i(e)),h(!1),x("")},className:"w-full p-4 text-left hover:bg-[#7042D2]/10 transition-all duration-200 rounded-xl mb-2 last:mb-0 "+(i(e)===s?"bg-[#7042D2]/20 text-[#7042D2] border-2 border-[#7042D2]/30":"text-gray-800 border-2 border-transparent hover:border-[#7042D2]/20"),style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:r(e)},l(e)))})]})}),g.jsx("div",{className:"p-3 bg-gradient-to-r from-gray-50 to-gray-100 border-t border-gray-200 text-center",children:g.jsx("div",{className:"text-xs text-gray-500",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:w.length>5?"↕️ Scroll to see more options":"✨ Select your preferred option"})})]})]});return g.jsxs(g.Fragment,{children:[g.jsx("div",{className:"relative",children:g.jsx("button",{ref:b,type:"button",onClick:()=>{d||(m||v(),h(!m))},disabled:d,className:`w-full p-4 border-2 rounded-2xl bg-gradient-to-r from-white to-gray-50 text-left focus:outline-none focus:ring-3 focus:ring-[#7042D2]/20 focus:border-[#7042D2] transition-all duration-300 ease-out shadow-lg hover:shadow-xl ${d?"opacity-50 cursor-not-allowed":"hover:border-[#7042D2]/50 cursor-pointer"} ${m?"border-[#7042D2] ring-3 ring-[#7042D2]/20":"border-gray-200"}`,style:{minHeight:"60px",fontFamily:"Bricolage Grotesque, sans-serif",fontSize:"16px",fontWeight:"500"},children:g.jsxs("div",{className:"flex items-center justify-between",children:[g.jsx("div",{className:"flex items-center space-x-3",children:j?r(j):g.jsx("span",{className:"text-gray-500",children:n})}),g.jsx("div",{className:"transform transition-transform duration-200 "+(m?"rotate-180":""),children:g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5 text-[#7042D2]",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})})]})})}),"undefined"!=typeof document&&document.body&&o.createPortal(N,document.body),g.jsx("style",{jsx:!0,children:"\n .custom-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: #7042D2 #f1f1f1;\n }\n .custom-scrollbar::-webkit-scrollbar {\n width: 12px;\n }\n .custom-scrollbar::-webkit-scrollbar-track {\n background: #f8f9fa;\n border-radius: 10px;\n margin: 4px;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb {\n background: linear-gradient(180deg, #7042D2 0%, #5b34b1 100%);\n border-radius: 10px;\n border: 2px solid #f8f9fa;\n }\n .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n background: linear-gradient(180deg, #5b34b1 0%, #4c2a93 100%);\n }\n .custom-scrollbar::-webkit-scrollbar-corner {\n background: #f8f9fa;\n }\n "})]})},P=({walletAddress:e,amount:s,currency:a,network:n,theme:r="light"})=>{const[o,l]=t.useState(""),[i,c]=t.useState(!0);t.useEffect(()=>{e&&(c(!0),setTimeout(()=>{l(`${e}?amount=${s}&currency=${a}&network=${n}`),c(!1)},1e3))},[e,s,a,n]);return g.jsxs("div",{className:"flex flex-col items-center",children:[g.jsx("div",{className:"p-4 rounded-lg bg-white mb-3 shadow-sm border",children:i?g.jsx("div",{className:"flex items-center justify-center",style:{width:200,height:200},children:g.jsxs("div",{className:"text-center",children:[g.jsx("div",{className:"animate-spin rounded-full h-8 w-8 border-b-2 border-purple-600 mx-auto mb-2"}),g.jsx("div",{className:"text-sm text-gray-600",children:"Generating QR Code..."})]})}):g.jsx("div",{className:"flex items-center justify-center bg-gray-100 rounded-lg",style:{width:200,height:200},children:g.jsxs("div",{className:"text-center p-4",children:[g.jsx("div",{className:"text-2xl mb-2",children:"📱"}),g.jsx("div",{className:"text-sm text-gray-600",children:"QR Code"}),g.jsx("div",{className:"text-xs text-gray-500 mt-1",children:"Scan to pay"})]})})}),g.jsxs("div",{className:"text-center text-sm text-gray-700 mb-4",children:[g.jsxs("p",{className:"font-semibold text-gray-800 flex items-center justify-center",children:[g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4 mr-1",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 4v1m6 11h2m-6 0h-2v4m0-11v3m0 0h.01M12 12h4.01M12 12h-4.01M12 12V8.01"})}),"Scan to Pay with ",a]}),g.jsxs("p",{className:"text-xs text-gray-500 mt-1",children:["Scan with your ",n," wallet app"]})]}),g.jsxs("div",{className:"w-full mb-4 p-3 bg-gray-50 rounded-lg",children:[g.jsxs("div",{className:"flex justify-between items-center",children:[g.jsx("span",{className:"text-sm font-medium text-gray-700",children:"Amount to Pay:"}),g.jsxs("span",{className:"text-lg font-bold text-[#7042D2]",children:[s," ",a]})]}),g.jsxs("div",{className:"flex justify-between items-center mt-1",children:[g.jsx("span",{className:"text-xs text-gray-500",children:"Network:"}),g.jsx("span",{className:"text-xs font-medium text-gray-700",children:n})]}),g.jsxs("div",{className:"flex justify-between items-center mt-1",children:[g.jsx("span",{className:"text-xs text-gray-500",children:"Recipient:"}),g.jsx("span",{className:"text-xs font-mono text-gray-700",children:(d=e,!d||d.length<=16?d:`${d.slice(0,6)}...${d.slice(-4)}`)})]})]}),g.jsx("div",{className:"w-full",children:g.jsxs("div",{className:"p-3 rounded bg-blue-50 border border-blue-200",children:[g.jsxs("h4",{className:"text-sm font-medium mb-2 text-blue-800 flex items-center",children:[g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4 mr-1",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"})}),"Payment Instructions"]}),g.jsxs("ol",{className:"text-xs space-y-1 text-blue-700",children:[g.jsx("li",{children:"1. Open your crypto wallet app"}),g.jsx("li",{children:"2. Scan the QR code above"}),g.jsxs("li",{children:["3. Send exactly ",g.jsxs("strong",{children:[s," ",a]})]}),g.jsx("li",{children:'4. Click "I have sent the payment" button below'})]})]})})]});var d},D=({status:e,message:s,theme:a="light",payment:n=null,transactionHash:r=null,selectedPaymentMethod:o=null,merchantName:l="Merchant",onClose:i=null})=>{const[c,d]=t.useState(!1),[m,h]=t.useState(0);t.useEffect(()=>{if("processing"===e){const e=setInterval(()=>{h(e=>e>=90?e:e+15*Math.random())},500);return()=>clearInterval(e)}},[e]);const u=async()=>{if(r)try{await navigator.clipboard.writeText(r),d(!0),setTimeout(()=>d(!1),2e3)}catch(e){console.error("Failed to copy transaction hash:",e)}},x=()=>{switch(e){case"processing":return g.jsxs("div",{className:"relative",children:[g.jsx("div",{className:"animate-spin rounded-full h-12 w-12 border-4 border-t-[#7042D2] border-blue-500/20"}),g.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:g.jsx("div",{className:"w-6 h-6 bg-[#7042D2] rounded-full animate-pulse"})})]});case"success":return g.jsx("div",{className:"rounded-full h-16 w-16 bg-green-500 flex items-center justify-center animate-bounce",children:g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-10 w-10 text-white",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:3,children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 13l4 4L19 7"})})});case"error":return g.jsx("div",{className:"rounded-full h-12 w-12 bg-red-100 flex items-center justify-center",children:g.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-8 w-8 text-red-500",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:g.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M6 18L18 6M6 6l12 12"})})});default:return null}};return"processing"===e?g.jsxs("div",{className:"flex flex-col items-center justify-center py-6 px-4",children:[g.jsx("div",{className:"mb-6",children:x()}),g.jsx("h3",{className:"text-xl font-bold mb-3 text-gray-900",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:"Processing Payment"}),g.jsx("p",{className:"text-center text-gray-600 mb-6",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:"Your transaction has been sent to the blockchain and is being processed..."}),g.jsxs("div",{className:"w-full max-w-xs mb-4",children:[g.jsx("div",{className:"bg-gray-200 rounded-full h-3",children:g.jsx("div",{className:"bg-[#7042D2] h-3 rounded-full transition-all duration-500 ease-out",style:{width:`${m}%`}})}),g.jsxs("div",{className:"text-center mt-2 text-sm text-gray-500",style:{fontFamily:"Bricolage Grotesque, sans-serif"},children:["Processing... ",Math.round(m),"%"]})]}),g.jsxs("div",{className:"text-center space-y-2",children:[g.jsxs("div",{className:"flex items-center justify-center space-x-2",children:[g.jsx("div",{className:"w-2 h-2 bg-green-500 rounded-full animate-pulse"}),g.jsx("span",{className:"text-sm