@rhinestone/deposit-modal 0.1.20 → 0.1.21

package/dist/index.cjs

@@ -2216,6 +2216,7 @@ function ConfirmStep({
   walletClient,
   address,
   smartAccount,
+  recipient,
   asset,
   amount,
   balance,
@@ -2311,10 +2312,11 @@ function ConfirmStep({
       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: smartAccount,
+        to: transferTo,
         value: amountUnits
       }) : await walletClient.writeContract({
         account,
@@ -2322,7 +2324,7 @@ function ConfirmStep({
         address: asset.token,
         abi: import_viem5.erc20Abi,
         functionName: "transfer",
-        args: [smartAccount, amountUnits]
+        args: [transferTo, amountUnits]
       });
       onDepositSubmitted?.(hash, asset.chainId, amountUnits.toString());
       onConfirm(hash, asset.chainId, amountUnits.toString(), asset.token);
@@ -2580,6 +2582,7 @@ function ProcessingStep({
   amount,
   waitForFinalTx,
   service,
+  directTransfer,
   flowLabel = "deposit",
   debug,
   onClose,
@@ -2588,11 +2591,20 @@ function ProcessingStep({
   onDepositFailed,
   onError
 }) {
-  const [state, setState] = (0, import_react6.useState)({ type: "processing" });
+  const [state, setState] = (0, import_react6.useState)(
+    directTransfer ? { type: "complete" } : { type: "processing" }
+  );
   const [elapsedSeconds, setElapsedSeconds] = (0, import_react6.useState)(0);
   const startTimeRef = (0, import_react6.useRef)(Date.now());
   const intervalRef = (0, import_react6.useRef)(null);
   (0, import_react6.useEffect)(() => {
+    if (directTransfer) {
+      onDepositComplete?.(txHash);
+      return;
+    }
+  }, [directTransfer, txHash, onDepositComplete]);
+  (0, import_react6.useEffect)(() => {
+    if (directTransfer) return;
     startTimeRef.current = Date.now();
     intervalRef.current = setInterval(() => {
       setElapsedSeconds(Math.floor((Date.now() - startTimeRef.current) / 1e3));
@@ -2600,7 +2612,7 @@ function ProcessingStep({
     return () => {
       if (intervalRef.current) clearInterval(intervalRef.current);
     };
-  }, []);
+  }, [directTransfer]);
   (0, import_react6.useEffect)(() => {
     if (state.type === "complete" || state.type === "failed" || state.type === "error") {
       if (intervalRef.current) {
@@ -2613,6 +2625,7 @@ function ProcessingStep({
   const pollTimeoutRef = (0, import_react6.useRef)(null);
   const processTimeoutRef = (0, import_react6.useRef)(null);
   (0, import_react6.useEffect)(() => {
+    if (directTransfer) return;
     if (state.type !== "processing") {
       pollIntervalRef.current = INITIAL_POLL_INTERVAL;
       return;
@@ -2689,6 +2702,7 @@ function ProcessingStep({
       }
     };
   }, [
+    directTransfer,
     state.type,
     smartAccount,
     txHash,
@@ -2698,6 +2712,7 @@ function ProcessingStep({
     onDepositFailed
   ]);
   (0, import_react6.useEffect)(() => {
+    if (directTransfer) return;
     if (state.type !== "processing") {
       if (processTimeoutRef.current) {
         clearTimeout(processTimeoutRef.current);
@@ -2716,7 +2731,7 @@ function ProcessingStep({
         processTimeoutRef.current = null;
       }
     };
-  }, [state.type, onError]);
+  }, [directTransfer, state.type, onError]);
   const isError = state.type === "error" || state.type === "failed";
   const isComplete = state.type === "complete";
   const isProcessing = state.type === "processing";
@@ -2770,7 +2785,7 @@ function ProcessingStep({
             }
           ) }),
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "rs-success-title", children: isEarlyComplete ? `${flowCapitalized} confirmed` : `${flowCapitalized} successful` }),
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "rs-success-subtitle", children: isEarlyComplete ? "Your transfer has been confirmed and funds will arrive shortly." : `Your funds have been successfully bridged.` })
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "rs-success-subtitle", children: directTransfer ? "Your transfer is complete." : isEarlyComplete ? "Your transfer has been confirmed and funds will arrive shortly." : "Your funds have been successfully bridged." })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "rs-card", children: [
           /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "rs-card-row", children: [
@@ -3553,6 +3568,9 @@ var init_public_client = __esm({
 });
 
 // src/DepositFlow.tsx
+function isSameRoute(sourceChain, sourceToken, targetChain, targetToken) {
+  return sourceChain === targetChain && sourceToken.toLowerCase() === targetToken.toLowerCase();
+}
 function DepositFlow({
   dappWalletClient,
   dappPublicClient,
@@ -3753,12 +3771,13 @@ function DepositFlow({
           txHash,
           sourceChain: chainId,
           sourceToken: token,
-          amount
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
         };
       });
       onDepositSubmitted?.({ txHash, sourceChain: chainId, amount });
     },
-    [onDepositSubmitted]
+    [onDepositSubmitted, targetChain, targetToken]
   );
   const handleConnected = (0, import_react9.useCallback)(
     (addr, smartAccount) => {
@@ -3805,11 +3824,12 @@ function DepositFlow({
           txHash,
           sourceChain: chainId,
           sourceToken: token,
-          amount
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
         };
       });
     },
-    []
+    [targetChain, targetToken]
   );
   const handleDepositSubmittedCallback = (0, import_react9.useCallback)(
     (txHash, sourceChain, amount) => {
@@ -3918,6 +3938,7 @@ function DepositFlow({
           amount: step.amount,
           waitForFinalTx,
           service,
+          directTransfer: step.directTransfer,
           onClose,
           onNewDeposit: handleNewDeposit,
           onDepositComplete: handleDepositComplete,
@@ -3992,6 +4013,7 @@ function DepositFlow({
         walletClient: signerContext.walletClient,
         address: ownerAddress,
         smartAccount: step.smartAccount,
+        recipient,
         asset: step.asset,
         amount: step.amount,
         balance: step.balance,
@@ -4015,6 +4037,7 @@ function DepositFlow({
         amount: step.amount,
         waitForFinalTx,
         service,
+        directTransfer: step.directTransfer,
         onClose,
         onNewDeposit: handleNewDeposit,
         onDepositComplete: handleDepositComplete,

package/dist/index.d.cts

@@ -72,7 +72,7 @@ interface DepositModalProps {
     sourceChain?: Chain | number;
     sourceToken?: Address;
     defaultAmount?: string;
-    recipient?: Address;
+    recipient: Address;
     backendUrl?: string;
     rhinestoneApiKey?: string;
     signerAddress?: Address;

package/dist/index.d.ts

@@ -72,7 +72,7 @@ interface DepositModalProps {
     sourceChain?: Chain | number;
     sourceToken?: Address;
     defaultAmount?: string;
-    recipient?: Address;
+    recipient: Address;
     backendUrl?: string;
     rhinestoneApiKey?: string;
     signerAddress?: Address;

package/dist/index.mjs

@@ -2203,6 +2203,7 @@ function ConfirmStep({
   walletClient,
   address,
   smartAccount,
+  recipient,
   asset,
   amount,
   balance,
@@ -2298,10 +2299,11 @@ function ConfirmStep({
       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: smartAccount,
+        to: transferTo,
         value: amountUnits
       }) : await walletClient.writeContract({
         account,
@@ -2309,7 +2311,7 @@ function ConfirmStep({
         address: asset.token,
         abi: erc20Abi2,
         functionName: "transfer",
-        args: [smartAccount, amountUnits]
+        args: [transferTo, amountUnits]
       });
       onDepositSubmitted?.(hash, asset.chainId, amountUnits.toString());
       onConfirm(hash, asset.chainId, amountUnits.toString(), asset.token);
@@ -2567,6 +2569,7 @@ function ProcessingStep({
   amount,
   waitForFinalTx,
   service,
+  directTransfer,
   flowLabel = "deposit",
   debug,
   onClose,
@@ -2575,11 +2578,20 @@ function ProcessingStep({
   onDepositFailed,
   onError
 }) {
-  const [state, setState] = useState5({ type: "processing" });
+  const [state, setState] = useState5(
+    directTransfer ? { type: "complete" } : { type: "processing" }
+  );
   const [elapsedSeconds, setElapsedSeconds] = useState5(0);
   const startTimeRef = useRef4(Date.now());
   const intervalRef = useRef4(null);
   useEffect5(() => {
+    if (directTransfer) {
+      onDepositComplete?.(txHash);
+      return;
+    }
+  }, [directTransfer, txHash, onDepositComplete]);
+  useEffect5(() => {
+    if (directTransfer) return;
     startTimeRef.current = Date.now();
     intervalRef.current = setInterval(() => {
       setElapsedSeconds(Math.floor((Date.now() - startTimeRef.current) / 1e3));
@@ -2587,7 +2599,7 @@ function ProcessingStep({
     return () => {
       if (intervalRef.current) clearInterval(intervalRef.current);
     };
-  }, []);
+  }, [directTransfer]);
   useEffect5(() => {
     if (state.type === "complete" || state.type === "failed" || state.type === "error") {
       if (intervalRef.current) {
@@ -2600,6 +2612,7 @@ function ProcessingStep({
   const pollTimeoutRef = useRef4(null);
   const processTimeoutRef = useRef4(null);
   useEffect5(() => {
+    if (directTransfer) return;
     if (state.type !== "processing") {
       pollIntervalRef.current = INITIAL_POLL_INTERVAL;
       return;
@@ -2676,6 +2689,7 @@ function ProcessingStep({
       }
     };
   }, [
+    directTransfer,
     state.type,
     smartAccount,
     txHash,
@@ -2685,6 +2699,7 @@ function ProcessingStep({
     onDepositFailed
   ]);
   useEffect5(() => {
+    if (directTransfer) return;
     if (state.type !== "processing") {
       if (processTimeoutRef.current) {
         clearTimeout(processTimeoutRef.current);
@@ -2703,7 +2718,7 @@ function ProcessingStep({
         processTimeoutRef.current = null;
       }
     };
-  }, [state.type, onError]);
+  }, [directTransfer, state.type, onError]);
   const isError = state.type === "error" || state.type === "failed";
   const isComplete = state.type === "complete";
   const isProcessing = state.type === "processing";
@@ -2757,7 +2772,7 @@ function ProcessingStep({
             }
           ) }),
           /* @__PURE__ */ jsx11("div", { className: "rs-success-title", children: isEarlyComplete ? `${flowCapitalized} confirmed` : `${flowCapitalized} successful` }),
-          /* @__PURE__ */ jsx11("div", { className: "rs-success-subtitle", children: isEarlyComplete ? "Your transfer has been confirmed and funds will arrive shortly." : `Your funds have been successfully bridged.` })
+          /* @__PURE__ */ jsx11("div", { className: "rs-success-subtitle", children: directTransfer ? "Your transfer is complete." : isEarlyComplete ? "Your transfer has been confirmed and funds will arrive shortly." : "Your funds have been successfully bridged." })
         ] }),
         /* @__PURE__ */ jsxs10("div", { className: "rs-card", children: [
           /* @__PURE__ */ jsxs10("div", { className: "rs-card-row", children: [
@@ -3538,6 +3553,9 @@ var init_public_client = __esm({
 // src/DepositFlow.tsx
 import { useState as useState7, useCallback as useCallback4, useMemo as useMemo6, useEffect as useEffect7, useRef as useRef6 } from "react";
 import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+function isSameRoute(sourceChain, sourceToken, targetChain, targetToken) {
+  return sourceChain === targetChain && sourceToken.toLowerCase() === targetToken.toLowerCase();
+}
 function DepositFlow({
   dappWalletClient,
   dappPublicClient,
@@ -3738,12 +3756,13 @@ function DepositFlow({
           txHash,
           sourceChain: chainId,
           sourceToken: token,
-          amount
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
         };
       });
       onDepositSubmitted?.({ txHash, sourceChain: chainId, amount });
     },
-    [onDepositSubmitted]
+    [onDepositSubmitted, targetChain, targetToken]
   );
   const handleConnected = useCallback4(
     (addr, smartAccount) => {
@@ -3790,11 +3809,12 @@ function DepositFlow({
           txHash,
           sourceChain: chainId,
           sourceToken: token,
-          amount
+          amount,
+          directTransfer: isSameRoute(chainId, token, targetChain, targetToken)
         };
       });
     },
-    []
+    [targetChain, targetToken]
   );
   const handleDepositSubmittedCallback = useCallback4(
     (txHash, sourceChain, amount) => {
@@ -3903,6 +3923,7 @@ function DepositFlow({
           amount: step.amount,
           waitForFinalTx,
           service,
+          directTransfer: step.directTransfer,
           onClose,
           onNewDeposit: handleNewDeposit,
           onDepositComplete: handleDepositComplete,
@@ -3977,6 +3998,7 @@ function DepositFlow({
         walletClient: signerContext.walletClient,
         address: ownerAddress,
         smartAccount: step.smartAccount,
+        recipient,
         asset: step.asset,
         amount: step.amount,
         balance: step.balance,
@@ -4000,6 +4022,7 @@ function DepositFlow({
         amount: step.amount,
         waitForFinalTx,
         service,
+        directTransfer: step.directTransfer,
         onClose,
         onNewDeposit: handleNewDeposit,
         onDepositComplete: handleDepositComplete,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rhinestone/deposit-modal",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "description": "React modal component for Rhinestone cross-chain deposits",
   "author": "Rhinestone <dev@rhinestone.wtf>",
   "bugs": {