@arcblock/ux 3.2.5 → 3.2.7

package/lib/Dialog/dialog.d.ts

@@ -6,34 +6,58 @@ export type PaperStyle = import('@mui/material').PaperProps & {
     minHeight?: number | string;
 };
 export type UxDialogProps = {
+    /**
+     * - The content of the dialog.
+     */
     /**
      * - The content of the dialog.
      */
     children: React.ReactNode;
+    /**
+     * - The title of the dialog.
+     */
     /**
      * - The title of the dialog.
      */
     title?: React.ReactNode;
+    /**
+     * - Content to be displayed before the dialog title.
+     */
     /**
      * - Content to be displayed before the dialog title.
      */
     prepend?: React.ReactNode;
+    /**
+     * - Content to be displayed in the top toolbar of the dialog.
+     */
     /**
      * - Content to be displayed in the top toolbar of the dialog.
      */
     toolbar?: React.ReactNode;
+    /**
+     * - Content to be displayed in the bottom actions toolbar of the dialog.
+     */
     /**
      * - Content to be displayed in the bottom actions toolbar of the dialog.
      */
     actions?: React.ReactNode;
+    /**
+     * - Whether or not to show the close button.
+     */
     /**
      * - Whether or not to show the close button.
      */
     showCloseButton?: boolean | undefined;
+    /**
+     * - The position of the actions toolbar.
+     */
     /**
      * - The position of the actions toolbar.
      */
     actionsPosition?: "left" | "right" | "center" | undefined;
+    /**
+     * - Props to be passed down to the dialog paper.
+     */
     /**
      * - Props to be passed down to the dialog paper.
      */
@@ -41,6 +65,9 @@ export type UxDialogProps = {
     slotProps?: {
         content: object;
     } | undefined;
+    /**
+     * - Callback function fired when the dialog is closed.
+     */
     /**
      * - Callback function fired when the dialog is closed.
      */

package/lib/Img/index.d.ts

@@ -1,6 +1,9 @@
 import { default as PropTypes } from 'prop-types';
 export default Img;
 export type ImgExProps = {
+    /**
+     * - required
+     */
     /**
      * - required
      */
@@ -16,6 +19,9 @@ export type ImgExProps = {
     lazy?: boolean | undefined;
     placeholder?: string | undefined;
     fallback?: string | undefined;
+    /**
+     * - 是否使用代理 fallback, 用于解决 CSP 的问题
+     */
     /**
      * - 是否使用代理 fallback, 用于解决 CSP 的问题
      */

package/lib/RelativeTime/index.js

@@ -1,21 +1,21 @@
-import { jsxs as I, jsx as n, Fragment as F } from "react/jsx-runtime";
-import { Box as a, Tooltip as M } from "@mui/material";
-import { useEffect as R, useMemo as $ } from "react";
-import s from "dayjs";
+import { jsxs as I, jsx as o, Fragment as $ } from "react/jsx-runtime";
+import { Box as c, Tooltip as z } from "@mui/material";
+import { useEffect as F, useMemo as N } from "react";
+import a from "dayjs";
 import "dayjs/locale/zh-cn";
-import k from "dayjs/plugin/utc";
-import B from "dayjs/plugin/timezone";
-import E from "dayjs/plugin/relativeTime";
-import H from "dayjs/plugin/updateLocale";
-import N from "dayjs/plugin/localizedFormat";
-import { create as Z } from "zustand";
-import { formatToDatetime as O, setDateTool as q } from "../Util/index.js";
-s.extend(N);
-s.extend(k);
-s.extend(B);
-s.extend(H);
-s.extend(E);
-s.updateLocale("zh-cn", {
+import R from "dayjs/plugin/utc";
+import V from "dayjs/plugin/timezone";
+import k from "dayjs/plugin/relativeTime";
+import B from "dayjs/plugin/updateLocale";
+import E from "dayjs/plugin/localizedFormat";
+import { create as H } from "zustand";
+import { formatToDatetime as O, setDateTool as Z } from "../Util/index.js";
+a.extend(E);
+a.extend(R);
+a.extend(V);
+a.extend(B);
+a.extend(k);
+a.updateLocale("zh-cn", {
   // copy with https://github.com/iamkun/dayjs/blob/dev/src/locale/zh-cn.js
   relativeTime: {
     future: "%s后",
@@ -33,7 +33,7 @@ s.updateLocale("zh-cn", {
     yy: "%d 年"
   }
 });
-q(s);
+Z(a);
 const j = {
   en: {
     utc: "UTC Timezone",
@@ -47,55 +47,59 @@ const j = {
     shortUTC: "UTC",
     shortLocal: "当前时区"
   }
-}, A = Z((t) => ({
+}, w = H((i) => ({
   isUtc: !1,
-  setIsUtc: (o) => t({ isUtc: o })
+  setIsUtc: (e) => i({ isUtc: e })
 }));
-function w({
-  value: t,
-  locale: o = "en",
-  withoutSuffix: p = !1,
-  from: d = "",
-  to: x = "",
-  type: i = "relative",
-  tz: l,
-  relativeRange: m,
+function q(i) {
+  let e = i;
+  return typeof e == "string" && /^\d+$/.test(e) && (e = Number(e)), typeof e == "number" ? Math.abs(Math.trunc(e)) < 1e11 ? new Date(e * 1e3).getTime() : new Date(e).getTime() : new Date(e).getTime();
+}
+function G({
+  value: i,
+  locale: e = "en",
+  withoutSuffix: d = !1,
+  from: f = "",
+  to: h = "",
+  type: r = "relative",
+  tz: s,
+  relativeRange: p,
   format: g
 }) {
-  const C = (/* @__PURE__ */ new Date()).getTimezoneOffset(), T = C > 0 ? "-" : "+", v = Math.abs(C) / 60, L = C === 0, r = A((y) => y.isUtc), U = A((y) => y.setIsUtc);
-  if (R(() => {
-    U(L);
-  }, [L]), !t)
-    return { innerContent: "-", popContent: "-", isUtc: r, setIsUtc: U, sign: T, hoursOffset: v };
-  const h = o === "zh" ? "zh-cn" : "en-us";
-  let c = s(t).locale(h);
-  i === "utc" && (c = s(t).utc().locale(h)), l && (c = c.tz(l));
-  const f = O(t, { locale: h, tz: l, format: g });
-  let e;
-  if (d)
-    e = c.from(d, p);
-  else if (x)
-    e = c.to(x, p);
-  else if (m) {
-    const y = c.diff(s());
-    Math.abs(y) > m && (e = f);
+  const x = (/* @__PURE__ */ new Date()).getTimezoneOffset(), T = x > 0 ? "-" : "+", L = Math.abs(x) / 60, b = x === 0, l = w((v) => v.isUtc), C = w((v) => v.setIsUtc);
+  if (F(() => {
+    C(b);
+  }, [b]), !i)
+    return { innerContent: "-", popContent: "-", isUtc: l, setIsUtc: C, sign: T, hoursOffset: L };
+  const U = q(i), u = e === "zh" ? "zh-cn" : "en";
+  let t = a(U);
+  r === "utc" && (t = t.utc()), s && (t = t.tz(s)), t = t.locale(u);
+  const m = O(U, { locale: u, tz: s, format: g });
+  let n;
+  if (f)
+    n = t.from(f, d);
+  else if (h)
+    n = t.to(h, d);
+  else if (p) {
+    const v = t.diff(a());
+    Math.abs(v) > p && (n = m);
   }
-  e || (e = c.fromNow(p));
-  let u = e, b = f;
-  return i === "absolute" && (u = f, b = e), i === "utc" && (r ? (u = O(t, { locale: h, tz: l, isUtc: !0, format: g }), b = O(t, { locale: h, tz: l, isUtc: !0, format: g })) : (u = f, b = e)), { innerContent: u, popContent: b, isUtc: r, setIsUtc: U, sign: T, hoursOffset: v, relativeString: e, absoluteString: f };
+  n || (n = t.fromNow(d));
+  let y = n, D = m;
+  return r === "absolute" && (y = m, D = n), r === "utc" && (l ? (y = O(U, { locale: u, tz: s, isUtc: !0, format: g }), D = O(U, { locale: u, tz: s, isUtc: !0, format: g })) : (y = m, D = n)), { innerContent: y, popContent: D, isUtc: l, setIsUtc: C, sign: T, hoursOffset: L, relativeString: n, absoluteString: m };
 }
-function z({
-  locale: t,
-  isUtc: o = !1,
-  setIsUtc: p,
-  useShortTimezone: d = !0
+function A({
+  locale: i,
+  isUtc: e = !1,
+  setIsUtc: d,
+  useShortTimezone: f = !0
 }) {
-  const x = $(() => {
-    const i = d ? "shortUTC" : "utc", l = d ? "shortLocal" : "local", m = j[t] || j.en;
-    return o ? `${m[i]}` : `${m[l]}`;
-  }, [t, d, o]);
-  return /* @__PURE__ */ n(
-    a,
+  const h = N(() => {
+    const r = f ? "shortUTC" : "utc", s = f ? "shortLocal" : "local", p = j[i] || j.en;
+    return e ? `${p[r]}` : `${p[s]}`;
+  }, [i, f, e]);
+  return /* @__PURE__ */ o(
+    c,
     {
       component: "span",
       sx: {
@@ -107,63 +111,63 @@ function z({
         padding: "4px 8px",
         lineHeight: 1
       },
-      onClick: () => p(!o),
-      children: x
+      onClick: () => d(!e),
+      children: h
     }
   );
 }
-function et({
-  value: t,
-  locale: o = "en",
-  withoutSuffix: p = !1,
-  from: d = "",
-  to: x = "",
-  type: i = "relative",
-  tz: l = void 0,
-  relativeRange: m = void 0,
+function oe({
+  value: i,
+  locale: e = "en",
+  withoutSuffix: d = !1,
+  from: f = "",
+  to: h = "",
+  type: r = "relative",
+  tz: s = void 0,
+  relativeRange: p = void 0,
   enableTooltip: g = !0,
-  useShortTimezone: D = !1,
-  disableTimezone: C = !1,
+  useShortTimezone: M = !1,
+  disableTimezone: x = !1,
   placement: T = "top-end",
-  format: v = "lll",
-  mode: L = "all",
-  ...r
+  format: L = "lll",
+  mode: b = "all",
+  ...l
 }) {
-  const { innerContent: U, popContent: h, isUtc: c, setIsUtc: f, relativeString: e } = w({
-    value: t,
-    locale: o,
-    withoutSuffix: p,
-    from: d,
-    to: x,
-    type: i === "all" ? "utc" : i,
-    tz: l,
-    relativeRange: m,
-    format: v
-  }), u = /* @__PURE__ */ I(
-    a,
+  const { innerContent: C, popContent: U, isUtc: u, setIsUtc: t, relativeString: m } = G({
+    value: i,
+    locale: e,
+    withoutSuffix: d,
+    from: f,
+    to: h,
+    type: r === "all" ? "utc" : r,
+    tz: s,
+    relativeRange: p,
+    format: L
+  }), n = /* @__PURE__ */ I(
+    c,
     {
-      ...r,
+      ...l,
       sx: [
         {
           display: "inline-flex",
           alignItems: "center",
           gap: 0.5
         },
-        ...Array.isArray(r.sx) ? r.sx : [r.sx]
+        ...Array.isArray(l.sx) ? l.sx : [l.sx]
       ],
       children: [
-        /* @__PURE__ */ n(a, { component: "span", ...r, sx: {}, children: U }),
-        /* @__PURE__ */ n(a, { component: "span", sx: { color: "inherit" }, children: "·" }),
-        /* @__PURE__ */ n(a, { component: "span", sx: { color: "inherit" }, children: e }),
-        !C && /* @__PURE__ */ I(F, { children: [
-          /* @__PURE__ */ n(a, { component: "span", sx: { color: "inherit" }, children: "·" }),
-          /* @__PURE__ */ n(z, { locale: o, isUtc: c, setIsUtc: f, useShortTimezone: D })
+        /* @__PURE__ */ o(c, { component: "span", ...l, sx: {}, children: C }),
+        /* @__PURE__ */ o(c, { component: "span", sx: { color: "inherit" }, children: "·" }),
+        /* @__PURE__ */ o(c, { component: "span", sx: { color: "inherit" }, children: m }),
+        !x && /* @__PURE__ */ I($, { children: [
+          /* @__PURE__ */ o(c, { component: "span", sx: { color: "inherit" }, children: "·" }),
+          /* @__PURE__ */ o(A, { locale: e, isUtc: u, setIsUtc: t, useShortTimezone: M })
         ] })
       ]
     }
   );
-  return L === "daysLeft" ? /* @__PURE__ */ n(M, { title: u, placement: T, enterTouchDelay: 0, children: /* @__PURE__ */ n(a, { component: "span", children: e }) }) : i === "all" && L === "all" ? /* @__PURE__ */ n(M, { title: void 0, placement: T, enterTouchDelay: 0, children: u }) : /* @__PURE__ */ n(M, { title: g ? h : void 0, placement: T, enterTouchDelay: 0, children: /* @__PURE__ */ I(
-    a,
+  return b === "daysLeft" ? /* @__PURE__ */ o(z, { title: n, placement: T, enterTouchDelay: 0, children: /* @__PURE__ */ o(c, { component: "span", children: m }) }) : r === "all" && b === "all" ? /* @__PURE__ */ o(z, { title: void 0, placement: T, enterTouchDelay: 0, children: n }) : /* @__PURE__ */ o(z, { title: g ? U : void 0, placement: T, enterTouchDelay: 0, children: /* @__PURE__ */ I(
+    c,
     {
       sx: {
         display: "inline-flex",
@@ -171,12 +175,12 @@ function et({
         gap: 1
       },
       children: [
-        /* @__PURE__ */ n(a, { component: "span", ...r, children: U }),
-        i === "utc" && !C && /* @__PURE__ */ n(z, { locale: o, isUtc: c, setIsUtc: f, useShortTimezone: D })
+        /* @__PURE__ */ o(c, { component: "span", ...l, children: C }),
+        r === "utc" && !x && /* @__PURE__ */ o(A, { locale: e, isUtc: u, setIsUtc: t, useShortTimezone: M })
       ]
     }
   ) });
 }
 export {
-  et as default
+  oe as default
 };

package/lib/Util/constant.d.ts

@@ -26,15 +26,7 @@ export declare const LOGIN_PROVIDER: {
     TWITTER: string;
 };
 export declare const LOGIN_PROVIDER_NAME: {
-    [LOGIN_PROVIDER.EMAIL]: string;
-    [LOGIN_PROVIDER.AUTH0]: string;
-    [LOGIN_PROVIDER.APPLE]: string;
-    [LOGIN_PROVIDER.GITHUB]: string;
-    [LOGIN_PROVIDER.GOOGLE]: string;
-    [LOGIN_PROVIDER.WALLET]: string;
-    [LOGIN_PROVIDER.NFT]: string;
-    [LOGIN_PROVIDER.PASSKEY]: string;
-    [LOGIN_PROVIDER.TWITTER]: string;
+    [x: string]: string;
 };
 export declare const OAUTH_PROVIDER: {
     email: string;

package/lib/package.json.js

@@ -1,4 +1,4 @@
-const e = "3.2.5", s = { "@blocklet/js-sdk": "1.17.1" }, n = {
+const e = "3.2.7", s = { "@blocklet/js-sdk": "1.17.2" }, n = {
   version: e,
   dependencies: s
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "3.2.5",
+  "version": "3.2.7",
   "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": "8fe09067fd88bc4fd7fe300c984b2b4775fcd128",
+  "gitHead": "756a9f08c4008f45690ef38e612e1c429855948d",
   "dependencies": {
-    "@arcblock/bridge": "3.2.5",
+    "@arcblock/bridge": "3.2.7",
     "@arcblock/did": "^1.27.6",
     "@arcblock/did-motif": "^1.1.14",
-    "@arcblock/icons": "3.2.5",
-    "@arcblock/nft-display": "3.2.5",
-    "@arcblock/react-hooks": "3.2.5",
-    "@blocklet/js-sdk": "1.17.1",
-    "@blocklet/theme": "3.2.5",
+    "@arcblock/icons": "3.2.7",
+    "@arcblock/nft-display": "3.2.7",
+    "@arcblock/react-hooks": "3.2.7",
+    "@blocklet/js-sdk": "1.17.2",
+    "@blocklet/theme": "3.2.7",
     "@fontsource/roboto": "~5.1.1",
     "@fontsource/ubuntu-mono": "^5.2.6",
     "@iconify-icons/logos": "^1.2.36",

package/src/RelativeTime/index.tsx

@@ -76,6 +76,27 @@ export interface RelativeTimeProps {
   mode?: 'all' | 'daysLeft'; // all: 显示所有内容，daysLeft: 只显示剩余天数
 }
 
+function normalizeTimestamp(value: string | number) {
+  let normalizedValue = value;
+  if (typeof normalizedValue === 'string' && /^\d+$/.test(normalizedValue)) {
+    normalizedValue = Number(normalizedValue);
+  }
+
+  if (typeof normalizedValue === 'number') {
+    // 10 位左右：很可能是秒（例如 1699411200）
+    // 13 位左右：很可能是毫秒（例如 1699411200000）
+    const abs = Math.abs(Math.trunc(normalizedValue));
+    // < 100,000,000,000 -> treat as seconds (safe threshold for seconds)
+    if (abs < 1e11) {
+      return new Date(normalizedValue * 1000).getTime();
+    }
+
+    return new Date(normalizedValue).getTime();
+  }
+
+  return new Date(normalizedValue).getTime();
+}
+
 function useRelativeTime({
   value,
   locale = 'en',
@@ -115,18 +136,21 @@ function useRelativeTime({
     return { innerContent: '-', popContent: '-', isUtc, setIsUtc, sign, hoursOffset };
   }
 
-  const localeOption = locale === 'zh' ? 'zh-cn' : 'en-us';
-  let datetime = dayjs(value).locale(localeOption);
+  const normalizedValue = normalizeTimestamp(value);
+  const localeOption = locale === 'zh' ? 'zh-cn' : 'en';
+  let datetime = dayjs(normalizedValue);
 
   if (type === 'utc') {
-    datetime = dayjs(value).utc().locale(localeOption);
+    datetime = datetime.utc();
   }
 
   if (tz) {
     datetime = datetime.tz(tz);
   }
 
-  const absoluteString = formatToDatetime(value, { locale: localeOption, tz, format });
+  datetime = datetime.locale(localeOption);
+
+  const absoluteString = formatToDatetime(normalizedValue, { locale: localeOption, tz, format });
 
   let relativeString;
 
@@ -155,8 +179,8 @@ function useRelativeTime({
 
   if (type === 'utc') {
     if (isUtc) {
-      innerContent = formatToDatetime(value, { locale: localeOption, tz, isUtc: true, format });
-      popContent = formatToDatetime(value, { locale: localeOption, tz, isUtc: true, format });
+      innerContent = formatToDatetime(normalizedValue, { locale: localeOption, tz, isUtc: true, format });
+      popContent = formatToDatetime(normalizedValue, { locale: localeOption, tz, isUtc: true, format });
     } else {
       innerContent = absoluteString;
       popContent = relativeString;