Initial commit: webtrees Family Navigator Graph sidebar module

SVG-based sidebar widget displaying immediate family relationships
(parents, siblings, spouses, children) with compact card layout,
multi-spouse routing, wrapped rows, and ancestor/descendant indicators.

resources/views/modules/family-nav-graph/sidebar.phtml

@@ -0,0 +1,89 @@
+<?php
+
+declare(strict_types=1);
+
+use Fisharebest\Webtrees\Individual;
+use Fisharebest\Webtrees\Tree;
+use FamilyNavGraph\Module;
+
+/**
+ * @var Module     $module
+ * @var Individual $individual
+ * @var Tree       $tree
+ * @var string     $tree_data
+ * @var string     $javascript_url
+ * @var string     $stylesheet_url
+ */
+
+$containerId = 'family-nav-graph-' . $individual->xref();
+?>
+
+<link rel="stylesheet" href="<?= e($stylesheet_url) ?>">
+
+<div class="wt-sidebar-content wt-sidebar-family-nav-graph">
+    <div id="<?= $containerId ?>" class="fng-container">
+        <div class="full-diagram-chart"></div>
+    </div>
+</div>
+
+<script>
+(function() {
+    var data = <?= $tree_data ?>;
+
+    function expandAccordion() {
+        var container = document.getElementById('<?= $containerId ?>');
+        if (!container) return;
+        var collapse = container.closest('.accordion-collapse');
+        if (collapse && !collapse.classList.contains('show')) {
+            var bsCollapse = new bootstrap.Collapse(collapse, { toggle: true });
+        }
+    }
+
+    function initSidebar() {
+        if (typeof window.FamilyNavGraphChart === 'undefined') {
+            setTimeout(initSidebar, 100);
+            return;
+        }
+
+        expandAccordion();
+
+        var container = document.getElementById('<?= $containerId ?>');
+        if (!container) return;
+
+        var chartEl = container.querySelector('.full-diagram-chart');
+        if (chartEl && chartEl.getBoundingClientRect().width > 0) {
+            renderChart();
+            return;
+        }
+
+        // Accordion may be animating — wait for it to finish
+        var accordion = container.closest('.accordion-collapse');
+        if (accordion) {
+            accordion.addEventListener('shown.bs.collapse', function handler() {
+                accordion.removeEventListener('shown.bs.collapse', handler);
+                renderChart();
+            });
+            // Already open (no animation)
+            if (accordion.classList.contains('show')) {
+                renderChart();
+            }
+        } else {
+            renderChart();
+        }
+    }
+
+    function renderChart() {
+        var chart = new window.FamilyNavGraphChart('#<?= $containerId ?>', data);
+        chart.render().catch(function(err) {
+            console.error('Family Nav Graph: render failed', err);
+        });
+    }
+
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initSidebar);
+    } else {
+        initSidebar();
+    }
+})();
+</script>
+<script src="<?= e($javascript_url) ?>"></script>