@funkit/connect 5.5.6 → 5.5.9

package/dist/index.js

@@ -12,18 +12,19 @@ import {
 // src/components/Dialog/DialogContent.css.ts
 var BASE_DIALOG_PADDING = "6";
 var SCROLL_BAR_WIDTH = 6;
-var contentCollapsed = "_1pzt423e";
-var contentExpanded = "_1pzt423d";
+var contentCollapsed = "_1pzt423f";
+var contentExpanded = "_1pzt423e";
 var dialog = "_1pzt4231 _1rsrm2fjf _1rsrm2fzx _1rsrm2fw _1rsrm2f1b _1rsrm2f1f _1rsrm2f1cx _1rsrm2fa _1rsrm2f1p _1rsrm2fbs _1rsrm2fev _1rsrm2fca _1rsrm2fdh _1rsrm2fcq";
 var dialogCompact = "_1pzt4232 _1pzt4231 _1rsrm2fjf _1rsrm2fzx _1rsrm2fw _1rsrm2f1b _1rsrm2f1f _1rsrm2f1cx _1rsrm2fa _1rsrm2f1p _1rsrm2fbs _1rsrm2fev _1rsrm2fca _1rsrm2fdh _1rsrm2fcq";
 var dialogMedium = "_1pzt4233 _1pzt4231 _1rsrm2fjf _1rsrm2fzx _1rsrm2fw _1rsrm2f1b _1rsrm2f1f _1rsrm2f1cx _1rsrm2fa _1rsrm2f1p _1rsrm2fbs _1rsrm2fev _1rsrm2fca _1rsrm2fdh _1rsrm2fcq";
-var dialogMobile = "_1pzt4236 _1rsrm2fx _1rsrm2f1f";
-var dialogWithoutInternalPadding = "_1pzt4234 _1pzt4231 _1rsrm2fjf _1rsrm2fzx _1rsrm2fw _1rsrm2f1b _1rsrm2f1f _1rsrm2f1cx _1rsrm2fa _1rsrm2f1p _1rsrm2fbs _1rsrm2fev _1rsrm2fca _1rsrm2fdh _1rsrm2fcq";
-var dividerTransition = "_1pzt423c";
-var fullHeightContent = "_1pzt423a";
-var noPaddingContent = "_1pzt423b";
-var scrollContent = "_1pzt4238 _1rsrm2fg0";
-var scrollbarHidden = "_1pzt4239";
+var dialogMobile = "_1pzt4237 _1rsrm2fx _1rsrm2f1f";
+var dividerTransition = "_1pzt423d";
+var fullHeightContent = "_1pzt423b";
+var noPaddingContent = "_1pzt423c";
+var scrollContent = "_1pzt4239 _1rsrm2fg0";
+var scrollbarHidden = "_1pzt423a";
+var withoutBottomPadding = "_1pzt4235";
+var withoutSidePadding = "_1pzt4234";
 
 // src/modals/DevTest/DevEmbed.tsx
 import React2 from "react";
@@ -509,7 +510,7 @@ import React256, {
   useCallback as useCallback47,
   useContext as useContext18,
   useEffect as useEffect48,
-  useMemo as useMemo46,
+  useMemo as useMemo43,
   useState as useState67
 } from "react";
 import { useConfig as useConfig5, useConnect as useConnect2, useDisconnect as useDisconnect2 } from "wagmi";
@@ -1031,7 +1032,7 @@ import React255, {
   useCallback as useCallback46,
   useContext as useContext17,
   useEffect as useEffect47,
-  useMemo as useMemo45,
+  useMemo as useMemo42,
   useState as useState66
 } from "react";
 import { useAccount as useAccount9, useAccountEffect as useAccountEffect2, useConfig as useConfig4 } from "wagmi";
@@ -3237,7 +3238,7 @@ var flagConfig = {
           {
             key: "userId",
             type: "pctRollout",
-            pct: 10
+            pct: 50
           },
           {
             key: "apiKey",
@@ -3603,8 +3604,12 @@ var flagConfig = {
               "0x2A8Bd916E85d98d8175258De99fc0ddbcC102eF6",
               "0xda6b07Eb94f699F511a943e9bFC12B64B7fe3486",
               "0x0D6e43CA32545B3dc2FE6f93AafBD7e640F548d4",
-              "0x236c60C57a8B9ca563Fb0dA5199FDdCB686d91E8"
+              "0x236c60C57a8B9ca563Fb0dA5199FDdCB686d91E8",
               // greg
+              "0x4a1457fa2845bAfE8D3909cA3C5ac6107be312Dd",
+              // william PM
+              "0xfCB8B2d294eD7373B3B590dd7C0CBC430d41a9a0"
+              // Arun from Meld
             ]
           }
         ],
@@ -3623,7 +3628,13 @@ var flagConfig = {
             values: [POLYMARKET_API_KEY2]
           }
         ],
-        if_any: [],
+        if_any: [
+          {
+            key: "userId",
+            type: "pctRollout",
+            pct: 0
+          }
+        ],
         value: true
       },
       {
@@ -3657,6 +3668,14 @@ var flagConfig = {
       PLN: [370, 1860, 3715],
       SGD: [130, 645, 1285]
     })
+  },
+  [FlagKey.MinTokenTransferValue]: {
+    type: "string",
+    default_value: JSON.stringify({
+      CA: { mainnet: 80, nonMainnet: 15 },
+      AU: { mainnet: 90, nonMainnet: 20 },
+      DEFAULT: { mainnet: 50, nonMainnet: 10 }
+    })
   }
 };
 
@@ -3922,7 +3941,7 @@ import {
   isTokenEquivalent as isTokenEquivalent2,
   round
 } from "@funkit/utils";
-import { polygon as polygon2 } from "viem/chains";
+import { arbitrum as arbitrum2, polygon as polygon2 } from "viem/chains";
 
 // src/hooks/useCheckoutDirectExecution.ts
 import { DirectExecutionType } from "@funkit/api-base";
