@migor/cli 0.10.6 → 0.10.7

package/CHANGELOG.md

@@ -5,6 +5,52 @@
 （0.x 阶段：minor 可含破坏性变更，每个破坏性变更都在对应版本的「迁移」小节里写明）。
 决策的完整证据链在 `docs/spec.md` §10（带时间线的决策日志）。
 
+## [0.10.7] - 2026-11-12
+
+### 变更
+
+本版只改**调试面板的展开呈现**，无破坏性变更、无迁移动作。两包同步 0.10.6 → 0.10.7；
+`@migor/agentia` 此次只有版本常量变化（`src/` 一行未动），实际改动全在调试面板与
+`agentia view` 的产物面。
+
+- **展开态不再是一大坨 JSON**：`tool.input` / `tool.output` 是对象或数组时，展开行下方追加
+  一个**结构化正文块** —— 缩进、四类值着色、头部写类型与规模（`object · 6 项`）。
+  此前唯一的展开方式是把整串 JSON 折行，20 个键在 400px 宽的右栏里就是十几行连续的
+  `{"a":"b","c":{"d":`：页面不报错、无溢出、构建与 e2e 全绿，只是人读不了 ——
+  而「展开看工具到底收到/返回了什么」正是这块面板的主用途。
+- **逐层折叠**：容器默认只铺两层，更深的折成 `▸ watch: { object · 2 项 }`，点一下铺开。
+  折叠状态由调用方持有，所以**实时 run 里刚折起的容器不会被下一条事件弹开**。
+- **同构数组成表**：元素键集完全相等、且各列都是标量时铺成表（`targets[*].file` 这种表头），
+  3 行 `{name, score}` 从 9 行重复键名压到 1 行表头 + 3 行数据。判据刻意从严 ——
+  表格里没法逐层展开，判错一次就是**静默丢列**，所以任一条件不满足就回落树形。
+- **键路径可复制**：悬停键名出 `⧉`，点一下写入 `results[0].name`。没有剪贴板实现时
+  点击不生效、也不显示「已复制」—— 不把没做到的事显示成做到了。
+- **三处宿主同时生效**：CLI 的 `agentia dev` 面板、`agentia view` 生成的单文件 HTML、
+  官网 Playground 共用这份渲染器。
+- 字符串形态的展开（`tool.output` 的文本正文、官网模拟回放）**照旧**走原来的纯文本换行 ——
+  那一档有两个 CSS 不变量守着，刻意保留两档并存，不做统一。
+
+### 新增：展开态结构化渲染（2026-11-11 ref-trace-full-view）
+
+- **新件 `packages/trace-view/src/full-view.js`**：入参任意值、出参一个元素，与树的构建与
+  状态机无关（零依赖、纯 DOM 构造、无内部状态）。默认铺两层（`OPEN_DEPTH = 2`）。
+- **数据侧递原值**：`fromTrace.eventFull` 对 `tool.input` / `tool.output` 返回**原值**而非
+  `JSON.stringify` 结果 —— 此前在数据层就序列化了，渲染器根本看不到对象，结构化无从发生。
+  `rawArg` 保留（`.tr-io` 的正文与既有展开断言都靠它）。
+- **原文仍然在场**：结构化时给行打 `tr-structured`，CSS 只是隐藏 `.tr-io`，它依旧持有
+  `JSON.stringify` 原文 ⇒ 既有 9 条展开断言一条都不用改，用户选中复制也照旧。
+  改的是**画法**，不是数据。
+- **截断必须说出来**：单值超 240 字符写「还有 N 字符」，一层超 40 项写「还有 N 项未展开」，
+  嵌套超 6 层压平但仍标出「它是个容器」。静默截断比糊成一坨更坏 —— 它会让人以为工具
+  就返回了这么点东西。循环引用不抛（调试面板不该因一条坏数据白屏）。
+- **CLI 侧**：`inspector-routes.ts` 的 STATIC 白名单加 `full-view.js`（漏登记的后果是浏览器
+  404、面板整块求值失败），`packages/cli/test/structure.test.mjs` 的 W5 守着这条。
+- **验证**：trace-view 测试 +19（渲染件 15、接线 4），跑真 `createTraceView` + `playTrace`；
+  反向验证 5 条（不传 `fold` ⇒ 折叠跨重建用例红；摘掉「键数相等」判定 ⇒ 成表边界红；
+  摘掉挂块那一行 ⇒ 两处接线红；`eventFull` 退回 `JSON.stringify` ⇒ 结构化用例红；
+  `copyInto` 写 `title` 而非路径 ⇒ 复制用例红）。决策与判据见 `docs/spec.md` §10
+  2026-11-11 ref-trace-full-view，守卫登记见 `docs/guards.md` §1。
+
 ## [0.10.6] - 2026-11-09
 
 ### 变更
@@ -4426,7 +4472,8 @@ toolkit 142 / runtime 55 / engine 403 / container 10 / store 55 —— 全绿。
 首个公开发布：`@migor/agentia` + `@migor/cli`（scope `@migor/*`），两包版本同步。
 框架本体单包；CLI 独立成包（workspaces）。
 
-[Unreleased]: https://github.com/migoric/agentia/compare/v0.10.6...HEAD
+[Unreleased]: https://github.com/migoric/agentia/compare/v0.10.7...HEAD
+[0.10.7]: https://github.com/migoric/agentia/releases/tag/v0.10.7
 [0.10.6]: https://github.com/migoric/agentia/releases/tag/v0.10.6
 [0.10.5]: https://github.com/migoric/agentia/releases/tag/v0.10.5
 [0.10.4]: https://github.com/migoric/agentia/releases/tag/v0.10.4

package/dist/inspector/fromTrace.js

@@ -14,7 +14,7 @@
  *   3. usage 只由 llm.turn 累计（capability span 的 usage 是子 span 聚合，计入会双算）。
  */
 
