dsh-plugin-table-zoom 0.3.1 → 0.3.2

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [0.3.2] - 2026-08-22
+
+- README：新增「相关插件」互相引用段（列出同系列已发布插件，npm / GitHub 链接 + 一句话说明），互相引流。
+- **修复：放大/溢出表格里拖动不再被平移劫持**——此前正文内容溢出
+  （缩放后或表超宽）时，左键按住正文任意位置拖动即进入平移，并主动清空
+  选区，导致**无法在放大的表格里框选文字**。现在普通左键拖动保留浏览器
+  原生行为，可直接框选表格文字（含放大后）；滚动条 / 滚轮照常滚动。
+- **平移改为显式手势**：表格超宽/超高时，**按住空格再按住正文拖动**
+  才左右/上下滚动（grab 光标仅在按住空格时出现，拖拽中为 grabbing）；
+  触屏仍走原生滚动；拖动中松开空格即结束平移；关闭浮窗时清理空格监听。
+- 测试：冒烟拆分/新增 2 项（未按空格左键拖动不启动平移 / 按住空格可平移
+  且光标随空格状态切换），共 selfcheck 12 项 + 冒烟 13 项。
+
 ## [0.3.1] - 2026-08-22
 
 - **每次打开自适应，不再继承任何布局**：移除尺寸/位置/缩放的跨次记忆

package/README.md

@@ -29,8 +29,10 @@ DeepSeek Harness (dsh) Web GUI 聊天表格浮窗插件。
   位置只影响当次打开；
 - **Ctrl+滚轮缩放**：浮窗内按住 Ctrl 滚动滚轮，表格字体 60%–250% 缩放
   （步进 10%），标题栏实时显示百分比；**缩放不记忆，每次打开回到 100%**；
-- **拖拽平移**：表格超宽/超高时，按住正文任意位置即可左右/上下拖动滚动
-  （grab 光标提示；越过 4px 阈值才视为拖动，不干扰文本选择；触屏走原生滚动）；
+- **框选文字**：普通左键在表格（含放大后）里拖动即可框选文字，
+  不会被平移劫持；
+- **按住空格拖拽平移**：表格超宽/超高时，按住空格再按住正文拖动即可
+  左右/上下滚动（grab 光标仅在按住空格时出现；触屏走原生滚动）；
 - **滚动条清晰**：正文滚动条加深加粗，浅色主题下也能看清；
 - **列宽适配**：列宽上限与聊天内一致（`min(30vw, 320px)`），超宽列自动换行收缩，
   表格整体不再撑破浮窗。
@@ -110,6 +112,20 @@ npm run pack         # 打包
 - 不影响其他插件：只认 `tableScroll` 容器内的表格，跳过浮窗与 image-tools
   lightbox 内的表格。
 
