@lifi/widget 4.0.0-beta.1 → 4.0.0-beta.11

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

@@ -1,87 +1,83 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Typography } from '@mui/material';
-import { useLocation, useNavigate } from '@tanstack/react-router';
-import { useEffect, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ContractComponent } from '../../components/ContractComponent/ContractComponent.js';
-import { PageContainer } from '../../components/PageContainer.js';
-import { getStepList } from '../../components/Step/StepList.js';
-import { TransactionDetails } from '../../components/TransactionDetails.js';
-import { internalExplorerUrl } from '../../config/constants.js';
-import { useExplorer } from '../../hooks/useExplorer.js';
-import { useHeader } from '../../hooks/useHeader.js';
-import { useTools } from '../../hooks/useTools.js';
-import { useTransactionDetails } from '../../hooks/useTransactionDetails.js';
-import { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js';
-import { useRouteExecutionStore } from '../../stores/routes/RouteExecutionStore.js';
-import { getSourceTxHash } from '../../stores/routes/utils.js';
-import { HiddenUI } from '../../types/widget.js';
-import { buildRouteFromTxHistory } from '../../utils/converters.js';
-import { navigationRoutes } from '../../utils/navigationRoutes.js';
-import { ContactSupportButton } from './ContactSupportButton.js';
-import { TransactionDetailsSkeleton } from './TransactionDetailsSkeleton.js';
-import { TransferIdCard } from './TransferIdCard.js';
-export const TransactionDetailsPage = () => {
-    const { t, i18n } = useTranslation();
-    const navigate = useNavigate();
-    const { subvariant, subvariantOptions, contractSecondaryComponent, explorerUrls, hiddenUI, } = useWidgetConfig();
-    const { search } = useLocation();
-    const { tools } = useTools();
-    const { getTransactionLink } = useExplorer();
-    const storedRouteExecution = useRouteExecutionStore((store) => store.routes[search?.routeId]);
-    const { transaction, isLoading } = useTransactionDetails(!storedRouteExecution && search?.transactionHash);
-    const title = subvariant === 'custom'
-        ? t(`header.${subvariantOptions?.custom ?? 'checkout'}Details`)
-        : t('header.transactionDetails');
-    useHeader(title);
-    const routeExecution = useMemo(() => {
-        if (storedRouteExecution) {
-            return storedRouteExecution;
-        }
-        if (isLoading) {
-            return;
-        }
-        if (transaction) {
-            const routeExecution = buildRouteFromTxHistory(transaction, tools);
-            return routeExecution;
-        }
-    }, [isLoading, storedRouteExecution, tools, transaction]);
-    useEffect(() => {
-        if (!isLoading && !routeExecution) {
-            navigate({ to: navigationRoutes.home });
-        }
-    }, [isLoading, navigate, routeExecution]);
-    const explorerUrl = explorerUrls?.internal?.[0];
-    const url = typeof explorerUrl === 'string' ? explorerUrl : explorerUrl?.url;
-    const sourceTxHash = getSourceTxHash(routeExecution?.route);
-    let supportId = sourceTxHash ?? 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(internalExplorerUrl, url)
-        : internalTxLink) ||
-        externalTxLink ||
-        getTransactionLink({ txHash: supportId });
-    if (process.env.NODE_ENV === 'development') {
-        supportId += `_${routeExecution?.route.id}`;
-    }
-    const startedAt = new Date((routeExecution?.route.steps[0].execution?.startedAt ?? 0) *
-        (storedRouteExecution ? 1 : 1000) // local and BE routes have different ms handling
-    );
-    return isLoading && !storedRouteExecution ? (_jsx(TransactionDetailsSkeleton, {})) : (_jsxs(PageContainer, { bottomGutters: true, children: [_jsxs(Box, { sx: {
-                    pb: 1,
-                    display: 'flex',
-                    justifyContent: 'space-between',
-                }, children: [_jsx(Typography, { sx: {
-                            fontSize: 12,
-                        }, children: startedAt.toLocaleString(i18n.language, {
-                            dateStyle: 'long',
-                        }) }), _jsx(Typography, { sx: {
-                            fontSize: 12,
-                        }, children: startedAt.toLocaleString(i18n.language, {
-                            timeStyle: 'short',
-                        }) })] }), getStepList(routeExecution?.route, subvariant), subvariant === 'custom' && contractSecondaryComponent ? (_jsx(ContractComponent, { sx: { marginTop: 2 }, children: contractSecondaryComponent })) : null, routeExecution?.route ? (_jsx(TransactionDetails, { route: routeExecution?.route, sx: { marginTop: 2 } })) : null, _jsx(TransferIdCard, { transferId: supportId, txLink: txLink }), !hiddenUI?.includes(HiddenUI.ContactSupport) ? (_jsx(Box, { sx: {
-                    mt: 2,
-                }, children: _jsx(ContactSupportButton, { supportId: supportId }) })) : null] }));
+import "../../config/constants.js";
+import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
+import { navigationRoutes } from "../../utils/navigationRoutes.js";
+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 { useExplorer } from "../../hooks/useExplorer.js";
+import { useHeader } from "../../hooks/useHeader.js";
+import { buildRouteFromTxHistory } from "../../utils/converters.js";
+import { TransactionCard } from "../../components/TransactionCard/TransactionCard.js";
+import { ContractComponent } from "../../components/ContractComponent/ContractComponent.js";
+import { useTransactionDetails } from "../../hooks/useTransactionDetails.js";
+import { ReceiptsCard } from "./ReceiptsCard.js";
+import { TransactionDetailsSkeleton } from "./TransactionDetailsSkeleton.js";
+import { TransferIdCard } from "./TransferIdCard.js";
+import { useEffect, useMemo } from "react";
+import { useLocation, useNavigate } from "@tanstack/react-router";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+//#region src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx
+const TransactionDetailsPage = () => {
+	const { t } = useTranslation();
+	const navigate = useNavigate();
+	const { subvariant, subvariantOptions, contractSecondaryComponent, explorerUrls } = useWidgetConfig();
+	const { search } = useLocation();
+	const { tools } = useTools();
+	const { getTransactionLink } = useExplorer();
+	const storedRouteExecution = useRouteExecutionStore((store) => search?.routeId ? store.routes[search.routeId] : void 0);
+	const { transaction, isLoading } = useTransactionDetails(!storedRouteExecution && search?.transactionHash);
+	useHeader(subvariant === "custom" ? t(`header.${subvariantOptions?.custom ?? "checkout"}Details`) : t("header.transactionDetails"));
+	const routeExecution = useMemo(() => {
+		if (storedRouteExecution) return storedRouteExecution;
+		if (isLoading) return;
+		if (transaction) return buildRouteFromTxHistory(transaction, tools);
+	}, [
+		isLoading,
+		storedRouteExecution,
+		tools,
+		transaction
+	]);
+	useEffect(() => {
+		if (!isLoading && !routeExecution) navigate({ to: navigationRoutes.home });
+	}, [
+		isLoading,
+		navigate,
+		routeExecution
+	]);
+	const explorerUrl = explorerUrls?.internal?.[0];
+	const url = typeof explorerUrl === "string" ? explorerUrl : explorerUrl?.url;
+	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 });
+	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, {});
+	if (!routeExecution?.route) return null;
+	return /* @__PURE__ */ jsxs(PageContainer, {
+		bottomGutters: true,
+		sx: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 2
+		},
+		children: [
+			/* @__PURE__ */ jsx(TransactionCard, {
+				route: routeExecution.route,
+				date: startedAt
+			}),
+			subvariant === "custom" && contractSecondaryComponent ? /* @__PURE__ */ jsx(ContractComponent, { children: contractSecondaryComponent }) : null,
+			/* @__PURE__ */ jsx(ReceiptsCard, { route: routeExecution.route }),
+			supportId ? /* @__PURE__ */ jsx(TransferIdCard, {
+				transferId: supportId,
+				txLink
+			}) : null
+		]
+	});
 };
