@lifi/widget 4.4.0 → 4.6.0

package/dist/esm/components/Messages/WarningMessages.js

@@ -4,6 +4,7 @@ import { FundsSufficiencyMessage } from "./FundsSufficiencyMessage.js";
 import { GasSufficiencyMessage } from "./GasSufficiencyMessage.js";
 import { MinFromAmountUSDMessage } from "./MinFromAmountUSDMessage.js";
 import { MissingRouteRequiredAccountMessage } from "./MissingRouteRequiredAccountMessage.js";
+import { UnsupportedToAddressMessage } from "./UnsupportedToAddressMessage.js";
 import { useMessageQueue } from "./useMessageQueue.js";
 import { Collapse } from "@mui/material";
 import { jsx } from "react/jsx-runtime";
@@ -28,6 +29,7 @@ const WarningMessages = ({ route, allowInteraction, ...props }) => {
 			});
 			case "ACCOUNT_NOT_DEPLOYED": return /* @__PURE__ */ jsx(AccountNotDeployedMessage, { ...props });
 			case "ACCOUNT_DEPLOYED": return /* @__PURE__ */ jsx(AccountDeployedMessage, { ...props });
+			case "UNSUPPORTED_TO_ADDRESS": return /* @__PURE__ */ jsx(UnsupportedToAddressMessage, { ...props });
 			default: return null;
 		}
 	};

package/dist/esm/components/Messages/WarningMessages.js.map

