@rhinestone/deposit-modal 0.1.31 → 0.1.33

package/dist/{chunk-AWFJFSPH.mjs → chunk-HNDZ6G5K.mjs}

@@ -21,7 +21,7 @@ import {
   portfolioToAssets,
   saveSessionOwnerToStorage,
   tokenFormatter
-} from "./chunk-EVU7M7A6.mjs";
+} from "./chunk-DLFUXLAM.mjs";
 import {
   DEFAULT_BACKEND_URL,
   DEFAULT_SIGNER_ADDRESS,
@@ -35,14 +35,15 @@ import {
   getTargetTokenSymbolsForChain,
   getTokenAddress,
   getTokenIcon,
-  getTokenSymbol
-} from "./chunk-3ICS43XC.mjs";
+  getTokenSymbol,
+  isStablecoinSymbol
+} from "./chunk-C6I5TFSL.mjs";
 
 // src/DepositModal.tsx
 import {
-  useMemo as useMemo7,
-  useEffect as useEffect7,
-  useRef as useRef5,
+  useMemo as useMemo6,
+  useEffect as useEffect8,
+  useRef as useRef6,
   useState as useState8,
   useCallback as useCallback4,
   lazy,
@@ -50,7 +51,7 @@ import {
 } from "react";
 
 // src/DepositFlow.tsx
-import { useState as useState7, useCallback as useCallback3, useMemo as useMemo6, useEffect as useEffect6, useRef as useRef4 } from "react";
+import { useState as useState7, useCallback as useCallback3, useMemo as useMemo5, useEffect as useEffect7, useRef as useRef5 } from "react";
 
 // src/components/steps/SetupStep.tsx
 import { useState, useEffect, useRef, useCallback } from "react";
@@ -249,7 +250,8 @@ function AssetSelectStep({
   defaultSourceToken,
   service,
   onContinue,
-  onTotalBalanceComputed
+  onTotalBalanceComputed,
+  onAssetsLoaded
 }) {
   const [assets, setAssets] = useState2([]);
   const [selectedAssetId, setSelectedAssetId] = useState2(null);
@@ -316,7 +318,8 @@ function AssetSelectStep({
       0
     );
     onTotalBalanceComputed?.(total);
-  }, [assets, onTotalBalanceComputed]);
+    if (assets.length > 0) onAssetsLoaded?.(assets);
+  }, [assets, onTotalBalanceComputed, onAssetsLoaded]);
   const rows = useMemo(() => {
     return assets.filter((a) => {
       try {
@@ -507,9 +510,9 @@ function mergeAssets(existing, incoming) {
 }
 
 // src/components/steps/AmountStep.tsx
-import { useEffect as useEffect3, useMemo as useMemo2, useState as useState3, useRef as useRef2 } from "react";
+import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
 import { erc20Abi, formatUnits as formatUnits2, parseUnits } from "viem";
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function AmountStep({
   walletClient,
   publicClient,
@@ -533,6 +536,8 @@ function AmountStep({
   const chainMismatch = Boolean(
     walletClient?.chain?.id && walletClient.chain.id !== asset.chainId
   );
+  const targetSymbol = getTokenSymbol(targetToken, targetChain);
+  const isSourceStablecoin = isStablecoinSymbol(asset.symbol);
   const tokenPriceUsd = useMemo2(() => {
     if (tokenPriceUsdOverride !== void 0 && tokenPriceUsdOverride > 0)
       return tokenPriceUsdOverride;
@@ -581,26 +586,24 @@ function AmountStep({
       hasAttemptedSwitch.current = true;
       setIsSwitching(true);
       switchChain(asset.chainId).catch((err) => {
-        const message = err instanceof Error ? err.message : "Failed to switch chain";
-        setError(message);
+        const raw = err instanceof Error ? err.message : "Failed to switch chain";
+        setError(formatUserError(raw));
       }).finally(() => {
         setIsSwitching(false);
       });
     }
   }, [chainMismatch, switchChain, asset.chainId]);
+  useEffect3(() => {
+    hasAttemptedSwitch.current = false;
+  }, [asset.chainId]);
   useEffect3(() => {
     if (defaultAmount && !amount) {
       const parsed = Number(defaultAmount);
       if (Number.isFinite(parsed) && parsed > 0) {
-        if (hasPricing) {
-          const usdValue = parsed * tokenPriceUsd;
-          setAmount(usdValue.toFixed(2));
-        } else {
-          setAmount(parsed.toString());
-        }
+        setAmount(parsed.toString());
       }
     }
-  }, [defaultAmount, tokenPriceUsd, hasPricing, amount]);
+  }, [defaultAmount, amount]);
   const balanceUsd = useMemo2(() => {
     if (balance === null || tokenPriceUsd === null) return null;
     try {
@@ -625,36 +628,24 @@ function AmountStep({
       return "...";
     }
   }, [balance, asset.decimals]);
-  const tokenAmount = useMemo2(() => {
-    if (!amount) return null;
-    if (hasPricing) {
-      const usd = Number(amount);
-      if (!Number.isFinite(usd) || usd <= 0) return null;
-      return usd / tokenPriceUsd;
-    }
-    const val = Number(amount);
-    return Number.isFinite(val) && val > 0 ? val : null;
-  }, [amount, tokenPriceUsd, hasPricing]);
-  const formattedTokenAmount = useMemo2(() => {
-    if (tokenAmount === null) return "0.00";
-    return tokenFormatter.format(tokenAmount);
-  }, [tokenAmount]);
-  const targetSymbol = getTokenSymbol(targetToken, targetChain);
   const handlePresetClick = (percentage) => {
     if (balance === null) return;
-    if (hasPricing && balanceUsd !== null) {
-      const value = balanceUsd * percentage / 100;
-      setAmount(value.toFixed(2));
-    } else {
-      try {
-        const balanceUnits = Number(formatUnits2(balance, asset.decimals));
-        if (Number.isFinite(balanceUnits)) {
-          const value = balanceUnits * percentage / 100;
-          setAmount(value.toString());
-        }
-      } catch {
-        return;
+    try {
+      const balanceUnits = Number(formatUnits2(balance, asset.decimals));
+      if (!Number.isFinite(balanceUnits)) return;
+      let value;
+      if (isSourceStablecoin || !hasPricing) {
+        value = balanceUnits * percentage / 100;
+      } else {
+        value = (balanceUsd ?? 0) * percentage / 100;
       }
+      const maxDecimals = 3;
+      const factor = 10 ** maxDecimals;
+      const truncated = Math.floor(value * factor) / factor;
+      const formatted = truncated.toFixed(maxDecimals).replace(/\.?0+$/, "");
+      setAmount(formatted);
+    } catch {
+      return;
     }
     if (error) setError(null);
   };
@@ -664,24 +655,28 @@ function AmountStep({
       setError("Please enter a valid amount");
       return;
     }
-    let tokenAmountStr;
+    let sourceAmount;
+    if (isSourceStablecoin || !hasPricing) {
+      sourceAmount = numericAmount;
+    } else {
+      sourceAmount = numericAmount / tokenPriceUsd;
+    }
     if (hasPricing) {
-      if (uiConfig?.maxDepositUsd && numericAmount > uiConfig.maxDepositUsd) {
+      const usdValue = numericAmount;
+      if (uiConfig?.maxDepositUsd && usdValue > uiConfig.maxDepositUsd) {
         setError(
           `Maximum deposit is ${currencyFormatter.format(uiConfig.maxDepositUsd)}`
         );
         return;
       }
-      if (uiConfig?.minDepositUsd && numericAmount < uiConfig.minDepositUsd) {
+      if (uiConfig?.minDepositUsd && usdValue < uiConfig.minDepositUsd) {
         setError(
           `Minimum deposit is ${currencyFormatter.format(uiConfig.minDepositUsd)}`
         );
         return;
       }
-      tokenAmountStr = (numericAmount / tokenPriceUsd).toString();
-    } else {
-      tokenAmountStr = numericAmount.toString();
     }
+    const tokenAmountStr = sourceAmount.toString();
     let amountInUnits;
     try {
       amountInUnits = parseUnits(tokenAmountStr, asset.decimals);
@@ -694,24 +689,12 @@ function AmountStep({
       return;
     }
     setError(null);
-    onContinue(tokenAmountStr, balance ?? void 0);
-  };
-  const handleSwitch = async () => {
-    if (!asset.chainId || !switchChain) return;
-    setIsSwitching(true);
-    try {
-      await switchChain(asset.chainId);
-    } catch (err) {
-      const message = err instanceof Error ? err.message : "Failed to switch chain";
-      setError(message);
-    } finally {
-      setIsSwitching(false);
-    }
+    onContinue(tokenAmountStr, amount, balance ?? void 0);
   };
   return /* @__PURE__ */ jsxs3("div", { className: "rs-step", children: [
     /* @__PURE__ */ jsxs3("div", { className: "rs-step-body", style: { paddingTop: 0 }, children: [
       /* @__PURE__ */ jsxs3("div", { className: "rs-amount-display", children: [
-        /* @__PURE__ */ jsx3("div", { className: "rs-amount-input-wrapper", children: hasPricing ? /* @__PURE__ */ jsx3(
+        /* @__PURE__ */ jsx3("div", { className: "rs-amount-input-wrapper", children: /* @__PURE__ */ jsx3(
           "input",
           {
             type: "text",
@@ -728,50 +711,19 @@ function AmountStep({
             },
             autoFocus: true
           }
-        ) : /* @__PURE__ */ jsx3(
-          "input",
-          {
-            type: "text",
-            inputMode: "decimal",
-            className: "rs-amount-input-large",
-            placeholder: `0.00 ${asset.symbol}`,
-            value: amount,
-            onChange: (e) => {
-              const raw = e.target.value.replace(/[^0-9.]/g, "");
-              const parts = raw.split(".");
-              if (parts.length > 2) return;
-              setAmount(raw);
-              if (error) setError(null);
-            },
-            autoFocus: true
-          }
         ) }),
-        (uiConfig?.showTokenBalance ?? false) && /* @__PURE__ */ jsxs3(Fragment2, { children: [
-          hasPricing ? /* @__PURE__ */ jsxs3("div", { className: "rs-amount-token-value", children: [
-            formattedTokenAmount,
-            " ",
-            asset.symbol
-          ] }) : /* @__PURE__ */ jsx3(
-            "div",
-            {
-              className: "rs-amount-token-value",
-              style: { color: "var(--rs-muted-foreground)" },
-              children: "Price unavailable"
-            }
-          ),
-          /* @__PURE__ */ jsx3("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs3("span", { className: "rs-amount-available-value", children: [
-            formattedBalance,
+        !isSourceStablecoin && /* @__PURE__ */ jsx3("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs3("span", { className: "rs-amount-available-value", children: [
+          formattedBalance,
+          " ",
+          asset.symbol,
+          " available",
+          hasPricing && balanceUsd !== null && /* @__PURE__ */ jsxs3("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
             " ",
-            asset.symbol,
-            " available",
-            hasPricing && balanceUsd !== null && /* @__PURE__ */ jsxs3("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
-              " ",
-              "(",
-              currencyFormatter.format(balanceUsd),
-              ")"
-            ] })
-          ] }) })
-        ] })
+            "(",
+            currencyFormatter.format(balanceUsd),
+            ")"
+          ] })
+        ] }) })
       ] }),
       /* @__PURE__ */ jsx3(
         "div",
@@ -904,23 +856,7 @@ function AmountStep({
           }
         )
       ] }),
-      chainMismatch && /* @__PURE__ */ jsxs3("div", { className: "rs-chain-switch", style: { marginTop: 16 }, children: [
-        /* @__PURE__ */ jsxs3("div", { className: "rs-chain-switch-text", children: [
-          "Switch your wallet to ",
-          getChainName(asset.chainId),
-          " to continue."
-        ] }),
-        switchChain && /* @__PURE__ */ jsx3(
-          Button,
-          {
-            variant: "outline",
-            size: "small",
-            loading: isSwitching,
-            onClick: handleSwitch,
-            children: "Switch"
-          }
-        )
-      ] }),
+      chainMismatch && /* @__PURE__ */ jsx3("div", { className: "rs-chain-switch", style: { marginTop: 16 }, children: /* @__PURE__ */ jsx3("div", { className: "rs-chain-switch-text", children: isSwitching ? `Switching to ${getChainName(asset.chainId)}...` : `Switch your wallet to ${getChainName(asset.chainId)} to continue.` }) }),
       error && /* @__PURE__ */ jsxs3("div", { className: "rs-amount-error", children: [
         /* @__PURE__ */ jsx3(
           "svg",
@@ -957,10 +893,9 @@ function AmountStep({
 }
 
 // src/components/steps/ConfirmStep.tsx
-import { useMemo as useMemo3, useState as useState4 } from "react";
-import { erc20Abi as erc20Abi2, formatUnits as formatUnits3, parseUnits as parseUnits2 } from "viem";
+import { useEffect as useEffect4, useRef as useRef3, useState as useState4 } from "react";
+import { erc20Abi as erc20Abi2, parseUnits as parseUnits2 } from "viem";
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var STABLECOIN_SYMBOLS = /* @__PURE__ */ new Set(["USDC", "USDT", "DAI"]);
 function ConfirmStep({
   walletClient,
   address,
@@ -968,6 +903,8 @@ function ConfirmStep({
   recipient,
   asset,
   amount,
+  targetAmount,
+  targetTokenPriceUsd,
   balance,
   targetChain,
   targetToken,
@@ -979,55 +916,37 @@ function ConfirmStep({
   const [isSubmitting, setIsSubmitting] = useState4(false);
   const [error, setError] = useState4(null);
   const [isSwitching, setIsSwitching] = useState4(false);
+  const hasAttemptedSwitch = useRef3(false);
   const chainMismatch = walletClient?.chain?.id && walletClient.chain.id !== asset.chainId;
   const sameRoute = targetChain === asset.chainId && targetToken.toLowerCase() === asset.token.toLowerCase();
   const targetSymbol = sameRoute ? asset.symbol : getTokenSymbol(targetToken, targetChain);
-  const formattedAmount = amount && !Number.isNaN(Number(amount)) ? Number(amount).toLocaleString("en-US", { maximumFractionDigits: 6 }) : "0";
-  const tokenPriceUsd = useMemo3(() => {
-    if (asset.balanceUsd === void 0 || !asset.balance) return null;
-    try {
-      const balanceUnits = Number(
-        formatUnits3(BigInt(asset.balance), asset.decimals)
-      );
-      if (!Number.isFinite(balanceUnits) || balanceUnits <= 0) return null;
-      return asset.balanceUsd / balanceUnits;
-    } catch {
-      return null;
-    }
-  }, [asset.balanceUsd, asset.balance, asset.decimals]);
-  const amountUsd = useMemo3(() => {
-    if (!amount || tokenPriceUsd === null) return null;
-    const parsed = Number(amount);
-    if (!Number.isFinite(parsed) || parsed <= 0) return null;
-    return parsed * tokenPriceUsd;
-  }, [amount, tokenPriceUsd]);
-  const targetTokenPriceUsd = useMemo3(() => {
-    const targetSym = targetSymbol.toUpperCase();
-    const sourceSym = asset.symbol.toUpperCase();
-    if (STABLECOIN_SYMBOLS.has(targetSym)) return 1;
-    if (targetSym === sourceSym && tokenPriceUsd !== null) return tokenPriceUsd;
-    return null;
-  }, [targetSymbol, asset.symbol, tokenPriceUsd]);
-  const receiveAmountUsd = useMemo3(() => {
-    if (amountUsd === null) return null;
-    return sameRoute ? amountUsd : amountUsd * 0.99;
-  }, [amountUsd, sameRoute]);
-  const receiveTokenAmount = useMemo3(() => {
-    if (sameRoute) {
-      const parsed = Number(amount);
-      return Number.isFinite(parsed) ? parsed : null;
+  const formattedSendAmount = amount && !Number.isNaN(Number(amount)) ? Number(amount).toLocaleString("en-US", { maximumFractionDigits: 6 }) : "0";
+  const formattedReceiveAmount = (() => {
+    if (sameRoute) return formattedSendAmount;
+    const dollarValue = Number(targetAmount);
+    if (!Number.isFinite(dollarValue) || dollarValue <= 0) return formattedSendAmount;
+    if (targetTokenPriceUsd !== null && targetTokenPriceUsd > 0) {
+      const tokenAmount = dollarValue / targetTokenPriceUsd;
+      return tokenAmount.toLocaleString("en-US", { maximumFractionDigits: 6 });
     }
-    if (receiveAmountUsd === null || targetTokenPriceUsd === null || targetTokenPriceUsd === 0)
-      return null;
-    return receiveAmountUsd / targetTokenPriceUsd;
-  }, [sameRoute, amount, receiveAmountUsd, targetTokenPriceUsd]);
-  const formattedReceiveAmount = useMemo3(() => {
-    if (receiveTokenAmount === null) return formattedAmount;
-    return receiveTokenAmount.toLocaleString("en-US", {
-      maximumFractionDigits: 6
-    });
-  }, [receiveTokenAmount, formattedAmount]);
+    return formattedSendAmount;
+  })();
   const receiveAmount = sameRoute ? formattedReceiveAmount : `~ ${formattedReceiveAmount}`;
+  useEffect4(() => {
+    if (chainMismatch && switchChain && !hasAttemptedSwitch.current) {
+      hasAttemptedSwitch.current = true;
+      setIsSwitching(true);
+      switchChain(asset.chainId).catch((err) => {
+        const raw = err instanceof Error ? err.message : "Failed to switch chain";
+        setError(formatUserError(raw));
+      }).finally(() => {
+        setIsSwitching(false);
+      });
+    }
+  }, [chainMismatch, switchChain, asset.chainId]);
+  useEffect4(() => {
+    hasAttemptedSwitch.current = false;
+  }, [asset.chainId]);
   const handleConfirm = async () => {
     if (!address || !walletClient) {
       setError("Wallet not connected");
@@ -1086,18 +1005,6 @@ function ConfirmStep({
       setIsSubmitting(false);
     }
   };
-  const handleSwitch = async () => {
-    if (!switchChain) return;
-    setIsSwitching(true);
-    try {
-      await switchChain(asset.chainId);
-    } catch (err) {
-      const raw = err instanceof Error ? err.message : "Failed to switch chain";
-      setError(formatUserError(raw));
-    } finally {
-      setIsSwitching(false);
-    }
-  };
   return /* @__PURE__ */ jsxs4("div", { className: "rs-step", children: [
     /* @__PURE__ */ jsx4("div", { style: { padding: "12px 12px 10px" }, children: /* @__PURE__ */ jsx4("div", { className: "rs-step-title", children: "Review order" }) }),
     /* @__PURE__ */ jsxs4("div", { className: "rs-step-body rs-space-y-3", style: { paddingTop: 0 }, children: [
@@ -1166,7 +1073,7 @@ function ConfirmStep({
                     style: { width: 16, height: 16, borderRadius: "50%" }
                   }
                 ),
-                formattedAmount,
+                formattedSendAmount,
                 " ",
                 asset.symbol
               ]
@@ -1195,29 +1102,9 @@ function ConfirmStep({
               ]
             }
           )
-        ] }),
-        receiveAmountUsd !== null && /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
-          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "Value" }),
-          /* @__PURE__ */ jsx4("span", { className: "rs-card-value", children: currencyFormatter.format(receiveAmountUsd) })
         ] })
       ] }),
-      chainMismatch && /* @__PURE__ */ jsxs4("div", { className: "rs-chain-switch", children: [
-        /* @__PURE__ */ jsxs4("div", { className: "rs-chain-switch-text", children: [
-          "Switch your wallet to ",
-          getChainName(asset.chainId),
-          " to sign."
-        ] }),
-        switchChain && /* @__PURE__ */ jsx4(
-          Button,
-          {
-            variant: "outline",
-            size: "small",
-            loading: isSwitching,
-            onClick: handleSwitch,
-            children: "Switch"
-          }
-        )
-      ] }),
+      chainMismatch && /* @__PURE__ */ jsx4("div", { className: "rs-chain-switch", children: /* @__PURE__ */ jsx4("div", { className: "rs-chain-switch-text", children: isSwitching ? `Switching to ${getChainName(asset.chainId)}...` : `Switch your wallet to ${getChainName(asset.chainId)} to sign.` }) }),
       error && /* @__PURE__ */ jsxs4("div", { className: "rs-alert rs-alert--error", children: [
         /* @__PURE__ */ jsx4(
           "svg",
@@ -1255,14 +1142,14 @@ function ConfirmStep({
 }
 
 // src/components/steps/DepositAddressStep.tsx
-import { useState as useState6, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as useMemo5 } from "react";
+import { useState as useState6, useEffect as useEffect6, useCallback as useCallback2, useRef as useRef4, useMemo as useMemo4 } from "react";
 
 // src/components/ui/QRCode.tsx
-import { useEffect as useEffect4, useMemo as useMemo4, useState as useState5 } from "react";
-import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { useEffect as useEffect5, useMemo as useMemo3, useState as useState5 } from "react";
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function QRCode({ value, size = 200, iconSrc, className }) {
   const [createQrCode, setCreateQrCode] = useState5(null);
-  useEffect4(() => {
+  useEffect5(() => {
     let mounted = true;
     void import("qrcode-generator").then((mod) => {
       if (mounted) {
@@ -1277,7 +1164,7 @@ function QRCode({ value, size = 200, iconSrc, className }) {
       mounted = false;
     };
   }, []);
-  const svgContent = useMemo4(() => {
+  const svgContent = useMemo3(() => {
     if (!createQrCode) {
       return null;
     }
@@ -1317,7 +1204,7 @@ function QRCode({ value, size = 200, iconSrc, className }) {
       children: [
         /* @__PURE__ */ jsx5("rect", { width: size, height: size, fill: "white", rx: 4 }),
         svgContent ? /* @__PURE__ */ jsx5("path", { d: svgContent.paths, fill: "black" }) : /* @__PURE__ */ jsx5("rect", { x: 8, y: 8, width: size - 16, height: size - 16, fill: "#f1f5f9" }),
-        iconSrc && /* @__PURE__ */ jsxs5(Fragment3, { children: [
+        iconSrc && /* @__PURE__ */ jsxs5(Fragment2, { children: [
           /* @__PURE__ */ jsx5(
             "rect",
             {
@@ -1395,17 +1282,17 @@ function DepositAddressStep({
   onDepositDetected,
   onError
 }) {
-  const supportedChainIds = useMemo5(() => getSupportedChainIds(), []);
+  const supportedChainIds = useMemo4(() => getSupportedChainIds(), []);
   const BASE_CHAIN_ID = 8453;
   const defaultChainId = supportedChainIds.includes(BASE_CHAIN_ID) ? BASE_CHAIN_ID : supportedChainIds[0];
   const [sourceChainId, setSourceChainId] = useState6(defaultChainId);
-  const tokensForChain = useMemo5(
+  const tokensForChain = useMemo4(
     () => getTargetTokenSymbolsForChain(sourceChainId),
     [sourceChainId]
   );
   const defaultToken = tokensForChain.includes("USDC") ? "USDC" : tokensForChain[0] ?? "USDC";
   const [sourceTokenSymbol, setSourceTokenSymbol] = useState6(defaultToken);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!tokensForChain.includes(sourceTokenSymbol)) {
       setSourceTokenSymbol(tokensForChain[0] ?? "USDC");
     }
@@ -1414,12 +1301,12 @@ function DepositAddressStep({
   const [pollingError, setPollingError] = useState6(null);
   const [chainDropdownOpen, setChainDropdownOpen] = useState6(false);
   const [tokenDropdownOpen, setTokenDropdownOpen] = useState6(false);
-  const depositHandledRef = useRef3(false);
-  const sourceSelectionRef = useRef3({
+  const depositHandledRef = useRef4(false);
+  const sourceSelectionRef = useRef4({
     chainId: defaultChainId,
     tokenSymbol: defaultToken
   });
-  useEffect5(() => {
+  useEffect6(() => {
     sourceSelectionRef.current = {
       chainId: sourceChainId,
       tokenSymbol: sourceTokenSymbol
@@ -1443,7 +1330,7 @@ function DepositAddressStep({
       setTimeout(() => setCopied(false), 2e3);
     }
   }, [smartAccount]);
-  useEffect5(() => {
+  useEffect6(() => {
     depositHandledRef.current = false;
     setPollingError(null);
     let timeoutId;
@@ -1695,6 +1582,7 @@ function DepositFlow({
   waitForFinalTx = true,
   reownWallet,
   onConnect,
+  onDisconnect,
   onRequestConnect,
   connectButtonLabel,
   uiConfig,
@@ -1713,13 +1601,30 @@ function DepositFlow({
   const [totalBalanceUsd, setTotalBalanceUsd] = useState7(0);
   const [isConnectSelectionConfirmed, setIsConnectSelectionConfirmed] = useState7(false);
   const [selectedConnectAddress, setSelectedConnectAddress] = useState7(null);
-  const dappSwitchChain = useMemo6(() => {
+  const portfolioAssetsRef = useRef5([]);
+  const handleAssetsLoaded = useCallback3((assets) => {
+    portfolioAssetsRef.current = assets;
+  }, []);
+  const getTokenPriceUsd = useCallback3((symbol) => {
+    const sym = symbol.toLowerCase();
+    for (const asset of portfolioAssetsRef.current) {
+      if (asset.symbol.toLowerCase() === sym && asset.balanceUsd && asset.balance) {
+        try {
+          const balanceUnits = Number(asset.balance) / 10 ** asset.decimals;
+          if (balanceUnits > 0) return asset.balanceUsd / balanceUnits;
+        } catch {
+        }
+      }
+    }
+    return null;
+  }, []);
+  const dappSwitchChain = useMemo5(() => {
     if (!dappWalletClient?.switchChain) return void 0;
     return async (chainId) => {
       await dappWalletClient.switchChain?.({ id: chainId });
     };
   }, [dappWalletClient]);
-  const walletOptions = useMemo6(() => {
+  const walletOptions = useMemo5(() => {
     const options = [];
     const seen = /* @__PURE__ */ new Set();
     if (dappWalletClient?.account && dappAddress) {
@@ -1730,7 +1635,7 @@ function DepositFlow({
       });
       seen.add(dappWalletClient.account.address.toLowerCase());
     }
-    if (reownWallet?.address && reownWallet.isConnected && !seen.has(reownWallet.address.toLowerCase())) {
+    if (reownWallet?.address && reownWallet.isConnected && reownWallet.walletClient && reownWallet.publicClient && !seen.has(reownWallet.address.toLowerCase())) {
       options.push({
         address: reownWallet.address,
         label: "External Wallet",
@@ -1744,12 +1649,15 @@ function DepositFlow({
     dappAddress,
     reownWallet?.address,
     reownWallet?.isConnected,
+    reownWallet?.walletClient,
+    reownWallet?.publicClient,
     reownWallet?.icon
   ]);
   const canAutoLock = dappWalletClient?.account && dappAddress && !reownWallet;
   const hasWalletOptions = walletOptions.length > 0;
+  const hasReownSession = Boolean(reownWallet?.isConnected || reownWallet?.address);
   const showConnectStep = !canAutoLock && !isConnectSelectionConfirmed;
-  const signerContext = useMemo6(() => {
+  const signerContext = useMemo5(() => {
     if (flowMode === "deposit-address") {
       if (!dappAddress) return null;
       return {
@@ -1800,8 +1708,8 @@ function DepositFlow({
     targetChain
   ]);
   const sessionKeyAddress = dappAddress ?? signerContext?.ownerAddress ?? null;
-  const lastTargetRef = useRef4(null);
-  useEffect6(() => {
+  const lastTargetRef = useRef5(null);
+  useEffect7(() => {
     const prev = lastTargetRef.current;
     if (prev && (prev.chain !== targetChain || prev.token.toLowerCase() !== targetToken.toLowerCase())) {
       if (step.type !== "processing") {
@@ -1836,17 +1744,16 @@ function DepositFlow({
       return {
         type: "amount",
         smartAccount: prev.smartAccount,
-        asset: prev.asset,
-        amount: prev.amount
+        asset: prev.asset
       };
     });
   }, []);
   const stepIndex = step.type === "setup" ? 0 : step.type === "deposit-address" ? 1 : step.type === "select-asset" ? 1 : step.type === "amount" ? 2 : step.type === "confirm" ? 3 : 4;
   const currentBackHandler = step.type === "deposit-address" ? handleBackFromDepositAddress : step.type === "select-asset" && signerContext && !canAutoLock ? handleBackFromSelectAsset : step.type === "amount" ? handleBackFromAmount : step.type === "confirm" ? handleBackFromConfirm : void 0;
-  useEffect6(() => {
+  useEffect7(() => {
     onStepChange?.(stepIndex, currentBackHandler);
   }, [stepIndex, currentBackHandler, onStepChange]);
-  useEffect6(() => {
+  useEffect7(() => {
     onTotalBalanceChange?.(totalBalanceUsd);
   }, [totalBalanceUsd, onTotalBalanceChange]);
   const isDepositAddressMode = flowMode === "deposit-address";
@@ -1910,7 +1817,10 @@ function DepositFlow({
     [defaultAmount]
   );
   const handleAmountContinue = useCallback3(
-    (amount, balance) => {
+    (amount, targetAmount, balance) => {
+      const targetSym = getTokenSymbol(targetToken, targetChain);
+      const isTargetStable = isStablecoinSymbol(targetSym);
+      const targetTokenPriceUsd = isTargetStable ? 1 : getTokenPriceUsd(targetSym);
       setStep((prev) => {
         if (prev.type !== "amount") return prev;
         return {
@@ -1918,11 +1828,13 @@ function DepositFlow({
           smartAccount: prev.smartAccount,
           asset: prev.asset,
           amount,
+          targetAmount,
+          targetTokenPriceUsd,
           balance
         };
       });
     },
-    []
+    [targetToken, targetChain, getTokenPriceUsd]
   );
   const handleDepositSubmitted = useCallback3(
     (txHash, chainId, amount, token) => {
@@ -1968,22 +1880,22 @@ function DepositFlow({
   const handleTotalBalanceComputed = useCallback3((total) => {
     setTotalBalanceUsd(total);
   }, []);
-  const selectedConnectAddressEffective = useMemo6(() => {
+  const selectedConnectAddressEffective = useMemo5(() => {
     if (selectedConnectAddress) return selectedConnectAddress;
     if (walletOptions.length === 1) {
       return walletOptions[0].address;
     }
     return null;
   }, [selectedConnectAddress, walletOptions]);
-  const walletOptionsKey = useMemo6(
+  const walletOptionsKey = useMemo5(
     () => walletOptions.map((option) => option.address.toLowerCase()).join(","),
     [walletOptions]
   );
-  const hasNavigatedBackRef = useRef4(false);
-  useEffect6(() => {
+  const hasNavigatedBackRef = useRef5(false);
+  useEffect7(() => {
     setIsConnectSelectionConfirmed(false);
   }, [walletOptionsKey]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (hasNavigatedBackRef.current || isConnectSelectionConfirmed || flowMode) {
       return;
     }
@@ -1996,12 +1908,13 @@ function DepositFlow({
         return;
       }
     }
-    if (!hasWalletOptions && dappAddress) {
+    if (!hasWalletOptions && dappAddress && !hasReownSession) {
       handleSelectTransferCrypto();
       setIsConnectSelectionConfirmed(true);
     }
   }, [
     hasWalletOptions,
+    hasReownSession,
     isConnectSelectionConfirmed,
     flowMode,
     selectedConnectAddressEffective,
@@ -2022,6 +1935,7 @@ function DepositFlow({
         } : void 0,
         onRequestConnect,
         onConnect,
+        onDisconnect,
         onContinue: () => {
           if (selectedConnectAddressEffective) {
             setSelectedConnectAddress(selectedConnectAddressEffective);
@@ -2069,7 +1983,6 @@ function DepositFlow({
           sourceChain: step.sourceChain,
           sourceToken: step.sourceToken,
           targetChain,
-          targetToken,
           amount: step.amount,
           waitForFinalTx,
           service,
@@ -2122,7 +2035,8 @@ function DepositFlow({
         defaultSourceToken,
         service,
         onContinue: handleAssetContinue,
-        onTotalBalanceComputed: handleTotalBalanceComputed
+        onTotalBalanceComputed: handleTotalBalanceComputed,
+        onAssetsLoaded: handleAssetsLoaded
       }
     ),
     step.type === "amount" && /* @__PURE__ */ jsx7(
@@ -2149,6 +2063,8 @@ function DepositFlow({
         recipient,
         asset: step.asset,
         amount: step.amount,
+        targetAmount: step.targetAmount,
+        targetTokenPriceUsd: step.targetTokenPriceUsd,
         balance: step.balance,
         targetChain,
         targetToken,
@@ -2166,7 +2082,6 @@ function DepositFlow({
         sourceChain: step.sourceChain,
         sourceToken: step.sourceToken,
         targetChain,
-        targetToken,
         amount: step.amount,
         waitForFinalTx,
         service,
@@ -2184,7 +2099,7 @@ function DepositFlow({
 // src/DepositModal.tsx
 import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 var ReownDepositInner = lazy(
-  () => import("./DepositModalReown-S7HER5HU.mjs").then((m) => ({ default: m.DepositModalReown }))
+  () => import("./DepositModalReown-7ZO7HUN3.mjs").then((m) => ({ default: m.DepositModalReown }))
 );
 function DepositModal(props) {
   const needsReown = !!props.reownAppId;
@@ -2214,6 +2129,7 @@ function DepositModalInner({
   waitForFinalTx = true,
   reownWallet,
   onConnect,
+  onDisconnect,
   onRequestConnect,
   connectButtonLabel,
   theme,
@@ -2228,26 +2144,26 @@ function DepositModalInner({
   onError,
   debug
 }) {
-  const modalRef = useRef5(null);
+  const modalRef = useRef6(null);
   const [currentStepIndex, setCurrentStepIndex] = useState8(0);
   const [totalBalanceUsd, setTotalBalanceUsd] = useState8(null);
-  const backHandlerRef = useRef5(void 0);
+  const backHandlerRef = useRef6(void 0);
   const targetChain = getChainId(targetChainProp);
   const sourceChain = sourceChainProp ? getChainId(sourceChainProp) : void 0;
-  const service = useMemo7(() => createDepositService(backendUrl), [backendUrl]);
-  useEffect7(() => {
+  const service = useMemo6(() => createDepositService(backendUrl), [backendUrl]);
+  useEffect8(() => {
     if (isOpen && modalRef.current) {
       applyTheme(modalRef.current, theme);
     }
   }, [isOpen, theme]);
-  const hasCalledReady = useRef5(false);
-  useEffect7(() => {
+  const hasCalledReady = useRef6(false);
+  useEffect8(() => {
     if (isOpen && !hasCalledReady.current) {
       hasCalledReady.current = true;
       onReady?.();
     }
   }, [isOpen, onReady]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!isOpen) {
       setCurrentStepIndex(0);
     }
@@ -2383,6 +2299,7 @@ function DepositModalInner({
             waitForFinalTx,
             reownWallet,
             onConnect,
+            onDisconnect,
             onRequestConnect,
             connectButtonLabel,
             uiConfig,