dsh-wisp 1.31.0 → 1.32.0

package/README.md

@@ -448,6 +448,34 @@ node tools/audit-log.mjs --confirm <manifest>     # 生成后：并入代理登
 
 ## 变更
 
+### 1.32.0
+
+**分组改成悬停展开、移开收起**（点一下仍然是"钉住"）。
+
+这一条本来就是标准交互，上一版只做了"点开／点关"，属于设计盲区。补上之后，
+真正要小心的地方不在于"加个 mouseenter"，而在于下面这几条 —— 少一条都比不做更糟：
+
+| 细节 | 为什么必须 |
+|---|---|
+| **展开有延迟**（140 ms） | 鼠标只是**路过**那一行就展开 = 抖动。这就是 hover intent。 |
+| **移开有宽限**（260 ms） | 斜着往子项移动时，中途不能收。 |
+| **子项与标题在同一个悬停区**（`div.wisp-menu-group`） | 从标题移到子项**不该算移开**。这是这类交互最常见的翻车点。 |
+| **点击 = 钉住** | 悬停是预览、点击是决定。点开的那一组鼠标移开也不关，再点一次才收起。 |
+| **触屏不触发悬停** | 判 `pointerType`。不判的话手指一碰就会莫名其妙展开。 |
+| **焦点在那一组里时不关** | 否则键盘用户正操作着，鼠标一动组就没了。 |
+| **手风琴** | 悬停到另一组会解除上一组的钉住 —— 同时开两组看不清。 |
+
+**顺手抓到一个真 bug**：焦点保护第一版写的是"焦点还在菜单里就不许关" ——
+而菜单**一打开就会把焦点放到第一项**，所以那条件**永远为真**，
+悬停收起等于**永远不会触发**。改成只看"焦点在不在**这一组**里"。
+第一版还用了一个"组名 → 元素"的映射，实测和重画后的 DOM 对不上（组照样关）；
+现在改成从焦点**向上走**、遇到带 `data-group-block` 的祖先就算命中 —— 不依赖任何外部映射。
+
+预检 502 → **524 项**：延迟、宽限、路过不展开、子项在同一悬停区、
+触屏不悬停但点击可用、点击钉住、再点收起、手风琴、焦点保护、焦点离开后规则恢复。
+
+### 1.31.0
+
 ### 1.31.0
 
 **菜单重做。** 上一版只是"把 19 个条目收进三个分组" —— 那是分类，不是交互设计。

package/lib/client.js

