@bolloon/bolloon-agent 0.1.35 → 0.1.36

package/dist/web/ui/step-timeline.js

@@ -0,0 +1,375 @@
+/**
+ * step-timeline.ts — 气泡内 4 状态步骤条 (2026-06-15)
+ *
+ * 职责 (单一):
+ *   - 给每条 AI 消息挂一个可折叠/展开的步骤条
+ *   - 状态机: idle ○ / active ● / done 🟢 / error 🔴
+ *   - 摘要条 + 详情区共用同一份 Step[] 数据
+ *   - 流式期间在 streaming 元素内, finalize 时搬到正式 message
+ *   - 折叠状态按 channel 持久化 (localStorage)
+ *
+ * 状态 (模块私有, 每个 message 一个实例):
+ *   - steps: Step[]
+ *   - currentIndex: number
+ *   - expanded: boolean  (受 localStorage 影响)
+ *
+ * 输入 (从 message-renderer 调用):
+ *   - createEmptyStepTimeline(channelId) -> HTMLElement
+ *   - mountStepTimeline(messageEl, channelId)  // 已有 message 上挂 timeline
+ *   - pushStepToTimeline(timelineEl, type, data)  // 订阅 step_start/done/error
+ *   - migrateStepTimeline(fromEl, toEl)  // finalize 时搬家
+ *
+ * 输出 (DOM):
+ *   - .step-timeline / .step-timeline-summary / .step-timeline-body
+ *   - .step-dot (摘要条圆点) / .step-timeline-node (详情区节点)
+ */
+const MAX_VISIBLE_NODES = 8;
+const STORAGE_PREFIX = 'bolloon.stepTimeline.expanded.';
+const stateMap = new WeakMap();
+// ---------------------------------------------------------------------------
+// 工具: 持久化
+// ---------------------------------------------------------------------------
+function readExpanded(channelId) {
+    if (!channelId)
+        return false;
+    try {
+        return localStorage.getItem(STORAGE_PREFIX + channelId) === '1';
+    }
+    catch {
+        return false;
+    }
+}
+function writeExpanded(channelId, expanded) {
+    if (!channelId)
+        return;
+    try {
+        localStorage.setItem(STORAGE_PREFIX + channelId, expanded ? '1' : '0');
+    }
+    catch { /* localStorage 写失败 (隐私模式), 静默 */ }
+}
+// ---------------------------------------------------------------------------
+// 工具: 摘要条 title
+// ---------------------------------------------------------------------------
+function computeTitle(steps) {
+    if (steps.length === 0)
+        return '执行步骤';
+    // 优先 active, 其次最后一个 error
+    const activeIdx = steps.findIndex(s => s.status === 'active');
+    if (activeIdx >= 0)
+        return `● 执行中 · ${steps[activeIdx].name}`;
+    const lastErrorIdx = (() => {
+        for (let i = steps.length - 1; i >= 0; i--) {
+            if (steps[i].status === 'error')
+                return i;
+        }
+        return -1;
+    })();
+    if (lastErrorIdx >= 0)
+        return `✗ 失败 · ${steps[lastErrorIdx].name}`;
+    return `✓ 已完成 · ${steps.length} 步`;
+}
+// ---------------------------------------------------------------------------
+// 核心: 渲染 (摘要条 + 详情区, 共用 steps 状态)
+// ---------------------------------------------------------------------------
+function render(timelineEl) {
+    const state = stateMap.get(timelineEl);
+    if (!state)
+        return;
+    const { steps, expanded, showAll } = state;
+    const titleEl = timelineEl.querySelector('[data-current-tool]');
+    if (titleEl)
+        titleEl.textContent = computeTitle(steps);
+    // 摘要条 dots
+    const dotsEl = timelineEl.querySelector('[data-dots]');
+    if (dotsEl) {
+        // diff: 复用现有 dot, 多余 remove, 缺少 append
+        const existing = Array.from(dotsEl.children);
+        for (let i = 0; i < steps.length; i++) {
+            const step = steps[i];
+            let dot = existing[i];
+            if (!dot) {
+                dot = document.createElement('span');
+                dot.className = 'step-dot';
+                dot.setAttribute('data-index', String(i));
+                dotsEl.appendChild(dot);
+            }
+            dot.setAttribute('data-status', step.status);
+            dot.setAttribute('title', `${step.name} · ${step.status}`);
+        }
+        while (dotsEl.children.length > steps.length) {
+            dotsEl.removeChild(dotsEl.lastChild);
+        }
+    }
+    // 详情区 list
+    const listEl = timelineEl.querySelector('[data-list]');
+    if (listEl) {
+        const hiddenCount = Math.max(0, steps.length - MAX_VISIBLE_NODES);
+        const visibleSteps = showAll ? steps : steps.slice(-MAX_VISIBLE_NODES);
+        const existing = Array.from(listEl.children);
+        let htmlIdx = 0;
+        // "+N 更多" 折叠行 (仅在 showAll=false 且有 hidden 时)
+        if (!showAll && hiddenCount > 0) {
+            let moreBtn = existing[htmlIdx];
+            if (!moreBtn || !moreBtn.classList.contains('step-timeline-more')) {
+                moreBtn = document.createElement('li');
+                moreBtn.className = 'step-timeline-more';
+                moreBtn.setAttribute('role', 'button');
+                moreBtn.textContent = `+ ${hiddenCount} 更多`;
+                moreBtn.onclick = () => {
+                    state.showAll = true;
+                    render(timelineEl);
+                };
+                if (existing[htmlIdx] && existing[htmlIdx] !== moreBtn) {
+                    listEl.replaceChild(moreBtn, existing[htmlIdx]);
+                }
+                else {
+                    listEl.appendChild(moreBtn);
+                }
+            }
+            else {
+                moreBtn.textContent = `+ ${hiddenCount} 更多`;
+            }
+            htmlIdx++;
+        }
+        for (let i = 0; i < visibleSteps.length; i++) {
+            const step = visibleSteps[i];
+            const realIndex = showAll ? i : (steps.length - visibleSteps.length + i);
+            let node = existing[htmlIdx];
+            if (!node || !node.classList.contains('step-timeline-node')) {
+                node = document.createElement('li');
+                node.className = 'step-timeline-node';
+                node.setAttribute('data-index', String(realIndex));
+                const marker = document.createElement('span');
+                marker.className = 'step-timeline-marker';
+                const label = document.createElement('span');
+                label.className = 'step-timeline-label';
+                const args = document.createElement('span');
+                args.className = 'step-timeline-args';
+                node.appendChild(marker);
+                node.appendChild(label);
+                node.appendChild(args);
+                if (existing[htmlIdx] && existing[htmlIdx] !== node) {
+                    listEl.replaceChild(node, existing[htmlIdx]);
+                }
+                else {
+                    listEl.appendChild(node);
+                }
+            }
+            else {
+                node.setAttribute('data-index', String(realIndex));
+            }
+            node.setAttribute('data-status', step.status);
+            const label = node.querySelector('.step-timeline-label');
+            if (label)
+                label.textContent = step.name;
+            const argsEl = node.querySelector('.step-timeline-args');
+            if (argsEl) {
+                const argStr = step.args && Object.keys(step.args).length > 0
+                    ? JSON.stringify(step.args).slice(0, 60)
+                    : '';
+                argsEl.textContent = argStr;
+                argsEl.style.display = argStr ? '' : 'none';
+            }
+            htmlIdx++;
+        }
+        // 清理多余 li
+        while (listEl.children.length > htmlIdx) {
+            listEl.removeChild(listEl.lastChild);
+        }
+    }
+    // 折叠态: 空状态显示占位, 有节点就保持
+    if (steps.length === 0) {
+        timelineEl.setAttribute('data-empty', 'true');
+    }
+    else {
+        timelineEl.removeAttribute('data-empty');
+    }
+    // 折叠 class
+    const body = timelineEl.querySelector('[data-body]');
+    if (body) {
+        if (expanded) {
+            body.style.maxHeight = body.scrollHeight + 'px';
+            setTimeout(() => {
+                // 动画结束后清掉, 让内容自适应 (新 step 进来时能撑开)
+                if (state.expanded)
+                    body.style.maxHeight = '';
+            }, 300);
+        }
+        else {
+            body.style.maxHeight = '0';
+        }
+    }
+    const arrow = timelineEl.querySelector('.step-timeline-arrow');
+    if (arrow)
+        arrow.style.transform = expanded ? 'rotate(180deg)' : 'rotate(0deg)';
+    // 自动滚到底 (新节点进来时, 详情区跟到底)
+    if (expanded && listEl) {
+        listEl.scrollTop = listEl.scrollHeight;
+    }
+}
+// ---------------------------------------------------------------------------
+// 公共: 创建一个空 timeline (AI 消息创建时挂的占位)
+// ---------------------------------------------------------------------------
+export function createEmptyStepTimeline(channelId = null) {
+    const root = document.createElement('div');
+    root.className = 'step-timeline';
+    root.setAttribute('data-step-timeline', '');
+    root.setAttribute('data-empty', 'true');
+    // 摘要条
+    const summary = document.createElement('div');
+    summary.className = 'step-timeline-summary';
+    summary.setAttribute('data-summary', '');
+    const titleSpan = document.createElement('span');
+    titleSpan.className = 'step-timeline-title';
+    const titleContent = document.createElement('span');
+    titleContent.setAttribute('data-current-tool', '');
+    titleContent.textContent = '执行步骤';
+    titleSpan.appendChild(titleContent);
+    const dots = document.createElement('div');
+    dots.className = 'step-timeline-dots';
+    dots.setAttribute('data-dots', '');
+    const arrow = document.createElement('span');
+    arrow.className = 'step-timeline-arrow';
+    arrow.textContent = '▾';
+    summary.appendChild(titleSpan);
+    summary.appendChild(dots);
+    summary.appendChild(arrow);
+    summary.onclick = () => {
+        const state = stateMap.get(root);
+        if (!state)
+            return;
+        state.expanded = !state.expanded;
+        writeExpanded(state.channelId, state.expanded);
+        render(root);
+    };
+    // 详情区
+    const body = document.createElement('div');
+    body.className = 'step-timeline-body';
+    body.setAttribute('data-body', '');
+    const list = document.createElement('ul');
+    list.className = 'step-timeline-list';
+    list.setAttribute('data-list', '');
+    body.appendChild(list);
+    root.appendChild(summary);
+    root.appendChild(body);
+    // 初始折叠态
+    const initialExpanded = readExpanded(channelId);
+    stateMap.set(root, {
+        steps: [],
+        currentIndex: -1,
+        expanded: initialExpanded,
+        channelId: channelId || null,
+        showAll: false,
+    });
+    render(root);
+    return root;
+}
+// ---------------------------------------------------------------------------
+// 公共: 把 timeline 挂到 message 上 (初始化或补挂)
+// ---------------------------------------------------------------------------
+export function mountStepTimeline(messageEl, channelId) {
+    // 已经挂过 → 复用
+    const existing = messageEl.querySelector('[data-step-timeline]');
+    if (existing) {
+        const state = stateMap.get(existing);
+        if (state && channelId && !state.channelId)
+            state.channelId = channelId;
+        return existing;
+    }
+    // 找插入点: 在 .bubble 之后, .message-actions 之前
+    const bubble = messageEl.querySelector('.bubble');
+    const actions = messageEl.querySelector('.message-actions');
+    const timeline = createEmptyStepTimeline(channelId);
+    if (actions && actions.parentNode === messageEl) {
+        messageEl.insertBefore(timeline, actions);
+    }
+    else if (bubble && bubble.parentNode === messageEl) {
+        bubble.parentNode.insertBefore(timeline, bubble.nextSibling);
+    }
+    else {
+        messageEl.appendChild(timeline);
+    }
+    return timeline;
+}
+// ---------------------------------------------------------------------------
+// 公共: 推一个 step 事件 (start/done/error)
+// ---------------------------------------------------------------------------
+export function pushStepToTimeline(timelineEl, eventType, data) {
+    const state = stateMap.get(timelineEl);
+    if (!state)
+        return;
+    const { steps } = state;
+    if (eventType === 'step_start') {
+        state.currentIndex = steps.length;
+        steps.push({
+            name: data.tool,
+            status: 'active',
+            args: data.args,
+            eventType,
+        });
+    }
+    else {
+        // step_done / step_error — 找当前 active 节点关闭
+        // 优先匹配 currentIndex, 其次回退到最后一个 active
+        let targetIdx = state.currentIndex;
+        if (targetIdx < 0 || !steps[targetIdx] || steps[targetIdx].name !== data.tool) {
+            // 兜底: 找最后一个同名 active
+            for (let i = steps.length - 1; i >= 0; i--) {
+                if (steps[i].name === data.tool && steps[i].status === 'active') {
+                    targetIdx = i;
+                    break;
+                }
+            }
+        }
+        if (targetIdx < 0) {
+            // 没有 active 节点匹配, 当作新 error 节点
+            targetIdx = steps.length;
+            steps.push({ name: data.tool, status: 'error', eventType });
+        }
+        if (eventType === 'step_done') {
+            steps[targetIdx].status = data.success === false ? 'error' : 'done';
+            if (data.output)
+                steps[targetIdx].output = data.output;
+            if (data.error)
+                steps[targetIdx].error = data.error;
+        }
+        else {
+            steps[targetIdx].status = 'error';
+            if (data.error)
+                steps[targetIdx].error = data.error;
+        }
+        steps[targetIdx].eventType = eventType;
+        state.currentIndex = -1;
+    }
+    render(timelineEl);
+}
+// ---------------------------------------------------------------------------
+// 公共: finalize 时把 timeline 元素从 from 搬到 to (避免重渲)
+// 接受 timelineEl 本身或 fromEl 内部的 timeline
+// ---------------------------------------------------------------------------
+export function migrateStepTimeline(fromEl, toEl) {
+    const fromTimeline = fromEl.querySelector('[data-step-timeline]');
+    const toTimeline = toEl.querySelector('[data-step-timeline]');
+    if (!fromTimeline)
+        return;
+    // 移除 toEl 的占位, 搬 fromEl 的过来
+    if (toTimeline && toTimeline !== fromTimeline) {
+        toTimeline.remove();
+    }
+    if (toTimeline !== fromTimeline) {
+        toEl.appendChild(fromTimeline);
+    }
+    // 重渲一次 (channelId 注入)
+    const state = stateMap.get(fromTimeline);
+    if (state) {
+        render(fromTimeline);
+    }
+}
+// ---------------------------------------------------------------------------
+// 公共: 拿到一个 message 内的 timeline (无则返回 null)
+// ---------------------------------------------------------------------------
+export function getStepTimeline(messageEl) {
+    if (!messageEl)
+        return null;
+    return messageEl.querySelector('[data-step-timeline]');
+}

