@lifi/widget 1.15.1 → 1.16.0

package/pages/SelectChainPage/SelectChainPage.js

@@ -0,0 +1,29 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar, Container, List, ListItemAvatar } from '@mui/material';
+import { useLocation } from 'react-router-dom';
+import { useChainSelect } from '../../components/ChainSelect';
+import { useNavigateBack } from '../../hooks';
+import { ListItemButton, ListItemText } from './SelectChainPage.style';
+export const SelectChainPage = ({ formType, }) => {
+    const { navigateBack } = useNavigateBack();
+    const { state } = useLocation();
+    const formTypeState = (state === null || state === void 0 ? void 0 : state.formType) || formType;
+    const { chains, setCurrentChain } = useChainSelect(formTypeState);
+    const handleClick = (chainId) => __awaiter(void 0, void 0, void 0, function* () {
+        setCurrentChain(chainId);
+        navigateBack();
+    });
+    return (_jsx(Container, Object.assign({ disableGutters: true }, { children: _jsx(List, Object.assign({ sx: {
+                paddingLeft: 1.5,
+                paddingRight: 1.5,
+            } }, { children: chains === null || chains === void 0 ? void 0 : chains.map((chain) => (_jsxs(ListItemButton, Object.assign({ onClick: () => handleClick(chain.id), disableRipple: true }, { children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, Object.assign({ src: chain.logoURI, alt: chain.name }, { children: chain.name[0] })) }), _jsx(ListItemText, { primary: chain.name })] }), chain.id))) })) })));
+};

package/pages/SelectChainPage/SelectChainPage.style.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+export declare const ListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonBaseProps & 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").SxProps<import("@mui/material").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").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+}, "className" | "style" | "classes" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "autoFocus" | "dense" | "divider" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const ListItemText: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemTextProps<import("react").ElementType<any>, import("react").ElementType<any>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/pages/SelectChainPage/SelectChainPage.style.js

@@ -0,0 +1,17 @@
+import { ListItemButton as MuiListItemButton, ListItemText as MuiListItemText, } from '@mui/material';
+import { listItemTextClasses } from '@mui/material/ListItemText';
+import { styled } from '@mui/material/styles';
+import { getContrastAlphaColor } from '../../utils';
+export const ListItemButton = styled(MuiListItemButton)(({ theme }) => ({
+    borderRadius: theme.shape.borderRadiusSecondary,
+    paddingLeft: theme.spacing(1.5),
+    height: 56,
+    '&:hover': {
+        backgroundColor: getContrastAlphaColor(theme, '4%'),
+    },
+}));
+export const ListItemText = styled(MuiListItemText)(({ theme }) => ({
+    [`.${listItemTextClasses.primary}`]: {
+        fontWeight: 400,
+    },
+}));

package/pages/SelectChainPage/index.d.ts

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

package/pages/SelectChainPage/index.js

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

package/pages/SelectTokenPage/SelectTokenPage.d.ts

@@ -1,5 +1,3 @@
 import type { FC } from 'react';
-import type { SwapFormDirection } from '../../providers';
-export declare const SelectTokenPage: FC<{
-    formType: SwapFormDirection;
-}>;
+import type { SwapFormTypeProps } from '../../providers';
+export declare const SelectTokenPage: FC<SwapFormTypeProps>;

package/pages/SelectTokenPage/SelectTokenPage.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Container } from '@mui/material';
 import { useLayoutEffect, useRef, useState } from 'react';
+import { ChainSelect } from '../../components/ChainSelect';
 import { TokenList } from '../../components/TokenList';
 import { useContentHeight, useNavigateBack, useScrollableOverflowHidden, } from '../../hooks';
-import { ChainSelect } from './ChainSelect';
 import { SearchTokenInput } from './SearchTokenInput';
