@layerswap/widget 0.1.18 → 1.0.0-alpha0.1

package/dist/components/Pages/{SwapPages/Withdraw/Wallet → Swap/Withdraw/Wallet/WithdrawalProviders}/ZKsyncWalletWithdraw.js

@@ -4,32 +4,32 @@ import { useCallback, useEffect, useState } from 'react';
 import toast from 'react-hot-toast';
 import * as zksync from 'zksync';
 import { utils } from 'ethers';
-import { useEthersSigner } from '../../../../../lib/ethersToViem/ethers';
-import { useSwapTransactionStore } from '../../../../../stores/swapTransactionStore';
-import { BackendTransactionStatus } from '../../../../../lib/layerSwapApiClient';
-import { ButtonWrapper, ChangeNetworkButton, ConnectWalletButton } from './WalletTransfer/buttons';
-import { useSettingsState } from '../../../../../context/settings';
+import { useEthersSigner } from '../../../../../../lib/ethersToViem/ethers';
+import { ButtonWrapper, ChangeNetworkButton, ConnectWalletButton, SendTransactionButton } from '../Common/buttons';
+import { useSettingsState } from '../../../../../../context/settings';
 import { useAccount } from 'wagmi';
-import ClickTooltip from '../../../../Common/ClickTooltip';
-import SignatureIcon from '../../../../Icons/SignatureIcon';
-import formatAmount from '../../../../../lib/formatAmount';
-import useWallet from '../../../../../hooks/useWallet';
-import KnownInternalNames from '../../../../../lib/knownIds';
-const ZkSyncWalletWithdrawStep = ({ amount, depositAddress, network, token, sequenceNumber, swapId }) => {
+import ClickTooltip from '../../../../../../components/Common/ClickTooltip';
+import SignatureIcon from '../../../../../../components/Icons/SignatureIcon';
+import formatAmount from '../../../../../../lib/formatAmount';
+import useWallet from '../../../../../../hooks/useWallet';
+import KnownInternalNames from '../../../../../../lib/knownIds';
+import { useSelectedAccount } from '../../../../../../context/balanceAccounts';
+export const ZkSyncWalletWithdrawStep = ({ swapBasicData, refuel }) => {
     const [loading, setLoading] = useState(false);
     const [syncWallet, setSyncWallet] = useState();
     const [accountIsActivated, setAccountIsActivated] = useState(false);
     const [activationFee, setActivationFee] = useState(undefined);
-    const { setSwapTransaction } = useSwapTransactionStore();
+    const { source_network, source_token } = swapBasicData;
     const { chain } = useAccount();
     const signer = useEthersSigner();
     const { networks: layers } = useSettingsState();
-    const defaultProvider = network?.name?.split('_')?.[1]?.toLowerCase() == "mainnet" ? "mainnet" : "goerli";
+    const defaultProvider = source_network?.name?.split('_')?.[1]?.toLowerCase() == "mainnet" ? "mainnet" : "goerli";
     const l1Network = layers.find(n => n.name === KnownInternalNames.Networks.EthereumMainnet || n.name === KnownInternalNames.Networks.EthereumSepolia);
-    const { provider } = useWallet(network, 'withdrawal');
-    const wallet = provider?.activeWallet;
+    const { provider } = useWallet(source_network, 'withdrawal');
+    const selectedSourceAccount = useSelectedAccount("from", provider?.name);
+    const wallet = selectedSourceAccount?.wallet;
     useEffect(() => {
-        if (signer?._address !== syncWallet?.cachedAddress && network) {
+        if (signer?._address !== syncWallet?.cachedAddress && source_network) {
             setSyncWallet(null);
         }
     }, [signer?._address]);
@@ -44,9 +44,9 @@ const ZkSyncWalletWithdrawStep = ({ amount, depositAddress, network, token, sequ
             if (!accountIsActivated) {
                 let activationFee = await syncProvider.getTransactionFee({
                     ChangePubKey: 'ECDSA'
-                }, wallet.address(), Number(token?.contract));
-                const formatedGas = formatAmount(activationFee.totalFee, Number(token?.decimals));
-                let assetUsdPrice = token?.price_in_usd;
+                }, wallet.address(), Number(source_token?.contract));
+                const formatedGas = formatAmount(activationFee.totalFee, Number(source_token?.decimals));
+                let assetUsdPrice = source_token?.price_in_usd;
                 setActivationFee({ feeInAsset: formatedGas, feeInUsd: formatedGas * (assetUsdPrice ?? 0) });
             }
             setSyncWallet(wallet);
@@ -57,7 +57,7 @@ const ZkSyncWalletWithdrawStep = ({ amount, depositAddress, network, token, sequ
         finally {
             setLoading(false);
         }
-    }, [signer, defaultProvider, token]);
+    }, [signer, defaultProvider, source_token]);
     const activateAccout = useCallback(async () => {
         if (!syncWallet)
             return;
@@ -68,7 +68,7 @@ const ZkSyncWalletWithdrawStep = ({ amount, depositAddress, network, token, sequ
                 setLoading(false);
                 return;
             }
-            const changePubkeyHandle = await syncWallet.setSigningKey({ ethAuthType: "ECDSA", feeToken: Number(token?.contract) });
+            const changePubkeyHandle = await syncWallet.setSigningKey({ ethAuthType: "ECDSA", feeToken: Number(source_token?.contract) });
             const receipt = await changePubkeyHandle.awaitReceipt();
             if (receipt.success)
                 setAccountIsActivated(true);
@@ -83,43 +83,41 @@ const ZkSyncWalletWithdrawStep = ({ amount, depositAddress, network, token, sequ
         finally {
             setLoading(false);
         }
-    }, [syncWallet, token]);
-    const handleTransfer = useCallback(async () => {
-        if (!swapId || !syncWallet || !depositAddress || !token || !sequenceNumber || !amount)
+    }, [syncWallet, source_token]);
+    const handleTransfer = useCallback(async ({ amount, depositAddress, sequenceNumber, swapId }) => {
+        if (!swapId || !syncWallet || !depositAddress || !source_token || !sequenceNumber || !amount)
             return;
         setLoading(true);
         try {
             const tf = await syncWallet?.syncTransfer({
                 to: depositAddress,
-                token: token.symbol,
-                amount: zksync.closestPackableTransactionAmount(utils.parseUnits(amount.toString(), token?.decimals)),
+                token: source_token.symbol,
+                amount: zksync.closestPackableTransactionAmount(utils.parseUnits(amount.toString(), source_token?.decimals)),
                 validUntil: zksync.utils.MAX_TIMESTAMP - sequenceNumber,
             });
             if (tf?.txHash) {
-                setSwapTransaction(swapId, BackendTransactionStatus.Pending, tf?.txHash?.replace('sync-tx:', '0x'));
+                const txHash = tf?.txHash?.replace('sync-tx:', '0x');
+                return txHash;
             }
         }
         catch (e) {
+            setLoading(false);
             if (e?.message) {
                 toast(e.message);
-                return;
             }
+            throw e;
         }
-        finally {
-            setLoading(false);
-        }
-    }, [syncWallet, swapId, depositAddress, token, amount, sequenceNumber]);
+    }, [syncWallet, source_token]);
     if (wallet && wallet?.id?.toLowerCase() === 'argent')
-        return (_jsx("div", { className: "rounded-md bg-secondary-800 p-4", children: _jsxs("div", { className: "flex", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx(Info, { className: "h-5 w-5 text-primary-400", "aria-hidden": "true" }) }), _jsxs("div", { className: "ml-3", children: [_jsx("h3", { className: "text-sm font-medium text-primary-text", children: "Please switch to manually" }), _jsx("div", { className: "mt-2 text-sm text-secondary-text", children: _jsxs("p", { children: [_jsx("span", { children: "Automatic transfers from Argent zkSync Lite wallet are not supported now. Choose the manual transfer option and follow the" }), " ", _jsx("a", { target: "_blank", className: "underline hover:no-underline cursor-pointer hover:text-secondary-text text-primary-text font-light", href: 'https://www.youtube.com/watch?v=u_KzSr5v8M8&ab_channel=Layerswap', children: "tutorial" }), " ", _jsx("span", { children: "for a smooth swap." })] }) })] })] }) }));
+        return (_jsx("div", { className: "rounded-md bg-secondary-800 p-4", children: _jsxs("div", { className: "flex", children: [_jsx("div", { className: "shrink-0", children: _jsx(Info, { className: "h-5 w-5 text-primary-400", "aria-hidden": "true" }) }), _jsxs("div", { className: "ml-3", children: [_jsx("h3", { className: "text-sm font-medium text-primary-text", children: "Please switch to manually" }), _jsx("div", { className: "mt-2 text-sm text-secondary-text", children: _jsxs("p", { children: [_jsx("span", { children: "Automatic transfers from Argent zkSync Lite wallet are not supported now. Choose the manual transfer option and follow the" }), " ", _jsx("a", { target: "_blank", className: "underline hover:no-underline cursor-pointer hover:text-secondary-text text-primary-text font-light", href: 'https://www.youtube.com/watch?v=u_KzSr5v8M8&ab_channel=Layerswap', rel: "noopener noreferrer", children: "tutorial" }), " ", _jsx("span", { children: "for a smooth swap." })] }) })] })] }) }));
     if (!signer || !wallet) {
         return _jsx(ConnectWalletButton, {});
     }
     if (l1Network && chain?.id !== Number(l1Network.chain_id)) {
-        return (_jsx(ChangeNetworkButton, { chainId: Number(l1Network?.chain_id), network: l1Network?.display_name }));
+        return (_jsx(ChangeNetworkButton, { chainId: Number(l1Network?.chain_id), network: l1Network }));
     }
     return (_jsx(_Fragment, { children: _jsx("div", { className: "w-full space-y-5 flex flex-col justify-between h-full text-primary-text", children: _jsxs("div", { className: 'space-y-4', children: [!syncWallet &&
                         _jsx(ButtonWrapper, { isDisabled: loading, isSubmitting: loading, onClick: handleAuthorize, icon: _jsx(SignatureIcon, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), children: "Authorize to Send on zkSync" }), syncWallet && !accountIsActivated &&
-                        _jsxs(_Fragment, { children: [_jsxs("div", { className: "w-full", children: [_jsxs("p", { className: "text-base items-center flex font-semibold self-center text-primary-text", children: [_jsx("span", { children: "Account Activation" }), _jsx(ClickTooltip, { moreClassNames: 'text-secondary-text', text: _jsxs("p", { children: [_jsxs("span", { children: [_jsx("span", { children: "The connected address is not " }), _jsx("span", { className: 'italic', children: "active" }), _jsxs("span", { children: [_jsx("span", { children: " in the zkSync Lite network." }), _jsx("p", { children: "You can learn more about account activation and the associated fee" })] })] }), _jsx("a", { target: '_blank', className: 'text-primary underline hover:no-underline decoration-primary cursor-pointer', href: "https://docs.zksync.io/userdocs/faq/#what-is-the-account-activation-fee/", children: "in the zkSync Lite FAQ" })] }) })] }), _jsx("p", { className: "text-sm text-primary-text break-normal", children: "Sign a message to activate your zkSync Lite account." }), _jsxs("p", { className: 'flex mt-4 w-full justify-between items-center text-sm text-secondary-text', children: [_jsx("span", { className: 'font-bold sm:inline hidden', children: "One time activation fee" }), " ", _jsx("span", { className: 'font-bold sm:hidden', children: "Fee" }), " ", _jsxs("span", { className: 'text-primary-text text-sm sm:text-base flex items-center', children: [activationFee?.feeInAsset, token?.symbol, _jsxs("span", { className: 'text-secondary-text text-sm', children: ["(", activationFee?.feeInUsd.toFixed(2), "$)"] })] })] })] }), _jsx(ButtonWrapper, { isDisabled: loading, isSubmitting: loading, onClick: activateAccout, icon: _jsx(SignatureIcon, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), children: "Sign to activate" })] }), syncWallet && accountIsActivated &&
-                        _jsx(ButtonWrapper, { isDisabled: !!(loading), isSubmitting: !!loading, onClick: handleTransfer, icon: _jsx(ArrowLeftRight, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), children: "Send from wallet" })] }) }) }));
+                        _jsxs(_Fragment, { children: [_jsxs("div", { className: "w-full", children: [_jsxs("p", { className: "text-base items-center flex font-semibold self-center text-primary-text", children: [_jsx("span", { children: "Account Activation" }), _jsx(ClickTooltip, { moreClassNames: 'text-secondary-text', text: _jsxs("p", { children: [_jsxs("span", { children: [_jsx("span", { children: "The connected address is not " }), _jsx("span", { className: 'italic', children: "active" }), _jsxs("span", { children: [_jsx("span", { children: " in the zkSync Lite network." }), _jsx("p", { children: "You can learn more about account activation and the associated fee" })] })] }), _jsx("a", { target: '_blank', className: 'text-primary underline hover:no-underline decoration-primary cursor-pointer', href: "https://docs.zksync.io/userdocs/faq/#what-is-the-account-activation-fee/", children: "in the zkSync Lite FAQ" })] }) })] }), _jsx("p", { className: "text-sm text-primary-text break-normal", children: "Sign a message to activate your zkSync Lite account." }), _jsxs("p", { className: 'flex mt-4 w-full justify-between items-center text-sm text-secondary-text', children: [_jsx("span", { className: 'font-bold sm:inline hidden', children: "One time activation fee" }), " ", _jsx("span", { className: 'font-bold sm:hidden', children: "Fee" }), " ", _jsxs("span", { className: 'text-primary-text text-sm sm:text-base flex items-center', children: [activationFee?.feeInAsset, source_token?.symbol, _jsxs("span", { className: 'text-secondary-text text-sm', children: ["(", activationFee?.feeInUsd.toFixed(2), "$)"] })] })] })] }), _jsx(ButtonWrapper, { isDisabled: loading, isSubmitting: loading, onClick: activateAccout, icon: _jsx(SignatureIcon, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), children: "Sign to activate" })] }), syncWallet && accountIsActivated &&
+                        _jsx(SendTransactionButton, { isDisabled: !!(loading), isSubmitting: !!loading, onClick: handleTransfer, icon: _jsx(ArrowLeftRight, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), swapData: swapBasicData, refuel: refuel })] }) }) }));
 };
