import { jsx as e } from "react/jsx-runtime";
import { useRef as D, useState as x, useEffect as S } from "react";
import { Link as G } from "react-router-dom";
import { useMemoizedFn as k, useCreation as $ } from "ahooks";
import { Box as g, useTheme as F } from "@mui/material";
import T from "./sub-item-group.js";
import { Item as E } from "./nav-menu.js";
import { styled as I } from "../Theme/index.js";
import { useNavMenuContext as K } from "./nav-menu-context.js";
import { translate as B } from "../Locale/util.js";
import { useLocaleContext as L } 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 R from "./images/blocklet-store.svg.js";
import _ from "./images/web3-kit.svg.js";
import H from "./images/blocklet-framework.svg.js";
import z from "./images/abt-network.svg.js";
import U from "./images/blocklet-server.svg.js";
import j from "./images/OCAP.svg.js";
import V from "./images/did.svg.js";
import q from "./images/did-wallet.svg.js";
import J from "./images/vc.svg.js";
import Q from "./images/payment-kit.png";
import X from "./images/aigne.svg.js";
import Y from "./images/aigne-image-smith.svg.js";
import f from "./images/arcsphere.svg.js";
import Z from "./images/aistro.png";
import { getUTMUrl as ee } from "../withTracker/libs/utm.js";
const A = 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"
      },
      aigneImageSmith: {
        description: "Generate and Refine Images with AI"
      },
      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 应用"
      },
      aigneImageSmith: {
        description: "使用 AI 生成和优化图像"
      },
      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 應用"
      },
      aigneImageSmith: {
        description: "使用 AI 生成和優化圖像"
      },
      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アプリの構築とデプロイ"
      },
      aigneImageSmith: {
        description: "AIで画像を生成・最適化"
      },
      aigneCLI: {
        description: "コマンドラインからエージェントを開発"
      },
      aigneObservability: {
        description: "エージェントの動作を理解・分析"
      },
      aigneStudio: {
        description: "コード不要でエージェントを視覚的に作成"
      },
      aigneFramework: {
        description: "エージェントAIの機能コアフレームワーク"
      },
      aigneHub: {
        description: "1つのAPIで全てのモデルに接続"
      }
    }
  }
}, te = I(g)`
  padding: 8px;
  background: ${({ theme: o }) => o.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;
  }
`, oe = I(g, { shouldForwardProp: (o) => o !== "maxContent" })(
  ({ theme: o, maxContent: n }) => ({
    display: "grid",
    gap: o.spacing(1),
    gridTemplateColumns: `repeat(1, ${n}px)`,
    [o.breakpoints.up("md")]: {
      gridTemplateColumns: `repeat(2, ${n}px)`
    },
    [o.breakpoints.up("lg")]: {
      gridTemplateColumns: `repeat(3, ${n}px)`
    }
  })
);
function v({ color: o = "black", backgroundColor: n = "transparent", children: p }) {
  return /* @__PURE__ */ e(
    g,
    {
      component: "span",
      sx: {
        display: "inline-flex",
        alignItems: "center",
        justifyContent: "center",
        color: o,
        backgroundColor: n,
        borderRadius: "4px"
      },
      children: p
    }
  );
}
function b({ color: o = "black", backgroundColor: n = "transparent" }) {
  return /* @__PURE__ */ e(v, { color: o, backgroundColor: n, children: /* @__PURE__ */ e(V, { style: { width: "100%" } }) });
}
function s({ color: o = "black", backgroundColor: n = "transparent" }) {
  return /* @__PURE__ */ e(v, { color: o, backgroundColor: n, children: /* @__PURE__ */ e(X, { style: { width: "100%", height: "100%" } }) });
}
const re = (o = "") => o.startsWith("http:") || o.startsWith("https:"), ne = (o) => {
  try {
    return new URL(o).origin === window.location.origin;
  } catch {
    return !1;
  }
};
function t({ to: o, children: n, className: p = "", ...l }) {
  if (re(o)) {
    const m = ne(o) ? "_self" : "_blank";
    return /* @__PURE__ */ e("a", { href: ee(o, "header"), target: m, rel: "noreferrer noopener", className: p, ...l, children: n });
  }
  return /* @__PURE__ */ e(G, { to: o, className: p, ...l, children: n });
}
function Ke({ className: o = "", type: n, ...p }) {
  const { mode: l } = K(), m = F(), { locale: r = "en" } = L() || {}, a = D(null), { palette: h } = m, i = k((c, d = {}) => B(ie, c, r, "en", d)), [C, y] = x(A), u = k(() => {
    if (!a.current) return;
    const c = a.current.querySelectorAll(".navmenu-item__content");
    let d = A;
    c.forEach((N) => {
      const w = N.getBoundingClientRect().width + 64;
      w > d && (d = w);
    }), y(d);
  });
  S(() => {
    u();
  }, [m, r, n, u]), S(() => {
    if (!a.current) return;
    const c = a.current.querySelector(".navmenu-item__content");
    if (!c) return;
    const d = new ResizeObserver(() => {
      u();
    });
    return d.observe(c), () => {
      d.disconnect();
    };
  }, [u]);
  const W = $(() => n === "ARCBLOCK" ? [
    {
      type: "Group",
      label: i("groups.applications"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.nftstudio.rocks/${r}`, children: "NFT Studio" }),
          description: i("products.nftStudio.description"),
          icon: /* @__PURE__ */ e(M, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcblock.io/content/collections/${r}/creator-studio`, children: "Creator Studio" }),
          description: i("products.creatorStudio.description"),
          icon: /* @__PURE__ */ e(O, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/", children: "AIGNE" }),
          description: i("products.aigne.description"),
          icon: /* @__PURE__ */ e(s, { color: h.mode === "dark" ? "white" : "black" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcsphere.io/${r}`, children: "ArcSphere" }),
          description: i("products.arcsphere.description"),
          icon: /* @__PURE__ */ e(f, {})
        }
      ]
    },
    {
      type: "Group",
      label: i("groups.components"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: `https://launcher.arcblock.io/${r}`, children: "Blocklet Launcher" }),
          description: i("products.blockletLauncher.description"),
          icon: /* @__PURE__ */ e(P, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.blocklet.io/${r}/payment-kit`, children: "Payment Kit" }),
          description: i("products.paymentKit.description"),
          icon: /* @__PURE__ */ e("img", { src: Q, alt: "Payment Kit" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://store.blocklet.dev/?locale=${r}`, children: "Blocklet Store" }),
          description: i("products.blockletStore.description"),
          icon: /* @__PURE__ */ e(R, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.web3kit.rocks/${r}`, children: "Web3 Kit" }),
          description: i("products.web3Kit.description"),
          icon: /* @__PURE__ */ e(_, {})
        }
      ]
    },
    {
      type: "Group",
      label: i("groups.computeStorage"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcblock.io/content/collections/${r}/blocklet`, children: "Blocklet Framework" }),
          description: i("products.blockletFramework.description"),
          icon: /* @__PURE__ */ e(H, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.didspaces.com/${r}`, children: "DID Spaces" }),
          description: i("products.didSpaces.description"),
          icon: /* @__PURE__ */ e(b, { color: "#876bf4" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://main.abtnetwork.io/", children: "ABT Network" }),
          description: i("products.abtNetwork.description"),
          icon: /* @__PURE__ */ e(z, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.blocklet.io/${r}/blocklet-server`, children: "Blocklet Server" }),
          description: i("products.blockletServer.description"),
          icon: /* @__PURE__ */ e(U, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcblock.io/content/collections/${r}/ocap`, children: "ОСАР" }),
          description: i("products.ocap.description"),
          icon: /* @__PURE__ */ e(j, {})
        }
      ]
    },
    {
      type: "Group",
      label: i("groups.identity"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcblock.io/content/collections/${r}/did`, children: "DID" }),
          description: i("products.did.description"),
          icon: /* @__PURE__ */ e(b, { color: "#5b96f3" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.didwallet.io/${r}`, children: "DID Wallet" }),
          description: i("products.didWallet.description"),
          icon: /* @__PURE__ */ e(q, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.didnames.io/${r}`, children: "DID Names" }),
          description: i("products.didNameService.description"),
          icon: /* @__PURE__ */ e(b, { color: "#678ab0" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcblock.io/content/collections/${r}/verifiable-credential`, children: "VC" }),
          description: i("products.vc.description"),
          icon: /* @__PURE__ */ e(J, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.didconnect.io/${r}`, children: "DID Connect" }),
          description: i("products.didConnect.description"),
          icon: /* @__PURE__ */ e(b, { color: "#5bbec5" })
        }
      ]
    }
  ] : n === "AIGNE" ? [
    {
      type: "Group",
      label: i("groups.applications"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.arcsphere.io/${r}`, children: "ArcSphere" }),
          description: i("products.arcsphere.description"),
          icon: /* @__PURE__ */ e(f, {})
        },
        {
          label: /* @__PURE__ */ e(t, { to: `https://www.aistro.io/${r}`, children: "Aistro" }),
          description: i("products.aistro.description"),
          icon: /* @__PURE__ */ e("img", { src: Z, alt: "Aistro" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/code-smith", children: "AIGNE CodeSmith" }),
          description: i("products.aigneCodeSmith.description"),
          icon: /* @__PURE__ */ e(s, { color: "#3E5DF7", backgroundColor: "#e9f0ff" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/doc-smith", children: "AIGNE DocSmith" }),
          description: i("products.aigneDocSmith.description"),
          icon: /* @__PURE__ */ e(s, { color: "#02A996", backgroundColor: "#e6f7f5" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/web-smith", children: "AIGNE WebSmith" }),
          description: i("products.aigneWebSmith.description"),
          icon: /* @__PURE__ */ e(s, { color: "#7c45eb", backgroundColor: "#f0e9ff" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://imagesmith.aigne.io/", children: "AIGNE ImageSmith" }),
          description: i("products.aigneImageSmith.description"),
          icon: /* @__PURE__ */ e(Y, {})
        }
      ]
    },
    {
      type: "Group",
      label: i("groups.frameworkTools"),
      children: [
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/cli", children: "AIGNE CLI" }),
          description: i("products.aigneCLI.description"),
          icon: /* @__PURE__ */ e(s, { color: "#d05d4e", backgroundColor: "#faeaea" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/observability", children: "AIGNE Observability" }),
          description: i("products.aigneObservability.description"),
          icon: /* @__PURE__ */ e(s, { color: "#6ba456", backgroundColor: "#edfae8" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/studio", children: "AIGNE Studio" }),
          description: i("products.aigneStudio.description"),
          icon: /* @__PURE__ */ e(s, { color: "#676cbf", backgroundColor: "#edeeff" })
        },
        {
          label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/framework", 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(t, { to: "https://www.aigne.io/hub", children: "AIGNE Hub" }),
          description: i("products.aigneHub.description"),
          icon: /* @__PURE__ */ e(s, { color: "#e4930b", backgroundColor: "#fbf4d4" })
        }
      ]
    }
  ] : [], [i, r, h]);
  return /* @__PURE__ */ e(te, { ref: a, className: `nav-menu-products is-${l} ${o}`, ...p, children: W.map((c) => /* @__PURE__ */ e(T, { label: c.label, children: /* @__PURE__ */ e(oe, { maxContent: C, children: c.children.map((d) => /* @__PURE__ */ e(E, { variant: "panel", style: { padding: "8px" }, ...d })) }) }, c.label)) });
}
export {
  Ke as default
};