-export const SelectTokenPage = ({ formType, }) => {
+export const SelectTokenPage = ({ formType }) => {
     useScrollableOverflowHidden();
     const { navigateBack } = useNavigateBack();
     const headerRef = useRef(null);

package/pages/SelectWalletPage/SelectWalletPage.js

@@ -15,7 +15,7 @@ import { useTranslation } from 'react-i18next';
 import { Dialog } from '../../components/Dialog';
 import { useNavigateBack } from '../../hooks';
 import { useWallet } from '../../providers';
-import { WalletListItemButton, WalletListItemText, } from './SelectWalletPage.style';
+import { ListItemButton, ListItemText } from './SelectWalletPage.style';
 export const SelectWalletPage = () => {
     var _a;
     const { t } = useTranslation();
@@ -25,7 +25,7 @@ export const SelectWalletPage = () => {
     const closeDialog = () => {
         setWalletIdentity((state) => (Object.assign(Object.assign({}, state), { show: false })));
     };
-    const handleConnect = useCallback((event, wallet) => __awaiter(void 0, void 0, void 0, function* () {
+    const handleConnect = useCallback((wallet) => __awaiter(void 0, void 0, void 0, function* () {
         const { ethereum } = window;
         const identityCheckPassed = wallet.checkProviderIdentity({
             provider: ethereum,
@@ -41,9 +41,9 @@ export const SelectWalletPage = () => {
         yield connect(wallet);
     }), [connect, navigateBack]);
     return (_jsxs(Container, Object.assign({ disableGutters: true }, { children: [_jsx(List, Object.assign({ sx: {
-                    paddingLeft: 2,
-                    paddingRight: 2,
-                } }, { children: supportedWallets.map((wallet) => (_jsxs(WalletListItemButton, Object.assign({ onClick: (event) => handleConnect(event, wallet), disableRipple: true }, { children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, Object.assign({ src: wallet.icon.src || wallet.icon, alt: wallet.name }, { children: wallet.name[0] })) }), _jsx(WalletListItemText, { primary: wallet.name })] }), wallet.name))) })), _jsxs(Dialog, Object.assign({ open: walletIdentity.show, onClose: closeDialog }, { children: [_jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('wallet.extensionNotFound', {
+                    paddingLeft: 1.5,
+                    paddingRight: 1.5,
+                } }, { children: supportedWallets.map((wallet) => (_jsxs(ListItemButton, Object.assign({ onClick: () => handleConnect(wallet), disableRipple: true }, { children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, Object.assign({ src: wallet.icon.src || wallet.icon, alt: wallet.name }, { children: wallet.name[0] })) }), _jsx(ListItemText, { primary: wallet.name })] }), wallet.name))) })), _jsxs(Dialog, Object.assign({ open: walletIdentity.show, onClose: closeDialog }, { children: [_jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('wallet.extensionNotFound', {
                                 name: (_a = walletIdentity.wallet) === null || _a === void 0 ? void 0 : _a.name,
                             }) }) }), _jsx(DialogActions, { children: _jsx(Button, Object.assign({ onClick: closeDialog, autoFocus: true }, { children: t('button.ok') })) })] }))] })));
 };

