@lifi/widget 4.0.0-beta.0 → 4.0.0-beta.10

package/dist/esm/utils/fees.d.ts

@@ -1,13 +0,0 @@
-import type { RouteExtended, Token } from '@lifi/sdk';
-export interface FeesBreakdown {
-    amount: bigint;
-    amountUSD: number;
-    token: Token;
-}
-export declare const getAccumulatedFeeCostsBreakdown: (route: RouteExtended, included?: boolean) => {
-    gasCosts: FeesBreakdown[];
-    feeCosts: FeesBreakdown[];
-    gasCostUSD: number;
-    feeCostUSD: number;
-    combinedFeesUSD: number;
-};

package/dist/esm/utils/format.test.d.ts

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

package/dist/esm/utils/format.test.js

@@ -1,47 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import { formatInputAmount } from './format.js';
-describe('formatInputAmount', () => {
-    it('should handle empty input', () => {
-        expect(formatInputAmount('')).toBe('');
-    });
-    it('should handle whitespace input', () => {
-        expect(formatInputAmount('   ')).toBe('');
-    });
-    it('should limit decimals', () => {
-        expect(formatInputAmount('123.456789', 2, true)).toBe('123.45');
-        expect(formatInputAmount('123.456789', 2, false)).toBe('123.45');
-    });
-    it('should handle leading and trailing zeros', () => {
-        expect(formatInputAmount('00123', 2, true)).toBe('00123');
-        expect(formatInputAmount('00123', 2, false)).toBe('123');
-        expect(formatInputAmount('123.45000', 6, true)).toBe('123.45000');
-        expect(formatInputAmount('123.45000', 6, false)).toBe('123.45');
-    });
-    it('should handle invalid input', () => {
-        expect(formatInputAmount('abc')).toBe('');
-        expect(formatInputAmount('-')).toBe('');
-        expect(formatInputAmount('123.456789abc', 2, true)).toBe('123.45');
-        expect(formatInputAmount('123.456789abc', 2, false)).toBe('123.45');
-    });
-    it('should normalize input (trim, commas, multiple dots)', () => {
-        expect(formatInputAmount('  1,23  ', null, true)).toBe('1.23');
-        expect(formatInputAmount('  1,23  ', null, false)).toBe('1.23');
-        expect(formatInputAmount('1.2.3', null, true)).toBe('1.23');
-        expect(formatInputAmount('1.2.3', null, false)).toBe('1.23');
-        expect(formatInputAmount('..5', null, true)).toBe('.5');
-        expect(formatInputAmount('..5', null, false)).toBe('0.5');
-    });
-    it('should handle zero input', () => {
-        expect(formatInputAmount('0', null, true)).toBe('0');
-        expect(formatInputAmount('00', null, true)).toBe('00');
-        expect(formatInputAmount('0.00', 2, true)).toBe('0.00');
-        expect(formatInputAmount('.0', 2, true)).toBe('.0');
-        expect(formatInputAmount('0..', 2, true)).toBe('0.');
-        expect(formatInputAmount('0', null, false)).toBe('');
-        expect(formatInputAmount('00', null, false)).toBe('');
-        expect(formatInputAmount('0.00', 2, false)).toBe('');
-        expect(formatInputAmount('.0', 2, false)).toBe('');
-        expect(formatInputAmount('0..', 2, false)).toBe('');
-    });
-});
-//# sourceMappingURL=format.test.js.map

package/dist/esm/utils/format.test.js.map

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

package/dist/esm/utils/getActionMessage.d.ts

@@ -1,7 +0,0 @@
-import type { ExecutionActionStatus, ExecutionActionType, LiFiStepExtended, Substatus } from '@lifi/sdk';
-import type { TFunction } from 'i18next';
-import type { SubvariantOptions, WidgetSubvariant } from '../types/widget';
-export declare function getActionMessage(t: TFunction, step: LiFiStepExtended, type: ExecutionActionType, status: ExecutionActionStatus, substatus?: Substatus, subvariant?: WidgetSubvariant, subvariantOptions?: SubvariantOptions): {
-    title?: string;
-    message?: string;
-};

