Initial commit

.claude-plugin/plugin.json

@@ -0,0 +1,18 @@
+{
+  "name": "leapmultix-dev-audit",
+  "description": "Audit pack: accessibility, i18n, security, and governance helpers",
+  "version": "1.0.0",
+  "author": {
+    "name": "Julien LE SAUX",
+    "email": "contact@jls42.org"
+  },
+  "skills": [
+    "./skills"
+  ],
+  "agents": [
+    "./agents"
+  ],
+  "commands": [
+    "./commands"
+  ]
+}

README.md

@@ -0,0 +1,3 @@
+# leapmultix-dev-audit
+
+Audit pack: accessibility, i18n, security, and governance helpers

agents/accessibility-auditor.md

@@ -0,0 +1,53 @@
+---
+name: accessibility-auditor
+description: Auditeur d'accessibilité expert pour la conformité WCAG 2.1 AA. Utiliser de manière proactive après des modifications de l'interface utilisateur ou pour des audits complets.
+tools: Read, Grep, Glob, Bash, WebSearch
+model: inherit
+color: orange
+---
+
+Vous êtes un auditeur d'accessibilité d'élite avec une expertise approfondie de la conformité WCAG 2.1 Niveau AA. Votre mission est d'identifier les obstacles à l'accessibilité et de fournir des stratégies de remédiation exploitables basées sur le code existant du projet `leapmultix`.
+
+## Contexte du projet : leapmultix
+
+- **Public cible** : Enfants de 6 à 12 ans.
+- **Modules Clés** : `js/accessibility.js`, `js/keyboard-navigation.js`, `js/speech.js`.
+- **Normes** : Conformité WCAG 2.1 Niveau AA obligatoire.
+
+## Vos Principes d'Audit Fondamentaux
+
+Au lieu de vous fier à des exemples de code statiques, basez votre audit sur les principes suivants, en utilisant le code vivant du projet comme source de vérité.
+
+### 1. POUR (Perceptible, Utilisable, Compréhensible, Robuste)
+
+- **Perceptible** : L'information est-elle présentée via plusieurs modalités (visuelle, textuelle, auditive) ?
+- **Utilisable** : Tous les composants sont-ils accessibles et contrôlables au clavier ?
+- **Compréhensible** : Les étiquettes, instructions et messages d'erreur sont-ils clairs et simples ?
+- **Robuste** : Le code utilise-t-il du HTML sémantique et des attributs ARIA corrects pour assurer la compatibilité avec les technologies d'assistance ?
+
+### 2. Navigation au Clavier
+
+- **Ordre de Tabulation** : L'ordre de focus est-il logique et intuitif ?
+- **Pièges à Clavier** : L'utilisateur peut-il s'échapper de tous les composants (modales, menus) avec la touche `Escape` ?
+- **Indicateurs de Focus** : Le focus est-il toujours clairement visible ?
+- **Raccourcis** : Les raccourcis sont-ils documentés et ne rentrent-ils pas en conflit avec les commandes du navigateur/lecteur d'écran ?
+
+### 3. Compatibilité avec les Lecteurs d'Écran
+
+- **Étiquettes ARIA** : Les contrôles non-standards ont-ils des `aria-label` descriptifs ? Les icônes sont-elles cachées avec `aria-hidden="true"` ?
+- **Régions Live** : Les mises à jour dynamiques (scores, minuteurs, erreurs) sont-elles annoncées via des régions `aria-live` ?
+- **États** : Les changements d'état (ex: `aria-pressed`, `aria-expanded`, `aria-invalid`) sont-ils correctement gérés ?
+
+## Flux de travail de l'Audit
+
+1.  **Analyse Statique :** Utilisez les outils pour lire et analyser les fichiers pertinents (`html`, `css`, `js`).
+2.  **Exécution de Scripts :** Exécutez les scripts de test d'accessibilité du projet (`npm run audit:accessibility`).
+3.  **Rapport :** Structurez vos conclusions en utilisant le template de rapport défini.
+
+## Format de Sortie Requis (CRITIQUE)
+
+Pour générer ton rapport final, tu DOIS :
+
+1.  Lire le fichier `.claude/skills/report-template-accessibility.md`.
+2.  Utiliser son contenu comme template exact pour ta réponse.
+3.  Remplir chaque section du template avec tes conclusions d'audit. Ne dévie pas de ce format.

agents/i18n-coordinator.md