-export default ZkSyncWalletWithdrawStep;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/index.d.ts

@@ -0,0 +1,11 @@
+export { ImtblxWalletWithdrawStep } from "./ImtblxWalletWithdrawStep";
+export { StarknetWalletWithdrawStep } from "./StarknetWalletWithdraw";
+export { EVMWalletWithdrawal } from "./EVMWalletWithdraw";
+export { ZkSyncWalletWithdrawStep } from "./ZKsyncWalletWithdraw";
+export { LoopringWalletWithdraw } from "./Loopring";
+export { TonWalletWithdrawStep } from "./TonWalletWithdraw";
+export { ParadexWalletWithdraw } from "./paradex/index";
+export { FuelWalletWithdrawStep } from "./FuelWalletWithdrawal";
+export { TronWalletWithdraw } from "./TronWalletWithdraw";
+export { SVMWalletWithdrawStep } from "./SVMWalletWithdraw";
+export { BitcoinWalletWithdrawStep } from "./BitcoinWalletWithdraw";

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/index.js

@@ -0,0 +1,11 @@
+export { ImtblxWalletWithdrawStep } from "./ImtblxWalletWithdrawStep";
+export { StarknetWalletWithdrawStep } from "./StarknetWalletWithdraw";
+export { EVMWalletWithdrawal } from "./EVMWalletWithdraw";
+export { ZkSyncWalletWithdrawStep } from "./ZKsyncWalletWithdraw";
+export { LoopringWalletWithdraw } from "./Loopring";
+export { TonWalletWithdrawStep } from "./TonWalletWithdraw";
+export { ParadexWalletWithdraw } from "./paradex/index";
+export { FuelWalletWithdrawStep } from "./FuelWalletWithdrawal";
+export { TronWalletWithdraw } from "./TronWalletWithdraw";
+export { SVMWalletWithdrawStep } from "./SVMWalletWithdraw";
+export { BitcoinWalletWithdrawStep } from "./BitcoinWalletWithdraw";

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/Evm.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { WithdrawPageProps } from '../../Common/sharedTypes';
+declare const ParadexWalletWithdrawStep: FC<WithdrawPageProps>;
+export default ParadexWalletWithdrawStep;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/Evm.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ChangeNetworkButton, ConnectWalletButton, SendTransactionButton } from '../../Common/buttons';
+import { useAccount } from 'wagmi';
+import { useSettingsState } from '../../../../../../../context/settings';
+import KnownInternalNames from '../../../../../../../lib/knownIds';
+import { useEthersSigner } from '../../../../../../../lib/ethersToViem/ethers';
+import toast from 'react-hot-toast';
+import AuhorizeEthereum from '../../../../../../../lib/wallets/paradex/Authorize/Ethereum';
+import useWallet from '../../../../../../../hooks/useWallet';
+import WalletIcon from '../../../../../../../components/Icons/WalletIcon';
+import { useSelectedAccount } from '../../../../../../../context/balanceAccounts';
+const ParadexWalletWithdrawStep = ({ swapBasicData, refuel }) => {
+    const [loading, setLoading] = useState(false);
+    const { networks } = useSettingsState();
+    const l1Network = networks.find(n => n.name === KnownInternalNames.Networks.EthereumMainnet || n.name === KnownInternalNames.Networks.EthereumSepolia);
+    const { source_token } = swapBasicData;
+    const { provider } = useWallet(l1Network, 'withdrawal');
+    const { chain } = useAccount();
+    const selectedSourceAccount = useSelectedAccount("from", provider?.name);
+    const wallet = selectedSourceAccount?.wallet;
+    const ethersSigner = useEthersSigner();
+    const handleTransfer = async ({ amount, callData, swapId }) => {
+        if (!source_token || !amount || !callData || !swapId || !ethersSigner)
+            return;
+        setLoading(true);
+        try {
+            const account = await AuhorizeEthereum(ethersSigner);
+            if (!account)
+                throw new Error('Account not found');
+            const res = await account.execute(JSON.parse(callData || ""), undefined, { maxFee: '1000000000000000' });
+            if (res.transaction_hash) {
+                return res.transaction_hash;
+            }
+        }
+        catch (e) {
+            setLoading(false);
+            if (e.message.includes('Contract not found')) {
+                toast.error('Account not found', { duration: 30000 });
+                throw e;
+            }
+            toast.error(e.message, { duration: 30000 });
+            throw e;
+        }
+    };
+    if (!wallet) {
+        return _jsx(ConnectWalletButton, {});
+    }
+    if (l1Network && chain?.id !== Number(l1Network.chain_id)) {
+        return (_jsx(ChangeNetworkButton, { chainId: Number(l1Network?.chain_id), network: l1Network }));
+    }
+    return (_jsx(SendTransactionButton, { isDisabled: !!(loading || !ethersSigner), isSubmitting: !!(loading || !ethersSigner), onClick: handleTransfer, icon: _jsx(WalletIcon, { className: "h-5 w-5 stroke-2", "aria-hidden": "true" }), swapData: swapBasicData, refuel: refuel, children: "Send from EVM wallet" }));
+};
+export default ParadexWalletWithdrawStep;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/Starknet.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { WithdrawPageProps } from '../../Common/sharedTypes';
+declare const StarknetComponent: FC<WithdrawPageProps>;
+export default StarknetComponent;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/Starknet.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { WalletIcon } from 'lucide-react';
+import { useCallback, useState } from 'react';
+import useWallet from '../../../../../../../hooks/useWallet';
+import { useSettingsState } from '../../../../../../../context/settings';
+import KnownInternalNames from '../../../../../../../lib/knownIds';
+import toast from 'react-hot-toast';
+import { AuthorizeStarknet } from '../../../../../../../lib/wallets/paradex/Authorize/Starknet';
+import { SendTransactionButton } from '../../Common/buttons';
+import { useSelectedAccount } from '../../../../../../../context/balanceAccounts';
+const StarknetComponent = ({ swapBasicData, refuel }) => {
+    const [loading, setLoading] = useState(false);
+    const { source_token } = swapBasicData;
+    const { networks } = useSettingsState();
+    const starknet = networks.find(n => n.name === KnownInternalNames.Networks.StarkNetMainnet || n.name === KnownInternalNames.Networks.StarkNetGoerli || n.name === KnownInternalNames.Networks.StarkNetSepolia);
+    const { provider } = useWallet(starknet, 'withdrawal');
+    const selectedSourceAccount = useSelectedAccount("from", provider?.name);
+    const handleTransfer = useCallback(async ({ amount, callData, swapId }) => {
+        if (!swapId || !source_token) {
+            return;
+        }
+        setLoading(true);
+        try {
+            if (!selectedSourceAccount) {
+                throw Error("Starknet wallet not connected");
+            }
+            if (amount == undefined && !amount)
+                throw Error("No amount");
+            try {
+                const snAccount = selectedSourceAccount.wallet?.metadata?.starknetAccount;
+                if (!snAccount) {
+                    throw Error("Starknet account not found");
+                }
+                const paradexAccount = await AuthorizeStarknet(snAccount);
+                const parsedCallData = JSON.parse(callData || "");
+                const res = await paradexAccount.execute(parsedCallData, undefined, { maxFee: '1000000000000000' });
+                if (res.transaction_hash) {
+                    return res.transaction_hash;
+                }
+            }
+            catch (e) {
+                toast(e.message);
+            }
+        }
+        catch (e) {
+            setLoading(false);
+            if (e?.message)
+                toast(e.message);
+            throw e;
+        }
+    }, [selectedSourceAccount?.address, starknet, source_token]);
+    return (_jsx("div", { className: "w-full space-y-5 flex flex-col justify-between h-full text-secondary-text", children: selectedSourceAccount &&
+            _jsx("div", { className: "flex flex-row\n                    text-primary-text text-base space-x-2", children: _jsx(SendTransactionButton, { isDisabled: !!(loading), isSubmitting: !!(loading), onClick: handleTransfer, icon: _jsx(WalletIcon, { className: "h-5 w-5 ml-2", "aria-hidden": "true" }), swapData: swapBasicData, refuel: refuel, children: "Send from Starknet wallet" }) }) }));
+};
+export default StarknetComponent;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/index.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { WithdrawPageProps } from '../../Common/sharedTypes';
+export declare const ParadexWalletWithdraw: FC<WithdrawPageProps>;

