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

@lifi/widget 4.0.0-beta.18 → 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 (298) hide show

package/dist/esm/App.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"App.js","names":[],"sources":["../../src/App.tsx"],"sourcesContent":["'use client'\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react'\nimport { forwardRef, useMemo } from 'react'\nimport { AppDefault } from './AppDefault.js'\nimport type { WidgetDrawer } from './AppDrawer.js'\nimport { AppDrawer } from './AppDrawer.js'\nimport { AppProvider } from './AppProvider.js'\nimport type { WidgetConfig, WidgetProps } from './types/widget.js'\n\nexport const App: ForwardRefExoticComponent<\n WidgetProps & RefAttributes<WidgetDrawer>\n> = forwardRef<WidgetDrawer, WidgetProps>((props, ref) => {\n const config: WidgetConfig = useMemo(() => {\n const config = { ...props, ...props.config }\n if (config.variant === 'drawer') {\n config.theme = {\n ...config.theme,\n container: {\n height: '100%',\n ...config.theme?.container,\n },\n }\n }\n return config\n }, [props])\n\n if (config.variant === 'drawer') {\n return (\n <AppProvider config={config} formRef={props.formRef}>\n <AppDrawer\n ref={ref}\n elementRef={props.elementRef}\n config={config}\n open={props.open}\n onClose={props.onClose}\n >\n <AppDefault />\n </AppDrawer>\n </AppProvider>\n )\n }\n\n return (\n <AppProvider config={config} formRef={props.formRef}>\n <AppDefault />\n </AppProvider>\n )\n})\n"],"mappings":";;;;;;;AASA,MAAa,MAET,YAAuC,OAAO,QAAQ;CACxD,MAAM,SAAuB,cAAc;EACzC,MAAM,SAAS;GAAE,GAAG;GAAO,GAAG,MAAM;GAAQ;~~AAC5C~~,~~MAAI~~,OAAO,YAAY,~~SACrB~~,~~QAAO~~,QAAQ;GACb,GAAG,OAAO;GACV,WAAW;IACT,QAAQ;IACR,GAAG,OAAO,OAAO;IAClB;GACF;~~AAEH~~,~~SAAO~~;IACN,CAAC,MAAM,CAAC;~~AAEX~~,~~KAAI~~,OAAO,YAAY,~~SACrB~~,~~QACE~~,oBAAC,aAAD;EAAqB;EAAQ,SAAS,MAAM;YAC1C,oBAAC,WAAD;GACO;GACL,YAAY,MAAM;GACV;GACR,MAAM,MAAM;GACZ,SAAS,MAAM;aAEf,oBAAC,YAAD,EAAc,CAAA;GACJ,CAAA;EACA,CAAA;~~AAIlB~~,~~QACE~~,oBAAC,aAAD;EAAqB;EAAQ,SAAS,MAAM;YAC1C,oBAAC,YAAD,EAAc,CAAA;EACF,CAAA;EAEhB"}
1	+ {"version":3,"file":"App.js","names":[],"sources":["../../src/App.tsx"],"sourcesContent":["'use client'\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react'\nimport { forwardRef, useMemo } from 'react'\nimport { AppDefault } from './AppDefault.js'\nimport type { WidgetDrawer } from './AppDrawer.js'\nimport { AppDrawer } from './AppDrawer.js'\nimport { AppProvider } from './AppProvider.js'\nimport type { WidgetConfig, WidgetProps } from './types/widget.js'\n\nexport const App: ForwardRefExoticComponent<\n WidgetProps & RefAttributes<WidgetDrawer>\n> = forwardRef<WidgetDrawer, WidgetProps>((props, ref) => {\n const config: WidgetConfig = useMemo(() => {\n const config = { ...props, ...props.config }\n if (config.variant === 'drawer') {\n config.theme = {\n ...config.theme,\n container: {\n height: '100%',\n ...config.theme?.container,\n },\n }\n }\n return config\n }, [props])\n\n if (config.variant === 'drawer') {\n return (\n <AppProvider config={config} formRef={props.formRef}>\n <AppDrawer\n ref={ref}\n elementRef={props.elementRef}\n config={config}\n open={props.open}\n onClose={props.onClose}\n >\n <AppDefault />\n </AppDrawer>\n </AppProvider>\n )\n }\n\n return (\n <AppProvider config={config} formRef={props.formRef}>\n <AppDefault />\n </AppProvider>\n )\n})\n"],"mappings":";;;;;;;AASA,MAAa,MAET,YAAuC,OAAO,QAAQ;CACxD,MAAM,SAAuB,cAAc;EACzC,MAAM,SAAS;GAAE,GAAG;GAAO,GAAG,MAAM;GAAQ;EAC5C,IAAI,OAAO,YAAY,UACrB,OAAO,QAAQ;GACb,GAAG,OAAO;GACV,WAAW;IACT,QAAQ;IACR,GAAG,OAAO,OAAO;IAClB;GACF;EAEH,OAAO;IACN,CAAC,MAAM,CAAC;CAEX,IAAI,OAAO,YAAY,UACrB,OACE,oBAAC,aAAD;EAAqB;EAAQ,SAAS,MAAM;YAC1C,oBAAC,WAAD;GACO;GACL,YAAY,MAAM;GACV;GACR,MAAM,MAAM;GACZ,SAAS,MAAM;aAEf,oBAAC,YAAD,EAAc,CAAA;GACJ,CAAA;EACA,CAAA;CAIlB,OACE,oBAAC,aAAD;EAAqB;EAAQ,SAAS,MAAM;YAC1C,oBAAC,YAAD,EAAc,CAAA;EACF,CAAA;EAEhB"}

package/dist/esm/AppDefault.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppDefault.js","names":[],"sources":["../../src/AppDefault.tsx"],"sourcesContent":["import {\n createMemoryHistory,\n createRootRoute,\n createRoute,\n createRouter,\n RouterProvider,\n} from '@tanstack/react-router'\nimport type { JSX } from 'react'\nimport { useState } from 'react'\nimport { AppLayout } from './AppLayout.js'\nimport { NotFound } from './components/NotFound.js'\nimport { ActivitiesPage } from './pages/ActivitiesPage/ActivitiesPage.js'\nimport { LanguagesPage } from './pages/LanguagesPage.js'\nimport { MainPage } from './pages/MainPage/MainPage.js'\nimport { RoutesPage } from './pages/RoutesPage/RoutesPage.js'\nimport { SelectChainPage } from './pages/SelectChainPage/SelectChainPage.js'\nimport { SelectEnabledToolsPage } from './pages/SelectEnabledToolsPage.js'\nimport { SelectTokenPage } from './pages/SelectTokenPage/SelectTokenPage.js'\nimport { BookmarksPage } from './pages/SendToWallet/BookmarksPage.js'\nimport { ConnectedWalletsPage } from './pages/SendToWallet/ConnectedWalletsPage.js'\nimport { RecentWalletsPage } from './pages/SendToWallet/RecentWalletsPage.js'\nimport { SendToConfiguredWalletPage } from './pages/SendToWallet/SendToConfiguredWalletPage.js'\nimport { SendToWalletPage } from './pages/SendToWallet/SendToWalletPage.js'\nimport { SettingsPage } from './pages/SettingsPage/SettingsPage.js'\nimport { TransactionDetailsPage } from './pages/TransactionDetailsPage/TransactionDetailsPage.js'\nimport { TransactionPage } from './pages/TransactionPage/TransactionPage.js'\nimport { navigationRoutes } from './utils/navigationRoutes.js'\n\nconst rootRoute = createRootRoute({\n component: AppLayout,\n notFoundComponent: NotFound,\n})\n\nconst indexRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.home,\n component: MainPage,\n})\n\nconst settingsLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.settings,\n})\n\nconst settingsIndexRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: '/',\n component: SettingsPage,\n})\n\nconst settingsBridgesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.bridges,\n component: () => <SelectEnabledToolsPage type=\"Bridges\" />,\n})\n\nconst settingsExchangesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.exchanges,\n component: () => <SelectEnabledToolsPage type=\"Exchanges\" />,\n})\n\nconst settingsLanguagesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.languages,\n component: LanguagesPage,\n})\n\nconst fromTokenLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.fromToken,\n})\n\nconst fromTokenIndexRoute = createRoute({\n getParentRoute: () => fromTokenLayoutRoute,\n path: '/',\n component: () => <SelectTokenPage formType=\"from\" />,\n})\n\nconst fromTokenFromChainRoute = createRoute({\n getParentRoute: () => fromTokenLayoutRoute,\n path: navigationRoutes.fromChain,\n component: () => <SelectChainPage formType=\"from\" />,\n})\n\nconst toTokenLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.toToken,\n})\n\nconst toTokenIndexRoute = createRoute({\n getParentRoute: () => toTokenLayoutRoute,\n path: '/',\n component: () => <SelectTokenPage formType=\"to\" />,\n})\n\nconst toTokenToChainRoute = createRoute({\n getParentRoute: () => toTokenLayoutRoute,\n path: navigationRoutes.toChain,\n component: () => <SelectChainPage formType=\"to\" />,\n})\n\nconst toTokenNativeRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.toTokenNative,\n component: () => <SelectChainPage formType=\"to\" selectNativeToken />,\n})\n\nconst routesLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.routes,\n})\n\nconst routesIndexRoute = createRoute({\n getParentRoute: () => routesLayoutRoute,\n path: '/',\n component: RoutesPage,\n})\n\nconst routesTransactionExecutionRoute = createRoute({\n getParentRoute: () => routesLayoutRoute,\n path: navigationRoutes.transactionExecution,\n})\n\nconst routesTransactionExecutionIndexRoute = createRoute({\n getParentRoute: () => routesTransactionExecutionRoute,\n path: '/',\n component: TransactionPage,\n})\n\nconst routesTransactionExecutionDetailsRoute = createRoute({\n getParentRoute: () => routesTransactionExecutionRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst activitiesLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.activities,\n})\n\nconst activitiesIndexRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: '/',\n component: ActivitiesPage,\n})\n\nconst activitiesDetailsRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst activitiesTransactionExecutionRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: navigationRoutes.transactionExecution,\n component: TransactionPage,\n})\n\nconst sendToWalletLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.sendToWallet,\n})\n\nconst sendToWalletIndexRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: '/',\n component: SendToWalletPage,\n})\n\nconst sendToWalletBookmarksRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.bookmarks,\n component: BookmarksPage,\n})\n\nconst sendToWalletRecentWalletsRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.recentWallets,\n component: RecentWalletsPage,\n})\n\nconst sendToWalletConnectedWalletsRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.connectedWallets,\n component: ConnectedWalletsPage,\n})\n\nconst configuredWalletsRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.configuredWallets,\n component: SendToConfiguredWalletPage,\n})\n\nconst transactionExecutionLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.transactionExecution,\n})\n\nconst transactionExecutionIndexRoute = createRoute({\n getParentRoute: () => transactionExecutionLayoutRoute,\n path: '/',\n component: TransactionPage,\n})\n\nconst transactionExecutionDetailsRoute = createRoute({\n getParentRoute: () => transactionExecutionLayoutRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst routeTree = rootRoute.addChildren([\n indexRoute,\n settingsLayoutRoute.addChildren([\n settingsIndexRoute,\n settingsLanguagesRoute,\n settingsBridgesRoute,\n settingsExchangesRoute,\n ]),\n fromTokenLayoutRoute.addChildren([\n fromTokenIndexRoute,\n fromTokenFromChainRoute,\n ]),\n toTokenLayoutRoute.addChildren([toTokenIndexRoute, toTokenToChainRoute]),\n toTokenNativeRoute,\n routesLayoutRoute.addChildren([\n routesIndexRoute,\n routesTransactionExecutionRoute.addChildren([\n routesTransactionExecutionIndexRoute,\n routesTransactionExecutionDetailsRoute,\n ]),\n ]),\n transactionExecutionLayoutRoute.addChildren([\n transactionExecutionIndexRoute,\n transactionExecutionDetailsRoute,\n ]),\n activitiesLayoutRoute.addChildren([\n activitiesIndexRoute,\n activitiesDetailsRoute,\n activitiesTransactionExecutionRoute,\n ]),\n sendToWalletLayoutRoute.addChildren([\n sendToWalletIndexRoute,\n sendToWalletBookmarksRoute,\n sendToWalletRecentWalletsRoute,\n sendToWalletConnectedWalletsRoute,\n ]),\n configuredWalletsRoute,\n])\n\ndeclare module '@tanstack/react-router' {\n interface Register {\n router: ReturnType<typeof createRouter>\n }\n}\n\nexport const AppDefault = (): JSX.Element => {\n const [router] = useState(() =>\n createRouter({\n routeTree,\n history: createMemoryHistory({ initialEntries: ['/'] }),\n defaultPreload: 'intent',\n })\n )\n return <RouterProvider router={router} />\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"AppDefault.js","names":[],"sources":["../../src/AppDefault.tsx"],"sourcesContent":["import {\n createMemoryHistory,\n createRootRoute,\n createRoute,\n createRouter,\n RouterProvider,\n} from '@tanstack/react-router'\nimport type { JSX } from 'react'\nimport { useState } from 'react'\nimport { AppLayout } from './AppLayout.js'\nimport { NotFound } from './components/NotFound.js'\nimport { ActivitiesPage } from './pages/ActivitiesPage/ActivitiesPage.js'\nimport { LanguagesPage } from './pages/LanguagesPage.js'\nimport { MainPage } from './pages/MainPage/MainPage.js'\nimport { RoutesPage } from './pages/RoutesPage/RoutesPage.js'\nimport { SelectChainPage } from './pages/SelectChainPage/SelectChainPage.js'\nimport { SelectEnabledToolsPage } from './pages/SelectEnabledToolsPage.js'\nimport { SelectTokenPage } from './pages/SelectTokenPage/SelectTokenPage.js'\nimport { BookmarksPage } from './pages/SendToWallet/BookmarksPage.js'\nimport { ConnectedWalletsPage } from './pages/SendToWallet/ConnectedWalletsPage.js'\nimport { RecentWalletsPage } from './pages/SendToWallet/RecentWalletsPage.js'\nimport { SendToConfiguredWalletPage } from './pages/SendToWallet/SendToConfiguredWalletPage.js'\nimport { SendToWalletPage } from './pages/SendToWallet/SendToWalletPage.js'\nimport { SettingsPage } from './pages/SettingsPage/SettingsPage.js'\nimport { TransactionDetailsPage } from './pages/TransactionDetailsPage/TransactionDetailsPage.js'\nimport { TransactionPage } from './pages/TransactionPage/TransactionPage.js'\nimport { navigationRoutes } from './utils/navigationRoutes.js'\n\nconst rootRoute = createRootRoute({\n component: AppLayout,\n notFoundComponent: NotFound,\n})\n\nconst indexRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.home,\n component: MainPage,\n})\n\nconst settingsLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.settings,\n})\n\nconst settingsIndexRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: '/',\n component: SettingsPage,\n})\n\nconst settingsBridgesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.bridges,\n component: () => <SelectEnabledToolsPage type=\"Bridges\" />,\n})\n\nconst settingsExchangesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.exchanges,\n component: () => <SelectEnabledToolsPage type=\"Exchanges\" />,\n})\n\nconst settingsLanguagesRoute = createRoute({\n getParentRoute: () => settingsLayoutRoute,\n path: navigationRoutes.languages,\n component: LanguagesPage,\n})\n\nconst fromTokenLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.fromToken,\n})\n\nconst fromTokenIndexRoute = createRoute({\n getParentRoute: () => fromTokenLayoutRoute,\n path: '/',\n component: () => <SelectTokenPage formType=\"from\" />,\n})\n\nconst fromTokenFromChainRoute = createRoute({\n getParentRoute: () => fromTokenLayoutRoute,\n path: navigationRoutes.fromChain,\n component: () => <SelectChainPage formType=\"from\" />,\n})\n\nconst toTokenLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.toToken,\n})\n\nconst toTokenIndexRoute = createRoute({\n getParentRoute: () => toTokenLayoutRoute,\n path: '/',\n component: () => <SelectTokenPage formType=\"to\" />,\n})\n\nconst toTokenToChainRoute = createRoute({\n getParentRoute: () => toTokenLayoutRoute,\n path: navigationRoutes.toChain,\n component: () => <SelectChainPage formType=\"to\" />,\n})\n\nconst toTokenNativeRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.toTokenNative,\n component: () => <SelectChainPage formType=\"to\" selectNativeToken />,\n})\n\nconst routesLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.routes,\n})\n\nconst routesIndexRoute = createRoute({\n getParentRoute: () => routesLayoutRoute,\n path: '/',\n component: RoutesPage,\n})\n\nconst routesTransactionExecutionRoute = createRoute({\n getParentRoute: () => routesLayoutRoute,\n path: navigationRoutes.transactionExecution,\n})\n\nconst routesTransactionExecutionIndexRoute = createRoute({\n getParentRoute: () => routesTransactionExecutionRoute,\n path: '/',\n component: TransactionPage,\n})\n\nconst routesTransactionExecutionDetailsRoute = createRoute({\n getParentRoute: () => routesTransactionExecutionRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst activitiesLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.activities,\n})\n\nconst activitiesIndexRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: '/',\n component: ActivitiesPage,\n})\n\nconst activitiesDetailsRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst activitiesTransactionExecutionRoute = createRoute({\n getParentRoute: () => activitiesLayoutRoute,\n path: navigationRoutes.transactionExecution,\n component: TransactionPage,\n})\n\nconst sendToWalletLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.sendToWallet,\n})\n\nconst sendToWalletIndexRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: '/',\n component: SendToWalletPage,\n})\n\nconst sendToWalletBookmarksRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.bookmarks,\n component: BookmarksPage,\n})\n\nconst sendToWalletRecentWalletsRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.recentWallets,\n component: RecentWalletsPage,\n})\n\nconst sendToWalletConnectedWalletsRoute = createRoute({\n getParentRoute: () => sendToWalletLayoutRoute,\n path: navigationRoutes.connectedWallets,\n component: ConnectedWalletsPage,\n})\n\nconst configuredWalletsRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.configuredWallets,\n component: SendToConfiguredWalletPage,\n})\n\nconst transactionExecutionLayoutRoute = createRoute({\n getParentRoute: () => rootRoute,\n path: navigationRoutes.transactionExecution,\n})\n\nconst transactionExecutionIndexRoute = createRoute({\n getParentRoute: () => transactionExecutionLayoutRoute,\n path: '/',\n component: TransactionPage,\n})\n\nconst transactionExecutionDetailsRoute = createRoute({\n getParentRoute: () => transactionExecutionLayoutRoute,\n path: navigationRoutes.transactionDetails,\n component: TransactionDetailsPage,\n})\n\nconst routeTree = rootRoute.addChildren([\n indexRoute,\n settingsLayoutRoute.addChildren([\n settingsIndexRoute,\n settingsLanguagesRoute,\n settingsBridgesRoute,\n settingsExchangesRoute,\n ]),\n fromTokenLayoutRoute.addChildren([\n fromTokenIndexRoute,\n fromTokenFromChainRoute,\n ]),\n toTokenLayoutRoute.addChildren([toTokenIndexRoute, toTokenToChainRoute]),\n toTokenNativeRoute,\n routesLayoutRoute.addChildren([\n routesIndexRoute,\n routesTransactionExecutionRoute.addChildren([\n routesTransactionExecutionIndexRoute,\n routesTransactionExecutionDetailsRoute,\n ]),\n ]),\n transactionExecutionLayoutRoute.addChildren([\n transactionExecutionIndexRoute,\n transactionExecutionDetailsRoute,\n ]),\n activitiesLayoutRoute.addChildren([\n activitiesIndexRoute,\n activitiesDetailsRoute,\n activitiesTransactionExecutionRoute,\n ]),\n sendToWalletLayoutRoute.addChildren([\n sendToWalletIndexRoute,\n sendToWalletBookmarksRoute,\n sendToWalletRecentWalletsRoute,\n sendToWalletConnectedWalletsRoute,\n ]),\n configuredWalletsRoute,\n])\n\ndeclare module '@tanstack/react-router' {\n interface Register {\n router: ReturnType<typeof createRouter>\n }\n}\n\nexport const AppDefault = (): JSX.Element => {\n const [router] = useState(() =>\n createRouter({\n routeTree,\n history: createMemoryHistory({ initialEntries: ['/'] }),\n defaultPreload: 'intent',\n })\n )\n return <RouterProvider router={router} />\n}\n"],"mappings":"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"}

