@blocklet/list 0.15.15 → 0.15.16

package/lib/index.es.js

@@ -1,20 +1,20 @@
 import { jsx as t, jsxs as h, Fragment as M } from "react/jsx-runtime";
-import { styled as K, useTheme as xe } from "@arcblock/ux/lib/Theme";
+import { styled as X, useTheme as ye } from "@arcblock/ux/lib/Theme";
 import Je from "@mui/material/styles/createTheme";
 import et from "@mui/material/styles/ThemeProvider";
 import tt from "lodash/merge";
-import { ErrorFallback as ye } from "@arcblock/ux/lib/ErrorBoundary";
-import y from "@mui/material/Box";
-import A from "@mui/material/Stack";
+import { ErrorFallback as xe } from "@arcblock/ux/lib/ErrorBoundary";
+import x from "@mui/material/Box";
+import F from "@mui/material/Stack";
 import { ErrorBoundary as rt } from "react-error-boundary";
 import ot from "@iconify-icons/tabler/compass";
-import { Icon as ee } from "@iconify/react";
+import { Icon as K } from "@iconify/react";
 import we from "@mui/icons-material/Close";
-import w from "@mui/material/Typography";
-import { createContext as Le, useState as P, useMemo as H, useContext as Oe, useCallback as me, useEffect as U, forwardRef as nt, useRef as fe, memo as it } from "react";
+import b from "@mui/material/Typography";
+import { createContext as Le, useState as E, useMemo as j, useContext as Oe, useCallback as me, useEffect as H, forwardRef as nt, useRef as fe, memo as it } from "react";
 import { createAxios as _e } from "@blocklet/js-sdk";
 import lt from "lodash/orderBy";
-import { useRequest as re, useDebounceFn as ze, useInfiniteScroll as at, useReactive as st } from "ahooks";
+import { useRequest as re, useDebounceFn as Me, useInfiniteScroll as at, useReactive as st } from "ahooks";
 import le from "lodash/omitBy";
 import "color";
 import "lodash/cloneDeep";
