jamespot-react-components 1.3.83 → 1.3.84

package/CLAUDE.md

@@ -0,0 +1,62 @@
+# CLAUDE.md — jamespot-react-components
+
+Design system : composants UI réutilisables, Storybook, conformité RGAA. Consommé via le registre par core et extensions.
+
+## Structure
+
+```
+src/
+├── components/
+│   └── JRC{Name}/
+│       ├── JRC{Name}.tsx         # Composant (préfixe JRC)
+│       ├── JRC{Name}.stories.tsx # Story Storybook
+│       ├── JRC{Name}.styles.tsx  # Optionnel : styled-components séparés
+│       └── JRC{Name}.test.tsx    # Optionnel : test Jest unitaire
+├── hooks/                        # useDebounce, useThemeContext, …
+├── styles/
+│   ├── theme.tsx                 # ThemeType + initTheme()
+│   └── styled-components.d.ts    # Augmentation DefaultTheme
+├── translation/
+│   └── lang.json
+└── types.ts                      # Re-exports des props
+```
+
+## Spécificités
+
+- TS flags : `noImplicitOverride`, `noUnusedLocals`, `noUnusedParameters` (TODO : `exactOptionalPropertyTypes`)
+- Couverture : 100% statements + functions (exclus : `Deprecated/`, `utils/utils.misc.ts`)
+- Build : Vite library (ESM + CJS) avec `vite-plugin-css-injected-by-js` — CSS injecté dans le JS, pas de fichier séparé
+
+### Cycle de vie des composants
+
+| Préfixe / dossier | Statut | Obligation tests |
+|-------------------|--------|------------------|
+| `0-RGAA/Category/` | conforme | tests d'interaction + 100% statement |
+| `untested/` | en cours | doit viser conformité |
+| `BETA_` (dans `Beta/`) | expérimental | aucune |
+| `Deprecated_` (dans `Deprecated/`) | à supprimer | aucune |
+
+### Conventions Storybook spécifiques
+
+- **Stories `0-RGAA/`** : `tags: ['testing']` (filtre du test runner) + `parameters: { mode: 'test' }` obligatoires
+- Spy : `fn()` de `storybook/test`, **jamais** `jest.fn()`
+- Setup : `IntlProvider` (locale: 'en') + `JRCThemeProvider`, portail `<div id="react-modal" />` pour modals, `@storybook/addon-a11y`
+
+### Tokens du thème exposés
+
+`ThemeType` est exporté pour augmentation `DefaultTheme` côté apps. La liste exhaustive des tokens (color/space/size/font/zIndex) est dans `ui/styled-components.md`.
+
+### Scripts spécifiques
+
+- `pnpm storybook` — dev port 6006
+- `pnpm test:jest` — Jest unitaires uniquement (`--runInBand`)
+- `pnpm test:storybook` — interaction tests (lance Storybook automatiquement)
+- `pnpm test` — tout (jest + storybook)
+
+## Voir aussi
+
+- `.claude/rules/frontend/_shared/` — règles universelles
+- `.claude/rules/frontend/ui/` — composants, styled-components, accessibilité, navigation, displayer
+- `.claude/rules/frontend/ui/components.md` — réutilisation, registre, composition Raw/Wrapper
+- `.claude/rules/frontend/ui/styled-components.md` — props transientes, theme, tokens
+- `.claude/rules/frontend/ui/accessibility.md` — RGAA, tests Storybook, helpers (SROnly, SkipToContent)