ma-agents 3.15.0 → 3.15.2

package/lib/bmad-extension-plugin/.claude-plugin/marketplace.json

@@ -37,7 +37,7 @@
       "name": "ma-skills",
       "source": "./",
       "description": "ma-agents extension module providing enterprise SDLC personas and operational workflow skills.",
-      "version": "3.15.0",
+      "version": "3.15.2",
       "author": {
         "name": "Alon Mayaffit"
       },

package/lib/knowledge-atlas/dist/atlas.cjs

@@ -5697,10 +5697,14 @@ var DESIGN_SYSTEM_CSS = `/* Knowledge Atlas \u2014 design system (Story 29.3) */
   top: 0;
 }
 
-/* FR223 \u2014 smooth scrolling for in-page anchor jumps (TOC, backlinks, orphan
-   summary links). Guarded below by prefers-reduced-motion. */
+/* Scroll behaviour: use auto (instant) so that landing on a page via a
+   #anchor \u2014 e.g. clicking a graph node or an entity link into a long reading
+   view \u2014 reliably jumps to the target. A global smooth scroll-behavior
+   made the browser's on-load hash navigation unreliable on long documents (it
+   could stay at the top \u2014 the "click goes to the start of the document" bug).
+   In-page TOC/backlink clicks still jump correctly, just without the animation. */
 html {
-  scroll-behavior: smooth;
+  scroll-behavior: auto;
 }
 
 body {
@@ -12150,14 +12154,23 @@ function renderDocumentPage(fileRec, manifest, projectRoot, navFlags, resolveAbs
   const statusBadgesHtml = renderStatusBadges(fileRec.statuses);
   const existingIds = /* @__PURE__ */ new Set();
   for (const m of renderedHtml.matchAll(/\sid="([^"]+)"/g)) existingIds.add(m[1]);
-  const anchorTargets = [];
+  const escRe = (s) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  const inlinePlacements = [];
+  const fallbackAnchors = [];
   for (const node of fileNodes) {
-    if (node.anchor && !existingIds.has(node.anchor)) {
-      anchorTargets.push(`<span class="entity-anchor" id="${esc4(node.anchor)}"></span>`);
-      existingIds.add(node.anchor);
-    }
-  }
-  const anchorTargetsHtml = anchorTargets.join("\n");
+    const a = node.anchor;
+    if (!a || existingIds.has(a)) continue;
+    existingIds.add(a);
+    const m = new RegExp('<a\\b[^>]*href="[^"]*#' + escRe(a) + '"', "i").exec(renderedHtml);
+    if (m) inlinePlacements.push({ idx: m.index, anchor: a });
+    else fallbackAnchors.push(a);
+  }
+  inlinePlacements.sort((x, y) => y.idx - x.idx);
+  for (const p of inlinePlacements) {
+    const span = `<span class="entity-anchor" id="${esc4(p.anchor)}"></span>`;
+    renderedHtml = renderedHtml.slice(0, p.idx) + span + renderedHtml.slice(p.idx);
+  }
+  const anchorTargetsHtml = fallbackAnchors.map((a) => `<span class="entity-anchor" id="${esc4(a)}"></span>`).join("\n");
   const backLinkHtml = '<a class="back-link" href="../index.html">&larr; Back to Home</a>';
   const pageBody = [
     '<div class="content-wrap">',
@@ -13057,6 +13070,7 @@ function buildAppScript() {
   // mouse (finding #8: tooltip was shown with display:block but no left/top,
   // so it rendered at the bottom of <main>).
   var lastHoverNode = null;
+  var selectedLink = null; // edge highlighted on click: drawn bold + its two endpoints ringed
 
   function getFilteredData() {
     var nodes = allNodes;
@@ -13096,6 +13110,20 @@ function buildAppScript() {
     return;
   }
 
+  // Layout forces (fixes the overlapping-blob): stronger charge repulsion + a
+  // larger link distance push nodes apart; a gentler velocity decay lets a
+  // dragged node's neighbourhood follow it and settle rather than everything
+  // snapping. The vendored force-graph exposes charge/link via d3Force but no
+  // collide, so spacing comes from charge+distance. All best-effort.
+  try {
+    var _charge = graph.d3Force && graph.d3Force('charge');
+    if (_charge && _charge.strength) _charge.strength(-160);
+    var _link = graph.d3Force && graph.d3Force('link');
+    if (_link && _link.distance) _link.distance(48);
+    if (graph.d3VelocityDecay) graph.d3VelocityDecay(0.3);
+    if (graph.warmupTicks) graph.warmupTicks(80); // pre-spread before first paint
+  } catch (_e) { /* forces best-effort; graph still renders without them */ }
+
   // FR222: distinct shape per entity type (previously color+size only \u2014 the
   // canvas never read NODE_STYLES' shape/data-shape, so every node was a
   // circle regardless of kind). Traces the path for the node's shape
@@ -13161,29 +13189,59 @@ function buildAppScript() {
       // FR222: paint the node as its per-kind shape (circle/square/diamond/
       // triangle) instead of force-graph's default circle-only rendering.
       .nodeCanvasObject(function(n, ctx) {
-        var size = n.size || 6;
+        var size = (n.size || 6) * 0.5; // smaller nodes (were visually oversized/overlapping)
         ctx.fillStyle = n.color || '#888';
         traceNodeShapePath(ctx, n.shape, n.x, n.y, size);
         ctx.fill();
+        // Ring the two endpoints of the selected edge so both ends are easy to
+        // find, however far apart they sit in the layout.
+        if (selectedLink) {
+          var s = selectedLink.source, t = selectedLink.target;
+          if (n === s || n === t) {
+            ctx.beginPath();
+            ctx.arc(n.x, n.y, size + 3.5, 0, 2 * Math.PI);
+            ctx.strokeStyle = '#111827';
+            ctx.lineWidth = 1.8;
+            ctx.stroke();
+          }
+        }
       })
       // Matching hit-test paint: without this, force-graph's click/hover
       // detection falls back to a generic area that no longer matches the
       // custom shape drawn above (non-circle nodes would get unreliable
       // hover/click hit-boxes).
       .nodePointerAreaPaint(function(n, color, ctx) {
-        var size = (n.size || 6) + 2; // slightly larger \u2014 easier to hit
+        var size = (n.size || 6) * 0.5 + 2; // match the smaller draw size, +2 to stay easy to hit
         ctx.fillStyle = color;
         traceNodeShapePath(ctx, n.shape, n.x, n.y, size);
         ctx.fill();
       })
       .linkSource('source')
       .linkTarget('target')
-      .linkColor(function(e) { return e.color || '#aaa'; })
+      // Selected edge is drawn dark + thick so you can trace it end to end.
+      .linkColor(function(e) { return e === selectedLink ? '#111827' : (e.color || '#aaa'); })
+      .linkWidth(function(e) { return e === selectedLink ? 3.5 : (e.dashed ? 0.5 : 1); })
       // Story 29.8 - dashed stroke for weak references edges; solid otherwise.
       .linkLineDash(function(e) { return e.dashed ? [4, 3] : null; })
-      .linkDirectionalArrowLength(4)
+      .linkDirectionalArrowLength(function(e) { return e === selectedLink ? 7 : 4; })
       .linkDirectionalArrowRelPos(1)
       .linkCurvature(0.1)
+      // Click an edge to highlight it (bold + ringed endpoints); click it again
+      // or click empty space to clear. Re-applying the accessors forces an
+      // immediate repaint of the new selection state.
+      .onLinkClick(function(e) {
+        selectedLink = (selectedLink === e) ? null : e;
+        graph.linkWidth(graph.linkWidth()).linkColor(graph.linkColor());
+      })
+      .onLinkHover(function(e) {
+        if (container) container.style.cursor = e ? 'pointer' : 'default';
+        if (!tooltip) return;
+        if (!e) { tooltip.style.display = 'none'; return; }
+        var s = (e.source && e.source.label) || e.source;
+        var t = (e.target && e.target.label) || e.target;
+        tooltip.style.display = 'block';
+        tooltip.textContent = s + '  \u2192  ' + t + (e.kind ? '  [' + e.kind + ']' : '');
+      })
       .onNodeClick(function(n) {
         // Navigate to the reading view via the server-resolved doc page (the
         // 'page' field, e.g. "docs/<slug>.html"), NOT the raw fileId \u2014 the
@@ -13200,6 +13258,16 @@ function buildAppScript() {
         var href = page + (n.anchor ? '#' + n.anchor : '');
         window.location.href = href;
       })
+      // Drag-to-pin (fixes the spring-back): keep the node exactly where it was
+      // dropped (fx/fy). Because the simulation stays warm, its linked neighbours
+      // follow the drag and nodes farther along the graph move progressively less.
+      // Right-click a node to release its pin back into the layout.
+      .onNodeDrag(function(n) { n.fx = n.x; n.fy = n.y; })
+      .onNodeDragEnd(function(n) { n.fx = n.x; n.fy = n.y; })
+      .onNodeRightClick(function(n) {
+        n.fx = undefined; n.fy = undefined;
+        if (graph.d3ReheatSimulation) graph.d3ReheatSimulation();
+      })
       .onNodeHover(function(n) {
         // Distinct cursor hint: pointer only over nodes that actually
         // navigate somewhere (have a resolved page); default cursor otherwise
@@ -13214,6 +13282,10 @@ function buildAppScript() {
       .onBackgroundClick(function() {
         if (tooltip) tooltip.style.display = 'none';
         lastHoverNode = null;
+        if (selectedLink) {
+          selectedLink = null;
+          graph.linkWidth(graph.linkWidth()).linkColor(graph.linkColor());
+        }
       });
   }
 

package/lib/knowledge-atlas/src/render/design-system.ts

@@ -108,10 +108,14 @@ export const DESIGN_SYSTEM_CSS: string = `\
   top: 0;
 }
 
