update citations and footer

app/astro.config.mjs

@@ -12,6 +12,7 @@ import rehypeCitation from 'rehype-citation';
 import rehypeCodeCopy from './plugins/rehype/code-copy.mjs';
 import rehypeReferencesAndFootnotes from './plugins/rehype/post-citation.mjs';
 import remarkIgnoreCitationsInCode from './plugins/remark/ignore-citations-in-code.mjs';
+import remarkUnwrapCitationLinks from './plugins/remark/unwrap-citation-links.mjs';
 import remarkDirective from 'remark-directive';
 import remarkOutputContainer from './plugins/remark/output-container.mjs';
 import rehypeRestoreAtInCode from './plugins/rehype/restore-at-in-code.mjs';
@@ -47,6 +48,7 @@ export default defineConfig({
       }
     },
     remarkPlugins: [
+      remarkUnwrapCitationLinks,
       remarkIgnoreCitationsInCode,
       remarkMath,
       [remarkFootnotes, { inlineNotes: true }],
@@ -63,6 +65,8 @@ export default defineConfig({
         bibliography: 'src/content/bibliography.bib',
         linkCitations: true,
         csl: "apa",
+        noCite: false,
+        suppressBibliography: false,
       }],
       rehypeReferencesAndFootnotes,
       rehypeRestoreAtInCode,

app/plugins/rehype/post-citation.mjs

@@ -103,7 +103,7 @@ export default function rehypeReferencesAndFootnotes() {
             type: 'element',
             tagName: 'a',
             properties: { href: `#${keys[0]}`, 'aria-label': ariaLabel },
-            children: [ createBackIcon() ]
+            children: [createBackIcon()]
           };
           small.children.push(a);
         } else {
@@ -115,7 +115,7 @@ export default function rehypeReferencesAndFootnotes() {
               type: 'element',
               tagName: 'a',
               properties: { href: `#${backId}`, 'aria-label': ariaLabel },
-              children: [ { type: 'text', value: String(idx + 1) } ]
+              children: [{ type: 'text', value: String(idx + 1) }]
             });
             if (idx < keys.length - 1) small.children.push({ type: 'text', value: ', ' });
           });
