Ouvrir un détail sans perdre sa place

# Applique le guide « Ouvrir un détail sans perdre sa place » dans ton agent

## Objectif
Choisis une page pour une destination partageable, un panneau temporaire pour un détail lié et une modale pour une tâche bornée qui interrompt la page. Préserve le contexte au retour. La position à l’écran ne définit ni modalité, ni clavier, ni historique de navigation.

## Prérequis
- Inspecte le dépôt, la documentation et les conventions existantes.
- Confirme que le besoin correspond au périmètre du guide : Choisis page, panneau latéral ou dialogue et préserve filtres, retour et focus.
- Préserve les décisions correctes déjà en place.

## Étapes du guide
- 1. Choisir la surface selon la tâche — Un dossier client avec historique mérite une page stable. Un aperçu peut rester près de la liste. Confirmer une destruction est une interruption distincte, pas une raison de rendre tous les détails modaux. Un drawer peut être modal ou non modal ; décide si la page reste utilisable. Une sidebar permanente organise la navigation. Ne lui attribue pas la sémantique dialog parce qu’elle occupe un bord.
- 2. Définir le retour — Identifie filtre, tri, page et élément qui définissent la position. Une destination durable doit survivre au rechargement ; une présentation temporaire n’exige pas toujours une URL publique distincte. Ne mets que l’état partageable et non sensible dans la requête URL. Un fragment évite la transmission HTTP habituelle mais reste visible aux scripts et à l’historique. Aucun des deux n’est un coffre à secrets.
- 3. Exemple : consulter une liste filtrée — Depuis la troisième page des tickets ouverts, consulte un dossier puis reviens. Restaure filtre et page, puis le focus sur la ligne si elle existe. Sinon vise le titre de liste ou une commande stable. Dans un aperçu modal, déplace le focus à l’intérieur, garde Tab dedans et ferme avec Échap et rends le focus à la commande d’ouverture si elle existe encore. Dans un panneau non modal, ne piège pas le focus ; garde un chemin clair vers la liste.
- 4. Gérer petit écran et modifications — Une vue côte à côte peut devenir un détail pleine largeur sans perdre son contrat de retour. Garde Fermer ou Retour visible. Ne rends pas deux copies indépendamment focalisables du même formulaire. Si partir perd la saisie, applique la politique de brouillon ou d’abandon. Fermer un panneau n’annule pas automatiquement une opération serveur. Explique les frontières au lieu de lier les données à une transition visuelle.
- 5. Vérifier l’aller-retour — Vérifie ouverture, Retour navigateur, Fermer, rechargement et lien direct. Répète avec ligne d’origine supprimée et clavier seul. Contrôle le contexte restauré, pas seulement la fermeture. Ce guide aide à choisir le comportement. Il ne fournit ni autorisation, ni routeur, ni garantie de scroll sur toutes les plateformes ; documente ces limites.

## Critères d’acceptation — Vérifier dans ton produit
- La surface correspond à la tâche.
- La modalité est explicite.
- Les filtres survivent au retour.
- Le focus a une destination valide.
- Liens directs et rechargement fonctionnent.
- L’état sensible reste hors des URL partagées.

## Garde-fous
- Montre d’abord les changements envisagés avant toute action externe.
- Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite.
- Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu.

## Format de sortie
- Résultat obtenu ou verdict.
- Fichiers ou actions concernés.
- Vérifications exécutées et preuves observables.
- Blocages ou limites restantes.

• Prérequis · Le contexte réel du projet : dépôt, documentation et contraintes existantes

# Ancre le guide dans le projet

## Objectif
Transforme les étapes appliquées en conventions durables du dépôt.

## Contrôles
- Relie chaque décision prise à l’étape du guide qui la justifie.
- Ajoute la checklist aux revues concernées.
- Note les cas hors périmètre pour les guides voisins.

## Garde-fous
- Montre d’abord les changements envisagés avant toute action externe.
- Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite.
- Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu.

## Format de sortie
- Résultat obtenu ou verdict.
- Fichiers ou actions concernés.
- Vérifications exécutées et preuves observables.
- Blocages ou limites restantes.

sha256:ff9d643d16e4d469db815098a3f5e874af84322106dc41c166ff3df7e61c31ad

# Diagnostique une application ratée du guide « Ouvrir un détail sans perdre sa place »

