@arcblock/ux 3.0.5 → 3.0.7

package/lib/NFTDisplay/aspect-ratio-container.js

@@ -1,5 +1,5 @@
 import { jsx as o } from "react/jsx-runtime";
-import { styled as e } from "../Theme/index.js";
+import { styled as e } from "../Theme";
 function p({ aspect: t, children: i, ...n }) {
   return /* @__PURE__ */ o(a, { aspect: t, ...n, children: /* @__PURE__ */ o("span", { className: "aspect-ratio-container__inner", children: i }) });
 }

package/lib/NFTDisplay/broken.js

@@ -1,7 +1,7 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import { Box as o } from "@mui/material";
-import { styled as i } from "../Theme/index.js";
-import r from "./NFTBroken.svg.js";
+import { styled as i } from "../Theme";
+import r from "./NFTBroken.svg";
 function c({ children: t = "Non-publicly accessible NFT" } = {}) {
   return /* @__PURE__ */ n(s, { children: [
     /* @__PURE__ */ e(r, { className: "nft-display-broken-background" }),

package/lib/NFTDisplay/index.js

@@ -1,6 +1,6 @@
 import { jsx as n, jsxs as H, Fragment as J } from "react/jsx-runtime";
-import { useRef as M, useState as P, useEffect as A } from "react";
-import S from "clsx";
+import { useRef as M, useState as A, useEffect as P } from "react";
+import $ from "clsx";
 import { Buffer as O } from "buffer";
 import K from "lodash/get";
 import Q from "pako";
@@ -8,15 +8,15 @@ import X from "base64-url";
 import B from "is-svg";
 import Y from "lodash/noop";
 import { Box as Z } from "@mui/material";
-import rr from "./aspect-ratio-container.js";
-import er from "./svg-embedder/img.js";
-import tr from "./svg-embedder/inline-svg.js";
-import or from "./loading.js";
-import C from "./broken.js";
-import { styled as nr } from "../Theme/index.js";
-import ir from "./displayApi.js";
-import sr from "./render-svg.js";
-function Nr(e) {
+import rr from "./aspect-ratio-container";
+import er from "./svg-embedder/img";
+import tr from "./svg-embedder/inline-svg";
+import or from "./loading";
+import C from "./broken";
+import { styled as nr } from "../Theme";
+import ir from "./displayApi";
+import sr from "./render-svg";
+function Dr(e) {
   var s;
   return (e == null ? void 0 : e.display) || ((s = e == null ? void 0 : e.data) == null ? void 0 : s.value);
 }
@@ -34,9 +34,9 @@ function lr({
   address: s,
   inset: m,
   aspect: g,
-  component: T = "span",
+  component: b = "span",
   className: z = "",
-  renderError: b,
+  renderError: T,
   renderLoading: j,
   preferredSvgEmbedder: E = "img",
   checkSvg: x = !1,
@@ -45,21 +45,24 @@ function lr({
   imageFilter: I = null,
   ...k
 }) {
-  var R;
-  const F = (l) => /* @__PURE__ */ n(cr, { component: T, ...k, className: S(z, { "nft-display--inset": m }), children: l }), a = M({});
+  var F;
+  const R = (l) => (
+    // @ts-expect-error
+    /* @__PURE__ */ n(cr, { component: b, ...k, className: $(z, { "nft-display--inset": m }), children: l })
+  ), a = M({});
   try {
     typeof e == "string" ? a.current = JSON.parse(e) : a.current = e;
-    const { vcId: l } = a.current, U = a.current.credentialSubject ? K(a.current, "credentialSubject.display") : a.current, { content: f, type: y } = U, G = y === "url", [t, c] = P({
+    const { vcId: l } = a.current, U = a.current.credentialSubject ? K(a.current, "credentialSubject.display") : a.current, { content: f, type: y } = U, G = y === "url", [t, c] = A({
       loading: G,
       error: !1,
       loadingUrlType: !0,
       urlType: null
-    }), [w, V] = P(h <= 0), d = ({ useImageFilter: o = !1, t: i } = {}) => {
+    }), [w, S] = A(h <= 0), d = ({ useImageFilter: o = !1, t: i } = {}) => {
       const r = new URL(f);
       return window.location.protocol === "https:" && r.protocol === "http:" && (r.protocol = "https:"), r.searchParams.has("assetId") || r.searchParams.append("assetId", s), !r.searchParams.has("vcId") && l && r.searchParams.append("vcId", l), o && I && Object.entries(I).forEach(([p, u]) => {
         r.searchParams.append(p, u);
       }), i && r.searchParams.append("t", i), r.href;
-    }, _ = async () => {
+    }, V = async () => {
       var o, i;
       try {
         const r = await ir({
@@ -75,21 +78,21 @@ function lr({
         c({ ...t, loadingUrlType: !1, urlType: null });
       }
     };
-    if (A(() => {
+    if (P(() => {
       let o;
-      return h > 0 && (o = setTimeout(() => V(!0), h)), y === "url" && _(), () => clearTimeout(o);
-    }, []), A(() => {
+      return h > 0 && (o = setTimeout(() => S(!0), h)), y === "url" && V(), () => clearTimeout(o);
+    }, []), P(() => {
       (!t.loading && w || t.error) && W();
     }, [t, w]), t.error)
       throw new Error("Failed to render NFT Display.");
     const v = () => {
       t.loading && c({ ...t, loading: !1 });
-    }, N = () => {
-      c({ ...t, error: !0, loading: !1 });
     }, D = () => {
+      c({ ...t, error: !0, loading: !1 });
+    }, N = () => {
       const o = d({ useImageFilter: !0 });
-      return /* @__PURE__ */ n("img", { src: o, onError: N, onLoad: v, alt: "NFT Display", style: { width: "auto", height: "auto" } });
-    }, $ = () => {
+      return /* @__PURE__ */ n("img", { src: o, onError: D, onLoad: v, alt: "NFT Display", style: { width: "auto", height: "auto" } });
+    }, _ = () => {
       const o = t.urlType || "image/svg+xml", i = d(), r = new URL(i).pathname.toLowerCase();
       return [
         ".jpg",
@@ -106,14 +109,14 @@ function lr({
         ".pjpeg",
         ".pjp",
         ".avif"
-      ].some((u) => r.endsWith(u)) ? D() : o.includes("text/html;") ? /* @__PURE__ */ n(C, {}) : (
+      ].some((u) => r.endsWith(u)) ? N() : o.includes("text/html;") ? /* @__PURE__ */ n(C, {}) : (
         // eslint-disable-next-line jsx-a11y/alt-text
         /* @__PURE__ */ n(
           "object",
           {
             type: o,
             data: i,
-            onErrorCapture: N,
+            onErrorCapture: D,
             onLoad: v,
             style: { width: "100%", height: "100%", pointerEvents: "none" }
           },
@@ -125,7 +128,7 @@ function lr({
       if (f)
         switch (y) {
           case "url":
-            return t.loadingUrlType ? null : (o = t.urlType) != null && o.startsWith("image/svg+xml") ? /* @__PURE__ */ n(sr, { src: d(), onLoad: v }) : (i = t.urlType) != null && i.startsWith("image") ? D() : $();
+            return t.loadingUrlType ? null : (o = t.urlType) != null && o.startsWith("image/svg+xml") ? /* @__PURE__ */ n(sr, { src: d(), onLoad: v }) : (i = t.urlType) != null && i.startsWith("image") ? N() : _();
           case "uri":
             return /* @__PURE__ */ n(
               "img",
@@ -156,7 +159,7 @@ function lr({
         }
       throw new Error(`unsupported display protocol: ${U.type}`);
     };
-    return F(
+    return R(
       /* @__PURE__ */ H(J, { children: [
         (t.loading || !w) && (j ? j() : /* @__PURE__ */ n(or, {})),
         q()
@@ -165,8 +168,8 @@ function lr({
   } catch (l) {
     return console.error(l == null ? void 0 : l.message, {
       nftId: s,
-      vcId: (R = a == null ? void 0 : a.current) == null ? void 0 : R.vcId
-    }), F(b ? b() : /* @__PURE__ */ n(C, {}));
+      vcId: (F = a == null ? void 0 : a.current) == null ? void 0 : F.vcId
+    }), R(T ? T() : /* @__PURE__ */ n(C, {}));
   }
 }
 const cr = nr(Z)`
@@ -198,12 +201,12 @@ const cr = nr(Z)`
   }
 `;
 function pr(e) {
-  return function({ aspect: s, inset: m, ...g }) {
+  return function({ aspect: s = void 0, inset: m = !1, ...g }) {
     return s && s > 0 && !m ? /* @__PURE__ */ n(rr, { aspect: s, children: /* @__PURE__ */ n(e, { inset: !0, ...g }) }) : /* @__PURE__ */ n(e, { inset: m, ...g });
   };
 }
-const Dr = pr(lr);
+const Nr = pr(lr);
 export {
-  Dr as default,
-  Nr as getNFTData
+  Nr as default,
+  Dr as getNFTData
 };

package/lib/NFTDisplay/loading.js

@@ -1,5 +1,5 @@
 import { jsx as o } from "react/jsx-runtime";
-import { styled as t } from "../Theme/index.js";
+import { styled as t } from "../Theme";
 function a() {
   return /* @__PURE__ */ o(e, { className: "nft-display__loading", children: "Loading..." });
 }

package/lib/NFTDisplay/render-svg.js

@@ -3,12 +3,12 @@ import m from "dompurify";
 import { useAsyncEffect as f } from "ahooks";
 import c from "axios";
 import { useState as p } from "react";
-import a from "./svg-embedder/inline-svg.js";
-function y({ src: e, onLoad: t }) {
+import a from "./svg-embedder/inline-svg";
+function y({ src: e, onLoad: t = void 0 }) {
   const [r, s] = p("");
   return f(async () => {
-    const n = await c.get(e), i = m.sanitize(n.data);
-    s(i), t == null || t();
+    const i = await c.get(e), n = m.sanitize(i.data);
+    s(n), t == null || t();
   }, []), /* @__PURE__ */ o(a, { svg: r });
 }
 export {

package/lib/NFTDisplay/svg-embedder/img.js

@@ -1,15 +1,15 @@
 import { jsx as o } from "react/jsx-runtime";
-import c from "./inline-svg.js";
+import c from "./inline-svg";
 const i = (e) => {
   const r = new Blob([e], { type: "image/svg+xml" });
   return URL.createObjectURL(r);
 };
-function l({ svg: e, alt: r = "", fallback: n = !0, ...m }) {
+function f({ svg: e, alt: r = "", fallback: n = !0, ...m }) {
   if (n && e.indexOf("</foreignObject>") > -1)
     return /* @__PURE__ */ o(c, { svg: e });
   const t = i(e);
   return /* @__PURE__ */ o("img", { src: t, onLoad: () => URL.revokeObjectURL(t), alt: r, ...m });
 }
 export {
-  l as default
+  f as default
 };

package/lib/NFTDisplay/svg-embedder/inline-svg.js

@@ -1,6 +1,6 @@
 import { jsx as t } from "react/jsx-runtime";
 import r from "react-shadow/emotion";
-import { styled as o } from "../../Theme/index.js";
+import { styled as o } from "../../Theme";
 function l({ svg: i, ...n }) {
   return /* @__PURE__ */ t(e, { ...n, children: /* @__PURE__ */ t(d, { dangerouslySetInnerHTML: { __html: i } }) });
 }

package/lib/NavMenu/index.js

@@ -1,5 +1,5 @@
-import { default as t } from "./nav-menu.js";
-import { default as f } from "./products.js";
+import { default as t } from "./nav-menu";
+import { default as f } from "./products";
 export {
   f as Products,
   t as default

package/lib/NavMenu/nav-menu.js

@@ -1,15 +1,14 @@
-import { jsx as o, jsxs as M } from "react/jsx-runtime";
-import { useRef as T, useLayoutEffect as ne, useEffect as j, Children as V, isValidElement as te, cloneElement as re } from "react";
-import { useTheme as oe, ClickAwayListener as ae } from "@mui/material";
+import { jsxs as M, jsx as o } from "react/jsx-runtime";
+import { useEffect as j, useRef as T, useLayoutEffect as ne, Children as V, isValidElement as te, cloneElement as re } from "react";
+import { ClickAwayListener as oe } from "@mui/material";
 import F from "clsx";
-import { Menu as le, MoreHoriz as ie, ArrowForward as se, ExpandMore as ue } from "@mui/icons-material";
-import { useCreation as L, useReactive as ce, useMemoizedFn as A, useSize as de, useThrottleFn as me } from "ahooks";
-import fe from "lodash/noop";
-import { NavMenuProvider as ve, useNavMenuContext as B } from "./nav-menu-context.js";
-import { NavMenuStyled as pe, NavMenuRoot as he, NavMenuItem as Ce, NavMenuSub as Ne, NavMenuSubList as _e } from "./style.js";
-import { SubContainer as be } from "./sub-container.js";
-import "../Theme/theme.js";
-import "../Theme/theme-provider.js";
+import { ArrowForward as ae, ExpandMore as ie, Menu as le, MoreHoriz as se } from "@mui/icons-material";
+import { useCreation as L, useReactive as ue, useMemoizedFn as A, useSize as ce, useThrottleFn as de } from "ahooks";
+import me from "lodash/noop";
+import { useNavMenuContext as B, NavMenuProvider as fe } from "./nav-menu-context";
+import { NavMenuItem as ve, NavMenuSub as pe, NavMenuSubList as he, NavMenuStyled as Ce, NavMenuRoot as Ne } from "./style";
+import { SubContainer as _e } from "./sub-container";
+import { useTheme as be } from "../Theme";
 function D(n) {
   return n ? V.toArray(n).filter((a) => te(a) ? a.type === k || a.type === E : !1) : null;
 }
@@ -21,17 +20,20 @@ function J({
   mode: a = "horizontal",
   children: C = null,
   activeId: m = null,
+  // eslint-disable-next-line react/require-default-props
   textColor: y,
+  // eslint-disable-next-line react/require-default-props
   activeTextColor: g,
+  // eslint-disable-next-line react/require-default-props
   bgColor: I,
-  onSelected: s,
+  onSelected: s = void 0,
   ...f
 }) {
   var O;
-  const r = oe(), u = L(() => r.palette.text.secondary, [r]), v = L(() => r.palette.text.primary, [r]), l = L(() => r.palette.background.default, [r]), c = D(C);
+  const r = be(), u = L(() => r.palette.text.secondary, [r]), v = L(() => r.palette.text.primary, [r]), i = L(() => r.palette.background.default, [r]), c = D(C);
   if (!(n != null && n.length) && !(c != null && c.length))
     throw new Error("One of 'items' or 'children' is required by NavMenu component.");
-  const t = ce({
+  const t = ue({
     activeId: m,
     openedIds: [],
     hiddenItemCount: 0
@@ -40,13 +42,13 @@ function J({
   }), _ = A((e) => {
     t.openedIds.push(e);
   }), W = A((e) => {
-    t.openedIds = t.openedIds.filter((i) => i !== e);
+    t.openedIds = t.openedIds.filter((l) => l !== e);
   }), z = L(() => ({
     ...t,
     mode: a,
     textColor: u,
     activeTextColor: v,
-    bgColor: l,
+    bgColor: i,
     activate: N,
     open: _,
     close: W
@@ -57,25 +59,25 @@ function J({
     a,
     u,
     v,
-    l,
+    i,
     N,
     _,
     W
-  ]), $ = T(null), p = T([]), w = T(null), q = T(0), S = t.hiddenItemCount === ((O = p.current) == null ? void 0 : O.length), K = S ? { marginLeft: "0px" } : void 0, Q = L(() => S ? /* @__PURE__ */ o(le, {}) : /* @__PURE__ */ o(ie, {}), [S]), X = (e) => V.map(e, (i, h) => re(i, {
+  ]), $ = T(null), p = T([]), w = T(null), q = T(0), S = t.hiddenItemCount === ((O = p.current) == null ? void 0 : O.length), K = S ? { marginLeft: "0px" } : void 0, Q = L(() => S ? /* @__PURE__ */ o(le, {}) : /* @__PURE__ */ o(se, {}), [S]), X = (e) => V.map(e, (l, h) => re(l, {
     ref: (b) => {
       p.current[h] = b;
     }
-  })), x = de($.current), { run: R } = me(
+  })), x = ce($.current), { run: R } = de(
     A(() => {
-      let e = 0, i = 0, h = !1;
+      let e = 0, l = 0, h = !1;
       const b = w.current ? w.current.offsetWidth + parseFloat(window.getComputedStyle(w.current).marginLeft) : 0;
       p.current.forEach((d, P) => {
         if (d) {
           d.style.display = "flex";
           const ee = P > 0 ? parseFloat(window.getComputedStyle(d).marginLeft) : 0, U = d.offsetWidth + ee;
-          q.current - b >= e + U && !h ? e += U : (d.style.display = "none", h = !0, i++);
+          q.current - b >= e + U && !h ? e += U : (d.style.display = "none", h = !0, l++);
         }
-      }), i !== t.hiddenItemCount && (t.hiddenItemCount = i);
+      }), l !== t.hiddenItemCount && (t.hiddenItemCount = l);
     }),
     { wait: 100 }
   );
@@ -90,7 +92,7 @@ function J({
   }, [a, n]), j(() => {
     m != null && (t.activeId = m);
   }, [m]);
-  const Y = F("navmenu", `navmenu--${a}`, f.className), H = (e, i, h = 0) => {
+  const Y = F("navmenu", `navmenu--${a}`, f.className), H = (e, l, h = 0) => {
     const b = h === 0;
     return e != null && e.children ? h > 0 ? null : /* @__PURE__ */ o(
       E,
@@ -100,7 +102,7 @@ function J({
         label: e.label,
         variant: b ? "default" : "panel",
         ref: b ? (d) => {
-          p.current[i] = d;
+          p.current[l] = d;
         } : void 0,
         children: typeof e.children == "function" ? e.children : e.children.map(
           (d, P) => H({ ...d, variant: "panel" }, P, h + 1)
@@ -117,29 +119,29 @@ function J({
         active: e.active,
         variant: e.variant,
         ref: b ? (d) => {
-          p.current[i] = d;
+          p.current[l] = d;
         } : void 0
       },
       e.id
     );
-  }, Z = n ? n == null ? void 0 : n.slice(-t.hiddenItemCount).map((e, i) => H(e, i, 1)) : c == null ? void 0 : c.slice(-t.hiddenItemCount);
-  return /* @__PURE__ */ o(ve, { value: z, children: /* @__PURE__ */ o(pe, { ...f, className: Y, $textColor: u, $bgColor: l, children: /* @__PURE__ */ M(he, { className: F("navmenu-root", `navmenu-root--${a}`), ref: $, children: [
-    n ? n.map((e, i) => H(e, i)) : X(c || []),
+  }, Z = n ? n == null ? void 0 : n.slice(-t.hiddenItemCount).map((e, l) => H(e, l, 1)) : c == null ? void 0 : c.slice(-t.hiddenItemCount);
+  return /* @__PURE__ */ o(fe, { value: z, children: /* @__PURE__ */ o(Ce, { ...f, className: Y, $textColor: u, $bgColor: i, children: /* @__PURE__ */ M(Ne, { className: F("navmenu-root", `navmenu-root--${a}`), ref: $, children: [
+    n ? n.map((e, l) => H(e, l)) : X(c || []),
     t.hiddenItemCount > 0 && /* @__PURE__ */ o(E, { expandIcon: !1, icon: Q, label: "", ref: w, style: K, children: Z })
   ] }) }) });
 }
 function k({
-  ref: n,
+  ref: n = void 0,
   id: a = "",
   icon: C = null,
   label: m = "",
-  description: y,
+  description: y = void 0,
   active: g = !1,
   variant: I = "default",
-  onClick: s = fe,
+  onClick: s = me,
   ...f
 }) {
-  const r = G(a), { mode: u, activeId: v, activate: l, activeTextColor: c } = B(), t = F(
+  const r = G(a), { mode: u, activeId: v, activate: i, activeTextColor: c } = B(), t = F(
     "navmenu-item",
     { "navmenu-item--active": v === r },
     `navmenu-item--${u}`,
@@ -147,17 +149,17 @@ function k({
     f.className
   );
   return j(() => {
-    g && (l == null || l(r));
+    g && (i == null || i(r));
   }, [g]), // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
   /* @__PURE__ */ M(
-    Ce,
+    ve,
     {
       ...f,
       className: t,
       ref: n,
       $activeTextColor: c,
       onClick: () => {
-        s == null || s(), l == null || l(r);
+        s == null || s(), i == null || i(r);
       },
       children: [
         C && /* @__PURE__ */ o("span", { className: "navmenu-item__icon", children: C }),
@@ -165,7 +167,7 @@ function k({
           /* @__PURE__ */ M("span", { className: "navmenu-item__label", children: [
             m,
             " ",
-            /* @__PURE__ */ o(se, { className: "navmenu-item__label-arrow" })
+            /* @__PURE__ */ o(ae, { className: "navmenu-item__label-arrow" })
           ] }),
           y && /* @__PURE__ */ o("span", { className: "navmenu-item__desc", children: y })
         ] })
@@ -175,15 +177,15 @@ function k({
 }
 k.displayName = "NavMenu.Item";
 function E({
-  ref: n,
+  ref: n = void 0,
   id: a = "",
   icon: C = null,
   label: m = null,
   description: y,
   variant: g = "default",
-  children: I,
+  children: I = void 0,
   expandIcon: s = ({ isOpen: r }) => /* @__PURE__ */ o(
-    ue,
+    ie,
     {
       style: {
         transform: `rotate(${r ? 180 : 0}deg)`
@@ -192,7 +194,7 @@ function E({
   ),
   ...f
 }) {
-  const r = G(a), { openedIds: u, open: v, close: l, mode: c, activeTextColor: t } = B(), N = (u == null ? void 0 : u.includes(r)) ?? !1, _ = c === "inline", W = F(
+  const r = G(a), { openedIds: u, open: v, close: i, mode: c, activeTextColor: t } = B(), N = (u == null ? void 0 : u.includes(r)) ?? !1, _ = c === "inline", W = F(
     "navmenu-sub",
     "navmenu-item",
     { "navmenu-item--panel": g === "panel" },
@@ -200,10 +202,10 @@ function E({
     f.className
   ), z = {
     onClick: () => {
-      u != null && u.includes(r) ? l == null || l(r) : v == null || v(r);
+      u != null && u.includes(r) ? i == null || i(r) : v == null || v(r);
     }
   }, $ = _ ? { onClick: (w) => w.stopPropagation() } : {}, p = /* @__PURE__ */ M(
-    Ne,
+    pe,
     {
       ...f,
       className: W,
@@ -217,11 +219,11 @@ function E({
           y && /* @__PURE__ */ o("span", { className: "navmenu-item__desc", children: y })
         ] }),
         s && /* @__PURE__ */ o("span", { className: "navmenu-sub__expand-icon", children: typeof s == "function" ? s({ isOpen: N }) : s }),
-        /* @__PURE__ */ o(be, { inline: _, ...$, children: typeof I == "function" ? I({ isOpen: N }) : /* @__PURE__ */ o(_e, { className: "navmenu-sub__list", children: D(I) }) })
+        /* @__PURE__ */ o(_e, { inline: _, ...$, children: typeof I == "function" ? I({ isOpen: N }) : /* @__PURE__ */ o(he, { className: "navmenu-sub__list", children: D(I) }) })
       ]
     }
   );
-  return _ ? p : /* @__PURE__ */ o(ae, { onClickAway: () => l == null ? void 0 : l(r), children: p });
+  return _ ? p : /* @__PURE__ */ o(oe, { onClickAway: () => i == null ? void 0 : i(r), children: p });
 }
 E.displayName = "NavMenu.Sub";
 J.Item = k;

package/lib/NavMenu/products.js

@@ -3,30 +3,30 @@ import { useRef as u } from "react";
 import { Link as t } from "react-router-dom";
 import { useMemoizedFn as w, useCreation as k } from "ahooks";
 import { Box as g, useTheme as h, Grid as l } from "@mui/material";
-import f from "./sub-item-group.js";
-import { Item as S } from "./nav-menu.js";
-import { styled as v } from "../Theme/index.js";
-import { useNavMenuContext as y } from "./nav-menu-context.js";
-import { translate as $ } from "../Locale/util.js";
-import { useLocaleContext as _ } from "../Locale/context.js";
-import A from "./images/ai-kit.svg.js";
-import I from "./images/nft-studio.svg.js";
-import N from "./images/creator-studio.svg.js";
-import x from "./images/aigne.svg.js";
-import C from "./images/arcsphere.svg.js";
-import D from "./images/aistro.svg.js";
-import K from "./images/blocklet-launcher.svg.js";
-import B from "./images/blocklet-store.svg.js";
-import W from "./images/web3-kit.svg.js";
-import F from "./images/blocklet-framework.svg.js";
-import G from "./images/abt-network.svg.js";
-import L from "./images/blocklet-server.svg.js";
-import M from "./images/OCAP.svg.js";
-import d from "./images/did.svg.js";
-import P from "./images/did-wallet.svg.js";
-import T from "./images/did-name-service.svg.js";
-import z from "./images/vc.svg.js";
-import O from "./images/did-connect.svg.js";
+import f from "./sub-item-group";
+import { Item as S } from "./nav-menu";
+import { styled as v } from "../Theme";
+import { useNavMenuContext as y } from "./nav-menu-context";
+import { translate as $ } from "../Locale/util";
+import { useLocaleContext as A } from "../Locale/context";
+import _ from "./images/ai-kit.svg";
+import I from "./images/nft-studio.svg";
+import C from "./images/creator-studio.svg";
+import N from "./images/aigne.svg";
+import x from "./images/arcsphere.svg";
+import D from "./images/aistro.svg";
+import K from "./images/blocklet-launcher.svg";
+import B from "./images/blocklet-store.svg";
+import W from "./images/web3-kit.svg";
+import F from "./images/blocklet-framework.svg";
+import G from "./images/abt-network.svg";
+import P from "./images/blocklet-server.svg";
+import L from "./images/OCAP.svg";
+import d from "./images/did.svg";
+import M from "./images/did-wallet.svg";
+import T from "./images/did-name-service.svg";
+import z from "./images/vc.svg";
+import O from "./images/did-connect.svg";
 import V from "./images/payment-kit.png";
 const E = {
   en: {
@@ -193,8 +193,8 @@ const E = {
     margin-top: 0px;
   }
 `;
-function ye({ className: c, isOpen: j, ...s }) {
-  const { mode: a } = y(), { palette: p } = h(), m = u(null), { locale: o = "en" } = _() || {}, r = w((i, n = {}) => $(E, i, o, "en", n)), b = k(() => [
+function ye({ className: c, isOpen: j = void 0, ...s }) {
+  const { mode: a } = y(), { palette: p } = h(), m = u(null), { locale: o = "en" } = A() || {}, r = w((i, n = {}) => $(E, i, o, "en", n)), b = k(() => [
     {
       type: "Group",
       label: r("groups.applications"),
@@ -215,7 +215,7 @@ function ye({ className: c, isOpen: j, ...s }) {
             }
           ),
           description: r("products.creatorStudio.description"),
-          icon: /* @__PURE__ */ e(N, {})
+          icon: /* @__PURE__ */ e(C, {})
         },
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.aistro.io/${o}`, target: "_blank", rel: "noreferrer noopener", children: "Aistro" }),
@@ -225,12 +225,12 @@ function ye({ className: c, isOpen: j, ...s }) {
         {
           label: /* @__PURE__ */ e(t, { to: "https://www.aigne.io/", target: "_blank", rel: "noreferrer noopener", children: "AIGNE" }),
           description: r("products.aigne.description"),
-          icon: /* @__PURE__ */ e(x, { style: { filter: p.mode === "dark" ? "invert(1)" : "none" } })
+          icon: /* @__PURE__ */ e(N, { style: { filter: p.mode === "dark" ? "invert(1)" : "none" } })
         },
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.arcsphere.io/${o}`, target: "_blank", rel: "noreferrer noopener", children: "ArcSphere" }),
           description: r("products.arcsphere.description"),
-          icon: /* @__PURE__ */ e(C, {})
+          icon: /* @__PURE__ */ e(x, {})
         }
       ]
     },
@@ -246,7 +246,7 @@ function ye({ className: c, isOpen: j, ...s }) {
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.aikit.rocks/${o}`, target: "_blank", rel: "noreferrer noopener", children: "AI Kit" }),
           description: r("products.aiKit.description"),
-          icon: /* @__PURE__ */ e(A, {})
+          icon: /* @__PURE__ */ e(_, {})
         },
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.blocklet.io/${o}/payment-kit`, target: "_blank", rel: "noreferrer noopener", children: "Payment Kit" }),
@@ -295,7 +295,7 @@ function ye({ className: c, isOpen: j, ...s }) {
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.blocklet.io/${o}/blocklet-server`, target: "_blank", rel: "noreferrer noopener", children: "Blocklet Server" }),
           description: r("products.blockletServer.description"),
-          icon: /* @__PURE__ */ e(L, {})
+          icon: /* @__PURE__ */ e(P, {})
         },
         {
           label: /* @__PURE__ */ e(
@@ -308,7 +308,7 @@ function ye({ className: c, isOpen: j, ...s }) {
             }
           ),
           description: r("products.ocap.description"),
-          icon: /* @__PURE__ */ e(M, {})
+          icon: /* @__PURE__ */ e(L, {})
         }
       ]
     },
@@ -332,7 +332,7 @@ function ye({ className: c, isOpen: j, ...s }) {
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.didwallet.io/${o}`, target: "_blank", rel: "noreferrer noopener", children: "DID Wallet" }),
           description: r("products.didWallet.description"),
-          icon: /* @__PURE__ */ e(P, {})
+          icon: /* @__PURE__ */ e(M, {})
         },
         {
           label: /* @__PURE__ */ e(t, { to: `https://www.didnames.io/${o}`, target: "_blank", rel: "noreferrer noopener", children: "DID Names" }),

package/lib/NavMenu/style.js

@@ -1,4 +1,4 @@
-import { styled as i } from "../Theme/index.js";
+import { styled as i } from "../Theme";
 const o = i("nav", {
   shouldForwardProp: (n) => n !== "$bgColor" && n !== "$textColor"
 })(({ $textColor: n, theme: t }) => ({

package/lib/NavMenu/sub-item-group.js

@@ -1,6 +1,6 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { Box as r } from "@mui/material";
-import { styled as l } from "../Theme/index.js";
+import { styled as l } from "../Theme";
 const u = l(r)`
   padding: 16px 24px;
   border-radius: 8px;