package/pages/SelectWalletPage/SelectWalletPage.style.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const WalletListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonBaseProps & Omit<{
+export declare const ListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonBaseProps & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
     centerRipple?: boolean | undefined;
     children?: import("react").ReactNode;
@@ -18,29 +18,4 @@ export declare const WalletListItemButton: import("@emotion/styled").StyledCompo
 }, "classes"> & 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;
 }, "className" | "style" | "classes" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "autoFocus" | "dense" | "divider" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const WalletListItem: import("@emotion/styled").StyledComponent<{
-    button?: false | undefined;
-} & import("@mui/material").ListItemBaseProps & {
-    components?: {
-        Root?: import("react").ElementType<any> | undefined;
-    } | undefined;
-    componentsProps?: {
-        root?: (import("react").HTMLAttributes<HTMLDivElement> & import("@mui/material").ListItemComponentsPropsOverrides) | undefined;
-    } | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "key" | keyof import("react").LiHTMLAttributes<HTMLLIElement>> & {
-    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
-}, "button" | "className" | "style" | "classes" | "children" | "disabled" | "sx" | "alignItems" | "autoFocus" | "dense" | "divider" | "components" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const WalletListItemText: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemTextProps<import("react").ElementType<any>, import("react").ElementType<any>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const WalletIdentityPopoverContent: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
-    align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "subtitle1" | "subtitle2" | "body1" | "body2" | "overline" | "@supports (font-variation-settings: normal)" | undefined;
-    variantMapping?: Partial<Record<"button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "subtitle1" | "subtitle2" | "body1" | "body2" | "overline" | "@supports (font-variation-settings: normal)", string>> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>> & {
-    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | ("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") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const ListItemText: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemTextProps<import("react").ElementType<any>, import("react").ElementType<any>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/pages/SelectWalletPage/SelectWalletPage.style.js

@@ -1,27 +1,17 @@
-import { ListItem, ListItemButton, ListItemText, Typography, } from '@mui/material';
-import { listItemSecondaryActionClasses } from '@mui/material/ListItemSecondaryAction';
+import { ListItemButton as MuiListItemButton, ListItemText as MuiListItemText, } from '@mui/material';
 import { listItemTextClasses } from '@mui/material/ListItemText';
 import { styled } from '@mui/material/styles';
 import { getContrastAlphaColor } from '../../utils';
-export const WalletListItemButton = styled(ListItemButton)(({ theme }) => ({
+export const ListItemButton = styled(MuiListItemButton)(({ theme }) => ({
     borderRadius: theme.shape.borderRadiusSecondary,
     paddingLeft: theme.spacing(1.5),
-    height: 64,
+    height: 56,
     '&:hover': {
         backgroundColor: getContrastAlphaColor(theme, '4%'),
     },
 }));
-export const WalletListItem = styled(ListItem)(({ theme }) => ({
-    padding: theme.spacing(1.5),
-    [`.${listItemSecondaryActionClasses.root}`]: {
-        right: theme.spacing(3),
-    },
-}));
-export const WalletListItemText = styled(ListItemText)(({ theme }) => ({
+export const ListItemText = styled(MuiListItemText)(({ theme }) => ({
     [`.${listItemTextClasses.primary}`]: {
         fontWeight: 400,
     },
 }));
-export const WalletIdentityPopoverContent = styled(Typography)({
-    maxWidth: 400,
-});

package/pages/SettingsPage/ColorSchemeButtonGroup.style.d.ts

@@ -11,7 +11,7 @@ export declare const ToggleButton: import("@emotion/styled").StyledComponent<{
     selected?: boolean | undefined;
     size?: "small" | "medium" | "large" | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    value: unknown;
+    value: {};
 } & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
     centerRipple?: boolean | undefined;

package/pages/SettingsPage/EnabledBridgesSelect.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { KeyboardArrowDown as KeyboardArrowDownIcon } from '@mui/icons-material';
-import { Box, Chip, FormControl, MenuItem, Skeleton } from '@mui/material';
+import { Box, Checkbox, Chip, FormControl, MenuItem, Skeleton, } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import shallow from 'zustand/shallow';
 import { Card, CardTitle } from '../../components/Card';
@@ -8,16 +8,13 @@ import { Select } from '../../components/Select';
 import { useTools } from '../../hooks';
 import { useSettingsStore } from '../../stores';
 export const EnabledBridgesSelect = () => {
-    var _a;
     const { t } = useTranslation();
     const { tools, formattedTools } = useTools();
     const [enabledBridges, setTools] = useSettingsStore((state) => [state.enabledBridges, state.setTools], shallow);
-    return (tools === null || tools === void 0 ? void 0 : tools.bridges.length) ? (_jsxs(Card, { children: [_jsx(CardTitle, { children: t(`settings.enabledBridges`) }), _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(Select, Object.assign({ multiple: true, placeholder: t(`settings.selectEnabledBridges`), MenuProps: { elevation: 2 }, IconComponent: KeyboardArrowDownIcon, value: enabledBridges !== null && enabledBridges !== void 0 ? enabledBridges : [], onChange: (event) => {
-                        if (tools === null || tools === void 0 ? void 0 : tools.bridges) {
-                            setTools('Bridges', event.target.value, tools.bridges);
-                        }
+    return (tools === null || tools === void 0 ? void 0 : tools.bridges.length) ? (_jsxs(Card, { children: [_jsx(CardTitle, { children: t(`settings.enabledBridges`) }), _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(Select, Object.assign({ multiple: true, placeholder: t(`settings.selectEnabledBridges`), MenuProps: { elevation: 2, PaperProps: { sx: { maxHeight: 320 } } }, IconComponent: KeyboardArrowDownIcon, value: enabledBridges !== null && enabledBridges !== void 0 ? enabledBridges : [], onChange: (event) => {
+                        setTools('Bridges', event.target.value, tools.bridges);
                     }, renderValue: (selected) => (_jsx(Box, Object.assign({ sx: { display: 'flex', flexWrap: 'wrap', gap: 0.5 } }, { children: selected.map((value) => {
                             var _a, _b, _c;
                             return (_jsx(Chip, { label: (_c = (_b = (_a = formattedTools.bridges) === null || _a === void 0 ? void 0 : _a[value]) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : value }, value));
-                        }) }))) }, { children: (_a = tools === null || tools === void 0 ? void 0 : tools.bridges) === null || _a === void 0 ? void 0 : _a.map((bridge) => (_jsx(MenuItem, Object.assign({ value: bridge.key }, { children: bridge.name }), bridge.key))) })) }))] })) : (_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 134, sx: { borderRadius: 1 } }));
+                        }) }))) }, { children: tools.bridges.map((bridge) => (_jsxs(MenuItem, Object.assign({ value: bridge.key, sx: { paddingTop: 0, paddingBottom: 0 } }, { children: [_jsx(Checkbox, { checked: enabledBridges === null || enabledBridges === void 0 ? void 0 : enabledBridges.includes(bridge.key) }), bridge.name] }), bridge.key))) })) }))] })) : (_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 134, sx: { borderRadius: 1 } }));
 };

