@lifi/widget 1.15.0 → 1.16.1

package/types/events.d.ts

@@ -0,0 +1,5 @@
+export declare enum WidgetEvent {
+    SwapStarted = "swapStarted",
+    SwapCompleted = "swapCompleted",
+    SwapFailed = "swapFailed"
+}

package/types/events.js

@@ -0,0 +1,6 @@
+export var WidgetEvent;
+(function (WidgetEvent) {
+    WidgetEvent["SwapStarted"] = "swapStarted";
+    WidgetEvent["SwapCompleted"] = "swapCompleted";
+    WidgetEvent["SwapFailed"] = "swapFailed";
+})(WidgetEvent || (WidgetEvent = {}));

package/types/index.d.ts

@@ -1,2 +1,3 @@
+export * from './events';
 export * from './token';
 export * from './widget';

package/types/index.js

@@ -1,2 +1,3 @@
+export * from './events';
 export * from './token';
 export * from './widget';

package/types/widget.d.ts

@@ -1,4 +1,4 @@
-import type { ChainKey, Token } from '@lifi/sdk';
+import type { ChainKey, ConfigUpdate, Token } from '@lifi/sdk';
 import type { PaletteMode, PaletteOptions, Shape } from '@mui/material';
 import type { TypographyOptions } from '@mui/material/styles/createTypography';
 import type { Signer } from 'ethers';
