lark-remote 0.5.6 → 0.5.7

package/dist/card/run-renderer.js

@@ -1,8 +1,10 @@
-import { terminalToColor, terminalToLabel, newSessionButton, stopButton, compactButton, agentDisplayName, } from './card-shared.js';
+import { terminalToColor, terminalToLabel, newSessionButton, stopButton, compactButton, cardButton, agentDisplayName, } from './card-shared.js';
 import { collapsibleMarkdownPanel, markdownDiv } from './collapsible.js';
 import { toolBodyMd, toolHeaderText } from './tool-render.js';
 import { truncateUtf8, truncateMarkdownTables, CARD_BUDGET_BYTES } from './text-truncate.js';
-import { formatTimestamp } from './time.js';
+import { countCardElements, MAX_CARD_ELEMENTS } from './card-budget.js';
+import { truncate } from '../common/truncate.js';
+import { formatClock, formatTimestamp } from './time.js';
 import { formatUsageStats } from '../router/usage-format.js';
 import { renderApprovalArea } from './approval-render.js';
 const REASONING_BYTES = 4_500;
@@ -10,6 +12,15 @@ const TEXT_BYTES = 10_000;
 const DEGRADED_THINKING_KEEP = 2;
 const DEGRADED_TEXT_BYTES = 5_000;
 const DEGRADED_THINKING_BYTES = 1_000;
+/**
+ * 带「详情」按钮的工具行数上限（从最新往回数）。
+ *
+ * 按钮行是节点大户：`column_set` + 2 个 `column` + 标题 div/text + button/text/
+ * behaviors/value ≈ 10 个 JSON 节点；纯标题行只有 2 个。24 行全带按钮 ≈ 240 节点，
+ * 直接撞飞书的元素总数上限（实测 203 通过 / 204 失败，见 card-budget.ts）。
+ * 最近 8 行保留按钮（用户最可能展开的就是刚跑完的），更早的行退化成一行标题。
+ */
+export const MAX_TOOL_ROWS_WITH_BUTTON = 8;
 const DEGRADED_TOOL_KEEP = 3; // Degraded: keep last 3 tool panels
 const EXTREME_TOOL_KEEP = 1; // Extreme: keep last 1 tool panel
 // --- Budget estimate (先估后建) ---
@@ -228,25 +239,97 @@ function groupBlocks(blocks) {
     return groups;
 }
 /**
- * Render a single tool as a collapsible panel.
- * - Running tool: expanded (user can watch live)
- * - Completed tool: collapsed (click to inspect)
+ * 工具块 = **原生折叠面板**（与 thinking/plan 同一交互）。
+ *
+ * 早先试过"一行 + 服务端「详情」按钮"：折叠不省字节所以正文不入 payload，展开
+ * 只能回服务端重出卡。代价是手机上要多点一次、按钮还占掉标题宽度（长 URL 被挤
+ * 成两行，2026-10-19 反馈）。现在改成折叠面板 + **按工具数量缩放的正文截断**：
+ * 正文始终随卡下发（面板折叠时不显示），点标题即展开，无往返、无按钮。
+ *
+ * 展开态：运行中/失败的默认展开（用户在等结果、错误要立刻可见），其余折叠。
  */
