DSH Tauri Panel

了解桌面侧栏外壳、面板入口槽和稳定的面板内容协议。

dsh-tauri-panel 是桌面端 UI 扩展的公共入口。它提供统一侧栏布局，并允许其他插件在不复制侧栏实现的情况下添加面板。

​

侧栏结构

侧栏保留官方 sidebar.workspaces、sidebar.footer.action 和 sidebar.settings，并增加：

• 新建会话入口；
• sidebar.panel.action 列表槽，供第三方功能注册统一条目；
• 宽/窄侧栏状态与统一的选中样式。

​

panel.protocol

接口	作用
ActionItem	创建样式、折叠态和激活态一致的侧栏条目
renderPanelContent(spec)	用扩展面板替换官方会话内容区域
closePanelContent()	关闭扩展内容并恢复官方会话视图

扩展只提供图标、文字、标识和内容，不需要依赖生成的 CSS 类或自行复制官方侧栏。

​

最小用例

下面的客户端插件在 sidebar.panel.action 注册一个“项目”入口，并在点击后用自定义内容替换会话区域：

import type { ReactElement } from 'react'
import type { PanelProtocol } from 'dsh-tauri-panel/client'

const PANEL_SLOT = 'sidebar.panel.action'
const PANEL_SERVICE = 'panel.protocol'

function ProjectPanel(): ReactElement {
  return <div>项目面板内容</div>
}

export function apply(ctx): void {
  ctx.slots.inject(PANEL_SLOT, () => {
    const panel = ctx.reflect.get(PANEL_SERVICE) as PanelProtocol | undefined
    if (panel === undefined)
      return () => {}

    const { ActionItem, renderPanelContent, closePanelContent } = panel
    
    function renderProjectPanel() {
      return renderPanelContent({
        id: 'project-panel',
        render: ProjectPanel,
      })
    }

    function Action(): ReactElement {
      return (
        <ActionItem id="project-panel" onClick={renderProjectPanel} icon={<ProjectIcon />}>
          项目
        </ActionItem>
      )
    }

    return ctx.slots.register(
        {
          name: PANEL_SLOT,
          id: 'project-panel-action',
          registrant: 'my-plugin',
          inject: () => ({}),
        },
        Action
      )
  })
}

​

从面板返回会话

面板内的动作需要打开会话时，先显式关闭扩展内容：

panel.closePanelContent()
sessions.open(sessionId)

实际插件还应为 slot 注入与服务缺失提供安全降级，并在插件卸载时返回对应 disposer。 完整实现可参考 dsh-tauri-panel-extension。

​

当前消费者

dsh-tauri-panel-extension 是完整消费者，它通过协议添加“扩展”入口并渲染 Skills/MCP 管理内容。

查看源码