gantt-lib 0.123.0 → 0.124.1

package/dist/index.mjs

@@ -550,6 +550,159 @@ function calculateSuccessorDate(predecessorStart, predecessorEnd, linkType, lag
   return shiftBusinessDayOffset(anchorDate, offset, weekendPredicate);
 }
 
+// src/core/scheduling/criticalPath.ts
+function computeCriticalPath(tasks, options = {}) {
+  const { businessDays = false, weekendPredicate } = options;
+  const taskById = new Map(tasks.map((task) => [task.id, task]));
+  const childIds = /* @__PURE__ */ new Set();
+  for (const task of tasks) {
+    if (task.parentId) childIds.add(task.parentId);
+  }
+  const leafTasks = tasks.filter((task) => !childIds.has(task.id));
+  const leafIds = new Set(leafTasks.map((task) => task.id));
+  const leafIdsByAncestor = /* @__PURE__ */ new Map();
+  for (const leaf of leafTasks) {
+    let ancestor = leaf.parentId;
+    while (ancestor) {
+      const set = leafIdsByAncestor.get(ancestor) ?? /* @__PURE__ */ new Set();
+      set.add(leaf.id);
+      leafIdsByAncestor.set(ancestor, set);
+      ancestor = taskById.get(ancestor)?.parentId;
+    }
+  }
+  const durationOf = (task) => getTaskDuration(task.startDate, task.endDate, businessDays, weekendPredicate);
+  const projectStartDate = leafTasks.reduce((earliest, task) => {
+    const taskStart = parseDateOnly(task.startDate);
+    return taskStart.getTime() < earliest.getTime() ? taskStart : earliest;
+  }, parseDateOnly(leafTasks[0]?.startDate ?? /* @__PURE__ */ new Date()));
+  const offsetFromProjectStart = (date) => {
+    const targetDate = parseDateOnly(date);
+    if (businessDays && weekendPredicate) {
+      return getBusinessDayOffset(projectStartDate, targetDate, weekendPredicate);
+    }
+    return Math.round((targetDate.getTime() - projectStartDate.getTime()) / DAY_MS);
+  };
+  const scheduledStart = /* @__PURE__ */ new Map();
+  for (const leaf of leafTasks) {
+    scheduledStart.set(leaf.id, offsetFromProjectStart(leaf.startDate));
+  }
+  const succByPred = /* @__PURE__ */ new Map();
+  const predBySucc = /* @__PURE__ */ new Map();
+  const seenEdges = /* @__PURE__ */ new Set();
+  const addEdge = (predecessorId, succId, lag, type) => {
+    const edgeKey = `${predecessorId}|${succId}|${type}`;
+    if (seenEdges.has(edgeKey)) return;
+    seenEdges.add(edgeKey);
+    const outEdges = succByPred.get(predecessorId) ?? [];
+    outEdges.push({ succId, lag, type });
+    succByPred.set(predecessorId, outEdges);
+    const inEdges = predBySucc.get(succId) ?? [];
+    inEdges.push({ predId: predecessorId, lag, type });
+    predBySucc.set(succId, inEdges);
+  };
+  for (const succ of leafTasks) {
+    for (const dep of succ.dependencies ?? []) {
+      const lag = getDependencyLag(dep);
+      if (leafIds.has(dep.taskId)) {
+        addEdge(dep.taskId, succ.id, lag, dep.type);
+        continue;
+      }
+      const descendants = leafIdsByAncestor.get(dep.taskId);
+      if (!descendants || descendants.size === 0) continue;
+      for (const leafId of descendants) {
+        if (leafId === succ.id) continue;
+        addEdge(leafId, succ.id, lag, dep.type);
+      }
+    }
+  }
+  const indegree = /* @__PURE__ */ new Map();
+  for (const leaf of leafTasks) indegree.set(leaf.id, 0);
+  for (const edges of succByPred.values()) {
+    for (const { succId } of edges) {
+      indegree.set(succId, (indegree.get(succId) ?? 0) + 1);
+    }
+  }
+  const order = [];
+  const enqueued = /* @__PURE__ */ new Set();
+  const queue = leafTasks.filter((leaf) => (indegree.get(leaf.id) ?? 0) === 0).map((leaf) => leaf.id);
+  for (const id of queue) enqueued.add(id);
+  while (queue.length > 0) {
+    const current = queue.shift();
+    order.push(current);
+    for (const { succId } of succByPred.get(current) ?? []) {
+      const next = (indegree.get(succId) ?? 0) - 1;
+      indegree.set(succId, next);
+      if (next === 0 && !enqueued.has(succId)) {
+        enqueued.add(succId);
+        queue.push(succId);
+      }
+    }
+  }
+  const projectFinish = Math.max(
+    0,
+    ...leafTasks.map((leaf) => (scheduledStart.get(leaf.id) ?? 0) + durationOf(leaf))
+  );
+  const LF = /* @__PURE__ */ new Map();
+  const LS = /* @__PURE__ */ new Map();
+  for (const leaf of leafTasks) LF.set(leaf.id, projectFinish);
+  for (let i = order.length - 1; i >= 0; i--) {
+    const id = order[i];
+    const task = taskById.get(id);
+    const durPred = durationOf(task);
+    const outEdges = succByPred.get(id) ?? [];
+    let lf = projectFinish;
+    if (outEdges.length > 0) {
+      const candidates = outEdges.map(({ succId, lag, type }) => {
+        const succLs = LS.get(succId) ?? projectFinish;
+        const durSucc = durationOf(taskById.get(succId));
+        switch (type) {
+          case "FS":
+            return succLs - lag;
+          case "SS":
+            return succLs - lag + durPred;
+          case "FF":
+            return succLs + durSucc - lag;
+          case "SF":
+            return succLs + durSucc - lag + durPred;
+          default:
+            return projectFinish;
+        }
+      });
+      lf = Math.min(projectFinish, ...candidates);
+    }
+    LF.set(id, lf);
+    LS.set(id, lf - durPred);
+  }
+  const critical = /* @__PURE__ */ new Set();
+  const ordered = new Set(order);
+  for (const leaf of leafTasks) {
+    if (!ordered.has(leaf.id)) continue;
+    const hasGraphEdge = (succByPred.get(leaf.id)?.length ?? 0) > 0 || (predBySucc.get(leaf.id)?.length ?? 0) > 0;
+    if (!hasGraphEdge && (leaf.dependencies?.length ?? 0) > 0) continue;
+    const es = scheduledStart.get(leaf.id) ?? 0;
+    const ls = LS.get(leaf.id) ?? 0;
+    if (ls - es <= 0) critical.add(leaf.id);
+  }
+  return critical;
+}
+function extendCriticalIdsToParents(criticalLeafIds, tasks) {
+  const result = new Set(criticalLeafIds);
+  const parentByChild = /* @__PURE__ */ new Map();
+  for (const task of tasks) {
+    if (task.parentId) parentByChild.set(task.id, task.parentId);
+  }
+  const stack = Array.from(criticalLeafIds);
+  while (stack.length > 0) {
+    const id = stack.pop();
+    const parentId = parentByChild.get(id);
+    if (parentId && !result.has(parentId)) {
+      result.add(parentId);
+      stack.push(parentId);
+    }
+  }
+  return result;
+}
+
 // src/core/scheduling/commands.ts
 function buildTaskRangeFromStart(startDate, duration, businessDays = false, weekendPredicate, snapDirection = 1) {
   const normalizedStart = businessDays && weekendPredicate ? alignToWorkingDay(startDate, snapDirection, weekendPredicate) : normalizeUTCDate(startDate);
@@ -2412,8 +2565,7 @@ function handleGlobalMouseMove(e) {
         activeDrag.weekendPredicate,
         activeDrag.cascadeContext
       );
-      const hasTasksWithIncomingDependencies = cascadeResult.some((task) => task.dependencies?.length);
-      const previewTasks = hasTasksWithIncomingDependencies ? (() => {
+      const previewTasks = (() => {
         const mergedPreviewTaskById = new Map(activeDrag.cascadeContext?.taskById);
         for (const task of cascadeResult) {
           mergedPreviewTaskById.set(task.id, task);
@@ -2434,7 +2586,7 @@ function handleGlobalMouseMove(e) {
             ) : task.dependencies
           };
         });
-      })() : [];
+      })();
       const overrides = /* @__PURE__ */ new Map();
       overrides.set(dragId, { left: newLeft, width: newWidth });
       for (const task of cascadeResult) {
@@ -2837,10 +2989,10 @@ var useTaskDrag = (options) => {
 // src/components/TaskRow/TaskRow.tsx
 import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var arePropsEqual = (prevProps, nextProps) => {
-  return prevProps.task.id === nextProps.task.id && prevProps.task.name === nextProps.task.name && prevProps.task.startDate === nextProps.task.startDate && prevProps.task.endDate === nextProps.task.endDate && prevProps.task.baselineStartDate === nextProps.task.baselineStartDate && prevProps.task.baselineEndDate === nextProps.task.baselineEndDate && prevProps.task.type === nextProps.task.type && prevProps.task.color === nextProps.task.color && prevProps.task.progress === nextProps.task.progress && prevProps.task.accepted === nextProps.task.accepted && prevProps.monthStart.getTime() === nextProps.monthStart.getTime() && prevProps.dayWidth === nextProps.dayWidth && prevProps.rowHeight === nextProps.rowHeight && prevProps.overridePosition?.left === nextProps.overridePosition?.left && prevProps.overridePosition?.width === nextProps.overridePosition?.width && prevProps.previewPositionStore === nextProps.previewPositionStore && prevProps.allTasks === nextProps.allTasks && prevProps.disableConstraints === nextProps.disableConstraints && prevProps.task.locked === nextProps.task.locked && prevProps.task.synced === nextProps.task.synced && prevProps.task.divider === nextProps.task.divider && prevProps.highlightExpiredTasks === nextProps.highlightExpiredTasks && prevProps.showBaseline === nextProps.showBaseline && prevProps.isFilterMatch === nextProps.isFilterMatch && prevProps.businessDays === nextProps.businessDays && prevProps.customDays === nextProps.customDays && prevProps.isWeekend === nextProps.isWeekend && prevProps.disableTaskDrag === nextProps.disableTaskDrag && prevProps.disableDependencyEditing === nextProps.disableDependencyEditing && prevProps.isDependencyDragActive === nextProps.isDependencyDragActive && prevProps.viewMode === nextProps.viewMode;
+  return prevProps.task.id === nextProps.task.id && prevProps.task.name === nextProps.task.name && prevProps.task.startDate === nextProps.task.startDate && prevProps.task.endDate === nextProps.task.endDate && prevProps.task.baselineStartDate === nextProps.task.baselineStartDate && prevProps.task.baselineEndDate === nextProps.task.baselineEndDate && prevProps.task.type === nextProps.task.type && prevProps.task.color === nextProps.task.color && prevProps.task.progress === nextProps.task.progress && prevProps.task.accepted === nextProps.task.accepted && prevProps.monthStart.getTime() === nextProps.monthStart.getTime() && prevProps.dayWidth === nextProps.dayWidth && prevProps.rowHeight === nextProps.rowHeight && prevProps.overridePosition?.left === nextProps.overridePosition?.left && prevProps.overridePosition?.width === nextProps.overridePosition?.width && prevProps.previewPositionStore === nextProps.previewPositionStore && prevProps.allTasks === nextProps.allTasks && prevProps.disableConstraints === nextProps.disableConstraints && prevProps.task.locked === nextProps.task.locked && prevProps.task.synced === nextProps.task.synced && prevProps.task.divider === nextProps.task.divider && prevProps.highlightExpiredTasks === nextProps.highlightExpiredTasks && prevProps.isCritical === nextProps.isCritical && prevProps.showBaseline === nextProps.showBaseline && prevProps.isFilterMatch === nextProps.isFilterMatch && prevProps.businessDays === nextProps.businessDays && prevProps.customDays === nextProps.customDays && prevProps.isWeekend === nextProps.isWeekend && prevProps.disableTaskDrag === nextProps.disableTaskDrag && prevProps.disableDependencyEditing === nextProps.disableDependencyEditing && prevProps.isDependencyDragActive === nextProps.isDependencyDragActive && prevProps.viewMode === nextProps.viewMode;
 };
 var TaskRow = React2.memo(
-  ({ task, monthStart, dayWidth, rowHeight, onTasksChange, onDragStateChange, rowIndex, allTasks, enableAutoSchedule, disableConstraints, overridePosition, previewPositionStore, onCascadeProgress, onCascade, divider, highlightExpiredTasks, showBaseline = false, isFilterMatch = false, businessDays, customDays, isWeekend: isWeekend3, disableTaskDrag = false, disableDependencyEditing = false, onDependencyPortPointerDown, isDependencyDragActive = false, viewMode = "day" }) => {
+  ({ task, monthStart, dayWidth, rowHeight, onTasksChange, onDragStateChange, rowIndex, allTasks, enableAutoSchedule, disableConstraints, overridePosition, previewPositionStore, onCascadeProgress, onCascade, divider, highlightExpiredTasks, isCritical = false, showBaseline = false, isFilterMatch = false, businessDays, customDays, isWeekend: isWeekend3, disableTaskDrag = false, disableDependencyEditing = false, onDependencyPortPointerDown, isDependencyDragActive = false, viewMode = "day" }) => {
     const defaultParentBarColor = "#782FC4";
     const { divider: taskDivider } = task;
     const normalizedTask = useMemo2(() => normalizeTaskDatesForType(task), [task]);
@@ -3030,7 +3182,7 @@ var TaskRow = React2.memo(
               "div",
               {
                 "data-taskbar": true,
-                className: `gantt-tr-taskBar ${isDragging ? "gantt-tr-dragging" : ""} ${task.locked ? "gantt-tr-locked" : ""} ${task.synced === false ? "gantt-tr-unsynced" : ""} ${isParent ? "gantt-tr-parentBar" : ""} ${milestone ? "gantt-tr-milestone" : ""}`,
+                className: `gantt-tr-taskBar ${isDragging ? "gantt-tr-dragging" : ""} ${task.locked ? "gantt-tr-locked" : ""} ${task.synced === false ? "gantt-tr-unsynced" : ""} ${isParent ? "gantt-tr-parentBar" : ""} ${milestone ? "gantt-tr-milestone" : ""} ${isCritical ? "gantt-tr-critical" : ""}`,
                 style: {
                   left: `${visualLeft}px`,
                   ...barStyle,
@@ -3445,6 +3597,7 @@ var DependencyLines = React6.memo(({
   rowIndexByTaskId,
   dragOverrides,
   selectedDep,
+  criticalTaskIds,
   businessDays = true,
   weekendPredicate,
   onDependencyClick
@@ -3583,6 +3736,9 @@ var DependencyLines = React6.memo(({
         const to = { x: finalToX, y: toY };
         const path = calculateDependencyPath(from, to, arrivesFromRight);
         const hasCycle = cycleInfo.has(edge.predecessorId) || cycleInfo.has(edge.successorId);
+        const isCritical = Boolean(
+          criticalTaskIds?.has(edge.predecessorId) && criticalTaskIds.has(edge.successorId)
+        );
         lines2.push({
           id: `${edge.predecessorId}-${edge.successorId}-${edge.type}`,
           predecessorId: edge.predecessorId,
@@ -3595,12 +3751,13 @@ var DependencyLines = React6.memo(({
           toX: finalToX,
           fromY,
           reverseOrder,
-          isVirtual
+          isVirtual,
+          isCritical
         });
       }
     }
     return lines2;
-  }, [tasks, allTasks, taskPositions, taskIndices, cycleInfo, collapsedParentIds]);
+  }, [tasks, allTasks, taskPositions, taskIndices, cycleInfo, collapsedParentIds, criticalTaskIds]);
   const svgHeight = totalHeight ?? tasks.length * rowHeight;
   return /* @__PURE__ */ jsxs5(
     "svg",
@@ -3687,20 +3844,41 @@ var DependencyLines = React6.memo(({
                 }
               )
             }
+          ),
+          /* @__PURE__ */ jsx7(
+            "marker",
+            {
+              id: "arrowhead-critical",
+              markerWidth: "8",
+              markerHeight: "6",
+              markerUnits: "userSpaceOnUse",
+              refX: "7",
+              refY: "3",
+              orient: "auto",
+              children: /* @__PURE__ */ jsx7(
+                "polygon",
+                {
+                  points: "0 0, 8 3, 0 6",
+                  fill: "var(--gantt-critical-path-color, #dc2626)"
+                }
+              )
+            }
           )
         ] }),
-        lines.map(({ id, predecessorId, successorId, linkType, path, hasCycle, lag, fromX, toX, fromY, reverseOrder, isVirtual }) => {
+        lines.map(({ id, predecessorId, successorId, linkType, path, hasCycle, lag, fromX, toX, fromY, reverseOrder, isVirtual, isCritical }) => {
           const isHovered = hoveredLineId === id;
           const isSelected = selectedDep != null && id === `${selectedDep.predecessorId}-${selectedDep.successorId}-${selectedDep.linkType}`;
           let pathClassName = "gantt-dependency-path";
           if (isSelected) pathClassName += " gantt-dependency-selected";
           else if (hasCycle) pathClassName += " gantt-dependency-cycle";
+          else if (isCritical) pathClassName += " gantt-dependency-critical";
           if (isVirtual && !isSelected) pathClassName += " gantt-dependency-virtual";
           let markerEnd;
           if (isSelected) markerEnd = "url(#arrowhead-selected)";
           else if (hasCycle) markerEnd = "url(#arrowhead-cycle)";
+          else if (isCritical) markerEnd = "url(#arrowhead-critical)";
           else markerEnd = "url(#arrowhead)";
-          const lagColor = isSelected ? "#ef4444" : hasCycle ? "var(--gantt-dependency-cycle-color, #ef4444)" : "var(--gantt-dependency-line-color, #666666)";
+          const lagColor = isSelected ? "#ef4444" : hasCycle ? "var(--gantt-dependency-cycle-color, #ef4444)" : isCritical ? "var(--gantt-critical-path-color, #dc2626)" : "var(--gantt-dependency-line-color, #666666)";
           return /* @__PURE__ */ jsxs5(React6.Fragment, { children: [
             /* @__PURE__ */ jsxs5(
               "g",
@@ -12432,6 +12610,7 @@ function TaskGanttChartInner(props, ref) {
     onTaskDateChangeModeChange: externalOnTaskDateChangeModeChange
   } = props;
   const dayWidth = !isTableMatrixMode ? props.dayWidth ?? 40 : 40;
+  const criticalPathMode = !isTableMatrixMode && !isPlanFactMode ? props.criticalPathMode : void 0;
   const viewMode = !isTableMatrixMode && !isPlanFactMode ? props.viewMode ?? "day" : "day";
   const customDays = !isTableMatrixMode ? props.customDays : void 0;
   const isWeekend3 = !isTableMatrixMode ? props.isWeekend : void 0;
@@ -12631,10 +12810,23 @@ function TaskGanttChartInner(props, ref) {
     [resolvedRowContentLines, rowHeight]
   );
   const normalizedTasks = useMemo13(() => normalizeHierarchyTasks(tasks), [tasks]);
+  const [previewTasksById, setPreviewTasksById] = useState12(/* @__PURE__ */ new Map());
+  const previewNormalizedTasks = useMemo13(() => {
+    if (previewTasksById.size === 0) return normalizedTasks;
+    return normalizedTasks.map((task) => previewTasksById.get(task.id) ?? task);
+  }, [normalizedTasks, previewTasksById]);
   const isCustomWeekend = useMemo13(
     () => createCustomDayPredicate({ customDays, isWeekend: isWeekend3 }),
     [customDays, isWeekend3]
   );
+  const criticalTaskIds = useMemo13(() => {
+    if (!criticalPathMode) return /* @__PURE__ */ new Set();
+    const leafCritical = computeCriticalPath(previewNormalizedTasks, {
+      businessDays,
+      weekendPredicate: isCustomWeekend
+    });
+    return extendCriticalIdsToParents(leafCritical, previewNormalizedTasks);
+  }, [criticalPathMode, previewNormalizedTasks, businessDays, isCustomWeekend]);
   const dateRangeTasks = useMemo13(() => {
     if (isPlanFactMode) {
       return getPlanFactRangeTasks(normalizedTasks);
@@ -12679,8 +12871,11 @@ function TaskGanttChartInner(props, ref) {
     if (filterMode === "hide" && taskFilter) {
       tasks2 = tasks2.filter(taskFilter);
     }
+    if (criticalPathMode === "hide") {
+      tasks2 = tasks2.filter((task) => criticalTaskIds.has(task.id));
+    }
     return tasks2;
-  }, [normalizedTasks, collapsedParentIds, filterMode, taskFilter]);
+  }, [normalizedTasks, collapsedParentIds, filterMode, taskFilter, criticalPathMode, criticalTaskIds]);
   const matchedTaskIds = useMemo13(() => {
     if (!taskFilter) return /* @__PURE__ */ new Set();
     return new Set(visibleTasks.filter(taskFilter).map((task) => task.id));
@@ -12873,7 +13068,6 @@ function TaskGanttChartInner(props, ref) {
   }, [effectiveRowHeight, tasks, visibleTasks]);
   const [dragGuideLines, setDragGuideLines] = useState12(null);
   const [draggedTaskOverride, setDraggedTaskOverride] = useState12(null);
-  const [previewTasksById, setPreviewTasksById] = useState12(/* @__PURE__ */ new Map());
   useEffect10(() => {
     const result = validateDependencies(tasks);
     setValidationResult(result);
@@ -13001,14 +13195,10 @@ function TaskGanttChartInner(props, ref) {
     }
     setCascadeOverrides((current) => arePositionMapsEqual(current, renderedOverrides) ? current : renderedOverrides);
     setPreviewTasksById((current) => {
-      const next = previewTasks.length > 0 ? new Map(previewTasks.filter((task) => renderedTaskIds.has(task.id)).map((task) => [task.id, task])) : /* @__PURE__ */ new Map();
+      const next = previewTasks.length > 0 ? new Map(previewTasks.map((task) => [task.id, task])) : /* @__PURE__ */ new Map();
       return arePreviewTaskMapsEqual(current, next) ? current : next;
     });
   }, [previewPositionStore]);
-  const previewNormalizedTasks = useMemo13(() => {
-    if (previewTasksById.size === 0) return normalizedTasks;
-    return normalizedTasks.map((task) => previewTasksById.get(task.id) ?? task);
-  }, [normalizedTasks, previewTasksById]);
   const previewVisibleTasks = useMemo13(() => {
     if (previewTasksById.size === 0) return visibleTasks;
     return visibleTasks.map((task) => previewTasksById.get(task.id) ?? task);
@@ -13608,7 +13798,8 @@ function TaskGanttChartInner(props, ref) {
                                 selectedDep: selectedChip,
                                 businessDays,
                                 weekendPredicate: isCustomWeekend,
-                                onDependencyClick: handleDependencyLineClick
+                                onDependencyClick: handleDependencyLineClick,
+                                criticalTaskIds: criticalPathMode ? criticalTaskIds : void 0
                               }
                             ),
                             dependencyLineMenu && /* @__PURE__ */ jsxs16(
@@ -13678,6 +13869,9 @@ function TaskGanttChartInner(props, ref) {
                                       } else {
                                         setDragGuideLines((current) => current === null ? current : null);
                                         setDraggedTaskOverride((current) => current === null ? current : null);
+                                        previewPositionStore.clear();
+                                        setCascadeOverrides((current) => current.size === 0 ? current : /* @__PURE__ */ new Map());
+                                        setPreviewTasksById((current) => current.size === 0 ? current : /* @__PURE__ */ new Map());
                                       }
                                     },
                                     rowIndex: index,
@@ -13690,6 +13884,7 @@ function TaskGanttChartInner(props, ref) {
                                     highlightExpiredTasks,
                                     showBaseline,
                                     isFilterMatch: filterMode === "highlight" ? matchedTaskIds.has(task.id) : false,
+                                    isCritical: criticalTaskIds.has(task.id),
                                     businessDays,
                                     customDays,
                                     isWeekend: isWeekend3,
@@ -13811,6 +14006,7 @@ export {
   cascadeByLinks,
   clampDateRangeForIncomingFS,
   clampTaskRangeForIncomingFS,
+  computeCriticalPath,
   computeLagFromDates,
   computeParentDates,
   computeParentProgress,
@@ -13819,6 +14015,7 @@ export {
   detectCycles,
   detectEdgeZone,
   expired,
+  extendCriticalIdsToParents,
   findParentId,
   flattenHierarchy,
   formatDateLabel,