@lifi/widget 4.0.0-beta.9 → 4.0.0

package/dist/esm/components/TokenRate/TokenRate.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenRate.js","sourceRoot":"","sources":["../../../../src/components/TokenRate/TokenRate.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAsB,MAAM,WAAW,CAAA;AAG3D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAChC,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAA;AAW1D,MAAM,YAAY,GAAG,MAAM,CAAiB,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IACpD,SAAS,EAAE,IAAI;IACf,eAAe,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC;CACzE,CAAC,CAAC,CAAA;AAEH,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/D,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAC9B,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,GAAG,YAAY,EAAE,CAAA;IAErD,MAAM,UAAU,GAAuC,CAAC,CAAC,EAAE,EAAE;QAC3D,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,eAAe,EAAE,CAAA;IACnB,CAAC,CAAA;IAED,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;IAEnC,MAAM,SAAS,GAAG;QAChB,GAAG,KAAK,CAAC,SAAS;QAClB,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC;KACjC,CAAA;IACD,MAAM,OAAO,GAAG;QACd,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,OAAO;YAC9B,QAAQ,EAAE,MAAM,CAAC,OAAO;YACxB,KAAK,CAAC,OAAO,CAAC;QAChB,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ;YACnC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC;YACrC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;KAC3B,CAAA;IAED,MAAM,UAAU,GACd,MAAM,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,MAAO,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;QACjE,MAAM,CAAC,UAAU,CAAC,WAAW,CAAC,SAAS,CAAC,MAAO,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAA;IACvE,MAAM,UAAU,GACd,MAAM,CAAC,UAAU,CAAC,WAAW,CAAC,SAAS,CAAC,MAAO,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;QACrE,MAAM,CAAC,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,MAAO,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEnE,MAAM,QAAQ,GAAG,SAAS;QACxB,CAAC,CAAC,KAAK,SAAS,CAAC,MAAM,MAAM,CAAC,CAAC,oBAAoB,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,IAAI,OAAO,CAAC,MAAM,EAAE;QAC/F,CAAC,CAAC,KAAK,OAAO,CAAC,MAAM,MAAM,CAAC,CAAC,oBAAoB,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,IAAI,SAAS,CAAC,MAAM,EAAE,CAAA;IAEjG,OAAO,CACL,KAAC,mBAAmB,IAAC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,YACpD,QAAQ,GACW,CACvB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TokenRate.js","names":[],"sources":["../../../../src/components/TokenRate/TokenRate.tsx"],"sourcesContent":["import { formatUnits, type RouteExtended } from '@lifi/sdk'\nimport type { TypographyProps } from '@mui/material'\nimport type { MouseEventHandler } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { create } from 'zustand'\nimport { TokenRateTypography } from './TokenRate.style.js'\n\ninterface TokenRateProps extends TypographyProps {\n  route: RouteExtended\n}\n\ninterface TokenRateState {\n  isForward: boolean\n  toggleIsForward(): void\n}\n\nconst useTokenRate = create<TokenRateState>((set) => ({\n  isForward: true,\n  toggleIsForward: () => set((state) => ({ isForward: !state.isForward })),\n}))\n\nexport const TokenRate: React.FC<TokenRateProps> = ({ route }) => {\n  const { t } = useTranslation()\n  const { isForward, toggleIsForward } = useTokenRate()\n\n  const toggleRate: MouseEventHandler<HTMLSpanElement> = (e) => {\n    e.stopPropagation()\n    toggleIsForward()\n  }\n\n  const lastStep = route.steps.at(-1)\n\n  const fromToken = {\n    ...route.fromToken,\n    amount: BigInt(route.fromAmount),\n  }\n  const toToken = {\n    ...(lastStep?.execution?.toToken ??\n      lastStep?.action.toToken ??\n      route.toToken),\n    amount: lastStep?.execution?.toAmount\n      ? BigInt(lastStep.execution.toAmount)\n      : BigInt(route.toAmount),\n  }\n\n  const fromToRate =\n    Number.parseFloat(formatUnits(toToken.amount!, toToken.decimals)) /\n    Number.parseFloat(formatUnits(fromToken.amount!, fromToken.decimals))\n  const toFromRate =\n    Number.parseFloat(formatUnits(fromToken.amount!, fromToken.decimals)) /\n    Number.parseFloat(formatUnits(toToken.amount!, toToken.decimals))\n\n  const rateText = isForward\n    ? `1 ${fromToken.symbol} ≈ ${t('format.tokenAmount', { value: fromToRate })} ${toToken.symbol}`\n    : `1 ${toToken.symbol} ≈ ${t('format.tokenAmount', { value: toFromRate })} ${fromToken.symbol}`\n\n  return (\n    <TokenRateTypography onClick={toggleRate} role=\"button\">\n      {rateText}\n    </TokenRateTypography>\n  )\n}\n"],"mappings":";;;;;;AAgBA,MAAM,eAAe,QAAwB,SAAS;CACpD,WAAW;CACX,uBAAuB,KAAK,WAAW,EAAE,WAAW,CAAC,MAAM,UAAU,EAAE;AACzE,EAAE;AAEF,MAAa,aAAuC,EAAE,YAAY;CAChE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,WAAW,oBAAoB,aAAa;CAEpD,MAAM,cAAkD,MAAM;EAC5D,EAAE,gBAAgB;EAClB,gBAAgB;CAClB;CAEA,MAAM,WAAW,MAAM,MAAM,GAAG,EAAE;CAElC,MAAM,YAAY;EAChB,GAAG,MAAM;EACT,QAAQ,OAAO,MAAM,UAAU;CACjC;CACA,MAAM,UAAU;EACd,GAAI,UAAU,WAAW,WACvB,UAAU,OAAO,WACjB,MAAM;EACR,QAAQ,UAAU,WAAW,WACzB,OAAO,SAAS,UAAU,QAAQ,IAClC,OAAO,MAAM,QAAQ;CAC3B;CAEA,MAAM,aACJ,OAAO,WAAW,YAAY,QAAQ,QAAS,QAAQ,QAAQ,CAAC,IAChE,OAAO,WAAW,YAAY,UAAU,QAAS,UAAU,QAAQ,CAAC;CACtE,MAAM,aACJ,OAAO,WAAW,YAAY,UAAU,QAAS,UAAU,QAAQ,CAAC,IACpE,OAAO,WAAW,YAAY,QAAQ,QAAS,QAAQ,QAAQ,CAAC;CAMlE,OACE,oBAAC,qBAAD;EAAqB,SAAS;EAAY,MAAK;YALhC,YACb,KAAK,UAAU,OAAO,KAAK,EAAE,sBAAsB,EAAE,OAAO,WAAW,CAAC,EAAE,GAAG,QAAQ,WACrF,KAAK,QAAQ,OAAO,KAAK,EAAE,sBAAsB,EAAE,OAAO,WAAW,CAAC,EAAE,GAAG,UAAU;CAKlE,CAAA;AAEzB"}

