@lifi/widget 1.23.1 → 1.25.0

package/pages/SwapPage/StatusBottomSheet.js

@@ -9,16 +9,18 @@ import { BottomSheet } from '../../components/BottomSheet';
 import { Token } from '../../components/Token';
 import { getProcessMessage, useChains, useNavigateBack, useTokenBalance, } from '../../hooks';
 import { SwapFormKey } from '../../providers';
-import { navigationRoutes, shortenWalletAddress } from '../../utils';
+import { RouteExecutionStatus } from '../../stores';
+import { formatTokenAmount, hasEnumFlag, navigationRoutes, shortenWalletAddress, } from '../../utils';
 import { IconCircle, IconContainer } from './StatusBottomSheet.style';
 export const StatusBottomSheet = ({ status, route, }) => {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     const { t } = useTranslation();
     const { navigateBack, navigate } = useNavigateBack();
     const ref = useRef(null);
     const { getChainById } = useChains();
     const { setValue } = useFormContext();
-    const { token, refetch, refetchNewBalance, refetchAllBalances } = useTokenBalance(route.toToken, route.toAddress);
+    const toToken = Object.assign(Object.assign({}, ((_c = (_b = (_a = route.steps.at(-1)) === null || _a === void 0 ? void 0 : _a.execution) === null || _b === void 0 ? void 0 : _b.toToken) !== null && _c !== void 0 ? _c : route.toToken)), { amount: (_h = (_f = (_e = (_d = route.steps.at(-1)) === null || _d === void 0 ? void 0 : _d.execution) === null || _e === void 0 ? void 0 : _e.toAmount) !== null && _f !== void 0 ? _f : (_g = route.steps.at(-1)) === null || _g === void 0 ? void 0 : _g.estimate.toAmount) !== null && _h !== void 0 ? _h : route.toAmount });
+    const { token, refetch, refetchNewBalance, refetchAllBalances } = useTokenBalance(toToken, route.toAddress);
     const clearFromAmount = () => {
         refetchAllBalances();
         setValue(SwapFormKey.FromAmount, '');
@@ -27,6 +29,22 @@ export const StatusBottomSheet = ({ status, route, }) => {
         clearFromAmount();
         navigateBack();
     };
+    const handlePartialDone = () => {
+        clearFromAmount();
+        if (toToken.chainId !== route.toToken.chainId &&
+            toToken.address !== route.toToken.address) {
+            setValue(SwapFormKey.FromAmount, formatTokenAmount(toToken.amount, toToken.decimals), { shouldTouch: true });
+            setValue(SwapFormKey.FromChain, toToken.chainId, { shouldTouch: true });
+            setValue(SwapFormKey.FromToken, toToken.address, { shouldTouch: true });
+            setValue(SwapFormKey.ToChain, route.toToken.chainId, {
+                shouldTouch: true,
+            });
+            setValue(SwapFormKey.ToToken, route.toToken.address, {
+                shouldTouch: true,
+            });
+        }
+        navigateBack();
+    };
     const handleClose = () => {
         var _a;
         clearFromAmount();
@@ -40,26 +58,50 @@ export const StatusBottomSheet = ({ status, route, }) => {
         });
     };
     let title;
-    let message;
+    let primaryMessage;
+    let secondaryMessage;
+    let handlePrimaryButton = handleDone;
     switch (status) {
-        case 'success':
+        case RouteExecutionStatus.Done: {
             title = t('swap.success.title.swapSuccessful');
-            message = t('swap.success.message.swapSuccessful', {
-                amount: token === null || token === void 0 ? void 0 : token.amount,
-                tokenSymbol: token === null || token === void 0 ? void 0 : token.symbol,
-                chainName: (_a = getChainById(route.toChainId)) === null || _a === void 0 ? void 0 : _a.name,
-                walletAddress: shortenWalletAddress(route.toAddress),
+            if (token) {
+                primaryMessage = t('swap.success.message.swapSuccessful', {
+                    amount: token.amount,
+                    tokenSymbol: token.symbol,
+                    chainName: (_j = getChainById(token.chainId)) === null || _j === void 0 ? void 0 : _j.name,
+                    walletAddress: shortenWalletAddress(route.toAddress),
+                });
+            }
+            handlePrimaryButton = handleDone;
+            break;
+        }
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Partial: {
+            title = t('swap.success.title.swapPartiallySuccessful');
+            primaryMessage = t('swap.success.message.swapPartiallySuccessful', {
+                tool: (_k = route.steps.at(-1)) === null || _k === void 0 ? void 0 : _k.toolDetails.name,
+                tokenSymbol: (_l = route.steps.at(-1)) === null || _l === void 0 ? void 0 : _l.action.toToken.symbol,
             });
+            if (token) {
+                secondaryMessage = t('swap.success.message.swapSuccessful', {
+                    amount: token.amount,
+                    tokenSymbol: token.symbol,
+                    chainName: (_m = getChainById(token.chainId)) === null || _m === void 0 ? void 0 : _m.name,
+                    walletAddress: shortenWalletAddress(route.toAddress),
+                });
+            }
+            handlePrimaryButton = handlePartialDone;
             break;
-        case 'error': {
+        }
+        case RouteExecutionStatus.Failed: {
             const step = route.steps.find((step) => { var _a; return ((_a = step.execution) === null || _a === void 0 ? void 0 : _a.status) === 'FAILED'; });
-            const process = (_b = step === null || step === void 0 ? void 0 : step.execution) === null || _b === void 0 ? void 0 : _b.process.find((process) => process.status === 'FAILED');
+            const process = (_o = step === null || step === void 0 ? void 0 : step.execution) === null || _o === void 0 ? void 0 : _o.process.find((process) => process.status === 'FAILED');
             if (!step || !process) {
                 break;
             }
             const processMessage = getProcessMessage(t, getChainById, step, process);
             title = processMessage.title;
-            message = processMessage.message;
+            primaryMessage = processMessage.message;
+            handlePrimaryButton = handleClose;
             break;
         }
         default:
@@ -67,14 +109,20 @@ export const StatusBottomSheet = ({ status, route, }) => {
     }
     useEffect(() => {
         var _a, _b;
-        if ((status === 'success' || status === 'error') &&
+        const hasSuccessFlag = hasEnumFlag(status, RouteExecutionStatus.Done);
+        if ((hasSuccessFlag || hasEnumFlag(status, RouteExecutionStatus.Failed)) &&
             !((_a = ref.current) === null || _a === void 0 ? void 0 : _a.isOpen())) {
-            if (status === 'success') {
+            if (hasSuccessFlag) {
                 refetchNewBalance();
                 refetch();
             }
             (_b = ref.current) === null || _b === void 0 ? void 0 : _b.open();
         }
     }, [refetch, refetchNewBalance, status]);
-    return (_jsx(BottomSheet, Object.assign({ ref: ref }, { children: _jsxs(Box, Object.assign({ p: 3 }, { children: [_jsxs(IconContainer, { children: [_jsxs(IconCircle, Object.assign({ status: status, mb: 1 }, { children: [status === 'idle' ? _jsx(InfoIcon, { color: "primary" }) : null, status === 'success' ? _jsx(DoneIcon, { color: "success" }) : null, status === 'error' ? _jsx(WarningIcon, { color: "error" }) : null] })), _jsx(Typography, Object.assign({ py: 1, fontSize: 18, fontWeight: 700 }, { children: title })), status === 'success' ? (_jsx(Token, { token: Object.assign(Object.assign({}, route.toToken), { amount: (_g = (_e = (_d = (_c = route.steps.at(-1)) === null || _c === void 0 ? void 0 : _c.execution) === null || _d === void 0 ? void 0 : _d.toAmount) !== null && _e !== void 0 ? _e : (_f = route.steps.at(-1)) === null || _f === void 0 ? void 0 : _f.estimate.toAmount) !== null && _g !== void 0 ? _g : route.toAmount }), py: 1, disableDescription: true })) : null] }), _jsx(Typography, Object.assign({ py: 1 }, { children: message })), _jsx(Box, Object.assign({ mt: 2 }, { children: _jsxs(Button, Object.assign({ variant: "contained", fullWidth: true, onClick: status === 'success' ? handleDone : handleClose }, { children: [status === 'idle' ? t('button.ok') : null, status === 'success' ? t('button.done') : null, status === 'error' ? t('button.seeDetails') : null] })) })), status === 'success' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "text", fullWidth: true, onClick: handleSeeDetails }, { children: t('button.seeDetails') })) }))) : null] })) })));
+    return (_jsx(BottomSheet, Object.assign({ ref: ref }, { children: _jsxs(Box, Object.assign({ p: 3 }, { children: [_jsxs(IconContainer, { children: [_jsxs(IconCircle, Object.assign({ status: status, mb: 1 }, { children: [status === RouteExecutionStatus.Idle ? (_jsx(InfoIcon, { color: "primary" })) : null, status === RouteExecutionStatus.Done ? (_jsx(DoneIcon, { color: "success" })) : null, hasEnumFlag(status, RouteExecutionStatus.Partial) ||
+                                    hasEnumFlag(status, RouteExecutionStatus.Refunded) ? (_jsx(WarningIcon, { color: "warning" })) : null, hasEnumFlag(status, RouteExecutionStatus.Failed) ? (_jsx(WarningIcon, { color: "error" })) : null] })), _jsx(Typography, Object.assign({ py: 1, fontSize: 18, fontWeight: 700 }, { children: title })), hasEnumFlag(status, RouteExecutionStatus.Done) ? (_jsx(Token, { token: toToken, py: 1, disableDescription: true })) : null] }), _jsx(Typography, Object.assign({ py: 1 }, { children: primaryMessage })), secondaryMessage ? (_jsx(Typography, Object.assign({ py: 1 }, { children: secondaryMessage }))) : null, _jsx(Box, Object.assign({ mt: 2 }, { children: _jsxs(Button, Object.assign({ variant: "contained", fullWidth: true, onClick: handlePrimaryButton }, { children: [status === RouteExecutionStatus.Idle ? t('button.ok') : null, hasEnumFlag(status, RouteExecutionStatus.Done)
+                                ? t('button.done')
+                                : null, status === RouteExecutionStatus.Failed
+                                ? t('button.seeDetails')
+                                : null] })) })), hasEnumFlag(status, RouteExecutionStatus.Done) ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "text", onClick: handleSeeDetails, fullWidth: true }, { children: t('button.seeDetails') })) }))) : null] })) })));
 };

