Design System

Le design system NxPay est reparti en 3 packages partages.

Packages

@nex/tokens

Design tokens platform-agnostic : couleurs, typographie, spacing, shadows.

• ZERO dependance — pas d'import react-native
• Build via tsup
• Contient uniquement des valeurs brutes (nombres, strings)

@nex/ui-mobile

Composants React Native pour les apps mobiles.

• Exporte du TypeScript source ("main": "./src/index.ts") — pas de JS compile
• Metro se charge de la transpilation
• peerDeps : react-native, expo
• Contient la fonction normalize() (utilise Dimensions/PixelRatio de react-native)

@nex/ui-web

Theme CSS pour les dashboards Nuxt UI.

• peerDeps : nuxt, @nuxt/ui
• Themes Tailwind CSS v4

Etat de la migration

Le monorepo a ete restructure recemment depuis 4 repos separes. Les packages partages sont nouveaux.

Le code existant dans les apps mobiles utilise encore le design system local (core/design-system/, core/constants/). La migration vers @nex/ui-mobile se fait graduellement.

Regles

Situation	Approche
Modifier un fichier existant	Suivre le pattern existant (imports locaux)
Creer un nouveau fichier	Utiliser @nex/ui-mobile et @nex/tokens
Meme fichier	Ne pas mixer old et new sauf transition necessaire

Contraintes critiques

1. @nex/tokens doit rester platform-agnostic — jamais d'import react-native
2. @nex/ui-mobile exporte du source TS — pas de step de build
3. normalize() vit dans @nex/ui-mobile, pas dans @nex/tokens
4. Les deux APIs coexistent pendant la migration (old local + new shared)