package/lefthook.yml

@@ -13,6 +13,10 @@ pre-commit:
     tsc-check:
       glob: "src/**/*.{ts,tsx}"
       run: npx tsc --noEmit
+    # system-prompt 字符上限 + 版本标记 + hibsml 脱除 (layer 改动时触发)
+    validate-prompt-layers:
+      glob: "src/llm/system-prompt/layers/**/*.md"
+      run: npx tsx -r dotenv/config scripts/validate-system-prompt.ts
 
 pre-push:
   parallel: true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bolloon/bolloon-agent",
-  "version": "0.1.35",
+  "version": "0.1.36",
   "type": "module",
   "description": "P2P AI Document Agent - 全局安装后执行 `bolloon` 启动产品",
   "main": "dist/cli.js",

package/scripts/auto-evolve-loop.ts

@@ -31,6 +31,64 @@ import * as path from 'path';
 const pExec = promisify(execFile);
 const REPO = process.cwd();
 
+/**
+ * P2P 协作 broadcaster (行级 reserve + commit-intent 广播)
+ * 走现有 P2PDirect + 'bolloon-agent-harness' topic, 不开新端口.
+ * 失败 → 整个 loop 仍能跑 (broadcaster = null 时跳过), 不阻塞自迭代.
+ */
+let broadcaster: any = null;
+async function initBroadcaster(): Promise<void> {
+  try {
+    const { P2PDirect } = await import('../src/network/p2p-direct.js');
+    const { SourceIntentBroadcaster } = await import('../src/network/source-intent-broadcaster.js');
+    const hostname = await pExec('hostname', []).then(r => r.stdout.trim()).catch(() => 'unknown');
+    const p2p = new P2PDirect({ name: 'auto-evolve', role: 'auto-evolve-agent' });
+    await p2p.start();
+    const sb = new SourceIntentBroadcaster(p2p, {
+      agent: `agent-${hostname}`,
+      topic: 'bolloon-agent-harness',
+    });
+    await sb.start();
+
+    // P2P Hook 4: 监听远端事件, 打印到日志 (聊天框能看)
+    sb.on('remoteReserve', (m: any) => {
+      console.log(`[p2p] 远端 ${m.agent} reserve ${m.file} 行 ${m.lines[0]}-${m.lines[1]} (task=${m.taskId})`);
+    });
+    sb.on('remoteConflict', (c: any) => {
+      console.log(`[p2p] 冲突: 远端 ${c.agent} 也想改 ${JSON.stringify(c.lines)} — 我方让步 / 改方向`);
+    });
+    sb.on('remoteRelease', (m: any) => {
+      console.log(`[p2p] 远端 ${m.agent} release ${m.file} 行 ${m.lines[0]}-${m.lines[1]}`);
+    });
+    sb.on('remoteCommit', (m: any) => {
+      console.log(`[p2p] 远端 ${m.agent} commit ${m.file} sha=${m.sha} diffHash=${m.diffHash}`);
+    });
+
+    // 把 live reserves 注入到 LLM 系统 prompt (pi-ai Hook)
+    try {
+      const pi = await import('../src/llm/pi-ai.js');
+      pi.setSystemPrependProvider(() => {
+        const live = sb.liveReserves();
+        if (live.length === 0) return null;
+        return [
+          '【行级 P2P 协调】其他智能体正在改的代码行:',
+          ...live.map(r => `  - ${r.file} 行 ${r.lines[0]}-${r.lines[1]} (${r.agent}, task=${r.taskId})`),
+          '你即将改的代码行如果重叠, 请让出或改别的行.',
+        ].join('\n');
+      });
+      console.log('[p2p] systemPrependProvider 已注册');
+    } catch (err: any) {
+      console.warn(`[p2p] systemPrependProvider 注册失败: ${err.message?.slice(0, 100)}`);
+    }
+
+    broadcaster = sb;
+    console.log('[p2p] broadcaster 已启动');
+  } catch (err: any) {
+    console.warn(`[p2p] broadcaster 启动失败 (loop 继续): ${err.message?.slice(0, 200)}`);
+    broadcaster = null;
+  }
+}
+
 interface VitestResult {
   failed: number;
   passed: number;
@@ -238,6 +296,28 @@ async function commitPatch(patchId: string): Promise<boolean> {
       } catch { /* binary or removed */ }
     }
     await pExec('git', ['commit', '-m', `auto-evolve: ${patchId} (LLM 修复)`], { cwd: REPO });
