@layerswap/widget 1.0.6 → 1.1.1

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

@@ -2,13 +2,15 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useCallback, useEffect, useState } from "react";
 import { WithdrawalProvider } from "../../../../../context/withdrawalContext";
 import useWallet from "../../../../../hooks/useWallet";
-import { useSelectedAccount } from "../../../../../context/balanceAccounts";
+import { useSelectedAccount } from "../../../../../context/swapAccounts";
 import { ChangeNetworkButton, ConnectWalletButton, SendTransactionButton } from "./Common/buttons";
-import TransactionMessages, { TransactionMessageType } from "../messages/TransactionMessages";
 import { useInitialSettings, useSettingsState } from "../../../../../context/settings";
 import WalletIcon from "../../../../../components/Icons/WalletIcon";
 import { useBalance } from "../../../../../lib/balances/useBalance";
-export const WalletTransferAction = ({ swapData, swapId, refuel, onWalletWithdrawalSuccess }) => {
+import { ActionMessage } from "./Common/actionMessage";
+import { ActionMessages } from "../messages/TransactionMessages";
+import { useTransfer } from "../../../../../hooks/useTransfer";
+export const WalletTransferAction = ({ swapData, swapId, refuel, onWalletWithdrawalSuccess, onCancelWithdrawal }) => {
     const { source_network } = swapData;
     const { provider, wallets } = useWallet(source_network, "withdrawal");
     const selectedSourceAccount = useSelectedAccount("from", source_network?.name);
@@ -19,7 +21,7 @@ export const WalletTransferAction = ({ swapData, swapId, refuel, onWalletWithdra
         }
     }, [selectedSourceAccount?.address, source_network?.name]);
     return _jsx(_Fragment, { children: swapData &&
-            _jsx(WithdrawalProvider, { onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, children: _jsx(WalletWithdrawal, { swapId: swapId, swapBasicData: swapData, refuel: refuel }) }) });
+            _jsx(WithdrawalProvider, { onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, onCancelWithdrawal: onCancelWithdrawal, children: _jsx(WalletWithdrawal, { swapId: swapId, swapBasicData: swapData, refuel: refuel }) }) });
 };
 export const WalletWithdrawal = ({ swapBasicData, refuel, swapId }) => {
     const { source_network, destination_network, destination_address } = swapBasicData;
@@ -27,7 +29,7 @@ export const WalletWithdrawal = ({ swapBasicData, refuel, swapId }) => {
     const { wallets, provider } = useWallet(source_network, "withdrawal");
     const { sameAccountNetwork } = useInitialSettings();
     const wallet = wallets.find(w => w.id === selectedSourceAccount?.id && w.withdrawalSupportedNetworks?.includes(source_network?.name));
-    const networkChainId = Number(source_network?.chain_id) ?? undefined;
+    const networkChainId = source_network?.chain_id ?? undefined;
     const [savedTransactionHash, setSavedTransactionHash] = useState();
     useEffect(() => {
         if (!swapId)
@@ -54,16 +56,16 @@ export const WalletWithdrawal = ({ swapBasicData, refuel, swapId }) => {
     if ((source_network?.name.toLowerCase() === sameAccountNetwork?.toLowerCase() || destination_network?.name.toLowerCase() === sameAccountNetwork?.toLowerCase())
         && (selectedSourceAccount?.address && destination_address && selectedSourceAccount?.address.toLowerCase() !== destination_address?.toLowerCase())) {
         const network = source_network?.name.toLowerCase() === sameAccountNetwork?.toLowerCase() ? source_network : destination_network;
-        return _jsx(TransactionMessages.DifferentAccountsNotAllowedError, { network: network?.display_name });
+        return _jsx(ActionMessages.DifferentAccountsNotAllowedError, { network: network?.display_name });
     }
     if (!wallet) {
         return _jsx(ConnectWalletButton, {});
     }
-    else if (wallet.chainId && wallet.chainId !== networkChainId && source_network) {
-        return _jsx(ChangeNetworkButton, { chainId: networkChainId, network: source_network });
+    else if (wallet.chainId && wallet.chainId != networkChainId && source_network) {
+        return _jsx(ChangeNetworkButton, { chainId: Number(networkChainId), network: source_network });
     }
     else {
-        return _jsx(TransferTokenButton, { swapData: swapBasicData, refuel: refuel, chainId: networkChainId, savedTransactionHash: savedTransactionHash });
+        return _jsx(TransferTokenButton, { swapData: swapBasicData, refuel: refuel, chainId: Number(networkChainId), savedTransactionHash: savedTransactionHash });
     }
 };
 const TransferTokenButton = ({ savedTransactionHash, chainId, swapData, refuel }) => {
@@ -76,7 +78,8 @@ const TransferTokenButton = ({ savedTransactionHash, chainId, swapData, refuel }
     const { provider, wallets } = useWallet(swapData.source_network, "withdrawal");
     const { balances } = useBalance(selectedSourceAccount?.address, networkWithTokens);
     const wallet = wallets.find(w => w.id === selectedSourceAccount?.id);
-    const clickHandler = useCallback(async ({ amount, callData, depositAddress }) => {
+    const { executeTransfer } = useTransfer();
+    const clickHandler = useCallback(async ({ amount, callData, depositAddress, swapId }) => {
         setButtonClicked(true);
         setError(undefined);
         setLoading(true);
@@ -87,22 +90,47 @@ const TransferTokenButton = ({ savedTransactionHash, chainId, swapData, refuel }
                 throw new Error('Missing amount');
             if (!wallet)
                 throw new Error('No selected account');
-            if (!provider?.transfer)
-                throw new Error('No provider transfer');
-            const tx = await provider.transfer({
-                token: swapData.source_token,
-                amount,
-                depositAddress,
-                callData,
-                selectedWallet: wallet,
-                network: swapData.source_network,
-                balances: balances,
-                userDestinationAddress: swapData.destination_address,
-            });
-            if (!tx)
-                throw new Error('No transaction');
-            if (tx) {
-                return tx;
+            try {
+                const tx = await executeTransfer({
+                    token: swapData.source_token,
+                    amount,
+                    depositAddress,
+                    callData,
+                    selectedWallet: wallet,
+                    network: swapData.source_network,
+                    balances: balances,
+                    userDestinationAddress: swapData.destination_address,
+                    swapId,
+                }, wallet);
+                if (!tx)
+                    throw new Error('No transaction');
+                if (tx) {
+                    return tx;
+                }
+            }
+            catch (e) {
+                if (typeof e === 'string' && e?.includes('No transfer provider found for network:')) {
+                    if (!provider?.transfer)
+                        throw new Error('No provider transfer');
+                    const tx = await provider.transfer({
+                        token: swapData.source_token,
+                        amount,
+                        depositAddress,
+                        callData,
+                        selectedWallet: wallet,
+                        network: swapData.source_network,
+                        balances: balances,
+                        userDestinationAddress: swapData.destination_address,
+                    }, wallet);
+                    if (!tx)
+                        throw new Error('No transaction');
+                    if (tx) {
+                        return tx;
+                    }
+                }
+                else {
+                    throw e;
+                }
             }
         }
         catch (e) {
@@ -110,45 +138,8 @@ const TransferTokenButton = ({ savedTransactionHash, chainId, swapData, refuel }
             setError(e);
             throw e;
         }
-    }, [provider, chainId, selectedSourceAccount?.address]);
+    }, [executeTransfer, chainId, selectedSourceAccount?.address, wallet, swapData, balances]);
     return _jsxs("div", { className: "w-full space-y-3 flex flex-col justify-between h-full text-primary-text", children: [buttonClicked &&
-                _jsx(TransactionMessage, { error: error, isLoading: loading }), !loading &&
+                _jsx(ActionMessage, { error: error, isLoading: loading }), !loading &&
                 _jsx(SendTransactionButton, { onClick: clickHandler, icon: _jsx(WalletIcon, { className: "stroke-2 w-6 h-6" }), error: !!error && buttonClicked, swapData: swapData, refuel: refuel })] });
 };
-const TransactionMessage = ({ error, isLoading }) => {
-    if (isLoading) {
-        return _jsx(TransactionMessages.ConfirmTransactionMessage, {});
-    }
-    else if (error.name === TransactionMessageType.TransactionRejected) {
-        return _jsx(TransactionMessages.TransactionRejectedMessage, {});
-    }
-    else if (error.name === TransactionMessageType.TransactionFailed) {
-        return _jsx(TransactionMessages.TransactionFailedMessage, {});
-    }
-    else if (error.name === TransactionMessageType.InsufficientFunds) {
-        return _jsx(TransactionMessages.InsufficientFundsMessage, {});
-    }
-    else if (error.name === TransactionMessageType.WaletMismatch) {
-        return _jsx(TransactionMessages.WaletMismatchMessage, { address: error.message });
-    }
-    else if (error.name === TransactionMessageType.DifferentAccountsNotAllowedError) {
-        return _jsx(TransactionMessages.DifferentAccountsNotAllowedError, { network: error.message });
-    }
-    else if (error) {
-        const swapWithdrawalError = new Error(error.message);
-        swapWithdrawalError.name = `SwapWithdrawalError`;
-        swapWithdrawalError.cause = error;
-        // posthog.captureException('$exception', {
-        //     name: swapWithdrawalError.name,
-        //     message: swapWithdrawalError.message,
-        //     $layerswap_exception_type: "Swap Withdrawal Error",
-        //     stack: swapWithdrawalError.stack,
-        //     cause: swapWithdrawalError.cause,
-        //     where: 'swapWithdrawalError',
-        //     severity: 'error',
-        // });
-        return _jsx(TransactionMessages.UnexpectedErrorMessage, { message: error.message });
-    }
-    else
-        return _jsx(_Fragment, {});
-};

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { WalletTransferAction } from './Wallet';
-const WalletTransferButton = ({ swapBasicData: swapData, swapId, refuel, balanceWarning, onWalletWithdrawalSuccess }) => {
-    return _jsx(_Fragment, { children: _jsx("div", { className: 'rounded-2xl bg-secondary-500 divide-y divide-secondary-300 p-3', children: _jsxs("div", { className: 'flex flex-col gap-2.5', children: [balanceWarning, _jsx(WalletTransferAction, { swapData: swapData, swapId: swapId, refuel: refuel, onWalletWithdrawalSuccess: onWalletWithdrawalSuccess })] }) }) });
+const WalletTransferButton = ({ swapBasicData: swapData, swapId, refuel, balanceWarning, onWalletWithdrawalSuccess, onCancelWithdrawal }) => {
+    return _jsx(_Fragment, { children: _jsxs("div", { className: 'space-y-2.5', children: [balanceWarning, _jsx(WalletTransferAction, { swapData: swapData, swapId: swapId, refuel: refuel, onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, onCancelWithdrawal: onCancelWithdrawal })] }) });
 };
 export default WalletTransferButton;

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

@@ -7,7 +7,7 @@ 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 { useSelectedAccount, useSelectSwapAccount } from '../../../../context/swapAccounts';
 import { useBalance } from '../../../../lib/balances/useBalance';
 const WalletTransferContent = ({ openModal, setOpenModal, swapData }) => {
     const { networks } = useSettingsState();
@@ -16,7 +16,7 @@ const WalletTransferContent = ({ openModal, setOpenModal, swapData }) => {
     const { provider } = useWallet(source_network, 'withdrawal');
     const selectedSourceAccount = useSelectedAccount("from", source_network?.name);
     const availableWallets = provider?.connectedWallets?.filter(c => !c.isNotAvailable) || [];
-    const selectSourceAccount = useUpdateBalanceAccount("from");
+    const selectSourceAccount = useSelectSwapAccount("from");
     const changeWallet = async (props) => {
         selectSourceAccount({
             id: props.walletId,

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

@@ -9,9 +9,9 @@ import { SwapQuoteDetails } from './SwapQuoteDetails';
 import WalletTransferButton from './WalletTransferButton';
 import { useBalance } from '../../../../lib/balances/useBalance';
 import { useSettingsState } from '../../../../context/settings';
-import { useSelectedAccount } from '../../../../context/balanceAccounts';
+import { useSelectedAccount } from '../../../../context/swapAccounts';
 import { ErrorDisplay } from '../../../../components/Pages/Swap/Form/SecondaryComponents/validationError/ErrorDisplay';
-const Withdraw = ({ type, onWalletWithdrawalSuccess, partner }) => {
+const Withdraw = ({ type, onWalletWithdrawalSuccess, onCancelWithdrawal, partner }) => {
     const { swapBasicData, swapDetails, quote, refuel, quoteIsLoading, quoteError } = useSwapDataState();
     const { appName, signature } = useInitialSettings();
     const sourceIsImmutableX = swapBasicData?.source_network.name?.toUpperCase() === KnownInternalNames.Networks.ImmutableXMainnet?.toUpperCase()
@@ -30,7 +30,7 @@ const Withdraw = ({ type, onWalletWithdrawalSuccess, partner }) => {
         && 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(ErrorDisplay, { errorName: 'insufficientFunds' }) : null })
+            footer: _jsx(WalletTransferButton, { swapBasicData: swapBasicData, swapId: swapDetails?.id, refuel: !!refuel, onWalletWithdrawalSuccess: onWalletWithdrawalSuccess, balanceWarning: showInsufficientBalanceWarning ? _jsx(ErrorDisplay, { errorName: 'insufficientFunds' }) : null, onCancelWithdrawal: onCancelWithdrawal })
         };
     }
     if (isImtblMarketplace) {

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

@@ -5,18 +5,19 @@ import { Widget } from "../../../Widget/Index";
 import { SwapDataProvider, useSwapDataState, useSwapDataUpdate } from "../../../../context/swap";
 import NotFound from "./NotFound";
 import SwapDetails from "./SwapDetails";
-import { LayerswapProvider } from "../../../../context/LayerswapProvider";
+import { useCallbacks } from "../../../../context/callbackProvider";
 const Comp = () => {
     const { swapBasicData, swapApiError, swapId } = useSwapDataState();
     const { mutateSwap } = useSwapDataUpdate();
+    const { onBackClick } = useCallbacks();
     useEffect(() => {
         mutateSwap();
     }, []);
     if (!swapBasicData)
-        return _jsx(Widget, { children: _jsx("div", { className: `rounded-lg w-full overflow-hidden relative h-[548px]`, children: swapApiError &&
+        return _jsx(Widget, { goBack: onBackClick, children: _jsx("div", { className: `rounded-lg w-full overflow-hidden relative h-[548px]`, children: swapApiError &&
                     _jsx(NotFound, { swapId: swapId }) }) });
     return (_jsx(SwapDetails, { type: "widget" }));
 };
-export const SwapWithdrawal = (props) => {
-    return (_jsx(LayerswapProvider, { ...props, children: _jsx(SwapDataProvider, { children: _jsx(Comp, {}) }) }));
+export const SwapWithdrawal = () => {
+    return (_jsx(SwapDataProvider, { children: _jsx(Comp, {}) }));
 };

package/dist/esm/components/Pages/Swap/Withdraw/messages/Message.js

@@ -3,9 +3,9 @@ import { ChevronDown } from "lucide-react";
 import FailIcon from "../../../../Icons/FailIcon";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../../../../../components/shadcn/accordion";
 const WalletMessage = ({ header, details, status, showInModal }) => {
-    return _jsxs("div", { className: "flex text-center space-x-2", children: [_jsx("div", { className: 'relative -mt-0.5', children: status === "error" ?
-                    _jsx(FailIcon, { className: "relative top-0 left-0 w-6 h-6 md:w-7 md:h-7" })
-                    :
-                        _jsxs(_Fragment, { children: [_jsx("div", { className: 'absolute top-1 left-1 w-4 h-4 md:w-5 md:h-5 opacity-40 bg bg-primary rounded-full animate-ping' }), _jsx("div", { className: 'absolute top-2 left-2 w-2 h-2 md:w-3 md:h-3 opacity-40 bg bg-primary rounded-full animate-ping' }), _jsx("div", { className: 'relative top-0 left-0 w-6 h-6 md:w-7 md:h-7 scale-50 bg bg-primary rounded-full ' })] }) }), showInModal ? (_jsx("div", { className: "text-left space-y-1 w-full max-w-2xl", children: _jsx(Accordion, { type: "single", collapsible: true, children: _jsxs(AccordionItem, { value: "wallet-message", children: [_jsxs(AccordionTrigger, { className: "flex justify-between w-full items-center", children: [_jsx("p", { className: "text-md font-semibold self-center text-primary-text", children: header }), _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-primary-text transition-transform duration-200 data-[state=open]:rotate-180" })] }), _jsx(AccordionContent, { children: _jsx("div", { className: "text-left space-y-1", children: _jsx("p", { className: "text-sm text-secondary-text wrap-anywhere whitespace-pre-wrap", children: details }) }) })] }) }) })) : (_jsxs("div", { className: "text-left space-y-1", children: [_jsx("p", { className: "text-md font-semibold self-center text-primary-text", children: header }), _jsx("p", { className: `text-sm text-secondary-text ${details.length > 200 ? "break-words" : ""}`, children: details })] }))] });
+    return _jsx(_Fragment, { children: _jsx("div", { className: "px-2 py-3 rounded-2xl bg-secondary-400", children: _jsxs("div", { className: "flex items-start gap-2 relative", children: [_jsx("span", { className: "shrink-0 p-0.5", children: status === "error" ?
+                            _jsx(FailIcon, { className: "relative top-0 left-0 h-5 w-5" })
+                            :
+                                _jsxs(_Fragment, { children: [_jsx("div", { className: 'absolute top-1.5 left-1.5 w-4 h-4 md:w-5 md:h-5 opacity-40 bg bg-primary rounded-full animate-ping' }), _jsx("div", { className: 'absolute top-2.5 left-2.5 w-2 h-2 md:w-3 md:h-3 opacity-40 bg bg-primary rounded-full animate-ping' }), _jsx("div", { className: 'relative top-0 left-0 w-6 h-6 md:w-7 md:h-7 scale-50 bg bg-primary rounded-full ' })] }) }), showInModal ? (_jsx("div", { className: "text-left space-y-1 w-full max-w-2xl", children: _jsx(Accordion, { type: "single", collapsible: true, children: _jsxs(AccordionItem, { value: "wallet-message", children: [_jsxs(AccordionTrigger, { className: "flex justify-between w-full items-center mt-0.5", children: [_jsx("p", { className: "text-primary-text font-medium leading-4 text-base mt-0.5", children: header }), _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-primary-text transition-transform duration-200 data-[state=open]:rotate-180" })] }), _jsx(AccordionContent, { children: _jsx("div", { className: "text-left space-y-1", children: _jsx("p", { className: "text-sm text-secondary-text wrap-anywhere whitespace-pre-wrap", children: details }) }) })] }) }) })) : (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-primary-text font-medium leading-4 text-base mt-0.5", children: header }), details ? _jsx("p", { className: "text-secondary-text text-sm leading-[18px]", children: details }) : null] }))] }) }) });
 };
 export default WalletMessage;

package/dist/esm/components/Pages/Swap/Withdraw/messages/TransactionMessages.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import WalletMessage from "./Message";
 import shortenAddress from "../../../../../components/utils/ShortenAddress";
-const ConfirmTransactionMessage = () => {
+const ConfirmActionMessage = () => {
     return _jsx(WalletMessage, { status: "pending", header: 'Confirm in wallet', details: 'Please confirm the transaction in your wallet' });
 };
 const TransactionInProgressMessage = () => {
@@ -28,8 +28,8 @@ const SwapErrorMessage = ({ message }) => {
 const UnexpectedErrorMessage = ({ message }) => {
     return _jsx(WalletMessage, { status: "error", header: 'Unexpected error', details: message, showInModal: true });
 };
-const ActionMessages = {
-    ConfirmTransactionMessage,
+export const ActionMessages = {
+    ConfirmActionMessage,
     TransactionInProgressMessage,
     InsufficientFundsMessage,
     TransactionRejectedMessage,
@@ -39,15 +39,14 @@ const ActionMessages = {
     UnexpectedErrorMessage,
     DifferentAccountsNotAllowedError
 };
-export var TransactionMessageType;
-(function (TransactionMessageType) {
-    TransactionMessageType["ConfirmTransaction"] = "ConfirmTransaction";
-    TransactionMessageType["TransactionInProgress"] = "TransactionInProgress";
-    TransactionMessageType["InsufficientFunds"] = "InsufficientFunds";
-    TransactionMessageType["TransactionRejected"] = "TransactionRejected";
-    TransactionMessageType["WaletMismatch"] = "WaletMismatch";
-    TransactionMessageType["TransactionFailed"] = "TransactionFailed";
-    TransactionMessageType["UnexpectedErrorMessage"] = "UnexpectedErrorMessage";
-    TransactionMessageType["DifferentAccountsNotAllowedError"] = "DifferentAccountsNotAllowedError";
-})(TransactionMessageType || (TransactionMessageType = {}));
-export default ActionMessages;
+export var ActionMessageType;
+(function (ActionMessageType) {
+    ActionMessageType["ConfirmTransaction"] = "ConfirmTransaction";
+    ActionMessageType["TransactionInProgress"] = "TransactionInProgress";
+    ActionMessageType["InsufficientFunds"] = "InsufficientFunds";
+    ActionMessageType["TransactionRejected"] = "TransactionRejected";
+    ActionMessageType["WaletMismatch"] = "WaletMismatch";
+    ActionMessageType["TransactionFailed"] = "TransactionFailed";
+    ActionMessageType["UnexpectedErrorMessage"] = "UnexpectedErrorMessage";
+    ActionMessageType["DifferentAccountsNotAllowedError"] = "DifferentAccountsNotAllowedError";
+})(ActionMessageType || (ActionMessageType = {}));

package/dist/esm/components/Pages/SwapHistory/History.js

@@ -46,7 +46,7 @@ const HistoryList = ({ onNewTransferClick }) => {
     ], [showAll, pendingSwaps, flattenedSwaps]);
     const rowVirtualizer = useVirtualizer({
         count: (list?.length || 0),
-        getScrollElement: () => window.document.getElementById('virtualListContainer'),
+        getScrollElement: () => parentRef.current,
         estimateSize: () => 35,
     });
     const items = rowVirtualizer.getVirtualItems();
@@ -85,7 +85,7 @@ const HistoryList = ({ onNewTransferClick }) => {
                         }) }) }) }) }) }));
 };
 const BlankHistory = ({ onNewTransferClick }) => {
-    return _jsxs("div", { className: "w-full h-full min-h-[inherit] flex flex-col justify-between items-center space-y-10", children: [_jsx("div", {}), _jsxs("div", { className: "w-full h-full flex flex-col justify-center items-center ", children: [_jsx(HistoryItemSceleton, { className: "scale-[.63] w-full shadow-lg mr-7" }), _jsx(HistoryItemSceleton, { className: "scale-[.63] -mt-12 shadow-card ml-7 w-full" }), _jsxs("div", { className: "mt-2 text-center space-y-2", children: [_jsx("h1", { className: "text-secondary-text text-[28px] font-bold tracking-wide", children: "No Transfer History" }), _jsx("p", { className: "max-w-xs text-center text-primary-text-tertiary text-base font-normal mx-auto", children: "Transfers you make with this wallet/account will appear here after excution." })] }), _jsxs("button", { type: 'button', onClick: onNewTransferClick, className: "mt-10 flex items-center gap-2 text-base text-secondary-text font-normal bg-secondary-500 hover:bg-secondary-400 py-2 px-3 rounded-lg", children: [_jsx(Plus, { className: "w-4 h-4" }), _jsx("p", { children: "New Transfer" })] })] })] });
+    return _jsxs("div", { className: "w-full h-full min-h-[inherit] flex flex-col justify-between items-center space-y-10", children: [_jsx("div", {}), _jsxs("div", { className: "w-full h-full flex flex-col justify-center items-center ", children: [_jsx(HistoryItemSceleton, { className: "scale-[.63] w-full shadow-card mr-7" }), _jsx(HistoryItemSceleton, { className: "scale-[.63] -mt-12 shadow-card ml-7 w-full" }), _jsxs("div", { className: "mt-2 text-center space-y-2", children: [_jsx("h1", { className: "text-secondary-text text-[28px] font-bold tracking-wide", children: "No Transfer History" }), _jsx("p", { className: "max-w-xs text-center text-primary-text-tertiary text-base font-normal mx-auto", children: "Transfers you make with this wallet/account will appear here after excution." })] }), _jsxs("button", { type: 'button', onClick: onNewTransferClick, className: "mt-10 flex items-center gap-2 text-base text-secondary-text font-normal bg-secondary-500 hover:bg-secondary-400 py-2 px-3 rounded-lg", children: [_jsx(Plus, { className: "w-4 h-4" }), _jsx("p", { children: "New Transfer" })] })] })] });
 };
 const ConnectWalletCard = () => {
     return _jsxs("div", { className: "w-full h-full flex flex-col justify-between items-center space-y-10", children: [_jsxs("div", { className: "flex flex-col items-center justify-center text-center w-full h-full", children: [_jsx(HistoryItemSceleton, { className: "scale-[.63] w-full shadow-card mr-7" }), _jsx(HistoryItemSceleton, { className: "scale-[.63] -mt-12 shadow-card ml-7 w-full" }), _jsxs("div", { className: "mt-4 text-center space-y-3", children: [_jsx("h1", { className: "text-secondary-text text-[28px] font-bold tracking-wide", children: "Connect wallet" }), _jsx("p", { className: "max-w-xs text-center text-primary-text-tertiary text-base font-normal mx-auto", children: "In order to see your transfer history you need to connect your wallet." })] })] }), _jsx("div", { className: "flex flex-col items-center w-full space-y-3", children: _jsx(ConnectButton, { className: "w-full", children: _jsx("div", { className: "w-full py-2.5 px-3 text-xl font-semibold bg-primary-text-tertiary hover:opacity-90 duration-200 active:opacity-80 transition-opacity rounded-lg text-secondary-900", children: _jsx("div", { className: "text-center text-xl font-semibold", children: "Connect Wallet" }) }) }) })] });

package/dist/esm/components/Pages/SwapHistory/HistorySummary.js

@@ -34,7 +34,7 @@ const HistorySummary = ({ swapResponse, wallets, className }) => {
         sourceAccountAddress = shortenEmail(exchange_account_name, 10);
     }
     const destAddress = (hideAddress && hideTo && account) ? account : destination_address;
-    return (source_token && _jsxs(_Fragment, { children: [_jsx("div", { className: `${className || ""} bg-secondary-500 relative z-10 w-full rounded-xl overflow-hidden hover:bg-secondary-400`, children: _jsxs("div", { className: "grid grid-cols-12 items-center gap-2 relative z-50", children: [_jsxs("div", { className: "col-span-6 flex items-center gap-2 p-3", children: [_jsxs("div", { className: "w-8 h-8 relative", children: [_jsx(ImageWithFallback, { src: source_token.logo, alt: `${source_token.symbol} logo`, width: 30, height: 30, className: "rounded-full" }), source?.logo && (_jsx(ImageWithFallback, { src: source.logo, alt: `${source.display_name} badge`, width: 18, height: 18, className: "absolute -bottom-1 -right-1 h-[18px] w-[18px] rounded-md" }))] }), _jsxs("div", { className: "flex min-w-0 flex-col items-start space-y-0.5", children: [_jsxs("span", { className: "text-primary-text text-lg leading-5 flex min-w-0", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "truncate overflow-hidden whitespace-nowrap max-w-[100px]", children: requested_amount.toLocaleString('en-US', { maximumFractionDigits: 20 }) }) }), _jsx(TooltipContent, { children: requested_amount })] }), "\u00A0", source_token.symbol] }), _jsx("span", { className: "text-secondary-text text-sm leading-[14px]", children: source?.display_name || "" })] })] }), _jsx("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none -z-10", children: _jsx("div", { className: "h-7 w-6 rounded-md bg-secondary-400 flex items-center justify-center", children: _jsx(ChevronRightIcon, { className: "h-5 w-5 text-primary-text" }) }) }), _jsxs("div", { className: "col-span-6 flex items-center justify-end gap-2 bg-secondary-400 p-3 rounded-xl", children: [_jsxs("div", { className: "flex min-w-0 flex-col items-end space-y-0.5", children: [_jsxs("span", { className: "text-primary-text text-lg leading-5 flex min-w-0", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "truncate overflow-hidden whitespace-nowrap max-w-[100px]", children: calculatedReceiveAmount.toLocaleString('en-US', { maximumFractionDigits: 20 }) }) }), _jsx(TooltipContent, { children: calculatedReceiveAmount })] }), "\u00A0", destination_token.symbol] }), _jsx("span", { className: "text-secondary-text text-sm leading-[14px]", children: destination?.display_name || "" })] }), _jsxs("div", { className: "relative w-8 h-8", children: [_jsx(ImageWithFallback, { src: destination_token.logo, alt: `${destination_token.symbol} logo`, width: 30, height: 30, className: "rounded-full" }), destination?.logo && (_jsx(ImageWithFallback, { src: destination.logo, alt: `${destination.display_name} badge`, width: 18, height: 18, className: "absolute -bottom-1 -right-1 h-[18px] w-[18px] rounded-md" }))] })] })] }) }), swap.status !== SwapStatus.Completed &&
+    return (source_token && _jsxs(_Fragment, { children: [_jsx("div", { className: `${className || ""} bg-secondary-500 relative z-10 w-full rounded-xl overflow-hidden hover:bg-secondary-400`, children: _jsxs("div", { className: "grid grid-cols-12 items-center gap-2 relative z-50", children: [_jsxs("div", { className: "col-span-6 flex items-center gap-2 p-3", children: [_jsxs("div", { className: "w-8 h-8 relative", children: [_jsx("div", { className: "h-[30px] w-[30px] rounded-full overflow-hidden", children: _jsx(ImageWithFallback, { src: source_token.logo, alt: `${source_token.symbol} logo`, width: 30, height: 30, className: "rounded-full" }) }), source?.logo && (_jsx("div", { className: "absolute -bottom-0.5 -right-1 h-[18px] w-[18px] rounded-md overflow-hidden border border-secondary-500", children: _jsx(ImageWithFallback, { src: source.logo, alt: `${source.display_name} badge`, width: 18, height: 18, className: "" }) }))] }), _jsxs("div", { className: "flex min-w-0 flex-col items-start space-y-0.5 overflow-hidden", children: [_jsxs("div", { className: "text-primary-text text-sm sm:text-lg leading-5 flex items-center min-w-0 gap-1 w-full", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "truncate block shrink", children: requested_amount.toLocaleString('en-US', { maximumFractionDigits: 20 }) }) }), _jsx(TooltipContent, { children: requested_amount })] }), _jsx("span", { className: "shrink-0", children: source_token.symbol })] }), _jsx("span", { className: "text-secondary-text text-sm text-left leading-3.5", children: source?.display_name || "" })] })] }), _jsx("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none -z-10", children: _jsx("div", { className: "h-7 w-6 rounded-md bg-secondary-400 flex items-center justify-center", children: _jsx(ChevronRightIcon, { className: "h-5 w-5 text-primary-text" }) }) }), _jsxs("div", { className: "col-span-6 flex items-center justify-end gap-2 bg-secondary-400 p-3 rounded-xl", children: [_jsxs("div", { className: "flex min-w-0 flex-col items-end space-y-0.5 overflow-hidden", children: [_jsxs("div", { className: "text-primary-text text-sm sm:text-lg leading-5 flex items-center min-w-0 gap-1 w-full justify-end", children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "truncate block shrink", children: calculatedReceiveAmount.toLocaleString('en-US', { maximumFractionDigits: 20 }) }) }), _jsx(TooltipContent, { children: calculatedReceiveAmount })] }), _jsx("span", { className: "shrink-0", children: destination_token.symbol })] }), _jsx("span", { className: "text-secondary-text text-sm text-right leading-3.5", children: destination?.display_name || "" })] }), _jsxs("div", { className: "relative w-8 h-8", children: [_jsx("div", { className: "h-[30px] w-[30px] rounded-full overflow-hidden", children: _jsx(ImageWithFallback, { src: destination_token.logo, alt: `${destination_token.symbol} logo`, width: 30, height: 30, className: "rounded-full" }) }), destination?.logo && (_jsx("div", { className: "absolute -bottom-0.5 -right-1 h-[18px] w-[18px] rounded-md overflow-hidden border border-secondary-500", children: _jsx(ImageWithFallback, { src: destination.logo, alt: `${destination.display_name} badge`, width: 18, height: 18, className: "" }) }))] })] })] }) }), swap.status !== SwapStatus.Completed &&
                 _jsx("div", { className: "-mt-2 z-0 relative", children: _jsx(StatusIcon, { swap: swap, withBg: true }) })] }));
 };
 export default HistorySummary;