+//#endregion
+export { TransactionDetailsPage };
+
 //# sourceMappingURL=TransactionDetailsPage.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TransactionDetailsPage.js","sourceRoot":"","sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsPage.tsx"],"names":[],"mappings":"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"}
+{"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 {\n    subvariant,\n    subvariantOptions,\n    contractSecondaryComponent,\n    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    subvariant === 'custom'\n      ? t(`header.${subvariantOptions?.custom ?? '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      const routeExecution = buildRouteFromTxHistory(\n        transaction as FullStatusData,\n        tools\n      )\n      return routeExecution\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      bottomGutters\n      sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}\n    >\n      <TransactionCard route={routeExecution.route} date={startedAt} />\n      {subvariant === '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,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EACJ,YACA,mBACA,4BACA,iBACE,iBAAiB;CACrB,MAAM,EAAE,WAAgB,aAAa;CACrC,MAAM,EAAE,UAAU,UAAU;CAC5B,MAAM,EAAE,uBAAuB,aAAa;CAC5C,MAAM,uBAAuB,wBAAwB,UACnD,QAAQ,UAAU,MAAM,OAAO,OAAO,WAAW,KAAA,EAClD;CACD,MAAM,EAAE,aAAa,cAAc,sBACjC,CAAC,wBAAwB,QAAQ,gBAClC;AAMD,WAHE,eAAe,WACX,EAAE,UAAU,mBAAmB,UAAU,WAAW,SAAS,GAC7D,EAAE,4BAA4B,CACpB;CAEhB,MAAM,iBAAiB,cAAc;AACnC,MAAI,qBACF,QAAO;AAET,MAAI,UACF;AAEF,MAAI,YAKF,QAJuB,wBACrB,aACA,MACD;IAGF;EAAC;EAAW;EAAsB;EAAO;EAAY,CAAC;AAEzD,iBAAgB;AACd,MAAI,CAAC,aAAa,CAAC,eACjB,UAAS,EAAE,IAAI,iBAAiB,MAAM,CAAC;IAExC;EAAC;EAAW;EAAU;EAAe,CAAC;CAEzC,MAAM,cAAc,cAAc,WAAW;CAC7C,MAAM,MAAM,OAAO,gBAAgB,WAAW,cAAc,aAAa;CAGzE,IAAI,YADiB,gBAAgB,gBAAgB,MAAM,IAC3B,gBAAgB,MAAM,MAAM;CAE5D,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,GAAG,EAAE,WAAW;CACnD,MAAM,iBACJ,gBAAgB,OAAO,OAAO,GAAG,GAAG,EAAE,WAAW;CAEnD,MAAM,UACH,MACG,gBAAgB,QAAA,sBAA6B,IAAI,GACjD,mBACJ,kBACA,mBAAmB,EAAE,QAAQ,WAAW,CAAC;AAE3C,KAAI,QAAQ,IAAI,aAAa,cAC3B,cAAa,IAAI,gBAAgB,MAAM;CAGzC,MAAM,YAAY,IAAI,KACpB,gBAAgB,MAAM,MAAM,GAAG,WAAW,aAAa,EACxD;AAED,KAAI,aAAa,CAAC,qBAChB,QAAO,oBAAC,4BAAD,EAA8B,CAAA;AAGvC,KAAI,CAAC,gBAAgB,MACnB,QAAO;AAGT,QACE,qBAAC,eAAD;EACE,eAAA;EACA,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;GAAG;YAF1D;GAIE,oBAAC,iBAAD;IAAiB,OAAO,eAAe;IAAO,MAAM;IAAa,CAAA;GAChE,eAAe,YAAY,6BAC1B,oBAAC,mBAAD,EAAA,UAAoB,4BAA+C,CAAA,GACjE;GACJ,oBAAC,cAAD,EAAc,OAAO,eAAe,OAAS,CAAA;GAC5C,YACC,oBAAC,gBAAD;IAAgB,YAAY;IAAmB;IAAU,CAAA,GACvD;GACU"}

