关于 compose-component-design
面向 Jetpack Compose 开发者的组件 API 设计技能，帮助设计可复用、由调用方决定放置和可变内容的组件。提供组件结构、修饰符与插槽决策流程。
主要功能
- 01梳理固定结构与可变区域
- 02指导根布局修饰符放置
- 03选择插槽或语义参数
- 04限制无关 API 改动
- 05按主题路由至参考资料
适用场景
- 01评审组件的插槽与内容参数
- 02设计组件根节点的修饰符 API
- 03确定哪些视觉区域由调用方提供
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/compose-component-design确认已加载。
附带文件references/modifier-layout.mdreferences/slot-apis.md
详细介绍
Compose 组件设计
核心原则
让可复用组件的位置和组合方式由调用方决定：组件负责自身不变的结构，调用方保留因使用场景而异的位置、内容和策略选择。
流程
- 说明所请求的 API 关注点，并将修改限制在该范围内。针对插槽的专项审查，不代表可以顺带修改无关的修饰符、命名或清理代码。
- 说明组件不变的视觉结构，并识别所有可变区域、位置相关事项和策略选择。在全面审查 API 时，先盘点所有渲染区域，包括硬编码文本或图标，再判断哪些是固定的语义内容，哪些会因调用方而异。请求涉及多个关注点时，逐一报告；不要在发现第一个合理的修饰符或插槽问题后就停止。
- 如果请求涉及根布局位置，或属于全面的组件 API 设计，应接受调用方传入的修饰符并将其应用到组件根节点，除非明确的 API 边界表明应采用其他位置。对于有条件的根节点，应将修饰符应用于每个分支的根节点，而不是将各分支合并到一个包装器中。
- 对于由调用方控制且不受约束的视觉区域，使用插槽表示，不要不断增加基础内容参数或布尔形状标记。语义约束和设计系统约束应保留为基础参数。
- 简单的条件结构应直接内联；仅提取具有清晰一致契约的可复用结构。
- 修改公开签名之前，先阅读下方相关的专项参考资料。
- 进行审查时，应明确判断每个请求涉及的可变视觉区域应保留为语义基础参数，还是改为调用方插槽。仅指出内容方面的限制，并不能代替对 API 的判断。如果现有 API 已满足请求的关注点，就不做修改并结束。否则，应确保调用方能够设置组件位置、提供可变内容，并清楚了解各方的职责，且没有隐藏开关。
主题索引
| 信号 | 阅读 |
|---|---|
| 修饰符参数、根布局位置、修饰符顺序或条件布局包装器 | 修饰符与布局 |
| 调用方控制的可变视觉区域、可选内容、基础内容参数或布尔形状标记 | 插槽 API |
| 动画属于公开组件契约的一部分 | Compose 动画 |
| 设计组件时状态归属发生变化 | Compose 状态与副作用 |
| 需要语义或截图覆盖 | Compose UI 测试模式 |
评论
支持 Markdown