package/dist/esm/AppDrawer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppDrawer.js","names":[],"sources":["../../src/AppDrawer.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type {\n ForwardRefExoticComponent,\n PropsWithChildren,\n RefAttributes,\n} from 'react'\nimport {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport type { WidgetDrawerContext } from './AppDrawerContext.js'\nimport { DrawerContext } from './AppDrawerContext.js'\nimport type { WidgetDrawerProps } from './types/widget.js'\n\nexport interface WidgetDrawer {\n isOpen(): void\n toggleDrawer(): void\n openDrawer(): void\n closeDrawer(): void\n}\n\nexport const AppDrawer: ForwardRefExoticComponent<\n PropsWithChildren<WidgetDrawerProps> & RefAttributes<WidgetDrawer>\n> = forwardRef<WidgetDrawer, PropsWithChildren<WidgetDrawerProps>>(\n ({ elementRef, open, onClose, children }, ref) => {\n const openRef = useRef(Boolean(open))\n const [drawerOpen, setDrawerOpen] = useState(Boolean(open))\n\n const toggleDrawer = useCallback(() => {\n setDrawerOpen((open) => {\n openRef.current = !open\n return openRef.current\n })\n if (!openRef.current) {\n onClose?.()\n }\n }, [onClose])\n\n const openDrawer = useCallback(() => {\n setDrawerOpen(true)\n openRef.current = true\n }, [])\n\n const closeDrawer = useCallback(() => {\n setDrawerOpen(false)\n openRef.current = false\n onClose?.()\n }, [onClose])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => openRef.current,\n toggleDrawer,\n openDrawer,\n closeDrawer,\n }),\n [closeDrawer, openDrawer, toggleDrawer]\n )\n\n const drawerContext: WidgetDrawerContext = useMemo(\n () => ({\n closeDrawer,\n }),\n [closeDrawer]\n )\n\n return (\n <DrawerContext.Provider value={drawerContext}>\n <Drawer\n ref={elementRef}\n anchor=\"right\"\n open={drawerOpen}\n onClose={closeDrawer}\n slotProps={{\n paper: {\n sx: (theme) => ({\n background: theme.vars.palette.background.default,\n width: theme?.container?.width ?? '100%',\n minWidth:\n theme?.container?.minWidth ?? theme.breakpoints.values.xs,\n maxWidth:\n theme?.container?.maxWidth ?? theme.breakpoints.values.sm,\n }),\n },\n backdrop: {\n sx: {\n backgroundColor: 'rgb(0 0 0 / 48%)',\n backdropFilter: 'blur(3px)',\n },\n },\n }}\n keepMounted\n >\n {children}\n </Drawer>\n </DrawerContext.Provider>\n )\n }\n)\n"],"mappings":";;;;;AAyBA,MAAa,YAET,YACD,EAAE,YAAY,MAAM,SAAS,YAAY,QAAQ;CAChD,MAAM,UAAU,OAAO,QAAQ,KAAK,CAAC;CACrC,MAAM,CAAC,YAAY,iBAAiB,SAAS,QAAQ,KAAK,CAAC;CAE3D,MAAM,eAAe,kBAAkB;~~AACrC~~,~~iBAAe~~,SAAS;~~AACtB~~,~~WAAQ~~,UAAU,CAAC;~~AACnB~~,~~UAAO~~,QAAQ;IACf;~~AACF~~,~~MAAI~~,CAAC,QAAQ,~~QACX~~,~~YAAW~~;IAEZ,CAAC,QAAQ,CAAC;CAEb,MAAM,aAAa,kBAAkB;~~AACnC~~,~~gBAAc~~,KAAK;~~AACnB~~,~~UAAQ~~,UAAU;IACjB,EAAE,CAAC;CAEN,MAAM,cAAc,kBAAkB;~~AACpC~~,~~gBAAc~~,MAAM;~~AACpB~~,~~UAAQ~~,UAAU;~~AAClB~~,~~aAAW~~;IACV,CAAC,QAAQ,CAAC;~~AAEb~~,~~qBACE~~,YACO;EACL,cAAc,QAAQ;EACtB;EACA;EACA;EACD,GACD;EAAC;EAAa;EAAY;EAAa,CACxC;CAED,MAAM,gBAAqC,eAClC,EACL,aACD,GACD,CAAC,YAAY,CACd;~~AAED~~,~~QACE~~,oBAAC,cAAc,UAAf;EAAwB,OAAO;YAC7B,oBAAC,QAAD;GACE,KAAK;GACL,QAAO;GACP,MAAM;GACN,SAAS;GACT,WAAW;IACT,OAAO,EACL,KAAK,WAAW;KACd,YAAY,MAAM,KAAK,QAAQ,WAAW;KAC1C,OAAO,OAAO,WAAW,SAAS;KAClC,UACE,OAAO,WAAW,YAAY,MAAM,YAAY,OAAO;KACzD,UACE,OAAO,WAAW,YAAY,MAAM,YAAY,OAAO;KAC1D,GACF;IACD,UAAU,EACR,IAAI;KACF,iBAAiB;KACjB,gBAAgB;KACjB,EACF;IACF;GACD,aAAA;GAEC;GACM,CAAA;EACc,CAAA;EAG9B"}
1	+ {"version":3,"file":"AppDrawer.js","names":[],"sources":["../../src/AppDrawer.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type {\n ForwardRefExoticComponent,\n PropsWithChildren,\n RefAttributes,\n} from 'react'\nimport {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport type { WidgetDrawerContext } from './AppDrawerContext.js'\nimport { DrawerContext } from './AppDrawerContext.js'\nimport type { WidgetDrawerProps } from './types/widget.js'\n\nexport interface WidgetDrawer {\n isOpen(): void\n toggleDrawer(): void\n openDrawer(): void\n closeDrawer(): void\n}\n\nexport const AppDrawer: ForwardRefExoticComponent<\n PropsWithChildren<WidgetDrawerProps> & RefAttributes<WidgetDrawer>\n> = forwardRef<WidgetDrawer, PropsWithChildren<WidgetDrawerProps>>(\n ({ elementRef, open, onClose, children }, ref) => {\n const openRef = useRef(Boolean(open))\n const [drawerOpen, setDrawerOpen] = useState(Boolean(open))\n\n const toggleDrawer = useCallback(() => {\n setDrawerOpen((open) => {\n openRef.current = !open\n return openRef.current\n })\n if (!openRef.current) {\n onClose?.()\n }\n }, [onClose])\n\n const openDrawer = useCallback(() => {\n setDrawerOpen(true)\n openRef.current = true\n }, [])\n\n const closeDrawer = useCallback(() => {\n setDrawerOpen(false)\n openRef.current = false\n onClose?.()\n }, [onClose])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => openRef.current,\n toggleDrawer,\n openDrawer,\n closeDrawer,\n }),\n [closeDrawer, openDrawer, toggleDrawer]\n )\n\n const drawerContext: WidgetDrawerContext = useMemo(\n () => ({\n closeDrawer,\n }),\n [closeDrawer]\n )\n\n return (\n <DrawerContext.Provider value={drawerContext}>\n <Drawer\n ref={elementRef}\n anchor=\"right\"\n open={drawerOpen}\n onClose={closeDrawer}\n slotProps={{\n paper: {\n sx: (theme) => ({\n background: theme.vars.palette.background.default,\n width: theme?.container?.width ?? '100%',\n minWidth:\n theme?.container?.minWidth ?? theme.breakpoints.values.xs,\n maxWidth:\n theme?.container?.maxWidth ?? theme.breakpoints.values.sm,\n }),\n },\n backdrop: {\n sx: {\n backgroundColor: 'rgb(0 0 0 / 48%)',\n backdropFilter: 'blur(3px)',\n },\n },\n }}\n keepMounted\n >\n {children}\n </Drawer>\n </DrawerContext.Provider>\n )\n }\n)\n"],"mappings":";;;;;AAyBA,MAAa,YAET,YACD,EAAE,YAAY,MAAM,SAAS,YAAY,QAAQ;CAChD,MAAM,UAAU,OAAO,QAAQ,KAAK,CAAC;CACrC,MAAM,CAAC,YAAY,iBAAiB,SAAS,QAAQ,KAAK,CAAC;CAE3D,MAAM,eAAe,kBAAkB;EACrC,eAAe,SAAS;GACtB,QAAQ,UAAU,CAAC;GACnB,OAAO,QAAQ;IACf;EACF,IAAI,CAAC,QAAQ,SACX,WAAW;IAEZ,CAAC,QAAQ,CAAC;CAEb,MAAM,aAAa,kBAAkB;EACnC,cAAc,KAAK;EACnB,QAAQ,UAAU;IACjB,EAAE,CAAC;CAEN,MAAM,cAAc,kBAAkB;EACpC,cAAc,MAAM;EACpB,QAAQ,UAAU;EAClB,WAAW;IACV,CAAC,QAAQ,CAAC;CAEb,oBACE,YACO;EACL,cAAc,QAAQ;EACtB;EACA;EACA;EACD,GACD;EAAC;EAAa;EAAY;EAAa,CACxC;CAED,MAAM,gBAAqC,eAClC,EACL,aACD,GACD,CAAC,YAAY,CACd;CAED,OACE,oBAAC,cAAc,UAAf;EAAwB,OAAO;YAC7B,oBAAC,QAAD;GACE,KAAK;GACL,QAAO;GACP,MAAM;GACN,SAAS;GACT,WAAW;IACT,OAAO,EACL,KAAK,WAAW;KACd,YAAY,MAAM,KAAK,QAAQ,WAAW;KAC1C,OAAO,OAAO,WAAW,SAAS;KAClC,UACE,OAAO,WAAW,YAAY,MAAM,YAAY,OAAO;KACzD,UACE,OAAO,WAAW,YAAY,MAAM,YAAY,OAAO;KAC1D,GACF;IACD,UAAU,EACR,IAAI;KACF,iBAAiB;KACjB,gBAAgB;KACjB,EACF;IACF;GACD,aAAA;GAEC;GACM,CAAA;EACc,CAAA;EAG9B"}