package/dist/esm/components/TokenRate/TokenRate.style.js

@@ -1,17 +1,19 @@
-import { styled, Typography } from '@mui/material';
-export const TokenRateTypography = styled(Typography)(({ theme }) => ({
-    fontSize: 14,
-    lineHeight: 1.429,
-    fontWeight: 500,
-    color: theme.vars.palette.text.primary,
-    cursor: 'pointer',
-    '&:hover': {
-        opacity: 1,
-    },
-    opacity: 0.56,
-    transition: theme.transitions.create(['opacity'], {
-        duration: theme.transitions.duration.enteringScreen,
-        easing: theme.transitions.easing.easeOut,
-    }),
+import { Typography, styled } from "@mui/material";
+//#region src/components/TokenRate/TokenRate.style.ts
+const TokenRateTypography = styled(Typography)(({ theme }) => ({
+	fontSize: 14,
+	lineHeight: 1.429,
+	fontWeight: 500,
+	color: theme.vars.palette.text.primary,
+	cursor: "pointer",
+	"&:hover": { opacity: 1 },
+	opacity: .56,
+	transition: theme.transitions.create(["opacity"], {
+		duration: theme.transitions.duration.enteringScreen,
+		easing: theme.transitions.easing.easeOut
+	})
 }));
+//#endregion
+export { TokenRateTypography };
+
 //# sourceMappingURL=TokenRate.style.js.map

package/dist/esm/components/TokenRate/TokenRate.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenRate.style.js","sourceRoot":"","sources":["../../../../src/components/TokenRate/TokenRate.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAElD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACpE,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,GAAG;IACf,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;IACtC,MAAM,EAAE,SAAS;IACjB,SAAS,EAAE;QACT,OAAO,EAAE,CAAC;KACX;IACD,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,EAAE;QAChD,QAAQ,EAAE,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc;QACnD,MAAM,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO;KACzC,CAAC;CACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"TokenRate.style.js","names":[],"sources":["../../../../src/components/TokenRate/TokenRate.style.ts"],"sourcesContent":["import { styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const TokenRateTypography: React.FC<\n  React.ComponentProps<typeof Typography>\n> = styled(Typography)(({ theme }) => ({\n  fontSize: 14,\n  lineHeight: 1.429,\n  fontWeight: 500,\n  color: theme.vars.palette.text.primary,\n  cursor: 'pointer',\n  '&:hover': {\n    opacity: 1,\n  },\n  opacity: 0.56,\n  transition: theme.transitions.create(['opacity'], {\n    duration: theme.transitions.duration.enteringScreen,\n    easing: theme.transitions.easing.easeOut,\n  }),\n}))\n"],"mappings":";;AAGA,MAAa,sBAET,OAAO,UAAU,GAAG,EAAE,aAAa;CACrC,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,OAAO,MAAM,KAAK,QAAQ,KAAK;CAC/B,QAAQ;CACR,WAAW,EACT,SAAS,EACX;CACA,SAAS;CACT,YAAY,MAAM,YAAY,OAAO,CAAC,SAAS,GAAG;EAChD,UAAU,MAAM,YAAY,SAAS;EACrC,QAAQ,MAAM,YAAY,OAAO;CACnC,CAAC;AACH,EAAE"}

package/dist/esm/components/Tools/ToolItem.js

@@ -1,16 +1,37 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Avatar, Checkbox, ListItemAvatar } from '@mui/material';
-import { memo } from 'react';
-import { ListItemText } from '../ListItemText.js';
-import { SettingsListItemButton } from '../SettingsListItemButton.js';
-export const ToolItem = memo(({ tool, typeKey, isEnabled, onToggle }) => {
-    const handleClick = () => {
-        onToggle(tool.key);
-    };
-    const handleCheckboxClick = (e) => {
-        e.stopPropagation();
-        onToggle(tool.key);
-    };
-    return (_jsxs(SettingsListItemButton, { onClick: handleClick, children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, { src: tool.logoURI, alt: tool.name, children: tool.name[0] }) }), _jsx(ListItemText, { primary: tool.name }), _jsx(Checkbox, { id: `${typeKey}-${tool.key}-checkbox`, checked: isEnabled, onChange: handleClick, onClick: handleCheckboxClick, sx: { mr: -1 } })] }));
+import { ListItemText as ListItemText$1 } from "../ListItemText.js";
+import { SettingsListItemButton } from "../SettingsListItemButton.js";
+import { memo } from "react";
+import { Avatar, Checkbox, ListItemAvatar } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Tools/ToolItem.tsx
+const ToolItem = memo(({ tool, typeKey, isEnabled, onToggle }) => {
+	const handleClick = () => {
+		onToggle(tool.key);
+	};
+	const handleCheckboxClick = (e) => {
+		e.stopPropagation();
+		onToggle(tool.key);
+	};
+	return /* @__PURE__ */ jsxs(SettingsListItemButton, {
+		onClick: handleClick,
+		children: [
+			/* @__PURE__ */ jsx(ListItemAvatar, { children: /* @__PURE__ */ jsx(Avatar, {
+				src: tool.logoURI,
+				alt: tool.name,
+				children: tool.name[0]
+			}) }),
+			/* @__PURE__ */ jsx(ListItemText$1, { primary: tool.name }),
+			/* @__PURE__ */ jsx(Checkbox, {
+				id: `${typeKey}-${tool.key}-checkbox`,
+				checked: isEnabled,
+				onChange: handleClick,
+				onClick: handleCheckboxClick,
+				sx: { mr: -1 }
+			})
+		]
+	});
 });
+//#endregion
+export { ToolItem };
+
 //# sourceMappingURL=ToolItem.js.map