-import { fmtArg, rawArg, capabilityTypeOf, CAP_ICO } from './view.js';
+import { fmtArg, capabilityTypeOf, CAP_ICO } from './view.js';
 
 /** 从 span.attributes 认能力类型（框架用 `setAttribute(capabilityId, 'subagent', name)` 记类型） */
 function spanType(s) {
@@ -68,15 +68,24 @@ function eventText(ev) {
 }
 
 /**
- * 事件全文（展开态用）。
+ * 事件全文（展开态用）—— **给原值，不预先序列化**。
  *
- * 只有 `tool.input` 需要单独取：`fmtArg` 把入参摘要**砍到 4 个键 / 每值 21 字符 / 整串 62 字符**，
- * 直接拿摘要当全文就是「假展开」—— 点开看到的还是那 62 个字符。出参与其他事件本身就是原文
- * （`eventText` 原样返回 content），无需二次处理。
- * 原文口径统一在 view.js 的 `rawArg`：官网 playground 的模拟回放也要用它，两处一处定义。
+ * 2026-11-11 起 `full` 的类型本身携带语义：字符串 ⇒ 渲染器走 `.tr-io` 的纯文本换行；
+ * 对象/数组 ⇒ 交给 `full-view.js` 铺成带缩进的结构化块。所以这里必须把**原值**递下去 ——
+ * 若仍在这里 `rawArg` 成字符串，「一大坨 JSON」那条路就永远回不来了（渲染器只能看到字符串）。
+ *
+ * 口径：
+ * - `tool.input` → 入参原值（`fmtArg` 的摘要砍到 4 键 / 每值 21 字符 / 整串 62 字符，
+ *   拿摘要当全文就是「假展开」）；
+ * - `tool.output` → `content` 原值：字符串就是纯文本（含图片块时会是非字符串，正好结构化）；
+ * - 其余事件 → `eventText` 的字符串（它们的体本来就是给人看的一小段说明）。
  */
 function eventFull(ev) {
-  if (ev.name === 'tool.input') return rawArg(ev.body?.input);
+  if (ev.name === 'tool.input') return ev.body?.input ?? '';
+  if (ev.name === 'tool.output') {
+    const c = ev.body?.content;
+    return c == null ? '' : c;
+  }
   return eventText(ev);
 }
 

package/dist/inspector/full-view.js

@@ -0,0 +1,369 @@
+/* 展开态的**结构化正文** —— 把「一大坨 JSON」拆成可折叠、可成表、可复制路径的块。
+ *
+ * ## 为什么需要它
+ *
+ * 展开此前只有一条路：把 `rawArg(v)`（= `JSON.stringify(v)`，**无缩进**）整串塞进
+ * `.tr-io` 再靠 CSS 换行。一个 20 键的工具入参在 400px 宽的右栏里会折成十几行连续的
+ * `{"a":"b","c":{"d":` —— 页面不报错、无溢出、构建全绿，只是**人读不了**。工具出参更糟：
+ * 它是 `content` 的原始序列化，长文本与图片块混在一起，一行到底。
+ *
+ * 缩进只是第一档。第二档（2026-11-11 晚，本文件的现状）解决缩进解决不了的三件事：
+ *
+ * 1. **静态文本没有"收起"**：深度 6 全铺开，一个出参就能把整棵树顶到屏幕外。现在容器
+ *    默认只铺两层（`OPEN_DEPTH`），其余折成 `{ object · 4 项 }`，点一下展开。折叠状态由
+ *    调用方传入（`opts.fold`）—— 渲染是全量重建，状态放本文件里活不过下一条事件。
+ * 2. **同构对象数组在浪费行**：`[{name,score},{...},{...}]` 每个元素重复一遍键名，3 行数据
+ *    吃掉 9 行。同构且各列都是标量时改成表格，表头一行、数据一行。
+ * 3. **路径拿不到**：想引用 `results[0].name` 只能用手数层级。每个键悬停出一个 `⧉`，
+ *    点一下把路径写进剪贴板（表头写的是 `results[*].name`，因为它是一整列）。
+ *
+ * ## 边界（都是「不这么做就会坏」的地方，不是口味）
+ *
+ * - **只在 `full` 不是字符串时接手**：字符串正文（工具返回的纯文本、官网模拟回放）
+ *   继续走 `.tr-io` + `.tr-open` 的老路 —— 那条路有 `test/style.test.js` 的两个不变量守着
+ *   （最小宽度、caret 常显），换成本件就会让那两个守卫失去落点。两档并存是刻意的。
+ * - **不改 `.tr-io` 的文本**：本件只是**追加**一个兄弟块，`.tr-io` 仍持有原文（展开时由
+ *   CSS 隐藏）。既有断言（`textContent === JSON.stringify(...)`）因此逐字保留 ——
+ *   展开的正文依旧是"原文"，只是多了一层可读的呈现。
+ * - **截断必须说出来**：长字符串与超大集合会截断，但截断处标明「还有 N 字符 / N 项」。
+ *   静默截断会让人以为工具就返回了这么点东西 —— 比糊成一坨更坏。表格单元格同样走
+ *   `primitive()`，所以这条在表里也成立（不做「表格例外」）。
+ * - **循环引用不抛**：手写的 trace 可能有环（`rawArg` 对它会回落 `[object Object]`），
+ *   这里同样只回落、不抛错：调试面板不该因为一条坏数据整棵树白屏。
+ * - **折叠状态必须外部持有**：`opts.fold` 是调用方的 Map（`view.js` 按事件键存一份）。
+ *   本文件只读写它、不 new 一份长期状态 —— 否则「点开一个容器，下一条事件到达时它自己合上」
+ *   会原样复现（这正是 `view.js` 的 `expanded` 集合存在的原因）。
+ * - **表格化只在"真的同构"时发生**：元素必须全是普通对象、键集完全一致、列数 1..6、
+ *   每列都是标量。任一不满足就回落树形 —— 表格里没法逐层展开，判错一次就是**丢数据**。
+ *
+ * 零依赖、纯 DOM 构造（只用 createElement / appendChild / textContent / className /
+ * dataset / innerHTML=''），与 view.js 共用同一套 DOM stub 跑测试。
+ */
+
+/** 单个字符串值最多显示多少字符（超过就说出来，不静默截断） */
+const MAX_STR = 240;
+/** 一层里最多铺开多少项（再多就没法看了，留着类型与计数） */
+const MAX_ITEMS = 40;
+/** 嵌套深度上限：再深就整体序列化成一行，避免缩进把宽度吃光 */
+const MAX_DEPTH = 6;
+/** 默认展开到第几层（容器自身深度 < 它 ⇒ 默认铺开）。两层 = 根 + 一层子节点 */
+const OPEN_DEPTH = 2;
+/** 表格最多几列：再多横向就没法看了，回落树形 */
+const MAX_COLS = 6;
+
+function fvEl(tag, cls, text) {
+  const node = document.createElement(tag);
+  if (cls) node.className = cls;
+  if (text !== undefined) node.textContent = text;
+  return node;
+}
+
+/** 安全序列化：循环引用 / BigInt / 自定义 toJSON 抛错都回落成一句人话，绝不冒泡 */
+function safeStringify(v) {
+  try {
+    const s = JSON.stringify(v, null, 2);
+    return s === undefined ? String(v) : s;
+  } catch {
+    return '[无法序列化 —— 可能是循环引用]';
+  }
+}
+
+/** 该值是否值得走结构化视图（字符串交给 .tr-io 的老路） */
+function isStructured(v) {
+  return v !== null && typeof v === 'object';
+}
+
+/** 普通对象（排除数组与 null）—— 表格化与"容器"判定都只要这一种 */
+function isPlainObject(v) {
+  return isStructured(v) && !Array.isArray(v);
+}
+
+/** 容器规模：数组算元素数，对象算键数 */
+function sizeOf(v) {
+  return Array.isArray(v) ? v.length : Object.keys(v).length;
+}
+
+/** 头部那句类型说明：`object · 6 项` / `array · 12 项` / `string · 4,096 字符` */
+function typeLabelOf(v) {
+  if (Array.isArray(v)) return `array · ${v.length} 项`;
+  if (isStructured(v)) return `object · ${Object.keys(v).length} 项`;
+  if (typeof v === 'string') return `string · ${v.length} 字符`;
+  return typeof v;
+}
+
+/** 基本类型的着色类与展示文本 */
+function primitive(v) {
+  if (v === null) return { cls: 'tr-full-null', text: 'null' };
+  if (v === undefined) return { cls: 'tr-full-null', text: 'undefined' };
+  const t = typeof v;
+  if (t === 'string') {
+    const clipped = v.length > MAX_STR ? v.slice(0, MAX_STR) : v;
+    const rest = v.length > MAX_STR ? `… 还有 ${v.length - MAX_STR} 字符` : '';
+    return { cls: 'tr-full-str', text: JSON.stringify(clipped) + rest };
+  }
+  if (t === 'number') return { cls: 'tr-full-num', text: String(v) };
+  if (t === 'boolean') return { cls: 'tr-full-bool', text: String(v) };
+  return { cls: 'tr-full-null', text: String(v) };
+}
+
+/** 深层容器压成单行时的表示：保留"它是个容器"这个事实，不伪装成标量 */
+function oneLine(v) {
+  const kind = Array.isArray(v) ? 'array' : 'object';
+  const s = safeStringify(v).replace(/\s+/g, ' ');
+  const clipped = s.length > MAX_STR ? s.slice(0, MAX_STR) + '…' : s;
+  return `<${kind} · ${sizeOf(v)} 项> ${clipped}`;
+}
+
+/** 子键的 JSON 路径：对象用 `.key`，数组用 `[i]`。根是空串，所以 `[0]` 不会变成 `.[0]` */
+function pathOf(parent, key, isArr) {
+  return isArr ? `${parent}[${key}]` : parent ? `${parent}.${key}` : key;
+}
+
+/** 剪贴板：没有实现时**什么都不做**，绝不把没做到的事显示成「已复制」 */
+function copyInto(btn, text, done) {
+  const clip = globalThis.navigator?.clipboard;
+  if (!clip || typeof clip.writeText !== 'function') return;
+  Promise.resolve(clip.writeText(text)).then(
+    () => {
+      btn.textContent = done;
+    },
+    () => {
+      btn.textContent = '复制失败';
+    },
+  );
+}
+
+/** 正在选文本时不要收起/展开 —— 鼠标拖选到行外松手会补一次 click，否则选完就自己合上了 */
+function hasSelection() {
+  try {
+    return String(globalThis.getSelection?.() ?? '') !== '';
+  } catch {
+    return false;
+  }
+}
+
+/** 悬停才露出的 `⧉`：点它复制路径，**不**触发所在容器的折叠 */
+function pathBtn(path) {
+  const btn = fvEl('span', 'tr-full-path', '⧉');
+  btn.title = '复制路径 ' + path;
+  btn.addEventListener('click', (e) => {
+    // 真实 DOM 里会冒泡到容器行的折叠处理；stub 的 click() 传的是空对象，故双保险
+    if (e && typeof e.stopPropagation === 'function') e.stopPropagation();
+    copyInto(btn, path, '已复制');
+  });
+  return btn;
+}
+
+/**
+ * 这一层要不要铺开。显式折叠/展开优先（`fold` 里有记录），否则按深度给默认值。
+ * @param {Map<string, boolean>} fold 路径 → 是否展开
+ */
+function isOpen(fold, path, depth) {
+  return fold.has(path) ? fold.get(path) === true : depth < OPEN_DEPTH;
+}
+
+/**
+ * 同构对象数组 → 列名；不是"真同构"就返回 null（调用方回落树形）。
+ *
+ * 判据全部是「表格会丢东西」的地方，松一条就丢一类数据：元素必须是普通对象、
+ * 键集**完全一致**（缺键/多键都回落）、列数 1..6、每列都是标量（表格里没法逐层展开）。
+ */
+function tableColsOf(arr) {
+  if (!Array.isArray(arr) || arr.length < 2 || arr.length > MAX_ITEMS) return null;
+  if (!isPlainObject(arr[0])) return null;
+  const cols = Object.keys(arr[0]);
+  if (cols.length === 0 || cols.length > MAX_COLS) return null;
+  for (const item of arr) {
+    if (!isPlainObject(item)) return null;
+    if (Object.keys(item).length !== cols.length) return null;
+    for (const c of cols) {
+      if (!Object.hasOwn(item, c)) return null;
+      if (isStructured(item[c])) return null;
+    }
+  }
+  return cols;
+}
+
+/**
+ * 同构数组铺成表格。缩进用 `data-depth`（值为 0 时不写）—— CSS 靠属性选择器补左外边距，
+ * 因为列数是动态的、行数也是动态的，没有一个能写死的 inline style 可靠活在 stub 里。
+ */
+function renderTable(ctx, arr, cols, depth, path) {
+  const table = fvEl('table', 'tr-full-table');
+  if (depth > 0) table.dataset.depth = String(depth);
+
+  const thead = fvEl('thead');
+  const headRow = fvEl('tr');
+  for (const c of cols) {
+    const th = fvEl('th');
+    th.appendChild(fvEl('span', 'tr-full-col', c));
+    // 列的路径带 `[*]`：复制出去能直接用于过滤/取值，而不是某一行的那一份
+    th.appendChild(pathBtn(pathOf(path + '[*]', c, false)));
+    headRow.appendChild(th);
+  }
+  thead.appendChild(headRow);
+  table.appendChild(thead);
+
+  const tbody = fvEl('tbody');
+  for (const item of arr) {
+    const tr = fvEl('tr');
+    for (const c of cols) {
+      const td = fvEl('td');
+      const p = primitive(item[c]); // 表里同样截断并说出剩余（不做「表格例外」）
+      td.appendChild(fvEl('span', p.cls, p.text));
+      tr.appendChild(td);
+    }
+    tbody.appendChild(tr);
+  }
+  table.appendChild(tbody);
+  ctx.body.appendChild(table);
+}
+
+/** 缩进空格的落点：0 层不占位（否则每条顶级键都白带两个空格） */
+function indentOf(depth) {
+  return depth > 0 ? fvEl('span', 'tr-full-indent', '  '.repeat(depth)) : null;
+}
+
+/** 折叠箭头的槽位。叶子行也占一格（传空串），否则同层键名会在「有箭头」与「没箭头」之间
+ *  左右跳 10px —— 一列键名对齐是这类面板最基本的可读性，不能靠行首参差来区分有没有子项。 */
+function caretSlot(glyph) {
+  return fvEl('span', 'tr-full-caret', glyph);
+}
+
+/** 一行 = 缩进 + 箭头槽位（+ 稍后追加的键名/值）。所有行都从同一个入口起头，
+ *  这样才能保证「同一层的键名在同一条竖线上」—— 逐处手写就迟早漏一处。 */
+function startRow(depth, caret) {
+  const row = fvEl('div', 'tr-full-line');
+  const indent = indentOf(depth);
+  if (indent) row.appendChild(indent);
+  row.appendChild(caretSlot(caret));
+  return row;
+}
+
+/**
+ * 把一个值铺进 `ctx.body`。
+ * @param {{body: Element, fold: Map<string, boolean>, repaint: () => void}} ctx
+ * @param {any} v         值
+ * @param {number} depth  当前缩进层级（根为 0）
+ * @param {string} path   当前值的 JSON 路径（根为空串）
+ */
+function renderInto(ctx, v, depth, path) {
+  const box = ctx.body;
+
+  if (!isStructured(v)) {
+    const p = primitive(v);
+    const row = startRow(depth, '');
+    row.appendChild(fvEl('span', p.cls, p.text));
+    box.appendChild(row);
+    return;
+  }
+
+  const isArr = Array.isArray(v);
+  const cols = isArr ? tableColsOf(v) : null;
+  if (cols) {
+    renderTable(ctx, v, cols, depth, path);
+    return;
+  }
+
+  const keys = isArr ? v.map((_, i) => String(i)) : Object.keys(v);
+  const show = keys.slice(0, MAX_ITEMS);
+
+  for (const k of show) {
+    const child = isArr ? v[Number(k)] : v[k];
+    const keyText = isArr ? `[${k}]` : `${k}:`;
+    const childPath = pathOf(path, k, isArr);
+    // 「能否折叠」只看三件事：是容器、非空、没到深度上限 —— 与下面几个分支同一套判据。
+    // 先算出来是为了让箭头槽位在起行时就有正确字形（叶子行留空格位，键名才会对齐）。
+    const foldable = isStructured(child) && sizeOf(child) > 0 && depth < MAX_DEPTH;
+    const open = foldable && isOpen(ctx.fold, childPath, depth);
+    const row = startRow(depth, foldable ? (open ? '▾' : '▸') : '');
+
+    // 叶子：同一行里写完（缩进 + 键名 + 路径 + 值）
+    if (!isStructured(child)) {
+      const p = primitive(child);
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(pathBtn(childPath));
+      row.appendChild(fvEl('span', p.cls, ' ' + p.text));
+      box.appendChild(row);
+      continue;
+    }
+
+    // 深度用尽 ⇒ 整体压成一行（并标明它是个容器），避免缩进吃掉全部宽度
+    if (depth >= MAX_DEPTH) {
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(fvEl('span', 'tr-full-null', ' ' + oneLine(child)));
+      box.appendChild(row);
+      continue;
+    }
+
+    // 空容器：留一对括号，别让它看起来像"展开失败"
+    if (sizeOf(child) === 0) {
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(fvEl('span', 'tr-full-null', Array.isArray(child) ? ' []' : ' {}'));
+      box.appendChild(row);
+      continue;
+    }
+
+    row.appendChild(fvEl('span', 'tr-full-key', keyText));
+    row.appendChild(pathBtn(childPath));
+    if (!open) {
+      const kind = Array.isArray(child) ? 'array' : 'object';
+      row.appendChild(fvEl('span', 'tr-full-hint', ` { ${kind} · ${sizeOf(child)} 项 }`));
+    } else if (Array.isArray(child) && tableColsOf(child)) {
+      // 成表时行内不铺子项，只在键名后标一句规模 —— 否则 `▾ targets:` 后面直接跟着表格，
+      // 看不出这是个数组、也看不出表格是不是全部内容（是不是被截断了）
+      row.appendChild(fvEl('span', 'tr-full-hint', ` array · ${child.length} 项`));
+    }
+    row.dataset.fold = childPath;
+    row.addEventListener('click', (e) => {
+      if (e && typeof e.stopPropagation === 'function') e.stopPropagation();
+      if (hasSelection()) return;
+      ctx.fold.set(childPath, !open);
+      ctx.repaint();
+    });
+    box.appendChild(row);
+
+    if (open) renderInto(ctx, child, depth + 1, childPath);
+  }
+
+  if (keys.length > show.length) {
+    const row = startRow(depth, '');
+    row.appendChild(fvEl('span', 'tr-full-null', `… 还有 ${keys.length - show.length} 项未展开`));
+    box.appendChild(row);
+  }
+}
+
+/**
+ * 建一个结构化正文块。
+ * @param {any} value  `ev.full` 的**原值**（不是序列化后的字符串）
+ * @param {{fold?: Map<string, boolean>}} [opts]
+ *   `fold` 是**调用方持有**的折叠状态（路径 → 是否展开）。省略时本块自建一份，
+ *   此时折叠状态活不过下一次「全量重建」—— 只对一次性渲染（测试、静态快照）够用。
+ * @returns {Element}  `.tr-full` 块；调用方负责 append 到展开行之后
+ */
+export function createFullView(value, opts = {}) {
+  const fold = opts.fold instanceof Map ? opts.fold : new Map();
+
+  const box = fvEl('div', 'tr-full');
+  box.dataset.kind = Array.isArray(value) ? 'array' : 'object';
+
+  const head = fvEl('div', 'tr-full-head');
+  head.appendChild(fvEl('span', 'tr-full-type', typeLabelOf(value)));
+  const copy = fvEl('span', 'tr-full-copy', '复制');
+  copy.dataset.copy = '1';
+  copy.addEventListener('click', () => copyInto(copy, safeStringify(value), '已复制'));
+  head.appendChild(copy);
+  box.appendChild(head);
+
+  const body = fvEl('div', 'tr-full-body');
+  const ctx = { body, fold, repaint: null };
+  // 只重画正文（不动头部）：折叠不需要重建整棵树，滚动位置与头部反馈都留着
+  ctx.repaint = () => {
+    body.innerHTML = '';
+    renderInto(ctx, value, 0, '');
+  };
+  ctx.repaint();
+
+  box.appendChild(body);
+  return box;
+}

package/dist/inspector/index.js

@@ -12,3 +12,8 @@ export {
 } from './view.js';
 export { playTrace } from './fromTrace.js';
 export { summarizeTrace, renderSummary } from './summary.js';
+/* 结构化正文块（2026-11-11）：`full` 是对象/数组时，渲染器会给展开行挂上这个块。
+ * 单独导出是因为它是**纯函数式的 DOM 构造**（入参 → 元素），宿主可以拿它渲染任意值 ——
+ * 而 bundle 的导出面必须与这里逐字一致（`test/bundle.test.js`），所以内部件不进公共面、
+ * 这一件必须进。 */
+export { createFullView } from './full-view.js';

package/dist/inspector/trace-view.bundle.js

@@ -2,6 +2,377 @@
  * 用途：`agentia view` 出的单文件自包含 HTML 内联本文件（无外链 / 离线可开 / 可转发）。
  * 真源仍是 src/；改渲染逻辑请改那里再跑 build。零依赖、纯 ESM。 */
 
+/* ===== src/full-view.js ===== */
+/* 展开态的**结构化正文** —— 把「一大坨 JSON」拆成可折叠、可成表、可复制路径的块。
+ *
+ * ## 为什么需要它
+ *
+ * 展开此前只有一条路：把 `rawArg(v)`（= `JSON.stringify(v)`，**无缩进**）整串塞进
+ * `.tr-io` 再靠 CSS 换行。一个 20 键的工具入参在 400px 宽的右栏里会折成十几行连续的
+ * `{"a":"b","c":{"d":` —— 页面不报错、无溢出、构建全绿，只是**人读不了**。工具出参更糟：
+ * 它是 `content` 的原始序列化，长文本与图片块混在一起，一行到底。
+ *
+ * 缩进只是第一档。第二档（2026-11-11 晚，本文件的现状）解决缩进解决不了的三件事：
+ *
+ * 1. **静态文本没有"收起"**：深度 6 全铺开，一个出参就能把整棵树顶到屏幕外。现在容器
+ *    默认只铺两层（`OPEN_DEPTH`），其余折成 `{ object · 4 项 }`，点一下展开。折叠状态由
+ *    调用方传入（`opts.fold`）—— 渲染是全量重建，状态放本文件里活不过下一条事件。
+ * 2. **同构对象数组在浪费行**：`[{name,score},{...},{...}]` 每个元素重复一遍键名，3 行数据
+ *    吃掉 9 行。同构且各列都是标量时改成表格，表头一行、数据一行。
+ * 3. **路径拿不到**：想引用 `results[0].name` 只能用手数层级。每个键悬停出一个 `⧉`，
+ *    点一下把路径写进剪贴板（表头写的是 `results[*].name`，因为它是一整列）。
+ *
+ * ## 边界（都是「不这么做就会坏」的地方，不是口味）
+ *
+ * - **只在 `full` 不是字符串时接手**：字符串正文（工具返回的纯文本、官网模拟回放）
+ *   继续走 `.tr-io` + `.tr-open` 的老路 —— 那条路有 `test/style.test.js` 的两个不变量守着
+ *   （最小宽度、caret 常显），换成本件就会让那两个守卫失去落点。两档并存是刻意的。
+ * - **不改 `.tr-io` 的文本**：本件只是**追加**一个兄弟块，`.tr-io` 仍持有原文（展开时由
+ *   CSS 隐藏）。既有断言（`textContent === JSON.stringify(...)`）因此逐字保留 ——
+ *   展开的正文依旧是"原文"，只是多了一层可读的呈现。
+ * - **截断必须说出来**：长字符串与超大集合会截断，但截断处标明「还有 N 字符 / N 项」。
+ *   静默截断会让人以为工具就返回了这么点东西 —— 比糊成一坨更坏。表格单元格同样走
+ *   `primitive()`，所以这条在表里也成立（不做「表格例外」）。
+ * - **循环引用不抛**：手写的 trace 可能有环（`rawArg` 对它会回落 `[object Object]`），
+ *   这里同样只回落、不抛错：调试面板不该因为一条坏数据整棵树白屏。
+ * - **折叠状态必须外部持有**：`opts.fold` 是调用方的 Map（`view.js` 按事件键存一份）。
+ *   本文件只读写它、不 new 一份长期状态 —— 否则「点开一个容器，下一条事件到达时它自己合上」
+ *   会原样复现（这正是 `view.js` 的 `expanded` 集合存在的原因）。
+ * - **表格化只在"真的同构"时发生**：元素必须全是普通对象、键集完全一致、列数 1..6、
+ *   每列都是标量。任一不满足就回落树形 —— 表格里没法逐层展开，判错一次就是**丢数据**。
+ *
+ * 零依赖、纯 DOM 构造（只用 createElement / appendChild / textContent / className /
+ * dataset / innerHTML=''），与 view.js 共用同一套 DOM stub 跑测试。
+ */
+
+/** 单个字符串值最多显示多少字符（超过就说出来，不静默截断） */
+const MAX_STR = 240;
+/** 一层里最多铺开多少项（再多就没法看了，留着类型与计数） */
+const MAX_ITEMS = 40;
+/** 嵌套深度上限：再深就整体序列化成一行，避免缩进把宽度吃光 */
+const MAX_DEPTH = 6;
+/** 默认展开到第几层（容器自身深度 < 它 ⇒ 默认铺开）。两层 = 根 + 一层子节点 */
+const OPEN_DEPTH = 2;
+/** 表格最多几列：再多横向就没法看了，回落树形 */
+const MAX_COLS = 6;
+
+function fvEl(tag, cls, text) {
+  const node = document.createElement(tag);
+  if (cls) node.className = cls;
+  if (text !== undefined) node.textContent = text;
+  return node;
+}
+
+/** 安全序列化：循环引用 / BigInt / 自定义 toJSON 抛错都回落成一句人话，绝不冒泡 */
+function safeStringify(v) {
+  try {
+    const s = JSON.stringify(v, null, 2);
+    return s === undefined ? String(v) : s;
+  } catch {
+    return '[无法序列化 —— 可能是循环引用]';
+  }
+}
+
+/** 该值是否值得走结构化视图（字符串交给 .tr-io 的老路） */
+function isStructured(v) {
+  return v !== null && typeof v === 'object';
+}
+
+/** 普通对象（排除数组与 null）—— 表格化与"容器"判定都只要这一种 */
+function isPlainObject(v) {
+  return isStructured(v) && !Array.isArray(v);
+}
+
+/** 容器规模：数组算元素数，对象算键数 */
+function sizeOf(v) {
+  return Array.isArray(v) ? v.length : Object.keys(v).length;
+}
+
+/** 头部那句类型说明：`object · 6 项` / `array · 12 项` / `string · 4,096 字符` */
+function typeLabelOf(v) {
+  if (Array.isArray(v)) return `array · ${v.length} 项`;
+  if (isStructured(v)) return `object · ${Object.keys(v).length} 项`;
+  if (typeof v === 'string') return `string · ${v.length} 字符`;
+  return typeof v;
+}
+
+/** 基本类型的着色类与展示文本 */
+function primitive(v) {
+  if (v === null) return { cls: 'tr-full-null', text: 'null' };
+  if (v === undefined) return { cls: 'tr-full-null', text: 'undefined' };
+  const t = typeof v;
+  if (t === 'string') {
+    const clipped = v.length > MAX_STR ? v.slice(0, MAX_STR) : v;
+    const rest = v.length > MAX_STR ? `… 还有 ${v.length - MAX_STR} 字符` : '';
+    return { cls: 'tr-full-str', text: JSON.stringify(clipped) + rest };
+  }
+  if (t === 'number') return { cls: 'tr-full-num', text: String(v) };
+  if (t === 'boolean') return { cls: 'tr-full-bool', text: String(v) };
+  return { cls: 'tr-full-null', text: String(v) };
+}
+
+/** 深层容器压成单行时的表示：保留"它是个容器"这个事实，不伪装成标量 */
+function oneLine(v) {
+  const kind = Array.isArray(v) ? 'array' : 'object';
+  const s = safeStringify(v).replace(/\s+/g, ' ');
+  const clipped = s.length > MAX_STR ? s.slice(0, MAX_STR) + '…' : s;
+  return `<${kind} · ${sizeOf(v)} 项> ${clipped}`;
+}
+
+/** 子键的 JSON 路径：对象用 `.key`，数组用 `[i]`。根是空串，所以 `[0]` 不会变成 `.[0]` */
+function pathOf(parent, key, isArr) {
+  return isArr ? `${parent}[${key}]` : parent ? `${parent}.${key}` : key;
+}
+
+/** 剪贴板：没有实现时**什么都不做**，绝不把没做到的事显示成「已复制」 */
+function copyInto(btn, text, done) {
+  const clip = globalThis.navigator?.clipboard;
+  if (!clip || typeof clip.writeText !== 'function') return;
+  Promise.resolve(clip.writeText(text)).then(
+    () => {
+      btn.textContent = done;
+    },
+    () => {
+      btn.textContent = '复制失败';
+    },
+  );
+}
+
+/** 正在选文本时不要收起/展开 —— 鼠标拖选到行外松手会补一次 click，否则选完就自己合上了 */
+function hasSelection() {
+  try {
+    return String(globalThis.getSelection?.() ?? '') !== '';
+  } catch {
+    return false;
+  }
+}
+
+/** 悬停才露出的 `⧉`：点它复制路径，**不**触发所在容器的折叠 */
+function pathBtn(path) {
+  const btn = fvEl('span', 'tr-full-path', '⧉');
+  btn.title = '复制路径 ' + path;
+  btn.addEventListener('click', (e) => {
+    // 真实 DOM 里会冒泡到容器行的折叠处理；stub 的 click() 传的是空对象，故双保险
+    if (e && typeof e.stopPropagation === 'function') e.stopPropagation();
+    copyInto(btn, path, '已复制');
+  });
+  return btn;
+}
+
+/**
+ * 这一层要不要铺开。显式折叠/展开优先（`fold` 里有记录），否则按深度给默认值。
+ * @param {Map<string, boolean>} fold 路径 → 是否展开
+ */
+function isOpen(fold, path, depth) {
+  return fold.has(path) ? fold.get(path) === true : depth < OPEN_DEPTH;
+}
+
+/**
+ * 同构对象数组 → 列名；不是"真同构"就返回 null（调用方回落树形）。
+ *
+ * 判据全部是「表格会丢东西」的地方，松一条就丢一类数据：元素必须是普通对象、
+ * 键集**完全一致**（缺键/多键都回落）、列数 1..6、每列都是标量（表格里没法逐层展开）。
+ */
+function tableColsOf(arr) {
+  if (!Array.isArray(arr) || arr.length < 2 || arr.length > MAX_ITEMS) return null;
+  if (!isPlainObject(arr[0])) return null;
+  const cols = Object.keys(arr[0]);
+  if (cols.length === 0 || cols.length > MAX_COLS) return null;
+  for (const item of arr) {
+    if (!isPlainObject(item)) return null;
+    if (Object.keys(item).length !== cols.length) return null;
+    for (const c of cols) {
+      if (!Object.hasOwn(item, c)) return null;
+      if (isStructured(item[c])) return null;
+    }
+  }
+  return cols;
+}
+
+/**
+ * 同构数组铺成表格。缩进用 `data-depth`（值为 0 时不写）—— CSS 靠属性选择器补左外边距，
+ * 因为列数是动态的、行数也是动态的，没有一个能写死的 inline style 可靠活在 stub 里。
+ */
+function renderTable(ctx, arr, cols, depth, path) {
+  const table = fvEl('table', 'tr-full-table');
+  if (depth > 0) table.dataset.depth = String(depth);
+
+  const thead = fvEl('thead');
+  const headRow = fvEl('tr');
+  for (const c of cols) {
+    const th = fvEl('th');
+    th.appendChild(fvEl('span', 'tr-full-col', c));
+    // 列的路径带 `[*]`：复制出去能直接用于过滤/取值，而不是某一行的那一份
+    th.appendChild(pathBtn(pathOf(path + '[*]', c, false)));
+    headRow.appendChild(th);
+  }
+  thead.appendChild(headRow);
+  table.appendChild(thead);
+
+  const tbody = fvEl('tbody');
+  for (const item of arr) {
+    const tr = fvEl('tr');
+    for (const c of cols) {
+      const td = fvEl('td');
+      const p = primitive(item[c]); // 表里同样截断并说出剩余（不做「表格例外」）
+      td.appendChild(fvEl('span', p.cls, p.text));
+      tr.appendChild(td);
+    }
+    tbody.appendChild(tr);
+  }
+  table.appendChild(tbody);
+  ctx.body.appendChild(table);
+}
+
+/** 缩进空格的落点：0 层不占位（否则每条顶级键都白带两个空格） */
+function indentOf(depth) {
+  return depth > 0 ? fvEl('span', 'tr-full-indent', '  '.repeat(depth)) : null;
+}
+
+/** 折叠箭头的槽位。叶子行也占一格（传空串），否则同层键名会在「有箭头」与「没箭头」之间
+ *  左右跳 10px —— 一列键名对齐是这类面板最基本的可读性，不能靠行首参差来区分有没有子项。 */
+function caretSlot(glyph) {
+  return fvEl('span', 'tr-full-caret', glyph);
+}
+
+/** 一行 = 缩进 + 箭头槽位（+ 稍后追加的键名/值）。所有行都从同一个入口起头，
+ *  这样才能保证「同一层的键名在同一条竖线上」—— 逐处手写就迟早漏一处。 */
+function startRow(depth, caret) {
+  const row = fvEl('div', 'tr-full-line');
+  const indent = indentOf(depth);
+  if (indent) row.appendChild(indent);
+  row.appendChild(caretSlot(caret));
+  return row;
+}
+
+/**
+ * 把一个值铺进 `ctx.body`。
+ * @param {{body: Element, fold: Map<string, boolean>, repaint: () => void}} ctx
+ * @param {any} v         值
+ * @param {number} depth  当前缩进层级（根为 0）
+ * @param {string} path   当前值的 JSON 路径（根为空串）
+ */
+function renderInto(ctx, v, depth, path) {
+  const box = ctx.body;
+
+  if (!isStructured(v)) {
+    const p = primitive(v);
+    const row = startRow(depth, '');
+    row.appendChild(fvEl('span', p.cls, p.text));
+    box.appendChild(row);
+    return;
+  }
+
+  const isArr = Array.isArray(v);
+  const cols = isArr ? tableColsOf(v) : null;
+  if (cols) {
+    renderTable(ctx, v, cols, depth, path);
+    return;
+  }
+
+  const keys = isArr ? v.map((_, i) => String(i)) : Object.keys(v);
+  const show = keys.slice(0, MAX_ITEMS);
+
+  for (const k of show) {
+    const child = isArr ? v[Number(k)] : v[k];
+    const keyText = isArr ? `[${k}]` : `${k}:`;
+    const childPath = pathOf(path, k, isArr);
+    // 「能否折叠」只看三件事：是容器、非空、没到深度上限 —— 与下面几个分支同一套判据。
+    // 先算出来是为了让箭头槽位在起行时就有正确字形（叶子行留空格位，键名才会对齐）。
+    const foldable = isStructured(child) && sizeOf(child) > 0 && depth < MAX_DEPTH;
+    const open = foldable && isOpen(ctx.fold, childPath, depth);
+    const row = startRow(depth, foldable ? (open ? '▾' : '▸') : '');
+
+    // 叶子：同一行里写完（缩进 + 键名 + 路径 + 值）
+    if (!isStructured(child)) {
+      const p = primitive(child);
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(pathBtn(childPath));
+      row.appendChild(fvEl('span', p.cls, ' ' + p.text));
+      box.appendChild(row);
+      continue;
+    }
+
+    // 深度用尽 ⇒ 整体压成一行（并标明它是个容器），避免缩进吃掉全部宽度
+    if (depth >= MAX_DEPTH) {
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(fvEl('span', 'tr-full-null', ' ' + oneLine(child)));
+      box.appendChild(row);
+      continue;
+    }
+
+    // 空容器：留一对括号，别让它看起来像"展开失败"
+    if (sizeOf(child) === 0) {
+      row.appendChild(fvEl('span', 'tr-full-key', keyText));
+      row.appendChild(fvEl('span', 'tr-full-null', Array.isArray(child) ? ' []' : ' {}'));
+      box.appendChild(row);
+      continue;
+    }
+
+    row.appendChild(fvEl('span', 'tr-full-key', keyText));
+    row.appendChild(pathBtn(childPath));
+    if (!open) {
+      const kind = Array.isArray(child) ? 'array' : 'object';
+      row.appendChild(fvEl('span', 'tr-full-hint', ` { ${kind} · ${sizeOf(child)} 项 }`));
+    } else if (Array.isArray(child) && tableColsOf(child)) {
+      // 成表时行内不铺子项，只在键名后标一句规模 —— 否则 `▾ targets:` 后面直接跟着表格，
+      // 看不出这是个数组、也看不出表格是不是全部内容（是不是被截断了）
+      row.appendChild(fvEl('span', 'tr-full-hint', ` array · ${child.length} 项`));
+    }
+    row.dataset.fold = childPath;
+    row.addEventListener('click', (e) => {
+      if (e && typeof e.stopPropagation === 'function') e.stopPropagation();
+      if (hasSelection()) return;
+      ctx.fold.set(childPath, !open);
+      ctx.repaint();
+    });
+    box.appendChild(row);
+
+    if (open) renderInto(ctx, child, depth + 1, childPath);
+  }
+
+  if (keys.length > show.length) {
+    const row = startRow(depth, '');
+    row.appendChild(fvEl('span', 'tr-full-null', `… 还有 ${keys.length - show.length} 项未展开`));
+    box.appendChild(row);
+  }
+}
+
+/**
+ * 建一个结构化正文块。
+ * @param {any} value  `ev.full` 的**原值**（不是序列化后的字符串）
+ * @param {{fold?: Map<string, boolean>}} [opts]
+ *   `fold` 是**调用方持有**的折叠状态（路径 → 是否展开）。省略时本块自建一份，
+ *   此时折叠状态活不过下一次「全量重建」—— 只对一次性渲染（测试、静态快照）够用。
+ * @returns {Element}  `.tr-full` 块；调用方负责 append 到展开行之后
+ */
+function createFullView(value, opts = {}) {
+  const fold = opts.fold instanceof Map ? opts.fold : new Map();
+
+  const box = fvEl('div', 'tr-full');
+  box.dataset.kind = Array.isArray(value) ? 'array' : 'object';
+
+  const head = fvEl('div', 'tr-full-head');
+  head.appendChild(fvEl('span', 'tr-full-type', typeLabelOf(value)));
+  const copy = fvEl('span', 'tr-full-copy', '复制');
+  copy.dataset.copy = '1';
+  copy.addEventListener('click', () => copyInto(copy, safeStringify(value), '已复制'));
+  head.appendChild(copy);
+  box.appendChild(head);
+
+  const body = fvEl('div', 'tr-full-body');
+  const ctx = { body, fold, repaint: null };
+  // 只重画正文（不动头部）：折叠不需要重建整棵树，滚动位置与头部反馈都留着
+  ctx.repaint = () => {
+    body.innerHTML = '';
+    renderInto(ctx, value, 0, '');
+  };
+  ctx.repaint();
+
+  box.appendChild(body);
+  return box;
+}
+
 /* ===== src/view.js ===== */
 /* Agentia trace 调用树渲染器 —— 数据无关、零依赖。
  *
@@ -22,6 +393,13 @@
  * 宿主需提供的 CSS 变量：--ice --faint --text（见 trace-view.css）。
  */
 
+/* 展开态的正文有两种形状，由 `full` 的类型决定（2026-11-11）：
+ *   - 字符串 → 老路：`.tr-io` 里放原文，靠 `.tr-open` 换行（纯文本正文、官网模拟回放）；
+ *   - 对象/数组 → 追加一个 `.tr-full` 结构化块（折叠 / 成表 / 路径复制），`.tr-io` 由 CSS 隐藏。
+ * 两档并存是刻意的：字符串那条路有 test/style.test.js 的两个不变量守着（最小宽度、caret 常显），
+ * 全换成本件会让那两个守卫失去落点。 */
+
+
 const CAP_ICO = { tool: '⚙', skill: '◆', prompt: '¶', subagent: '⊕' };
 
 /** 能力类型取自名字前缀（tool: / skill: / prompt: / subagent:） */
@@ -93,6 +471,9 @@ function createTraceView(rootEl, opts = {}) {
   /* 展开态的行 key 集合 + 事件 key 发号器。两者都必须活在 renderTrace 之外：
      渲染是【全量重建】（rootEl.innerHTML = ''），状态放进 DOM 或渲染过程里就活不过下一次事件。 */
   const expanded = new Set();
+  /* 结构化块内部的折叠状态，按事件键一份（`ev.key` → 路径 → 是否展开）。
+     与 `expanded` 同一条理由，而且更硬：块本身每次重建都会 new 一个，状态只能挂在树上。 */
+  const folds = new Map();
   let evSeq = 0;
 
   /** 正在选文本时不要收起/展开 —— 鼠标拖选到行外松手会补一次 click，否则选完就自己合上了 */
@@ -141,20 +522,35 @@ function createTraceView(rootEl, opts = {}) {
         // 非 tool.* 事件（usage.unpriced / llm.retry / budget.* / context.budget）没有工具名 ——
         // 这一格整个不渲染，别把「无工具」显示成假工具名（.tr-name 是 flex:none，.tr-io 自然占满）
         if (ev.tool) row.appendChild(el('span', 'tr-name', ev.tool));
-        // 展开态用全文（ev.full），折叠态用摘要（ev.text）—— 折叠态因此与加展开之前逐字一致
-        const io = el('span', 'tr-io', (open ? ev.full : ev.text) || '');
+        // 展开态用全文（ev.full），折叠态用摘要（ev.text）—— 折叠态因此与加展开之前逐字一致。
+        // `full` 是对象/数组时（2026-11-11）：`.tr-io` 仍放**原文**（结构化块挂在行后、由 CSS
+        // 隐藏本格），所以「展开拿到的是原文而不是 62 字符摘要」这条不变量原样成立。
+        const structured = ev.full !== null && typeof ev.full === 'object';
+        const fullText = structured ? rawArg(ev.full) : ev.full || '';
+        const io = el('span', 'tr-io', (open ? fullText : ev.text) || '');
         // 展开后正文已在行里，再挂一个占满整行的原生 tooltip 只会挡视线
         io.title = open ? '' : ev.text || '';
         row.appendChild(io);
         if (ev.full) {
           row.dataset.expandable = '1'; // 可展开标记：CSS 靠它出 caret / cursor，测试靠它找行
           row.appendChild(el('span', 'tr-caret', open ? '▾' : '▸'));
-          if (open) row.className += ' tr-open';
+          if (open) row.className += ' tr-open' + (structured ? ' tr-structured' : '');
           row.addEventListener('click', () => {
             if (!hasSelection()) toggleExpand(ev.key);
           });
         }
         rootEl.appendChild(row);
+        // 结构化正文是**兄弟块**而不是 `.tr-io` 的子节点：行是 flex + nowrap，
+        // 塞进去会把树的列对齐打乱；独立成块才能自己换行、自己缩进。
+        // 折叠状态按事件键取一份带进去（2026-11-11 晚）：块每次重建都 new，状态不能放块里。
+        if (open && structured) {
+          let fold = folds.get(ev.key);
+          if (!fold) {
+            fold = new Map();
+            folds.set(ev.key, fold);
+          }
+          rootEl.appendChild(createFullView(ev.full, { fold }));
+        }
         return;
       }
 
@@ -229,6 +625,7 @@ function createTraceView(rootEl, opts = {}) {
     spanMap.clear();
     spanMap.set('root', traceRoot);
     expanded.clear(); // 展开态属于上一棵树：reset 开新树时一并清掉
+    folds.clear(); // 块内折叠同理：留着只会在下一次点开时出现"莫名已折叠"的状态
     usageAcc.input = 0;
     usageAcc.output = 0;
     usageAcc.cacheRead = 0;
@@ -409,15 +806,24 @@ function eventText(ev) {
 }
 
 /**
- * 事件全文（展开态用）。
+ * 事件全文（展开态用）—— **给原值，不预先序列化**。
  *
- * 只有 `tool.input` 需要单独取：`fmtArg` 把入参摘要**砍到 4 个键 / 每值 21 字符 / 整串 62 字符**，
- * 直接拿摘要当全文就是「假展开」—— 点开看到的还是那 62 个字符。出参与其他事件本身就是原文
- * （`eventText` 原样返回 content），无需二次处理。
- * 原文口径统一在 view.js 的 `rawArg`：官网 playground 的模拟回放也要用它，两处一处定义。
+ * 2026-11-11 起 `full` 的类型本身携带语义：字符串 ⇒ 渲染器走 `.tr-io` 的纯文本换行；
+ * 对象/数组 ⇒ 交给 `full-view.js` 铺成带缩进的结构化块。所以这里必须把**原值**递下去 ——
+ * 若仍在这里 `rawArg` 成字符串，「一大坨 JSON」那条路就永远回不来了（渲染器只能看到字符串）。
+ *
+ * 口径：
+ * - `tool.input` → 入参原值（`fmtArg` 的摘要砍到 4 键 / 每值 21 字符 / 整串 62 字符，
+ *   拿摘要当全文就是「假展开」）；
+ * - `tool.output` → `content` 原值：字符串就是纯文本（含图片块时会是非字符串，正好结构化）；
+ * - 其余事件 → `eventText` 的字符串（它们的体本来就是给人看的一小段说明）。
  */
 function eventFull(ev) {
-  if (ev.name === 'tool.input') return rawArg(ev.body?.input);
+  if (ev.name === 'tool.input') return ev.body?.input ?? '';
+  if (ev.name === 'tool.output') {
+    const c = ev.body?.content;
+    return c == null ? '' : c;
+  }
   return eventText(ev);
 }
 
@@ -680,9 +1086,18 @@ function escapeHtml(s) {
 /* @migor/trace-view —— Agentia trace 调用树渲染器（框架无关、零依赖）。
  * 官网 playground 与 CLI inspector 共用同一份，避免两处渲染漂移。 */
 
+
+
+
+/* 结构化正文块（2026-11-11）：`full` 是对象/数组时，渲染器会给展开行挂上这个块。
+ * 单独导出是因为它是**纯函数式的 DOM 构造**（入参 → 元素），宿主可以拿它渲染任意值 ——
+ * 而 bundle 的导出面必须与这里逐字一致（`test/bundle.test.js`），所以内部件不进公共面、
+ * 这一件必须进。 */
+
 export {
   CAP_ICO,
   capabilityTypeOf,
+  createFullView,
   createTraceView,
   fmtArg,
   fmtMs,

package/dist/inspector/trace-view.css

@@ -217,3 +217,147 @@
   word-break: break-word;
   min-width: 0;
 }
+
+/* —— 结构化正文（2026-11-11）：`full` 是对象/数组时，展开行**下方**多一个兄弟块 ——
+   此前只有一条展开路：整串无缩进的 JSON 塞进 `.tr-io` 再靠 `.tr-open` 换行，20 个键就在
+   400px 宽的右栏里折成十几行连续文本（页面不报错、无溢出，只是人读不了）。
+
+   为什么是兄弟块、不是 `.tr-io` 的子节点：`.tr-row` 是 flex + nowrap，往里塞块级内容会把
+   树的列对齐打乱；独立成块才能自己换行、自己缩进、自己滚。
+
+   为什么 `.tr-io` 只是**隐藏**而不是不渲染：它仍持有原文（`textContent` = `JSON.stringify`），
+   `test/view.test.js` 的「展开拿到的是原文、不是摘要」与用户选中复制都靠它 ——
+   这里改的是画法，不是数据。 */
+.tr-row.tr-structured .tr-io {
+  display: none;
+}
+.tr-full {
+  margin: 2px 0 8px 2.2em; /* 与 `.tr-pre` 的树形前缀对齐，不跟父行抢左侧 */
+  border-left: 2px solid #2a2a31;
+  padding: 4px 0 4px 10px;
+  font-size: 11.5px;
+  line-height: 1.55;
+  /* 与 `.tr-row.tr-open .tr-io` 同一个高度上限：出参动辄上千行，不限高会把整棵树推出屏幕 */
+  max-height: 60vh;
+  overflow: auto;
+  white-space: normal;
+}
+.tr-full-head {
+  display: flex;
+  gap: 10px;
+  margin-bottom: 2px;
+  font-size: 10.5px;
+  color: var(--faint);
+}
+.tr-full-copy {
+  color: var(--ice);
+  cursor: pointer;
+}
+.tr-full-copy:hover {
+  text-decoration: underline;
+}
+/* 每一行自己换行：长字符串（工具出参常见）必须能折，否则横向滚动条把缩进吃掉 */
+.tr-full-line {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  border-radius: 3px;
+}
+/* 可折叠的行（有 data-fold）才给 hover 反馈 —— 叶子行点了没事发生，就不该有可点的样子 */
+.tr-full-line[data-fold] {
+  cursor: pointer;
+}
+.tr-full-line[data-fold]:hover {
+  background: #17171a;
+}
+/* 折叠箭头与 .tr-caret 不同：它不是「这一行能展开」的唯一指示（同一行还写着 `{ object · 4 项 }`，
+   折叠态的值本身就说明了一切），所以不做常显的对比度承诺，跟着 hover 走。
+   **定宽**：叶子行也占这一格（见 full-view.js 的 caretSlot），否则同层键名会在有无箭头之间
+   左右跳 —— 一列键名对齐是这类面板最基本的可读性。 */
+.tr-full-caret {
+  display: inline-block;
+  width: 10px;
+  text-align: center;
+  color: var(--faint);
+  font-size: 10px;
+  margin-right: 3px;
+}
+.tr-full-hint {
+  color: var(--faint);
+}
+/* `⧉` 复制路径：hover 才露。与 .tr-caret 的区别是**它暴露的是动作、不是信息** ——
+   路径的内容（键名）始终写在行里，常显只会给每行多一个字形噪声。
+   没有剪贴板实现时照样显示、点了不谎报成功（见 full-view.js 的 copyInto）。 */
+.tr-full-path {
+  opacity: 0;
+  color: var(--ice);
+  cursor: pointer;
+  font-size: 10px;
+  margin: 0 4px;
+  transition: opacity 0.12s;
+}
+.tr-full-line:hover .tr-full-path,
+.tr-full-table th:hover .tr-full-path {
+  opacity: 1;
+}
+/* —— 同构对象数组 → 表格（2026-11-11 晚）——
+   3 行 `{name,score}` 在树形里要花 9 行重复键名，成表后是 1 行表头 + 3 行数据，
+   而且列天然对齐。只在「真同构且全标量列」时启用（判据在 full-view.js 的 tableColsOf），
+   否则回落树形 —— 表格里没法逐层展开，判错一次就是丢数据。 */
+.tr-full-table {
+  border-collapse: collapse;
+  margin: 2px 0 4px;
+  font-size: 11.5px;
+}
+/* 缩进：列数/行数都是动态的，没有能写死的 inline style（stub 里也没有 style 字段），
+   所以按层级给属性选择器 —— 0 层不写 data-depth，自然不缩进。 */
+.tr-full-table[data-depth="1"] {
+  margin-left: 2ch;
+}
+.tr-full-table[data-depth="2"] {
+  margin-left: 4ch;
+}
+.tr-full-table[data-depth="3"] {
+  margin-left: 6ch;
+}
+.tr-full-table[data-depth="4"] {
+  margin-left: 8ch;
+}
+.tr-full-table[data-depth="5"] {
+  margin-left: 10ch;
+}
+.tr-full-table th {
+  text-align: left;
+  font-weight: 500;
+  color: #71717a;
+  padding: 0 12px 1px 0;
+  border-bottom: 1px solid #27272a;
+  white-space: nowrap;
+}
+.tr-full-table td {
+  padding: 1px 12px 1px 0;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+.tr-full-table tbody tr:hover {
+  background: #17171a;
+}
+/* 缩进用真空格 + `pre`，不靠 padding —— 嵌套层级要能被**选中复制**带出去 */
+.tr-full-indent {
+  white-space: pre;
+}
+.tr-full-key {
+  color: #a1a1aa;
+  margin-right: 2px;
+}
+.tr-full-str {
+  color: #9ece6a;
+}
+.tr-full-num {
+  color: #e0af68;
+}
+.tr-full-bool {
+  color: #7dcfff;
+}
+.tr-full-null {
+  color: var(--faint);
+}

package/dist/inspector/view.js

@@ -17,6 +17,13 @@
  * 宿主需提供的 CSS 变量：--ice --faint --text（见 trace-view.css）。
  */
 
+/* 展开态的正文有两种形状，由 `full` 的类型决定（2026-11-11）：
+ *   - 字符串 → 老路：`.tr-io` 里放原文，靠 `.tr-open` 换行（纯文本正文、官网模拟回放）；
+ *   - 对象/数组 → 追加一个 `.tr-full` 结构化块（折叠 / 成表 / 路径复制），`.tr-io` 由 CSS 隐藏。
+ * 两档并存是刻意的：字符串那条路有 test/style.test.js 的两个不变量守着（最小宽度、caret 常显），
+ * 全换成本件会让那两个守卫失去落点。 */
+import { createFullView } from './full-view.js';
+
 export const CAP_ICO = { tool: '⚙', skill: '◆', prompt: '¶', subagent: '⊕' };
 
 /** 能力类型取自名字前缀（tool: / skill: / prompt: / subagent:） */
@@ -88,6 +95,9 @@ export function createTraceView(rootEl, opts = {}) {
   /* 展开态的行 key 集合 + 事件 key 发号器。两者都必须活在 renderTrace 之外：
      渲染是【全量重建】（rootEl.innerHTML = ''），状态放进 DOM 或渲染过程里就活不过下一次事件。 */
   const expanded = new Set();
+  /* 结构化块内部的折叠状态，按事件键一份（`ev.key` → 路径 → 是否展开）。
+     与 `expanded` 同一条理由，而且更硬：块本身每次重建都会 new 一个，状态只能挂在树上。 */
+  const folds = new Map();
   let evSeq = 0;
 
   /** 正在选文本时不要收起/展开 —— 鼠标拖选到行外松手会补一次 click，否则选完就自己合上了 */
@@ -136,20 +146,35 @@ export function createTraceView(rootEl, opts = {}) {
         // 非 tool.* 事件（usage.unpriced / llm.retry / budget.* / context.budget）没有工具名 ——
         // 这一格整个不渲染，别把「无工具」显示成假工具名（.tr-name 是 flex:none，.tr-io 自然占满）
         if (ev.tool) row.appendChild(el('span', 'tr-name', ev.tool));
-        // 展开态用全文（ev.full），折叠态用摘要（ev.text）—— 折叠态因此与加展开之前逐字一致
-        const io = el('span', 'tr-io', (open ? ev.full : ev.text) || '');
+        // 展开态用全文（ev.full），折叠态用摘要（ev.text）—— 折叠态因此与加展开之前逐字一致。
+        // `full` 是对象/数组时（2026-11-11）：`.tr-io` 仍放**原文**（结构化块挂在行后、由 CSS
+        // 隐藏本格），所以「展开拿到的是原文而不是 62 字符摘要」这条不变量原样成立。
+        const structured = ev.full !== null && typeof ev.full === 'object';
+        const fullText = structured ? rawArg(ev.full) : ev.full || '';
+        const io = el('span', 'tr-io', (open ? fullText : ev.text) || '');
         // 展开后正文已在行里，再挂一个占满整行的原生 tooltip 只会挡视线
         io.title = open ? '' : ev.text || '';
         row.appendChild(io);
         if (ev.full) {
           row.dataset.expandable = '1'; // 可展开标记：CSS 靠它出 caret / cursor，测试靠它找行
           row.appendChild(el('span', 'tr-caret', open ? '▾' : '▸'));
-          if (open) row.className += ' tr-open';
+          if (open) row.className += ' tr-open' + (structured ? ' tr-structured' : '');
           row.addEventListener('click', () => {
             if (!hasSelection()) toggleExpand(ev.key);
           });
         }
         rootEl.appendChild(row);
+        // 结构化正文是**兄弟块**而不是 `.tr-io` 的子节点：行是 flex + nowrap，
+        // 塞进去会把树的列对齐打乱；独立成块才能自己换行、自己缩进。
+        // 折叠状态按事件键取一份带进去（2026-11-11 晚）：块每次重建都 new，状态不能放块里。
+        if (open && structured) {
+          let fold = folds.get(ev.key);
+          if (!fold) {
+            fold = new Map();
+            folds.set(ev.key, fold);
+          }
+          rootEl.appendChild(createFullView(ev.full, { fold }));
+        }
         return;
       }
 
@@ -224,6 +249,7 @@ export function createTraceView(rootEl, opts = {}) {
     spanMap.clear();
     spanMap.set('root', traceRoot);
     expanded.clear(); // 展开态属于上一棵树：reset 开新树时一并清掉
+    folds.clear(); // 块内折叠同理：留着只会在下一次点开时出现"莫名已折叠"的状态
     usageAcc.input = 0;
     usageAcc.output = 0;
     usageAcc.cacheRead = 0;

package/dist/inspector-routes.js

@@ -108,6 +108,10 @@ const STATIC = new Map([
     ['index.js', join(ASSETS, 'index.js')],
     ['view.js', join(ASSETS, 'view.js')],
     ['fromTrace.js', join(ASSETS, 'fromTrace.js')],
+    /* 结构化展开正文（2026-11-11）：`full` 是对象/数组时，view.js 用它铺缩进/着色/复制块。
+     * 与上面四个同性质 —— 渲染器的一部分，页面**会** import 它（view.js 的静态 import 被
+     * 剥成页面级 import 时它必须可达），漏登记 = 浏览器 404 = 面板整块模块求值失败。 */
+    ['full-view.js', join(ASSETS, 'full-view.js')],
     ['summary.js', join(ASSETS, 'summary.js')],
     ['trace-view.css', join(ASSETS, 'trace-view.css')],
     /* 单文件 bundle（`agentia view` 内联进自包含 HTML 用）。⚠️ **页面不 import 它** ——

package/dist/templates/package.json

@@ -11,10 +11,10 @@
     "typecheck": "tsc --noEmit -p tsconfig.json"
   },
   "dependencies": {
-    "@migor/agentia": "^0.10.6"
+    "@migor/agentia": "^0.10.7"
   },
   "devDependencies": {
-    "@migor/cli": "^0.10.6",
+    "@migor/cli": "^0.10.7",
     "tsx": "^4.19.0",
     "typescript": "^7.0.2",
     "@types/node": "^22.0.0"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@migor/cli",
-  "version": "0.10.6",
+  "version": "0.10.7",
   "description": "CLI for the Agentia framework: scaffold a project, generate a capability, and open a local trace inspector for runs.",
   "type": "module",
   "bin": {