@lifi/widget 4.0.0 → 4.2.0

package/dist/esm/i18n/en.json

@@ -43,6 +43,7 @@
     "options": "Options",
     "reset": "Reset",
     "resetSettings": "Reset settings",
+    "review": "Review",
     "seeDetails": "See details",
     "showAll": "Show all",
     "startBridging": "Start bridging",
@@ -58,6 +59,7 @@
     "amount": "Amount",
     "bookmarkedWallets": "Bookmarked wallets",
     "bridge": "Bridge",
+    "buy": "Buy",
     "checkout": "Checkout",
     "checkoutDetails": "Checkout details",
     "deposit": "Deposit",
@@ -66,17 +68,21 @@
     "exchange": "Exchange",
     "from": "Exchange from",
     "gas": "Gas",
+    "limit": "Limit",
     "payWith": "Pay with",
+    "private": "Private",
     "receive": "Receive",
     "received": "Received",
     "recentWallets": "Recent wallets",
     "refunded": "Refunded",
     "selectChain": "Select chain",
     "selectWallet": "Select your wallet",
+    "sell": "Sell",
     "send": "Send",
     "sendToWallet": "Send to wallet",
     "settings": "Settings",
     "swap": "Swap",
+    "swapAndBridge": "Swap & Bridge",
     "to": "Exchange to",
     "transactionDetails": "Transaction details",
     "activities": "Activities",
@@ -84,6 +90,14 @@
     "youGet": "You get",
     "youPay": "You pay"
   },
