@funkit/connect 5.5.0 → 5.5.1

package/dist/index.js

@@ -1,10 +1,10 @@
 "use client";
-import {
-  darkTheme
-} from "./chunk-ICCAQZHZ.js";
 import {
   lightTheme
 } from "./chunk-RN4I4Y57.js";
+import {
+  darkTheme
+} from "./chunk-ICCAQZHZ.js";
 import {
   systemFontStack
 } from "./chunk-R2UFCJL7.js";
@@ -400,7 +400,7 @@ function Avatar({ address, imageUrl, loading, size }) {
 }
 
 // src/components/ConnectButton/ConnectButton.tsx
-import React257, { useEffect as useEffect50, useState as useState70 } from "react";
+import React258, { useEffect as useEffect50, useState as useState70 } from "react";
 
 // src/css/touchableStyles.css.ts
 var active = { shrink: "_7rkubb8", shrinkSm: "_7rkubb9" };
@@ -504,7 +504,7 @@ import PrivyJS, {
   getUserEmbeddedWallet,
   LocalStorage
 } from "@privy-io/js-sdk-core";
-import React254, {
+import React255, {
   createContext as createContext18,
   useCallback as useCallback47,
   useContext as useContext18,
@@ -744,6 +744,9 @@ var DEFAULT_TEXT_CUSTOMIZATIONS = {
   sourceMethodTitle: "Your source",
   tokensListTitle: "Your tokens",
   transferTokens: "Transfer Crypto",
+  receiveDropdownTitle: "",
+  // Default to empty
+  receiveDropdownLabel: "Asset to Receive",
   confirmationScreen: {
     payAmountLabel: "You send",
     receiveAmountLabel: "You receive"
@@ -1023,7 +1026,7 @@ var useFunkitConnectChainsById = () => groupChainsById(useFunkitConnectChains())
 var useInitialChainId = () => useContext4(FunkitConnectChainContext).initialChainId;
 
 // src/providers/ModalContext.tsx
-import React253, {
+import React254, {
   createContext as createContext17,
   useCallback as useCallback46,
   useContext as useContext17,
@@ -1046,7 +1049,7 @@ var topbarFadeWrapper = "_1r8f578";
 var topbarOverflowContent = "_1r8f577 _1rsrm2fd1 _1rsrm2fds";
 
 // src/modals/AccountModal/AccountModal.tsx
-import React237 from "react";
+import React238 from "react";
 
 // src/components/Dialog/Dialog.tsx
 import { isMobile as isMobile2, isSafari } from "@funkit/utils";
@@ -3207,6 +3210,8 @@ var flagConfig = {
               "0x2A8Bd916E85d98d8175258De99fc0ddbcC102eF6",
               "0xda6b07Eb94f699F511a943e9bFC12B64B7fe3486",
               "0x0D6e43CA32545B3dc2FE6f93AafBD7e640F548d4",
+              "0x236c60C57a8B9ca563Fb0dA5199FDdCB686d91E8",
+              // greg
               "0x70126A66Ea0f76220Af513365Fea7Db89191aF85",
               // issa PM
               "0x8723E50B5d47714F599Ba02Ee3Db4F5aaF61f9Ad",
@@ -3228,6 +3233,18 @@ var flagConfig = {
             values: [DEV_API_KEY2]
           }
         ],
+        if_all: [
+          {
+            key: "userId",
+            type: "pctRollout",
+            pct: 10
+          },
+          {
+            key: "apiKey",
+            type: "isAnyOf",
+            values: [POLYMARKET_API_KEY2]
+          }
+        ],
         value: true
       }
     ]
@@ -3859,9 +3876,7 @@ import {
 import { polygon as polygon2 } from "viem/chains";
 
 // src/hooks/useCheckoutDirectExecution.ts
-import {
-  DirectExecutionType
-} from "@funkit/api-base";
+import { DirectExecutionType } from "@funkit/api-base";
 import { executeRelayQuote, getRelayQuote } from "@funkit/fun-relay";
 import { isTokenEquivalent } from "@funkit/utils";
 import { useCallback as useCallback4 } from "react";
@@ -6514,10 +6529,10 @@ var useActivityTraversal = () => {
 };
 
 // src/modals/ProfileDetails/ProfileDetails.tsx
-import React236, { useCallback as useCallback43, useState as useState63 } from "react";
+import React237, { useCallback as useCallback43, useState as useState63 } from "react";
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryContent.tsx
-import React225 from "react";
+import React226 from "react";
 
 // src/hooks/useDirectExecutionInfoPolling.ts
 import {
@@ -6957,7 +6972,7 @@ function getCheckoutCompletionTime(checkout) {
 }
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryDetail.tsx
-import React219, { useCallback as useCallback40, useMemo as useMemo39, useState as useState57 } from "react";
+import React220, { useCallback as useCallback40, useMemo as useMemo39, useState as useState57 } from "react";
 import { createPortal as createPortal14 } from "react-dom";
 
 // src/components/HelpAlert/HelpAlert.tsx
@@ -7834,7 +7849,7 @@ import {
   formatSecondsToReadableForm as formatSecondsToReadableForm4,
   formatTimestamp
 } from "@funkit/utils";
-import React217, { useState as useState56, useRef as useRef18 } from "react";
+import React218, { useState as useState56, useRef as useRef18 } from "react";
 
 // src/components/FunSkeletonLoader/FunSkeletonBlock.tsx
 import React66 from "react";
@@ -8261,10 +8276,10 @@ var TransactionRedirectButton = ({
 
 // src/components/FunTransactionSummary/PaymentRouteSummary.tsx
 import { formatAddress as formatAddress5 } from "@funkit/utils";
-import React216 from "react";
+import React217 from "react";
 
 // src/hooks/usePaymentMethodIcon.tsx
-import React215 from "react";
+import React216 from "react";
 import { useAccount as useAccount5 } from "wagmi";
 
 // src/components/FunPayments/FunPaymentMethods.tsx
@@ -10617,7 +10632,7 @@ var BankIconActive = ({ size = 20 }) => {
 
 // src/components/FunConnectOptions/FunSignInStep.tsx
 import { groupBy, isMobile as isMobile8, isSafari as isSafari3, redirectInMobile as redirectInMobile2 } from "@funkit/utils";
-import React212, { Fragment as Fragment3, useCallback as useCallback39, useMemo as useMemo37, useState as useState55 } from "react";
+import React213, { Fragment as Fragment3, useCallback as useCallback39, useMemo as useMemo37, useState as useState55 } from "react";
 
 // src/providers/walletConnectDeepLink.ts
 var storageKey2 = "WALLETCONNECT_DEEPLINK_CHOICE";
@@ -11214,7 +11229,7 @@ var SocialsIcon = () => {
 };
 
 // src/components/FunConnectOptions/FunConnectOptions.tsx
-import React211, { useCallback as useCallback38, useMemo as useMemo36, useState as useState54 } from "react";
+import React212, { useCallback as useCallback38, useMemo as useMemo36, useState as useState54 } from "react";
 
 // src/hooks/useAnimatedNavigation.ts
 import { useCallback as useCallback16, useState as useState17 } from "react";
@@ -11275,8 +11290,8 @@ function useAnimatedNavigation(callback) {
 }
 
 // src/components/FunCheckoutModalHeightAnimationWrapper/FunCheckoutModalHeightAnimationWrapper.tsx
-import { motion as motion9 } from "motion/react";
-import React204, { useEffect as useEffect39, useRef as useRef17, useState as useState52 } from "react";
+import { motion as motion10 } from "motion/react";
+import React205, { useEffect as useEffect39, useRef as useRef17, useState as useState52 } from "react";
 
 // src/modals/CheckoutModal/stepTransition.ts
 import {
@@ -11373,9 +11388,7 @@ function generateQuoteApiErrorForDisplay(err) {
 }
 
 // src/domains/quote.ts
-import {
-  getCheckoutQuote as getApiCheckoutQuote
-} from "@funkit/api-base";
+import { getCheckoutQuote as getApiCheckoutQuote } from "@funkit/api-base";
 
 // src/domains/fees.ts
 import {
@@ -11385,7 +11398,9 @@ import {
   meshConfigureTransferProxy
 } from "@funkit/api-base";
 import { FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO13 } from "@funkit/chains";
-import { roundUpToXDecimalPlaces as roundUpToXDecimalPlaces2 } from "@funkit/utils";
+import {
+  roundUpToXDecimalPlaces as roundUpToXDecimalPlaces2
+} from "@funkit/utils";
 import { estimateGas, getGasPrice } from "@wagmi/core";
 import { encodeFunctionData, erc20Abi as erc20Abi2, formatEther } from "viem";
 import { zkSync } from "viem/zksync";
@@ -15892,7 +15907,7 @@ function ConfirmationStep({
   const isStepLoading = isInitialQuoting || isContinuing || isRefreshing;
   const uiCustomizations = funkitConfig.uiCustomizations?.confirmationScreen;
   const customRecipient = checkoutItem?.initSettings.config.customRecipient;
-  return /* @__PURE__ */ React132.createElement(Box, null, /* @__PURE__ */ React132.createElement(
+  return /* @__PURE__ */ React132.createElement(Box, { id: "confirmation-page" }, /* @__PURE__ */ React132.createElement(
     Box,
     {
       display: "flex",
@@ -16339,11 +16354,10 @@ import React141 from "react";
 // src/consts/meld.ts
 var getMeldProviderIconUrl = (provider) => `https://sdk-cdn.fun.xyz/images/meld/${provider.toLowerCase()}.svg`;
 var getCurrencySymbol = (currencyCode) => {
-  const formatter = new Intl.NumberFormat(void 0, {
+  const formatter = new Intl.NumberFormat("en-US", {
     style: "currency",
     currency: currencyCode,
-    minimumFractionDigits: 0,
-    maximumFractionDigits: 0
+    currencyDisplay: "narrowSymbol"
   });
   return formatter.formatToParts(1).find(({ type }) => type === "currency")?.value ?? currencyCode;
 };
@@ -16352,8 +16366,32 @@ var getCurrencySymbol = (currencyCode) => {
 var providerLabelMap = {
   COINBASEPAY: "Coinbase Pay",
   STRIPE: "Stripe",
-  TOPPER: "Topper"
-  //extend as needed
+  TOPPER: "Topper",
+  PAYPAL: "PayPal",
+  ALCHEMYPAY: "Alchemy Pay",
+  UNLIMIT: "Unlimit",
+  BANXA: "Banxa",
+  BILIRA: "BiLira",
+  BINANCECONNECT: "Binance Connect",
+  BLOCKCHAINDOTCOM: "Blockchain.com",
+  BTCDIRECT: "BTC Direct",
+  FONBNK: "Fonbnk",
+  GUARDARIAN: "Guardarian",
+  KOYWE: "Koywe",
+  MESH: "Mesh",
+  MESO: "Meso",
+  ONMETA: "Onmeta",
+  ONRAMPMONEY: "Onramp Money",
+  PAYBIS: "Paybis",
+  RAMP: "Ramp",
+  ROBINHOOD: "Robinhood",
+  SARDINE: "Sardine",
+  SHIFT4: "Shift4",
+  SIMPLEX: "Simplex",
+  SKRILLCRYPTO: "Skrill",
+  TRANSAK: "Transak",
+  TRANSFI: "TransFi",
+  YELLOWCARD: "Yellow Card"
 };
 var MeldQuoteItem = ({
   quote,
@@ -16405,7 +16443,7 @@ var MeldQuoteItem = ({
         alt: quote.serviceProvider,
         borderRadius: "full"
       }
-    )), /* @__PURE__ */ React141.createElement(Text, { weight: "medium", size: "12", style: { whiteSpace: "nowrap" } }, providerLabelMap[quote.serviceProvider]), badge && /* @__PURE__ */ React141.createElement(
+    )), /* @__PURE__ */ React141.createElement(Text, { weight: "medium", size: "12", style: { whiteSpace: "nowrap" } }, providerLabelMap[quote.serviceProvider] ?? quote.serviceProvider), badge && /* @__PURE__ */ React141.createElement(
       FunBadge,
       {
         background: "approvedBadgeBackground",
@@ -16435,7 +16473,8 @@ var SourceMeldQuoteItem = ({
   isLoading,
   isBestQuote,
   isPreselected,
-  disabled
+  disabled,
+  error
 }) => {
   return /* @__PURE__ */ React142.createElement(
     FunOptionBox,
@@ -16451,7 +16490,7 @@ var SourceMeldQuoteItem = ({
       disabled: disabled || isLoading || !quote
     },
     /* @__PURE__ */ React142.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React142.createElement(Text, { size: "12", weight: "medium" }, "Provider"), isPreselected && /* @__PURE__ */ React142.createElement(Text, { color: "secondaryText", size: "12", weight: "medium" }, "Best rate auto-picked")),
-    /* @__PURE__ */ React142.createElement(Box, { display: "flex", alignItems: "center", gap: "12" }, /* @__PURE__ */ React142.createElement(Box, { display: "flex", alignItems: "center", gap: "6" }, isLoading ? /* @__PURE__ */ React142.createElement(React142.Fragment, null, /* @__PURE__ */ React142.createElement(FunSkeletonCircle, { size: "32" }), /* @__PURE__ */ React142.createElement(FunSkeletonBlock, { width: "36", height: "14" })) : quote ? /* @__PURE__ */ React142.createElement(React142.Fragment, null, /* @__PURE__ */ React142.createElement(
+    /* @__PURE__ */ React142.createElement(Box, { display: "flex", alignItems: "center", gap: "12" }, /* @__PURE__ */ React142.createElement(Box, { display: "flex", alignItems: "center", gap: "6" }, error ? /* @__PURE__ */ React142.createElement(Text, { size: "12", color: "secondaryText", weight: "medium" }, error) : isLoading ? /* @__PURE__ */ React142.createElement(React142.Fragment, null, /* @__PURE__ */ React142.createElement(FunSkeletonCircle, { size: "32" }), /* @__PURE__ */ React142.createElement(FunSkeletonBlock, { width: "36", height: "14" })) : quote ? /* @__PURE__ */ React142.createElement(React142.Fragment, null, /* @__PURE__ */ React142.createElement(
       AsyncImage,
       {
         width: "32",
@@ -17276,24 +17315,38 @@ var useMeldLimitError = (amount, fiatCurrency) => {
     () => data?.find((lim) => lim.currencyCode === fiatCurrency),
     [data, fiatCurrency]
   );
-  if (!meldLimit) return "";
+  if (!meldLimit) return void 0;
   if (amount < meldLimit.minimumAmount) {
     const limit = formatCurrencyAndStringify6(
       meldLimit.minimumAmount ?? 0,
       {},
-      { currency: fiatCurrency, minimumFractionDigits: 0 }
+      {
+        currency: fiatCurrency,
+        currencyDisplay: "narrowSymbol",
+        minimumFractionDigits: 0
+      }
     );
-    return `Amount below minimum ${limit}.`;
+    return {
+      issue: "Amount below minimum",
+      suggestion: `Input an amount greater than ${limit}.`
+    };
   }
   if (amount > meldLimit.maximumAmount) {
     const limit = formatCurrencyAndStringify6(
       meldLimit.maximumAmount ?? 0,
       {},
-      { currency: fiatCurrency, minimumFractionDigits: 0 }
+      {
+        currency: fiatCurrency,
+        currencyDisplay: "narrowSymbol",
+        minimumFractionDigits: 0
+      }
     );
-    return `Amount above maximum ${limit}`;
+    return {
+      issue: "Amount above maximum",
+      suggestion: `Input an amount lower than ${limit}.`
+    };
   }
-  return "";
+  return void 0;
 };
 
 // src/components/Icons/SwitchIcon.tsx
@@ -17363,7 +17416,12 @@ var useMeldLink = (sourceAmount, sourceCurrencyCode = "USD") => {
   const { apiKey } = useFunkitConfig();
   const { userIpInfo } = useFunkitUserIp();
   const destinationCurrencyCode = useMeldCryptoCurrencyCode();
+  const { checkoutItem } = useCheckoutContext();
   const { walletAddress } = useGeneralWallet();
+  const recipient = checkoutItem?.initSettings.config.customRecipient || walletAddress;
+  if (!recipient) {
+    throw new Error("Recipient is required for Meld link");
+  }
   const mutation = useMutation({
     mutationFn: (serviceProvider) => startMeldSession({
       apiKey,
@@ -17372,7 +17430,7 @@ var useMeldLink = (sourceAmount, sourceCurrencyCode = "USD") => {
         countryCode: userIpInfo?.alpha2 ?? "",
         destinationCurrencyCode,
         sourceCurrencyCode,
-        walletAddress,
+        walletAddress: recipient,
         sourceAmount: `${sourceAmount}`
       }
     })
@@ -17607,7 +17665,11 @@ var QuickOptions = ({
     !percentMode ? formatCurrencyAndStringify7(
       option,
       {},
-      { minimumFractionDigits: 0, currency }
+      {
+        minimumFractionDigits: 0,
+        currency,
+        currencyDisplay: "narrowSymbol"
+      }
     ) : option === 100 ? "Max" : `${option}%`
   ));
 };
@@ -17698,14 +17760,9 @@ function reduceState(state, action) {
     case "setInputValue": {
       const { inputValue: rawInputValue, unitPrice, fiatCurrency } = action;
       const currencySymbol = getCurrencySymbol(fiatCurrency);
-      const decimals = state.isInputInUsd ? USD_DECIMALS : ASSET_DECIMALS;
-      const escapedPrefix = currencySymbol === "$" ? "\\$" : currencySymbol;
-      const regex = new RegExp(
-        `^${state.isInputInUsd ? `(${escapedPrefix})?` : ""}(\\d*(\\.\\d{0,${decimals}})?)`
-      );
-      const match = rawInputValue.match(regex);
-      if (!match) return state;
-      const numericInputValue = state.isInputInUsd ? match[2] : match[1];
+      const regex = state.isInputInUsd ? /\d+(\.\d{0,2})?/ : /\d+(\.\d{0,5})?/;
+      const match = regex.exec(rawInputValue);
+      const numericInputValue = match?.[0] || "";
       const newInputValue = numericInputValue && state.isInputInUsd ? `${currencySymbol}${numericInputValue}` : numericInputValue;
       if (newInputValue === state.inputValue) return state;
       const newInputAmount = Number.parseFloat(numericInputValue) || 0;
@@ -17842,7 +17899,11 @@ function useAmountInput(options) {
     onChange,
     toggleInputInUsd,
     setUsdAmount,
-    placeholder: state.isInputInUsd ? formatCurrencyAndStringify8(0, {}, { currency: fiatCurrency }) : formatCryptoAndStringify3(0),
+    placeholder: state.isInputInUsd ? formatCurrencyAndStringify8(
+      0,
+      {},
+      { currency: fiatCurrency, currencyDisplay: "narrowSymbol" }
+    ) : formatCryptoAndStringify3(0),
     suggestion: getInputAmountSuggestion(derivedState.inputError)
   };
 }
@@ -17932,8 +17993,8 @@ function InputAmountLoaded({
       }
       if (meldLimitError) {
         return {
-          message: meldLimitError,
-          type: "error"
+          message: meldLimitError.suggestion,
+          type: "hint"
         };
       }
       if (meldQuotesQuery.error) {
@@ -17994,7 +18055,7 @@ function InputAmountLoaded({
       actionButtonProps: {
         title: suggestion?.buttonLabel ?? "Continue",
         onClick: handleSubmit,
-        isDisabled: !isValid && !suggestion || error?.type === "error" || isMeldLinkPending || meldQuotesQuery.isFetching || isCardCheckout && isSelectedQuoteUnavailable,
+        isDisabled: !isValid && !suggestion || error?.type === "error" || !!meldLimitError || isMeldLinkPending || meldQuotesQuery.isFetching || isCardCheckout && isSelectedQuoteUnavailable,
         isLoading: isMeldLinkPending
       },
       fiatCurrencySelector: meldEnabled && /* @__PURE__ */ React150.createElement(
@@ -18104,7 +18165,8 @@ function InputAmountLoaded({
           isLoading: meldQuotesQuery.isPending,
           isBestQuote: selectedQuote?.serviceProvider === bestRateQuote?.serviceProvider,
           disabled: !meldQuotesQuery.data || meldQuotesQuery.data.length === 0,
-          isPreselected: !manuallySelectedQuote && !!bestRateQuote
+          isPreselected: !manuallySelectedQuote && !!bestRateQuote,
+          error: meldLimitError?.issue
         }
       ) : /* @__PURE__ */ React150.createElement(
         YouPayYouReceiveWrapper,
@@ -20137,7 +20199,7 @@ function BaseDropdown({
     setIsOpened(true);
     onOpen?.();
   };
-  return /* @__PURE__ */ React177.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, label && /* @__PURE__ */ React177.createElement(Text, { size: "12" }, label), /* @__PURE__ */ React177.createElement(FunClickOutside, { onClick: isOpened ? closeDropdown : noop6 }, /* @__PURE__ */ React177.createElement(
+  return /* @__PURE__ */ React177.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, label && /* @__PURE__ */ React177.createElement(Text, { size: "12", color: "secondaryText" }, label), /* @__PURE__ */ React177.createElement(FunClickOutside, { onClick: isOpened ? closeDropdown : noop6 }, /* @__PURE__ */ React177.createElement(
     Box,
     {
       position: "relative",
@@ -20441,7 +20503,7 @@ var getTokenIconUrl = (symbol, tokens) => {
 };
 
 // src/components/Dropdown/ReceiveTokenDropdown.tsx
-var TOKEN_ICON_SIZE = 16;
+var TOKEN_ICON_SIZE = "16";
 var aprTag = (badgeText) => /* @__PURE__ */ React180.createElement(
   FunBadge,
   {
@@ -20456,7 +20518,8 @@ var ReceiveTokenDropdown = ({
   chainId,
   selectedToken,
   onTokenSelected,
-  label = "Receive"
+  label,
+  activeItemLabel
 }) => {
   const allTokens = Array.from(new Set(Object.values(tokens).flat()));
   const tokenBadgeText = tokens.find(
@@ -20472,20 +20535,20 @@ var ReceiveTokenDropdown = ({
     BaseDropdown_default,
     {
       horizontalIconGap: "8",
+      label,
       openToTopOnMobile: false,
       activeItemProps: {
         iconComponent: selectedToken && /* @__PURE__ */ React180.createElement(
-          AsyncImage,
+          FunAssetAvatar,
           {
-            alt: selectedToken,
-            borderRadius: "full",
-            height: TOKEN_ICON_SIZE,
-            width: TOKEN_ICON_SIZE,
-            src: getTokenIconUrl(selectedToken, tokens),
-            fallbackSrc: FALLBACK_ASSET
+            assetIconSize: TOKEN_ICON_SIZE,
+            assetName: selectedToken,
+            assetSrc: getTokenIconUrl(selectedToken, tokens),
+            chainId,
+            largeChainIcon: true
           }
         ),
-        alwaysVisibleLabel: label,
+        alwaysVisibleLabel: activeItemLabel,
         tagComponent: tokenBadgeText ? aprTag(tokenBadgeText) : void 0
       },
       value: selectedToken ?? "",
@@ -20507,7 +20570,7 @@ var ReceiveTokenDropdown = ({
             iconComponent: /* @__PURE__ */ React180.createElement(
               FunAssetAvatar,
               {
-                assetIconSize: `${TOKEN_ICON_SIZE}`,
+                assetIconSize: TOKEN_ICON_SIZE,
                 assetName: "receive-token-asset",
                 assetSrc: iconUrl,
                 chainId,
@@ -20847,7 +20910,8 @@ function MeshOrAccountSelectAsset({
       /* @__PURE__ */ React182.createElement(
         ReceiveTokenDropdown,
         {
-          label: "Asset to Receive",
+          label: textCustomizations.receiveDropdownTitle,
+          activeItemLabel: textCustomizations.receiveDropdownLabel,
           tokens: candidates,
           chainId: Number(checkoutConfig.targetChain),
           selectedToken: selectedTargetAsset?.tokenSymbol,
@@ -22733,10 +22797,64 @@ function TransferToken({
 }
 
 // src/modals/CheckoutModal/VirtualFiatAccount/FiatAccountDetail.tsx
-import React202, { useState as useState49 } from "react";
+import React203, { useState as useState49 } from "react";
 
-// src/components/FunInputButton/FunInputButton.tsx
+// src/components/Tabs/Tabs.tsx
+import { motion as motion9 } from "motion/react";
 import React200 from "react";
+
+// src/components/Tabs/tabs.css.ts
+var activeTabStyle = "eghi2t1 _1rsrm2fjf _1rsrm2ft";
+
+// src/components/Tabs/Tabs.tsx
+var Tabs = ({ tabs: tabs3, activeTab, onTabChange }) => {
+  return /* @__PURE__ */ React200.createElement(
+    Box,
+    {
+      display: "flex",
+      background: "offBackground",
+      borderRadius: "actionButton",
+      gap: "2",
+      padding: "2"
+    },
+    tabs3.map((tab, index) => {
+      const isSelected = index === activeTab;
+      return /* @__PURE__ */ React200.createElement(
+        Box,
+        {
+          key: tab.value,
+          as: "button",
+          type: "button",
+          paddingX: "12",
+          paddingY: "6",
+          position: "relative",
+          onClick: isSelected ? void 0 : () => onTabChange(index),
+          style: { flex: 1 },
+          color: isSelected ? "primaryText" : {
+            base: "secondaryText",
+            hover: "primaryText",
+            focusedVisible: "primaryText"
+          }
+        },
+        isSelected && /* @__PURE__ */ React200.createElement(
+          motion9.div,
+          {
+            layoutId: "highlight",
+            className: activeTabStyle,
+            transition: { duration: 0.2, ease: [0.17, 0, 0.01, 1] }
+          }
+        ),
+        /* @__PURE__ */ React200.createElement(Box, { position: "relative", style: { zIndex: 1, textAlign: "center" } }, /* @__PURE__ */ React200.createElement(Text, { color: "inherit", weight: "medium", size: "12" }, tab.label))
+      );
+    })
+  );
+};
+
+// src/components/VirtualFiatAccount/AccountDetailsTab/AccountDetailsTab.tsx
+import React202 from "react";
+
+// src/components/FunInputButton/FunInputButton.tsx
+import React201 from "react";
 var HIDE_TOOLTIP_MS = 2e3;
 var FunInputButton = ({
   text,
@@ -22747,7 +22865,7 @@ var FunInputButton = ({
 }) => {
   const { isCopied, handleCopy } = useCopyToClipboard(text, HIDE_TOOLTIP_MS);
   if (!isCopyable) {
-    return /* @__PURE__ */ React200.createElement(
+    return /* @__PURE__ */ React201.createElement(
       FunOptionBox,
       {
         width: "full",
@@ -22766,10 +22884,10 @@ var FunInputButton = ({
           hover: "heavyStroke"
         }
       },
-      /* @__PURE__ */ React200.createElement(Box, { display: "flex", gap: "8", flexDirection: "column" }, label && /* @__PURE__ */ React200.createElement(Text, { size: "10", color: "secondaryText" }, label), /* @__PURE__ */ React200.createElement(Text, { weight: "medium", size: "12" }, text))
+      /* @__PURE__ */ React201.createElement(Box, { display: "flex", gap: "8", flexDirection: "column" }, label && /* @__PURE__ */ React201.createElement(Text, { size: "10", color: "secondaryText" }, label), /* @__PURE__ */ React201.createElement(Text, { weight: "medium", size: "12" }, text))
     );
   }
-  return /* @__PURE__ */ React200.createElement(
+  return /* @__PURE__ */ React201.createElement(
     FunTooltip,
     {
       width: "full",
@@ -22777,7 +22895,7 @@ var FunInputButton = ({
       displayType: "click",
       hideDelay: HIDE_TOOLTIP_MS
     },
-    /* @__PURE__ */ React200.createElement(
+    /* @__PURE__ */ React201.createElement(
       FunOptionBox,
       {
         width: "full",
@@ -22797,46 +22915,93 @@ var FunInputButton = ({
           hover: "heavyStroke"
         }
       },
-      /* @__PURE__ */ React200.createElement(Box, { display: "flex", gap: "8", flexDirection: "column" }, label && /* @__PURE__ */ React200.createElement(Text, { size: "10", color: "secondaryText" }, label), /* @__PURE__ */ React200.createElement(Text, { weight: "medium", size: "12" }, text)),
-      /* @__PURE__ */ React200.createElement(Box, { display: "flex", alignItems: "center", color: "primaryText" }, isCopied ? /* @__PURE__ */ React200.createElement(CheckCircleIcon, null) : /* @__PURE__ */ React200.createElement(CopyDoubleRoundedSquareIcon, null))
+      /* @__PURE__ */ React201.createElement(Box, { display: "flex", gap: "8", flexDirection: "column" }, label && /* @__PURE__ */ React201.createElement(Text, { size: "10", color: "secondaryText" }, label), /* @__PURE__ */ React201.createElement(Text, { weight: "medium", size: "12" }, text)),
+      /* @__PURE__ */ React201.createElement(Box, { display: "flex", alignItems: "center", color: "primaryText" }, isCopied ? /* @__PURE__ */ React201.createElement(CheckCircleIcon, null) : /* @__PURE__ */ React201.createElement(CopyDoubleRoundedSquareIcon, null))
     )
   );
 };
 
-// src/components/Tabs/Tabs.tsx
-import React201 from "react";
-var Tabs = ({ tabs: tabs3, activeTab, onTabChange }) => {
-  return /* @__PURE__ */ React201.createElement(
+// src/components/VirtualFiatAccount/AccountDetailsTab/AccountDetailsTab.tsx
+var AccountDetailsTab = ({
+  account,
+  detailsExpanded,
+  handleToggleDetails
+}) => /* @__PURE__ */ React202.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, account.bank_account_number ? /* @__PURE__ */ React202.createElement(
+  FunInputButton,
+  {
+    label: "Account number",
+    text: account.bank_account_number
+  }
+) : null, account.bank_routing_number ? /* @__PURE__ */ React202.createElement(
+  FunInputButton,
+  {
+    label: "Routing number",
+    text: account.bank_routing_number
+  }
+) : null, account.iban ? /* @__PURE__ */ React202.createElement(FunInputButton, { label: "IBAN", text: account.iban }) : null, account.bic ? /* @__PURE__ */ React202.createElement(FunInputButton, { label: "SWIFT / BIC", text: account.bic }) : null, account.account_holder_name ? /* @__PURE__ */ React202.createElement(
+  FunInputButton,
+  {
+    label: "Account holder name",
+    text: account.account_holder_name
+  }
+) : null, account.bank_beneficiary_name ? /* @__PURE__ */ React202.createElement(
+  FunInputButton,
+  {
+    label: "Beneficiary name",
+    text: account.bank_beneficiary_name
+  }
+) : null, detailsExpanded && /* @__PURE__ */ React202.createElement(React202.Fragment, null, /* @__PURE__ */ React202.createElement(FunInputButton, { label: "Bank name", text: account.bank_name }), /* @__PURE__ */ React202.createElement(FunInputButton, { label: "Bank address", text: account.bank_address }), /* @__PURE__ */ React202.createElement(
+  FunInputButton,
+  {
+    label: "Currency",
+    text: String(account.currency).toUpperCase(),
+    isCopyable: false
+  }
+)), /* @__PURE__ */ React202.createElement(
+  Box,
+  {
+    width: "full",
+    as: "button",
+    display: "flex",
+    gap: "4",
+    alignItems: "center",
+    justifyContent: "center",
+    paddingY: "8",
+    paddingX: "24",
+    onClick: handleToggleDetails,
+    borderRadius: "connectButton",
+    borderStyle: "solid",
+    borderWidth: "1",
+    borderColor: {
+      base: "mediumStroke",
+      hover: "heavyStroke"
+    }
+  },
+  /* @__PURE__ */ React202.createElement(Text, { size: "13" }, detailsExpanded ? "See less" : "More details"),
+  /* @__PURE__ */ React202.createElement(
     Box,
     {
+      width: "16",
+      height: "16",
       display: "flex",
-      background: "offBackground",
-      borderRadius: "actionButton",
-      gap: "2",
-      padding: "2"
+      alignItems: "center",
+      justifyContent: "center"
     },
-    tabs3.map((tab) => /* @__PURE__ */ React201.createElement(
+    /* @__PURE__ */ React202.createElement(
       Box,
       {
-        key: tab.value,
-        as: "button",
-        type: "button",
-        background: activeTab === tab.value ? "modalBackground" : "offBackground",
-        paddingX: "12",
-        paddingY: "6",
-        borderRadius: "actionButtonInner",
-        onClick: () => onTabChange(tab.value),
-        style: { flex: 1, textAlign: "center" },
-        color: activeTab === tab.value ? "primaryText" : {
-          base: "secondaryText",
-          hover: "primaryText",
-          focusedVisible: "primaryText"
-        }
+        color: "secondaryText",
+        width: "8",
+        height: "8",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        style: detailsExpanded ? { transform: "rotate(180deg)" } : void 0
       },
-      /* @__PURE__ */ React201.createElement(Text, { color: "inherit", weight: "medium", size: "12" }, tab.label)
-    ))
-  );
-};
+      /* @__PURE__ */ React202.createElement(CaretDownIcon, null)
+    )
+  )
+));
 
 // src/modals/CheckoutModal/VirtualFiatAccount/FiatAccountDetail.tsx
 var tabs = [
@@ -22851,13 +23016,14 @@ var AccountDetailsScreen = ({
   const { matchingFiatAccount } = paymentMethodInfo;
   const label = usePaymentMethodInfoLabel(paymentMethodInfo);
   const { appName } = useFunkitConfig();
-  const [activeTab, setActiveTab] = useState49(tabs[0].value);
+  const { animation, animate } = useAnimatedNavigation(void 0);
+  const [activeTab, setActiveTab] = useState49(0);
   const [detailsExpanded, setDetailsExpanded] = useState49(false);
-  const handleToggleDetails = () => {
-    setDetailsExpanded((prev) => !prev);
-  };
   const { source_deposit_instructions: sourceDeposit } = matchingFiatAccount;
-  return /* @__PURE__ */ React202.createElement(
+  const handleTabChange = (index) => {
+    animate(() => setActiveTab(index), { reverse: index < activeTab });
+  };
+  return /* @__PURE__ */ React203.createElement(
     Box,
     {
       id: "fiat-detail-page",
@@ -22865,7 +23031,7 @@ var AccountDetailsScreen = ({
       flexDirection: "column",
       gap: "16"
     },
-    /* @__PURE__ */ React202.createElement(
+    /* @__PURE__ */ React203.createElement(
       SourcePaymentMethodItem,
       {
         onClick: () => onNext({}),
@@ -22874,101 +23040,21 @@ var AccountDetailsScreen = ({
         keyIcon: label.icon
       }
     ),
-    /* @__PURE__ */ React202.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React202.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React202.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React202.createElement(Text, null, "Your virtual fiat account details"), /* @__PURE__ */ React202.createElement(Text, { size: "12" }, "Use these details to transfer EUR. Funds arrive in 1\u20132 days to your ", appName, " account.")), /* @__PURE__ */ React202.createElement(
+    /* @__PURE__ */ React203.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React203.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React203.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, /* @__PURE__ */ React203.createElement(Text, null, "Your virtual fiat account details"), /* @__PURE__ */ React203.createElement(Text, { size: "12" }, "Use these details to transfer EUR. Funds arrive in 1\u20132 days to your ", appName, " account.")), /* @__PURE__ */ React203.createElement(
       Tabs,
       {
         tabs,
         activeTab,
-        onTabChange: (tab) => setActiveTab(tab)
-      }
-    )), activeTab === "details" ? /* @__PURE__ */ React202.createElement(Box, { display: "flex", flexDirection: "column", gap: "8" }, sourceDeposit.bank_account_number ? /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Account number",
-        text: sourceDeposit.bank_account_number
+        onTabChange: handleTabChange
       }
-    ) : null, sourceDeposit.bank_routing_number ? /* @__PURE__ */ React202.createElement(
-      FunInputButton,
+    )), /* @__PURE__ */ React203.createElement(Box, { className: getContentAnimation(animation) }, tabs[activeTab].value === "details" ? /* @__PURE__ */ React203.createElement(
+      AccountDetailsTab,
       {
-        label: "Routing number",
-        text: sourceDeposit.bank_routing_number
+        account: sourceDeposit,
+        detailsExpanded,
+        handleToggleDetails: () => setDetailsExpanded((prev) => !prev)
       }
-    ) : null, sourceDeposit.iban ? /* @__PURE__ */ React202.createElement(FunInputButton, { label: "IBAN", text: sourceDeposit.iban }) : null, sourceDeposit.bic ? /* @__PURE__ */ React202.createElement(FunInputButton, { label: "SWIFT / BIC", text: sourceDeposit.bic }) : null, sourceDeposit.account_holder_name ? /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Account holder name",
-        text: sourceDeposit.account_holder_name
-      }
-    ) : null, sourceDeposit.bank_beneficiary_name ? /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Beneficiary name",
-        text: sourceDeposit.bank_beneficiary_name
-      }
-    ) : null, detailsExpanded && /* @__PURE__ */ React202.createElement(React202.Fragment, null, /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Bank name",
-        text: sourceDeposit.bank_name
-      }
-    ), /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Bank address",
-        text: sourceDeposit.bank_address
-      }
-    ), /* @__PURE__ */ React202.createElement(
-      FunInputButton,
-      {
-        label: "Currency",
-        text: String(sourceDeposit.currency).toUpperCase(),
-        isCopyable: false
-      }
-    )), /* @__PURE__ */ React202.createElement(
-      Box,
-      {
-        width: "full",
-        as: "button",
-        display: "flex",
-        gap: "4",
-        alignItems: "center",
-        justifyContent: "center",
-        paddingY: "8",
-        paddingX: "24",
-        onClick: handleToggleDetails,
-        borderRadius: "connectButton",
-        borderStyle: "solid",
-        borderWidth: "1",
-        borderColor: {
-          base: "mediumStroke",
-          hover: "heavyStroke"
-        }
-      },
-      /* @__PURE__ */ React202.createElement(Text, { size: "13" }, detailsExpanded ? "See less" : "More details"),
-      /* @__PURE__ */ React202.createElement(
-        Box,
-        {
-          width: "16",
-          height: "16",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center"
-        },
-        /* @__PURE__ */ React202.createElement(
-          Box,
-          {
-            color: "secondaryText",
-            width: "8",
-            height: "8",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            style: detailsExpanded ? { transform: "rotate(180deg)" } : void 0
-          },
-          /* @__PURE__ */ React202.createElement(CaretDownIcon, null)
-        )
-      )
-    )) : /* @__PURE__ */ React202.createElement(
+    ) : /* @__PURE__ */ React203.createElement(
       FunFeatureList,
       {
         gapBetweenItems: "8",
@@ -22982,7 +23068,7 @@ var AccountDetailsScreen = ({
               "Gas fee: < $5.00",
               "Banks fees may also apply"
             ],
-            icon: /* @__PURE__ */ React202.createElement(DollarIcon, null)
+            icon: /* @__PURE__ */ React203.createElement(DollarIcon, null)
           },
           {
             text: "Limits",
@@ -22990,16 +23076,16 @@ var AccountDetailsScreen = ({
               "Minimum amount: 25 EUR",
               "Maximum amount: 20,000,000 EUR"
             ],
-            icon: /* @__PURE__ */ React202.createElement(DollarIcon, null)
+            icon: /* @__PURE__ */ React203.createElement(DollarIcon, null)
           },
           {
             text: "Processing time",
             value: [FIAT_PROCESSING_TIME],
-            icon: /* @__PURE__ */ React202.createElement(SpeedometerIcon, null)
+            icon: /* @__PURE__ */ React203.createElement(SpeedometerIcon, null)
           }
         ]
       }
-    ))
+    )))
   );
 };
 var FiatAccountDetail = {
@@ -23018,7 +23104,7 @@ var FiatAccountDetail = {
 
 // src/modals/CheckoutModal/VirtualFiatAccount/KycIframe.tsx
 import { BridgeCustomerStatus as BridgeCustomerStatus7 } from "@funkit/api-base";
-import React203, { useCallback as useCallback34, useEffect as useEffect38, useMemo as useMemo35, useState as useState50 } from "react";
+import React204, { useCallback as useCallback34, useEffect as useEffect38, useMemo as useMemo35, useState as useState50 } from "react";
 function useIframeListener(listeners) {
   const handleMessage = useCallback34(
     (event) => {
@@ -23094,7 +23180,7 @@ function KycIframe({
   );
   const loading = isLinkLoading || iframeLoading;
   useIframeListener(listeners);
-  return /* @__PURE__ */ React203.createElement(
+  return /* @__PURE__ */ React204.createElement(
     Dialog,
     {
       onClose: onBack,
@@ -23103,13 +23189,13 @@ function KycIframe({
       withoutInternalPadding: !loading,
       withTransition: false
     },
-    loading && /* @__PURE__ */ React203.createElement(React203.Fragment, null, /* @__PURE__ */ React203.createElement(
+    loading && /* @__PURE__ */ React204.createElement(React204.Fragment, null, /* @__PURE__ */ React204.createElement(
       Dialog.Title,
       {
         onClose: onBack,
         title: textCustomizations.virtualFiat
       }
-    ), /* @__PURE__ */ React203.createElement(
+    ), /* @__PURE__ */ React204.createElement(
       VerifyAccountScreen,
       {
         customerStatus: BridgeCustomerStatus7.NOT_STARTED,
@@ -23117,7 +23203,7 @@ function KycIframe({
         withActionButton: false
       }
     )),
-    /* @__PURE__ */ React203.createElement(
+    /* @__PURE__ */ React204.createElement(
       Dialog.Content,
       {
         display: "flex",
@@ -23129,7 +23215,7 @@ function KycIframe({
         fullHeight: !loading,
         withoutInternalPadding: !loading
       },
-      kycLink && /* @__PURE__ */ React203.createElement(
+      kycLink && /* @__PURE__ */ React204.createElement(
         "iframe",
         {
           src: kycLink,
@@ -23144,7 +23230,7 @@ function KycIframe({
         }
       )
     ),
-    loading && /* @__PURE__ */ React203.createElement(Dialog.BottomSection, null, /* @__PURE__ */ React203.createElement(
+    loading && /* @__PURE__ */ React204.createElement(Dialog.BottomSection, null, /* @__PURE__ */ React204.createElement(
       Dialog.BottomBar,
       {
         actionButtonProps: {
@@ -23311,7 +23397,7 @@ function useTitleConfig(checkoutItem, state) {
   return {
     disableBack: isOstiumCustomer(apiKey) && state.step === "select_asset" /* SELECT_ASSET */ ? false : disableBack ?? false,
     hideClose: hideClose ?? false,
-    showFullHeight: showFullHeight ?? (isVertexCustomer(apiKey) && state.step === "select_asset" /* SELECT_ASSET */),
+    showFullHeight: showFullHeight ?? ((isVertexCustomer(apiKey) || isKatanaCustomer(apiKey)) && state.step === "select_asset" /* SELECT_ASSET */),
     title: title?.(textCustomizations) ?? baseTitle
   };
 }
@@ -23320,7 +23406,8 @@ function useTitleConfig(checkoutItem, state) {
 var DEFAULT_HEIGHT = 525;
 var mapHeightToCheckoutStep = {
   ["transfer_token" /* TRANSFER_TOKEN */]: 825,
-  ["fiat_account_detail" /* FIAT_ACCOUNT_DETAIL */]: 825
+  ["fiat_account_detail" /* FIAT_ACCOUNT_DETAIL */]: 825,
+  ["confirmation" /* CONFIRMATION */]: 825
 };
 function FunCheckoutModalHeightAnimationWrapper({
   children,
@@ -23351,8 +23438,8 @@ function FunCheckoutModalHeightAnimationWrapper({
     }
   }, [checkoutStep]);
   const permittedHeight = checkoutStep ? mapHeightToCheckoutStep[checkoutStep] ?? DEFAULT_HEIGHT : DEFAULT_HEIGHT;
-  return /* @__PURE__ */ React204.createElement(
-    motion9.div,
+  return /* @__PURE__ */ React205.createElement(
+    motion10.div,
     {
       style: { height },
       animate: { height },
@@ -23361,7 +23448,7 @@ function FunCheckoutModalHeightAnimationWrapper({
       },
       transition: { duration: 0.15, ease: [0.33, 1, 0.68, 1] }
     },
-    /* @__PURE__ */ React204.createElement(
+    /* @__PURE__ */ React205.createElement(
       "div",
       {
         ref: containerRef,
@@ -23377,7 +23464,7 @@ function FunCheckoutModalHeightAnimationWrapper({
 }
 
 // src/components/FunConnectOptions/FunConnectResultStep.tsx
-import React205, { useEffect as useEffect40 } from "react";
+import React206, { useEffect as useEffect40 } from "react";
 var AUTO_CLOSE = 2e3;
 var messageMap = (hasQrCode) => ({
   error: {
@@ -23403,7 +23490,7 @@ var FunConnectResultStep = ({
   }, [onClose, hasAutoclose]);
   const hasQrCode = wallet?.qrCode && qrCodeUri;
   const message = messageMap(!!hasQrCode)[type];
-  return /* @__PURE__ */ React205.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React205.createElement(Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: "12" }, hasQrCode && type === "error" ? /* @__PURE__ */ React205.createElement(
+  return /* @__PURE__ */ React206.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React206.createElement(Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: "12" }, hasQrCode && type === "error" ? /* @__PURE__ */ React206.createElement(
     Box,
     {
       alignItems: "center",
@@ -23412,7 +23499,7 @@ var FunConnectResultStep = ({
       justifyContent: "center",
       flexDirection: "column"
     },
-    /* @__PURE__ */ React205.createElement(
+    /* @__PURE__ */ React206.createElement(
       QRCode,
       {
         logoBackground: wallet.iconBackground,
@@ -23422,7 +23509,7 @@ var FunConnectResultStep = ({
         uri: qrCodeUri
       }
     )
-  ) : /* @__PURE__ */ React205.createElement(
+  ) : /* @__PURE__ */ React206.createElement(
     Box,
     {
       padding: "30",
@@ -23431,7 +23518,7 @@ var FunConnectResultStep = ({
       borderStyle: "solid",
       borderColor: type === "success" ? "buttonSuccess" : "buttonWarning"
     },
-    wallet && /* @__PURE__ */ React205.createElement(Box, { style: { width: 40, height: 40 } }, /* @__PURE__ */ React205.createElement(
+    wallet && /* @__PURE__ */ React206.createElement(Box, { style: { width: 40, height: 40 } }, /* @__PURE__ */ React206.createElement(
       AsyncImage,
       {
         background: wallet.iconBackground,
@@ -23441,12 +23528,12 @@ var FunConnectResultStep = ({
         height: 40
       }
     ))
-  ), /* @__PURE__ */ React205.createElement(FunMessage, { title: message.title, description: message.description })));
+  ), /* @__PURE__ */ React206.createElement(FunMessage, { title: message.title, description: message.description })));
 };
 
 // src/components/FunConnectOptions/FunFarcasterConnectingStep.tsx
 import { isMobile as isMobile7, isSafari as isSafari2, redirectInMobile } from "@funkit/utils";
-import React206, { useCallback as useCallback36, useEffect as useEffect41 } from "react";
+import React207, { useCallback as useCallback36, useEffect as useEffect41 } from "react";
 function FunFarcasterConnectingStep({
   farcasterUri,
   farcasterToken
@@ -23463,7 +23550,7 @@ function FunFarcasterConnectingStep({
     return (await import("./farcaster-MF6WINBA.js")).default;
   }, []);
   const promptText = mobile ? "To sign in with Farcaster, please open the Warpcast app." : "Scan this QR code or open the link with your mobile phone.";
-  return /* @__PURE__ */ React206.createElement(
+  return /* @__PURE__ */ React207.createElement(
     Box,
     {
       alignItems: "center",
@@ -23472,8 +23559,8 @@ function FunFarcasterConnectingStep({
       justifyContent: "center",
       gap: "12"
     },
-    mobile ? null : /* @__PURE__ */ React206.createElement(QRCode, { logoSize: 60, logoUrl: svgUrl, size: 318, uri: farcasterUri }),
-    /* @__PURE__ */ React206.createElement(
+    mobile ? null : /* @__PURE__ */ React207.createElement(QRCode, { logoSize: 60, logoUrl: svgUrl, size: 318, uri: farcasterUri }),
+    /* @__PURE__ */ React207.createElement(
       Box,
       {
         display: "flex",
@@ -23481,7 +23568,7 @@ function FunFarcasterConnectingStep({
         gap: "12",
         style: { width: 318 }
       },
-      /* @__PURE__ */ React206.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center", gap: "4" }, mobile ? /* @__PURE__ */ React206.createElement(
+      /* @__PURE__ */ React207.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center", gap: "4" }, mobile ? /* @__PURE__ */ React207.createElement(
         FunLinkButton,
         {
           onClick: () => {
@@ -23490,8 +23577,8 @@ function FunFarcasterConnectingStep({
           text: "Open Warpcast",
           size: "14"
         }
-      ) : /* @__PURE__ */ React206.createElement(Box, { paddingRight: "8" }, /* @__PURE__ */ React206.createElement(Text, { size: "14" }, "Warpcast Link")), mobile ? null : /* @__PURE__ */ React206.createElement(OldCopyAddressButton, { address: farcasterUri }), /* @__PURE__ */ React206.createElement(FunRedirectButton, { to: farcasterUri, size: "32" })),
-      /* @__PURE__ */ React206.createElement(
+      ) : /* @__PURE__ */ React207.createElement(Box, { paddingRight: "8" }, /* @__PURE__ */ React207.createElement(Text, { size: "14" }, "Warpcast Link")), mobile ? null : /* @__PURE__ */ React207.createElement(OldCopyAddressButton, { address: farcasterUri }), /* @__PURE__ */ React207.createElement(FunRedirectButton, { to: farcasterUri, size: "32" })),
+      /* @__PURE__ */ React207.createElement(
         Text,
         {
           size: "13",
@@ -23507,12 +23594,12 @@ function FunFarcasterConnectingStep({
 
 // src/components/FunConnectOptions/FunWeb2ConnectingStep.tsx
 import { isNotNullish as isNotNullish10 } from "@funkit/utils";
-import React208, { useCallback as useCallback37, useEffect as useEffect42, useState as useState53 } from "react";
+import React209, { useCallback as useCallback37, useEffect as useEffect42, useState as useState53 } from "react";
 
 // src/components/Icons/MailIcon.tsx
-import React207 from "react";
+import React208 from "react";
 var MailIcon = ({ width = 39 }) => {
-  return /* @__PURE__ */ React207.createElement(
+  return /* @__PURE__ */ React208.createElement(
     "svg",
     {
       width,
@@ -23520,7 +23607,7 @@ var MailIcon = ({ width = 39 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React207.createElement(
+    /* @__PURE__ */ React208.createElement(
       "path",
       {
         d: "M5.78438 27.4531C4.10729 27.4531 2.83125 27.0208 1.95625 26.1562C1.09167 25.2917 0.659378 24.0312 0.659378 22.375V5.09375C0.659378 3.42708 1.07604 2.16667 1.90938 1.3125C2.74271 0.447917 3.90417 0.015625 5.39375 0.015625H33.7844C35.4719 0.015625 36.7479 0.447917 37.6125 1.3125C38.4875 2.16667 38.925 3.42708 38.925 5.09375V22.375C38.925 24.0312 38.5083 25.2917 37.675 26.1562C36.8417 27.0208 35.6802 27.4531 34.1906 27.4531H5.78438ZM5.78438 24.5625H33.7844C34.5031 24.5625 35.0604 24.3698 35.4563 23.9844C35.8521 23.599 36.05 23.0365 36.05 22.2969V5.17188C36.05 4.43229 35.8521 3.86979 35.4563 3.48438C35.0604 3.09896 34.5031 2.90625 33.7844 2.90625H5.78438C5.06563 2.90625 4.50834 3.09896 4.1125 3.48438C3.72709 3.86979 3.53438 4.42708 3.53438 5.15625V22.2812C3.53438 23.0312 3.72709 23.599 4.1125 23.9844C4.50834 24.3698 5.06563 24.5625 5.78438 24.5625ZM19.7844 18C19.2531 18 18.7375 17.901 18.2375 17.7031C17.7479 17.5052 17.2635 17.1875 16.7844 16.75L2.175 3.60938L4.05 1.71875L18.3781 14.6406C18.826 15.0469 19.2948 15.25 19.7844 15.25C20.274 15.25 20.7427 15.0469 21.1906 14.6406L35.5188 1.71875L37.3938 3.60938L22.7844 16.75C22.3052 17.1875 21.8156 17.5052 21.3156 17.7031C20.826 17.901 20.3156 18 19.7844 18ZM4.31563 25.2031L2.44063 23.3125L13.4875 12.2656L15.3625 14.125L4.31563 25.2031ZM35.2844 25.2188L24.2063 14.125L26.0969 12.2656L37.1594 23.3281L35.2844 25.2188Z",
@@ -23560,14 +23647,14 @@ var FunWeb2ConnectingStep = ({
     },
     [handleFunkitWeb2Login, initialChainId, emailInput]
   );
-  return /* @__PURE__ */ React208.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React208.createElement(
+  return /* @__PURE__ */ React209.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React209.createElement(
     FunMessage,
     {
       title: "Enter confirmation code",
       description: `Please check ${emailInput} for an email from ${AUTH_PROVIDER} and enter your code below.`,
-      icon: /* @__PURE__ */ React208.createElement(MailIcon, null)
+      icon: /* @__PURE__ */ React209.createElement(MailIcon, null)
     }
-  ), /* @__PURE__ */ React208.createElement(
+  ), /* @__PURE__ */ React209.createElement(
     FunTwoFaInput,
     {
       value: otpInput,
@@ -23583,7 +23670,7 @@ var FunWeb2ConnectingStep = ({
       onResend: () => handleSendOtpEmail(emailInput),
       hasResent: isSendingOtpEmail
     }
-  ), /* @__PURE__ */ React208.createElement(
+  ), /* @__PURE__ */ React209.createElement(
     FunButton,
     {
       isDisabled: true,
@@ -23594,10 +23681,10 @@ var FunWeb2ConnectingStep = ({
 };
 
 // src/components/FunConnectOptions/FunWeb3ConnectingStep.tsx
-import React210 from "react";
+import React211 from "react";
 
 // src/components/GradientLoader/GradientLoader.tsx
-import React209 from "react";
+import React210 from "react";
 
 // src/components/GradientLoader/GradientLoader.css.ts
 var loader = "m17uwo1";
@@ -23607,7 +23694,7 @@ var GradientLoader = ({
   height = "100",
   width = "100"
 }) => {
-  return /* @__PURE__ */ React209.createElement(
+  return /* @__PURE__ */ React210.createElement(
     Box,
     {
       className: loader,
@@ -23625,7 +23712,7 @@ var FunWeb3ConnectingStep = ({ selectedWallet, qrCodeUri }) => {
   if (!selectedWallet) return null;
   const { iconBackground, iconUrl, name, qrCode, ready } = selectedWallet;
   const hasQrCode = qrCode && qrCodeUri;
-  const waitingMessage = /* @__PURE__ */ React210.createElement(
+  const waitingMessage = /* @__PURE__ */ React211.createElement(
     FunMessage,
     {
       title: `Waiting for ${hasQrCode ? "connection" : name}`,
@@ -23633,7 +23720,7 @@ var FunWeb3ConnectingStep = ({ selectedWallet, qrCodeUri }) => {
       id: "link-text"
     }
   );
-  return /* @__PURE__ */ React210.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, hasQrCode ? /* @__PURE__ */ React210.createElement(
+  return /* @__PURE__ */ React211.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, hasQrCode ? /* @__PURE__ */ React211.createElement(
     Box,
     {
       alignItems: "center",
@@ -23643,7 +23730,7 @@ var FunWeb3ConnectingStep = ({ selectedWallet, qrCodeUri }) => {
       gap: "12",
       flexDirection: "column"
     },
-    /* @__PURE__ */ React210.createElement(
+    /* @__PURE__ */ React211.createElement(
       QRCode,
       {
         logoBackground: iconBackground,
@@ -23654,7 +23741,7 @@ var FunWeb3ConnectingStep = ({ selectedWallet, qrCodeUri }) => {
       }
     ),
     waitingMessage
-  ) : /* @__PURE__ */ React210.createElement(
+  ) : /* @__PURE__ */ React211.createElement(
     Box,
     {
       alignItems: "center",
@@ -23663,7 +23750,7 @@ var FunWeb3ConnectingStep = ({ selectedWallet, qrCodeUri }) => {
       flexDirection: "column",
       gap: "12"
     },
-    ready && /* @__PURE__ */ React210.createElement(React210.Fragment, null, /* @__PURE__ */ React210.createElement(Box, { id: "link-graphics", padding: "30", position: "relative" }, /* @__PURE__ */ React210.createElement(Box, { position: "absolute", style: { top: 0, left: 0 } }, /* @__PURE__ */ React210.createElement(GradientLoader, null)), /* @__PURE__ */ React210.createElement(Box, { style: { width: 40, height: 40 } }, /* @__PURE__ */ React210.createElement(
+    ready && /* @__PURE__ */ React211.createElement(React211.Fragment, null, /* @__PURE__ */ React211.createElement(Box, { id: "link-graphics", padding: "30", position: "relative" }, /* @__PURE__ */ React211.createElement(Box, { position: "absolute", style: { top: 0, left: 0 } }, /* @__PURE__ */ React211.createElement(GradientLoader, null)), /* @__PURE__ */ React211.createElement(Box, { style: { width: 40, height: 40 } }, /* @__PURE__ */ React211.createElement(
       AsyncImage,
       {
         background: iconBackground,
@@ -23788,7 +23875,7 @@ function FunConnectOptions({
     switch (step) {
       case 0 /* SIGNIN_PRIMARY */:
       case 1 /* SIGNIN_SECONDARY */:
-        return /* @__PURE__ */ React211.createElement(
+        return /* @__PURE__ */ React212.createElement(
           FunSignInStep,
           {
             signInStep: step,
@@ -23808,7 +23895,7 @@ function FunConnectOptions({
           }
         );
       case 3 /* PENDING_WALLET */:
-        return /* @__PURE__ */ React211.createElement(
+        return /* @__PURE__ */ React212.createElement(
           FunWeb3ConnectingStep,
           {
             selectedWallet,
@@ -23816,9 +23903,9 @@ function FunConnectOptions({
           }
         );
       case 2 /* PENDING_EMAIL */:
-        return /* @__PURE__ */ React211.createElement(FunWeb2ConnectingStep, { emailInput });
+        return /* @__PURE__ */ React212.createElement(FunWeb2ConnectingStep, { emailInput });
       case 4 /* PENDING_FARCASTER */:
-        return /* @__PURE__ */ React211.createElement(
+        return /* @__PURE__ */ React212.createElement(
           FunFarcasterConnectingStep,
           {
             farcasterUri,
@@ -23826,7 +23913,7 @@ function FunConnectOptions({
           }
         );
       case 5 /* ERROR_WEB3 */:
-        return /* @__PURE__ */ React211.createElement(
+        return /* @__PURE__ */ React212.createElement(
           FunConnectResultStep,
           {
             onClose,
@@ -23848,7 +23935,7 @@ function FunConnectOptions({
     step,
     walletsOnly
   ]);
-  return /* @__PURE__ */ React211.createElement(FunCheckoutModalHeightAnimationWrapper, null, /* @__PURE__ */ React211.createElement(Dialog.Title, { onClose, ...navigationConfig[step] }), /* @__PURE__ */ React211.createElement(
+  return /* @__PURE__ */ React212.createElement(FunCheckoutModalHeightAnimationWrapper, null, /* @__PURE__ */ React212.createElement(Dialog.Title, { onClose, ...navigationConfig[step] }), /* @__PURE__ */ React212.createElement(
     Dialog.Content,
     {
       display: "flex",
@@ -23860,7 +23947,7 @@ function FunConnectOptions({
       withBottomDivider: actionConfig[step] ? "always" : "never"
     },
     stepComponent
-  ), /* @__PURE__ */ React211.createElement(Dialog.BottomSection, null, actionConfig[step] && /* @__PURE__ */ React211.createElement(Dialog.BottomBar, { ...actionConfig[step] })));
+  ), /* @__PURE__ */ React212.createElement(Dialog.BottomSection, null, actionConfig[step] && /* @__PURE__ */ React212.createElement(Dialog.BottomBar, { ...actionConfig[step] })));
 }
 
 // src/components/FunConnectOptions/FunSignInStep.tsx
@@ -23868,25 +23955,25 @@ var FULL_SOCIAL_LOGIN_OPTIONS = [
   {
     funkitKey: "google_oauth" /* GOOGLE */,
     provider: "google",
-    getIcon: (size) => /* @__PURE__ */ React212.createElement(GoogleIcon, { size }),
+    getIcon: (size) => /* @__PURE__ */ React213.createElement(GoogleIcon, { size }),
     name: "Google"
   },
   {
     funkitKey: "twitter_oauth" /* TWITTER */,
     provider: "twitter",
-    getIcon: (size) => /* @__PURE__ */ React212.createElement(TwitterIcon, { size }),
+    getIcon: (size) => /* @__PURE__ */ React213.createElement(TwitterIcon, { size }),
     name: "Twitter"
   },
   {
     funkitKey: "apple_oauth" /* APPLE */,
     provider: "apple",
-    getIcon: (size) => /* @__PURE__ */ React212.createElement(AppleIcon, { size }),
+    getIcon: (size) => /* @__PURE__ */ React213.createElement(AppleIcon, { size }),
     name: "Apple"
   },
   {
     funkitKey: "farcaster" /* FARCASTER */,
     provider: "farcaster",
-    getIcon: (size) => /* @__PURE__ */ React212.createElement(FarcasterIcon, { size }),
+    getIcon: (size) => /* @__PURE__ */ React213.createElement(FarcasterIcon, { size }),
     name: "Farcaster"
   }
 ];
@@ -24033,14 +24120,14 @@ function FunSignInStep({
     changeStep(1 /* SIGNIN_SECONDARY */);
   };
   const makeWeb2LoginSection = (isCollapsed) => {
-    return isCollapsed ? /* @__PURE__ */ React212.createElement(
+    return isCollapsed ? /* @__PURE__ */ React213.createElement(
       FunSignInButton,
       {
         title: `Log in with email${hasAnySocialEnabled ? " or socials" : ""}`,
         onClick: () => handleSectionSelect("web2"),
-        titlePrefix: /* @__PURE__ */ React212.createElement(SocialsIcon, null)
+        titlePrefix: /* @__PURE__ */ React213.createElement(SocialsIcon, null)
       }
-    ) : /* @__PURE__ */ React212.createElement(Box, { display: "flex", gap: "12", flexDirection: "column" }, /* @__PURE__ */ React212.createElement(
+    ) : /* @__PURE__ */ React213.createElement(Box, { display: "flex", gap: "12", flexDirection: "column" }, /* @__PURE__ */ React213.createElement(
       FunInput,
       {
         placeholder: "Enter your email",
@@ -24051,7 +24138,7 @@ function FunSignInStep({
           setEmailError(void 0);
         },
         onKeySubmit: handleEmailSubmit,
-        suffix: /* @__PURE__ */ React212.createElement(
+        suffix: /* @__PURE__ */ React213.createElement(
           FunButton,
           {
             type: "tertiary",
@@ -24063,7 +24150,7 @@ function FunSignInStep({
           }
         )
       }
-    ), !!hasAnySocialEnabled && /* @__PURE__ */ React212.createElement(React212.Fragment, null, signInStep === 1 /* SIGNIN_SECONDARY */ && /* @__PURE__ */ React212.createElement(
+    ), !!hasAnySocialEnabled && /* @__PURE__ */ React213.createElement(React213.Fragment, null, signInStep === 1 /* SIGNIN_SECONDARY */ && /* @__PURE__ */ React213.createElement(
       FunDivider,
       {
         label: "or",
@@ -24071,7 +24158,7 @@ function FunSignInStep({
         marginBottom: "12",
         borderColor: "selectedOptionBorder"
       }
-    ), /* @__PURE__ */ React212.createElement(
+    ), /* @__PURE__ */ React213.createElement(
       FunSocials,
       {
         options: enabledSocialItems,
@@ -24083,15 +24170,15 @@ function FunSignInStep({
   const isWeb2SectionCollapsed = canOpenSecondaryStep && prioritizedLoginType === "web3";
   const Web2LoginSection = loginConfig.web2 ? makeWeb2LoginSection(isWeb2SectionCollapsed) : null;
   const makeWeb3LoginSection = (isCollapsed) => {
-    return isCollapsed ? /* @__PURE__ */ React212.createElement(
+    return isCollapsed ? /* @__PURE__ */ React213.createElement(
       FunSignInButton,
       {
         title: "Connect wallet",
-        titlePrefix: /* @__PURE__ */ React212.createElement(CryptoIcon, null),
+        titlePrefix: /* @__PURE__ */ React213.createElement(CryptoIcon, null),
         onClick: () => handleSectionSelect("web3")
       }
-    ) : /* @__PURE__ */ React212.createElement(Box, { display: "flex", flexDirection: "column", gap: "10" }, funWeb3ConnectWallets.map((wallet) => {
-      return /* @__PURE__ */ React212.createElement(
+    ) : /* @__PURE__ */ React213.createElement(Box, { display: "flex", flexDirection: "column", gap: "10" }, funWeb3ConnectWallets.map((wallet) => {
+      return /* @__PURE__ */ React213.createElement(
         ModalSelection,
         {
           currentlySelected: wallet.id === selectedOptionId,
@@ -24111,16 +24198,16 @@ function FunSignInStep({
   const isWeb3SectionVisible = (loginConfig.web3 || walletsOnly) && funWeb3ConnectWallets.length > 0;
   const Web3LoginSection = isWeb3SectionVisible ? makeWeb3LoginSection(isWeb3SectionCollapsed) : null;
   if (walletsOnly) {
-    return /* @__PURE__ */ React212.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, Web3LoginSection);
+    return /* @__PURE__ */ React213.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, Web3LoginSection);
   }
   const primaryLoginSection = prioritizedLoginType === "web3" ? Web3LoginSection : Web2LoginSection;
   const secondaryLoginSection = prioritizedLoginType === "web3" ? Web2LoginSection : Web3LoginSection;
-  return /* @__PURE__ */ React212.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, signInStep === 0 /* SIGNIN_PRIMARY */ ? /* @__PURE__ */ React212.createElement(Fragment3, null, primaryLoginSection, !!primaryLoginSection && !!secondaryLoginSection && /* @__PURE__ */ React212.createElement(FunDivider, { label: "or", borderColor: "selectedOptionBorder" }), secondaryLoginSection) : secondaryLoginSection);
+  return /* @__PURE__ */ React213.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, signInStep === 0 /* SIGNIN_PRIMARY */ ? /* @__PURE__ */ React213.createElement(Fragment3, null, primaryLoginSection, !!primaryLoginSection && !!secondaryLoginSection && /* @__PURE__ */ React213.createElement(FunDivider, { label: "or", borderColor: "selectedOptionBorder" }), secondaryLoginSection) : secondaryLoginSection);
 }
 
 // src/components/Icons/BrokerageIcon.tsx
-import React213 from "react";
-var BrokerageIcon = ({ size = 20 }) => /* @__PURE__ */ React213.createElement(
+import React214 from "react";
+var BrokerageIcon = ({ size = 20 }) => /* @__PURE__ */ React214.createElement(
   "svg",
   {
     width: size,
@@ -24129,7 +24216,7 @@ var BrokerageIcon = ({ size = 20 }) => /* @__PURE__ */ React213.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React213.createElement(
+  /* @__PURE__ */ React214.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -24141,8 +24228,8 @@ var BrokerageIcon = ({ size = 20 }) => /* @__PURE__ */ React213.createElement(
 );
 
 // src/components/Icons/EvmWallet.tsx
-import React214 from "react";
-var EvmWallet = ({ size = 20 }) => /* @__PURE__ */ React214.createElement(
+import React215 from "react";
+var EvmWallet = ({ size = 20 }) => /* @__PURE__ */ React215.createElement(
   "svg",
   {
     width: size,
@@ -24151,7 +24238,7 @@ var EvmWallet = ({ size = 20 }) => /* @__PURE__ */ React214.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React214.createElement(
+  /* @__PURE__ */ React215.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -24160,7 +24247,7 @@ var EvmWallet = ({ size = 20 }) => /* @__PURE__ */ React214.createElement(
       fill: "currentColor"
     }
   ),
-  /* @__PURE__ */ React214.createElement(
+  /* @__PURE__ */ React215.createElement(
     "path",
     {
       d: "M14.2837 4.86975V3.44021C14.2837 2.68193 13.9827 1.95471 13.4469 1.41853C12.911 0.882349 12.1843 0.581124 11.4265 0.581124L3.56941 0.581124C3.00109 0.581124 2.45604 0.807044 2.05418 1.20918C1.65231 1.61132 1.42655 2.15673 1.42655 2.72544C1.42655 3.29414 1.65231 3.83956 2.05418 4.2417C2.45604 4.64383 3.00109 4.86975 3.56941 4.86975L14.2837 4.86975Z",
@@ -24171,10 +24258,10 @@ var EvmWallet = ({ size = 20 }) => /* @__PURE__ */ React214.createElement(
 
 // src/hooks/usePaymentMethodIcon.tsx
 var PAYMENT_METHOD_ICONS = {
-  ["brokerage" /* BROKERAGE */]: (size) => /* @__PURE__ */ React215.createElement(BrokerageIcon, { size }),
-  ["card" /* CARD */]: (size) => /* @__PURE__ */ React215.createElement(CreditCardIcon, { size }),
-  ["token_transfer" /* TOKEN_TRANSFER */]: (size) => /* @__PURE__ */ React215.createElement(LightningBoltIcon, { size }),
-  ["virtual_bank" /* VIRTUAL_BANK */]: (size) => /* @__PURE__ */ React215.createElement(BankIcon, { size })
+  ["brokerage" /* BROKERAGE */]: (size) => /* @__PURE__ */ React216.createElement(BrokerageIcon, { size }),
+  ["card" /* CARD */]: (size) => /* @__PURE__ */ React216.createElement(CreditCardIcon, { size }),
+  ["token_transfer" /* TOKEN_TRANSFER */]: (size) => /* @__PURE__ */ React216.createElement(LightningBoltIcon, { size }),
+  ["virtual_bank" /* VIRTUAL_BANK */]: (size) => /* @__PURE__ */ React216.createElement(BankIcon, { size })
 };
 var DEFAULT_PAYMENT_METHOD_ICON_SIZE = 20;
 function usePaymentMethodIcon(paymentMethod, iconSize = DEFAULT_PAYMENT_METHOD_ICON_SIZE) {
@@ -24188,7 +24275,7 @@ function usePaymentMethodIcon(paymentMethod, iconSize = DEFAULT_PAYMENT_METHOD_I
   if (loginType === "web2" /* Web2 */) {
     const userType = userInfo.type;
     if (userType === "email" /* email */) {
-      return /* @__PURE__ */ React215.createElement(MailIcon, { width: iconSize });
+      return /* @__PURE__ */ React216.createElement(MailIcon, { width: iconSize });
     }
     for (const item of enabledSocialLogins) {
       if (item.funkitKey === userType) {
@@ -24198,7 +24285,7 @@ function usePaymentMethodIcon(paymentMethod, iconSize = DEFAULT_PAYMENT_METHOD_I
   } else if (loginType === "web3" /* Web3 */) {
     const iconUrl = wallets.find((w) => w.id === connector?.id)?.iconUrl || connector?.icon;
     if (iconUrl) {
-      return /* @__PURE__ */ React215.createElement(
+      return /* @__PURE__ */ React216.createElement(
         AsyncImage,
         {
           useAsImage: true,
@@ -24206,18 +24293,18 @@ function usePaymentMethodIcon(paymentMethod, iconSize = DEFAULT_PAYMENT_METHOD_I
           width: iconSize,
           borderRadius: "6",
           src: iconUrl,
-          fallbackElement: /* @__PURE__ */ React215.createElement(EvmWallet, { size: iconSize })
+          fallbackElement: /* @__PURE__ */ React216.createElement(EvmWallet, { size: iconSize })
         }
       );
     }
   }
-  return /* @__PURE__ */ React215.createElement(EvmWallet, { size: iconSize });
+  return /* @__PURE__ */ React216.createElement(EvmWallet, { size: iconSize });
 }
 var usePaymentMethodInfoLabel = (methodInfo, iconSize = DEFAULT_PAYMENT_METHOD_ICON_SIZE) => {
   const { textCustomizations } = useFunkitConfig();
   const paymentIcon = usePaymentMethodIcon(methodInfo.paymentMethod, iconSize);
   if (methodInfo.paymentMethod === "card" /* CARD */) {
-    return { text: "", icon: /* @__PURE__ */ React215.createElement(CombinedCreditCardOptionsIcon, null) };
+    return { text: "", icon: /* @__PURE__ */ React216.createElement(CombinedCreditCardOptionsIcon, null) };
   }
   if (methodInfo.paymentMethod === "brokerage" /* BROKERAGE */) {
     const icon2 = getExchangeIcon(methodInfo.meta.brokerType, iconSize);
@@ -24229,16 +24316,16 @@ var usePaymentMethodInfoLabel = (methodInfo, iconSize = DEFAULT_PAYMENT_METHOD_I
         methodInfo.title,
         methodInfo.matchingFiatAccount
       ),
-      icon: /* @__PURE__ */ React215.createElement(
+      icon: /* @__PURE__ */ React216.createElement(
         PaymentMethodIcon,
         {
           keyIconSize: iconSize,
-          paymentIcon: /* @__PURE__ */ React215.createElement(BankIconActive, { size: iconSize })
+          paymentIcon: /* @__PURE__ */ React216.createElement(BankIconActive, { size: iconSize })
         }
       )
     };
   }
-  const icon = /* @__PURE__ */ React215.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, paymentIcon);
+  const icon = /* @__PURE__ */ React216.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, paymentIcon);
   if (methodInfo.paymentMethod === "balance" /* ACCOUNT_BALANCE */) {
     const label = getWalletLabel(textCustomizations, methodInfo.description);
     return { text: label, icon };
@@ -24253,12 +24340,12 @@ var PaymentSource = ({
   redirect
 }) => {
   const label = usePaymentMethodInfoLabel(paymentMethodInfo, 15);
-  return /* @__PURE__ */ React216.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React216.createElement(
+  return /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(
     FunTxSummaryLineItemKeyText,
     {
       text: isSameDestination ? "Wallet" : "Source"
     }
-  ), /* @__PURE__ */ React216.createElement(Box, { display: "flex", alignItems: "center", gap: "5", color: "primaryText" }, label.icon, label.text && /* @__PURE__ */ React216.createElement(Text, { size: "12", weight: "medium" }, label.text), redirect));
+  ), /* @__PURE__ */ React217.createElement(Box, { display: "flex", alignItems: "center", gap: "5", color: "primaryText" }, label.icon, label.text && /* @__PURE__ */ React217.createElement(Text, { size: "12", weight: "medium" }, label.text), redirect));
 };
 var PaymentDestination = ({
   destinationConfig,
@@ -24268,8 +24355,8 @@ var PaymentDestination = ({
   const { walletAddress } = useGeneralWallet();
   const walletIcon = usePaymentMethodIcon("balance" /* ACCOUNT_BALANCE */, 15);
   const destinationIcon = destinationConfig?.icon ?? walletIcon;
-  const destinationAddress = customRecipient ?? walletAddress ?? "";
-  return /* @__PURE__ */ React216.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React216.createElement(FunTxSummaryLineItemKeyText, { text: "Destination" }), /* @__PURE__ */ React216.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, /* @__PURE__ */ React216.createElement(Box, { width: "15", height: "15", display: "flex", alignItems: "center" }, destinationIcon), /* @__PURE__ */ React216.createElement(Text, { weight: "medium", size: "12" }, destinationConfig?.text ?? formatAddress5(destinationAddress)), redirect));
+  const destinationAddress = customRecipient || walletAddress || "";
+  return /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItemKeyText, { text: "Destination" }), /* @__PURE__ */ React217.createElement(Box, { display: "flex", alignItems: "center", gap: "5" }, /* @__PURE__ */ React217.createElement(Box, { width: "15", height: "15", display: "flex", alignItems: "center" }, destinationIcon), /* @__PURE__ */ React217.createElement(Text, { weight: "medium", size: "12" }, destinationConfig?.text ?? formatAddress5(destinationAddress)), redirect));
 };
 var PaymentRouteSummary = ({
   paymentMethodInfo,
@@ -24281,14 +24368,14 @@ var PaymentRouteSummary = ({
   const customDestinationConfig = uiCustomizations?.confirmationScreen?.destinationConfig;
   const isAccountPayment = paymentMethodInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
   const isSameDestination = isAccountPayment && !customRecipient && !isVertexCustomer(apiKey);
-  return /* @__PURE__ */ React216.createElement(React216.Fragment, null, paymentMethodInfo && /* @__PURE__ */ React216.createElement(
+  return /* @__PURE__ */ React217.createElement(React217.Fragment, null, paymentMethodInfo && /* @__PURE__ */ React217.createElement(
     PaymentSource,
     {
       isSameDestination,
       paymentMethodInfo,
       redirect: sourceRedirect
     }
-  ), (!isSameDestination || customDestinationConfig) && /* @__PURE__ */ React216.createElement(React216.Fragment, null, /* @__PURE__ */ React216.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React216.createElement(
+  ), (!isSameDestination || customDestinationConfig) && /* @__PURE__ */ React217.createElement(React217.Fragment, null, /* @__PURE__ */ React217.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React217.createElement(
     PaymentDestination,
     {
       destinationConfig: customDestinationConfig,
@@ -24297,7 +24384,7 @@ var PaymentRouteSummary = ({
     }
   )));
 };
-var PaymentRouteSummarySkeletonLoader = () => /* @__PURE__ */ React216.createElement(
+var PaymentRouteSummarySkeletonLoader = () => /* @__PURE__ */ React217.createElement(
   Box,
   {
     width: "full",
@@ -24305,8 +24392,8 @@ var PaymentRouteSummarySkeletonLoader = () => /* @__PURE__ */ React216.createEle
     justifyContent: "space-between",
     alignItems: "center"
   },
-  /* @__PURE__ */ React216.createElement(FunSkeletonBlock, { height: "10", width: "44" }),
-  /* @__PURE__ */ React216.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React216.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React216.createElement(FunSkeletonBlock, { height: "10", width: "72" }))
+  /* @__PURE__ */ React217.createElement(FunSkeletonBlock, { height: "10", width: "44" }),
+  /* @__PURE__ */ React217.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React217.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React217.createElement(FunSkeletonBlock, { height: "10", width: "72" }))
 );
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryTransaction.css.ts
@@ -24314,7 +24401,7 @@ var expandableTriggerBaseStyles = "mxvati0";
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryTransaction.tsx
 function FunTxSummaryLineItemKeyText2({ text }) {
-  return /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React218.createElement(
     Text,
     {
       weight: "medium",
@@ -24337,7 +24424,7 @@ function StatusTag({ state, refundState, isDelayed: isDelayed2 }) {
     refundState
   );
   const color = isCompleted || isRefundProceeded ? "success" : "secondaryText";
-  return /* @__PURE__ */ React217.createElement(Text, { color, size: "12", weight: "medium" }, isRefundProceeded ? statusNamingMap.completed : refundState === "REFUNDED" ? "Refunded" : (
+  return /* @__PURE__ */ React218.createElement(Text, { color, size: "12", weight: "medium" }, isRefundProceeded ? statusNamingMap.completed : refundState === "REFUNDED" ? "Refunded" : (
     // With some hardcoded timings in `FunCheckoutStatus`, it is possible for isDelayed to stay true while isCompleted is already true
     isDelayed2 && !isCompleted ? "Pending" : statusNamingMap[status]
   ));
@@ -24346,7 +24433,7 @@ var ReceivedAmount = ({ config }) => {
   const receivedAmountDisplay = useCheckoutItemDisplay({
     checkoutConfig: config
   });
-  return /* @__PURE__ */ React217.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React218.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React218.createElement(
     AsyncImage,
     {
       src: config.iconSrc ?? FALLBACK_ASSET,
@@ -24355,7 +24442,7 @@ var ReceivedAmount = ({ config }) => {
       height: 15,
       useAsImage: true
     }
-  ), /* @__PURE__ */ React217.createElement(Text, { size: "12", weight: "medium" }, receivedAmountDisplay));
+  ), /* @__PURE__ */ React218.createElement(Text, { size: "12", weight: "medium" }, receivedAmountDisplay));
 };
 function FunTxSummaryHistory({
   checkoutHistoryItem,
@@ -24368,28 +24455,28 @@ function FunTxSummaryHistory({
   const customDestinationConfig = uiCustomizations?.confirmationScreen?.destinationConfig;
   const isAccountPayment = checkoutItem && checkoutItem.selectedPaymentMethodInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
   const sourceRedirectAddress = isAccountPayment ? checkoutHistoryItem?.sourceOfFund?.split("|")?.[2] : null;
-  return /* @__PURE__ */ React217.createElement(React217.Fragment, null, /* @__PURE__ */ React217.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItemKeyText2, { text: "Fill status" }), isCheckoutItemLoaded ? /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React218.createElement(React218.Fragment, null, /* @__PURE__ */ React218.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(FunTxSummaryLineItemKeyText2, { text: "Fill status" }), isCheckoutItemLoaded ? /* @__PURE__ */ React218.createElement(
     StatusTag,
     {
       state: checkoutHistoryItem.state,
       refundState: checkoutHistoryItem.refundState,
       isDelayed: isDelayed2
     }
-  ) : /* @__PURE__ */ React217.createElement(FunSkeletonBlock, { height: "10", width: "44" })), isCompleted && /* @__PURE__ */ React217.createElement(React217.Fragment, null, /* @__PURE__ */ React217.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItemKeyText2, { text: "Total time" }), /* @__PURE__ */ React217.createElement(Text, { weight: "medium", size: "12" }, formatSecondsToReadableForm4(
+  ) : /* @__PURE__ */ React218.createElement(FunSkeletonBlock, { height: "10", width: "44" })), isCompleted && /* @__PURE__ */ React218.createElement(React218.Fragment, null, /* @__PURE__ */ React218.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(FunTxSummaryLineItemKeyText2, { text: "Total time" }), /* @__PURE__ */ React218.createElement(Text, { weight: "medium", size: "12" }, formatSecondsToReadableForm4(
     getCheckoutCompletionTime(checkoutHistoryItem)
-  ))))), /* @__PURE__ */ React217.createElement(FunTxSummaryBox, null, checkoutItem ? /* @__PURE__ */ React217.createElement(
+  ))))), /* @__PURE__ */ React218.createElement(FunTxSummaryBox, null, checkoutItem ? /* @__PURE__ */ React218.createElement(
     PaymentRouteSummary,
     {
       paymentMethodInfo: checkoutItem.selectedPaymentMethodInfo,
       customRecipient: checkoutItem.initSettings.config.customRecipient,
-      sourceRedirect: sourceRedirectAddress ? /* @__PURE__ */ React217.createElement(
+      sourceRedirect: sourceRedirectAddress ? /* @__PURE__ */ React218.createElement(
         AddressRedirectButton,
         {
           chainId: checkoutHistoryItem.fromChainId,
           address: sourceRedirectAddress
         }
       ) : void 0,
-      destinationRedirect: /* @__PURE__ */ React217.createElement(
+      destinationRedirect: /* @__PURE__ */ React218.createElement(
         AddressRedirectButton,
         {
           chainId: checkoutHistoryItem.toChainId,
@@ -24398,7 +24485,7 @@ function FunTxSummaryHistory({
         }
       )
     }
-  ) : /* @__PURE__ */ React217.createElement(PaymentRouteSummarySkeletonLoader, null)), /* @__PURE__ */ React217.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(FunTxSummaryLineItemKeyText2, { text: "You receive" }), checkoutItem ? /* @__PURE__ */ React217.createElement(ReceivedAmount, { config: checkoutItem.initSettings.config }) : /* @__PURE__ */ React217.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React217.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React217.createElement(FunSkeletonBlock, { height: "10", width: "93" })))));
+  ) : /* @__PURE__ */ React218.createElement(PaymentRouteSummarySkeletonLoader, null)), /* @__PURE__ */ React218.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(FunTxSummaryLineItemKeyText2, { text: "You receive" }), checkoutItem ? /* @__PURE__ */ React218.createElement(ReceivedAmount, { config: checkoutItem.initSettings.config }) : /* @__PURE__ */ React218.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React218.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React218.createElement(FunSkeletonBlock, { height: "10", width: "93" })))));
 }
 function OrderDetail({
   checkoutHistoryItem
@@ -24406,7 +24493,7 @@ function OrderDetail({
   const [isExpanded, setIsExpanded] = useState56(false);
   const contentRef = useRef18(null);
   const isCheckoutItemLoaded = checkoutHistoryItem !== void 0;
-  return /* @__PURE__ */ React217.createElement(Box, { ref: contentRef, paddingX: "12" }, /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React218.createElement(Box, { ref: contentRef, paddingX: "12" }, /* @__PURE__ */ React218.createElement(
     Box,
     {
       display: "flex",
@@ -24424,9 +24511,9 @@ function OrderDetail({
       },
       className: expandableTriggerBaseStyles
     },
-    /* @__PURE__ */ React217.createElement(Text, { size: "12", color: "tertiaryText" }, "More details"),
-    /* @__PURE__ */ React217.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, isCheckoutItemLoaded ? /* @__PURE__ */ React217.createElement(ArrowIcon, { direction: isExpanded ? "down" : "right" }) : /* @__PURE__ */ React217.createElement(FunSkeletonCircle, { size: "16" }))
-  ), isCheckoutItemLoaded && /* @__PURE__ */ React217.createElement(Box, { className: isExpanded ? contentExpanded : contentCollapsed }, /* @__PURE__ */ React217.createElement(Box, { paddingTop: "12" }, /* @__PURE__ */ React217.createElement(OrderDetailSection, { checkoutHistoryItem }))));
+    /* @__PURE__ */ React218.createElement(Text, { size: "12", color: "tertiaryText" }, "More details"),
+    /* @__PURE__ */ React218.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, isCheckoutItemLoaded ? /* @__PURE__ */ React218.createElement(ArrowIcon, { direction: isExpanded ? "down" : "right" }) : /* @__PURE__ */ React218.createElement(FunSkeletonCircle, { size: "16" }))
+  ), isCheckoutItemLoaded && /* @__PURE__ */ React218.createElement(Box, { className: isExpanded ? contentExpanded : contentCollapsed }, /* @__PURE__ */ React218.createElement(Box, { paddingTop: "12" }, /* @__PURE__ */ React218.createElement(OrderDetailSection, { checkoutHistoryItem }))));
 }
 var OrderDetailSection = ({
   checkoutHistoryItem
@@ -24442,13 +24529,13 @@ var OrderDetailSection = ({
   } = checkoutHistoryItem;
   const expirationTimeMs = expirationTimestampSeconds * 1e3;
   const hideDepositAddress = checkoutHistoryItem.fromChainId === SOLANA_MAINNET_CHAIN_ID2.toString();
-  return /* @__PURE__ */ React217.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, !hideDepositAddress && /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, "Deposit address"), /* @__PURE__ */ React217.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress6(checkoutHistoryItem.depositAddr)), /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React218.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, !hideDepositAddress && /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, "Deposit address"), /* @__PURE__ */ React218.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress6(checkoutHistoryItem.depositAddr)), /* @__PURE__ */ React218.createElement(
     AddressRedirectButton,
     {
       chainId: checkoutHistoryItem.fromChainId,
       address: checkoutHistoryItem.depositAddr
     }
-  ))), /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, "Order submitted"), /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(createdTimeMs))), stateTimestampMs?.FROM_FUNDED && /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, "Order received"), /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(stateTimestampMs.FROM_FUNDED))), !isProcessing && /* @__PURE__ */ React217.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, `Order ${isError ? "failed" : isExpired ? "expired" : "filled"}`), /* @__PURE__ */ React217.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(
+  ))), /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, "Order submitted"), /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(createdTimeMs))), stateTimestampMs?.FROM_FUNDED && /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, "Order received"), /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(stateTimestampMs.FROM_FUNDED))), !isProcessing && /* @__PURE__ */ React218.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, `Order ${isError ? "failed" : isExpired ? "expired" : "filled"}`), /* @__PURE__ */ React218.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp(
     isExpired ? expirationTimeMs : stateTimestampMs?.COMPLETED ?? lastUpdatedTimeMs
   ))));
 };
@@ -24460,8 +24547,8 @@ var getTimestamp = (timestampMs) => formatTimestamp(new Date(timestampMs), {
 
 // src/components/FunCheckoutHistory/FunCheckoutStatus.tsx
 import { formatSecondsToCountdownForm } from "@funkit/utils";
-import { motion as motion10 } from "motion/react";
-import React218, { useMemo as useMemo38 } from "react";
+import { motion as motion11 } from "motion/react";
+import React219, { useMemo as useMemo38 } from "react";
 
 // src/components/FunCheckoutHistory/FunCheckoutStatus.css.ts
 var GradientLoadingBox = "_101aujm0";
@@ -24474,20 +24561,20 @@ function FunCheckoutStatus({
   onOrderDelayed
 }) {
   if (checkoutHistoryItem === void 0) {
-    return /* @__PURE__ */ React218.createElement(Box, { className: GradientLoadingBox }, /* @__PURE__ */ React218.createElement(FunSkeletonCircle, { size: "40" }));
+    return /* @__PURE__ */ React219.createElement(Box, { className: GradientLoadingBox }, /* @__PURE__ */ React219.createElement(FunSkeletonCircle, { size: "40" }));
   }
   const { isCompleted, isFailed, isRefundProceeded, isExpired } = getCheckoutStateBooleans(
     checkoutHistoryItem.state,
     checkoutHistoryItem.refundState
   );
   if (checkoutHistoryItem.refundState === "REFUNDED") return null;
-  return /* @__PURE__ */ React218.createElement(
+  return /* @__PURE__ */ React219.createElement(
     StatusInner,
     {
       showCompleted: isCompleted || isRefundProceeded,
       showDelayed: isExpired,
       showFailed: isFailed,
-      pendingComponent: /* @__PURE__ */ React218.createElement(
+      pendingComponent: /* @__PURE__ */ React219.createElement(
         PendingCheckoutStatus,
         {
           checkoutHistoryItem,
@@ -24503,7 +24590,7 @@ function StatusInner({
   showFailed,
   pendingComponent
 }) {
-  return /* @__PURE__ */ React218.createElement(Box, { display: "flex", justifyContent: "center" }, /* @__PURE__ */ React218.createElement(Box, { className: GradientWrapperClass }, showCompleted ? /* @__PURE__ */ React218.createElement(React218.Fragment, null, /* @__PURE__ */ React218.createElement(Box, { className: GradientPositionClass }, /* @__PURE__ */ React218.createElement(CompletedGradientSvg, null)), /* @__PURE__ */ React218.createElement(CompletedStatusIcon, null)) : showDelayed ? /* @__PURE__ */ React218.createElement(DelayedStatusIcon, null) : showFailed ? /* @__PURE__ */ React218.createElement(React218.Fragment, null, /* @__PURE__ */ React218.createElement(Box, { className: GradientPositionClass }, /* @__PURE__ */ React218.createElement(FailedGradientSvg, null)), /* @__PURE__ */ React218.createElement(FailedStatusIcon, null)) : pendingComponent));
+  return /* @__PURE__ */ React219.createElement(Box, { display: "flex", justifyContent: "center" }, /* @__PURE__ */ React219.createElement(Box, { className: GradientWrapperClass }, showCompleted ? /* @__PURE__ */ React219.createElement(React219.Fragment, null, /* @__PURE__ */ React219.createElement(Box, { className: GradientPositionClass }, /* @__PURE__ */ React219.createElement(CompletedGradientSvg, null)), /* @__PURE__ */ React219.createElement(CompletedStatusIcon, null)) : showDelayed ? /* @__PURE__ */ React219.createElement(DelayedStatusIcon, null) : showFailed ? /* @__PURE__ */ React219.createElement(React219.Fragment, null, /* @__PURE__ */ React219.createElement(Box, { className: GradientPositionClass }, /* @__PURE__ */ React219.createElement(FailedGradientSvg, null)), /* @__PURE__ */ React219.createElement(FailedStatusIcon, null)) : pendingComponent));
 }
 var extractStartTimeMs = (historyCheckoutItemId, activeCheckoutItem, { createdTimeMs, stateTimestampMs }) => {
   if (stateTimestampMs?.FROM_FUNDED) return stateTimestampMs.FROM_FUNDED;
@@ -24530,7 +24617,7 @@ function PendingCheckoutStatus({
     );
     return getTimeFromNowSeconds(startTimeMs, totalSeconds * 1e3);
   }, [checkoutItem.id, activeCheckoutItem, checkoutHistoryItem, totalSeconds]);
-  return /* @__PURE__ */ React218.createElement(
+  return /* @__PURE__ */ React219.createElement(
     PendingStatus,
     {
       totalSeconds,
@@ -24544,7 +24631,7 @@ function PendingStatus({
   estimatedRemainingSeconds,
   onOrderDelayed
 }) {
-  return /* @__PURE__ */ React218.createElement(
+  return /* @__PURE__ */ React219.createElement(
     FunCountdown,
     {
       strokeWidth: 2,
@@ -24552,19 +24639,19 @@ function PendingStatus({
       countdownSeconds: totalSeconds,
       initialRemainingSeconds: estimatedRemainingSeconds,
       onCountdownEnded: onOrderDelayed,
-      delayedComponent: /* @__PURE__ */ React218.createElement(DelayedStatus, null),
+      delayedComponent: /* @__PURE__ */ React219.createElement(DelayedStatus, null),
       motionProps: {
         initial: { scale: 1, opacity: 1 },
         exit: { scale: 0.3, opacity: 0 },
         transition: { duration: 0.3, ease: [0.24, 0, 0, 1] }
       }
     },
-    (remainingSeconds) => /* @__PURE__ */ React218.createElement(Box, { display: "flex", flexDirection: "column", alignItems: "center" }, remainingSeconds > 0 && /* @__PURE__ */ React218.createElement(Text, { size: "13", weight: "medium" }, formatSecondsToCountdownForm(remainingSeconds)))
+    (remainingSeconds) => /* @__PURE__ */ React219.createElement(Box, { display: "flex", flexDirection: "column", alignItems: "center" }, remainingSeconds > 0 && /* @__PURE__ */ React219.createElement(Text, { size: "13", weight: "medium" }, formatSecondsToCountdownForm(remainingSeconds)))
   );
 }
 var DelayedStatus = () => {
   const transition = { duration: 0.3, ease: [0.24, 0, 0, 1] };
-  return /* @__PURE__ */ React218.createElement(Box, { display: "flex", flexDirection: "column", gap: "6", alignItems: "center" }, /* @__PURE__ */ React218.createElement(
+  return /* @__PURE__ */ React219.createElement(Box, { display: "flex", flexDirection: "column", gap: "6", alignItems: "center" }, /* @__PURE__ */ React219.createElement(
     Box,
     {
       color: "secondaryText",
@@ -24572,8 +24659,8 @@ var DelayedStatus = () => {
       alignItems: "center",
       justifyContent: "center"
     },
-    /* @__PURE__ */ React218.createElement(
-      motion10.svg,
+    /* @__PURE__ */ React219.createElement(
+      motion11.svg,
       {
         width: "22",
         height: "22",
@@ -24585,7 +24672,7 @@ var DelayedStatus = () => {
         xmlns: "http://www.w3.org/2000/svg",
         className: SlowRotation
       },
-      /* @__PURE__ */ React218.createElement(
+      /* @__PURE__ */ React219.createElement(
         "circle",
         {
           cx: "11",
@@ -24598,14 +24685,14 @@ var DelayedStatus = () => {
         }
       )
     )
-  ), /* @__PURE__ */ React218.createElement(
-    motion10.div,
+  ), /* @__PURE__ */ React219.createElement(
+    motion11.div,
     {
       initial: { opacity: 0, y: 20 },
       animate: { opacity: 1, y: 0 },
       transition
     },
-    /* @__PURE__ */ React218.createElement(Box, { display: "flex", flexDirection: "column", gap: "2" }, /* @__PURE__ */ React218.createElement(Text, { size: "12", textAlign: "center" }, "Deposit pending"), /* @__PURE__ */ React218.createElement(Box, { textAlign: "center" }, /* @__PURE__ */ React218.createElement(Text, { size: "12", color: "secondaryText" }, "Your deposit is still in progress - no action is required from you")))
+    /* @__PURE__ */ React219.createElement(Box, { display: "flex", flexDirection: "column", gap: "2" }, /* @__PURE__ */ React219.createElement(Text, { size: "12", textAlign: "center" }, "Deposit pending"), /* @__PURE__ */ React219.createElement(Box, { textAlign: "center" }, /* @__PURE__ */ React219.createElement(Text, { size: "12", color: "secondaryText" }, "Your deposit is still in progress - no action is required from you")))
   ));
 };
 
@@ -24671,19 +24758,19 @@ function FunCheckoutHistoryDetail({
     includeGenerateActionsParams
   ]);
   const bottomSectionRef = document.getElementById(bottomBarId);
-  return /* @__PURE__ */ React219.createElement(React219.Fragment, null, /* @__PURE__ */ React219.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React219.createElement(Box, { style: { visibility: "hidden" } }, /* @__PURE__ */ React219.createElement(
+  return /* @__PURE__ */ React220.createElement(React220.Fragment, null, /* @__PURE__ */ React220.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React220.createElement(Box, { style: { visibility: "hidden" } }, /* @__PURE__ */ React220.createElement(
     FunCheckoutStatus,
     {
       checkoutHistoryItem: checkoutHistoryInfo,
       onOrderDelayed: () => setIsDelayed(true)
     }
-  )), /* @__PURE__ */ React219.createElement(
+  )), /* @__PURE__ */ React220.createElement(
     FunTxSummaryHistory,
     {
       checkoutHistoryItem: checkoutHistoryInfo,
       isDelayed: isDelayed2
     }
-  ), /* @__PURE__ */ React219.createElement(OrderDetail, { checkoutHistoryItem: checkoutHistoryInfo }), isCheckoutLoaded && /* @__PURE__ */ React219.createElement(
+  ), /* @__PURE__ */ React220.createElement(OrderDetail, { checkoutHistoryItem: checkoutHistoryInfo }), isCheckoutLoaded && /* @__PURE__ */ React220.createElement(
     CheckoutAlert,
     {
       state: checkoutHistoryInfo.state,
@@ -24691,7 +24778,7 @@ function FunCheckoutHistoryDetail({
       onHelp
     }
   )), bottomSectionRef && createPortal14(
-    /* @__PURE__ */ React219.createElement(
+    /* @__PURE__ */ React220.createElement(
       Dialog.BottomBar,
       {
         onClose,
@@ -24704,7 +24791,7 @@ function FunCheckoutHistoryDetail({
 var CheckoutAlert = ({ state, refundState, onHelp }) => {
   const { isError, isProcessing, isCompleted, isRefundProceeded } = getCheckoutStateBooleans(state, refundState);
   if (isError) {
-    return /* @__PURE__ */ React219.createElement(
+    return /* @__PURE__ */ React220.createElement(
       FunAlert,
       {
         type: "error",
@@ -24713,10 +24800,10 @@ var CheckoutAlert = ({ state, refundState, onHelp }) => {
     );
   }
   if (refundState === "REFUNDED") {
-    return /* @__PURE__ */ React219.createElement(FunAlert, { description: "Your order was refunded." });
+    return /* @__PURE__ */ React220.createElement(FunAlert, { description: "Your order was refunded." });
   }
   if (isRefundProceeded) {
-    return /* @__PURE__ */ React219.createElement(
+    return /* @__PURE__ */ React220.createElement(
       FunAlert,
       {
         description: `Your order was delayed due to technical issues. If you have any questions reach out to ${FUN_ORG_NAME}.`
@@ -24724,17 +24811,17 @@ var CheckoutAlert = ({ state, refundState, onHelp }) => {
     );
   }
   if (isProcessing || isCompleted) {
-    return /* @__PURE__ */ React219.createElement(HelpAlert, { onHelp });
+    return /* @__PURE__ */ React220.createElement(HelpAlert, { onHelp });
   }
 };
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryHelp.tsx
 import { sendSupportMessage } from "@funkit/api-base";
-import React222, { useEffect as useEffect43, useMemo as useMemo40, useRef as useRef19, useState as useState58 } from "react";
+import React223, { useEffect as useEffect43, useMemo as useMemo40, useRef as useRef19, useState as useState58 } from "react";
 import { createPortal as createPortal15 } from "react-dom";
 
 // src/components/FunInput/FunTextAreaInput.tsx
-import React220 from "react";
+import React221 from "react";
 
 // src/components/FunInput/FunTextAreaInput.css.ts
 var baseStyles3 = "_1q9ws650";
@@ -24757,7 +24844,7 @@ function FunTextAreaInput({
   overrideBackground,
   isLoading
 }) {
-  const [focused, setFocused] = React220.useState(false);
+  const [focused, setFocused] = React221.useState(false);
   const onFocus = () => setFocused(true);
   const onBlur = () => setFocused(false);
   const getBorderColor2 = () => {
@@ -24769,7 +24856,7 @@ function FunTextAreaInput({
       hover: "inputBorderHover"
     };
   };
-  return /* @__PURE__ */ React220.createElement(Box, { color: "primaryText", display: "flex", flexDirection: "column", gap: "4" }, label && /* @__PURE__ */ React220.createElement(Text, { size: "12", weight: textWeight }, label), isLoading ? /* @__PURE__ */ React220.createElement(FunSkeletonBlock, { height: "62" }) : /* @__PURE__ */ React220.createElement(
+  return /* @__PURE__ */ React221.createElement(Box, { color: "primaryText", display: "flex", flexDirection: "column", gap: "4" }, label && /* @__PURE__ */ React221.createElement(Text, { size: "12", weight: textWeight }, label), isLoading ? /* @__PURE__ */ React221.createElement(FunSkeletonBlock, { height: "62" }) : /* @__PURE__ */ React221.createElement(
     Box,
     {
       borderRadius: "connectButton",
@@ -24789,7 +24876,7 @@ function FunTextAreaInput({
         hover: "offBackground"
       }
     },
-    /* @__PURE__ */ React220.createElement(
+    /* @__PURE__ */ React221.createElement(
       "textarea",
       {
         type: inputProps?.type || "text",
@@ -24817,13 +24904,13 @@ function FunTextAreaInput({
         }
       }
     )
-  ), error && typeof error === "string" && /* @__PURE__ */ React220.createElement(Text, { color: "error", size: "14", weight: "medium" }, error));
+  ), error && typeof error === "string" && /* @__PURE__ */ React221.createElement(Text, { color: "error", size: "14", weight: "medium" }, error));
 }
 
 // src/components/Icons/SuccessIcon.tsx
-import React221 from "react";
+import React222 from "react";
 var SuccessIcon = ({ size = 50 }) => {
-  return /* @__PURE__ */ React221.createElement(
+  return /* @__PURE__ */ React222.createElement(
     "svg",
     {
       width: size,
@@ -24832,7 +24919,7 @@ var SuccessIcon = ({ size = 50 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React221.createElement(
+    /* @__PURE__ */ React222.createElement(
       "path",
       {
         d: "M24.9766 49.2891C21.6641 49.2891 18.5469 48.6562 15.625 47.3906C12.7031 46.1406 10.125 44.3984 7.89062 42.1641C5.67188 39.9297 3.92969 37.3516 2.66406 34.4297C1.39844 31.5078 0.765625 28.3906 0.765625 25.0781C0.765625 21.7656 1.39844 18.6484 2.66406 15.7266C3.92969 12.8047 5.67188 10.2344 7.89062 8.01562C10.125 5.78125 12.6953 4.03125 15.6016 2.76562C18.5234 1.5 21.6406 0.867188 24.9531 0.867188C28.2812 0.867188 31.4062 1.5 34.3281 2.76562C37.25 4.03125 39.8281 5.78125 42.0625 8.01562C44.2969 10.2344 46.0469 12.8047 47.3125 15.7266C48.5781 18.6484 49.2109 21.7656 49.2109 25.0781C49.2109 28.3906 48.5781 31.5078 47.3125 34.4297C46.0469 37.3516 44.2969 39.9297 42.0625 42.1641C39.8281 44.3984 37.25 46.1406 34.3281 47.3906C31.4062 48.6562 28.2891 49.2891 24.9766 49.2891ZM22.375 36.6328C22.8125 36.6328 23.2109 36.5312 23.5703 36.3281C23.9453 36.125 24.2734 35.8203 24.5547 35.4141L35.5234 18.3047C35.6797 18.0547 35.8203 17.7891 35.9453 17.5078C36.0703 17.2109 36.1328 16.9297 36.1328 16.6641C36.1328 16.0547 35.8984 15.5625 35.4297 15.1875C34.9766 14.8125 34.4609 14.625 33.8828 14.625C33.1172 14.625 32.4844 15.0312 31.9844 15.8438L22.2812 31.3594L17.7812 25.6406C17.4688 25.25 17.1641 24.9766 16.8672 24.8203C16.5703 24.6641 16.2344 24.5859 15.8594 24.5859C15.2656 24.5859 14.7578 24.8047 14.3359 25.2422C13.9297 25.6641 13.7266 26.1719 13.7266 26.7656C13.7266 27.0625 13.7812 27.3516 13.8906 27.6328C14 27.9141 14.1562 28.1875 14.3594 28.4531L20.1016 35.4375C20.4453 35.8594 20.7969 36.1641 21.1562 36.3516C21.5156 36.5391 21.9219 36.6328 22.375 36.6328Z",
@@ -24968,18 +25055,18 @@ function FunCheckoutHistoryHelp({
     }
   };
   if (processStage === 1 /* SUCCESS */) {
-    return /* @__PURE__ */ React222.createElement(Box, { display: "flex", flexDirection: "column", gap: "24", paddingTop: "16" }, /* @__PURE__ */ React222.createElement(Box, { paddingY: "12", paddingX: "24" }, /* @__PURE__ */ React222.createElement(
+    return /* @__PURE__ */ React223.createElement(Box, { display: "flex", flexDirection: "column", gap: "24", paddingTop: "16" }, /* @__PURE__ */ React223.createElement(Box, { paddingY: "12", paddingX: "24" }, /* @__PURE__ */ React223.createElement(
       FunMessage,
       {
         title: "Request sent",
         description: "Our team has received your request and will be in touch shortly. We appreciate your patience.",
-        icon: /* @__PURE__ */ React222.createElement(SuccessIcon, null)
+        icon: /* @__PURE__ */ React223.createElement(SuccessIcon, null)
       }
-    )), /* @__PURE__ */ React222.createElement(FunButton, { title: "Close", onClick: onBackFromHelpPage }));
+    )), /* @__PURE__ */ React223.createElement(FunButton, { title: "Close", onClick: onBackFromHelpPage }));
   }
   const bottomSectionRef = document.getElementById(bottomBarId);
   const isLoadingCheckoutItem = checkoutHistoryInfo === void 0;
-  return /* @__PURE__ */ React222.createElement(Box, { ref: wrapperRef }, /* @__PURE__ */ React222.createElement(Box, { display: "flex", flexDirection: "column", gap: "24", paddingTop: "12" }, /* @__PURE__ */ React222.createElement(Box, { display: "flex", flexDirection: "column", gap: "10" }, /* @__PURE__ */ React222.createElement(Text, { size: "20", weight: "medium" }, "Tell us more"), /* @__PURE__ */ React222.createElement(Text, { size: "10" }, "If you're experiencing an issue or have a question, please fill out the form below and our support team will get back to you as soon as possible.")), /* @__PURE__ */ React222.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React222.createElement(
+  return /* @__PURE__ */ React223.createElement(Box, { ref: wrapperRef }, /* @__PURE__ */ React223.createElement(Box, { display: "flex", flexDirection: "column", gap: "24", paddingTop: "12" }, /* @__PURE__ */ React223.createElement(Box, { display: "flex", flexDirection: "column", gap: "10" }, /* @__PURE__ */ React223.createElement(Text, { size: "20", weight: "medium" }, "Tell us more"), /* @__PURE__ */ React223.createElement(Text, { size: "10" }, "If you're experiencing an issue or have a question, please fill out the form below and our support team will get back to you as soon as possible.")), /* @__PURE__ */ React223.createElement(Box, { display: "flex", flexDirection: "column", gap: "24" }, /* @__PURE__ */ React223.createElement(
     FunInput,
     {
       label: "Email*",
@@ -24988,7 +25075,7 @@ function FunCheckoutHistoryHelp({
       value: emailInput,
       onChange: (e) => setEmailInput(e?.target?.value)
     }
-  ), /* @__PURE__ */ React222.createElement(
+  ), /* @__PURE__ */ React223.createElement(
     FunInput,
     {
       label: "Subject*",
@@ -24997,7 +25084,7 @@ function FunCheckoutHistoryHelp({
       value: subjectInput,
       onChange: (e) => setSubjectInput(e?.target?.value)
     }
-  ), /* @__PURE__ */ React222.createElement(
+  ), /* @__PURE__ */ React223.createElement(
     FunTextAreaInput,
     {
       label: "Description*",
@@ -25006,7 +25093,7 @@ function FunCheckoutHistoryHelp({
       value: descriptionInput,
       onChange: (e) => setDescriptionInput(e?.target?.value)
     }
-  ), /* @__PURE__ */ React222.createElement(
+  ), /* @__PURE__ */ React223.createElement(
     BaseDropdown_default,
     {
       size: "large",
@@ -25016,7 +25103,7 @@ function FunCheckoutHistoryHelp({
       value: resolutionInput,
       onOptionSelected: (option) => setResolutionInput(option.value),
       renderDropdownOption: (option, isSelected) => {
-        return /* @__PURE__ */ React222.createElement(
+        return /* @__PURE__ */ React223.createElement(
           BaseDropdownItem_default,
           {
             horizontalPadding: "8",
@@ -25036,7 +25123,7 @@ function FunCheckoutHistoryHelp({
       openDropdownBackgroundColor: "inputBackground"
     }
   ))), bottomSectionRef && createPortal15(
-    /* @__PURE__ */ React222.createElement(
+    /* @__PURE__ */ React223.createElement(
       Dialog.BottomBar,
       {
         actionButtonProps: {
@@ -25044,7 +25131,7 @@ function FunCheckoutHistoryHelp({
           onClick: onSubmitIssue,
           isDisabled: isSubmitting || !subjectInput || !descriptionInput || !emailInput || !isEmailInputValid || !resolutionInput
         },
-        topSection: /* @__PURE__ */ React222.createElement(
+        topSection: /* @__PURE__ */ React223.createElement(
           FunNotification,
           {
             description: errorMessage,
@@ -25066,26 +25153,26 @@ import {
   formatTimestamp as formatTimestamp2,
   isTokenEquivalent as isTokenEquivalent8
 } from "@funkit/utils";
-import React224, { useCallback as useCallback41, useMemo as useMemo42, useRef as useRef20, useState as useState59 } from "react";
+import React225, { useCallback as useCallback41, useMemo as useMemo42, useRef as useRef20, useState as useState59 } from "react";
 import { createPortal as createPortal16 } from "react-dom";
 
 // src/components/FunCheckoutHistory/FunDirectExecutionStatus.tsx
-import React223, { useMemo as useMemo41 } from "react";
+import React224, { useMemo as useMemo41 } from "react";
 function FunDirectExecutionStatus({
   directExecution
 }) {
   const { isCompleted, isDelayed: isDelayed2, isFailed, isRefunded } = useCheckoutDirectExecutionHistory({ initDirectExecution: directExecution });
   if (directExecution === void 0) {
-    return /* @__PURE__ */ React223.createElement(Box, { className: GradientLoadingBox }, /* @__PURE__ */ React223.createElement(FunSkeletonCircle, { size: "40" }));
+    return /* @__PURE__ */ React224.createElement(Box, { className: GradientLoadingBox }, /* @__PURE__ */ React224.createElement(FunSkeletonCircle, { size: "40" }));
   }
   if (isRefunded) return null;
-  return /* @__PURE__ */ React223.createElement(
+  return /* @__PURE__ */ React224.createElement(
     StatusInner,
     {
       showCompleted: isCompleted,
       showDelayed: isDelayed2,
       showFailed: isFailed,
-      pendingComponent: /* @__PURE__ */ React223.createElement(PendingDirectExecutionStatus, { directExecution })
+      pendingComponent: /* @__PURE__ */ React224.createElement(PendingDirectExecutionStatus, { directExecution })
     }
   );
 }
@@ -25100,7 +25187,7 @@ function PendingDirectExecutionStatus({
     const startTimeMs = directExecution.createdTimeMs;
     return getTimeFromNowSeconds(startTimeMs, totalSeconds * 1e3);
   }, [totalSeconds, directExecution]);
-  return /* @__PURE__ */ React223.createElement(
+  return /* @__PURE__ */ React224.createElement(
     PendingStatus,
     {
       totalSeconds,
@@ -25116,7 +25203,7 @@ function FunDirectExecutionStatusTagLoaded({
   const { state, refundState, isDelayed: isDelayed2 } = useCheckoutDirectExecutionHistory({
     initDirectExecution: directExecution
   });
-  return /* @__PURE__ */ React224.createElement(StatusTag, { state, refundState, isDelayed: isDelayed2 });
+  return /* @__PURE__ */ React225.createElement(StatusTag, { state, refundState, isDelayed: isDelayed2 });
 }
 function FunDirectExecutionHistoryDetail({
   bottomBarId,
@@ -25166,25 +25253,25 @@ function FunDirectExecutionHistoryDetail({
     includeGenerateActionsParams,
     isLoaded
   ]);
-  return /* @__PURE__ */ React224.createElement(React224.Fragment, null, /* @__PURE__ */ React224.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React224.createElement(Box, { style: { visibility: "hidden" } }, /* @__PURE__ */ React224.createElement(FunDirectExecutionStatus, { directExecution })), /* @__PURE__ */ React224.createElement(
+  return /* @__PURE__ */ React225.createElement(React225.Fragment, null, /* @__PURE__ */ React225.createElement(Box, { display: "flex", flexDirection: "column", gap: VERTICAL_SECTION_GAP }, /* @__PURE__ */ React225.createElement(Box, { style: { visibility: "hidden" } }, /* @__PURE__ */ React225.createElement(FunDirectExecutionStatus, { directExecution })), /* @__PURE__ */ React225.createElement(
     DirectExecutionSummaryHistory,
     {
       directExecution,
       isLoaded
     }
-  ), /* @__PURE__ */ React224.createElement(
+  ), /* @__PURE__ */ React225.createElement(
     DirectExecutionOrderDetail,
     {
       directExecution,
       isLoaded
     }
-  ), /* @__PURE__ */ React224.createElement(
+  ), /* @__PURE__ */ React225.createElement(
     HelpAlert,
     {
       onHelp: () => window.open(CONTACT_US_LINK, "_blank", "noopener")
     }
   )), bottomSectionRef && createPortal16(
-    /* @__PURE__ */ React224.createElement(
+    /* @__PURE__ */ React225.createElement(
       Dialog.BottomBar,
       {
         onClose,
@@ -25215,26 +25302,26 @@ function DirectExecutionSummaryHistory({
   const clientMetadata = isLoaded && directExecution?.clientMetadata;
   const isAccountPayment = clientMetadata && clientMetadata.selectedPaymentMethodInfo?.paymentMethod === "balance" /* ACCOUNT_BALANCE */;
   const sourceRedirectAddress = isAccountPayment ? directExecution?.sourceOfFund?.split("|")?.[2] : null;
-  return /* @__PURE__ */ React224.createElement(React224.Fragment, null, /* @__PURE__ */ React224.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItemKeyText, { text: "Fill status" }), isLoaded ? /* @__PURE__ */ React224.createElement(
+  return /* @__PURE__ */ React225.createElement(React225.Fragment, null, /* @__PURE__ */ React225.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItemKeyText, { text: "Fill status" }), isLoaded ? /* @__PURE__ */ React225.createElement(
     FunDirectExecutionStatusTagLoaded,
     {
       directExecution
     }
-  ) : /* @__PURE__ */ React224.createElement(FunSkeletonBlock, { height: "10", width: "44" })), isCompleted && /* @__PURE__ */ React224.createElement(React224.Fragment, null, /* @__PURE__ */ React224.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItemKeyText, { text: "Total time" }), /* @__PURE__ */ React224.createElement(Text, { weight: "medium", size: "12" }, formatSecondsToReadableForm5(
+  ) : /* @__PURE__ */ React225.createElement(FunSkeletonBlock, { height: "10", width: "44" })), isCompleted && /* @__PURE__ */ React225.createElement(React225.Fragment, null, /* @__PURE__ */ React225.createElement(FunDivider, { marginTop: "12", marginBottom: "12" }), /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItemKeyText, { text: "Total time" }), /* @__PURE__ */ React225.createElement(Text, { weight: "medium", size: "12" }, formatSecondsToReadableForm5(
     getDirectExecutionRunTimeMs(directExecution)
-  ))))), /* @__PURE__ */ React224.createElement(FunTxSummaryBox, null, clientMetadata ? /* @__PURE__ */ React224.createElement(
+  ))))), /* @__PURE__ */ React225.createElement(FunTxSummaryBox, null, clientMetadata ? /* @__PURE__ */ React225.createElement(
     PaymentRouteSummary,
     {
       paymentMethodInfo: clientMetadata.selectedPaymentMethodInfo,
       customRecipient: clientMetadata.initSettings.config.customRecipient,
-      sourceRedirect: sourceRedirectAddress ? /* @__PURE__ */ React224.createElement(
+      sourceRedirect: sourceRedirectAddress ? /* @__PURE__ */ React225.createElement(
         AddressRedirectButton,
         {
           chainId: directExecution.fromChainId,
           address: sourceRedirectAddress
         }
       ) : void 0,
-      destinationRedirect: /* @__PURE__ */ React224.createElement(
+      destinationRedirect: /* @__PURE__ */ React225.createElement(
         AddressRedirectButton,
         {
           chainId: directExecution.toChainId,
@@ -25243,7 +25330,7 @@ function DirectExecutionSummaryHistory({
         }
       )
     }
-  ) : /* @__PURE__ */ React224.createElement(PaymentRouteSummarySkeletonLoader, null)), /* @__PURE__ */ React224.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItemKeyText, { text: receiveAmountLabel }), isLoaded && clientMetadata ? /* @__PURE__ */ React224.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React224.createElement(
+  ) : /* @__PURE__ */ React225.createElement(PaymentRouteSummarySkeletonLoader, null)), /* @__PURE__ */ React225.createElement(FunTxSummaryBox, null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItemKeyText, { text: receiveAmountLabel }), isLoaded && clientMetadata ? /* @__PURE__ */ React225.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React225.createElement(
     AsyncImage,
     {
       src: clientMetadata.initSettings.config.iconSrc || "",
@@ -25252,11 +25339,11 @@ function DirectExecutionSummaryHistory({
       height: 15,
       useAsImage: true
     }
-  ), /* @__PURE__ */ React224.createElement(Text, { size: "12", weight: "medium" }, formatCryptoAndStringify7(
+  ), /* @__PURE__ */ React225.createElement(Text, { size: "12", weight: "medium" }, formatCryptoAndStringify7(
     Number(
       clientMetadata.initSettings.config.targetAssetAmount || 0
     )
-  ))) : /* @__PURE__ */ React224.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React224.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React224.createElement(FunSkeletonBlock, { height: "10", width: "93" })))));
+  ))) : /* @__PURE__ */ React225.createElement(Box, { display: "flex", gap: "5", alignItems: "center" }, /* @__PURE__ */ React225.createElement(FunSkeletonCircle, { size: "15" }), /* @__PURE__ */ React225.createElement(FunSkeletonBlock, { height: "10", width: "93" })))));
 }
 function DirectExecutionOrderDetail({
   directExecution,
@@ -25264,7 +25351,7 @@ function DirectExecutionOrderDetail({
 }) {
   const [isExpanded, setIsExpanded] = useState59(false);
   const contentRef = useRef20(null);
-  return /* @__PURE__ */ React224.createElement(Box, { ref: contentRef, paddingX: "12" }, /* @__PURE__ */ React224.createElement(
+  return /* @__PURE__ */ React225.createElement(Box, { ref: contentRef, paddingX: "12" }, /* @__PURE__ */ React225.createElement(
     Box,
     {
       display: "flex",
@@ -25282,9 +25369,9 @@ function DirectExecutionOrderDetail({
       },
       className: expandableTriggerBaseStyles
     },
-    /* @__PURE__ */ React224.createElement(Text, { size: "12", color: "tertiaryText" }, "More details"),
-    /* @__PURE__ */ React224.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, isLoaded ? /* @__PURE__ */ React224.createElement(ArrowIcon, { direction: isExpanded ? "down" : "right" }) : /* @__PURE__ */ React224.createElement(FunSkeletonCircle, { size: "16" }))
-  ), isLoaded && /* @__PURE__ */ React224.createElement(Box, { className: isExpanded ? contentExpanded : contentCollapsed }, /* @__PURE__ */ React224.createElement(Box, { paddingTop: "12" }, /* @__PURE__ */ React224.createElement(
+    /* @__PURE__ */ React225.createElement(Text, { size: "12", color: "tertiaryText" }, "More details"),
+    /* @__PURE__ */ React225.createElement(Box, { display: "flex", alignItems: "center", justifyContent: "center" }, isLoaded ? /* @__PURE__ */ React225.createElement(ArrowIcon, { direction: isExpanded ? "down" : "right" }) : /* @__PURE__ */ React225.createElement(FunSkeletonCircle, { size: "16" }))
+  ), isLoaded && /* @__PURE__ */ React225.createElement(Box, { className: isExpanded ? contentExpanded : contentCollapsed }, /* @__PURE__ */ React225.createElement(Box, { paddingTop: "12" }, /* @__PURE__ */ React225.createElement(
     DirectExecutionOrderDetailSection,
     {
       directExecution
@@ -25302,13 +25389,13 @@ function DirectExecutionOrderDetailSection({
   const { isProcessing, isFailed, isRefunded, isCompleted } = useCheckoutDirectExecutionHistory({ initDirectExecution: directExecution });
   const { txHash, createdTimeMs, fromChainId, toChainId, listenerInfo } = directExecution;
   const updateTime = getDirectExecutionUpdatedTimeMs({ directExecution });
-  return /* @__PURE__ */ React224.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, "Deposit tx"), /* @__PURE__ */ React224.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress7(txHash)), /* @__PURE__ */ React224.createElement(TransactionRedirectButton, { chainId: fromChainId, txHash }))), isCompleted && listenerInfo?.txHashes?.[0] ? /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, "Completion tx"), /* @__PURE__ */ React224.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress7(listenerInfo.txHashes[0])), /* @__PURE__ */ React224.createElement(
+  return /* @__PURE__ */ React225.createElement(Box, { display: "flex", flexDirection: "column", gap: "12" }, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, "Deposit tx"), /* @__PURE__ */ React225.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress7(txHash)), /* @__PURE__ */ React225.createElement(TransactionRedirectButton, { chainId: fromChainId, txHash }))), isCompleted && listenerInfo?.txHashes?.[0] ? /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, "Completion tx"), /* @__PURE__ */ React225.createElement(Box, { display: "flex", alignItems: "center", gap: "4" }, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, formatAddress7(listenerInfo.txHashes[0])), /* @__PURE__ */ React225.createElement(
     TransactionRedirectButton,
     {
       chainId: toChainId,
       txHash: listenerInfo.txHashes[0]
     }
-  ))) : null, /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, "Order submitted"), /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp2(createdTimeMs))), !isProcessing && updateTime && /* @__PURE__ */ React224.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, `Order ${isFailed ? "failed" : isRefunded ? "refunded" : "filled"}`), /* @__PURE__ */ React224.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp2(updateTime))));
+  ))) : null, /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, "Order submitted"), /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp2(createdTimeMs))), !isProcessing && updateTime && /* @__PURE__ */ React225.createElement(FunTxSummaryLineItem, null, /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, `Order ${isFailed ? "failed" : isRefunded ? "refunded" : "filled"}`), /* @__PURE__ */ React225.createElement(Text, { color: "tertiaryText", size: "12" }, getTimestamp2(updateTime))));
 }
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryContent.tsx
@@ -25328,7 +25415,7 @@ function FunCheckoutHistoryContent({
   });
   const isDirectExecutionRecord = isCheckoutHistoryDirectExecution(depositAddress);
   if (isDirectExecutionRecord && directExecution) {
-    return /* @__PURE__ */ React225.createElement(
+    return /* @__PURE__ */ React226.createElement(
       FunDirectExecutionHistoryDetail,
       {
         bottomBarId,
@@ -25339,7 +25426,7 @@ function FunCheckoutHistoryContent({
       }
     );
   }
-  return /* @__PURE__ */ React225.createElement(Box, null, currentPage === "detail" /* DETAIL */ ? /* @__PURE__ */ React225.createElement(
+  return /* @__PURE__ */ React226.createElement(Box, null, currentPage === "detail" /* DETAIL */ ? /* @__PURE__ */ React226.createElement(
     FunCheckoutHistoryDetail,
     {
       includeGenerateActionsParams,
@@ -25349,7 +25436,7 @@ function FunCheckoutHistoryContent({
       onClose,
       onAnimationComplete
     }
-  ) : currentPage === "help" /* HELP */ ? /* @__PURE__ */ React225.createElement(
+  ) : currentPage === "help" /* HELP */ ? /* @__PURE__ */ React226.createElement(
     FunCheckoutHistoryHelp,
     {
       checkoutHistoryInfo,
@@ -25361,7 +25448,7 @@ function FunCheckoutHistoryContent({
 
 // src/components/FunCheckoutHistory/useCustomStatusAnimationAboveTopbar.tsx
 import { clamp as clamp3 } from "@funkit/utils";
-import React226, { useRef as useRef21, useState as useState60 } from "react";
+import React227, { useRef as useRef21, useState as useState60 } from "react";
 var TOPBAR_HEIGHT = 56;
 var DURATION_MS = 200;
 var STATUS_SIZE_PENDING = 76;
@@ -25399,7 +25486,7 @@ function useCustomStatusAnimationAboveTopbar({
   };
   return {
     onScroll: (event) => setScrollPos(event.target.scrollTop),
-    topbar: /* @__PURE__ */ React226.createElement(React226.Fragment, null, /* @__PURE__ */ React226.createElement("div", { className: topbarFadeWrapper }, topbar, /* @__PURE__ */ React226.createElement(
+    topbar: /* @__PURE__ */ React227.createElement(React227.Fragment, null, /* @__PURE__ */ React227.createElement("div", { className: topbarFadeWrapper }, topbar, /* @__PURE__ */ React227.createElement(
       "div",
       {
         className: topbarFadeBackground,
@@ -25408,7 +25495,7 @@ function useCustomStatusAnimationAboveTopbar({
           transition: `opacity ${DURATION_MS / 1e3}s ease-in`
         }
       }
-    )), isCheckoutDetailView && depositAddress && /* @__PURE__ */ React226.createElement(
+    )), isCheckoutDetailView && depositAddress && /* @__PURE__ */ React227.createElement(
       "div",
       {
         className: topbarOverflowContent,
@@ -25426,7 +25513,7 @@ function useCustomStatusAnimationAboveTopbar({
           top: TOPBAR_HEIGHT + paddingTop - scrollPos
         }
       },
-      isCheckoutHistoryDirectExecution(depositAddress) ? /* @__PURE__ */ React226.createElement(FunDirectExecutionStatus, { directExecution: directExecutionInfo }) : /* @__PURE__ */ React226.createElement(FunCheckoutStatus, { checkoutHistoryItem: checkoutHistoryInfo })
+      isCheckoutHistoryDirectExecution(depositAddress) ? /* @__PURE__ */ React227.createElement(FunDirectExecutionStatus, { directExecution: directExecutionInfo }) : /* @__PURE__ */ React227.createElement(FunCheckoutStatus, { checkoutHistoryItem: checkoutHistoryInfo })
     )),
     withTopDivider: isCheckoutDetailView ? scrollPos > startFadePos ? "scroll" : "never" : withTopDivider
   };
@@ -25444,14 +25531,14 @@ function useCheckoutModalTitle(depositAddress, defaultTitle) {
 import { IN_PROGRESS_CHECKOUT_STATES as IN_PROGRESS_CHECKOUT_STATES2 } from "@funkit/api-base";
 import { formatTimestampToDate, fullMonthNames } from "@funkit/utils";
 import clsx20 from "clsx";
-import React235, { useEffect as useEffect44, useMemo as useMemo43, useRef as useRef22, useState as useState62 } from "react";
+import React236, { useEffect as useEffect44, useMemo as useMemo43, useRef as useRef22, useState as useState62 } from "react";
 import { Virtuoso } from "react-virtuoso";
 import { useAccount as useAccount6 } from "wagmi";
 
 // src/components/Icons/GreenRoundCheckmark.tsx
-import React227 from "react";
+import React228 from "react";
 var GreenRoundCheckmark = ({ size = 15 }) => {
-  return /* @__PURE__ */ React227.createElement(
+  return /* @__PURE__ */ React228.createElement(
     "svg",
     {
       width: size,
@@ -25460,7 +25547,7 @@ var GreenRoundCheckmark = ({ size = 15 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React227.createElement(
+    /* @__PURE__ */ React228.createElement(
       "path",
       {
         d: "M5 10.4551C4.31315 10.4551 3.66862 10.3249 3.06641 10.0645C2.46419 9.80729 1.93522 9.45085 1.47949 8.99512C1.02376 8.53613 0.66569 8.00716 0.405273 7.4082C0.148112 6.80599 0.0195312 6.16146 0.0195312 5.47461C0.0195312 4.78776 0.148112 4.14323 0.405273 3.54102C0.66569 2.9388 1.02376 2.40983 1.47949 1.9541C1.93522 1.49837 2.46419 1.14193 3.06641 0.884766C3.66862 0.624349 4.31315 0.494141 5 0.494141C5.68685 0.494141 6.33138 0.624349 6.93359 0.884766C7.53581 1.14193 8.06478 1.49837 8.52051 1.9541C8.97624 2.40983 9.33268 2.9388 9.58984 3.54102C9.85026 4.14323 9.98047 4.78776 9.98047 5.47461C9.98047 6.16146 9.85026 6.80599 9.58984 7.4082C9.33268 8.00716 8.97624 8.53613 8.52051 8.99512C8.06478 9.45085 7.53581 9.80729 6.93359 10.0645C6.33138 10.3249 5.68685 10.4551 5 10.4551ZM4.45312 7.85742C4.53776 7.85742 4.61426 7.83789 4.68262 7.79883C4.75098 7.75977 4.8112 7.70117 4.86328 7.62305L7.1582 4.00488C7.1875 3.95605 7.21517 3.90397 7.24121 3.84863C7.26725 3.79329 7.28027 3.73796 7.28027 3.68262C7.28027 3.56868 7.23796 3.47917 7.15332 3.41406C7.06868 3.3457 6.97428 3.31152 6.87012 3.31152C6.72689 3.31152 6.6097 3.38639 6.51855 3.53613L4.43359 6.88574L3.44238 5.60645C3.38053 5.52507 3.32031 5.46973 3.26172 5.44043C3.20638 5.41113 3.1429 5.39648 3.07129 5.39648C2.96061 5.39648 2.86784 5.43717 2.79297 5.51855C2.7181 5.59668 2.68066 5.69108 2.68066 5.80176C2.68066 5.8571 2.69043 5.91243 2.70996 5.96777C2.73275 6.01986 2.76204 6.07031 2.79785 6.11914L4.02344 7.62305C4.08854 7.70768 4.15527 7.7679 4.22363 7.80371C4.29199 7.83952 4.36849 7.85742 4.45312 7.85742Z",
@@ -25471,10 +25558,10 @@ var GreenRoundCheckmark = ({ size = 15 }) => {
 };
 
 // src/modals/ProfileDetails/FunProfileViews/Home/BalanceSection.tsx
-import React228 from "react";
+import React229 from "react";
 import { formatCurrencyAndStringify as formatCurrencyAndStringify12 } from "@funkit/utils";
 var BalanceSection = ({ totalBalance }) => {
-  return /* @__PURE__ */ React228.createElement(Box, { display: "flex", flexDirection: "column", gap: "16" }, /* @__PURE__ */ React228.createElement(Box, { display: "flex", justifyContent: "center", alignItems: "center" }, /* @__PURE__ */ React228.createElement(Text, { as: "h1", color: "primaryText", weight: "medium", size: "40" }, formatCurrencyAndStringify12(
+  return /* @__PURE__ */ React229.createElement(Box, { display: "flex", flexDirection: "column", gap: "16" }, /* @__PURE__ */ React229.createElement(Box, { display: "flex", justifyContent: "center", alignItems: "center" }, /* @__PURE__ */ React229.createElement(Text, { as: "h1", color: "primaryText", weight: "medium", size: "40" }, formatCurrencyAndStringify12(
     Number.parseFloat(totalBalance.toString())
   ))));
 };
@@ -25493,12 +25580,12 @@ import {
   isNotNullish as isNotNullish11
 } from "@funkit/utils";
 import clsx19 from "clsx";
-import React230 from "react";
+import React231 from "react";
 
 // src/components/Icons/RedRoundErrorCross.tsx
-import React229 from "react";
+import React230 from "react";
 var RedRoundErrorCross = ({ size = 15 }) => {
-  return /* @__PURE__ */ React229.createElement(
+  return /* @__PURE__ */ React230.createElement(
     "svg",
     {
       width: size,
@@ -25507,8 +25594,8 @@ var RedRoundErrorCross = ({ size = 15 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React229.createElement("circle", { cx: "4", cy: "4.5", r: "4", fill: "#F34126" }),
-    /* @__PURE__ */ React229.createElement(
+    /* @__PURE__ */ React230.createElement("circle", { cx: "4", cy: "4.5", r: "4", fill: "#F34126" }),
+    /* @__PURE__ */ React230.createElement(
       "path",
       {
         d: "M2.57111 2.59761L4 4.02654L5.42889 2.59761C5.54807 2.47844 5.7369 2.46734 5.87797 2.57755L5.90238 2.59979C6.03254 2.72994 6.03254 2.94096 5.90238 3.07111L4.47346 4.5L5.90238 5.92889C6.02156 6.04806 6.03266 6.2369 5.92244 6.37797L5.90022 6.40239C5.77007 6.53254 5.55904 6.53254 5.42888 6.40238L4 4.97346L2.57111 6.40239C2.45193 6.52156 2.2631 6.53266 2.12203 6.42245L2.09761 6.40021C1.96746 6.27006 1.96746 6.05904 2.09761 5.92889L3.52654 4.5L2.09761 3.07111C1.97844 2.95194 1.96734 2.7631 2.07755 2.62203L2.09978 2.59761C2.22993 2.46746 2.44095 2.46746 2.57111 2.59761ZM2.36024 6.33149L2.35293 6.33242C2.35536 6.33217 2.3578 6.33185 2.36024 6.33149ZM2.31088 6.33152L2.31385 6.33194L2.31088 6.33152ZM2.3814 6.3269L2.37242 6.3292C2.37542 6.32852 2.37842 6.32775 2.3814 6.3269ZM2.40026 6.32026L2.39333 6.323C2.39564 6.32215 2.39795 6.32123 2.40026 6.32026ZM2.25106 6.31043L2.23334 6.29839C2.24074 6.30415 2.2485 6.30919 2.25656 6.31353L2.25106 6.31043ZM2.41976 6.31047L2.4144 6.31349C2.4144 6.31349 2.41796 6.31153 2.41976 6.31047ZM5.81353 6.24343L5.81042 6.24894L5.79839 6.26667C5.80415 6.25927 5.80919 6.25149 5.81353 6.24343ZM5.82275 6.2231L5.82025 6.22939C5.82114 6.22729 5.82197 6.2252 5.82275 6.2231ZM5.82913 6.20184L5.82703 6.21006C5.82778 6.20739 5.8285 6.20462 5.82913 6.20184ZM5.83241 6.18215L5.83152 6.18912C5.83186 6.18683 5.83216 6.18449 5.83241 6.18215ZM5.66455 2.83328L4 4.49787L2.33545 2.83328L2.33327 2.83545L3.99787 4.5L2.33327 6.16455L2.33545 6.16672L4 4.50213L5.66455 6.16672L5.66673 6.16455L4.00213 4.5L5.66673 2.83545L5.66455 2.83328ZM5.83331 6.16189L5.83332 6.16672L5.83331 6.16189ZM5.83149 6.13977L5.83242 6.14707C5.83216 6.14465 5.83186 6.1422 5.83149 6.13977ZM5.8269 6.1186L5.8292 6.12758C5.82852 6.12458 5.82776 6.12158 5.8269 6.1186ZM5.82026 6.09974L5.823 6.10667C5.82214 6.10436 5.82123 6.10204 5.82026 6.09974ZM5.81048 6.08024L5.81349 6.0856C5.81349 6.0856 5.81153 6.08203 5.81048 6.08024ZM2.18651 2.9144L2.18903 2.9189L2.18651 2.9144ZM2.177 2.89333L2.17924 2.89907C2.17845 2.89716 2.17772 2.89526 2.177 2.89333ZM2.1708 2.87242L2.17226 2.87835C2.17174 2.87638 2.17125 2.87441 2.1708 2.87242ZM2.16751 2.85227L2.16806 2.85705L2.16751 2.85227ZM2.16674 2.83061L2.16667 2.83545L2.16674 2.83061ZM2.16848 2.81088L2.16806 2.81385L2.16848 2.81088ZM2.18957 2.75106L2.20161 2.73333C2.19585 2.74073 2.1908 2.74851 2.18647 2.75657L2.18957 2.75106ZM2.41433 2.68647L2.41984 2.68957L2.43756 2.70161C2.43016 2.69585 2.42238 2.69081 2.41433 2.68647ZM5.5856 2.68651L5.5811 2.68903L5.5856 2.68651ZM2.2565 2.68651L2.25199 2.68903L2.2565 2.68651ZM5.74344 2.68647L5.74894 2.68957L5.76666 2.70161C5.75926 2.69585 5.75149 2.69081 5.74344 2.68647ZM2.27691 2.67725L2.27183 2.67924L2.27691 2.67725ZM2.3933 2.67699L2.40029 2.67975C2.39796 2.67877 2.39564 2.67785 2.3933 2.67699ZM5.60667 2.677L5.60093 2.67924C5.60284 2.67846 5.60473 2.67771 5.60667 2.677ZM5.7231 2.67725L5.72939 2.67975C5.72729 2.67887 5.7252 2.67804 5.7231 2.67725ZM2.29821 2.67086L2.29254 2.67226L2.29821 2.67086ZM2.37241 2.6708L2.38143 2.6731C2.37842 2.67225 2.37542 2.67148 2.37241 2.6708ZM5.62758 2.6708L5.62165 2.67226C5.62363 2.67173 5.62559 2.67125 5.62758 2.6708ZM5.70184 2.67087L5.71006 2.67297C5.7074 2.67221 5.70463 2.67151 5.70184 2.67087ZM2.31856 2.66752L2.31385 2.66806L2.31856 2.66752ZM2.35224 2.66751L2.36022 2.66851C2.35757 2.66811 2.35491 2.66778 2.35224 2.66751ZM5.64774 2.66751L5.64295 2.66806L5.64774 2.66751ZM5.68148 2.66752L5.68912 2.66848C5.68661 2.6681 5.68405 2.66778 5.68148 2.66752ZM5.65972 2.66674L5.66941 2.66674C5.66618 2.66664 5.66295 2.66664 5.65972 2.66674ZM2.33059 2.66674L2.34028 2.66674C2.33705 2.66664 2.33382 2.66664 2.33059 2.66674Z",
@@ -25543,7 +25630,7 @@ var HomeCheckoutDisplayRow = ({
   const checkoutClientMetadata = checkoutHistoryItem.clientMetadata;
   const getStatusElement = () => {
     if (isCompleted) {
-      return /* @__PURE__ */ React230.createElement(
+      return /* @__PURE__ */ React231.createElement(
         Box,
         {
           display: "flex",
@@ -25551,12 +25638,12 @@ var HomeCheckoutDisplayRow = ({
           gap: STATUS_FLEX_GAP_X,
           alignItems: "center"
         },
-        /* @__PURE__ */ React230.createElement(GreenRoundCheckmark, { size: Number.parseInt(STATUS_ICON_SIZE) }),
-        /* @__PURE__ */ React230.createElement(Text, { size: STATUS_TEXT_SIZE, color: "success" }, "Completed")
+        /* @__PURE__ */ React231.createElement(GreenRoundCheckmark, { size: Number.parseInt(STATUS_ICON_SIZE) }),
+        /* @__PURE__ */ React231.createElement(Text, { size: STATUS_TEXT_SIZE, color: "success" }, "Completed")
       );
     }
     if (isError || isFailed || isExpired) {
-      return /* @__PURE__ */ React230.createElement(
+      return /* @__PURE__ */ React231.createElement(
         Box,
         {
           display: "flex",
@@ -25564,12 +25651,12 @@ var HomeCheckoutDisplayRow = ({
           gap: STATUS_FLEX_GAP_X,
           alignItems: "center"
         },
-        /* @__PURE__ */ React230.createElement(RedRoundErrorCross, { size: Number.parseInt(STATUS_ICON_SIZE) }),
-        /* @__PURE__ */ React230.createElement(Text, { size: STATUS_TEXT_SIZE, color: "error" }, "Failed")
+        /* @__PURE__ */ React231.createElement(RedRoundErrorCross, { size: Number.parseInt(STATUS_ICON_SIZE) }),
+        /* @__PURE__ */ React231.createElement(Text, { size: STATUS_TEXT_SIZE, color: "error" }, "Failed")
       );
     }
     if (isProcessing) {
-      return /* @__PURE__ */ React230.createElement(
+      return /* @__PURE__ */ React231.createElement(
         Box,
         {
           display: "flex",
@@ -25577,7 +25664,7 @@ var HomeCheckoutDisplayRow = ({
           gap: STATUS_FLEX_GAP_X,
           alignItems: "center"
         },
-        /* @__PURE__ */ React230.createElement(
+        /* @__PURE__ */ React231.createElement(
           Box,
           {
             width: STATUS_ICON_SIZE,
@@ -25586,11 +25673,11 @@ var HomeCheckoutDisplayRow = ({
             background: "standby"
           }
         ),
-        /* @__PURE__ */ React230.createElement(Text, { size: STATUS_TEXT_SIZE, color: "standby" }, "Processing")
+        /* @__PURE__ */ React231.createElement(Text, { size: STATUS_TEXT_SIZE, color: "standby" }, "Processing")
       );
     }
   };
-  return /* @__PURE__ */ React230.createElement(
+  return /* @__PURE__ */ React231.createElement(
     Box,
     {
       className: clsx19(
@@ -25615,7 +25702,7 @@ var HomeCheckoutDisplayRow = ({
         }
       }
     },
-    /* @__PURE__ */ React230.createElement(Box, { display: "flex", alignItems: "center", gap: ROW_FLEX_GAP_X, width: "full" }, isNotNullish11(checkoutClientMetadata.initSettings.config.iconSrc) && /* @__PURE__ */ React230.createElement(
+    /* @__PURE__ */ React231.createElement(Box, { display: "flex", alignItems: "center", gap: ROW_FLEX_GAP_X, width: "full" }, isNotNullish11(checkoutClientMetadata.initSettings.config.iconSrc) && /* @__PURE__ */ React231.createElement(
       Box,
       {
         display: "flex",
@@ -25626,7 +25713,7 @@ var HomeCheckoutDisplayRow = ({
           minWidth: "29px"
         }
       },
-      /* @__PURE__ */ React230.createElement(
+      /* @__PURE__ */ React231.createElement(
         FunAssetAvatar,
         {
           assetSrc: checkoutClientMetadata.initSettings.config.iconSrc,
@@ -25636,7 +25723,7 @@ var HomeCheckoutDisplayRow = ({
           chainId: checkoutClientMetadata.initSettings.config.targetChain
         }
       )
-    ), /* @__PURE__ */ React230.createElement(Box, { display: "flex", flexDirection: "column", width: "full" }, /* @__PURE__ */ React230.createElement(
+    ), /* @__PURE__ */ React231.createElement(Box, { display: "flex", flexDirection: "column", width: "full" }, /* @__PURE__ */ React231.createElement(
       Box,
       {
         display: "flex",
@@ -25644,19 +25731,19 @@ var HomeCheckoutDisplayRow = ({
         alignItems: "center",
         gap: "16"
       },
-      /* @__PURE__ */ React230.createElement(Text, { size: TEXT_SIZE_MEDIUM2, weight: "medium", color: "primaryText" }, checkoutClientMetadata.initSettings.config.checkoutItemTitle),
-      /* @__PURE__ */ React230.createElement(Text, { size: TEXT_SIZE_MEDIUM2, weight: "medium", color: "primaryText" }, `${formatCurrencyAndStringify13(
+      /* @__PURE__ */ React231.createElement(Text, { size: TEXT_SIZE_MEDIUM2, weight: "medium", color: "primaryText" }, checkoutClientMetadata.initSettings.config.checkoutItemTitle),
+      /* @__PURE__ */ React231.createElement(Text, { size: TEXT_SIZE_MEDIUM2, weight: "medium", color: "primaryText" }, `${formatCurrencyAndStringify13(
         checkoutClientMetadata?.finalDollarValue || 0
       )} USD`)
-    ), /* @__PURE__ */ React230.createElement(Box, { display: "flex", justifyContent: "space-between", gap: "16" }, /* @__PURE__ */ React230.createElement(Text, { size: TEXT_SIZE_SMALL2, color: "secondaryText" }, formatTimestamp3(new Date(checkoutHistoryItem.createdTimeMs), {
+    ), /* @__PURE__ */ React231.createElement(Box, { display: "flex", justifyContent: "space-between", gap: "16" }, /* @__PURE__ */ React231.createElement(Text, { size: TEXT_SIZE_SMALL2, color: "secondaryText" }, formatTimestamp3(new Date(checkoutHistoryItem.createdTimeMs), {
       year: "none",
       seconds: "none",
       month: "short"
-    })), /* @__PURE__ */ React230.createElement(Box, null, getStatusElement()))))
+    })), /* @__PURE__ */ React231.createElement(Box, null, getStatusElement()))))
   );
 };
 var HomeCheckoutDisplayRowSkeleton = () => {
-  return /* @__PURE__ */ React230.createElement(
+  return /* @__PURE__ */ React231.createElement(
     Box,
     {
       display: "flex",
@@ -25666,8 +25753,8 @@ var HomeCheckoutDisplayRowSkeleton = () => {
       paddingX: PROFILE_SIDE_PADDING,
       paddingY: ROW_PADDING_Y
     },
-    /* @__PURE__ */ React230.createElement(FunSkeletonCircle, { size: DEFAULT_ICON_SIZE }),
-    /* @__PURE__ */ React230.createElement(Box, { display: "flex", flexDirection: "column", style: { flexGrow: 1 } }, /* @__PURE__ */ React230.createElement(
+    /* @__PURE__ */ React231.createElement(FunSkeletonCircle, { size: DEFAULT_ICON_SIZE }),
+    /* @__PURE__ */ React231.createElement(Box, { display: "flex", flexDirection: "column", style: { flexGrow: 1 } }, /* @__PURE__ */ React231.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE_MEDIUM2,
@@ -25675,7 +25762,7 @@ var HomeCheckoutDisplayRowSkeleton = () => {
         marginTop: TEXT_SKELETON_MARGIN_TOP2,
         width: TEXT_SKELETON_WIDTH_LONG2
       }
-    ), /* @__PURE__ */ React230.createElement(
+    ), /* @__PURE__ */ React231.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE_SMALL2,
@@ -25684,7 +25771,7 @@ var HomeCheckoutDisplayRowSkeleton = () => {
         width: TEXT_SKELETON_WIDTH_MEDIUM
       }
     )),
-    /* @__PURE__ */ React230.createElement(Box, { alignItems: "flex-end", display: "flex", flexDirection: "column" }, /* @__PURE__ */ React230.createElement(
+    /* @__PURE__ */ React231.createElement(Box, { alignItems: "flex-end", display: "flex", flexDirection: "column" }, /* @__PURE__ */ React231.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE_MEDIUM2,
@@ -25692,7 +25779,7 @@ var HomeCheckoutDisplayRowSkeleton = () => {
         marginTop: TEXT_SKELETON_MARGIN_TOP2,
         width: TEXT_SKELETON_WIDTH_MEDIUM
       }
-    ), /* @__PURE__ */ React230.createElement(
+    ), /* @__PURE__ */ React231.createElement(
       FunSkeletonBlock,
       {
         height: STATUS_TEXT_SIZE,
@@ -25710,7 +25797,7 @@ import {
   formatCurrencyAndStringify as formatCurrencyAndStringify14,
   isMobile as isMobile10
 } from "@funkit/utils";
-import React231 from "react";
+import React232 from "react";
 var TEXT_SIZE = "13";
 var TEXT_SKELETON_MARGIN_TOP3 = "2";
 var TEXT_SKELETON_MARGIN_BOTTOM3 = "3";
@@ -25725,7 +25812,7 @@ var HomeTokenBalanceDisplayRow = ({
     asset.tokenBalance,
     asset.decimals
   );
-  return /* @__PURE__ */ React231.createElement(
+  return /* @__PURE__ */ React232.createElement(
     Box,
     {
       display: "flex",
@@ -25739,7 +25826,7 @@ var HomeTokenBalanceDisplayRow = ({
       paddingY: ROW_PADDING_Y2,
       className: baseStyles4
     },
-    /* @__PURE__ */ React231.createElement(
+    /* @__PURE__ */ React232.createElement(
       Box,
       {
         display: "flex",
@@ -25748,7 +25835,7 @@ var HomeTokenBalanceDisplayRow = ({
         alignItems: "flex-start",
         height: "full"
       },
-      /* @__PURE__ */ React231.createElement(
+      /* @__PURE__ */ React232.createElement(
         FunAssetAvatar,
         {
           assetSrc: asset.logo,
@@ -25758,22 +25845,22 @@ var HomeTokenBalanceDisplayRow = ({
           assetIconSize: DEFAULT_ICON_SIZE
         }
       ),
-      /* @__PURE__ */ React231.createElement(
+      /* @__PURE__ */ React232.createElement(
         Box,
         {
           display: "flex",
           flexDirection: "column",
           justifyContent: "space-between"
         },
-        /* @__PURE__ */ React231.createElement(Text, { color: "primaryText", size: TEXT_SIZE, weight: "regular" }, asset.name),
-        /* @__PURE__ */ React231.createElement(Text, { color: "secondaryText", size: TEXT_SIZE, weight: "regular" }, formatCryptoAndStringify8(normalizedAmount, asset.symbol))
+        /* @__PURE__ */ React232.createElement(Text, { color: "primaryText", size: TEXT_SIZE, weight: "regular" }, asset.name),
+        /* @__PURE__ */ React232.createElement(Text, { color: "secondaryText", size: TEXT_SIZE, weight: "regular" }, formatCryptoAndStringify8(normalizedAmount, asset.symbol))
       )
     ),
-    /* @__PURE__ */ React231.createElement(Text, { color: "primaryText", size: TEXT_SIZE, weight: "regular" }, formatCurrencyAndStringify14(asset.totalUsdValue || 0))
+    /* @__PURE__ */ React232.createElement(Text, { color: "primaryText", size: TEXT_SIZE, weight: "regular" }, formatCurrencyAndStringify14(asset.totalUsdValue || 0))
   );
 };
 var HomeTokenBalanceDisplayRowSkeleton = () => {
-  return /* @__PURE__ */ React231.createElement(
+  return /* @__PURE__ */ React232.createElement(
     Box,
     {
       display: "flex",
@@ -25783,8 +25870,8 @@ var HomeTokenBalanceDisplayRowSkeleton = () => {
       paddingX: PROFILE_SIDE_PADDING,
       paddingY: ROW_PADDING_Y2
     },
-    /* @__PURE__ */ React231.createElement(FunSkeletonCircle, { size: DEFAULT_ICON_SIZE }),
-    /* @__PURE__ */ React231.createElement(Box, { display: "flex", flexDirection: "column", style: { flexGrow: 1 } }, /* @__PURE__ */ React231.createElement(
+    /* @__PURE__ */ React232.createElement(FunSkeletonCircle, { size: DEFAULT_ICON_SIZE }),
+    /* @__PURE__ */ React232.createElement(Box, { display: "flex", flexDirection: "column", style: { flexGrow: 1 } }, /* @__PURE__ */ React232.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE,
@@ -25792,7 +25879,7 @@ var HomeTokenBalanceDisplayRowSkeleton = () => {
         marginTop: TEXT_SKELETON_MARGIN_TOP3,
         width: TEXT_SKELETON_WIDTH_SHORT3
       }
-    ), /* @__PURE__ */ React231.createElement(
+    ), /* @__PURE__ */ React232.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE,
@@ -25801,7 +25888,7 @@ var HomeTokenBalanceDisplayRowSkeleton = () => {
         width: TEXT_SKELETON_WIDTH_LONG3
       }
     )),
-    /* @__PURE__ */ React231.createElement(
+    /* @__PURE__ */ React232.createElement(
       FunSkeletonBlock,
       {
         height: TEXT_SIZE,
@@ -25814,13 +25901,13 @@ var HomeTokenBalanceDisplayRowSkeleton = () => {
 };
 
 // src/modals/ProfileDetails/FunProfileViews/Home/ProfileTitleSection.tsx
-import React234 from "react";
+import React235 from "react";
 import { useCallback as useCallback42, useState as useState61 } from "react";
 
 // src/components/Icons/LogoutIcon.tsx
-import React232 from "react";
+import React233 from "react";
 var LogoutIcon = ({ size = 16 }) => {
-  return /* @__PURE__ */ React232.createElement(
+  return /* @__PURE__ */ React233.createElement(
     "svg",
     {
       width: size,
@@ -25829,7 +25916,7 @@ var LogoutIcon = ({ size = 16 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React232.createElement(
+    /* @__PURE__ */ React233.createElement(
       "path",
       {
         d: "M9.33463 13.3337H4.0013C3.26492 13.3337 2.66797 12.7367 2.66797 12.0003V4.00033C2.66797 3.26395 3.26492 2.66699 4.0013 2.66699H9.33463M6.66797 8.00033H14.0013M14.0013 8.00033L12.0013 10.0003M14.0013 8.00033L12.0013 6.00033",
@@ -25844,9 +25931,9 @@ var LogoutIcon = ({ size = 16 }) => {
 };
 
 // src/components/Icons/SettingsIcon.tsx
-import React233 from "react";
+import React234 from "react";
 var SettingsIcon = ({ size = 16 }) => {
-  return /* @__PURE__ */ React233.createElement(
+  return /* @__PURE__ */ React234.createElement(
     "svg",
     {
       width: size,
@@ -25855,14 +25942,14 @@ var SettingsIcon = ({ size = 16 }) => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React233.createElement(
+    /* @__PURE__ */ React234.createElement(
       "path",
       {
         d: "M8.75 10.167C9.85457 10.167 10.75 9.27156 10.75 8.16699C10.75 7.06242 9.85457 6.16699 8.75 6.16699C7.64543 6.16699 6.75 7.06242 6.75 8.16699C6.75 9.27156 7.64543 10.167 8.75 10.167Z",
         stroke: "currentColor"
       }
     ),
-    /* @__PURE__ */ React233.createElement(
+    /* @__PURE__ */ React234.createElement(
       "path",
       {
         d: "M9.92726 1.60149C9.68219 1.5 9.37159 1.5 8.75032 1.5C8.12906 1.5 7.81846 1.5 7.57339 1.60149C7.2467 1.73682 6.98714 1.99639 6.85181 2.32309C6.79004 2.47223 6.76586 2.64567 6.7564 2.89866C6.7425 3.27045 6.55183 3.61459 6.22962 3.80062C5.90742 3.98664 5.51405 3.97969 5.18512 3.80584C4.96129 3.68753 4.799 3.62175 4.63895 3.60068C4.28835 3.55452 3.93378 3.64953 3.65323 3.8648C3.44282 4.02625 3.2875 4.29527 2.97688 4.83329C2.66625 5.37131 2.51094 5.64032 2.47632 5.90327C2.43016 6.25387 2.52517 6.60844 2.74044 6.889C2.8387 7.01707 2.97679 7.12467 3.19112 7.25933C3.50619 7.45733 3.70892 7.7946 3.7089 8.16667C3.70888 8.53873 3.50616 8.87593 3.19111 9.07387C2.97676 9.2086 2.83864 9.31627 2.74038 9.44433C2.5251 9.72487 2.4301 10.0794 2.47626 10.43C2.51087 10.6929 2.66618 10.962 2.97681 11.5C3.28744 12.038 3.44276 12.3071 3.65316 12.4685C3.93371 12.6837 4.28828 12.7787 4.63888 12.7326C4.79892 12.7115 4.9612 12.6457 5.18502 12.5275C5.51397 12.3536 5.90736 12.3467 6.22959 12.5327C6.55182 12.7187 6.7425 13.0629 6.7564 13.4347C6.76586 13.6877 6.79004 13.8611 6.85181 14.0103C6.98714 14.3369 7.2467 14.5965 7.57339 14.7319C7.81846 14.8333 8.12906 14.8333 8.75032 14.8333C9.37159 14.8333 9.68219 14.8333 9.92726 14.7319C10.2539 14.5965 10.5135 14.3369 10.6488 14.0103C10.7106 13.8611 10.7348 13.6877 10.7443 13.4347C10.7581 13.0629 10.9488 12.7187 11.271 12.5327C11.5932 12.3466 11.9866 12.3536 12.3156 12.5275C12.5394 12.6457 12.7017 12.7115 12.8617 12.7325C13.2123 12.7787 13.5669 12.6837 13.8474 12.4685C14.0578 12.307 14.2131 12.038 14.5237 11.4999C14.8344 10.9619 14.9897 10.6929 15.0243 10.43C15.0705 10.0794 14.9755 9.7248 14.7602 9.44427C14.6619 9.3162 14.5238 9.20853 14.3095 9.07387C13.9945 8.87593 13.7917 8.53867 13.7917 8.1666C13.7917 7.79453 13.9945 7.4574 14.3095 7.25947C14.5239 7.12473 14.662 7.01713 14.7603 6.889C14.9755 6.60849 15.0705 6.25391 15.0244 5.90331C14.9898 5.64037 14.8345 5.37135 14.5238 4.83333C14.2132 4.29531 14.0579 4.0263 13.8475 3.86485C13.5669 3.64957 13.2123 3.55457 12.8617 3.60073C12.7017 3.62179 12.5395 3.68757 12.3156 3.80587C11.9867 3.97973 11.5933 3.98668 11.2711 3.80064C10.9488 3.61461 10.7581 3.27044 10.7443 2.89863C10.7348 2.64565 10.7106 2.47222 10.6488 2.32309C10.5135 1.99639 10.2539 1.73682 9.92726 1.60149Z",
@@ -25888,7 +25975,7 @@ var ProfileTitleSection = ({
     []
   );
   const isDydx = isDydxCustomer(apiKey);
-  return /* @__PURE__ */ React234.createElement(
+  return /* @__PURE__ */ React235.createElement(
     Box,
     {
       display: "flex",
@@ -25897,7 +25984,7 @@ var ProfileTitleSection = ({
       width: "full",
       minHeight: "28"
     },
-    /* @__PURE__ */ React234.createElement(
+    /* @__PURE__ */ React235.createElement(
       Box,
       {
         display: "flex",
@@ -25906,7 +25993,7 @@ var ProfileTitleSection = ({
         gap: "8",
         className: animateOut ? animateTitleOutClass : animateTitleInClass
       },
-      !isDydx && account.address && /* @__PURE__ */ React234.createElement(
+      !isDydx && account.address && /* @__PURE__ */ React235.createElement(
         Avatar,
         {
           address: account.address,
@@ -25915,21 +26002,21 @@ var ProfileTitleSection = ({
           size: 20
         }
       ),
-      /* @__PURE__ */ React234.createElement(Text, { color: "primaryText", size: "13", weight: "medium" }, isDydx ? "Checkouts" : userInfo.nameTruncated)
+      /* @__PURE__ */ React235.createElement(Text, { color: "primaryText", size: "13", weight: "medium" }, isDydx ? "Checkouts" : userInfo.nameTruncated)
     ),
-    /* @__PURE__ */ React234.createElement(Box, { display: "flex", alignItems: "center", flexDirection: "row" }, !isDisconnectExpanded && !isDydx && /* @__PURE__ */ React234.createElement(
+    /* @__PURE__ */ React235.createElement(Box, { display: "flex", alignItems: "center", flexDirection: "row" }, !isDisconnectExpanded && !isDydx && /* @__PURE__ */ React235.createElement(
       FunIconButton,
       {
-        icon: /* @__PURE__ */ React234.createElement(SettingsIcon, { size: 17 }),
+        icon: /* @__PURE__ */ React235.createElement(SettingsIcon, { size: 17 }),
         onClick: () => onChangeView(1 /* SETTINGS */),
         paddingX: "4",
         paddingY: "4"
       }
-    ), !isDydx && /* @__PURE__ */ React234.createElement(FunClickOutside, { onClick: collapseDisconnect }, /* @__PURE__ */ React234.createElement(
+    ), !isDydx && /* @__PURE__ */ React235.createElement(FunClickOutside, { onClick: collapseDisconnect }, /* @__PURE__ */ React235.createElement(
       FunIconButton,
       {
         size: "28",
-        icon: /* @__PURE__ */ React234.createElement(LogoutIcon, { size: 15 }),
+        icon: /* @__PURE__ */ React235.createElement(LogoutIcon, { size: 15 }),
         paddingX: isDisconnectExpanded ? "6" : void 0,
         "aria-label": "Disconnect",
         onClick: isDisconnectExpanded ? onLogout : () => setIsDisconnectExpanded(true),
@@ -25937,12 +26024,12 @@ var ProfileTitleSection = ({
         onMouseLeave: collapseDisconnect,
         onBlur: collapseDisconnect
       },
-      isDisconnectExpanded && /* @__PURE__ */ React234.createElement(Text, { size: "10", color: "secondaryText", weight: "medium" }, "Disconnect")
-    )), !isDisconnectExpanded && /* @__PURE__ */ React234.createElement(
+      isDisconnectExpanded && /* @__PURE__ */ React235.createElement(Text, { size: "10", color: "secondaryText", weight: "medium" }, "Disconnect")
+    )), !isDisconnectExpanded && /* @__PURE__ */ React235.createElement(
       FunIconButton,
       {
         size: "28",
-        icon: /* @__PURE__ */ React234.createElement(CloseIcon, { size: 12 }),
+        icon: /* @__PURE__ */ React235.createElement(CloseIcon, { size: 12 }),
         onClick: onClose
       }
     ))
@@ -25957,10 +26044,10 @@ var SelectedHomeTab = /* @__PURE__ */ ((SelectedHomeTab2) => {
 })(SelectedHomeTab || {});
 var EmptyTabAlert = () => {
   const { appName } = useFunkitConfig();
-  return /* @__PURE__ */ React235.createElement(Box, { paddingX: PROFILE_SIDE_PADDING }, /* @__PURE__ */ React235.createElement(
+  return /* @__PURE__ */ React236.createElement(Box, { paddingX: PROFILE_SIDE_PADDING }, /* @__PURE__ */ React236.createElement(
     FunAlert,
     {
-      icon: /* @__PURE__ */ React235.createElement(GreenRoundCheckmark, null),
+      icon: /* @__PURE__ */ React236.createElement(GreenRoundCheckmark, null),
       description: `Execute your first checkout on ${appName}`
     }
   ));
@@ -25994,7 +26081,7 @@ function Home({
   }, []);
   const AssetsList = useMemo43(() => {
     if (walletAssets && !Object.keys(walletAssets).length) {
-      return /* @__PURE__ */ React235.createElement(EmptyTabAlert, null);
+      return /* @__PURE__ */ React236.createElement(EmptyTabAlert, null);
     }
     const assets = walletAssets ? Object.values(walletAssets).sort(
       (a, b) => (b.totalUsdValue ?? 0) - (a.totalUsdValue ?? 0)
@@ -26002,7 +26089,7 @@ function Home({
     const itemHeight = HOME_TOKEN_BALANCE_DISPLAY_ROW_HEIGHT;
     const itemMargin = 8;
     const height = assets.length * (itemHeight + itemMargin) - itemMargin;
-    return /* @__PURE__ */ React235.createElement(Box, { ref: virtuosoParentRef }, /* @__PURE__ */ React235.createElement(
+    return /* @__PURE__ */ React236.createElement(Box, { ref: virtuosoParentRef }, /* @__PURE__ */ React236.createElement(
       Virtuoso,
       {
         className: clsx20(hideScrollBar, scrollContent),
@@ -26014,14 +26101,14 @@ function Home({
         itemContent: (index, asset) => (
           // gaps/margins between items must be part of the measured content
           // thus we wrap items in padded divs (margin is not measured)
-          /* @__PURE__ */ React235.createElement("div", { style: { paddingTop: index === 0 ? 0 : itemMargin } }, asset ? /* @__PURE__ */ React235.createElement(HomeTokenBalanceDisplayRow, { asset }) : /* @__PURE__ */ React235.createElement(HomeTokenBalanceDisplayRowSkeleton, null))
+          /* @__PURE__ */ React236.createElement("div", { style: { paddingTop: index === 0 ? 0 : itemMargin } }, asset ? /* @__PURE__ */ React236.createElement(HomeTokenBalanceDisplayRow, { asset }) : /* @__PURE__ */ React236.createElement(HomeTokenBalanceDisplayRowSkeleton, null))
         )
       }
     ));
   }, [walletAssets]);
   const CheckoutsList = useMemo43(() => {
     if (checkoutHistoryList.length === 0 && isCheckoutHistoryInited) {
-      return /* @__PURE__ */ React235.createElement(EmptyTabAlert, null);
+      return /* @__PURE__ */ React236.createElement(EmptyTabAlert, null);
     }
     const processingCheckouts = checkoutHistoryList.filter(
       (checkoutHistoryItem) => IN_PROGRESS_CHECKOUT_STATES2.includes(checkoutHistoryItem.state)
@@ -26083,7 +26170,7 @@ function Home({
     const groupHeight = 15;
     const groupMargin = 24;
     const height = groups.length * (groupHeight + groupMargin) + (items.length - groups.length) * (itemHeight + itemMargin) - groupMargin;
-    return /* @__PURE__ */ React235.createElement(Box, { ref: virtuosoParentRef }, /* @__PURE__ */ React235.createElement(
+    return /* @__PURE__ */ React236.createElement(Box, { ref: virtuosoParentRef }, /* @__PURE__ */ React236.createElement(
       Virtuoso,
       {
         className: clsx20(hideScrollBar, scrollContent),
@@ -26097,13 +26184,13 @@ function Home({
         itemContent: (index, data) => (
           // gaps/margins between items must be part of the measured content
           // thus we wrap items in padded divs (margin is not measured)
-          "group" in data ? /* @__PURE__ */ React235.createElement("div", { style: { paddingTop: index === 0 ? 0 : groupMargin } }, /* @__PURE__ */ React235.createElement(Box, { paddingX: PROFILE_SIDE_PADDING }, /* @__PURE__ */ React235.createElement(Text, { size: "10", color: "secondaryText" }, data.group))) : /* @__PURE__ */ React235.createElement("div", { style: { paddingTop: index === 0 ? 0 : itemMargin } }, data.checkout ? /* @__PURE__ */ React235.createElement(
+          "group" in data ? /* @__PURE__ */ React236.createElement("div", { style: { paddingTop: index === 0 ? 0 : groupMargin } }, /* @__PURE__ */ React236.createElement(Box, { paddingX: PROFILE_SIDE_PADDING }, /* @__PURE__ */ React236.createElement(Text, { size: "10", color: "secondaryText" }, data.group))) : /* @__PURE__ */ React236.createElement("div", { style: { paddingTop: index === 0 ? 0 : itemMargin } }, data.checkout ? /* @__PURE__ */ React236.createElement(
             HomeCheckoutDisplayRow,
             {
               checkoutHistoryItem: data.checkout,
               onSelect: handleCheckoutSelect
             }
-          ) : /* @__PURE__ */ React235.createElement(HomeCheckoutDisplayRowSkeleton, null))
+          ) : /* @__PURE__ */ React236.createElement(HomeCheckoutDisplayRowSkeleton, null))
         )
       }
     ));
@@ -26112,7 +26199,7 @@ function Home({
     if (tab === selectedView) return;
     navigateTo(tab, tab === "assets" /* ASSETS */ ? { reverse: true } : {});
   };
-  return /* @__PURE__ */ React235.createElement(Box, { paddingTop: "14" }, /* @__PURE__ */ React235.createElement(
+  return /* @__PURE__ */ React236.createElement(Box, { paddingTop: "14" }, /* @__PURE__ */ React236.createElement(
     ProfileTitleSection,
     {
       animateOut: animation.isOut,
@@ -26122,7 +26209,7 @@ function Home({
       onLogout: handleLogout,
       onClose
     }
-  ), /* @__PURE__ */ React235.createElement(
+  ), /* @__PURE__ */ React236.createElement(
     Box,
     {
       display: "flex",
@@ -26132,8 +26219,8 @@ function Home({
       gap: "24",
       className: getContentAnimation(animation, true)
     },
-    !isDydx && /* @__PURE__ */ React235.createElement(BalanceSection, { totalBalance: totalWalletAssetsUsd }),
-    /* @__PURE__ */ React235.createElement(
+    !isDydx && /* @__PURE__ */ React236.createElement(BalanceSection, { totalBalance: totalWalletAssetsUsd }),
+    /* @__PURE__ */ React236.createElement(
       Box,
       {
         display: "flex",
@@ -26144,7 +26231,7 @@ function Home({
           marginLeft: `-${Number.parseInt(PROFILE_SIDE_PADDING)}px`
         }
       },
-      isDydx ? CheckoutsList : /* @__PURE__ */ React235.createElement(React235.Fragment, null, /* @__PURE__ */ React235.createElement(
+      isDydx ? CheckoutsList : /* @__PURE__ */ React236.createElement(React236.Fragment, null, /* @__PURE__ */ React236.createElement(
         Box,
         {
           display: "flex",
@@ -26152,7 +26239,7 @@ function Home({
           gap: "24",
           paddingX: PROFILE_SIDE_PADDING
         },
-        tabs2.map(({ tab, label }) => /* @__PURE__ */ React235.createElement(
+        tabs2.map(({ tab, label }) => /* @__PURE__ */ React236.createElement(
           Box,
           {
             key: label,
@@ -26161,7 +26248,7 @@ function Home({
             tabIndex: 0,
             className: tabLabelStyles
           },
-          /* @__PURE__ */ React235.createElement(
+          /* @__PURE__ */ React236.createElement(
             Text,
             {
               weight: "bold",
@@ -26171,7 +26258,7 @@ function Home({
             label
           )
         ))
-      ), /* @__PURE__ */ React235.createElement(Box, { className: getContentAnimation(tabAnimation, false) }, selectedView === "assets" /* ASSETS */ && AssetsList, selectedView === "checkouts" /* CHECKOUTS */ && CheckoutsList))
+      ), /* @__PURE__ */ React236.createElement(Box, { className: getContentAnimation(tabAnimation, false) }, selectedView === "assets" /* ASSETS */ && AssetsList, selectedView === "checkouts" /* CHECKOUTS */ && CheckoutsList))
     )
   ));
 }
@@ -26249,11 +26336,11 @@ function ProfileDetails({ onClose, defaultTab }) {
     depositAddress: selectedPurchaseId,
     isCheckoutDetailView,
     paddingTop: PADDING_TOP,
-    topbar: dialogTitleMap[view] && /* @__PURE__ */ React236.createElement(Dialog.Title, { onClose, ...dialogTitleMap[view] }),
+    topbar: dialogTitleMap[view] && /* @__PURE__ */ React237.createElement(Dialog.Title, { onClose, ...dialogTitleMap[view] }),
     withTopDivider: withDivider,
     scrollableContent: PROFILE_DETAILS_DIALOG_CONTENT_ID
   });
-  return /* @__PURE__ */ React236.createElement(FunCheckoutModalHeightAnimationWrapper, null, topbar, /* @__PURE__ */ React236.createElement(
+  return /* @__PURE__ */ React237.createElement(FunCheckoutModalHeightAnimationWrapper, null, topbar, /* @__PURE__ */ React237.createElement(
     Dialog.Content,
     {
       display: "flex",
@@ -26270,7 +26357,7 @@ function ProfileDetails({ onClose, defaultTab }) {
       withTopDivider,
       id: PROFILE_DETAILS_DIALOG_CONTENT_ID
     },
-    view === 0 /* HOME */ ? /* @__PURE__ */ React236.createElement(
+    view === 0 /* HOME */ ? /* @__PURE__ */ React237.createElement(
       Home,
       {
         animation,
@@ -26279,7 +26366,7 @@ function ProfileDetails({ onClose, defaultTab }) {
         onSelectActivity: onSelectActivityWrapper,
         defaultHomeTab: selectedHomeTab
       }
-    ) : view === 1 /* SETTINGS */ ? /* @__PURE__ */ React236.createElement(Settings, null) : view === 3 /* SINGLE_ACTIVITY */ ? /* @__PURE__ */ React236.createElement(
+    ) : view === 1 /* SETTINGS */ ? /* @__PURE__ */ React237.createElement(Settings, null) : view === 3 /* SINGLE_ACTIVITY */ ? /* @__PURE__ */ React237.createElement(
       FunCheckoutHistoryContent,
       {
         depositAddress: selectedPurchaseId || "0x",
@@ -26290,7 +26377,7 @@ function ProfileDetails({ onClose, defaultTab }) {
         bottomBarId: HISTORY_BOTTOM_BAR_ID
       }
     ) : null
-  ), /* @__PURE__ */ React236.createElement(Dialog.BottomSection, { id: HISTORY_BOTTOM_BAR_ID }));
+  ), /* @__PURE__ */ React237.createElement(Dialog.BottomSection, { id: HISTORY_BOTTOM_BAR_ID }));
 }
 
 // src/modals/AccountModal/AccountModal.tsx
@@ -26298,7 +26385,7 @@ var TITLE_ID = "fun_account_modal_title";
 function AccountModal({ onClose, open, defaultTab }) {
   const { walletAddress } = useGeneralWallet();
   if (!walletAddress) return null;
-  return /* @__PURE__ */ React237.createElement(
+  return /* @__PURE__ */ React238.createElement(
     Dialog,
     {
       onClose,
@@ -26306,18 +26393,18 @@ function AccountModal({ onClose, open, defaultTab }) {
       titleId: TITLE_ID,
       isSmartCloseable: true
     },
-    /* @__PURE__ */ React237.createElement(ActivityTraversalProvider, null, /* @__PURE__ */ React237.createElement(ProfileDetails, { onClose, defaultTab }))
+    /* @__PURE__ */ React238.createElement(ActivityTraversalProvider, null, /* @__PURE__ */ React238.createElement(ProfileDetails, { onClose, defaultTab }))
   );
 }
 
 // src/modals/ChainModal/ChainModal.tsx
 import { isMobile as isMobile13 } from "@funkit/utils";
-import React241 from "react";
+import React242 from "react";
 import { useAccount as useAccount7, useConfig as useConfig3 } from "wagmi";
 
 // src/components/Icons/DisconnectSqIcon.tsx
-import React238 from "react";
-var DisconnectSqIcon = ({ size }) => /* @__PURE__ */ React238.createElement(
+import React239 from "react";
+var DisconnectSqIcon = ({ size }) => /* @__PURE__ */ React239.createElement(
   "svg",
   {
     fill: "none",
@@ -26326,7 +26413,7 @@ var DisconnectSqIcon = ({ size }) => /* @__PURE__ */ React238.createElement(
     width: size,
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React238.createElement(
+  /* @__PURE__ */ React239.createElement(
     "path",
     {
       d: "M6.742 22.195h8.367c1.774 0 2.743-.968 2.743-2.758V16.11h-2.016v3.11c0 .625-.305.96-.969.96H6.984c-.664 0-.968-.335-.968-.96V7.984c0-.632.304-.968.968-.968h7.883c.664 0 .969.336.969.968v3.133h2.016v-3.36c0-1.78-.97-2.757-2.743-2.757H6.742C4.97 5 4 5.977 4 7.758v11.68c0 1.789.969 2.757 2.742 2.757Zm5.438-7.703h7.601l1.149-.07-.602.406-1.008.938a.816.816 0 0 0-.258.593c0 .407.313.782.758.782.227 0 .39-.086.547-.243l2.492-2.593c.235-.235.313-.47.313-.711 0-.242-.078-.477-.313-.719l-2.492-2.586c-.156-.156-.32-.25-.547-.25-.445 0-.758.367-.758.781 0 .227.094.446.258.594l1.008.945.602.407-1.149-.079H12.18a.904.904 0 0 0 0 1.805Z",
@@ -26337,13 +26424,13 @@ var DisconnectSqIcon = ({ size }) => /* @__PURE__ */ React238.createElement(
 
 // src/components/MenuButton/MenuButton.tsx
 import { isMobile as isMobile11 } from "@funkit/utils";
-import React239 from "react";
+import React240 from "react";
 
 // src/components/MenuButton/MenuButton.css.ts
 var unsetBackgroundOnHover = "_10pw5x60";
 
 // src/components/MenuButton/MenuButton.tsx
-var MenuButton = React239.forwardRef(
+var MenuButton = React240.forwardRef(
   ({
     children,
     currentlySelected = false,
@@ -26352,7 +26439,7 @@ var MenuButton = React239.forwardRef(
     ...urlProps
   }, ref) => {
     const mobile = isMobile11();
-    return /* @__PURE__ */ React239.createElement(
+    return /* @__PURE__ */ React240.createElement(
       Box,
       {
         as: "button",
@@ -26364,7 +26451,7 @@ var MenuButton = React239.forwardRef(
         testId,
         type: "button"
       },
-      /* @__PURE__ */ React239.createElement(
+      /* @__PURE__ */ React240.createElement(
         Box,
         {
           borderRadius: "menuButton",
@@ -26398,7 +26485,7 @@ MenuButton.displayName = "MenuButton";
 
 // src/modals/ChainModal/Chain.tsx
 import { isMobile as isMobile12 } from "@funkit/utils";
-import React240, { Fragment as Fragment4 } from "react";
+import React241, { Fragment as Fragment4 } from "react";
 function ChainLineItem({
   chainId,
   chainIconSize,
@@ -26409,7 +26496,7 @@ function ChainLineItem({
   const enabledChainItem = enabledChainMap?.[chainId];
   const chainItem = chainMetadataById[chainId] || enabledChainItem;
   if (!chainItem) return null;
-  return /* @__PURE__ */ React240.createElement(
+  return /* @__PURE__ */ React241.createElement(
     Box,
     {
       alignItems: "center",
@@ -26418,7 +26505,7 @@ function ChainLineItem({
       gap,
       height: chainIconSize
     },
-    /* @__PURE__ */ React240.createElement(Box, { height: "full" }, /* @__PURE__ */ React240.createElement(
+    /* @__PURE__ */ React241.createElement(Box, { height: "full" }, /* @__PURE__ */ React241.createElement(
       AsyncImage,
       {
         alt: chainItem.name,
@@ -26430,7 +26517,7 @@ function ChainLineItem({
         testId: `chain-option-${chainId}-icon`
       }
     )),
-    !hideChainName ? /* @__PURE__ */ React240.createElement("div", null, chainItem.name) : null
+    !hideChainName ? /* @__PURE__ */ React241.createElement("div", null, chainItem.name) : null
   );
 }
 var Chain2 = ({
@@ -26445,14 +26532,14 @@ var Chain2 = ({
   const funkitConnectChains = useFunkitConnectChains();
   const { loginType } = useGeneralWallet();
   const isCurrentChain = currentChainId === chainId && !isLoading;
-  return /* @__PURE__ */ React240.createElement(Fragment4, null, /* @__PURE__ */ React240.createElement(
+  return /* @__PURE__ */ React241.createElement(Fragment4, null, /* @__PURE__ */ React241.createElement(
     MenuButton,
     {
       currentlySelected: isCurrentChain,
       onClick: isCurrentChain ? void 0 : () => switchChain({ chainId }),
       testId: `chain-option-${chainId}`
     },
-    /* @__PURE__ */ React240.createElement(Box, { fontFamily: "body", fontSize: "16", fontWeight: "bold" }, /* @__PURE__ */ React240.createElement(
+    /* @__PURE__ */ React241.createElement(Box, { fontFamily: "body", fontSize: "16", fontWeight: "bold" }, /* @__PURE__ */ React241.createElement(
       Box,
       {
         alignItems: "center",
@@ -26460,8 +26547,8 @@ var Chain2 = ({
         flexDirection: "row",
         justifyContent: "space-between"
       },
-      /* @__PURE__ */ React240.createElement(ChainLineItem, { chainId, chainIconSize }),
-      isCurrentChain && /* @__PURE__ */ React240.createElement(
+      /* @__PURE__ */ React241.createElement(ChainLineItem, { chainId, chainIconSize }),
+      isCurrentChain && /* @__PURE__ */ React241.createElement(
         Box,
         {
           alignItems: "center",
@@ -26469,10 +26556,10 @@ var Chain2 = ({
           flexDirection: "row",
           marginRight: "6"
         },
-        /* @__PURE__ */ React240.createElement(Text, { color: "accentColorForeground", size: "14", weight: "medium" }, "Connected"),
-        /* @__PURE__ */ React240.createElement(FunDot, null)
+        /* @__PURE__ */ React241.createElement(Text, { color: "accentColorForeground", size: "14", weight: "medium" }, "Connected"),
+        /* @__PURE__ */ React241.createElement(FunDot, null)
       ),
-      isLoading && /* @__PURE__ */ React240.createElement(
+      isLoading && /* @__PURE__ */ React241.createElement(
         Box,
         {
           alignItems: "center",
@@ -26480,8 +26567,8 @@ var Chain2 = ({
           flexDirection: "row",
           marginRight: "6"
         },
-        /* @__PURE__ */ React240.createElement(Text, { color: "primaryText", size: "14", weight: "medium" }, loginType === "web2" /* Web2 */ ? "Switching" : "Confirm in Wallet"),
-        /* @__PURE__ */ React240.createElement(
+        /* @__PURE__ */ React241.createElement(Text, { color: "primaryText", size: "14", weight: "medium" }, loginType === "web2" /* Web2 */ ? "Switching" : "Confirm in Wallet"),
+        /* @__PURE__ */ React241.createElement(
           Box,
           {
             background: "standby",
@@ -26493,7 +26580,7 @@ var Chain2 = ({
         )
       )
     ))
-  ), mobile && idx < funkitConnectChains.length - 1 && /* @__PURE__ */ React240.createElement(Box, { background: "generalBorderDim", height: "1", marginX: "8" }));
+  ), mobile && idx < funkitConnectChains.length - 1 && /* @__PURE__ */ React241.createElement(Box, { background: "generalBorderDim", height: "1", marginX: "8" }));
 };
 var Chain_default = Chain2;
 
@@ -26517,7 +26604,7 @@ function ChainModal({ onClose, open }) {
   if (!chainId) {
     return null;
   }
-  return /* @__PURE__ */ React241.createElement(
+  return /* @__PURE__ */ React242.createElement(
     Dialog,
     {
       onClose,
@@ -26525,15 +26612,15 @@ function ChainModal({ onClose, open }) {
       titleId,
       isSmartCloseable: true
     },
-    /* @__PURE__ */ React241.createElement(Dialog.Content, { paddingTop: "18" }, /* @__PURE__ */ React241.createElement(Box, { display: "flex", flexDirection: "column", gap: "14" }, /* @__PURE__ */ React241.createElement(
+    /* @__PURE__ */ React242.createElement(Dialog.Content, { paddingTop: "18" }, /* @__PURE__ */ React242.createElement(Box, { display: "flex", flexDirection: "column", gap: "14" }, /* @__PURE__ */ React242.createElement(
       Box,
       {
         display: "flex",
         flexDirection: "row",
         justifyContent: "space-between"
       },
-      mobile && /* @__PURE__ */ React241.createElement(Box, { width: "30" }),
-      /* @__PURE__ */ React241.createElement(Box, { paddingBottom: "0", paddingLeft: "8", paddingTop: "4" }, /* @__PURE__ */ React241.createElement(
+      mobile && /* @__PURE__ */ React242.createElement(Box, { width: "30" }),
+      /* @__PURE__ */ React242.createElement(Box, { paddingBottom: "0", paddingLeft: "8", paddingTop: "4" }, /* @__PURE__ */ React242.createElement(
         Text,
         {
           as: "h1",
@@ -26544,8 +26631,8 @@ function ChainModal({ onClose, open }) {
         },
         "Switch Networks"
       )),
-      /* @__PURE__ */ React241.createElement(CloseButton, { onClose })
-    ), !isCurrentChainSupported && /* @__PURE__ */ React241.createElement(Box, { marginX: "8", textAlign: mobile ? "center" : "left" }, /* @__PURE__ */ React241.createElement(Text, { color: "tertiaryText", size: "14", weight: "medium" }, "Wrong network detected, switch or disconnect to continue.")), /* @__PURE__ */ React241.createElement(
+      /* @__PURE__ */ React242.createElement(CloseButton, { onClose })
+    ), !isCurrentChainSupported && /* @__PURE__ */ React242.createElement(Box, { marginX: "8", textAlign: mobile ? "center" : "left" }, /* @__PURE__ */ React242.createElement(Text, { color: "tertiaryText", size: "14", weight: "medium" }, "Wrong network detected, switch or disconnect to continue.")), /* @__PURE__ */ React242.createElement(
       Box,
       {
         className: mobile ? MobileScrollClassName : DesktopScrollClassName,
@@ -26556,7 +26643,7 @@ function ChainModal({ onClose, open }) {
         paddingBottom: "16"
       },
       funkitConnectChains.map(({ id }, idx) => {
-        return /* @__PURE__ */ React241.createElement(
+        return /* @__PURE__ */ React242.createElement(
           Chain_default,
           {
             key: id,
@@ -26569,13 +26656,13 @@ function ChainModal({ onClose, open }) {
           }
         );
       }),
-      !isCurrentChainSupported && /* @__PURE__ */ React241.createElement(React241.Fragment, null, /* @__PURE__ */ React241.createElement(Box, { background: "generalBorderDim", height: "1", marginX: "8" }), /* @__PURE__ */ React241.createElement(
+      !isCurrentChainSupported && /* @__PURE__ */ React242.createElement(React242.Fragment, null, /* @__PURE__ */ React242.createElement(Box, { background: "generalBorderDim", height: "1", marginX: "8" }), /* @__PURE__ */ React242.createElement(
         MenuButton,
         {
           onClick: () => handleLogout(),
           testId: "chain-option-disconnect"
         },
-        /* @__PURE__ */ React241.createElement(
+        /* @__PURE__ */ React242.createElement(
           Box,
           {
             color: "error",
@@ -26583,7 +26670,7 @@ function ChainModal({ onClose, open }) {
             fontSize: "16",
             fontWeight: "bold"
           },
-          /* @__PURE__ */ React241.createElement(
+          /* @__PURE__ */ React242.createElement(
             Box,
             {
               alignItems: "center",
@@ -26591,7 +26678,7 @@ function ChainModal({ onClose, open }) {
               flexDirection: "row",
               justifyContent: "space-between"
             },
-            /* @__PURE__ */ React241.createElement(
+            /* @__PURE__ */ React242.createElement(
               Box,
               {
                 alignItems: "center",
@@ -26600,7 +26687,7 @@ function ChainModal({ onClose, open }) {
                 gap: "4",
                 height: chainIconSize
               },
-              /* @__PURE__ */ React241.createElement(
+              /* @__PURE__ */ React242.createElement(
                 Box,
                 {
                   alignItems: "center",
@@ -26609,9 +26696,9 @@ function ChainModal({ onClose, open }) {
                   justifyContent: "center",
                   marginRight: "8"
                 },
-                /* @__PURE__ */ React241.createElement(DisconnectSqIcon, { size: Number(chainIconSize) })
+                /* @__PURE__ */ React242.createElement(DisconnectSqIcon, { size: Number(chainIconSize) })
               ),
-              /* @__PURE__ */ React241.createElement("div", null, "Disconnect")
+              /* @__PURE__ */ React242.createElement("div", null, "Disconnect")
             )
           )
         )
@@ -26624,10 +26711,10 @@ function ChainModal({ onClose, open }) {
 import { FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST as FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST3 } from "@funkit/chains";
 import { LogLevel, initializeRelayClient } from "@funkit/fun-relay";
 import { FlagKey as FlagKey32 } from "@funkit/utils";
-import React251, { useRef as useRef24 } from "react";
+import React252, { useRef as useRef24 } from "react";
 
 // src/components/DydxSwitchModalTab/DydxSwitchModalTab.tsx
-import React243, { useCallback as useCallback44 } from "react";
+import React244, { useCallback as useCallback44 } from "react";
 
 // src/hooks/useFunkitMaxCheckoutUsdInfo.ts
 import { FlagKey as FlagKey30, formatCurrencyAndStringify as formatCurrencyAndStringify15 } from "@funkit/utils";
@@ -26647,8 +26734,8 @@ var useFunkitMaxCheckoutUsdInfo = () => {
 };
 
 // src/components/DydxSwitchModalTab/Icons.tsx
-import React242 from "react";
-var Instant = /* @__PURE__ */ React242.createElement(
+import React243 from "react";
+var Instant = /* @__PURE__ */ React243.createElement(
   "svg",
   {
     width: "20",
@@ -26657,7 +26744,7 @@ var Instant = /* @__PURE__ */ React242.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React242.createElement(
+  /* @__PURE__ */ React243.createElement(
     "path",
     {
       d: "M11.983 1.90702C12.0175 1.74537 11.9976 1.57686 11.9264 1.42768C11.8552 1.2785 11.7368 1.157 11.5894 1.08208C11.4421 1.00716 11.2741 0.98301 11.1117 1.01338C10.9492 1.04375 10.8013 1.12694 10.691 1.25002L2.19098 10.75C2.09446 10.8579 2.03124 10.9915 2.00895 11.1345C1.98665 11.2776 2.00624 11.424 2.06534 11.5562C2.12445 11.6884 2.22054 11.8006 2.34203 11.8794C2.46352 11.9581 2.6052 12 2.74998 12H9.32198L8.01698 18.093C7.98251 18.2547 8.00241 18.4232 8.07358 18.5724C8.14475 18.7216 8.2632 18.843 8.41054 18.918C8.55787 18.9929 8.72582 19.017 8.8883 18.9867C9.05077 18.9563 9.19866 18.8731 9.30898 18.75L17.809 9.25002C17.9055 9.14211 17.9687 9.00857 17.991 8.86551C18.0133 8.72246 17.9937 8.57601 17.9346 8.44385C17.8755 8.31168 17.7794 8.19945 17.6579 8.12069C17.5364 8.04194 17.3948 8.00003 17.25 8.00002H10.678L11.983 1.90702Z",
@@ -26665,7 +26752,7 @@ var Instant = /* @__PURE__ */ React242.createElement(
     }
   )
 );
-var Standard = /* @__PURE__ */ React242.createElement(
+var Standard = /* @__PURE__ */ React243.createElement(
   "svg",
   {
     width: "16",
@@ -26674,7 +26761,7 @@ var Standard = /* @__PURE__ */ React242.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React242.createElement(
+  /* @__PURE__ */ React243.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -26690,7 +26777,7 @@ function DydxSwitchTabInternal({
   limitLabel,
   onSwitch
 }) {
-  return /* @__PURE__ */ React243.createElement(
+  return /* @__PURE__ */ React244.createElement(
     Box,
     {
       display: "flex",
@@ -26701,7 +26788,7 @@ function DydxSwitchTabInternal({
       userSelect: "none",
       id: "dydx-payment-switcher"
     },
-    /* @__PURE__ */ React243.createElement(
+    /* @__PURE__ */ React244.createElement(
       Box,
       {
         width: "half",
@@ -26714,11 +26801,11 @@ function DydxSwitchTabInternal({
         paddingY: "12",
         background: "dydxSwitchActiveBackground"
       },
-      /* @__PURE__ */ React243.createElement(Text, { color: "buttonBackground", style: { float: "right" } }, Instant),
-      /* @__PURE__ */ React243.createElement(Text, { size: "16", color: "primaryText" }, "Instant"),
-      /* @__PURE__ */ React243.createElement(Text, { size: "12", color: "primaryText" }, "Higher fees, ", limitLabel, " limit")
+      /* @__PURE__ */ React244.createElement(Text, { color: "buttonBackground", style: { float: "right" } }, Instant),
+      /* @__PURE__ */ React244.createElement(Text, { size: "16", color: "primaryText" }, "Instant"),
+      /* @__PURE__ */ React244.createElement(Text, { size: "12", color: "primaryText" }, "Higher fees, ", limitLabel, " limit")
     ),
-    /* @__PURE__ */ React243.createElement(
+    /* @__PURE__ */ React244.createElement(
       Box,
       {
         width: "half",
@@ -26728,9 +26815,9 @@ function DydxSwitchTabInternal({
         cursor: "pointer",
         onClick: onSwitch
       },
-      /* @__PURE__ */ React243.createElement(Text, { color: "tertiaryText", style: { float: "right" } }, Standard),
-      /* @__PURE__ */ React243.createElement(Text, { size: "16", color: "tertiaryText" }, "Standard", " "),
-      /* @__PURE__ */ React243.createElement(Text, { size: "12", color: "tertiaryText" }, "Lowest fees, no limit")
+      /* @__PURE__ */ React244.createElement(Text, { color: "tertiaryText", style: { float: "right" } }, Standard),
+      /* @__PURE__ */ React244.createElement(Text, { size: "16", color: "tertiaryText" }, "Standard", " "),
+      /* @__PURE__ */ React244.createElement(Text, { size: "12", color: "tertiaryText" }, "Lowest fees, no limit")
     )
   );
 }
@@ -26755,7 +26842,7 @@ function DydxSwitchTab({
 }
 
 // src/components/FunCheckoutBlocked/FunCheckoutBlocked.tsx
-import React244 from "react";
+import React245 from "react";
 
 // src/components/FunCheckoutBlocked/FunCheckoutBlocked.css.ts
 var funCheckoutBlockedStyle = "hkjz5k0";
@@ -26767,21 +26854,21 @@ var blockedReasonToDescription = {
 };
 var FunCheckoutBlocked = ({ reason }) => {
   const description = blockedReasonToDescription[reason];
-  return /* @__PURE__ */ React244.createElement(Box, { className: funCheckoutBlockedStyle }, /* @__PURE__ */ React244.createElement(FunAlert, { icon: /* @__PURE__ */ React244.createElement(FunInfoIcon, null), description }));
+  return /* @__PURE__ */ React245.createElement(Box, { className: funCheckoutBlockedStyle }, /* @__PURE__ */ React245.createElement(FunAlert, { icon: /* @__PURE__ */ React245.createElement(FunInfoIcon, null), description }));
 };
 
 // src/modals/CheckoutModal/TransferToken/CheckoutNotifications.tsx
 import clsx23 from "clsx";
-import React250, { useEffect as useEffect46, useMemo as useMemo44, useState as useState65 } from "react";
+import React251, { useEffect as useEffect46, useMemo as useMemo44, useState as useState65 } from "react";
 
 // src/components/FunNotificationBanner/FunNotificationShowMoreButton.tsx
-import React245 from "react";
+import React246 from "react";
 var FunNotificationShowMoreButton = ({
   numberOfNotifications,
   isExpanded,
   onClick
 }) => {
-  const buttonTitleCompoent = /* @__PURE__ */ React245.createElement(Box, { display: "flex", gap: "4", alignItems: "center" }, /* @__PURE__ */ React245.createElement(Text, { size: "13" }, isExpanded ? "Show less" : `${numberOfNotifications} more`), /* @__PURE__ */ React245.createElement(
+  const buttonTitleCompoent = /* @__PURE__ */ React246.createElement(Box, { display: "flex", gap: "4", alignItems: "center" }, /* @__PURE__ */ React246.createElement(Text, { size: "13" }, isExpanded ? "Show less" : `${numberOfNotifications} more`), /* @__PURE__ */ React246.createElement(
     Box,
     {
       width: "16",
@@ -26790,7 +26877,7 @@ var FunNotificationShowMoreButton = ({
       alignItems: "center",
       justifyContent: "center"
     },
-    /* @__PURE__ */ React245.createElement(
+    /* @__PURE__ */ React246.createElement(
       Box,
       {
         color: "secondaryText",
@@ -26801,10 +26888,10 @@ var FunNotificationShowMoreButton = ({
         justifyContent: "center",
         style: isExpanded ? { transform: "rotate(180deg)" } : void 0
       },
-      /* @__PURE__ */ React245.createElement(CaretDownIcon, null)
+      /* @__PURE__ */ React246.createElement(CaretDownIcon, null)
     )
   ));
-  return /* @__PURE__ */ React245.createElement(
+  return /* @__PURE__ */ React246.createElement(
     FunButton,
     {
       type: "tertiary",
@@ -26885,11 +26972,11 @@ var useRecentDirectExecutions = ({
 };
 
 // src/modals/CheckoutModal/TransferToken/CheckoutNotification.tsx
-import React248 from "react";
+import React249 from "react";
 
 // src/components/FunNotificationBanner/FunNotificationBanner.tsx
-import { AnimatePresence as AnimatePresence5, motion as motion12 } from "motion/react";
-import React247, { useState as useState64 } from "react";
+import { AnimatePresence as AnimatePresence5, motion as motion13 } from "motion/react";
+import React248, { useState as useState64 } from "react";
 import clsx22 from "clsx";
 
 // src/components/FunNotificationBanner/FunNotificationBanner.css.ts
@@ -26898,8 +26985,8 @@ var showMoreButtonStyle = "_4yitd93 _1rsrm2fy9 _1rsrm2f1e _1rsrm2f1b _1rsrm2fjf
 
 // src/components/FunNotificationBanner/FunNotificationBannerIcon.tsx
 import clsx21 from "clsx";
-import { motion as motion11, useAnimate as useAnimate2 } from "motion/react";
-import React246, { useCallback as useCallback45, useEffect as useEffect45, useRef as useRef23 } from "react";
+import { motion as motion12, useAnimate as useAnimate2 } from "motion/react";
+import React247, { useCallback as useCallback45, useEffect as useEffect45, useRef as useRef23 } from "react";
 
 // src/components/FunNotificationBanner/FunNotificationBannerIcon.css.ts
 var STATUS_SPINNER_BOTTOM_POSITION = -5;
@@ -26912,8 +26999,8 @@ var statusSpinner = "_1i8t3xj4 qe221a3";
 function generateAnimationPrefixClassName(className) {
   return `framer-fnb-${className}`;
 }
-var successIcon = /* @__PURE__ */ React246.createElement(
-  motion11.svg,
+var successIcon = /* @__PURE__ */ React247.createElement(
+  motion12.svg,
   {
     width: "16",
     height: "16",
@@ -26921,9 +27008,9 @@ var successIcon = /* @__PURE__ */ React246.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React246.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#66CC00" }),
-  /* @__PURE__ */ React246.createElement(
-    motion11.path,
+  /* @__PURE__ */ React247.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#66CC00" }),
+  /* @__PURE__ */ React247.createElement(
+    motion12.path,
     {
       d: "M5 8L7 10L11.5 5.5",
       stroke: "white",
@@ -26932,7 +27019,7 @@ var successIcon = /* @__PURE__ */ React246.createElement(
     }
   )
 );
-var errorIcon = /* @__PURE__ */ React246.createElement(
+var errorIcon = /* @__PURE__ */ React247.createElement(
   "svg",
   {
     width: "16",
@@ -26941,8 +27028,8 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React246.createElement("g", { filter: "url(#filter0_i_19769_7642)" }, /* @__PURE__ */ React246.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#F34126" })),
-  /* @__PURE__ */ React246.createElement(
+  /* @__PURE__ */ React247.createElement("g", { filter: "url(#filter0_i_19769_7642)" }, /* @__PURE__ */ React247.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#F34126" })),
+  /* @__PURE__ */ React247.createElement(
     "path",
     {
       d: "M5 5L11 11",
@@ -26951,7 +27038,7 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React246.createElement(
+  /* @__PURE__ */ React247.createElement(
     "path",
     {
       d: "M5 11L11 5",
@@ -26960,7 +27047,7 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React246.createElement("defs", null, /* @__PURE__ */ React246.createElement(
+  /* @__PURE__ */ React247.createElement("defs", null, /* @__PURE__ */ React247.createElement(
     "filter",
     {
       id: "filter0_i_19769_7642",
@@ -26971,8 +27058,8 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
       filterUnits: "userSpaceOnUse",
       colorInterpolationFilters: "sRGB"
     },
-    /* @__PURE__ */ React246.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+    /* @__PURE__ */ React247.createElement(
       "feBlend",
       {
         mode: "normal",
@@ -26981,7 +27068,7 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
         result: "shape"
       }
     ),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(
       "feColorMatrix",
       {
         in: "SourceAlpha",
@@ -26990,16 +27077,16 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
         result: "hardAlpha"
       }
     ),
-    /* @__PURE__ */ React246.createElement("feOffset", { dy: "-1" }),
-    /* @__PURE__ */ React246.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement("feOffset", { dy: "-1" }),
+    /* @__PURE__ */ React247.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
+    /* @__PURE__ */ React247.createElement(
       "feColorMatrix",
       {
         type: "matrix",
         values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
       }
     ),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(
       "feBlend",
       {
         mode: "normal",
@@ -27009,8 +27096,8 @@ var errorIcon = /* @__PURE__ */ React246.createElement(
     )
   ))
 );
-var pendingIcon = /* @__PURE__ */ React246.createElement(
-  motion11.svg,
+var pendingIcon = /* @__PURE__ */ React247.createElement(
+  motion12.svg,
   {
     width: "16",
     height: "16",
@@ -27018,9 +27105,9 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React246.createElement("g", { filter: "url(#filter0_i_19866_15799)" }, /* @__PURE__ */ React246.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#8C8C8C" })),
-  /* @__PURE__ */ React246.createElement("g", { clipPath: "url(#clip0_19866_15799)" }, /* @__PURE__ */ React246.createElement(
-    motion11.path,
+  /* @__PURE__ */ React247.createElement("g", { filter: "url(#filter0_i_19866_15799)" }, /* @__PURE__ */ React247.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#8C8C8C" })),
+  /* @__PURE__ */ React247.createElement("g", { clipPath: "url(#clip0_19866_15799)" }, /* @__PURE__ */ React247.createElement(
+    motion12.path,
     {
       d: "M8 5V8L10 9M13 8C13 10.7614 10.7614 13 8 13C5.23858 13 3 10.7614 3 8C3 5.23858 5.23858 3 8 3C10.7614 3 13 5.23858 13 8Z",
       stroke: "white",
@@ -27029,7 +27116,7 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
       strokeLinejoin: "round"
     }
   )),
-  /* @__PURE__ */ React246.createElement("defs", null, /* @__PURE__ */ React246.createElement(
+  /* @__PURE__ */ React247.createElement("defs", null, /* @__PURE__ */ React247.createElement(
     "filter",
     {
       id: "filter0_i_19866_15799",
@@ -27040,8 +27127,8 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
       filterUnits: "userSpaceOnUse",
       colorInterpolationFilters: "sRGB"
     },
-    /* @__PURE__ */ React246.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+    /* @__PURE__ */ React247.createElement(
       "feBlend",
       {
         mode: "normal",
@@ -27050,7 +27137,7 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
         result: "shape"
       }
     ),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(
       "feColorMatrix",
       {
         in: "SourceAlpha",
@@ -27059,16 +27146,16 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
         result: "hardAlpha"
       }
     ),
-    /* @__PURE__ */ React246.createElement("feOffset", { dy: "-1" }),
-    /* @__PURE__ */ React246.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement("feOffset", { dy: "-1" }),
+    /* @__PURE__ */ React247.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
+    /* @__PURE__ */ React247.createElement(
       "feColorMatrix",
       {
         type: "matrix",
         values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
       }
     ),
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(
       "feBlend",
       {
         mode: "normal",
@@ -27076,10 +27163,10 @@ var pendingIcon = /* @__PURE__ */ React246.createElement(
         result: "effect1_innerShadow_19866_15799"
       }
     )
-  ), /* @__PURE__ */ React246.createElement("clipPath", { id: "clip0_19866_15799" }, /* @__PURE__ */ React246.createElement("rect", { width: "12", height: "12", fill: "white", transform: "translate(2 2)" })))
+  ), /* @__PURE__ */ React247.createElement("clipPath", { id: "clip0_19866_15799" }, /* @__PURE__ */ React247.createElement("rect", { width: "12", height: "12", fill: "white", transform: "translate(2 2)" })))
 );
-var downloadIcon = /* @__PURE__ */ React246.createElement(
-  motion11.svg,
+var downloadIcon = /* @__PURE__ */ React247.createElement(
+  motion12.svg,
   {
     width: "16",
     height: "16",
@@ -27087,9 +27174,9 @@ var downloadIcon = /* @__PURE__ */ React246.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React246.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#66CC00" }),
-  /* @__PURE__ */ React246.createElement(
-    motion11.path,
+  /* @__PURE__ */ React247.createElement("circle", { cx: "8", cy: "8", r: "8", fill: "#66CC00" }),
+  /* @__PURE__ */ React247.createElement(
+    motion12.path,
     {
       d: "M8 4C8 6.14788 8 11.5 8 11.5M8 11.5L11 8.5M8 11.5L5 8.5",
       stroke: "white",
@@ -27099,7 +27186,7 @@ var downloadIcon = /* @__PURE__ */ React246.createElement(
   )
 );
 var SpinnerBase = ({ variant }) => {
-  return /* @__PURE__ */ React246.createElement(motion11.div, null, /* @__PURE__ */ React246.createElement(
+  return /* @__PURE__ */ React247.createElement(motion12.div, null, /* @__PURE__ */ React247.createElement(
     Box,
     {
       className: clsx21(
@@ -27108,7 +27195,7 @@ var SpinnerBase = ({ variant }) => {
       ),
       color: variant === "processing" ? "success" : "inputBorderHover"
     },
-    /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(
       "svg",
       {
         width: "24",
@@ -27117,7 +27204,7 @@ var SpinnerBase = ({ variant }) => {
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
       },
-      /* @__PURE__ */ React246.createElement(
+      /* @__PURE__ */ React247.createElement(
         "circle",
         {
           opacity: "0.5",
@@ -27133,8 +27220,8 @@ var SpinnerBase = ({ variant }) => {
     )
   ));
 };
-var ProcessingSpinner = () => /* @__PURE__ */ React246.createElement(SpinnerBase, { variant: "processing" });
-var DelayedSpinner = () => /* @__PURE__ */ React246.createElement(SpinnerBase, { variant: "delayed" });
+var ProcessingSpinner = () => /* @__PURE__ */ React247.createElement(SpinnerBase, { variant: "processing" });
+var DelayedSpinner = () => /* @__PURE__ */ React247.createElement(SpinnerBase, { variant: "delayed" });
 var statusIconMap = {
   processing: downloadIcon,
   delayed: downloadIcon,
@@ -27365,7 +27452,7 @@ var FunNotificationBannerIcon = ({
     triggerAnimationDelayedToFailed,
     triggerAnimationProcessingToCompleted
   ]);
-  return /* @__PURE__ */ React246.createElement(Box, { width: "32", height: "32", position: "relative", ref: animationScope }, statusRef.current === "processing" && /* @__PURE__ */ React246.createElement(ProcessingSpinner, null), statusRef.current === "delayed" && /* @__PURE__ */ React246.createElement(DelayedSpinner, null), /* @__PURE__ */ React246.createElement(Box, { className: shadowStyle }, /* @__PURE__ */ React246.createElement(
+  return /* @__PURE__ */ React247.createElement(Box, { width: "32", height: "32", position: "relative", ref: animationScope }, statusRef.current === "processing" && /* @__PURE__ */ React247.createElement(ProcessingSpinner, null), statusRef.current === "delayed" && /* @__PURE__ */ React247.createElement(DelayedSpinner, null), /* @__PURE__ */ React247.createElement(Box, { className: shadowStyle }, /* @__PURE__ */ React247.createElement(
     AsyncImage,
     {
       alt: "",
@@ -27375,7 +27462,7 @@ var FunNotificationBannerIcon = ({
       src: iconUrl ?? void 0,
       fallbackSrc: fallbackIconUrl
     }
-  )), statusRef.current && /* @__PURE__ */ React246.createElement(
+  )), statusRef.current && /* @__PURE__ */ React247.createElement(
     Box,
     {
       className: clsx21(
@@ -27385,7 +27472,7 @@ var FunNotificationBannerIcon = ({
       width: "20",
       height: "20"
     },
-    /* @__PURE__ */ React246.createElement(Box, { className: clsx21(statusIcon) }, Object.entries(statusIconMap).map(([key, value]) => /* @__PURE__ */ React246.createElement(
+    /* @__PURE__ */ React247.createElement(Box, { className: clsx21(statusIcon) }, Object.entries(statusIconMap).map(([key, value]) => /* @__PURE__ */ React247.createElement(
       "div",
       {
         key,
@@ -27410,7 +27497,7 @@ var FunNotificationBannerIcon = ({
 };
 
 // src/components/FunNotificationBanner/FunNotificationBanner.tsx
-var closeIcon = /* @__PURE__ */ React247.createElement(
+var closeIcon = /* @__PURE__ */ React248.createElement(
   "svg",
   {
     width: "16",
@@ -27419,7 +27506,7 @@ var closeIcon = /* @__PURE__ */ React247.createElement(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   },
-  /* @__PURE__ */ React247.createElement(
+  /* @__PURE__ */ React248.createElement(
     "path",
     {
       d: "M4.89066 4.15281C4.68691 3.94906 4.35657 3.94906 4.15281 4.15281C3.94906 4.35657 3.94906 4.68691 4.15281 4.89066L7.26215 8L4.15281 11.1093C3.94906 11.3131 3.94906 11.6434 4.15281 11.8472C4.35657 12.0509 4.68691 12.0509 4.89066 11.8472L8 8.73785L11.1093 11.8472C11.3131 12.0509 11.6434 12.0509 11.8472 11.8472C12.0509 11.6434 12.0509 11.3131 11.8472 11.1093L8.73785 8L11.8472 4.89066C12.0509 4.68691 12.0509 4.35657 11.8472 4.15281C11.6434 3.94906 11.3131 3.94906 11.1093 4.15281L8 7.26215L4.89066 4.15281Z",
@@ -27443,8 +27530,8 @@ var FunNotificationBanner = ({
     setIsOpen(false);
     onClosed?.();
   };
-  return /* @__PURE__ */ React247.createElement(AnimatePresence5, null, isOpen ? /* @__PURE__ */ React247.createElement(
-    motion12.div,
+  return /* @__PURE__ */ React248.createElement(AnimatePresence5, null, isOpen ? /* @__PURE__ */ React248.createElement(
+    motion13.div,
     {
       initial: {
         height: 0,
@@ -27472,7 +27559,7 @@ var FunNotificationBanner = ({
         }
       }
     },
-    /* @__PURE__ */ React247.createElement(Box, { className: clsx22(notificationBannerStyle) }, /* @__PURE__ */ React247.createElement(
+    /* @__PURE__ */ React248.createElement(Box, { className: clsx22(notificationBannerStyle) }, /* @__PURE__ */ React248.createElement(
       FunIconButton,
       {
         borderRadius: "full",
@@ -27486,14 +27573,14 @@ var FunNotificationBanner = ({
           right: "4px"
         }
       }
-    ), /* @__PURE__ */ React247.createElement(Box, { padding: "16", display: "flex", gap: "16" }, /* @__PURE__ */ React247.createElement(
+    ), /* @__PURE__ */ React248.createElement(Box, { padding: "16", display: "flex", gap: "16" }, /* @__PURE__ */ React248.createElement(
       FunNotificationBannerIcon,
       {
         iconUrl,
         status,
         fallbackIconUrl
       }
-    ), /* @__PURE__ */ React247.createElement(Box, { display: "flex", flexDirection: "column" }, /* @__PURE__ */ React247.createElement(Box, { display: "flex", flexDirection: "column", gap: "6" }, /* @__PURE__ */ React247.createElement(
+    ), /* @__PURE__ */ React248.createElement(Box, { display: "flex", flexDirection: "column" }, /* @__PURE__ */ React248.createElement(Box, { display: "flex", flexDirection: "column", gap: "6" }, /* @__PURE__ */ React248.createElement(
       Text,
       {
         weight: "medium",
@@ -27501,7 +27588,7 @@ var FunNotificationBanner = ({
         style: { lineHeight: "13px" }
       },
       title
-    ), /* @__PURE__ */ React247.createElement(Text, { size: "12", color: "secondaryText" }, description)), disclaimer && /* @__PURE__ */ React247.createElement(
+    ), /* @__PURE__ */ React248.createElement(Text, { size: "12", color: "secondaryText" }, description)), disclaimer && /* @__PURE__ */ React248.createElement(
       Box,
       {
         marginTop: "12",
@@ -27512,9 +27599,9 @@ var FunNotificationBanner = ({
         borderRadius: "8",
         borderColor: "mediumStroke"
       },
-      /* @__PURE__ */ React247.createElement(Text, { color: "secondaryText", size: "12" }, disclaimer)
-    ), /* @__PURE__ */ React247.createElement(AnimatePresence5, null, showMore && /* @__PURE__ */ React247.createElement(
-      motion12.div,
+      /* @__PURE__ */ React248.createElement(Text, { color: "secondaryText", size: "12" }, disclaimer)
+    ), /* @__PURE__ */ React248.createElement(AnimatePresence5, null, showMore && /* @__PURE__ */ React248.createElement(
+      motion13.div,
       {
         initial: {
           height: 0,
@@ -27550,27 +27637,27 @@ var FunNotificationBanner = ({
           }
         }
       },
-      /* @__PURE__ */ React247.createElement(
+      /* @__PURE__ */ React248.createElement(
         Box,
         {
           marginTop: "12"
         },
         children
       )
-    )))), children && /* @__PURE__ */ React247.createElement(
+    )))), children && /* @__PURE__ */ React248.createElement(
       "button",
       {
         type: "button",
         onClick: () => setShowMore((value) => !value),
         className: showMoreButtonStyle
       },
-      /* @__PURE__ */ React247.createElement(
+      /* @__PURE__ */ React248.createElement(
         Text,
         {
           size: "12",
           color: { base: "secondaryText", hover: "primaryText" }
         },
-        /* @__PURE__ */ React247.createElement(Box, { paddingY: "8", textAlign: "center" }, showMore ? "See less" : "See more")
+        /* @__PURE__ */ React248.createElement(Box, { paddingY: "8", textAlign: "center" }, showMore ? "See less" : "See more")
       )
     ))
   ) : null);
@@ -27610,7 +27697,7 @@ var CheckoutNotification = ({
   const { status } = getCheckoutStateBooleans(checkout.state);
   const notificationStatus = isDelayed(checkout) ? "delayed" : status;
   const normalizedTicker = initSettings.config.targetAssetTicker?.toUpperCase();
-  return /* @__PURE__ */ React248.createElement(
+  return /* @__PURE__ */ React249.createElement(
     FunNotificationBanner,
     {
       description: parseDescription(checkout),
@@ -27620,7 +27707,7 @@ var CheckoutNotification = ({
       status: notificationStatus,
       onClosed: () => onClose(depositAddress)
     },
-    /* @__PURE__ */ React248.createElement(
+    /* @__PURE__ */ React249.createElement(
       Box,
       {
         paddingY: "8",
@@ -27631,7 +27718,7 @@ var CheckoutNotification = ({
         borderWidth: "1",
         borderStyle: "solid"
       },
-      /* @__PURE__ */ React248.createElement(OrderDetailSection, { checkoutHistoryItem: checkout })
+      /* @__PURE__ */ React249.createElement(OrderDetailSection, { checkoutHistoryItem: checkout })
     )
   );
 };
@@ -27668,7 +27755,7 @@ var parseDescription = (checkout) => {
 };
 var parseDisclaimer = (checkout, onHelp) => {
   const { isError } = getCheckoutStateBooleans(checkout.state);
-  const contactLink = /* @__PURE__ */ React248.createElement(
+  const contactLink = /* @__PURE__ */ React249.createElement(
     FunLinkButton,
     {
       text: "Contact us",
@@ -27679,16 +27766,16 @@ var parseDisclaimer = (checkout, onHelp) => {
     }
   );
   if (isError) {
-    return /* @__PURE__ */ React248.createElement(React248.Fragment, null, "Your deposit is being processed. ", contactLink, " for more info.");
+    return /* @__PURE__ */ React249.createElement(React249.Fragment, null, "Your deposit is being processed. ", contactLink, " for more info.");
   }
   if (checkout.refundState === "REFUNDED") return "Your order was refunded.";
   if (checkout.refundState === "PROCEEDED" || isDelayed(checkout)) {
-    return /* @__PURE__ */ React248.createElement(React248.Fragment, null, "Transaction was delayed but your funds are safe. ", contactLink, " for more info.");
+    return /* @__PURE__ */ React249.createElement(React249.Fragment, null, "Transaction was delayed but your funds are safe. ", contactLink, " for more info.");
   }
 };
 
 // src/modals/CheckoutModal/TransferToken/DirectExecutionNotification.tsx
-import React249 from "react";
+import React250 from "react";
 var mapDirectExecutionStateToNotificationStatus = (isDelayed2, isRefunded, isCompleted, isFailed) => {
   if (isDelayed2) return "delayed";
   if (isCompleted) return "completed";
@@ -27712,7 +27799,7 @@ var DirectExecutionNotification = ({
     isFailed
   );
   const normalizedTicker = initSettings.config.targetAssetTicker?.toUpperCase();
-  return /* @__PURE__ */ React249.createElement(
+  return /* @__PURE__ */ React250.createElement(
     FunNotificationBanner,
     {
       description: parseDescription2(
@@ -27732,7 +27819,7 @@ var DirectExecutionNotification = ({
       status: notificationStatus,
       onClosed: () => onClose(directExecution.txHash)
     },
-    /* @__PURE__ */ React249.createElement(
+    /* @__PURE__ */ React250.createElement(
       Box,
       {
         paddingY: "8",
@@ -27743,7 +27830,7 @@ var DirectExecutionNotification = ({
         borderWidth: "1",
         borderStyle: "solid"
       },
-      /* @__PURE__ */ React249.createElement(DirectExecutionOrderDetailSection, { directExecution })
+      /* @__PURE__ */ React250.createElement(DirectExecutionOrderDetailSection, { directExecution })
     )
   );
 };
@@ -27769,7 +27856,7 @@ var parseDescription2 = (isDelayed2, isRefunded, isCompleted, isFailed) => {
   return "";
 };
 var parseDisclaimer2 = (isRefunded, isDelayed2, isFailed, onHelp) => {
-  const contactLink = /* @__PURE__ */ React249.createElement(
+  const contactLink = /* @__PURE__ */ React250.createElement(
     FunLinkButton,
     {
       text: "Contact us",
@@ -27780,10 +27867,10 @@ var parseDisclaimer2 = (isRefunded, isDelayed2, isFailed, onHelp) => {
     }
   );
   if (isFailed || isRefunded) {
-    return /* @__PURE__ */ React249.createElement(React249.Fragment, null, "Your deposit didn't complete. ", contactLink, " for more info.");
+    return /* @__PURE__ */ React250.createElement(React250.Fragment, null, "Your deposit didn't complete. ", contactLink, " for more info.");
   }
   if (isDelayed2) {
-    return /* @__PURE__ */ React249.createElement(React249.Fragment, null, "Your deposit is delayed but funds are safe. ", contactLink, " for more info.");
+    return /* @__PURE__ */ React250.createElement(React250.Fragment, null, "Your deposit is delayed but funds are safe. ", contactLink, " for more info.");
   }
 };
 
@@ -27833,7 +27920,7 @@ var CheckoutNotifications = ({
   }, [isExpanded, combinedNotifications]);
   const handleNotificationClose = (id) => setClosedNotifications((prev) => [...prev, id]);
   if (!isVisible) return null;
-  return /* @__PURE__ */ React250.createElement(
+  return /* @__PURE__ */ React251.createElement(
     Box,
     {
       position: "absolute",
@@ -27841,9 +27928,9 @@ var CheckoutNotifications = ({
       maxHeight: "full",
       style: { bottom: 0, left: 0, right: 0, zIndex: OVERLAY_Z_INDEX }
     },
-    /* @__PURE__ */ React250.createElement(Box, { display: "flex", flexDirection: "column", gap: "8", padding: "8" }, displayedNotifications.map((item) => {
+    /* @__PURE__ */ React251.createElement(Box, { display: "flex", flexDirection: "column", gap: "8", padding: "8" }, displayedNotifications.map((item) => {
       if (item.isDirectExecution) {
-        return /* @__PURE__ */ React250.createElement(
+        return /* @__PURE__ */ React251.createElement(
           DirectExecutionNotification,
           {
             key: item.txHash,
@@ -27853,7 +27940,7 @@ var CheckoutNotifications = ({
           }
         );
       }
-      return /* @__PURE__ */ React250.createElement(
+      return /* @__PURE__ */ React251.createElement(
         CheckoutNotification,
         {
           key: item.depositAddr,
@@ -27862,7 +27949,7 @@ var CheckoutNotifications = ({
           onHelp
         }
       );
-    }), combinedNotifications.length > COLLAPSED_COUNT && /* @__PURE__ */ React250.createElement(
+    }), combinedNotifications.length > COLLAPSED_COUNT && /* @__PURE__ */ React251.createElement(
       FunNotificationShowMoreButton,
       {
         isExpanded,
@@ -27901,7 +27988,7 @@ initializeRelayClient({
 var CHECKOUT_DIALOG_CONTENT_ID = "checkout-dialog-content";
 function FunCheckoutModalStepComponent(props) {
   const { Component: Component2 } = CheckoutModalSteps[props.modalState.step];
-  return /* @__PURE__ */ React251.createElement(Component2, { ...props });
+  return /* @__PURE__ */ React252.createElement(Component2, { ...props });
 }
 function FunCheckoutModalInner({
   checkoutItem,
@@ -27959,7 +28046,7 @@ function FunCheckoutModalInner({
     depositAddress: checkoutItem.depositAddress ?? void 0,
     isCheckoutDetailView: modalState.step === "checkout_complete" /* CHECKOUT_COMPLETE */,
     paddingTop: 0,
-    topbar: /* @__PURE__ */ React251.createElement(
+    topbar: /* @__PURE__ */ React252.createElement(
       Dialog.Title,
       {
         hasBackButton: hasBack && !isBlocked,
@@ -27975,7 +28062,7 @@ function FunCheckoutModalInner({
     withTopDivider: checkoutConfig.modalTitleMeta ? "always" : "scroll",
     scrollableContent: CHECKOUT_DIALOG_CONTENT_ID
   });
-  return /* @__PURE__ */ React251.createElement(
+  return /* @__PURE__ */ React252.createElement(
     Dialog,
     {
       open,
@@ -27984,7 +28071,7 @@ function FunCheckoutModalInner({
       titleId: "fun-checkout-modal",
       isHidden: modalState.isSoftHidden
     },
-    /* @__PURE__ */ React251.createElement(FunCheckoutModalHeightAnimationWrapper, { checkoutStep: modalState.step }, topbar, /* @__PURE__ */ React251.createElement(
+    /* @__PURE__ */ React252.createElement(FunCheckoutModalHeightAnimationWrapper, { checkoutStep: modalState.step }, topbar, /* @__PURE__ */ React252.createElement(
       Dialog.Content,
       {
         fullHeight: showFullHeight,
@@ -27994,20 +28081,20 @@ function FunCheckoutModalInner({
         withBottomDivider: modalState.step === "transfer_token" /* TRANSFER_TOKEN */ || modalState.step === "fiat_account_detail" /* FIAT_ACCOUNT_DETAIL */ ? "never" : "scroll",
         id: CHECKOUT_DIALOG_CONTENT_ID
       },
-      isBlocked ? /* @__PURE__ */ React251.createElement(
+      isBlocked ? /* @__PURE__ */ React252.createElement(
         FunCheckoutBlocked,
         {
           reason: isUserGeoblocked ? "geoblock" : "security"
         }
-      ) : /* @__PURE__ */ React251.createElement(React251.Fragment, null, /* @__PURE__ */ React251.createElement(
+      ) : /* @__PURE__ */ React252.createElement(React252.Fragment, null, /* @__PURE__ */ React252.createElement(
         DydxSwitchTab,
         {
           onSwitch: checkoutItem.initSettings.onDydxSwitch,
           showSwitch: showDydxSwitch,
           onClose: onCloseWrapper
         }
-      ), /* @__PURE__ */ React251.createElement(FunCheckoutModalStepComponent, { ...modalProps }))
-    ), /* @__PURE__ */ React251.createElement(Dialog.BottomSection, { id: CHECKOUT_MODAL_BOTTOM_BAR_ID }), !isBlocked && /* @__PURE__ */ React251.createElement(
+      ), /* @__PURE__ */ React252.createElement(FunCheckoutModalStepComponent, { ...modalProps }))
+    ), /* @__PURE__ */ React252.createElement(Dialog.BottomSection, { id: CHECKOUT_MODAL_BOTTOM_BAR_ID }), !isBlocked && /* @__PURE__ */ React252.createElement(
       CheckoutNotifications,
       {
         onHelp: handleCheckoutHelp,
@@ -28021,7 +28108,7 @@ function FunCheckoutModal({ onClose, open }) {
   if (!checkoutItem) {
     return null;
   }
-  return /* @__PURE__ */ React251.createElement(
+  return /* @__PURE__ */ React252.createElement(
     FunCheckoutModalInner,
     {
       checkoutItem,
@@ -28032,7 +28119,7 @@ function FunCheckoutModal({ onClose, open }) {
 }
 
 // src/modals/ConnectModal/ConnectModal.tsx
-import React252 from "react";
+import React253 from "react";
 import { useAccount as useAccount8 } from "wagmi";
 var TITLE_ID2 = "rk_connect_title";
 function ConnectModal({
@@ -28043,12 +28130,12 @@ function ConnectModal({
   const connectionStatus = useConnectionStatus();
   const { disconnect } = useFunkitDisconnect();
   const { isConnecting } = useAccount8();
-  const onConnectModalCancel = React252.useCallback(() => {
+  const onConnectModalCancel = React253.useCallback(() => {
     if (isConnecting) disconnect();
     onClose();
   }, [onClose, disconnect, isConnecting]);
   if (connectionStatus === "disconnected" || connectionStatus === "loading") {
-    return /* @__PURE__ */ React252.createElement(
+    return /* @__PURE__ */ React253.createElement(
       Dialog,
       {
         onClose: onConnectModalCancel,
@@ -28056,7 +28143,7 @@ function ConnectModal({
         titleId: TITLE_ID2,
         isSmartCloseable: true
       },
-      /* @__PURE__ */ React252.createElement(
+      /* @__PURE__ */ React253.createElement(
         FunConnectOptions,
         {
           onClose: onConnectModalCancel,
@@ -28150,7 +28237,7 @@ function ModalProvider({ children }) {
   useEffect47(() => {
     if (isUnauthenticated) closeModals();
   }, [isUnauthenticated]);
-  return /* @__PURE__ */ React253.createElement(
+  return /* @__PURE__ */ React254.createElement(
     ModalContext.Provider,
     {
       value: useMemo45(
@@ -28188,7 +28275,7 @@ function ModalProvider({ children }) {
       )
     },
     children,
-    /* @__PURE__ */ React253.createElement(
+    /* @__PURE__ */ React254.createElement(
       ConnectModal,
       {
         onClose: closeConnectModal,
@@ -28196,7 +28283,7 @@ function ModalProvider({ children }) {
         walletsOnly: !!walletsOnly
       }
     ),
-    /* @__PURE__ */ React253.createElement(
+    /* @__PURE__ */ React254.createElement(
       AccountModal,
       {
         onClose: closeAccountModal,
@@ -28204,8 +28291,8 @@ function ModalProvider({ children }) {
         defaultTab: accountModalTab
       }
     ),
-    /* @__PURE__ */ React253.createElement(ChainModal, { onClose: closeChainModal, open: chainModalOpen }),
-    /* @__PURE__ */ React253.createElement(
+    /* @__PURE__ */ React254.createElement(ChainModal, { onClose: closeChainModal, open: chainModalOpen }),
+    /* @__PURE__ */ React254.createElement(
       FunCheckoutModal,
       {
         onClose: closeFunCheckoutModal,
@@ -28946,7 +29033,7 @@ var FunkitWeb2Provider = ({
     handleFunkitWeb2Logout,
     web2UserInfo
   };
-  return /* @__PURE__ */ React254.createElement(FunkitWeb2Context.Provider, { value: contextValue }, privyIframeUrl ? /* @__PURE__ */ React254.createElement(
+  return /* @__PURE__ */ React255.createElement(FunkitWeb2Context.Provider, { value: contextValue }, privyIframeUrl ? /* @__PURE__ */ React255.createElement(
     "iframe",
     {
       id: PRIVY_IFRAME_ID,
@@ -28979,7 +29066,7 @@ function useConnectionStatus() {
 }
 
 // src/providers/ShowBalanceContext.tsx
-import React255, {
+import React256, {
   createContext as createContext19,
   useContext as useContext19,
   useState as useState68
@@ -28990,13 +29077,13 @@ var ShowBalanceContext = createContext19({
 });
 function ShowBalanceProvider({ children }) {
   const [showBalance, setShowBalance] = useState68();
-  return /* @__PURE__ */ React255.createElement(ShowBalanceContext.Provider, { value: { showBalance, setShowBalance } }, children);
+  return /* @__PURE__ */ React256.createElement(ShowBalanceContext.Provider, { value: { showBalance, setShowBalance } }, children);
 }
 var useShowBalance = () => useContext19(ShowBalanceContext);
 
 // src/components/ConnectButton/ConnectButtonRenderer.tsx
 import { formatCurrencyAndStringify as formatCurrencyAndStringify16, isMobile as isMobile14, noop as noop8 } from "@funkit/utils";
-import React256 from "react";
+import React257 from "react";
 import { useAccount as useAccount11, useBalance, useConfig as useConfig6 } from "wagmi";
 
 // src/hooks/useIsMounted.ts
@@ -29087,7 +29174,7 @@ function ConnectButtonRenderer({
   const { openChainModal } = useChainModal();
   const { openAccountModal } = useAccountModal();
   const { accountModalOpen, chainModalOpen, connectModalOpen } = useModalState();
-  return /* @__PURE__ */ React256.createElement(React256.Fragment, null, children({
+  return /* @__PURE__ */ React257.createElement(React257.Fragment, null, children({
     account: address ? {
       address,
       balanceDecimals: balanceData?.decimals,
@@ -29143,7 +29230,7 @@ function ChainSelectorButton({
   openChainModal,
   chain
 }) {
-  return /* @__PURE__ */ React257.createElement(
+  return /* @__PURE__ */ React258.createElement(
     Box,
     {
       alignItems: "center",
@@ -29171,7 +29258,7 @@ function ChainSelectorButton({
       type: "button",
       ...connectButtonStyles
     },
-    unsupportedChain ? /* @__PURE__ */ React257.createElement(Box, { alignItems: "center", display: "flex", height: "24", paddingX: "4" }, "Wrong network") : /* @__PURE__ */ React257.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, chain.hasIcon ? /* @__PURE__ */ React257.createElement(
+    unsupportedChain ? /* @__PURE__ */ React258.createElement(Box, { alignItems: "center", display: "flex", height: "24", paddingX: "4" }, "Wrong network") : /* @__PURE__ */ React258.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, chain.hasIcon ? /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: mapResponsiveValue(
@@ -29181,7 +29268,7 @@ function ChainSelectorButton({
         height: "12",
         width: "12"
       },
-      /* @__PURE__ */ React257.createElement(
+      /* @__PURE__ */ React258.createElement(
         AsyncImage,
         {
           alt: chain.name ?? "Chain icon",
@@ -29192,7 +29279,7 @@ function ChainSelectorButton({
           src: chain.iconUrl
         }
       )
-    ) : null, /* @__PURE__ */ React257.createElement(
+    ) : null, /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: mapResponsiveValue(chainStatus, (value) => {
@@ -29212,7 +29299,7 @@ function AccountButton({
   showBalance,
   accountStatus
 }) {
-  return /* @__PURE__ */ React257.createElement(
+  return /* @__PURE__ */ React258.createElement(
     Box,
     {
       alignItems: "center",
@@ -29232,7 +29319,7 @@ function AccountButton({
       gap: "16",
       ...connectButtonStyles
     },
-    account.displayBalance && /* @__PURE__ */ React257.createElement(
+    account.displayBalance && /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: mapResponsiveValue(
@@ -29242,7 +29329,7 @@ function AccountButton({
       },
       account.displayBalance
     ),
-    /* @__PURE__ */ React257.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, /* @__PURE__ */ React257.createElement(
+    /* @__PURE__ */ React258.createElement(Box, { alignItems: "center", display: "flex", gap: "6" }, /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: mapResponsiveValue(
@@ -29250,7 +29337,7 @@ function AccountButton({
           (value) => value === "full" || value === "avatar" ? "block" : "none"
         )
       },
-      /* @__PURE__ */ React257.createElement(
+      /* @__PURE__ */ React258.createElement(
         Avatar,
         {
           address: account.address,
@@ -29259,7 +29346,7 @@ function AccountButton({
           size: 12
         }
       )
-    ), /* @__PURE__ */ React257.createElement(
+    ), /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: mapResponsiveValue(
@@ -29290,7 +29377,7 @@ function ConnectButton({
     setShowBalance(showBalance);
     if (!ready) setReady(true);
   }, [showBalance, setShowBalance, ready]);
-  return ready ? /* @__PURE__ */ React257.createElement(ConnectButtonRenderer, null, ({
+  return ready ? /* @__PURE__ */ React258.createElement(ConnectButtonRenderer, null, ({
     account,
     chain,
     mounted,
@@ -29300,7 +29387,7 @@ function ConnectButton({
   }) => {
     const ready2 = mounted && connectionStatus !== "loading";
     const unsupportedChain = chain?.unsupported ?? false;
-    return /* @__PURE__ */ React257.createElement(
+    return /* @__PURE__ */ React258.createElement(
       Box,
       {
         display: "flex",
@@ -29316,7 +29403,7 @@ function ConnectButton({
       },
       ready2 && account && connectionStatus === "connected" ? (
         // Logged in: Chain Button & Account Button
-        /* @__PURE__ */ React257.createElement(React257.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React257.createElement(
+        /* @__PURE__ */ React258.createElement(React258.Fragment, null, showChainSelector && chain && (chains.length > 1 || unsupportedChain) && /* @__PURE__ */ React258.createElement(
           ChainSelectorButton,
           {
             unsupportedChain,
@@ -29324,7 +29411,7 @@ function ConnectButton({
             openChainModal,
             chain
           }
-        ), !unsupportedChain && /* @__PURE__ */ React257.createElement(
+        ), !unsupportedChain && /* @__PURE__ */ React258.createElement(
           AccountButton,
           {
             openAccountModal,
@@ -29335,7 +29422,7 @@ function ConnectButton({
         ))
       ) : (
         // Not logged in: Connect Button
-        /* @__PURE__ */ React257.createElement(
+        /* @__PURE__ */ React258.createElement(
           Box,
           {
             as: "button",
@@ -29353,19 +29440,19 @@ function ConnectButton({
             type: "button",
             ...connectButtonStyles
           },
-          /* @__PURE__ */ React257.createElement(Box, { display: "flex", gap: "8", alignItems: "center" }, mounted && label, suffixIcon)
+          /* @__PURE__ */ React258.createElement(Box, { display: "flex", gap: "8", alignItems: "center" }, mounted && label, suffixIcon)
         )
       )
     );
-  }) : /* @__PURE__ */ React257.createElement(React257.Fragment, null);
+  }) : /* @__PURE__ */ React258.createElement(React258.Fragment, null);
 }
 ConnectButton.__defaultProps = defaultProps;
 ConnectButton.Custom = ConnectButtonRenderer;
 
 // src/components/Icons/FunkitPaymentsIconLine.tsx
-import React258 from "react";
+import React259 from "react";
 function MetaMaskPaymentIcon({ size = 16 }) {
-  return /* @__PURE__ */ React258.createElement(
+  return /* @__PURE__ */ React259.createElement(
     "svg",
     {
       width: size,
@@ -29374,7 +29461,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M24.0891 3.1199L15.3446 9.61456L16.9617 5.7828L24.0891 3.1199Z",
@@ -29385,7 +29472,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M3.90207 3.1199L12.5763 9.67608L11.0383 5.7828L3.90207 3.1199Z",
@@ -29396,7 +29483,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M20.9429 18.1745L18.6139 21.7426L23.597 23.1136L25.0295 18.2536L20.9429 18.1745Z",
@@ -29407,7 +29494,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M2.97929 18.2536L4.40301 23.1136L9.38607 21.7426L7.05713 18.1745L2.97929 18.2536Z",
@@ -29418,7 +29505,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.10483 12.1456L7.71626 14.2461L12.6642 14.4658L12.4884 9.14877L9.10483 12.1456Z",
@@ -29429,7 +29516,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M18.8864 12.1456L15.4589 9.08725L15.3446 14.4658L20.2837 14.2461L18.8864 12.1456Z",
@@ -29440,7 +29527,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.38606 21.7426L12.3566 20.2925L9.79033 18.2888L9.38606 21.7426Z",
@@ -29451,7 +29538,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M15.6347 20.2925L18.6139 21.7426L18.2009 18.2888L15.6347 20.2925Z",
@@ -29462,7 +29549,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M18.6139 21.7426L15.6347 20.2925L15.8719 22.2348L15.8456 23.0521L18.6139 21.7426Z",
@@ -29473,7 +29560,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.38606 21.7426L12.1544 23.0521L12.1368 22.2348L12.3566 20.2925L9.38606 21.7426Z",
@@ -29484,7 +29571,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M12.1984 17.0056L9.72002 16.2762L11.4689 15.4765L12.1984 17.0056Z",
@@ -29495,7 +29582,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M15.7928 17.0056L16.5223 15.4765L18.28 16.2762L15.7928 17.0056Z",
@@ -29506,7 +29593,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.38606 21.7426L9.80791 18.1745L7.05712 18.2536L9.38606 21.7426Z",
@@ -29517,7 +29604,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M18.1921 18.1745L18.6139 21.7426L20.9429 18.2536L18.1921 18.1745Z",
@@ -29528,7 +29615,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M20.2837 14.2461L15.3446 14.4658L15.8016 17.0057L16.5311 15.4765L18.2888 16.2762L20.2837 14.2461Z",
@@ -29539,7 +29626,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.72002 16.2762L11.4777 15.4765L12.1984 17.0057L12.6642 14.4658L7.71626 14.2461L9.72002 16.2762Z",
@@ -29550,7 +29637,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M7.71626 14.2461L9.79033 18.2888L9.72002 16.2762L7.71626 14.2461Z",
@@ -29561,7 +29648,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M18.2888 16.2762L18.2009 18.2888L20.2837 14.2461L18.2888 16.2762Z",
@@ -29572,7 +29659,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M12.6642 14.4658L12.1984 17.0057L12.7784 20.0025L12.9102 16.0565L12.6642 14.4658Z",
@@ -29583,7 +29670,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M15.3446 14.4658L15.1073 16.0477L15.2128 20.0025L15.8016 17.0057L15.3446 14.4658Z",
@@ -29594,7 +29681,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M15.8016 17.0056L15.2128 20.0025L15.6347 20.2925L18.2009 18.2888L18.2888 16.2762L15.8016 17.0056Z",
@@ -29605,7 +29692,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.72002 16.2762L9.79033 18.2888L12.3566 20.2925L12.7784 20.0025L12.1984 17.0056L9.72002 16.2762Z",
@@ -29616,7 +29703,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.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",
@@ -29627,7 +29714,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.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",
@@ -29638,7 +29725,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.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",
@@ -29649,7 +29736,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.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",
@@ -29660,7 +29747,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M23.4827 13.4903L18.8864 12.1456L20.2837 14.2461L18.2009 18.2888L20.9429 18.2536H25.0295L23.4827 13.4903Z",
@@ -29671,7 +29758,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement(
       "path",
       {
         d: "M9.10484 12.1456L4.50848 13.4903L2.97929 18.2536H7.05713L9.79033 18.2888L7.71626 14.2461L9.10484 12.1456Z",
@@ -29682,7 +29769,7 @@ function MetaMaskPaymentIcon({ size = 16 }) {
         strokeLinejoin: "round"
       }
     ),
-    /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.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",
@@ -29696,14 +29783,14 @@ function MetaMaskPaymentIcon({ size = 16 }) {
   );
 }
 function MastercardPaymentIcon({ size = 16 }) {
-  return /* @__PURE__ */ React258.createElement(
+  return /* @__PURE__ */ React259.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       height: size,
       viewBox: "0 0 152.407 108"
     },
-    /* @__PURE__ */ React258.createElement("g", null, /* @__PURE__ */ React258.createElement("rect", { width: "152.407", height: "108", fill: "transparent" }), /* @__PURE__ */ React258.createElement("g", null, /* @__PURE__ */ React258.createElement(
+    /* @__PURE__ */ React259.createElement("g", null, /* @__PURE__ */ React259.createElement("rect", { width: "152.407", height: "108", fill: "transparent" }), /* @__PURE__ */ React259.createElement("g", null, /* @__PURE__ */ React259.createElement(
       "rect",
       {
         x: "60.4117",
@@ -29712,21 +29799,21 @@ function MastercardPaymentIcon({ size = 16 }) {
         height: "56.6064",
         fill: "#ff5f00"
       }
-    ), /* @__PURE__ */ React258.createElement(
+    ), /* @__PURE__ */ React259.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__ */ React258.createElement(
+    ), /* @__PURE__ */ React259.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__ */ React258.createElement(
+    ), /* @__PURE__ */ React259.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",
@@ -29740,7 +29827,7 @@ function FunkitPaymentsIconLine({
   size = 16,
   gap = "2"
 }) {
-  return /* @__PURE__ */ React258.createElement(
+  return /* @__PURE__ */ React259.createElement(
     Box,
     {
       display: "flex",
@@ -29749,9 +29836,9 @@ function FunkitPaymentsIconLine({
       alignItems: "center",
       justifyContent: "center"
     },
-    /* @__PURE__ */ React258.createElement(MetaMaskPaymentIcon, { size }),
-    /* @__PURE__ */ React258.createElement(MastercardPaymentIcon, { size }),
-    /* @__PURE__ */ React258.createElement(CoinbaseIcon, { size })
+    /* @__PURE__ */ React259.createElement(MetaMaskPaymentIcon, { size }),
+    /* @__PURE__ */ React259.createElement(MastercardPaymentIcon, { size }),
+    /* @__PURE__ */ React259.createElement(CoinbaseIcon, { size })
   );
 }
 
@@ -29810,7 +29897,7 @@ var useUpdateActiveFunkitCheckout = () => {
 
 // src/providers/FunkitProvider.tsx
 import { QueryClientProvider } from "@tanstack/react-query";
-import React259, { createContext as createContext20, useContext as useContext20 } from "react";
+import React260, { createContext as createContext20, useContext as useContext20 } from "react";
 import { WagmiProvider, useAccountEffect as useAccountEffect3 } from "wagmi";
 
 // src/utils/funkitProvider.ts
@@ -29894,7 +29981,7 @@ function setFunkitConnectVersion({ version }) {
   localStorage.setItem(storageKey5, version);
 }
 function getCurrentSdkVersion() {
-  return "5.5.0";
+  return "5.5.1";
 }
 function useFingerprint() {
   const fingerprint = useCallback49(() => {
@@ -29945,7 +30032,7 @@ function FunkitProvider(props) {
     !!props.debug,
     getCurrentSdkVersion()
   );
-  const MainChild = /* @__PURE__ */ React259.createElement(FunkitThemeProvider, { theme: props.theme }, /* @__PURE__ */ React259.createElement(
+  const MainChild = /* @__PURE__ */ React260.createElement(FunkitThemeProvider, { theme: props.theme }, /* @__PURE__ */ React260.createElement(
     FunkitProviderInner,
     {
       avatar: props.avatar,
@@ -29958,7 +30045,7 @@ function FunkitProvider(props) {
     },
     props.children
   ));
-  return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React259.createElement(WagmiProvider, { config: finalWagmiConfig }, /* @__PURE__ */ React259.createElement(QueryClientProvider, { client: finalQueryClient }, MainChild)) : MainChild;
+  return finalWagmiConfig && finalQueryClient ? /* @__PURE__ */ React260.createElement(WagmiProvider, { config: finalWagmiConfig }, /* @__PURE__ */ React260.createElement(QueryClientProvider, { client: finalQueryClient }, MainChild)) : MainChild;
 }
 function FunkitProviderInner({
   avatar,
@@ -29978,7 +30065,7 @@ function FunkitProviderInner({
   const avatarContext = avatar ?? defaultAvatar;
   const isSandboxMode = !!sandbox;
   const modalSizeFinal = modalSize || ModalSizeOptions.COMPACT;
-  return /* @__PURE__ */ React259.createElement(FunkitConfigContext.Provider, { value: funkitConfig }, /* @__PURE__ */ React259.createElement(FunkitConnectChainProvider, { initialChain }, /* @__PURE__ */ React259.createElement(ModalSizeProvider, { modalSize: modalSizeFinal }, /* @__PURE__ */ React259.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React259.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React259.createElement(FunkitFlagsProvider, null, /* @__PURE__ */ React259.createElement(FunkitCheckoutHistoryProvider, null, /* @__PURE__ */ React259.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React259.createElement(FunkitQuoteProvider, null, /* @__PURE__ */ React259.createElement(FunkitSandboxContext.Provider, { value: isSandboxMode }, /* @__PURE__ */ React259.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React259.createElement(AvatarContext.Provider, { value: avatarContext }, /* @__PURE__ */ React259.createElement(ThemeIdContext2.Provider, { value: id }, /* @__PURE__ */ React259.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React259.createElement(FunkitMoonpayProvider, { debug: !!debug }, /* @__PURE__ */ React259.createElement(UserPresenceProvider, null, /* @__PURE__ */ React259.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React259.createElement(
+  return /* @__PURE__ */ React260.createElement(FunkitConfigContext.Provider, { value: funkitConfig }, /* @__PURE__ */ React260.createElement(FunkitConnectChainProvider, { initialChain }, /* @__PURE__ */ React260.createElement(ModalSizeProvider, { modalSize: modalSizeFinal }, /* @__PURE__ */ React260.createElement(FunkitWeb2Provider, null, /* @__PURE__ */ React260.createElement(GeneralWalletProvider, null, /* @__PURE__ */ React260.createElement(FunkitFlagsProvider, null, /* @__PURE__ */ React260.createElement(FunkitCheckoutHistoryProvider, null, /* @__PURE__ */ React260.createElement(FunkitCheckoutProvider, null, /* @__PURE__ */ React260.createElement(FunkitQuoteProvider, null, /* @__PURE__ */ React260.createElement(FunkitSandboxContext.Provider, { value: isSandboxMode }, /* @__PURE__ */ React260.createElement(FunkitMeshProvider, null, /* @__PURE__ */ React260.createElement(AvatarContext.Provider, { value: avatarContext }, /* @__PURE__ */ React260.createElement(ThemeIdContext2.Provider, { value: id }, /* @__PURE__ */ React260.createElement(ShowBalanceProvider, null, /* @__PURE__ */ React260.createElement(FunkitMoonpayProvider, { debug: !!debug }, /* @__PURE__ */ React260.createElement(UserPresenceProvider, null, /* @__PURE__ */ React260.createElement(ModalProvider, null, activeTheme ? /* @__PURE__ */ React260.createElement(
     "div",
     {
       ...createThemeRootProps2(id),
@@ -29987,7 +30074,7 @@ function FunkitProviderInner({
         height: "100%"
       }
     },
-    /* @__PURE__ */ React259.createElement(
+    /* @__PURE__ */ React260.createElement(
       "style",
       {
         dangerouslySetInnerHTML: {