component-rules 用于规范 Claude 在 Figma 中构建 UI 的方式，是 figma-generate-design 的补充规则；涉及视觉属性绑定时应改用 figma-style-binding。
用途：在创建卡片、导航、区块或组件等任何 UI 元素时触发，确保构建过程遵循统一规则。
主要能力与规则：
- 库优先层级：构建前按顺序解析组件来源——先 search_design_system，再 importComponentByKeyAsync 并 createInstance()；其次扫描本地文件并 createInstance()；仅当无匹配时才从零构建。不得重建设计系统已提供的 Button、Input、Checkbox、Toggle、Badge、Tag、Avatar、Icon、Tab、Breadcrumb、Toast、Alert、Spinner 等基础组件。
- Auto Layout：每个容器必须使用 Auto Layout，且属性设置顺序有要求——先设置 layoutMode（VERTICAL 或 HORIZONTAL），在 appendChild 之后设置 layoutSizingHorizontal / layoutSizingVertical，并在任何 setBoundVariable 调用之前设置 layoutMode。
- 节点命名：每个节点都要用带斜杠层级的语义化名称，不得保留默认名，例如 Card / Container、Card / Title、Nav / Link Group、Button / Primary。
- 增量构建：每次 use_figma 调用只构建一个区块，每步后通过截图验证，并返回所有创建或修改的节点 ID。
使用方式：作为 Claude 技能规则加载，在 Figma 相关 UI 构建任务中自动生效。
限制：资料未提供安装命令、收费、价格、平台支持范围及具体效果数据。