+  "limitOrder": {
+    "custom": "Custom",
+    "expiresIn": "Expires in",
+    "market": "Market",
+    "partiallyFillable": "Allow partial fills",
+    "price": "Limit price",
+    "priceLabel": "When 1 {{symbol}} is worth"
+  },
   "info": {
     "message": {
       "accountDeployedMessage": "Your smart account may not have the same address on other chains. Please double-check before proceeding.",
@@ -330,7 +344,18 @@
       "title": "Gas price"
     },
     "routePriority": "Route priority",
+    "routePriorityOptions": {
+      "cheapest": {
+        "title": "Best Return",
+        "description": "Lowest network cost"
+      },
+      "fastest": {
+        "title": "Fastest",
+        "description": "Shortest execution time"
+      }
+    },
     "slippage": "Max. slippage",
+    "slippageAutoDescription": "Optimised per route",
     "custom": "Custom",
     "resetSettings": "You're using custom settings that can affect the number or sorting of available routes.",
     "hideSmallBalances": "Hide small balances"

package/dist/esm/index.d.ts

@@ -1,5 +1,5 @@
 import { DefaultFieldValues, DefaultValues, ExtractValueType, FormActions, FormFieldArray, FormFieldNames, FormKeyHelper, FormProps, FormStoreStore, FormType, FormTypeProps, FormValueControl, FormValues, FormValuesState, GenericFormValue, ResetOptions, SetOptions, TouchedFields, ValidationActions, ValidationProps } from "./stores/form/types.js";
-import { AllowDeny, AllowDenyItems, AllowDenySet, AllowDenySetItem, AllowDenySets, Appearance, CalculateFeeParams, CustomMode, DefaultUI, DisabledUIConfig, ExpansionType, ExplorerUrl, FieldNames, FieldValues, FormFieldOptions, FormRef, FormRefProps, FormState, HiddenUIConfig, ModeOptions, NavigationProps, PoweredByType, RequiredUIConfig, RouteLabel, RouteLabelRule, SetFieldValueFunction, SplitMode, SplitModeOptions, ToAddress, WidgetChains, WidgetConfig, WidgetConfigPartialProps, WidgetConfigProps, WidgetContractTool, WidgetDrawerProps, WidgetFeeConfig, WidgetLanguages, WidgetMode, WidgetProps, WidgetProvider, WidgetSDKConfig, WidgetTheme, WidgetThemeComponents, WidgetTokens, WidgetVariant, WidgetWalletConfig } from "./types/widget.js";
+import { AllowDeny, AllowDenyItems, AllowDenySet, AllowDenySetItem, AllowDenySets, Appearance, CalculateFeeParams, CustomMode, DefaultUI, DisabledUIConfig, ExpansionType, ExplorerUrl, FieldNames, FieldValues, FormFieldOptions, FormRef, FormRefProps, FormState, HiddenUIConfig, InternalNavigationTabKey, InternalWidgetMode, ModeOptions, NavigationProps, NavigationTabKey, PoweredByType, RequiredUIConfig, RouteLabel, RouteLabelRule, SetFieldValueFunction, SplitMode, SplitModeOptions, SplitNavigationTabKey, ToAddress, WidgetChains, WidgetConfig, WidgetConfigPartialProps, WidgetConfigProps, WidgetContractTool, WidgetDrawerProps, WidgetFeeConfig, WidgetLanguages, WidgetMode, WidgetProps, WidgetProvider, WidgetSDKConfig, WidgetTheme, WidgetThemeComponents, WidgetTokens, WidgetVariant, WidgetWalletConfig } from "./types/widget.js";
 import { WidgetDrawer } from "./AppDrawer.js";
 import { App } from "./App.js";
 import { TokenAmount } from "./types/token.js";
@@ -12,7 +12,7 @@ import { defaultMaxHeight } from "./config/constants.js";
 import { name, version } from "./config/version.js";
 import { useWidgetChains } from "./hooks/useWidgetChains.js";
 import { navigationRoutes } from "./utils/navigationRoutes.js";
-import { ChainPinned, ChainTokenSelected, ContactSupport, FormFieldChanged, LowAddressActivityConfirmed, RouteExecutionUpdate, RouteHighValueLossUpdate, RouteSelected, SettingUpdated, TokenSearch, WidgetEvent, WidgetEvents } from "./types/events.js";
+import { ChainPinned, ChainTokenSelected, ContactSupport, FormFieldChanged, LowAddressActivityConfirmed, NavigationTabChanged, RouteExecutionUpdate, RouteHighValueLossUpdate, RouteSelected, SettingUpdated, TokenSearch, WidgetEvent, WidgetEvents } from "./types/events.js";
 import { WidgetEventEmitter, useWidgetEvents, widgetEvents } from "./hooks/useWidgetEvents.js";
 import { Bookmark, BookmarkActions, BookmarkProps, BookmarkState, BookmarkStore } from "./stores/bookmarks/types.js";
 import { useFieldActions } from "./stores/form/useFieldActions.js";
@@ -30,4 +30,4 @@ import { getPriceImpact } from "./utils/getPriceImpact.js";
 import { percentFormatter } from "./utils/percentFormatter.js";
 import { ChainId, ChainType, CoinKey } from "@lifi/sdk";
 export type * from "@lifi/sdk";
-export { AllowDeny, AllowDenyItems, AllowDenySet, AllowDenySetItem, AllowDenySets, Appearance, Bookmark, BookmarkActions, BookmarkProps, BookmarkState, BookmarkStore, CalculateFeeParams, ChainId, ChainPinned, ChainTokenSelected, ChainType, CoinKey, ContactSupport, CustomMode, DefaultFieldValues, DefaultUI, DefaultValues, DisabledUIConfig, ExpansionType, ExplorerUrl, ExtractValueType, FieldNames, FieldValues, FormActions, FormFieldArray, FormFieldChanged, FormFieldNames, FormFieldOptions, FormKeyHelper, FormProps, FormRef, FormRefProps, FormState, FormStoreStore, FormType, FormTypeProps, FormValueControl, FormValues, FormValuesState, GenericFormValue, HiddenUIConfig, ItemPrice, ItemPriceProps, App as LiFiWidget, LowAddressActivityConfirmed, ModeOptions, NFT, NFTBase, NFTBaseProps, NFTOwner, NFTProps, NavigationProps, PoweredByType, RequiredUIConfig, ResetOptions, RouteExecutionUpdate, RouteHighValueLossUpdate, RouteLabel, RouteLabelRule, RouteSelected, SetFieldValueFunction, SetOptions, SettingUpdated, SplitMode, SplitModeOptions, ToAddress, type TokenAmount, TokenSearch, TouchedFields, ValidationActions, ValidationProps, WidgetChains, WidgetConfig, WidgetConfigPartialProps, WidgetConfigProps, WidgetContractTool, type WidgetDrawer, WidgetDrawerProps, WidgetEvent, type WidgetEventEmitter, WidgetEvents, WidgetFeeConfig, WidgetLanguages, WidgetMode, WidgetProps, WidgetProvider, WidgetSDKConfig, WidgetSkeleton, WidgetTheme, WidgetThemeComponents, WidgetTokens, WidgetVariant, WidgetWalletConfig, azureLightTheme, compactNumberFormatter, createTheme, currencyExtendedFormatter, defaultMaxHeight, formatDuration, formatInputAmount, formatSlippage, formatTokenAmount, formatTokenPrice, getPriceImpact, jumperTheme, name, navigationRoutes, palette, paletteDark, paletteLight, percentFormatter, priceToTokenAmount, usdDecimals, useFieldActions, useFieldValues, useWidgetChains, useWidgetEvents, version, watermelonLightTheme, widgetEvents, windows95Theme, wrapLongWords };
+export { AllowDeny, AllowDenyItems, AllowDenySet, AllowDenySetItem, AllowDenySets, Appearance, Bookmark, BookmarkActions, BookmarkProps, BookmarkState, BookmarkStore, CalculateFeeParams, ChainId, ChainPinned, ChainTokenSelected, ChainType, CoinKey, ContactSupport, CustomMode, DefaultFieldValues, DefaultUI, DefaultValues, DisabledUIConfig, ExpansionType, ExplorerUrl, ExtractValueType, FieldNames, FieldValues, FormActions, FormFieldArray, FormFieldChanged, FormFieldNames, FormFieldOptions, FormKeyHelper, FormProps, FormRef, FormRefProps, FormState, FormStoreStore, FormType, FormTypeProps, FormValueControl, FormValues, FormValuesState, GenericFormValue, HiddenUIConfig, InternalNavigationTabKey, InternalWidgetMode, ItemPrice, ItemPriceProps, App as LiFiWidget, LowAddressActivityConfirmed, ModeOptions, NFT, NFTBase, NFTBaseProps, NFTOwner, NFTProps, NavigationProps, NavigationTabChanged, NavigationTabKey, PoweredByType, RequiredUIConfig, ResetOptions, RouteExecutionUpdate, RouteHighValueLossUpdate, RouteLabel, RouteLabelRule, RouteSelected, SetFieldValueFunction, SetOptions, SettingUpdated, SplitMode, SplitModeOptions, SplitNavigationTabKey, ToAddress, type TokenAmount, TokenSearch, TouchedFields, ValidationActions, ValidationProps, WidgetChains, WidgetConfig, WidgetConfigPartialProps, WidgetConfigProps, WidgetContractTool, type WidgetDrawer, WidgetDrawerProps, WidgetEvent, type WidgetEventEmitter, WidgetEvents, WidgetFeeConfig, WidgetLanguages, WidgetMode, WidgetProps, WidgetProvider, WidgetSDKConfig, WidgetSkeleton, WidgetTheme, WidgetThemeComponents, WidgetTokens, WidgetVariant, WidgetWalletConfig, azureLightTheme, compactNumberFormatter, createTheme, currencyExtendedFormatter, defaultMaxHeight, formatDuration, formatInputAmount, formatSlippage, formatTokenAmount, formatTokenPrice, getPriceImpact, jumperTheme, name, navigationRoutes, palette, paletteDark, paletteLight, percentFormatter, priceToTokenAmount, usdDecimals, useFieldActions, useFieldValues, useWidgetChains, useWidgetEvents, version, watermelonLightTheme, widgetEvents, windows95Theme, wrapLongWords };

package/dist/esm/pages/ActivitiesPage/ActivitiesPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivitiesPage.js","names":[],"sources":["../../../../src/pages/ActivitiesPage/ActivitiesPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { Box, List } from '@mui/material'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport { type JSX, useCallback, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCardSkeleton } from '../../components/TransactionCard/TransactionCardSkeleton.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useTransactionList } from '../../hooks/useTransactionList.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { ActiveTransactionItem } from './ActiveTransactionItem.js'\nimport { ActivitiesPageMenuButton } from './ActivitiesPageMenuButton.js'\nimport { TransactionHistoryEmpty } from './TransactionHistoryEmpty.js'\nimport { TransactionHistoryItem } from './TransactionHistoryItem.js'\n\nconst SKELETON_COUNT = 2\n\nexport const ActivitiesPage = (): JSX.Element => {\n  // Parent ref and useVirtualizer should be in one file to avoid blank page (0 virtual items) issue\n  const parentRef = useRef<HTMLDivElement | null>(null)\n  const { items, isLoading } = useTransactionList()\n\n  const { t } = useTranslation()\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.map((account) => account.address),\n    [accounts]\n  )\n  const hasFailedItems = useRouteExecutionStore(\n    useCallback(\n      (state) =>\n        Object.values(state.routes).some(\n          (r) =>\n            r?.status === RouteExecutionStatus.Failed &&\n            accountAddresses.includes(r.route.fromAddress)\n        ),\n      [accountAddresses]\n    )\n  )\n\n  useHeader(\n    t('header.activities'),\n    hasFailedItems ? <ActivitiesPageMenuButton /> : null\n  )\n\n  const { listHeight } = useListHeight({\n    listParentRef: parentRef,\n  })\n\n  const hasStoreItems = items.length > 0\n  const skeletonCount = isLoading && hasStoreItems ? SKELETON_COUNT : 0\n  const totalCount = items.length + skeletonCount\n\n  const getItemKey = useCallback(\n    (index: number) => {\n      if (index >= items.length) {\n        return `skeleton-${index}`\n      }\n      const item = items[index]\n      if (item.type === 'active') {\n        return `active-${item.routeId}`\n      }\n      return `${item.type}-${item.txHash || item.routeExecution.route.id}`\n    },\n    [items]\n  )\n\n  const { getVirtualItems, getTotalSize, measureElement } = useVirtualizer({\n    count: hasStoreItems ? totalCount : 0,\n    overscan: 3,\n    paddingEnd: 12,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (index) => (items[index]?.type === 'active' ? 218 : 196),\n    getItemKey,\n  })\n\n  const isEmpty = !items.length && !isLoading\n\n  return (\n    <PageContainer disableGutters>\n      <Box\n        className=\"long-list\"\n        ref={parentRef}\n        style={{ height: listHeight }}\n        sx={{ overflow: 'auto', paddingX: 3, paddingTop: 1.5 }}\n      >\n        {isEmpty ? (\n          <TransactionHistoryEmpty />\n        ) : isLoading && !hasStoreItems ? (\n          <List\n            disablePadding\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              gap: 2,\n              marginBottom: 2,\n            }}\n          >\n            {Array.from({ length: SKELETON_COUNT }).map((_, index) => (\n              <TransactionCardSkeleton key={index} />\n            ))}\n          </List>\n        ) : (\n          <List\n            style={{ height: getTotalSize(), position: 'relative' }}\n            disablePadding\n          >\n            {getVirtualItems().map((item) => {\n              const listItem =\n                item.index < items.length ? items[item.index] : null\n              return (\n                <li\n                  key={item.key}\n                  ref={measureElement}\n                  data-index={item.index}\n                  style={{\n                    position: 'absolute',\n                    top: 0,\n                    left: 0,\n                    width: '100%',\n                    paddingBottom: 16,\n                    transform: `translateY(${item.start}px)`,\n                    listStyle: 'none',\n                  }}\n                >\n                  {!listItem ? (\n                    <TransactionCardSkeleton />\n                  ) : listItem.type === 'active' ? (\n                    <ActiveTransactionItem routeId={listItem.routeId} />\n                  ) : (\n                    <TransactionHistoryItem\n                      route={listItem.routeExecution.route}\n                      type={listItem.type}\n                      transactionHash={listItem.txHash}\n                      startedAt={listItem.startedAt}\n                    />\n                  )}\n                </li>\n              )\n            })}\n          </List>\n        )}\n      </Box>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAM,iBAAiB;AAEvB,MAAa,uBAAoC;CAE/C,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,OAAO,cAAc,mBAAmB;CAEhD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,OAAO,GAC/C,CAAC,QAAQ,CACX;CACA,MAAM,iBAAiB,uBACrB,aACG,UACC,OAAO,OAAO,MAAM,MAAM,EAAE,MACzB,MACC,GAAG,WAAA,KACH,iBAAiB,SAAS,EAAE,MAAM,WAAW,CACjD,GACF,CAAC,gBAAgB,CACnB,CACF;CAEA,UACE,EAAE,mBAAmB,GACrB,iBAAiB,oBAAC,0BAAD,CAA2B,CAAA,IAAI,IAClD;CAEA,MAAM,EAAE,eAAe,cAAc,EACnC,eAAe,UACjB,CAAC;CAED,MAAM,gBAAgB,MAAM,SAAS;CACrC,MAAM,gBAAgB,aAAa,gBAAgB,iBAAiB;CACpE,MAAM,aAAa,MAAM,SAAS;CAElC,MAAM,aAAa,aAChB,UAAkB;EACjB,IAAI,SAAS,MAAM,QACjB,OAAO,YAAY;EAErB,MAAM,OAAO,MAAM;EACnB,IAAI,KAAK,SAAS,UAChB,OAAO,UAAU,KAAK;EAExB,OAAO,GAAG,KAAK,KAAK,GAAG,KAAK,UAAU,KAAK,eAAe,MAAM;CAClE,GACA,CAAC,KAAK,CACR;CAEA,MAAM,EAAE,iBAAiB,cAAc,mBAAmB,eAAe;EACvE,OAAO,gBAAgB,aAAa;EACpC,UAAU;EACV,YAAY;EACZ,wBAAwB,UAAU;EAClC,eAAe,UAAW,MAAM,QAAQ,SAAS,WAAW,MAAM;EAClE;CACF,CAAC;CAED,MAAM,UAAU,CAAC,MAAM,UAAU,CAAC;CAElC,OACE,oBAAC,eAAD;EAAe,gBAAA;YACb,oBAAC,KAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO,EAAE,QAAQ,WAAW;GAC5B,IAAI;IAAE,UAAU;IAAQ,UAAU;IAAG,YAAY;GAAI;aAEpD,UACC,oBAAC,yBAAD,CAA0B,CAAA,IACxB,aAAa,CAAC,gBAChB,oBAAC,MAAD;IACE,gBAAA;IACA,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,cAAc;IAChB;cAEC,MAAM,KAAK,EAAE,QAAQ,eAAe,CAAC,EAAE,KAAK,GAAG,UAC9C,oBAAC,yBAAD,CAAsC,GAAR,KAAQ,CACvC;GACG,CAAA,IAEN,oBAAC,MAAD;IACE,OAAO;KAAE,QAAQ,aAAa;KAAG,UAAU;IAAW;IACtD,gBAAA;cAEC,gBAAgB,EAAE,KAAK,SAAS;KAC/B,MAAM,WACJ,KAAK,QAAQ,MAAM,SAAS,MAAM,KAAK,SAAS;KAClD,OACE,oBAAC,MAAD;MAEE,KAAK;MACL,cAAY,KAAK;MACjB,OAAO;OACL,UAAU;OACV,KAAK;OACL,MAAM;OACN,OAAO;OACP,eAAe;OACf,WAAW,cAAc,KAAK,MAAM;OACpC,WAAW;MACb;gBAEC,CAAC,WACA,oBAAC,yBAAD,CAA0B,CAAA,IACxB,SAAS,SAAS,WACpB,oBAAC,uBAAD,EAAuB,SAAS,SAAS,QAAU,CAAA,IAEnD,oBAAC,wBAAD;OACE,OAAO,SAAS,eAAe;OAC/B,MAAM,SAAS;OACf,iBAAiB,SAAS;OAC1B,WAAW,SAAS;MACrB,CAAA;KAED,GAzBG,KAAK,GAyBR;IAER,CAAC;GACG,CAAA;EAEL,CAAA;CACQ,CAAA;AAEnB"}
+{"version":3,"file":"ActivitiesPage.js","names":[],"sources":["../../../../src/pages/ActivitiesPage/ActivitiesPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { Box, List } from '@mui/material'\nimport { useVirtualizer } from '@tanstack/react-virtual'\nimport { type JSX, useCallback, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCardSkeleton } from '../../components/TransactionCard/TransactionCardSkeleton.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useTransactionList } from '../../hooks/useTransactionList.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { ActiveTransactionItem } from './ActiveTransactionItem.js'\nimport { ActivitiesPageMenuButton } from './ActivitiesPageMenuButton.js'\nimport { TransactionHistoryEmpty } from './TransactionHistoryEmpty.js'\nimport { TransactionHistoryItem } from './TransactionHistoryItem.js'\n\nconst SKELETON_COUNT = 2\n\nexport const ActivitiesPage = (): JSX.Element => {\n  // Parent ref and useVirtualizer should be in one file to avoid blank page (0 virtual items) issue\n  const parentRef = useRef<HTMLDivElement | null>(null)\n  const { items, isLoading } = useTransactionList()\n\n  const { t } = useTranslation()\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.map((account) => account.address),\n    [accounts]\n  )\n  const hasFailedItems = useRouteExecutionStore(\n    useCallback(\n      (state) =>\n        Object.values(state.routes).some(\n          (r) =>\n            r?.status === RouteExecutionStatus.Failed &&\n            accountAddresses.includes(r.route.fromAddress)\n        ),\n      [accountAddresses]\n    )\n  )\n\n  useHeader(\n    t('header.activities'),\n    hasFailedItems ? <ActivitiesPageMenuButton /> : null\n  )\n\n  const { listHeight } = useListHeight({\n    listParentRef: parentRef,\n  })\n\n  const hasStoreItems = items.length > 0\n  const skeletonCount = isLoading && hasStoreItems ? SKELETON_COUNT : 0\n  const totalCount = items.length + skeletonCount\n\n  const getItemKey = useCallback(\n    (index: number) => {\n      if (index >= items.length) {\n        return `skeleton-${index}`\n      }\n      const item = items[index]\n      if (item.type === 'active') {\n        return `active-${item.routeId}`\n      }\n      return `${item.type}-${item.txHash || item.routeExecution.route.id}`\n    },\n    [items]\n  )\n\n  const { getVirtualItems, getTotalSize, measureElement } = useVirtualizer({\n    count: hasStoreItems ? totalCount : 0,\n    overscan: 3,\n    paddingEnd: 12,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (index) => (items[index]?.type === 'active' ? 218 : 196),\n    getItemKey,\n  })\n\n  const isEmpty = !items.length && !isLoading\n\n  return (\n    <PageContainer disableGutters>\n      <Box\n        className=\"long-list\"\n        ref={parentRef}\n        style={{ height: listHeight }}\n        sx={{ overflow: 'auto', paddingX: 3, paddingTop: 1.5 }}\n      >\n        {isEmpty ? (\n          <TransactionHistoryEmpty />\n        ) : isLoading && !hasStoreItems ? (\n          <List\n            disablePadding\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              gap: 2,\n              marginBottom: 2,\n            }}\n          >\n            {Array.from({ length: SKELETON_COUNT }).map((_, index) => (\n              <TransactionCardSkeleton key={index} />\n            ))}\n          </List>\n        ) : (\n          <List\n            style={{ height: getTotalSize(), position: 'relative' }}\n            disablePadding\n          >\n            {getVirtualItems().map((item) => {\n              const listItem =\n                item.index < items.length ? items[item.index] : null\n              return (\n                <li\n                  key={item.key}\n                  ref={measureElement}\n                  data-index={item.index}\n                  style={{\n                    position: 'absolute',\n                    top: 0,\n                    left: 0,\n                    width: '100%',\n                    paddingBottom: 16,\n                    transform: `translateY(${item.start}px)`,\n                    listStyle: 'none',\n                  }}\n                >\n                  {!listItem ? (\n                    <TransactionCardSkeleton />\n                  ) : listItem.type === 'active' ? (\n                    <ActiveTransactionItem routeId={listItem.routeId} />\n                  ) : (\n                    <TransactionHistoryItem\n                      route={listItem.routeExecution.route}\n                      type={listItem.type}\n                      transactionHash={listItem.txHash}\n                      startedAt={listItem.startedAt}\n                    />\n                  )}\n                </li>\n              )\n            })}\n          </List>\n        )}\n      </Box>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAM,iBAAiB;AAEvB,MAAa,uBAAoC;CAE/C,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,OAAO,cAAc,mBAAmB;CAEhD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,OAAO,GAC/C,CAAC,QAAQ,CACX;CACA,MAAM,iBAAiB,uBACrB,aACG,UACC,OAAO,OAAO,MAAM,MAAM,CAAC,CAAC,MACzB,MACC,GAAG,WAAA,KACH,iBAAiB,SAAS,EAAE,MAAM,WAAW,CACjD,GACF,CAAC,gBAAgB,CACnB,CACF;CAEA,UACE,EAAE,mBAAmB,GACrB,iBAAiB,oBAAC,0BAAD,CAA2B,CAAA,IAAI,IAClD;CAEA,MAAM,EAAE,eAAe,cAAc,EACnC,eAAe,UACjB,CAAC;CAED,MAAM,gBAAgB,MAAM,SAAS;CACrC,MAAM,gBAAgB,aAAa,gBAAgB,iBAAiB;CACpE,MAAM,aAAa,MAAM,SAAS;CAElC,MAAM,aAAa,aAChB,UAAkB;EACjB,IAAI,SAAS,MAAM,QACjB,OAAO,YAAY;EAErB,MAAM,OAAO,MAAM;EACnB,IAAI,KAAK,SAAS,UAChB,OAAO,UAAU,KAAK;EAExB,OAAO,GAAG,KAAK,KAAK,GAAG,KAAK,UAAU,KAAK,eAAe,MAAM;CAClE,GACA,CAAC,KAAK,CACR;CAEA,MAAM,EAAE,iBAAiB,cAAc,mBAAmB,eAAe;EACvE,OAAO,gBAAgB,aAAa;EACpC,UAAU;EACV,YAAY;EACZ,wBAAwB,UAAU;EAClC,eAAe,UAAW,MAAM,MAAM,EAAE,SAAS,WAAW,MAAM;EAClE;CACF,CAAC;CAED,MAAM,UAAU,CAAC,MAAM,UAAU,CAAC;CAElC,OACE,oBAAC,eAAD;EAAe,gBAAA;YACb,oBAAC,KAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO,EAAE,QAAQ,WAAW;GAC5B,IAAI;IAAE,UAAU;IAAQ,UAAU;IAAG,YAAY;GAAI;aAEpD,UACC,oBAAC,yBAAD,CAA0B,CAAA,IACxB,aAAa,CAAC,gBAChB,oBAAC,MAAD;IACE,gBAAA;IACA,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,cAAc;IAChB;cAEC,MAAM,KAAK,EAAE,QAAQ,eAAe,CAAC,CAAC,CAAC,KAAK,GAAG,UAC9C,oBAAC,yBAAD,CAAsC,GAAR,KAAQ,CACvC;GACG,CAAA,IAEN,oBAAC,MAAD;IACE,OAAO;KAAE,QAAQ,aAAa;KAAG,UAAU;IAAW;IACtD,gBAAA;cAEC,gBAAgB,CAAC,CAAC,KAAK,SAAS;KAC/B,MAAM,WACJ,KAAK,QAAQ,MAAM,SAAS,MAAM,KAAK,SAAS;KAClD,OACE,oBAAC,MAAD;MAEE,KAAK;MACL,cAAY,KAAK;MACjB,OAAO;OACL,UAAU;OACV,KAAK;OACL,MAAM;OACN,OAAO;OACP,eAAe;OACf,WAAW,cAAc,KAAK,MAAM;OACpC,WAAW;MACb;gBAEC,CAAC,WACA,oBAAC,yBAAD,CAA0B,CAAA,IACxB,SAAS,SAAS,WACpB,oBAAC,uBAAD,EAAuB,SAAS,SAAS,QAAU,CAAA,IAEnD,oBAAC,wBAAD;OACE,OAAO,SAAS,eAAe;OAC/B,MAAM,SAAS;OACf,iBAAiB,SAAS;OAC1B,WAAW,SAAS;MACrB,CAAA;KAED,GAzBG,KAAK,GAyBR;IAER,CAAC;GACG,CAAA;EAEL,CAAA;CACQ,CAAA;AAEnB"}

package/dist/esm/pages/MainPage/LimitPageContent.js

@@ -0,0 +1,23 @@
+import { PageContainer } from "../../components/PageContainer.js";
+import { AmountInputCardPair } from "../../components/AmountInputCard/AmountInputCardPair.js";
+import { LimitOrderSettings } from "../../components/LimitOrderSettings/LimitOrderSettings.js";
+import { LimitOrderRoutes } from "../../components/Routes/LimitOrderRoutes.js";
+import { MainPageActions } from "./MainPageActions.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/pages/MainPage/LimitPageContent.tsx
+const marginSx = { marginBottom: 2 };
+const LimitPageContent = () => {
+	return /* @__PURE__ */ jsxs(PageContainer, {
+		topGutters: true,
+		children: [
+			/* @__PURE__ */ jsx(AmountInputCardPair, { sx: marginSx }),
+			/* @__PURE__ */ jsx(LimitOrderSettings, { sx: marginSx }),
+			/* @__PURE__ */ jsx(LimitOrderRoutes, { sx: marginSx }),
+			/* @__PURE__ */ jsx(MainPageActions, {})
+		]
+	});
+};
+//#endregion
+export { LimitPageContent };
+
+//# sourceMappingURL=LimitPageContent.js.map

package/dist/esm/pages/MainPage/LimitPageContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LimitPageContent.js","names":[],"sources":["../../../../src/pages/MainPage/LimitPageContent.tsx"],"sourcesContent":["import { AmountInputCardPair } from '../../components/AmountInputCard/AmountInputCardPair.js'\nimport { LimitOrderSettings } from '../../components/LimitOrderSettings/LimitOrderSettings.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { LimitOrderRoutes } from '../../components/Routes/LimitOrderRoutes.js'\nimport { MainPageActions } from './MainPageActions.js'\n\nconst marginSx = { marginBottom: 2 }\n\nexport const LimitPageContent: React.FC = () => {\n  return (\n    <PageContainer topGutters>\n      <AmountInputCardPair sx={marginSx} />\n      <LimitOrderSettings sx={marginSx} />\n      <LimitOrderRoutes sx={marginSx} />\n      <MainPageActions />\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;AAMA,MAAM,WAAW,EAAE,cAAc,EAAE;AAEnC,MAAa,yBAAmC;CAC9C,OACE,qBAAC,eAAD;EAAe,YAAA;YAAf;GACE,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA;GACpC,oBAAC,oBAAD,EAAoB,IAAI,SAAW,CAAA;GACnC,oBAAC,kBAAD,EAAkB,IAAI,SAAW,CAAA;GACjC,oBAAC,iBAAD,CAAkB,CAAA;EACL;;AAEnB"}

package/dist/esm/pages/MainPage/MainPage.js

@@ -1,31 +1,36 @@
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
+import { useNavigationTabsStore } from "../../stores/navigationTabs/useNavigationTabsStore.js";
 import { PageContainer } from "../../components/PageContainer.js";
 import { useWideVariant } from "../../hooks/useWideVariant.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { AmountInput } from "../../components/AmountInput/AmountInput.js";
+import { AmountInputCardPair } from "../../components/AmountInputCard/AmountInputCardPair.js";
 import { ContractComponent } from "../../components/ContractComponent/ContractComponent.js";
 import { GasRefuelMessage } from "../../components/Messages/GasRefuelMessage.js";
-import { PoweredBy } from "../../components/PoweredBy/PoweredBy.js";
 import { Routes } from "../../components/Routes/Routes.js";
 import { SelectChainAndToken } from "../../components/SelectChainAndToken.js";
 import { SendToWalletButton } from "../../components/SendToWallet/SendToWalletButton.js";
-import { SendToWalletExpandButton } from "../../components/SendToWallet/SendToWalletExpandButton.js";
-import { MainWarningMessages } from "./MainWarningMessages.js";
-import { ReviewButton } from "./ReviewButton.js";
-import { Box } from "@mui/material";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { advancedNavigationTabKeys } from "../../components/SettingsPanel/utils.js";
+import { SettingsPanel } from "../../components/SettingsPanel/SettingsPanel.js";
+import { MainPageActions } from "./MainPageActions.js";
+import { LimitPageContent } from "./LimitPageContent.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 //#region src/pages/MainPage/MainPage.tsx
+const marginSx = { marginBottom: 2 };
 const MainPage = () => {
 	const { t } = useTranslation();
 	const wideVariant = useWideVariant();
-	const { mode, modeOptions, contractComponent, hiddenUI } = useWidgetConfig();
+	const { mode, modeOptions, contractComponent, hiddenUI, defaultUI } = useWidgetConfig();
+	const activeTab = useNavigationTabsStore((state) => state.activeTab);
 	const custom = mode === "custom";
-	const showPoweredBy = !hiddenUI?.poweredBy;
+	const advancedMode = !!activeTab && advancedNavigationTabKeys.includes(activeTab);
+	const showSendReceiveCards = defaultUI?.layout === "cards";
+	const showAmountEntry = !custom || modeOptions?.custom?.type === "deposit";
 	const showGasRefuelMessage = !hiddenUI?.gasRefuelMessage;
 	const splitTitle = modeOptions?.split === "bridge" ? t("header.bridge") : modeOptions?.split === "swap" ? t("header.swap") : void 0;
-	useHeader(mode === "custom" ? t(`header.${modeOptions?.custom?.type ?? "checkout"}`) : mode === "refuel" ? t("header.gas") : mode === "split" && splitTitle ? splitTitle : t("header.exchange"));
-	const marginSx = { marginBottom: 2 };
+	useHeader(mode === "limit" ? t("header.limit") : mode === "custom" ? t(`header.${modeOptions?.custom?.type ?? "checkout"}`) : mode === "refuel" ? t("header.gas") : mode === "split" && splitTitle ? splitTitle : t("header.exchange"));
+	if (mode === "limit") return /* @__PURE__ */ jsx(LimitPageContent, {});
 	return /* @__PURE__ */ jsxs(PageContainer, {
 		topGutters: true,
 		children: [
@@ -33,23 +38,15 @@ const MainPage = () => {
 				sx: marginSx,
 				children: contractComponent
 			}) : null,
-			/* @__PURE__ */ jsx(SelectChainAndToken, { sx: marginSx }),
-			!custom || modeOptions?.custom?.type === "deposit" ? /* @__PURE__ */ jsx(AmountInput, {
+			showSendReceiveCards && showAmountEntry ? /* @__PURE__ */ jsx(AmountInputCardPair, { sx: marginSx }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SelectChainAndToken, { sx: marginSx }), !showSendReceiveCards && showAmountEntry ? /* @__PURE__ */ jsx(AmountInput, {
 				formType: "from",
 				sx: marginSx
-			}) : null,
+			}) : null] }),
+			advancedMode ? /* @__PURE__ */ jsx(SettingsPanel, { sx: marginSx }) : null,
 			!wideVariant ? /* @__PURE__ */ jsx(Routes, { sx: marginSx }) : null,
 			/* @__PURE__ */ jsx(SendToWalletButton, { sx: marginSx }),
 			showGasRefuelMessage ? /* @__PURE__ */ jsx(GasRefuelMessage, { sx: marginSx }) : null,
-			/* @__PURE__ */ jsx(MainWarningMessages, { sx: marginSx }),
-			/* @__PURE__ */ jsxs(Box, {
-				sx: {
-					display: "flex",
-					mb: showPoweredBy ? 1 : 3
-				},
-				children: [/* @__PURE__ */ jsx(ReviewButton, {}), /* @__PURE__ */ jsx(SendToWalletExpandButton, {})]
-			}),
-			showPoweredBy ? /* @__PURE__ */ jsx(PoweredBy, {}) : null
+			/* @__PURE__ */ jsx(MainPageActions, { showSendToWalletExpand: true })
 		]
 	});
 };