package/dist/esm/components/Tools/ToolItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolItem.js","sourceRoot":"","sources":["../../../../src/components/Tools/ToolItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAC5B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AASrE,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAC1B,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;IACzC,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,MAAM,mBAAmB,GAAG,CAAC,CAAmB,EAAE,EAAE;QAClD,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,OAAO,CACL,MAAC,sBAAsB,IAAC,OAAO,EAAE,WAAW,aAC1C,KAAC,cAAc,cACb,KAAC,MAAM,IAAC,GAAG,EAAE,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,IAAI,YACtC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GACN,GACM,EACjB,KAAC,YAAY,IAAC,OAAO,EAAE,IAAI,CAAC,IAAI,GAAI,EACpC,KAAC,QAAQ,IACP,EAAE,EAAE,GAAG,OAAO,IAAI,IAAI,CAAC,GAAG,WAAW,EACrC,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,WAAW,EACrB,OAAO,EAAE,mBAAmB,EAC5B,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,GACd,IACqB,CAC1B,CAAA;AACH,CAAC,CACF,CAAA"}
+{"version":3,"file":"ToolItem.js","names":["ListItemText"],"sources":["../../../../src/components/Tools/ToolItem.tsx"],"sourcesContent":["import { Avatar, Checkbox, ListItemAvatar } from '@mui/material'\nimport { memo, type NamedExoticComponent } from 'react'\nimport { ListItemText } from '../ListItemText.js'\nimport { SettingsListItemButton } from '../SettingsListItemButton.js'\n\ninterface ToolItemProps {\n  tool: any\n  typeKey: string\n  isEnabled: boolean\n  onToggle: (key: string) => void\n}\n\nexport const ToolItem: NamedExoticComponent<ToolItemProps> =\n  memo<ToolItemProps>(({ tool, typeKey, isEnabled, onToggle }) => {\n    const handleClick = () => {\n      onToggle(tool.key)\n    }\n\n    const handleCheckboxClick = (e: React.MouseEvent) => {\n      e.stopPropagation()\n      onToggle(tool.key)\n    }\n\n    return (\n      <SettingsListItemButton onClick={handleClick}>\n        <ListItemAvatar>\n          <Avatar src={tool.logoURI} alt={tool.name}>\n            {tool.name[0]}\n          </Avatar>\n        </ListItemAvatar>\n        <ListItemText primary={tool.name} />\n        <Checkbox\n          id={`${typeKey}-${tool.key}-checkbox`}\n          checked={isEnabled}\n          onChange={handleClick}\n          onClick={handleCheckboxClick}\n          sx={{ mr: -1 }}\n        />\n      </SettingsListItemButton>\n    )\n  })\n"],"mappings":";;;;;;AAYA,MAAa,WACX,MAAqB,EAAE,MAAM,SAAS,WAAW,eAAe;CAC9D,MAAM,oBAAoB;EACxB,SAAS,KAAK,GAAG;CACnB;CAEA,MAAM,uBAAuB,MAAwB;EACnD,EAAE,gBAAgB;EAClB,SAAS,KAAK,GAAG;CACnB;CAEA,OACE,qBAAC,wBAAD;EAAwB,SAAS;YAAjC;GACE,oBAAC,gBAAD,EAAA,UACE,oBAAC,QAAD;IAAQ,KAAK,KAAK;IAAS,KAAK,KAAK;cAClC,KAAK,KAAK;GACL,CAAA,EACM,CAAA;GAChB,oBAACA,gBAAD,EAAc,SAAS,KAAK,KAAO,CAAA;GACnC,oBAAC,UAAD;IACE,IAAI,GAAG,QAAQ,GAAG,KAAK,IAAI;IAC3B,SAAS;IACT,UAAU;IACV,SAAS;IACT,IAAI,EAAE,IAAI,GAAG;GACd,CAAA;EACqB;;AAE5B,CAAC"}

package/dist/esm/components/Tools/Tools.js

