dsh-niuma 0.2.2 → 0.2.3

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 本文件记录用户可感知的变化。版本号遵循语义化版本。
 
+## 0.2.3 — 2026-10-22
+
+### 新增：版本号显示 + 自动更新机制
+
+- **面板底部显示版本号**：`牛马加速器 v0.2.x`（取自宿主 package.json，固定放最底部）
+- **自动检查更新**：宿主启动 8 秒后查一次 npm `dsh-niuma@latest`；有新版本自动下载 tarball 解包到
+  `$DSH_HOME/niuma/updates/<version>/`，**下次启动 DSH 自动覆盖安装并生效**
+- **手动更新**：面板发现新版本时显示「发现新版本 vX · 立即更新」按钮，点击即下载（重启生效）
+- **安全守卫**：
+  - git 开发工作区（存在 `.git`）不自动更新，避免覆盖未提交代码
+  - `NIUMA_UPDATE_DISABLED=1` 可整体关闭
+  - 网络失败只写日志，面板继续用当前版本，不影响计时
+  - 版本比较用内部 semver 实现，不引第三方依赖
+- 新增 `GET/POST /niuma/update` 路由；`GET /niuma/config` 载荷增加 `version`
+- 主金额改为纯文本渲染（逐位轮盘在面板滚动容器里会出现重影）；「加速」= 毫秒级刷新（rAF），
+  末位小数每帧高速变化，视觉上就是数字持续快速上涨
+- 新增 `lib/update.js`（semver 比较、tarball 解包、暂存/应用）与 `tools/verify-update.mjs`（27 项断言）
+
 ## 0.2.2 — 2026-10-22
 
 ### 新增：主金额小数位 + 刷新频率 + 滚动数字/加速

package/README.md

@@ -32,7 +32,8 @@
 - 节假日数据内置在插件中（2026 官方 / 2027 预估），设置区不再需要手工维护一长串日期；2027 官方安排公布后随插件更新
 - 午休可设置起止，**可勾选午休是否算工时**；午休不算工时则午休期间金额冻结
 - 状态徽标：休息日 / 未上班 / 搬砖中 / 午休中 / 已下班
-- 主金额是**连续里程表滚动**：小数末位飞快转、前一位慢 10 倍、整数位慢慢进位；勾选「加速」按屏幕刷新率每帧滚动
+- 面板显示版本号；自动检查 npm 新版本，下载后**重启 DSH 自动生效**（git 开发工作区不覆盖）
+- **加速**：勾选后按屏幕刷新率（≈16ms）刷新，末位小数高速跳动、数字快速上涨；不勾则按刷新频率步进
 - 主金额**小数位可选（0–6）**，右侧下拉即时生效
 - **刷新频率可选**：按秒 / 250ms / 100ms / 50ms / 屏幕刷新率（≈16ms 连续滚动）
 - 今日进度条、距上班/距下班倒计时

package/lib/client.js

@@ -558,14 +558,6 @@ var CARD = {
   boxSizing: "border-box"
 };
 var NUM = { fontVariantNumeric: "tabular-nums", whiteSpace: "nowrap" };
