dsh-wisp 1.30.0 → 1.32.0

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.30.0'
+    const VERSION = '1.32.0'
 
 /* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它，
    忘了更新就会红，不会静默过期。 */
@@ -71,6 +71,8 @@ const WHATS_NEW = {
   '1.28.0': '菜单分成折叠分组，另外多了「关于她」和「动作一览」两个弹窗。',
   '1.29.0': '夜深了她会劝你去睡；你走开再回来她记得；连续来了几天她也记着。',
   '1.30.0': '会陪你专注计时了；页面藏起来时她会安静下来，不再空转。',
+  '1.31.0': '菜单重做：状态一目了然，开关是开关，大小能直接拖。',
+  '1.32.0': '分组改成鼠标悬停就展开、移开就收起（点一下则是钉住）。',
 }
 
 /* 更新这件事**这个插件自己做不到**，如实写在代码里，免得以后有人以为能：
@@ -689,10 +691,33 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 .wisp-root[data-mood="attn"] .wisp-body{animation-name:wisp-nudge;animation-duration:1.5s;animation-iteration-count:4}
 @keyframes wisp-nudge{0%,100%{transform:translate3d(0,0,0)}25%{transform:translate3d(-7px,0,0)}75%{transform:translate3d(7px,0,0)}}
 @keyframes wisp-hop{0%,100%{transform:translate3d(0,0,0)}45%{transform:translate3d(0,-16px,0)}}
-.wisp-menu{position:absolute;min-width:150px;padding:5px;border-radius:11px;font-size:12px;line-height:1.2;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));box-shadow:0 10px 30px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);pointer-events:auto;animation:wisp-menu .14s ease}
+.wisp-menu{position:absolute;min-width:198px;max-width:240px;padding:6px;border-radius:12px;font-size:12px;line-height:1.25;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));box-shadow:0 12px 34px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);pointer-events:auto;animation:wisp-menu .14s ease}
 .wisp-menu-item{display:block;width:100%;padding:7px 10px;border:0;border-radius:7px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;white-space:nowrap}
 .wisp-menu-item:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
-.wisp-menu-head{padding:7px 10px 3px;font-size:11px;opacity:.62;letter-spacing:.04em}
+.wisp-menu-head{padding:5px 9px 7px}
+.wisp-menu-title{font-size:12.5px;font-weight:600}
+.wisp-menu-sub{font-size:10.5px;opacity:.6;margin-top:1px}
+.wisp-menu-sep{height:1px;margin:4px 6px;background:var(--dsw-alias-border-l1,var(--wisp-say-line));opacity:.45}
+.wisp-menu-hint{padding:5px 9px 3px;font-size:10.5px;opacity:.45}
+.wisp-menu-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
+.wisp-menu-sum{flex:0 1 auto;min-width:0;font-size:11px;opacity:.55;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.wisp-menu-item[data-accent="true"]{font-weight:600;color:var(--dsw-alias-brand-primary,inherit)}
+.wisp-menu-item[data-muted="true"]{opacity:.78}
+.wisp-switch{flex:0 0 auto;width:26px;height:14px;border-radius:8px;background:rgba(140,160,190,.35);position:relative;transition:background .15s ease}
+.wisp-switch[data-on="true"]{background:var(--dsw-alias-brand-primary,#4a7cf7)}
+.wisp-switch i{position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .15s ease}
+.wisp-switch[data-on="true"] i{transform:translateX(12px)}
+.wisp-slider-row{padding:6px 10px 8px}
+.wisp-slider-top{display:flex;justify-content:space-between;font-size:11px;opacity:.8;margin-bottom:3px}
+.wisp-slider{position:relative;height:16px;cursor:pointer;outline:none;touch-action:none}
+.wisp-slider-track{position:absolute;left:0;right:0;top:7px;height:3px;border-radius:2px;background:rgba(140,160,190,.35)}
+.wisp-slider-fill{position:absolute;left:0;top:7px;height:3px;border-radius:2px;background:var(--dsw-alias-brand-primary,#4a7cf7)}
+.wisp-slider-knob{position:absolute;top:3px;width:11px;height:11px;margin-left:-5px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35)}
+.wisp-slider:focus-visible .wisp-slider-knob{outline:2px solid var(--dsw-alias-brand-primary,#4a7cf7);outline-offset:1px}
+.wisp-grid2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:2px 8px 4px}
+.wisp-grid2 button,.wisp-corner{padding:6px 4px;border:1px solid transparent;border-radius:7px;background:none;color:inherit;font:inherit;font-size:11px;cursor:pointer}
+.wisp-grid2 button:hover,.wisp-corner:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
+.wisp-grid2 button[data-current="true"],.wisp-corner[data-current="true"]{border-color:var(--dsw-alias-brand-primary,#4a7cf7);font-weight:600}
 .wisp-root[data-hidden="true"]{display:none}
 .wisp-tab{position:absolute;width:56px;height:56px;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));box-shadow:0 6px 18px rgba(0,0,0,.22);cursor:pointer;pointer-events:auto;animation:wisp-menu .16s ease;transition:transform .16s ease}
 .wisp-tab:hover{transform:translateY(-2px)}
@@ -715,6 +740,8 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 .wisp-cell:hover{border-color:var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.18))}
 .wisp-cell img{width:100%;height:52px;object-fit:contain;object-position:bottom center;pointer-events:none}
 .wisp-credits{font-size:11px;opacity:.8;margin:6px 0 0}
+.wisp-dialog-action{display:block;width:100%;margin:4px 0 2px;padding:7px 10px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));border-radius:8px;background:none;color:inherit;font:inherit;cursor:pointer}
+.wisp-dialog-action:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.2))}
 @media (prefers-reduced-motion:reduce){.wisp-body{animation:none!important}}`
 
     const installStyles = (styles) => {
@@ -1987,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 }
       }
 
@@ -2175,6 +2257,17 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 
       const aboutDialog = () => {
         const note = WHATS_NEW[VERSION]
+        /* 菜单里那条「版本与更新」已经收掉了（版本号现在直接显示在菜单头部），
+           所以检查更新必须有新的入口 —— 放在这里，上下文正合适。 */
+        const checkBtn = document.createElement('button')
+        checkBtn.className = 'wisp-dialog-action'
+        checkBtn.setAttribute('type', 'button')
+        checkBtn.textContent = '检查更新'
+        checkBtn.addEventListener('click', (ev) => {
+          ev.preventDefault()
+          closeDialog()
+          showUpdate()
+        })
         return openDialog('about', '关于她', [
           para('DeepSeek娘 —— DSH 界面上的浮动桌宠。她会跟着你的状态换表情：你打字她在忙，你闲着她在晃，你跑完一轮她替你高兴。'),
           para('她的样子照社区规范来：深蓝色渐变长直发、头顶一个大圆环呆毛、两片鲸鳍耳、女仆装。'),
@@ -2182,16 +2275,39 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
           para('她还能陪你专注计时：菜单里开一段 25 或 45 分钟，期间她保持"干活中"，戳她一下是问还剩多久，到点她替你收工。'),
           para('这一版：' + (note || VERSION)),
           para('形象与设定参考社区项目 Neko3000/deepseek-whalechan（设定文档 CC BY-NC-SA 4.0，原作者 B站 ZipZipPipe、上善无形）。'),
+          checkBtn,
           dialogFoot('非官方同人作品，与 DeepSeek 官方无关', 'v' + VERSION),
         ])
       }
 
