@getpara/react-sdk-lite 2.10.0 → 2.11.0

package/dist/modal/components/Account/AccountSend/context.js

@@ -1,6 +1,5 @@
 "use client";
 import {
-  __async,
   __spreadProps,
   __spreadValues
 } from "../../../../chunk-MMUBH76A.js";
@@ -14,12 +13,9 @@ import {
   useRef,
   useState
 } from "react";
-import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { useInternalClient } from "../../../../provider/hooks/utils/useInternalClient.js";
-import { useProfileBalance, useSignMessage, useSignTransaction, useWalletState } from "../../../../provider/index.js";
-import { hexStringToBase64 } from "@getpara/web-sdk";
-import { useModalStore } from "../../../stores/index.js";
-import { ModalStep } from "../../../utils/steps.js";
+import { useProfileBalance, useWalletState } from "../../../../provider/index.js";
+import { useSendMutations } from "../../../hooks/index.js";
 import { useStore } from "../../../../provider/stores/useStore.js";
 const getDefaultSendMetadata = (balances, wallet) => {
   if (!balances || !(wallet == null ? void 0 : wallet.type) || !(wallet == null ? void 0 : wallet.address) || (wallet == null ? void 0 : wallet.type) === "COSMOS") {
@@ -65,11 +61,7 @@ function AccountSendProvider({ children, step }) {
     var _a2;
     return (_a2 = state.modalConfig) == null ? void 0 : _a2.balances;
   });
-  const setStep = useModalStore((state) => state.setStep);
-  const setSendTx = useModalStore((state) => state.setSendTx);
   const { data: balances } = useProfileBalance({ isComprehensive: true });
-  const { signTransactionAsync } = useSignTransaction();
-  const { signMessageAsync } = useSignMessage();
   const { selectedWallet, setSelectedWallet } = useWalletState();
   const [estimate, setEstimate] = useState(null);
   const [broadcast, setBroadcast] = useState(null);
@@ -78,6 +70,7 @@ function AccountSendProvider({ children, step }) {
   const [transferValue, setTransferValue] = useState(0);
   const [transferAmount, setTransferAmount] = useState(getTransferAmount(sendMetadata, transferValue));
   const [isMax, setIsMax] = useState(false);
+  const [simulateFailure, setSimulateFailure] = useState(false);
   const optionsType = useMemo(() => {
     const walletBalance = balances == null ? void 0 : balances.wallets.find(({ address }) => address === (selectedWallet == null ? void 0 : selectedWallet.address));
     if (!walletBalance || walletBalance.assets.length === 0) {
@@ -88,106 +81,26 @@ function AccountSendProvider({ children, step }) {
     }
     return "MULTIPLE";
   }, [balances, selectedWallet == null ? void 0 : selectedWallet.address]);
-  const {
-    mutate: estimateMutate,
-    isPending: estimateIsPending,
-    isError: estimateIsError
-  } = useMutation({
-    mutationKey: ["estimate-tx"],
-    mutationFn: (_0) => __async(this, [_0], function* ({ userId, walletId, opts }) {
-      if (!para.userId || !selectedWallet.id) {
-        return null;
-      }
-      const result = yield para.ctx.client.estimateSendTransaction({
-        userId,
-        walletId,
-        opts
-      });
-      return result;
-    }),
-    onSuccess: (data) => {
-      setEstimate(data);
-    },
-    onError: (error) => {
-      console.error(error);
+  const estimateOnSuccess = useCallback((estimateResult) => {
+    setEstimate(estimateResult);
+  }, []);
+  const broadcastOnSuccess = useCallback((data) => {
+    if (!!(data == null ? void 0 : data.error)) {
+      setBroadcast(data);
     }
-  });
-  const queryClient = useQueryClient();
-  const refs = useStore((state) => state.refs);
-  const {
-    mutate: broadcastMutate,
-    isPending: broadcastIsPending,
-    isError: broadcastIsError
-  } = useMutation({
-    mutationKey: ["broadcast-tx"],
-    mutationFn: (_0) => __async(this, [_0], function* ({
-      userId,
-      walletId,
-      walletAddress,
-      walletType,
-      txSerialized,
-      message,
-      evmChainId,
-      isDevnet
-    }) {
-      var _a2, _b2, _c2, _d2, _e2;
-      if (!para.userId || !selectedWallet.id) {
-        return null;
-      }
-      let signature;
-      switch (walletType) {
-        case "SOLANA":
-          signature = (_a2 = yield signMessageAsync({
-            walletId,
-            messageBase64: message
-          })) == null ? void 0 : _a2.signature;
-          break;
-        case "EVM":
-        default:
-          signature = (_b2 = yield signTransactionAsync({
-            walletId,
-            rlpEncodedTxBase64: hexStringToBase64(txSerialized),
-            chainId: evmChainId
-          })) == null ? void 0 : _b2.signature;
-          if (!!signature) {
-            signature = `0x${signature}`;
-          }
-          break;
-      }
-      const result = yield para.ctx.client.broadcastSendTransaction({
-        userId,
-        walletId,
-        opts: {
-          type: walletType,
-          evmChainId,
-          isDevnet,
-          tx: txSerialized,
-          signature,
-          sourceAddress: walletAddress,
-          txUrlFormat: (_e2 = (_d2 = (_c2 = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _c2.metadata) == null ? void 0 : _d2.explorer) == null ? void 0 : _e2.txUrlFormat
-        }
-      });
-      return result;
-    }),
-    onSuccess: (data) => {
-      if (!!(data == null ? void 0 : data.error)) {
-        setBroadcast(data);
-      } else if (!!data) {
-        setSendTx(data);
-        setStep(ModalStep.ACCOUNT_MAIN);
-        refs.balancesInvalidationTime.current = Date.now();
-        queryClient.invalidateQueries({
-          queryKey: ["useProfileBalance"],
-          refetchType: "active"
-        });
-      }
+  }, []);
+  const { estimateMutate, broadcastMutate, estimateIsPending, estimateIsError, broadcastIsPending, broadcastIsError } = useSendMutations({
+    estimateOnSuccess,
+    estimateOnError: (e) => {
+      console.error(e);
     },
-    onError: (error) => {
-      console.error(error);
+    broadcastOnSuccess,
+    broadcastOnError: (e) => {
+      console.error(e);
     }
   });
   const onSubmit = useCallback(() => {
-    var _a2, _b2, _c2, _d2, _e2, _f2;
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
     broadcastMutate({
       userId: para.userId,
       walletId: selectedWallet.id,
@@ -196,7 +109,15 @@ function AccountSendProvider({ children, step }) {
       txSerialized: (_a2 = estimate == null ? void 0 : estimate.result) == null ? void 0 : _a2.txSerialized,
       message: (_b2 = estimate == null ? void 0 : estimate.result) == null ? void 0 : _b2.message,
       evmChainId: (_d2 = (_c2 = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _c2.metadata) == null ? void 0 : _d2.evmChainId,
-      isDevnet: ((_f2 = (_e2 = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _e2.metadata) == null ? void 0 : _f2.internalId) === "SOLANA_DEVNET"
+      isDevnet: ((_f2 = (_e2 = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _e2.metadata) == null ? void 0 : _f2.internalId) === "SOLANA_DEVNET",
+      txUrlFormat: (_i = (_h = (_g = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _g.metadata) == null ? void 0 : _h.explorer) == null ? void 0 : _i.txUrlFormat,
+      rpc: ((_k = (_j = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _j.metadata) == null ? void 0 : _k.rpcUrl) ? {
+        httpUrls: [(_m = (_l = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _l.metadata) == null ? void 0 : _m.rpcUrl],
+        wsUrls: [
+          (_o = (_n = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _n.metadata) == null ? void 0 : _o.rpcUrl.replace(/^https:\/\//, "wss://").replace(/^http:\/\//, "ws://")
+        ]
+      } : (_q = (_p = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _p.metadata) == null ? void 0 : _q.rpc,
+      simulateFailure
     });
   }, [
     para.userId,
@@ -206,7 +127,9 @@ function AccountSendProvider({ children, step }) {
     (_a = estimate == null ? void 0 : estimate.result) == null ? void 0 : _a.txSerialized,
     (_b = estimate == null ? void 0 : estimate.result) == null ? void 0 : _b.message,
     (_d = (_c = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _c.metadata) == null ? void 0 : _d.evmChainId,
-    (_f = (_e = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _e.metadata) == null ? void 0 : _f.internalId
+    (_f = (_e = sendMetadata == null ? void 0 : sendMetadata.network) == null ? void 0 : _e.metadata) == null ? void 0 : _f.internalId,
+    simulateFailure,
+    broadcastMutate
   ]);
   const availableWallets = useMemo(() => {
     return para.availableWallets.filter(({ type }) => type !== "COSMOS");
@@ -391,7 +314,9 @@ function AccountSendProvider({ children, step }) {
       broadcast,
       broadcastIsPending,
       broadcastIsError,
-      optionsType
+      optionsType,
+      simulateFailure,
+      setSimulateFailure
     };
   }, [
     step,
@@ -415,7 +340,9 @@ function AccountSendProvider({ children, step }) {
     broadcast,
     broadcastIsPending,
     broadcastIsError,
-    optionsType
+    optionsType,
+    simulateFailure,
+    setSimulateFailure
   ]);
   return /* @__PURE__ */ jsx(AccountSendContext.Provider, { value, children });
 }

package/dist/modal/components/AddFunds/AddFundsContext.js

@@ -9,6 +9,7 @@ import {
   useContext,
   useEffect,
   useMemo,
+  useRef,
   useState
 } from "react";
 import { OnRampStep, useModalStore } from "../../stores/index.js";
@@ -24,6 +25,7 @@ import {
 import { getNetworkFromChainId, getNetworkOrMainNetEquivalent, safeStyled } from "@getpara/react-common";
 import { CpslAlert, CpslIcon } from "@getpara/react-components";
 import { useStore } from "../../../provider/stores/useStore.js";
+import { getDefaultAssetAndNetwork, isAmountWithinProviderLimits } from "../../utils/onramps.js";
 const TABS = [
   [EnabledFlow.BUY, "isBuyEnabled", "creditCard", "Buy"],
   [EnabledFlow.RECEIVE, "isReceiveEnabled", "qrCode", "Receive"],
@@ -56,7 +58,7 @@ function isValid(onRampConfig, walletType, network, asset) {
 }
 const AddFundsContext = createContext(DEFAULT);
 function AddFundsContextProvider({ tab, children }) {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d, _e, _f;
   const appName = useStore((state) => state.appName);
   const client = useStore((state) => state.client);
   const onRampConfig = useModalStore((state) => state.onRampConfig);
@@ -67,7 +69,9 @@ function AddFundsContextProvider({ tab, children }) {
   const { chainId } = useExternalWallets();
   const isTestMode = ((_a = client == null ? void 0 : client.ctx) == null ? void 0 : _a.env) === Environment.PROD ? (_b = onRampConfig == null ? void 0 : onRampConfig.testMode) != null ? _b : false : true;
   const { data: activeWallet } = useWallet();
-  const [fiatQuantity, setFiatQuantity] = useState((_d = (_c = onRampConfig == null ? void 0 : onRampConfig.defaultBuyAmount) == null ? void 0 : _c[0]) != null ? _d : "25.00");
+  const [fiatQuantity, setFiatQuantity] = useState(
+    (_e = (_d = (_c = onRampConfig == null ? void 0 : onRampConfig.defaultBuyAmount) == null ? void 0 : _c[0]) == null ? void 0 : _d.toString()) != null ? _e : "25.00"
+  );
   const networks = useMemo(() => {
     if (!onRampConfig) {
       return [];
@@ -118,16 +122,22 @@ function AddFundsContextProvider({ tab, children }) {
     });
   }, [networks, asset, activeWallet == null ? void 0 : activeWallet.type, onRampConfig, tab]);
   const isProviderAllowed = useMemo(
-    () => onRampConfig && !!(activeWallet == null ? void 0 : activeWallet.type) ? onRampConfig.providers.reduce(
-      (acc, id) => {
-        var _a2, _b2, _c2, _d2, _e2;
-        return __spreadProps(__spreadValues({}, acc), {
-          [id]: !!network && !!asset && !!((_e2 = (_d2 = (_c2 = (_b2 = (_a2 = onRampConfig.assetInfo[activeWallet.type]) == null ? void 0 : _a2[network]) == null ? void 0 : _b2[asset]) == null ? void 0 : _c2[id]) == null ? void 0 : _d2[1]) == null ? void 0 : _e2[tab === EnabledFlow.BUY ? "BUY" : "SELL"])
-        });
-      },
-      {}
-    ) : {},
-    [onRampConfig, network, asset, activeWallet, tab]
+    () => onRampConfig && !!(activeWallet == null ? void 0 : activeWallet.type) ? onRampConfig.providers.reduce((acc, id) => {
+      var _a2, _b2, _c2, _d2, _e2;
+      const purchaseType = tab === EnabledFlow.BUY ? OnRampPurchaseType.BUY : OnRampPurchaseType.SELL;
+      let isAllowed = !!network && !!asset && !!((_e2 = (_d2 = (_c2 = (_b2 = (_a2 = onRampConfig.assetInfo[activeWallet.type]) == null ? void 0 : _a2[network]) == null ? void 0 : _b2[asset]) == null ? void 0 : _c2[id]) == null ? void 0 : _d2[1]) == null ? void 0 : _e2[purchaseType]);
+      if (isAllowed && fiatQuantity) {
+        const fiatQtyString = String(fiatQuantity);
+        if (fiatQtyString.trim() !== "") {
+          const amount = parseFloat(fiatQtyString);
+          if (!isNaN(amount) && !isAmountWithinProviderLimits(amount, id, purchaseType)) {
+            isAllowed = false;
+          }
+        }
+      }
+      return __spreadProps(__spreadValues({}, acc), { [id]: isAllowed });
+    }, {}) : {},
+    [onRampConfig, network, asset, activeWallet, tab, fiatQuantity]
   );
   const settingsStep = useMemo(() => {
     switch (true) {
@@ -160,7 +170,7 @@ function AddFundsContextProvider({ tab, children }) {
       ] }) }),
       /* @__PURE__ */ jsx(CloseButton, { onClick: () => setIsTestModeAlertDismissed(true), children: /* @__PURE__ */ jsx(CloseX, { icon: "x" }) })
     ] }) }) : null;
-  }, [isTestModeAlertDismissed, appName, isTestMode, setIsTestModeAlertDismissed, (_e = client == null ? void 0 : client.ctx) == null ? void 0 : _e.env]);
+  }, [isTestModeAlertDismissed, appName, isTestMode, setIsTestModeAlertDismissed, (_f = client == null ? void 0 : client.ctx) == null ? void 0 : _f.env]);
   useEffect(() => {
     if (!!asset && !network && narrowedNetworks.length === 1) {
       setNetwork(narrowedNetworks[0]);
@@ -197,27 +207,62 @@ function AddFundsContextProvider({ tab, children }) {
     asset,
     network,
     fiatQuantity,
-    setFiatQuantity,
     activeWallet,
     onRampConfig,
     isTestMode,
     settingsStep,
     TestModeAlert
   ]);
+  const prevWalletTypeRef = useRef(activeWallet == null ? void 0 : activeWallet.type);
   useEffect(() => {
-    const newNetwork = !!(activeWallet == null ? void 0 : activeWallet.type) && !!(onRampConfig == null ? void 0 : onRampConfig.defaultOnRampNetwork) && !!onRampConfig.assetInfo[activeWallet.type][onRampConfig.defaultOnRampNetwork] ? onRampConfig.defaultOnRampNetwork : networks.find(
-      (network2) => (activeWallet == null ? void 0 : activeWallet.type) === "COSMOS" ? network2 === "COSMOS" : (activeWallet == null ? void 0 : activeWallet.type) === "SOLANA" ? network2 === "SOLANA" : network2 === "ETHEREUM"
-    ) || networks[0] || null;
-    const newAsset = !!network && !!(onRampConfig == null ? void 0 : onRampConfig.defaultOnRampAsset) && assets.includes(onRampConfig.defaultOnRampAsset) ? onRampConfig.defaultOnRampAsset : assets.find(
-      (asset2) => (activeWallet == null ? void 0 : activeWallet.type) === "COSMOS" ? asset2 === "ATOM" : (activeWallet == null ? void 0 : activeWallet.type) === "SOLANA" ? asset2 === "SOLANA" : asset2 === "ETHEREUM"
-    ) || assets[0] || null;
-    if (newAsset !== asset) {
-      setAsset(newAsset);
+    const walletTypeChanged = prevWalletTypeRef.current !== (activeWallet == null ? void 0 : activeWallet.type);
+    prevWalletTypeRef.current = activeWallet == null ? void 0 : activeWallet.type;
+    if (assets.length === 0 || networks.length === 0) {
+      return;
+    }
+    if (walletTypeChanged) {
+      const { asset: newAsset, network: newNetwork } = getDefaultAssetAndNetwork({
+        walletType: activeWallet == null ? void 0 : activeWallet.type,
+        onRampConfig,
+        networks,
+        assets
+      });
+      if (newAsset !== asset) {
+        setAsset(newAsset);
+      }
+      if (newNetwork !== network) {
+        setNetwork(newNetwork);
+      }
+      return;
+    }
+    if (asset && !network) {
+      const { network: newNetwork } = getDefaultAssetAndNetwork({
+        walletType: activeWallet == null ? void 0 : activeWallet.type,
+        onRampConfig,
+        networks,
+        assets,
+        preferredAsset: asset
+      });
+      if (newNetwork !== network) {
+        setNetwork(newNetwork);
+      }
+      return;
     }
-    if (newNetwork !== network) {
-      setNetwork(newNetwork);
+    if (!network && !asset) {
+      const { asset: newAsset, network: newNetwork } = getDefaultAssetAndNetwork({
+        walletType: activeWallet == null ? void 0 : activeWallet.type,
+        onRampConfig,
+        networks,
+        assets
+      });
+      if (newAsset !== asset) {
+        setAsset(newAsset);
+      }
+      if (newNetwork !== network) {
+        setNetwork(newNetwork);
+      }
     }
-  }, [activeWallet == null ? void 0 : activeWallet.type, assets, networks]);
+  }, [activeWallet == null ? void 0 : activeWallet.type, assets, networks, onRampConfig]);
   useEffect(() => {
     if (!!activeWallet && onRampStep === OnRampStep.PROVIDER && !isValid(onRampConfig, activeWallet.type, network, asset)) {
       setOnRampStep(OnRampStep.SETTINGS);

package/dist/modal/components/AddFunds/AddFundsReceive.js

@@ -27,7 +27,7 @@ function AddFundsReceive() {
     [para, activeWallet == null ? void 0 : activeWallet.id, activeWallet == null ? void 0 : activeWallet.type]
   );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    (embedded == null ? void 0 : embedded.wallets) && embedded.wallets.length > 1 && /* @__PURE__ */ jsx(WalletSelectOld, { noTitle: true, style: { width: "100%" } }),
+    (embedded == null ? void 0 : embedded.wallets) && /* @__PURE__ */ jsx(WalletSelectOld, { noTitle: true, style: { width: "100%" } }),
     !isMobile() && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InnerStepContainer, { children: /* @__PURE__ */ jsx(QRContainer, { children: !address ? /* @__PURE__ */ jsx(CpslSpinner, { size: 100 }) : /* @__PURE__ */ jsx(CpslQrCode, { url: address }, address) }) }) }),
     (activeWallet == null ? void 0 : activeWallet.type) && /* @__PURE__ */ jsx(InnerStepContainer, { children: /* @__PURE__ */ jsxs(CenteredText, { variant: "bodyS", weight: "semiBold", children: [
       "Only send funds on",

package/dist/modal/components/AddFunds/AddFundsSettings.js

@@ -6,17 +6,17 @@ import {
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { useAddFunds } from "./AddFundsContext.js";
+import { isAmountWithinProviderLimits, PROVIDER_LIMITS } from "../../utils/onramps.js";
 import { CpslButton, CpslIcon, CpslRow, CpslText } from "@getpara/react-components";
 import { AssetIcon, contentMotionProps } from "../common.js";
 import { QuantityInput } from "../QuantityInput.js";
-import { formatAssetQuantity } from "@getpara/web-sdk";
+import { formatAssetQuantity, OnRampPurchaseType, EnabledFlow } from "@getpara/web-sdk";
 import { OnRampStep, useModalStore } from "../../stores/index.js";
 import { safeStyled, getAssetCode, getNetworkName } from "@getpara/react-common";
 import { AnimatePresence, motion, useIsPresent } from "framer-motion";
 import { AddFundsAsset } from "./AddFundsAsset.js";
 import { WalletSelectOld } from "../WalletSelectOld/WalletSelectOld.js";
 import { useAccount } from "../../../provider/index.js";
-import { useDebounce } from "../../hooks/useDebounce.js";
 import { useAssetInfo } from "../../../provider/hooks/utils/useAssetInfo.js";
 import { AddFundsNetwork } from "./AddFundsNetwork.js";
 import { useStore } from "../../../provider/stores/useStore.js";
@@ -31,6 +31,7 @@ function AddFundsSettings() {
   const { embedded } = useAccount();
   const {
     assets,
+    networks,
     narrowedNetworks,
     asset,
     setAsset,
@@ -40,25 +41,90 @@ function AddFundsSettings() {
     setFiatQuantity,
     isProviderAllowed,
     settingsStep,
-    TestModeAlert
+    TestModeAlert,
+    onRampConfig,
+    activeWallet,
+    tab
   } = useAddFunds();
-  const [value, setValue] = useState(parseFloat(fiatQuantity || "25.00").toFixed(2));
-  const dbValue = useDebounce(value, 200);
+  const [value, setValue] = useState(parseFloat(String(fiatQuantity || "25.00")).toFixed(2));
   const assetQuantity = useMemo(() => {
     var _a, _b, _c;
     if (!asset) {
       return -1;
     }
     const assetValue = (_c = (_b = (_a = assetInfo.data) == null ? void 0 : _a[asset]) == null ? void 0 : _b.price) == null ? void 0 : _c.value;
-    const dbValueFloat = !dbValue || isNaN(parseFloat(dbValue)) ? null : parseFloat(dbValue);
-    if (!assetValue || !asset || !dbValueFloat) {
+    const valueFloat = !value || isNaN(parseFloat(value)) ? null : parseFloat(value);
+    if (!assetValue || !asset || !valueFloat) {
       return -1;
     }
     if (["TETHER", "USDC", "CUSD"].includes(asset)) {
-      return dbValueFloat;
+      return valueFloat;
+    }
+    return valueFloat / assetValue;
+  }, [asset, assetInfo, value]);
+  const providerAvailability = useMemo(() => {
+    if (!value || value.trim() === "") {
+      return { hasProviders: false, reason: null, minAmount: null, maxAmount: null };
+    }
+    const hasBasicSupport = Object.values(isProviderAllowed).some((allowed) => allowed === true);
+    if (!hasBasicSupport) {
+      return { hasProviders: false, reason: "NO_SUPPORT", minAmount: null, maxAmount: null };
+    }
+    if (!onRampConfig || !(activeWallet == null ? void 0 : activeWallet.type) || !asset || !network) {
+      return { hasProviders: hasBasicSupport, reason: null, minAmount: null, maxAmount: null };
+    }
+    const amount = parseFloat(value);
+    if (isNaN(amount)) {
+      return { hasProviders: false, reason: "INVALID_AMOUNT", minAmount: null, maxAmount: null };
+    }
+    const purchaseType = tab === EnabledFlow.BUY ? OnRampPurchaseType.BUY : OnRampPurchaseType.SELL;
+    let hasAtLeastOne = false;
+    let allBelowMin = true;
+    let allAboveMax = true;
+    const mins = [];
+    const maxes = [];
+    onRampConfig.providers.forEach((id) => {
+      if (!isProviderAllowed[id]) return;
+      const withinLimits = isAmountWithinProviderLimits(amount, id, purchaseType);
+      if (withinLimits) {
+        hasAtLeastOne = true;
+        allBelowMin = false;
+        allAboveMax = false;
+      } else {
+        const limits = PROVIDER_LIMITS[id][purchaseType];
+        if (limits.min !== null) mins.push(limits.min);
+        if (limits.max !== null) maxes.push(limits.max);
+        if (limits.min !== null && amount >= limits.min) allBelowMin = false;
+        if (limits.max !== null && amount <= limits.max) allAboveMax = false;
+      }
+    });
+    if (hasAtLeastOne) {
+      return { hasProviders: true, reason: null, minAmount: null, maxAmount: null };
+    }
+    if (allBelowMin && mins.length > 0) {
+      return {
+        hasProviders: false,
+        reason: "BELOW_MIN",
+        minAmount: Math.min(...mins),
+        maxAmount: null
+      };
+    }
+    if (allAboveMax && maxes.length > 0) {
+      return {
+        hasProviders: false,
+        reason: "ABOVE_MAX",
+        minAmount: null,
+        maxAmount: Math.max(...maxes)
+      };
     }
-    return dbValueFloat / assetValue;
-  }, [asset, assetInfo, dbValue]);
+    return {
+      hasProviders: false,
+      reason: "NO_PROVIDERS",
+      minAmount: null,
+      maxAmount: null
+    };
+  }, [isProviderAllowed, value, onRampConfig, activeWallet == null ? void 0 : activeWallet.type, asset, network, tab]);
+  const hasAvailableProviders = providerAvailability.hasProviders;
   const { key, Content } = useMemo(() => {
     switch (settingsStep) {
       case "NO_PROVIDERS":
@@ -70,6 +136,7 @@ function AddFundsSettings() {
           ] })
         };
       case "FORM": {
+        const isClickable = !!network && (assets.length > 1 || networks.length > 1);
         return {
           key: "form",
           Content: /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -79,7 +146,9 @@ function AddFundsSettings() {
                 AssetButton,
                 {
                   variant: "tertiary",
-                  onClick: network && (assets.length > 1 || narrowedNetworks.length > 1) ? () => {
+                  $isClickable: isClickable,
+                  cursor: isClickable ? "pointer" : "auto",
+                  onClick: isClickable ? () => {
                     switch (true) {
                       case assets.length === 1:
                         setNetwork(null);
@@ -92,7 +161,7 @@ function AddFundsSettings() {
                   children: [
                     /* @__PURE__ */ jsx(AssetIcon, { asset, size: "24px" }),
                     /* @__PURE__ */ jsx(CpslText, { variant: "bodyS", color: "contrast", children: assetQuantity > 0 ? formatAssetQuantity({ quantity: assetQuantity, symbol: getAssetCode(asset) }) : getAssetCode(asset) }),
-                    /* @__PURE__ */ jsx(CpslIcon, { icon: "chevronRight", size: "24px", color: "var(--cpsl-color-text-contrast)" })
+                    isClickable && /* @__PURE__ */ jsx(CpslIcon, { icon: "chevronRight", size: "24px", color: "var(--cpsl-color-text-contrast)" })
                   ]
                 }
               ),
@@ -101,21 +170,37 @@ function AddFundsSettings() {
                 getNetworkName(network)
               ] })
             ] }),
-            /* @__PURE__ */ jsxs(
-              CpslButton,
-              {
-                fullWidth: true,
-                disabled: value === "",
-                onClick: () => {
-                  setFiatQuantity(value != null ? value : void 0);
-                  setOnRampStep(OnRampStep.PROVIDER);
-                },
-                children: [
-                  "Continue",
-                  /* @__PURE__ */ jsx(CpslIcon, { icon: "arrow" })
-                ]
-              }
-            )
+            /* @__PURE__ */ jsxs(CpslRow, { col: true, gap: "8px", children: [
+              /* @__PURE__ */ jsxs(
+                CpslButton,
+                {
+                  fullWidth: true,
+                  disabled: !hasAvailableProviders,
+                  onClick: () => {
+                    setFiatQuantity(value != null ? value : void 0);
+                    setOnRampStep(OnRampStep.PROVIDER);
+                  },
+                  children: [
+                    "Continue",
+                    /* @__PURE__ */ jsx(CpslIcon, { icon: "arrow" })
+                  ]
+                }
+              ),
+              !hasAvailableProviders && value !== "" && asset && network && (() => {
+                const { reason, minAmount, maxAmount } = providerAvailability;
+                let message = "No providers available for this transaction";
+                if (reason === "INVALID_AMOUNT") {
+                  message = "Please enter a valid amount";
+                } else if (reason === "BELOW_MIN" && minAmount !== null) {
+                  message = `Amount too low, must be $${minAmount.toFixed(2)} or greater`;
+                } else if (reason === "ABOVE_MAX" && maxAmount !== null) {
+                  message = `Amount too high, must be $${maxAmount.toFixed(2)} or less`;
+                } else if (reason) {
+                  message = "No providers available for this transaction";
+                }
+                return /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "error", align: "center", children: message });
+              })()
+            ] })
           ] })
         };
       }
@@ -136,7 +221,18 @@ function AddFundsSettings() {
         };
       }
     }
-  }, [asset, network, assets, narrowedNetworks, isProviderAllowed, assetQuantity, isPresent, value, hideWallets]);
+  }, [
+    asset,
+    network,
+    assets,
+    narrowedNetworks,
+    isProviderAllowed,
+    assetQuantity,
+    isPresent,
+    value,
+    hideWallets,
+    providerAvailability
+  ]);
   const isWalletSelectVisible = useMemo(() => {
     return settingsStep && ["FORM", "NO_PROVIDERS"].includes(settingsStep) && (embedded == null ? void 0 : embedded.wallets) && embedded.wallets.length > 1;
   }, [embedded, settingsStep]);
@@ -171,8 +267,17 @@ const AssetButton = safeStyled(CpslButton)`
   --button-padding-top: 8px;
   --button-padding-bottom: 8px;
   --button-padding-start: 8px;
-  --button-padding-end: 8px;
+  --button-padding-end: ${({ $isClickable }) => $isClickable ? "8px" : "16px"};
   --button-gap: 4px;
+
+  ${({ $isClickable }) => !$isClickable && `
+    &:hover {
+      --button-tertiary-hover-background-color: var(--button-tertiary-background-color);
+      --button-tertiary-hover-border-color: var(--button-tertiary-border-color);
+      --button-tertiary-active-background-color: var(--button-tertiary-background-color);
+      --button-tertiary-active-border-color: var(--button-tertiary-border-color);
+    }
+  `}
 `;
 export {
   AddFundsSettings

package/dist/modal/components/Body/Body.js

@@ -46,6 +46,7 @@ import { Footer } from "../Footer/Footer.js";
 import { renderTextWithLinks } from "../../utils/renderTextWithLinks.js";
 import { AccountWallet } from "../Account/AccountWallet.js";
 import { AccountSend } from "../Account/AccountSend/index.js";
+import { AccountMonitorTx } from "../Account/AccountMonitorTx.js";
 const MIN_HEIGHT = {
   [ModalStep.ADD_FUNDS_AWAITING]: "680px"
 };
@@ -219,6 +220,9 @@ const Body = ({
       case ModalStep.ACCOUNT_SEND_NETWORK: {
         return /* @__PURE__ */ jsx(AccountSend, { step: "SEND_NETWORK" });
       }
+      case ModalStep.ACCOUNT_MONITOR_TX: {
+        return /* @__PURE__ */ jsx(AccountMonitorTx, {});
+      }
       default: {
         if (IFrameSteps.includes(currentStep)) {
           return null;

package/dist/modal/components/ErrorBoundary.d.ts

@@ -0,0 +1,20 @@
+import { Component, ErrorInfo, ReactNode } from 'react';
+interface Props {
+    children: ReactNode;
+    fallback?: ReactNode;
+    onError?: (error: Error, errorInfo: ErrorInfo) => void;
+}
+interface State {
+    hasError: boolean;
+}
+/**
+ * Error boundary component that catches JavaScript errors in child components
+ * and displays a fallback UI instead of crashing the entire component tree.
+ */
+export declare class ErrorBoundary extends Component<Props, State> {
+    constructor(props: Props);
+    static getDerivedStateFromError(): State;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): ReactNode;
+}
+export {};