@rhinestone/deposit-modal 0.1.21 → 0.1.23

package/dist/chunk-N2LJOFT2.mjs

@@ -0,0 +1,2346 @@
+import {
+  Button,
+  ConnectStep,
+  Modal,
+  PoweredBy,
+  ProcessingStep,
+  Spinner,
+  accountFromPrivateKey,
+  applyTheme,
+  createDepositService,
+  createSessionOwnerKey,
+  createSmartAccount,
+  createViewOnlyAccount,
+  currencyFormatter,
+  formatUserError,
+  getAccountAddress,
+  getAccountInitData,
+  getAssetId,
+  getEventTxHash,
+  getPublicClient,
+  getSessionDetails,
+  isDepositEvent,
+  isNativeAsset,
+  loadSessionOwnerFromStorage,
+  portfolioToAssets,
+  saveSessionOwnerToStorage,
+  tokenFormatter
+} from "./chunk-JBT2ZV3Q.mjs";
+import {
+  CHAIN_BY_ID,
+  DEFAULT_BACKEND_URL,
+  DEFAULT_SIGNER_ADDRESS,
+  NATIVE_TOKEN_ADDRESS,
+  SOURCE_CHAINS,
+  getChainBadge,
+  getChainIcon,
+  getChainId,
+  getChainName,
+  getSupportedChainIds,
+  getSupportedTokenSymbolsForChain,
+  getTokenAddress,
+  getTokenIcon,
+  getTokenSymbol
+} from "./chunk-A6QLADED.mjs";
+
+// src/DepositModal.tsx
+import {
+  useMemo as useMemo7,
+  useEffect as useEffect7,
+  useRef as useRef5,
+  useState as useState8,
+  useCallback as useCallback4,
+  lazy,
+  Suspense
+} from "react";
+
+// src/DepositFlow.tsx
+import { useState as useState7, useCallback as useCallback3, useMemo as useMemo6, useEffect as useEffect6, useRef as useRef4 } from "react";
+
+// src/components/steps/SetupStep.tsx
+import { useState, useEffect, useRef, useCallback } from "react";
+import { walletClientToAccount } from "@rhinestone/sdk";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+async function resolveSessionOwner(eoaAddress) {
+  const localOwner = loadSessionOwnerFromStorage(eoaAddress);
+  if (localOwner) {
+    return {
+      account: accountFromPrivateKey(localOwner.privateKey),
+      address: localOwner.address
+    };
+  }
+  const created = createSessionOwnerKey();
+  saveSessionOwnerToStorage(eoaAddress, created.privateKey, created.address);
+  return {
+    account: created.account,
+    address: created.address
+  };
+}
+function SetupStep({
+  walletClient,
+  address,
+  targetChain,
+  targetChainObj,
+  targetToken,
+  rhinestoneApiKey,
+  signerAddress,
+  sessionChainIds,
+  recipient,
+  forceRegister,
+  service,
+  onSetupComplete,
+  onError,
+  onConnected
+}) {
+  const [state, setState] = useState({ type: "idle" });
+  const setupInitiatedRef = useRef(false);
+  const runSetup = useCallback(async () => {
+    if (!address || !targetChainObj) {
+      return;
+    }
+    if (walletClient && !walletClient.account) {
+      return;
+    }
+    try {
+      setState({ type: "creating-account" });
+      const signerAccount = walletClient ? walletClientToAccount(walletClient) : createViewOnlyAccount(address);
+      const sessionOwner = await resolveSessionOwner(address);
+      const account = await createSmartAccount(
+        signerAccount,
+        sessionOwner.account,
+        rhinestoneApiKey
+      );
+      const smartAccount = getAccountAddress(account);
+      setState({ type: "checking" });
+      const checkResult = await service.checkAccount(smartAccount);
+      if (checkResult.isRegistered && !forceRegister) {
+        const targetMatches = checkResult.targetChain === targetChain && checkResult.targetToken?.toLowerCase() === targetToken.toLowerCase();
+        if (targetMatches) {
+          setState({ type: "ready", smartAccount });
+          onConnected?.(address, smartAccount);
+          onSetupComplete(smartAccount);
+          return;
+        }
+      }
+      setState({ type: "signing-session" });
+      const initData = getAccountInitData(account);
+      const sessionDetails = await getSessionDetails(
+        account,
+        targetChainObj,
+        signerAddress,
+        sessionOwner.account,
+        targetToken,
+        sessionChainIds
+      );
+      setState({ type: "registering" });
+      await service.registerAccount({
+        address: smartAccount,
+        accountParams: {
+          factory: initData.factory,
+          factoryData: initData.factoryData,
+          sessionDetails
+        },
+        eoaAddress: address,
+        sessionOwner: sessionOwner.address,
+        target: {
+          chain: targetChain,
+          token: targetToken,
+          ...recipient && { recipient }
+        }
+      });
+      setState({ type: "ready", smartAccount });
+      onConnected?.(address, smartAccount);
+      onSetupComplete(smartAccount);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Setup failed";
+      setState({ type: "error", message });
+      onError?.(message, "SETUP_ERROR");
+    }
+  }, [
+    address,
+    walletClient,
+    targetChainObj,
+    targetChain,
+    targetToken,
+    rhinestoneApiKey,
+    signerAddress,
+    sessionChainIds,
+    recipient,
+    forceRegister,
+    service,
+    onSetupComplete,
+    onError,
+    onConnected
+  ]);
+  useEffect(() => {
+    const hasWallet = walletClient ? Boolean(walletClient.account) : true;
+    if (address && hasWallet && targetChainObj && !setupInitiatedRef.current && state.type === "idle") {
+      setupInitiatedRef.current = true;
+      runSetup();
+    }
+  }, [address, walletClient, targetChainObj, state.type, runSetup]);
+  const handleRetry = () => {
+    setupInitiatedRef.current = false;
+    setState({ type: "idle" });
+  };
+  const renderStateMessage = () => {
+    switch (state.type) {
+      case "idle":
+        return "Preparing...";
+      case "checking":
+        return "Verifying your account...";
+      case "creating-account":
+        return "Preparing your deposit account...";
+      case "signing-session":
+        return "Authorizing your deposit session...";
+      case "registering":
+        return "Finalizing setup...";
+      case "ready":
+        return "Account ready!";
+      case "error":
+        return state.message;
+    }
+  };
+  const isLoading = state.type === "idle" || state.type === "checking" || state.type === "creating-account" || state.type === "signing-session" || state.type === "registering";
+  const isError = state.type === "error";
+  return /* @__PURE__ */ jsxs("div", { className: "rs-step", children: [
+    /* @__PURE__ */ jsxs("div", { className: "rs-loading-state", children: [
+      isLoading && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Spinner, { className: "rs-spinner--lg rs-text-accent" }),
+        /* @__PURE__ */ jsxs("div", { className: "rs-loading-text", children: [
+          /* @__PURE__ */ jsx("div", { className: "rs-loading-title", children: renderStateMessage() }),
+          /* @__PURE__ */ jsx("div", { className: "rs-loading-subtitle", children: "This may take a moment" })
+        ] })
+      ] }),
+      isError && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { className: "rs-step-icon rs-step-icon--error", children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                d: "M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z"
+              }
+            )
+          }
+        ) }),
+        /* @__PURE__ */ jsxs("div", { className: "rs-loading-text", children: [
+          /* @__PURE__ */ jsx("div", { className: "rs-loading-title rs-text-error", children: "Setup failed" }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "rs-loading-subtitle",
+              style: { maxWidth: 300, marginTop: 4 },
+              children: state.message
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    isError && /* @__PURE__ */ jsx("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx(Button, { onClick: handleRetry, variant: "default", fullWidth: true, children: "Try Again" }) })
+  ] });
+}
+
+// src/components/steps/AssetSelectStep.tsx
+import { useEffect as useEffect2, useMemo, useState as useState2 } from "react";
+import { formatUnits } from "viem";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function AssetSelectStep({
+  address,
+  publicClient,
+  defaultSourceChain,
+  defaultSourceToken,
+  service,
+  onContinue,
+  onTotalBalanceComputed
+}) {
+  const [assets, setAssets] = useState2([]);
+  const [selectedAssetId, setSelectedAssetId] = useState2(null);
+  const [loading, setLoading] = useState2(true);
+  const [error, setError] = useState2(null);
+  const defaultAssetId = useMemo(() => {
+    if (!defaultSourceChain || !defaultSourceToken) return null;
+    return getAssetId({
+      chainId: defaultSourceChain,
+      token: defaultSourceToken
+    });
+  }, [defaultSourceChain, defaultSourceToken]);
+  useEffect2(() => {
+    let active = true;
+    async function loadPortfolio() {
+      if (!address) {
+        setLoading(false);
+        return;
+      }
+      setLoading(true);
+      setError(null);
+      try {
+        const portfolio = await service.fetchPortfolio(address);
+        if (!active) return;
+        const portfolioAssets = portfolioToAssets(portfolio.tokens);
+        setAssets(portfolioAssets);
+        const hasNative = portfolioAssets.some(
+          (asset) => asset.token.toLowerCase() === NATIVE_TOKEN_ADDRESS
+        );
+        if (!hasNative) {
+          const nativeAssets = await fetchNativeAssets(
+            address,
+            publicClient,
+            portfolioAssets
+          );
+          if (!active) return;
+          if (nativeAssets.length > 0) {
+            setAssets((prev) => mergeAssets(prev, nativeAssets));
+          }
+        }
+      } catch (err) {
+        if (!active) return;
+        setError(
+          err instanceof Error ? err.message : "Failed to load portfolio"
+        );
+      } finally {
+        if (active) setLoading(false);
+      }
+    }
+    loadPortfolio();
+    return () => {
+      active = false;
+    };
+  }, [address, publicClient, service]);
+  useEffect2(() => {
+    if (!defaultAssetId || selectedAssetId) return;
+    if (assets.some((asset) => asset.id === defaultAssetId)) {
+      setSelectedAssetId(defaultAssetId);
+    }
+  }, [assets, defaultAssetId, selectedAssetId]);
+  useEffect2(() => {
+    const total = assets.reduce(
+      (sum, asset) => sum + (asset.balanceUsd ?? 0),
+      0
+    );
+    onTotalBalanceComputed?.(total);
+  }, [assets, onTotalBalanceComputed]);
+  const rows = useMemo(() => {
+    return assets.filter((a) => {
+      try {
+        return BigInt(a.balance ?? "0") > BigInt(0);
+      } catch {
+        return false;
+      }
+    }).sort((a, b) => {
+      const usdA = a.balanceUsd ?? 0;
+      const usdB = b.balanceUsd ?? 0;
+      if (usdA !== usdB) return usdB - usdA;
+      const balA = BigInt(a.balance ?? "0");
+      const balB = BigInt(b.balance ?? "0");
+      if (balB > balA) return 1;
+      if (balB < balA) return -1;
+      return 0;
+    });
+  }, [assets]);
+  const selectedAsset = selectedAssetId && assets.find((asset) => asset.id === selectedAssetId);
+  const formatBalance = (asset) => {
+    if (!asset.balance) return "--";
+    try {
+      const raw = formatUnits(BigInt(asset.balance), asset.decimals);
+      const numeric = Number(raw);
+      if (!Number.isFinite(numeric)) return raw;
+      return tokenFormatter.format(numeric);
+    } catch {
+      return asset.balance;
+    }
+  };
+  return /* @__PURE__ */ jsxs2("div", { className: "rs-step", children: [
+    /* @__PURE__ */ jsx2("div", { style: { padding: "12px 12px 4px" }, children: /* @__PURE__ */ jsx2("div", { className: "rs-step-title", children: "Select source asset" }) }),
+    /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        className: "rs-step-body",
+        style: { paddingTop: 4, overflow: "auto", maxHeight: 340 },
+        children: [
+          loading && /* @__PURE__ */ jsxs2("div", { className: "rs-loading-state", style: { padding: "40px 12px" }, children: [
+            /* @__PURE__ */ jsx2(Spinner, { className: "rs-text-tertiary" }),
+            /* @__PURE__ */ jsx2("span", { className: "rs-text-sm rs-text-tertiary", children: "Loading balances" })
+          ] }),
+          error && /* @__PURE__ */ jsx2("div", { className: "rs-alert rs-alert--error", children: /* @__PURE__ */ jsx2("span", { className: "rs-alert-text", children: error }) }),
+          !loading && !error && rows.length === 0 && /* @__PURE__ */ jsxs2("div", { className: "rs-empty-state", children: [
+            /* @__PURE__ */ jsx2(
+              "svg",
+              {
+                className: "rs-empty-icon",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "1.5",
+                children: /* @__PURE__ */ jsx2(
+                  "path",
+                  {
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    d: "M21 12a2.25 2.25 0 00-2.25-2.25H15a3 3 0 11-6 0H5.25A2.25 2.25 0 003 12m18 0v6a2.25 2.25 0 01-2.25 2.25H5.25A2.25 2.25 0 013 18v-6m18 0V9M3 12V9m18 0a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 9m18 0V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v3"
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx2("div", { className: "rs-empty-text", children: "No funds in connected wallet" }),
+            /* @__PURE__ */ jsxs2("div", { className: "rs-empty-address", children: [
+              address.slice(0, 6),
+              "...",
+              address.slice(-4)
+            ] })
+          ] }),
+          !loading && !error && rows.length > 0 && /* @__PURE__ */ jsx2("div", { className: "rs-asset-list", children: rows.map((asset) => {
+            const isSelected = selectedAssetId === asset.id;
+            const tokenAmount = formatBalance(asset);
+            const badge = getChainBadge(asset.chainId);
+            const tokenIcon = getTokenIcon(asset.symbol);
+            const chainIcon = getChainIcon(asset.chainId);
+            return /* @__PURE__ */ jsxs2(
+              "button",
+              {
+                type: "button",
+                onClick: () => setSelectedAssetId(asset.id),
+                className: `rs-asset-row ${isSelected ? "rs-asset-row--selected" : ""}`,
+                style: { textAlign: "left" },
+                children: [
+                  /* @__PURE__ */ jsxs2("div", { className: "rs-asset-info", children: [
+                    /* @__PURE__ */ jsxs2("div", { className: "rs-asset-icon-wrapper", children: [
+                      tokenIcon ? /* @__PURE__ */ jsx2(
+                        "img",
+                        {
+                          src: tokenIcon,
+                          alt: asset.symbol,
+                          className: "rs-asset-icon",
+                          style: { background: "transparent" }
+                        }
+                      ) : /* @__PURE__ */ jsx2("div", { className: "rs-asset-icon", children: asset.symbol.slice(0, 4) }),
+                      chainIcon ? /* @__PURE__ */ jsx2(
+                        "img",
+                        {
+                          src: chainIcon,
+                          alt: getChainName(asset.chainId),
+                          className: "rs-asset-chain-badge"
+                        }
+                      ) : /* @__PURE__ */ jsx2(
+                        "div",
+                        {
+                          className: "rs-asset-chain-badge",
+                          style: {
+                            backgroundColor: badge.bg,
+                            color: badge.color
+                          },
+                          children: badge.shortLabel.charAt(0)
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsxs2("div", { children: [
+                      /* @__PURE__ */ jsxs2("div", { className: "rs-asset-name", children: [
+                        asset.symbol,
+                        /* @__PURE__ */ jsxs2("span", { className: "rs-asset-chain", children: [
+                          " ",
+                          "on ",
+                          getChainName(asset.chainId)
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsxs2("div", { className: "rs-asset-balance-small", children: [
+                        tokenAmount,
+                        " ",
+                        asset.symbol
+                      ] })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx2("div", { className: "rs-asset-balance", children: asset.balanceUsd !== void 0 ? currencyFormatter.format(asset.balanceUsd) : tokenAmount !== "--" ? `${tokenAmount} ${asset.symbol}` : "--" })
+                ]
+              },
+              asset.id
+            );
+          }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx2("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx2(
+      Button,
+      {
+        onClick: () => selectedAsset && onContinue(selectedAsset),
+        disabled: !selectedAsset,
+        fullWidth: true,
+        children: "Continue"
+      }
+    ) }),
+    /* @__PURE__ */ jsx2(PoweredBy, {})
+  ] });
+}
+async function fetchNativeAssets(address, publicClient, existing) {
+  const existingIds = new Set(existing.map((asset) => asset.id));
+  const connectedChainId = publicClient.chain?.id;
+  if (!connectedChainId) return [];
+  if (!SOURCE_CHAINS.some((chain) => chain.id === connectedChainId)) return [];
+  const id = getAssetId({
+    chainId: connectedChainId,
+    token: NATIVE_TOKEN_ADDRESS
+  });
+  if (existingIds.has(id)) return [];
+  try {
+    const balance = await publicClient.getBalance({ address });
+    return [
+      {
+        id,
+        chainId: connectedChainId,
+        token: NATIVE_TOKEN_ADDRESS,
+        symbol: "ETH",
+        name: "Ethereum",
+        decimals: 18,
+        balance: balance.toString()
+      }
+    ];
+  } catch {
+    return [];
+  }
+}
+function mergeAssets(existing, incoming) {
+  if (incoming.length === 0) return existing;
+  const existingIds = new Set(existing.map((asset) => asset.id));
+  const merged = [...existing];
+  for (const asset of incoming) {
+    if (!existingIds.has(asset.id)) {
+      merged.push(asset);
+    }
+  }
+  return merged;
+}
+
+// src/components/steps/AmountStep.tsx
+import { useEffect as useEffect3, useMemo as useMemo2, useState as useState3, useRef as useRef2 } from "react";
+import { erc20Abi, formatUnits as formatUnits2, parseUnits } from "viem";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function AmountStep({
+  walletClient,
+  publicClient,
+  address,
+  balanceAddress,
+  asset,
+  defaultAmount,
+  switchChain,
+  targetChain,
+  targetToken,
+  uiConfig,
+  tokenPriceUsdOverride,
+  onBalanceUsdChange,
+  onContinue
+}) {
+  const [amountUsd, setAmountUsd] = useState3("");
+  const [balance, setBalance] = useState3(null);
+  const [error, setError] = useState3(null);
+  const [isSwitching, setIsSwitching] = useState3(false);
+  const hasAttemptedSwitch = useRef2(false);
+  const chainMismatch = Boolean(
+    walletClient?.chain?.id && walletClient.chain.id !== asset.chainId
+  );
+  const tokenPriceUsd = useMemo2(() => {
+    if (tokenPriceUsdOverride !== void 0) return tokenPriceUsdOverride;
+    if (asset.balanceUsd === void 0 || !asset.balance) return null;
+    try {
+      const balanceUnits = Number(
+        formatUnits2(BigInt(asset.balance), asset.decimals)
+      );
+      if (!Number.isFinite(balanceUnits) || balanceUnits <= 0) return null;
+      return asset.balanceUsd / balanceUnits;
+    } catch {
+      return null;
+    }
+  }, [tokenPriceUsdOverride, asset.balanceUsd, asset.balance, asset.decimals]);
+  useEffect3(() => {
+    let active = true;
+    async function fetchBalance() {
+      const balanceTarget = balanceAddress ?? address;
+      if (!balanceTarget || !publicClient) return;
+      try {
+        const bal = isNativeAsset(asset) ? await publicClient.getBalance({ address: balanceTarget }) : await publicClient.readContract({
+          address: asset.token,
+          abi: erc20Abi,
+          functionName: "balanceOf",
+          args: [balanceTarget]
+        });
+        if (active) {
+          setBalance(bal);
+        }
+      } catch {
+        if (active) {
+          setBalance(null);
+        }
+      }
+    }
+    fetchBalance();
+    return () => {
+      active = false;
+    };
+  }, [address, balanceAddress, publicClient, asset]);
+  useEffect3(() => {
+    if (chainMismatch && switchChain && !hasAttemptedSwitch.current) {
+      hasAttemptedSwitch.current = true;
+      setIsSwitching(true);
+      switchChain(asset.chainId).catch((err) => {
+        const message = err instanceof Error ? err.message : "Failed to switch chain";
+        setError(message);
+      }).finally(() => {
+        setIsSwitching(false);
+      });
+    }
+  }, [chainMismatch, switchChain, asset.chainId]);
+  useEffect3(() => {
+    if (defaultAmount && tokenPriceUsd !== null && !amountUsd) {
+      const parsed = Number(defaultAmount);
+      if (Number.isFinite(parsed) && parsed > 0) {
+        const usdValue = parsed * tokenPriceUsd;
+        setAmountUsd(usdValue.toFixed(2));
+      }
+    }
+  }, [defaultAmount, tokenPriceUsd, amountUsd]);
+  const balanceUsd = useMemo2(() => {
+    if (balance === null || tokenPriceUsd === null) return null;
+    try {
+      const balanceUnits = Number(formatUnits2(balance, asset.decimals));
+      if (!Number.isFinite(balanceUnits)) return null;
+      return balanceUnits * tokenPriceUsd;
+    } catch {
+      return null;
+    }
+  }, [balance, tokenPriceUsd, asset.decimals]);
+  useEffect3(() => {
+    if (balanceUsd === null) return;
+    onBalanceUsdChange?.(balanceUsd);
+  }, [balanceUsd, onBalanceUsdChange]);
+  const formattedBalance = useMemo2(() => {
+    if (balance === null) return "...";
+    try {
+      const raw = formatUnits2(balance, asset.decimals);
+      const numeric = Number(raw);
+      if (!Number.isFinite(numeric)) return raw;
+      return tokenFormatter.format(numeric);
+    } catch {
+      return "...";
+    }
+  }, [balance, asset.decimals]);
+  const tokenAmount = useMemo2(() => {
+    if (!amountUsd || tokenPriceUsd === null || tokenPriceUsd === 0)
+      return null;
+    const usd = Number(amountUsd);
+    if (!Number.isFinite(usd) || usd <= 0) return null;
+    return usd / tokenPriceUsd;
+  }, [amountUsd, tokenPriceUsd]);
+  const formattedTokenAmount = useMemo2(() => {
+    if (tokenAmount === null) return "0.00";
+    return tokenFormatter.format(tokenAmount);
+  }, [tokenAmount]);
+  const targetSymbol = getTokenSymbol(targetToken, targetChain);
+  const handlePresetClick = (percentage) => {
+    if (balanceUsd === null) return;
+    const value = balanceUsd * percentage / 100;
+    setAmountUsd(value.toFixed(2));
+    if (error) setError(null);
+  };
+  const handleContinue = () => {
+    const usdValue = parseFloat(amountUsd);
+    if (isNaN(usdValue) || usdValue <= 0) {
+      setError("Please enter a valid amount");
+      return;
+    }
+    if (uiConfig?.maxDepositUsd && usdValue > uiConfig.maxDepositUsd) {
+      setError(
+        `Maximum deposit is ${currencyFormatter.format(uiConfig.maxDepositUsd)}`
+      );
+      return;
+    }
+    if (uiConfig?.minDepositUsd && usdValue < uiConfig.minDepositUsd) {
+      setError(
+        `Minimum deposit is ${currencyFormatter.format(uiConfig.minDepositUsd)}`
+      );
+      return;
+    }
+    if (tokenPriceUsd === null || tokenPriceUsd === 0) {
+      setError("Unable to determine token price");
+      return;
+    }
+    const tokenAmountValue = usdValue / tokenPriceUsd;
+    let tokenAmountStr = tokenAmountValue.toString();
+    let amountInUnits;
+    try {
+      amountInUnits = parseUnits(tokenAmountStr, asset.decimals);
+    } catch {
+      setError("Please enter a valid amount");
+      return;
+    }
+    if (balance !== null && amountInUnits > balance) {
+      amountInUnits = balance;
+      tokenAmountStr = formatUnits2(balance, asset.decimals);
+    }
+    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);
+    }
+  };
+  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: /* @__PURE__ */ jsx3(
+          "input",
+          {
+            type: "text",
+            inputMode: "decimal",
+            className: "rs-amount-input-large",
+            placeholder: "$0.00",
+            value: amountUsd ? `$${amountUsd}` : "",
+            onChange: (e) => {
+              const raw = e.target.value.replace(/[^0-9.]/g, "");
+              const parts = raw.split(".");
+              if (parts.length > 2) return;
+              setAmountUsd(raw);
+              if (error) setError(null);
+            },
+            autoFocus: true
+          }
+        ) }),
+        /* @__PURE__ */ jsxs3("div", { className: "rs-amount-token-value", children: [
+          formattedTokenAmount,
+          " ",
+          asset.symbol
+        ] }),
+        /* @__PURE__ */ jsx3("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs3("span", { className: "rs-amount-available-value", children: [
+          formattedBalance,
+          " ",
+          asset.symbol,
+          " available",
+          balanceUsd !== null && /* @__PURE__ */ jsxs3("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
+            " ",
+            "(",
+            currencyFormatter.format(balanceUsd),
+            ")"
+          ] })
+        ] }) })
+      ] }),
+      /* @__PURE__ */ jsx3(
+        "div",
+        {
+          style: { display: "flex", justifyContent: "center", marginTop: 16 },
+          children: /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill", children: [
+            /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-side", children: [
+              /* @__PURE__ */ jsx3("span", { className: "rs-flow-pill-label", children: "You send" }),
+              /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-token", children: [
+                /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-token-icon-wrapper", children: [
+                  /* @__PURE__ */ jsx3("div", { className: "rs-flow-pill-token-icon", children: getTokenIcon(asset.symbol) ? /* @__PURE__ */ jsx3(
+                    "img",
+                    {
+                      src: getTokenIcon(asset.symbol),
+                      alt: asset.symbol
+                    }
+                  ) : asset.symbol.slice(0, 2) }),
+                  (() => {
+                    const chainIcon = getChainIcon(asset.chainId);
+                    if (chainIcon) {
+                      return /* @__PURE__ */ jsx3(
+                        "img",
+                        {
+                          src: chainIcon,
+                          alt: getChainName(asset.chainId),
+                          className: "rs-flow-pill-chain-badge"
+                        }
+                      );
+                    }
+                    const badge = getChainBadge(asset.chainId);
+                    return /* @__PURE__ */ jsx3(
+                      "div",
+                      {
+                        className: "rs-flow-pill-chain-badge",
+                        style: {
+                          backgroundColor: badge.bg,
+                          color: badge.color
+                        },
+                        children: badge.shortLabel.charAt(0)
+                      }
+                    );
+                  })()
+                ] }),
+                /* @__PURE__ */ jsx3("span", { className: "rs-flow-pill-token-symbol", children: asset.symbol })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx3("div", { className: "rs-flow-pill-arrow", children: /* @__PURE__ */ jsx3(
+              "svg",
+              {
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                children: /* @__PURE__ */ jsx3(
+                  "path",
+                  {
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    d: "M13.5 4.5L21 12m0 0l-7.5 7.5M21 12H3"
+                  }
+                )
+              }
+            ) }),
+            /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-side", children: [
+              /* @__PURE__ */ jsx3("span", { className: "rs-flow-pill-label", children: "You receive" }),
+              /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-token", children: [
+                /* @__PURE__ */ jsxs3("div", { className: "rs-flow-pill-token-icon-wrapper", children: [
+                  /* @__PURE__ */ jsx3("div", { className: "rs-flow-pill-token-icon", children: getTokenIcon(targetSymbol) ? /* @__PURE__ */ jsx3(
+                    "img",
+                    {
+                      src: getTokenIcon(targetSymbol),
+                      alt: targetSymbol
+                    }
+                  ) : targetSymbol.slice(0, 2) }),
+                  (() => {
+                    const chainIcon = getChainIcon(targetChain);
+                    if (chainIcon) {
+                      return /* @__PURE__ */ jsx3(
+                        "img",
+                        {
+                          src: chainIcon,
+                          alt: getChainName(targetChain),
+                          className: "rs-flow-pill-chain-badge"
+                        }
+                      );
+                    }
+                    const badge = getChainBadge(targetChain);
+                    return /* @__PURE__ */ jsx3(
+                      "div",
+                      {
+                        className: "rs-flow-pill-chain-badge",
+                        style: {
+                          backgroundColor: badge.bg,
+                          color: badge.color
+                        },
+                        children: badge.shortLabel.charAt(0)
+                      }
+                    );
+                  })()
+                ] }),
+                /* @__PURE__ */ jsx3("span", { className: "rs-flow-pill-token-symbol", children: targetSymbol })
+              ] })
+            ] })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs3("div", { className: "rs-amount-presets", children: [
+        [25, 50, 75].map((pct) => /* @__PURE__ */ jsxs3(
+          "button",
+          {
+            type: "button",
+            className: "rs-amount-preset-btn",
+            onClick: () => handlePresetClick(pct),
+            disabled: balanceUsd === null,
+            children: [
+              pct,
+              "%"
+            ]
+          },
+          pct
+        )),
+        /* @__PURE__ */ jsx3(
+          "button",
+          {
+            type: "button",
+            className: "rs-amount-preset-btn",
+            onClick: () => handlePresetClick(100),
+            disabled: balanceUsd === null,
+            children: "Max"
+          }
+        )
+      ] }),
+      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"
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsxs3("div", { className: "rs-amount-error", children: [
+        /* @__PURE__ */ jsx3(
+          "svg",
+          {
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            style: { width: 16, height: 16, flexShrink: 0 },
+            children: /* @__PURE__ */ jsx3(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                d: "M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx3("span", { children: error })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx3("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx3(
+      Button,
+      {
+        onClick: handleContinue,
+        fullWidth: true,
+        disabled: !amountUsd || chainMismatch,
+        children: "Continue"
+      }
+    ) }),
+    /* @__PURE__ */ jsx3(PoweredBy, {})
+  ] });
+}
+
+// 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 { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var STABLECOIN_SYMBOLS = /* @__PURE__ */ new Set(["USDC", "USDT", "DAI"]);
+function ConfirmStep({
+  walletClient,
+  address,
+  smartAccount,
+  recipient,
+  asset,
+  amount,
+  balance,
+  targetChain,
+  targetToken,
+  switchChain,
+  onConfirm,
+  onError,
+  onDepositSubmitted
+}) {
+  const [isSubmitting, setIsSubmitting] = useState4(false);
+  const [error, setError] = useState4(null);
+  const [isSwitching, setIsSwitching] = useState4(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;
+    }
+    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]);
+  const receiveAmount = sameRoute ? formattedReceiveAmount : `~ ${formattedReceiveAmount}`;
+  const handleConfirm = async () => {
+    if (!address || !walletClient) {
+      setError("Wallet not connected");
+      return;
+    }
+    if (chainMismatch) {
+      setError(`Switch to ${getChainName(asset.chainId)} to sign`);
+      return;
+    }
+    const parsedAmount = parseFloat(amount);
+    if (isNaN(parsedAmount) || parsedAmount <= 0) {
+      setError("Please enter a valid amount");
+      return;
+    }
+    let amountUnits;
+    try {
+      amountUnits = parseUnits2(amount, asset.decimals);
+    } catch {
+      setError("Please enter a valid amount");
+      return;
+    }
+    if (balance !== void 0 && amountUnits > balance) {
+      setError("Insufficient balance");
+      return;
+    }
+    setError(null);
+    setIsSubmitting(true);
+    try {
+      const account = walletClient.account;
+      const chain = walletClient.chain;
+      if (!account || !chain) {
+        throw new Error("Wallet not properly connected");
+      }
+      const transferTo = sameRoute ? recipient : smartAccount;
+      const hash = isNativeAsset(asset) ? await walletClient.sendTransaction({
+        account,
+        chain,
+        to: transferTo,
+        value: amountUnits
+      }) : await walletClient.writeContract({
+        account,
+        chain,
+        address: asset.token,
+        abi: erc20Abi2,
+        functionName: "transfer",
+        args: [transferTo, amountUnits]
+      });
+      onDepositSubmitted?.(hash, asset.chainId, amountUnits.toString());
+      onConfirm(hash, asset.chainId, amountUnits.toString(), asset.token);
+    } catch (err) {
+      const raw = err instanceof Error ? err.message : "Transfer failed";
+      const message = formatUserError(raw);
+      setError(message);
+      onError?.(message, "TRANSFER_ERROR");
+    } finally {
+      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: [
+      /* @__PURE__ */ jsxs4("div", { className: "rs-card", children: [
+        /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "Source" }),
+          /* @__PURE__ */ jsxs4(
+            "span",
+            {
+              className: "rs-card-value",
+              style: { display: "flex", alignItems: "center", gap: 8 },
+              children: [
+                getChainIcon(asset.chainId) && /* @__PURE__ */ jsx4(
+                  "img",
+                  {
+                    src: getChainIcon(asset.chainId),
+                    alt: "",
+                    style: { width: 16, height: 16, borderRadius: "50%" }
+                  }
+                ),
+                getChainName(asset.chainId)
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "Destination" }),
+          /* @__PURE__ */ jsxs4(
+            "span",
+            {
+              className: "rs-card-value",
+              style: { display: "flex", alignItems: "center", gap: 8 },
+              children: [
+                getChainIcon(targetChain) && /* @__PURE__ */ jsx4(
+                  "img",
+                  {
+                    src: getChainIcon(targetChain),
+                    alt: "",
+                    style: { width: 16, height: 16, borderRadius: "50%" }
+                  }
+                ),
+                getChainName(targetChain)
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "Estimated time" }),
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-value", children: "< 1 min" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs4("div", { className: "rs-card", children: [
+        /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "You send" }),
+          /* @__PURE__ */ jsxs4(
+            "span",
+            {
+              className: "rs-card-value",
+              style: { display: "flex", alignItems: "center", gap: 6 },
+              children: [
+                getTokenIcon(asset.symbol) && /* @__PURE__ */ jsx4(
+                  "img",
+                  {
+                    src: getTokenIcon(asset.symbol),
+                    alt: "",
+                    style: { width: 16, height: 16, borderRadius: "50%" }
+                  }
+                ),
+                formattedAmount,
+                " ",
+                asset.symbol
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
+          /* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "You receive" }),
+          /* @__PURE__ */ jsxs4(
+            "span",
+            {
+              className: "rs-card-value",
+              style: { display: "flex", alignItems: "center", gap: 6 },
+              children: [
+                getTokenIcon(targetSymbol) && /* @__PURE__ */ jsx4(
+                  "img",
+                  {
+                    src: getTokenIcon(targetSymbol),
+                    alt: "",
+                    style: { width: 16, height: 16, borderRadius: "50%" }
+                  }
+                ),
+                receiveAmount,
+                " ",
+                targetSymbol
+              ]
+            }
+          )
+        ] }),
+        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"
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsxs4("div", { className: "rs-alert rs-alert--error", children: [
+        /* @__PURE__ */ jsx4(
+          "svg",
+          {
+            className: "rs-alert-icon",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            children: /* @__PURE__ */ jsx4(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                d: "M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx4("span", { className: "rs-alert-text", children: error })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx4("div", { className: "rs-step-footer", children: /* @__PURE__ */ jsx4(
+      Button,
+      {
+        onClick: handleConfirm,
+        loading: isSubmitting,
+        disabled: chainMismatch || !amount || Number(amount) <= 0,
+        fullWidth: true,
+        children: "Confirm Order"
+      }
+    ) }),
+    /* @__PURE__ */ jsx4(PoweredBy, {})
+  ] });
+}
+
+// src/components/steps/DepositAddressStep.tsx
+import { useState as useState6, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as useMemo5 } from "react";
+
+// src/components/ui/QRCode.tsx
+import { useEffect as useEffect4, useMemo as useMemo4, 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(() => {
+    let mounted = true;
+    void import("qrcode-generator").then((mod) => {
+      if (mounted) {
+        setCreateQrCode(() => mod.default);
+      }
+    }).catch(() => {
+      if (mounted) {
+        setCreateQrCode(null);
+      }
+    });
+    return () => {
+      mounted = false;
+    };
+  }, []);
+  const svgContent = useMemo4(() => {
+    if (!createQrCode) {
+      return null;
+    }
+    const qr = createQrCode(0, "M");
+    qr.addData(value);
+    qr.make();
+    const moduleCount = qr.getModuleCount();
+    const cellSize = size / moduleCount;
+    const paths = [];
+    const iconCenterSize = iconSrc ? moduleCount * 0.22 : 0;
+    const iconStart = (moduleCount - iconCenterSize) / 2;
+    const iconEnd = (moduleCount + iconCenterSize) / 2;
+    for (let row = 0; row < moduleCount; row++) {
+      for (let col = 0; col < moduleCount; col++) {
+        if (!qr.isDark(row, col)) continue;
+        if (iconSrc && row >= iconStart && row < iconEnd && col >= iconStart && col < iconEnd) {
+          continue;
+        }
+        const x = col * cellSize;
+        const y = row * cellSize;
+        paths.push(`M${x},${y}h${cellSize}v${cellSize}h${-cellSize}z`);
+      }
+    }
+    return { paths: paths.join(""), moduleCount, cellSize };
+  }, [createQrCode, value, size, iconSrc]);
+  const iconSize = size * 0.22;
+  const iconOffset = (size - iconSize) / 2;
+  return /* @__PURE__ */ jsxs5(
+    "svg",
+    {
+      viewBox: `0 0 ${size} ${size}`,
+      width: size,
+      height: size,
+      className,
+      role: "img",
+      "aria-label": "QR Code",
+      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(Fragment2, { children: [
+          /* @__PURE__ */ jsx5(
+            "rect",
+            {
+              x: iconOffset - 4,
+              y: iconOffset - 4,
+              width: iconSize + 8,
+              height: iconSize + 8,
+              fill: "white",
+              rx: 8
+            }
+          ),
+          /* @__PURE__ */ jsx5(
+            "image",
+            {
+              href: iconSrc,
+              x: iconOffset,
+              y: iconOffset,
+              width: iconSize,
+              height: iconSize
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+QRCode.displayName = "QRCode";
+
+// src/components/steps/DepositAddressStep.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var POLL_INTERVAL_MS = 4e3;
+function isRecord(value) {
+  return typeof value === "object" && value !== null;
+}
+function asNumber(value) {
+  if (typeof value === "number" && Number.isFinite(value)) return value;
+  if (typeof value === "string" && value.trim() !== "") {
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : void 0;
+  }
+  return void 0;
+}
+function asAmount(value) {
+  if (typeof value === "string") return value;
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return value.toString();
+  }
+  return void 0;
+}
+function asAddress(value) {
+  if (typeof value !== "string") return void 0;
+  return /^0x[a-fA-F0-9]{40}$/.test(value) ? value : void 0;
+}
+function getDepositEventDetails(event) {
+  if (!event?.type || !isRecord(event.data)) return {};
+  if (event.type === "deposit-received") {
+    return {
+      chainId: asNumber(event.data.chain),
+      amount: asAmount(event.data.amount),
+      token: asAddress(event.data.token)
+    };
+  }
+  if (event.type === "bridge-started") {
+    const source = isRecord(event.data.source) ? event.data.source : void 0;
+    return {
+      chainId: asNumber(source?.chain),
+      token: asAddress(source?.asset)
+    };
+  }
+  return {};
+}
+function DepositAddressStep({
+  smartAccount,
+  service,
+  onDepositDetected,
+  onError
+}) {
+  const supportedChainIds = useMemo5(() => 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(
+    () => getSupportedTokenSymbolsForChain(sourceChainId),
+    [sourceChainId]
+  );
+  const defaultToken = tokensForChain.includes("USDC") ? "USDC" : tokensForChain[0] ?? "USDC";
+  const [sourceTokenSymbol, setSourceTokenSymbol] = useState6(defaultToken);
+  useEffect5(() => {
+    if (!tokensForChain.includes(sourceTokenSymbol)) {
+      setSourceTokenSymbol(tokensForChain[0] ?? "USDC");
+    }
+  }, [tokensForChain, sourceTokenSymbol]);
+  const [copied, setCopied] = useState6(false);
+  const [pollingError, setPollingError] = useState6(null);
+  const [chainDropdownOpen, setChainDropdownOpen] = useState6(false);
+  const [tokenDropdownOpen, setTokenDropdownOpen] = useState6(false);
+  const depositHandledRef = useRef3(false);
+  const sourceSelectionRef = useRef3({
+    chainId: defaultChainId,
+    tokenSymbol: defaultToken
+  });
+  useEffect5(() => {
+    sourceSelectionRef.current = {
+      chainId: sourceChainId,
+      tokenSymbol: sourceTokenSymbol
+    };
+  }, [sourceChainId, sourceTokenSymbol]);
+  const handleCopy = useCallback2(async () => {
+    try {
+      await navigator.clipboard.writeText(smartAccount);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch {
+      const textarea = document.createElement("textarea");
+      textarea.value = smartAccount;
+      textarea.style.position = "fixed";
+      textarea.style.opacity = "0";
+      document.body.appendChild(textarea);
+      textarea.select();
+      document.execCommand("copy");
+      document.body.removeChild(textarea);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    }
+  }, [smartAccount]);
+  useEffect5(() => {
+    depositHandledRef.current = false;
+    setPollingError(null);
+    let timeoutId;
+    let cancelled = false;
+    let baselineTxHash = void 0;
+    async function poll() {
+      if (cancelled || depositHandledRef.current) return;
+      try {
+        const status = await service.fetchLatestStatus(smartAccount);
+        if (cancelled || depositHandledRef.current) return;
+        const event = status.lastEvent;
+        const eventTxHash = isDepositEvent(event) ? getEventTxHash(event)?.toLowerCase() ?? null : null;
+        if (baselineTxHash === void 0) {
+          baselineTxHash = eventTxHash;
+        } else if (eventTxHash && eventTxHash !== baselineTxHash) {
+          const details = getDepositEventDetails(event);
+          const fallback = sourceSelectionRef.current;
+          const chainId = details.chainId ?? fallback.chainId;
+          const amount = details.amount ?? "0";
+          const token = details.token ?? getTokenAddress(fallback.tokenSymbol, fallback.chainId);
+          if (token) {
+            depositHandledRef.current = true;
+            onDepositDetected(eventTxHash, chainId, amount, token);
+            return;
+          }
+        }
+        setPollingError(null);
+      } catch (err) {
+        if (!cancelled) {
+          const msg = err instanceof Error ? err.message : "Failed to check status";
+          setPollingError(msg);
+          onError?.(msg, "STATUS_POLL_ERROR");
+        }
+      }
+      if (!cancelled && !depositHandledRef.current) {
+        timeoutId = setTimeout(poll, POLL_INTERVAL_MS);
+      }
+    }
+    poll();
+    return () => {
+      cancelled = true;
+      clearTimeout(timeoutId);
+    };
+  }, [smartAccount, service, onDepositDetected, onError]);
+  const chainIconSrc = getChainIcon(sourceChainId);
+  return /* @__PURE__ */ jsxs6("div", { className: "rs-step", children: [
+    /* @__PURE__ */ jsx6("div", { className: "rs-step-body", children: /* @__PURE__ */ jsxs6("div", { className: "rs-deposit-address", children: [
+      /* @__PURE__ */ jsxs6("div", { className: "rs-deposit-address-selectors", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "rs-deposit-address-dropdown", children: [
+          /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-dropdown-label", children: "Supported token" }),
+          /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              className: "rs-deposit-address-dropdown-trigger",
+              onClick: () => {
+                setTokenDropdownOpen(!tokenDropdownOpen);
+                setChainDropdownOpen(false);
+              },
+              children: [
+                getTokenIcon(sourceTokenSymbol) && /* @__PURE__ */ jsx6(
+                  "img",
+                  {
+                    src: getTokenIcon(sourceTokenSymbol),
+                    alt: "",
+                    className: "rs-deposit-address-dropdown-icon"
+                  }
+                ),
+                /* @__PURE__ */ jsx6("span", { children: sourceTokenSymbol }),
+                /* @__PURE__ */ jsx6(
+                  "svg",
+                  {
+                    className: "rs-deposit-address-dropdown-chevron",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    children: /* @__PURE__ */ jsx6(
+                      "path",
+                      {
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round",
+                        d: "M19.5 8.25l-7.5 7.5-7.5-7.5"
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          tokenDropdownOpen && /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-dropdown-menu", children: tokensForChain.map((symbol) => /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              className: `rs-deposit-address-dropdown-item ${symbol === sourceTokenSymbol ? "rs-deposit-address-dropdown-item--active" : ""}`,
+              onClick: () => {
+                setSourceTokenSymbol(symbol);
+                setTokenDropdownOpen(false);
+              },
+              children: [
+                getTokenIcon(symbol) && /* @__PURE__ */ jsx6(
+                  "img",
+                  {
+                    src: getTokenIcon(symbol),
+                    alt: "",
+                    className: "rs-deposit-address-dropdown-icon"
+                  }
+                ),
+                /* @__PURE__ */ jsx6("span", { children: symbol })
+              ]
+            },
+            symbol
+          )) })
+        ] }),
+        /* @__PURE__ */ jsxs6("div", { className: "rs-deposit-address-dropdown", children: [
+          /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-dropdown-label", children: "Supported chain" }),
+          /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              className: "rs-deposit-address-dropdown-trigger",
+              onClick: () => {
+                setChainDropdownOpen(!chainDropdownOpen);
+                setTokenDropdownOpen(false);
+              },
+              children: [
+                getChainIcon(sourceChainId) && /* @__PURE__ */ jsx6(
+                  "img",
+                  {
+                    src: getChainIcon(sourceChainId),
+                    alt: "",
+                    className: "rs-deposit-address-dropdown-icon"
+                  }
+                ),
+                /* @__PURE__ */ jsx6("span", { children: getChainName(sourceChainId) }),
+                /* @__PURE__ */ jsx6(
+                  "svg",
+                  {
+                    className: "rs-deposit-address-dropdown-chevron",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    children: /* @__PURE__ */ jsx6(
+                      "path",
+                      {
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round",
+                        d: "M19.5 8.25l-7.5 7.5-7.5-7.5"
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          chainDropdownOpen && /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-dropdown-menu", children: supportedChainIds.map((chainId) => /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              className: `rs-deposit-address-dropdown-item ${chainId === sourceChainId ? "rs-deposit-address-dropdown-item--active" : ""}`,
+              onClick: () => {
+                setSourceChainId(chainId);
+                setChainDropdownOpen(false);
+              },
+              children: [
+                getChainIcon(chainId) && /* @__PURE__ */ jsx6(
+                  "img",
+                  {
+                    src: getChainIcon(chainId),
+                    alt: "",
+                    className: "rs-deposit-address-dropdown-icon"
+                  }
+                ),
+                /* @__PURE__ */ jsx6("span", { children: getChainName(chainId) })
+              ]
+            },
+            chainId
+          )) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-qr", children: /* @__PURE__ */ jsx6(QRCode, { value: smartAccount, size: 200, iconSrc: chainIconSrc }) }),
+      /* @__PURE__ */ jsxs6("div", { className: "rs-deposit-address-info", children: [
+        /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-label", children: "Your deposit address" }),
+        /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-value", children: smartAccount }),
+        /* @__PURE__ */ jsxs6(
+          "button",
+          {
+            type: "button",
+            className: "rs-deposit-address-copy",
+            onClick: handleCopy,
+            children: [
+              /* @__PURE__ */ jsx6(
+                "svg",
+                {
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  style: { width: 14, height: 14 },
+                  children: copied ? /* @__PURE__ */ jsx6(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M5 12l5 5L20 7"
+                    }
+                  ) : /* @__PURE__ */ jsx6(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M15.666 3.888A2.25 2.25 0 0013.5 2.25h-3c-1.03 0-1.9.693-2.166 1.638m7.332 0c.055.194.084.4.084.612v0a.75.75 0 01-.75.75H9.75a.75.75 0 01-.75-.75v0c0-.212.03-.418.084-.612m7.332 0c.646.049 1.288.11 1.927.184 1.1.128 1.907 1.077 1.907 2.185V19.5a2.25 2.25 0 01-2.25 2.25H6.75A2.25 2.25 0 014.5 19.5V6.257c0-1.108.806-2.057 1.907-2.185a48.208 48.208 0 011.927-.184"
+                    }
+                  )
+                }
+              ),
+              copied ? "Copied!" : "Copy address"
+            ]
+          }
+        )
+      ] }),
+      pollingError && /* @__PURE__ */ jsx6("div", { className: "rs-deposit-address-error", children: pollingError })
+    ] }) }),
+    /* @__PURE__ */ jsx6(PoweredBy, {})
+  ] });
+}
+DepositAddressStep.displayName = "DepositAddressStep";
+
+// src/DepositFlow.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function isSameRoute(sourceChain, sourceToken, targetChain, targetToken) {
+  return sourceChain === targetChain && sourceToken.toLowerCase() === targetToken.toLowerCase();
+}
+function DepositFlow({
+  dappWalletClient,
+  dappPublicClient,
+  dappAddress,
+  targetChain,
+  targetToken,
+  service,
+  sourceChain: defaultSourceChain,
+  sourceToken: defaultSourceToken,
+  amount: defaultAmount,
+  recipient,
+  rhinestoneApiKey,
+  signerAddress = DEFAULT_SIGNER_ADDRESS,
+  sessionChainIds,
+  forceRegister = false,
+  waitForFinalTx = true,
+  reownWallet,
+  onConnect,
+  onRequestConnect,
+  connectButtonLabel,
+  uiConfig,
+  onStepChange,
+  onTotalBalanceChange,
+  onClose,
+  onConnected,
+  onDepositSubmitted,
+  onDepositComplete,
+  onDepositFailed,
+  onError,
+  debug
+}) {
+  const [step, setStep] = useState7({ type: "setup" });
+  const [flowMode, setFlowMode] = useState7(null);
+  const [totalBalanceUsd, setTotalBalanceUsd] = useState7(0);
+  const [isConnectSelectionConfirmed, setIsConnectSelectionConfirmed] = useState7(false);
+  const [selectedConnectAddress, setSelectedConnectAddress] = useState7(null);
+  const targetChainObj = useMemo6(() => CHAIN_BY_ID[targetChain], [targetChain]);
+  const dappSwitchChain = useMemo6(() => {
+    if (!dappWalletClient?.switchChain) return void 0;
+    return async (chainId) => {
+      await dappWalletClient.switchChain?.({ id: chainId });
+    };
+  }, [dappWalletClient]);
+  const walletOptions = useMemo6(() => {
+    const options = [];
+    const seen = /* @__PURE__ */ new Set();
+    if (dappWalletClient?.account && dappAddress) {
+      options.push({
+        address: dappWalletClient.account.address,
+        label: "Connected Wallet",
+        kind: "connected"
+      });
+      seen.add(dappWalletClient.account.address.toLowerCase());
+    }
+    if (reownWallet?.address && reownWallet.isConnected && !seen.has(reownWallet.address.toLowerCase())) {
+      options.push({
+        address: reownWallet.address,
+        label: "External Wallet",
+        kind: "external"
+      });
+    }
+    return options;
+  }, [
+    dappWalletClient,
+    dappAddress,
+    reownWallet?.address,
+    reownWallet?.isConnected
+  ]);
+  const canAutoLock = dappWalletClient?.account && dappAddress && !reownWallet;
+  const hasWalletOptions = walletOptions.length > 0;
+  const showConnectStep = !canAutoLock && !isConnectSelectionConfirmed;
+  const signerContext = useMemo6(() => {
+    if (flowMode === "deposit-address") {
+      if (!dappAddress) return null;
+      return {
+        ownerAddress: dappAddress,
+        walletClient: void 0,
+        publicClient: dappPublicClient ?? getPublicClient(targetChain),
+        switchChain: void 0
+      };
+    }
+    if (canAutoLock) {
+      const fallbackChainId = dappWalletClient?.chain?.id ?? targetChain;
+      return {
+        ownerAddress: dappWalletClient.account.address,
+        walletClient: dappWalletClient,
+        publicClient: dappPublicClient ?? getPublicClient(fallbackChainId),
+        switchChain: dappSwitchChain
+      };
+    }
+    if (!isConnectSelectionConfirmed || !selectedConnectAddress) return null;
+    if (dappWalletClient?.account && dappWalletClient.account.address.toLowerCase() === selectedConnectAddress.toLowerCase()) {
+      const fallbackChainId = dappWalletClient?.chain?.id ?? targetChain;
+      return {
+        ownerAddress: dappWalletClient.account.address,
+        walletClient: dappWalletClient,
+        publicClient: dappPublicClient ?? getPublicClient(fallbackChainId),
+        switchChain: dappSwitchChain
+      };
+    }
+    if (reownWallet?.address?.toLowerCase() === selectedConnectAddress.toLowerCase() && reownWallet.walletClient && reownWallet.publicClient) {
+      return {
+        ownerAddress: reownWallet.address,
+        walletClient: reownWallet.walletClient,
+        publicClient: reownWallet.publicClient,
+        switchChain: reownWallet.switchChain
+      };
+    }
+    return null;
+  }, [
+    flowMode,
+    canAutoLock,
+    isConnectSelectionConfirmed,
+    selectedConnectAddress,
+    dappWalletClient,
+    dappPublicClient,
+    dappSwitchChain,
+    dappAddress,
+    reownWallet,
+    targetChain
+  ]);
+  const sessionKeyAddress = dappAddress ?? signerContext?.ownerAddress ?? null;
+  const lastTargetRef = useRef4(null);
+  useEffect6(() => {
+    const prev = lastTargetRef.current;
+    if (prev && (prev.chain !== targetChain || prev.token.toLowerCase() !== targetToken.toLowerCase())) {
+      if (step.type !== "processing") {
+        setStep({ type: "setup" });
+      }
+    }
+    lastTargetRef.current = { chain: targetChain, token: targetToken };
+  }, [targetChain, targetToken, step.type]);
+  const handleBackFromAmount = useCallback3(() => {
+    setStep((prev) => {
+      if (prev.type !== "amount") return prev;
+      return { type: "select-asset", smartAccount: prev.smartAccount };
+    });
+  }, []);
+  const handleBackFromSelectAsset = useCallback3(() => {
+    if (hasWalletOptions || reownWallet) {
+      setIsConnectSelectionConfirmed(false);
+    }
+  }, [hasWalletOptions, reownWallet]);
+  const handleBackFromDepositAddress = useCallback3(() => {
+    setFlowMode(null);
+    setStep({ type: "setup" });
+    if (hasWalletOptions || reownWallet) {
+      setIsConnectSelectionConfirmed(false);
+    }
+  }, [hasWalletOptions, reownWallet]);
+  const handleBackFromConfirm = useCallback3(() => {
+    setStep((prev) => {
+      if (prev.type !== "confirm") return prev;
+      return {
+        type: "amount",
+        smartAccount: prev.smartAccount,
+        asset: prev.asset,
+        amount: prev.amount
+      };
+    });
+  }, []);
+  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(() => {
+    onStepChange?.(stepIndex, currentBackHandler);
+  }, [stepIndex, currentBackHandler, onStepChange]);
+  useEffect6(() => {
+    onTotalBalanceChange?.(totalBalanceUsd);
+  }, [totalBalanceUsd, onTotalBalanceChange]);
+  const isDepositAddressMode = flowMode === "deposit-address";
+  const handleSelectProvider = useCallback3(() => {
+    setFlowMode("wallet");
+  }, []);
+  const handleSelectTransferCrypto = useCallback3(() => {
+    setFlowMode("deposit-address");
+    setStep({ type: "setup" });
+  }, []);
+  const handleNewDeposit = useCallback3(() => {
+    setFlowMode(null);
+    setStep({ type: "setup" });
+  }, []);
+  const handleSetupComplete = useCallback3(
+    (smartAccount) => {
+      if (isDepositAddressMode) {
+        setStep({ type: "deposit-address", smartAccount });
+      } else {
+        setStep({ type: "select-asset", smartAccount });
+      }
+    },
+    [isDepositAddressMode]
+  );
+  const handleDepositAddressDetected = useCallback3(
+    (txHash, chainId, amount, token) => {
+      setStep((prev) => {
+        if (prev.type !== "deposit-address") return prev;
+        return {
+          type: "processing",
+          smartAccount: prev.smartAccount,
+          txHash,
+          sourceChain: chainId,
+          sourceToken: token,
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
+        };
+      });
+      onDepositSubmitted?.({ txHash, sourceChain: chainId, amount });
+    },
+    [onDepositSubmitted, targetChain, targetToken]
+  );
+  const handleConnected = useCallback3(
+    (addr, smartAccount) => {
+      onConnected?.({ address: addr, smartAccount });
+    },
+    [onConnected]
+  );
+  const handleAssetContinue = useCallback3(
+    (asset) => {
+      setStep((prev) => {
+        if (prev.type !== "select-asset") return prev;
+        return {
+          type: "amount",
+          smartAccount: prev.smartAccount,
+          asset,
+          amount: defaultAmount
+        };
+      });
+    },
+    [defaultAmount]
+  );
+  const handleAmountContinue = useCallback3(
+    (amount, balance) => {
+      setStep((prev) => {
+        if (prev.type !== "amount") return prev;
+        return {
+          type: "confirm",
+          smartAccount: prev.smartAccount,
+          asset: prev.asset,
+          amount,
+          balance
+        };
+      });
+    },
+    []
+  );
+  const handleDepositSubmitted = useCallback3(
+    (txHash, chainId, amount, token) => {
+      setStep((prev) => {
+        if (prev.type !== "confirm") return prev;
+        return {
+          type: "processing",
+          smartAccount: prev.smartAccount,
+          txHash,
+          sourceChain: chainId,
+          sourceToken: token,
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
+        };
+      });
+    },
+    [targetChain, targetToken]
+  );
+  const handleDepositSubmittedCallback = useCallback3(
+    (txHash, sourceChain, amount) => {
+      onDepositSubmitted?.({ txHash, sourceChain, amount });
+    },
+    [onDepositSubmitted]
+  );
+  const handleDepositComplete = useCallback3(
+    (txHash, destinationTxHash) => {
+      onDepositComplete?.({ txHash, destinationTxHash });
+    },
+    [onDepositComplete]
+  );
+  const handleDepositFailed = useCallback3(
+    (txHash, error) => {
+      onDepositFailed?.({ txHash, error });
+    },
+    [onDepositFailed]
+  );
+  const handleError = useCallback3(
+    (message, code) => {
+      onError?.({ message, code });
+    },
+    [onError]
+  );
+  const handleTotalBalanceComputed = useCallback3((total) => {
+    setTotalBalanceUsd(total);
+  }, []);
+  const selectedConnectAddressEffective = useMemo6(() => {
+    if (selectedConnectAddress) return selectedConnectAddress;
+    if (walletOptions.length === 1) {
+      return walletOptions[0].address;
+    }
+    return null;
+  }, [selectedConnectAddress, walletOptions]);
+  const walletOptionsKey = useMemo6(
+    () => walletOptions.map((option) => option.address.toLowerCase()).join(","),
+    [walletOptions]
+  );
+  useEffect6(() => {
+    setIsConnectSelectionConfirmed(false);
+  }, [walletOptionsKey, selectedConnectAddressEffective]);
+  if (showConnectStep) {
+    return /* @__PURE__ */ jsx7("div", { className: "rs-modal-body", children: /* @__PURE__ */ jsx7(
+      ConnectStep,
+      {
+        walletOptions,
+        selectedAddress: selectedConnectAddressEffective,
+        onSelectAddress: setSelectedConnectAddress,
+        onSelectTransferCrypto: dappAddress ? () => {
+          handleSelectTransferCrypto();
+          setIsConnectSelectionConfirmed(true);
+        } : void 0,
+        onRequestConnect,
+        onConnect,
+        onContinue: () => {
+          if (selectedConnectAddressEffective) {
+            setSelectedConnectAddress(selectedConnectAddressEffective);
+          }
+          handleSelectProvider();
+          setIsConnectSelectionConfirmed(true);
+        },
+        connectButtonLabel
+      }
+    ) });
+  }
+  if (isDepositAddressMode) {
+    if (!dappAddress || !sessionKeyAddress) return null;
+    return /* @__PURE__ */ jsxs7("div", { className: "rs-modal-body", children: [
+      step.type === "setup" && targetChainObj && /* @__PURE__ */ jsx7(
+        SetupStep,
+        {
+          address: sessionKeyAddress,
+          targetChain,
+          targetChainObj,
+          targetToken,
+          rhinestoneApiKey,
+          signerAddress,
+          sessionChainIds,
+          recipient,
+          forceRegister,
+          service,
+          onSetupComplete: handleSetupComplete,
+          onConnected: handleConnected,
+          onError: handleError
+        }
+      ),
+      step.type === "deposit-address" && /* @__PURE__ */ jsx7(
+        DepositAddressStep,
+        {
+          smartAccount: step.smartAccount,
+          service,
+          onDepositDetected: handleDepositAddressDetected,
+          onError: handleError
+        }
+      ),
+      step.type === "processing" && /* @__PURE__ */ jsx7(
+        ProcessingStep,
+        {
+          smartAccount: step.smartAccount,
+          txHash: step.txHash,
+          sourceChain: step.sourceChain,
+          sourceToken: step.sourceToken,
+          targetChain,
+          targetToken,
+          amount: step.amount,
+          waitForFinalTx,
+          service,
+          directTransfer: step.directTransfer,
+          onClose,
+          onNewDeposit: handleNewDeposit,
+          onDepositComplete: handleDepositComplete,
+          onDepositFailed: handleDepositFailed,
+          onError: handleError,
+          debug
+        }
+      )
+    ] });
+  }
+  if (!signerContext?.walletClient || !signerContext?.publicClient) {
+    return null;
+  }
+  const ownerAddress = signerContext.ownerAddress;
+  const ownerChainId = signerContext.walletClient?.chain?.id ?? signerContext.publicClient.chain?.id ?? targetChain;
+  const getReadClientForChain = (chainId) => {
+    if (signerContext.publicClient.chain?.id === chainId) {
+      return signerContext.publicClient;
+    }
+    return getPublicClient(chainId);
+  };
+  return /* @__PURE__ */ jsxs7("div", { className: "rs-modal-body", children: [
+    step.type === "setup" && targetChainObj && /* @__PURE__ */ jsx7(
+      SetupStep,
+      {
+        walletClient: signerContext.walletClient,
+        address: ownerAddress,
+        targetChain,
+        targetChainObj,
+        targetToken,
+        rhinestoneApiKey,
+        signerAddress,
+        sessionChainIds,
+        recipient,
+        forceRegister,
+        service,
+        onSetupComplete: handleSetupComplete,
+        onConnected: handleConnected,
+        onError: handleError
+      }
+    ),
+    step.type === "select-asset" && /* @__PURE__ */ jsx7(
+      AssetSelectStep,
+      {
+        address: ownerAddress,
+        publicClient: getReadClientForChain(ownerChainId),
+        defaultSourceChain,
+        defaultSourceToken,
+        service,
+        onContinue: handleAssetContinue,
+        onTotalBalanceComputed: handleTotalBalanceComputed
+      }
+    ),
+    step.type === "amount" && /* @__PURE__ */ jsx7(
+      AmountStep,
+      {
+        walletClient: signerContext.walletClient,
+        publicClient: getReadClientForChain(step.asset.chainId),
+        address: ownerAddress,
+        asset: step.asset,
+        defaultAmount: step.amount ?? defaultAmount,
+        switchChain: signerContext.switchChain,
+        targetChain,
+        targetToken,
+        uiConfig,
+        onContinue: handleAmountContinue
+      }
+    ),
+    step.type === "confirm" && /* @__PURE__ */ jsx7(
+      ConfirmStep,
+      {
+        walletClient: signerContext.walletClient,
+        address: ownerAddress,
+        smartAccount: step.smartAccount,
+        recipient,
+        asset: step.asset,
+        amount: step.amount,
+        balance: step.balance,
+        targetChain,
+        targetToken,
+        switchChain: signerContext.switchChain,
+        onConfirm: handleDepositSubmitted,
+        onDepositSubmitted: handleDepositSubmittedCallback,
+        onError: handleError
+      }
+    ),
+    step.type === "processing" && /* @__PURE__ */ jsx7(
+      ProcessingStep,
+      {
+        smartAccount: step.smartAccount,
+        txHash: step.txHash,
+        sourceChain: step.sourceChain,
+        sourceToken: step.sourceToken,
+        targetChain,
+        targetToken,
+        amount: step.amount,
+        waitForFinalTx,
+        service,
+        directTransfer: step.directTransfer,
+        onClose,
+        onNewDeposit: handleNewDeposit,
+        onDepositComplete: handleDepositComplete,
+        onDepositFailed: handleDepositFailed,
+        onError: handleError
+      }
+    )
+  ] });
+}
+
+// src/DepositModal.tsx
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+var ReownDepositInner = lazy(
+  () => import("./DepositModalReown-YTWIR7A4.mjs").then((m) => ({ default: m.DepositModalReown }))
+);
+function DepositModal(props) {
+  const needsReown = !!props.reownAppId;
+  if (needsReown) {
+    return /* @__PURE__ */ jsx8(Suspense, { fallback: null, children: /* @__PURE__ */ jsx8(ReownDepositInner, { ...props }) });
+  }
+  return /* @__PURE__ */ jsx8(DepositModalInner, { ...props });
+}
+DepositModal.displayName = "DepositModal";
+function DepositModalInner({
+  dappWalletClient,
+  dappPublicClient,
+  dappAddress,
+  targetChain: targetChainProp,
+  targetToken,
+  isOpen,
+  onClose,
+  inline,
+  sourceChain: sourceChainProp,
+  sourceToken,
+  defaultAmount,
+  recipient,
+  backendUrl = DEFAULT_BACKEND_URL,
+  rhinestoneApiKey,
+  signerAddress = DEFAULT_SIGNER_ADDRESS,
+  sessionChainIds,
+  forceRegister = false,
+  waitForFinalTx = true,
+  reownWallet,
+  onConnect,
+  onRequestConnect,
+  connectButtonLabel,
+  theme,
+  branding,
+  uiConfig,
+  className,
+  onReady,
+  onConnected,
+  onDepositSubmitted,
+  onDepositComplete,
+  onDepositFailed,
+  onError,
+  debug
+}) {
+  const modalRef = useRef5(null);
+  const [currentStepIndex, setCurrentStepIndex] = useState8(0);
+  const [totalBalanceUsd, setTotalBalanceUsd] = useState8(null);
+  const backHandlerRef = useRef5(void 0);
+  const targetChain = getChainId(targetChainProp);
+  const sourceChain = sourceChainProp ? getChainId(sourceChainProp) : void 0;
+  const service = useMemo7(() => createDepositService(backendUrl), [backendUrl]);
+  useEffect7(() => {
+    if (isOpen && modalRef.current) {
+      applyTheme(modalRef.current, theme);
+    }
+  }, [isOpen, theme]);
+  const hasCalledReady = useRef5(false);
+  useEffect7(() => {
+    if (isOpen && !hasCalledReady.current) {
+      hasCalledReady.current = true;
+      onReady?.();
+    }
+  }, [isOpen, onReady]);
+  useEffect7(() => {
+    if (!isOpen) {
+      setCurrentStepIndex(0);
+    }
+  }, [isOpen]);
+  const handleStepChange = useCallback4(
+    (stepIndex, onBack) => {
+      setCurrentStepIndex(stepIndex);
+      backHandlerRef.current = onBack;
+    },
+    []
+  );
+  const handleTotalBalanceChange = useCallback4((balance) => {
+    setTotalBalanceUsd(balance);
+  }, []);
+  const handleBack = useCallback4(() => {
+    backHandlerRef.current?.();
+  }, []);
+  const showLogo = uiConfig?.showLogo ?? false;
+  const showStepper = uiConfig?.showStepper ?? false;
+  const showBackButton = uiConfig?.showBackButton ?? true;
+  const balanceTitle = uiConfig?.balanceTitle;
+  const logoUrl = branding?.logoUrl ?? "https://github.com/rhinestonewtf.png";
+  const title = branding?.title ?? "Deposit";
+  const canGoBack = currentStepIndex > 0 && currentStepIndex < 4 && backHandlerRef.current !== void 0;
+  return /* @__PURE__ */ jsx8(
+    Modal,
+    {
+      isOpen,
+      onClose,
+      className,
+      inline,
+      children: /* @__PURE__ */ jsxs8("div", { ref: modalRef, className: "rs-modal", children: [
+        /* @__PURE__ */ jsxs8("div", { className: "rs-modal-header--redesigned", children: [
+          /* @__PURE__ */ jsx8("div", { className: "rs-modal-header-nav-left", children: showBackButton && canGoBack && /* @__PURE__ */ jsx8(
+            "button",
+            {
+              type: "button",
+              className: "rs-modal-header-back",
+              "aria-label": "Go back",
+              onClick: handleBack,
+              children: /* @__PURE__ */ jsx8(
+                "svg",
+                {
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  children: /* @__PURE__ */ jsx8(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M15.75 19.5L8.25 12l7.5-7.5"
+                    }
+                  )
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ jsxs8("div", { className: "rs-modal-header-nav-center", children: [
+            /* @__PURE__ */ jsxs8("div", { className: "rs-modal-header-title-row", children: [
+              showLogo && logoUrl && /* @__PURE__ */ jsx8(
+                "img",
+                {
+                  src: logoUrl,
+                  alt: "",
+                  className: "rs-modal-logo",
+                  onError: (e) => {
+                    e.target.style.display = "none";
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx8("span", { className: "rs-modal-header-title", children: title }),
+              showStepper && /* @__PURE__ */ jsx8("div", { className: "rs-modal-progress", style: { marginLeft: 8 }, children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx8(
+                "div",
+                {
+                  className: `rs-modal-progress-dot ${i <= currentStepIndex ? "rs-modal-progress-dot--active" : "rs-modal-progress-dot--inactive"}`
+                },
+                i
+              )) })
+            ] }),
+            balanceTitle && totalBalanceUsd !== null && /* @__PURE__ */ jsxs8("div", { className: "rs-modal-header-balance", children: [
+              /* @__PURE__ */ jsxs8("span", { children: [
+                balanceTitle,
+                ":"
+              ] }),
+              /* @__PURE__ */ jsx8("span", { className: "rs-modal-header-balance-value", children: currencyFormatter.format(totalBalanceUsd) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx8("div", { className: "rs-modal-header-nav-right", children: /* @__PURE__ */ jsx8(
+            "button",
+            {
+              type: "button",
+              onClick: onClose,
+              className: "rs-modal-close",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ jsx8(
+                "svg",
+                {
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  children: /* @__PURE__ */ jsx8(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M6 18L18 6M6 6l12 12"
+                    }
+                  )
+                }
+              )
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsx8(
+          DepositFlow,
+          {
+            dappWalletClient,
+            dappPublicClient,
+            dappAddress,
+            targetChain,
+            targetToken,
+            service,
+            sourceChain,
+            sourceToken,
+            amount: defaultAmount,
+            recipient,
+            rhinestoneApiKey,
+            signerAddress,
+            sessionChainIds,
+            forceRegister,
+            waitForFinalTx,
+            reownWallet,
+            onConnect,
+            onRequestConnect,
+            connectButtonLabel,
+            uiConfig,
+            onStepChange: handleStepChange,
+            onTotalBalanceChange: handleTotalBalanceChange,
+            onClose,
+            onConnected,
+            onDepositSubmitted,
+            onDepositComplete,
+            onDepositFailed,
+            onError,
+            debug
+          }
+        )
+      ] })
+    }
+  );
+}
+
+export {
+  DepositModal,
+  DepositModalInner
+};