dsh-claude-motion 0.0.1 → 2.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +26 -0
- package/NOTICE.md +59 -0
- package/README.md +37 -3
- package/cordis.patch.yml +7 -0
- package/docs/DETAIL.md +32 -0
- package/docs/DETAIL.zh.md +17 -0
- package/icon.svg +8 -0
- package/lib/client.js +826 -0
- package/lib/index.js +594 -0
- package/locale/en.json +7 -0
- package/locale/zh.json +7 -0
- package/package.json +60 -6
- package/skills/claude-motion/SKILL.md +685 -0
- package/skills/claude-motion/artifact-type/reference/by-hand.md +84 -0
- package/skills/claude-motion/artifact-type/reference/film-api.md +278 -0
- package/skills/claude-motion/artifact-type/reference/finalize.md +213 -0
- package/skills/claude-motion/artifact-type/reference/motion.md +260 -0
- package/skills/claude-motion/artifact-type/reference/plan.md +239 -0
- package/skills/claude-motion/artifact-type/reference/questions.md +240 -0
- package/skills/claude-motion/artifact-type/reference/recreate-ui.md +140 -0
- package/skills/claude-motion/artifact-type/reference/render-offline.md +126 -0
- package/skills/claude-motion/artifact-type/reference/rough-cut.md +251 -0
- package/skills/claude-motion/artifact-type/reference/sound.md +106 -0
- package/skills/claude-motion/artifact-type/reference/styles.md +230 -0
- package/skills/claude-motion/artifact-type/reference/walkthrough.md +83 -0
- package/skills/claude-motion/scripts/artifact.mjs +8368 -0
- package/skills/claude-motion/scripts/editor/artifact-type/anthropicons-fizzy-lake-DtzHkSJH.woff2 +0 -0
- package/skills/claude-motion/scripts/editor/artifact-type/app.css +1 -0
- package/skills/claude-motion/scripts/editor/artifact-type/app.js +17230 -0
- package/skills/claude-motion/scripts/editor/index.html +145 -0
- package/skills/claude-motion/scripts/editor/local-host.js +12 -0
- package/skills/claude-motion/scripts/editor/share-ui.js +208 -0
- package/skills/claude-motion/scripts/editor/third-party-licenses.txt +970 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
This MIT License covers only the original work of Jim Liu 宝玉 in this repository
|
|
2
|
+
and in the baoyu-design npm packages. It does not cover the material from
|
|
3
|
+
Anthropic or the third-party open-source code listed in NOTICE.md, which keep
|
|
4
|
+
their own terms.
|
|
5
|
+
|
|
6
|
+
MIT License
|
|
7
|
+
|
|
8
|
+
Copyright (c) 2026 Jim Liu 宝玉
|
|
9
|
+
|
|
10
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
11
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
12
|
+
in the Software without restriction, including without limitation the rights
|
|
13
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
14
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
15
|
+
furnished to do so, subject to the following conditions:
|
|
16
|
+
|
|
17
|
+
The above copyright notice and this permission notice shall be included in all
|
|
18
|
+
copies or substantial portions of the Software.
|
|
19
|
+
|
|
20
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
21
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
22
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
23
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
24
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
25
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
26
|
+
SOFTWARE.
|
package/NOTICE.md
ADDED
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
# Notices
|
|
2
|
+
|
|
3
|
+
baoyu-design holds material under three different sets of terms. The MIT License in [LICENSE](LICENSE) covers only the first. The same applies to the DeepSeek Harness plugins on npm, which ship this file next to their `LICENSE`.
|
|
4
|
+
|
|
5
|
+
[中文说明](#中文说明)
|
|
6
|
+
|
|
7
|
+
## 1. The maintainer's own work: MIT
|
|
8
|
+
|
|
9
|
+
Copyright (c) 2026 Jim Liu 宝玉, under the MIT License in [LICENSE](LICENSE):
|
|
10
|
+
|
|
11
|
+
- The local tooling: each skill's `scripts/artifact.mjs` and, where there is one, `scripts/server.mjs` (the command line and the local editor server), the local comments, and what lets the editors run on a local machine instead of claude.ai.
|
|
12
|
+
- The DeepSeek Harness plugins' own code and files: `dsh-plugins/*/lib/`, `cordis.patch.yml`, `locale/`, `docs/` and `icon.svg`.
|
|
13
|
+
- The parts of the skills' text written for local agents: how to open and run the editors, local paths and files, comments.
|
|
14
|
+
- A skill whose `license:` line says plain MIT is wholly the maintainer's work: all of its files are MIT.
|
|
15
|
+
- The READMEs, the changelogs, the images in `assets/` and the files in `.github/`.
|
|
16
|
+
- The maintainer's tools in `archive/baoyu-design/agents/`, apart from the open-source code vendored there (section 3).
|
|
17
|
+
|
|
18
|
+
## 2. Material from Anthropic: not MIT
|
|
19
|
+
|
|
20
|
+
baoyu-design brings claude.ai's Artifact types and Claude Design to local agents, so much of what it ships comes from Anthropic, PBC. That material stays Anthropic's. Anthropic has published no license for it, apart from the one file in section 2.1, and this project grants none: the MIT License does not apply to it. It is included so the skills work as they do on claude.ai. This project is independent and is not affiliated with or endorsed by Anthropic.
|
|
21
|
+
|
|
22
|
+
- **Skill instructions.** Each `skills/claude-*/SKILL.md` adapts the SKILL.md of a claude.ai Artifact type. The maintainer's local-agent changes are described in section 1.
|
|
23
|
+
- **Reference docs.** `skills/*/artifact-type/reference/`, and the copies under `scripts/editor/artifact-type/`: the craft, format and layout guides, font lists and other references of the Artifact types.
|
|
24
|
+
- **The `dataviz` skill.** `skills/dataviz/` is Anthropic's dataviz skill. Its palette validators include code from Color.js (MIT, Lea Verou and Chris Lilley), credited in the files.
|
|
25
|
+
- **The editors.** `skills/claude-*/scripts/editor/` holds editors reconstructed from the claude.ai Artifact-type runtimes: their interface, wording and behaviour are Anthropic's. The built files mix that reconstruction with the maintainer's local additions (section 1) and with open-source packages (section 3).
|
|
26
|
+
- **Icon fonts.** The Anthropicons icon fonts: the `anthropicons-*.woff2` files in the editors' `assets/` and `artifact-type/` folders, and the Anthropicons font faces embedded as data URIs in the editors' CSS.
|
|
27
|
+
- **The archived `baoyu-design` skill.** In `archive/baoyu-design/`: `system-prompt.md`, `references/upstream-system-prompt.md` and `references/upstream-sync/` (the Claude Design system prompt, a snapshot of it and its sync records), `built-in-skills/` (Claude Design's built-in skills) and `starter-components/` (Claude Design's starter components; the local patches are recorded in the `*-patch.md` files there).
|
|
28
|
+
|
|
29
|
+
### 2.1 frontend-design: Apache License 2.0
|
|
30
|
+
|
|
31
|
+
`archive/baoyu-design/built-in-skills/frontend-design.md` is Claude Design's copy of Anthropic's frontend-design skill, which Anthropic publishes under the Apache License 2.0. The full license text is in [`archive/baoyu-design/built-in-skills/LICENSE-frontend-design.txt`](archive/baoyu-design/built-in-skills/LICENSE-frontend-design.txt). The file was changed from the original: its frontmatter was rewritten for the built-in-skill format (its `license` line records the change), and its text follows the version Claude Design ships.
|
|
32
|
+
|
|
33
|
+
## 3. Third-party open-source code
|
|
34
|
+
|
|
35
|
+
The editors bundle open-source packages, such as React, Base UI, d3 and pptxgenjs. Each keeps its own license, which this project's license does not replace. The licenses are in each editor's `scripts/editor/third-party-licenses.txt`, and for the slides compiler in `scripts/editor/node/third-party-licenses.txt`.
|
|
36
|
+
|
|
37
|
+
The archived `baoyu-design` skill vendors React, ReactDOM, Babel and fflate (MIT) in `archive/baoyu-design/agents/vendor/`, and pptxgenjs (MIT) in `archive/baoyu-design/agents/gen-pptx/vendor/pptxgenjs/`, with its `LICENSE`.
|
|
38
|
+
|
|
39
|
+
## Questions and removal
|
|
40
|
+
|
|
41
|
+
If you hold rights in anything here and want it credited differently, changed or removed, open an issue at <https://github.com/JimLiu/baoyu-design/issues>.
|
|
42
|
+
|
|
43
|
+
## 中文说明
|
|
44
|
+
|
|
45
|
+
本仓库(以及 npm 上的 DeepSeek Harness 插件)里的内容分三类,许可各不相同。[LICENSE](LICENSE) 里的 MIT 许可只管第一类。
|
|
46
|
+
|
|
47
|
+
1. **维护者自己写的部分,MIT。** 本地命令行和编辑器服务器(各技能的 `scripts/artifact.mjs`,以及有的技能带的 `scripts/server.mjs`)、本地评论、让编辑器离开 claude.ai 在本机运行的那部分代码;DeepSeek Harness 插件自己的代码和文件(`dsh-plugins/*/lib/`、`cordis.patch.yml`、`locale/`、`docs/`、`icon.svg`);技能说明里为本地 Agent 写的部分;`license:` 一行只写 MIT 的技能,整个是维护者写的,它的全部文件都是;README、更新日志、`assets/` 里的图片、`.github/`;`archive/baoyu-design/agents/` 里维护者写的工具。
|
|
48
|
+
2. **取自 Anthropic 的部分,不适用 MIT。** 权利归 Anthropic。除 frontend-design 外,Anthropic 没有为这些内容公开许可,本项目也不授予任何许可。包括:
|
|
49
|
+
- 各 `skills/claude-*/SKILL.md` 所改编的 Artifact 类型技能说明;
|
|
50
|
+
- `artifact-type/reference/` 里的参考文档;
|
|
51
|
+
- `skills/dataviz/`(Anthropic 的 dataviz 技能);
|
|
52
|
+
- `scripts/editor/` 里从 claude.ai 运行时还原的编辑器(界面、文案和行为);
|
|
53
|
+
- Anthropicons 图标字体(`anthropicons-*.woff2` 文件,以及编辑器 CSS 里内嵌的字体);
|
|
54
|
+
- `archive/baoyu-design/` 里的 Claude Design 系统提示词、内置技能和起步组件。
|
|
55
|
+
|
|
56
|
+
`archive/baoyu-design/built-in-skills/frontend-design.md` 取自 Anthropic 以 Apache License 2.0 发布的 frontend-design 技能,许可全文见同目录的 `LICENSE-frontend-design.txt`。
|
|
57
|
+
3. **第三方开源代码,各按原许可。** 编辑器打进去的开源包(React、Base UI、d3、pptxgenjs 等)的许可见各编辑器的 `scripts/editor/third-party-licenses.txt`;归档技能里内置的 React、Babel、fflate、pptxgenjs 见 `archive/baoyu-design/agents/vendor/` 和 `agents/gen-pptx/vendor/pptxgenjs/LICENSE`。
|
|
58
|
+
|
|
59
|
+
本项目是独立的社区项目,与 Anthropic 无隶属或背书关系。权利人希望调整署名、修改或移除某部分内容,请在 <https://github.com/JimLiu/baoyu-design/issues> 提 issue。
|
package/README.md
CHANGED
|
@@ -1,6 +1,40 @@
|
|
|
1
1
|
# dsh-claude-motion
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
[baoyu-design](https://github.com/JimLiu/baoyu-design)
|
|
3
|
+
A [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) plugin that adds the **claude-motion** skill from
|
|
4
|
+
[baoyu-design](https://github.com/JimLiu/baoyu-design): the agent writes short animated films (explainers, product
|
|
5
|
+
demos, title sequences) as code, scene by scene, into a folder in your workspace, and plays them in a local Motion
|
|
6
|
+
player, where you watch them fill in, comment on a moment, and export MP4 or GIF.
|
|
5
7
|
|
|
6
|
-
|
|
8
|
+
## Install
|
|
9
|
+
|
|
10
|
+
In the DeepSeek Harness app: **Plugins** → install → enter this package's folder (an absolute path) or its tarball.
|
|
11
|
+
From the command line, for a CLI profile such as `web`:
|
|
12
|
+
|
|
13
|
+
```sh
|
|
14
|
+
dsh plugin --profile web add /absolute/path/to/dsh-claude-motion
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
Then quit and reopen the app, start a new session, and ask for a film, or type `/claude-motion`. A workspace that has
|
|
18
|
+
its own `claude-motion` skill (in `.agents/skills/` or `.dsh/skills/`) uses that copy instead of this plugin's.
|
|
19
|
+
|
|
20
|
+
## What is inside
|
|
21
|
+
|
|
22
|
+
- `skills/claude-motion/`: the skill as baoyu-design publishes it (`SKILL.md`, `artifact-type/reference/`, and the
|
|
23
|
+
prebuilt `scripts/`: the player page and `artifact.mjs`, which is also its server).
|
|
24
|
+
- `lib/index.js`: the plugin. It registers the skill with the Harness skill registry and, when the skill loads, tells the
|
|
25
|
+
agent which Node executable runs `scripts/artifact.mjs`: the Host's own Node, the Node runtime the desktop app ships,
|
|
26
|
+
or `node` on PATH. Set `node` in the `claude-motion` row's config to choose another. Whenever the agent opens the
|
|
27
|
+
player, the plugin also waits for comments, so a comment's **Send to Agent** box is there: send one and the agent
|
|
28
|
+
wakes up, changes the film, and replies in the comment. The player's **Continue**, **Finalize**, **Make the
|
|
29
|
+
animation** and **Ask Agent** buttons reach the agent the same way.
|
|
30
|
+
- `lib/client.js`: the part that runs in the app's window. It shows a comment, or a button's request, sent to the agent
|
|
31
|
+
as a card in the chat; **View thread** on a comment's card opens it in the player. It also adds **Artifacts** to the left
|
|
32
|
+
sidebar, one entry for all the baoyu-design plugins: the films and everything else the agent has opened, each a
|
|
33
|
+
click away from its conversation and editor.
|
|
34
|
+
- `cordis.patch.yml`: the bundle layer that mounts the plugin row.
|
|
35
|
+
|
|
36
|
+
The player's server listens on 127.0.0.1 only and reads and writes only the film's folder.
|
|
37
|
+
|
|
38
|
+
## License
|
|
39
|
+
|
|
40
|
+
Not all MIT. The plugin's own code and files (`lib/`, `cordis.patch.yml`, `locale/`, `docs/`, `icon.svg`) and the skill's local tooling are MIT, in `LICENSE`. The bundled `claude-motion` skill is adapted from Anthropic's claude.ai Motion type: its instructions, references, player and icon fonts stay Anthropic's and are not under the MIT License. `NOTICE.md` sets out which is which. The player's open-source licenses are in `skills/claude-motion/scripts/editor/third-party-licenses.txt`.
|
package/cordis.patch.yml
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
# dsh-claude-motion bundle patch: installing the package (the Plugins page, or
|
|
2
|
+
# `dsh plugin --profile <name> add <spec>`) adds it to the profile's bundles,
|
|
3
|
+
# and this layer mounts its one plugin row, which registers the claude-motion
|
|
4
|
+
# skill with the profile's skill registry.
|
|
5
|
+
- insert:
|
|
6
|
+
- id: claude-motion
|
|
7
|
+
name: dsh-claude-motion
|
package/docs/DETAIL.md
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
# Claude Motion
|
|
2
|
+
|
|
3
|
+
Adds the **claude-motion** skill to DeepSeek Harness. Ask for a short animated film ("a 15-second explainer of how our
|
|
4
|
+
sync works", "a logo sting for the launch") and the agent writes it as code, scene by scene, into a folder in your
|
|
5
|
+
workspace (`designs/<name>/` unless you name another). It starts a local Motion player and gives you its link; the film
|
|
6
|
+
fills in there as the agent writes it.
|
|
7
|
+
|
|
8
|
+
## Using it
|
|
9
|
+
|
|
10
|
+
- Ask in plain words, or type `/claude-motion` to call the skill by name. It works best with your own material:
|
|
11
|
+
screenshots, a logo, brand colours, fonts.
|
|
12
|
+
- Open the link the agent gives you. In the desktop app it opens in the right sidebar's Browser, beside the
|
|
13
|
+
conversation (Settings → General → Open chat links in: **In-App Sidebar**, the default).
|
|
14
|
+
- In the player you play and scrub the film. Its **Continue**, **Finalize**, **Make the animation** and **Ask Agent**
|
|
15
|
+
buttons send their request to the agent, like a comment: it shows in the chat as a card and the agent takes it from
|
|
16
|
+
there, even when the conversation is idle. When the agent isn't waiting (after restarting the app, until it opens the
|
|
17
|
+
film again), they copy the request instead, and you paste it into the chat.
|
|
18
|
+
- Comment on a moment: the comments button in the bar at the top turns comment mode on. Click the picture to comment on
|
|
19
|
+
that moment and point, drag for a box, or press R to mark a stretch of time. Tick **Send to Agent** and the agent picks
|
|
20
|
+
it up at once, even when the conversation is idle: it changes the film and replies in the comment. The comment also
|
|
21
|
+
shows in the chat as a card; **View thread** on the card opens it in the player. The box is there while comments can
|
|
22
|
+
reach the agent, which starts each time it gives you the link. After restarting the app, ask the agent to open the
|
|
23
|
+
film again to bring it back.
|
|
24
|
+
- Export: the download button under the film encodes MP4 or GIF in the page and saves it to your downloads.
|
|
25
|
+
- To change a film later, ask the agent to revise its folder.
|
|
26
|
+
- A workspace that has its own `claude-motion` skill (in `.agents/skills/` or `.dsh/skills/`) uses that copy instead
|
|
27
|
+
of this plugin's.
|
|
28
|
+
|
|
29
|
+
## What runs where
|
|
30
|
+
|
|
31
|
+
The player is a small server on 127.0.0.1 that the skill's script starts in the background, one per film. It reads and
|
|
32
|
+
writes only that film's folder. The desktop app's own Node runtime runs it; nothing else is installed.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
# Claude 动画
|
|
2
|
+
|
|
3
|
+
给 DeepSeek Harness 加上 **claude-motion** 技能。让 Agent 做一段短动画("做一段 15 秒的动画,讲清楚我们的同步是怎么工作的"、"给发布会做一个 logo 片头"),它会用代码一幕一幕地把动画写进工作区里的一个文件夹(默认是 `designs/<名字>/`,也可以指定别的)。写的时候它会启动本地 Motion 播放器,把链接给你,你可以在播放器里看着动画一点点成形。
|
|
4
|
+
|
|
5
|
+
## 怎么用
|
|
6
|
+
|
|
7
|
+
- 直接用自然语言提要求,或者输入 `/claude-motion` 点名调用这个技能。给它你自己的素材效果最好:截图、logo、品牌色、字体。
|
|
8
|
+
- 打开 Agent 给的链接。桌面版里它会在右侧栏的浏览器里打开,和对话并排(设置 → 通用 → 聊天链接打开方式:**应用内侧栏**,默认就是这个)。
|
|
9
|
+
- 播放器里可以播放、拖动进度。页面上的 **Continue**、**Finalize**、**Make the animation** 和 **Ask Agent** 按钮和评论一样,会把请求直接发给 Agent:对话里出现一张卡片,Agent 接着去做,对话空闲时也一样。Agent 没在等的时候(比如重启应用后、还没让它再打开这段动画),按钮会改成复制请求,你把它粘贴到对话里发出去。
|
|
10
|
+
- 给某个时刻留评论:点顶部栏的评论按钮进入评论模式,点画面就是评论那个时刻的那个位置,拖一下是框住一块区域,按 R 是标出一段时间。勾上 **Send to Agent** 发出去,Agent 会马上接手,对话空闲时也一样:它改好动画,再在评论里回复你。评论也会以卡片的形式出现在对话里,点卡片上的 **View thread**(中文界面是「查看评论」)会在播放器里打开这条评论。这个勾选框只在评论能发给 Agent 时出现;Agent 每次给你播放器链接时都会开始等评论。重启应用后,让 Agent 再打开一次这段动画就能恢复。
|
|
11
|
+
- 导出:动画下方的下载按钮会在页面里把动画编码成 MP4 或 GIF,存到下载文件夹。
|
|
12
|
+
- 以后要改,让 Agent 修改那个动画所在的文件夹即可。
|
|
13
|
+
- 如果工作区自己带了 `claude-motion` 技能(在 `.agents/skills/` 或 `.dsh/skills/` 里),这个工作区会用它自己那份,而不是插件里的。
|
|
14
|
+
|
|
15
|
+
## 运行方式
|
|
16
|
+
|
|
17
|
+
播放器是技能脚本在后台启动的一个本地服务(127.0.0.1),一段动画一个,只读写这段动画自己的文件夹。用的是桌面版自带的 Node,不需要另外安装任何东西。
|
package/icon.svg
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
|
|
2
|
+
<rect width="64" height="64" rx="14" fill="#D97757"/>
|
|
3
|
+
<rect x="12" y="13" width="40" height="27" rx="3" fill="#FFF7F2"/>
|
|
4
|
+
<path d="M28.5 20.5v12l10-6z" fill="#D97757"/>
|
|
5
|
+
<rect x="12" y="46" width="40" height="3" rx="1.5" fill="#E9B8A3"/>
|
|
6
|
+
<rect x="12" y="46" width="17" height="3" rx="1.5" fill="#FFF7F2"/>
|
|
7
|
+
<circle cx="29" cy="47.5" r="3.5" fill="#FFF7F2"/>
|
|
8
|
+
</svg>
|