+
+    // P2P Hook 2: 广播 commit-intent (供对方智能体做轻量审计 / 触发 push)
+    if (broadcaster) {
+      try {
+        const { stdout: shaOut } = await pExec('git', ['rev-parse', '--short', 'HEAD'], { cwd: REPO });
+        const sha = shaOut.trim();
+        for (const f of files) {
+          // 简化: 整文件视为 [1, 99999], diffHash 用 patchId
+          await broadcaster.broadcastCommitIntent({
+            taskId: patchId,
+            file: f,
+            lines: [1, 99999],
+            sha,
+            diffHash: patchId.slice(0, 16),
+          });
+        }
+        console.log(`[p2p] commit-intent 广播: ${files.length} 个文件, sha=${sha}`);
+      } catch (err: any) {
+        console.warn(`[p2p] commit-intent 广播失败: ${err.message?.slice(0, 100)}`);
+      }
+    }
+
     return true;
   } catch (err: any) {
     console.error(`[loop] commit 失败: ${err.message?.slice(0, 200)}`);
@@ -266,6 +346,9 @@ async function main() {
     if (args[i] === '--target' && args[i + 1]) targetFile = args[++i];
   }
 
+  // P2P Hook 1: 启动 broadcaster (失败不阻塞 loop)
+  await initBroadcaster();
+
   // 必须先有 baseline
   if (!(await fs.stat('.last-auto-evolve-baseline').catch(() => null))) {
     console.log('[loop] 没 baseline, 先打一个');
@@ -301,6 +384,28 @@ async function main() {
       .replace('{{SOURCE}}', sourceCtx);
 
     console.log('[loop] 调 LLM 修...');
+
+    // P2P Hook 3: best-effort reserve 我方即将改的文件 (行级粒度, 整文件 [1, 99999])
+    // 失败/冲突 → 仅 log, 不阻塞 loop (LLM 已经能从 systemPrepend 看到 liveReserves)
+    if (broadcaster) {
+      const filesToReserve = [firstTest, ...(srcCtx.match(/^=== SRC FILE \(imported\) ===\s*\n([^\n]+)$/m)?.[1] ? [srcCtx.match(/^=== SRC FILE \(imported\) ===\s*\n([^\n]+)$/m)![1]] : [])]
+        .map(p => p.replace(REPO + '/', ''))
+        .filter((p, i, a) => p && a.indexOf(p) === i);
+      for (const f of filesToReserve) {
+        if (!f || f === 'unknown') continue;
+        try {
+          const r = await broadcaster.reserve({ taskId: patchId || `iter-${iter}`, file: f, lines: [1, 99999] });
+          if (r.ok) {
+            console.log(`[p2p] reserve OK: ${f}`);
+          } else {
+            console.log(`[p2p] reserve 冲突: ${f} 已被 ${r.existing.agent} 占用, LLM 会避开`);
+          }
+        } catch (err: any) {
+          console.warn(`[p2p] reserve 失败 (继续): ${err.message?.slice(0, 80)}`);
+        }
+      }
+    }
+
     const llmOut = await callLLM(prompt);
     const diff = extractDiff(llmOut);
     if (!diff) {

package/scripts/build-web.ts

@@ -51,12 +51,46 @@ async function main() {
     minify: false,
   });
 
+  // 2026-06-15: 编译 message-renderer.ts (对话显示 UI 模块)
+  //   esbuild 编译 .ts → dist/web/ui/message-renderer.js (ESM, 浏览器侧 <script type="module"> 加载)
+  console.log('[build-web] 编译 message-renderer.ts...');
+  await fs.mkdir(path.join(DIST_WEB, 'ui'), { recursive: true });
+  await esbuild.build({
+    entryPoints: [path.join(ROOT, 'src/web/ui/message-renderer.ts')],
+    outfile: path.join(DIST_WEB, 'ui/message-renderer.js'),
+    format: 'esm',
+    target: 'es2022',
+    platform: 'browser',
+    minify: false,
+  });
+
+  // 2026-06-15: 编译 step-timeline.ts (气泡内 4 状态步骤条)
+  console.log('[build-web] 编译 step-timeline.ts...');
+  await esbuild.build({
+    entryPoints: [path.join(ROOT, 'src/web/ui/step-timeline.ts')],
+    outfile: path.join(DIST_WEB, 'ui/step-timeline.js'),
+    format: 'esm',
+    target: 'es2022',
+    platform: 'browser',
+    minify: false,
+  });
+
+  // 编译主客户端入口 (classic script, 非 module; 由 index.html 以 /client.js 加载)
+  console.log('[build-web] 编译 client.ts...');
+  await esbuild.build({
+    entryPoints: [path.join(ROOT, 'src/web/client.ts')],
+    outfile: path.join(DIST_WEB, 'client.js'),
+    format: 'iife',
+    target: 'es2022',
+    platform: 'browser',
+    minify: false,
+  });
+
   // 复制静态文件
   console.log('[build-web] 复制静态文件...');
   await fs.copyFile(path.join(ROOT, 'src/web/index.html'), path.join(DIST_WEB, 'index.html'));
   await fs.copyFile(path.join(ROOT, 'src/web/api-config.html'), path.join(DIST_WEB, 'api-config.html'));
   await fs.copyFile(path.join(ROOT, 'src/web/style.css'), path.join(DIST_WEB, 'style.css'));
-  await fs.copyFile(path.join(ROOT, 'src/web/client.js'), path.join(DIST_WEB, 'client.js'));
   // 复制 PWA manifest (index.html 里有 <link rel="manifest">, 否则浏览器会 404)
   await fs.copyFile(path.join(ROOT, 'src/web/manifest.json'), path.join(DIST_WEB, 'manifest.json'));
   // 复制 icons 目录 (manifest.json 里引用了 favicon 等)