@@ -1,32 +1,50 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useSettingsStore } from '../../stores/settings/SettingsStore.js';
-import { useSettingsActions } from '../../stores/settings/useSettingsActions.js';
-import { SearchList } from '../Search/SearchInput.style.js';
-import { SearchNotFound } from '../Search/SearchNotFound.js';
-import { ToolItem } from './ToolItem.js';
-export const Tools = ({ filteredTools, type }) => {
-    const { t } = useTranslation();
-    const typeKey = type.toLowerCase();
-    const enabledTools = useSettingsStore((state) => state[`_enabled${type}`]);
-    const { setToolValue } = useSettingsActions();
-    // Use ref to access current enabledTools without causing re-renders
-    const enabledToolsRef = useRef(enabledTools);
-    enabledToolsRef.current = enabledTools;
-    const toggleCallbacks = useMemo(() => {
-        const callbacks = {};
-        filteredTools.forEach((tool) => {
-            callbacks[tool.key] = () => {
-                // Access current state via ref to avoid dependency on enabledTools
-                setToolValue(type, tool.key, !enabledToolsRef.current[tool.key]);
-            };
-        });
-        return callbacks;
-    }, [filteredTools, setToolValue, type]);
-    if (!filteredTools.length) {
-        return (_jsx(SearchNotFound, { message: t(`info.message.empty${type}List`), adjustForStickySearchInput: true }));
-    }
-    return (_jsx(SearchList, { className: "long-list", "data-testid": `${typeKey}-list`, children: filteredTools.map((tool) => (_jsx(ToolItem, { tool: tool, typeKey: typeKey, isEnabled: enabledTools[tool.key], onToggle: toggleCallbacks[tool.key] }, tool.key))) }));
+import { useSettingsStore } from "../../stores/settings/SettingsStore.js";
+import { useSettingsActions } from "../../stores/settings/useSettingsActions.js";
+import { SearchNotFound } from "../Search/SearchNotFound.js";
+import { ToolItem } from "./ToolItem.js";
+import { useMemo, useRef } from "react";
+import { List } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+//#region src/components/Tools/Tools.tsx
+const Tools = ({ filteredTools, type }) => {
+	const { t } = useTranslation();
+	const typeKey = type.toLowerCase();
+	const enabledTools = useSettingsStore((state) => state[`_enabled${type}`]);
+	const { setToolValue } = useSettingsActions();
+	const enabledToolsRef = useRef(enabledTools);
+	enabledToolsRef.current = enabledTools;
+	const toggleCallbacks = useMemo(() => {
+		const callbacks = {};
+		filteredTools.forEach((tool) => {
+			callbacks[tool.key] = () => {
+				setToolValue(type, tool.key, !enabledToolsRef.current[tool.key]);
+			};
+		});
+		return callbacks;
+	}, [
+		filteredTools,
+		setToolValue,
+		type
+	]);
+	if (!filteredTools.length) return /* @__PURE__ */ jsx(SearchNotFound, { message: t(`info.message.empty${type}List`) });
+	return /* @__PURE__ */ jsx(List, {
+		className: "long-list",
+		disablePadding: true,
+		"data-testid": `${typeKey}-list`,
+		sx: {
+			px: 1.5,
+			pb: 2
+		},
+		children: filteredTools.map((tool) => /* @__PURE__ */ jsx(ToolItem, {
+			tool,
+			typeKey,
+			isEnabled: enabledTools[tool.key],
+			onToggle: toggleCallbacks[tool.key]
+		}, tool.key))
+	});
 };
+//#endregion
+export { Tools };
+
 //# sourceMappingURL=Tools.js.map

package/dist/esm/components/Tools/Tools.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tools.js","sourceRoot":"","sources":["../../../../src/components/Tools/Tools.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAA;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAA;AAChF,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAA;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAWxC,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,aAAa,EAAE,IAAI,EAAc,EAAE,EAAE;IAC3D,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAA6B,CAAA;IAC7D,MAAM,YAAY,GAAG,gBAAgB,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,CAAA;IAC1E,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAA;IAE7C,oEAAoE;IACpE,MAAM,eAAe,GAAG,MAAM,CAAC,YAAY,CAAC,CAAA;IAC5C,eAAe,CAAC,OAAO,GAAG,YAAY,CAAA;IACtC,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,SAAS,GAA+B,EAAE,CAAA;QAChD,aAAa,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YAC7B,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,EAAE;gBACzB,mEAAmE;gBACnE,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAA;YAClE,CAAC,CAAA;QACH,CAAC,CAAC,CAAA;QACF,OAAO,SAAS,CAAA;IAClB,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC,CAAA;IAEvC,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC;QAC1B,OAAO,CACL,KAAC,cAAc,IACb,OAAO,EAAE,CAAC,CAAC,qBAAqB,IAAI,MAAM,CAAC,EAC3C,0BAA0B,SAC1B,CACH,CAAA;IACH,CAAC;IAED,OAAO,CACL,KAAC,UAAU,IAAC,SAAS,EAAC,WAAW,iBAAc,GAAG,OAAO,OAAO,YAC7D,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,KAAC,QAAQ,IAEP,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EACjC,QAAQ,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,IAJ9B,IAAI,CAAC,GAAG,CAKb,CACH,CAAC,GACS,CACd,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Tools.js","names":[],"sources":["../../../../src/components/Tools/Tools.tsx"],"sourcesContent":["import type { ToolsResponse } from '@lifi/sdk'\nimport { List } from '@mui/material'\nimport { type JSX, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useSettingsStore } from '../../stores/settings/SettingsStore.js'\nimport { useSettingsActions } from '../../stores/settings/useSettingsActions.js'\nimport { SearchNotFound } from '../Search/SearchNotFound.js'\nimport { ToolItem } from './ToolItem.js'\n\nexport type ToolCollectionTypes =\n  | ToolsResponse['exchanges']\n  | ToolsResponse['bridges']\n\ninterface ToolsProps {\n  filteredTools: ToolCollectionTypes\n  type: 'Bridges' | 'Exchanges'\n}\n\nexport const Tools = ({ filteredTools, type }: ToolsProps): JSX.Element => {\n  const { t } = useTranslation()\n  const typeKey = type.toLowerCase() as 'bridges' | 'exchanges'\n  const enabledTools = useSettingsStore((state) => state[`_enabled${type}`])\n  const { setToolValue } = useSettingsActions()\n\n  // Use ref to access current enabledTools without causing re-renders\n  const enabledToolsRef = useRef(enabledTools)\n  enabledToolsRef.current = enabledTools\n  const toggleCallbacks = useMemo(() => {\n    const callbacks: Record<string, () => void> = {}\n    filteredTools.forEach((tool) => {\n      callbacks[tool.key] = () => {\n        // Access current state via ref to avoid dependency on enabledTools\n        setToolValue(type, tool.key, !enabledToolsRef.current[tool.key])\n      }\n    })\n    return callbacks\n  }, [filteredTools, setToolValue, type])\n\n  if (!filteredTools.length) {\n    return <SearchNotFound message={t(`info.message.empty${type}List`)} />\n  }\n\n  return (\n    <List\n      className=\"long-list\"\n      disablePadding\n      data-testid={`${typeKey}-list`}\n      sx={{ px: 1.5, pb: 2 }}\n    >\n      {filteredTools.map((tool) => (\n        <ToolItem\n          key={tool.key}\n          tool={tool}\n          typeKey={typeKey}\n          isEnabled={enabledTools[tool.key]}\n          onToggle={toggleCallbacks[tool.key]}\n        />\n      ))}\n    </List>\n  )\n}\n"],"mappings":";;;;;;;;;AAkBA,MAAa,SAAS,EAAE,eAAe,WAAoC;CACzE,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,UAAU,KAAK,YAAY;CACjC,MAAM,eAAe,kBAAkB,UAAU,MAAM,WAAW,OAAO;CACzE,MAAM,EAAE,iBAAiB,mBAAmB;CAG5C,MAAM,kBAAkB,OAAO,YAAY;CAC3C,gBAAgB,UAAU;CAC1B,MAAM,kBAAkB,cAAc;EACpC,MAAM,YAAwC,CAAC;EAC/C,cAAc,SAAS,SAAS;GAC9B,UAAU,KAAK,aAAa;IAE1B,aAAa,MAAM,KAAK,KAAK,CAAC,gBAAgB,QAAQ,KAAK,IAAI;GACjE;EACF,CAAC;EACD,OAAO;CACT,GAAG;EAAC;EAAe;EAAc;CAAI,CAAC;CAEtC,IAAI,CAAC,cAAc,QACjB,OAAO,oBAAC,gBAAD,EAAgB,SAAS,EAAE,qBAAqB,KAAK,KAAK,EAAI,CAAA;CAGvE,OACE,oBAAC,MAAD;EACE,WAAU;EACV,gBAAA;EACA,eAAa,GAAG,QAAQ;EACxB,IAAI;GAAE,IAAI;GAAK,IAAI;EAAE;YAEpB,cAAc,KAAK,SAClB,oBAAC,UAAD;GAEQ;GACG;GACT,WAAW,aAAa,KAAK;GAC7B,UAAU,gBAAgB,KAAK;EAChC,GALM,KAAK,GAKX,CACF;CACG,CAAA;AAEV"}

package/dist/esm/components/TransactionCard/ActiveTransactionCard.js

@@ -0,0 +1,68 @@
+import { Card as Card$1 } from "../Card/Card.js";
+import { CircularProgressPending } from "../Timer/StepStatusTimer.style.js";
+import { useActionMessage } from "../../hooks/useActionMessage.js";
+import { getExpiryTimestamp } from "../../utils/timer.js";
+import { ActionRow } from "../ActionRow/ActionRow.js";
+import { IconCircle } from "../IconCircle/IconCircle.js";
+import { RouteTokens } from "../RouteCard/RouteTokens.js";
+import { ExecutionTimerText } from "../Timer/ExecutionTimerText.js";
+import { DeleteButton, PendingCircle } from "./ActiveTransactionCard.style.js";
+import { Tooltip, Typography } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import DeleteOutline from "@mui/icons-material/DeleteOutlined";
+//#region src/components/TransactionCard/ActiveTransactionCard.tsx
+const ActiveTransactionCard = ({ route, status, onClick, onDelete }) => {
+	const { t } = useTranslation();
+	const lastActiveStep = route.steps.findLast((step) => step.execution);
+	const lastActiveAction = lastActiveStep?.execution?.actions?.at(-1);
+	const { title } = useActionMessage(lastActiveStep, lastActiveAction);
+	const isFailed = status === 8;
+	return /* @__PURE__ */ jsxs(Card$1, {
+		onClick,
+		indented: true,
+		children: [/* @__PURE__ */ jsx(ActionRow, {
+			sx: { mb: 1.5 },
+			startAdornment: (() => {
+				if (isFailed) return /* @__PURE__ */ jsx(IconCircle, {
+					status: "error",
+					size: 24
+				});
+				if ([
+					"ACTION_REQUIRED",
+					"MESSAGE_REQUIRED",
+					"RESET_REQUIRED"
+				].includes(lastActiveAction?.status ?? "")) return /* @__PURE__ */ jsx(IconCircle, {
+					status: "info",
+					size: 24
+				});
+				return /* @__PURE__ */ jsx(PendingCircle, { children: /* @__PURE__ */ jsx(CircularProgressPending, {
+					size: 24,
+					sx: {
+						top: -2,
+						left: -2
+					}
+				}) });
+			})(),
+			message: title ?? "",
+			endAdornment: isFailed ? /* @__PURE__ */ jsx(Tooltip, {
+				title: t("button.clearTransaction"),
+				children: /* @__PURE__ */ jsx(DeleteButton, {
+					size: "small",
+					onClick: onDelete,
+					children: /* @__PURE__ */ jsx(DeleteOutline, { sx: { fontSize: 16 } })
+				})
+			}) : lastActiveStep?.execution?.signedAt ? /* @__PURE__ */ jsx(Typography, {
+				sx: {
+					fontSize: 12,
+					fontWeight: 600
+				},
+				children: /* @__PURE__ */ jsx(ExecutionTimerText, { expiryTimestamp: getExpiryTimestamp(lastActiveStep) })
+			}) : void 0
+		}), /* @__PURE__ */ jsx(RouteTokens, { route })]
+	});
+};
+//#endregion
+export { ActiveTransactionCard };
+
+//# sourceMappingURL=ActiveTransactionCard.js.map

package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActiveTransactionCard.js","names":["Card"],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport { Tooltip, Typography } from '@mui/material'\nimport type { JSX, MouseEvent } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useActionMessage } from '../../hooks/useActionMessage.js'\nimport { RouteExecutionStatus } from '../../stores/routes/types.js'\nimport { getExpiryTimestamp } from '../../utils/timer.js'\nimport { ActionRow } from '../ActionRow/ActionRow.js'\nimport { Card } from '../Card/Card.js'\nimport { IconCircle } from '../IconCircle/IconCircle.js'\nimport { RouteTokens } from '../RouteCard/RouteTokens.js'\nimport { ExecutionTimerText } from '../Timer/ExecutionTimerText.js'\nimport { CircularProgressPending } from '../Timer/StepStatusTimer.style.js'\nimport { DeleteButton, PendingCircle } from './ActiveTransactionCard.style.js'\n\ninterface ActiveTransactionCardProps {\n  route: RouteExtended\n  status?: RouteExecutionStatus\n  onClick: () => void\n  onDelete: (e: MouseEvent) => void\n}\n\nexport const ActiveTransactionCard = ({\n  route,\n  status,\n  onClick,\n  onDelete,\n}: ActiveTransactionCardProps): JSX.Element => {\n  const { t } = useTranslation()\n\n  const lastActiveStep = route.steps.findLast((step) => step.execution)\n  const lastActiveAction = lastActiveStep?.execution?.actions?.at(-1)\n  const { title } = useActionMessage(lastActiveStep, lastActiveAction)\n\n  const isFailed = status === RouteExecutionStatus.Failed\n\n  const statusIcon = (() => {\n    if (isFailed) {\n      return <IconCircle status=\"error\" size={24} />\n    }\n    if (\n      ['ACTION_REQUIRED', 'MESSAGE_REQUIRED', 'RESET_REQUIRED'].includes(\n        lastActiveAction?.status ?? ''\n      )\n    ) {\n      return <IconCircle status=\"info\" size={24} />\n    }\n    return (\n      <PendingCircle>\n        <CircularProgressPending size={24} sx={{ top: -2, left: -2 }} />\n      </PendingCircle>\n    )\n  })()\n\n  return (\n    <Card onClick={onClick} indented>\n      <ActionRow\n        sx={{ mb: 1.5 }}\n        startAdornment={statusIcon}\n        message={title ?? ''}\n        endAdornment={\n          isFailed ? (\n            <Tooltip title={t('button.clearTransaction')}>\n              <DeleteButton size=\"small\" onClick={onDelete}>\n                <DeleteOutline sx={{ fontSize: 16 }} />\n              </DeleteButton>\n            </Tooltip>\n          ) : lastActiveStep?.execution?.signedAt ? (\n            <Typography sx={{ fontSize: 12, fontWeight: 600 }}>\n              <ExecutionTimerText\n                expiryTimestamp={getExpiryTimestamp(lastActiveStep)}\n              />\n            </Typography>\n          ) : undefined\n        }\n      />\n      <RouteTokens route={route} />\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAuBA,MAAa,yBAAyB,EACpC,OACA,QACA,SACA,eAC6C;CAC7C,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,iBAAiB,MAAM,MAAM,UAAU,SAAS,KAAK,SAAS;CACpE,MAAM,mBAAmB,gBAAgB,WAAW,SAAS,GAAG,EAAE;CAClE,MAAM,EAAE,UAAU,iBAAiB,gBAAgB,gBAAgB;CAEnE,MAAM,WAAW,WAAA;CAoBjB,OACE,qBAACA,QAAD;EAAe;EAAS,UAAA;YAAxB,CACE,oBAAC,WAAD;GACE,IAAI,EAAE,IAAI,IAAI;GACd,uBAtBoB;IACxB,IAAI,UACF,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAQ,MAAM;IAAK,CAAA;IAE/C,IACE;KAAC;KAAmB;KAAoB;IAAgB,EAAE,SACxD,kBAAkB,UAAU,EAC9B,GAEA,OAAO,oBAAC,YAAD;KAAY,QAAO;KAAO,MAAM;IAAK,CAAA;IAE9C,OACE,oBAAC,eAAD,EAAA,UACE,oBAAC,yBAAD;KAAyB,MAAM;KAAI,IAAI;MAAE,KAAK;MAAI,MAAM;KAAG;IAAI,CAAA,EAClD,CAAA;GAEnB,GAM+B;GACzB,SAAS,SAAS;GAClB,cACE,WACE,oBAAC,SAAD;IAAS,OAAO,EAAE,yBAAyB;cACzC,oBAAC,cAAD;KAAc,MAAK;KAAQ,SAAS;eAClC,oBAAC,eAAD,EAAe,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;IAC1B,CAAA;GACP,CAAA,IACP,gBAAgB,WAAW,WAC7B,oBAAC,YAAD;IAAY,IAAI;KAAE,UAAU;KAAI,YAAY;IAAI;cAC9C,oBAAC,oBAAD,EACE,iBAAiB,mBAAmB,cAAc,EACnD,CAAA;GACS,CAAA,IACV,KAAA;EAEP,CAAA,GACD,oBAAC,aAAD,EAAoB,MAAQ,CAAA,CACxB;;AAEV"}

package/dist/esm/components/TransactionCard/ActiveTransactionCard.style.js

@@ -0,0 +1,21 @@
+import { Box, IconButton, styled } from "@mui/material";
+//#region src/components/TransactionCard/ActiveTransactionCard.style.tsx
+const PendingCircle = styled(Box)(({ theme }) => ({
+	position: "relative",
+	width: 24,
+	height: 24,
+	flexShrink: 0,
+	borderRadius: "50%",
+	border: `2px solid ${theme.vars.palette.grey[300]}`,
+	...theme.applyStyles("dark", { borderColor: theme.vars.palette.grey[800] })
+}));
+const DeleteButton = styled(IconButton)(({ theme }) => ({
+	padding: theme.spacing(.5),
+	backgroundColor: theme.vars.palette.background.paper,
+	width: 24,
+	height: 24
+}));
+//#endregion
+export { DeleteButton, PendingCircle };
+
+//# sourceMappingURL=ActiveTransactionCard.style.js.map

package/dist/esm/components/TransactionCard/ActiveTransactionCard.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActiveTransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/ActiveTransactionCard.style.tsx"],"sourcesContent":["import { Box, IconButton, styled } from '@mui/material'\nimport type React from 'react'\n\nexport const PendingCircle: React.FC<React.ComponentProps<typeof Box>> = styled(\n  Box\n)(({ theme }) => ({\n  position: 'relative',\n  width: 24,\n  height: 24,\n  flexShrink: 0,\n  borderRadius: '50%',\n  border: `2px solid ${theme.vars.palette.grey[300]}`,\n  ...theme.applyStyles('dark', {\n    borderColor: theme.vars.palette.grey[800],\n  }),\n}))\n\nexport const DeleteButton: React.FC<React.ComponentProps<typeof IconButton>> =\n  styled(IconButton)(({ theme }) => ({\n    padding: theme.spacing(0.5),\n    backgroundColor: theme.vars.palette.background.paper,\n    width: 24,\n    height: 24,\n  }))\n"],"mappings":";;AAGA,MAAa,gBAA4D,OACvE,GACF,GAAG,EAAE,aAAa;CAChB,UAAU;CACV,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,cAAc;CACd,QAAQ,aAAa,MAAM,KAAK,QAAQ,KAAK;CAC7C,GAAG,MAAM,YAAY,QAAQ,EAC3B,aAAa,MAAM,KAAK,QAAQ,KAAK,KACvC,CAAC;AACH,EAAE;AAEF,MAAa,eACX,OAAO,UAAU,GAAG,EAAE,aAAa;CACjC,SAAS,MAAM,QAAQ,EAAG;CAC1B,iBAAiB,MAAM,KAAK,QAAQ,WAAW;CAC/C,OAAO;CACP,QAAQ;AACV,EAAE"}

package/dist/esm/components/TransactionCard/TransactionCard.js

@@ -0,0 +1,32 @@
+import { Card as Card$1 } from "../Card/Card.js";
+import { RouteTokens } from "../RouteCard/RouteTokens.js";
+import { DateLabelContainer, DateLabelText } from "./TransactionCard.style.js";
+import { Box } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+//#region src/components/TransactionCard/TransactionCard.tsx
+const TransactionCard = ({ route, date, onClick }) => {
+	const { i18n } = useTranslation();
+	return /* @__PURE__ */ jsx(Card$1, {
+		indented: true,
+		onClick,
+		children: /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				flexDirection: "column",
+				gap: 1.5
+			},
+			children: [/* @__PURE__ */ jsxs(DateLabelContainer, { children: [/* @__PURE__ */ jsx(DateLabelText, {
+				color: "text.secondary",
+				children: date.toLocaleString(i18n.language, { dateStyle: "long" })
+			}), /* @__PURE__ */ jsx(DateLabelText, {
+				color: "text.secondary",
+				children: date.toLocaleString(i18n.language, { timeStyle: "short" })
+			})] }), /* @__PURE__ */ jsx(RouteTokens, { route })]
+		})
+	});
+};
+//#endregion
+export { TransactionCard };
+
+//# sourceMappingURL=TransactionCard.js.map