package/pages/SettingsPage/EnabledExchangesSelect.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { KeyboardArrowDown as KeyboardArrowDownIcon } from '@mui/icons-material';
-import { Box, Chip, FormControl, MenuItem, Skeleton } from '@mui/material';
+import { Box, Checkbox, Chip, FormControl, MenuItem, Skeleton, } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import shallow from 'zustand/shallow';
 import { Card, CardTitle } from '../../components/Card';
@@ -12,11 +12,9 @@ export const EnabledExchangesSelect = () => {
     const { tools, formattedTools } = useTools();
     const [enabledExchanges, setTools] = useSettingsStore((state) => [state.enabledExchanges, state.setTools], shallow);
     return (tools === null || tools === void 0 ? void 0 : tools.exchanges.length) ? (_jsxs(Card, { children: [_jsx(CardTitle, { children: t(`settings.enabledExchanges`) }), _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(Select, Object.assign({ multiple: true, placeholder: t(`settings.selectEnabledExchanges`), value: enabledExchanges !== null && enabledExchanges !== void 0 ? enabledExchanges : [], onChange: (event) => {
-                        if (tools === null || tools === void 0 ? void 0 : tools.exchanges) {
-                            setTools('Exchanges', event.target.value, tools.exchanges);
-                        }
-                    }, MenuProps: { elevation: 2 }, IconComponent: KeyboardArrowDownIcon, renderValue: (selected) => (_jsx(Box, Object.assign({ sx: { display: 'flex', flexWrap: 'wrap', gap: 0.5 } }, { children: selected.map((value) => {
+                        setTools('Exchanges', event.target.value, tools.exchanges);
+                    }, MenuProps: { elevation: 2, PaperProps: { sx: { maxHeight: 320 } } }, IconComponent: KeyboardArrowDownIcon, renderValue: (selected) => (_jsx(Box, Object.assign({ sx: { display: 'flex', flexWrap: 'wrap', gap: 0.5 } }, { children: selected.map((value) => {
                             var _a, _b, _c;
                             return (_jsx(Chip, { label: (_c = (_b = (_a = formattedTools.exchanges) === null || _a === void 0 ? void 0 : _a[value]) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : value }, value));
-                        }) }))) }, { children: tools === null || tools === void 0 ? void 0 : tools.exchanges.map((exchange) => (_jsx(MenuItem, Object.assign({ value: exchange.key }, { children: exchange.key }), exchange.key))) })) }))] })) : (_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 206, sx: { borderRadius: 1 } }));
+                        }) }))) }, { children: tools.exchanges.map((exchange) => (_jsxs(MenuItem, Object.assign({ value: exchange.key, sx: { paddingTop: 0, paddingBottom: 0 } }, { children: [_jsx(Checkbox, { checked: enabledExchanges === null || enabledExchanges === void 0 ? void 0 : enabledExchanges.includes(exchange.key) }), exchange.name] }), exchange.key))) })) }))] })) : (_jsx(Skeleton, { variant: "rectangular", width: "100%", height: 206, sx: { borderRadius: 1 } }));
 };

package/pages/SettingsPage/RoutePrioritySelect.js

@@ -10,5 +10,9 @@ export const RoutePrioritySelect = () => {
     const { t } = useTranslation();
     const [setValue] = useSetSettings();
     const { routePriority } = useSettings(['routePriority']);
-    return (_jsxs(Card, { children: [_jsx(CardTitle, { children: t(`settings.routePriority`) }), _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(Select, Object.assign({ MenuProps: { elevation: 2 }, value: routePriority, onChange: (event) => setValue('routePriority', event.target.value), IconComponent: KeyboardArrowDownIcon, dense: true }, { children: Orders.map((order) => (_jsx(MenuItem, Object.assign({ value: order }, { children: t(`swap.tags.${order.toLowerCase()}`) }), order))) })) }))] }));
+    return (_jsxs(Card, { children: [_jsx(CardTitle, { children: t(`settings.routePriority`) }), _jsx(FormControl, Object.assign({ fullWidth: true }, { children: _jsx(Select, Object.assign({ MenuProps: { elevation: 2 }, value: routePriority, onChange: (event) => setValue('routePriority', event.target.value), IconComponent: KeyboardArrowDownIcon, dense: true }, { children: Orders.map((order) => {
+                        const tag = t(`swap.tags.${order.toUpperCase()}`);
+                        const tagName = `${tag[0]}${tag.slice(1).toLowerCase()}`;
+                        return (_jsx(MenuItem, Object.assign({ value: order }, { children: tagName }), order));
+                    }) })) }))] }));
 };