@@ -51,7 +51,7 @@ window.__ModuleLoader__.load({
     var exports = module.exports
     Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' })
 
-    const VERSION = '1.31.0'
+    const VERSION = '1.32.0'
 
 /* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它，
    忘了更新就会红，不会静默过期。 */
@@ -72,6 +72,7 @@ const WHATS_NEW = {
   '1.29.0': '夜深了她会劝你去睡；你走开再回来她记得；连续来了几天她也记着。',
   '1.30.0': '会陪你专注计时了；页面藏起来时她会安静下来，不再空转。',
   '1.31.0': '菜单重做：状态一目了然，开关是开关，大小能直接拖。',
+  '1.32.0': '分组改成鼠标悬停就展开、移开就收起（点一下则是钉住）。',
 }
 
 /* 更新这件事**这个插件自己做不到**，如实写在代码里，免得以后有人以为能：
@@ -2013,12 +2014,67 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
       /* 折叠分组要"在原地重开"，所以记住这次的落点 */
       let menuAtX = 0
       let menuAtY = 0
+      /* 悬停展开的延迟：鼠标路过一行就展开会抖（hover intent），
+         关闭的宽限更长一点 —— 斜着往子项移动时才不会中途收起。 */
+      const HOVER_OPEN_MS = 140
+      const HOVER_CLOSE_MS = 260
+      /* 点开的组会被"钉住"：鼠标移开也不关。悬停是预览，点击是决定。 */
+      let pinnedGroup = ''
+      let groupOpenTimer = null
+      let groupCloseTimer = null
+      /* 判断"焦点是否在这一组里"不能笼统地看"焦点是否在菜单里" —— 菜单一打开焦点就在
+         第一项上，那样写等于悬停收起永远不会触发。 */
+
+      const clearGroupTimers = () => {
+        if (groupOpenTimer) { clock.cancel(groupOpenTimer); groupOpenTimer = null }
+        if (groupCloseTimer) { clock.cancel(groupCloseTimer); groupCloseTimer = null }
+      }
+      /* 焦点是否在这**一组**里 —— 键盘用户正操作这一组时，鼠标移开不该把它收掉。
+         焦点在别的行、或压根不在菜单里，都不该阻止收起。
+         判法：从焦点向上走，遇到带 data-group-block 的祖先就算命中（不靠外部映射）。 */
+      const focusInsideGroup = (name) => {
+        let el = null
+        try { el = document.activeElement } catch (e) { el = null }
+        let hops = 0
+        while (el && hops < 24) {
+          if (el.dataset && el.dataset.groupBlock === name) return true
+          el = el.parentNode || null
+          hops++
+        }
+        return false
+      }
+      /* 悬停到一组：延迟后展开它，并解除别组的钉住（手风琴 —— 同时开两组会看不清）。 */
+      const scheduleGroupOpen = (name) => {
+        clearGroupTimers()
+        if (activeGroup === name) return
+        groupOpenTimer = clock.after(HOVER_OPEN_MS, () => {
+          groupOpenTimer = null
+          if (destroyed || menuEl === null) return
+          pinnedGroup = ''
+          activeGroup = name
+          openMenu(menuAtX, menuAtY, true)
+        })
+      }
+      const scheduleGroupClose = (name) => {
+        clearGroupTimers()
+        if (activeGroup !== name) return
+        if (pinnedGroup === name) return          // 点开的不随鼠标移开关闭
+        groupCloseTimer = clock.after(HOVER_CLOSE_MS, () => {
+          groupCloseTimer = null
+          if (destroyed || menuEl === null) return
+          if (pinnedGroup === name) return
+          if (focusInsideGroup(name)) return      // 键盘用户还在这一组里，别关
+          activeGroup = ''
+          openMenu(menuAtX, menuAtY, true)
+        })
+      }
 
       const closeMenu = () => {
         if (menuEl && menuEl.parentNode) menuEl.parentNode.removeChild(menuEl)
         menuEl = null
         menuButtons = []
         menuFocusAt = -1
+        clearGroupTimers()
         if (menuOff) { menuOff(); menuOff = null }
       }
 
@@ -2327,7 +2383,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
       const openMenu = (x, y, keepGroup) => {
         menuAtX = x
         menuAtY = y
-        if (keepGroup !== true) activeGroup = ''
+        if (keepGroup !== true) { activeGroup = ''; pinnedGroup = '' }
         closeMenu()
         stopGlide()
         const items = menuItems()
@@ -2541,8 +2597,13 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             continue
           }
           if (spec.group !== undefined) {
-            /* 折叠分组：标题行带上当前状态摘要，点一下在原地展开/收起。 */
+            /* 折叠分组：标题行 + （展开时的）子项，**包在同一个悬停区里**。
+               这是悬停展开能做对的前提 —— 从标题移到子项不该算"移开"，
+               否则鼠标一动子菜单就没了（那是这类交互最常见的翻车点）。 */
             const open = activeGroup === spec.group
+            const block = document.createElement('div')
+            block.className = 'wisp-menu-group'
+            block.dataset.groupBlock = spec.group
             const btn = document.createElement('button')
             btn.className = 'wisp-menu-item wisp-menu-row'
             btn.setAttribute('type', 'button')
@@ -2564,16 +2625,37 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
             btn.addEventListener('click', (ev) => {
               ev.preventDefault(); ev.stopPropagation()
-              activeGroup = open ? '' : spec.group
+              if (activeGroup === spec.group && pinnedGroup === spec.group) {
+                /* 已经点开过：再点一次收起 */
+                pinnedGroup = ''
+                activeGroup = ''
+              } else {
+                /* 点开 = 钉住：之后鼠标移开也不关（键盘、触屏、以及"我就想它开着"都靠这条） */
+                pinnedGroup = spec.group
+                activeGroup = spec.group
+              }
               openMenu(menuAtX, menuAtY, true)
             })
-            menu.appendChild(btn)
+            /* 悬停展开 / 移开收起。pointerType 不为 mouse 的一律不管 ——
+               触屏没有悬停，不判这个的话手指一碰就会莫名其妙展开。 */
+            const isMouse = (ev) => !(ev && ev.pointerType && ev.pointerType !== 'mouse')
+            block.addEventListener('pointerenter', (ev) => {
+              if (!isMouse(ev)) return
+              scheduleGroupOpen(spec.group)
+            })
+            block.addEventListener('pointerleave', (ev) => {
+              if (!isMouse(ev)) return
+              scheduleGroupClose(spec.group)
+            })
+            block.appendChild(btn)
+            menu.appendChild(block)
             menuButtons.push(btn)
             if (!open) continue
             const wrap = document.createElement('div')
             wrap.className = 'wisp-menu-sub'
             renderChildren(spec.children, wrap)
-            menu.appendChild(wrap)
+            /* 子项进 block（悬停区），不是直接进 menu */
+            block.appendChild(wrap)
             continue
           }
           actionRow(spec, menu)

package/lib/client.template.js

@@ -51,7 +51,7 @@ window.__ModuleLoader__.load({
     var exports = module.exports
     Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' })
 
-    const VERSION = '1.31.0'
+    const VERSION = '1.32.0'
 
 /* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它，
    忘了更新就会红，不会静默过期。 */
@@ -72,6 +72,7 @@ const WHATS_NEW = {
   '1.29.0': '夜深了她会劝你去睡；你走开再回来她记得；连续来了几天她也记着。',
   '1.30.0': '会陪你专注计时了；页面藏起来时她会安静下来，不再空转。',
   '1.31.0': '菜单重做：状态一目了然，开关是开关，大小能直接拖。',
+  '1.32.0': '分组改成鼠标悬停就展开、移开就收起（点一下则是钉住）。',
 }
 
 /* 更新这件事**这个插件自己做不到**，如实写在代码里，免得以后有人以为能：
@@ -1962,12 +1963,67 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
       /* 折叠分组要"在原地重开"，所以记住这次的落点 */
       let menuAtX = 0
       let menuAtY = 0
+      /* 悬停展开的延迟：鼠标路过一行就展开会抖（hover intent），
+         关闭的宽限更长一点 —— 斜着往子项移动时才不会中途收起。 */
+      const HOVER_OPEN_MS = 140
+      const HOVER_CLOSE_MS = 260
+      /* 点开的组会被"钉住"：鼠标移开也不关。悬停是预览，点击是决定。 */
+      let pinnedGroup = ''
+      let groupOpenTimer = null
+      let groupCloseTimer = null
+      /* 判断"焦点是否在这一组里"不能笼统地看"焦点是否在菜单里" —— 菜单一打开焦点就在
+         第一项上，那样写等于悬停收起永远不会触发。 */
+
+      const clearGroupTimers = () => {
+        if (groupOpenTimer) { clock.cancel(groupOpenTimer); groupOpenTimer = null }
+        if (groupCloseTimer) { clock.cancel(groupCloseTimer); groupCloseTimer = null }
+      }
+      /* 焦点是否在这**一组**里 —— 键盘用户正操作这一组时，鼠标移开不该把它收掉。
+         焦点在别的行、或压根不在菜单里，都不该阻止收起。
+         判法：从焦点向上走，遇到带 data-group-block 的祖先就算命中（不靠外部映射）。 */
+      const focusInsideGroup = (name) => {
+        let el = null
+        try { el = document.activeElement } catch (e) { el = null }
+        let hops = 0
+        while (el && hops < 24) {
+          if (el.dataset && el.dataset.groupBlock === name) return true
+          el = el.parentNode || null
+          hops++
+        }
+        return false
+      }
+      /* 悬停到一组：延迟后展开它，并解除别组的钉住（手风琴 —— 同时开两组会看不清）。 */
+      const scheduleGroupOpen = (name) => {
+        clearGroupTimers()
+        if (activeGroup === name) return
+        groupOpenTimer = clock.after(HOVER_OPEN_MS, () => {
+          groupOpenTimer = null
+          if (destroyed || menuEl === null) return
+          pinnedGroup = ''
+          activeGroup = name
+          openMenu(menuAtX, menuAtY, true)
+        })
+      }
+      const scheduleGroupClose = (name) => {
+        clearGroupTimers()
+        if (activeGroup !== name) return
+        if (pinnedGroup === name) return          // 点开的不随鼠标移开关闭
+        groupCloseTimer = clock.after(HOVER_CLOSE_MS, () => {
+          groupCloseTimer = null
+          if (destroyed || menuEl === null) return
+          if (pinnedGroup === name) return
+          if (focusInsideGroup(name)) return      // 键盘用户还在这一组里，别关
+          activeGroup = ''
+          openMenu(menuAtX, menuAtY, true)
+        })
+      }
 
       const closeMenu = () => {
         if (menuEl && menuEl.parentNode) menuEl.parentNode.removeChild(menuEl)
         menuEl = null
         menuButtons = []
         menuFocusAt = -1
+        clearGroupTimers()
         if (menuOff) { menuOff(); menuOff = null }
       }
 
@@ -2276,7 +2332,7 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
       const openMenu = (x, y, keepGroup) => {
         menuAtX = x
         menuAtY = y
-        if (keepGroup !== true) activeGroup = ''
+        if (keepGroup !== true) { activeGroup = ''; pinnedGroup = '' }
         closeMenu()
         stopGlide()
         const items = menuItems()
@@ -2490,8 +2546,13 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             continue
           }
           if (spec.group !== undefined) {
-            /* 折叠分组：标题行带上当前状态摘要，点一下在原地展开/收起。 */
+            /* 折叠分组：标题行 + （展开时的）子项，**包在同一个悬停区里**。
+               这是悬停展开能做对的前提 —— 从标题移到子项不该算"移开"，
+               否则鼠标一动子菜单就没了（那是这类交互最常见的翻车点）。 */
             const open = activeGroup === spec.group
+            const block = document.createElement('div')
+            block.className = 'wisp-menu-group'
+            block.dataset.groupBlock = spec.group
             const btn = document.createElement('button')
             btn.className = 'wisp-menu-item wisp-menu-row'
             btn.setAttribute('type', 'button')
@@ -2513,16 +2574,37 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
             btn.addEventListener('click', (ev) => {
               ev.preventDefault(); ev.stopPropagation()
-              activeGroup = open ? '' : spec.group
+              if (activeGroup === spec.group && pinnedGroup === spec.group) {
+                /* 已经点开过：再点一次收起 */
+                pinnedGroup = ''
+                activeGroup = ''
+              } else {
+                /* 点开 = 钉住：之后鼠标移开也不关（键盘、触屏、以及"我就想它开着"都靠这条） */
+                pinnedGroup = spec.group
+                activeGroup = spec.group
+              }
               openMenu(menuAtX, menuAtY, true)
             })
-            menu.appendChild(btn)
+            /* 悬停展开 / 移开收起。pointerType 不为 mouse 的一律不管 ——
+               触屏没有悬停，不判这个的话手指一碰就会莫名其妙展开。 */
+            const isMouse = (ev) => !(ev && ev.pointerType && ev.pointerType !== 'mouse')
+            block.addEventListener('pointerenter', (ev) => {
+              if (!isMouse(ev)) return
+              scheduleGroupOpen(spec.group)
+            })
+            block.addEventListener('pointerleave', (ev) => {
+              if (!isMouse(ev)) return
+              scheduleGroupClose(spec.group)
+            })
+            block.appendChild(btn)
+            menu.appendChild(block)
             menuButtons.push(btn)
             if (!open) continue
             const wrap = document.createElement('div')
             wrap.className = 'wisp-menu-sub'
             renderChildren(spec.children, wrap)
-            menu.appendChild(wrap)
+            /* 子项进 block（悬停区），不是直接进 menu */
+            block.appendChild(wrap)
             continue
           }
           actionRow(spec, menu)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-wisp",
-  "version": "1.31.0",
+  "version": "1.32.0",
   "description": "DeepSeek娘 — an unofficial floating desktop companion for the DeepSeek Harness UI. Zero dependencies; sprites inlined as data URIs; schedules on the Client timer service instead of the trapped browser timer globals.",
   "type": "module",
   "main": "lib/index.js",

package/verify-wisp.mjs

@@ -2454,6 +2454,116 @@ if (clientSrc !== null) {
       'and the corner she is actually in is marked',
       menuOf().querySelectorAll('.wisp-corner').map((b) => b.textContent + (b.dataset.current ? '*' : '')).join(' '))
 
+    /* ---- 悬停展开 / 移开收起 ------------------------------------------------
+       这是"指针类"交互。替身里没有真鼠标，但它有**事件派发 + 虚拟时钟**，
+       所以这套逻辑能被完整测到：派 pointerenter、推进时钟、看菜单结构变没变。
+       测不到的是浏览器的命中测试本身（"指针真的在这一行上"）—— 那部分由冒烟里的
+       真 Chromium 兜着，这里测的是**状态机**：延迟、宽限、钉住、触屏、焦点保护。 */
+    const hoverBlock = (name) => menuHost().querySelectorAll('.wisp-menu-group')
+      .find((el) => el.dataset && el.dataset.groupBlock === name && el.removed !== true)
+    const hoverIn = (name, pointerType) => hoverBlock(name).dispatch('pointerenter', { pointerType })
+    const hoverOut = (name, pointerType) => hoverBlock(name).dispatch('pointerleave', { pointerType })
+    const isOpen = (name) => {
+      const row = groupRow(name)
+      return row !== undefined && row.dataset.open === 'true'
+    }
+
+    ensureCollapsed('外观'); ensureCollapsed('行为'); ensureCollapsed('位置')
+    check(!isOpen('外观') && !isOpen('行为'), 'every group starts collapsed')
+
+    /* 悬停要**有延迟**：鼠标只是路过就展开会抖 —— 这是 hover intent，不是可有可无的润色 */
+    hoverIn('外观', 'mouse')
+    check(!isOpen('外观'), 'hovering does not open it instantly (a passing mouse would twitch it)')
+    h.advance(200, 40)
+    check(isOpen('外观'), 'after the intent delay it opens')
+
+    /* 移开也要有宽限：斜着往子项移动时，中途不能收 */
+    hoverOut('外观', 'mouse')
+    h.advance(80, 40)
+    check(isOpen('外观'), 'leaving does not close it instantly either')
+    h.advance(400, 40)
+    check(!isOpen('外观'), 'after the grace period it closes')
+
+    /* 路过不展开：进去又马上出来，推进很久也不该开过 */
+    hoverIn('行为', 'mouse')
+    hoverOut('行为', 'mouse')
+    h.advance(800, 40)
+    check(!isOpen('行为'), 'a mouse that just passes over never opens a group')
+
+    /* 子项在**同一个悬停区**里 —— 这是"从标题移到子项不会关"的实现方式 */
+    hoverIn('外观', 'mouse')
+    h.advance(200, 40)
+    const blockEl = hoverBlock('外观')
+    const kids = blockEl.querySelector ? blockEl.querySelector('.wisp-menu-sub') : null
+    check(kids !== null && kids.parentNode === blockEl,
+      'the children sit inside the same hover area, so moving into them is not leaving',
+      kids === null ? '(没有子项容器)' : String(kids.parentNode === blockEl))
+
+    /* 触屏没有悬停：不判 pointerType 的话，手指一碰就会莫名其妙展开 */
+    hoverOut('外观', 'mouse')
+    h.advance(400, 40)
+    hoverIn('外观', 'touch')
+    h.advance(600, 40)
+    check(!isOpen('外观'), 'a touch pointer never opens a group by hovering')
+    groupRow('外观').dispatch('click', itemEvent())
+    check(isOpen('外观'), 'but tapping it still works')
+
+    /* 点击 = 钉住：鼠标移开也不关（悬停是预览，点击是决定） */
+    hoverOut('外观', 'mouse')
+    h.advance(800, 40)
+    check(isOpen('外观'), 'a group you clicked stays open when the mouse leaves')
+    groupRow('外观').dispatch('click', itemEvent())
+    check(!isOpen('外观'), 'clicking it again collapses it')
+
+    /* 手风琴：悬停到另一组时，被钉住的那一组会让位 */
+    groupRow('外观').dispatch('click', itemEvent())
+    check(isOpen('外观'), 'pin the appearance group again')
+    hoverIn('行为', 'mouse')
+    h.advance(200, 40)
+    check(isOpen('行为') && !isOpen('外观'),
+      'hovering another group opens it and lets the pinned one go',
+      `外观=${isOpen('外观')} 行为=${isOpen('行为')}`)
+    hoverOut('行为', 'mouse')
+    h.advance(600, 40)
+    check(!isOpen('行为'), 'and it closes again after the grace')
+
+    /* 焦点在这一组里时，鼠标移开不该把它收掉（否则键盘用户正操作着，鼠标一动就没了） */
+    hoverIn('外观', 'mouse')
+    h.advance(200, 40)
+    check(isOpen('外观'), 'hover it open again (not pinned this time)')
+    const focusGroupRow = () => {
+      pressKey('Home')
+      for (let i = 0; i < 16; i++) {
+        const el = h.document.activeElement
+        if (el && el.dataset && el.dataset.group === '外观') return true
+        pressKey('ArrowDown')
+      }
+      return false
+    }
+    check(focusGroupRow(), 'keyboard focus can land on the group row')
+    const focusOnGroupRow = () => {
+      const el = h.document.activeElement
+      return Boolean(el && el.dataset && el.dataset.group === '外观')
+    }
+    check(focusOnGroupRow(), 'the focus really is on that row')
+    hoverOut('外观', 'mouse')
+    h.advance(300, 40)
+    check(focusOnGroupRow(), 'hovering out does not move the focus')
+    h.advance(500, 40)
+    const activeNow = h.document.activeElement
+    check(isOpen('外观'), 'while focus is inside that group, leaving with the mouse does not close it',
+      `focus=${activeNow ? String(activeNow.className) + '/' + JSON.stringify(activeNow.dataset) : '(无)'}`)
+    /* 焦点挪走之后，它就该按规则收起了 */
+    pressKey('Home')
+    hoverOut('外观', 'mouse')
+    h.advance(800, 40)
+    check(!isOpen('外观'), 'once focus leaves, the hover rules apply again')
+    pressKey('Escape')
+    check(menuOf() === null, 'Escape still closes the menu after all that hovering')
+    /* 后面的检查要看菜单，重新打开 */
+    body5.dispatch('contextmenu', rightClickOnHer().ev)
+    check(menuOf() !== null, 'the menu reopens for the remaining structure checks')
+
     /* ---- 菜单里不该再有"版本与更新"：版本号在头部，检查更新在弹窗里 ---- */
     check(!itemsOf().some((i) => i.textContent.includes('版本与更新')),
       'the version entry is gone from the menu (the header shows it now)')