@lifi/widget 3.0.0-alpha.0 → 3.0.0-alpha.2

package/src/_esm/pages/TransactionPage/StatusBottomSheet.js

@@ -0,0 +1,162 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import DoneIcon from '@mui/icons-material/Done';
+import ErrorRoundedIcon from '@mui/icons-material/ErrorRounded';
+import InfoRoundedIcon from '@mui/icons-material/InfoRounded';
+import WarningRoundedIcon from '@mui/icons-material/WarningRounded';
+import { Box, Button, Typography } from '@mui/material';
+import { useEffect, useRef } from 'react';
+import { useFormContext } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+import { BottomSheet } from '../../components/BottomSheet';
+import { Token } from '../../components/Token';
+import { getProcessMessage, useAvailableChains, useNavigateBack, useTokenBalance, } from '../../hooks';
+import { FormKey, useWidgetConfig } from '../../providers';
+import { RouteExecutionStatus, getSourceTxHash } from '../../stores';
+import { formatTokenAmount, hasEnumFlag, navigationRoutes, shortenAddress, } from '../../utils';
+import { CenterContainer, IconCircle } from './StatusBottomSheet.style';
+export const StatusBottomSheet = ({ status, route, }) => {
+    const { t } = useTranslation();
+    const { navigateBack, navigate } = useNavigateBack();
+    const ref = useRef(null);
+    const { getChainById } = useAvailableChains();
+    const { setValue } = useFormContext();
+    const { subvariant, contractComponent, contractSecondaryComponent, contractCompactComponent, } = useWidgetConfig();
+    const toToken = {
+        ...(route.steps.at(-1)?.execution?.toToken ?? route.toToken),
+        amount: BigInt(route.steps.at(-1)?.execution?.toAmount ??
+            route.steps.at(-1)?.estimate.toAmount ??
+            route.toAmount),
+    };
+    const { token, refetch, refetchNewBalance, refetchAllBalances } = useTokenBalance(route.toAddress, toToken);
+    const clearFromAmount = () => {
+        refetchAllBalances();
+        setValue(FormKey.FromAmount, '');
+        setValue(FormKey.ToAmount, '');
+    };
+    const handleDone = () => {
+        clearFromAmount();
+        navigateBack();
+    };
+    const handlePartialDone = () => {
+        clearFromAmount();
+        if (toToken.chainId !== route.toToken.chainId &&
+            toToken.address !== route.toToken.address) {
+            setValue(FormKey.FromAmount, formatTokenAmount(toToken.amount, toToken.decimals), { shouldTouch: true });
+            setValue(FormKey.FromChain, toToken.chainId, { shouldTouch: true });
+            setValue(FormKey.FromToken, toToken.address, { shouldTouch: true });
+            setValue(FormKey.ToChain, route.toToken.chainId, {
+                shouldTouch: true,
+            });
+            setValue(FormKey.ToToken, route.toToken.address, {
+                shouldTouch: true,
+            });
+        }
+        navigateBack();
+    };
+    const handleClose = () => {
+        clearFromAmount();
+        ref.current?.close();
+    };
+    const handleSeeDetails = () => {
+        handleClose();
+        const transactionHash = getSourceTxHash(route);
+        navigate(navigationRoutes.transactionDetails, {
+            state: {
+                routeId: route.id,
+                transactionHash,
+            },
+            replace: true,
+        });
+    };
+    const transactionType = route.fromChainId === route.toChainId ? 'swap' : 'bridge';
+    let title;
+    let primaryMessage;
+    let secondaryMessage;
+    let handlePrimaryButton = handleDone;
+    switch (status) {
+        case RouteExecutionStatus.Done: {
+            title =
+                subvariant === 'nft'
+                    ? t('success.title.purchaseSuccessful')
+                    : t(`success.title.${transactionType}Successful`);
+            if (token) {
+                primaryMessage = t('success.message.exchangeSuccessful', {
+                    amount: formatTokenAmount(token.amount, token.decimals),
+                    tokenSymbol: token.symbol,
+                    chainName: getChainById(token.chainId)?.name,
+                    walletAddress: shortenAddress(route.toAddress),
+                });
+            }
+            handlePrimaryButton = handleDone;
+            break;
+        }
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Partial: {
+            title = t(`success.title.${transactionType}PartiallySuccessful`);
+            primaryMessage = t('success.message.exchangePartiallySuccessful', {
+                tool: route.steps.at(-1)?.toolDetails.name,
+                tokenSymbol: route.steps.at(-1)?.action.toToken.symbol,
+            });
+            if (token) {
+                secondaryMessage = t('success.message.exchangeSuccessful', {
+                    amount: formatTokenAmount(token.amount, token.decimals),
+                    tokenSymbol: token.symbol,
+                    chainName: getChainById(token.chainId)?.name,
+                    walletAddress: shortenAddress(route.toAddress),
+                });
+            }
+            handlePrimaryButton = handlePartialDone;
+            break;
+        }
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Refunded: {
+            title = t('success.title.refundIssued');
+            primaryMessage = t('success.message.exchangePartiallySuccessful', {
+                tool: route.steps.at(-1)?.toolDetails.name,
+                tokenSymbol: route.steps.at(-1)?.action.toToken.symbol,
+            });
+            if (token) {
+                secondaryMessage = t('success.message.exchangeSuccessful', {
+                    amount: formatTokenAmount(token.amount, token.decimals),
+                    tokenSymbol: token.symbol,
+                    chainName: getChainById(token.chainId)?.name,
+                    walletAddress: shortenAddress(route.toAddress),
+                });
+            }
+            break;
+        }
+        case RouteExecutionStatus.Failed: {
+            const step = route.steps.find((step) => step.execution?.status === 'FAILED');
+            const process = step?.execution?.process.find((process) => process.status === 'FAILED');
+            if (!step || !process) {
+                break;
+            }
+            const processMessage = getProcessMessage(t, getChainById, step, process);
+            title = processMessage.title;
+            primaryMessage = processMessage.message;
+            handlePrimaryButton = handleClose;
+            break;
+        }
+        default:
+            break;
+    }
+    useEffect(() => {
+        const hasSuccessFlag = hasEnumFlag(status, RouteExecutionStatus.Done);
+        if ((hasSuccessFlag || hasEnumFlag(status, RouteExecutionStatus.Failed)) &&
+            !ref.current?.isOpen()) {
+            if (hasSuccessFlag) {
+                refetchNewBalance();
+                refetch();
+            }
+            ref.current?.open();
+        }
+    }, [refetch, refetchNewBalance, status]);
+    const showContractComponent = subvariant === 'nft' && hasEnumFlag(status, RouteExecutionStatus.Done);
+    return (_jsx(BottomSheet, { ref: ref, children: _jsxs(Box, { p: 3, children: [!showContractComponent ? (_jsx(CenterContainer, { children: _jsxs(IconCircle, { status: status, mb: 1, children: [status === RouteExecutionStatus.Idle ? (_jsx(InfoRoundedIcon, { color: "primary" })) : null, status === RouteExecutionStatus.Done ? (_jsx(DoneIcon, { color: "success" })) : null, hasEnumFlag(status, RouteExecutionStatus.Partial) ||
+                                hasEnumFlag(status, RouteExecutionStatus.Refunded) ? (_jsx(WarningRoundedIcon, { color: "warning" })) : null, hasEnumFlag(status, RouteExecutionStatus.Failed) ? (_jsx(ErrorRoundedIcon, { color: "error" })) : null] }) })) : null, _jsx(CenterContainer, { children: _jsx(Typography, { py: 1, fontSize: 18, fontWeight: 700, children: title }) }), showContractComponent ? (contractCompactComponent ||
+                    contractSecondaryComponent ||
+                    contractComponent) : (_jsx(CenterContainer, { children: hasEnumFlag(status, RouteExecutionStatus.Done) ? (_jsx(Token, { token: toToken, py: 1, disableDescription: true })) : null })), !showContractComponent ? (_jsx(Typography, { py: 1, children: primaryMessage })) : null, secondaryMessage ? (_jsx(Typography, { py: 1, children: secondaryMessage })) : null, _jsx(Box, { mt: 2, children: _jsxs(Button, { 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, { mt: 2, children: _jsx(Button, { variant: "text", onClick: handleSeeDetails, fullWidth: true, children: t('button.seeDetails') }) })) : null] }) }));
+};
+//# sourceMappingURL=StatusBottomSheet.js.map

package/src/_esm/pages/TransactionPage/StatusBottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBottomSheet.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/StatusBottomSheet.tsx"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAChD,OAAO,gBAAgB,MAAM,kCAAkC,CAAC;AAChE,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,eAAe,GAChB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAE3D,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,EACL,iBAAiB,EACjB,WAAW,EACX,gBAAgB,EAChB,cAAc,GACf,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAExE,MAAM,CAAC,MAAM,iBAAiB,GAA6B,CAAC,EAC1D,MAAM,EACN,KAAK,GACN,EAAE,EAAE;IACH,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAC/B,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,eAAe,EAAE,CAAC;IACrD,MAAM,GAAG,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAC1C,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAC9C,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,EACJ,UAAU,EACV,iBAAiB,EACjB,0BAA0B,EAC1B,wBAAwB,GACzB,GAAG,eAAe,EAAE,CAAC;IAEtB,MAAM,OAAO,GAAG;QACd,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC;QAC5D,MAAM,EAAE,MAAM,CACZ,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ;YACrC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,QAAQ;YACrC,KAAK,CAAC,QAAQ,CACjB;KACF,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,GAC7D,eAAe,CAAC,KAAK,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAE5C,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,kBAAkB,EAAE,CAAC;QACrB,QAAQ,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QACjC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;IACjC,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,eAAe,EAAE,CAAC;QAClB,YAAY,EAAE,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,eAAe,EAAE,CAAC;QAClB,IACE,OAAO,CAAC,OAAO,KAAK,KAAK,CAAC,OAAO,CAAC,OAAO;YACzC,OAAO,CAAC,OAAO,KAAK,KAAK,CAAC,OAAO,CAAC,OAAO,EACzC,CAAC;YACD,QAAQ,CACN,OAAO,CAAC,UAAU,EAClB,iBAAiB,CAAC,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,QAAQ,CAAC,EACnD,EAAE,WAAW,EAAE,IAAI,EAAE,CACtB,CAAC;YACF,QAAQ,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC;YACpE,QAAQ,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC;YACpE,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;gBAC/C,WAAW,EAAE,IAAI;aAClB,CAAC,CAAC;YACH,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;gBAC/C,WAAW,EAAE,IAAI;aAClB,CAAC,CAAC;QACL,CAAC;QACD,YAAY,EAAE,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,eAAe,EAAE,CAAC;QAClB,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,WAAW,EAAE,CAAC;QAEd,MAAM,eAAe,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;QAE/C,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE;YAC5C,KAAK,EAAE;gBACL,OAAO,EAAE,KAAK,CAAC,EAAE;gBACjB,eAAe;aAChB;YACD,OAAO,EAAE,IAAI;SACd,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,eAAe,GACnB,KAAK,CAAC,WAAW,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;IAE5D,IAAI,KAAyB,CAAC;IAC9B,IAAI,cAAc,CAAC;IACnB,IAAI,gBAAgB,CAAC;IACrB,IAAI,mBAAmB,GAAG,UAAU,CAAC;IACrC,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC;YAC/B,KAAK;gBACH,UAAU,KAAK,KAAK;oBAClB,CAAC,CAAC,CAAC,CAAC,kCAAkC,CAAC;oBACvC,CAAC,CAAC,CAAC,CAAC,iBAAiB,eAAe,YAAY,CAAC,CAAC;YACtD,IAAI,KAAK,EAAE,CAAC;gBACV,cAAc,GAAG,CAAC,CAAC,oCAAoC,EAAE;oBACvD,MAAM,EAAE,iBAAiB,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC;oBACvD,WAAW,EAAE,KAAK,CAAC,MAAM;oBACzB,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,IAAI;oBAC5C,aAAa,EAAE,cAAc,CAAC,KAAK,CAAC,SAAS,CAAC;iBAC/C,CAAC,CAAC;YACL,CAAC;YACD,mBAAmB,GAAG,UAAU,CAAC;YACjC,MAAM;QACR,CAAC;QACD,KAAK,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,OAAO,CAAC,CAAC,CAAC;YAC9D,KAAK,GAAG,CAAC,CAAC,iBAAiB,eAAe,qBAAqB,CAAC,CAAC;YACjE,cAAc,GAAG,CAAC,CAAC,6CAA6C,EAAE;gBAChE,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC,IAAI;gBAC1C,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,MAAM;aACvD,CAAC,CAAC;YACH,IAAI,KAAK,EAAE,CAAC;gBACV,gBAAgB,GAAG,CAAC,CAAC,oCAAoC,EAAE;oBACzD,MAAM,EAAE,iBAAiB,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC;oBACvD,WAAW,EAAE,KAAK,CAAC,MAAM;oBACzB,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,IAAI;oBAC5C,aAAa,EAAE,cAAc,CAAC,KAAK,CAAC,SAAS,CAAC;iBAC/C,CAAC,CAAC;YACL,CAAC;YACD,mBAAmB,GAAG,iBAAiB,CAAC;YACxC,MAAM;QACR,CAAC;QACD,KAAK,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC,CAAC;YAC/D,KAAK,GAAG,CAAC,CAAC,4BAA4B,CAAC,CAAC;YACxC,cAAc,GAAG,CAAC,CAAC,6CAA6C,EAAE;gBAChE,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC,IAAI;gBAC1C,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,MAAM;aACvD,CAAC,CAAC;YACH,IAAI,KAAK,EAAE,CAAC;gBACV,gBAAgB,GAAG,CAAC,CAAC,oCAAoC,EAAE;oBACzD,MAAM,EAAE,iBAAiB,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC;oBACvD,WAAW,EAAE,KAAK,CAAC,MAAM;oBACzB,SAAS,EAAE,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,IAAI;oBAC5C,aAAa,EAAE,cAAc,CAAC,KAAK,CAAC,SAAS,CAAC;iBAC/C,CAAC,CAAC;YACL,CAAC;YACD,MAAM;QACR,CAAC;QACD,KAAK,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC;YACjC,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAC3B,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,KAAK,QAAQ,CAC9C,CAAC;YACF,MAAM,OAAO,GAAG,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,IAAI,CAC3C,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,KAAK,QAAQ,CACzC,CAAC;YACF,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBACtB,MAAM;YACR,CAAC;YACD,MAAM,cAAc,GAAG,iBAAiB,CAAC,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;YACzE,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC;YAC7B,cAAc,GAAG,cAAc,CAAC,OAAO,CAAC;YACxC,mBAAmB,GAAG,WAAW,CAAC;YAClC,MAAM;QACR,CAAC;QACD;YACE,MAAM;IACV,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC;QACtE,IACE,CAAC,cAAc,IAAI,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC;YACpE,CAAC,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,EACtB,CAAC;YACD,IAAI,cAAc,EAAE,CAAC;gBACnB,iBAAiB,EAAE,CAAC;gBACpB,OAAO,EAAE,CAAC;YACZ,CAAC;YACD,GAAG,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAC;IAEzC,MAAM,qBAAqB,GACzB,UAAU,KAAK,KAAK,IAAI,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC;IAEzE,OAAO,CACL,KAAC,WAAW,IAAC,GAAG,EAAE,GAAG,YACnB,MAAC,GAAG,IAAC,CAAC,EAAE,CAAC,aACN,CAAC,qBAAqB,CAAC,CAAC,CAAC,CACxB,KAAC,eAAe,cACd,MAAC,UAAU,IAAC,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,aAC9B,MAAM,KAAK,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CACtC,KAAC,eAAe,IAAC,KAAK,EAAC,SAAS,GAAG,CACpC,CAAC,CAAC,CAAC,IAAI,EACP,MAAM,KAAK,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CACtC,KAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,GAAG,CAC7B,CAAC,CAAC,CAAC,IAAI,EACP,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,OAAO,CAAC;gCAClD,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACnD,KAAC,kBAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CACvC,CAAC,CAAC,CAAC,IAAI,EACP,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAClD,KAAC,gBAAgB,IAAC,KAAK,EAAC,OAAO,GAAG,CACnC,CAAC,CAAC,CAAC,IAAI,IACG,GACG,CACnB,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,eAAe,cACd,KAAC,UAAU,IAAC,EAAE,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,YAC7C,KAAK,GACK,GACG,EACjB,qBAAqB,CAAC,CAAC,CAAC,CACvB,wBAAwB;oBACxB,0BAA0B;oBAC1B,iBAAiB,CAClB,CAAC,CAAC,CAAC,CACF,KAAC,eAAe,cACb,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAChD,KAAC,KAAK,IAAC,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,EAAE,kBAAkB,SAAG,CACpD,CAAC,CAAC,CAAC,IAAI,GACQ,CACnB,EACA,CAAC,qBAAqB,CAAC,CAAC,CAAC,CACxB,KAAC,UAAU,IAAC,EAAE,EAAE,CAAC,YAAG,cAAc,GAAc,CACjD,CAAC,CAAC,CAAC,IAAI,EACP,gBAAgB,CAAC,CAAC,CAAC,CAClB,KAAC,UAAU,IAAC,EAAE,EAAE,CAAC,YAAG,gBAAgB,GAAc,CACnD,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACR,MAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,SAAS,QAAC,OAAO,EAAE,mBAAmB,aAC/D,MAAM,KAAK,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,EAC5D,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,IAAI,CAAC;gCAC7C,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;gCAClB,CAAC,CAAC,IAAI,EACP,MAAM,KAAK,oBAAoB,CAAC,MAAM;gCACrC,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC;gCACxB,CAAC,CAAC,IAAI,IACD,GACL,EACL,WAAW,CAAC,MAAM,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAChD,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACR,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,gBAAgB,EAAE,SAAS,kBACxD,CAAC,CAAC,mBAAmB,CAAC,GAChB,GACL,CACP,CAAC,CAAC,CAAC,IAAI,IACJ,GACM,CACf,CAAC;AACJ,CAAC,CAAC"}

package/src/_esm/pages/TransactionPage/StatusBottomSheet.style.js

@@ -0,0 +1,46 @@
+import { Box } from '@mui/material';
+import { alpha, darken, styled } from '@mui/material/styles';
+import { RouteExecutionStatus } from '../../stores';
+const getStatusColor = (status, theme) => {
+    switch (status) {
+        case RouteExecutionStatus.Done:
+            return { color: theme.palette.success.main, alpha: 0.12, darken: 0 };
+        case RouteExecutionStatus.Failed:
+            return { color: theme.palette.error.main, alpha: 0.12, darken: 0 };
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Partial:
+        case RouteExecutionStatus.Done | RouteExecutionStatus.Refunded:
+        case 'warning':
+            return {
+                color: theme.palette.warning.main,
+                alpha: 0.48,
+                darken: theme.palette.mode === 'light' ? 0.32 : 0,
+            };
+        default:
+            return { color: theme.palette.primary.main, alpha: 0.12, darken: 0 };
+    }
+};
+export const CenterContainer = styled(Box)(({ theme }) => ({
+    display: 'grid',
+    placeItems: 'center',
+    position: 'relative',
+}));
+export const IconCircle = styled(Box, {
+    shouldForwardProp: (prop) => prop !== 'status',
+})(({ theme, status }) => {
+    const { color, alpha: alphaValue, darken: darkenValue, } = getStatusColor(status, theme);
+    return {
+        backgroundColor: alpha(color, alphaValue),
+        borderRadius: '50%',
+        width: 64,
+        height: 64,
+        display: 'grid',
+        position: 'relative',
+        placeItems: 'center',
+        '& > svg': {
+            color: darken(color, darkenValue),
+            width: 32,
+            height: 32,
+        },
+    };
+});
+//# sourceMappingURL=StatusBottomSheet.style.js.map

package/src/_esm/pages/TransactionPage/StatusBottomSheet.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBottomSheet.style.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/StatusBottomSheet.style.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,cAAc,GAAG,CAAC,MAAmB,EAAE,KAAY,EAAE,EAAE;IAC3D,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,oBAAoB,CAAC,IAAI;YAC5B,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;QACvE,KAAK,oBAAoB,CAAC,MAAM;YAC9B,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;QACrE,KAAK,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,OAAO,CAAC;QAC9D,KAAK,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,QAAQ,CAAC;QAC/D,KAAK,SAAS;YACZ,OAAO;gBACL,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;gBACjC,KAAK,EAAE,IAAI;gBACX,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAClD,CAAC;QACJ;YACE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;IACzE,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACzD,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,EAAE;IACpC,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,QAAQ;CAC/C,CAAC,CAA0B,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE;IAChD,MAAM,EACJ,KAAK,EACL,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,WAAW,GACpB,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAClC,OAAO;QACL,eAAe,EAAE,KAAK,CAAC,KAAK,EAAE,UAAU,CAAC;QACzC,YAAY,EAAE,KAAK;QACnB,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE;YACT,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,WAAW,CAAC;YACjC,KAAK,EAAE,EAAE;YACT,MAAM,EAAE,EAAE;SACX;KACF,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/src/_esm/pages/TransactionPage/TokenValueBottomSheet.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import WarningRoundedIcon from '@mui/icons-material/WarningRounded';
+import { Box, Button, Typography } from '@mui/material';
+import { forwardRef, useRef } from 'react';
+import { useTranslation } from 'react-i18next';
+import { BottomSheet } from '../../components/BottomSheet';
+import { useSetContentHeight } from '../../hooks';
+import { CenterContainer, IconCircle } from './StatusBottomSheet.style';
+import { calcValueLoss } from './utils';
+export const TokenValueBottomSheet = forwardRef(({ route, onContinue, onCancel }, ref) => {
+    const handleCancel = () => {
+        ref.current?.close();
+        onCancel?.();
+    };
+    return (_jsx(BottomSheet, { ref: ref, onClose: onCancel, children: _jsx(TokenValueBottomSheetContent, { route: route, onContinue: onContinue, onCancel: handleCancel }) }));
+});
+const TokenValueBottomSheetContent = ({ route, onCancel, onContinue, }) => {
+    const { t } = useTranslation();
+    const ref = useRef();
+    useSetContentHeight(ref);
+    return (_jsxs(Box, { p: 3, ref: ref, children: [_jsxs(CenterContainer, { children: [_jsx(IconCircle, { status: "warning", mb: 1, children: _jsx(WarningRoundedIcon, { color: "warning" }) }), _jsx(Typography, { py: 1, fontSize: 18, fontWeight: 700, children: t('warning.title.highValueLoss') })] }), _jsx(Typography, { py: 1, children: t('warning.message.highValueLoss') }), _jsxs(Box, { display: "flex", justifyContent: "space-between", mt: 1, children: [_jsx(Typography, { children: t('main.sending') }), _jsx(Typography, { fontWeight: 600, children: t('format.currency', { value: route.fromAmountUSD }) })] }), _jsxs(Box, { display: "flex", justifyContent: "space-between", mt: 0.25, children: [_jsx(Typography, { children: t('main.gasCost') }), _jsx(Typography, { fontWeight: 600, children: t('format.currency', { value: route.gasCostUSD }) })] }), _jsxs(Box, { display: "flex", justifyContent: "space-between", mt: 0.25, children: [_jsx(Typography, { children: t('main.receiving') }), _jsx(Typography, { fontWeight: 600, children: t('format.currency', { value: route.toAmountUSD }) })] }), _jsxs(Box, { display: "flex", justifyContent: "space-between", mt: 0.25, children: [_jsx(Typography, { children: t('main.valueLoss') }), _jsx(Typography, { fontWeight: 600, children: calcValueLoss(route) })] }), _jsxs(Box, { display: "flex", mt: 3, children: [_jsx(Button, { variant: "text", onClick: onCancel, fullWidth: true, children: t('button.cancel') }), _jsx(Box, { display: "flex", p: 1 }), _jsx(Button, { variant: "contained", onClick: onContinue, fullWidth: true, children: t('button.continue') })] })] }));
+};
+export const getTokenValueLossThreshold = (route) => {
+    if (!route) {
+        return false;
+    }
+    const fromAmountUSD = Number(route.fromAmountUSD || 0);
+    const toAmountUSD = Number(route.toAmountUSD || 0);
+    const gasCostUSD = Number(route.gasCostUSD || 0);
+    if (!fromAmountUSD && !toAmountUSD) {
+        return false;
+    }
+    return toAmountUSD / (fromAmountUSD + gasCostUSD) < 0.9;
+};
+//# sourceMappingURL=TokenValueBottomSheet.js.map

package/src/_esm/pages/TransactionPage/TokenValueBottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenValueBottomSheet.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/TokenValueBottomSheet.tsx"],"names":[],"mappings":"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"}

package/src/_esm/pages/TransactionPage/TransactionPage.js

@@ -0,0 +1,133 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import DeleteIcon from '@mui/icons-material/Delete';
+import { Box, Button, Tooltip } from '@mui/material';
+import { useEffect, useRef, useState } from 'react';
+import { useFormContext } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+import { useLocation } from 'react-router-dom';
+import { ContractComponent } from '../../components/ContractComponent';
+import { GasMessage } from '../../components/GasMessage';
+import { Insurance } from '../../components/Insurance';
+import { getStepList } from '../../components/Step';
+import { useNavigateBack, useRouteExecution, useWidgetEvents, } from '../../hooks';
+import { FormKey, useWidgetConfig } from '../../providers';
+import { RouteExecutionStatus, useHeaderStoreContext } from '../../stores';
+import { WidgetEvent } from '../../types/events';
+import { formatTokenAmount } from '../../utils';
+import { ExchangeRateBottomSheet } from './ExchangeRateBottomSheet';
+import { StartInsurableTransactionButton, StartTransactionButton, } from './StartTransactionButton';
+import { StatusBottomSheet } from './StatusBottomSheet';
+import { TokenValueBottomSheet, getTokenValueLossThreshold, } from './TokenValueBottomSheet';
+import { Container } from './TransactionPage.style';
+import { calcValueLoss } from './utils';
+export const TransactionPage = () => {
+    const { t } = useTranslation();
+    const { setValue } = useFormContext();
+    const emitter = useWidgetEvents();
+    const { navigateBack } = useNavigateBack();
+    const { subvariant, insurance, contractComponent, contractSecondaryComponent, } = useWidgetConfig();
+    const { state } = useLocation();
+    const headerStoreContext = useHeaderStoreContext();
+    const stateRouteId = state?.routeId;
+    const [routeId, setRouteId] = useState(stateRouteId);
+    const tokenValueBottomSheetRef = useRef(null);
+    const exchangeRateBottomSheetRef = useRef(null);
+    const onAcceptExchangeRateUpdate = (resolver, data) => {
+        exchangeRateBottomSheetRef.current?.open(resolver, data);
+    };
+    const { route, status, executeRoute, restartRoute, deleteRoute } = useRouteExecution({
+        routeId: routeId,
+        onAcceptExchangeRateUpdate,
+    });
+    useEffect(() => {
+        if (route && subvariant !== 'nft') {
+            const transactionType = route.fromChainId === route.toChainId ? 'Swap' : 'Bridge';
+            return headerStoreContext
+                .getState()
+                .setTitle(status === RouteExecutionStatus.Idle
+                ? t(`button.review${transactionType}`)
+                : t(`header.${transactionType.toLowerCase()}`));
+        }
+    }, [headerStoreContext, route, status, subvariant, t]);
+    useEffect(() => {
+        if (status === RouteExecutionStatus.Idle) {
+            emitter.emit(WidgetEvent.ReviewTransactionPageEntered, route);
+        }
+        // We want to emit event only when the page is mounted
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    if (!route) {
+        return null;
+    }
+    const tokenValueLossThresholdExceeded = getTokenValueLossThreshold(route);
+    const handleExecuteRoute = () => {
+        if (tokenValueBottomSheetRef.current?.isOpen()) {
+            emitter.emit(WidgetEvent.RouteHighValueLoss, {
+                fromAmountUsd: route.fromAmountUSD,
+                gasCostUSD: route.gasCostUSD,
+                toAmountUSD: route.toAmountUSD,
+                valueLoss: calcValueLoss(route),
+            });
+        }
+        tokenValueBottomSheetRef.current?.close();
+        executeRoute();
+        setValue(FormKey.FromAmount, '');
+        if (subvariant === 'nft') {
+            setValue(FormKey.FromToken, '');
+            setValue(FormKey.ToToken, '');
+        }
+    };
+    const handleStartClick = async () => {
+        if (status === RouteExecutionStatus.Idle) {
+            if (tokenValueLossThresholdExceeded && subvariant !== 'nft') {
+                tokenValueBottomSheetRef.current?.open();
+            }
+            else {
+                handleExecuteRoute();
+            }
+        }
+        if (status === RouteExecutionStatus.Failed) {
+            restartRoute();
+        }
+    };
+    const handleRemoveRoute = () => {
+        navigateBack();
+        deleteRoute();
+    };
+    const getButtonText = () => {
+        switch (status) {
+            case RouteExecutionStatus.Idle:
+                switch (subvariant) {
+                    case 'nft':
+                        return t('button.buyNow');
+                    case 'refuel':
+                        return t('button.startBridging');
+                    default:
+                        const transactionType = route.fromChainId === route.toChainId ? 'Swapping' : 'Bridging';
+                        return t(`button.start${transactionType}`);
+                }
+            case RouteExecutionStatus.Failed:
+                return t('button.tryAgain');
+            default:
+                return '';
+        }
+    };
+    const insuredRoute = route.insurance?.state === 'INSURED';
+    const insurableRoute = insurance &&
+        subvariant !== 'refuel' &&
+        status === RouteExecutionStatus.Idle &&
+        route.insurance?.state === 'INSURABLE';
+    const insuranceAvailable = insuredRoute || insurableRoute;
+    const StartButton = insurableRoute
+        ? StartInsurableTransactionButton
+        : StartTransactionButton;
+    const getInsuranceCoverageId = () => route.steps[0].execution?.process
+        .filter((process) => process.type !== 'TOKEN_ALLOWANCE')
+        .find((process) => process.txHash)?.txHash ?? route.fromAddress;
+    return (_jsxs(Container, { children: [getStepList(route, subvariant), subvariant === 'nft' ? (_jsx(ContractComponent, { mt: 2, children: contractSecondaryComponent || contractComponent })) : null, insuranceAvailable ? (_jsx(Insurance, { mt: 2, status: status, insurableRouteId: stateRouteId, feeAmountUsd: route.insurance.feeAmountUsd, insuredAmount: formatTokenAmount(BigInt(route.toAmountMin), route.toToken.decimals), insuredTokenSymbol: route.toToken.symbol, insuranceCoverageId: getInsuranceCoverageId(), onChange: setRouteId })) : null, status === RouteExecutionStatus.Idle ||
+                status === RouteExecutionStatus.Failed ? (_jsxs(_Fragment, { children: [_jsx(GasMessage, { mt: 2, route: route }), _jsxs(Box, { mt: 2, display: "flex", children: [_jsx(StartButton, { text: getButtonText(), onClick: handleStartClick, route: route, insurableRouteId: stateRouteId }), status === RouteExecutionStatus.Failed ? (_jsx(Tooltip, { title: t('button.removeTransaction'), placement: "bottom-end", enterDelay: 400, arrow: true, children: _jsx(Button, { onClick: handleRemoveRoute, sx: {
+                                        minWidth: 48,
+                                        marginLeft: 1,
+                                    }, children: _jsx(DeleteIcon, {}) }) })) : null] })] })) : null, status ? _jsx(StatusBottomSheet, { status: status, route: route }) : null, tokenValueLossThresholdExceeded && subvariant !== 'nft' ? (_jsx(TokenValueBottomSheet, { route: route, ref: tokenValueBottomSheetRef, onContinue: handleExecuteRoute })) : null, _jsx(ExchangeRateBottomSheet, { ref: exchangeRateBottomSheetRef })] }));
+};
+//# sourceMappingURL=TransactionPage.js.map

package/src/_esm/pages/TransactionPage/TransactionPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionPage.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/TransactionPage.tsx"],"names":[],"mappings":"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"}

package/src/_esm/pages/TransactionPage/TransactionPage.style.js

@@ -0,0 +1,6 @@
+import { Container as MuiContainer } from '@mui/material';
+import { styled } from '@mui/material/styles';
+export const Container = styled(MuiContainer)(({ theme }) => ({
+    padding: theme.spacing(1, 3),
+}));
+//# sourceMappingURL=TransactionPage.style.js.map

package/src/_esm/pages/TransactionPage/TransactionPage.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionPage.style.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/TransactionPage.style.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,eAAe,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAC5D,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;CAC7B,CAAC,CAAC,CAAC"}

package/src/_esm/pages/TransactionPage/index.js

@@ -0,0 +1,2 @@
+export * from './TransactionPage';
+//# sourceMappingURL=index.js.map

package/src/_esm/pages/TransactionPage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/src/_esm/pages/TransactionPage/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/_esm/pages/TransactionPage/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/types.ts"],"names":[],"mappings":""}

package/src/_esm/pages/TransactionPage/utils.js

@@ -0,0 +1,7 @@
+export const calcValueLoss = (route) => {
+    return `${((Number(route.toAmountUSD || 0) /
+        (Number(route.fromAmountUSD || 0) + Number(route.gasCostUSD || 0)) -
+        1) *
+        100).toFixed(2)}%`;
+};
+//# sourceMappingURL=utils.js.map

package/src/_esm/pages/TransactionPage/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/pages/TransactionPage/utils.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAY,EAAE,EAAE;IAC5C,OAAO,GAAG,CACR,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,IAAI,CAAC,CAAC;QAC7B,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,UAAU,IAAI,CAAC,CAAC,CAAC;QAClE,CAAC,CAAC;QACJ,GAAG,CACJ,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC;AAClB,CAAC,CAAC"}

package/src/_esm/providers/FormProvider/FormProvider.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { FormProvider as ReactHookFormProvider, useForm, } from 'react-hook-form';
+import { useWidgetConfig } from '../WidgetProvider';
+import { FormUpdater } from './FormUpdater';
+import { FormKey } from './types';
+export const formDefaultValues = {
+    [FormKey.FromAmount]: '',
+    [FormKey.ToAddress]: '',
+    [FormKey.TokenSearchFilter]: '',
+    [FormKey.ContractOutputsToken]: '',
+    [FormKey.ToContractAddress]: '',
+    [FormKey.ToContractCallData]: '',
+    [FormKey.ToContractGasLimit]: '',
+    [FormKey.ToAmount]: '',
+};
+export const FormProvider = ({ children, }) => {
+    const { fromChain, fromToken, fromAmount, toChain, toToken, toAddress } = useWidgetConfig();
+    const defaultValues = useMemo(() => ({
+        ...formDefaultValues,
+        fromChain,
+        fromToken,
+        fromAmount: (typeof fromAmount === 'number'
+            ? fromAmount?.toPrecision()
+            : fromAmount) || formDefaultValues.fromAmount,
+        toChain,
+        toToken,
+        toAddress: toAddress || formDefaultValues.toAddress,
+    }), [fromAmount, fromChain, fromToken, toAddress, toChain, toToken]);
+    const methods = useForm({
+        // values,
+        defaultValues,
+    });
+    return (_jsxs(ReactHookFormProvider, { ...methods, children: [_jsx(FormUpdater, { defaultValues: defaultValues }), children] }));
+};
+//# sourceMappingURL=FormProvider.js.map

package/src/_esm/providers/FormProvider/FormProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormProvider.js","sourceRoot":"","sources":["../../../../../src/providers/FormProvider/FormProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EACL,YAAY,IAAI,qBAAqB,EACrC,OAAO,GACR,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE;IACxB,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE;IACvB,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAE,EAAE;IAC/B,CAAC,OAAO,CAAC,oBAAoB,CAAC,EAAE,EAAE;IAClC,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAE,EAAE;IAC/B,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,EAAE;IAChC,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE,EAAE;IAChC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,EAAE;CACvB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAA0C,CAAC,EAClE,QAAQ,GACT,EAAE,EAAE;IACH,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,GACrE,eAAe,EAAE,CAAC;IAEpB,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,CAAC;QACL,GAAG,iBAAiB;QACpB,SAAS;QACT,SAAS;QACT,UAAU,EACR,CAAC,OAAO,UAAU,KAAK,QAAQ;YAC7B,CAAC,CAAC,UAAU,EAAE,WAAW,EAAE;YAC3B,CAAC,CAAC,UAAU,CAAC,IAAI,iBAAiB,CAAC,UAAU;QACjD,OAAO;QACP,OAAO;QACP,SAAS,EAAE,SAAS,IAAI,iBAAiB,CAAC,SAAS;KACpD,CAAC,EACF,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,CAAC,CAChE,CAAC;IAEF,MAAM,OAAO,GAAG,OAAO,CAAa;QAClC,UAAU;QACV,aAAa;KACd,CAAC,CAAC;IAEH,OAAO,CACL,MAAC,qBAAqB,OAAK,OAAO,aAChC,KAAC,WAAW,IAAC,aAAa,EAAE,aAAa,GAAI,EAC5C,QAAQ,IACa,CACzB,CAAC;AACJ,CAAC,CAAC"}

package/src/_esm/providers/FormProvider/FormUpdater.js

@@ -0,0 +1,68 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { useEffect, useRef } from 'react';
+import { useFormContext } from 'react-hook-form';
+import { FormKey } from '.';
+import { useAccount } from '../../hooks';
+import { isItemAllowed, useWidgetConfig } from '../WidgetProvider';
+export const FormUpdater = ({ defaultValues }) => {
+    const { fromChain, toChain, chains } = useWidgetConfig();
+    const { account } = useAccount();
+    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);
+        if (!account.isConnected || !account.chainId || !chainAllowed) {
+            return;
+        }
+        const { isTouched: isFromChainTouched } = getFieldState(FormKey.FromChain);
+        const { isTouched: isToChainTouched } = getFieldState(FormKey.ToChain);
+        const { isTouched: isFromTokenTouched } = getFieldState(FormKey.FromToken);
+        const { isTouched: isToTokenTouched } = getFieldState(FormKey.ToToken);
+        const { isTouched: isFromAmountTouched } = getFieldState(FormKey.FromAmount);
+        if (!fromChain && !isFromChainTouched && !isFromTokenTouched) {
+            resetField(FormKey.FromChain, { defaultValue: account.chainId });
+            setValue(FormKey.FromChain, account.chainId);
+            setValue(FormKey.FromToken, '');
+            if (isFromAmountTouched) {
+                setValue(FormKey.FromAmount, '');
+            }
+        }
+        if (!toChain && !isToChainTouched && !isToTokenTouched) {
+            resetField(FormKey.ToChain, { defaultValue: account.chainId });
+            setValue(FormKey.ToChain, account.chainId);
+            setValue(FormKey.ToToken, '');
+        }
+    }, [
+        account.chainId,
+        account.isConnected,
+        chains,
+        fromChain,
+        getFieldState,
+        getValues,
+        resetField,
+        setValue,
+        toChain,
+    ]);
+    // Makes widget config options reactive to changes
+    // Acts similar to values property from useForm, but includes additional logic for chains
+    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 === FormKey.FromChain || key === FormKey.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;
+};
+//# sourceMappingURL=FormUpdater.js.map

