foxclaw 0.1.2 → 0.1.4

package/python/frontend/v3/index.html

@@ -3,11 +3,11 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Foxclaw Deck · v3</title>
+  <title>Foxclaw</title>
   <!-- 内联 SVG 图标:不新增静态文件,也避免浏览器探 /favicon.ico 报 404 -->
   <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='9' fill='%23179d5f'/><circle cx='16' cy='16' r='6.5' fill='%23f4fbf0'/></svg>" />
-  <script type="module" crossorigin src="/v3/assets/index-BD7VPbMV.js"></script>
-  <link rel="stylesheet" crossorigin href="/v3/assets/index-CAvnYWGH.css">
+  <script type="module" crossorigin src="/v3/assets/index-tN90dpUH.js"></script>
+  <link rel="stylesheet" crossorigin href="/v3/assets/index-JKfHlb-a.css">
 </head>
 <body>
   <div id="app"></div>

package/python/frontend/widget_runtime.js

@@ -1,39 +1,16 @@
-/* ════════════════════════════════════════════════════════════
-   FOXCLAW DECK — Widget Runtime
-   可插拔 widget 系统。新模块只需 registerWidget() 一次。
-   ════════════════════════════════════════════════════════════ */
 
 const WidgetRuntime = (() => {
 
-  // ── 注册表:定义有哪些 widget 类型 ──
   const registry = new Map();
 
-  // ── 实例:当前布局中存在的 widget ──
-  // { instanceId, widgetId, column, order }
   let instances = [];
 
-  // ── 事件订阅:widgetId -> Set<eventType> ──
   const eventSubs = new Map();
 
-  // ── 共享上下文,所有 widget 都能访问 ──
   let ctx = {};
 
-  // ── DOM 列引用 ──
   const columns = {};
 
-  /* ───────────────────────────────────────────
-     注册一个 widget 类型
-     spec = {
-       id, title, icon,
-       defaultColumn: 'left'|'center'|'right',
-       size: {minH, maxH, flex},
-       events: ['harness_block', ...],   // 关心的事件类型
-       render(el, ctx, instance),         // 渲染主体
-       onEvent(evt, el, ctx),             // 收到订阅事件
-       onAgentChange(agentId, el, ctx),   // 激活 Agent 变化
-       refresh(el, ctx, agentId),         // 数据刷新
-     }
-  ─────────────────────────────────────────── */
   function register(spec) {
     if (!spec.id) throw new Error('widget 必须有 id');
     registry.set(spec.id, {
@@ -46,14 +23,12 @@ const WidgetRuntime = (() => {
       refresh: null,
       ...spec,
     });
-    // 建立事件订阅索引
     (spec.events || []).forEach(ev => {
       if (!eventSubs.has(ev)) eventSubs.set(ev, new Set());
       eventSubs.get(ev).add(spec.id);
     });
   }
 
-  /* 初始化:绑定列容器 + 共享上下文 */
   function init(columnEls, sharedCtx) {
     columns.left   = columnEls.left;
     columns.center = columnEls.center;
@@ -61,7 +36,6 @@ const WidgetRuntime = (() => {
     ctx = sharedCtx || {};
   }
 
-  /* 设置布局(从默认或 localStorage 恢复) */
   function setLayout(layout) {
     instances = layout.map((item, i) => ({
       instanceId: item.instanceId || `inst_${item.widgetId}_${i}`,
@@ -72,7 +46,6 @@ const WidgetRuntime = (() => {
     renderAll();
   }
 
-  /* 默认布局:每个注册的 widget 放进它的 defaultColumn */
   function defaultLayout() {
     return [...registry.values()].map((spec, i) => ({
       instanceId: `inst_${spec.id}`,
@@ -82,7 +55,6 @@ const WidgetRuntime = (() => {
     }));
   }
 
-  /* 渲染全部实例 */
   function renderAll() {
     Object.values(columns).forEach(col => { if (col) col.innerHTML = ''; });
     const byCol = { left: [], center: [], right: [] };
@@ -96,7 +68,6 @@ const WidgetRuntime = (() => {
     });
   }
 
-  /* 挂载单个 widget 到 DOM */
   function mountWidget(inst, colName) {
     const spec = registry.get(inst.widgetId);
     if (!spec) return;
@@ -127,26 +98,22 @@ const WidgetRuntime = (() => {
     inst._el = panel;
     inst._body = body;
 
-    // 移除按钮
     panel.querySelector('.ph-remove').onclick = (e) => {
       e.stopPropagation();
       removeInstance(inst.instanceId);
     };
 
-    // 调用 widget 自己的渲染
     try {
       spec.render(body, ctx, inst);
     } catch (err) {
       body.innerHTML = `<div class="empty">渲染错误: ${err.message}</div>`;
     }
 
-    // 首次同步当前 Agent
     if (spec.onAgentChange && ctx.activeAgent) {
       try { spec.onAgentChange(ctx.activeAgent, body, ctx); } catch {}
     }
   }
 
-  /* 事件分发:把事件发给所有订阅的 widget 实例 */
   function dispatch(eventType, payload) {
     const subscribers = eventSubs.get(eventType);
     if (!subscribers) return;
@@ -159,7 +126,6 @@ const WidgetRuntime = (() => {
     });
   }
 
-  /* 通知所有 widget:激活 Agent 变了 */
   function notifyAgentChange(agentId) {
     ctx.activeAgent = agentId;
     instances.forEach(inst => {
@@ -170,7 +136,6 @@ const WidgetRuntime = (() => {
     });
   }
 
-  /* 刷新所有 widget 的数据 */
   function refreshAll(agentId) {
     instances.forEach(inst => {
       const spec = registry.get(inst.widgetId);
@@ -180,7 +145,6 @@ const WidgetRuntime = (() => {
     });
   }
 
-  /* 设置某个实例的 head status 文本 */
   function setStatus(instanceId, text) {
     const inst = instances.find(i => i.instanceId === instanceId);
     if (inst && inst._el) {
@@ -189,7 +153,6 @@ const WidgetRuntime = (() => {
     }
   }
 
-  /* ── 增删实例 ── */
   function addInstance(widgetId, column) {
     const spec = registry.get(widgetId);
     if (!spec) return;
@@ -214,7 +177,6 @@ const WidgetRuntime = (() => {
     saveLayout();
   }
 
-  /* ── 拖拽:重排实例 ── */
   function captureLayoutFromDOM() {
     const newInstances = [];
     ['left', 'center', 'right'].forEach(colName => {
@@ -239,7 +201,6 @@ const WidgetRuntime = (() => {
     saveLayout();
   }
 
-  /* ── 持久化 ── */
   function saveLayout() {
     try {
       const layout = instances.map(i => ({
@@ -256,7 +217,6 @@ const WidgetRuntime = (() => {
     try {
       const saved = JSON.parse(localStorage.getItem('foxclaw_widget_layout'));
       if (saved && saved.length) {
-        // 过滤掉已不存在的 widget 类型
         const valid = saved.filter(i => registry.has(i.widgetId));
         if (valid.length) { setLayout(valid); return true; }
       }
@@ -264,7 +224,6 @@ const WidgetRuntime = (() => {
     return false;
   }
 
-  /* ── 编辑模式:显示/隐藏移除按钮 ── */
   function setEditMode(on) {
     instances.forEach(inst => {
       if (!inst._el) return;
@@ -273,7 +232,6 @@ const WidgetRuntime = (() => {
     });
   }
 
-  /* ── 面板库:列出未激活的 widget 供添加 ── */
   function getLibrary() {
     return [...registry.values()].map(spec => ({
       id: spec.id,
@@ -283,7 +241,6 @@ const WidgetRuntime = (() => {
     }));
   }
 
-  /* 公开 API */
   return {
     register, init, setLayout, defaultLayout, renderAll,
     dispatch, notifyAgentChange, refreshAll, setStatus,

package/python/frontend/widgets.js

@@ -1,16 +1,7 @@
-/* ════════════════════════════════════════════════════════════
-   FOXCLAW DECK — Widget Definitions
-   每个 widget 是一个 registerWidget() 注册。
-   新增模块只需在这里加一个 register block。
-   ════════════════════════════════════════════════════════════ */
 
-/* 共享工具(由主文件注入到 ctx) */
 function _esc(s){return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/\n/g,'<br>');}
 function _statusColor(s){return{PASS:'#1dffa6',WARN:'#ffb347',BLOCK:'#ff4060',BASELINE:'#b066ff',PENDING:'#3a4d68'}[s]||'#1de9ff';}
 
-/* ─────────────────────────────────────────────
-   WIDGET 1: AGENT 编队 (roster)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'roster',
   title: 'AGENT 编队',
@@ -44,9 +35,6 @@ WidgetRuntime.register({
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 2: 任务流 (tasks)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'tasks',
   title: '任务流',
@@ -59,9 +47,6 @@ WidgetRuntime.register({
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 3: 中央核心 (core) — 激活 Agent
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'core',
   title: '中央核心 · 激活单元',
@@ -94,7 +79,6 @@ WidgetRuntime.register({
         </div>
         <div class="chat-log" data-role="chat-log"></div>
       </div>`;
-    // orbit ticks
     const tick = el.querySelector('[data-role="orbit-tick"]');
     let h=''; for(let i=0;i<24;i++)h+=`<span style="transform:translateX(-50%) rotate(${i*15}deg)"></span>`;
     tick.innerHTML=h;
@@ -111,9 +95,6 @@ WidgetRuntime.register({
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 4: HARNESS 遥测 (harness)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'harness',
   title: 'HARNESS 遥测',
@@ -150,14 +131,10 @@ WidgetRuntime.register({
     ctx.loadHarnessInto(el, agentId);
   },
   onEvent(evt, el, ctx) {
-    // policy 更新或校准完成时立即刷新
     ctx.loadHarnessInto(el, ctx.activeAgent);
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 5: 推理链 STREAM (thoughtchain)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'thoughtchain',
   title: '推理链 STREAM',
@@ -175,9 +152,6 @@ WidgetRuntime.register({
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 6: 事件流 LIVE (events)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'events',
   title: '事件流 · LIVE',
@@ -206,10 +180,6 @@ WidgetRuntime.register({
   },
 });
 
-/* ─────────────────────────────────────────────
-   WIDGET 7: 协同 DAG (dag) — 多 Agent 星舰控制流
-   命令 → 主管分发 → 子 Agent → Harness 关卡 → 记忆汇聚
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'dag',
   title: '协同 DAG · 控制流',
@@ -243,7 +213,6 @@ WidgetRuntime.register({
   },
 });
 
-/* DAG 拓扑定义 */
 const _DAG_NODES = {
   command:    { x: 60,  y: 115, label: '指令', icon: '❯', kind: 'entry',  color: '#1de9ff' },
   supervisor: { x: 180, y: 115, label: '主管', icon: '🏢', kind: 'hub',    color: '#1de9ff' },
@@ -265,7 +234,6 @@ function _dagBuild(el, ctx) {
   const edgesG = el.querySelector('[data-role="dag-edges"]');
   const nodesG = el.querySelector('[data-role="dag-nodes"]');
 
-  // edges
   edgesG.innerHTML = _DAG_EDGES.map(([from, to], i) => {
     const a = _DAG_NODES[from], b = _DAG_NODES[to];
     const curve = (from === 'memory' && to === 'supervisor')
@@ -275,7 +243,6 @@ function _dagBuild(el, ctx) {
               fill="none" stroke="#1a2942" stroke-width="1.5" marker-end="url(#dagArrow)"/>`;
   }).join('');
 
-  // nodes
   nodesG.innerHTML = Object.entries(_DAG_NODES).map(([id, n]) => {
     const r = n.kind === 'hub' ? 17 : n.kind === 'gate' ? 16 : 14;
     const shape = n.kind === 'gate'
@@ -301,7 +268,6 @@ function _dagSetActive(el, agentId) {
   el.querySelectorAll('.dag-node').forEach(g => {
     g.classList.toggle('dag-dim', false);
   });
-  // highlight active agent path: command→supervisor→agent→harness→memory
   const path = ['command','supervisor', agentId, 'harness','memory'];
   el.querySelectorAll('.dag-node').forEach(g => {
     const id = g.dataset.nodeG;
@@ -353,7 +319,6 @@ function _dagFlashGate(el, color) {
   const gate = el.querySelector('[data-node="harness"]');
   if (!gate) return;
   const g = gate.closest('.dag-node') || gate;
-  // 注入一次性 keyframes(如未注入)
   if (!document.getElementById('dag-flash-style')) {
     const st = document.createElement('style');
     st.id = 'dag-flash-style';
@@ -371,7 +336,6 @@ function _dagFlashGate(el, color) {
   gate.classList.remove('dag-gate-flash');
   void gate.offsetWidth;             // 强制重排,允许动画重放
   gate.classList.add('dag-gate-flash');
-  // 同时让 HARNESS 文字标签也闪一下
   const label = el.querySelector('.dag-node[data-node-g="harness"] .dag-label');
   if (label) { label.style.fill = color; label.style.fontWeight = '700'; }
   setTimeout(() => {
@@ -381,11 +345,6 @@ function _dagFlashGate(el, color) {
   }, 1200);
 }
 
-/* ─────────────────────────────────────────────
-   WIDGET 8: 执行终端 (terminal) — Shell 执行流
-   命令回显 · 记忆检索 · 推理 · 工具调用 · Harness 校验
-   带打字机流式效果,营造 "AI 正在工作" 的真实感
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'terminal',
   title: '执行终端 · SHELL',
@@ -464,14 +423,9 @@ function _termWrite(el, text, type = 'out', stream = false) {
     txtEl.textContent = text;
   }
   out.scrollTop = out.scrollHeight;
-  // 限制行数
   while (out.children.length > 80) out.firstChild?.remove();
 }
 
-/* ─────────────────────────────────────────────
-   WIDGET 9: AI 浏览器 (browser) — 网页操作可视化
-   模拟 Agent 浏览网页:地址栏 · 加载流 · 操作高亮(点击/输入/滚动)
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'browser',
   title: 'AI 浏览器 · BROWSE',
@@ -507,14 +461,12 @@ function _brzNavigate(el, url, actions) {
   statusEl.textContent = 'LOADING';
   statusEl.className = 'brz-status loading';
 
-  // 进度条动画
   progEl.style.width = '0%';
   progEl.style.opacity = '1';
   setTimeout(() => progEl.style.width = '70%', 80);
   setTimeout(() => { progEl.style.width = '100%'; }, 700);
   setTimeout(() => { progEl.style.opacity = '0'; statusEl.textContent = 'LOADED'; statusEl.className = 'brz-status loaded'; }, 950);
 
-  // 渲染一个抽象的"网页骨架" + 操作高亮
   vp.innerHTML = `
     <div class="brz-page">
       <div class="brz-skel brz-skel-title"></div>
@@ -531,7 +483,6 @@ function _brzNavigate(el, url, actions) {
       <div class="brz-cursor" data-role="brz-cursor">➤</div>
     </div>`;
 
-  // AI 操作序列高亮
   const acts = actions || [
     { type: 'scan', label: '解析页面结构', x: 50, y: 20 },
     { type: 'click', label: '点击主内容区', x: 30, y: 45 },
@@ -548,7 +499,6 @@ function _brzNavigate(el, url, actions) {
     cursor.style.top = a.y + '%';
     cursor.setAttribute('data-label', a.label);
     cursor.className = `brz-cursor act-${a.type}`;
-    // 涟漪
     const ripple = document.createElement('div');
     ripple.className = 'brz-ripple';
     ripple.style.left = a.x + '%';
@@ -561,11 +511,6 @@ function _brzNavigate(el, url, actions) {
   setTimeout(runAct, 1000);
 }
 
-/* ─────────────────────────────────────────────
-   WIDGET 10: 语音输入 (voice) — 麦克风波形 + 语音识别
-   Web Audio API 真实波形 + 浏览器原生 SpeechRecognition
-   识别结果可直接作为指令传输给激活 Agent
-───────────────────────────────────────────── */
 WidgetRuntime.register({
   id: 'voice',
   title: '语音输入 · VOICE',
@@ -600,7 +545,6 @@ function _voiceInit(el, ctx) {
   let audioCtx = null, analyser = null, dataArr = null, rafId = null, stream = null;
   let recognition = null, recognizing = false, finalText = '';
 
-  // 语音识别(浏览器原生)
   const SR = window.SpeechRecognition || window.webkitSpeechRecognition;
   if (SR) {
     recognition = new SR();
@@ -685,7 +629,6 @@ function _voiceInit(el, ctx) {
     const text = transcriptEl.textContent.trim();
     if (!text || text === '聆听中...') return;
     stopMic();
-    // 把识别结果填入控制台并传输
     const input = document.getElementById('consoleInput');
     if (input) { input.value = text; }
     if (typeof transmit === 'function') transmit();

package/python/frontend_src/index.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Foxclaw Deck · v3</title>
+  <title>Foxclaw</title>
   <!-- 内联 SVG 图标:不新增静态文件,也避免浏览器探 /favicon.ico 报 404 -->
   <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='9' fill='%23179d5f'/><circle cx='16' cy='16' r='6.5' fill='%23f4fbf0'/></svg>" />
 </head>

package/python/frontend_src/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "foxclaw-deck-next",
-  "version": "3.0.0",
+  "version": "0.1.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "foxclaw-deck-next",
-      "version": "3.0.0",
+      "version": "0.1.2",
       "dependencies": {
         "vue": "^3.5.13"
       },

package/python/frontend_src/package.json

@@ -1,7 +1,7 @@
 {
   "name": "foxclaw-deck-next",
   "private": true,
-  "version": "3.0.0",
+  "version": "0.1.4",
   "type": "module",
   "description": "Foxclaw Deck v3 - Vue 3 rendering layer (builds into frontend/v3)",
   "scripts": {

package/python/frontend_src/src/App.vue

@@ -7,10 +7,8 @@ import Inspector from './components/Inspector.vue'
 import { onBeforeUnmount, onMounted, ref } from 'vue'
 import { state, setModule } from './stores/app.js'
 import { bootChat } from './stores/chat.js'
+import { t } from './lib/i18n.js'
 
-/* 窄窗断点与 base.css 的 @media (max-width: 1180px) 是同一个数:
-   到这条线以下右栏变成抽屉(见 base.css),这里负责「变窄时自动收起」。
-   否则 900px 窗口里三栏并存,中栏只剩 252px,输入框被 ＋ / 模型胶囊挤到 115px。 */
 const NARROW = 1180
 const narrow = ref(false)
 
@@ -21,7 +19,6 @@ function syncNarrow() {
   if (n) state.railOpen = false
 }
 
-/* 恢复上次会话历史(后端落盘) */
 onMounted(() => {
   bootChat()
   narrow.value = window.innerWidth < NARROW
@@ -34,7 +31,6 @@ onBeforeUnmount(() => {
   window.removeEventListener('resize', syncNarrow)
 })
 
-/* Ctrl+, 打开设置(顶栏 ⚙ 旁边写的那个键位)。输入框里也生效 —— 它是全局入口 */
 function onKey(e) {
   if (e.ctrlKey && (e.key === ',' || e.code === 'Comma')) {
     e.preventDefault()
@@ -55,8 +51,8 @@ function onKey(e) {
       <Inspector />
     </div>
     <div v-if="narrow && state.railOpen" class="rail-scrim" @click="state.railOpen = false" />
-    <button v-if="!state.railOpen" class="rail-handle" title="展开检视栏" @click="state.railOpen = true">
-      检视
+    <button v-if="!state.railOpen" class="rail-handle" :title="t('app.expandInspector')" @click="state.railOpen = true">
+      {{ t('app.inspector') }}
     </button>
   </div>
 </template>

package/python/frontend_src/src/api.js

@@ -1,10 +1,5 @@
-/* 所有请求走相对路径:dev 由 vite proxy 透到 8000,prod 与后端同源 —— 无需区分环境。 */
 export const API = '/api'
 
-/* FastAPI 错误统一带 {detail},直接抛出来比 "xxx -> 400" 有用得多。
-   detail 可能是字符串,也可能是结构化对象({error:"install_denied",reasons:[...]} /
-   {needs_ack:true,warnings:[...]})—— 直接 String() 会得到 "[object Object]",
-   所以拆一层;原始 detail / status 挂到 err 上,调用方要区分「要确认」才有据可依。 */
 function detailMsg(d) {
   if (typeof d === 'string') return d
   if (d && typeof d === 'object') {
@@ -74,8 +69,6 @@ export async function postForm(path, form) {
   return r.json()
 }
 
-/* 少数端点在根路径、不带 /api 前缀 —— vendor/hkc 的 knowledge router 是直接
-   include_router(knowledge.router) 挂上去的,实测 /api/knowledge/* 是 404。 */
 export async function getRaw(path, init) {
   const r = await fetch(path, init)
   if (!r.ok) throw await toError(r, path)