@lifi/widget 1.13.2 → 1.13.3

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

@@ -0,0 +1,32 @@
+/// <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 ListItem: 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>, {}, {}>;

package/cjs/components/TokenList/TokenList.style.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListItem = exports.ListItemButton = void 0;
+const material_1 = require("@mui/material");
+const ListItemSecondaryAction_1 = require("@mui/material/ListItemSecondaryAction");
+const styles_1 = require("@mui/material/styles");
+const utils_1 = require("../../utils");
+exports.ListItemButton = (0, styles_1.styled)(material_1.ListItemButton)(({ theme }) => ({
+    borderRadius: theme.shape.borderRadiusSecondary,
+    paddingLeft: theme.spacing(2),
+    height: 64,
+    width: '100%',
+    '&:hover': {
+        backgroundColor: (0, utils_1.getContrastAlphaColor)(theme, '4%'),
+    },
+}));
+exports.ListItem = (0, styles_1.styled)(material_1.ListItem)(({ theme }) => ({
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    height: 64,
+    flexDirection: 'column',
+    alignItems: 'flex-start',
+    padding: theme.spacing(0, 3),
+    [`.${ListItemSecondaryAction_1.listItemSecondaryActionClasses.root}`]: {
+        right: theme.spacing(5),
+    },
+}));

package/cjs/components/TokenList/TokenListItem.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { TokenListItemProps } from './types';
+export declare const TokenListItem: React.FC<TokenListItemProps>;
+export declare const TokenListItemSkeleton: () => JSX.Element;
+export declare const TokenAmountSkeleton: React.FC;

package/cjs/components/TokenList/TokenListItem.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TokenAmountSkeleton = exports.TokenListItemSkeleton = exports.TokenListItem = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_i18next_1 = require("react-i18next");
+const utils_1 = require("../../utils");
+const TokenList_style_1 = require("./TokenList.style");
+exports.TokenListItem = (0, react_1.memo)(({ onClick, size, start, token, showBalance, isBalanceLoading, startAdornment, endAdornment, }) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const handleClick = () => onClick === null || onClick === void 0 ? void 0 : onClick(token.address);
+    const tokenPrice = (0, utils_1.formatTokenPrice)(token.amount, token.priceUSD);
+    return ((0, jsx_runtime_1.jsxs)(TokenList_style_1.ListItem, Object.assign({ disablePadding: true, style: {
+            height: `${size}px`,
+            transform: `translateY(${start}px)`,
+        } }, { children: [startAdornment, (0, jsx_runtime_1.jsxs)(TokenList_style_1.ListItemButton, Object.assign({ onClick: handleClick, dense: true, disableRipple: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, Object.assign({ src: token.logoURI, alt: token.symbol }, { children: token.symbol[0] })) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: token.symbol, secondary: token.name }), showBalance ? (isBalanceLoading ? ((0, jsx_runtime_1.jsx)(exports.TokenAmountSkeleton, {})) : ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: { textAlign: 'right' } }, { children: [Number(token.amount) ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", noWrap: true }, { children: token.amount }))) : null, tokenPrice ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ fontWeight: 400, fontSize: 12, color: "text.secondary", "data-price": token.priceUSD }, { children: t(`swap.currency`, {
+                                    value: tokenPrice,
+                                }) }))) : null] })))) : null] })), endAdornment] })));
+});
+const TokenListItemSkeleton = () => {
+    return ((0, jsx_runtime_1.jsxs)(TokenList_style_1.ListItem, Object.assign({ secondaryAction: (0, jsx_runtime_1.jsx)(exports.TokenAmountSkeleton, {}), disablePadding: true, sx: { position: 'relative', flexDirection: 'row', alignItems: 'center' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "circular", width: 32, height: 32, sx: { marginLeft: 2, marginRight: 2 } }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 48, height: 20 }), secondary: (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 96, height: 20 }) })] })));
+};
+exports.TokenListItemSkeleton = TokenListItemSkeleton;
+const TokenAmountSkeleton = () => {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: {
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'flex-end',
+        } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 56, height: 24 }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 48, height: 18 })] })));
+};
+exports.TokenAmountSkeleton = TokenAmountSkeleton;

package/cjs/components/TokenList/TokenNotFound.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const TokenNotFound: React.FC;

