* feat: add SLDS applying and auditing quality skills Two new skills for SLDS v2 compliance: - applying-slds: guides artifact selection, styling hooks, utilities, icons - auditing-slds-quality: scored quality audit with linter + static analysis Made-with: Cursor * refactor: rename auditing-slds-quality skill to validating-slds Renames the skill directory and updates all references in applying-slds/SKILL.md and applying-slds/checklists.md. Made-with: Cursor * fix: improve accuracy and add manual review gate across SLDS skills Correct hook families, badge modifiers, and severity levels; add a manual review gate to validating-slds so automated grades alone cannot declare production readiness; make analyze-quality.cjs portable with explicit --hooks-index flag; remove dead parseYaml code; add version field to all three skill frontmatters. Made-with: Cursor * chore: retrigger CI Made-with: Cursor * fix: quote YAML descriptions and improve color hook disambiguation - Quote description frontmatter in all three skills for valid YAML (inner double quotes now escaped) - Strengthen Step 4 directive: MUST read color-hooks guide before choosing a hook — linter suggestions are unranked - Add surface vs surface-container disambiguation table - Add accent hook context table and state progression - Add standalone-component exception for surface classification - Add modal background example to examples.md - Remove redundant brand-button example (covered by new context table) Made-with: Cursor |
||
|---|---|---|
| .. | ||
| blueprints/components | ||
| hooks-index.json | ||
| icon-metadata.json | ||
| README.md | ||
| utilities-index.json | ||
SLDS Metadata
Structured data for all SLDS artifacts. Use the search scripts in ../scripts/ or grep directly.
Source: packages/metadata/
Files
blueprints/components/*.yaml (85 files)
One YAML file per SLDS blueprint component. Each contains:
name,description,categoryslds_classes.root-- the BEM root class (e.g.,slds-modal)slds_classes.elements[]-- child element classes with purposeslds_classes.modifiers[]-- variant modifier classes with usage guidanceslds_classes.states[]-- state classes (active, disabled, open, etc.)accessibility-- required ARIA roles, attributes, keyboard interactionsexample_html-- reference markup
Search: node ../scripts/search-blueprints.js --search "dialog"
Direct grep: grep -rl "category: Overlay" blueprints/components/
hooks-index.json (523 hooks)
All SLDS styling hooks with computed values and CSS property mappings.
Each hook entry:
{
"token": "--slds-g-color-accent-1",
"category": "color",
"value": "#0176d3",
"properties": ["background-color", "color", "border-color", "fill"]
}
Categories: color (325), font (57), spacing (48), shadow (44), sizing (27), duration (8), radius (6), ratio (5), fontFamily (3)
Search: node ../scripts/search-hooks.js --category "color"
Direct grep: grep -i "accent" hooks-index.json
icon-metadata.json (1,732 icons)
All SLDS icons with synonyms for semantic search across 5 categories.
Each icon entry:
{
"displayName": "add_contact",
"category": "action",
"description": "Represents adding a new contact...",
"synonyms": ["add", "user", "contact", "create", "new", "person", "plus"]
}
Categories: action, custom, doctype, standard, utility
Search: node ../scripts/search-icons.js --query "save button"
Direct grep: grep -B1 -A5 '"save"' icon-metadata.json
utilities-index.json (1,147 utilities)
All SLDS utility classes organized by category with CSS rules.
Each utility entry:
{
"class": "slds-m-bottom_small",
"css": { "margin-bottom": "0.75rem" },
"category": "margin"
}
27 categories: grid (80), margin (119), padding (120), sizing (613), color (48), text (24), and more.
Search: node ../scripts/search-utilities.js --category "grid"
Direct grep: grep -i "slds-grid" utilities-index.json