-var GOLD = {
-  color: "#D9A441",
-  backgroundImage: "linear-gradient(180deg, #FFE9A8 0%, #F2C14E 40%, #D79A2B 72%, #B87A16 100%)",
-  WebkitBackgroundClip: "text",
-  backgroundClip: "text",
-  WebkitTextFillColor: "transparent",
-  textShadow: "0 1px 0 rgba(0,0,0,.05)"
-};
 var GOLD_TINT = "#E7B84D";
 var STATUS_META = {
   rest: { key: "statusRest", color: C.label3 },
@@ -612,6 +604,10 @@ var zh = {
   "decimalsLabel": "\u5C0F\u6570",
   "decimalsUnit": "\u4F4D",
   "turboLabel": "\u52A0\u901F",
+  "updateAvailable": "\u53D1\u73B0\u65B0\u7248\u672C v{version}",
+  "updateNow": "\u7ACB\u5373\u66F4\u65B0",
+  "updating": "\u6B63\u5728\u4E0B\u8F7D\u65B0\u7248\u672C\u2026",
+  "updateStaged": "v{version} \u5DF2\u4E0B\u8F7D \xB7 \u91CD\u542F DSH \u751F\u6548",
   "refreshRate": "\u5237\u65B0\u9891\u7387",
   "rateSecond": "\u6309\u79D2\uFF081s\uFF09",
   "rateFrame": "\u5237\u65B0\u7387\uFF08\u224816ms\uFF09",
@@ -716,6 +712,10 @@ var en = {
   "decimalsLabel": "Decimals",
   "decimalsUnit": "dp",
   "turboLabel": "Turbo",
+  "updateAvailable": "New version v{version}",
+  "updateNow": "Update now",
+  "updating": "Downloading update\u2026",
+  "updateStaged": "v{version} downloaded \xB7 restart DSH to apply",
   "refreshRate": "Refresh rate",
   "rateSecond": "Per second (1s)",
   "rateFrame": "Display rate (~16ms)",
@@ -846,6 +846,35 @@ function useRemoteConfig() {
   const refresh = import_react.default.useCallback(() => setTick((n) => n + 1), []);
   return { ...state, refresh };
 }
+function useUpdateInfo() {
+  const [state, setState] = import_react.default.useState({ status: "loading", data: null, error: null });
+  const load = import_react.default.useCallback(() => {
+    if (typeof fetch !== "function") {
+      setState({ status: "failed", data: null, error: "fetch unavailable" });
+      return;
+    }
+    fetch(`${ROUTE_BASE}/update`, { cache: "no-store", credentials: "same-origin" }).then(async (response) => {
+      const body = await response.json();
+      if (!response.ok || !body || body.ok !== true) throw new Error(body && body.error || `HTTP ${response.status}`);
+      return body.data || null;
+    }).then((data) => setState({ status: "ready", data, error: null })).catch((error) => setState({ status: "failed", data: null, error: String(error && error.message || error) }));
+  }, []);
+  import_react.default.useEffect(() => {
+    load();
+    const timer = setInterval(load, 6 * 3600 * 1e3);
+    return () => clearInterval(timer);
+  }, [load]);
+  const download = import_react.default.useCallback(() => {
+    setState((prev) => ({ ...prev, status: "updating" }));
+    if (typeof fetch !== "function") return;
+    fetch(`${ROUTE_BASE}/update`, { method: "POST", credentials: "same-origin" }).then(async (response) => {
+      const body = await response.json();
+      if (!response.ok || !body || body.ok !== true) throw new Error(body && body.error || `HTTP ${response.status}`);
+      return body.data || null;
+    }).then((data) => setState({ status: "ready", data, error: null })).catch((error) => setState({ status: "failed", data: null, error: String(error && error.message || error) }));
+  }, []);
+  return { ...state, reload: load, download };
+}
 function useClock(updateMs) {
   const [now, setNow] = import_react.default.useState(() => /* @__PURE__ */ new Date());
   import_react.default.useEffect(() => {
@@ -936,97 +965,17 @@ function SectionTitle(props) {
     props.hint ? import_react.default.createElement("span", { key: "h", style: { fontSize: 10.5, color: C.label3, ...NUM } }, props.hint) : null
   ]);
 }
-var ROLL_BLOCKS = Array.from({ length: 11 }, (_, i) => String(i % 10));
-function RollingDigit(props) {
-  const heightEm = 1.22;
-  const widthEm = 0.62;
-  const pos = Number.isFinite(props.position) ? props.position : 0;
-  const wheel = (pos % 10 + 10) % 10;
-  return import_react.default.createElement("span", {
-    "aria-hidden": "true",
-    style: {
-      display: "inline-block",
-      position: "relative",
-      overflow: "hidden",
-      width: `${widthEm}em`,
-      height: `${heightEm}em`,
-      verticalAlign: "baseline"
-    }
-  }, [
-    import_react.default.createElement("span", {
-      key: "ghost",
-      style: { visibility: "hidden", display: "block", height: `${heightEm}em`, lineHeight: `${heightEm}em` }
-    }, "0"),
-    import_react.default.createElement("span", {
-      key: "strip",
-      style: {
-        position: "absolute",
-        left: 0,
-        top: 0,
-        display: "flex",
-        flexDirection: "column",
-        transform: `translateY(${-(wheel * heightEm)}em)`,
-        willChange: "transform"
-      }
-    }, ROLL_BLOCKS.map((value, i) => import_react.default.createElement("span", {
-      key: i,
-      style: { display: "block", height: `${heightEm}em`, lineHeight: `${heightEm}em` }
-    }, value)))
-  ]);
-}
 function RollingMoney(props) {
   const decimals = Math.max(0, Math.min(6, Number.isInteger(props.decimals) ? props.decimals : 4));
-  const text = formatMoney(props.value, decimals);
-  const scale = 10 ** decimals;
-  const chars = text.split("");
-  const significances = new Array(chars.length).fill(-1);
-  let seen = 0;
-  for (let i = chars.length - 1; i >= 0; i -= 1) {
-    if (/[0-9]/.test(chars[i])) {
-      significances[i] = seen;
-      seen += 1;
-    }
-  }
   return import_react.default.createElement("span", {
     style: {
-      display: "inline-flex",
-      alignItems: "baseline",
-      letterSpacing: 0,
-      position: "relative",
-      // 等宽字体保证每个数字轮宽度稳定（不裁字、不抖动）
-      fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
+      display: "inline-block",
+      whiteSpace: "nowrap",
+      letterSpacing: "-1.2px",
+      fontVariantNumeric: "tabular-nums",
       ...props.style || {}
     }
-  }, [
-    import_react.default.createElement("span", {
-      key: "sr",
-      style: {
-        position: "absolute",
-        width: 1,
-        height: 1,
-        padding: 0,
-        margin: -1,
-        overflow: "hidden",
-        clip: "rect(0,0,0,0)",
-        whiteSpace: "nowrap",
-        border: 0
-      }
-    }, text),
-    import_react.default.createElement("span", {
-      key: "visual",
-      "aria-hidden": "true",
-      style: { display: "inline-flex", alignItems: "baseline" }
-    }, chars.map((char, i) => {
-      if (!/[0-9]/.test(char)) {
-        return import_react.default.createElement("span", {
-          key: `s${i}`,
-          style: { display: "inline-block", lineHeight: "1.22em" }
-        }, char);
-      }
-      const position = (Number(props.value) || 0) * scale / 10 ** significances[i];
-      return import_react.default.createElement(RollingDigit, { key: `d${i}`, position });
-    }))
-  ]);
+  }, formatMoney(props.value, decimals));
 }
 function HeroCard(props) {
   const t = props.t;
@@ -1083,11 +1032,70 @@ function HeroCard(props) {
         }) : null,
         t("earnedToday")
       ]),