@@ -0,0 +1,24 @@
+---
+name: i18n-coordinator
+description: Coordinateur expert en internationalisation. À utiliser de manière proactive lors de la modification de traductions ou de l'ajout de texte dans l'interface utilisateur.
+tools: Read, Write, Bash, Grep, Glob
+model: inherit
+---
+
+Vous êtes un coordinateur d'internationalisation expert.
+
+## Contexte du projet : Système i18n de leapmultix
+
+- **Langue de référence :** Français (`i18n/fr.json`).
+- **Scripts clés :** `npm run i18n:compare`, `npm run i18n:unused`, `scripts/cleanup-i18n-keys.cjs`.
+
+## Vos Principes de Coordination
+
+1.  **Synchronisation :** La priorité absolue est de maintenir les fichiers `en.json` et `es.json` parfaitement synchronisés avec `fr.json`. Utilisez `npm run i18n:compare` pour détecter les clés manquantes, supplémentaires, ou les valeurs vides.
+2.  **Qualité :** Ne laissez jamais de valeurs vides (`""`, `null`). Assurez la cohérence des types (chaîne vs. tableau) entre les langues.
+3.  **Nettoyage :** Utilisez `npm run i18n:unused` pour identifier et proposer la suppression des clés obsolètes.
+4.  **Bonnes Pratiques :** Appliquez les conventions de nommage (ex: `namespace.page.element`) et utilisez l'interpolation (`{variable}`) pour les chaînes dynamiques.
+
+## Format de Sortie Requis (CRITIQUE)
+
+Pour générer votre rapport, tu DOIS lire et utiliser le template du fichier `.claude/skills/report-template-i18n.md`.

agents/pwa-expert.md

@@ -0,0 +1,25 @@
+---
+name: pwa-expert
+description: Spécialiste des Progressive Web App pour les service workers, la fonctionnalité hors ligne et la mise en cache. À utiliser pour les modifications de PWA ou les audits avant mise en production.
+tools: Read, Write, Bash, Grep, Glob, WebSearch
+model: inherit
+color: cyan
+---
+
+Vous êtes un spécialiste PWA d'élite.
+
+## Contexte du projet : leapmultix
+
+- **Fichiers Clés :** `sw.js` (Service Worker), `manifest.json`, `cache-updater.js`.
+- **Objectifs :** Scores Lighthouse > 90, fonctionnalité hors ligne robuste, stratégie de cache efficace.
+
+## Vos Principes d'Expertise PWA
+
+1.  **Service Worker & Cache :** La priorité est une stratégie de cache robuste. Vérifiez la gestion des versions du cache, la séparation cache-first (statique) vs network-first (dynamique), et le nettoyage des anciens caches.
+2.  **Fonctionnalité Hors Ligne :** Testez systématiquement le comportement de l'application en mode hors ligne. Assurez-vous que le repli (`offline.html`) fonctionne et que l'expérience utilisateur reste cohérente.
+3.  **Manifeste Web :** Assurez-vous que `manifest.json` est complet et valide, incluant les icônes (notamment masquables), les captures d'écran et les couleurs de thème pour une expérience d'installation optimale.
+4.  **Optimisation Lighthouse :** Auditez l'application avec Lighthouse et concentrez-vous sur les opportunités spécifiques aux PWA pour atteindre les scores cibles.
+
+## Format de Sortie Requis (CRITIQUE)
+
+Pour générer votre rapport d'audit, tu DOIS lire et utiliser le template du fichier `.claude/skills/report-template-pwa.md`.

agents/web-research-specialist.md

@@ -0,0 +1,23 @@
+---
+name: web-research-specialist
+description: Utiliser cet agent pour recueillir des informations sur internet via des recherches web, la récupération de contenu, ou l'interrogation de documentation technique.
+tools: Bash, Glob, Grep, Read, WebFetch, TodoWrite, WebSearch, BashOutput, mcp__context7__resolve-library-id, mcp__context7__get-library-docs, Skill, SlashCommand
+model: inherit
+color: pink
+---
+
+Vous êtes un spécialiste expert en recherche sur le Web.
+
+## Votre Méthodologie de Recherche
+
+1.  **Analyse de la Requête :** Comprendre le besoin d'information fondamental.
+2.  **Stratégie de Sélection d'Outils :** Commencez par `WebSearch` pour les requêtes générales, `WebFetch` pour les URLs spécifiques, et `MCP Context7` pour la documentation technique/de code.
+3.  **Synthèse de l'Information :** Organisez les résultats de manière logique, croisez les sources, et mettez en évidence les informations clés.
+
+## Format de Sortie Requis (CRITIQUE)
+
+Pour générer votre résumé de recherche, vous DEVEZ :
+
+1.  Lire le fichier `.claude/skills/report-template-web-research.md`.
+2.  Utiliser son contenu comme template exact pour votre réponse.
+3.  Remplir chaque section du template avec vos résultats.

commands/audit-config.md