@@ -29,6 +29,7 @@ interface WidgetConfigBase {
     integrator?: string;
     disabledChains?: number[];
     featuredTokens?: Token[];
+    sdkConfig?: ConfigUpdate;
 }
 declare type WidgetFromTokenConfig = {
     fromChain: `${ChainKey}` | number;

package/utils/colors.d.ts

@@ -1,3 +1,3 @@
 import type { Theme } from '@mui/material';
 export declare const getContrastAlphaColor: (theme: Theme, alpha: string | number) => string;
-export declare const getContrastTextColor: (theme: Theme, background?: string) => "#fff" | "#000";
+export declare const getContrastTextColor: (theme: Theme, background?: string) => "#000" | "#fff";

package/utils/navigationRoutes.d.ts

@@ -4,10 +4,15 @@ export declare const navigationRoutes: {
     settings: string;
     fromToken: string;
     toToken: string;
+    fromChain: string;
+    toChain: string;
     swapRoutes: string;
     swapExecution: string;
     swapHistory: string;
+    activeSwaps: string;
     swapDetails: string;
 };
 export declare const navigationRoutesValues: string[];
+export declare const stickyHeaderRoutes: string[];
+export declare const backButtonRoutes: string[];
 export declare type NavigationRouteType = keyof typeof navigationRoutes;

package/utils/navigationRoutes.js

@@ -1,12 +1,39 @@
 export const navigationRoutes = {
     home: '/',
-    selectWallet: 'select-wallet',
+    selectWallet: 'wallet',
     settings: 'settings',
-    fromToken: 'select-from-token',
-    toToken: 'select-to-token',
+    fromToken: 'from-token',
+    toToken: 'to-token',
+    fromChain: 'from-chain',
+    toChain: 'to-chain',
     swapRoutes: 'swap-routes',
     swapExecution: 'swap-execution',
     swapHistory: 'swap-history',
+    activeSwaps: 'active-swaps',
     swapDetails: 'swap-details',
 };
 export const navigationRoutesValues = Object.values(navigationRoutes);
+export const stickyHeaderRoutes = [
+    navigationRoutes.selectWallet,
+    navigationRoutes.fromChain,
+    navigationRoutes.toChain,
+    navigationRoutes.settings,
+    navigationRoutes.swapRoutes,
+    navigationRoutes.swapExecution,
+    navigationRoutes.swapHistory,
+    navigationRoutes.activeSwaps,
+    navigationRoutes.swapDetails,
+];
+export const backButtonRoutes = [
+    navigationRoutes.selectWallet,
+    navigationRoutes.settings,
+    navigationRoutes.swapHistory,
+    navigationRoutes.activeSwaps,
+    navigationRoutes.fromToken,
+    navigationRoutes.toToken,
+    navigationRoutes.fromChain,
+    navigationRoutes.toChain,
+    navigationRoutes.swapRoutes,
+    navigationRoutes.swapExecution,
+    navigationRoutes.swapDetails,
+];

package/cjs/components/SwapButton/SwapButton.style.d.ts

@@ -1,65 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<{
-    classes?: (Partial<import("@mui/material").ButtonClasses> & {
-        root?: string | undefined;
-        loading?: string | undefined;
-        loadingIndicator?: string | undefined;
-        loadingIndicatorCenter?: string | undefined;
-        loadingIndicatorStart?: string | undefined;
-        loadingIndicatorEnd?: string | undefined;
-        endIconLoadingEnd?: string | undefined;
-        startIconLoadingStart?: string | undefined;
-    }) | undefined;
-    loading?: boolean | undefined;
-    loadingIndicator?: import("react").ReactNode;
-    loadingPosition?: "center" | "end" | "start" | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-} & Omit<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: "inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success" | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    variant?: "text" | "outlined" | "contained" | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes">, "classes"> & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant" | "loading" | "loadingIndicator" | "loadingPosition"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/cjs/components/SwapButton/SwapButton.style.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const lab_1 = require("@mui/lab");
-const LoadingButton_1 = require("@mui/lab/LoadingButton");
-const styles_1 = require("@mui/material/styles");
-const utils_1 = require("../../utils");
-exports.Button = (0, styles_1.styled)(lab_1.LoadingButton)(({ theme }) => ({
-    [`&.${LoadingButton_1.loadingButtonClasses.loading}`]: {
-        color: 'transparent',
-    },
-    [`.${LoadingButton_1.loadingButtonClasses.loadingIndicator}`]: {
-        color: (0, utils_1.getContrastAlphaColor)(theme, '70%'),
-    },
-}));

package/cjs/components/SwapsInProgress/SwapsInProgress.js

@@ -1,29 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SwapsInProgress = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_material_1 = require("@mui/icons-material");
-const material_1 = require("@mui/material");
-const react_1 = require("react");
-const react_i18next_1 = require("react-i18next");
-const react_router_dom_1 = require("react-router-dom");
-const providers_1 = require("../../providers");
-const stores_1 = require("../../stores");
-const utils_1 = require("../../utils");
-const Card_1 = require("../Card");
-const TokenAvatar_1 = require("../TokenAvatar");
-const SwapsInProgress_style_1 = require("./SwapsInProgress.style");
-const SwapsInProgress = (props) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const navigate = (0, react_router_dom_1.useNavigate)();
-    const { account } = (0, providers_1.useWallet)();
-    const executingRoutes = (0, stores_1.useExecutingRoutes)(account.address);
-    const handleCardClick = (0, react_1.useCallback)((routeId) => {
-        navigate(utils_1.navigationRoutes.swapExecution, { state: { routeId } });
-    }, [navigate]);
-    if (!(executingRoutes === null || executingRoutes === void 0 ? void 0 : executingRoutes.length)) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsxs)(SwapsInProgress_style_1.ProgressCard, Object.assign({}, props, { children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { children: t('swap.activeTransfers') }), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ spacing: 2, py: 2 }, { children: executingRoutes.map(({ route, status }) => ((0, jsx_runtime_1.jsx)(SwapsInProgress_style_1.RouteCard, { onClick: () => handleCardClick(route.id), avatar: (0, jsx_runtime_1.jsxs)(TokenAvatar_1.TokenAvatarGroup, Object.assign({ total: 2 }, { children: [(0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: route.fromToken }), (0, jsx_runtime_1.jsx)(TokenAvatar_1.TokenAvatar, { token: route.toToken })] })), action: (0, jsx_runtime_1.jsx)(icons_material_1.KeyboardArrowRight, {}), title: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: { display: 'flex', alignItems: 'center' } }, { children: [route.fromToken.symbol, (0, jsx_runtime_1.jsx)(icons_material_1.ArrowForward, { fontSize: "small", sx: { paddingX: 0.5 } }), route.toToken.symbol] })) }, route.id))) }))] })));
-};
-exports.SwapsInProgress = SwapsInProgress;

package/cjs/components/SwapsInProgress/SwapsInProgress.style.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RouteCard = exports.ProgressCard = void 0;
-const styles_1 = require("@mui/material/styles");
-const Card_1 = require("../Card");
-exports.ProgressCard = (0, styles_1.styled)(Card_1.Card)(({ theme }) => ({
-    borderColor: (0, styles_1.alpha)(theme.palette.secondary.main, 0.48),
-    background: (0, styles_1.alpha)(theme.palette.secondary.main, 0.2),
-    '&:hover': {
-        background: (0, styles_1.alpha)(theme.palette.secondary.main, 0.2),
-    },
-}));
-exports.RouteCard = (0, styles_1.styled)(Card_1.CardHeader)(({ theme }) => ({
-    cursor: 'pointer',
-    paddingTop: 0,
-    paddingBottom: 0,
-}));