-      /* 顶层只放"做什么"，外观/行为/位置收进可折叠的分组 —— 19 个同级条目等于没有结构。 */
+      /* 菜单的结构 ------------------------------------------------------------
+         三段：**动作在上**（专注是最常用的，置顶）、**设置在中间**（三个可折叠分组 +
+         大小滑块）、**信息在下**（动作一览 / 关于她）。每段之间有空行。
+         分组的标题行直接显示当前状态（皮肤名 / 几个开关开着 / 哪个角落），
+         所以收起时也知道里面是什么 —— 这是它和"一个写着外观的按钮"的区别。 */
+      const onToggleCount = () => TOGGLES.filter((t) => cfg[t.key] === true).length
+      const currentCorner = () => {
+        const bw = boxW()
+        const bh = boxH()
+        const hit = CORNERS.find((c) => {
+          const want = c.at(vw(), vh(), bw, bh, cfg)
+          return Math.abs(want.x - coords.x) < 2 && Math.abs(want.y - coords.y) < 2
+        })
+        return hit ? hit.label : '自由'
+      }
       const menuItems = () => [
-        { label: '关于她…', run: () => aboutDialog() },
-        { label: '动作一览…', run: () => actionsDialog() },
+        { kind: 'head' },
+        { kind: 'sep' },
+        /* 专注：最常用的动作，放最上面；进行中时这一行本身就是状态 + 结束 */
+        ...(focusUntil > 0
+          ? [{ label: '专注中 · 还剩 ' + Math.max(1, Math.ceil(focusLeftMs() / 60000)) + ' 分钟', run: () => stopFocus(false), accent: true }]
+          : [
+              { label: '专注 ' + cfg.focusMinutes + ' 分钟', run: () => startFocus(cfg.focusMinutes), accent: true },
+              { label: '专注 45 分钟', run: () => startFocus(45) },
+            ]),
+        { kind: 'sep' },
         {
-          group: '外观',
+          group: '外观', summary: skinLabel(activeSkin),
           children: [
             ...SKIN_IDS.map((id) => ({
               label: (id === activeSkin ? '✓ ' : '　') + skinLabel(id),
@@ -2208,26 +2324,27 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
         },
         {
           group: '行为',
+          summary: onToggleCount() + '/' + TOGGLES.length + ' 开',
           children: [
             { label: '说句话', run: () => { wake(true); say(pick(LINES.click)) } },
             { label: '睡一会儿', run: () => setMood('sleep') },
-            { label: '专注 ' + cfg.focusMinutes + ' 分钟', run: () => startFocus(cfg.focusMinutes) },
-            { label: '专注 45 分钟', run: () => startFocus(45) },
-            /* 只有专注中才出现"结束专注" —— 平时的菜单不该多一个按不动的条目 */
-            ...(focusUntil > 0 ? [{ label: '结束专注', run: () => stopFocus(false) }] : []),
-            ...TOGGLES.map((t) => ({
-              label: (cfg[t.key] === true ? '✓ ' : '　') + t.label,
-              run: () => applyConfig({ [t.key]: cfg[t.key] !== true }),
-            })),
+            /* 开关是**真正的开关行**：带 aria-checked，点完菜单不关（就在原地更新） */
+            ...TOGGLES.map((t) => ({ kind: 'switch', key: t.key, label: t.label })),
           ],
         },
         {
           group: '位置',
-          children: CORNERS.map((c) => ({ label: c.label, run: () => goCorner(c.label) })),
+          summary: currentCorner(),
+          children: [{ kind: 'corners' }],
         },
-        { label: '版本与更新', run: () => showUpdate() },
+        { kind: 'slider' },
+        { kind: 'sep' },
+        { label: '动作一览…', run: () => actionsDialog() },
+        { label: '关于她…', run: () => aboutDialog() },
+        { kind: 'sep' },
         /* 一个开关，不是一个单向动作：从迷你按钮右键打开菜单时，它必须能把她叫回来。 */
-        { label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden) },
+        { label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden), muted: true },
+        { kind: 'hint' },
       ]
 
       /* ---- 菜单的键盘驱动 ----
@@ -2266,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()
@@ -2275,13 +2392,16 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
         menu.className = 'wisp-menu'
         menu.setAttribute('role', 'menu')
         menu.style.position = 'absolute'
-        let heads = 0
-        const addItem = (spec, sub) => {
+        let extras = 0
+        /* 动作行：点了就执行、然后关菜单。 */
+        const actionRow = (spec, into) => {
           const btn = document.createElement('button')
           btn.className = 'wisp-menu-item'
           btn.setAttribute('type', 'button')
           btn.setAttribute('role', 'menuitem')
           btn.setAttribute('tabindex', '-1')
+          if (spec.accent === true) btn.dataset.accent = 'true'
+          if (spec.muted === true) btn.dataset.muted = 'true'
           btn.textContent = spec.label
           // 菜单自己吞掉 pointerdown，否则会被下面那个"点外面就关"的监听判成外部点击
           btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
@@ -2290,26 +2410,202 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             closeMenu()
             try { spec.run() } catch (err) { /* 单个动作失败不该带塌整个菜单 */ }
           })
-          menu.appendChild(btn)
+          into.appendChild(btn)
           menuButtons.push(btn)
           return btn
         }