@@ -0,0 +1,40 @@
+---
+description: Audits Skills, Subagents or Slash Commands for compliance with best practices
+---
+
+# Audit de Conformité
+
+Utilisez l'agent-architecte pour auditer la conformité des composants de configuration.
+
+## Arguments
+
+- `skills` - Auditer tous les Skills
+- `agents` ou `subagents` - Auditer tous les Subagents
+- `commands` ou `slash` - Auditer tous les Slash Commands
+- `all` - Auditer tous les composants
+- `[nom-composant]` - Auditer un composant spécifique
+
+## Exemples
+
+```bash
+/audit-config skills          # Audite tous les skills
+/audit-config agents          # Audite tous les agents
+/audit-config all             # Audit complet
+/audit-config accessibility   # Audite le skill accessibility
+```
+
+---
+
+Je vais maintenant utiliser l'agent-architecte pour auditer : **$ARGUMENTS**
+
+Utilise l'agent `agent-architecte` avec le workflow Mode 2 (Audit de Composants Existants) pour :
+
+1. Identifier les composants concernés ($ARGUMENTS)
+2. Auditer chaque composant avec les checklists de `config-compliance-checker`
+3. Générer un rapport consolidé avec :
+   - Scores de conformité
+   - Problèmes classés par criticité (🔴🟡🔵)
+   - Top corrections prioritaires
+   - Diffs proposés pour corrections
+
+Le rapport doit être structuré et exploitable pour améliorer la qualité des configurations.

plugin.lock.json

@@ -0,0 +1,81 @@
+{
+  "$schema": "internal://schemas/plugin.lock.v1.json",
+  "pluginId": "gh:jls42/leapmultix:leapmultix-marketplace/leapmultix-dev-audit",
+  "normalized": {
+    "repo": null,
+    "ref": "refs/tags/v20251128.0",
+    "commit": "7893ad2f3eba7aec37e0ae403496b95dbc3435ca",
+    "treeHash": "34a886dbc59ecb9aadad7d048b3a1ec551e776dfd2d1233875c12f57bf50c76b",
+    "generatedAt": "2025-11-28T10:19:10.158387Z",
+    "toolVersion": "publish_plugins.py@0.2.0"
+  },
+  "origin": {
+    "remote": "git@github.com:zhongweili/42plugin-data.git",
+    "branch": "master",
+    "commit": "aa1497ed0949fd50e99e70d6324a29c5b34f9390",
+    "repoRoot": "/Users/zhongweili/projects/openmind/42plugin-data"
+  },
+  "manifest": {
+    "name": "leapmultix-dev-audit",
+    "description": "Audit pack: accessibility, i18n, security, and governance helpers",
+    "version": "1.0.0"
+  },
+  "content": {
+    "files": [
+      {
+        "path": "README.md",
+        "sha256": "1653f949951d62c9df490eba1a36d099eccaa08e84f20467c71cb8efcefa02f1"
+      },
+      {
+        "path": "agents/web-research-specialist.md",
+        "sha256": "ee848a442eaa47ae540bac57ce4d8b759fdda5a304689a2fa4d28c7b0c229796"
+      },
+      {
+        "path": "agents/accessibility-auditor.md",
+        "sha256": "e1a5ccf3ae2117641d04d158af7c527e9422202cb56500d1fa0dfc9ea911e8e3"
+      },
+      {
+        "path": "agents/pwa-expert.md",
+        "sha256": "b9d046e78edfe801a64edc5f58f2cd3daf15b43a182f89b8edac3f3a3d3779a6"
+      },
+      {
+        "path": "agents/i18n-coordinator.md",
+        "sha256": "c824ef16ddfb007d4ac830e171789ebca91ab4d03e92fb3721798a292fc779c2"
+      },
+      {
+        "path": ".claude-plugin/plugin.json",
+        "sha256": "6bec4612620d2cbc1b130afcf7d16e0794b99c0f5b52487a77bde41e19dcdd47"
+      },
+      {
+        "path": "commands/audit-config.md",
+        "sha256": "129beda55e91e48f1680d8af6babe3a6c857de396ad2316606b68a5180972e43"
+      },
+      {
+        "path": "skills/i18n-sync/SKILL.md",
+        "sha256": "3f4903c3df10d0daf7d26080864207dc42a2bcfbbc05d82338c1d34933fcffbd"
+      },
+      {
+        "path": "skills/auditing-security/SKILL.md",
+        "sha256": "17e064d7336d2e70988cf3ad28133cf2a96fcbd922f1e464519a89df30b997d3"
+      },
+      {
+        "path": "skills/pwa-service-worker/SKILL.md",
+        "sha256": "4756ee8cbe4e310653218976ae893c38ecd2357e335c21c32e2f4d2b21a59a3b"
+      },
+      {
+        "path": "skills/dependency-management/SKILL.md",
+        "sha256": "04dcd20b3e6679803812fe2e3d505c27481c830c37e5a3367eff6824af7b2435"
+      },
+      {
+        "path": "skills/validating-accessibility/SKILL.md",
+        "sha256": "f5d0639750a96fb054d936a3361015464e3bcbca3c29bfa41c76f0a37e5f13cd"
+      }
+    ],
+    "dirSha256": "34a886dbc59ecb9aadad7d048b3a1ec551e776dfd2d1233875c12f57bf50c76b"
+  },
+  "security": {
+    "scannedAt": null,
+    "scannerVersion": null,
+    "flags": []
+  }
+}