@@ -1 +1 @@
-{"version":3,"file":"WarningMessages.js","names":[],"sources":["../../../../src/components/Messages/WarningMessages.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport type { BoxProps } from '@mui/material'\nimport { Collapse } from '@mui/material'\nimport { AccountDeployedMessage } from './AccountDeployedMessage.js'\nimport { AccountNotDeployedMessage } from './AccountNotDeployedMessage.js'\nimport { FundsSufficiencyMessage } from './FundsSufficiencyMessage.js'\nimport { GasSufficiencyMessage } from './GasSufficiencyMessage.js'\nimport { MinFromAmountUSDMessage } from './MinFromAmountUSDMessage.js'\nimport { MissingRouteRequiredAccountMessage } from './MissingRouteRequiredAccountMessage.js'\nimport { useMessageQueue } from './useMessageQueue.js'\n\ntype WarningMessagesProps = BoxProps & {\n  route?: Route\n  allowInteraction?: boolean\n}\n\nexport const WarningMessages: React.FC<WarningMessagesProps> = ({\n  route,\n  allowInteraction,\n  ...props\n}) => {\n  const { messages, hasMessages } = useMessageQueue(route, allowInteraction)\n\n  const getMessage = () => {\n    switch (messages[0]?.id) {\n      case 'MISSING_ROUTE_REQUIRED_ACCOUNT':\n        return (\n          <MissingRouteRequiredAccountMessage\n            chain={messages[0].props?.chain}\n            address={messages[0].props?.address}\n            {...props}\n          />\n        )\n      case 'INSUFFICIENT_FUNDS':\n        return <FundsSufficiencyMessage {...props} />\n      case 'INSUFFICIENT_GAS':\n        return (\n          <GasSufficiencyMessage\n            insufficientGas={messages[0].props?.insufficientGas}\n            {...props}\n          />\n        )\n      case 'MIN_FROM_AMOUNT_USD':\n        return (\n          <MinFromAmountUSDMessage\n            minFromAmountUSD={messages[0].props?.minFromAmountUSD}\n            {...props}\n          />\n        )\n      case 'ACCOUNT_NOT_DEPLOYED':\n        return <AccountNotDeployedMessage {...props} />\n      case 'ACCOUNT_DEPLOYED':\n        return <AccountDeployedMessage {...props} />\n      default:\n        return null\n    }\n  }\n\n  return (\n    <Collapse in={hasMessages} timeout={225} unmountOnExit mountOnEnter>\n      {getMessage()}\n    </Collapse>\n  )\n}\n"],"mappings":";;;;;;;;;;AAgBA,MAAa,mBAAmD,EAC9D,OACA,kBACA,GAAG,YACC;CACJ,MAAM,EAAE,UAAU,gBAAgB,gBAAgB,OAAO,gBAAgB;CAEzE,MAAM,mBAAmB;EACvB,QAAQ,SAAS,EAAE,EAAE,IAArB;GACE,KAAK,kCACH,OACE,oBAAC,oCAAD;IACE,OAAO,SAAS,EAAE,CAAC,OAAO;IAC1B,SAAS,SAAS,EAAE,CAAC,OAAO;IAC5B,GAAI;GACL,CAAA;GAEL,KAAK,sBACH,OAAO,oBAAC,yBAAD,EAAyB,GAAI,MAAQ,CAAA;GAC9C,KAAK,oBACH,OACE,oBAAC,uBAAD;IACE,iBAAiB,SAAS,EAAE,CAAC,OAAO;IACpC,GAAI;GACL,CAAA;GAEL,KAAK,uBACH,OACE,oBAAC,yBAAD;IACE,kBAAkB,SAAS,EAAE,CAAC,OAAO;IACrC,GAAI;GACL,CAAA;GAEL,KAAK,wBACH,OAAO,oBAAC,2BAAD,EAA2B,GAAI,MAAQ,CAAA;GAChD,KAAK,oBACH,OAAO,oBAAC,wBAAD,EAAwB,GAAI,MAAQ,CAAA;GAC7C,SACE,OAAO;EACX;CACF;CAEA,OACE,oBAAC,UAAD;EAAU,IAAI;EAAa,SAAS;EAAK,eAAA;EAAc,cAAA;YACpD,WAAW;CACJ,CAAA;AAEd"}
+{"version":3,"file":"WarningMessages.js","names":[],"sources":["../../../../src/components/Messages/WarningMessages.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport type { BoxProps } from '@mui/material'\nimport { Collapse } from '@mui/material'\nimport { AccountDeployedMessage } from './AccountDeployedMessage.js'\nimport { AccountNotDeployedMessage } from './AccountNotDeployedMessage.js'\nimport { FundsSufficiencyMessage } from './FundsSufficiencyMessage.js'\nimport { GasSufficiencyMessage } from './GasSufficiencyMessage.js'\nimport { MinFromAmountUSDMessage } from './MinFromAmountUSDMessage.js'\nimport { MissingRouteRequiredAccountMessage } from './MissingRouteRequiredAccountMessage.js'\nimport { UnsupportedToAddressMessage } from './UnsupportedToAddressMessage.js'\nimport { useMessageQueue } from './useMessageQueue.js'\n\ntype WarningMessagesProps = BoxProps & {\n  route?: Route\n  allowInteraction?: boolean\n}\n\nexport const WarningMessages: React.FC<WarningMessagesProps> = ({\n  route,\n  allowInteraction,\n  ...props\n}) => {\n  const { messages, hasMessages } = useMessageQueue(route, allowInteraction)\n\n  const getMessage = () => {\n    switch (messages[0]?.id) {\n      case 'MISSING_ROUTE_REQUIRED_ACCOUNT':\n        return (\n          <MissingRouteRequiredAccountMessage\n            chain={messages[0].props?.chain}\n            address={messages[0].props?.address}\n            {...props}\n          />\n        )\n      case 'INSUFFICIENT_FUNDS':\n        return <FundsSufficiencyMessage {...props} />\n      case 'INSUFFICIENT_GAS':\n        return (\n          <GasSufficiencyMessage\n            insufficientGas={messages[0].props?.insufficientGas}\n            {...props}\n          />\n        )\n      case 'MIN_FROM_AMOUNT_USD':\n        return (\n          <MinFromAmountUSDMessage\n            minFromAmountUSD={messages[0].props?.minFromAmountUSD}\n            {...props}\n          />\n        )\n      case 'ACCOUNT_NOT_DEPLOYED':\n        return <AccountNotDeployedMessage {...props} />\n      case 'ACCOUNT_DEPLOYED':\n        return <AccountDeployedMessage {...props} />\n      case 'UNSUPPORTED_TO_ADDRESS':\n        return <UnsupportedToAddressMessage {...props} />\n      default:\n        return null\n    }\n  }\n\n  return (\n    <Collapse in={hasMessages} timeout={225} unmountOnExit mountOnEnter>\n      {getMessage()}\n    </Collapse>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAiBA,MAAa,mBAAmD,EAC9D,OACA,kBACA,GAAG,YACC;CACJ,MAAM,EAAE,UAAU,gBAAgB,gBAAgB,OAAO,gBAAgB;CAEzE,MAAM,mBAAmB;EACvB,QAAQ,SAAS,EAAE,EAAE,IAArB;GACE,KAAK,kCACH,OACE,oBAAC,oCAAD;IACE,OAAO,SAAS,EAAE,CAAC,OAAO;IAC1B,SAAS,SAAS,EAAE,CAAC,OAAO;IAC5B,GAAI;GACL,CAAA;GAEL,KAAK,sBACH,OAAO,oBAAC,yBAAD,EAAyB,GAAI,MAAQ,CAAA;GAC9C,KAAK,oBACH,OACE,oBAAC,uBAAD;IACE,iBAAiB,SAAS,EAAE,CAAC,OAAO;IACpC,GAAI;GACL,CAAA;GAEL,KAAK,uBACH,OACE,oBAAC,yBAAD;IACE,kBAAkB,SAAS,EAAE,CAAC,OAAO;IACrC,GAAI;GACL,CAAA;GAEL,KAAK,wBACH,OAAO,oBAAC,2BAAD,EAA2B,GAAI,MAAQ,CAAA;GAChD,KAAK,oBACH,OAAO,oBAAC,wBAAD,EAAwB,GAAI,MAAQ,CAAA;GAC7C,KAAK,0BACH,OAAO,oBAAC,6BAAD,EAA6B,GAAI,MAAQ,CAAA;GAClD,SACE,OAAO;EACX;CACF;CAEA,OACE,oBAAC,UAAD;EAAU,IAAI;EAAa,SAAS;EAAK,eAAA;EAAc,cAAA;EACpD,UAAA,WAAW;CACJ,CAAA;AAEd"}

package/dist/esm/components/Messages/useMessageQueue.js

@@ -6,13 +6,17 @@ import { useRouteRequiredAccountConnection } from "../../hooks/useRouteRequiredA
 import { useMemo } from "react";
 //#region src/components/Messages/useMessageQueue.ts
 const useMessageQueue = (route, allowInteraction) => {
-	const { requiredToAddress, accountNotDeployedAtDestination, accountDeployedAtDestination, isLoading: isToAddressRequirementsLoading } = useToAddressRequirements(route);
+	const { requiredToAddress, unsupportedReceiverBlocking, accountNotDeployedAtDestination, accountDeployedAtDestination, isLoading: isToAddressRequirementsLoading } = useToAddressRequirements(route);
 	const { insufficientFromToken, isLoading: isFromTokenSufficiencyLoading } = useFromTokenSufficiency(route);
 	const { insufficientGas, isLoading: isGasSufficiencyLoading } = useGasSufficiency(route);
 	const { missingChain, missingAccountAddress } = useRouteRequiredAccountConnection(route);
 	const { belowMinFromAmountUSD, minFromAmountUSD } = useFromAmountThreshold();
 	const messageQueue = useMemo(() => {
 		const queue = [];
+		if (unsupportedReceiverBlocking) queue.push({
+			id: "UNSUPPORTED_TO_ADDRESS",
+			priority: 7
+		});
 		if (missingChain) queue.push({
 			id: "MISSING_ROUTE_REQUIRED_ACCOUNT",
 			priority: 1,
@@ -51,6 +55,7 @@ const useMessageQueue = (route, allowInteraction) => {
 		accountDeployedAtDestination,
 		accountNotDeployedAtDestination,
 		requiredToAddress,
+		unsupportedReceiverBlocking,
 		missingChain,
 		missingAccountAddress,
 		belowMinFromAmountUSD,

package/dist/esm/components/Messages/useMessageQueue.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMessageQueue.js","names":[],"sources":["../../../../src/components/Messages/useMessageQueue.ts"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useMemo } from 'react'\nimport { useFromAmountThreshold } from '../../hooks/useFromAmountThreshold.js'\nimport { useFromTokenSufficiency } from '../../hooks/useFromTokenSufficiency.js'\nimport { useGasSufficiency } from '../../hooks/useGasSufficiency.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\n\nexport interface QueuedMessage {\n  id: string\n  priority: number\n  props?: Record<string, any>\n}\n\nexport const useMessageQueue = (\n  route?: Route,\n  allowInteraction?: boolean\n): {\n  messages: QueuedMessage[]\n  hasMessages: boolean\n  isLoading: boolean\n} => {\n  const {\n    requiredToAddress,\n    accountNotDeployedAtDestination,\n    accountDeployedAtDestination,\n    isLoading: isToAddressRequirementsLoading,\n  } = useToAddressRequirements(route)\n  const { insufficientFromToken, isLoading: isFromTokenSufficiencyLoading } =\n    useFromTokenSufficiency(route)\n  const { insufficientGas, isLoading: isGasSufficiencyLoading } =\n    useGasSufficiency(route)\n  const { missingChain, missingAccountAddress } =\n    useRouteRequiredAccountConnection(route)\n  const { belowMinFromAmountUSD, minFromAmountUSD } = useFromAmountThreshold()\n\n  const messageQueue = useMemo(() => {\n    const queue: QueuedMessage[] = []\n\n    if (missingChain) {\n      queue.push({\n        id: 'MISSING_ROUTE_REQUIRED_ACCOUNT',\n        priority: 1,\n        props: { chain: missingChain, address: missingAccountAddress },\n      })\n    }\n\n    if (insufficientFromToken) {\n      queue.push({\n        id: 'INSUFFICIENT_FUNDS',\n        priority: 2,\n      })\n    }\n\n    if (belowMinFromAmountUSD) {\n      queue.push({\n        id: 'MIN_FROM_AMOUNT_USD',\n        priority: 3,\n        props: { minFromAmountUSD },\n      })\n    }\n\n    if (insufficientGas?.length) {\n      queue.push({\n        id: 'INSUFFICIENT_GAS',\n        priority: 4,\n        props: { insufficientGas },\n      })\n    }\n\n    if (accountNotDeployedAtDestination && !allowInteraction) {\n      queue.push({\n        id: 'ACCOUNT_NOT_DEPLOYED',\n        priority: 5,\n      })\n    }\n\n    if (\n      requiredToAddress &&\n      accountDeployedAtDestination &&\n      !allowInteraction\n    ) {\n      queue.push({\n        id: 'ACCOUNT_DEPLOYED',\n        priority: 6,\n      })\n    }\n\n    return queue.sort((a, b) => a.priority - b.priority)\n  }, [\n    allowInteraction,\n    insufficientFromToken,\n    insufficientGas,\n    accountDeployedAtDestination,\n    accountNotDeployedAtDestination,\n    requiredToAddress,\n    missingChain,\n    missingAccountAddress,\n    belowMinFromAmountUSD,\n    minFromAmountUSD,\n  ])\n\n  return {\n    messages: messageQueue,\n    hasMessages: messageQueue.length > 0,\n    isLoading:\n      isGasSufficiencyLoading ||\n      isFromTokenSufficiencyLoading ||\n      isToAddressRequirementsLoading,\n  }\n}\n"],"mappings":";;;;;;;AAcA,MAAa,mBACX,OACA,qBAKG;CACH,MAAM,EACJ,mBACA,iCACA,8BACA,WAAW,mCACT,yBAAyB,KAAK;CAClC,MAAM,EAAE,uBAAuB,WAAW,kCACxC,wBAAwB,KAAK;CAC/B,MAAM,EAAE,iBAAiB,WAAW,4BAClC,kBAAkB,KAAK;CACzB,MAAM,EAAE,cAAc,0BACpB,kCAAkC,KAAK;CACzC,MAAM,EAAE,uBAAuB,qBAAqB,uBAAuB;CAE3E,MAAM,eAAe,cAAc;EACjC,MAAM,QAAyB,CAAC;EAEhC,IAAI,cACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO;IAAE,OAAO;IAAc,SAAS;GAAsB;EAC/D,CAAC;EAGH,IAAI,uBACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,IAAI,uBACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO,EAAE,iBAAiB;EAC5B,CAAC;EAGH,IAAI,iBAAiB,QACnB,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO,EAAE,gBAAgB;EAC3B,CAAC;EAGH,IAAI,mCAAmC,CAAC,kBACtC,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,IACE,qBACA,gCACA,CAAC,kBAED,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,OAAO,MAAM,MAAM,GAAG,MAAM,EAAE,WAAW,EAAE,QAAQ;CACrD,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OAAO;EACL,UAAU;EACV,aAAa,aAAa,SAAS;EACnC,WACE,2BACA,iCACA;CACJ;AACF"}
+{"version":3,"file":"useMessageQueue.js","names":[],"sources":["../../../../src/components/Messages/useMessageQueue.ts"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useMemo } from 'react'\nimport { useFromAmountThreshold } from '../../hooks/useFromAmountThreshold.js'\nimport { useFromTokenSufficiency } from '../../hooks/useFromTokenSufficiency.js'\nimport { useGasSufficiency } from '../../hooks/useGasSufficiency.js'\nimport { useRouteRequiredAccountConnection } from '../../hooks/useRouteRequiredAccountConnection.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\n\nexport interface QueuedMessage {\n  id: string\n  priority: number\n  props?: Record<string, any>\n}\n\nexport const useMessageQueue = (\n  route?: Route,\n  allowInteraction?: boolean\n): {\n  messages: QueuedMessage[]\n  hasMessages: boolean\n  isLoading: boolean\n} => {\n  const {\n    requiredToAddress,\n    unsupportedReceiverBlocking,\n    accountNotDeployedAtDestination,\n    accountDeployedAtDestination,\n    isLoading: isToAddressRequirementsLoading,\n  } = useToAddressRequirements(route)\n  const { insufficientFromToken, isLoading: isFromTokenSufficiencyLoading } =\n    useFromTokenSufficiency(route)\n  const { insufficientGas, isLoading: isGasSufficiencyLoading } =\n    useGasSufficiency(route)\n  const { missingChain, missingAccountAddress } =\n    useRouteRequiredAccountConnection(route)\n  const { belowMinFromAmountUSD, minFromAmountUSD } = useFromAmountThreshold()\n\n  const messageQueue = useMemo(() => {\n    const queue: QueuedMessage[] = []\n\n    if (unsupportedReceiverBlocking) {\n      queue.push({\n        id: 'UNSUPPORTED_TO_ADDRESS',\n        priority: 7,\n      })\n    }\n\n    if (missingChain) {\n      queue.push({\n        id: 'MISSING_ROUTE_REQUIRED_ACCOUNT',\n        priority: 1,\n        props: { chain: missingChain, address: missingAccountAddress },\n      })\n    }\n\n    if (insufficientFromToken) {\n      queue.push({\n        id: 'INSUFFICIENT_FUNDS',\n        priority: 2,\n      })\n    }\n\n    if (belowMinFromAmountUSD) {\n      queue.push({\n        id: 'MIN_FROM_AMOUNT_USD',\n        priority: 3,\n        props: { minFromAmountUSD },\n      })\n    }\n\n    if (insufficientGas?.length) {\n      queue.push({\n        id: 'INSUFFICIENT_GAS',\n        priority: 4,\n        props: { insufficientGas },\n      })\n    }\n\n    if (accountNotDeployedAtDestination && !allowInteraction) {\n      queue.push({\n        id: 'ACCOUNT_NOT_DEPLOYED',\n        priority: 5,\n      })\n    }\n\n    if (\n      requiredToAddress &&\n      accountDeployedAtDestination &&\n      !allowInteraction\n    ) {\n      queue.push({\n        id: 'ACCOUNT_DEPLOYED',\n        priority: 6,\n      })\n    }\n\n    return queue.sort((a, b) => a.priority - b.priority)\n  }, [\n    allowInteraction,\n    insufficientFromToken,\n    insufficientGas,\n    accountDeployedAtDestination,\n    accountNotDeployedAtDestination,\n    requiredToAddress,\n    unsupportedReceiverBlocking,\n    missingChain,\n    missingAccountAddress,\n    belowMinFromAmountUSD,\n    minFromAmountUSD,\n  ])\n\n  return {\n    messages: messageQueue,\n    hasMessages: messageQueue.length > 0,\n    isLoading:\n      isGasSufficiencyLoading ||\n      isFromTokenSufficiencyLoading ||\n      isToAddressRequirementsLoading,\n  }\n}\n"],"mappings":";;;;;;;AAcA,MAAa,mBACX,OACA,qBAKG;CACH,MAAM,EACJ,mBACA,6BACA,iCACA,8BACA,WAAW,mCACT,yBAAyB,KAAK;CAClC,MAAM,EAAE,uBAAuB,WAAW,kCACxC,wBAAwB,KAAK;CAC/B,MAAM,EAAE,iBAAiB,WAAW,4BAClC,kBAAkB,KAAK;CACzB,MAAM,EAAE,cAAc,0BACpB,kCAAkC,KAAK;CACzC,MAAM,EAAE,uBAAuB,qBAAqB,uBAAuB;CAE3E,MAAM,eAAe,cAAc;EACjC,MAAM,QAAyB,CAAC;EAEhC,IAAI,6BACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,IAAI,cACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO;IAAE,OAAO;IAAc,SAAS;GAAsB;EAC/D,CAAC;EAGH,IAAI,uBACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,IAAI,uBACF,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO,EAAE,iBAAiB;EAC5B,CAAC;EAGH,IAAI,iBAAiB,QACnB,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;GACV,OAAO,EAAE,gBAAgB;EAC3B,CAAC;EAGH,IAAI,mCAAmC,CAAC,kBACtC,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,IACE,qBACA,gCACA,CAAC,kBAED,MAAM,KAAK;GACT,IAAI;GACJ,UAAU;EACZ,CAAC;EAGH,OAAO,MAAM,MAAM,GAAG,MAAM,EAAE,WAAW,EAAE,QAAQ;CACrD,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OAAO;EACL,UAAU;EACV,aAAa,aAAa,SAAS;EACnC,WACE,2BACA,iCACA;CACJ;AACF"}

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

@@ -1 +1 @@
-{"version":3,"file":"NotFound.js","names":[],"sources":["../../../src/components/NotFound.tsx"],"sourcesContent":["import Block from '@mui/icons-material/Block'\nimport { Box, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\n\nexport const NotFound: React.FC = () => {\n  const { t } = useTranslation()\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'center',\n        alignItems: 'center',\n        flexDirection: 'column',\n        flex: 1,\n        padding: 3,\n      }}\n    >\n      <Typography\n        sx={{\n          fontSize: 48,\n        }}\n      >\n        <Block fontSize=\"inherit\" />\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 18,\n          fontWeight: 700,\n        }}\n      >\n        {t('tooltip.notFound.title')}\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 14,\n          color: 'text.secondary',\n          textAlign: 'center',\n          mt: 2,\n        }}\n      >\n        {t('tooltip.notFound.text')}\n      </Typography>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAIA,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,KAAD;EACE,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;GACZ,eAAe;GACf,MAAM;GACN,SAAS;EACX;YARF;GAUE,oBAAC,YAAD;IACE,IAAI,EACF,UAAU,GACZ;cAEA,oBAAC,OAAD,EAAO,UAAS,UAAW,CAAA;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,YAAY;IACd;cAEC,EAAE,wBAAwB;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,OAAO;KACP,WAAW;KACX,IAAI;IACN;cAEC,EAAE,uBAAuB;GAChB,CAAA;EACT;;AAET"}
+{"version":3,"file":"NotFound.js","names":[],"sources":["../../../src/components/NotFound.tsx"],"sourcesContent":["import Block from '@mui/icons-material/Block'\nimport { Box, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\n\nexport const NotFound: React.FC = () => {\n  const { t } = useTranslation()\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'center',\n        alignItems: 'center',\n        flexDirection: 'column',\n        flex: 1,\n        padding: 3,\n      }}\n    >\n      <Typography\n        sx={{\n          fontSize: 48,\n        }}\n      >\n        <Block fontSize=\"inherit\" />\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 18,\n          fontWeight: 700,\n        }}\n      >\n        {t('tooltip.notFound.title')}\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 14,\n          color: 'text.secondary',\n          textAlign: 'center',\n          mt: 2,\n        }}\n      >\n        {t('tooltip.notFound.text')}\n      </Typography>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAIA,MAAa,iBAA2B;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,KAAD;EACE,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;GACZ,eAAe;GACf,MAAM;GACN,SAAS;EACX;EARF,UAAA;GAUE,oBAAC,YAAD;IACE,IAAI,EACF,UAAU,GACZ;IAEA,UAAA,oBAAC,OAAD,EAAO,UAAS,UAAW,CAAA;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,YAAY;IACd;IAEC,UAAA,EAAE,wBAAwB;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,OAAO;KACP,WAAW;KACX,IAAI;IACN;IAEC,UAAA,EAAE,uBAAuB;GAChB,CAAA;EACT;;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"PoweredBy.js","names":["Link"],"sources":["../../../../src/components/PoweredBy/PoweredBy.tsx"],"sourcesContent":["import { Box, Tooltip, Typography } from '@mui/material'\nimport { version } from '../../config/version.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { Link } from './PoweredBy.style.js'\n\nconst poweredByConfig = {\n  default: {\n    url: 'https://li.fi',\n    text: 'LI.FI',\n  },\n  jumper: {\n    url: 'https://jumper.exchange',\n    text: 'Jumper',\n  },\n}\n\nexport const PoweredBy: React.FC = () => {\n  const { poweredBy = 'default' } = useWidgetConfig()\n\n  return (\n    <Box\n      sx={{\n        pt: 1,\n        pb: 2,\n        flex: 1,\n        display: 'flex',\n        alignItems: 'flex-end',\n        justifyContent: 'flex-end',\n      }}\n    >\n      <Tooltip title={`v${version}`} enterDelay={1000}>\n        <Link\n          href={poweredByConfig[poweredBy].url}\n          target=\"_blank\"\n          underline=\"none\"\n          color=\"text.primary\"\n        >\n          <Typography\n            sx={{\n              color: 'text.secondary',\n              fontSize: 12,\n              fontWeight: 500,\n              px: 0.5,\n            }}\n          >\n            Powered by\n          </Typography>\n          <Typography\n            sx={{\n              color: 'text.primary',\n              fontSize: 12,\n              fontWeight: 600,\n            }}\n          >\n            {poweredByConfig[poweredBy].text}\n          </Typography>\n        </Link>\n      </Tooltip>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AAKA,MAAM,kBAAkB;CACtB,SAAS;EACP,KAAK;EACL,MAAM;CACR;CACA,QAAQ;EACN,KAAK;EACL,MAAM;CACR;AACF;AAEA,MAAa,kBAA4B;CACvC,MAAM,EAAE,YAAY,cAAc,gBAAgB;CAElD,OACE,oBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,SAAS;GACT,YAAY;GACZ,gBAAgB;EAClB;YAEA,oBAAC,SAAD;GAAS,OAAO,IAAI;GAAW,YAAY;aACzC,qBAACA,QAAD;IACE,MAAM,gBAAgB,UAAU,CAAC;IACjC,QAAO;IACP,WAAU;IACV,OAAM;cAJR,CAME,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;KACN;eACD;IAEW,CAAA,GACZ,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;KACd;eAEC,gBAAgB,UAAU,CAAC;IAClB,CAAA,CACR;;EACC,CAAA;CACN,CAAA;AAET"}
+{"version":3,"file":"PoweredBy.js","names":["Link"],"sources":["../../../../src/components/PoweredBy/PoweredBy.tsx"],"sourcesContent":["import { Box, Tooltip, Typography } from '@mui/material'\nimport { version } from '../../config/version.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { Link } from './PoweredBy.style.js'\n\nconst poweredByConfig = {\n  default: {\n    url: 'https://li.fi',\n    text: 'LI.FI',\n  },\n  jumper: {\n    url: 'https://jumper.exchange',\n    text: 'Jumper',\n  },\n}\n\nexport const PoweredBy: React.FC = () => {\n  const { poweredBy = 'default' } = useWidgetConfig()\n\n  return (\n    <Box\n      sx={{\n        pt: 1,\n        pb: 2,\n        flex: 1,\n        display: 'flex',\n        alignItems: 'flex-end',\n        justifyContent: 'flex-end',\n      }}\n    >\n      <Tooltip title={`v${version}`} enterDelay={1000}>\n        <Link\n          href={poweredByConfig[poweredBy].url}\n          target=\"_blank\"\n          underline=\"none\"\n          color=\"text.primary\"\n        >\n          <Typography\n            sx={{\n              color: 'text.secondary',\n              fontSize: 12,\n              fontWeight: 500,\n              px: 0.5,\n            }}\n          >\n            Powered by\n          </Typography>\n          <Typography\n            sx={{\n              color: 'text.primary',\n              fontSize: 12,\n              fontWeight: 600,\n            }}\n          >\n            {poweredByConfig[poweredBy].text}\n          </Typography>\n        </Link>\n      </Tooltip>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AAKA,MAAM,kBAAkB;CACtB,SAAS;EACP,KAAK;EACL,MAAM;CACR;CACA,QAAQ;EACN,KAAK;EACL,MAAM;CACR;AACF;AAEA,MAAa,kBAA4B;CACvC,MAAM,EAAE,YAAY,cAAc,gBAAgB;CAElD,OACE,oBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,SAAS;GACT,YAAY;GACZ,gBAAgB;EAClB;EAEA,UAAA,oBAAC,SAAD;GAAS,OAAO,IAAI;GAAW,YAAY;GACzC,UAAA,qBAACA,QAAD;IACE,MAAM,gBAAgB,UAAU,CAAC;IACjC,QAAO;IACP,WAAU;IACV,OAAM;IAJR,UAAA,CAME,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;MACZ,IAAI;KACN;KACD,UAAA;IAEW,CAAA,GACZ,oBAAC,YAAD;KACE,IAAI;MACF,OAAO;MACP,UAAU;MACV,YAAY;KACd;KAEC,UAAA,gBAAgB,UAAU,CAAC;IAClB,CAAA,CACR;;EACC,CAAA;CACN,CAAA;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"ProgressToNextUpdate.js","names":[],"sources":["../../../src/components/ProgressToNextUpdate.tsx"],"sourcesContent":["import type { IconButtonProps } from '@mui/material'\nimport { Box, CircularProgress, IconButton, Tooltip } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport { Trans } from 'react-i18next'\n\nconst getProgressValue = (updatedAt: number, timeToUpdate: number) =>\n  updatedAt ? Math.min(100, ((Date.now() - updatedAt) / timeToUpdate) * 100) : 0\n\nconst getSecondsToUpdate = (updatedAt: number, timeToUpdate: number) =>\n  Math.max(Math.round((timeToUpdate - (Date.now() - updatedAt)) / 1000), 0)\n\nexport const ProgressToNextUpdate: React.FC<\n  {\n    updatedAt: number\n    timeToUpdate: number\n    isLoading?: boolean\n  } & IconButtonProps\n> = ({ updatedAt, timeToUpdate, isLoading, onClick, ...other }) => {\n  const [value, setValue] = useState(() =>\n    getProgressValue(updatedAt, timeToUpdate)\n  )\n\n  useEffect(() => {\n    setValue(getProgressValue(updatedAt, timeToUpdate))\n    const id = setInterval(() => {\n      const time = getProgressValue(updatedAt, timeToUpdate)\n      setValue(time)\n      if (time >= 100) {\n        clearInterval(id)\n      }\n    }, 1000)\n    return () => clearInterval(id)\n  }, [timeToUpdate, updatedAt])\n\n  useEffect(() => {\n    if (isLoading) {\n      setValue(0)\n    }\n  }, [isLoading])\n\n  return (\n    <IconButton onClick={onClick} disabled={isLoading} {...other}>\n      <Tooltip\n        title={\n          <Trans\n            i18nKey=\"tooltip.progressToNextUpdate\"\n            values={{\n              value: getSecondsToUpdate(updatedAt, timeToUpdate),\n            }}\n            // biome-ignore lint/correctness/useJsxKeyInIterable: allowed in react-i18next\n            components={[<br />]}\n          />\n        }\n      >\n        <Box\n          sx={{\n            display: 'grid',\n            position: 'relative',\n            placeItems: 'center',\n            width: 24,\n            height: 24,\n          }}\n        >\n          <CircularProgress\n            variant=\"determinate\"\n            size={24}\n            value={100}\n            sx={(theme) => ({\n              position: 'absolute',\n              color: theme.vars.palette.grey[300],\n              ...theme.applyStyles('dark', {\n                color: theme.vars.palette.grey[800],\n              }),\n            })}\n          />\n          <CircularProgress\n            variant={isLoading ? 'indeterminate' : 'determinate'}\n            size={24}\n            value={value}\n            sx={(theme) => ({\n              opacity: value === 100 && !isLoading ? 0.5 : 1,\n              color: theme.vars.palette.primary.main,\n              ...theme.applyStyles('dark', {\n                color: theme.vars.palette.primary.light,\n              }),\n            })}\n          />\n        </Box>\n      </Tooltip>\n    </IconButton>\n  )\n}\n"],"mappings":";;;;;AAKA,MAAM,oBAAoB,WAAmB,iBAC3C,YAAY,KAAK,IAAI,MAAO,KAAK,IAAI,IAAI,aAAa,eAAgB,GAAG,IAAI;AAE/E,MAAM,sBAAsB,WAAmB,iBAC7C,KAAK,IAAI,KAAK,OAAO,gBAAgB,KAAK,IAAI,IAAI,cAAc,GAAI,GAAG,CAAC;AAE1E,MAAa,wBAMR,EAAE,WAAW,cAAc,WAAW,SAAS,GAAG,YAAY;CACjE,MAAM,CAAC,OAAO,YAAY,eACxB,iBAAiB,WAAW,YAAY,CAC1C;CAEA,gBAAgB;EACd,SAAS,iBAAiB,WAAW,YAAY,CAAC;EAClD,MAAM,KAAK,kBAAkB;GAC3B,MAAM,OAAO,iBAAiB,WAAW,YAAY;GACrD,SAAS,IAAI;GACb,IAAI,QAAQ,KACV,cAAc,EAAE;EAEpB,GAAG,GAAI;EACP,aAAa,cAAc,EAAE;CAC/B,GAAG,CAAC,cAAc,SAAS,CAAC;CAE5B,gBAAgB;EACd,IAAI,WACF,SAAS,CAAC;CAEd,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,oBAAC,YAAD;EAAqB;EAAS,UAAU;EAAW,GAAI;YACrD,oBAAC,SAAD;GACE,OACE,oBAAC,OAAD;IACE,SAAQ;IACR,QAAQ,EACN,OAAO,mBAAmB,WAAW,YAAY,EACnD;IAEA,YAAY,CAAC,oBAAC,MAAD,CAAK,CAAA,CAAC;GACpB,CAAA;aAGH,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,UAAU;KACV,YAAY;KACZ,OAAO;KACP,QAAQ;IACV;cAPF,CASE,oBAAC,kBAAD;KACE,SAAQ;KACR,MAAM;KACN,OAAO;KACP,KAAK,WAAW;MACd,UAAU;MACV,OAAO,MAAM,KAAK,QAAQ,KAAK;MAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK,KACjC,CAAC;KACH;IACD,CAAA,GACD,oBAAC,kBAAD;KACE,SAAS,YAAY,kBAAkB;KACvC,MAAM;KACC;KACP,KAAK,WAAW;MACd,SAAS,UAAU,OAAO,CAAC,YAAY,KAAM;MAC7C,OAAO,MAAM,KAAK,QAAQ,QAAQ;MAClC,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,QAAQ,MACpC,CAAC;KACH;IACD,CAAA,CACE;;EACE,CAAA;CACC,CAAA;AAEhB"}
+{"version":3,"file":"ProgressToNextUpdate.js","names":[],"sources":["../../../src/components/ProgressToNextUpdate.tsx"],"sourcesContent":["import type { IconButtonProps } from '@mui/material'\nimport { Box, CircularProgress, IconButton, Tooltip } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport { Trans } from 'react-i18next'\n\nconst getProgressValue = (updatedAt: number, timeToUpdate: number) =>\n  updatedAt ? Math.min(100, ((Date.now() - updatedAt) / timeToUpdate) * 100) : 0\n\nconst getSecondsToUpdate = (updatedAt: number, timeToUpdate: number) =>\n  Math.max(Math.round((timeToUpdate - (Date.now() - updatedAt)) / 1000), 0)\n\nexport const ProgressToNextUpdate: React.FC<\n  {\n    updatedAt: number\n    timeToUpdate: number\n    isLoading?: boolean\n  } & IconButtonProps\n> = ({ updatedAt, timeToUpdate, isLoading, onClick, ...other }) => {\n  const [value, setValue] = useState(() =>\n    getProgressValue(updatedAt, timeToUpdate)\n  )\n\n  useEffect(() => {\n    setValue(getProgressValue(updatedAt, timeToUpdate))\n    const id = setInterval(() => {\n      const time = getProgressValue(updatedAt, timeToUpdate)\n      setValue(time)\n      if (time >= 100) {\n        clearInterval(id)\n      }\n    }, 1000)\n    return () => clearInterval(id)\n  }, [timeToUpdate, updatedAt])\n\n  useEffect(() => {\n    if (isLoading) {\n      setValue(0)\n    }\n  }, [isLoading])\n\n  return (\n    <IconButton onClick={onClick} disabled={isLoading} {...other}>\n      <Tooltip\n        title={\n          <Trans\n            i18nKey=\"tooltip.progressToNextUpdate\"\n            values={{\n              value: getSecondsToUpdate(updatedAt, timeToUpdate),\n            }}\n            // biome-ignore lint/correctness/useJsxKeyInIterable: allowed in react-i18next\n            components={[<br />]}\n          />\n        }\n      >\n        <Box\n          sx={{\n            display: 'grid',\n            position: 'relative',\n            placeItems: 'center',\n            width: 24,\n            height: 24,\n          }}\n        >\n          <CircularProgress\n            variant=\"determinate\"\n            size={24}\n            value={100}\n            sx={(theme) => ({\n              position: 'absolute',\n              color: theme.vars.palette.grey[300],\n              ...theme.applyStyles('dark', {\n                color: theme.vars.palette.grey[800],\n              }),\n            })}\n          />\n          <CircularProgress\n            variant={isLoading ? 'indeterminate' : 'determinate'}\n            size={24}\n            value={value}\n            sx={(theme) => ({\n              opacity: value === 100 && !isLoading ? 0.5 : 1,\n              color: theme.vars.palette.primary.main,\n              ...theme.applyStyles('dark', {\n                color: theme.vars.palette.primary.light,\n              }),\n            })}\n          />\n        </Box>\n      </Tooltip>\n    </IconButton>\n  )\n}\n"],"mappings":";;;;;AAKA,MAAM,oBAAoB,WAAmB,iBAC3C,YAAY,KAAK,IAAI,MAAO,KAAK,IAAI,IAAI,aAAa,eAAgB,GAAG,IAAI;AAE/E,MAAM,sBAAsB,WAAmB,iBAC7C,KAAK,IAAI,KAAK,OAAO,gBAAgB,KAAK,IAAI,IAAI,cAAc,GAAI,GAAG,CAAC;AAE1E,MAAa,wBAMR,EAAE,WAAW,cAAc,WAAW,SAAS,GAAG,YAAY;CACjE,MAAM,CAAC,OAAO,YAAY,eACxB,iBAAiB,WAAW,YAAY,CAC1C;CAEA,gBAAgB;EACd,SAAS,iBAAiB,WAAW,YAAY,CAAC;EAClD,MAAM,KAAK,kBAAkB;GAC3B,MAAM,OAAO,iBAAiB,WAAW,YAAY;GACrD,SAAS,IAAI;GACb,IAAI,QAAQ,KACV,cAAc,EAAE;EAEpB,GAAG,GAAI;EACP,aAAa,cAAc,EAAE;CAC/B,GAAG,CAAC,cAAc,SAAS,CAAC;CAE5B,gBAAgB;EACd,IAAI,WACF,SAAS,CAAC;CAEd,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,oBAAC,YAAD;EAAqB;EAAS,UAAU;EAAW,GAAI;EACrD,UAAA,oBAAC,SAAD;GACE,OACE,oBAAC,OAAD;IACE,SAAQ;IACR,QAAQ,EACN,OAAO,mBAAmB,WAAW,YAAY,EACnD;IAEA,YAAY,CAAC,oBAAC,MAAD,CAAK,CAAA,CAAC;GACpB,CAAA;GAGH,UAAA,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,UAAU;KACV,YAAY;KACZ,OAAO;KACP,QAAQ;IACV;IAPF,UAAA,CASE,oBAAC,kBAAD;KACE,SAAQ;KACR,MAAM;KACN,OAAO;KACP,KAAK,WAAW;MACd,UAAU;MACV,OAAO,MAAM,KAAK,QAAQ,KAAK;MAC/B,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,KAAK,KACjC,CAAC;KACH;IACD,CAAA,GACD,oBAAC,kBAAD;KACE,SAAS,YAAY,kBAAkB;KACvC,MAAM;KACC;KACP,KAAK,WAAW;MACd,SAAS,UAAU,OAAO,CAAC,YAAY,KAAM;MAC7C,OAAO,MAAM,KAAK,QAAQ,QAAQ;MAClC,GAAG,MAAM,YAAY,QAAQ,EAC3B,OAAO,MAAM,KAAK,QAAQ,QAAQ,MACpC,CAAC;KACH;IACD,CAAA,CACE;;EACE,CAAA;CACC,CAAA;AAEhB"}

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

@@ -1 +1 @@
-{"version":3,"file":"ReverseTokensButton.js","names":[],"sources":["../../../../src/components/ReverseTokensButton/ReverseTokensButton.tsx"],"sourcesContent":["import ArrowForward from '@mui/icons-material/ArrowForward'\nimport type { JSX } from 'react'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useToAddressAutoPopulate } from '../../hooks/useToAddressAutoPopulate.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { IconCard, ReverseContainer } from './ReverseTokensButton.style.js'\n\nexport const ReverseTokensButton = (): JSX.Element => {\n  const { setFieldValue, getFieldValues } = useFieldActions()\n  const { getChainById } = useAvailableChains()\n  const { tryResetToAddress } = useToAddressReset()\n  const autoPopulateToAddress = useToAddressAutoPopulate()\n\n  const handleClick = () => {\n    const [fromChainId, fromToken, toChainId, toToken, toAddress] =\n      getFieldValues(\n        'fromChain',\n        'fromToken',\n        'toChain',\n        'toToken',\n        'toAddress'\n      )\n    setFieldValue('fromAmount', '', { isTouched: true })\n    setFieldValue('fromChain', toChainId, { isTouched: true })\n    setFieldValue('fromToken', toToken, { isTouched: true })\n    setFieldValue('toChain', fromChainId, { isTouched: true })\n    setFieldValue('toToken', fromToken, { isTouched: true })\n\n    const autoPopulatedToAddress = autoPopulateToAddress({\n      formType: 'from',\n      selectedToAddress: toAddress,\n      selectedChainId: toChainId,\n      selectedOppositeChainId: fromChainId,\n      selectedOppositeTokenAddress: fromToken,\n    })\n\n    // Returning early as a compatible connected wallet was found, and toAddress has been populated\n    if (autoPopulatedToAddress) {\n      return\n    }\n\n    // Auto-population applies in certain scenarios, but otherwise,\n    // we attempt to reset `toAddress` when bridging across ecosystems\n    // fromChainId becomes toChainId after using reverse\n    const toChain = getChainById(fromChainId)\n    if (toChain) {\n      tryResetToAddress(toChain)\n    }\n  }\n  return (\n    <ReverseContainer>\n      <IconCard\n        data-testid=\"widget-reverse-tokens-button\"\n        onClick={handleClick}\n      >\n        <ArrowForward fontSize=\"inherit\" />\n      </IconCard>\n    </ReverseContainer>\n  )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,4BAAyC;CACpD,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,EAAE,iBAAiB,mBAAmB;CAC5C,MAAM,EAAE,sBAAsB,kBAAkB;CAChD,MAAM,wBAAwB,yBAAyB;CAEvD,MAAM,oBAAoB;EACxB,MAAM,CAAC,aAAa,WAAW,WAAW,SAAS,aACjD,eACE,aACA,aACA,WACA,WACA,WACF;EACF,cAAc,cAAc,IAAI,EAAE,WAAW,KAAK,CAAC;EACnD,cAAc,aAAa,WAAW,EAAE,WAAW,KAAK,CAAC;EACzD,cAAc,aAAa,SAAS,EAAE,WAAW,KAAK,CAAC;EACvD,cAAc,WAAW,aAAa,EAAE,WAAW,KAAK,CAAC;EACzD,cAAc,WAAW,WAAW,EAAE,WAAW,KAAK,CAAC;EAWvD,IAT+B,sBAAsB;GACnD,UAAU;GACV,mBAAmB;GACnB,iBAAiB;GACjB,yBAAyB;GACzB,8BAA8B;EAChC,CAGyB,GACvB;EAMF,MAAM,UAAU,aAAa,WAAW;EACxC,IAAI,SACF,kBAAkB,OAAO;CAE7B;CACA,OACE,oBAAC,kBAAD,EAAA,UACE,oBAAC,UAAD;EACE,eAAY;EACZ,SAAS;YAET,oBAAC,cAAD,EAAc,UAAS,UAAW,CAAA;CAC1B,CAAA,EACM,CAAA;AAEtB"}
+{"version":3,"file":"ReverseTokensButton.js","names":[],"sources":["../../../../src/components/ReverseTokensButton/ReverseTokensButton.tsx"],"sourcesContent":["import ArrowForward from '@mui/icons-material/ArrowForward'\nimport type { JSX } from 'react'\nimport { useAvailableChains } from '../../hooks/useAvailableChains.js'\nimport { useToAddressAutoPopulate } from '../../hooks/useToAddressAutoPopulate.js'\nimport { useToAddressReset } from '../../hooks/useToAddressReset.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { IconCard, ReverseContainer } from './ReverseTokensButton.style.js'\n\nexport const ReverseTokensButton = (): JSX.Element => {\n  const { setFieldValue, getFieldValues } = useFieldActions()\n  const { getChainById } = useAvailableChains()\n  const { tryResetToAddress } = useToAddressReset()\n  const autoPopulateToAddress = useToAddressAutoPopulate()\n\n  const handleClick = () => {\n    const [fromChainId, fromToken, toChainId, toToken, toAddress] =\n      getFieldValues(\n        'fromChain',\n        'fromToken',\n        'toChain',\n        'toToken',\n        'toAddress'\n      )\n    setFieldValue('fromAmount', '', { isTouched: true })\n    setFieldValue('fromChain', toChainId, { isTouched: true })\n    setFieldValue('fromToken', toToken, { isTouched: true })\n    setFieldValue('toChain', fromChainId, { isTouched: true })\n    setFieldValue('toToken', fromToken, { isTouched: true })\n\n    const autoPopulatedToAddress = autoPopulateToAddress({\n      formType: 'from',\n      selectedToAddress: toAddress,\n      selectedChainId: toChainId,\n      selectedOppositeChainId: fromChainId,\n      selectedOppositeTokenAddress: fromToken,\n    })\n\n    // Returning early as a compatible connected wallet was found, and toAddress has been populated\n    if (autoPopulatedToAddress) {\n      return\n    }\n\n    // Auto-population applies in certain scenarios, but otherwise,\n    // we attempt to reset `toAddress` when bridging across ecosystems\n    // fromChainId becomes toChainId after using reverse\n    const toChain = getChainById(fromChainId)\n    if (toChain) {\n      tryResetToAddress(toChain)\n    }\n  }\n  return (\n    <ReverseContainer>\n      <IconCard\n        data-testid=\"widget-reverse-tokens-button\"\n        onClick={handleClick}\n      >\n        <ArrowForward fontSize=\"inherit\" />\n      </IconCard>\n    </ReverseContainer>\n  )\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,4BAAyC;CACpD,MAAM,EAAE,eAAe,mBAAmB,gBAAgB;CAC1D,MAAM,EAAE,iBAAiB,mBAAmB;CAC5C,MAAM,EAAE,sBAAsB,kBAAkB;CAChD,MAAM,wBAAwB,yBAAyB;CAEvD,MAAM,oBAAoB;EACxB,MAAM,CAAC,aAAa,WAAW,WAAW,SAAS,aACjD,eACE,aACA,aACA,WACA,WACA,WACF;EACF,cAAc,cAAc,IAAI,EAAE,WAAW,KAAK,CAAC;EACnD,cAAc,aAAa,WAAW,EAAE,WAAW,KAAK,CAAC;EACzD,cAAc,aAAa,SAAS,EAAE,WAAW,KAAK,CAAC;EACvD,cAAc,WAAW,aAAa,EAAE,WAAW,KAAK,CAAC;EACzD,cAAc,WAAW,WAAW,EAAE,WAAW,KAAK,CAAC;EAWvD,IAT+B,sBAAsB;GACnD,UAAU;GACV,mBAAmB;GACnB,iBAAiB;GACjB,yBAAyB;GACzB,8BAA8B;EAChC,CAGyB,GACvB;EAMF,MAAM,UAAU,aAAa,WAAW;EACxC,IAAI,SACF,kBAAkB,OAAO;CAE7B;CACA,OACE,oBAAC,kBAAD,EAAA,UACE,oBAAC,UAAD;EACE,eAAY;EACZ,SAAS;EAET,UAAA,oBAAC,cAAD,EAAc,UAAS,UAAW,CAAA;CAC1B,CAAA,EACM,CAAA;AAEtB"}

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

@@ -1 +1 @@
-{"version":3,"file":"RouteCard.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteCard.tsx"],"sourcesContent":["import type { TokenAmount } from '@lifi/sdk'\nimport { Box, Tooltip } from '@mui/material'\nimport { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { RouteLabel } from '../../types/widget.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardLabel, CardLabelTypography } from '../Card/CardLabel.js'\nimport { getMatchingLabels } from './getMatchingLabels.js'\nimport { RouteToken } from './RouteToken.js'\nimport type { RouteCardProps } from './types.js'\n\nexport const RouteCard: React.FC<\n  RouteCardProps & Omit<CardProps, 'variant'>\n> = ({\n  route,\n  active,\n  variant = 'default',\n  expanded: defaultExpanded,\n  ...other\n}) => {\n  const { t } = useTranslation()\n  const { mode, modeOptions, routeLabels, hiddenUI } = useWidgetConfig()\n\n  const token: TokenAmount =\n    mode === 'custom' && modeOptions?.custom?.type !== 'deposit'\n      ? { ...route.fromToken, amount: BigInt(route.fromAmount) }\n      : { ...route.toToken, amount: BigInt(route.toAmount) }\n  const impactToken: TokenAmount | undefined =\n    mode !== 'custom' && !hiddenUI?.routeCardPriceImpact\n      ? { ...route.fromToken, amount: BigInt(route.fromAmount) }\n      : undefined\n\n  const [tags, customLabels]: [string[], RouteLabel[]] = useMemo(() => {\n    const mainTag = route.tags?.find(\n      (tag) => tag === 'CHEAPEST' || tag === 'FASTEST'\n    )\n    const tags: string[] = mainTag ? [mainTag] : []\n    const { combinedFeesUSD } = getAccumulatedFeeCostsBreakdown(route)\n    if (!combinedFeesUSD) {\n      tags.push('gasless')\n    }\n    if (route.steps.length > 1) {\n      tags.push('multistep')\n    }\n    const customLabels = getMatchingLabels(route, routeLabels)\n    return [tags, customLabels]\n  }, [route.tags, route, routeLabels])\n\n  const cardContent = (\n    <Box\n      sx={{\n        flex: 1,\n      }}\n    >\n      {mode !== 'refuel' && (tags.length || customLabels.length) ? (\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            mb: 2,\n            gap: 1,\n            flexWrap: 'wrap',\n          }}\n        >\n          {tags?.map((tag) => {\n            const formattedTag = tag.toLowerCase()\n            const tooltipKey = `tooltip.${formattedTag}` as any\n            const tooltipText = t(tooltipKey)\n            const hasTooltip = tooltipText !== tooltipKey\n\n            const cardLabel = (\n              <CardLabel\n                variant={\n                  tag === 'gasless'\n                    ? 'success'\n                    : active\n                      ? 'secondary'\n                      : undefined\n                }\n                key={tag}\n              >\n                <CardLabelTypography>\n                  {t(`main.tags.${formattedTag}` as any)}\n                </CardLabelTypography>\n              </CardLabel>\n            )\n\n            return hasTooltip ? (\n              <Tooltip key={tag} title={tooltipText} arrow placement=\"top\">\n                {cardLabel}\n              </Tooltip>\n            ) : (\n              cardLabel\n            )\n          })}\n          {customLabels.map((label, index) => (\n            <CardLabel key={index} sx={label.sx}>\n              <CardLabelTypography>{label.text}</CardLabelTypography>\n            </CardLabel>\n          ))}\n        </Box>\n      ) : null}\n      <RouteToken\n        route={route}\n        token={token}\n        impactToken={impactToken}\n        defaultExpanded={defaultExpanded}\n        showEssentials\n      />\n    </Box>\n  )\n\n  return mode === 'refuel' || variant === 'cardless' ? (\n    cardContent\n  ) : (\n    <Card\n      type={active ? 'selected' : 'default'}\n      selectionColor=\"secondary\"\n      indented\n      {...other}\n    >\n      {cardContent}\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,aAER,EACH,OACA,QACA,UAAU,WACV,UAAU,iBACV,GAAG,YACC;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,aAAa,aAAa,aAAa,gBAAgB;CAErE,MAAM,QACJ,SAAS,YAAY,aAAa,QAAQ,SAAS,YAC/C;EAAE,GAAG,MAAM;EAAW,QAAQ,OAAO,MAAM,UAAU;CAAE,IACvD;EAAE,GAAG,MAAM;EAAS,QAAQ,OAAO,MAAM,QAAQ;CAAE;CACzD,MAAM,cACJ,SAAS,YAAY,CAAC,UAAU,uBAC5B;EAAE,GAAG,MAAM;EAAW,QAAQ,OAAO,MAAM,UAAU;CAAE,IACvD,KAAA;CAEN,MAAM,CAAC,MAAM,gBAA0C,cAAc;EACnE,MAAM,UAAU,MAAM,MAAM,MACzB,QAAQ,QAAQ,cAAc,QAAQ,SACzC;EACA,MAAM,OAAiB,UAAU,CAAC,OAAO,IAAI,CAAC;EAC9C,MAAM,EAAE,oBAAoB,gCAAgC,KAAK;EACjE,IAAI,CAAC,iBACH,KAAK,KAAK,SAAS;EAErB,IAAI,MAAM,MAAM,SAAS,GACvB,KAAK,KAAK,WAAW;EAGvB,OAAO,CAAC,MADa,kBAAkB,OAAO,WACrB,CAAC;CAC5B,GAAG;EAAC,MAAM;EAAM;EAAO;CAAW,CAAC;CAEnC,MAAM,cACJ,qBAAC,KAAD;EACE,IAAI,EACF,MAAM,EACR;YAHF,CAKG,SAAS,aAAa,KAAK,UAAU,aAAa,UACjD,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,IAAI;IACJ,KAAK;IACL,UAAU;GACZ;aAPF,CASG,MAAM,KAAK,QAAQ;IAClB,MAAM,eAAe,IAAI,YAAY;IACrC,MAAM,aAAa,WAAW;IAC9B,MAAM,cAAc,EAAE,UAAU;IAChC,MAAM,aAAa,gBAAgB;IAEnC,MAAM,YACJ,oBAAC,WAAD;KACE,SACE,QAAQ,YACJ,YACA,SACE,cACA,KAAA;eAIR,oBAAC,qBAAD,EAAA,UACG,EAAE,aAAa,cAAqB,EAClB,CAAA;IACZ,GALJ,GAKI;IAGb,OAAO,aACL,oBAAC,SAAD;KAAmB,OAAO;KAAa,OAAA;KAAM,WAAU;eACpD;IACM,GAFK,GAEL,IAET;GAEJ,CAAC,GACA,aAAa,KAAK,OAAO,UACxB,oBAAC,WAAD;IAAuB,IAAI,MAAM;cAC/B,oBAAC,qBAAD,EAAA,UAAsB,MAAM,KAA0B,CAAA;GAC7C,GAFK,KAEL,CACZ,CACE;OACH,MACJ,oBAAC,YAAD;GACS;GACA;GACM;GACI;GACjB,gBAAA;EACD,CAAA,CACE;;CAGP,OAAO,SAAS,YAAY,YAAY,aACtC,cAEA,oBAACA,QAAD;EACE,MAAM,SAAS,aAAa;EAC5B,gBAAe;EACf,UAAA;EACA,GAAI;YAEH;CACG,CAAA;AAEV"}
+{"version":3,"file":"RouteCard.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteCard.tsx"],"sourcesContent":["import type { TokenAmount } from '@lifi/sdk'\nimport { Box, Tooltip } from '@mui/material'\nimport { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { RouteLabel } from '../../types/widget.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardLabel, CardLabelTypography } from '../Card/CardLabel.js'\nimport { getMatchingLabels } from './getMatchingLabels.js'\nimport { RouteToken } from './RouteToken.js'\nimport type { RouteCardProps } from './types.js'\n\nexport const RouteCard: React.FC<\n  RouteCardProps & Omit<CardProps, 'variant'>\n> = ({\n  route,\n  active,\n  variant = 'default',\n  expanded: defaultExpanded,\n  ...other\n}) => {\n  const { t } = useTranslation()\n  const { mode, modeOptions, routeLabels, hiddenUI } = useWidgetConfig()\n\n  const token: TokenAmount =\n    mode === 'custom' && modeOptions?.custom?.type !== 'deposit'\n      ? { ...route.fromToken, amount: BigInt(route.fromAmount) }\n      : { ...route.toToken, amount: BigInt(route.toAmount) }\n  const impactToken: TokenAmount | undefined =\n    mode !== 'custom' && !hiddenUI?.routeCardPriceImpact\n      ? { ...route.fromToken, amount: BigInt(route.fromAmount) }\n      : undefined\n\n  const [tags, customLabels]: [string[], RouteLabel[]] = useMemo(() => {\n    const mainTag = route.tags?.find(\n      (tag) => tag === 'CHEAPEST' || tag === 'FASTEST'\n    )\n    const tags: string[] = mainTag ? [mainTag] : []\n    const { combinedFeesUSD } = getAccumulatedFeeCostsBreakdown(route)\n    if (!combinedFeesUSD) {\n      tags.push('gasless')\n    }\n    if (route.steps.length > 1) {\n      tags.push('multistep')\n    }\n    const customLabels = getMatchingLabels(route, routeLabels)\n    return [tags, customLabels]\n  }, [route.tags, route, routeLabels])\n\n  const cardContent = (\n    <Box\n      sx={{\n        flex: 1,\n      }}\n    >\n      {mode !== 'refuel' && (tags.length || customLabels.length) ? (\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            mb: 2,\n            gap: 1,\n            flexWrap: 'wrap',\n          }}\n        >\n          {tags?.map((tag) => {\n            const formattedTag = tag.toLowerCase()\n            const tooltipKey = `tooltip.${formattedTag}` as any\n            const tooltipText = t(tooltipKey)\n            const hasTooltip = tooltipText !== tooltipKey\n\n            const cardLabel = (\n              <CardLabel\n                variant={\n                  tag === 'gasless'\n                    ? 'success'\n                    : active\n                      ? 'secondary'\n                      : undefined\n                }\n                key={tag}\n              >\n                <CardLabelTypography>\n                  {t(`main.tags.${formattedTag}` as any)}\n                </CardLabelTypography>\n              </CardLabel>\n            )\n\n            return hasTooltip ? (\n              <Tooltip key={tag} title={tooltipText} arrow placement=\"top\">\n                {cardLabel}\n              </Tooltip>\n            ) : (\n              cardLabel\n            )\n          })}\n          {customLabels.map((label, index) => (\n            <CardLabel key={index} sx={label.sx}>\n              <CardLabelTypography>{label.text}</CardLabelTypography>\n            </CardLabel>\n          ))}\n        </Box>\n      ) : null}\n      <RouteToken\n        route={route}\n        token={token}\n        impactToken={impactToken}\n        defaultExpanded={defaultExpanded}\n        showEssentials\n      />\n    </Box>\n  )\n\n  return mode === 'refuel' || variant === 'cardless' ? (\n    cardContent\n  ) : (\n    <Card\n      type={active ? 'selected' : 'default'}\n      selectionColor=\"secondary\"\n      indented\n      {...other}\n    >\n      {cardContent}\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAcA,MAAa,aAER,EACH,OACA,QACA,UAAU,WACV,UAAU,iBACV,GAAG,YACC;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,aAAa,aAAa,aAAa,gBAAgB;CAErE,MAAM,QACJ,SAAS,YAAY,aAAa,QAAQ,SAAS,YAC/C;EAAE,GAAG,MAAM;EAAW,QAAQ,OAAO,MAAM,UAAU;CAAE,IACvD;EAAE,GAAG,MAAM;EAAS,QAAQ,OAAO,MAAM,QAAQ;CAAE;CACzD,MAAM,cACJ,SAAS,YAAY,CAAC,UAAU,uBAC5B;EAAE,GAAG,MAAM;EAAW,QAAQ,OAAO,MAAM,UAAU;CAAE,IACvD,KAAA;CAEN,MAAM,CAAC,MAAM,gBAA0C,cAAc;EACnE,MAAM,UAAU,MAAM,MAAM,MACzB,QAAQ,QAAQ,cAAc,QAAQ,SACzC;EACA,MAAM,OAAiB,UAAU,CAAC,OAAO,IAAI,CAAC;EAC9C,MAAM,EAAE,oBAAoB,gCAAgC,KAAK;EACjE,IAAI,CAAC,iBACH,KAAK,KAAK,SAAS;EAErB,IAAI,MAAM,MAAM,SAAS,GACvB,KAAK,KAAK,WAAW;EAGvB,OAAO,CAAC,MADa,kBAAkB,OAAO,WACrB,CAAC;CAC5B,GAAG;EAAC,MAAM;EAAM;EAAO;CAAW,CAAC;CAEnC,MAAM,cACJ,qBAAC,KAAD;EACE,IAAI,EACF,MAAM,EACR;EAHF,UAAA,CAKG,SAAS,aAAa,KAAK,UAAU,aAAa,UACjD,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,IAAI;IACJ,KAAK;IACL,UAAU;GACZ;GAPF,UAAA,CASG,MAAM,KAAK,QAAQ;IAClB,MAAM,eAAe,IAAI,YAAY;IACrC,MAAM,aAAa,WAAW;IAC9B,MAAM,cAAc,EAAE,UAAU;IAChC,MAAM,aAAa,gBAAgB;IAEnC,MAAM,YACJ,oBAAC,WAAD;KACE,SACE,QAAQ,YACJ,YACA,SACE,cACA,KAAA;KAIR,UAAA,oBAAC,qBAAD,EAAA,UACG,EAAE,aAAa,cAAqB,EAClB,CAAA;IACZ,GALJ,GAKI;IAGb,OAAO,aACL,oBAAC,SAAD;KAAmB,OAAO;KAAa,OAAA;KAAM,WAAU;KACpD,UAAA;IACM,GAFK,GAEL,IAET;GAEJ,CAAC,GACA,aAAa,KAAK,OAAO,UACxB,oBAAC,WAAD;IAAuB,IAAI,MAAM;IAC/B,UAAA,oBAAC,qBAAD,EAAA,UAAsB,MAAM,KAA0B,CAAA;GAC7C,GAFK,KAEL,CACZ,CACE;EACH,CAAA,IAAA,MACJ,oBAAC,YAAD;GACS;GACA;GACM;GACI;GACjB,gBAAA;EACD,CAAA,CACE;;CAGP,OAAO,SAAS,YAAY,YAAY,aACtC,cAEA,oBAACA,QAAD;EACE,MAAM,SAAS,aAAa;EAC5B,gBAAe;EACf,UAAA;EACA,GAAI;EAEH,UAAA;CACG,CAAA;AAEV"}

package/dist/esm/components/RouteCard/RouteCardEssentials.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteCardEssentials.js","names":[],"sources":["../../../../src/components/RouteCard/RouteCardEssentials.tsx"],"sourcesContent":["import AccessTimeFilled from '@mui/icons-material/AccessTimeFilled'\nimport LocalGasStationRounded from '@mui/icons-material/LocalGasStationRounded'\nimport { Box, Tooltip, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport { formatDuration } from '../../utils/format.js'\nimport { FeeBreakdownTooltip } from '../FeeBreakdownTooltip.js'\nimport { IconTypography } from '../IconTypography.js'\nimport { TokenRate } from '../TokenRate/TokenRate.js'\nimport type { RouteCardEssentialsProps } from './types.js'\n\nexport const RouteCardEssentials: React.FC<RouteCardEssentialsProps> = ({\n  route,\n}) => {\n  const { t, i18n } = useTranslation()\n  const executionTimeSeconds = Math.floor(\n    route.steps.reduce(\n      (duration, step) => duration + step.estimate.executionDuration,\n      0\n    )\n  )\n\n  const { gasCosts, feeCosts, combinedFeesUSD } =\n    getAccumulatedFeeCostsBreakdown(route)\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        flex: 1,\n        mt: 2,\n      }}\n    >\n      <Tooltip title={t('tooltip.exchangeRate')}>\n        <TokenRate route={route} />\n      </Tooltip>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n        }}\n      >\n        <FeeBreakdownTooltip\n          gasCosts={gasCosts}\n          feeCosts={feeCosts}\n          gasless={!combinedFeesUSD}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              mr: 1.5,\n              alignItems: 'center',\n            }}\n          >\n            <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n              <LocalGasStationRounded fontSize=\"inherit\" />\n            </IconTypography>\n            <Typography\n              data-value={combinedFeesUSD}\n              sx={{\n                fontSize: 14,\n                color: 'text.primary',\n                fontWeight: 600,\n                lineHeight: 1,\n              }}\n            >\n              {!combinedFeesUSD\n                ? t('main.fees.free')\n                : t('format.currency', {\n                    value: combinedFeesUSD,\n                  })}\n            </Typography>\n          </Box>\n        </FeeBreakdownTooltip>\n        <Tooltip title={t('tooltip.estimatedTime')} sx={{ cursor: 'help' }}>\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n            }}\n          >\n            <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n              <AccessTimeFilled fontSize=\"inherit\" />\n            </IconTypography>\n            <Typography\n              sx={{\n                fontSize: 14,\n                color: 'text.primary',\n                fontWeight: 600,\n                lineHeight: 1,\n              }}\n            >\n              {formatDuration(executionTimeSeconds, i18n.language)}\n            </Typography>\n          </Box>\n        </Tooltip>\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAa,uBAA2D,EACtE,YACI;CACJ,MAAM,EAAE,GAAG,SAAS,eAAe;CACnC,MAAM,uBAAuB,KAAK,MAChC,MAAM,MAAM,QACT,UAAU,SAAS,WAAW,KAAK,SAAS,mBAC7C,CACF,CACF;CAEA,MAAM,EAAE,UAAU,UAAU,oBAC1B,gCAAgC,KAAK;CACvC,OACE,qBAAC,KAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,MAAM;GACN,IAAI;EACN;YAPF,CASE,oBAAC,SAAD;GAAS,OAAO,EAAE,sBAAsB;aACtC,oBAAC,WAAD,EAAkB,MAAQ,CAAA;EACnB,CAAA,GACT,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;GACd;aAJF,CAME,oBAAC,qBAAD;IACY;IACA;IACV,SAAS,CAAC;cAEV,qBAAC,KAAD;KACE,IAAI;MACF,SAAS;MACT,IAAI;MACJ,YAAY;KACd;eALF,CAOE,oBAAC,gBAAD;MAAgB,WAAU;MAAO,IAAI;OAAE,IAAI;OAAK,UAAU;MAAG;gBAC3D,oBAAC,wBAAD,EAAwB,UAAS,UAAW,CAAA;KAC9B,CAAA,GAChB,oBAAC,YAAD;MACE,cAAY;MACZ,IAAI;OACF,UAAU;OACV,OAAO;OACP,YAAY;OACZ,YAAY;MACd;gBAEC,CAAC,kBACE,EAAE,gBAAgB,IAClB,EAAE,mBAAmB,EACnB,OAAO,gBACT,CAAC;KACK,CAAA,CACT;;GACc,CAAA,GACrB,oBAAC,SAAD;IAAS,OAAO,EAAE,uBAAuB;IAAG,IAAI,EAAE,QAAQ,OAAO;cAC/D,qBAAC,KAAD;KACE,IAAI;MACF,SAAS;MACT,YAAY;KACd;eAJF,CAME,oBAAC,gBAAD;MAAgB,WAAU;MAAO,IAAI;OAAE,IAAI;OAAK,UAAU;MAAG;gBAC3D,oBAAC,kBAAD,EAAkB,UAAS,UAAW,CAAA;KACxB,CAAA,GAChB,oBAAC,YAAD;MACE,IAAI;OACF,UAAU;OACV,OAAO;OACP,YAAY;OACZ,YAAY;MACd;gBAEC,eAAe,sBAAsB,KAAK,QAAQ;KACzC,CAAA,CACT;;GACE,CAAA,CACN;IACF;;AAET"}
+{"version":3,"file":"RouteCardEssentials.js","names":[],"sources":["../../../../src/components/RouteCard/RouteCardEssentials.tsx"],"sourcesContent":["import AccessTimeFilled from '@mui/icons-material/AccessTimeFilled'\nimport LocalGasStationRounded from '@mui/icons-material/LocalGasStationRounded'\nimport { Box, Tooltip, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport { formatDuration } from '../../utils/format.js'\nimport { FeeBreakdownTooltip } from '../FeeBreakdownTooltip.js'\nimport { IconTypography } from '../IconTypography.js'\nimport { TokenRate } from '../TokenRate/TokenRate.js'\nimport type { RouteCardEssentialsProps } from './types.js'\n\nexport const RouteCardEssentials: React.FC<RouteCardEssentialsProps> = ({\n  route,\n}) => {\n  const { t, i18n } = useTranslation()\n  const executionTimeSeconds = Math.floor(\n    route.steps.reduce(\n      (duration, step) => duration + step.estimate.executionDuration,\n      0\n    )\n  )\n\n  const { gasCosts, feeCosts, combinedFeesUSD } =\n    getAccumulatedFeeCostsBreakdown(route)\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        flex: 1,\n        mt: 2,\n      }}\n    >\n      <Tooltip title={t('tooltip.exchangeRate')}>\n        <TokenRate route={route} />\n      </Tooltip>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n        }}\n      >\n        <FeeBreakdownTooltip\n          gasCosts={gasCosts}\n          feeCosts={feeCosts}\n          gasless={!combinedFeesUSD}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              mr: 1.5,\n              alignItems: 'center',\n            }}\n          >\n            <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n              <LocalGasStationRounded fontSize=\"inherit\" />\n            </IconTypography>\n            <Typography\n              data-value={combinedFeesUSD}\n              sx={{\n                fontSize: 14,\n                color: 'text.primary',\n                fontWeight: 600,\n                lineHeight: 1,\n              }}\n            >\n              {!combinedFeesUSD\n                ? t('main.fees.free')\n                : t('format.currency', {\n                    value: combinedFeesUSD,\n                  })}\n            </Typography>\n          </Box>\n        </FeeBreakdownTooltip>\n        <Tooltip title={t('tooltip.estimatedTime')} sx={{ cursor: 'help' }}>\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n            }}\n          >\n            <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n              <AccessTimeFilled fontSize=\"inherit\" />\n            </IconTypography>\n            <Typography\n              sx={{\n                fontSize: 14,\n                color: 'text.primary',\n                fontWeight: 600,\n                lineHeight: 1,\n              }}\n            >\n              {formatDuration(executionTimeSeconds, i18n.language)}\n            </Typography>\n          </Box>\n        </Tooltip>\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAa,uBAA2D,EACtE,YACI;CACJ,MAAM,EAAE,GAAG,SAAS,eAAe;CACnC,MAAM,uBAAuB,KAAK,MAChC,MAAM,MAAM,QACT,UAAU,SAAS,WAAW,KAAK,SAAS,mBAC7C,CACF,CACF;CAEA,MAAM,EAAE,UAAU,UAAU,oBAC1B,gCAAgC,KAAK;CACvC,OACE,qBAAC,KAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,MAAM;GACN,IAAI;EACN;EAPF,UAAA,CASE,oBAAC,SAAD;GAAS,OAAO,EAAE,sBAAsB;GACtC,UAAA,oBAAC,WAAD,EAAkB,MAAQ,CAAA;EACnB,CAAA,GACT,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;GACd;GAJF,UAAA,CAME,oBAAC,qBAAD;IACY;IACA;IACV,SAAS,CAAC;IAEV,UAAA,qBAAC,KAAD;KACE,IAAI;MACF,SAAS;MACT,IAAI;MACJ,YAAY;KACd;KALF,UAAA,CAOE,oBAAC,gBAAD;MAAgB,WAAU;MAAO,IAAI;OAAE,IAAI;OAAK,UAAU;MAAG;MAC3D,UAAA,oBAAC,wBAAD,EAAwB,UAAS,UAAW,CAAA;KAC9B,CAAA,GAChB,oBAAC,YAAD;MACE,cAAY;MACZ,IAAI;OACF,UAAU;OACV,OAAO;OACP,YAAY;OACZ,YAAY;MACd;MAEC,UAAA,CAAC,kBACE,EAAE,gBAAgB,IAClB,EAAE,mBAAmB,EACnB,OAAO,gBACT,CAAC;KACK,CAAA,CACT;;GACc,CAAA,GACrB,oBAAC,SAAD;IAAS,OAAO,EAAE,uBAAuB;IAAG,IAAI,EAAE,QAAQ,OAAO;IAC/D,UAAA,qBAAC,KAAD;KACE,IAAI;MACF,SAAS;MACT,YAAY;KACd;KAJF,UAAA,CAME,oBAAC,gBAAD;MAAgB,WAAU;MAAO,IAAI;OAAE,IAAI;OAAK,UAAU;MAAG;MAC3D,UAAA,oBAAC,kBAAD,EAAkB,UAAS,UAAW,CAAA;KACxB,CAAA,GAChB,oBAAC,YAAD;MACE,IAAI;OACF,UAAU;OACV,OAAO;OACP,YAAY;OACZ,YAAY;MACd;MAEC,UAAA,eAAe,sBAAsB,KAAK,QAAQ;KACzC,CAAA,CACT;;GACE,CAAA,CACN;EACF,CAAA,CAAA;;AAET"}

package/dist/esm/components/RouteCard/RouteCardSkeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteCardSkeleton.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteCardSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { TokenSkeleton } from '../Token/Token.js'\nimport type { RouteCardSkeletonProps } from './types.js'\n\nexport const RouteCardSkeleton: React.FC<\n  RouteCardSkeletonProps & Omit<CardProps, 'variant'>\n> = ({ variant, ...other }) => {\n  const { mode } = useWidgetConfig()\n\n  const cardContent = (\n    <Box\n      sx={{\n        flex: 1,\n      }}\n    >\n      {mode !== 'refuel' && mode !== 'custom' ? (\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            mb: 2,\n          }}\n        >\n          <Skeleton\n            variant=\"rectangular\"\n            width={112}\n            height={24}\n            sx={(theme) => ({\n              borderRadius: theme.vars.shape.borderRadius,\n            })}\n          />\n        </Box>\n      ) : null}\n      <TokenSkeleton />\n      <Box\n        sx={{\n          mt: 2,\n          display: 'flex',\n          justifyContent: 'space-between',\n        }}\n      >\n        <Skeleton variant=\"text\" width={64} height={20} />\n        <Skeleton variant=\"text\" width={56} height={20} />\n      </Box>\n    </Box>\n  )\n\n  return mode === 'refuel' || variant === 'cardless' ? (\n    cardContent\n  ) : (\n    <Card indented {...other}>\n      {cardContent}\n    </Card>\n  )\n}\n"],"mappings":";;;;;;AAOA,MAAa,qBAER,EAAE,SAAS,GAAG,YAAY;CAC7B,MAAM,EAAE,SAAS,gBAAgB;CAEjC,MAAM,cACJ,qBAAC,KAAD;EACE,IAAI,EACF,MAAM,EACR;YAHF;GAKG,SAAS,YAAY,SAAS,WAC7B,oBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;KACZ,IAAI;IACN;cAEA,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO;KACP,QAAQ;KACR,KAAK,WAAW,EACd,cAAc,MAAM,KAAK,MAAM,aACjC;IACD,CAAA;GACE,CAAA,IACH;GACJ,oBAAC,eAAD,CAAgB,CAAA;GAChB,qBAAC,KAAD;IACE,IAAI;KACF,IAAI;KACJ,SAAS;KACT,gBAAgB;IAClB;cALF,CAOE,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,GACjD,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,CAC9C;;EACF;;CAGP,OAAO,SAAS,YAAY,YAAY,aACtC,cAEA,oBAACA,QAAD;EAAM,UAAA;EAAS,GAAI;YAChB;CACG,CAAA;AAEV"}
+{"version":3,"file":"RouteCardSkeleton.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteCardSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { TokenSkeleton } from '../Token/Token.js'\nimport type { RouteCardSkeletonProps } from './types.js'\n\nexport const RouteCardSkeleton: React.FC<\n  RouteCardSkeletonProps & Omit<CardProps, 'variant'>\n> = ({ variant, ...other }) => {\n  const { mode } = useWidgetConfig()\n\n  const cardContent = (\n    <Box\n      sx={{\n        flex: 1,\n      }}\n    >\n      {mode !== 'refuel' && mode !== 'custom' ? (\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            mb: 2,\n          }}\n        >\n          <Skeleton\n            variant=\"rectangular\"\n            width={112}\n            height={24}\n            sx={(theme) => ({\n              borderRadius: theme.vars.shape.borderRadius,\n            })}\n          />\n        </Box>\n      ) : null}\n      <TokenSkeleton />\n      <Box\n        sx={{\n          mt: 2,\n          display: 'flex',\n          justifyContent: 'space-between',\n        }}\n      >\n        <Skeleton variant=\"text\" width={64} height={20} />\n        <Skeleton variant=\"text\" width={56} height={20} />\n      </Box>\n    </Box>\n  )\n\n  return mode === 'refuel' || variant === 'cardless' ? (\n    cardContent\n  ) : (\n    <Card indented {...other}>\n      {cardContent}\n    </Card>\n  )\n}\n"],"mappings":";;;;;;AAOA,MAAa,qBAER,EAAE,SAAS,GAAG,YAAY;CAC7B,MAAM,EAAE,SAAS,gBAAgB;CAEjC,MAAM,cACJ,qBAAC,KAAD;EACE,IAAI,EACF,MAAM,EACR;EAHF,UAAA;GAKG,SAAS,YAAY,SAAS,WAC7B,oBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;KACZ,IAAI;IACN;IAEA,UAAA,oBAAC,UAAD;KACE,SAAQ;KACR,OAAO;KACP,QAAQ;KACR,KAAK,WAAW,EACd,cAAc,MAAM,KAAK,MAAM,aACjC;IACD,CAAA;GACE,CAAA,IACH;GACJ,oBAAC,eAAD,CAAgB,CAAA;GAChB,qBAAC,KAAD;IACE,IAAI;KACF,IAAI;KACJ,SAAS;KACT,gBAAgB;IAClB;IALF,UAAA,CAOE,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,GACjD,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,CAC9C;;EACF;;CAGP,OAAO,SAAS,YAAY,YAAY,aACtC,cAEA,oBAACA,QAAD;EAAM,UAAA;EAAS,GAAI;EAChB,UAAA;CACG,CAAA;AAEV"}

package/dist/esm/components/RouteCard/RouteDetails.js

@@ -28,7 +28,8 @@ const RouteDetails = ({ route }) => {
 	let feePercentage = 0;
 	const feeCollectionStep = route.steps[0].includedSteps.find((includedStep) => includedStep.tool === "feeCollection");
 	if (feeCollectionStep) {
-		feeAmountUSD = formatTokenPrice(BigInt(feeCollectionStep.estimate.fromAmount) - BigInt(feeCollectionStep.estimate.toAmount), feeCollectionStep.action.fromToken.priceUSD, feeCollectionStep.action.fromToken.decimals);
+		const estimatedFromAmount = BigInt(feeCollectionStep.estimate.fromAmount) - BigInt(feeCollectionStep.estimate.toAmount);
+		feeAmountUSD = formatTokenPrice(estimatedFromAmount, feeCollectionStep.action.fromToken.priceUSD, feeCollectionStep.action.fromToken.decimals);
 		feePercentage = feeCollectionStep.estimate.feeCosts?.reduce((percentage, feeCost) => percentage + Number.parseFloat(feeCost.percentage || "0"), 0) ?? 0;
 	}
 	const executionTimeSeconds = Math.floor(route.steps.reduce((duration, step) => duration + step.estimate.executionDuration, 0));

package/dist/esm/components/RouteCard/RouteDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteDetails.js","names":[],"sources":["../../../../src/components/RouteCard/RouteDetails.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { useEthereumContext } from '@lifi/widget-provider'\nimport { Box, Tooltip } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTokenRateText } from '../../hooks/useTokenRateText.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { isRouteDone } from '../../stores/routes/utils.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport {\n  formatDuration,\n  formatTokenAmount,\n  formatTokenPrice,\n} from '../../utils/format.js'\nimport { getPriceImpact } from '../../utils/getPriceImpact.js'\nimport { FeeBreakdownTooltip } from '../FeeBreakdownTooltip.js'\nimport { StepActions } from '../Step/StepActions.js'\nimport {\n  DetailInfoIcon,\n  DetailLabel,\n  DetailLabelContainer,\n  DetailRow,\n  DetailValue,\n} from './RouteDetails.style.js'\n\ninterface RouteDetailsProps {\n  route: RouteExtended\n}\n\nexport const RouteDetails = ({ route }: RouteDetailsProps): JSX.Element => {\n  const { t, i18n } = useTranslation()\n  const { rateText, toggleRate } = useTokenRateText(route)\n  const { feeConfig } = useWidgetConfig()\n  const { isGaslessStep } = useEthereumContext()\n\n  const { gasCosts, feeCosts, gasCostUSD, feeCostUSD } =\n    getAccumulatedFeeCostsBreakdown(route)\n\n  const priceImpact = getPriceImpact({\n    fromAmount: BigInt(route.fromAmount),\n    toAmount: BigInt(route.toAmount),\n    fromToken: route.fromToken,\n    toToken: route.toToken,\n  })\n\n  let feeAmountUSD = 0\n  let feePercentage = 0\n\n  const feeCollectionStep = route.steps[0].includedSteps.find(\n    (includedStep) => includedStep.tool === 'feeCollection'\n  )\n\n  if (feeCollectionStep) {\n    const estimatedFromAmount =\n      BigInt(feeCollectionStep.estimate.fromAmount) -\n      BigInt(feeCollectionStep.estimate.toAmount)\n\n    feeAmountUSD = formatTokenPrice(\n      estimatedFromAmount,\n      feeCollectionStep.action.fromToken.priceUSD,\n      feeCollectionStep.action.fromToken.decimals\n    )\n\n    feePercentage =\n      feeCollectionStep.estimate.feeCosts?.reduce(\n        (percentage, feeCost) =>\n          percentage + Number.parseFloat(feeCost.percentage || '0'),\n        0\n      ) ?? 0\n  }\n\n  const executionTimeSeconds = Math.floor(\n    route.steps.reduce(\n      (duration, step) => duration + step.estimate.executionDuration,\n      0\n    )\n  )\n\n  const hasGaslessSupport = route.steps.every((step) => isGaslessStep?.(step))\n\n  const showIntegratorFeeCollectionDetails =\n    (feeAmountUSD || Number.isFinite(feeConfig?.fee)) && !hasGaslessSupport\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1, pt: 1.5 }}>\n      <StepActions route={route} />\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.fees.network')}</DetailLabel>\n          <FeeBreakdownTooltip gasCosts={gasCosts} gasless={hasGaslessSupport}>\n            <DetailInfoIcon />\n          </FeeBreakdownTooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {!gasCostUSD\n            ? t('main.fees.free')\n            : t('format.currency', { value: gasCostUSD })}\n        </DetailValue>\n      </DetailRow>\n      {feeCosts.length ? (\n        <DetailRow>\n          <DetailLabelContainer>\n            <DetailLabel>{t('main.fees.provider')}</DetailLabel>\n            <FeeBreakdownTooltip feeCosts={feeCosts}>\n              <DetailInfoIcon />\n            </FeeBreakdownTooltip>\n          </DetailLabelContainer>\n          <DetailValue>\n            {t('format.currency', { value: feeCostUSD })}\n          </DetailValue>\n        </DetailRow>\n      ) : null}\n      {showIntegratorFeeCollectionDetails ? (\n        <DetailRow>\n          <DetailLabelContainer>\n            <DetailLabel>\n              {feeConfig?.name || t('main.fees.defaultIntegrator')}\n              {feeConfig?.showFeePercentage && (\n                <> ({t('format.percent', { value: feePercentage })})</>\n              )}\n            </DetailLabel>\n            {feeConfig?.showFeeTooltip &&\n            (feeConfig?.name || feeConfig?.feeTooltipComponent) ? (\n              <Tooltip\n                title={\n                  feeConfig?.feeTooltipComponent ||\n                  t('tooltip.feeCollection', { tool: feeConfig.name })\n                }\n              >\n                <DetailInfoIcon />\n              </Tooltip>\n            ) : null}\n          </DetailLabelContainer>\n          <DetailValue>\n            {t('format.currency', { value: feeAmountUSD })}\n          </DetailValue>\n        </DetailRow>\n      ) : null}\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.priceImpact')}</DetailLabel>\n          <Tooltip title={t('tooltip.priceImpact')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {t('format.percent', { value: priceImpact, usePlusSign: true })}\n        </DetailValue>\n      </DetailRow>\n      {!isRouteDone(route) ? (\n        <>\n          <DetailRow>\n            <DetailLabelContainer>\n              <DetailLabel>{t('main.maxSlippage')}</DetailLabel>\n              <Tooltip title={t('tooltip.slippage')}>\n                <DetailInfoIcon />\n              </Tooltip>\n            </DetailLabelContainer>\n            <DetailValue>\n              {route.steps[0].action.slippage\n                ? t('format.percent', {\n                    value: route.steps[0].action.slippage,\n                  })\n                : t('button.auto')}\n            </DetailValue>\n          </DetailRow>\n          <DetailRow>\n            <DetailLabelContainer>\n              <DetailLabel>{t('main.minReceived')}</DetailLabel>\n              <Tooltip title={t('tooltip.minReceived')}>\n                <DetailInfoIcon />\n              </Tooltip>\n            </DetailLabelContainer>\n            <DetailValue>\n              {t('format.tokenAmount', {\n                value: formatTokenAmount(\n                  BigInt(route.toAmountMin),\n                  route.toToken.decimals\n                ),\n              })}{' '}\n              {route.toToken.symbol}\n            </DetailValue>\n          </DetailRow>\n        </>\n      ) : null}\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.exchangeRate')}</DetailLabel>\n          <Tooltip title={t('tooltip.exchangeRate')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue\n          onClick={toggleRate}\n          role=\"button\"\n          sx={{ cursor: 'pointer' }}\n        >\n          {rateText}\n        </DetailValue>\n      </DetailRow>\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.estimatedTime')}</DetailLabel>\n          <Tooltip title={t('tooltip.estimatedTime')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {formatDuration(executionTimeSeconds, i18n.language)}\n        </DetailValue>\n      </DetailRow>\n    </Box>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"RouteDetails.js","names":[],"sources":["../../../../src/components/RouteCard/RouteDetails.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport { useEthereumContext } from '@lifi/widget-provider'\nimport { Box, Tooltip } from '@mui/material'\nimport type { JSX } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useTokenRateText } from '../../hooks/useTokenRateText.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { isRouteDone } from '../../stores/routes/utils.js'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport {\n  formatDuration,\n  formatTokenAmount,\n  formatTokenPrice,\n} from '../../utils/format.js'\nimport { getPriceImpact } from '../../utils/getPriceImpact.js'\nimport { FeeBreakdownTooltip } from '../FeeBreakdownTooltip.js'\nimport { StepActions } from '../Step/StepActions.js'\nimport {\n  DetailInfoIcon,\n  DetailLabel,\n  DetailLabelContainer,\n  DetailRow,\n  DetailValue,\n} from './RouteDetails.style.js'\n\ninterface RouteDetailsProps {\n  route: RouteExtended\n}\n\nexport const RouteDetails = ({ route }: RouteDetailsProps): JSX.Element => {\n  const { t, i18n } = useTranslation()\n  const { rateText, toggleRate } = useTokenRateText(route)\n  const { feeConfig } = useWidgetConfig()\n  const { isGaslessStep } = useEthereumContext()\n\n  const { gasCosts, feeCosts, gasCostUSD, feeCostUSD } =\n    getAccumulatedFeeCostsBreakdown(route)\n\n  const priceImpact = getPriceImpact({\n    fromAmount: BigInt(route.fromAmount),\n    toAmount: BigInt(route.toAmount),\n    fromToken: route.fromToken,\n    toToken: route.toToken,\n  })\n\n  let feeAmountUSD = 0\n  let feePercentage = 0\n\n  const feeCollectionStep = route.steps[0].includedSteps.find(\n    (includedStep) => includedStep.tool === 'feeCollection'\n  )\n\n  if (feeCollectionStep) {\n    const estimatedFromAmount =\n      BigInt(feeCollectionStep.estimate.fromAmount) -\n      BigInt(feeCollectionStep.estimate.toAmount)\n\n    feeAmountUSD = formatTokenPrice(\n      estimatedFromAmount,\n      feeCollectionStep.action.fromToken.priceUSD,\n      feeCollectionStep.action.fromToken.decimals\n    )\n\n    feePercentage =\n      feeCollectionStep.estimate.feeCosts?.reduce(\n        (percentage, feeCost) =>\n          percentage + Number.parseFloat(feeCost.percentage || '0'),\n        0\n      ) ?? 0\n  }\n\n  const executionTimeSeconds = Math.floor(\n    route.steps.reduce(\n      (duration, step) => duration + step.estimate.executionDuration,\n      0\n    )\n  )\n\n  const hasGaslessSupport = route.steps.every((step) => isGaslessStep?.(step))\n\n  const showIntegratorFeeCollectionDetails =\n    (feeAmountUSD || Number.isFinite(feeConfig?.fee)) && !hasGaslessSupport\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1, pt: 1.5 }}>\n      <StepActions route={route} />\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.fees.network')}</DetailLabel>\n          <FeeBreakdownTooltip gasCosts={gasCosts} gasless={hasGaslessSupport}>\n            <DetailInfoIcon />\n          </FeeBreakdownTooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {!gasCostUSD\n            ? t('main.fees.free')\n            : t('format.currency', { value: gasCostUSD })}\n        </DetailValue>\n      </DetailRow>\n      {feeCosts.length ? (\n        <DetailRow>\n          <DetailLabelContainer>\n            <DetailLabel>{t('main.fees.provider')}</DetailLabel>\n            <FeeBreakdownTooltip feeCosts={feeCosts}>\n              <DetailInfoIcon />\n            </FeeBreakdownTooltip>\n          </DetailLabelContainer>\n          <DetailValue>\n            {t('format.currency', { value: feeCostUSD })}\n          </DetailValue>\n        </DetailRow>\n      ) : null}\n      {showIntegratorFeeCollectionDetails ? (\n        <DetailRow>\n          <DetailLabelContainer>\n            <DetailLabel>\n              {feeConfig?.name || t('main.fees.defaultIntegrator')}\n              {feeConfig?.showFeePercentage && (\n                <> ({t('format.percent', { value: feePercentage })})</>\n              )}\n            </DetailLabel>\n            {feeConfig?.showFeeTooltip &&\n            (feeConfig?.name || feeConfig?.feeTooltipComponent) ? (\n              <Tooltip\n                title={\n                  feeConfig?.feeTooltipComponent ||\n                  t('tooltip.feeCollection', { tool: feeConfig.name })\n                }\n              >\n                <DetailInfoIcon />\n              </Tooltip>\n            ) : null}\n          </DetailLabelContainer>\n          <DetailValue>\n            {t('format.currency', { value: feeAmountUSD })}\n          </DetailValue>\n        </DetailRow>\n      ) : null}\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.priceImpact')}</DetailLabel>\n          <Tooltip title={t('tooltip.priceImpact')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {t('format.percent', { value: priceImpact, usePlusSign: true })}\n        </DetailValue>\n      </DetailRow>\n      {!isRouteDone(route) ? (\n        <>\n          <DetailRow>\n            <DetailLabelContainer>\n              <DetailLabel>{t('main.maxSlippage')}</DetailLabel>\n              <Tooltip title={t('tooltip.slippage')}>\n                <DetailInfoIcon />\n              </Tooltip>\n            </DetailLabelContainer>\n            <DetailValue>\n              {route.steps[0].action.slippage\n                ? t('format.percent', {\n                    value: route.steps[0].action.slippage,\n                  })\n                : t('button.auto')}\n            </DetailValue>\n          </DetailRow>\n          <DetailRow>\n            <DetailLabelContainer>\n              <DetailLabel>{t('main.minReceived')}</DetailLabel>\n              <Tooltip title={t('tooltip.minReceived')}>\n                <DetailInfoIcon />\n              </Tooltip>\n            </DetailLabelContainer>\n            <DetailValue>\n              {t('format.tokenAmount', {\n                value: formatTokenAmount(\n                  BigInt(route.toAmountMin),\n                  route.toToken.decimals\n                ),\n              })}{' '}\n              {route.toToken.symbol}\n            </DetailValue>\n          </DetailRow>\n        </>\n      ) : null}\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.exchangeRate')}</DetailLabel>\n          <Tooltip title={t('tooltip.exchangeRate')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue\n          onClick={toggleRate}\n          role=\"button\"\n          sx={{ cursor: 'pointer' }}\n        >\n          {rateText}\n        </DetailValue>\n      </DetailRow>\n      <DetailRow>\n        <DetailLabelContainer>\n          <DetailLabel>{t('main.estimatedTime')}</DetailLabel>\n          <Tooltip title={t('tooltip.estimatedTime')}>\n            <DetailInfoIcon />\n          </Tooltip>\n        </DetailLabelContainer>\n        <DetailValue>\n          {formatDuration(executionTimeSeconds, i18n.language)}\n        </DetailValue>\n      </DetailRow>\n    </Box>\n  )\n}\n"],"mappings":"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"}

package/dist/esm/components/RouteCard/RouteNotFoundCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteNotFoundCard.js","names":[],"sources":["../../../../src/components/RouteCard/RouteNotFoundCard.tsx"],"sourcesContent":["import Route from '@mui/icons-material/Route'\nimport { Box, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\n\nexport const RouteNotFoundCard: React.FC = () => {\n  const { t } = useTranslation()\n  return (\n    <Box\n      sx={{\n        py: 1.625,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        flexDirection: 'column',\n        flex: 1,\n        whiteSpace: 'normal',\n      }}\n    >\n      <Typography\n        sx={{\n          fontSize: 48,\n        }}\n      >\n        <Route fontSize=\"inherit\" />\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 18,\n          fontWeight: 700,\n        }}\n      >\n        {t('info.title.routeNotFound')}\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 14,\n          color: 'text.secondary',\n          textAlign: 'center',\n          mt: 2,\n        }}\n      >\n        {t('info.message.routeNotFound')}\n      </Typography>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAIA,MAAa,0BAAoC;CAC/C,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,eAAe;GACf,MAAM;GACN,YAAY;EACd;YATF;GAWE,oBAAC,YAAD;IACE,IAAI,EACF,UAAU,GACZ;cAEA,oBAAC,OAAD,EAAO,UAAS,UAAW,CAAA;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,YAAY;IACd;cAEC,EAAE,0BAA0B;GACnB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,OAAO;KACP,WAAW;KACX,IAAI;IACN;cAEC,EAAE,4BAA4B;GACrB,CAAA;EACT;;AAET"}
+{"version":3,"file":"RouteNotFoundCard.js","names":[],"sources":["../../../../src/components/RouteCard/RouteNotFoundCard.tsx"],"sourcesContent":["import Route from '@mui/icons-material/Route'\nimport { Box, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\n\nexport const RouteNotFoundCard: React.FC = () => {\n  const { t } = useTranslation()\n  return (\n    <Box\n      sx={{\n        py: 1.625,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        flexDirection: 'column',\n        flex: 1,\n        whiteSpace: 'normal',\n      }}\n    >\n      <Typography\n        sx={{\n          fontSize: 48,\n        }}\n      >\n        <Route fontSize=\"inherit\" />\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 18,\n          fontWeight: 700,\n        }}\n      >\n        {t('info.title.routeNotFound')}\n      </Typography>\n      <Typography\n        sx={{\n          fontSize: 14,\n          color: 'text.secondary',\n          textAlign: 'center',\n          mt: 2,\n        }}\n      >\n        {t('info.message.routeNotFound')}\n      </Typography>\n    </Box>\n  )\n}\n"],"mappings":";;;;;AAIA,MAAa,0BAAoC;CAC/C,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,KAAD;EACE,IAAI;GACF,IAAI;GACJ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,eAAe;GACf,MAAM;GACN,YAAY;EACd;EATF,UAAA;GAWE,oBAAC,YAAD;IACE,IAAI,EACF,UAAU,GACZ;IAEA,UAAA,oBAAC,OAAD,EAAO,UAAS,UAAW,CAAA;GACjB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,YAAY;IACd;IAEC,UAAA,EAAE,0BAA0B;GACnB,CAAA;GACZ,oBAAC,YAAD;IACE,IAAI;KACF,UAAU;KACV,OAAO;KACP,WAAW;KACX,IAAI;IACN;IAEC,UAAA,EAAE,4BAA4B;GACrB,CAAA;EACT;;AAET"}

package/dist/esm/components/RouteCard/RouteProviderCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteProviderCard.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteProviderCard.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport LocalGasStationRounded from '@mui/icons-material/LocalGasStationRounded'\nimport { Box, Skeleton, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport { SmallAvatar } from '../Avatar/SmallAvatar.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { IconTypography } from '../IconTypography.js'\n\ninterface RouteProviderCardProps {\n  route: Route\n  active?: boolean\n}\n\nexport const RouteProviderCard: React.FC<\n  RouteProviderCardProps & Omit<CardProps, 'variant'>\n> = ({ route, active, onClick, ...other }) => {\n  const { t } = useTranslation()\n\n  const provider = route.steps[0]?.toolDetails\n  const { gasCostUSD } = getAccumulatedFeeCostsBreakdown(route)\n\n  return (\n    <Card\n      type={active ? 'selected' : 'default'}\n      selectionColor=\"secondary\"\n      onClick={onClick}\n      sx={{ py: 1.5, px: 2, ...(onClick ? { cursor: 'pointer' } : {}) }}\n      {...other}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 1,\n            minWidth: 0,\n          }}\n        >\n          <SmallAvatar src={provider?.logoURI} alt={provider?.name} size={20}>\n            {provider?.name?.[0]}\n          </SmallAvatar>\n          <Typography\n            noWrap\n            sx={{\n              fontSize: 14,\n              fontWeight: 600,\n              color: 'text.primary',\n            }}\n          >\n            {provider?.name}\n          </Typography>\n        </Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n          }}\n        >\n          <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n            <LocalGasStationRounded fontSize=\"inherit\" />\n          </IconTypography>\n          <Typography\n            data-value={gasCostUSD}\n            sx={{\n              fontSize: 14,\n              color: 'text.primary',\n              fontWeight: 600,\n              lineHeight: 1,\n            }}\n          >\n            {!gasCostUSD\n              ? t('main.fees.free')\n              : t('format.currency', {\n                  value: gasCostUSD,\n                })}\n          </Typography>\n        </Box>\n      </Box>\n    </Card>\n  )\n}\n\nexport const RouteProviderCardSkeleton: React.FC<Omit<CardProps, 'variant'>> = (\n  props\n) => {\n  return (\n    <Card sx={{ py: 1.5, px: 2 }} {...props}>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n        }}\n      >\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n          <Skeleton variant=\"circular\" width={20} height={20} />\n          <Skeleton variant=\"text\" width={80} height={20} />\n        </Box>\n        <Skeleton variant=\"text\" width={56} height={20} />\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;AAeA,MAAa,qBAER,EAAE,OAAO,QAAQ,SAAS,GAAG,YAAY;CAC5C,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,WAAW,MAAM,MAAM,EAAE,EAAE;CACjC,MAAM,EAAE,eAAe,gCAAgC,KAAK;CAE5D,OACE,oBAACA,QAAD;EACE,MAAM,SAAS,aAAa;EAC5B,gBAAe;EACN;EACT,IAAI;GAAE,IAAI;GAAK,IAAI;GAAG,GAAI,UAAU,EAAE,QAAQ,UAAU,IAAI,CAAC;EAAG;EAChE,GAAI;YAEJ,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,KAAK;GACP;aANF,CAQE,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;KACZ,KAAK;KACL,UAAU;IACZ;cANF,CAQE,oBAAC,aAAD;KAAa,KAAK,UAAU;KAAS,KAAK,UAAU;KAAM,MAAM;eAC7D,UAAU,OAAO;IACP,CAAA,GACb,oBAAC,YAAD;KACE,QAAA;KACA,IAAI;MACF,UAAU;MACV,YAAY;MACZ,OAAO;KACT;eAEC,UAAU;IACD,CAAA,CACT;OACL,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;IACd;cAJF,CAME,oBAAC,gBAAD;KAAgB,WAAU;KAAO,IAAI;MAAE,IAAI;MAAK,UAAU;KAAG;eAC3D,oBAAC,wBAAD,EAAwB,UAAS,UAAW,CAAA;IAC9B,CAAA,GAChB,oBAAC,YAAD;KACE,cAAY;KACZ,IAAI;MACF,UAAU;MACV,OAAO;MACP,YAAY;MACZ,YAAY;KACd;eAEC,CAAC,aACE,EAAE,gBAAgB,IAClB,EAAE,mBAAmB,EACnB,OAAO,WACT,CAAC;IACK,CAAA,CACT;KACF;;CACD,CAAA;AAEV;AAEA,MAAa,6BACX,UACG;CACH,OACE,oBAACA,QAAD;EAAM,IAAI;GAAE,IAAI;GAAK,IAAI;EAAE;EAAG,GAAI;YAChC,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,KAAK;GACP;aANF,CAQE,qBAAC,KAAD;IAAK,IAAI;KAAE,SAAS;KAAQ,YAAY;KAAU,KAAK;IAAE;cAAzD,CACE,oBAAC,UAAD;KAAU,SAAQ;KAAW,OAAO;KAAI,QAAQ;IAAK,CAAA,GACrD,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,CAC9C;OACL,oBAAC,UAAD;IAAU,SAAQ;IAAO,OAAO;IAAI,QAAQ;GAAK,CAAA,CAC9C;;CACD,CAAA;AAEV"}
+{"version":3,"file":"RouteProviderCard.js","names":["Card"],"sources":["../../../../src/components/RouteCard/RouteProviderCard.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport LocalGasStationRounded from '@mui/icons-material/LocalGasStationRounded'\nimport { Box, Skeleton, Typography } from '@mui/material'\nimport { useTranslation } from 'react-i18next'\nimport { getAccumulatedFeeCostsBreakdown } from '../../utils/fees.js'\nimport { SmallAvatar } from '../Avatar/SmallAvatar.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { IconTypography } from '../IconTypography.js'\n\ninterface RouteProviderCardProps {\n  route: Route\n  active?: boolean\n}\n\nexport const RouteProviderCard: React.FC<\n  RouteProviderCardProps & Omit<CardProps, 'variant'>\n> = ({ route, active, onClick, ...other }) => {\n  const { t } = useTranslation()\n\n  const provider = route.steps[0]?.toolDetails\n  const { gasCostUSD } = getAccumulatedFeeCostsBreakdown(route)\n\n  return (\n    <Card\n      type={active ? 'selected' : 'default'}\n      selectionColor=\"secondary\"\n      onClick={onClick}\n      sx={{ py: 1.5, px: 2, ...(onClick ? { cursor: 'pointer' } : {}) }}\n      {...other}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 1,\n            minWidth: 0,\n          }}\n        >\n          <SmallAvatar src={provider?.logoURI} alt={provider?.name} size={20}>\n            {provider?.name?.[0]}\n          </SmallAvatar>\n          <Typography\n            noWrap\n            sx={{\n              fontSize: 14,\n              fontWeight: 600,\n              color: 'text.primary',\n            }}\n          >\n            {provider?.name}\n          </Typography>\n        </Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n          }}\n        >\n          <IconTypography component=\"span\" sx={{ mr: 0.5, fontSize: 16 }}>\n            <LocalGasStationRounded fontSize=\"inherit\" />\n          </IconTypography>\n          <Typography\n            data-value={gasCostUSD}\n            sx={{\n              fontSize: 14,\n              color: 'text.primary',\n              fontWeight: 600,\n              lineHeight: 1,\n            }}\n          >\n            {!gasCostUSD\n              ? t('main.fees.free')\n              : t('format.currency', {\n                  value: gasCostUSD,\n                })}\n          </Typography>\n        </Box>\n      </Box>\n    </Card>\n  )\n}\n\nexport const RouteProviderCardSkeleton: React.FC<Omit<CardProps, 'variant'>> = (\n  props\n) => {\n  return (\n    <Card sx={{ py: 1.5, px: 2 }} {...props}>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n        }}\n      >\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n          <Skeleton variant=\"circular\" width={20} height={20} />\n          <Skeleton variant=\"text\" width={80} height={20} />\n        </Box>\n        <Skeleton variant=\"text\" width={56} height={20} />\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;AAeA,MAAa,qBAER,EAAE,OAAO,QAAQ,SAAS,GAAG,YAAY;CAC5C,MAAM,EAAE,MAAM,eAAe;CAE7B,MAAM,WAAW,MAAM,MAAM,EAAE,EAAE;CACjC,MAAM,EAAE,eAAe,gCAAgC,KAAK;CAE5D,OACE,oBAACA,QAAD;EACE,MAAM,SAAS,aAAa;EAC5B,gBAAe;EACN;EACT,IAAI;GAAE,IAAI;GAAK,IAAI;GAAG,GAAI,UAAU,EAAE,QAAQ,UAAU,IAAI,CAAC;EAAG;EAChE,GAAI;EAEJ,UAAA,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,KAAK;GACP;GANF,UAAA,CAQE,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;KACZ,KAAK;KACL,UAAU;IACZ;IANF,UAAA,CAQE,oBAAC,aAAD;KAAa,KAAK,UAAU;KAAS,KAAK,UAAU;KAAM,MAAM;KAC7D,UAAA,UAAU,OAAO;IACP,CAAA,GACb,oBAAC,YAAD;KACE,QAAA;KACA,IAAI;MACF,UAAU;MACV,YAAY;MACZ,OAAO;KACT;KAEC,UAAA,UAAU;IACD,CAAA,CACT;GACL,CAAA,GAAA,qBAAC,KAAD;IACE,IAAI;KACF,SAAS;KACT,YAAY;IACd;IAJF,UAAA,CAME,oBAAC,gBAAD;KAAgB,WAAU;KAAO,IAAI;MAAE,IAAI;MAAK,UAAU;KAAG;KAC3D,UAAA,oBAAC,wBAAD,EAAwB,UAAS,UAAW,CAAA;IAC9B,CAAA,GAChB,oBAAC,YAAD;KACE,cAAY;KACZ,IAAI;MACF,UAAU;MACV,OAAO;MACP,YAAY;MACZ,YAAY;KACd;KAEC,UAAA,CAAC,aACE,EAAE,gBAAgB,IAClB,EAAE,mBAAmB,EACnB,OAAO,WACT,CAAC;IACK,CAAA,CACT;GACF,CAAA,CAAA;;CACD,CAAA;AAEV;AAEA,MAAa,6BACX,UACG;CACH,OACE,oBAACA,QAAD;EAAM,IAAI;GAAE,IAAI;GAAK,IAAI;EAAE;EAAG,GAAI;EAChC,UAAA,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,KAAK;GACP;GANF,UAAA,CAQE,qBAAC,KAAD;IAAK,IAAI;KAAE,SAAS;KAAQ,YAAY;KAAU,KAAK;IAAE;IAAzD,UAAA,CACE,oBAAC,UAAD;KAAU,SAAQ;KAAW,OAAO;KAAI,QAAQ;IAAK,CAAA,GACrD,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAO;KAAI,QAAQ;IAAK,CAAA,CAC9C;GACL,CAAA,GAAA,oBAAC,UAAD;IAAU,SAAQ;IAAO,OAAO;IAAI,QAAQ;GAAK,CAAA,CAC9C;;CACD,CAAA;AAEV"}

package/dist/esm/components/RouteCard/RouteToken.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteToken.js","names":[],"sources":["../../../../src/components/RouteCard/RouteToken.tsx"],"sourcesContent":["import type { RouteExtended, TokenAmount } from '@lifi/sdk'\nimport ExpandLess from '@mui/icons-material/ExpandLess'\nimport ExpandMore from '@mui/icons-material/ExpandMore'\nimport { Box, Collapse } from '@mui/material'\nimport type { JSX } from 'react'\nimport { type MouseEventHandler, useState } from 'react'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { Token } from '../Token/Token.js'\nimport { RouteCardEssentials } from './RouteCardEssentials.js'\nimport { RouteDetails } from './RouteDetails.js'\nimport { TokenContainer } from './RouteToken.style.js'\n\ninterface RouteTokenProps {\n  route: RouteExtended\n  token: TokenAmount\n  impactToken?: TokenAmount\n  defaultExpanded?: boolean\n  showEssentials?: boolean\n}\n\nexport const RouteToken = ({\n  route,\n  token,\n  impactToken,\n  defaultExpanded,\n  showEssentials,\n}: RouteTokenProps): JSX.Element => {\n  const { hiddenUI } = useWidgetConfig()\n\n  const [cardExpanded, setCardExpanded] = useState(defaultExpanded)\n\n  const handleExpand: MouseEventHandler<HTMLButtonElement> = (e) => {\n    e.stopPropagation()\n    setCardExpanded((expanded) => !expanded)\n  }\n\n  return (\n    <Box>\n      <TokenContainer>\n        <Token\n          token={token}\n          impactToken={impactToken}\n          step={route.steps[0]}\n          stepVisible={!cardExpanded}\n          disableDescription={hiddenUI?.routeTokenDescription}\n        />\n        {!defaultExpanded ? (\n          <CardIconButton onClick={handleExpand} size=\"small\">\n            {cardExpanded ? (\n              <ExpandLess fontSize=\"inherit\" />\n            ) : (\n              <ExpandMore fontSize=\"inherit\" />\n            )}\n          </CardIconButton>\n        ) : null}\n      </TokenContainer>\n      <Collapse timeout={225} in={cardExpanded} mountOnEnter unmountOnExit>\n        <RouteDetails route={route} />\n      </Collapse>\n      {showEssentials ? (\n        <Collapse timeout={225} in={!cardExpanded}>\n          <RouteCardEssentials route={route} />\n        </Collapse>\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,cAAc,EACzB,OACA,OACA,aACA,iBACA,qBACkC;CAClC,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,CAAC,cAAc,mBAAmB,SAAS,eAAe;CAEhE,MAAM,gBAAsD,MAAM;EAChE,EAAE,gBAAgB;EAClB,iBAAiB,aAAa,CAAC,QAAQ;CACzC;CAEA,OACE,qBAAC,KAAD,EAAA,UAAA;EACE,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,OAAD;GACS;GACM;GACb,MAAM,MAAM,MAAM;GAClB,aAAa,CAAC;GACd,oBAAoB,UAAU;EAC/B,CAAA,GACA,CAAC,kBACA,oBAAC,gBAAD;GAAgB,SAAS;GAAc,MAAK;aACzC,eACC,oBAAC,YAAD,EAAY,UAAS,UAAW,CAAA,IAEhC,oBAAC,YAAD,EAAY,UAAS,UAAW,CAAA;EAEpB,CAAA,IACd,IACU,EAAA,CAAA;EAChB,oBAAC,UAAD;GAAU,SAAS;GAAK,IAAI;GAAc,cAAA;GAAa,eAAA;aACrD,oBAAC,cAAD,EAAqB,MAAQ,CAAA;EACrB,CAAA;EACT,iBACC,oBAAC,UAAD;GAAU,SAAS;GAAK,IAAI,CAAC;aAC3B,oBAAC,qBAAD,EAA4B,MAAQ,CAAA;EAC5B,CAAA,IACR;CACD,EAAA,CAAA;AAET"}
+{"version":3,"file":"RouteToken.js","names":[],"sources":["../../../../src/components/RouteCard/RouteToken.tsx"],"sourcesContent":["import type { RouteExtended, TokenAmount } from '@lifi/sdk'\nimport ExpandLess from '@mui/icons-material/ExpandLess'\nimport ExpandMore from '@mui/icons-material/ExpandMore'\nimport { Box, Collapse } from '@mui/material'\nimport type { JSX } from 'react'\nimport { type MouseEventHandler, useState } from 'react'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { CardIconButton } from '../Card/CardIconButton.js'\nimport { Token } from '../Token/Token.js'\nimport { RouteCardEssentials } from './RouteCardEssentials.js'\nimport { RouteDetails } from './RouteDetails.js'\nimport { TokenContainer } from './RouteToken.style.js'\n\ninterface RouteTokenProps {\n  route: RouteExtended\n  token: TokenAmount\n  impactToken?: TokenAmount\n  defaultExpanded?: boolean\n  showEssentials?: boolean\n}\n\nexport const RouteToken = ({\n  route,\n  token,\n  impactToken,\n  defaultExpanded,\n  showEssentials,\n}: RouteTokenProps): JSX.Element => {\n  const { hiddenUI } = useWidgetConfig()\n\n  const [cardExpanded, setCardExpanded] = useState(defaultExpanded)\n\n  const handleExpand: MouseEventHandler<HTMLButtonElement> = (e) => {\n    e.stopPropagation()\n    setCardExpanded((expanded) => !expanded)\n  }\n\n  return (\n    <Box>\n      <TokenContainer>\n        <Token\n          token={token}\n          impactToken={impactToken}\n          step={route.steps[0]}\n          stepVisible={!cardExpanded}\n          disableDescription={hiddenUI?.routeTokenDescription}\n        />\n        {!defaultExpanded ? (\n          <CardIconButton onClick={handleExpand} size=\"small\">\n            {cardExpanded ? (\n              <ExpandLess fontSize=\"inherit\" />\n            ) : (\n              <ExpandMore fontSize=\"inherit\" />\n            )}\n          </CardIconButton>\n        ) : null}\n      </TokenContainer>\n      <Collapse timeout={225} in={cardExpanded} mountOnEnter unmountOnExit>\n        <RouteDetails route={route} />\n      </Collapse>\n      {showEssentials ? (\n        <Collapse timeout={225} in={!cardExpanded}>\n          <RouteCardEssentials route={route} />\n        </Collapse>\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,cAAc,EACzB,OACA,OACA,aACA,iBACA,qBACkC;CAClC,MAAM,EAAE,aAAa,gBAAgB;CAErC,MAAM,CAAC,cAAc,mBAAmB,SAAS,eAAe;CAEhE,MAAM,gBAAsD,MAAM;EAChE,EAAE,gBAAgB;EAClB,iBAAiB,aAAa,CAAC,QAAQ;CACzC;CAEA,OACE,qBAAC,KAAD,EAAA,UAAA;EACE,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,OAAD;GACS;GACM;GACb,MAAM,MAAM,MAAM;GAClB,aAAa,CAAC;GACd,oBAAoB,UAAU;EAC/B,CAAA,GACA,CAAC,kBACA,oBAAC,gBAAD;GAAgB,SAAS;GAAc,MAAK;GACzC,UAAA,eACC,oBAAC,YAAD,EAAY,UAAS,UAAW,CAAA,IAEhC,oBAAC,YAAD,EAAY,UAAS,UAAW,CAAA;EAEpB,CAAA,IACd,IACU,EAAA,CAAA;EAChB,oBAAC,UAAD;GAAU,SAAS;GAAK,IAAI;GAAc,cAAA;GAAa,eAAA;GACrD,UAAA,oBAAC,cAAD,EAAqB,MAAQ,CAAA;EACrB,CAAA;EACT,iBACC,oBAAC,UAAD;GAAU,SAAS;GAAK,IAAI,CAAC;GAC3B,UAAA,oBAAC,qBAAD,EAA4B,MAAQ,CAAA;EAC5B,CAAA,IACR;CACD,EAAA,CAAA;AAET"}

package/dist/esm/components/RouteCard/RouteTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteTokens.js","names":[],"sources":["../../../../src/components/RouteCard/RouteTokens.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\nimport { Box } from '@mui/material'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { Token } from '../Token/Token.js'\nimport { RouteToken } from './RouteToken.js'\n\nexport const RouteTokens: React.FC<{\n  route: RouteExtended\n  showEssentials?: boolean\n  defaultExpanded?: boolean\n  fromSlot?: React.ReactNode\n}> = ({ route, showEssentials, defaultExpanded, fromSlot }) => {\n  const { mode } = useWidgetConfig()\n\n  const fromToken = {\n    ...route.steps[0].action.fromToken,\n    amount: BigInt(route.steps[0].action.fromAmount),\n  }\n\n  const lastStepIndex = route.steps.length - 1\n  const toToken = {\n    ...(route.steps[lastStepIndex].execution?.toToken ??\n      route.steps[lastStepIndex].action.toToken),\n    amount: route.steps[lastStepIndex].execution?.toAmount\n      ? BigInt(route.steps[lastStepIndex].execution.toAmount)\n      : mode === 'custom'\n        ? BigInt(route.toAmount)\n        : BigInt(route.steps[lastStepIndex].estimate.toAmount),\n  }\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n      {fromSlot ?? (fromToken ? <Token token={fromToken} /> : null)}\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 }} />\n      </Box>\n      {toToken ? (\n        <RouteToken\n          route={route}\n          token={toToken}\n          impactToken={fromToken}\n          showEssentials={showEssentials}\n          defaultExpanded={defaultExpanded}\n        />\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAOA,MAAa,eAKP,EAAE,OAAO,gBAAgB,iBAAiB,eAAe;CAC7D,MAAM,EAAE,SAAS,gBAAgB;CAEjC,MAAM,YAAY;EAChB,GAAG,MAAM,MAAM,EAAE,CAAC,OAAO;EACzB,QAAQ,OAAO,MAAM,MAAM,EAAE,CAAC,OAAO,UAAU;CACjD;CAEA,MAAM,gBAAgB,MAAM,MAAM,SAAS;CAC3C,MAAM,UAAU;EACd,GAAI,MAAM,MAAM,cAAc,CAAC,WAAW,WACxC,MAAM,MAAM,cAAc,CAAC,OAAO;EACpC,QAAQ,MAAM,MAAM,cAAc,CAAC,WAAW,WAC1C,OAAO,MAAM,MAAM,cAAc,CAAC,UAAU,QAAQ,IACpD,SAAS,WACP,OAAO,MAAM,QAAQ,IACrB,OAAO,MAAM,MAAM,cAAc,CAAC,SAAS,QAAQ;CAC3D;CAEA,OACE,qBAAC,KAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAI;YAA9D;GACG,aAAa,YAAY,oBAAC,OAAD,EAAO,OAAO,UAAY,CAAA,IAAI;GACxD,oBAAC,KAAD;IACE,IAAI;KACF,OAAO;KACP,QAAQ;KACR,SAAS;KACT,YAAY;KACZ,gBAAgB;IAClB;cAEA,oBAAC,mBAAD,EAAmB,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;GACvC,CAAA;GACJ,UACC,oBAAC,YAAD;IACS;IACP,OAAO;IACP,aAAa;IACG;IACC;GAClB,CAAA,IACC;EACD;;AAET"}
+{"version":3,"file":"RouteTokens.js","names":[],"sources":["../../../../src/components/RouteCard/RouteTokens.tsx"],"sourcesContent":["import type { RouteExtended } from '@lifi/sdk'\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\nimport { Box } from '@mui/material'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { Token } from '../Token/Token.js'\nimport { RouteToken } from './RouteToken.js'\n\nexport const RouteTokens: React.FC<{\n  route: RouteExtended\n  showEssentials?: boolean\n  defaultExpanded?: boolean\n  fromSlot?: React.ReactNode\n}> = ({ route, showEssentials, defaultExpanded, fromSlot }) => {\n  const { mode } = useWidgetConfig()\n\n  const fromToken = {\n    ...route.steps[0].action.fromToken,\n    amount: BigInt(route.steps[0].action.fromAmount),\n  }\n\n  const lastStepIndex = route.steps.length - 1\n  const toToken = {\n    ...(route.steps[lastStepIndex].execution?.toToken ??\n      route.steps[lastStepIndex].action.toToken),\n    amount: route.steps[lastStepIndex].execution?.toAmount\n      ? BigInt(route.steps[lastStepIndex].execution.toAmount)\n      : mode === 'custom'\n        ? BigInt(route.toAmount)\n        : BigInt(route.steps[lastStepIndex].estimate.toAmount),\n  }\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n      {fromSlot ?? (fromToken ? <Token token={fromToken} /> : null)}\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 }} />\n      </Box>\n      {toToken ? (\n        <RouteToken\n          route={route}\n          token={toToken}\n          impactToken={fromToken}\n          showEssentials={showEssentials}\n          defaultExpanded={defaultExpanded}\n        />\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAOA,MAAa,eAKP,EAAE,OAAO,gBAAgB,iBAAiB,eAAe;CAC7D,MAAM,EAAE,SAAS,gBAAgB;CAEjC,MAAM,YAAY;EAChB,GAAG,MAAM,MAAM,EAAE,CAAC,OAAO;EACzB,QAAQ,OAAO,MAAM,MAAM,EAAE,CAAC,OAAO,UAAU;CACjD;CAEA,MAAM,gBAAgB,MAAM,MAAM,SAAS;CAC3C,MAAM,UAAU;EACd,GAAI,MAAM,MAAM,cAAc,CAAC,WAAW,WACxC,MAAM,MAAM,cAAc,CAAC,OAAO;EACpC,QAAQ,MAAM,MAAM,cAAc,CAAC,WAAW,WAC1C,OAAO,MAAM,MAAM,cAAc,CAAC,UAAU,QAAQ,IACpD,SAAS,WACP,OAAO,MAAM,QAAQ,IACrB,OAAO,MAAM,MAAM,cAAc,CAAC,SAAS,QAAQ;CAC3D;CAEA,OACE,qBAAC,KAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,eAAe;GAAU,KAAK;EAAI;EAA9D,UAAA;GACG,aAAa,YAAY,oBAAC,OAAD,EAAO,OAAO,UAAY,CAAA,IAAI;GACxD,oBAAC,KAAD;IACE,IAAI;KACF,OAAO;KACP,QAAQ;KACR,SAAS;KACT,YAAY;KACZ,gBAAgB;IAClB;IAEA,UAAA,oBAAC,mBAAD,EAAmB,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA;GACvC,CAAA;GACJ,UACC,oBAAC,YAAD;IACS;IACP,OAAO;IACP,aAAa;IACG;IACC;GAClB,CAAA,IACC;EACD;;AAET"}

package/dist/esm/components/Routes/LimitOrderRoutes.js

@@ -11,10 +11,10 @@ const LimitOrderRoutes = (props) => {
 	const { routes, isLoading, isFetching, isFetched } = useRoutes();
 	const [toAddress, selectedRouteId] = useFieldValues("toAddress", "selectedRouteId");
 	const { setFieldValue } = useFieldActions();
-	const { requiredToAddress } = useToAddressRequirements();
+	const { requiredToAddress, unsupportedReceiverBlocking } = useToAddressRequirements();
 	const currentRoute = routes?.[0];
 	if (!currentRoute && !isLoading && !isFetching && !isFetched) return null;
-	const allowInteraction = !(currentRoute && requiredToAddress && !toAddress);
+	const allowInteraction = !(currentRoute && (unsupportedReceiverBlocking || requiredToAddress && !toAddress));
 	const activeRouteId = routes?.find((route) => route.id === selectedRouteId)?.id ?? currentRoute?.id;
 	return /* @__PURE__ */ jsx(Stack, {
 		direction: "column",

package/dist/esm/components/Routes/LimitOrderRoutes.js.map

@@ -1 +1 @@
-{"version":3,"file":"LimitOrderRoutes.js","names":[],"sources":["../../../../src/components/Routes/LimitOrderRoutes.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport {\n  RouteProviderCard,\n  RouteProviderCardSkeleton,\n} from '../RouteCard/RouteProviderCard.js'\n\nexport const LimitOrderRoutes: React.FC<CardProps> = (props) => {\n  const { routes, isLoading, isFetching, isFetched } = useRoutes()\n  const [toAddress, selectedRouteId] = useFieldValues(\n    'toAddress',\n    'selectedRouteId'\n  )\n  const { setFieldValue } = useFieldActions()\n  const { requiredToAddress } = useToAddressRequirements()\n\n  const currentRoute = routes?.[0]\n\n  if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n    return null\n  }\n\n  const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress\n  const allowInteraction = !toAddressUnsatisfied\n\n  const activeRouteId =\n    routes?.find((route) => route.id === selectedRouteId)?.id ??\n    currentRoute?.id\n\n  return (\n    <Stack\n      direction=\"column\"\n      spacing={1}\n      sx={props.sx}\n      className={props.className}\n    >\n      {isLoading && !currentRoute ? (\n        Array.from({ length: 2 }).map((_, index) => (\n          <RouteProviderCardSkeleton key={index} />\n        ))\n      ) : !currentRoute ? (\n        <RouteNotFoundCard />\n      ) : (\n        routes?.map((route) => (\n          <RouteProviderCard\n            key={route.id}\n            route={route}\n            active={route.id === activeRouteId}\n            onClick={\n              allowInteraction\n                ? () => setFieldValue('selectedRouteId', route.id)\n                : undefined\n            }\n          />\n        ))\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;;AAYA,MAAa,oBAAyC,UAAU;CAC9D,MAAM,EAAE,QAAQ,WAAW,YAAY,cAAc,UAAU;CAC/D,MAAM,CAAC,WAAW,mBAAmB,eACnC,aACA,iBACF;CACA,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,sBAAsB,yBAAyB;CAEvD,MAAM,eAAe,SAAS;CAE9B,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,WACjD,OAAO;CAIT,MAAM,mBAAmB,EADI,gBAAgB,qBAAqB,CAAC;CAGnE,MAAM,gBACJ,QAAQ,MAAM,UAAU,MAAM,OAAO,eAAe,CAAC,EAAE,MACvD,cAAc;CAEhB,OACE,oBAAC,OAAD;EACE,WAAU;EACV,SAAS;EACT,IAAI,MAAM;EACV,WAAW,MAAM;YAEhB,aAAa,CAAC,eACb,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,2BAAD,CAAwC,GAAR,KAAQ,CACzC,IACC,CAAC,eACH,oBAAC,mBAAD,CAAoB,CAAA,IAEpB,QAAQ,KAAK,UACX,oBAAC,mBAAD;GAES;GACP,QAAQ,MAAM,OAAO;GACrB,SACE,yBACU,cAAc,mBAAmB,MAAM,EAAE,IAC/C,KAAA;EAEP,GARM,MAAM,EAQZ,CACF;CAEE,CAAA;AAEX"}
+{"version":3,"file":"LimitOrderRoutes.js","names":[],"sources":["../../../../src/components/Routes/LimitOrderRoutes.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport {\n  RouteProviderCard,\n  RouteProviderCardSkeleton,\n} from '../RouteCard/RouteProviderCard.js'\n\nexport const LimitOrderRoutes: React.FC<CardProps> = (props) => {\n  const { routes, isLoading, isFetching, isFetched } = useRoutes()\n  const [toAddress, selectedRouteId] = useFieldValues(\n    'toAddress',\n    'selectedRouteId'\n  )\n  const { setFieldValue } = useFieldActions()\n  const { requiredToAddress, unsupportedReceiverBlocking } =\n    useToAddressRequirements()\n\n  const currentRoute = routes?.[0]\n\n  if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n    return null\n  }\n\n  const toAddressUnsatisfied =\n    currentRoute &&\n    (unsupportedReceiverBlocking || (requiredToAddress && !toAddress))\n  const allowInteraction = !toAddressUnsatisfied\n\n  const activeRouteId =\n    routes?.find((route) => route.id === selectedRouteId)?.id ??\n    currentRoute?.id\n\n  return (\n    <Stack\n      direction=\"column\"\n      spacing={1}\n      sx={props.sx}\n      className={props.className}\n    >\n      {isLoading && !currentRoute ? (\n        Array.from({ length: 2 }).map((_, index) => (\n          <RouteProviderCardSkeleton key={index} />\n        ))\n      ) : !currentRoute ? (\n        <RouteNotFoundCard />\n      ) : (\n        routes?.map((route) => (\n          <RouteProviderCard\n            key={route.id}\n            route={route}\n            active={route.id === activeRouteId}\n            onClick={\n              allowInteraction\n                ? () => setFieldValue('selectedRouteId', route.id)\n                : undefined\n            }\n          />\n        ))\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;;AAYA,MAAa,oBAAyC,UAAU;CAC9D,MAAM,EAAE,QAAQ,WAAW,YAAY,cAAc,UAAU;CAC/D,MAAM,CAAC,WAAW,mBAAmB,eACnC,aACA,iBACF;CACA,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,gCACzB,yBAAyB;CAE3B,MAAM,eAAe,SAAS;CAE9B,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,WACjD,OAAO;CAMT,MAAM,mBAAmB,EAFvB,iBACC,+BAAgC,qBAAqB,CAAC;CAGzD,MAAM,gBACJ,QAAQ,MAAM,UAAU,MAAM,OAAO,eAAe,CAAC,EAAE,MACvD,cAAc;CAEhB,OACE,oBAAC,OAAD;EACE,WAAU;EACV,SAAS;EACT,IAAI,MAAM;EACV,WAAW,MAAM;EAEhB,UAAA,aAAa,CAAC,eACb,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,2BAAD,CAAwC,GAAR,KAAQ,CACzC,IACC,CAAC,eACH,oBAAC,mBAAD,CAAoB,CAAA,IAEpB,QAAQ,KAAK,UACX,oBAAC,mBAAD;GAES;GACP,QAAQ,MAAM,OAAO;GACrB,SACE,yBACU,cAAc,mBAAmB,MAAM,EAAE,IAC/C,KAAA;EAEP,GARM,MAAM,EAQZ,CACF;CAEE,CAAA;AAEX"}

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

@@ -1 +1 @@
-{"version":3,"file":"Routes.js","names":["Card"],"sources":["../../../../src/components/Routes/Routes.tsx"],"sourcesContent":["import { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ButtonTertiary } from '../ButtonTertiary.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\n\nexport const Routes: React.FC<CardProps> = (props) => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const { mode, modeOptions, showSingleRoute, defaultUI } = useWidgetConfig()\n  const {\n    routes,\n    isLoading,\n    isFetching,\n    isFetched,\n    dataUpdatedAt,\n    refetchTime,\n    refetch,\n  } = useRoutes()\n\n  const currentRoute = routes?.[0]\n\n  if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n    return null\n  }\n\n  const handleCardClick = () => {\n    navigate({ to: navigationRoutes.routes })\n  }\n\n  const routeNotFound = !currentRoute && !isLoading && !isFetching\n  const onlySingleRoute = mode === 'refuel' || showSingleRoute\n  const showAll =\n    !onlySingleRoute && !routeNotFound && (routes?.length ?? 0) > 1\n\n  const title =\n    mode === 'custom'\n      ? modeOptions?.custom?.type === 'deposit'\n        ? t('header.receive')\n        : t('header.youPay')\n      : t('header.receive')\n\n  return (\n    <Card {...props}>\n      {/* The cards layout's Receive card already carries this header. */}\n      {defaultUI?.layout === 'cards' ? null : <CardTitle>{title}</CardTitle>}\n      <ProgressToNextUpdate\n        updatedAt={dataUpdatedAt || Date.now()}\n        timeToUpdate={refetchTime}\n        isLoading={isFetching}\n        onClick={() => refetch()}\n        sx={{\n          position: 'absolute',\n          top: 8,\n          right: 8,\n        }}\n      />\n      <Box\n        sx={{\n          p: 2,\n        }}\n      >\n        {isLoading && !currentRoute ? (\n          <RouteCardSkeleton variant=\"cardless\" />\n        ) : !currentRoute ? (\n          <RouteNotFoundCard />\n        ) : (\n          <RouteCard route={currentRoute} variant=\"cardless\" active />\n        )}\n\n        <Collapse timeout={225} in={showAll} unmountOnExit mountOnEnter>\n          <Box\n            sx={{\n              mt: 2,\n            }}\n          >\n            <ButtonTertiary onClick={handleCardClick} fullWidth>\n              {t('button.showAll')}\n            </ButtonTertiary>\n          </Box>\n        </Collapse>\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,UAA+B,UAAU;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,iBAAiB,cAAc,gBAAgB;CAC1E,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,YACE,UAAU;CAEd,MAAM,eAAe,SAAS;CAE9B,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,WACjD,OAAO;CAGT,MAAM,wBAAwB;EAC5B,SAAS,EAAE,IAAI,iBAAiB,OAAO,CAAC;CAC1C;CAIA,MAAM,UACJ,EAFsB,SAAS,YAAY,oBAEvB,EAHA,CAAC,gBAAgB,CAAC,aAAa,CAAC,gBAGb,QAAQ,UAAU,KAAK;CAEhE,MAAM,QACJ,SAAS,WACL,aAAa,QAAQ,SAAS,YAC5B,EAAE,gBAAgB,IAClB,EAAE,eAAe,IACnB,EAAE,gBAAgB;CAExB,OACE,qBAACA,QAAD;EAAM,GAAI;YAAV;GAEG,WAAW,WAAW,UAAU,OAAO,oBAAC,WAAD,EAAA,UAAY,MAAiB,CAAA;GACrE,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,IAAI;IACrC,cAAc;IACd,WAAW;IACX,eAAe,QAAQ;IACvB,IAAI;KACF,UAAU;KACV,KAAK;KACL,OAAO;IACT;GACD,CAAA;GACD,qBAAC,KAAD;IACE,IAAI,EACF,GAAG,EACL;cAHF,CAKG,aAAa,CAAC,eACb,oBAAC,mBAAD,EAAmB,SAAQ,WAAY,CAAA,IACrC,CAAC,eACH,oBAAC,mBAAD,CAAoB,CAAA,IAEpB,oBAAC,WAAD;KAAW,OAAO;KAAc,SAAQ;KAAW,QAAA;IAAQ,CAAA,GAG7D,oBAAC,UAAD;KAAU,SAAS;KAAK,IAAI;KAAS,eAAA;KAAc,cAAA;eACjD,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;gBAEA,oBAAC,gBAAD;OAAgB,SAAS;OAAiB,WAAA;iBACvC,EAAE,gBAAgB;MACL,CAAA;KACb,CAAA;IACG,CAAA,CACP;;EACD;;AAEV"}
+{"version":3,"file":"Routes.js","names":["Card"],"sources":["../../../../src/components/Routes/Routes.tsx"],"sourcesContent":["import { Box, Collapse } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ButtonTertiary } from '../ButtonTertiary.js'\nimport type { CardProps } from '../Card/Card.js'\nimport { Card } from '../Card/Card.js'\nimport { CardTitle } from '../Card/CardTitle.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\n\nexport const Routes: React.FC<CardProps> = (props) => {\n  const { t } = useTranslation()\n  const navigate = useNavigate()\n  const { mode, modeOptions, showSingleRoute, defaultUI } = useWidgetConfig()\n  const {\n    routes,\n    isLoading,\n    isFetching,\n    isFetched,\n    dataUpdatedAt,\n    refetchTime,\n    refetch,\n  } = useRoutes()\n\n  const currentRoute = routes?.[0]\n\n  if (!currentRoute && !isLoading && !isFetching && !isFetched) {\n    return null\n  }\n\n  const handleCardClick = () => {\n    navigate({ to: navigationRoutes.routes })\n  }\n\n  const routeNotFound = !currentRoute && !isLoading && !isFetching\n  const onlySingleRoute = mode === 'refuel' || showSingleRoute\n  const showAll =\n    !onlySingleRoute && !routeNotFound && (routes?.length ?? 0) > 1\n\n  const title =\n    mode === 'custom'\n      ? modeOptions?.custom?.type === 'deposit'\n        ? t('header.receive')\n        : t('header.youPay')\n      : t('header.receive')\n\n  return (\n    <Card {...props}>\n      {/* The cards layout's Receive card already carries this header. */}\n      {defaultUI?.layout === 'cards' ? null : <CardTitle>{title}</CardTitle>}\n      <ProgressToNextUpdate\n        updatedAt={dataUpdatedAt || Date.now()}\n        timeToUpdate={refetchTime}\n        isLoading={isFetching}\n        onClick={() => refetch()}\n        sx={{\n          position: 'absolute',\n          top: 8,\n          right: 8,\n        }}\n      />\n      <Box\n        sx={{\n          p: 2,\n        }}\n      >\n        {isLoading && !currentRoute ? (\n          <RouteCardSkeleton variant=\"cardless\" />\n        ) : !currentRoute ? (\n          <RouteNotFoundCard />\n        ) : (\n          <RouteCard route={currentRoute} variant=\"cardless\" active />\n        )}\n\n        <Collapse timeout={225} in={showAll} unmountOnExit mountOnEnter>\n          <Box\n            sx={{\n              mt: 2,\n            }}\n          >\n            <ButtonTertiary onClick={handleCardClick} fullWidth>\n              {t('button.showAll')}\n            </ButtonTertiary>\n          </Box>\n        </Collapse>\n      </Box>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,MAAa,UAA+B,UAAU;CACpD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,MAAM,aAAa,iBAAiB,cAAc,gBAAgB;CAC1E,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,YACE,UAAU;CAEd,MAAM,eAAe,SAAS;CAE9B,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,cAAc,CAAC,WACjD,OAAO;CAGT,MAAM,wBAAwB;EAC5B,SAAS,EAAE,IAAI,iBAAiB,OAAO,CAAC;CAC1C;CAIA,MAAM,UACJ,EAFsB,SAAS,YAAY,oBAEvB,EAHA,CAAC,gBAAgB,CAAC,aAAa,CAAC,gBAGb,QAAQ,UAAU,KAAK;CAEhE,MAAM,QACJ,SAAS,WACL,aAAa,QAAQ,SAAS,YAC5B,EAAE,gBAAgB,IAClB,EAAE,eAAe,IACnB,EAAE,gBAAgB;CAExB,OACE,qBAACA,QAAD;EAAM,GAAI;EAAV,UAAA;GAEG,WAAW,WAAW,UAAU,OAAO,oBAAC,WAAD,EAAA,UAAY,MAAiB,CAAA;GACrE,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,IAAI;IACrC,cAAc;IACd,WAAW;IACX,eAAe,QAAQ;IACvB,IAAI;KACF,UAAU;KACV,KAAK;KACL,OAAO;IACT;GACD,CAAA;GACD,qBAAC,KAAD;IACE,IAAI,EACF,GAAG,EACL;IAHF,UAAA,CAKG,aAAa,CAAC,eACb,oBAAC,mBAAD,EAAmB,SAAQ,WAAY,CAAA,IACrC,CAAC,eACH,oBAAC,mBAAD,CAAoB,CAAA,IAEpB,oBAAC,WAAD;KAAW,OAAO;KAAc,SAAQ;KAAW,QAAA;IAAQ,CAAA,GAG7D,oBAAC,UAAD;KAAU,SAAS;KAAK,IAAI;KAAS,eAAA;KAAc,cAAA;KACjD,UAAA,oBAAC,KAAD;MACE,IAAI,EACF,IAAI,EACN;MAEA,UAAA,oBAAC,gBAAD;OAAgB,SAAS;OAAiB,WAAA;OACvC,UAAA,EAAE,gBAAgB;MACL,CAAA;KACb,CAAA;IACG,CAAA,CACP;;EACD;;AAEV"}

package/dist/esm/components/Routes/RoutesContent.js

@@ -19,10 +19,10 @@ const RoutesContent = memo(function RoutesContent({ routes, isFetching, isLoadin
 	const { mode, modeOptions } = useWidgetConfig();
 	const { account } = useAccount({ chainType: fromChain?.chainType });
 	const [toAddress] = useFieldValues("toAddress");
-	const { requiredToAddress } = useToAddressRequirements();
+	const { requiredToAddress, unsupportedReceiverBlocking } = useToAddressRequirements();
 	const currentRoute = routes?.[0];
 	const routeNotFound = !currentRoute && !isLoading && !isFetching;
-	const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress;
+	const toAddressUnsatisfied = currentRoute && (unsupportedReceiverBlocking || requiredToAddress && !toAddress);
 	const allowInteraction = account.isConnected && !toAddressUnsatisfied;
 	const title = mode === "custom" ? modeOptions?.custom?.type === "deposit" ? t("header.deposit") : t("header.youPay") : t("header.receive");
 	return /* @__PURE__ */ jsxs(Container$1, {

package/dist/esm/components/Routes/RoutesContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoutesContent.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesContent.tsx"],"sourcesContent":["import type { ExtendedChain, Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Stack, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { PageContainer } from '../PageContainer.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport { Container, Header } from './RoutesExpanded.style.js'\n\ninterface RoutesContentProps {\n  routes?: Route[]\n  isFetching: boolean\n  isLoading: boolean\n  dataUpdatedAt: number\n  refetchTime: number\n  fromChain: ExtendedChain | undefined\n  refetch: () => void\n  onRouteClick: (route: Route) => void\n}\n\nconst headerHeight = '52px'\n\nexport const RoutesContent: React.NamedExoticComponent<RoutesContentProps> =\n  memo(function RoutesContent({\n    routes,\n    isFetching,\n    isLoading,\n    dataUpdatedAt,\n    refetchTime,\n    fromChain,\n    refetch,\n    onRouteClick,\n  }: RoutesContentProps) {\n    const { t } = useTranslation()\n    const { mode, modeOptions } = useWidgetConfig()\n\n    const { account } = useAccount({ chainType: fromChain?.chainType })\n    const [toAddress] = useFieldValues('toAddress')\n    const { requiredToAddress } = useToAddressRequirements()\n\n    const currentRoute = routes?.[0]\n\n    const routeNotFound = !currentRoute && !isLoading && !isFetching\n    const toAddressUnsatisfied = currentRoute && requiredToAddress && !toAddress\n    const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n    const title =\n      mode === 'custom'\n        ? modeOptions?.custom?.type === 'deposit'\n          ? t('header.deposit')\n          : t('header.youPay')\n        : t('header.receive')\n\n    return (\n      <Container enableColorScheme minimumHeight={isLoading}>\n        <Header sx={{ height: headerHeight }}>\n          <Typography\n            noWrap\n            sx={{\n              fontSize: 18,\n              fontWeight: '700',\n              flex: 1,\n            }}\n          >\n            {title}\n          </Typography>\n          <ProgressToNextUpdate\n            updatedAt={dataUpdatedAt || Date.now()}\n            timeToUpdate={refetchTime}\n            isLoading={isFetching}\n            onClick={() => refetch()}\n            sx={{ marginRight: -1 }}\n          />\n        </Header>\n        <PageContainer\n          sx={{ height: `calc(100% - ${headerHeight})`, overflow: 'auto' }}\n        >\n          <Stack\n            direction=\"column\"\n            spacing={2}\n            sx={{\n              flex: 1,\n              paddingTop: 1.5,\n              paddingBottom: 3,\n            }}\n          >\n            {routeNotFound ? (\n              <RouteNotFoundCard />\n            ) : (isLoading || isFetching) && !routes?.length ? (\n              Array.from({ length: 3 }).map((_, index) => (\n                <RouteCardSkeleton key={index} />\n              ))\n            ) : (\n              routes?.map((route: Route, index: number) => (\n                <RouteCard\n                  key={index}\n                  route={route}\n                  onClick={\n                    allowInteraction ? () => onRouteClick(route) : undefined\n                  }\n                  active={index === 0}\n                  expanded={routes?.length === 1}\n                />\n              ))\n            )}\n          </Stack>\n        </PageContainer>\n      </Container>\n    )\n  })\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,MAAM,eAAe;AAErB,MAAa,gBACX,KAAK,SAAS,cAAc,EAC1B,QACA,YACA,WACA,eACA,aACA,WACA,SACA,gBACqB;CACrB,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,gBAAgB,gBAAgB;CAE9C,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,UAAU,CAAC;CAClE,MAAM,CAAC,aAAa,eAAe,WAAW;CAC9C,MAAM,EAAE,sBAAsB,yBAAyB;CAEvD,MAAM,eAAe,SAAS;CAE9B,MAAM,gBAAgB,CAAC,gBAAgB,CAAC,aAAa,CAAC;CACtD,MAAM,uBAAuB,gBAAgB,qBAAqB,CAAC;CACnE,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,MAAM,QACJ,SAAS,WACL,aAAa,QAAQ,SAAS,YAC5B,EAAE,gBAAgB,IAClB,EAAE,eAAe,IACnB,EAAE,gBAAgB;CAExB,OACE,qBAACA,aAAD;EAAW,mBAAA;EAAkB,eAAe;YAA5C,CACE,qBAAC,QAAD;GAAQ,IAAI,EAAE,QAAQ,aAAa;aAAnC,CACE,oBAAC,YAAD;IACE,QAAA;IACA,IAAI;KACF,UAAU;KACV,YAAY;KACZ,MAAM;IACR;cAEC;GACS,CAAA,GACZ,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,IAAI;IACrC,cAAc;IACd,WAAW;IACX,eAAe,QAAQ;IACvB,IAAI,EAAE,aAAa,GAAG;GACvB,CAAA,CACK;MACR,oBAAC,eAAD;GACE,IAAI;IAAE,QAAQ,eAAe,aAAa;IAAI,UAAU;GAAO;aAE/D,oBAAC,OAAD;IACE,WAAU;IACV,SAAS;IACT,IAAI;KACF,MAAM;KACN,YAAY;KACZ,eAAe;IACjB;cAEC,gBACC,oBAAC,mBAAD,CAAoB,CAAA,KACjB,aAAa,eAAe,CAAC,QAAQ,SACxC,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,CAAgC,GAAR,KAAQ,CACjC,IAED,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;KAES;KACP,SACE,yBAAyB,aAAa,KAAK,IAAI,KAAA;KAEjD,QAAQ,UAAU;KAClB,UAAU,QAAQ,WAAW;IAC9B,GAPM,KAON,CACF;GAEE,CAAA;EACM,CAAA,CACN;;AAEf,CAAC"}
+{"version":3,"file":"RoutesContent.js","names":["Container"],"sources":["../../../../src/components/Routes/RoutesContent.tsx"],"sourcesContent":["import type { ExtendedChain, Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Stack, Typography } from '@mui/material'\nimport type React from 'react'\nimport { memo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { PageContainer } from '../PageContainer.js'\nimport { ProgressToNextUpdate } from '../ProgressToNextUpdate.js'\nimport { RouteCard } from '../RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../RouteCard/RouteNotFoundCard.js'\nimport { Container, Header } from './RoutesExpanded.style.js'\n\ninterface RoutesContentProps {\n  routes?: Route[]\n  isFetching: boolean\n  isLoading: boolean\n  dataUpdatedAt: number\n  refetchTime: number\n  fromChain: ExtendedChain | undefined\n  refetch: () => void\n  onRouteClick: (route: Route) => void\n}\n\nconst headerHeight = '52px'\n\nexport const RoutesContent: React.NamedExoticComponent<RoutesContentProps> =\n  memo(function RoutesContent({\n    routes,\n    isFetching,\n    isLoading,\n    dataUpdatedAt,\n    refetchTime,\n    fromChain,\n    refetch,\n    onRouteClick,\n  }: RoutesContentProps) {\n    const { t } = useTranslation()\n    const { mode, modeOptions } = useWidgetConfig()\n\n    const { account } = useAccount({ chainType: fromChain?.chainType })\n    const [toAddress] = useFieldValues('toAddress')\n    const { requiredToAddress, unsupportedReceiverBlocking } =\n      useToAddressRequirements()\n\n    const currentRoute = routes?.[0]\n\n    const routeNotFound = !currentRoute && !isLoading && !isFetching\n    const toAddressUnsatisfied =\n      currentRoute &&\n      (unsupportedReceiverBlocking || (requiredToAddress && !toAddress))\n    const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n    const title =\n      mode === 'custom'\n        ? modeOptions?.custom?.type === 'deposit'\n          ? t('header.deposit')\n          : t('header.youPay')\n        : t('header.receive')\n\n    return (\n      <Container enableColorScheme minimumHeight={isLoading}>\n        <Header sx={{ height: headerHeight }}>\n          <Typography\n            noWrap\n            sx={{\n              fontSize: 18,\n              fontWeight: '700',\n              flex: 1,\n            }}\n          >\n            {title}\n          </Typography>\n          <ProgressToNextUpdate\n            updatedAt={dataUpdatedAt || Date.now()}\n            timeToUpdate={refetchTime}\n            isLoading={isFetching}\n            onClick={() => refetch()}\n            sx={{ marginRight: -1 }}\n          />\n        </Header>\n        <PageContainer\n          sx={{ height: `calc(100% - ${headerHeight})`, overflow: 'auto' }}\n        >\n          <Stack\n            direction=\"column\"\n            spacing={2}\n            sx={{\n              flex: 1,\n              paddingTop: 1.5,\n              paddingBottom: 3,\n            }}\n          >\n            {routeNotFound ? (\n              <RouteNotFoundCard />\n            ) : (isLoading || isFetching) && !routes?.length ? (\n              Array.from({ length: 3 }).map((_, index) => (\n                <RouteCardSkeleton key={index} />\n              ))\n            ) : (\n              routes?.map((route: Route, index: number) => (\n                <RouteCard\n                  key={index}\n                  route={route}\n                  onClick={\n                    allowInteraction ? () => onRouteClick(route) : undefined\n                  }\n                  active={index === 0}\n                  expanded={routes?.length === 1}\n                />\n              ))\n            )}\n          </Stack>\n        </PageContainer>\n      </Container>\n    )\n  })\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,MAAM,eAAe;AAErB,MAAa,gBACX,KAAK,SAAS,cAAc,EAC1B,QACA,YACA,WACA,eACA,aACA,WACA,SACA,gBACqB;CACrB,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,MAAM,gBAAgB,gBAAgB;CAE9C,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,UAAU,CAAC;CAClE,MAAM,CAAC,aAAa,eAAe,WAAW;CAC9C,MAAM,EAAE,mBAAmB,gCACzB,yBAAyB;CAE3B,MAAM,eAAe,SAAS;CAE9B,MAAM,gBAAgB,CAAC,gBAAgB,CAAC,aAAa,CAAC;CACtD,MAAM,uBACJ,iBACC,+BAAgC,qBAAqB,CAAC;CACzD,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,MAAM,QACJ,SAAS,WACL,aAAa,QAAQ,SAAS,YAC5B,EAAE,gBAAgB,IAClB,EAAE,eAAe,IACnB,EAAE,gBAAgB;CAExB,OACE,qBAACA,aAAD;EAAW,mBAAA;EAAkB,eAAe;EAA5C,UAAA,CACE,qBAAC,QAAD;GAAQ,IAAI,EAAE,QAAQ,aAAa;GAAnC,UAAA,CACE,oBAAC,YAAD;IACE,QAAA;IACA,IAAI;KACF,UAAU;KACV,YAAY;KACZ,MAAM;IACR;IAEC,UAAA;GACS,CAAA,GACZ,oBAAC,sBAAD;IACE,WAAW,iBAAiB,KAAK,IAAI;IACrC,cAAc;IACd,WAAW;IACX,eAAe,QAAQ;IACvB,IAAI,EAAE,aAAa,GAAG;GACvB,CAAA,CACK;EACR,CAAA,GAAA,oBAAC,eAAD;GACE,IAAI;IAAE,QAAQ,eAAe,aAAa;IAAI,UAAU;GAAO;GAE/D,UAAA,oBAAC,OAAD;IACE,WAAU;IACV,SAAS;IACT,IAAI;KACF,MAAM;KACN,YAAY;KACZ,eAAe;IACjB;IAEC,UAAA,gBACC,oBAAC,mBAAD,CAAoB,CAAA,KACjB,aAAa,eAAe,CAAC,QAAQ,SACxC,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,CAAgC,GAAR,KAAQ,CACjC,IAED,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;KAES;KACP,SACE,yBAAyB,aAAa,KAAK,IAAI,KAAA;KAEjD,QAAQ,UAAU;KAClB,UAAU,QAAQ,WAAW;IAC9B,GAPM,KAON,CACF;GAEE,CAAA;EACM,CAAA,CACN;;AAEf,CAAC"}

package/dist/esm/components/Routes/RoutesExpanded.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoutesExpanded.js","names":[],"sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ExpansionTransition } from '../Expansion/ExpansionTransition.js'\nimport { RoutesContent } from './RoutesContent.js'\nimport { routesExpansionWidth } from './RoutesExpanded.style.js'\n\ninterface RoutesExpandedProps {\n  canOpen: boolean\n  setOpenExpansion: (open: boolean) => void\n}\n\nexport const RoutesExpanded: React.NamedExoticComponent<RoutesExpandedProps> =\n  memo(function RoutesExpanded({\n    canOpen,\n    setOpenExpansion,\n  }: RoutesExpandedProps) {\n    const emitter = useWidgetEvents()\n    const navigate = useNavigate()\n    const routesRef = useRef<Route[]>(undefined)\n    const routesActiveRef = useRef(false)\n\n    const {\n      routes,\n      isLoading,\n      isFetching,\n      isFetched,\n      dataUpdatedAt,\n      refetchTime,\n      fromChain,\n      refetch,\n      setReviewableRoute,\n    } = useRoutes()\n\n    const onExit = useCallback(() => {\n      // Clean routes cache on exit\n      routesRef.current = undefined\n    }, [])\n\n    // We cache routes results in ref for a better exit animation\n    if (routesRef.current && !routes) {\n      routesActiveRef.current = false\n      // If we are loading routes with a new queryKey, we need to clear the cache\n      if (isLoading) {\n        routesRef.current = undefined\n      }\n    } else {\n      routesRef.current = routes\n      routesActiveRef.current = Boolean(routes)\n    }\n\n    const expanded =\n      Boolean(\n        routesActiveRef.current || isLoading || isFetching || isFetched\n      ) && canOpen\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: stable navigation callback that won't cause rerenders in RoutesContent\n    const onRouteClick = useCallback(\n      (route: Route) => {\n        setReviewableRoute(route)\n        navigate({\n          to: navigationRoutes.transactionExecution,\n          search: { routeId: route.id },\n        })\n        emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes! })\n      },\n      [emitter, routes, setReviewableRoute]\n    )\n\n    // Use layout effect to update parent's width when expansion changes\n    useLayoutEffect(() => {\n      setOpenExpansion(expanded)\n    }, [expanded, setOpenExpansion])\n\n    useEffect(() => {\n      emitter.emit(WidgetEvent.WidgetExpanded, expanded)\n    }, [emitter, expanded])\n\n    return (\n      <ExpansionTransition\n        in={expanded}\n        width={routesExpansionWidth}\n        onExited={onExit}\n      >\n        <RoutesContent\n          routes={routesRef.current}\n          isFetching={isFetching}\n          isLoading={isLoading}\n          dataUpdatedAt={dataUpdatedAt}\n          refetchTime={refetchTime}\n          fromChain={fromChain}\n          refetch={refetch}\n          onRouteClick={onRouteClick}\n        />\n      </ExpansionTransition>\n    )\n  })\n"],"mappings":";;;;;;;;;;;AAiBA,MAAa,iBACX,KAAK,SAAS,eAAe,EAC3B,SACA,oBACsB;CACtB,MAAM,UAAU,gBAAgB;CAChC,MAAM,WAAW,YAAY;CAC7B,MAAM,YAAY,OAAgB,KAAA,CAAS;CAC3C,MAAM,kBAAkB,OAAO,KAAK;CAEpC,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,WACA,SACA,uBACE,UAAU;CAEd,MAAM,SAAS,kBAAkB;EAE/B,UAAU,UAAU,KAAA;CACtB,GAAG,CAAC,CAAC;CAGL,IAAI,UAAU,WAAW,CAAC,QAAQ;EAChC,gBAAgB,UAAU;EAE1B,IAAI,WACF,UAAU,UAAU,KAAA;CAExB,OAAO;EACL,UAAU,UAAU;EACpB,gBAAgB,UAAU,QAAQ,MAAM;CAC1C;CAEA,MAAM,WACJ,QACE,gBAAgB,WAAW,aAAa,cAAc,SACxD,KAAK;CAGP,MAAM,eAAe,aAClB,UAAiB;EAChB,mBAAmB,KAAK;EACxB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,GAAG;EAC9B,CAAC;EACD,QAAQ,KAAA,iBAAgC;GAAE;GAAe;EAAQ,CAAC;CACpE,GACA;EAAC;EAAS;EAAQ;CAAkB,CACtC;CAGA,sBAAsB;EACpB,iBAAiB,QAAQ;CAC3B,GAAG,CAAC,UAAU,gBAAgB,CAAC;CAE/B,gBAAgB;EACd,QAAQ,KAAA,kBAAiC,QAAQ;CACnD,GAAG,CAAC,SAAS,QAAQ,CAAC;CAEtB,OACE,oBAAC,qBAAD;EACE,IAAI;EACJ,OAAO;EACP,UAAU;YAEV,oBAAC,eAAD;GACE,QAAQ,UAAU;GACN;GACD;GACI;GACF;GACF;GACF;GACK;EACf,CAAA;CACkB,CAAA;AAEzB,CAAC"}
+{"version":3,"file":"RoutesExpanded.js","names":[],"sources":["../../../../src/components/Routes/RoutesExpanded.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useNavigate } from '@tanstack/react-router'\nimport type React from 'react'\nimport { memo, useCallback, useEffect, useLayoutEffect, useRef } from 'react'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { ExpansionTransition } from '../Expansion/ExpansionTransition.js'\nimport { RoutesContent } from './RoutesContent.js'\nimport { routesExpansionWidth } from './RoutesExpanded.style.js'\n\ninterface RoutesExpandedProps {\n  canOpen: boolean\n  setOpenExpansion: (open: boolean) => void\n}\n\nexport const RoutesExpanded: React.NamedExoticComponent<RoutesExpandedProps> =\n  memo(function RoutesExpanded({\n    canOpen,\n    setOpenExpansion,\n  }: RoutesExpandedProps) {\n    const emitter = useWidgetEvents()\n    const navigate = useNavigate()\n    const routesRef = useRef<Route[]>(undefined)\n    const routesActiveRef = useRef(false)\n\n    const {\n      routes,\n      isLoading,\n      isFetching,\n      isFetched,\n      dataUpdatedAt,\n      refetchTime,\n      fromChain,\n      refetch,\n      setReviewableRoute,\n    } = useRoutes()\n\n    const onExit = useCallback(() => {\n      // Clean routes cache on exit\n      routesRef.current = undefined\n    }, [])\n\n    // We cache routes results in ref for a better exit animation\n    if (routesRef.current && !routes) {\n      routesActiveRef.current = false\n      // If we are loading routes with a new queryKey, we need to clear the cache\n      if (isLoading) {\n        routesRef.current = undefined\n      }\n    } else {\n      routesRef.current = routes\n      routesActiveRef.current = Boolean(routes)\n    }\n\n    const expanded =\n      Boolean(\n        routesActiveRef.current || isLoading || isFetching || isFetched\n      ) && canOpen\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies: stable navigation callback that won't cause rerenders in RoutesContent\n    const onRouteClick = useCallback(\n      (route: Route) => {\n        setReviewableRoute(route)\n        navigate({\n          to: navigationRoutes.transactionExecution,\n          search: { routeId: route.id },\n        })\n        emitter.emit(WidgetEvent.RouteSelected, { route, routes: routes! })\n      },\n      [emitter, routes, setReviewableRoute]\n    )\n\n    // Use layout effect to update parent's width when expansion changes\n    useLayoutEffect(() => {\n      setOpenExpansion(expanded)\n    }, [expanded, setOpenExpansion])\n\n    useEffect(() => {\n      emitter.emit(WidgetEvent.WidgetExpanded, expanded)\n    }, [emitter, expanded])\n\n    return (\n      <ExpansionTransition\n        in={expanded}\n        width={routesExpansionWidth}\n        onExited={onExit}\n      >\n        <RoutesContent\n          routes={routesRef.current}\n          isFetching={isFetching}\n          isLoading={isLoading}\n          dataUpdatedAt={dataUpdatedAt}\n          refetchTime={refetchTime}\n          fromChain={fromChain}\n          refetch={refetch}\n          onRouteClick={onRouteClick}\n        />\n      </ExpansionTransition>\n    )\n  })\n"],"mappings":";;;;;;;;;;;AAiBA,MAAa,iBACX,KAAK,SAAS,eAAe,EAC3B,SACA,oBACsB;CACtB,MAAM,UAAU,gBAAgB;CAChC,MAAM,WAAW,YAAY;CAC7B,MAAM,YAAY,OAAgB,KAAA,CAAS;CAC3C,MAAM,kBAAkB,OAAO,KAAK;CAEpC,MAAM,EACJ,QACA,WACA,YACA,WACA,eACA,aACA,WACA,SACA,uBACE,UAAU;CAEd,MAAM,SAAS,kBAAkB;EAE/B,UAAU,UAAU,KAAA;CACtB,GAAG,CAAC,CAAC;CAGL,IAAI,UAAU,WAAW,CAAC,QAAQ;EAChC,gBAAgB,UAAU;EAE1B,IAAI,WACF,UAAU,UAAU,KAAA;CAExB,OAAO;EACL,UAAU,UAAU;EACpB,gBAAgB,UAAU,QAAQ,MAAM;CAC1C;CAEA,MAAM,WACJ,QACE,gBAAgB,WAAW,aAAa,cAAc,SACxD,KAAK;CAGP,MAAM,eAAe,aAClB,UAAiB;EAChB,mBAAmB,KAAK;EACxB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,GAAG;EAC9B,CAAC;EACD,QAAQ,KAAA,iBAAgC;GAAE;GAAe;EAAQ,CAAC;CACpE,GACA;EAAC;EAAS;EAAQ;CAAkB,CACtC;CAGA,sBAAsB;EACpB,iBAAiB,QAAQ;CAC3B,GAAG,CAAC,UAAU,gBAAgB,CAAC;CAE/B,gBAAgB;EACd,QAAQ,KAAA,kBAAiC,QAAQ;CACnD,GAAG,CAAC,SAAS,QAAQ,CAAC;CAEtB,OACE,oBAAC,qBAAD;EACE,IAAI;EACJ,OAAO;EACP,UAAU;EAEV,UAAA,oBAAC,eAAD;GACE,QAAQ,UAAU;GACN;GACD;GACI;GACF;GACF;GACF;GACK;EACf,CAAA;CACkB,CAAA;AAEzB,CAAC"}

package/dist/esm/components/Search/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","names":[],"sources":["../../../../src/components/Search/SearchInput.tsx"],"sourcesContent":["import ClearIcon from '@mui/icons-material/Clear'\nimport Search from '@mui/icons-material/Search'\nimport { FormControl, IconButton, InputAdornment } from '@mui/material'\nimport type {\n  ChangeEventHandler,\n  FocusEventHandler,\n  JSX,\n  RefObject,\n} from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\nimport { Input } from './SearchInput.style.js'\n\ninterface SearchInputProps {\n  inputRef?: RefObject<HTMLInputElement | null>\n  name?: string\n  value?: string\n  placeholder?: string\n  onChange?: ChangeEventHandler<HTMLInputElement>\n  onBlur?: FocusEventHandler<HTMLInputElement>\n  onClear?: () => void\n  autoFocus?: boolean\n  size?: 'small' | 'medium'\n}\n\nexport const SearchInput = ({\n  inputRef,\n  name,\n  placeholder,\n  onChange,\n  onBlur,\n  onClear,\n  value,\n  autoFocus,\n  size = 'medium',\n}: SearchInputProps): JSX.Element => {\n  return (\n    <InputCard>\n      <FormControl fullWidth>\n        <Input\n          inputRef={inputRef}\n          size={size}\n          placeholder={placeholder}\n          startAdornment={\n            <InputAdornment position=\"start\">\n              <Search />\n            </InputAdornment>\n          }\n          endAdornment={\n            (value || inputRef?.current?.value) &&\n            onClear && (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  size={size}\n                  onClick={onClear}\n                  aria-label=\"Clear\"\n                  tabIndex={-1}\n                  sx={{\n                    padding: 0.5,\n                  }}\n                >\n                  <ClearIcon fontSize={size} />\n                </IconButton>\n              </InputAdornment>\n            )\n          }\n          inputProps={{\n            inputMode: 'search',\n            onChange,\n            onBlur,\n            name,\n            value,\n            maxLength: 128,\n          }}\n          autoComplete=\"off\"\n          autoFocus={autoFocus}\n        />\n      </FormControl>\n    </InputCard>\n  )\n}\n"],"mappings":";;;;;;;AAwBA,MAAa,eAAe,EAC1B,UACA,MACA,aACA,UACA,QACA,SACA,OACA,WACA,OAAO,eAC4B;CACnC,OACE,oBAAC,WAAD,EAAA,UACE,oBAAC,aAAD;EAAa,WAAA;YACX,oBAAC,OAAD;GACY;GACJ;GACO;GACb,gBACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,QAAD,CAAS,CAAA;GACK,CAAA;GAElB,eACG,SAAS,UAAU,SAAS,UAC7B,WACE,oBAAC,gBAAD;IAAgB,UAAS;cACvB,oBAAC,YAAD;KACQ;KACN,SAAS;KACT,cAAW;KACX,UAAU;KACV,IAAI,EACF,SAAS,GACX;eAEA,oBAAC,WAAD,EAAW,UAAU,KAAO,CAAA;IAClB,CAAA;GACE,CAAA;GAGpB,YAAY;IACV,WAAW;IACX;IACA;IACA;IACA;IACA,WAAW;GACb;GACA,cAAa;GACF;EACZ,CAAA;CACU,CAAA,EACJ,CAAA;AAEf"}
+{"version":3,"file":"SearchInput.js","names":[],"sources":["../../../../src/components/Search/SearchInput.tsx"],"sourcesContent":["import ClearIcon from '@mui/icons-material/Clear'\nimport Search from '@mui/icons-material/Search'\nimport { FormControl, IconButton, InputAdornment } from '@mui/material'\nimport type {\n  ChangeEventHandler,\n  FocusEventHandler,\n  JSX,\n  RefObject,\n} from 'react'\nimport { InputCard } from '../../components/Card/InputCard.js'\nimport { Input } from './SearchInput.style.js'\n\ninterface SearchInputProps {\n  inputRef?: RefObject<HTMLInputElement | null>\n  name?: string\n  value?: string\n  placeholder?: string\n  onChange?: ChangeEventHandler<HTMLInputElement>\n  onBlur?: FocusEventHandler<HTMLInputElement>\n  onClear?: () => void\n  autoFocus?: boolean\n  size?: 'small' | 'medium'\n}\n\nexport const SearchInput = ({\n  inputRef,\n  name,\n  placeholder,\n  onChange,\n  onBlur,\n  onClear,\n  value,\n  autoFocus,\n  size = 'medium',\n}: SearchInputProps): JSX.Element => {\n  return (\n    <InputCard>\n      <FormControl fullWidth>\n        <Input\n          inputRef={inputRef}\n          size={size}\n          placeholder={placeholder}\n          startAdornment={\n            <InputAdornment position=\"start\">\n              <Search />\n            </InputAdornment>\n          }\n          endAdornment={\n            (value || inputRef?.current?.value) &&\n            onClear && (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  size={size}\n                  onClick={onClear}\n                  aria-label=\"Clear\"\n                  tabIndex={-1}\n                  sx={{\n                    padding: 0.5,\n                  }}\n                >\n                  <ClearIcon fontSize={size} />\n                </IconButton>\n              </InputAdornment>\n            )\n          }\n          inputProps={{\n            inputMode: 'search',\n            onChange,\n            onBlur,\n            name,\n            value,\n            maxLength: 128,\n          }}\n          autoComplete=\"off\"\n          autoFocus={autoFocus}\n        />\n      </FormControl>\n    </InputCard>\n  )\n}\n"],"mappings":";;;;;;;AAwBA,MAAa,eAAe,EAC1B,UACA,MACA,aACA,UACA,QACA,SACA,OACA,WACA,OAAO,eAC4B;CACnC,OACE,oBAAC,WAAD,EAAA,UACE,oBAAC,aAAD;EAAa,WAAA;EACX,UAAA,oBAAC,OAAD;GACY;GACJ;GACO;GACb,gBACE,oBAAC,gBAAD;IAAgB,UAAS;IACvB,UAAA,oBAAC,QAAD,CAAS,CAAA;GACK,CAAA;GAElB,eACG,SAAS,UAAU,SAAS,UAC7B,WACE,oBAAC,gBAAD;IAAgB,UAAS;IACvB,UAAA,oBAAC,YAAD;KACQ;KACN,SAAS;KACT,cAAW;KACX,UAAU;KACV,IAAI,EACF,SAAS,GACX;KAEA,UAAA,oBAAC,WAAD,EAAW,UAAU,KAAO,CAAA;IAClB,CAAA;GACE,CAAA;GAGpB,YAAY;IACV,WAAW;IACX;IACA;IACA;IACA;IACA,WAAW;GACb;GACA,cAAa;GACF;EACZ,CAAA;CACU,CAAA,EACJ,CAAA;AAEf"}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectChainAndToken.js","names":[],"sources":["../../../src/components/SelectChainAndToken.tsx"],"sourcesContent":["import type { BoxProps } from '@mui/material'\nimport { Box } from '@mui/material'\nimport { ReverseTokensButton } from '../components/ReverseTokensButton/ReverseTokensButton.js'\nimport { SelectTokenButton } from '../components/SelectTokenButton/SelectTokenButton.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { ReverseTokensButtonEmpty } from './ReverseTokensButton/ReverseTokensButton.style.js'\n\nexport const SelectChainAndToken: React.FC<BoxProps> = (props) => {\n  const { disabledUI, hiddenUI, mode } = useWidgetConfig()\n\n  const hiddenReverse =\n    mode === 'refuel' ||\n    disabledUI?.fromToken ||\n    disabledUI?.toToken ||\n    hiddenUI?.fromToken ||\n    hiddenUI?.toToken ||\n    hiddenUI?.reverseTokensButton\n\n  const hiddenFromToken = hiddenUI?.fromToken\n  const hiddenToToken = mode === 'custom' || hiddenUI?.toToken\n\n  const showReverseButton = !hiddenToToken && !hiddenFromToken\n\n  return (\n    <Box {...props} sx={{ display: 'flex', ...props.sx }}>\n      {!hiddenFromToken ? (\n        <SelectTokenButton formType=\"from\" hiddenReverse={hiddenReverse} />\n      ) : null}\n      {showReverseButton ? (\n        !hiddenReverse ? (\n          <ReverseTokensButton />\n        ) : (\n          <ReverseTokensButtonEmpty />\n        )\n      ) : null}\n      {!hiddenToToken ? (\n        <SelectTokenButton formType=\"to\" hiddenReverse={hiddenReverse} />\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAOA,MAAa,uBAA2C,UAAU;CAChE,MAAM,EAAE,YAAY,UAAU,SAAS,gBAAgB;CAEvD,MAAM,gBACJ,SAAS,YACT,YAAY,aACZ,YAAY,WACZ,UAAU,aACV,UAAU,WACV,UAAU;CAEZ,MAAM,kBAAkB,UAAU;CAClC,MAAM,gBAAgB,SAAS,YAAY,UAAU;CAErD,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;CAE7C,OACE,qBAAC,KAAD;EAAK,GAAI;EAAO,IAAI;GAAE,SAAS;GAAQ,GAAG,MAAM;EAAG;YAAnD;GACG,CAAC,kBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAsB;GAAgB,CAAA,IAChE;GACH,oBACC,CAAC,gBACC,oBAAC,qBAAD,CAAsB,CAAA,IAEtB,oBAAC,0BAAD,CAA2B,CAAA,IAE3B;GACH,CAAC,gBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAoB;GAAgB,CAAA,IAC9D;EACD;;AAET"}
+{"version":3,"file":"SelectChainAndToken.js","names":[],"sources":["../../../src/components/SelectChainAndToken.tsx"],"sourcesContent":["import type { BoxProps } from '@mui/material'\nimport { Box } from '@mui/material'\nimport { ReverseTokensButton } from '../components/ReverseTokensButton/ReverseTokensButton.js'\nimport { SelectTokenButton } from '../components/SelectTokenButton/SelectTokenButton.js'\nimport { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'\nimport { ReverseTokensButtonEmpty } from './ReverseTokensButton/ReverseTokensButton.style.js'\n\nexport const SelectChainAndToken: React.FC<BoxProps> = (props) => {\n  const { disabledUI, hiddenUI, mode } = useWidgetConfig()\n\n  const hiddenReverse =\n    mode === 'refuel' ||\n    disabledUI?.fromToken ||\n    disabledUI?.toToken ||\n    hiddenUI?.fromToken ||\n    hiddenUI?.toToken ||\n    hiddenUI?.reverseTokensButton\n\n  const hiddenFromToken = hiddenUI?.fromToken\n  const hiddenToToken = mode === 'custom' || hiddenUI?.toToken\n\n  const showReverseButton = !hiddenToToken && !hiddenFromToken\n\n  return (\n    <Box {...props} sx={{ display: 'flex', ...props.sx }}>\n      {!hiddenFromToken ? (\n        <SelectTokenButton formType=\"from\" hiddenReverse={hiddenReverse} />\n      ) : null}\n      {showReverseButton ? (\n        !hiddenReverse ? (\n          <ReverseTokensButton />\n        ) : (\n          <ReverseTokensButtonEmpty />\n        )\n      ) : null}\n      {!hiddenToToken ? (\n        <SelectTokenButton formType=\"to\" hiddenReverse={hiddenReverse} />\n      ) : null}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;AAOA,MAAa,uBAA2C,UAAU;CAChE,MAAM,EAAE,YAAY,UAAU,SAAS,gBAAgB;CAEvD,MAAM,gBACJ,SAAS,YACT,YAAY,aACZ,YAAY,WACZ,UAAU,aACV,UAAU,WACV,UAAU;CAEZ,MAAM,kBAAkB,UAAU;CAClC,MAAM,gBAAgB,SAAS,YAAY,UAAU;CAErD,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;CAE7C,OACE,qBAAC,KAAD;EAAK,GAAI;EAAO,IAAI;GAAE,SAAS;GAAQ,GAAG,MAAM;EAAG;EAAnD,UAAA;GACG,CAAC,kBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAsB;GAAgB,CAAA,IAChE;GACH,oBACC,CAAC,gBACC,oBAAC,qBAAD,CAAsB,CAAA,IAEtB,oBAAC,0BAAD,CAA2B,CAAA,IAE3B;GACH,CAAC,gBACA,oBAAC,mBAAD;IAAmB,UAAS;IAAoB;GAAgB,CAAA,IAC9D;EACD;;AAET"}