package/dist/esm/components/TransactionCard/TransactionCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionCard.js","names":["Card"],"sources":["../../../../src/components/TransactionCard/TransactionCard.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { Box } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Card } from '../Card/Card.js'\nimport { RouteTokens } from '../RouteCard/RouteTokens.js'\nimport { DateLabelContainer, DateLabelText } from './TransactionCard.style.js'\n\ninterface TransactionCardProps {\n  route: RouteExtended\n  date: Date\n  onClick?: () => void\n}\n\nexport const TransactionCard = ({\n  route,\n  date,\n  onClick,\n}: TransactionCardProps): JSX.Element => {\n  const { i18n } = useTranslation()\n\n  return (\n    <Card indented onClick={onClick}>\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n        <DateLabelContainer>\n          <DateLabelText color=\"text.secondary\">\n            {date.toLocaleString(i18n.language, { dateStyle: 'long' })}\n          </DateLabelText>\n          <DateLabelText color=\"text.secondary\">\n            {date.toLocaleString(i18n.language, { timeStyle: 'short' })}\n          </DateLabelText>\n        </DateLabelContainer>\n        <RouteTokens route={route} />\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;AAcA,MAAa,mBAAmB,EAC9B,OACA,MACA,cACuC;CACvC,MAAM,EAAE,SAAS,eAAe;CAEhC,OACE,oBAACA,QAAD;EAAM,UAAA;EAAkB;YACtB,qBAAC,KAAD;GAAK,IAAI;IAAE,SAAS;IAAQ,eAAe;IAAU,KAAK;GAAI;aAA9D,CACE,qBAAC,oBAAD,EAAA,UAAA,CACE,oBAAC,eAAD;IAAe,OAAM;cAClB,KAAK,eAAe,KAAK,UAAU,EAAE,WAAW,OAAO,CAAC;GAC5C,CAAA,GACf,oBAAC,eAAD;IAAe,OAAM;cAClB,KAAK,eAAe,KAAK,UAAU,EAAE,WAAW,QAAQ,CAAC;GAC7C,CAAA,CACG,EAAA,CAAA,GACpB,oBAAC,aAAD,EAAoB,MAAQ,CAAA,CACzB;;CACD,CAAA;AAEV"}

package/dist/esm/components/TransactionCard/TransactionCard.style.js

@@ -0,0 +1,14 @@
+import { Box, Typography, styled } from "@mui/material";
+//#region src/components/TransactionCard/TransactionCard.style.tsx
+const DateLabelContainer = styled(Box)({
+	display: "flex",
+	justifyContent: "space-between"
+});
+const DateLabelText = styled(Typography)({
+	fontSize: 12,
+	fontWeight: 500
+});
+//#endregion
+export { DateLabelContainer, DateLabelText };
+
+//# sourceMappingURL=TransactionCard.style.js.map

package/dist/esm/components/TransactionCard/TransactionCard.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionCard.style.js","names":[],"sources":["../../../../src/components/TransactionCard/TransactionCard.style.tsx"],"sourcesContent":["import { Box, styled, Typography } from '@mui/material'\nimport type React from 'react'\n\nexport const DateLabelContainer: React.FC<React.ComponentProps<typeof Box>> =\n  styled(Box)({\n    display: 'flex',\n    justifyContent: 'space-between',\n  })\n\nexport const DateLabelText: React.FC<React.ComponentProps<typeof Typography>> =\n  styled(Typography)({\n    fontSize: 12,\n    fontWeight: 500,\n  })\n"],"mappings":";;AAGA,MAAa,qBACX,OAAO,GAAG,EAAE;CACV,SAAS;CACT,gBAAgB;AAClB,CAAC;AAEH,MAAa,gBACX,OAAO,UAAU,EAAE;CACjB,UAAU;CACV,YAAY;AACd,CAAC"}

package/dist/esm/components/TransactionCard/TransactionCardSkeleton.js

@@ -0,0 +1,63 @@
+import { Card as Card$1 } from "../Card/Card.js";
+import { TokenSkeleton } from "../Token/Token.js";
+import { Box, Skeleton } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
+//#region src/components/TransactionCard/TransactionCardSkeleton.tsx
+const TransactionCardSkeleton = ({ active }) => {
+	return /* @__PURE__ */ jsxs(Card$1, {
+		indented: true,
+		children: [active ? /* @__PURE__ */ jsx(Skeleton, {
+			variant: "rectangular",
+			height: 40,
+			sx: (theme) => ({
+				borderRadius: theme.vars.shape.borderRadiusTertiary,
+				mb: 1.5
+			})
+		}) : /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				justifyContent: "space-between",
+				pb: 1.5
+			},
+			children: [/* @__PURE__ */ jsx(Skeleton, {
+				variant: "rectangular",
+				width: 96,
+				height: 18,
+				sx: (theme) => ({ borderRadius: theme.vars.shape.borderRadius })
+			}), /* @__PURE__ */ jsx(Skeleton, {
+				variant: "rectangular",
+				width: 64,
+				height: 18,
+				sx: (theme) => ({ borderRadius: theme.vars.shape.borderRadius })
+			})]
+		}), /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				display: "flex",
+				flexDirection: "column",
+				gap: 1.5
+			},
+			children: [
+				/* @__PURE__ */ jsx(TokenSkeleton, {}),
+				/* @__PURE__ */ jsx(Box, {
+					sx: {
+						width: 40,
+						height: 20,
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "center"
+					},
+					children: /* @__PURE__ */ jsx(ArrowDownwardIcon, { sx: {
+						fontSize: 16,
+						color: "text.secondary"
+					} })
+				}),
+				/* @__PURE__ */ jsx(TokenSkeleton, {})
+			]
+		})]
+	});
+};
+//#endregion
+export { TransactionCardSkeleton };
+
+//# sourceMappingURL=TransactionCardSkeleton.js.map

