@blocklet/list 0.12.100 → 0.12.102

package/lib/index.es.js

@@ -1,35 +1,35 @@
-import { jsx as t, jsxs as h, Fragment as oe } from "react/jsx-runtime";
-import { styled as C, useTheme as ne } from "@arcblock/ux/lib/Theme";
-import { Global as xe, css as ke } from "@emotion/react";
-import Me from "@mui/icons-material/Sort";
-import { Button as Ae, CircularProgress as te, MenuList as Oe, useMediaQuery as Se, SvgIcon as Ee, Popper as qe, Grow as je, Paper as Ge, ClickAwayListener as Ke, MenuItem as Ue, Chip as Ce, Grid as ve, Box as I, OutlinedInput as We, InputAdornment as fe, Typography as Te, Hidden as ge, Stack as He } from "@mui/material";
-import Ve from "@mui/icons-material/Face";
+import { jsx as t, jsxs as g, Fragment as ae } from "react/jsx-runtime";
+import { styled as T, useTheme as ie } from "@arcblock/ux/lib/Theme";
+import { Global as Se, css as Ce } from "@emotion/react";
+import Oe from "@mui/icons-material/Sort";
+import { Button as Fe, CircularProgress as ne, MenuList as Ae, useMediaQuery as ve, SvgIcon as Me, Popper as Ee, Grow as qe, Paper as je, ClickAwayListener as Ue, MenuItem as We, Chip as Te, Box as D, Unstable_Grid2 as re, OutlinedInput as Ge, InputAdornment as be, Typography as Pe, Hidden as we, Stack as Ke } from "@mui/material";
+import He from "@mui/icons-material/Face";
 import { ErrorBoundary as Qe } from "react-error-boundary";
-import { ErrorFallback as Pe } from "@arcblock/ux/lib/ErrorBoundary";
-import { createContext as Je, useMemo as K, useState as A, useCallback as re, useEffect as q, useContext as Xe, forwardRef as Ye, useRef as U, createElement as Ze, Fragment as et } from "react";
-import { useReactive as Re, useInfiniteScroll as tt, useRequest as rt, useSize as ot, useDebounceFn as nt, useMemoizedFn as lt, useCreation as at, useMount as it } from "ahooks";
-import n from "prop-types";
-import st from "lodash/orderBy";
-import ct from "axios";
-import pt from "json-stable-stringify";
+import { ErrorFallback as Re } from "@arcblock/ux/lib/ErrorBoundary";
+import { createContext as Ve, useMemo as K, useState as A, useCallback as le, useEffect as j, useContext as Je, forwardRef as Xe, useRef as H, createElement as Ye, Fragment as Ze } from "react";
+import { useReactive as Be, useInfiniteScroll as et, useRequest as tt, useSize as rt, useDebounceFn as ot, useMemoizedFn as nt, useCreation as lt, useMount as at } from "ahooks";
+import { joinURL as it, parseQuery as st } from "ufo";
+import o from "prop-types";
+import ct from "lodash/orderBy";
+import pt from "axios";
+import ut from "json-stable-stringify";
 import "lodash/cloneDeep";