package/cjs/components/SwapsInProgress/index.d.ts

@@ -1 +0,0 @@
-export * from './SwapsInProgress';

package/cjs/config/lifi.d.ts

@@ -1,4 +0,0 @@
-import type { ConfigUpdate } from '@lifi/sdk';
-import LIFI from '@lifi/sdk';
-export declare const LiFi: LIFI;
-export declare const updateLiFiConfig: (configUpdate: ConfigUpdate) => void;

package/cjs/config/lifi.js

@@ -1,14 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateLiFiConfig = exports.LiFi = void 0;
-const sdk_1 = __importDefault(require("@lifi/sdk"));
-exports.LiFi = new sdk_1.default({
-    disableVersionCheck: true,
-});
-const updateLiFiConfig = (configUpdate) => {
-    exports.LiFi.setConfig(configUpdate);
-};
-exports.updateLiFiConfig = updateLiFiConfig;

package/cjs/pages/SelectTokenPage/ChainSelect.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChainSelect = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_material_1 = require("@mui/icons-material");
-const material_1 = require("@mui/material");
-const react_hook_form_1 = require("react-hook-form");
-const react_i18next_1 = require("react-i18next");
-const Card_1 = require("../../components/Card");
-const Select_1 = require("../../components/Select");
-const hooks_1 = require("../../hooks");
-const providers_1 = require("../../providers");
-const ChainSelect = ({ formType }) => {
-    const { t } = (0, react_i18next_1.useTranslation)();
-    const { setValue, register } = (0, react_hook_form_1.useFormContext)();
-    const { fromChain, toChain } = (0, providers_1.useWidgetConfig)();
-    const { chains, isLoading } = (0, hooks_1.useChains)();
-    const chainKey = providers_1.SwapFormKeyHelper.getChainKey(formType);
-    const [chainId] = (0, react_hook_form_1.useWatch)({
-        name: [chainKey],
-    });
-    const { onChange, onBlur, name, ref } = register(chainKey, {
-        onChange: () => {
-            setValue(providers_1.SwapFormKeyHelper.getTokenKey(formType), '');
-            setValue(providers_1.SwapFormKeyHelper.getAmountKey(formType), '');
-            setValue(providers_1.SwapFormKey.TokenSearchFilter, '');
-        },
-    });
-    return !isLoading ? ((0, jsx_runtime_1.jsxs)(Card_1.Card, { children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { children: t(`swap.selectChain`) }), (0, jsx_runtime_1.jsx)(material_1.FormControl, Object.assign({ fullWidth: true }, { children: (0, jsx_runtime_1.jsx)(Select_1.Select, Object.assign({ ref: ref, labelId: chainKey, name: name, MenuProps: { elevation: 2 }, defaultValue: formType === 'from' ? fromChain : toChain, value: chainId, onChange: onChange, onBlur: onBlur, IconComponent: icons_material_1.KeyboardArrowDown }, { children: chains === null || chains === void 0 ? void 0 : chains.map((chain) => ((0, jsx_runtime_1.jsxs)(material_1.MenuItem, Object.assign({ value: chain.id }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ src: chain.logoURI, alt: chain.key }, { children: chain.name[0] })) }), chain.name] }), chain.key))) })) }))] })) : ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "rectangular", width: "100%", height: 98, sx: { borderRadius: 1 } }));
-};
-exports.ChainSelect = ChainSelect;

package/cjs/pages/SwapPage/utils.d.ts

@@ -1,6 +0,0 @@
-import type { EVMChain, Process, Step } from '@lifi/sdk';
-import type { TFunction } from 'react-i18next';
-export declare function getProcessMessage(t: TFunction<'translation', undefined>, getChainById: (chainId: number) => EVMChain | undefined, step: Step, process: Process): {
-    title?: string;
-    message?: string;
-};

package/cjs/pages/SwapPage/utils.js