package/cjs/components/TokenList/TokenNotFound.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TokenNotFound = 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_i18next_1 = require("react-i18next");
+const TokenNotFound = () => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: {
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+            flexDirection: 'column',
+            flex: 1,
+            padding: 3,
+        } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ fontSize: 48, lineHeight: 1 }, { children: (0, jsx_runtime_1.jsx)(icons_material_1.SearchOff, { fontSize: "inherit" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ fontSize: 14, color: "text.secondary", textAlign: "center", mt: 2, px: 2 }, { children: t('swap.couldntFindTokens') }))] })));
+};
+exports.TokenNotFound = TokenNotFound;

package/cjs/components/TokenList/VirtualizedTokenList.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { VirtualizedTokenListProps } from './types';
+export declare const VirtualizedTokenList: FC<VirtualizedTokenListProps>;

package/cjs/components/TokenList/VirtualizedTokenList.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VirtualizedTokenList = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_virtual_1 = require("@tanstack/react-virtual");
+const react_1 = require("react");
+const react_i18next_1 = require("react-i18next");
+const TokenListItem_1 = require("./TokenListItem");
+const VirtualizedTokenList = ({ tokens, featuredTokensLength, scrollElementRef, chainId, isLoading, isBalanceLoading, showBalance, showFeatured, onClick, }) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const hasFeaturedTokens = !!featuredTokensLength && showFeatured;
+    const featuredTokensLastIndex = (featuredTokensLength !== null && featuredTokensLength !== void 0 ? featuredTokensLength : 0) - 1;
+    const tokensLastIndex = tokens.length - 1;
+    const { getVirtualItems, getTotalSize, scrollToIndex } = (0, react_virtual_1.useVirtualizer)({
+        count: tokens.length,
+        getScrollElement: () => scrollElementRef.current,
+        overscan: 5,
+        paddingEnd: 12,
+        estimateSize: (index) => {
+            var _a, _b;
+            // heigth of TokenListItem
+            let size = 64;
+            if (!hasFeaturedTokens) {
+                return size;
+            }
+            if (index === 0 && ((_a = tokens[index]) === null || _a === void 0 ? void 0 : _a.featured)) {
+                // height of startAdornment
+                size += 24;
+            }
+            if (index === featuredTokensLastIndex &&
+                index !== tokensLastIndex &&
+                ((_b = tokens[index]) === null || _b === void 0 ? void 0 : _b.featured)) {
+                // height of endAdornment
+                size += 32;
+            }
+            return size;
+        },
+        getItemKey: (index) => { var _a; return (_a = tokens[index].address) !== null && _a !== void 0 ? _a : index; },
+    });
+    (0, react_1.useEffect)(() => {
+        scrollToIndex(0, { align: 'start', smoothScroll: false });
+    }, [scrollToIndex, chainId]);
+    if (isLoading) {
+        return ((0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ disablePadding: true }, { children: Array.from({ length: 3 }).map((_, index) => (
+            // eslint-disable-next-line react/no-array-index-key
+            (0, jsx_runtime_1.jsx)(TokenListItem_1.TokenListItemSkeleton, {}, index))) })));
+    }
+    return ((0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ style: { height: getTotalSize() }, disablePadding: true }, { children: getVirtualItems().map((item) => {
+            const token = tokens[item.index];
+            return ((0, jsx_runtime_1.jsx)(TokenListItem_1.TokenListItem, { onClick: onClick, size: item.size, start: item.start, token: token, isBalanceLoading: isBalanceLoading, showBalance: showBalance, startAdornment: hasFeaturedTokens && token.featured && item.index === 0 ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ fontSize: 14, fontWeight: 600, lineHeight: 1, px: 2, pb: 1.25 }, { children: t('swap.featuredTokens') }))) : null, endAdornment: hasFeaturedTokens &&
+                    token.featured &&
+                    item.index === featuredTokensLastIndex &&
+                    item.index !== tokensLastIndex ? ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ fontSize: 14, fontWeight: 600, lineHeight: 1, px: 2, py: 1.25 }, { children: t('swap.otherTokens') }))) : null }, item.key));
+        }) })));
+};
+exports.VirtualizedTokenList = VirtualizedTokenList;

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

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

package/cjs/components/TokenList/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./TokenList"), exports);

package/cjs/components/TokenList/types.d.ts