package/pages/SwapDetailsPage/SwapDetailsPage.js

@@ -59,5 +59,5 @@ export const SwapDetailsPage = () => {
             }), _jsxs(Card, Object.assign({ mt: 2 }, { children: [_jsxs(Box, Object.assign({ sx: {
                             display: 'flex',
                             flex: 1,
-                        } }, { children: [_jsx(CardTitle, Object.assign({ flex: 1 }, { children: t('swap.routeId') })), _jsx(Box, Object.assign({ mr: 1, mt: 1 }, { children: _jsx(IconButton, Object.assign({ size: "medium", "aria-label": "settings", onClick: copyRouteId }, { children: _jsx(ContentCopyIcon, { fontSize: "small" }) })) }))] })), _jsx(Typography, Object.assign({ variant: "body2", pt: 1, pb: 2, px: 2, sx: { wordBreak: 'break-all' } }, { children: routeExecution === null || routeExecution === void 0 ? void 0 : routeExecution.route.id }))] })), _jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "contained", href: "https://discord.com/channels/849912621360218112/863689862514343946", target: "_blank", rel: "nofollow noreferrer", fullWidth: true }, { children: t('button.contactSupport') })) })), _jsxs(Dialog, Object.assign({ open: open, onClose: toggleDialog }, { children: [_jsx(DialogTitle, { children: t('swap.warning.title.deleteSwap') }), _jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('swap.warning.message.deleteSwap') }) }), _jsxs(DialogActions, { children: [_jsx(Button, Object.assign({ onClick: toggleDialog }, { children: t('button.cancel') })), _jsx(Button, Object.assign({ onClick: handleDeleteRoute, autoFocus: true }, { children: t('button.delete') }))] })] }))] }));
+                        } }, { children: [_jsx(CardTitle, Object.assign({ flex: 1 }, { children: t('swap.supportId') })), _jsx(Box, Object.assign({ mr: 1, mt: 1 }, { children: _jsx(IconButton, Object.assign({ size: "medium", "aria-label": "settings", onClick: copyRouteId }, { children: _jsx(ContentCopyIcon, { fontSize: "small" }) })) }))] })), _jsx(Typography, Object.assign({ variant: "body2", pt: 1, pb: 2, px: 2, sx: { wordBreak: 'break-all' } }, { children: routeExecution === null || routeExecution === void 0 ? void 0 : routeExecution.route.id }))] })), _jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "contained", href: "https://discord.com/channels/849912621360218112/863689862514343946", target: "_blank", rel: "nofollow noreferrer", fullWidth: true }, { children: t('button.contactSupport') })) })), _jsxs(Dialog, Object.assign({ open: open, onClose: toggleDialog }, { children: [_jsx(DialogTitle, { children: t('swap.warning.title.deleteSwap') }), _jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('swap.warning.message.deleteSwap') }) }), _jsxs(DialogActions, { children: [_jsx(Button, Object.assign({ onClick: toggleDialog }, { children: t('button.cancel') })), _jsx(Button, Object.assign({ onClick: handleDeleteRoute, autoFocus: true }, { children: t('button.delete') }))] })] }))] }));
 };

package/pages/SwapPage/StatusBottomSheet.js

@@ -1,17 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Done as DoneIcon, Info as InfoIcon, Warning as WarningIcon, } from '@mui/icons-material';
 import { Box, Button, Typography } from '@mui/material';
-import { useEffect, useMemo, useRef } from 'react';
+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 { useChains, useNavigateBack, useTokenBalance } from '../../hooks';
+import { getProcessMessage, useChains, useNavigateBack, useTokenBalance, } from '../../hooks';
 import { SwapFormKey } from '../../providers';
 import { IconCircle, IconContainer, iconStyles, } from './StatusBottomSheet.style';
