npm - @lifi/widget - Versions diffs - 4.7.0 → 4.7.1 - Mend

@lifi/widget 4.7.0 → 4.7.1

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

Files changed (37) hide show

package/dist/esm/config/version.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 //#region src/config/version.d.ts
 export declare const name = "@lifi/widget";
-export declare const version = "4.7.0";
+export declare const version = "4.7.1";
 //#endregion
 //# sourceMappingURL=version.d.ts.map

package/dist/esm/config/version.js CHANGED Viewed

@@ -1,6 +1,6 @@
 //#region src/config/version.ts
 const name = "@lifi/widget";
-const version = "4.7.0";
+const version = "4.7.1";
 //#endregion
 export { name, version };

package/dist/esm/config/version.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"version.js","names":[],"sources":["../../../src/config/version.ts"],"sourcesContent":["export const name = '@lifi/widget'\nexport const version = '4.7.0'\n"],"mappings":";AAAA,MAAa,OAAO;AACpB,MAAa,UAAU"}
1	+ {"version":3,"file":"version.js","names":[],"sources":["../../../src/config/version.ts"],"sourcesContent":["export const name = '@lifi/widget'\nexport const version = '4.7.1'\n"],"mappings":";AAAA,MAAa,OAAO;AACpB,MAAa,UAAU"}

package/dist/esm/hooks/useExplorer.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ type TransactionLinkProps = {
 };
 export declare const useExplorer: () => {
   getTransactionLink: (props: TransactionLinkProps) => string | undefined;
-  getAddressLink: (address: string, chain?: Chain | number) => string;
+  getAddressLink: (address: string, chain?: Chain | number) => string | undefined;
 };
 //#endregion
 //# sourceMappingURL=useExplorer.d.ts.map

package/dist/esm/hooks/useExplorer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useExplorer.d.ts","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"mappings":";;~~KAmBK~~;EACH,QAAQ;EACR;EACA;;qBAGW;EACX,qBAAqB,OAAO;EAC5B,~~iBAAiB~~,~~iBAAiB~~,QAAQ"}
1	+ {"version":3,"file":"useExplorer.d.ts","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"mappings":";;KAoBK;EACH,QAAQ;EACR;EACA;;qBAGW;EACX,qBAAqB,OAAO;EAC5B,iBACE,iBACA,QAAQ"}

package/dist/esm/hooks/useExplorer.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { useWidgetConfig } from "../providers/WidgetProvider/WidgetProvider.js";
 import "../config/constants.js";
 import { useAvailableChains } from "./useAvailableChains.js";
+import { isHttpUrl } from "../utils/url.js";
 import { ChainId, ChainType, isHex } from "@lifi/sdk";
 import { useCallback } from "react";
 //#region src/hooks/useExplorer.ts
@@ -47,13 +48,16 @@ const useExplorer = () => {
 		getTransactionLink: useCallback(({ txHash, txLink, chain }) => {
 			if (txHash) {
 				const config = getExplorerConfig(chain);
-				if (config.resolvedChain?.chainType !== ChainType.EVM || config.hasOverride || isHex(txHash, { strict: true })) return `${config.url}/${config.txPath}/${txHash}`;
+				const validForEvm = config.resolvedChain?.chainType !== ChainType.EVM || config.hasOverride || isHex(txHash, { strict: true });
+				const link = `${config.url}/${config.txPath}/${txHash}`;
+				if (validForEvm && isHttpUrl(link)) return link;
 			}
-			return txLink;
+			return isHttpUrl(txLink) ? txLink : void 0;
 		}, [getExplorerConfig]),
 		getAddressLink: useCallback((address, chain) => {
 			const config = getExplorerConfig(chain);
-			return `${config.url}/${config.addressPath}/${address}`;
+			const link = `${config.url}/${config.addressPath}/${address}`;
+			return isHttpUrl(link) ? link : void 0;
 		}, [getExplorerConfig])
 	};
 };

package/dist/esm/hooks/useExplorer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useExplorer.js","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"sourcesContent":["import type { Chain } from '@lifi/sdk'\nimport { ChainId, ChainType, isHex } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { internalExplorerUrl } from '../config/constants.js'\nimport { useAvailableChains } from '../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\n\nconst sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\\/+$/, '')\n\nconst explorerPathOverrides: Partial<\n Record<ChainType \| ChainId, { txPath: string; addressPath: string }>\n> = {\n [ChainId.SUI]: { txPath: 'txblock', addressPath: 'coin' },\n [ChainId.LTR]: { txPath: 'logs', addressPath: 'accounts' },\n [ChainType.TVM]: { txPath: '#/transaction', addressPath: '#/address' },\n // StellarExpert and steexp both route accounts at /account, never /address.\n [ChainType.STL]: { txPath: 'tx', addressPath: 'account' },\n}\n\ntype TransactionLinkProps = {\n chain?: Chain \| number\n txHash?: string\n txLink?: string\n}\n\nexport const useExplorer = (): {\n getTransactionLink: (props: TransactionLinkProps) => string \| undefined\n getAddressLink: (address: string, chain?: Chain \| number) => string\n} => {\n const { explorerUrls } = useWidgetConfig()\n const { getChainById } = useAvailableChains()\n\n const getExplorerConfig = useCallback(\n (chain?: Chain \| number) => {\n const resolvedChain = Number.isFinite(chain)\n ? getChainById(chain as number)\n : (chain as Chain)\n\n const explorerUrl =\n (resolvedChain\n ? (explorerUrls?.[resolvedChain.id]?.[0] ??\n resolvedChain.metamask.blockExplorerUrls[0])\n : explorerUrls?.internal?.[0]) \|\| internalExplorerUrl\n\n const baseUrl =\n typeof explorerUrl === 'string' ? explorerUrl : explorerUrl.url\n\n const overrides =\n explorerPathOverrides[resolvedChain?.id as ChainId] ??\n explorerPathOverrides[resolvedChain?.chainType as ChainType]\n\n const defaultTxPath = overrides?.txPath ?? 'tx'\n const defaultAddressPath = overrides?.addressPath ?? 'address'\n const txPath =\n typeof explorerUrl === 'string'\n ? defaultTxPath\n : explorerUrl.txPath \|\| defaultTxPath\n const addressPath =\n typeof explorerUrl === 'string'\n ? defaultAddressPath\n : explorerUrl.addressPath \|\| defaultAddressPath\n\n return {\n url: sanitiseBaseUrl(baseUrl),\n txPath,\n addressPath,\n resolvedChain,\n hasOverride: Boolean(overrides),\n }\n },\n [explorerUrls, getChainById]\n )\n\n const getTransactionLink = useCallback(\n ({ txHash, txLink, chain }: TransactionLinkProps): string \| undefined => {\n if (txHash) {\n const config = getExplorerConfig(chain)\n // For EVM chains, sanity-check the transaction hash as some relayers return custom task hashes that are not visible on-chain.\n // Skip the check when a chain-specific path override is registered — that's an explicit signal the chain's\n // explorer accepts a non-hex hash (e.g. Lighter, whose hash has no 0x prefix).\n const validForEvm =\n config.resolvedChain?.chainType !== ChainType.EVM \|\|\n config.hasOverride \|\|\n isHex(txHash, { strict: true })\n if ~~(validForEvm)~~ ~~{\n return~~ `${config.url}/${config.txPath}/${txHash}`\n }\n }\n return txLink\n },\n [getExplorerConfig]\n )\n\n const getAddressLink = useCallback(\n (address: string, chain?: Chain \| number) => {\n const config = getExplorerConfig(chain)\n ~~return~~ `${config.url}/${config.addressPath}/${address}`\n },\n [getExplorerConfig]\n )\n\n return {\n getTransactionLink,\n getAddressLink,\n }\n}\n"],"mappings":"~~;;;;;;AAOA~~,MAAM,mBAAmB,YAAoB,QAAQ,KAAK,CAAC,CAAC,QAAQ,QAAQ,EAAE;AAE9E,MAAM,wBAEF;EACD,QAAQ,MAAM;EAAE,QAAQ;EAAW,aAAa;CAAO;EACvD,QAAQ,MAAM;EAAE,QAAQ;EAAQ,aAAa;CAAW;EACxD,UAAU,MAAM;EAAE,QAAQ;EAAiB,aAAa;CAAY;EAEpE,UAAU,MAAM;EAAE,QAAQ;EAAM,aAAa;CAAU;AAC1D;AAQA,MAAa,~~oBAGR~~;CACH,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,iBAAiB,mBAAmB;CAE5C,MAAM,oBAAoB,aACvB,UAA2B;EAC1B,MAAM,gBAAgB,OAAO,SAAS,KAAK,IACvC,aAAa,KAAe,IAC3B;EAEL,MAAM,eACH,gBACI,eAAe,cAAc,GAAG,GAAG,MACpC,cAAc,SAAS,kBAAkB,KACzC,cAAc,WAAW,OAAA;EAE/B,MAAM,UACJ,OAAO,gBAAgB,WAAW,cAAc,YAAY;EAE9D,MAAM,YACJ,sBAAsB,eAAe,OACrC,sBAAsB,eAAe;EAEvC,MAAM,gBAAgB,WAAW,UAAU;EAC3C,MAAM,qBAAqB,WAAW,eAAe;EACrD,MAAM,SACJ,OAAO,gBAAgB,WACnB,gBACA,YAAY,UAAU;EAC5B,MAAM,cACJ,OAAO,gBAAgB,WACnB,qBACA,YAAY,eAAe;EAEjC,OAAO;GACL,KAAK,gBAAgB,OAAO;GAC5B;GACA;GACA;GACA,aAAa,QAAQ,SAAS;EAChC;CACF,GACA,CAAC,cAAc,YAAY,CAC7B;~~CA8BA~~,OAAO;EACL,~~oBA7ByB~~,aACxB,EAAE,QAAQ,QAAQ,YAAsD;GACvE,IAAI,QAAQ;IACV,MAAM,SAAS,kBAAkB,KAAK;~~IAQtC~~,~~IAHE~~,OAAO,eAAe,cAAc,UAAU,OAC9C,OAAO,eACP,MAAM,QAAQ,EAAE,QAAQ,KAAK,CAAC,~~GAE9B~~,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,OAAO,GAAG;~~GAE7C~~;GACA,OAAO;~~EACT~~,GACA,CAAC,iBAAiB,~~CAYD~~;EACjB,~~gBAVqB~~,aACpB,SAAiB,UAA2B;GAC3C,MAAM,SAAS,kBAAkB,KAAK;GACtC,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,YAAY,GAAG;~~EAChD~~,GACA,CAAC,iBAAiB,CAKL;CACf;AACF"}
1	+ {"version":3,"file":"useExplorer.js","names":[],"sources":["../../../src/hooks/useExplorer.ts"],"sourcesContent":["import type { Chain } from '@lifi/sdk'\nimport { ChainId, ChainType, isHex } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { internalExplorerUrl } from '../config/constants.js'\nimport { useAvailableChains } from '../hooks/useAvailableChains.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { isHttpUrl } from '../utils/url.js'\n\nconst sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\\/+$/, '')\n\nconst explorerPathOverrides: Partial<\n Record<ChainType \| ChainId, { txPath: string; addressPath: string }>\n> = {\n [ChainId.SUI]: { txPath: 'txblock', addressPath: 'coin' },\n [ChainId.LTR]: { txPath: 'logs', addressPath: 'accounts' },\n [ChainType.TVM]: { txPath: '#/transaction', addressPath: '#/address' },\n // StellarExpert and steexp both route accounts at /account, never /address.\n [ChainType.STL]: { txPath: 'tx', addressPath: 'account' },\n}\n\ntype TransactionLinkProps = {\n chain?: Chain \| number\n txHash?: string\n txLink?: string\n}\n\nexport const useExplorer = (): {\n getTransactionLink: (props: TransactionLinkProps) => string \| undefined\n getAddressLink: (\n address: string,\n chain?: Chain \| number\n ) => string \| undefined\n} => {\n const { explorerUrls } = useWidgetConfig()\n const { getChainById } = useAvailableChains()\n\n const getExplorerConfig = useCallback(\n (chain?: Chain \| number) => {\n const resolvedChain = Number.isFinite(chain)\n ? getChainById(chain as number)\n : (chain as Chain)\n\n const explorerUrl =\n (resolvedChain\n ? (explorerUrls?.[resolvedChain.id]?.[0] ??\n resolvedChain.metamask.blockExplorerUrls[0])\n : explorerUrls?.internal?.[0]) \|\| internalExplorerUrl\n\n const baseUrl =\n typeof explorerUrl === 'string' ? explorerUrl : explorerUrl.url\n\n const overrides =\n explorerPathOverrides[resolvedChain?.id as ChainId] ??\n explorerPathOverrides[resolvedChain?.chainType as ChainType]\n\n const defaultTxPath = overrides?.txPath ?? 'tx'\n const defaultAddressPath = overrides?.addressPath ?? 'address'\n const txPath =\n typeof explorerUrl === 'string'\n ? defaultTxPath\n : explorerUrl.txPath \|\| defaultTxPath\n const addressPath =\n typeof explorerUrl === 'string'\n ? defaultAddressPath\n : explorerUrl.addressPath \|\| defaultAddressPath\n\n return {\n url: sanitiseBaseUrl(baseUrl),\n txPath,\n addressPath,\n resolvedChain,\n hasOverride: Boolean(overrides),\n }\n },\n [explorerUrls, getChainById]\n )\n\n const getTransactionLink = useCallback(\n ({ txHash, txLink, chain }: TransactionLinkProps): string \| undefined => {\n if (txHash) {\n const config = getExplorerConfig(chain)\n // For EVM chains, sanity-check the transaction hash as some relayers return custom task hashes that are not visible on-chain.\n // Skip the check when a chain-specific path override is registered — that's an explicit signal the chain's\n // explorer accepts a non-hex hash (e.g. Lighter, whose hash has no 0x prefix).\n const validForEvm =\n config.resolvedChain?.chainType !== ChainType.EVM \|\|\n config.hasOverride \|\|\n isHex(txHash, { strict: true })\n const link = `${config.url}/${config.txPath}/${txHash}`\n if (validForEvm && isHttpUrl(link)) {\n return link\n }\n }\n return isHttpUrl(txLink) ? txLink : undefined\n },\n [getExplorerConfig]\n )\n\n const getAddressLink = useCallback(\n (address: string, chain?: Chain \| number) => {\n const config = getExplorerConfig(chain)\n const link = `${config.url}/${config.addressPath}/${address}`\n return isHttpUrl(link) ? link : undefined\n },\n [getExplorerConfig]\n )\n\n return {\n getTransactionLink,\n getAddressLink,\n }\n}\n"],"mappings":";;;;;;;AAQA,MAAM,mBAAmB,YAAoB,QAAQ,KAAK,CAAC,CAAC,QAAQ,QAAQ,EAAE;AAE9E,MAAM,wBAEF;EACD,QAAQ,MAAM;EAAE,QAAQ;EAAW,aAAa;CAAO;EACvD,QAAQ,MAAM;EAAE,QAAQ;EAAQ,aAAa;CAAW;EACxD,UAAU,MAAM;EAAE,QAAQ;EAAiB,aAAa;CAAY;EAEpE,UAAU,MAAM;EAAE,QAAQ;EAAM,aAAa;CAAU;AAC1D;AAQA,MAAa,oBAMR;CACH,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,EAAE,iBAAiB,mBAAmB;CAE5C,MAAM,oBAAoB,aACvB,UAA2B;EAC1B,MAAM,gBAAgB,OAAO,SAAS,KAAK,IACvC,aAAa,KAAe,IAC3B;EAEL,MAAM,eACH,gBACI,eAAe,cAAc,GAAG,GAAG,MACpC,cAAc,SAAS,kBAAkB,KACzC,cAAc,WAAW,OAAA;EAE/B,MAAM,UACJ,OAAO,gBAAgB,WAAW,cAAc,YAAY;EAE9D,MAAM,YACJ,sBAAsB,eAAe,OACrC,sBAAsB,eAAe;EAEvC,MAAM,gBAAgB,WAAW,UAAU;EAC3C,MAAM,qBAAqB,WAAW,eAAe;EACrD,MAAM,SACJ,OAAO,gBAAgB,WACnB,gBACA,YAAY,UAAU;EAC5B,MAAM,cACJ,OAAO,gBAAgB,WACnB,qBACA,YAAY,eAAe;EAEjC,OAAO;GACL,KAAK,gBAAgB,OAAO;GAC5B;GACA;GACA;GACA,aAAa,QAAQ,SAAS;EAChC;CACF,GACA,CAAC,cAAc,YAAY,CAC7B;CAgCA,OAAO;EACL,oBA/ByB,aACxB,EAAE,QAAQ,QAAQ,YAAsD;GACvE,IAAI,QAAQ;IACV,MAAM,SAAS,kBAAkB,KAAK;IAItC,MAAM,cACJ,OAAO,eAAe,cAAc,UAAU,OAC9C,OAAO,eACP,MAAM,QAAQ,EAAE,QAAQ,KAAK,CAAC;IAChC,MAAM,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,OAAO,GAAG;IAC/C,IAAI,eAAe,UAAU,IAAI,GAC/B,OAAO;GAEX;GACA,OAAO,UAAU,MAAM,IAAI,SAAS,KAAA;EACtC,GACA,CAAC,iBAAiB,CAaD;EACjB,gBAXqB,aACpB,SAAiB,UAA2B;GAC3C,MAAM,SAAS,kBAAkB,KAAK;GACtC,MAAM,OAAO,GAAG,OAAO,IAAI,GAAG,OAAO,YAAY,GAAG;GACpD,OAAO,UAAU,IAAI,IAAI,OAAO,KAAA;EAClC,GACA,CAAC,iBAAiB,CAKL;CACf;AACF"}

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

