@multiversx/sdk-dapp-liquidity 2.0.0 → 2.1.0-alpha.1

package/reactjs/components/TokenSelector/components/ChainSelect/components/ChainOptionLabel.mjs

@@ -1,51 +1,52 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx as l, jsxs as r } from "react/jsx-runtime";
 import "@multiversx/sdk-dapp-utils/out/helpers/formatAmount";
 import "@multiversx/sdk-dapp-utils/out/helpers/stringIsInteger";
 import "bignumber.js";
 import "../../../../../constants/index.mjs";
 import "@multiversx/sdk-dapp-utils/out/helpers/parseAmount";
-import { mxClsx } from "../../../../../utils/mxClsx.mjs";
-import { A as AllNetworks } from "../../../../../../all-networks-EJIVYZ_i.mjs";
-import { chainIdentifier, ALL_NETWORK_ID } from "../../../../../constants/chains.mjs";
-const ChainOptionLabel = ({
-  chain,
-  inDropdown = false
-}) => {
-  const inDropdownClass = inDropdown ? "in-dropdown" : "hidden md:flex";
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: `chain-element liq-flex liq-items-center liq-justify-between`,
-      children: /* @__PURE__ */ jsxs("div", { className: "liq-flex liq-flex-row liq-items-center", children: [
-        /* @__PURE__ */ jsx("div", { className: `chain-image liq-mr-2 ${inDropdownClass}`, children: /* @__PURE__ */ jsx("div", { className: "liq-h-6 liq-w-6 liq-flex-shrink-0 liq-overflow-hidden", children: chain.pngUrl ? /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: chain.pngUrl ?? chainIdentifier[chain.name],
-            alt: "",
-            loading: "lazy",
-            className: mxClsx("liq-h-full liq-w-full", {
-              "liq-rounded-lg": chain.id !== ALL_NETWORK_ID
-            })
-          }
-        ) : /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: AllNetworks,
-            alt: "",
-            className: "liq-h-full liq-w-full"
-          }
-        ) }) }),
-        /* @__PURE__ */ jsx("div", { className: "liq-flex liq-flex-col", children: /* @__PURE__ */ jsx("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "chain-name liq-flex liq-items-center liq-gap-2 liq-whitespace-nowrap",
-            children: chain.networkName
-          }
-        ) }) })
-      ] })
-    }
-  );
-};
+import { mxClsx as s } from "../../../../../utils/mxClsx.mjs";
+import { safeImageUrl as m } from "../../../../../../helpers/safeImageUrl.mjs";
+import { A as a } from "../../../../../../all-networks-Czd8zS1n.mjs";
+import { ALL_NETWORK_ID as n, chainIdentifier as o } from "../../../../../constants/chains.mjs";
+const v = ({
+  chain: i,
+  inDropdown: e = !1
+}) => /* @__PURE__ */ l(
+  "div",
+  {
+    className: "chain-element liq-flex liq-items-center liq-justify-between",
+    children: /* @__PURE__ */ r("div", { className: "liq-flex liq-flex-row liq-items-center", children: [
+      /* @__PURE__ */ l("div", { className: `chain-image liq-mr-2 ${e ? "in-dropdown" : "hidden md:flex"}`, children: /* @__PURE__ */ l("div", { className: "liq-h-6 liq-w-6 liq-flex-shrink-0 liq-overflow-hidden", children: i.pngUrl ? /* @__PURE__ */ l(
+        "img",
+        {
+          src: m(
+            i.pngUrl,
+            o[i.name]
+          ),
+          alt: "",
+          loading: "lazy",
+          className: s("liq-h-full liq-w-full", {
+            "liq-rounded-lg": i.id !== n
+          })
+        }
+      ) : /* @__PURE__ */ l(
+        "img",
+        {
+          src: a,
+          alt: "",
+          className: "liq-h-full liq-w-full"
+        }
+      ) }) }),
+      /* @__PURE__ */ l("div", { className: "liq-flex liq-flex-col", children: /* @__PURE__ */ l("div", { className: "liq-flex liq-items-center", children: /* @__PURE__ */ l(
+        "div",
+        {
+          className: "chain-name liq-flex liq-items-center liq-gap-2 liq-whitespace-nowrap",
+          children: i.networkName
+        }
+      ) }) })
+    ] })
+  }
+);
 export {
-  ChainOptionLabel
+  v as ChainOptionLabel
 };

