dsh-notify-me 1.9.1 → 1.9.2

package/CHANGELOG.md

@@ -2,6 +2,18 @@
 
 All notable changes to **dsh-notify-me** are documented here.
 
+## [1.9.2] — 2026-10-20
+
+### 变更
+
+- **设置页的说明文字改成悬浮提示**：每行只留标题，鼠标移上去约 0.3 秒后在指针旁边弹出小方框显示原来的说明；靠近视口右侧/底部自动翻到另一边，滚动即收起。页面因此短了很多，一屏能扫完所有开关。
+- 读屏仍能读到完整说明（每行保留视觉隐藏的 `.dnm-srOnly` 文本）；音量百分比、权限提示、外部推送说明这类状态信息仍常显。
+- README（中英）与设置页预览截图同步更新；徽章 bundle 尺寸更新为 ~164 KiB。
+
+### 测试
+
+- `npm test` 两套件通过；另在无头 Chromium 里用真 bundle + 假设置外壳验证悬浮出现/跟随/右缘翻转的坐标（`box=544,827 270x50 vw=900` 未越界）与中英两版截图。
+
 ## [1.9.1] — 2026-10-20
 
 ### 新增

package/README.en.md

@@ -13,7 +13,7 @@
 [![npm total downloads](https://img.shields.io/npm/dt/dsh-notify-me?style=flat-square&label=total%20downloads&color=1F883D)](https://www.npmjs.com/package/dsh-notify-me)
 [![License: MIT](https://img.shields.io/badge/license-MIT-blue?style=flat-square)](LICENSE)
 [![DSH Web and Desktop](https://img.shields.io/badge/DSH-Web%20%7C%20Desktop-blue?style=flat-square)](#installation)
-[![Client bundle size](https://img.shields.io/badge/client-%7E161%20KiB-green?style=flat-square)](lib/client.js)
+[![Client bundle size](https://img.shields.io/badge/client-%7E164%20KiB-green?style=flat-square)](lib/client.js)
 [![DSH Compatibility](https://img.shields.io/badge/DSH-tested%200.2.1--rc.2-6366f1.svg?style=flat-square)](#compatibility)
 [![Awesome DSH Plugin](https://awesome-dsh-plugin.com/badge.svg)](https://awesome-dsh-plugin.com)
 
@@ -47,7 +47,7 @@ A notification plugin for DSH Web / Desktop, so you can keep full access off wit
 
 ![The Notify me settings page: header, how you get told, when to alert, try it, and the collapsed Advanced block](https://raw.githubusercontent.com/chromoany/dsh-notify-me/main/docs/screenshots/settings-en.png)
 
-The real settings component (v1.9.0 defaults) rendered full-page in a standalone demo shell; the sidebar is kept for context, it is not the DSH shell.
+The real settings component (v1.9.2 defaults) rendered as the content column in a standalone demo shell. Row explanations now live in a hover tooltip, which is why only the titles show here.
 </details>
 
 ## Installation
@@ -116,7 +116,7 @@ dsh-notify-me decouples **supervision** from **sitting in front of the screen**:
 
 ## Configure it from DSH Settings
 
-Open **Settings → Notify me**. The page runs as how you get told, when to alert, and a try-it block; the knobs you rarely touch fold into **Advanced** at the bottom.
+Open **Settings → Notify me**. The page runs as how you get told, when to alert, and a try-it block; the knobs you rarely touch fold into **Advanced** at the bottom. Rows show titles only — the explanation pops up next to the pointer on hover, with a hidden copy kept for screen readers.
 
 ### How you get told
 

package/README.md

@@ -13,7 +13,7 @@
 [![npm total downloads](https://img.shields.io/npm/dt/dsh-notify-me?style=flat-square&label=total%20downloads&color=1F883D)](https://www.npmjs.com/package/dsh-notify-me)
 [![License: MIT](https://img.shields.io/badge/license-MIT-blue?style=flat-square)](LICENSE)
 [![DSH Web and Desktop](https://img.shields.io/badge/DSH-Web%20%7C%20Desktop-blue?style=flat-square)](#安装)
-[![Client bundle size](https://img.shields.io/badge/client-%7E161%20KiB-green?style=flat-square)](lib/client.js)
+[![Client bundle size](https://img.shields.io/badge/client-%7E164%20KiB-green?style=flat-square)](lib/client.js)
 [![DSH Compatibility](https://img.shields.io/badge/DSH-%E5%B7%B2%E9%80%82%E9%85%8D%200.2.1--rc.2-6366f1.svg?style=flat-square)](#兼容性)
 [![Awesome DSH Plugin](https://awesome-dsh-plugin.com/badge.svg)](https://awesome-dsh-plugin.com)
 
@@ -47,7 +47,7 @@ DSH Web / Desktop 的通知插件，让你敢不开完整访问，也不必一
 
 ![通知提醒设置页：页眉、提醒方式、什么时候提醒、试一试与折叠的高级设置](https://raw.githubusercontent.com/chromoany/dsh-notify-me/main/docs/screenshots/settings-zh.png)
 
-真实插件设置组件（v1.9.0 默认配置）在独立演示环境里整页渲染；只保留左侧导航作参照，不是 DSH 宿主外壳。
+真实插件设置组件（v1.9.2 默认配置）在独立演示环境里按内容列整页渲染；每行的说明改成鼠标悬浮才出现的小方框，所以这里只看到标题。
 </details>
 
 ## 安装
@@ -112,7 +112,7 @@ dsh-notify-me 把「监督」和「守在屏幕前」解耦：只在真的出现
 
 ## 在 DSH 设置里改配置
 
-打开 **设置 → 通知提醒**。页面按「提醒方式 → 什么时候提醒 → 试一试」三段排开，不常改的收进底部「高级设置」，点一下展开。
+打开 **设置 → 通知提醒**。页面按「提醒方式 → 什么时候提醒 → 试一试」三段排开，不常改的收进底部「高级设置」，点一下展开。每行只写标题，具体说明在鼠标移上去时弹出的小方框里（触屏或键盘操作时留一份隐藏文本给读屏）。
 
 ### 提醒方式
 

package/lib/client.js

@@ -1937,7 +1937,7 @@
       });
     } catch (e) {}
     // keep in sync with package.json "version" on every release
-    api.version = "1.9.1";
+    api.version = "1.9.2";
     api.setConfig = function (patch) { return setConfigLocal(patch); };
     api.resetConfig = function () {
       try {
@@ -2450,6 +2450,13 @@
       ".dnm-advToggle:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#3b82f6);outline-offset:2px}" +
       ".dnm-advRight{display:flex;align-items:center;gap:8px;flex:none;font-weight:400;color:var(--dsw-alias-label-tertiary,rgba(120,120,120,.9))}" +
       ".dnm-advChev{font-size:10px;translate:0 1px;transition:transform .15s ease}" +
+      ".dnm-rowTip{cursor:help}" +
+      ".dnm-rowValue{font-size:12px;line-height:18px;color:var(--dsw-alias-label-tertiary,rgba(120,120,120,.9))}" +
+      // The long explanation lives in a tooltip next to the pointer, so a
+      // row is one line tall. Screen readers still get the text.
+      ".dnm-srOnly{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}" +
+      ".dnm-tip{position:fixed;left:-9999px;top:-9999px;z-index:2147483001;max-width:270px;box-sizing:border-box;padding:7px 10px;border-radius:8px;border:1px solid var(--dsw-alias-border-l2,rgba(128,128,128,.35));background:var(--dsw-alias-bg-layer-3,#26282c);color:var(--dsw-alias-label-secondary,rgba(90,90,90,.9));font-size:12px;line-height:17px;box-shadow:0 6px 18px rgba(0,0,0,.35);pointer-events:none;opacity:0;transition:opacity .12s ease}" +
+      ".dnm-tip.on{opacity:1}" +
       ".dnm-advChev.open{transform:rotate(180deg)}";
     (function injectStyle() {
       try {
@@ -2464,11 +2471,101 @@
       } catch (e) {}
     })();
 
+    // Hover hints: a row keeps one line of text; its explanation shows up in a
+    // small box beside the pointer after a short delay. One shared node, so
+    // nothing has to be cleaned up per row.
+    var TIP_ID = "dsh-notify-me-tip";
+    var tipEl = null;
+    var tipTimer = null;
+    var tipShown = false;
+    var tipX = 0;
+    var tipY = 0;
+    function tipNode() {
+      try {
+        if (tipEl && tipEl.parentNode) return tipEl;
+        if (typeof document === "undefined" || !document.body) return null;
+        var node = document.createElement("div");
+        node.id = TIP_ID;
+        node.className = "dnm-tip";
+        node.setAttribute("role", "tooltip");
+        document.body.appendChild(node);
+        tipEl = node;
+        return node;
+      } catch (e) { return null; }
+    }
+    function hideTip() {
+      if (tipTimer) { clearTimeout(tipTimer); tipTimer = null; }
+      if (!tipShown) return;
+      tipShown = false;
+      if (tipEl) tipEl.className = "dnm-tip";
+    }
+    // Keep the box on screen: flip left of the pointer near the right edge,
+    // flip above it near the bottom.
+    function placeTip() {
+      var node = tipEl;
+      if (!node || !tipShown) return;
+      var pad = 12;
+      var rect = node.getBoundingClientRect();
+      var vw = window.innerWidth || 0;
+      var vh = window.innerHeight || 0;
+      var x = tipX + 14;
+      if (x + rect.width + pad > vw) x = tipX - rect.width - 14;
+      if (x < pad) x = pad;
+      var y = tipY + 18;
+      if (y + rect.height + pad > vh) y = tipY - rect.height - 12;
+      if (y < pad) y = pad;
+      node.style.left = Math.round(x) + "px";
+      node.style.top = Math.round(y) + "px";
+    }
+    function showTip(text) {
+      var node = tipNode();
+      if (!node) return;
+      node.textContent = text;
+      tipShown = true;
+      node.className = "dnm-tip on";
+      placeTip();
+    }
+    function tipHandlers(text) {
+      return {
+        onMouseEnter: function (e) {
+          tipX = e.clientX;
+          tipY = e.clientY;
+          if (tipTimer) clearTimeout(tipTimer);
+          tipTimer = setTimeout(function () { tipTimer = null; showTip(text); }, 320);
+        },
+        onMouseMove: function (e) {
+          tipX = e.clientX;
+          tipY = e.clientY;
+          if (tipShown) placeTip();
+        },
+        onMouseLeave: hideTip
+      };
+    }
+    // A row that has an explanation: single-line label, text in the tooltip.
+    function tipRow(className, hintText, children) {
+      var props = { className: className + (hintText ? " dnm-rowTip" : "") };
+      if (hintText) {
+        props["data-dnm-tip"] = hintText;
+        var handlers = tipHandlers(hintText);
+        props.onMouseEnter = handlers.onMouseEnter;
+        props.onMouseMove = handlers.onMouseMove;
+        props.onMouseLeave = handlers.onMouseLeave;
+      }
+      return h("div", props, children);
+    }
+    // Read-screen-only copy of the tooltip text.
+    function srOnly(text) {
+      return text ? h("span", { className: "dnm-srOnly" }, text) : null;
+    }
+    (function tipDismissOnScroll() {
+      try { window.addEventListener("scroll", hideTip, true); } catch (e) {}
+    })();
+
     function rowSwitch(key, labelText, hintText, checked, onChange) {
-      return h("div", { className: "dnm-row" }, [
+      return tipRow("dnm-row", hintText, [
         h("div", { className: "dnm-rowText" }, [
           h("div", { className: "dnm-rowLabel" }, labelText),
-          hintText ? h("div", { className: "dnm-rowHint" }, hintText) : null
+          srOnly(hintText)
         ]),
         h("button", {
           type: "button",
@@ -2541,7 +2638,7 @@
           h("div", { className: "dnm-row" }, [
             h("div", { className: "dnm-rowText" }, [
               h("div", { className: "dnm-rowLabel" }, labelText),
-              h("div", { className: "dnm-rowHint" }, note)
+              h("div", { className: "dnm-rowValue" }, note)
             ]),
             h("div", { className: "dnm-btnRow" }, [
               h("select", {
@@ -2569,11 +2666,12 @@
           ])
         ];
         if (mode !== "custom") return rows;
-        rows.push(h("div", { className: "dnm-row" }, [
+        var pickNote = (rec ? Math.round((rec.size || 0) / 1024) + " KB · " : t("soundNone") + " · ")
+          + "≤" + Math.round(SOUND_MAX_BYTES / 1024) + " KB";
+        rows.push(tipRow("dnm-row", pickNote, [
           h("div", { className: "dnm-rowText" }, [
             h("div", { className: "dnm-rowLabel" }, t("soundPick")),
-            h("div", { className: "dnm-rowHint" }, (rec ? Math.round((rec.size || 0) / 1024) + " KB · " : t("soundNone") + " · ")
-              + "≤" + Math.round(SOUND_MAX_BYTES / 1024) + " KB")
+            srOnly(pickNote)
           ]),
           h("div", { className: "dnm-btnRow" }, [
             h("input", {
@@ -2726,6 +2824,7 @@
       var permOK = ("Notification" in window) ? Notification.permission === "granted" : false;
       var resolvedLang = effectiveLang();
       var resolvedLangName = resolvedLang === "en" ? t("langEn") : t("langZh");
+      var langNote = resolvedLangName + (cfg.language === "auto" ? t("langAutoNote") : "");
       // The environment row states what detection saw whenever the manual
       // choice disagrees with it — the override exists for hosts where the
       // protocol read comes out wrong, so the divergence must be visible.
@@ -2755,10 +2854,10 @@
       var advState = React.useState(false);
       var advancedOpen = advState[0];
       var setAdvancedOpen = advState[1];
-      var testRow = h("div", { className: "dnm-row dnm-rowStack" }, [
+      var testRow = tipRow("dnm-row dnm-rowStack", t("testHint"), [
         h("div", { className: "dnm-rowText" }, [
           h("div", { className: "dnm-rowLabel" }, t("testTitle")),
-          h("div", { className: "dnm-rowHint" }, t("testHint"))
+          srOnly(t("testHint"))
         ]),
         h("div", { className: "dnm-btnRow" }, [
           h("button", { type: "button", className: "dnm-btn", disabled: !cfg.enabled, onClick: function () { runTest("attention"); } }, t("testAttention")),
@@ -2784,10 +2883,10 @@
           }),
           rowSwitch("toast", t("toast"), toastHintText(), cfg.toast, function (v) { patch({ toast: v }); }),
           rowSwitch("overlay", t("overlay"), t("overlayHint"), cfg.overlay, function (v) { patch({ overlay: v }); }),
-          cfg.overlay ? h("div", { className: "dnm-row dnm-rowSub" }, [
+          cfg.overlay ? tipRow("dnm-row dnm-rowSub", t("overlayCornerHint"), [
             h("div", { className: "dnm-rowText" }, [
               h("div", { className: "dnm-rowLabel" }, t("overlayCorner")),
-              h("div", { className: "dnm-rowHint" }, t("overlayCornerHint"))
+              srOnly(t("overlayCornerHint"))
             ]),
             h("select", {
               className: "dnm-select",
@@ -2880,10 +2979,10 @@
             [rowSwitch("externalEnabled", t("externalEnable"), t("externalEnableHint"), cfg.externalEnabled, function (v) { patch({ externalEnabled: v }); })],
             [rowSwitch("externalAttention", t("externalAttentionLabel"), t("externalAttentionHint"), cfg.externalAttention, function (v) { patch({ externalAttention: v }); })],
             [rowSwitch("externalDone", t("externalDoneLabel"), t("externalDoneHint"), cfg.externalDone, function (v) { patch({ externalDone: v }); })],
-            [h("div", { className: "dnm-row" }, [
+            [tipRow("dnm-row", t("externalTargetsHint"), [
               h("div", { className: "dnm-rowText" }, [
                 h("div", { className: "dnm-rowLabel" }, t("externalTargetsLabel")),
-                h("div", { className: "dnm-rowHint" }, t("externalTargetsHint"))
+                srOnly(t("externalTargetsHint"))
               ])
             ])],
             externalRows(),
@@ -2902,10 +3001,10 @@
                 }, t("externalAdd"))
               ])
             ])],
-            [h("div", { className: "dnm-row" }, [
+            [tipRow("dnm-row", t("externalTestHint"), [
               h("div", { className: "dnm-rowText" }, [
                 h("div", { className: "dnm-rowLabel" }, t("externalTestLabel")),
-                h("div", { className: "dnm-rowHint" }, t("externalTestHint"))
+                srOnly(t("externalTestHint"))
               ]),
               h("div", { className: "dnm-btnRow" }, [
                 h("button", {
@@ -2920,10 +3019,10 @@
           )),
           secTitle(t("secDiag")),
           card([
-            h("div", { className: "dnm-row" }, [
+            tipRow("dnm-row", envHint, [
               h("div", { className: "dnm-rowText" }, [
                 h("div", { className: "dnm-rowLabel" }, t("hostEnv")),
-                h("div", { className: "dnm-rowHint" }, envHint)
+                srOnly(envHint)
               ]),
               h("select", {
                 className: "dnm-select",
@@ -2936,10 +3035,10 @@
                 h("option", { value: "web" }, t("hostEnvWeb"))
               ])
             ]),
-            h("div", { className: "dnm-row" }, [
+            tipRow("dnm-row", langNote, [
               h("div", { className: "dnm-rowText" }, [
                 h("div", { className: "dnm-rowLabel" }, t("language")),
-                h("div", { className: "dnm-rowHint" }, resolvedLangName + (cfg.language === "auto" ? t("langAutoNote") : ""))
+                srOnly(langNote)
               ]),
               h("select", {
                 className: "dnm-select",
@@ -2952,10 +3051,10 @@
                 h("option", { value: "en" }, t("langEn"))
               ])
             ]),
-            h("div", { className: "dnm-row" }, [
+            tipRow("dnm-row", t("resetHint"), [
               h("div", { className: "dnm-rowText" }, [
                 h("div", { className: "dnm-rowLabel" }, t("reset")),
-                h("div", { className: "dnm-rowHint" }, t("resetHint"))
+                srOnly(t("resetHint"))
               ]),
               h("button", { type: "button", className: "dnm-btn", onClick: function () {
                 // api.resetConfig() also drops the picked cue files, which are

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-notify-me",
-  "version": "1.9.1",
+  "version": "1.9.2",
   "description": "离开 DSH 页面也能收到提醒：需要你操作 / 后台回复完成时发系统通知、标题标记与可选页面浮层（副屏也能看见），支持审批快捷裁决与外部推送。Brand icon and a reworked settings page in 1.9.0.",
   "license": "MIT",
   "type": "module",