package/dist/esm/components/Pages/SwapHistory/index.js

@@ -2,9 +2,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Content from "./History";
 import { SwapDataProvider } from "../../../context/swap";
-import { useBackClickCallback } from "../../../context/callbackProvider";
+import { useCallbacks } from "../../../context/callbackProvider";
 import { Widget } from "../../../components/Widget/Index";
-export const TransactionsHistory = () => {
-    const triggerOnBackClickCallback = useBackClickCallback();
-    return (_jsx(SwapDataProvider, { children: _jsx(Widget, { goBack: triggerOnBackClickCallback, children: _jsx(Widget.Content, { children: _jsx("div", { className: "px-6 h-full overflow-y-auto styled-scroll max-h-[80vh]", id: 'virtualListContainer', children: _jsx(Content, {}) }) }) }) }));
+export const TransactionsHistory = ({ height = '600px' }) => {
+    const { onBackClick } = useCallbacks();
+    return (_jsx(SwapDataProvider, { children: _jsx(Widget, { goBack: onBackClick, children: _jsx(Widget.Content, { children: _jsx("div", { style: { height }, className: "h-full w-full overflow-y-auto styled-scroll", id: 'virtualListContainer', children: _jsx(Content, {}) }) }) }) }));
 };

package/dist/esm/components/Select/Selector/SelectItem.js

@@ -13,7 +13,7 @@ const Title = ({ children, className }) => {
     return _jsx("div", { className: `flex justify-between w-full text-base items-center pb-0.5 ${className}`, children: children });
 };
 const DetailedTitle = ({ children, className, title, secondary, secondaryImageAlt, secondaryLogoSrc, logoClassName }) => {
-    return _jsxs(Title, { className: clsx("w-full grid grid-cols-9", className), children: [_jsxs("div", { className: "col-span-5 sm:col-span-7 truncate flex flex-col gap-1 leading-5 align-middle font-medium", children: [_jsx("span", { className: "align-middle leading-5 text-base", children: title }), _jsxs("div", { className: "flex items-center space-x-1 align-middle", children: [secondaryLogoSrc && _jsx(ImageWithFallback, { src: secondaryLogoSrc, alt: secondaryImageAlt, height: "16", width: "16", loading: "eager", className: clsx("h-4 w-4 object-contain rounded", logoClassName) }), _jsx("span", { className: "text-secondary-text text-xs whitespace-nowrap", children: secondary })] })] }), _jsx("div", { className: 'col-span-4 sm:col-span-2 place-self-end self-center', children: children })] });
+    return _jsxs(Title, { className: clsx("w-full grid grid-cols-9", className), children: [_jsx("div", { className: "col-span-9 flex flex-col gap-1 leading-5 align-middle font-medium", children: _jsx("div", { className: "align-middle leading-5 text-base flex items-center justify-between w-full min-w-0", children: title }) }), _jsxs("div", { className: "col-span-5 sm:col-span-6 flex items-center gap-1 min-w-0 overflow-hidden pr-2", children: [secondaryLogoSrc && _jsx(ImageWithFallback, { src: secondaryLogoSrc, alt: secondaryImageAlt, height: "16", width: "16", loading: "eager", className: clsx("h-4 w-4 object-contain rounded shrink-0", logoClassName) }), _jsx("div", { className: "text-secondary-text text-xs min-w-0 whitespace-nowrap", children: secondary })] }), children && _jsx("div", { className: "col-span-4 sm:col-span-3 text-right truncate", children: children })] });
 };
 SelectItem.Logo = Logo;
 SelectItem.Title = Title;

package/dist/esm/components/Wallet/WalletComponents/ConnectedWallets.js

@@ -22,9 +22,9 @@ export const WalletsIcons = ({ wallets }) => {
     const firstWallet = uniqueWallets[0];
     const secondWallet = uniqueWallets[1];
     return (_jsxs("div", { className: "-space-x-2 flex", children: [firstWallet?.displayName &&
-                _jsx(firstWallet.icon, { className: "rounded-full border-2 border-secondary-600 bg-secondary-700 shrink-0 h-6 w-6" }), secondWallet?.displayName &&
-                _jsx(secondWallet.icon, { className: "rounded-full border-2 border-secondary-600 bg-secondary-700 shrink-0 h-6 w-6" }), uniqueWallets.length > 2 &&
-                _jsx("div", { className: "h-6 w-6 shrink-0 rounded-full justify-center p-1 bg-secondary-600 text-primary-text overlfow-hidden text-xs", children: _jsxs("span", { children: [_jsx("span", { children: "+" }), uniqueWallets.length - 2] }) })] }));
+                _jsx(firstWallet.icon, { className: "rounded-md border-2 border-secondary-600 bg-secondary-700 shrink-0 h-6 w-6" }), secondWallet?.displayName &&
+                _jsx(secondWallet.icon, { className: "rounded-md border-2 border-secondary-600 bg-secondary-700 shrink-0 h-6 w-6" }), uniqueWallets.length > 2 &&
+                _jsx("div", { className: "h-6 w-6 shrink-0 rounded-md justify-center p-1 bg-secondary-600 text-primary-text overlfow-hidden text-xs", children: _jsxs("span", { children: [_jsx("span", { children: "+" }), uniqueWallets.length - 2] }) })] }));
 };
 export const WalletsMenu = () => {
     const { wallets } = useWallet();
@@ -39,5 +39,5 @@ const WalletsMenuWalletsList = ({ wallets }) => {
     return _jsxs(_Fragment, { children: [_jsx("button", { onClick: () => setOpenModal(true), type: "button", className: "py-3 px-4 bg-secondary-500 flex items-center w-full rounded-xl space-x-1 disabled:text-secondary-text/40 disabled:bg-primary-900 disabled:cursor-not-allowed relative font-semibold transform border border-secondary-500 hover:bg-secondary-400 transition duration-200 ease-in-out outline-hidden", children: wallets.length === 1 ?
                     _jsxs("div", { className: "flex gap-4 items-start text-primary-text", children: [_jsx(wallet.icon, { className: 'h-5 w-5' }), !wallet.isLoading && wallet.address && _jsx("p", { children: shortenAddress(wallet.address) })] })
                     :
-                        _jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-center w-full", children: "Connected wallets" }), _jsx("div", { className: "place-items-end absolute left-2.5", children: _jsx(WalletsIcons, { wallets: wallets }) })] }) }), _jsx(VaulDrawer, { show: openModal, setShow: setOpenModal, header: `Connected wallets`, modalId: "connectedWallets", className: "expandContainerHeight", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsx(WalletsList, { wallets: wallets }) }) })] });
+                        _jsxs(_Fragment, { children: [_jsx("div", { className: "flex justify-center w-full", children: "Connected wallets" }), _jsx("div", { className: "place-items-end absolute left-2.5", children: _jsx(WalletsIcons, { wallets: wallets }) })] }) }), _jsx(VaulDrawer, { show: openModal, setShow: setOpenModal, header: `Connected wallets`, modalId: "connectedWallets", children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsx(WalletsList, { wallets: wallets }) }) })] });
 };

