@transitrix/diagrams 1.12.0 → 1.12.2

package/dist/capability-map/CapabilityCardNode.d.ts

@@ -7,6 +7,7 @@ export interface CapabilityCardNodeData {
     maturityColours: Record<number, string>;
     readOnly: boolean;
     isDropTarget: boolean;
+    hasChildren: boolean;
     hasHiddenChildren: boolean;
     isCollapsed: boolean;
     onAddChild: (parentId: number) => void;

package/dist/capability-map/CapabilityCardNode.js

@@ -9,7 +9,7 @@ function latestMaturityLevel(cap) {
     return [...cap.maturity].sort((a, b) => b.date.localeCompare(a.date))[0].level;
 }
 const CapabilityCardNode = memo(({ data }) => {
-    const { capability, theme, maturityColours, readOnly, isDropTarget, hasHiddenChildren, isCollapsed } = data;
+    const { capability, theme, maturityColours, readOnly, isDropTarget, hasChildren, hasHiddenChildren, isCollapsed } = data;
     const maturity = latestMaturityLevel(capability);
     const dotColour = maturity !== undefined ? maturityColours[maturity] : undefined;
     return (_jsxs("div", { style: {
@@ -53,14 +53,15 @@ const CapabilityCardNode = memo(({ data }) => {
                     position: 'absolute', bottom: -8, right: -8, width: 16, height: 16,
                     borderRadius: '50%', border: '1px solid #fca5a5', background: '#ffffff',
                     color: '#dc2626', fontSize: 11, lineHeight: '14px', padding: 0, cursor: 'pointer',
-                }, children: "\u00D7" })), hasHiddenChildren && (_jsx("button", { type: "button", "aria-label": isCollapsed ? 'Expand branch' : 'Collapse branch', title: isCollapsed ? 'Expand branch' : 'Collapse branch', onClick: (e) => {
+                }, children: "\u00D7" })), (hasChildren || hasHiddenChildren) && (_jsx("button", { type: "button", "aria-label": isCollapsed || hasHiddenChildren ? 'Expand branch' : 'Collapse branch', title: isCollapsed || hasHiddenChildren ? 'Expand branch' : 'Collapse branch', onClick: (e) => {
                     e.stopPropagation();
                     data.onToggleCollapse(capability.id);
                 }, style: {
                     position: 'absolute', top: '50%', right: -8, transform: 'translateY(-50%)',
                     width: 16, height: 16, borderRadius: '50%', border: `1px solid ${theme.cardBorderColor}`,
-                    background: '#ffffff', color: theme.cardBorderColor, fontSize: 11, lineHeight: '14px', padding: 0, cursor: 'pointer',
-                }, children: isCollapsed ? '+' : '−' }))] }));
+                    background: '#ffffff', color: theme.cardBorderColor, fontSize: 11, lineHeight: '14px', padding: 0,
+                    cursor: 'pointer', zIndex: 10,
+                }, children: isCollapsed || hasHiddenChildren ? '+' : '−' }))] }));
 });
 CapabilityCardNode.displayName = 'CapabilityCardNode';
 export default CapabilityCardNode;

package/dist/capability-map/CapabilityMapView.js