package/dist/esm/pages/MainPage/MainPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MainPage.js","names":[],"sources":["../../../../src/pages/MainPage/MainPage.tsx"],"sourcesContent":["import { Box } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { AmountInput } from '../../components/AmountInput/AmountInput.js'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { GasRefuelMessage } from '../../components/Messages/GasRefuelMessage.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { PoweredBy } from '../../components/PoweredBy/PoweredBy.js'\nimport { Routes } from '../../components/Routes/Routes.js'\nimport { SelectChainAndToken } from '../../components/SelectChainAndToken.js'\nimport { SendToWalletButton } from '../../components/SendToWallet/SendToWalletButton.js'\nimport { SendToWalletExpandButton } from '../../components/SendToWallet/SendToWalletExpandButton.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { MainWarningMessages } from './MainWarningMessages.js'\nimport { ReviewButton } from './ReviewButton.js'\n\nexport const MainPage: React.FC = () => {\n  const { t } = useTranslation()\n  const wideVariant = useWideVariant()\n  const { mode, modeOptions, contractComponent, hiddenUI } = useWidgetConfig()\n  const custom = mode === 'custom'\n  const showPoweredBy = !hiddenUI?.poweredBy\n  const showGasRefuelMessage = !hiddenUI?.gasRefuelMessage\n\n  const splitTitle =\n    modeOptions?.split === 'bridge'\n      ? t('header.bridge')\n      : modeOptions?.split === 'swap'\n        ? t('header.swap')\n        : undefined\n  const title =\n    mode === 'custom'\n      ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}`)\n      : mode === 'refuel'\n        ? t('header.gas')\n        : mode === 'split' && splitTitle\n          ? splitTitle\n          : t('header.exchange')\n\n  useHeader(title)\n\n  const marginSx = { marginBottom: 2 }\n\n  return (\n    <PageContainer topGutters>\n      {custom ? (\n        <ContractComponent sx={marginSx}>{contractComponent}</ContractComponent>\n      ) : null}\n      <SelectChainAndToken sx={marginSx} />\n      {!custom || modeOptions?.custom?.type === 'deposit' ? (\n        <AmountInput formType=\"from\" sx={marginSx} />\n      ) : null}\n      {!wideVariant ? <Routes sx={marginSx} /> : null}\n      <SendToWalletButton sx={marginSx} />\n      {showGasRefuelMessage ? <GasRefuelMessage sx={marginSx} /> : null}\n      <MainWarningMessages sx={marginSx} />\n      <Box\n        sx={{\n          display: 'flex',\n          mb: showPoweredBy ? 1 : 3,\n        }}\n      >\n        <ReviewButton />\n        <SendToWalletExpandButton />\n      </Box>\n      {showPoweredBy ? <PoweredBy /> : null}\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,cAAc,eAAe;CACnC,MAAM,EAAE,MAAM,aAAa,mBAAmB,aAAa,gBAAgB;CAC3E,MAAM,SAAS,SAAS;CACxB,MAAM,gBAAgB,CAAC,UAAU;CACjC,MAAM,uBAAuB,CAAC,UAAU;CAExC,MAAM,aACJ,aAAa,UAAU,WACnB,EAAE,eAAe,IACjB,aAAa,UAAU,SACrB,EAAE,aAAa,IACf,KAAA;CAUR,UARE,SAAS,WACL,EAAE,UAAU,aAAa,QAAQ,QAAQ,YAAY,IACrD,SAAS,WACP,EAAE,YAAY,IACd,SAAS,WAAW,aAClB,aACA,EAAE,iBAAiB,CAEd;CAEf,MAAM,WAAW,EAAE,cAAc,EAAE;CAEnC,OACE,qBAAC,eAAD;EAAe,YAAA;YAAf;GACG,SACC,oBAAC,mBAAD;IAAmB,IAAI;cAAW;GAAqC,CAAA,IACrE;GACJ,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA;GACnC,CAAC,UAAU,aAAa,QAAQ,SAAS,YACxC,oBAAC,aAAD;IAAa,UAAS;IAAO,IAAI;GAAW,CAAA,IAC1C;GACH,CAAC,cAAc,oBAAC,QAAD,EAAQ,IAAI,SAAW,CAAA,IAAI;GAC3C,oBAAC,oBAAD,EAAoB,IAAI,SAAW,CAAA;GAClC,uBAAuB,oBAAC,kBAAD,EAAkB,IAAI,SAAW,CAAA,IAAI;GAC7D,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA;GACpC,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,IAAI,gBAAgB,IAAI;IAC1B;cAJF,CAME,oBAAC,cAAD,CAAe,CAAA,GACf,oBAAC,0BAAD,CAA2B,CAAA,CACxB;;GACJ,gBAAgB,oBAAC,WAAD,CAAY,CAAA,IAAI;EACpB;;AAEnB"}
+{"version":3,"file":"MainPage.js","names":[],"sources":["../../../../src/pages/MainPage/MainPage.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { AmountInput } from '../../components/AmountInput/AmountInput.js'\nimport { AmountInputCardPair } from '../../components/AmountInputCard/AmountInputCardPair.js'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { GasRefuelMessage } from '../../components/Messages/GasRefuelMessage.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { Routes } from '../../components/Routes/Routes.js'\nimport { SelectChainAndToken } from '../../components/SelectChainAndToken.js'\nimport { SendToWalletButton } from '../../components/SendToWallet/SendToWalletButton.js'\nimport { SettingsPanel } from '../../components/SettingsPanel/SettingsPanel.js'\nimport { advancedNavigationTabKeys } from '../../components/SettingsPanel/utils.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useNavigationTabsStore } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { LimitPageContent } from './LimitPageContent.js'\nimport { MainPageActions } from './MainPageActions.js'\n\nconst marginSx = { marginBottom: 2 }\n\nexport const MainPage: React.FC = () => {\n  const { t } = useTranslation()\n  const wideVariant = useWideVariant()\n  const { mode, modeOptions, contractComponent, hiddenUI, defaultUI } =\n    useWidgetConfig()\n  const activeTab = useNavigationTabsStore((state) => state.activeTab)\n\n  const custom = mode === 'custom'\n  // Surface the settings panel on the main page for advanced navigation tabs.\n  const advancedMode =\n    !!activeTab && advancedNavigationTabKeys.includes(activeTab)\n  const showSendReceiveCards = defaultUI?.layout === 'cards'\n  // Custom non-deposit contract flows have no amount entry — they keep the\n  // chain/token selectors only, in both layouts.\n  const showAmountEntry = !custom || modeOptions?.custom?.type === 'deposit'\n  const showGasRefuelMessage = !hiddenUI?.gasRefuelMessage\n\n  const splitTitle =\n    modeOptions?.split === 'bridge'\n      ? t('header.bridge')\n      : modeOptions?.split === 'swap'\n        ? t('header.swap')\n        : undefined\n  const title =\n    mode === 'limit'\n      ? t('header.limit')\n      : mode === 'custom'\n        ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}`)\n        : mode === 'refuel'\n          ? t('header.gas')\n          : mode === 'split' && splitTitle\n            ? splitTitle\n            : t('header.exchange')\n\n  useHeader(title)\n\n  if (mode === 'limit') {\n    return <LimitPageContent />\n  }\n\n  return (\n    <PageContainer topGutters>\n      {custom ? (\n        <ContractComponent sx={marginSx}>{contractComponent}</ContractComponent>\n      ) : null}\n      {showSendReceiveCards && showAmountEntry ? (\n        <AmountInputCardPair sx={marginSx} />\n      ) : (\n        <>\n          <SelectChainAndToken sx={marginSx} />\n          {!showSendReceiveCards && showAmountEntry ? (\n            <AmountInput formType=\"from\" sx={marginSx} />\n          ) : null}\n        </>\n      )}\n      {advancedMode ? <SettingsPanel sx={marginSx} /> : null}\n      {!wideVariant ? <Routes sx={marginSx} /> : null}\n      <SendToWalletButton sx={marginSx} />\n      {showGasRefuelMessage ? <GasRefuelMessage sx={marginSx} /> : null}\n      <MainPageActions showSendToWalletExpand />\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAkBA,MAAM,WAAW,EAAE,cAAc,EAAE;AAEnC,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,cAAc,eAAe;CACnC,MAAM,EAAE,MAAM,aAAa,mBAAmB,UAAU,cACtD,gBAAgB;CAClB,MAAM,YAAY,wBAAwB,UAAU,MAAM,SAAS;CAEnE,MAAM,SAAS,SAAS;CAExB,MAAM,eACJ,CAAC,CAAC,aAAa,0BAA0B,SAAS,SAAS;CAC7D,MAAM,uBAAuB,WAAW,WAAW;CAGnD,MAAM,kBAAkB,CAAC,UAAU,aAAa,QAAQ,SAAS;CACjE,MAAM,uBAAuB,CAAC,UAAU;CAExC,MAAM,aACJ,aAAa,UAAU,WACnB,EAAE,eAAe,IACjB,aAAa,UAAU,SACrB,EAAE,aAAa,IACf,KAAA;CAYR,UAVE,SAAS,UACL,EAAE,cAAc,IAChB,SAAS,WACP,EAAE,UAAU,aAAa,QAAQ,QAAQ,YAAY,IACrD,SAAS,WACP,EAAE,YAAY,IACd,SAAS,WAAW,aAClB,aACA,EAAE,iBAAiB,CAEhB;CAEf,IAAI,SAAS,SACX,OAAO,oBAAC,kBAAD,CAAmB,CAAA;CAG5B,OACE,qBAAC,eAAD;EAAe,YAAA;YAAf;GACG,SACC,oBAAC,mBAAD;IAAmB,IAAI;cAAW;GAAqC,CAAA,IACrE;GACH,wBAAwB,kBACvB,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA,IAEpC,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA,GACnC,CAAC,wBAAwB,kBACxB,oBAAC,aAAD;IAAa,UAAS;IAAO,IAAI;GAAW,CAAA,IAC1C,IACJ,EAAA,CAAA;GAEH,eAAe,oBAAC,eAAD,EAAe,IAAI,SAAW,CAAA,IAAI;GACjD,CAAC,cAAc,oBAAC,QAAD,EAAQ,IAAI,SAAW,CAAA,IAAI;GAC3C,oBAAC,oBAAD,EAAoB,IAAI,SAAW,CAAA;GAClC,uBAAuB,oBAAC,kBAAD,EAAkB,IAAI,SAAW,CAAA,IAAI;GAC7D,oBAAC,iBAAD,EAAiB,wBAAA,KAAwB,CAAA;EAC5B;;AAEnB"}

package/dist/esm/pages/MainPage/MainPageActions.js

@@ -0,0 +1,28 @@
+import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
+import { PoweredBy } from "../../components/PoweredBy/PoweredBy.js";
+import { SendToWalletExpandButton } from "../../components/SendToWallet/SendToWalletExpandButton.js";
+import { MainWarningMessages } from "./MainWarningMessages.js";
+import { ReviewButton } from "./ReviewButton.js";
+import { Box } from "@mui/material";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/pages/MainPage/MainPageActions.tsx
+const marginSx = { marginBottom: 2 };
+const MainPageActions = ({ showSendToWalletExpand }) => {
+	const { hiddenUI } = useWidgetConfig();
+	const showPoweredBy = !hiddenUI?.poweredBy;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(MainWarningMessages, { sx: marginSx }),
+		/* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				mb: showPoweredBy ? 1 : 3
+			},
+			children: [/* @__PURE__ */ jsx(ReviewButton, {}), showSendToWalletExpand ? /* @__PURE__ */ jsx(SendToWalletExpandButton, {}) : null]
+		}),
+		showPoweredBy ? /* @__PURE__ */ jsx(PoweredBy, {}) : null
+	] });
+};
+//#endregion
+export { MainPageActions };
+
+//# sourceMappingURL=MainPageActions.js.map