@@ -278,8 +278,12 @@ export default function rehypeReferencesAndFootnotes() {
       walk(tree, null, (node) => {
         if (found) return;
         if (!isElement(node)) return;
+        
+        // Ignore headers (h1, h2, h3, h4, h5, h6) - we only want container elements
+        if (/^h[1-6]$/i.test(node.tagName)) return;
+        
         const id = getAttr(node, 'id');
-        if (id === 'references' || hasClass(node, 'references') || hasClass(node, 'bibliography')) {
+        if (id === 'references' || id === 'refs' || hasClass(node, 'references') || hasClass(node, 'bibliography')) {
           found = node;
         }
       });
@@ -319,6 +323,10 @@ export default function rehypeReferencesAndFootnotes() {
     const refIdToExternalHref = new Map();
 
     if (refsRoot) {
+      // Add a unique id to avoid collisions with user-created headers
+      setAttr(refsRoot, 'id', 'bibliography-references-list');
+      setAttr(refsRoot, 'data-bibliography-block', 'true');
+
       refsOl = toOrderedList(refsRoot);
       // Collect item ids and linkify their content
       for (const li of getChildren(refsOl)) {

app/plugins/remark/unwrap-citation-links.mjs

@@ -0,0 +1,57 @@
+// Plugin remark pour transformer les liens markdown contenant des citations en citations simples
+// Transforme [@reference](url) en [@reference]
+export default function remarkUnwrapCitationLinks() {
+    return (tree) => {
+        // Fonction helper pour extraire le contenu textuel d'un nœud
+        const getTextContent = (node) => {
+            if (!node) return '';
+            if (node.type === 'text') return node.value || '';
+            if (Array.isArray(node.children)) {
+                return node.children.map(getTextContent).join('');
+            }
+            return '';
+        };
+
+        const visit = (node, parent) => {
+            if (!node || typeof node !== 'object') return;
+
+            // Parcourir les enfants d'abord (post-order traversal)
+            const children = Array.isArray(node.children) ? node.children : [];
+            for (let i = 0; i < children.length; i++) {
+                const child = children[i];
+                visit(child, node);
+            }
+
+            // Si c'est un nœud de type 'link', vérifier son contenu
+            if (node.type === 'link' && parent && Array.isArray(parent.children)) {
+                // Récupérer le contenu textuel du lien
+                const textContent = getTextContent(node);
+
+                // Debug
+                console.log('🔍 Link trouvé:', {
+                    text: textContent,
+                    url: node.url,
+                    matches: /^@\w+/.test(textContent.trim())
+                });
+
+                // Vérifier si c'est une citation (commence par @)
+                if (textContent && /^@\w+/.test(textContent.trim())) {
+                    // Trouver l'index du nœud dans son parent
+                    const index = parent.children.indexOf(node);
+
+                    if (index !== -1) {
+                        console.log('✅ Transformation:', textContent);
+                        // Remplacer le nœud link par un nœud text simple
+                        parent.children[index] = {
+                            type: 'text',
+                            value: textContent.trim()
+                        };
+                    }
+                }
+            }
+        };
+
+        visit(tree, null);
+    };
+}
+

app/src/components/Footer.astro

@@ -130,7 +130,10 @@ const { citationText, bibtex, licence, doi } = Astro.props as Props;
       };
 
       const referencesEl = findFirstOutsideFooter([
+        "#bibliography-references-list",
+        "[data-bibliography-block]",
         "#references",
+        "#refs",
         ".references",
         ".bibliography",
       ]);

app/src/components/TableOfContents.astro

@@ -160,6 +160,11 @@ const { tableOfContentAutoCollapse = false } = Astro.props as Props;
       // Temporarily set height to auto to measure scrollHeight reliably
       const prev = el.style.height;
       el.style.height = "auto";
+
+      // Force un reflow pour que le navigateur calcule les wraps de texte
+      void el.offsetHeight;
+
+      // Maintenant scrollHeight inclut la vraie hauteur avec tous les line wraps
       const h = el.scrollHeight;
       el.style.height = prev || "";
       return h;
@@ -401,7 +406,53 @@ const { tableOfContentAutoCollapse = false } = Astro.props as Props;
               topLevelChanges.forEach(({ li, sub, shouldBeExpanded }) => {
                 if (shouldBeExpanded) {
                   li.classList.remove("collapsed");
-                  // Maintenant on peut mesurer avec confiance
+
+                  // CRITIQUE : Avant de mesurer, mettre ABSOLUMENT TOUS les sous-éléments
+                  // dans leur état final (expanded OU collapsed) de manière synchrone
+                  const allInnerItems = sub.querySelectorAll(
+                    "li[data-heading-idx]",
+                  );
+
+                  // D'abord, désactiver toutes les transitions
+                  allInnerItems.forEach((innerLi) => {
+                    const innerSub = innerLi.querySelector(":scope > ul");
+                    if (innerSub) {
+                      innerSub.style.transition = "none";
+                    }
+                  });
+
+                  // Ensuite, mettre chaque élément dans son état final
+                  allInnerItems.forEach((innerLi) => {
+                    const innerIdx = Number(
+                      innerLi.getAttribute("data-heading-idx") || "-1",
+                    );
+                    const innerSub = innerLi.querySelector(":scope > ul");
+                    if (innerSub) {
+                      if (newActiveAncestors.has(innerIdx)) {
+                        // Cet élément devrait être expanded
+                        innerLi.classList.remove("collapsed");
+                        innerSub.style.height = "auto";
+                      } else {
+                        // Cet élément devrait être collapsed
+                        innerLi.classList.add("collapsed");
+                        innerSub.style.height = "0px";
+                      }
+                    }
+                  });
+
+                  // Forcer un reflow global pour que TOUT soit calculé
+                  void sub.offsetHeight;
+
+                  // Réactiver les transitions
+                  allInnerItems.forEach((innerLi) => {
+                    const innerSub = innerLi.querySelector(":scope > ul");
+                    if (innerSub) {
+                      innerSub.style.transition = "";
+                    }
+                  });
+
+                  // Maintenant on peut mesurer avec confiance : tous les éléments
+                  // sont dans leur état final définitif
                   const target = measure(sub);
                   animateTo(sub, target);
                 } else {
@@ -446,9 +497,10 @@ const { tableOfContentAutoCollapse = false } = Astro.props as Props;
     if (mq.addEventListener) mq.addEventListener("change", onMqChange);
     else if (mq.addListener) mq.addListener(onMqChange);
 
-    // Throttle pour éviter trop d'appels pendant le scroll
-    let scrollTimeout = null;
-    let isScrolling = false;
+    // Debounce pour traiter la dernière mise à jour après que le scroll se stabilise
+    let scrollDebounceTimer = null;
+    let lastRequestedIdx = -1;
+    let isProcessing = false;
 
     const onScroll = () => {
       // active link highlight
@@ -468,17 +520,31 @@ const { tableOfContentAutoCollapse = false } = Astro.props as Props;
         }
       }
 
-      // Throttle : mettre à jour le collapse seulement si l'index change ET qu'on n'est pas déjà en train de traiter
-      if (activeIdx !== prevActiveIdx && !isScrolling) {
-        isScrolling = true;
-        setCollapsedState(activeIdx);
-
-        // Permettre une nouvelle mise à jour après un délai minimal
-        clearTimeout(scrollTimeout);
-        scrollTimeout = setTimeout(() => {
-          isScrolling = false;
-        }, 50); // 50ms entre chaque traitement
-      }
+      if (activeIdx === prevActiveIdx) return;
+
+      // Sauvegarder la dernière demande
+      lastRequestedIdx = activeIdx;
+
+      // Si on est en train de traiter, ne rien faire (on traitera la dernière demande après)
+      if (isProcessing) return;
+
+      // Debounce : attendre un peu que le scroll se stabilise
+      clearTimeout(scrollDebounceTimer);
+      scrollDebounceTimer = setTimeout(() => {
+        // Traiter la dernière demande
+        if (lastRequestedIdx !== prevActiveIdx) {
+          isProcessing = true;
+          setCollapsedState(lastRequestedIdx);
+          // Le processing flag sera réinitialisé après les animations
+          setTimeout(() => {
+            isProcessing = false;
+            // Si une nouvelle demande est arrivée pendant qu'on traitait, la traiter maintenant
+            if (lastRequestedIdx !== prevActiveIdx) {
+              onScroll();
+            }
+          }, 250); // Attendre que les animations soient lancées
+        }
+      }, 100); // Debounce de 100ms
     };
 
     // If auto-collapse, collapse immediately (expand first section) before any scroll