@lifi/widget 4.0.0-beta.14 → 4.0.0-beta.18

package/dist/esm/hooks/useTransactionList.js

@@ -1,5 +1,4 @@
 import { hasEnumFlag } from "../utils/enum.js";
-import { RouteExecutionStatus } from "../stores/routes/types.js";
 import { getSourceTxHash } from "../stores/routes/utils.js";
 import { useRouteExecutionStore } from "../stores/routes/RouteExecutionStore.js";
 import { useTransactionHistory } from "./useTransactionHistory.js";
@@ -21,12 +20,12 @@ const useTransactionList = () => {
 				if (!accountAddresses.includes(r.route.fromAddress)) continue;
 				if (apiTxHashes.has(getSourceTxHash(r.route))) continue;
 				const startedAt = r.route.steps[0]?.execution?.startedAt ?? 0;
-				if (r.status === RouteExecutionStatus.Pending || r.status === RouteExecutionStatus.Failed) activeItems.push({
+				if (r.status === 2 || r.status === 8) activeItems.push({
 					type: "active",
 					routeId: r.route.id,
 					startedAt
 				});
-				else if (hasEnumFlag(r.status, RouteExecutionStatus.Done)) localItems.push({
+				else if (hasEnumFlag(r.status, 4)) localItems.push({
 					type: "local",
 					routeExecution: r,
 					txHash: getSourceTxHash(r.route) ?? "",

package/dist/esm/hooks/useTransactionList.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTransactionList.js","names":[],"sources":["../../../src/hooks/useTransactionList.ts"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { useMemo } from 'react'\nimport type {\n  ActiveItem,\n  HistoryItem,\n  LocalItem,\n  TransactionListItem,\n} from '../pages/ActivitiesPage/types.js'\nimport { useRouteExecutionStore } from '../stores/routes/RouteExecutionStore.js'\nimport type {\n  RouteExecution,\n  RouteExecutionState,\n} from '../stores/routes/types.js'\nimport { RouteExecutionStatus } from '../stores/routes/types.js'\nimport { getSourceTxHash } from '../stores/routes/utils.js'\nimport { hasEnumFlag } from '../utils/enum.js'\nimport { useTransactionHistory } from './useTransactionHistory.js'\n\nconst routesSelector = (state: RouteExecutionState) => state.routes\n\nexport const useTransactionList = (): {\n  items: TransactionListItem[]\n  isLoading: boolean\n} => {\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.map((account) => account.address),\n    [accounts]\n  )\n\n  const { data: apiRouteExecutions, isLoading } = useTransactionHistory()\n  const routes = useRouteExecutionStore(routesSelector)\n\n  const items = useMemo<TransactionListItem[]>(() => {\n    const apiTxHashes = new Set(\n      apiRouteExecutions.map((r) => getSourceTxHash(r.route))\n    )\n\n    const activeItems: ActiveItem[] = []\n    const localItems: LocalItem[] = []\n\n    for (const r of Object.values(routes) as RouteExecution[]) {\n      if (!accountAddresses.includes(r.route.fromAddress)) {\n        continue\n      }\n      // Guard against duplicates on the render before the store deletion\n      // from useTransactionHistory's combine propagates.\n      if (apiTxHashes.has(getSourceTxHash(r.route))) {\n        continue\n      }\n      const startedAt = r.route.steps[0]?.execution?.startedAt ?? 0\n      if (\n        r.status === RouteExecutionStatus.Pending ||\n        r.status === RouteExecutionStatus.Failed\n      ) {\n        activeItems.push({ type: 'active', routeId: r.route.id, startedAt })\n      } else if (hasEnumFlag(r.status, RouteExecutionStatus.Done)) {\n        localItems.push({\n          type: 'local',\n          routeExecution: r,\n          txHash: getSourceTxHash(r.route) ?? '',\n          // store startedAt is already in ms\n          startedAt,\n        })\n      }\n    }\n\n    const historyItems: HistoryItem[] = apiRouteExecutions.map(\n      (routeExecution) => ({\n        type: 'history',\n        routeExecution,\n        txHash: getSourceTxHash(routeExecution.route) ?? '',\n        startedAt: routeExecution.route.steps[0]?.execution?.startedAt ?? 0,\n      })\n    )\n\n    return [...activeItems, ...localItems, ...historyItems].sort(\n      (a, b) => b.startedAt - a.startedAt\n    )\n  }, [accountAddresses, apiRouteExecutions, routes])\n\n  return { items, isLoading }\n}\n"],"mappings":";;;;;;;;AAkBA,MAAM,kBAAkB,UAA+B,MAAM;AAE7D,MAAa,2BAGR;CACH,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,QAAQ,EAChD,CAAC,SAAS,CACX;CAED,MAAM,EAAE,MAAM,oBAAoB,cAAc,uBAAuB;CACvE,MAAM,SAAS,uBAAuB,eAAe;AAkDrD,QAAO;EAAE,OAhDK,cAAqC;GACjD,MAAM,cAAc,IAAI,IACtB,mBAAmB,KAAK,MAAM,gBAAgB,EAAE,MAAM,CAAC,CACxD;GAED,MAAM,cAA4B,EAAE;GACpC,MAAM,aAA0B,EAAE;AAElC,QAAK,MAAM,KAAK,OAAO,OAAO,OAAO,EAAsB;AACzD,QAAI,CAAC,iBAAiB,SAAS,EAAE,MAAM,YAAY,CACjD;AAIF,QAAI,YAAY,IAAI,gBAAgB,EAAE,MAAM,CAAC,CAC3C;IAEF,MAAM,YAAY,EAAE,MAAM,MAAM,IAAI,WAAW,aAAa;AAC5D,QACE,EAAE,WAAW,qBAAqB,WAClC,EAAE,WAAW,qBAAqB,OAElC,aAAY,KAAK;KAAE,MAAM;KAAU,SAAS,EAAE,MAAM;KAAI;KAAW,CAAC;aAC3D,YAAY,EAAE,QAAQ,qBAAqB,KAAK,CACzD,YAAW,KAAK;KACd,MAAM;KACN,gBAAgB;KAChB,QAAQ,gBAAgB,EAAE,MAAM,IAAI;KAEpC;KACD,CAAC;;GAIN,MAAM,eAA8B,mBAAmB,KACpD,oBAAoB;IACnB,MAAM;IACN;IACA,QAAQ,gBAAgB,eAAe,MAAM,IAAI;IACjD,WAAW,eAAe,MAAM,MAAM,IAAI,WAAW,aAAa;IACnE,EACF;AAED,UAAO;IAAC,GAAG;IAAa,GAAG;IAAY,GAAG;IAAa,CAAC,MACrD,GAAG,MAAM,EAAE,YAAY,EAAE,UAC3B;KACA;GAAC;GAAkB;GAAoB;GAAO,CAAC;EAElC;EAAW"}
+{"version":3,"file":"useTransactionList.js","names":[],"sources":["../../../src/hooks/useTransactionList.ts"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport { useMemo } from 'react'\nimport type {\n  ActiveItem,\n  HistoryItem,\n  LocalItem,\n  TransactionListItem,\n} from '../pages/ActivitiesPage/types.js'\nimport { useRouteExecutionStore } from '../stores/routes/RouteExecutionStore.js'\nimport type {\n  RouteExecution,\n  RouteExecutionState,\n} from '../stores/routes/types.js'\nimport { RouteExecutionStatus } from '../stores/routes/types.js'\nimport { getSourceTxHash } from '../stores/routes/utils.js'\nimport { hasEnumFlag } from '../utils/enum.js'\nimport { useTransactionHistory } from './useTransactionHistory.js'\n\nconst routesSelector = (state: RouteExecutionState) => state.routes\n\nexport const useTransactionList = (): {\n  items: TransactionListItem[]\n  isLoading: boolean\n} => {\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.map((account) => account.address),\n    [accounts]\n  )\n\n  const { data: apiRouteExecutions, isLoading } = useTransactionHistory()\n  const routes = useRouteExecutionStore(routesSelector)\n\n  const items = useMemo<TransactionListItem[]>(() => {\n    const apiTxHashes = new Set(\n      apiRouteExecutions.map((r) => getSourceTxHash(r.route))\n    )\n\n    const activeItems: ActiveItem[] = []\n    const localItems: LocalItem[] = []\n\n    for (const r of Object.values(routes) as RouteExecution[]) {\n      if (!accountAddresses.includes(r.route.fromAddress)) {\n        continue\n      }\n      // Guard against duplicates on the render before the store deletion\n      // from useTransactionHistory's combine propagates.\n      if (apiTxHashes.has(getSourceTxHash(r.route))) {\n        continue\n      }\n      const startedAt = r.route.steps[0]?.execution?.startedAt ?? 0\n      if (\n        r.status === RouteExecutionStatus.Pending ||\n        r.status === RouteExecutionStatus.Failed\n      ) {\n        activeItems.push({ type: 'active', routeId: r.route.id, startedAt })\n      } else if (hasEnumFlag(r.status, RouteExecutionStatus.Done)) {\n        localItems.push({\n          type: 'local',\n          routeExecution: r,\n          txHash: getSourceTxHash(r.route) ?? '',\n          // store startedAt is already in ms\n          startedAt,\n        })\n      }\n    }\n\n    const historyItems: HistoryItem[] = apiRouteExecutions.map(\n      (routeExecution) => ({\n        type: 'history',\n        routeExecution,\n        txHash: getSourceTxHash(routeExecution.route) ?? '',\n        startedAt: routeExecution.route.steps[0]?.execution?.startedAt ?? 0,\n      })\n    )\n\n    return [...activeItems, ...localItems, ...historyItems].sort(\n      (a, b) => b.startedAt - a.startedAt\n    )\n  }, [accountAddresses, apiRouteExecutions, routes])\n\n  return { items, isLoading }\n}\n"],"mappings":";;;;;;;AAkBA,MAAM,kBAAkB,UAA+B,MAAM;AAE7D,MAAa,2BAGR;CACH,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,QAAQ,EAChD,CAAC,SAAS,CACX;CAED,MAAM,EAAE,MAAM,oBAAoB,cAAc,uBAAuB;CACvE,MAAM,SAAS,uBAAuB,eAAe;AAkDrD,QAAO;EAAE,OAhDK,cAAqC;GACjD,MAAM,cAAc,IAAI,IACtB,mBAAmB,KAAK,MAAM,gBAAgB,EAAE,MAAM,CAAC,CACxD;GAED,MAAM,cAA4B,EAAE;GACpC,MAAM,aAA0B,EAAE;AAElC,QAAK,MAAM,KAAK,OAAO,OAAO,OAAO,EAAsB;AACzD,QAAI,CAAC,iBAAiB,SAAS,EAAE,MAAM,YAAY,CACjD;AAIF,QAAI,YAAY,IAAI,gBAAgB,EAAE,MAAM,CAAC,CAC3C;IAEF,MAAM,YAAY,EAAE,MAAM,MAAM,IAAI,WAAW,aAAa;AAC5D,QACE,EAAE,WAAA,KACF,EAAE,WAAA,EAEF,aAAY,KAAK;KAAE,MAAM;KAAU,SAAS,EAAE,MAAM;KAAI;KAAW,CAAC;aAC3D,YAAY,EAAE,QAAA,EAAkC,CACzD,YAAW,KAAK;KACd,MAAM;KACN,gBAAgB;KAChB,QAAQ,gBAAgB,EAAE,MAAM,IAAI;KAEpC;KACD,CAAC;;GAIN,MAAM,eAA8B,mBAAmB,KACpD,oBAAoB;IACnB,MAAM;IACN;IACA,QAAQ,gBAAgB,eAAe,MAAM,IAAI;IACjD,WAAW,eAAe,MAAM,MAAM,IAAI,WAAW,aAAa;IACnE,EACF;AAED,UAAO;IAAC,GAAG;IAAa,GAAG;IAAY,GAAG;IAAa,CAAC,MACrD,GAAG,MAAM,EAAE,YAAY,EAAE,UAC3B;KACA;GAAC;GAAkB;GAAoB;GAAO,CAEnC;EAAE;EAAW"}

package/dist/esm/hooks/useWidgetEvents.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWidgetEvents.js","names":[],"sources":["../../../src/hooks/useWidgetEvents.ts"],"sourcesContent":["import _mitt, { type Emitter, type EventHandlerMap, type EventType } from 'mitt'\nimport type { WidgetEvents } from '../types/events.js'\n\n// https://github.com/developit/mitt/issues/191\nconst mitt = _mitt as unknown as <Events extends Record<EventType, unknown>>(\n  all?: EventHandlerMap<Events>\n) => Emitter<Events>\n\nexport const widgetEvents: Emitter<WidgetEvents> = mitt<WidgetEvents>()\n\nexport const useWidgetEvents = (): Emitter<WidgetEvents> => {\n  return widgetEvents\n}\n"],"mappings":";AAQA,MAAa,eAJA,OAI0D;AAEvE,MAAa,wBAA+C;AAC1D,QAAO"}
+{"version":3,"file":"useWidgetEvents.js","names":[],"sources":["../../../src/hooks/useWidgetEvents.ts"],"sourcesContent":["import _mitt, { type Emitter, type EventHandlerMap, type EventType } from 'mitt'\nimport type { WidgetEvents } from '../types/events.js'\n\n// https://github.com/developit/mitt/issues/191\nconst mitt = _mitt as unknown as <Events extends Record<EventType, unknown>>(\n  all?: EventHandlerMap<Events>\n) => Emitter<Events>\n\nexport const widgetEvents: Emitter<WidgetEvents> = mitt<WidgetEvents>()\n\nexport const useWidgetEvents = (): Emitter<WidgetEvents> => {\n  return widgetEvents\n}\n"],"mappings":";AAQA,MAAa,eAAsC,OAAoB;AAEvE,MAAa,wBAA+C;AAC1D,QAAO"}

package/dist/esm/i18n/bn.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "উচ্চ মূল্য ক্ষতি",

package/dist/esm/i18n/de.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Hoher Wertverlust",

package/dist/esm/i18n/en.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "High slippage tolerance may result in unfavorable trade caused by front-running.",
       "slippageUnderRecommendedLimits": "Low slippage tolerance may cause transaction delays or failures."
     },
+    "checkbox": {
+      "highValueLoss": "I accept the high value loss"
+    },
     "title": {
       "clearFailedTransactions": "Clear all failed transactions?",
       "highValueLoss": "High value loss",

package/dist/esm/i18n/es.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "La tolerancia de los deslizamientos altos puede resultar en un comercio desfavorable causado por front-running.",
       "slippageUnderRecommendedLimits": "Elegir una baja tolerancia en el deslizamiento del intercambio puede causar retrasos o fallos en las transacciones."
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Pérdida de alto valor",

package/dist/esm/i18n/fr.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Une tolérance élevée au glissement peut entraîner un échange défavorable causé par le front-running.",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Perte de valeur élevée",

package/dist/esm/i18n/hi.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "",

package/dist/esm/i18n/id.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Toleransi selip yang tinggi dapat mengakibatkan perdagangan yang tidak menguntungkan yang disebabkan oleh front-running.",
       "slippageUnderRecommendedLimits": "Toleransi terhadap slipage yang rendah dapat mengakibatkan keterlambatan atau kegagalan transaksi."
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Kehilangan nilai tinggi",

package/dist/esm/i18n/it.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Perdita di valore elevato",

package/dist/esm/i18n/ja.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "スリッページ許容度が高すぎると、フロントランニングによる不利なトレードをひき起こす可能性があります。",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "高価値損失",

package/dist/esm/i18n/ko.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "높은 가치 손실",

package/dist/esm/i18n/pl.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "",

package/dist/esm/i18n/pt.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Alta tolerância na derrapagem pode resultar em negociação desfavorável ​​causada pelo front-running.",
       "slippageUnderRecommendedLimits": "Baixa tolerância à diferença na cotação pode causar atrasos e falhas na transação."
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Alta perda de valor",

package/dist/esm/i18n/th.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "การยอมรับความผิดปกติในการสลิปเพจสูงอาจส่งผลให้เกิดการซื้อขายที่ไม่คุ้มค่า ซึ่งเกิดจากการดำเนินการขายก่อน",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "สูญเสียมูลค่าสูง",

package/dist/esm/i18n/tr.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Yüksek slipaj, ani fiyat hareketleri nedeniyle zarara yol açabilir.",
       "slippageUnderRecommendedLimits": "Düşük kayma toleransı işlem gecikmelerine veya hatalarına neden olabilir."
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Yüksek değer kaybı",

package/dist/esm/i18n/uk.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Високий допуск до прослизання може призвести до несприятливої торгівлі через фронт-біг.",
       "slippageUnderRecommendedLimits": "Низький допуск до прослизання може призвести до затримок або невдачі транзакції."
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Висока втрата вартості",

package/dist/esm/i18n/vi.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "Khả năng trượt giá cao có thể dẫn đến giao dịch không thành công do front-running.",
       "slippageUnderRecommendedLimits": ""
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "Tổn thất lớn",

package/dist/esm/i18n/zh.json

@@ -132,6 +132,9 @@
       "slippageOutsideRecommendedLimits": "过高的滑点可能会导致交易被抢跑，造成财产损失",
       "slippageUnderRecommendedLimits": "低幻灯片宽度可能会导致交易延迟或失败。"
     },
+    "checkbox": {
+      "highValueLoss": ""
+    },
     "title": {
       "clearFailedTransactions": "",
       "highValueLoss": "大额资金损失",

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

@@ -1,5 +1,4 @@
 import { PageContainer } from "../../components/PageContainer.js";
-import { RouteExecutionStatus } from "../../stores/routes/types.js";
 import { useRouteExecutionStore } from "../../stores/routes/RouteExecutionStore.js";
 import { TransactionCardSkeleton } from "../../components/TransactionCard/TransactionCardSkeleton.js";
 import { useHeader } from "../../hooks/useHeader.js";
@@ -23,7 +22,7 @@ const ActivitiesPage = () => {
 	const { t } = useTranslation();
 	const { accounts } = useAccount();
 	const accountAddresses = useMemo(() => accounts.map((account) => account.address), [accounts]);
-	const hasFailedItems = useRouteExecutionStore(useCallback((state) => Object.values(state.routes).some((r) => r?.status === RouteExecutionStatus.Failed && accountAddresses.includes(r.route.fromAddress)), [accountAddresses]));
+	const hasFailedItems = useRouteExecutionStore(useCallback((state) => Object.values(state.routes).some((r) => r?.status === 8 && accountAddresses.includes(r.route.fromAddress)), [accountAddresses]));
 	useHeader(t("header.activities"), hasFailedItems ? /* @__PURE__ */ jsx(ActivitiesPageMenuButton, {}) : null);
 	const { listHeight } = useListHeight({ listParentRef: parentRef });
 	const hasStoreItems = items.length > 0;

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 = 3\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  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  if (!items.length && !isLoading) {\n    return <TransactionHistoryEmpty />\n  }\n\n  return (\n    <PageContainer disableGutters style={{ minHeight: 544 }}>\n      <Box\n        ref={parentRef}\n        style={{ height: listHeight }}\n        sx={{ overflow: 'auto', paddingX: 3 }}\n      >\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            className=\"long-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,KAAK;CACrD,MAAM,EAAE,OAAO,cAAc,oBAAoB;CACjD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,QAAQ,EAChD,CAAC,SAAS,CACX;CACD,MAAM,iBAAiB,uBACrB,aACG,UACC,OAAO,OAAO,MAAM,OAAO,CAAC,MACzB,MACC,GAAG,WAAW,qBAAqB,UACnC,iBAAiB,SAAS,EAAE,MAAM,YAAY,CACjD,EACH,CAAC,iBAAiB,CACnB,CACF;AAED,WACE,EAAE,oBAAoB,EACtB,iBAAiB,oBAAC,0BAAD,EAA4B,CAAA,GAAG,KACjD;CAED,MAAM,EAAE,eAAe,cAAc,EACnC,eAAe,WAChB,CAAC;CAEF,MAAM,gBAAgB,MAAM,SAAS;CACrC,MAAM,gBAAgB,aAAa,gBAAgB,iBAAiB;CACpE,MAAM,aAAa,MAAM,SAAS;CAElC,MAAM,aAAa,aAChB,UAAkB;AACjB,MAAI,SAAS,MAAM,OACjB,QAAO,YAAY;EAErB,MAAM,OAAO,MAAM;AACnB,MAAI,KAAK,SAAS,SAChB,QAAO,UAAU,KAAK;AAExB,SAAO,GAAG,KAAK,KAAK,GAAG,KAAK,UAAU,KAAK,eAAe,MAAM;IAElE,CAAC,MAAM,CACR;CAED,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;EACD,CAAC;AAEF,KAAI,CAAC,MAAM,UAAU,CAAC,UACpB,QAAO,oBAAC,yBAAD,EAA2B,CAAA;AAGpC,QACE,oBAAC,eAAD;EAAe,gBAAA;EAAe,OAAO,EAAE,WAAW,KAAK;YACrD,oBAAC,KAAD;GACE,KAAK;GACL,OAAO,EAAE,QAAQ,YAAY;GAC7B,IAAI;IAAE,UAAU;IAAQ,UAAU;IAAG;aAEpC,aAAa,CAAC,gBACb,oBAAC,MAAD;IACE,gBAAA;IACA,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,cAAc;KACf;cAEA,MAAM,KAAK,EAAE,QAAQ,gBAAgB,CAAC,CAAC,KAAK,GAAG,UAC9C,oBAAC,yBAAD,EAAuC,EAAT,MAAS,CACvC;IACG,CAAA,GAEP,oBAAC,MAAD;IACE,WAAU;IACV,OAAO;KAAE,QAAQ,cAAc;KAAE,UAAU;KAAY;IACvD,gBAAA;cAEC,iBAAiB,CAAC,KAAK,SAAS;KAC/B,MAAM,WACJ,KAAK,QAAQ,MAAM,SAAS,MAAM,KAAK,SAAS;AAClD,YACE,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;OACZ;gBAEA,CAAC,WACA,oBAAC,yBAAD,EAA2B,CAAA,GACzB,SAAS,SAAS,WACpB,oBAAC,uBAAD,EAAuB,SAAS,SAAS,SAAW,CAAA,GAEpD,oBAAC,wBAAD;OACE,OAAO,SAAS,eAAe;OAC/B,MAAM,SAAS;OACf,iBAAiB,SAAS;OAC1B,WAAW,SAAS;OACpB,CAAA;MAED,EAzBE,KAAK,IAyBP;MAEP;IACG,CAAA;GAEL,CAAA;EACQ,CAAA"}
+{"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 = 3\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  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  if (!items.length && !isLoading) {\n    return <TransactionHistoryEmpty />\n  }\n\n  return (\n    <PageContainer disableGutters style={{ minHeight: 544 }}>\n      <Box\n        ref={parentRef}\n        style={{ height: listHeight }}\n        sx={{ overflow: 'auto', paddingX: 3 }}\n      >\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            className=\"long-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,KAAK;CACrD,MAAM,EAAE,OAAO,cAAc,oBAAoB;CACjD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,KAAK,YAAY,QAAQ,QAAQ,EAChD,CAAC,SAAS,CACX;CACD,MAAM,iBAAiB,uBACrB,aACG,UACC,OAAO,OAAO,MAAM,OAAO,CAAC,MACzB,MACC,GAAG,WAAA,KACH,iBAAiB,SAAS,EAAE,MAAM,YAAY,CACjD,EACH,CAAC,iBAAiB,CACnB,CACF;AAED,WACE,EAAE,oBAAoB,EACtB,iBAAiB,oBAAC,0BAAD,EAA4B,CAAA,GAAG,KACjD;CAED,MAAM,EAAE,eAAe,cAAc,EACnC,eAAe,WAChB,CAAC;CAEF,MAAM,gBAAgB,MAAM,SAAS;CACrC,MAAM,gBAAgB,aAAa,gBAAgB,iBAAiB;CACpE,MAAM,aAAa,MAAM,SAAS;CAElC,MAAM,aAAa,aAChB,UAAkB;AACjB,MAAI,SAAS,MAAM,OACjB,QAAO,YAAY;EAErB,MAAM,OAAO,MAAM;AACnB,MAAI,KAAK,SAAS,SAChB,QAAO,UAAU,KAAK;AAExB,SAAO,GAAG,KAAK,KAAK,GAAG,KAAK,UAAU,KAAK,eAAe,MAAM;IAElE,CAAC,MAAM,CACR;CAED,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;EACD,CAAC;AAEF,KAAI,CAAC,MAAM,UAAU,CAAC,UACpB,QAAO,oBAAC,yBAAD,EAA2B,CAAA;AAGpC,QACE,oBAAC,eAAD;EAAe,gBAAA;EAAe,OAAO,EAAE,WAAW,KAAK;YACrD,oBAAC,KAAD;GACE,KAAK;GACL,OAAO,EAAE,QAAQ,YAAY;GAC7B,IAAI;IAAE,UAAU;IAAQ,UAAU;IAAG;aAEpC,aAAa,CAAC,gBACb,oBAAC,MAAD;IACE,gBAAA;IACA,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,cAAc;KACf;cAEA,MAAM,KAAK,EAAE,QAAQ,gBAAgB,CAAC,CAAC,KAAK,GAAG,UAC9C,oBAAC,yBAAD,EAAuC,EAAT,MAAS,CACvC;IACG,CAAA,GAEP,oBAAC,MAAD;IACE,WAAU;IACV,OAAO;KAAE,QAAQ,cAAc;KAAE,UAAU;KAAY;IACvD,gBAAA;cAEC,iBAAiB,CAAC,KAAK,SAAS;KAC/B,MAAM,WACJ,KAAK,QAAQ,MAAM,SAAS,MAAM,KAAK,SAAS;AAClD,YACE,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;OACZ;gBAEA,CAAC,WACA,oBAAC,yBAAD,EAA2B,CAAA,GACzB,SAAS,SAAS,WACpB,oBAAC,uBAAD,EAAuB,SAAS,SAAS,SAAW,CAAA,GAEpD,oBAAC,wBAAD;OACE,OAAO,SAAS,eAAe;OAC/B,MAAM,SAAS;OACf,iBAAiB,SAAS;OAC1B,WAAW,SAAS;OACpB,CAAA;MAED,EAzBE,KAAK,IAyBP;MAEP;IACG,CAAA;GAEL,CAAA;EACQ,CAAA"}

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

@@ -7,7 +7,7 @@ import { Button } from "@mui/material";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 import { useAccount } from "@lifi/wallet-management";
-import DeleteOutline from "@mui/icons-material/DeleteOutline";
+import DeleteOutline from "@mui/icons-material/DeleteOutlined";
 //#region src/pages/ActivitiesPage/ActivitiesPageMenuButton.tsx
 const ActivitiesPageMenuButton = () => {
 	const { t } = useTranslation();

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

@@ -1 +1 @@
-{"version":3,"file":"ActivitiesPageMenuButton.js","names":["DeleteOutlineIcon","Dialog","DialogTitle","DialogContent","DialogContentText","DialogActions"],"sources":["../../../../src/pages/ActivitiesPage/ActivitiesPageMenuButton.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'\nimport { Button } from '@mui/material'\nimport { useMemo, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { Dialog } from '../../components/Dialog/Dialog.js'\nimport {\n  DialogActions,\n  DialogContainer,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n} from '../../components/Dialog/Dialog.style.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\n\nexport const ActivitiesPageMenuButton: React.FC = () => {\n  const { t } = useTranslation()\n  const [dialogOpen, setDialogOpen] = useState(false)\n  const deleteRoutes = useRouteExecutionStore((store) => store.deleteRoutes)\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.flatMap((account) => account.address ?? []),\n    [accounts]\n  )\n\n  const handleDialogOpen = () => setDialogOpen(true)\n  const handleDialogClose = () => setDialogOpen(false)\n\n  const handleRemoveAllFailed = () => {\n    deleteRoutes('failed', accountAddresses)\n    handleDialogClose()\n  }\n\n  return (\n    <>\n      <ContextMenu\n        buttonSx={{ position: 'static', marginRight: -1.5 }}\n        items={[\n          {\n            icon: <DeleteOutlineIcon />,\n            label: t('button.clearAllFailed'),\n            onClick: handleDialogOpen,\n          },\n        ]}\n      />\n      <Dialog open={dialogOpen} onClose={handleDialogClose}>\n        <DialogContainer>\n          <DialogTitle>\n            {t('warning.title.clearFailedTransactions')}\n          </DialogTitle>\n          <DialogContent>\n            <DialogContentText>\n              {t('warning.message.clearFailedTransactions')}\n            </DialogContentText>\n          </DialogContent>\n          <DialogActions>\n            <Button onClick={handleDialogClose}>{t('button.cancel')}</Button>\n            <Button\n              variant=\"contained\"\n              onClick={handleRemoveAllFailed}\n              autoFocus\n            >\n              {t('button.delete')}\n            </Button>\n          </DialogActions>\n        </DialogContainer>\n      </Dialog>\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,iCAA2C;CACtD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,eAAe,wBAAwB,UAAU,MAAM,aAAa;CAC1E,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,SAAS,YAAY,QAAQ,WAAW,EAAE,CAAC,EAC1D,CAAC,SAAS,CACX;CAED,MAAM,yBAAyB,cAAc,KAAK;CAClD,MAAM,0BAA0B,cAAc,MAAM;CAEpD,MAAM,8BAA8B;AAClC,eAAa,UAAU,iBAAiB;AACxC,qBAAmB;;AAGrB,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,aAAD;EACE,UAAU;GAAE,UAAU;GAAU,aAAa;GAAM;EACnD,OAAO,CACL;GACE,MAAM,oBAACA,eAAD,EAAqB,CAAA;GAC3B,OAAO,EAAE,wBAAwB;GACjC,SAAS;GACV,CACF;EACD,CAAA,EACF,oBAACC,UAAD;EAAQ,MAAM;EAAY,SAAS;YACjC,qBAAC,iBAAD,EAAA,UAAA;GACE,oBAACC,eAAD,EAAA,UACG,EAAE,wCAAwC,EAC/B,CAAA;GACd,oBAACC,iBAAD,EAAA,UACE,oBAACC,qBAAD,EAAA,UACG,EAAE,0CAA0C,EAC3B,CAAA,EACN,CAAA;GAChB,qBAACC,iBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAS;cAAoB,EAAE,gBAAgB;IAAU,CAAA,EACjE,oBAAC,QAAD;IACE,SAAQ;IACR,SAAS;IACT,WAAA;cAEC,EAAE,gBAAgB;IACZ,CAAA,CACK,EAAA,CAAA;GACA,EAAA,CAAA;EACX,CAAA,CACR,EAAA,CAAA"}
+{"version":3,"file":"ActivitiesPageMenuButton.js","names":["DeleteOutlineIcon","Dialog","DialogTitle","DialogContent","DialogContentText","DialogActions"],"sources":["../../../../src/pages/ActivitiesPage/ActivitiesPageMenuButton.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport DeleteOutlineIcon from '@mui/icons-material/DeleteOutlined'\nimport { Button } from '@mui/material'\nimport { useMemo, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { Dialog } from '../../components/Dialog/Dialog.js'\nimport {\n  DialogActions,\n  DialogContainer,\n  DialogContent,\n  DialogContentText,\n  DialogTitle,\n} from '../../components/Dialog/Dialog.style.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\n\nexport const ActivitiesPageMenuButton: React.FC = () => {\n  const { t } = useTranslation()\n  const [dialogOpen, setDialogOpen] = useState(false)\n  const deleteRoutes = useRouteExecutionStore((store) => store.deleteRoutes)\n  const { accounts } = useAccount()\n  const accountAddresses = useMemo(\n    () => accounts.flatMap((account) => account.address ?? []),\n    [accounts]\n  )\n\n  const handleDialogOpen = () => setDialogOpen(true)\n  const handleDialogClose = () => setDialogOpen(false)\n\n  const handleRemoveAllFailed = () => {\n    deleteRoutes('failed', accountAddresses)\n    handleDialogClose()\n  }\n\n  return (\n    <>\n      <ContextMenu\n        buttonSx={{ position: 'static', marginRight: -1.5 }}\n        items={[\n          {\n            icon: <DeleteOutlineIcon />,\n            label: t('button.clearAllFailed'),\n            onClick: handleDialogOpen,\n          },\n        ]}\n      />\n      <Dialog open={dialogOpen} onClose={handleDialogClose}>\n        <DialogContainer>\n          <DialogTitle>\n            {t('warning.title.clearFailedTransactions')}\n          </DialogTitle>\n          <DialogContent>\n            <DialogContentText>\n              {t('warning.message.clearFailedTransactions')}\n            </DialogContentText>\n          </DialogContent>\n          <DialogActions>\n            <Button onClick={handleDialogClose}>{t('button.cancel')}</Button>\n            <Button\n              variant=\"contained\"\n              onClick={handleRemoveAllFailed}\n              autoFocus\n            >\n              {t('button.delete')}\n            </Button>\n          </DialogActions>\n        </DialogContainer>\n      </Dialog>\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAgBA,MAAa,iCAA2C;CACtD,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,eAAe,wBAAwB,UAAU,MAAM,aAAa;CAC1E,MAAM,EAAE,aAAa,YAAY;CACjC,MAAM,mBAAmB,cACjB,SAAS,SAAS,YAAY,QAAQ,WAAW,EAAE,CAAC,EAC1D,CAAC,SAAS,CACX;CAED,MAAM,yBAAyB,cAAc,KAAK;CAClD,MAAM,0BAA0B,cAAc,MAAM;CAEpD,MAAM,8BAA8B;AAClC,eAAa,UAAU,iBAAiB;AACxC,qBAAmB;;AAGrB,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,aAAD;EACE,UAAU;GAAE,UAAU;GAAU,aAAa;GAAM;EACnD,OAAO,CACL;GACE,MAAM,oBAACA,eAAD,EAAqB,CAAA;GAC3B,OAAO,EAAE,wBAAwB;GACjC,SAAS;GACV,CACF;EACD,CAAA,EACF,oBAACC,UAAD;EAAQ,MAAM;EAAY,SAAS;YACjC,qBAAC,iBAAD,EAAA,UAAA;GACE,oBAACC,eAAD,EAAA,UACG,EAAE,wCAAwC,EAC/B,CAAA;GACd,oBAACC,iBAAD,EAAA,UACE,oBAACC,qBAAD,EAAA,UACG,EAAE,0CAA0C,EAC3B,CAAA,EACN,CAAA;GAChB,qBAACC,iBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAS;cAAoB,EAAE,gBAAgB;IAAU,CAAA,EACjE,oBAAC,QAAD;IACE,SAAQ;IACR,SAAS;IACT,WAAA;cAEC,EAAE,gBAAgB;IACZ,CAAA,CACK,EAAA,CAAA;GACA,EAAA,CAAA;EACX,CAAA,CACR,EAAA,CAAA"}

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

@@ -1,5 +1,5 @@
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
-import { HiddenUI } from "../../types/widget.js";
+import "../../types/widget.js";
 import { PageContainer } from "../../components/PageContainer.js";
 import { useWideVariant } from "../../hooks/useWideVariant.js";
 import { useHeader } from "../../hooks/useHeader.js";
@@ -22,8 +22,8 @@ const MainPage = () => {
 	const wideVariant = useWideVariant();
 	const { subvariant, subvariantOptions, contractComponent, hiddenUI } = useWidgetConfig();
 	const custom = subvariant === "custom";
-	const showPoweredBy = !hiddenUI?.includes(HiddenUI.PoweredBy);
-	const showGasRefuelMessage = !hiddenUI?.includes(HiddenUI.GasRefuelMessage);
+	const showPoweredBy = !hiddenUI?.includes("poweredBy");
+	const showGasRefuelMessage = !hiddenUI?.includes("gasRefuelMessage");
 	const splitTitle = subvariantOptions?.split === "bridge" ? t("header.bridge") : subvariantOptions?.split === "swap" ? t("header.swap") : void 0;
 	useHeader(subvariant === "custom" ? t(`header.${subvariantOptions?.custom ?? "checkout"}`) : subvariant === "refuel" ? t("header.gas") : subvariant === "split" && splitTitle ? splitTitle : t("header.exchange"));
 	const marginSx = { marginBottom: 2 };
@@ -32,15 +32,15 @@ const MainPage = () => {
 			sx: marginSx,
 			children: contractComponent
 		}) : null,
-		/* @__PURE__ */ jsx(SelectChainAndToken, { mb: 2 }),
+		/* @__PURE__ */ jsx(SelectChainAndToken, { sx: marginSx }),
 		!custom || subvariantOptions?.custom === "deposit" ? /* @__PURE__ */ jsx(AmountInput, {
 			formType: "from",
 			sx: marginSx
 		}) : null,
 		!wideVariant ? /* @__PURE__ */ jsx(Routes, { sx: marginSx }) : null,
 		/* @__PURE__ */ jsx(SendToWalletButton, { sx: marginSx }),
-		showGasRefuelMessage ? /* @__PURE__ */ jsx(GasRefuelMessage, { mb: 2 }) : null,
-		/* @__PURE__ */ jsx(MainWarningMessages, { mb: 2 }),
+		showGasRefuelMessage ? /* @__PURE__ */ jsx(GasRefuelMessage, { sx: marginSx }) : null,
+		/* @__PURE__ */ jsx(MainWarningMessages, { sx: marginSx }),
 		/* @__PURE__ */ jsxs(Box, {
 			sx: {
 				display: "flex",

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 { HiddenUI } from '../../types/widget.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 { subvariant, subvariantOptions, contractComponent, hiddenUI } =\n    useWidgetConfig()\n  const custom = subvariant === 'custom'\n  const showPoweredBy = !hiddenUI?.includes(HiddenUI.PoweredBy)\n  const showGasRefuelMessage = !hiddenUI?.includes(HiddenUI.GasRefuelMessage)\n\n  const splitTitle =\n    subvariantOptions?.split === 'bridge'\n      ? t('header.bridge')\n      : subvariantOptions?.split === 'swap'\n        ? t('header.swap')\n        : undefined\n  const title =\n    subvariant === 'custom'\n      ? t(`header.${subvariantOptions?.custom ?? 'checkout'}`)\n      : subvariant === 'refuel'\n        ? t('header.gas')\n        : subvariant === 'split' && splitTitle\n          ? splitTitle\n          : t('header.exchange')\n\n  useHeader(title)\n\n  const marginSx = { marginBottom: 2 }\n\n  return (\n    <PageContainer>\n      {custom ? (\n        <ContractComponent sx={marginSx}>{contractComponent}</ContractComponent>\n      ) : null}\n      <SelectChainAndToken mb={2} />\n      {!custom || subvariantOptions?.custom === 'deposit' ? (\n        <AmountInput formType=\"from\" sx={marginSx} />\n      ) : null}\n      {!wideVariant ? <Routes sx={marginSx} /> : null}\n      <SendToWalletButton sx={marginSx} />\n      {showGasRefuelMessage ? <GasRefuelMessage mb={2} /> : null}\n      <MainWarningMessages mb={2} />\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":";;;;;;;;;;;;;;;;;;;AAkBA,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,cAAc,gBAAgB;CACpC,MAAM,EAAE,YAAY,mBAAmB,mBAAmB,aACxD,iBAAiB;CACnB,MAAM,SAAS,eAAe;CAC9B,MAAM,gBAAgB,CAAC,UAAU,SAAS,SAAS,UAAU;CAC7D,MAAM,uBAAuB,CAAC,UAAU,SAAS,SAAS,iBAAiB;CAE3E,MAAM,aACJ,mBAAmB,UAAU,WACzB,EAAE,gBAAgB,GAClB,mBAAmB,UAAU,SAC3B,EAAE,cAAc,GAChB,KAAA;AAUR,WARE,eAAe,WACX,EAAE,UAAU,mBAAmB,UAAU,aAAa,GACtD,eAAe,WACb,EAAE,aAAa,GACf,eAAe,WAAW,aACxB,aACA,EAAE,kBAAkB,CAEd;CAEhB,MAAM,WAAW,EAAE,cAAc,GAAG;AAEpC,QACE,qBAAC,eAAD,EAAA,UAAA;EACG,SACC,oBAAC,mBAAD;GAAmB,IAAI;aAAW;GAAsC,CAAA,GACtE;EACJ,oBAAC,qBAAD,EAAqB,IAAI,GAAK,CAAA;EAC7B,CAAC,UAAU,mBAAmB,WAAW,YACxC,oBAAC,aAAD;GAAa,UAAS;GAAO,IAAI;GAAY,CAAA,GAC3C;EACH,CAAC,cAAc,oBAAC,QAAD,EAAQ,IAAI,UAAY,CAAA,GAAG;EAC3C,oBAAC,oBAAD,EAAoB,IAAI,UAAY,CAAA;EACnC,uBAAuB,oBAAC,kBAAD,EAAkB,IAAI,GAAK,CAAA,GAAG;EACtD,oBAAC,qBAAD,EAAqB,IAAI,GAAK,CAAA;EAC9B,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,IAAI,gBAAgB,IAAI;IACzB;aAJH,CAME,oBAAC,cAAD,EAAgB,CAAA,EAChB,oBAAC,0BAAD,EAA4B,CAAA,CACxB;;EACL,gBAAgB,oBAAC,WAAD,EAAa,CAAA,GAAG;EACnB,EAAA,CAAA"}
+{"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 { HiddenUI } from '../../types/widget.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 { subvariant, subvariantOptions, contractComponent, hiddenUI } =\n    useWidgetConfig()\n  const custom = subvariant === 'custom'\n  const showPoweredBy = !hiddenUI?.includes(HiddenUI.PoweredBy)\n  const showGasRefuelMessage = !hiddenUI?.includes(HiddenUI.GasRefuelMessage)\n\n  const splitTitle =\n    subvariantOptions?.split === 'bridge'\n      ? t('header.bridge')\n      : subvariantOptions?.split === 'swap'\n        ? t('header.swap')\n        : undefined\n  const title =\n    subvariant === 'custom'\n      ? t(`header.${subvariantOptions?.custom ?? 'checkout'}`)\n      : subvariant === 'refuel'\n        ? t('header.gas')\n        : subvariant === 'split' && splitTitle\n          ? splitTitle\n          : t('header.exchange')\n\n  useHeader(title)\n\n  const marginSx = { marginBottom: 2 }\n\n  return (\n    <PageContainer>\n      {custom ? (\n        <ContractComponent sx={marginSx}>{contractComponent}</ContractComponent>\n      ) : null}\n      <SelectChainAndToken sx={marginSx} />\n      {!custom || subvariantOptions?.custom === '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":";;;;;;;;;;;;;;;;;;;AAkBA,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,cAAc,gBAAgB;CACpC,MAAM,EAAE,YAAY,mBAAmB,mBAAmB,aACxD,iBAAiB;CACnB,MAAM,SAAS,eAAe;CAC9B,MAAM,gBAAgB,CAAC,UAAU,SAAA,YAA4B;CAC7D,MAAM,uBAAuB,CAAC,UAAU,SAAA,mBAAmC;CAE3E,MAAM,aACJ,mBAAmB,UAAU,WACzB,EAAE,gBAAgB,GAClB,mBAAmB,UAAU,SAC3B,EAAE,cAAc,GAChB,KAAA;AAUR,WARE,eAAe,WACX,EAAE,UAAU,mBAAmB,UAAU,aAAa,GACtD,eAAe,WACb,EAAE,aAAa,GACf,eAAe,WAAW,aACxB,aACA,EAAE,kBAAkB,CAEd;CAEhB,MAAM,WAAW,EAAE,cAAc,GAAG;AAEpC,QACE,qBAAC,eAAD,EAAA,UAAA;EACG,SACC,oBAAC,mBAAD;GAAmB,IAAI;aAAW;GAAsC,CAAA,GACtE;EACJ,oBAAC,qBAAD,EAAqB,IAAI,UAAY,CAAA;EACpC,CAAC,UAAU,mBAAmB,WAAW,YACxC,oBAAC,aAAD;GAAa,UAAS;GAAO,IAAI;GAAY,CAAA,GAC3C;EACH,CAAC,cAAc,oBAAC,QAAD,EAAQ,IAAI,UAAY,CAAA,GAAG;EAC3C,oBAAC,oBAAD,EAAoB,IAAI,UAAY,CAAA;EACnC,uBAAuB,oBAAC,kBAAD,EAAkB,IAAI,UAAY,CAAA,GAAG;EAC7D,oBAAC,qBAAD,EAAqB,IAAI,UAAY,CAAA;EACrC,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,IAAI,gBAAgB,IAAI;IACzB;aAJH,CAME,oBAAC,cAAD,EAAgB,CAAA,EAChB,oBAAC,0BAAD,EAA4B,CAAA,CACxB;;EACL,gBAAgB,oBAAC,WAAD,EAAa,CAAA,GAAG;EACnB,EAAA,CAAA"}

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

@@ -1,5 +1,5 @@
 import { useWidgetEvents } from "../../hooks/useWidgetEvents.js";
-import { WidgetEvent } from "../../types/events.js";
+import "../../types/events.js";
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
 import { navigationRoutes } from "../../utils/navigationRoutes.js";
 import { useSplitSubvariantStore } from "../../stores/settings/useSplitSubvariantStore.js";
@@ -26,7 +26,7 @@ const ReviewButton = () => {
 			to: navigationRoutes.transactionExecution,
 			search: { routeId: currentRoute.id }
 		});
-		emitter.emit(WidgetEvent.RouteSelected, {
+		emitter.emit("routeSelected", {
 			route: currentRoute,
 			routes
 		});

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 { useSplitSubvariantStore } from '../../stores/settings/useSplitSubvariantStore.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 { subvariant, subvariantOptions } = useWidgetConfig()\n  const splitState = useSplitSubvariantStore((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 (subvariant) {\n        case 'custom':\n          return t(`button.${subvariantOptions?.custom ?? '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 (subvariant) {\n      case 'custom':\n        return subvariantOptions?.custom === '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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAC3D,MAAM,aAAa,yBAAyB,UAAU,MAAM,MAAM;CAClE,MAAM,EAAE,WAAW,sBAAsB,0BAA0B;CACnE,MAAM,EAAE,QAAQ,uBAAuB,WAAW;CAElD,MAAM,eAAe,SAAS;CAE9B,MAAM,cAAc,YAAY;AAC9B,MAAI,CAAC,aACH;AAGF,qBAAmB,aAAa;AAChC,WAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,aAAa,IAAI;GACrC,CAAC;AACF,UAAQ,KAAK,YAAY,eAAe;GACtC,OAAO;GACC;GACT,CAAC;;CAGJ,MAAM,sBAA8B;AAClC,MAAI,aACF,SAAQ,YAAR;GACE,KAAK,SACH,QAAO,EAAE,UAAU,mBAAmB,UAAU,WAAW,QAAQ;GACrE,KAAK,SACH,QAAO,EAAE,gBAAgB;GAC3B,QAKE,QAAO,EAAE,UAHP,aAAa,gBAAgB,aAAa,YACtC,SACA,SAC6B,QAAQ;;AAIjD,UAAQ,YAAR;GACE,KAAK,SACH,QAAO,mBAAmB,WAAW,YACjC,EAAE,iBAAiB,GACnB,EAAE,aAAa;GACrB,KAAK,SACH,QAAO,EAAE,gBAAgB;GAC3B,KAAK;AACH,QAAI,WACF,QAAO,EAAE,UAAU,aAAa;AAElC,WAAO,EAAE,kBAAkB;GAC7B,QACE,QAAO,EAAE,kBAAkB;;;AAIjC,QACE,oBAAC,uBAAD;EACE,MAAM,eAAe;EACrB,SAAS;EACT,UAAU,gBAAgB,qBAAqB,CAAC;EAChD,OAAO;EACP,IAAI,EAAE,MAAM,GAAG;EACf,CAAA"}
+{"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 { useSplitSubvariantStore } from '../../stores/settings/useSplitSubvariantStore.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 { subvariant, subvariantOptions } = useWidgetConfig()\n  const splitState = useSplitSubvariantStore((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 (subvariant) {\n        case 'custom':\n          return t(`button.${subvariantOptions?.custom ?? '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 (subvariant) {\n      case 'custom':\n        return subvariantOptions?.custom === '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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,UAAU,iBAAiB;CACjC,MAAM,EAAE,YAAY,sBAAsB,iBAAiB;CAC3D,MAAM,aAAa,yBAAyB,UAAU,MAAM,MAAM;CAClE,MAAM,EAAE,WAAW,sBAAsB,0BAA0B;CACnE,MAAM,EAAE,QAAQ,uBAAuB,WAAW;CAElD,MAAM,eAAe,SAAS;CAE9B,MAAM,cAAc,YAAY;AAC9B,MAAI,CAAC,aACH;AAGF,qBAAmB,aAAa;AAChC,WAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,aAAa,IAAI;GACrC,CAAC;AACF,UAAQ,KAAA,iBAAgC;GACtC,OAAO;GACC;GACT,CAAC;;CAGJ,MAAM,sBAA8B;AAClC,MAAI,aACF,SAAQ,YAAR;GACE,KAAK,SACH,QAAO,EAAE,UAAU,mBAAmB,UAAU,WAAW,QAAQ;GACrE,KAAK,SACH,QAAO,EAAE,gBAAgB;GAC3B,QAKE,QAAO,EAAE,UAHP,aAAa,gBAAgB,aAAa,YACtC,SACA,SAC6B,QAAQ;;AAIjD,UAAQ,YAAR;GACE,KAAK,SACH,QAAO,mBAAmB,WAAW,YACjC,EAAE,iBAAiB,GACnB,EAAE,aAAa;GACrB,KAAK,SACH,QAAO,EAAE,gBAAgB;GAC3B,KAAK;AACH,QAAI,WACF,QAAO,EAAE,UAAU,aAAa;AAElC,WAAO,EAAE,kBAAkB;GAC7B,QACE,QAAO,EAAE,kBAAkB;;;AAIjC,QACE,oBAAC,uBAAD;EACE,MAAM,eAAe;EACrB,SAAS;EACT,UAAU,gBAAgB,qBAAqB,CAAC;EAChD,OAAO;EACP,IAAI,EAAE,MAAM,GAAG;EACf,CAAA"}

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

@@ -1,5 +1,5 @@
 import { useWidgetEvents } from "../../hooks/useWidgetEvents.js";
-import { WidgetEvent } from "../../types/events.js";
+import "../../types/events.js";
 import { navigationRoutes } from "../../utils/navigationRoutes.js";
 import { useFieldValues } from "../../stores/form/useFieldValues.js";
 import { useRoutes } from "../../hooks/useRoutes.js";
@@ -44,7 +44,7 @@ const RoutesPage = () => {
 			to: navigationRoutes.transactionExecution,
 			search: { routeId: route.id }
 		});
-		emitter.emit(WidgetEvent.RouteSelected, {
+		emitter.emit("routeSelected", {
 			route,
 			routes
 		});
@@ -56,7 +56,7 @@ const RoutesPage = () => {
 		className: "long-list",
 		direction: "column",
 		spacing: 2,
-		flex: 1,
+		sx: { flex: 1 },
 		children: routeNotFound ? /* @__PURE__ */ jsx(RouteNotFoundCard, {}) : isLoading && !routes?.length ? Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsx(RouteCardSkeleton, {}, index)) : routes?.map((route, index) => /* @__PURE__ */ jsx(RouteCard, {
 			route,
 			onClick: allowInteraction ? () => handleRouteClick(route) : void 0,

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 className=\"long-list\" direction=\"column\" spacing={2} flex={1}>\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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,UAAU,iBAAiB;CACjC,MAAM,EACJ,QACA,WACA,YACA,eACA,aACA,WACA,SACA,uBACE,WAAW;CACf,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,WAAW,CAAC;CACnE,MAAM,CAAC,aAAa,eAAe,YAAY;CAC/C,MAAM,EAAE,sBAAsB,0BAA0B;CAExD,MAAM,eAAe,cAEjB,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,KAAK;EACtC,cAAc;EACd,WAAW;EACX,eAAe,SAAS;EACxB,IAAI,EAAE,aAAa,IAAI;EACvB,MAAK;EACL,CAAA,EAEJ;EAAC;EAAe;EAAY;EAAS;EAAY,CAClD;AAED,WAAU,EAAE,iBAAiB,EAAE,aAAa;CAE5C,MAAM,oBAAoB,UAAiB;AACzC,qBAAmB,MAAM;AACzB,WAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,IAAI;GAC9B,CAAC;AACF,UAAQ,KAAK,YAAY,eAAe;GACtC;GACQ;GACT,CAAC;;CAGJ,MAAM,gBAAgB,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC;CAExD,MAAM,uBAAuB,SAAS,MAAM,qBAAqB,CAAC;CAElE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;AAEjD,QACE,oBAAC,OAAD;EAAO,WAAU;EAAY,WAAU;EAAS,SAAS;EAAG,MAAM;YAC/D,gBACC,oBAAC,mBAAD,EAAqB,CAAA,GACnB,aAAa,CAAC,QAAQ,SACxB,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,EAAiC,EAAT,MAAS,CACjC,GAEF,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;GAES;GACP,SACE,yBAAyB,iBAAiB,MAAM,GAAG,KAAA;GAErD,QAAQ,UAAU;GAClB,UAAU,QAAQ,WAAW;GAC7B,EAPK,MAOL,CACF;EAEE,CAAA"}
+{"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 }}\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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,UAAU,iBAAiB;CACjC,MAAM,EACJ,QACA,WACA,YACA,eACA,aACA,WACA,SACA,uBACE,WAAW;CACf,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,WAAW,CAAC;CACnE,MAAM,CAAC,aAAa,eAAe,YAAY;CAC/C,MAAM,EAAE,sBAAsB,0BAA0B;CAExD,MAAM,eAAe,cAEjB,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,KAAK;EACtC,cAAc;EACd,WAAW;EACX,eAAe,SAAS;EACxB,IAAI,EAAE,aAAa,IAAI;EACvB,MAAK;EACL,CAAA,EAEJ;EAAC;EAAe;EAAY;EAAS;EAAY,CAClD;AAED,WAAU,EAAE,iBAAiB,EAAE,aAAa;CAE5C,MAAM,oBAAoB,UAAiB;AACzC,qBAAmB,MAAM;AACzB,WAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,IAAI;GAC9B,CAAC;AACF,UAAQ,KAAA,iBAAgC;GACtC;GACQ;GACT,CAAC;;CAGJ,MAAM,gBAAgB,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC;CAExD,MAAM,uBAAuB,SAAS,MAAM,qBAAqB,CAAC;CAElE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;AAEjD,QACE,oBAAC,OAAD;EACE,WAAU;EACV,WAAU;EACV,SAAS;EACT,IAAI,EAAE,MAAM,GAAG;YAEd,gBACC,oBAAC,mBAAD,EAAqB,CAAA,GACnB,aAAa,CAAC,QAAQ,SACxB,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,EAAiC,EAAT,MAAS,CACjC,GAEF,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;GAES;GACP,SACE,yBAAyB,iBAAiB,MAAM,GAAG,KAAA;GAErD,QAAQ,UAAU;GAClB,UAAU,QAAQ,WAAW;GAC7B,EAPK,MAOL,CACF;EAEE,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectChainPage.js","names":[],"sources":["../../../../src/pages/SelectChainPage/SelectChainPage.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainSelect } from '../../components/ChainSelect/useChainSelect.js'\nimport { SelectChainContent } from '../../components/Chains/SelectChainContent.js'\nimport { useTokenSelect } from '../../components/TokenList/useTokenSelect.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport type { SelectChainPageProps } from './types.js'\n\nexport const SelectChainPage: React.FC<SelectChainPageProps> = ({\n  formType,\n  selectNativeToken,\n}) => {\n  const navigateBack = useNavigateBack()\n  const { setCurrentChain } = useChainSelect(formType)\n  const selectToken = useTokenSelect(formType, navigateBack)\n\n  const { t } = useTranslation()\n\n  useHeader(t('header.selectChain'))\n\n  const handleClick = useCallback(\n    async (chain: ExtendedChain) => {\n      if (selectNativeToken) {\n        selectToken(chain.nativeToken.address, chain.id)\n      } else {\n        setCurrentChain(chain.id)\n        navigateBack()\n      }\n    },\n    [navigateBack, selectNativeToken, selectToken, setCurrentChain]\n  )\n\n  return (\n    <SelectChainContent\n      inExpansion={false}\n      formType={formType}\n      onSelect={handleClick}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,MAAa,mBAAmD,EAC9D,UACA,wBACI;CACJ,MAAM,eAAe,iBAAiB;CACtC,MAAM,EAAE,oBAAoB,eAAe,SAAS;CACpD,MAAM,cAAc,eAAe,UAAU,aAAa;CAE1D,MAAM,EAAE,MAAM,gBAAgB;AAE9B,WAAU,EAAE,qBAAqB,CAAC;AAclC,QACE,oBAAC,oBAAD;EACE,aAAa;EACH;EACV,UAhBgB,YAClB,OAAO,UAAyB;AAC9B,OAAI,kBACF,aAAY,MAAM,YAAY,SAAS,MAAM,GAAG;QAC3C;AACL,oBAAgB,MAAM,GAAG;AACzB,kBAAc;;KAGlB;GAAC;GAAc;GAAmB;GAAa;GAAgB,CAChE;EAOG,CAAA"}
+{"version":3,"file":"SelectChainPage.js","names":[],"sources":["../../../../src/pages/SelectChainPage/SelectChainPage.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainSelect } from '../../components/ChainSelect/useChainSelect.js'\nimport { SelectChainContent } from '../../components/Chains/SelectChainContent.js'\nimport { useTokenSelect } from '../../components/TokenList/useTokenSelect.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport type { SelectChainPageProps } from './types.js'\n\nexport const SelectChainPage: React.FC<SelectChainPageProps> = ({\n  formType,\n  selectNativeToken,\n}) => {\n  const navigateBack = useNavigateBack()\n  const { setCurrentChain } = useChainSelect(formType)\n  const selectToken = useTokenSelect(formType, navigateBack)\n\n  const { t } = useTranslation()\n\n  useHeader(t('header.selectChain'))\n\n  const handleClick = useCallback(\n    async (chain: ExtendedChain) => {\n      if (selectNativeToken) {\n        selectToken(chain.nativeToken.address, chain.id)\n      } else {\n        setCurrentChain(chain.id)\n        navigateBack()\n      }\n    },\n    [navigateBack, selectNativeToken, selectToken, setCurrentChain]\n  )\n\n  return (\n    <SelectChainContent\n      inExpansion={false}\n      formType={formType}\n      onSelect={handleClick}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,MAAa,mBAAmD,EAC9D,UACA,wBACI;CACJ,MAAM,eAAe,iBAAiB;CACtC,MAAM,EAAE,oBAAoB,eAAe,SAAS;CACpD,MAAM,cAAc,eAAe,UAAU,aAAa;CAE1D,MAAM,EAAE,MAAM,gBAAgB;AAE9B,WAAU,EAAE,qBAAqB,CAAC;AAclC,QACE,oBAAC,oBAAD;EACE,aAAa;EACH;EACV,UAhBgB,YAClB,OAAO,UAAyB;AAC9B,OAAI,kBACF,aAAY,MAAM,YAAY,SAAS,MAAM,GAAG;QAC3C;AACL,oBAAgB,MAAM,GAAG;AACzB,kBAAc;;KAGlB;GAAC;GAAc;GAAmB;GAAa;GAAgB,CAOxC;EACrB,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent } from 'react'\nimport {\n  type FormEventHandler,\n  memo,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { FullPageContainer } from '../components/FullPageContainer.js'\nimport { StickySearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useDefaultElementId } from '../hooks/useDefaultElementId.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useScrollableContainer } from '../hooks/useScrollableContainer.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 }}\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 elementId = useDefaultElementId()\n  const scrollableContainer = useScrollableContainer(elementId ?? '')\n  const [searchValue, setSearchValue] = useState('')\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: FormEventHandler<HTMLInputElement> =\n    useCallback(\n      (e) => {\n        const value = (e.target as HTMLInputElement).value\n        setSearchValue(value)\n\n        if (scrollableContainer) {\n          scrollableContainer.scrollTop = 0\n        }\n      },\n      [scrollableContainer]\n    )\n\n  const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n  return (\n    <FullPageContainer disableGutters>\n      <StickySearchInput\n        onChange={debouncedSearchInputChange}\n        placeholder={t(`main.search${type}`)}\n      />\n      <Tools filteredTools={filteredTools} type={type} />\n    </FullPageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;AAO9B,QACE,oBAAC,SAAD;EAAS,OAPU,wBACjB,KAAA,IACA,wBACE,EAAE,sBAAsB,GACxB,EAAE,oBAAoB;YAIxB,oBAAC,UAAD;GACE,IAAG;GACH,SAAS;GACT,eAAe,yBAAyB,CAAC;GACzC,UAAU;GACV,UAAU;GACV,IAAI,EAAE,IAAI,MAAM;GAChB,CAAA;EACM,CAAA;EAGf;AAED,MAAa,0BAEP,EAAE,WAAW;CACjB,MAAM,UAAU,KAAK,aAAa;CAClC,MAAM,EAAE,UAAU,UAAU;CAC5B,MAAM,EAAE,mBAAmB,oBAAoB;CAE/C,MAAM,gBAAgB,kBAAkB,UAAU,MAAM,WAAW,QAAQ;CAE3E,MAAM,EAAE,MAAM,gBAAgB;CAE9B,MAAM,sBAAsB,uBADV,qBAAqB,IACyB,GAAG;CACnE,MAAM,CAAC,aAAa,kBAAkB,SAAS,GAAG;CAElD,MAAM,gBAAgB,cAAc;EAClC,MAAM,YAAY,QAAQ,YAAY,EAAE;AAExC,MAAI,CAAC,YACH,QAAO;EAGT,MAAM,mBAAmB,YAAY,aAAa;AAClD,SAAO,UAAU,QAAQ,SACvB,KAAK,KAAK,aAAa,CAAC,SAAS,iBAAiB,CACnD;IACA;EAAC;EAAO;EAAS;EAAY,CAAC;CAEjC,MAAM,kBAAkB,kBAAkB;AACxC,iBACE,MACA,cAAc,KAAK,SAAS,KAAK,IAAI,CACtC;IACA;EAAC;EAAgB;EAAM;EAAc,CAAC;CAEzC,MAAM,eAAe,cAEjB,oBAAC,mBAAD;EACE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,OAAO,SAAS,CAAC,cAAc,SAAS,KAAK,IAAI,CAAC;EAElE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,MAAM,SAAS,cAAc,SAAS,KAAK,IAAI,CAAC;EAEhE,uBAAuB,CAAC,cAAc;EACtC,SAAS;EACT,CAAA,EAEJ;EAAC;EAAe;EAAiB;EAAc,CAChD;AAED,WAAU,EAAE,mBAAmB,OAAO,EAAE,aAAa;AAiBrD,QACE,qBAAC,mBAAD;EAAmB,gBAAA;YAAnB,CACE,oBAAC,mBAAD;GACE,UAL6B,SAZjC,aACG,MAAM;IACL,MAAM,QAAS,EAAE,OAA4B;AAC7C,mBAAe,MAAM;AAErB,QAAI,oBACF,qBAAoB,YAAY;MAGpC,CAAC,oBAAoB,CACtB,EAEkE,IAAI;GAMnE,aAAa,EAAE,cAAc,OAAO;GACpC,CAAA,EACF,oBAAC,OAAD;GAAsB;GAAqB;GAAQ,CAAA,CACjC"}
+{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent } from 'react'\nimport {\n  type FormEventHandler,\n  memo,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { FullPageContainer } from '../components/FullPageContainer.js'\nimport { StickySearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useDefaultElementId } from '../hooks/useDefaultElementId.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useScrollableContainer } from '../hooks/useScrollableContainer.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 }}\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 elementId = useDefaultElementId()\n  const scrollableContainer = useScrollableContainer(elementId ?? '')\n  const [searchValue, setSearchValue] = useState('')\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: FormEventHandler<HTMLInputElement> =\n    useCallback(\n      (e) => {\n        const value = (e.target as HTMLInputElement).value\n        setSearchValue(value)\n\n        if (scrollableContainer) {\n          scrollableContainer.scrollTop = 0\n        }\n      },\n      [scrollableContainer]\n    )\n\n  const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n  return (\n    <FullPageContainer disableGutters>\n      <StickySearchInput\n        onChange={debouncedSearchInputChange}\n        placeholder={t(`main.search${type}`)}\n      />\n      <Tools filteredTools={filteredTools} type={type} />\n    </FullPageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,gBAAgB;AAO9B,QACE,oBAAC,SAAD;EAAS,OAPU,wBACjB,KAAA,IACA,wBACE,EAAE,sBAAsB,GACxB,EAAE,oBAAoB;YAIxB,oBAAC,UAAD;GACE,IAAG;GACH,SAAS;GACT,eAAe,yBAAyB,CAAC;GACzC,UAAU;GACV,UAAU;GACV,IAAI,EAAE,IAAI,MAAM;GAChB,CAAA;EACM,CAAA;EAGf;AAED,MAAa,0BAEP,EAAE,WAAW;CACjB,MAAM,UAAU,KAAK,aAAa;CAClC,MAAM,EAAE,UAAU,UAAU;CAC5B,MAAM,EAAE,mBAAmB,oBAAoB;CAE/C,MAAM,gBAAgB,kBAAkB,UAAU,MAAM,WAAW,QAAQ;CAE3E,MAAM,EAAE,MAAM,gBAAgB;CAE9B,MAAM,sBAAsB,uBADV,qBAC0C,IAAI,GAAG;CACnE,MAAM,CAAC,aAAa,kBAAkB,SAAS,GAAG;CAElD,MAAM,gBAAgB,cAAc;EAClC,MAAM,YAAY,QAAQ,YAAY,EAAE;AAExC,MAAI,CAAC,YACH,QAAO;EAGT,MAAM,mBAAmB,YAAY,aAAa;AAClD,SAAO,UAAU,QAAQ,SACvB,KAAK,KAAK,aAAa,CAAC,SAAS,iBAAiB,CACnD;IACA;EAAC;EAAO;EAAS;EAAY,CAAC;CAEjC,MAAM,kBAAkB,kBAAkB;AACxC,iBACE,MACA,cAAc,KAAK,SAAS,KAAK,IAAI,CACtC;IACA;EAAC;EAAgB;EAAM;EAAc,CAAC;CAEzC,MAAM,eAAe,cAEjB,oBAAC,mBAAD;EACE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,OAAO,SAAS,CAAC,cAAc,SAAS,KAAK,IAAI,CAAC;EAElE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,MAAM,SAAS,cAAc,SAAS,KAAK,IAAI,CAAC;EAEhE,uBAAuB,CAAC,cAAc;EACtC,SAAS;EACT,CAAA,EAEJ;EAAC;EAAe;EAAiB;EAAc,CAChD;AAED,WAAU,EAAE,mBAAmB,OAAO,EAAE,aAAa;AAiBrD,QACE,qBAAC,mBAAD;EAAmB,gBAAA;YAAnB,CACE,oBAAC,mBAAD;GACE,UAL6B,SAZjC,aACG,MAAM;IACL,MAAM,QAAS,EAAE,OAA4B;AAC7C,mBAAe,MAAM;AAErB,QAAI,oBACF,qBAAoB,YAAY;MAGpC,CAAC,oBAAoB,CAG0C,EAAE,IAK3B;GACpC,aAAa,EAAE,cAAc,OAAO;GACpC,CAAA,EACF,oBAAC,OAAD;GAAsB;GAAqB;GAAQ,CAAA,CACjC"}

package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js

@@ -1,5 +1,5 @@
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
-import { HiddenUI } from "../../types/widget.js";
+import "../../types/widget.js";
 import { useSwapOnly } from "../../hooks/useSwapOnly.js";
 import { useScrollableOverflowHidden } from "../../hooks/useScrollableContainer.js";
 import { FullPageContainer } from "../../components/FullPageContainer.js";
@@ -21,9 +21,9 @@ const SelectTokenPage = ({ formType }) => {
 	const wideVariant = useWideVariant();
 	const { t } = useTranslation();
 	useHeader(formType === "from" ? subvariant === "custom" ? t("header.payWith") : t("header.from") : t("header.to"));
-	const hideChainSelect = wideVariant && !subvariantOptions?.wide?.disableChainSidebar || swapOnly && formType === "to" || hiddenUI?.includes(HiddenUI.ChainSelect);
+	const hideChainSelect = wideVariant && !subvariantOptions?.wide?.disableChainSidebar || swapOnly && formType === "to" || hiddenUI?.includes("chainSelect");
 	const isMobile = useMediaQuery((theme) => theme.breakpoints.down(theme.breakpoints.values.xs));
-	const hideSearchTokenInput = hiddenUI?.includes(HiddenUI.SearchTokenInput);
+	const hideSearchTokenInput = hiddenUI?.includes("searchTokenInput");
 	return /* @__PURE__ */ jsxs(FullPageContainer, {
 		disableGutters: true,
 		children: [/* @__PURE__ */ jsxs(Box, {

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

@@ -1 +1 @@
-{"version":3,"file":"SelectTokenPage.js","names":[],"sources":["../../../../src/pages/SelectTokenPage/SelectTokenPage.tsx"],"sourcesContent":["import { Box, type Theme, useMediaQuery } from '@mui/material'\nimport type { FC } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ChainSelect } from '../../components/ChainSelect/ChainSelect.js'\nimport { FullPageContainer } from '../../components/FullPageContainer.js'\nimport { TokenList } from '../../components/TokenList/TokenList.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useScrollableOverflowHidden } from '../../hooks/useScrollableContainer.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { HiddenUI } from '../../types/widget.js'\nimport { SearchTokenInput } from './SearchTokenInput.js'\n\nexport const SelectTokenPage: FC<FormTypeProps> = ({ formType }) => {\n  useScrollableOverflowHidden()\n\n  const headerRef = useRef<HTMLElement>(null)\n\n  const swapOnly = useSwapOnly()\n\n  const { subvariant, hiddenUI, subvariantOptions } = useWidgetConfig()\n  const wideVariant = useWideVariant()\n\n  const { t } = useTranslation()\n  const title =\n    formType === 'from'\n      ? subvariant === 'custom'\n        ? t('header.payWith')\n        : t('header.from')\n      : t('header.to')\n\n  useHeader(title)\n\n  const hideChainSelect =\n    (wideVariant && !subvariantOptions?.wide?.disableChainSidebar) ||\n    (swapOnly && formType === 'to') ||\n    hiddenUI?.includes(HiddenUI.ChainSelect)\n\n  const isMobile = useMediaQuery((theme: Theme) =>\n    theme.breakpoints.down(theme.breakpoints.values.xs)\n  )\n  const hideSearchTokenInput = hiddenUI?.includes(HiddenUI.SearchTokenInput)\n\n  const hasHeader = !hideChainSelect || !hideSearchTokenInput\n\n  return (\n    <FullPageContainer disableGutters>\n      <Box\n        ref={headerRef}\n        sx={{\n          pb: hasHeader ? 2 : 0,\n          px: 3,\n        }}\n      >\n        {!hideChainSelect ? <ChainSelect formType={formType} /> : null}\n        {!hideSearchTokenInput && (\n          <Box\n            sx={{\n              mt: !hideChainSelect ? 2 : 0,\n            }}\n          >\n            <SearchTokenInput formType={formType} />\n          </Box>\n        )}\n      </Box>\n      <TokenList\n        // Rerender component if variant changes (since chains tiles change height)\n        key={\n          hideChainSelect\n            ? 'without-offset'\n            : isMobile\n              ? 'with-offset-mobile'\n              : 'with-offset'\n        }\n        headerRef={headerRef}\n        formType={formType}\n      />\n    </FullPageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAa,mBAAsC,EAAE,eAAe;AAClE,8BAA6B;CAE7B,MAAM,YAAY,OAAoB,KAAK;CAE3C,MAAM,WAAW,aAAa;CAE9B,MAAM,EAAE,YAAY,UAAU,sBAAsB,iBAAiB;CACrE,MAAM,cAAc,gBAAgB;CAEpC,MAAM,EAAE,MAAM,gBAAgB;AAQ9B,WANE,aAAa,SACT,eAAe,WACb,EAAE,iBAAiB,GACnB,EAAE,cAAc,GAClB,EAAE,YAAY,CAEJ;CAEhB,MAAM,kBACH,eAAe,CAAC,mBAAmB,MAAM,uBACzC,YAAY,aAAa,QAC1B,UAAU,SAAS,SAAS,YAAY;CAE1C,MAAM,WAAW,eAAe,UAC9B,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,CACpD;CACD,MAAM,uBAAuB,UAAU,SAAS,SAAS,iBAAiB;AAI1E,QACE,qBAAC,mBAAD;EAAmB,gBAAA;YAAnB,CACE,qBAAC,KAAD;GACE,KAAK;GACL,IAAI;IACF,IAPU,CAAC,mBAAmB,CAAC,uBAOf,IAAI;IACpB,IAAI;IACL;aALH,CAOG,CAAC,kBAAkB,oBAAC,aAAD,EAAuB,UAAY,CAAA,GAAG,MACzD,CAAC,wBACA,oBAAC,KAAD;IACE,IAAI,EACF,IAAI,CAAC,kBAAkB,IAAI,GAC5B;cAED,oBAAC,kBAAD,EAA4B,UAAY,CAAA;IACpC,CAAA,CAEJ;MACN,oBAAC,WAAD;GASa;GACD;GACV,EARE,kBACI,mBACA,WACE,uBACA,cAIR,CACgB"}
+{"version":3,"file":"SelectTokenPage.js","names":[],"sources":["../../../../src/pages/SelectTokenPage/SelectTokenPage.tsx"],"sourcesContent":["import { Box, type Theme, useMediaQuery } from '@mui/material'\nimport type { FC } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ChainSelect } from '../../components/ChainSelect/ChainSelect.js'\nimport { FullPageContainer } from '../../components/FullPageContainer.js'\nimport { TokenList } from '../../components/TokenList/TokenList.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useScrollableOverflowHidden } from '../../hooks/useScrollableContainer.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { HiddenUI } from '../../types/widget.js'\nimport { SearchTokenInput } from './SearchTokenInput.js'\n\nexport const SelectTokenPage: FC<FormTypeProps> = ({ formType }) => {\n  useScrollableOverflowHidden()\n\n  const headerRef = useRef<HTMLElement>(null)\n\n  const swapOnly = useSwapOnly()\n\n  const { subvariant, hiddenUI, subvariantOptions } = useWidgetConfig()\n  const wideVariant = useWideVariant()\n\n  const { t } = useTranslation()\n  const title =\n    formType === 'from'\n      ? subvariant === 'custom'\n        ? t('header.payWith')\n        : t('header.from')\n      : t('header.to')\n\n  useHeader(title)\n\n  const hideChainSelect =\n    (wideVariant && !subvariantOptions?.wide?.disableChainSidebar) ||\n    (swapOnly && formType === 'to') ||\n    hiddenUI?.includes(HiddenUI.ChainSelect)\n\n  const isMobile = useMediaQuery((theme: Theme) =>\n    theme.breakpoints.down(theme.breakpoints.values.xs)\n  )\n  const hideSearchTokenInput = hiddenUI?.includes(HiddenUI.SearchTokenInput)\n\n  const hasHeader = !hideChainSelect || !hideSearchTokenInput\n\n  return (\n    <FullPageContainer disableGutters>\n      <Box\n        ref={headerRef}\n        sx={{\n          pb: hasHeader ? 2 : 0,\n          px: 3,\n        }}\n      >\n        {!hideChainSelect ? <ChainSelect formType={formType} /> : null}\n        {!hideSearchTokenInput && (\n          <Box\n            sx={{\n              mt: !hideChainSelect ? 2 : 0,\n            }}\n          >\n            <SearchTokenInput formType={formType} />\n          </Box>\n        )}\n      </Box>\n      <TokenList\n        // Rerender component if variant changes (since chains tiles change height)\n        key={\n          hideChainSelect\n            ? 'without-offset'\n            : isMobile\n              ? 'with-offset-mobile'\n              : 'with-offset'\n        }\n        headerRef={headerRef}\n        formType={formType}\n      />\n    </FullPageContainer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAa,mBAAsC,EAAE,eAAe;AAClE,8BAA6B;CAE7B,MAAM,YAAY,OAAoB,KAAK;CAE3C,MAAM,WAAW,aAAa;CAE9B,MAAM,EAAE,YAAY,UAAU,sBAAsB,iBAAiB;CACrE,MAAM,cAAc,gBAAgB;CAEpC,MAAM,EAAE,MAAM,gBAAgB;AAQ9B,WANE,aAAa,SACT,eAAe,WACb,EAAE,iBAAiB,GACnB,EAAE,cAAc,GAClB,EAAE,YAAY,CAEJ;CAEhB,MAAM,kBACH,eAAe,CAAC,mBAAmB,MAAM,uBACzC,YAAY,aAAa,QAC1B,UAAU,SAAA,cAA8B;CAE1C,MAAM,WAAW,eAAe,UAC9B,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,GAAG,CACpD;CACD,MAAM,uBAAuB,UAAU,SAAA,mBAAmC;AAI1E,QACE,qBAAC,mBAAD;EAAmB,gBAAA;YAAnB,CACE,qBAAC,KAAD;GACE,KAAK;GACL,IAAI;IACF,IAPU,CAAC,mBAAmB,CAAC,uBAOf,IAAI;IACpB,IAAI;IACL;aALH,CAOG,CAAC,kBAAkB,oBAAC,aAAD,EAAuB,UAAY,CAAA,GAAG,MACzD,CAAC,wBACA,oBAAC,KAAD;IACE,IAAI,EACF,IAAI,CAAC,kBAAkB,IAAI,GAC5B;cAED,oBAAC,kBAAD,EAA4B,UAAY,CAAA;IACpC,CAAA,CAEJ;MACN,oBAAC,WAAD;GASa;GACD;GACV,EARE,kBACI,mBACA,WACE,uBACA,cAIR,CACgB"}

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

@@ -22,7 +22,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 import ContentCopyRounded from "@mui/icons-material/ContentCopyRounded";
 import OpenInNewRounded from "@mui/icons-material/OpenInNewRounded";
-import DeleteOutline from "@mui/icons-material/DeleteOutline";
+import DeleteOutline from "@mui/icons-material/DeleteOutlined";
 import TurnedIn from "@mui/icons-material/TurnedIn";
 //#region src/pages/SendToWallet/BookmarksPage.tsx
 const BookmarksPage = () => {