package/dist/components/Pages/Swap/Withdraw/Wallet/WithdrawalProviders/paradex/index.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import useWallet from '../../../../../../../hooks/useWallet';
+import { useSettingsState } from '../../../../../../../context/settings';
+import KnownInternalNames from '../../../../../../../lib/knownIds';
+import Evm from './Evm';
+import Starknet from './Starknet';
+import { useSwapDataState } from '../../../../../../../context/swap';
+import SubmitButton from '../../../../../../../components/Buttons/submitButton';
+import { WalletIcon } from 'lucide-react';
+import { useConnectModal } from '../../../../../../../components/Wallet/WalletModal';
+import { useActiveParadexAccount } from '../../../../../../../components/Wallet/WalletProviders/ActiveParadexAccount';
+import { useSelectedAccount, useUpdateBalanceAccount } from '../../../../../../../context/balanceAccounts';
+export const ParadexWalletWithdraw = ({ refuel, swapBasicData, swapId }) => {
+    const { networks } = useSettingsState();
+    const l1Network = networks.find(n => n.name === KnownInternalNames.Networks.EthereumMainnet || n.name === KnownInternalNames.Networks.EthereumSepolia);
+    const starknet = networks.find(n => n.name === KnownInternalNames.Networks.StarkNetMainnet || n.name === KnownInternalNames.Networks.StarkNetGoerli || n.name === KnownInternalNames.Networks.StarkNetSepolia);
+    const { activeConnection } = useActiveParadexAccount();
+    const { provider: evmProvider } = useWallet(l1Network, 'withdrawal');
+    const { provider: starknetProvider } = useWallet(starknet, 'withdrawal');
+    const selectedEvmAccount = useSelectedAccount("from", evmProvider?.name);
+    const selectedStarknetAccount = useSelectedAccount("from", starknetProvider?.name);
+    const evmWallet = selectedEvmAccount?.wallet;
+    const starknetWallet = selectedStarknetAccount?.wallet;
+    if (activeConnection?.providerName === evmProvider?.name && evmWallet) {
+        return _jsx(Evm, { refuel: refuel, swapBasicData: swapBasicData, swapId: swapId });
+    }
+    if (activeConnection?.providerName === starknetProvider?.name && starknetWallet) {
+        return _jsx(Starknet, { refuel: refuel, swapBasicData: swapBasicData, swapId: swapId });
+    }
+    return _jsx(ConnectWalletModal, {});
+};
+const ConnectWalletModal = () => {
+    const { swapBasicData } = useSwapDataState();
+    const { source_network } = swapBasicData || {};
+    const { provider } = useWallet(source_network, 'withdrawal');
+    const { connect } = useConnectModal();
+    const selectSourceAccount = useUpdateBalanceAccount("from");
+    const handleConnect = async () => {
+        const result = await connect(provider);
+        if (result) {
+            selectSourceAccount({
+                id: result.id,
+                address: result.address,
+                providerName: result.providerName
+            });
+        }
+    };
+    return _jsx(SubmitButton, { onClick: handleConnect, type: "button", icon: _jsx(WalletIcon, { className: "h-6 w-6", strokeWidth: 2 }), children: "Connect a wallet" });
+};

