前言¶

DeepSeek Harness（DSH）的 Web 客户端侧栏沿用官方鲸鱼标识与 deepseek / HARNESS 字标。长时间等待模型生成时，界面往往保持静态，侧栏与标题区缺少与 useSessionStatus 中 running 状态对应的视觉反馈。社区插件 youyou-sidebar-logo-animation（仓库内 README 标题为 Harness Brand Motion）在空闲时复用与官方一致的几何与配色，在生成、加载与输入聚焦时叠加鲸鱼形变、字标扫光、标题前潜泳标记，以及输入框外的浅色旋转彩虹描边，属于目录分类「趣味换装」，由维护者 mryouyouHK 发布；GitHub 星标为 0。下文按实现行为、扩展点、安装与注意事项说明，事实以仓库 README 与 package.json 为准。

这是什么¶

youyou-sidebar-logo-animation 是面向 DSH Web 客户端的 bundle 插件（version 1.0.0，许可证 MIT）。它通过 Cordis 插槽注入客户端模块 client.js，监听会话与对话加载状态，在不改写官方品牌几何的前提下为侧栏与对话 UI 增加动画；并在各 Session 的 composer 卡片内放置隐藏标记，供聚焦时用 CSS 绘制 2 px 彩虹描边。Host 侧 index.js 无额外 host 行为。

核心功能¶

空闲（Idle）¶

侧栏两个占位（鲸鱼标记与字标）绘制与官方品牌相同的 SVG 路径与字样，使用相同的 currentColor 与反转标签色，无会话运行时不改变侧栏观感。

生成中（Generating）¶

当任意 Harness 会话在 useSessionStatus 快照中报告 running: true 时：

1. 侧栏鲸鱼：在两个变形姿态之间 morph（非均匀挤压加身体弯曲，经 SVG d 属性动画），带柔和白色光晕；不旋转、不公转。标记视口含透明内边距，形变锚定在标记左缘，保证 24 px 徽标框内不被裁切。
2. DEEPSEEK HARNESS 字标：一道 marquee 光带扫过字母，裁剪在字形轮廓内。
3. 无障碍：系统 prefers-reduced-motion: reduce 时冻结 morph 与扫光，仅保留慢速光晕。

对话标题前鲸鱼¶

对话头栏 leading 位在会话忙碌时绘制小型鲸鱼：

Composer 彩虹环¶

每个 Session composer 卡片（新会话与已有对话）内渲染隐藏标记 composer-rainbow-mark。该卡片内编辑器获得焦点时，CSS 在圆角边框外侧绘制浅色旋转 conic-gradient 彩虹环，遮罩为 2 px 描边。prefers-reduced-motion: reduce 时冻结旋转。

容错与样式范围¶

各占位由 error boundary 包裹；渲染失败时回退静态稿，避免品牌行空白。除插件自身 effect 安装/卸载的 <style> 外，不向 DOM 额外写入节点。

扩展点（Extension points）¶

后台扫描调度（与动效同包）¶

插件将周期性 DOM 刷新（滚动 affordance、账号头像镜像、等待倒计时卡片、错误 chip、composer 工具栏兜底、连接 pill 位置、bot 名册拉取等）注册到单一调度器，而非各自 setInterval：

• 窗口隐藏时不执行，避免无效唤醒；
• 空扫采用几何退避（×1.6，带上限），DOM 变化后恢复标称周期；
• 每次唤醒最多跑两个任务，减轻长任务对输入与滚动的影响；
• 共享一个 MutationObserver，无变更时仅 dirty 任务可跳过扫描。

在插件齿轮面板 性能 → 后台扫描频率 可选：省电（2.5× 慢）、平衡（默认）、灵敏（2× 快），存入 localStorage。倒计时 tick（1 s）与会话切换 overlay 的 measure/state 循环（1 s / 400 ms，最长约 4 s）仍为本地点定时器。

安装与启用¶

官方 README 未提供 dsh plugin add github:... 一类命令。安装方式为：在 Plugin Manager 中使用 install_bundle，指定插件包目录路径，再在 Settings → Plugins 中启用。

README 中的示例路径为作者本机目录，仅作动作说明，你的环境应替换为实际解压或 clone 后的包目录（勿将示例路径当作通用命令）：

# Plugin Manager → install_bundle → 指向包含 index.js、client.js、cordis.patch.yml 的目录
# 示例（来自 README，需按本机修改）：
/Users/aoao/Documents/deepseek-harness/default-workspace/sidebar-logo-animation

package.json 中 dsh.client 声明 platform: web、immediately: true，并注入 @deepseek-ai/dsh-client-ui-sidebar 与 @deepseek-ai/dsh-client-ui-session，需与当前 Harness 客户端版本兼容。

典型用法¶

本插件无独立 CLI 或配置 JSON；启用后行为由会话状态与系统动效偏好自动驱动。

1. 在插件管理器中 install_bundle 并打开插件开关。
2. 发起或续写会话，待 running: true：观察侧栏鲸鱼形变与字标扫光。
3. 打开或切换对话：加载阶段见标题前潜泳；生成阶段见游动；完成后标记消失。
4. 聚焦任意 Session 输入框：卡片外缘出现浅色旋转彩虹环（未开启减弱动效时）。
5. 若机器较省电或页面卡顿，可在齿轮 性能 → 后台扫描频率 选 省电 或 平衡。

适用场景与注意¶

适合谁：长期在 DSH Web 端跑智能体会话、希望侧栏与标题区状态与生成/加载同步的开发者；接受「趣味换装」类视觉增强、且不需要改动官方品牌几何的用户。

权限与安全：插件以当前 DSH 进程及浏览器上下文运行，可读写的范围与客户端脚本一致。安装前应在 GitHub 仓库 查阅 client.js 与 LICENSE（MIT），自行评估是否纳入工作环境。社区目录 SkillHub 插件页 为独立生态站点，与 DeepSeek / 幻方无官方从属关系。

依赖与文件：交付物含 index.js、client.js、cordis.patch.yml、locale/*.json、icon.svg；bundle 经 cordis.patch.yml 插入客户端行。

结尾¶

youyou-sidebar-logo-animation 在 idle 时保持官方侧栏品牌，在生成、对话加载与 composer 聚焦时分别提供鲸鱼 morph、字标 marquee、标题前潜泳/游动与彩虹描边，并附带统一后台扫描调度与可调的扫描频率。需要核对行为或提交 issue 时，可访问目录页与源码仓库：

• 目录：https://www.skillhub.cn/plugins/mryouyouHK/youyou-sidebar-logo-animation
• GitHub：https://github.com/mryouyouHK/youyou-sidebar-logo-animation