package/dist/esm/components/Wallet/WalletComponents/WalletsList.js

@@ -10,7 +10,7 @@ import { truncateDecimals } from "../../../components/utils/RoundDecimals";
 import { useSettingsState } from "../../../context/settings";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../../../components/shadcn/tooltip";
 import { ImageWithFallback } from "../../../components/Common/ImageWithFallback";
-import { useSelectedAccount } from "../../../context/balanceAccounts";
+import { useSelectedAccount } from "../../../context/swapAccounts";
 import { useBalance } from "../../../lib/balances/useBalance";
 const WalletsList = (props) => {
     const { wallets, token, network, provider, selectable, onSelect, selectedDepositMethod } = props;

package/dist/esm/components/Wallet/WalletModal/Connector.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Loader } from "lucide-react";
 import { resolveWalletConnectorIcon } from "../../../lib/wallets/utils/resolveWalletIcon";
-const Connector = ({ connector, connectingConnector, onClick, isRecent, ...props }) => {
+const Connector = ({ connector, connectingConnector, onClick, isRecent, isProviderReady = true, ...props }) => {
     const connectorName = connector?.name;
     const Icon = resolveWalletConnectorIcon({ connector: connector, iconUrl: connector.icon });
     const isLoading = connectingConnector?.name === connectorName;
-    return (_jsx(_Fragment, { children: _jsx("button", { type: "button", disabled: !!connectingConnector, className: "w-full h-fit flex items-center justify-between bg-secondary-500 hover:bg-secondary-400 transition-colors duration-200 rounded-xl p-3", onClick: onClick, ...props, children: _jsxs("div", { className: "flex gap-2.5 items-center font-medium w-full", children: [_jsx("div", { className: "w-11", children: _jsx(Icon, { className: "w-11 h-auto p-0.5 rounded-[10px] bg-secondary-800" }) }), _jsxs("div", { className: 'flex flex-col items-start justify-center col-start-2 col-span-3 min-h-[40px] truncate', children: [_jsx("p", { className: 'text-base text-left truncate w-full', children: connectorName }), connector.type === 'injected' && !isRecent &&
+    return (_jsx(_Fragment, { children: _jsx("button", { type: "button", disabled: !!connectingConnector || !isProviderReady, className: "w-full h-fit flex items-center justify-between bg-secondary-500 hover:bg-secondary-400 transition-colors duration-200 rounded-xl p-3 disabled:opacity-50 disabled:cursor-not-allowed", onClick: onClick, ...props, children: _jsxs("div", { className: "flex gap-2.5 items-center font-medium w-full", children: [_jsx("div", { className: "w-11", children: _jsx(Icon, { className: "w-11 h-auto p-0.5 rounded-[10px] bg-secondary-800" }) }), _jsxs("div", { className: 'flex flex-col items-start justify-center col-start-2 col-span-3 min-h-[40px] truncate', children: [_jsx("p", { className: 'text-base text-left truncate w-full', children: connectorName }), connector.type === 'injected' && !isRecent &&
                                 _jsx("p", { className: 'text-xs text-secondary-text font-medium', children: "Installed" }), isRecent &&
                                 _jsx("p", { className: 'text-xs text-primary-buttonTextColor font-semibold bg-primary-700 px-1 py-0.5 rounded-md', children: "Recent" })] }), isLoading &&
                         _jsx("div", { className: 'absolute right-0 bg-secondary-800 rounded-lg p-1', children: _jsx(Loader, { className: 'h-4 w-4 animate-spin' }) })] }) }) }));