# GAB-143 · InteractiveTimelineExplorer — « Frise interactive exploratoire »

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

## Pack (structure officielle par-GAB)
```
GAB-143/
  renderer.html            ← moteur frise interactive (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
```

## Champs requis (instance, à plat)
`gab_id` · `timeline_id` · `title` · `events[]{date, title, detail}`

Optionnels : `instruction`, `primary_cta{label, action}`.

## Ce qui vient du JSON vs HTML
- **JSON** : titre de la frise, instruction affichée, chaque événement (date, titre, détail), libellé du bouton CTA.
- **HTML** : moteur accordéon, ligne de frise verticale, styles DS V2, logique open/close, accessibilité clavier.

## Archétype : frise exploratoire accordéon
Chaque événement est rendu comme un `<button>` avec `aria-expanded`. Un clic bascule la classe `.open` qui révèle le détail via transition CSS (max-height + opacity). Aucun événement n'est visible à l'état initial.

## Garde-fous (child_safety)
- **Anti-invention** : aucun événement hardcodé. Si `events` est vide → BLOCKED propre.
- **Ordre chronologique** : les événements sont affichés dans l'ordre du tableau JSON ; c'est à l'auteur de l'instance de les ordonner.
- **BLOCKED** si `events` absent/vide, `title` absent, ou `timeline_id` absent.
- **Accessibilité** : `aria-expanded` mis à jour au clic, navigation clavier (Entrée/Espace).

## QA à vérifier
1. Modifier un `title`/`detail`/`date` dans le JSON → rendu change sans toucher au HTML (critère d'or).
2. `events: []` → BLOCKED propre affiché.
3. `title` absent → BLOCKED propre affiché.
4. Clic sur un événement → classe `.open` toggle, détail visible.
5. Clic à nouveau → ferme l'accordéon.
6. Bouton CTA → feedback action affiché.
7. Responsive 375/768/1024 : frise lisible, pas de débordement.

## Références externes / do_not_use_when
- Frise statique à consulter → GAB-078
- Remise en ordre chronologique → GAB-107 / GAB-124
- Événements sans dates → ne pas utiliser GAB-143

## Source
`INDEX-300-interactivelearning-GAB-141-145-PLAYABLE.html` (stage `data-tpl="143"`, styles `.tle-*`).
