@layerswap/widget 0.1.4 → 0.1.14

package/dist/components/Pages/Auth/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
 import { FormWizardProvider, useFormWizardaUpdate } from "../../../context/formWizardProvider";
@@ -8,7 +9,7 @@ import EmailStep from "./Steps/EmailStep";
 import Wizard from "../../Wizard/Wizard";
 import WizardItem from "../../Wizard/WizardItem";
 import { SwapDataProvider } from "../../../context/swap";
-import LayerswapContext from "../../../context/LayerswapContext";
+import { LayerswapProvider } from "../../../context/LayerswapProvider";
 const Comp = () => {
     const { goToStep } = useFormWizardaUpdate();
     // const router = useAppRouter();
@@ -27,5 +28,5 @@ const Comp = () => {
     return (_jsx(TimerProvider, { children: _jsxs(Wizard, { wizardId: "auth", children: [_jsx(WizardItem, { StepName: SwapCreateStep.Email, GoBack: handleGoBack, className: "pb-6", children: _jsx(EmailStep, { OnNext: GoToCodeStep }) }), _jsx(WizardItem, { StepName: SwapCreateStep.Code, GoBack: GoBackToEmailStep, className: "pb-6", children: _jsx(CodeStep, { OnNext: CodeOnNext }) })] }) }));
 };
 export const Auth = (props) => {
-    return (_jsx(LayerswapContext, { ...props, children: _jsx(SwapDataProvider, { children: _jsx(FormWizardProvider, { initialStep: AuthStep.Email, initialLoading: false, children: _jsx(Comp, {}) }) }) }));
+    return (_jsx(LayerswapProvider, { ...props, children: _jsx(SwapDataProvider, { children: _jsx(FormWizardProvider, { initialStep: AuthStep.Email, initialLoading: false, children: _jsx(Comp, {}) }) }) }));
 };

package/dist/components/Pages/Campaigns/Details/Leaderboard.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import LayerSwapApiClient from "../../../../lib/layerSwapApiClient";

package/dist/components/Pages/Campaigns/Details/index.d.ts

@@ -1,5 +1,5 @@
 import { FC } from "react";
-import { LayerswapContextProps } from "../../../../context/LayerswapContext";
+import { LayerswapContextProps } from "../../../../context/LayerswapProvider";
 export declare const CampaignDetailsComponent: FC<{
     campaignName: string;
 }>;

package/dist/components/Pages/Campaigns/Details/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback } from "react";
 import { Gift } from "lucide-react";
@@ -10,7 +11,7 @@ import Leaderboard from "./Leaderboard";
 import Rewards from "./Rewards";
 import SpinIcon from "../../../Icons/spinIcon";
 import useWallet from "../../../../hooks/useWallet";
