08. 组件规格
翻译说明: 本页是与 英文源规格 一一对应的机器辅助翻译。代码、协议字段和标识符保持原文;如翻译与英文源事实有歧义,以英文版本为准。
布局和 IA 参考:01-ui-ia.md 设计代币和基础:07-ui-design-system.md 交互行为:09-interaction-patterns.md
Shell 布局与 Codex 对齐:左线程侧边栏 (~275px)、主记录、带有运行时 mode/permission 控件和顶栏模型选择器的浮动底部编辑器。与蓝板岩镀铬相比,更喜欢中性木炭表面。
优先规则:下面的指标或复制字符串与 决策日志 §D 中的法典平价决策 (D034+),决策日志获胜——它跟踪实时黄金捕获情况。已知 更新值:侧边栏 ~275px(不是 240px),工具栏 46px(不是 44px), 每个 D094/D066 的输入框占位符、每个主空堆栈和底部输入框 D111/D204/D206, 根据 D066/D133 项目索引表,根据 D063 设置整页 shell 来自 D090/D133/D166 的紧凑八个目标目录,并保留路径键控 每个 D093 的项目组(保留 D088 的 Temporary/exact-path 边界 同时恢复范围内的项目和对话组织操作),以及 根据 D094/D160 产品 branding/icon 合约。
1. AppShell
1. 1 目的
定位顶栏、侧栏、MainChat 和工作面板的外框架。拥有调整大小逻辑、响应式折叠和主题类。
1. 2 解剖学
+------------------+------------------------------+------------------+
| 侧边栏 | 主聊天室 | 工作面板 |
| (275 像素/48 像素) | (弹性-1) | (244–720 像素/ |
| | | 隐藏) |
+------------------+------------------------------+------------------+
| 标题栏行:46px,交通灯位于 {x:16,y:16} (D034/D070) |
+--------------------------------------------------------------------+1. 3 状态
| 状态 | 行为 |
|---|---|
| 默认 | 侧边栏展开,工作面板隐藏 |
| 窄(<640 像素) | 侧边栏自动折叠到图标栏 |
| 面板打开时的受限工作区域 | 工作面板保持其固定的承诺宽度; MainChat 吸收了预订不足的情况 |
| 全屏 | 顶栏仍然存在;侧边栏切换和工件驱动面板保持可用 |
1. 4 交互
- 侧边栏切换:键盘快捷键 + 扩展中搜索旁边的图标按钮 侧边栏标题;按钮在折叠时移动到主标题栏。这 折叠和展开使用安装后动画的停靠过渡(入口
sidebar-in,退出sidebar-out关键帧),镜像工作面板停靠: 侧面通过退出关键帧保留在树中,然后卸载 (is-exiting标志 +animationend防护,具有超时回退) - 工作面板折叠:唯一的控件位于会话窗格标题栏右上角 当面板打开时,其外边缘与分隔板齐平 会话窗格和工作面板之间,因此工作面板内容标题是 没有被占用。开 Windows/Linux,打开工作面板会删除主标题栏的本机 窗口控件间隙,因为这些控件占用工作面板标题 在外窗边缘。
- 工作面板调整大小:左边缘拖动手柄(§5.4)
- 窗口大小调整:本机边缘仅在打开作品时更改 MainChat 宽度 面板保持其承诺的宽度;响应式布局如下 07-ui-design-system.md §10.1
1. 5 辅助功能
- 标志性角色:
<nav>用于侧边栏、<main>用于聊天、<aside>用于工作面板、<header>用于顶栏 - 选项卡顺序:顶栏 → 侧边栏 → 主聊天 → 工作面板 → 编辑器
1. 6 MVP 约束
- 侧边栏宽度固定;工作面板是唯一可调节的辅助装置 列,并且仅根据其自己的分隔线调整大小
- 主窗格呈现一个活动转录本和一个选定的工作区,同时 侧边栏可能会保留几个项目tabs/groups
- 侧边栏和工作面板停靠转换也为其灵活分配设置了动画 作为 opacity/transform 反馈,因此 MainChat 在运动持续时间内回流 而不是在第一个绘制的帧之前跳跃。
AppShell仅拥有低频 shell/navigation 状态。流式传输messages、主动轮渲染、内联聊天错误和主动权限 投影是在记忆化的ChatSurface内订阅的,因此令牌更新 无法重新渲染侧边栏、工作面板、窗口镶边、全局对话框或 toast。- 会话选择立即公开目标行,合并悬停/ 焦点预取,并在其中保留最多五个最近访问的记录 渲染器内存。转录 IO 和所需的工作空间对齐可能会运行在 平行;导航世代确保只有最新的选择才能 项目会话、工作区、消息和工作面板上下文。
- 当目标转录物正在解析或 React 正在准备其繁重的任务时 Markdown 树,
ChatSurface保留了之前的完整转录本作为 非交互式稳定框架,公开aria-busy,并显示 2px 进度 轨道。目标转录本在底部自动替换它;一个 过时的记录永远不会用目标会话 ID 重新标记。 - 设置、插件、拉取请求和计划是路由级惰性模块。 聊天和 shell chrome 保留在初始渲染器包中;第一个条目 次要目的地显示紧凑的本地状态指示器,直到其 本地块解析。
- 没有状态栏(延迟)
1. 7 平台应用程序chrome
| 平台 | 顶级镀铬 | 应用菜单 |
|---|---|---|
| macOS | {x:16,y:16} 处原生嵌入式交通灯;展开的侧边栏搜索和折叠控件共享右侧的行,没有 logo/title;打开工作面板折叠位于会话窗格的右上角 | 系统菜单:PI-Desktop、文件、编辑、视图、窗口、帮助 |
| Windows | 无框 46px 标题栏;左侧边栏操作,在 minimize/maximize/close 之前的会话窗格右上角打开工作面板折叠 | 窗户里面没有 |
| Linux | 无框 46px 标题栏;左侧边栏操作,在 minimize/maximize/close 之前的会话窗格右上角打开工作面板折叠 | 窗户里面没有 |
- macOS 系统菜单显示“新建任务”、“打开项目”、“设置”、“命令” 调色板、侧边栏、标准编辑、zoom/fullscreen、窗口、帮助、日志和 检查更新操作。 Windows/Linux 公开等效的产品操作 通过应用程序内控件和键盘快捷键,并检查更新 设置->信息。
- 当设置 -> 信息 -> 开发者模式启用时,macOS 查看菜单 另外还公开了本机开发人员工具的角色。所有平台都暴露 F12 和 Windows/Linux 也公开 Ctrl+Shift+I;命令和设置 当该模式被禁用时,打开控制台操作不可用。
- 窗口按钮具有本地化的工具提示和可访问的名称。最大化 字形反映初始本机状态加上后来的 maximize/unmaximize 事件。每个 Windows/Linux 按钮都是一个显式的非拖动指针目标,因此 周围的标题栏拖动区域不能消耗最小化、最大化、 恢复或关闭点击。
- 最小化是每个平台上的常驻 shell 操作:渲染器按钮 将主窗口隐藏到 PI-Desktop 托盘中,而 macOS 本机流量 灯光和窗口菜单角色转换为相同的隐藏到托盘状态。 托盘激活可恢复并聚焦窗口;退出仍然是明确的。
- Windows/Linux 不会在标题栏中呈现 File/Edit/View/Window/Help,并且 不要为应用程序菜单栏保留左侧空间。 F10 和 Shift+F10 仍然可用于聚焦内容。
- macOS 创建或重新加载窗口的本机命令等待渲染器的菜单 订阅确认而不是依赖于时间延迟。
2. 顶栏
2. 1 目的
全局控制栏:任务标题、模型选择和窗口操作。项目 范围在标题工具提示中仍然可用。活动会话的 Agent/Plan/Goal 控制权仅属于 左输入 Composer 芯片。 (从命令面板到达设置/ 应用程序菜单,而不是顶部栏。)
2. 2 解剖
[☰ Sidebar] [Task title] [●] [🤖 Model] [+ New] [🔍 Search](图标按功能描述;实际渲染使用 Lucide SVG。[☰ Sidebar] 切换仅在侧边栏折叠时;当侧边栏为 扩展它拥有该控件,因此顶部栏不会重复它。)
对话顶部栏仅针对聊天路线呈现;拉取请求、已计划、 插件和设置保留无框拖带。它拥有任务标题、 仅向下打开的模型选择器和窗口操作。项目范围仍为 标题工具提示而不是添加另一个可见标签。左侧输入 Composer芯片是唯一的Agent/Plan/Goal控制并写入会话mode;的 思考和许可触发器保留在 Composer 中(§11)。
2. 3 布局
- 高度:46px(Codex 工具栏节奏,D034;取代旧的 44px)
- 背景:bg-primary
- 边框:边框-微妙底部
- 位置:绝对46px无框带;
-webkit-app-region: drag与 交互式控件上的no-drag; macOS 保留左侧约 76 像素的流量 灯亮(仅当侧边栏折叠时),Windows/Linux保留权利 本机窗口控件为 112px - 标题簇(任务标题)最多可显示前 10 个 Unicode 字符加省略号;完整标题保留在本机工具提示中。 右侧集群(模型选择器、操作图标)是
flex: 0 0 auto并且永远不会被长标题所挤压。对话表面保持min-width因此其内容不会在狭窄的窗口上被压垮。 - 项目范围可从标题工具提示中获取,但不会呈现为 第二个可见标签。
- macOS 全屏将左侧保留重置为 8px(镜像侧边栏标题)。
- 置顶:
z-sticky - 项目:左对齐控件、右对齐操作
2. 4 状态
| 元素 | 默认 | 跑步 | 错误 | 没有工作空间 |
|---|---|---|---|---|
| 任务标题 | 会话标题(或无标题),上限为 10 个字符,需要时使用省略号 | 相同,加上一个紧凑的脉冲状态点 | 一样 | 一样 |
| 模型选择器 | 可点击的下拉菜单 | 流期间禁用 | 可点击的 | 可点击(无提供商警告) |
| 新任务/搜索 | 图标按钮 | 一样 | 一样 | 一样 |
| 中止按钮 | 隐藏的 | 可见,重音悬停脉冲 | 隐藏的 | 隐藏的 |
| 项目名称 | 仅标题工具提示 | 一样 | 一样 | 省略 |
2. 5 辅助功能
- 每个控件都可以通过 Tab 键盘访问
- 中止按钮有
aria-label="Abort active turn" - 模型选择器通过
aria-label宣布当前值
2. 6 MVP 约束
- 顶部栏中没有搜索字段(延迟)
- 通知历史记录是有界的D117收件箱;预定的提醒, 权限请求通知和通知首选项保留在 范围
3. 侧边栏
3. 1 目的
范围内的项目和会话导航、管理和通知访问。的 扩展的侧边栏首先在紧凑的 Sessions 下显示无路径对话 以下 Projects 标题下的标题和保留项目选项卡;的 折叠状态是一个图标栏。保留的选项卡是渲染器呈现状态, 不是额外的主机工作区。 侧边栏主体是为会话和项目保留的;页脚暴露了 设置旁边的插件目的地。项目通过“设置”进行管理 → 项目存档,而 Pull 请求和 Scheduled 不会在 侧边栏。
部分级创建和排序控件在静止时保持视觉安静并显示 当拥有的会话或项目工具栏悬停或键盘聚焦时。 项目组 + 和溢出控制遵循相同的 hover/focus 处理; 它们的命中区域保留在布局中,因此显示它们不会改变标签。
3. 2 解剖学
Expanded (~275px, D034/D070):
+---------------------------+
| [lights] [⌕][◧] | macOS
| [π] PI-Desktop [⌕][◧] | Windows/Linux
| 会话 [消息+][↕] |
| • 无路径会话 ↕ |
| 项目 [目录+] |
| [v] 项目-A [+] … |
| • 项目会议 |
| 项目-B [>] [+] … |
| |
| [⚙][@][铃][版本] |
+---------------------------+
Collapsed (48px):
+----+
| ── |
| 塞斯 |
| 塞斯 |
| ── |
| [⚙][@][☾][铃] |
+----+3. 3 版式
主要左轨镀铬保持车身尺寸,因此接下来的目的地仍然可读 到 14px 聊天正文。会话和 project/group 标题使用相邻的紧凑 等级;粗细、缩进和显示图标保留其层次结构:
| 表面 | 代币 | 注释 |
|---|---|---|
| 页脚操作图标 | --text-base (14px) | 设置、扩展、通知;页脚左侧 |
| 会话/话题标题 | --text-md (13px) | 紧凑列表内容 |
| 项目/组标题,空副本 | --text-md (13px) | 层次结构来自权重和缩进 |
部分标签(SESSIONS、PROJECTS) | --text-sm (12px) | 大写辅助标签 |
| 页脚配置文件名称 + 配置文件菜单项 | --text-base (14px) | 身份簇与导航主体匹配 |
| 页脚状态/版本 | --text-sm (12px) | 右对齐 build/version 芯片 |
不要渲染 --text-md 下面的主侧边栏列表内容。保持行高 (≈28–32px),因此密度保持 WorkBuddy/Codex-like,同时主要操作保持不变 视觉上与列表内容不同。
3. 4 状态
| 状态 | 行为 |
|---|---|
| 扩展 | 完整的会话标题可见 |
| 倒塌 | 图标栏 — 悬停显示带有会话标题的工具提示 |
| 活动会话 | 强调蓝色轮廓状态环加上活动行背景 |
| 选择会话 | 目标行立即接受主动处理,同时 transcript/workspace 解析继续 |
| 会话进行中 | 橙色呼吸点;减少运动时的静态 |
| 会话已完成 | 未选择该行时呈绿色复选标记 |
| 会话失败 | 未选择该行时,红色圆圈警告标记 |
| 悬停会话 | bg-第三级背景 |
| 活跃项目 | 标头携带活动状态;顶栏跟随该工作区;输入框不公开任何工作区身份 |
| 崩溃的项目 | 标题保持可见;儿童对话被隐藏 |
| 存档行 | 默认隐藏;在显式存档视图中可见 |
| 无保留项目 | 紧凑的开放式项目入口;独立会话行仍然可用 |
| 空组 | 静音单线空状态;组创建操作仍然可用 |
| 页脚闲置 | 透明58px带;构建和动作控制在视觉上保持安静 |
| 页脚 hover/focus | 仅目标控件接受语义 hover/focus 处理 |
| 个人资料菜单打开 | 配置文件触发器已激活; 280px 菜单在页脚上方 8px 处打开 |
3. 5 互动
- 单击项目目录行(V 形、文件夹、标签或剩余的 披露点击区域):必要时激活其路径,然后仅切换 该项目的对话组;保留其他项目组
- 点击会话:必要时激活其绑定的项目,切换活动状态 会话,并在第一个绘制的帧上显示最后一条消息。会议 激活会重置从先前继承的任何手动滚动状态 抄本,不得闪烁新抄本的顶部或旧卷轴 到达底部之前的位置。
- 将会话行悬停 120 毫秒或键盘聚焦,它会启动一个合并 转录预取。选择重用正在进行的或最近缓存的结果, 在后台重新验证它,并且从不等待旧的被取代 会话在开始最新读取之前读取。
- 在 Windows/Linux 上,单击 PI-Desktop 品牌以返回主窗格 在家聊天,同时保留活跃的对话和工作空间; macOS 故意从侧边栏标题中省略此品牌控制
- 单击“设置”右侧的页脚插件图标以打开 扩展目的地;该图标在 hover/focus 上显示本地化标签
- 页脚操作组保留在左侧,build/version 芯片保留在左侧 右对齐;单击芯片检查更新或打开可用的 在设置中发布
- 单击标题行右侧的“搜索”或“折叠”侧栏 分别打开全局搜索或折叠侧边栏
- 当工作面板打开时,单击会话窗格右上角的面板折叠 控制隐藏面板而不删除选项卡;工作面板标题保留 仅动态选项卡
- 单击
Projects标题文件夹 - 加操作:打开项目选择器并 保留所选项目 - 右键单击
Projects标题或空项目列表镶边:打开一个 运行相同的新项目选择器操作的单项创建菜单 - 单击项目
+:激活该项目和 create/reuse 绑定到的会话 它的确切路径 - 单击
Sessions标题消息加操作:清除工作区和 create/reuse 无路径持久会话 - 当工具栏打开时,会话和项目标题操作会一起显示 悬停或键盘聚焦;控件仍可通过键盘访问 休息时视觉上隐藏
- 右键单击
Sessions标题或空独立列表镶边:打开一个 creates/reuses 无路径临时会话的单项创建菜单 - 项目溢出:开关、打开文件夹、pin/unpin、archive/restore、关闭 保留选项卡。打开文件夹显示系统文件中的项目目录 所选项目行的经理。
- 对话溢出:pin/unpin、archive/restore、创建分支、删除。 当该对话运行时,创建分支被禁用;成功 激活独立的子会话并集中输入框。
Sessions工具栏将排序按钮放置在消息加新聊天之前 控制。排序菜单和所有其他主体级侧边栏菜单仍然保留 内容大小并在触发器或指针右侧打开 4px。他们的 左边缘永远不会翻转到扳机的左侧;表面有一个视口 窄窗的宽度上限。排序选择保持最近更新, 创建日期、最早的在前和名称;固定的行位于未固定的行之前。 存储的manual兼容性值不需要拖动重新排序 UI。- 项目组使用紧凑的垂直间距,因此相邻的目录和 对话行被解读为一个密集的导航列表,而不是分离的 牌。目录
+和溢出操作保持隐藏状态,直到悬停或 键盘焦点,而不改变目录标签的位置。 - 侧边栏切换:搜索旁边的扩展标题图标 + 键盘快捷键;的 折叠的主标题栏保留展开侧边栏图标;当工作面板处于 打开,右上角的会话窗格包含唯一的面板折叠控件
- 单击本地配置文件触发器:打开或关闭包含以下内容的身份菜单 设置、日志和主题
- 单击页脚铃:打开或关闭持久通知收件箱
3. 6 辅助功能
- 项目和会议标题具有本地化名称;每项披露和 创建操作具有特定于范围的可访问名称
- 在
lang=zh-CN下,部分标签保持正常跟踪并跳过text-transform: uppercase因此两个字形标签没有字母间隔 - 会话组使用语义
section容器 - 活动会话:
aria-current="true" - 每个可见的会话指示器都有一个本地化的可访问名称和工具提示; 颜色通过环、点、方格或警报几何形状得到加强
- 项目目录行公开
aria-expanded和aria-controls;菜单 check/radio 项目公开aria-checked - 悬停隐藏部分和项目操作保留在选项卡顺序中并显示 通过
:focus-within;键盘焦点从不依赖于指针悬停 - 折叠状态:每个图标都有
aria-label和会话标题 - 键盘:箭头键导航会话列表
- 页脚设置、插件和通知控件公开本地化 易于理解的名称和可见焦点处理
- 配置文件触发器公开
aria-haspopup="menu"及其扩展状态; 菜单与触发器具有稳定的可访问关系 - 通知触发器有一个本地化的可访问名称,其中包含 未读计数,公开
aria-haspopup="menu"/aria-expanded,并且从不依赖 仅徽章颜色 document.body的个人资料和通知弹出窗口门户,已修复 定位,以便主聊天窗格无法在它们上面进行绘制;工作面板工具 上下文菜单使用相同的主体级浮动层
3. 7 品牌和图标合同
- 可见shell名称为
PI-Desktop; Codex 不用作渲染器 身份。 BrandLogo通过Vite导入规范的build/icon_1024.png用于light 模式,build/logo_dark.png用于暗模式。该组件订阅了document.documentElement[data-theme]通过MutationObserver并交换 运行时侧边栏和启动画面的源代码,无需重新加载。的 空屋英雄在 100 像素处使用HomeMascotLogo:它的透明精灵是 从剩余提供的docs/ip框架表编译成九个静态 姿势组(总共 50 帧)。每个坐骑随机选择一组,然后 播放完成后选择不同的组。它交换离散图集 固定 100px 视口内的帧,之间休息几秒钟 动作,保持单帧姿势更长时间,并保持当前组的第一个 运动减少的框架。指针悬停在吉祥物上会绕过空闲状态 暂停并在各组中不断前进。这 expanded/collapsed 侧边栏仍为 20px/18px 且启动画面为 64 像素。 主目录和线程停靠的输入框提示行不会呈现领先品牌 图标。- 项目和临时会话创建控件呈现专用 消息加会话图标。通用
IconPlus保留用于添加非会话实体。 - 当本地化文本标签或可访问名称被使用时,图标具有装饰性 存在;单击、键盘和焦点行为保持不变。
- 扩展的侧边栏品牌是一个本地化按钮,带有 20px 徽标和 Windows/Linux 上的 shell 名称;指针或键盘激活导航至 回家聊天。 macOS 隐藏该品牌并右对齐搜索然后折叠 侧边栏与本机交通信号灯位于同一 46 像素行中。全屏保留 品牌在回收原生镀铬填充物时隐藏起来。
3. 8 MVP 约束
- 扩展的侧边栏搜索过滤了可见的会话树;的 折叠的轨道继续使用全局命令面板
- 无拖拽重新订购合同;
manual是持久兼容性值 - 项目选项卡不会创建另一个主机工作区或第二个主窗格
3. 9 项目组合同
每个保留的项目都是一个标记为 section 的项目,由标准化完整路径键入。 标头拥有项目级控件;子列表拥有对话级别 控制。
| 元素 | 合同 |
|---|---|
| 组根 | 本地化项目名称;悬停和键盘焦点会在门户工具提示中显示完整路径以及可访问的描述,而无需更改行几何形状 |
| 目录披露 | 具有 aria-expanded / aria-controls 的单个全行目标;可能会在切换之前激活不活动的项目,但永远不会存档 |
| 项目引脚 | 仅限演示优先;无主机行 deletion/move |
| 项目档案 | 从默认视图中省略;可从存档视图恢复 |
| 项目结束 | 仅删除保留的选项卡;持久耐用的 project/sessions 仍然存在 |
| 会话列表 | 仅精确路径匹配;无基本名称分组 |
| 活跃组 | 恰好一组反映了选定的主机工作区 |
| 任务状态 | 正在进行、已选择、已完成和失败的指标按会话更新,无需替换可见的记录;优先级是进行中、选择、然后是最终结果 |
3. 10 本地简介页脚合约
扩展的侧边栏以受 WorkBuddy 启发的本地身份集群结束。 它借用了紧凑的头像和动作语法,但没有暗示云 帐户、订阅或协作后端。
| 元素 | 合同 |
|---|---|
| 页脚带 | 58px高、透明、无顶隔板;保持在可滚动 project/session 区域之外 |
| 配置文件触发器 | 44px 高、灵活宽度、圆形悬停目标;打开个人资料菜单 |
| 用户字形 | 30px 循环本地用户字形;当文本标签命名控件时具有装饰性 |
| 身份证明复印件 | 主要 Custom;次要 Local profile 或本地化 本地配置;两行独立截断 |
| 雪佛龙 | 追踪披露指标;当请求减少运动时反映菜单的打开状态而不运动 |
| 通知快捷方式 | 带有未读徽章的单独 32px 方铃目标;打开页脚上方和右侧的耐用收件箱 |
| 个人资料菜单 | 280px 宽,底部固定在页脚上方的 8px;不透明的高架表面 |
| 身份标头 | 重复字形和两行本地标识;非交互式 |
| 菜单操作 | 按顺序分隔符、设置、日志和主题;主题保留其当前值元数据 |
4. 主聊天
4. 1 目的
主要聊天区域包含 ChatTranscript 和 Composer。可滚动,工作站的中心。
4. 2 解剖学
+--------------------------------------+
| 聊天记录(可滚动,flex-1) |
| 消息气泡 (user/assistant) |
| 工具调用卡 |
| 转结果卡 |
| InlineReviewCard · 修改 App.tsx +8 −2 |
| 许可卡 |
| ... |
+--------------------------------------+
| 输入框(停靠在线程视图中; |
| 空置房屋底部保留,D204) |
+--------------------------------------+4. 3 布局
- 背景:bg-primary
- 最大内容宽度:720px(消息),居中
- 滚动行为:固定时自动滚动到新消息底部;第一个 向上手动移动会暂停自动滚动,而不会快速返回;发送/重试/ 在布局阶段重新生成重新固定并定位最新内容, 在下一个绘制帧之前,然后继续跟踪流内容
- 目标条目使用一个短 opacity/translate 转换。流媒体 更新发生在安装表面内,并且永远不会重播此转换。
- 成绩单的底部保留是高度感知,而不是固定的间隙。的 停靠的输入框测量其真实渲染高度(它随多行增长 草稿)并将其发布为
--composer-dock-height自定义属性:root;.thread-content储备calc(var(--composer-dock-height) + 16px)所以最后一条消息位于框上方约 16px 并且永远不会重叠,即使 草案增长。.jump-latest-btn和.minimap-rail锚定相同 变量,因此它们停留在输入框上方。
4. 4 状态
| 状态 | 行为 |
|---|---|
| 空 | 可滚动内容区域中的受约束的英雄+可选的入门清单,带有底部保留的家庭输入框,没有入门卡或上下文快速操作层(D111/D204/D206) |
| 流媒体 | 固定时自动滚动;追加新标记 |
| 积极进展 | 发送后,在第一个助手或工具事件之前,会内联显示一个紧凑的本地化 Working… 状态以及经过的时间。它屈服于具体的思维、工具和答案行,而权限卡拥有批准状态;不会渲染大型通用进度卡。 |
| 转结果 | 回合失败后,会话范围的恢复卡会总结中断和工具证据。已完成的轮次使用现有的记录和消息范围的 InlineReviewCard,无需额外的成功卡;失败的回合可以重试而不会丢失成绩单。 |
| 启动(发送/重试/重新生成) | 即使用户向上滚动,在绘制之前重新固定和定位最新内容;后来保留的用户消息事件不会在其顶部闪烁记录 |
| 空闲(流后) | 自动滚动解锁;用户可以自由滚动 |
| 消息范围的审核快照 | 每个成功的工作区 Write/Edit 工具行后面都有一个紧凑的 InlineReviewCard,其中包含该消息的 added/modified/deleted 状态和显式 addition/deletion 总计。它的大块头位于可扩展的披露后面:默认情况下,每个评论卡(内联和“评论”选项卡中)都是折叠的,用户可以根据需要展开它。该卡在 Git 提交后保留,永远不会成为 bottom/global 条目,并提供哈希保护的回滚,而不会泄漏到另一个会话的记录中。 |
4. 5 辅助功能
role="log"用于转录容器- 新消息公告文字记录中的
aria-live="polite" - 当用户在流媒体期间向上滚动时,会出现滚动到底部按钮
- InlineReviewCard 使用带有
aria-expanded的本机按钮和aria-controls。其本地化可访问名称包括路径、状态、 添加计数、删除计数;可见的文字和颜色不是 仅状态信号。 - 清空主页任务条目在始终可见的底部编辑器中启动。有 英雄和英雄之间没有入门卡或上下文快速行动层 输入框。
- 失败回合恢复卡是一个标记为
role="status"的区域 明确的文本操作。它使用图标几何形状加文字,从不单独使用颜色; 重试保留现有提示,继续将焦点返回到 输入框。完成的回合不会渲染这张卡。
4. 6 MVP 约束
- 没有分割窗格聊天(单线程)
- 没有 Markdown 编辑器预览分割
5. 工作面板
替换以前的 ContextPanel 覆盖层。 workspace/model/status 总结它在输入框芯片和设置中承载着生命。
5. 1 目的
停靠右侧工作栏,用于检查和引导座席的工作空间: 审查(工作树差异)、终端(交互式 PTY)、浏览器(嵌入式 预览)和文件(工作区浏览器)。食品法典委员会平价表面。
5. 2 解剖学
+---------------------------------------+
| ◫ App.tsx ⌄ drag | [×][>] | header, 46px
+---------------------------------------+
| 工具 菜单 |
| ▌◫ 回顾[×] |
| > 终端• ¤ |
| ◎ 浏览器 |
| ▤ 文件 |
| ------------------------ ¦ |
| 未清项目 |
| ▤ App.tsx [×] |
+---------------------------------------+
| 活跃资源体 |
| 审查:记录更改+差异 |
| 终端:xterm 主机 |
| 浏览器:URL栏+预览 |
| 文件:树+文件查看器 |
+---------------------------------------+
▌ active row edge marker • open, inactive
^ 10px transparent resize hit area on the left edge5. 2.1 浅色主题表面
- 面板主体采用静音插页纸(
#fafafa); 46px 标题带和工具 chrome(审阅工具栏、浏览器chrome、文件查看器标题)保持白色 - 标头公开一个统一的上下文触发器。它的菜单列出了四种工具 (审阅、终端、浏览器、文件)首先按固定顺序 — 每行显示 它自己的打开状态,一旦打开,它自己的关闭控制 - 并且,经过一段时间后 分隔符,仅是成绩单打开的进一步资源。没有出现任何条目 两次。行使用中性填充,并带有直的 2px 左边缘标记 活动行,绝不单独色彩;尾随关闭槽始终被保留,因此 标签和空心点永远不会在行之间移动。菜单淡入超过 ≤4px
--motion-duration-fast/--motion-ease-out下是静态的prefers-reduced-motion(D173) - 46px 标题遵循“上下文向左,操作向右”模型:统一 上下文触发器锚定左侧并显示活动工具图标并省略 标签;右动作簇固定在薄薄的后面的右边缘 分隔符,因此关闭/折叠控件永远不会随着标签长度而移动。 两者之间的间隙仍然是窗口拖动区域。塌陷控制 使用右侧 V 形,因此读作“将面板推开”,而不是“打开面板”
- 活动选项卡、文件树行、差异标题和调整大小手柄轻松悬停 填充
--motion-duration-fast/--motion-ease-out - 浏览器URL和空工具镀铬共享所使用的光嵌入场处理 通过设置控件 (D148)
5. 3 状态
| 状态 | 行为 |
|---|---|
| 关闭(默认) | 未渲染;启动时没有保留的选项卡。 Cmd/Ctrl + J 显示活动会话的面板上下文,而无需创建选项卡。内联审阅卡在成绩单中仍然可用,因为它们是消息范围的并且不需要工作面板。 |
| 打开 | 主窗格右侧停靠的弹性行;由工件或 Cmd/Ctrl + J 以 244–720px(默认 280px)的固定承诺宽度打开。它的弹性分配从零减少到承诺的宽度,因此 MainChat 不断回流。它占用客户区空间并且从不扩展操作系统窗口 (ADR 0033)。 |
| 多个工件 | 当前资源标头在面板上最少保留一个可读标签;它的有界菜单首先列出工具,然后按先打开的顺序列出转录打开的资源,并具有完整路径工具提示和独立的关闭控件 |
| 会话切换 | 目标会话保留的打开状态、选项卡、活动选项卡和浏览器资源自动替换前一个会话的面板上下文;上下文都没有被删除 |
| 调整大小 | 左分隔线遵循锚定指针增量或键盘输入。指针在每个动画帧上更改预览一次,并仅在发布时提交宽度和预留;转义、指针取消或丢失的捕获都可以恢复。本机窗口边缘调整大小仅更改 MainChat。 |
| 没有工作空间 | 每个选项卡呈现自己的“打开项目”空状态 |
| 受限工作区域 | 面板保持其承诺的宽度; MainChat 会回流以吸收它,并且在小窗口上可能会低于其 360px 目标 (ADR 0033) |
5. 4 互动
- 触发器:file/URL 引用、BrowserPreview 和完成的命令工件 create/activate 原始会话运行时中的资源选项卡 上下文。 BrowserPreview 事件携带
sessionId,渲染器保留 该会话的预览 path/URL 作为其浏览器资源。成功的工作空间 Write/Edit 工件 create/activate 在原始会话中查看。Cmd/Ctrl + J显示活动会话的保留面板上下文,无需 创建资源;如果没有活动会话,它什么也不做。捷径是 当“设置”处于活动页面时被忽略。 背景工件可能会更新保留的上下文,但永远不会揭示它, 调整窗口大小,或更改可见的 selection/focus。抄本确实 不创建全局审核更改启动器:每个成功的工作区 Write/Edit 行仅拥有其相邻的 InlineReviewCard,而另一个会话 无法在其记录中呈现该卡。重复资源去重 在原始会话内。 - 回顾事实:host-core 为每个
details.review添加一条有界details.review记录 成功的工作区 Write/Edit 结果。渲染器读取该记录 拥有的文字记录消息,因此状态、计数和帅哥准确描述 该行更改了什么并在提交、重新启动或之后保持可用 工作区开关。 Review选项卡是同一会话的时间顺序变化 历史记录,而不是当前工作树扫描;它重复使用相同的消息拥有的卡片, 每个默认情况下都会折叠,直到用户将其展开。它的回滚动作 呼叫主人;主机将当前内容与录制内容进行比较 后工具哈希和 返回冲突而不覆盖以后的工作。 - 统一上下文菜单:当面板可见时,菜单中的一个上下文触发器 标题打开一个下拉菜单。它的顶部列出了以下位置的开放资源: 首先打开的订单(行选择一个资源并保留每个资源关闭 控制);分隔线将其与列出评论的创建新部分分开, 终端、浏览器和文件作为稳定项目。激活关闭的工具会创建 通过
openWorkPanelTab;激活打开的工具选择其单例 选项卡。活动工具结合了中性填充和 2px 边缘标记,并打开 不活动的工具显示一个小状态点。触发器随面板消失 并且在Cmd/Ctrl + J显示面板后仍然可用。神器 触发器仍然以原子方式创建和激活资源;仅快捷方式 揭示现有的背景。 - 资源标题:46px标题显示活动资源图标和 椭圆形标签。其上下文 V 形打开所描述的有界统一菜单 上面;标题尾部的关闭按钮关闭当前资源 直接。箭头键、Home、End 和 Escape 操作菜单;打开菜单 隐藏本机浏览器预览直至其关闭。
- 选项卡关闭:关闭活动选项卡会选择其右侧邻居,然后选择其左侧; 关闭最后一个选项卡会隐藏面板。面板级塌陷控制寿命 在会话窗格右上角(不是工作面板内容标题)并隐藏 面板而不删除运行时选项卡集;后来的工件重新打开它。 终端仅在其第一个命令工件之后安装,并在 它的选项卡存在,因此 PTY 和回滚可以保留切换。
- 上下文更改:选择另一个会话自动投影该会话的 保留
{open, tabs, activeTabId, browserResource}状态。上一个 会话的上下文保留在渲染器内存中,并在选择时恢复 再次。没有活动对话的工作区选择会隐藏面板。 每个上下文仍然与其原始 session/workspace 绑定,因此相对 文件和浏览器资源永远不会针对另一个工作区重新解释。 - 调整大小:将指针拖动到左边缘手柄上;
ArrowLeft/ArrowRight以 16px 为步长调整(Shift使用 32px),Home/End达到当前值 修复244px/720px限制,双击恢复默认宽度。 指针数学锚定到按压位置和起始承诺宽度, 因此抓住手柄无法跳过分隔线。移动事件是 框架合并;释放 提交一次,而 Escape、指针取消和丢失捕获取消。 10 像素点击区域保留全局列调整大小光标并抑制文本 手势期间的选择。实时预览仅更改渲染器列; 成功提交会更新提交的首选宽度。原生窗口边缘 仅通过回流调整 MainChat 的大小,而不是面板或其首选项 (ADR 0033)。 - 持久性:所有会话上下文仅是渲染器运行时状态。在应用程序上 启动、打开状态、选项卡、活动选项卡选择、文件请求和浏览器 资源重置;仅承诺的首选
{width}保留在 本地存储pi.desktop.workPanel。渲染器总是请求一个原生的 保留宽度为 0,因此操作系统窗口永远不会扩展 (ADR 0033)。崩溃 最后选项卡关闭和分隔符提交仅更新已提交的首选内容 宽度。目标更新是幂等的。面板回流 MainChat 内 固定窗;在受限工作区域,聊天可能会低于其 360 像素目标。 Maximized/fullscreen 几何形状不受影响。后台会话工件 永远不要更新可见面板。渲染器仅更改面板呈现 最新(零宽度)预订请求成功后;被拒绝或 被取代的请求保留最后确认的呈现状态 (D163,ADR 0032)。
5. 5 辅助功能
<aside>里程碑。当前资源控制暴露aria-haspopup="menu"/aria-expanded/aria-controls,保持其可见 label 作为其可访问名称,其role="menu"下拉列表将行分组到 标记为role="group"部分。行为menuitemradio/aria-checked在role="none"内获取真实 DOM 焦点 (tabIndex={-1}) 的按钮 包装器,因此 ArrowDown/ArrowUp/Home/End 仅跨行移动焦点,从不移动焦点 通过尾随关闭按钮; Delete/Backspace 关闭焦点行。 Escape 和 Tab 关闭菜单并将焦点返回到触发器。每个资源 主体仍然是role="tabpanel"- 调整手柄大小:可聚焦
role="separator"aria-orientation="vertical",本地化标签,动态aria-valuemin/aria-valuemax/aria-valuenow,可见焦点,以及 Arrow/Home/End 键盘控制。 Escape 取消活动的指针手势。 - 每个资源关闭和唯一的会话窗格面板折叠按钮公开 本地化名称
5. 6 MVP 约束
- 选项卡内容规范:评论有主机保护的回滚,但没有行注释; 浏览器是用户驱动的(无代理控制);文件是只读的
- 单面板实例;没有每个选项卡分离或拆分
6. 会话列表
6. 1 目的
按侧边栏中的执行上下文列出用户会话。它暴露了 每个保留的项目选项卡的会话以及没有的持久会话 项目。 Pin/archive/collapse 状态是持久主机的表示 会话,而不是替代持久性模型。
6. 2 解剖学
小组和会议项目:
[folder] current-project [+]
Session title
[folder] another-project [+]
Session title
SESSIONS [msg+][↕]
Session title6. 3 状态
| 状态 | 外观 |
|---|---|
| 活跃 | 中性口音轮廓环、活动背景突出显示、文本主色 |
| 不活跃 | 背景辅助、文本辅助 |
| 悬停(非活动) | BG-第三级 |
| 进行中 | 警告-橙色呼吸点;减速运动下无运动 |
| 已完成 | 成功-绿色复选标记 |
| 失败 | 错误-红色圆圈警报标记 |
| 已固定 | 在所选排序中的未固定行之前排序 |
| 已存档 | 默认省略;仅当启用存档视图时显示 |
6. 4 交互
- 单击:激活会话
- 项目匹配使用规范化的完整项目路径,而不仅仅是文件夹 基本名称。
- 保留路径的会话显示在其相应项目下方 组。封闭路径的会话仍然可以从“设置”→“项目”中发现 存档。
- 选择临时会话会清除活动工作区,因此会话和 工具上下文并不意味着项目访问。
- Pin/archive 操作更新渲染器呈现元数据;删除残留 显式持久主机操作。
- 创建空闲对话完整当前记录的分支快照 进入独立会议。孩子留在同一个项目或 独立会话部分并变为活动状态;后来 transcript/configuration 发生了变化 不影响来源。对于正在运行的源,该操作被禁用。
- 首先选择与不同项目的对话会激活该对话 项目的工作区。先前选择的会话中的运行回合是 没有中止。
- 从工具栏或行触发器打开的侧边栏主体级菜单仍然存在 内容大小并使用与右键菜单相同的固定规则:打开4px 锚点在右侧而不向左翻转。它们的表面宽度为 为窄视口设置了上限。这包括会话排序菜单, session/project 溢出菜单和部分创建菜单。
- 键盘:箭头 up/down,回车选择
- 删除:行菜单或命令面板
builtin.session.delete
6. 5 辅助功能
- 每组都有一个标记为
section。 - 特定于范围的创建按钮公开本地化的
aria-label值。 - 活动行公开选定的视觉状态并保留其完整标题 工具提示。
- 存档状态和每个任务状态都是宣布的,而不是通过传达的 单独的颜色。状态槽还使用不同的几何形状来选择,在 进度、完成和失败。
6. 6 MVP 约束
- 搜索仍然是本地标题过滤器;存档可见性和排序是 本地视图控件而不是主机查询。
- 临时意味着不受项目约束,不是临时存储;这些 会话在重新启动后仍然有效。
- 独立的会话主体最多显示五个紧凑的 28 像素行,并且 当存在更多行时在内部滚动。项目列表使用剩余的 侧边栏高度和滚动独立;两个区域都不滚动页脚 或主要导航。
7. 聊天记录
7. 1 目的
可滚动容器呈现用户消息的有序序列,助手 回合、轻量级工具活动行以及会话的权限卡。 由工具调用分隔的提供商级助手片段在 存储,但组成一个助手轮流,直到下一条用户消息。
7. 2 解剖学
+----+-------------------------------------+
| 地图 | [用户留言气泡] |
| 铁路 | 【思考披露】 |
| | [辅助回合] |
| | [辅助片段] |
| | [工具调用行] |
| | [许可卡](中断) |
| | 【助理片段(简历)】 |
| | [元+一个操作工具栏] |
| | [用户留言气泡] |
| | ... |
+----+-------------------------------------+7. 3 状态
| 状态 | 行为 |
|---|---|
| 会话激活 | 在布局过程中,在转录的第一个绘制帧之前重新固定和定位最后一条记录 |
| 会话转换 | 先前的完整视图保持稳定且非交互,直到延迟目标树准备就绪;当前流更新不会延迟 |
| 流媒体 | 追加新令牌;仅在固定到底部时自动滚动 |
| 回合开始 | 发送/重试/重新生成重新固定跟随模式并跳转到底部 |
| 仅思考流媒体 | 文字记录打开;披露保持开放;没有空的答案气泡或重复的工作行 |
| 空闲 | 可滚动;没有自动滚动 |
| 正在等待许可 | 内嵌插入许可卡;决议后继续转录 |
| 上下文检查点 | 现有的成绩单仍然可见;压缩在其覆盖的消息后面添加一个分隔行和一个警告 toast |
| 错误 | 带有可操作重试链接的错误消息气泡 |
7. 4 交互
- 滚动:第一次向上滚动会立即暂停自动滚动, 取消待处理的后续工作,并显示“滚动到底部”浮动按钮; 流或调整大小更新无法将视口拉回来;发送/重试/ 重新生成重新固定并跳至底部
- 悬停消息:出现复制操作
- 工具调用前后发出的助手片段合二为一
role="article"回合。转牌暴露了一个尾随元行和一个动作 工具栏; Copy 按顺序连接所有内容片段,而 Fork 和 重新生成使用最后一条内容丰富的辅助消息作为持久边界。 - 切换思维披露:expand/collapse 独立于 最终答案;当推理到达时,流式传输会重新打开它。扩展后的 内容的左侧规则本身就是一个指针和键盘可聚焦的折叠 控制。
- 悬停代码块:出现复制按钮
- 将鼠标悬停或聚焦在小地图标记上:显示本地化的发件人和有界的 纯文本预览;一个用户内产生多个助手片段 回合合并为一个人工智能响应标记和预览;附近的标记 水平放大,无需对导轨进行回流焊
- 单击小地图标记:在靠近顶部的位置平滑滚动其消息 转录视口
- 滚动文字记录:针对锚点更新活动小地图标记 靠近视口的上三分之一处
- 仅当文字记录溢出一页时才显示小地图轨道;如果 内容适合视口,即使存在两个或多个标记也隐藏导轨
- 将小地图堆栈置于下方无阻碍垂直跨度内的中心 46px 标题栏和停靠的输入框上方。随着标记数量的增加,压缩 标记间距和间距,因此每个标记都保持在该范围内 比进入本机窗口拖动区域
- 来自流事件和内容调整大小的跟随滚动请求被合并到 至多一个待处理的动画帧。新令牌无法取消和重新创建 已经安排好后续工作。
- 向上手动滚动优先于待处理的跟随框架,包括 亚阈值触控板移动仍接近底部。向下 仅当视口返回底部 48 像素以内时,滚动才会重新固定。
- 小地图内容调整大小仅检查溢出。消息位置测量是 保留用于滚动、标记标识更改和视口调整大小,因此 流式内容高度更新不会将每条消息扫描两次。
- 上下文压缩永远不会删除、折叠或替换可见消息 行。它为每个压缩添加一个非消息分隔行,锚定在 检查点覆盖的最后一条消息;无论助手转动它,该行都会结束 落入内部,并且不再绘制锚点不再存在的行。的
new_context工具是普通工具调用,并到达处理组,如 任何其他。
7. 5 辅助功能
role="log"容器aria-live="polite"用于新内容公告- 每个用户消息和组成的助手转:
role="article"和aria-label描述发件人 - Thinking 使用
aria-expanded和aria-controls的按钮披露; 本地化标签将显示思维与隐藏思维区分开来,并且 折叠面板对可访问性和焦点遍历隐藏 - 小地图是本地化的导航地标;每个标记都是一个按钮 标有其消息发送者
- 最接近读取位置的标记暴露
aria-current="true"和 键盘焦点会打开与指针悬停时可用的相同预览
7. 6 MVP 约束
- 文字记录中没有消息搜索
- 无内联消息分支树;每个用户的重新生成变体保持线性 根转。会话级Create分支产生独立对话 row 而不是在转录本中添加树镶边。
- 小地图仅在至少存在两个符合条件的回合标记时渲染和 转录内容溢出一个视口(scrollHeight > clientHeight)。 每条可见的用户消息都会创建一个标记;所有内容丰富的助手 碎片,直到下一条用户消息创建一个锚定的 AI 响应标记 到第一个内容片段。仅工具行不会创建标记或 分割人工智能的反应,一页的文字记录永远不会显示出轨道。
- 标记预览的上限为 280 个源字符,并且仅供显示
- 派生的可见行、小地图行和活动分组由
messages快照。完成消息行、组成助理回合,以及 活动组保持稳定的渲染边界,而只有当前流 片段变化。
8. 消息气泡
8. 1 目的
单个消息渲染 — 用户(纯文本)或助手(Markdown 流)。
8. 2 解剖学
用户留言:
+------------------------------------------+
| 明文消息内容 |
| 时间戳·编辑图标 |
+------------------------------------------+助理消息:
+------------------------------------------+
| [思考▾] |
| 单独推理降价(可选) |
| ──────────────────────────────────────── |
| [Markdown 渲染内容] |
| 代码块:mono、bg-inset |
| 内联代码:mono、bg-inset |
| 时间戳 |
+------------------------------------------+8. 3 布局
- 最大内容带:760px 线程列;助理身体最大720px
- 用户:右对齐、主题中性的软板(主墨水上的
color-mix, 从来没有固定的口音色调),无边界,radius-lg-plus更紧 右下角,上限为min(82%, 600px),因此简短的提示如下 聊天轮流而不是全角块。用户正文是明文 保留硬换行符(white-space: pre-wrap); 仅应用 trailing/leading 输入框修剪,从不应用内部换行符 崩溃。可预览路径和 URL 控件与该明文保持内联; 长引用在板内换行,连续行保持逻辑开始 对齐而不是继承浏览器的居中按钮文本。 - Assistant:透明表面,左对齐,Markdown 完全渲染 内容宽度
- 思考:答案上方单独轻量披露,无卡 背景或外边框。其 Sparkles/chevron 触发器使用辅助文本, 扩展的降价由微妙的主题标记左规则缩进。它 永远不会连接到答案降价中。
- 悬停操作:气泡下安静的仅图标操作芯片 - 始终复制; 完成辅助回合后分叉并重新生成;对用户进行编辑和删除 轮流。辅助行既不公开删除也不公开编辑。芯片渲染字形 单独:标签由
aria-label加上主题 hover/focus 携带 芯片上方的工具提示,绝不是可见的标题文本 (D137)。右对齐 对于用户转动,左对齐 助理轮流;在 hover/focus-within 上可见。重新生成截断 持久转录到最近的先前用户提示符并重新运行该回合 就位而不是附加重复的分支。当超过 1 个时 存在变体,root 用户上有一个 ChatGPT 风格的current / total寻呼机 切换归档分支而不丢失历史记录(D109)。之后 Retry/Regenerate 启动,root 用户轮流保留在实时记录中 并在revisionCount > 1时拥有寻呼机;更换 assistant/tool tail 不得将该寻呼机从用户气泡中移动或分离。寻呼机是 消息操作工具栏的一部分:默认隐藏并一起显示 在行悬停或键盘焦点上复制。 Fork 创建并激活一个独立的会话,其快照结束于 选择辅助响应,需要一个空闲源,然后留下 源的转录本、实时运行时和提供程序缓存状态保持不变 (D134)。 编辑属于用户回合:它将提示气泡替换为焦点 内联文本区域(Escape 取消,Cmd/Ctrl+Enter 保存;斜杠转为种子 输入command表单,保存后会重新扩展模板),扩大用户范围 打开时将列调整为助理阅读宽度,并隐藏操作 工具栏。保存运行重新生成路径,新文本位于同一路径中 会话,因此替换的提示及其整个答案尾部被存档为 D109 修订版和寻呼机返回到原来的交换。安 未更改的提示将关闭编辑器而不花费一回合(D137)。 - 工具介导的辅助输出使用前一用户的视觉转向 消息到下一条用户消息。中间提供商消息边界 围绕活动披露的有序降价片段仍然可见,但是 不要创建额外的元行或操作工具栏。单个复制操作 按顺序复制所有内容片段;分叉并重新生成目标最后一个 内容丰富的片段,因此现有的持久转录语义保持不变 (D157)。
- 助理元:可选模型徽章+紧凑的 Codex 风格上下文检查器 在答案下。检查员在旁边放了一个小的剩余容量环
Context标签和百分比;低容量改变语义颜色 而不使颜色成为唯一的信号。将鼠标悬停或键盘焦点打开 非模态、可滚动面板,具有清晰的剩余令牌标题,used/window 计数、已用容量计和紧凑的 turn/speed 汇总单元。提供商 工具部分带有明确的 reported/estimated 源徽章。的 提供程序部分显示了确切的 input/output/cache/reasoning 用法和 提供商报告的缓存命中率 (cacheRead / (input + cacheRead)) 缓存读取元数据可用;生成速度是完成一圈的值 以每秒令牌数为单位,并且在响应流式传输时不会更新。的 面板还列出了每个独特的工具类型 助理提交首次看到的执行顺序及其调用计数,汇总 argument/result 足迹、分享栏和累积持续时间。提供商 总数准确;上下文窗口总计使用相同的pi-ai模型 元数据作为代理 sidecar,而未知模型则回退给提供商 目录或默认窗口。工具行明确标记为估计值 因为提供程序不会报告每个工具的上下文分配。面板是 作为固定视口覆盖层传送到文档主体,翻转 触发器上方或下方,夹住视口边缘,然后重新定位 转录本滚动或窗口大小调整,因此转录本剪辑祖先不能 隐藏它(D103,D184)。当活动会话具有已安装的上下文时 检查点,面板在提供商和工具之间添加一条静音线 部分 - 会话已压缩了多少次以及最新的摘要 估计的代币成本——除此之外什么也不呈现。成绩单 每次压缩显示一行;这一行添加了那些行不能添加的内容,旁边 上下文当前花费在什么上(D203)。 - 间隙:连续消息行之间的 12px 垂直填充(比 消费者聊天,更接近 WorkBuddy 任务记录);助理轮流添加一个 底部空气很少,因此完整的答案与下一个提示分开
- 字体:正文基于文本(14px); text-sm (13px) 单声道代码
- 工具活动:工具名称分类选择语义 15px 图标;
fork、fork_agent、fork_task和fork_session使用 GitFork 分支 图标而不是通用工具字形。
8. 4 状态
| 状态 | 外观 |
|---|---|
| 流媒体 | 沿着整个辅助回合强调左导轨(碎片+工具行);导轨的空间始终被保留,因此它的褪色 in/out 永远不会回流文本;内容增长 |
| 思维流 | 公开披露;答案气泡被省略,直到答案文本存在 |
| 完成 | 没有流媒体规则;完整渲染的降价 |
| 错误 | 成绩单中的助理错误卡;本地化总结+稳定代码;详细信息披露开放给经过编辑的提供商响应、provider/model ID 和复制操作;可重试失败 显示重试和配置失败 显示打开设置 |
8. 4a 上下文压缩行
不是气泡:转录本行之间的全角分隔线,在最后一个之后绘制 其检查点覆盖的消息。
- 一个居中标签 - 会话已压缩多少次 - 带有细线 规则填充两侧的空间,使用
--ds-border-subtle。 - 第二个静音部分说明摘要的估计代币成本,或者没有 摘要已生成(无摘要系列)。
--ds-text-muted位于--text-2xs,带有表格数字;细节部分 步骤到--ds-text-secondary。页边距与文字记录的行节奏相匹配。role="separator"。没有动作,没有悬停状态,没有选择,没有披露。 检查点的任何内容均不可编辑,因此该行仅供参考。
8. 5 辅助功能
- 用户:
aria-label="User message" - 助手:
aria-label="Assistant message" - 思考触发器公开本地化的 Show/Hide 标签、
aria-expanded和aria-controls与推理面板的关系 - 上下文检查器触发器是键盘可聚焦的,公开本地化的 剩余百分比和代币数量,并揭示了相同的细分 悬停或聚焦
- 时间戳:
aria-label带有完整时间字符串,视觉显示相对时间
8. 6 MVP 约束
- 无消息 reactions/annotations
- 无法编辑用户消息(推迟)
- 复制助手答案不包括思考文本
8. 7 Markdown & 代码渲染(已实现)
Renderer: apps/desktop/src/components/Markdown.tsx + apps/desktop/src/lib/shiki.ts
styles/prose.css中.prose-chat/.code-block下的散文风格。
- 无卡顿流式传输:运行时内容块直接渲染,无需 第二个渲染器端打字机或动画帧状态循环。源分裂 通过
marked的词法分析器进入顶级块;每个块都通过一个渲染 已记住<ReactMarkdown>。当仅流式传输尾部块时重新解析 (从最后一个块边界开始增量 re-lex),因此成本在 消息长度。美人鱼栅栏保留在正常的源代码演示中 直到其匹配的关闭栅栏到达;部分流图永远不会 输入图表解析器。 - 插件:
remark-gfm(表格、任务列表、删除线、自动链接),remark-math+rehype-katex(内联$…$,显示$$…$$)。原始 HTML 是 由rehype-raw解析并立即受扩展约束rehype-sanitize默认架构;仅渲染器拥有的 audio/video/source 允许添加。 KaTeX 的 Vite 内联 WOFF2 字体被允许 渲染器的font-src 'self' data:CSP 指令。 - 美人鱼图(D165):助手中完成的
mermaid围栏块 答案散文通过官方美人鱼包呈现。依赖关系是 仅当图表接近视口时才动态导入;美人鱼的 全局主题配置和渲染调用是序列化的。图源 字符数上限为 20,000 个,图形边数上限为 500 个。严格的安全性, 受保护的配置密钥,禁用 HTML labels/links,以及第二个 DOMPurify SVG 配置文件在插入之前传递。不安全的 external/media 元素,foreignObject、支持事件的链接和 URL 属性已删除。无效 或者过大的输入会退回到可读的源视图。工具栏切换 diagram/source 并复制原始来源; light/dark 主题更改 重新渲染 SVG。思考散文故意将mermaid栅栏保留为 源代码,因此折叠的推理跟踪无法启动图表布局。 - 语法突出显示:使用 JavaScript 正则表达式引擎的 Shiki 单例 (无 wasm),主题
font-src 'self' data:/mermaid紧随data-theme。 以编码为中心的本地目录公开了 48 种规范语法以及常见语法 别名;每个语法都在其第一个匹配的栅栏标签上延迟加载 普通单声道后备直至准备就绪。该目录之外的标签仍然可读 纯文本,而不是将完整的 Shiki 语言分布拉入 应用程序。规范目录为astro、bat、c、cpp、csharp,css、dart、diff、docker、dotenv、go、graphql、groovy、hcl、html、ini、java、javascript、json、jsonc、jsonl、jsx、kotlin、lua、make、markdown、mdx、mermaid、nginx、php、powershell、prisma、proto、python、ruby、rust、scala、shellscript、sql、svelte、swift、terraform、toml、tsx、typescript、vue、xml和yaml。流代码仅重新标记 通过链接 GrammarState(每行缓存)更改行,因此每帧成本 无论块大小如何,都是恒定的。 - 代码块镀铬:
.code-block单面卡(radius-md-plus, 发际线边框;深色#282c34、浅色#fafafa— 匹配 One Dark Pro / 一盏灯编辑器 bg)。标题是透明的(语言标签左,复制右); bodyshellscript/sql/token 跨度具有无嵌套背景,因此 Shiki 令牌 颜色位于一张卡片表面。正文位于 text-sm-plus / 领先-放松,水平滚动,制表符大小为 2。 - 散文:更平静的聊天密度 - 正文以文本为基础/以散文开头 漂亮的包装;航向坡道 h1
text-xl(细线下划线)→ h2text-lg-plus→ h3text-lg→ h4text-base-plus→ h5/h6text-base次要; blockquotes 在软板上使用 3px 中性规则; hr 是褪色的中心渐变;列表使用更安静的标记和弹性任务 行;内联代码获得细线边框+柔和的灰色色调;桌子包裹 在.table-wrap(圆壳、标题行、偶数行洗、悬停洗); 显示数学位于一个微妙的插入板上。思考散文重复使用相同的内容 text-sm-plus / 辅助颜色的层次结构。 - 浅色主题:安静的表面 - 链接使用柔和的下划线墨水 (不硬black/blue),内联代码
#f2f2f2,围栏代码卡使用一 浅色#fafafa(无嵌套清洗/阴影),块引用#f6f6f6, 白色表格,带有#f3f3f3标题/#fafafa斑马。黑暗围栏代码 使用 One Dark Pro#282c34。 - 链接:工作面板中的普通点击预览;修改后的点击保留
target="_blank"因此主要路线经过shell.openExternal;窗口内 导航仍然被阻止。 - 长转录行为:
.thread-scroll设置overflow-anchor: none(固定跟随拥有滚动位置),.message-row使用content-visibility: auto和屏外美人鱼图延迟加载和 布局,直到它们接近视口。
9. 工具调用行
9. 1 目的
显示语义工具操作的轻量级内联披露行,其主要 参数提示、状态和结果的可读呈现。遵循D071 并且故意不是一张高级卡。
连续的工具调用形成一个 ChatGPT 样式的处理组。该团体是 默认情况下折叠,其标题在活动时显示 Processing · 12s 或 Processed for 12s 完成后。展开它会显示订购的工具 活动行及其嵌套结果披露。小组报告持续时间 和遏制,而不是结果:失败的孩子本身仍然是一个错误 ToolCallRow 但从未将组标头更改为终端故障。终端 代理错误仍归助理错误和 TurnOutcomeCard 表面所有。
9. 2 解剖学
[sparkle] Processed for 12s 3 steps [›]
├─ [file] Read /src/foo.ts [›]
├─ [search] Searched TODO 24 matches [›]
└─ [terminal] Ran pnpm test exit 1 [›]
├─ Command [copy]
│ pnpm test
├─ Output [copy]
│ 3 passing
└─ Errors [copy]
1 failing- 领先的 Lucide 图标反映了操作类型:文件、文件夹、搜索、 编辑、终端、Web 或通用工具。
- 组标题包含已用计时器和步数。它停留在 完成后的记录,除非明确打开,否则保持折叠状态。
- 处理组跨越完整可用的辅助列,因此扩展 即使标头或有效负载很短,结果详细信息也会保持可用宽度。
- 可见标签是自然语言操作(
Read、Ran、Searched), 不是原始函数名称。跑步动作采用渐进形式。 - 主要参数是固定的单行等宽提示。
- 结果芯片遵循提示:退出代码(错误色调)、match/file 计数、 替换计数、写入或读取大小、
truncated、scratch。一个成功的 退出不会获得任何筹码——行状态已经说明了这一点。 - 在 hover/focus 或扩张之前,披露 V 形是安静的。
9. 3 扩展块
扩展的主体是标记块的列表,而不是 JSON 转储 (D192)。的 pi-ai 结果信封携带 details 中的结构化有效负载并重复它 作为模型的文本;仅呈现结构化的一半,因此不会出现任何字节 两次。
| 工具 | 积木 |
|---|---|
| 阅读 | File content — 从文件扩展名中突出显示的语法 |
| 写 | Written content — 从目标扩展中突出显示 |
| 编辑 | Changes — 紧凑差异,仅当没有 ReviewChangeCard 拥有时 |
| 重击 | Command(外壳)、Output、Errors(错误色调);空通道被省略 |
| 全局 | Files — 可点击的工作空间路径 |
| 格雷普 | Matches — 按文件分组,带有 line 装订线和 outputMode: content 的可点击路径标题; filesWithMatches 的可点击路径列表; path → count 的点击计数字段 |
任何主机 notice | Note — 中性,在其合格的块之后(搜索范围、剪裁长行、读取窗口) |
| 任何失败 | Error — 消息加代码,首先列出 |
| 未映射的有效负载 | 标量条目作为 label/value 字段;长或多行字符串作为自己的标记块;嵌套对象为 JSON |
- 仅当结果块不存在时,参数才显示为
Input字段块 已经携带它们,或者对于不透明工具(use、fork、fetch) 争论是有趣的部分。参数已显示为行提示 不重复。 - 每个块都公开一个紧凑的复制操作,该操作复制完整的有效负载,而不是 可见切片。
9. 4 布局
- 外排:透明、无边框、无阴影,高约24px
- 图标:15–16px;披露 V 形:12px
- 标题间隙:4px;扩展主体插入:24px
- 芯片:等宽
--text-2xs、细线边框、退出代码的错误色调 - 代码、文件列表、匹配列表和字段块:
font-mono text-sm、 可独立复制,上限为 260px,具有内部滚动功能 - 差异块重复使用审查卡的
.diff-line导轨 - 只有扩展的内容才会有插入表面和微妙的边框
9. 5 个州
| 状态 | 标头处理 | 扩展内容 |
|---|---|---|
| 跑步 | 渐进式动作 + 闪光 + 旋转器 | 最新部分输出 |
| 成功 | 过去时动作+结果筹码;没有绿色成功徽章 | 结果块,然后是参数(如果尚未显示) |
| 错误 | 过去式动作+紧凑的危险状态;自动扩展 | 首先是错误注释,然后是参数 |
| 被拒绝 | 静音 Denied 状态 | 可用时的许可结果 |
9. 6 互动
- 单击行:expand/collapse 结果块;成功行默认值 折叠和失败的行会自动打开。
- 单击处理标题:expand/collapse 订购的活动列表。 处理组默认折叠,包括在回合处于活动状态时。
- 单击或键盘激活扩展思维、工具旁边的左侧规则 详细信息、委派的工作或处理步骤:折叠该所有权 公开而不改变相邻的扩展状态。
- 失败的子行保持自动扩展和错误色调,而包含 即使后来的工具恢复了,组也会稳定为
Processed for {elapsed}。 扩展使用短 height/opacity 过渡并保留折叠内容 惰性的。 - 运行更新替换最新的部分输出。积木已建成 仅在扩展上,因此流媒体费用保持便宜。
- 结果在争论之前呈现,因此主要结果具有更高的 信息优先。
- 文件路径和 Grep 解析时会在工作面板中打开标题 在工作区根目录下;它之外的路径保持纯文本。
- 主机截断标记保持可见,并且不能通过扩展绕过。 渲染的列表和差异有上限并报告隐藏的剩余部分。
- 语法突出显示在 100 KB 或 800 行以上被跳过。
9. 7 辅助功能
role="region"和aria-label="Tool call: {toolName}"- 通过本地化的
aria-label文本宣布状态 - Expand/collapse:
aria-expanded+aria-controls - 扩展内容左规则折叠控件是带有 本地化的可访问名称和可见的键盘聚焦环。
- 复制操作带有
aria-label="Copy {block label}" - 键盘对焦使用标准嵌入式对焦环
9. 8 MVP 约束
- 没有字级差异细化;编辑差异是基于行的
- 在回合边界可供使用之前,不得进行跨行活动分组 转录成分
9. 9 委派行和扇出拓扑(D201、ADR 0062)
Task 调用与任何其他调用一样都是 ToolCallRow,带有 delegate 操作图标 和一个额外的标头元素:一个安静的芯片,命名它运行的委托,采取 来自它生成的行,或者在任何行到达之前,来自调用自己的 agent 论点。行提示是调用的短 description。
└─ [bot] Delegated code-reviewer check the store diff [›]
├─ task [copy]
│ Review the changes in src/stores for …
├─ Details
│ status completed turns 4 toolCalls 9
└─ [bot] What code-reviewer did 3 steps
├─ [thinking] Thought for 2s [›]
├─ [file] Read /src/stores/app-store.ts [›]
└─ The queue drops a request by id, so …- 代表团始终可扩展,即使没有结果限制:简介、 报告和代表自己的行都位于正文中。
- 块顺序是简短输入、报告输出、计数器最后:
task参数作为input块,将报告作为输出块,然后保存一个Details块 返还的计数器 pi —status、turns、toolCalls和usage存在。agent被省略,因为标头芯片已经显示了它,并且error呈现为前导错误块,而不是计数器。的 委托自己的行跟随整个正文,因此摘要在正文之前读取 细节。 - 失败的委派显示其错误而不是空报告。
- 委托的行在
.subagent-run块内呈现,缩进在 发际线导轨,以代理名称和步数为首。他们崩溃了Task行,因此静态转录本读作每个代表团一行。 - 通过构造,嵌套深度为一层:代表没有
Task工具。 - 委托行是该块内的普通行 - 具有自己的工具行 披露、思考行和答案行——因此不需要新的演示 对于代表所做的事情。
- 报告仅打印一次。 当代表给出答案时 行,该行是报告,正文的输出块被抑制;当它 没有产生任何内容(中止、上限、失败),主体将其打印出来。
- 代表行永远不会出现在回合流、小地图或处理中 他们自己的团体;仅按父级的行进行分组 (
03-runtime/04-data-storage.md§4.7a)。 - 每次渲染时都会从消息列表中重建运行,因此可以进行组记忆 通过行标识和长度而不是对象标识来比较它们 - 否则流委托将冻结在其第一行。
- 单个
Task保留上面的紧凑行。一次调用两个或多个Task活动组成为一张全角授权卡而不是无关的 行。它的标头显示了聚合状态、子代理的数量、 settled/total 计数和经过的时间;它保留标准的披露插入符号。 - 扩展卡渲染一张具有一个主代理根的低噪声点状画布 按父行顺序连接到
Task节点。运行时暴露没有 委托依赖关系并禁止嵌套Task,因此渲染器不得 发明委托到委托边缘或下游汇总节点。 - 每个节点显示定义名称、简短描述、明确结果、 持续时间和步数。结果更喜欢结构化的
Task结果 (completed、truncated、aborted、failed)并回退到传输 状态(running、error、denied、success)。单击该节点将展开 现有 brief/report/counters 和嵌套行;报告仍处于打印状态 正好一次。 - 回合激活时首次出现的拓扑会打开一次,以便进度 是可见的,并且在回合时不会自动折叠。重载历史 默认情况下保持折叠状态。标题和每个节点都是键盘 通过 settled/total/
Task进行披露;状态以文本形式写入 并在视觉上得到强化,而不是仅通过颜色来传达。在狭窄的聊天中 宽度使图形成为垂直流,而不会出现水平页面溢出。
10. 权限卡
10. 1 目的
内联记录卡请求用户批准高风险工具调用。参见 03-permission-ux.md 了解完整策略。
10. 2 解剖(内嵌卡)
+----------------------------------------------+
| ⚠ 需要许可 |
| 工具:写入·风险:高 |
| 原因:Agent想要修改文件 |
| ─────────────────────────── |
| 参数预览(已编辑) |
| 工作空间:/Users/dev/project |
| ─────────────────────────── |
| [允许一次] [允许会话] [拒绝] |
| 超时:120秒倒计时 |
+----------------------------------------------+编辑后的参数预览使用 ToolCallRow 块演示(第 9.3 节): 命令读取为 shell,文件内容读取为代码,其他所有内容读取为 label/value 字段。它绝不是 JSON 转储。
10. 3 会话范围
- 该卡在原始会话的最新活动组之后呈现。
- 仅挂载活动会话的待处理请求。后台请求 保持会话键控渲染器状态,而不将内容插入到 可见的文字记录或覆盖另一个目的地。
- 不同的会话可能各自持有一个待处理的请求。分辨率、超时、 中止、工具完成和会话删除仅清除匹配的 请求。
- 倒计时使用请求的绝对接收时间,并且不会在以下时间重新开始 用户切换离开并返回。
10. 4 状态
| 状态 | 外观 | 行动 |
|---|---|---|
| 待定 | 警告重音,倒计时可见 | 允许一次/允许会话/拒绝按钮处于活动状态 |
| 解决 | 保留待出庭 | 在请求解决之前,所有三个按钮均被禁用 |
| 允许一次 | 成功边框,“允许(一次)”标签 | 没有动作 |
| 允许的会话 | 成功边框,“允许(会话)”标签 | 没有动作 |
| 被拒绝 | 错误边框,“拒绝”标签 | 没有动作 |
| 超时被拒绝 | 警告边框,“拒绝(超时)”标签 | 没有动作 |
10. 5 互动
- 按钮:主要(允许一次)、次要(允许会话)、危险(拒绝)
- 倒计时:可见计时器从 120 秒递减
- 第一个操作锁定所有按钮。解决错误使用错误提示; 成功或失败的完成会将焦点返回到当前输入框。
- 原始会话的输入框无法在等待许可期间发送, 同时文本保持可编辑(根据 03-permission-ux.md §7)
- 中止取消待处理的权限
10. 6 辅助功能
role="region"具有本地化的可访问名称;静态标题供应 礼貌的实时公告,因此每秒计时器不会重新公告- 按钮清楚地标记并且可以按正常的转录选项卡顺序访问;的 卡永远不会捕获或强制移动焦点
- 定期(每 30 秒)或根据要求宣布倒计时
10. 7 MVP 约束
- 仅限内联卡;没有模态或背景后备
- 没有“始终允许”选项(根据 03-permission-ux.md)
- 无风险级别定制
10A。合同审批卡(Plan / Goal)
10A.1 目的
同一 pi 提交的确切 Markdown 字节的内联批准界面 Agent 并保存在新的不可变 .pi/<kind>/*.md 工件中。它是独特的 来自 PermissionCard:它批准 Plan 或 Goal → Agent 转换和显式 执行权限模式,不是单个工具调用。
10A.2 内容
该卡片呈现结构化标题和确切的开场白 .pi/<kind>/*.md 路径。打开工件会读取主机写入的文件; 渲染器编辑不会更改批准的字节。提交的问题/ 描述、状态、validity/deadline、内联 Markdown、SHA-256、字节大小、 和 revision/feedback 控件不渲染卡片内容。
10A.3 动作和状态
| 状态 | 行动 | 合同 |
|---|---|---|
| 待定 | 批准、拒绝 | 请求处于活动状态且范围为 proposal/session/turn/tool-call/version |
| 解决 | 所有操作均已禁用 | 保留提案直至主持人结果 |
| 已批准 | 没有任何动作 | 相同的 Agent 以选定的权限模式在 Agent 中继续 |
| 排队/运行 | 没有任何动作 | 批准的执行处于活动状态并绑定到同一批准行 |
| 被拒绝 | 没有任何动作 | 运行停止并且会话保持其合同模式 |
| 过期/中断 | 没有任何动作 | 关闭失败;除非已提交批准,否则必须提交新合同,在这种情况下,会话仍为 Agent |
批准打开明确询问/接受编辑/自动选择最后选择的内容 该设备上记住的模式。拒绝携带无许可模式。渲染器保留最新的 proposal/execution 快照 会话仅适用于实时主机事件的当前渲染器生命周期,而仅 待处理的快照具有操作或门控 Composer。 Renderer 重新加载调用 plans.pending 并用其原始截止日期恢复仍待处理的行,同时 宿主还活着。它不会再水合被拒绝、过期、 approved/completed,或中断的终端卡;终端卡可能会保留 仅在重新加载之前可见且不可操作。启动恢复中断 提供 RPC 之前的 pending/queued/running 字段,恢复无可操作的过时内容 批准,并且从不重播执行。未决的未批准工作仍然是 Plan 和 已批准的中断执行仍为 Agent;用户界面不需要 重启后呈现中断的终端快照。
10A.4 辅助功能
- 该卡是一个会话范围的
region,具有本地化的计划标题。 - 批准、拒绝和中止控制具有明确的标签和 键盘焦点。
- 所选权限模式公开无线电语义及其 Plan/Goal Bash 结果可在可访问的描述中获得。
- 解决方案不会导航到另一个会话或从某个会话转移焦点 不同的会话。
11. 输入框
11. 1 目的
MainChat 底部的输入区域,用于撰写和发送提示。支持多行、mode/permission上下文显示和中止;模型选择保留在顶部栏中。
11. 2 解剖学
+----------------------------------------------+
| [Agent/Plan/Goal][思考][权限模式] |
| ─────────────────────────── |
| 文本区域(自动增长,1 行 → 最多 7 行) |
| 占位符:“要求 PI-Desktop 做任何事情” |
| (D094; zh-CN 向 PI-Desktop 下达任意指令; home |
| 项目打开时变体“询问任何内容”, |
| D066) |
| ─────────────────────────── |
| [⏹ 中止(运行时)] [→ 发送/输入] |
+----------------------------------------------+11. 3 布局
- 高度:默认紧凑的一行外壳;文本区域自动增长到七个 可见行,然后文本区域在内部滚动
- 工作空间上下文:没有渲染项目、本地或分支轨道,或者 在主模式或线程对接模式下保留在外壳上方 (D095)
- 背景:一个坚实的语义输入框表面;无内部梯度, 背景图像,或装饰水洗
- 仰角:20px半径,带有细线描边和克制的柔和阴影; 停靠的文字淡入淡出位于输入框外壳之外
- solid/near-opaque 表面不使用
backdrop-filter; focus-within 添加了一个 1px 提升和令牌阴影,无需通过模糊强制重新绘制文字记录 层。 - 边框:边框-默认顶部
- 填充:px-4 py-3 内部文本区域
- 字体:Agent、Plan 和 Goal 的 text-sm;模式改变语义和工具 控件,而不是排版
- Agent/Plan/Goal 模式芯片保留一个固定的 88px 宽度,尺寸从 最长的英文和中中文内置标签(“Agent”/“智能体”)。它的标签 如果未来的语言环境超出预算,则保持单行并省略,因此 切换模式永远不会回流相邻的 Composer 控件。
- 底部锚定:固定在主聊天区域的底部
11. 4 状态
| 状态 | 外观 | 行动 |
|---|---|---|
| 闲置(无模型) | 文本区域处于活动状态,发送按钮已禁用 + 工具提示“首先配置模型” | Agent 链接在模型菜单中仍然可用 |
| 空闲(就绪) | 文本区域处于活动状态,发送按钮已启用 | 发送活动 |
| Home/new-session 初始化 | 当没有投影活动会话时,textarea 和 mode/thinking/permission 触发器仍然可用;第一个配置选择在持久化之前创建或重用目标草稿 | 配置草稿,然后发送 |
| 新会话(推理模型) | 思考触发器显示模型最高发布水平 | 用户可以选择任何已发布的级别,包括支持时关闭 |
| 新会话/在另一个会话运行时切换 | 文本区域处于活动状态,为目标会话自己的运行状态启用发送按钮 | 发送活动,中止隐藏,除非目标会话本身正在运行 |
| 跑步 | textarea 和 mode/thinking/permission 控件在下一回合中保持可编辑状态;中止按钮可见 | 中止活动,发送隐藏;配置已排队 |
| 上下文检查点 | 与运行直到持久检查点完成相同;中间 turn_end 不会重新激活控件。保留尾部回退保持运行并显示警告 toast | 中止活动,发送隐藏 |
| 正在等待许可 | 文本区域已禁用(根据 03-permission-ux.md §7) | 发送禁用,中止可见 |
| Plan / Goal / 规划 | 文本区域在空闲时处于活动状态;合同徽章和许可芯片可见 | 检查、发送或提交合同 |
| Plan / Goal / 等待批准 | 批准表面仅显示标题和工件开启器以获取确切的 .pi/<kind>/*.md 批准;草稿保留为只读,并且该会话的输入框控件仍然被阻止 | 批准或拒绝 |
| Plan / 已排队或正在运行 | Agent 徽章保持选中状态; queue/running状态可见;草稿和下一回合控件保持可编辑 | 中止;发送隐藏;无重播控制 |
| Plan / Goal / 提案被拒绝、过期或中断后的计划 | 合约芯片仍然可见且可编辑 | 稍后发送提示;提交新合同;没有执行动作 |
| 没有工作空间 | 文本区域处于活动状态,警告横幅“无项目 - 工具有限” | 发送已启用 |
11. 5 互动
- Enter:发送消息(可配置:Shift+Enter 换行)
- Shift+Enter:文本区域中的换行符
- 转义:当文本区域聚焦时,清除输入或模糊(不中止)
- 中止:停止正在运行的轮次并取消挂起的权限。在任何之前 辅助文本、思维或工具行开始时,它也会删除刚刚发送的 用户行并恢复预序列化输入框草稿。普通文本 返回到文本区域,文件引用作为叶名片返回;他们的 规范路径永远不会成为文本区域文本。回复开始后,Abort 保持 部分抄本,不恢复草稿。
turn_end不是空闲信号。发送和主机持久性仍然被阻止 通过后续的工具转动和阻止自动检查点生成 直到agent_end或error;草稿和运行时选择器保持可编辑状态 并保留最新的下一回合选择。仅手动检查点变得空闲 在其匹配的compaction_end上。- 自动增长:文本区域测量包裹的视线,从一条可见线开始 行,扩展到七行,然后在内部滚动;删除内容 将其缩小回一行
- 文本校正关闭(D145):输入框文本区域设置
spellCheck={false},autoCorrect="off"和autoCapitalize="off"所以 browser/OS 的拼写和 自动更正从不重写编码提示 - 运行时芯片使下降器完全可见(D150):思考、许可、 Composer 中的模式触发器使用紧凑的行高,而不是
leading-none溢出。顶栏模型触发器仍然是椭圆形的长 身份证。 - 模式、provider/model、思维和权限更改更新活动 空闲时立即会话。在回合期间,渲染器应用 乐观地将最新选择作为下一轮选择并仅坚持下去 在
agent_end或error之后;主机永远不会改变正在运行的回合的固定 配置。有效的待处理 Plan 或 Goal 批准仍会禁用这些功能 控制。等待批准期间的批准操作是例外情况。的 Composer-左Agent/Plan/Goal芯片是唯一模式 单击时控制并循环 Agent → Plan → Goal → Agent;顶栏模型选择器 仍然是仅模型控件。 Palette 和 Composer 斜线模式命令使用 相同的活动会话配置路径;主机确认解决后 审批,审批面被移除而不是保留为终端 行动卡。 - 在项目或会话导航期间,家庭输入框可能会暂时没有
activeSessionId。其空闲模式、思考和权限触发器保持不变 已启用;第一个配置操作创建或重用目标 草稿,然后保留所选模式、思维级别或权限模式。 正在运行的回合或等待批准仍然会限制这些控制。 - 继承默认模型支持推理的新会话以 思维在该模型的最高发布水平上启用。非推理 模型和缺失的功能元数据从
off开始;重新开放或重复使用 现有会话保留其持久选择。 - 模型菜单仅列出具有默认模型的已启用、可运行的提供程序。
- 对于具有推理能力的主动模型,会出现单独的思维触发器 紧邻模式芯片的右侧、许可之前 控制。它显示当前级别并仅打开支持的确切模型 紧凑的单列列表和规范顺序中的级别;选定的行 带有尾随支票。菜单宽度适合其内容最多 160 像素,并且 进一步受到视口的限制;较长的本地化标签会被截断。的 列表不包含 inherited/default 选择。选择具体级别仍然存在 完整的会话配置并关闭菜单。非推理模型渲染 没有思维触发。
- 未知的 Custom/OpenAI-compatible 模型可以启用显式推理 从模型菜单覆盖。提供商刷新,会话选择 支持的级别最接近
medium,并出现工具栏触发器;已知的 非推理模型仍然不可用,而不是被覆盖。 - 切换提供商保留可用级别,否则使用最近的级别 支撑位(先向上,然后向下);非推理提供商
off仍然存在。 - Plan 权限芯片在模式选择器旁边仍然可见。它显示 有效的询问/接受编辑/自动姿势。在 Plan 和 Goal 中,其帮助文本 表示 Bash 在“询问”或“接受”编辑下得到确认,并且可能会在没有修改的情况下发生变异 自动下确认;这并不意味着 Write/Edit/plugin 工具是 可用。
- Goal 共享 Plan 批准表面 (D198)。酒吧从以下位置读取其副本 提案的
kind,因此目标合约显示匹配的批准标签和 神器开启器,而布局和记住权限拆分按钮保持不变 相同。
11. 6 辅助功能
role="textbox"与aria-label="Message input"- 可编辑文本控件永远不会启用浏览器拼写检查或自动更正(D145)
- 发送按钮:
aria-label="Send message" - 中止按钮:
aria-label="Abort active turn" - 禁用发送:
aria-disabled="true"带工具提示说明 - 思维水平在本地思维组内使用单选菜单语义; 所选级别公开
aria-checked="true"
11. 7 MVP 约束
- 粘贴一个或多个操作系统剪贴板文件或图像将其字节保存到 原始会话的临时目录并添加一个紧凑的叶名称 文本区域上方的引用;纯文本粘贴保持浏览器的本机 文本区域行为(D197、D209、ADR 0059、ADR 0070)
- 没有内联 binary/ImageContent 有效负载或可视附件预览。的 紧凑型芯片是文本草稿参考;发货前 它们序列化为规范的
@<absolute-path>文本,因此提示仍然存在 仅文本,代理使用其文件工具遵循路径 - 没有语音输入
11. 8 斜线命令、@ 文件引用和剪贴板文件(D123–D125、D197、D209、ADR 0024、ADR 0059、ADR 0070)
输入框拥有一个内联自动完成菜单——一个组件服务两个组件 模式。焦点永远不会离开文本区域 (D125)。
解剖学:
┌──────────────────────────────────────────────┐
│ group label (sticky) │
│ ▸ item title argument-hint descr. │ ← kb-active row
│ ▸ item title descr. │
│ … │
│ ↑↓ select · Enter confirm · Esc close │ ← hint bar (footer)
└──────────────────────────────────────────────┘
[ file.ext × ] [ another-file.ts × ] ← when references exist
[ composer textarea ]- 锚定在输入上方,跨越整个输入框宽度;同样升高 表面配方作为模型菜单(不透明的升高背景,对话框 阴影、细微发际线、
--radius-lg);最大高度帽,带内部 滚动并跟随scrollIntoView(nearest)键盘。 - 斜线模式(
/在位置 0 处输入,光标位于第一个标记内,无 还没有空格):按顺序分组 — 提示模板(名称 +argument-hint鬼文+说明,之前的项目源码 用户全局)、应用程序命令(内置斜杠别名)、插件命令。 匹配的字符以重音突出显示。 - 文件模式(光标处的
@标记,边界之前):行持续显示 仅叶文件或目录名称;目录有一个尾随的/和 接受后继续完成。完整的相对路径仍然可用 通过行工具提示和可访问的名称。接受已完成的文件会添加 一个紧凑引用,其规范值为原始entry.path; 接受目录会将文字路径保留在文本区域中,以便完成 可以继续。条目来自fs/index(D124、D209)。一个 当索引被限制时出现截断脚注;没有工作空间 菜单显示“打开项目”空状态。 - 接受命令和目录插入文本(
/name/@dir/); 接受完成的文件会创建渲染器拥有的引用。立即 在调度之前,引用在可见之后以稳定的顺序序列化 使用 D124 的引用将草稿作为完整的@path文本。仅供参考的草稿 是可发送的。 Builtin/plugin 调度仍然绕过模型就绪门 当没有发送提示文本或文件参考时。 - Agent/Plan/Goal 模式别名可以在同一草稿中为提示添加前缀:
/agent-mode <prompt>、/plan-mode <prompt>和/goal-mode <prompt>适用 首先发送模式,然后发送<prompt>以及任何序列化引用 正常的提示路径,以便用户轮流保留在记录中。 仅别名模式命令仍保留在本地。输入框只有在之后才被清除 接受当地行动或迅速派遣;失败的调度保留 完整的可见草稿和重试参考。 - 接受的提示调度保留仅渲染器,session/turn-scoped 结构化撤消快照,而回合仍未得到答复。智能停止 按原始参考顺序恢复该快照而不是复制 序列化的消息路径返回到文本区域。回复开始后停止 不得恢复或复制已提交的草稿。
- 仅当剪贴板公开时才会拦截包含文件的粘贴 至少一个
File。渲染器传输有界文件字节、名称和 MIME 元数据到 Electron main 以及持久会话 ID。主要验证 会话,在下面写入唯一的清理文件<data_dir>/scratch/<sessionId>/pasted/,并返回每个 UUID 支持的 绝对路径及其经过净化的原始叶名称。输入框展示 叶名称,将路径保持在会话范围内的瞬态引用状态, 并仅在以下情况下使用与文件菜单相同的@引用序列化该路径 发送。移除芯片不会删除暂存字节。家庭输入框 在保存之前创建或重用持久会话。暂存生命周期 使用会话删除粘贴的文件,并且不会弄脏工作区 git 树。 - 参考芯片在提示区域内环绕,暴露规范路径 他们的工具提示和可访问的名称,并提供焦点可见的本地化 删除恢复文本区域焦点的按钮。保留重复的叶子标签 分开是因为身份和调度使用规范路径,而不是名称。
- 发送的模板调用在记录中呈现为等宽命令 来自消息的
command字段的芯片而不是扩展的正文。 - 状态:键盘活动行使用共享
kb-active处理;空的 查询列出所有内容(斜杠)/最近索引的顺序(文件);零 匹配呈现本地化的空行并且菜单计为关闭 按键处理。
12. 模型选择器
12. 1 目的
顶部栏中的下拉菜单显示当前 provider/model 对。允许在当前会话中切换模型。
12. 2 解剖学
[provider icon] provider-name / model-name [▼ dropdown arrow]12. 3 状态
| 状态 | 外观 |
|---|---|
| 已配置 | 显示当前 provider/model,可点击 |
| 无提供商 | “添加提供商”静音文本 + 设置链接 |
| 跑步 | 禁用,显示当前模型 |
| 下拉菜单打开 | 按提供商分组的缓存可用模型;在后台刷新 |
12. 4 交互
- 单击:打开包含 provider/model 列表的下拉菜单
- 缓存的提供商模型在重启后首次打开时可用;一个 后台刷新更新列表而不先清除它
- 选择:切换当前会话的模型
- 键盘:下拉菜单中的 up/down 箭头,Enter 进行选择,Escape 关闭
12. 5 辅助功能
role="combobox"与aria-expanded- 通过
aria-label公布的当前值 - 下拉菜单项:
role="option"和aria-selected
12. 6 MVP 约束
- 无模型 favorites/pinning
- 没有从选择器创建自定义模型(使用设置)
- 下拉列表仅显示来自已配置提供商的模型
13. 项目选择器
13. 1 目的
顶部栏中的控件显示当前工作区。允许打开或清除项目文件夹。
13. 2 解剖学
[folder icon] /path/to/project or "No project" [open button]13. 3 状态
| 状态 | 外观 |
|---|---|
| 活跃项目 | 显示文件夹名称,可点击路径 |
| 没有项目 | “无项目”静音文本+“打开文件夹”链接 |
| 开幕 | 已禁用,“正在打开...”微调器 |
13. 4 交互
- 单击路径:打开系统文件对话框以选择文件夹
- “打开文件夹”:相同的操作,明确的按钮
- “清除项目”:命令选项板
builtin.project.clear
13. 5 辅助功能
- 当前项目:
aria-label="Current project: /path/to/project" - “无项目”:
aria-label="No project open" - 打开按钮:
aria-label="Open project folder"
13. 6 MVP 约束
- 项目选择可以激活保留的选项卡或添加新的本地项目 选项卡;主机仍然公开一个选定的工作区
- 除了路径显示之外没有项目状态指示器
14. 状态栏
14. 1 目的
可选的底部栏显示运行时状态指示器。 从 MVP 推迟 — 在 IA 中提到,但在 M1–M3 中未实现。
14. 2 MVP 约束
- 未在 MVP 中实现
- 状态指示器 (running/error/idle) 显示在顶栏中
- 未来:实施时单独的规范
15. 空状态
15. 1 目的
当关键数据缺失时,指导就会浮出水面。必须始终提供操作链接,而不仅仅是一条消息。
15. 2 状态
| 背景 | 留言 | 行动 |
|---|---|---|
| 没有会议 | “开始你们的第一次对话” | “新任务”按钮→焦点编辑器 |
| 无提供商 | “未配置模型提供商” | “添加提供商”链接 → 设置 → Agent → 提供商 |
| 无项目(Agent、Plan 或 Goal) | “没有打开项目 - 工作区工具不可用” | “打开文件夹”按钮 → ProjectPicker |
| 会话为空(第一条消息) | “要求 PI-Desktop 做任何事情”占位符(主页变体“询问任何事情”,D094/D066) | N/A |
15. 3 布局
- 聊天主页为空:单个可滚动堆栈(英雄→可选清单)居中 在 MainChat 中,有一个保留在底部的输入框兄弟;任务录入开始 直接在该输入框中,无需入门卡或快速操作层
- 其他空表面:text-xl 标题 + text-sm 描述 + 主要操作
- 标题上方适用的图标(48px Lucide/品牌标记)
- 背景:bg-primary(透明,不是卡片)
15. 4 辅助功能
- 操作按钮可通过键盘聚焦
- 图标上的
aria-label提供上下文描述
15. 5 MVP 约束
- 没有动画空状态插图
- 无产品介绍叠加(根据 05-onboarding.md §6)
16. 命令面板表面
16. 1 目的
**状态:合并到全局搜索界面中。**命令面板覆盖已删除;其命令列表(内置+插件命令)现在呈现为 SearchDialog 内的“命令”部分(使用 Cmd/Ctrl+K 或 Cmd/Ctrl+Shift+P 打开)。在 04-builtin-commands.md 中定义,并由全局搜索组件规范显示。
16. 2 解剖学
+----------------------------------------------+
| [搜索输入] |
| ─────────────────────────── |
| 结果列表(可滚动) |
| 类别:会议 |
| ▸ 新任务 |
| ▸ 删除当前会话 |
| 类别:模式 |
| ▸ 切换到 Plan |
| ▸ 切换到 Goal |
| ▸ 切换到 Agent |
| 类别: 回合 |
| ▸ 中止主动回合 |
| ... |
+----------------------------------------------+16. 3 布局
- 位置:居中叠加,最大宽度 480 像素,最大高度 360 像素
- 背景:bg-elevated-opaque(高架浮动表面,与
.dialog/.search-dialog一致)、radius-lg-plus、shadow-dialog - Z 索引:
z-command-palette(60) - 背景:半透明背景主色(0.5 不透明度)
16. 4 交互
- 搜索:按标题和关键字过滤命令
- 键盘:箭头 up/down 导航,输入执行,退出关闭
- 单击:执行命令
16. 5 辅助功能
- 独立的调色板覆盖不再存在;命令是全局搜索对话框的一部分(
role="dialog"、aria-label和nav.search)。 - “命令”部分使用与其他搜索结果组相同的
role="listbox"/role="option"语义。 - 搜索输入自动聚焦于打开;箭头 up/down 导航,Enter 执行,Escape 关闭。
16. 6 MVP 约束
- 无子命令嵌套(平面列表)
- 无命令 history/recents
- 插件命令与内置命令一起显示
17. Toast
17. 1 目的
针对没有内联表面(后台事件、跨页面确认)的已完成操作和失败的瞬时、非阻塞反馈。一个全局堆栈 — 绝不是每页 Toast 标记。
17. 2 解剖学
┌ toast-viewport (fixed top-center, z-toast) ┐
│ ┌──────────────────────────────────────┐ │
newest, at anchor → │ │ (✓) Provider saved ✕ │ │
│ ├──────────────────────────────────────┤ │
oldest, pushed down →│ │ (i) Message text ✕ │ │
│ └──────────────────────────────────────┘ │
└───────────────────────────────────────────┘ToastHost(在components/Toast.tsx中)渲染堆栈;在App.tsx中的每个 shell 分支安装一次- 每张卡片:16px 变体图标(语义色调)·消息·X 关闭按钮
- Surface:
bg-elevated-opaque+ 1pxborder-subtle+shadow-dialog,radius-md-plus — 与菜单相同的浮动系列; 07-ui-design-system.md §11.8 中的指标
17. 3 API
状态位于应用商店中 (useAppStore):
showToast(message: string, options?: {
variant?: "info" | "success" | "warning" | "error"; // default "info"
duration?: number; // ms; default 4000 (error 8000); 0 = sticky
});
dismissToast(id: number); // ToastHost internal / tests17. 4 使用规则
| 规则 | 详情 |
|---|---|
| 变体语义 | success = 用户操作已完成(保存、创建、加载)。 error = 操作失败(每个 catch 路径)。 warning = degraded/at-risk 状态自行解决。 info = 中性通知(上下文回显,“尚不可用”)。 |
错误始终显示为 error | showToast(e instanceof Error ? e.message : String(e), { variant: "error" }) — 绝不是默认变体 |
| 没有来电计时器 | 自动关闭是toast系统拥有的;调用者不得 setTimeout-clear |
| 国际化 | 消息来自 i18n 目录(D073);原始 host/provider 错误字符串不变地传递 |
| 不用于阻塞流量 | 工具决策使用内联 PermissionCard,而不是 toast |
| 不适用于内联验证 | 字段级错误呈现在字段旁边;消息绑定提供程序故障在记录中呈现为辅助错误消息 |
| 主机推送的 toast | Plugin/main-process Toast 通过 api.onToast 到达并渲染为 info |
17. 5 行为
- 自动关闭 4 秒(错误 8 秒,
duration: 0粘性);悬停卡片会暂停其计时器,留下剩余时间的简历 - 堆叠上限为 4 — 最旧的掉落优先;重新引发相同的消息+变体会重新启动现有的 toast,而不是堆叠一个双胞胎
- 最新的 toast 进入顶部中心锚点(向下滑动 200 毫秒缓出),将旧卡向下推;退出是 150 毫秒的渐入淡出
- 关闭 X 始终可用;每张卡都是明确的非拖动指针目标 因此,悬停暂停和关闭保持交互,其中顶部中心堆栈 重叠无框标题栏拖动镶边
- 减少运动使动画持续时间接近于零,因此移除(必然会
animationend) 仍然会触发
17. 6 辅助功能
- 视口为
aria-live="polite";aria-live="polite"/success卡为role="status",role="status"/warning为role="alert" - 标有
toast.dismiss目录键的关闭按钮 - 图标为
aria-hidden;这种变体是通过所宣布的角色来传达的,而不仅仅是颜色
17. 7 MVP 约束
- Toast 内没有操作按钮(后 MVP;使用内联错误横幅来显示可操作的错误)
- 无 progress/loading toasts — 运行状态属于工作指示器
- 没有Toast历史表面
18. 会话导入面板
18. 1 目的
扫描支持的本地代理商店,以可管理的方式查看发现的会话 组、选择候选者并开始显式导入。
18. 2 解剖学
[Found N sessions] [Group by: Source ▾] [Import selected (N)]
──────────────────────────────────────────────────────────────────
[ ] [›] Claude Code N sessions
[ ] [›] Codex N sessions- 分组控件支持项目路径和来源。
- 来源是默认分组。
- 在项目路径模式下,精确路径在组标题中保持可见。
- 没有项目路径的会话出现在最终的无项目组中。
- 每个组标题包括组选择、公开、标签和计数。
- 导入源名称、分组控件、计数、结果和可访问名称 来自共享的 i18n 目录。候选日期使用活动的应用程序区域设置。
18. 3 状态和交互
- 成功的扫描会替换先前的候选集,清除选择,并且 让每组都崩溃了。
- 成功的导入会创建或重复使用一个持久的项目索引条目 每个不同的非空项目路径并刷新 sessions/projects。
- 无路径导入不会创建项目条目并保留在临时状态下 会议。导入永远不会创建物理文件系统目录。
- 重新导入现有源会话会跳过它,而不重复它 项目进入。
- 更改分组模式可以保留候选选择,但会折叠每个 新成立的团体。
- 展开或折叠一组不会影响其他组。
- 组和全局复选框支持选中、未选中和不确定 选择状态适用。
- 每个组内的候选人以及组本身都按最新的排在最前面; 无路径组在项目路径模式下保持在最后。
18. 4 辅助功能
- 每个公开按钮都会公开
aria-expanded并引用其主体aria-controls。 - 全局和组复选框具有本地化的可访问名称。
- 分组选择器具有可见标签并且可通过键盘操作。
- 项目行公开和操作菜单按钮公开本地化、 项目特定的可访问名称。
19. ProviderStudio(设置 → Agent)
19. 1 目的
用于添加 OpenAI 兼容提供程序的现代模型配置界面, 审查准备情况,并在没有密集的情况下管理 connection/default 行为 表格转储。模型参数仍归 pi-ai 所有。
19. 2 解剖学
- 英雄摘要 — 踢球者、标题、简短描述、提供商计数/就绪计数/默认对的统计数据
- 默认卡 — 分段默认模式、默认模型id、输入发送开关
- 提供商标题 — 部分标题 + 主要添加提供商切换
- Composer — 包含连接字段的对话框(名称、基础 URL、模型 id、API 样式、API 键);没有推理、思维水平、上下文、输出、温度或兼容性控制
- 提供商卡 — 头像缩写、徽章(默认/秘密状态)、主持人+模型、测试/设为默认/删除
19. 3 状态
| 状态 | 介绍 |
|---|---|
| 空 | 英雄显示零/无默认值;输入框打开;带有主要添加 CTA 的空面板 |
| 人口稠密 | 卡片列出了每个提供商;添加流程打开模式对话框 |
| 默认提供商 | 卡片获得微妙的口音清洗 + 默认徽章;设为默认隐藏 |
| 秘密失踪 | 警告标志“没有 API 键”;测试可能会失败关闭 |
| 忙排 | 该卡已禁用 Test/update/delete 操作 |
19. 4 交互
- 添加提供商打开模式对话框; Cancel/close 重置字段并关闭对话框
- 保存创建提供商,存储秘密,成功后将其设置为默认值,并刷新列表
- 测试连接调用
providers.testConnection并祝酒 success/failure - 思考预设更新通过具有 D102 语义的
providers.update持续存在 - 仅对
defaultProviderId/defaultModelId进行默认更新
19. 5 辅助功能
- 分段控件公开
aria-pressed - 输入发送使用
role="switch"+aria-checked - 卡片操作保留可见的文本标签; Thinking select 有一个易于理解的名称
- 空白和英雄区域暴露本地化标签
19. 6 MVP 约束
- 仅在输入框中兼容 OpenAI 的路径(供应商市场推迟)
- 保存后不会重新显示原始秘密
- 还没有目录浏览器;自定义模型 ID 保持一流
20. 通知收件箱(D117)
20. 1 目的
公开任务完成和失败事件的有界的、主机拥有的历史记录 用户在当前聚焦的聊天中尚未看到,无需转动 短暂的祝酒进入历史。收件箱仅限本地且跨应用程序持久 重新启动。
20. 2 解剖学
Sidebar footer Popover (360px max)
[Bell (12)] -> [Notifications] [All | Unread] [Mark all read] [Clear]
------------------------------------------------------------
[unread dot] [check] Task completed 2m
Session title
------------------------------------------------------------
[x] Task failed 9m
Session title · ERROR_CODE- 触发器:扩展侧边栏右侧的 32px Lucide
Bell图标按钮 页脚,取代了以前的帮助快捷方式。主标题栏没有 重复。紧凑的徽章呈现1–99和99+;其可访问标签 保留准确的计数(耐用存储的上限为 200)。 - 弹出窗口:宽度
min(360px, calc(100vw - 24px)),在上方和右侧打开 页脚的高度,不高于可用窗口,内部有一个窗口 可滚动的行列表。 - 标题:本地化标题、
All/Unread分段过滤器、LucideCheckCheck标记为全部已读按钮,LucideTrash2清除按钮。仅图标 操作带有本地化的工具提示和可访问的名称。 - 行:未读点、语义 completion/failure 图标、本地化事件标签、 快照会话标题、可选的稳定故障代码和本地化 相对时间。行是由细线分隔的密集列表项,而不是卡片。
- 显示 title/body 在渲染时从
kind、sessionTitle派生, 和可选的errorCode;没有保留本地化的 title/body 字符串。
20. 3 状态
| 状态 | 行为 |
|---|---|
| 没有未读 | 贝尔没有徽章;标记所有已读已禁用 |
| 未读 | 徽章显示计数;未读行带有点和更强的标签权重 |
| 全部为空 | 居中紧凑的“无通知”空状态;列出已禁用的操作 |
| 未读为空 | “你们都陷入困境了”;所有过滤器仍然可用 |
| Loading/refresh | 保留当前行并过滤;禁用突变直到刷新解决 |
| 突变失败 | 保留现有列表并宣布错误 toast;不要乐观地丢失行 |
20. 4 互动
- 贝尔切换弹出窗口。打开不会隐式标记任何已读内容。
All显示最新保留的行;Unread过滤至readAt == null。- 选择一行首先调用
notification.markRead,关闭弹出窗口,然后 激活该行的持久会话(包括其项目(如果适用)) 并将记录滚动到最新内容。 - 将所有读取标记为幂等并保留行。清除会删除每个收件箱 行,但绝不会删除会话、成绩单或回合。
notification.changed更新可见列表和徽章。打开 弹出窗口还刷新 host-core 中的有界列表。一个 来自 Electron 的notification.activated事件遵循同一会话 激活路径为一行单击。- Completion/failure 进入持久收件箱,除非主窗口处于关闭状态 visible/focused,确切的结束会话是当前聊天。一个 集中后台会话仍会进入收件箱,而没有本机横幅; 未聚焦的当前会话进入收件箱并收到本机横幅。 单击横幅 restores/shows 并在之前聚焦主窗口 为匹配会话发出
notification.activated。 - 中止的回合、权限请求、预定提醒和插件 通知不会进入此收件箱。
20. 5 辅助功能
- Popover 是一个带标签的、非模态的
role="dialog";行集合是 语义列表,每一行都是一个带有完整本地化名称的按钮。 - 打开聚焦第一个未读行,否则聚焦第一行,否则聚焦
All过滤器。ArrowUp/ArrowDown、Home和End在行间移动;Enter/Space激活聚焦行。 Tab通过过滤器、标头操作和没有 a 的行遵循 DOM 顺序 焦点陷阱。Escape或外部按下可关闭弹出窗口;逃脱恢复 将注意力集中到铃声上。- 徽章变更通过一个礼貌状态区域使用确切的 未读计数。 Completion/failure 含义使用图标、文本和可访问性 名字,从来不只是颜色。
- 本机通知可访问性和激活语义使用该平台 API;渲染器不会重新创建本机横幅。
20. 6 限制
- 该列表仅包含生成的
task.completed和task.failed记录 从看不见的终端代理轮流。可见当前结果和aborted轮次 是故意沉默的。 - 全局最多保留 200 个最新行。没有分页, 预定通知源、权限通知源、首选项 页面、通知权限提示或云同步。
21. 验收标准(所有组件)
- 所有组件均使用 07-ui-design-system.md 中的语义颜色标记 — 无原始十六进制 2.所有交互元素都有可见的聚焦环(2px强调,偏移2px)
- 布局 shell 指标(46px 标题栏行、~275/48 侧边栏、280 上下文、 具有 1-7 行草稿增长的紧凑型输入框)匹配规范
- 聊天消息最大宽度限制为 720px
- ToolCallCard 根据 01-ui-ia.md §5 显示状态、参数预览、结果预览、持续时间
- PermissionCard 显示工具名称、风险、参数、倒计时和每个 03-permission-ux.md 的三个操作按钮
- Composer:Enter发送,Shift+Enter换行,草稿从一增长到 然后滚动七条可见线,在 running/pending 期间禁用,中止 按钮在运行期间可见
- ModelSelector 显示 provider/model 对;流期间禁用;未配置时指向设置的链接
- 命令调色板在 z-index 60 处打开,捕获焦点,支持键盘导航
- 空状态总是提供可操作的下一步,而不仅仅是一条消息
- 所有组件都有正确的 ARIA 角色和标签
- 响应式折叠在 800px 和 640px 断点处工作
- Toast 堆叠在顶部中心,带有变体图标 + 关闭、自动关闭 4s/8s、悬停时暂停,并根据 §17 通过 01-ui-ia.md/03-permission-ux.md 进行宣布
- 会话导入默认为源分组,提供项目路径分组,在 scan/group 更改后折叠所有组,并根据 §18 公开可访问的组公开状态
- 导入的项目路径在持久项目索引中只出现一次;无路径导入保留临时会话并且不会创建文件系统目录
- ProviderStudio显示英雄总结+添加对话框+提供商卡;秘密永远不会变得原始; test/default/delete 保持键盘可访问 17.NotificationInbox 公开 All/Unread 视图、确切的未读徽章语义、 行激活、标记所有已读和清除操作;它是键盘可操作的 并且从不将可见当前或中止的回合视为通知 18.原生边缘通过回流调整MainChat大小,而不压缩固定工作面板; 面板可见性和分隔线提交更新提交的首选宽度, 取消的分隔符手势恢复之前的宽度 (ADR 0033)
- 扩展侧边栏会话标题、project/group 标题和空状态副本 使用 13px 紧凑令牌,同时主要侧边栏操作保持在 14px