dsh-html-canvas

by jinsong-zhou

GitHub ↗

2 UI 增强github收录于 08-23

把 AI 生成的 HTML 变成聊天旁可点击编辑画布的 DeepSeek Harness 插件

A DeepSeek Harness plugin that turns AI-generated HTML into a click-to-edit canvas beside the chat.

安装

$ dsh plugin --profile web add github:jinsong-zhou/dsh-html-canvas

GitHub 源码安装：首次需按提示配置 allowBuilds 构建授权后重试

安装与环境配置指引、插件开发教程见 DSH 中文社区文档 ↗

安装即在你的机器上以你的权限运行第三方代码——它可读写文件、使用凭据、访问网络，DSH 的工具审批不会为插件代码加沙箱。「检测到 manifest」仅代表发现 dsh.bundle / dsh.plugin 清单，不构成兼容性或安全审查；安装前请审阅源码，不熟悉的插件先在不含密钥的环境试用。

English | 简体中文

一个 DeepSeek Harness 插件:把 AI 生成的 HTML 变成聊天旁边点击即可编辑的画布。

DSH 的 Agent 能做出完整的 HTML 页面,但 Web UI 只能把它显示成一段大多数人读不懂、更改不动的代码块——这个插件补上了这一环:Agent 把做好的页面交给一个工具,页面就在聊天旁边的画布中渲染出来,任何人点击页面上的文字即可修改,始终不需要碰源码。

dsh-html-canvas

特性

点哪改哪 —— 渲染页面上的任意文字都可编辑:标题、按钮、导航链接、<div> 裸文本、甚至页面脚本后插入的文字。
并排而非遮挡 —— 画布挤压聊天列而不是盖住它,左缘拖拽把手可调宽度。
住在聊天里 —— 工具调用渲染为一个链接;随时关闭画布,点链接即可找回,编辑内容和宽度都保留。
安全且本地化 —— sandbox iframe 隔离,输出不含编辑器痕迹,界面文案跟随 DSH 语言(English / 中文)。

安装

npx -y @deepseek-ai/dsh plugin --profile web add @jinsong-zhou/dsh-html-canvas@latest

然后重启 DSH web 进程并刷新浏览器。本地检出安装:在 profile 的 package.json 声明 file: 依赖,并在 cordis.patch.yml 中插入:

- insert:
    - id: html-canvas
      name: '@jinsong-zhou/dsh-html-canvas'

使用

向 Agent 要任何页面——"做一个苹果风格的个人主页"——画布带着结果打开,点击文字即可修改。

开发

node tests/host.test.mjs      # host 契约(插件必须保持零依赖)
node tests/client.test.mjs    # client 行为
DSH_WEB_URL=http://127.0.0.1:<port> node tests/verify-deployment.mjs

注:host 半边刻意不 import 任何包——插件自带的 @deepseek-ai/* 依赖会被提升进 profile、遮蔽宿主同名包,导致所有工具调用崩溃。测试对此有回归保护。