package/dist/esm/utils/getErrorMessage.d.ts

@@ -1,6 +0,0 @@
-import { type EVMChain, type ExecutionAction, type LiFiStepExtended } from '@lifi/sdk';
-import type { TFunction } from 'i18next';
-export declare function getErrorMessage(t: TFunction, getChainById: (chainId: number) => EVMChain | undefined, step: LiFiStepExtended, failedAction?: ExecutionAction): {
-    title: string;
-    message: string;
-};

package/dist/esm/utils/input.d.ts

@@ -1 +0,0 @@
-export declare const fitInputText: (maxFontSize: number, minFontSize: number, element: HTMLElement) => void;

package/dist/esm/utils/item.d.ts

@@ -1,6 +0,0 @@
-import type { FormType } from '../stores/form/types.js';
-import type { AllowDeny, AllowDenyItems, AllowDenySet, AllowDenySetItem, AllowDenySets } from '../types/widget.js';
-export declare const isItemAllowed: <T>(item: T, items: AllowDeny<T> | undefined) => boolean;
-export declare const isItemAllowedForSets: <T>(item: T, items: AllowDenySet | undefined, getKey?: (item: T) => AllowDenySetItem) => boolean;
-export declare const getConfigItemSets: <T>(items: AllowDenyItems<T> | undefined, getSet: (items: T[]) => Set<AllowDenySetItem>, formType?: FormType) => AllowDenySets | undefined;
-export declare const isFormItemAllowed: <T>(item: T, configTokens: AllowDenySets | undefined, formType?: FormType, getKey?: (item: T) => AllowDenySetItem) => boolean;

package/dist/esm/utils/prepareActions.d.ts

@@ -1,2 +0,0 @@
-import type { ExecutionAction } from '@lifi/sdk';
-export declare function prepareActions(actions: ExecutionAction[]): ExecutionAction[][];

package/dist/esm/utils/queries.d.ts

@@ -1 +0,0 @@
-export declare const getQueryKey: (key: string, prefix?: string) => string;

package/dist/esm/utils/timer.d.ts

@@ -1,7 +0,0 @@
-export declare const formatTimer: ({ days, hours, minutes, seconds, locale, }: {
-    days?: number;
-    hours?: number;
-    minutes?: number;
-    seconds?: number;
-    locale?: string;
-}) => string;

package/dist/esm/utils/token.d.ts

@@ -1,19 +0,0 @@
-import type { Token, TokenExtended } from '@lifi/sdk';
-import type { FormType } from '../stores/form/types.js';
-import type { TokensByChain } from '../types/token.js';
-import type { WidgetChains, WidgetTokens } from '../types/widget.js';
-/**
- * Merges verified tokens with search tokens.
- * Verified tokens take priority - search tokens are only added if they don't already exist.
- */
-export declare const mergeVerifiedWithSearchTokens: (verifiedTokens?: TokensByChain, searchTokens?: TokensByChain) => TokensByChain | undefined;
-/**
- * Updates a token in the cache by chainId and address.
- * Returns a new cache object with the token updated, or the original if not found.
- */
-export declare const updateTokenInCache: (data: TokensByChain | undefined, token: Token) => TokensByChain | undefined;
-export declare const filterAllowedTokens: (dataTokens: {
-    [chainId: number]: TokenExtended[];
-} | undefined, configTokens?: WidgetTokens, chainsConfig?: WidgetChains, formType?: FormType) => {
-    [chainId: number]: TokenExtended[];
-} | undefined;

package/dist/esm/utils/tokenList.d.ts