package/src/_esm/providers/FormProvider/FormUpdater.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormUpdater.js","sourceRoot":"","sources":["../../../../../src/providers/FormProvider/FormUpdater.tsx"],"names":[],"mappings":"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"}

package/src/_esm/providers/FormProvider/URLSearchParamsBuilder.js

@@ -0,0 +1,34 @@
+import { useEffect } from 'react';
+import { useFormState, useWatch } from 'react-hook-form';
+import { useLocation } from 'react-router-dom';
+import { FormKey } from './types';
+const formValueKeys = [
+    FormKey.FromAmount,
+    FormKey.FromChain,
+    FormKey.FromToken,
+    FormKey.ToAddress,
+    FormKey.ToChain,
+    FormKey.ToToken,
+];
+export const URLSearchParamsBuilder = () => {
+    const { pathname } = useLocation();
+    const { 
+    // Have to use touchedFields, because default values are not considered dirty
+    touchedFields: { ...touchedFields }, } = useFormState();
+    const values = useWatch({ name: formValueKeys });
+    useEffect(() => {
+        const url = new URL(window.location);
+        formValueKeys.forEach((key, index) => {
+            if (touchedFields[key] && values[index]) {
+                url.searchParams.set(key, values[index]);
+            }
+            else if (url.searchParams.has(key) && !values[index]) {
+                url.searchParams.delete(key);
+            }
+        });
+        url.searchParams.sort();
+        window.history.replaceState(window.history.state, '', url);
+    }, [pathname, touchedFields, values]);
+    return null;
+};
+//# sourceMappingURL=URLSearchParamsBuilder.js.map

package/src/_esm/providers/FormProvider/URLSearchParamsBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"URLSearchParamsBuilder.js","sourceRoot":"","sources":["../../../../../src/providers/FormProvider/URLSearchParamsBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC,MAAM,aAAa,GAAG;IACpB,OAAO,CAAC,UAAU;IAClB,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,SAAS;IACjB,OAAO,CAAC,OAAO;IACf,OAAO,CAAC,OAAO;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,GAAG,WAAW,EAAE,CAAC;IACnC,MAAM;IACJ,6EAA6E;IAC7E,aAAa,EAAE,EAAE,GAAG,aAAa,EAAE,GACpC,GAAG,YAAY,EAAE,CAAC;IACnB,MAAM,MAAM,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,CAAC,CAAC;IAEjD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,QAAe,CAAC,CAAC;QAC5C,aAAa,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;YACnC,IAAI,aAAa,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;gBACxC,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;YAC3C,CAAC;iBAAM,IAAI,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC;gBACvD,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;YAC/B,CAAC;QACH,CAAC,CAAC,CAAC;QACH,GAAG,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;QACxB,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;IAC7D,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAEtC,OAAO,IAAI,CAAC;AACd,CAAC,CAAC"}