@arcblock/ux 3.1.39 → 3.1.41

package/lib/Config/theme-mode-toggle.js

@@ -1,11 +1,19 @@
 import { jsx as e } from "react/jsx-runtime";
-import { IconButton as n } from "@mui/material";
-import { Brightness2Outlined as i, LightModeOutlined as l } from "@mui/icons-material";
-import { useColorScheme as s } from "../Theme/theme-provider.js";
-function f() {
-  const { mode: r, toggleMode: o, prefer: t } = s();
-  return o ? t === "system" || window.blocklet?.theme?.prefer === "system" ? /* @__PURE__ */ e(n, { onClick: o, children: r === "light" ? /* @__PURE__ */ e(i, {}) : /* @__PURE__ */ e(l, {}) }) : null : (process.env.NODE_ENV !== "production" && console.warn("Please ensure the component is wrapped with ConfigProvider context"), null);
+import { IconButton as i } from "@mui/material";
+import { Brightness2Outlined as l, LightModeOutlined as s } from "@mui/icons-material";
+import { useThrottleFn as m } from "ahooks";
+import { useColorScheme as u } from "../Theme/theme-provider.js";
+function g() {
+  const { mode: t, toggleMode: o, prefer: r } = u(), { run: n } = m(
+    () => {
+      o();
+    },
+    {
+      wait: 300
+    }
+  );
+  return o ? r === "system" || window.blocklet?.theme?.prefer === "system" ? /* @__PURE__ */ e(i, { onClick: n, children: t === "light" ? /* @__PURE__ */ e(l, {}) : /* @__PURE__ */ e(s, {}) }) : null : (process.env.NODE_ENV !== "production" && console.warn("Please ensure the component is wrapped with ConfigProvider context"), null);
 }
 export {
-  f as default
+  g as default
 };

package/lib/NavMenu/products.js

@@ -6,8 +6,8 @@ import { Box as w, useTheme as G } from "@mui/material";
 import B from "./sub-item-group.js";
 import { Item as K } from "./nav-menu.js";
 import { styled as C } from "../Theme/index.js";
-import { useNavMenuContext as L } from "./nav-menu-context.js";
-import { translate as E } from "../Locale/util.js";
+import { useNavMenuContext as E } from "./nav-menu-context.js";
+import { translate as L } from "../Locale/util.js";
 import { useLocaleContext as _ } from "../Locale/context.js";
 import M from "./images/nft-studio.svg.js";
 import O from "./images/creator-studio.svg.js";
@@ -479,7 +479,7 @@ function o({ to: t, children: c, className: a = "", ...u }) {
   return W(t) ? /* @__PURE__ */ e(p, { to: ee(t, "header"), target: "_blank", rel: "noreferrer noopener", className: a, ...u, children: c }) : /* @__PURE__ */ e(p, { to: t, className: a, ...u, children: c });
 }
 function Fe({ className: t = "", type: c, ...a }) {
-  const { mode: u } = L(), k = G(), { locale: r = "en" } = _() || {}, l = T(null), { palette: f } = k, i = A((n, d = {}) => E(ie, n, r, "en", d)), [N, D] = $(v), m = A(() => {
+  const { mode: u } = E(), k = G(), { locale: r = "en" } = _() || {}, l = T(null), { palette: f } = k, i = A((n, d = {}) => L(ie, n, r, "en", d)), [N, D] = $(v), m = A(() => {
     if (!l.current) return;
     const n = l.current.querySelectorAll(".navmenu-item__content");
     let d = v;
@@ -661,12 +661,12 @@ function Fe({ className: t = "", type: c, ...a }) {
             {
               label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/code-smith", ...n, children: "AIGNE CodeSmith" }),
               description: i("products.aigneCodeSmith.description"),
-              icon: /* @__PURE__ */ e(s, { color: "#56a596", backgroundColor: "#e9fcf6" })
+              icon: /* @__PURE__ */ e(s, { color: "#3E5DF7", backgroundColor: "#e9f0ff" })
             },
             {
               label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/doc-smith", ...n, children: "AIGNE DocSmith" }),
               description: i("products.aigneDocSmith.description"),
-              icon: /* @__PURE__ */ e(s, { color: "#e46f38", backgroundColor: "#f7e0d7" })
+              icon: /* @__PURE__ */ e(s, { color: "#02A996", backgroundColor: "#e6f7f5" })
             },
             {
               label: /* @__PURE__ */ e(o, { to: "https://www.aigne.io/web-smith", ...n, children: "AIGNE WebSmith" }),

package/lib/UserCard/Cards/social-actions.js

@@ -1,16 +1,14 @@
-import { jsxs as w, jsx as s } from "react/jsx-runtime";
+import { jsxs as w, jsx as d } from "react/jsx-runtime";
 import { useMemo as l } from "react";
-import { styled as z, Button as C, Box as F } from "@mui/material";
+import { styled as C, Button as F, Box as U } from "@mui/material";
 import { useMemoizedFn as u } from "ahooks";
-import { joinURL as N } from "ufo";
+import { joinURL as v } from "ufo";
 import h from "lodash/noop";
-import { Icon as U } from "@iconify/react";
-import v from "@mui/icons-material/Notifications";
-import L from "@mui/icons-material/NotificationsOff";
-import P from "../use-follow.js";
+import { Icon as z } from "@iconify/react";
+import L from "../use-follow.js";
 import { useLocaleContext as g } from "../../Locale/context.js";
 import { translate as y } from "../../Locale/util.js";
-import { isSupportFollow as j } from "../../Util/index.js";
+import { isSupportFollow as N } from "../../Util/index.js";
 const _ = {
   zh: {
     chat: "聊天",
@@ -26,16 +24,16 @@ const _ = {
     follow_success: "Follow success",
     unfollow_success: "Unfollow success"
   }
-}, B = () => {
+}, P = () => {
   const { componentMountPoints: o = [] } = window.blocklet || {};
   return o.find((n) => n.name === "did-comments")?.mountPoint;
 };
-function I({
+function j({
   user: o,
   showSocialActions: t,
   session: n
 }) {
-  const { locale: e } = g() || { locale: "en" }, i = u((d, m = {}) => y(_, d, e, "en", m)), r = l(() => !!n?.user?.did, [n?.user?.did]), c = l(() => B(), []), a = u(() => {
+  const { locale: e } = g() || { locale: "en" }, i = u((s, m = {}) => y(_, s, e, "en", m)), r = l(() => !!n?.user?.did, [n?.user?.did]), c = l(() => P(), []), a = u(() => {
     if (!r) {
       n?.login(h, {
         openMode: "redirect",
@@ -43,10 +41,10 @@ function I({
       });
       return;
     }
-    window.open(N(c, `/chat/dm/${o?.did}`), "_blank");
+    window.open(v(c, `/chat/dm/${o?.did}`), "_blank");
   });
   return l(() => (typeof t == "boolean" ? !!t : t?.chat) && !!c, [t, c]) ? /* @__PURE__ */ w(
-    x,
+    b,
     {
       className: "user-card__social-actions-chat",
       variant: "outlined",
@@ -54,24 +52,24 @@ function I({
       size: "small",
       onClick: a,
       children: [
-        /* @__PURE__ */ s(U, { icon: "tabler:message-dots", style: { marginRight: 4 } }),
+        /* @__PURE__ */ d(z, { icon: "tabler:message-dots", style: { marginRight: 4 } }),
         i("chat")
       ]
     }
   ) : null;
 }
-function $({
+function B({
   user: o,
   showSocialActions: t,
   session: n,
   onFollowClick: e
 }) {
-  const { locale: i } = g() || { locale: "en" }, r = u((p, M = {}) => y(_, p, i, "en", M)), c = l(() => !!n?.user?.did, [n?.user?.did]), a = l(() => typeof t == "boolean" ? !!t : t?.follow, [t]), { followed: f, followUser: d, unfollowUser: m } = P({
+  const { locale: i } = g() || { locale: "en" }, r = u((p, M = {}) => y(_, p, i, "en", M)), c = l(() => !!n?.user?.did, [n?.user?.did]), a = l(() => typeof t == "boolean" ? !!t : t?.follow, [t]), { followed: f, followUser: s, unfollowUser: m } = L({
     user: o,
     t: r,
     isMySelf: !1,
     visible: !!a
-  }), b = u((p) => {
+  }), x = u(async (p) => {
     if (!c) {
       n?.login(h, {
         openMode: "redirect",
@@ -79,37 +77,34 @@ function $({
       });
       return;
     }
-    f ? m(o.did) : d(o.did), e && typeof e == "function" && e(o, p);
+    f ? await m(o.did) : await s(o.did), e && typeof e == "function" && e(o, p);
   });
-  return a ? /* @__PURE__ */ w(
-    x,
+  return a ? /* @__PURE__ */ d(
+    b,
     {
       className: "user-card__social-actions-follow",
       variant: "outlined",
       color: "primary",
       size: "small",
-      onClick: b,
-      children: [
-        f ? /* @__PURE__ */ s(L, { sx: { fontSize: 14, mr: 0.5 } }) : /* @__PURE__ */ s(v, { sx: { fontSize: 14, mr: 0.5 } }),
-        r(f ? "unfollow" : "follow")
-      ]
+      onClick: x,
+      children: r(f ? "unfollow" : "follow")
     }
   ) : null;
 }
-function S({ showSocialActions: o, session: t, user: n, onFollowClick: e = void 0 }) {
-  const i = l(() => t?.user?.did === n?.did, [t?.user?.did, n?.did]), r = l(() => j(), []);
-  return i || !r || !o ? null : /* @__PURE__ */ w(F, { className: "user-card__social-actions", sx: { display: "flex", gap: 1 }, children: [
-    /* @__PURE__ */ s(I, { session: t, user: n, showSocialActions: o }),
-    /* @__PURE__ */ s($, { onFollowClick: e, session: t, user: n, showSocialActions: o })
+function H({ showSocialActions: o, session: t, user: n, onFollowClick: e = void 0 }) {
+  const i = l(() => t?.user?.did === n?.did, [t?.user?.did, n?.did]), r = l(() => N(), []);
+  return i || !r || !o ? null : /* @__PURE__ */ w(U, { className: "user-card__social-actions", sx: { display: "flex", gap: 1 }, children: [
+    /* @__PURE__ */ d(j, { session: t, user: n, showSocialActions: o }),
+    /* @__PURE__ */ d(B, { onFollowClick: e, session: t, user: n, showSocialActions: o })
   ] });
 }
-const x = z(C)`
+const b = C(F)`
   color: ${({ theme: o }) => o.palette.text.primary};
   font-weight: 500;
   border-color: ${({ theme: o }) => o.palette.grey[300]};
   line-height: 1.5;
 `;
 export {
-  x as ButtonWrapper,
-  S as default
+  b as ButtonWrapper,
+  H as default
 };

package/lib/package.json.js

@@ -1,4 +1,4 @@
-const e = "3.1.39", s = { "@blocklet/js-sdk": "^1.16.49-beta-20250823-082650-626c1473" }, t = {
+const e = "3.1.41", s = { "@blocklet/js-sdk": "^1.16.49-beta-20250823-082650-626c1473" }, t = {
   version: e,
   dependencies: s
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "3.1.39",
+  "version": "3.1.41",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -68,16 +68,16 @@
     "react": "^19.0.0",
     "react-router-dom": "^6.22.3"
   },
-  "gitHead": "39e8ff533f71280af4170866de8055a188c820ba",
+  "gitHead": "21979ee3abb716f0201960abe9c85d8f0a8f291c",
   "dependencies": {
-    "@arcblock/bridge": "3.1.39",
+    "@arcblock/bridge": "3.1.41",
     "@arcblock/did": "^1.21.3",
     "@arcblock/did-motif": "^1.1.14",
-    "@arcblock/icons": "3.1.39",
-    "@arcblock/nft-display": "3.1.39",
-    "@arcblock/react-hooks": "3.1.39",
+    "@arcblock/icons": "3.1.41",
+    "@arcblock/nft-display": "3.1.41",
+    "@arcblock/react-hooks": "3.1.41",
     "@blocklet/js-sdk": "^1.16.49-beta-20250823-082650-626c1473",
-    "@blocklet/theme": "3.1.39",
+    "@blocklet/theme": "3.1.41",
     "@fontsource/roboto": "~5.1.1",
     "@fontsource/ubuntu-mono": "^5.2.6",
     "@iconify-icons/logos": "^1.2.36",

package/src/Config/theme-mode-toggle.tsx

@@ -3,10 +3,19 @@ import {
   LightModeOutlined as LightModeOutlinedIcon,
   Brightness2Outlined as Brightness2OutlinedIcon,
 } from '@mui/icons-material';
+import { useThrottleFn } from 'ahooks';
 import { useColorScheme } from '../Theme/theme-provider';
 
 export default function ThemeModeToggle() {
   const { mode, toggleMode, prefer } = useColorScheme();
+  const { run: toggleModeThrottled } = useThrottleFn(
+    () => {
+      toggleMode();
+    },
+    {
+      wait: 300,
+    }
+  );
 
   if (!toggleMode) {
     if (process.env.NODE_ENV !== 'production') {
@@ -19,7 +28,7 @@ export default function ThemeModeToggle() {
   // 跟随系统才显示切换
   if (prefer === 'system' || window.blocklet?.theme?.prefer === 'system') {
     return (
-      <IconButton onClick={toggleMode}>
+      <IconButton onClick={toggleModeThrottled}>
         {mode === 'light' ? <Brightness2OutlinedIcon /> : <LightModeOutlinedIcon />}
       </IconButton>
     );

package/src/NavMenu/products.tsx

@@ -768,7 +768,7 @@ export default function Products({ className = '', type, ...rest }: ProductsProp
                 </SmartLink>
               ),
               description: t('products.aigneCodeSmith.description'),
-              icon: <AigneIcon color="#56a596" backgroundColor="#e9fcf6" />,
+              icon: <AigneIcon color="#3E5DF7" backgroundColor="#e9f0ff" />,
             },
             {
               label: (
@@ -777,7 +777,7 @@ export default function Products({ className = '', type, ...rest }: ProductsProp
                 </SmartLink>
               ),
               description: t('products.aigneDocSmith.description'),
-              icon: <AigneIcon color="#e46f38" backgroundColor="#f7e0d7" />,
+              icon: <AigneIcon color="#02A996" backgroundColor="#e6f7f5" />,
             },
             {
               label: (

package/src/UserCard/Cards/social-actions.tsx

@@ -4,8 +4,6 @@ import { useMemoizedFn } from 'ahooks';
 import { joinURL } from 'ufo';
 import noop from 'lodash/noop';
 import { Icon } from '@iconify/react';
-import NotificationsIcon from '@mui/icons-material/Notifications';
-import NotificationsOffIcon from '@mui/icons-material/NotificationsOff';
 
 import useFollow from '../use-follow';
 import { User, UserCardProps } from '../types';
@@ -128,7 +126,7 @@ function Follow({
     isMySelf: false,
     visible: !!showFollow,
   });
-  const handleFollowAction = useMemoizedFn((e) => {
+  const handleFollowAction = useMemoizedFn(async (e) => {
     if (!isLogin) {
       session?.login(noop, {
         openMode: 'redirect',
@@ -137,9 +135,9 @@ function Follow({
       return;
     }
     if (followed) {
-      unfollowUser(user.did);
+      await unfollowUser(user.did);
     } else {
-      followUser(user.did);
+      await followUser(user.did);
     }
     if (onFollowClick && typeof onFollowClick === 'function') {
       onFollowClick(user, e);
@@ -157,11 +155,6 @@ function Follow({
       color="primary"
       size="small"
       onClick={handleFollowAction}>
-      {followed ? (
-        <NotificationsOffIcon sx={{ fontSize: 14, mr: 0.5 }} />
-      ) : (
-        <NotificationsIcon sx={{ fontSize: 14, mr: 0.5 }} />
-      )}
       {followed ? t('unfollow') : t('follow')}
     </ButtonWrapper>
   );