-import LayerswapContext from "../../../../context/LayerswapContext";
+import { LayerswapProvider } from "../../../../context/LayerswapProvider";
 export const CampaignDetailsComponent = ({ campaignName }) => {
     const apiClient = new LayerSwapApiClient();
     const { data: campaignsData, isLoading } = useSWR('/campaigns', apiClient.fetcher);
@@ -41,5 +42,5 @@ const BriefInformation = ({ campaign }) => _jsx("p", { className: "text-secondar
 const Loading = () => _jsx(Widget.Content, { children: _jsx("div", { className: "absolute top-[calc(50%-5px)] left-[calc(50%-5px)]", children: _jsx(SpinIcon, { className: "animate-spin h-5 w-5" }) }) });
 const NotFound = () => _jsx(Widget.Content, { children: _jsxs("div", { className: "h-[364px] flex flex-col items-center justify-center space-y-4", children: [_jsx(Gift, { className: "h-20 w-20 text-primary" }), _jsx("p", { className: "font-bold text-center", children: "Campaign not found" }), _jsx("a", { className: "text-xs underline hover:no-underline", href: '/campaigns', children: "See all campaigns" })] }) });
 export const CampaignDetails = (props) => {
-    return (_jsx(LayerswapContext, { ...props, children: _jsx(Widget, { children: _jsx(CampaignDetailsComponent, { campaignName: props.campaignName }) }) }));
+    return (_jsx(LayerswapProvider, { ...props, children: _jsx(Widget, { children: _jsx(CampaignDetailsComponent, { campaignName: props.campaignName }) }) }));
 };

package/dist/components/Pages/Campaigns/index.d.ts

@@ -1,5 +1,5 @@
 import { FC } from "react";
-import { LayerswapContextProps } from "../../../context/LayerswapContext";
+import { LayerswapContextProps } from "../../../context/LayerswapProvider";
 export declare const CampaignsComponent: () => import("react/jsx-runtime").JSX.Element;
 export declare const Campaigns: FC<LayerswapContextProps & {
     hideMenu?: boolean;

package/dist/components/Pages/Campaigns/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Gift } from "lucide-react";
 import { useState } from "react";
@@ -5,7 +6,7 @@ import LayerSwapApiClient from "../../../lib/layerSwapApiClient";
 import SpinIcon from "../../Icons/spinIcon";
 import useSWR from 'swr';
 import { Widget } from "../../Widget/Index";
-import LayerswapContext from "../../../context/LayerswapContext";
+import { LayerswapProvider } from "../../../context/LayerswapProvider";
 import VaulDrawer from "../../Modal/vaulModal";
 import { CampaignDetailsComponent } from "./Details";
 export const CampaignsComponent = () => {
@@ -48,5 +49,5 @@ function IsCampaignActive(campaign) {
     return (new Date(campaign?.end_date).getTime() > now.getTime());
 }
 export const Campaigns = (props) => {
-    return (_jsx(LayerswapContext, { ...props, children: _jsx(Widget, { hideMenu: props.hideMenu, className: "min-h-[520px]", children: _jsx(Widget.Content, { children: _jsx(CampaignsComponent, {}) }) }) }));
+    return (_jsx(LayerswapProvider, { ...props, children: _jsx(Widget, { hideMenu: props.hideMenu, className: "min-h-[520px]", children: _jsx(Widget.Content, { children: _jsx(CampaignsComponent, {}) }) }) }));
 };

package/dist/components/Pages/Maintanance/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { useIntercom } from "react-use-intercom";

package/dist/components/Pages/NoCookies/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import MessageComponent from "../../Common/MessageComponent";

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

@@ -9,7 +9,6 @@ import useWallet from "../../../hooks/useWallet";
 import Snippet, { HistoryItemSceleton } from "./Snippet";
 import { groupBy } from "../../utils/groupBy";
 import { useAuthState, UserType } from "../../../context/authContext";
-import ConnectButton from "../../Buttons/connectButton";
 import { FormWizardProvider } from "../../../context/formWizardProvider";
 import { TimerProvider } from "../../../context/timerContext";
 import GuestCard from "./Guest";
@@ -119,7 +118,7 @@ const BlankHistory = ({ onNewTransferClick, onLogin }) => {
     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-muted text-base font-normal mx-auto", children: "Transfers you make with this wallet/account will appear here after excution." })] }), _jsxs("a", { onClick: onNewTransferClick, href: "/", className: "mt-10 flex items-center gap-2 text-base text-secondary-text font-normal bg-secondary-500 hover:bg-secondary-600 py-2 px-3 rounded-lg", children: [_jsx(Plus, { className: "w-4 h-4" }), _jsx("p", { children: "New Transfer" })] })] }), _jsx("div", { className: "w-full", children: _jsx(SignIn, { onLogin: onLogin }) })] });
 };
 const ConnectOrSignIn = ({ onLogin }) => {
-    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-lg 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 or sign in" }), _jsx("p", { className: "max-w-xs text-center text-primary-text-muted text-base font-normal mx-auto", children: "In order to see your transfer history you need to connect your wallet or Sign in with your email." })] })] }), _jsxs("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-placeholder hover:opacity-90 duration-200 active:opacity-80 transition-opacity rounded-lg text-secondary-950", children: _jsx("div", { className: "text-center text-xl font-semibold", children: "Connect Wallet" }) }) }), _jsx("div", { className: "w-full overflow-hidden", children: _jsx(SignIn, { onLogin: onLogin }) })] })] });
+    return _jsx("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-lg 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: "No transactions" }), _jsx("p", { className: "max-w-xs text-center text-primary-text-muted text-base font-normal mx-auto", children: "You do not have any transactions." })] })] }) });
 };
 const SignIn = ({ onLogin }) => {
     const { userType } = useAuthState();

package/dist/components/Pages/SwapHistory/index.d.ts

@@ -1,3 +1,3 @@
-import { LayerswapContextProps } from "../../../context/LayerswapContext";
+import { LayerswapContextProps } from "../../../context/LayerswapProvider";
 import { FC } from "react";
 export declare const TransactionsHistory: FC<LayerswapContextProps>;

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

@@ -1,8 +1,9 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Content from "./History";
 import Header from "./Header";
-import LayerswapContext from "../../../context/LayerswapContext";
+import { LayerswapProvider } from "../../../context/LayerswapProvider";
 import { SwapDataProvider } from "../../../context/swap";
-export const TransactionsHistory = ({ settings, themeData }) => {
-    return (_jsx(LayerswapContext, { integrator: "experimental", settings: settings, themeData: themeData, children: _jsx(SwapDataProvider, { children: _jsxs("div", { id: "widget", className: 'bg-secondary-900 sm:shadow-card sm:relative rounded-lg w-full text-primary-text overflow-y-auto sm:overflow-hidden max-h-screen h-full sm:h-[650px]', children: [_jsxs("div", { className: "overflow-y-auto flex flex-col h-full z-40 pb-4", children: [_jsx(Header, {}), _jsx("div", { className: "px-6 h-full overflow-y-auto styled-scroll max-h-[80vh]", id: 'virtualListContainer', children: _jsx(Content, {}) })] }), _jsx("div", { id: "widget_root" })] }) }) }));
+export const TransactionsHistory = ({ settings, themeData, apiKey }) => {
+    return (_jsx(LayerswapProvider, { apiKey: apiKey, integrator: "experimental", settings: settings, themeData: themeData, children: _jsx(SwapDataProvider, { children: _jsxs("div", { id: "widget", className: 'bg-secondary-900 sm:shadow-card sm:relative rounded-lg w-full text-primary-text overflow-y-auto sm:overflow-hidden max-h-screen h-full sm:h-[650px]', children: [_jsxs("div", { className: "overflow-y-auto flex flex-col h-full z-40 pb-4", children: [_jsx(Header, {}), _jsx("div", { className: "px-6 h-full overflow-y-auto styled-scroll max-h-[80vh]", id: 'virtualListContainer', children: _jsx(Content, {}) })] }), _jsx("div", { id: "widget_root" })] }) }) }));
 };

package/dist/components/Pages/SwapPages/Form/FeeDetails/Campaign.js

@@ -1,3 +1,4 @@
+'use client';
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import useSWR from "swr";
 import FeeDetails from "./FeeDetailsComponent";

package/dist/components/Pages/SwapPages/Form/Form.js

@@ -19,9 +19,6 @@ import useWallet from "../../../../hooks/useWallet";
 import { useSettingsState } from "../../../../context/settings";
 import FormButton from "./SecondaryComponents/FormButton";
 import ReserveGasNote from "./SecondaryComponents/ReserveGasNote";
-// const ReserveGasNote = dynamic(() => import("./SecondaryComponents/ReserveGasNote"), {
-//     loading: () => <></>,
-// });
 const SwapForm = ({ partner }) => {
     const { values, setValues, errors, isValid, isSubmitting, setFieldValue } = useFormikContext();
     const { to: destination, fromCurrency, toCurrency, from: source, fromExchange, toExchange, currencyGroup, } = values;
@@ -128,7 +125,7 @@ const SwapForm = ({ partner }) => {
             setFieldValue('amount', walletBalance?.amount - networkGas);
     }, [values.amount]);
     const sourceWalletNetwork = values.fromExchange ? undefined : values.from;
-    const shouldConnectWallet = (sourceWalletNetwork && values.from?.deposit_methods?.includes('wallet') && values.depositMethod !== 'deposit_address' && !selectedSourceAccount) || (!values.from && !values.fromExchange && !wallets.length && values.depositMethod !== 'deposit_address');
+    const shouldConnectWallet = (sourceWalletNetwork && values.from?.deposit_methods?.includes('wallet') && values.depositMethod !== 'deposit_address' && !selectedSourceAccount) || (!values.from && !values.fromExchange && !wallets.length && values.depositMethod !== 'deposit_address' && !(!values.from && values.to));
     return _jsx(Widget, { className: "sm:min-h-[450px] h-full", children: _jsxs(Form, { className: `h-full grow flex flex-col justify-between ${(isSubmitting) ? 'pointer-events-none' : 'pointer-events-auto'}`, children: [_jsxs(Widget.Content, { children: [_jsxs("div", { className: 'flex-col relative flex justify-between gap-1.5 w-full mb-3.5 leading-4 bg-secondary-700 rounded-xl', children: [!(query?.hideFrom && values?.from) && _jsx("div", { className: "flex flex-col w-full", children: _jsx(NetworkFormField, { direction: "from", label: "From", className: "rounded-t-lg pt-2.5", partner: partner }) }), !query?.hideFrom && !query?.hideTo &&
                                     _jsx("button", { type: "button", "aria-label": "Reverse the source and destination", disabled: valuesSwapperDisabled, onClick: valuesSwapper, className: `hover:text-primary absolute right-[calc(50%-16px)] top-[122px] z-10 border-2 border-secondary-700 bg-secondary-600 rounded-lg disabled:cursor-not-allowed disabled:text-secondary-text duration-200 transition disabled:pointer-events-none`, children: _jsx(motion.div, { animate: animate, transition: { duration: 0.3 }, onTap: () => !valuesSwapperDisabled && cycle(), children: _jsx(ArrowUpDown, { className: classNames(valuesSwapperDisabled && 'opacity-50', "w-7 h-auto p-1 bg-secondary-500 rounded-lg disabled:opacity-30") }) }) }), !(query?.hideTo && values?.to) && _jsx("div", { className: "flex flex-col w-full", children: _jsx(NetworkFormField, { direction: "to", label: "To", className: "rounded-b-lg", partner: partner }) })] }), (((fromExchange && destination) || (toExchange && source)) && currencyGroup) ?
                             _jsx("div", { className: "mb-6 leading-4", children: _jsx(ResizablePanel, { children: _jsx(CEXNetworkFormField, { direction: fromExchange ? 'from' : 'to', partner: partner }) }) })

package/dist/components/Pages/SwapPages/Form/SecondaryComponents/ValidationError.js

@@ -4,6 +4,6 @@ const ValidationError = () => {
     const { validationDetails, validationMessage } = useValidationContext();
     if (!validationMessage)
         return null;
-    return (_jsxs("div", { className: `p-2.5 my-2.5 relative rounded-md bg-secondary-700 border-l-8 ${validationDetails.type === "warning" ? "border-orange-400" : "border-red-400"}`, children: [_jsxs("div", { className: 'flex items-center', children: [validationDetails.icon, _jsx("p", { className: 'text-white font-medium ml-1', children: validationDetails.title })] }), _jsx("p", { className: "text-secondary-text ml-5 mt-1 text-sm", children: validationMessage })] }));
+    return (_jsxs("div", { className: `p-2.5 my-2.5 relative rounded-md bg-secondary-700 border-l-8 ${validationDetails.type === "warning" ? "border-orange-400" : "border-red-400"}`, children: [_jsxs("div", { className: 'flex items-center', children: [validationDetails.icon, _jsx("p", { className: 'text-primary-text font-medium ml-1', children: validationDetails.title })] }), _jsx("p", { className: "text-secondary-text ml-5 mt-1 text-sm", children: validationMessage })] }));
 };
 export default ValidationError;

package/dist/components/Pages/SwapPages/Form/Select/Popover/PopoverSelect.js

@@ -3,7 +3,7 @@ import { CommandItem, CommandList, CommandWrapper } from '../../../../../shadcn/
 import SelectItem from '../Shared/SelectItem';
 export default function PopoverSelect({ values, value, setValue }) {
     let upperValue = false;
-    return (_jsx(CommandWrapper, { children: _jsx(CommandList, { children: values.map((item, index) => {
+    return (_jsx(CommandWrapper, { children: _jsx(CommandList, { className: 'max-h-[265px]', children: values.map((item, index) => {
                 const shouldGroupped = !upperValue && item.isAvailable && index !== 0;
                 if (shouldGroupped) {
                     upperValue = true;

package/dist/components/Pages/SwapPages/Form/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo } from 'react';
 import { SwapDataProvider } from '../../../../context/swap';

package/dist/components/Pages/SwapPages/Withdraw/Coinbase/Carousel.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React, { forwardRef, useCallback, useImperativeHandle, useState } from "react";
-import { useSwipeable } from "react-swipeable";
 export const CarouselItem = ({ children, width }) => {
     return (_jsx("div", { className: `rounded-xl inline-flex items-center justify-center flex-col pb-0 bg-gradient-to-b from-secondary-900 to-secondary-700 h-full relative`, style: { width: width }, children: children }));
 };
@@ -31,11 +30,14 @@ const Carousel = forwardRef(function Carousel({ onFirst, onLast, children, starA
             updateIndex(0);
         }
     }), [activeIndex, children, updateIndex]);
-    const handlers = useSwipeable({
-        onSwipedLeft: () => updateIndex(activeIndex + 1),
-        onSwipedRight: () => updateIndex(activeIndex - 1),
-    });
-    return (_jsx("div", { ...handlers, className: "overflow-hidden h-full", children: _jsx("div", { className: "whitespace-nowrap transition-transform duration-500 inner h-full", style: { transform: `translateX(-${activeIndex * 100}%)` }, children: children && React.Children.map(children, (child, index) => {
+    //TODO: Implement without package
+    // const handlers = useSwipeable({
+    //     onSwipedLeft: () => updateIndex(activeIndex + 1),
+    //     onSwipedRight: () => updateIndex(activeIndex - 1),
+    // });
+    return (_jsx("div", { 
+        // {...handlers}
+        className: "overflow-hidden h-full", children: _jsx("div", { className: "whitespace-nowrap transition-transform duration-500 inner h-full", style: { transform: `translateX(-${activeIndex * 100}%)` }, children: children && React.Children.map(children, (child, index) => {
                 return React.cloneElement(child, { width: "100%" });
             }) }) }));
 });

package/dist/components/Pages/SwapPages/Withdraw/Processing/Processing.js

@@ -15,7 +15,7 @@ import { useSwapTransactionStore } from '../../../../../stores/swapTransactionSt
 import FormattedAverageCompletionTime from '../../../../Common/FormattedAverageCompletionTime';
 import CountdownTimer from '../../../../Common/CountDownTimer';
 import useSWR from 'swr';
-import { datadogRum } from '@datadog/browser-rum';
+// import { datadogRum } from '@datadog/browser-rum';
 import { useIntercom } from 'react-use-intercom';
 import { useAuthState } from '../../../../../context/authContext';
 import logError from '../../../../../lib/logError';
@@ -64,7 +64,7 @@ const Processing = ({ swapResponse }) => {
             const renderingError = new Error(`Swap:${swap?.id} transaction:${transactionHash} failed`);
             renderingError.name = `TransactionFailed`;
             renderingError.cause = err;
-            datadogRum.addError(renderingError);
+            // datadogRum.addError(renderingError);
         }
     }, [inputTxStatus, transactionHash, swap?.id]);
     const truncatedRefuelAmount = refuel && truncateDecimals(refuel.amount, refuel.token?.precision);

package/dist/components/Pages/SwapPages/Withdraw/Wallet/FuelWalletWithdrawal.d.ts

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

package/dist/components/Pages/SwapPages/Withdraw/Wallet/FuelWalletWithdrawal.js

@@ -1,125 +1,159 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from 'react';
-import { BackendTransactionStatus } from '../../../../../lib/layerSwapApiClient';
-import useWallet from '../../../../../hooks/useWallet';
-import { useSwapTransactionStore } from '../../../../../stores/swapTransactionStore';
-import WalletIcon from '../../../../Icons/WalletIcon';
-import { ButtonWrapper, ChangeNetworkMessage, ConnectWalletButton } from './WalletTransfer/buttons';
-import { useSelectNetwork, useFuel, useNetwork, } from '@fuels/react';
-import { useSwapDataState } from '../../../../../context/swap';
-import { datadogRum } from '@datadog/browser-rum';
-import { coinQuantityfy, Provider, ScriptTransactionRequest } from 'fuels';
-import TransactionMessages from '../Messages/TransactionMessages';
-const FuelWalletWithdrawStep = ({ network, callData, swapId, amount, depositAddress, sequenceNumber, token }) => {
-    const [loading, setLoading] = useState(false);
-    const [buttonClicked, setButtonClicked] = useState(false);
-    const [error, setError] = useState();
-    const { setSwapTransaction } = useSwapTransactionStore();
-    const { provider } = useWallet(network, 'withdrawal');
-    const { network: fuelNetwork, refetch: refetchNetwork } = useNetwork();
-    const networkChainId = Number(network?.chain_id);
-    const { selectedSourceAccount } = useSwapDataState();
-    const { fuel } = useFuel();
-    const activeChainId = fuelNetwork?.chainId || (fuelNetwork?.url.includes('testnet') ? 0 : 9889);
-    useEffect(() => {
-        if (provider?.activeWallet && selectedSourceAccount) {
-            provider?.switchAccount && provider?.switchAccount(selectedSourceAccount?.wallet, selectedSourceAccount?.address);
-            refetchNetwork();
-        }
-    }, [selectedSourceAccount, provider?.activeWallet]);
-    const handleTransfer = useCallback(async () => {
-        setButtonClicked(true);
-        setError(undefined);
-        try {
-            setLoading(true);
-            if (!network)
-                throw Error("Network not found");
-            if (!depositAddress)
-                throw Error("Deposit address not found");
-            if (!network.metadata.watchdog_contract)
-                throw Error("Watchdog contract not found");
-            if (!amount)
-                throw Error("Amount not found");
-            if (!token)
-                throw Error("Token not found");
-            if (!callData)
-                throw Error("Call data not found");
-            if (!selectedSourceAccount?.address)
-                throw Error("No selected account");
-            const fuelProvider = new Provider(network.node_url);
-            const fuelWallet = await fuel.getWallet(selectedSourceAccount.address, fuelProvider);
-            if (!fuelWallet)
-                throw Error("Fuel wallet not found");
-            var parsedCallData = JSON.parse(callData);
-            var scriptTransaction = ScriptTransactionRequest.from(parsedCallData.script);
-            var quantitiesParsed = parsedCallData.quantities.map(q => coinQuantityfy(q));
-            await scriptTransaction.estimateAndFund(fuelWallet, {
-                quantities: quantitiesParsed
-            });
-            await fuelProvider.simulate(scriptTransaction);
-            const transactionResponse = await fuelWallet.sendTransaction(scriptTransaction);
-            if (swapId && transactionResponse)
-                setSwapTransaction(swapId, BackendTransactionStatus.Completed, transactionResponse.id);
-        }
-        catch (e) {
-            if (e?.message) {
-                setError(e.message);
-                if (e.message !== "User rejected the transaction!") {
-                    const txError = new Error(e.message);
-                    txError.name = `SwapWithdrawalError`;
-                    txError.cause = e;
-                    datadogRum.addError(txError);
-                }
-                return;
-            }
-        }
-        finally {
-            setLoading(false);
-        }
-    }, [swapId, amount, depositAddress, network, selectedSourceAccount, token, sequenceNumber, fuel]);
-    if (!provider?.activeWallet) {
-        return _jsx(ConnectWalletButton, {});
-    }
-    else if (network && activeChainId !== undefined && networkChainId !== activeChainId) {
-        return _jsx(ChangeNetworkButton, { onChange: refetchNetwork, chainId: networkChainId, network: network.display_name });
-    }
-    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(ButtonWrapper, { isDisabled: !!loading, isSubmitting: !!loading, onClick: handleTransfer, icon: _jsx(WalletIcon, { className: "stroke-2 w-6 h-6", "aria-hidden": "true" }), children: "Send from wallet" })] }));
-};
-const ChangeNetworkButton = ({ chainId, network, onChange }) => {
-    const { selectNetworkAsync, error, isPending, isError } = useSelectNetwork();
-    const clickHandler = useCallback(async () => {
-        await selectNetworkAsync({ chainId });
-        onChange();
-    }, [selectNetworkAsync, chainId]);
-    return _jsxs("div", { className: "w-full space-y-3 flex flex-col justify-between h-full text-primary-text", children: [_jsx(ChangeNetworkMessage, { data: {
-                    isPending: isPending,
-                    isError: isError,
-                    error
-                }, network: network }), !isPending &&
-                _jsx(ButtonWrapper, { onClick: clickHandler, icon: _jsx(WalletIcon, { className: "stroke-2 w-6 h-6" }), children: error ? _jsx("span", { children: "Try again" })
-                        : _jsx("span", { children: "Switch network" }) })] });
-};
-const TransactionMessage = ({ isLoading, error }) => {
-    if (isLoading) {
-        return _jsx(TransactionMessages.ConfirmTransactionMessage, {});
-    }
-    else if (error === "The account(s) sending the transaction don't have enough funds to cover the transaction."
-        || error === "the target cannot be met due to no coins available or exceeding the 255 coin limit.") {
-        return _jsx(TransactionMessages.InsufficientFundsMessage, {});
-    }
-    else if (error === "Request cancelled without user response!" || error === "User rejected the transaction!" || error === "User canceled sending transaction") {
-        return _jsx(TransactionMessages.TransactionRejectedMessage, {});
-    }
-    else if (error) {
-        const renderingError = new Error(error);
-        renderingError.name = `SwapWithdrawalError`;
-        renderingError.cause = error;
-        datadogRum.addError(renderingError);
-        return _jsx(TransactionMessages.UexpectedErrorMessage, { message: error });
-    }
-    else
-        return _jsx(_Fragment, {});
-};
-export default FuelWalletWithdrawStep;
+// import { FC, useCallback, useEffect, useState } from 'react'
+// import { BackendTransactionStatus } from '../../../../../lib/layerSwapApiClient';
+// import useWallet from '../../../../../hooks/useWallet';
+// import { useSwapTransactionStore } from '../../../../../stores/swapTransactionStore';
+// import WalletIcon from '../../../../Icons/WalletIcon';
+// import { WithdrawPageProps } from './WalletTransferContent';
+// import { ButtonWrapper, ChangeNetworkMessage, ConnectWalletButton } from './WalletTransfer/buttons';
+// import {
+//     useSelectNetwork,
+//     useFuel,
+//     useNetwork,
+// } from '@fuels/react';
+// import { useSwapDataState } from '../../../../../context/swap';
+// import { datadogRum } from '@datadog/browser-rum';
+// import { coinQuantityfy, CoinQuantityLike, Provider, ScriptTransactionRequest } from 'fuels';
+// import TransactionMessages from '../Messages/TransactionMessages';
+// const FuelWalletWithdrawStep: FC<WithdrawPageProps> = ({ network, callData, swapId, amount, depositAddress, sequenceNumber, token }) => {
+//     const [loading, setLoading] = useState(false);
+//     const [buttonClicked, setButtonClicked] = useState(false)
+//     const [error, setError] = useState<string | undefined>()
+//     const { setSwapTransaction } = useSwapTransactionStore()
+//     const { provider } = useWallet(network, 'withdrawal');
+//     const { network: fuelNetwork, refetch: refetchNetwork } = useNetwork()
+//     const networkChainId = Number(network?.chain_id)
+//     const { selectedSourceAccount } = useSwapDataState()
+//     const { fuel } = useFuel()
+//     const activeChainId = fuelNetwork?.chainId || (fuelNetwork?.url.includes('testnet') ? 0 : 9889)
+//     useEffect(() => {
+//         if (provider?.activeWallet && selectedSourceAccount) {
+//             provider?.switchAccount && provider?.switchAccount(selectedSourceAccount?.wallet, selectedSourceAccount?.address)
+//             refetchNetwork()
+//         }
+//     }, [selectedSourceAccount, provider?.activeWallet])
+//     const handleTransfer = useCallback(async () => {
+//         setButtonClicked(true)
+//         setError(undefined)
+//         try {
+//             setLoading(true)
+//             if (!network) throw Error("Network not found")
+//             if (!depositAddress) throw Error("Deposit address not found")
+//             if (!network.metadata.watchdog_contract) throw Error("Watchdog contract not found")
+//             if (!amount) throw Error("Amount not found")
+//             if (!token) throw Error("Token not found")
+//             if (!callData) throw Error("Call data not found")
+//             if (!selectedSourceAccount?.address) throw Error("No selected account")
+//             const fuelProvider = new Provider(network.node_url);
+//             const fuelWallet = await fuel.getWallet(selectedSourceAccount.address, fuelProvider);
+//             if (!fuelWallet) throw Error("Fuel wallet not found")
+//             type FuelPrepareData = {
+//                 script: ScriptTransactionRequest,
+//                 quantities: CoinQuantityLike[]
+//             }
+//             var parsedCallData: FuelPrepareData = JSON.parse(callData);
+//             var scriptTransaction = ScriptTransactionRequest.from(parsedCallData.script);
+//             var quantitiesParsed = parsedCallData.quantities.map(q => coinQuantityfy(q));
+//             await scriptTransaction.estimateAndFund(fuelWallet, {
+//                 quantities: quantitiesParsed
+//             });
+//             await fuelProvider.simulate(scriptTransaction);
+//             const transactionResponse = await fuelWallet.sendTransaction(scriptTransaction);
+//             if (swapId && transactionResponse) setSwapTransaction(swapId, BackendTransactionStatus.Completed, transactionResponse.id)
+//         }
+//         catch (e) {
+//             if (e?.message) {
+//                 setError(e.message)
+//                 if (e.message !== "User rejected the transaction!") {
+//                     const txError = new Error(e.message);
+//                     txError.name = `SwapWithdrawalError`;
+//                     txError.cause = e;
+//                     datadogRum.addError(txError);
+//                 }
+//                 return
+//             }
+//         }
+//         finally {
+//             setLoading(false)
+//         }
+//     }, [swapId, amount, depositAddress, network, selectedSourceAccount, token, sequenceNumber, fuel])
+//     if (!provider?.activeWallet) {
+//         return <ConnectWalletButton />
+//     }
+//     else if (network && activeChainId !== undefined && networkChainId !== activeChainId) {
+//         return <ChangeNetworkButton
+//             onChange={refetchNetwork}
+//             chainId={networkChainId}
+//             network={network.display_name}
+//         />
+//     }
+//     return (
+//         <div className="w-full space-y-3 flex flex-col justify-between h-full text-primary-text">
+//             {
+//                 buttonClicked &&
+//                 <TransactionMessage
+//                     error={error}
+//                     isLoading={loading}
+//                 />
+//             }
+//             {
+//                 !loading &&
+//                 <ButtonWrapper isDisabled={!!loading} isSubmitting={!!loading} onClick={handleTransfer} icon={<WalletIcon className="stroke-2 w-6 h-6" aria-hidden="true" />} >
+//                     Send from wallet
+//                 </ButtonWrapper>
+//             }
+//         </div>
+//     )
+// }
+// const ChangeNetworkButton: FC<{ chainId: number, network: string, onChange: () => void }> = ({ chainId, network, onChange }) => {
+//     const { selectNetworkAsync, error, isPending, isError } = useSelectNetwork();
+//     const clickHandler = useCallback(async () => {
+//         await selectNetworkAsync({ chainId });
+//         onChange();
+//     }, [selectNetworkAsync, chainId])
+//     return <div className="w-full space-y-3 flex flex-col justify-between h-full text-primary-text">
+//         {
+//             <ChangeNetworkMessage
+//                 data={{
+//                     isPending: isPending,
+//                     isError: isError,
+//                     error
+//                 }}
+//                 network={network}
+//             />
+//         }
+//         {
+//             !isPending &&
+//             <ButtonWrapper
+//                 onClick={clickHandler}
+//                 icon={<WalletIcon className="stroke-2 w-6 h-6" />}
+//             >
+//                 {
+//                     error ? <span>Try again</span>
+//                         : <span>Switch network</span>
+//                 }
+//             </ButtonWrapper>
+//         }
+//     </div>
+// }
+// const TransactionMessage: FC<{ isLoading: boolean, error: string | undefined }> = ({ isLoading, error }) => {
+//     if (isLoading) {
+//         return <TransactionMessages.ConfirmTransactionMessage />
+//     }
+//     else if (error === "The account(s) sending the transaction don't have enough funds to cover the transaction." 
+//         || error === "the target cannot be met due to no coins available or exceeding the 255 coin limit."
+//     ) {
+//         return <TransactionMessages.InsufficientFundsMessage />
+//     }
+//     else if (error === "Request cancelled without user response!" || error === "User rejected the transaction!" || error === "User canceled sending transaction") {
+//         return <TransactionMessages.TransactionRejectedMessage />
+//     }
+//     else if (error) {
+//         const renderingError = new Error(error);
+//         renderingError.name = `SwapWithdrawalError`;
+//         renderingError.cause = error;
+//         datadogRum.addError(renderingError);
+//         return <TransactionMessages.UexpectedErrorMessage message={error} />
+//     }
+//     else return <></>
+// }
+// export default FuelWalletWithdrawStep;

package/dist/components/Pages/SwapPages/Withdraw/Wallet/ImtblxWalletWithdrawStep.d.ts

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