package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsSkeleton.js

@@ -1,33 +1,77 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Skeleton } from '@mui/material';
-import { Card } from '../../components/Card/Card.js';
-import { PageContainer } from '../../components/PageContainer.js';
-import { TokenSkeleton } from '../../components/Token/Token.js';
-export const TransactionDetailsSkeleton = () => {
-    return (_jsxs(PageContainer, { children: [_jsxs(Box, { sx: {
-                    pb: 1,
-                    pt: 0.75,
-                    display: 'flex',
-                    flex: 1,
-                    justifyContent: 'space-between',
-                }, children: [_jsx(Skeleton, { width: 96, height: 20, variant: "text" }), _jsx(Skeleton, { width: 40, height: 20, variant: "text" })] }), _jsxs(Card, { sx: { paddingX: 2, marginBottom: 3 }, children: [_jsx(Box, { sx: {
-                            pt: 2.5,
-                        }, children: _jsx(Skeleton, { width: 64, height: 12, variant: "rounded" }) }), _jsxs(Box, { sx: {
-                            py: 1,
-                        }, children: [_jsx(Box, { sx: {
-                                    py: 1,
-                                }, children: _jsx(TokenSkeleton, {}) }), _jsx(Box, { sx: {
-                                    py: 1,
-                                }, children: _jsx(TokenSkeleton, { disableDescription: true }) }), Array.from({ length: 3 }).map((_, key) => (_jsxs(Box, { sx: {
-                                    py: 1,
-                                    display: 'flex',
-                                    alignItems: 'center',
-                                }, children: [_jsx(Skeleton, { variant: "rounded", width: 40, height: 40, sx: {
-                                            borderRadius: '100%',
-                                        } }), _jsx(Skeleton, { sx: {
-                                            ml: 2,
-                                        }, width: 96, height: 24, variant: "text" })] }, key))), _jsx(Box, { sx: {
-                                    py: 1,
-                                }, children: _jsx(TokenSkeleton, {}) })] })] })] }));
+import { PageContainer } from "../../components/PageContainer.js";
+import { Card as Card$1 } from "../../components/Card/Card.js";
+import { TokenSkeleton } from "../../components/Token/Token.js";
+import { Box, Skeleton } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/pages/TransactionDetailsPage/TransactionDetailsSkeleton.tsx
+const TransactionDetailsSkeleton = () => {
+	return /* @__PURE__ */ jsxs(PageContainer, { children: [/* @__PURE__ */ jsxs(Box, {
+		sx: {
+			pb: 1,
+			pt: .75,
+			display: "flex",
+			flex: 1,
+			justifyContent: "space-between"
+		},
+		children: [/* @__PURE__ */ jsx(Skeleton, {
+			width: 96,
+			height: 20,
+			variant: "text"
+		}), /* @__PURE__ */ jsx(Skeleton, {
+			width: 40,
+			height: 20,
+			variant: "text"
+		})]
+	}), /* @__PURE__ */ jsxs(Card$1, {
+		sx: {
+			paddingX: 2,
+			marginBottom: 3
+		},
+		children: [/* @__PURE__ */ jsx(Box, {
+			sx: { pt: 2.5 },
+			children: /* @__PURE__ */ jsx(Skeleton, {
+				width: 64,
+				height: 12,
+				variant: "rounded"
+			})
+		}), /* @__PURE__ */ jsxs(Box, {
+			sx: { py: 1 },
+			children: [
+				/* @__PURE__ */ jsx(Box, {
+					sx: { py: 1 },
+					children: /* @__PURE__ */ jsx(TokenSkeleton, {})
+				}),
+				/* @__PURE__ */ jsx(Box, {
+					sx: { py: 1 },
+					children: /* @__PURE__ */ jsx(TokenSkeleton, { disableDescription: true })
+				}),
+				Array.from({ length: 3 }).map((_, key) => /* @__PURE__ */ jsxs(Box, {
+					sx: {
+						py: 1,
+						display: "flex",
+						alignItems: "center"
+					},
+					children: [/* @__PURE__ */ jsx(Skeleton, {
+						variant: "rounded",
+						width: 40,
+						height: 40,
+						sx: { borderRadius: "100%" }
+					}), /* @__PURE__ */ jsx(Skeleton, {
+						sx: { ml: 2 },
+						width: 96,
+						height: 24,
+						variant: "text"
+					})]
+				}, key)),
+				/* @__PURE__ */ jsx(Box, {
+					sx: { py: 1 },
+					children: /* @__PURE__ */ jsx(TokenSkeleton, {})
+				})
+			]
+		})]
+	})] });
 };
+//#endregion
+export { TransactionDetailsSkeleton };
+
 //# sourceMappingURL=TransactionDetailsSkeleton.js.map

package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsSkeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionDetailsSkeleton.js","sourceRoot":"","sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsSkeleton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,+BAA+B,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAE/D,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,EAAE;IAC7C,OAAO,CACL,MAAC,aAAa,eACZ,MAAC,GAAG,IACF,EAAE,EAAE;oBACF,EAAE,EAAE,CAAC;oBACL,EAAE,EAAE,IAAI;oBACR,OAAO,EAAE,MAAM;oBACf,IAAI,EAAE,CAAC;oBACP,cAAc,EAAE,eAAe;iBAChC,aAED,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAC,MAAM,GAAG,EAClD,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAC,MAAM,GAAG,IAC9C,EACN,MAAC,IAAI,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,aACxC,KAAC,GAAG,IACF,EAAE,EAAE;4BACF,EAAE,EAAE,GAAG;yBACR,YAED,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAC,SAAS,GAAG,GACjD,EACN,MAAC,GAAG,IACF,EAAE,EAAE;4BACF,EAAE,EAAE,CAAC;yBACN,aAGD,KAAC,GAAG,IACF,EAAE,EAAE;oCACF,EAAE,EAAE,CAAC;iCACN,YAED,KAAC,aAAa,KAAG,GACb,EAEN,KAAC,GAAG,IACF,EAAE,EAAE;oCACF,EAAE,EAAE,CAAC;iCACN,YAED,KAAC,aAAa,IAAC,kBAAkB,SAAG,GAChC,EAEL,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CACzC,MAAC,GAAG,IAEF,EAAE,EAAE;oCACF,EAAE,EAAE,CAAC;oCACL,OAAO,EAAE,MAAM;oCACf,UAAU,EAAE,QAAQ;iCACrB,aAED,KAAC,QAAQ,IACP,OAAO,EAAC,SAAS,EACjB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,EAAE,EAAE;4CACF,YAAY,EAAE,MAAM;yCACrB,GACD,EACF,KAAC,QAAQ,IACP,EAAE,EAAE;4CACF,EAAE,EAAE,CAAC;yCACN,EACD,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,OAAO,EAAC,MAAM,GACd,KAtBG,GAAG,CAuBJ,CACP,CAAC,EAEF,KAAC,GAAG,IACF,EAAE,EAAE;oCACF,EAAE,EAAE,CAAC;iCACN,YAED,KAAC,aAAa,KAAG,GACb,IACF,IACD,IACO,CACjB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TransactionDetailsSkeleton.js","names":["Card"],"sources":["../../../../src/pages/TransactionDetailsPage/TransactionDetailsSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport type { JSX } from 'react'\nimport { Card } from '../../components/Card/Card.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TokenSkeleton } from '../../components/Token/Token.js'\n\nexport const TransactionDetailsSkeleton = (): JSX.Element => {\n  return (\n    <PageContainer>\n      <Box\n        sx={{\n          pb: 1,\n          pt: 0.75,\n          display: 'flex',\n          flex: 1,\n          justifyContent: 'space-between',\n        }}\n      >\n        <Skeleton width={96} height={20} variant=\"text\" />\n        <Skeleton width={40} height={20} variant=\"text\" />\n      </Box>\n      <Card sx={{ paddingX: 2, marginBottom: 3 }}>\n        <Box\n          sx={{\n            pt: 2.5,\n          }}\n        >\n          <Skeleton width={64} height={12} variant=\"rounded\" />\n        </Box>\n        <Box\n          sx={{\n            py: 1,\n          }}\n        >\n          {/* Token skeleton */}\n          <Box\n            sx={{\n              py: 1,\n            }}\n          >\n            <TokenSkeleton />\n          </Box>\n          {/* Bridge skeleton */}\n          <Box\n            sx={{\n              py: 1,\n            }}\n          >\n            <TokenSkeleton disableDescription />\n          </Box>\n          {/* Steps skeleton */}\n          {Array.from({ length: 3 }).map((_, key) => (\n            <Box\n              key={key}\n              sx={{\n                py: 1,\n                display: 'flex',\n                alignItems: 'center',\n              }}\n            >\n              <Skeleton\n                variant=\"rounded\"\n                width={40}\n                height={40}\n                sx={{\n                  borderRadius: '100%',\n                }}\n              />\n              <Skeleton\n                sx={{\n                  ml: 2,\n                }}\n                width={96}\n                height={24}\n                variant=\"text\"\n              />\n            </Box>\n          ))}\n          {/* Receiving Token skeleton */}\n          <Box\n            sx={{\n              py: 1,\n            }}\n          >\n            <TokenSkeleton />\n          </Box>\n        </Box>\n      </Card>\n    </PageContainer>\n  )\n}\n"],"mappings":";;;;;;AAMA,MAAa,mCAAgD;AAC3D,QACE,qBAAC,eAAD,EAAA,UAAA,CACE,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,MAAM;GACN,gBAAgB;GACjB;YAPH,CASE,oBAAC,UAAD;GAAU,OAAO;GAAI,QAAQ;GAAI,SAAQ;GAAS,CAAA,EAClD,oBAAC,UAAD;GAAU,OAAO;GAAI,QAAQ;GAAI,SAAQ;GAAS,CAAA,CAC9C;KACN,qBAACA,QAAD;EAAM,IAAI;GAAE,UAAU;GAAG,cAAc;GAAG;YAA1C,CACE,oBAAC,KAAD;GACE,IAAI,EACF,IAAI,KACL;aAED,oBAAC,UAAD;IAAU,OAAO;IAAI,QAAQ;IAAI,SAAQ;IAAY,CAAA;GACjD,CAAA,EACN,qBAAC,KAAD;GACE,IAAI,EACF,IAAI,GACL;aAHH;IAME,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAiB,CAAA;KACb,CAAA;IAEN,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAe,oBAAA,MAAqB,CAAA;KAChC,CAAA;IAEL,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,KAAK,GAAG,QACjC,qBAAC,KAAD;KAEE,IAAI;MACF,IAAI;MACJ,SAAS;MACT,YAAY;MACb;eANH,CAQE,oBAAC,UAAD;MACE,SAAQ;MACR,OAAO;MACP,QAAQ;MACR,IAAI,EACF,cAAc,QACf;MACD,CAAA,EACF,oBAAC,UAAD;MACE,IAAI,EACF,IAAI,GACL;MACD,OAAO;MACP,QAAQ;MACR,SAAQ;MACR,CAAA,CACE;OAvBC,IAuBD,CACN;IAEF,oBAAC,KAAD;KACE,IAAI,EACF,IAAI,GACL;eAED,oBAAC,eAAD,EAAiB,CAAA;KACb,CAAA;IACF;KACD;IACO,EAAA,CAAA"}

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

@@ -1,32 +1,66 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded';
-import OpenInNew from '@mui/icons-material/OpenInNew';
-import { Box, Typography } from '@mui/material';
-import { useTranslation } from 'react-i18next';
-import { Card } from '../../components/Card/Card.js';
-import { CardIconButton } from '../../components/Card/CardIconButton.js';
-import { CardTitle } from '../../components/Card/CardTitle.js';
-export const TransferIdCard = ({ transferId, txLink }) => {
-    const { t } = useTranslation();
-    const copyTransferId = async () => {
-        await navigator.clipboard.writeText(transferId);
-    };
-    const openTransferIdInExplorer = () => {
-        window.open(txLink, '_blank');
-    };
-    return (_jsxs(Card, { sx: { marginTop: 2 }, children: [_jsxs(Box, { sx: {
-                    display: 'flex',
-                    flex: 1,
-                }, children: [_jsx(CardTitle, { flex: 1, children: t('main.transferId') }), _jsxs(Box, { sx: {
-                            gap: 1,
-                            display: 'flex',
-                            marginRight: 2,
-                            marginTop: 1,
-                        }, children: [_jsx(CardIconButton, { size: "small", onClick: copyTransferId, children: _jsx(ContentCopyRounded, { fontSize: "inherit" }) }), txLink ? (_jsx(CardIconButton, { size: "small", onClick: openTransferIdInExplorer, children: _jsx(OpenInNew, { fontSize: "inherit" }) })) : null] })] }), _jsx(Typography, { variant: "body2", sx: {
-                    pt: 1,
-                    pb: 2,
-                    px: 2,
-                    wordBreak: 'break-all',
-                }, children: transferId })] }));
+import { useWidgetConfig } from "../../providers/WidgetProvider/WidgetProvider.js";
+import { HiddenUI } from "../../types/widget.js";
+import { Card as Card$1 } from "../../components/Card/Card.js";
+import { CardIconButton } from "../../components/Card/CardIconButton.js";
+import { CardTitle } from "../../components/Card/CardTitle.js";
+import { ContactSupportButton } from "./ContactSupportButton.js";
+import { Box, Typography } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import ContentCopyRounded from "@mui/icons-material/ContentCopyRounded";
+import OpenInNew from "@mui/icons-material/OpenInNew";
+//#region src/pages/TransactionDetailsPage/TransferIdCard.tsx
+const TransferIdCard = ({ transferId, txLink }) => {
+	const { t } = useTranslation();
+	const { hiddenUI } = useWidgetConfig();
+	const copyTransferId = async () => {
+		await navigator.clipboard.writeText(transferId);
+	};
+	const openTransferIdInExplorer = () => {
+		window.open(txLink, "_blank");
+	};
+	return /* @__PURE__ */ jsxs(Card$1, {
+		type: "default",
+		indented: true,
+		children: [/* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "space-between"
+			},
+			children: [/* @__PURE__ */ jsx(CardTitle, {
+				sx: { p: 0 },
+				children: t("main.transferId")
+			}), /* @__PURE__ */ jsxs(Box, {
+				sx: {
+					gap: 1,
+					display: "flex"
+				},
+				children: [
+					/* @__PURE__ */ jsx(CardIconButton, {
+						size: "small",
+						onClick: copyTransferId,
+						children: /* @__PURE__ */ jsx(ContentCopyRounded, { fontSize: "inherit" })
+					}),
+					txLink ? /* @__PURE__ */ jsx(CardIconButton, {
+						size: "small",
+						onClick: openTransferIdInExplorer,
+						children: /* @__PURE__ */ jsx(OpenInNew, { fontSize: "inherit" })
+					}) : null,
+					!hiddenUI?.includes(HiddenUI.ContactSupport) ? /* @__PURE__ */ jsx(ContactSupportButton, { supportId: transferId }) : null
+				]
+			})]
+		}), /* @__PURE__ */ jsx(Typography, {
+			variant: "body2",
+			sx: {
+				pt: 2,
+				wordBreak: "break-all"
+			},
+			children: transferId
+		})]
+	});
 };