@@ -1,10 +0,0 @@
-import { type TokenExtended, type WalletTokenExtended } from '@lifi/sdk';
-import type { TokenAmount, TokenAmountExtended } from '../types/token.js';
-import type { WidgetTokens } from '../types/widget.js';
-export declare const processTokenBalances: (isBalanceLoading: boolean, noCategories: boolean, configTokens?: WidgetTokens, selectedChainId?: number, tokens?: TokenExtended[], tokensWithBalances?: TokenAmount[], isPinnedToken?: (chainId: number, tokenAddress: string) => boolean) => {
-    processedTokens: (TokenAmount | TokenExtended)[];
-    withCategories: boolean;
-    withPinnedTokens: boolean;
-};
-export declare const isSearchMatch: (token: TokenExtended | TokenAmountExtended, search?: string) => boolean;
-export declare const isSupportedToken: (token: WalletTokenExtended) => "" | import("@lifi/sdk").ChainId;

package/dist/esm/utils/variant.d.ts

@@ -1,2 +0,0 @@
-import type { SplitSubvariant, SplitSubvariantOptions } from '../types/widget.js';
-export declare const getSplitSubvariant: (split?: SplitSubvariant | SplitSubvariantOptions) => SplitSubvariant;

package/dist/esm/utils/wallet.d.ts

@@ -1 +0,0 @@
-export declare const shortenAddress: (address?: string) => string | null;

package/dist/esm/utils/widgetSize.d.ts

@@ -1,3 +0,0 @@
-import type { Theme } from '@mui/material';
-import type { WidgetTheme } from '../types/widget.js';
-export declare const getWidgetMaxHeight: (theme: Theme | WidgetTheme | undefined) => number | string;

package/src/components/ActiveTransactions/ActiveTransactionItem.tsx

@@ -1,112 +0,0 @@
-import ArrowForward from '@mui/icons-material/ArrowForward'
-import ErrorRounded from '@mui/icons-material/ErrorRounded'
-import InfoRounded from '@mui/icons-material/InfoRounded'
-import { ListItemAvatar, ListItemText, Typography } from '@mui/material'
-import { useNavigate } from '@tanstack/react-router'
-import { useActionMessage } from '../../hooks/useActionMessage.js'
-import { useRouteExecution } from '../../hooks/useRouteExecution.js'
-import { RouteExecutionStatus } from '../../stores/routes/types.js'
-import { navigationRoutes } from '../../utils/navigationRoutes.js'
-import { TokenAvatarGroup } from '../Avatar/Avatar.style.js'
-import { TokenAvatar } from '../Avatar/TokenAvatar.js'
-import { StepTimer } from '../Timer/StepTimer.js'
-import { ListItem, ListItemButton } from './ActiveTransactions.style.js'
-
-export const ActiveTransactionItem: React.FC<{
-  routeId: string
-  dense?: boolean
-}> = ({ routeId, dense }) => {
-  const navigate = useNavigate()
-  const { route, status } = useRouteExecution({
-    routeId,
-    executeInBackground: true,
-  })
-
-  const lastActiveStep = route?.steps.findLast((step) => step.execution)
-  const lastActiveAction = lastActiveStep?.execution?.actions?.at(-1)
-
-  const { title } = useActionMessage(lastActiveStep, lastActiveAction)
-
-  if (!route || !lastActiveStep) {
-    return null
-  }
-
-  const handleClick = () => {
-    navigate({
-      to: navigationRoutes.transactionExecution,
-      search: { routeId },
-    })
-  }
-
-  const getStatusComponent = () => {
-    switch (lastActiveAction?.status) {
-      case 'ACTION_REQUIRED':
-      case 'MESSAGE_REQUIRED':
-      case 'RESET_REQUIRED':
-        return <InfoRounded color="info" fontSize="small" />
-      case 'FAILED':
-        return <ErrorRounded color="error" fontSize="small" />
-      default:
-        return (
-          <Typography
-            sx={{
-              fontSize: 14,
-              fontWeight: 600,
-            }}
-          >
-            <StepTimer step={lastActiveStep} hideInProgress />
-          </Typography>
-        )
-    }
-  }
-
-  const ListItemComponent = dense ? ListItem : ListItemButton
-
-  return (
-    <ListItemComponent onClick={handleClick} dense disableRipple={dense}>
-      <ListItemAvatar>
-        <TokenAvatarGroup total={2}>
-          <TokenAvatar token={route.fromToken} />
-          <TokenAvatar token={route.toToken} />
-        </TokenAvatarGroup>
-      </ListItemAvatar>
-      <ListItemText
-        sx={{ margin: 0 }}
-        disableTypography
-        primary={
-          <Typography
-            sx={{
-              fontWeight: 500,
-              lineHeight: 1,
-              display: 'flex',
-              alignItems: 'center',
-              marginLeft: 2,
-              height: 16,
-            }}
-          >
-            {route.fromToken.symbol}
-            <ArrowForward sx={{ paddingX: 0.5 }} />
-            {route.toToken.symbol}
-          </Typography>
-        }
-        secondary={
-          status !== RouteExecutionStatus.Done ? (
-            <Typography
-              sx={{
-                fontWeight: 400,
-                fontSize: 12,
-                color: 'text.secondary',
-                lineHeight: 1,
-                mt: 0.75,
-                ml: 2,
-              }}
-            >
-              {title}
-            </Typography>
-          ) : null
-        }
-      />
-      {getStatusComponent()}
-    </ListItemComponent>
-  )
-}