-function renderTool(tool, finalized) {
-    const border = tool.status === 'error' ? 'red' : 'grey';
-    const body = toolBodyMd(tool);
+function renderTool(tool, outputMax) {
+    const body = toolBodyMd(tool, { outputMax });
     return collapsibleMarkdownPanel({
         title: toolTitle(tool),
-        expanded: !finalized && tool.status === 'running',
-        border,
+        expanded: tool.status === 'running' || tool.status === 'error',
+        border: tool.status === 'error' ? 'red' : 'grey',
         content: body || '_无输出_',
         textSize: 'notation',
     });
 }
+/**
+ * 每个工具的正文输出预算：工具越多，单个工具留的字符越少。
+ *
+ * 24 个工具（`MAX_BLOCKS`，也是上限）× 1200 字符的正文会把卡片顶到 28KB 以上
+ * （实测 13 个 1200 字符的面板就开始走 skeleton 降级）。这里按总量反推：正文
+ * 合计约 8KB，单个工具 160–1200 字符——够看清前几行输出，又不会让整卡超预算。
+ */
+function toolOutputBudget(state) {
+    let count = 0;
+    for (const block of state.blocks)
+        if (block.kind === 'tool')
+            count += 1;
+    return Math.max(160, Math.min(1200, Math.floor(8000 / Math.max(1, count))));
+}
+/**
+ * 工具面板标题：`✅ **bash** — npm test (21:23)`。
+ *
+ * 标题连同时间戳一起收进 `HEADER_DISPLAY_MAX`（见 tool-render）——手机上折叠
+ * 面板的标题只有一行可用，超了就会断在 URL/命令中间。时间戳用 `HH:mm` 而不是
+ * 完整日期：同一张卡里的时间戳只需要区分先后。
+ */
 function toolTitle(tool) {
-    const ts = formatTimestamp(tool.completedAt ?? tool.startedAt);
-    const title = toolHeaderText(tool);
-    return ts ? `${title} (${ts})` : title;
+    const clock = formatClock(tool.completedAt ?? tool.startedAt);
+    const title = toolHeaderText(tool, clock ? ` (${clock})` : '');
+    return title;
+}
+/**
+ * 内容组的元素成本（口径 = 递归 `elements` 数组成员，与飞书实测判据一致）。
+ *
+ * 工具是折叠面板：面板 1 + 内部 div 1 = 2 个元素，与展开态无关（折叠跟展开的
+ * payload 一样，这正是"折叠不省字节"的含义——所以靠截断控制大小，而不是靠
+ * 不发送正文）。
+ */
+const TOOL_PANEL_ELEMENTS = 2;
+const PANEL_ELEMENTS = 2;
+const TEXT_BLOCK_ELEMENTS = 1;
+/**
+ * 内容区（blocks）可用的元素预算 = 总预算 − 固定开销预留。
+ *
+ * 固定开销：状态行 1 + summary 1 + 操作行 4 + 省略提示/通知若干，实测约 10；
+ * 预留 20 留出通知与提示的波动空间。
+ */
+const CONTENT_ELEMENT_BUDGET = MAX_CARD_ELEMENTS - 20;
+/** 单个内容组的元素成本（保守：宁多不少）。 */
+function groupElementCost(group) {
+    if (group.kind === 'tool')
+        return TOOL_PANEL_ELEMENTS;
+    if (group.kind === 'text')
+        return TEXT_BLOCK_ELEMENTS;
+    return PANEL_ELEMENTS;
+}
+/**
+ * 元素预算内从最新往回选择可见的内容组。
+ *
+ * 为什么在正常路径里先裁剪而不是整卡降级：降级档（degraded）只保留最后 3 个
+ * 工具 + 2 个思考块，对一次跑了几十步的 run 是灾难性的信息损失；元素超限的
+ * 成因只是"元素多"，砍掉最旧的几步就能同时保住元素预算和最新内容的完整渲染。
+ * 被省略的数量由调用方渲染成 `_已省略 N 个早期步骤_`（与 omittedBlocks 同款提示）。
+ */
+function selectVisibleGroups(groups) {
+    if (groups.length === 0)
+        return { visible: groups, omitted: 0 };
+    let used = 0;
+    let start = groups.length;
+    for (let i = groups.length - 1; i >= 0; i--) {
+        const cost = groupElementCost(groups[i]);
+        if (start < groups.length && used + cost > CONTENT_ELEMENT_BUDGET)
+            break;
+        used += cost;
+        start = i;
+    }
+    return { visible: groups.slice(start), omitted: start };
 }
 const DEGRADED_TIER = {
     thinkingKeep: DEGRADED_THINKING_KEEP,
@@ -331,6 +414,7 @@ function assembleRunCard(state, options, elements) {
  */
 function buildFallbackElements(state, options, tier) {
     const elements = [];
+    const outputMax = toolOutputBudget(state);
     elements.push(statusRow(state));
     elements.push(...omittedBlocksHint(state));
     // 单遍分桶：thinking / tool（保持原相对顺序）
@@ -403,7 +487,7 @@ function buildFallbackElements(state, options, tier) {
         }
         else if (group.kind === 'tool') {
             // Show tool individually (each tool is independent now)
-            elements.push(renderTool(group.tool, true)); // finalized=true
+            elements.push(renderTool(group.tool, outputMax));
         }
     }
     if (elements.length === 0 && tier === EXTREME_TIER) {
@@ -429,25 +513,87 @@ function buildDegradedElements(state, options) {
 function buildExtremeFallbackElements(state, options) {
     return buildFallbackElements(state, options, EXTREME_TIER);
 }
-/** Build the status row element (shared across full/degraded/extreme). */
+/**
+ * 状态行内容：**一行、一个 div、窄屏不换行**。
+ *
+ * 设计约束（2026-10-19 手机端实测）：旧版把「状态标签」和「耗时/指标」放进
+ * `column_set` 的 auto + grow 两列，窄屏上 auto 列被挤到只剩两个字宽，
+ * "运行中" 被拆成 "运行 / 中"。列式布局的可用宽度取决于对端渲染，服务端无法
+ * 保证；所以这里改成单 div，段间用 " · " 分隔——换行只会发生在分隔符处，
+ * 而且整行控制在 ~26 个半角宽度内，320px 宽的手机也能放下。
+ *
+ * 状态标签（运行中/已完成…）不再重复：header 已经写了（`🔧 dsh · 调用工具`
+ * / `✅ dsh · 已完成`），终态 summary 还有一次。
+ *
+ * 导出供窄屏守卫测试断言分段宽度（与 `estimateCardBytes` 同一惯例）。
+ */
+export function statusLine(state) {
+    const parts = [];
+    // 等待人工决策是「现在卡在哪儿」的唯一线索，值得在状态行重复一次 header
+    // （窄屏上用户往往只扫这一行）。其余活动词（思考中/输出中）不重复，header 有。
+    if (hasPendingApproval(state) && state.terminal === 'running')
+        parts.push('✋ 等待审批');
+    const elapsed = elapsedLabel(state);
+    if (elapsed)
+        parts.push(`⏱ ${elapsed}`);
+    // 运行期投影只在 running/finalizing 展示：终态 summary 有权威统计，同一张卡
+    // 上出现两次只会互相矛盾。
+    const live = state.liveStatus;
+    if (live && (state.terminal === 'running' || state.terminal === 'finalizing')) {
+        if (live.steps !== undefined)
+            parts.push(`🧰 ${live.steps} 步`);
+        if (live.contextUsed !== undefined &&
+            live.contextLimit !== undefined &&
+            live.contextLimit > 0) {
+            // 官方口径：projectedTokens ?? pressureTokens，取整封顶 100；`~` 表示投影值。
+            const pct = Math.min(100, Math.round((live.contextUsed / live.contextLimit) * 100));
+            parts.push(`📊 ~${pct}%`);
+        }
+        else if (live.contextUsed !== undefined) {
+            parts.push(`📊 ${formatTokens(live.contextUsed)}`);
+        }
+    }
+    if (parts.length === 0) {
+        // 没有任何可用指标时退回状态词（骨架卡/测试构造的状态没有时间戳）。
+        return statusTagLabel(state.terminal);
+    }
+    return parts.join(' · ');
+}
+/** 耗时文案：`12s` / `2m13s` / `1h04m` / `2d3h`。空 = 无时间戳。 */
+function elapsedLabel(state) {
+    if (state.startedAt === undefined)
+        return '';
+    const end = state.finishedAt ?? Date.now();
+    const ms = end - state.startedAt;
+    if (!Number.isFinite(ms) || ms < 0)
+        return '';
+    const totalSeconds = Math.floor(ms / 1000);
+    if (totalSeconds < 60)
+        return `${totalSeconds}s`;
+    const minutes = Math.floor(totalSeconds / 60);
+    if (minutes < 60)
+        return `${minutes}m${String(totalSeconds % 60).padStart(2, '0')}s`;
+    const hours = Math.floor(minutes / 60);
+    if (hours < 24)
+        return `${hours}h${String(minutes % 60).padStart(2, '0')}m`;
+    return `${Math.floor(hours / 24)}d${String(hours % 24).padStart(2, '0')}h`;
+}
+/** token 数量的紧凑写法：`950` / `12K` / `1.2M`。 */
+function formatTokens(tokens) {
+    if (tokens < 1000)
+        return String(tokens);
+    if (tokens < 1_000_000)
+        return `${Math.round(tokens / 1000)}K`;
+    return `${(tokens / 1_000_000).toFixed(1)}M`;
+}
+/**
+ * 状态行元素（full/degraded/extreme/skeleton 共用）。
+ *
+ * 单 div + `notation` 字号：列式布局在窄屏会把短标签挤成竖排（手机端实测），
+ * 单行文本的换行点只在 " · " 处，可预期。
+ */
 function statusRow(state) {
-    const statusLabel = statusTagLabel(state.terminal);
-    const durationInfo = buildDurationInfo(state);
-    return {
-        tag: 'column_set',
-        columns: [
-            {
-                tag: 'column',
-                width: 'auto',
-                elements: [{ tag: 'div', text: { content: statusLabel, tag: 'lark_md' } }],
-            },
-            {
-                tag: 'column',
-                width: 'grow',
-                elements: [{ tag: 'div', text: { content: durationInfo, tag: 'lark_md' } }],
-            },
-        ],
-    };
+    return markdownDiv(statusLine(state), 'notation');
 }
 /**
  * Minimal skeleton card — the final safety net when even the extreme fallback
@@ -551,11 +697,14 @@ function describePanelGroup(group, prepared) {
 }
 /** 导出供测试断言估算精度（估算 ≈ 实际渲染字节，见 tests/anchor/run-card/run-card.test.ts）。 */
 export function estimateCardBytes(state, options = {}, shared) {
-    const finalized = state.terminal !== 'running';
     // renderRunCard 传入共享 groups/prepared 时直接复用（截断只做一次）；
     // 独立调用（测试/预算探针）时自建，行为与原先一致。
     const groups = shared?.groups ?? groupBlocks(state.blocks);
     const prepared = shared?.prepared ?? prepareGroupContent(groups);
+    // 与 buildChronologicalContent 同源：估算必须测量"将要渲染的内容"，而正常
+    // 路径会按节点预算省略最旧的组（不模拟这一步会系统性高估）。
+    const { visible, omitted } = selectVisibleGroups(groups);
+    const outputMax = toolOutputBudget(state);
     // 卡片外壳直接实测 assembleRunCard 空元素产物（schema/config/header/body 结构
     // 与正式渲染完全一致）；status/summary/操作行同样实测渲染结构。
     // 注：审批区（approvalArea）不参与估算——待审批通常在途且体积小，超预算由
@@ -566,11 +715,15 @@ export function estimateCardBytes(state, options = {}, shared) {
         measureJson(actionRow(state, options));
     // 块内容：与 buildChronologicalContent 同源（describePanelGroup 单源）
     let renderedAny = false;
-    for (const group of groups) {
+    if (omitted > 0) {
+        renderedAny = true;
+        total += measureJson(markdownDiv(`_💡 已省略 ${omitted} 个早期步骤_`));
+    }
+    for (const group of visible) {
         if (group.kind === 'tool') {
             renderedAny = true;
             // tool 直接实测真实渲染元素（复用 renderTool，output ≤1200 字符，物化廉价）
-            total += measureJson(renderTool(group.tool, finalized));
+            total += measureJson(renderTool(group.tool, outputMax));
             continue;
         }
         if (group.kind === 'text') {
@@ -636,14 +789,15 @@ export function renderRunCard(state, options = {}) {
             ...approvalArea(state),
         ];
         const card = assembleRunCard(state, options, elements);
-        // Check budget — stringify 兜底（估算可能低估，仍保留安全网）
-        if (Buffer.byteLength(JSON.stringify(card), 'utf8') <= CARD_BUDGET_BYTES)
+        // Check budget — stringify 兜底（估算可能低估，仍保留安全网）。
+        // 两个维度都必须过：字节（28KB）与元素总数（飞书 11310，实测 203 节点上限）。
+        if (withinRunCardBudget(card))
             return card;
         // 超预算 → 继续走 degraded（不 return，fallthrough）
     }
-    // 估算 ≥ 阈值 或 完整卡 stringify 超预算 — 走 degraded 渲染
+    // 估算 ≥ 阈值 或 完整卡超预算 — 走 degraded 渲染
     const degradedCard = assembleRunCard(state, options, buildDegradedElements(state, options));
-    if (Buffer.byteLength(JSON.stringify(degradedCard), 'utf8') <= CARD_BUDGET_BYTES) {
+    if (withinRunCardBudget(degradedCard)) {
         return degradedCard;
     }
     // Extreme fallback: even degraded exceeds budget
@@ -651,7 +805,7 @@ export function renderRunCard(state, options = {}) {
     // Final safety net: extreme fallback 是最后一层，但高转义内容（反斜杠 4× 膨胀）
     // 可能让 extreme 产物本身 >28KB。补上 stringify 兜底（与 normal/degraded 对称）：
     // 超预算则降级到结构性保证 ≤28KB 的 skeleton 卡，避免飞书 11310 整卡不可用。
-    if (Buffer.byteLength(JSON.stringify(extremeCard), 'utf8') <= CARD_BUDGET_BYTES) {
+    if (withinRunCardBudget(extremeCard)) {
         return extremeCard;
     }
     const skeletonCard = assembleRunCard(state, options, buildSkeletonElements(state, options));
@@ -675,16 +829,34 @@ export function renderRunCard(state, options = {}) {
     };
     return truncatedSkeleton;
 }
+/**
+ * Run 卡片的双预算检查：UTF-8 字节 ≤ 28KB **且** 元素数 ≤ `MAX_CARD_ELEMENTS`。
+ *
+ * 为什么两个维度都要查：字节超限来自内容长（截断即可），元素超限来自元素多
+ * （必须删元素）。一张只有几十个短文本的卡片可以远低于 28KB 却把飞书的元素
+ * 总数撑爆（实测 24 行工具 + 24 个展开正文 = 103 个元素 → 11310），只查字节
+ * 的安全网抓不到它。
+ */
+function withinRunCardBudget(card) {
+    if (countCardElements(card) > MAX_CARD_ELEMENTS)
+        return false;
+    return Buffer.byteLength(JSON.stringify(card), 'utf8') <= CARD_BUDGET_BYTES;
+}
 /** Build content in chronological order using groupBlocks to interleave thinking/text/tools. */
 function buildChronologicalContent(state, prepared, groups) {
     const elements = [];
     // finalized = 非 running（含 finalizing：主结果已出，thinking 折叠）
     const finalized = state.terminal !== 'running';
+    // 节点预算内从最新往回选择可见组：超限时只省略最旧的几步，不整卡降级。
+    const { visible, omitted } = selectVisibleGroups(groups);
+    const outputMax = toolOutputBudget(state);
+    if (omitted > 0)
+        elements.push(markdownDiv(`_💡 已省略 ${omitted} 个早期步骤_`));
     // renderRunCard 传入同一 groups 数组时直接复用（prepared 的键是组对象
     // 引用，重建数组会让 prepared.get 永远 miss，退化为二次截断）。
     // 面板组描述经 describePanelGroup 与估算共享同一份模板。
     // notices 作为普通消息按到达时间插入内容流（有内容时不再沉到 summary）。
-    const contentItems = mergeNoticesIntoContent(groups, state.notices);
+    const contentItems = mergeNoticesIntoContent(visible, state.notices);
     for (const item of contentItems) {
         if (item.kind === 'notice') {
             elements.push(renderNoticeRow(item.notice));
@@ -692,7 +864,7 @@ function buildChronologicalContent(state, prepared, groups) {
         }
         const group = item;
         if (group.kind === 'tool') {
-            elements.push(renderTool(group.tool, finalized));
+            elements.push(renderTool(group.tool, outputMax));
             continue;
         }
         if (group.kind === 'text') {
@@ -788,28 +960,52 @@ function buildSummaryContent(state, options = {}) {
             reasoningTokens: state.reasoningTokens,
         }, { showResult: true, result });
         elements.push(markdownDiv(usageStatsStr + empty));
+        // 后台任务：跨 turn 生命周期，必须显式告知并可逐个停止。
+        elements.push(...buildBackgroundJobsSection(state));
     }
     return elements;
 }
-/** Build duration info string */
-function buildDurationInfo(state) {
-    if (state.terminal === 'done' ||
-        state.terminal === 'error' ||
-        state.terminal === 'interrupted' ||
-        state.terminal === 'idle_timeout') {
-        return `⏱ ${state.footer || '已完成'}`;
+/** 终态卡最多列几个后台任务（多出来的只报数）。 */
+const MAX_BACKGROUND_JOB_LINES = 3;
+/**
+ * 后台任务小节：一行标题 + 每个任务一行（标签 + 停止按钮）。
+ *
+ * 按钮 payload 只带 runId/jobId：sessionId 与 cwd 由 bridge 的快照解析，卡片
+ * 上少放一个可变字段就少一处不一致。
+ */
+function buildBackgroundJobsSection(state) {
+    const jobs = state.backgroundJobs ?? [];
+    if (jobs.length === 0)
+        return [];
+    const elements = [
+        markdownDiv(`🧵 **后台任务** ${jobs.length} 个仍在运行（本轮结束后继续）`),
+    ];
+    for (const job of jobs.slice(0, MAX_BACKGROUND_JOB_LINES)) {
+        // label 是任务自报的一行描述，可能含反引号/regex 反斜杠：按 markdown 安全
+        // 形态收敛（markdownDiv 只转义反斜杠，反引号会截断行内代码）。
+        const label = truncate(job.label.replace(/[\r\n]+/g, ' ').replace(/`/g, "'"), 60);
+        elements.push({
+            tag: 'column_set',
+            columns: [
+                {
+                    tag: 'column',
+                    width: 'grow',
+                    elements: [markdownDiv(`· \`${label}\``, 'notation')],
+                },
+                {
+                    tag: 'column',
+                    width: 'auto',
+                    elements: [
+                        cardButton('⏹ 停止', { cmd: 'job.kill', runId: state.runId, jobId: job.id }, { size: 'small', type: 'danger' }),
+                    ],
+                },
+            ],
+        });
     }
-    // 与标题一致：审批等待期间状态行显示「等待审批中」，而不是「工具调用中」。
-    if (hasPendingApproval(state))
-        return '✋ 等待审批中';
-    return footerText(state.footer);
-}
-function footerText(footer) {
-    if (footer === 'tool_running')
-        return '🧰 工具调用中';
-    if (footer === 'streaming')
-        return '✍️ 输出中';
-    return '🧠 思考中';
+    if (jobs.length > MAX_BACKGROUND_JOB_LINES) {
+        elements.push(markdownDiv(`_…另有 ${jobs.length - MAX_BACKGROUND_JOB_LINES} 个任务_`));
+    }
+    return elements;
 }
 /** Status tag label */
 function statusTagLabel(terminal) {

package/dist/card/run-state.d.ts

@@ -72,6 +72,10 @@ export interface RunState {
     runId: string;
     terminal: RunTerminal;
     footer: RunFooter;
+    /** 本 run 开始时间（epoch ms）：状态行的「⏱ 12s」由它算出。 */
+    startedAt?: number;
+    /** 本 run 结束时间（epoch ms）：终态后耗时定格，不再随渲染时刻增长。 */
+    finishedAt?: number;
     blocks: RunBlock[];
     sessionId?: string;
     resultSubtype?: 'success' | 'error' | 'interrupted';
@@ -135,6 +139,28 @@ export interface RunState {
      * 终态渲染（2026-08-15 事故：标记被消费后卡片误报「已被用户终止」）。
      */
     approvalExpired?: boolean;
+    /**
+     * 运行期状态投影（DSH `session/control` 的 contextPressure / sessionStats）。
+     *
+     * 只在 running/finalizing 渲染成状态行的一条（终态卡有权威 summary，不再
+     * 重复）。字段缺省 = 该维度暂无数据。
+     */
+    liveStatus?: {
+        contextUsed?: number;
+        contextLimit?: number;
+        steps?: number;
+        toolMs?: number;
+    };
+    /**
+     * run 结束时仍在后台运行的任务。跨 turn 生命周期：卡片必须说清楚"这一轮
+     * 结束了，但还有东西在跑"，并给出逐个停止的入口。
+     */
+    backgroundJobs?: Array<{
+        id: string;
+        label: string;
+        status?: string;
+        progress?: string;
+    }>;
 }
 export interface FinishMeta {
     resultSubtype?: 'success' | 'error' | 'interrupted';

package/dist/card/run-state.js

@@ -8,6 +8,8 @@ export function createInitialRunState(runId) {
         runId,
         terminal: 'running',
         footer: 'thinking',
+        // 状态行的耗时口径：从 run 状态建立那一刻算起（卡片首帧即开始计时）。
+        startedAt: Date.now(),
         blocks: [],
     };
 }
@@ -23,6 +25,10 @@ export function reduceRunState(state, event) {
     }
     if (event.type === 'system')
         return reduceSystemEvent(state, event);
+    if (event.type === 'run_status')
+        return reduceRunStatusEvent(state, event);
+    if (event.type === 'background_jobs')
+        return reduceBackgroundJobsEvent(state, event);
     if (event.type === 'result')
         return reduceResultEvent(state, event);
     if (event.type === 'assistant')
@@ -320,6 +326,42 @@ function reduceResultEvent(state, event) {
             : {}),
     };
 }
+/**
+ * 后台任务名单 → RunState.backgroundJobs。
+ *
+ * 整份替换而非合并：事件本身就是"收尾那一刻仍在跑的完整名单"，合并会把上一
+ * 轮已结束的任务留下来。用户点「停止」成功后由 bridge 直接从 state 里摘掉，
+ * 不再走事件（那时已经没有 run 在消费流了）。
+ */
+function reduceBackgroundJobsEvent(state, event) {
+    if (event.type !== 'background_jobs')
+        return state;
+    return { ...state, backgroundJobs: event.jobs };
+}
+/**
+ * 运行期状态投影 → 状态行。
+ *
+ * 每帧只带一个投影 key，所以只合并"有值"的字段：用 undefined 覆盖会把另一
+ * 维度（上一步算出的上下文水位）擦掉。
+ */
+function reduceRunStatusEvent(state, event) {
+    if (event.type !== 'run_status')
+        return state;
+    const prev = state.liveStatus ?? {};
+    const live = {
+        ...prev,
+        ...(event.contextUsed === undefined ? {} : { contextUsed: event.contextUsed }),
+        ...(event.contextLimit === undefined ? {} : { contextLimit: event.contextLimit }),
+        ...(event.steps === undefined ? {} : { steps: event.steps }),
+        ...(event.toolMs === undefined ? {} : { toolMs: event.toolMs }),
+    };
+    // 窗口上限同时写进 state：终态 summary 的百分比与状态条同源，即使
+    // result.usage 没带上限（DSH 的会话读取端不产出）也算得出来。
+    const next = { ...state, liveStatus: live };
+    if (live.contextLimit !== undefined)
+        next.contextLimit = live.contextLimit;
+    return next;
+}
 /** Handle assistant thinking/text/tool_use content blocks. */
 function reduceAssistantEvent(state, event) {
     if (event.type !== 'assistant')
@@ -577,6 +619,9 @@ export function finishRun(state, terminal, meta = {}) {
         ...state,
         terminal,
         footer: null,
+        // 耗时定格：终态之后再渲染（补 token 统计、点「详情」重渲染）都沿用同一
+        // 结束时刻，否则每次 patch 的数字都会变大。
+        finishedAt: state.finishedAt ?? Date.now(),
         blocks: markThinkingInactive(state.blocks),
         ...sanitizeMeta(meta),
         ...(derivedReason !== undefined ? { interruptedReason: derivedReason } : {}),

package/dist/card/time.d.ts

@@ -1 +1,15 @@
 export declare function formatTimestamp(ts: string | number | undefined): string;
+/**
+ * 时钟时间 `HH:mm`（同一张卡内的次要信息用）。
+ *
+ * 面板标题在手机上只有约 36 个显示宽度可用：`2026-10-19 21:23` 光时间戳就吃掉
+ * 一半，正文明明只需要知道"什么时候发生的"。完整的日期在会话历史/日志里。
+ */
+export declare function formatClock(ts: string | number | undefined): string;
+/**
+ * `MM-DD HH:mm`（面板标题里的历史事件时间）。
+ *
+ * 比 `HH:mm` 多带上日期（跨天/跨周的会话不会误导），比完整 `YYYY-MM-DD HH:mm`
+ * 省 7 个显示宽度——那 7 个单位在手机上正好是文件名能不能显示出来的差别。
+ */
+export declare function formatMonthDayClock(ts: string | number | undefined): string;

package/dist/card/time.js

@@ -11,4 +11,34 @@ export function formatTimestamp(ts) {
     const mi = String(d.getMinutes()).padStart(2, '0');
     return `${yyyy}-${mm}-${dd} ${hh}:${mi}`;
 }
+/**
+ * 时钟时间 `HH:mm`（同一张卡内的次要信息用）。
+ *
+ * 面板标题在手机上只有约 36 个显示宽度可用：`2026-10-19 21:23` 光时间戳就吃掉
+ * 一半，正文明明只需要知道"什么时候发生的"。完整的日期在会话历史/日志里。
+ */
+export function formatClock(ts) {
+    if (!ts)
+        return '';
+    const d = new Date(ts);
+    if (isNaN(d.getTime()))
+        return '';
+    return `${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`;
+}
+/**
+ * `MM-DD HH:mm`（面板标题里的历史事件时间）。
+ *
+ * 比 `HH:mm` 多带上日期（跨天/跨周的会话不会误导），比完整 `YYYY-MM-DD HH:mm`
+ * 省 7 个显示宽度——那 7 个单位在手机上正好是文件名能不能显示出来的差别。
+ */
+export function formatMonthDayClock(ts) {
+    if (!ts)
+        return '';
+    const d = new Date(ts);
+    if (isNaN(d.getTime()))
+        return '';
+    const mm = String(d.getMonth() + 1).padStart(2, '0');
+    const dd = String(d.getDate()).padStart(2, '0');
+    return `${mm}-${dd} ${formatClock(d.getTime())}`;
+}
 //# sourceMappingURL=time.js.map

package/dist/card/tool-render.d.ts

@@ -10,13 +10,24 @@
  * like `✅ **Bash** — pwd` so collapsed panels stay informative.
  */
 import type { ToolEntry } from './run-state.js';
+export { displayWidth, truncateMiddleToDisplayWidth, truncateToDisplayWidth, } from '../common/text-width.js';
+/**
+ * 面板标题的显示宽度上限（半角单位，CJK/emoji 记 2）。
+ *
+ * 手机（~390px 内容宽）上折叠面板的标题只有**一行**可用：减去图标与内边距约
+ * 320px，按 ~7.5px/半角算 ≈ 42 个半角宽度（iPhone SE 更窄，超出时按 `·`/空格
+ * 折行仍可读，但不能整段换行）。超过就折行，断点常常落在 URL 或命令
+ * 中间（2026-10-19 截图反馈）。完整参数在展开后的正文里，标题只负责"哪个工具、
+ * 动了什么"，并带上 `HH:mm` 时间戳（一起计入预算）。
+ */
+export declare const HEADER_DISPLAY_MAX = 42;
 /**
  * One-line header for a tool call:
  *   `⏳ **Bash** — pwd`
  *   `✅ **Read** — /repo/a.ts`
  *   `❌ **Grep** — pattern in path`
  */
-export declare function toolHeaderText(tool: ToolEntry): string;
+export declare function toolHeaderText(tool: ToolEntry, suffix?: string): string;
 /**
  * Structured body markdown for a tool call. Renders input fields by tool name
  * (Bash → command, Read/Edit/Write → file_path, etc.) and output in a code
@@ -25,4 +36,6 @@ export declare function toolHeaderText(tool: ToolEntry): string;
  * for unknown tools: `default` returns '' and unknown tools only surface their
  * args through the panel header's `summarizeInput` fallback.
  */
-export declare function toolBodyMd(tool: ToolEntry): string;
+export declare function toolBodyMd(tool: ToolEntry, opts?: {
+    outputMax?: number;
+}): string;