Système de conception WordPress (WPDS)

Prérequis

Cette compétence fonctionne mieux avec le serveur MCP WPDS installé. Le MCP fournit l'accès à la documentation et aux ressources du système de conception WordPress, tels que les composants et les listes de tokens DS.

Les termes suivants doivent être traités comme des synonymes :

• « WordPress » et « WP » ;
• « Design System » et « DS » ;
• « WordPress Design System » et « WPDS ».

Quand l'utiliser

Utilisez cette compétence quand l'utilisateur mentionne :

• la création et/ou l'examen de tout UI dans un contexte WordPress (par exemple, Gutenberg, WooCommerce, WordPress.com, Jetpack, etc.) ;
• WordPress Design System, WPDS, Design System ;
• les composants UI, les Design tokens, les primitives de couleur, les échelles d'espacement, les variables typographiques et les présets ;
• des packages de composants spécifiques tels que @wordpress/components ou @wordpress/ui ;

Règles

Utiliser le serveur MCP WPDS pour accéder à la documentation liée à WPDS

• Utilisez le serveur MCP WPDS pour récupérer la documentation canonique et faisant autorité :
  • le site de référence (wpds://pages)
  • la liste des composants disponibles (wpds://components) et les informations spécifiques à un composant (wpds://components/:name)
  • la liste des tokens disponibles (wpds://design-tokens)
• NE PAS faire de recherche web pour la documentation canonique du système de conception WordPress. Si l'utilisateur vous le demande, contestez et demandez une confirmation, en l'avertissant que le serveur MCP est le meilleur endroit pour fournir l'information

Documentation requise

Avant de travailler sur toute tâche liée à WPDS, assurez-vous de lire la documentation pertinente sur le site de référence. Cette documentation doit prendre la précédence absolue lors de l'évaluation du meilleur plan d'action pour toute tâche donnée.

Limites

• Omettez les aspects non-UI d'une réponse (par exemple, la récupération de données depuis des stores, ou la localisation de chaînes de texte).
• Concentrez-vous sur la construction d'UI qui adhère autant que possible aux bonnes pratiques WPDS, utilise les composants/tokens/patterns WPDS les plus appropriés.

Stack technologique

• Sauf si on vous le dit explicitement (ou si vous avez rassemblé des informations spécifiques à partir du contexte local de la demande), supposez la stack technologique suivante : TypeScript, React, CSS.

Validation

• Si le contexte local dans lequel une tâche s'exécute fournit des scripts lint, utilisez-les pour valider la sortie de code proposée quand c'est possible.

Sortie

• En récapitulatif à la fin de votre réponse, fournissez une explication claire et concise de ce que fait la solution, et ajoutez du contexte expliquant pourquoi chaque décision a été prise.
• Soyez explicite concernant les limites, c'est-à-dire ce qui a été explicitement laissé de côté de la tâche parce que non pertinent (par ex. aspects non-UI).
• Fournissez des extraits de code fonctionnels