@lifi/widget 2.0.0-beta.13 → 2.0.0-beta.14

package/AppDrawer.style.d.ts

@@ -9,7 +9,7 @@ export declare const DrawerButton: import("@emotion/styled").StyledComponent<{
     endIcon?: import("react").ReactNode;
     fullWidth?: boolean | undefined;
     href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;

package/cjs/AppDrawer.style.d.ts

@@ -9,7 +9,7 @@ export declare const DrawerButton: import("@emotion/styled").StyledComponent<{
     endIcon?: import("react").ReactNode;
     fullWidth?: boolean | undefined;
     href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;

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

@@ -17,7 +17,7 @@ export declare const ListItemButton: import("@emotion/styled").StyledComponent<i
     touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
 }, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "dense" | "divider" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "divider" | "dense" | "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 & {
@@ -35,7 +35,7 @@ export declare const ListItem: import("@emotion/styled").StyledComponent<{
     } | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
     ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
-}, "button" | "className" | "style" | "classes" | "autoFocus" | "children" | "disabled" | "sx" | "alignItems" | "dense" | "divider" | "components" | "slotProps" | "slots" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "button" | "className" | "style" | "classes" | "autoFocus" | "children" | "disabled" | "sx" | "alignItems" | "divider" | "components" | "dense" | "slotProps" | "slots" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const ShowAllButton: import("@emotion/styled").StyledComponent<{
     children?: import("react").ReactNode;
     classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
@@ -46,7 +46,7 @@ export declare const ShowAllButton: import("@emotion/styled").StyledComponent<{
     endIcon?: import("react").ReactNode;
     fullWidth?: boolean | undefined;
     href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;

package/cjs/components/Card/CardIconButton.d.ts

@@ -6,7 +6,7 @@ export declare const CardIconButton: import("@emotion/styled").StyledComponent<{
     disabled?: boolean | undefined;
     disableFocusRipple?: boolean | undefined;
     edge?: false | "end" | "start" | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").IconButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").IconButtonPropsSizeOverrides> | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
 } & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;

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

@@ -35,7 +35,7 @@ export declare const WalletButton: import("@emotion/styled").StyledComponent<{
     endIcon?: import("react").ReactNode;
     fullWidth?: boolean | undefined;
     href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;

package/cjs/components/Header/NavigationTabs.style.js

@@ -5,7 +5,7 @@ const material_1 = require("@mui/material");
 const styles_1 = require("@mui/material/styles");
 exports.NavbarTabs = (0, styles_1.styled)(material_1.Tabs)(({ theme }) => ({
     backgroundColor: theme.palette.mode === 'dark'
-        ? theme.palette.common.white
+        ? theme.palette.background.paper
         : (0, styles_1.alpha)(theme.palette.common.black, 0.04),
     borderRadius: Math.max(theme.shape.borderRadius, theme.shape.borderRadiusSecondary),
     padding: theme.spacing(0.5),
@@ -25,7 +25,7 @@ exports.NavbarTabs = (0, styles_1.styled)(material_1.Tabs)(({ theme }) => ({
         transform: 'translateY(-50%)',
         height: 48,
         backgroundColor: theme.palette.mode === 'dark'
-            ? theme.palette.common.black
+            ? theme.palette.background.default
             : theme.palette.common.white,
         borderRadius: theme.shape.borderRadiusSecondary,
         boxShadow: `0px 2px 4px ${(0, styles_1.alpha)(theme.palette.common.black, 0.04)}`,

package/cjs/components/ListItemButton.d.ts

@@ -17,4 +17,4 @@ export declare const ListItemButton: import("@emotion/styled").StyledComponent<i
     touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
 }, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "dense" | "divider" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "divider" | "dense" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

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

@@ -10,7 +10,7 @@ export declare const PreviewAvatar: import("@emotion/styled").StyledComponent<{
     src?: string | undefined;
     srcSet?: string | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"square" | "circular" | "rounded", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
+    variant?: import("@mui/types").OverridableStringUnion<"circular" | "rounded" | "square", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
 }, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "alt" | "imgProps" | "sizes" | "src" | "srcSet"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

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

@@ -6,7 +6,7 @@ export declare const IconButton: import("@emotion/styled").StyledComponent<{
     disabled?: boolean | undefined;
     disableFocusRipple?: boolean | undefined;
     edge?: false | "end" | "start" | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").IconButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").IconButtonPropsSizeOverrides> | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
 } & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;

package/cjs/components/SmallAvatar.d.ts

@@ -10,7 +10,7 @@ export declare const SmallAvatar: import("@emotion/styled").StyledComponent<{
     src?: string | undefined;
     srcSet?: string | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"square" | "circular" | "rounded", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
+    variant?: import("@mui/types").OverridableStringUnion<"circular" | "rounded" | "square", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
 }, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "alt" | "imgProps" | "sizes" | "src" | "srcSet"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

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

@@ -14,7 +14,7 @@ export declare const StepAvatar: import("@emotion/styled").StyledComponent<{
     src?: string | undefined;
     srcSet?: string | undefined;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"square" | "circular" | "rounded", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
+    variant?: import("@mui/types").OverridableStringUnion<"circular" | "rounded" | "square", import("@mui/material").AvatarPropsVariantOverrides> | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
 }, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "alt" | "imgProps" | "sizes" | "src" | "srcSet"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/components/SwapInput/SwapInputAdornment.style.d.ts

@@ -9,7 +9,7 @@ export declare const Button: import("@emotion/styled").StyledComponent<{
     endIcon?: import("react").ReactNode;
     fullWidth?: boolean | undefined;
     href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium" | "large", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
+    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
     startIcon?: import("react").ReactNode;
     sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { StyledComponent } from '@emotion/styled';
-import type { ButtonProps, LinkProps } from '@mui/material';
+import type { IconButtonProps, LinkProps } from '@mui/material';
 export declare const ListItemButton: StyledComponent<import("@mui/material").ListItemButtonBaseProps & Omit<{
     action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
     centerRipple?: boolean | undefined;
@@ -19,7 +19,7 @@ export declare const ListItemButton: StyledComponent<import("@mui/material").Lis
     touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
 }, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "dense" | "divider" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "divider" | "dense" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const ListItem: StyledComponent<{
     button?: false | undefined;
 } & import("@mui/material").ListItemBaseProps & {
@@ -37,5 +37,5 @@ export declare const ListItem: StyledComponent<{
     } | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
     ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
-}, "button" | "className" | "style" | "classes" | "autoFocus" | "children" | "disabled" | "sx" | "alignItems" | "dense" | "divider" | "components" | "slotProps" | "slots" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const LinkButton: StyledComponent<ButtonProps & LinkProps>;
+}, "button" | "className" | "style" | "classes" | "autoFocus" | "children" | "disabled" | "sx" | "alignItems" | "divider" | "components" | "dense" | "slotProps" | "slots" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const IconButton: StyledComponent<IconButtonProps & LinkProps>;

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LinkButton = exports.ListItem = exports.ListItemButton = void 0;
+exports.IconButton = exports.ListItem = exports.ListItemButton = void 0;
 const material_1 = require("@mui/material");
 const ListItemSecondaryAction_1 = require("@mui/material/ListItemSecondaryAction");
 const ListItemText_1 = require("@mui/material/ListItemText");
@@ -23,28 +23,31 @@ exports.ListItem = (0, styles_1.styled)(material_1.ListItem)(({ theme }) => ({
     [`.${ListItemSecondaryAction_1.listItemSecondaryActionClasses.root}`]: {
         right: theme.spacing(3),
     },
+    [`& .${ListItemText_1.listItemTextClasses.primary}`]: {
+        height: 22,
+    },
     [`& .${ListItemText_1.listItemTextClasses.primary}, & .${ListItemText_1.listItemTextClasses.secondary}`]: {
         textOverflow: 'ellipsis',
         overflow: 'hidden',
         whiteSpace: 'nowrap',
     },
 }));
-exports.LinkButton = (0, styles_1.styled)(material_1.Button)(({ theme }) => ({
+exports.IconButton = (0, styles_1.styled)(material_1.IconButton)(({ theme }) => ({
     lineHeight: 1,
     fontSize: '0.75rem',
     fontWeight: 400,
-    padding: theme.spacing(0.375, 0.75),
+    padding: theme.spacing(0.375, 0.375),
+    marginLeft: theme.spacing(0.25),
     color: 'inherit',
     backgroundColor: 'unset',
+    minWidth: 'unset',
+    borderRadius: '50%',
     '&:hover': {
         backgroundColor: theme.palette.mode === 'light'
             ? (0, styles_1.alpha)(theme.palette.common.black, 0.04)
             : (0, styles_1.alpha)(theme.palette.common.white, 0.08),
     },
-    [`.${material_1.buttonClasses.endIcon}`]: {
-        marginLeft: theme.spacing(0.25),
-    },
-    [`.${material_1.buttonClasses.endIcon} > *:nth-of-type(1)`]: {
-        fontSize: '0.75rem',
+    svg: {
+        fontSize: '0.875rem',
     },
 }));

package/cjs/components/TokenList/TokenListItem.js

@@ -32,15 +32,11 @@ const TokenListItemButton = ({ onClick, token, chain, showBalance, isBalanceLoad
     };
     return ((0, jsx_runtime_1.jsxs)(TokenList_style_1.ListItemButton, { onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, dense: true, children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { src: token.logoURI, alt: token.symbol, children: token.symbol?.[0] }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: token.symbol, secondaryTypographyProps: {
                     component: 'div',
-                    sx: {
-                        overflow: 'auto',
-                        marginLeft: -0.75,
-                    },
-                }, secondary: (0, jsx_runtime_1.jsxs)(material_1.Box, { position: "relative", height: 18, ref: container, children: [(0, jsx_runtime_1.jsx)(material_1.Slide, { direction: "down", in: !showAddress, container: container.current, style: {
+                }, secondary: (0, jsx_runtime_1.jsxs)(material_1.Box, { position: "relative", height: 20, ref: container, children: [(0, jsx_runtime_1.jsx)(material_1.Slide, { direction: "down", in: !showAddress, container: container.current, style: {
                                 position: 'absolute',
-                            }, appear: false, children: (0, jsx_runtime_1.jsx)(material_1.Box, { pl: 0.75, children: token.name }) }), (0, jsx_runtime_1.jsx)(material_1.Slide, { direction: "up", in: showAddress, container: container.current, style: {
+                            }, appear: false, children: (0, jsx_runtime_1.jsx)(material_1.Box, { pt: 0.25, children: token.name }) }), (0, jsx_runtime_1.jsx)(material_1.Slide, { direction: "up", in: showAddress, container: container.current, style: {
                                 position: 'absolute',
-                            }, appear: false, mountOnEnter: true, children: (0, jsx_runtime_1.jsx)(TokenList_style_1.LinkButton, { size: "small", LinkComponent: material_1.Link, href: `${chain?.metamask.blockExplorerUrls[0]}address/${token.address}`, target: "_blank", rel: "nofollow noreferrer", onClick: (e) => e.stopPropagation(), endIcon: (0, jsx_runtime_1.jsx)(OpenInNewRounded_1.default, {}), children: (0, utils_1.shortenAddress)(token.address) }) })] }) }), showBalance ? (isBalanceLoading ? ((0, jsx_runtime_1.jsx)(exports.TokenAmountSkeleton, {})) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { textAlign: 'right' }, children: [Number(token.amount) ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", noWrap: true, children: t('format.number', {
+                            }, appear: false, mountOnEnter: true, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { display: "flex", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { display: "flex", alignItems: "center", pt: 0.125, children: (0, utils_1.shortenAddress)(token.address) }), (0, jsx_runtime_1.jsx)(TokenList_style_1.IconButton, { size: "small", LinkComponent: material_1.Link, href: `${chain?.metamask.blockExplorerUrls[0]}address/${token.address}`, target: "_blank", rel: "nofollow noreferrer", onClick: (e) => e.stopPropagation(), children: (0, jsx_runtime_1.jsx)(OpenInNewRounded_1.default, {}) })] }) })] }) }), showBalance ? (isBalanceLoading ? ((0, jsx_runtime_1.jsx)(exports.TokenAmountSkeleton, {})) : ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { textAlign: 'right' }, children: [Number(token.amount) ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body1", noWrap: true, children: t('format.number', {
                             value: (0, utils_1.formatTokenAmount)(token.amount),
                         }) })) : null, tokenPrice ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { fontWeight: 400, fontSize: 12, color: "text.secondary", "data-price": token.priceUSD, children: t(`format.currency`, {
                             value: tokenPrice,

package/cjs/config/version.d.ts

@@ -1,2 +1,2 @@
 export declare const name = "@lifi/widget";
-export declare const version = "2.0.0-beta.13";
+export declare const version = "2.0.0-beta.14";

package/cjs/config/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.version = exports.name = void 0;
 exports.name = '@lifi/widget';
-exports.version = '2.0.0-beta.13';
+exports.version = '2.0.0-beta.14';

package/cjs/i18n/fr.json

@@ -1,6 +1,8 @@
 {
   "button": {
     "auto": "Auto",
+    "buy": "Acheter",
+    "buyNow": "Acheter maintenant",
     "cancel": "Annuler",
     "connectWallet": "Connecter un portefeuille",
     "contactSupport": "Contacter le support",
@@ -23,6 +25,7 @@
     "resetSettings": "Réinitialiser les paramètres",
     "restartSwap": "Redémarrer l'échange",
     "reviewGasSwap": "Vérifier le gaz d'échange",
+    "reviewPurchase": "Vérifiez votre achat",
     "reviewSwap": "Vérifier l'échange",
     "seeDetails": "Voir les détails",
     "showAll": "Afficher tout",
@@ -39,10 +42,14 @@
   },
   "header": {
     "activeSwaps": "Échanges actifs",
+    "bridge": "Bridge",
     "checkout": "Paiement",
     "from": "Échanger de",
     "gas": "Gaz",
     "gasSwap": "Échange de gaz",
+    "payWith": "Payer avec",
+    "purchase": "Acheter",
+    "purchaseDetails": "Détails de l'achat",
     "routes": "Vous recevez",
     "selectChain": "Sélectionner la chaîne",
     "selectWallet": "Sélectionnez votre portefeuille",
@@ -75,6 +82,8 @@
     "currentAmount": "Montant actuel",
     "error": {
       "message": {
+        "allowanceRequired": "Le montant du transfert pour {{tokenSymbol}} dépasse votre allocation actuelle. Veuillez augmenter votre allocation et réessayer.",
+        "insufficientFunds": "Vous n'avez pas assez de gaz pour couvrir le coût de la transaction.",
         "slippageThreshold": "L'effet de glissement est supérieur au seuil défini. Veuillez demander un nouvel itinéraire pour obtenir un nouveau devis.",
         "transactionFailed": "Veuillez consulter l'explorateur de blocs pour plus d'informations.",
         "transactionNotSent": "La transaction n'a pas été envoyée. {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}} sur {{chainName}} restent dans votre portefeuille.",
@@ -82,10 +91,12 @@
         "unknown": "Veuillez réessayer ou contacter le support."
       },
       "title": {
+        "allowanceRequired": "Allocation insuffisante",
         "balanceIsTooLow": "Le solde est trop bas.",
         "chainSwitch": "Changement de chaîne nécessaire.",
         "failed": "L'échange a échoué.",
         "gasLimitIsTooLow": "La limite de gaz est trop basse.",
+        "insufficientFunds": "Fonds insuffisants",
         "slippageNotMet": "Les conditions de l'effet de glissement ne sont pas remplies.",
         "transactionCanceled": "Transaction annulée.",
         "transactionFailed": "La transaction a échoué.",
@@ -108,8 +119,8 @@
     "inProgress": "en cours",
     "insurance": {
       "bridgeExploits": "Des dysfonctionnements de pont, des hacks ou des exploits",
-      "insure": "Assurer 100% des jetons en cours de transit.",
-      "insured": "Vous avez assuré 100 % des jetons en cours de transit:",
+      "insure": "Assurer <strong>{{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}</strong> en transit :",
+      "insured": "Vous avez assuré <strong>{{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}</strong> en transit :",
       "slippageError": "Erreur dans le slippage pour les jetons reçus"
     },
     "info": {
@@ -131,7 +142,6 @@
     "onChain": "sur {{chainName}}",
     "otherTokens": "Autres jetons",
     "ownedBy": "Propriétaire",
-    "payWith": "Payer avec",
     "process": {
       "crossChain": {
         "actionRequired": "Veuillez signer la transaction.",
@@ -139,6 +149,9 @@
         "pending": "En attente de la transaction bridge",
         "started": "Préparation de la transaction bridge"
       },
+      "nft": {
+        "done": "NFT acheté"
+      },
       "receivingChain": {
         "done": "Bridge complété",
         "partial": "Bridge partiellement complété",
@@ -165,24 +178,27 @@
     "rateChange": "Taux de change",
     "receiving": "En cours de réception",
     "refuelStepDetails": "Obtenir du gaz via {{tool}}",
-    "routes": "Vous obtenez",
-    "selectChain": "Chaîne",
+    "selectChain": "Sélectionner la chaîne",
     "selectChainAndToken": "Sélectionnez la chaîne et le jeton",
-    "selectToken": "Jeton",
+    "selectToken": "Choisissez un jeton",
     "sendToAddress": "Envoyer à {{address}}",
     "sendToWallet": "Envoyer vers un autre portefeuille",
     "sentToAddress": "Envoyé à {{address}}",
     "stepBridge": "Bridge",
+    "stepBridgeAndBuy": "Bridge et acheter",
     "stepDetails": "{{tool}} via LI.FI",
     "stepSwap": "Échanger",
     "stepSwapAndBridge": "Échange et Bridge",
+    "stepSwapAndBuy": "Échanger et acheter",
     "success": {
       "message": {
         "swapPartiallySuccessful": "Nous avons essayé de compléter l'échange, mais {{tool}} a manqué de liquidité pour le jeton {{tokenSymbol}}.",
+        "purchaseSuccessful": "Vous possédez maintenant {{assetName}} dans le portefeuille {{walletAddress}} sur la chaîne {{chainName}}.",
         "swapSuccessful": "Il y a maintenant {{amount, number(maximumFractionDigits: 4)}} {{tokenSymbol}} dans le portefeuille {{walletAddress}} sur la chaîne {{chainName}}."
       },
       "title": {
         "gasSwapSuccessful": "Échange de gaz réussi",
+        "purchaseSuccessful": "Achat effectué",
         "refundIssued": "Remboursement émis",
         "swapPartiallySuccessful": "Échange partiellement réussi",
         "swapSuccessful": "Échange réussi"
@@ -203,7 +219,7 @@
     "to": "À",
     "tokenOnChain": "{{tokenSymbol}} sur {{chainName}}",
     "tokenOnChainAmount": "{{amount, number(maximumFractionDigits: 4)}} {{tokenSymbol}} sur {{chainName}}",
-    "tokenSearch": "Recherchez votre jeton",
+    "tokenSearch": "Recherche par nom de jeton ou adresse",
     "valueLoss": "Perte de valeur",
     "walletAddressOrEns": "Adresse du portefeuille ou nom ENS",
     "warning": {
@@ -237,6 +253,7 @@
     },
     "numberOfSteps": "Un certain nombre d'étapes d'échange. Chaque étape peut contenir 1 à 2 transactions nécessitant une signature.",
     "progressToNextUpdate": "Les données affichées seront automatiquement actualisées après {{value}} secondes. Cliquez ici pour les mettre à jour manuellement.",
+    "recommended": "Une voie bon marché qui équilibre complexité et facilité d'utilisation.",
     "settingsModified": "Paramètres (modifiés)"
   },
   "wallet": {

package/cjs/i18n/ko.json

@@ -1,6 +1,8 @@
 {
   "button": {
     "auto": "자동",
+    "buy": "매수",
+    "buyNow": "즉시 매수",
     "cancel": "취소",
     "connectWallet": "지갑 연결",
     "contactSupport": "고객 지원",
@@ -23,6 +25,7 @@
     "resetSettings": "설정 초기화",
     "restartSwap": "스왑 재시작",
     "reviewGasSwap": "가스 스왑 검토",
+    "reviewPurchase": "매수 검토",
     "reviewSwap": "스왑 검토",
     "seeDetails": "자세히 보기",
     "showAll": "모두 보기",
@@ -39,10 +42,14 @@
   },
   "header": {
     "activeSwaps": "활성화된 스왑",
+    "bridge": "브릿지",
     "checkout": "주문",
     "from": "다음에서 스왑",
     "gas": "가스",
     "gasSwap": "가스 스왑",
+    "payWith": "결제 수단",
+    "purchase": "구입",
+    "purchaseDetails": "주문 세부사항",
     "routes": "받는 수량",
     "selectChain": "체인 선택",
     "selectWallet": "지갑 선택",
@@ -75,6 +82,8 @@
     "currentAmount": "현재 수량",
     "error": {
       "message": {
+        "allowanceRequired": "{{tokenSymbol}} 이체 금액이 한도를 초과했습니다. 한도를 증액한 뒤 다시 시도해주십시오.",
+        "insufficientFunds": "트랜잭션에 필요한 가스비가 부족합니다.",
         "slippageThreshold": "슬리피지가 한계점보다 큽니다. 새로운 견적을 얻기 위해 새 경로를 요청하십시오.",
         "transactionFailed": "자세한 정보는 블록 탐색기에서 확인하세요.",
         "transactionNotSent": "트랜잭션 전송에 실패했습니다. {{chainName}}의 {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}이 지갑에 남아있습니다.",
@@ -82,10 +91,12 @@
         "unknown": "다시 시도하거나 고객 센터에 문의하십시오."
       },
       "title": {
+        "allowanceRequired": "한도 부족",
         "balanceIsTooLow": "잔액이 부족합니다.",
         "chainSwitch": "체인을 변경하십시오",
         "failed": "스왑에 실패하였습니다",
         "gasLimitIsTooLow": "가스 한도가 너무 낮습니다",
+        "insufficientFunds": "잔고 부족",
         "slippageNotMet": "슬리피지 조건을 충족하지 못했습니다.",
         "transactionCanceled": "거래가 취소되었습니다",
         "transactionFailed": "거래가 실패하였습니다",
@@ -108,8 +119,8 @@
     "inProgress": "진행 중",
     "insurance": {
       "bridgeExploits": "브릿지 오류, 해킹, 취약점 공격",
-      "insure": "토큰 전액에 대하여 보험 적용",
-      "insured": "토큰 전액에 대하여 보험을 적용하였습니다.",
+      "insure": "브릿지 중인 <strong>{{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}</strong> 보험 적용",
+      "insured": "브릿지 중인 <strong>{{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}</strong> 보험 적용 완료",
       "slippageError": "받을 토큰의 슬리피지 오류가 발생했습니다."
     },
     "info": {
@@ -131,7 +142,6 @@
     "onChain": "{{chainName}} 에서",
     "otherTokens": "다른 토큰",
     "ownedBy": "소유자: ",
-    "payWith": "지불 수단",
     "process": {
       "crossChain": {
         "actionRequired": "트랜잭션을 서명하십시오.",
@@ -139,6 +149,9 @@
         "pending": "브릿지 트랜잭션 대기 중",
         "started": "브릿지 트랜잭션 준비 중"
       },
+      "nft": {
+        "done": "NFT 구입 성공"
+      },
       "receivingChain": {
         "done": "브릿지 완료",
         "partial": "브릿지 부분 완료",
@@ -165,24 +178,27 @@
     "rateChange": "비율 변경",
     "receiving": "받는 중",
     "refuelStepDetails": "{{tool}} 를 통해 가스 얻기",
-    "routes": "받는 수량",
-    "selectChain": "체인",
+    "selectChain": "체인 선택",
     "selectChainAndToken": "체인과 토큰 선택",
-    "selectToken": "토큰",
+    "selectToken": "토큰 선택",
     "sendToAddress": "{{address}}로 전송",
     "sendToWallet": "다른 지갑으로 전송",
     "sentToAddress": "{{address}}로 전송",
     "stepBridge": "브릿지",
+    "stepBridgeAndBuy": "브릿지 그리고 매수",
     "stepDetails": "LI.FI 를 통한 {{tool}}",
     "stepSwap": "스왑",
     "stepSwapAndBridge": "스왑 그리고 브릿지",
+    "stepSwapAndBuy": "스왑 그리고 매수",
     "success": {
       "message": {
         "swapPartiallySuccessful": "스왑을 시도했지만, {{tokenSymbol}} 토큰에 대한 {{tool}}의 유동성이 부족합니다.",
+        "purchaseSuccessful": "{{walletAddress}} 지갑의 {{chainName}} 체인에 {{assetName}} 을 획득하셨습니다.",
         "swapSuccessful": "{{walletAddress}} 지갑의 {{chainName}} 체인에 {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}이(가) 있습니다."
       },
       "title": {
         "gasSwapSuccessful": "가스 스왑 성공",
+        "purchaseSuccessful": "구입 성공",
         "refundIssued": "환불되었습니다",
         "swapPartiallySuccessful": "부분 스왑 성공",
         "swapSuccessful": "스왑 성공"
@@ -203,7 +219,7 @@
     "to": "도착",
     "tokenOnChain": "{{chainName}}의 {{tokenSymbol}}",
     "tokenOnChainAmount": "{{chainName}}의 {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}",
-    "tokenSearch": "토큰 검색",
+    "tokenSearch": "이름 또는 컨트랙트 주소를 통해 검색",
     "valueLoss": "가치 손실",
     "walletAddressOrEns": "지갑 주소 또는 ENS",
     "warning": {
@@ -237,6 +253,7 @@
     },
     "numberOfSteps": "여러 스왑 단계. 각 단계 진행을 위해서는 1-2개의 트랜잭션 서명이 필요할 수 있습니다.",
     "progressToNextUpdate": "표시된 데이터가 {{value}} 초 후에 자동 새로고침 됩니다. 수동으로 업데이트 하려면 여기를 클릭하십시오.",
+    "recommended": "편리성과 복잡성에 균형을 둔 저렴한 루트",
     "settingsModified": "설정 (수정됨)"
   },
   "wallet": {