@@ -22,14 +22,14 @@ import { parseURL as ct, parseQuery as dt, parseFilename as ut, stringifyParsedU
 import Ie from "flat";
 import oe from "@mui/material/Button";
 import pt from "@mui/material/styles/useTheme";
-import j from "@mui/material/useMediaQuery";
+import $ from "@mui/material/useMediaQuery";
 import mt from "@mui/material/Drawer";
-import Me from "@mui/material/Checkbox";
+import ze from "@mui/material/Checkbox";
 import Ne from "@mui/material/FormControlLabel";
 import ft from "@mui/icons-material/Check";
 import gt from "@mui/icons-material/KeyboardArrowDown";
-import xt from "@mui/material/ClickAwayListener";
-import yt from "@mui/material/Grow";
+import yt from "@mui/material/ClickAwayListener";
+import xt from "@mui/material/Grow";
 import De from "@mui/material/MenuItem";
 import We from "@mui/material/MenuList";
 import wt from "@mui/material/Paper";
@@ -41,7 +41,7 @@ import $e from "@arcblock/ux/lib/Avatar";
 import Ct from "@iconify-icons/tabler/cloud-download";
 import St from "@mui/icons-material/ChevronLeft";
 import It from "@mui/icons-material/ChevronRight";
-import _ from "@mui/material/Skeleton";
+import O from "@mui/material/Skeleton";
 import Bt from "react-image-gallery";
 import "react-image-gallery/styles/css/image-gallery.css";
 import Be from "@mui/material/Grid";
@@ -49,7 +49,7 @@ import Rt from "react-infinite-scroll-hook";
 import Tt from "@iconify-icons/tabler/square";
 import Pt from "@iconify-icons/tabler/square-check-filled";
 import Re from "@mui/material/Chip";
-import J from "@mui/icons-material/Search";
+import ee from "@mui/icons-material/Search";
 import At from "@mui/material/Autocomplete";
 import Et from "@mui/material/Dialog";
 import je from "@mui/material/OutlinedInput";
@@ -58,8 +58,8 @@ import { useHotkeys as Lt } from "react-hotkeys-hook";
 import Te from "@mui/material/InputAdornment";
 import Ot from "@arcblock/ux/lib/Empty";
 import _t from "json-stable-stringify";
-import zt from "@mui/icons-material/Menu";
-import { Card as Mt, Box as ae, Skeleton as O } from "@mui/material";
+import Mt from "@mui/icons-material/Menu";
+import { Card as zt, Box as ae, Skeleton as L } from "@mui/material";
 import Nt from "@arcblock/ux/lib/Img";
 const He = Le({
   open: !1,
@@ -67,15 +67,15 @@ const He = Le({
   }
 });
 function Dt({ children: e }) {
-  const [r, o] = P(!1), n = (a) => {
-    o(a ?? !a);
-  }, l = H(() => ({ open: r, toggleOpen: n }), [r]);
+  const [r, o] = E(!1), n = (s) => {
+    o(s ?? !s);
+  }, l = j(() => ({ open: r, toggleOpen: n }), [r]);
   return /* @__PURE__ */ t(He.Provider, { value: l, children: e });
 }
 function ke() {
   return Oe(He);
 }
-const T = {
+const P = {
   nameAsc: "title",
   nameDesc: "title",
   popularity: "stats.downloads",
@@ -91,50 +91,59 @@ const T = {
   cacheSize: 100
 }, Wt = (e) => re(
   async () => {
-    const { data: r } = await e.get(T.categoriesPath);
+    const { data: r } = await e.get(P.categoriesPath);
     return Array.isArray(r) ? r : [];
   },
   { manual: !0 }
 );
 function $t(e, r) {
-  const o = { sortBy: "popularity", sortDirection: "desc", showResources: "true", ...e }, {
+  const o = {
+    sortBy: "popularity",
+    sortDirection: "desc",
+    showResources: "true",
+    ...e,
+    menu: void 0
+  }, {
     onFilterChange: n,
     onSearchSelect: l = (i) => {
       r.onFilterChange({ ...o, keyword: i.title });
     },
-    emptyCategory: a
+    emptyCategory: s
   } = r;
-  !o.category && !a && (o.category = "All");
-  const c = (i) => {
-    const m = { ...o, ...i };
-    n(le(m, (d) => d === "" || d === void 0));
+  !o.category && !s && (o.category = "All");
+  const a = (i) => {
+    const u = { ...o, ...i };
+    n(le(u, (d) => d === "" || d === void 0));
   };
   return {
     filters: e,
     cleanFilter: (i) => {
-      const m = i ? le(o, (d, g) => i.includes(g)) : {};
-      n(le(m, (d) => d === "" || d === void 0));
+      const u = i ? le(o, (d, y) => i.includes(y)) : {};
+      n(le(u, (d) => d === "" || d === void 0));
     },
-    handleSort: (i, m) => {
-      c({ sortBy: i, sortDirection: m || i === "nameAsc" ? "asc" : "desc" });
+    handleActiveMenu: (i) => {
+      i !== e.menu && n({ menu: i });
+    },
+    handleSort: (i, u) => {
+      a({ sortBy: i, sortDirection: u || i === "nameAsc" ? "asc" : "desc" });
     },
     handleKeyword: (i) => {
-      c({ category: void 0, keyword: i || void 0 });
+      a({ category: void 0, keyword: i || void 0 });
     },
     handlePrice: (i) => {
-      c({ price: i === e.price ? void 0 : i });
+      a({ price: i === e.price ? void 0 : i });
     },
     handleCategory: (i) => {
-      c({ category: i === e.category ? "" : i });
+      a({ category: i === e.category ? "" : i });
     },
     handleDeveloper: (i) => {
-      c({ owner: i || void 0 });
+      a({ owner: i || void 0 });
     },
     handlePage: (i) => {
-      c({ currentPage: i });
+      a({ currentPage: i });
     },
     handleSwitchShowResources: (i) => {
-      c({ showResources: i });
+      a({ showResources: i });
     },
     handleSearchSelect: (i) => {
       l(i);
@@ -155,16 +164,16 @@ const jt = (e, r, o) => e && r || !o, Ue = (e) => [
   //   value: 'rating',
   // },
 ], Ve = (e, r, o) => {
-  var d, g;
+  var d, y;
   const n = ct(e), l = dt(n.search);
   if ((d = ut(e, { strict: !0 })) == null ? void 0 : d.endsWith(".gif"))
     return l.imageFilter ? ht({ ...n, search: "" }) : e;
   if (l.imageFilter)
     return e;
-  const c = o || ((g = window.blocklet) == null ? void 0 : g.version), { w: i, h: m } = typeof r == "object" ? { w: r.w, h: r.h } : { w: r, h: r };
+  const a = o || ((y = window.blocklet) == null ? void 0 : y.version), { w: i, h: u } = typeof r == "object" ? { w: r.w, h: r.h } : { w: r, h: r };
   return be(e, {
-    ...i || m ? { imageFilter: "resize", w: i, h: m } : {},
-    v: c
+    ...i || u ? { imageFilter: "resize", w: i, h: u } : {},
+    v: a
   });
 }, Ht = (e) => [
   { name: e("blocklet.free"), value: "free" },
@@ -318,6 +327,8 @@ const jt = (e, r, o) => e && r || !o, Ue = (e) => [
     filters: {},
     cleanFilter: () => {
     },
+    handleActiveMenu: () => {
+    },
     handleSort: () => {
     },
     handleKeyword: () => {
@@ -343,77 +354,77 @@ function Yt(e) {
     serverVersion: n = "",
     onFilterChange: l = () => {
     },
-    minItemWidth: a = 350,
-    queryFilter: c = !0,
+    minItemWidth: s = 350,
+    queryFilter: a = !0,
     layout: i = {},
-    wrapChildren: m = (R) => R,
-    extraFilter: d = (R) => R,
-    baseSearch: g = !1,
-    fetchCategoryDelay: p = 0,
+    wrapChildren: u = (I) => I,
+    extraFilter: d = (I) => I,
+    baseSearch: y = !1,
+    fetchCategoryDelay: m = 0,
     showResourcesSwitch: f = !1,
     showCategory: k = !0,
-    tagFilters: S = [],
+    tagFilters: g = [],
     children: B,
-    storeVersion: v,
-    onSearchSelect: u = () => {
+    storeVersion: S,
+    onSearchSelect: p = () => {
     },
-    endpoint: C,
-    blockletRender: x
-  } = e, E = qe(n, v), F = H(() => _e({ baseURL: C, headers: E }), [C]), L = $t(o, { onFilterChange: l, emptyCategory: !i.showExplore, onSearchSelect: u }), [N, V] = P(""), {
-    data: q = [],
-    error: ie,
-    loading: X,
-    run: Q
-  } = Wt(F), $ = H(() => {
-    const R = lt(q, [(W) => W.name], ["asc"]), z = R.findIndex((W) => W.name === "All" || W.locales.en === "All");
-    return z > -1 ? [{ ...R[z], _id: "All" }, ...R.slice(0, z), ...R.slice(z + 1)] : R;
-  }, [q]), G = me(Xt(r), [r]), s = H(() => Ut($, r), [$, r]), b = Ht(G), D = {
-    search: L,
-    errors: { fetchCategoriesError: ie },
+    endpoint: v,
+    blockletRender: w
+  } = e, A = qe(n, S), T = j(() => _e({ baseURL: v, headers: A }), [v]), z = $t(o, { onFilterChange: l, emptyCategory: !i.showExplore, onSearchSelect: p }), [U, N] = E(""), {
+    data: D = [],
+    error: Q,
+    loading: ie,
+    run: V
+  } = Wt(T), q = j(() => {
+    const I = lt(D, [(W) => W.name], ["asc"]), _ = I.findIndex((W) => W.name === "All" || W.locales.en === "All");
+    return _ > -1 ? [{ ...I[_], _id: "All" }, ...I.slice(0, _), ...I.slice(_ + 1)] : I;
+  }, [D]), G = me(Xt(r), [r]), Y = j(() => Ut(q, r), [q, r]), c = Ht(G), C = {
+    search: z,
+    errors: { fetchCategoriesError: Q },
     loadings: {
-      fetchCategoriesLoading: X
+      fetchCategoriesLoading: ie
     },
     extraFilter: d,
-    endpoint: C,
-    queryFilter: c,
+    endpoint: v,
+    queryFilter: a,
     layout: {
       showExplore: i.showExplore ?? !1,
       showCategory: i.showCategory ?? !0,
       showTitle: i.showTitle ?? !0,
       showSearch: i.showSearch ?? !0
     },
-    minItemWidth: a,
-    wrapChildren: m,
+    minItemWidth: s,
+    wrapChildren: u,
     t: G,
-    storeVersion: v,
+    storeVersion: S,
     serverVersion: n,
-    selectedCategory: L.filters.category || (i.showExplore ? "" : "All"),
-    categoryList: $,
-    blockletRender: x,
+    selectedCategory: z.filters.category || (i.showExplore ? "" : "All"),
+    categoryList: q,
+    blockletRender: w,
     locale: r,
-    categoryOptions: s,
-    priceOptions: b,
-    storeApi: F,
-    baseSearch: g,
+    categoryOptions: Y,
+    priceOptions: c,
+    storeApi: T,
+    baseSearch: y,
     showResourcesSwitch: f,
     showCategory: k,
-    tagFilters: S,
+    tagFilters: g,
     onFilterChange: l,
-    getCategoryLocale: (R) => {
-      if (!R) return null;
-      const z = q.find((W) => W._id === R || W.locales.en === "All");
-      return z ? z.locales[r] || z.locales.en : null;
+    getCategoryLocale: (I) => {
+      if (!I) return null;
+      const _ = D.find((W) => W._id === I || W.locales.en === "All");
+      return _ ? _.locales[r] || _.locales.en : null;
     },
     get developerName() {
-      return N;
+      return U;
     },
-    updateDeveloperName: V
+    updateDeveloperName: N
   };
-  return U(() => {
-    setTimeout(Q, p || 0);
-  }, [C, Q, p]), /* @__PURE__ */ t(Qt, { value: D, children: B });
+  return H(() => {
+    setTimeout(V, m || 0);
+  }, [v, V, m]), /* @__PURE__ */ t(Qt, { value: C, children: B });
 }
-function I() {
+function R() {
   const e = Oe(Ke);
   return e || Ge;
 }
@@ -447,7 +458,7 @@ function Xe({
     }
   );
 }
-function Y(e, r) {
+function Z(e, r) {
   return e === void 0 ? r : e;
 }
 function ve({
@@ -456,13 +467,13 @@ function ve({
   md: o,
   lg: n,
   xl: l,
-  exact: a
+  exact: s
 }) {
-  const c = pt(), i = j(c.breakpoints.down("sm")), m = j(c.breakpoints.between("sm", "md")), d = j(c.breakpoints.between("md", "lg")), g = j(c.breakpoints.between("lg", "xl"));
-  if (a)
-    return i ? e || null : m ? r || null : d ? o || null : g ? n || null : l || null;
-  let p = e;
-  return i || (p = Y(r, p), m) || (p = Y(o, p), d) || (p = Y(n, p), g) ? p : Y(l, p);
+  const a = pt(), i = $(a.breakpoints.down("sm")), u = $(a.breakpoints.between("sm", "md")), d = $(a.breakpoints.between("md", "lg")), y = $(a.breakpoints.between("lg", "xl"));
+  if (s)
+    return i ? e || null : u ? r || null : d ? o || null : y ? n || null : l || null;
+  let m = e;
+  return i || (m = Z(r, m), u) || (m = Z(o, m), d) || (m = Z(n, m), y) ? m : Z(l, m);
 }
 function Zt({ children: e }) {
   const { open: r, toggleOpen: o } = ke();
@@ -470,7 +481,7 @@ function Zt({ children: e }) {
     ve,
     {
       xs: /* @__PURE__ */ t(mt, { open: r, onClose: () => o(!1), children: e }),
-      md: /* @__PURE__ */ t(y, { children: e })
+      md: /* @__PURE__ */ t(x, { children: e })
     }
   );
 }
@@ -486,27 +497,27 @@ const Jt = nt(({ loading: e, disabled: r, ...o }, n) => /* @__PURE__ */ t(
   }
 ));
 function Qe({ value: e, options: r, onChange: o, placeholder: n, ...l }) {
-  var v;
-  const a = fe(null), c = xe(), [i, m] = P(!1), [d, g] = P(e !== null ? e : ""), p = j(c.breakpoints.down("sm"));
-  U(() => {
-    g(e !== null ? e : "");
+  var S;
+  const s = fe(null), a = ye(), [i, u] = E(!1), [d, y] = E(e !== null ? e : ""), m = $(a.breakpoints.down("sm"));
+  H(() => {
+    y(e !== null ? e : "");
   }, [e]);
   const f = me(() => {
-    m(!1);
+    u(!1);
   }, []), k = me(() => {
-    m(!0);
+    u(!0);
   }, []);
-  function S(u) {
-    g(u.value), o(u.value), p && f();
+  function g(p) {
+    y(p.value), o(p.value), m && f();
   }
-  function B(u) {
-    return u === d;
+  function B(p) {
+    return p === d;
   }
   return /* @__PURE__ */ h(M, { children: [
     /* @__PURE__ */ h(
       er,
       {
-        ref: a,
+        ref: s,
         onClick: k,
         variant: "outlined",
         size: "medium",
@@ -514,30 +525,30 @@ function Qe({ value: e, options: r, onChange: o, placeholder: n, ...l }) {
         sx: { minWidth: "auto", color: "text.primary", borderRadius: "8px" },
         ...l,
         children: [
-          ((v = r.find((u) => u.value === d)) == null ? void 0 : v.name) || n,
+          ((S = r.find((p) => p.value === d)) == null ? void 0 : S.name) || n,
           /* @__PURE__ */ t(kt, { className: "my-select__arrowdown", component: gt, sx: { width: 18, height: 18 } })
         ]
       }
     ),
-    /* @__PURE__ */ t(bt, { open: i, anchorEl: a.current, transition: !0, sx: { zIndex: "9999" }, children: ({ TransitionProps: u, placement: C }) => /* @__PURE__ */ t(
-      yt,
+    /* @__PURE__ */ t(bt, { open: i, anchorEl: s.current, transition: !0, sx: { zIndex: "9999" }, children: ({ TransitionProps: p, placement: v }) => /* @__PURE__ */ t(
+      xt,
       {
-        ...u,
-        style: { transformOrigin: C === "bottom" ? "center top" : "center bottom" },
-        children: /* @__PURE__ */ t(wt, { children: /* @__PURE__ */ t(xt, { onClickAway: f, children: /* @__PURE__ */ t(tr, { autoFocusItem: i, onMouseEnter: k, onMouseLeave: f, children: r.map((x) => /* @__PURE__ */ h(De, { onClick: () => S(x), sx: { fontSize: 14 }, children: [
+        ...p,
+        style: { transformOrigin: v === "bottom" ? "center top" : "center bottom" },
+        children: /* @__PURE__ */ t(wt, { children: /* @__PURE__ */ t(yt, { onClickAway: f, children: /* @__PURE__ */ t(tr, { autoFocusItem: i, onMouseEnter: k, onMouseLeave: f, children: r.map((w) => /* @__PURE__ */ h(De, { onClick: () => g(w), sx: { fontSize: 14 }, children: [
           /* @__PURE__ */ t(
             ft,
             {
-              sx: { mr: 1, fontSize: 16, visibility: B(x.value) ? "visible" : "hidden" }
+              sx: { mr: 1, fontSize: 16, visibility: B(w.value) ? "visible" : "hidden" }
             }
           ),
-          x.name
-        ] }, x.value)) }) }) })
+          w.name
+        ] }, w.value)) }) }) })
       }
     ) })
   ] });
 }
-const er = K(Jt)`
+const er = X(Jt)`
   border: 1px solid #f0f0f0;
   padding: 6px 8px 6px 12px;
   font-weight: ${(e) => e.theme.typography.fontWeightRegular};
@@ -565,7 +576,7 @@ const er = K(Jt)`
       margin-right: 3px;
     }
   }
-`, tr = K(We)`
+`, tr = X(We)`
   .my-select__option__icon {
     color: transparent;
     font-size: 14px;
@@ -583,9 +594,9 @@ const er = K(Jt)`
   }
 `;
 function Ye() {
-  const { search: e, t: r } = I(), { filters: o, handleSort: n, handlePrice: l } = e, a = Ue(r);
+  const { search: e, t: r } = R(), { filters: o, handleSort: n, handlePrice: l } = e, s = Ue(r);
   return /* @__PURE__ */ h(
-    A,
+    F,
     {
       direction: { xs: "row", md: "column" },
       alignItems: { xs: "center", md: "flex-start" },
@@ -597,12 +608,12 @@ function Ye() {
           Ne,
           {
             control: /* @__PURE__ */ t(
-              Me,
+              ze,
               {
                 checked: o.price === "free",
                 size: "small",
                 sx: { "& .MuiSvgIcon-fontSizeSmall": { fontSize: 16, color: "text.lighter" } },
-                onChange: (c) => l(c.target.checked ? "free" : "")
+                onChange: (a) => l(a.target.checked ? "free" : "")
               }
             ),
             label: r("blocklet.free")
@@ -611,9 +622,9 @@ function Ye() {
         /* @__PURE__ */ t(
           Qe,
           {
-            value: o.sortBy || a[0].value,
-            options: a,
-            onChange: (c) => n(c),
+            value: o.sortBy || s[0].value,
+            options: s,
+            onChange: (a) => n(a),
             placeholder: r("sort.sort")
           }
         )
@@ -621,18 +632,18 @@ function Ye() {
     }
   );
 }
-function rr() {
-  const { selectedCategory: e, search: r, t: o, categoryOptions: n, loadings: l, layout: a, baseSearch: c } = I(), { filters: i, handleCategory: m, cleanFilter: d } = r, { toggleOpen: g } = ke();
-  U(() => {
-    g(!1);
-  }, [Object.values(i).join("")]);
-  const p = jt(c, a.showSearch, i.keyword);
+function rr({ menus: e }) {
+  const { selectedCategory: r, search: o, t: n, categoryOptions: l, loadings: s, layout: a, baseSearch: i } = R(), { filters: u, handleActiveMenu: d, handleCategory: y, cleanFilter: m } = o, { toggleOpen: f } = ke();
+  H(() => {
+    f(!1);
+  }, [Object.values(u).join("")]);
+  const k = jt(i, a.showSearch, u.keyword);
   return a.showCategory ? /* @__PURE__ */ h(Zt, { children: [
     /* @__PURE__ */ t(
       ve,
       {
         xs: /* @__PURE__ */ h(
-          A,
+          F,
           {
             direction: "row",
             justifyContent: "space-between",
@@ -643,8 +654,8 @@ function rr() {
             borderBottom: 1,
             borderColor: "divider",
             children: [
-              /* @__PURE__ */ t(Xe, { onClick: () => g(!1), children: /* @__PURE__ */ t(we, {}) }),
-              /* @__PURE__ */ t(w, { flex: 1, variant: "body1", fontWeight: "fontWeightMedium", children: o("common.category") })
+              /* @__PURE__ */ t(Xe, { onClick: () => f(!1), children: /* @__PURE__ */ t(we, {}) }),
+              /* @__PURE__ */ t(b, { flex: 1, variant: "body1", fontWeight: "fontWeightMedium", children: n("common.category") })
             ]
           }
         ),
@@ -652,45 +663,64 @@ function rr() {
       }
     ),
     /* @__PURE__ */ t(
-      A,
+      F,
       {
-        visibility: l.fetchCategoriesLoading ? "hidden" : "visible",
+        visibility: s.fetchCategoriesLoading ? "hidden" : "visible",
         width: { xs: 268, md: 200 },
         boxSizing: "content-box",
         p: { xs: 2, md: 0 },
         pr: { md: 6 },
-        children: p ? /* @__PURE__ */ h(M, { children: [
-          a.showExplore && /* @__PURE__ */ h(y, { display: "flex", alignItems: "center", gap: 1, mb: 3, pb: 3, borderBottom: 1, borderColor: "divider", children: [
-            /* @__PURE__ */ t(ee, { icon: ot }),
-            /* @__PURE__ */ t(
-              w,
-              {
-                variant: "body1",
-                color: e ? "text.lighter" : "text.primary",
-                fontWeight: e ? void 0 : "fontWeightMedium",
-                sx: { cursor: "pointer" },
-                onClick: () => {
-                  g(!1), d();
-                },
-                children: o("explore.title")
-              }
-            )
+        children: k ? /* @__PURE__ */ h(M, { children: [
+          a.showExplore && /* @__PURE__ */ h(x, { mb: 3, pb: 3, borderBottom: 1, borderColor: "divider", children: [
+            /* @__PURE__ */ h(x, { display: "flex", alignItems: "center", gap: 1, children: [
+              /* @__PURE__ */ t(K, { icon: ot, width: 20, height: 20 }),
+              /* @__PURE__ */ t(
+                b,
+                {
+                  variant: "body1",
+                  color: !r && !u.menu ? "text.primary" : "text.lighter",
+                  fontWeight: !r && !u.menu ? "fontWeightMedium" : void 0,
+                  sx: { cursor: "pointer" },
+                  onClick: () => {
+                    f(!1), m();
+                  },
+                  children: n("explore.title")
+                }
+              )
+            ] }),
+            e == null ? void 0 : e.map((g) => /* @__PURE__ */ h(x, { display: "flex", alignItems: "center", mt: 2, gap: 1, children: [
+              typeof g.icon == "string" ? /* @__PURE__ */ t(K, { icon: g.icon, width: 20, height: 20 }) : g.icon,
+              /* @__PURE__ */ t(
+                b,
+                {
+                  variant: "body1",
+                  color: u.menu === g.key ? "text.primary" : "text.lighter",
+                  fontWeight: u.menu === g.key ? "fontWeightMedium" : void 0,
+                  sx: { cursor: "pointer" },
+                  onClick: () => {
+                    var B;
+                    f(!1), d(g.key), (B = g.onClick) == null || B.call(g);
+                  },
+                  children: g.title
+                }
+              )
+            ] }, g.key))
           ] }),
-          !!n.length && /* @__PURE__ */ t(A, { gap: 2, children: n.map((f) => /* @__PURE__ */ t(
-            w,
+          !!l.length && /* @__PURE__ */ t(F, { gap: 2, children: l.map((g) => /* @__PURE__ */ t(
+            b,
             {
               variant: "body1",
-              title: f.name,
+              title: g.name,
               sx: { cursor: "pointer" },
               "data-cy": "filter",
-              color: e === f.value ? "text.primary" : "text.lighter",
+              color: r === g.value ? "text.primary" : "text.lighter",
               textTransform: "capitalize",
               onClick: () => {
-                e === f.value ? d() : m(f.value), g(!1);
+                r === g.value ? m() : y(g.value), f(!1);
               },
-              children: f.name
+              children: g.name
             },
-            f.value
+            g.value
           )) })
         ] }) : /* @__PURE__ */ t(Ye, {})
       }
@@ -698,23 +728,23 @@ function rr() {
   ] }) : null;
 }
 function Ce() {
-  const { endpoint: e, serverVersion: r, storeVersion: o } = I(), n = qe(r, o), l = H(() => _e({
+  const { endpoint: e, serverVersion: r, storeVersion: o } = R(), n = qe(r, o), l = j(() => _e({
     baseURL: e,
     headers: n
   }), [e]);
   return {
-    get: async (a) => {
-      const { data: c } = await l.get(a);
-      return c;
+    get: async (s) => {
+      const { data: a } = await l.get(s);
+      return a;
     },
-    post: async (a, c) => {
-      const { data: i } = await l.post(a, c);
+    post: async (s, a) => {
+      const { data: i } = await l.post(s, a);
       return i;
     }
   };
 }
 const Ze = it(function(r) {
-  return /* @__PURE__ */ t(y, { height: 60, display: "flex", alignItems: "center", justifyContent: "center", ...r, children: /* @__PURE__ */ t(ne, {}) });
+  return /* @__PURE__ */ t(x, { height: 60, display: "flex", alignItems: "center", justifyContent: "center", ...r, children: /* @__PURE__ */ t(ne, {}) });
 });
 function Pe({
   icon: e,
@@ -722,10 +752,10 @@ function Pe({
   maxWidth: o = 100,
   title: n
 }) {
-  return (r === 0 || r) && /* @__PURE__ */ h(A, { direction: "row", alignItems: "center", gap: 1, sx: { maxWidth: o, overflow: "hidden" }, children: [
+  return (r === 0 || r) && /* @__PURE__ */ h(F, { direction: "row", alignItems: "center", gap: 1, sx: { maxWidth: o, overflow: "hidden" }, children: [
     e,
     /* @__PURE__ */ t(
-      w,
+      b,
       {
         flex: 1,
         variant: "body2",
@@ -738,16 +768,16 @@ function Pe({
 }
 const or = 16 / 9, ce = 292, ge = 189, te = 336;
 function nr() {
-  var B, v;
-  const { t: e, search: r } = I(), { get: o } = Ce(), n = xe(), l = j(n.breakpoints.down("md")), a = ((v = (B = window.blocklet) == null ? void 0 : B.preferences) == null ? void 0 : v.homeBanner) || [], {
-    data: c = [],
+  var B, S;
+  const { t: e, search: r } = R(), { get: o } = Ce(), n = ye(), l = $(n.breakpoints.down("md")), s = ((S = (B = window.blocklet) == null ? void 0 : B.preferences) == null ? void 0 : S.homeBanner) || [], {
+    data: a = [],
     error: i,
-    loading: m
+    loading: u
   } = re(async () => {
-    const u = await o(
-      be(T.blockletsPath, { didList: a.map((C) => C.did).join(",") })
+    const p = await o(
+      be(P.blockletsPath, { didList: s.map((v) => v.did).join(",") })
     );
-    return u != null && u.dataList ? a.map((C) => u.dataList.find((x) => x.did === C.did)) : [];
+    return p != null && p.dataList ? s.map((v) => p.dataList.find((w) => w.did === v.did)) : [];
   });
   i && console.error("Get Banner Blocklets error:", i);
   const d = {
@@ -758,10 +788,10 @@ function nr() {
     cursor: "pointer",
     color: "text.lighter"
   };
-  return !i && a.length > 0 ? /* @__PURE__ */ h(M, { children: [
-    /* @__PURE__ */ t(w, { component: "h2", variant: "h2", mt: { xs: 2, md: 0 }, mb: 3, children: e("explore.title") }),
+  return !i && s.length > 0 ? /* @__PURE__ */ h(M, { children: [
+    /* @__PURE__ */ t(b, { component: "h2", variant: "h2", mt: { xs: 2, md: 0 }, mb: 3, children: e("explore.title") }),
     /* @__PURE__ */ t(
-      y,
+      x,
       {
         height: { xs: "auto", md: ce },
         minHeight: ce,
@@ -770,17 +800,17 @@ function nr() {
         borderColor: "divider",
         borderRadius: 3,
         overflow: "hidden",
-        children: m ? /* @__PURE__ */ h(y, { p: 5, display: { md: "flex" }, gap: 5, alignItems: "center", justifyContent: "center", children: [
-          /* @__PURE__ */ t(_, { variant: "rounded", height: ge, width: te }),
-          /* @__PURE__ */ h(y, { flex: 1, height: "100%", children: [
-            /* @__PURE__ */ t(_, { variant: "text", height: 50, width: 100 }),
-            /* @__PURE__ */ t(_, { variant: "text", height: 40, width: "100%" }),
-            /* @__PURE__ */ t(_, { variant: "text", height: 40, width: 300 }),
-            /* @__PURE__ */ h(y, { display: "flex", gap: 1, my: 2, children: [
-              /* @__PURE__ */ t(_, { variant: "circular", height: 20, width: 20 }),
-              /* @__PURE__ */ t(_, { variant: "text", height: 20, width: 50 })
+        children: u ? /* @__PURE__ */ h(x, { p: 5, display: { md: "flex" }, gap: 5, alignItems: "center", justifyContent: "center", children: [
+          /* @__PURE__ */ t(O, { variant: "rounded", height: ge, width: te }),
+          /* @__PURE__ */ h(x, { flex: 1, height: "100%", children: [
+            /* @__PURE__ */ t(O, { variant: "text", height: 50, width: 100 }),
+            /* @__PURE__ */ t(O, { variant: "text", height: 40, width: "100%" }),
+            /* @__PURE__ */ t(O, { variant: "text", height: 40, width: 300 }),
+            /* @__PURE__ */ h(x, { display: "flex", gap: 1, my: 2, children: [
+              /* @__PURE__ */ t(O, { variant: "circular", height: 20, width: 20 }),
+              /* @__PURE__ */ t(O, { variant: "text", height: 20, width: 50 })
             ] }),
-            /* @__PURE__ */ t(_, { variant: "rounded", height: 30, width: 100 })
+            /* @__PURE__ */ t(O, { variant: "rounded", height: 30, width: 100 })
           ] })
         ] }) : /* @__PURE__ */ t(
           Bt,
@@ -794,15 +824,15 @@ function nr() {
             showBullets: !1,
             showThumbnails: !1,
             showFullscreenButton: !1,
-            renderLeftNav: (u) => /* @__PURE__ */ t(y, { onClick: u, sx: { display: { xs: "none", md: "block" } }, children: /* @__PURE__ */ t(St, { sx: { ...d, left: 5 } }) }),
-            renderRightNav: (u) => /* @__PURE__ */ t(y, { onClick: u, sx: { display: { xs: "none", md: "block" } }, children: /* @__PURE__ */ t(It, { sx: { ...d, right: 5 } }) }),
-            items: a.map((u, C) => ({
-              original: u.did,
+            renderLeftNav: (p) => /* @__PURE__ */ t(x, { onClick: p, sx: { display: { xs: "none", md: "block" } }, children: /* @__PURE__ */ t(St, { sx: { ...d, left: 5 } }) }),
+            renderRightNav: (p) => /* @__PURE__ */ t(x, { onClick: p, sx: { display: { xs: "none", md: "block" } }, children: /* @__PURE__ */ t(It, { sx: { ...d, right: 5 } }) }),
+            items: s.map((p, v) => ({
+              original: p.did,
               renderItem: () => {
-                var L;
-                const x = c[C] || {}, E = u.cover || lr(u.did, (L = x.screenshots) == null ? void 0 : L[0]), F = Ve(E, n.breakpoints.values.md * 2);
+                var z;
+                const w = a[v] || {}, A = p.cover || lr(p.did, (z = w.screenshots) == null ? void 0 : z[0]), T = Ve(A, n.breakpoints.values.md * 2);
                 return /* @__PURE__ */ h(
-                  A,
+                  F,
                   {
                     height: { xs: "auto", md: ce },
                     sx: {
@@ -814,7 +844,7 @@ function nr() {
                         left: 0,
                         right: 0,
                         bottom: 0,
-                        backgroundImage: `url("${F}")`,
+                        backgroundImage: `url("${T}")`,
                         backgroundSize: "cover",
                         filter: "blur(50px)",
                         opacity: 0.15,
@@ -826,17 +856,17 @@ function nr() {
                     justifyContent: "center",
                     alignItems: { xs: "flex-start", md: "center" },
                     p: { xs: 2, md: 5 },
-                    onClick: () => r.handleSearchSelect(x),
+                    onClick: () => r.handleSearchSelect(w),
                     gap: { xs: 2, md: 5 },
                     children: [
-                      g(F),
-                      /* @__PURE__ */ h(A, { flex: 1, height: "100%", gap: 3, children: [
-                        /* @__PURE__ */ h(y, { flex: 1, children: [
-                          p(u.name || x.title || u.name),
-                          f(u.desc || x.description)
+                      y(T),
+                      /* @__PURE__ */ h(F, { flex: 1, height: "100%", gap: 3, children: [
+                        /* @__PURE__ */ h(x, { flex: 1, children: [
+                          m(p.name || w.title || p.name),
+                          f(p.desc || w.description)
                         ] }),
-                        x.did && k(x, u.baseNum),
-                        S(x)
+                        w.did && k(w, p.baseNum),
+                        g(w)
                       ] })
                     ]
                   }
@@ -848,15 +878,15 @@ function nr() {
       }
     )
   ] }) : null;
-  function g(u) {
-    return /* @__PURE__ */ t(y, { borderRadius: 2, overflow: "hidden", position: "relative", width: { xs: "100%", md: te }, children: /* @__PURE__ */ t(ar, { url: u }) });
+  function y(p) {
+    return /* @__PURE__ */ t(x, { borderRadius: 2, overflow: "hidden", position: "relative", width: { xs: "100%", md: te }, children: /* @__PURE__ */ t(ar, { url: p }) });
   }
-  function p(u) {
-    return /* @__PURE__ */ t(w, { variant: "h2", width: "100%", children: u });
+  function m(p) {
+    return /* @__PURE__ */ t(b, { variant: "h2", width: "100%", children: p });
   }
-  function f(u) {
+  function f(p) {
     return /* @__PURE__ */ t(
-      w,
+      b,
       {
         variant: "body2",
         color: "text.secondary",
@@ -874,24 +904,24 @@ function nr() {
           overflow: "hidden",
           WebkitBoxOrient: "vertical"
         },
-        children: u
+        children: p
       }
     );
   }
-  function k(u, C = 0) {
-    const { did: x, owner: E, stats: F } = u;
-    return /* @__PURE__ */ h(y, { display: "flex", alignItems: "center", gap: 2, color: "text.secondary", children: [
-      /* @__PURE__ */ t(Pe, { icon: /* @__PURE__ */ t($e, { src: E.avatar, did: x, size: 20, variant: "circle" }), children: E.fullName }),
-      /* @__PURE__ */ t(Pe, { icon: /* @__PURE__ */ t(ee, { icon: Ct }), title: `${F.downloads + C}`, children: ir(F.downloads + C) })
+  function k(p, v = 0) {
+    const { did: w, owner: A, stats: T } = p;
+    return /* @__PURE__ */ h(x, { display: "flex", alignItems: "center", gap: 2, color: "text.secondary", children: [
+      /* @__PURE__ */ t(Pe, { icon: /* @__PURE__ */ t($e, { src: A.avatar, did: w, size: 20, variant: "circle" }), children: A.fullName }),
+      /* @__PURE__ */ t(Pe, { icon: /* @__PURE__ */ t(K, { icon: Ct }), title: `${T.downloads + v}`, children: ir(T.downloads + v) })
     ] });
   }
-  function S(u) {
+  function g(p) {
     return /* @__PURE__ */ t(
       oe,
       {
         variant: "outlined",
         size: "small",
-        onClick: () => r.handleSearchSelect(u),
+        onClick: () => r.handleSearchSelect(p),
         sx: {
           width: "fit-content",
           textTransform: "none",
@@ -907,10 +937,10 @@ function nr() {
 }
 const ir = (e) => Number.isNaN(e) ? 0 : e < 1e3 ? e : e < 1e6 ? `${(e / 1e3).toFixed(1)}k` : e < 1e9 ? `${(e / 1e6).toFixed(1)}m` : `${(e / 1e9).toFixed(1)}b`, lr = (e, r) => e && r ? `/assets/${e}/screenshots/${r}` : "";
 function ar({ url: e }) {
-  const [r, o] = P(!0);
+  const [r, o] = E(!0);
   return /* @__PURE__ */ h(M, { children: [
     r && /* @__PURE__ */ t(
-      _,
+      O,
       {
         variant: "rectangular",
         sx: {
@@ -920,7 +950,7 @@ function ar({ url: e }) {
       }
     ),
     /* @__PURE__ */ t(
-      y,
+      x,
       {
         display: r ? "none" : "block",
         component: "img",
@@ -939,25 +969,25 @@ function ar({ url: e }) {
   ] });
 }
 function sr({ title: e, blocklets: r }) {
-  const { blockletRender: o, serverVersion: n } = I();
-  return /* @__PURE__ */ h(y, { mt: 3, children: [
-    /* @__PURE__ */ t(w, { component: "h3", variant: "h3", sx: { mb: 2 }, children: e }),
-    /* @__PURE__ */ t(Be, { container: !0, spacing: 2, children: r.map((l) => /* @__PURE__ */ t(Be, { item: !0, xs: 12, md: 6, p: "2px", "data-blocklet-did": l.did, children: /* @__PURE__ */ t(y, { padding: "1px", children: o({ blocklet: l, blocklets: r, serverVersion: n }) }) }, l.did)) })
+  const { blockletRender: o, serverVersion: n } = R();
+  return /* @__PURE__ */ h(x, { mt: 3, children: [
+    /* @__PURE__ */ t(b, { component: "h3", variant: "h3", sx: { mb: 2 }, children: e }),
+    /* @__PURE__ */ t(Be, { container: !0, spacing: 2, children: r.map((l) => /* @__PURE__ */ t(Be, { item: !0, xs: 12, md: 6, p: "2px", "data-blocklet-did": l.did, children: /* @__PURE__ */ t(x, { padding: "1px", children: o({ blocklet: l, blocklets: r, serverVersion: n }) }) }, l.did)) })
   ] });
 }
 function cr() {
-  const { get: e } = Ce(), { t: r } = I(), {
+  const { get: e } = Ce(), { t: r } = R(), {
     data: o = [],
     error: n,
     loading: l
   } = re(async () => {
-    const a = await e(T.explorePath);
-    return Array.isArray(a) ? a : [];
+    const s = await e(P.explorePath);
+    return Array.isArray(s) ? s : [];
   });
-  return n ? /* @__PURE__ */ t(ye, { error: new Error(`Failed to fetch blocklets from ${T.explorePath}`) }) : l ? /* @__PURE__ */ t(Ze, { mt: 15 }) : /* @__PURE__ */ h(M, { children: [
+  return n ? /* @__PURE__ */ t(xe, { error: new Error(`Failed to fetch blocklets from ${P.explorePath}`) }) : l ? /* @__PURE__ */ t(Ze, { mt: 15 }) : /* @__PURE__ */ h(M, { children: [
     /* @__PURE__ */ t(nr, {}),
     o.map(
-      (a) => a.blocklets.length > 0 ? /* @__PURE__ */ t(sr, { title: r(`explore.${a.type}`), blocklets: a.blocklets }, a.type) : null
+      (s) => s.blocklets.length > 0 ? /* @__PURE__ */ t(sr, { title: r(`explore.${s.type}`), blocklets: s.blocklets }, s.type) : null
     )
   ] });
 }
@@ -968,40 +998,40 @@ function dr({
   locale: o,
   filters: n,
   handleKeyword: l,
-  handleSearchSelect: a,
-  ...c
+  handleSearchSelect: s,
+  ...a
 }) {
-  const i = fe(null), m = fe(!1), [d, g] = P(!1), [p, f] = P(""), [k, S] = P(!1), B = Ce(), [v, u] = P(!1), C = async (s) => {
-    u(!0);
-    const b = await B.get(Se(e, be(T.blockletsPath, s)));
-    return u(!1), b.dataList || [];
-  }, { data: x, run: E } = re(
-    (s) => s ? C({
-      sortBy: T.nameDesc,
+  const i = fe(null), u = fe(!1), [d, y] = E(!1), [m, f] = E(""), [k, g] = E(!1), B = Ce(), [S, p] = E(!1), v = (a == null ? void 0 : a.placeholder) || r("common.searchStore"), w = async (c) => {
+    p(!0);
+    const C = await B.get(Se(e, be(P.blockletsPath, c)));
+    return p(!1), C.dataList || [];
+  }, { data: A, run: T } = re(
+    (c) => c ? w({
+      sortBy: P.nameDesc,
       page: 1,
       pageSize: 10,
-      keyword: s,
+      keyword: c,
       showResources: "true"
     }) : Promise.resolve([]),
     {
       manual: !0
     }
   );
-  U(() => {
-    u(!0), E(n.keyword), f(n.keyword || "");
-  }, [n.keyword, E]), Lt(
+  H(() => {
+    p(!0), T(n.keyword), f(n.keyword || "");
+  }, [n.keyword, T]), Lt(
     "ctrl + k, command + k",
-    (s) => {
-      var b, D;
-      return s.stopPropagation(), s.preventDefault(), (D = (b = i.current) == null ? void 0 : b.querySelector("input")) == null || D.focus(), !1;
+    (c) => {
+      var C, I;
+      return c.stopPropagation(), c.preventDefault(), (I = (C = i.current) == null ? void 0 : C.querySelector("input")) == null || I.focus(), !1;
     },
     { enableOnTags: ["INPUT"] }
   );
-  const F = ze((s) => E(s), { wait: 300 }), L = { name: de, title: p, did: "" };
+  const z = Me((c) => T(c), { wait: 300 }), U = { name: de, title: m, did: "" };
   let N = [];
-  return p && (v ? N = [L] : x != null && x.length ? N = [L, ...x] : N = [{ name: Ae, title: r("blocklet.noResults"), did: "" }]), /* @__PURE__ */ h(M, { children: [
+  return m && (S ? N = [U] : A != null && A.length ? N = [U, ...A] : N = [{ name: Ae, title: r("blocklet.noResults"), did: "" }]), /* @__PURE__ */ h(M, { children: [
     /* @__PURE__ */ h(Et, { fullScreen: !0, open: k, sx: { display: { md: "none" } }, children: [
-      /* @__PURE__ */ h(y, { p: 2, pb: 0, display: "flex", alignItems: "center", gap: 2, children: [
+      /* @__PURE__ */ h(x, { p: 2, pb: 0, display: "flex", alignItems: "center", gap: 2, children: [
         /* @__PURE__ */ t(
           je,
           {
@@ -1021,12 +1051,12 @@ function dr({
               }
             },
             autoFocus: !0,
-            placeholder: r("common.searchStore"),
+            placeholder: v,
             className: "bl-autocomplete-input",
-            value: p,
-            onChange: (s) => V(s.target.value),
-            startAdornment: $(k),
-            endAdornment: G()
+            value: m,
+            onChange: (c) => D(c.target.value),
+            startAdornment: G(k),
+            endAdornment: Y()
           }
         ),
         /* @__PURE__ */ t(
@@ -1034,37 +1064,40 @@ function dr({
           {
             variant: "outlined",
             onClick: () => {
-              S(!1), f(n.keyword || "");
+              g(!1), f(n.keyword || "");
             },
             children: r("common.cancel")
           }
         )
       ] }),
-      /* @__PURE__ */ t(We, { sx: { p: 0.5 }, children: N.map((s) => X(s)) })
+      /* @__PURE__ */ t(We, { sx: { p: 0.5 }, children: N.map((c) => V(c)) })
     ] }),
     /* @__PURE__ */ t(
-      J,
+      ee,
       {
         sx: { display: { sx: "block", md: "none" }, fontSize: 28, color: "text.lighter" },
-        onClick: () => S(!0)
+        onClick: () => g(!0)
       }
     ),
     /* @__PURE__ */ t(
       At,
       {
         ref: i,
-        open: !!p && d,
+        open: !!m && d,
         size: "small",
-        onOpen: () => g(!0),
-        onClose: (s, b) => {
-          g(!1), b === "selectOption" && !m.current && l(p);
+        onOpen: () => y(!0),
+        onClose: (c, C) => {
+          y(!1), C === "selectOption" && !u.current && l(m);
+        },
+        onKeyDown: (c) => {
+          c.key === "Enter" && !m && Q();
         },
         disableClearable: !0,
-        inputValue: p,
-        onInputChange: (s, b) => V(b),
-        isOptionEqualToValue: (s, b) => s.name === b.name,
-        getOptionLabel: (s) => s.title,
-        getOptionKey: (s) => s.name,
+        inputValue: m,
+        onInputChange: (c, C) => D(C),
+        isOptionEqualToValue: (c, C) => c.name === C.name,
+        getOptionLabel: (c) => c.title,
+        getOptionKey: (c) => c.name,
         noOptionsText: r("blocklet.noResults"),
         autoHighlight: !0,
         forcePopupIcon: !1,
@@ -1078,26 +1111,26 @@ function dr({
             }
           }
         },
-        renderInput: (s) => /* @__PURE__ */ t(
+        renderInput: (c) => /* @__PURE__ */ t(
           Ft,
           {
-            ...s,
+            ...c,
             InputProps: {
-              ...s.InputProps,
+              ...c.InputProps,
               autoFocus: !0,
-              placeholder: r("common.searchStore"),
+              placeholder: v,
               className: "bl-autocomplete-input",
-              value: p,
-              startAdornment: $(d),
-              endAdornment: G()
+              value: m,
+              startAdornment: G(d),
+              endAdornment: Y()
             }
           }
         ),
-        filterOptions: (s) => s,
-        ...c,
+        filterOptions: (c) => c,
+        ...a,
         options: N,
-        renderOption: (s, b) => X(b),
-        value: L,
+        renderOption: (c, C) => V(C),
+        value: U,
         sx: [
           {
             bgcolor: "#F9FAFB",
@@ -1112,42 +1145,42 @@ function dr({
               borderWidth: "1px"
             }
           },
-          ...Array.isArray(c.sx) ? c.sx : [c.sx]
+          ...Array.isArray(a.sx) ? a.sx : [a.sx]
         ]
       }
     )
   ] });
-  function V(s) {
-    u(!0), f(s), m.current = !1, F.run(s);
+  function D(c) {
+    p(!0), f(c), u.current = !1, z.run(c);
   }
-  function q() {
-    S(!1), f(""), V(""), l("");
+  function Q() {
+    g(!1), f(""), D(""), l("");
   }
-  function ie(s) {
-    s != null && s.did ? (S(!1), m.current = !0, f(""), a(s)) : s.name === de && (S(!1), l(p));
+  function ie(c) {
+    c != null && c.did ? (g(!1), u.current = !0, f(""), s(c)) : c.name === de && (g(!1), l(m));
   }
-  function X(s) {
-    var b, D;
+  function V(c) {
+    var C, I;
     return /* @__PURE__ */ h(
       De,
       {
         sx: { display: "flex", alignItems: "center", gap: 1, p: 1.5, borderRadius: "8px" },
-        onClick: () => ie(s),
+        onClick: () => ie(c),
         children: [
-          Q(s),
-          /* @__PURE__ */ h(w, { variant: "body1", children: [
-            /* @__PURE__ */ t(w, { fontWeight: "fontWeightMedium", display: "flex", alignItems: "center", gap: 1, children: s.title }),
-            /* @__PURE__ */ t(w, { sx: { color: "text.lighter" }, fontSize: "13px", children: ((D = (b = s.category) == null ? void 0 : b.locales) == null ? void 0 : D[o || "en"]) || "" })
+          q(c),
+          /* @__PURE__ */ h(b, { variant: "body1", children: [
+            /* @__PURE__ */ t(b, { fontWeight: "fontWeightMedium", display: "flex", alignItems: "center", gap: 1, children: c.title }),
+            /* @__PURE__ */ t(b, { sx: { color: "text.lighter" }, fontSize: "13px", children: ((I = (C = c.category) == null ? void 0 : C.locales) == null ? void 0 : I[o || "en"]) || "" })
           ] })
         ]
       },
-      s.did
+      c.did
     );
   }
-  function Q(s) {
-    if ([de, Ae].includes(s.name))
+  function q(c) {
+    if ([de, Ae].includes(c.name))
       return /* @__PURE__ */ t(
-        y,
+        x,
         {
           width: ue,
           p: "6px",
@@ -1157,28 +1190,28 @@ function dr({
           color: "text.lighter",
           bgcolor: "#F1F3F5",
           borderRadius: "8px",
-          children: /* @__PURE__ */ t(J, { sx: { fontSize: 28 } })
+          children: /* @__PURE__ */ t(ee, { sx: { fontSize: 28 } })
         }
       );
-    let b = "";
-    return s.logo && (b = Se(e, "assets", s.did, Ve(s.logo, ue, s.version))), /* @__PURE__ */ t($e, { src: b, size: ue, style: { borderRadius: "8px", overflow: "hidden" } });
+    let C = "";
+    return c.logo && (C = Se(e, "assets", c.did, Ve(c.logo, ue, c.version))), /* @__PURE__ */ t($e, { src: C, size: ue, style: { borderRadius: "8px", overflow: "hidden" } });
   }
-  function $(s = !0) {
-    return /* @__PURE__ */ t(y, { sx: { display: "flex", pl: 0.5, alignItems: "center", color: "text.lighter" }, children: s && p && v ? /* @__PURE__ */ t(ne, { color: "inherit", size: 16 }) : /* @__PURE__ */ t(J, { sx: { fontSize: 16, cursor: "default" } }) });
+  function G(c = !0) {
+    return /* @__PURE__ */ t(x, { sx: { display: "flex", pl: 0.5, alignItems: "center", color: "text.lighter" }, children: c && m && S ? /* @__PURE__ */ t(ne, { color: "inherit", size: 16 }) : /* @__PURE__ */ t(ee, { sx: { fontSize: 16, cursor: "default" } }) });
   }
-  function G() {
-    return p ? /* @__PURE__ */ t(y, { sx: { display: "flex", alignItems: "center", color: "text.lighter" }, children: /* @__PURE__ */ t(we, { sx: { fontSize: 20, cursor: "pointer" }, onClick: () => q() }) }) : null;
+  function Y() {
+    return m ? /* @__PURE__ */ t(x, { sx: { display: "flex", alignItems: "center", color: "text.lighter" }, children: /* @__PURE__ */ t(we, { sx: { fontSize: 20, cursor: "pointer" }, onClick: () => Q() }) }) : null;
   }
 }
 function ur({ placeholder: e = "Type to search...", ...r }) {
-  const { search: o } = I(), { filters: n, handleKeyword: l } = o, [a, c] = P(n.keyword || ""), i = ze(l, { wait: 300 }), m = (g) => {
-    const { value: p } = g.target;
-    c(p), i.run(p);
+  const { search: o } = R(), { filters: n, handleKeyword: l } = o, [s, a] = E(n.keyword || ""), i = Me(l, { wait: 300 }), u = (y) => {
+    const { value: m } = y.target;
+    a(m), i.run(m);
   }, d = () => {
-    c(""), l("");
+    a(""), l("");
   };
-  return U(() => {
-    c(n.keyword || "");
+  return H(() => {
+    a(n.keyword || "");
   }, [n.keyword]), /* @__PURE__ */ t(
     hr,
     {
@@ -1186,17 +1219,17 @@ function ur({ placeholder: e = "Type to search...", ...r }) {
         "data-cy": "search-blocklet"
       },
       startAdornment: /* @__PURE__ */ t(Te, { position: "start", children: /* @__PURE__ */ t(pr, {}) }),
-      onChange: m,
+      onChange: u,
       placeholder: e,
-      value: a,
+      value: s,
       title: e,
       "data-cy": "search",
-      endAdornment: a && /* @__PURE__ */ t(Te, { position: "end", children: /* @__PURE__ */ t(mr, { "data-cy": "search-delete", onClick: d }) }),
+      endAdornment: s && /* @__PURE__ */ t(Te, { position: "end", children: /* @__PURE__ */ t(mr, { "data-cy": "search-delete", onClick: d }) }),
       ...r
     }
   );
 }
-const hr = K(je)`
+const hr = X(je)`
   background-color: ${(e) => e.theme.palette.grey[50]};
   font-size: 14px;
   border-radius: 6px;
@@ -1213,21 +1246,21 @@ const hr = K(je)`
       color: transparent;
     }
   }
-`, pr = K(J)`
+`, pr = X(ee)`
   color: ${(e) => e.theme.palette.grey[500]};
   font-size: 28px;
   @media (max-width: ${(e) => e.theme.breakpoints.values.md}px) {
     font-size: 24px;
   }
-`, mr = K(we)`
+`, mr = X(we)`
   color: ${(e) => e.theme.palette.grey[500]};
   font-size: 16px;
   cursor: pointer;
 `;
 function fr() {
-  const { search: e, t: r, endpoint: o, locale: n, getCategoryLocale: l, developerName: a, showResourcesSwitch: c, layout: i, baseSearch: m } = I(), { filters: d, handleSort: g, handlePrice: p, handleDeveloper: f, handleSwitchShowResources: k, cleanFilter: S } = e, B = Ue(r);
+  const { search: e, t: r, endpoint: o, locale: n, getCategoryLocale: l, developerName: s, showResourcesSwitch: a, layout: i, baseSearch: u } = R(), { filters: d, handleSort: y, handlePrice: m, handleDeveloper: f, handleSwitchShowResources: k, cleanFilter: g } = e, B = Ue(r);
   return /* @__PURE__ */ h(
-    A,
+    F,
     {
       className: "filter-bar",
       direction: { xs: "column", md: "row" },
@@ -1239,9 +1272,9 @@ function fr() {
       px: 0,
       pb: 3,
       children: [
-        /* @__PURE__ */ t(w, { variant: "h2", textTransform: "capitalize", children: l(d.category) }),
+        /* @__PURE__ */ t(b, { variant: "h2", textTransform: "capitalize", children: l(d.category) }),
         /* @__PURE__ */ h(
-          A,
+          F,
           {
             flex: 1,
             direction: "row",
@@ -1250,7 +1283,7 @@ function fr() {
             justifyContent: { xs: "space-between", md: "flex-end" },
             gap: 2,
             children: [
-              i.showSearch ? /* @__PURE__ */ t(y, { flex: 1, children: m ? /* @__PURE__ */ t(ur, {}) : /* @__PURE__ */ t(
+              i.showSearch ? /* @__PURE__ */ t(x, { flex: 1, children: u ? /* @__PURE__ */ t(ur, {}) : /* @__PURE__ */ t(
                 dr,
                 {
                   locale: n,
@@ -1267,10 +1300,10 @@ function fr() {
                   handleSearchSelect: e.handleSearchSelect
                 }
               ) }) : null,
-              d.owner && a && /* @__PURE__ */ t(
+              d.owner && s && /* @__PURE__ */ t(
                 Re,
                 {
-                  label: r("blocklet.authorTag", { name: a }),
+                  label: r("blocklet.authorTag", { name: s }),
                   size: "small",
                   onDelete: () => f("")
                 }
@@ -1280,14 +1313,14 @@ function fr() {
                 {
                   label: r("blocklet.resourceTag", { name: d.resourceBlocklet }),
                   size: "small",
-                  onDelete: () => S(["resourceDid", "resourceBlocklet", "showResources"])
+                  onDelete: () => g(["resourceDid", "resourceBlocklet", "showResources"])
                 }
               ),
-              c ? /* @__PURE__ */ t(
+              a ? /* @__PURE__ */ t(
                 Ee,
                 {
                   checked: d.showResources !== "false",
-                  onChange: (v) => k(v ? "true" : "false"),
+                  onChange: (S) => k(S ? "true" : "false"),
                   label: r("common.showResources")
                 }
               ) : null,
@@ -1295,7 +1328,7 @@ function fr() {
                 Ee,
                 {
                   checked: d.price === "free",
-                  onChange: (v) => p(v ? "free" : ""),
+                  onChange: (S) => m(S ? "free" : ""),
                   label: r("blocklet.free")
                 }
               ),
@@ -1305,7 +1338,7 @@ function fr() {
                   value: d.sortBy || B[0].value,
                   options: B,
                   placeholder: r("sort.sort"),
-                  onChange: (v) => g(v)
+                  onChange: (S) => y(S)
                 }
               )
             ]
@@ -1326,11 +1359,11 @@ function Ee({
       sx: { m: 0, p: 0 },
       className: "check-button",
       control: /* @__PURE__ */ t(
-        Me,
+        ze,
         {
           checked: e,
-          icon: /* @__PURE__ */ t(ee, { style: { padding: 0 }, icon: Tt }),
-          checkedIcon: /* @__PURE__ */ t(ee, { style: { padding: 0, color: "#3478E2" }, icon: Pt }),
+          icon: /* @__PURE__ */ t(K, { style: { padding: 0 }, icon: Tt }),
+          checkedIcon: /* @__PURE__ */ t(K, { style: { padding: 0, color: "#3478E2" }, icon: Pt }),
           size: "large",
           sx: { p: 0, mr: 1 },
           onChange: (n) => r(n.target.checked)
@@ -1340,23 +1373,23 @@ function Ee({
     }
   );
 }
-function Z({ children: e }) {
-  return /* @__PURE__ */ h(y, { display: "flex", mt: 2, flexDirection: "column", alignItems: "center", justifyContent: "center", color: "text.lighter", children: [
+function J({ children: e }) {
+  return /* @__PURE__ */ h(x, { display: "flex", mt: 2, flexDirection: "column", alignItems: "center", justifyContent: "center", color: "text.lighter", children: [
     /* @__PURE__ */ t(Ot, {}),
     e
   ] });
 }
 function Fe() {
-  const { t: e } = I();
-  return /* @__PURE__ */ t(w, { style: { textAlign: "center" }, variant: "subtitle2", children: e("blocklet.noResults") });
+  const { t: e } = R();
+  return /* @__PURE__ */ t(b, { style: { textAlign: "center" }, variant: "subtitle2", children: e("blocklet.noResults") });
 }
 function he({ filterTip: e, keywordTip: r }) {
-  const { t: o, locale: n } = I(), l = () => n === "zh" ? "、" : " , ";
-  return /* @__PURE__ */ h(y, { mt: 1, display: "flex", children: [
-    /* @__PURE__ */ t(w, { style: { marginRight: "16px" }, children: o("blocklet.emptyTip") }),
-    e && /* @__PURE__ */ t(w, { children: o("blocklet.filterTip") }),
+  const { t: o, locale: n } = R(), l = () => n === "zh" ? "、" : " , ";
+  return /* @__PURE__ */ h(x, { mt: 1, display: "flex", children: [
+    /* @__PURE__ */ t(b, { style: { marginRight: "16px" }, children: o("blocklet.emptyTip") }),
+    e && /* @__PURE__ */ t(b, { children: o("blocklet.filterTip") }),
     e && r && l(),
-    r && /* @__PURE__ */ t(w, { children: o("blocklet.keywordTip") })
+    r && /* @__PURE__ */ t(b, { children: o("blocklet.keywordTip") })
   ] });
 }
 function pe({
@@ -1364,19 +1397,19 @@ function pe({
   primaryEnd: r,
   filter: o
 }) {
-  return /* @__PURE__ */ h(w, { variant: "subtitle2", display: "flex", gap: 0.5, mx: 0.5, children: [
-    /* @__PURE__ */ t(w, { children: e }),
-    /* @__PURE__ */ t(w, { color: "primary", children: o }),
-    /* @__PURE__ */ h(w, { children: [
+  return /* @__PURE__ */ h(b, { variant: "subtitle2", display: "flex", gap: 0.5, mx: 0.5, children: [
+    /* @__PURE__ */ t(b, { children: e }),
+    /* @__PURE__ */ t(b, { color: "primary", children: o }),
+    /* @__PURE__ */ h(b, { children: [
       r,
       " "
     ] })
   ] });
 }
 function gr() {
-  const { t: e, search: r, getCategoryLocale: o, selectedCategory: n } = I(), { filters: l } = r, a = !!n || !!l.price;
-  if (l.keyword && a)
-    return /* @__PURE__ */ h(Z, { children: [
+  const { t: e, search: r, getCategoryLocale: o, selectedCategory: n } = R(), { filters: l } = r, s = !!n || !!l.price;
+  if (l.keyword && s)
+    return /* @__PURE__ */ h(J, { children: [
       /* @__PURE__ */ t(
         pe,
         {
@@ -1388,7 +1421,7 @@ function gr() {
       /* @__PURE__ */ t(he, { keywordTip: !0, filterTip: !0 })
     ] });
   if (l.keyword)
-    return /* @__PURE__ */ h(Z, { children: [
+    return /* @__PURE__ */ h(J, { children: [
       /* @__PURE__ */ t(
         pe,
         {
@@ -1399,35 +1432,35 @@ function gr() {
       ),
       /* @__PURE__ */ t(he, { keywordTip: !0 })
     ] });
-  if (a) {
-    const c = o(n);
-    return /* @__PURE__ */ h(Z, { children: [
-      c ? /* @__PURE__ */ t(
+  if (s) {
+    const a = o(n);
+    return /* @__PURE__ */ h(J, { children: [
+      a ? /* @__PURE__ */ t(
         pe,
         {
           primaryStart: e("blocklet.noCategoryResults1"),
           primaryEnd: e("blocklet.noCategoryResults2"),
-          filter: c
+          filter: a
         }
       ) : /* @__PURE__ */ t(Fe, {}),
       /* @__PURE__ */ t(he, { filterTip: !0 })
     ] });
   }
-  return /* @__PURE__ */ t(Z, { children: /* @__PURE__ */ t(Fe, {}) });
+  return /* @__PURE__ */ t(J, { children: /* @__PURE__ */ t(Fe, {}) });
 }
-const xr = (e, r, o, n) => at(
+const yr = (e, r, o, n) => at(
   async (l) => {
     l || (o.currentPage = o.defaultCurrentPage);
-    const { currentPage: a, pageSize: c } = o, i = {
+    const { currentPage: s, pageSize: a } = o, i = {
       ...r,
       category: r.category === "All" ? "" : r.category,
-      sortBy: T[r.sortBy],
-      page: a,
-      pageSize: c
+      sortBy: P[r.sortBy],
+      page: s,
+      pageSize: a
     };
     n(null);
-    const { data: m = {} } = await e.get(T.blockletsPath, { params: i });
-    return o.currentPage++, { page: a, pageSize: c, list: (m == null ? void 0 : m.dataList) || [], total: (m == null ? void 0 : m.total) || 0 };
+    const { data: u = {} } = await e.get(P.blockletsPath, { params: i });
+    return o.currentPage++, { page: s, pageSize: a, list: (u == null ? void 0 : u.dataList) || [], total: (u == null ? void 0 : u.total) || 0 };
   },
   {
     isNoMore: (l) => l ? l.page * l.pageSize >= l.total : !1,
@@ -1435,28 +1468,28 @@ const xr = (e, r, o, n) => at(
     onError: n
   }
 );
-function yr() {
-  var p;
-  const { storeApi: e, search: r, extraFilter: o, errors: n, updateDeveloperName: l } = I(), { filters: a } = r, c = st({
-    currentPage: T.currentPage,
-    pageSize: qt() ? T.mobilePageSize : T.pageSize,
-    defaultCurrentPage: T.defaultCurrentPage
-  }), [i, m] = P(null), d = xr(e, a, c, m), g = H(
+function xr() {
+  var m;
+  const { storeApi: e, search: r, extraFilter: o, errors: n, updateDeveloperName: l } = R(), { filters: s } = r, a = st({
+    currentPage: P.currentPage,
+    pageSize: qt() ? P.mobilePageSize : P.pageSize,
+    defaultCurrentPage: P.defaultCurrentPage
+  }), [i, u] = E(null), d = yr(e, s, a, u), y = j(
     () => {
       var f, k;
       return o ? o(((f = d.data) == null ? void 0 : f.list) || []) : ((k = d.data) == null ? void 0 : k.list) || [];
     },
     [d.data, o]
   );
-  return U(() => {
-    const f = g.find((k) => k.owner.did === a.owner);
+  return H(() => {
+    const f = y.find((k) => k.owner.did === s.owner);
     l((f == null ? void 0 : f.owner.fullName) || (f == null ? void 0 : f.author.name) || "");
-  }, [a.owner, g, l]), {
-    blocklets: g,
+  }, [s.owner, y, l]), {
+    blocklets: y,
     fetchBlockletsError: i,
     loadMore: d.loadMore,
     hasNextPage: !d.noMore,
-    total: ((p = d.data) == null ? void 0 : p.total) || 0,
+    total: ((m = d.data) == null ? void 0 : m.total) || 0,
     loadings: {
       fetchBlockletsLoading: d.loading,
       loadingMore: d.loadingMore
@@ -1468,40 +1501,40 @@ function yr() {
   };
 }
 function wr() {
-  const { t: e, search: r, endpoint: o, blockletRender: n, serverVersion: l, minItemWidth: a, layout: c, baseSearch: i } = I(), { filters: m } = r, { blocklets: d, errors: g, loadMore: p, loadings: f, hasNextPage: k, total: S } = yr(), [B] = Rt({
+  const { t: e, search: r, endpoint: o, blockletRender: n, serverVersion: l, minItemWidth: s, layout: a, baseSearch: i } = R(), { filters: u } = r, { blocklets: d, errors: y, loadMore: m, loadings: f, hasNextPage: k, total: g } = xr(), [B] = Rt({
     loading: f.fetchBlockletsLoading || f.loadingMore,
     hasNextPage: k,
-    onLoadMore: p
+    onLoadMore: m
   });
-  if (g.fetchBlockletsError) {
-    const x = new Error(`Failed to fetch blocklets from ${o}: ${g.fetchBlockletsError.message}`);
-    return /* @__PURE__ */ t(ye, { error: x });
+  if (y.fetchBlockletsError) {
+    const w = new Error(`Failed to fetch blocklets from ${o}: ${y.fetchBlockletsError.message}`);
+    return /* @__PURE__ */ t(xe, { error: w });
   }
-  const v = i && c.showSearch || !m.keyword;
+  const S = i && a.showSearch || !u.keyword;
   return /* @__PURE__ */ h(M, { children: [
-    v ? /* @__PURE__ */ t(fr, {}) : /* @__PURE__ */ h(M, { children: [
+    S ? /* @__PURE__ */ t(fr, {}) : /* @__PURE__ */ h(M, { children: [
       /* @__PURE__ */ t(ve, { xs: /* @__PURE__ */ t(Ye, {}), md: null }),
-      C()
+      v()
     ] }),
-    u(),
-    !f.fetchBlockletsLoading && k && /* @__PURE__ */ t(y, { height: 60, display: "flex", justifyContent: "center", py: 2, ref: B, children: /* @__PURE__ */ t(ne, {}) })
+    p(),
+    !f.fetchBlockletsLoading && k && /* @__PURE__ */ t(x, { height: 60, display: "flex", justifyContent: "center", py: 2, ref: B, children: /* @__PURE__ */ t(ne, {}) })
   ] });
-  function u() {
+  function p() {
     return f.fetchBlockletsLoading ? /* @__PURE__ */ t(Ze, { mt: 15 }) : d.length ? /* @__PURE__ */ t(
-      y,
+      x,
       {
         className: "blocklet-list",
         display: "grid",
-        gridTemplateColumns: `repeat(auto-fill, minmax(${a}px, 1fr))`,
+        gridTemplateColumns: `repeat(auto-fill, minmax(${s}px, 1fr))`,
         p: "2px",
         gap: 2,
-        children: d.map((x) => /* @__PURE__ */ t(y, { "data-blocklet-did": x.did, sx: { minWidth: a }, children: n({ blocklet: x, blocklets: d, serverVersion: l }) }, x.did))
+        children: d.map((w) => /* @__PURE__ */ t(x, { "data-blocklet-did": w.did, sx: { minWidth: s }, children: n({ blocklet: w, blocklets: d, serverVersion: l }) }, w.did))
       }
     ) : /* @__PURE__ */ t(gr, {});
   }
-  function C() {
+  function v() {
     return /* @__PURE__ */ h(
-      A,
+      F,
       {
         direction: "row",
         className: "search-result-title",
@@ -1510,17 +1543,17 @@ function wr() {
         mb: 2,
         mt: { xs: 2, md: 0 },
         children: [
-          /* @__PURE__ */ t(w, { variant: "h3", children: e("blocklet.search", { keyword: m.keyword }) }),
-          /* @__PURE__ */ t(w, { variant: "body1", color: "text.lighter", fontSize: 13, children: e("blocklet.resultCount", { count: S }) })
+          /* @__PURE__ */ t(b, { variant: "h3", children: e("blocklet.search", { keyword: u.keyword }) }),
+          /* @__PURE__ */ t(b, { variant: "body1", color: "text.lighter", fontSize: 13, children: e("blocklet.resultCount", { count: g }) })
         ]
       }
     );
   }
 }
 function br() {
-  const { t: e, selectedCategory: r, getCategoryLocale: o } = I(), { toggleOpen: n } = ke();
+  const { t: e, selectedCategory: r, getCategoryLocale: o } = R(), { toggleOpen: n } = ke();
   return /* @__PURE__ */ h(
-    w,
+    b,
     {
       variant: "body1",
       display: { xs: "flex", md: "none" },
@@ -1529,48 +1562,52 @@ function br() {
       py: 2,
       fontWeight: "fontWeightMedium",
       children: [
-        /* @__PURE__ */ t(Xe, { onClick: () => n(!0), children: /* @__PURE__ */ t(zt, {}) }),
+        /* @__PURE__ */ t(Xe, { onClick: () => n(!0), children: /* @__PURE__ */ t(Mt, {}) }),
         o(r) || e("common.category")
       ]
     }
   );
 }
-function kr() {
-  const { search: e, layout: r } = I(), { filters: o } = e, n = o.category || o.keyword || o.price;
-  return /* @__PURE__ */ t(Dt, { children: /* @__PURE__ */ h(rt, { FallbackComponent: ye, children: [
+function kr({ menus: e, children: r }) {
+  var i;
+  const { search: o, layout: n } = R(), { filters: l } = o, s = l.category || l.keyword || l.price, a = (i = e == null ? void 0 : e.find((u) => u.key === l.menu)) == null ? void 0 : i.key;
+  return /* @__PURE__ */ t(Dt, { children: /* @__PURE__ */ h(rt, { FallbackComponent: xe, children: [
     /* @__PURE__ */ t(br, {}),
-    /* @__PURE__ */ h(y, { display: "flex", height: "100%", className: "list-container", pt: { xs: 0, md: 5 }, children: [
-      /* @__PURE__ */ t(rr, {}),
-      /* @__PURE__ */ t(A, { height: "100%", position: "relative", flex: 1, overflow: "visible", children: r.showExplore && !n ? /* @__PURE__ */ t(cr, {}) : /* @__PURE__ */ t(wr, {}) })
+    /* @__PURE__ */ h(x, { display: "flex", height: "100%", className: "list-container", pt: { xs: 0, md: 5 }, children: [
+      /* @__PURE__ */ t(rr, { menus: e }),
+      /* @__PURE__ */ h(F, { height: "100%", position: "relative", flex: 1, overflow: "visible", children: [
+        a && (r == null ? void 0 : r(a)),
+        !a && (n.showExplore && !s ? /* @__PURE__ */ t(cr, {}) : /* @__PURE__ */ t(wr, {}))
+      ] })
     ] })
   ] }) });
 }
 function Lo(e) {
-  return /* @__PURE__ */ h(Mt, { variant: "outlined", ...e, sx: { maxWidth: 400, borderRadius: "8px", p: { xs: 2, md: 3 }, ...e.sx }, children: [
+  return /* @__PURE__ */ h(zt, { variant: "outlined", ...e, sx: { maxWidth: 400, borderRadius: "8px", p: { xs: 2, md: 3 }, ...e.sx }, children: [
     /* @__PURE__ */ h(ae, { display: "flex", alignItems: "center", gap: 2, pb: 1, children: [
       /* @__PURE__ */ h(ae, { display: "flex", alignItems: "center", gap: 2, flex: 1, children: [
-        /* @__PURE__ */ t(O, { variant: "rounded", width: 48, height: 48 }),
-        /* @__PURE__ */ t(O, { variant: "text", width: 60, height: 28 })
+        /* @__PURE__ */ t(L, { variant: "rounded", width: 48, height: 48 }),
+        /* @__PURE__ */ t(L, { variant: "text", width: 60, height: 28 })
       ] }),
-      /* @__PURE__ */ t(O, { variant: "text", width: 70, height: 40 })
+      /* @__PURE__ */ t(L, { variant: "text", width: 70, height: 40 })
     ] }),
-    /* @__PURE__ */ t(O, { variant: "text", width: "100%", height: 24 }),
-    /* @__PURE__ */ t(O, { variant: "text", width: "90%", height: 24 }),
+    /* @__PURE__ */ t(L, { variant: "text", width: "100%", height: 24 }),
+    /* @__PURE__ */ t(L, { variant: "text", width: "90%", height: 24 }),
     /* @__PURE__ */ h(ae, { display: "flex", alignItems: "center", gap: 1, pt: 1.5, children: [
-      /* @__PURE__ */ t(O, { variant: "rounded", width: 24, height: 24 }),
-      /* @__PURE__ */ t(O, { variant: "text", width: "15%", height: 20 }),
-      /* @__PURE__ */ t(O, { variant: "rounded", width: 24, height: 24, sx: { ml: 1 } }),
-      /* @__PURE__ */ t(O, { variant: "text", width: "15%", height: 20 })
+      /* @__PURE__ */ t(L, { variant: "rounded", width: 24, height: 24 }),
+      /* @__PURE__ */ t(L, { variant: "text", width: "15%", height: 20 }),
+      /* @__PURE__ */ t(L, { variant: "rounded", width: 24, height: 24, sx: { ml: 1 } }),
+      /* @__PURE__ */ t(L, { variant: "text", width: "15%", height: 20 })
     ] })
   ] });
 }
 function Oo({ showSkeleton: e, ...r }) {
-  return e ? /* @__PURE__ */ t(_, { variant: "rectangular", width: r.width, height: r.height }) : /* @__PURE__ */ t(Nt, { ...r });
+  return e ? /* @__PURE__ */ t(O, { variant: "rectangular", width: r.width, height: r.height }) : /* @__PURE__ */ t(Nt, { ...r });
 }
 function _o(e) {
-  const r = xe(), o = Je(
+  const { menus: r, children: o, ...n } = e, l = ye(), s = Je(
     tt({
-      ...r,
+      ...l,
       typography: {
         h1: {
           fontSize: 32,
@@ -1597,7 +1634,7 @@ function _o(e) {
       }
     })
   );
-  return /* @__PURE__ */ t(et, { theme: o, children: /* @__PURE__ */ t(Yt, { ...e, children: /* @__PURE__ */ t(kr, {}) }) });
+  return /* @__PURE__ */ t(et, { theme: s, children: /* @__PURE__ */ t(Yt, { ...n, children: /* @__PURE__ */ t(kr, { menus: r, children: o }) }) });
 }
 export {
   dr as Autocomplete,