package/src/components/ActiveTransactions/ActiveTransactions.style.ts

@@ -1,28 +0,0 @@
-import {
-  listItemSecondaryActionClasses,
-  ListItem as MuiListItem,
-  ListItemButton as MuiListItemButton,
-  styled,
-} from '@mui/material'
-
-export const ListItemButton = styled(MuiListItemButton)(({ theme }) => ({
-  borderRadius: theme.vars.shape.borderRadius,
-  paddingLeft: theme.spacing(1.5),
-  paddingRight: theme.spacing(1.5),
-  height: 64,
-  '&:hover': {
-    backgroundColor: `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.04)`,
-  },
-}))
-
-export const ListItem = styled(MuiListItem, {
-  shouldForwardProp: (prop) => prop !== 'disableRipple',
-})(({ theme }) => ({
-  padding: theme.spacing(0),
-  [`.${listItemSecondaryActionClasses.root}`]: {
-    right: theme.spacing(3),
-  },
-  '&:hover': {
-    cursor: 'pointer',
-  },
-}))

package/src/components/ActiveTransactions/ActiveTransactions.tsx

@@ -1,47 +0,0 @@
-import type { CardProps } from '@mui/material'
-import { Stack } from '@mui/material'
-import { useNavigate } from '@tanstack/react-router'
-import { useTranslation } from 'react-i18next'
-import { useExecutingRoutesIds } from '../../stores/routes/useExecutingRoutesIds.js'
-import { navigationRoutes } from '../../utils/navigationRoutes.js'
-import { ButtonTertiary } from '../ButtonTertiary.js'
-import { Card } from '../Card/Card.js'
-import { CardTitle } from '../Card/CardTitle.js'
-import { ActiveTransactionItem } from './ActiveTransactionItem.js'
-
-export const ActiveTransactions: React.FC<CardProps> = (props) => {
-  const { t } = useTranslation()
-  const navigate = useNavigate()
-  const executingRoutes = useExecutingRoutesIds()
-
-  if (!executingRoutes?.length) {
-    return null
-  }
-
-  const handleShowAll = () => {
-    navigate({ to: navigationRoutes.activeTransactions })
-  }
-
-  const hasShowAll = executingRoutes?.length > 2
-
-  return (
-    <Card type="selected" selectionColor="secondary" {...props}>
-      <CardTitle>{t('header.activeTransactions')}</CardTitle>
-      <Stack spacing={1.5} sx={{ m: 2 }}>
-        {executingRoutes.slice(0, 2).map((routeId) => (
-          <ActiveTransactionItem key={routeId} routeId={routeId} dense />
-        ))}
-        {hasShowAll ? (
-          <ButtonTertiary
-            variant="text"
-            onClick={handleShowAll}
-            disableRipple
-            fullWidth
-          >
-            {t('button.showAll')}
-          </ButtonTertiary>
-        ) : null}
-      </Stack>
-    </Card>
-  )
-}

