dsh-newbe-response-window 0.2.0 → 0.3.0

package/README.md

@@ -16,6 +16,10 @@ DeepSeek Harness (DSH) Web 插件：把一轮里的 think（推理）和工具
   - 主体：`max-height: N 行`（默认 10）的**内部滚动区**
     - **think 与工具调用严格按真实输出顺序交错排列**（不做「think 全在上 / bash 全在下」的强行分区）
     - 每段 think 一行（Think + 单行摘要 + 展开箭头），默认折叠，点击展开完整推理（内部限高滚动）；展开文字与工具输出同字号（同一 mono 字体）
+    - **think 流式显示三种模式**（`liveStreamThink`，默认 `'out'`）：
+      - `'out'`（默认）：正在流式的 think 在 **slide 外**（原生位置）实时显示，流式结束后**收进 slide 折叠**成单行摘要
+      - `'in'`：流式 think 在 **slide 内**自动展开、正文实时滚动，结束后自动收起为单行摘要
+      - `'off'`：think 全程折叠为单行摘要，不做流式展开
     - 每条工具调用一行（状态点 + 工具名 + 单行摘要），点击展开参数/输出（输出再限高一档，内部滚动）
   - 执行中自动跟随底部
 - **原生 Think 行从消息流中隐藏**（该段已并入 slide，避免重复显示），与 slide 内展示共用同一份内容
@@ -26,6 +30,14 @@ DeepSeek Harness (DSH) Web 插件：把一轮里的 think（推理）和工具
 
 ## 安装
 
+从 npm 安装：
+
+```bash
+dsh plugin --profile web add dsh-newbe-response-window
+```
+
+或从合集仓库 GitHub 子目录安装：
+
 ```bash
 dsh plugin --profile web add github:qiqiangvae/dsh-newbe-plugins#path:packages/dsh-newbe-response-window
 ```
@@ -54,13 +66,15 @@ dsh plugin --profile web add "link:$(pwd)/packages/dsh-newbe-response-window"
 | `collapsed` | `false` | 每轮 slide 是否默认收起成一行 bar。默认 `false`：始终展开、内容可见 |
 | `showReadOnly` | `true` | 是否在 slide 里列出 read/grep/web_search 等只读调用（默认全列出，不藏） |
 | `minCollapseRows` | `3` | 仅 `collapsed: true` 时生效：少于该数量的轮次不收起 |
+| `liveStreamThink` | `'out'` | 流式 think 的显示模式：`'out'` 盒外流式结束后进盒折叠 / `'in'` 盒内自动展开 / `'off'` 全程折叠 |
 
 ### 设置页（Settings → General）
 
-插件在 Web UI 的 **Settings → General** 里注册了一项 **「响应窗口大小（行数）」**：
+插件在 Web UI 的 **Settings → General** 里注册了两项：
 
-- `−` / 数值输入 / `+`：调整 `lines`（0–200，`0` = 不限高，默认 10）
-- **即时生效**：改动后已渲染的 slide 高度立刻变化（经宿主 settings namespace `dsh-newbe-response-window` 持久化）
+- **「响应窗口大小（行数）」**：`−` / 数值输入 / `+` 调整 `lines`（0–200，`0` = 不限高，默认 10）
+- **「流式思考显示」**：三选一（关闭 / 盒内 / 出盒），对应 `liveStreamThink`（默认出盒）
+- 均**即时生效**：改动后已渲染的 slide 立刻变化（经宿主 settings namespace `dsh-newbe-response-window` 持久化）
 
 ## 实现说明（为什么安全）
 

package/cordis.patch.yml

@@ -19,6 +19,11 @@
 #   minCollapseRows   only auto-collapse a finished slide when it has at least
 #                     this many tool calls (default 3; only used with
 #                     collapsed=true).
+#   liveStreamThink   how a streaming think block is shown (default 'out'):
+#                     'off' — always folded into a one-line summary
+#                     'in'  — auto-expand inside the slide, live scroll
+#                     'out' — stream outside the slide (native position),
+#                             then fold into the slide once settled
 - insert:
     - id: dsh-newbe-response-window
       name: 'dsh-newbe-response-window'
