dsh-global-todo 0.4.4 → 0.4.6

package/CHANGELOG.md

@@ -7,6 +7,24 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.4.6] — 2026-10-19
+
+The card existed; where it landed depended on a viewport assumption that the real shell does not
+honour.
+
+- **The detail card is measured from the panel, not from `50vw`.** In the GUI the plugin slot does
+  not fill the window, so the viewport-derived right edge put the card on top of the list; the card
+  now measures `.gt-inner` on open, on window resize and on a slot resize (sidebar collapse), and
+  positions itself from that rectangle. The CSS fallback (used by the static previews, which are
+  server-rendered and run no effects) assumes the centred 980px column.
+## [0.4.5] — 2026-10-19
+
+Polishing where the side detail sits, now that it exists.
+
+- **The card is bracketed between the toolbar and the footer**, so it no longer covers the dir
+  controls or the store line; the toolbar keeps its full width and only the list gives way; the
+  card scrolls as one column instead of pushing the footer around. Same CSS-only mechanism, no
+  markup change.
 ## [0.4.4] — 2026-10-19
 
 Opening a todo on a wide screen used to push the list down and leave half the window unused.

package/docs/DESIGN.md

@@ -61,8 +61,11 @@ $DSH_HOME/global-todo/todos.json     ← { version: 1, todos: [ … ] }
 
 Expanding a row inline is right on a narrow window and wrong on a wide one: the list jumps, the
 row you were reading slides away, and the rest of the screen sits empty. Above 1100px the open
-row's detail is lifted out of the flow into a card at the panel's right edge, and the list gets
-right padding equal to that card. This is a CSS-only override over unchanged markup
+row's detail is lifted out of the flow into a card bracketed between the toolbar and the footer
+at the panel's right edge; only the list gives way (the toolbar keeps full width), and the list gets
+padding equal to that card. The card's offsets are measured from the panel's own column on mount
+and on resize — the slot does not always fill the window, so a viewport-derived offset put the card
+over the list inside the real GUI. This is a CSS-only override over unchanged markup
 (`.gt-root[data-wide-detail]` plus one media query) precisely so there is still exactly one
 detail implementation — a second render path for wide screens would drift from the inline one at
 the first field change.

package/lib/client.js