-import { getProcessMessage } from './utils';
 export const StatusBottomSheet = ({ status, route, }) => {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g;
     const { t } = useTranslation();
     const { navigateBack } = useNavigateBack();
     const ref = useRef(null);
@@ -31,41 +30,31 @@ export const StatusBottomSheet = ({ status, route, }) => {
         clearFromAmount();
         (_a = ref.current) === null || _a === void 0 ? void 0 : _a.closeDrawer();
     };
-    const { title, message } = useMemo(() => {
-        var _a, _b;
-        switch (status) {
-            case 'success':
-                return {
-                    title: t('swap.success.title.fundsReceived'),
-                    message: t('swap.success.message.fundsReceived', {
-                        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,
-                    }),
-                };
-            case 'error': {
-                const step = route.steps.find((step) => {
-                    var _a;
-                    return (_a = step.execution) === null || _a === void 0 ? void 0 : _a.process.some((process) => process.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');
-                if (!step || !process) {
-                    return {};
-                }
-                return getProcessMessage(t, getChainById, step, process);
+    let title;
+    let message;
+    switch (status) {
+        case 'success':
+            title = t('swap.success.title.fundsReceived');
+            message = t('swap.success.message.fundsReceived', {
+                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,
+            });
+            break;
+        case 'error': {
+            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');
+            if (!step || !process) {
+                break;
             }
-            default:
-                return {};
+            const processMessage = getProcessMessage(t, getChainById, step, process);
+            title = processMessage.title;
+            message = processMessage.message;
+            break;
         }
-    }, [
-        getChainById,
-        route.steps,
-        route.toChainId,
-        status,
-        t,
-        token === null || token === void 0 ? void 0 : token.amount,
-        token === null || token === void 0 ? void 0 : token.symbol,
-    ]);
+        default:
+            break;
+    }
     useEffect(() => {
         var _a, _b;
         if ((status === 'success' || status === 'error') &&
@@ -74,5 +63,5 @@ export const StatusBottomSheet = ({ status, route, }) => {
             (_b = ref.current) === null || _b === void 0 ? void 0 : _b.openDrawer();
         }
     }, [refetchBalance, 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", sx: iconStyles })) : null, status === 'success' ? (_jsx(DoneIcon, { color: "success", sx: iconStyles })) : null, status === 'error' ? (_jsx(WarningIcon, { color: "error", sx: iconStyles })) : 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: (_e = (_c = (_b = (_a = route.steps.at(-1)) === null || _a === void 0 ? void 0 : _a.execution) === null || _b === void 0 ? void 0 : _b.toAmount) !== null && _c !== void 0 ? _c : (_d = route.steps.at(-1)) === null || _d === void 0 ? void 0 : _d.estimate.toAmount) !== null && _e !== void 0 ? _e : route.toAmount }), py: 1 })) : null] }), _jsx(Typography, Object.assign({ pt: 2, pb: 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.okay') : null, status === 'success' ? t('button.done') : null, status === 'error' ? t('button.tryAgain') : null] })) })), status === 'success' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "outlined", fullWidth: true, onClick: handleClose }, { 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 === 'idle' ? (_jsx(InfoIcon, { color: "primary", sx: iconStyles })) : null, status === 'success' ? (_jsx(DoneIcon, { color: "success", sx: iconStyles })) : null, status === 'error' ? (_jsx(WarningIcon, { color: "error", sx: iconStyles })) : 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 })) : null] }), _jsx(Typography, Object.assign({ pt: 2, pb: 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.okay') : null, status === 'success' ? t('button.done') : null, status === 'error' ? t('button.tryAgain') : null] })) })), status === 'success' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "outlined", fullWidth: true, onClick: handleClose }, { children: t('button.seeDetails') })) }))) : null] })) })));
 };

package/pages/SwapPage/SwapPage.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Button } from '@mui/material';
 import { Fragment } from 'react';
+import { useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router-dom';
 import { GasSufficiencyMessage } from '../../components/GasSufficiencyMessage';
@@ -8,12 +9,14 @@ import { Step } from '../../components/Step';
 import { StepDivider } from '../../components/StepDivider';
 import { SwapButton } from '../../components/SwapButton';
 import { useNavigateBack, useRouteExecution } from '../../hooks';
+import { SwapFormKey } from '../../providers';
 import { StatusBottomSheet } from './StatusBottomSheet';
 import { Container } from './SwapPage.style';
 export const SwapPage = () => {
     const { t } = useTranslation();
     const { state } = useLocation();
     const { navigateBack } = useNavigateBack();
+    const { setValue, formState: { isValid, isValidating }, } = useFormContext();
     const { route, status, executeRoute, restartRoute, deleteRoute } = useRouteExecution(state === null || state === void 0 ? void 0 : state.routeId);
     const handleRemoveRoute = () => {
         navigateBack();
@@ -22,6 +25,7 @@ export const SwapPage = () => {
     const handleSwapClick = () => {
         if (status === 'idle') {
             executeRoute();
+            setValue(SwapFormKey.FromAmount, '');
         }
         if (status === 'error') {
             restartRoute();
@@ -41,5 +45,5 @@ export const SwapPage = () => {
                 return (_jsxs(Fragment, { children: [_jsx(Step, { step: step, fromToken: index === 0
                                 ? Object.assign(Object.assign({}, step.action.fromToken), { amount: step.action.fromAmount }) : undefined, toToken: index === steps.length - 1
                                 ? Object.assign(Object.assign({}, step.action.toToken), { amount: (_b = (_a = step.execution) === null || _a === void 0 ? void 0 : _a.toAmount) !== null && _b !== void 0 ? _b : step.estimate.toAmount }) : undefined }), steps.length > 1 && index !== steps.length - 1 ? (_jsx(StepDivider, {})) : null] }, step.id));
-            }), status === 'idle' ? (_jsx(GasSufficiencyMessage, { route: route, mt: 2 })) : null, status === 'idle' || status === 'error' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(SwapButton, { text: getSwapButtonText(), onClick: handleSwapClick, currentRoute: route }) }))) : null, status === 'error' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "outlined", onClick: handleRemoveRoute, fullWidth: true }, { children: t('button.removeSwap') })) }))) : null, route && status ? (_jsx(StatusBottomSheet, { status: status, route: route })) : null] }));
+            }), status === 'idle' ? (_jsx(GasSufficiencyMessage, { route: route, mt: 2 })) : null, status === 'idle' || status === 'error' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(SwapButton, { text: getSwapButtonText(), onClick: handleSwapClick, currentRoute: route, disable: status === 'idle' && (isValidating || !isValid) }) }))) : null, status === 'error' ? (_jsx(Box, Object.assign({ mt: 2 }, { children: _jsx(Button, Object.assign({ variant: "outlined", onClick: handleRemoveRoute, fullWidth: true }, { children: t('button.removeSwap') })) }))) : null, route && status ? (_jsx(StatusBottomSheet, { status: status, route: route })) : null] }));
 };

