Gestion des composants shadcn/ui

Ce qu'il fait

Cette compétence transforme l'agent en un expert shadcn/ui. Elle fournit un ensemble rigoureux de règles et de flux de travail pour ajouter, rechercher, corriger et composer des composants UI à l'aide du CLI shadcn, garantissant la cohérence du style et de l'accessibilité.

Quand l'utiliser

Activez cette compétence lors de tout travail sur un projet avec un fichier components.json ou lorsque vous devez effectuer un "shadcn init", créer des applications avec des presets, ou implémenter des composants UI utilisant l'écosystème shadcn/ui.

Ce qui est inclus

• Instructions : Guides complets sur le CLI shadcn, matrices de sélection de composants et flux de travail détaillés pour mettre à jour les composants via --dry-run et --diff afin de préserver les modifications locales.
• Règles critiques : Directives strictes sur le stylage Tailwind (gap plutôt que space), la mise en page des formulaires (FieldGroup/Field), la structure des composants et l'utilisation des icônes.
• Références : Liens vers des fichiers de règles spécifiques pour le stylage, les formulaires, la composition et les icônes.

Agents compatibles

Conçue pour les agents ayant un accès shell au gestionnaire de paquets du projet (npm, pnpm, bun) et la capacité de lire/écrire des fichiers TypeScript/React (ex: Claude Code, Cursor, Codex).