@blocklet/ui-react 3.0.0 → 3.0.2

package/lib/UserCenter/components/nft.js

@@ -1,4 +1,4 @@
-import { jsxs as p, jsx as t, Fragment as y } from "react/jsx-runtime";
+import { jsxs as f, jsx as e, Fragment as y } from "react/jsx-runtime";
 import { Box as o, Skeleton as g, Typography as w, Pagination as k } from "@mui/material";
 import { useMemoizedFn as C, useReactive as b, useRequest as F, useCreation as z } from "ahooks";
 import N from "axios";
@@ -8,28 +8,28 @@ import { WELLKNOWN_SERVICE_PATH_PREFIX as j } from "@abtnode/constant";
 import { translate as E } from "@arcblock/ux/lib/Locale/util";
 import { useLocaleContext as I } from "@arcblock/ux/lib/Locale/context";
 import { translations as S } from "../libs/locales.js";
-function H({ user: d }) {
-  const { locale: x } = I(), m = C((r, n = {}) => E(S, r, x, "en", n)), e = b({
+function H({ user: p }) {
+  const { locale: x } = I(), d = C((r, n = {}) => E(S, r, x, "en", n)), t = b({
     page: 1,
     size: 20
-  }), c = F(
-    async (r = e) => (await N.get(`${j}/ocap/listAssets`, {
+  }), m = F(
+    async (r = t) => (await N.get(`${j}/ocap/listAssets`, {
       params: {
-        ownerAddress: d.did,
+        ownerAddress: p.did,
         ...r
       }
     })).data,
     {
-      defaultParams: [e],
-      refreshDeps: [d.did, e]
+      defaultParams: [t],
+      refreshDeps: [p.did, t]
     }
-  ), { loading: i, data: s } = c, l = (s == null ? void 0 : s.page) ?? { cursor: 0, next: !1, total: 0 }, f = (r, n) => {
-    e.page = n, c.run(e);
+  ), { loading: i, data: s } = m, l = (s == null ? void 0 : s.page) ?? { cursor: 0, next: !1, total: 0 }, c = (r, n) => {
+    t.page = n, m.run(t);
   }, h = z(() => {
     var r, n;
     if (i) {
-      const a = ["skeleton-1", "skeleton-2", "skeleton-3", "skeleton-4", "skeleton-5"].map((u) => /* @__PURE__ */ t(g, { variant: "rectangular", width: "15%", height: 166, sx: { borderRadius: 1, flexShrink: 0 } }, u));
-      return /* @__PURE__ */ p(
+      const a = ["skeleton-1", "skeleton-2", "skeleton-3", "skeleton-4", "skeleton-5"].map((u) => /* @__PURE__ */ e(g, { variant: "rectangular", width: "15%", height: 166, sx: { borderRadius: 1, flexShrink: 0 } }, u));
+      return /* @__PURE__ */ f(
         o,
         {
           sx: {
@@ -38,8 +38,8 @@ function H({ user: d }) {
             gap: 2
           },
           children: [
-            /* @__PURE__ */ t(g, { width: "20%" }),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ e(g, { width: "20%" }),
+            /* @__PURE__ */ e(
               o,
               {
                 sx: {
@@ -55,8 +55,8 @@ function H({ user: d }) {
         }
       );
     }
-    return /* @__PURE__ */ p(y, { children: [
-      /* @__PURE__ */ t(
+    return /* @__PURE__ */ f(y, { children: [
+      /* @__PURE__ */ e(
         w,
         {
           sx: {
@@ -64,10 +64,11 @@ function H({ user: d }) {
             fontWeight: 600,
             mb: 2.5
           },
-          children: m("common.nft")
+          children: d("common.nft")
         }
       ),
-      /* @__PURE__ */ p(
+      ((r = s == null ? void 0 : s.assets) == null ? void 0 : r.length) === 0 && !i && /* @__PURE__ */ e(o, { sx: { display: "flex", justifyContent: "center", alignItems: "center", width: "100%", height: "100%" }, children: /* @__PURE__ */ e(R, { children: d("common.noNFT") }) }),
+      /* @__PURE__ */ e(
         o,
         {
           className: "nft-list-wrapper",
@@ -82,48 +83,33 @@ function H({ user: d }) {
             },
             gap: 2.5
           },
-          children: [
-            (r = s == null ? void 0 : s.assets) == null ? void 0 : r.map((a) => /* @__PURE__ */ t(
-              o,
-              {
-                sx: {
-                  flexShrink: 0,
-                  width: { xs: 120, sm: 120, md: 120, lg: 166 },
-                  height: { xs: 120, sm: 120, md: 120, lg: 166 }
-                },
-                children: /* @__PURE__ */ t(
-                  P,
-                  {
-                    data: a.display,
-                    address: a.address,
-                    inset: !0,
-                    imageFilter: {
-                      imageFilter: "resize",
-                      w: "500",
-                      f: "webp"
-                    }
-                  }
-                )
+          children: (n = s == null ? void 0 : s.assets) == null ? void 0 : n.map((a) => /* @__PURE__ */ e(
+            o,
+            {
+              sx: {
+                flexShrink: 0,
+                width: { xs: 120, sm: 120, md: 120, lg: 166 },
+                height: { xs: 120, sm: 120, md: 120, lg: 166 }
               },
-              a.address
-            )),
-            ((n = s == null ? void 0 : s.assets) == null ? void 0 : n.length) === 0 && !i && /* @__PURE__ */ t(
-              o,
-              {
-                sx: {
-                  display: "flex",
-                  justifyContent: "center",
-                  alignItems: "center",
-                  width: "100%",
-                  height: "100%"
-                },
-                children: /* @__PURE__ */ t(R, { children: m("common.noNFT") })
-              }
-            )
-          ]
+              children: /* @__PURE__ */ e(
+                P,
+                {
+                  data: a.display,
+                  address: a.address,
+                  inset: !0,
+                  imageFilter: {
+                    imageFilter: "resize",
+                    w: "500",
+                    f: "webp"
+                  }
+                }
+              )
+            },
+            a.address
+          ))
         }
       ),
-      l.next || e.page > 1 ? /* @__PURE__ */ t(
+      l.next || t.page > 1 ? /* @__PURE__ */ e(
         k,
         {
           sx: {
@@ -131,15 +117,15 @@ function H({ user: d }) {
             justifyContent: "center",
             mt: 2
           },
-          page: e.page,
-          onChange: f,
-          count: Math.ceil(l.total / e.size),
+          page: t.page,
+          onChange: c,
+          count: Math.ceil(l.total / t.size),
           size: "small"
         }
       ) : null
     ] });
-  }, [i, l, e.page, e.size, f]);
-  return /* @__PURE__ */ t(o, { sx: { border: "1px solid", borderColor: "divider", borderRadius: 1, p: 2, mb: 5 }, children: h });
+  }, [i, l, t.page, t.size, c]);
+  return /* @__PURE__ */ e(o, { sx: { border: "1px solid", borderColor: "divider", borderRadius: 1, p: 2, mb: 5 }, children: h });
 }
 export {
   H as default

package/lib/UserCenter/components/user-info/link-preview-input.js

@@ -1,64 +1,64 @@
-import { jsx as t, jsxs as g } from "react/jsx-runtime";
-import { useState as y, useMemo as w, useEffect as L } from "react";
-import { styled as b, Box as c, Typography as C, IconButton as I, Button as F, useTheme as E, FormControl as U, TextField as D } from "@mui/material";
-import { Remove as S, Add as k } from "@mui/icons-material";
-import { translate as R } from "@arcblock/ux/lib/Locale/util";
-import { useMemoizedFn as j } from "ahooks";
-import { useLocaleContext as B } from "@arcblock/ux/lib/Locale/context";
-import T from "@arcblock/icons/lib/Link";
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { useState as v, useMemo as b } from "react";
+import { styled as L, Box as d, Typography as w, IconButton as C, Button as I, useTheme as k, FormControl as D, TextField as F } from "@mui/material";
+import { Remove as S, Add as B } from "@mui/icons-material";
+import { translate as E } from "@arcblock/ux/lib/Locale/util";
+import { useMemoizedFn as T } from "ahooks";
+import { useLocaleContext as U } from "@arcblock/ux/lib/Locale/context";
+import j from "@arcblock/icons/lib/Link";
 import { mergeSx as z } from "@arcblock/ux/lib/Util/style";
-import { joinURL as M, withoutProtocol as P } from "ufo";
-import { isValidUrl as v } from "./utils.js";
-import { translations as W } from "../../libs/locales.js";
-import { inputFieldStyle as _, commonInputStyle as A } from "../editable-field.js";
-function V(e) {
-  return P(e);
+import { withoutProtocol as M } from "ufo";
+import { isValidUrl as f } from "./utils.js";
+import { translations as P } from "../../libs/locales.js";
+import { inputFieldStyle as R, commonInputStyle as W } from "../editable-field.js";
+function _(e) {
+  return M(e);
 }
-function $({
+function A({
   value: e,
   onChange: n,
   errorMsg: i
 }) {
-  return /* @__PURE__ */ t(U, { fullWidth: !0, children: /* @__PURE__ */ t(
-    D,
+  return /* @__PURE__ */ t(D, { fullWidth: !0, children: /* @__PURE__ */ t(
+    F,
     {
       variant: "outlined",
       value: e,
-      onChange: (r) => {
-        const d = r.target.value;
-        n(d);
+      onChange: (a) => {
+        const c = a.target.value;
+        n(c);
       },
       fullWidth: !0,
       error: !!i,
       helperText: i,
-      sx: z(_, i ? {} : A)
+      sx: z(R, i ? {} : W)
     }
   ) });
 }
-function q({ links: e = [], onChange: n }) {
-  const { locale: i } = B(), l = j((a, o = {}) => R(W, a, i, "en", o)), [r, d] = y([!1]), f = w(() => {
-    const a = e[e.length - 1];
-    return !v(a) || r.length > 0 && r[r.length - 1];
-  }, [r, e]), p = () => {
-    (e.length < 5 || !f) && n([...e, ""]);
-  }, u = (a) => {
-    const o = e.filter((h, x) => x !== a), s = r.filter((h, x) => x !== a);
-    d(s), n(o);
-  }, m = (a, o) => {
+function V({ links: e = [], onChange: n }) {
+  const { locale: i } = U(), l = T((o, r = {}) => E(P, o, i, "en", r)), [a, c] = v([!1]), u = b(() => {
+    const o = e[e.length - 1];
+    return !f(o) || a.length > 0 && a[a.length - 1];
+  }, [a, e]), x = () => {
+    (e.length < 5 || !u) && n([...e, ""]);
+  }, g = (o) => {
+    const r = e.filter((p, h) => h !== o), s = a.filter((p, h) => h !== o);
+    c(s), n(r);
+  }, y = (o, r) => {
     const s = [...e];
-    s[a] = o;
-    const h = [...r];
-    h[a] = !!(o && !v(o)), d(h), n(s);
+    s[o] = r;
+    const p = [...a];
+    p[o] = !!(r && !f(r)), c(p), n(s);
   };
-  return /* @__PURE__ */ g(
-    c,
+  return /* @__PURE__ */ m(
+    d,
     {
       sx: {
         width: "100%"
       },
       children: [
         /* @__PURE__ */ t(
-          c,
+          d,
           {
             sx: {
               display: "flex",
@@ -66,11 +66,11 @@ function q({ links: e = [], onChange: n }) {
               alignItems: "center",
               gap: 1
             },
-            children: /* @__PURE__ */ t(C, { variant: "subtitle1", gutterBottom: !0, sx: { mb: 0, fontSize: "12px", color: "text.primary" }, children: l("profile.socialMedia") })
+            children: /* @__PURE__ */ t(w, { variant: "subtitle1", gutterBottom: !0, sx: { mb: 0, fontSize: "12px", color: "text.primary" }, children: l("profile.socialMedia") })
           }
         ),
-        e.map((a, o) => /* @__PURE__ */ g(
-          c,
+        e.map((o, r) => /* @__PURE__ */ m(
+          d,
           {
             sx: {
               display: "flex",
@@ -79,25 +79,25 @@ function q({ links: e = [], onChange: n }) {
             },
             children: [
               /* @__PURE__ */ t(
-                $,
+                A,
                 {
-                  value: a,
-                  onChange: (s) => m(o, s),
-                  errorMsg: r[o] ? l("profile.invalidURL") : ""
+                  value: o,
+                  onChange: (s) => y(r, s),
+                  errorMsg: a[r] ? l("profile.invalidURL") : ""
                 }
               ),
-              /* @__PURE__ */ t(I, { onClick: () => u(o), children: /* @__PURE__ */ t(S, { sx: { color: "text.secondary" } }) })
+              /* @__PURE__ */ t(C, { onClick: () => g(r), children: /* @__PURE__ */ t(S, { sx: { color: "text.secondary" } }) })
             ]
           },
-          o
+          r
         )),
-        e.length < 5 && /* @__PURE__ */ g(
-          F,
+        e.length < 5 && /* @__PURE__ */ m(
+          I,
           {
             fullWidth: !0,
             variant: "outlined",
-            disabled: f,
-            onClick: p,
+            disabled: u,
+            onClick: x,
             size: "small",
             sx: {
               height: "40px",
@@ -113,7 +113,7 @@ function q({ links: e = [], onChange: n }) {
               }
             },
             children: [
-              /* @__PURE__ */ t(k, {}),
+              /* @__PURE__ */ t(B, {}),
               " ",
               /* @__PURE__ */ t("span", { children: l("profile.addLink") })
             ]
@@ -123,31 +123,17 @@ function q({ links: e = [], onChange: n }) {
     }
   );
 }
-function G({ link: e }) {
-  const [n, i] = y(""), [l, r] = y(!1), f = E().palette.mode === "dark";
-  return L(() => {
-    try {
-      if (e) {
-        const p = new URL(e), u = M(p.origin, "favicon.ico"), m = new Image();
-        m.src = u, m.onload = () => {
-          i(u), r(!1);
-        }, m.onerror = () => {
-          r(!0), i("");
-        };
-      } else
-        r(!0), i("");
-    } catch {
-      r(!0);
-    }
-  }, [e]), e ? l || !n ? /* @__PURE__ */ t(T, { width: 20, height: 20, style: { filter: f ? "brightness(0) saturate(100%) invert(1)" : "none" } }) : /* @__PURE__ */ t("img", { src: n, alt: "Favicon", width: 20, height: 20 }) : null;
+function $({ link: e }) {
+  const i = k().palette.mode === "dark";
+  return e ? /* @__PURE__ */ t(j, { width: 20, height: 20, style: { filter: i ? "brightness(0) saturate(100%) invert(1)" : "none" } }) : null;
 }
-function ie({
+function oe({
   editable: e = !1,
   links: n = [],
   onChange: i
 }) {
-  return e ? /* @__PURE__ */ t(q, { links: n, onChange: i }) : /* @__PURE__ */ t(
-    c,
+  return e ? /* @__PURE__ */ t(V, { links: n, onChange: i }) : /* @__PURE__ */ t(
+    d,
     {
       sx: {
         width: "100%",
@@ -155,8 +141,8 @@ function ie({
         flexDirection: "column",
         gap: 2
       },
-      children: n.map((l) => /* @__PURE__ */ g(
-        c,
+      children: n.map((l) => /* @__PURE__ */ m(
+        d,
         {
           sx: {
             display: "flex",
@@ -166,8 +152,8 @@ function ie({
             width: "100%"
           },
           children: [
-            /* @__PURE__ */ t(G, { link: l }),
-            /* @__PURE__ */ t(H, { children: /* @__PURE__ */ t(c, { component: "a", href: l, style: { textDecoration: "none" }, target: "_blank", rel: "noopener noreferrer", children: V(l) }) })
+            /* @__PURE__ */ t($, { link: l }),
+            /* @__PURE__ */ t(q, { children: /* @__PURE__ */ t(d, { component: "a", href: l, style: { textDecoration: "none" }, target: "_blank", rel: "noopener noreferrer", children: _(l) }) })
           ]
         },
         l
@@ -175,7 +161,7 @@ function ie({
     }
   );
 }
-const H = b("span")`
+const q = L("span")`
   flex: 1;
   white-space: nowrap;
   overflow: hidden;
@@ -194,5 +180,5 @@ const H = b("span")`
   }
 `;
 export {
-  ie as LinkPreviewInput
+  oe as LinkPreviewInput
 };

package/lib/UserCenter/components/user-info/metadata.js

@@ -1,29 +1,28 @@
 import { jsxs as x, Fragment as A, jsx as a } from "react/jsx-runtime";
-import { lazy as P, memo as mo, createElement as ho, useState as G, useRef as fo, useEffect as so, useMemo as H } from "react";
+import { lazy as P, memo as mo, createElement as ho, useState as H, useRef as fo, useEffect as so, useMemo as Q } from "react";
 import { Icon as yo } from "@iconify/react";
 import { Backdrop as xo, Box as f, useMediaQuery as bo, SwipeableDrawer as uo, Typography as S, Tooltip as go } from "@mui/material";
 import Co from "@emotion/styled";
-import { joinURL as vo } from "ufo";
 import O from "@arcblock/ux/lib/Button";
-import Q, { detectCountryFromPhone as Y, getCountryNameByCountry as wo, validatePhoneNumber as ko, getDialCodeByCountry as Eo } from "@arcblock/ux/lib/PhoneInput";
+import U, { detectCountryFromPhone as Y, getCountryNameByCountry as vo, validatePhoneNumber as wo, getDialCodeByCountry as ko } from "@arcblock/ux/lib/PhoneInput";
 import k from "lodash/cloneDeep";
-import Io from "lodash/omit";
-import { mergeSx as zo } from "@arcblock/ux/lib/Util/style";
+import Eo from "lodash/omit";
+import { mergeSx as Io } from "@arcblock/ux/lib/Util/style";
 import { LOGIN_PROVIDER as _ } from "@arcblock/ux/lib/Util/constant";
-import { useReactive as E, useCreation as I, useMemoizedFn as Po } from "ahooks";
-import { translate as Vo } from "@arcblock/ux/lib/Locale/util";
-import Bo from "validator/lib/isEmail";
+import { useReactive as E, useCreation as I, useMemoizedFn as zo } from "ahooks";
+import { translate as Po } from "@arcblock/ux/lib/Locale/util";
+import Vo from "validator/lib/isEmail";
 import q from "validator/lib/isPostalCode";
-import { useLocaleContext as Lo } from "@arcblock/ux/lib/Locale/context";
-import { useBrowser as jo } from "@arcblock/react-hooks";
+import { useLocaleContext as Bo } from "@arcblock/ux/lib/Locale/context";
+import { useBrowser as Lo } from "@arcblock/react-hooks";
 import No from "@arcblock/ux/lib/UserCard/Content/clock";
-import { translations as Ao } from "../../libs/locales.js";
-import g, { inputFieldStyle as So, commonInputStyle as Oo } from "../editable-field.js";
-import { LinkPreviewInput as Ro } from "./link-preview-input.js";
-import { defaultButtonStyle as J, currentTimezone as R, primaryButtonStyle as Do } from "./utils.js";
-import { TimezoneSelect as Wo } from "./timezone-select.js";
-import To from "./address.js";
-const Fo = P(() => import("@arcblock/icons/lib/Location")), Mo = P(() => import("@arcblock/icons/lib/Timezone")), $o = P(() => import("@arcblock/icons/lib/Email")), Uo = P(() => import("@arcblock/icons/lib/Phone")), z = {
+import { translations as jo } from "../../libs/locales.js";
+import g, { inputFieldStyle as Ao, commonInputStyle as So } from "../editable-field.js";
+import { LinkPreviewInput as Oo } from "./link-preview-input.js";
+import { defaultButtonStyle as J, currentTimezone as R, primaryButtonStyle as Ro } from "./utils.js";
+import { TimezoneSelect as Do } from "./timezone-select.js";
+import Wo from "./address.js";
+const To = P(() => import("@arcblock/icons/lib/Location")), Fo = P(() => import("@arcblock/icons/lib/Timezone")), Mo = P(() => import("@arcblock/icons/lib/Email")), $o = P(() => import("@arcblock/icons/lib/Phone")), z = {
   width: 20,
   height: 20
 }, K = 200, X = mo(function({
@@ -46,14 +45,14 @@ const Fo = P(() => import("@arcblock/icons/lib/Location")), Mo = P(() => import(
   );
 });
 X.displayName = "BackdropWrap";
-function xe({
+function se({
   isMyself: m,
   user: o,
   onSave: V,
   isMobile: b
 }) {
-  var $, U;
-  const [Z, B] = G(!1), [oo, C] = G(!1), eo = fo(null), no = jo(), u = bo("(max-width:640px)") || no.mobile.any, p = E({
+  var $, G;
+  const [Z, B] = H(!1), [oo, C] = H(!1), eo = fo(null), no = Lo(), u = bo("(max-width:640px)") || no.mobile.any, p = E({
     email: "",
     phone: ""
   }), s = E({
@@ -67,7 +66,7 @@ function xe({
   so(() => {
     u || C(!1);
   }, [u]);
-  const D = I(() => (o == null ? void 0 : o.phoneVerified) ?? !1, [o == null ? void 0 : o.phoneVerified]), W = I(() => (o == null ? void 0 : o.emailVerified) ?? !1, [o == null ? void 0 : o.emailVerified]), { locale: L } = Lo(), c = Po((n, i = {}) => Vo(Ao, n, L, "en", i)), l = E(
+  const D = I(() => (o == null ? void 0 : o.phoneVerified) ?? !1, [o == null ? void 0 : o.phoneVerified]), W = I(() => (o == null ? void 0 : o.emailVerified) ?? !1, [o == null ? void 0 : o.emailVerified]), { locale: L } = Bo(), c = zo((n, i = {}) => Po(jo, n, L, "en", i)), l = E(
     o != null && o.metadata ? k(o.metadata) : {
       joinedAt: o == null ? void 0 : o.createdAt,
       email: o == null ? void 0 : o.email,
@@ -85,10 +84,10 @@ function xe({
       line2: "",
       postalCode: ""
     }
-  ), to = I(() => !!(o != null && o.address), [($ = o == null ? void 0 : o.address) == null ? void 0 : $.country]), y = H(() => {
+  ), to = I(() => !!(o != null && o.address), [($ = o == null ? void 0 : o.address) == null ? void 0 : $.country]), y = Q(() => {
     var n;
     return (n = o == null ? void 0 : o.address) != null && n.country ? o.address.country : L === "zh" ? "cn" : "us";
-  }, [(U = o == null ? void 0 : o.address) == null ? void 0 : U.country, L]), j = I(() => {
+  }, [(G = o == null ? void 0 : o.address) == null ? void 0 : G.country, L]), N = I(() => {
     const n = l.phone ?? (o == null ? void 0 : o.phone) ?? {
       country: y,
       phone: ""
@@ -130,7 +129,7 @@ function xe({
         t[e] = "";
       });
     }), u ? C(!1) : B(!1);
-  }, ao = H(() => {
+  }, ao = Q(() => {
     var i;
     const n = ((i = l == null ? void 0 : l.links) == null ? void 0 : i.map((t) => t.url)) || [""];
     return n.length > 0 ? n : [""];
@@ -147,7 +146,7 @@ function xe({
         url: t
       } : {
         url: t,
-        favicon: vo(t, "favicon.ico")
+        favicon: t
       };
     });
     h(i, "links");
@@ -156,7 +155,7 @@ function xe({
       var d, v;
       const t = i, e = l[t];
       if (e && typeof e == "string" && (l[t] = e.trim()), t === "bio" && (l[t] = (d = l[t]) == null ? void 0 : d.slice(0, K)), t === "timezone" && (l[t] = e || R), t === "phone" && e && typeof e == "object") {
-        const w = e, co = Eo(w.country), N = ((v = w.phoneNumber) == null ? void 0 : v.replace(new RegExp(`^\\+${co}`), "")) || "", po = (N == null ? void 0 : N.trim().length) > 0;
+        const w = e, co = ko(w.country), j = ((v = w.phoneNumber) == null ? void 0 : v.replace(new RegExp(`^\\+${co}`), "")) || "", po = (j == null ? void 0 : j.trim().length) > 0;
         l[t] = {
           country: w.country,
           ...po ? { phoneNumber: w.phoneNumber } : {}
@@ -164,7 +163,7 @@ function xe({
       }
     }), r.postalCode && !q(r.postalCode, "any") && (s.postalCode = c("profile.address.invalidPostalCode")), [p, s].some((i) => Object.values(i).some((t) => t)))
       return;
-    const n = Io(r, "detailedAddress");
+    const n = Eo(r, "detailedAddress");
     n.country || (n.country = y), V({ metadata: l, address: n }), B(!1), C(!1);
   }, M = (n, i = "self") => {
     var t;
@@ -212,7 +211,7 @@ function xe({
             }
           ) : null,
           n && m && to ? /* @__PURE__ */ a(
-            To,
+            Wo,
             {
               address: r,
               errors: s,
@@ -243,10 +242,10 @@ function xe({
                 /* @__PURE__ */ a(S, { variant: "caption", component: "span", children: r[e] })
               ] }, e) : null) }) : null,
               renderValue: () => {
-                const d = [r != null && r.country ? wo(r == null ? void 0 : r.country) : "", r.province, r.city || l.location || ""].filter(Boolean).join(" ");
+                const d = [r != null && r.country ? vo(r == null ? void 0 : r.country) : "", r.province, r.city || l.location || ""].filter(Boolean).join(" ");
                 return /* @__PURE__ */ a(S, { component: "span", children: d });
               },
-              icon: /* @__PURE__ */ a(Fo, { ...z })
+              icon: /* @__PURE__ */ a(To, { ...z })
             }
           ),
           /* @__PURE__ */ a(
@@ -256,11 +255,11 @@ function xe({
               onChange: (e) => h(e, "timezone"),
               editable: n,
               placeholder: "timezone",
-              icon: /* @__PURE__ */ a(Mo, { ...z }),
+              icon: /* @__PURE__ */ a(Fo, { ...z }),
               label: c("profile.timezone"),
               renderValue: (e) => /* @__PURE__ */ a(No, { value: e }),
               children: /* @__PURE__ */ a(
-                Wo,
+                Do,
                 {
                   value: l.timezone || R,
                   onChange: (e) => h(e, "timezone"),
@@ -280,7 +279,7 @@ function xe({
               canEdit: !W,
               verified: W,
               placeholder: "Email",
-              icon: /* @__PURE__ */ a($o, { ...z }),
+              icon: /* @__PURE__ */ a(Mo, { ...z }),
               label: /* @__PURE__ */ x(A, { children: [
                 c("profile.email"),
                 (o == null ? void 0 : o.sourceProvider) === _.EMAIL ? /* @__PURE__ */ a(go, { title: c("profile.emailSourceProviderNotAllowEdit"), children: /* @__PURE__ */ a(
@@ -310,25 +309,25 @@ function xe({
               ) : null,
               onValueValidate: (e) => {
                 let d = "";
-                e && !Bo(e) && (d = c("profile.emailInvalid")), p.email = d;
+                e && !Vo(e) && (d = c("profile.emailInvalid")), p.email = d;
               }
             }
           ),
           /* @__PURE__ */ a(
             g,
             {
-              value: j.phone,
+              value: N.phone,
               editable: n,
               hidePreview: !m,
               canEdit: !D,
               verified: D,
               placeholder: "Phone",
-              icon: /* @__PURE__ */ a(Uo, { ...z }),
+              icon: /* @__PURE__ */ a($o, { ...z }),
               onChange: (e) => h(e, "phone"),
               label: c("profile.phone"),
-              renderValue: () => m ? /* @__PURE__ */ a(Q, { value: j, preview: !0 }) : null,
+              renderValue: () => m ? /* @__PURE__ */ a(U, { value: N, preview: !0 }) : null,
               children: /* @__PURE__ */ a(
-                Q,
+                U,
                 {
                   variant: "outlined",
                   className: "editable-field",
@@ -336,12 +335,12 @@ function xe({
                     sx: { backgroundColor: "transparent" },
                     placeholder: "Phone"
                   },
-                  value: j,
+                  value: N,
                   error: !!p.phone,
                   helperText: p.phone,
-                  sx: zo(So, p.phone ? {} : Oo),
+                  sx: Io(Ao, p.phone ? {} : So),
                   onChange: (e) => {
-                    ko(e.phone, e.country) ? p.phone = "" : p.phone = c("profile.phoneInvalid"), h(
+                    wo(e.phone, e.country) ? p.phone = "" : p.phone = c("profile.phoneInvalid"), h(
                       {
                         country: e.country,
                         phoneNumber: e.phone
@@ -353,7 +352,7 @@ function xe({
               )
             }
           ),
-          /* @__PURE__ */ a(Ro, { editable: n, links: ao, onChange: lo }),
+          /* @__PURE__ */ a(Oo, { editable: n, links: ao, onChange: lo }),
           n && m ? /* @__PURE__ */ x(
             f,
             {
@@ -384,7 +383,7 @@ function xe({
                     disabled: !!p.email || !!p.phone,
                     variant: "outlined",
                     sx: {
-                      ...Do,
+                      ...Ro,
                       minWidth: "54px",
                       "&.Mui-disabled": {
                         backgroundColor: "rgba(0, 0, 0, 0.12)"
@@ -506,5 +505,5 @@ const Go = Co(f)`
   }
 `;
 export {
-  xe as default
+  se as default
 };

package/lib/UserCenter/components/user-info/utils.js

@@ -1,50 +1,94 @@
-import c from "moment-timezone";
 import a from "dayjs";
-import { DurationEnum as s } from "../../../@types/index.js";
-const u = 3600, d = 1800, m = 600, f = 300, b = 60, p = 1, g = c.tz.guess(), A = () => c.tz.names().map((r) => {
-  const n = c.tz(r).utcOffset() / 60, t = Math.floor(n), i = n % 1 * 60;
-  return { label: `GMT${t >= 0 ? "+" : ""}${t}:${i === 30 ? "30" : "00"}`, value: r };
-}).sort((r, n) => {
-  const [t, i] = r.label.replace("GMT", "").split(":").map(Number), [l, y] = n.label.replace("GMT", "").split(":").map(Number), T = t * 60 + i;
-  return l * 60 + y - T;
-}).map((r) => ({
-  label: `(${r.label}) ${r.value}`,
-  value: r.value
-})), M = (o) => /^(https?:\/\/)?((([a-zA-Z\d]([a-zA-Z\d-]*[a-zA-Z\d])*)\.)+[a-zA-Z]{2,}|((\d{1,3}\.){3}\d{1,3}))(:\d+)?(\/[-a-zA-Z\d%_.~+]*)*(\?[;&a-zA-Z\d%_.~+=-]*)?(#[a-zA-Z\d_]*)?$/.test(o), N = (o) => {
-  var n;
-  let e = ((n = o == null ? void 0 : o.dateRange) == null ? void 0 : n.map((t) => a(t))) ?? [];
-  const r = a();
-  switch (o == null ? void 0 : o.duration) {
-    case s.ThirtyMinutes:
-      e = [r, r.add(30, "minutes")];
+import T from "dayjs/plugin/timezone";
+import g from "dayjs/plugin/utc";
+import { DurationEnum as i } from "../../../@types/index.js";
+a.extend(g);
+a.extend(T);
+const l = 3600, u = 1800, m = 600, d = 300, f = 60, p = 1, M = a.tz.guess(), A = [
+  "America/New_York",
+  "America/Chicago",
+  "America/Denver",
+  "America/Los_Angeles",
+  "Europe/London",
+  "Europe/Paris",
+  "Europe/Berlin",
+  "Europe/Rome",
+  "Asia/Tokyo",
+  "Asia/Shanghai",
+  "Asia/Hong_Kong",
+  "Asia/Singapore",
+  "Asia/Seoul",
+  "Asia/Kolkata",
+  "Australia/Sydney",
+  "Australia/Melbourne",
+  "Pacific/Auckland",
+  "America/Sao_Paulo",
+  "America/Mexico_City",
+  "Africa/Cairo",
+  "UTC"
+], h = () => {
+  if (typeof Intl < "u" && Intl.supportedValuesOf)
+    try {
+      return Intl.supportedValuesOf("timeZone");
+    } catch {
+      console.warn("Intl.supportedValuesOf not supported, falling back to common timezones");
+    }
+  if (typeof Intl < "u" && Intl.DateTimeFormat)
+    try {
+      if (new Intl.DateTimeFormat("en", { timeZone: "UTC" }).resolvedOptions().timeZone)
+        return A;
+    } catch {
+      console.warn("Intl.DateTimeFormat timezone support limited");
+    }
+  return A;
+}, I = () => h().map((e) => {
+  try {
+    const t = a.tz(a(), e).utcOffset() / 60, n = Math.floor(t), s = t % 1 * 60;
+    return { label: `GMT${n >= 0 ? "+" : ""}${n}:${s === 30 ? "30" : "00"}`, value: e };
+  } catch {
+    return console.warn(`Timezone ${e} not supported, skipping`), null;
+  }
+}).filter((e) => e !== null).sort((e, t) => {
+  const [n, s] = e.label.replace("GMT", "").split(":").map(Number), [c, b] = t.label.replace("GMT", "").split(":").map(Number), y = n * 60 + s;
+  return c * 60 + b - y;
+}).map((e) => ({
+  label: `(${e.label}) ${e.value}`,
+  value: e.value
+})), N = (r) => /^(https?:\/\/)?((([a-zA-Z\d]([a-zA-Z\d-]*[a-zA-Z\d])*)\.)+[a-zA-Z]{2,}|((\d{1,3}\.){3}\d{1,3}))(:\d+)?(\/[-a-zA-Z\d%_.~+]*)*(\?[;&a-zA-Z\d%_.~+=-]*)?(#[a-zA-Z\d_]*)?$/.test(r), _ = (r) => {
+  var t;
+  let o = ((t = r == null ? void 0 : r.dateRange) == null ? void 0 : t.map((n) => a(n))) ?? [];
+  const e = a();
+  switch (r == null ? void 0 : r.duration) {
+    case i.ThirtyMinutes:
+      o = [e, e.add(30, "minutes")];
       break;
-    case s.OneHour:
-      e = [r, r.add(1, "hour")];
+    case i.OneHour:
+      o = [e, e.add(1, "hour")];
       break;
-    case s.FourHours:
-      e = [r, r.add(4, "hours")];
+    case i.FourHours:
+      o = [e, e.add(4, "hours")];
       break;
-    case s.Today:
-      e = [r, r.endOf("day")];
+    case i.Today:
+      o = [e, e.endOf("day")];
       break;
-    case s.ThisWeek:
-      e = [r, r.endOf("week")];
+    case i.ThisWeek:
+      o = [e, e.endOf("week")];
       break;
-    case s.NoClear:
-      e = [r, r];
+    case i.NoClear:
+      o = [e, e];
       break;
   }
-  return e.map((t) => t.toDate());
-}, S = (o) => {
-  const e = a();
-  return e.isAfter(a(o[0])) && e.isBefore(a(o[1]));
-}, O = (o) => {
-  const { duration: e, dateRange: r } = o ?? {};
-  return !e || !r ? !1 : e === s.NoClear || a(r == null ? void 0 : r[0]).isSame(a(r == null ? void 0 : r[1]));
-}, v = (o) => {
-  const e = a(), n = a(o).diff(e, "seconds"), t = (i) => i * 1e3;
-  return n >= u ? t(u) : n >= d ? t(d) : n >= m ? t(m) : n >= f ? t(f) : n >= b ? t(b) : n >= p ? t(p) : 0;
-}, B = {
+  return o.map((n) => n.toDate());
+}, E = (r) => {
+  const o = a();
+  return o.isAfter(a(r[0])) && o.isBefore(a(r[1]));
+}, Z = (r) => {
+  const { duration: o, dateRange: e } = r ?? {};
+  return !o || !e ? !1 : o === i.NoClear || a(e == null ? void 0 : e[0]).isSame(a(e == null ? void 0 : e[1]));
+}, v = (r) => {
+  const o = a(), t = a(r).diff(o, "seconds"), n = (s) => s * 1e3;
+  return t >= l ? n(l) : t >= u ? n(u) : t >= m ? n(m) : t >= d ? n(d) : t >= f ? n(f) : t >= p ? n(p) : 0;
+}, w = {
   color: "text.primary",
   borderColor: "grey.100",
   backgroundColor: "background.default",
@@ -54,7 +98,7 @@ const u = 3600, d = 1800, m = 600, f = 300, b = 60, p = 1, g = c.tz.guess(), A =
   },
   py: 0.5,
   borderRadius: 1
-}, Z = {
+}, B = {
   color: "primary.contrastText",
   borderColor: "primary.main",
   backgroundColor: "primary.main",
@@ -66,13 +110,13 @@ const u = 3600, d = 1800, m = 600, f = 300, b = 60, p = 1, g = c.tz.guess(), A =
   borderRadius: 1
 };
 export {
-  g as currentTimezone,
-  B as defaultButtonStyle,
-  N as getStatusDuration,
+  M as currentTimezone,
+  w as defaultButtonStyle,
+  _ as getStatusDuration,
   v as getTimeRemaining,
-  A as getTimezones,
-  O as isNotClear,
-  M as isValidUrl,
-  S as isWithinTimeRange,
-  Z as primaryButtonStyle
+  I as getTimezones,
+  Z as isNotClear,
+  N as isValidUrl,
+  E as isWithinTimeRange,
+  B as primaryButtonStyle
 };

package/lib/packages/blocklet-ui-react/lib/UserCenter/components/nft.d.ts

@@ -1,4 +1,4 @@
 export { H as default };
-declare function H({ user: d }: {
+declare function H({ user: p }: {
     user: any;
 }): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/lib/packages/blocklet-ui-react/lib/UserCenter/components/user-info/link-preview-input.d.ts

@@ -1,5 +1,5 @@
-export { ie as LinkPreviewInput };
-declare function ie({ editable: e, links: n, onChange: i }: {
+export { oe as LinkPreviewInput };
+declare function oe({ editable: e, links: n, onChange: i }: {
     editable?: boolean | undefined;
     links?: any[] | undefined;
     onChange: any;

package/lib/packages/blocklet-ui-react/lib/UserCenter/components/user-info/metadata.d.ts

@@ -1,5 +1,5 @@
-export { xe as default };
-declare function xe({ isMyself: m, user: o, onSave: V, isMobile: b }: {
+export { se as default };
+declare function se({ isMyself: m, user: o, onSave: V, isMobile: b }: {
     isMyself: any;
     user: any;
     onSave: any;

package/lib/packages/blocklet-ui-react/lib/UserCenter/components/user-info/utils.d.ts

@@ -1,5 +1,5 @@
-declare const g: string;
-declare const B: {
+declare const M: string;
+declare const w: {
     color: string;
     borderColor: string;
     backgroundColor: string;
@@ -10,16 +10,16 @@ declare const B: {
     py: number;
     borderRadius: number;
 };
-declare function N(o: any): any;
-declare function v(o: any): number;
-declare function A(): {
+declare function _(r: any): any;
+declare function v(r: any): number;
+declare function I(): {
     label: string;
     value: string;
 }[];
-declare function O(o: any): boolean;
-declare function M(o: any): boolean;
-declare function S(o: any): boolean;
-declare const Z: {
+declare function Z(r: any): boolean;
+declare function N(r: any): boolean;
+declare function E(r: any): boolean;
+declare const B: {
     color: string;
     borderColor: string;
     backgroundColor: string;
@@ -30,4 +30,4 @@ declare const Z: {
     py: number;
     borderRadius: number;
 };
-export { g as currentTimezone, B as defaultButtonStyle, N as getStatusDuration, v as getTimeRemaining, A as getTimezones, O as isNotClear, M as isValidUrl, S as isWithinTimeRange, Z as primaryButtonStyle };
+export { M as currentTimezone, w as defaultButtonStyle, _ as getStatusDuration, v as getTimeRemaining, I as getTimezones, Z as isNotClear, N as isValidUrl, E as isWithinTimeRange, B as primaryButtonStyle };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/ui-react",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "description": "Some useful front-end web components that can be used in Blocklets.",
   "keywords": [
     "react",
@@ -34,9 +34,9 @@
   "dependencies": {
     "@abtnode/constant": "^1.16.44",
     "@abtnode/util": "^1.16.44",
-    "@arcblock/bridge": "3.0.0",
-    "@arcblock/icons": "3.0.0",
-    "@arcblock/react-hooks": "3.0.0",
+    "@arcblock/bridge": "3.0.2",
+    "@arcblock/icons": "3.0.2",
+    "@arcblock/react-hooks": "3.0.2",
     "@arcblock/ws": "^1.20.14",
     "@blocklet/constant": "^1.16.44",
     "@blocklet/did-space-react": "^1.0.62",
@@ -54,7 +54,6 @@
     "is-url": "^1.2.4",
     "js-cookie": "^2.2.1",
     "lodash": "^4.17.21",
-    "moment-timezone": "^0.5.48",
     "notistack": "^2.0.8",
     "p-all": "^5.0.0",
     "p-queue": "^6.6.2",
@@ -89,5 +88,5 @@
     "jest": "^29.7.0",
     "unbuild": "^2.0.0"
   },
-  "gitHead": "b001c32ca85d40d8a0784ca581bfd54d90550b24"
+  "gitHead": "82d588535242081273ada50bca749f532689b785"
 }

package/src/UserCenter/components/nft.tsx

@@ -97,6 +97,12 @@ export default function Nft({ user }: { user: User }) {
           }}>
           {t('common.nft')}
         </Typography>
+
+        {data?.assets?.length === 0 && !loading && (
+          <Box sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', width: '100%', height: '100%' }}>
+            <Empty>{t('common.noNFT')}</Empty>
+          </Box>
+        )}
         <Box
           className="nft-list-wrapper"
           sx={{
@@ -130,18 +136,6 @@ export default function Nft({ user }: { user: User }) {
               />
             </Box>
           ))}
-          {data?.assets?.length === 0 && !loading && (
-            <Box
-              sx={{
-                display: 'flex',
-                justifyContent: 'center',
-                alignItems: 'center',
-                width: '100%',
-                height: '100%',
-              }}>
-              <Empty>{t('common.noNFT')}</Empty>
-            </Box>
-          )}
         </Box>
         {dataPage.next || paging.page > 1 ? (
           <Pagination

package/src/UserCenter/components/user-info/link-preview-input.tsx

@@ -1,4 +1,4 @@
-import { ChangeEvent, useEffect, useMemo, useState } from 'react';
+import { ChangeEvent, useMemo, useState } from 'react';
 import { Box, Button, FormControl, IconButton, styled, TextField, Typography, useTheme } from '@mui/material';
 import { Remove as RemoveIcon, Add as AddIcon } from '@mui/icons-material';
 import { translate } from '@arcblock/ux/lib/Locale/util';
@@ -6,7 +6,7 @@ import { useMemoizedFn } from 'ahooks';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import LinkIcon from '@arcblock/icons/lib/Link';
 import { mergeSx } from '@arcblock/ux/lib/Util/style';
-import { joinURL, withoutProtocol } from 'ufo';
+import { withoutProtocol } from 'ufo';
 import { isValidUrl } from './utils';
 import { translations } from '../../libs/locales';
 import { commonInputStyle, inputFieldStyle } from '../editable-field';
@@ -158,49 +158,16 @@ function DynamicLinkForm({ links = [], onChange }: { links: string[]; onChange:
  * favicon 预览
  */
 function FaviconPreview({ link }: { link: string }) {
-  const [favicon, setFavicon] = useState('');
-  const [iconError, setIconError] = useState(false); // 控制是否显示默认图标
   const theme = useTheme();
   const isDark = theme.palette.mode === 'dark';
 
-  useEffect(() => {
-    try {
-      if (link) {
-        const url = new URL(link);
-        const faviconUrl = joinURL(url.origin, 'favicon.ico');
-
-        // 尝试加载 Favicon
-        const img = new Image();
-        img.src = faviconUrl;
-        // TODO: CSP 导致解析失败
-        img.onload = () => {
-          setFavicon(faviconUrl);
-          setIconError(false);
-        };
-        img.onerror = () => {
-          setIconError(true);
-          setFavicon('');
-        };
-      } else {
-        setIconError(true);
-        setFavicon('');
-      }
-    } catch (error) {
-      setIconError(true); // URL 解析失败，直接回退到默认图标
-    }
-  }, [link]);
-
   if (!link) {
     return null;
   }
 
-  if (iconError || !favicon) {
-    return (
-      <LinkIcon width={20} height={20} style={{ filter: isDark ? 'brightness(0) saturate(100%) invert(1)' : 'none' }} />
-    );
-  }
-
-  return <img src={favicon} alt="Favicon" width={20} height={20} />;
+  return (
+    <LinkIcon width={20} height={20} style={{ filter: isDark ? 'brightness(0) saturate(100%) invert(1)' : 'none' }} />
+  );
 }
 
 export function LinkPreviewInput({

package/src/UserCenter/components/user-info/metadata.tsx

@@ -3,7 +3,6 @@ import { Box, Backdrop, useMediaQuery, SwipeableDrawer, Typography, Tooltip } fr
 import type { BackdropProps } from '@mui/material';
 
 import styled from '@emotion/styled';
-import { joinURL } from 'ufo';
 import Button from '@arcblock/ux/lib/Button';
 import PhoneInput, {
   PhoneValue,
@@ -271,7 +270,7 @@ export default function UserMetadataComponent({
       }
       return {
         url: link,
-        favicon: joinURL(link, 'favicon.ico'),
+        favicon: link,
       };
     });
     onChange(newLinks, 'links');

package/src/UserCenter/components/user-info/utils.ts

@@ -1,7 +1,12 @@
-import moment from 'moment-timezone';
 import dayjs from 'dayjs';
+import timezone from 'dayjs/plugin/timezone';
+import utc from 'dayjs/plugin/utc';
 import { DurationEnum, UserMetadata } from '../../../@types';
 
+// 扩展 dayjs 插件
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
 const HOUR = 3600;
 const MINUTES_30 = 1800;
 const MINUTES_10 = 600;
@@ -9,19 +14,80 @@ const MINUTES_5 = 300;
 const MINUTES_1 = 60;
 const SECOND = 1;
 
-export const currentTimezone = moment.tz.guess();
+export const currentTimezone = dayjs.tz.guess();
+
+// 常用时区列表，作为兼容性 fallback
+const COMMON_TIMEZONES = [
+  'America/New_York',
+  'America/Chicago',
+  'America/Denver',
+  'America/Los_Angeles',
+  'Europe/London',
+  'Europe/Paris',
+  'Europe/Berlin',
+  'Europe/Rome',
+  'Asia/Tokyo',
+  'Asia/Shanghai',
+  'Asia/Hong_Kong',
+  'Asia/Singapore',
+  'Asia/Seoul',
+  'Asia/Kolkata',
+  'Australia/Sydney',
+  'Australia/Melbourne',
+  'Pacific/Auckland',
+  'America/Sao_Paulo',
+  'America/Mexico_City',
+  'Africa/Cairo',
+  'UTC',
+];
+
+// 获取时区列表的兼容性函数
+const getTimezoneList = () => {
+  // 优先使用现代 API
+  if (typeof Intl !== 'undefined' && Intl.supportedValuesOf) {
+    try {
+      return Intl.supportedValuesOf('timeZone');
+    } catch (error) {
+      console.warn('Intl.supportedValuesOf not supported, falling back to common timezones');
+    }
+  }
 
-export const getTimezones = () => {
-  const timezones = moment.tz.names();
+  // 尝试使用 Intl.DateTimeFormat 获取时区
+  if (typeof Intl !== 'undefined' && Intl.DateTimeFormat) {
+    try {
+      // 使用 resolvedOptions 检测当前时区是否可用
+      const formatter = new Intl.DateTimeFormat('en', { timeZone: 'UTC' });
+      if (formatter.resolvedOptions().timeZone) {
+        return COMMON_TIMEZONES;
+      }
+    } catch (error) {
+      console.warn('Intl.DateTimeFormat timezone support limited');
+    }
+  }
 
-  const formattedTimezones = timezones.map((tz) => {
-    const offset = moment.tz(tz).utcOffset() / 60; // 计算 UTC 偏移 (小时)
-    const hours = Math.floor(offset);
-    const minutes = (offset % 1) * 60;
-    const label = `GMT${hours >= 0 ? '+' : ''}${hours}:${minutes === 30 ? '30' : '00'}`;
+  // 最后的 fallback
+  return COMMON_TIMEZONES;
+};
 
-    return { label, value: tz };
-  });
+export const getTimezones = () => {
+  const timezones = getTimezoneList();
+
+  const formattedTimezones = timezones
+    .map((tz) => {
+      try {
+        const offset = dayjs.tz(dayjs(), tz).utcOffset() / 60; // 计算 UTC 偏移 (小时)
+        const hours = Math.floor(offset);
+        const minutes = (offset % 1) * 60;
+        const label = `GMT${hours >= 0 ? '+' : ''}${hours}:${minutes === 30 ? '30' : '00'}`;
+
+        return { label, value: tz };
+      } catch (error) {
+        // 如果时区不支持，跳过
+        console.warn(`Timezone ${tz} not supported, skipping`);
+        return null;
+      }
+    })
+    .filter((tz): tz is { label: string; value: string } => tz !== null); // 类型守卫
 
   return formattedTimezones
     .sort((a, b) => {