Agent Skills
› tldraw/tldraw
tldraw/tldraw
GitHub指导如何将交互式UI添加到现有MCP服务器工具中，通过SDK将HTML资源与工具关联，增强文本客户端的交互体验。
Install All Skills
npx skills add tldraw/tldraw --all -g -y
Skills in Collection (27)
指导如何将交互式UI添加到现有MCP服务器工具中，通过SDK将HTML资源与工具关联，增强文本客户端的交互体验。
添加UI到MCP服务器
为MCP工具添加交互式界面
丰富MCP工具的UI能力
npx skills add tldraw/tldraw --skill add-app-to-server -g -y
指导构建包含交互式UI的MCP应用，涵盖工具与资源注册、框架选型及生命周期管理。
创建MCP App
为MCP工具添加UI
构建交互式MCP视图
MCP App SDK模式指南
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
migrate from skybridge
npx skills add tldraw/tldraw --skill migrate-oai-app -g -y
该技能用于重构 Git 分支提交历史，将当前工作重新实现为新分支，生成清晰、逻辑连贯的叙事性提交记录，便于代码审查。
清理提交历史
制作干净副本
重构为可审查的提交
npx skills add tldraw/tldraw --skill clean-copy -g -y
自动化执行Git提交操作，收集上下文并生成符合规范的提交信息。
用户要求提交代码变更
生成提交消息
npx skills add tldraw/tldraw --skill commit-changes -g -y
分析 tldraw.com 本周版本更新，面向非技术营销团队撰写并发布简明发布摘要至 Discord。支持 dry-run 测试及指定提交范围，确保内容符合用户导向的发布规范。
准备每周 dotcom 版本发布
询问面向非工程团队的本周发布内容
运行发布的营销自动化流程
npx skills add tldraw/tldraw --skill dotcom-release-marketing -g -y
根据用户描述在 GitHub 创建 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
用于在 tldraw 仓库中创建或更新拉取请求。流程涵盖上下文收集、重叠工作检查、分支准备、自动审查修复及 PR 管理，确保代码质量与协作规范。
用户要求创建 PR
用户要求更新现有 PR
用户要求推送分支进行审查
npx skills add tldraw/tldraw --skill pr -g -y
对文档进行质量审查与改进，通过评估风格和准确性发现问题，并迭代修复直至达标。适用于审核、审计及优化现有文档内容。
要求审查文档
审计指定文章
检查文档是否符合风格指南
改进现有文档
npx skills add tldraw/tldraw --skill review-docs -g -y
自动审查PR评论并解决构建失败。通过分类处理误报、简单修复和需人工介入的问题，自动回复、解决线程及修复CI/CD错误，提升PR维护效率。
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 性能追踪文件（MB级JSON）自动摘要为紧凑的 Markdown 报告，帮助用户快速定位卡顿、高频事件及热点 JS 函数，无需加载原始大文件。
用户提供 Chrome/DevTools 性能追踪 JSON 文件
用户询问页面性能瓶颈、长任务或卡顿原因
npx skills add tldraw/tldraw --skill simplify-trace -g -y
指导用户创建或更新AI Agent技能（Skill）的规范指南，涵盖技能结构、核心原则及资源组织方式。
创建新技能
更新现有技能
npx skills add tldraw/tldraw --skill skill-creator -g -y
基于代码实现推导行为规范(SPEC.md)并重建单元测试套件，确保测试覆盖与规范规则ID一一对应。
要求重构包的单元测试
为包编写SPEC.md规范文档
执行规范驱动的重建任务
npx skills add tldraw/tldraw --skill spec-driven-tests -g -y
用于在tldraw仓库中查找、分配、实现GitHub Issue并创建Pull Request的自动化流程，涵盖从需求理解到代码验证和PR提交的完整开发环节。
用户请求接管Issue
用户提供Issue编号或URL
用户要求实现特定功能
npx skills add tldraw/tldraw --skill take -g -y
辅助将项目迁移至新版 tldraw SDK，自动检测版本并获取变更文档，解决升级后的 TypeScript 错误。
升级 tldraw 包
修复 tldraw 升级后的 TypeScript 错误
用户提及 tldraw 迁移
npx skills add tldraw/tldraw --skill tldraw-migrate -g -y
自动化维护tldraw发布说明，根据PR动态更新next.mdx或在版本发布时归档。通过脚本检测开发或冻结阶段，从main或production分支收集PR并生成文档，确保发布内容与生产环境一致。
需要更新发布说明以反映新PR
新版本发布需归档旧版本文档
npx skills add tldraw/tldraw --skill update-release-notes -g -y
指导如何编写和更新tldraw SDK文档，涵盖目录结构、MDX文件创建规范、内容撰写流程及验证步骤。
创建新的SDK文档文章
更新现有文档
需要文档写作指导
npx skills add tldraw/tldraw --skill write-docs -g -y
指导使用 Playwright 编写 tldraw 项目的端到端测试，涵盖文件结构、固定装置、编辑器交互及 UI 事件测试模式。
创建浏览器测试
测试 UI 交互
添加 E2E 覆盖率
npx skills add tldraw/tldraw --skill write-e2e-tests -g -y
指导如何为 tldraw SDK 编写示例代码，涵盖目录结构、文件命名、README frontmatter 格式及 React 组件标准，确保示例符合规范并正确部署。
创建新的 tldraw SDK 示例
添加 SDK 演示代码
在 apps/examples 中编写示例
npx skills add tldraw/tldraw --skill write-example -g -y
提供 GitHub Issue 的撰写与维护标准，涵盖标题规范、类型定义、标签使用及正文模板。支持自动化清理标题格式并辅助 Agent 生成结构化 Issue，提升仓库问题管理质量。
用户需要创建或优化 GitHub Issue
Agent 需按照特定规范生成 Issue 标题或正文
对现有 Issue 进行标准化清洗和分类
npx skills add tldraw/tldraw --skill write-issue -g -y
提供 tldraw 仓库 PR 标题和描述的编写规范，指导如何为审查者撰写清晰、结构化的描述及符合语义的标题。
需要编写或优化 Pull Request 标题时
需要生成或改进 Pull Request 描述内容时
npx skills add tldraw/tldraw --skill write-pr -g -y
指导如何撰写 tldraw SDK 的发布说明文档，涵盖版本识别、PR 详情获取、文章结构编写及破坏性变更迁移指南生成。
创建新的发布说明
从零起草发布说明
审查发布说明质量
npx skills add tldraw/tldraw --skill write-release-notes -g -y
指导 Agent 撰写 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
make my web page work as an MCP App too
npx skills add tldraw/tldraw --skill convert-web-app -g -y
自动识别本周 dotcom 发布中关键修复或重大功能贡献者，筛选出2-3名核心人员并推送摘要至 Discord #development 频道，旨在精简发布协作范围。
用户询问本周关键发布贡献者
需要向团队同步高风险变更负责人
npx skills add tldraw/tldraw --skill dotcom-release-crew -g -y
