@multiversx/sdk-dapp-liquidity 2.3.0-alpha.1 → 2.3.0-alpha.3

package/reactjs/components/Connect/BridgeAccountDisplay.mjs

@@ -1,16 +1,17 @@
-import { jsxs as t, Fragment as u, jsx as l } from "react/jsx-runtime";
-import { faPowerOff as f } from "@fortawesome/free-solid-svg-icons/faPowerOff";
-import { FontAwesomeIcon as x } from "@fortawesome/react-fontawesome";
-import { useDisconnect as g } from "@reown/appkit/react";
-import { getDisplayName as s } from "../../../helpers/getDisplayName.mjs";
-import { SwitchChainButton as y } from "./SwitchChainButton.mjs";
-import { ChainType as N } from "../../../types/chainType.mjs";
-import { useAccount as b } from "../../hooks/useAccount.mjs";
-import { useSuiConnect as w } from "../../hooks/useSuiConnect.mjs";
+import { jsxs as r, Fragment as x, jsx as e } from "react/jsx-runtime";
+import { faPowerOff as g } from "@fortawesome/free-solid-svg-icons/faPowerOff";
+import { FontAwesomeIcon as y } from "@fortawesome/react-fontawesome";
+import { useDisconnect as N } from "@reown/appkit/react";
+import { getDisplayName as t } from "../../../helpers/getDisplayName.mjs";
+import { SwitchChainButton as b } from "./SwitchChainButton.mjs";
+import { ChainType as o } from "../../../types/chainType.mjs";
+import { useAccount as w } from "../../hooks/useAccount.mjs";
+import { useNamespaceAddress as k } from "../../hooks/useNamespaceAddress.mjs";
+import { useSuiConnect as A } from "../../hooks/useSuiConnect.mjs";
 import "clsx";
 import "tailwind-merge";
 import "../base/MxCard/MxCard.mjs";
-import { MxLink as h } from "../base/MxLink/MxLink.mjs";
+import { MxLink as T } from "../base/MxLink/MxLink.mjs";
 import "../base/MxSearch/MxSearch.mjs";
 import "@fortawesome/free-solid-svg-icons/faClose";
 import "@headlessui/react";
@@ -19,116 +20,116 @@ import "react-dom";
 import "react-popper";
 import "../base/MxTooltip/components/TooltipContainer/TooltipContainer.mjs";
 import "../../constants/index.mjs";