package/dist/components/Pages/Swap/Withdraw/Wallet/index.d.ts

@@ -0,0 +1,10 @@
+import { FC } from "react";
+import { SwapBasicData } from "../../../../../lib/apiClients/layerSwapApiClient";
+type Props = {
+    swapData: SwapBasicData;
+    swapId: string | undefined;
+    refuel: boolean;
+    onWalletWithdrawalSuccess?: () => void;
+};
+export declare const WalletTransferAction: FC<Props>;
+export {};

package/dist/components/Pages/Swap/Withdraw/Wallet/index.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo } from "react";
+import KnownInternalNames from "../../../../../lib/knownIds";
+import { NetworkType } from "../../../../../Models/Network";
+import { ImtblxWalletWithdrawStep, BitcoinWalletWithdrawStep, EVMWalletWithdrawal, FuelWalletWithdrawStep, LoopringWalletWithdraw, ParadexWalletWithdraw, SVMWalletWithdrawStep, StarknetWalletWithdrawStep, TonWalletWithdrawStep, TronWalletWithdraw, ZkSyncWalletWithdrawStep } from "./WithdrawalProviders";
+import { WithdrawalProvider } from "../../../../../context/withdrawalContext";
+import useWallet from "../../../../../hooks/useWallet";
+import { useSelectedAccount } from "../../../../../context/balanceAccounts";
+//TODO have separate components for evm and none_evm as others are sweepless anyway
+export const WalletTransferAction = ({ swapData, swapId, refuel, onWalletWithdrawalSuccess }) => {
+    const { source_network } = swapData;
+    const source_network_internal_name = source_network?.name;
+    const { provider } = useWallet(swapData.source_network, "withdrawal");
+    const selectedSourceAccount = useSelectedAccount("from", provider?.name);
+    const WithdrawalPages = useMemo(() => [
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.ImmutableXMainnet,
+                KnownInternalNames.Networks.ImmutableXGoerli,
+                KnownInternalNames.Networks.ImmutableXSepolia
+            ],
+            component: ImtblxWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.StarkNetMainnet,
+                KnownInternalNames.Networks.StarkNetGoerli,
+                KnownInternalNames.Networks.StarkNetSepolia
+            ],
+            component: StarknetWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.ZksyncMainnet,
+            ],
+            component: ZkSyncWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.LoopringMainnet,
+                KnownInternalNames.Networks.LoopringGoerli,
+                KnownInternalNames.Networks.LoopringSepolia
+            ],
+            component: LoopringWalletWithdraw
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.TONMainnet,
+                KnownInternalNames.Networks.TONTestnet
+            ],
+            component: TonWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.ParadexMainnet,
+                KnownInternalNames.Networks.ParadexTestnet
+            ],
+            component: ParadexWalletWithdraw
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.FuelMainnet,
+                KnownInternalNames.Networks.FuelTestnet
+            ],
+            component: FuelWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.TronMainnet
+            ],
+            component: TronWalletWithdraw
+        },
+        {
+            supportedNetworks: [
+                KnownInternalNames.Networks.BitcoinMainnet,
+                KnownInternalNames.Networks.BitcoinTestnet
+            ],
+            component: BitcoinWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                source_network?.type == NetworkType.Solana ? source_network.name : undefined
+            ],
+            component: SVMWalletWithdrawStep
+        },
+        {
+            supportedNetworks: [
+                source_network?.type == NetworkType.EVM ? source_network.name : undefined
+            ],
+            component: EVMWalletWithdrawal
+        }
+    ], [source_network]);
+    const WithdrawalComponent = WithdrawalPages.find(page => page.supportedNetworks.includes(source_network_internal_name))?.component;
+    useEffect(() => {
+        if (selectedSourceAccount) {
+            provider?.switchAccount(selectedSourceAccount.wallet, selectedSourceAccount.address);
+        }
+    }, [selectedSourceAccount?.address]);
+    return _jsx(_Fragment, { children: swapData && WithdrawalComponent &&
+            _jsx(WithdrawalProvider, { onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, children: _jsx(WithdrawalComponent, { swapId: swapId, swapBasicData: swapData, refuel: refuel }) }) });
+};

