Agent Skills
› tldraw/tldraw
tldraw/tldraw
GitHub指导将交互式UI添加到现有MCP服务器工具中，通过SDK链接HTML资源实现内嵌渲染。
安装全部 Skills
npx skills add tldraw/tldraw --all -g -y
集合内 Skills (27)
指导将交互式UI添加到现有MCP服务器工具中，通过SDK链接HTML资源实现内嵌渲染。
添加UI到MCP服务器
为MCP工具增强交互界面
集成MCP Apps SDK
npx skills add tldraw/tldraw --skill add-app-to-server -g -y
指导创建交互式MCP应用，结合工具与HTML资源，提供React/Vue等框架模板及SDK集成指南。
创建MCP App
为MCP工具添加UI
构建交互式MCP视图
脚手架化MCP应用
npx skills add tldraw/tldraw --skill create-mcp-app -g -y
指导将 OpenAI Apps SDK 应用迁移至 MCP Apps SDK，提供 API 映射表、代码示例及 CSP 配置注意事项。
migrate from OpenAI Apps SDK
convert OpenAI App to MCP
port from window.openai
npx skills add tldraw/tldraw --skill migrate-oai-app -g -y
将当前分支的工作重新实现在新分支上，生成清晰、叙事性的 Git 提交历史，便于代码审查。通过对比差异、规划逻辑步骤并逐步提交，确保最终状态与源分支一致，最后创建 PR。
要求制作干净的分支副本
清理提交历史
重建为可审查的提交
npx skills add tldraw/tldraw --skill clean-copy -g -y
用于创建Git提交，自动收集变更上下文并生成符合规范的消息。
用户要求提交更改
生成提交消息
npx skills add tldraw/tldraw --skill commit-changes -g -y
用于生成 tldraw.com 每周发布摘要并发送至营销团队 Discord。分析代码变更，以非技术语言撰写用户视角的更新亮点草稿，供营销人员编辑和宣传使用。
准备每周 dotcom 发布内容
被要求为非工程受众解释本周发布内容
触发自动化发布营销流程
npx skills add tldraw/tldraw --skill dotcom-release-marketing -g -y
用于从用户描述创建 GitHub Issue，并通过追问澄清意图和上下文。确保 Issue 记录完整的产品需求而非技术实现细节，便于后续处理。
用户要求创建 Issue
报告 Bug
提出功能请求
npx skills add tldraw/tldraw --skill issue -g -y
基于 PR URL 自动生成包含代码高亮、旁白解说和字幕的讲解视频，帮助快速理解变更内容与逻辑。
需要创建 PR 讲解视频
请求生成 PR walkthrough
npx skills add tldraw/tldraw --skill pr-walkthrough -g -y
自动创建或更新代码库的 Pull Request，涵盖上下文收集、重叠检查、分支准备及自动化预审查。
用户要求创建或更新 PR
推送当前分支变更以供审查
npx skills add tldraw/tldraw --skill pr -g -y
用于审查和改进文档质量，通过风格与内容双重评估循环，追踪并修复问题，直至文档符合规范。
审查文档
审计文章
检查风格指南合规性
改进现有文档
npx skills add tldraw/tldraw --skill review-docs -g -y
自主审查PR评论与构建状态，高置信度修复拼写、类型错误及CI失败，低置信度问题标记给人工处理。涵盖评论分类、代码修复、回复与线程解决，以及构建检查。
review PR comments
fix the build
address PR feedback
clean up PR
resolve comments
npx skills add tldraw/tldraw --skill shepherd-pr -g -y
将大型 Chrome DevTools 性能追踪文件转换为紧凑的 Markdown 报告，辅助分析卡顿、高频任务及热点函数。支持按时间窗口过滤和特定章节提取，便于快速定位性能瓶颈。
用户请求分析 Chrome/DevTools 性能追踪文件
需要查找导致页面卡顿或响应慢的原因
需要从巨大的 JSON 追踪文件中提取关键性能指标
npx skills add tldraw/tldraw --skill simplify-trace -g -y
提供创建和更新 Agent Skill 的指导，涵盖技能结构、核心原则（如简洁性）及自由度设置，帮助用户扩展 AI 代理能力。
用户希望创建新的 Skill
用户希望更新现有 Skill
npx skills add tldraw/tldraw --skill skill-creator -g -y
基于代码实现推导行为规范(SPEC.md)并重构单元测试套件，确保测试与规范双向可追溯。用于重建包级测试集或编写规范文档。
要求基于实现重建单元测试
为包编写SPEC.md规范文档
重复状态或存储库的规范流程
npx skills add tldraw/tldraw --skill spec-driven-tests -g -y
用于在GitHub仓库中查找、理解并分配Issue，随后规划代码实现、执行开发、运行验证测试，最终创建Pull Request的完整端到端任务自动化技能。
用户要求接管或认领Issue
用户提供Issue编号或URL要求实现
用户描述需求并要求从Issue列表中选择
npx skills add tldraw/tldraw --skill take -g -y
协助将项目迁移至新版 tldraw SDK，自动检测版本、获取变更日志与文档，解决升级后的 TypeScript 错误及兼容性问题。
用户提及 tldraw 迁移或升级
修复 tldraw 升级后的 TypeScript 错误
执行 /tldraw-migrate 命令
npx skills add tldraw/tldraw --skill tldraw-migrate -g -y
自动化维护 tldraw 发布说明，根据 PR 更新 next.mdx 或在发布时归档版本文件。
需要生成或更新软件发布说明
执行新版本发布并归档旧版说明
npx skills add tldraw/tldraw --skill update-release-notes -g -y
指导如何编写和更新tldraw SDK文档，涵盖文件位置、内容结构、MDX组件使用及验证步骤。
创建新的文档文章
更新现有文档
需要文档写作指导
npx skills add tldraw/tldraw --skill write-docs -g -y
指导如何使用 Playwright 编写 tldraw 的端到端（E2E）测试，涵盖文件结构、夹具使用、编辑器交互及 UI 事件测试模式。
需要为 tldraw 应用或示例创建浏览器自动化测试
编写 E2E 测试用例以验证 UI 交互和功能
在 e2e 目录下添加新的端到端覆盖率
npx skills add tldraw/tldraw --skill write-e2e-tests -g -y
指导如何为 tldraw SDK 编写示例应用，涵盖目录结构、命名规范、README 元数据格式及 React 组件实现标准。
创建新的 tldraw SDK 示例
添加 SDK 演示代码
在 apps/examples 中编写示例
npx skills add tldraw/tldraw --skill write-example -g -y
提供GitHub Issue的撰写与维护标准，包括标题规范、类型定义、标签使用及正文模板。用于辅助生成或审查Issue内容，确保格式统一和描述清晰。
需要创建或更新GitHub Issue时
需要标准化Issue标题或正文格式时
npx skills add tldraw/tldraw --skill write-issue -g -y
提供 tldraw 仓库 PR 标题和描述的写作标准，指导如何为审阅者撰写清晰、简洁的说明。本次更新增加了检查未修改注释和文档是否过时的步骤，防止遗留过时信息。
需要生成或优化 Pull Request 描述时
编写符合 Conventional Commits 规范的 PR 标题时
检查代码变更周围的注释和文档是否过时
npx skills add tldraw/tldraw --skill write-pr -g -y
用于撰写 tldraw SDK 发布说明的 Skill，指导从识别版本、提取 PR 详情到编写文档结构及迁移指南的完整流程。
创建新的发布说明文档
从零起草发布说明
审查发布说明质量
npx skills add tldraw/tldraw --skill write-release-notes -g -y
指导 Agent 撰写 tldraw 技术博客，涵盖创建工作区、深度研究实现细节、提炼写作角度及起草草稿流程。
需要撰写关于 tldraw 功能或实现的技术博客
生成代码库特定模块的深度解析文章
npx skills add tldraw/tldraw --skill write-tbp -g -y
指导为 tldraw SDK 编写单元测试和集成测试，涵盖 Vitest 使用、TestEditor 配置、文件组织及防泄漏等最佳实践。
创建新的测试用例
增加测试覆盖率
修复失败的测试
npx skills add tldraw/tldraw --skill write-unit-tests -g -y
指导将现有 Web 应用转换为支持 MCP 协议的混合应用，使其能在 Claude Desktop 等主机中内联渲染，同时保持独立运行能力。
add MCP App support to my web app
turn my web app into a hybrid MCP App
npx skills add tldraw/tldraw --skill convert-web-app -g -y
自动分析主分支与生产环境间的差异，筛选关键修复或重大功能贡献者，并将精简后的核心人员摘要发布至 Discord 频道，用于快速定位发布风险责任人。
需要识别本周发布的关键贡献者
向开发频道发送发布相关人员摘要
npx skills add tldraw/tldraw --skill dotcom-release-crew -g -y
