用途:在 LikeC4 代码库中新增一个元素形状时使用。需要先准备一张形状的视觉参考图,并确定形状名称(单个小写单词,不带连字符或下划线)。流程分阶段进行,不得跳步或调序,检查点需等待用户确认。
主要能力与步骤:阶段0收集需求,阅读 packages/diagram/src/base-primitives/element/ElementShape.tsx 中的 ShapeSvg,判断轮廓类型、装饰元素与最接近的现有形状。阶段1借用最接近的现有形状的 case 临时渲染草图,供用户确认后再继续。阶段2接线:在 styled-system/preset/src/defaults/types.ts 的 ElementShapes 数组中添加名称;更新 packages/language-server/src/like-c4.langium 语法;运行 python3 /path/to/skill/scripts/update_tmgrammars.py YOUR_SHAPE 更新三个 tmLanguage 文件;在 ElementShape.tsx 新增 case 与 ShapeSvgOutline;在 IconRenderer.tsx 添加 @tabler/icons-react 图标映射;在 DrawIO、PlantUML、Mermaid、D2 四个生成器中添加分支;更新 CompletionProvider.spec.ts 与 e2e/src/likec4/views.c4;按需处理 elementNodeData.ts、elementShape.ts、DotPrinter.ts。阶段3依次运行 pnpm generate、pnpm typecheck、pnpm test、pnpm build,typecheck 的 nonexhaustive() 报错可指导补齐遗漏分支。阶段4运行 pnpm changeset 并汇报变更。
限制:形状名称须为单个小写单词;图标须为 @tabler/icons-react 的 ForwardRefExoticComponent,无合适图标时回退 IconRectangularPrism;生成文件由 pnpm generate 重建,不得手改;schemas/likec4-config.schema.json 自动生成。资料未提供具体收费或平台信息。