@@ -101,6 +101,7 @@ function CapabilityMapViewInner({ map, layout: layoutProp, layoutOptions, theme:
                 maturityColours,
                 readOnly,
                 isDropTarget: hoveredId === n.id,
+                hasChildren: n.hasChildren,
                 hasHiddenChildren: n.hasHiddenChildren,
                 isCollapsed: collapsedIds.has(n.id),
                 onAddChild,

package/dist/capability-map/dsm-layout.js

@@ -68,11 +68,12 @@ export function layoutCapabilityMap(map, options = {}) {
         const cap = byId.get(id);
         const allChildIds = children.get(id) ?? [];
         const childIds = allChildIds.filter((c) => !hiddenSubtrees.has(c));
+        const hasChildren = allChildIds.length > 0;
         const hasHiddenChildren = childIds.length < allChildIds.length;
         if (childIds.length === 0) {
             const y = getNextY(col);
             advanceY(col, nodeHeight + nodeSep);
-            nodes.push({ id, x: col * (nodeWidth + rankSep), y, width: nodeWidth, height: nodeHeight, data: cap, hasHiddenChildren });
+            nodes.push({ id, x: col * (nodeWidth + rankSep), y, width: nodeWidth, height: nodeHeight, data: cap, hasChildren, hasHiddenChildren });
             return { top: y, bottom: y + nodeHeight };
         }
         const spans = childIds.map((cid) => placeSubtree(cid, col + 1));
@@ -82,7 +83,7 @@ export function layoutCapabilityMap(map, options = {}) {
         const curColY = getNextY(col);
         const finalY = Math.max(parentY, curColY);
         advanceY(col, finalY - curColY + nodeHeight + nodeSep);
-        nodes.push({ id, x: col * (nodeWidth + rankSep), y: finalY, width: nodeWidth, height: nodeHeight, data: cap, hasHiddenChildren });
+        nodes.push({ id, x: col * (nodeWidth + rankSep), y: finalY, width: nodeWidth, height: nodeHeight, data: cap, hasChildren, hasHiddenChildren });
         for (const cid of childIds)
             edges.push({ source: id, target: cid });
         return { top: Math.min(finalY, spanTop), bottom: Math.max(finalY + nodeHeight, spanBottom) };
@@ -95,7 +96,7 @@ export function layoutCapabilityMap(map, options = {}) {
             columnNextY.set(col, y + nodeSep);
     }
     if (nodes.length === 0) {
-        const rootNode = { id: 0, x: 0, y: 0, width: ROOT_WIDTH, height: nodeHeight, data: null, hasHiddenChildren: false };
+        const rootNode = { id: 0, x: 0, y: 0, width: ROOT_WIDTH, height: nodeHeight, data: null, hasChildren: false, hasHiddenChildren: false };
         return { rootNode, nodes: [], edges: [], bounds: { x: 0, y: 0, width: ROOT_WIDTH, height: nodeHeight } };
     }
     const minX = Math.min(...nodes.map((n) => n.x));
@@ -107,7 +108,7 @@ export function layoutCapabilityMap(map, options = {}) {
     const rootTop = Math.min(...l1Nodes.map((n) => n.y));
     const rootBottom = Math.max(...l1Nodes.map((n) => n.y + n.height));
     const rootY = rootTop + (rootBottom - rootTop) / 2 - nodeHeight / 2;
-    const rootNode = { id: 0, x: 0, y: rootY, width: ROOT_WIDTH, height: nodeHeight, data: null, hasHiddenChildren: false };
+    const rootNode = { id: 0, x: 0, y: rootY, width: ROOT_WIDTH, height: nodeHeight, data: null, hasChildren: l1Ids.length > 0, hasHiddenChildren: false };
     const rootEdges = l1Ids
         .filter((id) => !hiddenSubtrees.has(id))
         .map((id) => ({ source: 'root', target: id }));

package/dist/capability-map/dsm-schema.d.ts

@@ -52,6 +52,7 @@ export interface LaidOutNode {
     width: number;
     height: number;
     data: Capability | null;
+    hasChildren: boolean;
     hasHiddenChildren: boolean;
 }
 export interface LaidOutEdge {

package/dist/edge-path.d.ts

@@ -6,6 +6,18 @@
 export declare const EDGE_MIN_HANDLE = 64;
 /** Multiplier applied to the base handle length. 1 = historical appearance. */
 export declare const DEFAULT_EDGE_CURVATURE = 1;
+/** Path shape for Goals / DGCA / DGA preview edges. Default matches today's cubic. */
+export type EdgeStyle = 'straight' | 'bezier' | 'polyline';
+export declare const DEFAULT_EDGE_STYLE: EdgeStyle;
+export declare function parseEdgeStyle(v: unknown): EdgeStyle;
+/** Straight segment — the arrowhead follows the chord, not the node edge. */
+export declare function straightEdgePath(sx: number, sy: number, tx: number, ty: number): string;
+/**
+ * Orthogonal (Manhattan) polyline: horizontal out, vertical, horizontal in.
+ * The last segment is horizontal so `marker-end` still meets the node's
+ * vertical edge the same way the cubic does.
+ */
+export declare function orthogonalEdgePath(sx: number, sy: number, tx: number, ty: number): string;
 /**
  * Builds the SVG `d` for a horizontal-tangent cubic Bézier from (sx,sy) to
  * (tx,ty).
@@ -35,3 +47,8 @@ export declare function horizontalCubicEdgePath(sx: number, sy: number, tx: numb
  * it — see `render-activities.ts`'s `blockingNodes`/`bowY` for the margin.
  */
 export declare function bowedCubicEdgePath(sx: number, sy: number, tx: number, ty: number, bowY: number, curvature?: number): string;
+/**
+ * Picks the SVG `d` for a Goals / DGCA / DGA preview edge.
+ * Unknown styles fall back to the historical cubic.
+ */
+export declare function previewEdgePath(sx: number, sy: number, tx: number, ty: number, style?: EdgeStyle, curvature?: number, entryCurvature?: number): string;

package/dist/edge-path.js

@@ -1,8 +1,7 @@
 // Shared edge geometry for the static notation previews (Goals, FGCA, FGA,
-// Activities). All four render dependency/relationship edges as a single cubic
-// Bézier with horizontal control handles: each control point shares its
-// endpoint's Y, so the tangent is horizontal at both ends and the marker-end
-// arrow reads as perpendicular to the node's vertical edge.
+// Activities). The default path is a cubic Bézier with horizontal control
+// handles so the marker-end arrow sits flush on the node's vertical edge.
+// Goals / DGCA / DGA can switch to a straight chord or an orthogonal polyline.
 //
 // Pulling the path math here (rather than duplicating it inline in each
 // preview) makes the configurable-curvature behaviour
@@ -26,6 +25,25 @@ const DY_FACTOR = 0.8;
 const MAX_HANDLE = 160;
 /** Multiplier applied to the base handle length. 1 = historical appearance. */
 export const DEFAULT_EDGE_CURVATURE = 1;
+export const DEFAULT_EDGE_STYLE = 'bezier';
+export function parseEdgeStyle(v) {
+    if (v === 'straight' || v === 'bezier' || v === 'polyline')
+        return v;
+    return DEFAULT_EDGE_STYLE;
+}
+/** Straight segment — the arrowhead follows the chord, not the node edge. */
+export function straightEdgePath(sx, sy, tx, ty) {
+    return `M${sx},${sy} L${tx},${ty}`;
+}
+/**
+ * Orthogonal (Manhattan) polyline: horizontal out, vertical, horizontal in.
+ * The last segment is horizontal so `marker-end` still meets the node's
+ * vertical edge the same way the cubic does.
+ */
+export function orthogonalEdgePath(sx, sy, tx, ty) {
+    const midX = sx + (tx - sx) / 2;
+    return `M${sx},${sy} H${midX} V${ty} H${tx}`;
+}
 /**
  * Builds the SVG `d` for a horizontal-tangent cubic Bézier from (sx,sy) to
  * (tx,ty).
@@ -66,3 +84,14 @@ export function bowedCubicEdgePath(sx, sy, tx, ty, bowY, curvature = DEFAULT_EDG
     const handle = Math.max(EDGE_MIN_HANDLE, Math.min(Math.abs(dx) * DX_FACTOR, MAX_HANDLE)) * curvature;
     return `M${sx},${sy} C${sx + handle},${bowY} ${tx - handle},${bowY} ${tx},${ty}`;
 }
+/**
+ * Picks the SVG `d` for a Goals / DGCA / DGA preview edge.
+ * Unknown styles fall back to the historical cubic.
+ */
+export function previewEdgePath(sx, sy, tx, ty, style = DEFAULT_EDGE_STYLE, curvature = DEFAULT_EDGE_CURVATURE, entryCurvature) {
+    if (style === 'straight')
+        return straightEdgePath(sx, sy, tx, ty);
+    if (style === 'polyline')
+        return orthogonalEdgePath(sx, sy, tx, ty);
+    return horizontalCubicEdgePath(sx, sy, tx, ty, curvature, entryCurvature);
+}

package/dist/fgca/index.d.ts

@@ -1,6 +1,6 @@
 export { buildFGCALayout, NODE_WIDTH, NODE_HEIGHT, COLUMN_GAP, ROW_GAP, COLUMN_BG } from "./layout";
 export type { FGCALayoutInput } from "./layout";
-export { layoutFGCAPreview, selectScopedFGCA, FGCA_NODE_W, FGCA_NODE_H, FGCA_HEADER_H, FGCA_PAD, FGCA_DEFAULT_COL_GAP, FGCA_DEFAULT_ROW_GAP, } from "./preview-layout";
+export { layoutFGCAPreview, selectScopedFGCA, chainColumnOptions, sanitizeChainScope, FGCA_NODE_W, FGCA_NODE_H, FGCA_HEADER_H, FGCA_PAD, FGCA_DEFAULT_COL_GAP, FGCA_DEFAULT_ROW_GAP, } from "./preview-layout";
 export type { FGCAPreviewColumn, FGCAPreviewDoc, FGCAPreviewLayout, FGCAPreviewLayoutOptions, FGCAPreviewNode, FGCAPreviewEdge, FGCAPreviewColumnPos, } from "./preview-layout";
 export { buildChainTable } from "./chain-table";
 export type { ChainTable, ChainTableCell, ChainColumn, ChainCell, ChainTableOptions } from "./chain-table";

package/dist/fgca/index.js

@@ -1,5 +1,5 @@
 export { buildFGCALayout, NODE_WIDTH, NODE_HEIGHT, COLUMN_GAP, ROW_GAP, COLUMN_BG } from "./layout.js";
-export { layoutFGCAPreview, selectScopedFGCA, FGCA_NODE_W, FGCA_NODE_H, FGCA_HEADER_H, FGCA_PAD, FGCA_DEFAULT_COL_GAP, FGCA_DEFAULT_ROW_GAP, } from "./preview-layout.js";
+export { layoutFGCAPreview, selectScopedFGCA, chainColumnOptions, sanitizeChainScope, FGCA_NODE_W, FGCA_NODE_H, FGCA_HEADER_H, FGCA_PAD, FGCA_DEFAULT_COL_GAP, FGCA_DEFAULT_ROW_GAP, } from "./preview-layout.js";
 export { buildChainTable } from "./chain-table.js";
 export { validateFGCADoc } from "./validate.js";
 export { ALL_FGCA_COLUMNS, FGCA_COLUMN_LABELS, } from "./types.js";

package/dist/fgca/preview-layout.d.ts

@@ -1,4 +1,4 @@
-import type { Scope } from '../scope.js';
+import type { ChainColumnKey, ChainScope, FgcaScope } from '../scope.js';
 export type FGCAPreviewColumn = 'driver' | 'goal' | 'change' | 'activity';
 export interface FGCAPreviewFactor {
     id: number | string;
@@ -37,26 +37,46 @@ export interface FGCAPreviewLayoutOptions {
     colGap?: number;
     /** Vertical gap (px) between stacked nodes within a column. Default matches the historical hardcoded value. */
     rowGap?: number;
-    /** Trim to a level cap or a single root goal. Defaults to 'all'. */
-    scope?: Scope;
+    /** Trim to a level cap, a single root goal, or per-column chain filters. Defaults to 'all'. */
+    scope?: FgcaScope;
     /** Entity node width (px). Default {@link FGCA_NODE_W}. */
     nodeWidth?: number;
     /** Entity node height (px). Default {@link FGCA_NODE_H}. */
     nodeHeight?: number;
 }
+/**
+ * Dropdown options for one chain column, cascaded from the other selected
+ * filters (this column's own filter is ignored so the user can still switch it).
+ */
+export declare function chainColumnOptions(doc: FGCAPreviewDoc, scope: ChainScope, column: ChainColumnKey, hideChanges?: boolean): Array<{
+    id: string;
+    name: string;
+}>;
+/**
+ * Drop column filters that are no longer reachable given the others.
+ * `justChanged` is kept even when incompatible — the last pick wins, neighbours yield.
+ */
+export declare function sanitizeChainScope(doc: FGCAPreviewDoc, scope: ChainScope, opts?: {
+    justChanged?: ChainColumnKey;
+    hideChanges?: boolean;
+}): ChainScope;
 /**
  * Trims a DGCA/DGA doc to a scope.
  *
  * DGCA/DGA goals are flat (no parent_id), so:
  *   - 'level' → goals with `(level ?? 0) <= maxLevel`.
  *   - 'root'  → the single goal whose id matches `rootGoalId` (empty when absent).
+ *   - 'chain' → AND of per-column ids (Driver / Goal / Change / Action); empty
+ *               ids are All. DGA passes hideChanges so a Change filter is ignored.
  *
  * Factors, changes and activities are then kept only when they touch a visible
  * goal: a factor referenced by a visible goal, a change whose `goal_id` is
  * visible, an activity bound to a visible goal directly or via a visible
  * change. Pure and exported so an access-control layer can reuse it.
  */
-export declare function selectScopedFGCA(doc: FGCAPreviewDoc, scope: Scope): FGCAPreviewDoc;
+export declare function selectScopedFGCA(doc: FGCAPreviewDoc, scope: FgcaScope, opts?: {
+    hideChanges?: boolean;
+}): FGCAPreviewDoc;
 export interface FGCAPreviewNode {
     id: string;
     x: number;

package/dist/fgca/preview-layout.js

@@ -6,22 +6,198 @@
 // so the gap geometry is unit-testable: the extension has no test harness.
 //
 // No React, no DOM, no vscode. Safe to call in Node.js or a test environment.
+import { isChainScope } from '../scope.js';
 import { ENTITY_NODE_SIZE } from '../node-size-presets.js';
+function sid(id) {
+    return String(id);
+}
+/**
+ * Every Driver–Goal–Change–Action thread in the document, plus a singleton
+ * path for any entity that is not on a connected thread (orphans). Used to
+ * AND column filters: a node stays visible when it appears on at least one
+ * path that includes every selected id.
+ */
+function enumerateChainPaths(doc) {
+    const paths = [];
+    const seen = {
+        driver: new Set(),
+        goal: new Set(),
+        change: new Set(),
+        activity: new Set(),
+    };
+    const mark = (p) => {
+        paths.push(p);
+        if (p.driverId)
+            seen.driver.add(p.driverId);
+        if (p.goalId)
+            seen.goal.add(p.goalId);
+        if (p.changeId)
+            seen.change.add(p.changeId);
+        if (p.activityId)
+            seen.activity.add(p.activityId);
+    };
+    const changes = doc.changes ?? [];
+    for (const g of doc.goals) {
+        const goalId = sid(g.id);
+        const driverIds = (g.factor ?? []).map(f => sid(f.id));
+        const drivers = driverIds.length > 0 ? driverIds : [undefined];
+        const goalChanges = changes.filter(c => sid(c.goal_id) === goalId);
+        const coveredActs = new Set(goalChanges.flatMap(c => c.activity_ids.map(sid)));
+        const directActs = doc.activities.filter(a => a.goal_id != null && sid(a.goal_id) === goalId && !coveredActs.has(sid(a.id)));
+        const slots = [];
+        for (const c of goalChanges) {
+            const acts = c.activity_ids.map(sid);
+            slots.push({ changeId: sid(c.id), activityIds: acts.length > 0 ? acts : [undefined] });
+        }
+        for (const a of directActs) {
+            slots.push({ changeId: undefined, activityIds: [sid(a.id)] });
+        }
+        if (slots.length === 0) {
+            slots.push({ changeId: undefined, activityIds: [undefined] });
+        }
+        for (const d of drivers) {
+            for (const slot of slots) {
+                for (const a of slot.activityIds) {
+                    mark({ driverId: d, goalId, changeId: slot.changeId, activityId: a });
+                }
+            }
+        }
+    }
+    for (const f of doc.factors) {
+        const id = sid(f.id);
+        if (!seen.driver.has(id))
+            mark({ driverId: id });
+    }
+    for (const g of doc.goals) {
+        const id = sid(g.id);
+        if (!seen.goal.has(id))
+            mark({ goalId: id });
+    }
+    for (const c of changes) {
+        const id = sid(c.id);
+        if (!seen.change.has(id))
+            mark({ changeId: id, goalId: sid(c.goal_id) });
+    }
+    for (const a of doc.activities) {
+        const id = sid(a.id);
+        if (!seen.activity.has(id)) {
+            mark({ activityId: id, goalId: a.goal_id != null ? sid(a.goal_id) : undefined });
+        }
+    }
+    return paths;
+}
+function selectChainScopedFGCA(doc, scope, hideChanges) {
+    const driverId = scope.driverId || undefined;
+    const goalId = scope.goalId || undefined;
+    const changeId = hideChanges ? undefined : (scope.changeId || undefined);
+    const activityId = scope.activityId || undefined;
+    if (!driverId && !goalId && !changeId && !activityId)
+        return doc;
+    const matched = enumerateChainPaths(doc).filter(p => {
+        if (driverId && p.driverId !== driverId)
+            return false;
+        if (goalId && p.goalId !== goalId)
+            return false;
+        if (changeId && p.changeId !== changeId)
+            return false;
+        if (activityId && p.activityId !== activityId)
+            return false;
+        return true;
+    });
+    const driverIds = new Set();
+    const goalIds = new Set();
+    const changeIds = new Set();
+    const activityIds = new Set();
+    for (const p of matched) {
+        if (p.driverId)
+            driverIds.add(p.driverId);
+        if (p.goalId)
+            goalIds.add(p.goalId);
+        if (p.changeId)
+            changeIds.add(p.changeId);
+        if (p.activityId)
+            activityIds.add(p.activityId);
+    }
+    return {
+        factors: doc.factors.filter(f => driverIds.has(sid(f.id))),
+        goals: doc.goals.filter(g => goalIds.has(sid(g.id))),
+        changes: doc.changes === undefined ? undefined : doc.changes.filter(c => changeIds.has(sid(c.id))),
+        activities: doc.activities.filter(a => activityIds.has(sid(a.id))),
+    };
+}
+const CHAIN_COLUMN_KEYS = ['driverId', 'goalId', 'changeId', 'activityId'];
+function columnEntities(doc, column) {
+    if (column === 'driverId')
+        return doc.factors.map(f => ({ id: sid(f.id), name: f.name ?? '' }));
+    if (column === 'goalId')
+        return doc.goals.map(g => ({ id: sid(g.id), name: g.name ?? '' }));
+    if (column === 'changeId')
+        return (doc.changes ?? []).map(c => ({ id: sid(c.id), name: c.name ?? '' }));
+    return doc.activities.map(a => ({ id: sid(a.id), name: a.name ?? '' }));
+}
+/**
+ * Dropdown options for one chain column, cascaded from the other selected
+ * filters (this column's own filter is ignored so the user can still switch it).
+ */
+export function chainColumnOptions(doc, scope, column, hideChanges = false) {
+    if (hideChanges && column === 'changeId')
+        return [];
+    const withoutSelf = { ...scope, mode: 'chain', [column]: undefined };
+    const filtered = selectChainScopedFGCA(doc, withoutSelf, hideChanges);
+    return columnEntities(filtered, column);
+}
+/**
+ * Drop column filters that are no longer reachable given the others.
+ * `justChanged` is kept even when incompatible — the last pick wins, neighbours yield.
+ */
+export function sanitizeChainScope(doc, scope, opts = {}) {
+    const next = {
+        mode: 'chain',
+        driverId: scope.driverId || undefined,
+        goalId: scope.goalId || undefined,
+        changeId: opts.hideChanges ? undefined : (scope.changeId || undefined),
+        activityId: scope.activityId || undefined,
+    };
+    let changed = true;
+    while (changed) {
+        changed = false;
+        for (const key of CHAIN_COLUMN_KEYS) {
+            if (key === opts.justChanged)
+                continue;
+            if (opts.hideChanges && key === 'changeId')
+                continue;
+            const id = next[key];
+            if (!id)
+                continue;
+            const available = new Set(chainColumnOptions(doc, next, key, opts.hideChanges).map(o => o.id));
+            if (!available.has(id)) {
+                next[key] = undefined;
+                changed = true;
+            }
+        }
+    }
+    return next;
+}
 /**
  * Trims a DGCA/DGA doc to a scope.
  *
  * DGCA/DGA goals are flat (no parent_id), so:
  *   - 'level' → goals with `(level ?? 0) <= maxLevel`.
  *   - 'root'  → the single goal whose id matches `rootGoalId` (empty when absent).
+ *   - 'chain' → AND of per-column ids (Driver / Goal / Change / Action); empty
+ *               ids are All. DGA passes hideChanges so a Change filter is ignored.
  *
  * Factors, changes and activities are then kept only when they touch a visible
  * goal: a factor referenced by a visible goal, a change whose `goal_id` is
  * visible, an activity bound to a visible goal directly or via a visible
  * change. Pure and exported so an access-control layer can reuse it.
  */
-export function selectScopedFGCA(doc, scope) {
+export function selectScopedFGCA(doc, scope, opts = {}) {
     if (scope.mode === 'all')
         return doc;
+    if (isChainScope(scope)) {
+        return selectChainScopedFGCA(doc, scope, opts.hideChanges === true);
+    }
     const visibleGoals = scope.mode === 'level'
         ? doc.goals.filter(g => (g.level ?? 0) <= scope.maxLevel)
         : doc.goals.filter(g => String(g.id) === scope.rootGoalId);
@@ -50,7 +226,7 @@ export const FGCA_DEFAULT_ROW_GAP = 20;
 export function layoutFGCAPreview(inputDoc, options = {}) {
     const { hideChanges = false, colGap = FGCA_DEFAULT_COL_GAP, rowGap = FGCA_DEFAULT_ROW_GAP, scope = { mode: 'all' }, nodeWidth = FGCA_NODE_W, nodeHeight = FGCA_NODE_H, } = options;
     // Trim to scope first; everything below lays out the visible subset only.
-    const doc = selectScopedFGCA(inputDoc, scope);
+    const doc = selectScopedFGCA(inputDoc, scope, { hideChanges });
     const colStride = nodeWidth + colGap;
     const cols = hideChanges
         ? ['driver', 'goal', 'activity']

package/dist/goals/GoalNode.d.ts

@@ -6,6 +6,7 @@ export interface GoalNodeData {
     theme: Required<ThemeTokens>;
     readOnly: boolean;
     isDropTarget: boolean;
+    hasChildren: boolean;
     hasHiddenChildren: boolean;
     isCollapsed: boolean;
     onAddChild: (parentId: number, parentLevel: number) => void;

package/dist/goals/GoalNode.js

@@ -13,7 +13,7 @@ function impactSign(f) {
     return 'negative';
 }
 const GoalNode = memo(({ data }) => {
-    const { goal, theme, readOnly, isDropTarget, hasHiddenChildren, isCollapsed } = data;
+    const { goal, theme, readOnly, isDropTarget, hasChildren, hasHiddenChildren, isCollapsed } = data;
     const [openPanel, setOpenPanel] = useState(null);
     const positive = (goal.factors ?? []).filter((f) => impactSign(f) !== 'negative');
     const negative = (goal.factors ?? []).filter((f) => impactSign(f) !== 'positive');
@@ -83,14 +83,15 @@ const GoalNode = memo(({ data }) => {
                     position: 'absolute', bottom: -8, right: -8, width: 16, height: 16,
                     borderRadius: '50%', border: '1px solid #fca5a5', background: '#ffffff',
                     color: '#dc2626', fontSize: 11, lineHeight: '14px', padding: 0, cursor: 'pointer',
-                }, children: "\u00D7" })), hasHiddenChildren && (_jsx("button", { type: "button", "aria-label": isCollapsed ? 'Expand branch' : 'Collapse branch', title: isCollapsed ? 'Expand branch' : 'Collapse branch', onClick: (e) => {
+                }, children: "\u00D7" })), (hasChildren || hasHiddenChildren) && (_jsx("button", { type: "button", "aria-label": isCollapsed || hasHiddenChildren ? 'Expand branch' : 'Collapse branch', title: isCollapsed || hasHiddenChildren ? 'Expand branch' : 'Collapse branch', onClick: (e) => {
                     e.stopPropagation();
                     data.onToggleCollapse(goal.id);
                 }, style: {
                     position: 'absolute', top: '50%', right: -8, transform: 'translateY(-50%)',
                     width: 16, height: 16, borderRadius: '50%', border: `1px solid ${theme.cardBorderColor}`,
-                    background: '#ffffff', color: theme.cardBorderColor, fontSize: 11, lineHeight: '14px', padding: 0, cursor: 'pointer',
-                }, children: isCollapsed ? '+' : '−' }))] }));
+                    background: '#ffffff', color: theme.cardBorderColor, fontSize: 11, lineHeight: '14px', padding: 0,
+                    cursor: 'pointer', zIndex: 10,
+                }, children: isCollapsed || hasHiddenChildren ? '+' : '−' }))] }));
 });
 GoalNode.displayName = 'GoalNode';
 export default GoalNode;