@@ -1,93 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getProcessMessage = void 0;
-const sdk_1 = require("@lifi/sdk");
-const utils_1 = require("../../utils");
-const formatProcessMessage = (initialMessage, args = {}) => {
-    return Object.keys(args).reduce((message, key) => {
-        return message.replace(`{${key}}`, args[key]);
-    }, initialMessage);
-};
-const processMessages = {
-    TOKEN_ALLOWANCE: {
-        STARTED: (t) => t(`swap.process.tokenAllowance.started`),
-        PENDING: (t) => t(`swap.process.tokenAllowance.pending`),
-        DONE: (t) => t(`swap.process.tokenAllowance.done`),
-    },
-    SWITCH_CHAIN: {
-        PENDING: (t) => t(`swap.process.switchChain.pending`),
-        DONE: (t) => t(`swap.process.switchChain.done`),
-    },
-    SWAP: {
-        STARTED: (t) => t(`swap.process.swap.started`),
-        ACTION_REQUIRED: (t) => t(`swap.process.swap.actionRequired`),
-        PENDING: (t) => t(`swap.process.swap.pending`),
-        DONE: (t) => t(`swap.process.swap.done`),
-    },
-    CROSS_CHAIN: {
-        STARTED: (t) => t(`swap.process.crossChain.started`),
-        ACTION_REQUIRED: (t) => t(`swap.process.crossChain.actionRequired`),
-        PENDING: (t) => t(`swap.process.crossChain.pending`),
-        DONE: (t) => t(`swap.process.crossChain.done`),
-    },
-    RECEIVING_CHAIN: {
-        PENDING: (t) => t(`swap.process.receivingChain.pending`),
-        DONE: (t) => t(`swap.process.receivingChain.done`),
-    },
-    TRANSACTION: {},
-};
-function getProcessMessage(t, getChainById, step, process) {
-    var _a, _b, _c, _d;
-    if (process.error && process.status === 'FAILED') {
-        const getTransactionNotSentMessage = () => {
-            var _a, _b;
-            return t(`swap.error.message.transactionNotSent`, {
-                amount: (0, utils_1.formatTokenAmount)(step.action.fromAmount, step.action.fromToken.decimals),
-                tokenSymbol: step.action.fromToken.symbol,
-                chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
-            });
-        };
-        let title = '';
-        let message = '';
-        switch (process.error.code) {
-            case sdk_1.LifiErrorCode.ChainSwitchError:
-                title = t(`swap.error.title.chainSwitch`);
-                message = getTransactionNotSentMessage();
-                break;
-            case sdk_1.LifiErrorCode.TransactionFailed:
-                title = t(`swap.error.title.transactionFailed`);
-                message = t(`swap.error.message.transactionFailed`);
-                break;
-            case sdk_1.LifiErrorCode.TransactionUnderpriced:
-                title = t(`swap.error.title.transactionUnderpriced`);
-                message = getTransactionNotSentMessage();
-                break;
-            case sdk_1.LifiErrorCode.TransactionUnprepared:
-                title = t(`swap.error.title.transactionUnprepared`);
-                message = getTransactionNotSentMessage();
-                break;
-            case sdk_1.LifiErrorCode.SlippageError:
-                title = t(`swap.error.title.slippageTooLarge`);
-                message = t(`swap.error.message.slippageTooLarge`);
-                break;
-            case sdk_1.MetaMaskProviderErrorCode.userRejectedRequest:
-                title = t(`swap.error.title.userRejectedSignatureRequest`);
-                message = t(`swap.error.message.signatureRequired`, {
-                    amount: (0, utils_1.formatTokenAmount)(step.action.fromAmount, step.action.fromToken.decimals),
-                    tokenSymbol: step.action.fromToken.symbol,
-                    chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
-                });
-                break;
-            default:
-                title = t(`swap.error.title.unknown`);
-                if (process.txLink) {
-                    message = t(`swap.error.message.transactionFailed`);
-                }
-                break;
-        }
-        return { title, message };
-    }
-    const title = (_d = (_c = processMessages[process.type])[process.status]) === null || _d === void 0 ? void 0 : _d.call(_c, t);
-    return { title };
-}
-exports.getProcessMessage = getProcessMessage;

package/cjs/stores/route/useExecutingRoutes.d.ts

@@ -1,2 +0,0 @@
-import type { RouteExecution } from './types';
-export declare const useExecutingRoutes: (address?: string) => RouteExecution[];

package/cjs/stores/route/useExecutingRoutes.js

@@ -1,13 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useExecutingRoutes = void 0;
-const shallow_1 = __importDefault(require("zustand/shallow"));
-const useRouteStore_1 = require("./useRouteStore");
-const useExecutingRoutes = (address) => {
-    return (0, useRouteStore_1.useRouteStore)((state) => Object.values(state.routes).filter((item) => (item === null || item === void 0 ? void 0 : item.route.fromAddress) === address &&
-        ((item === null || item === void 0 ? void 0 : item.status) === 'loading' || (item === null || item === void 0 ? void 0 : item.status) === 'error')), shallow_1.default);
-};
-exports.useExecutingRoutes = useExecutingRoutes;

