@kimafinance/kima-transaction-widget 1.4.8 → 1.4.10

package/dist/index.js

@@ -1,9 +1,10 @@
 "use client";
 
 // src/KimaProvider.tsx
-import * as React49 from "react";
+import * as React50 from "react";
 import { createContext, useContext, useMemo as useMemo7 } from "react";
 import { Provider, useSelector as useSelector16 } from "react-redux";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 
 // src/store/index.tsx
 import { configureStore } from "@reduxjs/toolkit";
@@ -188,7 +189,7 @@ var Arrow_default = Arrow;
 
 // src/assets/icons/Lock.tsx
 import React8 from "react";
-var Lock = ({ width = 24, height = 27, fill = "none", ...rest }) => {
+var Lock = ({ width = 24, height = 24, fill = "none", ...rest }) => {
   return /* @__PURE__ */ React8.createElement(
     "svg",
     {
@@ -1436,6 +1437,264 @@ var EURC = ({ width = 100, height = 100, ...rest }) => {
 };
 var EURC_default = EURC;
 
+// src/assets/icons/TransactionComplete.tsx
+import React42 from "react";
+var TransactionComplete = ({ width = 140, height = 120, ...rest }) => {
+  return /* @__PURE__ */ React42.createElement(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: "0 0 141 116",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...rest
+    },
+    /* @__PURE__ */ React42.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__ */ React42.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__ */ React42.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__ */ React42.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__ */ React42.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__ */ React42.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__ */ React42.createElement("g", { filter: "url(#filter0_d_1838_5769)" }, /* @__PURE__ */ React42.createElement("circle", { cx: "70.3622", cy: "57.9308", r: "37.9308", fill: "white" }), /* @__PURE__ */ React42.createElement(
+      "circle",
+      {
+        cx: "70.3622",
+        cy: "57.9308",
+        r: "36.0021",
+        stroke: "url(#paint6_linear_1838_5769)",
+        strokeWidth: "3.85736"
+      }
+    )),
+    /* @__PURE__ */ React42.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__ */ React42.createElement("defs", null, /* @__PURE__ */ React42.createElement(
+      "filter",
+      {
+        id: "filter0_d_1838_5769",
+        x: "13.1446",
+        y: "0.713175",
+        width: "114.435",
+        height: "114.435",
+        filterUnits: "userSpaceOnUse",
+        colorInterpolationFilters: "sRGB"
+      },
+      /* @__PURE__ */ React42.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+      /* @__PURE__ */ React42.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__ */ React42.createElement("feOffset", null),
+      /* @__PURE__ */ React42.createElement("feGaussianBlur", { stdDeviation: "9.64341" }),
+      /* @__PURE__ */ React42.createElement("feComposite", { in2: "hardAlpha", operator: "out" }),
+      /* @__PURE__ */ React42.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__ */ React42.createElement(
+        "feBlend",
+        {
+          mode: "normal",
+          in2: "BackgroundImageFix",
+          result: "effect1_dropShadow_1838_5769"
+        }
+      ),
+      /* @__PURE__ */ React42.createElement(
+        "feBlend",
+        {
+          mode: "normal",
+          in: "SourceGraphic",
+          in2: "effect1_dropShadow_1838_5769",
+          result: "shape"
+        }
+      )
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint0_linear_1838_5769",
+        x1: "140.724",
+        y1: "64.3599",
+        x2: "149.724",
+        y2: "64.3599",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint1_linear_1838_5769",
+        x1: "133.009",
+        y1: "39.9302",
+        x2: "142.009",
+        y2: "39.9302",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint2_linear_1838_5769",
+        x1: "136.866",
+        y1: "89.4331",
+        x2: "145.867",
+        y2: "89.4331",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint3_linear_1838_5769",
+        x1: "0",
+        y1: "72.7974",
+        x2: "9.00052",
+        y2: "72.7974",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint4_linear_1838_5769",
+        x1: "7.71472",
+        y1: "97.2271",
+        x2: "16.7152",
+        y2: "97.2271",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint5_linear_1838_5769",
+        x1: "3.85742",
+        y1: "47.7251",
+        x2: "12.8579",
+        y2: "47.7251",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint6_linear_1838_5769",
+        x1: "32.4314",
+        y1: "57.9308",
+        x2: "108.293",
+        y2: "57.9308",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ), /* @__PURE__ */ React42.createElement(
+      "linearGradient",
+      {
+        id: "paint7_linear_1838_5769",
+        x1: "47.8611",
+        y1: "56.8389",
+        x2: "91.9709",
+        y2: "56.8389",
+        gradientUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React42.createElement("stop", { stopColor: "#ADF4A6" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.315", stopColor: "#80D7F5" }),
+      /* @__PURE__ */ React42.createElement("stop", { offset: "0.775", stopColor: "#9990D5" })
+    ))
+  );
+};
+var TransactionComplete_default = TransactionComplete;
+
 // src/utils/constants.tsx
 import {
   arbitrum,
@@ -1647,11 +1906,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
@@ -2098,9 +2357,6 @@ var getAllPlugins = () => {
   return pluginRegistry;
 };
 
-// src/KimaProvider.tsx
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-
 // src/hooks/useGetEnvOptions.tsx
 import { useQuery } from "@tanstack/react-query";
 
@@ -2172,7 +2428,7 @@ var useGetEnvOptions = ({
 };
 
 // plugins/evm/index.tsx
-import React43 from "react";
+import React44 from "react";
 
 // plugins/PluginBase.ts
 var PluginBase = class {
@@ -2209,7 +2465,7 @@ var PluginBase = class {
 };
 
 // plugins/evm/features/walletConnect/WalletProvider.tsx
-import React42, { useEffect, useState } from "react";
+import React43, { useEffect, useState } from "react";
 
 // plugins/evm/config/modalConfig.ts
 import { createAppKit } from "@reown/appkit/react";
@@ -2301,9 +2557,9 @@ var WalletProvider = ({
     }
   }, [networkOption, isLoading, walletConnectProjectId]);
   if (!isReady) {
-    return /* @__PURE__ */ React42.createElement(React42.Fragment, null);
+    return /* @__PURE__ */ React43.createElement(React43.Fragment, null);
   }
-  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, children);
+  return /* @__PURE__ */ React43.createElement(React43.Fragment, null, children);
 };
 var WalletProvider_default = WalletProvider;
 
@@ -2893,12 +3149,13 @@ function useEvmAllowance() {
   const sourceChain = useSelector4(selectSourceChain);
   const sourceAddress = useSelector4(selectSourceAddress);
   const networkOption = useSelector4(selectNetworkOption);
+  const dAppOption = useSelector4(selectDappOption);
   const { transactionValues } = useSelector4(selectServiceFee);
   const selectedCoin = useSelector4(selectSourceCurrency);
   const tokenOptions = useSelector4(selectTokenOptions);
   const backendUrl = useSelector4(selectBackendUrl);
   const feeDeduct = useSelector4(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();
@@ -3000,7 +3257,9 @@ function useEvmAllowance() {
 import { useDisconnect } from "@reown/appkit/react";
 function useDisconnectWallet() {
   const { disconnect } = useDisconnect();
-  return { disconnectWallet: disconnect };
+  return {
+    disconnectWallet: disconnect
+  };
 }
 var useDisconnectWallet_default = useDisconnectWallet;
 
@@ -3027,7 +3286,7 @@ var EvmPlugin = class extends PluginBase {
     walletConnectProjectId,
     isLoading
   }) => {
-    return /* @__PURE__ */ React43.createElement(
+    return /* @__PURE__ */ React44.createElement(
       WalletProvider_default,
       {
         children,
@@ -3043,10 +3302,10 @@ var evmPlugin = new EvmPlugin(store);
 var evm_default = evmPlugin;
 
 // plugins/solana/index.tsx
-import React45 from "react";
+import React46 from "react";
 
 // plugins/solana/features/walletConnect/WalletProvider.tsx
-import React44 from "react";
+import React45 from "react";
 import {
   ConnectionProvider,
   WalletProvider as SolanaWalletProvider
@@ -3084,7 +3343,7 @@ var WalletProvider2 = ({
   logger_default.debug(
     `WalletProvider initialized with projectId: ${walletConnectProjectId}`
   );
-  return /* @__PURE__ */ React44.createElement(ConnectionProvider, { endpoint }, /* @__PURE__ */ React44.createElement(
+  return /* @__PURE__ */ React45.createElement(ConnectionProvider, { endpoint }, /* @__PURE__ */ React45.createElement(
     SolanaWalletProvider,
     {
       autoConnect: false,
@@ -3151,10 +3410,12 @@ import { useSelector as useSelector8 } from "react-redux";
 
 // plugins/solana/core/hooks/useBalance.tsx
 import { useSelector as useSelector7 } from "react-redux";
+import { useQuery as useQuery7 } from "@tanstack/react-query";
+import { PublicKey as PublicKey6 } from "@solana/web3.js";
 
 // plugins/solana/utils/getTokenAllowance.tsx
-import { getAssociatedTokenAddress } from "@solana/spl-token";
 import { PublicKey as PublicKey4 } from "@solana/web3.js";
+import { getAssociatedTokenAddress } from "@solana/spl-token";
 var getTokenAllowance2 = async ({
   tokenOptions,
   selectedCoin,
@@ -3195,9 +3456,6 @@ var getTokenAllowance2 = async ({
   }
 };
 
-// plugins/solana/core/hooks/useBalance.tsx
-import { useQuery as useQuery7 } from "@tanstack/react-query";
-
 // plugins/solana/core/hooks/useSolanaProvider.ts
 import { useSelector as useSelector6 } from "react-redux";
 import { useConnection as useConnection2, useWallet as useWallet2 } from "@solana/wallet-adapter-react";
@@ -3225,7 +3483,6 @@ var useSolanaProvider = () => {
 };
 
 // plugins/solana/core/hooks/useBalance.tsx
-import { PublicKey as PublicKey6 } from "@solana/web3.js";
 var emptyResult2 = {};
 function useBalance2() {
   const sourceChain = useSelector7(selectSourceChain);
@@ -3441,7 +3698,7 @@ var SolanaPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ React45.createElement(
+    return /* @__PURE__ */ React46.createElement(
       WalletProvider_default2,
       {
         networkOption,
@@ -3455,10 +3712,10 @@ var solanaPlugin = new SolanaPlugin(store);
 var solana_default = solanaPlugin;
 
 // plugins/tron/index.tsx
-import React47 from "react";
+import React48 from "react";
 
 // plugins/tron/features/walletConnect/WalletProvider.tsx
-import React46, { useMemo as useMemo3 } from "react";
+import React47, { useMemo as useMemo3 } from "react";
 import { WalletProvider as TronWalletProviderBase } from "@tronweb3/tronwallet-adapter-react-hooks";
 import { LedgerAdapter } from "@tronweb3/tronwallet-adapter-ledger";
 import { TronLinkAdapter } from "@tronweb3/tronwallet-adapter-tronlink";
@@ -3500,7 +3757,7 @@ var WalletProvider3 = ({ children, networkOption }) => {
       adapters[0].switchChain("0x2b6653dc");
     }
   };
-  return /* @__PURE__ */ React46.createElement(
+  return /* @__PURE__ */ React47.createElement(
     TronWalletProviderBase,
     {
       adapters,
@@ -3612,6 +3869,7 @@ var useTronProvider = () => {
 
 // plugins/tron/core/hooks/useBalance.tsx
 import { useSelector as useSelector12 } from "react-redux";
+import { useQuery as useQuery9 } from "@tanstack/react-query";
 
 // plugins/tron/utils/ethereum/erc20ABI.json
 var erc20ABI_default = {
@@ -3868,7 +4126,6 @@ var getTokenAllowance3 = async ({
 };
 
 // plugins/tron/core/hooks/useBalance.tsx
-import { useQuery as useQuery9 } from "@tanstack/react-query";
 var emptyResult3 = {};
 function useBalance3() {
   const mode = useSelector12(selectMode);
@@ -4058,7 +4315,7 @@ var TronPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ React47.createElement(
+    return /* @__PURE__ */ React48.createElement(
       WalletProvider_default3,
       {
         networkOption,
@@ -4072,7 +4329,7 @@ var tronPlugin = new TronPlugin(store);
 var tron_default = tronPlugin;
 
 // plugins/credit-card/index.tsx
-import React48 from "react";
+import React49 from "react";
 
 // plugins/credit-card/core/hooks/useIsProviderReady.tsx
 import { useDispatch as useDispatch5, useSelector as useSelector15 } from "react-redux";
@@ -4128,7 +4385,7 @@ var CreditCardPlugin = class extends PluginBase {
     return chain.compatibility === "CC";
   };
   Provider = ({ children }) => {
-    return /* @__PURE__ */ React48.createElement(React48.Fragment, null, children);
+    return /* @__PURE__ */ React49.createElement(React49.Fragment, null, children);
   };
 };
 var creditCardPlugin = new CreditCardPlugin(store);
@@ -4149,7 +4406,7 @@ var useKimaContext = () => {
   }
   return context;
 };
-var InternalKimaProvider = React49.memo(
+var InternalKimaProvider = React50.memo(
   ({ kimaBackendUrl, walletConnectProjectId, children, logLevel }) => {
     const { data: envOptions, isLoading } = useGetEnvOptions({
       kimaBackendUrl
@@ -4163,7 +4420,7 @@ var InternalKimaProvider = React49.memo(
         const plugin = getPluginProvider(pluginData.id);
         if (plugin) {
           const { Provider: Provider3 } = plugin;
-          return /* @__PURE__ */ React49.createElement(
+          return /* @__PURE__ */ React50.createElement(
             Provider3,
             {
               key: plugin.data.id,
@@ -4177,12 +4434,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,
@@ -4217,7 +4474,7 @@ var KimaProvider = ({
     errorHandler,
     switchChainHandler
   };
-  return /* @__PURE__ */ React49.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React49.createElement(Provider, { store }, /* @__PURE__ */ React49.createElement(KimaContext.Provider, { value: kimaContext }, /* @__PURE__ */ React49.createElement(
+  return /* @__PURE__ */ React50.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React50.createElement(Provider, { store }, /* @__PURE__ */ React50.createElement(KimaContext.Provider, { value: kimaContext }, /* @__PURE__ */ React50.createElement(
     InternalKimaProvider,
     {
       kimaBackendUrl,
@@ -4229,17 +4486,17 @@ var KimaProvider = ({
 var KimaProvider_default = KimaProvider;
 
 // src/components/KimaTransactionWidget.tsx
-import React88, { useEffect as useEffect24, useState as useState18 } from "react";
+import React89, { useEffect as useEffect24, useState as useState17 } from "react";
 
 // src/components/KimaWidgetWrapper.tsx
-import React86, { useEffect as useEffect23 } from "react";
+import React87, { useEffect as useEffect23 } from "react";
 import { useDispatch as useDispatch27, useSelector as useSelector47 } from "react-redux";
 
 // src/components/TransactionWidget.tsx
-import React73, { useEffect as useEffect15, useMemo as useMemo12, useState as useState11 } from "react";
+import React74, { useEffect as useEffect15, useMemo as useMemo12, useState as useState11 } from "react";
 
 // src/components/reusable/Progressbar.tsx
-import React50 from "react";
+import React51 from "react";
 import { useSelector as useSelector17 } from "react-redux";
 var stepInfo = [
   {
@@ -4260,12 +4517,12 @@ var stepInfo = [
 ];
 var Progressbar = ({ step, errorStep, setFocus, loadingStep }) => {
   const theme = useSelector17(selectTheme);
-  return /* @__PURE__ */ React50.createElement("div", { className: "kima-progressbar" }, /* @__PURE__ */ React50.createElement(
+  return /* @__PURE__ */ React51.createElement("div", { className: "kima-progressbar" }, /* @__PURE__ */ React51.createElement(
     "div",
     {
       className: `value step-${step * 100 / 4}`
     }
-  ), /* @__PURE__ */ React50.createElement("div", { className: "step-indicators" }, stepInfo.map((item, index) => /* @__PURE__ */ React50.createElement(
+  ), /* @__PURE__ */ React51.createElement("div", { className: "step-indicators" }, stepInfo.map((item, index) => /* @__PURE__ */ React51.createElement(
     "div",
     {
       key: item.title,
@@ -4276,14 +4533,14 @@ var Progressbar = ({ step, errorStep, setFocus, loadingStep }) => {
         if (index < 4) setFocus(index);
       }
     },
-    /* @__PURE__ */ React50.createElement("div", { className: "step-info" }, step < index && /* @__PURE__ */ React50.createElement(Lock_default, null), step >= index ? index === loadingStep ? /* @__PURE__ */ React50.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ React50.createElement(Warning_default, null) : /* @__PURE__ */ React50.createElement(Check_default, null) : null, /* @__PURE__ */ React50.createElement("span", null, item.title))
+    /* @__PURE__ */ React51.createElement("div", { className: "step-info" }, step < index && /* @__PURE__ */ React51.createElement(Lock_default, null), step >= index ? index === loadingStep ? /* @__PURE__ */ React51.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ React51.createElement(Warning_default, null) : /* @__PURE__ */ React51.createElement(Check_default, null) : null, /* @__PURE__ */ React51.createElement("span", null, item.title))
   ))));
 };
 var Progressbar_default = Progressbar;
 
 // src/components/reusable/ExternalLink.tsx
-import React51 from "react";
-var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ React51.createElement(
+import React52 from "react";
+var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ React52.createElement(
   "a",
   {
     className,
@@ -4297,20 +4554,20 @@ var ExternalLink = ({ to, children, className, rest }) => /* @__PURE__ */ React5
 var ExternalLink_default = ExternalLink;
 
 // src/components/reusable/NetworkLabel.tsx
-import React52 from "react";
+import React53 from "react";
 import { useSelector as useSelector18 } from "react-redux";
 
 // src/components/reusable/PrimaryButton.tsx
-import React55 from "react";
+import React56 from "react";
 
 // src/assets/loading/180-ring.tsx
-import React53 from "react";
+import React54 from "react";
 var Loading180Ring = ({
   width = 24,
   height = 24,
   fill = "white"
 }) => {
-  return /* @__PURE__ */ React53.createElement(
+  return /* @__PURE__ */ React54.createElement(
     "svg",
     {
       width,
@@ -4319,7 +4576,7 @@ var Loading180Ring = ({
       viewBox: "0 0 24 24",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React53.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__ */ React53.createElement(
+    /* @__PURE__ */ React54.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__ */ React54.createElement(
       "animateTransform",
       {
         attributeName: "transform",
@@ -4334,7 +4591,7 @@ var Loading180Ring = ({
 var ring_default = Loading180Ring;
 
 // src/assets/loading/6-dots-scale.tsx
-import React54 from "react";
+import React55 from "react";
 
 // src/components/reusable/PrimaryButton.tsx
 var PrimaryButton = ({
@@ -4345,7 +4602,7 @@ var PrimaryButton = ({
   disabled = false,
   ref
 }) => {
-  return /* @__PURE__ */ React55.createElement("div", { className: "primary-button-wrapper" }, /* @__PURE__ */ React55.createElement(
+  return /* @__PURE__ */ React56.createElement("div", { className: "primary-button-wrapper" }, /* @__PURE__ */ React56.createElement(
     "button",
     {
       className: `primary-button ${className}`,
@@ -4353,14 +4610,14 @@ var PrimaryButton = ({
       ref,
       disabled
     },
-    isLoading && /* @__PURE__ */ React55.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React55.createElement(ring_default, { width: 24, height: 24, fill: "white" })),
+    isLoading && /* @__PURE__ */ React56.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React56.createElement(ring_default, { width: 24, height: 24, fill: "white" })),
     children
   ));
 };
 var PrimaryButton_default = PrimaryButton;
 
 // src/components/reusable/SecondaryButton.tsx
-import React56 from "react";
+import React57 from "react";
 var SecondaryButton = ({
   className,
   clickHandler,
@@ -4369,7 +4626,7 @@ var SecondaryButton = ({
   style,
   disabled = false,
   isLoading
-}) => /* @__PURE__ */ React56.createElement(
+}) => /* @__PURE__ */ React57.createElement(
   "button",
   {
     className: `secondary-button ${className} ${theme}`,
@@ -4377,18 +4634,18 @@ var SecondaryButton = ({
     ...style,
     disabled
   },
-  isLoading && /* @__PURE__ */ React56.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React56.createElement(ring_default, { width: 24, height: 24, fill: "black" })),
+  isLoading && /* @__PURE__ */ React57.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React57.createElement(ring_default, { width: 24, height: 24, fill: "black" })),
   children
 );
 var SecondaryButton_default = SecondaryButton;
 
 // src/components/reusable/Dropdown.tsx
-import React57 from "react";
+import React58 from "react";
 import { useDispatch as useDispatch6 } from "react-redux";
 import { useSelector as useSelector19 } from "react-redux";
 
 // src/components/reusable/WalletButton.tsx
-import React60, { useEffect as useEffect10, useMemo as useMemo8 } from "react";
+import React61, { useEffect as useEffect10, useMemo as useMemo8 } from "react";
 import { useDispatch as useDispatch7, useSelector as useSelector21 } from "react-redux";
 
 // src/hooks/useGetCurrentPlugin.tsx
@@ -4396,7 +4653,7 @@ import { useEffect as useEffect6, useState as useState5 } from "react";
 import { useSelector as useSelector20 } from "react-redux";
 
 // plugins/default/index.tsx
-import React58 from "react";
+import React59 from "react";
 var DefaultPlugin = class extends PluginBase {
   constructor(store2) {
     super({
@@ -4431,7 +4688,7 @@ var DefaultPlugin = class extends PluginBase {
     networkOption,
     walletConnectProjectId
   }) => {
-    return /* @__PURE__ */ React58.createElement("div", null, children);
+    return /* @__PURE__ */ React59.createElement("div", null, children);
   };
 };
 var defaultPlugin = new DefaultPlugin(store);
@@ -4524,7 +4781,7 @@ import { useWallet as useTronWallet2 } from "@tronweb3/tronwallet-adapter-react-
 import { useAppKit, useAppKitState } from "@reown/appkit/react";
 
 // src/components/reusable/CopyButton.tsx
-import React59, { useEffect as useEffect8, useState as useState7 } from "react";
+import React60, { useEffect as useEffect8, useState as useState7 } from "react";
 var CopyButton = ({ text }) => {
   const [copyClicked, setCopyClicked] = useState7(false);
   useEffect8(() => {
@@ -4533,7 +4790,7 @@ var CopyButton = ({ text }) => {
       setCopyClicked(false);
     }, 2e3);
   }, [copyClicked]);
-  return /* @__PURE__ */ React59.createElement(
+  return /* @__PURE__ */ React60.createElement(
     "span",
     {
       className: "copy-btn",
@@ -4542,7 +4799,7 @@ var CopyButton = ({ text }) => {
         navigator.clipboard.writeText(text);
       }
     },
-    copyClicked ? /* @__PURE__ */ React59.createElement(Check_default, null) : /* @__PURE__ */ React59.createElement(Copy_default, null)
+    copyClicked ? /* @__PURE__ */ React60.createElement(Check_default, null) : /* @__PURE__ */ React60.createElement(Copy_default, null)
   );
 };
 var CopyButton_default = CopyButton;
@@ -4698,6 +4955,7 @@ var WalletButton = ({
   const compliantOption = useSelector21(selectCompliantOption);
   const selectedNetwork = useSelector21(selectSourceChain);
   const targetAddress = useSelector21(selectTargetAddress);
+  const dAppOption = useSelector21(selectDappOption);
   const { externalProvider } = useKimaContext();
   const { connected: isSolanaConnected } = useSolanaWallet2();
   const { connected: isTronConnected } = useTronWallet2();
@@ -4759,8 +5017,11 @@ var WalletButton = ({
     return "";
   }, [isReady, statusMessage, sourceCompliant, compliantOption]);
   const isConnected = useMemo8(() => {
+    if (mode === "payment" /* payment */ && dAppOption !== "none" /* None */) {
+      return isReady;
+    }
     return isReady && !initialSelection;
-  }, [isReady, initialSelection]);
+  }, [isReady, initialSelection, mode, dAppOption]);
   useEffect10(() => {
     if (!isReady) {
       dispatch(setSourceAddress(""));
@@ -4768,13 +5029,13 @@ var WalletButton = ({
     }
     dispatch(setSourceAddress(connectedAddress));
   }, [isReady]);
-  return /* @__PURE__ */ React60.createElement(
+  return /* @__PURE__ */ React61.createElement(
     "div",
     {
       className: `wallet-button ${isConnected ? "connected" : "disconnected"} ${theme.colorMode} ${errorBelow ? "error-below" : ""}`,
       "data-testid": "connect-wallet-btn"
     },
-    /* @__PURE__ */ React60.createElement("div", { className: "info-wrapper" }, /* @__PURE__ */ React60.createElement(
+    /* @__PURE__ */ React61.createElement("div", { className: "info-wrapper" }, /* @__PURE__ */ React61.createElement(
       "button",
       {
         className: `${isConnected ? "connected" : "disconnected"} ${width < 640 && "shortened"} ${theme.colorMode}`,
@@ -4784,16 +5045,16 @@ 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__ */ React60.createElement(Wallet_default, null),
+      !isConnected && mode !== "light" /* light */ && !initialSelection && /* @__PURE__ */ React61.createElement(Wallet_default, null),
       !isConnected && mode !== "light" /* light */ && !initialSelection && "Connect Wallet"
-    ), isConnected && !placeholder && /* @__PURE__ */ React60.createElement(CopyButton_default, { text: connectedAddress })),
-    isConnected && !placeholder && balance !== void 0 && decimals !== void 0 ? /* @__PURE__ */ React60.createElement("p", { className: "balance-info" }, formatUSD(bigIntToNumber({ value: balance, decimals })), " ", selectedCoin, " available") : null
+    ), isConnected && !placeholder && /* @__PURE__ */ React61.createElement(CopyButton_default, { text: connectedAddress })),
+    isConnected && !placeholder && balance !== void 0 && decimals !== void 0 ? /* @__PURE__ */ React61.createElement("p", { className: "balance-info" }, formatUSD(bigIntToNumber({ value: balance, decimals })), " ", selectedCoin, " available") : null
   );
 };
 var WalletButton_default = WalletButton;
 
 // src/components/reusable/CoinDropdown.tsx
-import React62, { useEffect as useEffect12, useRef, useState as useState8 } from "react";
+import React63, { useEffect as useEffect12, useRef, useState as useState8 } from "react";
 import { useSelector as useSelector23 } from "react-redux";
 import { useDispatch as useDispatch9 } from "react-redux";
 
@@ -4866,7 +5127,7 @@ function useCurrencyOptions(isSourceChain) {
 }
 
 // src/components/reusable/TokenIcon.tsx
-import React61 from "react";
+import React62 from "react";
 var COIN_LIST = {
   EUR: KEUR_default,
   EURC: EURC_default,
@@ -4891,7 +5152,7 @@ function TokenIcon({
     logger_default.warn(`Token icon not found for symbol: ${symbol}`);
     return null;
   }
-  return /* @__PURE__ */ React61.createElement("div", { className: "icon-wrapper" }, /* @__PURE__ */ React61.createElement(Icon, { width, height }));
+  return /* @__PURE__ */ React62.createElement("div", { className: "icon-wrapper" }, /* @__PURE__ */ React62.createElement(Icon, { width, height }));
 }
 
 // src/components/reusable/CoinDropdown.tsx
@@ -4902,10 +5163,24 @@ var CoinDropdown = ({
   const dispatch = useDispatch9();
   const [collapsed, setCollapsed] = useState8(true);
   const sourceCurrency = useSelector23(selectSourceCurrency);
+  const mode = useSelector23(selectMode);
+  const dAppOption = useSelector23(selectDappOption);
+  const transactionOption = useSelector23(selectTransactionOption);
   const targetCurrency = useSelector23(selectTargetCurrency);
   const { tokenList } = useCurrencyOptions(isSourceChain);
   const theme = useSelector23(selectTheme);
   const tokenSymbol = isSourceChain ? sourceCurrency : targetCurrency;
+  const shouldLockToken = isSourceChain && mode === "payment" /* payment */ && dAppOption !== "none" /* None */ && !!transactionOption?.currency;
+  useEffect12(() => {
+    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]);
   useEffect12(() => {
     const bodyMouseDowntHandler = (e) => {
       if (ref?.current && !ref.current.contains(e.target)) {
@@ -4924,41 +5199,43 @@ var CoinDropdown = ({
       dispatch(setTargetCurrency(symbol));
     }
   };
-  return /* @__PURE__ */ React62.createElement(
+  return /* @__PURE__ */ React63.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__ */ React62.createElement("div", { className: "coin-wrapper" }, /* @__PURE__ */ React62.createElement(TokenIcon, { symbol: tokenSymbol, width: 24, height: 24 }), /* @__PURE__ */ React62.createElement("span", { className: "coin" }, tokenSymbol)),
-    /* @__PURE__ */ React62.createElement(
+    /* @__PURE__ */ React63.createElement("div", { className: "coin-wrapper" }, /* @__PURE__ */ React63.createElement(TokenIcon, { symbol: tokenSymbol, width: 24, height: 24 }), /* @__PURE__ */ React63.createElement("span", { className: "coin" }, tokenSymbol)),
+    /* @__PURE__ */ React63.createElement(
       "div",
       {
         className: `coin-menu ${theme.colorMode} ${collapsed ? "collapsed" : "toggled"}`
       },
-      tokenList.map((token) => /* @__PURE__ */ React62.createElement(
+      tokenList.map((token) => /* @__PURE__ */ React63.createElement(
         "div",
         {
           className: `coin-item ${theme.colorMode}`,
           key: token.symbol,
           onClick: () => handleDropdownItemClick(token.symbol)
         },
-        /* @__PURE__ */ React62.createElement(TokenIcon, { symbol: token.symbol, width: 24, height: 24 }),
-        /* @__PURE__ */ React62.createElement("p", null, token.symbol)
+        /* @__PURE__ */ React63.createElement(TokenIcon, { symbol: token.symbol, width: 24, height: 24 }),
+        /* @__PURE__ */ React63.createElement("p", null, token.symbol)
       ))
     ),
-    /* @__PURE__ */ React62.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ React62.createElement(Arrow_default, { fill: "none" }))
+    !shouldLockToken && /* @__PURE__ */ React63.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ React63.createElement(Arrow_default, { fill: "none" }))
   );
 };
 var CoinDropdown_default = CoinDropdown;
 
 // src/components/reusable/ConfirmDetails.tsx
-import React65, { useEffect as useEffect13, useMemo as useMemo10, useState as useState9 } from "react";
+import React66, { useEffect as useEffect13, useMemo as useMemo10, useState as useState9 } from "react";
 import { useSelector as useSelector25 } from "react-redux";
 
 // src/components/reusable/ChainIcon.tsx
-import React63 from "react";
+import React64 from "react";
 var chainIcons = {
   ARB: Arbitrum_default,
   AVX: Avalanche_default,
@@ -4980,13 +5257,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__ */ React63.createElement("div", null);
+    return /* @__PURE__ */ React64.createElement("div", null);
   }
-  return /* @__PURE__ */ React63.createElement("div", { className: "icon" }, /* @__PURE__ */ React63.createElement(Icon, null));
+  return /* @__PURE__ */ React64.createElement("div", { className: "icon" }, /* @__PURE__ */ React64.createElement(Icon, null));
 }
 
 // src/components/reusable/FeeDeductionRadioButtons.tsx
-import React64 from "react";
+import React65 from "react";
 import { useDispatch as useDispatch10, useSelector as useSelector24 } from "react-redux";
 var FeeDeductionRadioButtons = ({ disabled }) => {
   const dispatch = useDispatch10();
@@ -5003,7 +5280,7 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
   const handleChange = (value) => {
     dispatch(setFeeDeduct(value));
   };
-  return /* @__PURE__ */ React64.createElement("div", { className: `fee-deduction-radio-container ${theme.colorMode}` }, /* @__PURE__ */ React64.createElement("div", { className: "fee-options" }, Number(amount) - totalFee > 0 && /* @__PURE__ */ React64.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ React64.createElement(
+  return /* @__PURE__ */ React65.createElement("div", { className: `fee-deduction-radio-container ${theme.colorMode}` }, /* @__PURE__ */ React65.createElement("div", { className: "fee-options" }, Number(amount) - totalFee > 0 && /* @__PURE__ */ React65.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ React65.createElement(
     "input",
     {
       type: "radio",
@@ -5012,11 +5289,11 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
       disabled,
       onChange: () => handleChange(true)
     }
-  ), /* @__PURE__ */ React64.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
+  ), /* @__PURE__ */ React65.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__ */ React64.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ React64.createElement(
+  )} ${targetCurrency} in ${targetNetwork.name}`)), /* @__PURE__ */ React65.createElement("label", { className: `fee-option ${disabled ? "disabled" : ""}` }, /* @__PURE__ */ React65.createElement(
     "input",
     {
       type: "radio",
@@ -5025,7 +5302,7 @@ var FeeDeductionRadioButtons = ({ disabled }) => {
       disabled,
       onChange: () => handleChange(false)
     }
-  ), /* @__PURE__ */ React64.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
+  ), /* @__PURE__ */ React65.createElement("span", { className: `radio-label ${theme.colorMode}` }, `Pay $${formatterFloat.format(
     Number(amount) + totalFee
   )} ${sourceCurrency} in ${sourceNetwork.name} to receive $${formatterFloat.format(
     Number(amount)
@@ -5066,13 +5343,13 @@ var ConfirmDetails = ({
   useEffect13(() => {
     width === 0 && updateWidth(window.innerWidth);
   }, []);
-  return /* @__PURE__ */ React65.createElement("div", { className: `confirm-details ${theme.colorMode}` }, /* @__PURE__ */ React65.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__ */ React65.createElement("div", null, /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React65.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React65.createElement(ChainIcon, { symbol: originNetwork?.shortName }), "FIAT"), /* @__PURE__ */ React65.createElement("p", null, "ES6621000418401234567891")), /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React65.createElement("p", null, "Kima Sandbox")), /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "BIC:"), /* @__PURE__ */ React65.createElement("p", null, "CAIXESBBXXX")), /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "Description:"), /* @__PURE__ */ React65.createElement("p", { className: "signature" }, signature))) : /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "Source ", originNetwork.shortName !== "CC" && "wallet", ":"), /* @__PURE__ */ React65.createElement("div", { className: "network-details" }, /* @__PURE__ */ React65.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ React65.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React65.createElement(ChainIcon, { symbol: originNetwork?.shortName }), originNetwork.name)), originNetwork.shortName !== "CC" && /* @__PURE__ */ React65.createElement("p", { className: theme.colorMode }, dAppOption === "LPDrain" /* LPDrain */ ? targetAddress : connectedAddress))), /* @__PURE__ */ React65.createElement("div", { className: "detail-item amount" }, /* @__PURE__ */ React65.createElement("span", { className: "amount-container" }, /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, "Amount to Transfer "), /* @__PURE__ */ React65.createElement("div", { className: "coin-details" }, /* @__PURE__ */ React65.createElement("p", null, formatBigInt(txValues.allowanceAmount), " ", sourceCurrency))), /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, "Total Fees"), /* @__PURE__ */ React65.createElement(
+  return /* @__PURE__ */ React66.createElement("div", { className: `confirm-details ${theme.colorMode}` }, /* @__PURE__ */ React66.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__ */ React66.createElement("div", null, /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React66.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React66.createElement(ChainIcon, { symbol: originNetwork?.shortName }), "FIAT"), /* @__PURE__ */ React66.createElement("p", null, "ES6621000418401234567891")), /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React66.createElement("p", null, "Kima Sandbox")), /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "BIC:"), /* @__PURE__ */ React66.createElement("p", null, "CAIXESBBXXX")), /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "Description:"), /* @__PURE__ */ React66.createElement("p", { className: "signature" }, signature))) : /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "Source ", originNetwork.shortName !== "CC" && "wallet", ":"), /* @__PURE__ */ React66.createElement("div", { className: "network-details" }, /* @__PURE__ */ React66.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ React66.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React66.createElement(ChainIcon, { symbol: originNetwork?.shortName }), originNetwork.name)), originNetwork.shortName !== "CC" && /* @__PURE__ */ React66.createElement("p", { className: theme.colorMode }, dAppOption === "LPDrain" /* LPDrain */ ? targetAddress : connectedAddress))), /* @__PURE__ */ React66.createElement("div", { className: "detail-item amount" }, /* @__PURE__ */ React66.createElement("span", { className: "amount-container" }, dAppOption === "none" /* None */ && /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, "Amount to Transfer "), /* @__PURE__ */ React66.createElement("div", { className: "coin-details" }, /* @__PURE__ */ React66.createElement("p", null, formatBigInt(txValues.allowanceAmount), " ", sourceCurrency))), dAppOption === "none" /* None */ && /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, "Total Fees"), /* @__PURE__ */ React66.createElement(
     "div",
     {
       className: "fee-collapse",
       onClick: () => setFeeCollapsed(!feeCollapsed)
     },
-    /* @__PURE__ */ React65.createElement(
+    /* @__PURE__ */ React66.createElement(
       MiniArrow_default,
       {
         width: 15,
@@ -5083,16 +5360,16 @@ var ConfirmDetails = ({
         }
       }
     ),
-    /* @__PURE__ */ React65.createElement("span", { className: "service-fee" }, formatBigInt(totalFee), " ", sourceCurrency)
-  )), /* @__PURE__ */ React65.createElement("div", { className: `fee-breakdown ${feeCollapsed ? "collapsed" : ""}` }, /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, originNetwork.shortName === "CC" ? "Credit Card Processing Fee" : `Source Network Fee (${originNetwork.shortName})`), /* @__PURE__ */ React65.createElement("span", { className: "service-fee" }, formatBigInt(sourceFee), " ", sourceCurrency)), /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, "Target Network Fee (", targetNetwork.shortName, ")"), /* @__PURE__ */ React65.createElement("span", { className: "service-fee" }, formatBigInt(targetFee), " ", targetCurrency)), /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, "KIMA Service Fee"), /* @__PURE__ */ React65.createElement("span", { className: "service-fee" }, formatBigInt(kimaFee), " ", sourceCurrency))), /* @__PURE__ */ React65.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React65.createElement("span", null, "Target Transfer Amount"), /* @__PURE__ */ React65.createElement("span", { className: "service-fee" }, formatBigInt(txValues.submitAmount), " ", targetCurrency)))), targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ React65.createElement("div", null, /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React65.createElement("p", null, bankDetails.iban), /* @__PURE__ */ React65.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React65.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), "FIAT")), /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React65.createElement("p", null, bankDetails.recipient))) : /* @__PURE__ */ React65.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React65.createElement("span", { className: "label" }, "Target wallet:"), /* @__PURE__ */ React65.createElement("div", { className: "network-details" }, /* @__PURE__ */ React65.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ React65.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React65.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), targetNetworkOption?.name)), /* @__PURE__ */ React65.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__ */ React66.createElement("span", { className: "service-fee" }, formatBigInt(totalFee), " ", sourceCurrency)
+  )), /* @__PURE__ */ React66.createElement("div", { className: `fee-breakdown ${feeCollapsed ? "collapsed" : ""}` }, /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, originNetwork.shortName === "CC" ? "Credit Card Processing Fee" : `Source Network Fee (${originNetwork.shortName})`), /* @__PURE__ */ React66.createElement("span", { className: "service-fee" }, formatBigInt(sourceFee), " ", sourceCurrency)), /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, "Target Network Fee (", targetNetwork.shortName, ")"), /* @__PURE__ */ React66.createElement("span", { className: "service-fee" }, formatBigInt(targetFee), " ", targetCurrency)), /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, "KIMA Service Fee"), /* @__PURE__ */ React66.createElement("span", { className: "service-fee" }, formatBigInt(kimaFee), " ", sourceCurrency))), /* @__PURE__ */ React66.createElement("div", { className: "amount-details" }, /* @__PURE__ */ React66.createElement("span", null, "Target Transfer Amount"), /* @__PURE__ */ React66.createElement("span", { className: "service-fee" }, formatBigInt(txValues.submitAmount), " ", targetCurrency)))), targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ React66.createElement("div", null, /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React66.createElement("p", null, bankDetails.iban), /* @__PURE__ */ React66.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React66.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), "FIAT")), /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React66.createElement("p", null, bankDetails.recipient))) : /* @__PURE__ */ React66.createElement("div", { className: "detail-item" }, /* @__PURE__ */ React66.createElement("span", { className: "label" }, "Target wallet:"), /* @__PURE__ */ React66.createElement("div", { className: "network-details" }, /* @__PURE__ */ React66.createElement("div", { className: "kima-card-network-container" }, /* @__PURE__ */ React66.createElement("span", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React66.createElement(ChainIcon, { symbol: targetNetworkOption?.shortName }), targetNetworkOption?.name)), /* @__PURE__ */ React66.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__ */ React65.createElement(FeeDeductionRadioButtons_default, { disabled: feeOptionDisabled })
+    /* @__PURE__ */ React66.createElement(FeeDeductionRadioButtons_default, { disabled: feeOptionDisabled })
   ) : null);
 };
 var ConfirmDetails_default = ConfirmDetails;
 
 // src/components/reusable/AddressInput.tsx
-import React66, { useEffect as useEffect14 } from "react";
+import React67, { useEffect as useEffect14 } from "react";
 import { useDispatch as useDispatch11, useSelector as useSelector26 } from "react-redux";
 var AddressInput = ({
   theme,
@@ -5131,7 +5408,7 @@ var AddressInput = ({
     mode,
     dispatch
   ]);
-  return /* @__PURE__ */ React66.createElement(
+  return /* @__PURE__ */ React67.createElement(
     "input",
     {
       className: `kima-address-input ${theme}`,
@@ -5146,11 +5423,11 @@ var AddressInput = ({
 var AddressInput_default = AddressInput;
 
 // src/components/reusable/CustomCheckbox.tsx
-import React67 from "react";
+import React68 from "react";
 import { useSelector as useSelector27 } from "react-redux";
 
 // src/components/reusable/StepBox.tsx
-import React68, { useMemo as useMemo11 } from "react";
+import React69, { useMemo as useMemo11 } from "react";
 import { useSelector as useSelector28 } from "react-redux";
 var stepInfo2 = [
   {
@@ -5174,6 +5451,7 @@ var StepBox = ({ step, errorStep, loadingStep, data }) => {
   const explorerUrl = useSelector28(selectKimaExplorer);
   const networkOption = useSelector28(selectNetworkOption);
   const networks = useSelector28(selectNetworks);
+  const { width: windowWidth } = useWidth_default();
   const sourceChain = useMemo11(() => {
     const sourceKey = data?.sourceChain === "FIAT" ? "CC" : data?.sourceChain;
     return networks.find((network) => network.shortName === sourceKey);
@@ -5182,61 +5460,60 @@ var StepBox = ({ step, errorStep, loadingStep, data }) => {
     () => networks.find((network) => network.shortName === data?.targetChain),
     [data, networks]
   );
-  return /* @__PURE__ */ React68.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ React68.createElement("div", { className: `content-wrapper ${theme.colorMode}` }, stepInfo2.map((item, index) => /* @__PURE__ */ React68.createElement("div", { key: item.title, className: "step-item" }, /* @__PURE__ */ React68.createElement(
+  return /* @__PURE__ */ React69.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ React69.createElement("div", { className: `content-wrapper ${theme.colorMode}` }, stepInfo2.map((item, index) => /* @__PURE__ */ React69.createElement("div", { key: item.title, className: "step-item" }, /* @__PURE__ */ React69.createElement(
     "div",
     {
       className: `info-item
                   ${step >= index ? index === loadingStep ? "active" : index === errorStep ? "error" : "completed" : ""} 
                   ${step < index && "locked"} ${theme.colorMode}`
     },
-    step < index && /* @__PURE__ */ React68.createElement(Lock_default, null),
-    step >= index ? index === loadingStep ? /* @__PURE__ */ React68.createElement(Loader_default, { className: "loader" }) : index === errorStep ? /* @__PURE__ */ React68.createElement(Warning_default, null) : /* @__PURE__ */ React68.createElement(Check_default, null) : null,
-    /* @__PURE__ */ React68.createElement("p", null, item.title)
-  ), index === 0 && data?.kimaTxHash ? /* @__PURE__ */ React68.createElement("div", { className: `info-item ${theme.colorMode}` }, /* @__PURE__ */ React68.createElement("div", { className: "icon" }, /* @__PURE__ */ React68.createElement(USDK_default, { width: 30, height: 30 })), /* @__PURE__ */ React68.createElement("p", { className: "chain-name" }, "Kima TX Hash:"), /* @__PURE__ */ React68.createElement("p", null, /* @__PURE__ */ React68.createElement(
+    /* @__PURE__ */ React69.createElement("div", { className: "info-icon" }, step < index && /* @__PURE__ */ React69.createElement(Lock_default, { width: 24, height: 24 }), step >= index ? index === loadingStep ? /* @__PURE__ */ React69.createElement(Loader_default, { width: 24, height: 24, className: "loader" }) : index === errorStep ? /* @__PURE__ */ React69.createElement(Warning_default, { width: 24, height: 24 }) : /* @__PURE__ */ React69.createElement(Check_default, { width: 24, height: 24 }) : null),
+    /* @__PURE__ */ React69.createElement("p", null, item.title)
+  ), index === 0 && data?.kimaTxHash ? /* @__PURE__ */ React69.createElement("div", { className: `info-item ${theme.colorMode}` }, /* @__PURE__ */ React69.createElement("div", { className: "icon" }, /* @__PURE__ */ React69.createElement(USDK_default, { width: 30, height: 30 })), /* @__PURE__ */ React69.createElement("p", { className: "chain-name" }, "Kima TX Hash:"), /* @__PURE__ */ React69.createElement("p", null, /* @__PURE__ */ React69.createElement(
     ExternalLink_default,
     {
       to: `${explorerUrl}/transactions/?tx=${data?.kimaTxHash}`
     },
     getShortenedAddress(data?.kimaTxHash || "")
-  ), /* @__PURE__ */ React68.createElement(CopyButton_default, { text: data?.kimaTxHash }))) : null, index === 1 && data?.tssPullHash && sourceChain?.shortName !== "CC" ? /* @__PURE__ */ React68.createElement(
+  ), /* @__PURE__ */ React69.createElement(CopyButton_default, { text: data?.kimaTxHash }))) : null, index === 1 && data?.tssPullHash && sourceChain?.shortName !== "CC" ? /* @__PURE__ */ React69.createElement(
     "div",
     {
       className: `info-item ${theme.colorMode} source-chain ${step >= 3 ? "paid" : ""}`
     },
-    /* @__PURE__ */ React68.createElement(ChainIcon, { symbol: data.sourceChain }),
-    /* @__PURE__ */ React68.createElement("p", { className: "chain-name" }, sourceChain?.name, " TX Hash:"),
-    /* @__PURE__ */ React68.createElement("p", null, /* @__PURE__ */ React68.createElement(
+    /* @__PURE__ */ React69.createElement(ChainIcon, { symbol: data.sourceChain }),
+    /* @__PURE__ */ React69.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? sourceChain?.name : sourceChain?.shortName, " ", "TX Hash:"),
+    /* @__PURE__ */ React69.createElement("p", null, /* @__PURE__ */ React69.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__ */ React68.createElement(CopyButton_default, { text: data?.tssPullHash || "" }))
-  ) : null, index === 3 && data?.tssRefundHash ? /* @__PURE__ */ React68.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ React68.createElement(ChainIcon, { symbol: data.sourceChain }), /* @__PURE__ */ React68.createElement("p", { className: "chain-name" }, sourceChain?.name, " TX Hash:"), /* @__PURE__ */ React68.createElement("p", null, /* @__PURE__ */ React68.createElement(
+    ), /* @__PURE__ */ React69.createElement(CopyButton_default, { text: data?.tssPullHash || "" }))
+  ) : null, index === 3 && data?.tssRefundHash ? /* @__PURE__ */ React69.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ React69.createElement(ChainIcon, { symbol: data.sourceChain }), /* @__PURE__ */ React69.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? sourceChain?.name : sourceChain?.shortName, " ", "TX Hash:"), /* @__PURE__ */ React69.createElement("p", null, /* @__PURE__ */ React69.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__ */ React68.createElement(CopyButton_default, { text: data?.tssRefundHash || "" }))) : null, index === 3 && data?.tssReleaseHash ? /* @__PURE__ */ React68.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ React68.createElement(ChainIcon, { symbol: data.targetChain }), /* @__PURE__ */ React68.createElement("p", { className: "chain-name" }, targetChain?.name, " TX Hash:"), /* @__PURE__ */ React68.createElement("p", null, /* @__PURE__ */ React68.createElement(
+  ), /* @__PURE__ */ React69.createElement(CopyButton_default, { text: data?.tssRefundHash || "" }))) : null, index === 3 && data?.tssReleaseHash ? /* @__PURE__ */ React69.createElement("div", { className: `info-item ${theme.colorMode} target-chain` }, /* @__PURE__ */ React69.createElement(ChainIcon, { symbol: data.targetChain }), /* @__PURE__ */ React69.createElement("p", { className: "chain-name" }, windowWidth >= 770 ? targetChain?.name : targetChain?.shortName, " ", "TX Hash:"), /* @__PURE__ */ React69.createElement("p", null, /* @__PURE__ */ React69.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__ */ React68.createElement(CopyButton_default, { text: data?.tssReleaseHash || "" }))) : null))));
+  ), /* @__PURE__ */ React69.createElement(CopyButton_default, { text: data?.tssReleaseHash || "" }))) : null))));
 };
 var StepBox_default = StepBox;
 
 // src/components/reusable/BankInput.tsx
-import React69 from "react";
+import React70 from "react";
 import { useDispatch as useDispatch12 } from "react-redux";
 import { useSelector as useSelector29 } from "react-redux";
 var BankInput = () => {
   const dispatch = useDispatch12();
   const theme = useSelector29(selectTheme);
   const bankDetails = useSelector29(selectBankDetails);
-  return /* @__PURE__ */ React69.createElement("div", { className: "bank-input" }, /* @__PURE__ */ React69.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React69.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React69.createElement(
+  return /* @__PURE__ */ React70.createElement("div", { className: "bank-input" }, /* @__PURE__ */ React70.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React70.createElement("span", { className: "label" }, "IBAN:"), /* @__PURE__ */ React70.createElement(
     "input",
     {
       className: "kima-address-input",
@@ -5244,7 +5521,7 @@ var BankInput = () => {
       value: bankDetails.iban,
       onChange: (e) => dispatch(setBankDetails({ ...bankDetails, iban: e.target.value }))
     }
-  )), /* @__PURE__ */ React69.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React69.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React69.createElement(
+  )), /* @__PURE__ */ React70.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React70.createElement("span", { className: "label" }, "Recipient:"), /* @__PURE__ */ React70.createElement(
     "input",
     {
       className: "kima-address-input",
@@ -5259,7 +5536,7 @@ var BankInput = () => {
 var BankInput_default = BankInput;
 
 // src/components/reusable/TxButton.tsx
-import React70 from "react";
+import React71 from "react";
 import { useDispatch as useDispatch13 } from "react-redux";
 import { useSelector as useSelector30 } from "react-redux";
 var TxButton = ({ theme }) => {
@@ -5268,14 +5545,14 @@ var TxButton = ({ theme }) => {
     dispatch(setPendingTxPopup(true));
   };
   const txCount = useSelector30(selectPendingTxs);
-  return /* @__PURE__ */ React70.createElement(
+  return /* @__PURE__ */ React71.createElement(
     "button",
     {
       className: `secondary-button tx-button ${theme.colorMode}`,
       onClick: handleClick
     },
     txCount,
-    /* @__PURE__ */ React70.createElement(
+    /* @__PURE__ */ React71.createElement(
       ring_default,
       {
         height: 16,
@@ -5311,43 +5588,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 */,
@@ -5369,11 +5628,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(
@@ -5402,17 +5661,17 @@ var useGetTxData = (txId, dAppOption, backendUrl) => {
 var useGetTxData_default = useGetTxData;
 
 // src/components/reusable/TransactionStatusMessage.tsx
-import React71 from "react";
+import React72 from "react";
 var TransactionStatusMessage = ({
   isCompleted,
   transactionId
 }) => {
-  return /* @__PURE__ */ React71.createElement("div", { className: "transaction-status-message" }, /* @__PURE__ */ React71.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__ */ React71.createElement("span", { className: "transaction-copy" }, /* @__PURE__ */ React71.createElement("h3", null, transactionId), /* @__PURE__ */ React71.createElement(CopyButton_default, { text: transactionId })));
+  return /* @__PURE__ */ React72.createElement("div", { className: "transaction-status-message" }, /* @__PURE__ */ React72.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__ */ React72.createElement("span", { className: "transaction-copy" }, /* @__PURE__ */ React72.createElement("h3", null, transactionId), /* @__PURE__ */ React72.createElement(CopyButton_default, { text: transactionId })));
 };
 var TransactionStatusMessage_default = TransactionStatusMessage;
 
 // src/components/reusable/TransactionSearch.tsx
-import React72, { useRef as useRef3, useState as useState10 } from "react";
+import React73, { useRef as useRef3, useState as useState10 } from "react";
 import { useSelector as useSelector31 } from "react-redux";
 import { useDispatch as useDispatch14 } from "react-redux";
 import toast2 from "react-hot-toast";
@@ -5425,7 +5684,7 @@ var TransactionSearch = () => {
   const handleSearch = async () => {
     if (transactionId.length <= 0)
       return toast2.error("You must provide a valid transaction id", {
-        icon: /* @__PURE__ */ React72.createElement(Error_default, null)
+        icon: /* @__PURE__ */ React73.createElement(Error_default, null)
       });
     try {
       const data = await getTxData({
@@ -5442,11 +5701,11 @@ var TransactionSearch = () => {
       logger_default.error("Error searching transaction: ", error);
       return toast2.error(
         "Transaction not found. Please check for the proper transaction id.",
-        { icon: /* @__PURE__ */ React72.createElement(Error_default, null) }
+        { icon: /* @__PURE__ */ React73.createElement(Error_default, null) }
       );
     }
   };
-  return /* @__PURE__ */ React72.createElement("div", { className: "form-item transaction-search" }, /* @__PURE__ */ React72.createElement("div", { className: "transaction-input" }, /* @__PURE__ */ React72.createElement("span", { className: "label" }, "Search Transaction:"), /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React73.createElement("div", { className: "form-item transaction-search" }, /* @__PURE__ */ React73.createElement("div", { className: "transaction-input" }, /* @__PURE__ */ React73.createElement("span", { className: "label" }, "Search Transaction:"), /* @__PURE__ */ React73.createElement(
     "input",
     {
       className: `${theme.colorMode}`,
@@ -5456,7 +5715,7 @@ var TransactionSearch = () => {
       onChange: (e) => setTransactionId(e.target.value),
       spellCheck: false
     }
-  )), /* @__PURE__ */ React72.createElement(SecondaryButton_default, { clickHandler: handleSearch }, "Search"));
+  )), /* @__PURE__ */ React73.createElement(SecondaryButton_default, { clickHandler: handleSearch }, "Search"));
 };
 var TransactionSearch_default = TransactionSearch;
 
@@ -5468,7 +5727,9 @@ var TransactionWidget = ({ theme }) => {
   const [errorMessage, setErrorMessage] = useState11("");
   const [loadingStep, setLoadingStep] = useState11(-1);
   const [minimized, setMinimized] = useState11(false);
+  const [isComplete, setIsComplete] = useState11(false);
   const dispatch = useDispatch15();
+  const explorerUrl = useSelector32(selectKimaExplorer);
   const mode = useSelector32(selectMode);
   const feeDeduct = useSelector32(selectFeeDeduct);
   const amount = useSelector32(selectAmount);
@@ -5485,6 +5746,10 @@ var TransactionWidget = ({ theme }) => {
   const { successHandler, closeHandler } = useKimaContext();
   const backendUrl = useSelector32(selectBackendUrl);
   const { data, error } = useGetTxData_default(txId, dAppOption, backendUrl);
+  const { width: windowWidth, updateWidth } = useWidth_default();
+  useEffect15(() => {
+    windowWidth === 0 && updateWidth(window.innerWidth);
+  }, []);
   const transactionSourceChain = useMemo12(
     () => networks.find(
       (network) => network.shortName === (mode === "status" /* status */ ? data?.sourceChain === "FIAT" ? "CC" : data?.sourceChain : sourceChain.shortName)
@@ -5511,12 +5776,18 @@ var TransactionWidget = ({ theme }) => {
       txId
     });
   }, [data]);
+  useEffect15(() => {
+    if (!data) return;
+    if (data.status === "Completed" /* COMPLETED */) {
+      setIsComplete(true);
+    }
+  }, [data, setIsComplete]);
   useEffect15(() => {
     if (error)
       toast3.error(
         "The provided transaction id is not valid, please use a different one or contact support for further assistance",
         {
-          icon: /* @__PURE__ */ React73.createElement(Error_default, null)
+          icon: /* @__PURE__ */ React74.createElement(Error_default, null)
         }
       );
   }, [error]);
@@ -5540,7 +5811,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(1);
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
-      toast3.error("Unavailable", { icon: /* @__PURE__ */ React73.createElement(Error_default, null) });
+      toast3.error("Unavailable", { icon: /* @__PURE__ */ React74.createElement(Error_default, null) });
       setErrorMessage("Unavailable");
     } else if (status === "Paid" /* PAID */) {
       setStep(3);
@@ -5551,7 +5822,7 @@ var TransactionWidget = ({ theme }) => {
       toast3.error(
         "Failed to release tokens to target! Starting refund process.",
         {
-          icon: /* @__PURE__ */ React73.createElement(Error_default, null)
+          icon: /* @__PURE__ */ React74.createElement(Error_default, null)
         }
       );
       setErrorMessage(
@@ -5562,7 +5833,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(3);
       setLoadingStep(-1);
       toast3.error("Failed to refund tokens to source!", {
-        icon: /* @__PURE__ */ React73.createElement(Error_default, null)
+        icon: /* @__PURE__ */ React74.createElement(Error_default, null)
       });
       setErrorMessage("Failed to refund tokens to source!");
     } else if (status === "RefundCompleted" /* REFUNDCOMPLETED */) {
@@ -5570,7 +5841,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(3);
       setLoadingStep(-1);
       toast3.success("Refund completed!", {
-        icon: /* @__PURE__ */ React73.createElement(Error_default, null)
+        icon: /* @__PURE__ */ React74.createElement(Error_default, null)
       });
       setErrorMessage("Refund completed!");
     } else if (status === "FailedToPay" /* FAILEDTOPAY */) {
@@ -5579,7 +5850,7 @@ var TransactionWidget = ({ theme }) => {
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
       toast3.error("Failed to release tokens to target!", {
-        icon: /* @__PURE__ */ React73.createElement(Error_default, null)
+        icon: /* @__PURE__ */ React74.createElement(Error_default, null)
       });
       setErrorMessage("Failed to release tokens to target!");
     } else if (status === "FailedToPull" /* FAILEDTOPULL */) {
@@ -5587,7 +5858,7 @@ var TransactionWidget = ({ theme }) => {
       setErrorStep(1);
       setLoadingStep(-1);
       logger_default.error("transaction failed:", data.failReason);
-      toast3.error("Failed to pull tokens from source!", { icon: /* @__PURE__ */ React73.createElement(Error_default, null) });
+      toast3.error("Failed to pull tokens from source!", { icon: /* @__PURE__ */ React74.createElement(Error_default, null) });
       setErrorMessage("Failed to pull tokens from source!");
     } else if (status === "Completed" /* COMPLETED */) {
       setStep(4);
@@ -5600,7 +5871,7 @@ var TransactionWidget = ({ theme }) => {
     }
   }, [data?.status]);
   const resetForm = () => {
-    closeHandler && closeHandler();
+    setIsComplete(false);
     dispatch(resetServiceFee());
     if (mode === "light" /* light */) {
       dispatch(setMode("light" /* light */));
@@ -5642,41 +5913,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__ */ React73.createElement(Provider2, { store }, /* @__PURE__ */ React73.createElement(
+  return /* @__PURE__ */ React74.createElement(Provider2, { store }, /* @__PURE__ */ React74.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__ */ React73.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React73.createElement("div", { className: "topbar" }, /* @__PURE__ */ React73.createElement("div", { className: "title" }, isValidTxId && !error ? /* @__PURE__ */ React73.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__ */ React73.createElement("div", { className: "title-icon" }, /* @__PURE__ */ React73.createElement(
+    /* @__PURE__ */ React74.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React74.createElement("div", { className: "topbar" }, !isComplete && /* @__PURE__ */ React74.createElement("div", { className: "title" }, isValidTxId && !error ? /* @__PURE__ */ React74.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__ */ React74.createElement("div", null, /* @__PURE__ */ React74.createElement("h3", { className: "transaction" }, "Transaction Status"))), !minimized ? /* @__PURE__ */ React74.createElement(
+      "div",
+      {
+        className: `control-buttons ${isComplete ? "complete" : ""}`
+      },
+      isComplete && /* @__PURE__ */ React74.createElement(
+        "button",
+        {
+          className: "menu-button",
+          style: { marginRight: "auto" },
+          onClick: () => {
+            setIsComplete(false);
+          }
+        },
+        "< Back"
+      ),
+      /* @__PURE__ */ React74.createElement(
+        "button",
+        {
+          className: "icon-button minimize",
+          onClick: () => {
+            setMinimized(true);
+          }
+        },
+        /* @__PURE__ */ React74.createElement(Minimize_default, null)
+      ),
+      !isValidTxId || loadingStep < 0 || error && dAppOption !== "none" /* None */ ? /* @__PURE__ */ React74.createElement("button", { className: "reset-button", onClick: resetForm }, "Reset") : null,
+      closeHandler && /* @__PURE__ */ React74.createElement(
+        "button",
+        {
+          className: "cross-icon-button",
+          onClick: () => {
+            resetForm();
+            closeHandler(0);
+          }
+        },
+        /* @__PURE__ */ React74.createElement(Cross_default, null)
+      )
+    ) : /* @__PURE__ */ React74.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React74.createElement("div", { className: "maximize", onClick: () => setMinimized(false) }, "View"))), data && !isComplete && /* @__PURE__ */ React74.createElement("div", { className: "header-network-labels" }, /* @__PURE__ */ React74.createElement("div", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React74.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__ */ React73.createElement("div", { className: "title-icon" }, /* @__PURE__ */ React73.createElement(
+    ), windowWidth > 450 && /* @__PURE__ */ React74.createElement("h3", null, transactionSourceChain?.name)), /* @__PURE__ */ React74.createElement(
+      "div",
+      {
+        style: { display: "inline-block", transform: "rotate(-90deg)" }
+      },
+      /* @__PURE__ */ React74.createElement(Arrow_default, { width: 25, height: 25 })
+    ), /* @__PURE__ */ React74.createElement("div", { className: `kima-card-network-label ${theme.colorMode}` }, /* @__PURE__ */ React74.createElement(
       ChainIcon,
       {
         symbol: transactionTargetChain?.shortName
       }
-    )), " ", mode !== "status" /* status */ ? `${transactionTargetChain?.name}${" "}` : isEmptyStatus ? "" : `${data?.targetChain} ${" "}`) : /* @__PURE__ */ React73.createElement("div", null, /* @__PURE__ */ React73.createElement("h3", { className: "transaction" }, "Transaction Status"))), !minimized ? /* @__PURE__ */ React73.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React73.createElement(
-      "button",
-      {
-        className: "icon-button minimize",
-        onClick: () => {
-          setMinimized(true);
-        }
-      },
-      /* @__PURE__ */ React73.createElement(Minimize_default, null)
-    ), !isValidTxId || loadingStep < 0 || error ? /* @__PURE__ */ React73.createElement("button", { className: "reset-button", onClick: resetForm }, "Reset") : null) : /* @__PURE__ */ React73.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React73.createElement("div", { className: "maximize", onClick: () => setMinimized(false) }, "View")))),
-    isValidTxId && !error ? /* @__PURE__ */ React73.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ React73.createElement("div", { className: "transaction-content" }, /* @__PURE__ */ React73.createElement(
+    ), windowWidth > 450 && /* @__PURE__ */ React74.createElement("h3", null, transactionTargetChain?.name)))),
+    isValidTxId && !error ? /* @__PURE__ */ React74.createElement("div", { className: "kima-card-content" }, !isComplete ? /* @__PURE__ */ React74.createElement("div", { className: "transaction-content" }, /* @__PURE__ */ React74.createElement(
       Progressbar_default,
       {
         step,
@@ -5685,7 +5991,7 @@ var TransactionWidget = ({ theme }) => {
         setFocus,
         loadingStep
       }
-    ), /* @__PURE__ */ React73.createElement(
+    ), /* @__PURE__ */ React74.createElement(
       StepBox_default,
       {
         step,
@@ -5693,14 +5999,67 @@ var TransactionWidget = ({ theme }) => {
         loadingStep,
         data
       }
-    )), !error && !isEmptyStatus && /* @__PURE__ */ React73.createElement(
+    )) : /* @__PURE__ */ React74.createElement("div", { className: "transaction-content transaction-complete" }, /* @__PURE__ */ React74.createElement(TransactionComplete_default, null), /* @__PURE__ */ React74.createElement("h2", null, "Transaction Complete"), /* @__PURE__ */ React74.createElement("div", { className: "kima-stepbox" }, /* @__PURE__ */ React74.createElement(
+      "div",
+      {
+        className: `content-wrapper transaction-complete ${theme.colorMode}`
+      },
+      /* @__PURE__ */ React74.createElement("p", null, "You just transferred ", data?.amount, " ", data?.sourceSymbol),
+      /* @__PURE__ */ React74.createElement("div", { className: "header-network-labels" }, /* @__PURE__ */ React74.createElement(
+        "div",
+        {
+          className: `kima-card-network-label ${theme.colorMode}`
+        },
+        /* @__PURE__ */ React74.createElement(
+          ChainIcon,
+          {
+            symbol: transactionSourceChain?.shortName
+          }
+        ),
+        windowWidth > 450 && /* @__PURE__ */ React74.createElement("h3", null, transactionSourceChain?.name)
+      ), /* @__PURE__ */ React74.createElement(
+        "div",
+        {
+          style: {
+            display: "inline-block",
+            transform: "rotate(-90deg)"
+          }
+        },
+        /* @__PURE__ */ React74.createElement(Arrow_default, { width: 25, height: 25 })
+      ), /* @__PURE__ */ React74.createElement(
+        "div",
+        {
+          className: `kima-card-network-label ${theme.colorMode}`
+        },
+        /* @__PURE__ */ React74.createElement(
+          ChainIcon,
+          {
+            symbol: transactionTargetChain?.shortName
+          }
+        ),
+        windowWidth > 450 && /* @__PURE__ */ React74.createElement("h3", null, transactionTargetChain?.name)
+      ))
+    )), /* @__PURE__ */ React74.createElement("div", { className: "transaction-buttons" }, /* @__PURE__ */ React74.createElement(
+      SecondaryButton_default,
+      {
+        clickHandler: resetForm,
+        theme: theme.colorMode
+      },
+      "New Transaction"
+    ), /* @__PURE__ */ React74.createElement(
+      ExternalLink_default,
+      {
+        to: `${explorerUrl}/transactions/?tx=${data?.kimaTxHash}`
+      },
+      /* @__PURE__ */ React74.createElement(PrimaryButton_default, null, "View Details")
+    ))), !error && !isEmptyStatus && !isComplete && /* @__PURE__ */ React74.createElement(
       TransactionStatusMessage_default,
       {
         isCompleted: data?.status,
         transactionId: txId.toString()
       }
-    )) : /* @__PURE__ */ React73.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ React73.createElement("h4", { className: "subtitle" }, "You can follow the status of a previous submitted transaction by entering the provided transaction id"), /* @__PURE__ */ React73.createElement("div", { className: "single-form" }, /* @__PURE__ */ React73.createElement(TransactionSearch_default, null))),
-    /* @__PURE__ */ React73.createElement(
+    )) : /* @__PURE__ */ React74.createElement("div", { className: "kima-card-content" }, /* @__PURE__ */ React74.createElement("h4", { className: "subtitle" }, "You can follow the status of a previous submitted transaction by entering the provided transaction id"), /* @__PURE__ */ React74.createElement("div", { className: "single-form" }, /* @__PURE__ */ React74.createElement(TransactionSearch_default, null))),
+    /* @__PURE__ */ React74.createElement(
       Toaster,
       {
         position: "top-right",
@@ -5727,21 +6086,27 @@ var TransactionWidget = ({ theme }) => {
         }
       }
     ),
-    /* @__PURE__ */ React73.createElement("div", { className: "floating-footer status" }, /* @__PURE__ */ React73.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React73.createElement("span", null, "Powered by"), /* @__PURE__ */ React73.createElement(KimaNetwork_default, null)))
+    /* @__PURE__ */ React74.createElement(
+      "div",
+      {
+        className: `floating-footer ${isComplete ? "complete" : "status"}`
+      },
+      /* @__PURE__ */ React74.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React74.createElement("span", null, "Powered by"), /* @__PURE__ */ React74.createElement(KimaNetwork_default, null))
+    )
   ));
 };
 
 // src/components/TransferWidget.tsx
-import React84, { useEffect as useEffect21, useState as useState16, useRef as useRef8, useMemo as useMemo21, useCallback as useCallback3 } from "react";
+import React85, { useEffect as useEffect21, useState as useState15, useRef as useRef8, useMemo as useMemo21, useCallback as useCallback3 } from "react";
 import { useDispatch as useDispatch26, useSelector as useSelector45 } from "react-redux";
 
 // src/components/reusable/SingleForm.tsx
-import React75, { useEffect as useEffect17, useMemo as useMemo14, useState as useState13 } from "react";
+import React76, { useEffect as useEffect17, useMemo as useMemo14, useState as useState13 } from "react";
 import { toast as toast4 } from "react-hot-toast";
 import { useDispatch as useDispatch17, useSelector as useSelector35 } from "react-redux";
 
 // src/components/primary/NetworkSelector.tsx
-import React74, { useState as useState12, useMemo as useMemo13, useRef as useRef4, useEffect as useEffect16 } from "react";
+import React75, { useState as useState12, useMemo as useMemo13, useRef as useRef4, useEffect as useEffect16 } from "react";
 import { useSelector as useSelector33, useDispatch as useDispatch16 } from "react-redux";
 var NetworkSelector = ({
   type,
@@ -5753,6 +6118,8 @@ var NetworkSelector = ({
   const dispatch = useDispatch16();
   const theme = useSelector33(selectTheme);
   const networkOptions3 = useSelector33(selectNetworks);
+  const transactionOption = useSelector33(selectTransactionOption);
+  const dAppOption = useSelector33(selectDappOption);
   const mode = useSelector33(selectMode);
   const sourceNetwork = useSelector33(selectSourceChain);
   const sourceSymbol = useSelector33(selectSourceCurrency);
@@ -5761,6 +6128,8 @@ var NetworkSelector = ({
   const isOriginSelector = type === "origin";
   const networks = useMemo13(() => {
     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(
@@ -5774,8 +6143,18 @@ var NetworkSelector = ({
       }
       return network.supportedLocations.includes(type) && !isSameAsSource && supportsSourceCurrency && isAllowedInLightMode;
     });
-  }, [networkOptions3, sourceNetwork, sourceSymbol, type, mode]);
+  }, [networkOptions3, sourceNetwork, sourceSymbol, type, mode, dAppOption]);
+  const shouldLockSourceNetwork = isOriginSelector && mode === "payment" /* payment */ && dAppOption !== "none" /* None */ && !!transactionOption?.targetChain;
   const selectedNetwork = useMemo13(() => {
+    if (shouldLockSourceNetwork) {
+      const forcedNetwork = networks.find(
+        (n) => n.shortName === transactionOption.targetChain
+      );
+      return forcedNetwork || {
+        shortName: "",
+        name: "Invalid Source Network"
+      };
+    }
     if (initialSelection) {
       return {
         shortName: "",
@@ -5792,7 +6171,32 @@ var NetworkSelector = ({
     sourceNetwork,
     targetNetwork,
     isOriginSelector,
-    initialSelection
+    initialSelection,
+    shouldLockSourceNetwork,
+    transactionOption?.targetChain
+  ]);
+  useEffect16(() => {
+    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
   ]);
   useEffect16(() => {
     if (!networks.length || selectedNetwork.shortName) return;
@@ -5847,20 +6251,24 @@ var NetworkSelector = ({
       dispatch(setTargetAddress(lightDemoAccounts.TRX));
     }
   }, [sourceNetwork, targetNetwork, mode]);
-  return /* @__PURE__ */ React74.createElement(
+  return /* @__PURE__ */ React75.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__ */ React74.createElement("div", { className: "network-wrapper" }, /* @__PURE__ */ React74.createElement(ChainIcon, { symbol: selectedNetwork.shortName }), /* @__PURE__ */ React74.createElement("span", null, selectedNetwork.name)),
-    /* @__PURE__ */ React74.createElement(
+    /* @__PURE__ */ React75.createElement("div", { className: "network-wrapper" }, /* @__PURE__ */ React75.createElement(ChainIcon, { symbol: selectedNetwork.shortName }), /* @__PURE__ */ React75.createElement("span", null, selectedNetwork.name)),
+    /* @__PURE__ */ React75.createElement(
       "div",
       {
         className: `network-menu custom-scrollbar ${theme?.colorMode ?? ""} ${collapsed ? "collapsed" : "toggled"}`
       },
-      networks.filter((network) => network.shortName !== selectedNetwork.shortName).map((network) => /* @__PURE__ */ React74.createElement(
+      networks.filter((network) => network.shortName !== selectedNetwork.shortName).map((network) => /* @__PURE__ */ React75.createElement(
         "div",
         {
           key: network.id,
@@ -5872,15 +6280,15 @@ var NetworkSelector = ({
             }
           }
         },
-        network.disabled ? /* @__PURE__ */ React74.createElement(Warning_default, { width: 25, height: 25 }) : /* @__PURE__ */ React74.createElement(ChainIcon, { symbol: network.shortName }),
-        /* @__PURE__ */ React74.createElement("p", null, network.name),
-        network.disabled && /* @__PURE__ */ React74.createElement("span", { className: "tooltip" }, "Temporarily unavailable")
+        network.disabled ? /* @__PURE__ */ React75.createElement(Warning_default, { width: 25, height: 25 }) : /* @__PURE__ */ React75.createElement(ChainIcon, { symbol: network.shortName }),
+        /* @__PURE__ */ React75.createElement("p", null, network.name),
+        network.disabled && /* @__PURE__ */ React75.createElement("span", { className: "tooltip" }, "Temporarily unavailable")
       ))
     ),
-    /* @__PURE__ */ React74.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ React74.createElement(Arrow_default, { fill: "none" }))
+    !shouldLockSourceNetwork && /* @__PURE__ */ React75.createElement("div", { className: `dropdown-icon ${collapsed ? "toggled" : "collapsed"}` }, /* @__PURE__ */ React75.createElement(Arrow_default, { fill: "none" }))
   );
 };
-var NetworkSelector_default = React74.memo(NetworkSelector);
+var NetworkSelector_default = React75.memo(NetworkSelector);
 
 // src/components/reusable/SingleForm.tsx
 import { parseUnits as parseUnits2 } from "viem";
@@ -6000,6 +6408,7 @@ var SingleForm = ({
   const theme = useSelector35(selectTheme);
   const feeDeduct = useSelector35(selectFeeDeduct);
   const { totalFee } = useSelector35(selectServiceFee);
+  const dAppOption = useSelector35(selectDappOption);
   const compliantOption = useSelector35(selectCompliantOption);
   const targetCompliant = useSelector35(selectTargetCompliant);
   const sourceAddress = useSelector35(selectSourceAddress);
@@ -6087,9 +6496,12 @@ var SingleForm = ({
     dispatch(setAmount(truncated));
   };
   const isConnected = useMemo14(() => {
+    if (mode === "payment" /* payment */ && dAppOption !== "none" /* None */) {
+      return isReady;
+    }
     return isReady && !initialSelection.sourceSelection;
-  }, [isReady, initialSelection]);
-  return /* @__PURE__ */ React75.createElement("div", { className: "single-form" }, /* @__PURE__ */ React75.createElement("div", { className: "form-item" }, /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Source Network:"), /* @__PURE__ */ React75.createElement("div", { className: "items" }, /* @__PURE__ */ React75.createElement(
+  }, [isReady, initialSelection, mode, dAppOption]);
+  return /* @__PURE__ */ React76.createElement("div", { className: "single-form" }, /* @__PURE__ */ React76.createElement("div", { className: "form-item" }, /* @__PURE__ */ React76.createElement("span", { className: "label" }, dAppOption === "none" /* None */ && "Source", " Network:"), /* @__PURE__ */ React76.createElement("div", { className: "items" }, /* @__PURE__ */ React76.createElement(
     NetworkSelector_default,
     {
       type: "origin",
@@ -6098,20 +6510,20 @@ var SingleForm = ({
         setInitialSelection
       }
     }
-  ), /* @__PURE__ */ React75.createElement(CoinDropdown_default, null))), /* @__PURE__ */ React75.createElement(
+  ), /* @__PURE__ */ React76.createElement(CoinDropdown_default, null))), /* @__PURE__ */ React76.createElement(
     "div",
     {
       className: `dynamic-area ${sourceNetwork.shortName === "FIAT" /* FIAT */ ? "reverse" : "1"}`
     },
-    sourceNetwork.compatibility !== "CC" /* CC */ && /* @__PURE__ */ React75.createElement(
+    sourceNetwork.compatibility !== "CC" /* CC */ && /* @__PURE__ */ React76.createElement(
       "div",
       {
         className: `form-item wallet-button-item ${isConnected && "connected"}`
       },
-      /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Wallet:"),
-      /* @__PURE__ */ React75.createElement(WalletButton_default, { initialSelection: initialSelection.sourceSelection })
+      /* @__PURE__ */ React76.createElement("span", { className: "label" }, "Wallet:"),
+      /* @__PURE__ */ React76.createElement(WalletButton_default, { initialSelection: initialSelection.sourceSelection })
     ),
-    mode !== "payment" /* payment */ && /* @__PURE__ */ React75.createElement("div", { className: "form-item" }, /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Target Network:"), /* @__PURE__ */ React75.createElement("div", { className: "items" }, /* @__PURE__ */ React75.createElement(
+    mode !== "payment" /* payment */ && /* @__PURE__ */ React76.createElement("div", { className: "form-item" }, /* @__PURE__ */ React76.createElement("span", { className: "label" }, "Target Network:"), /* @__PURE__ */ React76.createElement("div", { className: "items" }, /* @__PURE__ */ React76.createElement(
       NetworkSelector_default,
       {
         type: "target",
@@ -6120,38 +6532,39 @@ var SingleForm = ({
           setInitialSelection
         }
       }
-    ), /* @__PURE__ */ React75.createElement(CoinDropdown_default, { isSourceChain: false })))
-  ), mode === "bridge" /* bridge */ && sourceNetwork.shortName !== "FIAT" /* FIAT */ ? targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ React75.createElement(BankInput_default, null) : /* @__PURE__ */ React75.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Target Address:"), /* @__PURE__ */ React75.createElement(
+    ), /* @__PURE__ */ React76.createElement(CoinDropdown_default, { isSourceChain: false })))
+  ), mode === "bridge" /* bridge */ && sourceNetwork.shortName !== "FIAT" /* FIAT */ ? targetNetwork.shortName === "FIAT" /* FIAT */ ? /* @__PURE__ */ React76.createElement(BankInput_default, null) : /* @__PURE__ */ React76.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React76.createElement("span", { className: "label" }, "Target Address:"), /* @__PURE__ */ React76.createElement(
     AddressInput_default,
     {
       theme: theme.colorMode,
       placeholder: "Target address",
       initialSelection
     }
-  )) : null, mode === "light" /* light */ && /* @__PURE__ */ React75.createElement(
+  )) : null, mode === "light" /* light */ && /* @__PURE__ */ React76.createElement(
     "div",
     {
       className: `form-item wallet-button-item ${!initialSelection.targetSelection && "connected"}`,
       style: { display: "flex", alignItems: "center" }
     },
-    /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Target Wallet:"),
-    /* @__PURE__ */ React75.createElement(
+    /* @__PURE__ */ React76.createElement("span", { className: "label" }, "Target Wallet:"),
+    /* @__PURE__ */ React76.createElement(
       WalletButton_default,
       {
         initialSelection: initialSelection.targetSelection,
         placeholder: true
       }
     )
-  ), mode === "bridge" /* bridge */ && /* @__PURE__ */ React75.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React75.createElement("span", { className: "label" }, "Amount:"), /* @__PURE__ */ React75.createElement("div", { className: `amount-label-container items ${theme.colorMode}` }, /* @__PURE__ */ React75.createElement(
+  ), /* @__PURE__ */ React76.createElement("div", { className: `form-item ${theme.colorMode}` }, /* @__PURE__ */ React76.createElement("span", { className: "label" }, "Amount:"), /* @__PURE__ */ React76.createElement("div", { className: `amount-label-container items ${theme.colorMode}` }, /* @__PURE__ */ React76.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__ */ React75.createElement("div", { className: "max-disclaimer" }, sourceNetwork.shortName !== "CC" && /* @__PURE__ */ React75.createElement("span", { className: "max-button", onClick: onMaxClick }, "Max"), +totalFee !== -1 && /* @__PURE__ */ React75.createElement("p", { className: "fee-amount" }, "Est fees:", " ", /* @__PURE__ */ React75.createElement("span", { className: `${isLoadingFees ? "loading" : ""}` }, " ", isLoadingFees ? "" : `$ ${formatBigInt(totalFee)} ${feeCurrency}`))))));
+  ), /* @__PURE__ */ React76.createElement("div", { className: "max-disclaimer" }, sourceNetwork.shortName !== "CC" && mode !== "payment" /* payment */ && /* @__PURE__ */ React76.createElement("span", { className: "max-button", onClick: onMaxClick }, "Max"), +totalFee !== -1 && dAppOption === "none" /* None */ && !initialSelection.sourceSelection && !initialSelection.targetSelection && /* @__PURE__ */ React76.createElement("p", { className: "fee-amount" }, "Est fees:", " ", /* @__PURE__ */ React76.createElement("span", { className: `${isLoadingFees ? "loading" : ""}` }, " ", isLoadingFees ? "" : `$ ${formatBigInt(totalFee)} ${feeCurrency}`))))));
 };
 var SingleForm_default = SingleForm;
 
@@ -6200,11 +6613,11 @@ function useAllowance2({
 import { toast as toast5, Toaster as Toaster2 } from "react-hot-toast";
 
 // plugins/solana/components/SolanaWalletConnectModal.tsx
-import React78 from "react";
+import React79 from "react";
 import { useDispatch as useDispatch20, useSelector as useSelector38 } from "react-redux";
 
 // plugins/solana/components/SolanaWalletSelect.tsx
-import React76, { useCallback as useCallback2, useEffect as useEffect18, useMemo as useMemo15, useRef as useRef5 } from "react";
+import React77, { useCallback as useCallback2, useEffect as useEffect18, useMemo as useMemo15, useRef as useRef5 } from "react";
 import { useDispatch as useDispatch18, useSelector as useSelector36 } from "react-redux";
 import { useWallet as useWallet7 } from "@solana/wallet-adapter-react";
 import { WalletReadyState } from "@solana/wallet-adapter-base";
@@ -6278,28 +6691,28 @@ var SolanaWalletSelect = () => {
     }
     dispatch(setSolanaConnectModal(false));
   }, [wallet, sourceChain]);
-  return /* @__PURE__ */ React76.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ React76.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ React76.createElement("div", { className: "wallet-container" }, detected.map((wallet2, index) => /* @__PURE__ */ React76.createElement(
+  return /* @__PURE__ */ React77.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ React77.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ React77.createElement("div", { className: "wallet-container" }, detected.map((wallet2, index) => /* @__PURE__ */ React77.createElement(
     "div",
     {
       className: `card-item ${theme.colorMode}`,
       onClick: () => handleWalletClick(wallet2.adapter.name),
       key: `${wallet2.adapter.name}-${index}`
     },
-    /* @__PURE__ */ React76.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React76.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ React76.createElement("span", null, wallet2.adapter.name))
-  )), undetected.map((wallet2, index) => /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React77.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ React77.createElement("span", null, wallet2.adapter.name))
+  )), undetected.map((wallet2, index) => /* @__PURE__ */ React77.createElement(
     ExternalLink_default,
     {
       to: wallet2.adapter.url,
       className: `card-item ${theme.colorMode}`,
       key: `${wallet2.adapter.name}-${index}`
     },
-    /* @__PURE__ */ React76.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React76.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ React76.createElement("span", null, "Install ", wallet2.adapter.name))
+    /* @__PURE__ */ React77.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React77.createElement("img", { src: wallet2.adapter.icon, alt: wallet2.adapter.name }), /* @__PURE__ */ React77.createElement("span", null, "Install ", wallet2.adapter.name))
   )))));
 };
 var SolanaWalletSelect_default = SolanaWalletSelect;
 
 // plugins/solana/components/AccountDetailsModal.tsx
-import React77, { useMemo as useMemo16 } from "react";
+import React78, { useMemo as useMemo16 } from "react";
 import { useDispatch as useDispatch19, useSelector as useSelector37 } from "react-redux";
 import { useWallet as useSolanaWallet3 } from "@solana/wallet-adapter-react";
 var AccountDetailsModal = () => {
@@ -6320,25 +6733,25 @@ var AccountDetailsModal = () => {
     dispatch(setAccountDetailsModal(false));
   };
   if (sourceChain.shortName !== "SOL") return;
-  return /* @__PURE__ */ React77.createElement(
+  return /* @__PURE__ */ React78.createElement(
     "div",
     {
       className: `kima-modal ${theme.colorMode} ${accountDetailsModal && "open"}`
     },
-    /* @__PURE__ */ React77.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ React77.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React77.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React77.createElement("div", { className: "topbar" }, /* @__PURE__ */ React77.createElement("div", { className: "title" }, /* @__PURE__ */ React77.createElement("h3", null, "Account Details")), /* @__PURE__ */ React77.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React77.createElement(
+    /* @__PURE__ */ React78.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ React78.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React78.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React78.createElement("div", { className: "topbar" }, /* @__PURE__ */ React78.createElement("div", { className: "title" }, /* @__PURE__ */ React78.createElement("h3", null, "Account Details")), /* @__PURE__ */ React78.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React78.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setAccountDetailsModal(false))
       },
-      /* @__PURE__ */ React77.createElement(
+      /* @__PURE__ */ React78.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ React77.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React77.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ React77.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ React77.createElement("div", { className: "address" }, /* @__PURE__ */ React77.createElement("h2", null, getShortenedAddress(walletAddress || "")), /* @__PURE__ */ React77.createElement(CopyButton_default, { text: walletAddress })), /* @__PURE__ */ React77.createElement("h3", null, formatterFloat.format(Number(solBalance)), " $SOL")), /* @__PURE__ */ React77.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ React77.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ React77.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ React77.createElement("p", null, "Block explorer"), /* @__PURE__ */ React77.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ React77.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Discconect")))
+    )))), /* @__PURE__ */ React78.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React78.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ React78.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ React78.createElement("div", { className: "address" }, /* @__PURE__ */ React78.createElement("h2", null, getShortenedAddress(walletAddress || "")), /* @__PURE__ */ React78.createElement(CopyButton_default, { text: walletAddress })), /* @__PURE__ */ React78.createElement("h3", null, formatterFloat.format(Number(solBalance)), " $SOL")), /* @__PURE__ */ React78.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ React78.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ React78.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ React78.createElement("p", null, "Block explorer"), /* @__PURE__ */ React78.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ React78.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Discconect")))
   );
 };
 var AccountDetailsModal_default = AccountDetailsModal;
@@ -6348,18 +6761,18 @@ var SolanaWalletConnectModal = () => {
   const dispatch = useDispatch20();
   const theme = useSelector38(selectTheme);
   const connectModal = useSelector38(selectSolanaConnectModal);
-  return /* @__PURE__ */ React78.createElement("div", null, /* @__PURE__ */ React78.createElement(AccountDetailsModal_default, null), /* @__PURE__ */ React78.createElement(
+  return /* @__PURE__ */ React79.createElement("div", null, /* @__PURE__ */ React79.createElement(AccountDetailsModal_default, null), /* @__PURE__ */ React79.createElement(
     "div",
     {
       className: `kima-modal wallet-connect ${connectModal ? "open" : ""}`
     },
-    /* @__PURE__ */ React78.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React78.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React78.createElement("div", { className: "topbar" }, /* @__PURE__ */ React78.createElement("div", { className: "title" }, /* @__PURE__ */ React78.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ React78.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React78.createElement(
+    /* @__PURE__ */ React79.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React79.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React79.createElement("div", { className: "topbar" }, /* @__PURE__ */ React79.createElement("div", { className: "title" }, /* @__PURE__ */ React79.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ React79.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React79.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setSolanaConnectModal(false))
       },
-      /* @__PURE__ */ React78.createElement(
+      /* @__PURE__ */ React79.createElement(
         Cross_default,
         {
           width: 30,
@@ -6367,17 +6780,17 @@ var SolanaWalletConnectModal = () => {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ React78.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React78.createElement(SolanaWalletSelect_default, null)))
+    )))), /* @__PURE__ */ React79.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React79.createElement(SolanaWalletSelect_default, null)))
   ));
 };
 var SolanaWalletConnectModal_default = SolanaWalletConnectModal;
 
 // plugins/tron/components/TronWalletConnectModal.tsx
-import React81 from "react";
+import React82 from "react";
 import { useDispatch as useDispatch23, useSelector as useSelector41 } from "react-redux";
 
 // plugins/tron/components/AccountDetailsModal.tsx
-import React79, { useMemo as useMemo17 } from "react";
+import React80, { useMemo as useMemo17 } from "react";
 import { useDispatch as useDispatch21, useSelector as useSelector39 } from "react-redux";
 import { useWallet as useTronWallet3 } from "@tronweb3/tronwallet-adapter-react-hooks";
 var AccountDetailsModal2 = () => {
@@ -6402,31 +6815,31 @@ var AccountDetailsModal2 = () => {
     dispatch(setAccountDetailsModal(false));
   };
   if (sourcheChain.shortName !== "TRX") return;
-  return /* @__PURE__ */ React79.createElement(
+  return /* @__PURE__ */ React80.createElement(
     "div",
     {
       className: `kima-modal ${theme.colorMode} ${accountDetailsModal && "open"}`
     },
-    /* @__PURE__ */ React79.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ React79.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React79.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React79.createElement("div", { className: "topbar" }, /* @__PURE__ */ React79.createElement("div", { className: "title" }, /* @__PURE__ */ React79.createElement("h3", null, "Account Details")), /* @__PURE__ */ React79.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React79.createElement(
+    /* @__PURE__ */ React80.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ React80.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React80.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React80.createElement("div", { className: "topbar" }, /* @__PURE__ */ React80.createElement("div", { className: "title" }, /* @__PURE__ */ React80.createElement("h3", null, "Account Details")), /* @__PURE__ */ React80.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React80.createElement(
       "button",
       {
         className: "cross-icon-button",
         onClick: () => dispatch(setAccountDetailsModal(false))
       },
-      /* @__PURE__ */ React79.createElement(
+      /* @__PURE__ */ React80.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ React79.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React79.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ React79.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ React79.createElement("div", { className: "address" }, /* @__PURE__ */ React79.createElement("h2", null, getShortenedAddress(connectedAddress || "")), /* @__PURE__ */ React79.createElement(CopyButton_default, { text: connectedAddress })), /* @__PURE__ */ React79.createElement("h3", null, formatterFloat.format(Number(tronBalance)), " ", selectedNetwork.shortName)), /* @__PURE__ */ React79.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ React79.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ React79.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ React79.createElement("p", null, "Block explorer"), /* @__PURE__ */ React79.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ React79.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Disconnect")))
+    )))), /* @__PURE__ */ React80.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React80.createElement("div", { className: "summary" }, networkDetails && /* @__PURE__ */ React80.createElement(networkDetails.icon, { width: 60, height: 60 }), /* @__PURE__ */ React80.createElement("div", { className: "address" }, /* @__PURE__ */ React80.createElement("h2", null, getShortenedAddress(connectedAddress || "")), /* @__PURE__ */ React80.createElement(CopyButton_default, { text: connectedAddress })), /* @__PURE__ */ React80.createElement("h3", null, formatterFloat.format(Number(tronBalance)), " ", selectedNetwork.shortName)), /* @__PURE__ */ React80.createElement(SecondaryButton_default, { className: "block-explorer" }, /* @__PURE__ */ React80.createElement(ExternalLink_default, { className: "link", to: explorerUrl }, /* @__PURE__ */ React80.createElement(Explorer_default, { fill: "#778DA3" }), /* @__PURE__ */ React80.createElement("p", null, "Block explorer"), /* @__PURE__ */ React80.createElement(ExternalUrl_default, { fill: "#778DA3" }))), /* @__PURE__ */ React80.createElement(PrimaryButton_default, { clickHandler: handleDisconnect }, "Disconnect")))
   );
 };
 var AccountDetailsModal_default2 = AccountDetailsModal2;
 
 // plugins/tron/components/TronWalletSelect.tsx
-import React80, { useEffect as useEffect19, useMemo as useMemo18, useRef as useRef6 } from "react";
+import React81, { useEffect as useEffect19, useMemo as useMemo18, useRef as useRef6 } from "react";
 import { useDispatch as useDispatch22, useSelector as useSelector40 } from "react-redux";
 import { useWallet as useWallet8 } from "@tronweb3/tronwallet-adapter-react-hooks";
 import { AdapterState } from "@tronweb3/tronwallet-abstract-adapter";
@@ -6485,22 +6898,22 @@ var TronWalletSelect = () => {
   const connectWallet = async (walletName) => {
     currentWallet?.adapter.name === walletName ? await connect() : select(walletName);
   };
-  return /* @__PURE__ */ React80.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ React80.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ React80.createElement("div", { className: "wallet-container" }, detected.map((wallet, index) => /* @__PURE__ */ React80.createElement(
+  return /* @__PURE__ */ React81.createElement("div", { className: `wallet-select` }, /* @__PURE__ */ React81.createElement("div", { className: "slide-area hide-scrollbar", ref: sliderRef }, /* @__PURE__ */ React81.createElement("div", { className: "wallet-container" }, detected.map((wallet, index) => /* @__PURE__ */ React81.createElement(
     "div",
     {
       className: `card-item ${theme.colorMode}`,
       onClick: () => connectWallet(wallet.adapter.name),
       key: `${wallet.adapter.name}-${index}`
     },
-    /* @__PURE__ */ React80.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React80.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ React80.createElement("span", null, wallet.adapter.name))
-  )), undetected.map((wallet, index) => /* @__PURE__ */ React80.createElement(
+    /* @__PURE__ */ React81.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React81.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ React81.createElement("span", null, wallet.adapter.name))
+  )), undetected.map((wallet, index) => /* @__PURE__ */ React81.createElement(
     ExternalLink_default,
     {
       to: wallet.adapter.url,
       className: `card-item ${theme.colorMode}`,
       key: `${wallet.adapter.name}-${index}`
     },
-    /* @__PURE__ */ React80.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React80.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ React80.createElement("span", null, "Install ", wallet.adapter.name))
+    /* @__PURE__ */ React81.createElement("div", { className: "wallet-item" }, /* @__PURE__ */ React81.createElement("img", { src: wallet.adapter.icon, alt: wallet.adapter.name }), /* @__PURE__ */ React81.createElement("span", null, "Install ", wallet.adapter.name))
   )))));
 };
 var TronWalletSelect_default = TronWalletSelect;
@@ -6510,25 +6923,25 @@ var TronWalletConnectModal = () => {
   const dispatch = useDispatch23();
   const theme = useSelector41(selectTheme);
   const connectModal = useSelector41(selectTronConnectModal);
-  return /* @__PURE__ */ React81.createElement("div", null, /* @__PURE__ */ React81.createElement(AccountDetailsModal_default2, null), /* @__PURE__ */ React81.createElement(
+  return /* @__PURE__ */ React82.createElement("div", null, /* @__PURE__ */ React82.createElement(AccountDetailsModal_default2, null), /* @__PURE__ */ React82.createElement(
     "div",
     {
       className: `kima-modal wallet-connect ${theme.colorMode} ${connectModal ? "open" : ""}`
     },
-    /* @__PURE__ */ React81.createElement("div", { className: "modal-overlay" }),
-    /* @__PURE__ */ React81.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React81.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React81.createElement("div", { className: "topbar" }, /* @__PURE__ */ React81.createElement("div", { className: "title" }, /* @__PURE__ */ React81.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ React81.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React81.createElement(
+    /* @__PURE__ */ React82.createElement("div", { className: "modal-overlay" }),
+    /* @__PURE__ */ React82.createElement("div", { className: `modal-content-container ${theme.colorMode}` }, /* @__PURE__ */ React82.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React82.createElement("div", { className: "topbar" }, /* @__PURE__ */ React82.createElement("div", { className: "title" }, /* @__PURE__ */ React82.createElement("h3", null, "Connect Wallet")), /* @__PURE__ */ React82.createElement("div", { className: "control-buttons" }, /* @__PURE__ */ React82.createElement(
       "button",
       {
         className: "icon-button",
         onClick: () => dispatch(setTronConnectModal(false))
       },
-      /* @__PURE__ */ React81.createElement(
+      /* @__PURE__ */ React82.createElement(
         Cross_default,
         {
           fill: theme.colorMode === "light" ? "black" : "white"
         }
       )
-    )))), /* @__PURE__ */ React81.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React81.createElement(TronWalletSelect_default, null)))
+    )))), /* @__PURE__ */ React82.createElement("div", { className: "modal-content" }, /* @__PURE__ */ React82.createElement(TronWalletSelect_default, null)))
   ));
 };
 var TronWalletConnectModal_default = TronWalletConnectModal;
@@ -6622,7 +7035,7 @@ var useValidateTransaction = (inputs) => {
       };
     }
     if (compliantOption) {
-      if (!sourceCompliant?.isCompliant) {
+      if (!sourceCompliant?.isCompliant && sourceChain !== "CC") {
         return {
           error: "ValidationError" /* Error */,
           message: "Source address compliance check failed"
@@ -6680,8 +7093,7 @@ var useValidateTransaction_default = useValidateTransaction;
 // src/hooks/useSubmitTransaction.tsx
 import { useDispatch as useDispatch24, useSelector as useSelector43 } from "react-redux";
 import { useMutation } from "@tanstack/react-query";
-import { useState as useState14 } from "react";
-var useSubmitTransaction = () => {
+var useSubmitTransaction = (isSubmitting, setIsSubmitting) => {
   const dispatch = useDispatch24();
   const backendUrl = useSelector43(selectBackendUrl);
   const mode = useSelector43(selectMode);
@@ -6690,7 +7102,6 @@ var useSubmitTransaction = () => {
   const txValues = feeDeduct ? transactionValues.feeFromTarget : transactionValues.feeFromOrigin;
   const ccTransactionIdSeed = useSelector43(selectCCTransactionIdSeed);
   const submitted = useSelector43(selectSubmitted);
-  const [isSubmitting, setIsSubmitting] = useState14(false);
   const mutation = useMutation({
     mutationFn: async (signature) => {
       setIsSubmitting(true);
@@ -6789,6 +7200,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,
@@ -6798,9 +7211,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
   });
@@ -6845,7 +7256,7 @@ function useDisconnectWallet5() {
 }
 
 // src/components/reusable/WarningModal.tsx
-import React82 from "react";
+import React83 from "react";
 var WarningModal = ({
   message,
   cancelButtonText = "Cancel",
@@ -6853,14 +7264,14 @@ var WarningModal = ({
   onAcknowledge,
   onCancel
 }) => {
-  return /* @__PURE__ */ React82.createElement("div", { className: "warning-modal-overlay" }, /* @__PURE__ */ React82.createElement("div", { className: "warning-modal" }, /* @__PURE__ */ React82.createElement("h3", null, "Warning"), /* @__PURE__ */ React82.createElement("p", null, message), /* @__PURE__ */ React82.createElement("div", { className: "warning-modal-buttons" }, /* @__PURE__ */ React82.createElement(
+  return /* @__PURE__ */ React83.createElement("div", { className: "warning-modal-overlay" }, /* @__PURE__ */ React83.createElement("div", { className: "warning-modal" }, /* @__PURE__ */ React83.createElement("h3", null, "Warning"), /* @__PURE__ */ React83.createElement("p", null, message), /* @__PURE__ */ React83.createElement("div", { className: "warning-modal-buttons" }, /* @__PURE__ */ React83.createElement(
     SecondaryButton_default,
     {
       className: "warning-modal-cancel",
       clickHandler: onCancel
     },
     cancelButtonText
-  ), /* @__PURE__ */ React82.createElement(
+  ), /* @__PURE__ */ React83.createElement(
     PrimaryButton_default,
     {
       className: "warning-modal-acknowledge",
@@ -6872,7 +7283,7 @@ var WarningModal = ({
 var WarningModal_default = WarningModal;
 
 // src/components/reusable/CCWidget.tsx
-import React83, { useEffect as useEffect20, useMemo as useMemo20, useRef as useRef7, useState as useState15 } from "react";
+import React84, { useEffect as useEffect20, useMemo as useMemo20, useRef as useRef7, useState as useState14 } from "react";
 import { useSelector as useSelector44, useDispatch as useDispatch25 } from "react-redux";
 import { v4 as uuidv4 } from "uuid";
 
@@ -6929,7 +7340,7 @@ var CCWidget = ({ submitCallback }) => {
     () => formatBigInt(txValues.allowanceAmount),
     [txValues]
   );
-  const [isLoading, setIsLoading] = useState15(true);
+  const [isLoading, setIsLoading] = useState14(true);
   const baseUrl = useMemo20(
     () => `https://widget${networkOption === "testnet" /* testnet */ ? "-sandbox" : ""}.depasify.com`,
     [networkOption]
@@ -6958,7 +7369,7 @@ var CCWidget = ({ submitCallback }) => {
   useEffect20(() => {
     if (error) dispatch(setCCTransactionStatus("error-id"));
   }, [dispatch, error]);
-  return /* @__PURE__ */ React83.createElement("div", { className: `cc-widget ${isLoading ? "loading" : ""}` }, (isLoading || isTransactionIdLoading || isEnvLoading || ccTransactionStatus === "success") && /* @__PURE__ */ React83.createElement("div", { className: "cc-widget-loader" }, /* @__PURE__ */ React83.createElement(ring_default, { width: 50, height: 50, fill: "#86b8ce" })), /* @__PURE__ */ React83.createElement(
+  return /* @__PURE__ */ React84.createElement("div", { className: `cc-widget ${isLoading ? "loading" : ""}` }, (isLoading || isTransactionIdLoading || isEnvLoading || ccTransactionStatus === "success") && /* @__PURE__ */ React84.createElement("div", { className: "cc-widget-loader" }, /* @__PURE__ */ React84.createElement(ring_default, { width: 50, height: 50, fill: "#86b8ce" })), /* @__PURE__ */ React84.createElement(
     "iframe",
     {
       width: isLoading || isTransactionIdLoading || ccTransactionStatus === "success" || error ? 0 : "100%",
@@ -6988,10 +7399,11 @@ var TransferWidget = ({
 }) => {
   const dispatch = useDispatch26();
   const mainRef = useRef8(null);
-  const [signature, setSignature2] = useState16("");
-  const [formStep, setFormStep] = useState16(0);
-  const [warningModalOpen, setWarningModalOpen] = useState16(null);
-  const [resetModalOpen, setResetModalOpen] = useState16(false);
+  const [signature, setSignature2] = useState15("");
+  const [isSubmitting, setIsSubmitting] = useState15(false);
+  const [formStep, setFormStep] = useState15(0);
+  const [warningModalOpen, setWarningModalOpen] = useState15(null);
+  const [resetModalOpen, setResetModalOpen] = useState15(false);
   const networkOption = useSelector45(selectNetworkOption);
   const dAppOption = useSelector45(selectDappOption);
   const mode = useSelector45(selectMode);
@@ -7010,11 +7422,11 @@ var TransferWidget = ({
   const feeDeduct = useSelector45(selectFeeDeduct);
   const txValues = feeDeduct ? transactionValues.feeFromTarget : transactionValues.feeFromOrigin;
   const { keplrHandler, closeHandler } = useKimaContext();
-  const [isCancellingApprove, setCancellingApprove] = useState16(false);
-  const [isApproving, setApproving] = useState16(false);
-  const [isSigning, setSigning] = useState16(false);
-  const [feeOptionDisabled, setFeeOptionDisabled] = useState16(false);
-  const [initialSelection, setInitialSelection] = useState16({
+  const [isCancellingApprove, setCancellingApprove] = useState15(false);
+  const [isApproving, setApproving] = useState15(false);
+  const [isSigning, setSigning] = useState15(false);
+  const [feeOptionDisabled, setFeeOptionDisabled] = useState15(false);
+  const [initialSelection, setInitialSelection] = useState15({
     sourceSelection: true,
     targetSelection: true
   });
@@ -7024,6 +7436,10 @@ var TransferWidget = ({
   const ccTransactionStatus = useSelector45(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
@@ -7087,7 +7503,6 @@ var TransferWidget = ({
       setInitialSelection((prev) => ({ ...prev, targetSelection: false }));
     }
   }, [fees, mode, transactionOption, dispatch]);
-  const { submitTransaction, isSubmitting } = useSubmitTransaction_default();
   const isBackButtonEnabled = useMemo21(() => {
     if (formStep !== 0) {
       if (sourceChain.shortName === "CC") {
@@ -7108,21 +7523,22 @@ var TransferWidget = ({
     try {
       await submitTransaction(signature);
     } catch (err) {
-      toast5.error("Failed to submit transaction", { icon: /* @__PURE__ */ React84.createElement(Error_default, null) });
+      toast5.error("Failed to submit transaction", { icon: /* @__PURE__ */ React85.createElement(Error_default, null) });
       dispatch(setCCTransactionStatus("error-generic"));
     }
   }, [signature, submitTransaction]);
   const handleSubmit = async () => {
     const { error: error2, message: validationMessage } = validate(true);
     if (error2 === "ValidationError" /* Error */) {
-      return toast5.error(validationMessage, { icon: /* @__PURE__ */ React84.createElement(Error_default, null) });
+      return toast5.error(validationMessage, { icon: /* @__PURE__ */ React85.createElement(Error_default, null) });
     }
     if (sourceChain.shortName === "CC") {
       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,
@@ -7131,15 +7547,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,
@@ -7164,7 +7582,7 @@ var TransferWidget = ({
     if (error2 !== "ValidationError" /* Error */ && formStep > 0) {
       return handleSubmit();
     }
-    toast5.error(validationMessage, { icon: /* @__PURE__ */ React84.createElement(Error_default, null) });
+    toast5.error(validationMessage, { icon: /* @__PURE__ */ React85.createElement(Error_default, null) });
     mainRef.current?.click();
   };
   const onBack = () => {
@@ -7186,9 +7604,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) {
@@ -7203,7 +7621,6 @@ var TransferWidget = ({
   };
   const resetForm = async () => {
     if (isApproving || isSubmitting || isSigning) return;
-    closeHandler && closeHandler(0);
     setSignature2("");
     setSigning(false);
     setFormStep(0);
@@ -7239,7 +7656,7 @@ var TransferWidget = ({
     }
     await disconnectWallet();
   };
-  return /* @__PURE__ */ React84.createElement(
+  return /* @__PURE__ */ React85.createElement(
     "div",
     {
       className: `kima-card ${theme.colorMode}`,
@@ -7247,7 +7664,7 @@ var TransferWidget = ({
         background: theme.colorMode === "light" /* light */ ? theme.backgroundColorLight : theme.backgroundColorDark
       }
     },
-    resetModalOpen && /* @__PURE__ */ React84.createElement(
+    resetModalOpen && /* @__PURE__ */ React85.createElement(
       WarningModal_default,
       {
         message: "Are you sure you want to reset the widget?",
@@ -7259,7 +7676,7 @@ var TransferWidget = ({
         onCancel: () => setResetModalOpen(false)
       }
     ),
-    warningModalOpen && /* @__PURE__ */ React84.createElement(
+    warningModalOpen && /* @__PURE__ */ React85.createElement(
       WarningModal_default,
       {
         message: warningModalOpen.message,
@@ -7273,14 +7690,14 @@ var TransferWidget = ({
         }
       }
     ),
-    mode === "payment" /* payment */ && !transactionOption && /* @__PURE__ */ React84.createElement("h2", { className: "invalid-option-banner" }, "We're unable to process your payment. Please ensure the necessary transaction details are provided. Contact support if the issue persists."),
-    /* @__PURE__ */ React84.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React84.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React84.createElement("div", { className: "topbar" }, /* @__PURE__ */ React84.createElement("div", { className: "title" }, /* @__PURE__ */ React84.createElement("h3", { style: { marginRight: "5px" } }, formStep === 0 ? titleOption?.initialTitle ? titleOption.initialTitle : mode === "payment" /* payment */ ? "New Purchase" : "New Transfer" : titleOption?.confirmTitle ? titleOption.confirmTitle : mode === "payment" /* payment */ ? "Confirm Purchase" : "Transfer Details")), /* @__PURE__ */ React84.createElement("div", { className: "control-buttons" }, pendingTxs > 0 ? /* @__PURE__ */ React84.createElement(TxButton_default, { theme }) : null, /* @__PURE__ */ React84.createElement(
+    mode === "payment" /* payment */ && !transactionOption && /* @__PURE__ */ React85.createElement("h2", { className: "invalid-option-banner" }, "We're unable to process your payment. Please ensure the necessary transaction details are provided. Contact support if the issue persists."),
+    /* @__PURE__ */ React85.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React85.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React85.createElement("div", { className: "topbar" }, /* @__PURE__ */ React85.createElement("div", { className: "title" }, /* @__PURE__ */ React85.createElement("h3", { style: { marginRight: "5px" } }, formStep === 0 ? titleOption?.initialTitle ? titleOption.initialTitle : mode === "payment" /* payment */ ? "New Purchase" : "New Transfer" : titleOption?.confirmTitle ? titleOption.confirmTitle : mode === "payment" /* payment */ ? "Confirm Purchase" : "Transfer Details")), /* @__PURE__ */ React85.createElement("div", { className: "control-buttons" }, pendingTxs > 0 ? /* @__PURE__ */ React85.createElement(TxButton_default, { theme }) : null, /* @__PURE__ */ React85.createElement(
       ExternalLink_default,
       {
         to: helpURL ? helpURL : networkOption === "testnet" /* testnet */ ? "https://docs.kima.network/kima-network/try-kima-with-the-demo-app" : "https://support.kima.network"
       },
-      /* @__PURE__ */ React84.createElement("div", { className: "menu-button" }, "I need help")
-    ), sourceChain.shortName === "CC" && formStep > 0 && /* @__PURE__ */ React84.createElement(ExternalLink_default, { to: "https://docs.kima.network/kima-network/supported-fiat#unsupported-countries-credit-cards" }, /* @__PURE__ */ React84.createElement("div", { className: "menu-button" }, "Unsupported Countries")), formStep === 0 && mode !== "payment" /* payment */ && /* @__PURE__ */ React84.createElement(
+      /* @__PURE__ */ React85.createElement("div", { className: "menu-button" }, "I need help")
+    ), sourceChain.shortName === "CC" && formStep > 0 && /* @__PURE__ */ React85.createElement(ExternalLink_default, { to: "https://docs.kima.network/kima-network/supported-fiat#unsupported-countries-credit-cards" }, /* @__PURE__ */ React85.createElement("div", { className: "menu-button" }, "Unsupported Countries")), formStep === 0 && mode !== "payment" /* payment */ && /* @__PURE__ */ React85.createElement(
       "button",
       {
         className: "reset-button",
@@ -7288,7 +7705,17 @@ var TransferWidget = ({
         disabled: isApproving || isSubmitting || isSigning
       },
       "Reset"
-    ))), mode === "payment" /* payment */ && paymentTitleOption?.title && /* @__PURE__ */ React84.createElement("h4", { className: "subtitle" }, paymentTitleOption.title)), /* @__PURE__ */ React84.createElement("div", { className: "kima-card-content", ref: mainRef }, formStep === 0 ? /* @__PURE__ */ React84.createElement(
+    ), closeHandler && /* @__PURE__ */ React85.createElement(
+      "button",
+      {
+        className: "cross-icon-button",
+        onClick: () => {
+          resetForm();
+          closeHandler(0);
+        }
+      },
+      /* @__PURE__ */ React85.createElement(Cross_default, null)
+    ))), mode === "payment" /* payment */ && paymentTitleOption?.title && /* @__PURE__ */ React85.createElement("h4", { className: "subtitle" }, paymentTitleOption.title)), /* @__PURE__ */ React85.createElement("div", { className: "kima-card-content", ref: mainRef }, formStep === 0 ? /* @__PURE__ */ React85.createElement(
       SingleForm_default,
       {
         ...{
@@ -7301,7 +7728,7 @@ var TransferWidget = ({
           setInitialSelection
         }
       }
-    ) : ccTransactionStatus !== "idle" ? /* @__PURE__ */ React84.createElement(CCWidget_default, { submitCallback: submit }) : /* @__PURE__ */ React84.createElement(
+    ) : ccTransactionStatus !== "idle" ? /* @__PURE__ */ React85.createElement(CCWidget_default, { submitCallback: submit }) : /* @__PURE__ */ React85.createElement(
       ConfirmDetails_default,
       {
         ...{
@@ -7309,12 +7736,12 @@ var TransferWidget = ({
           feeOptionDisabled
         }
       }
-    )), /* @__PURE__ */ React84.createElement(
+    )), /* @__PURE__ */ React85.createElement(
       "div",
       {
         className: `kima-card-footer ${mode === "bridge" /* bridge */ && formStep !== 0 && "confirm"}`
       },
-      /* @__PURE__ */ React84.createElement("div", { className: `button-group` }, isBackButtonEnabled && /* @__PURE__ */ React84.createElement(
+      /* @__PURE__ */ React85.createElement("div", { className: `button-group` }, isBackButtonEnabled && /* @__PURE__ */ React85.createElement(
         SecondaryButton_default,
         {
           clickHandler: onBack,
@@ -7322,7 +7749,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__ */ React84.createElement(
+      ), !!allowance && allowance > 0 && formStep !== 0 && sourceChain.shortName !== "CC" && mode !== "light" /* light */ && dAppOption !== "LPDrain" /* LPDrain */ ? /* @__PURE__ */ React85.createElement(
         SecondaryButton_default,
         {
           clickHandler: onCancelApprove,
@@ -7331,7 +7758,7 @@ var TransferWidget = ({
           disabled: isCancellingApprove || isApproving || isSubmitting || isSigning
         },
         isCancellingApprove ? "Cancelling Approval" : "Cancel Approve"
-      ) : null, isSubmitButtonEnabled && /* @__PURE__ */ React84.createElement(
+      ) : null, isSubmitButtonEnabled && /* @__PURE__ */ React85.createElement(
         PrimaryButton_default,
         {
           clickHandler: onNext,
@@ -7340,7 +7767,7 @@ var TransferWidget = ({
         },
         getButtonLabel()
       ))
-    ), /* @__PURE__ */ React84.createElement(SolanaWalletConnectModal_default, null), /* @__PURE__ */ React84.createElement(TronWalletConnectModal_default, null), /* @__PURE__ */ React84.createElement(
+    ), /* @__PURE__ */ React85.createElement(SolanaWalletConnectModal_default, null), /* @__PURE__ */ React85.createElement(TronWalletConnectModal_default, null), /* @__PURE__ */ React85.createElement(
       Toaster2,
       {
         position: "top-right",
@@ -7365,7 +7792,7 @@ var TransferWidget = ({
           }
         }
       }
-    ), /* @__PURE__ */ React84.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React84.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React84.createElement("span", null, "Powered by"), /* @__PURE__ */ React84.createElement(KimaNetwork_default, null))))
+    ), /* @__PURE__ */ React85.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React85.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React85.createElement("span", null, "Powered by"), /* @__PURE__ */ React85.createElement(KimaNetwork_default, null))))
   );
 };
 
@@ -7373,10 +7800,10 @@ var TransferWidget = ({
 import { useAppKitTheme } from "@reown/appkit/react";
 
 // src/hooks/useDebugMode.ts
-import { useEffect as useEffect22, useState as useState17 } from "react";
+import { useEffect as useEffect22, useState as useState16 } from "react";
 var useDebugCode = (sequence = ["D", "E", "B", "U", "G"]) => {
-  const [debugMode, setDebugMode] = useState17(false);
-  const [, setInputSequence] = useState17([]);
+  const [debugMode, setDebugMode] = useState16(false);
+  const [, setInputSequence] = useState16([]);
   useEffect22(() => {
     const onKeyDown = (e) => {
       setInputSequence((prev) => {
@@ -7404,7 +7831,7 @@ var useDebugCode = (sequence = ["D", "E", "B", "U", "G"]) => {
 };
 
 // src/components/ErrorWidget.tsx
-import React85 from "react";
+import React86 from "react";
 import { useSelector as useSelector46 } from "react-redux";
 var ErrorWidget = ({
   theme,
@@ -7417,7 +7844,7 @@ var ErrorWidget = ({
   const ccTransactionId = useSelector46(selectCCTransactionId);
   const isCreditCardSource = sourceChain.shortName === "CC";
   const isRetrying = useSelector46(selectCCTransactionRetrying);
-  return /* @__PURE__ */ React85.createElement(
+  return /* @__PURE__ */ React86.createElement(
     "div",
     {
       className: `kima-card ${theme.colorMode}`,
@@ -7425,7 +7852,7 @@ var ErrorWidget = ({
         background: theme.colorMode === "light" /* light */ ? theme.backgroundColorLight : theme.backgroundColorDark
       }
     },
-    /* @__PURE__ */ React85.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React85.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React85.createElement("div", { className: "topbar" }, /* @__PURE__ */ React85.createElement("div", { className: "title" }, /* @__PURE__ */ React85.createElement("h3", null, title))), /* @__PURE__ */ React85.createElement("h4", { className: "subtitle" })), /* @__PURE__ */ React85.createElement("div", { className: "kima-card-content error" }, isCreditCardSource && !isRetrying && /* @__PURE__ */ React85.createElement(Error_default, { width: 40, height: 40 }), message && message !== "" && /* @__PURE__ */ React85.createElement("h2", null, message), isCreditCardSource && /* @__PURE__ */ React85.createElement(
+    /* @__PURE__ */ React86.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React86.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React86.createElement("div", { className: "topbar" }, /* @__PURE__ */ React86.createElement("div", { className: "title" }, /* @__PURE__ */ React86.createElement("h3", null, title))), /* @__PURE__ */ React86.createElement("h4", { className: "subtitle" })), /* @__PURE__ */ React86.createElement("div", { className: "kima-card-content error" }, isCreditCardSource && !isRetrying && /* @__PURE__ */ React86.createElement(Error_default, { width: 40, height: 40 }), message && message !== "" && /* @__PURE__ */ React86.createElement("h2", null, message), isCreditCardSource && /* @__PURE__ */ React86.createElement(
       "div",
       {
         style: {
@@ -7434,8 +7861,8 @@ var ErrorWidget = ({
           flexDirection: "column"
         }
       },
-      isRetrying ? /* @__PURE__ */ React85.createElement("p", null, "The transaction is being retried in the background. This may take a few moments. If the issue persists, please contact support and provide the transaction ID below for reference.") : /* @__PURE__ */ React85.createElement("p", null, "This credit card transaction has failed. Please check the details and try again. If the issue persists, please contact support and provide the transaction ID below for reference."),
-      ccTransactionId && /* @__PURE__ */ React85.createElement(
+      isRetrying ? /* @__PURE__ */ React86.createElement("p", null, "The transaction is being retried in the background. This may take a few moments. If the issue persists, please contact support and provide the transaction ID below for reference.") : /* @__PURE__ */ React86.createElement("p", null, "This credit card transaction has failed. Please check the details and try again. If the issue persists, please contact support and provide the transaction ID below for reference."),
+      ccTransactionId && /* @__PURE__ */ React86.createElement(
         "div",
         {
           style: {
@@ -7445,7 +7872,7 @@ var ErrorWidget = ({
             justifyContent: "center"
           }
         },
-        /* @__PURE__ */ React85.createElement(
+        /* @__PURE__ */ React86.createElement(
           "code",
           {
             style: {
@@ -7456,10 +7883,10 @@ var ErrorWidget = ({
           },
           ccTransactionId
         ),
-        /* @__PURE__ */ React85.createElement(CopyButton_default, { text: ccTransactionId })
+        /* @__PURE__ */ React86.createElement(CopyButton_default, { text: ccTransactionId })
       ),
-      isRetrying && /* @__PURE__ */ React85.createElement(ring_default, { width: 30, height: 30, fill: "#86b8ce" })
-    )), backButtonEnabled && /* @__PURE__ */ React85.createElement(
+      isRetrying && /* @__PURE__ */ React86.createElement(ring_default, { width: 30, height: 30, fill: "#86b8ce" })
+    )), backButtonEnabled && /* @__PURE__ */ React86.createElement(
       "div",
       {
         style: {
@@ -7468,8 +7895,8 @@ var ErrorWidget = ({
           marginTop: 16
         }
       },
-      /* @__PURE__ */ React85.createElement(PrimaryButton_default, { clickHandler: backButtonFunction }, "Back")
-    ), /* @__PURE__ */ React85.createElement("div", { className: "kima-card-footer" }), /* @__PURE__ */ React85.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React85.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React85.createElement("span", null, "Powered by"), /* @__PURE__ */ React85.createElement(FooterLogo_default, { width: 50, fill: "black" }), /* @__PURE__ */ React85.createElement("strong", null, "Network"))))
+      /* @__PURE__ */ React86.createElement(PrimaryButton_default, { clickHandler: backButtonFunction }, "Back")
+    ), /* @__PURE__ */ React86.createElement("div", { className: "kima-card-footer" }), /* @__PURE__ */ React86.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React86.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React86.createElement("span", null, "Powered by"), /* @__PURE__ */ React86.createElement(FooterLogo_default, { width: 50, fill: "black" }), /* @__PURE__ */ React86.createElement("strong", null, "Network"))))
   );
 };
 var ErrorWidget_default = ErrorWidget;
@@ -7483,7 +7910,7 @@ var KimaWidgetWrapper = ({
   titleOption,
   paymentTitleOption,
   helpURL = "",
-  compliantOption = true,
+  compliantOption = false,
   transactionOption,
   chainData,
   envOptions
@@ -7547,9 +7974,9 @@ var KimaWidgetWrapper = ({
     console.log("widget wrapper", submitted, ccTransactionStatus);
     if (submitted) {
       logger_default.debug("will return transaction widget on cc success");
-      return /* @__PURE__ */ React86.createElement(TransactionWidget, { theme });
+      return /* @__PURE__ */ React87.createElement(TransactionWidget, { theme });
     } else if (ccTransactionStatus === "error-id") {
-      return /* @__PURE__ */ React86.createElement(
+      return /* @__PURE__ */ React87.createElement(
         ErrorWidget_default,
         {
           theme,
@@ -7563,7 +7990,7 @@ var KimaWidgetWrapper = ({
         }
       );
     } else if (ccTransactionStatus === "error-generic") {
-      return /* @__PURE__ */ React86.createElement(
+      return /* @__PURE__ */ React87.createElement(
         ErrorWidget_default,
         {
           theme,
@@ -7577,7 +8004,7 @@ var KimaWidgetWrapper = ({
         }
       );
     }
-    return /* @__PURE__ */ React86.createElement(
+    return /* @__PURE__ */ React87.createElement(
       TransferWidget,
       {
         theme,
@@ -7587,7 +8014,7 @@ var KimaWidgetWrapper = ({
       }
     );
   }
-  return submitted ? /* @__PURE__ */ React86.createElement(TransactionWidget, { theme }) : /* @__PURE__ */ React86.createElement(
+  return submitted ? /* @__PURE__ */ React87.createElement(TransactionWidget, { theme }) : /* @__PURE__ */ React87.createElement(
     TransferWidget,
     {
       theme,
@@ -7603,9 +8030,9 @@ var KimaWidgetWrapper_default = KimaWidgetWrapper;
 import { useDispatch as useDispatch28 } from "react-redux";
 
 // src/SkeletonLoader.tsx
-import React87 from "react";
+import React88 from "react";
 var SkeletonLoader = ({ theme }) => {
-  return /* @__PURE__ */ React87.createElement(
+  return /* @__PURE__ */ React88.createElement(
     "div",
     {
       className: `kima-card ${theme.colorMode}`,
@@ -7613,7 +8040,7 @@ var SkeletonLoader = ({ theme }) => {
         background: theme.colorMode === "light" /* light */ ? theme.backgroundColorLight : theme.backgroundColorDark
       }
     },
-    /* @__PURE__ */ React87.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React87.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React87.createElement("div", { className: "topbar" }, /* @__PURE__ */ React87.createElement("div", { className: "title skeleton" }, /* @__PURE__ */ React87.createElement("h3", null))), /* @__PURE__ */ React87.createElement("h4", { className: "subtitle" })), /* @__PURE__ */ React87.createElement("div", { className: "kima-card-content skeleton" }, /* @__PURE__ */ React87.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React87.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React87.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React87.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React87.createElement("div", { className: "skeleton" })), /* @__PURE__ */ React87.createElement("div", { className: `kima-card-footer` }, /* @__PURE__ */ React87.createElement("div", { className: `button-group skeleton` }, /* @__PURE__ */ React87.createElement("div", { className: "skeleton" }))), /* @__PURE__ */ React87.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React87.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React87.createElement("span", null, "Powered by"), /* @__PURE__ */ React87.createElement(FooterLogo_default, { width: 50, fill: "black" }), /* @__PURE__ */ React87.createElement("strong", null, "Network"))))
+    /* @__PURE__ */ React88.createElement("div", { className: "transfer-card" }, /* @__PURE__ */ React88.createElement("div", { className: "kima-card-header" }, /* @__PURE__ */ React88.createElement("div", { className: "topbar" }, /* @__PURE__ */ React88.createElement("div", { className: "title skeleton" }, /* @__PURE__ */ React88.createElement("h3", null))), /* @__PURE__ */ React88.createElement("h4", { className: "subtitle" })), /* @__PURE__ */ React88.createElement("div", { className: "kima-card-content skeleton" }, /* @__PURE__ */ React88.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React88.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React88.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React88.createElement("div", { className: "skeleton" }), /* @__PURE__ */ React88.createElement("div", { className: "skeleton" })), /* @__PURE__ */ React88.createElement("div", { className: `kima-card-footer` }, /* @__PURE__ */ React88.createElement("div", { className: `button-group skeleton` }, /* @__PURE__ */ React88.createElement("div", { className: "skeleton" }))), /* @__PURE__ */ React88.createElement("div", { className: "floating-footer" }, /* @__PURE__ */ React88.createElement("div", { className: `items ${theme.colorMode}` }, /* @__PURE__ */ React88.createElement("span", null, "Powered by"), /* @__PURE__ */ React88.createElement(FooterLogo_default, { width: 50, fill: "black" }), /* @__PURE__ */ React88.createElement("strong", null, "Network"))))
   );
 };
 var SkeletonLoader_default = SkeletonLoader;
@@ -7632,7 +8059,7 @@ var KimaTransactionWidget = ({
 }) => {
   const dispatch = useDispatch28();
   const { kimaBackendUrl } = useKimaContext();
-  const [hydrated, setHydrated] = useState18(false);
+  const [hydrated, setHydrated] = useState17(false);
   const {
     data: envOptions,
     error: envOptionsError,
@@ -7658,11 +8085,11 @@ var KimaTransactionWidget = ({
     }
   }, [theme?.colorMode]);
   if (!hydrated || !theme?.colorMode)
-    return /* @__PURE__ */ React88.createElement(ring_default, { width: 20, height: 20, fill: "#86b8ce" });
+    return /* @__PURE__ */ React89.createElement(ring_default, { width: 20, height: 20, fill: "#86b8ce" });
   if (isLoadingEnvs || isLoadingChainData)
-    return /* @__PURE__ */ React88.createElement(SkeletonLoader_default, { theme });
+    return /* @__PURE__ */ React89.createElement(SkeletonLoader_default, { theme });
   if (envOptionsError || !envOptions)
-    return /* @__PURE__ */ React88.createElement(
+    return /* @__PURE__ */ React89.createElement(
       ErrorWidget_default,
       {
         theme,
@@ -7671,7 +8098,7 @@ var KimaTransactionWidget = ({
       }
     );
   if (chainDataError || !chainData)
-    return /* @__PURE__ */ React88.createElement(
+    return /* @__PURE__ */ React89.createElement(
       ErrorWidget_default,
       {
         theme,
@@ -7679,7 +8106,7 @@ var KimaTransactionWidget = ({
         message: "There was an error loading the chain data from the backend. Please check that the backend is running properly and the widget points to the corresponding url." /* ChainLoadingError */
       }
     );
-  return /* @__PURE__ */ React88.createElement(
+  return /* @__PURE__ */ React89.createElement(
     KimaWidgetWrapper_default,
     {
       ...{