# GAB-033 · ProgressSummaryBlock — « Résumé de progression »

**Archétype / renderer_key :** `text_cta` (cartographie) · **module :** EdTechPlayKit
**Critère validé :** changer le JSON change le rendu sans modifier le HTML. check.py 12/12.

## Pack (structure officielle par-GAB)
```
GAB-033/
  renderer.html            ← moteur résumé progression (ne pas modifier par instance)
  instance.example.json    ← SOURCE DE VÉRITÉ (contenu réel, à plat)
  schema.contract.json     ← contrat de validation
  README-contract.md       ← ce fichier
```

## Archétype

**ProgressSummaryBlock** affiche un résumé visuel de progression en fin de mini-série, session ou chapitre :
- Un anneau SVG animé affichant le pourcentage complété (de 0 à `progress`).
- Une liste d'étapes ordonnées avec statuts `done` / `current` / `pending` (points colorés).
- Un bouton « Rejouer l'animation » dont le libellé vient du JSON.

## Champs requis (instance, à plat)
`gab_id` · `progress_summary_id` · `title` · `progress` (number 0–100) · `steps[]{label, status}`

Optionnels : `current_index`, `total_steps`, `replay_label`.

## Ce qui vient du JSON vs HTML

| Source | Éléments |
|--------|----------|
| **JSON** | Titre affiché, valeur d'animation de l'anneau (`progress`), labels et statuts de chaque étape, libellé du bouton replay. |
| **HTML** | Layout anneau SVG, code d'animation (setInterval), couleurs DS V2, classes de statut dot, structure responsive. |

## Garde-fous (child_safety / anti-invention)

- **Aucun contenu pédagogique en dur** dans le renderer — titre, étapes et pourcentage viennent exclusivement de l'instance.
- **BLOCKED** si `title` absent, `progress` non numérique, ou `steps` vide.
- Statuts des étapes : seuls `done`, `current`, `pending` sont reconnus — tout autre statut est rendu comme `pending` (point neutre).
- Animation replay idempotente : bouton rejoue depuis 0% sans modifier l'état de l'instance.

## QA à vérifier

1. Modifier `title` → titre dans hero et carte change sans toucher au HTML.
2. Modifier `progress` → anneau anime jusqu'à la nouvelle valeur.
3. Modifier un `status` dans `steps` → couleur du point change immédiatement.
4. `steps: []` → BLOCKED propre.
5. Bouton replay → animation recommence depuis 0%.
6. `ENGINE.init(customInstance)` → rendu piloté par l'instance externe.
7. Responsive 375/768/1024 : aucun overflow, flex-direction column sur mobile.

## Source
`INDEX-300-playkit-GAB-031-035-PLAYABLE.html` — stage `data-tpl="33"`, handler `progAnimate()`, CSS classes `.prog-card`, `.prog-ring`, `.prog-steps`, `.prog-step`.

## Références externes (external_refs / dependencies)

- **ENG-004** : header progression en session (use_case différent — ne pas substituer GAB-033).
- **PathMap** : parcours long complet (GAB-033 = mini-série uniquement).
- **ENG-008** : checkpoint ponctuel (GAB-033 = résumé fin, pas checkpoint ponctuel).