package/dist/esm/AppLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppLayout.js","names":[],"sources":["../../src/AppLayout.tsx"],"sourcesContent":["'use client'\nimport { Outlet } from '@tanstack/react-router'\nimport {\n AppContainer,\n AppExpandedContainer,\n} from './components/AppContainer.js'\nimport { Expansion } from './components/Expansion/Expansion.js'\nimport { Header } from './components/Header/Header.js'\nimport { Initializer } from './components/Initializer.js'\nimport { PageEntered } from './components/PageEntered.js'\nimport { version } from './config/version.js'\nimport { useWideVariant } from './hooks/useWideVariant.js'\nimport { useWidgetConfig } from './providers/WidgetProvider/WidgetProvider.js'\nimport { URLSearchParamsBuilder } from './stores/form/URLSearchParamsBuilder.js'\nimport { createElementId, ElementId } from './utils/elements.js'\n\nexport const AppLayout: React.FC = () => {\n const { elementId, buildUrl } = useWidgetConfig()\n const wideVariant = useWideVariant()\n\n return (\n <AppExpandedContainer\n id={createElementId(ElementId.AppExpandedContainer, elementId)}\n data-version={version}\n >\n <AppContainer>\n <Header />\n <Initializer />\n {buildUrl ? <URLSearchParamsBuilder /> : null}\n <PageEntered />\n <Outlet />\n </AppContainer>\n {wideVariant && <Expansion />}\n </AppExpandedContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAa,kBAA4B;CACvC,MAAM,EAAE,WAAW,aAAa,iBAAiB;CACjD,MAAM,cAAc,gBAAgB;~~AAEpC~~,~~QACE~~,qBAAC,sBAAD;EACE,IAAI,gBAAA,iCAAgD,UAAU;EAC9D,gBAAc;YAFhB,CAIE,qBAAC,cAAD,EAAA,UAAA;GACE,oBAAC,QAAD,EAAU,CAAA;GACV,oBAAC,aAAD,EAAe,CAAA;GACd,WAAW,oBAAC,wBAAD,EAA0B,CAAA,GAAG;GACzC,oBAAC,aAAD,EAAe,CAAA;GACf,oBAAC,QAAD,EAAU,CAAA;GACG,EAAA,CAAA,EACd,eAAe,oBAAC,WAAD,EAAa,CAAA,CACR"}
1	+ {"version":3,"file":"AppLayout.js","names":[],"sources":["../../src/AppLayout.tsx"],"sourcesContent":["'use client'\nimport { Outlet } from '@tanstack/react-router'\nimport {\n AppContainer,\n AppExpandedContainer,\n} from './components/AppContainer.js'\nimport { Expansion } from './components/Expansion/Expansion.js'\nimport { Header } from './components/Header/Header.js'\nimport { Initializer } from './components/Initializer.js'\nimport { PageEntered } from './components/PageEntered.js'\nimport { version } from './config/version.js'\nimport { useWideVariant } from './hooks/useWideVariant.js'\nimport { useWidgetConfig } from './providers/WidgetProvider/WidgetProvider.js'\nimport { URLSearchParamsBuilder } from './stores/form/URLSearchParamsBuilder.js'\nimport { createElementId, ElementId } from './utils/elements.js'\n\nexport const AppLayout: React.FC = () => {\n const { elementId, buildUrl } = useWidgetConfig()\n const wideVariant = useWideVariant()\n\n return (\n <AppExpandedContainer\n id={createElementId(ElementId.AppExpandedContainer, elementId)}\n data-version={version}\n >\n <AppContainer>\n <Header />\n <Initializer />\n {buildUrl ? <URLSearchParamsBuilder /> : null}\n <PageEntered />\n <Outlet />\n </AppContainer>\n {wideVariant && <Expansion />}\n </AppExpandedContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAa,kBAA4B;CACvC,MAAM,EAAE,WAAW,aAAa,iBAAiB;CACjD,MAAM,cAAc,gBAAgB;CAEpC,OACE,qBAAC,sBAAD;EACE,IAAI,gBAAA,iCAAgD,UAAU;EAC9D,gBAAc;YAFhB,CAIE,qBAAC,cAAD,EAAA,UAAA;GACE,oBAAC,QAAD,EAAU,CAAA;GACV,oBAAC,aAAD,EAAe,CAAA;GACd,WAAW,oBAAC,wBAAD,EAA0B,CAAA,GAAG;GACzC,oBAAC,aAAD,EAAe,CAAA;GACf,oBAAC,QAAD,EAAU,CAAA;GACG,EAAA,CAAA,EACd,eAAe,oBAAC,WAAD,EAAa,CAAA,CACR"}

package/dist/esm/AppProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppProvider.js","names":[],"sources":["../../src/AppProvider.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { I18nProvider } from './providers/I18nProvider/I18nProvider.js'\nimport { QueryClientProvider } from './providers/QueryClientProvider.js'\nimport { SDKClientProvider } from './providers/SDKClientProvider.js'\nimport { ThemeProvider } from './providers/ThemeProvider/ThemeProvider.js'\nimport { WalletProvider } from './providers/WalletProvider/WalletProvider.js'\nimport { WidgetProvider } from './providers/WidgetProvider/WidgetProvider.js'\nimport { StoreProvider } from './stores/StoreProvider.js'\nimport { SettingsStoreProvider } from './stores/settings/SettingsStore.js'\nimport type { WidgetConfigProps } from './types/widget.js'\n\nexport const AppProvider: React.FC<PropsWithChildren<WidgetConfigProps>> = ({\n children,\n config,\n formRef,\n}) => {\n return (\n <QueryClientProvider>\n <SettingsStoreProvider config={config}>\n <WidgetProvider config={config}>\n <I18nProvider>\n <ThemeProvider>\n <SDKClientProvider>\n <WalletProvider providers={config.providers ?? []}>\n <StoreProvider config={config} formRef={formRef}>\n {children}\n </StoreProvider>\n </WalletProvider>\n </SDKClientProvider>\n </ThemeProvider>\n </I18nProvider>\n </WidgetProvider>\n </SettingsStoreProvider>\n </QueryClientProvider>\n )\n}\n"],"mappings":";;;;;;;;;;AAWA,MAAa,eAA+D,EAC1E,UACA,QACA,cACI;~~AACJ~~,~~QACE~~,oBAAC,qBAAD,EAAA,UACE,oBAAC,uBAAD;EAA+B;YAC7B,oBAAC,gBAAD;GAAwB;aACtB,oBAAC,cAAD,EAAA,UACE,oBAAC,eAAD,EAAA,UACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,gBAAD;IAAgB,WAAW,OAAO,aAAa,EAAE;cAC/C,oBAAC,eAAD;KAAuB;KAAiB;KACrC;KACa,CAAA;IACD,CAAA,EACC,CAAA,EACN,CAAA,EACH,CAAA;GACA,CAAA;EACK,CAAA,EACJ,CAAA"}
1	+ {"version":3,"file":"AppProvider.js","names":[],"sources":["../../src/AppProvider.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport { I18nProvider } from './providers/I18nProvider/I18nProvider.js'\nimport { QueryClientProvider } from './providers/QueryClientProvider.js'\nimport { SDKClientProvider } from './providers/SDKClientProvider.js'\nimport { ThemeProvider } from './providers/ThemeProvider/ThemeProvider.js'\nimport { WalletProvider } from './providers/WalletProvider/WalletProvider.js'\nimport { WidgetProvider } from './providers/WidgetProvider/WidgetProvider.js'\nimport { StoreProvider } from './stores/StoreProvider.js'\nimport { SettingsStoreProvider } from './stores/settings/SettingsStore.js'\nimport type { WidgetConfigProps } from './types/widget.js'\n\nexport const AppProvider: React.FC<PropsWithChildren<WidgetConfigProps>> = ({\n children,\n config,\n formRef,\n}) => {\n return (\n <QueryClientProvider>\n <SettingsStoreProvider config={config}>\n <WidgetProvider config={config}>\n <I18nProvider>\n <ThemeProvider>\n <SDKClientProvider>\n <WalletProvider providers={config.providers ?? []}>\n <StoreProvider config={config} formRef={formRef}>\n {children}\n </StoreProvider>\n </WalletProvider>\n </SDKClientProvider>\n </ThemeProvider>\n </I18nProvider>\n </WidgetProvider>\n </SettingsStoreProvider>\n </QueryClientProvider>\n )\n}\n"],"mappings":";;;;;;;;;;AAWA,MAAa,eAA+D,EAC1E,UACA,QACA,cACI;CACJ,OACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,uBAAD;EAA+B;YAC7B,oBAAC,gBAAD;GAAwB;aACtB,oBAAC,cAAD,EAAA,UACE,oBAAC,eAAD,EAAA,UACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,gBAAD;IAAgB,WAAW,OAAO,aAAa,EAAE;cAC/C,oBAAC,eAAD;KAAuB;KAAiB;KACrC;KACa,CAAA;IACD,CAAA,EACC,CAAA,EACN,CAAA,EACH,CAAA;GACA,CAAA;EACK,CAAA,EACJ,CAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountInput.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInput.tsx"],"sourcesContent":["import type { Token } from '@lifi/sdk'\nimport type { CardProps } from '@mui/material'\nimport type { ChangeEvent, ReactNode } from 'react'\nimport { useLayoutEffect, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToken } from '../../hooks/useToken.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { FormKeyHelper, type FormTypeProps } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useInputModeStore } from '../../stores/inputMode/useInputModeStore.js'\nimport { DisabledUI } from '../../types/widget.js'\nimport {\n formatInputAmount,\n formatTokenPrice,\n priceToTokenAmount,\n usdDecimals,\n} from '../../utils/format.js'\nimport { fitInputText } from '../../utils/input.js'\nimport { InputCard } from '../Card/InputCard.js'\nimport {\n AmountInputCardHeader,\n AmountInputCardTitle,\n FormContainer,\n FormControl,\n Input,\n maxInputFontSize,\n minInputFontSize,\n} from './AmountInput.style.js'\nimport { AmountInputEndAdornment } from './AmountInputEndAdornment.js'\nimport { AmountInputStartAdornment } from './AmountInputStartAdornment.js'\nimport { PriceFormHelperText } from './PriceFormHelperText.js'\n\nexport const AmountInput: React.FC<FormTypeProps & CardProps> = ({\n formType,\n ...props\n}) => {\n const { disabledUI } = useWidgetConfig()\n\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n const { token } = useToken(chainId, tokenAddress)\n\n const disabled = disabledUI?.includes(DisabledUI.FromAmount)\n return (\n <AmountInputBase\n formType={formType}\n token={token}\n bottomAdornment={<PriceFormHelperText formType={formType} />}\n disabled={disabled}\n {...props}\n />\n )\n}\n\nconst AmountInputBase: React.FC<\n FormTypeProps &\n CardProps & {\n token?: Token\n startAdornment?: ReactNode\n bottomAdornment?: ReactNode\n disabled?: boolean\n }\n> = ({\n formType,\n token,\n startAdornment,\n bottomAdornment,\n disabled,\n ...props\n}) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n const ref = useRef<HTMLInputElement>(null)\n\n const isEditingRef = useRef(false)\n const [formattedPriceInput, setFormattedPriceInput] = useState('')\n\n const amountKey = FormKeyHelper.getAmountKey(formType)\n const [value] = useFieldValues(amountKey)\n const { setFieldValue } = useFieldActions()\n const { inputMode } = useInputModeStore()\n\n const currentInputMode = inputMode[formType]\n let displayValue: string\n if (isEditingRef.current) {\n if (currentInputMode === 'price') {\n displayValue = formattedPriceInput\n } else {\n displayValue = value as string\n }\n } else {\n if (currentInputMode === 'price') {\n const priceValue = formatTokenPrice(value as string, token?.priceUSD)\n displayValue = formatInputAmount(\n priceValue.toFixed(usdDecimals),\n usdDecimals\n )\n } else {\n displayValue = value as string\n }\n }\n\n const handleChange = (\n event: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>\n ) => {\n const { value: inputValue } = event.target\n isEditingRef.current = true\n\n let formattedValue: string\n if (currentInputMode === 'price') {\n const cleanInputValue = inputValue.replace('$', '')\n formattedValue = formatInputAmount(cleanInputValue, usdDecimals, true)\n const tokenValue = priceToTokenAmount(formattedValue, token?.priceUSD)\n setFormattedPriceInput(formattedValue)\n setFieldValue(amountKey, tokenValue, { isDirty: true, isTouched: true })\n } else {\n formattedValue = formatInputAmount(inputValue, token?.decimals, true)\n setFieldValue(amountKey, formattedValue, {\n isDirty: true,\n isTouched: true,\n })\n }\n }\n\n const handleBlur = (\n event: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>\n ) => {\n const { value: inputValue } = event.target\n isEditingRef.current = false\n\n let formattedValue: string\n if (currentInputMode === 'price') {\n const cleanInputValue = inputValue.replace('$', '')\n formattedValue = formatInputAmount(cleanInputValue, usdDecimals)\n const tokenValue = priceToTokenAmount(formattedValue, token?.priceUSD)\n const formattedAmount = formatInputAmount(tokenValue, token?.decimals)\n setFieldValue(amountKey, formattedAmount, {\n isDirty: true,\n isTouched: true,\n })\n } else {\n formattedValue = formatInputAmount(inputValue, token?.decimals)\n setFieldValue(amountKey, formattedValue, {\n isDirty: true,\n isTouched: true,\n })\n }\n }\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: we need run effect on value change\n useLayoutEffect(() => {\n if (ref.current) {\n fitInputText(maxInputFontSize, minInputFontSize, ref.current)\n }\n }, [displayValue])\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.amount')\n : t('header.youPay')\n : t('header.send')\n\n return (\n <InputCard {...props}>\n <AmountInputCardHeader>\n <AmountInputCardTitle>{title}</AmountInputCardTitle>\n </AmountInputCardHeader>\n <FormContainer>\n <AmountInputStartAdornment formType={formType} />\n <FormControl fullWidth>\n <Input\n inputRef={ref}\n size=\"small\"\n autoComplete=\"off\"\n placeholder={currentInputMode === 'price' ? '$0' : '0'}\n startAdornment={startAdornment}\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleChange}\n onBlur={handleBlur}\n value={\n currentInputMode === 'price'\n ? displayValue\n ? `$${displayValue}`\n : ''\n : displayValue\n }\n name={amountKey}\n disabled={disabled}\n required\n />\n {bottomAdornment}\n </FormControl>\n </FormContainer>\n {!disabled && <AmountInputEndAdornment formType={formType} />}\n </InputCard>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiCA,MAAa,eAAoD,EAC/D,UACA,GAAG,YACC;CACJ,MAAM,EAAE,eAAe,iBAAiB;CAExC,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CAED,MAAM,EAAE,UAAU,SAAS,SAAS,aAAa;CAEjD,MAAM,WAAW,YAAY,SAAA,aAA+B;~~AAC5D~~,~~QACE~~,oBAAC,iBAAD;EACY;EACH;EACP,iBAAiB,oBAAC,qBAAD,EAA+B,UAAY,CAAA;EAClD;EACV,GAAI;EACJ,CAAA;;AAIN,MAAM,mBAQD,EACH,UACA,OACA,gBACA,iBACA,UACA,GAAG,YACC;CACJ,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAC3D,MAAM,MAAM,OAAyB,KAAK;CAE1C,MAAM,eAAe,OAAO,MAAM;CAClC,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,GAAG;CAElE,MAAM,YAAY,cAAc,aAAa,SAAS;CACtD,MAAM,CAAC,SAAS,eAAe,UAAU;CACzC,MAAM,EAAE,kBAAkB,iBAAiB;CAC3C,MAAM,EAAE,cAAc,mBAAmB;CAEzC,MAAM,mBAAmB,UAAU;CACnC,IAAI;~~AACJ~~,~~KAAI~~,aAAa,~~QACf~~,~~KAAI~~,qBAAqB,~~QACvB~~,~~gBAAe~~;~~KAEf~~,~~gBAAe~~;~~UAGb~~,qBAAqB,~~QAEvB~~,~~gBAAe~~,kBADI,iBAAiB,OAAiB,OAAO,SAEhD,CAAC,QAAA,EAAoB,EAAA,EAEhC;~~KAED~~,~~gBAAe~~;CAInB,MAAM,gBACJ,UACG;EACH,MAAM,EAAE,OAAO,eAAe,MAAM;~~AACpC~~,~~eAAa~~,UAAU;EAEvB,IAAI;~~AACJ~~,~~MAAI~~,qBAAqB,SAAS;~~AAEhC~~,~~oBAAiB~~,kBADO,WAAW,QAAQ,KAAK,GACE,EAAA,GAAe,KAAK;GACtE,MAAM,aAAa,mBAAmB,gBAAgB,OAAO,SAAS;~~AACtE~~,~~0BAAuB~~,eAAe;~~AACtC~~,~~iBAAc~~,WAAW,YAAY;IAAE,SAAS;IAAM,WAAW;IAAM,CAAC;SACnE;~~AACL~~,~~oBAAiB~~,kBAAkB,YAAY,OAAO,UAAU,KAAK;~~AACrE~~,~~iBAAc~~,WAAW,gBAAgB;IACvC,SAAS;IACT,WAAW;IACZ,CAAC;;;CAIN,MAAM,cACJ,UACG;EACH,MAAM,EAAE,OAAO,eAAe,MAAM;~~AACpC~~,~~eAAa~~,UAAU;EAEvB,IAAI;~~AACJ~~,~~MAAI~~,qBAAqB,SAAS;~~AAEhC~~,~~oBAAiB~~,kBADO,WAAW,QAAQ,KAAK,GACE,EAAA,EAAc;~~AAGhE~~,~~iBAAc~~,WADU,kBADL,mBAAmB,gBAAgB,OAAO,SACT,EAAE,OAAO,SACrB,EAAE;IACxC,SAAS;IACT,WAAW;IACZ,CAAC;SACG;~~AACL~~,~~oBAAiB~~,kBAAkB,YAAY,OAAO,SAAS;~~AAC~~/D,~~iBAAc~~,WAAW,gBAAgB;IACvC,SAAS;IACT,WAAW;IACZ,CAAC;;;~~AAKN~~,~~uBAAsB~~;~~AACpB~~,~~MAAI~~,IAAI,~~QACN~~,~~cAAA~~,IAAA,IAAiD,IAAI,QAAQ;IAE9D,CAAC,aAAa,CAAC;CAElB,MAAM,QACJ,eAAe,WACX,mBAAmB,WAAW,YAC5B,EAAE,gBAAgB,GAClB,EAAE,gBAAgB,GACpB,EAAE,cAAc;~~AAEtB~~,~~QACE~~,qBAAC,WAAD;EAAW,GAAI;YAAf;GACE,oBAAC,uBAAD,EAAA,UACE,oBAAC,sBAAD,EAAA,UAAuB,OAA6B,CAAA,EAC9B,CAAA;GACxB,qBAAC,eAAD,EAAA,UAAA,CACE,oBAAC,2BAAD,EAAqC,UAAY,CAAA,EACjD,qBAAC,aAAD;IAAa,WAAA;cAAb,CACE,oBAAC,OAAD;KACE,UAAU;KACV,MAAK;KACL,cAAa;KACb,aAAa,qBAAqB,UAAU,OAAO;KACnC;KAChB,YAAY,EACV,WAAW,WACZ;KACD,UAAU;KACV,QAAQ;KACR,OACE,qBAAqB,UACjB,eACE,IAAI,iBACJ,KACF;KAEN,MAAM;KACI;KACV,UAAA;KACA,CAAA,EACD,gBACW;MACA,EAAA,CAAA;GACf,CAAC,YAAY,oBAAC,yBAAD,EAAmC,UAAY,CAAA;GACnD"}
1	+ {"version":3,"file":"AmountInput.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInput.tsx"],"sourcesContent":["import type { Token } from '@lifi/sdk'\nimport type { CardProps } from '@mui/material'\nimport type { ChangeEvent, ReactNode } from 'react'\nimport { useLayoutEffect, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToken } from '../../hooks/useToken.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { FormKeyHelper, type FormTypeProps } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useInputModeStore } from '../../stores/inputMode/useInputModeStore.js'\nimport { DisabledUI } from '../../types/widget.js'\nimport {\n formatInputAmount,\n formatTokenPrice,\n priceToTokenAmount,\n usdDecimals,\n} from '../../utils/format.js'\nimport { fitInputText } from '../../utils/input.js'\nimport { InputCard } from '../Card/InputCard.js'\nimport {\n AmountInputCardHeader,\n AmountInputCardTitle,\n FormContainer,\n FormControl,\n Input,\n maxInputFontSize,\n minInputFontSize,\n} from './AmountInput.style.js'\nimport { AmountInputEndAdornment } from './AmountInputEndAdornment.js'\nimport { AmountInputStartAdornment } from './AmountInputStartAdornment.js'\nimport { PriceFormHelperText } from './PriceFormHelperText.js'\n\nexport const AmountInput: React.FC<FormTypeProps & CardProps> = ({\n formType,\n ...props\n}) => {\n const { disabledUI } = useWidgetConfig()\n\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n const { token } = useToken(chainId, tokenAddress)\n\n const disabled = disabledUI?.includes(DisabledUI.FromAmount)\n return (\n <AmountInputBase\n formType={formType}\n token={token}\n bottomAdornment={<PriceFormHelperText formType={formType} />}\n disabled={disabled}\n {...props}\n />\n )\n}\n\nconst AmountInputBase: React.FC<\n FormTypeProps &\n CardProps & {\n token?: Token\n startAdornment?: ReactNode\n bottomAdornment?: ReactNode\n disabled?: boolean\n }\n> = ({\n formType,\n token,\n startAdornment,\n bottomAdornment,\n disabled,\n ...props\n}) => {\n const { t } = useTranslation()\n const { subvariant, subvariantOptions } = useWidgetConfig()\n const ref = useRef<HTMLInputElement>(null)\n\n const isEditingRef = useRef(false)\n const [formattedPriceInput, setFormattedPriceInput] = useState('')\n\n const amountKey = FormKeyHelper.getAmountKey(formType)\n const [value] = useFieldValues(amountKey)\n const { setFieldValue } = useFieldActions()\n const { inputMode } = useInputModeStore()\n\n const currentInputMode = inputMode[formType]\n let displayValue: string\n if (isEditingRef.current) {\n if (currentInputMode === 'price') {\n displayValue = formattedPriceInput\n } else {\n displayValue = value as string\n }\n } else {\n if (currentInputMode === 'price') {\n const priceValue = formatTokenPrice(value as string, token?.priceUSD)\n displayValue = formatInputAmount(\n priceValue.toFixed(usdDecimals),\n usdDecimals\n )\n } else {\n displayValue = value as string\n }\n }\n\n const handleChange = (\n event: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>\n ) => {\n const { value: inputValue } = event.target\n isEditingRef.current = true\n\n let formattedValue: string\n if (currentInputMode === 'price') {\n const cleanInputValue = inputValue.replace('$', '')\n formattedValue = formatInputAmount(cleanInputValue, usdDecimals, true)\n const tokenValue = priceToTokenAmount(formattedValue, token?.priceUSD)\n setFormattedPriceInput(formattedValue)\n setFieldValue(amountKey, tokenValue, { isDirty: true, isTouched: true })\n } else {\n formattedValue = formatInputAmount(inputValue, token?.decimals, true)\n setFieldValue(amountKey, formattedValue, {\n isDirty: true,\n isTouched: true,\n })\n }\n }\n\n const handleBlur = (\n event: ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>\n ) => {\n const { value: inputValue } = event.target\n isEditingRef.current = false\n\n let formattedValue: string\n if (currentInputMode === 'price') {\n const cleanInputValue = inputValue.replace('$', '')\n formattedValue = formatInputAmount(cleanInputValue, usdDecimals)\n const tokenValue = priceToTokenAmount(formattedValue, token?.priceUSD)\n const formattedAmount = formatInputAmount(tokenValue, token?.decimals)\n setFieldValue(amountKey, formattedAmount, {\n isDirty: true,\n isTouched: true,\n })\n } else {\n formattedValue = formatInputAmount(inputValue, token?.decimals)\n setFieldValue(amountKey, formattedValue, {\n isDirty: true,\n isTouched: true,\n })\n }\n }\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: we need run effect on value change\n useLayoutEffect(() => {\n if (ref.current) {\n fitInputText(maxInputFontSize, minInputFontSize, ref.current)\n }\n }, [displayValue])\n\n const title =\n subvariant === 'custom'\n ? subvariantOptions?.custom === 'deposit'\n ? t('header.amount')\n : t('header.youPay')\n : t('header.send')\n\n return (\n <InputCard {...props}>\n <AmountInputCardHeader>\n <AmountInputCardTitle>{title}</AmountInputCardTitle>\n </AmountInputCardHeader>\n <FormContainer>\n <AmountInputStartAdornment formType={formType} />\n <FormControl fullWidth>\n <Input\n inputRef={ref}\n size=\"small\"\n autoComplete=\"off\"\n placeholder={currentInputMode === 'price' ? '$0' : '0'}\n startAdornment={startAdornment}\n inputProps={{\n inputMode: 'decimal',\n }}\n onChange={handleChange}\n onBlur={handleBlur}\n value={\n currentInputMode === 'price'\n ? displayValue\n ? `$${displayValue}`\n : ''\n : displayValue\n }\n name={amountKey}\n disabled={disabled}\n required\n />\n {bottomAdornment}\n </FormControl>\n </FormContainer>\n {!disabled && <AmountInputEndAdornment formType={formType} />}\n </InputCard>\n )\n}\n"],"mappings":"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"}

package/dist/esm/components/AmountInput/AmountInputEndAdornment.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountInputEndAdornment.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInputEndAdornment.tsx"],"sourcesContent":["import { formatUnits } from '@lifi/sdk'\nimport type React from 'react'\nimport { type JSX, memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useGasRecommendation } from '../../hooks/useGasRecommendation.js'\nimport { useTokenAddressBalance } from '../../hooks/useTokenAddressBalance.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport {\n AmountInputButton,\n ButtonContainer,\n} from './AmountInputEndAdornment.style.js'\n\nexport const AmountInputEndAdornment: React.NamedExoticComponent<FormTypeProps> =\n memo(({ formType }: FormTypeProps): JSX.Element \| null => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n const { setFieldValue } = useFieldActions()\n\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n // We get gas recommendations for the source chain to make sure that after pressing the Max button\n // the user will have enough funds remaining to cover gas costs\n const { data } = useGasRecommendation(chainId)\n\n const { token } = useTokenAddressBalance(chainId, tokenAddress)\n\n const getMaxAmount = () => {\n if (!token?.amount) {\n return 0n\n }\n const chain = getChainById(chainId)\n let maxAmount = token.amount\n if (chain?.nativeToken.address === tokenAddress && data?.recommended) {\n const recommendedAmount = BigInt(data.recommended.amount)\n if (token.amount > recommendedAmount) {\n maxAmount = token.amount - recommendedAmount\n }\n }\n return maxAmount\n }\n\n const handlePercentage = (percentage: number) => {\n const maxAmount = getMaxAmount()\n if (maxAmount && token?.decimals) {\n const percentageAmount = (maxAmount * BigInt(percentage)) / 100n\n setFieldValue(\n FormKeyHelper.getAmountKey(formType),\n formatUnits(percentageAmount, token.decimals),\n {\n isTouched: true,\n }\n )\n }\n }\n\n const handleMax = () => {\n const maxAmount = getMaxAmount()\n if (maxAmount && token?.decimals) {\n setFieldValue(\n FormKeyHelper.getAmountKey(formType),\n formatUnits(maxAmount, token.decimals),\n {\n isTouched: true,\n }\n )\n }\n }\n\n if (formType !== 'from' \|\| !token) {\n return null\n }\n\n return (\n <ButtonContainer>\n <AmountInputButton onClick={() => handlePercentage(25)}>\n 25%\n </AmountInputButton>\n <AmountInputButton onClick={() => handlePercentage(50)}>\n 50%\n </AmountInputButton>\n <AmountInputButton onClick={() => handlePercentage(75)}>\n 75%\n </AmountInputButton>\n <AmountInputButton onClick={handleMax}>\n {t('button.max')}\n </AmountInputButton>\n </ButtonContainer>\n )\n })\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAa,0BACX,MAAM,EAAE,eAAkD;CACxD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,iBAAiB,oBAAoB;CAC7C,MAAM,EAAE,kBAAkB,iBAAiB;CAE3C,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CAID,MAAM,EAAE,SAAS,qBAAqB,QAAQ;CAE9C,MAAM,EAAE,UAAU,uBAAuB,SAAS,aAAa;CAE/D,MAAM,qBAAqB;~~AACzB~~,~~MAAI~~,CAAC,OAAO,~~OACV~~,~~QAAO~~;EAET,MAAM,QAAQ,aAAa,QAAQ;EACnC,IAAI,YAAY,MAAM;~~AACtB~~,~~MAAI~~,OAAO,YAAY,YAAY,gBAAgB,MAAM,aAAa;GACpE,MAAM,oBAAoB,OAAO,KAAK,YAAY,OAAO;~~AACzD~~,~~OAAI~~,MAAM,SAAS,~~kBACjB~~,~~aAAY~~,MAAM,SAAS;;~~AAG~~/B,~~SAAO~~;;CAGT,MAAM,oBAAoB,eAAuB;EAC/C,MAAM,YAAY,cAAc;~~AAChC~~,~~MAAI~~,aAAa,OAAO,UAAU;GAChC,MAAM,mBAAoB,YAAY,OAAO,WAAW,GAAI;~~AAC5D~~,~~iBACE~~,cAAc,aAAa,SAAS,EACpC,YAAY,kBAAkB,MAAM,SAAS,EAC7C,EACE,WAAW,MACZ,CACF;;;CAIL,MAAM,kBAAkB;EACtB,MAAM,YAAY,cAAc;~~AAChC~~,~~MAAI~~,aAAa,OAAO,~~SACtB~~,~~eACE~~,cAAc,aAAa,SAAS,EACpC,YAAY,WAAW,MAAM,SAAS,EACtC,EACE,WAAW,MACZ,CACF;;~~AAIL~~,~~KAAI~~,aAAa,UAAU,CAAC,~~MAC1B~~,~~QAAO~~;~~AAGT~~,~~QACE~~,qBAAC,iBAAD,EAAA,UAAA;EACE,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,SAAS;aACzB,EAAE,aAAa;GACE,CAAA;EACJ,EAAA,CAAA;EAEpB"}
1	+ {"version":3,"file":"AmountInputEndAdornment.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInputEndAdornment.tsx"],"sourcesContent":["import { formatUnits } from '@lifi/sdk'\nimport type React from 'react'\nimport { type JSX, memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useGasRecommendation } from '../../hooks/useGasRecommendation.js'\nimport { useTokenAddressBalance } from '../../hooks/useTokenAddressBalance.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport {\n AmountInputButton,\n ButtonContainer,\n} from './AmountInputEndAdornment.style.js'\n\nexport const AmountInputEndAdornment: React.NamedExoticComponent<FormTypeProps> =\n memo(({ formType }: FormTypeProps): JSX.Element \| null => {\n const { t } = useTranslation()\n const { getChainById } = useAvailableChains()\n const { setFieldValue } = useFieldActions()\n\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n // We get gas recommendations for the source chain to make sure that after pressing the Max button\n // the user will have enough funds remaining to cover gas costs\n const { data } = useGasRecommendation(chainId)\n\n const { token } = useTokenAddressBalance(chainId, tokenAddress)\n\n const getMaxAmount = () => {\n if (!token?.amount) {\n return 0n\n }\n const chain = getChainById(chainId)\n let maxAmount = token.amount\n if (chain?.nativeToken.address === tokenAddress && data?.recommended) {\n const recommendedAmount = BigInt(data.recommended.amount)\n if (token.amount > recommendedAmount) {\n maxAmount = token.amount - recommendedAmount\n }\n }\n return maxAmount\n }\n\n const handlePercentage = (percentage: number) => {\n const maxAmount = getMaxAmount()\n if (maxAmount && token?.decimals) {\n const percentageAmount = (maxAmount * BigInt(percentage)) / 100n\n setFieldValue(\n FormKeyHelper.getAmountKey(formType),\n formatUnits(percentageAmount, token.decimals),\n {\n isTouched: true,\n }\n )\n }\n }\n\n const handleMax = () => {\n const maxAmount = getMaxAmount()\n if (maxAmount && token?.decimals) {\n setFieldValue(\n FormKeyHelper.getAmountKey(formType),\n formatUnits(maxAmount, token.decimals),\n {\n isTouched: true,\n }\n )\n }\n }\n\n if (formType !== 'from' \|\| !token) {\n return null\n }\n\n return (\n <ButtonContainer>\n <AmountInputButton onClick={() => handlePercentage(25)}>\n 25%\n </AmountInputButton>\n <AmountInputButton onClick={() => handlePercentage(50)}>\n 50%\n </AmountInputButton>\n <AmountInputButton onClick={() => handlePercentage(75)}>\n 75%\n </AmountInputButton>\n <AmountInputButton onClick={handleMax}>\n {t('button.max')}\n </AmountInputButton>\n </ButtonContainer>\n )\n })\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAa,0BACX,MAAM,EAAE,eAAkD;CACxD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,iBAAiB,oBAAoB;CAC7C,MAAM,EAAE,kBAAkB,iBAAiB;CAE3C,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CAID,MAAM,EAAE,SAAS,qBAAqB,QAAQ;CAE9C,MAAM,EAAE,UAAU,uBAAuB,SAAS,aAAa;CAE/D,MAAM,qBAAqB;EACzB,IAAI,CAAC,OAAO,QACV,OAAO;EAET,MAAM,QAAQ,aAAa,QAAQ;EACnC,IAAI,YAAY,MAAM;EACtB,IAAI,OAAO,YAAY,YAAY,gBAAgB,MAAM,aAAa;GACpE,MAAM,oBAAoB,OAAO,KAAK,YAAY,OAAO;GACzD,IAAI,MAAM,SAAS,mBACjB,YAAY,MAAM,SAAS;;EAG/B,OAAO;;CAGT,MAAM,oBAAoB,eAAuB;EAC/C,MAAM,YAAY,cAAc;EAChC,IAAI,aAAa,OAAO,UAAU;GAChC,MAAM,mBAAoB,YAAY,OAAO,WAAW,GAAI;GAC5D,cACE,cAAc,aAAa,SAAS,EACpC,YAAY,kBAAkB,MAAM,SAAS,EAC7C,EACE,WAAW,MACZ,CACF;;;CAIL,MAAM,kBAAkB;EACtB,MAAM,YAAY,cAAc;EAChC,IAAI,aAAa,OAAO,UACtB,cACE,cAAc,aAAa,SAAS,EACpC,YAAY,WAAW,MAAM,SAAS,EACtC,EACE,WAAW,MACZ,CACF;;CAIL,IAAI,aAAa,UAAU,CAAC,OAC1B,OAAO;CAGT,OACE,qBAAC,iBAAD,EAAA,UAAA;EACE,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,eAAe,iBAAiB,GAAG;aAAE;GAEpC,CAAA;EACpB,oBAAC,mBAAD;GAAmB,SAAS;aACzB,EAAE,aAAa;GACE,CAAA;EACJ,EAAA,CAAA;EAEpB"}

package/dist/esm/components/AmountInput/AmountInputStartAdornment.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountInputStartAdornment.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInputStartAdornment.tsx"],"sourcesContent":["import { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { AvatarBadgedDefault } from '../Avatar/Avatar.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\n\nexport const AmountInputStartAdornment: React.FC<FormTypeProps> = ({\n formType,\n}) => {\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n const { chain } = useChain(chainId)\n const { token } = useToken(chainId, tokenAddress)\n const isSelected = !!(chain && token)\n\n return isSelected ? (\n <TokenAvatar token={token} chain={chain} />\n ) : (\n <AvatarBadgedDefault />\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,6BAAsD,EACjE,eACI;CACJ,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CAED,MAAM,EAAE,UAAU,SAAS,QAAQ;CACnC,MAAM,EAAE,UAAU,SAAS,SAAS,aAAa;~~AAGjD~~,~~QAAO~~,CAFa,EAAE,SAAS,SAG7B,oBAAC,aAAD;EAAoB;EAAc;EAAS,CAAA,GAE3C,oBAAC,qBAAD,EAAuB,CAAA"}
1	+ {"version":3,"file":"AmountInputStartAdornment.js","names":[],"sources":["../../../../src/components/AmountInput/AmountInputStartAdornment.tsx"],"sourcesContent":["import { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { AvatarBadgedDefault } from '../Avatar/Avatar.js'\nimport { TokenAvatar } from '../Avatar/TokenAvatar.js'\n\nexport const AmountInputStartAdornment: React.FC<FormTypeProps> = ({\n formType,\n}) => {\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n\n const { chain } = useChain(chainId)\n const { token } = useToken(chainId, tokenAddress)\n const isSelected = !!(chain && token)\n\n return isSelected ? (\n <TokenAvatar token={token} chain={chain} />\n ) : (\n <AvatarBadgedDefault />\n )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,6BAAsD,EACjE,eACI;CACJ,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CAED,MAAM,EAAE,UAAU,SAAS,QAAQ;CACnC,MAAM,EAAE,UAAU,SAAS,SAAS,aAAa;CAGjD,OAAO,CAFa,EAAE,SAAS,SAG7B,oBAAC,aAAD;EAAoB;EAAc;EAAS,CAAA,GAE3C,oBAAC,qBAAD,EAAuB,CAAA"}

package/dist/esm/components/AmountInput/PriceFormHelperText.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PriceFormHelperText.js","names":[],"sources":["../../../../src/components/AmountInput/PriceFormHelperText.tsx"],"sourcesContent":["import type { TokenAmount } from '@lifi/sdk'\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\nimport { FormHelperText, Skeleton, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTokenAddressBalance } from '../../hooks/useTokenAddressBalance.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useInputModeStore } from '../../stores/inputMode/useInputModeStore.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { InputPriceButton } from './PriceFormHelperText.style.js'\n\nexport const PriceFormHelperText: React.NamedExoticComponent<FormTypeProps> =\n memo<FormTypeProps>(({ formType }) => {\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n const { token, isLoading } = useTokenAddressBalance(chainId, tokenAddress)\n\n return (\n <PriceFormHelperTextBase\n formType={formType}\n isLoading={isLoading}\n tokenAddress={tokenAddress}\n token={token}\n />\n )\n })\n\nconst PriceFormHelperTextBase: React.FC<\n FormTypeProps & {\n isLoading?: boolean\n tokenAddress?: string\n token?: TokenAmount\n }\n> = ({ formType, isLoading, tokenAddress, token }) => {\n const { t } = useTranslation()\n const [amount] = useFieldValues(FormKeyHelper.getAmountKey(formType))\n const { inputMode, toggleInputMode } = useInputModeStore()\n\n const currentInputMode = inputMode[formType]\n\n const tokenAmount = token\n ? formatTokenAmount(token.amount, token.decimals)\n : '0'\n\n const getPriceAmountDisplayValue = () => {\n if (currentInputMode === 'amount') {\n const tokenPrice = formatTokenPrice(\n amount,\n token?.priceUSD,\n token?.decimals\n )\n return t('format.currency', { value: tokenPrice })\n } else {\n return t('format.tokenAmount', { value: amount \|\| '0' })\n }\n }\n\n const handleToggleMode = (e: React.MouseEvent) => {\n e.stopPropagation()\n toggleInputMode(formType)\n }\n\n return (\n <FormHelperText\n component=\"div\"\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n margin: 0,\n marginLeft: 1.25,\n marginTop: 0.5,\n }}\n >\n <InputPriceButton\n onClick={token?.priceUSD ? handleToggleMode : undefined}\n >\n <Typography\n sx={{\n color: 'text.secondary',\n fontWeight: 500,\n fontSize: 12,\n lineHeight: 1,\n marginRight: 0.25,\n maxWidth: 136,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n }}\n >\n {getPriceAmountDisplayValue()}\n </Typography>\n {currentInputMode === 'price' && token?.symbol ? (\n <Typography\n sx={{\n color: 'text.secondary',\n fontWeight: 500,\n fontSize: 12,\n lineHeight: 1,\n wordBreak: 'break-word',\n overflowWrap: 'break-word',\n marginRight: 0.25,\n }}\n >\n {token.symbol}\n </Typography>\n ) : null}\n {token?.priceUSD && <SwapVertIcon sx={{ fontSize: 14 }} />}\n </InputPriceButton>\n {isLoading && tokenAddress ? (\n <Skeleton variant=\"text\" width={56} height={16} />\n ) : token?.amount ? (\n <Typography\n sx={{\n fontWeight: 500,\n fontSize: 12,\n color: 'text.secondary',\n lineHeight: 1,\n paddingLeft: 0.25,\n }}\n title={tokenAmount}\n >\n {`/ ${t('format.tokenAmount', {\n value: tokenAmount,\n })}`}\n </Typography>\n ) : null}\n </FormHelperText>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAcA,MAAa,sBACX,MAAqB,EAAE,eAAe;CACpC,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CACD,MAAM,EAAE,OAAO,cAAc,uBAAuB,SAAS,aAAa;~~AAE1E~~,~~QACE~~,oBAAC,yBAAD;EACY;EACC;EACG;EACP;EACP,CAAA;EAEJ;AAEJ,MAAM,2BAMD,EAAE,UAAU,WAAW,cAAc,YAAY;CACpD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,CAAC,UAAU,eAAe,cAAc,aAAa,SAAS,CAAC;CACrE,MAAM,EAAE,WAAW,oBAAoB,mBAAmB;CAE1D,MAAM,mBAAmB,UAAU;CAEnC,MAAM,cAAc,QAChB,kBAAkB,MAAM,QAAQ,MAAM,SAAS,GAC/C;CAEJ,MAAM,mCAAmC;~~AACvC~~,~~MAAI~~,qBAAqB,~~SAMvB~~,~~QAAO~~,EAAE,mBAAmB,EAAE,OALX,iBACjB,QACA,OAAO,UACP,OAAO,SAEsC,EAAE,CAAC;~~MAElD~~,~~QAAO~~,EAAE,sBAAsB,EAAE,OAAO,UAAU,KAAK,CAAC;;CAI5D,MAAM,oBAAoB,MAAwB;~~AAChD~~,~~IAAE~~,iBAAiB;~~AACnB~~,~~kBAAgB~~,SAAS;;~~AAG3B~~,~~QACE~~,qBAAC,gBAAD;EACE,WAAU;EACV,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;GACZ,QAAQ;GACR,YAAY;GACZ,WAAW;GACZ;YATH,CAWE,qBAAC,kBAAD;GACE,SAAS,OAAO,WAAW,mBAAmB,KAAA;aADhD;IAGE,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,YAAY;MACZ,UAAU;MACV,YAAY;MACZ,aAAa;MACb,UAAU;MACV,UAAU;MACV,cAAc;MACd,YAAY;MACb;eAEA,4BAA4B;KAClB,CAAA;IACZ,qBAAqB,WAAW,OAAO,SACtC,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,YAAY;MACZ,UAAU;MACV,YAAY;MACZ,WAAW;MACX,cAAc;MACd,aAAa;MACd;eAEA,MAAM;KACI,CAAA,GACX;IACH,OAAO,YAAY,oBAAC,cAAD,EAAc,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA;IACzC;MAClB,aAAa,eACZ,oBAAC,UAAD;GAAU,SAAQ;GAAO,OAAO;GAAI,QAAQ;GAAM,CAAA,GAChD,OAAO,SACT,oBAAC,YAAD;GACE,IAAI;IACF,YAAY;IACZ,UAAU;IACV,OAAO;IACP,YAAY;IACZ,aAAa;IACd;GACD,OAAO;aAEN,KAAK,EAAE,sBAAsB,EAC5B,OAAO,aACR,CAAC;GACS,CAAA,GACX,KACW"}
1	+ {"version":3,"file":"PriceFormHelperText.js","names":[],"sources":["../../../../src/components/AmountInput/PriceFormHelperText.tsx"],"sourcesContent":["import type { TokenAmount } from '@lifi/sdk'\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\nimport { FormHelperText, Skeleton, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTokenAddressBalance } from '../../hooks/useTokenAddressBalance.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useInputModeStore } from '../../stores/inputMode/useInputModeStore.js'\nimport { formatTokenAmount, formatTokenPrice } from '../../utils/format.js'\nimport { InputPriceButton } from './PriceFormHelperText.style.js'\n\nexport const PriceFormHelperText: React.NamedExoticComponent<FormTypeProps> =\n memo<FormTypeProps>(({ formType }) => {\n const [chainId, tokenAddress] = useFieldValues(\n FormKeyHelper.getChainKey(formType),\n FormKeyHelper.getTokenKey(formType)\n )\n const { token, isLoading } = useTokenAddressBalance(chainId, tokenAddress)\n\n return (\n <PriceFormHelperTextBase\n formType={formType}\n isLoading={isLoading}\n tokenAddress={tokenAddress}\n token={token}\n />\n )\n })\n\nconst PriceFormHelperTextBase: React.FC<\n FormTypeProps & {\n isLoading?: boolean\n tokenAddress?: string\n token?: TokenAmount\n }\n> = ({ formType, isLoading, tokenAddress, token }) => {\n const { t } = useTranslation()\n const [amount] = useFieldValues(FormKeyHelper.getAmountKey(formType))\n const { inputMode, toggleInputMode } = useInputModeStore()\n\n const currentInputMode = inputMode[formType]\n\n const tokenAmount = token\n ? formatTokenAmount(token.amount, token.decimals)\n : '0'\n\n const getPriceAmountDisplayValue = () => {\n if (currentInputMode === 'amount') {\n const tokenPrice = formatTokenPrice(\n amount,\n token?.priceUSD,\n token?.decimals\n )\n return t('format.currency', { value: tokenPrice })\n } else {\n return t('format.tokenAmount', { value: amount \|\| '0' })\n }\n }\n\n const handleToggleMode = (e: React.MouseEvent) => {\n e.stopPropagation()\n toggleInputMode(formType)\n }\n\n return (\n <FormHelperText\n component=\"div\"\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n margin: 0,\n marginLeft: 1.25,\n marginTop: 0.5,\n }}\n >\n <InputPriceButton\n onClick={token?.priceUSD ? handleToggleMode : undefined}\n >\n <Typography\n sx={{\n color: 'text.secondary',\n fontWeight: 500,\n fontSize: 12,\n lineHeight: 1,\n marginRight: 0.25,\n maxWidth: 136,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n }}\n >\n {getPriceAmountDisplayValue()}\n </Typography>\n {currentInputMode === 'price' && token?.symbol ? (\n <Typography\n sx={{\n color: 'text.secondary',\n fontWeight: 500,\n fontSize: 12,\n lineHeight: 1,\n wordBreak: 'break-word',\n overflowWrap: 'break-word',\n marginRight: 0.25,\n }}\n >\n {token.symbol}\n </Typography>\n ) : null}\n {token?.priceUSD && <SwapVertIcon sx={{ fontSize: 14 }} />}\n </InputPriceButton>\n {isLoading && tokenAddress ? (\n <Skeleton variant=\"text\" width={56} height={16} />\n ) : token?.amount ? (\n <Typography\n sx={{\n fontWeight: 500,\n fontSize: 12,\n color: 'text.secondary',\n lineHeight: 1,\n paddingLeft: 0.25,\n }}\n title={tokenAmount}\n >\n {`/ ${t('format.tokenAmount', {\n value: tokenAmount,\n })}`}\n </Typography>\n ) : null}\n </FormHelperText>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAcA,MAAa,sBACX,MAAqB,EAAE,eAAe;CACpC,MAAM,CAAC,SAAS,gBAAgB,eAC9B,cAAc,YAAY,SAAS,EACnC,cAAc,YAAY,SAAS,CACpC;CACD,MAAM,EAAE,OAAO,cAAc,uBAAuB,SAAS,aAAa;CAE1E,OACE,oBAAC,yBAAD;EACY;EACC;EACG;EACP;EACP,CAAA;EAEJ;AAEJ,MAAM,2BAMD,EAAE,UAAU,WAAW,cAAc,YAAY;CACpD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,CAAC,UAAU,eAAe,cAAc,aAAa,SAAS,CAAC;CACrE,MAAM,EAAE,WAAW,oBAAoB,mBAAmB;CAE1D,MAAM,mBAAmB,UAAU;CAEnC,MAAM,cAAc,QAChB,kBAAkB,MAAM,QAAQ,MAAM,SAAS,GAC/C;CAEJ,MAAM,mCAAmC;EACvC,IAAI,qBAAqB,UAMvB,OAAO,EAAE,mBAAmB,EAAE,OALX,iBACjB,QACA,OAAO,UACP,OAAO,SAEsC,EAAE,CAAC;OAElD,OAAO,EAAE,sBAAsB,EAAE,OAAO,UAAU,KAAK,CAAC;;CAI5D,MAAM,oBAAoB,MAAwB;EAChD,EAAE,iBAAiB;EACnB,gBAAgB,SAAS;;CAG3B,OACE,qBAAC,gBAAD;EACE,WAAU;EACV,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;GACZ,QAAQ;GACR,YAAY;GACZ,WAAW;GACZ;YATH,CAWE,qBAAC,kBAAD;GACE,SAAS,OAAO,WAAW,mBAAmB,KAAA;aADhD;IAGE,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,YAAY;MACZ,UAAU;MACV,YAAY;MACZ,aAAa;MACb,UAAU;MACV,UAAU;MACV,cAAc;MACd,YAAY;MACb;eAEA,4BAA4B;KAClB,CAAA;IACZ,qBAAqB,WAAW,OAAO,SACtC,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,YAAY;MACZ,UAAU;MACV,YAAY;MACZ,WAAW;MACX,cAAc;MACd,aAAa;MACd;eAEA,MAAM;KACI,CAAA,GACX;IACH,OAAO,YAAY,oBAAC,cAAD,EAAc,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA;IACzC;MAClB,aAAa,eACZ,oBAAC,UAAD;GAAU,SAAQ;GAAO,OAAO;GAAI,QAAQ;GAAM,CAAA,GAChD,OAAO,SACT,oBAAC,YAAD;GACE,IAAI;IACF,YAAY;IACZ,UAAU;IACV,OAAO;IACP,YAAY;IACZ,aAAa;IACd;GACD,OAAO;aAEN,KAAK,EAAE,sBAAsB,EAC5B,OAAO,aACR,CAAC;GACS,CAAA,GACX,KACW"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AppContainer.js","names":[],"sources":["../../../src/components/AppContainer.tsx"],"sourcesContent":["import type { BoxProps, ContainerProps } from '@mui/material'\nimport { Box, Container, ScopedCssBaseline, styled } from '@mui/material'\nimport type React from 'react'\nimport type { PropsWithChildren } from 'react'\nimport { defaultMaxHeight } from '../config/constants.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useHeaderHeight } from '../stores/header/useHeaderStore.js'\nimport type { WidgetVariant } from '../types/widget.js'\nimport { createElementId, ElementId } from '../utils/elements.js'\nimport { getWidgetMaxHeight } from '../utils/widgetSize.js'\n\n// NOTE: the setting of the height in AppExpandedContainer, RelativeContainer and CssBaselineContainer can\n// be done dynamically by values in the config - namely the config.theme.container values display, maxHeight and height\n// A Number of other components and hooks work with height values that are often set on or derived from these elements\n// if there are changes to how the height works here you should also check the functionality of these hooks and their point of use\n// - useTokenListHeight\n// - useSetContentHeight\n// Also check any code that is using the methods from elements.ts utils file\n\nexport const AppExpandedContainer: React.FC<BoxProps> = styled(Box)(\n ({ theme }) => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'start',\n flex: 1,\n height:\n theme.container?.display === 'flex'\n ? '100%'\n : theme.container?.maxHeight\n ? 'auto'\n : theme.container?.height \|\| 'auto',\n }\n }\n)\n\nexport const RelativeContainer: React.FC<\n BoxProps & { variant?: WidgetVariant }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: WidgetVariant }>(({ theme }) => {\n const maxHeight =\n theme.container?.height === 'fit-content' \|\|\n (!theme.container?.height && !theme.container?.maxHeight)\n ? 'none'\n : getWidgetMaxHeight(theme)\n return {\n position: 'relative',\n boxSizing: 'content-box',\n width: '100%',\n minWidth: theme.breakpoints.values.xs,\n maxWidth: theme.breakpoints.values.sm,\n background: theme.vars.palette.background.default,\n overflow: 'auto',\n flex: 1,\n ...theme.container,\n maxHeight:\n theme.container?.display === 'flex' && !theme.container?.height\n ? '100%'\n : maxHeight,\n zIndex: 1, // NB: higher than of expansion containers\n variants: [\n {\n props: {\n variant: 'drawer',\n },\n style: {\n maxHeight: 'none',\n height: '100%',\n boxShadow: 'none',\n borderRadius: 0,\n },\n },\n ],\n }\n})\n\ninterface CssBaselineContainerProps {\n variant?: WidgetVariant\n paddingTopAdjustment: number\n elementId: string\n}\n\nconst CssBaselineContainer = styled(ScopedCssBaseline, {\n shouldForwardProp: (prop) =>\n !['variant', 'paddingTopAdjustment', 'elementId'].includes(prop as string),\n})<CssBaselineContainerProps>(({ theme, variant, paddingTopAdjustment }) => {\n const maxHeight =\n theme.container?.height === 'fit-content' \|\|\n (!theme.container?.height && !theme.container?.maxHeight)\n ? 'none'\n : getWidgetMaxHeight(theme)\n return {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n overflowX: 'clip',\n margin: 0,\n width: '100%',\n maxHeight:\n variant === 'drawer' \|\| theme.container?.display === 'flex'\n ? 'none'\n : maxHeight,\n overflowY: 'auto',\n height: theme.container?.display === 'flex' ? 'auto' : '100%',\n paddingTop: paddingTopAdjustment,\n // This allows FullPageContainer.tsx to expand and fill the available vertical space in max height and default layout modes\n '&:has(.full-page-container)': {\n height:\n theme.container?.maxHeight \|\|\n theme.container?.height \|\|\n defaultMaxHeight,\n },\n '&:has(.long-list)': {\n minHeight: getWidgetMaxHeight(theme),\n maxHeight: getWidgetMaxHeight(theme),\n },\n }\n})\n\nexport const FlexContainer: React.FC<ContainerProps> = styled(Container)({\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n})\n\nexport const AppContainer: React.FC<PropsWithChildren> = ({ children }) => {\n // const ref = useRef<HTMLDivElement>(null);\n const { variant, elementId, theme } = useWidgetConfig()\n const { headerHeight } = useHeaderHeight()\n const positionFixedAdjustment =\n theme?.header?.position === 'fixed' ? headerHeight : 0\n\n return (\n <RelativeContainer\n variant={variant}\n id={createElementId(ElementId.RelativeContainer, elementId)}\n >\n <CssBaselineContainer\n id={createElementId(ElementId.ScrollableContainer, elementId)}\n variant={variant}\n enableColorScheme\n paddingTopAdjustment={positionFixedAdjustment}\n elementId={elementId}\n // ref={ref}\n >\n <FlexContainer disableGutters>{children}</FlexContainer>\n </CssBaselineContainer>\n {/* <ScrollToLocation elementRef={ref} /> */}\n </RelativeContainer>\n )\n}\n\n// export const ScrollToLocation: React.FC<{\n// elementRef: RefObject<HTMLElement>;\n// }> = ({ elementRef }) => {\n// const { pathname } = useLocation();\n// useLayoutEffect(() => {\n// elementRef.current?.scrollTo(0, 0);\n// }, [elementRef, pathname]);\n// return null;\n// };\n"],"mappings":";;;;;;;;AAmBA,MAAa,uBAA2C,OAAO,IAAI,EAChE,EAAE,YAAY;~~AACb~~,~~QAAO~~;EACL,SAAS;EACT,gBAAgB;EAChB,YAAY;EACZ,MAAM;EACN,QACE,MAAM,WAAW,YAAY,SACzB,SACA,MAAM,WAAW,YACf,SACA,MAAM,WAAW,UAAU;EACpC;EAEJ;AAED,MAAa,oBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,WACvC,CAAC,EAA+B,EAAE,YAAY;CAC7C,MAAM,YACJ,MAAM,WAAW,WAAW,iBAC3B,CAAC,MAAM,WAAW,UAAU,CAAC,MAAM,WAAW,YAC3C,SACA,mBAAmB,MAAM;~~AAC~~/B,~~QAAO~~;EACL,UAAU;EACV,WAAW;EACX,OAAO;EACP,UAAU,MAAM,YAAY,OAAO;EACnC,UAAU,MAAM,YAAY,OAAO;EACnC,YAAY,MAAM,KAAK,QAAQ,WAAW;EAC1C,UAAU;EACV,MAAM;EACN,GAAG,MAAM;EACT,WACE,MAAM,WAAW,YAAY,UAAU,CAAC,MAAM,WAAW,SACrD,SACA;EACN,QAAQ;EACR,UAAU,CACR;GACE,OAAO,EACL,SAAS,UACV;GACD,OAAO;IACL,WAAW;IACX,QAAQ;IACR,WAAW;IACX,cAAc;IACf;GACF,CACF;EACF;EACD;AAQF,MAAM,uBAAuB,OAAO,mBAAmB,EACrD,oBAAoB,SAClB,CAAC;CAAC;CAAW;CAAwB;CAAY,CAAC,SAAS,KAAe,EAC7E,CAAC,EAA6B,EAAE,OAAO,SAAS,2BAA2B;CAC1E,MAAM,YACJ,MAAM,WAAW,WAAW,iBAC3B,CAAC,MAAM,WAAW,UAAU,CAAC,MAAM,WAAW,YAC3C,SACA,mBAAmB,MAAM;~~AAC~~/B,~~QAAO~~;EACL,SAAS;EACT,MAAM;EACN,eAAe;EACf,WAAW;EACX,QAAQ;EACR,OAAO;EACP,WACE,YAAY,YAAY,MAAM,WAAW,YAAY,SACjD,SACA;EACN,WAAW;EACX,QAAQ,MAAM,WAAW,YAAY,SAAS,SAAS;EACvD,YAAY;EAEZ,+BAA+B,EAC7B,QACE,MAAM,WAAW,aACjB,MAAM,WAAW,UAAA,KAEpB;EACD,qBAAqB;GACnB,WAAW,mBAAmB,MAAM;GACpC,WAAW,mBAAmB,MAAM;GACrC;EACF;EACD;AAEF,MAAa,gBAA0C,OAAO,UAAU,CAAC;CACvE,SAAS;CACT,eAAe;CACf,MAAM;CACP,CAAC;AAEF,MAAa,gBAA6C,EAAE,eAAe;CAEzE,MAAM,EAAE,SAAS,WAAW,UAAU,iBAAiB;CACvD,MAAM,EAAE,iBAAiB,iBAAiB;CAC1C,MAAM,0BACJ,OAAO,QAAQ,aAAa,UAAU,eAAe;~~AAEvD~~,~~QACE~~,oBAAC,mBAAD;EACW;EACT,IAAI,gBAAA,6BAA6C,UAAU;YAE3D,oBAAC,sBAAD;GACE,IAAI,gBAAA,+BAA+C,UAAU;GACpD;GACT,mBAAA;GACA,sBAAsB;GACX;aAGX,oBAAC,eAAD;IAAe,gBAAA;IAAgB;IAAyB,CAAA;GACnC,CAAA;EAEL,CAAA"}
1	+ {"version":3,"file":"AppContainer.js","names":[],"sources":["../../../src/components/AppContainer.tsx"],"sourcesContent":["import type { BoxProps, ContainerProps } from '@mui/material'\nimport { Box, Container, ScopedCssBaseline, styled } from '@mui/material'\nimport type React from 'react'\nimport type { PropsWithChildren } from 'react'\nimport { defaultMaxHeight } from '../config/constants.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { useHeaderHeight } from '../stores/header/useHeaderStore.js'\nimport type { WidgetVariant } from '../types/widget.js'\nimport { createElementId, ElementId } from '../utils/elements.js'\nimport { getWidgetMaxHeight } from '../utils/widgetSize.js'\n\n// NOTE: the setting of the height in AppExpandedContainer, RelativeContainer and CssBaselineContainer can\n// be done dynamically by values in the config - namely the config.theme.container values display, maxHeight and height\n// A Number of other components and hooks work with height values that are often set on or derived from these elements\n// if there are changes to how the height works here you should also check the functionality of these hooks and their point of use\n// - useTokenListHeight\n// - useSetContentHeight\n// Also check any code that is using the methods from elements.ts utils file\n\nexport const AppExpandedContainer: React.FC<BoxProps> = styled(Box)(\n ({ theme }) => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'start',\n flex: 1,\n height:\n theme.container?.display === 'flex'\n ? '100%'\n : theme.container?.maxHeight\n ? 'auto'\n : theme.container?.height \|\| 'auto',\n }\n }\n)\n\nexport const RelativeContainer: React.FC<\n BoxProps & { variant?: WidgetVariant }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: WidgetVariant }>(({ theme }) => {\n const maxHeight =\n theme.container?.height === 'fit-content' \|\|\n (!theme.container?.height && !theme.container?.maxHeight)\n ? 'none'\n : getWidgetMaxHeight(theme)\n return {\n position: 'relative',\n boxSizing: 'content-box',\n width: '100%',\n minWidth: theme.breakpoints.values.xs,\n maxWidth: theme.breakpoints.values.sm,\n background: theme.vars.palette.background.default,\n overflow: 'auto',\n flex: 1,\n ...theme.container,\n maxHeight:\n theme.container?.display === 'flex' && !theme.container?.height\n ? '100%'\n : maxHeight,\n zIndex: 1, // NB: higher than of expansion containers\n variants: [\n {\n props: {\n variant: 'drawer',\n },\n style: {\n maxHeight: 'none',\n height: '100%',\n boxShadow: 'none',\n borderRadius: 0,\n },\n },\n ],\n }\n})\n\ninterface CssBaselineContainerProps {\n variant?: WidgetVariant\n paddingTopAdjustment: number\n elementId: string\n}\n\nconst CssBaselineContainer = styled(ScopedCssBaseline, {\n shouldForwardProp: (prop) =>\n !['variant', 'paddingTopAdjustment', 'elementId'].includes(prop as string),\n})<CssBaselineContainerProps>(({ theme, variant, paddingTopAdjustment }) => {\n const maxHeight =\n theme.container?.height === 'fit-content' \|\|\n (!theme.container?.height && !theme.container?.maxHeight)\n ? 'none'\n : getWidgetMaxHeight(theme)\n return {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n overflowX: 'clip',\n margin: 0,\n width: '100%',\n maxHeight:\n variant === 'drawer' \|\| theme.container?.display === 'flex'\n ? 'none'\n : maxHeight,\n overflowY: 'auto',\n height: theme.container?.display === 'flex' ? 'auto' : '100%',\n paddingTop: paddingTopAdjustment,\n // This allows FullPageContainer.tsx to expand and fill the available vertical space in max height and default layout modes\n '&:has(.full-page-container)': {\n height:\n theme.container?.maxHeight \|\|\n theme.container?.height \|\|\n defaultMaxHeight,\n },\n '&:has(.long-list)': {\n minHeight: getWidgetMaxHeight(theme),\n maxHeight: getWidgetMaxHeight(theme),\n },\n }\n})\n\nexport const FlexContainer: React.FC<ContainerProps> = styled(Container)({\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n})\n\nexport const AppContainer: React.FC<PropsWithChildren> = ({ children }) => {\n // const ref = useRef<HTMLDivElement>(null);\n const { variant, elementId, theme } = useWidgetConfig()\n const { headerHeight } = useHeaderHeight()\n const positionFixedAdjustment =\n theme?.header?.position === 'fixed' ? headerHeight : 0\n\n return (\n <RelativeContainer\n variant={variant}\n id={createElementId(ElementId.RelativeContainer, elementId)}\n >\n <CssBaselineContainer\n id={createElementId(ElementId.ScrollableContainer, elementId)}\n variant={variant}\n enableColorScheme\n paddingTopAdjustment={positionFixedAdjustment}\n elementId={elementId}\n // ref={ref}\n >\n <FlexContainer disableGutters>{children}</FlexContainer>\n </CssBaselineContainer>\n {/* <ScrollToLocation elementRef={ref} /> */}\n </RelativeContainer>\n )\n}\n\n// export const ScrollToLocation: React.FC<{\n// elementRef: RefObject<HTMLElement>;\n// }> = ({ elementRef }) => {\n// const { pathname } = useLocation();\n// useLayoutEffect(() => {\n// elementRef.current?.scrollTo(0, 0);\n// }, [elementRef, pathname]);\n// return null;\n// };\n"],"mappings":";;;;;;;;AAmBA,MAAa,uBAA2C,OAAO,IAAI,EAChE,EAAE,YAAY;CACb,OAAO;EACL,SAAS;EACT,gBAAgB;EAChB,YAAY;EACZ,MAAM;EACN,QACE,MAAM,WAAW,YAAY,SACzB,SACA,MAAM,WAAW,YACf,SACA,MAAM,WAAW,UAAU;EACpC;EAEJ;AAED,MAAa,oBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,WACvC,CAAC,EAA+B,EAAE,YAAY;CAC7C,MAAM,YACJ,MAAM,WAAW,WAAW,iBAC3B,CAAC,MAAM,WAAW,UAAU,CAAC,MAAM,WAAW,YAC3C,SACA,mBAAmB,MAAM;CAC/B,OAAO;EACL,UAAU;EACV,WAAW;EACX,OAAO;EACP,UAAU,MAAM,YAAY,OAAO;EACnC,UAAU,MAAM,YAAY,OAAO;EACnC,YAAY,MAAM,KAAK,QAAQ,WAAW;EAC1C,UAAU;EACV,MAAM;EACN,GAAG,MAAM;EACT,WACE,MAAM,WAAW,YAAY,UAAU,CAAC,MAAM,WAAW,SACrD,SACA;EACN,QAAQ;EACR,UAAU,CACR;GACE,OAAO,EACL,SAAS,UACV;GACD,OAAO;IACL,WAAW;IACX,QAAQ;IACR,WAAW;IACX,cAAc;IACf;GACF,CACF;EACF;EACD;AAQF,MAAM,uBAAuB,OAAO,mBAAmB,EACrD,oBAAoB,SAClB,CAAC;CAAC;CAAW;CAAwB;CAAY,CAAC,SAAS,KAAe,EAC7E,CAAC,EAA6B,EAAE,OAAO,SAAS,2BAA2B;CAC1E,MAAM,YACJ,MAAM,WAAW,WAAW,iBAC3B,CAAC,MAAM,WAAW,UAAU,CAAC,MAAM,WAAW,YAC3C,SACA,mBAAmB,MAAM;CAC/B,OAAO;EACL,SAAS;EACT,MAAM;EACN,eAAe;EACf,WAAW;EACX,QAAQ;EACR,OAAO;EACP,WACE,YAAY,YAAY,MAAM,WAAW,YAAY,SACjD,SACA;EACN,WAAW;EACX,QAAQ,MAAM,WAAW,YAAY,SAAS,SAAS;EACvD,YAAY;EAEZ,+BAA+B,EAC7B,QACE,MAAM,WAAW,aACjB,MAAM,WAAW,UAAA,KAEpB;EACD,qBAAqB;GACnB,WAAW,mBAAmB,MAAM;GACpC,WAAW,mBAAmB,MAAM;GACrC;EACF;EACD;AAEF,MAAa,gBAA0C,OAAO,UAAU,CAAC;CACvE,SAAS;CACT,eAAe;CACf,MAAM;CACP,CAAC;AAEF,MAAa,gBAA6C,EAAE,eAAe;CAEzE,MAAM,EAAE,SAAS,WAAW,UAAU,iBAAiB;CACvD,MAAM,EAAE,iBAAiB,iBAAiB;CAC1C,MAAM,0BACJ,OAAO,QAAQ,aAAa,UAAU,eAAe;CAEvD,OACE,oBAAC,mBAAD;EACW;EACT,IAAI,gBAAA,6BAA6C,UAAU;YAE3D,oBAAC,sBAAD;GACE,IAAI,gBAAA,+BAA+C,UAAU;GACpD;GACT,mBAAA;GACA,sBAAsB;GACX;aAGX,oBAAC,eAAD;IAAe,gBAAA;IAAgB;IAAyB,CAAA;GACnC,CAAA;EAEL,CAAA"}

package/dist/esm/components/Avatar/AccountAvatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccountAvatar.js","names":[],"sources":["../../../../src/components/Avatar/AccountAvatar.tsx"],"sourcesContent":["import { getConnectorIcon } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Badge } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useChain } from '../../hooks/useChain.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { AvatarDefault, AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\ninterface AccountAvatarProps {\n chainId?: number\n account?: Account\n toAddress?: ToAddress\n empty?: boolean\n}\n\nexport const AccountAvatar = ({\n chainId,\n account,\n empty,\n toAddress,\n}: AccountAvatarProps): JSX.Element => {\n const { chain } = useChain(chainId)\n\n const avatar = empty ? (\n <AvatarDefault />\n ) : account?.connector \|\| toAddress?.logoURI ? (\n <AvatarMasked\n src={toAddress?.logoURI \|\| getConnectorIcon(account?.connector)}\n alt={toAddress?.name \|\| account?.connector?.name}\n >\n {(toAddress?.name \|\| account?.connector?.name)?.[0]}\n </AvatarMasked>\n ) : (\n <AvatarDefault>\n <Wallet sx={{ fontSize: 20 }} />\n </AvatarDefault>\n )\n\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} />}\n >\n {avatar}\n </Badge>\n )\n}\n"],"mappings":";;;;;;;;AAiBA,MAAa,iBAAiB,EAC5B,SACA,SACA,OACA,gBACqC;CACrC,MAAM,EAAE,UAAU,SAAS,QAAQ;CAEnC,MAAM,SAAS,QACb,oBAAC,eAAD,EAAiB,CAAA,GACf,SAAS,aAAa,WAAW,UACnC,oBAAC,cAAD;EACE,KAAK,WAAW,WAAW,iBAAiB,SAAS,UAAU;EAC/D,KAAK,WAAW,QAAQ,SAAS,WAAW;aAE1C,WAAW,QAAQ,SAAS,WAAW,QAAQ;EACpC,CAAA,GAEf,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA,EAClB,CAAA;~~AAGlB~~,~~QACE~~,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD,EAA0B,OAAS,CAAA;YAEhD;EACK,CAAA"}
1	+ {"version":3,"file":"AccountAvatar.js","names":[],"sources":["../../../../src/components/Avatar/AccountAvatar.tsx"],"sourcesContent":["import { getConnectorIcon } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Badge } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useChain } from '../../hooks/useChain.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { AvatarDefault, AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\ninterface AccountAvatarProps {\n chainId?: number\n account?: Account\n toAddress?: ToAddress\n empty?: boolean\n}\n\nexport const AccountAvatar = ({\n chainId,\n account,\n empty,\n toAddress,\n}: AccountAvatarProps): JSX.Element => {\n const { chain } = useChain(chainId)\n\n const avatar = empty ? (\n <AvatarDefault />\n ) : account?.connector \|\| toAddress?.logoURI ? (\n <AvatarMasked\n src={toAddress?.logoURI \|\| getConnectorIcon(account?.connector)}\n alt={toAddress?.name \|\| account?.connector?.name}\n >\n {(toAddress?.name \|\| account?.connector?.name)?.[0]}\n </AvatarMasked>\n ) : (\n <AvatarDefault>\n <Wallet sx={{ fontSize: 20 }} />\n </AvatarDefault>\n )\n\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} />}\n >\n {avatar}\n </Badge>\n )\n}\n"],"mappings":";;;;;;;;AAiBA,MAAa,iBAAiB,EAC5B,SACA,SACA,OACA,gBACqC;CACrC,MAAM,EAAE,UAAU,SAAS,QAAQ;CAEnC,MAAM,SAAS,QACb,oBAAC,eAAD,EAAiB,CAAA,GACf,SAAS,aAAa,WAAW,UACnC,oBAAC,cAAD;EACE,KAAK,WAAW,WAAW,iBAAiB,SAAS,UAAU;EAC/D,KAAK,WAAW,QAAQ,SAAS,WAAW;aAE1C,WAAW,QAAQ,SAAS,WAAW,QAAQ;EACpC,CAAA,GAEf,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,IAAI,EAAI,CAAA,EAClB,CAAA;CAGlB,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD,EAA0B,OAAS,CAAA;YAEhD;EACK,CAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","names":[],"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge, Skeleton } from '@mui/material'\nimport { AvatarDefault, AvatarSkeletonMaskedContainer } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\nimport { SmallAvatarSkeleton } from './SmallAvatar.js'\n\nexport const AvatarBadgedDefault: React.FC<{\n sx?: SxProps<Theme>\n chain?: ExtendedChain\n}> = ({ sx, chain }) => {\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} />}\n sx={sx}\n >\n <AvatarDefault />\n </Badge>\n )\n}\n\nexport const AvatarBadgedSkeleton: React.FC<{\n sx?: SxProps<Theme>\n avatarSize?: number\n badgeSize?: number\n}> = ({ sx, avatarSize = 40, badgeSize = 16 }) => {\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<SmallAvatarSkeleton size={badgeSize} />}\n sx={sx}\n >\n <AvatarSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n </Badge>\n )\n}\n\nconst AvatarSkeleton: React.FC<{\n avatarSize: number\n badgeSize: number\n}> = ({ avatarSize, badgeSize }) => {\n return (\n <AvatarSkeletonMaskedContainer badgeSize={badgeSize}>\n <Skeleton width={avatarSize} height={avatarSize} variant=\"circular\" />\n </AvatarSkeletonMaskedContainer>\n )\n}\n"],"mappings":";;;;;;AAOA,MAAa,uBAGP,EAAE,IAAI,YAAY;~~AACtB~~,~~QACE~~,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD,EAA0B,OAAS,CAAA;EAC7C;YAEJ,oBAAC,eAAD,EAAiB,CAAA;EACX,CAAA;;AAIZ,MAAa,wBAIP,EAAE,IAAI,aAAa,IAAI,YAAY,SAAS;~~AAChD~~,~~QACE~~,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,qBAAD,EAAqB,MAAM,WAAa,CAAA;EAClD;YAEJ,oBAAC,gBAAD;GAA4B;GAAuB;GAAa,CAAA;EAC1D,CAAA;;AAIZ,MAAM,kBAGA,EAAE,YAAY,gBAAgB;~~AAClC~~,~~QACE~~,oBAAC,+BAAD;EAA0C;YACxC,oBAAC,UAAD;GAAU,OAAO;GAAY,QAAQ;GAAY,SAAQ;GAAa,CAAA;EACxC,CAAA"}
1	+ {"version":3,"file":"Avatar.js","names":[],"sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge, Skeleton } from '@mui/material'\nimport { AvatarDefault, AvatarSkeletonMaskedContainer } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\nimport { SmallAvatarSkeleton } from './SmallAvatar.js'\n\nexport const AvatarBadgedDefault: React.FC<{\n sx?: SxProps<Theme>\n chain?: ExtendedChain\n}> = ({ sx, chain }) => {\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} />}\n sx={sx}\n >\n <AvatarDefault />\n </Badge>\n )\n}\n\nexport const AvatarBadgedSkeleton: React.FC<{\n sx?: SxProps<Theme>\n avatarSize?: number\n badgeSize?: number\n}> = ({ sx, avatarSize = 40, badgeSize = 16 }) => {\n return (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<SmallAvatarSkeleton size={badgeSize} />}\n sx={sx}\n >\n <AvatarSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n </Badge>\n )\n}\n\nconst AvatarSkeleton: React.FC<{\n avatarSize: number\n badgeSize: number\n}> = ({ avatarSize, badgeSize }) => {\n return (\n <AvatarSkeletonMaskedContainer badgeSize={badgeSize}>\n <Skeleton width={avatarSize} height={avatarSize} variant=\"circular\" />\n </AvatarSkeletonMaskedContainer>\n )\n}\n"],"mappings":";;;;;;AAOA,MAAa,uBAGP,EAAE,IAAI,YAAY;CACtB,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD,EAA0B,OAAS,CAAA;EAC7C;YAEJ,oBAAC,eAAD,EAAiB,CAAA;EACX,CAAA;;AAIZ,MAAa,wBAIP,EAAE,IAAI,aAAa,IAAI,YAAY,SAAS;CAChD,OACE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,qBAAD,EAAqB,MAAM,WAAa,CAAA;EAClD;YAEJ,oBAAC,gBAAD;GAA4B;GAAuB;GAAa,CAAA;EAC1D,CAAA;;AAIZ,MAAM,kBAGA,EAAE,YAAY,gBAAgB;CAClC,OACE,oBAAC,+BAAD;EAA0C;YACxC,oBAAC,UAAD;GAAU,OAAO;GAAY,QAAQ;GAAY,SAAQ;GAAa,CAAA;EACxC,CAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.style.js","names":["MuiAvatar"],"sources":["../../../../src/components/Avatar/Avatar.style.tsx"],"sourcesContent":["import type { CSSObject } from '@mui/material'\nimport {\n AvatarGroup,\n avatarClasses,\n Box,\n badgeClasses,\n Avatar as MuiAvatar,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from './utils.js'\n\nexport const AvatarMasked: React.FC<\n React.ComponentProps<typeof MuiAvatar> & {\n avatarSize?: number\n badgeSize?: number\n }\n> = styled(MuiAvatar, {\n shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n ({ avatarSize = 40, badgeSize = 16 }) => ({\n width: avatarSize,\n height: avatarSize,\n mask: getAvatarMask(badgeSize),\n })\n)\n\nexport const TokenAvatarGroup: React.FC<\n React.ComponentProps<typeof AvatarGroup> & { badgeSize?: number }\n> = styled(AvatarGroup)(({ theme }) => ({\n [`& .${badgeClasses.badge}:last-of-type .${avatarClasses.root}`]: {\n boxSizing: 'border-box',\n },\n [`& .${avatarClasses.root}`]: {\n border: 'none',\n marginLeft: 0,\n },\n [`& .${badgeClasses.root}:first-of-type`]: {\n marginLeft: theme.spacing(-1),\n border: 'none',\n },\n [`& .${badgeClasses.root}:last-of-type`]: {\n border: 'none',\n },\n}))\n\nexport const AvatarDefault: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => {\n const root = theme.components?.MuiAvatar?.styleOverrides?.root as CSSObject\n return {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '50%',\n height: root?.height,\n width: root?.width,\n color: theme.vars.palette.text.secondary,\n mask: getAvatarMask(badgeSize),\n background: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n background: theme.vars.palette.grey[800],\n }),\n }\n})\n\nexport const AvatarDefaultBadge: React.FC<\n React.ComponentProps<typeof Box> & { size?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'size',\n})<{ size?: number }>(({ theme, size = 16 }) => {\n return {\n borderRadius: '50%',\n height: size,\n width: size,\n background: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n background: theme.vars.palette.grey[800],\n }),\n }\n})\n\nexport const AvatarSkeletonContainer: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n background: theme.vars.palette.background.paper,\n borderRadius: '50%',\n}))\n\nexport const AvatarSkeletonMaskedContainer: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => ({\n background: theme.vars.palette.background.paper,\n borderRadius: '50%',\n mask: getAvatarMask(badgeSize),\n}))\n"],"mappings":";;;AAYA,MAAa,eAKT,OAAOA,QAAW,EACpB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,aAChE,CAAC,EACC,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,OAAO;CACP,QAAQ;CACR,MAAM,cAAc,UAAU;CAC/B,EACF;AAIG,OAAO,YAAY,EAAE,EAAE,aAAa;EACrC,MAAM,aAAa,MAAM,iBAAiB,cAAc,SAAS,EAChE,WAAW,cACZ;EACA,MAAM,cAAc,SAAS;EAC5B,QAAQ;EACR,YAAY;EACb;EACA,MAAM,aAAa,KAAK,kBAAkB;EACzC,YAAY,MAAM,QAAQ,GAAG;EAC7B,QAAQ;EACT;EACA,MAAM,aAAa,KAAK,iBAAiB,EACxC,QAAQ,QACT;CACF,EAAE;AAEH,MAAa,gBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,SAAS;CACxD,MAAM,OAAO,MAAM,YAAY,WAAW,gBAAgB;~~AAC1D~~,~~QAAO~~;EACL,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,cAAc;EACd,QAAQ,MAAM;EACd,OAAO,MAAM;EACb,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,MAAM,cAAc,UAAU;EAC9B,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,MACrC,CAAC;EACH;EACD;AAEF,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,QACvC,CAAC,EAAqB,EAAE,OAAO,OAAO,SAAS;~~AAC9C~~,~~QAAO~~;EACL,cAAc;EACd,QAAQ;EACR,OAAO;EACP,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,MACrC,CAAC;EACH;EACD;AAEF,MAAa,0BAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACf,EAAE;AAEH,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,UAAU;CACzD,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACd,MAAM,cAAc,UAAU;CAC/B,EAAE"}
1	+ {"version":3,"file":"Avatar.style.js","names":["MuiAvatar"],"sources":["../../../../src/components/Avatar/Avatar.style.tsx"],"sourcesContent":["import type { CSSObject } from '@mui/material'\nimport {\n AvatarGroup,\n avatarClasses,\n Box,\n badgeClasses,\n Avatar as MuiAvatar,\n styled,\n} from '@mui/material'\nimport type React from 'react'\nimport { getAvatarMask } from './utils.js'\n\nexport const AvatarMasked: React.FC<\n React.ComponentProps<typeof MuiAvatar> & {\n avatarSize?: number\n badgeSize?: number\n }\n> = styled(MuiAvatar, {\n shouldForwardProp: (prop) => prop !== 'avatarSize' && prop !== 'badgeSize',\n})<{ avatarSize?: number; badgeSize?: number }>(\n ({ avatarSize = 40, badgeSize = 16 }) => ({\n width: avatarSize,\n height: avatarSize,\n mask: getAvatarMask(badgeSize),\n })\n)\n\nexport const TokenAvatarGroup: React.FC<\n React.ComponentProps<typeof AvatarGroup> & { badgeSize?: number }\n> = styled(AvatarGroup)(({ theme }) => ({\n [`& .${badgeClasses.badge}:last-of-type .${avatarClasses.root}`]: {\n boxSizing: 'border-box',\n },\n [`& .${avatarClasses.root}`]: {\n border: 'none',\n marginLeft: 0,\n },\n [`& .${badgeClasses.root}:first-of-type`]: {\n marginLeft: theme.spacing(-1),\n border: 'none',\n },\n [`& .${badgeClasses.root}:last-of-type`]: {\n border: 'none',\n },\n}))\n\nexport const AvatarDefault: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => {\n const root = theme.components?.MuiAvatar?.styleOverrides?.root as CSSObject\n return {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '50%',\n height: root?.height,\n width: root?.width,\n color: theme.vars.palette.text.secondary,\n mask: getAvatarMask(badgeSize),\n background: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n background: theme.vars.palette.grey[800],\n }),\n }\n})\n\nexport const AvatarDefaultBadge: React.FC<\n React.ComponentProps<typeof Box> & { size?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'size',\n})<{ size?: number }>(({ theme, size = 16 }) => {\n return {\n borderRadius: '50%',\n height: size,\n width: size,\n background: theme.vars.palette.grey[300],\n ...theme.applyStyles('dark', {\n background: theme.vars.palette.grey[800],\n }),\n }\n})\n\nexport const AvatarSkeletonContainer: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box)(({ theme }) => ({\n background: theme.vars.palette.background.paper,\n borderRadius: '50%',\n}))\n\nexport const AvatarSkeletonMaskedContainer: React.FC<\n React.ComponentProps<typeof Box> & { badgeSize?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'badgeSize',\n})<{ badgeSize?: number }>(({ theme, badgeSize = 16 }) => ({\n background: theme.vars.palette.background.paper,\n borderRadius: '50%',\n mask: getAvatarMask(badgeSize),\n}))\n"],"mappings":";;;AAYA,MAAa,eAKT,OAAOA,QAAW,EACpB,oBAAoB,SAAS,SAAS,gBAAgB,SAAS,aAChE,CAAC,EACC,EAAE,aAAa,IAAI,YAAY,UAAU;CACxC,OAAO;CACP,QAAQ;CACR,MAAM,cAAc,UAAU;CAC/B,EACF;AAIG,OAAO,YAAY,EAAE,EAAE,aAAa;EACrC,MAAM,aAAa,MAAM,iBAAiB,cAAc,SAAS,EAChE,WAAW,cACZ;EACA,MAAM,cAAc,SAAS;EAC5B,QAAQ;EACR,YAAY;EACb;EACA,MAAM,aAAa,KAAK,kBAAkB;EACzC,YAAY,MAAM,QAAQ,GAAG;EAC7B,QAAQ;EACT;EACA,MAAM,aAAa,KAAK,iBAAiB,EACxC,QAAQ,QACT;CACF,EAAE;AAEH,MAAa,gBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,SAAS;CACxD,MAAM,OAAO,MAAM,YAAY,WAAW,gBAAgB;CAC1D,OAAO;EACL,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,cAAc;EACd,QAAQ,MAAM;EACd,OAAO,MAAM;EACb,OAAO,MAAM,KAAK,QAAQ,KAAK;EAC/B,MAAM,cAAc,UAAU;EAC9B,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,MACrC,CAAC;EACH;EACD;AAEF,MAAa,qBAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,QACvC,CAAC,EAAqB,EAAE,OAAO,OAAO,SAAS;CAC9C,OAAO;EACL,cAAc;EACd,QAAQ;EACR,OAAO;EACP,YAAY,MAAM,KAAK,QAAQ,KAAK;EACpC,GAAG,MAAM,YAAY,QAAQ,EAC3B,YAAY,MAAM,KAAK,QAAQ,KAAK,MACrC,CAAC;EACH;EACD;AAEF,MAAa,0BAET,OAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACf,EAAE;AAEH,MAAa,gCAET,OAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,UAAU;CACzD,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,cAAc;CACd,MAAM,cAAc,UAAU;CAC/B,EAAE"}

package/dist/esm/components/Avatar/ChainBadgeContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChainBadgeContent.js","names":[],"sources":["../../../../src/components/Avatar/ChainBadgeContent.tsx"],"sourcesContent":["import type { Chain, ExtendedChain } from '@lifi/sdk'\nimport { AvatarDefaultBadge } from './Avatar.style.js'\nimport { SmallAvatar } from './SmallAvatar.js'\n\ninterface ChainBadgeContentProps {\n chain?: Chain \| ExtendedChain\n size?: number\n}\n\nexport const ChainBadgeContent: React.FC<ChainBadgeContentProps> = ({\n chain,\n size = 16,\n}) => {\n if (chain?.logoURI) {\n return (\n <SmallAvatar src={chain.logoURI} alt={chain.name} size={size}>\n {chain.name?.[0]}\n </SmallAvatar>\n )\n }\n return <AvatarDefaultBadge size={size} />\n}\n"],"mappings":";;;;AASA,MAAa,qBAAuD,EAClE,OACA,OAAO,SACH;~~AACJ~~,~~KAAI~~,OAAO,~~QACT~~,~~QACE~~,oBAAC,aAAD;EAAa,KAAK,MAAM;EAAS,KAAK,MAAM;EAAY;YACrD,MAAM,OAAO;EACF,CAAA;~~AAGlB~~,~~QAAO~~,oBAAC,oBAAD,EAA0B,MAAQ,CAAA"}
1	+ {"version":3,"file":"ChainBadgeContent.js","names":[],"sources":["../../../../src/components/Avatar/ChainBadgeContent.tsx"],"sourcesContent":["import type { Chain, ExtendedChain } from '@lifi/sdk'\nimport { AvatarDefaultBadge } from './Avatar.style.js'\nimport { SmallAvatar } from './SmallAvatar.js'\n\ninterface ChainBadgeContentProps {\n chain?: Chain \| ExtendedChain\n size?: number\n}\n\nexport const ChainBadgeContent: React.FC<ChainBadgeContentProps> = ({\n chain,\n size = 16,\n}) => {\n if (chain?.logoURI) {\n return (\n <SmallAvatar src={chain.logoURI} alt={chain.name} size={size}>\n {chain.name?.[0]}\n </SmallAvatar>\n )\n }\n return <AvatarDefaultBadge size={size} />\n}\n"],"mappings":";;;;AASA,MAAa,qBAAuD,EAClE,OACA,OAAO,SACH;CACJ,IAAI,OAAO,SACT,OACE,oBAAC,aAAD;EAAa,KAAK,MAAM;EAAS,KAAK,MAAM;EAAY;YACrD,MAAM,OAAO;EACF,CAAA;CAGlB,OAAO,oBAAC,oBAAD,EAA0B,MAAQ,CAAA"}

package/dist/esm/components/Avatar/SmallAvatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SmallAvatar.js","names":[],"sources":["../../../../src/components/Avatar/SmallAvatar.tsx"],"sourcesContent":["import { Avatar, Skeleton, styled } from '@mui/material'\nimport type React from 'react'\nimport { AvatarSkeletonContainer } from './Avatar.style.js'\n\ninterface SmallAvatarProps {\n size?: number\n}\n\nexport const SmallAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & SmallAvatarProps\n> = styled(Avatar, {\n shouldForwardProp: (prop) => prop !== 'size',\n})<SmallAvatarProps>(({ theme, size = 16 }) => ({\n background: theme.vars.palette.background.paper,\n width: size,\n height: size,\n}))\n\nexport const SmallAvatarSkeleton: React.FC<{\n size?: number\n}> = ({ size = 16 }) => {\n return (\n <AvatarSkeletonContainer>\n <Skeleton width={size} height={size} variant=\"circular\" />\n </AvatarSkeletonContainer>\n )\n}\n"],"mappings":";;;;AAQA,MAAa,cAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,QACvC,CAAC,EAAoB,EAAE,OAAO,OAAO,UAAU;CAC9C,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;CACT,EAAE;AAEH,MAAa,uBAEP,EAAE,OAAO,SAAS;~~AACtB~~,~~QACE~~,oBAAC,yBAAD,EAAA,UACE,oBAAC,UAAD;EAAU,OAAO;EAAM,QAAQ;EAAM,SAAQ;EAAa,CAAA,EAClC,CAAA"}
1	+ {"version":3,"file":"SmallAvatar.js","names":[],"sources":["../../../../src/components/Avatar/SmallAvatar.tsx"],"sourcesContent":["import { Avatar, Skeleton, styled } from '@mui/material'\nimport type React from 'react'\nimport { AvatarSkeletonContainer } from './Avatar.style.js'\n\ninterface SmallAvatarProps {\n size?: number\n}\n\nexport const SmallAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & SmallAvatarProps\n> = styled(Avatar, {\n shouldForwardProp: (prop) => prop !== 'size',\n})<SmallAvatarProps>(({ theme, size = 16 }) => ({\n background: theme.vars.palette.background.paper,\n width: size,\n height: size,\n}))\n\nexport const SmallAvatarSkeleton: React.FC<{\n size?: number\n}> = ({ size = 16 }) => {\n return (\n <AvatarSkeletonContainer>\n <Skeleton width={size} height={size} variant=\"circular\" />\n </AvatarSkeletonContainer>\n )\n}\n"],"mappings":";;;;AAQA,MAAa,cAET,OAAO,QAAQ,EACjB,oBAAoB,SAAS,SAAS,QACvC,CAAC,EAAoB,EAAE,OAAO,OAAO,UAAU;CAC9C,YAAY,MAAM,KAAK,QAAQ,WAAW;CAC1C,OAAO;CACP,QAAQ;CACT,EAAE;AAEH,MAAa,uBAEP,EAAE,OAAO,SAAS;CACtB,OACE,oBAAC,yBAAD,EAAA,UACE,oBAAC,UAAD;EAAU,OAAO;EAAM,QAAQ;EAAM,SAAQ;EAAa,CAAA,EAClC,CAAA"}

package/dist/esm/components/Avatar/TokenAvatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TokenAvatar.js","names":[],"sources":["../../../../src/components/Avatar/TokenAvatar.tsx"],"sourcesContent":["import type { Chain, StaticToken } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge } from '@mui/material'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport { AvatarBadgedSkeleton } from './Avatar.js'\nimport { AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\nexport const TokenAvatar: React.FC<{\n token?: StaticToken\n chain?: Chain\n isLoading?: boolean\n sx?: SxProps<Theme>\n tokenAvatarSize?: number\n chainAvatarSize?: number\n}> = ({\n token,\n chain,\n isLoading,\n sx,\n tokenAvatarSize = 40,\n chainAvatarSize = 16,\n}) => {\n if (!chain \|\| !token?.logoURI) {\n return (\n <TokenAvatarFallback\n token={token}\n isLoading={isLoading}\n sx={sx}\n tokenAvatarSize={tokenAvatarSize}\n chainAvatarSize={chainAvatarSize}\n />\n )\n }\n return (\n <TokenAvatarBase\n token={token}\n chain={chain}\n isLoading={isLoading}\n sx={sx}\n avatarSize={tokenAvatarSize}\n badgeSize={chainAvatarSize}\n />\n )\n}\n\nconst TokenAvatarFallback: React.FC<{\n token?: StaticToken\n isLoading?: boolean\n sx?: SxProps<Theme>\n tokenAvatarSize: number\n chainAvatarSize: number\n}> = ({ token, isLoading, sx, tokenAvatarSize, chainAvatarSize }) => {\n const { chain } = useChain(token?.chainId)\n const { token: chainToken, isLoading: isLoadingToken } = useToken(\n token?.chainId,\n token?.address\n )\n return (\n <TokenAvatarBase\n token={chainToken ?? token}\n isLoading={isLoading \|\| isLoadingToken}\n chain={chain}\n sx={sx}\n avatarSize={tokenAvatarSize}\n badgeSize={chainAvatarSize}\n />\n )\n}\n\nconst TokenAvatarBase: React.FC<{\n token?: StaticToken\n chain?: Chain\n isLoading?: boolean\n sx?: SxProps<Theme>\n avatarSize: number\n badgeSize: number\n}> = ({ token, chain, isLoading, sx, avatarSize, badgeSize }) => {\n return isLoading ? (\n <AvatarBadgedSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n ) : (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} size={badgeSize} />}\n sx={sx}\n >\n <AvatarMasked\n src={token?.logoURI}\n alt={token?.symbol}\n avatarSize={avatarSize}\n badgeSize={badgeSize}\n >\n {token?.symbol?.[0]}\n </AvatarMasked>\n </Badge>\n )\n}\n"],"mappings":";;;;;;;;AASA,MAAa,eAOP,EACJ,OACA,OACA,WACA,IACA,kBAAkB,IAClB,kBAAkB,SACd;~~AACJ~~,~~KAAI~~,CAAC,SAAS,CAAC,OAAO,~~QACpB~~,~~QACE~~,oBAAC,qBAAD;EACS;EACI;EACP;EACa;EACA;EACjB,CAAA;~~AAGN~~,~~QACE~~,oBAAC,iBAAD;EACS;EACA;EACI;EACP;EACJ,YAAY;EACZ,WAAW;EACX,CAAA;;AAIN,MAAM,uBAMA,EAAE,OAAO,WAAW,IAAI,iBAAiB,sBAAsB;CACnE,MAAM,EAAE,UAAU,SAAS,OAAO,QAAQ;CAC1C,MAAM,EAAE,OAAO,YAAY,WAAW,mBAAmB,SACvD,OAAO,SACP,OAAO,QACR;~~AACD~~,~~QACE~~,oBAAC,iBAAD;EACE,OAAO,cAAc;EACrB,WAAW,aAAa;EACjB;EACH;EACJ,YAAY;EACZ,WAAW;EACX,CAAA;;AAIN,MAAM,mBAOA,EAAE,OAAO,OAAO,WAAW,IAAI,YAAY,gBAAgB;~~AAC~~/D,~~QAAO~~,YACL,oBAAC,sBAAD;EAAkC;EAAuB;EAAa,CAAA,GAEtE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD;GAA0B;GAAO,MAAM;GAAa,CAAA;EAC9D;YAEJ,oBAAC,cAAD;GACE,KAAK,OAAO;GACZ,KAAK,OAAO;GACA;GACD;aAEV,OAAO,SAAS;GACJ,CAAA;EACT,CAAA"}
1	+ {"version":3,"file":"TokenAvatar.js","names":[],"sources":["../../../../src/components/Avatar/TokenAvatar.tsx"],"sourcesContent":["import type { Chain, StaticToken } from '@lifi/sdk'\nimport type { SxProps, Theme } from '@mui/material'\nimport { Badge } from '@mui/material'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useToken } from '../../hooks/useToken.js'\nimport { AvatarBadgedSkeleton } from './Avatar.js'\nimport { AvatarMasked } from './Avatar.style.js'\nimport { ChainBadgeContent } from './ChainBadgeContent.js'\n\nexport const TokenAvatar: React.FC<{\n token?: StaticToken\n chain?: Chain\n isLoading?: boolean\n sx?: SxProps<Theme>\n tokenAvatarSize?: number\n chainAvatarSize?: number\n}> = ({\n token,\n chain,\n isLoading,\n sx,\n tokenAvatarSize = 40,\n chainAvatarSize = 16,\n}) => {\n if (!chain \|\| !token?.logoURI) {\n return (\n <TokenAvatarFallback\n token={token}\n isLoading={isLoading}\n sx={sx}\n tokenAvatarSize={tokenAvatarSize}\n chainAvatarSize={chainAvatarSize}\n />\n )\n }\n return (\n <TokenAvatarBase\n token={token}\n chain={chain}\n isLoading={isLoading}\n sx={sx}\n avatarSize={tokenAvatarSize}\n badgeSize={chainAvatarSize}\n />\n )\n}\n\nconst TokenAvatarFallback: React.FC<{\n token?: StaticToken\n isLoading?: boolean\n sx?: SxProps<Theme>\n tokenAvatarSize: number\n chainAvatarSize: number\n}> = ({ token, isLoading, sx, tokenAvatarSize, chainAvatarSize }) => {\n const { chain } = useChain(token?.chainId)\n const { token: chainToken, isLoading: isLoadingToken } = useToken(\n token?.chainId,\n token?.address\n )\n return (\n <TokenAvatarBase\n token={chainToken ?? token}\n isLoading={isLoading \|\| isLoadingToken}\n chain={chain}\n sx={sx}\n avatarSize={tokenAvatarSize}\n badgeSize={chainAvatarSize}\n />\n )\n}\n\nconst TokenAvatarBase: React.FC<{\n token?: StaticToken\n chain?: Chain\n isLoading?: boolean\n sx?: SxProps<Theme>\n avatarSize: number\n badgeSize: number\n}> = ({ token, chain, isLoading, sx, avatarSize, badgeSize }) => {\n return isLoading ? (\n <AvatarBadgedSkeleton avatarSize={avatarSize} badgeSize={badgeSize} />\n ) : (\n <Badge\n overlap=\"circular\"\n anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n badgeContent={<ChainBadgeContent chain={chain} size={badgeSize} />}\n sx={sx}\n >\n <AvatarMasked\n src={token?.logoURI}\n alt={token?.symbol}\n avatarSize={avatarSize}\n badgeSize={badgeSize}\n >\n {token?.symbol?.[0]}\n </AvatarMasked>\n </Badge>\n )\n}\n"],"mappings":";;;;;;;;AASA,MAAa,eAOP,EACJ,OACA,OACA,WACA,IACA,kBAAkB,IAClB,kBAAkB,SACd;CACJ,IAAI,CAAC,SAAS,CAAC,OAAO,SACpB,OACE,oBAAC,qBAAD;EACS;EACI;EACP;EACa;EACA;EACjB,CAAA;CAGN,OACE,oBAAC,iBAAD;EACS;EACA;EACI;EACP;EACJ,YAAY;EACZ,WAAW;EACX,CAAA;;AAIN,MAAM,uBAMA,EAAE,OAAO,WAAW,IAAI,iBAAiB,sBAAsB;CACnE,MAAM,EAAE,UAAU,SAAS,OAAO,QAAQ;CAC1C,MAAM,EAAE,OAAO,YAAY,WAAW,mBAAmB,SACvD,OAAO,SACP,OAAO,QACR;CACD,OACE,oBAAC,iBAAD;EACE,OAAO,cAAc;EACrB,WAAW,aAAa;EACjB;EACH;EACJ,YAAY;EACZ,WAAW;EACX,CAAA;;AAIN,MAAM,mBAOA,EAAE,OAAO,OAAO,WAAW,IAAI,YAAY,gBAAgB;CAC/D,OAAO,YACL,oBAAC,sBAAD;EAAkC;EAAuB;EAAa,CAAA,GAEtE,oBAAC,OAAD;EACE,SAAQ;EACR,cAAc;GAAE,UAAU;GAAU,YAAY;GAAS;EACzD,cAAc,oBAAC,mBAAD;GAA0B;GAAO,MAAM;GAAa,CAAA;EAC9D;YAEJ,oBAAC,cAAD;GACE,KAAK,OAAO;GACZ,KAAK,OAAO;GACA;GACD;aAEV,OAAO,SAAS;GACJ,CAAA;EACT,CAAA"}

package/dist/esm/components/Avatar/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","names":[],"sources":["../../../../src/components/Avatar/utils.ts"],"sourcesContent":["const borderWidthPx = 2.5\n\n// 14% is the right bottom offset of the MUI's badge (MuiBadge-badge class)\nexport const getAvatarMask = (badgeSize: number) => {\n return `radial-gradient(circle ${badgeSize / 2 + borderWidthPx}px at calc(100% - 14%) calc(100% - 14%), #fff0 96%, #fff) 100% 100% / 100% 100% no-repeat`\n}\n"],"mappings":";AAAA,MAAM,gBAAgB;AAGtB,MAAa,iBAAiB,cAAsB;~~AAClD~~,~~QAAO~~,0BAA0B,YAAY,IAAI,cAAc"}
1	+ {"version":3,"file":"utils.js","names":[],"sources":["../../../../src/components/Avatar/utils.ts"],"sourcesContent":["const borderWidthPx = 2.5\n\n// 14% is the right bottom offset of the MUI's badge (MuiBadge-badge class)\nexport const getAvatarMask = (badgeSize: number) => {\n return `radial-gradient(circle ${badgeSize / 2 + borderWidthPx}px at calc(100% - 14%) calc(100% - 14%), #fff0 96%, #fff) 100% 100% / 100% 100% no-repeat`\n}\n"],"mappings":";AAAA,MAAM,gBAAgB;AAGtB,MAAa,iBAAiB,cAAsB;CAClD,OAAO,0BAA0B,YAAY,IAAI,cAAc"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseTransactionButton.js","names":[],"sources":["../../../../src/components/BaseTransactionButton/BaseTransactionButton.tsx"],"sourcesContent":["import { useWalletMenu } from '@lifi/wallet-management'\nimport { Button } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { BaseTransactionButtonProps } from './types.js'\n\nexport const BaseTransactionButton: React.FC<BaseTransactionButtonProps> = ({\n onClick,\n text,\n disabled,\n loading,\n route,\n sx,\n}) => {\n const { t } = useTranslation()\n const { walletConfig } = useWidgetConfig()\n const { openWalletMenu } = useWalletMenu()\n const [fromChainId] = useFieldValues('fromChain')\n const { chain } = useChain(fromChainId)\n const { connected, missingChain } = useRouteRequiredAccountConnection(\n route,\n chain\n )\n const handleClick = async (e: React.MouseEvent<HTMLElement>) => {\n if (connected) {\n onClick?.()\n return\n }\n const connectionOptions = missingChain ? { chain: missingChain } : undefined\n if (\n walletConfig?.onConnect &&\n !walletConfig?.forceInternalWalletManagement\n ) {\n walletConfig.onConnect(connectionOptions)\n } else {\n openWalletMenu(connectionOptions)\n e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n }\n }\n\n const getButtonText = () => {\n if (connected) {\n if (text) {\n return text\n }\n }\n return missingChain\n ? t('button.connectChainWallet', {\n chain: missingChain.name,\n })\n : t('button.connectWallet')\n }\n\n return (\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={handleClick}\n disabled={connected && disabled}\n loading={loading}\n loadingPosition=\"center\"\n fullWidth\n sx={sx}\n >\n {getButtonText()}\n </Button>\n )\n}\n"],"mappings":";;;;;;;;;AASA,MAAa,yBAA+D,EAC1E,SACA,MACA,UACA,SACA,OACA,SACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,iBAAiB,iBAAiB;CAC1C,MAAM,EAAE,mBAAmB,eAAe;CAC1C,MAAM,CAAC,eAAe,eAAe,YAAY;CACjD,MAAM,EAAE,UAAU,SAAS,YAAY;CACvC,MAAM,EAAE,WAAW,iBAAiB,kCAClC,OACA,MACD;CACD,MAAM,cAAc,OAAO,MAAqC;~~AAC9D~~,~~MAAI~~,WAAW;~~AACb~~,~~cAAW~~;~~AACX~~;;EAEF,MAAM,oBAAoB,eAAe,EAAE,OAAO,cAAc,GAAG,KAAA;~~AACnE~~,~~MACE~~,cAAc,aACd,CAAC,cAAc,~~8BAEf~~,~~cAAa,~~UAAU,kBAAkB;OACpC;~~AACL~~,~~kBAAe~~,kBAAkB;~~AACjC~~,~~KAAE~~,cAAc,MAAM;;;CAI1B,MAAM,sBAAsB;~~AAC1B~~,~~MAAI~~;OACE,~~KACF~~,~~QAAO~~;;~~AAGX~~,~~SAAO~~,eACH,EAAE,6BAA6B,EAC7B,OAAO,aAAa,MACrB,CAAC,GACF,EAAE,uBAAuB;;~~AAG~~/B,~~QACE~~,oBAAC,QAAD;EACE,SAAQ;EACR,OAAM;EACN,SAAS;EACT,UAAU,aAAa;EACd;EACT,iBAAgB;EAChB,WAAA;EACI;YAEH,eAAe;EACT,CAAA"}
1	+ {"version":3,"file":"BaseTransactionButton.js","names":[],"sources":["../../../../src/components/BaseTransactionButton/BaseTransactionButton.tsx"],"sourcesContent":["import { useWalletMenu } from '@lifi/wallet-management'\nimport { Button } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { BaseTransactionButtonProps } from './types.js'\n\nexport const BaseTransactionButton: React.FC<BaseTransactionButtonProps> = ({\n onClick,\n text,\n disabled,\n loading,\n route,\n sx,\n}) => {\n const { t } = useTranslation()\n const { walletConfig } = useWidgetConfig()\n const { openWalletMenu } = useWalletMenu()\n const [fromChainId] = useFieldValues('fromChain')\n const { chain } = useChain(fromChainId)\n const { connected, missingChain } = useRouteRequiredAccountConnection(\n route,\n chain\n )\n const handleClick = async (e: React.MouseEvent<HTMLElement>) => {\n if (connected) {\n onClick?.()\n return\n }\n const connectionOptions = missingChain ? { chain: missingChain } : undefined\n if (\n walletConfig?.onConnect &&\n !walletConfig?.forceInternalWalletManagement\n ) {\n walletConfig.onConnect(connectionOptions)\n } else {\n openWalletMenu(connectionOptions)\n e.currentTarget.blur() // Remove focus to prevent accessibility issues when opening drawer\n }\n }\n\n const getButtonText = () => {\n if (connected) {\n if (text) {\n return text\n }\n }\n return missingChain\n ? t('button.connectChainWallet', {\n chain: missingChain.name,\n })\n : t('button.connectWallet')\n }\n\n return (\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={handleClick}\n disabled={connected && disabled}\n loading={loading}\n loadingPosition=\"center\"\n fullWidth\n sx={sx}\n >\n {getButtonText()}\n </Button>\n )\n}\n"],"mappings":";;;;;;;;;AASA,MAAa,yBAA+D,EAC1E,SACA,MACA,UACA,SACA,OACA,SACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,iBAAiB,iBAAiB;CAC1C,MAAM,EAAE,mBAAmB,eAAe;CAC1C,MAAM,CAAC,eAAe,eAAe,YAAY;CACjD,MAAM,EAAE,UAAU,SAAS,YAAY;CACvC,MAAM,EAAE,WAAW,iBAAiB,kCAClC,OACA,MACD;CACD,MAAM,cAAc,OAAO,MAAqC;EAC9D,IAAI,WAAW;GACb,WAAW;GACX;;EAEF,MAAM,oBAAoB,eAAe,EAAE,OAAO,cAAc,GAAG,KAAA;EACnE,IACE,cAAc,aACd,CAAC,cAAc,+BAEf,aAAa,UAAU,kBAAkB;OACpC;GACL,eAAe,kBAAkB;GACjC,EAAE,cAAc,MAAM;;;CAI1B,MAAM,sBAAsB;EAC1B,IAAI;OACE,MACF,OAAO;;EAGX,OAAO,eACH,EAAE,6BAA6B,EAC7B,OAAO,aAAa,MACrB,CAAC,GACF,EAAE,uBAAuB;;CAG/B,OACE,oBAAC,QAAD;EACE,SAAQ;EACR,OAAM;EACN,SAAS;EACT,UAAU,aAAa;EACd;EACT,iBAAgB;EAChB,WAAA;EACI;YAEH,eAAe;EACT,CAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"BottomSheet.js","names":[],"sources":["../../../../src/components/BottomSheet/BottomSheet.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react'\nimport {\n forwardRef,\n startTransition,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react'\nimport { useGetScrollableContainer } from '../../hooks/useScrollableContainer.js'\nimport { modalProps, slotProps } from '../Dialog/Dialog.js'\nimport type { BottomSheetBase, BottomSheetProps } from './types.js'\n\nexport const BottomSheet: ForwardRefExoticComponent<\n Omit<BottomSheetProps, 'ref'> & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, BottomSheetProps>(\n ({ elementRef, children, open, onClose, keepMounted = false }, ref) => {\n const getContainer = useGetScrollableContainer()\n const openRef = useRef(open)\n const [drawerOpen, setDrawerOpen] = useState(open)\n const [isInert, setIsInert] = useState(!open)\n\n const close = useCallback(() => {\n // Set inert first to prevent focus issues\n setIsInert(true)\n // Push the state update to the next event loop tick\n // to ensure the inert is applied to before the drawer is closed\n startTransition(() => {\n setDrawerOpen(false)\n openRef.current = false\n onClose?.()\n })\n }, [onClose])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => openRef.current,\n open: () => {\n setIsInert(false)\n setDrawerOpen(true)\n openRef.current = true\n },\n close,\n }),\n [close]\n )\n\n return (\n <Drawer\n container={getContainer}\n ref={elementRef}\n anchor=\"bottom\"\n open={drawerOpen}\n onClose={close}\n ModalProps={modalProps}\n slotProps={slotProps}\n disableAutoFocus\n keepMounted={keepMounted}\n inert={isInert}\n >\n {children}\n </Drawer>\n )\n }\n)\n"],"mappings":";;;;;;AAcA,MAAa,cAET,YACD,EAAE,YAAY,UAAU,MAAM,SAAS,cAAc,SAAS,QAAQ;CACrE,MAAM,eAAe,2BAA2B;CAChD,MAAM,UAAU,OAAO,KAAK;CAC5B,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAClD,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC,KAAK;CAE7C,MAAM,QAAQ,kBAAkB;~~AAE9B~~,~~aAAW~~,KAAK;~~AAGhB~~,~~wBAAsB~~;~~AACpB~~,~~iBAAc~~,MAAM;~~AACpB~~,~~WAAQ~~,UAAU;~~AAClB~~,~~cAAW~~;IACX;IACD,CAAC,QAAQ,CAAC;~~AAEb~~,~~qBACE~~,YACO;EACL,cAAc,QAAQ;EACtB,YAAY;~~AACV~~,~~cAAW~~,MAAM;~~AACjB~~,~~iBAAc~~,KAAK;~~AACnB~~,~~WAAQ~~,UAAU;;EAEpB;EACD,GACD,CAAC,MAAM,CACR;~~AAED~~,~~QACE~~,oBAAC,QAAD;EACE,WAAW;EACX,KAAK;EACL,QAAO;EACP,MAAM;EACN,SAAS;EACT,YAAY;EACD;EACX,kBAAA;EACa;EACb,OAAO;EAEN;EACM,CAAA;EAGd"}
1	+ {"version":3,"file":"BottomSheet.js","names":[],"sources":["../../../../src/components/BottomSheet/BottomSheet.tsx"],"sourcesContent":["import { Drawer } from '@mui/material'\nimport type { ForwardRefExoticComponent, RefAttributes } from 'react'\nimport {\n forwardRef,\n startTransition,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react'\nimport { useGetScrollableContainer } from '../../hooks/useScrollableContainer.js'\nimport { modalProps, slotProps } from '../Dialog/Dialog.js'\nimport type { BottomSheetBase, BottomSheetProps } from './types.js'\n\nexport const BottomSheet: ForwardRefExoticComponent<\n Omit<BottomSheetProps, 'ref'> & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, BottomSheetProps>(\n ({ elementRef, children, open, onClose, keepMounted = false }, ref) => {\n const getContainer = useGetScrollableContainer()\n const openRef = useRef(open)\n const [drawerOpen, setDrawerOpen] = useState(open)\n const [isInert, setIsInert] = useState(!open)\n\n const close = useCallback(() => {\n // Set inert first to prevent focus issues\n setIsInert(true)\n // Push the state update to the next event loop tick\n // to ensure the inert is applied to before the drawer is closed\n startTransition(() => {\n setDrawerOpen(false)\n openRef.current = false\n onClose?.()\n })\n }, [onClose])\n\n useImperativeHandle(\n ref,\n () => ({\n isOpen: () => openRef.current,\n open: () => {\n setIsInert(false)\n setDrawerOpen(true)\n openRef.current = true\n },\n close,\n }),\n [close]\n )\n\n return (\n <Drawer\n container={getContainer}\n ref={elementRef}\n anchor=\"bottom\"\n open={drawerOpen}\n onClose={close}\n ModalProps={modalProps}\n slotProps={slotProps}\n disableAutoFocus\n keepMounted={keepMounted}\n inert={isInert}\n >\n {children}\n </Drawer>\n )\n }\n)\n"],"mappings":";;;;;;AAcA,MAAa,cAET,YACD,EAAE,YAAY,UAAU,MAAM,SAAS,cAAc,SAAS,QAAQ;CACrE,MAAM,eAAe,2BAA2B;CAChD,MAAM,UAAU,OAAO,KAAK;CAC5B,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAClD,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC,KAAK;CAE7C,MAAM,QAAQ,kBAAkB;EAE9B,WAAW,KAAK;EAGhB,sBAAsB;GACpB,cAAc,MAAM;GACpB,QAAQ,UAAU;GAClB,WAAW;IACX;IACD,CAAC,QAAQ,CAAC;CAEb,oBACE,YACO;EACL,cAAc,QAAQ;EACtB,YAAY;GACV,WAAW,MAAM;GACjB,cAAc,KAAK;GACnB,QAAQ,UAAU;;EAEpB;EACD,GACD,CAAC,MAAM,CACR;CAED,OACE,oBAAC,QAAD;EACE,WAAW;EACX,KAAK;EACL,QAAO;EACP,MAAM;EACN,SAAS;EACT,YAAY;EACD;EACX,kBAAA;EACa;EACb,OAAO;EAEN;EACM,CAAA;EAGd"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","names":["Card","MuiCard"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import type { CardProps as MuiCardProps } from '@mui/material'\nimport { Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\n\nexport interface CardProps extends MuiCardProps {\n type?: 'default' \| 'selected' \| 'error'\n selectionColor?: 'primary' \| 'secondary'\n indented?: boolean\n}\n\nexport const Card: React.FC<React.ComponentProps<typeof MuiCard> & CardProps> =\n styled(MuiCard, {\n shouldForwardProp: (prop) =>\n !['type', 'indented', 'selectionColor'].includes(prop as string),\n })<CardProps>(({ theme }) => {\n return {\n padding: 0,\n variants: [\n {\n props: ({ indented }) => indented,\n style: {\n padding: theme.spacing(2),\n },\n },\n {\n props: {\n selectionColor: 'primary',\n type: 'selected',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: theme.vars.palette.primary.main,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 5%, white)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 10%, white)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 35%, black)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 40%, black)`,\n },\n borderColor: theme.vars.palette.primary.main,\n }),\n },\n },\n {\n props: {\n selectionColor: 'secondary',\n type: 'selected',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, white)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, white)`,\n },\n ...theme.applyStyles('dark', {\n borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, black)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, black)`,\n },\n }),\n },\n },\n {\n props: {\n type: 'error',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: theme.vars.palette.error.main,\n },\n },\n ],\n }\n })\n"],"mappings":";;AAUA,MAAaA,SACX,OAAOC,MAAS,EACd,oBAAoB,SAClB,CAAC;CAAC;CAAQ;CAAY;CAAiB,CAAC,SAAS,KAAe,EACnE,CAAC,EAAa,EAAE,YAAY;~~AAC3B~~,~~QAAO~~;EACL,SAAS;EACT,UAAU;GACR;IACE,QAAQ,EAAE,eAAe;IACzB,OAAO,EACL,SAAS,MAAM,QAAQ,EAAE,EAC1B;IACF;GACD;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;KACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,QAAQ;KACxC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,eACxE;KACD,GAAG,MAAM,YAAY,QAAQ;MAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;MACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,eACxE;MACD,aAAa,MAAM,KAAK,QAAQ,QAAQ;MACzC,CAAC;KACH;IACF;GACD;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;KACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,eAC1E;KACD,GAAG,MAAM,YAAY,QAAQ;MAC3B,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,eAC1E;MACF,CAAC;KACH;IACF;GACD;IACE,OAAO,EACL,MAAM,SACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,MAAM;KACvC;IACF;GACF;EACF;EACD"}
1	+ {"version":3,"file":"Card.js","names":["Card","MuiCard"],"sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import type { CardProps as MuiCardProps } from '@mui/material'\nimport { Card as MuiCard, styled } from '@mui/material'\nimport type React from 'react'\n\nexport interface CardProps extends MuiCardProps {\n type?: 'default' \| 'selected' \| 'error'\n selectionColor?: 'primary' \| 'secondary'\n indented?: boolean\n}\n\nexport const Card: React.FC<React.ComponentProps<typeof MuiCard> & CardProps> =\n styled(MuiCard, {\n shouldForwardProp: (prop) =>\n !['type', 'indented', 'selectionColor'].includes(prop as string),\n })<CardProps>(({ theme }) => {\n return {\n padding: 0,\n variants: [\n {\n props: ({ indented }) => indented,\n style: {\n padding: theme.spacing(2),\n },\n },\n {\n props: {\n selectionColor: 'primary',\n type: 'selected',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: theme.vars.palette.primary.main,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 5%, white)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 10%, white)`,\n },\n ...theme.applyStyles('dark', {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 35%, black)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 40%, black)`,\n },\n borderColor: theme.vars.palette.primary.main,\n }),\n },\n },\n {\n props: {\n selectionColor: 'secondary',\n type: 'selected',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, white)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, white)`,\n },\n ...theme.applyStyles('dark', {\n borderColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 32%, transparent)`,\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 24%, black)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.secondary.main} 28%, black)`,\n },\n }),\n },\n },\n {\n props: {\n type: 'error',\n },\n style: {\n borderWidth: 1,\n borderStyle: 'solid',\n borderColor: theme.vars.palette.error.main,\n },\n },\n ],\n }\n })\n"],"mappings":";;AAUA,MAAaA,SACX,OAAOC,MAAS,EACd,oBAAoB,SAClB,CAAC;CAAC;CAAQ;CAAY;CAAiB,CAAC,SAAS,KAAe,EACnE,CAAC,EAAa,EAAE,YAAY;CAC3B,OAAO;EACL,SAAS;EACT,UAAU;GACR;IACE,QAAQ,EAAE,eAAe;IACzB,OAAO,EACL,SAAS,MAAM,QAAQ,EAAE,EAC1B;IACF;GACD;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;KACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,QAAQ;KACxC,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;KACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,eACxE;KACD,GAAG,MAAM,YAAY,QAAQ;MAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK;MACvE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,QAAQ,KAAK,eACxE;MACD,aAAa,MAAM,KAAK,QAAQ,QAAQ;MACzC,CAAC;KACH;IACF;GACD;IACE,OAAO;KACL,gBAAgB;KAChB,MAAM;KACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;KACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,eAC1E;KACD,GAAG,MAAM,YAAY,QAAQ;MAC3B,aAAa,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACrE,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK;MACzE,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,UAAU,KAAK,eAC1E;MACF,CAAC;KACH;IACF;GACD;IACE,OAAO,EACL,MAAM,SACP;IACD,OAAO;KACL,aAAa;KACb,aAAa;KACb,aAAa,MAAM,KAAK,QAAQ,MAAM;KACvC;IACF;GACF;EACF;EACD"}

package/dist/esm/components/Card/CardIconButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardIconButton.js","names":["MuiIconButton"],"sources":["../../../../src/components/Card/CardIconButton.tsx"],"sourcesContent":["import type { IconButtonProps, LinkProps } from '@mui/material'\nimport { IconButton as MuiIconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const CardIconButton: React.FC<\n React.ComponentProps<typeof MuiIconButton> &\n IconButtonProps &\n Pick<LinkProps, 'href' \| 'target' \| 'rel'>\n> = styled(MuiIconButton)<\n IconButtonProps & Pick<LinkProps, 'href' \| 'target' \| 'rel'>\n>(({ theme }) => {\n return {\n padding: theme.spacing(0.5),\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n },\n fontSize: '1rem',\n }\n})\n"],"mappings":";;AAIA,MAAa,iBAIT,OAAOA,WAAc,EAEtB,EAAE,YAAY;~~AACf~~,~~QAAO~~;EACL,SAAS,MAAM,QAAQ,GAAI;EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,oBAC/E;EACD,UAAU;EACX;EACD"}
1	+ {"version":3,"file":"CardIconButton.js","names":["MuiIconButton"],"sources":["../../../../src/components/Card/CardIconButton.tsx"],"sourcesContent":["import type { IconButtonProps, LinkProps } from '@mui/material'\nimport { IconButton as MuiIconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const CardIconButton: React.FC<\n React.ComponentProps<typeof MuiIconButton> &\n IconButtonProps &\n Pick<LinkProps, 'href' \| 'target' \| 'rel'>\n> = styled(MuiIconButton)<\n IconButtonProps & Pick<LinkProps, 'href' \| 'target' \| 'rel'>\n>(({ theme }) => {\n return {\n padding: theme.spacing(0.5),\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n '&:hover': {\n backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n },\n fontSize: '1rem',\n }\n})\n"],"mappings":";;AAIA,MAAa,iBAIT,OAAOA,WAAc,EAEtB,EAAE,YAAY;CACf,OAAO;EACL,SAAS,MAAM,QAAQ,GAAI;EAC3B,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa;EAC9E,WAAW,EACT,iBAAiB,sBAAsB,MAAM,KAAK,QAAQ,OAAO,aAAa,oBAC/E;EACD,UAAU;EACX;EACD"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/ChainSelect.tsx"],"sourcesContent":["import type { EVMChain } from '@lifi/sdk'\nimport { Skeleton, type Theme, Tooltip, useMediaQuery } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { type JSX, memo, useCallback, useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport {\n maxChainsToOrder,\n maxChainsToShow,\n maxGridItemsToShow,\n} from '../../stores/chains/createChainOrderStore.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AllChainsAvatar } from '../Chains/AllChainsAvatar.js'\nimport {\n ChainAvatar,\n ChainCard,\n ChainContainer,\n MoreChainsBox,\n MoreChainsText,\n} from './ChainSelect.style.js'\nimport { useChainSelect } from './useChainSelect.js'\n\nexport const ChainSelect: React.NamedExoticComponent<FormTypeProps> = memo(\n ({ formType }: FormTypeProps): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const isMobile = useMediaQuery((theme: Theme) =>\n theme.breakpoints.down(theme.breakpoints.values.xs)\n )\n const { setFieldValue } = useFieldActions()\n const {\n chainOrder,\n chains,\n isLoading,\n getSelectedChains,\n setChainOrder,\n setCurrentChain,\n } = useChainSelect(formType)\n\n const [showAllNetworks, isAllNetworks, setIsAllNetworks] =\n useChainOrderStore((state) => [\n state[`${formType}ShowAllNetworks`],\n state[`${formType}IsAllNetworks`],\n state.setIsAllNetworks,\n ])\n\n const [chainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n\n useEffect(() => {\n if (chainId) {\n const hasChainInOrderedList = chainOrder.includes(chainId)\n // If we don't have a chain in the ordered chain list we should add it.\n if (!hasChainInOrderedList) {\n setChainOrder(chainId, formType)\n }\n }\n }, [chainId, chainOrder, formType, setChainOrder])\n\n const onChainSelect = useCallback(\n (selectedChainId: number) => {\n setIsAllNetworks(false, formType)\n setCurrentChain(selectedChainId)\n },\n [setIsAllNetworks, setCurrentChain, formType]\n )\n\n const showAllChains = useCallback(() => {\n navigate({ to: navigationRoutes[`${formType}Chain`] })\n }, [navigate, formType])\n\n const selectAllNetworks = useCallback(() => {\n setIsAllNetworks(true, formType)\n // Reset the chain and token fields when selecting all networks\n setFieldValue(FormKeyHelper.getChainKey(formType), '', {\n isTouched: true,\n })\n setFieldValue(FormKeyHelper.getTokenKey(formType), '', {\n isTouched: true,\n })\n }, [setIsAllNetworks, formType, setFieldValue])\n\n const chainsToHide =\n chains?.length === maxChainsToShow\n ? 0\n : (chains?.length ?? 0) - maxChainsToOrder\n\n const chainsToShow = useMemo(\n () => (chainsToHide > 0 ? getSelectedChains() : chains) ?? [],\n [chainsToHide, getSelectedChains, chains]\n )\n\n const tilesCount =\n chainsToShow.length +\n (showAllNetworks ? 1 : 0) +\n (chainsToHide > 0 ? 1 : 0)\n\n if (isLoading) {\n return (\n <ChainContainer itemCount={tilesCount}>\n {Array.from({ length: maxGridItemsToShow }).map((_, index) => (\n <Skeleton\n key={index}\n variant=\"rectangular\"\n width={56}\n height={isMobile ? 36 : 56}\n sx={{ borderRadius: 1 }}\n />\n ))}\n </ChainContainer>\n )\n }\n\n return (\n <ChainContainer itemCount={tilesCount}>\n {showAllNetworks && (\n <Tooltip title={t('main.allNetworks')} enterNextDelay={100}>\n <ChainCard\n component=\"button\"\n onClick={selectAllNetworks}\n type={isAllNetworks ? 'selected' : 'default'}\n selectionColor=\"secondary\"\n >\n <AllChainsAvatar\n chains={chains ?? []}\n size={isMobile ? 'small' : 'medium'}\n />\n </ChainCard>\n </Tooltip>\n )}\n {chainsToShow.map((chain: EVMChain) => (\n <ChainItem\n key={chain.id}\n chain={chain}\n isSelected={chainId === chain.id}\n isAllNetworks={isAllNetworks}\n onSelect={onChainSelect}\n />\n ))}\n {chainsToHide > 0 && (\n <ChainCard component=\"button\" onClick={showAllChains}>\n <MoreChainsBox>\n <MoreChainsText>+{chainsToHide}</MoreChainsText>\n </MoreChainsBox>\n </ChainCard>\n )}\n </ChainContainer>\n )\n }\n)\n\nconst ChainItem = memo(\n ({\n chain,\n isSelected,\n isAllNetworks,\n onSelect,\n }: {\n chain: EVMChain\n isSelected: boolean\n isAllNetworks: boolean\n onSelect: (id: number) => void\n }) => {\n return (\n <Tooltip title={chain.name} enterNextDelay={100}>\n <ChainCard\n component=\"button\"\n onClick={() => onSelect(chain.id)}\n type={!isAllNetworks && isSelected ? 'selected' : 'default'}\n selectionColor=\"secondary\"\n >\n <ChainAvatar src={chain.logoURI} alt={chain.key}>\n {chain.name[0]}\n </ChainAvatar>\n </ChainCard>\n </Tooltip>\n )\n }\n)\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAa,cAAyD,MACnE,EAAE,eAA2C;CAC5C,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,WAAW,eAAe,UAC9B,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,CACpD;CACD,MAAM,EAAE,kBAAkB,iBAAiB;CAC3C,MAAM,EACJ,YACA,QACA,WACA,mBACA,eACA,oBACE,eAAe,SAAS;CAE5B,MAAM,CAAC,iBAAiB,eAAe,oBACrC,oBAAoB,UAAU;EAC5B,MAAM,GAAG,SAAS;EAClB,MAAM,GAAG,SAAS;EAClB,MAAM;EACP,CAAC;CAEJ,MAAM,CAAC,WAAW,eAAe,cAAc,YAAY,SAAS,CAAC;~~AAErE~~,~~iBAAgB~~;~~AACd~~,~~MAAI~~;OAGE,CAF0B,WAAW,SAAS,QAExB,~~CACxB~~,~~eAAc~~,SAAS,SAAS;;IAGnC;EAAC;EAAS;EAAY;EAAU;EAAc,CAAC;CAElD,MAAM,gBAAgB,aACnB,oBAA4B;~~AAC3B~~,~~mBAAiB~~,OAAO,SAAS;~~AACjC~~,~~kBAAgB~~,gBAAgB;IAElC;EAAC;EAAkB;EAAiB;EAAS,CAC9C;CAED,MAAM,gBAAgB,kBAAkB;~~AACtC~~,~~WAAS~~,EAAE,IAAI,iBAAiB,GAAG,SAAS,SAAS,CAAC;IACrD,CAAC,UAAU,SAAS,CAAC;CAExB,MAAM,oBAAoB,kBAAkB;~~AAC1C~~,~~mBAAiB~~,MAAM,SAAS;~~AAEhC~~,~~gBAAc~~,cAAc,YAAY,SAAS,EAAE,IAAI,EACrD,WAAW,MACZ,CAAC;~~AACF~~,~~gBAAc~~,cAAc,YAAY,SAAS,EAAE,IAAI,EACrD,WAAW,MACZ,CAAC;IACD;EAAC;EAAkB;EAAU;EAAc,CAAC;CAE/C,MAAM,eACJ,QAAQ,WAAA,IACJ,KACC,QAAQ,UAAU,KAAA;CAEzB,MAAM,eAAe,eACZ,eAAe,IAAI,mBAAmB,GAAG,WAAW,EAAE,EAC7D;EAAC;EAAc;EAAmB;EAAO,CAC1C;CAED,MAAM,aACJ,aAAa,UACZ,kBAAkB,IAAI,MACtB,eAAe,IAAI,IAAI;~~AAE1B~~,~~KAAI~~,~~UACF~~,~~QACE~~,oBAAC,gBAAD;EAAgB,WAAW;YACxB,MAAM,KAAK,EAAE,QAAA,IAA4B,CAAC,CAAC,KAAK,GAAG,UAClD,oBAAC,UAAD;GAEE,SAAQ;GACR,OAAO;GACP,QAAQ,WAAW,KAAK;GACxB,IAAI,EAAE,cAAc,GAAG;GACvB,EALK,MAKL,CACF;EACa,CAAA;~~AAIrB~~,~~QACE~~,qBAAC,gBAAD;EAAgB,WAAW;YAA3B;GACG,mBACC,oBAAC,SAAD;IAAS,OAAO,EAAE,mBAAmB;IAAE,gBAAgB;cACrD,oBAAC,WAAD;KACE,WAAU;KACV,SAAS;KACT,MAAM,gBAAgB,aAAa;KACnC,gBAAe;eAEf,oBAAC,iBAAD;MACE,QAAQ,UAAU,EAAE;MACpB,MAAM,WAAW,UAAU;MAC3B,CAAA;KACQ,CAAA;IACJ,CAAA;GAEX,aAAa,KAAK,UACjB,oBAAC,WAAD;IAES;IACP,YAAY,YAAY,MAAM;IACf;IACf,UAAU;IACV,EALK,MAAM,GAKX,CACF;GACD,eAAe,KACd,oBAAC,WAAD;IAAW,WAAU;IAAS,SAAS;cACrC,oBAAC,eAAD,EAAA,UACE,qBAAC,gBAAD,EAAA,UAAA,CAAgB,KAAE,aAA8B,EAAA,CAAA,EAClC,CAAA;IACN,CAAA;GAEC;;EAGtB;AAED,MAAM,YAAY,MACf,EACC,OACA,YACA,eACA,eAMI;~~AACJ~~,~~QACE~~,oBAAC,SAAD;EAAS,OAAO,MAAM;EAAM,gBAAgB;YAC1C,oBAAC,WAAD;GACE,WAAU;GACV,eAAe,SAAS,MAAM,GAAG;GACjC,MAAM,CAAC,iBAAiB,aAAa,aAAa;GAClD,gBAAe;aAEf,oBAAC,aAAD;IAAa,KAAK,MAAM;IAAS,KAAK,MAAM;cACzC,MAAM,KAAK;IACA,CAAA;GACJ,CAAA;EACJ,CAAA;EAGf"}
1	+ {"version":3,"file":"ChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/ChainSelect.tsx"],"sourcesContent":["import type { EVMChain } from '@lifi/sdk'\nimport { Skeleton, type Theme, Tooltip, useMediaQuery } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { type JSX, memo, useCallback, useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainOrderStore } from '../../stores/chains/ChainOrderStore.js'\nimport {\n maxChainsToOrder,\n maxChainsToShow,\n maxGridItemsToShow,\n} from '../../stores/chains/createChainOrderStore.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { AllChainsAvatar } from '../Chains/AllChainsAvatar.js'\nimport {\n ChainAvatar,\n ChainCard,\n ChainContainer,\n MoreChainsBox,\n MoreChainsText,\n} from './ChainSelect.style.js'\nimport { useChainSelect } from './useChainSelect.js'\n\nexport const ChainSelect: React.NamedExoticComponent<FormTypeProps> = memo(\n ({ formType }: FormTypeProps): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const isMobile = useMediaQuery((theme: Theme) =>\n theme.breakpoints.down(theme.breakpoints.values.xs)\n )\n const { setFieldValue } = useFieldActions()\n const {\n chainOrder,\n chains,\n isLoading,\n getSelectedChains,\n setChainOrder,\n setCurrentChain,\n } = useChainSelect(formType)\n\n const [showAllNetworks, isAllNetworks, setIsAllNetworks] =\n useChainOrderStore((state) => [\n state[`${formType}ShowAllNetworks`],\n state[`${formType}IsAllNetworks`],\n state.setIsAllNetworks,\n ])\n\n const [chainId] = useFieldValues(FormKeyHelper.getChainKey(formType))\n\n useEffect(() => {\n if (chainId) {\n const hasChainInOrderedList = chainOrder.includes(chainId)\n // If we don't have a chain in the ordered chain list we should add it.\n if (!hasChainInOrderedList) {\n setChainOrder(chainId, formType)\n }\n }\n }, [chainId, chainOrder, formType, setChainOrder])\n\n const onChainSelect = useCallback(\n (selectedChainId: number) => {\n setIsAllNetworks(false, formType)\n setCurrentChain(selectedChainId)\n },\n [setIsAllNetworks, setCurrentChain, formType]\n )\n\n const showAllChains = useCallback(() => {\n navigate({ to: navigationRoutes[`${formType}Chain`] })\n }, [navigate, formType])\n\n const selectAllNetworks = useCallback(() => {\n setIsAllNetworks(true, formType)\n // Reset the chain and token fields when selecting all networks\n setFieldValue(FormKeyHelper.getChainKey(formType), '', {\n isTouched: true,\n })\n setFieldValue(FormKeyHelper.getTokenKey(formType), '', {\n isTouched: true,\n })\n }, [setIsAllNetworks, formType, setFieldValue])\n\n const chainsToHide =\n chains?.length === maxChainsToShow\n ? 0\n : (chains?.length ?? 0) - maxChainsToOrder\n\n const chainsToShow = useMemo(\n () => (chainsToHide > 0 ? getSelectedChains() : chains) ?? [],\n [chainsToHide, getSelectedChains, chains]\n )\n\n const tilesCount =\n chainsToShow.length +\n (showAllNetworks ? 1 : 0) +\n (chainsToHide > 0 ? 1 : 0)\n\n if (isLoading) {\n return (\n <ChainContainer itemCount={tilesCount}>\n {Array.from({ length: maxGridItemsToShow }).map((_, index) => (\n <Skeleton\n key={index}\n variant=\"rectangular\"\n width={56}\n height={isMobile ? 36 : 56}\n sx={{ borderRadius: 1 }}\n />\n ))}\n </ChainContainer>\n )\n }\n\n return (\n <ChainContainer itemCount={tilesCount}>\n {showAllNetworks && (\n <Tooltip title={t('main.allNetworks')} enterNextDelay={100}>\n <ChainCard\n component=\"button\"\n onClick={selectAllNetworks}\n type={isAllNetworks ? 'selected' : 'default'}\n selectionColor=\"secondary\"\n >\n <AllChainsAvatar\n chains={chains ?? []}\n size={isMobile ? 'small' : 'medium'}\n />\n </ChainCard>\n </Tooltip>\n )}\n {chainsToShow.map((chain: EVMChain) => (\n <ChainItem\n key={chain.id}\n chain={chain}\n isSelected={chainId === chain.id}\n isAllNetworks={isAllNetworks}\n onSelect={onChainSelect}\n />\n ))}\n {chainsToHide > 0 && (\n <ChainCard component=\"button\" onClick={showAllChains}>\n <MoreChainsBox>\n <MoreChainsText>+{chainsToHide}</MoreChainsText>\n </MoreChainsBox>\n </ChainCard>\n )}\n </ChainContainer>\n )\n }\n)\n\nconst ChainItem = memo(\n ({\n chain,\n isSelected,\n isAllNetworks,\n onSelect,\n }: {\n chain: EVMChain\n isSelected: boolean\n isAllNetworks: boolean\n onSelect: (id: number) => void\n }) => {\n return (\n <Tooltip title={chain.name} enterNextDelay={100}>\n <ChainCard\n component=\"button\"\n onClick={() => onSelect(chain.id)}\n type={!isAllNetworks && isSelected ? 'selected' : 'default'}\n selectionColor=\"secondary\"\n >\n <ChainAvatar src={chain.logoURI} alt={chain.key}>\n {chain.name[0]}\n </ChainAvatar>\n </ChainCard>\n </Tooltip>\n )\n }\n)\n"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ChainSelect.style.js","names":["styled","Card"],"sources":["../../../../src/components/ChainSelect/ChainSelect.style.tsx"],"sourcesContent":["import { Avatar, Box, Typography } from '@mui/material'\nimport { styled } from '@mui/material/styles'\nimport type React from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { maxChainsToShow } from '../../stores/chains/createChainOrderStore.js'\n\nconst chainCardWidthPx = 52\nconst chainCardHeightPx = 56\n// For mobile screens (xs, under 360px)\nconst chainCardWidthPxMobile = 36\nconst chainCardHeightPxMobile = 36\n\n// Chain grid layout settings:\n// These should remain consistent with `maxChainsToShow` to ensure\n// proper row/column distribution in the grid layout logic.\nconst maxRows = 2\nconst maxChainsPerRow = Math.ceil(maxChainsToShow / maxRows)\n\nexport const ChainCard: React.FC<\n React.ComponentProps<typeof Card> & { itemCount?: number }\n> = styled(Card)(({ theme }) => ({\n display: 'grid',\n placeItems: 'center',\n minWidth: chainCardWidthPx,\n height: chainCardHeightPx,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n height: chainCardHeightPxMobile,\n minWidth: chainCardWidthPxMobile,\n },\n}))\n\nexport const ChainAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & { itemCount?: number }\n> = styled(Avatar)(({ theme }) => ({\n width: 40,\n height: 40,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n width: 28,\n height: 28,\n },\n}))\n\nexport const MoreChainsBox: React.FC<\n React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box)(({ theme }) => ({\n width: 40,\n height: 40,\n display: 'grid',\n placeItems: 'center',\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n width: 28,\n height: 28,\n },\n}))\n\nexport const MoreChainsText: React.FC<\n React.ComponentProps<typeof Typography> & { itemCount?: number }\n> = styled(Typography)(({ theme }) => ({\n fontWeight: 500,\n [theme.breakpoints.down('xs')]: {\n fontSize: '.85rem',\n },\n}))\n\nexport const ChainContainer: React.FC<\n React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'itemCount',\n})<{ itemCount?: number }>(({ theme, itemCount = 0 }) => {\n const rowCount = Math.min(Math.ceil(itemCount / maxChainsPerRow), maxRows)\n const columnsPerRow = Math.ceil(itemCount / rowCount)\n return {\n display: 'grid',\n gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPx}px, 1fr))`,\n gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPx}px)`,\n justifyContent: 'space-between',\n gap: theme.spacing(1.5),\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPxMobile}px, 1fr))`,\n gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPxMobile}px)`,\n gap: theme.spacing(1),\n },\n }\n})\n"],"mappings":";;;;AAMA,MAAM,mBAAmB;AACzB,MAAM,oBAAoB;AAE1B,MAAM,yBAAyB;AAC/B,MAAM,0BAA0B;AAKhC,MAAM,UAAU;AAChB,MAAM,kBAAkB,KAAK,KAAA,IAAuB,QAAQ;AAE5D,MAAa,YAETA,SAAOC,OAAK,EAAE,EAAE,aAAa;CAC/B,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,QAAQ;EACR,UAAU;EACX;CACF,EAAE;AAEH,MAAa,cAETD,SAAO,OAAO,EAAE,EAAE,aAAa;CACjC,OAAO;CACP,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,OAAO;EACP,QAAQ;EACT;CACF,EAAE;AAEH,MAAa,gBAETA,SAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,OAAO;CACP,QAAQ;CACR,SAAS;CACT,YAAY;EACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,OAAO;EACP,QAAQ;EACT;CACF,EAAE;AAEH,MAAa,iBAETA,SAAO,WAAW,EAAE,EAAE,aAAa;CACrC,YAAY;EACX,MAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,UAAU,UACX;CACF,EAAE;AAEH,MAAa,iBAETA,SAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,QAAQ;CACvD,MAAM,WAAW,KAAK,IAAI,KAAK,KAAK,YAAY,gBAAgB,EAAE,QAAQ;CAC1E,MAAM,gBAAgB,KAAK,KAAK,YAAY,SAAS;~~AACrD~~,~~QAAO~~;EACL,SAAS;EACT,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,iBAAiB;EACrG,kBAAkB,UAAU,SAAS,IAAI,kBAAkB;EAC3D,gBAAgB;EAChB,KAAK,MAAM,QAAQ,IAAI;GACtB,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;GACrD,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,uBAAuB;GAC3G,kBAAkB,UAAU,SAAS,IAAI,wBAAwB;GACjE,KAAK,MAAM,QAAQ,EAAE;GACtB;EACF;EACD"}
1	+ {"version":3,"file":"ChainSelect.style.js","names":["styled","Card"],"sources":["../../../../src/components/ChainSelect/ChainSelect.style.tsx"],"sourcesContent":["import { Avatar, Box, Typography } from '@mui/material'\nimport { styled } from '@mui/material/styles'\nimport type React from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { maxChainsToShow } from '../../stores/chains/createChainOrderStore.js'\n\nconst chainCardWidthPx = 52\nconst chainCardHeightPx = 56\n// For mobile screens (xs, under 360px)\nconst chainCardWidthPxMobile = 36\nconst chainCardHeightPxMobile = 36\n\n// Chain grid layout settings:\n// These should remain consistent with `maxChainsToShow` to ensure\n// proper row/column distribution in the grid layout logic.\nconst maxRows = 2\nconst maxChainsPerRow = Math.ceil(maxChainsToShow / maxRows)\n\nexport const ChainCard: React.FC<\n React.ComponentProps<typeof Card> & { itemCount?: number }\n> = styled(Card)(({ theme }) => ({\n display: 'grid',\n placeItems: 'center',\n minWidth: chainCardWidthPx,\n height: chainCardHeightPx,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n height: chainCardHeightPxMobile,\n minWidth: chainCardWidthPxMobile,\n },\n}))\n\nexport const ChainAvatar: React.FC<\n React.ComponentProps<typeof Avatar> & { itemCount?: number }\n> = styled(Avatar)(({ theme }) => ({\n width: 40,\n height: 40,\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n width: 28,\n height: 28,\n },\n}))\n\nexport const MoreChainsBox: React.FC<\n React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box)(({ theme }) => ({\n width: 40,\n height: 40,\n display: 'grid',\n placeItems: 'center',\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n width: 28,\n height: 28,\n },\n}))\n\nexport const MoreChainsText: React.FC<\n React.ComponentProps<typeof Typography> & { itemCount?: number }\n> = styled(Typography)(({ theme }) => ({\n fontWeight: 500,\n [theme.breakpoints.down('xs')]: {\n fontSize: '.85rem',\n },\n}))\n\nexport const ChainContainer: React.FC<\n React.ComponentProps<typeof Box> & { itemCount?: number }\n> = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'itemCount',\n})<{ itemCount?: number }>(({ theme, itemCount = 0 }) => {\n const rowCount = Math.min(Math.ceil(itemCount / maxChainsPerRow), maxRows)\n const columnsPerRow = Math.ceil(itemCount / rowCount)\n return {\n display: 'grid',\n gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPx}px, 1fr))`,\n gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPx}px)`,\n justifyContent: 'space-between',\n gap: theme.spacing(1.5),\n [theme.breakpoints.down(theme.breakpoints.values.xs)]: {\n gridTemplateColumns: `repeat(${rowCount > 1 ? columnsPerRow : 'auto-fit'}, minmax(${chainCardWidthPxMobile}px, 1fr))`,\n gridTemplateRows: `repeat(${rowCount}, ${chainCardHeightPxMobile}px)`,\n gap: theme.spacing(1),\n },\n }\n})\n"],"mappings":";;;;AAMA,MAAM,mBAAmB;AACzB,MAAM,oBAAoB;AAE1B,MAAM,yBAAyB;AAC/B,MAAM,0BAA0B;AAKhC,MAAM,UAAU;AAChB,MAAM,kBAAkB,KAAK,KAAA,IAAuB,QAAQ;AAE5D,MAAa,YAETA,SAAOC,OAAK,EAAE,EAAE,aAAa;CAC/B,SAAS;CACT,YAAY;CACZ,UAAU;CACV,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,QAAQ;EACR,UAAU;EACX;CACF,EAAE;AAEH,MAAa,cAETD,SAAO,OAAO,EAAE,EAAE,aAAa;CACjC,OAAO;CACP,QAAQ;EACP,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,OAAO;EACP,QAAQ;EACT;CACF,EAAE;AAEH,MAAa,gBAETA,SAAO,IAAI,EAAE,EAAE,aAAa;CAC9B,OAAO;CACP,QAAQ;CACR,SAAS;CACT,YAAY;EACX,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;EACrD,OAAO;EACP,QAAQ;EACT;CACF,EAAE;AAEH,MAAa,iBAETA,SAAO,WAAW,EAAE,EAAE,aAAa;CACrC,YAAY;EACX,MAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,UAAU,UACX;CACF,EAAE;AAEH,MAAa,iBAETA,SAAO,KAAK,EACd,oBAAoB,SAAS,SAAS,aACvC,CAAC,EAA0B,EAAE,OAAO,YAAY,QAAQ;CACvD,MAAM,WAAW,KAAK,IAAI,KAAK,KAAK,YAAY,gBAAgB,EAAE,QAAQ;CAC1E,MAAM,gBAAgB,KAAK,KAAK,YAAY,SAAS;CACrD,OAAO;EACL,SAAS;EACT,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,iBAAiB;EACrG,kBAAkB,UAAU,SAAS,IAAI,kBAAkB;EAC3D,gBAAgB;EAChB,KAAK,MAAM,QAAQ,IAAI;GACtB,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,GAAG;GACrD,qBAAqB,UAAU,WAAW,IAAI,gBAAgB,WAAW,WAAW,uBAAuB;GAC3G,kBAAkB,UAAU,SAAS,IAAI,wBAAwB;GACjE,KAAK,MAAM,QAAQ,EAAE;GACtB;EACF;EACD"}

package/dist/esm/components/ChainSelect/useChainSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/useChainSelect.ts"],"sourcesContent":["import type { EVMChain, ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useChains } from '../../hooks/useChains.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrder } from '../../stores/chains/useChainOrder.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { DisabledUI } from '../../types/widget.js'\n\nexport const useChainSelect = (\n formType: FormType\n): {\n chainOrder: number[]\n chains: ExtendedChain[] \| undefined\n getSelectedChains: () => EVMChain[]\n isLoading: boolean\n setChainOrder: (chainId: number, type: FormType) => void\n setCurrentChain: (chainId: number) => void\n} => {\n const { disabledUI } = useWidgetConfig()\n const chainKey = FormKeyHelper.getChainKey(formType)\n const { setFieldValue, getFieldValues } = useFieldActions()\n const { useExternalWalletProvidersOnly, externalChainTypes } =\n useExternalWalletProvider()\n const { chains, isLoading, getChainById } = useChains(\n formType,\n // If the integrator uses external wallet management and has not opted in for partial wallet management,\n // restrict the displayed chains to those compatible with external wallet management.\n // This ensures users only see chains for which they can sign transactions.\n formType === 'from' && useExternalWalletProvidersOnly\n ? externalChainTypes\n : undefined\n )\n\n const [chainOrder, setChainOrder] = useChainOrder(formType)\n const swapOnly = useSwapOnly()\n const { tryResetToAddress } = useToAddressReset()\n\n const getSelectedChains = useCallback((): EVMChain[] => {\n if (!chains) {\n return []\n }\n const selectedChains = chainOrder\n .map((chainId) => chains.find((chain) => chain.id === chainId))\n .filter(Boolean) as EVMChain[]\n return selectedChains\n }, [chains, chainOrder])\n\n const setCurrentChain = useCallback(\n (chainId: number): void => {\n setFieldValue(chainKey, chainId, { isDirty: true, isTouched: true })\n if (swapOnly) {\n setFieldValue(FormKeyHelper.getChainKey('to'), chainId, {\n isTouched: true,\n })\n }\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n if (!disabledUI?.includes(tokenKey as DisabledUI)) {\n setFieldValue(tokenKey, '')\n }\n const amountKey = FormKeyHelper.getAmountKey(formType)\n if (!disabledUI?.includes(amountKey as DisabledUI)) {\n setFieldValue(amountKey, '')\n }\n\n const [toChainId] = getFieldValues('toChain')\n const toChain = getChainById(toChainId)\n if (toChain) {\n tryResetToAddress(toChain)\n }\n setChainOrder(chainId, formType)\n },\n [\n chainKey,\n swapOnly,\n setFieldValue,\n disabledUI,\n formType,\n getChainById,\n tryResetToAddress,\n setChainOrder,\n getFieldValues,\n ]\n )\n\n return {\n chainOrder: chainOrder,\n chains: chains,\n getSelectedChains: getSelectedChains,\n isLoading: isLoading,\n setChainOrder: setChainOrder,\n setCurrentChain: setCurrentChain,\n }\n}\n"],"mappings":";;;;;;;;;;AAaA,MAAa,kBACX,aAQG;CACH,MAAM,EAAE,eAAe,iBAAiB;CACxC,MAAM,WAAW,cAAc,YAAY,SAAS;CACpD,MAAM,EAAE,eAAe,mBAAmB,iBAAiB;CAC3D,MAAM,EAAE,gCAAgC,uBACtC,2BAA2B;CAC7B,MAAM,EAAE,QAAQ,WAAW,iBAAiB,UAC1C,UAIA,aAAa,UAAU,iCACnB,qBACA,KAAA,EACL;CAED,MAAM,CAAC,YAAY,iBAAiB,cAAc,SAAS;CAC3D,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,sBAAsB,mBAAmB;~~AAiDjD~~,~~QAAO~~;EACO;EACJ;EACR,mBAlDwB,kBAA8B;~~AACtD~~,~~OAAI~~,CAAC,~~OACH~~,~~QAAO~~,EAAE;~~AAKX~~,~~UAHuB~~,WACpB,KAAK,YAAY,OAAO,MAAM,UAAU,MAAM,OAAO,QAAQ,CAAC,CAC9D,OAAO,QACW;KACpB,CAAC,QAAQ,WAAW,CA0Ce;EACzB;EACI;EACf,iBA3CsB,aACrB,YAA0B;~~AACzB~~,~~iBAAc~~,UAAU,SAAS;IAAE,SAAS;IAAM,WAAW;IAAM,CAAC;~~AACpE~~,~~OAAI~~,~~SACF~~,~~eAAc~~,cAAc,YAAY,KAAK,EAAE,SAAS,EACtD,WAAW,MACZ,CAAC;GAEJ,MAAM,WAAW,cAAc,YAAY,SAAS;~~AACpD~~,~~OAAI~~,CAAC,YAAY,SAAS,SAAuB,~~CAC~~/C,~~eAAc~~,UAAU,GAAG;GAE7B,MAAM,YAAY,cAAc,aAAa,SAAS;~~AACtD~~,~~OAAI~~,CAAC,YAAY,SAAS,UAAwB,~~CAChD~~,~~eAAc~~,WAAW,GAAG;GAG9B,MAAM,CAAC,aAAa,eAAe,UAAU;GAC7C,MAAM,UAAU,aAAa,UAAU;~~AACvC~~,~~OAAI~~,~~QACF~~,~~mBAAkB~~,QAAQ;~~AAE5B~~,~~iBAAc~~,SAAS,SAAS;KAElC;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAS+B;EACjC"}
1	+ {"version":3,"file":"useChainSelect.js","names":[],"sources":["../../../../src/components/ChainSelect/useChainSelect.ts"],"sourcesContent":["import type { EVMChain, ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useChains } from '../../hooks/useChains.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useExternalWalletProvider } from '../../providers/WalletProvider/useExternalWalletProvider.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useChainOrder } from '../../stores/chains/useChainOrder.js'\nimport type { FormType } from '../../stores/form/types.js'\nimport { FormKeyHelper } from '../../stores/form/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { DisabledUI } from '../../types/widget.js'\n\nexport const useChainSelect = (\n formType: FormType\n): {\n chainOrder: number[]\n chains: ExtendedChain[] \| undefined\n getSelectedChains: () => EVMChain[]\n isLoading: boolean\n setChainOrder: (chainId: number, type: FormType) => void\n setCurrentChain: (chainId: number) => void\n} => {\n const { disabledUI } = useWidgetConfig()\n const chainKey = FormKeyHelper.getChainKey(formType)\n const { setFieldValue, getFieldValues } = useFieldActions()\n const { useExternalWalletProvidersOnly, externalChainTypes } =\n useExternalWalletProvider()\n const { chains, isLoading, getChainById } = useChains(\n formType,\n // If the integrator uses external wallet management and has not opted in for partial wallet management,\n // restrict the displayed chains to those compatible with external wallet management.\n // This ensures users only see chains for which they can sign transactions.\n formType === 'from' && useExternalWalletProvidersOnly\n ? externalChainTypes\n : undefined\n )\n\n const [chainOrder, setChainOrder] = useChainOrder(formType)\n const swapOnly = useSwapOnly()\n const { tryResetToAddress } = useToAddressReset()\n\n const getSelectedChains = useCallback((): EVMChain[] => {\n if (!chains) {\n return []\n }\n const selectedChains = chainOrder\n .map((chainId) => chains.find((chain) => chain.id === chainId))\n .filter(Boolean) as EVMChain[]\n return selectedChains\n }, [chains, chainOrder])\n\n const setCurrentChain = useCallback(\n (chainId: number): void => {\n setFieldValue(chainKey, chainId, { isDirty: true, isTouched: true })\n if (swapOnly) {\n setFieldValue(FormKeyHelper.getChainKey('to'), chainId, {\n isTouched: true,\n })\n }\n const tokenKey = FormKeyHelper.getTokenKey(formType)\n if (!disabledUI?.includes(tokenKey as DisabledUI)) {\n setFieldValue(tokenKey, '')\n }\n const amountKey = FormKeyHelper.getAmountKey(formType)\n if (!disabledUI?.includes(amountKey as DisabledUI)) {\n setFieldValue(amountKey, '')\n }\n\n const [toChainId] = getFieldValues('toChain')\n const toChain = getChainById(toChainId)\n if (toChain) {\n tryResetToAddress(toChain)\n }\n setChainOrder(chainId, formType)\n },\n [\n chainKey,\n swapOnly,\n setFieldValue,\n disabledUI,\n formType,\n getChainById,\n tryResetToAddress,\n setChainOrder,\n getFieldValues,\n ]\n )\n\n return {\n chainOrder: chainOrder,\n chains: chains,\n getSelectedChains: getSelectedChains,\n isLoading: isLoading,\n setChainOrder: setChainOrder,\n setCurrentChain: setCurrentChain,\n }\n}\n"],"mappings":";;;;;;;;;;AAaA,MAAa,kBACX,aAQG;CACH,MAAM,EAAE,eAAe,iBAAiB;CACxC,MAAM,WAAW,cAAc,YAAY,SAAS;CACpD,MAAM,EAAE,eAAe,mBAAmB,iBAAiB;CAC3D,MAAM,EAAE,gCAAgC,uBACtC,2BAA2B;CAC7B,MAAM,EAAE,QAAQ,WAAW,iBAAiB,UAC1C,UAIA,aAAa,UAAU,iCACnB,qBACA,KAAA,EACL;CAED,MAAM,CAAC,YAAY,iBAAiB,cAAc,SAAS;CAC3D,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,sBAAsB,mBAAmB;CAiDjD,OAAO;EACO;EACJ;EACR,mBAlDwB,kBAA8B;GACtD,IAAI,CAAC,QACH,OAAO,EAAE;GAKX,OAHuB,WACpB,KAAK,YAAY,OAAO,MAAM,UAAU,MAAM,OAAO,QAAQ,CAAC,CAC9D,OAAO,QACW;KACpB,CAAC,QAAQ,WAAW,CA0Ce;EACzB;EACI;EACf,iBA3CsB,aACrB,YAA0B;GACzB,cAAc,UAAU,SAAS;IAAE,SAAS;IAAM,WAAW;IAAM,CAAC;GACpE,IAAI,UACF,cAAc,cAAc,YAAY,KAAK,EAAE,SAAS,EACtD,WAAW,MACZ,CAAC;GAEJ,MAAM,WAAW,cAAc,YAAY,SAAS;GACpD,IAAI,CAAC,YAAY,SAAS,SAAuB,EAC/C,cAAc,UAAU,GAAG;GAE7B,MAAM,YAAY,cAAc,aAAa,SAAS;GACtD,IAAI,CAAC,YAAY,SAAS,UAAwB,EAChD,cAAc,WAAW,GAAG;GAG9B,MAAM,CAAC,aAAa,eAAe,UAAU;GAC7C,MAAM,UAAU,aAAa,UAAU;GACvC,IAAI,SACF,kBAAkB,QAAQ;GAE5B,cAAc,SAAS,SAAS;KAElC;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAS+B;EACjC"}