+## 相关插件
+
+本插件属于 **Pasumao 的 dsh 插件生态**，同系列已发布插件可搭配使用：
+
+| 插件（npm） | GitHub | 说明 |
+|---|---|---|
+| [dsh-notify](https://www.npmjs.com/package/dsh-notify) | [GitHub 仓库](https://github.com/Pasumao/dsh-plugin-notify) | Windows 原生通知 + 系统托盘 |
+| [dsh-plugin-choice-refresh](https://www.npmjs.com/package/dsh-plugin-choice-refresh) | [GitHub 仓库](https://github.com/Pasumao/dsh-plugin-choice-refresh) | 选择增强：重新生成选项 / 更多选项 |
+| [dsh-plugin-dev-kb](https://www.npmjs.com/package/dsh-plugin-dev-kb) | [GitHub 仓库](https://github.com/Pasumao/dsh-plugin-dev-kb) | 插件开发知识库（官方文档完整镜像 + 技能） |
+| [dsh-plugin-image-tools](https://www.npmjs.com/package/dsh-plugin-image-tools) | [GitHub 仓库](https://github.com/Pasumao/dsh-plugin-image-tools) | 图片选择卡 + 回复内嵌图片 + 盲模型收图 |
+| [dsh-plugin-workbench](https://www.npmjs.com/package/dsh-plugin-workbench) | [GitHub 仓库](https://github.com/Pasumao/dsh-plugin-workbench) | VS Code 风格文件浏览器 + 可编辑预览 |
+
+> 本系列其余插件见 [Pasumao · dsh 插件](https://github.com/Pasumao)；觉得好用欢迎到 GitHub 点 ⭐。
+
 ## AI 生成声明
 
 代码与文档由 AI 辅助生成（DeepSeek Harness），均经人工审查与实机验证

package/lib/client.js

@@ -279,12 +279,19 @@ window.__ModuleLoader__.load({
       panel.style.top = y + 'px';
     }
 
-    /** 内容溢出时给正文加 grab 光标提示（可拖拽平移）。 */
+    /**
+     * 内容溢出且按住空格（平移预备）时才给正文加 grab 光标提示。
+     * 空格状态由 attachPan 维护在 body._dstzSpaceArmed 上；
+     * 布局变化（打开/改尺寸/缩放）后调用本函数即可同步光标。
+     */
     function refreshGrabbable(body) {
       var overX = body.scrollWidth > body.clientWidth + 1;
       var overY = body.scrollHeight > body.clientHeight + 1;
-      if (overX || overY) body.classList.add('dstz-grabbable');
-      else body.classList.remove('dstz-grabbable');
+      if ((overX || overY) && body._dstzSpaceArmed === true) {
+        body.classList.add('dstz-grabbable');
+      } else {
+        body.classList.remove('dstz-grabbable');
+      }
     }
 
     /** 命中可交互元素（链接/按钮/输入框等）时让给默认行为，不启动拖拽。 */
@@ -389,22 +396,65 @@ window.__ModuleLoader__.load({
     }
 
     /**
-     * 给正文挂载「拖拽平移」：内容溢出时按住表格左右/上下拖动即可滚动
-     * （鼠标/触控笔；触屏保留原生滚动）。越过 4px 阈值才视为拖动，
-     * 避免干扰文本选择；拖动结束松手落在遮罩上不会误关浮窗。
+     * 给正文挂载「按住空格拖动平移」：内容溢出时，按住空格再按住表格
+     * 左右/上下拖动即可滚动（鼠标/触控笔；触屏保留原生滚动）。
+     * 普通左键拖动不再被平移劫持，而是保留浏览器原生行为——可在表格
+     * （含放大后）里直接框选文字；只有按住空格时拖动才平移。
+     * grab 光标仅在按住空格悬停正文且内容溢出时出现；
+     * 拖动结束松手落在遮罩上不会误关浮窗。
      * @param {object} body - .dstz-body 元素。
-     * @param {object} overlay - .dstz-popup 元素（承载 _suppressClick）。
+     * @param {object} overlay - .dstz-popup 元素（承载 _suppressClick / _cleanups）。
      */
     function attachPan(body, overlay) {
       var state = null;
+      var endPan = function () {
+        if (state === null) return;
+        state = null;
+        body.classList.remove('dstz-panning');
+        window.setTimeout(function () { overlay._suppressClick = false; }, 0);
+      };
+      var setArmed = function (on) {
+        body._dstzSpaceArmed = on === true;
+        refreshGrabbable(body);
+      };
+      var onKeyDown = function (e) {
+        if (e.key === ' ' || e.code === 'Space') setArmed(true);
+      };
+      var onKeyUp = function (e) {
+        if (e.key === ' ' || e.code === 'Space') {
+          setArmed(false);
+          if (state !== null) endPan(); // 拖动中松开空格：结束平移
+        }
+      };
+      var onBlur = function () {
+        setArmed(false);
+        if (state !== null) endPan();
+      };
+      if (typeof window !== 'undefined' && typeof window.addEventListener === 'function') {
+        window.addEventListener('keydown', onKeyDown, true);
+        window.addEventListener('keyup', onKeyUp, true);
+        window.addEventListener('blur', onBlur);
+        if (Array.isArray(overlay._cleanups)) {
+          overlay._cleanups.push(function () {
+            window.removeEventListener('keydown', onKeyDown, true);
+            window.removeEventListener('keyup', onKeyUp, true);
+            window.removeEventListener('blur', onBlur);
+            setArmed(false);
+          });
+        }
+      }
       body.addEventListener('pointerdown', function (e) {
         if (e.button !== 0) return;
         if (e.pointerType !== undefined && e.pointerType !== 'mouse' && e.pointerType !== 'pen') return;
+        if (!body._dstzSpaceArmed) return; // 未按住空格：让给浏览器原生文本选择（框选文字）
         if (isInteractive(e.target)) return;
         var overX = body.scrollWidth > body.clientWidth + 1;
         var overY = body.scrollHeight > body.clientHeight + 1;
         if (!overX && !overY) return;
-        state = { x: e.clientX, y: e.clientY, sl: body.scrollLeft, st: body.scrollTop, moved: false };
+        if (typeof e.preventDefault === 'function') e.preventDefault();
+        state = { x: e.clientX, y: e.clientY, sl: body.scrollLeft, st: body.scrollTop };
+        body.classList.add('dstz-panning');
+        overlay._suppressClick = true;
         if (typeof body.setPointerCapture === 'function') {
           try { body.setPointerCapture(e.pointerId); } catch (err) { /* ignore */ }
         }
@@ -413,28 +463,12 @@ window.__ModuleLoader__.load({
         if (state === null) return;
         var dx = e.clientX - state.x;
         var dy = e.clientY - state.y;
-        if (!state.moved && Math.abs(dx) + Math.abs(dy) < 4) return;
-        if (!state.moved) {
-          state.moved = true;
-          body.classList.add('dstz-panning');
-          overlay._suppressClick = true;
-          if (typeof document !== 'undefined' && typeof document.getSelection === 'function') {
-            try { document.getSelection().removeAllRanges(); } catch (err) { /* ignore */ }
-          }
-        }
         body.scrollLeft = state.sl - dx;
         body.scrollTop = state.st - dy;
         if (typeof e.preventDefault === 'function') e.preventDefault();
       });
-      var end = function () {
-        if (state === null) return;
-        var wasMoved = state.moved;
-        state = null;
-        body.classList.remove('dstz-panning');
-        if (wasMoved) window.setTimeout(function () { overlay._suppressClick = false; }, 0);
-      };
-      body.addEventListener('pointerup', end);
-      body.addEventListener('pointercancel', end);
+      body.addEventListener('pointerup', endPan);
+      body.addEventListener('pointercancel', endPan);
     }
 
     /**
@@ -507,6 +541,9 @@ window.__ModuleLoader__.load({
       panel.appendChild(body);
       overlay.appendChild(panel);
 
+      // 清理登记（attachPan 等挂载的全局监听会 push 进来，关闭时统一移除）
+      overlay._cleanups = [];
+
       // 拖拽改尺寸 + 拖标题栏移动 + 内容溢出拖拽平移 + Ctrl+滚轮缩放
       attachResize(panel, overlay);
       attachMove(panel, overlay);
@@ -542,7 +579,6 @@ window.__ModuleLoader__.load({
         clampPanelPosition(panel);
         refreshGrabbable(body);
       };
-      overlay._cleanups = [];
       if (typeof window !== 'undefined' && typeof window.addEventListener === 'function') {
         window.addEventListener('resize', onWindowResize);
         overlay._cleanups.push(function () {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-plugin-table-zoom",
   "description": "DSH 聊天表格浮窗插件：聊天里 markdown 表格太长（行多/超宽）看不完时，表格上方自动出现「浮窗查看」按钮，点击弹出可滚动的小浮窗完整显示表格，并支持一键复制为 Markdown。纯前端 DOM 增强，不改核心包、不注册工具、无服务端逻辑。",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "type": "module",
   "main": "lib/index.js",
   "exports": {

package/scripts/smoke-client.mjs

@@ -7,8 +7,9 @@
  *   3. openPopup 创建浮窗（标题含行列数、表格克隆、关闭按钮），
  *      closePopup 关闭并还原 body 滚动；
  *   4. 表格克隆在浮窗内不会被再次增强（跳过 .dstz-popup）；
- *   5. 右下角改尺寸手柄可拖拽改面板大小；内容溢出时正文可拖拽平移；
- *      标题栏可拖拽移动浮窗（不越出视口）；Ctrl+滚轮缩放表格字体；
+ *   5. 右下角改尺寸手柄可拖拽改面板大小；溢出时左键拖动保留原生文本
+ *      选择（不启动平移），按住空格拖动才平移；标题栏可拖拽移动浮窗
+ *      （不越出视口）；Ctrl+滚轮缩放表格字体；
  *      每次打开都按内容自适应宽度并居中（不继承上次的尺寸/位置/缩放）。
  *
  * 运行：node scripts/smoke-client.mjs
@@ -132,7 +133,22 @@ const documentEl = {
   removeEventListener() {},
 }
 globalThis.document = documentEl
-globalThis.window = { setTimeout: (fn) => fn() }
+globalThis.window = {
+  setTimeout: (fn) => fn(),
+  _listeners: {},
+  addEventListener(type, fn) { (this._listeners[type] ??= []).push(fn) },
+  removeEventListener(type, fn) {
+    const arr = this._listeners[type]
+    if (!arr) return
+    const idx = arr.indexOf(fn)
+    if (idx >= 0) arr.splice(idx, 1)
+  },
+  dispatch(type, event = {}) {
+    const arr = this._listeners[type]
+    if (!arr) return
+    for (const fn of [...arr]) fn({ target: documentEl, stopPropagation() {}, ...event })
+  },
+}
 Object.defineProperty(globalThis, 'navigator', {
   value: { clipboard: { writeText: async (t) => { globalThis.__copied = t } } },
   configurable: true,
@@ -304,7 +320,7 @@ ok('每次打开不继承上次尺寸，始终按内容自适应', () => {
   mod.closePopup()
 })
 
-ok('溢出时正文可拖拽平移', () => {
+ok('溢出时左键拖动不启动平移（保留原生文本选择）', () => {
   mod.closePopup()
   const table = makeEl('table')
   table.rows = []
@@ -318,16 +334,46 @@ ok('溢出时正文可拖拽平移', () => {
   body.scrollLeft = 300
   body.scrollTop = 100
   mod.refreshGrabbable(body)
-  assert.ok(body.classList.contains('dstz-grabbable'), 'overflow should show grab cursor')
+  assert.ok(!body.classList.contains('dstz-grabbable'), '未按空格时不应显示 grab 光标')
+  // 未按空格：左键拖动不进入平移，也不吞掉遮罩点击（让给浏览器原生框选文字）
+  body.dispatch('pointerdown', { button: 0, clientX: 10, clientY: 10, pointerId: 1 })
+  body.dispatch('pointermove', { clientX: 110, clientY: 60 })
+  assert.ok(!body.classList.contains('dstz-panning'), '未按空格拖动不应进入平移')
+  assert.equal(body.scrollLeft, 300)
+  assert.equal(body.scrollTop, 100)
+  assert.ok(popup._suppressClick !== true, '未按空格拖动不应吞掉遮罩点击')
+  body.dispatch('pointerup', {})
+  mod.closePopup()
+})
+
+ok('按住空格拖动可平移溢出内容，光标随空格状态切换', () => {
+  mod.closePopup()
+  const table = makeEl('table')
+  table.rows = []
+  mod.openPopup(table)
+  const popup = documentEl.body.children.find((c) => c.className === 'dstz-popup')
+  const body = popup.children[0].children[1]
+  body.scrollWidth = 1200
+  body.clientWidth = 600
+  body.scrollHeight = 400
+  body.clientHeight = 300
+  body.scrollLeft = 300
+  body.scrollTop = 100
+  // 按住空格：内容溢出时出现 grab 光标
+  globalThis.window.dispatch('keydown', { key: ' ', code: 'Space' })
+  assert.ok(body.classList.contains('dstz-grabbable'), '按住空格且溢出时应显示 grab 光标')
   body.dispatch('pointerdown', { button: 0, clientX: 10, clientY: 10, pointerId: 1 })
   body.dispatch('pointermove', { clientX: 110, clientY: 60 })
-  assert.ok(body.classList.contains('dstz-panning'), 'panning class while dragging')
+  assert.ok(body.classList.contains('dstz-panning'), '按住空格拖动应进入平移')
   assert.equal(body.scrollLeft, 200)
   assert.equal(body.scrollTop, 50)
-  assert.ok(popup._suppressClick === true, 'pan should suppress overlay close')
+  assert.ok(popup._suppressClick === true, '平移应吞掉遮罩关闭')
   body.dispatch('pointerup', {})
-  assert.ok(!body.classList.contains('dstz-panning'), 'panning class cleared on release')
-  assert.ok(popup._suppressClick === false, 'suppress flag reset after pan')
+  assert.ok(!body.classList.contains('dstz-panning'), '松手后退出平移')
+  assert.ok(popup._suppressClick === false, '平移结束恢复遮罩点击')
+  // 松开空格：grab 光标消失
+  globalThis.window.dispatch('keyup', { key: ' ', code: 'Space' })
+  assert.ok(!body.classList.contains('dstz-grabbable'), '松开空格后 grab 光标消失')
   mod.closePopup()
 })
 

package//350/256/276/350/256/241/350/257/264/346/230/216.md

@@ -57,9 +57,11 @@ cordis.patch.yml         挂载一行，交 profile 的 dsh.profile.bundles 自
   每次打开都从 100% 开始；
 - **滚动条**：正文滚动条加深加粗（WebKit 伪元素 + Firefox `scrollbar-color`），
   浅色主题下也清晰可见；
-- **拖拽平移**：表格内容溢出正文时，鼠标/触控笔按住表格即可左右/上下拖动
-  滚动（grab/grabbing 光标提示）；越过 4px 阈值才视为拖动，避免干扰文本
-  选择；触屏保留浏览器原生滚动；拖完松手落在遮罩上不会误关浮窗；
+- **框选文字优先**：普通左键拖动保留浏览器原生文本选择（表格放大后也能
+  直接框选文字），不再被平移劫持；
+- **按住空格拖拽平移**：表格内容溢出正文时，按住空格再按住表格即可
+  左右/上下拖动滚动（grab 光标仅在按住空格时出现，拖拽中为 grabbing；
+  触屏保留浏览器原生滚动）；拖完松手落在遮罩上不会误关浮窗；
 - **列宽上限**：与核心渲染器 `tableScroll` 一致（`max-width:min(30vw,320px)`、
   `min-width:100px`），超宽列在浮窗内收缩换行，表整体不再超出浮窗。