dsh-notify-me 1.9.1 → 1.9.3

package/CHANGELOG.md

@@ -2,6 +2,29 @@
 
 All notable changes to **dsh-notify-me** are documented here.
 
+## [1.9.3] — 2026-10-20
+
+### 变更
+
+- **悬浮提示只在行标题上触发**：之前整行（右侧开关、滑块、下拉都算）都是触发区，鼠标扫过控件也会弹方框；现在指针停在标题文字上才出现，开关和滑块保持干净。
+- 渐显 320 ms、跟随指针、靠边翻转、滚动收起这些行为不变；读屏隐藏副本不受影响。
+
+### 测试
+
+- 冒烟测试新增四条结构断言：带说明的行必须把提示挂在 `.dnm-rowLabel` 上，该节点持有 `data-dnm-tip` 与三个 hover 处理函数，任何整行节点都不再是提示目标。`npm test` 两套件通过。
+
+## [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-%7E166%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 that appears when the pointer rests on a title, 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 once it rests on the title text (hovering a switch does nothing), 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-%7E166%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.3";
     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-rowLabel.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,131 @@
       } 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
+      };
+    }
+    // Attach the tooltip to the label text only. Hovering the switch or the
+    // slider on the right of a row should not pop an explanation.
+    function tipTarget(node, hintText) {
+      if (!node || typeof node !== "object") return node;
+      var props = node.props || {};
+      var className = String(props.className || "");
+      // React keeps children in props.children; the smoke harness keeps them on
+      // the node itself, so look in both places.
+      var kids = props.children;
+      if (kids === undefined && node.children) kids = node.children.length === 1 ? node.children[0] : node.children;
+      if (className.indexOf("dnm-rowLabel") >= 0) {
+        var handlers = tipHandlers(hintText);
+        var merged = {};
+        for (var k in props) merged[k] = props[k];
+        merged.className = className + " dnm-rowTip";
+        merged["data-dnm-tip"] = hintText;
+        merged.onMouseEnter = handlers.onMouseEnter;
+        merged.onMouseMove = handlers.onMouseMove;
+        merged.onMouseLeave = handlers.onMouseLeave;
+        return h(node.type, merged, kids);
+      }
+      if (Array.isArray(kids)) {
+        var changed = false;
+        var next = [];
+        for (var i = 0; i < kids.length; i++) {
+          var mapped = tipTarget(kids[i], hintText);
+          if (mapped !== kids[i]) changed = true;
+          next.push(mapped);
+        }
+        return changed ? h(node.type, props, next) : node;
+      }
+      var single = tipTarget(kids, hintText);
+      return single === kids ? node : h(node.type, props, single);
+    }
+    // A row that has an explanation: single-line label, text in the tooltip.
+    function tipRow(className, hintText, children) {
+      if (!hintText) return h("div", { className: className }, children);
+      var kids = Array.isArray(children)
+        ? children.map(function (child) { return tipTarget(child, hintText); })
+        : tipTarget(children, hintText);
+      return h("div", { className: className }, kids);
+    }
+    // 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 +2668,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 +2696,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 +2854,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 +2884,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 +2913,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 +3009,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 +3031,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 +3049,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 +3065,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 +3081,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.3",
   "description": "离开 DSH 页面也能收到提醒：需要你操作 / 后台回复完成时发系统通知、标题标记与可选页面浮层（副屏也能看见），支持审批快捷裁决与外部推送。Brand icon and a reworked settings page in 1.9.0.",
   "license": "MIT",
   "type": "module",