## Symptôme observé
[DÉCRIS ICI LE SYMPTÔME]

## Contrôles observables
- Rejoue les étapes dans l’ordre et note la première qui diverge :
- 1. Choisir la surface selon la tâche — Un dossier client avec historique mérite une page stable. Un aperçu peut rester près de la liste. Confirmer une destruction est une interruption distincte, pas une raison de rendre tous les détails modaux. Un drawer peut être modal ou non modal ; décide si la page reste utilisable. Une sidebar permanente organise la navigation. Ne lui attribue pas la sémantique dialog parce qu’elle occupe un bord.
- 2. Définir le retour — Identifie filtre, tri, page et élément qui définissent la position. Une destination durable doit survivre au rechargement ; une présentation temporaire n’exige pas toujours une URL publique distincte. Ne mets que l’état partageable et non sensible dans la requête URL. Un fragment évite la transmission HTTP habituelle mais reste visible aux scripts et à l’historique. Aucun des deux n’est un coffre à secrets.
- 3. Exemple : consulter une liste filtrée — Depuis la troisième page des tickets ouverts, consulte un dossier puis reviens. Restaure filtre et page, puis le focus sur la ligne si elle existe. Sinon vise le titre de liste ou une commande stable. Dans un aperçu modal, déplace le focus à l’intérieur, garde Tab dedans et ferme avec Échap et rends le focus à la commande d’ouverture si elle existe encore. Dans un panneau non modal, ne piège pas le focus ; garde un chemin clair vers la liste.
- 4. Gérer petit écran et modifications — Une vue côte à côte peut devenir un détail pleine largeur sans perdre son contrat de retour. Garde Fermer ou Retour visible. Ne rends pas deux copies indépendamment focalisables du même formulaire. Si partir perd la saisie, applique la politique de brouillon ou d’abandon. Fermer un panneau n’annule pas automatiquement une opération serveur. Explique les frontières au lieu de lier les données à une transition visuelle.
- 5. Vérifier l’aller-retour — Vérifie ouverture, Retour navigateur, Fermer, rechargement et lien direct. Répète avec ligne d’origine supprimée et clavier seul. Contrôle le contexte restauré, pas seulement la fermeture. Ce guide aide à choisir le comportement. Il ne fournit ni autorisation, ni routeur, ni garantie de scroll sur toutes les plateformes ; documente ces limites.

## Causes possibles
- Une étape a été sautée ou exécutée hors ordre.
- Le besoin réel sort du périmètre du guide.
- Un critère de la checklist n’a jamais été vérifié.

## Corrections bornées
- Reprends uniquement l’étape divergente et ce qui en dépend.
- Documente l’écart si le périmètre du guide ne couvre pas le besoin.

## Vérification finale — Vérifier dans ton produit
- La surface correspond à la tâche.
- La modalité est explicite.
- Les filtres survivent au retour.
- Le focus a une destination valide.
- Liens directs et rechargement fonctionnent.
- L’état sensible reste hors des URL partagées.

## Garde-fous
- Montre d’abord les changements envisagés avant toute action externe.
- Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite.
- Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu.

## Format de sortie
- Résultat obtenu ou verdict.
- Fichiers ou actions concernés.
- Vérifications exécutées et preuves observables.
- Blocages ou limites restantes.

• Prérequis · Le contexte réel du projet : dépôt, documentation et contraintes existantes

# Préviens la prochaine dérive

## Objectif
Fais de la première étape divergente un contrôle explicite du projet.

## Contrôles
- Ajoute un contrôle ciblé sur l’étape qui a divergé.
- Vérifie la checklist sur un second cas réel.
- Documente la limite de périmètre rencontrée.

## Garde-fous
- Montre d’abord les changements envisagés avant toute action externe.
- Ne publie, n’envoie, ne supprime, ne paie et ne modifie aucun état distant sans autorisation explicite.
- Préserve les changements sans rapport et arrête-toi si le périmètre devient ambigu.

## Format de sortie
- Résultat obtenu ou verdict.
- Fichiers ou actions concernés.
- Vérifications exécutées et preuves observables.
- Blocages ou limites restantes.

sha256:beb2d308b44fa7bbf862dc7619100defa3f860053b2a515484c21bda806114c5