package/dist/esm/pages/MainPage/MainPageActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainPageActions.js","names":[],"sources":["../../../../src/pages/MainPage/MainPageActions.tsx"],"sourcesContent":["import { Box } from '@mui/material'\nimport { PoweredBy } from '../../components/PoweredBy/PoweredBy.js'\nimport { SendToWalletExpandButton } from '../../components/SendToWallet/SendToWalletExpandButton.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { MainWarningMessages } from './MainWarningMessages.js'\nimport { ReviewButton } from './ReviewButton.js'\n\ninterface MainPageActionsProps {\n  showSendToWalletExpand?: boolean\n}\n\nconst marginSx = { marginBottom: 2 }\n\nexport const MainPageActions: React.FC<MainPageActionsProps> = ({\n  showSendToWalletExpand,\n}) => {\n  const { hiddenUI } = useWidgetConfig()\n  const showPoweredBy = !hiddenUI?.poweredBy\n\n  return (\n    <>\n      <MainWarningMessages sx={marginSx} />\n      <Box\n        sx={{\n          display: 'flex',\n          mb: showPoweredBy ? 1 : 3,\n        }}\n      >\n        <ReviewButton />\n        {showSendToWalletExpand ? <SendToWalletExpandButton /> : null}\n      </Box>\n      {showPoweredBy ? <PoweredBy /> : null}\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAWA,MAAM,WAAW,EAAE,cAAc,EAAE;AAEnC,MAAa,mBAAmD,EAC9D,6BACI;CACJ,MAAM,EAAE,aAAa,gBAAgB;CACrC,MAAM,gBAAgB,CAAC,UAAU;CAEjC,OACE,qBAAA,UAAA,EAAA,UAAA;EACE,oBAAC,qBAAD,EAAqB,IAAI,SAAW,CAAA;EACpC,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,IAAI,gBAAgB,IAAI;GAC1B;aAJF,CAME,oBAAC,cAAD,CAAe,CAAA,GACd,yBAAyB,oBAAC,0BAAD,CAA2B,CAAA,IAAI,IACtD;;EACJ,gBAAgB,oBAAC,WAAD,CAAY,CAAA,IAAI;CACjC,EAAA,CAAA;AAEN"}

package/dist/esm/pages/MainPage/ReviewButton.js

@@ -2,7 +2,8 @@ import { useWidgetEvents } from "../../hooks/useWidgetEvents.js";
 import "../../types/events.js";
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
 import { navigationRoutes } from "../../utils/navigationRoutes.js";
-import { useSplitModeStore } from "../../stores/settings/useSplitModeStore.js";
+import { useSplitMode } from "../../stores/navigationTabs/useNavigationTabsStore.js";
+import { useFieldValues } from "../../stores/form/useFieldValues.js";
 import { useRoutes } from "../../hooks/useRoutes.js";
 import { useToAddressRequirements } from "../../hooks/useToAddressRequirements.js";
 import { BaseTransactionButton } from "../../components/BaseTransactionButton/BaseTransactionButton.js";