package/reactjs/components/TokenSelector/components/ChainSelect/components/FormatChainOptionLabel.js

@@ -1,19 +1,2 @@
 #!/usr/bin/env node
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const reactjs_components_TokenSelector_components_ChainSelect_components_ChainOptionLabel = require("./ChainOptionLabel.js");
-const reactjs_components_SmallLoader_SmallLoader = require("../../../../SmallLoader/SmallLoader.js");
-const FormatChainOptionLabel = (option, { context }) => {
-  const { chain } = option;
-  const inDropdown = context === "menu";
-  const args = {
-    chain,
-    inDropdown
-  };
-  if (option.value === "loader") {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-flex liq-justify-center liq-py-5", children: /* @__PURE__ */ jsxRuntime.jsx(reactjs_components_SmallLoader_SmallLoader.SmallLoader, { show: true }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(reactjs_components_TokenSelector_components_ChainSelect_components_ChainOptionLabel.ChainOptionLabel, { ...args });
-};
-exports.FormatChainOptionLabel = FormatChainOptionLabel;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("./ChainOptionLabel.js"),i=require("../../../../SmallLoader/SmallLoader.js"),s=(n,{context:o})=>{const{chain:t}=n,r={chain:t,inDropdown:o==="menu"};return n.value==="loader"?e.jsx("div",{className:"liq-flex liq-justify-center liq-py-5",children:e.jsx(i.SmallLoader,{show:!0})}):e.jsx(a.ChainOptionLabel,{...r})};exports.FormatChainOptionLabel=s;

package/reactjs/components/TokenSelector/components/ChainSelect/components/FormatChainOptionLabel.mjs

@@ -1,18 +1,13 @@
-import { jsx } from "react/jsx-runtime";
-import { ChainOptionLabel } from "./ChainOptionLabel.mjs";
-import { SmallLoader } from "../../../../SmallLoader/SmallLoader.mjs";
-const FormatChainOptionLabel = (option, { context }) => {
-  const { chain } = option;
-  const inDropdown = context === "menu";
-  const args = {
-    chain,
-    inDropdown
+import { jsx as r } from "react/jsx-runtime";
+import { ChainOptionLabel as t } from "./ChainOptionLabel.mjs";
+import { SmallLoader as a } from "../../../../SmallLoader/SmallLoader.mjs";
+const p = (o, { context: n }) => {
+  const { chain: i } = o, e = {
+    chain: i,
+    inDropdown: n === "menu"
   };
-  if (option.value === "loader") {
-    return /* @__PURE__ */ jsx("div", { className: "liq-flex liq-justify-center liq-py-5", children: /* @__PURE__ */ jsx(SmallLoader, { show: true }) });
-  }
-  return /* @__PURE__ */ jsx(ChainOptionLabel, { ...args });
+  return o.value === "loader" ? /* @__PURE__ */ r("div", { className: "liq-flex liq-justify-center liq-py-5", children: /* @__PURE__ */ r(a, { show: !0 }) }) : /* @__PURE__ */ r(t, { ...e });
 };
 export {
-  FormatChainOptionLabel
+  p as FormatChainOptionLabel
 };

package/reactjs/components/TokenSelector/components/ChainSelect/components/IndicatorSeparator.js

@@ -1,7 +1,2 @@
 #!/usr/bin/env node
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const IndicatorSeparator = () => {
-  return { display: "none" };
-};
-exports.IndicatorSeparator = IndicatorSeparator;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=()=>({display:"none"});exports.IndicatorSeparator=e;

package/reactjs/components/TokenSelector/components/ChainSelect/components/IndicatorSeparator.mjs

@@ -1,6 +1,4 @@
-const IndicatorSeparator = () => {
-  return { display: "none" };
-};
+const r = () => ({ display: "none" });
 export {
-  IndicatorSeparator
+  r as IndicatorSeparator
 };

package/reactjs/components/TokenSelector/components/ChainSelect/components/SelectedChainOption.js

@@ -1,40 +1,2 @@
 #!/usr/bin/env node
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const Select = require("react-select");
-require("@multiversx/sdk-dapp-utils/out/helpers/formatAmount");
-require("@multiversx/sdk-dapp-utils/out/helpers/stringIsInteger");
-require("bignumber.js");
-require("../../../../../constants/index.js");
-require("@multiversx/sdk-dapp-utils/out/helpers/parseAmount");
-const reactjs_utils_mxClsx = require("../../../../../utils/mxClsx.js");
-const allNetworks = require("../../../../../../all-networks-NYACMyeN.js");
-const reactjs_constants_chains = require("../../../../../constants/chains.js");
-const SelectedChainOption = ({
-  ...props
-}) => {
-  const {
-    selectProps: { onMenuOpen },
-    data: { chain }
-  } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx(Select.components.SingleValue, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: "liq-h-6 liq-w-6 liq-flex liq-justify-between liq-items-center liq-cursor-pointer",
-      onClick: onMenuOpen,
-      children: (chain == null ? void 0 : chain.pngUrl) ? /* @__PURE__ */ jsxRuntime.jsx(
-        "img",
-        {
-          src: chain.pngUrl ?? reactjs_constants_chains.chainIdentifier[chain.name],
-          alt: "",
-          loading: "lazy",
-          className: reactjs_utils_mxClsx.mxClsx("liq-h-full liq-w-full", {
-            "liq-rounded-lg": (chain == null ? void 0 : chain.id) !== reactjs_constants_chains.ALL_NETWORK_ID
-          })
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("img", { src: allNetworks.AllNetworks, alt: "", className: "liq-h-full liq-w-full" })
-    }
-  ) });
-};
-exports.SelectedChainOption = SelectedChainOption;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),t=require("react-select");require("@multiversx/sdk-dapp-utils/out/helpers/formatAmount");require("@multiversx/sdk-dapp-utils/out/helpers/stringIsInteger");require("bignumber.js");require("../../../../../constants/index.js");require("@multiversx/sdk-dapp-utils/out/helpers/parseAmount");const n=require("../../../../../utils/mxClsx.js"),c=require("../../../../../../helpers/safeImageUrl.js"),u=require("../../../../../../all-networks--dfVLHLJ.js"),i=require("../../../../../constants/chains.js"),o=({...r})=>{const{selectProps:{onMenuOpen:s},data:{chain:e}}=r;return l.jsx(t.components.SingleValue,{...r,children:l.jsx("div",{className:"liq-h-6 liq-w-6 liq-flex liq-justify-between liq-items-center liq-cursor-pointer",onClick:s,children:e!=null&&e.pngUrl?l.jsx("img",{src:c.safeImageUrl(e.pngUrl,i.chainIdentifier[e.name]),alt:"",loading:"lazy",className:n.mxClsx("liq-h-full liq-w-full",{"liq-rounded-lg":(e==null?void 0:e.id)!==i.ALL_NETWORK_ID})}):l.jsx("img",{src:u.AllNetworks,alt:"",className:"liq-h-full liq-w-full"})})})};exports.SelectedChainOption=o;

package/reactjs/components/TokenSelector/components/ChainSelect/components/SelectedChainOption.mjs

@@ -1,39 +1,43 @@
-import { jsx } from "react/jsx-runtime";
-import { components } from "react-select";
+import { jsx as i } from "react/jsx-runtime";
+import { components as o } from "react-select";
 import "@multiversx/sdk-dapp-utils/out/helpers/formatAmount";
 import "@multiversx/sdk-dapp-utils/out/helpers/stringIsInteger";
 import "bignumber.js";
 import "../../../../../constants/index.mjs";
 import "@multiversx/sdk-dapp-utils/out/helpers/parseAmount";
-import { mxClsx } from "../../../../../utils/mxClsx.mjs";
-import { A as AllNetworks } from "../../../../../../all-networks-EJIVYZ_i.mjs";
-import { chainIdentifier, ALL_NETWORK_ID } from "../../../../../constants/chains.mjs";
-const SelectedChainOption = ({
-  ...props
+import { mxClsx as t } from "../../../../../utils/mxClsx.mjs";
+import { safeImageUrl as m } from "../../../../../../helpers/safeImageUrl.mjs";
+import { A as n } from "../../../../../../all-networks-Czd8zS1n.mjs";
+import { ALL_NETWORK_ID as s, chainIdentifier as p } from "../../../../../constants/chains.mjs";
+const A = ({
+  ...r
 }) => {
   const {
-    selectProps: { onMenuOpen },
-    data: { chain }
-  } = props;
-  return /* @__PURE__ */ jsx(components.SingleValue, { ...props, children: /* @__PURE__ */ jsx(
+    selectProps: { onMenuOpen: e },
+    data: { chain: l }
+  } = r;
+  return /* @__PURE__ */ i(o.SingleValue, { ...r, children: /* @__PURE__ */ i(
     "div",
     {
       className: "liq-h-6 liq-w-6 liq-flex liq-justify-between liq-items-center liq-cursor-pointer",
-      onClick: onMenuOpen,
-      children: (chain == null ? void 0 : chain.pngUrl) ? /* @__PURE__ */ jsx(
+      onClick: e,
+      children: l != null && l.pngUrl ? /* @__PURE__ */ i(
         "img",
         {
-          src: chain.pngUrl ?? chainIdentifier[chain.name],
+          src: m(
+            l.pngUrl,
+            p[l.name]
+          ),
           alt: "",
           loading: "lazy",
-          className: mxClsx("liq-h-full liq-w-full", {
-            "liq-rounded-lg": (chain == null ? void 0 : chain.id) !== ALL_NETWORK_ID
+          className: t("liq-h-full liq-w-full", {
+            "liq-rounded-lg": (l == null ? void 0 : l.id) !== s
           })
         }
-      ) : /* @__PURE__ */ jsx("img", { src: AllNetworks, alt: "", className: "liq-h-full liq-w-full" })
+      ) : /* @__PURE__ */ i("img", { src: n, alt: "", className: "liq-h-full liq-w-full" })
     }
   ) });
 };
 export {
-  SelectedChainOption
+  A as SelectedChainOption
 };

package/reactjs/components/TokenSelector/components/SelectContainer.js

@@ -1,41 +1,2 @@
 #!/usr/bin/env node
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const faClose = require("@fortawesome/free-solid-svg-icons/faClose");
-const reactFontawesome = require("@fortawesome/react-fontawesome");
-const reactjs_utils_mxClsx = require("../../../utils/mxClsx.js");
-const reactjs_components_base_MxButton_MxButton = require("../../base/MxButton/MxButton.js");
-const reactjs_components_base_MxCard_MxCard = require("../../base/MxCard/MxCard.js");
-const SelectContainer = ({
-  children,
-  className,
-  onClose
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    reactjs_components_base_MxCard_MxCard.MxCard,
-    {
-      className: reactjs_utils_mxClsx.mxClsx(
-        "liq-flex liq-flex-col liq-absolute liq-left-0 liq-top-0 liq-order-1 liq-mx-auto liq-w-full liq-gap-1 liq-pt-12 lg:liq-order-2 lg:liq-max-w-[27.5rem] !liq-min-h-[26rem] !lg:liq-pt-0 !liq-bg-neutral-850 !liq-z-[15] !liq-p-2 !liq-pointer-events-auto",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liq-flex liq-items-center liq-justify-between", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-flex liq-flex-1 liq-items-center liq-justify-center liq-text-center liq-text-lg", children: "Select a token" }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            reactjs_components_base_MxButton_MxButton.MxButton,
-            {
-              btnSize: "md",
-              className: "liq-border-none !liq-px-2",
-              variant: "link-neutral-500",
-              onClick: onClose,
-              children: /* @__PURE__ */ jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, { icon: faClose.faClose, size: "xl" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "!liq-flex !liq-flex-1 !liq-flex-col !liq-gap-1", children })
-      ]
-    }
-  );
-};
-exports.SelectContainer = SelectContainer;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("@fortawesome/free-solid-svg-icons/faClose"),s=require("@fortawesome/react-fontawesome"),r=require("../../../utils/mxClsx.js"),o=require("../../base/MxButton/MxButton.js"),q=require("../../base/MxCard/MxCard.js"),a=({children:l,className:i,onClose:t})=>e.jsxs(q.MxCard,{className:r.mxClsx("liq-flex liq-flex-col liq-absolute liq-left-0 liq-top-0 liq-order-1 liq-mx-auto liq-w-full liq-gap-1 liq-pt-12 lg:liq-order-2 lg:liq-max-w-[27.5rem] !liq-min-h-[26rem] !lg:liq-pt-0 !liq-bg-neutral-850 !liq-z-[15] !liq-p-2 !liq-pointer-events-auto",i),children:[e.jsxs("div",{className:"liq-flex liq-items-center liq-justify-between",children:[e.jsx("div",{className:"liq-flex liq-flex-1 liq-items-center liq-justify-center liq-text-center liq-text-lg",children:"Select a token"}),e.jsx(o.MxButton,{btnSize:"md",className:"liq-border-none !liq-px-2",variant:"link-neutral-500",onClick:t,children:e.jsx(s.FontAwesomeIcon,{icon:n.faClose,size:"xl"})})]}),e.jsx("div",{className:"!liq-flex !liq-flex-1 !liq-flex-col !liq-gap-1",children:l})]});exports.SelectContainer=a;

package/reactjs/components/TokenSelector/components/SelectContainer.mjs

@@ -1,40 +1,38 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { faClose } from "@fortawesome/free-solid-svg-icons/faClose";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { mxClsx } from "../../../utils/mxClsx.mjs";
-import { MxButton } from "../../base/MxButton/MxButton.mjs";
-import { MxCard } from "../../base/MxCard/MxCard.mjs";
-const SelectContainer = ({
-  children,
-  className,
-  onClose
-}) => {
-  return /* @__PURE__ */ jsxs(
-    MxCard,
-    {
-      className: mxClsx(
-        "liq-flex liq-flex-col liq-absolute liq-left-0 liq-top-0 liq-order-1 liq-mx-auto liq-w-full liq-gap-1 liq-pt-12 lg:liq-order-2 lg:liq-max-w-[27.5rem] !liq-min-h-[26rem] !lg:liq-pt-0 !liq-bg-neutral-850 !liq-z-[15] !liq-p-2 !liq-pointer-events-auto",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "liq-flex liq-items-center liq-justify-between", children: [
-          /* @__PURE__ */ jsx("div", { className: "liq-flex liq-flex-1 liq-items-center liq-justify-center liq-text-center liq-text-lg", children: "Select a token" }),
-          /* @__PURE__ */ jsx(
-            MxButton,
-            {
-              btnSize: "md",
-              className: "liq-border-none !liq-px-2",
-              variant: "link-neutral-500",
-              onClick: onClose,
-              children: /* @__PURE__ */ jsx(FontAwesomeIcon, { icon: faClose, size: "xl" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "!liq-flex !liq-flex-1 !liq-flex-col !liq-gap-1", children })
-      ]
-    }
-  );
-};
+import { jsxs as i, jsx as l } from "react/jsx-runtime";
+import { faClose as o } from "@fortawesome/free-solid-svg-icons/faClose";
+import { FontAwesomeIcon as q } from "@fortawesome/react-fontawesome";
+import { mxClsx as n } from "../../../utils/mxClsx.mjs";
+import { MxButton as m } from "../../base/MxButton/MxButton.mjs";
+import { MxCard as a } from "../../base/MxCard/MxCard.mjs";
+const u = ({
+  children: e,
+  className: t,
+  onClose: r
+}) => /* @__PURE__ */ i(
+  a,
+  {
+    className: n(
+      "liq-flex liq-flex-col liq-absolute liq-left-0 liq-top-0 liq-order-1 liq-mx-auto liq-w-full liq-gap-1 liq-pt-12 lg:liq-order-2 lg:liq-max-w-[27.5rem] !liq-min-h-[26rem] !lg:liq-pt-0 !liq-bg-neutral-850 !liq-z-[15] !liq-p-2 !liq-pointer-events-auto",
+      t
+    ),
+    children: [
+      /* @__PURE__ */ i("div", { className: "liq-flex liq-items-center liq-justify-between", children: [
+        /* @__PURE__ */ l("div", { className: "liq-flex liq-flex-1 liq-items-center liq-justify-center liq-text-center liq-text-lg", children: "Select a token" }),
+        /* @__PURE__ */ l(
+          m,
+          {
+            btnSize: "md",
+            className: "liq-border-none !liq-px-2",
+            variant: "link-neutral-500",
+            onClick: r,
+            children: /* @__PURE__ */ l(q, { icon: o, size: "xl" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l("div", { className: "!liq-flex !liq-flex-1 !liq-flex-col !liq-gap-1", children: e })
+    ]
+  }
+);
 export {
-  SelectContainer
+  u as SelectContainer
 };

package/reactjs/components/TokenSelector/components/SelectContent.js

@@ -1,137 +1,2 @@
 #!/usr/bin/env node
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const reactjs_components_TokenSelector_components_ChainSelect_ChainSelect = require("./ChainSelect/ChainSelect.js");
-const reactjs_components_TokenSelector_components_TokenList = require("./TokenList.js");
-const constants_index = require("../../../../constants/index.js");
-const helpers_getDisplayName = require("../../../../helpers/getDisplayName.js");
-require("../../../constants/index.js");
-const reactjs_components_base_MxSearch_MxSearch = require("../../base/MxSearch/MxSearch.js");
-const reactjs_constants_chains = require("../../../constants/chains.js");
-const SelectContent = ({
-  onSelect,
-  tokens = [],
-  chains = [],
-  isMvxSelector = false,
-  areChainsLoading,
-  selectedToken
-}) => {
-  const [filteredTokens, setFilteredTokens] = React.useState(tokens);
-  const [selected, setSelected] = React.useState(selectedToken);
-  const searchPatternRef = React.useRef("");
-  const availableChains = React.useMemo(() => {
-    if (isMvxSelector) {
-      return chains.filter(
-        (chain) => constants_index.MVX_CHAIN_IDS.includes(chain.chainId.toString())
-      );
-    }
-    return chains.filter(
-      (chain) => !constants_index.MVX_CHAIN_IDS.includes(chain.chainId.toString())
-    );
-  }, [chains, isMvxSelector]);
-  const defaultChainId = React.useMemo(() => {
-    var _a;
-    if (isMvxSelector) {
-      const mvxChainWithTokens = availableChains.find(
-        (chain) => tokens.some(
-          (token) => token.chainId.toString() === chain.chainId.toString()
-        )
-      );
-      return (mvxChainWithTokens == null ? void 0 : mvxChainWithTokens.chainId.toString()) ?? ((_a = availableChains[0]) == null ? void 0 : _a.chainId.toString()) ?? reactjs_constants_chains.ALL_NETWORK_ID;
-    }
-    return reactjs_constants_chains.ALL_NETWORK_ID;
-  }, [availableChains, tokens, isMvxSelector]);
-  const [selectedChainId, setSelectedChainId] = React.useState(defaultChainId);
-  React.useEffect(() => {
-    const isCurrentSelectionValid = availableChains.some(
-      (chain) => chain.chainId.toString() === selectedChainId
-    );
-    if (!isCurrentSelectionValid) {
-      setSelectedChainId(defaultChainId);
-    }
-  }, [defaultChainId, availableChains, selectedChainId]);
-  const filteredTokensText = React.useMemo(() => {
-    const selectedChain = availableChains.find(
-      (chain) => chain.chainId.toString() === selectedChainId
-    );
-    if (!selectedChain) {
-      return `Tokens on all networks (${tokens.length})`;
-    }
-    return `Tokens on ${helpers_getDisplayName.getDisplayName(selectedChain)} (${filteredTokens.length})`;
-  }, [availableChains, filteredTokens.length, selectedChainId, tokens.length]);
-  const handleSelect = (token) => {
-    setSelected(token);
-    onSelect(token);
-  };
-  const handleSearch = (pattern) => {
-    searchPatternRef.current = pattern;
-    if (selectedChainId === reactjs_constants_chains.ALL_NETWORK_ID) {
-      if (pattern.trim() === "") {
-        setFilteredTokens(tokens);
-      } else {
-        const filtered = tokens.filter(
-          (token) => token.symbol.toLowerCase().includes(pattern.toLowerCase())
-        );
-        setFilteredTokens(filtered);
-      }
-      return;
-    }
-    if (pattern.trim() === "") {
-      const filtered = tokens.filter(
-        (token) => token.chainId.toString() === selectedChainId.toString()
-      );
-      setFilteredTokens(filtered);
-    } else {
-      const filtered = tokens.filter(
-        (token) => token.symbol.toLowerCase().includes(pattern.toLowerCase()) && token.chainId.toString() === selectedChainId.toString()
-      );
-      setFilteredTokens(filtered);
-    }
-  };
-  React.useEffect(() => {
-    setFilteredTokens(tokens);
-    setSelected(selectedToken);
-    searchPatternRef.current = "";
-  }, [selectedToken, tokens]);
-  React.useEffect(() => {
-    handleSearch(searchPatternRef.current);
-  }, [selectedChainId, tokens]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liq-relative liq-flex liq-max-w-full liq-flex-col liq-rounded-none liq-p-0 !liq-max-h-[22rem]", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-flex liq-flex-col liq-gap-3 liq-rounded-t-2xl liq-p-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liq-flex liq-gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        reactjs_components_base_MxSearch_MxSearch.MxSearch,
-        {
-          inputClassName: "!liq-bg-neutral-750 liq-border liq-border-neutral-750",
-          placeholder: "Search token",
-          onChange: handleSearch
-        }
-      ),
-      !isMvxSelector && /* @__PURE__ */ jsxRuntime.jsx(
-        reactjs_components_TokenSelector_components_ChainSelect_ChainSelect.ChainSelect,
-        {
-          chains: availableChains,
-          ignoreAllChains: isMvxSelector,
-          selectedChainId,
-          onChange: (chainId) => {
-            setSelectedChainId(chainId);
-          },
-          isLoading: areChainsLoading
-        }
-      )
-    ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "scrollbar-thin liq-flex liq-flex-col liq-gap-2 liq-overflow-y-scroll liq-border-t liq-border-neutral-750 liq-pb-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-flex liq-text-left liq-text-neutral-300 liq-mt-4 liq-ml-2", children: filteredTokensText }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        reactjs_components_TokenSelector_components_TokenList.TokenList,
-        {
-          tokens: filteredTokens,
-          onSelect: handleSelect,
-          selectedToken: selected
-        }
-      )
-    ] })
-  ] });
-};
-exports.SelectContent = SelectContent;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),i=require("react"),N=require("./ChainSelect/ChainSelect.js"),T=require("./TokenList.js"),x=require("../../../../constants/index.js"),w=require("../../../../helpers/getDisplayName.js");require("../../../constants/index.js");const y=require("../../base/MxSearch/MxSearch.js"),S=require("../../../constants/chains.js"),D=({onSelect:C,tokens:n=[],chains:d=[],isMvxSelector:o=!1,areChainsLoading:I,selectedToken:u})=>{const[f,a]=i.useState(n),[b,g]=i.useState(u),h=i.useRef(""),r=i.useMemo(()=>o?d.filter(e=>x.MVX_CHAIN_IDS.includes(e.chainId.toString())):d.filter(e=>!x.MVX_CHAIN_IDS.includes(e.chainId.toString())),[d,o]),q=i.useMemo(()=>{var e;if(o){const t=r.find(s=>n.some(L=>L.chainId.toString()===s.chainId.toString()));return(t==null?void 0:t.chainId.toString())??((e=r[0])==null?void 0:e.chainId.toString())??S.ALL_NETWORK_ID}return S.ALL_NETWORK_ID},[r,n,o]),[l,m]=i.useState(q);i.useEffect(()=>{r.some(t=>t.chainId.toString()===l)||m(q)},[q,r,l]);const j=i.useMemo(()=>{const e=r.find(t=>t.chainId.toString()===l);return e?`Tokens on ${w.getDisplayName(e)} (${f.length})`:`Tokens on all networks (${n.length})`},[r,f.length,l,n.length]),p=e=>{g(e),C(e)},_=e=>{if(h.current=e,l===S.ALL_NETWORK_ID){if(e.trim()==="")a(n);else{const t=n.filter(s=>s.symbol.toLowerCase().includes(e.toLowerCase()));a(t)}return}if(e.trim()===""){const t=n.filter(s=>s.chainId.toString()===l.toString());a(t)}else{const t=n.filter(s=>s.symbol.toLowerCase().includes(e.toLowerCase())&&s.chainId.toString()===l.toString());a(t)}};return i.useEffect(()=>{a(n),g(u),h.current=""},[u,n]),i.useEffect(()=>{_(h.current)},[l,n]),c.jsxs("div",{className:"liq-relative liq-flex liq-max-w-full liq-flex-col liq-rounded-none liq-p-0 !liq-max-h-[22rem]",children:[c.jsx("div",{className:"liq-flex liq-flex-col liq-gap-3 liq-rounded-t-2xl liq-p-2",children:c.jsxs("div",{className:"liq-flex liq-gap-2",children:[c.jsx(y.MxSearch,{inputClassName:"!liq-bg-neutral-750 liq-border liq-border-neutral-750",placeholder:"Search token",onChange:_}),!o&&c.jsx(N.ChainSelect,{chains:r,ignoreAllChains:o,selectedChainId:l,onChange:e=>{m(e)},isLoading:I})]})}),c.jsxs("div",{className:"scrollbar-thin liq-flex liq-flex-col liq-gap-2 liq-overflow-y-scroll liq-border-t liq-border-neutral-750 liq-pb-3",children:[c.jsx("div",{className:"liq-flex liq-text-left liq-text-neutral-300 liq-mt-4 liq-ml-2",children:j}),c.jsx(T.TokenList,{tokens:f,onSelect:p,selectedToken:b})]})]})};exports.SelectContent=D;