# Contrat de parité — Open Design → PWA

## Autorité unique

Projet : `mon-panier-refonte-design-9387` (« Mon Panier — Refonte design »).
Lire `../DesignSystem.md`, `COMPONENTS.md` et `READY.json`. Éditorial est une source historique, pas une cible de rendu concurrente. La PWA actuelle reste l’autorité fonctionnelle.

## Ne pas redessiner au portage

La source unique des tokens est `../design-tokens.css` ; préserver sa relation de chemin avec `tokens.css`. Importer les fichiers partagés vérifiés par empreinte : `tokens.css`, `mon-panier-ui-kit.css`, `layout.css`, `artwork.css`, `refonte.css`, `controls.css`, `mon-panier-ui-kit.js`, `artwork.js`, `controls.js` et les assets recensés. Les composants conservent l’API historique du kit et ajoutent des builders sans logique métier.

Le contrôleur hôte adapte les données et raccorde les handlers existants. Ne pas copier les valeurs CSS à la main dans une deuxième implémentation. Ne pas remplacer un élément fonctionnel sans préserver son id, ses écouteurs, les attributs métier, les états et les conditions d’affichage. Les sélecteurs `mp-ui-*` sont l’espace de noms commun ; inspecter les collisions de cascade avant tout raccordement.

**Ne jamais importer dans le runtime PWA** : `library.js`, `library.css`, `studio.css`, la planche atelier, les données de démonstration et les contrôleurs de preview. L’iframe de l’accueil est une preuve de référence, pas un mode d’intégration PWA.

## Références à figer avant migration

Pour chaque écran ET état couvert, conserver : id de master, données fixture non personnelles, viewport CSS, DPR, OS/navigateur, polices résolues, langue, taille de texte, scroll, état des safe areas et fichier exact. La capture doit venir du rendu Open Design réellement servi, avec toutes les images décodées et les animations arrêtées. Un viewport seul ne définit pas l’environnement.

Tailles minimales : 320×568, 390×844, 430×932. Comparer à taille CSS réelle, sans `transform:scale`. Les container queries des composants répondent à la largeur de leur conteneur, pas à celle de l’atelier.

## Contrôles bloquants

- Ordre, nombre, noms accessibles et destinations des actions inchangés ; parcours aller/retour, annulation et erreurs conservés.
- Mêmes césures, hauteurs de ligne, marges, gouttières, rayons, icônes et cadrages. Comparer les rectangles DOM des en-têtes, contenus, cartes, champs, footers et navigation.
- Mêmes fichiers CSS/JS de présentation et mêmes médias : empreintes exportées = intégrées = servies publiquement. Une empreinte différente exige une explication et une nouvelle référence.
- Aucun asset absent, doublon de logo/flèche, overflow horizontal, sujet essentiel coupé, texte masqué ou contrôle sous la navigation.
- Cibles tactiles au moins 44×44 ; tabulation, focus, Escape et restitution du focus testés. Le focus du dialogue ne doit pas sortir vers l’arrière-plan.
- Tests à texte agrandi, libellés longs et états vide/erreur/chargement/désactivé. Les traductions existantes ne doivent pas disparaître.
- Même géométrie sur un environnement comparable : tolérance de mesure DOM 1 px CSS maximum pour les arrondis ; au-delà, blocage. Ne pas transformer cette tolérance en permission de décaler tous les éléments.
- Diff d’images et planche avant/après. Un score global ne suffit pas : inspecter les zones modifiées. Seules les différences documentées de rasterisation des polices peuvent être tolérées ; jamais une césure, une photo ou un espacement différent.
- L’apparence observée sur Mac ne garantit pas celle de l’iPhone. Le test installé iPhone valide les safe areas réelles, le clavier, les barres Safari, le défilement et l’orientation avant acceptation finale.

## Gate de publication

La revue Open Design n’autorise ni merge ni déploiement. Après accord : migration locale réversible, régressions métier, validation du candidat assemblé, publication autorisée, puis vérification du commit et des empreintes réellement servis par Cloudflare. Vérifier le service worker, le cache d’une installation existante et une installation neuve. Comparer enfin les captures publiques aux masters.

**Terminé signifie : aucun écart de rendu non expliqué et accepté.** Si une contrainte du vrai runtime impose un changement, corriger d’abord le composant commun et son master ; ne pas accumuler des exceptions dans la PWA.

## Limites actuelles

La bibliothèque est une candidate testable. La matrice complète des masters et leur intégration dans la PWA doivent encore être validées. Aucun test sur iPhone réel ni comparaison publique du futur portage n’a été exécuté par la création de cette bibliothèque.