feat: 状态胶囊升级——顶栏紧凑状态条 + 点击展开宿主渲染详情弹层(StatusItem.icon/detail:分组/行/徽标/行内深链)

This commit is contained in:
Rick Ye
2026-09-11 11:02:44 +08:00
parent 1edaf17623
commit 7103675db8
5 changed files with 202 additions and 22 deletions
+1 -1
View File
@@ -170,7 +170,7 @@ api.ui.onSettingsAction((key) => {}) // button 条目点击回调(key = 按钮
| 侧栏入口(B1) | manifest icon/name/order;点进插件整页视图 | ✅ |
| 插件整页 Main | 内置组件级 / 外置 renderer 组件 / 外置 iframe;聊天列 display:none 保活 | ✅ |
| 面板 tab(B6) | `panel: true`;SidePanel 零改动承载(内置组件 / 外置 renderer 组件 / iframe) | ✅ |
| 状态胶囊(B2) | `setStatusItem` 数据驱动,TitleBar 渲染,两种视图均可见 | ✅ |
| 状态胶囊(B2) | `setStatusItem` 数据驱动,TitleBar 渲染,两种视图均可见;顶栏为紧凑状态条,点击可展开宿主渲染的详情弹层(`detail`:分组/行/徽标/行内深链) | ✅ |
| 深链 | `openView(view, params)`(main 侧 IPC 广播 / 页侧桥直通) | ✅ |
| 工具栏按钮(B5) | `registerToolbarButton` 数据已通,Composer 工具行渲染 | ⏳ 下版本 |
| 聊天流富组件(B4) | ```类型``` 围栏块 → 宿主元组件(data-table/stat-grid/step-list/kv-card) | ⏳ 下版本 |
+33 -3
View File
@@ -4,17 +4,47 @@
## 1. 状态胶囊(TitleBar 顶部)
轻量状态提示,点击可深链跳转:
顶栏胶囊是**紧凑状态条**,点击行为三档:
```js
// ① 纯展示
api.ui.setStatusItem('conn', { text: '已连接 · 3 任务' })
// ② 点击深链
api.ui.setStatusItem('conn', {
text: '已连接 · 3 任务',
tone: 'accent', // default | accent | warn | danger
openView: { view: 'my-plugin' } // 点击跳到插件整页视图(可省略)
icon: '<svg .../>', // 可选,12px 线条风
openView: { view: 'my-plugin' } // 点击跳到插件整页视图
})
api.ui.removeStatusItem('conn')
// ③ 点击展开详情弹层(声明了 detail 时优先于 openView)
api.ui.setStatusItem('tasks', {
text: '任务 2/5',
tone: 'accent',
detail: {
title: '任务概览', // 缺省用胶囊文本
sections: [
{
title: '进行中', // 分组标题可省略
rows: [
{ label: '构建索引', detail: '已完成 60%', trailing: '2/5', tone: 'accent' },
{ label: '清理临时文件' }
]
},
{
title: '操作',
rows: [{ label: '打开任务面板', openView: { view: 'my-plugin' } }] // 行点击深链
}
]
}
})
api.ui.removeStatusItem('tasks')
```
弹层由宿主统一渲染(分组标题 / 行 / 右侧徽标 / 深链),样式与宿主一致——插件只提交
数据;点击弹层外部或 Esc 关闭;dispose 时宿主自动清理本插件全部条目。
## 2. 工具栏按钮(输入区工具行)
```js