package/providers/SwapFormProvider/SwapFormProvider.js

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { ChainId } from '@lifi/sdk';
 import { useEffect } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
+import { useChainOrderStore, useSetChainOrder } from '../../stores/chains';
 import { useWallet } from '../WalletProvider';
 import { useWidgetConfig } from '../WidgetProvider';
 import { SwapFormKey } from './types';
@@ -11,6 +12,7 @@ export const formDefaultValues = {
     [SwapFormKey.TokenSearchFilter]: '',
 };
 export const SwapFormProvider = ({ children, }) => {
+    const [setChain] = useSetChainOrder();
     const { account } = useWallet();
     const { fromChain, fromToken, fromAmount, toChain, toToken, toAddress } = useWidgetConfig();
     const methods = useForm({
@@ -24,24 +26,50 @@ export const SwapFormProvider = ({ children, }) => {
         if (!account.isActive || !account.chainId) {
             return;
         }
-        const { isDirty: isFromChainDirty, isTouched: isFromChainTouched } = methods.getFieldState(SwapFormKey.FromChain, methods.formState);
-        const { isDirty: isToChainDirty, isTouched: isToChainTouched } = methods.getFieldState(SwapFormKey.ToChain, methods.formState);
-        if (!fromChain && !isFromChainDirty && !isFromChainTouched) {
+        const [fromChainValue, toChainValue] = methods.getValues([
+            SwapFormKey.FromChain,
+            SwapFormKey.ToChain,
+        ]);
+        const { isDirty: isFromChainDirty } = methods.getFieldState(SwapFormKey.FromChain, methods.formState);
+        const { isDirty: isToChainDirty } = methods.getFieldState(SwapFormKey.ToChain, methods.formState);
+        const { isDirty: isFromTokenDirty } = methods.getFieldState(SwapFormKey.FromToken, methods.formState);
+        const { isDirty: isToTokenDirty } = methods.getFieldState(SwapFormKey.ToToken, methods.formState);
+        // 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 { chainOrder } = useChainOrderStore.getState();
+        const hasFromChainInOrderedList = chainOrder.includes(fromChainValue);
+        const hasToChainInOrderedList = chainOrder.includes(toChainValue);
+        if ((!fromChain && !isFromChainDirty && !isFromTokenDirty) ||
+            !hasFromChainInOrderedList) {
             methods.setValue(SwapFormKey.FromChain, account.chainId, {
                 shouldDirty: false,
-                shouldTouch: false,
+            });
+            methods.setValue(SwapFormKey.FromToken, '', {
+                shouldDirty: false,
+            });
+            methods.setValue(SwapFormKey.FromAmount, '', {
+                shouldDirty: false,
             });
         }
-        if (!toChain &&
-            !isToChainDirty &&
-            !isToChainTouched &&
-            !isFromChainDirty &&
-            !isFromChainTouched) {
+        if ((!toChain && !isToChainDirty && !isToTokenDirty) ||
+            !hasToChainInOrderedList) {
             methods.setValue(SwapFormKey.ToChain, account.chainId, {
                 shouldDirty: false,
-                shouldTouch: false,
+            });
+            methods.setValue(SwapFormKey.ToToken, '', {
+                shouldDirty: false,
             });
         }
-    }, [account.chainId, account.isActive, fromChain, methods, toChain]);
+    }, [
+        account.chainId,
+        account.isActive,
+        fromChain,
+        methods,
+        setChain,
+        toChain,
+    ]);
     return _jsx(FormProvider, Object.assign({}, methods, { children: children }));
 };

package/providers/WidgetProvider/WidgetProvider.js

@@ -23,7 +23,7 @@ const initialContext = {
 const WidgetContext = createContext(initialContext);
 export const useWidgetConfig = () => useContext(WidgetContext);
 export const WidgetProvider = (_a) => {
-    var { children } = _a, _b = _a.config, _c = _b === void 0 ? {} : _b, { fromChain, fromToken, toChain, toToken, fromAmount, integrator } = _c, config = __rest(_c, ["fromChain", "fromToken", "toChain", "toToken", "fromAmount", "integrator"]);
+    var { children } = _a, _b = _a.config, _c = _b === void 0 ? {} : _b, { fromChain, fromToken, toChain, toToken, fromAmount, integrator, sdkConfig } = _c, config = __rest(_c, ["fromChain", "fromToken", "toChain", "toToken", "fromAmount", "integrator", "sdkConfig"]);
     const value = useMemo(() => {
         var _a, _b, _c, _d;
         try {
@@ -54,12 +54,8 @@ export const WidgetProvider = (_a) => {
         }
     }, [config, fromAmount, fromChain, fromToken, toChain, toToken]);
     useEffect(() => {
-        updateLiFiConfig({
-            defaultRouteOptions: {
-                integrator: integrator !== null && integrator !== void 0 ? integrator : window.location.hostname,
-            },
-        });
-    }, [integrator]);
+        updateLiFiConfig(Object.assign(Object.assign({}, sdkConfig), { defaultRouteOptions: Object.assign(Object.assign({}, sdkConfig === null || sdkConfig === void 0 ? void 0 : sdkConfig.defaultRouteOptions), { integrator: integrator !== null && integrator !== void 0 ? integrator : window.location.hostname }) }));
+    }, [integrator, sdkConfig]);
     useEffect(() => {
         checkPackageUpdates(name, version);
     }, []);

package/stores/chains/index.d.ts

@@ -0,0 +1,4 @@
+export * from './types';
+export * from './useChainOrder';
+export * from './useChainOrderStore';
+export * from './useInitializeChainOrder';

package/stores/chains/index.js

@@ -0,0 +1,4 @@
+export * from './types';
+export * from './useChainOrder';
+export * from './useChainOrderStore';
+export * from './useInitializeChainOrder';

package/stores/chains/types.d.ts

@@ -0,0 +1,8 @@
+export interface ChainOrderState {
+    chainOrder: number[];
+    availableChains: number[];
+}
+export interface ChainOrderStore extends ChainOrderState {
+    initializeChains(chainIds: number[]): void;
+    setChain(chainId: number): void;
+}

package/stores/chains/types.js

@@ -0,0 +1 @@
+export {};

package/stores/chains/useChainOrder.d.ts

@@ -0,0 +1 @@
+export declare const useChainOrder: () => [number[], (chainId: number) => void];

package/stores/chains/useChainOrder.js

@@ -0,0 +1,5 @@
+import shallow from 'zustand/shallow';
+import { useChainOrderStore } from './useChainOrderStore';
+export const useChainOrder = () => {
+    return useChainOrderStore((state) => [state.chainOrder, state.setChain], shallow);
+};

package/stores/chains/useChainOrderStore.d.ts

@@ -0,0 +1,19 @@
+import type { ChainOrderStore } from './types';
+export declare const maxChainToOrder = 9;
+export declare const useChainOrderStore: import("zustand").UseBoundStore<Omit<Omit<import("zustand").StoreApi<ChainOrderStore>, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<ChainOrderStore, {
+            chainOrder: number[];
+        }>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => Promise<void>;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: ChainOrderStore) => void) => () => void;
+        onFinishHydration: (fn: (state: ChainOrderStore) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<ChainOrderStore, {
+            chainOrder: number[];
+        }>>;
+    };
+}, "setState"> & {
+    setState(nextStateOrUpdater: ChainOrderStore | Partial<ChainOrderStore> | ((state: import("immer/dist/internal").WritableDraft<ChainOrderStore>) => void), shouldReplace?: boolean | undefined): void;
+}>;