package/pages/SwapPage/StatusBottomSheet.style.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import type { Theme } from '@mui/material';
-import type { RouteExecutionStatus } from '../../stores';
+import { RouteExecutionStatus } from '../../stores';
+type StatusColor = RouteExecutionStatus | 'warning';
 export declare const IconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<Theme> & {
     children?: import("react").ReactNode;
     component?: import("react").ElementType<any> | undefined;
@@ -17,5 +18,6 @@ export declare const IconCircle: import("@emotion/styled").StyledComponent<impor
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
 }, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "ref" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "component"> & import("@mui/system").MUIStyledCommonProps<Theme> & {
-    status: RouteExecutionStatus;
+    status: StatusColor;
 }, {}, {}>;
+export {};

package/pages/SwapPage/StatusBottomSheet.style.js

@@ -1,11 +1,14 @@
 import { Box } from '@mui/material';
 import { alpha, darken, styled } from '@mui/material/styles';
+import { RouteExecutionStatus } from '../../stores';
 const getStatusColor = (status, theme) => {
     switch (status) {
-        case 'success':
+        case RouteExecutionStatus.Done:
             return { color: theme.palette.success.main, alpha: 0.15, darken: 0 };
-        case 'error':
+        case RouteExecutionStatus.Failed:
             return { color: theme.palette.error.main, alpha: 0.2, darken: 0 };
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Partial:
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Refunded:
         case 'warning':
             return { color: theme.palette.warning.main, alpha: 0.7, darken: 0.4 };
         default:

package/pages/SwapPage/SwapPage.js

@@ -20,6 +20,7 @@ import { StepDivider } from '../../components/StepDivider';
 import { SwapButton } from '../../components/SwapButton';
 import { useNavigateBack, useRouteExecution } from '../../hooks';
 import { SwapFormKey } from '../../providers';
+import { RouteExecutionStatus } from '../../stores';
 import { StatusBottomSheet } from './StatusBottomSheet';
 import { Container } from './SwapPage.style';
 import { getTokenValueLossThreshold, TokenValueBottomSheet, } from './TokenValueBottomSheet';
@@ -40,7 +41,7 @@ export const SwapPage = () => {
     }, [executeRoute, setValue]);
     const handleSwapClick = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
-        if (status === 'idle') {
+        if (status === RouteExecutionStatus.Idle) {
             const thresholdExceeded = getTokenValueLossThreshold(route);
             if (thresholdExceeded) {
                 (_a = tokenValueBottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.open();
@@ -49,7 +50,7 @@ export const SwapPage = () => {
                 handleExecuteRoute();
             }
         }
-        if (status === 'error') {
+        if (status === RouteExecutionStatus.Failed) {
             restartRoute();
         }
     });
@@ -59,9 +60,9 @@ export const SwapPage = () => {
     };
     const getSwapButtonText = () => {
         switch (status) {
-            case 'idle':
+            case RouteExecutionStatus.Idle:
                 return t('button.startSwap');
-            case 'error':
+            case RouteExecutionStatus.Failed:
                 return t('button.restartSwap');
             default:
                 return '';
@@ -74,9 +75,10 @@ export const SwapPage = () => {
                 const toToken = index === steps.length - 1
                     ? Object.assign(Object.assign({}, ((_b = (_a = step.execution) === null || _a === void 0 ? void 0 : _a.toToken) !== null && _b !== void 0 ? _b : (_c = step.action) === null || _c === void 0 ? void 0 : _c.toToken)), { amount: (_e = (_d = step.execution) === null || _d === void 0 ? void 0 : _d.toAmount) !== null && _e !== void 0 ? _e : step.estimate.toAmount }) : undefined;
                 return (_jsxs(Fragment, { children: [_jsx(Step, { step: step, fromToken: fromToken, toToken: toToken }), steps.length > 1 && index !== steps.length - 1 ? (_jsx(StepDivider, {})) : null] }, step.id));
-            }), status === 'idle' || status === 'error' ? (_jsxs(_Fragment, { children: [_jsx(GasSufficiencyMessage, { route: route, mt: 2 }), _jsxs(Box, Object.assign({ mt: 2, display: "flex" }, { children: [_jsx(SwapButton, { text: getSwapButtonText(), onClick: handleSwapClick, currentRoute: route, 
+            }), status === RouteExecutionStatus.Idle ||
+                status === RouteExecutionStatus.Failed ? (_jsxs(_Fragment, { children: [_jsx(GasSufficiencyMessage, { route: route, mt: 2 }), _jsxs(Box, Object.assign({ mt: 2, display: "flex" }, { children: [_jsx(SwapButton, { text: getSwapButtonText(), onClick: handleSwapClick, currentRoute: route, 
                                 // disable={status === 'idle' && (isValidating || !isValid)}
-                                enableLoading: true }), status === 'error' ? (_jsx(Tooltip, Object.assign({ title: t('button.removeSwap'), placement: "bottom-end", enterDelay: 400, arrow: true }, { children: _jsx(Button, Object.assign({ onClick: handleRemoveRoute, sx: {
+                                enableLoading: true }), status === RouteExecutionStatus.Failed ? (_jsx(Tooltip, Object.assign({ title: t('button.removeSwap'), placement: "bottom-end", enterDelay: 400, arrow: true }, { children: _jsx(Button, Object.assign({ onClick: handleRemoveRoute, sx: {
                                         minWidth: 48,
                                         marginLeft: 1,
                                     } }, { children: _jsx(DeleteIcon, {}) })) }))) : null] }))] })) : null, route && status ? (_jsx(StatusBottomSheet, { status: status, route: route })) : null, route ? (_jsx(TokenValueBottomSheet, { route: route, ref: tokenValueBottomSheetRef, onContinue: handleExecuteRoute })) : null] }));

package/pages/SwapRoutesPage/SwapRoutesPage.style.d.ts

@@ -2,7 +2,7 @@
 export declare const Stack: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
     ref?: import("react").Ref<unknown> | undefined;
     children?: import("react").ReactNode;
-    direction?: import("@mui/system").ResponsiveStyleValue<"row" | "column" | "column-reverse" | "row-reverse"> | undefined;
+    direction?: import("@mui/system").ResponsiveStyleValue<"column" | "column-reverse" | "row" | "row-reverse"> | undefined;
     spacing?: import("@mui/system").ResponsiveStyleValue<string | number> | undefined;
     divider?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;

package/providers/I18nProvider/types.d.ts

@@ -1,16 +1,16 @@
 import type * as languages from '../../i18n';
-export declare type PartialResource<T> = T extends object ? {
+export type PartialResource<T> = T extends object ? {
     [P in keyof T]?: PartialResource<T[P]>;
 } : T;
-export declare type LanguageKey = keyof typeof languages;
-export declare type LanguageResources = {
+export type LanguageKey = keyof typeof languages;
+export type LanguageResources = {
     [language in LanguageKey]?: PartialResource<typeof languages.en>;
 } | {
     [language: string]: PartialResource<typeof languages.en>;
 };
-export declare type LanguageTranslationResource = {
+export type LanguageTranslationResource = {
     [namespace in 'translation']: PartialResource<typeof languages.en>;
 };
-export declare type LanguageTranslationResources = {
+export type LanguageTranslationResources = {
     [language: string]: LanguageTranslationResource;
 };

package/providers/SwapFormProvider/FormUpdater.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { SwapFormValues } from '../SwapFormProvider';
+export declare const FormUpdater: React.FC<{
+    defaultValues: Partial<SwapFormValues>;
+}>;

package/providers/{WalletProvider/WalletFormUpdate.js → SwapFormProvider/FormUpdater.js}

@@ -1,47 +1,35 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 import { useFormContext } from 'react-hook-form';
-import { useChainOrderStore } from '../../stores';
 import { SwapFormKey } from '../SwapFormProvider';
+import { useWallet } from '../WalletProvider';
 import { isItemAllowed, useWidgetConfig } from '../WidgetProvider';
-export const WalletFormUpdate = ({ account, }) => {
+export const FormUpdater = ({ defaultValues }) => {
     const { fromChain, toChain, chains, disabledChains } = useWidgetConfig();
-    const { setValue, getValues, getFieldState, 
+    const { account } = useWallet();
+    const { setValue, getValues, getFieldState, resetField, 
     // Subscription to touchedFields is required by getFieldState to work
     formState: { touchedFields }, } = useFormContext();
+    const previousDefaultValues = useRef(defaultValues);
     // Set wallet chain as default if no chains are provided by config and if they were not changed during widget usage
     useEffect(() => {
         const chainAllowed = account.chainId && isItemAllowed(account.chainId, chains, disabledChains);
         if (!account.isActive || !account.chainId || !chainAllowed) {
             return;
         }
-        const [fromChainValue, toChainValue] = getValues([
-            SwapFormKey.FromChain,
-            SwapFormKey.ToChain,
-        ]);
         const { isTouched: isFromChainTouched } = getFieldState(SwapFormKey.FromChain);
         const { isTouched: isToChainTouched } = getFieldState(SwapFormKey.ToChain);
         const { isTouched: isFromTokenTouched } = getFieldState(SwapFormKey.FromToken);
         const { isTouched: isToTokenTouched } = getFieldState(SwapFormKey.ToToken);
         const { isTouched: isFromAmountTouched } = getFieldState(SwapFormKey.FromAmount);
-        const { chainOrder, setChain } = useChainOrderStore.getState();
-        // Users can switch chains in the wallet.
-        // If we don't have a chain in the ordered chain list we should add it.
-        setChain(account.chainId);
-        // If we ran out of slots for the ordered chain list and the current chain isn't there
-        // we should make a recently switched chain as current.
-        const hasFromChainInOrderedList = chainOrder.includes(fromChainValue);
-        const hasToChainInOrderedList = chainOrder.includes(toChainValue);
-        if ((!fromChain && !isFromChainTouched && !isFromTokenTouched) ||
-            !hasFromChainInOrderedList) {
+        if (!fromChain && !isFromChainTouched && !isFromTokenTouched) {
             setValue(SwapFormKey.FromChain, account.chainId);
             setValue(SwapFormKey.FromToken, '');
             if (isFromAmountTouched) {
                 setValue(SwapFormKey.FromAmount, '');
             }
         }
-        if ((!toChain && !isToChainTouched && !isToTokenTouched) ||
-            !hasToChainInOrderedList) {
+        if (!toChain && !isToChainTouched && !isToTokenTouched) {
             setValue(SwapFormKey.ToChain, account.chainId);
             setValue(SwapFormKey.ToToken, '');
         }
@@ -56,5 +44,20 @@ export const WalletFormUpdate = ({ account, }) => {
         setValue,
         toChain,
     ]);
+    useEffect(() => {
+        Object.keys(defaultValues).forEach((key) => {
+            if (previousDefaultValues.current[key] !== defaultValues[key]) {
+                const value = defaultValues[key] ||
+                    // set the chain to the current user one if it is not present in the config
+                    (key === SwapFormKey.FromChain || key === SwapFormKey.ToChain
+                        ? account.chainId || ''
+                        : '');
+                setValue(key, value);
+                resetField(key, { defaultValue: value });
+            }
+        });
+        previousDefaultValues.current = defaultValues;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [defaultValues, getValues, resetField, setValue]);
     return null;
 };

package/providers/SwapFormProvider/SwapFormProvider.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useWidgetConfig } from '../WidgetProvider';
+import { FormUpdater } from './FormUpdater';
 import { SwapFormKey } from './types';
 import { URLSearchParamsBuilder } from './URLSearchParamsBuilder';
 export const formDefaultValues = {
@@ -10,13 +12,16 @@ export const formDefaultValues = {
 };
 export const SwapFormProvider = ({ children, }) => {
     const { fromChain, fromToken, fromAmount, toChain, toToken, toAddress, buildSwapUrl, } = useWidgetConfig();
+    const defaultValues = useMemo(() => (Object.assign(Object.assign({}, formDefaultValues), { fromChain,
+        fromToken, fromAmount: (typeof fromAmount === 'number'
+            ? fromAmount === null || fromAmount === void 0 ? void 0 : fromAmount.toPrecision()
+            : fromAmount) || formDefaultValues.fromAmount, toChain,
+        toToken,
+        toAddress })), [fromAmount, fromChain, fromToken, toAddress, toChain, toToken]);
     const methods = useForm({
-        defaultValues: Object.assign(Object.assign({}, formDefaultValues), { fromChain,
-            fromToken, fromAmount: (typeof fromAmount === 'number'
-                ? fromAmount === null || fromAmount === void 0 ? void 0 : fromAmount.toPrecision()
-                : fromAmount) || formDefaultValues.fromAmount, toChain,
-            toToken,
-            toAddress }),
+        // TODO: revisit after RHF release values support
+        // values,
+        defaultValues,
     });
-    return (_jsxs(FormProvider, Object.assign({}, methods, { children: [buildSwapUrl ? _jsx(URLSearchParamsBuilder, {}) : null, children] })));
+    return (_jsxs(FormProvider, Object.assign({}, methods, { children: [_jsx(FormUpdater, { defaultValues: defaultValues }), buildSwapUrl ? _jsx(URLSearchParamsBuilder, {}) : null, children] })));
 };

package/providers/SwapFormProvider/types.d.ts

@@ -7,7 +7,7 @@ export declare enum SwapFormKey {
     ToToken = "toToken",
     TokenSearchFilter = "tokenSearchFilter"
 }
-export declare type SwapFormValues = {
+export type SwapFormValues = {
     [SwapFormKey.FromAmount]: string;
     [SwapFormKey.FromChain]: number;
     [SwapFormKey.FromToken]: string;
@@ -16,7 +16,7 @@ export declare type SwapFormValues = {
     [SwapFormKey.ToToken]: string;
     [SwapFormKey.TokenSearchFilter]: string;
 };
-export declare type SwapFormType = 'from' | 'to';
+export type SwapFormType = 'from' | 'to';
 export declare const SwapFormKeyHelper: {
     getChainKey: (formType: SwapFormType) => 'fromChain' | 'toChain';
     getTokenKey: (formType: SwapFormType) => 'fromToken' | 'toToken';

package/providers/WalletProvider/WalletProvider.d.ts

@@ -1,4 +1,4 @@
-import type { Signer } from 'ethers';
+import type { Signer } from '@ethersproject/abstract-signer';
 import type { FC, PropsWithChildren } from 'react';
 import type { WalletContextProps } from './types';
 export declare const useWallet: () => WalletContextProps;

package/providers/WalletProvider/WalletProvider.js

@@ -7,11 +7,10 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { addChain as walletAddChain, switchChain as walletSwitchChain, switchChainAndAddToken, useLiFiWalletManagement, } from '@lifi/wallet-management';
 import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from 'react';
 import { useWidgetConfig } from '../WidgetProvider';
-import { WalletFormUpdate } from './WalletFormUpdate';
 const stub = () => {
     throw new Error('You forgot to wrap your component in <WalletProvider>.');
 };
@@ -91,7 +90,7 @@ export const WalletProvider = ({ children }) => {
         account,
         provider,
     }), [account, addChain, addToken, connect, disconnect, provider, switchChain]);
-    return (_jsxs(WalletContext.Provider, Object.assign({ value: value }, { children: [_jsx(WalletFormUpdate, { account: account }), children] })));
+    return (_jsx(WalletContext.Provider, Object.assign({ value: value }, { children: children })));
 };
 export const extractAccountFromSigner = (signer) => __awaiter(void 0, void 0, void 0, function* () {
     try {

package/providers/WalletProvider/types.d.ts

@@ -1,10 +1,10 @@
-import type { Web3Provider } from '@ethersproject/providers';
+import type { Signer } from '@ethersproject/abstract-signer';
+import type { Provider } from '@ethersproject/providers';
 import type { Token } from '@lifi/sdk';
 import type { Wallet } from '@lifi/wallet-management';
-import type { Signer } from 'ethers';
 export interface WalletContextProps {
     account: WalletAccount;
-    provider?: Web3Provider;
+    provider?: Provider;
     addChain(chainId: number): Promise<boolean>;
     addToken(chainId: number, token: Token): Promise<void>;
     disconnect(): void;

package/providers/WidgetProvider/WidgetProvider.js

@@ -11,7 +11,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { getChainByKey } from '@lifi/sdk';
-import { createContext, useContext, useMemo } from 'react';
+import { createContext, useContext, useEffect, useMemo } from 'react';
+import { setDefaultSettings } from '../../stores';
 import { formatAmount } from '../../utils';
 const initialContext = {
     disabledChains: [],
@@ -55,5 +56,8 @@ export const WidgetProvider = (_a) => {
             return config;
         }
     }, [config, fromAmount, fromChain, fromToken, toChain, toToken]);
+    useEffect(() => {
+        setDefaultSettings(value);
+    }, [value]);
     return (_jsx(WidgetContext.Provider, Object.assign({ value: value }, { children: children })));
 };

package/providers/WidgetProvider/types.d.ts

@@ -1,5 +1,5 @@
 import type { WidgetConfig } from '../../types';
-export declare type WidgetContextProps = WidgetConfig & {
+export type WidgetContextProps = WidgetConfig & {
     fromChain?: number;
     toChain?: number;
 };

package/stores/routes/types.d.ts

@@ -7,7 +7,14 @@ export interface RouteExecutionStore {
     deleteRoute: (routeId: string) => void;
     deleteRoutes: (type: 'completed' | 'active') => void;
 }
-export declare type RouteExecutionStatus = 'error' | 'idle' | 'loading' | 'success' | 'warning';
+export declare enum RouteExecutionStatus {
+    Idle = 0,
+    Pending = 1,
+    Done = 2,
+    Failed = 4,
+    Partial = 8,
+    Refunded = 16
+}
 export interface RouteExecution {
     route: Route;
     status: RouteExecutionStatus;

package/stores/routes/types.js

@@ -1 +1,9 @@
-export {};
+export var RouteExecutionStatus;
+(function (RouteExecutionStatus) {
+    RouteExecutionStatus[RouteExecutionStatus["Idle"] = 0] = "Idle";
+    RouteExecutionStatus[RouteExecutionStatus["Pending"] = 1] = "Pending";
+    RouteExecutionStatus[RouteExecutionStatus["Done"] = 2] = "Done";
+    RouteExecutionStatus[RouteExecutionStatus["Failed"] = 4] = "Failed";
+    RouteExecutionStatus[RouteExecutionStatus["Partial"] = 8] = "Partial";
+    RouteExecutionStatus[RouteExecutionStatus["Refunded"] = 16] = "Refunded";
+})(RouteExecutionStatus || (RouteExecutionStatus = {}));

package/stores/routes/useExecutingRoutesIds.js

@@ -1,9 +1,11 @@
 import shallow from 'zustand/shallow';
+import { RouteExecutionStatus } from './types';
 import { useRouteExecutionStore } from './useRouteExecutionStore';
 export const useExecutingRoutesIds = (address) => {
     return useRouteExecutionStore((state) => Object.values(state.routes)
         .filter((item) => item.route.fromAddress === address &&
-        (item.status === 'loading' || item.status === 'error'))
+        (item.status === RouteExecutionStatus.Pending ||
+            item.status === RouteExecutionStatus.Failed))
         .sort((a, b) => {
         var _a, _b, _c, _d;
         return ((_b = (_a = b === null || b === void 0 ? void 0 : b.route.steps[0].execution) === null || _a === void 0 ? void 0 : _a.process[0].startedAt) !== null && _b !== void 0 ? _b : 0) -