package/src/components/AmountInput/AmountInputAdornment.style.tsx

@@ -1,69 +0,0 @@
-import { Box, styled } from '@mui/material'
-import { cardClasses } from '@mui/material/Card'
-import { ButtonTertiary } from '../ButtonTertiary.js'
-
-export const ButtonContainer = styled(Box)(({ theme }) => ({
-  display: 'flex',
-  gap: theme.spacing(0.5),
-}))
-
-export const MaxButton = styled(ButtonTertiary)(({ theme }) => ({
-  padding: theme.spacing(0.5, 1, 0.5, 1),
-  margin: theme.spacing(0, 0, 0, 0.5),
-  lineHeight: 1,
-  fontSize: '0.75rem',
-  minWidth: 'unset',
-  height: 24,
-  opacity: 0,
-  transform: 'scale(0.85) translateY(-10px)',
-  transition:
-    'opacity 200ms cubic-bezier(0.4, 0, 0.2, 1), transform 200ms cubic-bezier(0.4, 0, 0.2, 1)',
-  '&[data-delay="0"]': {
-    [`.${cardClasses.root}:hover &`]: {
-      opacity: 1,
-      transform: 'scale(1) translateY(0)',
-      transitionDelay: '75ms',
-    },
-    [`.${cardClasses.root}:not(:hover) &`]: {
-      opacity: 0,
-      transform: 'scale(0.85) translateY(-10px)',
-      transitionDelay: '0ms',
-    },
-  },
-  '&[data-delay="1"]': {
-    [`.${cardClasses.root}:hover &`]: {
-      opacity: 1,
-      transform: 'scale(1) translateY(0)',
-      transitionDelay: '50ms',
-    },
-    [`.${cardClasses.root}:not(:hover) &`]: {
-      opacity: 0,
-      transform: 'scale(0.85) translateY(-10px)',
-      transitionDelay: '25ms',
-    },
-  },
-  '&[data-delay="2"]': {
-    [`.${cardClasses.root}:hover &`]: {
-      opacity: 1,
-      transform: 'scale(1) translateY(0)',
-      transitionDelay: '25ms',
-    },
-    [`.${cardClasses.root}:not(:hover) &`]: {
-      opacity: 0,
-      transform: 'scale(0.85) translateY(-10px)',
-      transitionDelay: '50ms',
-    },
-  },
-  '&[data-delay="3"]': {
-    [`.${cardClasses.root}:hover &`]: {
-      opacity: 1,
-      transform: 'scale(1) translateY(0)',
-      transitionDelay: '0ms',
-    },
-    [`.${cardClasses.root}:not(:hover) &`]: {
-      opacity: 0,
-      transform: 'scale(0.85) translateY(-10px)',
-      transitionDelay: '75ms',
-    },
-  },
-}))

package/src/components/Header/TransactionHistoryButton.tsx

@@ -1,21 +0,0 @@
-import ReceiptLong from '@mui/icons-material/ReceiptLong'
-import { IconButton, Tooltip } from '@mui/material'
-import { useNavigate } from '@tanstack/react-router'
-import { useTranslation } from 'react-i18next'
-import { navigationRoutes } from '../../utils/navigationRoutes.js'
-
-export const TransactionHistoryButton = () => {
-  const { t } = useTranslation()
-  const navigate = useNavigate()
-
-  return (
-    <Tooltip title={t('header.transactionHistory')}>
-      <IconButton
-        size="medium"
-        onClick={() => navigate({ to: navigationRoutes.transactionHistory })}
-      >
-        <ReceiptLong />
-      </IconButton>
-    </Tooltip>
-  )
-}