+
+        /* 开关行：真开关的样子 + role=menuitemcheckbox + aria-checked。
+           点完**不关菜单** —— 拨开关时菜单消失是最烦人的交互之一。 */
+        const switchRow = (spec, into) => {
+          const on = cfg[spec.key] === true
+          const btn = document.createElement('button')
+          btn.className = 'wisp-menu-item wisp-menu-row'
+          btn.setAttribute('type', 'button')
+          btn.setAttribute('role', 'menuitemcheckbox')
+          btn.setAttribute('aria-checked', on ? 'true' : 'false')
+          btn.setAttribute('tabindex', '-1')
+          btn.dataset.switchKey = spec.key
+          const label = document.createElement('span')
+          label.textContent = spec.label
+          const toggle = document.createElement('span')
+          toggle.className = 'wisp-switch'
+          toggle.dataset.on = on ? 'true' : 'false'
+          toggle.appendChild(document.createElement('i'))
+          btn.appendChild(label)
+          btn.appendChild(toggle)
+          btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
+          btn.addEventListener('click', (ev) => {
+            ev.preventDefault(); ev.stopPropagation()
+            try { applyConfig({ [spec.key]: cfg[spec.key] !== true }) } catch (err) { /* ignore */ }
+            /* 原地重画：开着的那一组保持开着，菜单不跳走 */
+            openMenu(menuAtX, menuAtY, true)
+          })
+          into.appendChild(btn)
+          menuButtons.push(btn)
+          return btn
+        }
+
+        /* 大小滑块：连续量就该直接拖，而不是一次次点"放大一点"。
+           键盘也能调（←/→ 各 0.25 档）—— 所以它自己是可聚焦的。
+           替身里没有布局，getBoundingClientRect 全是 0，所以宽度为 0 时用固定跨度兜底；
+           测试一律走方向键那条路，不依赖像素。 */
+        const sliderRow = (into) => {
+          const SPEC = CONFIG_SPEC.size
+          const row = document.createElement('div')
+          row.className = 'wisp-slider-row'
+          const top = document.createElement('div')
+          top.className = 'wisp-slider-top'
+          const name = document.createElement('span')
+          name.textContent = '大小'
+          const value = document.createElement('span')
+          value.className = 'wisp-slider-value'
+          value.dataset.sliderValue = '1'
+          value.textContent = Math.round(cfg.size * 100) + '%'
+          top.appendChild(name)
+          top.appendChild(value)
+          row.appendChild(top)
+          const track = document.createElement('div')
+          track.className = 'wisp-slider'
+          track.setAttribute('role', 'slider')
+          track.setAttribute('tabindex', '-1')
+          track.setAttribute('aria-label', '大小')
+          track.dataset.slider = '1'
+          track.setAttribute('aria-valuemin', String(SPEC.lo))
+          track.setAttribute('aria-valuemax', String(SPEC.hi))
+          track.setAttribute('aria-valuenow', String(cfg.size))
+          const bg = document.createElement('div')
+          bg.className = 'wisp-slider-track'
+          const fill = document.createElement('div')
+          fill.className = 'wisp-slider-fill'
+          const knob = document.createElement('div')
+          knob.className = 'wisp-slider-knob'
+          track.appendChild(bg)
+          track.appendChild(fill)
+          track.appendChild(knob)
+          const paintSlider = () => {
+            const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
+            fill.style.width = Math.round(ratio * 100) + '%'
+            knob.style.left = Math.round(ratio * 100) + '%'
+            value.textContent = Math.round(cfg.size * 100) + '%'
+            track.setAttribute('aria-valuenow', String(cfg.size))
+          }
+          paintSlider()
+          const setFromClientX = (clientX) => {
+            let rect = { left: 0, width: 0 }
+            try { rect = track.getBoundingClientRect() } catch (e) { rect = { left: 0, width: 0 } }
+            const span = rect.width > 0 ? rect.width : 120
+            const ratio = clamp((clientX - rect.left) / span, 0, 1)
+            const next = Math.round((SPEC.lo + ratio * (SPEC.hi - SPEC.lo)) * 4) / 4
+            applyConfig({ size: next })
+            paintSlider()
+          }
+          track.addEventListener('pointerdown', (ev) => {
+            ev.preventDefault(); ev.stopPropagation()
+            setFromClientX(ev.clientX)
+            const move = (e) => setFromClientX(e.clientX)
+            const up = () => {
+              window.removeEventListener('pointermove', move)
+              window.removeEventListener('pointerup', up)
+            }
+            window.addEventListener('pointermove', move)
+            window.addEventListener('pointerup', up)
+          })
+          row.appendChild(track)
+          into.appendChild(row)
+          menuButtons.push(track)
+          extras++
+          return track
+        }
+
+        /* 四个角落用 2×2 的方位控件，而不是四个文字条目 —— 空间的事用空间的形式表达。 */
+        const cornerGrid = (into) => {
+          const grid = document.createElement('div')
+          grid.className = 'wisp-grid2'
+          for (const corner of CORNERS) {
+            const b = document.createElement('button')
+            b.className = 'wisp-corner'
+            b.setAttribute('type', 'button')
+            b.setAttribute('tabindex', '-1')
+            b.dataset.corner = corner.label
+            b.textContent = corner.label
+            if (corner.label === currentCorner()) b.dataset.current = 'true'
+            b.addEventListener('pointerdown', (ev) => ev.stopPropagation())
+            b.addEventListener('click', (ev) => {
+              ev.preventDefault(); ev.stopPropagation()
+              closeMenu()
+              try { goCorner(corner.label) } catch (err) { /* ignore */ }
+            })
+            grid.appendChild(b)
+            menuButtons.push(b)
+          }
+          into.appendChild(grid)
+          extras++
+        }
+
+        const renderChildren = (children, into) => {
+          for (const child of children) {
+            if (child.kind === 'switch') { switchRow(child, into); continue }
+            if (child.kind === 'corners') { cornerGrid(into); continue }
+            actionRow(child, into)
+          }
+        }
+
         for (let i = 0; i < items.length; i++) {
           const spec = items[i]
+          if (spec.kind === 'head') {
+            /* 头部：她是谁、哪一版、现在什么状态。不可聚焦 —— 它不是动作。 */
+            const head = document.createElement('div')
+            head.className = 'wisp-menu-head'
+            const title = document.createElement('div')
+            title.className = 'wisp-menu-title'
+            title.textContent = 'DeepSeek娘'
+            const subline = document.createElement('div')
+            subline.className = 'wisp-menu-sub'
+            const bits = ['v' + VERSION, skinLabel(activeSkin)]
+            if (focusUntil > 0) bits.push('专注中')
+            subline.textContent = bits.join(' · ')
+            head.appendChild(title)
+            head.appendChild(subline)
+            menu.appendChild(head)
+            extras++
+            continue
+          }
+          if (spec.kind === 'sep') {
+            const sep = document.createElement('div')
+            sep.className = 'wisp-menu-sep'
+            menu.appendChild(sep)
+            extras++
+            continue
+          }
+          if (spec.kind === 'hint') {
+            const hint = document.createElement('div')
+            hint.className = 'wisp-menu-hint'
+            hint.textContent = '↑↓ 选择 · ←→ 调大小 · Esc 关闭'
+            menu.appendChild(hint)
+            extras++
+            continue
+          }
+          if (spec.kind === 'slider') { sliderRow(menu); continue }
           if (spec.header !== undefined) {
             // 小标题是分组标签，不是菜单项 —— 不能被聚焦，否则键盘用户会停在一个按不动的东西上
             const head = document.createElement('div')
             head.className = 'wisp-menu-head'
             head.textContent = spec.header
             menu.appendChild(head)
-            heads++
+            extras++
             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'
+            btn.className = 'wisp-menu-item wisp-menu-row'
             btn.setAttribute('type', 'button')
             btn.setAttribute('role', 'menuitem')
             btn.setAttribute('tabindex', '-1')
@@ -2319,44 +2615,58 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             /* 文字直接写在按钮上，不拆成子 span：真 DOM 会汇总子节点的 textContent，
                但简化 DOM（预检的替身）不会 —— 依赖那种汇总会让分组名在替身里变成空串。 */
             btn.textContent = (open ? '▾ ' : '▸ ') + spec.group
+            if (spec.summary !== undefined) {
+              const sum = document.createElement('span')
+              sum.className = 'wisp-menu-sum'
+              sum.dataset.summary = '1'
+              sum.textContent = spec.summary
+              btn.appendChild(sum)
+            }
             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'
-            for (const child of spec.children) {
-              const cb = document.createElement('button')
-              cb.className = 'wisp-menu-item'
-              cb.setAttribute('type', 'button')
-              cb.setAttribute('role', 'menuitem')
-              cb.setAttribute('tabindex', '-1')
-              cb.textContent = child.label
-              cb.addEventListener('pointerdown', (ev) => ev.stopPropagation())
-              cb.addEventListener('click', (ev) => {
-                ev.preventDefault(); ev.stopPropagation()
-                closeMenu()
-                try { child.run() } catch (err) { /* 同上 */ }
-              })
-              wrap.appendChild(cb)
-              menuButtons.push(cb)
-            }
-            menu.appendChild(wrap)
+            renderChildren(spec.children, wrap)
+            /* 子项进 block（悬停区），不是直接进 menu */
+            block.appendChild(wrap)
             continue
           }
-          addItem(spec, false)
+          actionRow(spec, menu)
         }
