pi-web-ui 0.70.0 → 0.72.0

package/dist/server/model-admin.js

@@ -177,6 +177,21 @@ export class ModelAdminService {
         const data = this.readProviderKeys();
         return data[provider]?.activeKeyName ?? null;
     }
+    /** Whether a named key still exists for a provider (no side effects, no
+     *  notices). Restore paths use this to drop stale per-project references
+     *  silently instead of going through activate (which notifies). */
+    hasProviderKey(provider, keyName) {
+        const pid = provider.trim();
+        const targetName = keyName.trim();
+        if (!pid || !targetName)
+            return false;
+        try {
+            return this.readProviderKeys()[pid]?.keys.some((k) => k.name === targetName) ?? false;
+        }
+        catch {
+            return false;
+        }
+    }
     /** Seed a provider's key list from an EXISTING auth.json credential (legacy
      *  configs written before the multi-key store existed) so the store stays
      *  authoritative and the UI shows the current active key immediately even
@@ -373,36 +388,44 @@ export class ModelAdminService {
         this.host.flushSnapshot();
     }
     /** Make a stored API key the ACTIVE one for a built-in provider by NAME (the
-     *  server resolves the stored value from the name). */
-    async activateProviderKey(provider, keyName) {
+     *  server resolves the stored value from the name). Returns true when the
+     *  key is (now) active, false when it doesn't exist or the switch failed.
+     *  `silent` suppresses all notices — for automatic project restores, which
+     *  must self-heal stale references without spamming the user. */
+    async activateProviderKey(provider, keyName, opts) {
         const pid = provider.trim();
         const targetName = keyName.trim();
+        const silent = opts?.silent === true;
+        const notice = (msg) => {
+            if (!silent)
+                this.host.emit(msg);
+        };
         try {
             const data = this.readProviderKeys();
             const entry = data[pid];
             const target = entry?.keys.find((k) => k.name === targetName);
             if (!target) {
-                this.host.emit({
+                notice({
                     type: "notice",
                     level: "error",
                     text: `${pid} 的密钥「${targetName}」不存在`,
                     textEn: `Key "${targetName}" for ${pid} does not exist`,
                 });
-                return;
+                return false;
             }
             if (entry.activeKeyName === targetName) {
-                this.host.emit({
+                notice({
                     type: "notice",
                     level: "info",
                     text: `「${targetName}」已是当前密钥`,
                     textEn: `"${targetName}" is already the active key`,
                 });
-                return;
+                return true;
             }
             entry.activeKeyName = targetName;
             this.writeProviderKeys(data);
             await this.applyActiveKey(pid, target.apiKey);
-            this.host.emit({
+            notice({
                 type: "notice",
                 level: "info",
                 text: `⚡ 已切换到 ${pid} 的「${targetName}」`,
@@ -411,16 +434,21 @@ export class ModelAdminService {
             await this.host.pushModels();
             await this.listProviders();
             this.listProviderKeys();
+            return true;
         }
         catch (err) {
-            this.host.emit({
+            notice({
                 type: "notice",
                 level: "error",
                 text: `切换密钥失败：${err.message}`,
                 textEn: `Failed to switch key: ${err.message}`,
             });
+            return false;
+        }
+        finally {
+            if (!silent)
+                this.host.flushSnapshot();
         }
-        this.host.flushSnapshot();
     }
     /** Remove a stored API key by NAME. If it was active, the first remaining key
      *  becomes active (or the provider returns to unconfigured when no key is left). */

package/dist/server/protocol-version.js

@@ -8,4 +8,4 @@
  * its own copy in web/src/protocol-version.ts; scripts/check-protocol-sync.mjs
  * verifies the two never drift.
  */
-export const PROTOCOL_VERSION = 14;
+export const PROTOCOL_VERSION = 15;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pi-web-ui",
-	"version": "0.70.0",
+	"version": "0.72.0",
 	"description": "Web chat interface for the pi coding agent, powered by the pi SDK (@earendil-works/pi-coding-agent) — one-command run, Docker/systemd/launchd deployable",
 	"license": "MIT",
 	"author": {
@@ -21,6 +21,7 @@
 		"deploy/",
 		"extensions/",
 		"plugins/catalog.json",
+		"CHANGELOG.md",
 		"README.md",
 		"LICENSE"
 	],
@@ -62,6 +63,9 @@
 		"test:unit": "vitest run",
 		"test:smoke": "node tests/run-smoke.mjs",
 		"check:protocol": "node scripts/check-protocol-sync.mjs",
+		"i18n:diff": "node scripts/i18n-diff.mjs",
+		"release:notes": "node scripts/release-notes.mjs",
+		"changelog:i18n": "node scripts/release-notes.mjs --unreleased",
 		"test:freeze": "node tests/freeze-test.mjs",
 		"start": "node dist/server/index.js",
 		"format": "prettier --write server/ web/src/ extensions/ scripts/ bin/ tests/*.mjs tests/unit/ *.mjs",

package/themes/cyberpunk.css

@@ -85,4 +85,13 @@
 	--bg-image: none;
 	--bg-image-dim: 0.78;
 	--bg-image-blur: 0px;
+	--wallpaper-panel-alpha: 62%;
+	--topbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--statusbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--panel-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--card-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--chip-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--msgs-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--inputbox-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--menu-bg: var(--bg-elev2);
 }

package/themes/dazzle.css

@@ -85,4 +85,13 @@
 	--bg-image: none;
 	--bg-image-dim: 0.78;
 	--bg-image-blur: 0px;
+	--wallpaper-panel-alpha: 62%;
+	--topbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--statusbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--panel-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--card-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--chip-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--msgs-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--inputbox-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--menu-bg: var(--bg-elev2);
 }

package/themes/md-preview.css

@@ -85,6 +85,15 @@
 	--bg-image: none;
 	--bg-image-dim: 0.78;
 	--bg-image-blur: 0px;
+	--wallpaper-panel-alpha: 62%;
+	--topbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--statusbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--panel-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--card-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--chip-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--msgs-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--inputbox-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--menu-bg: var(--bg-elev2);
 }
 
 /* ---- ambient gradient（镜像 .fp-markdown 预览底色，覆盖整个窗口）---- */

package/themes/translucent.css

@@ -0,0 +1,78 @@
+/* theme-name: 半透明 */
+/* theme-name-en: Translucent */
+/*
+ * 半透明主题——专为聊天背景图（壁纸，issue #100）设计：
+ * 调色板与默认暗色一致，但把所有底板统一降到半透明（顶栏/底栏/左右面板、
+ * 卡片/控件/代码面、输入框盒子、终端视图都走同一 --wallpaper-panel-alpha），
+ * 让壁纸从各处透出、整体融合成一张画。配壁纸用最佳；不配壁纸时这些区域会
+ * 透出纯色底（--bg），观感略偏暗沉，属预期。
+ *
+ * 统一透图率：--wallpaper-panel-alpha: 45%（45% 容器色 + 55% 透图）。
+ * 已覆盖的面：顶栏/底栏/左右面板、左右折叠按钮（.panel-collapse-btn /
+ * .panel-rail）、工具调用卡及其参数/输出块（.toolcall / .toolcall-args pre /
+ * .toolcall-output pre）、bash 块（.bashblock/.termline）、消息代码块
+ * （.codeblock pre）、全部消息气泡（.thinking/.toolcall/.bashblock/
+ * .skillcard/.attachcard/.queued-bubble/.retry-notice/.msg-collapsed（含 hover））、
+ * 快捷短语（.quick-chip）、新对话提示词模板卡（.empty-template）、顶栏
+ * chips / 视图切换（.chip/.view-switch）——走 styles.css
+ * 的 --card-bg/--chip-bg/--inputbox-bg，随 --wallpaper-panel-alpha 统一联动；
+ * 中间的聊天/消息区用 --msgs-bg（同式 45%），气泡立在统一玻璃面上略实
+ * 一层形成层次。**下拉弹窗保持实色**：声音/语言/主题/模型选择/思考强度等
+ * 点出来的 .dd-menu 背景用 --menu-bg（这里覆盖回 var(--bg-elev2) 实色，
+ * 弹窗内容多为密集列表，实色保可读）。终端视图（xterm canvas/容器）读
+ * --term-bg，这里同样设半透明。
+ * 各变量都可单独覆盖回实色（如 var(--bg-elev)）即关闭对应面的透图；
+ * --msgs-bg 覆盖回 transparent 可恢复「消息区全透、壁纸从卡片间隙露出」。
+ */
+:root {
+	color-scheme: dark;
+	--bg: #0d0e12;
+	--bg-elev: #14161c;
+	--bg-elev2: #1a1d26;
+	--border: #262a35;
+	--border-soft: #1e2230;
+	--text: #e6e8ef;
+	--text-dim: #9aa1b4;
+	--text-faint: #6b7284;
+	--accent: #8b5cf6;
+	--accent-soft: rgba(139, 92, 246, 0.14);
+	--green: #34d399;
+	--green-soft: rgba(52, 211, 153, 0.12);
+	--red: #f87171;
+	--red-soft: rgba(248, 113, 113, 0.12);
+	--amber: #fbbf24;
+	--term-bg: #0b0d12;
+	--term-fg: #e6e8ef;
+	--term-cursor: #8b5cf6;
+	--term-cursor-accent: #0b0d12;
+	--term-selection: rgba(139, 92, 246, 0.35);
+	--term-black: #1a1d26;
+	--term-red: #f87171;
+	--term-green: #34d399;
+	--term-yellow: #fbbf24;
+	--term-blue: #60a5fa;
+	--term-magenta: #c084fc;
+	--term-cyan: #22d3ee;
+	--term-white: #e6e8ef;
+	--term-bright-black: #6b7284;
+	--term-bright-red: #f87171;
+	--term-bright-green: #34d399;
+	--term-bright-yellow: #fbbf24;
+	--term-bright-blue: #60a5fa;
+	--term-bright-magenta: #c084fc;
+	--term-bright-cyan: #22d3ee;
+	--term-bright-white: #ffffff;
+
+	/* ---- 壁纸适配：三大区域（顶栏/底栏/左右面板）背景链式引用此变量，
+	   从默认 62% 降到 45% → 容器色更薄、图更透（45% 容器色 + 55% 透图）---- */
+	--wallpaper-panel-alpha: 45%;
+	/* 下拉弹窗（声音/语言/主题/模型/思考强度/版本更新）：实色底保密集列表可读
+	   （与 styles.css 默认一致，这里显式锁定，防止跟随壁纸半透）。 */
+	--menu-bg: var(--bg-elev2);
+	/* 压暗略放轻（默认 0.78）：让图更鲜活，文字靠压暗与半透明底板仍可读 */
+	--bg-image-dim: 0.72;
+	/* 输入框盒子：styles.css 默认已与控件级底板同式跟随 --wallpaper-panel-alpha，
+	   这里不单独覆盖；想比整体厚/薄就设一个独立值 */
+	/* 终端视图：xterm canvas + 容器都读 --term-bg，改成半透明随整体透图 */
+	--term-bg: color-mix(in srgb, #0b0d12 45%, transparent);
+}

package/themes/transparent.css

@@ -0,0 +1,78 @@
+/* theme-name: 全透明 */
+/* theme-name-en: Transparent */
+/*
+ * 全透明主题——「半透明」的极致版（专配壁纸，issue #100）：
+ * 调色板与默认暗色一致，但把壁纸机制里所有表面变量的透图率压到 0
+ * （--wallpaper-panel-alpha: 0% → --topbar-bg / --statusbar-bg / --panel-bg /
+ * --card-bg / --chip-bg / --inputbox-bg / --msgs-bg 全部变成 transparent），
+ * 顶栏/底栏/左右面板/消息区/输入框/全部气泡/代码块/终端视图统统直接见壁纸，
+ * 界面只剩边框与文字定结构。代价是文字全靠 --bg-image-dim 压暗撑着——
+ * 这里压暗加重到 0.85（默认 0.78），亮区壁纸下文字仍可读。
+ *
+ * 全透后 hover/浮动反馈不能依赖容器色（已是 0%），本文件尾段把这些实色
+ * hover 统一改成 25% 半透底（折叠摘要、展开条、折叠键、复制键、滚到底按钮）；
+ * 强调色 hover（accent-soft）与语义按钮（发送/停止/杀进程）不受影响。
+ * 下拉弹窗（声音/语言/主题/模型/思考强度等 .dd-menu）保持实色
+ * （--menu-bg: var(--bg-elev2)），密集列表不随界面透图。
+ * 配壁纸用最佳；不配壁纸时界面直接透出 --bg 纯色（= 默认暗色，无差别）。
+ */
+:root {
+	color-scheme: dark;
+	--bg: #0d0e12;
+	--bg-elev: #14161c;
+	--bg-elev2: #1a1d26;
+	--border: #262a35;
+	--border-soft: #1e2230;
+	--text: #e6e8ef;
+	--text-dim: #9aa1b4;
+	--text-faint: #6b7284;
+	--accent: #8b5cf6;
+	--accent-soft: rgba(139, 92, 246, 0.14);
+	--green: #34d399;
+	--green-soft: rgba(52, 211, 153, 0.12);
+	--red: #f87171;
+	--red-soft: rgba(248, 113, 113, 0.12);
+	--amber: #fbbf24;
+	--term-bg: transparent;
+	--term-fg: #e6e8ef;
+	--term-cursor: #8b5cf6;
+	--term-cursor-accent: #0b0d12;
+	--term-selection: rgba(139, 92, 246, 0.35);
+	--term-black: #1a1d26;
+	--term-red: #f87171;
+	--term-green: #34d399;
+	--term-yellow: #fbbf24;
+	--term-blue: #60a5fa;
+	--term-magenta: #c084fc;
+	--term-cyan: #22d3ee;
+	--term-white: #e6e8ef;
+	--term-bright-black: #6b7284;
+	--term-bright-red: #f87171;
+	--term-bright-green: #34d399;
+	--term-bright-yellow: #fbbf24;
+	--term-bright-blue: #60a5fa;
+	--term-bright-magenta: #c084fc;
+	--term-bright-cyan: #22d3ee;
+	--term-bright-white: #ffffff;
+
+	/* ---- 全透明核心：0% 容器色 = 全部 color-mix 表面（三大区域 / 卡片 /
+	   控件 / 输入框 / 消息区）直接变 transparent；终端 --term-bg 上面已设
+	   transparent。想留一点点玻璃感就把这里提到 10~15%。---- */
+	--wallpaper-panel-alpha: 0%;
+	/* 下拉弹窗（声音/语言/主题/模型/思考强度）：实色底保密集列表可读 */
+	--menu-bg: var(--bg-elev2);
+	/* 压暗加重：全透后没有容器色兜底，文字只靠压暗保可读 */
+	--bg-image-dim: 0.85;
+}
+
+/* hover / 浮动静置反馈：0% 容器色下这些实色 hover 必消失，统一给 25% 半透
+   底（仍透图、可辨反馈）。强调色 hover（accent-soft）与语义按钮不受影响；
+   下拉弹窗已在实色菜单内，其 hover 保留 styles.css 默认实色。 */
+.msg-collapsed:hover,
+.panel-rail:hover,
+.chead-toggle:hover,
+.chead-copy:hover,
+.empty-templates-reset:hover,
+.scroll-bottom {
+	background: color-mix(in srgb, var(--bg-elev) 25%, transparent);
+}

package/themes/white.css

@@ -85,6 +85,15 @@
 	--bg-image: none;
 	--bg-image-dim: 0.78;
 	--bg-image-blur: 0px;
+	--wallpaper-panel-alpha: 62%;
+	--topbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--statusbar-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--panel-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--card-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--chip-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--msgs-bg: color-mix(in srgb, var(--bg-elev) var(--wallpaper-panel-alpha, 62%), transparent);
+	--inputbox-bg: color-mix(in srgb, var(--bg-elev2) var(--wallpaper-panel-alpha, 62%), transparent);
+	--menu-bg: var(--bg-elev2);
 }
 
 /* ---- syntax highlighting (overrides static github-dark import) ---- */

package/web/dist/assets/{TerminalPanel-UxgczH4c.js → TerminalPanel-SG88Uj0n.js}

@@ -1,4 +1,4 @@
-import{a as l,j as n}from"./markdown-Cpo0pNcR.js";import{u as P,b as O,T as M,a as W,F as Y,c as z,d as Z,e as H,f as ee,g as ne,h as te,i as se,r as ae}from"./index-CaiIOwy7.js";import{D as re,o as ie}from"./xterm-B96xOxS9.js";import"./react-CtudoG1_.js";function le(t){let c=null;return{clean:t.replace(/\r?\n?\[pi-term-exit:(-?\d+)\]\r?\n?/g,(a,x)=>(c=Number(x),`\r
+import{a as l,j as n}from"./markdown-Cpo0pNcR.js";import{u as P,b as O,T as M,a as W,F as Y,c as z,d as Z,e as H,f as ee,g as ne,h as te,i as se,r as ae}from"./index-CBZtMKV2.js";import{D as re,o as ie}from"./xterm-B96xOxS9.js";import"./react-CtudoG1_.js";function le(t){let c=null;return{clean:t.replace(/\r?\n?\[pi-term-exit:(-?\d+)\]\r?\n?/g,(a,x)=>(c=Number(x),`\r
 `)).replace(/\r?\n?\x1b\[90m\[(?:进程已退出，退出码 |Process exited with code )-?\d+\]\x1b\[0m\r?\n?/g,`\r
 `),exitCode:c}}function ce({conversationId:t,terminalId:c,command:p,cwd:a,title:x,active:u,running:v,exitCode:j,send:h,register:C}){const T=l.useRef(null),y=l.useRef(null),{locale:o}=P(),N=l.useRef(o);N.current=o;const E=p?JSON.stringify(p):"";l.useEffect(()=>{const m=T.current;if(!m)return;const r=new re({theme:O(),fontFamily:'"SF Mono", "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace',fontSize:13,cursorBlink:!0,scrollback:8e3}),b=new ie;r.loadAddon(b),r.open(m),y.current={term:r,fit:b},u&&r.focus();const g=()=>{r.options.theme=O()};window.addEventListener(M,g),r.attachCustomKeyEventHandler(d=>{if(d.type!=="keydown")return!0;const S=d.key?.toLowerCase();if((d.ctrlKey||d.metaKey)&&S==="v")return!1;if(d.ctrlKey&&!d.shiftKey&&!d.altKey&&S==="c"&&r.hasSelection()){const D=r.textarea;return D&&(D.value=r.getSelection(),D.select()),!1}return!0});const _=C(t,c,{write:d=>r.write(le(d).clean),dispose:()=>r.dispose()}),$=()=>{try{b.fit(),h({type:"terminal_resize",terminalId:c,conversationId:t,cols:r.cols,rows:r.rows})}catch{}},B=requestAnimationFrame(()=>{try{b.fit()}catch{}h(p?{type:"run_command",terminalId:c,conversationId:t,command:p,cols:r.cols,rows:r.rows}:{type:"terminal_create",terminalId:c,title:x,locale:N.current,conversationId:t,cwd:a,cols:r.cols,rows:r.rows})}),R=r.onData(d=>{h({type:"terminal_input",terminalId:c,conversationId:t,data:d})});let k=null;return typeof ResizeObserver<"u"&&(k=new ResizeObserver(()=>{m.offsetWidth>0&&m.offsetHeight>0&&$()}),k.observe(m)),()=>{cancelAnimationFrame(B),R.dispose(),window.removeEventListener(M,g),k?.disconnect(),_(),r.dispose(),y.current=null}},[t,c,E,h,C]),l.useEffect(()=>{if(!u)return;const m=requestAnimationFrame(()=>{const r=y.current;if(r){try{r.fit.fit(),h({type:"terminal_resize",terminalId:c,conversationId:t,cols:r.term.cols,rows:r.term.rows})}catch{}r.term.focus()}});return()=>cancelAnimationFrame(m)},[u]);const{t:F}=P(),f=l.useRef(void 0);return l.useEffect(()=>{if(v===f.current||(f.current=v,v!==!1))return;const m=y.current;m&&m.term.write(`\r
 \x1B[90m${F("exitBanner",{code:j??""})}\x1B[0m\r