package/dist/components/Pages/Swap/Withdraw/WalletTransferButton.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { SwapBasicData } from '../../../../lib/apiClients/layerSwapApiClient';
+type Props = {
+    swapBasicData: SwapBasicData;
+    swapId: string | undefined;
+    refuel: boolean;
+    balanceWarning?: JSX.Element | null;
+    onWalletWithdrawalSuccess?: () => void;
+};
+declare const WalletTransferButton: FC<Props>;
+export default WalletTransferButton;

package/dist/components/Pages/Swap/Withdraw/WalletTransferButton.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import SwitchIcon from '../../../../components/Icons/SwitchIcon';
+import WalletTransferContent from './WalletTransferContent';
+import { useState } from 'react';
+import { WalletTransferAction } from './Wallet';
+const WalletTransferButton = ({ swapBasicData: swapData, swapId, refuel, balanceWarning, onWalletWithdrawalSuccess }) => {
+    const [openModal, setOpenModal] = useState(false);
+    return _jsx(_Fragment, { children: _jsxs("div", { className: 'rounded-2xl bg-secondary-500 divide-y divide-secondary-300 p-3', children: [_jsxs("div", { className: "flex justify-between pb-3", children: [_jsx("p", { className: "text-base  text-secondary-text font-normal", children: "Sending from wallet" }), _jsxs("button", { type: 'button', onClick: () => setOpenModal(true), className: 'inline-flex items-center gap-1 px-2 bg-secondary-300 hover:bg-secondary-400 rounded-lg text-xs', children: [_jsx(SwitchIcon, {}), _jsx("p", { children: "Switch" })] })] }), _jsxs("div", { children: [_jsx(WalletTransferContent, { openModal: openModal, setOpenModal: setOpenModal, swapData: swapData }), balanceWarning, _jsx(WalletTransferAction, { swapData: swapData, swapId: swapId, refuel: refuel, onWalletWithdrawalSuccess: onWalletWithdrawalSuccess })] })] }) });
+};
+export default WalletTransferButton;

