@kimafinance/kima-transaction-widget 1.4.8 → 1.4.9

package/dist/index.cjs

@@ -45,9 +45,10 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/KimaProvider.tsx
-var React49 = __toESM(require("react"), 1);
-var import_react60 = require("react");
+var React50 = __toESM(require("react"), 1);
+var import_react61 = require("react");
 var import_react_redux19 = require("react-redux");
+var import_react_query13 = require("@tanstack/react-query");
 
 // src/store/index.tsx
 var import_toolkit2 = require("@reduxjs/toolkit");
@@ -232,7 +233,7 @@ var Arrow_default = Arrow;
 
 // src/assets/icons/Lock.tsx
 var import_react8 = __toESM(require("react"), 1);
-var Lock = ({ width = 24, height = 27, fill = "none", ...rest }) => {
+var Lock = ({ width = 24, height = 24, fill = "none", ...rest }) => {
   return /* @__PURE__ */ import_react8.default.createElement(
     "svg",
     {
@@ -1480,6 +1481,264 @@ var EURC = ({ width = 100, height = 100, ...rest }) => {
 };
 var EURC_default = EURC;
 
+// src/assets/icons/TransactionComplete.tsx
+var import_react42 = __toESM(require("react"), 1);
+var TransactionComplete = ({ width = 140, height = 120, ...rest }) => {
+  return /* @__PURE__ */ import_react42.default.createElement(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: "0 0 141 116",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...rest
+    },
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        x: "140.724",
+        y: "53.4307",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(90 140.724 53.4307)",
+        fill: "url(#paint0_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        x: "133.009",
+        y: "29.001",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(60 133.009 29.001)",
+        fill: "url(#paint1_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        x: "136.866",
+        y: "78.5039",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(120 136.866 78.5039)",
+        fill: "url(#paint2_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        y: "61.8682",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(-90 0 61.8682)",
+        fill: "url(#paint3_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        x: "7.71472",
+        y: "86.2979",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(-120 7.71472 86.2979)",
+        fill: "url(#paint4_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "rect",
+      {
+        x: "3.85742",
+        y: "36.7959",
+        width: "9.00052",
+        height: "21.8584",
+        rx: "4.50026",
+        transform: "rotate(-60 3.85742 36.7959)",
+        fill: "url(#paint5_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement("g", { filter: "url(#filter0_d_1838_5769)" }, /* @__PURE__ */ import_react42.default.createElement("circle", { cx: "70.3622", cy: "57.9308", r: "37.9308", fill: "white" }), /* @__PURE__ */ import_react42.default.createElement(
+      "circle",
+      {
+        cx: "70.3622",
+        cy: "57.9308",
+        r: "36.0021",
+        stroke: "url(#paint6_linear_1838_5769)",
+        strokeWidth: "3.85736"
+      }
+    )),
+    /* @__PURE__ */ import_react42.default.createElement(
+      "path",
+      {
+        d: "M62.571 74.3906C61.9266 74.3944 61.2878 74.268 60.6912 74.0186C60.0946 73.7691 59.552 73.4017 59.0944 72.9371L49.3011 62.9134C48.3791 61.9697 47.8611 60.6897 47.8611 59.355C47.8611 58.0204 48.3791 56.7404 49.3011 55.7966C50.2232 54.8529 51.4738 54.3227 52.7778 54.3227C54.0817 54.3227 55.3323 54.8529 56.2544 55.7966L62.571 62.312L83.5776 40.7611C84.4997 39.8173 85.7502 39.2871 87.0542 39.2871C88.3582 39.2871 89.6088 39.8173 90.5308 40.7611C91.4529 41.7048 91.9709 42.9848 91.9709 44.3195C91.9709 45.6541 91.4529 46.9341 90.5308 47.8779L66.0476 72.9371C65.5901 73.4017 65.0475 73.7691 64.4509 74.0186C63.8543 74.268 63.2155 74.3944 62.571 74.3906Z",
+        fill: "url(#paint7_linear_1838_5769)"
+      }
+    ),
+    /* @__PURE__ */ import_react42.default.createElement("defs", null, /* @__PURE__ */ import_react42.default.createElement(
+      "filter",
+      {
+        id: "filter0_d_1838_5769",
+        x: "13.1446",
+        y: "0.713175",
+        width: "114.435",
+        height: "114.435",
+        filterUnits: "userSpaceOnUse",
+        colorInterpolationFilters: "sRGB"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+      /* @__PURE__ */ import_react42.default.createElement(
+        "feColorMatrix",
+        {
+          in: "SourceAlpha",
+          type: "matrix",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
+          result: "hardAlpha"
+        }
+      ),
+      /* @__PURE__ */ import_react42.default.createElement("feOffset", null),
+      /* @__PURE__ */ import_react42.default.createElement("feGaussianBlur", { stdDeviation: "9.64341" }),
+      /* @__PURE__ */ import_react42.default.createElement("feComposite", { in2: "hardAlpha", operator: "out" }),
+      /* @__PURE__ */ import_react42.default.createElement(
+        "feColorMatrix",
+        {
+          type: "matrix",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"
+        }
+      ),
+      /* @__PURE__ */ import_react42.default.createElement(
+        "feBlend",
+        {
+          mode: "normal",
+          in2: "BackgroundImageFix",
+          result: "effect1_dropShadow_1838_5769"
+        }
+      ),
+      /* @__PURE__ */ import_react42.default.createElement(
+        "feBlend",
+        {
+          mode: "normal",
+          in: "SourceGraphic",
+          in2: "effect1_dropShadow_1838_5769",
+          result: "shape"
+        }
+      )
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint0_linear_1838_5769",
+        x1: "140.724",
+        y1: "64.3599",
+        x2: "149.724",
+        y2: "64.3599",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint1_linear_1838_5769",
+        x1: "133.009",
+        y1: "39.9302",
+        x2: "142.009",
+        y2: "39.9302",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint2_linear_1838_5769",
+        x1: "136.866",
+        y1: "89.4331",
+        x2: "145.867",
+        y2: "89.4331",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint3_linear_1838_5769",
+        x1: "0",
+        y1: "72.7974",
+        x2: "9.00052",
+        y2: "72.7974",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint4_linear_1838_5769",
+        x1: "7.71472",
+        y1: "97.2271",
+        x2: "16.7152",
+        y2: "97.2271",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint5_linear_1838_5769",
+        x1: "3.85742",
+        y1: "47.7251",
+        x2: "12.8579",
+        y2: "47.7251",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint6_linear_1838_5769",
+        x1: "32.4314",
+        y1: "57.9308",
+        x2: "108.293",
+        y2: "57.9308",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ import_react42.default.createElement(
+      "linearGradient",
+      {
+        id: "paint7_linear_1838_5769",
+        x1: "47.8611",
+        y1: "56.8389",
+        x2: "91.9709",
+        y2: "56.8389",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ import_react42.default.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ import_react42.default.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ))
+  );
+};
+var TransactionComplete_default = TransactionComplete;
+
 // src/utils/constants.tsx
 var import_networks = require("@reown/appkit/networks");
 var ChainName = /* @__PURE__ */ ((ChainName2) => {
@@ -1670,11 +1929,11 @@ var ColorModeOptions = /* @__PURE__ */ ((ColorModeOptions2) => {
   ColorModeOptions2["dark"] = "dark";
   return ColorModeOptions2;
 })(ColorModeOptions || {});
-var DAppOptions = /* @__PURE__ */ ((DAppOptions2) => {
-  DAppOptions2["None"] = "none";
-  DAppOptions2["LPAdd"] = "LPAdd";
-  DAppOptions2["LPDrain"] = "LPDrain";
-  return DAppOptions2;
+var DAppOptions = /* @__PURE__ */ ((DAppOptions3) => {
+  DAppOptions3["None"] = "none";
+  DAppOptions3["LPAdd"] = "LPAdd";
+  DAppOptions3["LPDrain"] = "LPDrain";
+  return DAppOptions3;
 })(DAppOptions || {});
 
 // src/store/optionSlice.tsx
@@ -2121,9 +2380,6 @@ var getAllPlugins = () => {
   return pluginRegistry;
 };
 
-// src/KimaProvider.tsx
-var import_react_query13 = require("@tanstack/react-query");
-
 // src/hooks/useGetEnvOptions.tsx
 var import_react_query = require("@tanstack/react-query");
 
@@ -2195,7 +2451,7 @@ var useGetEnvOptions = ({
 };
 
 // plugins/evm/index.tsx
-var import_react49 = __toESM(require("react"), 1);
+var import_react50 = __toESM(require("react"), 1);
 
 // plugins/PluginBase.ts
 var PluginBase = class {
@@ -2232,10 +2488,10 @@ var PluginBase = class {
 };
 
 // plugins/evm/features/walletConnect/WalletProvider.tsx
-var import_react43 = __toESM(require("react"), 1);
+var import_react44 = __toESM(require("react"), 1);
 
 // plugins/evm/config/modalConfig.ts
-var import_react42 = require("@reown/appkit/react");
+var import_react43 = require("@reown/appkit/react");
 var import_networks2 = require("@reown/appkit/networks");
 var import_appkit_adapter_ethers = require("@reown/appkit-adapter-ethers");
 var appkitMainnetChains = [
@@ -2272,7 +2528,7 @@ var setupAppKit = (projectId, networkOption) => {
     return appKitModel;
   }
   const networks = networkOption === "mainnet" /* mainnet */ ? appkitMainnetChains : appkitTestnetChains;
-  appKitModel = (0, import_react42.createAppKit)({
+  appKitModel = (0, import_react43.createAppKit)({
     adapters: [new import_appkit_adapter_ethers.EthersAdapter()],
     metadata,
     networks,
@@ -2298,17 +2554,17 @@ var WalletProvider = ({
   walletConnectProjectId,
   isLoading
 }) => {
-  const [isReady, setIsReady] = (0, import_react43.useState)(false);
-  (0, import_react43.useEffect)(() => {
+  const [isReady, setIsReady] = (0, import_react44.useState)(false);
+  (0, import_react44.useEffect)(() => {
     if (!isLoading && networkOption) {
       setupAppKit(walletConnectProjectId, networkOption);
       setIsReady(true);
     }
   }, [networkOption, isLoading, walletConnectProjectId]);
   if (!isReady) {
-    return /* @__PURE__ */ import_react43.default.createElement(import_react43.default.Fragment, null);
+    return /* @__PURE__ */ import_react44.default.createElement(import_react44.default.Fragment, null);
   }
-  return /* @__PURE__ */ import_react43.default.createElement(import_react43.default.Fragment, null, children);
+  return /* @__PURE__ */ import_react44.default.createElement(import_react44.default.Fragment, null, children);
 };
 var WalletProvider_default = WalletProvider;
 
@@ -2352,12 +2608,12 @@ var selectCCTransactionStatus = (state) => state.option.ccTransactionStatus;
 var selectCCTransactionRetrying = (state) => state.option.ccTransactionRetrying;
 
 // plugins/evm/core/hooks/useEvmProvider.ts
-var import_react44 = require("@reown/appkit/react");
+var import_react45 = require("@reown/appkit/react");
 var import_ethers = require("ethers");
 var useEvmProvider = () => {
   const { externalProvider } = useKimaContext();
-  const { walletProvider: appkitProvider } = (0, import_react44.useAppKitProvider)("eip155");
-  const appkitAccountInfo = (0, import_react44.useAppKitAccount)();
+  const { walletProvider: appkitProvider } = (0, import_react45.useAppKitProvider)("eip155");
+  const appkitAccountInfo = (0, import_react45.useAppKitAccount)();
   const walletAddress = externalProvider?.signer instanceof import_ethers.JsonRpcSigner && externalProvider.signer.address || appkitAccountInfo?.address;
   const walletProvider = externalProvider?.provider instanceof import_ethers.BrowserProvider ? externalProvider.provider : appkitProvider;
   return {
@@ -2591,7 +2847,7 @@ function useBalance() {
 
 // plugins/evm/core/hooks/useNativeBalance.ts
 var import_react_query4 = require("@tanstack/react-query");
-var import_react45 = require("@reown/appkit/react");
+var import_react46 = require("@reown/appkit/react");
 
 // plugins/evm/utils/getBalance.ts
 var import_ethers3 = require("ethers");
@@ -2625,9 +2881,9 @@ var getEvmBalance = async (input) => {
 var import_react_redux2 = require("react-redux");
 var useNativeEvmBalance = () => {
   const { externalProvider } = useKimaContext();
-  const appkitAccountInfo = (0, import_react45.useAppKitAccount)();
+  const appkitAccountInfo = (0, import_react46.useAppKitAccount)();
   const { address: appkitAddress } = appkitAccountInfo || {};
-  const { walletProvider } = (0, import_react45.useAppKitProvider)("eip155");
+  const { walletProvider } = (0, import_react46.useAppKitProvider)("eip155");
   const sourceChain = (0, import_react_redux2.useSelector)(selectSourceChain);
   const networkOption = (0, import_react_redux2.useSelector)(selectNetworkOption);
   const walletAddress = externalProvider?.signer?.address || appkitAddress;
@@ -2658,9 +2914,9 @@ var useNativeEvmBalance = () => {
 var useNativeBalance_default = useNativeEvmBalance;
 
 // plugins/evm/core/hooks/useIsWalletReady.tsx
-var import_react46 = require("react");
+var import_react47 = require("react");
 var import_react_redux4 = require("react-redux");
-var import_react47 = require("@reown/appkit/react");
+var import_react48 = require("@reown/appkit/react");
 
 // plugins/evm/utils/switchNetworkEthers.tsx
 var import_ethers4 = require("ethers");
@@ -2768,16 +3024,16 @@ function useIsWalletReady() {
   const backendUrl = (0, import_react_redux4.useSelector)(selectBackendUrl);
   const mode = (0, import_react_redux4.useSelector)(selectMode);
   const { data: chains } = useChainData(backendUrl);
-  const { walletProvider: appkitProvider } = (0, import_react47.useAppKitProvider)("eip155");
-  const appkitAccountInfo = (0, import_react47.useAppKitAccount)();
-  const { chainId: walletChainId } = (0, import_react47.useAppKitNetwork)();
+  const { walletProvider: appkitProvider } = (0, import_react48.useAppKitProvider)("eip155");
+  const appkitAccountInfo = (0, import_react48.useAppKitAccount)();
+  const { chainId: walletChainId } = (0, import_react48.useAppKitNetwork)();
   const { address: walletAddress, isConnected: appkitIsConnected } = appkitAccountInfo || {};
   const isConnected = appkitIsConnected && walletAddress !== void 0;
   const sourceChain = (0, import_react_redux4.useSelector)(selectSourceChain);
-  const [isReady, setIsReady] = (0, import_react46.useState)(false);
-  const [statusMessage, setStatusMessage] = (0, import_react46.useState)("Wallet not connected");
-  const [connectedAddress, setConnectedAddress] = (0, import_react46.useState)("");
-  const switchNetwork = (0, import_react46.useCallback)(async () => {
+  const [isReady, setIsReady] = (0, import_react47.useState)(false);
+  const [statusMessage, setStatusMessage] = (0, import_react47.useState)("Wallet not connected");
+  const [connectedAddress, setConnectedAddress] = (0, import_react47.useState)("");
+  const switchNetwork = (0, import_react47.useCallback)(async () => {
     if (!sourceChain || !appKitModel) return;
     if (sourceChain.compatibility !== "EVM" /* EVM */) return;
     logger_default.debug("useIsWalletReady:EVM:Attempting to switch network...", {
@@ -2796,7 +3052,7 @@ function useIsWalletReady() {
       logger_default.warn("useIsWalletReady:EVM:Network switch failed:", e);
     }
   }, [appkitProvider, sourceChain]);
-  (0, import_react46.useEffect)(() => {
+  (0, import_react47.useEffect)(() => {
     const resolveConnection = async () => {
       if (mode === "light" /* light */) {
         const demoAddress = lightDemoAccounts.EVM;
@@ -2885,12 +3141,13 @@ function useEvmAllowance() {
   const sourceChain = (0, import_react_redux5.useSelector)(selectSourceChain);
   const sourceAddress = (0, import_react_redux5.useSelector)(selectSourceAddress);
   const networkOption = (0, import_react_redux5.useSelector)(selectNetworkOption);
+  const dAppOption = (0, import_react_redux5.useSelector)(selectDappOption);
   const { transactionValues } = (0, import_react_redux5.useSelector)(selectServiceFee);
   const selectedCoin = (0, import_react_redux5.useSelector)(selectSourceCurrency);
   const tokenOptions = (0, import_react_redux5.useSelector)(selectTokenOptions);
   const backendUrl = (0, import_react_redux5.useSelector)(selectBackendUrl);
   const feeDeduct = (0, import_react_redux5.useSelector)(selectFeeDeduct);
-  const txValues = feeDeduct ? transactionValues.feeFromTarget : transactionValues.feeFromOrigin;
+  const txValues = feeDeduct || dAppOption !== "none" /* None */ ? transactionValues.feeFromTarget : transactionValues.feeFromOrigin;
   const allowanceNumber = BigInt(txValues.allowanceAmount.value);
   const { pools } = useGetPools_default(backendUrl, networkOption);
   const { walletProvider, walletAddress } = useEvmProvider();
@@ -2989,10 +3246,12 @@ function useEvmAllowance() {
 }
 
 // plugins/evm/core/hooks/useDisconnectWallet.tsx
-var import_react48 = require("@reown/appkit/react");
+var import_react49 = require("@reown/appkit/react");
 function useDisconnectWallet() {
-  const { disconnect } = (0, import_react48.useDisconnect)();
-  return { disconnectWallet: disconnect };
+  const { disconnect } = (0, import_react49.useDisconnect)();
+  return {
+    disconnectWallet: disconnect
+  };
 }
 var useDisconnectWallet_default = useDisconnectWallet;
 
@@ -3019,7 +3278,7 @@ var EvmPlugin = class extends PluginBase {
     walletConnectProjectId,
     isLoading
   }) => {
-    return /* @__PURE__ */ import_react49.default.createElement(
+    return /* @__PURE__ */ import_react50.default.createElement(
       WalletProvider_default,
       {
         children,
@@ -3035,10 +3294,10 @@ var evmPlugin = new EvmPlugin(store);
 var evm_default = evmPlugin;
 
 // plugins/solana/index.tsx
-var import_react52 = __toESM(require("react"), 1);
+var import_react53 = __toESM(require("react"), 1);
 
 // plugins/solana/features/walletConnect/WalletProvider.tsx
-var import_react50 = __toESM(require("react"), 1);
+var import_react51 = __toESM(require("react"), 1);
 var import_wallet_adapter_react = require("@solana/wallet-adapter-react");
 var import_wallet_adapter_wallets = require("@solana/wallet-adapter-wallets");
 
@@ -3066,7 +3325,7 @@ var WalletProvider2 = ({
   logger_default.debug(
     `WalletProvider initialized with projectId: ${walletConnectProjectId}`
   );
-  return /* @__PURE__ */ import_react50.default.createElement(import_wallet_adapter_react.ConnectionProvider, { endpoint }, /* @__PURE__ */ import_react50.default.createElement(
+  return /* @__PURE__ */ import_react51.default.createElement(import_wallet_adapter_react.ConnectionProvider, { endpoint }, /* @__PURE__ */ import_react51.default.createElement(
     import_wallet_adapter_react.WalletProvider,
     {
       autoConnect: false,
@@ -3133,10 +3392,12 @@ var import_react_redux9 = require("react-redux");
 
 // plugins/solana/core/hooks/useBalance.tsx
 var import_react_redux8 = require("react-redux");
+var import_react_query8 = require("@tanstack/react-query");
+var import_web38 = require("@solana/web3.js");
 
 // plugins/solana/utils/getTokenAllowance.tsx
-var import_spl_token = require("@solana/spl-token");
 var import_web36 = require("@solana/web3.js");
+var import_spl_token = require("@solana/spl-token");
 var getTokenAllowance2 = async ({
   tokenOptions,
   selectedCoin,
@@ -3177,9 +3438,6 @@ var getTokenAllowance2 = async ({
   }
 };
 
-// plugins/solana/core/hooks/useBalance.tsx
-var import_react_query8 = require("@tanstack/react-query");
-
 // plugins/solana/core/hooks/useSolanaProvider.ts
 var import_react_redux7 = require("react-redux");
 var import_wallet_adapter_react3 = require("@solana/wallet-adapter-react");
@@ -3207,7 +3465,6 @@ var useSolanaProvider = () => {
 };
 
 // plugins/solana/core/hooks/useBalance.tsx
-var import_web38 = require("@solana/web3.js");
 var emptyResult2 = {};
 function useBalance2() {
   const sourceChain = (0, import_react_redux8.useSelector)(selectSourceChain);
@@ -3342,7 +3599,7 @@ function useSolanaAllowance() {
 }
 
 // plugins/solana/core/hooks/useIsWalletReady.tsx
-var import_react51 = require("react");
+var import_react52 = require("react");
 var import_wallet_adapter_react4 = require("@solana/wallet-adapter-react");
 var import_react_redux10 = require("react-redux");
 var import_react_redux11 = require("react-redux");
@@ -3357,7 +3614,7 @@ function useIsWalletReady2() {
   const { externalProvider } = useKimaContext();
   const { publicKey: solanaAddress } = (0, import_wallet_adapter_react4.useWallet)();
   const sourceChain = (0, import_react_redux10.useSelector)(selectSourceChain);
-  (0, import_react51.useEffect)(() => {
+  (0, import_react52.useEffect)(() => {
     if (sourceChain.shortName !== "SOL") return;
     if (mode === "light" /* light */) {
       dispatch(setSourceAddress(lightDemoAccounts.SOL));
@@ -3365,7 +3622,7 @@ function useIsWalletReady2() {
     }
     solanaAddress && dispatch(setSourceAddress(solanaAddress.toBase58()));
   }, [mode, solanaAddress, sourceChain]);
-  return (0, import_react51.useMemo)(() => {
+  return (0, import_react52.useMemo)(() => {
     if (mode === "light" /* light */)
       return createWalletStatus(
         true,
@@ -3419,7 +3676,7 @@ var SolanaPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ import_react52.default.createElement(
+    return /* @__PURE__ */ import_react53.default.createElement(
       WalletProvider_default2,
       {
         networkOption,
@@ -3433,10 +3690,10 @@ var solanaPlugin = new SolanaPlugin(store);
 var solana_default = solanaPlugin;
 
 // plugins/tron/index.tsx
-var import_react57 = __toESM(require("react"), 1);
+var import_react58 = __toESM(require("react"), 1);
 
 // plugins/tron/features/walletConnect/WalletProvider.tsx
-var import_react53 = __toESM(require("react"), 1);
+var import_react54 = __toESM(require("react"), 1);
 var import_tronwallet_adapter_react_hooks = require("@tronweb3/tronwallet-adapter-react-hooks");
 var import_tronwallet_adapter_ledger = require("@tronweb3/tronwallet-adapter-ledger");
 var import_tronwallet_adapter_tronlink = require("@tronweb3/tronwallet-adapter-tronlink");
@@ -3445,7 +3702,7 @@ var import_tronwallet_adapter_tokenpocket = require("@tronweb3/tronwallet-adapte
 var import_tronwallet_abstract_adapter = require("@tronweb3/tronwallet-abstract-adapter");
 var import_react_hot_toast = require("react-hot-toast");
 var WalletProvider3 = ({ children, networkOption }) => {
-  const adapters = (0, import_react53.useMemo)(
+  const adapters = (0, import_react54.useMemo)(
     () => [
       new import_tronwallet_adapter_tronlink.TronLinkAdapter(),
       new import_tronwallet_adapter_ledger.LedgerAdapter({ accountNumber: 2 }),
@@ -3475,7 +3732,7 @@ var WalletProvider3 = ({ children, networkOption }) => {
       adapters[0].switchChain("0x2b6653dc");
     }
   };
-  return /* @__PURE__ */ import_react53.default.createElement(
+  return /* @__PURE__ */ import_react54.default.createElement(
     import_tronwallet_adapter_react_hooks.WalletProvider,
     {
       adapters,
@@ -3489,7 +3746,7 @@ var WalletProvider3 = ({ children, networkOption }) => {
 var WalletProvider_default3 = WalletProvider3;
 
 // plugins/tron/core/hooks/useGetTrxBalance.tsx
-var import_react54 = require("react");
+var import_react55 = require("react");
 var import_react_redux12 = require("react-redux");
 var import_react_query10 = require("@tanstack/react-query");
 
@@ -3528,7 +3785,7 @@ function useGetTronBalance() {
   const networkOption = (0, import_react_redux12.useSelector)(selectNetworkOption);
   const { wallet } = (0, import_tronwallet_adapter_react_hooks2.useWallet)();
   const sourceNetwork = (0, import_react_redux12.useSelector)(selectSourceChain);
-  const tronWeb = (0, import_react54.useMemo)(
+  const tronWeb = (0, import_react55.useMemo)(
     () => networkOption === "testnet" /* testnet */ ? tronWebTestnet : tronWebMainnet,
     [networkOption]
   );
@@ -3557,7 +3814,7 @@ var import_react_query12 = require("@tanstack/react-query");
 var import_react_redux13 = require("react-redux");
 var import_tronweb4 = require("tronweb");
 var import_tronwallet_adapter_react_hooks3 = require("@tronweb3/tronwallet-adapter-react-hooks");
-var import_react55 = require("react");
+var import_react56 = require("react");
 var useTronProvider = () => {
   const { externalProvider } = useKimaContext();
   const networkOption = (0, import_react_redux13.useSelector)(selectNetworkOption);
@@ -3568,7 +3825,7 @@ var useTronProvider = () => {
     signMessage: internalSignMessage
   } = (0, import_tronwallet_adapter_react_hooks3.useWallet)();
   const isTronProvider2 = sourceChain.shortName === "TRX" && externalProvider?.type === "tron" && externalProvider.provider.tronWeb instanceof import_tronweb4.TronWeb && typeof externalProvider.signer === "string";
-  const tronWeb = (0, import_react55.useMemo)(() => {
+  const tronWeb = (0, import_react56.useMemo)(() => {
     if (isTronProvider2)
       return externalProvider.provider.tronWeb;
     return networkOption === "mainnet" ? tronWebMainnet : tronWebTestnet;
@@ -3587,6 +3844,7 @@ var useTronProvider = () => {
 
 // plugins/tron/core/hooks/useBalance.tsx
 var import_react_redux14 = require("react-redux");
+var import_react_query11 = require("@tanstack/react-query");
 
 // plugins/tron/utils/ethereum/erc20ABI.json
 var erc20ABI_default = {
@@ -3843,7 +4101,6 @@ var getTokenAllowance3 = async ({
 };
 
 // plugins/tron/core/hooks/useBalance.tsx
-var import_react_query11 = require("@tanstack/react-query");
 var emptyResult3 = {};
 function useBalance3() {
   const mode = (0, import_react_redux14.useSelector)(selectMode);
@@ -3956,7 +4213,7 @@ function useTronAllowance() {
 }
 
 // plugins/tron/core/hooks/useIsWalletReady.tsx
-var import_react56 = require("react");
+var import_react57 = require("react");
 var import_tronwallet_adapter_react_hooks4 = require("@tronweb3/tronwallet-adapter-react-hooks");
 var import_react_redux16 = require("react-redux");
 var import_react_redux17 = require("react-redux");
@@ -3971,7 +4228,7 @@ function useIsWalletReady3() {
   const sourceChain = (0, import_react_redux17.useSelector)(selectSourceChain);
   const { externalProvider } = useKimaContext();
   const { address: internalTronAddress } = (0, import_tronwallet_adapter_react_hooks4.useWallet)();
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     if (sourceChain.shortName !== "TRX") return;
     if (mode === "light" /* light */) {
       dispatch(setSourceAddress(lightDemoAccounts.TRX));
@@ -3979,7 +4236,7 @@ function useIsWalletReady3() {
     }
     internalTronAddress && dispatch(setSourceAddress(internalTronAddress));
   }, [mode, internalTronAddress, sourceChain]);
-  return (0, import_react56.useMemo)(() => {
+  return (0, import_react57.useMemo)(() => {
     if (mode === "light" /* light */)
       return createWalletStatus2(
         true,
@@ -4033,7 +4290,7 @@ var TronPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ import_react57.default.createElement(
+    return /* @__PURE__ */ import_react58.default.createElement(
       WalletProvider_default3,
       {
         networkOption,
@@ -4047,16 +4304,16 @@ var tronPlugin = new TronPlugin(store);
 var tron_default = tronPlugin;
 
 // plugins/credit-card/index.tsx
-var import_react59 = __toESM(require("react"), 1);
+var import_react60 = __toESM(require("react"), 1);
 
 // plugins/credit-card/core/hooks/useIsProviderReady.tsx
 var import_react_redux18 = require("react-redux");
-var import_react58 = require("react");
+var import_react59 = require("react");
 var useIsProviderReady = () => {
-  const [isReady, setIsReady] = (0, import_react58.useState)(false);
+  const [isReady, setIsReady] = (0, import_react59.useState)(false);
   const dispatch = (0, import_react_redux18.useDispatch)();
   const sourceChain = (0, import_react_redux18.useSelector)(selectSourceChain);
-  (0, import_react58.useEffect)(() => {
+  (0, import_react59.useEffect)(() => {
     if (!sourceChain || sourceChain.shortName !== "CC") return;
     logger_default.debug("CC:useIsProviderReady: dispatching changes from fiat...");
     dispatch(setSourceAddress(""));
@@ -4103,7 +4360,7 @@ var CreditCardPlugin = class extends PluginBase {
     return chain.compatibility === "CC";
   };
   Provider = ({ children }) => {
-    return /* @__PURE__ */ import_react59.default.createElement(import_react59.default.Fragment, null, children);
+    return /* @__PURE__ */ import_react60.default.createElement(import_react60.default.Fragment, null, children);
   };
 };
 var creditCardPlugin = new CreditCardPlugin(store);
@@ -4116,15 +4373,15 @@ initializePlugins([evm_default, solana_default, tron_default, credit_card_defaul
 var import_web310 = require("@solana/web3.js");
 var import_ethers5 = require("ethers");
 var queryClient = new import_react_query13.QueryClient();
-var KimaContext = (0, import_react60.createContext)(void 0);
+var KimaContext = (0, import_react61.createContext)(void 0);
 var useKimaContext = () => {
-  const context = (0, import_react60.useContext)(KimaContext);
+  const context = (0, import_react61.useContext)(KimaContext);
   if (!context) {
     throw new Error("useKimaContext must be used within a KimaProvider");
   }
   return context;
 };
-var InternalKimaProvider = React49.memo(
+var InternalKimaProvider = React50.memo(
   ({ kimaBackendUrl, walletConnectProjectId, children, logLevel }) => {
     const { data: envOptions, isLoading } = useGetEnvOptions({
       kimaBackendUrl
@@ -4133,12 +4390,12 @@ var InternalKimaProvider = React49.memo(
     logger_default.debug("internalkimaprovider: isLoading: ", isLoading);
     const plugins = (0, import_react_redux19.useSelector)(selectAllPlugins, (prev, next) => prev === next);
     logger_default.debug("Registered Plugins:", plugins);
-    const WrappedProviders = (0, import_react60.useMemo)(() => {
+    const WrappedProviders = (0, import_react61.useMemo)(() => {
       return plugins.reduce((acc, pluginData) => {
         const plugin = getPluginProvider(pluginData.id);
         if (plugin) {
           const { Provider: Provider3 } = plugin;
-          return /* @__PURE__ */ React49.createElement(
+          return /* @__PURE__ */ React50.createElement(
             Provider3,
             {
               key: plugin.data.id,
@@ -4152,12 +4409,12 @@ var InternalKimaProvider = React49.memo(
         return acc;
       }, children);
     }, [plugins, walletConnectProjectId, envOptions, isLoading]);
-    return /* @__PURE__ */ React49.createElement(React49.Fragment, null, WrappedProviders);
+    return /* @__PURE__ */ React50.createElement(React50.Fragment, null, WrappedProviders);
   }
 );
 var KimaProvider = ({
   walletConnectProjectId,
-  children = /* @__PURE__ */ React49.createElement(React49.Fragment, null),
+  children = /* @__PURE__ */ React50.createElement(React50.Fragment, null),
   externalProvider,
   kimaBackendUrl = "http://localhost:3001",
   logLevel,
@@ -4192,7 +4449,7 @@ var KimaProvider = ({
     errorHandler,
     switchChainHandler
   };
-  return /* @__PURE__ */ React49.createElement(import_react_query13.QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React49.createElement(import_react_redux19.Provider, { store }, /* @__PURE__ */ React49.createElement(KimaContext.Provider, { value: kimaContext }, /* @__PURE__ */ React49.createElement(
+  return /* @__PURE__ */ React50.createElement(import_react_query13.QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React50.createElement(import_react_redux19.Provider, { store }, /* @__PURE__ */ React50.createElement(KimaContext.Provider, { value: kimaContext }, /* @__PURE__ */ React50.createElement(
     InternalKimaProvider,
     {
       kimaBackendUrl,
@@ -4211,10 +4468,10 @@ var import_react106 = __toESM(require("react"), 1);
 var import_react_redux58 = require("react-redux");
 
 // src/components/TransactionWidget.tsx
-var import_react90 = __toESM(require("react"), 1);
+var import_react91 = __toESM(require("react"), 1);
 
 // src/components/reusable/Progressbar.tsx
-var import_react61 = __toESM(require("react"), 1);
+var import_react62 = __toESM(require("react"), 1);
 var import_react_redux20 = require("react-redux");
 var stepInfo = [
   {
@@ -4235,12 +4492,12 @@ var stepInfo = [
 ];
 var Progressbar = ({ step, errorStep, setFocus, loadingStep }) => {
   const theme = (0, import_react_redux20.useSelector)(selectTheme);
-  return /* @__PURE__ */ import_react61.default.createElement("div", { className: "kima-progressbar" }, /* @__PURE__ */ import_react61.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement("div", { className: "kima-progressbar" }, /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       className: `value step-${step * 100 / 4}`
     }
-  ), /* @__PURE__ */ import_react61.default.createElement("div", { className: "step-indicators" }, stepInfo.map((item, index) => /* @__PURE__ */ import_react61.default.createElement(
+  ), /* @__PURE__ */ import_react62.default.createElement("div", { className: "step-indicators" }, stepInfo.map((item, index) => /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       key: item.title,
@@ -4251,14 +4508,14 @@ var Progressbar = ({ step, errorStep, setFocus, loadingStep }) => {
         if (index < 4) setFocus(index);
       }
     },
-    /* @__PURE__ */ import_react61.default.createElement("div", { className: "step-info" }, step < index && /* @__PURE__ */ import_react61.default.createElement(Lock_default, null), step >= index ? index === loadingStep ? /* @__PURE__ */ import_react61.default.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ import_react61.default.createElement(Warning_default, null) : /* @__PURE__ */ import_react61.default.createElement(Check_default, null) : null, /* @__PURE__ */ import_react61.default.createElement("span", null, item.title))
+    /* @__PURE__ */ import_react62.default.createElement("div", { className: "step-info" }, step < index && /* @__PURE__ */ import_react62.default.createElement(Lock_default, null), step >= index ? index === loadingStep ? /* @__PURE__ */ import_react62.default.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ import_react62.default.createElement(Warning_default, null) : /* @__PURE__ */ import_react62.default.createElement(Check_default, null) : null, /* @__PURE__ */ import_react62.default.createElement("span", null, item.title))
   ))));
 };
 var Progressbar_default = Progressbar;
 
 // src/components/reusable/ExternalLink.tsx
-var import_react62 = __toESM(require("react"), 1);
-var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ import_react62.default.createElement(
+var import_react63 = __toESM(require("react"), 1);
+var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ import_react63.default.createElement(
   "a",
   {
     className,
@@ -4272,20 +4529,20 @@ var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ import
 var ExternalLink_default = ExternalLink;
 
 // src/components/reusable/NetworkLabel.tsx
-var import_react63 = __toESM(require("react"), 1);
+var import_react64 = __toESM(require("react"), 1);
 var import_react_redux21 = require("react-redux");
 
 // src/components/reusable/PrimaryButton.tsx
-var import_react66 = __toESM(require("react"), 1);
+var import_react67 = __toESM(require("react"), 1);
 
 // src/assets/loading/180-ring.tsx
-var import_react64 = __toESM(require("react"), 1);
+var import_react65 = __toESM(require("react"), 1);
 var Loading180Ring = ({
   width = 24,
   height = 24,
   fill = "white"
 }) => {
-  return /* @__PURE__ */ import_react64.default.createElement(
+  return /* @__PURE__ */ import_react65.default.createElement(
     "svg",
     {
       width,
@@ -4294,7 +4551,7 @@ var Loading180Ring = ({
       viewBox: "0 0 24 24",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ import_react64.default.createElement("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z" }, /* @__PURE__ */ import_react64.default.createElement(
+    /* @__PURE__ */ import_react65.default.createElement("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z" }, /* @__PURE__ */ import_react65.default.createElement(
       "animateTransform",
       {
         attributeName: "transform",
@@ -4309,7 +4566,7 @@ var Loading180Ring = ({
 var ring_default = Loading180Ring;
 
 // src/assets/loading/6-dots-scale.tsx
-var import_react65 = __toESM(require("react"), 1);
+var import_react66 = __toESM(require("react"), 1);
 
 // src/components/reusable/PrimaryButton.tsx
 var PrimaryButton = ({
@@ -4320,7 +4577,7 @@ var PrimaryButton = ({
   disabled = false,
   ref
 }) => {
-  return /* @__PURE__ */ import_react66.default.createElement("div", { className: "primary-button-wrapper" }, /* @__PURE__ */ import_react66.default.createElement(
+  return /* @__PURE__ */ import_react67.default.createElement("div", { className: "primary-button-wrapper" }, /* @__PURE__ */ import_react67.default.createElement(
     "button",
     {
       className: `primary-button ${className}`,
@@ -4328,14 +4585,14 @@ var PrimaryButton = ({
       ref,
       disabled
     },
-    isLoading && /* @__PURE__ */ import_react66.default.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ import_react66.default.createElement(ring_default, { width: 24, height: 24, fill: "white" })),
+    isLoading && /* @__PURE__ */ import_react67.default.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ import_react67.default.createElement(ring_default, { width: 24, height: 24, fill: "white" })),
     children
   ));
 };
 var PrimaryButton_default = PrimaryButton;
 
 // src/components/reusable/SecondaryButton.tsx
-var import_react67 = __toESM(require("react"), 1);
+var import_react68 = __toESM(require("react"), 1);
 var SecondaryButton = ({
   className,
   clickHandler,
@@ -4344,7 +4601,7 @@ var SecondaryButton = ({
   style,
   disabled = false,
   isLoading
-}) => /* @__PURE__ */ import_react67.default.createElement(
+}) => /* @__PURE__ */ import_react68.default.createElement(
   "button",
   {
     className: `secondary-button ${className} ${theme}`,
@@ -4352,26 +4609,26 @@ var SecondaryButton = ({
     ...style,
     disabled
   },
-  isLoading && /* @__PURE__ */ import_react67.default.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ import_react67.default.createElement(ring_default, { width: 24, height: 24, fill: "black" })),
+  isLoading && /* @__PURE__ */ import_react68.default.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ import_react68.default.createElement(ring_default, { width: 24, height: 24, fill: "black" })),
   children
 );
 var SecondaryButton_default = SecondaryButton;
 
 // src/components/reusable/Dropdown.tsx
-var import_react68 = __toESM(require("react"), 1);
+var import_react69 = __toESM(require("react"), 1);
 var import_react_redux22 = require("react-redux");
 var import_react_redux23 = require("react-redux");
 
 // src/components/reusable/WalletButton.tsx
-var import_react74 = __toESM(require("react"), 1);
+var import_react75 = __toESM(require("react"), 1);
 var import_react_redux25 = require("react-redux");
 
 // src/hooks/useGetCurrentPlugin.tsx
-var import_react70 = require("react");
+var import_react71 = require("react");
 var import_react_redux24 = require("react-redux");
 
 // plugins/default/index.tsx
-var import_react69 = __toESM(require("react"), 1);
+var import_react70 = __toESM(require("react"), 1);
 var DefaultPlugin = class extends PluginBase {
   constructor(store2) {
     super({
@@ -4406,7 +4663,7 @@ var DefaultPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ import_react69.default.createElement("div", null, children);
+    return /* @__PURE__ */ import_react70.default.createElement("div", null, children);
   };
 };
 var defaultPlugin = new DefaultPlugin(store);
@@ -4414,10 +4671,10 @@ var default_default = defaultPlugin;
 
 // src/hooks/useGetCurrentPlugin.tsx
 var useGetCurrentPlugin = () => {
-  const [currentPlugin, setCurrentPlugin] = (0, import_react70.useState)(default_default);
+  const [currentPlugin, setCurrentPlugin] = (0, import_react71.useState)(default_default);
   const isIndexed = (0, import_react_redux24.useSelector)(selectPluginIsIndexed);
   const sourceChain = (0, import_react_redux24.useSelector)(selectSourceChain);
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     if (!isIndexed) return;
     const plugin = getPlugin(sourceChain.shortName);
     if (plugin) setCurrentPlugin(plugin);
@@ -4476,13 +4733,13 @@ function useBalance4() {
 }
 
 // src/hooks/useWidth.tsx
-var import_react71 = require("react");
+var import_react72 = require("react");
 var useWidth = () => {
-  const [width, setWidth] = (0, import_react71.useState)(0);
+  const [width, setWidth] = (0, import_react72.useState)(0);
   const updateWidth = (width2) => {
     setWidth(width2);
   };
-  (0, import_react71.useEffect)(() => {
+  (0, import_react72.useEffect)(() => {
     const handleResize = () => {
       setWidth(window.innerWidth);
     };
@@ -4496,19 +4753,19 @@ var useWidth_default = useWidth;
 // src/components/reusable/WalletButton.tsx
 var import_wallet_adapter_react6 = require("@solana/wallet-adapter-react");
 var import_tronwallet_adapter_react_hooks6 = require("@tronweb3/tronwallet-adapter-react-hooks");
-var import_react75 = require("@reown/appkit/react");
+var import_react76 = require("@reown/appkit/react");
 
 // src/components/reusable/CopyButton.tsx
-var import_react72 = __toESM(require("react"), 1);
+var import_react73 = __toESM(require("react"), 1);
 var CopyButton = ({ text }) => {
-  const [copyClicked, setCopyClicked] = (0, import_react72.useState)(false);
-  (0, import_react72.useEffect)(() => {
+  const [copyClicked, setCopyClicked] = (0, import_react73.useState)(false);
+  (0, import_react73.useEffect)(() => {
     if (!copyClicked) return;
     setTimeout(() => {
       setCopyClicked(false);
     }, 2e3);
   }, [copyClicked]);
-  return /* @__PURE__ */ import_react72.default.createElement(
+  return /* @__PURE__ */ import_react73.default.createElement(
     "span",
     {
       className: "copy-btn",
@@ -4517,7 +4774,7 @@ var CopyButton = ({ text }) => {
         navigator.clipboard.writeText(text);
       }
     },
-    copyClicked ? /* @__PURE__ */ import_react72.default.createElement(Check_default, null) : /* @__PURE__ */ import_react72.default.createElement(Copy_default, null)
+    copyClicked ? /* @__PURE__ */ import_react73.default.createElement(Check_default, null) : /* @__PURE__ */ import_react73.default.createElement(Copy_default, null)
   );
 };
 var CopyButton_default = CopyButton;
@@ -4603,9 +4860,9 @@ var isAddressCompatible = (address, shortName) => {
 };
 
 // src/hooks/useHideActivityTab.tsx
-var import_react73 = require("react");
+var import_react74 = require("react");
 function useHideWuiListItem(isModalOpen) {
-  (0, import_react73.useEffect)(() => {
+  (0, import_react74.useEffect)(() => {
     const modalSelector = "w3m-modal";
     let observer;
     const hideFirstWuiListItem = (parent) => {
@@ -4673,6 +4930,7 @@ var WalletButton = ({
   const compliantOption = (0, import_react_redux25.useSelector)(selectCompliantOption);
   const selectedNetwork = (0, import_react_redux25.useSelector)(selectSourceChain);
   const targetAddress = (0, import_react_redux25.useSelector)(selectTargetAddress);
+  const dAppOption = (0, import_react_redux25.useSelector)(selectDappOption);
   const { externalProvider } = useKimaContext();
   const { connected: isSolanaConnected } = (0, import_wallet_adapter_react6.useWallet)();
   const { connected: isTronConnected } = (0, import_tronwallet_adapter_react_hooks6.useWallet)();
@@ -4683,14 +4941,14 @@ var WalletButton = ({
     /*, connectBitcoinWallet*/
   } = useIsWalletReady4();
   const { balance, decimals } = useBalance4();
-  const { open } = (0, import_react75.useAppKit)();
-  const { open: isModalOpen } = (0, import_react75.useAppKitState)();
+  const { open } = (0, import_react76.useAppKit)();
+  const { open: isModalOpen } = (0, import_react76.useAppKitState)();
   const { width, updateWidth } = useWidth_default();
   useHideActivityTab_default(isModalOpen);
   const { kimaBackendUrl } = useKimaContext();
   const { data: envOptions } = useGetEnvOptions({ kimaBackendUrl });
   const networkOption = envOptions?.env || "testnet" /* testnet */;
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     logger_default.debug("WalletBalance:", {
       balance,
       connectedAddress,
@@ -4699,7 +4957,7 @@ var WalletButton = ({
       externalProvider
     });
   }, [balance, connectedAddress, isReady, externalProvider, networkOption]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     if (width === 0) {
       updateWidth(window.innerWidth);
     }
@@ -4727,29 +4985,32 @@ var WalletButton = ({
       logger_default.error("Failed to open AppKitModal", error);
     }
   };
-  const errorMessage = (0, import_react74.useMemo)(() => {
+  const errorMessage = (0, import_react75.useMemo)(() => {
     if (!isReady) return statusMessage;
     if (compliantOption && sourceCompliant !== null && !sourceCompliant?.isCompliant)
       return `Source address has ${sourceCompliant?.results?.[0].result?.risk_score} risk`;
     return "";
   }, [isReady, statusMessage, sourceCompliant, compliantOption]);
-  const isConnected = (0, import_react74.useMemo)(() => {
+  const isConnected = (0, import_react75.useMemo)(() => {
+    if (mode === "payment" /* payment */ && dAppOption !== "none" /* None */) {
+      return isReady;
+    }
     return isReady && !initialSelection;
-  }, [isReady, initialSelection]);
-  (0, import_react74.useEffect)(() => {
+  }, [isReady, initialSelection, mode, dAppOption]);
+  (0, import_react75.useEffect)(() => {
     if (!isReady) {
       dispatch(setSourceAddress(""));
       return;
     }
     dispatch(setSourceAddress(connectedAddress));
   }, [isReady]);
-  return /* @__PURE__ */ import_react74.default.createElement(
+  return /* @__PURE__ */ import_react75.default.createElement(
     "div",
     {
       className: `wallet-button ${isConnected ? "connected" : "disconnected"} ${theme.colorMode} ${errorBelow ? "error-below" : ""}`,
       "data-testid": "connect-wallet-btn"
     },
-    /* @__PURE__ */ import_react74.default.createElement("div", { className: "info-wrapper" }, /* @__PURE__ */ import_react74.default.createElement(
+    /* @__PURE__ */ import_react75.default.createElement("div", { className: "info-wrapper" }, /* @__PURE__ */ import_react75.default.createElement(
       "button",
       {
         className: `${isConnected ? "connected" : "disconnected"} ${width < 640 && "shortened"} ${theme.colorMode}`,
@@ -4759,21 +5020,21 @@ var WalletButton = ({
       isConnected && !placeholder ? width >= 640 ? `${connectedAddress || ""}` : getShortenedAddress(connectedAddress || "") : "",
       !isConnected && mode === "light" /* light */ && "Select Network to Load Account",
       !isConnected && mode !== "light" /* light */ && initialSelection && "Select Network to Connect",
-      !isConnected && mode !== "light" /* light */ && !initialSelection && /* @__PURE__ */ import_react74.default.createElement(Wallet_default, null),
+      !isConnected && mode !== "light" /* light */ && !initialSelection && /* @__PURE__ */ import_react75.default.createElement(Wallet_default, null),
       !isConnected && mode !== "light" /* light */ && !initialSelection && "Connect Wallet"
-    ), isConnected && !placeholder && /* @__PURE__ */ import_react74.default.createElement(CopyButton_default, { text: connectedAddress })),
-    isConnected && !placeholder && balance !== void 0 && decimals !== void 0 ? /* @__PURE__ */ import_react74.default.createElement("p", { className: "balance-info" }, formatUSD(bigIntToNumber({ value: balance, decimals })), " ", selectedCoin, " available") : null
+    ), isConnected && !placeholder && /* @__PURE__ */ import_react75.default.createElement(CopyButton_default, { text: connectedAddress })),
+    isConnected && !placeholder && balance !== void 0 && decimals !== void 0 ? /* @__PURE__ */ import_react75.default.createElement("p", { className: "balance-info" }, formatUSD(bigIntToNumber({ value: balance, decimals })), " ", selectedCoin, " available") : null
   );
 };
 var WalletButton_default = WalletButton;
 
 // src/components/reusable/CoinDropdown.tsx
-var import_react78 = __toESM(require("react"), 1);
+var import_react79 = __toESM(require("react"), 1);
 var import_react_redux28 = require("react-redux");
 var import_react_redux29 = require("react-redux");
 
 // src/hooks/useCurrencyOptions.tsx
-var import_react76 = require("react");
+var import_react77 = require("react");
 var import_react_redux26 = require("react-redux");
 var import_react_redux27 = require("react-redux");
 var emptyTokenList = { tokenList: [] };
@@ -4784,7 +5045,7 @@ function useCurrencyOptions(isSourceChain) {
   const sourceSymbol = (0, import_react_redux26.useSelector)(selectSourceCurrency);
   const targetChain = (0, import_react_redux26.useSelector)(selectTargetChain);
   const transactionOption = (0, import_react_redux26.useSelector)(selectTransactionOption);
-  const output = (0, import_react76.useMemo)(() => {
+  const output = (0, import_react77.useMemo)(() => {
     const chain = isSourceChain ? sourceChain : targetChain;
     const location = isSourceChain ? "origin" : "target";
     if (!chain) {
@@ -4824,7 +5085,7 @@ function useCurrencyOptions(isSourceChain) {
     return { tokenList: tokenList2 };
   }, [sourceChain, sourceSymbol, targetChain, isSourceChain]);
   const { tokenList } = output;
-  (0, import_react76.useEffect)(() => {
+  (0, import_react77.useEffect)(() => {
     if (!tokenList.length) return;
     if (mode === "payment" /* payment */ && !isSourceChain) return;
     const [firstToken] = tokenList;
@@ -4841,7 +5102,7 @@ function useCurrencyOptions(isSourceChain) {
 }
 
 // src/components/reusable/TokenIcon.tsx
-var import_react77 = __toESM(require("react"), 1);
+var import_react78 = __toESM(require("react"), 1);
 var COIN_LIST = {
   EUR: KEUR_default,
   EURC: EURC_default,
@@ -4866,22 +5127,36 @@ function TokenIcon({
     logger_default.warn(`Token icon not found for symbol: ${symbol}`);
     return null;
   }
-  return /* @__PURE__ */ import_react77.default.createElement("div", { className: "icon-wrapper" }, /* @__PURE__ */ import_react77.default.createElement(Icon, { width, height }));
+  return /* @__PURE__ */ import_react78.default.createElement("div", { className: "icon-wrapper" }, /* @__PURE__ */ import_react78.default.createElement(Icon, { width, height }));
 }
 
 // src/components/reusable/CoinDropdown.tsx
 var CoinDropdown = ({
   isSourceChain = true
 }) => {
-  const ref = (0, import_react78.useRef)();
+  const ref = (0, import_react79.useRef)();
   const dispatch = (0, import_react_redux29.useDispatch)();
-  const [collapsed, setCollapsed] = (0, import_react78.useState)(true);
+  const [collapsed, setCollapsed] = (0, import_react79.useState)(true);
   const sourceCurrency = (0, import_react_redux28.useSelector)(selectSourceCurrency);
+  const mode = (0, import_react_redux28.useSelector)(selectMode);
+  const dAppOption = (0, import_react_redux28.useSelector)(selectDappOption);
+  const transactionOption = (0, import_react_redux28.useSelector)(selectTransactionOption);
   const targetCurrency = (0, import_react_redux28.useSelector)(selectTargetCurrency);
   const { tokenList } = useCurrencyOptions(isSourceChain);
   const theme = (0, import_react_redux28.useSelector)(selectTheme);
   const tokenSymbol = isSourceChain ? sourceCurrency : targetCurrency;
-  (0, import_react78.useEffect)(() => {
+  const shouldLockToken = isSourceChain && mode === "payment" /* payment */ && dAppOption !== "none" /* None */ && !!transactionOption?.currency;
+  (0, import_react79.useEffect)(() => {
+    if (!shouldLockToken) return;
+    const matched = tokenList.find(
+      (token) => token.symbol === transactionOption.currency
+    );
+    if (matched) {
+      dispatch(setSourceCurrency(transactionOption.currency));
+      dispatch(setTargetCurrency(transactionOption.currency));
+    }
+  }, [shouldLockToken, transactionOption?.currency, tokenList]);
+  (0, import_react79.useEffect)(() => {
     const bodyMouseDowntHandler = (e) => {
       if (ref?.current && !ref.current.contains(e.target)) {
         setCollapsed(true);
@@ -4899,41 +5174,43 @@ var CoinDropdown = ({
       dispatch(setTargetCurrency(symbol));
     }
   };
-  return /* @__PURE__ */ import_react78.default.createElement(
+  return /* @__PURE__ */ import_react79.default.createElement(
     "div",
     {
-      className: `coin-dropdown ${theme.colorMode} ${collapsed ? "collapsed" : "toggled"}`,
-      onClick: () => setCollapsed((prev) => !prev),
+      className: `coin-dropdown ${theme.colorMode} ${collapsed ? "collapsed" : "toggled"} ${shouldLockToken ? "disabled" : ""}`,
+      onClick: () => {
+        if (!shouldLockToken) setCollapsed((prev) => !prev);
+      },
       ref
     },
-    /* @__PURE__ */ import_react78.default.createElement("div", { className: "coin-wrapper" }, /* @__PURE__ */ import_react78.default.createElement(TokenIcon, { symbol: tokenSymbol, width: 24, height: 24 }), /* @__PURE__ */ import_react78.default.createElement("span", { className: "coin" }, tokenSymbol)),
-    /* @__PURE__ */ import_react78.default.createElement(
+    /* @__PURE__ */ import_react79.default.createElement("div", { className: "coin-wrapper" }, /* @__PURE__ */ import_react79.default.createElement(TokenIcon, { symbol: tokenSymbol, width: 24, height: 24 }), /* @__PURE__ */ import_react79.default.createElement("span", { className: "coin" }, tokenSymbol)),
+    /* @__PURE__ */ import_react79.default.createElement(
       "div",
       {
         className: `coin-menu ${theme.colorMode} ${collapsed ? "collapsed" : "toggled"}`
       },
-      tokenList.map((token) => /* @__PURE__ */ import_react78.default.createElement(
+      tokenList.map((token) => /* @__PURE__ */ import_react79.default.createElement(
         "div",
         {
           className: `coin-item ${theme.colorMode}`,
           key: token.symbol,
           onClick: () => handleDropdownItemClick(token.symbol)
         },
-        /* @__PURE__ */ import_react78.default.createElement(TokenIcon, { symbol: token.symbol, width: 24, height: 24 }),
-        /* @__PURE__ */ import_react78.default.createElement("p", null, token.symbol)
+        /* @__PURE__ */ import_react79.default.createElement(TokenIcon, { symbol: token.symbol, width: 24, height: 24 }),
+        /* @__PURE__ */ import_react79.default.createElement("p", null, token.symbol)
       ))
     ),
-    /* @__PURE__ */ import_react78.default.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ import_react78.default.createElement(Arrow_default, { fill: "none" }))
+    !shouldLockToken && /* @__PURE__ */ import_react79.default.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ import_react79.default.createElement(Arrow_default, { fill: "none" }))
   );
 };
 var CoinDropdown_default = CoinDropdown;
 
 // src/components/reusable/ConfirmDetails.tsx
-var import_react81 = __toESM(require("react"), 1);
+var import_react82 = __toESM(require("react"), 1);
 var import_react_redux31 = require("react-redux");
 
 // src/components/reusable/ChainIcon.tsx
-var import_react79 = __toESM(require("react"), 1);
+var import_react80 = __toESM(require("react"), 1);
 var chainIcons = {
   ARB: Arbitrum_default,
   AVX: Avalanche_default,
@@ -4955,13 +5232,13 @@ function ChainIcon({ symbol }) {
   const Icon = symbol === "FIAT" ? chainIcons["CC"] : chainIcons[symbol];
   if (!Icon) {
     if (symbol) logger_default.warn(`Chain icon not found for symbol: ${symbol}`);
-    return /* @__PURE__ */ import_react79.default.createElement("div", null);
+    return /* @__PURE__ */ import_react80.default.createElement("div", null);
   }
-  return /* @__PURE__ */ import_react79.default.createElement("div", { className: "icon" }, /* @__PURE__ */ import_react79.default.createElement(Icon, null));
+  return /* @__PURE__ */ import_react80.default.createElement("div", { className: "icon" }, /* @__PURE__ */ import_react80.default.createElement(Icon, null));
 }
 
 // src/components/reusable/FeeDeductionRadioButtons.tsx
-var import_react80 = __toESM(require("react"), 1);
+var import_react81 = __toESM(require("react"), 1);
 var import_react_redux30 = require("react-redux");
 var FeeDeductionRadioButtons = ({ disabled }) => {
   const dispatch = (0, import_react_redux30.useDispatch)();
@@ -4978,7 +5255,7 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
   const handleChange = (value) => {
     dispatch(setFeeDeduct(value));
   };
-  return /* @__PURE__ */ import_react80.default.createElement("div", { className: `fee-deduction-radio-container ${theme.colorMode}` }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "fee-options" }, Number(amount) - totalFee > 0 && /* @__PURE__ */ import_react80.default.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ import_react80.default.createElement(
+  return /* @__PURE__ */ import_react81.default.createElement("div", { className: `fee-deduction-radio-container ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "fee-options" }, Number(amount) - totalFee > 0 && /* @__PURE__ */ import_react81.default.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ import_react81.default.createElement(
     "input",
     {
       type: "radio",
@@ -4987,11 +5264,11 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
       disabled,
       onChange: () => handleChange(true)
     }
-  ), /* @__PURE__ */ import_react80.default.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
+  ), /* @__PURE__ */ import_react81.default.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
     Number(amount)
   )} ${sourceCurrency} in ${sourceNetwork.name} to receive $${formatterFloat.format(
     Number(amount) - totalFee
-  )} ${targetCurrency} in ${targetNetwork.name}`)), /* @__PURE__ */ import_react80.default.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ import_react80.default.createElement(
+  )} ${targetCurrency} in ${targetNetwork.name}`)), /* @__PURE__ */ import_react81.default.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ import_react81.default.createElement(
     "input",
     {
       type: "radio",
@@ -5000,7 +5277,7 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
       disabled,
       onChange: () => handleChange(false)
     }
-  ), /* @__PURE__ */ import_react80.default.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
+  ), /* @__PURE__ */ import_react81.default.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
     Number(amount) + totalFee
   )} ${sourceCurrency} in ${sourceNetwork.name} to receive $${formatterFloat.format(
     Number(amount)
@@ -5026,10 +5303,10 @@ var ConfirmDetails = ({
   const bankDetails = (0, import_react_redux31.useSelector)(selectBankDetails);
   const signature = (0, import_react_redux31.useSelector)(selectSignature);
   const networkOptions3 = (0, import_react_redux31.useSelector)(selectNetworks);
-  const [feeCollapsed, setFeeCollapsed] = (0, import_react81.useState)(true);
+  const [feeCollapsed, setFeeCollapsed] = (0, import_react82.useState)(true);
   const transactionOption = (0, import_react_redux31.useSelector)(selectTransactionOption);
   const { connectedAddress } = useIsWalletReady4();
-  const targetNetworkOption = (0, import_react81.useMemo)(
+  const targetNetworkOption = (0, import_react82.useMemo)(
     () => networkOptions3.filter(
       (network) => network.shortName === (mode === "payment" /* payment */ ? transactionOption?.targetChain : targetNetwork.shortName)
     )[0],
@@ -5038,16 +5315,16 @@ var ConfirmDetails = ({
   const sourceCurrency = (0, import_react_redux31.useSelector)(selectSourceCurrency);
   const targetCurrency = (0, import_react_redux31.useSelector)(selectTargetCurrency);
   const { width, updateWidth } = useWidth_default();
-  (0, import_react81.useEffect)(() => {
+  (0, import_react82.useEffect)(() => {
     width === 0 && updateWidth(window.innerWidth);
   }, []);
-  return /* @__PURE__ */ import_react81.default.createElement("div", { className: `confirm-details ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement("p", null, "Step ", isApproved ? "2" : "1", "\xA0of 2\xA0\xA0\xA0", isApproved ? "Submit transaction" : originNetwork.shortName === "FIAT" /* FIAT */ ? "Bank Details" : "Approval"), originNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react81.default.createElement("div", null, /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react81.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement(ChainIcon, { symbol: originNetwork?.shortName }), "FIAT"), /* @__PURE__ */ import_react81.default.createElement("p", null, "ES6621000418401234567891")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react81.default.createElement("p", null, "Kima Sandbox")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "BIC:"), /* @__PURE__ */ import_react81.default.createElement("p", null, "CAIXESBBXXX")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "Description:"), /* @__PURE__ */ import_react81.default.createElement("p", { className: "signature" }, signature))) : /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "Source ", originNetwork.shortName !== "CC" && "wallet", ":"), /* @__PURE__ */ import_react81.default.createElement("div", { className: "network-details" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement(ChainIcon, { symbol: originNetwork?.shortName }), originNetwork.name)), originNetwork.shortName !== "CC" && /* @__PURE__ */ import_react81.default.createElement("p", { className: theme.colorMode }, dAppOption === "LPDrain" /* LPDrain */ ? targetAddress : connectedAddress))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item amount" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "amount-container" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "Amount to Transfer "), /* @__PURE__ */ import_react81.default.createElement("div", { className: "coin-details" }, /* @__PURE__ */ import_react81.default.createElement("p", null, formatBigInt(txValues.allowanceAmount), " ", sourceCurrency))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "Total Fees"), /* @__PURE__ */ import_react81.default.createElement(
+  return /* @__PURE__ */ import_react82.default.createElement("div", { className: `confirm-details ${theme.colorMode}` }, /* @__PURE__ */ import_react82.default.createElement("p", null, "Step ", isApproved ? "2" : "1", "\xA0of 2\xA0\xA0\xA0", isApproved ? "Submit transaction" : originNetwork.shortName === "FIAT" /* FIAT */ ? "Bank Details" : "Approval"), originNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react82.default.createElement("div", null, /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react82.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react82.default.createElement(ChainIcon, { symbol: originNetwork?.shortName }), "FIAT"), /* @__PURE__ */ import_react82.default.createElement("p", null, "ES6621000418401234567891")), /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react82.default.createElement("p", null, "Kima Sandbox")), /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "BIC:"), /* @__PURE__ */ import_react82.default.createElement("p", null, "CAIXESBBXXX")), /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "Description:"), /* @__PURE__ */ import_react82.default.createElement("p", { className: "signature" }, signature))) : /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "Source ", originNetwork.shortName !== "CC" && "wallet", ":"), /* @__PURE__ */ import_react82.default.createElement("div", { className: "network-details" }, /* @__PURE__ */ import_react82.default.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react82.default.createElement(ChainIcon, { symbol: originNetwork?.shortName }), originNetwork.name)), originNetwork.shortName !== "CC" && /* @__PURE__ */ import_react82.default.createElement("p", { className: theme.colorMode }, dAppOption === "LPDrain" /* LPDrain */ ? targetAddress : connectedAddress))), /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item amount" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "amount-container" }, dAppOption === "none" /* None */ && /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, "Amount to Transfer "), /* @__PURE__ */ import_react82.default.createElement("div", { className: "coin-details" }, /* @__PURE__ */ import_react82.default.createElement("p", null, formatBigInt(txValues.allowanceAmount), " ", sourceCurrency))), dAppOption === "none" /* None */ && /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, "Total Fees"), /* @__PURE__ */ import_react82.default.createElement(
     "div",
     {
       className: "fee-collapse",
       onClick: () => setFeeCollapsed(!feeCollapsed)
     },
-    /* @__PURE__ */ import_react81.default.createElement(
+    /* @__PURE__ */ import_react82.default.createElement(
       MiniArrow_default,
       {
         width: 15,
@@ -5058,16 +5335,16 @@ var ConfirmDetails = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react81.default.createElement("span", { className: "service-fee" }, formatBigInt(totalFee), " ", sourceCurrency)
-  )), /* @__PURE__ */ import_react81.default.createElement("div", { className: `fee-breakdown ${feeCollapsed ? "collapsed" : ""}` }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, originNetwork.shortName === "CC" ? "Credit Card Processing Fee" : `Source Network Fee (${originNetwork.shortName})`), /* @__PURE__ */ import_react81.default.createElement("span", { className: "service-fee" }, formatBigInt(sourceFee), " ", sourceCurrency)), /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "Target Network Fee (", targetNetwork.shortName, ")"), /* @__PURE__ */ import_react81.default.createElement("span", { className: "service-fee" }, formatBigInt(targetFee), " ", targetCurrency)), /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "KIMA Service Fee"), /* @__PURE__ */ import_react81.default.createElement("span", { className: "service-fee" }, formatBigInt(kimaFee), " ", sourceCurrency))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "Target Transfer Amount"), /* @__PURE__ */ import_react81.default.createElement("span", { className: "service-fee" }, formatBigInt(txValues.submitAmount), " ", targetCurrency)))), targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react81.default.createElement("div", null, /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react81.default.createElement("p", null, bankDetails.iban), /* @__PURE__ */ import_react81.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), "FIAT")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react81.default.createElement("p", null, bankDetails.recipient))) : /* @__PURE__ */ import_react81.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "label" }, "Target wallet:"), /* @__PURE__ */ import_react81.default.createElement("div", { className: "network-details" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react81.default.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), targetNetworkOption?.name)), /* @__PURE__ */ import_react81.default.createElement("p", { className: theme.colorMode }, mode === "light" /* light */ ? targetNetwork.shortName === "SOL" ? lightDemoAccounts.SOL : targetNetwork.shortName === "TRX" ? lightDemoAccounts.TRX : lightDemoAccounts.EVM : dAppOption === "LPDrain" /* LPDrain */ ? connectedAddress : targetAddress))), mode === "bridge" /* bridge */ && BigInt(totalFee.value) > BigInt(0) ? (
+    /* @__PURE__ */ import_react82.default.createElement("span", { className: "service-fee" }, formatBigInt(totalFee), " ", sourceCurrency)
+  )), /* @__PURE__ */ import_react82.default.createElement("div", { className: `fee-breakdown ${feeCollapsed ? "collapsed" : ""}` }, /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, originNetwork.shortName === "CC" ? "Credit Card Processing Fee" : `Source Network Fee (${originNetwork.shortName})`), /* @__PURE__ */ import_react82.default.createElement("span", { className: "service-fee" }, formatBigInt(sourceFee), " ", sourceCurrency)), /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, "Target Network Fee (", targetNetwork.shortName, ")"), /* @__PURE__ */ import_react82.default.createElement("span", { className: "service-fee" }, formatBigInt(targetFee), " ", targetCurrency)), /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, "KIMA Service Fee"), /* @__PURE__ */ import_react82.default.createElement("span", { className: "service-fee" }, formatBigInt(kimaFee), " ", sourceCurrency))), /* @__PURE__ */ import_react82.default.createElement("div", { className: "amount-details" }, /* @__PURE__ */ import_react82.default.createElement("span", null, "Target Transfer Amount"), /* @__PURE__ */ import_react82.default.createElement("span", { className: "service-fee" }, formatBigInt(txValues.submitAmount), " ", targetCurrency)))), targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react82.default.createElement("div", null, /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react82.default.createElement("p", null, bankDetails.iban), /* @__PURE__ */ import_react82.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react82.default.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), "FIAT")), /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react82.default.createElement("p", null, bankDetails.recipient))) : /* @__PURE__ */ import_react82.default.createElement("div", { className: "detail-item" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: "label" }, "Target wallet:"), /* @__PURE__ */ import_react82.default.createElement("div", { className: "network-details" }, /* @__PURE__ */ import_react82.default.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ import_react82.default.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react82.default.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), targetNetworkOption?.name)), /* @__PURE__ */ import_react82.default.createElement("p", { className: theme.colorMode }, mode === "light" /* light */ ? targetNetwork.shortName === "SOL" ? lightDemoAccounts.SOL : targetNetwork.shortName === "TRX" ? lightDemoAccounts.TRX : lightDemoAccounts.EVM : dAppOption === "LPDrain" /* LPDrain */ ? connectedAddress : targetAddress))), mode === "bridge" /* bridge */ && BigInt(totalFee.value) > BigInt(0) ? (
     // <FeeDeductionSlider />
-    /* @__PURE__ */ import_react81.default.createElement(FeeDeductionRadioButtons_default, { disabled: feeOptionDisabled })
+    /* @__PURE__ */ import_react82.default.createElement(FeeDeductionRadioButtons_default, { disabled: feeOptionDisabled })
   ) : null);
 };
 var ConfirmDetails_default = ConfirmDetails;
 
 // src/components/reusable/AddressInput.tsx
-var import_react82 = __toESM(require("react"), 1);
+var import_react83 = __toESM(require("react"), 1);
 var import_react_redux32 = require("react-redux");
 var AddressInput = ({
   theme,
@@ -5080,7 +5357,7 @@ var AddressInput = ({
   const targetChain = (0, import_react_redux32.useSelector)(selectTargetChain);
   const { connectedAddress: sourceAddress, isReady } = useIsWalletReady4();
   const targetAddress = (0, import_react_redux32.useSelector)(selectTargetAddress);
-  (0, import_react82.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     if (mode === "payment" /* payment */) return;
     if (mode === "light" /* light */ && !initialSelection) {
       if (isEVMChain(targetChain.shortName))
@@ -5106,7 +5383,7 @@ var AddressInput = ({
     mode,
     dispatch
   ]);
-  return /* @__PURE__ */ import_react82.default.createElement(
+  return /* @__PURE__ */ import_react83.default.createElement(
     "input",
     {
       className: `kima-address-input ${theme}`,
@@ -5121,11 +5398,11 @@ var AddressInput = ({
 var AddressInput_default = AddressInput;
 
 // src/components/reusable/CustomCheckbox.tsx
-var import_react83 = __toESM(require("react"), 1);
+var import_react84 = __toESM(require("react"), 1);
 var import_react_redux33 = require("react-redux");
 
 // src/components/reusable/StepBox.tsx
-var import_react84 = __toESM(require("react"), 1);
+var import_react85 = __toESM(require("react"), 1);
 var import_react_redux34 = require("react-redux");
 var stepInfo2 = [
   {
@@ -5149,69 +5426,69 @@ var StepBox = ({ step, errorStep, loadingStep, data }) => {
   const explorerUrl = (0, import_react_redux34.useSelector)(selectKimaExplorer);
   const networkOption = (0, import_react_redux34.useSelector)(selectNetworkOption);
   const networks = (0, import_react_redux34.useSelector)(selectNetworks);
-  const sourceChain = (0, import_react84.useMemo)(() => {
+  const { width: windowWidth } = useWidth_default();
+  const sourceChain = (0, import_react85.useMemo)(() => {
     const sourceKey = data?.sourceChain === "FIAT" ? "CC" : data?.sourceChain;
     return networks.find((network) => network.shortName === sourceKey);
   }, [data, networks]);
-  const targetChain = (0, import_react84.useMemo)(
+  const targetChain = (0, import_react85.useMemo)(
     () => networks.find((network) => network.shortName === data?.targetChain),
     [data, networks]
   );
-  return /* @__PURE__ */ import_react84.default.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ import_react84.default.createElement("div", { className: `content-wrapper ${theme.colorMode}` }, stepInfo2.map((item, index) => /* @__PURE__ */ import_react84.default.createElement("div", { key: item.title, className: "step-item" }, /* @__PURE__ */ import_react84.default.createElement(
+  return /* @__PURE__ */ import_react85.default.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: `content-wrapper ${theme.colorMode}` }, stepInfo2.map((item, index) => /* @__PURE__ */ import_react85.default.createElement("div", { key: item.title, className: "step-item" }, /* @__PURE__ */ import_react85.default.createElement(
     "div",
     {
       className: `info-item
                   ${step >= index ? index === loadingStep ? "active" : index === errorStep ? "error" : "completed" : ""} 
                   ${step < index && "locked"} ${theme.colorMode}`
     },
-    step < index && /* @__PURE__ */ import_react84.default.createElement(Lock_default, null),
-    step >= index ? index === loadingStep ? /* @__PURE__ */ import_react84.default.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ import_react84.default.createElement(Warning_default, null) : /* @__PURE__ */ import_react84.default.createElement(Check_default, null) : null,
-    /* @__PURE__ */ import_react84.default.createElement("p", null, item.title)
-  ), index === 0 && data?.kimaTxHash ? /* @__PURE__ */ import_react84.default.createElement("div", { className: `info-item ${theme.colorMode}` }, /* @__PURE__ */ import_react84.default.createElement("div", { className: "icon" }, /* @__PURE__ */ import_react84.default.createElement(USDK_default, { width: 30, height: 30 })), /* @__PURE__ */ import_react84.default.createElement("p", { className: "chain-name" }, "Kima TX Hash:"), /* @__PURE__ */ import_react84.default.createElement("p", null, /* @__PURE__ */ import_react84.default.createElement(
+    /* @__PURE__ */ import_react85.default.createElement("div", { className: "info-icon" }, step < index && /* @__PURE__ */ import_react85.default.createElement(Lock_default, { width: 24, height: 24 }), step >= index ? index === loadingStep ? /* @__PURE__ */ import_react85.default.createElement(Loader_default, { width: 24, height: 24, className: "loader" }) : index === errorStep ? /* @__PURE__ */ import_react85.default.createElement(Warning_default, { width: 24, height: 24 }) : /* @__PURE__ */ import_react85.default.createElement(Check_default, { width: 24, height: 24 }) : null),
+    /* @__PURE__ */ import_react85.default.createElement("p", null, item.title)
+  ), index === 0 && data?.kimaTxHash ? /* @__PURE__ */ import_react85.default.createElement("div", { className: `info-item ${theme.colorMode}` }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "icon" }, /* @__PURE__ */ import_react85.default.createElement(USDK_default, { width: 30, height: 30 })), /* @__PURE__ */ import_react85.default.createElement("p", { className: "chain-name" }, "Kima TX Hash:"), /* @__PURE__ */ import_react85.default.createElement("p", null, /* @__PURE__ */ import_react85.default.createElement(
     ExternalLink_default,
     {
       to: `${explorerUrl}/transactions/?tx=${data?.kimaTxHash}`
     },
     getShortenedAddress(data?.kimaTxHash || "")
-  ), /* @__PURE__ */ import_react84.default.createElement(CopyButton_default, { text: data?.kimaTxHash }))) : null, index === 1 && data?.tssPullHash && sourceChain?.shortName !== "CC" ? /* @__PURE__ */ import_react84.default.createElement(
+  ), /* @__PURE__ */ import_react85.default.createElement(CopyButton_default, { text: data?.kimaTxHash }))) : null, index === 1 && data?.tssPullHash && sourceChain?.shortName !== "CC" ? /* @__PURE__ */ import_react85.default.createElement(
     "div",
     {
       className: `info-item ${theme.colorMode} source-chain ${step >= 3 ? "paid" : ""}`
     },
-    /* @__PURE__ */ import_react84.default.createElement(ChainIcon, { symbol: data.sourceChain }),
-    /* @__PURE__ */ import_react84.default.createElement("p", { className: "chain-name" }, sourceChain?.name, " TX Hash:"),
-    /* @__PURE__ */ import_react84.default.createElement("p", null, /* @__PURE__ */ import_react84.default.createElement(
+    /* @__PURE__ */ import_react85.default.createElement(ChainIcon, { symbol: data.sourceChain }),
+    /* @__PURE__ */ import_react85.default.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? sourceChain?.name : sourceChain?.shortName, " ", "TX Hash:"),
+    /* @__PURE__ */ import_react85.default.createElement("p", null, /* @__PURE__ */ import_react85.default.createElement(
       ExternalLink_default,
       {
         to: `${sourceChain?.blockExplorers?.default.url}/${data?.sourceChain === "TRX" /* TRON */ ? "#/transaction" : "tx"}/${data?.tssPullHash}${data?.sourceChain === "SOL" /* SOLANA */ && networkOption === "testnet" /* testnet */ ? "?cluster=devnet" : ""}`
       },
       getShortenedAddress(data?.tssPullHash || "")
-    ), /* @__PURE__ */ import_react84.default.createElement(CopyButton_default, { text: data?.tssPullHash || "" }))
-  ) : null, index === 3 && data?.tssRefundHash ? /* @__PURE__ */ import_react84.default.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ import_react84.default.createElement(ChainIcon, { symbol: data.sourceChain }), /* @__PURE__ */ import_react84.default.createElement("p", { className: "chain-name" }, sourceChain?.name, " TX Hash:"), /* @__PURE__ */ import_react84.default.createElement("p", null, /* @__PURE__ */ import_react84.default.createElement(
+    ), /* @__PURE__ */ import_react85.default.createElement(CopyButton_default, { text: data?.tssPullHash || "" }))
+  ) : null, index === 3 && data?.tssRefundHash ? /* @__PURE__ */ import_react85.default.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ import_react85.default.createElement(ChainIcon, { symbol: data.sourceChain }), /* @__PURE__ */ import_react85.default.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? sourceChain?.name : sourceChain?.shortName, " ", "TX Hash:"), /* @__PURE__ */ import_react85.default.createElement("p", null, /* @__PURE__ */ import_react85.default.createElement(
     ExternalLink_default,
     {
       to: `${sourceChain?.blockExplorers?.default.url}/${data?.sourceChain === "TRX" /* TRON */ ? "#/transaction" : "tx"}/${data?.tssRefundHash}${data?.sourceChain === "SOL" /* SOLANA */ && networkOption === "testnet" /* testnet */ ? "?cluster=devnet" : ""}`
     },
     getShortenedAddress(data?.tssRefundHash || "")
-  ), /* @__PURE__ */ import_react84.default.createElement(CopyButton_default, { text: data?.tssRefundHash || "" }))) : null, index === 3 && data?.tssReleaseHash ? /* @__PURE__ */ import_react84.default.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ import_react84.default.createElement(ChainIcon, { symbol: data.targetChain }), /* @__PURE__ */ import_react84.default.createElement("p", { className: "chain-name" }, targetChain?.name, " TX Hash:"), /* @__PURE__ */ import_react84.default.createElement("p", null, /* @__PURE__ */ import_react84.default.createElement(
+  ), /* @__PURE__ */ import_react85.default.createElement(CopyButton_default, { text: data?.tssRefundHash || "" }))) : null, index === 3 && data?.tssReleaseHash ? /* @__PURE__ */ import_react85.default.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ import_react85.default.createElement(ChainIcon, { symbol: data.targetChain }), /* @__PURE__ */ import_react85.default.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? targetChain?.name : targetChain?.shortName, " ", "TX Hash:"), /* @__PURE__ */ import_react85.default.createElement("p", null, /* @__PURE__ */ import_react85.default.createElement(
     ExternalLink_default,
     {
       to: `${targetChain?.blockExplorers?.default.url}/${data?.targetChain === "TRX" /* TRON */ ? "#/transaction" : "tx"}/${data?.tssReleaseHash}${data?.targetChain === "SOL" /* SOLANA */ && networkOption === "testnet" /* testnet */ ? "?cluster=devnet" : ""}`
     },
     getShortenedAddress(data?.tssReleaseHash || "")
-  ), /* @__PURE__ */ import_react84.default.createElement(CopyButton_default, { text: data?.tssReleaseHash || "" }))) : null))));
+  ), /* @__PURE__ */ import_react85.default.createElement(CopyButton_default, { text: data?.tssReleaseHash || "" }))) : null))));
 };
 var StepBox_default = StepBox;
 
 // src/components/reusable/BankInput.tsx
-var import_react85 = __toESM(require("react"), 1);
+var import_react86 = __toESM(require("react"), 1);
 var import_react_redux35 = require("react-redux");
 var import_react_redux36 = require("react-redux");
 var BankInput = () => {
   const dispatch = (0, import_react_redux35.useDispatch)();
   const theme = (0, import_react_redux36.useSelector)(selectTheme);
   const bankDetails = (0, import_react_redux36.useSelector)(selectBankDetails);
-  return /* @__PURE__ */ import_react85.default.createElement("div", { className: "bank-input" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react85.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react85.default.createElement(
+  return /* @__PURE__ */ import_react86.default.createElement("div", { className: "bank-input" }, /* @__PURE__ */ import_react86.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react86.default.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ import_react86.default.createElement(
     "input",
     {
       className: "kima-address-input",
@@ -5219,7 +5496,7 @@ var BankInput = () => {
       value: bankDetails.iban,
       onChange: (e) => dispatch(setBankDetails({ ...bankDetails, iban: e.target.value }))
     }
-  )), /* @__PURE__ */ import_react85.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react85.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react85.default.createElement(
+  )), /* @__PURE__ */ import_react86.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react86.default.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ import_react86.default.createElement(
     "input",
     {
       className: "kima-address-input",
@@ -5234,7 +5511,7 @@ var BankInput = () => {
 var BankInput_default = BankInput;
 
 // src/components/reusable/TxButton.tsx
-var import_react86 = __toESM(require("react"), 1);
+var import_react87 = __toESM(require("react"), 1);
 var import_react_redux37 = require("react-redux");
 var import_react_redux38 = require("react-redux");
 var TxButton = ({ theme }) => {
@@ -5243,14 +5520,14 @@ var TxButton = ({ theme }) => {
     dispatch(setPendingTxPopup(true));
   };
   const txCount = (0, import_react_redux38.useSelector)(selectPendingTxs);
-  return /* @__PURE__ */ import_react86.default.createElement(
+  return /* @__PURE__ */ import_react87.default.createElement(
     "button",
     {
       className: `secondary-button tx-button ${theme.colorMode}`,
       onClick: handleClick
     },
     txCount,
-    /* @__PURE__ */ import_react86.default.createElement(
+    /* @__PURE__ */ import_react87.default.createElement(
       ring_default,
       {
         height: 16,
@@ -5269,7 +5546,7 @@ var import_react_redux43 = require("react-redux");
 var import_react_hot_toast3 = require("react-hot-toast");
 
 // src/hooks/useGetTxData.ts
-var import_react87 = require("react");
+var import_react88 = require("react");
 var import_react_query14 = require("@tanstack/react-query");
 
 // src/services/transactionApi.ts
@@ -5286,43 +5563,25 @@ var emptyStatus = {
   kimaTxHash: "",
   failReason: ""
 };
-var selectStatus = (response) => {
-  if ("liquidity_transaction_data" in response.data) {
-    const data2 = response.data.liquidity_transaction_data;
-    if (!data2) return emptyStatus;
-    return {
-      status: data2.txstatus,
-      sourceChain: data2.chain,
-      targetChain: data2.chain,
-      tssPullHash: data2.releasehash,
-      tssReleaseHash: data2.releasehash,
-      tssRefundHash: data2.refundhash,
-      failReason: data2.failreason,
-      amount: data2.amount,
-      sourceSymbol: data2.symbol,
-      targetSymbol: data2.symbol,
-      kimaTxHash: data2.kimahash
-    };
-  }
-  const data = response.data.transaction_data;
-  if (!data) return emptyStatus;
+var parseTxData = (raw) => {
+  if (!raw) return emptyStatus;
   return {
-    status: data.txstatus,
-    sourceChain: data.originchain,
-    targetChain: data.targetchain,
-    tssPullHash: data.pullhash,
-    tssReleaseHash: data.releasehash,
-    tssRefundHash: data.refundhash,
-    failReason: data.failreason,
-    amount: data.amount,
-    sourceSymbol: data.originsymbol,
-    targetSymbol: data.targetsymbol,
-    kimaTxHash: data.kimahash
+    status: raw.txstatus,
+    sourceChain: raw.originchain,
+    targetChain: raw.targetchain,
+    tssPullHash: raw.pullhash,
+    tssReleaseHash: raw.releasehash,
+    tssRefundHash: raw.refundhash,
+    failReason: raw.failreason,
+    amount: raw.amount,
+    sourceSymbol: raw.originsymbol,
+    targetSymbol: raw.targetsymbol,
+    kimaTxHash: raw.kimahash
   };
 };
 var isFinished = (data) => {
   if (!data) return false;
-  return !!data.status && [
+  return [
     "Completed" /* COMPLETED */,
     "FailedToPull" /* FAILEDTOPULL */,
     "FailedToPay" /* FAILEDTOPAY */,
@@ -5344,11 +5603,11 @@ var getTxData = async ({
       `${backendUrl}/${path}/${txId}/status`
     );
     if (typeof response === "string") throw new Error(response);
-    const data = selectStatus(
-      response
-    );
-    refPollForUpdates.current = !isFinished(data);
-    return data;
+    const res = response;
+    const raw = isLP ? res.data.liquidity_transaction_data : res.data.transaction_data;
+    const parsed = parseTxData(raw);
+    refPollForUpdates.current = !isFinished(parsed);
+    return parsed;
   } catch (error) {
     logger_default.error(`Error fetching transaction ${txId} data:`, error);
     throw new Error(
@@ -5360,7 +5619,7 @@ var getTxData = async ({
 // src/hooks/useGetTxData.ts
 var POLLING_INTERVAL_MS = 1e3 * 10;
 var useGetTxData = (txId, dAppOption, backendUrl) => {
-  const refPollForUpdates = (0, import_react87.useRef)(false);
+  const refPollForUpdates = (0, import_react88.useRef)(false);
   const isLP = dAppOption === "LPAdd" /* LPAdd */ || dAppOption === "LPDrain" /* LPDrain */;
   const validTxId = typeof txId === "number" ? txId > 0 : txId.toString().length > 0;
   const result = (0, import_react_query14.useQuery)({
@@ -5377,17 +5636,17 @@ var useGetTxData = (txId, dAppOption, backendUrl) => {
 var useGetTxData_default = useGetTxData;
 
 // src/components/reusable/TransactionStatusMessage.tsx
-var import_react88 = __toESM(require("react"), 1);
+var import_react89 = __toESM(require("react"), 1);
 var TransactionStatusMessage = ({
   isCompleted,
   transactionId
 }) => {
-  return /* @__PURE__ */ import_react88.default.createElement("div", { className: "transaction-status-message" }, /* @__PURE__ */ import_react88.default.createElement("h2", null, isCompleted !== "Completed" /* COMPLETED */ && "Your transaction is currently being processed.", " ", "Please copy the Transaction ID below for future reference. You can use this ID to track the transaction status or resolve any issues if needed."), /* @__PURE__ */ import_react88.default.createElement("span", { className: "transaction-copy" }, /* @__PURE__ */ import_react88.default.createElement("h3", null, transactionId), /* @__PURE__ */ import_react88.default.createElement(CopyButton_default, { text: transactionId })));
+  return /* @__PURE__ */ import_react89.default.createElement("div", { className: "transaction-status-message" }, /* @__PURE__ */ import_react89.default.createElement("h2", null, isCompleted !== "Completed" /* COMPLETED */ && "Your transaction is currently being processed.", " ", "Please copy the Transaction ID below for future reference. You can use this ID to track the transaction status or resolve any issues if needed."), /* @__PURE__ */ import_react89.default.createElement("span", { className: "transaction-copy" }, /* @__PURE__ */ import_react89.default.createElement("h3", null, transactionId), /* @__PURE__ */ import_react89.default.createElement(CopyButton_default, { text: transactionId })));
 };
 var TransactionStatusMessage_default = TransactionStatusMessage;
 
 // src/components/reusable/TransactionSearch.tsx
-var import_react89 = __toESM(require("react"), 1);
+var import_react90 = __toESM(require("react"), 1);
 var import_react_redux39 = require("react-redux");
 var import_react_redux40 = require("react-redux");
 var import_react_hot_toast2 = __toESM(require("react-hot-toast"), 1);
@@ -5395,12 +5654,12 @@ var TransactionSearch = () => {
   const theme = (0, import_react_redux39.useSelector)(selectTheme);
   const backendUrl = (0, import_react_redux39.useSelector)(selectBackendUrl);
   const dispatch = (0, import_react_redux40.useDispatch)();
-  const [transactionId, setTransactionId] = (0, import_react89.useState)("");
-  const refPollForUpdates = (0, import_react89.useRef)(false);
+  const [transactionId, setTransactionId] = (0, import_react90.useState)("");
+  const refPollForUpdates = (0, import_react90.useRef)(false);
   const handleSearch = async () => {
     if (transactionId.length <= 0)
       return import_react_hot_toast2.default.error("You must provide a valid transaction id", {
-        icon: /* @__PURE__ */ import_react89.default.createElement(Error_default, null)
+        icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
       });
     try {
       const data = await getTxData({
@@ -5417,11 +5676,11 @@ var TransactionSearch = () => {
       logger_default.error("Error searching transaction: ", error);
       return import_react_hot_toast2.default.error(
         "Transaction not found. Please check for the proper transaction id.",
-        { icon: /* @__PURE__ */ import_react89.default.createElement(Error_default, null) }
+        { icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null) }
       );
     }
   };
-  return /* @__PURE__ */ import_react89.default.createElement("div", { className: "form-item transaction-search" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "transaction-input" }, /* @__PURE__ */ import_react89.default.createElement("span", { className: "label" }, "Search Transaction:"), /* @__PURE__ */ import_react89.default.createElement(
+  return /* @__PURE__ */ import_react90.default.createElement("div", { className: "form-item transaction-search" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "transaction-input" }, /* @__PURE__ */ import_react90.default.createElement("span", { className: "label" }, "Search Transaction:"), /* @__PURE__ */ import_react90.default.createElement(
     "input",
     {
       className: `${theme.colorMode}`,
@@ -5431,19 +5690,21 @@ var TransactionSearch = () => {
       onChange: (e) => setTransactionId(e.target.value),
       spellCheck: false
     }
-  )), /* @__PURE__ */ import_react89.default.createElement(SecondaryButton_default, { clickHandler: handleSearch }, "Search"));
+  )), /* @__PURE__ */ import_react90.default.createElement(SecondaryButton_default, { clickHandler: handleSearch }, "Search"));
 };
 var TransactionSearch_default = TransactionSearch;
 
 // src/components/TransactionWidget.tsx
 var TransactionWidget = ({ theme }) => {
-  const [step, setStep] = (0, import_react90.useState)(0);
-  const [focus, setFocus] = (0, import_react90.useState)(-1);
-  const [errorStep, setErrorStep] = (0, import_react90.useState)(-1);
-  const [errorMessage, setErrorMessage] = (0, import_react90.useState)("");
-  const [loadingStep, setLoadingStep] = (0, import_react90.useState)(-1);
-  const [minimized, setMinimized] = (0, import_react90.useState)(false);
+  const [step, setStep] = (0, import_react91.useState)(0);
+  const [focus, setFocus] = (0, import_react91.useState)(-1);
+  const [errorStep, setErrorStep] = (0, import_react91.useState)(-1);
+  const [errorMessage, setErrorMessage] = (0, import_react91.useState)("");
+  const [loadingStep, setLoadingStep] = (0, import_react91.useState)(-1);
+  const [minimized, setMinimized] = (0, import_react91.useState)(false);
+  const [isComplete, setIsComplete] = (0, import_react91.useState)(false);
   const dispatch = (0, import_react_redux43.useDispatch)();
+  const explorerUrl = (0, import_react_redux42.useSelector)(selectKimaExplorer);
   const mode = (0, import_react_redux42.useSelector)(selectMode);
   const feeDeduct = (0, import_react_redux42.useSelector)(selectFeeDeduct);
   const amount = (0, import_react_redux42.useSelector)(selectAmount);
@@ -5460,42 +5721,52 @@ var TransactionWidget = ({ theme }) => {
   const { successHandler, closeHandler } = useKimaContext();
   const backendUrl = (0, import_react_redux42.useSelector)(selectBackendUrl);
   const { data, error } = useGetTxData_default(txId, dAppOption, backendUrl);
-  const transactionSourceChain = (0, import_react90.useMemo)(
+  const { width: windowWidth, updateWidth } = useWidth_default();
+  (0, import_react91.useEffect)(() => {
+    windowWidth === 0 && updateWidth(window.innerWidth);
+  }, []);
+  const transactionSourceChain = (0, import_react91.useMemo)(
     () => networks.find(
       (network) => network.shortName === (mode === "status" /* status */ ? data?.sourceChain === "FIAT" ? "CC" : data?.sourceChain : sourceChain.shortName)
     ),
     [data, mode, sourceChain]
   );
-  const transactionTargetChain = (0, import_react90.useMemo)(
+  const transactionTargetChain = (0, import_react91.useMemo)(
     () => networks.find(
       (network) => network.shortName === (mode === "status" /* status */ ? data?.targetChain : targetChain.shortName)
     ),
     [data, mode, targetChain]
   );
-  const isValidTxId = (0, import_react90.useMemo)(() => {
+  const isValidTxId = (0, import_react91.useMemo)(() => {
     return !(!txId || typeof txId === "string" && txId.length === 0 || typeof txId === "number" && txId < 0);
   }, [txId]);
-  const isEmptyStatus = (0, import_react90.useMemo)(() => {
+  const isEmptyStatus = (0, import_react91.useMemo)(() => {
     if (!data) return true;
     return data?.amount === "";
   }, [data]);
   const { data: chainData } = useChainData(backendUrl);
-  (0, import_react90.useEffect)(() => {
+  (0, import_react91.useEffect)(() => {
     if (!data || data.status !== "Completed" /* COMPLETED */) return;
     successHandler && successHandler({
       txId
     });
   }, [data]);
-  (0, import_react90.useEffect)(() => {
+  (0, import_react91.useEffect)(() => {
+    if (!data) return;
+    if (data.status === "Completed" /* COMPLETED */) {
+      setIsComplete(true);
+    }
+  }, [data, setIsComplete]);
+  (0, import_react91.useEffect)(() => {
     if (error)
       import_react_hot_toast3.toast.error(
         "The provided transaction id is not valid, please use a different one or contact support for further assistance",
         {
-          icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
+          icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null)
         }
       );
   }, [error]);
-  (0, import_react90.useEffect)(() => {
+  (0, import_react91.useEffect)(() => {
     if (!data) {
       setStep(0);
       setLoadingStep(0);
@@ -5515,7 +5786,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(1);
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
-      import_react_hot_toast3.toast.error("Unavailable", { icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null) });
+      import_react_hot_toast3.toast.error("Unavailable", { icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null) });
       setErrorMessage("Unavailable");
     } else if (status === "Paid" /* PAID */) {
       setStep(3);
@@ -5526,7 +5797,7 @@ var TransactionWidget = ({ theme }) => {
       import_react_hot_toast3.toast.error(
         "Failed to release tokens to target! Starting refund process.",
         {
-          icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
+          icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null)
         }
       );
       setErrorMessage(
@@ -5537,7 +5808,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(3);
       setLoadingStep(-1);
       import_react_hot_toast3.toast.error("Failed to refund tokens to source!", {
-        icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
+        icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null)
       });
       setErrorMessage("Failed to refund tokens to source!");
     } else if (status === "RefundCompleted" /* REFUNDCOMPLETED */) {
@@ -5545,7 +5816,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(3);
       setLoadingStep(-1);
       import_react_hot_toast3.toast.success("Refund completed!", {
-        icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
+        icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null)
       });
       setErrorMessage("Refund completed!");
     } else if (status === "FailedToPay" /* FAILEDTOPAY */) {
@@ -5554,7 +5825,7 @@ var TransactionWidget = ({ theme }) => {
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
       import_react_hot_toast3.toast.error("Failed to release tokens to target!", {
-        icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null)
+        icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null)
       });
       setErrorMessage("Failed to release tokens to target!");
     } else if (status === "FailedToPull" /* FAILEDTOPULL */) {
@@ -5562,7 +5833,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(1);
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
-      import_react_hot_toast3.toast.error("Failed to pull tokens from source!", { icon: /* @__PURE__ */ import_react90.default.createElement(Error_default, null) });
+      import_react_hot_toast3.toast.error("Failed to pull tokens from source!", { icon: /* @__PURE__ */ import_react91.default.createElement(Error_default, null) });
       setErrorMessage("Failed to pull tokens from source!");
     } else if (status === "Completed" /* COMPLETED */) {
       setStep(4);
@@ -5575,7 +5846,7 @@ var TransactionWidget = ({ theme }) => {
     }
   }, [data?.status]);
   const resetForm = () => {
-    closeHandler && closeHandler();
+    setIsComplete(false);
     dispatch(resetServiceFee());
     if (mode === "light" /* light */) {
       dispatch(setMode("light" /* light */));
@@ -5617,41 +5888,76 @@ var TransactionWidget = ({ theme }) => {
     dispatch(
       setMode(transactionOption ? "payment" /* payment */ : "bridge" /* bridge */)
     );
-    dispatch(setAmount(""));
+    dispatch(setAmount(transactionOption?.amount.toString() || ""));
     dispatch(setCCTransactionId(""));
     dispatch(setCCTransactionStatus("idle"));
     dispatch(setTxId(-1));
     dispatch(setSubmitted(false));
   };
-  return /* @__PURE__ */ import_react90.default.createElement(import_react_redux41.Provider, { store }, /* @__PURE__ */ import_react90.default.createElement(
+  return /* @__PURE__ */ import_react91.default.createElement(import_react_redux41.Provider, { store }, /* @__PURE__ */ import_react91.default.createElement(
     "div",
     {
-      className: `kima-card transaction-card ${theme.colorMode} ${minimized ? "minimized" : ""}`,
+      className: `kima-card transaction-card ${isComplete ? "transaction-complete" : ""} ${theme.colorMode} ${minimized ? "minimized" : ""}`,
       style: {
         background: theme.colorMode === "light" /* light */ ? theme.backgroundColorLight : theme.backgroundColorDark
       }
     },
-    /* @__PURE__ */ import_react90.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "title" }, isValidTxId && !error ? /* @__PURE__ */ import_react90.default.createElement("div", { className: "transaction-title" }, mode !== "status" /* status */ ? data?.status === "Completed" /* COMPLETED */ ? "Transferred " : "Transfering " : isEmptyStatus ? "Fetching transaction status " : data?.status === "Completed" /* COMPLETED */ ? "Transfered " : "Transfering ", mode !== "status" /* status */ ? Number(amount) !== 0 ? transactionSourceChain?.shortName === "CC" ? bigIntToNumber(txValues.allowanceAmount).toFixed(2) : formatBigInt(txValues.allowanceAmount) : "" : data?.amount || "", " ", mode !== "status" /* status */ ? `${sourceSymbol} ` : isEmptyStatus ? "" : `(${data?.sourceSymbol})`, /* @__PURE__ */ import_react90.default.createElement("div", { className: "title-icon" }, /* @__PURE__ */ import_react90.default.createElement(
+    /* @__PURE__ */ import_react91.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "topbar" }, !isComplete && /* @__PURE__ */ import_react91.default.createElement("div", { className: "title" }, isValidTxId && !error ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "transaction-title" }, mode !== "status" /* status */ ? data?.status === "Completed" /* COMPLETED */ ? "Transferred " : "Transfering " : isEmptyStatus ? "Fetching transaction status " : data?.status === "Completed" /* COMPLETED */ ? "Transferred " : "Transfering ", mode !== "status" /* status */ ? Number(amount) !== 0 ? transactionSourceChain?.shortName === "CC" ? bigIntToNumber(txValues.allowanceAmount).toFixed(2) : formatBigInt(txValues.allowanceAmount) : "" : data?.amount || "", " ", mode !== "status" /* status */ ? `${sourceSymbol} ` : isEmptyStatus ? "" : `${data?.sourceSymbol}`, mode !== "status" /* status */ ? `\u2192 ` : isEmptyStatus ? "" : `\u2192 `, mode !== "status" /* status */ ? Number(amount) !== 0 ? transactionSourceChain?.shortName === "CC" ? bigIntToNumber(txValues.submitAmount).toFixed(2) : formatBigInt(txValues.submitAmount) : "" : data?.amount || "", " ", mode !== "status" /* status */ ? `${targetSymbol}${" "}` : isEmptyStatus ? "" : `${data?.targetSymbol}${" "}`) : /* @__PURE__ */ import_react91.default.createElement("div", null, /* @__PURE__ */ import_react91.default.createElement("h3", { className: "transaction" }, "Transaction Status"))), !minimized ? /* @__PURE__ */ import_react91.default.createElement(
+      "div",
+      {
+        className: `control-buttons ${isComplete ? "complete" : ""}`
+      },
+      isComplete && /* @__PURE__ */ import_react91.default.createElement(
+        "button",
+        {
+          className: "menu-button",
+          style: { marginRight: "auto" },
+          onClick: () => {
+            setIsComplete(false);
+          }
+        },
+        "< Back"
+      ),
+      /* @__PURE__ */ import_react91.default.createElement(
+        "button",
+        {
+          className: "icon-button minimize",
+          onClick: () => {
+            setMinimized(true);
+          }
+        },
+        /* @__PURE__ */ import_react91.default.createElement(Minimize_default, null)
+      ),
+      !isValidTxId || loadingStep < 0 || error && dAppOption !== "none" /* None */ ? /* @__PURE__ */ import_react91.default.createElement("button", { className: "reset-button", onClick: resetForm }, "Reset") : null,
+      closeHandler && /* @__PURE__ */ import_react91.default.createElement(
+        "button",
+        {
+          className: "cross-icon-button",
+          onClick: () => {
+            resetForm();
+            closeHandler(0);
+          }
+        },
+        /* @__PURE__ */ import_react91.default.createElement(Cross_default, null)
+      )
+    ) : /* @__PURE__ */ import_react91.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "maximize", onClick: () => setMinimized(false) }, "View"))), data && !isComplete && /* @__PURE__ */ import_react91.default.createElement("div", { className: "header-network-labels" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react91.default.createElement(
       ChainIcon,
       {
         symbol: transactionSourceChain?.shortName
       }
-    )), " ", mode !== "status" /* status */ ? `${transactionSourceChain?.name}` : isEmptyStatus ? "" : `${data?.sourceChain === "FIAT" ? "CC" : data?.sourceChain}`, " ", mode !== "status" /* status */ ? `\u2192 ` : isEmptyStatus ? "" : `\u2192 `, mode !== "status" /* status */ ? Number(amount) !== 0 ? transactionSourceChain?.shortName === "CC" ? bigIntToNumber(txValues.submitAmount).toFixed(2) : formatBigInt(txValues.submitAmount) : "" : data?.amount || "", " ", mode !== "status" /* status */ ? `${targetSymbol}${" "}` : isEmptyStatus ? "" : `${data?.targetSymbol}${" "}`, /* @__PURE__ */ import_react90.default.createElement("div", { className: "title-icon" }, /* @__PURE__ */ import_react90.default.createElement(
+    ), windowWidth > 450 && /* @__PURE__ */ import_react91.default.createElement("h3", null, transactionSourceChain?.name)), /* @__PURE__ */ import_react91.default.createElement(
+      "div",
+      {
+        style: { display: "inline-block", transform: "rotate(-90deg)" }
+      },
+      /* @__PURE__ */ import_react91.default.createElement(Arrow_default, { width: 25, height: 25 })
+    ), /* @__PURE__ */ import_react91.default.createElement("div", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ import_react91.default.createElement(
       ChainIcon,
       {
         symbol: transactionTargetChain?.shortName
       }
-    )), " ", mode !== "status" /* status */ ? `${transactionTargetChain?.name}${" "}` : isEmptyStatus ? "" : `${data?.targetChain} ${" "}`) : /* @__PURE__ */ import_react90.default.createElement("div", null, /* @__PURE__ */ import_react90.default.createElement("h3", { className: "transaction" }, "Transaction Status"))), !minimized ? /* @__PURE__ */ import_react90.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react90.default.createElement(
-      "button",
-      {
-        className: "icon-button minimize",
-        onClick: () => {
-          setMinimized(true);
-        }
-      },
-      /* @__PURE__ */ import_react90.default.createElement(Minimize_default, null)
-    ), !isValidTxId || loadingStep < 0 || error ? /* @__PURE__ */ import_react90.default.createElement("button", { className: "reset-button", onClick: resetForm }, "Reset") : null) : /* @__PURE__ */ import_react90.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "maximize", onClick: () => setMinimized(false) }, "View")))),
-    isValidTxId && !error ? /* @__PURE__ */ import_react90.default.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: "transaction-content" }, /* @__PURE__ */ import_react90.default.createElement(
+    ), windowWidth > 450 && /* @__PURE__ */ import_react91.default.createElement("h3", null, transactionTargetChain?.name)))),
+    isValidTxId && !error ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "kima-card-content" }, !isComplete ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "transaction-content" }, /* @__PURE__ */ import_react91.default.createElement(
       Progressbar_default,
       {
         step,
@@ -5660,7 +5966,7 @@ var TransactionWidget = ({ theme }) => {
         setFocus,
         loadingStep
       }
-    ), /* @__PURE__ */ import_react90.default.createElement(
+    ), /* @__PURE__ */ import_react91.default.createElement(
       StepBox_default,
       {
         step,
@@ -5668,14 +5974,67 @@ var TransactionWidget = ({ theme }) => {
         loadingStep,
         data
       }
-    )), !error && !isEmptyStatus && /* @__PURE__ */ import_react90.default.createElement(
+    )) : /* @__PURE__ */ import_react91.default.createElement("div", { className: "transaction-content transaction-complete" }, /* @__PURE__ */ import_react91.default.createElement(TransactionComplete_default, null), /* @__PURE__ */ import_react91.default.createElement("h2", null, "Transaction Complete"), /* @__PURE__ */ import_react91.default.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ import_react91.default.createElement(
+      "div",
+      {
+        className: `content-wrapper transaction-complete ${theme.colorMode}`
+      },
+      /* @__PURE__ */ import_react91.default.createElement("p", null, "You just transferred ", data?.amount, " ", data?.sourceSymbol),
+      /* @__PURE__ */ import_react91.default.createElement("div", { className: "header-network-labels" }, /* @__PURE__ */ import_react91.default.createElement(
+        "div",
+        {
+          className: `kima-card-network-label ${theme.colorMode}`
+        },
+        /* @__PURE__ */ import_react91.default.createElement(
+          ChainIcon,
+          {
+            symbol: transactionSourceChain?.shortName
+          }
+        ),
+        windowWidth > 450 && /* @__PURE__ */ import_react91.default.createElement("h3", null, transactionSourceChain?.name)
+      ), /* @__PURE__ */ import_react91.default.createElement(
+        "div",
+        {
+          style: {
+            display: "inline-block",
+            transform: "rotate(-90deg)"
+          }
+        },
+        /* @__PURE__ */ import_react91.default.createElement(Arrow_default, { width: 25, height: 25 })
+      ), /* @__PURE__ */ import_react91.default.createElement(
+        "div",
+        {
+          className: `kima-card-network-label ${theme.colorMode}`
+        },
+        /* @__PURE__ */ import_react91.default.createElement(
+          ChainIcon,
+          {
+            symbol: transactionTargetChain?.shortName
+          }
+        ),
+        windowWidth > 450 && /* @__PURE__ */ import_react91.default.createElement("h3", null, transactionTargetChain?.name)
+      ))
+    )), /* @__PURE__ */ import_react91.default.createElement("div", { className: "transaction-buttons" }, /* @__PURE__ */ import_react91.default.createElement(
+      SecondaryButton_default,
+      {
+        clickHandler: resetForm,
+        theme: theme.colorMode
+      },
+      "New Transaction"
+    ), /* @__PURE__ */ import_react91.default.createElement(
+      ExternalLink_default,
+      {
+        to: `${explorerUrl}/transactions/?tx=${data?.kimaTxHash}`
+      },
+      /* @__PURE__ */ import_react91.default.createElement(PrimaryButton_default, null, "View Details")
+    ))), !error && !isEmptyStatus && !isComplete && /* @__PURE__ */ import_react91.default.createElement(
       TransactionStatusMessage_default,
       {
         isCompleted: data?.status,
         transactionId: txId.toString()
       }
-    )) : /* @__PURE__ */ import_react90.default.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ import_react90.default.createElement("h4", { className: "subtitle" }, "You can follow the status of a previous submitted transaction by entering the provided transaction id"), /* @__PURE__ */ import_react90.default.createElement("div", { className: "single-form" }, /* @__PURE__ */ import_react90.default.createElement(TransactionSearch_default, null))),
-    /* @__PURE__ */ import_react90.default.createElement(
+    )) : /* @__PURE__ */ import_react91.default.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ import_react91.default.createElement("h4", { className: "subtitle" }, "You can follow the status of a previous submitted transaction by entering the provided transaction id"), /* @__PURE__ */ import_react91.default.createElement("div", { className: "single-form" }, /* @__PURE__ */ import_react91.default.createElement(TransactionSearch_default, null))),
+    /* @__PURE__ */ import_react91.default.createElement(
       import_react_hot_toast3.Toaster,
       {
         position: "top-right",
@@ -5702,7 +6061,13 @@ var TransactionWidget = ({ theme }) => {
         }
       }
     ),
-    /* @__PURE__ */ import_react90.default.createElement("div", { className: "floating-footer status" }, /* @__PURE__ */ import_react90.default.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ import_react90.default.createElement("span", null, "Powered by"), /* @__PURE__ */ import_react90.default.createElement(KimaNetwork_default, null)))
+    /* @__PURE__ */ import_react91.default.createElement(
+      "div",
+      {
+        className: `floating-footer ${isComplete ? "complete" : "status"}`
+      },
+      /* @__PURE__ */ import_react91.default.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ import_react91.default.createElement("span", null, "Powered by"), /* @__PURE__ */ import_react91.default.createElement(KimaNetwork_default, null))
+    )
   ));
 };
 
@@ -5711,31 +6076,35 @@ var import_react103 = __toESM(require("react"), 1);
 var import_react_redux56 = require("react-redux");
 
 // src/components/reusable/SingleForm.tsx
-var import_react92 = __toESM(require("react"), 1);
+var import_react93 = __toESM(require("react"), 1);
 var import_react_hot_toast4 = require("react-hot-toast");
 var import_react_redux46 = require("react-redux");
 
 // src/components/primary/NetworkSelector.tsx
-var import_react91 = __toESM(require("react"), 1);
+var import_react92 = __toESM(require("react"), 1);
 var import_react_redux44 = require("react-redux");
 var NetworkSelector = ({
   type,
   initialSelection,
   setInitialSelection
 }) => {
-  const [collapsed, setCollapsed] = (0, import_react91.useState)(true);
-  const ref = (0, import_react91.useRef)(null);
+  const [collapsed, setCollapsed] = (0, import_react92.useState)(true);
+  const ref = (0, import_react92.useRef)(null);
   const dispatch = (0, import_react_redux44.useDispatch)();
   const theme = (0, import_react_redux44.useSelector)(selectTheme);
   const networkOptions3 = (0, import_react_redux44.useSelector)(selectNetworks);
+  const transactionOption = (0, import_react_redux44.useSelector)(selectTransactionOption);
+  const dAppOption = (0, import_react_redux44.useSelector)(selectDappOption);
   const mode = (0, import_react_redux44.useSelector)(selectMode);
   const sourceNetwork = (0, import_react_redux44.useSelector)(selectSourceChain);
   const sourceSymbol = (0, import_react_redux44.useSelector)(selectSourceCurrency);
   const targetNetwork = (0, import_react_redux44.useSelector)(selectTargetChain);
   const { switchChainHandler } = useKimaContext();
   const isOriginSelector = type === "origin";
-  const networks = (0, import_react91.useMemo)(() => {
+  const networks = (0, import_react92.useMemo)(() => {
     return networkOptions3.filter((network) => {
+      if (dAppOption !== "none" /* None */ && network.shortName === "CC")
+        return false;
       const isSameAsSource = isOriginSelector ? false : network.shortName === sourceNetwork.shortName;
       const isAllowedInLightMode = mode !== "light" /* light */ || lightDemoNetworks.includes(network.shortName);
       const sourceToken = sourceNetwork.supportedTokens.find(
@@ -5749,8 +6118,18 @@ var NetworkSelector = ({
       }
       return network.supportedLocations.includes(type) && !isSameAsSource && supportsSourceCurrency && isAllowedInLightMode;
     });
-  }, [networkOptions3, sourceNetwork, sourceSymbol, type, mode]);
-  const selectedNetwork = (0, import_react91.useMemo)(() => {
+  }, [networkOptions3, sourceNetwork, sourceSymbol, type, mode, dAppOption]);
+  const shouldLockSourceNetwork = isOriginSelector && mode === "payment" /* payment */ && dAppOption !== "none" /* None */ && !!transactionOption?.targetChain;
+  const selectedNetwork = (0, import_react92.useMemo)(() => {
+    if (shouldLockSourceNetwork) {
+      const forcedNetwork = networks.find(
+        (n) => n.shortName === transactionOption.targetChain
+      );
+      return forcedNetwork || {
+        shortName: "",
+        name: "Invalid Source Network"
+      };
+    }
     if (initialSelection) {
       return {
         shortName: "",
@@ -5767,9 +6146,34 @@ var NetworkSelector = ({
     sourceNetwork,
     targetNetwork,
     isOriginSelector,
-    initialSelection
+    initialSelection,
+    shouldLockSourceNetwork,
+    transactionOption?.targetChain
   ]);
-  (0, import_react91.useEffect)(() => {
+  (0, import_react92.useEffect)(() => {
+    if (shouldLockSourceNetwork && isOriginSelector && transactionOption?.targetChain) {
+      const forcedNetwork = networks.find(
+        (n) => n.shortName === transactionOption.targetChain
+      );
+      if (forcedNetwork && forcedNetwork.id !== sourceNetwork.id) {
+        dispatch(setSourceChain(forcedNetwork));
+        setInitialSelection({
+          sourceSelection: false,
+          targetSelection: false
+        });
+        switchChainHandler && switchChainHandler(forcedNetwork);
+      }
+    }
+  }, [
+    shouldLockSourceNetwork,
+    transactionOption?.targetChain,
+    sourceNetwork.id,
+    isOriginSelector,
+    networks,
+    dispatch,
+    switchChainHandler
+  ]);
+  (0, import_react92.useEffect)(() => {
     if (!networks.length || selectedNetwork.shortName) return;
     const fallbackNetwork = networks[0];
     if (isOriginSelector) {
@@ -5801,7 +6205,7 @@ var NetworkSelector = ({
     type === "origin" ? setInitialSelection((prev) => ({ ...prev, sourceSelection: false })) : setInitialSelection((prev) => ({ ...prev, targetSelection: false }));
     setCollapsed(true);
   };
-  (0, import_react91.useEffect)(() => {
+  (0, import_react92.useEffect)(() => {
     const handleOutsideClick = (e) => {
       if (ref.current && !ref.current.contains(e.target)) {
         setCollapsed(true);
@@ -5812,7 +6216,7 @@ var NetworkSelector = ({
       document.removeEventListener("mousedown", handleOutsideClick);
     };
   }, []);
-  (0, import_react91.useEffect)(() => {
+  (0, import_react92.useEffect)(() => {
     if (mode !== "light" /* light */) return;
     if (isEVMChain(targetNetwork.shortName)) {
       dispatch(setTargetAddress(lightDemoAccounts.EVM));
@@ -5822,20 +6226,24 @@ var NetworkSelector = ({
       dispatch(setTargetAddress(lightDemoAccounts.TRX));
     }
   }, [sourceNetwork, targetNetwork, mode]);
-  return /* @__PURE__ */ import_react91.default.createElement(
+  return /* @__PURE__ */ import_react92.default.createElement(
     "div",
     {
-      className: `network-dropdown ${theme?.colorMode ?? ""} ${collapsed ? "collapsed" : "toggled"}`,
-      onClick: () => setCollapsed((prev) => !prev),
+      className: `network-dropdown ${theme?.colorMode ?? ""} ${collapsed ? "collapsed" : "toggled"} ${shouldLockSourceNetwork ? "disabled" : ""}`,
+      onClick: () => {
+        if (!shouldLockSourceNetwork) {
+          setCollapsed((prev) => !prev);
+        }
+      },
       ref
     },
-    /* @__PURE__ */ import_react91.default.createElement("div", { className: "network-wrapper" }, /* @__PURE__ */ import_react91.default.createElement(ChainIcon, { symbol: selectedNetwork.shortName }), /* @__PURE__ */ import_react91.default.createElement("span", null, selectedNetwork.name)),
-    /* @__PURE__ */ import_react91.default.createElement(
+    /* @__PURE__ */ import_react92.default.createElement("div", { className: "network-wrapper" }, /* @__PURE__ */ import_react92.default.createElement(ChainIcon, { symbol: selectedNetwork.shortName }), /* @__PURE__ */ import_react92.default.createElement("span", null, selectedNetwork.name)),
+    /* @__PURE__ */ import_react92.default.createElement(
       "div",
       {
         className: `network-menu custom-scrollbar ${theme?.colorMode ?? ""} ${collapsed ? "collapsed" : "toggled"}`
       },
-      networks.filter((network) => network.shortName !== selectedNetwork.shortName).map((network) => /* @__PURE__ */ import_react91.default.createElement(
+      networks.filter((network) => network.shortName !== selectedNetwork.shortName).map((network) => /* @__PURE__ */ import_react92.default.createElement(
         "div",
         {
           key: network.id,
@@ -5847,15 +6255,15 @@ var NetworkSelector = ({
             }
           }
         },
-        network.disabled ? /* @__PURE__ */ import_react91.default.createElement(Warning_default, { width: 25, height: 25 }) : /* @__PURE__ */ import_react91.default.createElement(ChainIcon, { symbol: network.shortName }),
-        /* @__PURE__ */ import_react91.default.createElement("p", null, network.name),
-        network.disabled && /* @__PURE__ */ import_react91.default.createElement("span", { className: "tooltip" }, "Temporarily unavailable")
+        network.disabled ? /* @__PURE__ */ import_react92.default.createElement(Warning_default, { width: 25, height: 25 }) : /* @__PURE__ */ import_react92.default.createElement(ChainIcon, { symbol: network.shortName }),
+        /* @__PURE__ */ import_react92.default.createElement("p", null, network.name),
+        network.disabled && /* @__PURE__ */ import_react92.default.createElement("span", { className: "tooltip" }, "Temporarily unavailable")
       ))
     ),
-    /* @__PURE__ */ import_react91.default.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ import_react91.default.createElement(Arrow_default, { fill: "none" }))
+    !shouldLockSourceNetwork && /* @__PURE__ */ import_react92.default.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ import_react92.default.createElement(Arrow_default, { fill: "none" }))
   );
 };
-var NetworkSelector_default = import_react91.default.memo(NetworkSelector);
+var NetworkSelector_default = import_react92.default.memo(NetworkSelector);
 
 // src/components/reusable/SingleForm.tsx
 var import_viem6 = require("viem");
@@ -5975,6 +6383,7 @@ var SingleForm = ({
   const theme = (0, import_react_redux46.useSelector)(selectTheme);
   const feeDeduct = (0, import_react_redux46.useSelector)(selectFeeDeduct);
   const { totalFee } = (0, import_react_redux46.useSelector)(selectServiceFee);
+  const dAppOption = (0, import_react_redux46.useSelector)(selectDappOption);
   const compliantOption = (0, import_react_redux46.useSelector)(selectCompliantOption);
   const targetCompliant = (0, import_react_redux46.useSelector)(selectTargetCompliant);
   const sourceAddress = (0, import_react_redux46.useSelector)(selectSourceAddress);
@@ -5982,7 +6391,7 @@ var SingleForm = ({
   const targetNetwork = (0, import_react_redux46.useSelector)(selectTargetChain);
   const targetAddress = (0, import_react_redux46.useSelector)(selectTargetAddress);
   const { isReady } = useIsWalletReady4();
-  const [amountValue, setAmountValue] = (0, import_react92.useState)("");
+  const [amountValue, setAmountValue] = (0, import_react93.useState)("");
   const amount = (0, import_react_redux46.useSelector)(selectAmount);
   const sourceCurrency = (0, import_react_redux46.useSelector)(selectSourceCurrency);
   const targetCurrency = (0, import_react_redux46.useSelector)(selectTargetCurrency);
@@ -6002,18 +6411,18 @@ var SingleForm = ({
     targetSymbol: targetCurrency,
     backendUrl
   });
-  (0, import_react92.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (fees) {
       dispatch(setServiceFee(fees));
     }
   }, [fees, dispatch]);
   const { kimaBackendUrl } = useKimaContext();
   const { data: envOptions } = useGetEnvOptions({ kimaBackendUrl });
-  const errorMessage = (0, import_react92.useMemo)(
+  const errorMessage = (0, import_react93.useMemo)(
     () => compliantOption && targetCompliant !== null && !targetCompliant?.isCompliant ? `Target address has ${targetCompliant.results?.[0].result.risk_score} risk` : "",
     [compliantOption, targetCompliant]
   );
-  const maxValue = (0, import_react92.useMemo)(() => {
+  const maxValue = (0, import_react93.useMemo)(() => {
     if (mode === "light" /* light */)
       return BigInt(
         envOptions?.transferLimitMaxUSDT ? parseFloat(envOptions?.transferLimitMaxUSDT) : 1e3
@@ -6023,17 +6432,17 @@ var SingleForm = ({
     const intAmount = (0, import_viem6.parseUnits)(amount, totalFee.decimals);
     return balance - intAmount;
   }, [balance, totalFee, feeDeduct]);
-  const feeCurrency = (0, import_react92.useMemo)(() => {
+  const feeCurrency = (0, import_react93.useMemo)(() => {
     const sourceToken = sourceNetwork.supportedTokens.find(
       (t) => t.symbol === sourceCurrency
     );
     return sourceToken?.peggedTo ?? "USD";
   }, [sourceNetwork, sourceCurrency]);
-  (0, import_react92.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (!errorMessage) return;
     import_react_hot_toast4.toast.error(errorMessage);
   }, [errorMessage]);
-  (0, import_react92.useEffect)(() => {
+  (0, import_react93.useEffect)(() => {
     if (amountValue && amount !== "") return;
     setAmountValue(amount);
   }, [amount]);
@@ -6061,10 +6470,13 @@ var SingleForm = ({
     setAmountValue(truncated);
     dispatch(setAmount(truncated));
   };
-  const isConnected = (0, import_react92.useMemo)(() => {
+  const isConnected = (0, import_react93.useMemo)(() => {
+    if (mode === "payment" /* payment */ && dAppOption !== "none" /* None */) {
+      return isReady;
+    }
     return isReady && !initialSelection.sourceSelection;
-  }, [isReady, initialSelection]);
-  return /* @__PURE__ */ import_react92.default.createElement("div", { className: "single-form" }, /* @__PURE__ */ import_react92.default.createElement("div", { className: "form-item" }, /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Source Network:"), /* @__PURE__ */ import_react92.default.createElement("div", { className: "items" }, /* @__PURE__ */ import_react92.default.createElement(
+  }, [isReady, initialSelection, mode, dAppOption]);
+  return /* @__PURE__ */ import_react93.default.createElement("div", { className: "single-form" }, /* @__PURE__ */ import_react93.default.createElement("div", { className: "form-item" }, /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, dAppOption === "none" /* None */ && "Source", " Network:"), /* @__PURE__ */ import_react93.default.createElement("div", { className: "items" }, /* @__PURE__ */ import_react93.default.createElement(
     NetworkSelector_default,
     {
       type: "origin",
@@ -6073,20 +6485,20 @@ var SingleForm = ({
         setInitialSelection
       }
     }
-  ), /* @__PURE__ */ import_react92.default.createElement(CoinDropdown_default, null))), /* @__PURE__ */ import_react92.default.createElement(
+  ), /* @__PURE__ */ import_react93.default.createElement(CoinDropdown_default, null))), /* @__PURE__ */ import_react93.default.createElement(
     "div",
     {
       className: `dynamic-area ${sourceNetwork.shortName === "FIAT" /* FIAT */ ? "reverse" : "1"}`
     },
-    sourceNetwork.compatibility !== "CC" /* CC */ && /* @__PURE__ */ import_react92.default.createElement(
+    sourceNetwork.compatibility !== "CC" /* CC */ && /* @__PURE__ */ import_react93.default.createElement(
       "div",
       {
         className: `form-item wallet-button-item ${isConnected && "connected"}`
       },
-      /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Wallet:"),
-      /* @__PURE__ */ import_react92.default.createElement(WalletButton_default, { initialSelection: initialSelection.sourceSelection })
+      /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, "Wallet:"),
+      /* @__PURE__ */ import_react93.default.createElement(WalletButton_default, { initialSelection: initialSelection.sourceSelection })
     ),
-    mode !== "payment" /* payment */ && /* @__PURE__ */ import_react92.default.createElement("div", { className: "form-item" }, /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Target Network:"), /* @__PURE__ */ import_react92.default.createElement("div", { className: "items" }, /* @__PURE__ */ import_react92.default.createElement(
+    mode !== "payment" /* payment */ && /* @__PURE__ */ import_react93.default.createElement("div", { className: "form-item" }, /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, "Target Network:"), /* @__PURE__ */ import_react93.default.createElement("div", { className: "items" }, /* @__PURE__ */ import_react93.default.createElement(
       NetworkSelector_default,
       {
         type: "target",
@@ -6095,38 +6507,39 @@ var SingleForm = ({
           setInitialSelection
         }
       }
-    ), /* @__PURE__ */ import_react92.default.createElement(CoinDropdown_default, { isSourceChain: false })))
-  ), mode === "bridge" /* bridge */ && sourceNetwork.shortName !== "FIAT" /* FIAT */ ? targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react92.default.createElement(BankInput_default, null) : /* @__PURE__ */ import_react92.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Target Address:"), /* @__PURE__ */ import_react92.default.createElement(
+    ), /* @__PURE__ */ import_react93.default.createElement(CoinDropdown_default, { isSourceChain: false })))
+  ), mode === "bridge" /* bridge */ && sourceNetwork.shortName !== "FIAT" /* FIAT */ ? targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ import_react93.default.createElement(BankInput_default, null) : /* @__PURE__ */ import_react93.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, "Target Address:"), /* @__PURE__ */ import_react93.default.createElement(
     AddressInput_default,
     {
       theme: theme.colorMode,
       placeholder: "Target address",
       initialSelection
     }
-  )) : null, mode === "light" /* light */ && /* @__PURE__ */ import_react92.default.createElement(
+  )) : null, mode === "light" /* light */ && /* @__PURE__ */ import_react93.default.createElement(
     "div",
     {
       className: `form-item wallet-button-item ${!initialSelection.targetSelection && "connected"}`,
       style: { display: "flex", alignItems: "center" }
     },
-    /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Target Wallet:"),
-    /* @__PURE__ */ import_react92.default.createElement(
+    /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, "Target Wallet:"),
+    /* @__PURE__ */ import_react93.default.createElement(
       WalletButton_default,
       {
         initialSelection: initialSelection.targetSelection,
         placeholder: true
       }
     )
-  ), mode === "bridge" /* bridge */ && /* @__PURE__ */ import_react92.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react92.default.createElement("span", { className: "label" }, "Amount:"), /* @__PURE__ */ import_react92.default.createElement("div", { className: `amount-label-container items ${theme.colorMode}` }, /* @__PURE__ */ import_react92.default.createElement(
+  ), /* @__PURE__ */ import_react93.default.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ import_react93.default.createElement("span", { className: "label" }, "Amount:"), /* @__PURE__ */ import_react93.default.createElement("div", { className: `amount-label-container items ${theme.colorMode}` }, /* @__PURE__ */ import_react93.default.createElement(
     "input",
     {
       className: `${theme.colorMode}`,
       type: "text",
       placeholder: "Enter amount",
       value: amountValue || "",
-      onChange: (e) => onAmountChange(e.target.value)
+      onChange: (e) => onAmountChange(e.target.value),
+      disabled: mode === "payment" /* payment */
     }
-  ), /* @__PURE__ */ import_react92.default.createElement("div", { className: "max-disclaimer" }, sourceNetwork.shortName !== "CC" && /* @__PURE__ */ import_react92.default.createElement("span", { className: "max-button", onClick: onMaxClick }, "Max"), +totalFee !== -1 && /* @__PURE__ */ import_react92.default.createElement("p", { className: "fee-amount" }, "Est fees:", " ", /* @__PURE__ */ import_react92.default.createElement("span", { className: `${isLoadingFees ? "loading" : ""}` }, " ", isLoadingFees ? "" : `$ ${formatBigInt(totalFee)} ${feeCurrency}`))))));
+  ), /* @__PURE__ */ import_react93.default.createElement("div", { className: "max-disclaimer" }, sourceNetwork.shortName !== "CC" && mode !== "payment" /* payment */ && /* @__PURE__ */ import_react93.default.createElement("span", { className: "max-button", onClick: onMaxClick }, "Max"), +totalFee !== -1 && dAppOption === "none" /* None */ && !initialSelection.sourceSelection && !initialSelection.targetSelection && /* @__PURE__ */ import_react93.default.createElement("p", { className: "fee-amount" }, "Est fees:", " ", /* @__PURE__ */ import_react93.default.createElement("span", { className: `${isLoadingFees ? "loading" : ""}` }, " ", isLoadingFees ? "" : `$ ${formatBigInt(totalFee)} ${feeCurrency}`))))));
 };
 var SingleForm_default = SingleForm;
 
@@ -6175,11 +6588,11 @@ function useAllowance2({
 var import_react_hot_toast5 = require("react-hot-toast");
 
 // plugins/solana/components/SolanaWalletConnectModal.tsx
-var import_react95 = __toESM(require("react"), 1);
+var import_react96 = __toESM(require("react"), 1);
 var import_react_redux49 = require("react-redux");
 
 // plugins/solana/components/SolanaWalletSelect.tsx
-var import_react93 = __toESM(require("react"), 1);
+var import_react94 = __toESM(require("react"), 1);
 var import_react_redux47 = require("react-redux");
 var import_wallet_adapter_react7 = require("@solana/wallet-adapter-react");
 var import_wallet_adapter_base = require("@solana/wallet-adapter-base");
@@ -6187,9 +6600,9 @@ var SolanaWalletSelect = () => {
   const theme = (0, import_react_redux47.useSelector)(selectTheme);
   const sourceChain = (0, import_react_redux47.useSelector)(selectSourceChain);
   const dispatch = (0, import_react_redux47.useDispatch)();
-  const sliderRef = (0, import_react93.useRef)();
+  const sliderRef = (0, import_react94.useRef)();
   const { wallet, wallets, select, connect, connected } = (0, import_wallet_adapter_react7.useWallet)();
-  const [detected, undetected] = (0, import_react93.useMemo)(() => {
+  const [detected, undetected] = (0, import_react94.useMemo)(() => {
     const detected2 = [];
     const undetected2 = [];
     for (const wallet2 of wallets) {
@@ -6201,7 +6614,7 @@ var SolanaWalletSelect = () => {
     }
     return [detected2, undetected2];
   }, [wallets]);
-  (0, import_react93.useEffect)(() => {
+  (0, import_react94.useEffect)(() => {
     let isDown = false;
     let startX;
     let scrollLeft;
@@ -6227,7 +6640,7 @@ var SolanaWalletSelect = () => {
       sliderRef.current.scrollLeft = scrollLeft - walk;
     });
   }, []);
-  const handleWalletClick = (0, import_react93.useCallback)(
+  const handleWalletClick = (0, import_react94.useCallback)(
     (walletName) => {
       logger_default.debug(
         "SolanaWalletSelect: handleWalletClick: walletName: ",
@@ -6237,7 +6650,7 @@ var SolanaWalletSelect = () => {
     },
     [select]
   );
-  (0, import_react93.useEffect)(() => {
+  (0, import_react94.useEffect)(() => {
     logger_default.debug("SolanaWalletSelect: useEffect: wallet: ", wallet);
     if (!wallet) return;
     if (sourceChain.shortName !== "SOL") {
@@ -6253,28 +6666,28 @@ var SolanaWalletSelect = () => {
     }
     dispatch(setSolanaConnectModal(false));
   }, [wallet, sourceChain]);
-  return /* @__PURE__ */ import_react93.default.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ import_react93.default.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ import_react93.default.createElement("div", { className: "wallet-container" }, detected.map((wallet2, index) => /* @__PURE__ */ import_react93.default.createElement(
+  return /* @__PURE__ */ import_react94.default.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "wallet-container" }, detected.map((wallet2, index) => /* @__PURE__ */ import_react94.default.createElement(
     "div",
     {
       className: `card-item ${theme.colorMode}`,
       onClick: () => handleWalletClick(wallet2.adapter.name),
       key: `${wallet2.adapter.name}-${index}`
     },
-    /* @__PURE__ */ import_react93.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react93.default.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ import_react93.default.createElement("span", null, wallet2.adapter.name))
-  )), undetected.map((wallet2, index) => /* @__PURE__ */ import_react93.default.createElement(
+    /* @__PURE__ */ import_react94.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react94.default.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ import_react94.default.createElement("span", null, wallet2.adapter.name))
+  )), undetected.map((wallet2, index) => /* @__PURE__ */ import_react94.default.createElement(
     ExternalLink_default,
     {
       to: wallet2.adapter.url,
       className: `card-item ${theme.colorMode}`,
       key: `${wallet2.adapter.name}-${index}`
     },
-    /* @__PURE__ */ import_react93.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react93.default.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ import_react93.default.createElement("span", null, "Install ", wallet2.adapter.name))
+    /* @__PURE__ */ import_react94.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react94.default.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ import_react94.default.createElement("span", null, "Install ", wallet2.adapter.name))
   )))));
 };
 var SolanaWalletSelect_default = SolanaWalletSelect;
 
 // plugins/solana/components/AccountDetailsModal.tsx
-var import_react94 = __toESM(require("react"), 1);
+var import_react95 = __toESM(require("react"), 1);
 var import_react_redux48 = require("react-redux");
 var import_wallet_adapter_react8 = require("@solana/wallet-adapter-react");
 var AccountDetailsModal = () => {
@@ -6287,7 +6700,7 @@ var AccountDetailsModal = () => {
   const { disconnect: solanaWalletDisconnect } = (0, import_wallet_adapter_react8.useWallet)();
   const { balance: solBalance } = useGetSolBalance_default();
   const networkDetails = networkOptions2[0];
-  const explorerUrl = (0, import_react94.useMemo)(() => {
+  const explorerUrl = (0, import_react95.useMemo)(() => {
     return `https://solscan.io/account/${walletAddress}?cluster=${networkOption === "mainnet" ? "mainnet" : "devnet"}`;
   }, [walletAddress, networkOption]);
   const handleDisconnect = () => {
@@ -6295,25 +6708,25 @@ var AccountDetailsModal = () => {
     dispatch(setAccountDetailsModal(false));
   };
   if (sourceChain.shortName !== "SOL") return;
-  return /* @__PURE__ */ import_react94.default.createElement(
+  return /* @__PURE__ */ import_react95.default.createElement(
     "div",
     {
       className: `kima-modal ${theme.colorMode} ${accountDetailsModal && "open"}`
     },
-    /* @__PURE__ */ import_react94.default.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ import_react94.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react94.default.createElement("h3", null, "Account Details")), /* @__PURE__ */ import_react94.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react94.default.createElement(
+    /* @__PURE__ */ import_react95.default.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ import_react95.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react95.default.createElement("h3", null, "Account Details")), /* @__PURE__ */ import_react95.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react95.default.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setAccountDetailsModal(false))
       },
-      /* @__PURE__ */ import_react94.default.createElement(
+      /* @__PURE__ */ import_react95.default.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ import_react94.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react94.default.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ import_react94.default.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ import_react94.default.createElement("div", { className: "address" }, /* @__PURE__ */ import_react94.default.createElement("h2", null, getShortenedAddress(walletAddress || "")), /* @__PURE__ */ import_react94.default.createElement(CopyButton_default, { text: walletAddress })), /* @__PURE__ */ import_react94.default.createElement("h3", null, formatterFloat.format(Number(solBalance)), " $SOL")), /* @__PURE__ */ import_react94.default.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ import_react94.default.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ import_react94.default.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ import_react94.default.createElement("p", null, "Block explorer"), /* @__PURE__ */ import_react94.default.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ import_react94.default.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Discconect")))
+    )))), /* @__PURE__ */ import_react95.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ import_react95.default.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ import_react95.default.createElement("div", { className: "address" }, /* @__PURE__ */ import_react95.default.createElement("h2", null, getShortenedAddress(walletAddress || "")), /* @__PURE__ */ import_react95.default.createElement(CopyButton_default, { text: walletAddress })), /* @__PURE__ */ import_react95.default.createElement("h3", null, formatterFloat.format(Number(solBalance)), " $SOL")), /* @__PURE__ */ import_react95.default.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ import_react95.default.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ import_react95.default.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ import_react95.default.createElement("p", null, "Block explorer"), /* @__PURE__ */ import_react95.default.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ import_react95.default.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Discconect")))
   );
 };
 var AccountDetailsModal_default = AccountDetailsModal;
@@ -6323,18 +6736,18 @@ var SolanaWalletConnectModal = () => {
   const dispatch = (0, import_react_redux49.useDispatch)();
   const theme = (0, import_react_redux49.useSelector)(selectTheme);
   const connectModal = (0, import_react_redux49.useSelector)(selectSolanaConnectModal);
-  return /* @__PURE__ */ import_react95.default.createElement("div", null, /* @__PURE__ */ import_react95.default.createElement(AccountDetailsModal_default, null), /* @__PURE__ */ import_react95.default.createElement(
+  return /* @__PURE__ */ import_react96.default.createElement("div", null, /* @__PURE__ */ import_react96.default.createElement(AccountDetailsModal_default, null), /* @__PURE__ */ import_react96.default.createElement(
     "div",
     {
       className: `kima-modal wallet-connect ${connectModal ? "open" : ""}`
     },
-    /* @__PURE__ */ import_react95.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react95.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react95.default.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ import_react95.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react95.default.createElement(
+    /* @__PURE__ */ import_react96.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react96.default.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ import_react96.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react96.default.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setSolanaConnectModal(false))
       },
-      /* @__PURE__ */ import_react95.default.createElement(
+      /* @__PURE__ */ import_react96.default.createElement(
         Cross_default,
         {
           width: 30,
@@ -6342,17 +6755,17 @@ var SolanaWalletConnectModal = () => {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ import_react95.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react95.default.createElement(SolanaWalletSelect_default, null)))
+    )))), /* @__PURE__ */ import_react96.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react96.default.createElement(SolanaWalletSelect_default, null)))
   ));
 };
 var SolanaWalletConnectModal_default = SolanaWalletConnectModal;
 
 // plugins/tron/components/TronWalletConnectModal.tsx
-var import_react98 = __toESM(require("react"), 1);
+var import_react99 = __toESM(require("react"), 1);
 var import_react_redux52 = require("react-redux");
 
 // plugins/tron/components/AccountDetailsModal.tsx
-var import_react96 = __toESM(require("react"), 1);
+var import_react97 = __toESM(require("react"), 1);
 var import_react_redux50 = require("react-redux");
 var import_tronwallet_adapter_react_hooks7 = require("@tronweb3/tronwallet-adapter-react-hooks");
 var AccountDetailsModal2 = () => {
@@ -6365,11 +6778,11 @@ var AccountDetailsModal2 = () => {
   const { disconnect: tronWalletDisconnect } = (0, import_tronwallet_adapter_react_hooks7.useWallet)();
   const { balance: tronBalance } = useGetTrxBalance_default();
   const selectedNetwork = (0, import_react_redux50.useSelector)(selectSourceChain);
-  const networkDetails = (0, import_react96.useMemo)(
+  const networkDetails = (0, import_react97.useMemo)(
     () => networkOptions.find(({ id }) => id === selectedNetwork.shortName),
     [selectedNetwork]
   );
-  const explorerUrl = (0, import_react96.useMemo)(() => {
+  const explorerUrl = (0, import_react97.useMemo)(() => {
     return `https://${networkOption === "testnet" && "nile."}tronscan.io/#/address/${connectedAddress}`;
   }, [connectedAddress, networkOption]);
   const handleDisconnect = () => {
@@ -6377,37 +6790,37 @@ var AccountDetailsModal2 = () => {
     dispatch(setAccountDetailsModal(false));
   };
   if (sourcheChain.shortName !== "TRX") return;
-  return /* @__PURE__ */ import_react96.default.createElement(
+  return /* @__PURE__ */ import_react97.default.createElement(
     "div",
     {
       className: `kima-modal ${theme.colorMode} ${accountDetailsModal && "open"}`
     },
-    /* @__PURE__ */ import_react96.default.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ import_react96.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react96.default.createElement("h3", null, "Account Details")), /* @__PURE__ */ import_react96.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react96.default.createElement(
+    /* @__PURE__ */ import_react97.default.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ import_react97.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react97.default.createElement("h3", null, "Account Details")), /* @__PURE__ */ import_react97.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react97.default.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setAccountDetailsModal(false))
       },
-      /* @__PURE__ */ import_react96.default.createElement(
+      /* @__PURE__ */ import_react97.default.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ import_react96.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react96.default.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ import_react96.default.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ import_react96.default.createElement("div", { className: "address" }, /* @__PURE__ */ import_react96.default.createElement("h2", null, getShortenedAddress(connectedAddress || "")), /* @__PURE__ */ import_react96.default.createElement(CopyButton_default, { text: connectedAddress })), /* @__PURE__ */ import_react96.default.createElement("h3", null, formatterFloat.format(Number(tronBalance)), " ", selectedNetwork.shortName)), /* @__PURE__ */ import_react96.default.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ import_react96.default.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ import_react96.default.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ import_react96.default.createElement("p", null, "Block explorer"), /* @__PURE__ */ import_react96.default.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ import_react96.default.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Disconnect")))
+    )))), /* @__PURE__ */ import_react97.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ import_react97.default.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ import_react97.default.createElement("div", { className: "address" }, /* @__PURE__ */ import_react97.default.createElement("h2", null, getShortenedAddress(connectedAddress || "")), /* @__PURE__ */ import_react97.default.createElement(CopyButton_default, { text: connectedAddress })), /* @__PURE__ */ import_react97.default.createElement("h3", null, formatterFloat.format(Number(tronBalance)), " ", selectedNetwork.shortName)), /* @__PURE__ */ import_react97.default.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ import_react97.default.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ import_react97.default.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ import_react97.default.createElement("p", null, "Block explorer"), /* @__PURE__ */ import_react97.default.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ import_react97.default.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Disconnect")))
   );
 };
 var AccountDetailsModal_default2 = AccountDetailsModal2;
 
 // plugins/tron/components/TronWalletSelect.tsx
-var import_react97 = __toESM(require("react"), 1);
+var import_react98 = __toESM(require("react"), 1);
 var import_react_redux51 = require("react-redux");
 var import_tronwallet_adapter_react_hooks8 = require("@tronweb3/tronwallet-adapter-react-hooks");
 var import_tronwallet_abstract_adapter2 = require("@tronweb3/tronwallet-abstract-adapter");
 var TronWalletSelect = () => {
   const theme = (0, import_react_redux51.useSelector)(selectTheme);
-  const sliderRef = (0, import_react97.useRef)();
+  const sliderRef = (0, import_react98.useRef)();
   const dispatch = (0, import_react_redux51.useDispatch)();
   const {
     wallets,
@@ -6416,7 +6829,7 @@ var TronWalletSelect = () => {
     connect,
     connected
   } = (0, import_tronwallet_adapter_react_hooks8.useWallet)();
-  const [detected, undetected] = (0, import_react97.useMemo)(() => {
+  const [detected, undetected] = (0, import_react98.useMemo)(() => {
     const detected2 = [];
     const undetected2 = [];
     for (const wallet of wallets) {
@@ -6428,7 +6841,7 @@ var TronWalletSelect = () => {
     }
     return [detected2, undetected2];
   }, [wallets]);
-  (0, import_react97.useEffect)(() => {
+  (0, import_react98.useEffect)(() => {
     let isDown = false;
     let startX;
     let scrollLeft;
@@ -6454,28 +6867,28 @@ var TronWalletSelect = () => {
       sliderRef.current.scrollLeft = scrollLeft - walk;
     });
   }, []);
-  (0, import_react97.useEffect)(() => {
+  (0, import_react98.useEffect)(() => {
     connected && dispatch(setTronConnectModal(false));
   }, [connected]);
   const connectWallet = async (walletName) => {
     currentWallet?.adapter.name === walletName ? await connect() : select(walletName);
   };
-  return /* @__PURE__ */ import_react97.default.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ import_react97.default.createElement("div", { className: "wallet-container" }, detected.map((wallet, index) => /* @__PURE__ */ import_react97.default.createElement(
+  return /* @__PURE__ */ import_react98.default.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ import_react98.default.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ import_react98.default.createElement("div", { className: "wallet-container" }, detected.map((wallet, index) => /* @__PURE__ */ import_react98.default.createElement(
     "div",
     {
       className: `card-item ${theme.colorMode}`,
       onClick: () => connectWallet(wallet.adapter.name),
       key: `${wallet.adapter.name}-${index}`
     },
-    /* @__PURE__ */ import_react97.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react97.default.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ import_react97.default.createElement("span", null, wallet.adapter.name))
-  )), undetected.map((wallet, index) => /* @__PURE__ */ import_react97.default.createElement(
+    /* @__PURE__ */ import_react98.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react98.default.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ import_react98.default.createElement("span", null, wallet.adapter.name))
+  )), undetected.map((wallet, index) => /* @__PURE__ */ import_react98.default.createElement(
     ExternalLink_default,
     {
       to: wallet.adapter.url,
       className: `card-item ${theme.colorMode}`,
       key: `${wallet.adapter.name}-${index}`
     },
-    /* @__PURE__ */ import_react97.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react97.default.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ import_react97.default.createElement("span", null, "Install ", wallet.adapter.name))
+    /* @__PURE__ */ import_react98.default.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ import_react98.default.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ import_react98.default.createElement("span", null, "Install ", wallet.adapter.name))
   )))));
 };
 var TronWalletSelect_default = TronWalletSelect;
@@ -6485,31 +6898,31 @@ var TronWalletConnectModal = () => {
   const dispatch = (0, import_react_redux52.useDispatch)();
   const theme = (0, import_react_redux52.useSelector)(selectTheme);
   const connectModal = (0, import_react_redux52.useSelector)(selectTronConnectModal);
-  return /* @__PURE__ */ import_react98.default.createElement("div", null, /* @__PURE__ */ import_react98.default.createElement(AccountDetailsModal_default2, null), /* @__PURE__ */ import_react98.default.createElement(
+  return /* @__PURE__ */ import_react99.default.createElement("div", null, /* @__PURE__ */ import_react99.default.createElement(AccountDetailsModal_default2, null), /* @__PURE__ */ import_react99.default.createElement(
     "div",
     {
       className: `kima-modal wallet-connect ${theme.colorMode} ${connectModal ? "open" : ""}`
     },
-    /* @__PURE__ */ import_react98.default.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ import_react98.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react98.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react98.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react98.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react98.default.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ import_react98.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react98.default.createElement(
+    /* @__PURE__ */ import_react99.default.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ import_react99.default.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ import_react99.default.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ import_react99.default.createElement("div", { className: "topbar" }, /* @__PURE__ */ import_react99.default.createElement("div", { className: "title" }, /* @__PURE__ */ import_react99.default.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ import_react99.default.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ import_react99.default.createElement(
       "button",
       {
         className: "icon-button",
         onClick: () => dispatch(setTronConnectModal(false))
       },
-      /* @__PURE__ */ import_react98.default.createElement(
+      /* @__PURE__ */ import_react99.default.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ import_react98.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react98.default.createElement(TronWalletSelect_default, null)))
+    )))), /* @__PURE__ */ import_react99.default.createElement("div", { className: "modal-content" }, /* @__PURE__ */ import_react99.default.createElement(TronWalletSelect_default, null)))
   ));
 };
 var TronWalletConnectModal_default = TronWalletConnectModal;
 
 // src/hooks/useValidateTransaction.tsx
-var import_react99 = require("react");
+var import_react100 = require("react");
 var import_viem7 = require("viem");
 var import_react_redux53 = require("react-redux");
 var import_loglevel2 = __toESM(require("loglevel"), 1);
@@ -6538,7 +6951,7 @@ var useValidateTransaction = (inputs) => {
   const { data: envOptions } = useGetEnvOptions({ kimaBackendUrl });
   const mode = (0, import_react_redux53.useSelector)(selectMode);
   const networkOption = (0, import_react_redux53.useSelector)(selectNetworkOption);
-  const maxValue = (0, import_react99.useMemo)(() => {
+  const maxValue = (0, import_react100.useMemo)(() => {
     import_loglevel2.default.debug("useValidateTransaction: maxValue: ", inputs);
     if (!balance) return BigInt(0);
     if (totalFee <= BigInt(0)) return balance;
@@ -6597,7 +7010,7 @@ var useValidateTransaction = (inputs) => {
       };
     }
     if (compliantOption) {
-      if (!sourceCompliant?.isCompliant) {
+      if (!sourceCompliant?.isCompliant && sourceChain !== "CC") {
         return {
           error: "ValidationError" /* Error */,
           message: "Source address compliance check failed"
@@ -6655,8 +7068,7 @@ var useValidateTransaction_default = useValidateTransaction;
 // src/hooks/useSubmitTransaction.tsx
 var import_react_redux54 = require("react-redux");
 var import_react_query16 = require("@tanstack/react-query");
-var import_react100 = require("react");
-var useSubmitTransaction = () => {
+var useSubmitTransaction = (isSubmitting, setIsSubmitting) => {
   const dispatch = (0, import_react_redux54.useDispatch)();
   const backendUrl = (0, import_react_redux54.useSelector)(selectBackendUrl);
   const mode = (0, import_react_redux54.useSelector)(selectMode);
@@ -6665,7 +7077,6 @@ var useSubmitTransaction = () => {
   const txValues = feeDeduct ? transactionValues.feeFromTarget : transactionValues.feeFromOrigin;
   const ccTransactionIdSeed = (0, import_react_redux54.useSelector)(selectCCTransactionIdSeed);
   const submitted = (0, import_react_redux54.useSelector)(selectSubmitted);
-  const [isSubmitting, setIsSubmitting] = (0, import_react100.useState)(false);
   const mutation = (0, import_react_query16.useMutation)({
     mutationFn: async (signature) => {
       setIsSubmitting(true);
@@ -6764,6 +7175,8 @@ var getCompliance = async (walletAddress, compliantOption, backendUrl) => {
 
 // src/hooks/useComplianceCheck.tsx
 var useComplianceCheck = (walletAddress, compliantOption, backendUrl) => {
+  const enabled = !!walletAddress && walletAddress.length >= 34 && // debounce for a minimum of characters (tron length)
+  !!compliantOption && compliantOption && !!backendUrl;
   const {
     data: complianceData,
     error,
@@ -6773,9 +7186,7 @@ var useComplianceCheck = (walletAddress, compliantOption, backendUrl) => {
     queryFn: async () => {
       return await getCompliance(walletAddress, compliantOption, backendUrl);
     },
-    enabled: !!walletAddress && walletAddress.length >= 34 && // debounce for a minimum of characters (tron length)
-    !!compliantOption && compliantOption && !!backendUrl,
-    // Only fetch when valid inputs exist
+    enabled,
     retry: 1
     // Retry once on failure
   });
@@ -6964,6 +7375,7 @@ var TransferWidget = ({
   const dispatch = (0, import_react_redux56.useDispatch)();
   const mainRef = (0, import_react103.useRef)(null);
   const [signature, setSignature2] = (0, import_react103.useState)("");
+  const [isSubmitting, setIsSubmitting] = (0, import_react103.useState)(false);
   const [formStep, setFormStep] = (0, import_react103.useState)(0);
   const [warningModalOpen, setWarningModalOpen] = (0, import_react103.useState)(null);
   const [resetModalOpen, setResetModalOpen] = (0, import_react103.useState)(false);
@@ -6999,6 +7411,10 @@ var TransferWidget = ({
   const ccTransactionStatus = (0, import_react_redux56.useSelector)(selectCCTransactionStatus);
   const { width: windowWidth } = useWidth_default();
   const { disconnectWallet } = useDisconnectWallet5();
+  const { submitTransaction } = useSubmitTransaction_default(
+    isSubmitting,
+    setIsSubmitting
+  );
   const { allowance, balance, isApproved, approve, decimals, signMessage } = useAllowance2({
     setApproving,
     setCancellingApprove
@@ -7062,7 +7478,6 @@ var TransferWidget = ({
       setInitialSelection((prev) => ({ ...prev, targetSelection: false }));
     }
   }, [fees, mode, transactionOption, dispatch]);
-  const { submitTransaction, isSubmitting } = useSubmitTransaction_default();
   const isBackButtonEnabled = (0, import_react103.useMemo)(() => {
     if (formStep !== 0) {
       if (sourceChain.shortName === "CC") {
@@ -7096,8 +7511,9 @@ var TransferWidget = ({
       dispatch(setCCTransactionStatus("initialized"));
       return;
     }
-    if (error2 === "ApprovalNeeded" /* ApprovalNeeded */ && mode !== "light" /* light */) {
+    if (error2 === "ApprovalNeeded" /* ApprovalNeeded */ && mode !== "light" /* light */ && dAppOption === "none" /* None */) {
       if (!signature) {
+        setApproving(true);
         setFeeOptionDisabled(true);
         const sig2 = await signMessage?.({
           targetAddress,
@@ -7106,15 +7522,17 @@ var TransferWidget = ({
           originChain: sourceChain.shortName
         });
         setSignature2(sig2);
+        setApproving(false);
       }
       return approve();
     }
+    setIsSubmitting(true);
     if (dAppOption === "LPDrain" /* LPDrain */ || dAppOption === "LPAdd" /* LPAdd */) {
-      keplrHandler?.(sourceAddress);
+      await keplrHandler?.(sourceAddress);
       return;
     }
     let sig = signature;
-    if (!sig && mode !== "light" /* light */) {
+    if (!sig && mode !== "light" /* light */ && dAppOption === "none" /* None */) {
       setFeeOptionDisabled(true);
       sig = await signMessage?.({
         targetAddress,
@@ -7161,9 +7579,9 @@ var TransferWidget = ({
         return "Next";
       }
       if (isApproved) {
-        return isSubmitting ? "Submitting..." : "Submit";
+        return isSubmitting ? !signature && dAppOption === "none" /* None */ ? "Signing..." : "Submitting..." : "Submit";
       } else {
-        return isApproving ? "Approving..." : "Approve";
+        return isApproving ? !signature && dAppOption === "none" /* None */ ? "Signing..." : "Approving..." : !signature && dAppOption === "none" /* None */ ? "Sign" : "Approve";
       }
     }
     if (isLoadingFees) {
@@ -7178,7 +7596,6 @@ var TransferWidget = ({
   };
   const resetForm = async () => {
     if (isApproving || isSubmitting || isSigning) return;
-    closeHandler && closeHandler(0);
     setSignature2("");
     setSigning(false);
     setFormStep(0);
@@ -7263,6 +7680,16 @@ var TransferWidget = ({
         disabled: isApproving || isSubmitting || isSigning
       },
       "Reset"
+    ), closeHandler && /* @__PURE__ */ import_react103.default.createElement(
+      "button",
+      {
+        className: "cross-icon-button",
+        onClick: () => {
+          resetForm();
+          closeHandler(0);
+        }
+      },
+      /* @__PURE__ */ import_react103.default.createElement(Cross_default, null)
     ))), mode === "payment" /* payment */ && paymentTitleOption?.title && /* @__PURE__ */ import_react103.default.createElement("h4", { className: "subtitle" }, paymentTitleOption.title)), /* @__PURE__ */ import_react103.default.createElement("div", { className: "kima-card-content", ref: mainRef }, formStep === 0 ? /* @__PURE__ */ import_react103.default.createElement(
       SingleForm_default,
       {
@@ -7297,7 +7724,7 @@ var TransferWidget = ({
           disabled: isApproving || isSubmitting || isSigning
         },
         formStep > 0 && ccTransactionStatus !== "initialized" ? "Back" : "Cancel"
-      ), !!allowance && allowance > 0 && formStep !== 0 && sourceChain.shortName !== "CC" && mode !== "light" /* light */ ? /* @__PURE__ */ import_react103.default.createElement(
+      ), !!allowance && allowance > 0 && formStep !== 0 && sourceChain.shortName !== "CC" && mode !== "light" /* light */ && dAppOption !== "LPDrain" /* LPDrain */ ? /* @__PURE__ */ import_react103.default.createElement(
         SecondaryButton_default,
         {
           clickHandler: onCancelApprove,
@@ -7458,7 +7885,7 @@ var KimaWidgetWrapper = ({
   titleOption,
   paymentTitleOption,
   helpURL = "",
-  compliantOption = true,
+  compliantOption = false,
   transactionOption,
   chainData,
   envOptions