package/components/Step/utils.js

@@ -1,89 +0,0 @@
-import { LifiErrorCode, MetaMaskProviderErrorCode } from '@lifi/sdk';
-import { formatTokenAmount } from '../../utils';
-const formatProcessMessage = (initialMessage, args = {}) => {
-    return Object.keys(args).reduce((message, key) => {
-        return message.replace(`{${key}}`, args[key]);
-    }, initialMessage);
-};
-const processMessages = {
-    TOKEN_ALLOWANCE: {
-        STARTED: (t) => t(`swap.process.tokenAllowance.started`),
-        PENDING: (t) => t(`swap.process.tokenAllowance.pending`),
-        DONE: (t) => t(`swap.process.tokenAllowance.done`),
-    },
-    SWITCH_CHAIN: {
-        PENDING: (t) => t(`swap.process.switchChain.pending`),
-        DONE: (t) => t(`swap.process.switchChain.done`),
-    },
-    SWAP: {
-        STARTED: (t) => t(`swap.process.swap.started`),
-        ACTION_REQUIRED: (t) => t(`swap.process.swap.actionRequired`),
-        PENDING: (t) => t(`swap.process.swap.pending`),
-        DONE: (t) => t(`swap.process.swap.done`),
-    },
-    CROSS_CHAIN: {
-        STARTED: (t) => t(`swap.process.crossChain.started`),
-        ACTION_REQUIRED: (t) => t(`swap.process.crossChain.actionRequired`),
-        PENDING: (t) => t(`swap.process.crossChain.pending`),
-        DONE: (t) => t(`swap.process.crossChain.done`),
-    },
-    RECEIVING_CHAIN: {
-        PENDING: (t) => t(`swap.process.receivingChain.pending`),
-        DONE: (t) => t(`swap.process.receivingChain.done`),
-    },
-    TRANSACTION: {},
-};
-export function getProcessMessage(t, getChainById, step, process) {
-    var _a, _b, _c, _d;
-    if (process.error && process.status === 'FAILED') {
-        const getTransactionNotSentMessage = () => {
-            var _a, _b;
-            return t(`swap.error.message.transactionNotSent`, {
-                amount: formatTokenAmount(step.action.fromAmount, step.action.fromToken.decimals),
-                tokenSymbol: step.action.fromToken.symbol,
-                chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
-            });
-        };
-        let title = '';
-        let message = '';
-        switch (process.error.code) {
-            case LifiErrorCode.ChainSwitchError:
-                title = t(`swap.error.title.chainSwitch`);
-                message = getTransactionNotSentMessage();
-                break;
-            case LifiErrorCode.TransactionFailed:
-                title = t(`swap.error.title.transactionFailed`);
-                message = t(`swap.error.message.transactionFailed`);
-                break;
-            case LifiErrorCode.TransactionUnderpriced:
-                title = t(`swap.error.title.transactionUnderpriced`);
-                message = getTransactionNotSentMessage();
-                break;
-            case LifiErrorCode.TransactionUnprepared:
-                title = t(`swap.error.title.transactionUnprepared`);
-                message = getTransactionNotSentMessage();
-                break;
-            case LifiErrorCode.SlippageError:
-                title = t(`swap.error.title.slippageTooLarge`);
-                message = t(`swap.error.message.slippageTooLarge`);
-                break;
-            case MetaMaskProviderErrorCode.userRejectedRequest:
-                title = t(`swap.error.title.userRejectedSignatureRequest`);
-                message = t(`swap.error.message.signatureRequired`, {
-                    amount: formatTokenAmount(step.action.fromAmount, step.action.fromToken.decimals),
-                    tokenSymbol: step.action.fromToken.symbol,
-                    chainName: (_b = (_a = getChainById(step.action.fromChainId)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '',
-                });
-                break;
-            default:
-                title = t(`swap.error.title.unknown`);
-                if (process.txLink) {
-                    message = t(`swap.error.message.transactionFailed`);
-                }
-                break;
-        }
-        return { title, message };
-    }
-    const title = (_d = (_c = processMessages[process.type])[process.status]) === null || _d === void 0 ? void 0 : _d.call(_c, t);
-    return { title };
-}

package/components/SwapButton/SwapButton.style.d.ts

@@ -1,65 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<{
-    classes?: (Partial<import("@mui/material").ButtonClasses> & {
-        root?: string | undefined;
-        loading?: string | undefined;
-        loadingIndicator?: string | undefined;
-        loadingIndicatorCenter?: string | undefined;
-        loadingIndicatorStart?: string | undefined;
-        loadingIndicatorEnd?: string | undefined;
-        endIconLoadingEnd?: string | undefined;
-        startIconLoadingStart?: string | undefined;
-    }) | undefined;
-    loading?: boolean | undefined;
-    loadingIndicator?: import("react").ReactNode;
-    loadingPosition?: "center" | "end" | "start" | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-} & Omit<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: "inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success" | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    variant?: "text" | "outlined" | "contained" | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes">, "classes"> & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant" | "loading" | "loadingIndicator" | "loadingPosition"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/components/SwapButton/SwapButton.style.js

@@ -1,12 +0,0 @@
-import { LoadingButton } from '@mui/lab';
-import { loadingButtonClasses } from '@mui/lab/LoadingButton';
-import { styled } from '@mui/material/styles';
-import { getContrastAlphaColor } from '../../utils';
-export const Button = styled(LoadingButton)(({ theme }) => ({
-    [`&.${loadingButtonClasses.loading}`]: {
-        color: 'transparent',
-    },
-    [`.${loadingButtonClasses.loadingIndicator}`]: {
-        color: getContrastAlphaColor(theme, '70%'),
-    },
-}));

package/components/SwapsInProgress/SwapsInProgress.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ArrowForward as ArrowForwardIcon, KeyboardArrowRight as KeyboardArrowRightIcon, } from '@mui/icons-material';
-import { Box, Stack } from '@mui/material';
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { useWallet } from '../../providers';
-import { useExecutingRoutes } from '../../stores';
-import { navigationRoutes } from '../../utils';
-import { CardTitle } from '../Card';
-import { TokenAvatar, TokenAvatarGroup } from '../TokenAvatar';
-import { ProgressCard, RouteCard } from './SwapsInProgress.style';
-export const SwapsInProgress = (props) => {
-    const { t } = useTranslation();
-    const navigate = useNavigate();
-    const { account } = useWallet();
-    const executingRoutes = useExecutingRoutes(account.address);
-    const handleCardClick = useCallback((routeId) => {
-        navigate(navigationRoutes.swapExecution, { state: { routeId } });
-    }, [navigate]);
-    if (!(executingRoutes === null || executingRoutes === void 0 ? void 0 : executingRoutes.length)) {
-        return null;
-    }
-    return (_jsxs(ProgressCard, Object.assign({}, props, { children: [_jsx(CardTitle, { children: t('swap.activeTransfers') }), _jsx(Stack, Object.assign({ spacing: 2, py: 2 }, { children: executingRoutes.map(({ route, status }) => (_jsx(RouteCard, { onClick: () => handleCardClick(route.id), avatar: _jsxs(TokenAvatarGroup, Object.assign({ total: 2 }, { children: [_jsx(TokenAvatar, { token: route.fromToken }), _jsx(TokenAvatar, { token: route.toToken })] })), action: _jsx(KeyboardArrowRightIcon, {}), title: _jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center' } }, { children: [route.fromToken.symbol, _jsx(ArrowForwardIcon, { fontSize: "small", sx: { paddingX: 0.5 } }), route.toToken.symbol] })) }, route.id))) }))] })));
-};

package/components/SwapsInProgress/SwapsInProgress.style.js

@@ -1,14 +0,0 @@
-import { alpha, styled } from '@mui/material/styles';
-import { Card, CardHeader } from '../Card';
-export const ProgressCard = styled(Card)(({ theme }) => ({
-    borderColor: alpha(theme.palette.secondary.main, 0.48),
-    background: alpha(theme.palette.secondary.main, 0.2),
-    '&:hover': {
-        background: alpha(theme.palette.secondary.main, 0.2),
-    },
-}));
-export const RouteCard = styled(CardHeader)(({ theme }) => ({
-    cursor: 'pointer',
-    paddingTop: 0,
-    paddingBottom: 0,
-}));

package/components/SwapsInProgress/index.d.ts

@@ -1 +0,0 @@
-export * from './SwapsInProgress';

package/components/SwapsInProgress/index.js

@@ -1 +0,0 @@
-export * from './SwapsInProgress';