package/dist/components/Pages/Swap/Withdraw/WalletTransferContent.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { SwapBasicData } from '../../../../lib/apiClients/layerSwapApiClient';
+type Props = {
+    swapData: SwapBasicData;
+    openModal: boolean;
+    setOpenModal: (show: boolean) => void;
+};
+declare const WalletTransferContent: FC<Props>;
+export default WalletTransferContent;

package/dist/components/Pages/Swap/Withdraw/WalletTransferContent.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import WalletIcon from '../../../../components/Icons/WalletIcon';
+import useWallet from '../../../../hooks/useWallet';
+import AddressWithIcon from '../../../../components/Input/Address/AddressPicker/AddressWithIcon';
+import { AddressGroup } from '../../../../components/Input/Address/AddressPicker';
+import { truncateDecimals } from '../../../../components/utils/RoundDecimals';
+import VaulDrawer from '../../../../components/Modal/vaulModal';
+import { useSettingsState } from '../../../../context/settings';
+import WalletsList from '../../../../components/Wallet/WalletComponents/WalletsList';
+import { useSelectedAccount, useUpdateBalanceAccount } from '../../../../context/balanceAccounts';
+import { useBalance } from '../../../../lib/balances/useBalance';
+const WalletTransferContent = ({ openModal, setOpenModal, swapData }) => {
+    const { networks } = useSettingsState();
+    const { source_token, source_network: swap_source_network } = swapData;
+    const source_network = swap_source_network && networks.find(n => n.name === swap_source_network?.name);
+    const { provider } = useWallet(source_network, 'withdrawal');
+    const selectedSourceAccount = useSelectedAccount("from", provider?.name);
+    const availableWallets = provider?.connectedWallets?.filter(c => !c.isNotAvailable) || [];
+    const selectSourceAccount = useUpdateBalanceAccount("from");
+    const changeWallet = async (props) => {
+        selectSourceAccount({
+            id: props.walletId,
+            address: props.address,
+            providerName: props.providerName
+        });
+        setOpenModal(false);
+    };
+    const { balances } = useBalance(selectedSourceAccount?.address, source_network);
+    const walletBalance = source_network && balances?.find(b => b?.network === source_network?.name && b?.token === source_token?.symbol);
+    const walletBalanceAmount = walletBalance?.amount && truncateDecimals(walletBalance?.amount, source_token?.precision);
+    let accountAddress = "";
+    if (selectedSourceAccount) {
+        accountAddress = selectedSourceAccount.address || "";
+    }
+    if (!accountAddress) {
+        return _jsx(_Fragment, { children: _jsx("div", { className: 'flex justify-center', children: _jsx(WalletIcon, { className: 'w-12 text-secondary-800/70' }) }) });
+    }
+    return _jsxs(_Fragment, { children: [_jsx("div", { className: "grid content-end", children: selectedSourceAccount &&
+                    source_network &&
+                    _jsxs("div", { className: "group/addressItem flex rounded-lg justify-between space-x-3 items-center shadow-xs mt-1.5 text-primary-text bg-secondary-500 disabled:cursor-not-allowed h-12 leading-4 font-medium w-full py-7", children: [_jsx(AddressWithIcon, { addressItem: { address: accountAddress, group: AddressGroup.ConnectedWallet, wallet: selectedSourceAccount.wallet }, network: source_network, onDisconnect: () => selectedSourceAccount.wallet?.disconnect && selectedSourceAccount.wallet?.disconnect() }), _jsxs("div", { className: "flex flex-col col-start-8 col-span-3 items-end font-normal text-secondary-text text-xs", children: [_jsx("p", { children: "Balance" }), _jsxs("p", { className: 'flex items-center gap-1', children: [_jsx("span", { children: truncateDecimals(Number(walletBalanceAmount), walletBalance?.decimals) }), " ", _jsx("span", { children: walletBalance?.token })] })] })] }) }), source_network &&
+                source_token &&
+                provider &&
+                availableWallets &&
+                _jsx(VaulDrawer, { show: openModal, setShow: setOpenModal, header: `Send from`, modalId: "connectedWallets", children: _jsx(VaulDrawer.Snap, { id: 'item-1', children: _jsx(WalletsList, { network: source_network, token: source_token, onSelect: changeWallet, selectable: true, wallets: availableWallets, provider: provider }) }) })] });
+};
+export default WalletTransferContent;