@@ -27,3 +32,4 @@
         collapsed: false
         showReadOnly: true
         minCollapseRows: 3
+        liveStreamThink: 'out'

package/lib/client.js

@@ -61,17 +61,28 @@ window.__ModuleLoader__.load({
     var createSnapshotStore = storeLib.createSnapshotStore
 
     // ---- config -----------------------------------------------------------
+    // liveStreamThink mode: 'off' (always folded) | 'in' (auto-expand the row
+    // inside the slide while streaming) | 'out' (stream outside the slide in
+    // the native position, fold into the slide when settled).
     var DEFAULTS = {
       lines: 10,
       collapsed: false,
       showReadOnly: true,
       minCollapseRows: 3,
+      liveStreamThink: 'out',
     }
     function clampInt(value, min, max, fallback) {
       var n = Number(value)
       if (!Number.isFinite(n)) return fallback
       return Math.min(max, Math.max(min, Math.round(n)))
     }
+    function normalizeLiveStreamThink(value, fallback) {
+      if (value === 'off' || value === 'in' || value === 'out') return value
+      // Legacy boolean row config: true meant in-box live streaming.
+      if (value === true) return 'in'
+      if (value === false) return 'off'
+      return fallback
+    }
     function readConfig(cfg) {
       cfg = cfg || {}
       return {
@@ -79,19 +90,22 @@ window.__ModuleLoader__.load({
         collapsed: cfg.collapsed === true,
         showReadOnly: cfg.showReadOnly !== false,
         minCollapseRows: clampInt(cfg.minCollapseRows, 1, 50, DEFAULTS.minCollapseRows),
+        liveStreamThink: normalizeLiveStreamThink(cfg.liveStreamThink, DEFAULTS.liveStreamThink),
       }
     }
 
     // ---- live settings state ----------------------------------------------
-    // `lines` is user-adjustable from Settings; the rest come from row config.
+    // `lines` and `liveStreamThink` are user-adjustable from Settings; the
+    // rest come from row config.
     var linesStore = null
+    var liveStreamThinkStore = null
     var settingsScope = null
     var NS = 'dsh-newbe-response-window'
     function clampLines(value) { return clampInt(value, 0, 200, DEFAULTS.lines) }
 
     /** Minimal observable-value hook over a SnapshotStore (plain React). */
-    function useStoreValue(store) {
-      var pair = React.useState(function () { return store === null ? DEFAULTS.lines : store.getSnapshot() })
+    function useStoreValue(store, fallback) {
+      var pair = React.useState(function () { return store === null ? fallback : store.getSnapshot() })
       var value = pair[0]
       var setValue = pair[1]
       React.useEffect(function () {
@@ -105,7 +119,7 @@ window.__ModuleLoader__.load({
 
     /** Live window size in lines (follows the Settings store). */
     function useLiveLines() {
-      return useStoreValue(linesStore)
+      return useStoreValue(linesStore, DEFAULTS.lines)
     }
 
     // ---- shared style injection ------------------------------------------
@@ -195,7 +209,7 @@ window.__ModuleLoader__.load({
         '.drw-think-name { color: var(--dsw-alias-label-secondary, #bbb); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; flex: none; }',
         '.drw-think-summary { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-tertiary, #999); font-size: 12.5px; flex: 1 1 auto; }',
         '.drw-think-toggle { color: var(--dsw-alias-label-tertiary, #888); font-size: 10px; flex: none; }',
-        '.drw-think-body { margin: 0; padding: 6px 8px; color: var(--dsw-alias-label-primary, #eee); font: var(--dsw-font-markdown-code-block-small, 12px/1.5 ui-monospace, monospace); white-space: pre-wrap; word-break: break-word; max-height: 240px; overflow-y: auto; }',
+        '.drw-think-body { margin: 0; padding: 6px 8px; color: var(--dsw-alias-label-primary, #eee); font: var(--dsw-font-markdown-code-block-small, 12px/1.5 ui-monospace, monospace); white-space: pre-wrap; word-break: break-word; max-height: 96px; overflow-y: auto; }',
         /* Hide the native Think row once it's inside a slide (DOM + CSS only) */
         '[data-variant="think"][data-drw-hidethink="1"] { display: none !important; }',
         /* Settings row: response window size */
@@ -213,6 +227,10 @@ window.__ModuleLoader__.load({
         '}',
         '.drw-set-btn:hover { background: var(--dsw-alias-interactive-bg-hover, rgba(128,128,128,0.16)); }',
         '.drw-set-btn:disabled { opacity: 0.4; cursor: default; }',
+        '.drw-set-btn.drw-set-on {',
+        '  border-color: var(--dsw-alias-state-business-primary, var(--dsw-alias-brand, #3dbbf5));',
+        '  color: var(--dsw-alias-state-business-primary, var(--dsw-alias-brand, #3dbbf5));',
+        '}',
         '.drw-set-input {',
         '  width: 56px; height: 28px; text-align: center;',
         '  border: 1px solid var(--dsw-alias-border-l2, var(--dsw-alias-border-strong, rgba(128,128,128,0.35)));',
@@ -343,16 +361,36 @@ window.__ModuleLoader__.load({
     // ---- one think (reasoning) row inside the slide -------------------------
     // A compact single-line row, collapsible to the full reasoning text — the
     // same look and feel as a tool-call row (think and tool calls are both
-    // "implementation" and should read the same inside the window).
+    // "implementation" and should read the same inside the window). While the
+    // block is still streaming the row auto-expands and the body pins to the
+    // latest line; when it settles the row folds back to its one-line summary.
+    // The head stays a static first-line summary the whole time, so the only
+    // moving part during a stream is the expanding body — one visual focus.
     function ThinkRow(props) {
       var text = props.text
       var index = props.index
+      var streaming = props.streaming === true
       var openState = React.useState(false)
       var open = openState[0]
       var setOpen = openState[1]
+      var bodyRef = React.useRef(null)
       var firstLine = text.split('\n')[0].trim() || text.trim()
       var summary = firstLine.length > 120 ? firstLine.slice(0, 117) + '…' : firstLine
-      return React.createElement('div', { className: 'drw-think', 'data-open': open ? '1' : undefined },
+      // Live streaming: auto-expand while streaming, fold back once settled.
+      React.useEffect(function () {
+        if (streaming) setOpen(true)
+        else setOpen(false)
+      }, [streaming])
+      // While streaming, keep the body pinned to the latest line.
+      React.useEffect(function () {
+        if (!open || !bodyRef.current) return
+        if (streaming) bodyRef.current.scrollTop = bodyRef.current.scrollHeight
+      })
+      return React.createElement('div', {
+        className: 'drw-think',
+        'data-open': open ? '1' : undefined,
+        'data-streaming': streaming ? '1' : undefined,
+      },
         React.createElement('div', {
           className: 'drw-think-head', role: 'button', tabIndex: 0,
           'aria-expanded': open || undefined,
@@ -364,7 +402,7 @@ window.__ModuleLoader__.load({
           React.createElement('span', { className: 'drw-think-toggle', 'aria-hidden': true }, open ? '\u25BE' : '\u25B8'),
         ),
         open
-          ? React.createElement('pre', { className: 'drw-think-body' }, text)
+          ? React.createElement('pre', { ref: bodyRef, className: 'drw-think-body' }, text)
           : null,
       )
     }
@@ -382,6 +420,7 @@ window.__ModuleLoader__.load({
       var openFile = props.openFile
       var inspectCall = props.inspectCall
       var cfg = props.config
+      var streamingThink = props.streamingThink || null
       var lines = useLiveLines() // live window size from Settings
       var toolItems = items.filter(function (it) { return it.kind === 'tool' })
       var reasoningCount = items.reduce(function (acc, it) { return it.kind === 'think' ? acc + 1 : acc }, 0)
@@ -393,10 +432,27 @@ window.__ModuleLoader__.load({
       var setOpen = openState[1]
       var bodyRef = React.useRef(null)
       var running = stats.running > 0
-      // Auto-follow to the bottom while calls are still running.
+      // Streaming detection depends on the mode:
+      //   'in'  — a think block inside the box is still streaming (the row
+      //           auto-expands and the slide is forced open so the live
+      //           reasoning stays readable);
+      //   'out' — the live tail is streaming OUTSIDE the slide (native row)
+      //           and folds in when settled; the slide is forced open so the
+      //           fold-in is visible.
+      // In both cases streaming overrides `collapsed`, then the user's
+      // collapsed setting is restored (Q7).
+      var mode = cfg.liveStreamThink
+      var streaming = mode === 'in'
+        ? items.some(function (it) { return it.kind === 'think' && it.streaming === true })
+        : mode === 'out'
+          ? streamingThink !== null
+          : false
+      var effectiveOpen = open || streaming
+      // Auto-follow to the bottom while calls are still running or a think is
+      // still streaming.
       React.useEffect(function () {
-        if (!open || !bodyRef.current) return
-        if (running) bodyRef.current.scrollTop = bodyRef.current.scrollHeight
+        if (!effectiveOpen || !bodyRef.current) return
+        if (running || streaming) bodyRef.current.scrollTop = bodyRef.current.scrollHeight
       })
       var list = items
       if (!cfg.showReadOnly) {
@@ -405,10 +461,10 @@ window.__ModuleLoader__.load({
         })
       }
       var thinkSeen = 0
-      return React.createElement('div', { className: 'drw-slide', 'data-running': running ? '1' : undefined },
+      return React.createElement('div', { className: 'drw-slide', 'data-running': running || streaming ? '1' : undefined },
         React.createElement('div', {
           className: 'drw-head', role: 'button', tabIndex: 0,
-          'aria-expanded': open || undefined,
+          'aria-expanded': effectiveOpen || undefined,
           onClick: function () { setOpen(!open) },
           onKeyDown: function (e) { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setOpen(!open) } },
         },
@@ -416,6 +472,9 @@ window.__ModuleLoader__.load({
             stats.total + ' 个工具调用'
               + (reasoningCount > 0 ? ' · ' + reasoningCount + ' Think' : '')
           ),
+          streaming
+            ? React.createElement('span', { className: 'drw-head-badge', 'data-state': 'running' }, '思考中')
+            : null,
           running
             ? React.createElement('span', { className: 'drw-head-badge', 'data-state': 'running' }, '进行中')
             : null,
@@ -425,18 +484,23 @@ window.__ModuleLoader__.load({
           !cfg.showReadOnly && stats.readOnly > 0
             ? React.createElement('span', { className: 'drw-head-badge' }, '隐藏只读 ' + stats.readOnly)
             : null,
-          React.createElement('span', { className: 'drw-head-toggle' }, open ? '收起 ▴' : '展开 ▾'),
+          React.createElement('span', { className: 'drw-head-toggle' }, effectiveOpen ? '收起 ▴' : '展开 ▾'),
         ),
         React.createElement('div', {
           ref: bodyRef,
-          className: 'drw-body' + (open ? '' : ' drw-collapsed'),
-          style: open && lines > 0 ? { maxHeight: (lines * 1.55) + 'em' } : undefined,
+          className: 'drw-body' + (effectiveOpen ? '' : ' drw-collapsed'),
+          style: effectiveOpen && lines > 0 ? { maxHeight: (lines * 1.55) + 'em' } : undefined,
         },
           list.map(function (it) {
             if (it.kind === 'think') {
               var tid = thinkSeen
               thinkSeen += 1
-              return React.createElement(ThinkRow, { key: 'think-' + tid, text: it.text, index: tid })
+              return React.createElement(ThinkRow, {
+                key: 'think-' + tid,
+                text: it.text,
+                index: tid,
+                streaming: it.streaming === true,
+              })
             }
             return React.createElement(SimpleToolRow, {
               key: it.node.key,
@@ -469,12 +533,13 @@ window.__ModuleLoader__.load({
       var current = null
       function ensure() {
         if (current === null) {
-          current = { items: [], tools: [], startKey: null }
+          current = { items: [], tools: [], startKey: null, streamingThink: null }
           segments.push(current)
         }
         return current
       }
       function closeSegment() { current = null }
+      var mode = currentConfig.liveStreamThink
       for (var i = 0; i < order.length; i++) {
         var n = chat.nodes.get(order[i])
         if (n === undefined) continue
@@ -482,13 +547,29 @@ window.__ModuleLoader__.load({
         if (n.kind === 'assistant-step') {
           var blocks = n.data && Array.isArray(n.data.blocks) ? n.data.blocks : []
           var staged = hasVisibleTextBlock(blocks)
-          // The reasoning of this step belongs to the chunk leading up to the
-          // staged response (i.e. the segment that ends here), and it keeps its
-          // exact output position among the tools.
+          // While a step is running, its LAST reasoning block is the live
+          // streaming tail — the exact rule the native ReasoningRow uses
+          // (`running: streaming && i === last`).
+          //   mode 'out': the tail streams OUTSIDE the slide (native row) and
+          //               folds in once settled — recorded as streamingThink.
+          //   mode 'in' : the tail stays INSIDE the box, tagged `streaming` so
+          //               the row auto-expands and shows live progress.
+          //   mode 'off': no streaming behavior, always folded.
+          var stepRunning = !!n.data && n.data.status === 'running'
+          var lastIdx = blocks.length - 1
           for (var b = 0; b < blocks.length; b++) {
             var block = blocks[b]
             if (block && block.kind === 'reasoning' && typeof block.text === 'string' && block.text.trim() !== '') {
-              ensure().items.push({ kind: 'think', text: block.text })
+              if (mode === 'out' && stepRunning && b === lastIdx) {
+                ensure().streamingThink = { text: block.text, nodeKey: n.key }
+              } else {
+                ensure().items.push({
+                  kind: 'think',
+                  text: block.text,
+                  nodeKey: n.key,
+                  streaming: mode === 'in' && stepRunning && b === lastIdx,
+                })
+              }
             }
           }
           if (staged) closeSegment()
@@ -554,6 +635,7 @@ window.__ModuleLoader__.load({
           cwd: cwd,
           openFile: openFile,
           inspectCall: inspectCall,
+          streamingThink: seg.streamingThink || null,
           config: currentConfig,
         })
       } catch (e) {
@@ -658,7 +740,15 @@ window.__ModuleLoader__.load({
           if (isSegmentBoundary(next)) break
           if (next.querySelector && next.querySelector('.drw-slide')) { hasSlide = true; break }
         }
-        if (hasSlide) think.dataset.drwHidethink = '1'
+        if (hasSlide) {
+          // In 'out' mode the streaming think tail lives OUTSIDE the box
+          // (native row) until it settles: keep it visible while
+          // `data-streaming` is present, then fold it in (hide) the moment the
+          // stream is gone. In 'in'/'off' modes the native row is always
+          // hidden — the box renders the same content.
+          var streamingOut = currentConfig.liveStreamThink === 'out' && !!think.closest('[data-streaming]')
+          if (!streamingOut) think.dataset.drwHidethink = '1'
+        }
         else if (think.dataset.drwHidethink) delete think.dataset.drwHidethink
       }
     }
@@ -711,34 +801,64 @@ window.__ModuleLoader__.load({
     }
 
     // ---- Settings row: response window size ---------------------------------
+    var STREAM_MODES = [
+      { value: 'off', label: '关闭' },
+      { value: 'in', label: '盒内' },
+      { value: 'out', label: '出盒' },
+    ]
     function ResponseWindowSettingsRow(props) {
       var useLines = props.useLines
       var setLines = props.setLines
+      var useLiveStreamThink = props.useLiveStreamThink
+      var setLiveStreamThink = props.setLiveStreamThink
       var lines = (typeof useLines === 'function' ? useLines(function (s) { return s }) : null) ?? currentConfig.lines
       var value = clampLines(lines)
       var step = function (delta) {
         setLines(value + delta)
       }
-      return React.createElement('div', { className: 'drw-set-row' },
-        React.createElement('div', { className: 'drw-set-text' },
-          React.createElement('div', { className: 'drw-set-title' }, '响应窗口大小（行数）'),
-          React.createElement('div', { className: 'drw-set-desc' }, '每个响应 slide 的限高滚动窗口。默认 10 行，0 = 不限高，改动即时生效。'),
+      var liveStreamThink = (typeof useLiveStreamThink === 'function' ? useLiveStreamThink(function (s) { return s }) : null) ?? currentConfig.liveStreamThink
+      var pickMode = function (mode) {
+        if (typeof setLiveStreamThink === 'function') setLiveStreamThink(mode)
+      }
+      return React.createElement(React.Fragment, null,
+        React.createElement('div', { className: 'drw-set-row' },
+          React.createElement('div', { className: 'drw-set-text' },
+            React.createElement('div', { className: 'drw-set-title' }, '响应窗口大小（行数）'),
+            React.createElement('div', { className: 'drw-set-desc' }, '每个响应 slide 的限高滚动窗口。默认 10 行，0 = 不限高，改动即时生效。'),
+          ),
+          React.createElement('div', { className: 'drw-set-control' },
+            React.createElement('button', {
+              type: 'button', className: 'drw-set-btn', 'aria-label': '减小窗口',
+              disabled: value <= 0,
+              onClick: function () { step(-1) },
+            }, '−'),
+            React.createElement('input', {
+              type: 'number', className: 'drw-set-input', min: 0, max: 200, step: 1, value: String(value),
+              onChange: function (e) { setLines(e.target.value) },
+            }),
+            React.createElement('button', {
+              type: 'button', className: 'drw-set-btn', 'aria-label': '增大窗口',
+              disabled: value >= 200,
+              onClick: function () { step(1) },
+            }, '+'),
+          ),
         ),
-        React.createElement('div', { className: 'drw-set-control' },
-          React.createElement('button', {
-            type: 'button', className: 'drw-set-btn', 'aria-label': '减小窗口',
-            disabled: value <= 0,
-            onClick: function () { step(-1) },
-          }, '−'),
-          React.createElement('input', {
-            type: 'number', className: 'drw-set-input', min: 0, max: 200, step: 1, value: String(value),
-            onChange: function (e) { setLines(e.target.value) },
-          }),
-          React.createElement('button', {
-            type: 'button', className: 'drw-set-btn', 'aria-label': '增大窗口',
-            disabled: value >= 200,
-            onClick: function () { step(1) },
-          }, '+'),
+        React.createElement('div', { className: 'drw-set-row' },
+          React.createElement('div', { className: 'drw-set-text' },
+            React.createElement('div', { className: 'drw-set-title' }, '流式思考显示'),
+            React.createElement('div', { className: 'drw-set-desc' }, '出盒：思考在 slide 外实时显示，结束后收进 slide 折叠；盒内：在 slide 内自动展开实时滚动；关闭：think 全程保持折叠。'),
+          ),
+          React.createElement('div', { className: 'drw-set-control' },
+            STREAM_MODES.map(function (m) {
+              return React.createElement('button', {
+                key: m.value,
+                type: 'button',
+                className: 'drw-set-btn' + (liveStreamThink === m.value ? ' drw-set-on' : ''),
+                'aria-pressed': liveStreamThink === m.value,
+                onClick: function () { pickMode(m.value) },
+              }, m.label)
+            }),
+          ),
         ),
       )
     }
@@ -754,6 +874,7 @@ window.__ModuleLoader__.load({
       // Durable settings binding: the host half registered the `dsh-newbe-response-window`
       // namespace; the browser scope mirrors it and persists user overrides.
       linesStore = createSnapshotStore(currentConfig.lines)
+      liveStreamThinkStore = createSnapshotStore(currentConfig.liveStreamThink)
       var scopeService = null
       try { scopeService = ctx.get('settingsScope') } catch (e) { scopeService = null }
       if (scopeService && typeof scopeService.bind === 'function') {
@@ -772,6 +893,15 @@ window.__ModuleLoader__.load({
               var n = clampLines(value.lines)
               if (linesStore !== null && linesStore.getSnapshot() !== n) linesStore.set(n)
             }
+            // liveStreamThink is stored as 'off' | 'in' | 'out'; tolerate
+            // legacy boolean rows (true → 'in', false → 'off').
+            if (value && value.liveStreamThink !== undefined) {
+              var v = normalizeLiveStreamThink(value.liveStreamThink, currentConfig.liveStreamThink)
+              if (liveStreamThinkStore !== null && liveStreamThinkStore.getSnapshot() !== v) {
+                liveStreamThinkStore.set(v)
+                currentConfig.liveStreamThink = v
+              }
+            }
           } catch (e) {}
         }
         settingsScope.subscribe(adopt)
@@ -796,7 +926,8 @@ window.__ModuleLoader__.load({
         }, TextWindowDock)
       })
 
-      // Settings → General row for the window size (live, persisted).
+      // Settings → General rows (window size + live-stream think, both live
+      // and persisted).
       ctx.slots.inject('settings.general.item', function () {
         return ctx.slots.register({
           name: 'settings.general.item',
@@ -804,7 +935,7 @@ window.__ModuleLoader__.load({
           order: 60,
           inject: function () {
             return {
-              hooks: { lines: linesStore },
+              hooks: { lines: linesStore, liveStreamThink: liveStreamThinkStore },
               setLines: function (value) {
                 var n = clampLines(value)
                 if (linesStore !== null) linesStore.set(n)
@@ -812,6 +943,14 @@ window.__ModuleLoader__.load({
                   settingsScope.set('lines', n).catch(function () {})
                 }
               },
+              setLiveStreamThink: function (value) {
+                var v = normalizeLiveStreamThink(value, currentConfig.liveStreamThink)
+                if (liveStreamThinkStore !== null) liveStreamThinkStore.set(v)
+                currentConfig.liveStreamThink = v
+                if (settingsScope !== null) {
+                  settingsScope.set('liveStreamThink', v).catch(function () {})
+                }
+              },
             }
           },
         }, ResponseWindowSettingsRow)

package/lib/index.js

@@ -10,7 +10,12 @@
 //   collapsed         start slides collapsed instead of always-expanded
 //   showReadOnly      include read-only tools in the slide list
 //   minCollapseRows   min tool-call count for auto-collapse (collapsed mode)
-//
+//   liveStreamThink   how a streaming think block is shown:
+//                     'off' — always folded into a one-line summary
+//                     'in'  — auto-expand inside the slide, live scroll
+//                     'out' — stream outside the slide (native row), then
+//                             fold into the slide once settled (default 'out')
+
 // `settingsNamespace()` is just a validated string (kebab-case pattern); the
 // namespace below already matches, so we pass the raw string and avoid an extra
 // host dependency.
@@ -29,6 +34,7 @@ export const Config = z.object({
   collapsed: z.boolean().default(false),
   showReadOnly: z.boolean().default(true),
   minCollapseRows: z.natural().min(1).max(50).default(3),
+  liveStreamThink: z.string().default('out'),
 })
 
 /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-newbe-response-window",
-  "version": "0.2.0",
-  "description": "DeepSeek Harness (DSH) web plugin: per-turn response window. Each turn's tool calls collapse into ONE always-expanded bounded slide (configurable N-line window, inner scroll, nothing hidden), and long assistant markdown gets a bounded scroll window too — Grok-build style, keeps every intermediate response visible inside a finite window.",
+  "version": "0.3.0",
+  "description": "DeepSeek Harness (DSH) web plugin: per-turn response window. Each turn's tool calls collapse into ONE always-expanded bounded slide (configurable N-line window, inner scroll, nothing hidden), and long assistant markdown gets a bounded scroll window too — Grok-build style, keeps every intermediate response visible inside a finite window. Streaming think blocks can live-stream outside the slide and fold in when settled (or auto-expand inside), switchable via Settings.",
   "type": "module",
   "main": "lib/index.js",
   "exports": {