import { jsx as e } from "react/jsx-runtime";
import { useRef as T, useState as $, useEffect as S } from "react";
import { Link as p } from "react-router-dom";
import { useMemoizedFn as A, useCreation as F } from "ahooks";
import { Box as w, useTheme as G } from "@mui/material";
import B from "./sub-item-group.js";
import { Item as K } from "./nav-menu.js";
import { styled as C } from "../Theme/index.js";
import { useNavMenuContext as E } from "./nav-menu-context.js";
import { translate as L } from "../Locale/util.js";
import { useLocaleContext as _ } from "../Locale/context.js";
import M from "./images/nft-studio.svg.js";
import O from "./images/creator-studio.svg.js";
import P from "./images/blocklet-launcher.svg.js";
import H from "./images/blocklet-store.svg.js";
import R from "./images/web3-kit.svg.js";
import z from "./images/blocklet-framework.svg.js";
import U from "./images/abt-network.svg.js";
import j from "./images/blocklet-server.svg.js";
import V from "./images/OCAP.svg.js";
import q from "./images/did.svg.js";
import J from "./images/did-wallet.svg.js";
import Q from "./images/vc.svg.js";
import X from "./images/payment-kit.png";
import Y from "./images/aigne.svg.js";
import I from "./images/arcsphere.svg.js";
import Z from "./images/aistro.png";
import { getUTMUrl as ee } from "../withTracker/libs/utm.js";
const v = 260, ie = {
  en: {
    groups: {
      applications: "Applications",
      components: "Components",
      computeStorage: "Compute/Storage",
      identity: "Identity",
      frameworkTools: "Framework & tools",
      modelsAdapters: "Models adapters"
    },
    products: {
      nftStudio: {
        description: "Mint and manage NFTs"
      },
      creatorStudio: {
        description: "All-in-one creator tool"
      },
      aigne: {
        description: "The Agentic Ecosystem for AI Apps"
      },
      arcsphere: {
        description: "AI native browser"
      },
      aistro: {
        description: "AI-powered astrology"
      },
      blockletLauncher: {
        description: "One-click app launcher"
      },
      aiKit: {
        description: "Boost apps with AI"
      },
      paymentKit: {
        description: "Effortless Crypto & Card Payments"
      },
      blockletStore: {
        description: "Discover & deploy apps"
      },
      web3Kit: {
        description: "Web3 dev toolkit"
      },
      blockletFramework: {
        description: "Build and run blocklets"
      },
      didSpaces: {
        description: "Secure personal storage"
      },
      abtNetwork: {
        description: "Fast blockchain network"
      },
      blockletServer: {
        description: "Host your apps easily"
      },
      ocap: {
        description: "Multi-chain connector"
      },
      did: {
        description: "Self-sovereign ID"
      },
      didWallet: {
        description: "Smart digital wallet"
      },
      didNameService: {
        description: "Web3 domain names"
      },
      vc: {
        description: "Verifiable Credentials"
      },
      didConnect: {
        description: "Passwordless login"
      },
      aigneCodeSmith: {
        description: "Review and improve your code with AI"
      },
      aigneDocSmith: {
        description: "Generate and update docs with AI"
      },
      aigneWebSmith: {
        description: "Build and deploy AI-powered web apps"
      },
      aigneCLI: {
        description: "Develop agents from the command line"
      },
      aigneObservability: {
        description: "Understand and inspect agent behavior"
      },
      aigneStudio: {
        description: "Create agents visually, no code needed"
      },
      aigneFramework: {
        description: "The functional core of agentic AI"
      },
      aigneHub: {
        description: "One API. Any Model"
      }
    }
  },
  zh: {
    groups: {
      applications: "应用",
      components: "组件",
      computeStorage: "计算/存储",
      identity: "身份",
      frameworkTools: "框架与工具",
      modelsAdapters: "模型适配器"
    },
    products: {
      nftStudio: {
        description: "铸造和管理 NFT"
      },
      creatorStudio: {
        description: "一体化创作工具"
      },
      aigne: {
        description: "AI 应用的代理生态系统"
      },
      arcsphere: {
        description: "AI 原生浏览器"
      },
      aistro: {
        description: "AI 占星术"
      },
      blockletLauncher: {
        description: "一键启动应用程序"
      },
      aiKit: {
        description: "AI 赋能应用"
      },
      paymentKit: {
        description: "便捷的加密货币和银行卡支付"
      },
      blockletStore: {
        description: "发现和部署应用程序"
      },
      web3Kit: {
        description: "Web3 开发工具包"
      },
      blockletFramework: {
        description: "构建并运行 Blocklet"
      },
      didSpaces: {
        description: "安全的个人存储"
      },
      abtNetwork: {
        description: "快速区块链网络"
      },
      blockletServer: {
        description: "轻松托管应用程序"
      },
      ocap: {
        description: "多链连接器"
      },
      did: {
        description: "自主身份"
      },
      didWallet: {
        description: "智能数字钱包"
      },
      didNameService: {
        description: "Web3 域名"
      },
      vc: {
        description: "可验证凭证"
      },
      didConnect: {
        description: "无密码登录"
      },
      aigneCodeSmith: {
        description: "使用 AI 审查并优化你的代码"
      },
      aigneDocSmith: {
        description: "用 AI 生成和更新项目文档"
      },
      aigneWebSmith: {
        description: "构建并部署 AI 驱动的 Web 应用"
      },
      aigneCLI: {
        description: "通过命令行开发 Agent"
      },
      aigneObservability: {
        description: "理解并分析 Agent 的行为"
      },
      aigneStudio: {
        description: "零代码构建 Agent"
      },
      aigneFramework: {
        description: "Agent AI 的功能核心框架"
      },
      aigneHub: {
        description: "一套 API，连接所有模型"
      }
    }
  },
  "zh-TW": {
    groups: {
      applications: "應用",
      components: "組件",
      computeStorage: "計算/儲存",
      identity: "身份",
      frameworkTools: "框架與工具",
      modelsAdapters: "模型適配器"
    },
    products: {
      nftStudio: {
        description: "鑄造和管理 NFT"
      },
      creatorStudio: {
        description: "一體化創作工具"
      },
      aigne: {
        description: "AI 應用的代理生態系統"
      },
      arcsphere: {
        description: "AI 原生瀏覽器"
      },
      aistro: {
        description: "AI 占星術"
      },
      blockletLauncher: {
        description: "一鍵啟動應用程式"
      },
      aiKit: {
        description: "AI 賦能應用"
      },
      paymentKit: {
        description: "便捷的加密貨幣和銀行卡支付"
      },
      blockletStore: {
        description: "發現和部署應用程式"
      },
      web3Kit: {
        description: "Web3 開發工具包"
      },
      blockletFramework: {
        description: "構建並運行 Blocklet"
      },
      didSpaces: {
        description: "安全的個人儲存"
      },
      abtNetwork: {
        description: "快速區塊鏈網路"
      },
      blockletServer: {
        description: "輕鬆託管應用程式"
      },
      ocap: {
        description: "多鏈連接器"
      },
      did: {
        description: "自主身份"
      },
      didWallet: {
        description: "智能數位錢包"
      },
      didNameService: {
        description: "Web3 域名"
      },
      vc: {
        description: "可驗證憑證"
      },
      didConnect: {
        description: "無密碼登入"
      },
      aigneCodeSmith: {
        description: "使用 AI 審查並優化你的程式碼"
      },
      aigneDocSmith: {
        description: "用 AI 生成和更新專案文件"
      },
      aigneWebSmith: {
        description: "構建並部署 AI 驅動的 Web 應用"
      },
      aigneCLI: {
        description: "透過命令列開發 Agent"
      },
      aigneObservability: {
        description: "理解並分析 Agent 的行為"
      },
      aigneStudio: {
        description: "零程式碼構建 Agent"
      },
      aigneFramework: {
        description: "Agent AI 的功能核心框架"
      },
      aigneHub: {
        description: "一套 API，連接所有模型"
      }
    }
  },
  ja: {
    groups: {
      applications: "アプリケーション",
      components: "コンポーネント",
      computeStorage: "コンピューティング/ストレージ",
      identity: "アイデンティティ",
      frameworkTools: "フレームワークとツール",
      modelsAdapters: "モデルアダプター"
    },
    products: {
      nftStudio: {
        description: "NFTの作成と管理"
      },
      creatorStudio: {
        description: "オールインワンクリエイターツール"
      },
      aigne: {
        description: "AIアプリのためのエージェントエコシステム"
      },
      arcsphere: {
        description: "AIネイティブブラウザ"
      },
      aistro: {
        description: "AI駆動占星術"
      },
      blockletLauncher: {
        description: "ワンクリックアプリ起動"
      },
      aiKit: {
        description: "AIでアプリを強化"
      },
      paymentKit: {
        description: "簡単な暗号通貨とカード決済"
      },
      blockletStore: {
        description: "アプリの発見とデプロイ"
      },
      web3Kit: {
        description: "Web3開発ツールキット"
      },
      blockletFramework: {
        description: "Blockletの構築と実行"
      },
      didSpaces: {
        description: "安全な個人ストレージ"
      },
      abtNetwork: {
        description: "高速ブロックチェーンネットワーク"
      },
      blockletServer: {
        description: "アプリの簡単なホスティング"
      },
      ocap: {
        description: "マルチチェーンコネクター"
      },
      did: {
        description: "自己主権ID"
      },
      didWallet: {
        description: "スマートデジタルウォレット"
      },
      didNameService: {
        description: "Web3ドメイン名"
      },
      vc: {
        description: "検証可能な認証情報"
      },
      didConnect: {
        description: "パスワード不要ログイン"
      },
      aigneCodeSmith: {
        description: "AIでコードをレビューし改善"
      },
      aigneDocSmith: {
        description: "AIでドキュメントを生成・更新"
      },
      aigneWebSmith: {
        description: "AI駆動Webアプリの構築とデプロイ"
      },
      aigneCLI: {
        description: "コマンドラインからエージェントを開発"
      },
      aigneObservability: {
        description: "エージェントの動作を理解・分析"
      },
      aigneStudio: {
        description: "コード不要でエージェントを視覚的に作成"
      },
      aigneFramework: {
        description: "エージェントAIの機能コアフレームワーク"
      },
      aigneHub: {
        description: "1つのAPIで全てのモデルに接続"
      }
    }
  }
}, oe = C(w)`
  padding: 8px;
  background: ${({ theme: t }) => t.palette.grey[100]};
  border-radius: 8px;

  &.is-inline {
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    .nav-menu-sub-item-group {
      padding: 8px 16px;
      border-radius: 0;
    }
  }

  .nav-menu-sub-item-group + .nav-menu-sub-item-group {
    margin-top: 8px;
  }
  .MuiGrid-container + .MuiGrid-container {
    margin-top: 0px;
  }
`, te = C(w, { shouldForwardProp: (t) => t !== "maxContent" })(
  ({ theme: t, maxContent: c }) => ({
    display: "grid",
    gap: t.spacing(1),
    gridTemplateColumns: `repeat(1, ${c}px)`,
    [t.breakpoints.up("md")]: {
      gridTemplateColumns: `repeat(2, ${c}px)`
    },
    [t.breakpoints.up("lg")]: {
      gridTemplateColumns: `repeat(3, ${c}px)`
    }
  })
);
function y({ color: t = "black", backgroundColor: c = "transparent", children: a }) {
  return /* @__PURE__ */ e(
    w,
    {
      component: "span",
      sx: {
        display: "inline-flex",
        alignItems: "center",
        justifyContent: "center",
        color: t,
        backgroundColor: c,
        borderRadius: "4px"
      },
      children: a
    }
  );
}
function h({ color: t = "black", backgroundColor: c = "transparent" }) {
  return /* @__PURE__ */ e(y, { color: t, backgroundColor: c, children: /* @__PURE__ */ e(q, { style: { width: "100%" } }) });
}
function s({ color: t = "black", backgroundColor: c = "transparent" }) {
  return /* @__PURE__ */ e(y, { color: t, backgroundColor: c, children: /* @__PURE__ */ e(Y, { style: { width: "100%", height: "100%" } }) });
}
const W = (t) => {
  try {
    return new URL(t).origin !== window.location.origin;
  } catch {
    return !1;
  }
};
function o({ to: t, children: c, className: a = "", ...u }) {
  return W(t) ? /* @__PURE__ */ e(p, { to: ee(t, "header"), target: "_blank", rel: "noreferrer noopener", className: a, ...u, children: c }) : /* @__PURE__ */ e(p, { to: t, className: a, ...u, children: c });
}
function Fe({ className: t = "", type: c, ...a }) {
  const { mode: u } = E(), k = G(), { locale: r = "en" } = _() || {}, l = T(null), { palette: f } = k, i = A((n, d = {}) => L(ie, n, r, "en", d)), [N, D] = $(v), m = A(() => {
    if (!l.current) return;
    const n = l.current.querySelectorAll(".navmenu-item__content");
    let d = v;
    n.forEach((b) => {
      const g = b.getBoundingClientRect().width + 64;
      g > d && (d = g);
    }), D(d);
  });
  S(() => {
    m();
  }, [k, r, c, m]), S(() => {
    if (!l.current) return;
    const n = l.current.querySelector(".navmenu-item__content");
    if (!n) return;
    const d = new ResizeObserver(() => {
      m();
    });
    return d.observe(n), () => {
      d.disconnect();
    };
  }, [m]);
  const x = F(() => {
    if (c === "ARCBLOCK")
      return [
        {
          type: "Group",
          label: i("groups.applications"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.nftstudio.rocks/${r}`, children: "NFT Studio" }),
              description: i("products.nftStudio.description"),
              icon: /* @__PURE__ */ e(M, {})
            },
            {
              label: /* @__PURE__ */ e(
                p,
                {
                  to: `https://www.arcblock.io/content/collections/${r}/creator-studio`,
                  target: "_blank",
                  rel: "noreferrer noopener",
                  children: "Creator Studio"
                }
              ),
              description: i("products.creatorStudio.description"),
              icon: /* @__PURE__ */ e(O, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/", children: "AIGNE" }),
              description: i("products.aigne.description"),
              icon: /* @__PURE__ */ e(s, { color: f.mode === "dark" ? "white" : "black" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.arcsphere.io/${r}`, children: "ArcSphere" }),
              description: i("products.arcsphere.description"),
              icon: /* @__PURE__ */ e(I, {})
            }
          ]
        },
        {
          type: "Group",
          label: i("groups.components"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: `https://launcher.arcblock.io/${r}`, children: "Blocklet Launcher" }),
              description: i("products.blockletLauncher.description"),
              icon: /* @__PURE__ */ e(P, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.blocklet.io/${r}/payment-kit`, children: "Payment Kit" }),
              description: i("products.paymentKit.description"),
              icon: /* @__PURE__ */ e("img", { src: X, alt: "Payment Kit" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://store.blocklet.dev/?locale=${r}`, children: "Blocklet Store" }),
              description: i("products.blockletStore.description"),
              icon: /* @__PURE__ */ e(H, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.web3kit.rocks/${r}`, children: "Web3 Kit" }),
              description: i("products.web3Kit.description"),
              icon: /* @__PURE__ */ e(R, {})
            }
          ]
        },
        {
          type: "Group",
          label: i("groups.computeStorage"),
          children: [
            {
              label: /* @__PURE__ */ e(
                p,
                {
                  to: `https://www.arcblock.io/content/collections/${r}/blocklet`,
                  target: "_blank",
                  rel: "noreferrer noopener",
                  children: "Blocklet Framework"
                }
              ),
              description: i("products.blockletFramework.description"),
              icon: /* @__PURE__ */ e(z, {})
            },
            {
              label: /* @__PURE__ */ e(p, { to: `https://www.didspaces.com/${r}`, target: "_blank", rel: "noreferrer noopener", children: "DID Spaces" }),
              description: i("products.didSpaces.description"),
              icon: /* @__PURE__ */ e(h, { color: "#876bf4" })
            },
            {
              label: /* @__PURE__ */ e(p, { to: "https://main.abtnetwork.io/", target: "_blank", rel: "noreferrer noopener", children: "ABT Network" }),
              description: i("products.abtNetwork.description"),
              icon: /* @__PURE__ */ e(U, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.blocklet.io/${r}/blocklet-server`, children: "Blocklet Server" }),
              description: i("products.blockletServer.description"),
              icon: /* @__PURE__ */ e(j, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.arcblock.io/content/collections/${r}/ocap`, children: "ОСАР" }),
              description: i("products.ocap.description"),
              icon: /* @__PURE__ */ e(V, {})
            }
          ]
        },
        {
          type: "Group",
          label: i("groups.identity"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.arcblock.io/content/collections/${r}/did`, children: "DID" }),
              description: i("products.did.description"),
              icon: /* @__PURE__ */ e(h, { color: "#5b96f3" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.didwallet.io/${r}`, children: "DID Wallet" }),
              description: i("products.didWallet.description"),
              icon: /* @__PURE__ */ e(J, {})
            },
            {
              label: /* @__PURE__ */ e(p, { to: `https://www.didnames.io/${r}`, target: "_blank", rel: "noreferrer noopener", children: "DID Names" }),
              description: i("products.didNameService.description"),
              icon: /* @__PURE__ */ e(h, { color: "#678ab0" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.arcblock.io/content/collections/${r}/verifiable-credential`, children: "VC" }),
              description: i("products.vc.description"),
              icon: /* @__PURE__ */ e(Q, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.didconnect.io/${r}`, children: "DID Connect" }),
              description: i("products.didConnect.description"),
              icon: /* @__PURE__ */ e(h, { color: "#5bbec5" })
            }
          ]
        }
      ];
    if (c === "AIGNE") {
      const n = {
        onClick: (d) => {
          d.preventDefault();
          const b = d.currentTarget.href, g = W(b) ? "_blank" : "_self";
          window.open(b, g);
        }
      };
      return [
        {
          type: "Group",
          label: i("groups.applications"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.arcsphere.io/${r}`, children: "ArcSphere" }),
              description: i("products.arcsphere.description"),
              icon: /* @__PURE__ */ e(I, {})
            },
            {
              label: /* @__PURE__ */ e(o, { to: `https://www.aistro.io/${r}`, children: "Aistro" }),
              description: i("products.aistro.description"),
              icon: /* @__PURE__ */ e("img", { src: Z, alt: "Aistro" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/code-smith", ...n, children: "AIGNE CodeSmith" }),
              description: i("products.aigneCodeSmith.description"),
              icon: /* @__PURE__ */ e(s, { color: "#3E5DF7", backgroundColor: "#e9f0ff" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/doc-smith", ...n, children: "AIGNE DocSmith" }),
              description: i("products.aigneDocSmith.description"),
              icon: /* @__PURE__ */ e(s, { color: "#02A996", backgroundColor: "#e6f7f5" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/web-smith", ...n, children: "AIGNE WebSmith" }),
              description: i("products.aigneWebSmith.description"),
              icon: /* @__PURE__ */ e(s, { color: "#7c45eb", backgroundColor: "#f0e9ff" })
            }
          ]
        },
        {
          type: "Group",
          label: i("groups.frameworkTools"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/cli", ...n, children: "AIGNE CLI" }),
              description: i("products.aigneCLI.description"),
              icon: /* @__PURE__ */ e(s, { color: "#d05d4e", backgroundColor: "#faeaea" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/observability", ...n, children: "AIGNE Observability" }),
              description: i("products.aigneObservability.description"),
              icon: /* @__PURE__ */ e(s, { color: "#6ba456", backgroundColor: "#edfae8" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/studio", ...n, children: "AIGNE Studio" }),
              description: i("products.aigneStudio.description"),
              icon: /* @__PURE__ */ e(s, { color: "#676cbf", backgroundColor: "#edeeff" })
            },
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/framework", ...n, children: "AIGNE Framework" }),
              description: i("products.aigneFramework.description"),
              icon: /* @__PURE__ */ e(s, { color: "#5086d0", backgroundColor: "#eef4ff" })
            }
          ]
        },
        {
          type: "Group",
          label: i("groups.modelsAdapters"),
          children: [
            {
              label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/hub", ...n, children: "AIGNE Hub" }),
              description: i("products.aigneHub.description"),
              icon: /* @__PURE__ */ e(s, { color: "#e4930b", backgroundColor: "#fbf4d4" })
            }
          ]
        }
      ];
    }
    return [];
  }, [i, r, f]);
  return /* @__PURE__ */ e(oe, { ref: l, className: `nav-menu-products is-${u} ${t}`, ...a, children: x.map((n) => /* @__PURE__ */ e(B, { label: n.label, children: /* @__PURE__ */ e(te, { maxContent: N, children: n.children.map((d) => /* @__PURE__ */ e(K, { variant: "panel", style: { padding: "8px" }, ...d })) }) }, n.label)) });
}
export {
  Fe as default
};
