@burdenoff/microfe-planmagnet 2026.930.21 → 2026.930.23

package/dist/planmagnet/controls/FeatureControls.js

@@ -2,8 +2,8 @@ import { usePlanMagnetNavigate as e } from "../providers/PlanMagnetProvider.js";
 import { LEAVES_PAGE_CONTEXT as t, throwOnError as n } from "../utils/mutationResult.js";
 import { ConfirmButton as r, ErrorLine as i } from "./ConfirmButton.js";
 import { enumLabel as a } from "./WorkItemControls.js";
-import { ProjectSelect as o, WorkItemSearchSelect as s } from "./Pickers.js";
-import { detailPath as c } from "../utils/rowNavigation.js";
+import { detailPath as o } from "../utils/rowNavigation.js";
+import { ProjectSelect as s, WorkItemSearchSelect as c } from "./Pickers.js";
 import { parseIntField as l } from "../utils/formValidation.js";
 import { useState as u } from "react";
 import { BarChart3 as d, Pencil as f, ThumbsUp as p, Trash2 as m } from "lucide-react";
@@ -81,15 +81,15 @@ function F({ featureId: e, voted: t }) {
 		}), c && /* @__PURE__ */ _(i, { message: c })]
 	});
 }
-function I({ feature: o }) {
-	let s = e(), [l, f] = g(M, P), [p, h] = g(N, {
+function I({ feature: s }) {
+	let c = e(), [l, f] = g(M, P), [p, h] = g(N, {
 		refetchQueries: k.filter((e) => e !== "GetFeatureRequest"),
 		context: t
-	}), [b, x] = u(null), S = f.loading || h.loading, C = O.includes(o.status) ? O : [o.status, ...O], w = async (e) => {
+	}), [b, x] = u(null), S = f.loading || h.loading, C = O.includes(s.status) ? O : [s.status, ...O], w = async (e) => {
 		x(null);
 		try {
 			await n(l({ variables: {
-				id: o.id,
+				id: s.id,
 				input: { status: e }
 			} }));
 		} catch (e) {
@@ -98,7 +98,7 @@ function I({ feature: o }) {
 	}, T = async () => {
 		x(null);
 		try {
-			await n(p({ variables: { id: o.id } })), s("/products/features-page");
+			await n(p({ variables: { id: s.id } })), c("/products/features-page");
 		} catch (e) {
 			x(e instanceof Error ? e.message : "The request could not be deleted.");
 		}
@@ -112,29 +112,29 @@ function I({ feature: o }) {
 					"aria-label": "Status",
 					"data-testid": "feature-status",
 					className: "rounded-md border border-input bg-background px-2 py-1 text-sm disabled:opacity-60",
-					value: o.status,
+					value: s.status,
 					disabled: S,
 					onChange: (e) => {
-						e.target.value !== o.status && w(e.target.value);
+						e.target.value !== s.status && w(e.target.value);
 					},
 					children: C.map((e) => /* @__PURE__ */ _("option", {
 						value: e,
 						children: a(e)
 					}, e))
 				}),
-				/* @__PURE__ */ _(L, { feature: o }),
+				/* @__PURE__ */ _(L, { feature: s }),
 				/* @__PURE__ */ v(y, {
 					size: "sm",
 					variant: "outline",
 					"data-testid": "feature-analytics",
-					onClick: () => s(c("/products/feature-analytics-page", o.id)),
+					onClick: () => c(o("/products/feature-analytics-page", s.id)),
 					children: [/* @__PURE__ */ _(d, { className: "mr-1 h-4 w-4" }), "Analytics"]
 				}),
 				/* @__PURE__ */ _(r, {
 					label: "Delete",
 					variant: "outline",
 					icon: /* @__PURE__ */ _(m, { className: "mr-1 h-4 w-4" }),
-					title: `Delete "${o.title}"?`,
+					title: `Delete "${s.title}"?`,
 					description: "The request and its votes are deleted. This cannot be undone here.",
 					confirmLabel: "Delete request",
 					destructive: !0,
@@ -153,34 +153,34 @@ function L({ feature: e }) {
 		effortEstimate: e.effortEstimate ?? "",
 		projectId: e.projectId ?? "",
 		workItemId: e.workItemId ?? ""
-	}, [r, a] = u(!1), [c, d] = u(t), [p, m] = u(null), [h, O] = g(M, P), k = l(c.businessValue, {
+	}, [r, a] = u(!1), [o, d] = u(t), [p, m] = u(null), [h, O] = g(M, P), k = l(o.businessValue, {
 		min: 0,
 		max: 100
-	}), A = c.title.trim() !== "" && !k.invalid && !O.loading, j = async () => {
+	}), A = o.title.trim() !== "" && !k.invalid && !O.loading, j = async () => {
 		m(null);
 		let r = (e) => e.trim() ? e.trim() : null, i = {
-			title: c.title.trim(),
-			description: r(c.description),
+			title: o.title.trim(),
+			description: r(o.description),
 			businessValue: k.value ?? null,
-			effortEstimate: r(c.effortEstimate),
-			projectId: c.projectId || null,
-			workItemId: c.workItemId || null
-		}, o = {
+			effortEstimate: r(o.effortEstimate),
+			projectId: o.projectId || null,
+			workItemId: o.workItemId || null
+		}, s = {
 			title: t.title,
 			description: r(t.description),
 			businessValue: t.businessValue === "" ? null : Number(t.businessValue),
 			effortEstimate: r(t.effortEstimate),
 			projectId: t.projectId || null,
 			workItemId: t.workItemId || null
-		}, s = Object.fromEntries(Object.entries(i).filter(([e, t]) => t !== o[e]));
-		if (Object.keys(s).length === 0) {
+		}, c = Object.fromEntries(Object.entries(i).filter(([e, t]) => t !== s[e]));
+		if (Object.keys(c).length === 0) {
 			a(!1);
 			return;
 		}
 		try {
 			await n(h({ variables: {
 				id: e.id,
-				input: s
+				input: c
 			} })), a(!1);
 		} catch (e) {
 			m(e instanceof Error ? e.message : "The request could not be saved.");
@@ -213,9 +213,9 @@ function L({ feature: e }) {
 						}), /* @__PURE__ */ _(b, {
 							id: "feature-edit-title",
 							className: "mt-1",
-							value: c.title,
+							value: o.title,
 							onChange: (e) => d({
-								...c,
+								...o,
 								title: e.target.value
 							})
 						})] }),
@@ -226,9 +226,9 @@ function L({ feature: e }) {
 						}), /* @__PURE__ */ _("textarea", {
 							id: "feature-edit-description",
 							className: "mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm min-h-[72px]",
-							value: c.description,
+							value: o.description,
 							onChange: (e) => d({
-								...c,
+								...o,
 								description: e.target.value
 							})
 						})] }),
@@ -244,10 +244,10 @@ function L({ feature: e }) {
 								min: 0,
 								max: 100,
 								className: "mt-1",
-								value: c.businessValue,
+								value: o.businessValue,
 								"aria-invalid": k.invalid,
 								onChange: (e) => d({
-									...c,
+									...o,
 									businessValue: e.target.value
 								})
 							})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