-import { CopyButton as k } from "../CopyButton/CopyButton.mjs";
-import { TrimAddress as A } from "../TrimAddress/TrimAddress.mjs";
-const W = ({
-  activeChain: i,
-  disabled: o
+import { CopyButton as j } from "../CopyButton/CopyButton.mjs";
+import { TrimAddress as D } from "../TrimAddress/TrimAddress.mjs";
+const v = ({
+  activeChain: l,
+  disabled: n
 }) => {
-  var d;
-  const m = b(), { disconnect: c } = g(), e = w(), n = (i == null ? void 0 : i.chainType) === N.sui, r = n ? e.suiAddress : m.address, q = async (a) => {
+  var q;
+  const m = w(), { disconnect: p } = N(), i = A(), d = k(l == null ? void 0 : l.chainType), c = (l == null ? void 0 : l.chainType) === o.sui, s = (l == null ? void 0 : l.chainType) === o.evm || (l == null ? void 0 : l.chainType) === o.sui ? d : d ?? m.address, a = async (u) => {
     try {
-      a.preventDefault(), n ? await e.disconnect() : await c();
-    } catch (p) {
-      console.error("Failed to disconnect:", p);
+      u.preventDefault(), c ? await i.disconnect() : await p();
+    } catch (f) {
+      console.error("Failed to disconnect:", f);
     }
   };
-  return r ? /* @__PURE__ */ t(u, { children: [
-    /* @__PURE__ */ l(
+  return s ? /* @__PURE__ */ r(x, { children: [
+    /* @__PURE__ */ e(
       "img",
       {
-        src: i == null ? void 0 : i.pngUrl,
+        src: l == null ? void 0 : l.pngUrl,
         alt: "",
         className: "liq-w-6 liq-h-6 liq-rounded-lg"
       }
     ),
-    /* @__PURE__ */ l("span", { className: "liq-truncate liq-text-gray-400", children: s(i) }),
-    /* @__PURE__ */ l("span", { className: "liq-ml-[-5px]", children: ":" }),
-    /* @__PURE__ */ l("div", { className: "liq-flex liq-items-center liq-justify-between", children: /* @__PURE__ */ t("div", { className: "liq-flex liq-max-w-[10rem] liq-items-center liq-gap-1", children: [
-      /* @__PURE__ */ l(
-        h,
+    /* @__PURE__ */ e("span", { className: "liq-truncate liq-text-gray-400", children: t(l) }),
+    /* @__PURE__ */ e("span", { className: "liq-ml-[-5px]", children: ":" }),
+    /* @__PURE__ */ e("div", { className: "liq-flex liq-items-center liq-justify-between", children: /* @__PURE__ */ r("div", { className: "liq-flex liq-max-w-[10rem] liq-items-center liq-gap-1", children: [
+      /* @__PURE__ */ e(
+        T,
         {
-          to: `${(d = i == null ? void 0 : i.blockExplorerUrls) == null ? void 0 : d[0]}/address/${r}`,
+          to: `${(q = l == null ? void 0 : l.blockExplorerUrls) == null ? void 0 : q[0]}/address/${s}`,
           target: "_blank",
           showExternalIcon: !1,
           className: "!liq-relative",
-          children: /* @__PURE__ */ l("div", { className: "liq-flex liq-min-w-0 liq-flex-grow liq-overflow-hidden liq-leading-none liq-max-w-[10rem]", children: /* @__PURE__ */ l(
-            A,
+          children: /* @__PURE__ */ e("div", { className: "liq-flex liq-min-w-0 liq-flex-grow liq-overflow-hidden liq-leading-none liq-max-w-[10rem]", children: /* @__PURE__ */ e(
+            D,
             {
-              address: r,
+              address: s,
               "data-testid": "evm-address"
             }
           ) })
         }
       ),
-      /* @__PURE__ */ l(
-        k,
+      /* @__PURE__ */ e(
+        j,
         {
-          text: r,
+          text: s,
           className: "liq-text-sm",
           "data-testid": "evm-copy-button"
         }
       )
     ] }) }),
-    /* @__PURE__ */ l("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */ l(
+    /* @__PURE__ */ e("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */ e(
       "button",
       {
         className: "focus-primary liq-flex liq-items-center liq-gap-1 liq-rounded-xl liq-px-0 liq-py-2 liq-text-sm liq-font-semibold liq-text-neutral-400 liq-transition-colors liq-duration-200 hover:enabled:liq-text-white disabled:liq-opacity-50",
-        onClick: q,
+        onClick: a,
         "data-testid": "evm-disconnect-button",
-        children: /* @__PURE__ */ l(x, { icon: f })
+        children: /* @__PURE__ */ e(y, { icon: g })
       }
     ) })
-  ] }) : n ? /* @__PURE__ */ t("div", { className: "liq-flex liq-max-w-full liq-items-center liq-gap-2", children: [
-    /* @__PURE__ */ l(
+  ] }) : c ? /* @__PURE__ */ r("div", { className: "liq-flex liq-max-w-full liq-items-center liq-gap-2", children: [
+    /* @__PURE__ */ e(
       "button",
       {
-        disabled: o || e.isConnecting,
-        onClick: () => e.connect(),
+        disabled: n || i.isConnecting,
+        onClick: () => i.connect(),
         className: "liq-rounded-lg liq-font-semibold liq-transition-colors liq-duration-200 disabled:liq-opacity-50 liq-bg-neutral-750 !liq-text-primary-200 hover:enabled:liq-bg-primary liq-px-2",
-        children: /* @__PURE__ */ l("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ t("div", { className: "liq-flex liq-justify-center liq-items-center liq-gap-2", children: [
-          /* @__PURE__ */ l("div", { children: e.isConnecting ? "Connecting..." : "Connect" }),
-          /* @__PURE__ */ l(
+        children: /* @__PURE__ */ e("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ r("div", { className: "liq-flex liq-justify-center liq-items-center liq-gap-2", children: [
+          /* @__PURE__ */ e("div", { children: i.isConnecting ? "Connecting..." : "Connect" }),
+          /* @__PURE__ */ e(
             "img",
             {
-              src: i == null ? void 0 : i.pngUrl,
+              src: l == null ? void 0 : l.pngUrl,
               alt: "",
               className: "liq-w-4 liq-h-4 liq-rounded-sm"
             }
           ),
-          /* @__PURE__ */ l("div", { className: "liq-truncate md:liq-text-clip", children: s(i) })
+          /* @__PURE__ */ e("div", { className: "liq-truncate md:liq-text-clip", children: t(l) })
         ] }) })
       }
     ),
-    e.isConnecting && /* @__PURE__ */ l(
+    i.isConnecting && /* @__PURE__ */ e(
       "button",
       {
         type: "button",
-        onClick: () => void e.cancelPendingConnection(),
+        onClick: () => void i.cancelPendingConnection(),
         className: "liq-shrink-0 liq-rounded-lg liq-px-2 liq-py-1 liq-text-xs liq-font-medium liq-text-neutral-400 hover:liq-text-white",
         children: "Cancel"
       }
     )
-  ] }) : /* @__PURE__ */ l(
-    y,
+  ] }) : /* @__PURE__ */ e(
+    b,
     {
-      disabled: o,
+      disabled: n,
       className: "liq-rounded-lg liq-font-semibold liq-transition-colors liq-duration-200 disabled:liq-opacity-50 liq-bg-neutral-750 !liq-text-primary-200 hover:enabled:liq-bg-primary liq-px-2",
-      children: /* @__PURE__ */ l("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ t("div", { className: "liq-flex liq-justify-center liq-items-center liq-gap-2", children: [
-        /* @__PURE__ */ l("div", { children: m.isConnecting ? "Connecting..." : "Connect" }),
-        /* @__PURE__ */ l(
+      children: /* @__PURE__ */ e("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ r("div", { className: "liq-flex liq-justify-center liq-items-center liq-gap-2", children: [
+        /* @__PURE__ */ e("div", { children: m.isConnecting ? "Connecting..." : "Connect" }),
+        /* @__PURE__ */ e(
           "img",
           {
-            src: i == null ? void 0 : i.pngUrl,
+            src: l == null ? void 0 : l.pngUrl,
             alt: "",
             className: "liq-w-4 liq-h-4 liq-rounded-sm"
           }
         ),
-        /* @__PURE__ */ l("div", { className: "liq-truncate md:liq-text-clip", children: s(i) })
+        /* @__PURE__ */ e("div", { className: "liq-truncate md:liq-text-clip", children: t(l) })
       ] }) })
     }
   );
 };
 export {
-  W as BridgeAccountDisplay
+  v as BridgeAccountDisplay
 };

package/reactjs/hooks/useDisconnectOnChainTypeChange.d.ts

@@ -0,0 +1,12 @@
+import { ChainType } from '../../types/chainType';
+
+/**
+ * Disconnects the previous chain namespace when the active chain type changes.
+ *
+ * This covers all paths that can change the chain type (token selection, direction
+ * toggle, etc.) and prevents stale SUI sessions from lingering after switching to
+ * EVM (and vice-versa) in mobile dapp browsers.
+ *
+ * Only reacts to genuine transitions — skips the initial undefined→value mount.
+ */
+export declare function useDisconnectOnChainTypeChange(chainType: ChainType | undefined): void;

package/reactjs/hooks/useDisconnectOnChainTypeChange.js

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@reown/appkit/react"),s=require("react"),c=require("../../types/chainType.js");function r(n){const{disconnect:i}=o.useDisconnect(),t=s.useRef(void 0);s.useEffect(()=>{const e=t.current;t.current=n,!(e===void 0||e===n)&&(e===c.ChainType.sui?i({namespace:"sui"}):e===c.ChainType.evm&&i())},[n])}exports.useDisconnectOnChainTypeChange=r;

package/reactjs/hooks/useDisconnectOnChainTypeChange.mjs

@@ -0,0 +1,13 @@
+import { useDisconnect as t } from "@reown/appkit/react";
+import { useRef as s, useEffect as c } from "react";
+import { ChainType as r } from "../../types/chainType.mjs";
+function p(n) {
+  const { disconnect: o } = t(), i = s(void 0);
+  c(() => {
+    const e = i.current;
+    i.current = n, !(e === void 0 || e === n) && (e === r.sui ? o({ namespace: "sui" }) : e === r.evm && o());
+  }, [n]);
+}
+export {
+  p as useDisconnectOnChainTypeChange
+};