@@ -0,0 +1,32 @@
+import { TokenAmount } from '@lifi/sdk';
+import { MutableRefObject } from 'react';
+import { SwapFormDirection } from '../../providers/SwapFormProvider';
+import { Token } from '../../types';
+export interface TokenListProps {
+    formType: SwapFormDirection;
+    height: number;
+    onClick?(): void;
+}
+export interface VirtualizedTokenListProps {
+    tokens: Token[];
+    featuredTokensLength?: number;
+    scrollElementRef: MutableRefObject<HTMLElement | null>;
+    isLoading: boolean;
+    isBalanceLoading: boolean;
+    chainId: number;
+    showBalance?: boolean;
+    showFeatured?: boolean;
+    onClick(tokenAddress: string): void;
+}
+export interface TokenListItemBaseProps {
+    onClick?(tokenAddress: string): void;
+    size: number;
+    start: number;
+}
+export interface TokenListItemProps extends TokenListItemBaseProps {
+    showBalance?: boolean;
+    token: TokenAmount;
+    isBalanceLoading?: boolean;
+    startAdornment?: React.ReactNode;
+    endAdornment?: React.ReactNode;
+}

package/cjs/components/TokenList/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/cjs/config/env.d.ts

@@ -0,0 +1,3 @@
+export declare const env: {
+    LIFI_API_URL: string;
+};

package/cjs/config/env.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.env = void 0;
+exports.env = {
+    LIFI_API_URL: 'https://li.quest/v1/', // 'https://developkub.li.finance/v1/',
+};

package/cjs/config/lifi.d.ts

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

package/cjs/config/lifi.js

@@ -0,0 +1,12 @@
+"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();
+const updateLiFiConfig = (configUpdate) => {
+    exports.LiFi.setConfig(configUpdate);
+};
+exports.updateLiFiConfig = updateLiFiConfig;

package/cjs/config/queryClient.d.ts

@@ -0,0 +1,2 @@
+import { QueryClient } from '@tanstack/react-query';
+export declare const queryClient: QueryClient;

package/cjs/config/queryClient.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.queryClient = void 0;
+const react_query_1 = require("@tanstack/react-query");
+exports.queryClient = new react_query_1.QueryClient({
+    defaultOptions: {
+        queries: {
+            enabled: true,
+            staleTime: 3600000,
+            cacheTime: Infinity,
+            refetchInterval: false,
+            refetchIntervalInBackground: false,
+            refetchOnWindowFocus: true,
+            refetchOnReconnect: true,
+            refetchOnMount: true,
+            retryOnMount: true,
+            // suspense: true,
+            onError: (error) => {
+                //
+            },
+        },
+        mutations: {
+            onError: (error) => {
+                //
+            },
+        },
+    },
+});

package/cjs/config/sentry.d.ts

@@ -0,0 +1 @@
+export declare const initSentry: (enabled?: boolean) => Promise<void>;

package/cjs/config/sentry.js

@@ -0,0 +1,65 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initSentry = void 0;
+const version_1 = require("./version");
+let sentryLoaded = false;
+const initSentry = (enabled) => __awaiter(void 0, void 0, void 0, function* () {
+    if (process.env.NODE_ENV === 'development') {
+        return;
+    }
+    if (enabled || sentryLoaded) {
+        const [Sentry, { CaptureConsole }, { BrowserTracing }] = yield Promise.all([
+            Promise.resolve().then(() => __importStar(require('@sentry/react'))),
+            Promise.resolve().then(() => __importStar(require('@sentry/integrations'))),
+            Promise.resolve().then(() => __importStar(require('@sentry/tracing'))),
+        ]);
+        Sentry.init({
+            dsn: 'https://bc1312161bf948db9b9c82618035ec22@o1302189.ingest.sentry.io/6539228',
+            integrations: [
+                new BrowserTracing(),
+                new CaptureConsole({
+                    levels: ['error'],
+                }),
+            ],
+            sampleRate: 1,
+            tracesSampleRate: 0.2,
+            enabled,
+            environment: process.env.NODE_ENV,
+            release: version_1.version,
+        });
+        sentryLoaded = true;
+    }
+});
+exports.initSentry = initSentry;