package/dist/esm/components/TransactionCard/TransactionCardSkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionCardSkeleton.js","names":["Card"],"sources":["../../../../src/components/TransactionCard/TransactionCardSkeleton.tsx"],"sourcesContent":["import ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\nimport { Box, Skeleton } from '@mui/material'\nimport type { JSX } from 'react'\nimport { Card } from '../Card/Card.js'\nimport { TokenSkeleton } from '../Token/Token.js'\n\ninterface TransactionCardSkeletonProps {\n  active?: boolean\n}\n\nexport const TransactionCardSkeleton = ({\n  active,\n}: TransactionCardSkeletonProps): JSX.Element => {\n  return (\n    <Card indented>\n      {active ? (\n        <Skeleton\n          variant=\"rectangular\"\n          height={40}\n          sx={(theme) => ({\n            borderRadius: theme.vars.shape.borderRadiusTertiary,\n            mb: 1.5,\n          })}\n        />\n      ) : (\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            pb: 1.5,\n          }}\n        >\n          <Skeleton\n            variant=\"rectangular\"\n            width={96}\n            height={18}\n            sx={(theme) => ({\n              borderRadius: theme.vars.shape.borderRadius,\n            })}\n          />\n          <Skeleton\n            variant=\"rectangular\"\n            width={64}\n            height={18}\n            sx={(theme) => ({\n              borderRadius: theme.vars.shape.borderRadius,\n            })}\n          />\n        </Box>\n      )}\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n        <TokenSkeleton />\n        <Box\n          sx={{\n            width: 40,\n            height: 20,\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'center',\n          }}\n        >\n          <ArrowDownwardIcon sx={{ fontSize: 16, color: 'text.secondary' }} />\n        </Box>\n        <TokenSkeleton />\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;AAUA,MAAa,2BAA2B,EACtC,aAC+C;CAC/C,OACE,qBAACA,QAAD;EAAM,UAAA;YAAN,CACG,SACC,oBAAC,UAAD;GACE,SAAQ;GACR,QAAQ;GACR,KAAK,WAAW;IACd,cAAc,MAAM,KAAK,MAAM;IAC/B,IAAI;GACN;EACD,CAAA,IAED,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,gBAAgB;IAChB,IAAI;GACN;aALF,CAOE,oBAAC,UAAD;IACE,SAAQ;IACR,OAAO;IACP,QAAQ;IACR,KAAK,WAAW,EACd,cAAc,MAAM,KAAK,MAAM,aACjC;GACD,CAAA,GACD,oBAAC,UAAD;IACE,SAAQ;IACR,OAAO;IACP,QAAQ;IACR,KAAK,WAAW,EACd,cAAc,MAAM,KAAK,MAAM,aACjC;GACD,CAAA,CACE;MAEP,qBAAC,KAAD;GAAK,IAAI;IAAE,SAAS;IAAQ,eAAe;IAAU,KAAK;GAAI;aAA9D;IACE,oBAAC,eAAD,CAAgB,CAAA;IAChB,oBAAC,KAAD;KACE,IAAI;MACF,OAAO;MACP,QAAQ;MACR,SAAS;MACT,YAAY;MACZ,gBAAgB;KAClB;eAEA,oBAAC,mBAAD,EAAmB,IAAI;MAAE,UAAU;MAAI,OAAO;KAAiB,EAAI,CAAA;IAChE,CAAA;IACL,oBAAC,eAAD,CAAgB,CAAA;GACb;IACD;;AAEV"}

package/dist/esm/config/constants.d.ts

@@ -1,2 +1,5 @@
-export declare const defaultMaxHeight = 686;
-export declare const internalExplorerUrl = "https://scan.li.fi";
+//#region src/config/constants.d.ts
+declare const defaultMaxHeight = 686;
+//#endregion
+export { defaultMaxHeight };
+//# sourceMappingURL=constants.d.ts.map

package/dist/esm/config/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","names":[],"sources":["../../../src/config/constants.ts"],"mappings":";cAAa,gBAAA"}

package/dist/esm/config/constants.js

@@ -1,3 +1,7 @@
-export const defaultMaxHeight = 686;
-export const internalExplorerUrl = 'https://scan.li.fi';
+//#region src/config/constants.ts
+const defaultMaxHeight = 686;
+const internalExplorerUrl = "https://scan.li.fi";
+//#endregion
+export { defaultMaxHeight, internalExplorerUrl };
+
 //# sourceMappingURL=constants.js.map

package/dist/esm/config/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/config/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;AAEnC,MAAM,CAAC,MAAM,mBAAmB,GAAG,oBAAoB,CAAA"}
+{"version":3,"file":"constants.js","names":[],"sources":["../../../src/config/constants.ts"],"sourcesContent":["export const defaultMaxHeight = 686\n\nexport const internalExplorerUrl = 'https://scan.li.fi'\n"],"mappings":";AAAA,MAAa,mBAAmB;AAEhC,MAAa,sBAAsB"}

package/dist/esm/config/queryClient.js

@@ -1,21 +1,18 @@
-import { QueryClient } from '@tanstack/react-query';
-export const queryClient = new QueryClient({
-    defaultOptions: {
-        queries: {
-            enabled: true,
-            refetchInterval: false,
-            refetchIntervalInBackground: false,
-            refetchOnWindowFocus: true,
-            refetchOnReconnect: true,
-            refetchOnMount: true,
-            retryOnMount: true,
-            // suspense: true,
-        },
-        mutations: {
-            onError: (_error) => {
-                //
-            },
-        },
-    },
-});
+import { QueryClient } from "@tanstack/react-query";
+//#region src/config/queryClient.ts
+const queryClient = new QueryClient({ defaultOptions: {
+	queries: {
+		enabled: true,
+		refetchInterval: false,
+		refetchIntervalInBackground: false,
+		refetchOnWindowFocus: true,
+		refetchOnReconnect: true,
+		refetchOnMount: true,
+		retryOnMount: true
+	},
+	mutations: { onError: (_error) => {} }
+} });
+//#endregion
+export { queryClient };
+
 //# sourceMappingURL=queryClient.js.map

package/dist/esm/config/queryClient.js.map

@@ -1 +1 @@
-{"version":3,"file":"queryClient.js","sourceRoot":"","sources":["../../../src/config/queryClient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEnD,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;IACzC,cAAc,EAAE;QACd,OAAO,EAAE;YACP,OAAO,EAAE,IAAI;YACb,eAAe,EAAE,KAAK;YACtB,2BAA2B,EAAE,KAAK;YAClC,oBAAoB,EAAE,IAAI;YAC1B,kBAAkB,EAAE,IAAI;YACxB,cAAc,EAAE,IAAI;YACpB,YAAY,EAAE,IAAI;YAClB,kBAAkB;SACnB;QACD,SAAS,EAAE;YACT,OAAO,EAAE,CAAC,MAAM,EAAE,EAAE;gBAClB,EAAE;YACJ,CAAC;SACF;KACF;CACF,CAAC,CAAA"}
+{"version":3,"file":"queryClient.js","names":[],"sources":["../../../src/config/queryClient.ts"],"sourcesContent":["import { QueryClient } from '@tanstack/react-query'\n\nexport const queryClient: QueryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      enabled: true,\n      refetchInterval: false,\n      refetchIntervalInBackground: false,\n      refetchOnWindowFocus: true,\n      refetchOnReconnect: true,\n      refetchOnMount: true,\n      retryOnMount: true,\n      // suspense: true,\n    },\n    mutations: {\n      onError: (_error) => {\n        //\n      },\n    },\n  },\n})\n"],"mappings":";;AAEA,MAAa,cAA2B,IAAI,YAAY,EACtD,gBAAgB;CACd,SAAS;EACP,SAAS;EACT,iBAAiB;EACjB,6BAA6B;EAC7B,sBAAsB;EACtB,oBAAoB;EACpB,gBAAgB;EAChB,cAAc;CAEhB;CACA,WAAW,EACT,UAAU,WAAW,CAErB,EACF;AACF,EACF,CAAC"}

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

@@ -1,2 +1,6 @@
-export declare const name = "@lifi/widget";
-export declare const version = "4.0.0-beta.9";
+//#region src/config/version.d.ts
+declare const name = "@lifi/widget";
+declare const version = "4.0.0";
+//#endregion
+export { name, version };
+//# sourceMappingURL=version.d.ts.map

package/dist/esm/config/version.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"version.d.ts","names":[],"sources":["../../../src/config/version.ts"],"mappings":";cAAa,IAAA;AAAA,cACA,OAAA"}

package/dist/esm/config/version.js

@@ -1,3 +1,7 @@
-export const name = '@lifi/widget';
-export const version = '4.0.0-beta.9';
+//#region src/config/version.ts
+const name = "@lifi/widget";
+const version = "4.0.0";
+//#endregion
+export { name, version };
+
 //# sourceMappingURL=version.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"version.js","sourceRoot":"","sources":["../../../src/config/version.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG,cAAc,CAAA;AAClC,MAAM,CAAC,MAAM,OAAO,GAAG,cAAc,CAAA"}
+{"version":3,"file":"version.js","names":[],"sources":["../../../src/config/version.ts"],"sourcesContent":["export const name = '@lifi/widget'\nexport const version = '4.0.0'\n"],"mappings":";AAAA,MAAa,OAAO;AACpB,MAAa,UAAU"}