@@ -15,10 +16,11 @@ const ReviewButton = () => {
 	const navigate = useNavigate();
 	const emitter = useWidgetEvents();
 	const { mode, modeOptions } = useWidgetConfig();
-	const splitState = useSplitModeStore((state) => state.state);
+	const splitState = useSplitMode();
 	const { toAddress, requiredToAddress } = useToAddressRequirements();
 	const { routes, setReviewableRoute } = useRoutes();
-	const currentRoute = routes?.[0];
+	const [selectedRouteId] = useFieldValues("selectedRouteId");
+	const currentRoute = (mode === "limit" ? routes?.find((route) => route.id === selectedRouteId) : void 0) ?? routes?.[0];
 	const handleClick = async () => {
 		if (!currentRoute) return;
 		setReviewableRoute(currentRoute);
@@ -35,11 +37,16 @@ const ReviewButton = () => {
 		if (currentRoute) switch (mode) {
 			case "custom": return t(`button.${modeOptions?.custom?.type ?? "checkout"}Review`);
 			case "refuel": return t("button.getGas");
-			default: return t(`button.${currentRoute.fromChainId === currentRoute.toChainId ? "swap" : "bridge"}Review`);
+			case "limit": return t("button.review");
+			default: {
+				const transactionType = currentRoute.fromChainId === currentRoute.toChainId ? "swap" : "bridge";
+				return t(`button.${transactionType}Review`);
+			}
 		}
 		switch (mode) {
 			case "custom": return modeOptions?.custom?.type === "deposit" ? t("button.deposit") : t("button.buy");
 			case "refuel": return t("button.getGas");
+			case "limit": return t("button.review");
 			case "split":
 				if (splitState) return t(`button.${splitState}`);
 				return t("button.exchange");

package/dist/esm/pages/MainPage/ReviewButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReviewButton.js","names":[],"sources":["../../../../src/pages/MainPage/ReviewButton.tsx"],"sourcesContent":["import { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useSplitModeStore } from '../../stores/settings/useSplitModeStore.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const ReviewButton: React.FC = () => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const emitter = useWidgetEvents()\n  const { mode, modeOptions } = useWidgetConfig()\n  const splitState = useSplitModeStore((state) => state.state)\n  const { toAddress, requiredToAddress } = useToAddressRequirements()\n  const { routes, setReviewableRoute } = useRoutes()\n\n  const currentRoute = routes?.[0]\n\n  const handleClick = async () => {\n    if (!currentRoute) {\n      return\n    }\n\n    setReviewableRoute(currentRoute)\n    navigate({\n      to: navigationRoutes.transactionExecution,\n      search: { routeId: currentRoute.id },\n    })\n    emitter.emit(WidgetEvent.RouteSelected, {\n      route: currentRoute,\n      routes: routes!,\n    })\n  }\n\n  const getButtonText = (): string => {\n    if (currentRoute) {\n      switch (mode) {\n        case 'custom':\n          return t(`button.${modeOptions?.custom?.type ?? 'checkout'}Review`)\n        case 'refuel':\n          return t('button.getGas')\n        default: {\n          const transactionType =\n            currentRoute.fromChainId === currentRoute.toChainId\n              ? 'swap'\n              : 'bridge'\n          return t(`button.${transactionType}Review`)\n        }\n      }\n    }\n    switch (mode) {\n      case 'custom':\n        return modeOptions?.custom?.type === 'deposit'\n          ? t('button.deposit')\n          : t('button.buy')\n      case 'refuel':\n        return t('button.getGas')\n      case 'split':\n        if (splitState) {\n          return t(`button.${splitState}`)\n        }\n        return t('button.exchange')\n      default:\n        return t('button.exchange')\n    }\n  }\n\n  return (\n    <BaseTransactionButton\n      text={getButtonText()}\n      onClick={handleClick}\n      disabled={currentRoute && requiredToAddress && !toAddress}\n      route={currentRoute}\n      sx={{ flex: 1 }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAWA,MAAa,qBAA+B;CAC1C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EAAE,MAAM,gBAAgB,gBAAgB;CAC9C,MAAM,aAAa,mBAAmB,UAAU,MAAM,KAAK;CAC3D,MAAM,EAAE,WAAW,sBAAsB,yBAAyB;CAClE,MAAM,EAAE,QAAQ,uBAAuB,UAAU;CAEjD,MAAM,eAAe,SAAS;CAE9B,MAAM,cAAc,YAAY;EAC9B,IAAI,CAAC,cACH;EAGF,mBAAmB,YAAY;EAC/B,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,aAAa,GAAG;EACrC,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC,OAAO;GACC;EACV,CAAC;CACH;CAEA,MAAM,sBAA8B;EAClC,IAAI,cACF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,OAAO;GACpE,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,SAKE,OAAO,EAAE,UAHP,aAAa,gBAAgB,aAAa,YACtC,SACA,SAC6B,OAAO;EAE9C;EAEF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,aAAa,QAAQ,SAAS,YACjC,EAAE,gBAAgB,IAClB,EAAE,YAAY;GACpB,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,KAAK;IACH,IAAI,YACF,OAAO,EAAE,UAAU,YAAY;IAEjC,OAAO,EAAE,iBAAiB;GAC5B,SACE,OAAO,EAAE,iBAAiB;EAC9B;CACF;CAEA,OACE,oBAAC,uBAAD;EACE,MAAM,cAAc;EACpB,SAAS;EACT,UAAU,gBAAgB,qBAAqB,CAAC;EAChD,OAAO;EACP,IAAI,EAAE,MAAM,EAAE;CACf,CAAA;AAEL"}
+{"version":3,"file":"ReviewButton.js","names":[],"sources":["../../../../src/pages/MainPage/ReviewButton.tsx"],"sourcesContent":["import { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useSplitMode } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const ReviewButton: React.FC = () => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const emitter = useWidgetEvents()\n  const { mode, modeOptions } = useWidgetConfig()\n  const splitState = useSplitMode()\n  const { toAddress, requiredToAddress } = useToAddressRequirements()\n  const { routes, setReviewableRoute } = useRoutes()\n  const [selectedRouteId] = useFieldValues('selectedRouteId')\n\n  // The provider pick only applies in limit mode (it's the only flow that sets\n  // it). Honoring it in other modes would be wrong, since provider/tool keys\n  // can collide across modes. Everywhere else, fall back to the best route.\n  const currentRoute =\n    (mode === 'limit'\n      ? routes?.find((route) => route.id === selectedRouteId)\n      : undefined) ?? routes?.[0]\n\n  const handleClick = async () => {\n    if (!currentRoute) {\n      return\n    }\n\n    setReviewableRoute(currentRoute)\n    navigate({\n      to: navigationRoutes.transactionExecution,\n      search: { routeId: currentRoute.id },\n    })\n    emitter.emit(WidgetEvent.RouteSelected, {\n      route: currentRoute,\n      routes: routes!,\n    })\n  }\n\n  const getButtonText = (): string => {\n    if (currentRoute) {\n      switch (mode) {\n        case 'custom':\n          return t(`button.${modeOptions?.custom?.type ?? 'checkout'}Review`)\n        case 'refuel':\n          return t('button.getGas')\n        case 'limit':\n          return t('button.review')\n        default: {\n          const transactionType =\n            currentRoute.fromChainId === currentRoute.toChainId\n              ? 'swap'\n              : 'bridge'\n          return t(`button.${transactionType}Review`)\n        }\n      }\n    }\n    switch (mode) {\n      case 'custom':\n        return modeOptions?.custom?.type === 'deposit'\n          ? t('button.deposit')\n          : t('button.buy')\n      case 'refuel':\n        return t('button.getGas')\n      case 'limit':\n        return t('button.review')\n      case 'split':\n        if (splitState) {\n          return t(`button.${splitState}`)\n        }\n        return t('button.exchange')\n      default:\n        return t('button.exchange')\n    }\n  }\n\n  return (\n    <BaseTransactionButton\n      text={getButtonText()}\n      onClick={handleClick}\n      disabled={currentRoute && requiredToAddress && !toAddress}\n      route={currentRoute}\n      sx={{ flex: 1 }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAYA,MAAa,qBAA+B;CAC1C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EAAE,MAAM,gBAAgB,gBAAgB;CAC9C,MAAM,aAAa,aAAa;CAChC,MAAM,EAAE,WAAW,sBAAsB,yBAAyB;CAClE,MAAM,EAAE,QAAQ,uBAAuB,UAAU;CACjD,MAAM,CAAC,mBAAmB,eAAe,iBAAiB;CAK1D,MAAM,gBACH,SAAS,UACN,QAAQ,MAAM,UAAU,MAAM,OAAO,eAAe,IACpD,KAAA,MAAc,SAAS;CAE7B,MAAM,cAAc,YAAY;EAC9B,IAAI,CAAC,cACH;EAGF,mBAAmB,YAAY;EAC/B,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,aAAa,GAAG;EACrC,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC,OAAO;GACC;EACV,CAAC;CACH;CAEA,MAAM,sBAA8B;EAClC,IAAI,cACF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,OAAO;GACpE,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,KAAK,SACH,OAAO,EAAE,eAAe;GAC1B,SAAS;IACP,MAAM,kBACJ,aAAa,gBAAgB,aAAa,YACtC,SACA;IACN,OAAO,EAAE,UAAU,gBAAgB,OAAO;GAC5C;EACF;EAEF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,aAAa,QAAQ,SAAS,YACjC,EAAE,gBAAgB,IAClB,EAAE,YAAY;GACpB,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,KAAK,SACH,OAAO,EAAE,eAAe;GAC1B,KAAK;IACH,IAAI,YACF,OAAO,EAAE,UAAU,YAAY;IAEjC,OAAO,EAAE,iBAAiB;GAC5B,SACE,OAAO,EAAE,iBAAiB;EAC9B;CACF;CAEA,OACE,oBAAC,uBAAD;EACE,MAAM,cAAc;EACpB,SAAS;EACT,UAAU,gBAAgB,qBAAqB,CAAC;EAChD,OAAO;EACP,IAAI,EAAE,MAAM,EAAE;CACf,CAAA;AAEL"}

package/dist/esm/pages/RoutePriorityPage.js

@@ -0,0 +1,48 @@
+import { useSettingsActions } from "../stores/settings/useSettingsActions.js";
+import { PageContainer } from "../components/PageContainer.js";
+import { useSettings } from "../stores/settings/useSettings.js";
+import { useHeader } from "../hooks/useHeader.js";
+import { useListHeight } from "../hooks/useListHeight.js";
+import { ListItemText as ListItemText$1 } from "../components/ListItemText.js";
+import { SettingsListItemButton } from "../components/SettingsListItemButton.js";
+import { useRef } from "react";
+import { List } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import Check from "@mui/icons-material/Check";
+//#region src/pages/RoutePriorityPage.tsx
+const routePriorities = ["CHEAPEST", "FASTEST"];
+const RoutePriorityPage = () => {
+	const { t } = useTranslation();
+	const { setValue } = useSettingsActions();
+	const { routePriority } = useSettings(["routePriority"]);
+	const listParentRef = useRef(null);
+	const { listHeight } = useListHeight({ listParentRef });
+	useHeader(t("settings.routePriority"));
+	return /* @__PURE__ */ jsx(PageContainer, {
+		disableGutters: true,
+		children: /* @__PURE__ */ jsx(List, {
+			className: "long-list",
+			ref: listParentRef,
+			style: {
+				height: listHeight,
+				overflow: "auto"
+			},
+			sx: { padding: 1.5 },
+			children: routePriorities.map((priority) => {
+				const key = priority.toLowerCase();
+				return /* @__PURE__ */ jsxs(SettingsListItemButton, {
+					onClick: () => setValue("routePriority", priority),
+					children: [/* @__PURE__ */ jsx(ListItemText$1, {
+						primary: t(`settings.routePriorityOptions.${key}.title`),
+						secondary: t(`settings.routePriorityOptions.${key}.description`)
+					}), routePriority === priority && /* @__PURE__ */ jsx(Check, { color: "primary" })]
+				}, priority);
+			})
+		})
+	});
+};
+//#endregion
+export { RoutePriorityPage };
+
+//# sourceMappingURL=RoutePriorityPage.js.map

package/dist/esm/pages/RoutePriorityPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoutePriorityPage.js","names":["ListItemText"],"sources":["../../../src/pages/RoutePriorityPage.tsx"],"sourcesContent":["import type { Order } from '@lifi/sdk'\nimport Check from '@mui/icons-material/Check'\nimport { List } from '@mui/material'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ListItemText } from '../components/ListItemText.js'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SettingsListItemButton } from '../components/SettingsListItemButton.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useSettings } from '../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\nconst routePriorities: Order[] = ['CHEAPEST', 'FASTEST']\n\nexport const RoutePriorityPage: React.FC = () => {\n  const { t } = useTranslation()\n  const { setValue } = useSettingsActions()\n  const { routePriority } = useSettings(['routePriority'])\n  const listParentRef = useRef<HTMLUListElement | null>(null)\n  const { listHeight } = useListHeight({ listParentRef })\n\n  useHeader(t('settings.routePriority'))\n\n  return (\n    <PageContainer disableGutters>\n      <List\n        className=\"long-list\"\n        ref={listParentRef}\n        style={{ height: listHeight, overflow: 'auto' }}\n        sx={{\n          padding: 1.5,\n        }}\n      >\n        {routePriorities.map((priority) => {\n          const key = priority.toLowerCase()\n          return (\n            <SettingsListItemButton\n              key={priority}\n              onClick={() => setValue('routePriority', priority)}\n            >\n              <ListItemText\n                primary={t(`settings.routePriorityOptions.${key}.title` as any)}\n                secondary={t(\n                  `settings.routePriorityOptions.${key}.description` as any\n                )}\n              />\n              {routePriority === priority && <Check color=\"primary\" />}\n            </SettingsListItemButton>\n          )\n        })}\n      </List>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAM,kBAA2B,CAAC,YAAY,SAAS;AAEvD,MAAa,0BAAoC;CAC/C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,EAAE,kBAAkB,YAAY,CAAC,eAAe,CAAC;CACvD,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,UAAU,EAAE,wBAAwB,CAAC;CAErC,OACE,oBAAC,eAAD;EAAe,gBAAA;YACb,oBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,IAAI,EACF,SAAS,IACX;aAEC,gBAAgB,KAAK,aAAa;IACjC,MAAM,MAAM,SAAS,YAAY;IACjC,OACE,qBAAC,wBAAD;KAEE,eAAe,SAAS,iBAAiB,QAAQ;eAFnD,CAIE,oBAACA,gBAAD;MACE,SAAS,EAAE,iCAAiC,IAAI,OAAc;MAC9D,WAAW,EACT,iCAAiC,IAAI,aACvC;KACD,CAAA,GACA,kBAAkB,YAAY,oBAAC,OAAD,EAAO,OAAM,UAAW,CAAA,CACjC;OAVjB,QAUiB;GAE5B,CAAC;EACG,CAAA;CACO,CAAA;AAEnB"}

package/dist/esm/pages/RoutesPage/RoutesPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoutesPage.js","names":[],"sources":["../../../../src/pages/RoutesPage/RoutesPage.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { RouteCard } from '../../components/RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../../components/RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../../components/RouteCard/RouteNotFoundCard.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { Stack } from './RoutesPage.style.js'\n\nexport const RoutesPage = (): JSX.Element => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const emitter = useWidgetEvents()\n  const {\n    routes,\n    isLoading,\n    isFetching,\n    dataUpdatedAt,\n    refetchTime,\n    fromChain,\n    refetch,\n    setReviewableRoute,\n  } = useRoutes()\n  const { account } = useAccount({ chainType: fromChain?.chainType })\n  const [toAddress] = useFieldValues('toAddress')\n  const { requiredToAddress } = useToAddressRequirements()\n\n  const headerAction = useMemo(\n    () => (\n      <ProgressToNextUpdate\n        updatedAt={dataUpdatedAt || Date.now()}\n        timeToUpdate={refetchTime}\n        isLoading={isFetching}\n        onClick={() => refetch()}\n        sx={{ marginRight: -1 }}\n        size=\"medium\"\n      />\n    ),\n    [dataUpdatedAt, isFetching, refetch, refetchTime]\n  )\n\n  useHeader(t('header.receive'), headerAction)\n\n  const handleRouteClick = (route: Route) => {\n    setReviewableRoute(route)\n    navigate({\n      to: navigationRoutes.transactionExecution,\n      search: { routeId: route.id },\n    })\n    emitter.emit(WidgetEvent.RouteSelected, {\n      route,\n      routes: routes!,\n    })\n  }\n\n  const routeNotFound = !routes?.length && !isLoading && !isFetching\n\n  const toAddressUnsatisfied = routes?.[0] && requiredToAddress && !toAddress\n\n  const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n  return (\n    <Stack\n      className=\"long-list\"\n      direction=\"column\"\n      spacing={2}\n      sx={{ flex: 1, pt: 1.5 }}\n    >\n      {routeNotFound ? (\n        <RouteNotFoundCard />\n      ) : isLoading && !routes?.length ? (\n        Array.from({ length: 3 }).map((_, index) => (\n          <RouteCardSkeleton key={index} />\n        ))\n      ) : (\n        routes?.map((route: Route, index: number) => (\n          <RouteCard\n            key={index}\n            route={route}\n            onClick={\n              allowInteraction ? () => handleRouteClick(route) : undefined\n            }\n            active={index === 0}\n            expanded={routes?.length === 1}\n          />\n        ))\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAkBA,MAAa,mBAAgC;CAC3C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EACJ,QACA,WACA,YACA,eACA,aACA,WACA,SACA,uBACE,UAAU;CACd,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,UAAU,CAAC;CAClE,MAAM,CAAC,aAAa,eAAe,WAAW;CAC9C,MAAM,EAAE,sBAAsB,yBAAyB;CAEvD,MAAM,eAAe,cAEjB,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,IAAI;EACrC,cAAc;EACd,WAAW;EACX,eAAe,QAAQ;EACvB,IAAI,EAAE,aAAa,GAAG;EACtB,MAAK;CACN,CAAA,GAEH;EAAC;EAAe;EAAY;EAAS;CAAW,CAClD;CAEA,UAAU,EAAE,gBAAgB,GAAG,YAAY;CAE3C,MAAM,oBAAoB,UAAiB;EACzC,mBAAmB,KAAK;EACxB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,GAAG;EAC9B,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC;GACQ;EACV,CAAC;CACH;CAEA,MAAM,gBAAgB,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC;CAExD,MAAM,uBAAuB,SAAS,MAAM,qBAAqB,CAAC;CAElE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,OACE,oBAAC,OAAD;EACE,WAAU;EACV,WAAU;EACV,SAAS;EACT,IAAI;GAAE,MAAM;GAAG,IAAI;EAAI;YAEtB,gBACC,oBAAC,mBAAD,CAAoB,CAAA,IAClB,aAAa,CAAC,QAAQ,SACxB,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,GAAG,UAChC,oBAAC,mBAAD,CAAgC,GAAR,KAAQ,CACjC,IAED,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;GAES;GACP,SACE,yBAAyB,iBAAiB,KAAK,IAAI,KAAA;GAErD,QAAQ,UAAU;GAClB,UAAU,QAAQ,WAAW;EAC9B,GAPM,KAON,CACF;CAEE,CAAA;AAEX"}
+{"version":3,"file":"RoutesPage.js","names":[],"sources":["../../../../src/pages/RoutesPage/RoutesPage.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { RouteCard } from '../../components/RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../../components/RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../../components/RouteCard/RouteNotFoundCard.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { Stack } from './RoutesPage.style.js'\n\nexport const RoutesPage = (): JSX.Element => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const emitter = useWidgetEvents()\n  const {\n    routes,\n    isLoading,\n    isFetching,\n    dataUpdatedAt,\n    refetchTime,\n    fromChain,\n    refetch,\n    setReviewableRoute,\n  } = useRoutes()\n  const { account } = useAccount({ chainType: fromChain?.chainType })\n  const [toAddress] = useFieldValues('toAddress')\n  const { requiredToAddress } = useToAddressRequirements()\n\n  const headerAction = useMemo(\n    () => (\n      <ProgressToNextUpdate\n        updatedAt={dataUpdatedAt || Date.now()}\n        timeToUpdate={refetchTime}\n        isLoading={isFetching}\n        onClick={() => refetch()}\n        sx={{ marginRight: -1 }}\n        size=\"medium\"\n      />\n    ),\n    [dataUpdatedAt, isFetching, refetch, refetchTime]\n  )\n\n  useHeader(t('header.receive'), headerAction)\n\n  const handleRouteClick = (route: Route) => {\n    setReviewableRoute(route)\n    navigate({\n      to: navigationRoutes.transactionExecution,\n      search: { routeId: route.id },\n    })\n    emitter.emit(WidgetEvent.RouteSelected, {\n      route,\n      routes: routes!,\n    })\n  }\n\n  const routeNotFound = !routes?.length && !isLoading && !isFetching\n\n  const toAddressUnsatisfied = routes?.[0] && requiredToAddress && !toAddress\n\n  const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n  return (\n    <Stack\n      className=\"long-list\"\n      direction=\"column\"\n      spacing={2}\n      sx={{ flex: 1, pt: 1.5 }}\n    >\n      {routeNotFound ? (\n        <RouteNotFoundCard />\n      ) : isLoading && !routes?.length ? (\n        Array.from({ length: 3 }).map((_, index) => (\n          <RouteCardSkeleton key={index} />\n        ))\n      ) : (\n        routes?.map((route: Route, index: number) => (\n          <RouteCard\n            key={index}\n            route={route}\n            onClick={\n              allowInteraction ? () => handleRouteClick(route) : undefined\n            }\n            active={index === 0}\n            expanded={routes?.length === 1}\n          />\n        ))\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAkBA,MAAa,mBAAgC;CAC3C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EACJ,QACA,WACA,YACA,eACA,aACA,WACA,SACA,uBACE,UAAU;CACd,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,UAAU,CAAC;CAClE,MAAM,CAAC,aAAa,eAAe,WAAW;CAC9C,MAAM,EAAE,sBAAsB,yBAAyB;CAEvD,MAAM,eAAe,cAEjB,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,IAAI;EACrC,cAAc;EACd,WAAW;EACX,eAAe,QAAQ;EACvB,IAAI,EAAE,aAAa,GAAG;EACtB,MAAK;CACN,CAAA,GAEH;EAAC;EAAe;EAAY;EAAS;CAAW,CAClD;CAEA,UAAU,EAAE,gBAAgB,GAAG,YAAY;CAE3C,MAAM,oBAAoB,UAAiB;EACzC,mBAAmB,KAAK;EACxB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,GAAG;EAC9B,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC;GACQ;EACV,CAAC;CACH;CAEA,MAAM,gBAAgB,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC;CAExD,MAAM,uBAAuB,SAAS,MAAM,qBAAqB,CAAC;CAElE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,OACE,oBAAC,OAAD;EACE,WAAU;EACV,WAAU;EACV,SAAS;EACT,IAAI;GAAE,MAAM;GAAG,IAAI;EAAI;YAEtB,gBACC,oBAAC,mBAAD,CAAoB,CAAA,IAClB,aAAa,CAAC,QAAQ,SACxB,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,CAAgC,GAAR,KAAQ,CACjC,IAED,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;GAES;GACP,SACE,yBAAyB,iBAAiB,KAAK,IAAI,KAAA;GAErD,QAAQ,UAAU;GAClB,UAAU,QAAQ,WAAW;EAC9B,GAPM,KAON,CACF;CAEE,CAAA;AAEX"}

package/dist/esm/pages/RoutesPage/RoutesPage.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoutesPage.style.js","names":["Stack","MuiStack"],"sources":["../../../../src/pages/RoutesPage/RoutesPage.style.ts"],"sourcesContent":["import { Stack as MuiStack, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const Stack: React.FC<React.ComponentProps<typeof MuiStack>> = styled(\n  MuiStack\n)(({ theme }) => ({\n  position: 'relative',\n  padding: theme.spacing(0, 3, 3, 3),\n}))\n"],"mappings":";;AAGA,MAAaA,UAAyD,OACpEC,KACF,GAAG,EAAE,aAAa;CAChB,UAAU;CACV,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,CAAC;AACnC,EAAE"}
+{"version":3,"file":"RoutesPage.style.js","names":["Stack","MuiStack"],"sources":["../../../../src/pages/RoutesPage/RoutesPage.style.ts"],"sourcesContent":["import { Stack as MuiStack, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const Stack: React.FC<React.ComponentProps<typeof MuiStack>> = styled(\n  MuiStack\n)(({ theme }) => ({\n  position: 'relative',\n  padding: theme.spacing(0, 3, 3, 3),\n}))\n"],"mappings":";;AAGA,MAAaA,UAAyD,OACpEC,KACF,CAAC,EAAE,EAAE,aAAa;CAChB,UAAU;CACV,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,CAAC;AACnC,EAAE"}

package/dist/esm/pages/SelectEnabledToolsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Box, Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent, ChangeEventHandler } from 'react'\nimport { memo, useCallback, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useTools } from '../hooks/useTools.js'\nimport { useSettingsStore } from '../stores/settings/SettingsStore.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\ninterface SelectAllCheckboxProps {\n  allCheckboxesSelected: boolean\n  onClick: (event: ChangeEvent<HTMLInputElement>, checked: boolean) => void\n  anyCheckboxesSelected: boolean\n  noCheckboxesAvailable: boolean\n}\n\nconst SelectAllCheckbox = memo<SelectAllCheckboxProps>(\n  ({\n    allCheckboxesSelected,\n    anyCheckboxesSelected,\n    noCheckboxesAvailable,\n    onClick,\n  }) => {\n    const { t } = useTranslation()\n    const tooltipTitle = noCheckboxesAvailable\n      ? undefined\n      : allCheckboxesSelected\n        ? t('tooltip.deselectAll')\n        : t('tooltip.selectAll')\n\n    return (\n      <Tooltip title={tooltipTitle}>\n        <Checkbox\n          id=\"select-all\"\n          checked={allCheckboxesSelected}\n          indeterminate={anyCheckboxesSelected && !allCheckboxesSelected}\n          onChange={onClick}\n          disabled={noCheckboxesAvailable}\n          sx={{ mr: -1.5, height: 20 }}\n        />\n      </Tooltip>\n    )\n  }\n)\n\nexport const SelectEnabledToolsPage: React.FC<{\n  type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n  const typeKey = type.toLowerCase() as 'bridges' | 'exchanges'\n  const { tools } = useTools()\n  const { toggleToolKeys } = useSettingsActions()\n\n  const disabledTools = useSettingsStore((state) => state[`disabled${type}`])\n\n  const { t } = useTranslation()\n  const headerRef = useRef<HTMLElement>(null)\n  const listRef = useRef<HTMLDivElement>(null)\n  const [searchValue, setSearchValue] = useState('')\n\n  const { listHeight } = useListHeight({\n    listParentRef: listRef,\n    headerRef,\n  })\n\n  const filteredTools = useMemo(() => {\n    const toolsList = tools?.[typeKey] ?? []\n\n    if (!searchValue) {\n      return toolsList\n    }\n\n    const lowerSearchValue = searchValue.toLowerCase()\n    return toolsList.filter((tool) =>\n      tool.name.toLowerCase().includes(lowerSearchValue)\n    ) as ToolCollectionTypes\n  }, [tools, typeKey, searchValue])\n\n  const handleSelectAll = useCallback(() => {\n    toggleToolKeys(\n      type,\n      filteredTools.map((tool) => tool.key)\n    )\n  }, [toggleToolKeys, type, filteredTools])\n\n  const headerAction = useMemo(\n    () => (\n      <SelectAllCheckbox\n        allCheckboxesSelected={\n          !!filteredTools.length &&\n          filteredTools.every((tool) => !disabledTools.includes(tool.key))\n        }\n        anyCheckboxesSelected={\n          !!filteredTools.length &&\n          filteredTools.some((tool) => disabledTools.includes(tool.key))\n        }\n        noCheckboxesAvailable={!filteredTools.length}\n        onClick={handleSelectAll}\n      />\n    ),\n    [disabledTools, handleSelectAll, filteredTools]\n  )\n\n  useHeader(t(`settings.enabled${type}`), headerAction)\n\n  const handleSearchInputChange: ChangeEventHandler<HTMLInputElement> =\n    useCallback((e) => {\n      setSearchValue(e.target.value)\n      listRef.current?.scrollTo(0, 0)\n    }, [])\n\n  const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n  return (\n    <PageContainer disableGutters>\n      <Box ref={headerRef} sx={{ px: 3, pb: 2, pt: 1.5 }}>\n        <SearchInput\n          onChange={debouncedSearchInputChange}\n          placeholder={t(`main.search${type}`)}\n          autoFocus\n        />\n      </Box>\n      <Box ref={listRef} style={{ height: listHeight, overflow: 'auto' }}>\n        <Tools filteredTools={filteredTools} type={type} />\n      </Box>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAO7B,OACE,oBAAC,SAAD;EAAS,OAPU,wBACjB,KAAA,IACA,wBACE,EAAE,qBAAqB,IACvB,EAAE,mBAAmB;YAIvB,oBAAC,UAAD;GACE,IAAG;GACH,SAAS;GACT,eAAe,yBAAyB,CAAC;GACzC,UAAU;GACV,UAAU;GACV,IAAI;IAAE,IAAI;IAAM,QAAQ;GAAG;EAC5B,CAAA;CACM,CAAA;AAEb,CACF;AAEA,MAAa,0BAEP,EAAE,WAAW;CACjB,MAAM,UAAU,KAAK,YAAY;CACjC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,mBAAmB,mBAAmB;CAE9C,MAAM,gBAAgB,kBAAkB,UAAU,MAAM,WAAW,OAAO;CAE1E,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,YAAY,OAAoB,IAAI;CAC1C,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,CAAC,aAAa,kBAAkB,SAAS,EAAE;CAEjD,MAAM,EAAE,eAAe,cAAc;EACnC,eAAe;EACf;CACF,CAAC;CAED,MAAM,gBAAgB,cAAc;EAClC,MAAM,YAAY,QAAQ,YAAY,CAAC;EAEvC,IAAI,CAAC,aACH,OAAO;EAGT,MAAM,mBAAmB,YAAY,YAAY;EACjD,OAAO,UAAU,QAAQ,SACvB,KAAK,KAAK,YAAY,EAAE,SAAS,gBAAgB,CACnD;CACF,GAAG;EAAC;EAAO;EAAS;CAAW,CAAC;CAEhC,MAAM,kBAAkB,kBAAkB;EACxC,eACE,MACA,cAAc,KAAK,SAAS,KAAK,GAAG,CACtC;CACF,GAAG;EAAC;EAAgB;EAAM;CAAa,CAAC;CAExC,MAAM,eAAe,cAEjB,oBAAC,mBAAD;EACE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,OAAO,SAAS,CAAC,cAAc,SAAS,KAAK,GAAG,CAAC;EAEjE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,MAAM,SAAS,cAAc,SAAS,KAAK,GAAG,CAAC;EAE/D,uBAAuB,CAAC,cAAc;EACtC,SAAS;CACV,CAAA,GAEH;EAAC;EAAe;EAAiB;CAAa,CAChD;CAEA,UAAU,EAAE,mBAAmB,MAAM,GAAG,YAAY;CAUpD,OACE,qBAAC,eAAD;EAAe,gBAAA;YAAf,CACE,oBAAC,KAAD;GAAK,KAAK;GAAW,IAAI;IAAE,IAAI;IAAG,IAAI;IAAG,IAAI;GAAI;aAC/C,oBAAC,aAAD;IACE,UAN2B,SALjC,aAAa,MAAM;KACjB,eAAe,EAAE,OAAO,KAAK;KAC7B,QAAQ,SAAS,SAAS,GAAG,CAAC;IAChC,GAAG,CAAC,CAE4D,GAAG,GAM1B;IACnC,aAAa,EAAE,cAAc,MAAM;IACnC,WAAA;GACD,CAAA;EACE,CAAA,GACL,oBAAC,KAAD;GAAK,KAAK;GAAS,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;aAC/D,oBAAC,OAAD;IAAsB;IAAqB;GAAO,CAAA;EAC/C,CAAA,CACQ;;AAEnB"}
+{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Box, Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent, ChangeEventHandler } from 'react'\nimport { memo, useCallback, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useTools } from '../hooks/useTools.js'\nimport { useSettingsStore } from '../stores/settings/SettingsStore.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\ninterface SelectAllCheckboxProps {\n  allCheckboxesSelected: boolean\n  onClick: (event: ChangeEvent<HTMLInputElement>, checked: boolean) => void\n  anyCheckboxesSelected: boolean\n  noCheckboxesAvailable: boolean\n}\n\nconst SelectAllCheckbox = memo<SelectAllCheckboxProps>(\n  ({\n    allCheckboxesSelected,\n    anyCheckboxesSelected,\n    noCheckboxesAvailable,\n    onClick,\n  }) => {\n    const { t } = useTranslation()\n    const tooltipTitle = noCheckboxesAvailable\n      ? undefined\n      : allCheckboxesSelected\n        ? t('tooltip.deselectAll')\n        : t('tooltip.selectAll')\n\n    return (\n      <Tooltip title={tooltipTitle}>\n        <Checkbox\n          id=\"select-all\"\n          checked={allCheckboxesSelected}\n          indeterminate={anyCheckboxesSelected && !allCheckboxesSelected}\n          onChange={onClick}\n          disabled={noCheckboxesAvailable}\n          sx={{ mr: -1.5, height: 20 }}\n        />\n      </Tooltip>\n    )\n  }\n)\n\nexport const SelectEnabledToolsPage: React.FC<{\n  type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n  const typeKey = type.toLowerCase() as 'bridges' | 'exchanges'\n  const { tools } = useTools()\n  const { toggleToolKeys } = useSettingsActions()\n\n  const disabledTools = useSettingsStore((state) => state[`disabled${type}`])\n\n  const { t } = useTranslation()\n  const headerRef = useRef<HTMLElement>(null)\n  const listRef = useRef<HTMLDivElement>(null)\n  const [searchValue, setSearchValue] = useState('')\n\n  const { listHeight } = useListHeight({\n    listParentRef: listRef,\n    headerRef,\n  })\n\n  const filteredTools = useMemo(() => {\n    const toolsList = tools?.[typeKey] ?? []\n\n    if (!searchValue) {\n      return toolsList\n    }\n\n    const lowerSearchValue = searchValue.toLowerCase()\n    return toolsList.filter((tool) =>\n      tool.name.toLowerCase().includes(lowerSearchValue)\n    ) as ToolCollectionTypes\n  }, [tools, typeKey, searchValue])\n\n  const handleSelectAll = useCallback(() => {\n    toggleToolKeys(\n      type,\n      filteredTools.map((tool) => tool.key)\n    )\n  }, [toggleToolKeys, type, filteredTools])\n\n  const headerAction = useMemo(\n    () => (\n      <SelectAllCheckbox\n        allCheckboxesSelected={\n          !!filteredTools.length &&\n          filteredTools.every((tool) => !disabledTools.includes(tool.key))\n        }\n        anyCheckboxesSelected={\n          !!filteredTools.length &&\n          filteredTools.some((tool) => disabledTools.includes(tool.key))\n        }\n        noCheckboxesAvailable={!filteredTools.length}\n        onClick={handleSelectAll}\n      />\n    ),\n    [disabledTools, handleSelectAll, filteredTools]\n  )\n\n  useHeader(t(`settings.enabled${type}`), headerAction)\n\n  const handleSearchInputChange: ChangeEventHandler<HTMLInputElement> =\n    useCallback((e) => {\n      setSearchValue(e.target.value)\n      listRef.current?.scrollTo(0, 0)\n    }, [])\n\n  const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n  return (\n    <PageContainer disableGutters>\n      <Box ref={headerRef} sx={{ px: 3, pb: 2, pt: 1.5 }}>\n        <SearchInput\n          onChange={debouncedSearchInputChange}\n          placeholder={t(`main.search${type}`)}\n          autoFocus\n        />\n      </Box>\n      <Box ref={listRef} style={{ height: listHeight, overflow: 'auto' }}>\n        <Tools filteredTools={filteredTools} type={type} />\n      </Box>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAO7B,OACE,oBAAC,SAAD;EAAS,OAPU,wBACjB,KAAA,IACA,wBACE,EAAE,qBAAqB,IACvB,EAAE,mBAAmB;YAIvB,oBAAC,UAAD;GACE,IAAG;GACH,SAAS;GACT,eAAe,yBAAyB,CAAC;GACzC,UAAU;GACV,UAAU;GACV,IAAI;IAAE,IAAI;IAAM,QAAQ;GAAG;EAC5B,CAAA;CACM,CAAA;AAEb,CACF;AAEA,MAAa,0BAEP,EAAE,WAAW;CACjB,MAAM,UAAU,KAAK,YAAY;CACjC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,mBAAmB,mBAAmB;CAE9C,MAAM,gBAAgB,kBAAkB,UAAU,MAAM,WAAW,OAAO;CAE1E,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,YAAY,OAAoB,IAAI;CAC1C,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,CAAC,aAAa,kBAAkB,SAAS,EAAE;CAEjD,MAAM,EAAE,eAAe,cAAc;EACnC,eAAe;EACf;CACF,CAAC;CAED,MAAM,gBAAgB,cAAc;EAClC,MAAM,YAAY,QAAQ,YAAY,CAAC;EAEvC,IAAI,CAAC,aACH,OAAO;EAGT,MAAM,mBAAmB,YAAY,YAAY;EACjD,OAAO,UAAU,QAAQ,SACvB,KAAK,KAAK,YAAY,CAAC,CAAC,SAAS,gBAAgB,CACnD;CACF,GAAG;EAAC;EAAO;EAAS;CAAW,CAAC;CAEhC,MAAM,kBAAkB,kBAAkB;EACxC,eACE,MACA,cAAc,KAAK,SAAS,KAAK,GAAG,CACtC;CACF,GAAG;EAAC;EAAgB;EAAM;CAAa,CAAC;CAExC,MAAM,eAAe,cAEjB,oBAAC,mBAAD;EACE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,OAAO,SAAS,CAAC,cAAc,SAAS,KAAK,GAAG,CAAC;EAEjE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,MAAM,SAAS,cAAc,SAAS,KAAK,GAAG,CAAC;EAE/D,uBAAuB,CAAC,cAAc;EACtC,SAAS;CACV,CAAA,GAEH;EAAC;EAAe;EAAiB;CAAa,CAChD;CAEA,UAAU,EAAE,mBAAmB,MAAM,GAAG,YAAY;CAUpD,OACE,qBAAC,eAAD;EAAe,gBAAA;YAAf,CACE,oBAAC,KAAD;GAAK,KAAK;GAAW,IAAI;IAAE,IAAI;IAAG,IAAI;IAAG,IAAI;GAAI;aAC/C,oBAAC,aAAD;IACE,UAN2B,SALjC,aAAa,MAAM;KACjB,eAAe,EAAE,OAAO,KAAK;KAC7B,QAAQ,SAAS,SAAS,GAAG,CAAC;IAChC,GAAG,CAAC,CAE4D,GAAG,GAM1B;IACnC,aAAa,EAAE,cAAc,MAAM;IACnC,WAAA;GACD,CAAA;EACE,CAAA,GACL,oBAAC,KAAD;GAAK,KAAK;GAAS,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;aAC/D,oBAAC,OAAD;IAAsB;IAAqB;GAAO,CAAA;EAC/C,CAAA,CACQ;;AAEnB"}

package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js

@@ -4,7 +4,7 @@ import { useAddressValidation } from "../../hooks/useAddressValidation.js";
 import { AlertMessage } from "../../components/Messages/AlertMessage.js";
 import { BottomSheet } from "../../components/BottomSheet/BottomSheet.js";
 import { AddressInput, BookmarkInputFields, IconContainer, SendToWalletButtonRow, SendToWalletCard, SendToWalletSheetContainer, SheetAddressContainer, SheetTitle, ValidationAlert } from "./SendToWalletPage.style.js";
-import { forwardRef, useState } from "react";
+import { useState } from "react";
 import { Button, Typography } from "@mui/material";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
@@ -12,7 +12,7 @@ import WarningRounded from "@mui/icons-material/WarningRounded";
 import TurnedIn from "@mui/icons-material/TurnedIn";
 import ErrorIcon from "@mui/icons-material/Error";
 //#region src/pages/SendToWallet/BookmarkAddressSheet.tsx
-const BookmarkAddressSheet = forwardRef(({ validatedWallet, onAddBookmark }, ref) => {
+const BookmarkAddressSheet = ({ validatedWallet, onAddBookmark, ref }) => {
 	const { t } = useTranslation();
 	const [name, setName] = useState("");
 	const [address, setAddress] = useState("");
@@ -169,7 +169,7 @@ const BookmarkAddressSheet = forwardRef(({ validatedWallet, onAddBookmark }, ref
 			})] })
 		] })
 	});
