@blocklet/ui-react 3.1.32 → 3.1.34

package/lib/Footer/index.js

@@ -29,9 +29,9 @@ function d({ meta: o = {}, theme: t = {}, ...n }) {
   if (!r.appName)
     return null;
   const { appName: b, appDescription: k, description: g, copyright: u } = r, h = m.palette.background.default, a = {
-    footerNav: l(r?.navigation?.footer, i) || [],
-    socialMedia: l(r?.navigation?.social, i) || [],
-    links: l(r?.navigation?.bottom, i) || []
+    footerNav: l(r?.navigation?.footer, i, "footer") || [],
+    socialMedia: l(r?.navigation?.social, i, "footer") || [],
+    links: l(r?.navigation?.bottom, i, "footer") || []
   }, y = {
     brand: {
       name: b,

package/lib/Header/index.js

@@ -5,20 +5,21 @@ import { withErrorBoundary as $ } from "react-error-boundary";
 import { ErrorFallback as C } from "@arcblock/ux/lib/ErrorBoundary";
 import { styled as H, useTheme as _, deepmerge as w, ThemeProvider as A } from "@arcblock/ux/lib/Theme";
 import { ResponsiveHeader as B } from "@arcblock/ux/lib/Header";
-import L, { Products as R } from "@arcblock/ux/lib/NavMenu";
-import { useLocaleContext as z } from "@arcblock/ux/lib/Locale/context";
-import { translate as F } from "@arcblock/ux/lib/Locale/util";
-import M from "@arcblock/ux/lib/hooks/use-blocklet-logo";
+import L, { Products as M } from "@arcblock/ux/lib/NavMenu";
+import { useLocaleContext as R } from "@arcblock/ux/lib/Locale/context";
+import { translate as z } from "@arcblock/ux/lib/Locale/util";
+import F from "@arcblock/ux/lib/hooks/use-blocklet-logo";
 import O from "lodash/omit";
 import I from "lodash/isFinite";
 import P from "clsx";
+import { getUTMUrl as U } from "@arcblock/ux/lib/withTracker/libs/utm";
 import W from "../Icon/index.js";
-import { mapRecursive as j, flatRecursive as S, matchPaths as U } from "../utils.js";
-import { formatBlockletInfo as G, getLocalizedNavigation as K, publicPath as q } from "../blocklets.js";
-import D from "../common/header-addons.js";
-import { useWalletHiddenTopbar as J } from "../common/wallet-hidden-topbar.js";
-import Q from "../libs/with-hide-when-embed.js";
-const V = {
+import { mapRecursive as j, flatRecursive as S, matchPaths as G } from "../utils.js";
+import { formatBlockletInfo as K, getLocalizedNavigation as q, publicPath as D } from "../blocklets.js";
+import J from "../common/header-addons.js";
+import { useWalletHiddenTopbar as Q } from "../common/wallet-hidden-topbar.js";
+import V from "../libs/with-hide-when-embed.js";
+const X = {
   en: {
     products: "Products"
   },
@@ -31,7 +32,7 @@ const V = {
   ja: {
     products: "製品"
   }
-}, X = (r) => {
+}, Y = (r) => {
   if (!r?.length)
     return { navItems: [], activeId: null };
   let t = 1;
@@ -50,38 +51,38 @@ const V = {
       rel: "noreferrer"
     }), {
       id: `${t++}`,
-      label: /* @__PURE__ */ a("a", { href: e.link, ...s, children: e.title }),
+      label: /* @__PURE__ */ a("a", { href: U(e.link, "header"), ...s, children: e.title }),
       icon: i,
       description: e.description,
       link: e.link
     };
-  }, "items"), l = S(c), p = U(l.map((e) => e.link));
+  }, "items"), l = S(c), p = G(l.map((e) => e.link));
   return { navItems: c, activeId: p >= 0 ? l[p].id : null };
 };
