@funkit/connect 1.1.5 → 1.2.0

package/dist/index.js

@@ -490,10 +490,10 @@ var WalletDecoratedIcon = () => {
 
 // src/components/FunkitProvider/FunkitConfigContext.tsx
 var DEFAULT_TEXT_CUSTOMIZATIONS = {
-  selectPaymentMethod: "Select Payment Method",
+  selectPaymentMethod: "Select Method",
   brokerageOrExchange: "Brokerage or Exchange",
   debitOrCredit: "Debit or Credit",
-  accountBalance: "Wallet Balance",
+  accountBalance: "Cross-Chain Swap",
   transferCrypto: "Transfer Crypto",
   selectAccount: "Select Account",
   payWith: "Pay With",
@@ -1401,11 +1401,11 @@ function DialogContent({
 }
 
 // src/components/FunkitProvider/GeneralWalletProvider.tsx
+import { getAllWalletTokens } from "@funkit/api-base";
 import {
   Auth,
   FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO2,
-  FunWallet,
-  getAssetsByWalletAddress
+  FunWallet
 } from "@funkit/core";
 import React18, {
   createContext as createContext8,
@@ -1605,7 +1605,11 @@ function GeneralWalletProvider({ children }) {
     if (isConnected && address) {
       try {
         setIsFetchingAssets(true);
-        const assets = await getAssetsByWalletAddress(address, "ALL");
+        const assets = await getAllWalletTokens({
+          walletAddress: address,
+          onlyVerifiedTokens: true,
+          apiKey
+        });
         const assetsCombined = Object.keys(assets).reduce(
           (acc, curChainId) => {
             const chainAssets = assets == null ? void 0 : assets[curChainId];
@@ -1895,19 +1899,22 @@ import React92, { useCallback as useCallback22, useMemo as useMemo26, useState a
 
 // src/components/FunkitProvider/FunkitCheckoutContext.tsx
 import {
-  addOwnerTxParams,
-  Chain,
-  ContractInterface,
-  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO5,
-  getAssetPriceInfoForCheckout as getAssetPriceInfoForCheckout2,
+  getAssetPriceInfo as getAssetPriceInfo2,
   getCheckoutByDepositAddress,
   getCheckoutQuote as getApiCheckoutQuote,
   getCheckoutsByRecipientAddress,
   getMoonpayBuyQuoteForCreditCard,
-  HashZero,
   initializeCheckout as postApiInitializeCheckout,
+  meshPreviewTransfer
+} from "@funkit/api-base";
+import {
+  addOwnerTxParams,
+  Chain,
+  ContractInterface,
+  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO5,
+  getDecimals,
+  HashZero,
   isAddress as isAddress2,
-  meshPreviewTransfer,
   WALLET_CONTRACT_INTERFACE
 } from "@funkit/core";
 import { estimateGas } from "@wagmi/core";
@@ -1992,13 +1999,13 @@ function generateQuoteApiErrorForDisplay(errorMessage = "") {
 }
 
 // src/utils/checkout.ts
+import { getAssetPriceInfo } from "@funkit/api-base";
 import {
   CHECKOUT_SPONSOR_SUPPORT_CHAINS,
   CheckoutState as CheckoutState2,
   CONTRACT_ADDRESSES,
   FUNKIT_CONNECT_CHECKOUT_NATIVE_CURRENCY_ADDRESS as FUNKIT_CONNECT_CHECKOUT_NATIVE_CURRENCY_ADDRESS2,
   FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO3,
-  getAssetPriceInfoForCheckout,
   getEnvOptions,
   getTokenInfo
 } from "@funkit/core";
@@ -2417,11 +2424,11 @@ async function decorateTokenList(tokensChainMap, targetChainId, apiKey) {
       let tokenUnitPriceUsd = null;
       try {
         if (erc20TokenAddress) {
-          const priceInfo = await getAssetPriceInfoForCheckout(
-            pickedChainId,
-            erc20TokenAddress,
-            apiKey
-          );
+          const priceInfo = await getAssetPriceInfo({
+            apiKey,
+            chainId: pickedChainId,
+            assetTokenAddress: erc20TokenAddress
+          });
           tokenUnitPriceUsd = (priceInfo == null ? void 0 : priceInfo.unitPrice) || null;
         }
       } catch (err) {
@@ -2613,7 +2620,7 @@ function FunkitCheckoutProvider({ children }) {
           depositAddress: historyDepositAddress,
           apiKey: funkitConfig == null ? void 0 : funkitConfig.apiKey
         });
-        newCheckoutHistoryList = [singleCheckoutHistory];
+        newCheckoutHistoryList = singleCheckoutHistory ? [singleCheckoutHistory] : [];
       }
       setCheckoutHistoryList(
         newCheckoutHistoryList.sort((a, b) => b.createdTimeMs - a.createdTimeMs)
@@ -2778,11 +2785,11 @@ function FunkitCheckoutProvider({ children }) {
   const [reDraftSymbol, triggerReDraftSymbol] = useSymbolRefresh_default();
   const _calculateAssetUsdValue = useCallback7(
     async (chainId, tokenAddress, tokenAmount) => {
-      const priceInfo = await getAssetPriceInfoForCheckout2(
+      const priceInfo = await getAssetPriceInfo2({
         chainId,
-        tokenAddress,
-        funkitConfig.apiKey
-      );
+        assetTokenAddress: tokenAddress,
+        apiKey: funkitConfig.apiKey
+      });
       if (!priceInfo) {
         throw new Error(
           "Unsupported targetAsset, please contact the team at Fun.xyz"
@@ -2868,14 +2875,30 @@ function FunkitCheckoutProvider({ children }) {
         sponsorInitialTransferGasLimit,
         newPaymentMethodInfo
       });
-      const inputCustomRecipient = checkoutItem.initSettings.config.customRecipient;
       try {
+        const toChainId = checkoutItem.initSettings.config.targetChain;
+        const toTokenAddress = checkoutItem.initSettings.config.targetAsset;
+        const fromChainId = checkoutItem.selectedSourceAssetInfo.chainId;
+        const fromTokenAddress = checkoutItem.selectedSourceAssetInfo.address;
+        const [toTokenDecimals, fromTokenDecimals] = await Promise.all([
+          getDecimals({
+            chainId: toChainId,
+            tokenAddress: toTokenAddress
+          }),
+          getDecimals({
+            chainId: fromChainId,
+            tokenAddress: fromTokenAddress
+          })
+        ]);
+        const inputCustomRecipient = checkoutItem.initSettings.config.customRecipient;
         const baseQuote = await getApiCheckoutQuote({
-          fromChainId: checkoutItem.selectedSourceAssetInfo.chainId,
-          fromTokenAddress: checkoutItem.selectedSourceAssetInfo.address,
-          toChainId: checkoutItem.initSettings.config.targetChain,
-          toTokenAddress: checkoutItem.initSettings.config.targetAsset,
+          fromChainId,
+          fromTokenAddress,
+          fromTokenDecimals,
+          toChainId,
+          toTokenAddress,
           toTokenAmount: checkoutItem.initSettings.config.targetAssetAmount,
+          toTokenDecimals,
           recipientAddr: inputCustomRecipient ? inputCustomRecipient : walletAddress,
           expirationTimestampMs: parseInt(
             checkoutItem.initSettings.config.expirationTimestampMs.toString()
@@ -2978,19 +3001,15 @@ function FunkitCheckoutProvider({ children }) {
             baseQuote.estTotalFromAmount.toString(),
             5
           );
-          const dummyPreviewTransfer = await meshPreviewTransfer(
-            meshAccessToken,
-            meshExchangeType,
-            null,
-            null,
-            meshNetworkId,
-            (_e = checkoutItem == null ? void 0 : checkoutItem.selectedSourceAssetInfo) == null ? void 0 : _e.symbol,
-            DUMMY_TRANSFER_PARAMS.toAddress,
-            amountInCrypto.toString(),
-            null,
-            null,
-            funkitConfig.apiKey
-          );
+          const dummyPreviewTransfer = await meshPreviewTransfer({
+            fromAuthToken: meshAccessToken,
+            fromType: meshExchangeType,
+            networkId: meshNetworkId,
+            symbol: (_e = checkoutItem == null ? void 0 : checkoutItem.selectedSourceAssetInfo) == null ? void 0 : _e.symbol,
+            toAddress: DUMMY_TRANSFER_PARAMS.toAddress,
+            amount: amountInCrypto.toString(),
+            apiKey: funkitConfig.apiKey
+          });
           logger.log("quote_dummyPreviewTransfer", dummyPreviewTransfer);
           networkFeesUsdBreakdown.networkFeesUsdFromMesh = dummyPreviewTransfer.previewResult.estimatedNetworkGasFee.feeInFiat;
           platformFeesUsdBreakdown.platformFeesUsdFromMesh = dummyPreviewTransfer.previewResult.institutionTransferFee.feeInFiat + dummyPreviewTransfer.previewResult.customClientFee.feeInFiat;
@@ -3375,8 +3394,8 @@ var useFunkitPostCheckoutInternal = (depositAddress) => {
           apiKey: funkitConfig.apiKey
         });
       }
-      logger.log("setupCheckoutHistory:checkoutHistory", checkoutHistory);
-      setCheckoutHistoryInfo(checkoutHistory);
+      logger.log("setupCheckoutHistory:checkoutHistory", { checkoutHistory });
+      setCheckoutHistoryInfo(checkoutHistory ? checkoutHistory : void 0);
     } catch (err) {
       logger.error("setupCheckoutHistory:error", err);
     } finally {
@@ -4523,13 +4542,13 @@ import React35, { createContext as createContext11, useCallback as useCallback10
 
 // src/utils/mesh.ts
 import {
-  FUNKIT_CONNECT_SUPPORTED_CHAINS_ID_LIST,
-  meshExecuteTransfer,
   meshGetCryptocurrencyHoldings,
   meshGetLinkToken,
   meshGetTransferIntegrations
-} from "@funkit/core";
+} from "@funkit/api-base";
+import { FUNKIT_CONNECT_SUPPORTED_CHAINS_ID_LIST } from "@funkit/core";
 var FUNKIT_MESH_CLIENT_ID = "8132aff4-56c9-4b1d-85b4-08dbdcc6199d";
+var MESH_DEFAULT_USER_ID = "meshconnectkit";
 var MeshExchanges = /* @__PURE__ */ ((MeshExchanges4) => {
   MeshExchanges4["Robinhood"] = "Robinhood";
   MeshExchanges4["ETrade"] = "ETrade";
@@ -4596,23 +4615,13 @@ var EXCHANGE_NAME_TO_TYPE = {
   ["BitfinexDirect" /* BitfinexDirect */]: "bitfinexDirect"
 };
 async function fetchMeshLinkToken(funkitUserId, selectedExchange, funApiKey) {
-  return await meshGetLinkToken(
-    funkitUserId,
-    selectedExchange,
-    true,
-    null,
-    funApiKey
-  );
-}
-async function executeBrokerageDeposit(fromAuthToken, fromType, previewId, apiKey, mfaCode) {
-  const executeTransfer = await meshExecuteTransfer(
-    fromAuthToken,
-    fromType,
-    previewId,
-    mfaCode,
-    apiKey
-  );
-  return executeTransfer;
+  return await meshGetLinkToken({
+    userId: funkitUserId,
+    integrationId: selectedExchange,
+    apiKey: funApiKey,
+    restrictMultipleAccounts: true,
+    transferOptions: null
+  });
 }
 async function fetchMeshAccountCryptoHoldings({
   authToken,
@@ -4620,14 +4629,18 @@ async function fetchMeshAccountCryptoHoldings({
   exchange
 }) {
   const type = EXCHANGE_NAME_TO_TYPE[exchange];
-  const res = await meshGetCryptocurrencyHoldings(authToken, type, apiKey);
+  const res = await meshGetCryptocurrencyHoldings({
+    authToken,
+    apiKey,
+    type
+  });
   return res.cryptocurrencyPositions;
 }
 async function fetchMeshSupportedTokensByBrokerageAndSupportedFunkitChains({
   exchange,
   apiKey
 }) {
-  const res = await meshGetTransferIntegrations(apiKey);
+  const res = await meshGetTransferIntegrations({ apiKey });
   const item = res.integrations.find(
     (item2) => item2.type === EXCHANGE_NAME_TO_TYPE[exchange]
   );
@@ -4762,7 +4775,7 @@ function useFunkitMesh({
         onConnected == null ? void 0 : onConnected(meshBrokerDataMap[brokerage]);
       } else {
         const response = await fetchMeshLinkToken(
-          "meshconnectkit",
+          MESH_DEFAULT_USER_ID,
           brokerage,
           apiKey
         );
@@ -4927,10 +4940,10 @@ var CexloIcon = () => {
 
 // src/components/Icons/Coinbase.tsx
 import React39 from "react";
-var CoinbaseIcon = () => {
+var CoinbaseIcon = ({ size = 24 }) => {
   return /* @__PURE__ */ React39.createElement("svg", {
-    width: "24",
-    height: "24",
+    width: size,
+    height: size,
     viewBox: "0 0 28 28",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
@@ -5331,6 +5344,11 @@ function useFunkitMoonpayUserIp() {
 }
 
 // src/components/FunMeshVerificationStep/FunMeshVerificationStep.tsx
+import {
+  meshExecuteTransfer,
+  MeshExecuteTransferMfaType,
+  MeshExecuteTransferStatus
+} from "@funkit/api-base";
 import React54, { useCallback as useCallback14, useEffect as useEffect14, useMemo as useMemo11, useState as useState15 } from "react";
 
 // src/components/CopyAddress/CopyAddress.tsx
@@ -5731,35 +5749,35 @@ function FunMeshVerificationStep({
           return;
         }
         logger.log("inputs", { finalOtpInput });
-        const res = await executeBrokerageDeposit(
-          accessToken,
-          EXCHANGE_NAME_TO_TYPE[exchange],
+        const res = await meshExecuteTransfer({
+          fromAuthToken: accessToken,
+          fromType: EXCHANGE_NAME_TO_TYPE[exchange],
           previewId,
-          funkitConfig == null ? void 0 : funkitConfig.apiKey,
-          finalOtpInput
-        );
-        logger.log("executeBrokerageDeposit", res);
+          mfaCode: finalOtpInput,
+          apiKey: funkitConfig.apiKey
+        });
+        logger.log("meshExecuteTransfer", res);
         setExecutionContent(res);
         switch (res == null ? void 0 : res["status"]) {
-          case "succeeded" /* succeeded */:
+          case MeshExecuteTransferStatus.succeeded:
             onSuccess == null ? void 0 : onSuccess();
             break;
-          case "mfaRequired" /* mfaRequired */:
-          case "secondMfaRequired" /* secondMfaRequired */:
+          case MeshExecuteTransferStatus.mfaRequired:
+          case MeshExecuteTransferStatus.secondMfaRequired:
             setScreen(1 /* TWO_FACTOR */);
             break;
-          case "mfaFailed" /* mfaFailed */:
+          case MeshExecuteTransferStatus.mfaFailed:
             setScreen(1 /* TWO_FACTOR */);
             setExecutionError(res.errorMessage || "");
             break;
-          case "emailConfirmationRequired" /* emailConfirmationRequired */:
-          case "deviceConfirmationRequired" /* deviceConfirmationRequired */:
+          case MeshExecuteTransferStatus.emailConfirmationRequired:
+          case MeshExecuteTransferStatus.deviceConfirmationRequired:
             setScreen(2 /* CONFIRMATION */);
             break;
-          case "addressWhitelistRequired" /* addressWhitelistRequired */:
+          case MeshExecuteTransferStatus.addressWhitelistRequired:
             setScreen(3 /* WHITELIST */);
             break;
-          case "failed" /* failed */:
+          case MeshExecuteTransferStatus.failed:
           default:
             setScreen(4 /* FAILED */);
             setExecutionError(res.errorMessage || "");
@@ -5778,35 +5796,35 @@ function FunMeshVerificationStep({
   );
   const verificationTitle = useMemo11(() => {
     switch (executionStatus) {
-      case "mfaRequired" /* mfaRequired */:
+      case MeshExecuteTransferStatus.mfaRequired:
         return "Two Factor Required";
-      case "mfaFailed" /* mfaFailed */:
+      case MeshExecuteTransferStatus.mfaFailed:
         return "Valid Two Factor Required";
-      case "secondMfaRequired" /* secondMfaRequired */:
+      case MeshExecuteTransferStatus.secondMfaRequired:
         return "Second Two Factor Required";
-      case "deviceConfirmationRequired" /* deviceConfirmationRequired */:
+      case MeshExecuteTransferStatus.deviceConfirmationRequired:
         return "Device Confirmation Required";
-      case "emailConfirmationRequired" /* emailConfirmationRequired */:
+      case MeshExecuteTransferStatus.emailConfirmationRequired:
         return "Email Confirmation Required";
-      case "addressWhitelistRequired" /* addressWhitelistRequired */:
+      case MeshExecuteTransferStatus.addressWhitelistRequired:
         return "Address Whitelisting Required";
-      case "failed" /* failed */:
+      case MeshExecuteTransferStatus.failed:
         return "An Error Occurred";
     }
   }, [executionStatus]);
   const verificationDescription = useMemo11(() => {
     switch (executionStatus) {
-      case "mfaRequired" /* mfaRequired */:
-      case "mfaFailed" /* mfaFailed */:
-      case "secondMfaRequired" /* secondMfaRequired */:
-        return `Please enter the${(executionContent == null ? void 0 : executionContent.mfaType) && (executionContent == null ? void 0 : executionContent.mfaType) !== "unspecified" /* unspecified */ ? ` ${executionContent.mfaType} ` : " "}two factor code associated with your ${exchange} account. Once done, click "Continue" below.`;
-      case "deviceConfirmationRequired" /* deviceConfirmationRequired */:
+      case MeshExecuteTransferStatus.mfaRequired:
+      case MeshExecuteTransferStatus.mfaFailed:
+      case MeshExecuteTransferStatus.secondMfaRequired:
+        return `Please enter the${(executionContent == null ? void 0 : executionContent.mfaType) && (executionContent == null ? void 0 : executionContent.mfaType) !== MeshExecuteTransferMfaType.unspecified ? ` ${executionContent.mfaType} ` : " "}two factor code associated with your ${exchange} account. Once done, click "Continue" below.`;
+      case MeshExecuteTransferStatus.deviceConfirmationRequired:
         return `Open the ${exchange} app on your mobile device and verify that you are trying to transfer crypto. Once done, click "Continue" below.`;
-      case "emailConfirmationRequired" /* emailConfirmationRequired */:
+      case MeshExecuteTransferStatus.emailConfirmationRequired:
         return `A verification email has been sent to the email address associated with your ${exchange} account. Please follow the verification instructions accordingly. Once done, click "Continue" below.`;
-      case "addressWhitelistRequired" /* addressWhitelistRequired */:
+      case MeshExecuteTransferStatus.addressWhitelistRequired:
         return `Copy the address below and whitelist it on your ${exchange} account. Once done, click "Continue" below.`;
-      case "failed" /* failed */:
+      case MeshExecuteTransferStatus.failed:
         return "An error occurred during checkout but your brokerage funds are unaffected. To retry, please go back and re-confirm a new checkout. If the error still persists, please reach out to support for help.";
     }
   }, [exchange, executionContent == null ? void 0 : executionContent.mfaType, executionStatus]);
@@ -6292,7 +6310,7 @@ function FunPaymentMeshType({
 }
 
 // src/components/FunPayments/FunPaymentMoonpayType.tsx
-import { getMoonpayUrlSignature } from "@funkit/core";
+import { getMoonpayUrlSignature } from "@funkit/api-base";
 import React60, { memo, useEffect as useEffect16, useMemo as useMemo14, useState as useState18 } from "react";
 
 // src/components/FunPayments/FunPaymentMoonpayType.css.ts
@@ -6344,11 +6362,11 @@ function FunPaymentMoonpayType({
     currencyCode
   );
   const handleGetSignature = async (url) => {
-    const res = await getMoonpayUrlSignature(
+    const res = await getMoonpayUrlSignature({
       url,
-      isSandboxMode,
-      funkitConfig == null ? void 0 : funkitConfig.apiKey
-    );
+      apiKey: funkitConfig.apiKey,
+      isSandbox: isSandboxMode
+    });
     const queryParams = new URLSearchParams(res.split("?")[1]);
     const signature = queryParams.get("signature");
     logger.log("moonpaySignatureRequested", {
@@ -6779,11 +6797,13 @@ var CombinedCreditCardOptionsIcon = () => {
 
 // src/components/FunCheckoutModal/FunCheckoutConfirmationStep.tsx
 import {
-  ERC20_ABI,
-  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO6,
   getPaymasterDataForCheckoutSponsoredTransfer,
-  isAddress as isAddress3,
   meshPreviewTransfer as meshPreviewTransfer2
+} from "@funkit/api-base";
+import {
+  ERC20_ABI,
+  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO6,
+  isAddress as isAddress3
 } from "@funkit/core";
 import React78, { useCallback as useCallback17, useMemo as useMemo19, useState as useState22 } from "react";
 import { useAccount as useAccount4, useSendTransaction, useWriteContract } from "wagmi";
@@ -6828,7 +6848,7 @@ function FunTermsAndConditionsTextButton() {
 }
 
 // src/components/FunPayments/FunPaymentMethods.tsx
-import { getAssetPriceInfoForCheckout as getAssetPriceInfoForCheckout3 } from "@funkit/core";
+import { getAssetPriceInfo as getAssetPriceInfo3 } from "@funkit/api-base";
 import React71, { useCallback as useCallback16, useEffect as useEffect17, useMemo as useMemo16, useState as useState19 } from "react";
 
 // src/components/FunPoweredTagline/FunPoweredTagline.tsx
@@ -7111,11 +7131,11 @@ function FunPaymentMethods({
   const { hasQuoteError, showQuoteNotification, quoteNotificationMessage } = useCheckoutQuoteNotification(checkoutId || "");
   const updateTargetAssetAmountForCard = useCallback16(async () => {
     if ((checkoutItem == null ? void 0 : checkoutItem.initSettings.config.targetChain) && (checkoutItem == null ? void 0 : checkoutItem.initSettings.config.targetAsset)) {
-      const info = await getAssetPriceInfoForCheckout3(
-        checkoutItem.initSettings.config.targetChain,
-        checkoutItem.initSettings.config.targetAsset,
-        apiKey
-      );
+      const info = await getAssetPriceInfo3({
+        apiKey,
+        chainId: checkoutItem.initSettings.config.targetChain,
+        assetTokenAddress: checkoutItem.initSettings.config.targetAsset
+      });
       if (info && info.unitPrice) {
         const minTargetAmount = roundUpToXDecimalPlaces(
           (MINIMUM_MOONPAY_DEPOSIT_AMOUNT_USD / info.unitPrice).toString(),
@@ -8110,22 +8130,18 @@ function FunCheckoutConfirmationStep({
       if (!((_a2 = checkoutItem == null ? void 0 : checkoutItem.selectedSourceAssetInfo) == null ? void 0 : _a2.symbol) || !((_b2 = checkoutItem == null ? void 0 : checkoutItem.latestQuote) == null ? void 0 : _b2.baseQuote.estTotalFromAmount) || !((_d2 = (_c2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _c2.meta) == null ? void 0 : _d2.checkoutMeshNetworkId)) {
         throw new Error("Invalid source asset information");
       }
-      return await meshPreviewTransfer2(
-        (_h2 = (_g2 = (_f2 = (_e2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _e2.meta) == null ? void 0 : _f2.accessToken) == null ? void 0 : _g2.accountTokens) == null ? void 0 : _h2[0].accessToken,
-        (_k2 = (_j2 = (_i2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _i2.meta) == null ? void 0 : _j2.accessToken) == null ? void 0 : _k2.brokerType,
-        null,
-        null,
-        (_m2 = (_l2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _l2.meta) == null ? void 0 : _m2.checkoutMeshNetworkId,
-        (_n2 = checkoutItem == null ? void 0 : checkoutItem.selectedSourceAssetInfo) == null ? void 0 : _n2.symbol,
-        depositAddress,
-        roundUpToXDecimalPlaces(
+      return await meshPreviewTransfer2({
+        fromAuthToken: (_h2 = (_g2 = (_f2 = (_e2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _e2.meta) == null ? void 0 : _f2.accessToken) == null ? void 0 : _g2.accountTokens) == null ? void 0 : _h2[0].accessToken,
+        fromType: (_k2 = (_j2 = (_i2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _i2.meta) == null ? void 0 : _j2.accessToken) == null ? void 0 : _k2.brokerType,
+        networkId: (_m2 = (_l2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _l2.meta) == null ? void 0 : _m2.checkoutMeshNetworkId,
+        symbol: (_n2 = checkoutItem == null ? void 0 : checkoutItem.selectedSourceAssetInfo) == null ? void 0 : _n2.symbol,
+        toAddress: depositAddress,
+        amount: roundUpToXDecimalPlaces(
           (_o = checkoutItem == null ? void 0 : checkoutItem.latestQuote) == null ? void 0 : _o.baseQuote.estTotalFromAmount.toString(),
           5
         ).toString(),
-        null,
-        null,
-        funkitConfig.apiKey
-      );
+        apiKey: funkitConfig.apiKey
+      });
     },
     [
       (_b = checkoutItem == null ? void 0 : checkoutItem.latestQuote) == null ? void 0 : _b.baseQuote.estTotalFromAmount,
@@ -8430,7 +8446,7 @@ function FunCheckoutConfirmationStep({
 }
 
 // src/components/FunCheckoutModal/FunCheckoutInputAmountStep.tsx
-import { getAssetPriceInfoForCheckout as getAssetPriceInfoForCheckout4 } from "@funkit/core";
+import { getAssetPriceInfo as getAssetPriceInfo4 } from "@funkit/api-base";
 import React80, { useCallback as useCallback18, useEffect as useEffect19, useMemo as useMemo20, useState as useState23 } from "react";
 
 // src/components/Icons/SwitchIcon.tsx
@@ -8469,14 +8485,14 @@ function FunCheckoutInputAmountStep({
   const [rotateIconAnimation, setRotateIconAnimation] = useState23(false);
   useEffect19(() => {
     const fetchPrice = async () => {
-      var _a, _b, _c, _d;
+      var _a, _b;
       try {
         if (((_b = (_a = checkoutItem == null ? void 0 : checkoutItem.initSettings) == null ? void 0 : _a.config) == null ? void 0 : _b.targetChain) && (checkoutItem == null ? void 0 : checkoutItem.initSettings.config.targetAsset)) {
-          const info = await getAssetPriceInfoForCheckout4(
-            (_d = (_c = checkoutItem == null ? void 0 : checkoutItem.initSettings) == null ? void 0 : _c.config) == null ? void 0 : _d.targetChain,
-            checkoutItem == null ? void 0 : checkoutItem.initSettings.config.targetAsset,
-            apiKey
-          );
+          const info = await getAssetPriceInfo4({
+            apiKey,
+            chainId: checkoutItem.initSettings.config.targetChain,
+            assetTokenAddress: checkoutItem.initSettings.config.targetAsset
+          });
           setErrorMessage("");
           setUnitPrice(info.unitPrice);
         }
@@ -8485,7 +8501,7 @@ function FunCheckoutInputAmountStep({
       }
     };
     fetchPrice();
-    const id = setInterval(fetchPrice, 5e3);
+    const id = setInterval(fetchPrice, 1e4);
     return () => clearInterval(id);
   }, []);
   useEffect19(() => {
@@ -8571,7 +8587,7 @@ function FunCheckoutInputAmountStep({
     inputStyle: {
       textAlign: "center",
       width: "100%",
-      paddingX: "0px",
+      padding: "14px 9px 14px 0px",
       fontWeight: active2.fontWeight.heavy,
       fontStyle: "normal",
       fontFamily: "inherit",
@@ -8757,7 +8773,7 @@ function MeshOrAccountSelectAsset({
         fetchMeshAccountCryptoHoldings({
           authToken: (_d2 = (_c2 = (_b2 = (_a2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _a2.meta) == null ? void 0 : _b2.accessToken) == null ? void 0 : _c2.accountTokens) == null ? void 0 : _d2[0].accessToken,
           exchange: (_g2 = (_f2 = (_e2 = checkoutItem == null ? void 0 : checkoutItem.selectedPaymentMethodInfo) == null ? void 0 : _e2.meta) == null ? void 0 : _f2.accessToken) == null ? void 0 : _g2.brokerName,
-          apiKey: funkitConfig == null ? void 0 : funkitConfig.apiKey
+          apiKey: funkitConfig.apiKey
         }),
         manualFetchNetworkInfo()
       ]);
@@ -9120,7 +9136,7 @@ function FunCheckoutModal({
     checkoutId || ""
   );
   const [checkoutStep, setCheckoutStep] = useState25(
-    (checkoutItem == null ? void 0 : checkoutItem.isFastForwarded) ? "confirmation" /* CONFIRMATION */ : (checkoutItem == null ? void 0 : checkoutItem.initSettings.config.targetAssetAmount) === 0 && !checkoutItem.initSettings.config.disableEditing ? "input_amount" /* INPUT_AMOUNT */ : "select_payment" /* SELECT_PAYMENT_METHOD */
+    (checkoutItem == null ? void 0 : checkoutItem.isFastForwarded) ? "confirmation" /* CONFIRMATION */ : (checkoutItem == null ? void 0 : checkoutItem.initSettings.config.disableEditing) ? "select_payment" /* SELECT_PAYMENT_METHOD */ : "input_amount" /* INPUT_AMOUNT */
   );
   useEffect21(() => {
     return () => {
@@ -9336,6 +9352,7 @@ function FunCheckoutModal({
     generateCheckoutTransferOpItems,
     getCheckoutQuote,
     isWeb2Login,
+    paymentsConfig.methodsConfig,
     textCustomizations.debitOrCredit
   ]);
   const [triggerSymbol, triggerSourceAssetConfirmedFn] = useSymbolRefresh_default();
@@ -10005,7 +10022,7 @@ function FunCheckoutHistoryDetail({
 }
 
 // src/components/FunCheckoutHistoryModal/FunCheckoutHistoryHelp.tsx
-import { sendSupportMessage } from "@funkit/core";
+import { sendSupportMessage } from "@funkit/api-base";
 import React91, { useMemo as useMemo25, useState as useState27 } from "react";
 
 // src/css/scrollStyles.css.ts
@@ -15923,7 +15940,8 @@ var defaultProps = {
   chainStatus: { largeScreen: "full", smallScreen: "icon" },
   label: "Sign In",
   showBalance: { largeScreen: true, smallScreen: false },
-  showChainSelector: true
+  showChainSelector: true,
+  suffixIcon: null
 };
 function ChainSelectorButton({
   unsupportedChain,
@@ -16067,7 +16085,8 @@ function ConnectButton({
   chainStatus = defaultProps.chainStatus,
   label = defaultProps.label,
   showBalance = defaultProps.showBalance,
-  showChainSelector = defaultProps.showChainSelector
+  showChainSelector = defaultProps.showChainSelector,
+  suffixIcon = defaultProps.suffixIcon
 }) {
   const chains = useFunkitConnectChains();
   const connectionStatus = useConnectionStatus();
@@ -16130,7 +16149,11 @@ function ConnectButton({
       testId: "connect-button",
       transition: "default",
       type: "button"
-    }, mounted && label === "Connect Wallet" ? i18n2.t("connect_wallet.label") : label));
+    }, /* @__PURE__ */ React148.createElement(Box, {
+      display: "flex",
+      gap: "8",
+      alignItems: "center"
+    }, mounted && label === "Connect Wallet" ? i18n2.t("connect_wallet.label") : label, suffixIcon)));
   }) : /* @__PURE__ */ React148.createElement(React148.Fragment, null);
 }
 ConnectButton.__defaultProps = defaultProps;
@@ -16334,10 +16357,11 @@ function getWalletConnectConnector({
 import { createConnector as createConnector2 } from "wagmi";
 import { injected } from "wagmi/connectors";
 function getExplicitInjectedProvider(flag) {
-  if (typeof window === "undefined" || typeof window.ethereum === "undefined")
+  const _window = typeof window !== "undefined" ? window : void 0;
+  if (typeof _window === "undefined" || typeof _window.ethereum === "undefined")
     return;
-  const providers = window.ethereum.providers;
-  return providers ? providers.find((provider) => provider[flag]) : window.ethereum[flag] ? window.ethereum : void 0;
+  const providers = _window.ethereum.providers;
+  return providers ? providers.find((provider) => provider[flag]) : _window.ethereum[flag] ? _window.ethereum : void 0;
 }
 function getWindowProviderNamespace(namespace) {
   const providerSearch = (provider, namespace2) => {
@@ -16367,14 +16391,15 @@ function getInjectedProvider({
   namespace
 }) {
   var _a;
-  if (typeof window === "undefined")
+  const _window = typeof window !== "undefined" ? window : void 0;
+  if (typeof _window === "undefined")
     return;
   if (namespace) {
     const windowProvider = getWindowProviderNamespace(namespace);
     if (windowProvider)
       return windowProvider;
   }
-  const providers = (_a = window.ethereum) == null ? void 0 : _a.providers;
+  const providers = (_a = _window.ethereum) == null ? void 0 : _a.providers;
   if (flag) {
     const provider = getExplicitInjectedProvider(flag);
     if (provider)
@@ -16382,7 +16407,7 @@ function getInjectedProvider({
   }
   if (typeof providers !== "undefined" && providers.length > 0)
     return providers[0];
-  return window.ethereum;
+  return _window.ethereum;
 }
 function createInjectedConnector(provider) {
   return (walletDetails) => {
@@ -16410,14 +16435,10 @@ function getInjectedConnector({
 
 // src/wallets/walletConnectors/coinbaseWallet/coinbaseWallet.ts
 import { createConnector as createConnector3 } from "wagmi";
-import { coinbaseWallet as coinbaseWagmiWallet } from "wagmi/connectors";
-var coinbaseWallet = ({
-  appName,
-  appIcon
-}) => {
-  const isCoinbaseWalletInjected = hasInjectedProvider({
-    flag: "isCoinbaseWallet"
-  });
+import {
+  coinbaseWallet as coinbaseConnector
+} from "wagmi/connectors";
+var coinbaseWallet = ({ appName, appIcon }) => {
   const getUri = (uri) => uri;
   const ios = isIOS();
   return {
@@ -16428,7 +16449,7 @@ var coinbaseWallet = ({
     iconUrl: async () => (await import("./coinbaseWallet-2OUR5TUP.js")).default,
     iconAccent: "#2c5ff6",
     iconBackground: "#2c5ff6",
-    installed: isCoinbaseWalletInjected || void 0,
+    installed: true,
     downloadUrls: {
       android: "https://play.google.com/store/apps/details?id=org.toshi",
       ios: "https://apps.apple.com/us/app/coinbase-wallet-store-crypto/id1278383455",
@@ -16484,14 +16505,17 @@ var coinbaseWallet = ({
         }
       }
     },
-    createConnector: (walletDetails) => createConnector3((config) => ({
-      ...coinbaseWagmiWallet({
+    createConnector: (walletDetails) => {
+      const connector = coinbaseConnector({
         appName,
         appLogoUrl: appIcon,
-        headlessMode: true
-      })(config),
-      ...walletDetails
-    }))
+        preference: coinbaseWallet.preference
+      });
+      return createConnector3((config) => ({
+        ...connector(config),
+        ...walletDetails
+      }));
+    }
   };
 };
 
@@ -16537,6 +16561,8 @@ function isMetaMask(ethereum) {
     return false;
   if (ethereum.isMathWallet)
     return false;
+  if (ethereum.isNestWallet)
+    return false;
   if (ethereum.isOkxWallet || ethereum.isOKExWallet)
     return false;
   if (ethereum.isOneInchIOSWallet || ethereum.isOneInchAndroidWallet)
@@ -16652,7 +16678,9 @@ var metaMaskWallet = ({
       projectId,
       walletConnectParameters
     }) : getInjectedConnector({
-      target: typeof window !== "undefined" ? (_c = (_b = (_a = window.ethereum) == null ? void 0 : _a.providers) == null ? void 0 : _b.find(isMetaMask)) != null ? _c : window.ethereum : void 0
+      target: typeof window !== "undefined" ? (_c = (_b = (_a = window.ethereum) == null ? void 0 : _a.providers) == null ? void 0 : _b.find(
+        isMetaMask
+      )) != null ? _c : window.ethereum : void 0
     })
   };
 };
@@ -16964,7 +16992,7 @@ function setFunkitConnectVersion({ version }) {
   localStorage.setItem(storageKey6, version);
 }
 function getCurrentSdkVersion() {
-  return "1.1.5";
+  return "1.2.0";
 }
 function useFingerprint() {
   const fingerprint = useCallback33(() => {
@@ -17701,6 +17729,268 @@ var __private__ = {
   MobileOptions
 };
 
+// src/components/Icons/FunkitPaymentsIconLine.tsx
+import React153 from "react";
+function MetaMaskPaymentIcon({ size = 16 }) {
+  return /* @__PURE__ */ React153.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 28 28",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /* @__PURE__ */ React153.createElement("path", {
+    d: "M24.0891 3.1199L15.3446 9.61456L16.9617 5.7828L24.0891 3.1199Z",
+    fill: "#E2761B",
+    stroke: "#E2761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M3.90207 3.1199L12.5763 9.67608L11.0383 5.7828L3.90207 3.1199Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M20.9429 18.1745L18.6139 21.7426L23.597 23.1136L25.0295 18.2536L20.9429 18.1745Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M2.97929 18.2536L4.40301 23.1136L9.38607 21.7426L7.05713 18.1745L2.97929 18.2536Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.10483 12.1456L7.71626 14.2461L12.6642 14.4658L12.4884 9.14877L9.10483 12.1456Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M18.8864 12.1456L15.4589 9.08725L15.3446 14.4658L20.2837 14.2461L18.8864 12.1456Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.38606 21.7426L12.3566 20.2925L9.79033 18.2888L9.38606 21.7426Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.6347 20.2925L18.6139 21.7426L18.2009 18.2888L15.6347 20.2925Z",
+    fill: "#E4761B",
+    stroke: "#E4761B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M18.6139 21.7426L15.6347 20.2925L15.8719 22.2348L15.8456 23.0521L18.6139 21.7426Z",
+    fill: "#D7C1B3",
+    stroke: "#D7C1B3",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.38606 21.7426L12.1544 23.0521L12.1368 22.2348L12.3566 20.2925L9.38606 21.7426Z",
+    fill: "#D7C1B3",
+    stroke: "#D7C1B3",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M12.1984 17.0056L9.72002 16.2762L11.4689 15.4765L12.1984 17.0056Z",
+    fill: "#233447",
+    stroke: "#233447",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.7928 17.0056L16.5223 15.4765L18.28 16.2762L15.7928 17.0056Z",
+    fill: "#233447",
+    stroke: "#233447",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.38606 21.7426L9.80791 18.1745L7.05712 18.2536L9.38606 21.7426Z",
+    fill: "#CD6116",
+    stroke: "#CD6116",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M18.1921 18.1745L18.6139 21.7426L20.9429 18.2536L18.1921 18.1745Z",
+    fill: "#CD6116",
+    stroke: "#CD6116",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M20.2837 14.2461L15.3446 14.4658L15.8016 17.0057L16.5311 15.4765L18.2888 16.2762L20.2837 14.2461Z",
+    fill: "#CD6116",
+    stroke: "#CD6116",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.72002 16.2762L11.4777 15.4765L12.1984 17.0057L12.6642 14.4658L7.71626 14.2461L9.72002 16.2762Z",
+    fill: "#CD6116",
+    stroke: "#CD6116",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M7.71626 14.2461L9.79033 18.2888L9.72002 16.2762L7.71626 14.2461Z",
+    fill: "#E4751F",
+    stroke: "#E4751F",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M18.2888 16.2762L18.2009 18.2888L20.2837 14.2461L18.2888 16.2762Z",
+    fill: "#E4751F",
+    stroke: "#E4751F",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M12.6642 14.4658L12.1984 17.0057L12.7784 20.0025L12.9102 16.0565L12.6642 14.4658Z",
+    fill: "#E4751F",
+    stroke: "#E4751F",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.3446 14.4658L15.1073 16.0477L15.2128 20.0025L15.8016 17.0057L15.3446 14.4658Z",
+    fill: "#E4751F",
+    stroke: "#E4751F",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.8016 17.0056L15.2128 20.0025L15.6347 20.2925L18.2009 18.2888L18.2888 16.2762L15.8016 17.0056Z",
+    fill: "#F6851B",
+    stroke: "#F6851B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.72002 16.2762L9.79033 18.2888L12.3566 20.2925L12.7784 20.0025L12.1984 17.0056L9.72002 16.2762Z",
+    fill: "#F6851B",
+    stroke: "#F6851B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.8456 23.0521L15.8719 22.2348L15.6522 22.0414H12.339L12.1368 22.2348L12.1544 23.0521L9.38606 21.7426L10.3528 22.5336L12.3126 23.8958H15.6786L17.6472 22.5336L18.6139 21.7426L15.8456 23.0521Z",
+    fill: "#C0AD9E",
+    stroke: "#C0AD9E",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.6347 20.2925L15.2128 20.0025H12.7784L12.3566 20.2925L12.1368 22.2348L12.339 22.0414H15.6522L15.8719 22.2348L15.6347 20.2925Z",
+    fill: "#161616",
+    stroke: "#161616",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M24.4583 10.0364L25.2053 6.45072L24.0891 3.1199L15.6347 9.39485L18.8864 12.1456L23.4827 13.4903L24.5022 12.3038L24.0628 11.9874L24.7658 11.3459L24.221 10.924L24.924 10.3879L24.4583 10.0364Z",
+    fill: "#763D16",
+    stroke: "#763D16",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M2.79472 6.45072L3.54174 10.0364L3.06717 10.3879L3.77024 10.924L3.23415 11.3459L3.93722 11.9874L3.4978 12.3038L4.50847 13.4903L9.10483 12.1456L12.3566 9.39485L3.90207 3.1199L2.79472 6.45072Z",
+    fill: "#763D16",
+    stroke: "#763D16",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M23.4827 13.4903L18.8864 12.1456L20.2837 14.2461L18.2009 18.2888L20.9429 18.2536H25.0295L23.4827 13.4903Z",
+    fill: "#F6851B",
+    stroke: "#F6851B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M9.10484 12.1456L4.50848 13.4903L2.97929 18.2536H7.05713L9.79033 18.2888L7.71626 14.2461L9.10484 12.1456Z",
+    fill: "#F6851B",
+    stroke: "#F6851B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M15.3446 14.4658L15.6347 9.39485L16.9705 5.7828H11.0383L12.3566 9.39485L12.6642 14.4658L12.7696 16.0653L12.7784 20.0025H15.2128L15.2304 16.0653L15.3446 14.4658Z",
+    fill: "#F6851B",
+    stroke: "#F6851B",
+    strokeWidth: "0.0878845",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+}
+function MastercardPaymentIcon({ size = 16 }) {
+  return /* @__PURE__ */ React153.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    height: size,
+    viewBox: "0 0 152.407 108"
+  }, /* @__PURE__ */ React153.createElement("g", null, /* @__PURE__ */ React153.createElement("rect", {
+    width: "152.407",
+    height: "108",
+    fill: "transparent"
+  }), /* @__PURE__ */ React153.createElement("g", null, /* @__PURE__ */ React153.createElement("rect", {
+    x: "60.4117",
+    y: "25.6968",
+    width: "31.5",
+    height: "56.6064",
+    fill: "#ff5f00"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M382.20839,306a35.9375,35.9375,0,0,1,13.7499-28.3032,36,36,0,1,0,0,56.6064A35.938,35.938,0,0,1,382.20839,306Z",
+    transform: "translate(-319.79649 -252)",
+    fill: "#eb001b"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M454.20349,306a35.99867,35.99867,0,0,1-58.2452,28.3032,36.00518,36.00518,0,0,0,0-56.6064A35.99867,35.99867,0,0,1,454.20349,306Z",
+    transform: "translate(-319.79649 -252)",
+    fill: "#f79e1b"
+  }), /* @__PURE__ */ React153.createElement("path", {
+    d: "M450.76889,328.3077v-1.1589h.4673v-.2361h-1.1901v.2361h.4675v1.1589Zm2.3105,0v-1.3973h-.3648l-.41959.9611-.41971-.9611h-.365v1.3973h.2576v-1.054l.3935.9087h.2671l.39351-.911v1.0563Z",
+    transform: "translate(-319.79649 -252)",
+    fill: "#f79e1b"
+  }))));
+}
+function FunkitPaymentsIconLine({
+  size = 16,
+  gap = "2"
+}) {
+  return /* @__PURE__ */ React153.createElement(Box, {
+    display: "flex",
+    flexDirection: "row",
+    gap,
+    alignItems: "center",
+    justifyContent: "center"
+  }, /* @__PURE__ */ React153.createElement(MetaMaskPaymentIcon, {
+    size
+  }), /* @__PURE__ */ React153.createElement(MastercardPaymentIcon, {
+    size
+  }), /* @__PURE__ */ React153.createElement(CoinbaseIcon, {
+    size
+  }));
+}
+
 // src/transactions/useAddRecentTransaction.ts
 import { useCallback as useCallback36 } from "react";
 import { useAccount as useAccount17 } from "wagmi";
@@ -17721,6 +18011,7 @@ function useAddRecentTransaction() {
 export {
   ConnectButton,
   FunkitConnectAuthenticationProvider,
+  FunkitPaymentsIconLine,
   FunkitProvider,
   FunkitSocialLoginMethod,
   NATIVE_TOKEN,