humalis 1.0.4 → 1.2.0

package/dist/analyse/accessibilite.js

@@ -5,7 +5,7 @@ const SEUIL_NORMAL = 4.5;
 const SEUIL_GRAND = 3;
 const motsVides = new Set(['image', 'photo']);
 /** Vérifications qui demandent une intention explicite de l'auteur. */
-export function verifierAccessibilite(page, theme) {
+export function verifierAccessibilite(page, theme, modes = ['clair', 'sombre']) {
     const diagnostics = [];
     const signaler = (gravite, message, ligne) => diagnostics.push({ gravite, categorie: 'accessibilite', message, ligne });
     let titres = 0;
@@ -69,7 +69,7 @@ export function verifierAccessibilite(page, theme) {
                     niveauPrecedent = niveau;
                 }
                 if (['texte', 'titre', 'bouton', 'lien', 'champ'].includes(element.element))
-                    verifierContraste(element, theme, signaler);
+                    verifierContraste(element, theme, modes, signaler);
             }
             else if (instruction.type === 'Formulaire')
                 parcours(instruction.corps, new Map());
@@ -83,8 +83,14 @@ export function verifierAccessibilite(page, theme) {
             else if (instruction.type === 'Bloc' || instruction.type === 'Boucle')
                 parcours(instruction.corps, champs);
             else if (instruction.type === 'Condition') {
+                // Les deux branches s'excluent (« si langue est anglais » / « sinon ») : un titre dans
+                // chacune ne fait qu'un titre affiché. On garde le plus grand des deux comptes.
+                const avant = titres;
                 parcours(instruction.alors, champs);
+                const apresAlors = titres;
+                titres = avant;
                 parcours(instruction.sinon, champs);
+                titres = Math.max(titres, apresAlors);
             }
         }
     };
@@ -93,18 +99,20 @@ export function verifierAccessibilite(page, theme) {
         if (!clics.has(survol.cible))
             signaler('avertissement', 'ce survol n’a pas d’action au clic : le clavier et les écrans tactiles ne peuvent pas le déclencher.', survol.ligne);
     }
-    if (titres === 0)
+    // Une page qui montre ses sous-pages (« sous page ») laisse le titre principal à chacune d'elles.
+    const montreSesSousPages = JSON.stringify(page.corps).includes('"type":"SousPage"');
+    if (titres === 0 && !montreSesSousPages)
         signaler('avertissement', `la page « ${page.nom} » n'a pas de titre principal. Ajoutez « titre "…" ».`, page.ligne);
     return diagnostics;
 }