+//#endregion
+export { TransferIdCard };
+
 //# sourceMappingURL=TransferIdCard.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TransferIdCard.js","sourceRoot":"","sources":["../../../../src/pages/TransactionDetailsPage/TransferIdCard.tsx"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,MAAM,wCAAwC,CAAA;AACvE,OAAO,SAAS,MAAM,+BAA+B,CAAA;AACrD,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,+BAA+B,CAAA;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAA;AAO9D,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,UAAU,EAAE,MAAM,EAAuB,EAAE,EAAE;IAC5E,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAE9B,MAAM,cAAc,GAAG,KAAK,IAAI,EAAE;QAChC,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,UAAU,CAAC,CAAA;IACjD,CAAC,CAAA;IAED,MAAM,wBAAwB,GAAG,GAAG,EAAE;QACpC,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;IAC/B,CAAC,CAAA;IAED,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,aACxB,MAAC,GAAG,IACF,EAAE,EAAE;oBACF,OAAO,EAAE,MAAM;oBACf,IAAI,EAAE,CAAC;iBACR,aAED,KAAC,SAAS,IAAC,IAAI,EAAE,CAAC,YAAG,CAAC,CAAC,iBAAiB,CAAC,GAAa,EACtD,MAAC,GAAG,IACF,EAAE,EAAE;4BACF,GAAG,EAAE,CAAC;4BACN,OAAO,EAAE,MAAM;4BACf,WAAW,EAAE,CAAC;4BACd,SAAS,EAAE,CAAC;yBACb,aAED,KAAC,cAAc,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,cAAc,YAClD,KAAC,kBAAkB,IAAC,QAAQ,EAAC,SAAS,GAAG,GAC1B,EAChB,MAAM,CAAC,CAAC,CAAC,CACR,KAAC,cAAc,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,wBAAwB,YAC5D,KAAC,SAAS,IAAC,QAAQ,EAAC,SAAS,GAAG,GACjB,CAClB,CAAC,CAAC,CAAC,IAAI,IACJ,IACF,EACN,KAAC,UAAU,IACT,OAAO,EAAC,OAAO,EACf,EAAE,EAAE;oBACF,EAAE,EAAE,CAAC;oBACL,EAAE,EAAE,CAAC;oBACL,EAAE,EAAE,CAAC;oBACL,SAAS,EAAE,WAAW;iBACvB,YAEA,UAAU,GACA,IACR,CACR,CAAA;AACH,CAAC,CAAA"}