package/src/components/Messages/ToAddressRequiredMessage.tsx

@@ -1,27 +0,0 @@
-import Wallet from '@mui/icons-material/Wallet'
-import type { BoxProps } from '@mui/material'
-import { Typography } from '@mui/material'
-import { useTranslation } from 'react-i18next'
-import { AlertMessage } from './AlertMessage.js'
-
-export const ToAddressRequiredMessage: React.FC<BoxProps> = ({ ...props }) => {
-  const { t } = useTranslation()
-  return (
-    <AlertMessage
-      title={
-        <Typography
-          variant="body2"
-          sx={{
-            px: 1,
-            color: 'text.primary',
-          }}
-        >
-          {t('info.message.toAddressIsRequired')}
-        </Typography>
-      }
-      icon={<Wallet />}
-      multiline
-      {...props}
-    />
-  )
-}

package/src/components/RouteCard/RouteCard.style.ts

@@ -1,8 +0,0 @@
-import { Box, styled } from '@mui/material'
-
-export const TokenContainer = styled(Box)(() => ({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'space-between',
-  height: 40,
-}))

package/src/components/RouteCard/RouteCardEssentialsExpanded.tsx

@@ -1,57 +0,0 @@
-import Layers from '@mui/icons-material/Layers'
-import { Box, Typography } from '@mui/material'
-import { useTranslation } from 'react-i18next'
-import { IconTypography } from '../IconTypography.js'
-import type { RouteCardEssentialsProps } from './types.js'
-
-export const RouteCardEssentialsExpanded: React.FC<
-  RouteCardEssentialsProps
-> = ({ route }) => {
-  const { t } = useTranslation()
-  return (
-    <Box
-      sx={{
-        flex: 1,
-        mt: 2,
-      }}
-    >
-      <Box
-        sx={{
-          display: 'flex',
-          alignItems: 'center',
-        }}
-      >
-        <IconTypography ml={1} mr={3}>
-          <Layers />
-        </IconTypography>
-        <Typography
-          sx={{
-            fontSize: 16,
-            color: 'text.primary',
-            fontWeight: '600',
-            lineHeight: 1.125,
-          }}
-        >
-          {route.steps.length}
-        </Typography>
-      </Box>
-      <Box
-        sx={{
-          mt: 0.5,
-          ml: 7,
-        }}
-      >
-        <Typography
-          sx={{
-            fontSize: 12,
-            color: 'text.secondary',
-            fontWeight: '500',
-            lineHeight: 1.125,
-          }}
-        >
-          {t('tooltip.numberOfSteps')}
-        </Typography>
-      </Box>
-    </Box>
-  )
-}

package/src/pages/ActiveTransactionsPage/ActiveTransactionsEmpty.tsx

@@ -1,45 +0,0 @@
-import SwapHoriz from '@mui/icons-material/SwapHoriz'
-import { Container, Typography } from '@mui/material'
-import { useTranslation } from 'react-i18next'
-
-export const ActiveTransactionsEmpty: React.FC = () => {
-  const { t } = useTranslation()
-  return (
-    <Container
-      sx={{
-        display: 'flex',
-        flex: 1,
-        flexDirection: 'column',
-        alignItems: 'center',
-        justifyContent: 'center',
-        paddingY: 12,
-      }}
-    >
-      <Typography
-        sx={{
-          fontSize: 48,
-        }}
-      >
-        <SwapHoriz fontSize="inherit" />
-      </Typography>
-      <Typography
-        sx={{
-          fontSize: 18,
-          fontWeight: 700,
-        }}
-      >
-        {t('info.title.emptyActiveTransactions')}
-      </Typography>
-      <Typography
-        sx={{
-          fontSize: 14,
-          color: 'text.secondary',
-          textAlign: 'center',
-          mt: 2,
-        }}
-      >
-        {t('info.message.emptyActiveTransactions')}
-      </Typography>
-    </Container>
-  )
-}