npm - @lifi/widget - Versions diffs - 4.0.0-beta.17 → 4.0.0-beta.19 - Mend

@lifi/widget 4.0.0-beta.17 → 4.0.0-beta.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (327) hide show

package/dist/esm/components/Routes/Routes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Routes.js","names":["Card"],"sources":["../../../../src/components/Routes/Routes.tsx"],"sourcesContent":["import { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ButtonTertiary } from '../ButtonTertiary.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\n\nexport const Routes: React.FC<CardProps> = (props) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { subvariant, subvariantOptions, useRecommendedRoute } =\n useWidgetConfig()\n const {\n routes,\n isLoading,\n isFetching,\n isFetched,\n dataUpdatedAt,\n refetchTime,\n refetch,\n } = useRoutes()\n\n const currentRoute = routes?.[0]\n\n if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n return null\n }\n\n const handleCardClick = () => {\n navigate({ to: navigationRoutes.routes })\n }\n\n const routeNotFound = !currentRoute && !isLoading && !isFetching\n const onlyRecommendedRoute = subvariant === 'refuel' \|\| useRecommendedRoute\n const showAll =\n !onlyRecommendedRoute && !routeNotFound && (routes?.length ?? 0) > 1\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.receive')\n : t('header.youPay')\n : t('header.receive')\n\n return (\n <Card {...props}>\n <CardTitle>{title}</CardTitle>\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt \|\| Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={() => refetch()}\n sx={{\n position: 'absolute',\n top: 8,\n right: 8,\n }}\n />\n <Box\n sx={{\n p: 2,\n }}\n >\n {isLoading && !currentRoute ? (\n <RouteCardSkeleton variant=\"cardless\" />\n ) : !currentRoute ? (\n <RouteNotFoundCard />\n ) : (\n <RouteCard route={currentRoute} variant=\"cardless\" active />\n )}\n\n <Collapse timeout={225} in={showAll} unmountOnExit mountOnEnter>\n <Box\n sx={{\n mt: 2,\n }}\n >\n <ButtonTertiary onClick={handleCardClick} fullWidth>\n {t('button.showAll')}\n </ButtonTertiary>\n </Box>\n </Collapse>\n </Box>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,UAA+B,UAAU;CACpD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,YAAY,mBAAmB,wBACrC,iBAAiB;CACnB,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,YACE,WAAW;CAEf,MAAM,eAAe,SAAS;~~AAE9B~~,~~KAAI~~,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,~~UACjD~~,~~QAAO~~;CAGT,MAAM,wBAAwB;~~AAC5B~~,~~WAAS~~,EAAE,IAAI,iBAAiB,QAAQ,CAAC;;CAK3C,MAAM,UACJ,EAF2B,eAAe,YAAY,wBAE7B,EAHL,CAAC,gBAAgB,CAAC,aAAa,CAAC,gBAGR,QAAQ,UAAU,KAAK;CAErE,MAAM,QACJ,eAAe,WACX,mBAAmB,WAAW,YAC5B,EAAE,iBAAiB,GACnB,EAAE,gBAAgB,GACpB,EAAE,iBAAiB;~~AAEzB~~,~~QACE~~,qBAACA,QAAD;EAAM,GAAI;YAAV;GACE,oBAAC,WAAD,EAAA,UAAY,OAAkB,CAAA;GAC9B,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,KAAK;IACtC,cAAc;IACd,WAAW;IACX,eAAe,SAAS;IACxB,IAAI;KACF,UAAU;KACV,KAAK;KACL,OAAO;KACR;IACD,CAAA;GACF,qBAAC,KAAD;IACE,IAAI,EACF,GAAG,GACJ;cAHH,CAKG,aAAa,CAAC,eACb,oBAAC,mBAAD,EAAmB,SAAQ,YAAa,CAAA,GACtC,CAAC,eACH,oBAAC,mBAAD,EAAqB,CAAA,GAErB,oBAAC,WAAD;KAAW,OAAO;KAAc,SAAQ;KAAW,QAAA;KAAS,CAAA,EAG9D,oBAAC,UAAD;KAAU,SAAS;KAAK,IAAI;KAAS,eAAA;KAAc,cAAA;eACjD,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,GACL;gBAED,oBAAC,gBAAD;OAAgB,SAAS;OAAiB,WAAA;iBACvC,EAAE,iBAAiB;OACL,CAAA;MACb,CAAA;KACG,CAAA,CACP;;GACD"}
1	+ {"version":3,"file":"Routes.js","names":["Card"],"sources":["../../../../src/components/Routes/Routes.tsx"],"sourcesContent":["import { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ButtonTertiary } from '../ButtonTertiary.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\n\nexport const Routes: React.FC<CardProps> = (props) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { subvariant, subvariantOptions, useRecommendedRoute } =\n useWidgetConfig()\n const {\n routes,\n isLoading,\n isFetching,\n isFetched,\n dataUpdatedAt,\n refetchTime,\n refetch,\n } = useRoutes()\n\n const currentRoute = routes?.[0]\n\n if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n return null\n }\n\n const handleCardClick = () => {\n navigate({ to: navigationRoutes.routes })\n }\n\n const routeNotFound = !currentRoute && !isLoading && !isFetching\n const onlyRecommendedRoute = subvariant === 'refuel' \|\| useRecommendedRoute\n const showAll =\n !onlyRecommendedRoute && !routeNotFound && (routes?.length ?? 0) > 1\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.receive')\n : t('header.youPay')\n : t('header.receive')\n\n return (\n <Card {...props}>\n <CardTitle>{title}</CardTitle>\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt \|\| Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={() => refetch()}\n sx={{\n position: 'absolute',\n top: 8,\n right: 8,\n }}\n />\n <Box\n sx={{\n p: 2,\n }}\n >\n {isLoading && !currentRoute ? (\n <RouteCardSkeleton variant=\"cardless\" />\n ) : !currentRoute ? (\n <RouteNotFoundCard />\n ) : (\n <RouteCard route={currentRoute} variant=\"cardless\" active />\n )}\n\n <Collapse timeout={225} in={showAll} unmountOnExit mountOnEnter>\n <Box\n sx={{\n mt: 2,\n }}\n >\n <ButtonTertiary onClick={handleCardClick} fullWidth>\n {t('button.showAll')}\n </ButtonTertiary>\n </Box>\n </Collapse>\n </Box>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,UAA+B,UAAU;CACpD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,YAAY,mBAAmB,wBACrC,iBAAiB;CACnB,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,YACE,WAAW;CAEf,MAAM,eAAe,SAAS;CAE9B,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,WACjD,OAAO;CAGT,MAAM,wBAAwB;EAC5B,SAAS,EAAE,IAAI,iBAAiB,QAAQ,CAAC;;CAK3C,MAAM,UACJ,EAF2B,eAAe,YAAY,wBAE7B,EAHL,CAAC,gBAAgB,CAAC,aAAa,CAAC,gBAGR,QAAQ,UAAU,KAAK;CAErE,MAAM,QACJ,eAAe,WACX,mBAAmB,WAAW,YAC5B,EAAE,iBAAiB,GACnB,EAAE,gBAAgB,GACpB,EAAE,iBAAiB;CAEzB,OACE,qBAACA,QAAD;EAAM,GAAI;YAAV;GACE,oBAAC,WAAD,EAAA,UAAY,OAAkB,CAAA;GAC9B,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,KAAK;IACtC,cAAc;IACd,WAAW;IACX,eAAe,SAAS;IACxB,IAAI;KACF,UAAU;KACV,KAAK;KACL,OAAO;KACR;IACD,CAAA;GACF,qBAAC,KAAD;IACE,IAAI,EACF,GAAG,GACJ;cAHH,CAKG,aAAa,CAAC,eACb,oBAAC,mBAAD,EAAmB,SAAQ,YAAa,CAAA,GACtC,CAAC,eACH,oBAAC,mBAAD,EAAqB,CAAA,GAErB,oBAAC,WAAD;KAAW,OAAO;KAAc,SAAQ;KAAW,QAAA;KAAS,CAAA,EAG9D,oBAAC,UAAD;KAAU,SAAS;KAAK,IAAI;KAAS,eAAA;KAAc,cAAA;eACjD,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,GACL;gBAED,oBAAC,gBAAD;OAAgB,SAAS;OAAiB,WAAA;iBACvC,EAAE,iBAAiB;OACL,CAAA;MACb,CAAA;KACG,CAAA,CACP;;GACD"}

package/dist/esm/components/Routes/RoutesContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RoutesContent.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesContent.tsx"],"sourcesContent":["import type { ExtendedChain, Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Stack, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { PageContainer } from '../PageContainer.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport { Container, Header } from './RoutesExpanded.style.js'\n\ninterface RoutesContentProps {\n routes?: Route[]\n isFetching: boolean\n isLoading: boolean\n dataUpdatedAt: number\n refetchTime: number\n fromChain: ExtendedChain \| undefined\n refetch: () => void\n onRouteClick: (route: Route) => void\n}\n\nconst headerHeight = '64px'\n\nexport const RoutesContent: React.NamedExoticComponent<RoutesContentProps> =\n memo(function RoutesContent({\n routes,\n isFetching,\n isLoading,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n onRouteClick,\n }: RoutesContentProps) {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n\n const { account } = useAccount({ chainType: fromChain?.chainType })\n const [toAddress] = useFieldValues('toAddress')\n const { requiredToAddress } = useToAddressRequirements()\n\n const currentRoute = routes?.[0]\n\n const routeNotFound = !currentRoute && !isLoading && !isFetching\n const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress\n const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.deposit')\n : t('header.youPay')\n : t('header.receive')\n\n return (\n <Container enableColorScheme minimumHeight={isLoading}>\n <Header sx={{ height: headerHeight }}>\n <Typography\n noWrap\n sx={{\n fontSize: 18,\n fontWeight: '700',\n flex: 1,\n }}\n >\n {title}\n </Typography>\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt \|\| Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={() => refetch()}\n sx={{ marginRight: -1 }}\n />\n </Header>\n <PageContainer\n sx={{ height: `calc(100% - ${headerHeight})`, overflow: 'auto' }}\n >\n <Stack\n direction=\"column\"\n spacing={2}\n sx={{\n flex: 1,\n paddingBottom: 3,\n }}\n >\n {routeNotFound ? (\n <RouteNotFoundCard />\n ) : (isLoading \|\| isFetching) && !routes?.length ? (\n Array.from({ length: 3 }).map((_, index) => (\n <RouteCardSkeleton key={index} />\n ))\n ) : (\n routes?.map((route: Route, index: number) => (\n <RouteCard\n key={index}\n route={route}\n onClick={\n allowInteraction ? () => onRouteClick(route) : undefined\n }\n active={index === 0}\n expanded={routes?.length === 1}\n />\n ))\n )}\n </Stack>\n </PageContainer>\n </Container>\n )\n })\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,MAAM,eAAe;AAErB,MAAa,gBACX,KAAK,SAAS,cAAc,EAC1B,QACA,YACA,WACA,eACA,aACA,WACA,SACA,gBACqB;CACrB,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAE3D,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,WAAW,CAAC;CACnE,MAAM,CAAC,aAAa,eAAe,YAAY;CAC/C,MAAM,EAAE,sBAAsB,0BAA0B;CAExD,MAAM,eAAe,SAAS;CAE9B,MAAM,gBAAgB,CAAC,gBAAgB,CAAC,aAAa,CAAC;CACtD,MAAM,uBAAuB,gBAAgB,qBAAqB,CAAC;CACnE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,MAAM,QACJ,eAAe,WACX,mBAAmB,WAAW,YAC5B,EAAE,iBAAiB,GACnB,EAAE,gBAAgB,GACpB,EAAE,iBAAiB;~~AAEzB~~,~~QACE~~,qBAACA,aAAD;EAAW,mBAAA;EAAkB,eAAe;YAA5C,CACE,qBAAC,QAAD;GAAQ,IAAI,EAAE,QAAQ,cAAc;aAApC,CACE,oBAAC,YAAD;IACE,QAAA;IACA,IAAI;KACF,UAAU;KACV,YAAY;KACZ,MAAM;KACP;cAEA;IACU,CAAA,EACb,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,KAAK;IACtC,cAAc;IACd,WAAW;IACX,eAAe,SAAS;IACxB,IAAI,EAAE,aAAa,IAAI;IACvB,CAAA,CACK;MACT,oBAAC,eAAD;GACE,IAAI;IAAE,QAAQ,eAAe,aAAa;IAAI,UAAU;IAAQ;aAEhE,oBAAC,OAAD;IACE,WAAU;IACV,SAAS;IACT,IAAI;KACF,MAAM;KACN,eAAe;KAChB;cAEA,gBACC,oBAAC,mBAAD,EAAqB,CAAA,IAClB,aAAa,eAAe,CAAC,QAAQ,SACxC,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,EAAiC,EAAT,MAAS,CACjC,GAEF,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;KAES;KACP,SACE,yBAAyB,aAAa,MAAM,GAAG,KAAA;KAEjD,QAAQ,UAAU;KAClB,UAAU,QAAQ,WAAW;KAC7B,EAPK,MAOL,CACF;IAEE,CAAA;GACM,CAAA,CACN;;EAEd"}
1	+ {"version":3,"file":"RoutesContent.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesContent.tsx"],"sourcesContent":["import type { ExtendedChain, Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Stack, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { PageContainer } from '../PageContainer.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport { Container, Header } from './RoutesExpanded.style.js'\n\ninterface RoutesContentProps {\n routes?: Route[]\n isFetching: boolean\n isLoading: boolean\n dataUpdatedAt: number\n refetchTime: number\n fromChain: ExtendedChain \| undefined\n refetch: () => void\n onRouteClick: (route: Route) => void\n}\n\nconst headerHeight = '64px'\n\nexport const RoutesContent: React.NamedExoticComponent<RoutesContentProps> =\n memo(function RoutesContent({\n routes,\n isFetching,\n isLoading,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n onRouteClick,\n }: RoutesContentProps) {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n\n const { account } = useAccount({ chainType: fromChain?.chainType })\n const [toAddress] = useFieldValues('toAddress')\n const { requiredToAddress } = useToAddressRequirements()\n\n const currentRoute = routes?.[0]\n\n const routeNotFound = !currentRoute && !isLoading && !isFetching\n const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress\n const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.deposit')\n : t('header.youPay')\n : t('header.receive')\n\n return (\n <Container enableColorScheme minimumHeight={isLoading}>\n <Header sx={{ height: headerHeight }}>\n <Typography\n noWrap\n sx={{\n fontSize: 18,\n fontWeight: '700',\n flex: 1,\n }}\n >\n {title}\n </Typography>\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt \|\| Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={() => refetch()}\n sx={{ marginRight: -1 }}\n />\n </Header>\n <PageContainer\n sx={{ height: `calc(100% - ${headerHeight})`, overflow: 'auto' }}\n >\n <Stack\n direction=\"column\"\n spacing={2}\n sx={{\n flex: 1,\n paddingBottom: 3,\n }}\n >\n {routeNotFound ? (\n <RouteNotFoundCard />\n ) : (isLoading \|\| isFetching) && !routes?.length ? (\n Array.from({ length: 3 }).map((_, index) => (\n <RouteCardSkeleton key={index} />\n ))\n ) : (\n routes?.map((route: Route, index: number) => (\n <RouteCard\n key={index}\n route={route}\n onClick={\n allowInteraction ? () => onRouteClick(route) : undefined\n }\n active={index === 0}\n expanded={routes?.length === 1}\n />\n ))\n )}\n </Stack>\n </PageContainer>\n </Container>\n )\n })\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,MAAM,eAAe;AAErB,MAAa,gBACX,KAAK,SAAS,cAAc,EAC1B,QACA,YACA,WACA,eACA,aACA,WACA,SACA,gBACqB;CACrB,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAE3D,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,WAAW,CAAC;CACnE,MAAM,CAAC,aAAa,eAAe,YAAY;CAC/C,MAAM,EAAE,sBAAsB,0BAA0B;CAExD,MAAM,eAAe,SAAS;CAE9B,MAAM,gBAAgB,CAAC,gBAAgB,CAAC,aAAa,CAAC;CACtD,MAAM,uBAAuB,gBAAgB,qBAAqB,CAAC;CACnE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,MAAM,QACJ,eAAe,WACX,mBAAmB,WAAW,YAC5B,EAAE,iBAAiB,GACnB,EAAE,gBAAgB,GACpB,EAAE,iBAAiB;CAEzB,OACE,qBAACA,aAAD;EAAW,mBAAA;EAAkB,eAAe;YAA5C,CACE,qBAAC,QAAD;GAAQ,IAAI,EAAE,QAAQ,cAAc;aAApC,CACE,oBAAC,YAAD;IACE,QAAA;IACA,IAAI;KACF,UAAU;KACV,YAAY;KACZ,MAAM;KACP;cAEA;IACU,CAAA,EACb,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,KAAK;IACtC,cAAc;IACd,WAAW;IACX,eAAe,SAAS;IACxB,IAAI,EAAE,aAAa,IAAI;IACvB,CAAA,CACK;MACT,oBAAC,eAAD;GACE,IAAI;IAAE,QAAQ,eAAe,aAAa;IAAI,UAAU;IAAQ;aAEhE,oBAAC,OAAD;IACE,WAAU;IACV,SAAS;IACT,IAAI;KACF,MAAM;KACN,eAAe;KAChB;cAEA,gBACC,oBAAC,mBAAD,EAAqB,CAAA,IAClB,aAAa,eAAe,CAAC,QAAQ,SACxC,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,EAAiC,EAAT,MAAS,CACjC,GAEF,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;KAES;KACP,SACE,yBAAyB,aAAa,MAAM,GAAG,KAAA;KAEjD,QAAQ,UAAU;KAClB,UAAU,QAAQ,WAAW;KAC7B,EAPK,MAOL,CACF;IAEE,CAAA;GACM,CAAA,CACN;;EAEd"}

package/dist/esm/components/Routes/RoutesExpanded.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RoutesExpanded.js","names":[],"sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ExpansionTransition } from '../Expansion/ExpansionTransition.js'\nimport { RoutesContent } from './RoutesContent.js'\nimport { routesExpansionWidth } from './RoutesExpanded.style.js'\n\ninterface RoutesExpandedProps {\n canOpen: boolean\n setOpenExpansion: (open: boolean) => void\n}\n\nexport const RoutesExpanded: React.NamedExoticComponent<RoutesExpandedProps> =\n memo(function RoutesExpanded({\n canOpen,\n setOpenExpansion,\n }: RoutesExpandedProps) {\n const emitter = useWidgetEvents()\n const navigate = useNavigate()\n const routesRef = useRef<Route[]>(undefined)\n const routesActiveRef = useRef(false)\n\n const {\n routes,\n isLoading,\n isFetching,\n isFetched,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n setReviewableRoute,\n } = useRoutes()\n\n const onExit = useCallback(() => {\n // Clean routes cache on exit\n routesRef.current = undefined\n }, [])\n\n // We cache routes results in ref for a better exit animation\n if (routesRef.current && !routes) {\n routesActiveRef.current = false\n // If we are loading routes with a new queryKey, we need to clear the cache\n if (isLoading) {\n routesRef.current = undefined\n }\n } else {\n routesRef.current = routes\n routesActiveRef.current = Boolean(routes)\n }\n\n const expanded =\n Boolean(\n routesActiveRef.current \|\| isLoading \|\| isFetching \|\| isFetched\n ) && canOpen\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: stable navigation callback that won't cause rerenders in RoutesContent\n const onRouteClick = useCallback(\n (route: Route) => {\n setReviewableRoute(route)\n navigate({\n to: navigationRoutes.transactionExecution,\n search: { routeId: route.id },\n })\n emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes! })\n },\n [emitter, routes, setReviewableRoute]\n )\n\n // Use layout effect to update parent's width when expansion changes\n useLayoutEffect(() => {\n setOpenExpansion(expanded)\n }, [expanded, setOpenExpansion])\n\n useEffect(() => {\n emitter.emit(WidgetEvent.WidgetExpanded, expanded)\n }, [emitter, expanded])\n\n return (\n <ExpansionTransition\n in={expanded}\n width={routesExpansionWidth}\n onExited={onExit}\n >\n <RoutesContent\n routes={routesRef.current}\n isFetching={isFetching}\n isLoading={isLoading}\n dataUpdatedAt={dataUpdatedAt}\n refetchTime={refetchTime}\n fromChain={fromChain}\n refetch={refetch}\n onRouteClick={onRouteClick}\n />\n </ExpansionTransition>\n )\n })\n"],"mappings":";;;;;;;;;;;AAiBA,MAAa,iBACX,KAAK,SAAS,eAAe,EAC3B,SACA,oBACsB;CACtB,MAAM,UAAU,iBAAiB;CACjC,MAAM,WAAW,aAAa;CAC9B,MAAM,YAAY,OAAgB,KAAA,EAAU;CAC5C,MAAM,kBAAkB,OAAO,MAAM;CAErC,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,WACA,SACA,uBACE,WAAW;CAEf,MAAM,SAAS,kBAAkB;~~AAE~~/B,~~YAAU~~,UAAU,KAAA;IACnB,EAAE,CAAC;~~AAGN~~,~~KAAI~~,UAAU,WAAW,CAAC,QAAQ;~~AAChC~~,~~kBAAgB~~,UAAU;~~AAE1B~~,~~MAAI~~,~~UACF~~,~~WAAU~~,UAAU,KAAA;QAEjB;~~AACL~~,~~YAAU~~,UAAU;~~AACpB~~,~~kBAAgB~~,UAAU,QAAQ,OAAO;;CAG3C,MAAM,WACJ,QACE,gBAAgB,WAAW,aAAa,cAAc,UACvD,IAAI;CAGP,MAAM,eAAe,aAClB,UAAiB;~~AAChB~~,~~qBAAmB~~,MAAM;~~AACzB~~,~~WAAS~~;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,IAAI;GAC9B,CAAC;~~AACF~~,~~UAAQ~~,KAAA,iBAAgC;GAAE;GAAe;GAAS,CAAC;IAErE;EAAC;EAAS;EAAQ;EAAmB,CACtC;~~AAGD~~,~~uBAAsB~~;~~AACpB~~,~~mBAAiB~~,SAAS;IACzB,CAAC,UAAU,iBAAiB,CAAC;~~AAEhC~~,~~iBAAgB~~;~~AACd~~,~~UAAQ~~,KAAA,kBAAiC,SAAS;IACjD,CAAC,SAAS,SAAS,CAAC;~~AAEvB~~,~~QACE~~,oBAAC,qBAAD;EACE,IAAI;EACJ,OAAO;EACP,UAAU;YAEV,oBAAC,eAAD;GACE,QAAQ,UAAU;GACN;GACD;GACI;GACF;GACF;GACF;GACK;GACd,CAAA;EACkB,CAAA;EAExB"}
1	+ {"version":3,"file":"RoutesExpanded.js","names":[],"sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ExpansionTransition } from '../Expansion/ExpansionTransition.js'\nimport { RoutesContent } from './RoutesContent.js'\nimport { routesExpansionWidth } from './RoutesExpanded.style.js'\n\ninterface RoutesExpandedProps {\n canOpen: boolean\n setOpenExpansion: (open: boolean) => void\n}\n\nexport const RoutesExpanded: React.NamedExoticComponent<RoutesExpandedProps> =\n memo(function RoutesExpanded({\n canOpen,\n setOpenExpansion,\n }: RoutesExpandedProps) {\n const emitter = useWidgetEvents()\n const navigate = useNavigate()\n const routesRef = useRef<Route[]>(undefined)\n const routesActiveRef = useRef(false)\n\n const {\n routes,\n isLoading,\n isFetching,\n isFetched,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n setReviewableRoute,\n } = useRoutes()\n\n const onExit = useCallback(() => {\n // Clean routes cache on exit\n routesRef.current = undefined\n }, [])\n\n // We cache routes results in ref for a better exit animation\n if (routesRef.current && !routes) {\n routesActiveRef.current = false\n // If we are loading routes with a new queryKey, we need to clear the cache\n if (isLoading) {\n routesRef.current = undefined\n }\n } else {\n routesRef.current = routes\n routesActiveRef.current = Boolean(routes)\n }\n\n const expanded =\n Boolean(\n routesActiveRef.current \|\| isLoading \|\| isFetching \|\| isFetched\n ) && canOpen\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: stable navigation callback that won't cause rerenders in RoutesContent\n const onRouteClick = useCallback(\n (route: Route) => {\n setReviewableRoute(route)\n navigate({\n to: navigationRoutes.transactionExecution,\n search: { routeId: route.id },\n })\n emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes! })\n },\n [emitter, routes, setReviewableRoute]\n )\n\n // Use layout effect to update parent's width when expansion changes\n useLayoutEffect(() => {\n setOpenExpansion(expanded)\n }, [expanded, setOpenExpansion])\n\n useEffect(() => {\n emitter.emit(WidgetEvent.WidgetExpanded, expanded)\n }, [emitter, expanded])\n\n return (\n <ExpansionTransition\n in={expanded}\n width={routesExpansionWidth}\n onExited={onExit}\n >\n <RoutesContent\n routes={routesRef.current}\n isFetching={isFetching}\n isLoading={isLoading}\n dataUpdatedAt={dataUpdatedAt}\n refetchTime={refetchTime}\n fromChain={fromChain}\n refetch={refetch}\n onRouteClick={onRouteClick}\n />\n </ExpansionTransition>\n )\n })\n"],"mappings":";;;;;;;;;;;AAiBA,MAAa,iBACX,KAAK,SAAS,eAAe,EAC3B,SACA,oBACsB;CACtB,MAAM,UAAU,iBAAiB;CACjC,MAAM,WAAW,aAAa;CAC9B,MAAM,YAAY,OAAgB,KAAA,EAAU;CAC5C,MAAM,kBAAkB,OAAO,MAAM;CAErC,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,WACA,SACA,uBACE,WAAW;CAEf,MAAM,SAAS,kBAAkB;EAE/B,UAAU,UAAU,KAAA;IACnB,EAAE,CAAC;CAGN,IAAI,UAAU,WAAW,CAAC,QAAQ;EAChC,gBAAgB,UAAU;EAE1B,IAAI,WACF,UAAU,UAAU,KAAA;QAEjB;EACL,UAAU,UAAU;EACpB,gBAAgB,UAAU,QAAQ,OAAO;;CAG3C,MAAM,WACJ,QACE,gBAAgB,WAAW,aAAa,cAAc,UACvD,IAAI;CAGP,MAAM,eAAe,aAClB,UAAiB;EAChB,mBAAmB,MAAM;EACzB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,IAAI;GAC9B,CAAC;EACF,QAAQ,KAAA,iBAAgC;GAAE;GAAe;GAAS,CAAC;IAErE;EAAC;EAAS;EAAQ;EAAmB,CACtC;CAGD,sBAAsB;EACpB,iBAAiB,SAAS;IACzB,CAAC,UAAU,iBAAiB,CAAC;CAEhC,gBAAgB;EACd,QAAQ,KAAA,kBAAiC,SAAS;IACjD,CAAC,SAAS,SAAS,CAAC;CAEvB,OACE,oBAAC,qBAAD;EACE,IAAI;EACJ,OAAO;EACP,UAAU;YAEV,oBAAC,eAAD;GACE,QAAQ,UAAU;GACN;GACD;GACI;GACF;GACF;GACF;GACK;GACd,CAAA;EACkB,CAAA;EAExB"}

package/dist/esm/components/Routes/RoutesExpanded.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RoutesExpanded.style.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesExpanded.style.ts"],"sourcesContent":["import type { ScopedCssBaselineProps } from '@mui/material'\nimport { Box, ScopedCssBaseline, styled } from '@mui/material'\nimport type React from 'react'\nimport { getWidgetMaxHeight } from '../../utils/widgetSize.js'\n\nexport const routesExpansionWidth = '436px'\n\ninterface ContainerProps extends ScopedCssBaselineProps {\n minimumHeight: boolean\n}\n\nexport const Container: React.FC<\n React.ComponentProps<typeof ScopedCssBaseline> & ContainerProps\n> = styled(ScopedCssBaseline, {\n shouldForwardProp: (prop) => !['minimumHeight'].includes(prop as string),\n})<ContainerProps>(({ theme, minimumHeight }) => {\n return {\n ...theme.container,\n backgroundColor: theme.vars.palette.background.default,\n overflow: 'hidden',\n width: routesExpansionWidth,\n display: 'flex',\n flexDirection: 'column',\n whiteSpace: 'normal',\n ...(theme.container?.display !== 'flex'\n ? {\n maxHeight: getWidgetMaxHeight(theme),\n ...(minimumHeight ? { '&': { height: 'auto' } } : {}),\n }\n : { height: minimumHeight ? 'auto' : '100%' }),\n ...theme.routesContainer,\n }\n})\n\nexport const Header: React.FC<React.ComponentProps<typeof Box>> = styled(Box)(\n ({ theme }) => ({\n backgroundColor: theme.vars.palette.background.default,\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n padding: theme.spacing(1.5, 3),\n position: 'sticky',\n top: 0,\n zIndex: 1200,\n })\n)\n"],"mappings":";;;AAKA,MAAa,uBAAuB;AAMpC,MAAaA,cAET,OAAO,mBAAmB,EAC5B,oBAAoB,SAAS,CAAC,CAAC,gBAAgB,CAAC,SAAS,KAAe,EACzE,CAAC,EAAkB,EAAE,OAAO,oBAAoB;~~AAC~~/C,~~QAAO~~;EACL,GAAG,MAAM;EACT,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU;EACV,OAAO;EACP,SAAS;EACT,eAAe;EACf,YAAY;EACZ,GAAI,MAAM,WAAW,YAAY,SAC7B;GACE,WAAW,mBAAmB,MAAM;GACpC,GAAI,gBAAgB,EAAE,KAAK,EAAE,QAAQ,QAAQ,EAAE,GAAG,EAAE;GACrD,GACD,EAAE,QAAQ,gBAAgB,SAAS,QAAQ;EAC/C,GAAG,MAAM;EACV;EACD;AAEF,MAAa,SAAqD,OAAO,IAAI,EAC1E,EAAE,aAAa;CACd,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,SAAS,MAAM,QAAQ,KAAK,EAAE;CAC9B,UAAU;CACV,KAAK;CACL,QAAQ;CACT,EACF"}
1	+ {"version":3,"file":"RoutesExpanded.style.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesExpanded.style.ts"],"sourcesContent":["import type { ScopedCssBaselineProps } from '@mui/material'\nimport { Box, ScopedCssBaseline, styled } from '@mui/material'\nimport type React from 'react'\nimport { getWidgetMaxHeight } from '../../utils/widgetSize.js'\n\nexport const routesExpansionWidth = '436px'\n\ninterface ContainerProps extends ScopedCssBaselineProps {\n minimumHeight: boolean\n}\n\nexport const Container: React.FC<\n React.ComponentProps<typeof ScopedCssBaseline> & ContainerProps\n> = styled(ScopedCssBaseline, {\n shouldForwardProp: (prop) => !['minimumHeight'].includes(prop as string),\n})<ContainerProps>(({ theme, minimumHeight }) => {\n return {\n ...theme.container,\n backgroundColor: theme.vars.palette.background.default,\n overflow: 'hidden',\n width: routesExpansionWidth,\n display: 'flex',\n flexDirection: 'column',\n whiteSpace: 'normal',\n ...(theme.container?.display !== 'flex'\n ? {\n maxHeight: getWidgetMaxHeight(theme),\n ...(minimumHeight ? { '&': { height: 'auto' } } : {}),\n }\n : { height: minimumHeight ? 'auto' : '100%' }),\n ...theme.routesContainer,\n }\n})\n\nexport const Header: React.FC<React.ComponentProps<typeof Box>> = styled(Box)(\n ({ theme }) => ({\n backgroundColor: theme.vars.palette.background.default,\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n padding: theme.spacing(1.5, 3),\n position: 'sticky',\n top: 0,\n zIndex: 1200,\n })\n)\n"],"mappings":";;;AAKA,MAAa,uBAAuB;AAMpC,MAAaA,cAET,OAAO,mBAAmB,EAC5B,oBAAoB,SAAS,CAAC,CAAC,gBAAgB,CAAC,SAAS,KAAe,EACzE,CAAC,EAAkB,EAAE,OAAO,oBAAoB;CAC/C,OAAO;EACL,GAAG,MAAM;EACT,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU;EACV,OAAO;EACP,SAAS;EACT,eAAe;EACf,YAAY;EACZ,GAAI,MAAM,WAAW,YAAY,SAC7B;GACE,WAAW,mBAAmB,MAAM;GACpC,GAAI,gBAAgB,EAAE,KAAK,EAAE,QAAQ,QAAQ,EAAE,GAAG,EAAE;GACrD,GACD,EAAE,QAAQ,gBAAgB,SAAS,QAAQ;EAC/C,GAAG,MAAM;EACV;EACD;AAEF,MAAa,SAAqD,OAAO,IAAI,EAC1E,EAAE,aAAa;CACd,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,SAAS;CACT,gBAAgB;CAChB,YAAY;CACZ,SAAS,MAAM,QAAQ,KAAK,EAAE;CAC9B,UAAU;CACV,KAAK;CACL,QAAQ;CACT,EACF"}

package/dist/esm/components/Search/SearchInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchInput.js","names":[],"sources":["../../../../src/components/Search/SearchInput.tsx"],"sourcesContent":["import ClearIcon from '@mui/icons-material/Clear'\nimport Search from '@mui/icons-material/Search'\nimport { FormControl, IconButton, InputAdornment } from '@mui/material'\nimport type {\n ChangeEventHandler,\n FocusEventHandler,\n JSX,\n RefObject,\n} from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\nimport { useHeaderHeight } from '../../stores/header/useHeaderStore.js'\nimport { Input, StickySearchInputContainer } from './SearchInput.style.js'\n\ninterface SearchInputProps {\n inputRef?: RefObject<HTMLInputElement \| null>\n name?: string\n value?: string\n placeholder?: string\n onChange?: ChangeEventHandler<HTMLInputElement>\n onBlur?: FocusEventHandler<HTMLInputElement>\n onClear?: () => void\n autoFocus?: boolean\n size?: 'small' \| 'medium'\n}\n\nexport const SearchInput = ({\n inputRef,\n name,\n placeholder,\n onChange,\n onBlur,\n onClear,\n value,\n autoFocus,\n size = 'medium',\n}: SearchInputProps): JSX.Element => {\n return (\n <InputCard>\n <FormControl fullWidth>\n <Input\n inputRef={inputRef}\n size={size}\n placeholder={placeholder}\n startAdornment={\n <InputAdornment position=\"start\">\n <Search />\n </InputAdornment>\n }\n endAdornment={\n (value \|\| inputRef?.current?.value) &&\n onClear && (\n <InputAdornment position=\"end\">\n <IconButton\n size={size}\n onClick={onClear}\n aria-label=\"Clear\"\n tabIndex={-1}\n sx={{\n padding: 0.5,\n }}\n >\n <ClearIcon fontSize={size} />\n </IconButton>\n </InputAdornment>\n )\n }\n inputProps={{\n inputMode: 'search',\n onChange,\n onBlur,\n name,\n value,\n maxLength: 128,\n }}\n autoComplete=\"off\"\n autoFocus={autoFocus}\n />\n </FormControl>\n </InputCard>\n )\n}\n\nexport const StickySearchInput = (props: SearchInputProps): JSX.Element => {\n const { headerHeight } = useHeaderHeight()\n\n return (\n <StickySearchInputContainer headerHeight={headerHeight}>\n <SearchInput {...props} autoFocus />\n </StickySearchInputContainer>\n )\n}\n"],"mappings":";;;;;;;;AAyBA,MAAa,eAAe,EAC1B,UACA,MACA,aACA,UACA,QACA,SACA,OACA,WACA,OAAO,eAC4B;~~AACnC~~,~~QACE~~,oBAAC,WAAD,EAAA,UACE,oBAAC,aAAD;EAAa,WAAA;YACX,oBAAC,OAAD;GACY;GACJ;GACO;GACb,gBACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,QAAD,EAAU,CAAA;IACK,CAAA;GAEnB,eACG,SAAS,UAAU,SAAS,UAC7B,WACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,YAAD;KACQ;KACN,SAAS;KACT,cAAW;KACX,UAAU;KACV,IAAI,EACF,SAAS,IACV;eAED,oBAAC,WAAD,EAAW,UAAU,MAAQ,CAAA;KAClB,CAAA;IACE,CAAA;GAGrB,YAAY;IACV,WAAW;IACX;IACA;IACA;IACA;IACA,WAAW;IACZ;GACD,cAAa;GACF;GACX,CAAA;EACU,CAAA,EACJ,CAAA;;AAIhB,MAAa,qBAAqB,UAAyC;CACzE,MAAM,EAAE,iBAAiB,iBAAiB;~~AAE1C~~,~~QACE~~,oBAAC,4BAAD;EAA0C;YACxC,oBAAC,aAAD;GAAa,GAAI;GAAO,WAAA;GAAY,CAAA;EACT,CAAA"}
1	+ {"version":3,"file":"SearchInput.js","names":[],"sources":["../../../../src/components/Search/SearchInput.tsx"],"sourcesContent":["import ClearIcon from '@mui/icons-material/Clear'\nimport Search from '@mui/icons-material/Search'\nimport { FormControl, IconButton, InputAdornment } from '@mui/material'\nimport type {\n ChangeEventHandler,\n FocusEventHandler,\n JSX,\n RefObject,\n} from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\nimport { useHeaderHeight } from '../../stores/header/useHeaderStore.js'\nimport { Input, StickySearchInputContainer } from './SearchInput.style.js'\n\ninterface SearchInputProps {\n inputRef?: RefObject<HTMLInputElement \| null>\n name?: string\n value?: string\n placeholder?: string\n onChange?: ChangeEventHandler<HTMLInputElement>\n onBlur?: FocusEventHandler<HTMLInputElement>\n onClear?: () => void\n autoFocus?: boolean\n size?: 'small' \| 'medium'\n}\n\nexport const SearchInput = ({\n inputRef,\n name,\n placeholder,\n onChange,\n onBlur,\n onClear,\n value,\n autoFocus,\n size = 'medium',\n}: SearchInputProps): JSX.Element => {\n return (\n <InputCard>\n <FormControl fullWidth>\n <Input\n inputRef={inputRef}\n size={size}\n placeholder={placeholder}\n startAdornment={\n <InputAdornment position=\"start\">\n <Search />\n </InputAdornment>\n }\n endAdornment={\n (value \|\| inputRef?.current?.value) &&\n onClear && (\n <InputAdornment position=\"end\">\n <IconButton\n size={size}\n onClick={onClear}\n aria-label=\"Clear\"\n tabIndex={-1}\n sx={{\n padding: 0.5,\n }}\n >\n <ClearIcon fontSize={size} />\n </IconButton>\n </InputAdornment>\n )\n }\n inputProps={{\n inputMode: 'search',\n onChange,\n onBlur,\n name,\n value,\n maxLength: 128,\n }}\n autoComplete=\"off\"\n autoFocus={autoFocus}\n />\n </FormControl>\n </InputCard>\n )\n}\n\nexport const StickySearchInput = (props: SearchInputProps): JSX.Element => {\n const { headerHeight } = useHeaderHeight()\n\n return (\n <StickySearchInputContainer headerHeight={headerHeight}>\n <SearchInput {...props} autoFocus />\n </StickySearchInputContainer>\n )\n}\n"],"mappings":";;;;;;;;AAyBA,MAAa,eAAe,EAC1B,UACA,MACA,aACA,UACA,QACA,SACA,OACA,WACA,OAAO,eAC4B;CACnC,OACE,oBAAC,WAAD,EAAA,UACE,oBAAC,aAAD;EAAa,WAAA;YACX,oBAAC,OAAD;GACY;GACJ;GACO;GACb,gBACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,QAAD,EAAU,CAAA;IACK,CAAA;GAEnB,eACG,SAAS,UAAU,SAAS,UAC7B,WACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,YAAD;KACQ;KACN,SAAS;KACT,cAAW;KACX,UAAU;KACV,IAAI,EACF,SAAS,IACV;eAED,oBAAC,WAAD,EAAW,UAAU,MAAQ,CAAA;KAClB,CAAA;IACE,CAAA;GAGrB,YAAY;IACV,WAAW;IACX;IACA;IACA;IACA;IACA,WAAW;IACZ;GACD,cAAa;GACF;GACX,CAAA;EACU,CAAA,EACJ,CAAA;;AAIhB,MAAa,qBAAqB,UAAyC;CACzE,MAAM,EAAE,iBAAiB,iBAAiB;CAE1C,OACE,oBAAC,4BAAD;EAA0C;YACxC,oBAAC,aAAD;GAAa,GAAI;GAAO,WAAA;GAAY,CAAA;EACT,CAAA"}

package/dist/esm/components/SelectChainAndToken.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectChainAndToken.js","names":[],"sources":["../../../src/components/SelectChainAndToken.tsx"],"sourcesContent":["import type { BoxProps } from '@mui/material'\nimport { Box } from '@mui/material'\nimport { ReverseTokensButton } from '../components/ReverseTokensButton/ReverseTokensButton.js'\nimport { SelectTokenButton } from '../components/SelectTokenButton/SelectTokenButton.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { DisabledUI, HiddenUI } from '../types/widget.js'\nimport { ReverseTokensButtonEmpty } from './ReverseTokensButton/ReverseTokensButton.style.js'\n\nexport const SelectChainAndToken: React.FC<BoxProps> = (props) => {\n const { disabledUI, hiddenUI, subvariant } = useWidgetConfig()\n\n const hiddenReverse =\n subvariant === 'refuel' \|\|\n disabledUI?.includes(DisabledUI.FromToken) \|\|\n disabledUI?.includes(DisabledUI.ToToken) \|\|\n hiddenUI?.includes(HiddenUI.FromToken) \|\|\n hiddenUI?.includes(HiddenUI.ToToken) \|\|\n hiddenUI?.includes(HiddenUI.ReverseTokensButton)\n\n const hiddenFromToken = hiddenUI?.includes(HiddenUI.FromToken)\n const hiddenToToken =\n subvariant === 'custom' \|\| hiddenUI?.includes(HiddenUI.ToToken)\n\n const showReverseButton = !hiddenToToken && !hiddenFromToken\n\n return (\n <Box {...props} sx={{ display: 'flex', ...props.sx }}>\n {!hiddenFromToken ? (\n <SelectTokenButton formType=\"from\" hiddenReverse={hiddenReverse} />\n ) : null}\n {showReverseButton ? (\n !hiddenReverse ? (\n <ReverseTokensButton />\n ) : (\n <ReverseTokensButtonEmpty />\n )\n ) : null}\n {!hiddenToToken ? (\n <SelectTokenButton formType=\"to\" hiddenReverse={hiddenReverse} />\n ) : null}\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,uBAA2C,UAAU;CAChE,MAAM,EAAE,YAAY,UAAU,eAAe,iBAAiB;CAE9D,MAAM,gBACJ,eAAe,YACf,YAAY,SAAA,YAA8B,IAC1C,YAAY,SAAA,UAA4B,IACxC,UAAU,SAAA,YAA4B,IACtC,UAAU,SAAA,UAA0B,IACpC,UAAU,SAAA,sBAAsC;CAElD,MAAM,kBAAkB,UAAU,SAAA,YAA4B;CAC9D,MAAM,gBACJ,eAAe,YAAY,UAAU,SAAA,UAA0B;CAEjE,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;~~AAE7C~~,~~QACE~~,qBAAC,KAAD;EAAK,GAAI;EAAO,IAAI;GAAE,SAAS;GAAQ,GAAG,MAAM;GAAI;YAApD;GACG,CAAC,kBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAsB;IAAiB,CAAA,GACjE;GACH,oBACC,CAAC,gBACC,oBAAC,qBAAD,EAAuB,CAAA,GAEvB,oBAAC,0BAAD,EAA4B,CAAA,GAE5B;GACH,CAAC,gBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAoB;IAAiB,CAAA,GAC/D;GACA"}
1	+ {"version":3,"file":"SelectChainAndToken.js","names":[],"sources":["../../../src/components/SelectChainAndToken.tsx"],"sourcesContent":["import type { BoxProps } from '@mui/material'\nimport { Box } from '@mui/material'\nimport { ReverseTokensButton } from '../components/ReverseTokensButton/ReverseTokensButton.js'\nimport { SelectTokenButton } from '../components/SelectTokenButton/SelectTokenButton.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { DisabledUI, HiddenUI } from '../types/widget.js'\nimport { ReverseTokensButtonEmpty } from './ReverseTokensButton/ReverseTokensButton.style.js'\n\nexport const SelectChainAndToken: React.FC<BoxProps> = (props) => {\n const { disabledUI, hiddenUI, subvariant } = useWidgetConfig()\n\n const hiddenReverse =\n subvariant === 'refuel' \|\|\n disabledUI?.includes(DisabledUI.FromToken) \|\|\n disabledUI?.includes(DisabledUI.ToToken) \|\|\n hiddenUI?.includes(HiddenUI.FromToken) \|\|\n hiddenUI?.includes(HiddenUI.ToToken) \|\|\n hiddenUI?.includes(HiddenUI.ReverseTokensButton)\n\n const hiddenFromToken = hiddenUI?.includes(HiddenUI.FromToken)\n const hiddenToToken =\n subvariant === 'custom' \|\| hiddenUI?.includes(HiddenUI.ToToken)\n\n const showReverseButton = !hiddenToToken && !hiddenFromToken\n\n return (\n <Box {...props} sx={{ display: 'flex', ...props.sx }}>\n {!hiddenFromToken ? (\n <SelectTokenButton formType=\"from\" hiddenReverse={hiddenReverse} />\n ) : null}\n {showReverseButton ? (\n !hiddenReverse ? (\n <ReverseTokensButton />\n ) : (\n <ReverseTokensButtonEmpty />\n )\n ) : null}\n {!hiddenToToken ? (\n <SelectTokenButton formType=\"to\" hiddenReverse={hiddenReverse} />\n ) : null}\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,uBAA2C,UAAU;CAChE,MAAM,EAAE,YAAY,UAAU,eAAe,iBAAiB;CAE9D,MAAM,gBACJ,eAAe,YACf,YAAY,SAAA,YAA8B,IAC1C,YAAY,SAAA,UAA4B,IACxC,UAAU,SAAA,YAA4B,IACtC,UAAU,SAAA,UAA0B,IACpC,UAAU,SAAA,sBAAsC;CAElD,MAAM,kBAAkB,UAAU,SAAA,YAA4B;CAC9D,MAAM,gBACJ,eAAe,YAAY,UAAU,SAAA,UAA0B;CAEjE,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;CAE7C,OACE,qBAAC,KAAD;EAAK,GAAI;EAAO,IAAI;GAAE,SAAS;GAAQ,GAAG,MAAM;GAAI;YAApD;GACG,CAAC,kBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAsB;IAAiB,CAAA,GACjE;GACH,oBACC,CAAC,gBACC,oBAAC,qBAAD,EAAuB,CAAA,GAEvB,oBAAC,0BAAD,EAA4B,CAAA,GAE5B;GACH,CAAC,gBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAoB;IAAiB,CAAA,GAC/D;GACA"}

package/dist/esm/components/SelectTokenButton/SelectTokenButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectTokenButton.js","names":["CardContent"],"sources":["../../../../src/components/SelectTokenButton/SelectTokenButton.tsx"],"sourcesContent":["import { Skeleton } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport type { ChainOrderState } from '../../stores/chains/types.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AvatarBadgedDefault, AvatarBadgedSkeleton } from '../Avatar/Avatar.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport {\n CardContent,\n SelectTokenCard,\n SelectTokenCardHeader,\n} from './SelectTokenButton.style.js'\n\nexport const SelectTokenButton: React.FC<\n FormTypeProps & {\n hiddenReverse?: boolean\n }\n> = ({ formType, hiddenReverse }) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { disabledUI, subvariant } = useWidgetConfig()\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n tokenKey\n )\n const { chain, isLoading: isChainLoading } = useChain(chainId)\n const { token, isLoading: isTokenLoading } = useToken(chainId, tokenAddress)\n\n const isAllNetworks = useChainOrderStore(\n (state: ChainOrderState) => state[`${formType}IsAllNetworks`]\n )\n\n const handleClick = () => {\n navigate({\n to:\n formType === 'from'\n ? navigationRoutes.fromToken\n : subvariant === 'refuel'\n ? navigationRoutes.toTokenNative\n : navigationRoutes.toToken,\n })\n }\n\n const isSelected = !!(chain && token)\n const onClick = !disabledUI?.includes(tokenKey) ? handleClick : undefined\n const defaultPlaceholder = `${t('main.select')}...`\n const cardTitle: string =\n formType === 'from' && subvariant === 'custom'\n ? t('header.payWith')\n : t(`main.${formType}`)\n return (\n <SelectTokenCard component=\"button\" onClick={onClick}>\n <CardContent formType={formType} mask={!hiddenReverse}>\n <CardTitle>{cardTitle}</CardTitle>\n {chainId && tokenAddress && (isChainLoading \|\| isTokenLoading) ? (\n <SelectTokenCardHeader\n avatar={<AvatarBadgedSkeleton />}\n title={<Skeleton variant=\"text\" width={64} height={24} />}\n subheader={<Skeleton variant=\"text\" width={72} height={16} />}\n />\n ) : (\n <SelectTokenCardHeader\n avatar={\n isSelected ? (\n <TokenAvatar token={token} chain={chain} />\n ) : (\n <AvatarBadgedDefault\n chain={isAllNetworks ? undefined : chain}\n />\n )\n }\n title={isSelected ? token.symbol : defaultPlaceholder}\n slotProps={{\n title: {\n title: isSelected ? token.symbol : defaultPlaceholder,\n },\n subheader: {\n title: isSelected ? chain.name : undefined,\n },\n }}\n subheader={isSelected ? chain.name : null}\n selected={isSelected}\n />\n )}\n </CardContent>\n </SelectTokenCard>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAqBA,MAAa,qBAIR,EAAE,UAAU,oBAAoB;CACnC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,YAAY,eAAe,iBAAiB;CACpD,MAAM,WAAW,cAAc,YAAY,SAAS;CACpD,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,SACD;CACD,MAAM,EAAE,OAAO,WAAW,mBAAmB,SAAS,QAAQ;CAC9D,MAAM,EAAE,OAAO,WAAW,mBAAmB,SAAS,SAAS,aAAa;CAE5E,MAAM,gBAAgB,oBACnB,UAA2B,MAAM,GAAG,SAAS,gBAC/C;CAED,MAAM,oBAAoB;~~AACxB~~,~~WAAS~~,EACP,IACE,aAAa,SACT,iBAAiB,YACjB,eAAe,WACb,iBAAiB,gBACjB,iBAAiB,SAC1B,CAAC;;CAGJ,MAAM,aAAa,CAAC,EAAE,SAAS;CAC/B,MAAM,UAAU,CAAC,YAAY,SAAS,SAAS,GAAG,cAAc,KAAA;CAChE,MAAM,qBAAqB,GAAG,EAAE,cAAc,CAAC;CAC/C,MAAM,YACJ,aAAa,UAAU,eAAe,WAClC,EAAE,iBAAiB,GACnB,EAAE,QAAQ,WAAW;~~AAC3B~~,~~QACE~~,oBAAC,iBAAD;EAAiB,WAAU;EAAkB;YAC3C,qBAACA,eAAD;GAAuB;GAAU,MAAM,CAAC;aAAxC,CACE,oBAAC,WAAD,EAAA,UAAY,WAAsB,CAAA,EACjC,WAAW,iBAAiB,kBAAkB,kBAC7C,oBAAC,uBAAD;IACE,QAAQ,oBAAC,sBAAD,EAAwB,CAAA;IAChC,OAAO,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;KAAM,CAAA;IACzD,WAAW,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;KAAM,CAAA;IAC7D,CAAA,GAEF,oBAAC,uBAAD;IACE,QACE,aACE,oBAAC,aAAD;KAAoB;KAAc;KAAS,CAAA,GAE3C,oBAAC,qBAAD,EACE,OAAO,gBAAgB,KAAA,IAAY,OACnC,CAAA;IAGN,OAAO,aAAa,MAAM,SAAS;IACnC,WAAW;KACT,OAAO,EACL,OAAO,aAAa,MAAM,SAAS,oBACpC;KACD,WAAW,EACT,OAAO,aAAa,MAAM,OAAO,KAAA,GAClC;KACF;IACD,WAAW,aAAa,MAAM,OAAO;IACrC,UAAU;IACV,CAAA,CAEQ;;EACE,CAAA"}
1	+ {"version":3,"file":"SelectTokenButton.js","names":["CardContent"],"sources":["../../../../src/components/SelectTokenButton/SelectTokenButton.tsx"],"sourcesContent":["import { Skeleton } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport type { ChainOrderState } from '../../stores/chains/types.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AvatarBadgedDefault, AvatarBadgedSkeleton } from '../Avatar/Avatar.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport {\n CardContent,\n SelectTokenCard,\n SelectTokenCardHeader,\n} from './SelectTokenButton.style.js'\n\nexport const SelectTokenButton: React.FC<\n FormTypeProps & {\n hiddenReverse?: boolean\n }\n> = ({ formType, hiddenReverse }) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { disabledUI, subvariant } = useWidgetConfig()\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n tokenKey\n )\n const { chain, isLoading: isChainLoading } = useChain(chainId)\n const { token, isLoading: isTokenLoading } = useToken(chainId, tokenAddress)\n\n const isAllNetworks = useChainOrderStore(\n (state: ChainOrderState) => state[`${formType}IsAllNetworks`]\n )\n\n const handleClick = () => {\n navigate({\n to:\n formType === 'from'\n ? navigationRoutes.fromToken\n : subvariant === 'refuel'\n ? navigationRoutes.toTokenNative\n : navigationRoutes.toToken,\n })\n }\n\n const isSelected = !!(chain && token)\n const onClick = !disabledUI?.includes(tokenKey) ? handleClick : undefined\n const defaultPlaceholder = `${t('main.select')}...`\n const cardTitle: string =\n formType === 'from' && subvariant === 'custom'\n ? t('header.payWith')\n : t(`main.${formType}`)\n return (\n <SelectTokenCard component=\"button\" onClick={onClick}>\n <CardContent formType={formType} mask={!hiddenReverse}>\n <CardTitle>{cardTitle}</CardTitle>\n {chainId && tokenAddress && (isChainLoading \|\| isTokenLoading) ? (\n <SelectTokenCardHeader\n avatar={<AvatarBadgedSkeleton />}\n title={<Skeleton variant=\"text\" width={64} height={24} />}\n subheader={<Skeleton variant=\"text\" width={72} height={16} />}\n />\n ) : (\n <SelectTokenCardHeader\n avatar={\n isSelected ? (\n <TokenAvatar token={token} chain={chain} />\n ) : (\n <AvatarBadgedDefault\n chain={isAllNetworks ? undefined : chain}\n />\n )\n }\n title={isSelected ? token.symbol : defaultPlaceholder}\n slotProps={{\n title: {\n title: isSelected ? token.symbol : defaultPlaceholder,\n },\n subheader: {\n title: isSelected ? chain.name : undefined,\n },\n }}\n subheader={isSelected ? chain.name : null}\n selected={isSelected}\n />\n )}\n </CardContent>\n </SelectTokenCard>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAqBA,MAAa,qBAIR,EAAE,UAAU,oBAAoB;CACnC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,YAAY,eAAe,iBAAiB;CACpD,MAAM,WAAW,cAAc,YAAY,SAAS;CACpD,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,SACD;CACD,MAAM,EAAE,OAAO,WAAW,mBAAmB,SAAS,QAAQ;CAC9D,MAAM,EAAE,OAAO,WAAW,mBAAmB,SAAS,SAAS,aAAa;CAE5E,MAAM,gBAAgB,oBACnB,UAA2B,MAAM,GAAG,SAAS,gBAC/C;CAED,MAAM,oBAAoB;EACxB,SAAS,EACP,IACE,aAAa,SACT,iBAAiB,YACjB,eAAe,WACb,iBAAiB,gBACjB,iBAAiB,SAC1B,CAAC;;CAGJ,MAAM,aAAa,CAAC,EAAE,SAAS;CAC/B,MAAM,UAAU,CAAC,YAAY,SAAS,SAAS,GAAG,cAAc,KAAA;CAChE,MAAM,qBAAqB,GAAG,EAAE,cAAc,CAAC;CAC/C,MAAM,YACJ,aAAa,UAAU,eAAe,WAClC,EAAE,iBAAiB,GACnB,EAAE,QAAQ,WAAW;CAC3B,OACE,oBAAC,iBAAD;EAAiB,WAAU;EAAkB;YAC3C,qBAACA,eAAD;GAAuB;GAAU,MAAM,CAAC;aAAxC,CACE,oBAAC,WAAD,EAAA,UAAY,WAAsB,CAAA,EACjC,WAAW,iBAAiB,kBAAkB,kBAC7C,oBAAC,uBAAD;IACE,QAAQ,oBAAC,sBAAD,EAAwB,CAAA;IAChC,OAAO,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;KAAM,CAAA;IACzD,WAAW,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;KAAM,CAAA;IAC7D,CAAA,GAEF,oBAAC,uBAAD;IACE,QACE,aACE,oBAAC,aAAD;KAAoB;KAAc;KAAS,CAAA,GAE3C,oBAAC,qBAAD,EACE,OAAO,gBAAgB,KAAA,IAAY,OACnC,CAAA;IAGN,OAAO,aAAa,MAAM,SAAS;IACnC,WAAW;KACT,OAAO,EACL,OAAO,aAAa,MAAM,SAAS,oBACpC;KACD,WAAW,EACT,OAAO,aAAa,MAAM,OAAO,KAAA,GAClC;KACF;IACD,WAAW,aAAa,MAAM,OAAO;IACrC,UAAU;IACV,CAAA,CAEQ;;EACE,CAAA"}

package/dist/esm/components/SelectTokenButton/SelectTokenButton.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectTokenButton.style.js","names":["CardHeader","Card","CardContent","MuiCardContent"],"sources":["../../../../src/components/SelectTokenButton/SelectTokenButton.style.tsx"],"sourcesContent":["import {\n cardHeaderClasses,\n CardContent as MuiCardContent,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport type { FormType } from '../../stores/form/types.js'\nimport { Card } from '../Card/Card.js'\nimport { CardHeader } from '../Card/CardHeader.js'\n\nexport const SelectTokenCardHeader: React.FC<\n React.ComponentProps<typeof CardHeader> & {\n selected?: boolean\n }\n> = styled(CardHeader, {\n shouldForwardProp: (prop) => !['selected'].includes(prop as string),\n})<{ selected?: boolean }>(({ theme }) => ({\n padding: theme.spacing(2),\n [`.${cardHeaderClasses.title}`]: {\n color: theme.vars.palette.text.secondary,\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n width: 96,\n fontSize: 18,\n fontWeight: 500,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n fontSize: 16,\n },\n },\n [`.${cardHeaderClasses.subheader}`]: {\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n width: 96,\n },\n variants: [\n {\n props: ({ selected }) => selected,\n style: {\n [`.${cardHeaderClasses.title}`]: {\n color: theme.vars.palette.text.primary,\n fontWeight: 600,\n },\n },\n },\n ],\n}))\n\nexport const SelectTokenCard: React.FC<\n React.ComponentProps<typeof Card> & {\n formType?: FormType\n mask?: boolean\n }\n> = styled(Card)(({ theme }) => {\n const cardVariant = theme.components?.MuiCard?.defaultProps?.variant\n return {\n flex: 1,\n ...(cardVariant !== 'outlined' && {\n background: 'none',\n '&:hover': {\n cursor: 'pointer',\n background: 'none',\n },\n }),\n }\n})\n\nexport const CardContent: React.FC<\n React.ComponentProps<typeof MuiCardContent> & {\n formType?: FormType\n mask?: boolean\n }\n> = styled(MuiCardContent, {\n shouldForwardProp: (prop) => !['formType', 'mask'].includes(prop as string),\n})<{ formType?: FormType; mask?: boolean }>(\n ({ theme, formType, mask = true }) => {\n const cardVariant = theme.components?.MuiCard?.defaultProps?.variant\n const direction = formType === 'to' ? '-8px' : 'calc(100% + 8px)'\n const horizontal = direction\n const vertical = '50%'\n return {\n padding: 0,\n transition: theme.transitions.create(['background-color'], {\n duration: theme.transitions.duration.enteringScreen,\n easing: theme.transitions.easing.easeOut,\n }),\n '&:last-child': {\n paddingBottom: 0,\n },\n ...(cardVariant !== 'outlined' && {\n backgroundColor: theme.vars.palette.background.paper,\n mask: mask\n ? `radial-gradient(circle 20px at ${horizontal} ${vertical}, #fff0 96%, #fff) 100% 100% / 100% 100% no-repeat`\n : 'none',\n }),\n ...(cardVariant === 'filled' && {\n '&:hover': {\n cursor: 'pointer',\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, black)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, white)`,\n }),\n },\n }),\n }\n }\n)\n"],"mappings":";;;;AAUA,MAAa,wBAIT,OAAOA,cAAY,EACrB,oBAAoB,SAAS,CAAC,CAAC,WAAW,CAAC,SAAS,KAAe,EACpE,CAAC,EAA0B,EAAE,aAAa;CACzC,SAAS,MAAM,QAAQ,EAAE;EACxB,IAAI,kBAAkB,UAAU;EAC/B,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,cAAc;EACd,YAAY;EACZ,UAAU;EACV,OAAO;EACP,UAAU;EACV,YAAY;GACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG,EACrD,UAAU,IACX;EACF;EACA,IAAI,kBAAkB,cAAc;EACnC,cAAc;EACd,YAAY;EACZ,UAAU;EACV,OAAO;EACR;CACD,UAAU,CACR;EACE,QAAQ,EAAE,eAAe;EACzB,OAAO,GACJ,IAAI,kBAAkB,UAAU;GAC/B,OAAO,MAAM,KAAK,QAAQ,KAAK;GAC/B,YAAY;GACb,EACF;EACF,CACF;CACF,EAAE;AAEH,MAAa,kBAKT,OAAOC,OAAK,EAAE,EAAE,YAAY;~~AAE9B~~,~~QAAO~~;EACL,MAAM;EACN,GAHkB,MAAM,YAAY,SAAS,cAAc,YAGvC,cAAc;GAChC,YAAY;GACZ,WAAW;IACT,QAAQ;IACR,YAAY;IACb;GACF;EACF;EACD;AAEF,MAAaC,gBAKT,OAAOC,aAAgB,EACzB,oBAAoB,SAAS,CAAC,CAAC,YAAY,OAAO,CAAC,SAAS,KAAe,EAC5E,CAAC,EACC,EAAE,OAAO,UAAU,OAAO,WAAW;CACpC,MAAM,cAAc,MAAM,YAAY,SAAS,cAAc;CAE7D,MAAM,aADY,aAAa,OAAO,SAAS;~~AAG~~/C,~~QAAO~~;EACL,SAAS;EACT,YAAY,MAAM,YAAY,OAAO,CAAC,mBAAmB,EAAE;GACzD,UAAU,MAAM,YAAY,SAAS;GACrC,QAAQ,MAAM,YAAY,OAAO;GAClC,CAAC;EACF,gBAAgB,EACd,eAAe,GAChB;EACD,GAAI,gBAAgB,cAAc;GAChC,iBAAiB,MAAM,KAAK,QAAQ,WAAW;GAC/C,MAAM,OACF,kCAAkC,WAAW,0DAC7C;GACL;EACD,GAAI,gBAAgB,YAAY,EAC9B,WAAW;GACT,QAAQ;GACR,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM;GAC3E,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,eAC5E,CAAC;GACH,EACF;EACF;EAEJ"}
1	+ {"version":3,"file":"SelectTokenButton.style.js","names":["CardHeader","Card","CardContent","MuiCardContent"],"sources":["../../../../src/components/SelectTokenButton/SelectTokenButton.style.tsx"],"sourcesContent":["import {\n cardHeaderClasses,\n CardContent as MuiCardContent,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport type { FormType } from '../../stores/form/types.js'\nimport { Card } from '../Card/Card.js'\nimport { CardHeader } from '../Card/CardHeader.js'\n\nexport const SelectTokenCardHeader: React.FC<\n React.ComponentProps<typeof CardHeader> & {\n selected?: boolean\n }\n> = styled(CardHeader, {\n shouldForwardProp: (prop) => !['selected'].includes(prop as string),\n})<{ selected?: boolean }>(({ theme }) => ({\n padding: theme.spacing(2),\n [`.${cardHeaderClasses.title}`]: {\n color: theme.vars.palette.text.secondary,\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n width: 96,\n fontSize: 18,\n fontWeight: 500,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n fontSize: 16,\n },\n },\n [`.${cardHeaderClasses.subheader}`]: {\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n width: 96,\n },\n variants: [\n {\n props: ({ selected }) => selected,\n style: {\n [`.${cardHeaderClasses.title}`]: {\n color: theme.vars.palette.text.primary,\n fontWeight: 600,\n },\n },\n },\n ],\n}))\n\nexport const SelectTokenCard: React.FC<\n React.ComponentProps<typeof Card> & {\n formType?: FormType\n mask?: boolean\n }\n> = styled(Card)(({ theme }) => {\n const cardVariant = theme.components?.MuiCard?.defaultProps?.variant\n return {\n flex: 1,\n ...(cardVariant !== 'outlined' && {\n background: 'none',\n '&:hover': {\n cursor: 'pointer',\n background: 'none',\n },\n }),\n }\n})\n\nexport const CardContent: React.FC<\n React.ComponentProps<typeof MuiCardContent> & {\n formType?: FormType\n mask?: boolean\n }\n> = styled(MuiCardContent, {\n shouldForwardProp: (prop) => !['formType', 'mask'].includes(prop as string),\n})<{ formType?: FormType; mask?: boolean }>(\n ({ theme, formType, mask = true }) => {\n const cardVariant = theme.components?.MuiCard?.defaultProps?.variant\n const direction = formType === 'to' ? '-8px' : 'calc(100% + 8px)'\n const horizontal = direction\n const vertical = '50%'\n return {\n padding: 0,\n transition: theme.transitions.create(['background-color'], {\n duration: theme.transitions.duration.enteringScreen,\n easing: theme.transitions.easing.easeOut,\n }),\n '&:last-child': {\n paddingBottom: 0,\n },\n ...(cardVariant !== 'outlined' && {\n backgroundColor: theme.vars.palette.background.paper,\n mask: mask\n ? `radial-gradient(circle 20px at ${horizontal} ${vertical}, #fff0 96%, #fff) 100% 100% / 100% 100% no-repeat`\n : 'none',\n }),\n ...(cardVariant === 'filled' && {\n '&:hover': {\n cursor: 'pointer',\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, black)`,\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, white)`,\n }),\n },\n }),\n }\n }\n)\n"],"mappings":";;;;AAUA,MAAa,wBAIT,OAAOA,cAAY,EACrB,oBAAoB,SAAS,CAAC,CAAC,WAAW,CAAC,SAAS,KAAe,EACpE,CAAC,EAA0B,EAAE,aAAa;CACzC,SAAS,MAAM,QAAQ,EAAE;EACxB,IAAI,kBAAkB,UAAU;EAC/B,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,cAAc;EACd,YAAY;EACZ,UAAU;EACV,OAAO;EACP,UAAU;EACV,YAAY;GACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG,EACrD,UAAU,IACX;EACF;EACA,IAAI,kBAAkB,cAAc;EACnC,cAAc;EACd,YAAY;EACZ,UAAU;EACV,OAAO;EACR;CACD,UAAU,CACR;EACE,QAAQ,EAAE,eAAe;EACzB,OAAO,GACJ,IAAI,kBAAkB,UAAU;GAC/B,OAAO,MAAM,KAAK,QAAQ,KAAK;GAC/B,YAAY;GACb,EACF;EACF,CACF;CACF,EAAE;AAEH,MAAa,kBAKT,OAAOC,OAAK,EAAE,EAAE,YAAY;CAE9B,OAAO;EACL,MAAM;EACN,GAHkB,MAAM,YAAY,SAAS,cAAc,YAGvC,cAAc;GAChC,YAAY;GACZ,WAAW;IACT,QAAQ;IACR,YAAY;IACb;GACF;EACF;EACD;AAEF,MAAaC,gBAKT,OAAOC,aAAgB,EACzB,oBAAoB,SAAS,CAAC,CAAC,YAAY,OAAO,CAAC,SAAS,KAAe,EAC5E,CAAC,EACC,EAAE,OAAO,UAAU,OAAO,WAAW;CACpC,MAAM,cAAc,MAAM,YAAY,SAAS,cAAc;CAE7D,MAAM,aADY,aAAa,OAAO,SAAS;CAG/C,OAAO;EACL,SAAS;EACT,YAAY,MAAM,YAAY,OAAO,CAAC,mBAAmB,EAAE;GACzD,UAAU,MAAM,YAAY,SAAS;GACrC,QAAQ,MAAM,YAAY,OAAO;GAClC,CAAC;EACF,gBAAgB,EACd,eAAe,GAChB;EACD,GAAI,gBAAgB,cAAc;GAChC,iBAAiB,MAAM,KAAK,QAAQ,WAAW;GAC/C,MAAM,OACF,kCAAkC,WAAW,0DAC7C;GACL;EACD,GAAI,gBAAgB,YAAY,EAC9B,WAAW;GACT,QAAQ;GACR,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM;GAC3E,GAAG,MAAM,YAAY,QAAQ,EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,WAAW,MAAM,eAC5E,CAAC;GACH,EACF;EACF;EAEJ"}

package/dist/esm/components/SendToWallet/SendToWalletButton.js CHANGED Viewed

@@ -100,7 +100,7 @@ const SendToWalletButton = (props) => {
 					title: headerTitle,
 					subheader: headerSubheader,
 					selected: !!toAddressFieldValue || disabledToAddress,
-					action: !!toAddressFieldValue && !disabledForChanges ? /* @__PURE__ */ jsx(CardIconButton, {
+					action: toAddressFieldValue && !disabledForChanges ? /* @__PURE__ */ jsx(CardIconButton, {
 						onClick: clearSelectedBookmark,
 						size: "small",
 						children: /* @__PURE__ */ jsx(CloseRounded, { fontSize: "inherit" })

package/dist/esm/components/SendToWallet/SendToWalletButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SendToWalletButton.js","names":["Card"],"sources":["../../../../src/components/SendToWallet/SendToWalletButton.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { useChainTypeFromAddress } from '@lifi/widget-provider'\nimport CloseRounded from '@mui/icons-material/CloseRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type MouseEventHandler, useEffect, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { DisabledUI, HiddenUI } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { AccountAvatar } from '../Avatar/AccountAvatar.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport {\n SendToWalletCardHeader,\n SendToWalletCardTitleRow,\n SendToWalletRequiredLabel,\n SendToWalletRequiredLabelText,\n} from './SendToWalletButton.style.js'\n\nexport const SendToWalletButton: React.FC<CardProps> = (props) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const {\n disabledUI,\n hiddenUI,\n toAddress,\n toAddresses,\n subvariant,\n subvariantOptions,\n } = useWidgetConfig()\n const [toAddressFieldValue, toChainId, toTokenAddress] = useFieldValues(\n 'toAddress',\n 'toChain',\n 'toToken'\n )\n const { setFieldValue } = useFieldActions()\n const { selectedBookmark } = useBookmarks()\n const { setSelectedBookmark } = useBookmarkActions()\n const { accounts } = useAccount()\n const { getChainTypeFromAddress } = useChainTypeFromAddress()\n const { requiredToAddress } = useToAddressRequirements()\n const disabledToAddress = disabledUI?.includes(DisabledUI.ToAddress)\n const hiddenToAddress = hiddenUI?.includes(HiddenUI.ToAddress)\n\n const address = toAddressFieldValue\n ? shortenAddress(toAddressFieldValue)\n : t('sendToWallet.enterAddress', {\n context: 'short',\n })\n\n const matchingConnectedAccount = accounts.find(\n (account) => account.address === toAddressFieldValue\n )\n\n const chainType = !matchingConnectedAccount\n ? selectedBookmark?.chainType \|\|\n (toAddressFieldValue\n ? getChainTypeFromAddress(toAddressFieldValue)\n : undefined)\n : undefined\n\n const chainId =\n toChainId && toTokenAddress\n ? toChainId\n : matchingConnectedAccount\n ? matchingConnectedAccount.chainId\n : chainType\n ? defaultChainIdsByType[chainType]\n : undefined\n\n const isConnectedAccount =\n selectedBookmark?.isConnectedAccount &&\n matchingConnectedAccount?.isConnected\n const connectedAccountName = matchingConnectedAccount?.connector?.name\n const bookmarkName = selectedBookmark?.name\n\n const headerTitle = isConnectedAccount\n ? connectedAccountName \|\| address\n : bookmarkName \|\| connectedAccountName \|\| address\n\n const headerSubheader =\n isConnectedAccount \|\| bookmarkName \|\| connectedAccountName ? address : null\n\n const disabledForChanges = Boolean(toAddressFieldValue) && disabledToAddress\n\n const handleOnClick = () => {\n navigate({\n to: toAddresses?.length\n ? navigationRoutes.configuredWallets\n : navigationRoutes.sendToWallet,\n })\n }\n\n const clearSelectedBookmark: MouseEventHandler<HTMLButtonElement> = (e) => {\n e.stopPropagation()\n setFieldValue('toAddress', '', { isTouched: true })\n setSelectedBookmark()\n }\n\n // The collapse opens instantly on first page load/component mount when there is an address to display\n // After which it needs an animated transition for open and closing.\n // collapseTransitionTime is used specify the transition time for opening and closing\n const collapseTransitionTime = useRef(0)\n\n // Timeout is needed here to push the collapseTransitionTime update to the back of the event loop so that it doesn't fired too quickly\n useEffect(() => {\n const timeout = setTimeout(() => {\n collapseTransitionTime.current = 225\n }, 0)\n return () => clearTimeout(timeout)\n }, [])\n\n const isOpenCollapse =\n !hiddenToAddress && (requiredToAddress \|\| !!toAddressFieldValue)\n\n const title =\n subvariant === 'custom' && subvariantOptions?.custom === 'deposit'\n ? t('header.depositTo')\n : t('header.sendToWallet')\n\n return (\n <Collapse\n timeout={collapseTransitionTime.current as number}\n in={isOpenCollapse}\n mountOnEnter\n unmountOnExit\n >\n <Card\n role=\"button\"\n onClick={disabledForChanges ? undefined : handleOnClick}\n sx={{ width: '100%', ...props.sx }}\n >\n <SendToWalletCardTitleRow>\n <CardTitle sx={{ p: 0 }}>{title}</CardTitle>\n {requiredToAddress && !toAddressFieldValue ? (\n <SendToWalletRequiredLabel variant=\"warning\">\n <WarningRounded sx={{ fontSize: 14 }} />\n <SendToWalletRequiredLabelText type=\"icon\">\n {t('sendToWallet.required')}\n </SendToWalletRequiredLabelText>\n </SendToWalletRequiredLabel>\n ) : null}\n </SendToWalletCardTitleRow>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n }}\n >\n <SendToWalletCardHeader\n avatar={\n <AccountAvatar\n chainId={chainId}\n account={matchingConnectedAccount}\n toAddress={toAddress}\n empty={!toAddressFieldValue}\n />\n }\n title={headerTitle}\n subheader={headerSubheader}\n selected={!!toAddressFieldValue \|\| disabledToAddress}\n action={\n !!toAddressFieldValue && !disabledForChanges ? (\n <CardIconButton onClick={clearSelectedBookmark} size=\"small\">\n <CloseRounded fontSize=\"inherit\" />\n </CardIconButton>\n ) : null\n }\n />\n </Box>\n </Card>\n </Collapse>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAa,sBAA2C,UAAU;CAChE,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EACJ,YACA,UACA,WACA,aACA,YACA,sBACE,iBAAiB;CACrB,MAAM,CAAC,qBAAqB,WAAW,kBAAkB,eACvD,aACA,WACA,UACD;CACD,MAAM,EAAE,kBAAkB,iBAAiB;CAC3C,MAAM,EAAE,qBAAqB,cAAc;CAC3C,MAAM,EAAE,wBAAwB,oBAAoB;CACpD,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,EAAE,4BAA4B,yBAAyB;CAC7D,MAAM,EAAE,sBAAsB,0BAA0B;CACxD,MAAM,oBAAoB,YAAY,SAAA,YAA8B;CACpE,MAAM,kBAAkB,UAAU,SAAA,YAA4B;CAE9D,MAAM,UAAU,sBACZ,eAAe,oBAAoB,GACnC,EAAE,6BAA6B,EAC7B,SAAS,SACV,CAAC;CAEN,MAAM,2BAA2B,SAAS,MACvC,YAAY,QAAQ,YAAY,oBAClC;CAED,MAAM,YAAY,CAAC,2BACf,kBAAkB,cACjB,sBACG,wBAAwB,oBAAoB,GAC5C,KAAA,KACJ,KAAA;CAEJ,MAAM,UACJ,aAAa,iBACT,YACA,2BACE,yBAAyB,UACzB,YACE,sBAAsB,aACtB,KAAA;CAEV,MAAM,qBACJ,kBAAkB,sBAClB,0BAA0B;CAC5B,MAAM,uBAAuB,0BAA0B,WAAW;CAClE,MAAM,eAAe,kBAAkB;CAEvC,MAAM,cAAc,qBAChB,wBAAwB,UACxB,gBAAgB,wBAAwB;CAE5C,MAAM,kBACJ,sBAAsB,gBAAgB,uBAAuB,UAAU;CAEzE,MAAM,qBAAqB,QAAQ,oBAAoB,IAAI;CAE3D,MAAM,sBAAsB;~~AAC1B~~,~~WAAS~~,EACP,IAAI,aAAa,SACb,iBAAiB,oBACjB,iBAAiB,cACtB,CAAC;;CAGJ,MAAM,yBAA+D,MAAM;~~AACzE~~,~~IAAE~~,iBAAiB;~~AACnB~~,~~gBAAc~~,aAAa,IAAI,EAAE,WAAW,MAAM,CAAC;~~AACnD~~,~~uBAAqB~~;;CAMvB,MAAM,yBAAyB,OAAO,EAAE;~~AAGxC~~,~~iBAAgB~~;EACd,MAAM,UAAU,iBAAiB;~~AAC~~/B,~~0BAAuB~~,UAAU;KAChC,EAAE;~~AACL~~,~~eAAa~~,aAAa,QAAQ;IACjC,EAAE,CAAC;CAEN,MAAM,iBACJ,CAAC,oBAAoB,qBAAqB,CAAC,CAAC;CAE9C,MAAM,QACJ,eAAe,YAAY,mBAAmB,WAAW,YACrD,EAAE,mBAAmB,GACrB,EAAE,sBAAsB;~~AAE9B~~,~~QACE~~,oBAAC,UAAD;EACE,SAAS,uBAAuB;EAChC,IAAI;EACJ,cAAA;EACA,eAAA;YAEA,qBAACA,QAAD;GACE,MAAK;GACL,SAAS,qBAAqB,KAAA,IAAY;GAC1C,IAAI;IAAE,OAAO;IAAQ,GAAG,MAAM;IAAI;aAHpC,CAKE,qBAAC,0BAAD,EAAA,UAAA,CACE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,GAAG;cAAG;IAAkB,CAAA,EAC3C,qBAAqB,CAAC,sBACrB,qBAAC,2BAAD;IAA2B,SAAQ;cAAnC,CACE,oBAAC,gBAAD,EAAgB,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA,EACxC,oBAAC,+BAAD;KAA+B,MAAK;eACjC,EAAE,wBAAwB;KACG,CAAA,CACN;QAC1B,KACqB,EAAA,CAAA,EAC3B,oBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,YAAY;KACb;cAED,oBAAC,wBAAD;KACE,QACE,oBAAC,eAAD;MACW;MACT,SAAS;MACE;MACX,OAAO,CAAC;MACR,CAAA;KAEJ,OAAO;KACP,WAAW;KACX,UAAU,CAAC,CAAC,uBAAuB;KACnC,QACE,~~CAAC,CAAC,~~uBAAuB,CAAC,~~qBACxB~~,oBAAC,gBAAD;MAAgB,SAAS;MAAuB,MAAK;gBACnD,oBAAC,cAAD,EAAc,UAAS,WAAY,CAAA;MACpB,CAAA,GACf;KAEN,CAAA;IACE,CAAA,CACD;;EACE,CAAA"}
1	+ {"version":3,"file":"SendToWalletButton.js","names":["Card"],"sources":["../../../../src/components/SendToWallet/SendToWalletButton.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { useChainTypeFromAddress } from '@lifi/widget-provider'\nimport CloseRounded from '@mui/icons-material/CloseRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type MouseEventHandler, useEffect, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { DisabledUI, HiddenUI } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { AccountAvatar } from '../Avatar/AccountAvatar.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport {\n SendToWalletCardHeader,\n SendToWalletCardTitleRow,\n SendToWalletRequiredLabel,\n SendToWalletRequiredLabelText,\n} from './SendToWalletButton.style.js'\n\nexport const SendToWalletButton: React.FC<CardProps> = (props) => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const {\n disabledUI,\n hiddenUI,\n toAddress,\n toAddresses,\n subvariant,\n subvariantOptions,\n } = useWidgetConfig()\n const [toAddressFieldValue, toChainId, toTokenAddress] = useFieldValues(\n 'toAddress',\n 'toChain',\n 'toToken'\n )\n const { setFieldValue } = useFieldActions()\n const { selectedBookmark } = useBookmarks()\n const { setSelectedBookmark } = useBookmarkActions()\n const { accounts } = useAccount()\n const { getChainTypeFromAddress } = useChainTypeFromAddress()\n const { requiredToAddress } = useToAddressRequirements()\n const disabledToAddress = disabledUI?.includes(DisabledUI.ToAddress)\n const hiddenToAddress = hiddenUI?.includes(HiddenUI.ToAddress)\n\n const address = toAddressFieldValue\n ? shortenAddress(toAddressFieldValue)\n : t('sendToWallet.enterAddress', {\n context: 'short',\n })\n\n const matchingConnectedAccount = accounts.find(\n (account) => account.address === toAddressFieldValue\n )\n\n const chainType = !matchingConnectedAccount\n ? selectedBookmark?.chainType \|\|\n (toAddressFieldValue\n ? getChainTypeFromAddress(toAddressFieldValue)\n : undefined)\n : undefined\n\n const chainId =\n toChainId && toTokenAddress\n ? toChainId\n : matchingConnectedAccount\n ? matchingConnectedAccount.chainId\n : chainType\n ? defaultChainIdsByType[chainType]\n : undefined\n\n const isConnectedAccount =\n selectedBookmark?.isConnectedAccount &&\n matchingConnectedAccount?.isConnected\n const connectedAccountName = matchingConnectedAccount?.connector?.name\n const bookmarkName = selectedBookmark?.name\n\n const headerTitle = isConnectedAccount\n ? connectedAccountName \|\| address\n : bookmarkName \|\| connectedAccountName \|\| address\n\n const headerSubheader =\n isConnectedAccount \|\| bookmarkName \|\| connectedAccountName ? address : null\n\n const disabledForChanges = Boolean(toAddressFieldValue) && disabledToAddress\n\n const handleOnClick = () => {\n navigate({\n to: toAddresses?.length\n ? navigationRoutes.configuredWallets\n : navigationRoutes.sendToWallet,\n })\n }\n\n const clearSelectedBookmark: MouseEventHandler<HTMLButtonElement> = (e) => {\n e.stopPropagation()\n setFieldValue('toAddress', '', { isTouched: true })\n setSelectedBookmark()\n }\n\n // The collapse opens instantly on first page load/component mount when there is an address to display\n // After which it needs an animated transition for open and closing.\n // collapseTransitionTime is used specify the transition time for opening and closing\n const collapseTransitionTime = useRef(0)\n\n // Timeout is needed here to push the collapseTransitionTime update to the back of the event loop so that it doesn't fired too quickly\n useEffect(() => {\n const timeout = setTimeout(() => {\n collapseTransitionTime.current = 225\n }, 0)\n return () => clearTimeout(timeout)\n }, [])\n\n const isOpenCollapse =\n !hiddenToAddress && (requiredToAddress \|\| !!toAddressFieldValue)\n\n const title =\n subvariant === 'custom' && subvariantOptions?.custom === 'deposit'\n ? t('header.depositTo')\n : t('header.sendToWallet')\n\n return (\n <Collapse\n timeout={collapseTransitionTime.current as number}\n in={isOpenCollapse}\n mountOnEnter\n unmountOnExit\n >\n <Card\n role=\"button\"\n onClick={disabledForChanges ? undefined : handleOnClick}\n sx={{ width: '100%', ...props.sx }}\n >\n <SendToWalletCardTitleRow>\n <CardTitle sx={{ p: 0 }}>{title}</CardTitle>\n {requiredToAddress && !toAddressFieldValue ? (\n <SendToWalletRequiredLabel variant=\"warning\">\n <WarningRounded sx={{ fontSize: 14 }} />\n <SendToWalletRequiredLabelText type=\"icon\">\n {t('sendToWallet.required')}\n </SendToWalletRequiredLabelText>\n </SendToWalletRequiredLabel>\n ) : null}\n </SendToWalletCardTitleRow>\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n }}\n >\n <SendToWalletCardHeader\n avatar={\n <AccountAvatar\n chainId={chainId}\n account={matchingConnectedAccount}\n toAddress={toAddress}\n empty={!toAddressFieldValue}\n />\n }\n title={headerTitle}\n subheader={headerSubheader}\n selected={!!toAddressFieldValue \|\| disabledToAddress}\n action={\n toAddressFieldValue && !disabledForChanges ? (\n <CardIconButton onClick={clearSelectedBookmark} size=\"small\">\n <CloseRounded fontSize=\"inherit\" />\n </CardIconButton>\n ) : null\n }\n />\n </Box>\n </Card>\n </Collapse>\n )\n}\n"],"mappings":"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"}

package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SendToWalletExpandButton.js","names":[],"sources":["../../../../src/components/SendToWallet/SendToWalletExpandButton.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport Button from '@mui/material/Button'\nimport Collapse from '@mui/material/Collapse'\nimport Tooltip from '@mui/material/Tooltip'\nimport { useNavigate } from '@tanstack/react-router'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { DisabledUI, HiddenUI } from '../../types/widget.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const SendToWalletExpandButton = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { toAddresses, disabledUI, hiddenUI } = useWidgetConfig()\n const hiddenToAddress = hiddenUI?.includes(HiddenUI.ToAddress)\n const disabledToAddress = disabledUI?.includes(DisabledUI.ToAddress)\n const { requiredToAddress } = useToAddressRequirements()\n const [toAddressValue] = useFieldValues('toAddress')\n\n const visible =\n !hiddenToAddress &&\n !disabledToAddress &&\n !toAddressValue &&\n !requiredToAddress\n\n const handleClick = () =>\n navigate({\n to: toAddresses?.length\n ? navigationRoutes.configuredWallets\n : navigationRoutes.sendToWallet,\n })\n\n return (\n <Collapse\n orientation=\"horizontal\"\n in={visible}\n timeout={225}\n mountOnEnter\n unmountOnExit\n >\n <Tooltip title={t('main.sendToWallet')} placement=\"bottom-end\">\n <Button\n variant=\"text\"\n onClick={handleClick}\n sx={{\n ml: 1.5,\n minWidth: 48,\n width: 48,\n height: 48,\n }}\n >\n <Wallet />\n </Button>\n </Tooltip>\n </Collapse>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAa,iCAA8C;CACzD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,aAAa,YAAY,aAAa,iBAAiB;CAC/D,MAAM,kBAAkB,UAAU,SAAA,YAA4B;CAC9D,MAAM,oBAAoB,YAAY,SAAA,YAA8B;CACpE,MAAM,EAAE,sBAAsB,0BAA0B;CACxD,MAAM,CAAC,kBAAkB,eAAe,YAAY;CAEpD,MAAM,UACJ,CAAC,mBACD,CAAC,qBACD,CAAC,kBACD,CAAC;CAEH,MAAM,oBACJ,SAAS,EACP,IAAI,aAAa,SACb,iBAAiB,oBACjB,iBAAiB,cACtB,CAAC;~~AAEJ~~,~~QACE~~,oBAAC,UAAD;EACE,aAAY;EACZ,IAAI;EACJ,SAAS;EACT,cAAA;EACA,eAAA;YAEA,oBAAC,SAAD;GAAS,OAAO,EAAE,oBAAoB;GAAE,WAAU;aAChD,oBAAC,QAAD;IACE,SAAQ;IACR,SAAS;IACT,IAAI;KACF,IAAI;KACJ,UAAU;KACV,OAAO;KACP,QAAQ;KACT;cAED,oBAAC,QAAD,EAAU,CAAA;IACH,CAAA;GACD,CAAA;EACD,CAAA"}
1	+ {"version":3,"file":"SendToWalletExpandButton.js","names":[],"sources":["../../../../src/components/SendToWallet/SendToWalletExpandButton.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport Button from '@mui/material/Button'\nimport Collapse from '@mui/material/Collapse'\nimport Tooltip from '@mui/material/Tooltip'\nimport { useNavigate } from '@tanstack/react-router'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { DisabledUI, HiddenUI } from '../../types/widget.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const SendToWalletExpandButton = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { toAddresses, disabledUI, hiddenUI } = useWidgetConfig()\n const hiddenToAddress = hiddenUI?.includes(HiddenUI.ToAddress)\n const disabledToAddress = disabledUI?.includes(DisabledUI.ToAddress)\n const { requiredToAddress } = useToAddressRequirements()\n const [toAddressValue] = useFieldValues('toAddress')\n\n const visible =\n !hiddenToAddress &&\n !disabledToAddress &&\n !toAddressValue &&\n !requiredToAddress\n\n const handleClick = () =>\n navigate({\n to: toAddresses?.length\n ? navigationRoutes.configuredWallets\n : navigationRoutes.sendToWallet,\n })\n\n return (\n <Collapse\n orientation=\"horizontal\"\n in={visible}\n timeout={225}\n mountOnEnter\n unmountOnExit\n >\n <Tooltip title={t('main.sendToWallet')} placement=\"bottom-end\">\n <Button\n variant=\"text\"\n onClick={handleClick}\n sx={{\n ml: 1.5,\n minWidth: 48,\n width: 48,\n height: 48,\n }}\n >\n <Wallet />\n </Button>\n </Tooltip>\n </Collapse>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAa,iCAA8C;CACzD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,aAAa,YAAY,aAAa,iBAAiB;CAC/D,MAAM,kBAAkB,UAAU,SAAA,YAA4B;CAC9D,MAAM,oBAAoB,YAAY,SAAA,YAA8B;CACpE,MAAM,EAAE,sBAAsB,0BAA0B;CACxD,MAAM,CAAC,kBAAkB,eAAe,YAAY;CAEpD,MAAM,UACJ,CAAC,mBACD,CAAC,qBACD,CAAC,kBACD,CAAC;CAEH,MAAM,oBACJ,SAAS,EACP,IAAI,aAAa,SACb,iBAAiB,oBACjB,iBAAiB,cACtB,CAAC;CAEJ,OACE,oBAAC,UAAD;EACE,aAAY;EACZ,IAAI;EACJ,SAAS;EACT,cAAA;EACA,eAAA;YAEA,oBAAC,SAAD;GAAS,OAAO,EAAE,oBAAoB;GAAE,WAAU;aAChD,oBAAC,QAAD;IACE,SAAQ;IACR,SAAS;IACT,IAAI;KACF,IAAI;KACJ,UAAU;KACV,OAAO;KACP,QAAQ;KACT;cAED,oBAAC,QAAD,EAAU,CAAA;IACH,CAAA;GACD,CAAA;EACD,CAAA"}

package/dist/esm/components/Skeleton/WidgetSkeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WidgetSkeleton.js","names":["createTheme"],"sources":["../../../../src/components/Skeleton/WidgetSkeleton.tsx"],"sourcesContent":["import { Skeleton, ThemeProvider, useMediaQuery } from '@mui/material'\nimport { type JSX, useMemo } from 'react'\nimport { createTheme } from '../../themes/createTheme.js'\nimport type { WidgetConfigPartialProps } from '../../types/widget.js'\nimport {\n AppExpandedContainer,\n FlexContainer,\n RelativeContainer,\n} from '../AppContainer.js'\nimport {\n SkeletonAmountContainer,\n SkeletonCard,\n SkeletonCardRow,\n SkeletonHeaderAppBar,\n SkeletonHeaderContainer,\n SkeletonInputCard,\n SkeletonPoweredByContainer,\n SkeletonReviewButton,\n SkeletonReviewButtonContainer,\n SkeletonSendToWalletButton,\n SkeletonWalletMenuButtonContainer,\n} from './WidgetSkeleton.style.js'\n\nconst SkeletonIcon = () => <Skeleton width={24} height={24} variant=\"rounded\" />\nconst SkeletonWalletMenuButton = () => (\n <SkeletonWalletMenuButtonContainer>\n <Skeleton width={98} height={24} variant=\"text\" />\n <SkeletonIcon />\n </SkeletonWalletMenuButtonContainer>\n)\n\ninterface SkeletonSelectCardProps {\n titleWidth?: number\n placeholderWidth?: number\n}\nconst SkeletonSelectCard = ({\n titleWidth = 36,\n placeholderWidth = 195,\n}: SkeletonSelectCardProps) => (\n <SkeletonCard elevation={0}>\n <Skeleton width={titleWidth} height={22} variant=\"text\" />\n <SkeletonCardRow>\n <Skeleton width={40} height={40} variant=\"circular\" />\n <Skeleton width={placeholderWidth} height={27} variant=\"text\" />\n </SkeletonCardRow>\n </SkeletonCard>\n)\n\nconst SkeletonYouPayCard = () => (\n <SkeletonInputCard elevation={0}>\n <Skeleton width={55} height={22} variant=\"text\" />\n <SkeletonCardRow>\n <Skeleton width={40} height={40} variant=\"circular\" />\n <SkeletonAmountContainer>\n <Skeleton\n width={48}\n height={37}\n variant=\"text\"\n sx={{ marginTop: -0.75 }}\n />\n <Skeleton width={48} height={12} variant=\"text\" />\n </SkeletonAmountContainer>\n </SkeletonCardRow>\n </SkeletonInputCard>\n)\n\nexport const WidgetSkeleton = ({\n config,\n}: WidgetConfigPartialProps): JSX.Element => {\n const appearance = config?.appearance\n const hiddenUI = config?.hiddenUI \|\| []\n const requiredUI = config?.requiredUI \|\| []\n const configTheme = config?.theme\n const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)')\n const appearanceMode =\n !appearance \|\| appearance === 'system'\n ? prefersDarkMode\n ? 'dark'\n : 'light'\n : appearance\n\n const theme = useMemo(() => createTheme(configTheme), [configTheme])\n\n return (\n <ThemeProvider\n theme={theme}\n defaultMode={appearanceMode}\n modeStorageKey=\"li.fi-widget-mode\"\n colorSchemeStorageKey=\"li.fi-widget-color-scheme\"\n disableTransitionOnChange\n >\n <AppExpandedContainer>\n <RelativeContainer sx={{ display: 'flex', flexDirection: 'column' }}>\n <SkeletonHeaderContainer>\n {!hiddenUI.includes('walletMenu') ? (\n <SkeletonHeaderAppBar>\n <SkeletonWalletMenuButton />\n </SkeletonHeaderAppBar>\n ) : null}\n <SkeletonHeaderAppBar\n sx={{ justifyContent: 'space-between', height: 52 }}\n >\n <Skeleton width={124} height={36} variant=\"text\" />\n <SkeletonIcon />\n </SkeletonHeaderAppBar>\n </SkeletonHeaderContainer>\n\n <FlexContainer\n sx={{\n gap: 2,\n paddingBottom: hiddenUI.includes('poweredBy') ? 3 : 2,\n }}\n >\n <SkeletonSelectCard />\n <SkeletonSelectCard />\n <SkeletonYouPayCard />\n {requiredUI.includes('toAddress') ? (\n <SkeletonSelectCard titleWidth={104} placeholderWidth={175} />\n ) : null}\n <SkeletonReviewButtonContainer>\n <SkeletonReviewButton variant=\"contained\" fullWidth>\n  \n </SkeletonReviewButton>\n {!requiredUI.includes('toAddress') ? (\n <SkeletonSendToWalletButton variant=\"text\" fullWidth>\n  \n </SkeletonSendToWalletButton>\n ) : null}\n </SkeletonReviewButtonContainer>\n </FlexContainer>\n {!hiddenUI.includes('poweredBy') ? (\n <SkeletonPoweredByContainer>\n <Skeleton width={96} height={18} variant=\"text\" />\n </SkeletonPoweredByContainer>\n ) : null}\n </RelativeContainer>\n </AppExpandedContainer>\n </ThemeProvider>\n )\n}\n"],"mappings":";;;;;;;AAuBA,MAAM,qBAAqB,oBAAC,UAAD;CAAU,OAAO;CAAI,QAAQ;CAAI,SAAQ;CAAY,CAAA;AAChF,MAAM,iCACJ,qBAAC,mCAAD,EAAA,UAAA,CACE,oBAAC,UAAD;CAAU,OAAO;CAAI,QAAQ;CAAI,SAAQ;CAAS,CAAA,EAClD,oBAAC,cAAD,EAAgB,CAAA,CACkB,EAAA,CAAA;AAOtC,MAAM,sBAAsB,EAC1B,aAAa,IACb,mBAAmB,UAEnB,qBAAC,cAAD;CAAc,WAAW;WAAzB,CACE,oBAAC,UAAD;EAAU,OAAO;EAAY,QAAQ;EAAI,SAAQ;EAAS,CAAA,EAC1D,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,UAAD;EAAU,OAAO;EAAI,QAAQ;EAAI,SAAQ;EAAa,CAAA,EACtD,oBAAC,UAAD;EAAU,OAAO;EAAkB,QAAQ;EAAI,SAAQ;EAAS,CAAA,CAChD,EAAA,CAAA,CACL;;AAGjB,MAAM,2BACJ,qBAAC,mBAAD;CAAmB,WAAW;WAA9B,CACE,oBAAC,UAAD;EAAU,OAAO;EAAI,QAAQ;EAAI,SAAQ;EAAS,CAAA,EAClD,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,UAAD;EAAU,OAAO;EAAI,QAAQ;EAAI,SAAQ;EAAa,CAAA,EACtD,qBAAC,yBAAD,EAAA,UAAA,CACE,oBAAC,UAAD;EACE,OAAO;EACP,QAAQ;EACR,SAAQ;EACR,IAAI,EAAE,WAAW,MAAO;EACxB,CAAA,EACF,oBAAC,UAAD;EAAU,OAAO;EAAI,QAAQ;EAAI,SAAQ;EAAS,CAAA,CAC1B,EAAA,CAAA,CACV,EAAA,CAAA,CACA;;AAGtB,MAAa,kBAAkB,EAC7B,aAC2C;CAC3C,MAAM,aAAa,QAAQ;CAC3B,MAAM,WAAW,QAAQ,YAAY,EAAE;CACvC,MAAM,aAAa,QAAQ,cAAc,EAAE;CAC3C,MAAM,cAAc,QAAQ;CAC5B,MAAM,kBAAkB,cAAc,+BAA+B;CACrE,MAAM,iBACJ,CAAC,cAAc,eAAe,WAC1B,kBACE,SACA,UACF;~~AAIN~~,~~QACE~~,oBAAC,eAAD;EACE,OAJU,cAAcA,cAAY,YAAY,EAAE,CAAC,YAAY,~~CAAC~~;~~EAKhE~~,aAAa;EACb,gBAAe;EACf,uBAAsB;EACtB,2BAAA;YAEA,oBAAC,sBAAD,EAAA,UACE,qBAAC,mBAAD;GAAmB,IAAI;IAAE,SAAS;IAAQ,eAAe;IAAU;aAAnE;IACE,qBAAC,yBAAD,EAAA,UAAA,CACG,CAAC,SAAS,SAAS,aAAa,GAC/B,oBAAC,sBAAD,EAAA,UACE,oBAAC,0BAAD,EAA4B,CAAA,EACP,CAAA,GACrB,MACJ,qBAAC,sBAAD;KACE,IAAI;MAAE,gBAAgB;MAAiB,QAAQ;MAAI;eADrD,CAGE,oBAAC,UAAD;MAAU,OAAO;MAAK,QAAQ;MAAI,SAAQ;MAAS,CAAA,EACnD,oBAAC,cAAD,EAAgB,CAAA,CACK;OACC,EAAA,CAAA;IAE1B,qBAAC,eAAD;KACE,IAAI;MACF,KAAK;MACL,eAAe,SAAS,SAAS,YAAY,GAAG,IAAI;MACrD;eAJH;MAME,oBAAC,oBAAD,EAAsB,CAAA;MACtB,oBAAC,oBAAD,EAAsB,CAAA;MACtB,oBAAC,oBAAD,EAAsB,CAAA;MACrB,WAAW,SAAS,YAAY,GAC/B,oBAAC,oBAAD;OAAoB,YAAY;OAAK,kBAAkB;OAAO,CAAA,GAC5D;MACJ,qBAAC,+BAAD,EAAA,UAAA,CACE,oBAAC,sBAAD;OAAsB,SAAQ;OAAY,WAAA;iBAAU;OAE7B,CAAA,EACtB,CAAC,WAAW,SAAS,YAAY,GAChC,oBAAC,4BAAD;OAA4B,SAAQ;OAAO,WAAA;iBAAU;OAExB,CAAA,GAC3B,KAC0B,EAAA,CAAA;MAClB;;IACf,CAAC,SAAS,SAAS,YAAY,GAC9B,oBAAC,4BAAD,EAAA,UACE,oBAAC,UAAD;KAAU,OAAO;KAAI,QAAQ;KAAI,SAAQ;KAAS,CAAA,EACvB,CAAA,GAC3B;IACc;MACC,CAAA;EACT,CAAA"}
1	+ {"version":3,"file":"WidgetSkeleton.js","names":["createTheme"],"sources":["../../../../src/components/Skeleton/WidgetSkeleton.tsx"],"sourcesContent":["import { Skeleton, ThemeProvider, useMediaQuery } from '@mui/material'\nimport { type JSX, useMemo } from 'react'\nimport { createTheme } from '../../themes/createTheme.js'\nimport type { WidgetConfigPartialProps } from '../../types/widget.js'\nimport {\n AppExpandedContainer,\n FlexContainer,\n RelativeContainer,\n} from '../AppContainer.js'\nimport {\n SkeletonAmountContainer,\n SkeletonCard,\n SkeletonCardRow,\n SkeletonHeaderAppBar,\n SkeletonHeaderContainer,\n SkeletonInputCard,\n SkeletonPoweredByContainer,\n SkeletonReviewButton,\n SkeletonReviewButtonContainer,\n SkeletonSendToWalletButton,\n SkeletonWalletMenuButtonContainer,\n} from './WidgetSkeleton.style.js'\n\nconst SkeletonIcon = () => <Skeleton width={24} height={24} variant=\"rounded\" />\nconst SkeletonWalletMenuButton = () => (\n <SkeletonWalletMenuButtonContainer>\n <Skeleton width={98} height={24} variant=\"text\" />\n <SkeletonIcon />\n </SkeletonWalletMenuButtonContainer>\n)\n\ninterface SkeletonSelectCardProps {\n titleWidth?: number\n placeholderWidth?: number\n}\nconst SkeletonSelectCard = ({\n titleWidth = 36,\n placeholderWidth = 195,\n}: SkeletonSelectCardProps) => (\n <SkeletonCard elevation={0}>\n <Skeleton width={titleWidth} height={22} variant=\"text\" />\n <SkeletonCardRow>\n <Skeleton width={40} height={40} variant=\"circular\" />\n <Skeleton width={placeholderWidth} height={27} variant=\"text\" />\n </SkeletonCardRow>\n </SkeletonCard>\n)\n\nconst SkeletonYouPayCard = () => (\n <SkeletonInputCard elevation={0}>\n <Skeleton width={55} height={22} variant=\"text\" />\n <SkeletonCardRow>\n <Skeleton width={40} height={40} variant=\"circular\" />\n <SkeletonAmountContainer>\n <Skeleton\n width={48}\n height={37}\n variant=\"text\"\n sx={{ marginTop: -0.75 }}\n />\n <Skeleton width={48} height={12} variant=\"text\" />\n </SkeletonAmountContainer>\n </SkeletonCardRow>\n </SkeletonInputCard>\n)\n\nexport const WidgetSkeleton = ({\n config,\n}: WidgetConfigPartialProps): JSX.Element => {\n const appearance = config?.appearance\n const hiddenUI = config?.hiddenUI \|\| []\n const requiredUI = config?.requiredUI \|\| []\n const configTheme = config?.theme\n const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)')\n const appearanceMode =\n !appearance \|\| appearance === 'system'\n ? prefersDarkMode\n ? 'dark'\n : 'light'\n : appearance\n\n const theme = useMemo(() => createTheme(configTheme), [configTheme])\n\n return (\n <ThemeProvider\n theme={theme}\n defaultMode={appearanceMode}\n modeStorageKey=\"li.fi-widget-mode\"\n colorSchemeStorageKey=\"li.fi-widget-color-scheme\"\n disableTransitionOnChange\n >\n <AppExpandedContainer>\n <RelativeContainer sx={{ display: 'flex', flexDirection: 'column' }}>\n <SkeletonHeaderContainer>\n {!hiddenUI.includes('walletMenu') ? (\n <SkeletonHeaderAppBar>\n <SkeletonWalletMenuButton />\n </SkeletonHeaderAppBar>\n ) : null}\n <SkeletonHeaderAppBar\n sx={{ justifyContent: 'space-between', height: 52 }}\n >\n <Skeleton width={124} height={36} variant=\"text\" />\n <SkeletonIcon />\n </SkeletonHeaderAppBar>\n </SkeletonHeaderContainer>\n\n <FlexContainer\n sx={{\n gap: 2,\n paddingBottom: hiddenUI.includes('poweredBy') ? 3 : 2,\n }}\n >\n <SkeletonSelectCard />\n <SkeletonSelectCard />\n <SkeletonYouPayCard />\n {requiredUI.includes('toAddress') ? (\n <SkeletonSelectCard titleWidth={104} placeholderWidth={175} />\n ) : null}\n <SkeletonReviewButtonContainer>\n <SkeletonReviewButton variant=\"contained\" fullWidth>\n  \n </SkeletonReviewButton>\n {!requiredUI.includes('toAddress') ? (\n <SkeletonSendToWalletButton variant=\"text\" fullWidth>\n  \n </SkeletonSendToWalletButton>\n ) : null}\n </SkeletonReviewButtonContainer>\n </FlexContainer>\n {!hiddenUI.includes('poweredBy') ? (\n <SkeletonPoweredByContainer>\n <Skeleton width={96} height={18} variant=\"text\" />\n </SkeletonPoweredByContainer>\n ) : null}\n </RelativeContainer>\n </AppExpandedContainer>\n </ThemeProvider>\n )\n}\n"],"mappings":"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"}

package/dist/esm/components/Skeleton/WidgetSkeleton.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WidgetSkeleton.style.js","names":["MuiCard"],"sources":["../../../../src/components/Skeleton/WidgetSkeleton.style.tsx"],"sourcesContent":["import { Box, Button, Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\n\nexport const SkeletonHeaderAppBar: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'flex-end',\n alignItems: 'center',\n color: theme.vars?.palette?.text.primary,\n paddingRight: theme.navigation?.edge ? 0 : theme.spacing?.(1),\n }))\n\nexport const SkeletonWalletMenuButtonContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(1, 0, 1, 1.5),\n gap: theme.spacing(1),\n}))\n\nexport const SkeletonCardRow: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(2),\n alignItems: 'center',\n marginTop: theme.spacing(1.5),\n }))\n\nexport const SkeletonAmountContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)({\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n height: 40,\n overflowY: 'hidden',\n})\n\nexport const SkeletonCard: React.FC<React.ComponentProps<typeof MuiCard>> =\n styled(MuiCard)(({ theme }) => ({\n padding: theme.spacing(1.5, 2, 2),\n }))\n\nexport const SkeletonInputCard: React.FC<\n React.ComponentProps<typeof InputCard>\n> = styled(InputCard)(({ theme }) => ({\n padding: theme.spacing(1.5, 2, 2),\n}))\n\nexport const SkeletonReviewButtonContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(1.5),\n alignItems: 'center',\n}))\n\nexport const SkeletonReviewButton: React.FC<\n React.ComponentProps<typeof Button>\n> = styled(Button)({\n height: 48,\n pointerEvents: 'none',\n})\nexport const SkeletonSendToWalletButton: React.FC<\n React.ComponentProps<typeof Button>\n> = styled(Button)({\n height: 48,\n minWidth: 48,\n width: 48,\n pointerEvents: 'none',\n})\n\nexport const SkeletonPoweredByContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n alignItems: 'flex-end',\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(3),\n paddingRight: theme.spacing(3),\n}))\n\nexport const SkeletonHeaderContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => {\n return {\n display: 'flex',\n flexDirection: 'column',\n backgroundColor: theme.vars.palette.background.default,\n position: 'relative',\n top: 0,\n zIndex: 1200,\n gap: theme.spacing(0.5),\n padding: theme.spacing(1.5, 3, 1.5, 3),\n overflow: 'auto',\n }\n})\n"],"mappings":";;;AAIA,MAAa,uBACX,OAAO,IAAI,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,eAAe;CACf,gBAAgB;CAChB,YAAY;CACZ,OAAO,MAAM,MAAM,SAAS,KAAK;CACjC,cAAc,MAAM,YAAY,OAAO,IAAI,MAAM,UAAU,EAAE;CAC9D,EAAE;AAEL,MAAa,oCAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,YAAY;CACZ,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,IAAI;CACpC,KAAK,MAAM,QAAQ,EAAE;CACtB,EAAE;AAEH,MAAa,kBACX,OAAO,IAAI,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,KAAK,MAAM,QAAQ,EAAE;CACrB,YAAY;CACZ,WAAW,MAAM,QAAQ,IAAI;CAC9B,EAAE;AAEL,MAAa,0BAET,OAAO,IAAI,CAAC;CACd,SAAS;CACT,eAAe;CACf,gBAAgB;CAChB,QAAQ;CACR,WAAW;CACZ,CAAC;AAEF,MAAa,eACX,OAAOA,KAAQ,EAAE,EAAE,aAAa,EAC9B,SAAS,MAAM,QAAQ,KAAK,GAAG,EAAE,EAClC,EAAE;AAEL,MAAa,oBAET,OAAO,UAAU,EAAE,EAAE,aAAa,EACpC,SAAS,MAAM,QAAQ,KAAK,GAAG,EAAE,EAClC,EAAE;AAEH,MAAa,gCAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,KAAK,MAAM,QAAQ,IAAI;CACvB,YAAY;CACb,EAAE;AAEH,MAAa,uBAET,OAAO,OAAO,CAAC;CACjB,QAAQ;CACR,eAAe;CAChB,CAAC;AACF,MAAa,6BAET,OAAO,OAAO,CAAC;CACjB,QAAQ;CACR,UAAU;CACV,OAAO;CACP,eAAe;CAChB,CAAC;AAEF,MAAa,6BAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,UAAU;CACV,gBAAgB;CAChB,YAAY;CACZ,eAAe,MAAM,QAAQ,EAAE;CAC/B,aAAa,MAAM,QAAQ,EAAE;CAC7B,cAAc,MAAM,QAAQ,EAAE;CAC/B,EAAE;AAEH,MAAa,0BAET,OAAO,IAAI,EAAE,EAAE,YAAY;~~AAC7B~~,~~QAAO~~;EACL,SAAS;EACT,eAAe;EACf,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU;EACV,KAAK;EACL,QAAQ;EACR,KAAK,MAAM,QAAQ,GAAI;EACvB,SAAS,MAAM,QAAQ,KAAK,GAAG,KAAK,EAAE;EACtC,UAAU;EACX;EACD"}
1	+ {"version":3,"file":"WidgetSkeleton.style.js","names":["MuiCard"],"sources":["../../../../src/components/Skeleton/WidgetSkeleton.style.tsx"],"sourcesContent":["import { Box, Button, Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\n\nexport const SkeletonHeaderAppBar: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'flex-end',\n alignItems: 'center',\n color: theme.vars?.palette?.text.primary,\n paddingRight: theme.navigation?.edge ? 0 : theme.spacing?.(1),\n }))\n\nexport const SkeletonWalletMenuButtonContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(1, 0, 1, 1.5),\n gap: theme.spacing(1),\n}))\n\nexport const SkeletonCardRow: React.FC<React.ComponentProps<typeof Box>> =\n styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(2),\n alignItems: 'center',\n marginTop: theme.spacing(1.5),\n }))\n\nexport const SkeletonAmountContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)({\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n height: 40,\n overflowY: 'hidden',\n})\n\nexport const SkeletonCard: React.FC<React.ComponentProps<typeof MuiCard>> =\n styled(MuiCard)(({ theme }) => ({\n padding: theme.spacing(1.5, 2, 2),\n }))\n\nexport const SkeletonInputCard: React.FC<\n React.ComponentProps<typeof InputCard>\n> = styled(InputCard)(({ theme }) => ({\n padding: theme.spacing(1.5, 2, 2),\n}))\n\nexport const SkeletonReviewButtonContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n gap: theme.spacing(1.5),\n alignItems: 'center',\n}))\n\nexport const SkeletonReviewButton: React.FC<\n React.ComponentProps<typeof Button>\n> = styled(Button)({\n height: 48,\n pointerEvents: 'none',\n})\nexport const SkeletonSendToWalletButton: React.FC<\n React.ComponentProps<typeof Button>\n> = styled(Button)({\n height: 48,\n minWidth: 48,\n width: 48,\n pointerEvents: 'none',\n})\n\nexport const SkeletonPoweredByContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexGrow: 1,\n justifyContent: 'flex-end',\n alignItems: 'flex-end',\n paddingBottom: theme.spacing(2),\n paddingLeft: theme.spacing(3),\n paddingRight: theme.spacing(3),\n}))\n\nexport const SkeletonHeaderContainer: React.FC<\n React.ComponentProps<typeof Box>\n> = styled(Box)(({ theme }) => {\n return {\n display: 'flex',\n flexDirection: 'column',\n backgroundColor: theme.vars.palette.background.default,\n position: 'relative',\n top: 0,\n zIndex: 1200,\n gap: theme.spacing(0.5),\n padding: theme.spacing(1.5, 3, 1.5, 3),\n overflow: 'auto',\n }\n})\n"],"mappings":";;;AAIA,MAAa,uBACX,OAAO,IAAI,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,eAAe;CACf,gBAAgB;CAChB,YAAY;CACZ,OAAO,MAAM,MAAM,SAAS,KAAK;CACjC,cAAc,MAAM,YAAY,OAAO,IAAI,MAAM,UAAU,EAAE;CAC9D,EAAE;AAEL,MAAa,oCAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,YAAY;CACZ,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,IAAI;CACpC,KAAK,MAAM,QAAQ,EAAE;CACtB,EAAE;AAEH,MAAa,kBACX,OAAO,IAAI,EAAE,EAAE,aAAa;CAC1B,SAAS;CACT,KAAK,MAAM,QAAQ,EAAE;CACrB,YAAY;CACZ,WAAW,MAAM,QAAQ,IAAI;CAC9B,EAAE;AAEL,MAAa,0BAET,OAAO,IAAI,CAAC;CACd,SAAS;CACT,eAAe;CACf,gBAAgB;CAChB,QAAQ;CACR,WAAW;CACZ,CAAC;AAEF,MAAa,eACX,OAAOA,KAAQ,EAAE,EAAE,aAAa,EAC9B,SAAS,MAAM,QAAQ,KAAK,GAAG,EAAE,EAClC,EAAE;AAEL,MAAa,oBAET,OAAO,UAAU,EAAE,EAAE,aAAa,EACpC,SAAS,MAAM,QAAQ,KAAK,GAAG,EAAE,EAClC,EAAE;AAEH,MAAa,gCAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,KAAK,MAAM,QAAQ,IAAI;CACvB,YAAY;CACb,EAAE;AAEH,MAAa,uBAET,OAAO,OAAO,CAAC;CACjB,QAAQ;CACR,eAAe;CAChB,CAAC;AACF,MAAa,6BAET,OAAO,OAAO,CAAC;CACjB,QAAQ;CACR,UAAU;CACV,OAAO;CACP,eAAe;CAChB,CAAC;AAEF,MAAa,6BAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,SAAS;CACT,UAAU;CACV,gBAAgB;CAChB,YAAY;CACZ,eAAe,MAAM,QAAQ,EAAE;CAC/B,aAAa,MAAM,QAAQ,EAAE;CAC7B,cAAc,MAAM,QAAQ,EAAE;CAC/B,EAAE;AAEH,MAAa,0BAET,OAAO,IAAI,EAAE,EAAE,YAAY;CAC7B,OAAO;EACL,SAAS;EACT,eAAe;EACf,iBAAiB,MAAM,KAAK,QAAQ,WAAW;EAC/C,UAAU;EACV,KAAK;EACL,QAAQ;EACR,KAAK,MAAM,QAAQ,GAAI;EACvB,SAAS,MAAM,QAAQ,KAAK,GAAG,KAAK,EAAE;EACtC,UAAU;EACX;EACD"}

