SuperAPI AI 工具集

design-systems-slds-apply

设计与创作

查看项目

更新于 10-15 21:43

技能介绍

用途:帮助智能体在构建任何需要 SLDS 的界面时,找到并正确使用 SLDS v2 的构件。SLDS 是包含数千个构件的 CSS 框架,本技能覆盖蓝图选择、样式钩子、工具类与图标的使用,以及命名约定和基础无障碍提醒。

主要能力:提供构件选择层级(Lightning Base Components > SLDS Blueprints > 样式钩子 > 自定义 CSS);附带搜索脚本用于查找蓝图、钩子、图标和工具类;提供决策指南、深度文档与校验清单。

使用方式:按需读取 references 下的决策指南;用 node scripts/search-hooks.cjs --prefix "<hook-name>"、node scripts/search-utilities.cjs --search "<class-name>"、node scripts/search-blueprints.cjs --search "<pattern>"、node scripts/search-icons.cjs --query "<description>" 验证构件存在后再使用。完成后运行 npx @salesforce-ux/slds-linter@latest lint <component-path> 并对照 checklists.md 检查。

限制:仅针对 SLDS v2,--lwc-* 与 slds---modifier 已弃用;不覆盖设计决策、LWC 机制与完整无障碍合规;配套校验技能仅扫描 .css、.html、.js,对 JSX/TSX 等仅作部分参考。字体大小用 --slds-g-font-scale-,颜色钩子必须带编号,不存在对应钩子时可直接用值并注释。