-function Y({
+function Z({
   meta: r = {},
   addons: t = void 0,
   sessionManagerProps: h = {
     showRole: !0
   },
-  homeLink: c = q,
+  homeLink: c = D,
   theme: l = {},
   hideNavMenu: p = !1,
   showDomainWarningDialog: e = !0,
   ...i
 }) {
-  J();
-  const s = _(), { locale: b } = z() || {}, T = N((o, n = {}) => F(V, o, b, "en", n)), d = f(() => {
+  Q();
+  const s = _(), { locale: g } = R() || {}, T = N((o, n = {}) => z(X, o, g, "en", n)), d = f(() => {
     const o = Object.assign({}, window.blocklet, r);
     try {
-      return G(o);
+      return K(o);
     } catch (n) {
       return console.error("Failed to format blocklet info", n, o), o;
     }
-  }, [r]), m = f(() => w(s, l), [s, l]), x = M({
+  }, [r]), m = f(() => w(s, l), [s, l]), x = F({
     meta: r,
     theme: l
-  }), { productsOrder: g, productsType: k } = f(() => {
+  }), { productsOrder: b, productsType: k } = f(() => {
     let { USE_ARCBLOCK_THEME: o, USE_AIGNE_THEME: n } = d;
     return o = parseInt(o, 10), n = parseInt(n, 10), I(n) ? {
       productsOrder: n,
@@ -96,20 +97,20 @@ function Y({
   }, [d]);
   if (!d.appName)
     return null;
-  const y = K(d?.navigation?.header, b), v = X(y), { navItems: u, activeId: E } = v;
-  return k && Number.isInteger(g) && u.splice(g, 0, {
+  const y = q(d?.navigation?.header, g), v = Y(y), { navItems: u, activeId: E } = v;
+  return k && Number.isInteger(b) && u.splice(b, 0, {
     label: T("products"),
     // eslint-disable-next-line react/no-unstable-nested-components
-    children: () => /* @__PURE__ */ a(R, { type: k })
+    children: () => /* @__PURE__ */ a(M, { type: k })
   }), /* @__PURE__ */ a(A, { theme: m, children: /* @__PURE__ */ a(
-    Z,
+    ee,
     {
       homeLink: c,
       logo: /* @__PURE__ */ a("img", { src: x, alt: "logo" }),
       addons: (
         // @ts-ignore
         /* @__PURE__ */ a(
-          D,
+          J,
           {
             formattedBlocklet: d,
             addons: typeof t == "function" ? (o) => t(o, { navigation: v }) : t,
@@ -140,7 +141,7 @@ function Y({
     }
   ) });
 }
-const Z = H(B)`
+const ee = H(B)`
   ${({ $bgcolor: r }) => `background-color: ${r || "#fff"};`}
   .header-logo {
     min-width: 44px;
@@ -151,9 +152,9 @@ const Z = H(B)`
       min-width: 32px;
     }
   }
-`, xe = $(Q(Y), {
+`, Ee = $(V(Z), {
   FallbackComponent: C
 });
 export {
-  xe as default
+  Ee as default
 };

package/lib/blocklets.d.ts

@@ -1,7 +1,7 @@
 export const publicPath: any;
 export function formatTheme(theme: any): any;
 export function getLink(link: any, locale?: string): any;
-export function getLocalizedNavigation(navigation: any, locale?: string): any;
+export function getLocalizedNavigation(navigation: any[], locale?: string, section?: "header" | "footer"): any;
 export function formatNavigation(navigation: any): any;
 export function parseNavigation(navigation: any): {
     header: never[];

package/lib/blocklets.js

@@ -1,50 +1,51 @@
-import { mapRecursive as s, filterRecursive as a, isUrl as f, isMailProtocol as i } from "./utils.js";
-const p = window?.blocklet?.groupPrefix || window?.blocklet?.prefix || "/", c = (e) => {
+import { getUTMUrl as i } from "@arcblock/ux/lib/withTracker/libs/utm";
+import { mapRecursive as s, filterRecursive as a, isUrl as c, isMailProtocol as u } from "./utils.js";
+const w = window?.blocklet?.groupPrefix || window?.blocklet?.prefix || "/", l = (e) => {
   const r = { ...e }, t = e?.background;
   return typeof t == "string" ? r.background = { header: t, footer: t, default: t } : t && typeof t == "object" && (r.background = {
     header: t.header || t.default,
     footer: t.footer || t.default,
     default: t.default
   }), r;
-}, u = (e, r = "en") => {
+}, d = (e, r = "en") => {
   if (typeof e == "string") {
-    if (f(e)) {
-      const o = new URL(e);
-      return o.searchParams.set("locale", r), o.href;
+    if (c(e)) {
+      const n = new URL(e);
+      return n.searchParams.set("locale", r), n.href;
     }
-    if (i(e))
+    if (u(e))
       return e;
     const t = new URL(e, window.location.origin);
     return t.searchParams.set("locale", r), t.pathname + t.search;
   }
   return typeof e == "object" ? e[r] || e?.en || e?.zh : e;
-}, b = (e, r = "en") => {
+}, v = (e, r = "en", t = "header") => {
   if (!e?.length)
     return e;
-  const t = (o, n) => o && typeof o == "object" ? o[n] || o?.en || o?.zh : o;
+  const n = (o, f) => o && typeof o == "object" ? o[f] || o?.en || o?.zh : o;
   return s(
     e,
     (o) => ({
       ...o,
-      title: t(o.title, r),
-      description: t(o.description, r),
+      title: n(o.title, r),
+      description: n(o.description, r),
       // 仅对叶结点进行处理
-      link: o.items?.length ? o.link : u(o.link, r),
+      link: i(o.items?.length ? o.link : d(o.link, r), t),
       _rawLink: o.link
     }),
     "items"
   );
-}, l = (e) => s(
+}, h = (e) => s(
   e,
   (r) => r.role ? {
     ...r,
     role: Array.isArray(r.role) ? r.role : [r.role]
   } : r,
   "items"
-), d = (e) => {
+), g = (e) => {
   if (!e?.length)
     return null;
-  const r = l(e), t = {
+  const r = h(e), t = {
     header: [],
     footer: [],
     // 对应 footer social media
@@ -57,32 +58,32 @@ const p = window?.blocklet?.groupPrefix || window?.blocklet?.prefix || "/", c =
     sessionManager: [],
     userCenter: []
   };
-  return r.forEach((o) => {
-    o.section ? Array.isArray(o.section) ? o.section.forEach((n) => {
-      t[n]?.push(o);
-    }) : typeof o.section == "string" && t[o.section]?.push(o) : t.header.push(o);
+  return r.forEach((n) => {
+    n.section ? Array.isArray(n.section) ? n.section.forEach((o) => {
+      t[o]?.push(n);
+    }) : typeof n.section == "string" && t[n.section]?.push(n) : t.header.push(n);
   }), t;
-}, y = (e) => {
+}, L = (e) => {
   if (!e)
     return null;
   const r = { ...e };
-  return r.theme = c(r.theme), r.navigation = d(h(r.navigation)), r;
-}, h = (e = []) => a(e, (r, t) => !!r.link || t.filteredChildren?.length, "items"), w = (e, r) => a(
+  return r.theme = l(r.theme), r.navigation = g(p(r.navigation)), r;
+}, p = (e = []) => a(e, (r, t) => !!r.link || t.filteredChildren?.length, "items"), N = (e, r) => a(
   e,
-  (t, o) => {
-    const n = !t.role || r && (t.role.includes(r) || t.role.includes("guest"));
-    return o.isLeaf ? n : n && o.filteredChildren?.length;
+  (t, n) => {
+    const o = !t.role || r && (t.role.includes(r) || t.role.includes("guest"));
+    return n.isLeaf ? o : o && n.filteredChildren?.length;
   },
   "items"
 );
 export {
-  w as filterNavByRole,
-  h as filterValidNavItems,
-  y as formatBlockletInfo,
-  l as formatNavigation,
-  c as formatTheme,
-  u as getLink,
-  b as getLocalizedNavigation,
-  d as parseNavigation,
-  p as publicPath
+  N as filterNavByRole,
+  p as filterValidNavItems,
+  L as formatBlockletInfo,
+  h as formatNavigation,
+  l as formatTheme,
+  d as getLink,
+  v as getLocalizedNavigation,
+  g as parseNavigation,
+  w as publicPath
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/ui-react",
-  "version": "3.1.32",
+  "version": "3.1.34",
   "description": "Some useful front-end web components that can be used in Blocklets.",
   "keywords": [
     "react",
@@ -35,9 +35,9 @@
   "dependencies": {
     "@abtnode/constant": "^1.16.49-beta-20250823-082650-626c1473",
     "@abtnode/util": "^1.16.49-beta-20250823-082650-626c1473",
-    "@arcblock/bridge": "3.1.32",
-    "@arcblock/icons": "3.1.32",
-    "@arcblock/react-hooks": "3.1.32",
+    "@arcblock/bridge": "3.1.34",
+    "@arcblock/icons": "3.1.34",
+    "@arcblock/react-hooks": "3.1.34",
     "@arcblock/ws": "^1.21.3",
     "@blocklet/constant": "^1.16.49-beta-20250823-082650-626c1473",
     "@blocklet/did-space-react": "^1.1.16",
@@ -83,7 +83,7 @@
     "access": "public"
   },
   "devDependencies": {
-    "@arcblock/did-connect-react": "3.1.32",
+    "@arcblock/did-connect-react": "3.1.34",
     "@types/dompurify": "^3.2.0",
     "@types/ua-parser-js": "^0.7.39",
     "@types/validator": "^13.15.2",
@@ -91,5 +91,5 @@
     "jest": "^29.7.0",
     "unbuild": "^2.0.0"
   },
-  "gitHead": "8ec0dc442d3ca3f15ca233ac096af5163963fcb0"
+  "gitHead": "c4810edc1f51b25c0e9bd55b2021f284d378ecb1"
 }

package/src/Footer/index.jsx

@@ -44,9 +44,9 @@ function Footer({ meta = {}, theme: themeOverrides = {}, ...rest }) {
   const $bgColor = mergeTheme.palette.background.default;
 
   const localized = {
-    footerNav: getLocalizedNavigation(formattedBlocklet?.navigation?.footer, locale) || [],
-    socialMedia: getLocalizedNavigation(formattedBlocklet?.navigation?.social, locale) || [],
-    links: getLocalizedNavigation(formattedBlocklet?.navigation?.bottom, locale) || [],
+    footerNav: getLocalizedNavigation(formattedBlocklet?.navigation?.footer, locale, 'footer') || [],
+    socialMedia: getLocalizedNavigation(formattedBlocklet?.navigation?.social, locale, 'footer') || [],
+    links: getLocalizedNavigation(formattedBlocklet?.navigation?.bottom, locale, 'footer') || [],
   };
 
   const props = {

package/src/Header/index.tsx

@@ -12,6 +12,7 @@ import omit from 'lodash/omit';
 import isFinite from 'lodash/isFinite';
 import type { BoxProps, Breakpoint, Theme } from '@mui/material';
 import clsx from 'clsx';
+import { getUTMUrl } from '@arcblock/ux/lib/withTracker/libs/utm';
 
 import Icon from '../Icon';
 import { mapRecursive, flatRecursive, matchPaths } from '../utils';
@@ -67,7 +68,7 @@ const parseNavigation = (navigation: any) => {
     return {
       id: `${counter++}`,
       label: (
-        <a href={item.link} {...props}>
+        <a href={getUTMUrl(item.link, 'header')} {...props}>
           {item.title}
         </a>
       ),

package/src/blocklets.js

@@ -1,3 +1,4 @@
+import { getUTMUrl } from '@arcblock/ux/lib/withTracker/libs/utm';
 import { mapRecursive, filterRecursive, isUrl, isMailProtocol } from './utils';
 
 export const publicPath = window?.blocklet?.groupPrefix || window?.blocklet?.prefix || '/';
@@ -43,9 +44,13 @@ export const getLink = (link, locale = 'en') => {
 };
 
 /**
+ *
+ * @param {any[]} navigation 导航菜单数据
+ * @param {string} locale 语言
+ * @param {'header' | 'footer'} section 导航区域
  * 获取指定 locale 对应的 navigation 数据, 仅考虑 zh/en
  */
-export const getLocalizedNavigation = (navigation, locale = 'en') => {
+export const getLocalizedNavigation = (navigation, locale = 'en', section = 'header') => {
   if (!navigation?.length) {
     return navigation;
   }
@@ -65,7 +70,7 @@ export const getLocalizedNavigation = (navigation, locale = 'en') => {
         title: trans(item.title, locale),
         description: trans(item.description, locale),
         // 仅对叶结点进行处理
-        link: !item.items?.length ? getLink(item.link, locale) : item.link,
+        link: getUTMUrl(!item.items?.length ? getLink(item.link, locale) : item.link, section),
         _rawLink: item.link,
       };
     },