-function verifierContraste(element, theme, signaler) {
+function verifierContraste(element, theme, modes, signaler) {
     const valeur = (nom) => element.styles.find((s) => s.propriete === nom)?.valeur;
     const couleur = valeur('couleur') ?? valeur('texte');
     const fond = valeur('fond');
     if (!couleur && !fond)
         return;
     const seuil = valeur('taille') === 'grande' ? SEUIL_GRAND : SEUIL_NORMAL;
-    for (const mode of ['clair', 'sombre']) {
+    for (const mode of modes) {
         const hex = (nom) => theme.get(nom)?.[mode] ?? COULEURS_CSS[nom]?.[mode];
         const fondHex = fond ? hex(fond) : FOND_PAGE[mode];
         const encreHex = couleur ? hex(couleur) : fondHex ? encreSur(fondHex) : undefined;

package/dist/analyse/analyse.js

@@ -7,6 +7,7 @@ import { ElementsPage } from './elements.js';
 import { optionCanonique, erreurSurElement, OPTIONS } from './styles.js';
 import { contraste, FOND_PAGE } from './couleurs.js';
 import { verifierAccessibilite } from './accessibilite.js';
+import { niveauxDesSousTitres } from './niveaux.js';
 import { verifierElementEcran, verifierBlocEcran } from './ecran.js';
 import { verifierChoixFichier, verifierEnvoiFichier, typeFichierChoisi, aUnApercu, recenserFichiers } from './fichiers.js';
 import { verifierCarte, verifierMarqueur } from './carte.js';
@@ -44,6 +45,16 @@ const gardeDe = (test) => {
  * modifie pas l'arbre et collecte toutes les erreurs au lieu de
  * s'arrêter à la première.
  */
+/**
+ * Les modes que l'application peut montrer. « mode clair » ou « mode sombre » n'en laisse qu'un,
+ * sauf si un bouton change le thème (« changer theme par … », « basculer theme »).
+ */
+function modesVus(programme) {
+    const mode = programme.theme?.mode?.valeur;
+    if (mode !== 'clair' && mode !== 'sombre')
+        return ['clair', 'sombre'];
+    return JSON.stringify(programme).includes('"action":"changerTheme"') ? ['clair', 'sombre'] : [mode];
+}
 export function analyserSens(programme) {
     const resultat = {
         diagnostics: [],
@@ -72,11 +83,17 @@ export function analyserSens(programme) {
         fenetres: new Map(),
         blocsNommes: new Map(),
         valeursTheme: new Map((programme.theme?.couleurs ?? []).map((c) => [c.nom, { clair: c.clair, sombre: c.sombre ?? c.clair }])),
+        modesVus: modesVus(programme),
         langues: { langues: [], traductions: new Map() },
         referencesLangue: new Map(),
         changementsLangue: new Map(),
     };
     // Les langues d'abord : avec elles, « langue » et « anglais » sont des valeurs intégrées.
+    // Le niveau automatique des sous-titres, avant tout ce qui lit ces niveaux.
+    for (const corps of [...programme.pages.map((p) => p.corps), programme.entete?.corps, programme.pied?.corps, ...programme.composants.map((c) => c.corps)]) {
+        if (corps)
+            niveauxDesSousTitres(corps);
+    }
     resultat.langues = analyserLangues(programme, resultat.diagnostics);
     languesActives.clear();
     for (const langue of resultat.langues.langues)
@@ -160,7 +177,7 @@ export function analyserSens(programme) {
     }
     for (const page of programme.pages) {
         new AnalysePage(page, nomsPages, resultat, classes, partages, composants, [], liens, fonctions).analyser();
-        resultat.diagnostics.push(...verifierAccessibilite(page, resultat.valeursTheme));
+        resultat.diagnostics.push(...verifierAccessibilite(page, resultat.valeursTheme, resultat.modesVus));
         for (const [sans, genre] of [[page.sansEntete, 'entete'], [page.sansPied, 'pied']]) {
             if (sans && !programme[genre]) {
                 resultat.diagnostics.push({
@@ -614,6 +631,24 @@ class AnalysePage {
             case 'Bloc':
                 this.blocMiseEnPage(instruction, contexte, place);
                 return;
+            case 'CodeDocumentation':
+                if (contexte === 'evenement')
+                    this.erreur('un bloc de code se place dans une page.', instruction.ligne);
+                return;
+            case 'TableauDocumentation':
+                if (!instruction.legende)
+                    this.erreur('un tableau attend une légende entre guillemets : tableau "Commandes" :', instruction.ligne);
+                if (instruction.colonnes.length === 0)
+                    this.erreur('un tableau attend une ligne « colonnes ».', instruction.ligne);
+                for (const rangee of instruction.rangees) {
+                    if (instruction.colonnes.length > 0 && rangee.length !== instruction.colonnes.length)
+                        this.erreur(`la rangée a ${rangee.length} cellules, mais le tableau a ${instruction.colonnes.length} colonnes.`, rangee[0]?.ligne ?? instruction.ligne);
+                }
+                if (instruction.legende)
+                    this.typeDe(instruction.legende);
+                instruction.colonnes.forEach((cellule) => this.typeDe(cellule));
+                instruction.rangees.flat().forEach((cellule) => this.typeDe(cellule));
+                return;
             case 'Action':
                 this.action(instruction, contexte);
                 if (instruction.message) {
@@ -1039,6 +1074,7 @@ class AnalysePage {
                 const valeur = this.resultat.valeursTheme.get(option.valeur) ?? COULEURS_CSS[option.valeur];
                 return { nom: option.valeur, clair: valeur.clair, sombre: valeur.sombre };
             },
+            modes: this.resultat.modesVus,
         });
     }
     /** Un texte dans une couleur du thème qui se verrait mal sur le fond de la page (contraste inférieur à 3:1). */
@@ -1048,7 +1084,7 @@ class AnalysePage {
         const couleur = this.resultat.valeursTheme.get(valeur);
         if (!couleur)
             return;
-        for (const mode of ['clair', 'sombre']) {
+        for (const mode of this.resultat.modesVus) {
             const rapport = contraste(couleur[mode], FOND_PAGE[mode]);
             if (rapport < 3) {
                 this.avertissement(`la couleur « ${valeur} » (mode ${mode}) se voit mal sur le fond de la page (contraste ${rapport.toFixed(1).replace('.', ',')} pour 1, il en faut au moins 3). Choisissez une couleur plus ${mode === 'clair' ? 'foncée' : 'claire'} pour ce mode.`, ligne);
@@ -1100,7 +1136,7 @@ class AnalysePage {
                 return;
             case 'changerTheme': {
                 const valeur = texteLitteral(action.arguments[0]);
-                if (valeur === undefined || !['clair', 'sombre', 'automatique'].includes(valeur)) {
+                if (valeur === undefined || !['clair', 'sombre', 'automatique', 'bascule'].includes(valeur)) {
                     this.erreur(`« changer theme par … » prend clair, sombre ou automatique (ici : « ${valeur ?? '?'} »).`, action.ligne);
                 }
                 return;
@@ -1364,6 +1400,9 @@ class AnalysePage {
     typeDe(expression) {
         switch (expression.type) {
             case 'Chaine':
+                if ([expression.parties, ...(expression.versions?.map((v) => v.parties) ?? [])].some((parties) => parties.some((p) => p.type === 'accent')) && !['titre', 'soustitre', 'texte'].includes(this.elementEnCours ?? '')) {
+                    this.erreur('accent s’emploie seulement dans un titre, un soustitre ou un texte.', expression.ligne);
+                }
                 this.interpolations(expression);
                 this.versionsLues(expression);
                 return TEXTE;
@@ -1464,6 +1503,7 @@ class AnalysePage {
                 this.usagesEtat.push({ nom: expression.variable, ligne: expression.ligne, mot: 'erreur de' });
                 return TEXTE;
             case 'MouvementReduit':
+            case 'ThemeSombre':
                 return BOOLEEN;
             case 'EtatUtilisateur':
                 this.litLaSession = true;

package/dist/analyse/langues.js

@@ -55,8 +55,18 @@ function textesDesOptions(instruction, vus) {
             vus.push(serie.texteNom ? plat(serie.texteNom) : litteralDe(serie.nom, serie.ligne));
     }
 }
-/** Les textes que la personne voit : contenus d'éléments, titres de blocs, messages, aperçu. */
-function textesVisibles(instructions, vus) {
+/** « si langue est anglais : » (ou « n'est pas ») : ses deux branches sont chacune écrites dans une seule langue. */
+const testeLaLangue = (instruction) => {
+    if (instruction.type !== 'Condition')
+        return false;
+    const test = instruction.test;
+    return test.type === 'Comparaison' && test.gauche.type === 'Reference' && test.gauche.nom === 'langue' && test.droite?.type === 'Reference' && langueDuMot(test.droite.nom) !== undefined;
+};
+/**
+ * Les textes que la personne voit : contenus d'éléments, titres de blocs, messages, aperçu.
+ * Ceux d'une branche « si langue est … » vont aussi dans `uneLangue` : ils n'ont pas à être traduits.
+ */
+function textesVisibles(instructions, vus, uneLangue) {
     const ajouter = (e) => {
         if (e?.type === 'Chaine')
             vus.push(e);
@@ -86,12 +96,21 @@ function textesVisibles(instructions, vus) {
             ajouter(instruction.titre);
         for (const cle of ['corps', 'alors', 'sinon']) {
             const enfants = instruction[cle];
-            if (Array.isArray(enfants))
-                textesVisibles(enfants, vus);
+            if (!Array.isArray(enfants))
+                continue;
+            if (cle !== 'corps' && uneLangue && testeLaLangue(instruction)) {
+                const dedans = [];
+                textesVisibles(enfants, dedans, uneLangue);
+                for (const texte of dedans)
+                    uneLangue.add(texte);
+                vus.push(...dedans);
+            }
+            else
+                textesVisibles(enfants, vus, uneLangue);
         }
         if (instruction.type === 'Selon')
             for (const cas of instruction.cas)
-                textesVisibles(cas.corps, vus);
+                textesVisibles(cas.corps, vus, uneLangue);
     }
 }
 /** Tous les littéraux de texte d'un arbre, où qu'ils soient. */
@@ -235,17 +254,18 @@ export function analyserLangues(programme, diagnostics) {
     }
     // Les textes visibles : ceux des pages, des options et du bloc « site ».
     const visibles = [];
+    const uneLangue = new Set();
     const pages = programme.pages;
     for (const page of pages) {
-        textesVisibles(page.corps, visibles);
+        textesVisibles(page.corps, visibles, uneLangue);
         if (page.apercu)
-            textesVisibles([page.apercu], visibles);
+            textesVisibles([page.apercu], visibles, uneLangue);
     }
     for (const disposition of [programme.entete, programme.pied])
         if (disposition)
-            textesVisibles(disposition.corps, visibles);
+            textesVisibles(disposition.corps, visibles, uneLangue);
     for (const composant of programme.composants)
-        textesVisibles(composant.corps, visibles);
+        textesVisibles(composant.corps, visibles, uneLangue);
     for (const cle of ['nom', 'description']) {
         const valeur = programme.site?.[cle];
         if (valeur !== undefined)
@@ -298,7 +318,7 @@ export function analyserLangues(programme, diagnostics) {
     }
     // Les textes visibles sans version dans une langue déclarée.
     for (const texte of visibles) {
-        if (!aDesLettres(texte.parties))
+        if (!aDesLettres(texte.parties) || uneLangue.has(texte) || texte.sansTraduction)
             continue;
         const cle = texteSource(texte.parties);
         for (const langue of autres) {

package/dist/analyse/medias.js

@@ -27,6 +27,9 @@ export function verifierMouvement(styles, genre, dansFormulaire, ligne, s) {
         s.erreur('« au defilement » suit le nom d’une animation : « animation montee au defilement ».', ligne);
         return false;
     }
+    if (animation.cascade && !['bloc', 'section', 'ligne', 'colonne', 'grille'].includes(genre)) {
+        s.erreur('« en cascade » fait apparaître les enfants d’un bloc l’un après l’autre : il s’écrit sur un bloc (section, bloc, ligne, colonne ou grille).', ligne);
+    }
     if (genre === 'champ' || genre === 'formulaire' || dansFormulaire) {
         s.erreur('pas d’animation sur un champ, ni dans un formulaire : un champ qui bouge pendant qu’on écrit gêne la saisie.', ligne);
     }
@@ -191,7 +194,7 @@ function verifierReglagesGraphique(g, s) {
                 s.erreur(couleur.erreur, ligne);
                 continue;
             }
-            const mode = ['clair', 'sombre'].find((m) => contraste(couleur[m], FOND_PAGE[m]) < 3);
+            const mode = s.modes.find((m) => contraste(couleur[m], FOND_PAGE[m]) < 3);
             if (mode) {
                 const rapport = contraste(couleur[mode], FOND_PAGE[mode]).toFixed(1).replace('.', ',');
                 s.avertissement(`la couleur « ${couleur.nom} » se voit mal sur le fond de la page en mode ${mode} (contraste ${rapport} pour 1, il en faut au moins 3) : choisissez une couleur plus ${mode === 'clair' ? 'foncée' : 'claire'}.`, ligne);

package/dist/analyse/navigation.js

@@ -1,5 +1,6 @@
 import { simplifier } from './elements.js';
 import { proposerNom } from './suggestions.js';
+import { pascal } from '../cibles/web/noms.js';
 const SCHEMAS_PERMIS = ['http', 'https', 'mailto', 'tel'];
 /** Vrai si l'adresse est un schéma permis pour un lien externe (http, https, mailto, tel). */
 export function estAdresseExterne(valeur) {
@@ -88,6 +89,16 @@ export function analyserNavigation(programme, diagnostics) {
             }
         }
     }
+    // Une page devient un composant React nommé comme elle (« bac_a_sable » → BacASable) :
+    // un composant du même nom serait caché par la page qui l'affiche.
+    const composants = new Map([...programme.composants, ...programme.composantsReact].flatMap((c) => [[c.nom, c.nom], [pascal(c.nom), c.nom]]));
+    for (const page of programme.pages) {
+        const produit = pascal(page.nom);
+        const composant = composants.get(produit);
+        if (composant !== undefined) {
+            erreur(`la page « ${page.nom} » et le composant « ${composant} » auraient le même nom dans le code produit (${produit}) : renommez l'un des deux (par exemple le composant « ${composant}Bloc »).`, page.ligne);
+        }
+    }
     analyserSousPages(programme, erreur);
     analyserAncres(programme, diagnostics, erreur);
 }
@@ -228,4 +239,28 @@ function analyserAncres(programme, diagnostics, erreur) {
                 verifier(page, i.cible, i.ligne);
         });
     }
+    // L'en-tête et le pied sont sur chaque page : « carte#desserts » se vérifie comme ailleurs ;
+    // « #desserts » vise la page affichée, qui change : il faut au moins une page qui l'ait.
+    for (const disposition of [programme.entete, programme.pied]) {
+        if (!disposition)
+            continue;
+        const de = disposition.genre === 'entete' ? "de l'en-tête" : 'du pied de page';
+        parcourir(disposition.corps, (i) => {
+            if (i.type !== 'Element' || i.cible === undefined)
+                return;
+            const lue = lireCible(i.cible);
+            if (lue.ancre === undefined)
+                return;
+            if (lue.page !== undefined && lue.page !== '') {
+                const visee = pages.get(lue.page);
+                if (visee)
+                    verifier(visee, i.cible, i.ligne);
+                return;
+            }
+            const montrees = programme.pages.filter((p) => !(disposition.genre === 'entete' ? p.sansEntete : p.sansPied) && p.parametres.length === 0);
+            if (!montrees.some((p) => ancres.get(p.nom)?.includes(lue.ancre))) {
+                erreur(`l'ancre « ${lue.ancre} » ${de} n'existe dans aucune page : écrivez avec ancre "${lue.ancre}" sur l'élément ou le bloc où le lien doit mener, ou écrivez le nom de la page (par exemple "accueil#${lue.ancre}").`, i.ligne);
+            }
+        });
+    }
 }

package/dist/analyse/niveaux.js

@@ -0,0 +1,67 @@
+export function niveauxDesSousTitres(instructions, parent = 1) {
+    let dernier = parent;
+    const parcourir = (enfants) => {
+        for (const instruction of enfants) {
+            if (instruction.type === 'Element' && instruction.element === 'titre')
+                dernier = 1;
+            else if (instruction.type === 'Element' && instruction.element === 'soustitre') {
+                if (instruction.niveau === undefined) {
+                    const niveau = Math.min(parent + 1, 6);
+                    if (niveau !== 2)
+                        instruction.niveau = niveau;
+                    dernier = niveau;
+                }
+                else
+                    dernier = instruction.niveau;
+            }
+            else if (instruction.type === 'Bloc' && instruction.genre === 'section')
+                niveauxDeLaSection(instruction.corps, dernier);
+            else if (instruction.type === 'Bloc')
+                niveauxDesSousTitres(instruction.corps, dernier);
+            else {
+                // Les branches d'une condition, le corps d'une boucle ou d'un formulaire : le même niveau.
+                for (const cle of ['corps', 'alors', 'sinon']) {
+                    const suite = instruction[cle];
+                    if (Array.isArray(suite) && instruction.type !== 'Evenement')
+                        parcourir(suite);
+                }
+                if (instruction.type === 'Selon')
+                    for (const cas of instruction.cas)
+                        parcourir(cas.corps);
+            }
+        }
+    };
+    parcourir(instructions);
+}
+/** Les sous-titres d'un arbre d'instructions, dans l'ordre de lecture. */
+function sousTitres(instructions, vus = []) {
+    for (const instruction of instructions) {
+        if (instruction.type === 'Element' && instruction.element === 'soustitre')
+            vus.push(instruction);
+        if (instruction.type === 'Evenement')
+            continue;
+        for (const cle of ['corps', 'alors', 'sinon']) {
+            const suite = instruction[cle];
+            if (Array.isArray(suite))
+                sousTitres(suite, vus);
+        }
+        if (instruction.type === 'Selon')
+            for (const cas of instruction.cas)
+                sousTitres(cas.corps, vus);
+    }
+    return vus;
+}
+/** Une « section » : son premier sous-titre la titre, les autres descendent d'un niveau au moins. */
+function niveauxDeLaSection(corps, parent) {
+    const tous = sousTitres(corps);
+    const automatiques = new Set(tous.filter((t) => t.niveau === undefined));
+    niveauxDesSousTitres(corps, parent);
+    const [premier, ...autres] = tous;
+    if (!premier)
+        return;
+    const sousLaSection = Math.min((premier.niveau ?? 2) + 1, 6);
+    for (const titre of autres) {
+        if (automatiques.has(titre) && (titre.niveau ?? 2) < sousLaSection)
+            titre.niveau = sousLaSection;
+    }
+}

package/dist/analyse/noms.js

@@ -12,7 +12,7 @@ export function avertirNomsDuLangage(programme) {
     const diagnostics = [];
     const avertir = (nom, ligne) => {
         const canonique = formeCanonique(nom);
-        if (canonique && MOTS_CONTEXTUELS.has(canonique)) {
+        if (canonique && canonique !== 'liste' && MOTS_CONTEXTUELS.has(canonique)) {
             diagnostics.push({
                 gravite: 'avertissement',
                 message: `la variable « ${nom} » porte le nom d'un mot du langage ; c'est permis, mais cela peut prêter à confusion.`,

package/dist/analyse/site.js

@@ -1,16 +1,36 @@
+import { langueDuMot } from '../i18n/langues.js';
 /** Le texte d'un littéral sans « {…} », sinon `undefined`. */
 export function texteLitteral(expression) {
     if (expression?.type !== 'Chaine' || !expression.parties.every((p) => p.type === 'texte'))
         return undefined;
     return expression.parties.map((p) => p.valeur).join('');
 }
-/** Le premier « titre » ou « texte » écrit dans la page, même dans un bloc de mise en page. */
-function premier(genre, instructions) {
+/**
+ * « si langue est anglais » : vrai si le test est vrai dans la langue `code`,
+ * faux sinon ; `undefined` pour un test qui ne porte pas sur la langue.
+ */
+function testDeLangue(test, code) {
+    if (test.type !== 'Comparaison' || test.gauche.type !== 'Reference' || test.gauche.nom !== 'langue' || test.droite?.type !== 'Reference')
+        return undefined;
+    if (test.operateur !== 'egal' && test.operateur !== 'different')
+        return undefined;
+    const langue = langueDuMot(test.droite.nom);
+    if (!langue)
+        return undefined;
+    return (langue.code === code) !== (test.operateur === 'different') !== Boolean(test.negation);
+}
+/**
+ * Le premier « titre » ou « texte » écrit dans la page, même dans un bloc de mise en page.
+ * Avec des langues, une branche « si langue est … » compte : celle de la langue de base.
+ */
+function premier(genre, instructions, langueDeBase) {
     for (const instruction of instructions) {
         if (instruction.type === 'Element' && instruction.element === genre)
             return instruction.contenu;
-        if (instruction.type === 'Bloc') {
-            const trouve = premier(genre, instruction.corps);
+        const vraie = instruction.type === 'Condition' && langueDeBase !== undefined ? testDeLangue(instruction.test, langueDeBase) : undefined;
+        const corps = instruction.type === 'Bloc' ? instruction.corps : instruction.type === 'Condition' && vraie !== undefined ? (vraie ? instruction.alors : instruction.sinon) : undefined;
+        if (corps) {
+            const trouve = premier(genre, corps, langueDeBase);
             if (trouve)
                 return trouve;
         }
@@ -18,10 +38,10 @@ function premier(genre, instructions) {
     return undefined;
 }
 /** Le titre et la description propres à la page : son aperçu, sinon son premier titre et son premier texte. */
-export function apercuDeLaPage(page) {
+export function apercuDeLaPage(page, langueDeBase) {
     return {
-        titre: page.apercu?.titre ?? premier('titre', page.corps),
-        description: page.apercu?.description ?? premier('texte', page.corps),
+        titre: page.apercu?.titre ?? premier('titre', page.corps, langueDeBase),
+        description: page.apercu?.description ?? premier('texte', page.corps, langueDeBase),
     };
 }
 export function analyserPublication(programme, diagnostics) {
@@ -43,10 +63,12 @@ export function analyserPublication(programme, diagnostics) {
         avertir(`l'image de partage « ${site.image} » est sur un autre site : si elle disparaît, l'aperçu des liens du site la perd. Préférez un fichier du projet.`, site.lignes.image ?? site.ligne);
     }
     const titres = new Map();
+    const premiereLangue = programme.langues?.langues[0];
+    const langueDeBase = premiereLangue ? langueDuMot(premiereLangue.mot)?.code : undefined;
     for (const page of programme.pages) {
         if (page.nom === 'introuvable')
             continue;
-        const { titre, description } = apercuDeLaPage(page);
+        const { titre, description } = apercuDeLaPage(page, langueDeBase);
         const ligneApercu = page.apercu?.ligne ?? page.ligne;
         const titreLu = texteLitteral(titre);
         const descriptionLue = texteLitteral(description);

package/dist/cibles/commun/colorerCode.js

@@ -0,0 +1,59 @@
+import { analyser } from '../../lexer/lexer.js';
+const echapper = (texte) => texte.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+/** Colore un exemple Humalis valide ; un exemple incomplet reste lisible sans couleur. */
+export function colorerCodeHumalis(code, langage) {
+    if (langage !== 'humalis')
+        return echapper(code);
+    try {
+        const tokens = analyser(code);
+        const lignes = code.split('\n');
+        const debuts = [];
+        let offset = 0;
+        for (const ligne of lignes) {
+            debuts.push(offset);
+            offset += ligne.length + 1;
+        }
+        const plages = [];
+        for (const token of tokens) {
+            if (!['MOT_CLE', 'CHAINE', 'NOMBRE'].includes(token.type))
+                continue;
+            const debut = debuts[token.ligne - 1] + token.colonne - 1;
+            let fin = debut + (token.original ?? token.valeur).length;
+            if (token.type === 'CHAINE') {
+                fin = debut + 1;
+                while (fin < code.length) {
+                    if (code[fin] === '"' && code[fin - 1] !== '\\') {
+                        fin++;
+                        break;
+                    }
+                    fin++;
+                }
+            }
+            plages.push({ debut, fin, classe: token.type === 'MOT_CLE' ? 'mot' : token.type === 'CHAINE' ? 'texte' : 'nombre' });
+        }
+        for (let index = 0; index < lignes.length; index++) {
+            const ligne = lignes[index];
+            for (let colonne = 0; colonne < ligne.length; colonne++) {
+                const debut = debuts[index] + colonne;
+                if (ligne[colonne] === '#' && !plages.some((p) => p.debut <= debut && debut < p.fin)) {
+                    plages.push({ debut, fin: debuts[index] + ligne.length, classe: 'commentaire' });
+                    break;
+                }
+            }
+        }
+        plages.sort((a, b) => a.debut - b.debut);
+        let rendu = '';
+        let position = 0;
+        for (const plage of plages) {
+            if (plage.debut < position)
+                continue;
+            rendu += echapper(code.slice(position, plage.debut));
+            rendu += `<span class="humalis-code-${plage.classe}">${echapper(code.slice(plage.debut, plage.fin))}</span>`;
+            position = plage.fin;
+        }
+        return rendu + echapper(code.slice(position));
+    }
+    catch {
+        return echapper(code);
+    }
+}