package/cjs/config/theme.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { PaletteMode } from '@mui/material';
+import { ThemeConfig } from '../types';
+declare module '@mui/material/styles' {
+    interface TypographyVariants {
+        '@supports (font-variation-settings: normal)': React.CSSProperties;
+    }
+    interface TypographyVariantsOptions {
+        '@supports (font-variation-settings: normal)'?: React.CSSProperties;
+    }
+    interface Shape {
+        borderRadius: number;
+        borderRadiusSecondary: number;
+    }
+    interface Theme {
+        shape: Shape;
+    }
+    interface ThemeOptions {
+        shape?: Partial<Shape>;
+    }
+}
+declare module '@mui/material/Typography' {
+    interface TypographyPropsVariantOverrides {
+        '@supports (font-variation-settings: normal)': true;
+    }
+}
+export declare const createTheme: (mode: PaletteMode, theme?: ThemeConfig) => import("@mui/material").Theme;

package/cjs/config/theme.js

@@ -0,0 +1,175 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createTheme = void 0;
+const DialogActions_1 = require("@mui/material/DialogActions");
+const styles_1 = require("@mui/material/styles");
+const createPalette_1 = require("@mui/material/styles/createPalette");
+const palette = {
+    primary: {
+        main: '#3F49E1',
+        light: (0, styles_1.lighten)('#3F49E1', 0.5),
+        dark: (0, styles_1.darken)('#3F49E1', 0.2),
+    },
+    secondary: {
+        main: '#F5B5FF',
+        light: (0, styles_1.lighten)('#F5B5FF', 0.5),
+        dark: (0, styles_1.darken)('#F5B5FF', 0.2),
+    },
+    success: {
+        main: '#0AA65B',
+    },
+    warning: {
+        main: '#FFE668',
+    },
+    error: {
+        main: '#E5452F',
+    },
+    info: {
+        main: '#297EFF',
+    },
+};
+const shape = {
+    borderRadius: 12,
+    borderRadiusSecondary: 6,
+};
+const createTheme = (mode, theme = {}) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+    const primaryMainColor = (_c = (_b = (_a = theme.palette) === null || _a === void 0 ? void 0 : _a.primary) === null || _b === void 0 ? void 0 : _b.main) !== null && _c !== void 0 ? _c : palette.primary.main;
+    const primaryLightColor = (0, styles_1.lighten)((_f = (_e = (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.primary) === null || _e === void 0 ? void 0 : _e.main) !== null && _f !== void 0 ? _f : palette.primary.main, 0.5);
+    const primaryDarkColor = (0, styles_1.darken)((_j = (_h = (_g = theme.palette) === null || _g === void 0 ? void 0 : _g.primary) === null || _h === void 0 ? void 0 : _h.main) !== null && _j !== void 0 ? _j : palette.primary.main, 0.2);
+    return (0, styles_1.createTheme)({
+        typography: Object.assign({ fontFamily: 'Inter var, Inter, sans-serif' }, theme.typography),
+        palette: Object.assign(Object.assign(Object.assign({ mode }, palette), { primary: {
+                main: primaryMainColor,
+                light: primaryLightColor,
+                dark: primaryDarkColor,
+            }, secondary: {
+                main: (_m = (_l = (_k = theme.palette) === null || _k === void 0 ? void 0 : _k.secondary) === null || _l === void 0 ? void 0 : _l.main) !== null && _m !== void 0 ? _m : palette.secondary.main,
+                light: (0, styles_1.lighten)((_q = (_p = (_o = theme.palette) === null || _o === void 0 ? void 0 : _o.secondary) === null || _p === void 0 ? void 0 : _p.main) !== null && _q !== void 0 ? _q : palette.secondary.main, 0.5),
+                dark: (0, styles_1.darken)((_t = (_s = (_r = theme.palette) === null || _r === void 0 ? void 0 : _r.secondary) === null || _s === void 0 ? void 0 : _s.main) !== null && _t !== void 0 ? _t : palette.secondary.main, 0.2),
+            } }), (mode === 'light'
+            ? {
+                text: {
+                    primary: '#000',
+                    secondary: '#52575b',
+                },
+                grey: {
+                    100: '#F4F5F6',
+                    200: '#EFF1F2',
+                    300: '#E3E7E9',
+                    400: '#C6C9CD',
+                    500: '#AEB3B7',
+                    600: '#798086',
+                    700: '#57595C',
+                },
+            }
+            : {
+                background: {
+                    paper: '#212121',
+                },
+            })),
+        shape: Object.assign(Object.assign({}, shape), theme.shape),
+        breakpoints: {
+            values: {
+                xs: 0,
+                sm: 392,
+                md: 900,
+                lg: 1200,
+                xl: 1536,
+            },
+        },
+        components: {
+            MuiScopedCssBaseline: {
+                styleOverrides: {
+                    root: Object.assign(Object.assign({ fontFamily: 'Inter, sans-serif' }, theme.typography), { '@supports (font-variation-settings: normal)': Object.assign({ fontFamily: 'Inter var, sans-serif' }, theme.typography) }),
+                },
+            },
+            MuiButton: {
+                defaultProps: {
+                    disableElevation: true,
+                },
+                styleOverrides: Object.assign(Object.assign({}, (mode === 'dark'
+                    ? {
+                        outlined: {
+                            color: primaryLightColor,
+                            borderColor: primaryLightColor,
+                            '&:hover': {
+                                backgroundColor: (0, styles_1.alpha)(primaryLightColor, 0.08),
+                                borderColor: primaryLightColor,
+                            },
+                        },
+                        text: {
+                            color: primaryLightColor,
+                            '&:hover': {
+                                backgroundColor: (0, styles_1.alpha)(primaryLightColor, 0.08),
+                                borderColor: primaryLightColor,
+                            },
+                        },
+                    }
+                    : {})), { root: {
+                        borderRadius: (_v = (_u = theme.shape) === null || _u === void 0 ? void 0 : _u.borderRadiusSecondary) !== null && _v !== void 0 ? _v : shape.borderRadiusSecondary,
+                        textTransform: 'none',
+                        fontSize: '1rem',
+                        padding: '10px 16px',
+                        [`.${DialogActions_1.dialogActionsClasses.root} &`]: {
+                            padding: '6px 12px',
+                        },
+                        '&.Mui-disabled, &.Mui-disabled:hover': {
+                            color: mode === 'light'
+                                ? 'rgb(0 0 0 / 70%)'
+                                : 'rgb(255 255 255 / 70%)',
+                            cursor: 'not-allowed',
+                            pointerEvents: 'auto',
+                        },
+                    }, contained: {
+                        '&:hover': {
+                            color: (0, styles_1.getContrastRatio)(createPalette_1.dark.text.primary, primaryMainColor) >= 3
+                                ? createPalette_1.dark.text.primary
+                                : createPalette_1.light.text.primary,
+                        },
+                    } }),
+            },
+            MuiIconButton: {
+                styleOverrides: {
+                    root: {
+                        color: 'inherit',
+                        '&:hover': {
+                            color: 'inherit',
+                        },
+                    },
+                },
+            },
+            MuiAvatar: {
+                styleOverrides: {
+                    root: {
+                        height: 32,
+                        width: 32,
+                    },
+                },
+            },
+            MuiListItemAvatar: {
+                styleOverrides: {
+                    root: {
+                        minWidth: 48,
+                    },
+                },
+            },
+            MuiListItemText: {
+                styleOverrides: {
+                    primary: ({ theme }) => ({
+                        fontWeight: '500',
+                        fontSize: '1.125rem',
+                        lineHeight: '1.2778',
+                        color: theme.palette.text.primary,
+                    }),
+                    secondary: ({ theme }) => ({
+                        fontWeight: '400',
+                        fontSize: '0.75rem',
+                        color: theme.palette.text.secondary,
+                    }),
+                },
+            },
+        },
+    });
+};
+exports.createTheme = createTheme;

package/cjs/config/version.d.ts

@@ -0,0 +1,2 @@
+export declare const name = "@lifi/widget";
+export declare const version = "1.13.3";

package/cjs/config/version.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.version = exports.name = void 0;
+exports.name = '@lifi/widget';
+exports.version = '1.13.3';

package/cjs/hooks/index.d.ts

@@ -0,0 +1,17 @@
+export * from './useChain';
+export * from './useChains';
+export * from './useContentHeight';
+export * from './useDebouncedWatch';
+export * from './useFeaturedTokens';
+export * from './useGasSufficiency';
+export * from './useInitializer';
+export * from './useRouteExecution';
+export * from './useScrollableContainer';
+export * from './useSwapRoutes';
+export * from './useTelemetry';
+export * from './useToken';
+export * from './useTokenBalance';
+export * from './useTokenBalances';
+export * from './useTokens';
+export * from './useTokenSearch';
+export * from './useTools';