@privy-io/react-auth/dist/esm/FundingMethodSelectionScreen-CFTtSc8T.mjs

React client for the Privy Auth API

import{jsxs as e,Fragment as n,jsx as t}from"react/jsx-runtime";import a from"@heroicons/react/24/outline/CreditCardIcon";import o from"@heroicons/react/24/outline/QrCodeIcon";import i from"@heroicons/react/24/solid/ArrowsRightLeftIcon";import{useState as r,useEffect as d,useMemo as s}from"react";import{getAddress as c}from"viem/utils";import{B as l}from"./ModalHeader-BnVmXtvG.mjs";import{t as m}from"./FundWalletMethodHeader-Cb-ACySl.mjs";import{E as u}from"./ErrorBanner-CQERa7bL.mjs";import{I as p}from"./InfoBanner-DkQEPd77.mjs";import{A as h,G as f}from"./GooglePay-DA-Ff7zK.mjs";import{u as g}from"./context-DLtU3JQy.mjs";import{j as y,z as C,A as w}from"./useActiveWallet-CvP7iYvj.mjs";import{a as F,u as v}from"./internal-context-Z-fyxadS.mjs";import{a as b}from"./privy-context-DrMxzgOR.mjs";import{u as W}from"./useWallets-BzNCTucF.mjs";import{W as S}from"./WalletCards-DH1rqayz.mjs";import{g as I}from"./getErc20TokenInfo-wKW6b8bj.mjs";import{monadMainnet as M,avalanche as j,arbitrum as x,polygon as T,optimism as D,base as k,mainnet as A,toCoinbaseAssetId as E,getCoinbaseOnRampUrl as O,chainToMoonpayCurrency as U,isSupportedChainIdForMoonpay as _,isSupportedChainIdForCoinbaseOnramp as L}from"@privy-io/js-sdk-core";import{trigger as P}from"@privy-io/popup";import{a as R}from"./index-CvvUk2Lm.mjs";import{e as q,I as z,f as N,g as B}from"./styles-DDaGxKdi.mjs";import"styled-components";import"@heroicons/react/24/outline/ArrowLeftIcon";import"@heroicons/react/24/outline/ArrowRightIcon";import"@heroicons/react/24/outline/QuestionMarkCircleIcon";import"@heroicons/react/24/outline/XMarkIcon";import"@heroicons/react/24/outline/ExclamationCircleIcon";import"@heroicons/react/24/outline/InformationCircleIcon";import"tinycolor2";import"zustand";import"react-device-detect";import"./use-export-wallet-_wu5ex5t.mjs";import"eventemitter3";import"./events-context-CI0iqAXA.mjs";import"viem";import"ofetch";import"@privy-io/are-addresses-equal";import"./analytics-mkkvFRju.mjs";import"./LinkPasskeyScreen-DmtRo8xi.mjs";import"lucide-react";import"./TodoList-CgrU7uwu.mjs";import"./ScreenLayout-D1p_ntex.mjs";import"./Screen-Cycy3IzT.mjs";import"./index-Dq_xe9dz.mjs";const G=e=>{let[n,t]=r();return d((()=>{e().then((e=>{t(e)})).catch((()=>{}))}),[]),n};function H(e){let n=Q[e];if(!n)throw new F(`Unsupported chainId: ${e} for Coinbase Onramp`);return n}let Q={[A.id]:"ethereum",[k.id]:"base",[D.id]:"optimism",[T.id]:"polygon",[x.id]:"arbitrum",[j.id]:"avacchain",[M.id]:"monad"};const $=(e,n,t,a,o,i)=>new Promise((async(r,d)=>{let s=P();if(!s)return void d(Error("Unable to initialize flow"));let c="ethereum"===n.chainType?H(n.chain.id):"solana",l=n.isUSDC?"USDC":"ethereum"===n.chainType?E(n.chain.id,"native-currency"):"SOL",m=await e.initCoinbaseOnRamp({addresses:[{address:n.address,blockchains:[c]}],assets:[l]}),{url:u}=O({appId:e.getAppId(),input:m,amount:n.amount,blockchain:c,asset:l,experience:i});s.location=u.toString();let p={...o?.funding,showAlternateFundingMethod:!0};n.usingDefaultFundingMethod&&(p.usingDefaultFundingMethod=!1),t({funding:p,solanaFundingData:o?.solanaFundingData,coinbaseOnrampStatus:{popup:s}}),a("CoinbaseOnrampStatusScreen"),e.createAnalyticsEvent({eventName:"sdk_fiat_on_ramp_started",payload:{provider:"coinbase-onramp",value:n.amount,chainType:n.chainType,chainId:"ethereum"===n.chainType?n.chain.id:n.chain}}),setTimeout((()=>{t({funding:p,solanaFundingData:o?.solanaFundingData,coinbaseOnrampStatus:{partnerUserId:m.partner_user_id,popup:s}})}),5e3),r()})),X=async(e,n,t,a,o,i,r,d)=>{let s=P();if(!s)throw Error("Unable to initialize flow");let c="ethereum"===n.chainType?U(n.chain.id,a):n.isUSDC?"USDC_SOL":"SOL",{signedUrl:l,externalTransactionId:m}=await e.signMoonpayOnRampUrl({address:n.address,useSandbox:t.fundingMethodConfig.moonpay.useSandbox??!1,config:{uiConfig:{accentColor:t.appearance.palette.accent,theme:t.appearance.palette.colorScheme},paymentMethod:d,currencyCode:c,quoteCurrencyAmount:R(n.amount)}});e.createAnalyticsEvent({eventName:"sdk_fiat_on_ramp_started",payload:{provider:"moonpay",value:n.amount,chainType:n.chainType,chainId:"ethereum"===n.chainType?n.chain.id:n.chain}}),s.location=l;let u={...r?.funding,showAlternateFundingMethod:!0};n.usingDefaultFundingMethod&&(u.usingDefaultFundingMethod=!1),o({moonpayStatus:{},funding:u,solanaFundingData:r?.solanaFundingData}),i("MoonpayStatusScreen"),setTimeout((()=>{o({moonpayStatus:{externalTransactionId:m},funding:u,solanaFundingData:r?.solanaFundingData})}),8e3)};let J=async e=>"undefined"!=typeof window&&"PaymentRequest"in window&&await new window.PaymentRequest([{supportedMethods:e}],{id:"0",total:{label:"Item",amount:{currency:"USD",value:"1.00"}}}).canMakePayment();const K=()=>J("https://apple.com/apple-pay"),V=()=>J("https://google.com/pay"),Y={component:()=>{let{wallets:r}=W(),{connectors:F}=v(),M=F.filter(y).flatMap((e=>e.wallets)),{navigate:j,data:x,setModalData:T}=b(),{client:D}=v(),k=g(),A=x?.funding,E=G(K),O=G(V),U="solana"===A.chainType,P=U?void 0:A,R=s((()=>((e,n,t,a,o,i)=>{let r,d,s="solana"===t.chainType,c=s?void 0:t,l=t.isUSDC?"USDC":c?.erc20Address?void 0:"native-currency",m=!!s||l&&_(Number(t.chain.id),l),u=!!s||l&&L(Number(t.chain.id),l),p=[];for(let r of(t.preferredCardProvider&&t.supportedOptions.sort((e=>e.provider===t.preferredCardProvider?-1:1)),t.supportedOptions))"card"===r.method&&"coinbase"===r.provider&&u&&p.push((()=>$(n,t,a,o,i,"buy"))),"card"===r.method&&"moonpay"===r.provider&&m&&l&&p.push((()=>X(n,t,e,l,a,o,i,"credit_debit_card")));for(let e of t.supportedOptions)"exchange"===e.method&&"coinbase"===e.provider&&u&&(r=()=>$(n,t,a,o,i,"buy"));for(let e of i?.funding?.supportedOptions??[])"wallets"===e.method&&(d=()=>o("TransferFromWalletScreen"));return{onFundWithCard:p,onFundWithExchange:r,onFundWithWallet:d}})(k,D,A,T,j,x)),[k,D,A,x,T,j]),H=U?M.find((({address:e})=>e===A.address)):r.find((({address:e})=>c(e)===c(A.address))),Q=C(H?.walletClientType||"unknown"),J=Q?.name||"wallet",Y=H&&"privy"!==H.walletClientType?J:k.name,Z=s((()=>A.uiConfig?.landing?.title?A.uiConfig?.landing?.title:`Add funds to your ${Y?.toLowerCase().endsWith("wallet")?Y:Y+" wallet"}`),[A.uiConfig?.landing?.title,Y]);d((()=>{if(A?.defaultFundingMethod&&A.usingDefaultFundingMethod)switch(T({funding:{...A,usingDefaultFundingMethod:!1},solanaFundingData:x?.solanaFundingData}),A?.defaultFundingMethod){case"card":R.onFundWithCard[0]&&R.onFundWithCard[0]();break;case"exchange":R.onFundWithExchange&&R.onFundWithExchange();break;case"wallet":R.onFundWithWallet&&R.onFundWithWallet();break;case"manual":j("ManualTransferScreen")}}),[]),d((()=>{P?.erc20Address&&!P.erc20ContractInfo&&I({address:P.erc20Address,chain:P.chain,rpcConfig:k.rpcConfig,privyAppId:k.id}).then((e=>{T({...x,funding:{...P,erc20ContractInfo:e?{symbol:e.symbol,decimals:e.decimals}:void 0}})})).catch(console.error)}),[P?.erc20Address,P?.chain]);let ee=!(!P?.erc20Address||P?.erc20ContractInfo);/*#__PURE__*/return e(n,{children:[/*#__PURE__*/t(m,{}),/*#__PURE__*/t("h3",{children:Z}),/*#__PURE__*/e(q,{children:[A.errorMessage&&/*#__PURE__*/t(u,{theme:k.appearance.palette.colorScheme,children:A.errorMessage}),R.onFundWithCard?.[0]&&/*#__PURE__*/e(w,{disabled:ee,onClick:R.onFundWithCard[0],children:[/*#__PURE__*/t(z,{children:/*#__PURE__*/t(a,{style:{width:24}})}),"Pay with card",E?/*#__PURE__*/t(h,{style:{marginLeft:"auto",maxWidth:"100%",width:"auto",height:"0.875rem"}}):O?/*#__PURE__*/t(f,{style:{marginLeft:"auto",maxWidth:"100%",width:"auto",height:"0.875rem"}}):null]}),R.onFundWithExchange&&/*#__PURE__*/e(w,{disabled:ee,onClick:R.onFundWithExchange,children:[/*#__PURE__*/t(z,{children:/*#__PURE__*/t(i,{style:{width:24}})}),"Transfer from an exchange"]}),R.onFundWithWallet&&/*#__PURE__*/e(w,{disabled:ee,onClick:R.onFundWithWallet,children:[/*#__PURE__*/t(z,{children:/*#__PURE__*/t(S,{style:{width:24}})}),"Transfer from wallet"]}),/*#__PURE__*/e(w,{disabled:ee,onClick:()=>j("ManualTransferScreen"),children:[/*#__PURE__*/t(z,{children:/*#__PURE__*/t(o,{style:{width:24}})}),"Receive funds"]}),A?.showAlternateFundingMethod&&R.onFundWithCard?.[1]&&/*#__PURE__*/t(p,{theme:k.appearance.palette.colorScheme,children:/*#__PURE__*/e(N,{children:["Having trouble or facing location restrictions?"," ",/*#__PURE__*/t(B,{onClick:R.onFundWithCard[1],children:"Try a different provider."})]})})]}),/*#__PURE__*/t(l,{})]})}};export{Y as FundingMethodSelectionScreen,Y as default};