nzl153/pet-whale1

pet-whale

随 Agent 状态实时切换动画的 DSH Web 官方轮廓版桌宠小鲸鱼插件,纯 DOM 实现,零运行时依赖。

AI 分析

核心用途是为 DSH 界面增加趣味交互与状态可视化。适合喜欢桌面宠物、希望直观看到 AI 处于“思考”、“敲代码”或“报错”等状态的用户。

包名
pet-whale
版本
0.1.0
许可证
MIT
最近更新
2026年8月15日

安装

$npx -p @deepseek-ai/dsh dsh plugin --profile web add github:nzl153/pet-whale

pet-whale · 桌宠小鲸鱼 🐳

DeepSeek Harness(DSH)Web 界面的桌宠插件:右下角一只官方轮廓版小鲸鱼,随 agent 状态实时切换动画。纯 DOM 实现、零 React 依赖、零运行时第三方依赖,WebAudio 合成音效无音频文件。

在线预览

无需安装,点开即玩(全部状态与交互,官方轮廓版):

👉 ****

仓库内的 preview.html 即预览页源码,本地直接打开同样可以体验。

特性

能力说明
状态机idle / think(深潜)/ working(游动 + 敲键盘 + 代码粒子)/ celebrate(跃起冒泡)/ error(发抖 + 尴尬黑线);优先级 error > celebrate > think > working > idle
回合语义回合进行中永不发呆:有工具 = working,无工具(文字流或内部推理)= think 深潜;工具密集期键盘动画粘滞 2.5s
交互单击戳戳、双击 360° 翻滚、右键菜单(投喂 / 摸摸头 / 换颜色 / 音效开关)、鼠标追光、20s 无操作打瞌睡、拖拽移动并记忆位置
换肤7 套预设色板(默认主题蓝):主题蓝 / 陶土 / 深海蓝 / 抹茶绿 / 樱粉 / 墨灰 / 夜黑;夜黑为深色皮肤示例(眼睛自动反白)。扩展只需在 src/client/palettes.ts 加一行
音效WebAudio 合成六种音效,右键可关,偏好持久化
无障碍prefers-reduced-motion 下自动降级为静态显示

安装

要求 DSH >=0.1.0-rc.6(web profile)。

# 本地目录安装(仓库已包含构建产物 lib/,无需先构建)
dsh plugin --profile web add link:/path/to/pet-whale

# 或 git 直装
dsh plugin --profile web add "github:/pet-whale#main"

装完重启 dsh web(host 半在启动时合成)。之后 client 半的改动只需硬刷新(Ctrl+F5),无需重启。

构建与测试

pnpm install
pnpm typecheck   # tsc 类型检查
pnpm build       # tsdown → lib/index.mjs + lib/client.js
pnpm test        # jsdom 冒烟测试(状态机 / 交互 / 换肤 / 清理)

开发

  • src/client/palettes.ts — 色板扩展点。加一行就是一个新皮肤;eye/pupil 字段用于深色皮肤的"眼睛反白"
  • scripts/extract-whale.mjs — 从 preview.html 同步 V2 SVG(含 CSS 变量替换),改完模板重跑 pnpm extract
  • scripts/verify-live.mjs — 重启后的一键线上验证(boot 清单 / bundle 下载 / 注册格式)
  • 状态来源:ctx.sessions 服务的会话快照(running / runningCalls / partial / lastAgentError / turnEnds),详见 src/client/state.ts

附:自用 UI 美化补丁(仅供参考)

patches/ 目录包含个人自用的 DSH 界面定制补丁,随仓库开源供参考,不是本插件的组成部分

  • 暖色纸感主题:类 Claude 风格暖调配色(陶土 #A3502C + 米白 #F7F2E6 + 暖墨 #2E2A24),亮暗两套,正文对比度 ≥4.5(WCAG AA)
  • 鲸鱼发送 / 取消键:发送键 = 蓝色小鲸鱼,取消键 = 黑色小鲸鱼(与 favicon 一致),按钮 48px
  • 针对 DSH rc.6 的特定构建产物编写,升级 DSH 后若锚点失效需人工核对更新
node patches/apply-patches.cjs 

声明

  • 鲸鱼轮廓使用 DeepSeek 官方 FishLogo 路径(品牌素材,使用请注明出处)
  • 交互设计思路参考 whale-girl(MIT)
  • 主题配色灵感来自 Anthropic Claude 的暖色纸感风格

License

MIT