package/dist/goals/GoalTreeView.js

@@ -122,6 +122,7 @@ function GoalTreeViewInner({ tree, layout: layoutProp, layoutOptions, theme: the
                 theme,
                 readOnly,
                 isDropTarget: hoveredId === n.id,
+                hasChildren: n.hasChildren,
                 hasHiddenChildren: n.hasHiddenChildren,
                 isCollapsed: collapsedIds.has(n.id),
                 onAddChild,

package/dist/goals/layout.js

@@ -100,14 +100,16 @@ export function layoutGoalTree(tree, options = {}) {
             return { top: 0, bottom: 0 };
         placed.add(id);
         const col = levelToCol.get(goal.level) ?? 0;
-        const childIds = (children.get(id) ?? []).filter(c => !hiddenSubtrees.has(c) && !placed.has(c));
-        const isCollapsedRoot = hiddenSet.has(id) && childIds.length > 0;
-        const hasHiddenChildren = childIds.length < (children.get(id) ?? []).length;
+        const allChildIds = children.get(id) ?? [];
+        const childIds = allChildIds.filter(c => !hiddenSubtrees.has(c) && !placed.has(c));
+        const isCollapsedRoot = hiddenSet.has(id) && allChildIds.length > 0;
+        const hasChildren = allChildIds.length > 0;
+        const hasHiddenChildren = childIds.length < allChildIds.length;
         if (childIds.length === 0) {
             // Leaf: place at current column Y
             const y = getNextY(col);
             advanceY(col, nodeHeight + nodeSep);
-            nodes.push({ id, x: col * (nodeWidth + rankSep), y, width: nodeWidth, height: nodeHeight, data: goal, isCollapsedRoot, hasHiddenChildren });
+            nodes.push({ id, x: col * (nodeWidth + rankSep), y, width: nodeWidth, height: nodeHeight, data: goal, isCollapsedRoot, hasChildren, hasHiddenChildren });
             return { top: y, bottom: y + nodeHeight };
         }
         // Place children first to get their span
@@ -122,7 +124,7 @@ export function layoutGoalTree(tree, options = {}) {
         const curColY = getNextY(col);
         const finalY = Math.max(parentY, curColY);
         advanceY(col, finalY - curColY + nodeHeight + nodeSep);
-        nodes.push({ id, x: col * (nodeWidth + rankSep), y: finalY, width: nodeWidth, height: nodeHeight, data: goal, isCollapsedRoot, hasHiddenChildren });
+        nodes.push({ id, x: col * (nodeWidth + rankSep), y: finalY, width: nodeWidth, height: nodeHeight, data: goal, isCollapsedRoot, hasChildren, hasHiddenChildren });
         for (const cid of childIds) {
             edges.push({ source: id, target: cid });
         }

package/dist/goals/types.d.ts

@@ -55,6 +55,8 @@ export interface LaidOutNode {
     height: number;
     data: Goal;
     isCollapsedRoot: boolean;
+    /** True when this node has at least one child in the source tree (visible or hidden). */
+    hasChildren: boolean;
     hasHiddenChildren: boolean;
 }
 export interface LaidOutEdge {

package/dist/scope.d.ts

@@ -8,10 +8,26 @@ export type Scope = {
     mode: 'root';
     rootGoalId: string;
 };
+/** Column filters on a DGCA/DGA chain. Empty / omitted id = All for that column. */
+export type ChainColumnKey = 'driverId' | 'goalId' | 'changeId' | 'activityId';
+export type ChainScope = {
+    mode: 'chain';
+    driverId?: string;
+    goalId?: string;
+    changeId?: string;
+    activityId?: string;
+};
+/** Scope accepted by DGCA/DGA layout — Goals tree still uses {@link Scope} only. */
+export type FgcaScope = Scope | ChainScope;
 /** Default scope — render everything. */
 export declare const SCOPE_ALL: Scope;
+export declare function isChainScope(scope: FgcaScope): scope is ChainScope;
+/** True when at least one column filter is set. */
+export declare function chainScopeActive(scope: ChainScope): boolean;
 /** Warning code emitted when a root-mode scope names a goal that isn't in the document. */
 export declare const SCOPE_MISSING_ROOT_CODE = "SCOPE-001";
+/** Warning code emitted when a chain-column filter names an id that isn't in the document. */
+export declare const SCOPE_MISSING_CHAIN_CODE = "SCOPE-002";
 /**
  * Returns the SCOPE-001 warning when `scope` is root-mode and `rootGoalId` is
  * not among the document's goal ids; otherwise null. Goal ids are compared as
@@ -21,3 +37,14 @@ export declare const SCOPE_MISSING_ROOT_CODE = "SCOPE-001";
  * functions independently return an empty layout in the same situation.
  */
 export declare function checkScopeRoot(scope: Scope, goalIds: Iterable<string | number>): ValidationWarning | null;
+/**
+ * Returns a SCOPE-002 warning when a chain filter names an id that is not in
+ * the document's corresponding column; otherwise null. Several missing ids
+ * are listed in one message.
+ */
+export declare function checkChainScope(scope: ChainScope, ids: {
+    drivers: Iterable<string | number>;
+    goals: Iterable<string | number>;
+    changes: Iterable<string | number>;
+    activities: Iterable<string | number>;
+}, hideChanges?: boolean): ValidationWarning | null;

package/dist/scope.js

@@ -14,8 +14,17 @@
 // subtree root and reuse exactly this filter. No RBAC here — just the filter.
 /** Default scope — render everything. */
 export const SCOPE_ALL = { mode: 'all' };
+export function isChainScope(scope) {
+    return scope.mode === 'chain';
+}
+/** True when at least one column filter is set. */
+export function chainScopeActive(scope) {
+    return !!(scope.driverId || scope.goalId || scope.changeId || scope.activityId);
+}
 /** Warning code emitted when a root-mode scope names a goal that isn't in the document. */
 export const SCOPE_MISSING_ROOT_CODE = 'SCOPE-001';
+/** Warning code emitted when a chain-column filter names an id that isn't in the document. */
+export const SCOPE_MISSING_CHAIN_CODE = 'SCOPE-002';
 /**
  * Returns the SCOPE-001 warning when `scope` is root-mode and `rootGoalId` is
  * not among the document's goal ids; otherwise null. Goal ids are compared as
@@ -36,3 +45,34 @@ export function checkScopeRoot(scope, goalIds) {
         message: `Scope root goal "${scope.rootGoalId}" was not found in this document — nothing to show. Clear the scope or pick a goal that exists.`,
     };
 }
+function idSetHas(ids, want) {
+    for (const id of ids) {
+        if (String(id) === want)
+            return true;
+    }
+    return false;
+}
+/**
+ * Returns a SCOPE-002 warning when a chain filter names an id that is not in
+ * the document's corresponding column; otherwise null. Several missing ids
+ * are listed in one message.
+ */
+export function checkChainScope(scope, ids, hideChanges = false) {
+    if (scope.mode !== 'chain')
+        return null;
+    const missing = [];
+    if (scope.driverId && !idSetHas(ids.drivers, scope.driverId))
+        missing.push(`driver "${scope.driverId}"`);
+    if (scope.goalId && !idSetHas(ids.goals, scope.goalId))
+        missing.push(`goal "${scope.goalId}"`);
+    if (!hideChanges && scope.changeId && !idSetHas(ids.changes, scope.changeId))
+        missing.push(`change "${scope.changeId}"`);
+    if (scope.activityId && !idSetHas(ids.activities, scope.activityId))
+        missing.push(`action "${scope.activityId}"`);
+    if (missing.length === 0)
+        return null;
+    return {
+        code: SCOPE_MISSING_CHAIN_CODE,
+        message: `Scope ${missing.join(', ')} was not found in this document — nothing to show for that filter. Clear the scope or pick an id that exists.`,
+    };
+}