-/* FR223 — smooth scrolling for in-page anchor jumps (TOC, backlinks, orphan
-   summary links). Guarded below by prefers-reduced-motion. */
+/* Scroll behaviour: use auto (instant) so that landing on a page via a
+   #anchor — e.g. clicking a graph node or an entity link into a long reading
+   view — reliably jumps to the target. A global smooth scroll-behavior
+   made the browser's on-load hash navigation unreliable on long documents (it
+   could stay at the top — the "click goes to the start of the document" bug).
+   In-page TOC/backlink clicks still jump correctly, just without the animation. */
 html {
-  scroll-behavior: smooth;
+  scroll-behavior: auto;
 }
 
 body {

package/lib/knowledge-atlas/src/render/document.ts

@@ -299,16 +299,36 @@ export function renderDocumentPage(
   // to a heading slug (`story-11-oauth2-integration`). We emit an invisible
   // anchor target for every file node whose anchor is not already a heading id,
   // so every cross-link `…#anchor` resolves to a real location on the page.
+  // Place each entity's anchor at the FIRST place that entity is mentioned in
+  // the body (its first linkified occurrence: an <a … href="…#anchor">), so a
+  // cross-link or graph-node click lands where the entity is actually discussed.
+  // Previously every anchor was emitted as one clump at the top of the article,
+  // so every #anchor (e.g. all 9 epics) resolved to the same spot. Anchors with
+  // no linked mention fall back to the top clump.
   const existingIds = new Set<string>();
   for (const m of renderedHtml.matchAll(/\sid="([^"]+)"/g)) existingIds.add(m[1]!);
-  const anchorTargets: string[] = [];
+  const escRe = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  const inlinePlacements: { idx: number; anchor: string }[] = [];
+  const fallbackAnchors: string[] = [];
   for (const node of fileNodes) {
-    if (node.anchor && !existingIds.has(node.anchor)) {
-      anchorTargets.push(`<span class="entity-anchor" id="${esc(node.anchor)}"></span>`);
-      existingIds.add(node.anchor);
-    }
+    const a = node.anchor;
+    if (!a || existingIds.has(a)) continue;
+    existingIds.add(a);
+    // First <a> tag whose href ends with this exact anchor fragment.
+    const m = new RegExp('<a\\b[^>]*href="[^"]*#' + escRe(a) + '"', 'i').exec(renderedHtml);
+    if (m) inlinePlacements.push({ idx: m.index, anchor: a });
+    else fallbackAnchors.push(a);
+  }
+  // Insert the invisible anchor spans just before their target links. Apply from
+  // the last position to the first so earlier indices stay valid.
+  inlinePlacements.sort((x, y) => y.idx - x.idx);
+  for (const p of inlinePlacements) {
+    const span = `<span class="entity-anchor" id="${esc(p.anchor)}"></span>`;
+    renderedHtml = renderedHtml.slice(0, p.idx) + span + renderedHtml.slice(p.idx);
   }
-  const anchorTargetsHtml = anchorTargets.join('\n');
+  const anchorTargetsHtml = fallbackAnchors
+    .map(a => `<span class="entity-anchor" id="${esc(a)}"></span>`)
+    .join('\n');
 
   // Back link
   const backLinkHtml = '<a class="back-link" href="../index.html">&larr; Back to Home</a>';

package/lib/knowledge-atlas/src/render/graph.ts

@@ -648,6 +648,7 @@ function buildAppScript(): string {
   // mouse (finding #8: tooltip was shown with display:block but no left/top,
   // so it rendered at the bottom of <main>).
   var lastHoverNode = null;
+  var selectedLink = null; // edge highlighted on click: drawn bold + its two endpoints ringed
 
   function getFilteredData() {
     var nodes = allNodes;
@@ -687,6 +688,20 @@ function buildAppScript(): string {
     return;
   }
 
+  // Layout forces (fixes the overlapping-blob): stronger charge repulsion + a
+  // larger link distance push nodes apart; a gentler velocity decay lets a
+  // dragged node's neighbourhood follow it and settle rather than everything
+  // snapping. The vendored force-graph exposes charge/link via d3Force but no
+  // collide, so spacing comes from charge+distance. All best-effort.
+  try {
+    var _charge = graph.d3Force && graph.d3Force('charge');
+    if (_charge && _charge.strength) _charge.strength(-160);
+    var _link = graph.d3Force && graph.d3Force('link');
+    if (_link && _link.distance) _link.distance(48);
+    if (graph.d3VelocityDecay) graph.d3VelocityDecay(0.3);
+    if (graph.warmupTicks) graph.warmupTicks(80); // pre-spread before first paint
+  } catch (_e) { /* forces best-effort; graph still renders without them */ }
+
   // FR222: distinct shape per entity type (previously color+size only — the
   // canvas never read NODE_STYLES' shape/data-shape, so every node was a
   // circle regardless of kind). Traces the path for the node's shape
@@ -752,29 +767,59 @@ function buildAppScript(): string {
       // FR222: paint the node as its per-kind shape (circle/square/diamond/
       // triangle) instead of force-graph's default circle-only rendering.
       .nodeCanvasObject(function(n, ctx) {
-        var size = n.size || 6;
+        var size = (n.size || 6) * 0.5; // smaller nodes (were visually oversized/overlapping)
         ctx.fillStyle = n.color || '#888';
         traceNodeShapePath(ctx, n.shape, n.x, n.y, size);
         ctx.fill();
+        // Ring the two endpoints of the selected edge so both ends are easy to
+        // find, however far apart they sit in the layout.
+        if (selectedLink) {
+          var s = selectedLink.source, t = selectedLink.target;
+          if (n === s || n === t) {
+            ctx.beginPath();
+            ctx.arc(n.x, n.y, size + 3.5, 0, 2 * Math.PI);
+            ctx.strokeStyle = '#111827';
+            ctx.lineWidth = 1.8;
+            ctx.stroke();
+          }
+        }
       })
       // Matching hit-test paint: without this, force-graph's click/hover
       // detection falls back to a generic area that no longer matches the
       // custom shape drawn above (non-circle nodes would get unreliable
       // hover/click hit-boxes).
       .nodePointerAreaPaint(function(n, color, ctx) {
-        var size = (n.size || 6) + 2; // slightly larger — easier to hit
+        var size = (n.size || 6) * 0.5 + 2; // match the smaller draw size, +2 to stay easy to hit
         ctx.fillStyle = color;
         traceNodeShapePath(ctx, n.shape, n.x, n.y, size);
         ctx.fill();
       })
       .linkSource('source')
       .linkTarget('target')
-      .linkColor(function(e) { return e.color || '#aaa'; })
+      // Selected edge is drawn dark + thick so you can trace it end to end.
+      .linkColor(function(e) { return e === selectedLink ? '#111827' : (e.color || '#aaa'); })
+      .linkWidth(function(e) { return e === selectedLink ? 3.5 : (e.dashed ? 0.5 : 1); })
       // Story 29.8 - dashed stroke for weak references edges; solid otherwise.
       .linkLineDash(function(e) { return e.dashed ? [4, 3] : null; })
-      .linkDirectionalArrowLength(4)
+      .linkDirectionalArrowLength(function(e) { return e === selectedLink ? 7 : 4; })
       .linkDirectionalArrowRelPos(1)
       .linkCurvature(0.1)
+      // Click an edge to highlight it (bold + ringed endpoints); click it again
+      // or click empty space to clear. Re-applying the accessors forces an
+      // immediate repaint of the new selection state.
+      .onLinkClick(function(e) {
+        selectedLink = (selectedLink === e) ? null : e;
+        graph.linkWidth(graph.linkWidth()).linkColor(graph.linkColor());
+      })
+      .onLinkHover(function(e) {
+        if (container) container.style.cursor = e ? 'pointer' : 'default';
+        if (!tooltip) return;
+        if (!e) { tooltip.style.display = 'none'; return; }
+        var s = (e.source && e.source.label) || e.source;
+        var t = (e.target && e.target.label) || e.target;
+        tooltip.style.display = 'block';
+        tooltip.textContent = s + '  →  ' + t + (e.kind ? '  [' + e.kind + ']' : '');
+      })
       .onNodeClick(function(n) {
         // Navigate to the reading view via the server-resolved doc page (the
         // 'page' field, e.g. "docs/<slug>.html"), NOT the raw fileId — the
@@ -791,6 +836,16 @@ function buildAppScript(): string {
         var href = page + (n.anchor ? '#' + n.anchor : '');
         window.location.href = href;
       })
+      // Drag-to-pin (fixes the spring-back): keep the node exactly where it was
+      // dropped (fx/fy). Because the simulation stays warm, its linked neighbours
+      // follow the drag and nodes farther along the graph move progressively less.
+      // Right-click a node to release its pin back into the layout.
+      .onNodeDrag(function(n) { n.fx = n.x; n.fy = n.y; })
+      .onNodeDragEnd(function(n) { n.fx = n.x; n.fy = n.y; })
+      .onNodeRightClick(function(n) {
+        n.fx = undefined; n.fy = undefined;
+        if (graph.d3ReheatSimulation) graph.d3ReheatSimulation();
+      })
       .onNodeHover(function(n) {
         // Distinct cursor hint: pointer only over nodes that actually
         // navigate somewhere (have a resolved page); default cursor otherwise
@@ -805,6 +860,10 @@ function buildAppScript(): string {
       .onBackgroundClick(function() {
         if (tooltip) tooltip.style.display = 'none';
         lastHoverNode = null;
+        if (selectedLink) {
+          selectedLink = null;
+          graph.linkWidth(graph.linkWidth()).linkColor(graph.linkColor());
+        }
       });
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ma-agents",
-  "version": "3.15.0",
+  "version": "3.15.2",
   "description": "NPX tool to install skills for AI coding agents (Claude Code, Gemini, Copilot, Kilocode, Cline, Cursor, Roo Code)",
   "main": "index.js",
   "bin": {