-});
+};
 //#endregion
 export { BookmarkAddressSheet };
 

package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"BookmarkAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/BookmarkAddressSheet.tsx"],"sourcesContent":["import ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { ChangeEvent, RefObject } from 'react'\nimport {\n  type ForwardRefExoticComponent,\n  forwardRef,\n  type RefAttributes,\n  useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { Input } from '../../components/Input.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport {\n  AddressInput,\n  BookmarkInputFields,\n  IconContainer,\n  SendToWalletButtonRow,\n  SendToWalletCard,\n  SendToWalletSheetContainer,\n  SheetAddressContainer,\n  SheetTitle,\n  ValidationAlert,\n} from './SendToWalletPage.style.js'\nimport type { BookmarkError } from './types.js'\n\ninterface BookmarkAddressProps {\n  onAddBookmark: (bookmark: Bookmark) => void\n  validatedWallet?: Bookmark\n}\n\nexport const BookmarkAddressSheet: ForwardRefExoticComponent<\n  BookmarkAddressProps & RefAttributes<BottomSheetBase>\n> = forwardRef<BottomSheetBase, BookmarkAddressProps>(\n  ({ validatedWallet, onAddBookmark }, ref) => {\n    const { t } = useTranslation()\n    const [name, setName] = useState('')\n    const [address, setAddress] = useState('')\n    const [error, setError] = useState<BookmarkError>()\n    const { validateAddress, isValidating } = useAddressValidation()\n    const { getBookmark } = useBookmarkActions()\n\n    const nameValue = name.trim() || validatedWallet?.name || ''\n    const addressValue = address || validatedWallet?.address || ''\n\n    const handleCancel = () => {\n      setError(undefined)\n      ;(ref as RefObject<BottomSheetBase>).current?.close()\n    }\n\n    const validateWithAddressFromInput = async () => {\n      const validationResult = await validateAddress({ value: address })\n      if (!validationResult.isValid) {\n        setError({ type: 'address', message: validationResult.error })\n        return\n      }\n\n      return {\n        name: nameValue,\n        address: validationResult.address,\n        chainType: validationResult.chainType,\n      }\n    }\n\n    const validateWithValidatedWallet = (validatedWallet: Bookmark) => {\n      if (error) {\n        setError(undefined)\n      }\n      return {\n        name: nameValue,\n        address: validatedWallet.address,\n        chainType: validatedWallet.chainType,\n      }\n    }\n\n    const handleBookmark = async () => {\n      if (isValidating) {\n        return\n      }\n      if (!nameValue) {\n        setError({\n          type: 'name',\n          message: t('error.title.bookmarkNameRequired'),\n        })\n        return\n      }\n      if (!addressValue) {\n        setError({\n          type: 'address',\n          message: t('error.title.walletAddressRequired'),\n        })\n        return\n      }\n\n      //  If the validatedWallet is supplied as a prop then we should assume\n      //  the address has already been validated\n      const validatedBookmark = validatedWallet\n        ? validateWithValidatedWallet(validatedWallet)\n        : await validateWithAddressFromInput()\n\n      if (validatedBookmark) {\n        const existingBookmark = getBookmark(validatedBookmark.address)\n        if (existingBookmark) {\n          setError({\n            type: 'address',\n            message: t('error.title.bookmarkAlreadyExists', {\n              name: existingBookmark.name,\n            }),\n          })\n          return\n        }\n        ;(ref as RefObject<BottomSheetBase>).current?.close()\n\n        onAddBookmark({\n          name: validatedBookmark.name,\n          address: validatedBookmark.address,\n          chainType: validatedBookmark.chainType,\n        })\n      }\n    }\n\n    const handleAddressInputChange = (e: ChangeEvent) => {\n      if (error) {\n        setError(undefined)\n      }\n      setAddress((e.target as HTMLInputElement).value.trim())\n    }\n\n    const handleNameInputChange = (e: ChangeEvent) => {\n      if (error) {\n        setError(undefined)\n      }\n      setName((e.target as HTMLInputElement).value)\n    }\n\n    const resetValues = () => {\n      setName('')\n      setAddress('')\n    }\n\n    return (\n      <BottomSheet ref={ref} onClose={resetValues}>\n        <SendToWalletSheetContainer>\n          <IconContainer>\n            <TurnedIn sx={{ fontSize: 40 }} />\n          </IconContainer>\n          <SheetTitle>{t('sendToWallet.bookmarkWallet')}</SheetTitle>\n          {validatedWallet ? (\n            <SheetAddressContainer>\n              {validatedWallet?.name ? (\n                <Typography\n                  sx={{\n                    fontWeight: 600,\n                    mb: 0.5,\n                  }}\n                >\n                  {validatedWallet?.name}\n                </Typography>\n              ) : null}\n              <Typography>{validatedWallet?.address}</Typography>\n            </SheetAddressContainer>\n          ) : null}\n          <BookmarkInputFields>\n            <SendToWalletCard\n              type={error?.type === 'name' ? 'error' : 'default'}\n            >\n              <Input\n                size=\"small\"\n                autoComplete=\"off\"\n                autoCorrect=\"off\"\n                autoCapitalize=\"off\"\n                spellCheck=\"false\"\n                onChange={handleNameInputChange}\n                value={name}\n                placeholder={\n                  validatedWallet?.name || t('sendToWallet.enterName')\n                }\n                aria-label={\n                  validatedWallet?.name || t('sendToWallet.enterName')\n                }\n                inputProps={{ maxLength: 128 }}\n              />\n            </SendToWalletCard>\n            {!validatedWallet && (\n              <SendToWalletCard\n                type={error?.type === 'address' ? 'error' : 'default'}\n              >\n                <AddressInput\n                  size=\"small\"\n                  autoComplete=\"off\"\n                  autoCorrect=\"off\"\n                  autoCapitalize=\"off\"\n                  spellCheck=\"false\"\n                  onChange={handleAddressInputChange}\n                  value={address}\n                  placeholder={t('sendToWallet.enterAddress', {\n                    context: 'long',\n                  })}\n                  aria-label={t('sendToWallet.enterAddress', {\n                    context: 'long',\n                  })}\n                  maxRows={2}\n                  inputProps={{ maxLength: 128 }}\n                  multiline\n                />\n              </SendToWalletCard>\n            )}\n            {error ? (\n              <ValidationAlert icon={<ErrorIcon />}>\n                {error.message}\n              </ValidationAlert>\n            ) : null}\n          </BookmarkInputFields>\n          <AlertMessage\n            title={\n              <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n                {t('warning.message.fundsLossPrevention')}\n              </Typography>\n            }\n            icon={<WarningRounded />}\n          />\n          <SendToWalletButtonRow>\n            <Button variant=\"text\" onClick={handleCancel} fullWidth>\n              {t('button.cancel')}\n            </Button>\n            <Button\n              variant=\"contained\"\n              onClick={handleBookmark}\n              loading={isValidating}\n              loadingPosition=\"center\"\n              fullWidth\n              focusRipple\n            >\n              {t('button.bookmark')}\n            </Button>\n          </SendToWalletButtonRow>\n        </SendToWalletSheetContainer>\n      </BottomSheet>\n    )\n  }\n)\n"],"mappings":"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"}
+{"version":3,"file":"BookmarkAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/BookmarkAddressSheet.tsx"],"sourcesContent":["import ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { ChangeEvent, JSX, Ref, RefObject } from 'react'\nimport { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { Input } from '../../components/Input.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport {\n  AddressInput,\n  BookmarkInputFields,\n  IconContainer,\n  SendToWalletButtonRow,\n  SendToWalletCard,\n  SendToWalletSheetContainer,\n  SheetAddressContainer,\n  SheetTitle,\n  ValidationAlert,\n} from './SendToWalletPage.style.js'\nimport type { BookmarkError } from './types.js'\n\ninterface BookmarkAddressProps {\n  onAddBookmark: (bookmark: Bookmark) => void\n  validatedWallet?: Bookmark\n}\n\nexport const BookmarkAddressSheet = ({\n  validatedWallet,\n  onAddBookmark,\n  ref,\n}: BookmarkAddressProps & {\n  ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n  const { t } = useTranslation()\n  const [name, setName] = useState('')\n  const [address, setAddress] = useState('')\n  const [error, setError] = useState<BookmarkError>()\n  const { validateAddress, isValidating } = useAddressValidation()\n  const { getBookmark } = useBookmarkActions()\n\n  const nameValue = name.trim() || validatedWallet?.name || ''\n  const addressValue = address || validatedWallet?.address || ''\n\n  const handleCancel = () => {\n    setError(undefined)\n    ;(ref as RefObject<BottomSheetBase>).current?.close()\n  }\n\n  const validateWithAddressFromInput = async () => {\n    const validationResult = await validateAddress({ value: address })\n    if (!validationResult.isValid) {\n      setError({ type: 'address', message: validationResult.error })\n      return\n    }\n\n    return {\n      name: nameValue,\n      address: validationResult.address,\n      chainType: validationResult.chainType,\n    }\n  }\n\n  const validateWithValidatedWallet = (validatedWallet: Bookmark) => {\n    if (error) {\n      setError(undefined)\n    }\n    return {\n      name: nameValue,\n      address: validatedWallet.address,\n      chainType: validatedWallet.chainType,\n    }\n  }\n\n  const handleBookmark = async () => {\n    if (isValidating) {\n      return\n    }\n    if (!nameValue) {\n      setError({\n        type: 'name',\n        message: t('error.title.bookmarkNameRequired'),\n      })\n      return\n    }\n    if (!addressValue) {\n      setError({\n        type: 'address',\n        message: t('error.title.walletAddressRequired'),\n      })\n      return\n    }\n\n    //  If the validatedWallet is supplied as a prop then we should assume\n    //  the address has already been validated\n    const validatedBookmark = validatedWallet\n      ? validateWithValidatedWallet(validatedWallet)\n      : await validateWithAddressFromInput()\n\n    if (validatedBookmark) {\n      const existingBookmark = getBookmark(validatedBookmark.address)\n      if (existingBookmark) {\n        setError({\n          type: 'address',\n          message: t('error.title.bookmarkAlreadyExists', {\n            name: existingBookmark.name,\n          }),\n        })\n        return\n      }\n      ;(ref as RefObject<BottomSheetBase>).current?.close()\n\n      onAddBookmark({\n        name: validatedBookmark.name,\n        address: validatedBookmark.address,\n        chainType: validatedBookmark.chainType,\n      })\n    }\n  }\n\n  const handleAddressInputChange = (e: ChangeEvent) => {\n    if (error) {\n      setError(undefined)\n    }\n    setAddress((e.target as HTMLInputElement).value.trim())\n  }\n\n  const handleNameInputChange = (e: ChangeEvent) => {\n    if (error) {\n      setError(undefined)\n    }\n    setName((e.target as HTMLInputElement).value)\n  }\n\n  const resetValues = () => {\n    setName('')\n    setAddress('')\n  }\n\n  return (\n    <BottomSheet ref={ref} onClose={resetValues}>\n      <SendToWalletSheetContainer>\n        <IconContainer>\n          <TurnedIn sx={{ fontSize: 40 }} />\n        </IconContainer>\n        <SheetTitle>{t('sendToWallet.bookmarkWallet')}</SheetTitle>\n        {validatedWallet ? (\n          <SheetAddressContainer>\n            {validatedWallet?.name ? (\n              <Typography\n                sx={{\n                  fontWeight: 600,\n                  mb: 0.5,\n                }}\n              >\n                {validatedWallet?.name}\n              </Typography>\n            ) : null}\n            <Typography>{validatedWallet?.address}</Typography>\n          </SheetAddressContainer>\n        ) : null}\n        <BookmarkInputFields>\n          <SendToWalletCard type={error?.type === 'name' ? 'error' : 'default'}>\n            <Input\n              size=\"small\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              autoCapitalize=\"off\"\n              spellCheck=\"false\"\n              onChange={handleNameInputChange}\n              value={name}\n              placeholder={validatedWallet?.name || t('sendToWallet.enterName')}\n              aria-label={validatedWallet?.name || t('sendToWallet.enterName')}\n              inputProps={{ maxLength: 128 }}\n            />\n          </SendToWalletCard>\n          {!validatedWallet && (\n            <SendToWalletCard\n              type={error?.type === 'address' ? 'error' : 'default'}\n            >\n              <AddressInput\n                size=\"small\"\n                autoComplete=\"off\"\n                autoCorrect=\"off\"\n                autoCapitalize=\"off\"\n                spellCheck=\"false\"\n                onChange={handleAddressInputChange}\n                value={address}\n                placeholder={t('sendToWallet.enterAddress', {\n                  context: 'long',\n                })}\n                aria-label={t('sendToWallet.enterAddress', {\n                  context: 'long',\n                })}\n                maxRows={2}\n                inputProps={{ maxLength: 128 }}\n                multiline\n              />\n            </SendToWalletCard>\n          )}\n          {error ? (\n            <ValidationAlert icon={<ErrorIcon />}>\n              {error.message}\n            </ValidationAlert>\n          ) : null}\n        </BookmarkInputFields>\n        <AlertMessage\n          title={\n            <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n              {t('warning.message.fundsLossPrevention')}\n            </Typography>\n          }\n          icon={<WarningRounded />}\n        />\n        <SendToWalletButtonRow>\n          <Button variant=\"text\" onClick={handleCancel} fullWidth>\n            {t('button.cancel')}\n          </Button>\n          <Button\n            variant=\"contained\"\n            onClick={handleBookmark}\n            loading={isValidating}\n            loadingPosition=\"center\"\n            fullWidth\n            focusRipple\n          >\n            {t('button.bookmark')}\n          </Button>\n        </SendToWalletButtonRow>\n      </SendToWalletSheetContainer>\n    </BottomSheet>\n  )\n}\n"],"mappings":"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"}