优化 Pixelle CLI 首次启动与配置引导体验

[ztygod]

背景

首次启动决定用户是否能快速理解并信任一个 Agent CLI。当前 Pixelle CLI 已经有 Ink 欢迎卡片和 @clack/prompts 配置流程，但两者体验割裂：setup 阶段像普通命令行问答，进入主界面后才看到 Pixelle 的 timeline。用户无法在第一屏完整确认 provider、model、API key 状态、工作区、权限边界和配置文件位置。

对于接近 Claude Code / Codex CLI 的体验来说，首次启动不只是收集配置，而应该像一个启动控制台：清楚告诉用户当前运行环境是否就绪、默认能做什么、哪些能力需要授权。

目标

完成后，用户首次运行 Pixelle 时能看到更完整、更现代的 onboarding 和欢迎页：配置进度清晰，配置完成后能一屏确认模型、provider、API key 状态、工作区、git 状态、权限状态和常用下一步命令。

当前问题

当前 src/cli/components/chrome/WelcomeScreen.tsx 只展示 workspace、model、provider、git 信息，没有展示 API key 是否已配置、config 文件路径、trace 目录、权限状态或默认模式。src/cli/local/setup.ts 完成后只输出 provider/model/workspace 等几行文本，和主界面的欢迎卡片不是同一套展示语言。/config 重新配置时会清屏重渲染，但缺少配置前后变化摘要。

参考体验

参考 Claude Code / Codex CLI 这类现代 Agent CLI：启动后第一屏就能看懂“当前连接哪个模型、工作区在哪里、允许哪些操作、下一步可以输入什么”。配置流程应像 onboarding wizard，而不是孤立的问答脚本。

改动方向

聚焦首次启动与配置展示，不扩大到 agent 执行逻辑。增强欢迎页、setup 完成摘要、/config 反馈和帮助文案，让配置状态与主界面视觉保持一致。

可能涉及模块

• src/cli/local/setup.ts
• src/cli/local/run-local-cli.ts
• src/config/local-cli-config.ts
• src/cli/components/chrome/WelcomeScreen.tsx
• src/cli/components/chrome/CommandHelp.tsx
• src/cli/types.ts

大致实现方案

• 扩展 RenderCliOptions，传入 API key 状态、权限状态、config 路径等展示信息
• 新增或扩展 WelcomeScreen 的配置摘要区域
• setup 完成后生成结构化 notice event，而不是只输出普通文本
• /config 后展示配置更新摘要，包括 provider/model/workspace 是否变化
• API key 只展示 configured/missing/local，不泄漏明文

任务清单

• 欢迎页展示 provider、model、workspace、git、API key 状态和权限状态
• setup 完成后展示统一的配置摘要
• /config 重新配置后展示变更结果
• 命令帮助中说明 /config、/workspace、/edit 的安全含义
• 确保窄终端下欢迎页不会溢出或挤压输入框

验收标准

• 首次启动后用户能一屏看懂当前模型、工作区和权限边界
• API key 不泄漏明文，只展示 configured / missing / local
• /config 成功或失败都有清晰反馈
• 重新配置后主界面展示的信息会同步更新
• 小宽度终端下布局仍可读

建议标签

cli、ux、feature、developer-experience