@@ -4042,13 +4061,17 @@ function isVertexDirectExecution({
   config,
   paymentMethod,
   sourceAsset,
-  sourceChain
+  sourceChain,
+  targetAsset,
+  targetChain
 }) {
   return isVertexCustomer(apiKey) && isCheckoutPostActionRequired(config) && paymentMethod === "balance" /* ACCOUNT_BALANCE */ && isTokenEquivalent({
     firstTokenAddress: sourceAsset,
     firstTokenChainId: sourceChain,
-    secondTokenAddress: config.targetAsset,
-    secondTokenChainId: config.targetChain
+    // consider the current target asset and chain first before the config values, reasoning is the real values get updated after submitting the Select Asset step, not when the Receive token dropdown changes value
+    // if needed, we can still provide config values as current target asset and chain
+    secondTokenAddress: targetAsset ?? config.targetAsset,
+    secondTokenChainId: targetChain ?? config.targetChain
   });
 }
 function useCheckoutDirectExecution() {
@@ -4223,6 +4246,9 @@ var DEFAULT_CHECKOUT_HISTORY_DETAIL_TITLE = "Your Purchase";
 var ASSET_DECIMALS = 5;
 var USD_DECIMALS = 2;
 var USD_INITIAL_AMOUNT = 100;
+function getDefaultAmountFromQuickOptions(quickOptions) {
+  return quickOptions?.[Math.floor((quickOptions.length - 1) / 2)];
+}
 function getUsdMaxAmount(maxUsd) {
   if (maxUsd < Number.MAX_VALUE) return maxUsd;
   return null;
@@ -4345,6 +4371,10 @@ function isDefaultToken(asset, checkoutConfig) {
   );
 }
 var isPolygonEcosystemToken = (chainId, tokenAddress) => chainId === polygon2.id.toString() && tokenAddress === "0x0000000000000000000000000000000000001010";
+var isVertexTokenOnArbitrum = (chainId, tokenAddress) => chainId === arbitrum2.id.toString() && isTokenAddressEquivalent2({
+  firstTokenAddress: tokenAddress,
+  secondTokenAddress: "0x95146881b86b3ee99e63705ec87afe29fcc044d9"
+});
 var isAssetUsableToPayForCheckout = ({
   apiKey,
   config,
@@ -4372,24 +4402,28 @@ var isAssetUsableToPayForCheckout = ({
   if (isSameAsPurchasingToken) {
     return { isUsable: false, reason: "Not Applicable" };
   }
+  const isVertexDirectExecutionCase = isVertexDirectExecution({
+    apiKey,
+    config,
+    paymentMethod,
+    targetAsset: targetTokenAddress,
+    targetChain: targetChainId,
+    sourceAsset: assetTokenAddress,
+    sourceChain: assetChainId
+  });
   const usableAmountEstimation = getUsdAvailableAmount(
     targetChainId,
     assetChainId,
     assetUsdAmount,
     paymentMethod,
-    isVertexDirectExecution({
-      apiKey,
-      config,
-      paymentMethod,
-      sourceAsset: assetTokenAddress,
-      sourceChain: assetChainId
-    })
+    isVertexDirectExecutionCase
   );
   if (usableAmountEstimation !== null && usableAmountEstimation < getUsdMinAmount(paymentMethod)) {
     return { isUsable: false, reason: LOW_BALANCE };
   }
+  const isVertexTokenDisabledOnArbitrum = isVertexTokenOnArbitrum(assetChainId, assetTokenAddress) && !isVertexDirectExecutionCase;
   const isConnectedAccountSupported = loginType !== "web2" /* Web2 */ || FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO[assetChainId]?.isFunWalletSupported;
-  const isSupported = isAllowedForCheckout && isConnectedAccountSupported && FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO[assetChainId]?.isCheckoutSupported;
+  const isSupported = isAllowedForCheckout && isConnectedAccountSupported && FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO[assetChainId]?.isCheckoutSupported && !isVertexTokenDisabledOnArbitrum;
   return {
     isUsable: !!isSupported,
     reason: !isSupported ? "Unsupported" : ""
@@ -6062,7 +6096,7 @@ var HelpIcon = () => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React57.createElement("g", { "clip-path": "url(#clip0_29018_24767)" }, /* @__PURE__ */ React57.createElement(
+    /* @__PURE__ */ React57.createElement("g", { clipPath: "url(#clip0_29018_24767)" }, /* @__PURE__ */ React57.createElement(
       "path",
       {
         d: "M6.09825 6.50016C6.25498 6.05461 6.56435 5.6789 6.97155 5.43958C7.37875 5.20027 7.85751 5.11279 8.32303 5.19264C8.78855 5.27249 9.21079 5.51451 9.51497 5.87585C9.81914 6.23718 9.98562 6.69451 9.98491 7.16683C9.98491 8.50016 7.98492 9.16683 7.98492 9.16683M8.03825 11.8335H8.04492M14.7049 8.50016C14.7049 12.1821 11.7201 15.1668 8.03825 15.1668C4.35635 15.1668 1.37158 12.1821 1.37158 8.50016C1.37158 4.81826 4.35635 1.8335 8.03825 1.8335C11.7201 1.8335 14.7049 4.81826 14.7049 8.50016Z",
@@ -6183,7 +6217,8 @@ function Dialog({
   titleId,
   isHidden = false,
   isSmartCloseable = false,
-  withoutInternalPadding = false,
+  withoutSidePadding: withoutSidePadding2 = false,
+  withoutBottomPadding: withoutBottomPadding2 = false,
   withTransition = true
 }) {
   const { allowBackgroundScroll } = useFunkitConfig();
@@ -6269,7 +6304,8 @@ function Dialog({
           /* @__PURE__ */ React59.createElement(FocusTrap, { className: content }, /* @__PURE__ */ React59.createElement(
             DialogWrapper,
             {
-              withoutInternalPadding
+              withoutSidePadding: withoutSidePadding2,
+              withoutBottomPadding: withoutBottomPadding2
             },
             children
           ))
@@ -6281,7 +6317,8 @@ function Dialog({
 }
 var DialogWrapper = ({
   children,
-  withoutInternalPadding = false
+  withoutSidePadding: withoutSidePadding2 = false,
+  withoutBottomPadding: withoutBottomPadding2 = false
 }) => {
   const mobile = isMobile2();
   const modalSize = useContext9(ModalSizeContext);
@@ -6296,7 +6333,8 @@ var DialogWrapper = ({
       className: clsx6(
         mapModalSizeToClassName[modalSize],
         mobile && dialogMobile,
-        withoutInternalPadding && dialogWithoutInternalPadding
+        withoutSidePadding2 && withoutSidePadding,
+        withoutBottomPadding2 && withoutBottomPadding
       )
     },
     children
@@ -7022,7 +7060,7 @@ function getCheckoutCompletionTime(checkout) {
 }
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryDetail.tsx
-import React221, { useCallback as useCallback40, useMemo as useMemo39, useState as useState57 } from "react";
+import React221, { useCallback as useCallback40, useMemo as useMemo36, useState as useState57 } from "react";
 import { createPortal as createPortal14 } from "react-dom";
 
 // src/components/HelpAlert/HelpAlert.tsx
@@ -7777,7 +7815,7 @@ import {
   getAllWalletTokens
 } from "@funkit/api-base";
 import { keepPreviousData, useQuery as useQuery5 } from "@tanstack/react-query";
-import { arbitrum as arbitrum2, polygon as polygon3 } from "viem/chains";
+import { arbitrum as arbitrum3, polygon as polygon3 } from "viem/chains";
 import { useAccount as useAccount3 } from "wagmi";
 
 // src/utils/assets.ts
@@ -7812,7 +7850,7 @@ function normalizeAssetSymbol(asset) {
   if (isTokenEquivalent3({
     firstTokenChainId: asset.chainId,
     firstTokenAddress: asset.contractAddress,
-    secondTokenChainId: arbitrum2.id.toString(),
+    secondTokenChainId: arbitrum3.id.toString(),
     secondTokenAddress: ARBITRUM_USDCE_TOKEN
   })) {
     return { ...asset, symbol: "USDC.e" };
@@ -8513,6 +8551,8 @@ var isCountryBlocked = (blockedList, userIpInfo) => {
 function useFunkitUserIp() {
   const { moonpayApiKey } = useContext14(FunkitMoonpayContext);
   const { getFlag, isLoading: isLoadingFlags } = useFlags();
+  const { apiKey } = useFunkitConfig();
+  const isPolymarket = isPolymarketCustomer(apiKey);
   const { data: userIpInfo, isLoading: isLoadingGeoCheck } = useQuery6({
     queryKey: ["getUserIpInfo"],
     queryFn: async () => {
@@ -8535,7 +8575,7 @@ function useFunkitUserIp() {
     refetchOnWindowFocus: false
   });
   const isUserGeoblocked = useMemo9(() => {
-    if (isLoadingFlags || isLoadingGeoCheck) {
+    if (isLoadingFlags || isLoadingGeoCheck || isPolymarket) {
       return false;
     }
     if (!userIpInfo) {
@@ -8543,7 +8583,7 @@ function useFunkitUserIp() {
     }
     const blockedList = getFlag(FlagKey7.BlockedCountries, ALL_MATCH).split(",");
     return isCountryBlocked(blockedList, userIpInfo);
-  }, [getFlag, isLoadingFlags, isLoadingGeoCheck, userIpInfo]);
+  }, [getFlag, isLoadingFlags, isLoadingGeoCheck, userIpInfo, isPolymarket]);
   return {
     isLoadingGeoCheck: isLoadingFlags || isLoadingGeoCheck,
     isUserGeoblocked,
@@ -10695,7 +10735,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 React214, { Fragment as Fragment3, useCallback as useCallback39, useMemo as useMemo37, useState as useState55 } from "react";
+import React214, { Fragment as Fragment3, useCallback as useCallback39, useMemo as useMemo34, useState as useState55 } from "react";
 
 // src/providers/walletConnectDeepLink.ts
 var storageKey2 = "WALLETCONNECT_DEEPLINK_CHOICE";
@@ -11292,7 +11332,7 @@ var SocialsIcon = () => {
 };
 
 // src/components/FunConnectOptions/FunConnectOptions.tsx
-import React213, { useCallback as useCallback38, useMemo as useMemo36, useState as useState54 } from "react";
+import React213, { useCallback as useCallback38, useMemo as useMemo33, useState as useState54 } from "react";
 
 // src/hooks/useAnimatedNavigation.ts
 import { useCallback as useCallback16, useState as useState17 } from "react";
@@ -11537,6 +11577,7 @@ async function evaluateAccountWalletFees({
   loginType,
   apiKey
 }) {
+  const relayQuote = baseQuote.metadata?.relayQuote;
   const nativeCurrencySymbol = FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO13[selectedSourceAssetInfo.chainId]?.nativeCurrency.symbol || "";
   const walletCheckoutFees = {
     paymentMethod: "balance" /* ACCOUNT_BALANCE */,
@@ -11545,7 +11586,8 @@ async function evaluateAccountWalletFees({
     eoaWalletFeeUsd: 0,
     totalFeesUsd: baseQuote.estFeesUsd,
     totalFeesTokenWithoutGas: Number(baseQuote.estFeesFromAmount),
-    nativeCurrencySymbol
+    nativeCurrencySymbol,
+    relayQuote
   };
   if (loginType !== "web3" /* Web3 */ || selectedSourceAssetInfo.chainId === zkSync.id.toString()) {
     return { fees: walletCheckoutFees };
@@ -13613,7 +13655,7 @@ function CheckoutHelp({
 }
 
 // src/modals/CheckoutModal/ConfirmationStep/ConfirmationStep.tsx
-import React132, { useEffect as useEffect25, useMemo as useMemo22, useState as useState32 } from "react";
+import React132, { useEffect as useEffect25, useMemo as useMemo21, useState as useState32 } from "react";
 import { createPortal as createPortal5 } from "react-dom";
 
 // src/providers/UserPresenceContext.tsx
@@ -13650,7 +13692,7 @@ var UserPresenceProvider = ({ children }) => {
 var useUserPresence = () => useContext16(UserPresenceContext);
 
 // src/modals/CheckoutModal/ConfirmationStep/ConfirmationStep.tsx
-import { DirectExecutionType as DirectExecutionType3 } from "@funkit/api-base";
+import { DirectExecutionType as DirectExecutionType2 } from "@funkit/api-base";
 import { FlagKey as FlagKey17 } from "@funkit/utils";
 
 // src/components/FunInfoBanner/FunInfoBanner.tsx
@@ -13945,7 +13987,7 @@ import {
 } from "@funkit/utils";
 import NumberFlow from "@number-flow/react";
 import { motion as motion3 } from "motion/react";
-import React122, { useMemo as useMemo17 } from "react";
+import React122, { useMemo as useMemo16 } from "react";
 
 // src/consts/design.ts
 var mapFontLineHeightToNumberFlowHeight = {
@@ -13955,23 +13997,15 @@ var mapFontLineHeightToNumberFlowHeight = {
 };
 
 // src/hooks/useReceiveAmountLabel.ts
-import { DirectExecutionType as DirectExecutionType2 } from "@funkit/api-base";
-import { useMemo as useMemo15 } from "react";
-function useReceiveAmountLabel({
-  directExecutionType,
-  isSameToken
-}) {
+function useReceiveAmountLabel(_) {
   const { textCustomizations } = useFunkitConfig();
-  return useMemo15(() => {
-    const showAtLeast = directExecutionType === DirectExecutionType2.RELAY && !isSameToken;
-    return `${textCustomizations.confirmationScreen.receiveAmountLabel}${showAtLeast ? " at least" : ""}`;
-  }, [textCustomizations, directExecutionType, isSameToken]);
+  return textCustomizations.confirmationScreen.receiveAmountLabel;
 }
 
 // src/components/FunAssetAvatar/FunAssetAvatar.tsx
 import { isNotNullish as isNotNullish7 } from "@funkit/utils";
 import clsx12 from "clsx";
-import React121, { useMemo as useMemo16 } from "react";
+import React121, { useMemo as useMemo15 } from "react";
 
 // src/components/FunAssetAvatar/FunAssetAvatar.css.ts
 var chainContainerStyle = "uwrdc22 _1rsrm2f18 _1rsrm2fa _1rsrm2f4 _1rsrm2f41";
@@ -13991,7 +14025,7 @@ function FunAssetAvatar({
   largeChainIcon = false
 }) {
   const chainMetadata = chainMetadataById[Number.parseInt((chainId || "").toString())] || null;
-  const finalAssetSrc = useMemo16(() => {
+  const finalAssetSrc = useMemo15(() => {
     const normalizedTicker = assetTicker?.toUpperCase() || "";
     const defaultSrc = ASSET_LOGO_SRCS[normalizedTicker];
     if (prioritizeDefaults) {
@@ -14089,13 +14123,13 @@ function PaymentAmountSummary({
     })
   });
   const sourceTokenAmount = quote?.finalPaymentTokenAmount ? Number.parseFloat(quote.finalPaymentTokenAmount) : void 0;
-  const paymentTokenUsdAmount = useMemo17(() => {
+  const paymentTokenUsdAmount = useMemo16(() => {
     if (!quote) return void 0;
     return formatCurrencyAndStringify3(
       quote.baseQuote.estSubtotalUsd + Number.parseFloat(quote.finalPaymentFeeUsd) - Number.parseFloat(quote.finalSpreadUsd)
     );
   }, [quote]);
-  const receiveTokenUsdAmount = useMemo17(() => {
+  const receiveTokenUsdAmount = useMemo16(() => {
     if (!quote) return void 0;
     return formatCurrencyAndStringify3(
       Number.parseFloat(quote.finalTotalUsd) - Number.parseFloat(quote.finalPaymentFeeUsd) - Number.parseFloat(quote.finalSpreadUsd)
@@ -14215,9 +14249,11 @@ function PaymentAmountSummaryItem({
 import {
   formatCurrencyAndStringify as formatCurrencyAndStringify4,
   formatDynamicFeeUsd,
+  formatPercent,
   noop as noop4
 } from "@funkit/utils";
-import React124, { useMemo as useMemo18, useState as useState23 } from "react";
+import React124, { useMemo as useMemo17, useState as useState23 } from "react";
+import { FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO14 } from "@funkit/chains";
 import clsx13 from "clsx";
 import { motion as motion4, useAnimationControls } from "motion/react";
 
@@ -14254,6 +14290,88 @@ var NO_DATA = {
   collapsed: null,
   expanded: []
 };
+function renderRelayFee(relayQuote) {
+  const { details, fees } = relayQuote;
+  const gasUsd = Number.parseFloat(fees?.gas?.amountUsd || "0");
+  const destinationChainId = details?.currencyOut?.currency?.chainId || "";
+  const chainName = FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO14[destinationChainId]?.name;
+  const totalImpactStr = (details?.totalImpact?.percent || "0").replace("-", "");
+  const totalImpact = Number.parseFloat(totalImpactStr);
+  const swapImpactStr = (details?.swapImpact?.percent || "0").replace("-", "");
+  const swapImpact = Number.parseFloat(swapImpactStr);
+  const relayGas = Number.parseFloat(fees?.relayer?.amountUsd || "0");
+  const totalUsd = Number.parseFloat(details?.currencyIn?.amountUsd || "0");
+  const appFeePercent = Number.parseFloat(fees?.app?.amountUsd || "0") / totalUsd * 100;
+  const maxSlippage = Number.parseFloat(
+    details?.slippageTolerance?.destination?.percent || "0"
+  );
+  return {
+    collapsed: {
+      value: formatCurrencyAndStringify4(gasUsd),
+      valueIcon: /* @__PURE__ */ React124.createElement(GasIcon, null)
+    },
+    expanded: [
+      // {
+      //   label: 'Rate',
+      //   value: `1.000 ${details?.currencyIn?.currency?.symbol} = ${ratePretty} ${details?.currencyOut?.currency?.symbol}`,
+      //   tooltipText:
+      //     'The conversion rate between ETH on Arbitrum and USDCe on Polygon.',
+      // },
+      {
+        label: "Network cost",
+        valueIcon: /* @__PURE__ */ React124.createElement(GasIcon, null),
+        value: formatCurrencyAndStringify4(gasUsd),
+        tooltipText: /* @__PURE__ */ React124.createElement(React124.Fragment, null, "Estimated gas cost for completing your transaction, including the network fee and routing gas fees. The final cost may vary based on network conditions.")
+      },
+      {
+        label: "Price impact",
+        value: formatPercent(totalImpact),
+        tooltipText: /* @__PURE__ */ React124.createElement(Box, { display: "flex", flexDirection: "column", gap: "4" }, /* @__PURE__ */ React124.createElement(Box, { display: "flex", flexDirection: "column", gap: "2" }, /* @__PURE__ */ React124.createElement(
+          Box,
+          {
+            alignItems: "center",
+            display: "flex",
+            justifyContent: "space-between"
+          },
+          /* @__PURE__ */ React124.createElement(Text, { size: "10", weight: "medium" }, "Total impact"),
+          /* @__PURE__ */ React124.createElement(Text, { size: "10", weight: "medium" }, formatPercent(totalImpact))
+        ), /* @__PURE__ */ React124.createElement(
+          Box,
+          {
+            alignItems: "center",
+            display: "flex",
+            justifyContent: "space-between"
+          },
+          /* @__PURE__ */ React124.createElement(Text, { size: "10" }, "Swap impact"),
+          /* @__PURE__ */ React124.createElement(Text, { size: "10", weight: "medium" }, formatPercent(swapImpact))
+        ), /* @__PURE__ */ React124.createElement(
+          Box,
+          {
+            alignItems: "center",
+            display: "flex",
+            justifyContent: "space-between"
+          },
+          /* @__PURE__ */ React124.createElement(Text, { size: "10" }, "Fill gas ", chainName ? `(${chainName})` : ""),
+          /* @__PURE__ */ React124.createElement(Text, { size: "10", weight: "medium" }, formatCurrencyAndStringify4(relayGas))
+        ), /* @__PURE__ */ React124.createElement(
+          Box,
+          {
+            alignItems: "center",
+            display: "flex",
+            justifyContent: "space-between"
+          },
+          /* @__PURE__ */ React124.createElement(Text, { size: "10" }, "Fun.xyz fee"),
+          /* @__PURE__ */ React124.createElement(Text, { size: "10", weight: "medium" }, formatPercent(appFeePercent))
+        )), /* @__PURE__ */ React124.createElement(FunDivider, null), /* @__PURE__ */ React124.createElement(Box, null, "Price impact is the difference between the expected and executed price.", /* @__PURE__ */ React124.createElement("br", null), /* @__PURE__ */ React124.createElement("br", null), "Final cost may vary based on network conditions."))
+      },
+      {
+        label: "Max slippage",
+        value: formatPercent(maxSlippage),
+        tooltipText: /* @__PURE__ */ React124.createElement(React124.Fragment, null, "Slippage occurs due to price changes during trade execution. Slippage limits are adjusted based on your asset to ensure a reliable, timely execution.", /* @__PURE__ */ React124.createElement("br", null), /* @__PURE__ */ React124.createElement("br", null), "The slippage is set as low as possible. If it is required to be higher than 1.50% during execution, Fun.xyz will cover the difference.")
+      }
+    ]
+  };
+}
 var extractFeeItems = (fees, totalUsd, isDydx) => {
   const marketMakerFee = {
     label: "Market maker gas costs",
@@ -14268,6 +14386,9 @@ var extractFeeItems = (fees, totalUsd, isDydx) => {
     }),
     tooltipText: "Charged to cover the costs of providing on-chain liquidity."
   };
+  if (fees.paymentMethod === "balance" /* ACCOUNT_BALANCE */ && fees.relayQuote) {
+    return renderRelayFee(fees.relayQuote);
+  }
   if (fees.paymentMethod === "balance" /* ACCOUNT_BALANCE */) {
     const { eoaWalletFeeUsd, marketMakerFeeUsd } = fees;
     const fillGasCost = formatDynamicFeeUsd(eoaWalletFeeUsd, totalUsd, {
@@ -14352,7 +14473,7 @@ function PaymentFeesSummary({
     }
   };
   const isDydx = isDydxCustomer(apiKey);
-  const { collapsed: collapsedItem, expanded: expandedItems } = useMemo18(() => {
+  const { collapsed: collapsedItem, expanded: expandedItems } = useMemo17(() => {
     if (!quote) return NO_DATA;
     const fees = quote.finalFeesBreakdown;
     const totalUsd = Number(quote.finalTotalUsd);
@@ -14570,7 +14691,7 @@ function CheckoutPrimaryInfo({
 }
 
 // src/modals/CheckoutModal/ConfirmationStep/DisclaimerText.tsx
-import React128, { useMemo as useMemo19 } from "react";
+import React128, { useMemo as useMemo18 } from "react";
 
 // src/utils/customer.ts
 function isKatanaEarnFlow({
@@ -14625,7 +14746,7 @@ var DisclaimerText = ({
   ), ", and the ", /* @__PURE__ */ React128.createElement(FunLinkButton, { href: "https://morpho.org/", inline: true, text: "terms" }), " applicable to third-party Morpho vaults", ".") : /* @__PURE__ */ React128.createElement(React128.Fragment, null, isVertex && vertexText ? `${vertexText} ` : showCardDisclaimer && `${cardDisclaimer} `, "By clicking on ", continueText, ", you agree to our", " ", /* @__PURE__ */ React128.createElement(FunLinkButton, { href: FUN_TERMS_URL, inline: true, text: "terms" }), ".");
 };
 function useCardDisclaimer(checkoutItem, finalConvertedAssetName) {
-  const cardDisclaimer = useMemo19(() => {
+  const cardDisclaimer = useMemo18(() => {
     if (!checkoutItem || !finalConvertedAssetName) {
       return null;
     }
@@ -14707,10 +14828,10 @@ function useAutoClearState(initialValue = null) {
 
 // src/hooks/useIsBlacklisted.ts
 import { FlagKey as FlagKey15 } from "@funkit/utils";
-import { useMemo as useMemo20 } from "react";
+import { useMemo as useMemo19 } from "react";
 var useIsBlacklisted = (walletAddress, customRecipient) => {
   const flagStr = useFlag(FlagKey15.AddressBlacklist);
-  const blacklist = useMemo20(
+  const blacklist = useMemo19(
     () => safeJSONParse(flagStr)?.map((addr) => addr.toLowerCase()) || [],
     [flagStr]
   );
@@ -15530,7 +15651,7 @@ function usePostCheckout({
 }
 
 // src/modals/CheckoutModal/ConfirmationStep/useQuoteRefresh.ts
-import { useCallback as useCallback25, useEffect as useEffect24, useMemo as useMemo21, useRef as useRef10, useState as useState31 } from "react";
+import { useCallback as useCallback25, useEffect as useEffect24, useMemo as useMemo20, useRef as useRef10, useState as useState31 } from "react";
 
 // src/hooks/useCountdown.tsx
 import React131 from "react";
@@ -15799,7 +15920,7 @@ function useQuoteRefresh({
     },
     [isOnHold, restartCountdown, setCheckoutQuote, triggerAssetConfirm]
   );
-  const quoteError = useMemo21(() => {
+  const quoteError = useMemo20(() => {
     if (quoteErrorMessage && !isQuoting) {
       return {
         message: quoteErrorMessage,
@@ -15932,10 +16053,10 @@ function ConfirmationStep({
     // Block updates to the current quote during confirmation, post-checkout, and if its a direct execution
     useQuoteRefresh({
       isOnHold: isInitialQuoting || isContinuing || isAway,
-      refreshIntervalSeconds: directExecutionType === DirectExecutionType3.RELAY ? RELAY_ESTIMATE_REFRESH_INTERVAL_SEC : DEFAULT_ESTIMATE_REFRESH_INTERVAL_SEC
+      refreshIntervalSeconds: directExecutionType === DirectExecutionType2.RELAY ? RELAY_ESTIMATE_REFRESH_INTERVAL_SEC : DEFAULT_ESTIMATE_REFRESH_INTERVAL_SEC
     })
   );
-  const error = useMemo22(() => {
+  const error = useMemo21(() => {
     if (!isInitialQuoting && moonpayAmountCheck?.isInvalid) {
       return {
         message: moonpayAmountCheck.message,
@@ -15950,7 +16071,7 @@ function ConfirmationStep({
     quoteError,
     isInitialQuoting
   ]);
-  const stepMessage = useMemo22(() => {
+  const stepMessage = useMemo21(() => {
     if (initialQuoteStep) return initialQuoteStep;
     if (postCheckoutStepMessage) return postCheckoutStepMessage;
     if (confirmationStepMessage) return confirmationStepMessage;
@@ -16367,7 +16488,7 @@ var useMeldDefaultCurrency = (paymentMethod) => {
   const { userIpInfo } = useFunkitUserIp();
   const enableMeld = useFlag(FlagKey18.EnableMeldPayment);
   const query = useQuery12({
-    queryKey: ["meld", "defaultCurrency"],
+    queryKey: ["meld", "defaultCurrency", paymentMethod],
     queryFn: async () => {
       if (!apiKey) return "";
       const response = await getMeldDefaultFiat({
@@ -16386,15 +16507,101 @@ var useMeldDefaultCurrency = (paymentMethod) => {
   return query;
 };
 
+// src/hooks/queries/useMeldLimits.ts
+import { getMeldFiatLimits } from "@funkit/api-base";
+import { formatCurrencyAndStringify as formatCurrencyAndStringify5 } from "@funkit/utils";
+import { useQuery as useQuery13 } from "@tanstack/react-query";
+
+// src/hooks/queries/useMeldCryptoCurrencyCode.ts
+function useMeldCryptoCurrencyCode() {
+  const { checkoutItem } = useCheckoutContext();
+  const _targetChain = checkoutItem?.initSettings.config.targetChain;
+  const _targetAsset = checkoutItem?.initSettings.config.targetAsset;
+  return "USDC_POLYGON";
+}
+
+// src/hooks/queries/useMeldLimits.ts
+var useMeldLimits = (isEnabled = true) => {
+  const { apiKey } = useFunkitConfig();
+  const { userIpInfo } = useFunkitUserIp();
+  const cryptoCurrency = useMeldCryptoCurrencyCode();
+  const countryCode = userIpInfo?.alpha2;
+  const query = useQuery13({
+    queryKey: ["meld", "limits", countryCode, cryptoCurrency],
+    queryFn: async () => {
+      if (!apiKey || !countryCode) return void 0;
+      const response = await getMeldFiatLimits({
+        params: {
+          countries: [countryCode],
+          cryptoCurrencies: cryptoCurrency ? [cryptoCurrency] : [],
+          // left out intentionally to preload other currency limits
+          fiatCurrencies: []
+        },
+        apiKey
+      });
+      return response?.limits;
+    },
+    enabled: isEnabled && !!apiKey && !!countryCode && !!cryptoCurrency,
+    refetchOnMount: false,
+    refetchOnReconnect: false,
+    refetchOnWindowFocus: false,
+    staleTime: 1e3 * 60 * 60
+    // 1 hour
+  });
+  return query;
+};
+var useMeldLimit = (fiatCurrency) => {
+  const query = useMeldLimits();
+  return {
+    ...query,
+    data: query.data?.find((limit) => limit.currencyCode === fiatCurrency)
+  };
+};
+var useMeldLimitError = (amount, fiatCurrency) => {
+  const { data: meldLimit } = useMeldLimit(fiatCurrency);
+  if (!meldLimit) return void 0;
+  if (amount < meldLimit.minimumAmount) {
+    const limit = formatCurrencyAndStringify5(
+      meldLimit.minimumAmount ?? 0,
+      {},
+      {
+        currency: fiatCurrency,
+        currencyDisplay: "narrowSymbol",
+        minimumFractionDigits: 0
+      }
+    );
+    return {
+      issue: "Amount below minimum",
+      suggestion: `Input an amount greater than ${limit}.`
+    };
+  }
+  if (amount > meldLimit.maximumAmount) {
+    const limit = formatCurrencyAndStringify5(
+      meldLimit.maximumAmount ?? 0,
+      {},
+      {
+        currency: fiatCurrency,
+        currencyDisplay: "narrowSymbol",
+        minimumFractionDigits: 0
+      }
+    );
+    return {
+      issue: "Amount above maximum",
+      suggestion: `Input an amount lower than ${limit}.`
+    };
+  }
+  return void 0;
+};
+
 // src/modals/CheckoutModal/InputAmount/InputAmountLoaded.tsx
 import {
-  FlagKey as FlagKey20,
+  FlagKey as FlagKey21,
   formatCryptoAndStringify as formatCryptoAndStringify4,
   formatCurrencyAndStringify as formatCurrencyAndStringify9,
   isTokenEquivalent as isTokenEquivalent6,
   round as round3
 } from "@funkit/utils";
-import React150, { useMemo as useMemo25 } from "react";
+import React150, { useMemo as useMemo22 } from "react";
 
 // src/components/CurrencySelector/CurrencySelector.tsx
 import React139 from "react";
@@ -16471,7 +16678,7 @@ import React142 from "react";
 // src/components/MeldQuoteItem/MeldQuoteItem.tsx
 import {
   formatCryptoAndStringify as formatCryptoAndStringify2,
-  formatCurrencyAndStringify as formatCurrencyAndStringify5
+  formatCurrencyAndStringify as formatCurrencyAndStringify6
 } from "@funkit/utils";
 import React141 from "react";
 
@@ -16541,7 +16748,7 @@ var MeldQuoteItem = ({
       }
     }
   );
-  const fiatAmount = formatCurrencyAndStringify5(
+  const fiatAmount = formatCurrencyAndStringify6(
     quote.sourceAmount,
     {},
     { currency: quote.sourceCurrencyCode }
@@ -16560,8 +16767,8 @@ var MeldQuoteItem = ({
     /* @__PURE__ */ React141.createElement(Box, { display: "flex", alignItems: "center", gap: "8" }, /* @__PURE__ */ React141.createElement(Box, { justifyContent: "center", display: "flex", alignItems: "center" }, /* @__PURE__ */ React141.createElement(
       AsyncImage,
       {
-        width: "20",
-        height: "20",
+        width: "28",
+        height: "28",
         src: getMeldProviderIconUrl(quote.serviceProvider),
         fallbackSrc: FALLBACK_ASSET,
         alt: quote.serviceProvider,
@@ -16647,6 +16854,7 @@ var MeldProviderLabel = ({
 };
 
 // src/components/SourcePaymentMethodItem/SourcePaymentMethodItem.tsx
+import { FlagKey as FlagKey19 } from "@funkit/utils";
 import clsx14 from "clsx";
 import { useAnimate } from "motion/react";
 import React144 from "react";
@@ -17225,6 +17433,40 @@ var SourcePaymentMethodItem = ({
     );
   };
   const backdropColor = themeVars.colors.offBackground;
+  const icons = [
+    {
+      paymentMethod: "balance" /* ACCOUNT_BALANCE */,
+      icon: /* @__PURE__ */ React144.createElement(MetamaskPillIcon, { key: "metamask", backdropColor })
+    },
+    {
+      paymentMethod: "brokerage" /* BROKERAGE */,
+      icon: /* @__PURE__ */ React144.createElement(BinancePillIcon, { key: "binance", backdropColor })
+    },
+    {
+      paymentMethod: "card" /* CARD */,
+      icon: /* @__PURE__ */ React144.createElement(VisaPillIcon, { key: "visa", backdropColor })
+    },
+    {
+      paymentMethod: "brokerage" /* BROKERAGE */,
+      icon: /* @__PURE__ */ React144.createElement(CoinbasePillIcon, { key: "coinbase", backdropColor })
+    },
+    {
+      paymentMethod: "balance" /* ACCOUNT_BALANCE */,
+      icon: /* @__PURE__ */ React144.createElement(RainbowPillIcon, { key: "rainbow", backdropColor })
+    },
+    {
+      paymentMethod: "card" /* CARD */,
+      icon: /* @__PURE__ */ React144.createElement(MasterCardPillIcon, { key: "mastercard", backdropColor })
+    }
+  ];
+  const isCardEnabled = useFlag(FlagKey19.EnableCard);
+  const isBrokerageEnabled = useFlag(FlagKey19.EnableBrokerage);
+  const usableAlternativeIcons = icons.filter(({ paymentMethod }) => {
+    if (paymentMethod === type || paymentMethod === "card" /* CARD */ && !isCardEnabled || paymentMethod === "brokerage" /* BROKERAGE */ && !isBrokerageEnabled) {
+      return false;
+    }
+    return true;
+  });
   return /* @__PURE__ */ React144.createElement(
     Box,
     {
@@ -17279,7 +17521,7 @@ var SourcePaymentMethodItem = ({
             className: "framer-spmi-animated-logos",
             color: "primaryText"
           },
-          type === "balance" /* ACCOUNT_BALANCE */ ? /* @__PURE__ */ React144.createElement(React144.Fragment, null, /* @__PURE__ */ React144.createElement(CoinbasePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(BinancePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(VisaPillIcon, { backdropColor })) : type === "brokerage" /* BROKERAGE */ ? /* @__PURE__ */ React144.createElement(React144.Fragment, null, /* @__PURE__ */ React144.createElement(MetamaskPillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(RainbowPillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(VisaPillIcon, { backdropColor })) : type === "virtual_bank" /* VIRTUAL_BANK */ ? /* @__PURE__ */ React144.createElement(React144.Fragment, null, /* @__PURE__ */ React144.createElement(CoinbasePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(BinancePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(MetamaskPillIcon, { backdropColor })) : /* @__PURE__ */ React144.createElement(React144.Fragment, null, /* @__PURE__ */ React144.createElement(BinancePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(CoinbasePillIcon, { backdropColor }), /* @__PURE__ */ React144.createElement(MasterCardPillIcon, { backdropColor }))
+          usableAlternativeIcons.slice(0, 3).map(({ icon }) => icon)
         )
       ), /* @__PURE__ */ React144.createElement(ArrowIcon, { direction: "right", size: 20 }))
     )
@@ -17407,90 +17649,6 @@ var YouPayYouReceiveBottomBarLayoutWrapper = ({
   );
 };
 
-// src/hooks/queries/useMeldLimits.ts
-import { getMeldFiatLimits } from "@funkit/api-base";
-import { formatCurrencyAndStringify as formatCurrencyAndStringify6 } from "@funkit/utils";
-import { useQuery as useQuery13 } from "@tanstack/react-query";
-import { useMemo as useMemo23 } from "react";
-
-// src/hooks/queries/useMeldCryptoCurrencyCode.ts
-function useMeldCryptoCurrencyCode() {
-  const { checkoutItem } = useCheckoutContext();
-  const _targetChain = checkoutItem?.initSettings.config.targetChain;
-  const _targetAsset = checkoutItem?.initSettings.config.targetAsset;
-  return "USDC_POLYGON";
-}
-
-// src/hooks/queries/useMeldLimits.ts
-var useMeldLimits = (fiatCurrency) => {
-  const { apiKey } = useFunkitConfig();
-  const { userIpInfo } = useFunkitUserIp();
-  const cryptoCurrency = useMeldCryptoCurrencyCode();
-  const query = useQuery13({
-    queryKey: ["meld", "limits", userIpInfo?.alpha2, cryptoCurrency],
-    queryFn: async () => {
-      if (!apiKey || !userIpInfo) return void 0;
-      const { alpha2: countryCode } = userIpInfo;
-      const response = await getMeldFiatLimits({
-        params: {
-          countries: [countryCode],
-          cryptoCurrencies: cryptoCurrency ? [cryptoCurrency] : [],
-          // left out intentionally to preload other currency limits
-          fiatCurrencies: []
-        },
-        apiKey
-      });
-      return response?.limits;
-    },
-    enabled: !!apiKey && !!userIpInfo && !!fiatCurrency && !!cryptoCurrency,
-    refetchOnMount: false,
-    refetchOnReconnect: false,
-    refetchOnWindowFocus: false,
-    staleTime: 1e3 * 60 * 60
-    // 1 hour
-  });
-  return query;
-};
-var useMeldLimitError = (amount, fiatCurrency) => {
-  const { data } = useMeldLimits(fiatCurrency);
-  const meldLimit = useMemo23(
-    () => data?.find((lim) => lim.currencyCode === fiatCurrency),
-    [data, fiatCurrency]
-  );
-  if (!meldLimit) return void 0;
-  if (amount < meldLimit.minimumAmount) {
-    const limit = formatCurrencyAndStringify6(
-      meldLimit.minimumAmount ?? 0,
-      {},
-      {
-        currency: fiatCurrency,
-        currencyDisplay: "narrowSymbol",
-        minimumFractionDigits: 0
-      }
-    );
-    return {
-      issue: "Amount below minimum",
-      suggestion: `Input an amount greater than ${limit}.`
-    };
-  }
-  if (amount > meldLimit.maximumAmount) {
-    const limit = formatCurrencyAndStringify6(
-      meldLimit.maximumAmount ?? 0,
-      {},
-      {
-        currency: fiatCurrency,
-        currencyDisplay: "narrowSymbol",
-        minimumFractionDigits: 0
-      }
-    );
-    return {
-      issue: "Amount above maximum",
-      suggestion: `Input an amount lower than ${limit}.`
-    };
-  }
-  return void 0;
-};
-
 // src/components/Icons/SwitchIcon.tsx
 import React147 from "react";
 var SwitchIcon = () => {
@@ -17742,36 +17900,23 @@ function InputAmountLayout({
 }
 
 // src/modals/CheckoutModal/InputAmount/QuickOptions.tsx
-import { FlagKey as FlagKey19, clamp, formatCurrencyAndStringify as formatCurrencyAndStringify7 } from "@funkit/utils";
-import React149, { useMemo as useMemo24 } from "react";
+import { FlagKey as FlagKey20, clamp, formatCurrencyAndStringify as formatCurrencyAndStringify7 } from "@funkit/utils";
+import React149 from "react";
 var USD_AMOUNT_OPTIONS_PCT = [25, 50, 75, 100];
-var USD_AMOUNT_OPTIONS = [100, 500, 1e3];
 function deduplicateArray(arr) {
   return Array.from(new Set(arr));
 }
-function useFiatAmountOptions(percentMode, currency) {
-  const currencyQuickOptionStr = useFlag(FlagKey19.MeldQuickOptions);
+function useFiatAmountOptions(currency) {
+  const currencyQuickOptionStr = useFlag(FlagKey20.MeldQuickOptions);
   const currencyQuickOption = safeJSONParse(
     currencyQuickOptionStr
   );
-  const { data: limits, isPending } = useMeldLimits(currency);
-  const meldLimit = useMemo24(
-    () => limits?.find((lim) => lim.currencyCode === currency),
-    [limits, currency]
-  );
-  if (percentMode) {
-    return USD_AMOUNT_OPTIONS_PCT;
-  }
+  const { data: meldLimit, isPending } = useMeldLimit(currency);
   if (isPending || !meldLimit) {
     return [];
   }
   const minimumAmount = meldLimit.minimumAmount;
   const maximumAmount = meldLimit.maximumAmount;
-  if (currency === "USD") {
-    return deduplicateArray(
-      USD_AMOUNT_OPTIONS.map((val) => clamp(val, minimumAmount, maximumAmount))
-    );
-  }
   return deduplicateArray(
     currencyQuickOption?.[currency]?.map(
       (val) => clamp(val, minimumAmount, maximumAmount)
@@ -17779,42 +17924,44 @@ function useFiatAmountOptions(percentMode, currency) {
   );
 }
 var QuickOptions = ({
-  onSelect,
-  percentMode = true,
+  currency = "USD",
   disabled = false,
-  currency = "USD"
+  onSelect,
+  options,
+  percentMode = true
 }) => {
-  const currencyAmountOptions = useFiatAmountOptions(percentMode, currency);
-  return currencyAmountOptions.map((option, index) => /* @__PURE__ */ React149.createElement(
-    FunIconButton,
-    {
-      borderRadius: "actionButton",
-      fontSize: "14",
-      fontWeight: "medium",
-      color: "primaryText",
-      icon: null,
-      isDisabled: disabled,
-      key: `${option}-${index}`,
-      onClick: () => onSelect?.(option),
-      paddingX: "12",
-      size: "36",
-      variant: "filled",
-      colorOverrides: {
-        baseBackground: "inputAmountQuickOptionBaseBackground",
-        hoverBackground: "inputAmountQuickOptionHoverBackground",
-        activeBackground: "inputAmountQuickOptionActiveBackground"
-      }
-    },
-    !percentMode ? formatCurrencyAndStringify7(
-      option,
-      {},
+  return (percentMode ? USD_AMOUNT_OPTIONS_PCT : options)?.map(
+    (option, index) => /* @__PURE__ */ React149.createElement(
+      FunIconButton,
       {
-        minimumFractionDigits: 0,
-        currency,
-        currencyDisplay: "narrowSymbol"
-      }
-    ) : option === 100 ? "Max" : `${option}%`
-  ));
+        borderRadius: "actionButton",
+        fontSize: "14",
+        fontWeight: "medium",
+        color: "primaryText",
+        icon: null,
+        isDisabled: disabled,
+        key: `${option}-${index}`,
+        onClick: () => onSelect?.(option),
+        paddingX: "12",
+        size: "36",
+        variant: "filled",
+        colorOverrides: {
+          baseBackground: "inputAmountQuickOptionBaseBackground",
+          hoverBackground: "inputAmountQuickOptionHoverBackground",
+          activeBackground: "inputAmountQuickOptionActiveBackground"
+        }
+      },
+      !percentMode ? formatCurrencyAndStringify7(
+        option,
+        {},
+        {
+          minimumFractionDigits: 0,
+          currency,
+          currencyDisplay: "narrowSymbol"
+        }
+      ) : option === 100 ? "Max" : `${option}%`
+    )
+  );
 };
 
 // src/modals/CheckoutModal/InputAmount/useAmountInput.ts
@@ -17827,12 +17974,12 @@ import {
 // src/modals/CheckoutModal/InputAmount/state.ts
 import { round as round2 } from "@funkit/utils";
 function getInputValueFromAmount(params) {
-  const amount = params.isInputInUsd ? params.usdAmount : params.assetAmount;
+  const amount = params.isInputInFiat ? params.fiatAmount : params.assetAmount;
   if (!amount) return "";
   const formattedAmount = amount.toFixed(
-    params.isInputInUsd ? USD_DECIMALS : ASSET_DECIMALS
+    params.isInputInFiat ? USD_DECIMALS : ASSET_DECIMALS
   );
-  return params.isInputInUsd ? params.currencySymbol + formattedAmount : formattedAmount;
+  return params.isInputInFiat ? params.currencySymbol + formattedAmount : formattedAmount;
 }
 function initializeState({
   apiKey,
@@ -17843,10 +17990,12 @@ function initializeState({
   sourceHolding,
   unitPrice,
   defaultAmount,
-  fiatCurrency = "USD"
+  fiatCurrency = "USD",
+  quickOptions
 }) {
   const { targetAssetAmount, targetChain } = checkoutConfig;
-  const isInputInUsd = true;
+  const isCardCheckout = paymentMethod === "card" /* CARD */;
+  const isInputInFiat = true;
   const usdAvailableAmount = getUsdAvailableAmount(
     targetChain,
     sourceHolding?.pickedChainId,
@@ -17862,26 +18011,27 @@ function initializeState({
   );
   const usdMaxAmount = getUsdMaxAmount(maxUsd);
   const usdMinAmount = getUsdMinAmount(paymentMethod, minUsd);
-  const usdInitialAmount = defaultAmount ?? (targetAssetAmount === void 0 ? USD_INITIAL_AMOUNT : targetAssetAmount * unitPrice);
-  const usdFinalAmount = Math.min(
-    Math.max(usdInitialAmount, usdMinAmount, 0),
+  const initialFiatAmount = defaultAmount ?? (isCardCheckout ? getDefaultAmountFromQuickOptions(quickOptions) : targetAssetAmount === void 0 ? USD_INITIAL_AMOUNT : targetAssetAmount * unitPrice);
+  const finalFiatAmount = initialFiatAmount === void 0 ? void 0 : Math.min(
+    Math.max(initialFiatAmount, usdMinAmount, 0),
     usdAvailableAmount ?? Number.MAX_VALUE,
     usdMaxAmount ?? Number.MAX_VALUE
   );
-  const rounding = usdFinalAmount === usdInitialAmount ? "round" : usdFinalAmount === usdMinAmount ? "ceil" : "floor";
-  const assetAmount = targetAssetAmount !== void 0 && usdFinalAmount === usdInitialAmount ? targetAssetAmount : usdFinalAmount / unitPrice || 0;
-  const usdAmount = round2(usdFinalAmount, USD_DECIMALS, rounding);
+  const rounding = finalFiatAmount === initialFiatAmount ? "round" : finalFiatAmount === usdMinAmount ? "ceil" : "floor";
+  const assetAmount = finalFiatAmount ? targetAssetAmount && finalFiatAmount === targetAssetAmount * unitPrice ? targetAssetAmount : finalFiatAmount / unitPrice || 0 : 0;
+  const fiatAmount = finalFiatAmount ? round2(finalFiatAmount, USD_DECIMALS, rounding) : 0;
   const inputValue = getInputValueFromAmount({
     assetAmount,
-    isInputInUsd,
-    usdAmount,
-    currencySymbol: getCurrencySymbol(fiatCurrency)
+    currencySymbol: getCurrencySymbol(fiatCurrency),
+    isInputInFiat,
+    fiatAmount
   });
   return {
     assetAmount,
+    fiatAmount,
+    fiatCurrency,
     inputValue,
-    isInputInUsd,
-    usdAmount,
+    isInputInFiat,
     usdAvailableAmount,
     usdMaxAmount,
     usdMinAmount
@@ -17889,10 +18039,10 @@ function initializeState({
 }
 function reduceState(state, action) {
   switch (action.type) {
-    case "toggleInputInUsd": {
+    case "toggleInputInFiat": {
       const newState = {
         ...state,
-        isInputInUsd: !state.isInputInUsd
+        isInputInFiat: !state.isInputInFiat
       };
       const inputValue = getInputValueFromAmount({
         ...newState,
@@ -17901,83 +18051,84 @@ function reduceState(state, action) {
       return { ...newState, inputValue };
     }
     case "setInputValue": {
-      const { inputValue: rawInputValue, unitPrice, fiatCurrency } = action;
-      const currencySymbol = getCurrencySymbol(fiatCurrency);
-      const regex = state.isInputInUsd ? /\d+(\.\d{0,2})?/ : /\d+(\.\d{0,5})?/;
+      const { inputValue: rawInputValue, unitPrice } = action;
+      const currencySymbol = getCurrencySymbol(state.fiatCurrency);
+      const regex = state.isInputInFiat ? /\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;
+      const newInputValue = numericInputValue && state.isInputInFiat ? `${currencySymbol}${numericInputValue}` : numericInputValue;
       if (newInputValue === state.inputValue) return state;
       const newInputAmount = Number.parseFloat(numericInputValue) || 0;
-      if (state.isInputInUsd) {
+      if (state.isInputInFiat) {
         return {
           ...state,
           assetAmount: newInputAmount / unitPrice || 0,
           inputValue: newInputValue,
-          usdAmount: newInputAmount
+          fiatAmount: newInputAmount
         };
       }
       return {
         ...state,
         assetAmount: newInputAmount,
         inputValue: newInputValue,
-        usdAmount: round2(newInputAmount * unitPrice, USD_DECIMALS)
+        fiatAmount: round2(newInputAmount * unitPrice, USD_DECIMALS)
       };
     }
-    case "changeFiatCurrency": {
+    case "setFiatCurrency": {
       const inputValue = getInputValueFromAmount({
         ...state,
         currencySymbol: getCurrencySymbol(action.fiatCurrency)
       });
       return {
         ...state,
+        fiatCurrency: action.fiatCurrency,
         inputValue
       };
     }
-    case "setUsdAmount": {
-      const { unitPrice, usdAmount, fiatCurrency } = action;
-      const assetAmount = usdAmount / unitPrice || 0;
+    case "setFiatAmount": {
+      const { unitPrice, fiatAmount } = action;
+      const assetAmount = fiatAmount / unitPrice || 0;
       const inputValue = getInputValueFromAmount({
-        isInputInUsd: state.isInputInUsd,
         assetAmount,
-        usdAmount,
-        currencySymbol: getCurrencySymbol(fiatCurrency)
+        currencySymbol: getCurrencySymbol(state.fiatCurrency),
+        fiatAmount,
+        isInputInFiat: state.isInputInFiat
       });
       return {
         ...state,
         assetAmount,
-        usdAmount,
+        fiatAmount,
         inputValue
       };
     }
   }
 }
 function getAmountInputError(state) {
-  const { usdAmount, usdAvailableAmount, usdMaxAmount, usdMinAmount } = state;
+  const { fiatAmount, usdAvailableAmount, usdMaxAmount, usdMinAmount } = state;
   if (usdAvailableAmount === 0) {
     return {
       type: "noAvailableBalance"
     };
   }
-  if (usdAvailableAmount && usdAmount > usdAvailableAmount) {
+  if (usdAvailableAmount && fiatAmount > usdAvailableAmount) {
     return {
       type: "aboveAvailable",
       usdAvailableAmount
     };
   }
-  if (usdMaxAmount && usdAmount > usdMaxAmount) {
+  if (usdMaxAmount && fiatAmount > usdMaxAmount) {
     return {
       type: "aboveMax",
       usdMaxAmount
     };
   }
-  if (usdMinAmount && usdAmount < usdMinAmount) {
+  if (usdMinAmount && fiatAmount < usdMinAmount) {
     return {
       type: "belowMin",
       usdMinAmount
     };
   }
-  if (usdAmount === 0) {
+  if (fiatAmount === 0) {
     return {
       type: "noInput"
     };
@@ -17995,10 +18146,12 @@ function getDerivedState(state) {
 // src/modals/CheckoutModal/InputAmount/useAmountInput.ts
 function useAmountInput(options) {
   const [state, dispatch] = useReducer3(reduceState, options, initializeState);
+  const isCardCheckout = options.paymentMethod === "card" /* CARD */;
   const {
     unitPrice: realUnitPrice,
     checkoutConfig,
-    fiatCurrency = "USD"
+    fiatCurrency = "USD",
+    quickOptions
   } = options;
   const unitPrice = isStablecoin(checkoutConfig.targetAssetTicker) ? 1 : realUnitPrice;
   const dispatchAndGetNewState = useCallback28(
@@ -18013,41 +18166,60 @@ function useAmountInput(options) {
       dispatch({
         type: "setInputValue",
         inputValue: event.target.value,
-        unitPrice,
-        fiatCurrency
+        unitPrice
       });
     },
-    [unitPrice, fiatCurrency]
-  );
-  useEffect27(
-    () => dispatch({ type: "changeFiatCurrency", fiatCurrency }),
-    [fiatCurrency]
+    [unitPrice]
   );
-  const setUsdAmount = useCallback28(
-    (usdAmount) => dispatchAndGetNewState({
-      type: "setUsdAmount",
-      unitPrice,
-      fiatCurrency,
-      usdAmount
+  const defaultAmount = isCardCheckout ? getDefaultAmountFromQuickOptions(quickOptions) : void 0;
+  useEffect27(() => {
+    if (state.fiatCurrency !== fiatCurrency) {
+      dispatch({
+        type: "setFiatCurrency",
+        fiatCurrency
+      });
+      if (state.isInputInFiat) {
+        dispatch({
+          type: "setFiatAmount",
+          fiatAmount: defaultAmount ?? 0,
+          unitPrice
+        });
+      }
+    }
+  }, [fiatCurrency]);
+  useEffect27(() => {
+    if (defaultAmount && state.inputValue === "") {
+      dispatch({
+        type: "setFiatAmount",
+        fiatAmount: defaultAmount,
+        unitPrice
+      });
+    }
+  }, [defaultAmount]);
+  const setFiatAmount = useCallback28(
+    (fiatAmount) => dispatchAndGetNewState({
+      type: "setFiatAmount",
+      fiatAmount,
+      unitPrice
     }),
-    [dispatchAndGetNewState, unitPrice, fiatCurrency]
+    [dispatchAndGetNewState, unitPrice]
   );
   const derivedState = getDerivedState(state);
-  const toggleInputInUsd = useCallback28(
-    () => dispatch({ type: "toggleInputInUsd" }),
+  const toggleInputInFiat = useCallback28(
+    () => dispatch({ type: "toggleInputInFiat" }),
     []
   );
   return {
     ...derivedState,
     onChange,
-    toggleInputInUsd,
-    setUsdAmount,
-    placeholder: state.isInputInUsd ? formatCurrencyAndStringify8(
+    placeholder: state.isInputInFiat ? formatCurrencyAndStringify8(
       0,
       {},
       { currency: fiatCurrency, currencyDisplay: "narrowSymbol" }
     ) : formatCryptoAndStringify3(0),
-    suggestion: getInputAmountSuggestion(derivedState.inputError)
+    setFiatAmount,
+    suggestion: getInputAmountSuggestion(derivedState.inputError),
+    toggleInputInFiat
   };
 }
 
@@ -18080,29 +18252,30 @@ function InputAmountLoaded({
   onNext,
   sourceHolding,
   unitPrice,
-  defaultFiatCurrency,
+  defaultFiatCurrency = "USD",
   textCustomizations
 }) {
-  const maxCheckoutUsdString = useFlag(FlagKey20.MaxCheckoutUsd);
+  const maxCheckoutUsdString = useFlag(FlagKey21.MaxCheckoutUsd);
   const { apiKey } = useFunkitConfig();
   const { paymentMethod } = modalState.paymentMethodInfo;
   const { quote: manuallySelectedQuote } = modalState;
   const isCardCheckout = paymentMethod === "card" /* CARD */;
-  const meldEnabled = useFlag(FlagKey20.EnableMeldPayment) && isCardCheckout;
+  const meldEnabled = useFlag(FlagKey21.EnableMeldPayment) && isCardCheckout;
   const { targetAssetTicker, targetAssetMinAmount } = checkoutConfig;
   const { updateTargetAssetAmount } = useCheckoutContext();
   const minUsd = targetAssetMinAmount && unitPrice ? Math.ceil(targetAssetMinAmount * unitPrice * 100) / 100 : void 0;
   const fiatCurrency = modalState.fiatCurrency ?? defaultFiatCurrency;
+  const quickOptions = useFiatAmountOptions(fiatCurrency);
   const {
     assetAmount,
     inputError,
     inputValue,
-    isInputInUsd,
+    isInputInFiat,
     isValid,
     onChange,
-    toggleInputInUsd,
-    setUsdAmount,
-    usdAmount,
+    toggleInputInFiat,
+    setFiatAmount,
+    fiatAmount,
     usdAvailableAmount,
     placeholder,
     suggestion
@@ -18115,6 +18288,7 @@ function InputAmountLoaded({
     unitPrice,
     maxUsd: Number.parseFloat(maxCheckoutUsdString),
     minUsd,
+    quickOptions,
     fiatCurrency
   });
   const {
@@ -18125,8 +18299,8 @@ function InputAmountLoaded({
     bestRateQuote,
     selectedQuote,
     isSelectedQuoteUnavailable
-  } = useMeld(manuallySelectedQuote, usdAmount, fiatCurrency);
-  const error = useMemo25(() => {
+  } = useMeld(manuallySelectedQuote, fiatAmount, fiatCurrency);
+  const error = useMemo22(() => {
     if (isCardCheckout) {
       if (isSelectedQuoteUnavailable) {
         return {
@@ -18164,7 +18338,7 @@ function InputAmountLoaded({
   ]);
   const { ref, fontSize, resetText } = useDynamicFont(inputValue || placeholder);
   const handleIsAmountInAbsoluteToggle = () => {
-    toggleInputInUsd();
+    toggleInputInFiat();
     resetText();
   };
   const handleContinue = async (assetAmount2) => {
@@ -18177,7 +18351,7 @@ function InputAmountLoaded({
   };
   const handleSubmit = () => {
     if (!suggestion) return handleContinue(assetAmount);
-    const newState = setUsdAmount(suggestion.usdAmount);
+    const newState = setFiatAmount(suggestion.usdAmount);
     if (suggestion.autoConfirm && newState.isValid) {
       handleContinue(newState.assetAmount);
     }
@@ -18188,10 +18362,10 @@ function InputAmountLoaded({
     handleSubmit();
   };
   const displayAssetAmount = round3(
-    isStablecoin(targetAssetTicker) ? usdAmount : assetAmount,
+    isStablecoin(targetAssetTicker) ? fiatAmount : assetAmount,
     ASSET_DECIMALS
   );
-  const isConvertedAmountShown = targetAssetTicker && (!isInputInUsd || isCardCheckout && fiatCurrency === "USD" || !isCardCheckout);
+  const isConvertedAmountShown = targetAssetTicker && (!isInputInFiat || isCardCheckout && fiatCurrency === "USD" || !isCardCheckout);
   const isMeldContinueDisabled = meldEnabled && (!!meldLimitError || isMeldLinkPending || !!meldQuotesQuery.error || meldQuotesQuery.isFetching || isSelectedQuoteUnavailable);
   return /* @__PURE__ */ React150.createElement(
     InputAmountLayout,
@@ -18207,7 +18381,7 @@ function InputAmountLoaded({
         {
           selectedCurrency: fiatCurrency,
           onClick: (fiatCurrency2) => onNext({
-            fiatAmount: usdAmount,
+            fiatAmount,
             fiatCurrency: fiatCurrency2,
             nextStep: "meld_currency_select" /* MELD_CURRENCY_SELECT */
           })
@@ -18221,8 +18395,7 @@ function InputAmountLoaded({
           keyIcon: /* @__PURE__ */ React150.createElement(CreditCardIcon, { size: 16 }),
           onClick: () => onNext({
             nextStep: "source_change" /* SOURCE_CHANGE */,
-            fiatAmount: usdAmount,
-            navigateToHistoryStep: true
+            fiatAmount
           })
         }
       )),
@@ -18244,7 +18417,7 @@ function InputAmountLoaded({
             onChange,
             onKeyDown: handleKeyDown,
             inputProps: {
-              type: isInputInUsd ? "text" : "number",
+              type: isInputInFiat ? "text" : "number",
               autoFocus: true,
               spellCheck: false,
               // get ios to use numpad key with period
@@ -18280,28 +18453,29 @@ function InputAmountLoaded({
             borderRadius: "inputAmountSwitcher",
             isDisabled: isCardCheckout
           },
-          /* @__PURE__ */ React150.createElement(Text, { color: "secondaryText", size: "14" }, isInputInUsd ? formatCryptoAndStringify4(
+          /* @__PURE__ */ React150.createElement(Text, { color: "secondaryText", size: "14" }, isInputInFiat ? formatCryptoAndStringify4(
             displayAssetAmount,
             targetAssetTicker
-          ) : formatCurrencyAndStringify9(usdAmount))
+          ) : formatCurrencyAndStringify9(fiatAmount))
         )
       ),
       amountOptions: (!!usdAvailableAmount || isCardCheckout) && /* @__PURE__ */ React150.createElement(
         QuickOptions,
         {
-          percentMode: !isCardCheckout,
           currency: fiatCurrency,
           onSelect: (option) => {
             const selectedOption = usdAvailableAmount && !isCardCheckout ? usdAvailableAmount * (option / 100) : option;
-            setUsdAmount(selectedOption);
-          }
+            setFiatAmount(selectedOption);
+          },
+          options: quickOptions,
+          percentMode: !isCardCheckout
         }
       ),
       footer: meldEnabled ? /* @__PURE__ */ React150.createElement(Box, { paddingX: "6" }, /* @__PURE__ */ React150.createElement(
         SourceMeldQuoteItem,
         {
           onClick: () => onNext({
-            fiatAmount: usdAmount,
+            fiatAmount,
             fiatCurrency,
             provider: selectedQuote?.serviceProvider,
             nextStep: "meld_quotes" /* MELD_QUOTES */
@@ -18369,8 +18543,8 @@ function YouPayYouReceiveWrapper({
 }
 
 // src/modals/CheckoutModal/InputAmount/InputAmountLoading.tsx
-import { FlagKey as FlagKey21, formatCryptoAndStringify as formatCryptoAndStringify5 } from "@funkit/utils";
-import React151, { useMemo as useMemo26 } from "react";
+import { FlagKey as FlagKey22, formatCryptoAndStringify as formatCryptoAndStringify5 } from "@funkit/utils";
+import React151, { useMemo as useMemo23 } from "react";
 function InputAmountLoading({
   modalState,
   onBack,
@@ -18380,10 +18554,10 @@ function InputAmountLoading({
   const { paymentMethodInfo } = modalState;
   const { checkoutItem } = useCheckoutContext();
   const { unlinkBrokerage } = useFunkitMesh();
-  const meldEnabled = useFlag(FlagKey21.EnableMeldPayment);
+  const meldEnabled = useFlag(FlagKey22.EnableMeldPayment);
   const targetAssetAmount = checkoutItem?.initSettings.config.targetAssetAmount;
   const targetAssetTicker = checkoutItem?.initSettings.config.targetAssetTicker;
-  const error = useMemo26(() => {
+  const error = useMemo23(() => {
     if (sourceHoldingError) {
       return {
         message: /* @__PURE__ */ React151.createElement("div", null, "Unable to retrieve your account balance. Please try re-linking your account.", " ", paymentMethodInfo.paymentMethod === "brokerage" /* BROKERAGE */ && /* @__PURE__ */ React151.createElement(
@@ -18462,7 +18636,7 @@ function InputAmountLoading({
           )
         )
       ),
-      amountOptions: /* @__PURE__ */ React151.createElement(QuickOptions, { disabled: true, percentMode: !isCardCheckout }),
+      amountOptions: !isCardCheckout && /* @__PURE__ */ React151.createElement(QuickOptions, { disabled: true, options: USD_AMOUNT_OPTIONS_PCT, percentMode: true }),
       footer: isMeldCheckout ? /* @__PURE__ */ React151.createElement(Box, { paddingX: "6" }, /* @__PURE__ */ React151.createElement(SourceMeldQuoteItem, { isLoading: true })) : /* @__PURE__ */ React151.createElement(YouPayYouReceiveBottomBarLayoutWrapper, null, /* @__PURE__ */ React151.createElement(
         FunSkeletonBlock,
         {
@@ -18551,7 +18725,7 @@ function useAssetPrice({
 }
 
 // src/modals/CheckoutModal/InputAmount/useAvailableBalanceForCheckout.ts
-import { useMemo as useMemo27 } from "react";
+import { useMemo as useMemo24 } from "react";
 function useAvailableBalanceForCheckout(paymentMethodInfo, targetChainId, assetChainId, assetSymbol) {
   const {
     data: meshAssetHoldings,
@@ -18569,7 +18743,7 @@ function useAvailableBalanceForCheckout(paymentMethodInfo, targetChainId, assetC
     ["token_transfer" /* TOKEN_TRANSFER */]: null,
     ["virtual_bank" /* VIRTUAL_BANK */]: null
   }[paymentMethodInfo.paymentMethod];
-  const holdingItem = useMemo27(() => {
+  const holdingItem = useMemo24(() => {
     if (!assetSymbol || !holdings) {
       return;
     }
@@ -18645,7 +18819,9 @@ function InputAmount(props) {
     checkoutItem?.selectedSourceAssetInfo.symbol ?? null
   );
   const { data: defaultCurrency, isLoading: isMeldDefaultCurrencyLoading } = useMeldDefaultCurrency(paymentMethodInfo.paymentMethod);
-  useMeldCurrencies(paymentMethodInfo.paymentMethod === "card" /* CARD */);
+  const isMeld = paymentMethodInfo.paymentMethod === "card" /* CARD */;
+  useMeldCurrencies(isMeld);
+  useMeldLimits(isMeld);
   const { error: unitPriceError, unitPrice } = useAssetPrice({
     chainId: checkoutItem?.initSettings.config.targetChain,
     assetTokenAddress: checkoutItem?.initSettings.config.targetAsset
@@ -18679,7 +18855,7 @@ function InputAmount(props) {
 import React155, { useEffect as useEffect29 } from "react";
 
 // src/hooks/usePaymentSources.ts
-import { FlagKey as FlagKey22, isNotNullish as isNotNullish8 } from "@funkit/utils";
+import { FlagKey as FlagKey23, isNotNullish as isNotNullish8 } from "@funkit/utils";
 function useRemainingMeshExchangeConnections(selected) {
   const { getActiveConnection } = useFunkitMesh();
   const supportedExchanges = useSupportedExchanges();
@@ -18708,10 +18884,10 @@ function usePaymentMethodEnablement({
   checkoutConfig
 }) {
   const { apiKey, uiCustomizations } = useFunkitConfig();
-  const isTokenTransferFlagEnabled = useFlag(FlagKey22.EnableTokenTransfer);
+  const isTokenTransferFlagEnabled = useFlag(FlagKey23.EnableTokenTransfer);
   const isFiatFlagEnabled = useFiatEnabled();
-  const isCardFlagEnabled = useFlag(FlagKey22.EnableCard);
-  const isBrokerageFlagEnabled = useFlag(FlagKey22.EnableBrokerage);
+  const isCardFlagEnabled = useFlag(FlagKey23.EnableCard);
+  const isBrokerageFlagEnabled = useFlag(FlagKey23.EnableBrokerage);
   const isKatanaEarnFlowAction = isKatanaEarnFlow({ apiKey, checkoutConfig });
   const isUsKatanaUser = useIsUsKatanaUser();
   const isFiatEnabled = isFiatFlagEnabled && !isKatanaEarnFlowAction;
@@ -19068,9 +19244,8 @@ function LoadingAccount({
 }
 
 // src/modals/CheckoutModal/MeldCurrencySelect/MeldCurrencySelect.tsx
-import { clamp as clamp2 } from "@funkit/utils";
 import clsx15 from "clsx";
-import React159, { useMemo as useMemo28, useState as useState35 } from "react";
+import React159, { useMemo as useMemo25, useState as useState35 } from "react";
 
 // src/components/FunNoResults/FunNoResults.tsx
 import React158 from "react";
@@ -19226,14 +19401,13 @@ var selectWrapperStyle = "_163ehmk1";
 // src/modals/CheckoutModal/MeldCurrencySelect/MeldCurrencySelect.tsx
 var MeldCurrencySelectInfo = {
   Component: MeldCurrencySelect,
-  //TODO: improve needless inflating of history if changing currency multiple times
   onNext: (state, payload) => {
     const common = extractCommonState(state);
     return {
       ...common,
       step: "input_amount" /* INPUT_AMOUNT */,
+      // fiatAmount: payload.fiatAmount,
       fiatCurrency: payload.currency,
-      fiatAmount: payload.fiatAmount,
       paymentMethodInfo: state.paymentMethodInfo
     };
   },
@@ -19243,7 +19417,7 @@ var MeldCurrencySelectInfo = {
     return {
       ...common,
       step: "input_amount" /* INPUT_AMOUNT */,
-      fiatAmount: state.fiatAmount,
+      // fiatAmount: state.fiatAmount,
       fiatCurrency: state.defaultCurrency,
       paymentMethodInfo: state.paymentMethodInfo
     };
@@ -19253,14 +19427,13 @@ function MeldCurrencySelect({
   modalState,
   onNext
 }) {
-  const { defaultCurrency, fiatAmount } = modalState;
+  const { defaultCurrency } = modalState;
   const { data, isPending } = useMeldCurrencies();
-  const { data: meldLimits } = useMeldLimits();
   const [query, setQuery] = useState35("");
   const [selectedCurrency, setSelectedCurrency] = useState35(
     defaultCurrency
   );
-  const filteredOptions = useMemo28(() => {
+  const filteredOptions = useMemo25(() => {
     const newOptions = data?.filter(
       ({ name, currencyCode }) => currencyCode.toLowerCase().includes(query.toLowerCase()) || name.toLowerCase().includes(query.toLowerCase())
     ) ?? [];
@@ -19273,13 +19446,9 @@ function MeldCurrencySelect({
   };
   const handleSelect = (value) => {
     setSelectedCurrency(value.currencyCode);
-    const newLimit = meldLimits?.find(
-      (limit) => limit.currencyCode === value.currencyCode
-    );
-    const newFiatAmount = newLimit ? clamp2(fiatAmount, newLimit.minimumAmount, newLimit.maximumAmount) : fiatAmount;
     onNext({
       currency: value.currencyCode,
-      fiatAmount: newFiatAmount,
+      // fiatAmount: newFiatAmount,
       navigateToHistoryStep: true
     });
   };
@@ -19380,8 +19549,8 @@ import {
   meshExecuteTransfer,
   meshExecuteTransferProxy
 } from "@funkit/api-base";
-import { ClientError as ClientError4, FlagKey as FlagKey23, formatAddress as formatAddress4 } from "@funkit/utils";
-import React172, { useMemo as useMemo29, useState as useState38 } from "react";
+import { ClientError as ClientError4, FlagKey as FlagKey24, formatAddress as formatAddress4 } from "@funkit/utils";
+import React172, { useMemo as useMemo26, useState as useState38 } from "react";
 import { createPortal as createPortal9 } from "react-dom";
 
 // src/components/CopyAddress/CopyAddressButton.tsx
@@ -19878,7 +20047,7 @@ function MeshVerification({
   const executionStatus = executionContent?.status;
   const { checkoutItem } = useCheckoutContext();
   const bottomSectionRef = useBottomSectionRef();
-  const enableFrogProxyServer = useFlag(FlagKey23.EnableFrogProxyServer);
+  const enableFrogProxyServer = useFlag(FlagKey24.EnableFrogProxyServer);
   const handleCompletion = useEffectEvent(async (finalOtpInput) => {
     try {
       setIsExecuting(true);
@@ -19961,7 +20130,7 @@ function MeshVerification({
     return () => setScreen(0 /* INITIAL */);
   });
   const brokerName = getExchangeName(brokerType);
-  const verificationTitle = useMemo29(() => {
+  const verificationTitle = useMemo26(() => {
     switch (executionStatus) {
       case MeshExecuteTransferStatus.secondMfaRequired:
         return `Additional ${brokerName} 2FA required`;
@@ -19988,7 +20157,7 @@ function MeshVerification({
     executionContent?.verificationSteps?.length,
     isSecond2fa
   ]);
-  const verificationDescription = useMemo29(() => {
+  const verificationDescription = useMemo26(() => {
     switch (executionStatus) {
       case MeshExecuteTransferStatus.secondMfaRequired:
         return `Please enable at least two 2FA methods on your ${brokerName} account. Once enabled, you will have to reconnect your account.`;
@@ -20133,7 +20302,7 @@ var VerificationPopup = ({
 };
 
 // src/modals/CheckoutModal/MoonpaySetup.tsx
-import React174, { useCallback as useCallback31, useMemo as useMemo31, useState as useState40 } from "react";
+import React174, { useCallback as useCallback31, useMemo as useMemo28, useState as useState40 } from "react";
 
 // src/components/FunPayments/FunPaymentMoonpayType.css.ts
 var mpClass = "_1kmpeyf0";
@@ -20142,7 +20311,7 @@ var stretchStyle = "_1kmpeyf1";
 // src/components/FunPayments/FunPaymentMoonpayType.tsx
 import { getMoonpayUrlSignature } from "@funkit/api-base";
 import { colorToHex } from "@funkit/utils";
-import React173, { Fragment as Fragment2, useEffect as useEffect33, useMemo as useMemo30, useState as useState39 } from "react";
+import React173, { Fragment as Fragment2, useEffect as useEffect33, useMemo as useMemo27, useState as useState39 } from "react";
 var LazyMoonPayBuyWidget = (props) => {
   const [MoonPayBuyWidget, setMoonPayBuyWidget] = useState39(null);
   useEffect33(() => {
@@ -20173,7 +20342,7 @@ function FunPaymentMoonpayType({
   const isSandboxMode = useIsFunkitSandboxMode();
   const funkitConfig = useFunkitConfig();
   const { userInfo } = useGeneralWallet();
-  const currencyCode = useMemo30(() => {
+  const currencyCode = useMemo27(() => {
     return generateMoonpayCurrencyCode(depositToken, depositTokenChainId);
   }, [depositToken, depositTokenChainId]);
   const depositTokenAmountStringFormatted = formatTokenAmountForMoonpay(
@@ -20196,7 +20365,7 @@ function FunPaymentMoonpayType({
     });
     return signature || "";
   };
-  const moonpayButtonColor = useMemo30(() => {
+  const moonpayButtonColor = useMemo27(() => {
     const primaryButtonHex = colorToHex(activeTheme.colors.buttonPrimary);
     if (["#FFF", "#FFFF", "#FFFFFF", "#FFFFFFFF"].includes(primaryButtonHex)) {
       return void 0;
@@ -20251,7 +20420,7 @@ function MoonpaySetup({
       depositAddress: paymentAddress
     });
   }, [onNext, paymentAddress]);
-  const MoonpayWidget = useMemo31(() => {
+  const MoonpayWidget = useMemo28(() => {
     return /* @__PURE__ */ React174.createElement(
       FunPaymentMoonpayType,
       {
@@ -20282,7 +20451,7 @@ function MoonpaySetup({
 // src/modals/CheckoutModal/SelectAsset.tsx
 import { FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST as FUNKIT_CONNECT_SUPPORTED_CHECKOUT_CHAINS_INFO_LIST2 } from "@funkit/chains";
 import { formatCurrencyAndStringify as formatCurrencyAndStringify11, isTokenEquivalent as isTokenEquivalent7 } from "@funkit/utils";
-import React183, { useEffect as useEffect35, useMemo as useMemo33, useState as useState42 } from "react";
+import React183, { useEffect as useEffect35, useMemo as useMemo30, useState as useState42 } from "react";
 import { createPortal as createPortal10 } from "react-dom";
 
 // src/components/Dropdown/ChainDropdown.tsx
@@ -20291,7 +20460,7 @@ import React180 from "react";
 // src/components/Dropdown/BaseDropdown.tsx
 import { isMobile as isMobile6, noop as noop6 } from "@funkit/utils";
 import { AnimatePresence as AnimatePresence4, motion as motion6 } from "motion/react";
-import React178, { useCallback as useCallback32, useMemo as useMemo32, useState as useState41 } from "react";
+import React178, { useCallback as useCallback32, useMemo as useMemo29, useState as useState41 } from "react";
 
 // src/components/FunSelect/FunClickOutside.tsx
 import React175 from "react";
@@ -20497,7 +20666,7 @@ function BaseDropdown({
   const handleSearch = (event) => {
     setSearchInput(event.target.value);
   };
-  const filteredOptions = useMemo32(
+  const filteredOptions = useMemo29(
     () => options.filter(
       (singleOption) => singleOption.label.toLowerCase().includes(searchInput?.toLowerCase())
     ),
@@ -20906,13 +21075,13 @@ var ReceiveTokenDropdown = ({
 
 // src/components/NewTokenDepositAlert/NewTokenDepositAlert.tsx
 import React182 from "react";
-import { FlagKey as FlagKey24, safeParseJson as safeParseJson4 } from "@funkit/utils";
+import { FlagKey as FlagKey25, safeParseJson as safeParseJson4 } from "@funkit/utils";
 var NewTokenDepositAlert = ({
   onClick
 }) => {
-  const alertJson = useFlag(FlagKey24.NewTokenAssetSelectionBanner);
+  const alertJson = useFlag(FlagKey25.NewTokenAssetSelectionBanner);
   const alertData = safeParseJson4(alertJson);
-  const isTokenTransferEnabled = useFlag(FlagKey24.EnableTokenTransfer);
+  const isTokenTransferEnabled = useFlag(FlagKey25.EnableTokenTransfer);
   if (!alertData || !isTokenTransferEnabled) return null;
   return /* @__PURE__ */ React182.createElement(
     FunAlert,
@@ -20980,7 +21149,7 @@ function useEnrichedAccountHoldings({
   const { apiKey } = useFunkitConfig();
   const { isAllowed, isLoading } = useAllowedAssets();
   const { loginType, walletAddress } = useGeneralWallet();
-  const enrichedAccountHoldings = useMemo33(() => {
+  const enrichedAccountHoldings = useMemo30(() => {
     if (!checkoutConfig) return [];
     return Object.values(accountHoldings).map((asset) => {
       const usableForCheckout = isAssetUsableToPayForCheckout({
@@ -21022,7 +21191,7 @@ function useAssetOptions({
   userSelectedTargetAsset,
   chainId
 }) {
-  const assetOptions = useMemo33(() => {
+  const assetOptions = useMemo30(() => {
     return enrichedAccountHoldings.filter(
       ({ asset }) => chainId !== void 0 ? asset.pickedChainId === chainId.toString() : true
     ).map(({ asset, usableForCheckout }) => {
@@ -21093,7 +21262,7 @@ function MeshOrAccountSelectAsset({
     targetAssetMinAmount: 0
   };
   const [selectedTargetAsset, setSelectedTargetAsset] = useState42(defaultTargetAsset);
-  const defaultTokenSymbols = useMemo33(() => {
+  const defaultTokenSymbols = useMemo30(() => {
     if (!checkoutConfig) {
       return [];
     }
@@ -21157,7 +21326,7 @@ function MeshOrAccountSelectAsset({
     handleTargetAssetUpdate(tokenItem);
     onFinish();
   });
-  const selectedChainTokenSymbol = useMemo33(() => {
+  const selectedChainTokenSymbol = useMemo30(() => {
     if (explicitlySelectedChainTokenSymbol) {
       const assetExists = assetOptions.find(
         ({ asset }) => asset.chainSymbolKey === explicitlySelectedChainTokenSymbol
@@ -21569,13 +21738,13 @@ function SelectBrokerage({
 
 // src/modals/CheckoutModal/SourceChange/SourceChange.tsx
 import { BridgeCustomerStatus as BridgeCustomerStatus6 } from "@funkit/api-base";
-import { FlagKey as FlagKey25 } from "@funkit/utils";
+import { FlagKey as FlagKey26 } from "@funkit/utils";
 import React186, { useEffect as useEffect36, useState as useState45 } from "react";
 import { createPortal as createPortal12 } from "react-dom";
 
 // src/modals/CheckoutModal/SourceChange/useUpdateSourceAssetForCard.ts
 import {
-  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO14,
+  FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO as FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO15,
   dydxChain as dydxChain3,
   katanaChain
 } from "@funkit/chains";
@@ -21601,7 +21770,7 @@ var pickSourceAssetForCard = async (checkoutItem, userIpInfo) => {
   const wethAddrOnTargetChain = (await getTokenAddressBySymbolAndChainId2("weth", moonpayChainId)).toLowerCase();
   const isTargetAssetEthOrWeth = [NATIVE_TOKEN, wethAddrOnTargetChain].includes(
     checkoutItem.initSettings.config.targetAsset
-  ) && FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO14[moonpayChainId]?.nativeCurrency.symbol === "ETH" /* ETH */;
+  ) && FUNKIT_CONNECT_SUPPORTED_CHAINS_INFO15[moonpayChainId]?.nativeCurrency.symbol === "ETH" /* ETH */;
   let sourceTokenAddress;
   let sourceTokenTicker;
   let sourceTokenChainId;
@@ -21786,7 +21955,7 @@ function SourceChange({
   const { data: fiatAccounts } = useVirtualFiatAccounts();
   const matchingFiatAccount = useMatchingVirtualFiatAccount(fiatAccounts);
   const { apiKey, textCustomizations } = useFunkitConfig();
-  const enableMeldPayment = useFlag(FlagKey25.EnableMeldPayment);
+  const enableMeldPayment = useFlag(FlagKey26.EnableMeldPayment);
   const hasAutoContinue = !isOstiumCustomer(apiKey);
   useEffect36(() => {
     if (!paymentMethodInfo) return;
@@ -21853,6 +22022,7 @@ function SourceChange({
       if (!enableMeldPayment) await onSelectCard();
       onNext({
         connectNew: true,
+        reverseAnimation: true,
         paymentMethod: newSource2,
         paymentMethodInfo: paymentMethodInfo2,
         brokerageFailed: false
@@ -21957,7 +22127,7 @@ function SourceChange({
 }
 
 // src/modals/CheckoutModal/TransferToken/TransferToken.tsx
-import { FlagKey as FlagKey28 } from "@funkit/utils";
+import { FlagKey as FlagKey29 } from "@funkit/utils";
 import { motion as motion8, useAnimationControls as useAnimationControls3 } from "motion/react";
 import React200, { useEffect as useEffect37, useRef as useRef15, useState as useState48 } from "react";
 import { createPortal as createPortal13 } from "react-dom";
@@ -22019,13 +22189,13 @@ function CopyInputDisplayedAddress({
 }
 
 // src/components/Dropdown/TokenDropdown.tsx
-import { FlagKey as FlagKey26, safeParseJson as safeParseJson5 } from "@funkit/utils";
+import { FlagKey as FlagKey27, safeParseJson as safeParseJson5 } from "@funkit/utils";
 import React189, { useState as useState46 } from "react";
 var TOKEN_ICON_SIZE2 = 16;
 var useNewTokens = () => {
-  const bannerJson = useFlag(FlagKey26.NewTokenAssetSelectionBanner);
+  const bannerJson = useFlag(FlagKey27.NewTokenAssetSelectionBanner);
   const bannerData = safeParseJson5(bannerJson);
-  const newBadgeTokensJson = useFlag(FlagKey26.TokenTransferNewTokens);
+  const newBadgeTokensJson = useFlag(FlagKey27.TokenTransferNewTokens);
   const newBadgeData = safeParseJson5(newBadgeTokensJson);
   const newTokens = newBadgeData && Object.values(newBadgeData).flat();
   const newUniqueTokens = new Set(newTokens);
@@ -22141,7 +22311,7 @@ var LightningBoltIcon = ({ size = 16 }) => /* @__PURE__ */ React190.createElemen
 
 // src/components/QRCode/QRCode.tsx
 import QRCodeUtil from "qrcode";
-import React191, { useMemo as useMemo34 } from "react";
+import React191, { useMemo as useMemo31 } from "react";
 var generateMatrix = (value, errorCorrectionLevel) => {
   const { data } = QRCodeUtil.create(value, { errorCorrectionLevel }).modules;
   const sqrt = Math.sqrt(data.length);
@@ -22169,7 +22339,7 @@ function QRCode({
 }) {
   const { activeTheme } = useActiveTheme();
   const size = sizeProp - Number.parseInt(outsidePadding, 10) * 2;
-  const dots = useMemo34(() => {
+  const dots = useMemo31(() => {
     const dots2 = [];
     const matrix = generateMatrix(uri, ecl);
     const cellSize = size / matrix.length;
@@ -22716,12 +22886,12 @@ var TransferTokenDetails = ({
 
 // src/hooks/useTokenTransfer.ts
 import { solanaChain as solanaChain2 } from "@funkit/chains";
-import { FlagKey as FlagKey27 } from "@funkit/utils";
+import { FlagKey as FlagKey28 } from "@funkit/utils";
 import { mainnet as mainnet8, polygon as polygon5 } from "viem/chains";
 var useTokenTransfer = (selectedChainId, selectedToken) => {
   const { checkoutItem } = useCheckoutContext();
   const enableUniversal = useFlag(
-    FlagKey27.EnableTokenTransferUniversalDepositAddress,
+    FlagKey28.EnableTokenTransferUniversalDepositAddress,
     false
   );
   const estPriceImpact = usePriceImpactEstimation(selectedToken);
@@ -22752,11 +22922,16 @@ var useTokenTransfer = (selectedChainId, selectedToken) => {
   };
 };
 var useMinTransferValue = (selectedChainId) => {
+  const minTransferValueJsonString = useFlag(FlagKey28.MinTokenTransferValue);
+  const minTransferValue = safeJSONParse(
+    minTransferValueJsonString
+  );
   const { userIpInfo } = useFunkitUserIp();
   const isMainnet = selectedChainId === mainnet8.id;
-  if (userIpInfo?.alpha2 === "CA") return isMainnet ? 80 : 15;
-  if (userIpInfo?.alpha2 === "AU") return isMainnet ? 90 : 20;
-  return isMainnet ? 50 : 10;
+  if (!minTransferValue) return 0;
+  const transferLimitKey = userIpInfo?.alpha2 || "DEFAULT";
+  const minTransferLimit = minTransferValue[transferLimitKey] ?? minTransferValue.DEFAULT;
+  return isMainnet ? minTransferLimit.mainnet : minTransferLimit.nonMainnet;
 };
 var usePriceImpactEstimation = (selectedToken) => {
   const { apiKey } = useFunkitConfig();
@@ -22807,7 +22982,7 @@ function TransferToken({
   const filteredAssets = useEnabledTokenTransferChainTokens(
     transferInit ?? null
   );
-  const defaultChainIdFlag = useFlag(FlagKey28.TokenTransferDefaultChainId);
+  const defaultChainIdFlag = useFlag(FlagKey29.TokenTransferDefaultChainId);
   const defaultChainId = defaultValues?.chainId ?? Number(defaultChainIdFlag);
   const validDefaultChainId = filteredAssets[defaultChainId] !== void 0 ? defaultChainId : polygon6.id;
   const [selectedChainId, setSelectedChainId] = useState48(validDefaultChainId);
@@ -23340,7 +23515,7 @@ var FiatAccountDetail = {
 
 // src/modals/CheckoutModal/VirtualFiatAccount/KycIframe.tsx
 import { BridgeCustomerStatus as BridgeCustomerStatus7 } from "@funkit/api-base";
-import React205, { useCallback as useCallback34, useEffect as useEffect38, useMemo as useMemo35, useState as useState50 } from "react";
+import React205, { useCallback as useCallback34, useEffect as useEffect38, useMemo as useMemo32, useState as useState50 } from "react";
 function useIframeListener(listeners) {
   const handleMessage = useCallback34(
     (event) => {
@@ -23393,7 +23568,7 @@ function KycIframe({
   const { clearVirtualFiatAccounts } = useClearFrogAccountsCache();
   const { data: kycLink, isLoading: isLinkLoading } = useLoadKycLink(modalState);
   const [iframeLoading, setIframeLoading] = useState50(true);
-  const listeners = useMemo35(
+  const listeners = useMemo32(
     () => ({
       load: () => {
         logger.info("KYC iframe loaded");
@@ -23422,7 +23597,8 @@ function KycIframe({
       onClose: onBack,
       open: true,
       titleId: "rk_kyc_title",
-      withoutInternalPadding: !loading,
+      withoutSidePadding: !loading,
+      withoutBottomPadding: !loading,
       withTransition: false
     },
     loading && /* @__PURE__ */ React205.createElement(React205.Fragment, null, /* @__PURE__ */ React205.createElement(
@@ -24113,7 +24289,7 @@ function FunConnectOptions({
       }
     }
   };
-  const stepComponent = useMemo36(() => {
+  const stepComponent = useMemo33(() => {
     switch (step) {
       case 0 /* SIGNIN_PRIMARY */:
       case 1 /* SIGNIN_SECONDARY */:
@@ -24222,7 +24398,7 @@ var FULL_SOCIAL_LOGIN_OPTIONS = [
 function useEnabledSocialLogins() {
   const funkitConfig = useFunkitConfig();
   const { web2SocialLogins } = funkitConfig.loginConfig;
-  const enabledSocialItems = useMemo37(() => {
+  const enabledSocialItems = useMemo34(() => {
     return FULL_SOCIAL_LOGIN_OPTIONS.filter(
       (oAuthItem) => !!web2SocialLogins[oAuthItem.funkitKey]
     );
@@ -24251,7 +24427,7 @@ function FunSignInStep({
     handleOauthRedirect,
     handleGenerateFcUri
   } = useFunkitWeb2Login();
-  const isEmailInputValid = useMemo37(() => {
+  const isEmailInputValid = useMemo34(() => {
     return validateEmailString(emailInput);
   }, [emailInput]);
   const [emailError, setEmailError] = useState55();
@@ -24790,7 +24966,7 @@ var getTimestamp = (timestampMs) => formatTimestamp(new Date(timestampMs), {
 // src/components/FunCheckoutHistory/FunCheckoutStatus.tsx
 import { formatSecondsToCountdownForm } from "@funkit/utils";
 import { motion as motion11 } from "motion/react";
-import React220, { useMemo as useMemo38 } from "react";
+import React220, { useMemo as useMemo35 } from "react";
 
 // src/components/FunCheckoutHistory/FunCheckoutStatus.css.ts
 var GradientLoadingBox = "_101aujm0";
@@ -24851,7 +25027,7 @@ function PendingCheckoutStatus({
     checkoutItem.latestQuote?.finalTimeEstimationMs,
     checkoutItem.selectedPaymentMethodInfo?.paymentMethod
   );
-  const estimatedRemainingSeconds = useMemo38(() => {
+  const estimatedRemainingSeconds = useMemo35(() => {
     const startTimeMs = extractStartTimeMs(
       checkoutItem.id,
       activeCheckoutItem,
@@ -24977,7 +25153,7 @@ function FunCheckoutHistoryDetail({
       includeGenerateActionsParams
     ]
   );
-  const buttonProps = useMemo39(() => {
+  const buttonProps = useMemo36(() => {
     if (!isCheckoutLoaded) {
       return { title: "", isDisabled: true, isLoading: true };
     }
@@ -25059,7 +25235,7 @@ var CheckoutAlert = ({ state, refundState, onHelp }) => {
 
 // src/components/FunCheckoutHistory/FunCheckoutHistoryHelp.tsx
 import { sendSupportMessage } from "@funkit/api-base";
-import React224, { useEffect as useEffect43, useMemo as useMemo40, useRef as useRef19, useState as useState58 } from "react";
+import React224, { useEffect as useEffect43, useMemo as useMemo37, useRef as useRef19, useState as useState58 } from "react";
 import { createPortal as createPortal15 } from "react-dom";
 
 // src/components/FunInput/FunTextAreaInput.tsx
@@ -25206,7 +25382,7 @@ function FunCheckoutHistoryHelp({
   );
   const [descriptionInput, setDescriptionInput] = useState58("");
   const [errorMessage, setErrorMessage] = useState58();
-  const isEmailInputValid = useMemo40(() => {
+  const isEmailInputValid = useMemo37(() => {
     return validateEmailString(emailInput);
   }, [emailInput]);
   const [processStage, setProcessStage] = useState58(
@@ -25395,11 +25571,11 @@ import {
   formatTimestamp as formatTimestamp2,
   isTokenEquivalent as isTokenEquivalent8
 } from "@funkit/utils";
-import React226, { useCallback as useCallback41, useMemo as useMemo42, useRef as useRef20, useState as useState59 } from "react";
+import React226, { useCallback as useCallback41, useMemo as useMemo39, useRef as useRef20, useState as useState59 } from "react";
 import { createPortal as createPortal16 } from "react-dom";
 
 // src/components/FunCheckoutHistory/FunDirectExecutionStatus.tsx
-import React225, { useMemo as useMemo41 } from "react";
+import React225, { useMemo as useMemo38 } from "react";
 function FunDirectExecutionStatus({
   directExecution
 }) {
@@ -25421,11 +25597,11 @@ function FunDirectExecutionStatus({
 function PendingDirectExecutionStatus({
   directExecution
 }) {
-  const totalSeconds = useMemo41(() => {
+  const totalSeconds = useMemo38(() => {
     const timeEstimation = directExecution.clientMetadata.latestQuote?.finalTimeEstimationMs || 0;
     return Math.ceil(timeEstimation / 1e3);
   }, [directExecution]);
-  const estimatedRemainingSeconds = useMemo41(() => {
+  const estimatedRemainingSeconds = useMemo38(() => {
     const startTimeMs = directExecution.createdTimeMs;
     return getTimeFromNowSeconds(startTimeMs, totalSeconds * 1e3);
   }, [totalSeconds, directExecution]);
@@ -25477,7 +25653,7 @@ function FunDirectExecutionHistoryDetail({
       includeGenerateActionsParams
     ]
   );
-  const buttonProps = useMemo42(() => {
+  const buttonProps = useMemo39(() => {
     if (!isLoaded) {
       return void 0;
     }
@@ -25689,7 +25865,7 @@ function FunCheckoutHistoryContent({
 }
 
 // src/components/FunCheckoutHistory/useCustomStatusAnimationAboveTopbar.tsx
-import { clamp as clamp3 } from "@funkit/utils";
+import { clamp as clamp2 } from "@funkit/utils";
 import React228, { useRef as useRef21, useState as useState60 } from "react";
 var TOPBAR_HEIGHT = 56;
 var DURATION_MS = 200;
@@ -25747,7 +25923,7 @@ function useCustomStatusAnimationAboveTopbar({
         style: {
           // Apply a position-based opacity to the icon if it gets too far into the topbar, so it fades out faster
           // This helps (slightly) when scrolling much faster than the normal background fade animation
-          opacity: clamp3(
+          opacity: clamp2(
             1 - (scrollPos - startFadePos - statusIconSize) / TOPBAR_HEIGHT,
             0,
             1
@@ -25773,7 +25949,7 @@ 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 React237, { useEffect as useEffect44, useMemo as useMemo43, useRef as useRef22, useState as useState62 } from "react";
+import React237, { useEffect as useEffect44, useMemo as useMemo40, useRef as useRef22, useState as useState62 } from "react";
 import { Virtuoso } from "react-virtuoso";
 import { useAccount as useAccount6 } from "wagmi";
 
@@ -26321,7 +26497,7 @@ function Home({
     const virtuosoDiv = virtuosoParentRef.current?.firstChild;
     virtuosoDiv?.classList.add(animateVirtuosoInClass);
   }, []);
-  const AssetsList = useMemo43(() => {
+  const AssetsList = useMemo40(() => {
     if (walletAssets && !Object.keys(walletAssets).length) {
       return /* @__PURE__ */ React237.createElement(EmptyTabAlert, null);
     }
@@ -26348,7 +26524,7 @@ function Home({
       }
     ));
   }, [walletAssets]);
-  const CheckoutsList = useMemo43(() => {
+  const CheckoutsList = useMemo40(() => {
     if (checkoutHistoryList.length === 0 && isCheckoutHistoryInited) {
       return /* @__PURE__ */ React237.createElement(EmptyTabAlert, null);
     }
@@ -26952,16 +27128,16 @@ function ChainModal({ onClose, open }) {
 // src/modals/CheckoutModal/FunCheckoutModal.tsx
 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 FlagKey31 } from "@funkit/utils";
+import { FlagKey as FlagKey32 } from "@funkit/utils";
 import React253, { useRef as useRef24 } from "react";
 
 // src/components/DydxSwitchModalTab/DydxSwitchModalTab.tsx
 import React245, { useCallback as useCallback44 } from "react";
 
 // src/hooks/useFunkitMaxCheckoutUsdInfo.ts
-import { FlagKey as FlagKey29, formatCurrencyAndStringify as formatCurrencyAndStringify15 } from "@funkit/utils";
+import { FlagKey as FlagKey30, formatCurrencyAndStringify as formatCurrencyAndStringify15 } from "@funkit/utils";
 var useFunkitMaxCheckoutUsdInfo = () => {
-  const maxCheckoutUsd = Number(useFlag(FlagKey29.MaxCheckoutUsd));
+  const maxCheckoutUsd = Number(useFlag(FlagKey30.MaxCheckoutUsd));
   const limitText = maxCheckoutUsd === Number.MAX_VALUE ? "no" : formatCurrencyAndStringify15(maxCheckoutUsd, {
     decimalPrecisionForSuffix: 0,
     minimumSignificantDigits: 0,
@@ -27101,7 +27277,7 @@ var FunCheckoutBlocked = ({ reason }) => {
 
 // src/modals/CheckoutModal/TransferToken/CheckoutNotifications.tsx
 import clsx23 from "clsx";
-import React252, { useEffect as useEffect46, useMemo as useMemo44, useState as useState65 } from "react";
+import React252, { useEffect as useEffect46, useMemo as useMemo41, useState as useState65 } from "react";
 
 // src/components/FunNotificationBanner/FunNotificationShowMoreButton.tsx
 import React247 from "react";
@@ -27149,13 +27325,13 @@ var FunNotificationShowMoreButton = ({
 import {
   getCheckoutsByUserId as getCheckoutsByUserId2
 } from "@funkit/api-base";
-import { FlagKey as FlagKey30 } from "@funkit/utils";
+import { FlagKey as FlagKey31 } from "@funkit/utils";
 import { useQuery as useQuery16 } from "@tanstack/react-query";
 var hasCorrectPaymentMethod = (checkout, paymentMethod) => !paymentMethod || checkout.clientMetadata.selectedPaymentMethodInfo?.paymentMethod === paymentMethod;
 var isRecent = (checkout, timestampCutoff) => checkout.createdTimeMs > timestampCutoff;
 var DEFAULT_NOTIF_CUTOFF = 7 * 24 * 60 * 60 * 1e3;
 function useCheckoutRefreshInterval() {
-  const str = useFlag(FlagKey30.CheckoutNotificationsRefreshInterval);
+  const str = useFlag(FlagKey31.CheckoutNotificationsRefreshInterval);
   return safeJSONParse(str) || { listRefresh: 50 * 1e3, itemRefresh: 5 * 1e3 };
 }
 var useRecentCheckouts = ({
@@ -28142,15 +28318,15 @@ var CheckoutNotifications = ({
     if (initialDirectExecutions || !directExecutions) return;
     setInitialDirectExecutions(directExecutions);
   }, [initialDirectExecutions, directExecutions]);
-  const displayedDirectExecutions = useMemo44(() => {
+  const displayedDirectExecutions = useMemo41(() => {
     if (!directExecutions) return [];
     return getUpdatedDirectExecutions(directExecutions, initialDirectExecutions).filter(({ txHash }) => !closedNotifications.includes(txHash)).slice(0, MAX_COUNT);
   }, [initialDirectExecutions, directExecutions, closedNotifications]);
-  const displayedCheckouts = useMemo44(() => {
+  const displayedCheckouts = useMemo41(() => {
     if (!checkouts) return [];
     return getUpdatedCheckouts(checkouts, initialCheckouts).filter(({ depositAddr }) => !closedNotifications.includes(depositAddr)).slice(0, MAX_COUNT);
   }, [initialCheckouts, checkouts, closedNotifications]);
-  const combinedNotifications = useMemo44(() => {
+  const combinedNotifications = useMemo41(() => {
     return [
       ...displayedDirectExecutions.map(
         (item) => ({ ...item, isDirectExecution: true })
@@ -28160,7 +28336,7 @@ var CheckoutNotifications = ({
       )
     ].sort((a, b) => b.createdTimeMs - a.createdTimeMs);
   }, [displayedDirectExecutions, displayedCheckouts]);
-  const displayedNotifications = useMemo44(() => {
+  const displayedNotifications = useMemo41(() => {
     return isExpanded ? combinedNotifications : combinedNotifications.slice(0, COLLAPSED_COUNT);
   }, [isExpanded, combinedNotifications]);
   const handleNotificationClose = (id) => setClosedNotifications((prev) => [...prev, id]);
@@ -28286,7 +28462,7 @@ function FunCheckoutModalInner({
   const hasBack = hasHistoryEntry && !disableBack;
   const checkoutConfig = checkoutItem.initSettings.config;
   const showDydxSwitch = !hasBack && modalState.step !== "checkout_complete" /* CHECKOUT_COMPLETE */;
-  const helpButtonUrl = useFlag(FlagKey31.HelpTutorialUrl);
+  const helpButtonUrl = useFlag(FlagKey32.HelpTutorialUrl);
   const { onScroll, topbar, withTopDivider } = useCustomStatusAnimationAboveTopbar({
     depositAddress: checkoutItem.depositAddress ?? void 0,
     isCheckoutDetailView: modalState.step === "checkout_complete" /* CHECKOUT_COMPLETE */,
@@ -28314,7 +28490,8 @@ function FunCheckoutModalInner({
       onClose: onCloseWrapper,
       onAnimationComplete: handleAnimationComplete,
       titleId: "fun-checkout-modal",
-      isHidden: modalState.isSoftHidden
+      isHidden: modalState.isSoftHidden,
+      withoutBottomPadding: modalState.step === "meld_currency_select" /* MELD_CURRENCY_SELECT */
     },
     /* @__PURE__ */ React253.createElement(FunCheckoutModalHeightAnimationWrapper, { checkoutStep: modalState.step }, topbar, /* @__PURE__ */ React253.createElement(
       Dialog.Content,
@@ -28485,7 +28662,7 @@ function ModalProvider({ children }) {
   return /* @__PURE__ */ React255.createElement(
     ModalContext.Provider,
     {
-      value: useMemo45(
+      value: useMemo42(
         () => ({
           accountModalOpen,
           accountModalTab,
@@ -29211,7 +29388,7 @@ var FunkitWeb2Provider = ({
     },
     [privy]
   );
-  const web2UserInfo = useMemo46(() => {
+  const web2UserInfo = useMemo43(() => {
     if (!loggedInUser || !loggedInUser?.linked_accounts || !loggedInUser?.linked_accounts?.length) {
       return PLACEHOLDER_FUNKIT_USER_INFO;
     }
@@ -30119,9 +30296,9 @@ function cssStringFromTheme(theme, options = {}) {
 }
 
 // src/hooks/useIsFunkitCheckoutActivated.ts
-import { FlagKey as FlagKey32 } from "@funkit/utils";
+import { FlagKey as FlagKey33 } from "@funkit/utils";
 var useIsFunkitCheckoutActivated = () => {
-  const isCheckoutActivated = useFlag(FlagKey32.IsCheckoutActivated);
+  const isCheckoutActivated = useFlag(FlagKey33.IsCheckoutActivated);
   return {
     isActivated: isCheckoutActivated
   };
@@ -30226,7 +30403,7 @@ function setFunkitConnectVersion({ version }) {
   localStorage.setItem(storageKey5, version);
 }
 function getCurrentSdkVersion() {
-  return "5.5.6";
+  return "5.5.9";
 }
 function useFingerprint() {
   const fingerprint = useCallback49(() => {