-      import_react.default.createElement(
-        "span",
-        { key: "b", style: { fontSize: 11, color: C.label3, ...NUM } },
-        `${t("todayOn")} ${snap.dateKey}`
-      )
+      import_react.default.createElement("div", {
+        key: "b",
+        style: { display: "flex", flexDirection: "column", alignItems: "flex-end", gap: 4 }
+      }, [
+        import_react.default.createElement(
+          "span",
+          { key: "d", style: { fontSize: 11, color: C.label3, ...NUM } },
+          `${t("todayOn")} ${snap.dateKey}`
+        ),
+        import_react.default.createElement("div", { key: "c", style: { display: "inline-flex", alignItems: "center", gap: 6 } }, [
+          import_react.default.createElement("label", {
+            key: "dec",
+            title: t("decimalsLabel"),
+            style: { display: "inline-flex", alignItems: "center", gap: 3, fontSize: 10, color: C.label3, ...NUM }
+          }, [
+            import_react.default.createElement("span", { key: "l" }, t("decimalsLabel")),
+            import_react.default.createElement("select", {
+              key: "s",
+              value: String(decimals),
+              "aria-label": t("decimalsLabel"),
+              onChange: (event) => onDecimalsChange && onDecimalsChange(Number(event.target.value)),
+              style: {
+                height: 22,
+                padding: "0 2px",
+                borderRadius: 6,
+                border: `1px solid ${C.border1}`,
+                background: C.layer2,
+                color: C.label2,
+                fontSize: 10.5,
+                fontVariantNumeric: "tabular-nums",
+                outline: "none",
+                cursor: "pointer"
+              }
+            }, [0, 1, 2, 3, 4, 5, 6].map((n) => import_react.default.createElement("option", { key: n, value: String(n) }, String(n)))),
+            import_react.default.createElement("span", { key: "u" }, t("decimalsUnit"))
+          ]),
+          import_react.default.createElement("label", {
+            key: "turbo",
+            title: t("turboLabel"),
+            style: {
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 3,
+              fontSize: 10,
+              padding: "1px 6px",
+              borderRadius: 999,
+              border: `1px solid ${turbo ? `color-mix(in srgb, ${GOLD_TINT} 60%, ${C.border1})` : C.border1}`,
+              background: turbo ? `color-mix(in srgb, ${GOLD_TINT} 16%, transparent)` : "transparent",
+              color: turbo ? C.label2 : C.label3,
+              cursor: "pointer",
+              ...NUM
+            }
+          }, [
+            import_react.default.createElement("input", {
+              key: "i",
+              type: "checkbox",
+              checked: turbo,
+              onChange: (event) => onTurboChange && onTurboChange(event.target.checked),
+              style: { accentColor: GOLD_TINT, width: 12, height: 12, margin: 0, cursor: "inherit" }
+            }),
+            import_react.default.createElement("span", { key: "l" }, t("turboLabel"))
+          ])
+        ])
+      ])
     ]),
     import_react.default.createElement("div", {
       key: "amt",
@@ -1101,7 +1109,7 @@ function HeroCard(props) {
           fontSize: 46,
           lineHeight: 1.12,
           fontWeight: 800,
-          ...GOLD,
+          color: "#D9A441",
           ...NUM,
           ...rest ? { opacity: 0.62 } : {}
         }
@@ -1109,67 +1117,7 @@ function HeroCard(props) {
       import_react.default.createElement("span", {
         key: "unit",
         style: { fontSize: 18, fontWeight: 700, color: C.label2, ...NUM }
-      }, "\u5143"),
-      import_react.default.createElement("label", {
-        key: "dec",
-        title: t("decimalsLabel"),
-        style: {
-          marginLeft: "auto",
-          display: "inline-flex",
-          alignItems: "center",
-          gap: 3,
-          fontSize: 10,
-          color: C.label3,
-          ...NUM
-        }
-      }, [
-        import_react.default.createElement("span", { key: "l" }, t("decimalsLabel")),
-        import_react.default.createElement("select", {
-          key: "s",
-          value: String(decimals),
-          "aria-label": t("decimalsLabel"),
-          onChange: (event) => onDecimalsChange && onDecimalsChange(Number(event.target.value)),
-          style: {
-            height: 22,
-            padding: "0 2px",
-            borderRadius: 6,
-            border: `1px solid ${C.border1}`,
-            background: C.layer2,
-            color: C.label2,
-            fontSize: 10.5,
-            fontVariantNumeric: "tabular-nums",
-            outline: "none",
-            cursor: "pointer"
-          }
-        }, [0, 1, 2, 3, 4, 5, 6].map((n) => import_react.default.createElement("option", { key: n, value: String(n) }, String(n)))),
-        import_react.default.createElement("span", { key: "u" }, t("decimalsUnit"))
-      ]),
-      import_react.default.createElement("label", {
-        key: "turbo",
-        title: t("turboLabel"),
-        style: {
-          display: "inline-flex",
-          alignItems: "center",
-          gap: 3,
-          fontSize: 10,
-          padding: "1px 6px",
-          borderRadius: 999,
-          border: `1px solid ${turbo ? `color-mix(in srgb, ${GOLD_TINT} 60%, ${C.border1})` : C.border1}`,
-          background: turbo ? `color-mix(in srgb, ${GOLD_TINT} 16%, transparent)` : "transparent",
-          color: turbo ? C.label2 : C.label3,
-          cursor: "pointer",
-          ...NUM
-        }
-      }, [
-        import_react.default.createElement("input", {
-          key: "i",
-          type: "checkbox",
-          checked: turbo,
-          onChange: (event) => onTurboChange && onTurboChange(event.target.checked),
-          style: { accentColor: GOLD_TINT, width: 12, height: 12, margin: 0, cursor: "inherit" }
-        }),
-        import_react.default.createElement("span", { key: "l" }, t("turboLabel"))
-      ])
+      }, "\u5143")
     ]),
     import_react.default.createElement("div", {
       key: "chips",
@@ -1715,6 +1663,7 @@ function SettingsSection(props) {
 function NiumaPanel(props) {
   const t = props && typeof props.t === "function" ? props.t : fallbackTranslate;
   const remote = useRemoteConfig();
+  const update = useUpdateInfo();
   const cfg = import_react.default.useMemo(() => {
     const raw = remote.data && remote.data.config ? remote.data.config : null;
     if (!raw) return DEFAULTS;
@@ -1839,6 +1788,7 @@ function NiumaPanel(props) {
   const onDecimalsChange = (value) => postConfig({ decimals: value });
   const onTurboChange = (checked) => postConfig({ turbo: Boolean(checked) });
   const holidaySource = remote.data && remote.data.holidaySource || HOLIDAY_SOURCE;
+  const versionText = remote.data && remote.data.version || update.data && update.data.currentVersion || "";
   const banner = remote.status === "failed" ? {
     color: C.warn,
     text: `${t("configFailed")}${remote.error ? `\uFF08${remote.error}\uFF09` : ""}`,
@@ -1940,6 +1890,67 @@ function NiumaPanel(props) {
           }
         }, t("retry")) : null
       ]) : null,
+      // 版本 / 自动更新提示：已下载→提示重启；发现新版→一键更新
+      update.data && update.data.staged ? import_react.default.createElement("div", {
+        key: "update",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          flexWrap: "wrap",
+          fontSize: 11.5,
+          color: C.label2,
+          padding: "6px 10px",
+          borderRadius: 9,
+          border: `1px solid color-mix(in srgb, ${GOLD_TINT} 45%, transparent)`,
+          background: `color-mix(in srgb, ${GOLD_TINT} 10%, transparent)`
+        }
+      }, [
+        import_react.default.createElement("span", { key: "dot", "aria-hidden": "true", style: { width: 6, height: 6, borderRadius: "50%", background: GOLD_TINT } }),
+        import_react.default.createElement(
+          "span",
+          { key: "txt", style: { flex: "1 1 160px" } },
+          t("updateStaged").replace("{version}", String(update.data.stagedVersion || update.data.latestVersion || ""))
+        )
+      ]) : update.status === "updating" ? import_react.default.createElement("div", {
+        key: "update",
+        style: { fontSize: 11.5, color: C.label3, padding: "2px 2px" }
+      }, t("updating")) : update.data && update.data.hasUpdate ? import_react.default.createElement("div", {
+        key: "update",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          flexWrap: "wrap",
+          fontSize: 11.5,
+          color: C.label2,
+          padding: "6px 10px",
+          borderRadius: 9,
+          border: `1px solid color-mix(in srgb, ${GOLD_TINT} 45%, transparent)`,
+          background: `color-mix(in srgb, ${GOLD_TINT} 10%, transparent)`
+        }
+      }, [
+        import_react.default.createElement(
+          "span",
+          { key: "txt", style: { flex: "1 1 160px" } },
+          t("updateAvailable").replace("{version}", String(update.data.latestVersion || ""))
+        ),
+        import_react.default.createElement("button", {
+          key: "go",
+          type: "button",
+          onClick: update.download,
+          style: {
+            border: `1px solid color-mix(in srgb, ${GOLD_TINT} 70%, rgba(0,0,0,.15))`,
+            color: "#3A2A05",
+            background: "linear-gradient(180deg, #F8DC86 0%, #EFC258 52%, #D99D2C 100%)",
+            borderRadius: 7,
+            padding: "3px 12px",
+            fontSize: 11.5,
+            fontWeight: 700,
+            cursor: "pointer"
+          }
+        }, t("updateNow"))
+      ]) : null,
       import_react.default.createElement(HeroCard, { key: "hero", t, snap, decimals: cfg.decimals, onDecimalsChange, turbo: cfg.turbo, onTurboChange }),
       import_react.default.createElement(CountdownRow, { key: "countdown", t, snap }),
       import_react.default.createElement("div", {
@@ -2004,7 +2015,28 @@ function NiumaPanel(props) {
         setCheck,
         save,
         onSave
-      })
+      }),
+      // 版本信息固定放在面板最底部
+      import_react.default.createElement("div", {
+        key: "version",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: 6,
+          padding: "4px 0 0",
+          fontSize: 10.5,
+          color: C.label3,
+          ...NUM
+        }
+      }, [
+        versionText ? import_react.default.createElement("span", { key: "v" }, `\u725B\u9A6C\u52A0\u901F\u5668 v${versionText}`) : null,
+        update.data && update.data.staged ? import_react.default.createElement(
+          "span",
+          { key: "s", style: { color: C.label3 } },
+          `\xB7 ${t("updateStaged").replace("{version}", String(update.data.stagedVersion || update.data.latestVersion || ""))}`
+        ) : null
+      ])
     ])
   ]);
 }