+
         // 先挂上去再定位：定位要用最终尺寸，而尺寸只有渲染后才知道
         layer.appendChild(menu)
         menuEl = menu
         const w = MENU_W
         // 高度只用于夹取落点，所以按**实际渲染出来的行数**估算即可（假 DOM 里没有布局可测）
-        const hs = MENU_PAD + heads * 22 + menuButtons.length * MENU_ITEM_H
+        const hs = MENU_PAD + extras * 24 + menuButtons.length * MENU_ITEM_H
         menu.style.left = Math.round(clamp(x, 8, Math.max(8, vw() - w - 8))) + 'px'
         menu.style.top = Math.round(clamp(y, 8, Math.max(8, vh() - hs - 8))) + 'px'
 
@@ -2368,6 +2678,28 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             return
           }
           if (menuButtons.length === 0) return
+          /* 焦点在滑块上：←/→ 调大小，不移动焦点（这是滑块的常规键盘交互）。 */
+          const focused = menuFocusAt >= 0 ? menuButtons[menuFocusAt] : null
+          if (focused && focused.dataset && focused.dataset.slider === '1'
+            && (ev.key === 'ArrowLeft' || ev.key === 'ArrowRight')) {
+            if (typeof ev.preventDefault === 'function') ev.preventDefault()
+            const step = ev.shiftKey ? 1 : 0.25
+            applyConfig({ size: cfg.size + (ev.key === 'ArrowRight' ? step : -step) })
+            /* 只更新滑块自身，不重画整张菜单 —— 焦点和展开状态都不动 */
+            try {
+              const SPEC = CONFIG_SPEC.size
+              const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
+              const knob = focused.querySelector('.wisp-slider-knob')
+              const fill = focused.querySelector('.wisp-slider-fill')
+              if (knob) knob.style.left = Math.round(ratio * 100) + '%'
+              if (fill) fill.style.width = Math.round(ratio * 100) + '%'
+              focused.setAttribute('aria-valuenow', String(cfg.size))
+              const row = focused.parentNode
+              const label = row && row.querySelector ? row.querySelector('[data-slider-value]') : null
+              if (label) label.textContent = Math.round(cfg.size * 100) + '%'
+            } catch (err) { /* 画不出来也不该挡住改大小 */ }
+            return
+          }
           let at = menuFocusAt
           if (ev.key === 'ArrowDown') at = at < 0 ? 0 : at + 1
           else if (ev.key === 'ArrowUp') at = at < 0 ? menuButtons.length - 1 : at - 1