skills/auditing-security/SKILL.md

@@ -0,0 +1,214 @@
+---
+name: auditing-security
+description: Audits application security (XSS, CSP, vulnerable dependencies, CORS). Use before releases, after adding dependencies, or modifying security-utils.js
+allowed-tools: Read, Grep, Glob, Bash, WebSearch
+---
+
+# Security Audit
+
+Audite la sécurité de l'application web selon standards OWASP et best practices.
+
+## Table des matières
+
+- [Quand utiliser](#quand-utiliser)
+- [Domaines de sécurité](#domaines-de-sécurité)
+- [Checklist sécurité](#checklist-sécurité)
+- [Outils d'audit](#outils-daudit)
+- [En cas de doute](#en-cas-de-doute)
+
+## Quand utiliser
+
+- Avant chaque release en production
+- Après ajout/mise à jour dépendances npm
+- Modifications de `security-utils.js`
+- Warnings eslint-plugin-security
+- Avant commit manipulant HTML dynamique
+- Ajout de scripts externes (CDN, analytics)
+
+## Domaines de sécurité
+
+### 1. XSS (Cross-Site Scripting) Prevention
+
+**Règle absolue : Utiliser security-utils.js**
+
+Trouve security-utils.js pour voir fonctions disponibles :
+
+- `appendSanitizedHTML()` - Insérer HTML dynamique
+- `createSafeElement()` - Créer élément avec contenu sécurisé
+- `setSafeMessage()` - Définir texte (pas HTML)
+
+**Dangers :**
+
+- `innerHTML` avec user input → XSS
+- Fonctions d'exécution dynamique avec données externes
+- Event handlers depuis user input
+
+**Exceptions sécurisées :**
+
+- `innerHTML = ''` (nettoyage)
+- `getTranslation()` output (contenu interne)
+
+### 2. Content Security Policy (CSP)
+
+**Principe : Meta tag CSP dans index.html**
+
+Examine index.html pour voir configuration CSP actuelle.
+
+**Baseline restrictive :**
+
+- `default-src 'self'`
+- Pas de `'unsafe-eval'` dans script-src
+- `'unsafe-inline'` limité au strict nécessaire
+- `frame-ancestors 'none'` pour prévenir clickjacking
+
+**Scripts externes :**
+
+- Toujours `crossorigin="anonymous"`
+- Integrity hashes pour bibliothèques statiques
+- PAS d'integrity pour analytics (auto-update)
+- Documenter exceptions avec commentaires
+
+### 3. Dependency Vulnerabilities
+
+**Commandes audit :**
+
+```bash
+npm audit                 # Scan vulnérabilités
+npm audit --json         # Rapport détaillé
+npm audit fix            # Fix auto (patch/minor)
+npm audit fix --force    # Fix breaking (attention!)
+```
+
+**Niveaux de sévérité :**
+
+- **Critical/High** : Fix immédiatement avant release
+- **Moderate** : Fix dans sprint suivant
+- **Low** : Monitorer, fix si possible
+
+**Vérifier :**
+
+- Pas de dépendances deprecated
+- Versions à jour (pas trop anciennes)
+- Licences compatibles
+
+### 4. HTTPS et Mixed Content
+
+**Vérifier :**
+
+- HTTPS obligatoire en production
+- Pas de resources HTTP (mixed content)
+- Redirection HTTP → HTTPS
+- HSTS header
+
+Examine configuration serveur ou CDN.
+
+### 5. Secrets et Credentials
+
+**Règles :**
+
+- **JAMAIS** committer secrets (API keys, tokens, passwords)
+- **JAMAIS** stocker passwords en LocalStorage
+- Utiliser variables d'environnement
+- .gitignore pour fichiers sensibles (.env, credentials.json)
+
+**Vérifier :**
+
+- Pas de secrets hardcodés dans code
+- .env dans .gitignore
+- Terraform state pas committé
+
+### 6. LocalStorage Security
+
+**Données sensibles :**
+
+- **JAMAIS** tokens d'authentification
+- **JAMAIS** passwords ou PII
+- OK pour préférences utilisateur non sensibles
+
+**Vérifier :**
+
+- storage.js utilise localStorage correctement
+- Pas de données sensibles stockées
+- Données validées avant lecture
+
+## Checklist sécurité
+
+- [ ] Tous `innerHTML` utilisent `appendSanitizedHTML()` ou justifiés
+- [ ] Pas de fonctions d'exécution dynamique avec données externes
+- [ ] Meta tag CSP présent dans index.html
+- [ ] `crossorigin="anonymous"` sur scripts externes
+- [ ] `npm audit` sans Critical/High
+- [ ] Pas de secrets hardcodés
+- [ ] Pas de données sensibles en LocalStorage
+- [ ] HTTPS en production
+- [ ] Pas de mixed content
+- [ ] Tests sécurité passent
+
+## Outils d'audit
+
+**ESLint Security :**
+
+```bash
+npm run lint  # Inclut eslint-plugin-security
+```
+
+**Dependency Scan :**
+
+```bash
+npm audit
+```
+
+**Lighthouse Security Audit :**
+
+- Lance Chrome DevTools → Lighthouse
+- Vérifie section Security
+- Score doit être 100
+
+**OWASP ZAP (optionnel) :**
+
+- Scan automatisé pour vulnérabilités web
+- Tests de pénétration
+
+## En cas de doute
+
+**Source :** security-utils.js + CLAUDE.md
+
+**Fichiers clés :**
+
+1. `js/security-utils.js` - Fonctions sécurité du projet
+2. `eslint.config.js` - Règles security ESLint
+3. `index.html` - Configuration CSP
+4. `CLAUDE.md` - Guidelines sécurité
+
+**Règles absolues :**
+
+1. TOUJOURS utiliser security-utils.js pour manipulation DOM
+2. TOUJOURS audit avant release (`npm audit`)
+3. JAMAIS `innerHTML` avec user input direct
+4. JAMAIS stocker données sensibles en LocalStorage
+5. JAMAIS scripts externes sans `crossorigin="anonymous"`
+
+**Workflow minimal avant commit :**
+
+```bash
+npm run lint   # ESLint security rules
+npm audit      # Dependency check
+npm test       # Security tests
+```
+
+**Workflow complet avant release :**
+
+```bash
+npm run verify                        # Full quality gate
+npm audit --audit-level=moderate      # Dependency audit
+# Lighthouse security audit
+# Review index.html CSP config
+```
+
+**Red flags (arrêter immédiatement) :**
+
+- Fonctions d'exécution dynamique avec données externes
+- `innerHTML = userInput`
+- Tokens/passwords en LocalStorage
+- npm audit Critical/High
+- Scripts CDN sans crossorigin

skills/dependency-management/SKILL.md

@@ -0,0 +1,159 @@
+---
+name: managing-dependencies
+description: Manages npm dependencies (audit, updates, breaking changes, lockfile). Use before releases, after adding packages, or monthly for maintenance
+allowed-tools: Read, Grep, Glob, Bash
+---
+
+# Gestion des Dépendances
+
+Gère dépendances npm de manière sécurisée (audit, mises à jour, lockfile).
+
+## Table des matières
+
+- [Quand utiliser](#quand-utiliser)
+- [Scripts npm](#scripts-npm)
+- [Workflows essentiels](#workflows-essentiels)
+- [Gestion vulnérabilités](#gestion-vulnérabilités)
+- [Migrations majeures](#migrations-majeures)
+- [Bonnes pratiques](#bonnes-pratiques)
+- [Checklist](#checklist)
+- [En cas de doute](#en-cas-de-doute)
+
+## Quand utiliser
+
+- Avant chaque release production
+- Après ajout nouvelles dépendances
+- Mensuellement maintenance proactive
+- Quand vulnérabilités signalées
+- Migrations versions majeures
+
+## Scripts npm
+
+- `npm audit` - Vue d'ensemble sécurité
+- `npm audit --json` - Rapport détaillé
+- `npm audit fix` - Fix auto (patch/minor)
+- `npm outdated` - Packages à mettre à jour
+- `npm update` - Update patches/minors
+- `npm ls` / `npm ls --depth=0` - Arbre dépendances
+
+## Workflows essentiels
+
+**Audit sécurité :**
+
+- CRITICAL/HIGH → Corriger immédiatement
+- MODERATE → Corriger avant release
+- LOW → Corriger quand possible
+
+**Types mises à jour (SemVer) :**
+
+- Patch (1.0.x) → Bugs, sécurisé
+- Minor (1.x.0) → Features, rétrocompatible
+- Major (x.0.0) → Breaking, nécessite tests
+
+**Stratégie :**
+
+- Patches → Auto si tests passent
+- Minors → Manuel vérification
+- Majors → Manuel migration plan
+
+**Lockfile :**
+
+- Garantit versions exactes
+- Commit toujours avec package.json
+- Désynchronisé → `npm install`
+- Conflit merge → Résoudre + `npm install`
+
+## Gestion vulnérabilités
+
+**Critiques/Hautes :** Fix immédiat, tester, déployer rapidement
+
+**Sans fix :** Package alternatif, fork + patch, monitorer, désactiver si possible
+
+**Packages deprecated :** Chercher alternatives maintenues, planifier migration
+
+## Migrations majeures
+
+**Préparation :**
+
+1. Lire CHANGELOG (breaking changes)
+2. Estimer impact code
+3. Créer branche dédiée
+
+**Exécution :**
+
+1. Update package.json
+2. Adapter code aux breaking changes
+3. Corriger erreurs TS/ESLint
+4. Tests exhaustifs
+
+**Validation :**
+
+- Tests passent
+- Lighthouse score OK
+- Performance stable
+- Pas régressions visuelles
+
+## Bonnes pratiques
+
+**Do's :**
+
+- Commit lockfile toujours
+- Audit hebdomadaire minimum
+- Tests après update
+- Un update à la fois
+- Lire CHANGELOG majors
+- Respecter SemVer
+
+**Don'ts :**
+
+- Pas `npm install --force` (sauf urgence)
+- Pas updates aveugles
+- Pas lockfile .gitignore
+- Pas updates avant release
+- Pas dépendances non maintenues
+
+## Checklist
+
+- [ ] `npm audit` sans CRITICAL/HIGH
+- [ ] `npm outdated` vérifié
+- [ ] Lockfile synchronisé
+- [ ] Tests passent après update
+- [ ] Build OK
+- [ ] Performance stable
+- [ ] Pas deprecated packages
+- [ ] CHANGELOG lu (majors)
+- [ ] Lockfile committé
+
+## En cas de doute
+
+**Règles absolues :**
+
+1. `npm audit` AVANT release obligatoire
+2. Tester APRÈS mise à jour
+3. Jamais ignorer lockfile
+4. CHANGELOG pour majors
+5. CRITICAL/HIGH fix immédiat
+
+**Workflow mensuel :**
+
+```bash
+npm outdated
+npm audit
+npm update
+npm test
+```
+
+**Workflow avant release :**
+
+```bash
+npm audit --audit-level=moderate
+npm outdated
+npm test
+npm run build
+```
+
+**Références :**
+
+- package.json - Versions actuelles
+- package-lock.json - Lockfile
+- npm docs - Documentation

skills/i18n-sync/SKILL.md

@@ -0,0 +1,169 @@
+---
+name: synchronizing-i18n-translations
+description: Verifies translation files synchronization (fr.json, en.json, es.json) and detects missing keys, empty values, and type inconsistencies
+allowed-tools: Read, Grep, Glob, Bash
+---
+
+# I18n Translation Synchronization
+
+Maintient la synchronisation des fichiers de traduction pour toutes les langues supportées.
+
+## Table des matières
+
+- [Quand utiliser](#quand-utiliser)
+- [Langues supportées](#langues-supportées)
+- [Scripts disponibles](#scripts-disponibles)
+- [Workflow principal](#workflow-principal)
+- [Détection automatique](#détection-automatique)
+- [Corriger les erreurs](#corriger-les-erreurs)
+- [Structure des fichiers](#structure-des-fichiers)
+- [Checklist i18n](#checklist-i18n)
+- [En cas de doute](#en-cas-de-doute)
+
+## Quand utiliser
+
+- Ajout de nouveaux textes UI
+- Modification de traductions existantes
+- Avant de committer changements i18n
+- Quand `npm run i18n:compare` signale erreurs
+
+## Langues supportées
+
+- **fr.json** (référence) - Toujours modifier en premier
+- **en.json** (anglais)
+- **es.json** (espagnol)
+
+## Scripts disponibles
+
+```bash
+npm run i18n:compare  # Compare tous les fichiers (PRINCIPAL)
+npm run i18n:verify   # Vérifie cohérence
+npm run i18n:unused   # Détecte clés inutilisées
+```
+
+## Workflow principal
+
+### 1. Vérifier l'état actuel
+
+```bash
+npm run i18n:compare
+```
+
+Si erreurs, lire le rapport détaillé.
+
+### 2. Modifier les traductions
+
+**Règle d'or :** Toujours commencer par `fr.json`
+
+1. Modifie `fr.json` d'abord
+2. Copie la STRUCTURE (pas les valeurs) dans en.json et es.json
+3. Traduis les valeurs
+
+### 3. Vérifier synchronisation
+
+```bash
+npm run i18n:compare
+```
+
+Doit afficher : "Tous les fichiers de traduction sont parfaitement synchronisés !"
+
+### 4. Tester dans l'UI
+
+Lance l'application et teste le sélecteur de langue.
+
+## Détection automatique
+
+Le script `npm run i18n:compare` détecte :
+
+**Clés manquantes :**
+
+- Clés présentes dans fr.json mais absentes dans en.json/es.json
+
+**Clés supplémentaires :**
+
+- Clés présentes dans en.json/es.json mais absentes dans fr.json
+
+**Valeurs vides :**
+
+- `""`, `null`, `undefined`, `[]`
+
+**Incohérences de types :**
+
+- String vs Array (ex: fr.json = "text", en.json = ["array"])
+
+**Format du rapport :**
+
+- Console détaillée
+- JSON exporté dans `docs/translations-comparison-report.json`
+
+## Corriger les erreurs
+
+### Clés manquantes
+
+Ajoute les clés manquantes dans en.json/es.json avec traductions appropriées.
+
+### Clés supplémentaires
+
+Supprime les clés supplémentaires OU ajoute-les dans fr.json si nécessaires.
+
+### Valeurs vides
+
+Remplace les valeurs vides par traductions appropriées.
+
+### Types incohérents
+
+Uniformise le type (soit String partout, soit Array partout).
+
+## Structure des fichiers
+
+**Format JSON :**
+
+```json
+{
+  "key": "value",
+  "nested": {
+    "key": "value"
+  },
+  "array": ["item1", "item2"]
+}
+```
+
+**Dot notation :**
+
+- `key` → "key"
+- `nested.key` → "nested.key"
+- `array` → "array"
+
+Le script aplatit la structure en dot notation pour comparaison.
+
+## Checklist i18n
+
+- [ ] fr.json modifié en premier
+- [ ] Structure copiée dans en.json et es.json
+- [ ] Valeurs traduites correctement
+- [ ] `npm run i18n:compare` passe (100% synchronisé)
+- [ ] Testé dans UI avec sélecteur de langue
+- [ ] Pas de valeurs vides
+- [ ] Types cohérents (String ou Array)
+
+## En cas de doute
+
+**Source :** fr.json + npm scripts
+
+**Règles absolues :**
+
+1. Toujours vérifier avec `npm run i18n:compare`
+2. fr.json est la référence (pas en.json, pas es.json)
+3. Ne jamais committer avec erreurs i18n
+4. Tester dans UI avant commit
+5. Scripts npm détectent TOUS les problèmes
+
+**Workflow minimal :**
+
+```bash
+# Modifier fr.json
+npm run i18n:compare  # Vérifier
+# Copier structure dans en.json, es.json
+# Traduire valeurs
+npm run i18n:compare  # DOIT être OK
+```

skills/pwa-service-worker/SKILL.md

@@ -0,0 +1,94 @@
+---
+name: managing-pwa-service-worker
+description: Manages Service Worker updates securely with cache versioning and offline tests. Use when modifying SW, adding resources, or changing cache strategy
+allowed-tools: Read, Write, Grep, Glob, Bash
+---
+
+# PWA Service Worker Manager
+
+Gère Service Worker pour offline play et cache versioning sécurisé.
+
+## Quand utiliser
+
+- Modification Service Worker
+- Ajout ressources à cacher
+- Changement stratégie cache
+- Tests offline
+- Correction bugs SW
+
+## Scripts essentiels
+
+```bash
+npm run test:pwa-offline    # Tester offline (PRINCIPAL)
+npm run sw:disable          # Désactiver SW
+npm run sw:fix              # Réparer SW
+```
+
+## Versioning et workflow
+
+**SemVer (voir sw.js) :**
+
+- Major : Changements cassants
+- Minor : Ressources ajoutées
+- Patch : Corrections
+
+**Workflow :**
+
+1. **Modifier :** sw.js (version, ressources, handlers)
+2. **Incrémenter :** Version (SemVer)
+3. **Tester :** `npm run test:pwa-offline`
+4. **Vérifier :** DevTools App tab (Offline mode)
+5. **Quality :** format:check, lint, test
+
+## Stratégies de cache
+
+- **Cache First :** Assets (HTML, CSS, JS, images)
+- **Network First :** APIs (données fraîches)
+- **Cache Only :** Assets immuables
+- **Network Only :** Analytics, auth
+
+Trouve stratégie dans sw.js existant.
+
+## Événements SW clés
+
+- **Install :** Créer cache, skipWaiting()
+- **Activate :** Nettoyer anciens caches, clients.claim()
+- **Fetch :** Appliquer stratégie, gérer erreurs
+
+## Debugging
+
+**Chrome DevTools (F12) → Application → Service Workers :**
+
+- Offline mode → Tester navigation
+- caches.keys() en console → Vérifier caches
+
+**Problèmes courants :**
+
+- SW ne s'update → Incrémenter version, skipWaiting() présent
+- Ressources manquantes → Ajouter à liste cache
+- Cache volumineux → Cacher uniquement ressources critiques
+
+## Checklist
+
+- [ ] Version incrémentée (SemVer)
+- [ ] skipWaiting() + clients.claim() présents
+- [ ] Nettoyage anciens caches
+- [ ] Offline test OK (`npm run test:pwa-offline`)
+- [ ] DevTools Offline mode OK
+- [ ] format:check, lint, test passent
+
+## En cas de doute
+
+**Règles absolues :**
+
+1. Incrémenter version TOUJOURS
+2. Tester offline AVANT commit
+3. DevTools Application tab verification
+4. `npm run test:pwa-offline` doit passer
+5. skipWaiting() + clients.claim() essentiels
+
+**Références :**
+
+- `sw.js` - Service Worker principal
+- `manifest.json` - PWA manifest
+- Chrome DevTools Application tab

skills/validating-accessibility/SKILL.md

@@ -0,0 +1,167 @@
+---
+name: validating-accessibility
+description: Validates web accessibility according to WCAG 2.1 AA standards for users with disabilities. Use when modifying UI, adding components, or performing accessibility audits
+allowed-tools: Read, Grep, Glob, Bash, WebSearch
+---
+
+# Validateur d'Accessibilité
+
+Guide la validation et l'amélioration de l'accessibilité web selon WCAG 2.1 niveau AA.
+
+## Table des matières
+
+- [Quand utiliser](#quand-utiliser)
+- [Standards WCAG 2.1 AA](#standards-wcag-21-aa)
+- [Scripts npm disponibles](#scripts-npm-disponibles)
+- [Checklist essentielle](#checklist-essentielle)
+- [Workflow d'audit](#workflow-daudit)
+- [Checklist avant release](#checklist-avant-release)
+- [En cas de doute](#en-cas-de-doute)
+
+## Quand utiliser
+
+- Ajout de composants UI
+- Modification d'interfaces
+- Avant chaque release majeure
+- Audit d'accessibilité complet
+
+## Standards WCAG 2.1 AA
+
+**Quatre principes POUR :**
+
+1. **Perceptible** - Information présentable
+2. **Opérable** - Composants opérables
+3. **Compréhensible** - Info et UI compréhensibles
+4. **Robuste** - Contenu robuste
+
+## Scripts npm disponibles
+
+Trouve et utilise :
+
+- Audit accessibilité complet
+- Audit mobile responsive
+- Vérification contraste
+- Tests automatisés
+
+## Checklist essentielle
+
+### 1. Structure sémantique HTML
+
+- Balises appropriées (`<header>`, `<nav>`, `<main>`, `<footer>`)
+- Hiérarchie titres logique (h1 → h2 → h3)
+- `<button>` pour actions, `<a>` pour navigation
+
+### 2. Navigation clavier
+
+- Éléments interactifs focusables
+- Ordre tabulation logique
+- Focus visible (outline ou custom)
+- Raccourcis clavier sans conflit
+
+### 3. ARIA (Accessible Rich Internet Applications)
+
+**Utiliser quand sémantique HTML insuffisante**
+
+Règles :
+
+- Pas d'ARIA mieux que mauvais ARIA
+- Vérifier support lecteurs d'écran
+- Tester avec vraies technologies assistives
+
+Attributs courants :
+
+- `aria-label`, `aria-labelledby`
+- `aria-describedby`
+- `aria-hidden`
+- `role` (button, dialog, alert, etc.)
+
+### 4. Contraste couleurs
+
+**WCAG 2.1 AA minimum :**
+
+- Texte normal : 4.5:1
+- Texte large (≥18pt ou ≥14pt gras) : 3:1
+- Composants UI : 3:1
+
+Outils : navigateur DevTools, Contrast Checker
+
+### 5. Alternatives textuelles
+
+- Toutes images avec `alt`
+- Images décoratives : `alt=""`
+- Images complexes : description détaillée
+- Vidéos : sous-titres/transcription
+
+### 6. Formulaires
+
+- Labels explicites associés
+- Messages d'erreur clairs
+- Instructions visibles
+- Validation côté client + serveur
+
+### 7. Responsive et zoom
+
+- Support zoom 200% sans perte fonctionnalité
+- Contenu responsive (mobile, tablette, desktop)
+- Touch targets ≥ 44×44 px mobile
+
+## Workflow d'audit
+
+### 1. Tests automatisés
+
+Utilise scripts npm disponibles ou Lighthouse (Chrome DevTools).
+
+### 2. Tests manuels
+
+**Navigation clavier :**
+
+- Tab à travers tous éléments interactifs
+- Enter/Space pour activer
+- Échap pour fermer modales/menus
+
+**Lecteur d'écran :**
+
+- VoiceOver (macOS/iOS)
+- NVDA (Windows)
+- JAWS (Windows)
+
+**Contraste :**
+
+- Vérifie tous textes et icônes
+- Teste modes sombre/clair
+
+### 3. Tests utilisateurs réels
+
+- Personnes avec handicaps
+- Différentes technologies assistives
+- Feedback sur expérience réelle
+
+## Checklist avant release
+
+- [ ] Hiérarchie titres correcte
+- [ ] Navigation clavier complète
+- [ ] Contraste WCAG AA respecté
+- [ ] Alt text sur toutes images
+- [ ] Labels formulaires associés
+- [ ] Focus visible partout
+- [ ] Tests lecteur d'écran passés
+- [ ] Zoom 200% fonctionnel
+- [ ] Touch targets ≥ 44px mobile
+
+## En cas de doute
+
+**Source :** Standards WCAG 2.1 AA officiels
+
+**Règles absolues :**
+
+1. Toujours tester clavier uniquement
+2. Toujours vérifier contraste
+3. Toujours tester lecteur d'écran
+4. Jamais cacher contenu sans `aria-hidden`
+5. Jamais empêcher zoom mobile
+
+**Workflow minimal :**
+
+- Lighthouse audit
+- Navigation clavier complète
+- Test 1 lecteur d'écran minimum