@@ -50,7 +50,7 @@ window.__ModuleLoader__.load({
      * different mechanisms (restart vs. hot reload), so "which one am I looking
      * at" needs an answer that the bundle itself carries.
      */
-    const UI_REV = 'ui27'
+    const UI_REV = 'ui29'
     /** Last language resolved for the shell; module-level so a fetch failure can be worded too. */
     let activeLang = 'zh'
 
@@ -1012,11 +1012,18 @@ button.gt-chip[data-on="1"] { color: var(--dsw-alias-label-primary); border-colo
    down. Deliberately CSS-only over unchanged markup: one detail implementation, and it only
    applies where there is room for a second column. */
 @media (min-width: 1100px) {
-  .gt-root[data-wide-detail="1"] .gt-inner { padding-right: 408px; }
+  /* Only the list gives way: the title row and the toolbar keep their full width, so the
+     controls never wrap or hide behind the card. */
+  .gt-root[data-wide-detail="1"] .gt-groups { padding-right: 380px; }
+  .gt-root[data-wide-detail="1"] .gt-inner { position: relative; }
   .gt-root[data-wide-detail="1"] .gt-item[data-open="1"] .gt-detail {
-    /* Follow the panel's own right edge (it is centred and capped at 980px) instead of the
-       viewport's, so the card stays attached to the list on ultra-wide screens. */
-    position: fixed; top: 96px; right: max(24px, calc(50vw - 466px)); width: 360px; max-height: calc(100vh - 140px);
+    /* Anchored to the panel's own column (.gt-inner), not to the viewport: the slot does not
+       always fill the window, and a viewport-centred offset put the card over the list. */
+    /* The var fallback matters for the static previews (server-rendered, so effects never
+       run): they assume the panel is the centred 980px column. */
+    position: fixed; top: var(--gt-detail-top, 208px);
+    right: var(--gt-detail-right, max(24px, calc((100vw - 980px) / 2 + 24px)));
+    bottom: var(--gt-detail-bottom, 64px); width: 360px;
     overflow: auto; padding: 16px; margin: 0; border: 1px solid var(--dsw-alias-border-l2);
     border-radius: 12px; background: var(--dsw-alias-bg-overlay); z-index: 30;
   }
@@ -2143,6 +2150,10 @@ button.gt-chip[data-on="1"] { color: var(--dsw-alias-label-primary); border-colo
       // The store counts file changes made outside this process (another machine, a sync
       // client). A new count means the panel's view was stale a moment ago; say so once.
       const externalRef = useRef(null)
+      // The wide-screen detail card floats over the panel, so its offsets are measured from
+      // the panel's own column rather than derived from the viewport width.
+      const innerRef = useRef(null)
+      const [detailAnchor, setDetailAnchor] = useState(null)
       const titleRef = useRef(null)
       const searchRef = useRef(null)
       const undoTimer = useRef(null)
@@ -2196,6 +2207,35 @@ button.gt-chip[data-on="1"] { color: var(--dsw-alias-label-primary); border-colo
         }
       }, [lang])
 
+      useEffect(() => {
+        if (expandedId === '' || typeof window === 'undefined') {
+          setDetailAnchor(null)
+          return undefined
+        }
+        const measure = () => {
+          const element = innerRef.current
+          if (element === null) return
+          const rect = element.getBoundingClientRect()
+          setDetailAnchor({
+            top: Math.round(rect.top + 170),
+            right: Math.round(window.innerWidth - rect.right + 20),
+            bottom: Math.round(window.innerHeight - rect.bottom + 20),
+          })
+        }
+        measure()
+        window.addEventListener('resize', measure)
+        // The slot can change width without a window resize (sidebar collapse), which would
+        // leave the card at stale coordinates.
+        // `window.` on purpose: the static scan rejects a bare global it cannot see defined.
+        const Observer = typeof window.ResizeObserver === 'function' ? window.ResizeObserver : null
+        const observer = Observer === null ? null : new Observer(measure)
+        if (observer !== null && innerRef.current !== null) observer.observe(innerRef.current)
+        return () => {
+          window.removeEventListener('resize', measure)
+          if (observer !== null) observer.disconnect()
+        }
+      }, [expandedId, lang])
+
       useEffect(() => {
         mounted.current = true
         void reload()
@@ -2773,10 +2813,23 @@ button.gt-chip[data-on="1"] { color: var(--dsw-alias-label-primary); border-colo
 
       return h(
         'div',
-        { className: 'gt-root', 'data-wide-detail': expandedId === '' ? '0' : '1' },
+        {
+          className: 'gt-root',
+          'data-wide-detail': expandedId === '' ? '0' : '1',
+          // The slot does not always fill the window, so the card's viewport offsets are
+          // measured from the panel itself instead of assumed from 50vw.
+          style:
+            detailAnchor === null
+              ? undefined
+              : {
+                  '--gt-detail-top': `${detailAnchor.top}px`,
+                  '--gt-detail-right': `${detailAnchor.right}px`,
+                  '--gt-detail-bottom': `${detailAnchor.bottom}px`,
+                },
+        },
         h(
           'div',
-          { className: 'gt-inner' },
+          { className: 'gt-inner', ref: innerRef },
           h(
             'div',
             { className: 'gt-head' },

package/lib/index.js

@@ -35,7 +35,7 @@ import { createStore, resolveStorePath } from './store.js'
 import { createTools } from './tools.js'
 
 /** Must equal `package.json`'s version; `npm run check` enforces that. */
-export const VERSION = '0.4.4'
+export const VERSION = '0.4.6'
 
 /** Plugin id. Also the Loader row id in `cordis.patch.yml`. */
 export const name = 'dsh-global-todo'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-global-todo",
-  "version": "0.4.4",
+  "version": "0.4.6",
   "icon": "./docs/icon.svg",
   "description": "Global, cross-session todos for DeepSeek Harness: one list owned by the human and the agent together, with creation time, attached documents and links, and one-click hand-off to an agent session. 全局待办：跨会话一份清单，记录加入时间，可挂文档与地址，可一键交给 Agent 继续干。",
   "type": "module",