@@ -6,6 +6,7 @@ import { PageContainer } from "../../components/PageContainer.js";
 import { defaultChainIdsByType } from "../../utils/chainType.js";
 import { useToAddressRequirements } from "../../hooks/useToAddressRequirements.js";
 import { shortenAddress } from "../../utils/wallet.js";
+import { openInNewTab } from "../../utils/url.js";
 import { useExplorer } from "../../hooks/useExplorer.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { useListHeight } from "../../hooks/useListHeight.js";
@@ -88,7 +89,7 @@ const BookmarksPage = () => {
 							{
 								icon: /* @__PURE__ */ jsx(OpenInNewRounded, {}),
 								label: t("button.viewOnExplorer"),
-								onClick: () => window.open(getAddressLink(bookmark.address, defaultChainIdsByType[bookmark.chainType]), "_blank")
+								onClick: () => openInNewTab(getAddressLink(bookmark.address, defaultChainIdsByType[bookmark.chainType]))
 							},
 							{
 								icon: /* @__PURE__ */ jsx(DeleteOutline, {}),

package/dist/esm/pages/SendToWallet/BookmarksPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BookmarksPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/BookmarksPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport { Button, List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { BookmarkButtonContainer } from './SendToWalletPage.style.js'\n\nexport const BookmarksPage = (): JSX.Element => {\n const { t } = useTranslation()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n const buttonRef = useRef<HTMLDivElement \| null>(null)\n const { bookmarks } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const { addBookmark, removeBookmark, setSelectedBookmark } =\n useBookmarkActions()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.bookmarkedWallets'))\n\n const { listHeight } = useListHeight({\n listParentRef,\n headerRef: buttonRef,\n })\n\n const handleAddBookmark = () => {\n bookmarkAddressSheetRef.current?.open()\n }\n\n const handleBookmarkSelected = (bookmark: Bookmark) => {\n setFieldValue('toAddress', bookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(bookmark)\n navigate({ to: navigationRoutes.home, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {bookmarks.map((bookmark) => (\n <ListItem key={bookmark.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleBookmarkSelected(bookmark)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[bookmark.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={bookmark.name}\n secondary={shortenAddress(bookmark.address)}\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(bookmark.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n ~~window.open~~(\n getAddressLink(\n bookmark.address,\n defaultChainIdsByType[bookmark.chainType]\n )~~,\n '_blank'~~\n ),\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeBookmark(bookmark.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!bookmarks.length && (\n <EmptyListIndicator\n icon={<TurnedIn />}\n title={t('sendToWallet.noBookmarkedWallets')}\n message={t('sendToWallet.noBookmarkedWalletsMessage')}\n />\n )}\n </List>\n <BookmarkButtonContainer ref={buttonRef}>\n <Button variant=\"contained\" onClick={handleAddBookmark}>\n {t('sendToWallet.addBookmark')}\n </Button>\n </BookmarkButtonContainer>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n onAddBookmark={addBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA~~,MAAa,sBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,cAAc,aAAa;CACnC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,aAAa,gBAAgB,wBACnC,mBAAmB;CACrB,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,0BAA0B,CAAC;CAEvC,MAAM,EAAE,eAAe,cAAc;EACnC;EACA,WAAW;CACb,CAAC;CAED,MAAM,0BAA0B;EAC9B,wBAAwB,SAAS,KAAK;CACxC;CAEA,MAAM,0BAA0B,aAAuB;EACrD,cAAc,aAAa,SAAS,SAAS;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,QAAQ;EAC5B,SAAS;GAAE,IAAI,iBAAiB;GAAM,SAAS;EAAK,CAAC;CACvD;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA;GACE,qBAAC,MAAD;IACE,WAAU;IACV,KAAK;IACL,OAAO;KAAE,QAAQ;KAAY,UAAU;IAAO;IAC9C,gBAAA;IACA,IAAI,EAAE,YAAY,IAAI;IALxB,UAAA,CAOG,UAAU,KAAK,aACd,qBAACA,YAAD;KAAiC,IAAI,EAAE,UAAU,WAAW;KAA5D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,uBAAuB,QAAQ;MAC9C,UACE,uBACA,wBAAwB,SAAS;MAJrC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,SAAS,WACzC,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,SAAS;OAClB,WAAW,eAAe,SAAS,OAAO;MAC3C,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,UACE,CAAC,EACC,uBACA,wBAAwB,SAAS;MAGrC,OAAO;OACL;QACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;QAC3B,OAAO,EAAE,oBAAoB;QAC7B,eACE,UAAU,UAAU,UAAU,SAAS,OAAO;OAClD;OACA;QACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;QACzB,OAAO,EAAE,uBAAuB;QAChC,eACE,~~OAAO~~,~~KACL,~~eACE,SAAS,SACT,sBAAsB,SAAS,UACjC,~~GACA,QACF~~;OACJ;OACA;QACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;QACtB,OAAO,EAAE,eAAe;QACxB,eAAe,eAAe,SAAS,OAAO;OAChD;MACF;KACD,CAAA,CACO;~~IAnDK~~,GAAA,SAAS,~~OAmDd~~,CACX,GACA,CAAC,UAAU,UACV,oBAAC,oBAAD;KACE,MAAM,oBAAC,UAAD,CAAW,CAAA;KACjB,OAAO,EAAE,kCAAkC;KAC3C,SAAS,EAAE,yCAAyC;IACrD,CAAA,CAEC;;GACN,oBAAC,yBAAD;IAAyB,KAAK;IAC5B,UAAA,oBAAC,QAAD;KAAQ,SAAQ;KAAY,SAAS;KAClC,UAAA,EAAE,0BAA0B;IACvB,CAAA;GACe,CAAA;GACzB,oBAAC,sBAAD;IACE,KAAK;IACL,eAAe;GAChB,CAAA;EACY;;AAEnB"}
1	+ {"version":3,"file":"BookmarksPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/BookmarksPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport { Button, List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { openInNewTab } from '../../utils/url.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { BookmarkButtonContainer } from './SendToWalletPage.style.js'\n\nexport const BookmarksPage = (): JSX.Element => {\n const { t } = useTranslation()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n const buttonRef = useRef<HTMLDivElement \| null>(null)\n const { bookmarks } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const { addBookmark, removeBookmark, setSelectedBookmark } =\n useBookmarkActions()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.bookmarkedWallets'))\n\n const { listHeight } = useListHeight({\n listParentRef,\n headerRef: buttonRef,\n })\n\n const handleAddBookmark = () => {\n bookmarkAddressSheetRef.current?.open()\n }\n\n const handleBookmarkSelected = (bookmark: Bookmark) => {\n setFieldValue('toAddress', bookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(bookmark)\n navigate({ to: navigationRoutes.home, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {bookmarks.map((bookmark) => (\n <ListItem key={bookmark.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleBookmarkSelected(bookmark)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[bookmark.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={bookmark.name}\n secondary={shortenAddress(bookmark.address)}\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(bookmark.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n openInNewTab(\n getAddressLink(\n bookmark.address,\n defaultChainIdsByType[bookmark.chainType]\n )\n ),\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeBookmark(bookmark.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!bookmarks.length && (\n <EmptyListIndicator\n icon={<TurnedIn />}\n title={t('sendToWallet.noBookmarkedWallets')}\n message={t('sendToWallet.noBookmarkedWalletsMessage')}\n />\n )}\n </List>\n <BookmarkButtonContainer ref={buttonRef}>\n <Button variant=\"contained\" onClick={handleAddBookmark}>\n {t('sendToWallet.addBookmark')}\n </Button>\n </BookmarkButtonContainer>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n onAddBookmark={addBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAa,sBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,cAAc,aAAa;CACnC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,aAAa,gBAAgB,wBACnC,mBAAmB;CACrB,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,0BAA0B,CAAC;CAEvC,MAAM,EAAE,eAAe,cAAc;EACnC;EACA,WAAW;CACb,CAAC;CAED,MAAM,0BAA0B;EAC9B,wBAAwB,SAAS,KAAK;CACxC;CAEA,MAAM,0BAA0B,aAAuB;EACrD,cAAc,aAAa,SAAS,SAAS;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,QAAQ;EAC5B,SAAS;GAAE,IAAI,iBAAiB;GAAM,SAAS;EAAK,CAAC;CACvD;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA;GACE,qBAAC,MAAD;IACE,WAAU;IACV,KAAK;IACL,OAAO;KAAE,QAAQ;KAAY,UAAU;IAAO;IAC9C,gBAAA;IACA,IAAI,EAAE,YAAY,IAAI;IALxB,UAAA,CAOG,UAAU,KAAK,aACd,qBAACA,YAAD;KAAiC,IAAI,EAAE,UAAU,WAAW;KAA5D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,uBAAuB,QAAQ;MAC9C,UACE,uBACA,wBAAwB,SAAS;MAJrC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,SAAS,WACzC,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,SAAS;OAClB,WAAW,eAAe,SAAS,OAAO;MAC3C,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,UACE,CAAC,EACC,uBACA,wBAAwB,SAAS;MAGrC,OAAO;OACL;QACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;QAC3B,OAAO,EAAE,oBAAoB;QAC7B,eACE,UAAU,UAAU,UAAU,SAAS,OAAO;OAClD;OACA;QACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;QACzB,OAAO,EAAE,uBAAuB;QAChC,eACE,aACE,eACE,SAAS,SACT,sBAAsB,SAAS,UACjC,CACF;OACJ;OACA;QACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;QACtB,OAAO,EAAE,eAAe;QACxB,eAAe,eAAe,SAAS,OAAO;OAChD;MACF;KACD,CAAA,CACO;IAlDK,GAAA,SAAS,OAkDd,CACX,GACA,CAAC,UAAU,UACV,oBAAC,oBAAD;KACE,MAAM,oBAAC,UAAD,CAAW,CAAA;KACjB,OAAO,EAAE,kCAAkC;KAC3C,SAAS,EAAE,yCAAyC;IACrD,CAAA,CAEC;;GACN,oBAAC,yBAAD;IAAyB,KAAK;IAC5B,UAAA,oBAAC,QAAD;KAAQ,SAAQ;KAAY,SAAS;KAClC,UAAA,EAAE,0BAA0B;IACvB,CAAA;GACe,CAAA;GACzB,oBAAC,sBAAD;IACE,KAAK;IACL,eAAe;GAChB,CAAA;EACY;;AAEnB"}

package/dist/esm/pages/SendToWallet/ConnectedWalletsPage.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { useFieldActions } from "../../stores/form/useFieldActions.js";
 import { PageContainer } from "../../components/PageContainer.js";
 import { useToAddressRequirements } from "../../hooks/useToAddressRequirements.js";
 import { shortenAddress } from "../../utils/wallet.js";
+import { openInNewTab } from "../../utils/url.js";
 import { useExplorer } from "../../hooks/useExplorer.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { useListHeight } from "../../hooks/useListHeight.js";
@@ -72,7 +73,7 @@ const ConnectedWalletsPage = () => {
 					icon: /* @__PURE__ */ jsx(OpenInNewRounded, {}),
 					label: t("button.viewOnExplorer"),
 					onClick: () => {
-						if (account.address) window.open(getAddressLink(account.address, account.chainId), "_blank");
+						if (account.address) openInNewTab(getAddressLink(account.address, account.chainId));
 					}
 				}] : []];
 				return /* @__PURE__ */ jsxs(ListItem$1, {

package/dist/esm/pages/SendToWallet/ConnectedWalletsPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConnectedWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/ConnectedWalletsPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const ConnectedWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { accounts } = useAccount()\n const { setSelectedBookmark } = useBookmarkActions()\n const { requiredToChainType } = useToAddressRequirements()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n\n useHeader(t('sendToWallet.connectedWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleWalletSelected = (account: Account) => {\n setFieldValue('toAddress', account.address!, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark({\n name: account.connector?.name,\n address: account.address!,\n chainType: account.chainType!,\n isConnectedAccount: true,\n })\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {accounts.map((account) => {\n const walletAddress = shortenAddress(account.address)\n const menuItems = [\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () => {\n if (account.address) {\n navigator.clipboard.writeText(account.address)\n }\n },\n },\n ...(account.chainId\n ? [\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () => {\n if (account.address) {\n ~~window.open~~(\n getAddressLink(account.address, account.chainId)~~,\n '_blank'~~\n )\n }\n },\n },\n ]\n : []),\n ]\n\n return (\n <ListItem key={account.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleWalletSelected(account)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== account.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar chainId={account.chainId} account={account} />\n </ListItemAvatar>\n <ListItemText\n primary={account.connector?.name}\n secondary={walletAddress}\n />\n </ListItemButton>\n <ContextMenu\n items={menuItems}\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== account.chainType\n )\n }\n />\n </ListItem>\n )\n })}\n {!accounts.length && (\n <EmptyListIndicator\n icon={<Wallet />}\n title={t('sendToWallet.noConnectedWallets')}\n message={t('sendToWallet.noConnectedWalletsMessage')}\n />\n )}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;AAwBA~~,MAAa,6BAA0C;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,+BAA+B,CAAC;CAE5C,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,YAAqB;EACjD,cAAc,aAAa,QAAQ,SAAU;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB;GAClB,MAAM,QAAQ,WAAW;GACzB,SAAS,QAAQ;GACjB,WAAW,QAAQ;GACnB,oBAAoB;EACtB,CAAC;EACD,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,SAAS,KAAK,YAAY;IACzB,MAAM,gBAAgB,eAAe,QAAQ,OAAO;IACpD,MAAM,YAAY,CAChB;KACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;KAC3B,OAAO,EAAE,oBAAoB;KAC7B,eAAe;MACb,IAAI,QAAQ,SACV,UAAU,UAAU,UAAU,QAAQ,OAAO;KAEjD;IACF,GACA,GAAI,QAAQ,UACR,CACE;KACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;KACzB,OAAO,EAAE,uBAAuB;KAChC,eAAe;MACb,IAAI,QAAQ,SACV,~~OAAO~~,~~KACL,~~eAAe,QAAQ,SAAS,QAAQ,OAAO,~~GAC/C,QACF~~;KAEJ;IACF,CACF,IACA,CAAC,CACP;IAEA,OACE,qBAACA,YAAD;KAAgC,IAAI,EAAE,UAAU,WAAW;KAA3D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,qBAAqB,OAAO;MAC3C,UACE,uBACA,wBAAwB,QAAQ;MAJpC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;OAAe,SAAS,QAAQ;OAAkB;MAAU,CAAA,EAC9C,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,QAAQ,WAAW;OAC5B,WAAW;MACZ,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,OAAO;MACP,UACE,CAAC,EACC,uBACA,wBAAwB,QAAQ;KAGrC,CAAA,CACO;IAzBK,GAAA,QAAQ,OAyBb;GAEd,CAAC,GACA,CAAC,SAAS,UACT,oBAAC,oBAAD;IACE,MAAM,oBAAC,QAAD,CAAS,CAAA;IACf,OAAO,EAAE,iCAAiC;IAC1C,SAAS,EAAE,wCAAwC;GACpD,CAAA,CAEC;;CACO,CAAA;AAEnB"}
1	+ {"version":3,"file":"ConnectedWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/ConnectedWalletsPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { openInNewTab } from '../../utils/url.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const ConnectedWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { accounts } = useAccount()\n const { setSelectedBookmark } = useBookmarkActions()\n const { requiredToChainType } = useToAddressRequirements()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n\n useHeader(t('sendToWallet.connectedWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleWalletSelected = (account: Account) => {\n setFieldValue('toAddress', account.address!, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark({\n name: account.connector?.name,\n address: account.address!,\n chainType: account.chainType!,\n isConnectedAccount: true,\n })\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {accounts.map((account) => {\n const walletAddress = shortenAddress(account.address)\n const menuItems = [\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () => {\n if (account.address) {\n navigator.clipboard.writeText(account.address)\n }\n },\n },\n ...(account.chainId\n ? [\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () => {\n if (account.address) {\n openInNewTab(\n getAddressLink(account.address, account.chainId)\n )\n }\n },\n },\n ]\n : []),\n ]\n\n return (\n <ListItem key={account.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleWalletSelected(account)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== account.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar chainId={account.chainId} account={account} />\n </ListItemAvatar>\n <ListItemText\n primary={account.connector?.name}\n secondary={walletAddress}\n />\n </ListItemButton>\n <ContextMenu\n items={menuItems}\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== account.chainType\n )\n }\n />\n </ListItem>\n )\n })}\n {!accounts.length && (\n <EmptyListIndicator\n icon={<Wallet />}\n title={t('sendToWallet.noConnectedWallets')}\n message={t('sendToWallet.noConnectedWalletsMessage')}\n />\n )}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAa,6BAA0C;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,+BAA+B,CAAC;CAE5C,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,YAAqB;EACjD,cAAc,aAAa,QAAQ,SAAU;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB;GAClB,MAAM,QAAQ,WAAW;GACzB,SAAS,QAAQ;GACjB,WAAW,QAAQ;GACnB,oBAAoB;EACtB,CAAC;EACD,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,SAAS,KAAK,YAAY;IACzB,MAAM,gBAAgB,eAAe,QAAQ,OAAO;IACpD,MAAM,YAAY,CAChB;KACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;KAC3B,OAAO,EAAE,oBAAoB;KAC7B,eAAe;MACb,IAAI,QAAQ,SACV,UAAU,UAAU,UAAU,QAAQ,OAAO;KAEjD;IACF,GACA,GAAI,QAAQ,UACR,CACE;KACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;KACzB,OAAO,EAAE,uBAAuB;KAChC,eAAe;MACb,IAAI,QAAQ,SACV,aACE,eAAe,QAAQ,SAAS,QAAQ,OAAO,CACjD;KAEJ;IACF,CACF,IACA,CAAC,CACP;IAEA,OACE,qBAACA,YAAD;KAAgC,IAAI,EAAE,UAAU,WAAW;KAA3D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,qBAAqB,OAAO;MAC3C,UACE,uBACA,wBAAwB,QAAQ;MAJpC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;OAAe,SAAS,QAAQ;OAAkB;MAAU,CAAA,EAC9C,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,QAAQ,WAAW;OAC5B,WAAW;MACZ,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,OAAO;MACP,UACE,CAAC,EACC,uBACA,wBAAwB,QAAQ;KAGrC,CAAA,CACO;IAzBK,GAAA,QAAQ,OAyBb;GAEd,CAAC,GACA,CAAC,SAAS,UACT,oBAAC,oBAAD;IACE,MAAM,oBAAC,QAAD,CAAS,CAAA;IACf,OAAO,EAAE,iCAAiC;IAC1C,SAAS,EAAE,wCAAwC;GACpD,CAAA,CAEC;;CACO,CAAA;AAEnB"}

package/dist/esm/pages/SendToWallet/RecentWalletsPage.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { PageContainer } from "../../components/PageContainer.js";
 import { defaultChainIdsByType } from "../../utils/chainType.js";
 import { useToAddressRequirements } from "../../hooks/useToAddressRequirements.js";
 import { shortenAddress } from "../../utils/wallet.js";
+import { openInNewTab } from "../../utils/url.js";
 import { useExplorer } from "../../hooks/useExplorer.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { useListHeight } from "../../hooks/useListHeight.js";
@@ -89,7 +90,7 @@ const RecentWalletsPage = () => {
 						{
 							icon: /* @__PURE__ */ jsx(OpenInNewRounded, {}),
 							label: t("button.viewOnExplorer"),
-							onClick: () => window.open(getAddressLink(recentWallet.address, defaultChainIdsByType[recentWallet.chainType]), "_blank")
+							onClick: () => openInNewTab(getAddressLink(recentWallet.address, defaultChainIdsByType[recentWallet.chainType]))
 						},
 						{
 							icon: /* @__PURE__ */ jsx(TurnedInNot, {}),

package/dist/esm/pages/SendToWallet/RecentWalletsPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RecentWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/RecentWalletsPage.tsx"],"sourcesContent":["import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedInNot from '@mui/icons-material/TurnedInNot'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\n\nexport const RecentWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [bookmarkTarget, setBookmarkTarget] = useState<Bookmark>()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n const { recentWallets } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const {\n removeRecentWallet,\n addBookmark,\n setSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.recentWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleRecentSelected = (recentWallet: Bookmark) => {\n addRecentWallet(recentWallet)\n setFieldValue('toAddress', recentWallet.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(recentWallet)\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {recentWallets.map((recentWallet) => (\n <ListItem key={recentWallet.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n }\n onClick={() => handleRecentSelected(recentWallet)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[recentWallet.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={\n recentWallet.name \|\| shortenAddress(recentWallet.address)\n }\n secondary={\n recentWallet.name\n ? shortenAddress(recentWallet.address)\n : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(recentWallet.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n ~~window.open~~(\n getAddressLink(\n recentWallet.address,\n defaultChainIdsByType[recentWallet.chainType]\n )~~,\n '_blank'~~\n ),\n },\n {\n icon: <TurnedInNot />,\n label: t('button.bookmark'),\n onClick: () => {\n setBookmarkTarget(recentWallet)\n bookmarkAddressSheetRef.current?.open()\n },\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeRecentWallet(recentWallet.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!recentWallets.length && (\n <EmptyListIndicator\n icon={<AccountBalanceWalletIcon />}\n title={t('sendToWallet.noRecentWallets')}\n message={t('sendToWallet.noRecentWalletsMessage')}\n />\n )}\n </List>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={bookmarkTarget}\n onAddBookmark={handleAddBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA~~,MAAa,0BAAuC;CAClD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB;CAC/D,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,kBAAkB,aAAa;CACvC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EACJ,oBACA,aACA,qBACA,oBACE,mBAAmB;CACvB,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,sBAAsB,CAAC;CAEnC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,iBAA2B;EACvD,gBAAgB,YAAY;EAC5B,cAAc,aAAa,aAAa,SAAS;GAC/C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,YAAY;EAChC,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,MAAM,qBAAqB,aAAuB;EAChD,YAAY,QAAQ;EACpB,SAAS;GAAE,IAAI,iBAAiB;GAAW,SAAS;EAAK,CAAC;CAC5D;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA,CACE,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,cAAc,KAAK,iBAClB,qBAACA,YAAD;IAAqC,IAAI,EAAE,UAAU,WAAW;IAAhE,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,aAAa;KAEvC,eAAe,qBAAqB,YAAY;KALlD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,aAAa,WAC7C,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SACE,aAAa,QAAQ,eAAe,aAAa,OAAO;MAE1D,WACE,aAAa,OACT,eAAe,aAAa,OAAO,IACnC,KAAA;KAEP,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,aAAa;KAGzC,OAAO;MACL;OACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;OAC3B,OAAO,EAAE,oBAAoB;OAC7B,eACE,UAAU,UAAU,UAAU,aAAa,OAAO;MACtD;MACA;OACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;OACzB,OAAO,EAAE,uBAAuB;OAChC,eACE,~~OAAO~~,~~KACL,~~eACE,aAAa,SACb,sBAAsB,aAAa,UACrC,~~GACA,QACF~~;MACJ;MACA;OACE,MAAM,oBAAC,aAAD,CAAc,CAAA;OACpB,OAAO,EAAE,iBAAiB;OAC1B,eAAe;QACb,kBAAkB,YAAY;QAC9B,wBAAwB,SAAS,KAAK;OACxC;MACF;MACA;OACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;OACtB,OAAO,EAAE,eAAe;OACxB,eAAe,mBAAmB,aAAa,OAAO;MACxD;KACF;IACD,CAAA,CACO;~~GAjEK~~,GAAA,aAAa,~~OAiElB~~,CACX,GACA,CAAC,cAAc,UACd,oBAAC,oBAAD;IACE,MAAM,oBAAC,0BAAD,CAA2B,CAAA;IACjC,OAAO,EAAE,8BAA8B;IACvC,SAAS,EAAE,qCAAqC;GACjD,CAAA,CAEC;EACN,CAAA,GAAA,oBAAC,sBAAD;GACE,KAAK;GACL,iBAAiB;GACjB,eAAe;EAChB,CAAA,CACY;;AAEnB"}
1	+ {"version":3,"file":"RecentWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/RecentWalletsPage.tsx"],"sourcesContent":["import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedInNot from '@mui/icons-material/TurnedInNot'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { openInNewTab } from '../../utils/url.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\n\nexport const RecentWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [bookmarkTarget, setBookmarkTarget] = useState<Bookmark>()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n const { recentWallets } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const {\n removeRecentWallet,\n addBookmark,\n setSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.recentWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleRecentSelected = (recentWallet: Bookmark) => {\n addRecentWallet(recentWallet)\n setFieldValue('toAddress', recentWallet.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(recentWallet)\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {recentWallets.map((recentWallet) => (\n <ListItem key={recentWallet.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n }\n onClick={() => handleRecentSelected(recentWallet)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[recentWallet.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={\n recentWallet.name \|\| shortenAddress(recentWallet.address)\n }\n secondary={\n recentWallet.name\n ? shortenAddress(recentWallet.address)\n : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(recentWallet.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n openInNewTab(\n getAddressLink(\n recentWallet.address,\n defaultChainIdsByType[recentWallet.chainType]\n )\n ),\n },\n {\n icon: <TurnedInNot />,\n label: t('button.bookmark'),\n onClick: () => {\n setBookmarkTarget(recentWallet)\n bookmarkAddressSheetRef.current?.open()\n },\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeRecentWallet(recentWallet.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!recentWallets.length && (\n <EmptyListIndicator\n icon={<AccountBalanceWalletIcon />}\n title={t('sendToWallet.noRecentWallets')}\n message={t('sendToWallet.noRecentWalletsMessage')}\n />\n )}\n </List>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={bookmarkTarget}\n onAddBookmark={handleAddBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAa,0BAAuC;CAClD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB;CAC/D,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,kBAAkB,aAAa;CACvC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EACJ,oBACA,aACA,qBACA,oBACE,mBAAmB;CACvB,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,sBAAsB,CAAC;CAEnC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,iBAA2B;EACvD,gBAAgB,YAAY;EAC5B,cAAc,aAAa,aAAa,SAAS;GAC/C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,YAAY;EAChC,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,MAAM,qBAAqB,aAAuB;EAChD,YAAY,QAAQ;EACpB,SAAS;GAAE,IAAI,iBAAiB;GAAW,SAAS;EAAK,CAAC;CAC5D;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA,CACE,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,cAAc,KAAK,iBAClB,qBAACA,YAAD;IAAqC,IAAI,EAAE,UAAU,WAAW;IAAhE,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,aAAa;KAEvC,eAAe,qBAAqB,YAAY;KALlD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,aAAa,WAC7C,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SACE,aAAa,QAAQ,eAAe,aAAa,OAAO;MAE1D,WACE,aAAa,OACT,eAAe,aAAa,OAAO,IACnC,KAAA;KAEP,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,aAAa;KAGzC,OAAO;MACL;OACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;OAC3B,OAAO,EAAE,oBAAoB;OAC7B,eACE,UAAU,UAAU,UAAU,aAAa,OAAO;MACtD;MACA;OACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;OACzB,OAAO,EAAE,uBAAuB;OAChC,eACE,aACE,eACE,aAAa,SACb,sBAAsB,aAAa,UACrC,CACF;MACJ;MACA;OACE,MAAM,oBAAC,aAAD,CAAc,CAAA;OACpB,OAAO,EAAE,iBAAiB;OAC1B,eAAe;QACb,kBAAkB,YAAY;QAC9B,wBAAwB,SAAS,KAAK;OACxC;MACF;MACA;OACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;OACtB,OAAO,EAAE,eAAe;OACxB,eAAe,mBAAmB,aAAa,OAAO;MACxD;KACF;IACD,CAAA,CACO;GAhEK,GAAA,aAAa,OAgElB,CACX,GACA,CAAC,cAAc,UACd,oBAAC,oBAAD;IACE,MAAM,oBAAC,0BAAD,CAA2B,CAAA;IACjC,OAAO,EAAE,8BAA8B;IACvC,SAAS,EAAE,qCAAqC;GACjD,CAAA,CAEC;EACN,CAAA,GAAA,oBAAC,sBAAD;GACE,KAAK;GACL,iBAAiB;GACjB,eAAe;EAChB,CAAA,CACY;;AAEnB"}

package/dist/esm/pages/SendToWallet/SendToConfiguredWalletPage.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { defaultChainIdsByType } from "../../utils/chainType.js";
 import { useToAddressRequirements } from "../../hooks/useToAddressRequirements.js";
 import { useNavigateBack } from "../../hooks/useNavigateBack.js";
 import { shortenAddress } from "../../utils/wallet.js";
+import { openInNewTab } from "../../utils/url.js";
 import { useExplorer } from "../../hooks/useExplorer.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { useListHeight } from "../../hooks/useListHeight.js";
@@ -71,7 +72,7 @@ const SendToConfiguredWalletPage = () => {
 					}, {
 						icon: /* @__PURE__ */ jsx(OpenInNewRounded, {}),
 						label: t("button.viewOnExplorer"),
-						onClick: () => window.open(getAddressLink(toAddress.address, defaultChainIdsByType[toAddress.chainType]), "_blank")
+						onClick: () => openInNewTab(getAddressLink(toAddress.address, defaultChainIdsByType[toAddress.chainType]))
 					}]
 				})]
 			}, toAddress.address))

package/dist/esm/pages/SendToWallet/SendToConfiguredWalletPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SendToConfiguredWalletPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/SendToConfiguredWalletPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const SendToConfiguredWalletPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { toAddresses } = useWidgetConfig()\n const { requiredToChainType } = useToAddressRequirements()\n const { setSelectedBookmark } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n\n useHeader(t('header.sendToWallet'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleCuratedSelected = (toAddress: ToAddress) => {\n setSelectedBookmark(toAddress)\n setFieldValue('toAddress', toAddress.address, {\n isTouched: true,\n isDirty: true,\n })\n navigateBack()\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {toAddresses?.map((toAddress) => (\n <ListItem key={toAddress.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n }\n onClick={() => handleCuratedSelected(toAddress)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[toAddress.chainType]}\n toAddress={toAddress}\n />\n </ListItemAvatar>\n <ListItemText\n primary={toAddress.name \|\| shortenAddress(toAddress.address)}\n secondary={\n toAddress.name ? shortenAddress(toAddress.address) : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(toAddress.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n ~~window.open~~(\n getAddressLink(\n toAddress.address,\n defaultChainIdsByType[toAddress.chainType]\n )~~,\n '_blank'~~\n ),\n },\n ]}\n />\n </ListItem>\n ))}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;AAsBA~~,MAAa,mCAAgD;CAC3D,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,gBAAgB,gBAAgB;CACxC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,qBAAqB,CAAC;CAElC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,yBAAyB,cAAyB;EACtD,oBAAoB,SAAS;EAC7B,cAAc,aAAa,UAAU,SAAS;GAC5C,WAAW;GACX,SAAS;EACX,CAAC;EACD,aAAa;CACf;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,oBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GAErB,UAAA,aAAa,KAAK,cACjB,qBAACA,YAAD;IAAkC,IAAI,EAAE,UAAU,WAAW;IAA7D,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,UAAU;KAEpC,eAAe,sBAAsB,SAAS;KALhD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;MACE,SAAS,sBAAsB,UAAU;MAC9B;KACZ,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SAAS,UAAU,QAAQ,eAAe,UAAU,OAAO;MAC3D,WACE,UAAU,OAAO,eAAe,UAAU,OAAO,IAAI,KAAA;KAExD,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,UAAU;KAGtC,OAAO,CACL;MACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;MAC3B,OAAO,EAAE,oBAAoB;MAC7B,eACE,UAAU,UAAU,UAAU,UAAU,OAAO;KACnD,GACA;MACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;MACzB,OAAO,EAAE,uBAAuB;MAChC,eACE,~~OAAO~~,~~KACL,~~eACE,UAAU,SACV,sBAAsB,UAAU,UAClC,~~GACA,QACF~~;KACJ,CACF;IACD,CAAA,CACO;~~GAjDK~~,GAAA,UAAU,~~OAiDf~~,CACX;EACG,CAAA;CACO,CAAA;AAEnB"}
1	+ {"version":3,"file":"SendToConfiguredWalletPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/SendToConfiguredWalletPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { openInNewTab } from '../../utils/url.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const SendToConfiguredWalletPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { toAddresses } = useWidgetConfig()\n const { requiredToChainType } = useToAddressRequirements()\n const { setSelectedBookmark } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement \| null>(null)\n\n useHeader(t('header.sendToWallet'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleCuratedSelected = (toAddress: ToAddress) => {\n setSelectedBookmark(toAddress)\n setFieldValue('toAddress', toAddress.address, {\n isTouched: true,\n isDirty: true,\n })\n navigateBack()\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {toAddresses?.map((toAddress) => (\n <ListItem key={toAddress.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n }\n onClick={() => handleCuratedSelected(toAddress)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[toAddress.chainType]}\n toAddress={toAddress}\n />\n </ListItemAvatar>\n <ListItemText\n primary={toAddress.name \|\| shortenAddress(toAddress.address)}\n secondary={\n toAddress.name ? shortenAddress(toAddress.address) : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(toAddress.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n openInNewTab(\n getAddressLink(\n toAddress.address,\n defaultChainIdsByType[toAddress.chainType]\n )\n ),\n },\n ]}\n />\n </ListItem>\n ))}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAa,mCAAgD;CAC3D,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,gBAAgB,gBAAgB;CACxC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,qBAAqB,CAAC;CAElC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,yBAAyB,cAAyB;EACtD,oBAAoB,SAAS;EAC7B,cAAc,aAAa,UAAU,SAAS;GAC5C,WAAW;GACX,SAAS;EACX,CAAC;EACD,aAAa;CACf;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,oBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GAErB,UAAA,aAAa,KAAK,cACjB,qBAACA,YAAD;IAAkC,IAAI,EAAE,UAAU,WAAW;IAA7D,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,UAAU;KAEpC,eAAe,sBAAsB,SAAS;KALhD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;MACE,SAAS,sBAAsB,UAAU;MAC9B;KACZ,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SAAS,UAAU,QAAQ,eAAe,UAAU,OAAO;MAC3D,WACE,UAAU,OAAO,eAAe,UAAU,OAAO,IAAI,KAAA;KAExD,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,UAAU;KAGtC,OAAO,CACL;MACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;MAC3B,OAAO,EAAE,oBAAoB;MAC7B,eACE,UAAU,UAAU,UAAU,UAAU,OAAO;KACnD,GACA;MACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;MACzB,OAAO,EAAE,uBAAuB;MAChC,eACE,aACE,eACE,UAAU,SACV,sBAAsB,UAAU,UAClC,CACF;KACJ,CACF;IACD,CAAA,CACO;GAhDK,GAAA,UAAU,OAgDf,CACX;EACG,CAAA;CACO,CAAA;AAEnB"}

package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js CHANGED Viewed

@@ -5,6 +5,7 @@ import { PageContainer } from "../../components/PageContainer.js";
 import { getSourceTxHash } from "../../stores/routes/utils.js";
 import { useRouteExecutionStore } from "../../stores/routes/RouteExecutionStore.js";
 import { useTools } from "../../hooks/useTools.js";
+import { isHttpUrl } from "../../utils/url.js";
 import { useExplorer } from "../../hooks/useExplorer.js";
 import { useHeader } from "../../hooks/useHeader.js";
 import { buildRouteFromTxHistory } from "../../utils/converters.js";
@@ -52,7 +53,7 @@ const TransactionDetailsPage = () => {
 	let supportId = getSourceTxHash(routeExecution?.route) ?? routeExecution?.route.id ?? "";
 	const internalTxLink = routeExecution?.route?.steps?.at(-1)?.execution?.internalTxLink;
 	const externalTxLink = routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink;
-	const txLink = (url ? internalTxLink?.replace("https://scan.li.fi", url) : internalTxLink) || externalTxLink || getTransactionLink({ txHash: supportId });
+	const txLink = [url ? internalTxLink?.replace("https://scan.li.fi", url) : internalTxLink, externalTxLink].find(isHttpUrl) ?? getTransactionLink({ txHash: supportId });
 	if (process.env.NODE_ENV === "development") supportId += `_${routeExecution?.route.id}`;
 	const startedAt = new Date(routeExecution?.route.steps[0].execution?.startedAt ?? 0);
 	if (isLoading && !storedRouteExecution) return /* @__PURE__ */ jsx(TransactionDetailsSkeleton, {});

package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TransactionDetailsPage.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx"],"sourcesContent":["import type { FullStatusData } from '@lifi/sdk'\nimport { useLocation, useNavigate } from '@tanstack/react-router'\nimport { useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCard } from '../../components/TransactionCard/TransactionCard.js'\nimport { internalExplorerUrl } from '../../config/constants.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useTools } from '../../hooks/useTools.js'\nimport { useTransactionDetails } from '../../hooks/useTransactionDetails.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { getSourceTxHash } from '../../stores/routes/utils.js'\nimport { buildRouteFromTxHistory } from '../../utils/converters.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ReceiptsCard } from './ReceiptsCard.js'\nimport { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js'\nimport { TransferIdCard } from './TransferIdCard.js'\n\nexport const TransactionDetailsPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { mode, modeOptions, contractSecondaryComponent, explorerUrls } =\n useWidgetConfig()\n const { search }: any = useLocation()\n const { tools } = useTools()\n const { getTransactionLink } = useExplorer()\n const storedRouteExecution = useRouteExecutionStore((store) =>\n search?.routeId ? store.routes[search.routeId] : undefined\n )\n const { transaction, isLoading } = useTransactionDetails(\n !storedRouteExecution && search?.transactionHash\n )\n\n const title =\n mode === 'custom'\n ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}Details`)\n : t('header.transactionDetails')\n useHeader(title)\n\n const routeExecution = useMemo(() => {\n if (storedRouteExecution) {\n return storedRouteExecution\n }\n if (isLoading) {\n return\n }\n if (transaction) {\n return buildRouteFromTxHistory(transaction as FullStatusData, tools)\n }\n }, [isLoading, storedRouteExecution, tools, transaction])\n\n useEffect(() => {\n if (!isLoading && !routeExecution) {\n navigate({ to: navigationRoutes.home })\n }\n }, [isLoading, navigate, routeExecution])\n\n const explorerUrl = explorerUrls?.internal?.[0]\n const url = typeof explorerUrl === 'string' ? explorerUrl : explorerUrl?.url\n\n const sourceTxHash = getSourceTxHash(routeExecution?.route)\n let supportId = sourceTxHash ?? routeExecution?.route.id ?? ''\n\n const internalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.internalTxLink\n const externalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink\n\n const txLink =\n ~~(url~~\n ? internalTxLink?.replace(internalExplorerUrl, url)\n : internalTxLink~~) \|\|\~~n externalTxLink ~~\|\|\~~n getTransactionLink({ txHash: supportId })\n\n if (process.env.NODE_ENV === 'development') {\n supportId += `_${routeExecution?.route.id}`\n }\n\n const startedAt = new Date(\n routeExecution?.route.steps[0].execution?.startedAt ?? 0\n )\n\n if (isLoading && !storedRouteExecution) {\n return <TransactionDetailsSkeleton />\n }\n\n if (!routeExecution?.route) {\n return null\n }\n\n return (\n <PageContainer\n topGutters\n bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {mode === 'custom' && contractSecondaryComponent ? (\n <ContractComponent>{contractSecondaryComponent}</ContractComponent>\n ) : null}\n <ReceiptsCard route={routeExecution.route} />\n {supportId ? (\n <TransferIdCard transferId={supportId} txLink={txLink} />\n ) : null}\n </PageContainer>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;AAqBA~~,MAAa,+BAAyC;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,4BAA4B,iBACrD,gBAAgB;CAClB,MAAM,EAAE,WAAgB,YAAY;CACpC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,uBAAuB,YAAY;CAC3C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,CACnD;CACA,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,eACnC;CAEA,MAAM,QACJ,SAAS,WACL,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,QAAQ,IAC5D,EAAE,2BAA2B;CACnC,UAAU,KAAK;CAEf,MAAM,iBAAiB,cAAc;EACnC,IAAI,sBACF,OAAO;EAET,IAAI,WACF;EAEF,IAAI,aACF,OAAO,wBAAwB,aAA+B,KAAK;CAEvE,GAAG;EAAC;EAAW;EAAsB;EAAO;CAAW,CAAC;CAExD,gBAAgB;EACd,IAAI,CAAC,aAAa,CAAC,gBACjB,SAAS,EAAE,IAAI,iBAAiB,KAAK,CAAC;CAE1C,GAAG;EAAC;EAAW;EAAU;CAAc,CAAC;CAExC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,KAC1B,KAAK,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CAEnD,MAAM,~~UACH~~,~~MACG~~,gBAAgB,QAAA,sBAA6B,GAAG,~~IAChD~~,~~mBACJ~~,~~kBACA~~,mBAAmB,EAAE,QAAQ,UAAU,CAAC;~~CAE1C~~,IAAI,QAAQ,IAAI,aAAa,eAC3B,aAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,EAAE,CAAC,WAAW,aAAa,CACzD;CAEA,IAAI,aAAa,CAAC,sBAChB,OAAO,oBAAC,4BAAD,CAA6B,CAAA;CAGtC,IAAI,CAAC,gBAAgB,OACnB,OAAO;CAGT,OACE,qBAAC,eAAD;EACE,YAAA;EACA,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAE;EAHzD,UAAA;GAKE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;GAAY,CAAA;GAC/D,SAAS,YAAY,6BACpB,oBAAC,mBAAD,EAAA,UAAoB,2BAA8C,CAAA,IAChE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,MAAQ,CAAA;GAC3C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;GAAS,CAAA,IACtD;EACS;;AAEnB"}
1	+ {"version":3,"file":"TransactionDetailsPage.js","names":[],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx"],"sourcesContent":["import type { FullStatusData } from '@lifi/sdk'\nimport { useLocation, useNavigate } from '@tanstack/react-router'\nimport { useEffect, useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ContractComponent } from '../../components/ContractComponent/ContractComponent.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TransactionCard } from '../../components/TransactionCard/TransactionCard.js'\nimport { internalExplorerUrl } from '../../config/constants.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useTools } from '../../hooks/useTools.js'\nimport { useTransactionDetails } from '../../hooks/useTransactionDetails.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js'\nimport { getSourceTxHash } from '../../stores/routes/utils.js'\nimport { buildRouteFromTxHistory } from '../../utils/converters.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { isHttpUrl } from '../../utils/url.js'\nimport { ReceiptsCard } from './ReceiptsCard.js'\nimport { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js'\nimport { TransferIdCard } from './TransferIdCard.js'\n\nexport const TransactionDetailsPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const { mode, modeOptions, contractSecondaryComponent, explorerUrls } =\n useWidgetConfig()\n const { search }: any = useLocation()\n const { tools } = useTools()\n const { getTransactionLink } = useExplorer()\n const storedRouteExecution = useRouteExecutionStore((store) =>\n search?.routeId ? store.routes[search.routeId] : undefined\n )\n const { transaction, isLoading } = useTransactionDetails(\n !storedRouteExecution && search?.transactionHash\n )\n\n const title =\n mode === 'custom'\n ? t(`header.${modeOptions?.custom?.type ?? 'checkout'}Details`)\n : t('header.transactionDetails')\n useHeader(title)\n\n const routeExecution = useMemo(() => {\n if (storedRouteExecution) {\n return storedRouteExecution\n }\n if (isLoading) {\n return\n }\n if (transaction) {\n return buildRouteFromTxHistory(transaction as FullStatusData, tools)\n }\n }, [isLoading, storedRouteExecution, tools, transaction])\n\n useEffect(() => {\n if (!isLoading && !routeExecution) {\n navigate({ to: navigationRoutes.home })\n }\n }, [isLoading, navigate, routeExecution])\n\n const explorerUrl = explorerUrls?.internal?.[0]\n const url = typeof explorerUrl === 'string' ? explorerUrl : explorerUrl?.url\n\n const sourceTxHash = getSourceTxHash(routeExecution?.route)\n let supportId = sourceTxHash ?? routeExecution?.route.id ?? ''\n\n const internalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.internalTxLink\n const externalTxLink =\n routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink\n\n const txLink =\n [\n url ? internalTxLink?.replace(internalExplorerUrl, url) : internalTxLink,\n externalTxLink,\n ].find(isHttpUrl) ?? getTransactionLink({ txHash: supportId })\n\n if (process.env.NODE_ENV === 'development') {\n supportId += `_${routeExecution?.route.id}`\n }\n\n const startedAt = new Date(\n routeExecution?.route.steps[0].execution?.startedAt ?? 0\n )\n\n if (isLoading && !storedRouteExecution) {\n return <TransactionDetailsSkeleton />\n }\n\n if (!routeExecution?.route) {\n return null\n }\n\n return (\n <PageContainer\n topGutters\n bottomGutters\n sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n >\n <TransactionCard route={routeExecution.route} date={startedAt} />\n {mode === 'custom' && contractSecondaryComponent ? (\n <ContractComponent>{contractSecondaryComponent}</ContractComponent>\n ) : null}\n <ReceiptsCard route={routeExecution.route} />\n {supportId ? (\n <TransferIdCard transferId={supportId} txLink={txLink} />\n ) : null}\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAa,+BAAyC;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,4BAA4B,iBACrD,gBAAgB;CAClB,MAAM,EAAE,WAAgB,YAAY;CACpC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,uBAAuB,YAAY;CAC3C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,CACnD;CACA,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,eACnC;CAEA,MAAM,QACJ,SAAS,WACL,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,QAAQ,IAC5D,EAAE,2BAA2B;CACnC,UAAU,KAAK;CAEf,MAAM,iBAAiB,cAAc;EACnC,IAAI,sBACF,OAAO;EAET,IAAI,WACF;EAEF,IAAI,aACF,OAAO,wBAAwB,aAA+B,KAAK;CAEvE,GAAG;EAAC;EAAW;EAAsB;EAAO;CAAW,CAAC;CAExD,gBAAgB;EACd,IAAI,CAAC,aAAa,CAAC,gBACjB,SAAS,EAAE,IAAI,iBAAiB,KAAK,CAAC;CAE1C,GAAG;EAAC;EAAW;EAAU;CAAc,CAAC;CAExC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,KAC1B,KAAK,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,EAAE,CAAC,EAAE,WAAW;CAEnD,MAAM,SACJ,CACE,MAAM,gBAAgB,QAAA,sBAA6B,GAAG,IAAI,gBAC1D,cACF,CAAC,CAAC,KAAK,SAAS,KAAK,mBAAmB,EAAE,QAAQ,UAAU,CAAC;CAE/D,IAAI,QAAQ,IAAI,aAAa,eAC3B,aAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,EAAE,CAAC,WAAW,aAAa,CACzD;CAEA,IAAI,aAAa,CAAC,sBAChB,OAAO,oBAAC,4BAAD,CAA6B,CAAA;CAGtC,IAAI,CAAC,gBAAgB,OACnB,OAAO;CAGT,OACE,qBAAC,eAAD;EACE,YAAA;EACA,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAE;EAHzD,UAAA;GAKE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;GAAY,CAAA;GAC/D,SAAS,YAAY,6BACpB,oBAAC,mBAAD,EAAA,UAAoB,2BAA8C,CAAA,IAChE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,MAAQ,CAAA;GAC3C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;GAAS,CAAA,IACtD;EACS;;AAEnB"}

package/dist/esm/pages/TransactionDetailsPage/TransferIdCard.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
 import { Card as Card$1 } from "../../components/Card/Card.js";
 import { CardIconButton } from "../../components/Card/CardIconButton.js";
+import { openInNewTab } from "../../utils/url.js";
 import { CardTitle } from "../../components/Card/CardTitle.js";
 import { ContactSupportButton } from "./ContactSupportButton.js";
 import { Box, Typography } from "@mui/material";
@@ -16,7 +17,7 @@ const TransferIdCard = ({ transferId, txLink }) => {
 		await navigator.clipboard.writeText(transferId);
 	};
 	const openTransferIdInExplorer = () => {
-		window.open(txLink, "_blank");
+		openInNewTab(txLink);
 	};
 	return /* @__PURE__ */ jsxs(Card$1, {
 		type: "default",

package/dist/esm/pages/TransactionDetailsPage/TransferIdCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TransferIdCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransferIdCard.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport { Box, Typography } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardIconButton } from '../../components/Card/CardIconButton.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { ContactSupportButton } from './ContactSupportButton.js'\n\ninterface TransferIdCardProps {\n transferId: string\n txLink?: string\n}\n\nexport const TransferIdCard = ({\n transferId,\n txLink,\n}: TransferIdCardProps): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n\n const copyTransferId = async () => {\n await navigator.clipboard.writeText(transferId)\n }\n\n const openTransferIdInExplorer = () => {\n ~~window.open~~(txLink~~, '_blank'~~)\n }\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <CardTitle sx={{ p: 0 }}>{t('main.transferId')}</CardTitle>\n <Box\n sx={{\n gap: 1,\n display: 'flex',\n }}\n >\n <CardIconButton size=\"small\" onClick={copyTransferId}>\n <ContentCopyRounded fontSize=\"inherit\" />\n </CardIconButton>\n {txLink ? (\n <CardIconButton size=\"small\" onClick={openTransferIdInExplorer}>\n <OpenInNew fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n {!hiddenUI?.contactSupport ? (\n <ContactSupportButton supportId={transferId} />\n ) : null}\n </Box>\n </Box>\n <Typography\n variant=\"body2\"\n sx={{\n pt: 2,\n wordBreak: 'break-all',\n }}\n >\n {transferId}\n </Typography>\n </Card>\n )\n}\n"],"mappings":"~~;;;;;;;;;;;AAgBA~~,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,iBAAiB,YAAY;EACjC,MAAM,UAAU,UAAU,UAAU,UAAU;CAChD;CAEA,MAAM,iCAAiC;EACrC,~~OAAO~~,~~KAAK,QAAQ,QAAQ~~;~~CAC9B~~;CAEA,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;EAArB,UAAA,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;GALF,UAAA,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,EAAE;IAAI,UAAA,EAAE,iBAAiB;GAAa,CAAA,GAC1D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;IACX;IAJF,UAAA;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,oBAAD,EAAoB,UAAS,UAAW,CAAA;KAC1B,CAAA;KACf,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,WAAD,EAAW,UAAS,UAAW,CAAA;KACjB,CAAA,IACd;KACH,CAAC,UAAU,iBACV,oBAAC,sBAAD,EAAsB,WAAW,WAAa,CAAA,IAC5C;IACD;GACF,CAAA,CAAA;EACL,CAAA,GAAA,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;GACb;GAEC,UAAA;EACS,CAAA,CACR;;AAEV"}
1	+ {"version":3,"file":"TransferIdCard.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransferIdCard.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNew from '@mui/icons-material/OpenInNew'\nimport { Box, Typography } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../../components/Card/Card.js'\nimport { CardIconButton } from '../../components/Card/CardIconButton.js'\nimport { CardTitle } from '../../components/Card/CardTitle.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { openInNewTab } from '../../utils/url.js'\nimport { ContactSupportButton } from './ContactSupportButton.js'\n\ninterface TransferIdCardProps {\n transferId: string\n txLink?: string\n}\n\nexport const TransferIdCard = ({\n transferId,\n txLink,\n}: TransferIdCardProps): JSX.Element => {\n const { t } = useTranslation()\n const { hiddenUI } = useWidgetConfig()\n\n const copyTransferId = async () => {\n await navigator.clipboard.writeText(transferId)\n }\n\n const openTransferIdInExplorer = () => {\n openInNewTab(txLink)\n }\n\n return (\n <Card type=\"default\" indented>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n }}\n >\n <CardTitle sx={{ p: 0 }}>{t('main.transferId')}</CardTitle>\n <Box\n sx={{\n gap: 1,\n display: 'flex',\n }}\n >\n <CardIconButton size=\"small\" onClick={copyTransferId}>\n <ContentCopyRounded fontSize=\"inherit\" />\n </CardIconButton>\n {txLink ? (\n <CardIconButton size=\"small\" onClick={openTransferIdInExplorer}>\n <OpenInNew fontSize=\"inherit\" />\n </CardIconButton>\n ) : null}\n {!hiddenUI?.contactSupport ? (\n <ContactSupportButton supportId={transferId} />\n ) : null}\n </Box>\n </Box>\n <Typography\n variant=\"body2\"\n sx={{\n pt: 2,\n wordBreak: 'break-all',\n }}\n >\n {transferId}\n </Typography>\n </Card>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAiBA,MAAa,kBAAkB,EAC7B,YACA,aACsC;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,iBAAiB,YAAY;EACjC,MAAM,UAAU,UAAU,UAAU,UAAU;CAChD;CAEA,MAAM,iCAAiC;EACrC,aAAa,MAAM;CACrB;CAEA,OACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;EAArB,UAAA,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;GAClB;GALF,UAAA,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,EAAE;IAAI,UAAA,EAAE,iBAAiB;GAAa,CAAA,GAC1D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;IACX;IAJF,UAAA;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,oBAAD,EAAoB,UAAS,UAAW,CAAA;KAC1B,CAAA;KACf,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;MACpC,UAAA,oBAAC,WAAD,EAAW,UAAS,UAAW,CAAA;KACjB,CAAA,IACd;KACH,CAAC,UAAU,iBACV,oBAAC,sBAAD,EAAsB,WAAW,WAAa,CAAA,IAC5C;IACD;GACF,CAAA,CAAA;EACL,CAAA,GAAA,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;GACb;GAEC,UAAA;EACS,CAAA,CACR;;AAEV"}

package/dist/esm/shared.d.ts CHANGED Viewed

@@ -103,5 +103,6 @@ import { buildRouteFromTxHistory } from "./utils/converters.js";
 import { ElementId, createElementId } from "./utils/elements.js";
 import { hasEnumFlag } from "./utils/enum.js";
 import { fitInputText } from "./utils/input.js";
+import { isHttpUrl, openInNewTab } from "./utils/url.js";
 import { shortenAddress } from "./utils/wallet.js";
-export { ActionRow, AddressType, AmountInputEndAdornment, AvatarBadgedDefault, BaseTransactionButton, BookmarkStoreProvider, type BottomSheetBase, ButtonTertiary, Card, CardIconButton, CardTitle, ChainAvatar, ChainSelect, ConfirmToAddressSheet, ContactSupportButton, ContractComponent, DateLabelContainer, DateLabelText, DetailInfoIcon, DetailLabel, DetailLabelContainer, DetailRow, DetailValue, ElementId, ExchangeRateBottomSheet, type ExchangeRateBottomSheetBase, ExecutionDoneCard, type ExecutionRow, ExecutionStatusCard, ExternalLink, FeeBreakdownTooltip, FormControl, FormKeyHelper, type FormRef, type FormType, type FormTypeProps, I18nProvider, IconCircle, IconTypography, Input, InputCard, InputPriceButton, ListItemButton, MainWarningMessages, PageContainer, PoweredBy, ProgressToNextUpdate, QueryClientProvider, RouteCard, RouteCardSkeleton, RouteDetails, RouteExecutionStatus, RouteNotFoundCard, RouteTokens, RouteTracker, SDKClientProvider, SearchInput, SearchTokenInput, SelectChainPage, SendToWalletButton, SentToWalletRow, SettingsStoreProvider, Stack, StartTransactionButton, StatusIcon, StepActionsList, StoreProvider, Token, TokenAvatar, TokenNotFound, TokenRate, TokenValueBottomSheet, TransactionDoneButtons, VirtualizedTokenList, WalletProvider, WarningMessages, type WidgetConfig, WidgetEvent, WidgetProvider, type WidgetTheme, buildRouteFromTxHistory, calculateValueLossPercentage, createElementId, createTheme, fitInputText, formatDuration, formatInputAmount, formatTokenAmount, formatTokenPrice, getAccumulatedFeeCostsBreakdown, getPriceImpact, getSourceTxHash, getTokenValueLossThreshold, hasEnumFlag, isRouteActive, isRouteDone, isRouteFailed, navigationRoutes, priceToTokenAmount, shortenAddress, usdDecimals, useAddressActivity, useAddressValidation, useAvailableChains, useChain, useChainOrderStore, useContactSupport, useDebouncedWatch, useExecutionRows, useExplorer, useFieldActions, useFieldValues, useHeader, useHeaderStore, useInputModeStore, useListHeight, useNavigateBack, useRouteExecution, useRouteExecutionMessage, useRouteExecutionStore, useRouteExecutionStoreContext, useRoutes, useSDKClient, useSetHeaderHeight, useSettingsStoreContext, useToAddressRequirements, useToken, useTokenAddressBalance, useTokenBalances, useTokenList, useTokenSelect, useTools, useWidgetConfig, useWidgetEvents };
+export { ActionRow, AddressType, AmountInputEndAdornment, AvatarBadgedDefault, BaseTransactionButton, BookmarkStoreProvider, type BottomSheetBase, ButtonTertiary, Card, CardIconButton, CardTitle, ChainAvatar, ChainSelect, ConfirmToAddressSheet, ContactSupportButton, ContractComponent, DateLabelContainer, DateLabelText, DetailInfoIcon, DetailLabel, DetailLabelContainer, DetailRow, DetailValue, ElementId, ExchangeRateBottomSheet, type ExchangeRateBottomSheetBase, ExecutionDoneCard, type ExecutionRow, ExecutionStatusCard, ExternalLink, FeeBreakdownTooltip, FormControl, FormKeyHelper, type FormRef, type FormType, type FormTypeProps, I18nProvider, IconCircle, IconTypography, Input, InputCard, InputPriceButton, ListItemButton, MainWarningMessages, PageContainer, PoweredBy, ProgressToNextUpdate, QueryClientProvider, RouteCard, RouteCardSkeleton, RouteDetails, RouteExecutionStatus, RouteNotFoundCard, RouteTokens, RouteTracker, SDKClientProvider, SearchInput, SearchTokenInput, SelectChainPage, SendToWalletButton, SentToWalletRow, SettingsStoreProvider, Stack, StartTransactionButton, StatusIcon, StepActionsList, StoreProvider, Token, TokenAvatar, TokenNotFound, TokenRate, TokenValueBottomSheet, TransactionDoneButtons, VirtualizedTokenList, WalletProvider, WarningMessages, type WidgetConfig, WidgetEvent, WidgetProvider, type WidgetTheme, buildRouteFromTxHistory, calculateValueLossPercentage, createElementId, createTheme, fitInputText, formatDuration, formatInputAmount, formatTokenAmount, formatTokenPrice, getAccumulatedFeeCostsBreakdown, getPriceImpact, getSourceTxHash, getTokenValueLossThreshold, hasEnumFlag, isHttpUrl, isRouteActive, isRouteDone, isRouteFailed, navigationRoutes, openInNewTab, priceToTokenAmount, shortenAddress, usdDecimals, useAddressActivity, useAddressValidation, useAvailableChains, useChain, useChainOrderStore, useContactSupport, useDebouncedWatch, useExecutionRows, useExplorer, useFieldActions, useFieldValues, useHeader, useHeaderStore, useInputModeStore, useListHeight, useNavigateBack, useRouteExecution, useRouteExecutionMessage, useRouteExecutionStore, useRouteExecutionStoreContext, useRoutes, useSDKClient, useSetHeaderHeight, useSettingsStoreContext, useToAddressRequirements, useToken, useTokenAddressBalance, useTokenBalances, useTokenList, useTokenSelect, useTools, useWidgetConfig, useWidgetEvents };

package/dist/esm/shared.js CHANGED Viewed

@@ -44,6 +44,7 @@ import { RouteNotFoundCard } from "./components/RouteCard/RouteNotFoundCard.js";
 import { useNavigateBack } from "./hooks/useNavigateBack.js";
 import { useTools } from "./hooks/useTools.js";
 import { shortenAddress } from "./utils/wallet.js";
+import { isHttpUrl, openInNewTab } from "./utils/url.js";
 import { useExplorer } from "./hooks/useExplorer.js";
 import { AddressType, useAddressValidation } from "./hooks/useAddressValidation.js";
 import { useHeader } from "./hooks/useHeader.js";
@@ -102,4 +103,4 @@ import { createTheme } from "./themes/createTheme.js";
 import { WalletProvider } from "./providers/WalletProvider/WalletProvider.js";
 import { StoreProvider } from "./stores/StoreProvider.js";
 import { useTokenList } from "./hooks/useTokenList.js";
-export { ActionRow, AddressType, AmountInputEndAdornment, AvatarBadgedDefault, BaseTransactionButton, BookmarkStoreProvider, ButtonTertiary, Card, CardIconButton, CardTitle, ChainAvatar, ChainSelect, ConfirmToAddressSheet, ContactSupportButton, ContractComponent, DateLabelContainer, DateLabelText, DetailInfoIcon, DetailLabel, DetailLabelContainer, DetailRow, DetailValue, ElementId, ExchangeRateBottomSheet, ExecutionDoneCard, ExecutionStatusCard, ExternalLink, FeeBreakdownTooltip, FormControl, FormKeyHelper, I18nProvider, IconCircle, IconTypography, Input, InputCard, InputPriceButton, ListItemButton, MainWarningMessages, PageContainer, PoweredBy, ProgressToNextUpdate, QueryClientProvider, RouteCard, RouteCardSkeleton, RouteDetails, RouteExecutionStatus, RouteNotFoundCard, RouteTokens, RouteTracker, SDKClientProvider, SearchInput, SearchTokenInput, SelectChainPage, SendToWalletButton, SentToWalletRow, SettingsStoreProvider, Stack, StartTransactionButton, StatusIcon, StepActionsList, StoreProvider, Token, TokenAvatar, TokenNotFound, TokenRate, TokenValueBottomSheet, TransactionDoneButtons, VirtualizedTokenList, WalletProvider, WarningMessages, WidgetEvent, WidgetProvider, buildRouteFromTxHistory, calculateValueLossPercentage, createElementId, createTheme, fitInputText, formatDuration, formatInputAmount, formatTokenAmount, formatTokenPrice, getAccumulatedFeeCostsBreakdown, getPriceImpact, getSourceTxHash, getTokenValueLossThreshold, hasEnumFlag, isRouteActive, isRouteDone, isRouteFailed, navigationRoutes, priceToTokenAmount, shortenAddress, usdDecimals, useAddressActivity, useAddressValidation, useAvailableChains, useChain, useChainOrderStore, useContactSupport, useDebouncedWatch, useExecutionRows, useExplorer, useFieldActions, useFieldValues, useHeader, useHeaderStore, useInputModeStore, useListHeight, useNavigateBack, useRouteExecution, useRouteExecutionMessage, useRouteExecutionStore, useRouteExecutionStoreContext, useRoutes, useSDKClient, useSetHeaderHeight, useSettingsStoreContext, useToAddressRequirements, useToken, useTokenAddressBalance, useTokenBalances, useTokenList, useTokenSelect, useTools, useWidgetConfig, useWidgetEvents };
+export { ActionRow, AddressType, AmountInputEndAdornment, AvatarBadgedDefault, BaseTransactionButton, BookmarkStoreProvider, ButtonTertiary, Card, CardIconButton, CardTitle, ChainAvatar, ChainSelect, ConfirmToAddressSheet, ContactSupportButton, ContractComponent, DateLabelContainer, DateLabelText, DetailInfoIcon, DetailLabel, DetailLabelContainer, DetailRow, DetailValue, ElementId, ExchangeRateBottomSheet, ExecutionDoneCard, ExecutionStatusCard, ExternalLink, FeeBreakdownTooltip, FormControl, FormKeyHelper, I18nProvider, IconCircle, IconTypography, Input, InputCard, InputPriceButton, ListItemButton, MainWarningMessages, PageContainer, PoweredBy, ProgressToNextUpdate, QueryClientProvider, RouteCard, RouteCardSkeleton, RouteDetails, RouteExecutionStatus, RouteNotFoundCard, RouteTokens, RouteTracker, SDKClientProvider, SearchInput, SearchTokenInput, SelectChainPage, SendToWalletButton, SentToWalletRow, SettingsStoreProvider, Stack, StartTransactionButton, StatusIcon, StepActionsList, StoreProvider, Token, TokenAvatar, TokenNotFound, TokenRate, TokenValueBottomSheet, TransactionDoneButtons, VirtualizedTokenList, WalletProvider, WarningMessages, WidgetEvent, WidgetProvider, buildRouteFromTxHistory, calculateValueLossPercentage, createElementId, createTheme, fitInputText, formatDuration, formatInputAmount, formatTokenAmount, formatTokenPrice, getAccumulatedFeeCostsBreakdown, getPriceImpact, getSourceTxHash, getTokenValueLossThreshold, hasEnumFlag, isHttpUrl, isRouteActive, isRouteDone, isRouteFailed, navigationRoutes, openInNewTab, priceToTokenAmount, shortenAddress, usdDecimals, useAddressActivity, useAddressValidation, useAvailableChains, useChain, useChainOrderStore, useContactSupport, useDebouncedWatch, useExecutionRows, useExplorer, useFieldActions, useFieldValues, useHeader, useHeaderStore, useInputModeStore, useListHeight, useNavigateBack, useRouteExecution, useRouteExecutionMessage, useRouteExecutionStore, useRouteExecutionStoreContext, useRoutes, useSDKClient, useSetHeaderHeight, useSettingsStoreContext, useToAddressRequirements, useToken, useTokenAddressBalance, useTokenBalances, useTokenList, useTokenSelect, useTools, useWidgetConfig, useWidgetEvents };

package/dist/esm/utils/url.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+//#region src/utils/url.d.ts
+export declare const isHttpUrl: (url: string | undefined) => url is string;
+export declare const openInNewTab: (url: string | undefined) => void;
+//#endregion
+//# sourceMappingURL=url.d.ts.map

package/dist/esm/utils/url.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"url.d.ts","names":[],"sources":["../../../src/utils/url.ts"],"mappings":";qBAAa,YAAa,4BAA0B;qBAYvC,eAAgB"}

package/dist/esm/utils/url.js ADDED Viewed

@@ -0,0 +1,17 @@
+//#region src/utils/url.ts
+const isHttpUrl = (url) => {
+	if (!url) return false;
+	try {
+		const { protocol } = new URL(url);
+		return protocol === "https:" || protocol === "http:";
+	} catch {
+		return false;
+	}
+};
+const openInNewTab = (url) => {
+	if (isHttpUrl(url)) window.open(url, "_blank", "noopener,noreferrer");
+};
+//#endregion
+export { isHttpUrl, openInNewTab };
+//# sourceMappingURL=url.js.map

package/dist/esm/utils/url.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"url.js","names":[],"sources":["../../../src/utils/url.ts"],"sourcesContent":["export const isHttpUrl = (url: string | undefined): url is string => {\n if (!url) {\n return false\n }\n try {\n const { protocol } = new URL(url)\n return protocol === 'https:' || protocol === 'http:'\n } catch {\n return false\n }\n}\n\nexport const openInNewTab = (url: string | undefined): void => {\n if (isHttpUrl(url)) {\n window.open(url, '_blank', 'noopener,noreferrer')\n }\n}\n"],"mappings":";AAAA,MAAa,aAAa,QAA2C;CACnE,IAAI,CAAC,KACH,OAAO;CAET,IAAI;EACF,MAAM,EAAE,aAAa,IAAI,IAAI,GAAG;EAChC,OAAO,aAAa,YAAY,aAAa;CAC/C,QAAQ;EACN,OAAO;CACT;AACF;AAEA,MAAa,gBAAgB,QAAkC;CAC7D,IAAI,UAAU,GAAG,GACf,OAAO,KAAK,KAAK,UAAU,qBAAqB;AAEpD"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "description": "LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.",
   "type": "module",
   "main": "./dist/esm/index.js",

package/src/config/version.ts CHANGED Viewed

@@ -1,2 +1,2 @@
 export const name = '@lifi/widget'
-export const version = '4.7.0'
+export const version = '4.7.1'

package/src/hooks/useExplorer.test.tsx ADDED Viewed

@@ -0,0 +1,106 @@
+/** @vitest-environment happy-dom */
+import type { ExtendedChain } from '@lifi/sdk'
+import { act } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import type { WidgetConfig } from '../types/widget.js'
+const txHash = `0x${'ab'.repeat(32)}`
+let explorerUrls: WidgetConfig['explorerUrls']
+let blockExplorerUrls: string[] = []
+const getChainById = (id: number) =>
+  ({
+    id,
+    chainType: 'EVM',
+    metamask: { blockExplorerUrls },
+  }) as unknown as ExtendedChain
+vi.mock('../providers/WidgetProvider/WidgetProvider.js', () => ({
+  useWidgetConfig: () => ({ explorerUrls }),
+}))
+vi.mock('./useAvailableChains.js', () => ({
+  useAvailableChains: () => ({ getChainById }),
+}))
+const { useExplorer } = await import('./useExplorer.js')
+let explorer: ReturnType<typeof useExplorer>
+const ExplorerHandle = (): null => {
+  explorer = useExplorer()
+  return null
+}
+let root: Root
+beforeEach(() => {
+  explorerUrls = undefined
+  blockExplorerUrls = ['https://etherscan.io/']
+  root = createRoot(document.createElement('div'))
+})
+afterEach(() => {
+  act(() => {
+    root.unmount()
+  })
+})
+const render = () => {
+  act(() => {
+    root.render(<ExplorerHandle />)
+  })
+}
+describe('useExplorer', () => {
+  it('builds links from an https explorer base', () => {
+    render()
+    expect(explorer.getAddressLink('0xabc', 1)).toBe(
+      'https://etherscan.io/address/0xabc'
+    )
+    expect(explorer.getTransactionLink({ txHash, chain: 1 })).toBe(
+      `https://etherscan.io/tx/${txHash}`
+    )
+  })
+  it('returns no link when chain metadata carries a javascript: explorer base', () => {
+    blockExplorerUrls = ['javascript:alert(document.domain)//']
+    render()
+    expect(explorer.getAddressLink('0xabc', 1)).toBeUndefined()
+    expect(explorer.getTransactionLink({ txHash, chain: 1 })).toBeUndefined()
+  })
+  it('returns no link when the integrator config carries a javascript: explorer base', () => {
+    explorerUrls = {
+      1: ['javascript:alert(document.domain)'],
+      internal: ['javascript:alert(document.domain)'],
+    }
+    render()
+    expect(explorer.getAddressLink('0xabc', 1)).toBeUndefined()
+    expect(explorer.getTransactionLink({ txHash })).toBeUndefined()
+  })
+  it('falls back to an https txLink when the hash link is rejected', () => {
+    blockExplorerUrls = ['javascript:alert(document.domain)//']
+    render()
+    expect(
+      explorer.getTransactionLink({
+        txHash,
+        txLink: 'https://scan.li.fi/tx/0xabc',
+        chain: 1,
+      })
+    ).toBe('https://scan.li.fi/tx/0xabc')
+  })
+  it('rejects a javascript: txLink fallback', () => {
+    render()
+    expect(
+      explorer.getTransactionLink({
+        txLink: 'javascript:alert(document.domain)',
+      })
+    ).toBeUndefined()
+  })
+})

package/src/hooks/useExplorer.ts CHANGED Viewed

@@ -4,6 +4,7 @@ import { useCallback } from 'react'
 import { internalExplorerUrl } from '../config/constants.js'
 import { useAvailableChains } from '../hooks/useAvailableChains.js'
 import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
+import { isHttpUrl } from '../utils/url.js'
 const sanitiseBaseUrl = (baseUrl: string) => baseUrl.trim().replace(/\/+$/, '')
@@ -25,7 +26,10 @@ type TransactionLinkProps = {
 export const useExplorer = (): {
   getTransactionLink: (props: TransactionLinkProps) => string | undefined
-  getAddressLink: (address: string, chain?: Chain | number) => string
+  getAddressLink: (
+    address: string,
+    chain?: Chain | number
+  ) => string | undefined
 } => {
   const { explorerUrls } = useWidgetConfig()
   const { getChainById } = useAvailableChains()
@@ -82,11 +86,12 @@ export const useExplorer = (): {
           config.resolvedChain?.chainType !== ChainType.EVM ||
           config.hasOverride ||
           isHex(txHash, { strict: true })
-        if (validForEvm) {
-          return `${config.url}/${config.txPath}/${txHash}`
+        const link = `${config.url}/${config.txPath}/${txHash}`
+        if (validForEvm && isHttpUrl(link)) {
+          return link
         }
       }
-      return txLink
+      return isHttpUrl(txLink) ? txLink : undefined
     },
     [getExplorerConfig]
   )
@@ -94,7 +99,8 @@ export const useExplorer = (): {
   const getAddressLink = useCallback(
     (address: string, chain?: Chain | number) => {
       const config = getExplorerConfig(chain)
-      return `${config.url}/${config.addressPath}/${address}`
+      const link = `${config.url}/${config.addressPath}/${address}`
+      return isHttpUrl(link) ? link : undefined
     },
     [getExplorerConfig]
   )

package/src/pages/SendToWallet/BookmarksPage.tsx CHANGED Viewed

@@ -23,6 +23,7 @@ import { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'
 import { useFieldActions } from '../../stores/form/useFieldActions.js'
 import { defaultChainIdsByType } from '../../utils/chainType.js'
 import { navigationRoutes } from '../../utils/navigationRoutes.js'
+import { openInNewTab } from '../../utils/url.js'
 import { shortenAddress } from '../../utils/wallet.js'
 import { BookmarkAddressSheet } from './BookmarkAddressSheet.js'
 import { BookmarkButtonContainer } from './SendToWalletPage.style.js'
@@ -106,12 +107,11 @@ export const BookmarksPage = (): JSX.Element => {
                   icon: <OpenInNewRounded />,
                   label: t('button.viewOnExplorer'),
                   onClick: () =>
-                    window.open(
+                    openInNewTab(
                       getAddressLink(
                         bookmark.address,
                         defaultChainIdsByType[bookmark.chainType]
-                      ),
-                      '_blank'
+                      )
                     ),
                 },
                 {

package/src/pages/SendToWallet/ConnectedWalletsPage.tsx CHANGED Viewed

@@ -20,6 +20,7 @@ import { useToAddressRequirements } from '../../hooks/useToAddressRequirements.j
 import { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'
 import { useFieldActions } from '../../stores/form/useFieldActions.js'
 import { navigationRoutes } from '../../utils/navigationRoutes.js'
+import { openInNewTab } from '../../utils/url.js'
 import { shortenAddress } from '../../utils/wallet.js'
 export const ConnectedWalletsPage = (): JSX.Element => {
@@ -81,9 +82,8 @@ export const ConnectedWalletsPage = (): JSX.Element => {
                     label: t('button.viewOnExplorer'),
                     onClick: () => {
                       if (account.address) {
-                        window.open(
-                          getAddressLink(account.address, account.chainId),
-                          '_blank'
+                        openInNewTab(
+                          getAddressLink(account.address, account.chainId)
                         )
                       }
                     },

package/src/pages/SendToWallet/RecentWalletsPage.tsx CHANGED Viewed

@@ -24,6 +24,7 @@ import { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'
 import { useFieldActions } from '../../stores/form/useFieldActions.js'
 import { defaultChainIdsByType } from '../../utils/chainType.js'
 import { navigationRoutes } from '../../utils/navigationRoutes.js'
+import { openInNewTab } from '../../utils/url.js'
 import { shortenAddress } from '../../utils/wallet.js'
 import { BookmarkAddressSheet } from './BookmarkAddressSheet.js'
@@ -118,12 +119,11 @@ export const RecentWalletsPage = (): JSX.Element => {
                   icon: <OpenInNewRounded />,
                   label: t('button.viewOnExplorer'),
                   onClick: () =>
-                    window.open(
+                    openInNewTab(
                       getAddressLink(
                         recentWallet.address,
                         defaultChainIdsByType[recentWallet.chainType]
-                      ),
-                      '_blank'
+                      )
                     ),
                 },
                 {

package/src/pages/SendToWallet/SendToConfiguredWalletPage.tsx CHANGED Viewed

@@ -18,6 +18,7 @@ import { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js
 import { useFieldActions } from '../../stores/form/useFieldActions.js'
 import type { ToAddress } from '../../types/widget.js'
 import { defaultChainIdsByType } from '../../utils/chainType.js'
+import { openInNewTab } from '../../utils/url.js'
 import { shortenAddress } from '../../utils/wallet.js'
 export const SendToConfiguredWalletPage = (): JSX.Element => {
@@ -92,12 +93,11 @@ export const SendToConfiguredWalletPage = (): JSX.Element => {
                   icon: <OpenInNewRounded />,
                   label: t('button.viewOnExplorer'),
                   onClick: () =>
-                    window.open(
+                    openInNewTab(
                       getAddressLink(
                         toAddress.address,
                         defaultChainIdsByType[toAddress.chainType]
-                      ),
-                      '_blank'
+                      )
                     ),
                 },
               ]}

package/src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx CHANGED Viewed

@@ -15,6 +15,7 @@ import { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.
 import { getSourceTxHash } from '../../stores/routes/utils.js'
 import { buildRouteFromTxHistory } from '../../utils/converters.js'
 import { navigationRoutes } from '../../utils/navigationRoutes.js'
+import { isHttpUrl } from '../../utils/url.js'
 import { ReceiptsCard } from './ReceiptsCard.js'
 import { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js'
 import { TransferIdCard } from './TransferIdCard.js'
@@ -70,11 +71,10 @@ export const TransactionDetailsPage: React.FC = () => {
     routeExecution?.route?.steps?.at(-1)?.execution?.externalTxLink
   const txLink =
-    (url
-      ? internalTxLink?.replace(internalExplorerUrl, url)
-      : internalTxLink) ||
-    externalTxLink ||
-    getTransactionLink({ txHash: supportId })
+    [
+      url ? internalTxLink?.replace(internalExplorerUrl, url) : internalTxLink,
+      externalTxLink,
+    ].find(isHttpUrl) ?? getTransactionLink({ txHash: supportId })
   if (process.env.NODE_ENV === 'development') {
     supportId += `_${routeExecution?.route.id}`

package/src/pages/TransactionDetailsPage/TransferIdCard.tsx CHANGED Viewed

@@ -7,6 +7,7 @@ import { Card } from '../../components/Card/Card.js'
 import { CardIconButton } from '../../components/Card/CardIconButton.js'
 import { CardTitle } from '../../components/Card/CardTitle.js'
 import { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'
+import { openInNewTab } from '../../utils/url.js'
 import { ContactSupportButton } from './ContactSupportButton.js'
 interface TransferIdCardProps {
@@ -26,7 +27,7 @@ export const TransferIdCard = ({
   }
   const openTransferIdInExplorer = () => {
-    window.open(txLink, '_blank')
+    openInNewTab(txLink)
   }
   return (

package/src/shared.ts CHANGED Viewed

@@ -188,4 +188,5 @@ export {
 export { getPriceImpact } from './utils/getPriceImpact.js'
 export { fitInputText } from './utils/input.js'
 export { navigationRoutes } from './utils/navigationRoutes.js'
+export { isHttpUrl, openInNewTab } from './utils/url.js'
 export { shortenAddress } from './utils/wallet.js'

package/src/utils/url.ts ADDED Viewed

@@ -0,0 +1,17 @@
+export const isHttpUrl = (url: string | undefined): url is string => {
+  if (!url) {
+    return false
+  }
+  try {
+    const { protocol } = new URL(url)
+    return protocol === 'https:' || protocol === 'http:'
+  } catch {
+    return false
+  }
+}
+export const openInNewTab = (url: string | undefined): void => {
+  if (isHttpUrl(url)) {
+    window.open(url, '_blank', 'noopener,noreferrer')
+  }
+}