package/dist/components/Pages/Swap/Withdraw/Withdraw.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+declare const Withdraw: FC<{
+    type: 'widget' | 'contained';
+    onWalletWithdrawalSuccess?: () => void;
+}>;
+export default Withdraw;

package/dist/components/Pages/Swap/Withdraw/Withdraw.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useSwapDataState } from '../../../../context/swap';
+import KnownInternalNames from '../../../../lib/knownIds';
+import SwapSummary from './Summary';
+import External from './External';
+import { useInitialSettings } from '../../../../context/settings';
+import { Widget } from '../../../../components/Widget/Index';
+import { SwapQuoteDetails } from './SwapQuoteDetails';
+import WalletTransferButton from './WalletTransferButton';
+import useWallet from '../../../../hooks/useWallet';
+import { useBalance } from '../../../../lib/balances/useBalance';
+import { useSettingsState } from '../../../../context/settings';
+import { InsufficientBalanceWarning } from '../../../../components/Pages/Swap/Form/SecondaryComponents/validationError/insufficientBalance';
+import { useSelectedAccount } from '../../../../context/balanceAccounts';
+const Withdraw = ({ type, onWalletWithdrawalSuccess }) => {
+    const { swapBasicData, swapDetails, quote, refuel, quoteIsLoading } = useSwapDataState();
+    const { appName, signature } = useInitialSettings();
+    const sourceIsImmutableX = swapBasicData?.source_network.name?.toUpperCase() === KnownInternalNames.Networks.ImmutableXMainnet?.toUpperCase()
+        || swapBasicData?.source_network.name === KnownInternalNames.Networks.ImmutableXGoerli?.toUpperCase();
+    const isImtblMarketplace = (signature && appName === "imxMarketplace" && sourceIsImmutableX);
+    const { networks } = useSettingsState();
+    const source_network = swapBasicData?.source_network && networks.find(n => n.name === swapBasicData?.source_network?.name);
+    const { provider } = useWallet(source_network, 'withdrawal');
+    const selectedAccount = useSelectedAccount("from", provider?.name);
+    const { balances } = useBalance(selectedAccount?.address, source_network);
+    const walletBalance = source_network && balances?.find(b => b?.network === source_network?.name && b?.token === swapBasicData?.source_token?.symbol);
+    const walletBalanceAmount = walletBalance?.amount;
+    let withdraw = {};
+    const showInsufficientBalanceWarning = swapBasicData?.use_deposit_address === false
+        && swapBasicData?.requested_amount
+        && Number(swapBasicData?.requested_amount)
+        && Number(walletBalanceAmount) < Number(swapBasicData?.requested_amount);
+    if (swapBasicData?.use_deposit_address === false) {
+        withdraw = {
+            footer: _jsx(WalletTransferButton, { swapBasicData: swapBasicData, swapId: swapDetails?.id, refuel: !!refuel, onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, balanceWarning: showInsufficientBalanceWarning ? _jsx(InsufficientBalanceWarning, {}) : null })
+        };
+    }
+    if (isImtblMarketplace) {
+        withdraw = {
+            content: _jsx(External, {})
+        };
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(Widget.Content, { children: _jsx("div", { className: "w-full flex flex-col justify-between  text-secondary-text", children: _jsxs("div", { className: 'grid grid-cols-1 gap-3 ', children: [_jsx(SwapSummary, {}), _jsx(SwapQuoteDetails, { swapBasicData: swapBasicData, quote: quote, refuel: refuel, quoteIsLoading: quoteIsLoading }), withdraw?.content] }) }) }), withdraw?.footer &&
+                _jsx(Widget.Footer, { sticky: type == 'widget', children: withdraw?.footer })] }));
+};
+export default Withdraw;