fix(spa): make .md links in Analysis page scroll to inline sections

Analysis markdown files often cross-reference each other with relative
links like [details.md](details.md). In the SPA these files are embedded
inline, so the links were dead. Now each section gets an anchor ID and
.md links are rewritten to smooth-scroll to the target, expanding
collapsed <details> elements automatically.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: queelius

src/chartfold/spa/js/sections.js

@@ -932,16 +932,42 @@ const Sections = {
       return;
     }
 
+    // Build filename -> anchor-id map for cross-linking between analysis files
+    var filenameMap = {};
+    for (var j = 0; j < data.length; j++) {
+      var fn = data[j].filename || '';
+      if (fn) filenameMap[fn] = 'analysis-' + fn.replace(/\.md$/i, '').replace(/[^a-z0-9-]/gi, '-').toLowerCase();
+    }
+
     for (var i = 0; i < data.length; i++) {
       var entry = data[i];
+      var anchorId = filenameMap[entry.filename] || ('analysis-' + i);
       var contentDiv = UI.el('div', { className: 'analysis-content' });
-      contentDiv.innerHTML = Markdown.render(entry.body);
+      // Markdown.render returns sanitized HTML from our own embedded markdown parser
+      contentDiv.innerHTML = Markdown.render(entry.body);  // trusted internal content
+
+      // Rewrite .md file links to scroll to the corresponding inline section
+      var links = contentDiv.querySelectorAll('a[href]');
+      for (var li = 0; li < links.length; li++) {
+        var href = links[li].getAttribute('href');
+        if (href && /\.md$/i.test(href)) {
+          var targetFn = href.replace(/^.*\//, ''); // strip path prefix, keep filename
+          var targetId = filenameMap[targetFn];
+          if (targetId) {
+            links[li].setAttribute('href', '#' + targetId);
+            links[li].setAttribute('data-analysis-target', targetId);
+          }
+        }
+      }
 
       if (i === 0) {
         // First entry expanded by default
-        el.appendChild(UI.clinicalCard(entry.title, entry.filename || '', contentDiv));
+        var card = UI.clinicalCard(entry.title, entry.filename || '', contentDiv);
+        card.id = anchorId;
+        el.appendChild(card);
       } else {
         var details = UI.el('details', { style: 'margin-bottom: 8px;' });
+        details.id = anchorId;
         details.appendChild(UI.el('summary', {
           textContent: entry.title,
           style: 'cursor: pointer; font-weight: 600; padding: 8px 0;'
@@ -951,6 +977,19 @@ const Sections = {
         el.appendChild(details);
       }
     }
+
+    // Handle clicks on .md links: expand the target <details> and scroll to it
+    el.addEventListener('click', function(e) {
+      var link = e.target.closest('a[data-analysis-target]');
+      if (!link) return;
+      e.preventDefault();
+      var targetId = link.getAttribute('data-analysis-target');
+      var targetEl = document.getElementById(targetId);
+      if (targetEl) {
+        if (targetEl.tagName === 'DETAILS') targetEl.open = true;
+        targetEl.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      }
+    });
   },
 
   sql_console(el, db) {

tests/test_spa_export.py

@@ -1164,6 +1164,37 @@ def test_analysis_markdown_embedded(self, spa_db, tmp_path):
         assert data[0]["filename"] == "cea-analysis.md"
         assert "CEA values are stable." in data[0]["body"]
 
+    def test_analysis_md_links_get_anchor_ids(self, spa_db, tmp_path):
+        """Analysis entries get anchor IDs so cross-file .md links can scroll to them."""
+        analysis_dir = tmp_path / "analysis"
+        analysis_dir.mkdir()
+        # First file links to the second
+        (analysis_dir / "index.md").write_text(
+            "See [details.md](details.md) for more.\n"
+        )
+        (analysis_dir / "details.md").write_text("The detailed analysis.\n")
+        out_path = str(tmp_path / "cross_link.html")
+        export_spa(spa_db, out_path, analysis_dir=str(analysis_dir))
+        with open(out_path, encoding="utf-8") as f:
+            html = f.read()
+        # The JS builds anchor IDs like "analysis-details" from "details.md"
+        # and the sections.js code assigns id attributes and rewrites href to #analysis-details
+        # Verify both files are embedded
+        match = re.search(
+            r'<script id="chartfold-analysis" type="application/json">(.*?)</script>',
+            html,
+            re.DOTALL,
+        )
+        assert match is not None
+        data = json.loads(match.group(1))
+        assert len(data) == 2
+        filenames = [d["filename"] for d in data]
+        assert "details.md" in filenames
+        assert "index.md" in filenames
+        # The link text in the first file's body should reference details.md
+        index_entry = next(d for d in data if d["filename"] == "index.md")
+        assert "details.md" in index_entry["body"]
+
     def test_embed_images_flag(self, spa_db, tmp_path):
         """embed_images=True triggers image asset loading from database."""
         # Create a small image file