"use client";
import { j as e } from "../../../node_modules/.pnpm/react@19.1.0/node_modules/react/jsx-runtime.mjs";
import { useState as k, useEffect as _ } from "react";
import { getChainMetadata as q } from "../../../node_modules/.pnpm/@hyperplay_chains@0.5.0_typescript@5.8.3_zod@3.25.76/node_modules/@hyperplay/chains/dist/index.es.mjs";
import { Menu as p } from "@mantine/core";
import { ReactComponent as U } from "../../assets/images/Blockchain.svg.mjs";
import { ReactComponent as E } from "../../assets/images/DownArrow.svg.mjs";
import { ReactComponent as y } from "../../assets/images/InfoIcon.svg.mjs";
import { ReactComponent as I } from "../../assets/images/Token.svg.mjs";
import T from "../Button/index.mjs";
import n from "./TokenTable.module.scss.mjs";
function O(c) {
  if (c === "fungible" || c === "semiFungible")
    return "Token";
  if (c === "nonFungible")
    return "NFT";
  if (c === "other")
    return "Other";
}
function A(c) {
  const f = [], d = {};
  c.forEach((i) => {
    Object.hasOwn(d, i.chain_id) || (d[i.chain_id] = []), d[i.chain_id].push({
      address: i.address,
      icon: i.icon,
      type: i.type,
      name: i.name,
      marketplaceUrls: i.marketplace_urls
    });
  });
  for (const i in d)
    f.push({
      chainId: i,
      tokens: d[i]
    });
  return f;
}
function K({
  contracts: c,
  getTokenEnabled: f = !1,
  onTokenClick: d,
  onGetTokenClick: i,
  className: N,
  ...R
}) {
  const [v, b] = k(/* @__PURE__ */ e.jsx(e.Fragment, {})), [m, C] = k(
    {}
  ), $ = A(c);
  _(() => {
    w().then((s) => b(/* @__PURE__ */ e.jsx(e.Fragment, { children: s })));
  }, [m]);
  function j(s) {
    let r = !1;
    (!Object.hasOwn(m, s) || !m[s]) && (r = !0);
    const a = {};
    a[s] = r, C((t) => ({ ...t, ...a }));
  }
  function g(s) {
    return s.type ? O(s == null ? void 0 : s.type) : "Unknown";
  }
  function S(s) {
    let r = "Unknown";
    return s.address && (r = s.address.substring(0, 10) + (s.address.length > 10 ? "..." : "")), s.name ? s == null ? void 0 : s.name : r;
  }
  function D(s, r) {
    var t;
    const a = [];
    for (const l of s) {
      const x = l.address;
      a.push(
        /* @__PURE__ */ e.jsxs("tr", { children: [
          /* @__PURE__ */ e.jsx("td", { children: /* @__PURE__ */ e.jsx(I, { fill: "var(--color-neutral-100)" }) }),
          /* @__PURE__ */ e.jsx("td", { children: /* @__PURE__ */ e.jsx(
            T,
            {
              type: "link",
              size: "small",
              onClick: (o) => {
                o == null || o.stopPropagation(), d(x);
              },
              children: /* @__PURE__ */ e.jsx(
                "a",
                {
                  href: r.chain.explorers && r.chain.explorers.length > 0 ? `${r.chain.explorers[0].url}/address/${x}` : "",
                  target: "_blank",
                  rel: "noopener noreferrer",
                  children: S(l)
                }
              )
            }
          ) }),
          /* @__PURE__ */ e.jsx("td", { children: f && ((t = l.marketplaceUrls) != null && t.length) ? /* @__PURE__ */ e.jsxs("div", { children: [
            g(l),
            /* @__PURE__ */ e.jsx(
              "span",
              {
                style: {
                  margin: "0 0 0 auto"
                },
                children: /* @__PURE__ */ e.jsx(
                  T,
                  {
                    type: "secondary",
                    size: "small",
                    onClick: (o) => {
                      o == null || o.stopPropagation(), i(x);
                    },
                    children: /* @__PURE__ */ e.jsx("div", { className: "caption-sm", children: "Get token" })
                  }
                )
              }
            )
          ] }) : g(l) })
        ] }, l.address)
      );
    }
    return a;
  }
  async function w() {
    const s = [];
    for (const [r, a] of $.entries()) {
      let t;
      try {
        t = await q(a.chainId);
      } catch (F) {
        console.warn(F), t = {
          icon: [],
          chain: { name: "Unknown Chain", nativeCurrency: { symbol: "???" } }
        };
      }
      let l = "";
      t.icon && t.icon.length > 0 && (l = t.icon[0].url.split("//")[1]);
      const x = `https://ipfs.io/ipfs/${l}`, o = a.tokens.length > 0, u = { cursor: "default" }, h = o && m[r];
      o && (u.cursor = "pointer"), s.push(
        /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
          /* @__PURE__ */ e.jsxs(
            "tr",
            {
              className: `caption ${o ? n.chainRow : ""} ${h ? n.expanded : ""}`,
              style: u,
              onClick: () => j(r),
              children: [
                /* @__PURE__ */ e.jsx(
                  "td",
                  {
                    className: n.icon,
                    style: (() => {
                      if (h)
                        return {
                          borderBottomLeftRadius: "0px"
                        };
                    })(),
                    children: /* @__PURE__ */ e.jsx("div", { children: l === "" ? /* @__PURE__ */ e.jsx(U, { fill: "var(--color-neutral-100)" }) : /* @__PURE__ */ e.jsx("img", { src: x }) })
                  }
                ),
                /* @__PURE__ */ e.jsx("td", { children: /* @__PURE__ */ e.jsx("div", { children: t.chain.name }) }),
                o ? /* @__PURE__ */ e.jsx(
                  "td",
                  {
                    style: (() => {
                      if (h)
                        return {
                          borderBottomRightRadius: "0px"
                        };
                    })(),
                    children: /* @__PURE__ */ e.jsxs("div", { children: [
                      /* @__PURE__ */ e.jsxs("div", { children: [
                        h ? "Click to hide all tokens" : "Click to see all tokens",
                        /* @__PURE__ */ e.jsxs(p, { trigger: "hover", position: "top-start", children: [
                          /* @__PURE__ */ e.jsx(p.Target, { children: /* @__PURE__ */ e.jsxs("div", { className: `caption-sm ${n.infoText}`, children: [
                            /* @__PURE__ */ e.jsx(y, { fill: "var(--color-neutral-400)", width: 16 }),
                            /* @__PURE__ */ e.jsx("div", { className: "caption-sm", children: "Token gated access" })
                          ] }) }),
                          /* @__PURE__ */ e.jsxs(p.Dropdown, { className: n.infoDropdown, children: [
                            /* @__PURE__ */ e.jsx("div", { className: "caption", children: "Token gated access" }),
                            /* @__PURE__ */ e.jsx("div", { className: "caption-sm", children: "Some game content may require these tokens" })
                          ] })
                        ] })
                      ] }),
                      /* @__PURE__ */ e.jsx(
                        "div",
                        {
                          style: {
                            margin: "0 0 0 auto",
                            transform: `rotate(${m[r] ? 180 : 0}deg)`,
                            height: "7px",
                            width: "14px",
                            position: "relative"
                          },
                          children: /* @__PURE__ */ e.jsx(
                            E,
                            {
                              fill: "var(--color-neutral-100)",
                              stroke: "var(--color-neutral-100)",
                              width: "100%",
                              height: "100%",
                              style: {
                                position: "absolute",
                                top: "0px",
                                left: "0px"
                              }
                            }
                          )
                        }
                      )
                    ] })
                  }
                ) : /* @__PURE__ */ e.jsx("td", { children: /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsxs(
                  "div",
                  {
                    style: {
                      marginRight: "auto",
                      marginLeft: "0px",
                      position: "relative"
                    },
                    children: [
                      t.chain.nativeCurrency.symbol,
                      /* @__PURE__ */ e.jsxs(p, { trigger: "hover", position: "top-start", children: [
                        /* @__PURE__ */ e.jsx(p.Target, { children: /* @__PURE__ */ e.jsxs("div", { className: `caption-sm ${n.infoText}`, children: [
                          /* @__PURE__ */ e.jsx(y, { fill: "var(--color-neutral-400)" }),
                          "Network fee"
                        ] }) }),
                        /* @__PURE__ */ e.jsxs(p.Dropdown, { className: n.infoDropdown, children: [
                          /* @__PURE__ */ e.jsx("div", { className: "caption", children: "Network token fee" }),
                          /* @__PURE__ */ e.jsx("div", { className: "caption-sm", children: "This token is required to pay for transactions on this network." })
                        ] })
                      ] })
                    ]
                  }
                ) }) })
              ]
            },
            a.chainId
          ),
          h ? /* @__PURE__ */ e.jsx(
            "tr",
            {
              style: u,
              className: `${n.tokenRow}`,
              onClick: () => j(r),
              children: /* @__PURE__ */ e.jsx(
                "td",
                {
                  colSpan: 3,
                  style: (() => {
                    if (h)
                      return {
                        borderTopLeftRadius: "0px",
                        borderTopRightRadius: "0px"
                      };
                  })(),
                  children: /* @__PURE__ */ e.jsxs("table", { className: n.tokenTable, children: [
                    /* @__PURE__ */ e.jsxs("tr", { className: `${n.headerRow} eyebrow`, children: [
                      /* @__PURE__ */ e.jsx("th", { colSpan: 2, style: { maxWidth: "50%" }, children: "Token" }),
                      /* @__PURE__ */ e.jsx("th", { children: "Type" })
                    ] }),
                    /* @__PURE__ */ e.jsx(e.Fragment, { children: D(a.tokens, t) })
                  ] })
                }
              )
            },
            `${a.chainId}_dropdown`
          ) : null,
          /* @__PURE__ */ e.jsx("tr", { className: n.separator })
        ] })
      );
    }
    return s;
  }
  return w(), /* @__PURE__ */ e.jsx("table", { className: `${n.chainTable} ${N}`, ...R, children: /* @__PURE__ */ e.jsxs("tbody", { className: n.chainTable, children: [
    /* @__PURE__ */ e.jsxs("tr", { className: `${n.headerRow} eyebrow`, children: [
      /* @__PURE__ */ e.jsx("th", { colSpan: 2, style: { maxWidth: "50%" }, children: "Chain" }),
      /* @__PURE__ */ e.jsx("th", { children: "Token used" })
    ] }),
    /* @__PURE__ */ e.jsx("tr", { className: n.separator }),
    v
  ] }) });
}
export {
  K as default
};
//# sourceMappingURL=index.mjs.map