package/dist/esm/components/Step/CircularProgress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CircularProgress.js","names":[],"sources":["../../../../src/components/Step/CircularProgress.tsx"],"sourcesContent":["import type { ExecutionAction } from '@lifi/sdk'\nimport Done from '@mui/icons-material/Done'\nimport ErrorRounded from '@mui/icons-material/ErrorRounded'\nimport InfoRounded from '@mui/icons-material/InfoRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport {\n CircularIcon,\n CircularProgressPending,\n} from './CircularProgress.style.js'\n\nexport function CircularProgress({ action }: { action: ExecutionAction }): any {\n return (\n <CircularIcon status={action.status} substatus={action.substatus}>\n {action.status === 'STARTED' \|\| action.status === 'PENDING' ? (\n <CircularProgressPending size={40} />\n ) : null}\n {action.status === 'ACTION_REQUIRED' \|\|\n action.status === 'MESSAGE_REQUIRED' \|\|\n action.status === 'RESET_REQUIRED' ? (\n <InfoRounded\n color=\"info\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n {action.status === 'DONE' &&\n (action.substatus === 'PARTIAL' \|\| action.substatus === 'REFUNDED') ? (\n <WarningRounded\n sx={(theme) => ({\n position: 'absolute',\n fontSize: '1.5rem',\n color: `color-mix(in srgb, ${theme.vars.palette.warning.main} 68%, black)`,\n })}\n />\n ) : action.status === 'DONE' ? (\n <Done\n color=\"success\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n {action.status === 'FAILED' ? (\n <ErrorRounded\n color=\"error\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n </CircularIcon>\n )\n}\n"],"mappings":";;;;;;;AAUA,SAAgB,iBAAiB,EAAE,UAA4C;~~AAC7E~~,~~QACE~~,qBAAC,cAAD;EAAc,QAAQ,OAAO;EAAQ,WAAW,OAAO;YAAvD;GACG,OAAO,WAAW,aAAa,OAAO,WAAW,YAChD,oBAAC,yBAAD,EAAyB,MAAM,IAAM,CAAA,GACnC;GACH,OAAO,WAAW,qBACnB,OAAO,WAAW,sBAClB,OAAO,WAAW,mBAChB,oBAAC,aAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACH,OAAO,WAAW,WAClB,OAAO,cAAc,aAAa,OAAO,cAAc,cACtD,oBAAC,gBAAD,EACE,KAAK,WAAW;IACd,UAAU;IACV,UAAU;IACV,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC9D,GACD,CAAA,GACA,OAAO,WAAW,SACpB,oBAAC,MAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACH,OAAO,WAAW,WACjB,oBAAC,cAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACS"}
1	+ {"version":3,"file":"CircularProgress.js","names":[],"sources":["../../../../src/components/Step/CircularProgress.tsx"],"sourcesContent":["import type { ExecutionAction } from '@lifi/sdk'\nimport Done from '@mui/icons-material/Done'\nimport ErrorRounded from '@mui/icons-material/ErrorRounded'\nimport InfoRounded from '@mui/icons-material/InfoRounded'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport {\n CircularIcon,\n CircularProgressPending,\n} from './CircularProgress.style.js'\n\nexport function CircularProgress({ action }: { action: ExecutionAction }): any {\n return (\n <CircularIcon status={action.status} substatus={action.substatus}>\n {action.status === 'STARTED' \|\| action.status === 'PENDING' ? (\n <CircularProgressPending size={40} />\n ) : null}\n {action.status === 'ACTION_REQUIRED' \|\|\n action.status === 'MESSAGE_REQUIRED' \|\|\n action.status === 'RESET_REQUIRED' ? (\n <InfoRounded\n color=\"info\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n {action.status === 'DONE' &&\n (action.substatus === 'PARTIAL' \|\| action.substatus === 'REFUNDED') ? (\n <WarningRounded\n sx={(theme) => ({\n position: 'absolute',\n fontSize: '1.5rem',\n color: `color-mix(in srgb, ${theme.vars.palette.warning.main} 68%, black)`,\n })}\n />\n ) : action.status === 'DONE' ? (\n <Done\n color=\"success\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n {action.status === 'FAILED' ? (\n <ErrorRounded\n color=\"error\"\n sx={{\n position: 'absolute',\n fontSize: '1.5rem',\n }}\n />\n ) : null}\n </CircularIcon>\n )\n}\n"],"mappings":";;;;;;;AAUA,SAAgB,iBAAiB,EAAE,UAA4C;CAC7E,OACE,qBAAC,cAAD;EAAc,QAAQ,OAAO;EAAQ,WAAW,OAAO;YAAvD;GACG,OAAO,WAAW,aAAa,OAAO,WAAW,YAChD,oBAAC,yBAAD,EAAyB,MAAM,IAAM,CAAA,GACnC;GACH,OAAO,WAAW,qBACnB,OAAO,WAAW,sBAClB,OAAO,WAAW,mBAChB,oBAAC,aAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACH,OAAO,WAAW,WAClB,OAAO,cAAc,aAAa,OAAO,cAAc,cACtD,oBAAC,gBAAD,EACE,KAAK,WAAW;IACd,UAAU;IACV,UAAU;IACV,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;IAC9D,GACD,CAAA,GACA,OAAO,WAAW,SACpB,oBAAC,MAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACH,OAAO,WAAW,WACjB,oBAAC,cAAD;IACE,OAAM;IACN,IAAI;KACF,UAAU;KACV,UAAU;KACX;IACD,CAAA,GACA;GACS"}