+{"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 { HiddenUI } from '../../types/widget.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?.includes(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,gBAAgB;CAC9B,MAAM,EAAE,aAAa,iBAAiB;CAEtC,MAAM,iBAAiB,YAAY;AACjC,QAAM,UAAU,UAAU,UAAU,WAAW;;CAGjD,MAAM,iCAAiC;AACrC,SAAO,KAAK,QAAQ,SAAS;;AAG/B,QACE,qBAACA,QAAD;EAAM,MAAK;EAAU,UAAA;YAArB,CACE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IACjB;aALH,CAOE,oBAAC,WAAD;IAAW,IAAI,EAAE,GAAG,GAAG;cAAG,EAAE,kBAAkB;IAAa,CAAA,EAC3D,qBAAC,KAAD;IACE,IAAI;KACF,KAAK;KACL,SAAS;KACV;cAJH;KAME,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,oBAAD,EAAoB,UAAS,WAAY,CAAA;MAC1B,CAAA;KAChB,SACC,oBAAC,gBAAD;MAAgB,MAAK;MAAQ,SAAS;gBACpC,oBAAC,WAAD,EAAW,UAAS,WAAY,CAAA;MACjB,CAAA,GACf;KACH,CAAC,UAAU,SAAS,SAAS,eAAe,GAC3C,oBAAC,sBAAD,EAAsB,WAAW,YAAc,CAAA,GAC7C;KACA;MACF;MACN,oBAAC,YAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IACJ,WAAW;IACZ;aAEA;GACU,CAAA,CACR"}

