@xswap-link/sdk 0.2.4 → 0.2.5

package/dist/index.js

@@ -35,8 +35,9 @@ __export(src_exports, {
   Environment: () => Environment,
   Web3Environment: () => Web3Environment,
   XSwapCallType: () => XSwapCallType,
-  getSwapTx: () => getSwapTx,
-  monitorTransactionStatus: () => monitorTransactionStatus
+  default: () => src_default,
+  openTransactionModal: () => openTransactionModal,
+  renderTxStatus: () => renderTxStatus
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -58,7 +59,7 @@ var xswap_config_default = {
 };
 
 // package.json
-var version = "0.2.4";
+var version = "0.2.5";
 
 // src/components/WaitingForInit/index.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -96,7 +97,7 @@ var initDocument = () => {
   createInitIndicatorRoot();
   Promise.all([
     createStyleElement(),
-    createXswapRoot(),
+    createXSwapRoot(),
     createTxStatusRoot()
   ]).then(() => {
     initCompleted = true;
@@ -122,7 +123,7 @@ var createStyleElement = async () => {
   style.textContent = text;
   document.body.appendChild(style);
 };
-var createXswapRoot = async () => {
+var createXSwapRoot = async () => {
   const xswapElement = document.createElement("div");
   xswapElement.setAttribute("id", "xswap-modal");
   document.body.appendChild(xswapElement);
@@ -145,45 +146,6 @@ var displayInitIndicator = (display) => {
   display ? initIndicatorRoot.render(/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(WaitingForInit, {})) : initIndicatorRoot.render("");
 };
 
-// src/models/Addresses.ts
-var ContractName = /* @__PURE__ */ ((ContractName2) => {
-  ContractName2["BatchQuery"] = "BatchQuery";
-  ContractName2["FeeCollector"] = "FeeCollector";
-  ContractName2["XSwapRouter"] = "XSwapRouter";
-  return ContractName2;
-})(ContractName || {});
-
-// src/models/Ecosystem.ts
-var Ecosystem = /* @__PURE__ */ ((Ecosystem2) => {
-  Ecosystem2["EVM"] = "evm";
-  return Ecosystem2;
-})(Ecosystem || {});
-
-// src/models/Environment.ts
-var Environment = /* @__PURE__ */ ((Environment2) => {
-  Environment2["PROD"] = "production";
-  Environment2["DEV"] = "develop";
-  Environment2["LOCAL"] = "local";
-  return Environment2;
-})(Environment || {});
-
-// src/models/Web3Environment.ts
-var Web3Environment = /* @__PURE__ */ ((Web3Environment2) => {
-  Web3Environment2["DEVNET"] = "devnet";
-  Web3Environment2["TESTNET"] = "testnet";
-  Web3Environment2["MAINNET"] = "mainnet";
-  return Web3Environment2;
-})(Web3Environment || {});
-
-// src/models/XSwapCallType.ts
-var XSwapCallType = /* @__PURE__ */ ((XSwapCallType2) => {
-  XSwapCallType2[XSwapCallType2["DEFAULT"] = 0] = "DEFAULT";
-  XSwapCallType2[XSwapCallType2["FULL_TOKEN_BALANCE"] = 1] = "FULL_TOKEN_BALANCE";
-  XSwapCallType2[XSwapCallType2["FULL_NATIVE_BALANCE"] = 2] = "FULL_NATIVE_BALANCE";
-  XSwapCallType2[XSwapCallType2["COLLECT_TOKEN_BALANCE"] = 3] = "COLLECT_TOKEN_BALANCE";
-  return XSwapCallType2;
-})(XSwapCallType || {});
-
 // src/services/api.ts
 async function _sendRequest(urlPath, options) {
   const response = await fetch(`${xswap_config_default.apiUrl}${urlPath}`, {
@@ -226,10 +188,57 @@ async function getPrices(payload) {
     })}`
   );
 }
+async function getTxStatus(payload) {
+  return await _sendRequest(
+    `/getTxStatus?${new URLSearchParams({
+      data: JSON.stringify(payload)
+      // todo remove once gcp starts working
+    })}`
+  );
+}
 
 // src/services/integrations/customCalls/staking.ts
 var import_ethers3 = require("ethers");
 
+// src/models/Addresses.ts
+var ContractName = /* @__PURE__ */ ((ContractName2) => {
+  ContractName2["BatchQuery"] = "BatchQuery";
+  ContractName2["FeeCollector"] = "FeeCollector";
+  ContractName2["XSwapRouter"] = "XSwapRouter";
+  return ContractName2;
+})(ContractName || {});
+
+// src/models/Ecosystem.ts
+var Ecosystem = /* @__PURE__ */ ((Ecosystem2) => {
+  Ecosystem2["EVM"] = "evm";
+  return Ecosystem2;
+})(Ecosystem || {});
+
+// src/models/Environment.ts
+var Environment = /* @__PURE__ */ ((Environment2) => {
+  Environment2["PROD"] = "production";
+  Environment2["DEV"] = "develop";
+  Environment2["LOCAL"] = "local";
+  return Environment2;
+})(Environment || {});
+
+// src/models/Web3Environment.ts
+var Web3Environment = /* @__PURE__ */ ((Web3Environment2) => {
+  Web3Environment2["DEVNET"] = "devnet";
+  Web3Environment2["TESTNET"] = "testnet";
+  Web3Environment2["MAINNET"] = "mainnet";
+  return Web3Environment2;
+})(Web3Environment || {});
+
+// src/models/XSwapCallType.ts
+var XSwapCallType = /* @__PURE__ */ ((XSwapCallType2) => {
+  XSwapCallType2[XSwapCallType2["DEFAULT"] = 0] = "DEFAULT";
+  XSwapCallType2[XSwapCallType2["FULL_TOKEN_BALANCE"] = 1] = "FULL_TOKEN_BALANCE";
+  XSwapCallType2[XSwapCallType2["FULL_NATIVE_BALANCE"] = 2] = "FULL_NATIVE_BALANCE";
+  XSwapCallType2[XSwapCallType2["COLLECT_TOKEN_BALANCE"] = 3] = "COLLECT_TOKEN_BALANCE";
+  return XSwapCallType2;
+})(XSwapCallType || {});
+
 // src/utils/contracts.ts
 var import_ethers = require("ethers");
 
@@ -661,6 +670,9 @@ var shortAddress = (address) => {
     address.length
   )}`;
 };
+var isETHAddressValid = (address) => {
+  return /^0x[a-fA-F0-9]{40}$/.test(address);
+};
 
 // src/utils/index.ts
 var import_date_fns = require("date-fns");
@@ -689,7 +701,7 @@ var getDate = (blockTimestamp) => {
 };
 
 // src/services/integrations/monitoring.ts
-var import_ethers5 = require("ethers");
+var import_ethers6 = require("ethers");
 
 // src/components/Alert/index.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -701,7 +713,7 @@ var Alert = ({ desc }) => {
 };
 
 // src/components/TxConfigForm/index.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_react_query = require("@tanstack/react-query");
 var import_wagmi3 = require("wagmi");
 
@@ -1190,7 +1202,7 @@ var PoweredBy = () => {
 };
 
 // src/components/TxConfigForm/Form.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_ethers4 = require("ethers");
 var import_wagmi2 = require("wagmi");
 
@@ -1355,15 +1367,35 @@ var History = ({ signer, supportedChains }) => {
       const fetchedTransactions = [];
       if (downloadedHistory) {
         for (const entry of downloadedHistory.history) {
+          let status = "IN_PROGRESS";
           if (!entry.source) {
             continue;
           }
-          let status;
-          if (entry.failed) status = "REVERTED";
+          if (entry.failed) {
+            status = "REVERTED";
+          }
           if (!!entry.target) {
             status = "DONE";
-          } else {
-            status = "IN_PROGRESS";
+          }
+          if (entry.transferType === "SINGLE_CHAIN") {
+            if (!entry.target) {
+              continue;
+            }
+            const blockTimestampMs2 = new Date(entry.target.blockTime).getTime();
+            const estimatedDeliveryTimestamp2 = blockTimestampMs2 / 1e3;
+            fetchedTransactions.push({
+              hash: entry.target.transactionHash,
+              timestamp: blockTimestampMs2 / 1e3,
+              sourceChainId: entry.target.blockchainId,
+              targetChainId: entry.target.blockchainId,
+              amountWei: entry.source.tokenAmount,
+              tokenAddress: entry.source.tokenAddress,
+              tokenOutAddress: entry.target?.tokenAmount,
+              tokenOutAmount: entry.target?.tokenAmount,
+              estimatedDeliveryTimestamp: estimatedDeliveryTimestamp2,
+              status
+            });
+            continue;
           }
           const blockTimestampMs = new Date(entry.source.blockTime).getTime();
           const estimatedDeliveryTimestamp = new import_bignumber2.default(
@@ -1557,6 +1589,7 @@ var Settings = ({
 };
 
 // src/components/TxConfigForm/FeesDetails.tsx
+var import_react5 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
 var FeesDetails = ({
   isGettingRoute,
@@ -1569,6 +1602,9 @@ var FeesDetails = ({
   feesDetailsShown,
   setFeesDetailsShown
 }) => {
+  const isExpressDeliveryPossible = (0, import_react5.useMemo)(() => {
+    return expressChecked && !exceedsExpressDeliveryLimit;
+  }, [expressChecked, exceedsExpressDeliveryLimit]);
   return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex flex-col gap-3 globalBorder rounded-lg bg-[rgba(15,15,15,1)] p-2 sm:p-4 mb-1", children: [
     /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex w-full items-center justify-between text-xs sm:text-sm", children: [
       /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex items-center gap-1 font-medium text-white opacity-60", children: [
@@ -1585,13 +1621,13 @@ var FeesDetails = ({
         })} ${paymentToken?.symbol}`
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex gap-1 items-center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+        route?.xSwapFees.expressDeliveryFee && !isGettingRoute && /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
           "div",
           {
-            className: `flex gap-1 items-center font-medium ${expressChecked && !exceedsExpressDeliveryLimit ? "text-x_green" : "text-white opacity-60"}`,
+            className: `flex gap-1 items-center font-medium ${isExpressDeliveryPossible ? "text-x_green" : "text-white opacity-60"}`,
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TimerIcon, {}),
-              expressChecked && !exceedsExpressDeliveryLimit ? "Fast ~ 30sec " : "Normal ~ 30min"
+              isExpressDeliveryPossible ? "Fast ~ 30sec " : "Normal ~ 30min"
             ]
           }
         ),
@@ -1647,10 +1683,10 @@ var FeesDetails = ({
 };
 
 // src/components/TxConfigForm/Summary.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/components/TxConfigForm/UsdPrice.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
 var UsdPrice = ({
   prices,
@@ -1660,8 +1696,8 @@ var UsdPrice = ({
   type,
   setExceedsExpressDeliveryLimit
 }) => {
-  const [usdPrice, setUsdPrice] = (0, import_react5.useState)("0.00");
-  (0, import_react5.useEffect)(() => {
+  const [usdPrice, setUsdPrice] = (0, import_react6.useState)("0.00");
+  (0, import_react6.useEffect)(() => {
     if (token && prices && prices[token.address]) {
       const newUsdPrice = (Number(amount) * Number(prices[token.address])).toFixed(2);
       if (type === "src" && setExceedsExpressDeliveryLimit) {
@@ -1675,16 +1711,28 @@ var UsdPrice = ({
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "opacity-60 py-4", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Skeleton, { width: "w-12", height: "h-4" }) : token ? prices && prices[token.address] ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { children: `$${usdPrice}` }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Alert, { desc: "Unknown price" }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: "$0.00" }) });
 };
 
-// src/components/TxConfigForm/Summary.tsx
+// src/components/UnknownTokenLogo/UnknownTokenLogo.tsx
 var import_jsx_runtime33 = require("react/jsx-runtime");
+var UnknownTokenLogo = ({ tokenName, className }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    "div",
+    {
+      className: `w-5 h-5 rounded-full bg-white shadow-sm flex items-center justify-center text-black ${className}`,
+      children: tokenName.substring(0, 1)
+    }
+  );
+};
+
+// src/components/TxConfigForm/Summary.tsx
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var Summary = ({
   isGettingRoute,
   route,
   dstToken,
   dstChain
 }) => {
-  const [prices, setPrices] = (0, import_react6.useState)();
-  const amountReadable = (0, import_react6.useMemo)(
+  const [prices, setPrices] = (0, import_react7.useState)();
+  const amountReadable = (0, import_react7.useMemo)(
     () => weiToHumanReadable({
       amount: route?.estAmountOut || "0",
       decimals: dstToken?.decimals || 18,
@@ -1692,41 +1740,54 @@ var Summary = ({
     }),
     [route, dstToken]
   );
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     if (dstChain) {
       getPrices({ chainId: dstChain.chainId, currency: "USD" }).then(
         (prices2) => setPrices(prices2)
       );
     }
   }, [dstChain]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col globalBorder rounded-lg bg-[rgba(15,15,15,1)] p-4 relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-[rgba(255,255,255,0.6)] text-sm", children: "You receive" }),
-        isGettingRoute ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col globalBorder rounded-lg bg-[rgba(15,15,15,1)] p-4 relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-[rgba(255,255,255,0.6)] text-sm", children: "You receive" }),
+        isGettingRoute ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
           Skeleton,
           {
             width: "w-[100px]",
             height: "h-[36px]",
             other: "sm:w-[190px]"
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex gap-2 items-center text-white text-xl sm:text-3xl", children: amountReadable })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex gap-2 items-center text-white text-xl sm:text-3xl", children: amountReadable })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col items-end gap-1 text-sm", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex justify-center items-center gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "w-4 sm:w-6 h-4 sm:h-6", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("img", { src: dstToken?.image, alt: dstToken?.name }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-base sm:text-xl", children: dstToken?.symbol })
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col items-end gap-1 text-sm", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex justify-center items-center gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "w-5 h-5", children: dstToken?.image ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+            "img",
+            {
+              className: "w-5 h-5",
+              src: dstToken?.image,
+              alt: dstToken?.name
+            }
+          ) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+            UnknownTokenLogo,
+            {
+              tokenName: "?",
+              className: "token-select__generated-logo"
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-base sm:text-xl", children: dstToken?.name })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex justify-center items-center gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-[rgba(255,255,255,0.6)] text-right", children: "on " }),
-          /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex items-center gap-1 text-white", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "w-4 h-4", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("img", { src: dstChain?.image, alt: dstChain?.name }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { children: dstChain?.displayName })
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex justify-center items-center gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-[rgba(255,255,255,0.6)] text-right", children: "on " }),
+          /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex items-center gap-1 text-white", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "w-4 h-4", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("img", { src: dstChain?.image, alt: dstChain?.name }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { children: dstChain?.displayName })
           ] })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       UsdPrice,
       {
         prices,
@@ -1736,17 +1797,17 @@ var Summary = ({
         type: "dst"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "absolute right-[50%] top-0 translate-x-1/2 translate-y-[-60%] globalBorder rounded-xl p-[5px] bg-[rgba(15,15,15,1)]", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: " flex items-center justify-center rounded-lg  w-8 h-8 bg-gradient-to-l from-[rgba(54,129,198,1)] to-[rgba(43,74,157,1)] ", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ArrowDownIcon, {}) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "absolute right-[50%] top-0 translate-x-1/2 translate-y-[-60%] globalBorder rounded-xl p-[5px] bg-[rgba(15,15,15,1)]", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: " flex items-center justify-center rounded-lg  w-8 h-8 bg-gradient-to-l from-[rgba(54,129,198,1)] to-[rgba(43,74,157,1)] ", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ArrowDownIcon, {}) }) })
   ] });
 };
 
 // src/components/TxConfigForm/SwapPanel.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/components/TxConfigForm/TokenPicker.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 var import_react_dom = require("react-dom");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var TokenPicker = ({
   onCloseClick,
   tokens,
@@ -1755,7 +1816,7 @@ var TokenPicker = ({
   signer,
   balances
 }) => {
-  const [searchValue, setSearchValue] = (0, import_react7.useState)("");
+  const [searchValue, setSearchValue] = (0, import_react8.useState)("");
   const modalRoot = document.querySelector("#xswap-modal");
   const onBackdropClick = (e) => {
     e.stopPropagation();
@@ -1764,7 +1825,7 @@ var TokenPicker = ({
       onCloseClick();
     }
   };
-  const filteredTokens = (0, import_react7.useMemo)(() => {
+  const filteredTokens = (0, import_react8.useMemo)(() => {
     const isMatch = (value, searchValue2) => value.toLowerCase().indexOf(searchValue2.toLowerCase()) > -1;
     return tokens?.filter(
       (token) => isMatch(token.symbol, searchValue) || isMatch(token.name, searchValue) || token.address === searchValue.toLowerCase()
@@ -1773,24 +1834,24 @@ var TokenPicker = ({
     );
   }, [searchValue, tokens]);
   return modalRoot ? (0, import_react_dom.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       "div",
       {
         onClick: onBackdropClick,
         className: "box-border fixed h-full w-full z-[999] top-0 left-0 bg-[rgba(0,0,0,0.8)] flex items-center justify-center p-5",
-        children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "relative bg-black rounded-3xl p-6 max-h-[70%] flex flex-col text-base text-white w-[452px] h-[70%] border border-solid border-[rgba(255,255,255,0.2)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "relative bg-black rounded-3xl p-6 max-h-[70%] flex flex-col text-base text-white w-[452px] h-[70%] border border-solid border-[rgba(255,255,255,0.2)]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "div",
             {
               onClick: onCloseClick,
               className: "absolute top-4 right-4 cursor-pointer",
-              children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(CloseIcon, {})
+              children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(CloseIcon, {})
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-base mb-4", children: "Pick a token" }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex items-center border border-solid border-[rgba(255,255,255,0.1)] rounded-lg py-0 px-3 gap-2 bg-[rgba(15,15,15,1)]", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "w-6 h-6", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SearchIcon, {}) }),
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-base mb-4", children: "Pick a token" }),
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center border border-solid border-[rgba(255,255,255,0.1)] rounded-lg py-0 px-3 gap-2 bg-[rgba(15,15,15,1)]", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "w-6 h-6", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SearchIcon, {}) }),
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               "input",
               {
                 placeholder: "Search name or paste address",
@@ -1800,7 +1861,7 @@ var TokenPicker = ({
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "my-4 mx-0 flex flex-wrap gap-3", children: tokens?.filter((token) => token?.quickPick).map((token) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "my-4 mx-0 flex flex-wrap gap-3", children: tokens?.filter((token) => token?.quickPick).map((token) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
             "div",
             {
               className: `flex gap-2 py-1 px-2 items-center bg-[rgb(15,15,15)] rounded-2xl border border-solid border-[rgba(255,255,255,0.1)] hover:bg-[rgb(25,25,25)] hover:cursor-pointer ${token.address === selectedToken?.address ? "bg-[rgb(35, 35, 35)]" : ""}`,
@@ -1809,14 +1870,14 @@ var TokenPicker = ({
                 onCloseClick();
               },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("img", { src: token.image, alt: token.name, className: "w-5" }),
-                /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "text-sm", children: token.symbol })
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("img", { src: token.image, alt: token.name, className: "w-5" }),
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "text-sm", children: token.symbol })
               ]
             },
             token.address
           )) }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "h-[2px] my-0 mx-[-24px] w-[100%+48px] px-12 bg-[rgba(255,255,255,0.1)]" }),
-          /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "overflow-y-scroll h-full mx-[-24px] w-[100%+48px] flex flex-col", children: filteredTokens && filteredTokens.length > 0 ? filteredTokens.map((token, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "h-[2px] my-0 mx-[-24px] w-[100%+48px] px-12 bg-[rgba(255,255,255,0.1)]" }),
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "overflow-y-scroll h-full mx-[-24px] w-[100%+48px] flex flex-col", children: filteredTokens && filteredTokens.length > 0 ? filteredTokens.map((token, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
             "div",
             {
               className: `flex gap-3 py-2 px-[24px] w-full items-center hover:bg-[rgb(25,25,25)] hover:cursor-pointer ${token.address === selectedToken?.address ? "bg-[rgb(35,35,35)]" : ""}`,
@@ -1825,29 +1886,29 @@ var TokenPicker = ({
                 onCloseClick();
               },
               children: [
-                token.image ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+                token.image ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
                   "img",
                   {
                     src: token.image,
                     alt: token.name,
                     className: "token-picker__all__logo"
                   }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex items-center justify-center w-9 h-9 text-[15px] ml-1 rounded-full bg-[#272e40] text-[#e0e7fa]", children: token?.symbol.substring(0, 1) }),
-                /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex justify-between items-center gap-1 overflow-hidden grow", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col leading-[16px]", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "overflow-hidden whitespace-nowrap text-ellipsis text-[15px]", children: token.name }),
-                    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "text-[#888] text-[11px]", children: token.symbol })
+                ) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex items-center justify-center w-9 h-9 text-[15px] ml-1 rounded-full bg-[#272e40] text-[#e0e7fa]", children: token?.symbol.substring(0, 1) }),
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex justify-between items-center gap-1 overflow-hidden grow", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-col leading-[16px]", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "overflow-hidden whitespace-nowrap text-ellipsis text-[15px]", children: token.name }),
+                    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "text-[#888] text-[11px]", children: token.symbol })
                   ] }),
-                  signer && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_jsx_runtime34.Fragment, { children: balances && balances[token.address] && token.decimals ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "text-xs", children: weiToHumanReadable({
+                  signer && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_jsx_runtime35.Fragment, { children: balances && balances[token.address] && token.decimals ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "text-xs", children: weiToHumanReadable({
                     amount: balances[token.address]?.toString() || "0",
                     decimals: token.decimals,
                     precisionFractionalPlaces: 4
-                  }) }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { width: "w-12", height: "h-3" }) })
+                  }) }) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Skeleton, { width: "w-12", height: "h-3" }) })
                 ] })
               ]
             },
             `${index}_${token.address}`
-          )) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "mt-4 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "text-sm text-white", children: "No tokens found." }) }) })
+          )) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "mt-4 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("p", { className: "text-sm text-white", children: "No tokens found." }) }) })
         ] })
       }
     ),
@@ -1856,7 +1917,7 @@ var TokenPicker = ({
 };
 
 // src/components/TxConfigForm/ChainListElement.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var ChainListElement = ({
   chain,
   setSrcChain,
@@ -1864,8 +1925,8 @@ var ChainListElement = ({
   index,
   length
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
       "li",
       {
         className: "bg-transparent border-none flex gap-1 items-center cursor-pointer py-2 w-full",
@@ -1874,21 +1935,21 @@ var ChainListElement = ({
           setChainListShown(false);
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("img", { width: 12, height: 12, src: chain.image, alt: chain.displayName }),
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("img", { width: 12, height: 12, src: chain.image, alt: chain.displayName }),
           chain.displayName
         ]
       }
     ),
-    index !== length - 1 && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "h-px mx-2 bg-[rgba(255,255,255,0.15)]" })
+    index !== length - 1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "h-px mx-2 bg-[rgba(255,255,255,0.15)]" })
   ] }, `${chain.ecosystem}-${chain.chainId}`);
 };
 
 // src/components/TxConfigForm/BalanceComponent.tsx
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_bignumber3 = __toESM(require("bignumber.js"));
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var BalanceComponent = ({ srcToken, balances }) => {
-  const balanceText = (0, import_react8.useMemo)(() => {
+  const balanceText = (0, import_react9.useMemo)(() => {
     if (!balances || !srcToken) return "0";
     if (balances[srcToken.address]?.toString() === "0") return "0";
     const fullHumanReadable = weiToHumanReadable({
@@ -1906,7 +1967,7 @@ var BalanceComponent = ({ srcToken, balances }) => {
       precisionFractionalPlaces: 5
     });
   }, [srcToken, balances]);
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
     "Balance:",
     " ",
     srcToken && balances ? weiToHumanReadable({
@@ -1914,12 +1975,12 @@ var BalanceComponent = ({ srcToken, balances }) => {
       decimals: srcToken.decimals,
       precisionFractionalPlaces: 4
     }) : 0,
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "bg-gradient-to-r from-x_blue_light to-x_blue_dark bg-clip-text text-transparent", children: "Max" })
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "bg-gradient-to-r from-x_blue_light to-x_blue_dark bg-clip-text text-transparent", children: "Max" })
   ] });
 };
 
 // src/components/TxConfigForm/SwapPanel.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var SwapPanel = ({
   amount,
   setAmount,
@@ -1933,10 +1994,10 @@ var SwapPanel = ({
   supportedChains,
   setExceedsExpressDeliveryLimit
 }) => {
-  const [chainListShown, setChainListShown] = (0, import_react9.useState)(false);
-  const [tokenListShown, setTokenListShown] = (0, import_react9.useState)(false);
-  const listRef = (0, import_react9.useRef)(null);
-  const buttonRef = (0, import_react9.useRef)(null);
+  const [chainListShown, setChainListShown] = (0, import_react10.useState)(false);
+  const [tokenListShown, setTokenListShown] = (0, import_react10.useState)(false);
+  const listRef = (0, import_react10.useRef)(null);
+  const buttonRef = (0, import_react10.useRef)(null);
   const handleClickOutside = (event) => {
     if (listRef.current && buttonRef.current) {
       const listElement = listRef.current;
@@ -1951,25 +2012,25 @@ var SwapPanel = ({
         weiToHumanReadable({
           amount: balances[srcToken.address]?.toString() || "0",
           decimals: srcToken.decimals,
-          precisionFractionalPlaces: 4
+          precisionFractionalPlaces: srcToken.decimals
         })
       );
   };
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (chainListShown) {
       document.addEventListener("mousedown", handleClickOutside);
       return () => document.removeEventListener("mousedown", handleClickOutside);
     }
   }, [chainListShown]);
-  const chainListOptions = (0, import_react9.useMemo)(
+  const chainListOptions = (0, import_react10.useMemo)(
     () => supportedChains.filter((chain) => chain.chainId !== srcChain?.chainId),
     [supportedChains, srcChain]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex justify-between globalBorder rounded-lg bg-[rgba(15,15,15,1)] p-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col justify-between gap-2 overflow-hidden w-1/2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "text-white opacity-60 text-xs sm:text-sm font-medium", children: "You pay" }),
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-between globalBorder rounded-lg bg-[rgba(15,15,15,1)] p-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col justify-between gap-2 overflow-hidden w-1/2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-white opacity-60 text-xs sm:text-sm font-medium", children: "You pay" }),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
           "input",
           {
             className: "p-0 border-none outline-none bg-transparent text-2xl overflow-ellipsis",
@@ -1988,7 +2049,7 @@ var SwapPanel = ({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center text-sm text-[rgba(255,255,255,0.6)]", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex items-center text-sm text-[rgba(255,255,255,0.6)]", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         UsdPrice,
         {
           prices,
@@ -2000,8 +2061,8 @@ var SwapPanel = ({
         }
       ) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col relative items-end gap-2.5 w-1/2 text-xs", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col relative items-end gap-2.5 w-1/2 text-xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
         "div",
         {
           className: "flex gap-2 items-center p-2 max-w-full cursor-pointer bg-black text-white globalBorder rounded-3xl whitespace-nowrap",
@@ -2009,7 +2070,7 @@ var SwapPanel = ({
             setTokenListShown((state) => !state);
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
               "img",
               {
                 height: 16,
@@ -2018,12 +2079,12 @@ var SwapPanel = ({
                 alt: srcToken?.name
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { children: srcToken?.symbol }),
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DownArrowIcon, {})
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { children: srcToken?.symbol }),
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(DownArrowIcon, {})
           ]
         }
       ),
-      tokenListShown && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      tokenListShown && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         TokenPicker,
         {
           onCloseClick: () => setTokenListShown(false),
@@ -2034,22 +2095,22 @@ var SwapPanel = ({
           balances
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         "div",
         {
           onClick: handleMaxClick,
           className: "flex gap-1 items-center font-medium text-white opacity-60 py-0.5 cursor-pointer",
-          children: signer && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(BalanceComponent, { balances, srcToken })
+          children: signer && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(BalanceComponent, { balances, srcToken })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
         "div",
         {
           ref: buttonRef,
           className: "bg-black globalBorder rounded-2xl whitespace-nowrap flex items-center p-2 cursor-pointer gap-2",
           onClick: () => setChainListShown((prev) => !prev),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
               "img",
               {
                 width: "16",
@@ -2058,17 +2119,17 @@ var SwapPanel = ({
                 alt: srcChain?.name
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { children: srcChain?.displayName }),
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DownArrowIcon, {})
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { children: srcChain?.displayName }),
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(DownArrowIcon, {})
           ]
         }
       ),
-      chainListShown && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      chainListShown && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         "ul",
         {
           ref: listRef,
           className: "bg-black globalBorder rounded-lg whitespace-nowrap z-1 right-0 top-10 px-2 max-w-full max-h-[40vh] overflow-auto absolute text-sm z-20",
-          children: chainListOptions.map((chain, index) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+          children: chainListOptions.map((chain, index) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
             ChainListElement,
             {
               index,
@@ -2085,9 +2146,9 @@ var SwapPanel = ({
 };
 
 // src/components/TxConfigForm/ErrorField.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var ErrorField = ({ error }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     "div",
     {
       className: `flex justify-center mb-1 items-center w-full rounded-2xl bg-x_error_background border border-solid ${error.length > 0 ? "border-x_error_border" : "border-transparent"}`,
@@ -2097,15 +2158,15 @@ var ErrorField = ({ error }) => {
 };
 
 // src/components/TxConfigForm/Description.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var Description = ({ description }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex flex-col items-start rounded-lg px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "w-full flex gap-4 items-start justify-between text-xl", children: description }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-col items-start rounded-lg px-4 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-full flex gap-4 items-start justify-between text-xl", children: description }) });
 };
 
 // src/components/TxConfigForm/Button.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 var Button = ({ children, onClick, type, disabled }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     "button",
     {
       className: "text-white border-none rounded-2xl text-xl py-4 cursor-pointer w-full bg-gradient-to-r from-[#3681c6] to-[#2b4a9d] disabled:opacity-25",
@@ -2118,8 +2179,9 @@ var Button = ({ children, onClick, type, disabled }) => {
 };
 
 // src/components/TxConfigForm/Form.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var Form = ({
+  integratorId,
   dstChainId,
   dstTokenAddr,
   customContractCalls,
@@ -2128,31 +2190,31 @@ var Form = ({
   onSubmit,
   onClose
 }) => {
-  const [signer, setSigner] = (0, import_react10.useState)();
-  const [dstChain, setDstChain] = (0, import_react10.useState)();
-  const [dstToken, setDstToken] = (0, import_react10.useState)();
-  const [srcChain, setSrcChain] = (0, import_react10.useState)();
-  const [srcToken, setSrcToken] = (0, import_react10.useState)();
-  const [amount, setAmount] = (0, import_react10.useState)("");
-  const [paymentToken, setPaymentToken] = (0, import_react10.useState)();
-  const [route, setRoute] = (0, import_react10.useState)();
-  const [expressChecked, setExpressChecked] = (0, import_react10.useState)(true);
-  const [historyTabShown, setHistoryTabShown] = (0, import_react10.useState)(false);
-  const [isGettingRoute, setIsGettingRoute] = (0, import_react10.useState)(false);
-  const [prices, setPrices] = (0, import_react10.useState)();
-  const [balances, setBalances] = (0, import_react10.useState)();
-  const [settingsShown, setSettingsShown] = (0, import_react10.useState)(false);
-  const [formError, setFormError] = (0, import_react10.useState)("");
-  const [slippage, setSlippage] = (0, import_react10.useState)("1.5");
-  const [feesDetailsShown, setFeesDetailsShown] = (0, import_react10.useState)(false);
-  const [exceedsExpressDeliveryLimit, setExceedsExpressDeliveryLimit] = (0, import_react10.useState)(false);
+  const [signer, setSigner] = (0, import_react11.useState)();
+  const [dstChain, setDstChain] = (0, import_react11.useState)();
+  const [dstToken, setDstToken] = (0, import_react11.useState)();
+  const [srcChain, setSrcChain] = (0, import_react11.useState)();
+  const [srcToken, setSrcToken] = (0, import_react11.useState)();
+  const [amount, setAmount] = (0, import_react11.useState)("");
+  const [paymentToken, setPaymentToken] = (0, import_react11.useState)();
+  const [route, setRoute] = (0, import_react11.useState)();
+  const [expressChecked, setExpressChecked] = (0, import_react11.useState)(true);
+  const [historyTabShown, setHistoryTabShown] = (0, import_react11.useState)(false);
+  const [isGettingRoute, setIsGettingRoute] = (0, import_react11.useState)(false);
+  const [prices, setPrices] = (0, import_react11.useState)();
+  const [balances, setBalances] = (0, import_react11.useState)();
+  const [settingsShown, setSettingsShown] = (0, import_react11.useState)(false);
+  const [formError, setFormError] = (0, import_react11.useState)("");
+  const [slippage, setSlippage] = (0, import_react11.useState)("1.5");
+  const [feesDetailsShown, setFeesDetailsShown] = (0, import_react11.useState)(false);
+  const [exceedsExpressDeliveryLimit, setExceedsExpressDeliveryLimit] = (0, import_react11.useState)(false);
   const debouncedAmount = useDebounce(amount, 1e3);
   const account = (0, import_wagmi2.useAccount)();
   const { switchChainAsync } = (0, import_wagmi2.useSwitchChain)();
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     setSigner(account.address);
   }, [account.address]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     const defaultChain = supportedChains.find(
       ({ chainId }) => chainId === account.chainId?.toString()
     );
@@ -2162,18 +2224,28 @@ var Form = ({
       )
     );
   }, [account.chainId]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     setDstChain(supportedChains.find((chain) => chain.chainId === dstChainId));
   }, [supportedChains, dstChainId]);
-  (0, import_react10.useEffect)(() => {
-    setDstToken(
-      dstChain?.tokens.find(
+  (0, import_react11.useEffect)(() => {
+    (async () => {
+      if (!dstChain) {
+        return;
+      }
+      let dstTokenResult = dstChain?.tokens.find(
         (token) => token.address.toLowerCase() === dstTokenAddr.toLowerCase()
-      )
-    );
+      );
+      if (!dstTokenResult) {
+        dstTokenResult = await getCustomTokenData(
+          dstChain,
+          dstTokenAddr.toLowerCase()
+        );
+      }
+      setDstToken(dstTokenResult);
+    })();
   }, [dstChain]);
-  (0, import_react10.useEffect)(() => {
-    if (srcChain && srcToken && dstChain && debouncedAmount && paymentToken && slippage) {
+  (0, import_react11.useEffect)(() => {
+    if (integratorId && srcChain && srcToken && dstChain && debouncedAmount && paymentToken && slippage) {
       setFormError("");
       const timeout = setTimeout(() => {
         setFormError("Getting Route is taking longer than usually");
@@ -2185,6 +2257,7 @@ var Form = ({
           `Configuration error: selected token ($${srcToken.symbol} ${srcToken.name}) has unknown decimals param.`
         );
       getRoute({
+        integratorId,
         fromAmount: import_ethers4.ethers.utils.parseUnits(debouncedAmount, srcToken.decimals).toString(),
         fromAddress: signer || ADDRESSES[srcChain.chainId].FeeCollector,
         fromChain: srcChain.chainId,
@@ -2215,7 +2288,7 @@ var Form = ({
     slippage,
     expressChecked
   ]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (srcChain) {
       setPaymentToken(
         srcChain.tokens.find(
@@ -2224,21 +2297,21 @@ var Form = ({
       );
     }
   }, [srcChain]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     setAmount("");
     setFormError("");
   }, [srcToken]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     setSrcToken(srcChain?.tokens[0]);
   }, [srcChain]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (srcChain) {
       getPrices({ chainId: srcChain.chainId, currency: "USD" }).then(
         (prices2) => setPrices(prices2)
       );
     }
   }, [srcChain]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (srcChain && signer) {
       getBalances(srcChain, signer).then((balances2) => setBalances(balances2));
     }
@@ -2250,13 +2323,13 @@ var Form = ({
   const handleSwitchChain = async () => {
     await switchChainAsync({ chainId: Number(srcChain?.chainId) });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
     "form",
     {
       className: "flex flex-col gap-2 z-10 my-0 p-2 md:p-4 rounded-3xl overflow-hidden font-light sm:w-x_desktop",
       onSubmit: handleSubmit,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           TopBar,
           {
             signer,
@@ -2266,7 +2339,7 @@ var Form = ({
             onClose
           }
         ),
-        settingsShown && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        settingsShown && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           Settings,
           {
             expressChecked,
@@ -2276,9 +2349,9 @@ var Form = ({
             setSlippage
           }
         ),
-        historyTabShown ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(History, { signer, supportedChains }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex flex-col gap-2", children: [
-          desc && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Description, { description: desc }),
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        historyTabShown ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(History, { signer, supportedChains }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col gap-2", children: [
+          desc && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Description, { description: desc }),
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
             SwapPanel,
             {
               amount,
@@ -2294,7 +2367,7 @@ var Form = ({
               setExceedsExpressDeliveryLimit
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
             Summary,
             {
               isGettingRoute,
@@ -2303,7 +2376,7 @@ var Form = ({
               dstChain
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
             FeesDetails,
             {
               route,
@@ -2317,8 +2390,8 @@ var Form = ({
               setFeesDetailsShown
             }
           ),
-          formError.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ErrorField, { error: formError }),
-          signer && srcChain && srcChain.chainId !== account.chainId?.toString() ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { type: "button", onClick: handleSwitchChain, children: "Switch chain" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          formError.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(ErrorField, { error: formError }),
+          signer && srcChain && srcChain.chainId !== account.chainId?.toString() ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Button, { type: "button", onClick: handleSwitchChain, children: "Switch chain" }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
             Button,
             {
               type: "submit",
@@ -2333,8 +2406,9 @@ var Form = ({
 };
 
 // src/components/TxConfigForm/index.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var TxConfigForm = ({
+  integratorId,
   dstChainId,
   dstTokenAddr,
   customContractCalls,
@@ -2351,19 +2425,20 @@ var TxConfigForm = ({
     }
   };
   const queryClient = new import_react_query.QueryClient();
-  const wagmiConfig = (0, import_react11.useMemo)(
+  const wagmiConfig = (0, import_react12.useMemo)(
     () => getWagmiConfig(supportedChains),
     supportedChains
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_wagmi3.WagmiProvider, { config: wagmiConfig, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_query.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_wagmi3.WagmiProvider, { config: wagmiConfig, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react_query.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
     "div",
     {
       className: "top-0 left-0 right-0 bottom-0 bg-[rgba(0,0,0,0.8)] fixed flex items-center justify-center z-10",
       onClick: onBackdropClick,
-      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "relative bg-black rounded-3xl overflow-auto text-white border-2 border-solid border-[rgba(255,255,255,0.1)]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "relative bg-black rounded-3xl overflow-auto text-white border-2 border-solid border-[rgba(255,255,255,0.1)]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           Form,
           {
+            integratorId,
             dstChainId,
             dstTokenAddr,
             customContractCalls,
@@ -2373,12 +2448,13 @@ var TxConfigForm = ({
             onClose
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(PoweredBy, {})
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(PoweredBy, {})
       ] })
     }
   ) }) });
 };
 var openTxConfigForm = async ({
+  integratorId,
   dstChainId,
   dstTokenAddr,
   customContractCalls,
@@ -2389,9 +2465,10 @@ var openTxConfigForm = async ({
     return await new Promise(async (resolve) => {
       await waitForInitialization();
       xswapRoot.render(
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           TxConfigForm,
           {
+            integratorId,
             dstChainId,
             dstTokenAddr,
             customContractCalls,
@@ -2414,39 +2491,38 @@ var openTxConfigForm = async ({
 };
 
 // src/components/TxStatusButton/index.tsx
-var import_react12 = require("react");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_react13 = require("react");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var TxStatusButton = ({ transaction }) => {
   const {
-    fromChain,
-    fromChainImage,
-    fromToken,
-    fromTokenImage,
-    fromAmount,
-    toChain,
-    toChainImage,
+    srcChain: fromChain,
+    srcChainImage: fromChainImage,
+    srcToken: fromToken,
+    srcTokenImage: fromTokenImage,
+    srcAmount: fromAmount,
+    dstChain: toChain,
+    dstChainImage: toChainImage,
     isDone,
-    txHash,
     explorer
   } = transaction;
-  const [isWide, setIsWide] = (0, import_react12.useState)(false);
-  const background = (0, import_react12.useMemo)(
+  const [isWide, setIsWide] = (0, import_react13.useState)(false);
+  const background = (0, import_react13.useMemo)(
     () => isDone ? "bg-[rgba(2,2,2,1)] bg-gradient-to-r from-[rgba(76,175,80,0.2)] to-[rgba(46,125,50,0.2)]" : "bg-[rgba(2,2,2,1)] bg-gradient-to-r from-[rgba(54,129,198,0.2)] to-[rgba(43,74,157,0.2)]",
     [isDone]
   );
-  const border = (0, import_react12.useMemo)(
+  const border = (0, import_react13.useMemo)(
     () => isDone ? "border border-solid border-x_green_dark" : "border border-solid border-x_blue_dark",
     [isDone]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex gap-2", onClick: () => setIsWide((x) => !x), children: [
-    isWide && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex gap-2", onClick: () => setIsWide((x) => !x), children: [
+    isWide && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       "div",
       {
         className: `flex items-center min-w-60 sm:w-[520px] text-white h-14 px-4 text-sm gap-3 rounded-xl ${background} ${border}`,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex justify-between flex-col gap-2 sm:gap-5 sm:flex-row w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex justify-between flex-col gap-2 sm:gap-5 sm:flex-row w-full", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
                 "img",
                 {
                   className: "w-5 h-5",
@@ -2454,26 +2530,32 @@ var TxStatusButton = ({ transaction }) => {
                   alt: "source chain"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { children: fromChain }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-3.5 h-3.5", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ArrowRightIcon, {}) }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("img", { className: "w-5 h-5", src: toChainImage, alt: "to chain" }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { children: toChain })
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: fromChain }),
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "w-3.5 h-3.5", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ArrowRightIcon, {}) }),
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("img", { className: "w-5 h-5", src: toChainImage, alt: "to chain" }),
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: toChain })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { children: "Sent" }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { children: fromAmount }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { children: fromToken }),
-              /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: "Sent" }),
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: fromAmount }),
+              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: fromToken }),
+              fromTokenImage ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
                 "img",
                 {
                   className: "w-5 h-5",
                   src: fromTokenImage,
                   alt: "source token"
                 }
+              ) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+                UnknownTokenLogo,
+                {
+                  tokenName: "?",
+                  className: "token-select__generated-logo"
+                }
               )
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
             "a",
             {
               href: explorer,
@@ -2481,21 +2563,21 @@ var TxStatusButton = ({ transaction }) => {
               rel: "noreferrer",
               className: "no-underline cursor-pointer",
               "aria-label": "Show the transaction in the chain explorer",
-              children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-3.5 h-3.5", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ArrowUpRightIcon, {}) })
+              children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "w-3.5 h-3.5", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ArrowUpRightIcon, {}) })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       "div",
       {
         className: `text-white rounded-xl cursor-pointer ${background} ${border}`,
-        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex gap-2 items-center h-14 w-20 justify-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ArrowLeftIcon, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "relative flex items-center justify-center w-9 h-9", children: isDone ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "text-x_green w-5 h-5", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(CheckIcon, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-5 h-5", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(XSwapLogo, {}) }),
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "absolute flex items-center justify-center top-0 left-0 right-0 bottom-0 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(CircularProgressIcon, {}) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex gap-2 items-center h-14 w-20 justify-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ArrowLeftIcon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "relative flex items-center justify-center w-9 h-9", children: isDone ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "text-x_green w-5 h-5", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CheckIcon, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "w-5 h-5", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(XSwapLogo, {}) }),
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "absolute flex items-center justify-center top-0 left-0 right-0 bottom-0 text-white", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CircularProgressIcon, {}) })
           ] }) })
         ] })
       }
@@ -2522,25 +2604,66 @@ var updateTransactionDoneInRenderedTransactions = (txHash) => {
   }
 };
 var renderTxStatusButtons = () => {
-  const buttons = renderedTransactions.map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TxStatusButton, { transaction: item }, item.txHash));
+  const buttons = renderedTransactions.map((item) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(TxStatusButton, { transaction: item }, item.txHash));
   txStatusRoot.render(buttons);
 };
 
 // src/components/Skeleton/index.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var Skeleton = ({ width, height }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: `bg-current rounded animate-pulse ${width} ${height}` });
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: `bg-current rounded animate-pulse ${width} ${height}` });
 };
 
 // src/services/integrations/monitoring.ts
 var import_async_retry = __toESM(require("async-retry"));
-var monitorTransactionStatus = async (txChainId, txHash) => {
+
+// src/services/blockchain.ts
+var import_ethers5 = require("ethers");
+var getCustomTokenData = async (chain, tokenAddress) => {
+  const rpcUrl = chain.publicRpcUrls[0];
+  const customTokenContract = new import_ethers5.ethers.Contract(
+    tokenAddress.toLowerCase(),
+    ERC20Abi,
+    import_ethers5.ethers.getDefaultProvider(rpcUrl)
+  );
+  try {
+    const query = async (contract, method, args = []) => {
+      if (contract?.provider) {
+        const response = await contract[method](...args);
+        return response;
+      }
+      return null;
+    };
+    const responses = await Promise.all([
+      query(customTokenContract, "decimals"),
+      query(customTokenContract, "name"),
+      query(customTokenContract, "symbol")
+    ]);
+    const [decimals, name, symbol] = responses;
+    return {
+      address: tokenAddress,
+      symbol,
+      name,
+      decimals,
+      quickPick: false,
+      supported: true,
+      priority: 0
+    };
+  } catch (_) {
+    throw new Error(
+      `Provided token ${tokenAddress} does not exists on chain ${chain.displayName}`
+    );
+  }
+};
+
+// src/services/integrations/monitoring.ts
+var renderTxStatus = async (txChainId, txHash) => {
   const txReceipt = await getTxReceipt(txChainId, txHash);
   const supportedChains = (await getChains()).filter(
     ({ web3Environment, swapSupported }) => web3Environment === "mainnet" /* MAINNET */ && swapSupported
   );
   const messageSentEvent = txReceipt.logs?.find((log) => {
-    return log.topics[0] === import_ethers5.ethers.utils.id(MSG_SENT_EVENT_SIG);
+    return log.topics[0] === import_ethers6.ethers.utils.id(MSG_SENT_EVENT_SIG);
   });
   if (!messageSentEvent) {
     throw new Error(
@@ -2548,7 +2671,7 @@ var monitorTransactionStatus = async (txChainId, txHash) => {
     );
   }
   const messageId = messageSentEvent?.topics[1];
-  const iface = new import_ethers5.ethers.utils.Interface(MSG_SENT_EVENT_ABI);
+  const iface = new import_ethers6.ethers.utils.Interface(MSG_SENT_EVENT_ABI);
   const decodedMessageSentEvent = iface.parseLog(messageSentEvent);
   if (!decodedMessageSentEvent) {
     throw new Error(
@@ -2558,9 +2681,16 @@ var monitorTransactionStatus = async (txChainId, txHash) => {
   const srcChain = supportedChains.find(
     (chain) => chain.chainId === txChainId.toString()
   );
-  const srcToken = srcChain?.tokens.find(
+  if (!srcChain) {
+    throw new Error(`Unknown src chain ${txChainId}`);
+  }
+  const tokenAddress = decodedMessageSentEvent.args?.token.toString();
+  let srcToken = srcChain.tokens.find(
     (token) => token.address === decodedMessageSentEvent.args?.token.toString()
   );
+  if (!srcToken) {
+    srcToken = await getCustomTokenData(srcChain, tokenAddress);
+  }
   const dstChain = supportedChains.find(
     (chain) => chain.ccipChainId === decodedMessageSentEvent.args?.destinationChainSelector?.toString()
   );
@@ -2568,19 +2698,20 @@ var monitorTransactionStatus = async (txChainId, txHash) => {
   if (!dstChainId) {
     throw new Error(`Unknown destination chain!`);
   }
+  const tokenAmount = weiToHumanReadable({
+    amount: decodedMessageSentEvent.args?.tokenAmount.toString(),
+    decimals: srcToken?.decimals || 18,
+    precisionFractionalPlaces: 4
+  });
   const transaction = {
     txHash,
-    fromChain: srcChain?.displayName,
-    fromChainImage: srcChain?.image,
-    toChain: dstChain.displayName,
-    toChainImage: dstChain.image,
-    fromToken: srcToken?.symbol,
-    fromTokenImage: srcToken?.image,
-    fromAmount: weiToHumanReadable({
-      amount: decodedMessageSentEvent.args?.tokenAmount.toString(),
-      decimals: srcToken?.decimals || 18,
-      precisionFractionalPlaces: 4
-    }),
+    srcChain: srcChain.displayName,
+    srcChainImage: srcChain.image,
+    dstChain: dstChain.displayName,
+    dstChainImage: dstChain.image,
+    srcToken: srcToken?.symbol,
+    srcTokenImage: srcToken?.image,
+    srcAmount: tokenAmount === "0" ? "<0.0001" : tokenAmount,
     isDone: false,
     explorer: `${CCIP_EXPLORER}/tx/${txHash}`
   };
@@ -2590,16 +2721,16 @@ var monitorTransactionStatus = async (txChainId, txHash) => {
   if (!xSwapRouterOnDestinationAddress) {
     throw new Error(`Unknown destination XSwapRouter!`);
   }
-  const xSwapRouterOnDestination = new import_ethers5.ethers.Contract(
+  const xSwapRouterOnDestination = new import_ethers6.ethers.Contract(
     xSwapRouterOnDestinationAddress,
     MSG_RECEIVED_EVENT_ABI,
-    import_ethers5.ethers.getDefaultProvider(
+    import_ethers6.ethers.getDefaultProvider(
       supportedChains.find((chain) => chain.chainId === dstChainId)?.publicRpcUrls[0]
     )
   );
   const msgReceivedEventFilter = {
     address: xSwapRouterOnDestinationAddress,
-    topics: [import_ethers5.ethers.utils.id(MSG_RECEIVED_EVENT_SIG), messageId]
+    topics: [import_ethers6.ethers.utils.id(MSG_RECEIVED_EVENT_SIG), messageId]
   };
   const onSuccess = async () => {
     updateTransactionDoneInRenderedTransactions(txHash);
@@ -2610,6 +2741,11 @@ var monitorTransactionStatus = async (txChainId, txHash) => {
     removeTransactionFromRenderedTransactions(txHash);
     renderTxStatusButtons();
   };
+  getTxStatus({ transferId: messageId }).then((response) => {
+    if (response.status === "DONE") {
+      onSuccess();
+    }
+  });
   xSwapRouterOnDestination.once(msgReceivedEventFilter, () => onSuccess());
 };
 var getTxReceipt = async (txChainId, txHash) => {
@@ -2617,7 +2753,7 @@ var getTxReceipt = async (txChainId, txHash) => {
     const chain = (await getChains()).find(
       (chain2) => chain2.chainId === txChainId
     );
-    const provider = new import_ethers5.ethers.providers.JsonRpcProvider(
+    const provider = new import_ethers6.ethers.providers.JsonRpcProvider(
       chain?.publicRpcUrls[0]
     );
     return await (0, import_async_retry.default)(async () => {
@@ -2635,7 +2771,8 @@ var getTxReceipt = async (txChainId, txHash) => {
 };
 
 // src/services/integrations/transactions.ts
-var getSwapTx = async ({
+var openTransactionModal = async ({
+  integratorId,
   dstChain,
   dstToken,
   customContractCalls = [],
@@ -2646,6 +2783,7 @@ var getSwapTx = async ({
   );
   validateSwapTxData(supportedChains, dstChain, dstToken);
   const route = await openTxConfigForm({
+    integratorId,
     dstChainId: dstChain,
     dstTokenAddr: dstToken,
     customContractCalls,
@@ -2661,13 +2799,20 @@ var validateSwapTxData = (supportedChains, dstChain, dstToken) => {
   if (!supportedDstChain) {
     throw new Error(`Provided chain '${dstChain}' is not supported`);
   }
-  if (!supportedDstChain.tokens.some(({ address }) => address === dstToken)) {
-    throw new Error(`Provided token '${dstToken}' is not supported`);
+  if (!isETHAddressValid(dstToken)) {
+    throw new Error(
+      `Provided token address ${dstToken} on chain ${dstChain} is not correct`
+    );
   }
 };
 
 // src/index.ts
 initDocument();
+var XPay = {
+  openTransactionModal,
+  renderTxStatus
+};
+var src_default = XPay;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ContractName,
@@ -2675,6 +2820,6 @@ initDocument();
   Environment,
   Web3Environment,
   XSwapCallType,
-  getSwapTx,
-  monitorTransactionStatus
+  openTransactionModal,
+  renderTxStatus
 });