@ash-qw/dsh-theme-prts 2.1.1 → 2.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ash-qw/dsh-theme-prts",
-  "version": "2.1.1",
+  "version": "2.3.0",
   "private": false,
   "type": "module",
   "description": "Unofficial Arknights P.R.T.S.-inspired UI theme for DeepSeek Harness Web and the official desktop client",
@@ -75,7 +75,7 @@
     "@playwright/test": "1.55.1",
     "esbuild": "^0.28.2",
     "jsdom": "24.1.3",
-    "markdown-it": "^14.3.2"
+    "markdown-it": "^14.3.3"
   },
   "dependencies": {
     "@deepseek-ai/schemastery": "~3.18.4",

package/src/client/conversation-control-adapter.js

@@ -14,6 +14,8 @@ function closestWithClassSuffix(node, suffix) {
 function classify(button, operation) {
   // The host's process disclosure owns its transparent, full-width hit area.
   if (button.hasAttribute('data-turn-process')) return null
+  // Notification headers belong to the card surface, not standalone buttons.
+  if (button.parentElement?.matches('[data-turn-trigger]')) return null
   // Changed-file cards own one outer surface; their header and rows stay native.
   if (button.closest('[data-changed-files]')) return null
   // File previews are transparent hit targets; the enclosing card owns its material and outline.

package/src/client/custom-background.js

@@ -63,7 +63,7 @@ export function createBackgroundStore({ window, document }) {
     },
   }
 }
-export function backgroundMarkup() {
+export function backgroundMarkup(heroContrastControl = '') {
   return `<section data-prts-background-settings>
     <header><strong>会话背景</strong><small>分区使用不同图片，或让一张完整背景贯穿侧边栏与正文。</small></header>
     <div data-prts-background-modes role="group" aria-label="背景模式">
@@ -75,6 +75,7 @@ export function backgroundMarkup() {
       <input type="file" data-prts-background-file="${slot}" accept="image/png,image/jpeg,image/webp,image/avif" hidden>
     </article>`).join('')}</div>
     <label data-prts-background-shade hidden><span>背景淡化 <output></output></span><input type="range" min="0" max="90" step="5" aria-label="背景淡化程度"><small>调高后背景更淡，接近当前主题底色。</small></label>
+    <div data-prts-background-hero-setting hidden>${heroContrastControl}</div>
     ${opacityDialMarkup()}
     <small data-prts-background-help>支持 PNG / JPEG / WebP / AVIF · 最大 10 MB<br>图片居中铺满，切换模式保留素材，并在当前 DSH 实例同步。</small><p data-prts-background-status role="status"></p>
   </section>`

package/src/client/index.js

@@ -1,3 +1,4 @@
+import { createThemeTransfer } from './theme-transfer.js'
 import { createBackgroundStore } from './custom-background.js'
 import { createNativePreferences } from './native-preferences.js'
 import { createComposerGlassSurface } from './composer-glass-surface.js'
@@ -91,6 +92,7 @@ export function applyPrtsPlugin(ctx, environment) {
     cssText,
     service: themeService,
     cursorAssets: assets.cursor,
+    onSchemeChange() { particleField.repaintScheme() },
     onTransitionStateChange(active) {
       particleField.setSchemeTransitionActive(active)
     },
@@ -111,6 +113,7 @@ export function applyPrtsPlugin(ctx, environment) {
   const adapter = createRc7Adapter({ document })
   const hostGeometry = createHostGeometryAdapter({ document, window })
   const connection = contextService(ctx, 'connection')
+  let themeTransfer
   let operations
   let mountObserver
   let mountFrame
@@ -201,6 +204,9 @@ export function applyPrtsPlugin(ctx, environment) {
     if (!themeAlreadyApplied) theme.apply(preferences)
     operations ||= createOperationsShell({
       document, window, assets, adapter, hostGeometry, customEmblemStore, avatarStore, backgroundStore,
+      themeTransfer: themeTransfer ||= createThemeTransfer({ window, getPreferences: () => nativePreferences.value,
+        savePreferences: (value, revision) => nativePreferences.replace(value, revision),
+        checkWritable: () => nativePreferences.checkWritable(), checkExport: () => nativePreferences.checkReadable(), themeVersion: version }),
       onSchemeToggle(next, interaction) {
         return theme.setTheme(next, { ...interaction, animate: true })
       },
@@ -347,6 +353,7 @@ export function applyPrtsPlugin(ctx, environment) {
   } else {
     applyVisualState()
   }
+  const stopBackgroundRedraw = backgroundStore.subscribe(() => { if (!safeMode) particleField.update(preferences) })
   const bindNativePreferences = settingsCtx => {
     const forms = contextService(settingsCtx, 'configForms')
     if (forms) settingsCtx.effect(() => nativePreferences.bind(forms.get('theme-prts')))
@@ -359,6 +366,7 @@ export function applyPrtsPlugin(ctx, environment) {
     statusSource.dispose()
     customEmblemStore.dispose()
     avatarStore.dispose()
+    stopBackgroundRedraw()
     backgroundStore.dispose()
     particleField.dispose()
     startup.dispose({ restoreFocus: false })

package/src/client/native-preferences.js

@@ -69,6 +69,37 @@ export function createNativePreferences({ storage, onChange }) {
   }
   return {
     get value() { return current },
+    checkReadable() {
+      const s = snapshot()
+      if (disposed || s?.status !== 'ready') throw Error('请等待 DSH 设置加载完成')
+      if (busy || Object.keys(pending).length || Object.keys(failed).length) throw Error('请先等待当前设置保存成功')
+      return s.revision
+    },
+    checkWritable() {
+      const revision = this.checkReadable()
+      if (!writable(snapshot())) throw Error('当前连接无法保存主题设置')
+      return revision
+    },
+    async replace(next, expectedRevision) {
+      this.checkWritable()
+      const s = snapshot()
+      if (s.revision !== expectedRevision) throw Error('设置已在其他页面更新，请重新导入')
+      const normalized = normalizePreferences(next)
+      busy = true
+      phase = 'saving'; emit()
+      try {
+        const ops = Object.entries(normalized).map(([key, value]) => ({ op: 'set', path: [key], value }))
+        ops.push({ op: 'set', path: ['preferencesInitialized'], value: true })
+        if (await form.mutate(ops, s.revision) !== true) throw Error('DSH 未接受导入设置，请重试')
+        phase = 'saved'
+      } catch (error) {
+        phase = 'error'
+        throw error
+      } finally {
+        busy = false
+        receive()
+      }
+    },
     bind(next) {
       unsubscribe?.(); form = next
       unsubscribe = form.subscribe(receive)

package/src/client/operations-shell-v2.js

@@ -46,7 +46,7 @@ export function createOperationsShell({
   onSchemeToggle = () => {},
   onSchemeDragStart = () => undefined,
   onThemeDisable = () => {},
-  customEmblemStore, avatarStore, backgroundStore,
+  customEmblemStore, avatarStore, backgroundStore, themeTransfer,
   onPreferenceChange = () => {},
   onPreferencePreview = () => {},
   onVisualReset = () => {},
@@ -481,7 +481,7 @@ export function createOperationsShell({
       trigger: shell.querySelector('[data-prts-rail-brand]'),
       panel: shell.querySelector('[data-prts-theme-settings]'),
       backdrop: shell.querySelector('[data-prts-settings-backdrop]'),
-      customEmblemStore, avatarStore, backgroundStore,
+      customEmblemStore, avatarStore, backgroundStore, themeTransfer,
       onPreferenceChange,
       onPreferencePreview,
       onResetVisual: onVisualReset,

package/src/client/particle-field-adapter.js

@@ -432,7 +432,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
   const densityProfile = density => PARTICLE_DENSITY_PROFILES[density] ?? PARTICLE_DENSITY_PROFILES.standard
   const particleRadius = density => densityProfile(density ?? activeDensity()).radius
   const fieldEnabled = () => heroActive || (preferences.conversationStyle !== 'deck-chat' && preferences.conversationEmblem !== false)
-  const canRenderFrame = () => fieldEnabled() && !disposed && documentVisible && canvasVisible && !hydrationPaused && !startupPaused && !schemeTransitionPaused && !resizing
+  const canRenderFrame = (paintOnly = false) => fieldEnabled() && !disposed && documentVisible && canvasVisible && !hydrationPaused && !startupPaused && (paintOnly || !schemeTransitionPaused) && !resizing
   const layoutWidth = () => width
   const layoutHeight = () => height
   const layoutShiftX = () => 0
@@ -1134,12 +1134,25 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
     resizeTimer = window.setTimeout?.(finishResizeTransaction, RESIZE_SETTLE_MS)
   }
 
+  function resizeHeroTransition(nextSize) {
+    // Keep live positions and velocities; the spring follows the new destination.
+    // Snapping to particle.target here would restore the old hero mid-explosion.
+    clearResizeState()
+    pointerActive = false
+    resizeCommits += applyFieldSize(nextSize) ? 1 : 0
+  }
+
   function onOperationResize(entries = []) {
     if (!operation || !canvas) return
     resizeObservations += 1
     const entry = entries.find(candidate => candidate.target === operation) ?? entries[0]
     const contentRect = entry?.contentRect
     pendingResizeSize = contentRect ? sizeFromRect(contentRect) : readOperationSize()
+    if (transition?.fromHero && !phoneStatic()) {
+      resizeHeroTransition(pendingResizeSize)
+      updateFrameGate()
+      return
+    }
     if (phoneStatic()) {
       const nextSize = pendingResizeSize
       clearResizeState()
@@ -1289,21 +1302,30 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
     if (queuedDensity !== undefined && (queuedDensity !== particles.length || force)) startDensityReassembly(queuedDensity, force)
   }
 
-  function draw(timestamp) {
+  function heroContrastStrength() {
+    const root = document.documentElement
+    const imageVisible = preferences.backgroundMode === 'full'
+      ? root.hasAttribute('data-prts-background-full')
+      : preferences.backgroundMode === 'split' && root.hasAttribute('data-prts-background-conversation')
+    if (preferences.heroContrast === false || !imageVisible) return 0
+    return heroActive ? 1 : transition?.fromHero ? 1 - easeInOut(transition.progress) : 0
+  }
+
+  function draw(timestamp, paintOnly = false) {
     frame = undefined
     if (!ambient || !canvas) return
-    if (!canRenderFrame()) return
+    if (!canRenderFrame(paintOnly)) return
     if (geometryDirty) {
       syncCanvasBackingStore()
       geometryDirty = false
     }
-    if (transition) {
+    if (transition && !paintOnly) {
       transitionStartedAt ??= timestamp
       transition.progress = clamp((timestamp - transitionStartedAt) / TRANSITION_MS, 0, 1)
       if (transition.progress >= 1) completeTransition()
     }
 
-    advanceDensity(timestamp)
+    if (!paintOnly) advanceDensity(timestamp)
     const reducedMotion = motionReduced()
     const staticPhone = phoneStatic()
     const staticField = reducedMotion || staticPhone
@@ -1322,7 +1344,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
     }
     const frameGeometry = { activeLayout, staticField, transitionLayout }
     const { center, size: fieldSize } = activeLayout
-    const follow = reducedMotion ? 1 : 0.035
+    const follow = paintOnly ? 0 : reducedMotion ? 1 : 0.035
     glowX += (center.x - glowX) * follow
     glowY += (center.y - glowY) * follow
     if (glow) glow.style.transform = 'translate3d(calc(' + glowX.toFixed(2) + 'px - 50%), calc(' + glowY.toFixed(2) + 'px - 50%), 0)'
@@ -1337,19 +1359,31 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
       const damping = heroPhysics ? 0.86 : 0.84
       const pointerForce = heroPhysics ? 2.2 : 2.7
       const lightScheme = document.documentElement.dataset.prtsScheme === 'light'
-      const baseAlpha = lightScheme ? 0.66 : 0.72
-      const radiusScale = lightScheme ? 1.12 : 1
+      const contrast = heroContrastStrength()
+      if (contrast > 0 && context.createRadialGradient) {
+        const origin = heroActive ? center : transition.fromCenter
+        const radius = (heroActive ? fieldSize : transition.fromSize) * .78
+        const shade = lightScheme ? '248,250,252' : '7,14,22'
+        const gradient = context.createRadialGradient(origin.x, origin.y, 0, origin.x, origin.y, radius)
+        gradient.addColorStop(0, `rgba(${shade},${.58 * contrast})`)
+        gradient.addColorStop(.42, `rgba(${shade},${.42 * contrast})`)
+        gradient.addColorStop(1, `rgba(${shade},0)`)
+        context.fillStyle = gradient
+        context.fillRect(origin.x - radius, origin.y - radius, radius * 2, radius * 2)
+      }
+      const baseAlpha = (lightScheme ? 0.66 : 0.72) + .16 * contrast
+      const radiusScale = (lightScheme ? 1.12 : 1) * (1 + .08 * contrast)
       const particleBatches = typeof context.moveTo === 'function' ? new Map() : null
 
       for (const particle of particles) {
         const target = targetPosition(particle, frameGeometry)
-        if (staticField) {
+        if (staticField && !paintOnly) {
           particle.x = target.x
           particle.y = target.y
           particle.vx = 0
           particle.vy = 0
         }
-        if (!staticField) {
+        if (!staticField && !paintOnly) {
           particle.vx += (target.x - particle.x) * spring
           particle.vy += (target.y - particle.y) * spring
 
@@ -1412,6 +1446,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
       canvas.setAttribute('data-prts-particle-ready', '')
       canvas.style.visibility = ''
     }
+    if (paintOnly) return
     const explicitMotion = Boolean(densityTransition || transition)
     const animatedField = !staticField && context && particles.length
     if (explicitMotion) {
@@ -1550,7 +1585,15 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
     }
     transitionStartedAt = undefined
     pointerActive = false
-    scheduleFrame()
+    // The initial message may have paused hydration before syncHeroState ran.
+    // Let this short exit finish uninterrupted by subsequent response updates.
+    cancelHydrationResume()
+    hydrationPaused = false
+    mutationBurstScore = 0
+    if (mutationBurstTimer !== undefined) window.clearTimeout?.(mutationBurstTimer)
+    mutationBurstTimer = undefined
+    if (pendingResizeSize) resizeHeroTransition(pendingResizeSize)
+    updateFrameGate()
   }
 
   function syncHeroState() {
@@ -1612,7 +1655,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
   }
 
   function registerContentMutations(mutations) {
-    if (!fieldEnabled() || phoneStatic()) return
+    if (!fieldEnabled() || phoneStatic() || transition?.fromHero) return
     let weight = mutations.length
     for (const mutation of mutations) {
       for (const node of [...mutation.addedNodes, ...mutation.removedNodes]) {
@@ -1780,6 +1823,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
     if (context && particles.length) {
       syncCanvasBackingStore()
       geometryDirty = false
+      cancelFrame()
       draw(Number(window.performance?.now?.()) || 0)
     } else {
       canvas.setAttribute('data-prts-particle-ready', '')
@@ -1847,6 +1891,11 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
       startupPaused = next
       updateFrameGate()
     },
+    repaintScheme() {
+      cancelFrame()
+      draw(Number(window.performance?.now?.()) || 0, true)
+      if (!schemeTransitionPaused) scheduleFrame()
+    },
     setSchemeTransitionActive(active) {
       const next = Boolean(active)
       if (schemeTransitionPaused === next) return
@@ -1888,10 +1937,13 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
 
       findMount()
       if (!fieldEnabled()) resetTraversal()
-      const previousActiveDensity = heroActive
+      const previousRequestedDensity = heroActive
         ? previousPreferences.heroParticleDensity
         : previousPreferences.conversationParticleDensity
-      const activeDensityChanged = previousActiveDensity !== undefined && previousActiveDensity !== activeDensity()
+      // Compare effective densities on both sides: sparse/light hero settings
+      // already render at standard density, including after a focus refresh.
+      const previousActiveDensity = heroActive ? effectiveHeroDensity(previousRequestedDensity) : previousRequestedDensity
+      const activeDensityChanged = previousRequestedDensity !== undefined && previousActiveDensity !== activeDensity()
       reportState({ requestedPattern: 'orthogonal' })
       if (particles.length && activeDensityChanged) scheduleDensityReassembly(targetParticleCount(), true)
       if (preservedTraversalCoordinate !== undefined && scroller && !heroActive) reanchorTraversal(preservedTraversalCoordinate)
@@ -1929,6 +1981,7 @@ export function createParticleFieldAdapter({ document, window, emblem = '', embl
         enabled: fieldEnabled(),
         mounted: Boolean(ambient?.isConnected && canvas?.isConnected),
         hero: heroActive,
+        heroContrast: heroContrastStrength(),
         side,
         emblemKey: (heroActive || transition?.fromHero ? heroEmblem() : emblemForSegment(segment))?.key,
         nextEmblemKey: transition ? emblemForSegment(transition.targetSegment)?.key : null,

package/src/client/preferences.js

@@ -27,6 +27,7 @@ export const DEFAULT_PREFERENCES = Object.freeze({
   composerGlass: false,
   backgroundMode: 'off',
   backgroundDim: .45,
+  heroContrast: true,
   sidebarOpacity: .06,
   railOpacity: .3,
   bakerOpacity: .5,
@@ -42,7 +43,9 @@ export const DEFAULT_PREFERENCES = Object.freeze({
   particlePattern: 'orthogonal',
   railDefaultHidden: false,
   sessionPreview: true,
+  aiToolsEnabled: true,
   previewOngoing: true,
+  previewTools: true,
   previewWarning: true,
   previewDone: true,
   previewFollowOngoing: true,
@@ -97,11 +100,12 @@ export const PARTICLE_DETAIL_LEVELS = Object.freeze({
   precise: Object.freeze({ conversationParticleDensity: 'dense', heroParticleDensity: 'ultra' }),
 })
 export const PREFERENCE_GROUPS = Object.freeze({
-  background: Object.freeze(['texture', 'backgroundMode', 'backgroundDim', 'sidebarOpacity', 'railOpacity', 'bakerOpacity', 'classicUserOpacity', 'sidebarBlur', 'railBlur', 'bakerBlur', 'classicUserBlur']),
+  background: Object.freeze(['texture', 'backgroundMode', 'backgroundDim', 'heroContrast', 'sidebarOpacity', 'railOpacity', 'bakerOpacity', 'classicUserOpacity', 'sidebarBlur', 'railBlur', 'bakerBlur', 'classicUserBlur']),
   particles: Object.freeze(['conversationParticleDensity', 'heroParticleDensity', 'particleTraversalSpeed']),
   material: Object.freeze(['glass', 'composerGlass']),
   accessibility: Object.freeze(['motion', 'bootAnimation', 'cursor']),
-  navigation: Object.freeze(['railDefaultHidden', 'sessionPreview', 'previewOngoing', 'previewWarning', 'previewDone', 'previewDoubleClick', 'previewFollowOngoing', 'previewFollowWarning', 'previewReplyLimit']),
+  aiTools: Object.freeze(['aiToolsEnabled']),
+  navigation: Object.freeze(['railDefaultHidden', 'sessionPreview', 'previewOngoing', 'previewTools', 'previewWarning', 'previewDone', 'previewDoubleClick', 'previewFollowOngoing', 'previewFollowWarning', 'previewReplyLimit']),
   conversation: Object.freeze(['sessionFlow', 'sessionGlow', 'sessionFlowPalette', 'sessionFlowColorBack', 'sessionFlowColorCore', 'sessionFlowColorFront', 'sessionFlowSpeed', 'conversationStyle', 'bakerGroupAvatars', 'bakerLoading', 'conversationEmblem']),
 })
 
@@ -217,6 +221,7 @@ export function normalizePreferences(value) {
     railBlur: materialBlurOr(input.railBlur, DEFAULT_PREFERENCES.railBlur),
     bakerBlur: materialBlurOr(input.bakerBlur, DEFAULT_PREFERENCES.bakerBlur),
     classicUserBlur: materialBlurOr(input.classicUserBlur, DEFAULT_PREFERENCES.classicUserBlur),
+    heroContrast: booleanOr(input.heroContrast, DEFAULT_PREFERENCES.heroContrast),
     backgroundDim: typeof input.backgroundDim === 'number' && Number.isFinite(input.backgroundDim) ? Math.min(.9, Math.max(0, input.backgroundDim)) : .45,
     composerGlass: booleanOr(input.composerGlass, DEFAULT_PREFERENCES.composerGlass),
     bootAnimation: booleanOr(input.bootAnimation, DEFAULT_PREFERENCES.bootAnimation),
@@ -237,7 +242,9 @@ export function normalizePreferences(value) {
     sessionFlowColorFront: sessionFlowColors.front,
     sessionFlowSpeed: sessionFlowSpeedOr(input.sessionFlowSpeed, DEFAULT_PREFERENCES.sessionFlowSpeed),
     sessionPreview: booleanOr(input.sessionPreview, DEFAULT_PREFERENCES.sessionPreview),
+    aiToolsEnabled: booleanOr(input.aiToolsEnabled, DEFAULT_PREFERENCES.aiToolsEnabled),
     previewOngoing: booleanOr(input.previewOngoing, DEFAULT_PREFERENCES.previewOngoing),
+    previewTools: booleanOr(input.previewTools, DEFAULT_PREFERENCES.previewTools),
     previewWarning: booleanOr(input.previewWarning, DEFAULT_PREFERENCES.previewWarning),
     previewDone: booleanOr(input.previewDone, DEFAULT_PREFERENCES.previewDone),
     previewReplyLimit: [0, 5, 10, '0', '5', '10'].includes(input.previewReplyLimit) ? Number(input.previewReplyLimit) : 5,

package/src/client/session-summary-preview.js

@@ -39,6 +39,60 @@ export function latestAssistantReply(snapshot) {
   return ''
 }
 
+// Call objects may be mutable on older hosts; compare raw arguments before reuse.
+const toolSummaryCache = new WeakMap()
+function toolSummary(call) {
+  const raw = call.argsRaw ?? call.call?.argsRaw ?? ''
+  const cached = toolSummaryCache.get(call)
+  if (cached?.raw === raw) return cached.text
+  let args
+  try { args = JSON.parse(raw) } catch {}
+  const summary = ['description', 'command', 'cmd', 'file_path', 'filePath', 'path', 'query', 'pattern', 'url']
+    .map(field => args?.[field]).find(value => typeof value === 'string' && value.trim())
+  const normalized = summary?.replace(/\s+/g, ' ').trim()
+  const text = normalized ? normalized.slice(0, 160) + (normalized.length > 160 ? '…' : '') : ''
+  toolSummaryCache.set(call, {raw, text})
+  return text
+}
+
+// Only calls after the latest settled prose belong to the current progress preview.
+export function previewToolCalls(snapshot) {
+  const turn = snapshot?.timeline?.turnOrder?.at(-1)
+  const order = snapshot?.order ?? []
+  const calls = [], seen = new Set()
+  const visit = (call, key) => {
+    if (!call) return
+    const id = call.callId ?? key
+    if (!seen.has(id)) { seen.add(id); calls.push({call, key: id}) }
+    for (const [index, child] of (call.subCalls ?? []).entries()) visit(child, key + ':' + index)
+  }
+  for (let i = order.length - 1; i >= 0; i--) {
+    const node = snapshot.nodes?.get?.(order[i])
+    if (['user', 'steering', 'turn-trigger'].includes(node?.kind)) break
+    if (turn !== undefined && node?.location?.turn?.turn !== turn) continue
+    if (node?.visibility === 'hidden') continue
+    if (node?.kind === 'assistant-step' && node.data?.status === 'settled'
+      && node.data.blocks?.some(block => block.kind === 'text' && block.text?.trim())) break
+    if (node?.kind === 'tool-call') visit(node.data?.root, order[i])
+  }
+  return calls.sort((a, b) => (b.call.callTime ?? b.call.time ?? 0) - (a.call.callTime ?? a.call.time ?? 0)).map(({call, key}) => {
+    const text = toolSummary(call)
+    return {
+      key,
+      name: call.name || call.call?.name || '工具调用',
+      status: call.kind === 'tool-result' ? call.isError ? '失败' : '已完成'
+        : call.phase === 'preparing' ? '准备中' : '执行中',
+      summary: text ? text
+        : call.phase === 'preparing' ? '正在准备调用…' : '暂无操作摘要',
+    }
+  })
+}
+
+export function latestToolCall(snapshot) {
+  const records = previewToolCalls(snapshot)
+  return records.length ? {...records[0], records} : undefined
+}
+
 export function completedPreviewReplies(snapshot) {
   const replies = []
   const latestTurn = snapshot?.timeline?.turnOrder?.at(-1)
@@ -142,8 +196,8 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
     active = undefined
     if (!old) return
     window.clearTimeout(old.leaveTimer)
-    window.clearTimeout(old.delay)
-    window.clearTimeout(old.refresh)
+    window.cancelAnimationFrame(old.delay)
+    window.cancelAnimationFrame(old.refresh)
     old.unsubscribe?.()
     old.unsubscribeStatus?.()
     if (keepWarm && old.reference && old.source) {
@@ -311,6 +365,39 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
       body.setAttribute('data-prts-preview-body', '')
       panel.querySelector('p').replaceWith(body)
     }
+    panel.querySelector('[data-prts-preview-tool]')?.remove()
+    const toolSection = panel.ownerDocument.createElement('div')
+    toolSection.setAttribute('data-prts-preview-tool', '')
+    toolSection.hidden = true
+    body.before(toolSection)
+    let previousTool, currentTool
+    const toolEntry = panel.ownerDocument.createElement('button')
+    toolEntry.type = 'button'
+    toolEntry.setAttribute('data-prts-tool-entry', '')
+    const toolHeading = panel.ownerDocument.createElement('small')
+    const toolName = panel.ownerDocument.createElement('span')
+    toolEntry.append(toolHeading, toolName)
+    toolSection.append(toolEntry)
+    const openToolDetail = (refresh = false) => {
+      if (currentTool) showDetail({key: 'latest-tool', tool: currentTool}, 0, toolEntry, refresh)
+    }
+    toolEntry.addEventListener('pointermove', () => openToolDetail())
+    toolEntry.addEventListener('focus', () => openToolDetail())
+    toolEntry.addEventListener('click', () => openToolDetail())
+    const renderTool = tool => {
+      const signature = JSON.stringify(tool)
+      if (signature === previousTool) return
+      previousTool = signature
+      currentTool = tool
+      toolSection.hidden = !tool
+      if (!tool) {
+        if (detailKey === 'latest-tool') hideDetail()
+        return
+      }
+      toolHeading.textContent = '工具 · ' + tool.status + ' · ' + tool.records.length + ' 次'
+      toolName.textContent = tool.name
+      if (detailKey === 'latest-tool') openToolDetail(true)
+    }
     const choices = panel.ownerDocument.createElement('div')
     choices.setAttribute('data-prts-preview-choices', '')
     panel.querySelector('[data-prts-preview-choices]')?.remove()
@@ -450,9 +537,9 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
       detailEntry?.removeAttribute('data-prts-reply-active')
       detailEntry = undefined
     }
-    const showDetail = (reply, index, item) => {
+    const showDetail = (reply, index, item, refresh = false) => {
       keep()
-      if (detailKey === reply.key && current.detail && !current.detail.hidden) return
+      if (!refresh && detailKey === reply.key && current.detail && !current.detail.hidden) return
       if (!current.detail) {
         const detail = panel.ownerDocument.createElement('section')
         detail.setAttribute('data-prts-summary-reply', '')
@@ -472,10 +559,36 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
       detailEntry?.removeAttribute('data-prts-reply-active')
       detailEntry = item
       item?.setAttribute('data-prts-reply-active', '')
-      detail.querySelector('strong').textContent = '回复 ' + (reply.ordinal ?? index + 1)
+      detail.toggleAttribute('data-prts-tool-history', Boolean(reply.tool))
+      detail.querySelector('strong').textContent = reply.tool ? '本段工具记录 · ' + reply.tool.records.length + ' 次' : '回复 ' + (reply.ordinal ?? index + 1)
       const content = detail.querySelector('[data-prts-preview-body]')
-      content.innerHTML = current.contentCache(reply.text).html
-      content.scrollTop = 0
+      const scrollTop = refresh ? content.scrollTop : 0
+      let anchorKey, anchorOffset
+      if (refresh && scrollTop > 0) {
+        const anchor = [...content.children].find(row => row.getBoundingClientRect().bottom > content.getBoundingClientRect().top)
+        anchorKey = anchor?.dataset.toolKey
+        anchorOffset = anchor?.getBoundingClientRect().top
+      }
+      if (reply.tool) {
+        content.replaceChildren(...reply.tool.records.map(record => {
+          const row = panel.ownerDocument.createElement('article')
+          row.setAttribute('data-prts-tool-record', '')
+          row.dataset.toolKey = record.key
+          const heading = panel.ownerDocument.createElement('div')
+          const name = panel.ownerDocument.createElement('b')
+          name.textContent = record.name
+          const status = panel.ownerDocument.createElement('small')
+          status.textContent = record.status
+          heading.append(name, status)
+          const summary = panel.ownerDocument.createElement('p')
+          summary.textContent = record.summary
+          row.append(heading, summary)
+          return row
+        }))
+      } else content.innerHTML = current.contentCache(reply.text).html
+      content.scrollTop = scrollTop
+      const retainedAnchor = anchorKey && [...content.children].find(row => row.dataset.toolKey === anchorKey)
+      if (retainedAnchor) content.scrollTop += retainedAnchor.getBoundingClientRect().top - anchorOffset
       detail.hidden = false
       const rect = panel.getBoundingClientRect()
       const width = Math.min(340, window.innerWidth - 16)
@@ -548,11 +661,18 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
         }))
       }
       choices.hidden = !labels.length
+      const tool = state === 'ongoing' && !question && getPreviewPreferences?.().previewTools !== false ? latestToolCall(source?.getSnapshot()) : undefined
+      renderTool(tool)
+      if (tool) label.textContent = '运行中 · 最新活动'
       panel.setAttribute('aria-label', title + '：' + label.textContent)
       if (state === 'ongoing' && source) {
         const replies = selectReplies(source.getSnapshot(), replyLimit())
-        if (replies === historyKeys) return
-        panel.toggleAttribute('data-prts-preview-empty', !replies.length)
+        panel.toggleAttribute('data-prts-preview-empty', !replies.length && !tool)
+        if (replies === historyKeys) {
+          const emptyText = tool ? '' : '正在处理…'
+          if (!replies.length && body.textContent !== emptyText) body.textContent = emptyText
+          return
+        }
         const previousTop = body.scrollTop
         const scrollAnchor = previousTop > 0 ? [...body.children].find(entry => entry.getBoundingClientRect().bottom > body.getBoundingClientRect().top) : undefined
         const anchorTop = scrollAnchor?.getBoundingClientRect().top
@@ -568,7 +688,7 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
           }
         }
         if (!historyKeys.length) body.replaceChildren()
-        if (!replies.length) body.textContent = '正在处理，等待本轮正文输出完成…'
+        if (!replies.length) body.textContent = tool ? '' : '正在处理…'
         for (let index = 0; index < replies.length; index++) {
           const reply = replies[index]
           if (retained.has(reply.key)) continue
@@ -580,6 +700,13 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
           item.setAttribute('data-prts-reply-entry', '')
           const heading = panel.ownerDocument.createElement('small')
           heading.textContent = '回复 ' + reply.ordinal
+          const icon = panel.ownerDocument.createElementNS('http://www.w3.org/2000/svg', 'svg')
+          icon.setAttribute('viewBox', '0 0 16 16')
+          icon.setAttribute('aria-hidden', 'true')
+          const outline = panel.ownerDocument.createElementNS(icon.namespaceURI, 'path')
+          outline.setAttribute('d', 'M3 2.5h10a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7l-4 2v-2a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1Z')
+          icon.append(outline)
+          heading.prepend(icon)
           const summary = panel.ownerDocument.createElement('span')
           summary.textContent = current.contentCache(reply.text).summary
           item.append(heading, summary)
@@ -610,7 +737,7 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
         ? approval
           ? [pending.toolName, pending.displayReason?.['zh-CN'] || pending.displayReason?.zh || pending.reason || pending.displayReason?.en || '请进入会话查看操作详情'].filter(Boolean).join('：')
           : first?.question || pendingQuestionPreview(pending)
-        : source ? excerpt || (state === 'ongoing' ? '正在处理，尚未输出正文…' : '暂无正文回复，可进入会话查看执行记录。') : '正在读取…'
+        : source ? excerpt || (state === 'ongoing' ? '正在处理…' : '暂无正文回复，可进入会话查看执行记录。') : '正在读取…'
       if (previousText !== text || previousQuestion !== question) {
         const extendsReply = previousQuestion === question && previousText && text.startsWith(previousText)
         if (question) body.textContent = text
@@ -631,7 +758,8 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
     })
     render()
     body.scrollTop = 0
-    current.delay = window.setTimeout(async () => {
+    current.delay = window.requestAnimationFrame(async () => {
+      current.delay = undefined
       try {
         const service = getUiConversation?.()
         const controller = getSessions?.() ?? sessions
@@ -643,11 +771,13 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
         current.source = source
         current.unsubscribe = source.subscribe(() => {
           if (active !== current || current.refresh !== undefined) return
-          current.refresh = window.setTimeout(() => {
+          current.refresh = window.requestAnimationFrame(() => {
             current.refresh = undefined
-            if (current.state === 'ongoing' && !current.editor && selectReplies(source.getSnapshot(), replyLimit()) === historyKeys) return
+            if (current.state === 'ongoing' && !current.editor
+              && selectReplies(source.getSnapshot(), replyLimit()) === historyKeys
+              && JSON.stringify(getPreviewPreferences?.().previewTools === false ? undefined : latestToolCall(source.getSnapshot())) === previousTool) return
             render()
-          }, 120)
+          })
         })
         render()
       } catch {
@@ -659,7 +789,7 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
         render()
         if (body.textContent.trim() === '正在读取…') body.textContent = '暂时无法读取回复，可点击会话查看'
       }
-    }, cached ? 0 : 80)
+    })
   }
   function leave() {
     if (!active || active.sticky) return
@@ -673,6 +803,8 @@ export function createSessionSummaryPreview({ document, window, sessions, getSes
     if (!active) return
     const anchor = [...root.querySelectorAll('[data-prts-session-summary-item]')]
       .find(item => item.getAttribute('data-prts-session-summary-item') === active.id)
+    // A read completion (or removed session) has no status row to own a preview.
+    if (!anchor) { stop(); return }
     active.group?.removeAttribute('data-prts-preview-open')
     active.anchor?.removeAttribute('data-prts-preview-active')
     active.anchor = anchor