package/dist/esm/pages/TransactionPage/ConfirmToAddressSheet.js

@@ -1,39 +1,81 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Wallet from '@mui/icons-material/Wallet';
-import WarningRounded from '@mui/icons-material/WarningRounded';
-import { Button, Typography } from '@mui/material';
-import { forwardRef, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import { BottomSheet } from '../../components/BottomSheet/BottomSheet.js';
-import { AlertMessage } from '../../components/Messages/AlertMessage.js';
-import { useChain } from '../../hooks/useChain.js';
-import { useSetContentHeight } from '../../hooks/useSetContentHeight.js';
-import { useWidgetEvents } from '../../hooks/useWidgetEvents.js';
-import { WidgetEvent } from '../../types/events.js';
-import { IconContainer, SendToWalletButtonRow, SendToWalletSheetContainer, SheetAddressContainer, } from '../SendToWallet/SendToWalletPage.style.js';
-export const ConfirmToAddressSheet = forwardRef((props, ref) => {
-    const handleClose = () => {
-        ;
-        ref.current?.close();
-    };
-    return (_jsx(BottomSheet, { ref: ref, children: _jsx(ConfirmToAddressSheetContent, { ...props, onClose: handleClose }) }));
+import { useWidgetEvents } from "../../hooks/useWidgetEvents.js";
+import { WidgetEvent } from "../../types/events.js";
+import { useChain } from "../../hooks/useChain.js";
+import { AlertMessage } from "../../components/Messages/AlertMessage.js";
+import { BottomSheet } from "../../components/BottomSheet/BottomSheet.js";
+import { IconContainer, SendToWalletButtonRow, SendToWalletSheetContainer, SheetAddressContainer } from "../SendToWallet/SendToWalletPage.style.js";
+import { useSetContentHeight } from "../../hooks/useSetContentHeight.js";
+import { forwardRef, useRef } from "react";
+import { Button, Typography } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import Wallet from "@mui/icons-material/Wallet";
+import WarningRounded from "@mui/icons-material/WarningRounded";
+//#region src/pages/TransactionPage/ConfirmToAddressSheet.tsx
+const ConfirmToAddressSheet = forwardRef((props, ref) => {
+	const handleClose = () => {
+		ref.current?.close();
+	};
+	return /* @__PURE__ */ jsx(BottomSheet, {
+		ref,
+		children: /* @__PURE__ */ jsx(ConfirmToAddressSheetContent, {
+			...props,
+			onClose: handleClose
+		})
+	});
 });
 const ConfirmToAddressSheetContent = ({ onContinue, onClose, toAddress, toChainId }) => {
-    const { t } = useTranslation();
-    const { chain } = useChain(toChainId);
-    const emitter = useWidgetEvents();
-    const ref = useRef(null);
-    useSetContentHeight(ref);
-    const handleContinue = () => {
-        emitter.emit(WidgetEvent.LowAddressActivityConfirmed, {
-            address: toAddress,
-            chainId: toChainId,
-        });
-        onClose();
-        onContinue();
-    };
-    return (_jsxs(SendToWalletSheetContainer, { ref: ref, children: [_jsx(IconContainer, { children: _jsx(Wallet, { sx: { fontSize: 40 } }) }), _jsx(Typography, { variant: "h6", sx: { textAlign: 'center', mb: 2 }, children: t('warning.title.lowAddressActivity') }), _jsx(SheetAddressContainer, { children: _jsx(Typography, { children: toAddress }) }), _jsx(AlertMessage, { severity: "warning", title: _jsx(Typography, { variant: "body2", sx: { color: 'text.primary' }, children: t('warning.message.lowAddressActivity', {
-                        chainName: chain?.name,
-                    }) }), icon: _jsx(WarningRounded, {}), multiline: true }), _jsxs(SendToWalletButtonRow, { children: [_jsx(Button, { variant: "text", onClick: onClose, fullWidth: true, children: t('button.cancel') }), _jsx(Button, { variant: "contained", onClick: handleContinue, fullWidth: true, children: t('button.continue') })] })] }));
+	const { t } = useTranslation();
+	const { chain } = useChain(toChainId);
+	const emitter = useWidgetEvents();
+	const ref = useRef(null);
+	useSetContentHeight(ref);
+	const handleContinue = () => {
+		emitter.emit(WidgetEvent.LowAddressActivityConfirmed, {
+			address: toAddress,
+			chainId: toChainId
+		});
+		onClose();
+		onContinue();
+	};
+	return /* @__PURE__ */ jsxs(SendToWalletSheetContainer, {
+		ref,
+		children: [
+			/* @__PURE__ */ jsx(IconContainer, { children: /* @__PURE__ */ jsx(Wallet, { sx: { fontSize: 40 } }) }),
+			/* @__PURE__ */ jsx(Typography, {
+				variant: "h6",
+				sx: {
+					textAlign: "center",
+					mb: 2
+				},
+				children: t("warning.title.lowAddressActivity")
+			}),
+			/* @__PURE__ */ jsx(SheetAddressContainer, { children: /* @__PURE__ */ jsx(Typography, { children: toAddress }) }),
+			/* @__PURE__ */ jsx(AlertMessage, {
+				severity: "warning",
+				title: /* @__PURE__ */ jsx(Typography, {
+					variant: "body2",
+					sx: { color: "text.primary" },
+					children: t("warning.message.lowAddressActivity", { chainName: chain?.name })
+				}),
+				icon: /* @__PURE__ */ jsx(WarningRounded, {}),
+				multiline: true
+			}),
+			/* @__PURE__ */ jsxs(SendToWalletButtonRow, { children: [/* @__PURE__ */ jsx(Button, {
+				variant: "text",
+				onClick: onClose,
+				fullWidth: true,
+				children: t("button.cancel")
+			}), /* @__PURE__ */ jsx(Button, {
+				variant: "contained",
+				onClick: handleContinue,
+				fullWidth: true,
+				children: t("button.continue")
+			})] })
+		]
+	});
 };
+//#endregion
+export { ConfirmToAddressSheet };
+
 //# sourceMappingURL=ConfirmToAddressSheet.js.map