-import ut from "color";
-import ye from "flat";
-import dt from "@mui/icons-material/KeyboardArrowDown";
-import mt from "lodash/isEmpty";
-import ht from "@mui/icons-material/FilterAltOutlined";
-import ft from "@arcblock/ux/lib/Dialog";
-import gt from "@mui/material/Button";
-import yt from "@arcblock/ux/lib/Empty";
-import bt from "react-infinite-scroll-hook";
-import wt from "@mui/material/Box";
-import Be from "@mui/material/Typography";
-import xt from "@mui/icons-material/Search";
-import kt from "@mui/icons-material/Close";
-import { createRoot as St } from "react-dom/client";
-import { autocomplete as Ct } from "@algolia/autocomplete-js";
-import { useHotkeys as vt } from "react-hotkeys-hook";
-import { joinURL as Tt } from "ufo";
+import dt from "color";
+import xe from "flat";
+import mt from "@mui/icons-material/KeyboardArrowDown";
+import ht from "lodash/isEmpty";
+import ft from "@mui/icons-material/FilterAltOutlined";
+import gt from "@arcblock/ux/lib/Dialog";
+import yt from "@mui/material/Button";
+import bt from "@arcblock/ux/lib/Empty";
+import wt from "react-infinite-scroll-hook";
+import xt from "@mui/material/Box";
+import $e from "@mui/material/Typography";
+import kt from "@mui/icons-material/Search";
+import St from "@mui/icons-material/Close";
+import { createRoot as Ct } from "react-dom/client";
+import { autocomplete as vt } from "@algolia/autocomplete-js";
+import { useHotkeys as Tt } from "react-hotkeys-hook";
 import Pt from "@arcblock/ux/lib/Switch";
 import "@algolia/autocomplete-theme-classic/dist/theme.css";
 const Rt = (e) => [
@@ -52,22 +52,19 @@ const Rt = (e) => [
 ], Bt = (e) => [
   { name: e("blocklet.free"), value: "free" },
   { name: e("blocklet.payment"), value: "payment" }
-], $t = (e = [], o = "en") => e.map((r) => ({ name: r.locales[o] || `Category.${o}`, value: r._id })), It = (e, o) => (
+], $t = (e = [], n = "en") => e.map((r) => ({ name: r.locales[n] || `Category.${n}`, value: r._id })), It = (e, n) => (
   // eslint-disable-next-line no-prototype-builtins
-  e.replace(/{(\w*)}/g, (r, l) => o.hasOwnProperty(l) ? o[l] : "")
-), zt = () => window.innerWidth <= 600, Dt = (e, o) => {
-  const r = (e + o) / o;
-  return r > 1 ? r.toFixed() : 1;
-}, _t = (e) => ut(e).rgb().object();
-function Nt(e, o) {
+  e.replace(/{(\w*)}/g, (r, l) => n.hasOwnProperty(l) ? n[l] : "")
+), zt = () => window.innerWidth <= 600, Dt = (e) => dt(e).rgb().object();
+function _t(e, n) {
   let r;
   return function(...s) {
     return r && clearTimeout(r), new Promise((c) => {
-      r = setTimeout(() => c(e(...s)), o);
+      r = setTimeout(() => c(e(...s)), n);
     });
   };
 }
-const Ft = Nt((e) => Promise.resolve(e), 300), Lt = {
+const Nt = _t((e) => Promise.resolve(e), 300), Lt = {
   common: {
     searchStore: "Search the store",
     showResources: "Show resources",
@@ -106,7 +103,7 @@ const Ft = Nt((e) => Promise.resolve(e), 300), Lt = {
   autocomplete: {
     expandResult: 'Show {number} search results for "{name}" '
   }
-}, Mt = {
+}, Ot = {
   common: {
     searchStore: "搜索商店内应用",
     showResources: "显示资源型应用",
@@ -145,33 +142,33 @@ const Ft = Nt((e) => Promise.resolve(e), 300), Lt = {
   autocomplete: {
     expandResult: "显示 {number} 条 “{name}” 的搜索结果 "
   }
-}, ee = {
-  en: ye(Lt),
-  zh: ye(Mt)
-}, $e = {
-  filters: n.shape({
-    keyword: n.string,
-    sortBy: n.string,
-    sortDirection: n.string,
-    price: n.string,
-    category: n.string,
-    developer: n.string,
-    resourceType: n.string
+}, oe = {
+  en: xe(Lt),
+  zh: xe(Ot)
+}, Ie = {
+  filters: o.shape({
+    keyword: o.string,
+    sortBy: o.string,
+    sortDirection: o.string,
+    price: o.string,
+    category: o.string,
+    developer: o.string,
+    resourceType: o.string
   }),
-  wrapChildren: n.func,
-  extraFilter: n.func,
-  endpoint: n.string.isRequired,
-  blockletRender: n.func.isRequired,
-  onFilterChange: n.func,
-  onSearchSelect: n.func,
-  locale: n.oneOf(["zh", "en"]),
-  baseSearch: n.bool,
+  wrapChildren: o.func,
+  extraFilter: o.func,
+  endpoint: o.string.isRequired,
+  blockletRender: o.func.isRequired,
+  onFilterChange: o.func,
+  onSearchSelect: o.func,
+  locale: o.oneOf(["zh", "en"]),
+  baseSearch: o.bool,
   // sometimes blocklet list can be rendered only before the category is fetched
-  fetchCategoryDelay: n.number,
-  showResourcesSwitch: n.bool,
-  showCategory: n.bool,
-  tagFilters: n.array
-}, Ie = {
+  fetchCategoryDelay: o.number,
+  showResourcesSwitch: o.bool,
+  showCategory: o.bool,
+  tagFilters: o.array
+}, ze = {
   locale: "zh",
   filters: {},
   onFilterChange: () => {
@@ -186,21 +183,22 @@ const Ft = Nt((e) => Promise.resolve(e), 300), Lt = {
   showResourcesSwitch: !1,
   showCategory: !0,
   tagFilters: []
-}, z = {
+}, _ = {
   nameAsc: "title",
   nameDesc: "title",
   popularity: "stats.downloads",
   publishAt: "lastPublishedAt",
   mobilePageSize: 10,
   pageSize: 18,
+  currentPage: 1,
   defaultCurrentPage: 1,
   blockletsPath: "/api/v2/blocklets.json",
   categoriesPath: "/api/blocklets/categories",
   cacheSize: 100
-}, ze = Je({}), { Provider: At, Consumer: Nr } = ze;
-function le({
+}, De = Ve({}), { Provider: Ft, Consumer: Dr } = De;
+function se({
   filters: e,
-  children: o,
+  children: n,
   endpoint: r,
   locale: l,
   blockletRender: s,
@@ -210,227 +208,231 @@ function le({
   wrapChildren: p,
   baseSearch: b,
   serverVersion: u,
-  storeVersion: v,
-  fetchCategoryDelay: P,
-  showResourcesSwitch: T,
-  showCategory: R,
-  tagFilters: B
+  storeVersion: S,
+  fetchCategoryDelay: v,
+  showResourcesSwitch: C,
+  showCategory: P,
+  tagFilters: R
 }) {
   const i = {};
-  u && (i["x-blocklet-server-version"] = u), v && (i["x-blocklet-store-version"] = v);
-  const m = K(() => ct.create({
+  u && (i["x-blocklet-server-version"] = u), S && (i["x-blocklet-store-version"] = S);
+  const h = K(() => pt.create({
     baseURL: r,
     headers: i
   }), [r]), d = K(() => ({
     sortBy: "popularity",
     sortDirection: "desc",
     ...e
-  }), [e]), k = d.category, $ = Re({
-    currentPage: z.currentPage,
-    pageSize: zt() ? z.mobilePageSize : z.pageSize,
-    defaultCurrentPage: z.defaultCurrentPage
-  }), [w, _] = A(null), {
-    data: F = { list: [], total: 0 },
-    loading: X,
-    loadMore: Y,
-    loadingMore: L
-  } = tt(
-    async (a) => {
-      var N;
-      const g = {
+  }), [e]), k = d.category, $ = Be({
+    currentPage: _.currentPage,
+    pageSize: zt() ? _.mobilePageSize : _.pageSize,
+    defaultCurrentPage: _.defaultCurrentPage
+  }), [w, L] = A(null), {
+    data: M = { list: [], total: 0 },
+    loading: ee,
+    loadMore: te,
+    loadingMore: O
+  } = et(
+    async () => {
+      const { currentPage: a, pageSize: f } = $, I = {
         ...d,
-        sortBy: z[d.sortBy],
-        page: Dt(((N = a == null ? void 0 : a.list) == null ? void 0 : N.length) || 0, $.pageSize),
-        pageSize: $.pageSize
+        sortBy: _[d.sortBy],
+        page: a,
+        pageSize: f
       };
-      _(null);
-      const { data: S = {} } = await m.get(z.blockletsPath, {
-        params: g
+      L(null);
+      const { data: B = {} } = await h.get(_.blockletsPath, {
+        params: I
       });
-      return { list: (S == null ? void 0 : S.dataList) || [], total: (S == null ? void 0 : S.total) || 0 };
+      return $.currentPage++, {
+        page: a,
+        pageSize: f,
+        list: (B == null ? void 0 : B.dataList) || [],
+        total: (B == null ? void 0 : B.total) || 0
+      };
     },
     {
-      isNoMore: (a) => a ? a.list.length >= a.total : !1,
-      reloadDeps: [r, pt(e)],
+      isNoMore: (a) => a ? a.page * a.pageSize >= a.total : !1,
+      reloadDeps: [r, ut(e)],
       onError: (a) => {
-        _(a);
+        L(a);
       }
     }
   ), {
-    data: O = [],
-    error: G,
-    loading: H,
-    run: V
-  } = rt(
+    data: F = [],
+    error: W,
+    loading: V,
+    run: J
+  } = tt(
     async () => {
-      const { data: a } = await m.get(z.categoriesPath);
+      const { data: a } = await h.get(_.categoriesPath);
       return Array.isArray(a) ? a : [];
     },
     { manual: !0 }
-  ), f = K(() => st(O || [], [(g) => g.name], ["asc"]), [O]), Z = re(
-    (a, g) => {
-      const S = ee[l] ? ee[l][a] : ee.en[a];
-      return It(S, g);
+  ), m = K(() => ct(F || [], [(f) => f.name], ["asc"]), [F]), E = le(
+    (a, f) => {
+      const I = oe[l] ? oe[l][a] : oe.en[a];
+      return It(I, f);
     },
     [l]
-  ), M = K(() => {
-    let a = F.list || [];
+  ), z = K(() => {
+    let a = M.list || [];
     return a = y(a), a;
-  }, [F, y]), Ne = K(() => $t(f, l), [f, l]), Fe = Bt(Z), Le = {
-    errors: { fetchBlockletsError: w, fetchCategoriesError: G },
-    loadings: { fetchBlockletsLoading: X, fetchCategoriesLoading: H, loadingMore: L },
+  }, [M, y]), G = K(() => $t(m, l), [m, l]), X = Bt(E), Le = {
+    errors: { fetchBlockletsError: w, fetchCategoriesError: W },
+    loadings: { fetchBlockletsLoading: ee, fetchCategoriesLoading: V, loadingMore: O },
     endpoint: r,
-    blockletList: M,
+    blockletList: z,
     wrapChildren: p,
-    t: Z,
+    t: E,
     filters: d,
     selectedCategory: k,
-    categoryList: f,
+    categoryList: m,
     blockletRender: s,
     locale: l,
-    categoryOptions: Ne,
-    priceOptions: Fe,
-    storeApi: m,
+    categoryOptions: G,
+    priceOptions: X,
+    storeApi: h,
     baseSearch: b,
-    showResourcesSwitch: T,
-    showCategory: R,
-    tagFilters: B,
-    hasNextPage: F.list.length < F.total,
+    showResourcesSwitch: C,
+    showCategory: P,
+    tagFilters: R,
+    hasNextPage: $.pageSize * $.currentPage < M.total,
     onFilterChange: c,
     handleSort: (a) => {
-      const g = {
+      const f = {
         ...d,
         sortBy: a,
         sortDirection: a === "nameAsc" ? "asc" : "desc"
       };
-      c(g);
+      c(f);
     },
     handleKeyword: (a) => {
-      const g = { ...d, keyword: a || void 0 };
-      c(g);
+      const f = { ...d, keyword: a || void 0 };
+      c(f);
     },
     handlePrice: (a) => {
-      const g = {
+      const f = {
         ...d,
         price: a === d.price ? void 0 : a
       };
-      c(g);
+      c(f);
     },
     handleCategory: (a) => {
-      let g = a;
-      (a === "all" || a === d.category) && (g = void 0);
-      const S = { ...d, category: g };
-      c(S);
+      let f = a;
+      (a === "all" || a === d.category) && (f = void 0);
+      const I = { ...d, category: f };
+      c(I);
     },
     handleDeveloper: (a) => {
-      const g = { ...d, owner: a || void 0 };
-      c(g);
+      const f = { ...d, owner: a || void 0 };
+      c(f);
     },
     handlePage: (a) => {
-      const g = { ...d, currentPage: a };
-      c(g);
+      const f = { ...d, currentPage: a };
+      c(f);
     },
     handleSwitchShowResources: () => {
       const a = { ...d };
       c(a);
     },
-    loadMore: Y,
+    loadMore: te,
     getCategoryLocale: (a) => {
       if (!a)
         return null;
-      let g = null;
-      const S = O.find((N) => N._id === a);
-      return S && (g = S.locales[l]), g;
+      let f = null;
+      const I = F.find((B) => B._id === a);
+      return I && (f = I.locales[l]), f;
     },
     get developerName() {
-      var g, S;
-      return ((S = (g = M.find((N) => {
-        var he;
-        return ((he = N == null ? void 0 : N.owner) == null ? void 0 : he.did) === d.owner;
-      })) == null ? void 0 : g.owner) == null ? void 0 : S.name) || "";
+      var f, I;
+      return ((I = (f = z.find((B) => {
+        var ye;
+        return ((ye = B == null ? void 0 : B.owner) == null ? void 0 : ye.did) === d.owner;
+      })) == null ? void 0 : f.owner) == null ? void 0 : I.name) || "";
     },
     handleSearchSelect: x
   };
-  return q(() => {
+  return j(() => {
     setTimeout(() => {
-      V();
-    }, P || 0);
-  }, [r]), /* @__PURE__ */ t(At, { value: Le, children: o });
+      J();
+    }, v || 0);
+  }, [r]), /* @__PURE__ */ t(Ft, { value: Le, children: n });
 }
-le.propTypes = {
-  ...$e,
-  children: n.any.isRequired
+se.propTypes = {
+  ...Ie,
+  children: o.any.isRequired
 };
-le.defaultProps = Ie;
-function D() {
-  const e = Xe(ze);
+se.defaultProps = ze;
+function N() {
+  const e = Je(De);
   return e || {};
 }
-const Ot = C(Ae)`
+const At = T(Fe)`
   border-radius: 4px;
-`, ae = Ye(({ children: e, rounded: o, loading: r, disabled: l, ...s }, c) => /* @__PURE__ */ t(
-  Ot,
+`, ce = Xe(({ children: e, rounded: n, loading: r, disabled: l, ...s }, c) => /* @__PURE__ */ t(
+  At,
   {
     ref: c,
     disableElevation: !0,
     disabled: l || r,
     ...s,
-    startIcon: r && /* @__PURE__ */ t(te, { size: "1em" }),
+    startIcon: r && /* @__PURE__ */ t(ne, { size: "1em" }),
     children: e
   }
 ));
-ae.propTypes = {
-  children: n.any,
-  rounded: n.bool,
-  loading: n.bool,
-  disabled: n.bool
+ce.propTypes = {
+  children: o.any,
+  rounded: o.bool,
+  loading: o.bool,
+  disabled: o.bool
 };
-ae.defaultProps = {
+ce.defaultProps = {
   children: null,
   rounded: !1,
   loading: !1,
   disabled: !1
 };
-function ie({ title: e, value: o, icon: r, prepend: l, options: s, onChange: c, itemRender: x, ...y }) {
-  const p = U(null), b = ne(), [u, v] = A(!1), [P, T] = A(o !== null ? o : ""), R = Se(b.breakpoints.down("sm"));
-  q(() => {
-    T(o !== null ? o : "");
-  }, [o]);
-  const B = re(() => {
-    v(!1);
-  }, []), i = re(() => {
-    v(!0);
+function pe({ title: e, value: n, icon: r, prepend: l, options: s, onChange: c, itemRender: x, ...y }) {
+  const p = H(null), b = ie(), [u, S] = A(!1), [v, C] = A(n !== null ? n : ""), P = ve(b.breakpoints.down("sm"));
+  j(() => {
+    C(n !== null ? n : "");
+  }, [n]);
+  const R = le(() => {
+    S(!1);
+  }, []), i = le(() => {
+    S(!0);
   }, []);
-  function m(k) {
-    T(k.value), c(k.value), R && B();
+  function h(k) {
+    C(k.value), c(k.value), P && R();
   }
   function d(k) {
-    return k === P;
+    return k === v;
   }
-  return /* @__PURE__ */ h(oe, { children: [
-    /* @__PURE__ */ h(
-      Et,
+  return /* @__PURE__ */ g(ae, { children: [
+    /* @__PURE__ */ g(
+      Mt,
       {
         ref: p,
         onClick: i,
         variant: "outlined",
         size: "small",
-        className: ["my-select__selector", mt(P) ? "" : "my-select__selector--active"].join(" "),
+        className: ["my-select__selector", ht(v) ? "" : "my-select__selector--active"].join(" "),
         sx: { minWidth: "auto" },
         ...y,
         children: [
           /* @__PURE__ */ t("div", { className: "my-select__icon", children: r }),
           e,
-          /* @__PURE__ */ t(Ee, { className: "my-select__arrowdown", component: dt, fontSize: "small" })
+          /* @__PURE__ */ t(Me, { className: "my-select__arrowdown", component: mt, fontSize: "small" })
         ]
       }
     ),
-    /* @__PURE__ */ t(qe, { open: u, anchorEl: p.current, transition: !0, sx: { zIndex: "9999" }, children: ({ TransitionProps: k, placement: $ }) => /* @__PURE__ */ t(je, { ...k, sx: { transformOrigin: $ === "bottom" ? "center top" : "center bottom" }, children: /* @__PURE__ */ t(Ge, { children: /* @__PURE__ */ t(Ke, { onClickAway: B, children: /* @__PURE__ */ h(qt, { autoFocusItem: u, onMouseEnter: i, onMouseLeave: B, children: [
+    /* @__PURE__ */ t(Ee, { open: u, anchorEl: p.current, transition: !0, sx: { zIndex: "9999" }, children: ({ TransitionProps: k, placement: $ }) => /* @__PURE__ */ t(qe, { ...k, sx: { transformOrigin: $ === "bottom" ? "center top" : "center bottom" }, children: /* @__PURE__ */ t(je, { children: /* @__PURE__ */ t(Ue, { onClickAway: R, children: /* @__PURE__ */ g(Et, { autoFocusItem: u, onMouseEnter: i, onMouseLeave: R, children: [
       l,
       s.map((w) => x ? x(w) : /* @__PURE__ */ t(
-        Ue,
+        We,
         {
-          onClick: () => m(w),
+          onClick: () => h(w),
           className: [
             "my-select__option",
             d(w.value) ? "my-select__option--active" : ""
@@ -442,16 +444,16 @@ function ie({ title: e, value: o, icon: r, prepend: l, options: s, onChange: c,
     ] }) }) }) }) })
   ] });
 }
-ie.propTypes = {
-  options: n.array.isRequired,
-  value: n.oneOfType([n.string, n.number, n.array]),
-  onChange: n.func,
-  itemRender: n.func,
-  title: n.string.isRequired,
-  icon: n.any,
-  prepend: n.any
+pe.propTypes = {
+  options: o.array.isRequired,
+  value: o.oneOfType([o.string, o.number, o.array]),
+  onChange: o.func,
+  itemRender: o.func,
+  title: o.string.isRequired,
+  icon: o.any,
+  prepend: o.any
 };
-ie.defaultProps = {
+pe.defaultProps = {
   value: null,
   icon: null,
   prepend: null,
@@ -459,7 +461,7 @@ ie.defaultProps = {
   onChange: () => {
   }
 };
-const Et = C(ae)`
+const Mt = T(ce)`
   border: 1px solid #f0f0f0;
   padding: 6px 8px 6px 12px;
   font-weight: ${(e) => e.theme.typography.fontWeightBold};
@@ -490,7 +492,7 @@ const Et = C(ae)`
       margin-right: 3px;
     }
   }
-`, qt = C(Oe)`
+`, Et = T(Ae)`
   .my-select__option__icon {
     color: transparent;
     font-size: 16px;
@@ -507,8 +509,8 @@ const Et = C(ae)`
     }
   }
 `;
-function j({ options: e, onChange: o, title: r, value: l }) {
-  return /* @__PURE__ */ h(jt, { children: [
+function U({ options: e, onChange: n, title: r, value: l }) {
+  return /* @__PURE__ */ g(qt, { children: [
     /* @__PURE__ */ t("div", { className: "title", children: r }),
     /* @__PURE__ */ t("div", { className: "list", children: e.map((s) => /* @__PURE__ */ t(
       "div",
@@ -516,14 +518,14 @@ function j({ options: e, onChange: o, title: r, value: l }) {
         title: s.name,
         "data-cy": "filter",
         className: l === s.value ? "select item" : "item",
-        onClick: () => o(s.value),
+        onClick: () => n(s.value),
         children: s.name
       },
       s.value
     )) })
   ] });
 }
-const jt = C("div")`
+const qt = T("div")`
   .title {
     font-size: 18px;
     font-weight: bold;
@@ -551,24 +553,24 @@ const jt = C("div")`
     font-weight: bold;
   }
 `;
-j.propTypes = {
-  title: n.string.isRequired,
-  options: n.array.isRequired,
-  onChange: n.func.isRequired,
-  value: n.oneOfType([n.string, n.number])
+U.propTypes = {
+  title: o.string.isRequired,
+  options: o.array.isRequired,
+  onChange: o.func.isRequired,
+  value: o.oneOfType([o.string, o.number])
 };
-j.defaultProps = {
+U.defaultProps = {
   value: null
 };
-function se() {
-  const { selectedCategory: e, handleCategory: o, t: r, handlePrice: l, filters: s, categoryOptions: c, priceOptions: x } = D(), [y, p] = A(!1), b = (u, v) => {
-    u === "category" && o(v), u === "price" && l(v), p(!1);
+function ue() {
+  const { selectedCategory: e, handleCategory: n, t: r, handlePrice: l, filters: s, categoryOptions: c, priceOptions: x } = N(), [y, p] = A(!1), b = (u, S) => {
+    u === "category" && n(S), u === "price" && l(S), p(!1);
   };
-  return /* @__PURE__ */ h(Gt, { children: [
-    /* @__PURE__ */ t(gt, { variant: "outlined", className: "filter-button", onClick: () => p(!0), children: /* @__PURE__ */ t(ht, { className: "filter-icon", fontSize: "small" }) }),
-    /* @__PURE__ */ h(ft, { fullWidth: !0, title: "", open: y, onClose: () => p(!1), children: [
+  return /* @__PURE__ */ g(jt, { children: [
+    /* @__PURE__ */ t(yt, { variant: "outlined", className: "filter-button", onClick: () => p(!0), children: /* @__PURE__ */ t(ft, { className: "filter-icon", fontSize: "small" }) }),
+    /* @__PURE__ */ g(gt, { fullWidth: !0, title: "", open: y, onClose: () => p(!1), children: [
       /* @__PURE__ */ t(
-        j,
+        U,
         {
           title: r("common.price"),
           options: x,
@@ -579,7 +581,7 @@ function se() {
         }
       ),
       c.length > 0 && /* @__PURE__ */ t("div", { style: { marginTop: "16px" }, children: /* @__PURE__ */ t(
-        j,
+        U,
         {
           title: r("common.category"),
           options: c,
@@ -592,7 +594,7 @@ function se() {
     ] })
   ] });
 }
-const Gt = C("div")`
+const jt = T("div")`
   .filter-button {
     border-color: rgb(240, 240, 240);
     padding: 5px 8px;
@@ -603,9 +605,9 @@ const Gt = C("div")`
     color: ${(e) => e.theme.palette.grey[500]};
   }
 `;
-se.propTypes = {};
-se.defaultProps = {};
-const Kt = C("div")`
+ue.propTypes = {};
+ue.defaultProps = {};
+const Ut = T("div")`
   .MuiChip-root {
     border-radius: 4px;
     height: initial;
@@ -614,72 +616,72 @@ const Kt = C("div")`
     padding: 4px 0;
   }
 `;
-function E({ label: e, icon: o, onDelete: r, ...l }) {
-  return e ? /* @__PURE__ */ t(Kt, { ...l, children: /* @__PURE__ */ t(Ce, { color: "primary", "data-cy": "filter-tag", icon: o, label: e, onDelete: r }) }) : null;
+function q({ label: e, icon: n, onDelete: r, ...l }) {
+  return e ? /* @__PURE__ */ t(Ut, { ...l, children: /* @__PURE__ */ t(Te, { color: "primary", "data-cy": "filter-tag", icon: n, label: e, onDelete: r }) }) : null;
 }
-E.propTypes = {
-  label: n.string,
-  onDelete: n.func,
-  icon: n.element
+q.propTypes = {
+  label: o.string,
+  onDelete: o.func,
+  icon: o.element
 };
-E.defaultProps = {
+q.defaultProps = {
   onDelete: null,
   icon: null,
   label: null
 };
-function be() {
-  const { t: e } = D();
-  return /* @__PURE__ */ t(Be, { style: { textAlign: "center" }, variant: "subtitle2", children: e("blocklet.noResults") });
+function ke() {
+  const { t: e } = N();
+  return /* @__PURE__ */ t($e, { style: { textAlign: "center" }, variant: "subtitle2", children: e("blocklet.noResults") });
 }
-function W({ filterTip: e, keywordTip: o }) {
-  const { t: r, locale: l } = D(), s = () => l === "zh" ? "、" : " , ";
-  return /* @__PURE__ */ h(wt, { className: "tips", children: [
+function Q({ filterTip: e, keywordTip: n }) {
+  const { t: r, locale: l } = N(), s = () => l === "zh" ? "、" : " , ";
+  return /* @__PURE__ */ g(xt, { className: "tips", children: [
     /* @__PURE__ */ t("span", { style: { marginRight: "16px" }, children: r("blocklet.emptyTip") }),
     e && /* @__PURE__ */ t("span", { children: r("blocklet.filterTip") }),
-    e && o && s(),
-    o && /* @__PURE__ */ t("span", { children: r("blocklet.keywordTip") })
+    e && n && s(),
+    n && /* @__PURE__ */ t("span", { children: r("blocklet.keywordTip") })
   ] });
 }
-W.propTypes = {
-  filterTip: n.bool,
-  keywordTip: n.bool
+Q.propTypes = {
+  filterTip: o.bool,
+  keywordTip: o.bool
 };
-W.defaultProps = {
+Q.defaultProps = {
   filterTip: !1,
   keywordTip: !1
 };
-function J({ primaryStart: e, primaryEnd: o, filter: r }) {
-  return /* @__PURE__ */ h(Be, { variant: "subtitle2", children: [
+function Z({ primaryStart: e, primaryEnd: n, filter: r }) {
+  return /* @__PURE__ */ g($e, { variant: "subtitle2", children: [
     /* @__PURE__ */ t("span", { children: e }),
-    /* @__PURE__ */ h("span", { className: "primary", children: [
+    /* @__PURE__ */ g("span", { className: "primary", children: [
       " ",
       r,
       " "
     ] }),
-    /* @__PURE__ */ h("span", { children: [
-      o,
+    /* @__PURE__ */ g("span", { children: [
+      n,
       " "
     ] })
   ] });
 }
-J.propTypes = {
-  primaryStart: n.string.isRequired,
-  primaryEnd: n.string.isRequired,
-  filter: n.string.isRequired
+Z.propTypes = {
+  primaryStart: o.string.isRequired,
+  primaryEnd: o.string.isRequired,
+  filter: o.string.isRequired
 };
-function Ut(e) {
+function Wt(e) {
   return e ? e.width > 900 ? 12 : e.width > 600 ? 8 : 4 : 0;
 }
-function De({ children: e }) {
-  const o = U(null), [r, l] = A(null), s = ot(r);
-  return q(() => {
-    r || l(o.current);
-  }, [r]), e(o, Ut(s));
+function _e({ children: e }) {
+  const n = H(null), [r, l] = A(null), s = rt(r);
+  return j(() => {
+    r || l(n.current);
+  }, [r]), e(n, Wt(s));
 }
-De.propTypes = {
-  children: n.func.isRequired
+_e.propTypes = {
+  children: o.func.isRequired
 };
-function ce({ blocklets: e, ...o }) {
+function de({ blocklets: e, ...n }) {
   const {
     blockletRender: r,
     errors: l,
@@ -690,86 +692,83 @@ function ce({ blocklets: e, ...o }) {
     t: p,
     hasNextPage: b,
     loadMore: u,
-    endpoint: v
-  } = D(), P = !!c || !!y.price, [T] = bt({
+    endpoint: S
+  } = N(), v = !!c || !!y.price, [C] = wt({
     loading: s.fetchBlockletsLoading || s.loadingMore,
     hasNextPage: b,
     onLoadMore: u
   });
   if (l.fetchBlockletsError)
     return /* @__PURE__ */ t(
-      Pe,
+      Re,
       {
-        error: new Error(`Failed to fetch blocklets from ${v}: ${l.fetchBlockletsError.message}`)
+        error: new Error(`Failed to fetch blocklets from ${S}: ${l.fetchBlockletsError.message}`)
       }
     );
   if (s.fetchBlockletsLoading)
-    return /* @__PURE__ */ t(I, { height: 60, display: "flex", alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ t(te, {}) });
-  if (y.keyword && P && e.length === 0)
-    return /* @__PURE__ */ h(Q, { children: [
+    return /* @__PURE__ */ t(D, { height: 60, display: "flex", alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ t(ne, {}) });
+  if (y.keyword && v && e.length === 0)
+    return /* @__PURE__ */ g(Y, { children: [
       /* @__PURE__ */ t(
-        J,
+        Z,
         {
           primaryStart: p("blocklet.noBlockletPart1"),
           primaryEnd: p("blocklet.noBlockletPart2"),
           filter: y.keyword
         }
       ),
-      /* @__PURE__ */ t(W, { keywordTip: !0, filterTip: !0 })
+      /* @__PURE__ */ t(Q, { keywordTip: !0, filterTip: !0 })
     ] });
   if (y.keyword && e.length === 0)
-    return /* @__PURE__ */ h(Q, { children: [
+    return /* @__PURE__ */ g(Y, { children: [
       /* @__PURE__ */ t(
-        J,
+        Z,
         {
           primaryStart: p("blocklet.noBlockletPart1"),
           primaryEnd: p("blocklet.noBlockletPart2"),
           filter: y.keyword
         }
       ),
-      /* @__PURE__ */ t(W, { keywordTip: !0 })
+      /* @__PURE__ */ t(Q, { keywordTip: !0 })
     ] });
-  if (P && e.length === 0) {
-    const R = x(c);
-    return /* @__PURE__ */ h(Q, { children: [
-      R ? /* @__PURE__ */ t(
-        J,
+  if (v && e.length === 0) {
+    const P = x(c);
+    return /* @__PURE__ */ g(Y, { children: [
+      P ? /* @__PURE__ */ t(
+        Z,
         {
           primaryStart: p("blocklet.noCategoryResults1"),
           primaryEnd: p("blocklet.noCategoryResults2"),
-          filter: R
+          filter: P
         }
-      ) : /* @__PURE__ */ t(be, {}),
-      /* @__PURE__ */ t(W, { filterTip: !0 })
+      ) : /* @__PURE__ */ t(ke, {}),
+      /* @__PURE__ */ t(Q, { filterTip: !0 })
     ] });
   }
-  return e.length === 0 ? /* @__PURE__ */ t(Q, { children: /* @__PURE__ */ t(be, {}) }) : /* @__PURE__ */ t(De, { children: (R, B) => /* @__PURE__ */ h(Wt, { container: !0, ...o, columns: B, ref: R, children: [
-    e.map((i) => /* @__PURE__ */ t(we, { item: !0, xs: 4, "data-blocklet-did": i.did, children: r({ blocklet: i, blocklets: e }) }, i.did)),
-    b && /* @__PURE__ */ t(we, { item: !0, xs: 12, ref: T, children: /* @__PURE__ */ t(I, { height: 60, display: "flex", justifyContent: "center", children: /* @__PURE__ */ t(te, {}) }) })
-  ] }) });
+  return e.length === 0 ? /* @__PURE__ */ t(Y, { children: /* @__PURE__ */ t(ke, {}) }) : /* @__PURE__ */ t(_e, { children: (P, R) => /* @__PURE__ */ g(
+    re,
+    {
+      ...n,
+      container: !0,
+      spacing: 2,
+      columns: R,
+      disableEqualOverflow: !0,
+      ref: P,
+      sx: {
+        opacity: () => R > 0 ? 1 : 0
+      },
+      children: [
+        e.map((i) => /* @__PURE__ */ t(re, { xs: 4, "data-blocklet-did": i.did, children: r({ blocklet: i, blocklets: e }) }, i.did)),
+        b && /* @__PURE__ */ t(re, { xs: 12, ref: C, children: /* @__PURE__ */ t(D, { height: 60, display: "flex", justifyContent: "center", children: /* @__PURE__ */ t(ne, {}) }) })
+      ]
+    }
+  ) });
 }
-ce.propTypes = {
-  blocklets: n.array.isRequired
+de.propTypes = {
+  blocklets: o.array.isRequired
 };
-ce.defaultProps = {};
-const Wt = C(ve)`
-  opacity: ${(e) => e.columns > 0 ? 1 : 0};
-  &.MuiGrid-root {
-    width: 100%;
-    margin: 0 -16px;
-  }
-`, we = C(ve)`
-  @media (max-width: ${(e) => e.theme.breakpoints.values.sm}px) {
-    &.MuiGrid-item {
-      padding-bottom: 0px;
-    }
-  }
-  @media (min-width: ${(e) => e.theme.breakpoints.values.sm}px) {
-    &.MuiGrid-item {
-      margin-bottom: ${(e) => e.theme.spacing(2)};
-    }
-  }
-`, Q = C(yt)`
+de.defaultProps = {};
+const Y = T(bt)`
   text-align: center;
   .primary {
     color: ${(e) => e.theme.palette.primary.main};
@@ -778,22 +777,22 @@ const Wt = C(ve)`
     margin-top: ${(e) => e.theme.spacing(1)};
   }
 `;
-function pe() {
-  const { selectedCategory: e, handleCategory: o, t: r, handlePrice: l, filters: s, categoryOptions: c, priceOptions: x } = D();
-  return /* @__PURE__ */ h(Ht, { children: [
-    /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(j, { title: r("common.price"), options: x, value: s.price, onChange: l }) }),
+function me() {
+  const { selectedCategory: e, handleCategory: n, t: r, handlePrice: l, filters: s, categoryOptions: c, priceOptions: x } = N();
+  return /* @__PURE__ */ g(Gt, { children: [
+    /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(U, { title: r("common.price"), options: x, value: s.price, onChange: l }) }),
     c.length > 0 && /* @__PURE__ */ t("div", { style: { marginTop: "16px" }, children: /* @__PURE__ */ t(
-      j,
+      U,
       {
         title: r("common.category"),
         options: c,
         value: e,
-        onChange: o
+        onChange: n
       }
     ) })
   ] });
 }
-const Ht = C("aside")`
+const Gt = T("aside")`
   width: 220px;
   margin-right: ${(e) => e.theme.spacing(2)};
   height: 100%;
@@ -802,41 +801,41 @@ const Ht = C("aside")`
   overflow-y: auto;
   z-index: auto;
 `;
-pe.propTypes = {};
-pe.defaultProps = {};
-function ue({ placeholder: e, ...o }) {
-  const { filters: r, handleKeyword: l } = D(), [s, c] = A(r.keyword || ""), x = nt(l, { wait: 300 }), y = (b) => {
+me.propTypes = {};
+me.defaultProps = {};
+function he({ placeholder: e, ...n }) {
+  const { filters: r, handleKeyword: l } = N(), [s, c] = A(r.keyword || ""), x = ot(l, { wait: 300 }), y = (b) => {
     const { value: u } = b.target;
     c(u), x.run(u);
   }, p = () => {
     c(""), l();
   };
-  return q(() => {
+  return j(() => {
     c(r.keyword || "");
   }, [r.keyword]), /* @__PURE__ */ t(
-    Vt,
+    Kt,
     {
       inputProps: {
         "data-cy": "search-blocklet"
       },
-      startAdornment: /* @__PURE__ */ t(fe, { position: "start", children: /* @__PURE__ */ t(Qt, {}) }),
+      startAdornment: /* @__PURE__ */ t(be, { position: "start", children: /* @__PURE__ */ t(Ht, {}) }),
       onChange: y,
       placeholder: e,
       value: s,
       title: e,
       "data-cy": "search",
-      endAdornment: s && /* @__PURE__ */ t(fe, { position: "end", children: /* @__PURE__ */ t(Jt, { "data-cy": "search-delete", onClick: p }) }),
-      ...o
+      endAdornment: s && /* @__PURE__ */ t(be, { position: "end", children: /* @__PURE__ */ t(Qt, { "data-cy": "search-delete", onClick: p }) }),
+      ...n
     }
   );
 }
-ue.propTypes = {
-  placeholder: n.string
+he.propTypes = {
+  placeholder: o.string
 };
-ue.defaultProps = {
+he.defaultProps = {
   placeholder: "Type to search..."
 };
-const Vt = C(We)`
+const Kt = T(Ge)`
   background-color: ${(e) => e.theme.palette.grey[50]};
   font-size: 14px;
   border-radius: 6px;
@@ -853,49 +852,49 @@ const Vt = C(We)`
       color: transparent;
     }
   }
-`, Qt = C(xt)`
+`, Ht = T(kt)`
   color: ${(e) => e.theme.palette.grey[500]};
   font-size: 28px;
   @media (max-width: ${(e) => e.theme.breakpoints.values.md}px) {
     font-size: 24px;
   }
-`, Jt = C(kt)`
+`, Qt = T(St)`
   color: ${(e) => e.theme.palette.grey[500]};
   font-size: 16px;
   cursor: pointer;
 `;
-function de({ onSelect: e, wrapChildren: o }) {
-  const r = U(null), l = U(null), s = U(null), { storeApi: c, blockletRender: x, filters: y, endpoint: p, handleKeyword: b, t: u } = D(), v = async (i) => {
-    const { data: m } = await c.get(z.blockletsPath, { params: i }), d = m.dataList || [];
-    return d.length > 0 && d.unshift({ type: "more-result", total: m.total || 0 }), d;
-  }, P = (i) => {
+function fe({ onSelect: e, wrapChildren: n }) {
+  const r = H(null), l = H(null), s = H(null), { storeApi: c, blockletRender: x, filters: y, endpoint: p, handleKeyword: b, t: u } = N(), S = async (i) => {
+    const { data: h } = await c.get(_.blockletsPath, { params: i }), d = h.dataList || [];
+    return d.length > 0 && d.unshift({ type: "more-result", total: h.total || 0 }), d;
+  }, v = (i) => {
     b(i.state.query), i.setIsOpen(!1);
-  }, T = () => {
+  }, C = () => {
     r.current && setTimeout(() => {
       const i = r.current.querySelector("input.bl-autocomplete-input");
       i && i.focus();
     });
-  }, R = (i) => {
-    i.setIsOpen(!1), T();
-  }, B = ({ prevState: i, state: m }) => {
-    i.query !== m.query && (m.query || b());
+  }, P = (i) => {
+    i.setIsOpen(!1), C();
+  }, R = ({ prevState: i, state: h }) => {
+    i.query !== h.query && (h.query || b());
   };
-  return vt(
+  return Tt(
     "ctrl + k, command + k",
-    (i) => (i.stopPropagation(), i.preventDefault(), T(), !1),
+    (i) => (i.stopPropagation(), i.preventDefault(), C(), !1),
     { enableOnTags: ["INPUT"] }
-  ), q(() => {
-    T();
-  }, [p]), q(() => {
+  ), j(() => {
+    C();
+  }, [p]), j(() => {
     if (!r.current)
       return;
-    const i = Ct({
+    const i = vt({
       container: r.current,
-      renderer: { createElement: Ze, Fragment: et, render: () => {
+      renderer: { createElement: Ye, Fragment: Ze, render: () => {
       } },
-      render({ children: m }, d) {
+      render({ children: h }, d) {
         var k;
-        (!l.current || s.current !== d) && (s.current = d, (k = l.current) == null || k.unmount(), l.current = St(d)), l.current.render(o(m));
+        (!l.current || s.current !== d) && (s.current = d, (k = l.current) == null || k.unmount(), l.current = Ct(d)), l.current.render(n(h));
       },
       autoFocus: !0,
       openOnFocus: !1,
@@ -918,42 +917,42 @@ function de({ onSelect: e, wrapChildren: o }) {
       initialState: {
         query: y.keyword
       },
-      onStateChange(m) {
-        B(m);
+      onStateChange(h) {
+        R(h);
       },
-      onSubmit: P,
-      onReset(m) {
-        R(m);
+      onSubmit: v,
+      onReset(h) {
+        P(h);
       },
-      getSources({ query: m, state: d, ...k }) {
+      getSources({ query: h, state: d, ...k }) {
         const $ = {
           ...y,
-          sortBy: z[y.sortBy],
+          sortBy: _[y.sortBy],
           page: 1,
           pageSize: 10,
-          keyword: m
+          keyword: h
         };
-        return Ft([
+        return Nt([
           {
             sourceId: "blocklets",
             getItems() {
-              return v($);
+              return S($);
             },
             // 选中后填充 搜索框中值
             getItemInputValue({ item: w }) {
-              return w.type === "more-result" ? m : w.title;
+              return w.type === "more-result" ? h : w.title;
             },
             // 选中或者点击自动完成列表中的 item 时触发
-            onSelect({ event: w, item: _ }) {
-              return _.type === "more-result" ? (k.setIsOpen(!1), b(m)) : w.type === "keydown" ? b(_.title) : e({
-                blocklet: _,
-                detailUrl: Tt(p, `/blocklets/${_.did}`),
+            onSelect({ event: w, item: L }) {
+              return L.type === "more-result" ? (k.setIsOpen(!1), b(h)) : w.type === "keydown" ? b(L.title) : e({
+                blocklet: L,
+                detailUrl: it(p, `/blocklets/${L.did}`),
                 storeUrl: p
               });
             },
             templates: {
               item({ item: w }) {
-                return w.type === "more-result" ? /* @__PURE__ */ t("div", { children: u("autocomplete.expandResult", { name: m, number: w.total.toLocaleString() }) }) : x({ blocklet: w, autocompleteSetters: k });
+                return w.type === "more-result" ? /* @__PURE__ */ t("div", { children: u("autocomplete.expandResult", { name: h, number: w.total.toLocaleString() }) }) : x({ blocklet: w, autocompleteSetters: k });
               },
               noResults() {
                 return u("blocklet.noResults");
@@ -966,11 +965,11 @@ function de({ onSelect: e, wrapChildren: o }) {
     return () => {
       i.destroy();
     };
-  }, [y, x]), /* @__PURE__ */ h(oe, { children: [
+  }, [y, x]), /* @__PURE__ */ g(ae, { children: [
     /* @__PURE__ */ t(
-      xe,
+      Se,
       {
-        styles: ke`
+        styles: Ce`
           .bl-autocomplete-detached-container {
             .bl-autocomplete-detached-cancel {
               white-space: nowrap;
@@ -982,37 +981,37 @@ function de({ onSelect: e, wrapChildren: o }) {
     /* @__PURE__ */ t("div", { className: "bl-search-container", ref: r })
   ] });
 }
-de.propTypes = {
-  onSelect: n.func.isRequired,
-  wrapChildren: n.func
+fe.propTypes = {
+  onSelect: o.func.isRequired,
+  wrapChildren: o.func
 };
-de.defaultProps = {
+fe.defaultProps = {
   wrapChildren: (e) => e
 };
-function me({ t: e }) {
-  const { filters: o, handleSwitchShowResources: r } = D(), l = () => {
-    o.showResources = !o.showResources, r();
+function ge({ t: e }) {
+  const { filters: n, handleSwitchShowResources: r } = N(), l = () => {
+    n.showResources = !n.showResources, r();
   };
   return /* @__PURE__ */ t(
     Pt,
     {
-      checked: o.showResources,
+      checked: n.showResources,
       onChange: l,
       labelProps: {
-        label: /* @__PURE__ */ t(Te, { marginLeft: "8px", fontSize: "small", children: /* @__PURE__ */ t("span", { children: e("common.showResources") }) })
+        label: /* @__PURE__ */ t(Pe, { marginLeft: "8px", fontSize: "small", children: /* @__PURE__ */ t("span", { children: e("common.showResources") }) })
       }
     }
   );
 }
-me.propTypes = {
-  t: n.func.isRequired
+ge.propTypes = {
+  t: o.func.isRequired
 };
-me.defaultProps = {};
-function Xt() {
-  var H, V;
+ge.defaultProps = {};
+function Vt() {
+  var V, J;
   const {
     handleDeveloper: e,
-    blockletList: o,
+    blockletList: n,
     filters: r,
     developerName: l,
     handleSort: s,
@@ -1022,43 +1021,47 @@ function Xt() {
     t: p,
     getCategoryLocale: b,
     priceOptions: u,
-    wrapChildren: v,
-    showResourcesSwitch: P,
-    showCategory: T,
-    baseSearch: R,
-    onFilterChange: B,
+    wrapChildren: S,
+    showResourcesSwitch: v,
+    showCategory: C,
+    baseSearch: P,
+    onFilterChange: R,
     tagFilters: i
-  } = D(), m = Rt(p), d = ((H = m.find((f) => f.value === r.sortBy)) == null ? void 0 : H.name) || p("sort.sort"), k = b(r.category), { resourceType: $ } = r || {}, w = (V = u.find((f) => f.value === r.price)) == null ? void 0 : V.name, [_, F] = A(!1), X = ne(), Y = Se(() => X.breakpoints.down("md")), L = Re({
+  } = N(), h = Rt(p), d = ((V = h.find((m) => m.value === r.sortBy)) == null ? void 0 : V.name) || p("sort.sort"), k = b(r.category), { resourceType: $ } = r || {}, w = (J = u.find((m) => m.value === r.price)) == null ? void 0 : J.name, [L, M] = A(!1), ee = ie(), te = ve(() => ee.breakpoints.down("md")), O = Be({
     chooseTagId: ""
-  }), O = lt((f) => {
-    L.chooseTagId = f.id, ["category", "resourceType", "resourceDid"].forEach((M) => {
-      typeof f.params[M] > "u" ? delete r[M] : r[M] = f.params[M];
-    }), B(r);
-  }), G = at(() => i.find((f) => f.id === L.chooseTagId), [L.chooseTagId]);
-  return it(() => {
-    i.length > 0 && O(i[0]);
-  }), /* @__PURE__ */ h(I, { display: "flex", alignItems: "flex-start", height: "100%", children: [
-    T ? /* @__PURE__ */ t(ge, { mdDown: !0, children: /* @__PURE__ */ t(pe, {}) }) : null,
-    /* @__PURE__ */ h(Yt, { children: [
-      /* @__PURE__ */ h(Zt, { children: [
-        /* @__PURE__ */ h(
-          I,
+  }), F = nt((m) => {
+    O.chooseTagId = m.id, ["category", "resourceType", "resourceDid"].forEach((z) => {
+      typeof m.params[z] > "u" ? delete r[z] : r[z] = m.params[z];
+    }), R(r);
+  }), W = lt(() => i.find((m) => m.id === O.chooseTagId), [O.chooseTagId]);
+  return at(() => {
+    const m = st(window.location.search), E = i.find((z) => {
+      const G = z.params;
+      return G ? Object.keys(G).every((X) => m[X] === G[X]) : !1;
+    });
+    E ? F(E) : i.length > 0 && F(i[0]);
+  }), /* @__PURE__ */ g(D, { display: "flex", alignItems: "flex-start", height: "100%", children: [
+    C ? /* @__PURE__ */ t(we, { mdDown: !0, children: /* @__PURE__ */ t(me, {}) }) : null,
+    /* @__PURE__ */ g(Jt, { children: [
+      /* @__PURE__ */ g(Xt, { children: [
+        /* @__PURE__ */ g(
+          D,
           {
             className: "filter-bar",
             sx: {
               display: "flex",
               flexDirection: {
                 lg: "row",
-                md: P ? "column" : "row"
+                md: v ? "column" : "row"
               },
               alignItems: {
                 lg: "center",
-                md: P ? "flex-start" : "center"
+                md: v ? "flex-start" : "center"
               },
               gap: 1
             },
             children: [
-              T ? /* @__PURE__ */ t(ge, { mdUp: !0, children: /* @__PURE__ */ t(se, {}) }) : null,
+              C ? /* @__PURE__ */ t(we, { mdUp: !0, children: /* @__PURE__ */ t(ue, {}) }) : null,
               /* @__PURE__ */ t(
                 "form",
                 {
@@ -1067,29 +1070,29 @@ function Xt() {
                     flex: 1,
                     width: "100%"
                   },
-                  onSubmit: (f) => {
-                    f.preventDefault(), f.stopPropagation();
+                  onSubmit: (m) => {
+                    m.preventDefault(), m.stopPropagation();
                   },
                   onFocus: () => {
-                    F(!0);
+                    M(!0);
                   },
                   onBlur: () => {
-                    F(!1);
+                    M(!1);
                   },
-                  children: R ? /* @__PURE__ */ t(ue, { className: "bl-search-container", placeholder: p("common.searchStore") }) : /* @__PURE__ */ t(de, { onSelect: y, wrapChildren: v })
+                  children: P ? /* @__PURE__ */ t(he, { className: "bl-search-container", placeholder: p("common.searchStore") }) : /* @__PURE__ */ t(fe, { onSelect: y, wrapChildren: S })
                 }
               ),
-              /* @__PURE__ */ h(I, { className: "filter-container", display: "flex", alignItems: "center", children: [
-                !Y && P && /* @__PURE__ */ t(I, { ml: 1, mr: 1, children: /* @__PURE__ */ t(me, { t: p }) }),
+              /* @__PURE__ */ g(D, { className: "filter-container", display: "flex", alignItems: "center", children: [
+                !te && v && /* @__PURE__ */ t(D, { ml: 1, mr: 1, children: /* @__PURE__ */ t(ge, { t: p }) }),
                 /* @__PURE__ */ t(
-                  ie,
+                  pe,
                   {
                     value: r.sortBy,
-                    options: m,
+                    options: h,
                     title: d,
-                    icon: /* @__PURE__ */ t(Me, {}),
-                    onChange: (f) => {
-                      s(f);
+                    icon: /* @__PURE__ */ t(Oe, {}),
+                    onChange: (m) => {
+                      s(m);
                     }
                   }
                 )
@@ -1097,19 +1100,19 @@ function Xt() {
             ]
           }
         ),
-        T ? /* @__PURE__ */ h(I, { display: "flex", flexWrap: "wrap", alignItems: "center", mb: "16px", children: [
+        C ? /* @__PURE__ */ g(D, { display: "flex", flexWrap: "wrap", alignItems: "center", mb: "16px", children: [
           /* @__PURE__ */ t(
-            E,
+            q,
             {
               label: l,
-              icon: /* @__PURE__ */ t(Ve, {}),
+              icon: /* @__PURE__ */ t(He, {}),
               onDelete: () => {
                 e(null);
               }
             }
           ),
           /* @__PURE__ */ t(
-            E,
+            q,
             {
               label: k,
               onDelete: () => {
@@ -1118,7 +1121,7 @@ function Xt() {
             }
           ),
           /* @__PURE__ */ t(
-            E,
+            q,
             {
               label: w,
               onDelete: () => {
@@ -1126,30 +1129,30 @@ function Xt() {
               }
             }
           ),
-          $ && /* @__PURE__ */ t(E, { label: `${p("common.resourceType")}: ${$}` })
+          $ && /* @__PURE__ */ t(q, { label: `${p("common.resourceType")}: ${$}` })
         ] }) : null
       ] }),
-      /* @__PURE__ */ t(Qe, { FallbackComponent: Pe, children: /* @__PURE__ */ h(I, { sx: { position: "relative", flex: 1, overflow: "auto" }, children: [
-        (i == null ? void 0 : i.length) > 0 ? /* @__PURE__ */ h(oe, { children: [
-          /* @__PURE__ */ t(He, { my: 1, direction: "row", spacing: 1.5, useFlexGap: !0, flexWrap: "wrap", justifyContent: "flex-start", children: i.map((f) => /* @__PURE__ */ t(
-            Ce,
+      /* @__PURE__ */ t(Qe, { FallbackComponent: Re, children: /* @__PURE__ */ g(D, { sx: { position: "relative", flex: 1, overflow: "auto" }, children: [
+        (i == null ? void 0 : i.length) > 0 ? /* @__PURE__ */ g(ae, { children: [
+          /* @__PURE__ */ t(Ke, { my: 1, direction: "row", spacing: 1.5, useFlexGap: !0, flexWrap: "wrap", justifyContent: "flex-start", children: i.map((m) => /* @__PURE__ */ t(
+            Te,
             {
-              label: f.title,
+              label: m.title,
               size: "small",
-              variant: L.chooseTagId === f.id ? "contained" : "outlined",
-              onClick: () => O(f),
-              color: L.chooseTagId === f.id ? "primary" : "default"
+              variant: O.chooseTagId === m.id ? "contained" : "outlined",
+              onClick: () => F(m),
+              color: O.chooseTagId === m.id ? "primary" : "default"
             },
-            f.id
+            m.id
           )) }),
-          G ? /* @__PURE__ */ t(I, { mb: 2, children: G.description ? /* @__PURE__ */ t(Te, { variant: "body1", children: G.description }) : null }) : null
+          W ? /* @__PURE__ */ t(D, { mb: 2, children: W.description ? /* @__PURE__ */ t(Pe, { variant: "body1", children: W.description }) : null }) : null
         ] }) : null,
-        /* @__PURE__ */ t(ce, { blocklets: o })
+        /* @__PURE__ */ t(de, { blocklets: n })
       ] }) })
     ] })
   ] });
 }
-const Yt = C("main")`
+const Jt = T("main")`
   display: flex;
   flex-direction: column;
   flex: 1;
@@ -1187,29 +1190,29 @@ const Yt = C("main")`
       font-size: 12px;
     }
   }
-`, Zt = C("div")`
+`, Xt = T("div")`
   position: sticky;
   top: 0;
   z-index: 9;
   background-color: white;
 `;
-function _e(e) {
-  const o = ne(), r = _t(o.palette.primary.main), l = {
-    autocomplete: ke`
+function Ne(e) {
+  const n = ie(), r = Dt(n.palette.primary.main), l = {
+    autocomplete: Ce`
       :root {
-        --aa-detached-media-query: (max-width: ${o.breakpoints.values.md}px) !important;
-        --aa-detached-modal-media-query: (min-width: ${o.breakpoints.values.md}px) !important;
-        --aa-detached-modal-max-width: ${o.breakpoints.values.md}px !important;
+        --aa-detached-media-query: (max-width: ${n.breakpoints.values.md}px) !important;
+        --aa-detached-modal-media-query: (min-width: ${n.breakpoints.values.md}px) !important;
+        --aa-detached-modal-max-width: ${n.breakpoints.values.md}px !important;
         --aa-selected-color-rgb: ${r.r}, ${r.g}, ${r.b} !important;
         --aa-primary-color-rgb: ${r.r}, ${r.g}, ${r.b} !important;
         --aa-input-background-color-rgb: 250, 250, 250 !important;
       }
       .bl-autocomplete-panel {
-        z-index: ${o.zIndex.modal};
+        z-index: ${n.zIndex.modal};
       }
       .bl-autocomplete-label {
         .aa-SubmitIcon {
-          color: ${o.palette.grey[500]} !important;
+          color: ${n.palette.grey[500]} !important;
         }
       }
       .bl-autocomplete-form {
@@ -1225,7 +1228,7 @@ function _e(e) {
           box-shadow: none !important;
         }
         .aa-SubmitIcon {
-          color: ${o.palette.grey[500]} !important;
+          color: ${n.palette.grey[500]} !important;
         }
       }
       .aa-Panel .arcblock-blocklet button {
@@ -1233,13 +1236,13 @@ function _e(e) {
       }
     `
   };
-  return /* @__PURE__ */ h(le, { ...e, children: [
-    /* @__PURE__ */ t(xe, { styles: l.autocomplete }),
-    /* @__PURE__ */ t(Xt, {})
+  return /* @__PURE__ */ g(se, { ...e, children: [
+    /* @__PURE__ */ t(Se, { styles: l.autocomplete }),
+    /* @__PURE__ */ t(Vt, {})
   ] });
 }
-_e.propTypes = $e;
-_e.defaultProps = Ie;
+Ne.propTypes = Ie;
+Ne.defaultProps = ze;
 export {
-  _e as default
+  Ne as default
 };