@@ -258,9 +258,9 @@ function L({ feature: e }) {
 								id: "feature-edit-effort",
 								className: "mt-1",
 								placeholder: "e.g. M",
-								value: c.effortEstimate,
+								value: o.effortEstimate,
 								onChange: (e) => d({
-									...c,
+									...o,
 									effortEstimate: e.target.value
 								})
 							})] })]
@@ -272,12 +272,12 @@ function L({ feature: e }) {
 							children: "Project"
 						}), /* @__PURE__ */ _("div", {
 							className: "mt-1",
-							children: /* @__PURE__ */ _(o, {
+							children: /* @__PURE__ */ _(s, {
 								id: "feature-edit-project",
-								value: c.projectId,
+								value: o.projectId,
 								noneLabel: "No project",
 								onChange: (e) => d({
-									...c,
+									...o,
 									projectId: e,
 									workItemId: ""
 								})
@@ -289,12 +289,12 @@ function L({ feature: e }) {
 							children: "Delivered by work item"
 						}), /* @__PURE__ */ _("div", {
 							className: "mt-1",
-							children: /* @__PURE__ */ _(s, {
+							children: /* @__PURE__ */ _(c, {
 								id: "feature-edit-workitem",
-								projectId: c.projectId || void 0,
-								value: c.workItemId,
+								projectId: o.projectId || void 0,
+								value: o.workItemId,
 								onChange: (e) => d({
-									...c,
+									...o,
 									workItemId: e
 								})
 							})

package/dist/planmagnet/controls/ProgramControls.js

@@ -2,8 +2,8 @@ import { usePlanMagnetNavigate as e } from "../providers/PlanMagnetProvider.js";
 import { LEAVES_PAGE_CONTEXT as t, throwOnError as n } from "../utils/mutationResult.js";
 import { ConfirmButton as r, ErrorLine as i } from "./ConfirmButton.js";
 import { enumLabel as a } from "./WorkItemControls.js";
-import { ProjectSelect as o } from "./Pickers.js";
-import { detailPath as s } from "../utils/rowNavigation.js";
+import { detailPath as o } from "../utils/rowNavigation.js";
+import { ProjectSelect as s } from "./Pickers.js";
 import { PROJECT_STATUSES as c } from "./ProjectControls.js";
 import { useState as l } from "react";
 import { Pencil as u, Trash2 as d, X as f } from "lucide-react";
@@ -28,7 +28,7 @@ var v = c, y = [
     planmagnetDeleteProgram(id: $id)
   }
 `;
-function S({ programId: o, name: c, status: f }) {
+function S({ programId: s, name: c, status: f }) {
 	let p = e(), [S, C] = m(b, {
 		refetchQueries: y,
 		awaitRefetchQueries: !0
@@ -39,7 +39,7 @@ function S({ programId: o, name: c, status: f }) {
 		D(null);
 		try {
 			await n(S({ variables: {
-				id: o,
+				id: s,
 				input: { status: e }
 			} }));
 		} catch (e) {
@@ -48,7 +48,7 @@ function S({ programId: o, name: c, status: f }) {
 	}, j = async () => {
 		D(null);
 		try {
-			await n(w({ variables: { id: o } })), p("/products/programs-page");
+			await n(w({ variables: { id: s } })), p("/products/programs-page");
 		} catch (e) {
 			D(e instanceof Error ? e.message : "The program could not be deleted.");
 		}
@@ -76,7 +76,7 @@ function S({ programId: o, name: c, status: f }) {
 					size: "sm",
 					variant: "outline",
 					"data-testid": "program-edit",
-					onClick: () => p(s("/products/edit-program-page", o)),
+					onClick: () => p(o("/products/edit-program-page", s)),
 					children: [/* @__PURE__ */ h(u, { className: "mr-1 h-4 w-4" }), "Edit"]
 				}),
 				/* @__PURE__ */ h(r, {
@@ -142,7 +142,7 @@ function w({ programId: t, projects: r }) {
 					/* @__PURE__ */ h("button", {
 						type: "button",
 						className: "flex-1 text-left text-sm font-medium hover:underline underline-offset-2",
-						onClick: () => c(s("/projects/project-detail-page", e.id)),
+						onClick: () => c(o("/projects/project-detail-page", e.id)),
 						children: e.name
 					}),
 					/* @__PURE__ */ h("span", {
@@ -163,7 +163,7 @@ function w({ programId: t, projects: r }) {
 				className: "flex items-center gap-2 pt-2 border-t",
 				children: [/* @__PURE__ */ h("div", {
 					className: "flex-1",
-					children: /* @__PURE__ */ h(o, {
+					children: /* @__PURE__ */ h(s, {
 						id: "program-add-project",
 						value: u,
 						onChange: d,

package/dist/planmagnet/dependency/DependencyGraph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DependencyGraph.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/dependency/DependencyGraph.tsx"],"names":[],"mappings":"AAKA;;;;;;;;GAQG;AAEH,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,mBAAmB;IAClC,gFAAgF;IAChF,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,6FAA6F;IAC7F,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,2FAA2F;IAC3F,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,wDAAwD;IACxD,YAAY,EAAE,MAAM,CAAC;IACrB,wFAAwF;IACxF,SAAS,EAAE,MAAM,CAAC;CACnB;AAWD,uGAAuG;AACvG,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAG/D;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAaxD;AAED,wBAAgB,QAAQ,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAMjE;AA0CD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,KAAK,EACL,eAAe,EACf,eAAe,EACf,cAAc,EACd,YAAY,EACZ,SAAS,GACV,EAAE,oBAAoB,2CA0MtB"}
+{"version":3,"file":"DependencyGraph.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/dependency/DependencyGraph.tsx"],"names":[],"mappings":"AAKA;;;;;;;;GAQG;AAEH,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,mBAAmB;IAClC,gFAAgF;IAChF,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,6FAA6F;IAC7F,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,2FAA2F;IAC3F,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,wDAAwD;IACxD,YAAY,EAAE,MAAM,CAAC;IACrB,wFAAwF;IACxF,SAAS,EAAE,MAAM,CAAC;CACnB;AAWD,uGAAuG;AACvG,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAG/D;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAaxD;AAED,wBAAgB,QAAQ,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAMjE;AA0CD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,KAAK,EACL,eAAe,EACf,eAAe,EACf,cAAc,EACd,YAAY,EACZ,SAAS,GACV,EAAE,oBAAoB,2CA6MtB"}

package/dist/planmagnet/dependency/DependencyGraph.js

@@ -1,6 +1,6 @@
 import { enumLabel as e } from "../controls/WorkItemControls.js";
-import { rowLinkProps as t } from "../utils/rowNavigation.js";
-import { STATUS_LEGEND_ORDER as n, statusVisual as r } from "../utils/statusColor.js";
+import { STATUS_LEGEND_ORDER as t, statusVisual as n } from "../utils/statusColor.js";
+import { rowLinkProps as r } from "../utils/rowNavigation.js";
 import { useMemo as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/planmagnet/dependency/DependencyGraph.tsx
@@ -66,7 +66,7 @@ function y({ nodes: y, edges: b, criticalNodeIds: x, criticalEdgeIds: S, onActiv
 			width: d * 2 + a * s + Math.max(0, a - 1) * l,
 			height: d * 2 + o * c + Math.max(0, o - 1) * u
 		};
-	}, [y, b]), D = i(() => n.filter((e) => y.some((t) => t.status === e)), [y]);
+	}, [y, b]), D = i(() => t.filter((e) => y.some((t) => t.status === e)), [y]);
 	if (y.length === 0) return /* @__PURE__ */ a("div", {
 		"data-testid": "dependency-graph",
 		className: "p-6 text-center text-sm text-muted-foreground",
@@ -164,14 +164,14 @@ function y({ nodes: y, edges: b, criticalNodeIds: x, criticalEdgeIds: S, onActiv
 								]
 							}, e.id);
 						}),
-						y.map((n) => {
-							let i = E.position.get(n.id);
+						y.map((t) => {
+							let i = E.position.get(t.id);
 							if (!i) return null;
-							let l = x?.has(n.id) ?? !1, u = r(n.status), d = n.title ?? "Untitled work item", g = n.key ?? "", _ = `${g ? `${g} — ` : ""}${d} (${e(n.status)})${l ? ", on critical path" : ""}`;
+							let l = x?.has(t.id) ?? !1, u = n(t.status), d = t.title ?? "Untitled work item", g = t.key ?? "", _ = `${g ? `${g} — ` : ""}${d} (${e(t.status)})${l ? ", on critical path" : ""}`;
 							return /* @__PURE__ */ o("g", {
 								"data-testid": "dependency-graph-node",
 								transform: `translate(${i.x}, ${i.y})`,
-								...t(() => C(n.id), _),
+								...r(() => C(t.id), _),
 								className: "cursor-pointer focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2",
 								children: [
 									/* @__PURE__ */ a("title", { children: _ }),
@@ -186,7 +186,7 @@ function y({ nodes: y, edges: b, criticalNodeIds: x, criticalEdgeIds: S, onActiv
 										cx: 16,
 										cy: c / 2,
 										r: f,
-										className: u.fill
+										style: { fill: u.color }
 									}),
 									/* @__PURE__ */ a("text", {
 										x: 28,
@@ -201,7 +201,7 @@ function y({ nodes: y, edges: b, criticalNodeIds: x, criticalEdgeIds: S, onActiv
 										children: h(d, p)
 									})
 								]
-							}, n.id);
+							}, t.id);
 						})
 					]
 				})
@@ -210,7 +210,10 @@ function y({ nodes: y, edges: b, criticalNodeIds: x, criticalEdgeIds: S, onActiv
 				className: "flex flex-wrap items-center gap-x-4 gap-y-1 border-t border-input px-3 py-2 text-[11px] text-muted-foreground",
 				children: [D.map((t) => /* @__PURE__ */ o("span", {
 					className: "inline-flex items-center gap-1.5",
-					children: [/* @__PURE__ */ a("span", { className: `h-2.5 w-2.5 rounded-full ${r(t).swatch}` }), e(t)]
+					children: [/* @__PURE__ */ a("span", {
+						className: "h-2.5 w-2.5 rounded-full",
+						style: { backgroundColor: n(t).color }
+					}), e(t)]
 				}, t)), x && x.size > 0 && /* @__PURE__ */ o("span", {
 					className: "inline-flex items-center gap-1.5",
 					children: [/* @__PURE__ */ a("span", { className: "h-2.5 w-2.5 rounded-full border-2 border-primary bg-background" }), "Critical path"]

package/dist/planmagnet/dependency/DependencyGraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"DependencyGraph.js","names":[],"sources":["../../../src/planmagnet/dependency/DependencyGraph.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { enumLabel } from '../controls/WorkItemControls';\nimport { rowLinkProps } from '../utils/rowNavigation';\nimport { statusVisual, STATUS_LEGEND_ORDER } from '../utils/statusColor';\n\n/**\n * Reusable SVG dependency graph (PDM-27). Nodes are work items, edges are `WorkItemDependency` rows, laid out in\n * layers left-to-right by longest-path topological order. Two mount points share this component:\n *   - the critical-path page's \"Graph\" view (the whole project — see useProjectWorkItemsGraph.ts)\n *   - the task dependency panel's one-hop neighbourhood graph (this item, its predecessors, its successors)\n *\n * The existing text list stays the accessible/no-JS-heavy fallback at every call site — this component is an\n * additional view, never a replacement for it.\n */\n\nexport interface DependencyGraphNode {\n  id: string;\n  key: string | null;\n  title: string | null;\n  status: string;\n}\n\nexport interface DependencyGraphEdge {\n  /** The WorkItemDependency's own id — stable per edge, used as the React key. */\n  id: string;\n  predecessorId: string;\n  successorId: string;\n  /** A DependencyType value. */\n  type: string;\n  lagMinutes: number | null;\n}\n\nexport interface DependencyGraphProps {\n  nodes: DependencyGraphNode[];\n  edges: DependencyGraphEdge[];\n  /** Node ids on the critical path (CPM chain) — emphasised with a thicker primary outline. */\n  criticalNodeIds?: ReadonlySet<string>;\n  /** Edge ids that connect two consecutive critical-path nodes — emphasised the same way. */\n  criticalEdgeIds?: ReadonlySet<string>;\n  onActivateNode: (nodeId: string) => void;\n  /** Shown instead of the graph when `nodes` is empty. */\n  emptyMessage: string;\n  /** Accessible name for the graph region — should say what project/item it scopes to. */\n  ariaLabel: string;\n}\n\nconst NODE_WIDTH = 180;\nconst NODE_HEIGHT = 56;\nconst LAYER_GAP_X = 72;\nconst NODE_GAP_Y = 16;\nconst PADDING = 20;\nconst CHIP_R = 4;\nconst TITLE_MAX_CHARS = 24;\nconst KEY_MAX_CHARS = 16;\n\n/** Shared with GanttChart.tsx, which draws the same dependency edges between bars instead of nodes. */\nexport function truncate(text: string, maxChars: number): string {\n  if (text.length <= maxChars) return text;\n  return `${text.slice(0, Math.max(1, maxChars - 1))}…`;\n}\n\nexport function dependencyTypeLabel(type: string): string {\n  switch (type) {\n    case 'FINISH_TO_START':\n      return 'Finish to start';\n    case 'START_TO_START':\n      return 'Start to start';\n    case 'FINISH_TO_FINISH':\n      return 'Finish to finish';\n    case 'START_TO_FINISH':\n      return 'Start to finish';\n    default:\n      return enumLabel(type);\n  }\n}\n\nexport function lagLabel(lagMinutes: number | null): string | null {\n  if (!lagMinutes) return null;\n  const days = lagMinutes / (60 * 24);\n  const verb = lagMinutes > 0 ? 'lag' : 'lead';\n  if (Number.isInteger(days)) return `${Math.abs(days)}d ${verb}`;\n  return `${Math.abs(Math.round((lagMinutes / 60) * 10) / 10)}h ${verb}`;\n}\n\n/**\n * Longest-path layering with a cycle guard. Every node ends up on the layer one past the FURTHEST-along of its\n * (in-graph) predecessors — never merely the first predecessor visited — so an edge never points backward across\n * layers except when a cycle forces it (the server refuses cycles; this is defensive, not the expected path).\n *\n * `resolving` tracks ids currently on the call stack: a predecessor already being resolved (a back-edge closing a\n * cycle) is treated as layer -1 (contributing 0) rather than recursed into again, so this always terminates —\n * every id is visited at most once per still-active ancestor chain, bounded by `nodeIds.length`.\n */\nfunction computeLayers(\n  nodeIds: string[],\n  edges: { predecessorId: string; successorId: string }[]\n): Map<string, number> {\n  const predecessorsOf = new Map<string, string[]>(nodeIds.map((id) => [id, []]));\n  for (const e of edges) {\n    const preds = predecessorsOf.get(e.successorId);\n    if (preds && predecessorsOf.has(e.predecessorId)) preds.push(e.predecessorId);\n  }\n\n  const layer = new Map<string, number>();\n  const resolving = new Set<string>();\n\n  function resolve(id: string, depth: number): number {\n    const cached = layer.get(id);\n    if (cached !== undefined) return cached;\n    if (resolving.has(id) || depth > nodeIds.length) return -1;\n    resolving.add(id);\n    const preds = predecessorsOf.get(id) ?? [];\n    let max = -1;\n    for (const p of preds) max = Math.max(max, resolve(p, depth + 1));\n    resolving.delete(id);\n    const result = max + 1;\n    layer.set(id, result);\n    return result;\n  }\n\n  for (const id of nodeIds) resolve(id, 0);\n  return layer;\n}\n\nexport function DependencyGraph({\n  nodes,\n  edges,\n  criticalNodeIds,\n  criticalEdgeIds,\n  onActivateNode,\n  emptyMessage,\n  ariaLabel,\n}: DependencyGraphProps) {\n  const layout = useMemo(() => {\n    const nodeIds = nodes.map((n) => n.id);\n    const nodeSet = new Set(nodeIds);\n    // Cross-scope edges (e.g. a dependency on a work item outside this project, or outside this item's one-hop\n    // neighbourhood) have no node to draw — drop them rather than crash on a missing endpoint.\n    const inScopeEdges = edges.filter(\n      (e) => nodeSet.has(e.predecessorId) && nodeSet.has(e.successorId)\n    );\n    const layerOf = computeLayers(nodeIds, inScopeEdges);\n\n    const byLayer = new Map<number, string[]>();\n    for (const id of nodeIds) {\n      const l = layerOf.get(id) ?? 0;\n      const list = byLayer.get(l);\n      if (list) list.push(id);\n      else byLayer.set(l, [id]);\n    }\n    const layerCount = byLayer.size === 0 ? 1 : Math.max(...byLayer.keys()) + 1;\n    const maxPerLayer = Math.max(1, ...Array.from(byLayer.values(), (l) => l.length));\n\n    const position = new Map<string, { x: number; y: number }>();\n    for (const [l, ids] of byLayer) {\n      const x = PADDING + l * (NODE_WIDTH + LAYER_GAP_X);\n      // Centered vertically within the tallest layer, so a short layer doesn't hug the top.\n      const layerHeight = ids.length * NODE_HEIGHT + (ids.length - 1) * NODE_GAP_Y;\n      const fullHeight = maxPerLayer * NODE_HEIGHT + (maxPerLayer - 1) * NODE_GAP_Y;\n      const yOffset = PADDING + Math.max(0, (fullHeight - layerHeight) / 2);\n      ids.forEach((id, i) => {\n        position.set(id, { x, y: yOffset + i * (NODE_HEIGHT + NODE_GAP_Y) });\n      });\n    }\n\n    const width = PADDING * 2 + layerCount * NODE_WIDTH + Math.max(0, layerCount - 1) * LAYER_GAP_X;\n    const height =\n      PADDING * 2 + maxPerLayer * NODE_HEIGHT + Math.max(0, maxPerLayer - 1) * NODE_GAP_Y;\n\n    return { position, inScopeEdges, width, height };\n  }, [nodes, edges]);\n\n  const presentStatuses = useMemo(\n    () => STATUS_LEGEND_ORDER.filter((s) => nodes.some((n) => n.status === s)),\n    [nodes]\n  );\n\n  if (nodes.length === 0) {\n    return (\n      <div data-testid=\"dependency-graph\" className=\"p-6 text-center text-sm text-muted-foreground\">\n        {emptyMessage}\n      </div>\n    );\n  }\n\n  const nodesById = new Map(nodes.map((n) => [n.id, n]));\n\n  return (\n    <div data-testid=\"dependency-graph\" className=\"rounded-md border border-input bg-background\">\n      <p className=\"sr-only\">\n        Dependency graph with {nodes.length} work item{nodes.length === 1 ? '' : 's'} and{' '}\n        {layout.inScopeEdges.length} dependenc{layout.inScopeEdges.length === 1 ? 'y' : 'ies'}.\n        {criticalNodeIds && criticalNodeIds.size > 0\n          ? ` ${criticalNodeIds.size} item${criticalNodeIds.size === 1 ? ' is' : 's are'} on the critical path.`\n          : ''}{' '}\n        The list above/below gives the same information as text.\n      </p>\n      <div className=\"overflow-x-auto p-3\">\n        {/* No role=\"img\" here: each node below is its own focusable role=\"button\" descendant, and \"img\"\n            semantics would tell assistive tech to treat the whole subtree as a single flattened image. */}\n        <svg\n          aria-label={ariaLabel}\n          width={layout.width}\n          height={layout.height}\n          viewBox={`0 0 ${layout.width} ${layout.height}`}\n          className=\"block\"\n        >\n          <defs>\n            <marker\n              id=\"dependency-graph-arrow\"\n              viewBox=\"0 0 10 10\"\n              refX=\"9\"\n              refY=\"5\"\n              markerWidth=\"6\"\n              markerHeight=\"6\"\n              orient=\"auto-start-reverse\"\n              className=\"text-border-strong\"\n            >\n              <path d=\"M0,0 L10,5 L0,10 z\" fill=\"currentColor\" />\n            </marker>\n            <marker\n              id=\"dependency-graph-arrow-critical\"\n              viewBox=\"0 0 10 10\"\n              refX=\"9\"\n              refY=\"5\"\n              markerWidth=\"6\"\n              markerHeight=\"6\"\n              orient=\"auto-start-reverse\"\n              className=\"text-primary\"\n            >\n              <path d=\"M0,0 L10,5 L0,10 z\" fill=\"currentColor\" />\n            </marker>\n          </defs>\n\n          {layout.inScopeEdges.map((edge) => {\n            const from = layout.position.get(edge.predecessorId);\n            const to = layout.position.get(edge.successorId);\n            if (!from || !to) return null;\n            const x1 = from.x + NODE_WIDTH;\n            const y1 = from.y + NODE_HEIGHT / 2;\n            const x2 = to.x;\n            const y2 = to.y + NODE_HEIGHT / 2;\n            const midX = (x1 + x2) / 2;\n            const critical = criticalEdgeIds?.has(edge.id) ?? false;\n            const typeLabel =\n              edge.type === 'FINISH_TO_START' ? null : dependencyTypeLabel(edge.type);\n            const lag = lagLabel(edge.lagMinutes);\n            const label = [typeLabel, lag].filter((v): v is string => !!v).join(' · ');\n            const predecessor = nodesById.get(edge.predecessorId);\n            const successor = nodesById.get(edge.successorId);\n            return (\n              <g key={edge.id} data-testid=\"dependency-graph-edge\">\n                <title>\n                  {predecessor?.key ?? edge.predecessorId} {dependencyTypeLabel(edge.type)}{' '}\n                  {successor?.key ?? edge.successorId}\n                  {lag ? ` (${lag})` : ''}\n                </title>\n                <path\n                  d={`M ${x1},${y1} C ${midX},${y1} ${midX},${y2} ${x2},${y2}`}\n                  fill=\"none\"\n                  strokeWidth={critical ? 2.5 : 1.5}\n                  className={critical ? 'text-primary' : 'text-border-strong'}\n                  stroke=\"currentColor\"\n                  markerEnd={`url(#${critical ? 'dependency-graph-arrow-critical' : 'dependency-graph-arrow'})`}\n                />\n                {label && (\n                  <text\n                    x={midX}\n                    y={(y1 + y2) / 2 - 4}\n                    textAnchor=\"middle\"\n                    className=\"fill-muted-foreground text-[9px]\"\n                  >\n                    {label}\n                  </text>\n                )}\n              </g>\n            );\n          })}\n\n          {nodes.map((node) => {\n            const pos = layout.position.get(node.id);\n            if (!pos) return null;\n            const critical = criticalNodeIds?.has(node.id) ?? false;\n            const visual = statusVisual(node.status);\n            const title = node.title ?? 'Untitled work item';\n            const keyLabel = node.key ?? '';\n            const accessibleLabel = `${keyLabel ? `${keyLabel} — ` : ''}${title} (${enumLabel(node.status)})${critical ? ', on critical path' : ''}`;\n            // ROW_LINK_CLASS (in the rowLinkProps spread below) rings via box-shadow, which SVG elements\n            // outside a <foreignObject> don't paint — the explicit className after the spread overrides it\n            // with an outline-based focus style, which they do.\n            return (\n              <g\n                key={node.id}\n                data-testid=\"dependency-graph-node\"\n                transform={`translate(${pos.x}, ${pos.y})`}\n                {...rowLinkProps<SVGGElement>(() => onActivateNode(node.id), accessibleLabel)}\n                className=\"cursor-pointer focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2\"\n              >\n                <title>{accessibleLabel}</title>\n                <rect\n                  width={NODE_WIDTH}\n                  height={NODE_HEIGHT}\n                  rx={8}\n                  className={`fill-background ${critical ? 'stroke-primary' : 'stroke-input'}`}\n                  strokeWidth={critical ? 2 : 1}\n                />\n                <circle cx={16} cy={NODE_HEIGHT / 2} r={CHIP_R} className={visual.fill} />\n                <text x={28} y={22} className=\"fill-muted-foreground text-[10px] font-medium\">\n                  {truncate(keyLabel, KEY_MAX_CHARS)}\n                </text>\n                <text x={28} y={38} className=\"fill-foreground text-[11px] font-medium\">\n                  {truncate(title, TITLE_MAX_CHARS)}\n                </text>\n              </g>\n            );\n          })}\n        </svg>\n      </div>\n      <div className=\"flex flex-wrap items-center gap-x-4 gap-y-1 border-t border-input px-3 py-2 text-[11px] text-muted-foreground\">\n        {presentStatuses.map((status) => (\n          <span key={status} className=\"inline-flex items-center gap-1.5\">\n            <span className={`h-2.5 w-2.5 rounded-full ${statusVisual(status).swatch}`} />\n            {enumLabel(status)}\n          </span>\n        ))}\n        {criticalNodeIds && criticalNodeIds.size > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <span className=\"h-2.5 w-2.5 rounded-full border-2 border-primary bg-background\" />\n            Critical path\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DependencyGraph.js","names":[],"sources":["../../../src/planmagnet/dependency/DependencyGraph.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { enumLabel } from '../controls/WorkItemControls';\nimport { rowLinkProps } from '../utils/rowNavigation';\nimport { statusVisual, STATUS_LEGEND_ORDER } from '../utils/statusColor';\n\n/**\n * Reusable SVG dependency graph (PDM-27). Nodes are work items, edges are `WorkItemDependency` rows, laid out in\n * layers left-to-right by longest-path topological order. Two mount points share this component:\n *   - the critical-path page's \"Graph\" view (the whole project — see useProjectWorkItemsGraph.ts)\n *   - the task dependency panel's one-hop neighbourhood graph (this item, its predecessors, its successors)\n *\n * The existing text list stays the accessible/no-JS-heavy fallback at every call site — this component is an\n * additional view, never a replacement for it.\n */\n\nexport interface DependencyGraphNode {\n  id: string;\n  key: string | null;\n  title: string | null;\n  status: string;\n}\n\nexport interface DependencyGraphEdge {\n  /** The WorkItemDependency's own id — stable per edge, used as the React key. */\n  id: string;\n  predecessorId: string;\n  successorId: string;\n  /** A DependencyType value. */\n  type: string;\n  lagMinutes: number | null;\n}\n\nexport interface DependencyGraphProps {\n  nodes: DependencyGraphNode[];\n  edges: DependencyGraphEdge[];\n  /** Node ids on the critical path (CPM chain) — emphasised with a thicker primary outline. */\n  criticalNodeIds?: ReadonlySet<string>;\n  /** Edge ids that connect two consecutive critical-path nodes — emphasised the same way. */\n  criticalEdgeIds?: ReadonlySet<string>;\n  onActivateNode: (nodeId: string) => void;\n  /** Shown instead of the graph when `nodes` is empty. */\n  emptyMessage: string;\n  /** Accessible name for the graph region — should say what project/item it scopes to. */\n  ariaLabel: string;\n}\n\nconst NODE_WIDTH = 180;\nconst NODE_HEIGHT = 56;\nconst LAYER_GAP_X = 72;\nconst NODE_GAP_Y = 16;\nconst PADDING = 20;\nconst CHIP_R = 4;\nconst TITLE_MAX_CHARS = 24;\nconst KEY_MAX_CHARS = 16;\n\n/** Shared with GanttChart.tsx, which draws the same dependency edges between bars instead of nodes. */\nexport function truncate(text: string, maxChars: number): string {\n  if (text.length <= maxChars) return text;\n  return `${text.slice(0, Math.max(1, maxChars - 1))}…`;\n}\n\nexport function dependencyTypeLabel(type: string): string {\n  switch (type) {\n    case 'FINISH_TO_START':\n      return 'Finish to start';\n    case 'START_TO_START':\n      return 'Start to start';\n    case 'FINISH_TO_FINISH':\n      return 'Finish to finish';\n    case 'START_TO_FINISH':\n      return 'Start to finish';\n    default:\n      return enumLabel(type);\n  }\n}\n\nexport function lagLabel(lagMinutes: number | null): string | null {\n  if (!lagMinutes) return null;\n  const days = lagMinutes / (60 * 24);\n  const verb = lagMinutes > 0 ? 'lag' : 'lead';\n  if (Number.isInteger(days)) return `${Math.abs(days)}d ${verb}`;\n  return `${Math.abs(Math.round((lagMinutes / 60) * 10) / 10)}h ${verb}`;\n}\n\n/**\n * Longest-path layering with a cycle guard. Every node ends up on the layer one past the FURTHEST-along of its\n * (in-graph) predecessors — never merely the first predecessor visited — so an edge never points backward across\n * layers except when a cycle forces it (the server refuses cycles; this is defensive, not the expected path).\n *\n * `resolving` tracks ids currently on the call stack: a predecessor already being resolved (a back-edge closing a\n * cycle) is treated as layer -1 (contributing 0) rather than recursed into again, so this always terminates —\n * every id is visited at most once per still-active ancestor chain, bounded by `nodeIds.length`.\n */\nfunction computeLayers(\n  nodeIds: string[],\n  edges: { predecessorId: string; successorId: string }[]\n): Map<string, number> {\n  const predecessorsOf = new Map<string, string[]>(nodeIds.map((id) => [id, []]));\n  for (const e of edges) {\n    const preds = predecessorsOf.get(e.successorId);\n    if (preds && predecessorsOf.has(e.predecessorId)) preds.push(e.predecessorId);\n  }\n\n  const layer = new Map<string, number>();\n  const resolving = new Set<string>();\n\n  function resolve(id: string, depth: number): number {\n    const cached = layer.get(id);\n    if (cached !== undefined) return cached;\n    if (resolving.has(id) || depth > nodeIds.length) return -1;\n    resolving.add(id);\n    const preds = predecessorsOf.get(id) ?? [];\n    let max = -1;\n    for (const p of preds) max = Math.max(max, resolve(p, depth + 1));\n    resolving.delete(id);\n    const result = max + 1;\n    layer.set(id, result);\n    return result;\n  }\n\n  for (const id of nodeIds) resolve(id, 0);\n  return layer;\n}\n\nexport function DependencyGraph({\n  nodes,\n  edges,\n  criticalNodeIds,\n  criticalEdgeIds,\n  onActivateNode,\n  emptyMessage,\n  ariaLabel,\n}: DependencyGraphProps) {\n  const layout = useMemo(() => {\n    const nodeIds = nodes.map((n) => n.id);\n    const nodeSet = new Set(nodeIds);\n    // Cross-scope edges (e.g. a dependency on a work item outside this project, or outside this item's one-hop\n    // neighbourhood) have no node to draw — drop them rather than crash on a missing endpoint.\n    const inScopeEdges = edges.filter(\n      (e) => nodeSet.has(e.predecessorId) && nodeSet.has(e.successorId)\n    );\n    const layerOf = computeLayers(nodeIds, inScopeEdges);\n\n    const byLayer = new Map<number, string[]>();\n    for (const id of nodeIds) {\n      const l = layerOf.get(id) ?? 0;\n      const list = byLayer.get(l);\n      if (list) list.push(id);\n      else byLayer.set(l, [id]);\n    }\n    const layerCount = byLayer.size === 0 ? 1 : Math.max(...byLayer.keys()) + 1;\n    const maxPerLayer = Math.max(1, ...Array.from(byLayer.values(), (l) => l.length));\n\n    const position = new Map<string, { x: number; y: number }>();\n    for (const [l, ids] of byLayer) {\n      const x = PADDING + l * (NODE_WIDTH + LAYER_GAP_X);\n      // Centered vertically within the tallest layer, so a short layer doesn't hug the top.\n      const layerHeight = ids.length * NODE_HEIGHT + (ids.length - 1) * NODE_GAP_Y;\n      const fullHeight = maxPerLayer * NODE_HEIGHT + (maxPerLayer - 1) * NODE_GAP_Y;\n      const yOffset = PADDING + Math.max(0, (fullHeight - layerHeight) / 2);\n      ids.forEach((id, i) => {\n        position.set(id, { x, y: yOffset + i * (NODE_HEIGHT + NODE_GAP_Y) });\n      });\n    }\n\n    const width = PADDING * 2 + layerCount * NODE_WIDTH + Math.max(0, layerCount - 1) * LAYER_GAP_X;\n    const height =\n      PADDING * 2 + maxPerLayer * NODE_HEIGHT + Math.max(0, maxPerLayer - 1) * NODE_GAP_Y;\n\n    return { position, inScopeEdges, width, height };\n  }, [nodes, edges]);\n\n  const presentStatuses = useMemo(\n    () => STATUS_LEGEND_ORDER.filter((s) => nodes.some((n) => n.status === s)),\n    [nodes]\n  );\n\n  if (nodes.length === 0) {\n    return (\n      <div data-testid=\"dependency-graph\" className=\"p-6 text-center text-sm text-muted-foreground\">\n        {emptyMessage}\n      </div>\n    );\n  }\n\n  const nodesById = new Map(nodes.map((n) => [n.id, n]));\n\n  return (\n    <div data-testid=\"dependency-graph\" className=\"rounded-md border border-input bg-background\">\n      <p className=\"sr-only\">\n        Dependency graph with {nodes.length} work item{nodes.length === 1 ? '' : 's'} and{' '}\n        {layout.inScopeEdges.length} dependenc{layout.inScopeEdges.length === 1 ? 'y' : 'ies'}.\n        {criticalNodeIds && criticalNodeIds.size > 0\n          ? ` ${criticalNodeIds.size} item${criticalNodeIds.size === 1 ? ' is' : 's are'} on the critical path.`\n          : ''}{' '}\n        The list above/below gives the same information as text.\n      </p>\n      <div className=\"overflow-x-auto p-3\">\n        {/* No role=\"img\" here: each node below is its own focusable role=\"button\" descendant, and \"img\"\n            semantics would tell assistive tech to treat the whole subtree as a single flattened image. */}\n        <svg\n          aria-label={ariaLabel}\n          width={layout.width}\n          height={layout.height}\n          viewBox={`0 0 ${layout.width} ${layout.height}`}\n          className=\"block\"\n        >\n          <defs>\n            <marker\n              id=\"dependency-graph-arrow\"\n              viewBox=\"0 0 10 10\"\n              refX=\"9\"\n              refY=\"5\"\n              markerWidth=\"6\"\n              markerHeight=\"6\"\n              orient=\"auto-start-reverse\"\n              className=\"text-border-strong\"\n            >\n              <path d=\"M0,0 L10,5 L0,10 z\" fill=\"currentColor\" />\n            </marker>\n            <marker\n              id=\"dependency-graph-arrow-critical\"\n              viewBox=\"0 0 10 10\"\n              refX=\"9\"\n              refY=\"5\"\n              markerWidth=\"6\"\n              markerHeight=\"6\"\n              orient=\"auto-start-reverse\"\n              className=\"text-primary\"\n            >\n              <path d=\"M0,0 L10,5 L0,10 z\" fill=\"currentColor\" />\n            </marker>\n          </defs>\n\n          {layout.inScopeEdges.map((edge) => {\n            const from = layout.position.get(edge.predecessorId);\n            const to = layout.position.get(edge.successorId);\n            if (!from || !to) return null;\n            const x1 = from.x + NODE_WIDTH;\n            const y1 = from.y + NODE_HEIGHT / 2;\n            const x2 = to.x;\n            const y2 = to.y + NODE_HEIGHT / 2;\n            const midX = (x1 + x2) / 2;\n            const critical = criticalEdgeIds?.has(edge.id) ?? false;\n            const typeLabel =\n              edge.type === 'FINISH_TO_START' ? null : dependencyTypeLabel(edge.type);\n            const lag = lagLabel(edge.lagMinutes);\n            const label = [typeLabel, lag].filter((v): v is string => !!v).join(' · ');\n            const predecessor = nodesById.get(edge.predecessorId);\n            const successor = nodesById.get(edge.successorId);\n            return (\n              <g key={edge.id} data-testid=\"dependency-graph-edge\">\n                <title>\n                  {predecessor?.key ?? edge.predecessorId} {dependencyTypeLabel(edge.type)}{' '}\n                  {successor?.key ?? edge.successorId}\n                  {lag ? ` (${lag})` : ''}\n                </title>\n                <path\n                  d={`M ${x1},${y1} C ${midX},${y1} ${midX},${y2} ${x2},${y2}`}\n                  fill=\"none\"\n                  strokeWidth={critical ? 2.5 : 1.5}\n                  className={critical ? 'text-primary' : 'text-border-strong'}\n                  stroke=\"currentColor\"\n                  markerEnd={`url(#${critical ? 'dependency-graph-arrow-critical' : 'dependency-graph-arrow'})`}\n                />\n                {label && (\n                  <text\n                    x={midX}\n                    y={(y1 + y2) / 2 - 4}\n                    textAnchor=\"middle\"\n                    className=\"fill-muted-foreground text-[9px]\"\n                  >\n                    {label}\n                  </text>\n                )}\n              </g>\n            );\n          })}\n\n          {nodes.map((node) => {\n            const pos = layout.position.get(node.id);\n            if (!pos) return null;\n            const critical = criticalNodeIds?.has(node.id) ?? false;\n            const visual = statusVisual(node.status);\n            const title = node.title ?? 'Untitled work item';\n            const keyLabel = node.key ?? '';\n            const accessibleLabel = `${keyLabel ? `${keyLabel} — ` : ''}${title} (${enumLabel(node.status)})${critical ? ', on critical path' : ''}`;\n            // ROW_LINK_CLASS (in the rowLinkProps spread below) rings via box-shadow, which SVG elements\n            // outside a <foreignObject> don't paint — the explicit className after the spread overrides it\n            // with an outline-based focus style, which they do.\n            return (\n              <g\n                key={node.id}\n                data-testid=\"dependency-graph-node\"\n                transform={`translate(${pos.x}, ${pos.y})`}\n                {...rowLinkProps<SVGGElement>(() => onActivateNode(node.id), accessibleLabel)}\n                className=\"cursor-pointer focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2\"\n              >\n                <title>{accessibleLabel}</title>\n                <rect\n                  width={NODE_WIDTH}\n                  height={NODE_HEIGHT}\n                  rx={8}\n                  className={`fill-background ${critical ? 'stroke-primary' : 'stroke-input'}`}\n                  strokeWidth={critical ? 2 : 1}\n                />\n                <circle cx={16} cy={NODE_HEIGHT / 2} r={CHIP_R} style={{ fill: visual.color }} />\n                <text x={28} y={22} className=\"fill-muted-foreground text-[10px] font-medium\">\n                  {truncate(keyLabel, KEY_MAX_CHARS)}\n                </text>\n                <text x={28} y={38} className=\"fill-foreground text-[11px] font-medium\">\n                  {truncate(title, TITLE_MAX_CHARS)}\n                </text>\n              </g>\n            );\n          })}\n        </svg>\n      </div>\n      <div className=\"flex flex-wrap items-center gap-x-4 gap-y-1 border-t border-input px-3 py-2 text-[11px] text-muted-foreground\">\n        {presentStatuses.map((status) => (\n          <span key={status} className=\"inline-flex items-center gap-1.5\">\n            <span\n              className=\"h-2.5 w-2.5 rounded-full\"\n              style={{ backgroundColor: statusVisual(status).color }}\n            />\n            {enumLabel(status)}\n          </span>\n        ))}\n        {criticalNodeIds && criticalNodeIds.size > 0 && (\n          <span className=\"inline-flex items-center gap-1.5\">\n            <span className=\"h-2.5 w-2.5 rounded-full border-2 border-primary bg-background\" />\n            Critical path\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/dependency/DependencyPanel.js

@@ -2,8 +2,8 @@ import { usePlanMagnetNavigate as e } from "../providers/PlanMagnetProvider.js";
 import { throwOnError as t } from "../utils/mutationResult.js";
 import { ErrorLine as n } from "../controls/ConfirmButton.js";
 import { enumLabel as r } from "../controls/WorkItemControls.js";
-import { WorkItemSearchSelect as i } from "../controls/Pickers.js";
-import { DependencyGraph as a } from "./DependencyGraph.js";
+import { DependencyGraph as i } from "./DependencyGraph.js";
+import { WorkItemSearchSelect as a } from "../controls/Pickers.js";
 import { useState as o } from "react";
 import { ArrowLeft as s, ArrowRight as c, Plus as l, X as u } from "lucide-react";
 import { gql as d } from "@apollo/client";
@@ -118,7 +118,7 @@ function D({ keyLabel: e, title: t, type: n, lagMinutes: i, onOpen: a, onRemove:
 		})]
 	});
 }
-function O({ workItemId: e, projectId: a, excludeIds: s, onDone: c }) {
+function O({ workItemId: e, projectId: i, excludeIds: s, onDone: c }) {
 	let [l, u] = o("blocks"), [d, p] = o(""), [_, v] = o("FINISH_TO_START"), [y, b] = o(""), [S, C] = o(null), [T, { loading: E }] = f(w, {
 		refetchQueries: ["GetWorkItemDependencies", "GetProjectCriticalPath"],
 		awaitRefetchQueries: !0
@@ -166,9 +166,9 @@ function O({ workItemId: e, projectId: a, excludeIds: s, onDone: c }) {
 					children: "Blocked by…"
 				})]
 			}),
-			/* @__PURE__ */ m(i, {
+			/* @__PURE__ */ m(a, {
 				id: "dependency-other-work-item",
-				projectId: a,
+				projectId: i,
 				value: d,
 				onChange: p,
 				exclude: s
@@ -220,18 +220,18 @@ function O({ workItemId: e, projectId: a, excludeIds: s, onDone: c }) {
 		]
 	});
 }
-function k({ workspaceId: r, workItemId: i, projectId: u }) {
+function k({ workspaceId: r, workItemId: a, projectId: u }) {
 	let d = e(), [x, w] = o(!1), [E, k] = o(null), { data: A, loading: j, error: M, refetch: N } = p(S, {
 		variables: {
 			workspaceId: r,
-			workItemId: i
+			workItemId: a
 		},
-		skip: !r || !i
+		skip: !r || !a
 	}), { data: P, error: F } = p(C, {
-		variables: { id: i },
-		skip: !i
+		variables: { id: a },
+		skip: !a
 	}), [I, { loading: L }] = f(T, { refetchQueries: ["GetWorkItemDependencies", "GetProjectCriticalPath"] }), R = A?.blocks.items ?? [], z = A?.blockedBy.items ?? [], B = [
-		i,
+		a,
 		...R.map((e) => e.successorId),
 		...z.map((e) => e.predecessorId)
 	], V = P?.planmagnetWorkItem ?? null, H = /* @__PURE__ */ new Map();
@@ -270,7 +270,7 @@ function k({ workspaceId: r, workItemId: i, projectId: u }) {
 		className: "space-y-4",
 		children: [
 			x && /* @__PURE__ */ m(O, {
-				workItemId: i,
+				workItemId: a,
 				projectId: u,
 				excludeIds: B,
 				onDone: () => {
@@ -340,7 +340,7 @@ function k({ workspaceId: r, workItemId: i, projectId: u }) {
 			V && (R.length > 0 || z.length > 0) && /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
 				className: "mb-2 text-xs font-medium text-muted-foreground uppercase",
 				children: "Neighbourhood graph"
-			}), /* @__PURE__ */ m(a, {
+			}), /* @__PURE__ */ m(i, {
 				nodes: Array.from(H.values()),
 				edges: U,
 				onActivateNode: (e) => d(`/tasks/task-detail-page?taskId=${encodeURIComponent(e)}`),

package/dist/planmagnet/dependency/GanttChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GanttChart.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/dependency/GanttChart.tsx"],"names":[],"mappings":"AAKA;;;;;;;;;;;GAWG;AAEH,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,YAAY,EAAE,eAAe,EAAE,CAAC;CACjC;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,2GAA2G;IAC3G,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,4EAA4E;IAC5E,KAAK,CAAC,EAAE,IAAI,CAAC;CACd;AAsED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,eAAe,EACf,IAAI,EACJ,aAAa,EACb,KAAK,GACN,EAAE,eAAe,2CA6SjB"}
+{"version":3,"file":"GanttChart.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/dependency/GanttChart.tsx"],"names":[],"mappings":"AAKA;;;;;;;;;;;GAWG;AAEH,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,YAAY,EAAE,eAAe,EAAE,CAAC;CACjC;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,2GAA2G;IAC3G,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,4EAA4E;IAC5E,KAAK,CAAC,EAAE,IAAI,CAAC;CACd;AAsED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,eAAe,EACf,IAAI,EACJ,aAAa,EACb,KAAK,GACN,EAAE,eAAe,2CAmTjB"}

package/dist/planmagnet/dependency/GanttChart.js

@@ -200,13 +200,14 @@ function T({ items: b, criticalIds: T, criticalEdgeIds: E, zoom: D, onActivateRo
 								x2: A.x(e.day),
 								y1: 0,
 								y2: A.plotHeight,
-								className: "text-chart-grid",
+								style: { color: "var(--color-chart-grid)" },
 								stroke: "currentColor",
 								strokeWidth: 1
 							}), /* @__PURE__ */ s("text", {
 								x: A.x(e.day) + 3,
 								y: p - 10,
-								className: "fill-chart-axis text-[10px]",
+								className: "text-[10px]",
+								style: { fill: "var(--color-chart-axis)" },
 								children: e.label
 							})] }, e.day)),
 							/* @__PURE__ */ s("line", {
@@ -250,7 +251,8 @@ function T({ items: b, criticalIds: T, criticalEdgeIds: E, zoom: D, onActivateRo
 											width: h,
 											height: h,
 											transform: `rotate(45 ${e} ${i})`,
-											className: `${o.fill} ${a ? "stroke-primary" : "stroke-input"}`,
+											className: a ? "stroke-primary" : "stroke-input",
+											style: { fill: o.color },
 											strokeWidth: a ? 2 : 1
 										})]
 									}, t.item.id);
@@ -264,7 +266,8 @@ function T({ items: b, criticalIds: T, criticalEdgeIds: E, zoom: D, onActivateRo
 										width: _,
 										height: m,
 										rx: 4,
-										className: `${o.fill} ${a ? "stroke-primary" : "stroke-input"}`,
+										className: a ? "stroke-primary" : "stroke-input",
+										style: { fill: o.color },
 										strokeWidth: a ? 2 : 1
 									})]
 								}, t.item.id);
@@ -278,7 +281,10 @@ function T({ items: b, criticalIds: T, criticalEdgeIds: E, zoom: D, onActivateRo
 				children: [
 					j.map((t) => /* @__PURE__ */ c("span", {
 						className: "inline-flex items-center gap-1.5",
-						children: [/* @__PURE__ */ s("span", { className: `h-2.5 w-2.5 rounded-full ${n(t).swatch}` }), e(t)]
+						children: [/* @__PURE__ */ s("span", {
+							className: "h-2.5 w-2.5 rounded-full",
+							style: { backgroundColor: n(t).color }
+						}), e(t)]
 					}, t)),
 					/* @__PURE__ */ c("span", {
 						className: "inline-flex items-center gap-1.5",