package/dist/esm/components/Step/CircularProgress.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CircularProgress.style.js","names":["MuiCircularProgress"],"sources":["../../../../src/components/Step/CircularProgress.style.tsx"],"sourcesContent":["import type { ExecutionActionStatus, Substatus } from '@lifi/sdk'\nimport type { Theme } from '@mui/material'\nimport {\n Box,\n circularProgressClasses,\n keyframes,\n CircularProgress as MuiCircularProgress,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nconst getStatusColor = (\n theme: Theme,\n status?: ExecutionActionStatus,\n substatus?: Substatus\n) => {\n switch (status) {\n case 'ACTION_REQUIRED':\n case 'MESSAGE_REQUIRED':\n case 'RESET_REQUIRED':\n return `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`\n case 'DONE':\n if (substatus === 'PARTIAL' \|\| substatus === 'REFUNDED') {\n return `color-mix(in srgb, ${theme.vars.palette.warning.main} 48%, transparent)`\n }\n return `color-mix(in srgb, ${theme.vars.palette.success.main} 12%, transparent)`\n case 'FAILED':\n return `color-mix(in srgb, ${theme.vars.palette.error.main} 12%, transparent)`\n default:\n return null\n }\n}\n\nexport const CircularIcon: React.FC<\n React.ComponentProps<typeof Box> & {\n status?: ExecutionActionStatus\n substatus?: Substatus\n }\n> = styled(Box, {\n shouldForwardProp: (prop: string) => !['status', 'substatus'].includes(prop),\n})<{ status?: ExecutionActionStatus; substatus?: Substatus }>(\n ({ theme, status, substatus }) => {\n const statusColor = getStatusColor(theme, status, substatus)\n const isSpecialStatus = [\n 'ACTION_REQUIRED',\n 'MESSAGE_REQUIRED',\n 'RESET_REQUIRED',\n 'DONE',\n 'FAILED',\n ].includes(status!)\n\n return {\n backgroundColor: isSpecialStatus\n ? statusColor!\n : theme.vars.palette.background.paper,\n borderStyle: 'solid',\n borderColor: statusColor \|\| theme.vars.palette.grey[300],\n borderWidth: !isSpecialStatus ? 3 : 0,\n display: 'grid',\n position: 'relative',\n placeItems: 'center',\n width: 40,\n height: 40,\n borderRadius: '50%',\n ...theme.applyStyles('dark', {\n borderColor: statusColor \|\| theme.vars.palette.grey[800],\n }),\n }\n }\n)\n\nconst circleAnimation = keyframes`\n 0% {\n stroke-dashoffset: 129;\n transform: rotate(0);\n }\n 50% {\n stroke-dashoffset: 56;\n transform: rotate(45deg);\n };\n 100% {\n stroke-dashoffset: 129;\n transform: rotate(360deg);\n }\n`\n\n// This `styled()` function invokes keyframes. `styled-components` only supports keyframes\n// in string templates. Do not convert these styles in JS object as it will break.\nexport const CircularProgressPending: React.FC<\n React.ComponentProps<typeof MuiCircularProgress>\n> = styled(MuiCircularProgress)`\n color: ${({ theme }) => theme.vars.palette.primary.main};\n ${({ theme }) =>\n theme.applyStyles('dark', {\n color: theme.vars.palette.primary.light,\n })}\n animation-duration: 3s;\n position: absolute;\n .${circularProgressClasses.circle} {\n animation-duration: 2s;\n animation-timing-function: linear;\n animation-name: ${circleAnimation};\n stroke-dasharray: 129;\n stroke-dashoffset: 129;\n stroke-linecap: round;\n transform-origin: 100% 100%;\n }\n`\n"],"mappings":";;AAWA,MAAM,kBACJ,OACA,QACA,cACG;~~AACH~~,~~SAAQ~~,QAAR;EACE,KAAK;EACL,KAAK;EACL,KAAK,~~iBACH~~,~~QAAO~~,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;EAC5D,KAAK;~~AACH~~,~~OAAI~~,cAAc,aAAa,cAAc,~~WAC3C~~,~~QAAO~~,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;~~AAE~~/D,~~UAAO~~,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;EAC/D,KAAK,~~SACH~~,~~QAAO~~,sBAAsB,MAAM,KAAK,QAAQ,MAAM,KAAK;EAC7D,~~QACE~~,~~QAAO~~;;;AAIb,MAAa,eAKT,OAAO,KAAK,EACd,oBAAoB,SAAiB,CAAC,CAAC,UAAU,YAAY,CAAC,SAAS,KAAK,EAC7E,CAAC,EACC,EAAE,OAAO,QAAQ,gBAAgB;CAChC,MAAM,cAAc,eAAe,OAAO,QAAQ,UAAU;CAC5D,MAAM,kBAAkB;EACtB;EACA;EACA;EACA;EACA;EACD,CAAC,SAAS,OAAQ;~~AAEnB~~,~~QAAO~~;EACL,iBAAiB,kBACb,cACA,MAAM,KAAK,QAAQ,WAAW;EAClC,aAAa;EACb,aAAa,eAAe,MAAM,KAAK,QAAQ,KAAK;EACpD,aAAa,CAAC,kBAAkB,IAAI;EACpC,SAAS;EACT,UAAU;EACV,YAAY;EACZ,OAAO;EACP,QAAQ;EACR,cAAc;EACd,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,eAAe,MAAM,KAAK,QAAQ,KAAK,MACrD,CAAC;EACH;EAEJ;AAED,MAAM,kBAAkB,SAAS;;;;;;;;;;;;;;AAiBjC,MAAa,0BAET,OAAOA,iBAAoB;YACnB,EAAE,YAAY,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACrD,EAAE,YACH,MAAM,YAAY,QAAQ,EACxB,OAAO,MAAM,KAAK,QAAQ,QAAQ,OACnC,CAAC,CAAC;;;KAGF,wBAAwB,OAAO;;;sBAGd,gBAAgB"}
1	+ {"version":3,"file":"CircularProgress.style.js","names":["MuiCircularProgress"],"sources":["../../../../src/components/Step/CircularProgress.style.tsx"],"sourcesContent":["import type { ExecutionActionStatus, Substatus } from '@lifi/sdk'\nimport type { Theme } from '@mui/material'\nimport {\n Box,\n circularProgressClasses,\n keyframes,\n CircularProgress as MuiCircularProgress,\n styled,\n} from '@mui/material'\nimport type React from 'react'\n\nconst getStatusColor = (\n theme: Theme,\n status?: ExecutionActionStatus,\n substatus?: Substatus\n) => {\n switch (status) {\n case 'ACTION_REQUIRED':\n case 'MESSAGE_REQUIRED':\n case 'RESET_REQUIRED':\n return `color-mix(in srgb, ${theme.vars.palette.info.main} 12%, transparent)`\n case 'DONE':\n if (substatus === 'PARTIAL' \|\| substatus === 'REFUNDED') {\n return `color-mix(in srgb, ${theme.vars.palette.warning.main} 48%, transparent)`\n }\n return `color-mix(in srgb, ${theme.vars.palette.success.main} 12%, transparent)`\n case 'FAILED':\n return `color-mix(in srgb, ${theme.vars.palette.error.main} 12%, transparent)`\n default:\n return null\n }\n}\n\nexport const CircularIcon: React.FC<\n React.ComponentProps<typeof Box> & {\n status?: ExecutionActionStatus\n substatus?: Substatus\n }\n> = styled(Box, {\n shouldForwardProp: (prop: string) => !['status', 'substatus'].includes(prop),\n})<{ status?: ExecutionActionStatus; substatus?: Substatus }>(\n ({ theme, status, substatus }) => {\n const statusColor = getStatusColor(theme, status, substatus)\n const isSpecialStatus = [\n 'ACTION_REQUIRED',\n 'MESSAGE_REQUIRED',\n 'RESET_REQUIRED',\n 'DONE',\n 'FAILED',\n ].includes(status!)\n\n return {\n backgroundColor: isSpecialStatus\n ? statusColor!\n : theme.vars.palette.background.paper,\n borderStyle: 'solid',\n borderColor: statusColor \|\| theme.vars.palette.grey[300],\n borderWidth: !isSpecialStatus ? 3 : 0,\n display: 'grid',\n position: 'relative',\n placeItems: 'center',\n width: 40,\n height: 40,\n borderRadius: '50%',\n ...theme.applyStyles('dark', {\n borderColor: statusColor \|\| theme.vars.palette.grey[800],\n }),\n }\n }\n)\n\nconst circleAnimation = keyframes`\n 0% {\n stroke-dashoffset: 129;\n transform: rotate(0);\n }\n 50% {\n stroke-dashoffset: 56;\n transform: rotate(45deg);\n };\n 100% {\n stroke-dashoffset: 129;\n transform: rotate(360deg);\n }\n`\n\n// This `styled()` function invokes keyframes. `styled-components` only supports keyframes\n// in string templates. Do not convert these styles in JS object as it will break.\nexport const CircularProgressPending: React.FC<\n React.ComponentProps<typeof MuiCircularProgress>\n> = styled(MuiCircularProgress)`\n color: ${({ theme }) => theme.vars.palette.primary.main};\n ${({ theme }) =>\n theme.applyStyles('dark', {\n color: theme.vars.palette.primary.light,\n })}\n animation-duration: 3s;\n position: absolute;\n .${circularProgressClasses.circle} {\n animation-duration: 2s;\n animation-timing-function: linear;\n animation-name: ${circleAnimation};\n stroke-dasharray: 129;\n stroke-dashoffset: 129;\n stroke-linecap: round;\n transform-origin: 100% 100%;\n }\n`\n"],"mappings":";;AAWA,MAAM,kBACJ,OACA,QACA,cACG;CACH,QAAQ,QAAR;EACE,KAAK;EACL,KAAK;EACL,KAAK,kBACH,OAAO,sBAAsB,MAAM,KAAK,QAAQ,KAAK,KAAK;EAC5D,KAAK;GACH,IAAI,cAAc,aAAa,cAAc,YAC3C,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;GAE/D,OAAO,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;EAC/D,KAAK,UACH,OAAO,sBAAsB,MAAM,KAAK,QAAQ,MAAM,KAAK;EAC7D,SACE,OAAO;;;AAIb,MAAa,eAKT,OAAO,KAAK,EACd,oBAAoB,SAAiB,CAAC,CAAC,UAAU,YAAY,CAAC,SAAS,KAAK,EAC7E,CAAC,EACC,EAAE,OAAO,QAAQ,gBAAgB;CAChC,MAAM,cAAc,eAAe,OAAO,QAAQ,UAAU;CAC5D,MAAM,kBAAkB;EACtB;EACA;EACA;EACA;EACA;EACD,CAAC,SAAS,OAAQ;CAEnB,OAAO;EACL,iBAAiB,kBACb,cACA,MAAM,KAAK,QAAQ,WAAW;EAClC,aAAa;EACb,aAAa,eAAe,MAAM,KAAK,QAAQ,KAAK;EACpD,aAAa,CAAC,kBAAkB,IAAI;EACpC,SAAS;EACT,UAAU;EACV,YAAY;EACZ,OAAO;EACP,QAAQ;EACR,cAAc;EACd,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,eAAe,MAAM,KAAK,QAAQ,KAAK,MACrD,CAAC;EACH;EAEJ;AAED,MAAM,kBAAkB,SAAS;;;;;;;;;;;;;;AAiBjC,MAAa,0BAET,OAAOA,iBAAoB;YACnB,EAAE,YAAY,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACrD,EAAE,YACH,MAAM,YAAY,QAAQ,EACxB,OAAO,MAAM,KAAK,QAAQ,QAAQ,OACnC,CAAC,CAAC;;;KAGF,wBAAwB,OAAO;;;sBAGd,gBAAgB"}

package/dist/esm/components/Step/DestinationWalletAddress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DestinationWalletAddress.js","names":[],"sources":["../../../../src/components/Step/DestinationWalletAddress.tsx"],"sourcesContent":["import type { LiFiStepExtended } from '@lifi/sdk'\nimport LinkRounded from '@mui/icons-material/LinkRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, Link, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CircularIcon } from './CircularProgress.style.js'\n\nexport const DestinationWalletAddress: React.FC<{\n step: LiFiStepExtended\n toAddress: string\n toAddressLink: string\n}> = ({ step, toAddress, toAddressLink }) => {\n const { t } = useTranslation()\n const isDone = step.execution?.status === 'DONE'\n return (\n <Box\n sx={{\n px: 2,\n py: 1,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <CircularIcon status={isDone ? 'DONE' : undefined}>\n <Wallet\n color={isDone ? 'success' : 'inherit'}\n sx={{\n position: 'absolute',\n fontSize: '1.25rem',\n }}\n />\n </CircularIcon>\n <Typography\n sx={{\n mx: 2,\n flex: 1,\n fontSize: 14,\n fontWeight: 400,\n }}\n >\n {isDone\n ? t('main.sentToAddress', {\n address: toAddress,\n })\n : t('main.sendToAddress', {\n address: toAddress,\n })}\n </Typography>\n <CardIconButton\n size=\"medium\"\n LinkComponent={Link}\n href={toAddressLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <LinkRounded />\n </CardIconButton>\n </Box>\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,4BAIP,EAAE,MAAM,WAAW,oBAAoB;CAC3C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,SAAS,KAAK,WAAW,WAAW;~~AAC1C~~,~~QACE~~,oBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACL;YAED,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACb;aAJH;IAME,oBAAC,cAAD;KAAc,QAAQ,SAAS,SAAS,KAAA;eACtC,oBAAC,QAAD;MACE,OAAO,SAAS,YAAY;MAC5B,IAAI;OACF,UAAU;OACV,UAAU;OACX;MACD,CAAA;KACW,CAAA;IACf,oBAAC,YAAD;KACE,IAAI;MACF,IAAI;MACJ,MAAM;MACN,UAAU;MACV,YAAY;MACb;eAEA,SACG,EAAE,sBAAsB,EACtB,SAAS,WACV,CAAC,GACF,EAAE,sBAAsB,EACtB,SAAS,WACV,CAAC;KACK,CAAA;IACb,oBAAC,gBAAD;KACE,MAAK;KACL,eAAe;KACf,MAAM;KACN,QAAO;KACP,KAAI;eAEJ,oBAAC,aAAD,EAAe,CAAA;KACA,CAAA;IACb;;EACF,CAAA"}
1	+ {"version":3,"file":"DestinationWalletAddress.js","names":[],"sources":["../../../../src/components/Step/DestinationWalletAddress.tsx"],"sourcesContent":["import type { LiFiStepExtended } from '@lifi/sdk'\nimport LinkRounded from '@mui/icons-material/LinkRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, Link, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CircularIcon } from './CircularProgress.style.js'\n\nexport const DestinationWalletAddress: React.FC<{\n step: LiFiStepExtended\n toAddress: string\n toAddressLink: string\n}> = ({ step, toAddress, toAddressLink }) => {\n const { t } = useTranslation()\n const isDone = step.execution?.status === 'DONE'\n return (\n <Box\n sx={{\n px: 2,\n py: 1,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <CircularIcon status={isDone ? 'DONE' : undefined}>\n <Wallet\n color={isDone ? 'success' : 'inherit'}\n sx={{\n position: 'absolute',\n fontSize: '1.25rem',\n }}\n />\n </CircularIcon>\n <Typography\n sx={{\n mx: 2,\n flex: 1,\n fontSize: 14,\n fontWeight: 400,\n }}\n >\n {isDone\n ? t('main.sentToAddress', {\n address: toAddress,\n })\n : t('main.sendToAddress', {\n address: toAddress,\n })}\n </Typography>\n <CardIconButton\n size=\"medium\"\n LinkComponent={Link}\n href={toAddressLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <LinkRounded />\n </CardIconButton>\n </Box>\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,4BAIP,EAAE,MAAM,WAAW,oBAAoB;CAC3C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,SAAS,KAAK,WAAW,WAAW;CAC1C,OACE,oBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACL;YAED,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACb;aAJH;IAME,oBAAC,cAAD;KAAc,QAAQ,SAAS,SAAS,KAAA;eACtC,oBAAC,QAAD;MACE,OAAO,SAAS,YAAY;MAC5B,IAAI;OACF,UAAU;OACV,UAAU;OACX;MACD,CAAA;KACW,CAAA;IACf,oBAAC,YAAD;KACE,IAAI;MACF,IAAI;MACJ,MAAM;MACN,UAAU;MACV,YAAY;MACb;eAEA,SACG,EAAE,sBAAsB,EACtB,SAAS,WACV,CAAC,GACF,EAAE,sBAAsB,EACtB,SAAS,WACV,CAAC;KACK,CAAA;IACb,oBAAC,gBAAD;KACE,MAAK;KACL,eAAe;KACf,MAAM;KACN,QAAO;KACP,KAAI;eAEJ,oBAAC,aAAD,EAAe,CAAA;KACA,CAAA;IACb;;EACF,CAAA"}

package/dist/esm/components/Step/Step.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Step.js","names":["Step","Card"],"sources":["../../../../src/components/Step/Step.tsx"],"sourcesContent":["import type {\n ExecutionActionType,\n LiFiStepExtended,\n TokenAmount,\n} from '@lifi/sdk'\nimport { Box } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { StepActions } from '../../components/StepActions/StepActions.js'\nimport { Token } from '../../components/Token/Token.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { prepareActions } from '../../utils/prepareActions.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { StepTimer } from '../Timer/StepTimer.js'\nimport { DestinationWalletAddress } from './DestinationWalletAddress.js'\nimport { StepAction } from './StepAction.js'\n\nexport const Step: React.FC<{\n step: LiFiStepExtended\n fromToken?: TokenAmount\n toToken?: TokenAmount\n impactToken?: TokenAmount\n toAddress?: string\n}> = ({ step, fromToken, toToken, impactToken, toAddress }) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n const { getAddressLink } = useExplorer()\n\n // If execution status is failed outside of actions scope,\n // show a synthetic action to represent the failed execution\n const actions = step.execution?.actions ?? []\n const failedWithoutActions =\n step.execution?.status === 'FAILED' &&\n !actions.some((a) => a.status === 'FAILED')\n\n const getCardTitle = () => {\n const hasBridgeStep = step.includedSteps.some(\n (step) => step.type === 'cross'\n )\n const hasSwapStep = step.includedSteps.some((step) => step.type === 'swap')\n const hasCustomStep = step.includedSteps.some(\n (step) => step.type === 'custom'\n )\n\n const isCustomVariant = hasCustomStep && subvariant === 'custom'\n\n if (hasBridgeStep && hasSwapStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepBridgeAndDeposit')\n : t('main.stepBridgeAndBuy')\n : t('main.stepSwapAndBridge')\n }\n if (hasBridgeStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepBridgeAndDeposit')\n : t('main.stepBridgeAndBuy')\n : t('main.stepBridge')\n }\n if (hasSwapStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepSwapAndDeposit')\n : t('main.stepSwapAndBuy')\n : t('main.stepSwap')\n }\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepDeposit')\n : t('main.stepBuy')\n : t('main.stepSwap')\n }\n\n const formattedToAddress = shortenAddress(toAddress)\n const toAddressLink = toAddress\n ? getAddressLink(toAddress, step.action.toChainId)\n : undefined\n\n return (\n <Card type={step.execution?.status === 'FAILED' ? 'error' : 'default'}>\n <Box\n sx={{\n display: 'flex',\n flex: 1,\n }}\n >\n <CardTitle sx={{ flex: 1 }}>{getCardTitle()}</CardTitle>\n <Box sx={{ p: 2, pb: 0, fontSize: 14, fontWeight: 600 }}>\n <StepTimer step={step} />\n </Box>\n </Box>\n <Box\n sx={{\n py: 1,\n }}\n >\n {fromToken ? <Token token={fromToken} sx={{ px: 2, py: 1 }} /> : null}\n <StepActions step={step} sx={{ px: 2, py: 1 }} dense />\n {prepareActions(step.execution?.actions ?? []).map(\n (actionsGroup, index) => (\n <StepAction key={index} step={step} actionsGroup={actionsGroup} />\n )\n )}\n {failedWithoutActions ? (\n <StepAction\n step={step}\n actionsGroup={[\n {\n status: 'FAILED',\n type: 'EXECUTION' as ExecutionActionType, // synthetic action to represent a failed execution with no actions\n error: step.execution?.error,\n },\n ]}\n />\n ) : null}\n {formattedToAddress && toAddressLink ? (\n <DestinationWalletAddress\n step={step}\n toAddress={formattedToAddress}\n toAddressLink={toAddressLink}\n />\n ) : null}\n {toToken ? (\n <Token\n token={toToken}\n impactToken={impactToken}\n enableImpactTokenTooltip\n sx={{ px: 2, py: 1 }}\n />\n ) : null}\n </Box>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAaA,UAMP,EAAE,MAAM,WAAW,SAAS,aAAa,gBAAgB;CAC7D,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAC3D,MAAM,EAAE,mBAAmB,aAAa;CAIxC,MAAM,UAAU,KAAK,WAAW,WAAW,EAAE;CAC7C,MAAM,uBACJ,KAAK,WAAW,WAAW,YAC3B,CAAC,QAAQ,MAAM,MAAM,EAAE,WAAW,SAAS;CAE7C,MAAM,qBAAqB;EACzB,MAAM,gBAAgB,KAAK,cAAc,MACtC,SAAS,KAAK,SAAS,QACzB;EACD,MAAM,cAAc,KAAK,cAAc,MAAM,SAAS,KAAK,SAAS,OAAO;EAK3E,MAAM,kBAJgB,KAAK,cAAc,MACtC,SAAS,KAAK,SAAS,~~SACzB~~,~~IAEwC~~,eAAe;~~AAExD~~,~~MAAI~~,iBAAiB,~~YACnB~~,~~QAAO~~,kBACH,mBAAmB,WAAW,YAC5B,EAAE,4BAA4B,GAC9B,EAAE,wBAAwB,GAC5B,EAAE,yBAAyB;~~AAEjC~~,~~MAAI~~,~~cACF~~,~~QAAO~~,kBACH,mBAAmB,WAAW,YAC5B,EAAE,4BAA4B,GAC9B,EAAE,wBAAwB,GAC5B,EAAE,kBAAkB;~~AAE1B~~,~~MAAI~~,~~YACF~~,~~QAAO~~,kBACH,mBAAmB,WAAW,YAC5B,EAAE,0BAA0B,GAC5B,EAAE,sBAAsB,GAC1B,EAAE,gBAAgB;~~AAExB~~,~~SAAO~~,kBACH,mBAAmB,WAAW,YAC5B,EAAE,mBAAmB,GACrB,EAAE,eAAe,GACnB,EAAE,gBAAgB;;CAGxB,MAAM,qBAAqB,eAAe,UAAU;CACpD,MAAM,gBAAgB,YAClB,eAAe,WAAW,KAAK,OAAO,UAAU,GAChD,KAAA;~~AAEJ~~,~~QACE~~,qBAACC,QAAD;EAAM,MAAM,KAAK,WAAW,WAAW,WAAW,UAAU;YAA5D,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,MAAM;IACP;aAJH,CAME,oBAAC,WAAD;IAAW,IAAI,EAAE,MAAM,GAAG;cAAG,cAAc;IAAa,CAAA,EACxD,oBAAC,KAAD;IAAK,IAAI;KAAE,GAAG;KAAG,IAAI;KAAG,UAAU;KAAI,YAAY;KAAK;cACrD,oBAAC,WAAD,EAAiB,MAAQ,CAAA;IACrB,CAAA,CACF;MACN,qBAAC,KAAD;GACE,IAAI,EACF,IAAI,GACL;aAHH;IAKG,YAAY,oBAAC,OAAD;KAAO,OAAO;KAAW,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KAAI,CAAA,GAAG;IACjE,oBAAC,aAAD;KAAmB;KAAM,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KAAE,OAAA;KAAQ,CAAA;IACtD,eAAe,KAAK,WAAW,WAAW,EAAE,CAAC,CAAC,KAC5C,cAAc,UACb,oBAAC,YAAD;KAA8B;KAAoB;KAAgB,EAAjD,MAAiD,CAErE;IACA,uBACC,oBAAC,YAAD;KACQ;KACN,cAAc,CACZ;MACE,QAAQ;MACR,MAAM;MACN,OAAO,KAAK,WAAW;MACxB,CACF;KACD,CAAA,GACA;IACH,sBAAsB,gBACrB,oBAAC,0BAAD;KACQ;KACN,WAAW;KACI;KACf,CAAA,GACA;IACH,UACC,oBAAC,OAAD;KACE,OAAO;KACM;KACb,0BAAA;KACA,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KACpB,CAAA,GACA;IACA;KACD"}
1	+ {"version":3,"file":"Step.js","names":["Step","Card"],"sources":["../../../../src/components/Step/Step.tsx"],"sourcesContent":["import type {\n ExecutionActionType,\n LiFiStepExtended,\n TokenAmount,\n} from '@lifi/sdk'\nimport { Box } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { StepActions } from '../../components/StepActions/StepActions.js'\nimport { Token } from '../../components/Token/Token.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { prepareActions } from '../../utils/prepareActions.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { StepTimer } from '../Timer/StepTimer.js'\nimport { DestinationWalletAddress } from './DestinationWalletAddress.js'\nimport { StepAction } from './StepAction.js'\n\nexport const Step: React.FC<{\n step: LiFiStepExtended\n fromToken?: TokenAmount\n toToken?: TokenAmount\n impactToken?: TokenAmount\n toAddress?: string\n}> = ({ step, fromToken, toToken, impactToken, toAddress }) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n const { getAddressLink } = useExplorer()\n\n // If execution status is failed outside of actions scope,\n // show a synthetic action to represent the failed execution\n const actions = step.execution?.actions ?? []\n const failedWithoutActions =\n step.execution?.status === 'FAILED' &&\n !actions.some((a) => a.status === 'FAILED')\n\n const getCardTitle = () => {\n const hasBridgeStep = step.includedSteps.some(\n (step) => step.type === 'cross'\n )\n const hasSwapStep = step.includedSteps.some((step) => step.type === 'swap')\n const hasCustomStep = step.includedSteps.some(\n (step) => step.type === 'custom'\n )\n\n const isCustomVariant = hasCustomStep && subvariant === 'custom'\n\n if (hasBridgeStep && hasSwapStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepBridgeAndDeposit')\n : t('main.stepBridgeAndBuy')\n : t('main.stepSwapAndBridge')\n }\n if (hasBridgeStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepBridgeAndDeposit')\n : t('main.stepBridgeAndBuy')\n : t('main.stepBridge')\n }\n if (hasSwapStep) {\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepSwapAndDeposit')\n : t('main.stepSwapAndBuy')\n : t('main.stepSwap')\n }\n return isCustomVariant\n ? subvariantOptions?.custom === 'deposit'\n ? t('main.stepDeposit')\n : t('main.stepBuy')\n : t('main.stepSwap')\n }\n\n const formattedToAddress = shortenAddress(toAddress)\n const toAddressLink = toAddress\n ? getAddressLink(toAddress, step.action.toChainId)\n : undefined\n\n return (\n <Card type={step.execution?.status === 'FAILED' ? 'error' : 'default'}>\n <Box\n sx={{\n display: 'flex',\n flex: 1,\n }}\n >\n <CardTitle sx={{ flex: 1 }}>{getCardTitle()}</CardTitle>\n <Box sx={{ p: 2, pb: 0, fontSize: 14, fontWeight: 600 }}>\n <StepTimer step={step} />\n </Box>\n </Box>\n <Box\n sx={{\n py: 1,\n }}\n >\n {fromToken ? <Token token={fromToken} sx={{ px: 2, py: 1 }} /> : null}\n <StepActions step={step} sx={{ px: 2, py: 1 }} dense />\n {prepareActions(step.execution?.actions ?? []).map(\n (actionsGroup, index) => (\n <StepAction key={index} step={step} actionsGroup={actionsGroup} />\n )\n )}\n {failedWithoutActions ? (\n <StepAction\n step={step}\n actionsGroup={[\n {\n status: 'FAILED',\n type: 'EXECUTION' as ExecutionActionType, // synthetic action to represent a failed execution with no actions\n error: step.execution?.error,\n },\n ]}\n />\n ) : null}\n {formattedToAddress && toAddressLink ? (\n <DestinationWalletAddress\n step={step}\n toAddress={formattedToAddress}\n toAddressLink={toAddressLink}\n />\n ) : null}\n {toToken ? (\n <Token\n token={toToken}\n impactToken={impactToken}\n enableImpactTokenTooltip\n sx={{ px: 2, py: 1 }}\n />\n ) : null}\n </Box>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAaA,UAMP,EAAE,MAAM,WAAW,SAAS,aAAa,gBAAgB;CAC7D,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAC3D,MAAM,EAAE,mBAAmB,aAAa;CAIxC,MAAM,UAAU,KAAK,WAAW,WAAW,EAAE;CAC7C,MAAM,uBACJ,KAAK,WAAW,WAAW,YAC3B,CAAC,QAAQ,MAAM,MAAM,EAAE,WAAW,SAAS;CAE7C,MAAM,qBAAqB;EACzB,MAAM,gBAAgB,KAAK,cAAc,MACtC,SAAS,KAAK,SAAS,QACzB;EACD,MAAM,cAAc,KAAK,cAAc,MAAM,SAAS,KAAK,SAAS,OAAO;EAK3E,MAAM,kBAJgB,KAAK,cAAc,MACtC,SAAS,KAAK,SAAS,SAGW,IAAI,eAAe;EAExD,IAAI,iBAAiB,aACnB,OAAO,kBACH,mBAAmB,WAAW,YAC5B,EAAE,4BAA4B,GAC9B,EAAE,wBAAwB,GAC5B,EAAE,yBAAyB;EAEjC,IAAI,eACF,OAAO,kBACH,mBAAmB,WAAW,YAC5B,EAAE,4BAA4B,GAC9B,EAAE,wBAAwB,GAC5B,EAAE,kBAAkB;EAE1B,IAAI,aACF,OAAO,kBACH,mBAAmB,WAAW,YAC5B,EAAE,0BAA0B,GAC5B,EAAE,sBAAsB,GAC1B,EAAE,gBAAgB;EAExB,OAAO,kBACH,mBAAmB,WAAW,YAC5B,EAAE,mBAAmB,GACrB,EAAE,eAAe,GACnB,EAAE,gBAAgB;;CAGxB,MAAM,qBAAqB,eAAe,UAAU;CACpD,MAAM,gBAAgB,YAClB,eAAe,WAAW,KAAK,OAAO,UAAU,GAChD,KAAA;CAEJ,OACE,qBAACC,QAAD;EAAM,MAAM,KAAK,WAAW,WAAW,WAAW,UAAU;YAA5D,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,MAAM;IACP;aAJH,CAME,oBAAC,WAAD;IAAW,IAAI,EAAE,MAAM,GAAG;cAAG,cAAc;IAAa,CAAA,EACxD,oBAAC,KAAD;IAAK,IAAI;KAAE,GAAG;KAAG,IAAI;KAAG,UAAU;KAAI,YAAY;KAAK;cACrD,oBAAC,WAAD,EAAiB,MAAQ,CAAA;IACrB,CAAA,CACF;MACN,qBAAC,KAAD;GACE,IAAI,EACF,IAAI,GACL;aAHH;IAKG,YAAY,oBAAC,OAAD;KAAO,OAAO;KAAW,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KAAI,CAAA,GAAG;IACjE,oBAAC,aAAD;KAAmB;KAAM,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KAAE,OAAA;KAAQ,CAAA;IACtD,eAAe,KAAK,WAAW,WAAW,EAAE,CAAC,CAAC,KAC5C,cAAc,UACb,oBAAC,YAAD;KAA8B;KAAoB;KAAgB,EAAjD,MAAiD,CAErE;IACA,uBACC,oBAAC,YAAD;KACQ;KACN,cAAc,CACZ;MACE,QAAQ;MACR,MAAM;MACN,OAAO,KAAK,WAAW;MACxB,CACF;KACD,CAAA,GACA;IACH,sBAAsB,gBACrB,oBAAC,0BAAD;KACQ;KACN,WAAW;KACI;KACf,CAAA,GACA;IACH,UACC,oBAAC,OAAD;KACE,OAAO;KACM;KACb,0BAAA;KACA,IAAI;MAAE,IAAI;MAAG,IAAI;MAAG;KACpB,CAAA,GACA;IACA;KACD"}

package/dist/esm/components/Step/StepAction.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepAction.js","names":["CircularProgress"],"sources":["../../../../src/components/Step/StepAction.tsx"],"sourcesContent":["import type { ExecutionAction, LiFiStepExtended } from '@lifi/sdk'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { Box, Link, Typography } from '@mui/material'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CircularProgress } from './CircularProgress.js'\n\nexport const StepAction: React.FC<{\n step: LiFiStepExtended\n actionsGroup: ExecutionAction[]\n}> = ({ step, actionsGroup }) => {\n const action = actionsGroup.at(-1)\n const { title, message } = useActionMessage(step, action)\n const { getTransactionLink } = useExplorer()\n\n if (!action) {\n return null\n }\n\n const transactionLink = action.txHash\n ? getTransactionLink({\n txHash: action.txHash,\n chain: action.chainId,\n })\n : action.txLink\n ? getTransactionLink({\n txLink: action.txLink,\n chain: action.chainId,\n })\n : undefined\n\n return (\n <Box\n sx={{\n px: 2,\n py: 1,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <CircularProgress action={action} />\n <Typography\n sx={{\n marginLeft: 2,\n marginRight: 0.5,\n flex: 1,\n fontSize: 14,\n fontWeight: action.status === 'FAILED' ? 600 : 400,\n }}\n >\n {title}\n </Typography>\n {transactionLink ? (\n <CardIconButton\n size=\"small\"\n LinkComponent={Link}\n href={transactionLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <OpenInNewRounded fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n </Box>\n {message ? (\n <Typography\n sx={{\n ml: 7,\n fontSize: 14,\n fontWeight: 500,\n color: 'text.secondary',\n }}\n >\n {message}\n </Typography>\n ) : null}\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,cAGP,EAAE,MAAM,mBAAmB;CAC/B,MAAM,SAAS,aAAa,GAAG,GAAG;CAClC,MAAM,EAAE,OAAO,YAAY,iBAAiB,MAAM,OAAO;CACzD,MAAM,EAAE,uBAAuB,aAAa;~~AAE5C~~,~~KAAI~~,CAAC,~~OACH~~,~~QAAO~~;CAGT,MAAM,kBAAkB,OAAO,SAC3B,mBAAmB;EACjB,QAAQ,OAAO;EACf,OAAO,OAAO;EACf,CAAC,GACF,OAAO,SACL,mBAAmB;EACjB,QAAQ,OAAO;EACf,OAAO,OAAO;EACf,CAAC,GACF,KAAA;~~AAEN~~,~~QACE~~,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACL;YAJH,CAME,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACb;aAJH;IAME,oBAACA,oBAAD,EAA0B,QAAU,CAAA;IACpC,oBAAC,YAAD;KACE,IAAI;MACF,YAAY;MACZ,aAAa;MACb,MAAM;MACN,UAAU;MACV,YAAY,OAAO,WAAW,WAAW,MAAM;MAChD;eAEA;KACU,CAAA;IACZ,kBACC,oBAAC,gBAAD;KACE,MAAK;KACL,eAAe;KACf,MAAM;KACN,QAAO;KACP,KAAI;eAEJ,oBAAC,kBAAD,EAAkB,UAAS,WAAY,CAAA;KACxB,CAAA,GACf;IACA;MACL,UACC,oBAAC,YAAD;GACE,IAAI;IACF,IAAI;IACJ,UAAU;IACV,YAAY;IACZ,OAAO;IACR;aAEA;GACU,CAAA,GACX,KACA"}
1	+ {"version":3,"file":"StepAction.js","names":["CircularProgress"],"sources":["../../../../src/components/Step/StepAction.tsx"],"sourcesContent":["import type { ExecutionAction, LiFiStepExtended } from '@lifi/sdk'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { Box, Link, Typography } from '@mui/material'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { CircularProgress } from './CircularProgress.js'\n\nexport const StepAction: React.FC<{\n step: LiFiStepExtended\n actionsGroup: ExecutionAction[]\n}> = ({ step, actionsGroup }) => {\n const action = actionsGroup.at(-1)\n const { title, message } = useActionMessage(step, action)\n const { getTransactionLink } = useExplorer()\n\n if (!action) {\n return null\n }\n\n const transactionLink = action.txHash\n ? getTransactionLink({\n txHash: action.txHash,\n chain: action.chainId,\n })\n : action.txLink\n ? getTransactionLink({\n txLink: action.txLink,\n chain: action.chainId,\n })\n : undefined\n\n return (\n <Box\n sx={{\n px: 2,\n py: 1,\n }}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <CircularProgress action={action} />\n <Typography\n sx={{\n marginLeft: 2,\n marginRight: 0.5,\n flex: 1,\n fontSize: 14,\n fontWeight: action.status === 'FAILED' ? 600 : 400,\n }}\n >\n {title}\n </Typography>\n {transactionLink ? (\n <CardIconButton\n size=\"small\"\n LinkComponent={Link}\n href={transactionLink}\n target=\"_blank\"\n rel=\"nofollow noreferrer\"\n >\n <OpenInNewRounded fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n </Box>\n {message ? (\n <Typography\n sx={{\n ml: 7,\n fontSize: 14,\n fontWeight: 500,\n color: 'text.secondary',\n }}\n >\n {message}\n </Typography>\n ) : null}\n </Box>\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,cAGP,EAAE,MAAM,mBAAmB;CAC/B,MAAM,SAAS,aAAa,GAAG,GAAG;CAClC,MAAM,EAAE,OAAO,YAAY,iBAAiB,MAAM,OAAO;CACzD,MAAM,EAAE,uBAAuB,aAAa;CAE5C,IAAI,CAAC,QACH,OAAO;CAGT,MAAM,kBAAkB,OAAO,SAC3B,mBAAmB;EACjB,QAAQ,OAAO;EACf,OAAO,OAAO;EACf,CAAC,GACF,OAAO,SACL,mBAAmB;EACjB,QAAQ,OAAO;EACf,OAAO,OAAO;EACf,CAAC,GACF,KAAA;CAEN,OACE,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACL;YAJH,CAME,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACb;aAJH;IAME,oBAACA,oBAAD,EAA0B,QAAU,CAAA;IACpC,oBAAC,YAAD;KACE,IAAI;MACF,YAAY;MACZ,aAAa;MACb,MAAM;MACN,UAAU;MACV,YAAY,OAAO,WAAW,WAAW,MAAM;MAChD;eAEA;KACU,CAAA;IACZ,kBACC,oBAAC,gBAAD;KACE,MAAK;KACL,eAAe;KACf,MAAM;KACN,QAAO;KACP,KAAI;eAEJ,oBAAC,kBAAD,EAAkB,UAAS,WAAY,CAAA;KACxB,CAAA,GACf;IACA;MACL,UACC,oBAAC,YAAD;GACE,IAAI;IACF,IAAI;IACJ,UAAU;IACV,YAAY;IACZ,OAAO;IACR;aAEA;GACU,CAAA,GACX,KACA"}

package/dist/esm/components/Step/StepActions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepActions.js","names":["Card"],"sources":["../../../../src/components/Step/StepActions.tsx"],"sourcesContent":["import type { LiFiStep, RouteExtended, StepExtended } from '@lifi/sdk'\nimport { useEthereumContext } from '@lifi/widget-provider'\nimport ArrowForward from '@mui/icons-material/ArrowForward'\nimport { Box, Divider, Tooltip } from '@mui/material'\nimport { Fragment } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { HiddenUI } from '../../types/widget.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { SmallAvatar } from '../Avatar/SmallAvatar.js'\nimport { Card } from '../Card/Card.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport type { StepDetailsLabelProps } from '../StepActions/types.js'\nimport {\n StepActionsHeader,\n StepActionsTitle,\n StepLabelTypography,\n} from './StepActions.style.js'\n\nexport const StepActions: React.FC<{\n route: RouteExtended\n}> = ({ route }) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions, feeConfig, hiddenUI } =\n useWidgetConfig()\n const { isGaslessStep } = useEthereumContext()\n\n const headerIncludedSteps = route.steps.flatMap((step) => step.includedSteps)\n\n const flatSteps = route.steps.flatMap((routeStep) => {\n let steps = routeStep.includedSteps\n if (hiddenUI?.includes(HiddenUI.IntegratorStepDetails)) {\n const feeCollectionStep = steps.find((s) => s.tool === 'feeCollection')\n if (feeCollectionStep) {\n steps = structuredClone(steps.filter((s) => s.tool !== 'feeCollection'))\n steps[0].estimate.fromAmount = feeCollectionStep.estimate.fromAmount\n }\n }\n const hasGaslessSupport = !!isGaslessStep?.(routeStep)\n return steps.map((includedStep) => ({ includedStep, hasGaslessSupport }))\n })\n\n const tooltipContent = (\n <Card indented>\n <Box\n sx={{\n display: 'grid',\n gridTemplateColumns: '32px 1fr',\n columnGap: 1.5,\n }}\n >\n {flatSteps.map(({ includedStep: step, hasGaslessSupport }, i, arr) => {\n const showDivider = i !== arr.length - 1\n const isFeeCollection =\n step.type === 'protocol' && step.tool === 'feeCollection'\n const toolName =\n isFeeCollection && feeConfig?.name\n ? feeConfig.name\n : step.toolDetails.name\n const toolLogoURI =\n isFeeCollection && feeConfig?.logoURI\n ? feeConfig.logoURI\n : step.toolDetails.logoURI\n\n return (\n <Fragment key={step.id}>\n <Box sx={{ display: 'flex', justifyContent: 'center' }}>\n {toolLogoURI ? (\n <SmallAvatar\n src={toolLogoURI}\n alt={toolName}\n sx={{ width: 32, height: 32 }}\n >\n {toolName?.[0]}\n </SmallAvatar>\n ) : null}\n </Box>\n <Box\n sx={{ display: 'flex', flexDirection: 'column', minHeight: 32 }}\n >\n {step.type === 'custom' && subvariant === 'custom' ? (\n <CustomStepDetailsLabel\n step={step}\n subvariant={subvariant}\n subvariantOptions={subvariantOptions}\n />\n ) : step.type === 'cross' ? (\n <BridgeStepDetailsLabel step={step} />\n ) : step.type === 'protocol' ? (\n <ProtocolStepDetailsLabel\n step={step}\n feeConfig={feeConfig}\n relayerSupport={hasGaslessSupport}\n />\n ) : (\n <SwapStepDetailsLabel step={step} />\n )}\n <StepDetailsContent step={step} />\n </Box>\n {showDivider && (\n <Box sx={{ display: 'flex', alignItems: 'center', px: '15px' }}>\n <Divider\n orientation=\"vertical\"\n sx={{ my: 0.5, height: 8, borderRightWidth: 2 }}\n />\n </Box>\n )}\n {showDivider && <Box />}\n </Fragment>\n )\n })}\n </Box>\n </Card>\n )\n\n return (\n <StepActionsHeader>\n <StepActionsTitle>{t('main.route')}</StepActionsTitle>\n <Tooltip\n title={tooltipContent}\n placement=\"bottom-end\"\n arrow={false}\n slotProps={{\n tooltip: {\n sx: {\n bgcolor: 'transparent',\n p: 0,\n boxShadow: 'none',\n maxWidth: 'none',\n },\n },\n transition: {\n style: { transformOrigin: 'right top' },\n },\n }}\n >\n <CardIconButton\n size=\"small\"\n sx={(theme) => ({\n borderRadius: theme.vars.shape.borderRadiusSecondary,\n })}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {headerIncludedSteps.map((includedStep, index) => (\n <Fragment key={index}>\n {index > 0 ? (\n <Divider sx={{ width: 8, mx: 0.5, borderWidth: 1 }} />\n ) : null}\n <SmallAvatar\n src={includedStep.toolDetails.logoURI}\n alt={includedStep.toolDetails.name}\n sx={{ width: 16, height: 16 }}\n >\n {includedStep.toolDetails.name[0]}\n </SmallAvatar>\n </Fragment>\n ))}\n </Box>\n </CardIconButton>\n </Tooltip>\n </StepActionsHeader>\n )\n}\n\nconst StepDetailsContent: React.FC<{\n step: StepExtended\n}> = ({ step }) => {\n const { t } = useTranslation()\n\n const sameTokenProtocolStep =\n step.action.fromToken.chainId === step.action.toToken.chainId &&\n step.action.fromToken.address === step.action.toToken.address\n\n let fromAmount: string \| undefined\n if (sameTokenProtocolStep) {\n const estimatedFromAmount =\n BigInt(step.estimate.fromAmount) - BigInt(step.estimate.toAmount)\n\n fromAmount =\n estimatedFromAmount > 0n\n ? formatTokenAmount(estimatedFromAmount, step.action.fromToken.decimals)\n : formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n )\n } else {\n fromAmount = formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n )\n }\n\n const showToAmount =\n step.type !== 'custom' && step.tool !== 'custom' && !sameTokenProtocolStep\n\n return (\n <StepLabelTypography>\n {!showToAmount ? (\n <>\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n ),\n })}{' '}\n {step.action.fromToken.symbol}\n {' - '}\n </>\n ) : null}\n {t('format.tokenAmount', {\n value: fromAmount,\n })}{' '}\n {step.action.fromToken.symbol}\n {showToAmount ? (\n <>\n <ArrowForward sx={{ fontSize: 18, paddingX: 0.5, height: 12 }} />\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(step.execution?.toAmount ?? step.estimate.toAmount),\n step.execution?.toToken?.decimals ?? step.action.toToken.decimals\n ),\n })}{' '}\n {step.execution?.toToken?.symbol ?? step.action.toToken.symbol}\n </>\n ) : (\n ` (${t('format.currency', {\n value: formatTokenPrice(\n fromAmount,\n step.action.fromToken.priceUSD,\n step.action.fromToken.decimals\n ),\n })})`\n )}\n </StepLabelTypography>\n )\n}\n\nconst CustomStepDetailsLabel: React.FC<StepDetailsLabelProps> = ({\n step,\n subvariant,\n subvariantOptions,\n}) => {\n const { t } = useTranslation()\n\n if (!subvariant) {\n return null\n }\n\n // FIXME: step transaction request overrides step tool details, but not included step tool details\n const toolDetails =\n subvariant === 'custom' &&\n (step as unknown as LiFiStep).includedSteps?.length > 0\n ? (step as unknown as LiFiStep).includedSteps.find(\n (step) => step.tool === 'custom' && step.toolDetails.key !== 'custom'\n )?.toolDetails \|\| step.toolDetails\n : step.toolDetails\n\n const stepDetailsKey =\n (subvariant === 'custom' && subvariantOptions?.custom) \|\| 'checkout'\n\n return (\n <StepLabelTypography>\n {t(`main.${stepDetailsKey}StepDetails`, {\n tool: toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst BridgeStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step }) => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n return (\n <StepLabelTypography>\n {t('main.bridgeStepDetails', {\n from: getChainById(step.action.fromChainId)?.name,\n to: getChainById(step.action.toChainId)?.name,\n tool: step.toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst SwapStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step }) => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n return (\n <StepLabelTypography>\n {t('main.swapStepDetails', {\n chain: getChainById(step.action.fromChainId)?.name,\n tool: step.toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst ProtocolStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step, feeConfig, relayerSupport }) => {\n const { t } = useTranslation()\n return (\n <StepLabelTypography>\n {step.toolDetails.key === 'feeCollection'\n ? feeConfig?.name \|\|\n (relayerSupport\n ? t('main.fees.relayerService')\n : t('main.fees.defaultIntegrator'))\n : step.toolDetails.key === 'gasZip'\n ? t('main.refuelStepDetails', {\n tool: step.toolDetails.name,\n })\n : step.toolDetails.name}\n </StepLabelTypography>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"StepActions.js","names":["Card"],"sources":["../../../../src/components/Step/StepActions.tsx"],"sourcesContent":["import type { LiFiStep, RouteExtended, StepExtended } from '@lifi/sdk'\nimport { useEthereumContext } from '@lifi/widget-provider'\nimport ArrowForward from '@mui/icons-material/ArrowForward'\nimport { Box, Divider, Tooltip } from '@mui/material'\nimport { Fragment } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { HiddenUI } from '../../types/widget.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { SmallAvatar } from '../Avatar/SmallAvatar.js'\nimport { Card } from '../Card/Card.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport type { StepDetailsLabelProps } from '../StepActions/types.js'\nimport {\n StepActionsHeader,\n StepActionsTitle,\n StepLabelTypography,\n} from './StepActions.style.js'\n\nexport const StepActions: React.FC<{\n route: RouteExtended\n}> = ({ route }) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions, feeConfig, hiddenUI } =\n useWidgetConfig()\n const { isGaslessStep } = useEthereumContext()\n\n const headerIncludedSteps = route.steps.flatMap((step) => step.includedSteps)\n\n const flatSteps = route.steps.flatMap((routeStep) => {\n let steps = routeStep.includedSteps\n if (hiddenUI?.includes(HiddenUI.IntegratorStepDetails)) {\n const feeCollectionStep = steps.find((s) => s.tool === 'feeCollection')\n if (feeCollectionStep) {\n steps = structuredClone(steps.filter((s) => s.tool !== 'feeCollection'))\n steps[0].estimate.fromAmount = feeCollectionStep.estimate.fromAmount\n }\n }\n const hasGaslessSupport = !!isGaslessStep?.(routeStep)\n return steps.map((includedStep) => ({ includedStep, hasGaslessSupport }))\n })\n\n const tooltipContent = (\n <Card indented>\n <Box\n sx={{\n display: 'grid',\n gridTemplateColumns: '32px 1fr',\n columnGap: 1.5,\n }}\n >\n {flatSteps.map(({ includedStep: step, hasGaslessSupport }, i, arr) => {\n const showDivider = i !== arr.length - 1\n const isFeeCollection =\n step.type === 'protocol' && step.tool === 'feeCollection'\n const toolName =\n isFeeCollection && feeConfig?.name\n ? feeConfig.name\n : step.toolDetails.name\n const toolLogoURI =\n isFeeCollection && feeConfig?.logoURI\n ? feeConfig.logoURI\n : step.toolDetails.logoURI\n\n return (\n <Fragment key={step.id}>\n <Box sx={{ display: 'flex', justifyContent: 'center' }}>\n {toolLogoURI ? (\n <SmallAvatar\n src={toolLogoURI}\n alt={toolName}\n sx={{ width: 32, height: 32 }}\n >\n {toolName?.[0]}\n </SmallAvatar>\n ) : null}\n </Box>\n <Box\n sx={{ display: 'flex', flexDirection: 'column', minHeight: 32 }}\n >\n {step.type === 'custom' && subvariant === 'custom' ? (\n <CustomStepDetailsLabel\n step={step}\n subvariant={subvariant}\n subvariantOptions={subvariantOptions}\n />\n ) : step.type === 'cross' ? (\n <BridgeStepDetailsLabel step={step} />\n ) : step.type === 'protocol' ? (\n <ProtocolStepDetailsLabel\n step={step}\n feeConfig={feeConfig}\n relayerSupport={hasGaslessSupport}\n />\n ) : (\n <SwapStepDetailsLabel step={step} />\n )}\n <StepDetailsContent step={step} />\n </Box>\n {showDivider && (\n <Box sx={{ display: 'flex', alignItems: 'center', px: '15px' }}>\n <Divider\n orientation=\"vertical\"\n sx={{ my: 0.5, height: 8, borderRightWidth: 2 }}\n />\n </Box>\n )}\n {showDivider && <Box />}\n </Fragment>\n )\n })}\n </Box>\n </Card>\n )\n\n return (\n <StepActionsHeader>\n <StepActionsTitle>{t('main.route')}</StepActionsTitle>\n <Tooltip\n title={tooltipContent}\n placement=\"bottom-end\"\n arrow={false}\n slotProps={{\n tooltip: {\n sx: {\n bgcolor: 'transparent',\n p: 0,\n boxShadow: 'none',\n maxWidth: 'none',\n },\n },\n transition: {\n style: { transformOrigin: 'right top' },\n },\n }}\n >\n <CardIconButton\n size=\"small\"\n sx={(theme) => ({\n borderRadius: theme.vars.shape.borderRadiusSecondary,\n })}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n {headerIncludedSteps.map((includedStep, index) => (\n <Fragment key={index}>\n {index > 0 ? (\n <Divider sx={{ width: 8, mx: 0.5, borderWidth: 1 }} />\n ) : null}\n <SmallAvatar\n src={includedStep.toolDetails.logoURI}\n alt={includedStep.toolDetails.name}\n sx={{ width: 16, height: 16 }}\n >\n {includedStep.toolDetails.name[0]}\n </SmallAvatar>\n </Fragment>\n ))}\n </Box>\n </CardIconButton>\n </Tooltip>\n </StepActionsHeader>\n )\n}\n\nconst StepDetailsContent: React.FC<{\n step: StepExtended\n}> = ({ step }) => {\n const { t } = useTranslation()\n\n const sameTokenProtocolStep =\n step.action.fromToken.chainId === step.action.toToken.chainId &&\n step.action.fromToken.address === step.action.toToken.address\n\n let fromAmount: string \| undefined\n if (sameTokenProtocolStep) {\n const estimatedFromAmount =\n BigInt(step.estimate.fromAmount) - BigInt(step.estimate.toAmount)\n\n fromAmount =\n estimatedFromAmount > 0n\n ? formatTokenAmount(estimatedFromAmount, step.action.fromToken.decimals)\n : formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n )\n } else {\n fromAmount = formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n )\n }\n\n const showToAmount =\n step.type !== 'custom' && step.tool !== 'custom' && !sameTokenProtocolStep\n\n return (\n <StepLabelTypography>\n {!showToAmount ? (\n <>\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(step.estimate.fromAmount),\n step.action.fromToken.decimals\n ),\n })}{' '}\n {step.action.fromToken.symbol}\n {' - '}\n </>\n ) : null}\n {t('format.tokenAmount', {\n value: fromAmount,\n })}{' '}\n {step.action.fromToken.symbol}\n {showToAmount ? (\n <>\n <ArrowForward sx={{ fontSize: 18, paddingX: 0.5, height: 12 }} />\n {t('format.tokenAmount', {\n value: formatTokenAmount(\n BigInt(step.execution?.toAmount ?? step.estimate.toAmount),\n step.execution?.toToken?.decimals ?? step.action.toToken.decimals\n ),\n })}{' '}\n {step.execution?.toToken?.symbol ?? step.action.toToken.symbol}\n </>\n ) : (\n ` (${t('format.currency', {\n value: formatTokenPrice(\n fromAmount,\n step.action.fromToken.priceUSD,\n step.action.fromToken.decimals\n ),\n })})`\n )}\n </StepLabelTypography>\n )\n}\n\nconst CustomStepDetailsLabel: React.FC<StepDetailsLabelProps> = ({\n step,\n subvariant,\n subvariantOptions,\n}) => {\n const { t } = useTranslation()\n\n if (!subvariant) {\n return null\n }\n\n // FIXME: step transaction request overrides step tool details, but not included step tool details\n const toolDetails =\n subvariant === 'custom' &&\n (step as unknown as LiFiStep).includedSteps?.length > 0\n ? (step as unknown as LiFiStep).includedSteps.find(\n (step) => step.tool === 'custom' && step.toolDetails.key !== 'custom'\n )?.toolDetails \|\| step.toolDetails\n : step.toolDetails\n\n const stepDetailsKey =\n (subvariant === 'custom' && subvariantOptions?.custom) \|\| 'checkout'\n\n return (\n <StepLabelTypography>\n {t(`main.${stepDetailsKey}StepDetails`, {\n tool: toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst BridgeStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step }) => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n return (\n <StepLabelTypography>\n {t('main.bridgeStepDetails', {\n from: getChainById(step.action.fromChainId)?.name,\n to: getChainById(step.action.toChainId)?.name,\n tool: step.toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst SwapStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step }) => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n return (\n <StepLabelTypography>\n {t('main.swapStepDetails', {\n chain: getChainById(step.action.fromChainId)?.name,\n tool: step.toolDetails.name,\n })}\n </StepLabelTypography>\n )\n}\n\nconst ProtocolStepDetailsLabel: React.FC<\n Omit<StepDetailsLabelProps, 'variant'>\n> = ({ step, feeConfig, relayerSupport }) => {\n const { t } = useTranslation()\n return (\n <StepLabelTypography>\n {step.toolDetails.key === 'feeCollection'\n ? feeConfig?.name \|\|\n (relayerSupport\n ? t('main.fees.relayerService')\n : t('main.fees.defaultIntegrator'))\n : step.toolDetails.key === 'gasZip'\n ? t('main.refuelStepDetails', {\n tool: step.toolDetails.name,\n })\n : step.toolDetails.name}\n </StepLabelTypography>\n )\n}\n"],"mappings":"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"}

package/dist/esm/components/Step/StepList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepList.js","names":[],"sources":["../../../../src/components/Step/StepList.tsx"],"sourcesContent":["import type { RouteExtended, TokenAmount } from '@lifi/sdk'\nimport { Fragment, type JSX } from 'react'\nimport { StepDivider } from '../../components/StepDivider/StepDivider.js'\nimport type { WidgetSubvariant } from '../../types/widget.js'\nimport { Step } from './Step.js'\n\nexport const getStepList = (\n route?: RouteExtended,\n subvariant?: WidgetSubvariant\n): JSX.Element[] \| undefined =>\n route?.steps.map((step, index, steps) => {\n const lastIndex = steps.length - 1\n const fromToken: TokenAmount \| undefined =\n index === 0\n ? {\n ...step.action.fromToken,\n amount: BigInt(step.action.fromAmount),\n }\n : undefined\n let toToken: TokenAmount \| undefined\n let impactToken: TokenAmount \| undefined\n if (index === lastIndex) {\n toToken = {\n ...(step.execution?.toToken ?? step.action.toToken),\n amount: step.execution?.toAmount\n ? BigInt(step.execution.toAmount)\n : subvariant === 'custom'\n ? BigInt(route.toAmount)\n : BigInt(step.estimate.toAmount),\n }\n impactToken = {\n ...steps[0].action.fromToken,\n amount: BigInt(steps[0].action.fromAmount),\n }\n }\n const toAddress =\n index === lastIndex && route.fromAddress !== route.toAddress\n ? route.toAddress\n : undefined\n return (\n <Fragment key={step.id}>\n <Step\n step={step}\n fromToken={fromToken}\n toToken={toToken}\n impactToken={impactToken}\n toAddress={toAddress}\n />\n {steps.length > 1 && index !== steps.length - 1 ? (\n <StepDivider />\n ) : null}\n </Fragment>\n )\n })\n"],"mappings":";;;;;AAMA,MAAa,eACX,OACA,eAEA,OAAO,MAAM,KAAK,MAAM,OAAO,UAAU;CACvC,MAAM,YAAY,MAAM,SAAS;CACjC,MAAM,YACJ,UAAU,IACN;EACE,GAAG,KAAK,OAAO;EACf,QAAQ,OAAO,KAAK,OAAO,WAAW;EACvC,GACD,KAAA;CACN,IAAI;CACJ,IAAI;~~AACJ~~,~~KAAI~~,UAAU,WAAW;~~AACvB~~,~~YAAU~~;GACR,GAAI,KAAK,WAAW,WAAW,KAAK,OAAO;GAC3C,QAAQ,KAAK,WAAW,WACpB,OAAO,KAAK,UAAU,SAAS,GAC/B,eAAe,WACb,OAAO,MAAM,SAAS,GACtB,OAAO,KAAK,SAAS,SAAS;GACrC;~~AACD~~,~~gBAAc~~;GACZ,GAAG,MAAM,GAAG,OAAO;GACnB,QAAQ,OAAO,MAAM,GAAG,OAAO,WAAW;GAC3C;;CAEH,MAAM,YACJ,UAAU,aAAa,MAAM,gBAAgB,MAAM,YAC/C,MAAM,YACN,KAAA;~~AACN~~,~~QACE~~,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,MAAD;EACQ;EACK;EACF;EACI;EACF;EACX,CAAA,EACD,MAAM,SAAS,KAAK,UAAU,MAAM,SAAS,IAC5C,oBAAC,aAAD,EAAe,CAAA,GACb,KACK,EAAA,EAXI,KAAK,GAWT;EAEb"}
1	+ {"version":3,"file":"StepList.js","names":[],"sources":["../../../../src/components/Step/StepList.tsx"],"sourcesContent":["import type { RouteExtended, TokenAmount } from '@lifi/sdk'\nimport { Fragment, type JSX } from 'react'\nimport { StepDivider } from '../../components/StepDivider/StepDivider.js'\nimport type { WidgetSubvariant } from '../../types/widget.js'\nimport { Step } from './Step.js'\n\nexport const getStepList = (\n route?: RouteExtended,\n subvariant?: WidgetSubvariant\n): JSX.Element[] \| undefined =>\n route?.steps.map((step, index, steps) => {\n const lastIndex = steps.length - 1\n const fromToken: TokenAmount \| undefined =\n index === 0\n ? {\n ...step.action.fromToken,\n amount: BigInt(step.action.fromAmount),\n }\n : undefined\n let toToken: TokenAmount \| undefined\n let impactToken: TokenAmount \| undefined\n if (index === lastIndex) {\n toToken = {\n ...(step.execution?.toToken ?? step.action.toToken),\n amount: step.execution?.toAmount\n ? BigInt(step.execution.toAmount)\n : subvariant === 'custom'\n ? BigInt(route.toAmount)\n : BigInt(step.estimate.toAmount),\n }\n impactToken = {\n ...steps[0].action.fromToken,\n amount: BigInt(steps[0].action.fromAmount),\n }\n }\n const toAddress =\n index === lastIndex && route.fromAddress !== route.toAddress\n ? route.toAddress\n : undefined\n return (\n <Fragment key={step.id}>\n <Step\n step={step}\n fromToken={fromToken}\n toToken={toToken}\n impactToken={impactToken}\n toAddress={toAddress}\n />\n {steps.length > 1 && index !== steps.length - 1 ? (\n <StepDivider />\n ) : null}\n </Fragment>\n )\n })\n"],"mappings":";;;;;AAMA,MAAa,eACX,OACA,eAEA,OAAO,MAAM,KAAK,MAAM,OAAO,UAAU;CACvC,MAAM,YAAY,MAAM,SAAS;CACjC,MAAM,YACJ,UAAU,IACN;EACE,GAAG,KAAK,OAAO;EACf,QAAQ,OAAO,KAAK,OAAO,WAAW;EACvC,GACD,KAAA;CACN,IAAI;CACJ,IAAI;CACJ,IAAI,UAAU,WAAW;EACvB,UAAU;GACR,GAAI,KAAK,WAAW,WAAW,KAAK,OAAO;GAC3C,QAAQ,KAAK,WAAW,WACpB,OAAO,KAAK,UAAU,SAAS,GAC/B,eAAe,WACb,OAAO,MAAM,SAAS,GACtB,OAAO,KAAK,SAAS,SAAS;GACrC;EACD,cAAc;GACZ,GAAG,MAAM,GAAG,OAAO;GACnB,QAAQ,OAAO,MAAM,GAAG,OAAO,WAAW;GAC3C;;CAEH,MAAM,YACJ,UAAU,aAAa,MAAM,gBAAgB,MAAM,YAC/C,MAAM,YACN,KAAA;CACN,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,MAAD;EACQ;EACK;EACF;EACI;EACF;EACX,CAAA,EACD,MAAM,SAAS,KAAK,UAAU,MAAM,SAAS,IAC5C,oBAAC,aAAD,EAAe,CAAA,GACb,KACK,EAAA,EAXI,KAAK,GAWT;EAEb"}