@thepocman/gantt-task-react 1.0.9 → 1.0.11

package/dist/components/gantt/task-gantt-content.d.ts

@@ -2,13 +2,14 @@ import type { MouseEvent } from "react";
 import React from "react";
 import type { OptimizedListParams } from "../../helpers/use-optimized-list";
 import { GanttRelationEvent } from "../../types/gantt-task-actions";
-import { BarMoveAction, ChildByLevelMap, ChildOutOfParentWarnings, ColorStyles, CriticalPaths, DateExtremity, DependencyMap, DependentMap, Distances, FixPosition, GlobalRowIndexToTaskMap, RelationKind, Task, TaskContextualPaletteProps, TaskCoordinates, TaskDependencyContextualPaletteProps, TaskOrEmpty, TaskToHasDependencyWarningMap } from "../../types/public-types";
+import { BarMoveAction, ChildByLevelMap, ChildOutOfParentWarnings, ColorStyles, CriticalPaths, DateExtremity, DependencyMap, DependentMap, Distances, FixPosition, GlobalRowIndexToTaskMap, RelationKind, Task, TaskContextualPaletteProps, TaskCoordinates, TaskDependencyContextualPaletteProps, TaskOrEmpty, TaskToHasDependencyWarningMap, TaskToRowIndexMap } from "../../types/public-types";
 export type TaskGanttContentProps = {
     authorizedRelations: RelationKind[];
     additionalLeftSpace: number;
     additionalRightSpace: number;
     childOutOfParentWarnings: ChildOutOfParentWarnings | null;
     childTasksMap: ChildByLevelMap;
+    taskToRowIndexMap: TaskToRowIndexMap;
     colorStyles: ColorStyles;
     comparisonLevels: number;
     criticalPaths: CriticalPaths | null;

package/dist/gantt-task-react.es.js

@@ -6424,9 +6424,11 @@ const TaskGanttContent = ({
   taskYOffset,
   taskHeight,
   taskHalfHeight,
-  visibleTasksMirror
+  visibleTasksMirror,
+  taskToRowIndexMap
 }) => {
   const [renderedTasks, renderedArrows, renderedSelectedTasks] = useMemo(() => {
+    var _a;
     if (!renderedRowIndexes) {
       return [null, null, null];
     }
@@ -6445,19 +6447,23 @@ const TaskGanttContent = ({
       const { comparisonLevel = 1, id: taskId } = task;
       if (selectedIdsMirror[taskId] && !addedSelectedTasks[taskId]) {
         addedSelectedTasks[taskId] = true;
-        selectedTasksRes.push(
-          /* @__PURE__ */ jsx(
-            "rect",
-            {
-              x: 0,
-              y: Math.floor(index2 / comparisonLevels) * fullRowHeight,
-              width: "100%",
-              height: fullRowHeight,
-              fill: colorStyles.selectedTaskBackgroundColor
-            },
-            taskId
-          )
-        );
+        const rowIndex = (_a = taskToRowIndexMap.get(comparisonLevel)) == null ? void 0 : _a.get(taskId);
+        if (typeof rowIndex === "number") {
+          const y3 = rowIndex * fullRowHeight;
+          selectedTasksRes.push(
+            /* @__PURE__ */ jsx(
+              "rect",
+              {
+                x: 0,
+                y: y3,
+                width: "100%",
+                height: fullRowHeight,
+                fill: colorStyles.selectedTaskBackgroundColor
+              },
+              `selected-${taskId}`
+            )
+          );
+        }
       }
       if (comparisonLevel > comparisonLevels) {
         continue;
@@ -11602,7 +11608,6 @@ const Gantt = ({
     () => collectVisibleTasks(childTasksMap, rootTasksMap, enableTaskGrouping),
     [childTasksMap, rootTasksMap]
   );
-  console.log("Visible Task IDs:", visibleTasks.map((t2) => t2.id));
   const tasksMap = useMemo(() => getTasksMap(tasks), [tasks]);
   const checkTaskIdExists = useCallback(
     (newId, comparisonLevel = 1) => {
@@ -11678,11 +11683,27 @@ const Gantt = ({
     () => (distances.rowHeight - taskHeight) / 2,
     [distances, taskHeight]
   );
+  const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask, rowIndexToTasksMap] = useMemo(
+    () => enableTaskGrouping ? getMapTaskToRowIndexWithGrouping(visibleTasks, comparisonLevels, true) : getMapTaskToRowIndex(visibleTasks, comparisonLevels),
+    [visibleTasks, comparisonLevels, enableTaskGrouping]
+  );
   const taskHalfHeight = useMemo(
     () => Math.round(taskHeight / 2),
     [taskHeight]
   );
   const maxLevelLength = useMemo(() => {
+    if (enableTaskGrouping) {
+      let totalHeightInRows = 0;
+      for (const [_, rowMap] of rowIndexToTasksMap) {
+        for (const [_2, tasksInRow] of rowMap) {
+          const maxStack = tasksInRow.length;
+          const stackedHeight = maxStack * (taskHeight + 2);
+          const rowsNeeded = Math.ceil(stackedHeight / fullRowHeight);
+          totalHeightInRows += rowsNeeded;
+        }
+      }
+      return Math.max(totalHeightInRows, 1);
+    }
     let maxLength = 0;
     const countByLevel = {};
     visibleTasks.forEach(({ comparisonLevel = 1 }) => {
@@ -11695,15 +11716,19 @@ const Gantt = ({
       }
     });
     return maxLength;
-  }, [visibleTasks, comparisonLevels]);
-  const ganttFullHeight = useMemo(
-    () => maxLevelLength * fullRowHeight,
-    [maxLevelLength, fullRowHeight]
-  );
-  const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask, rowIndexToTasksMap] = useMemo(
-    () => enableTaskGrouping ? getMapTaskToRowIndexWithGrouping(visibleTasks, comparisonLevels, true) : getMapTaskToRowIndex(visibleTasks, comparisonLevels),
-    [visibleTasks, comparisonLevels, enableTaskGrouping]
-  );
+  }, [visibleTasks, comparisonLevels, enableTaskGrouping, rowIndexToTasksMap, fullRowHeight, taskHeight]);
+  const ganttFullHeight = useMemo(() => {
+    if (enableTaskGrouping) {
+      let totalRows = 0;
+      for (const [, taskMap] of rowIndexToTasksMap) {
+        for (const [, tasks2] of taskMap) {
+          totalRows += tasks2.length;
+        }
+      }
+      return Math.max(totalRows, 1) * fullRowHeight;
+    }
+    return maxLevelLength * fullRowHeight;
+  }, [enableTaskGrouping, rowIndexToTasksMap, maxLevelLength, fullRowHeight]);
   const {
     checkHasCopyTasks,
     checkHasCutTasks,
@@ -11976,8 +12001,6 @@ const Gantt = ({
   };
   const handleExpanderClick = useCallback(
     (clickedTask) => {
-      console.log(`Task ${clickedTask.id} hideChildren changed from ${clickedTask.hideChildren} to ${!clickedTask.hideChildren}`);
-      console.log("Task types:", tasks.map((task) => `${task.id}: ${task.type}`));
       if (onChangeExpandState) {
         onChangeExpandState({
           ...clickedTask,

package/dist/gantt-task-react.umd.js

@@ -6437,9 +6437,11 @@
     taskYOffset,
     taskHeight,
     taskHalfHeight,
-    visibleTasksMirror
+    visibleTasksMirror,
+    taskToRowIndexMap
   }) => {
     const [renderedTasks, renderedArrows, renderedSelectedTasks] = React.useMemo(() => {
+      var _a;
       if (!renderedRowIndexes) {
         return [null, null, null];
       }
@@ -6458,19 +6460,23 @@
         const { comparisonLevel = 1, id: taskId } = task;
         if (selectedIdsMirror[taskId] && !addedSelectedTasks[taskId]) {
           addedSelectedTasks[taskId] = true;
-          selectedTasksRes.push(
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "rect",
-              {
-                x: 0,
-                y: Math.floor(index2 / comparisonLevels) * fullRowHeight,
-                width: "100%",
-                height: fullRowHeight,
-                fill: colorStyles.selectedTaskBackgroundColor
-              },
-              taskId
-            )
-          );
+          const rowIndex = (_a = taskToRowIndexMap.get(comparisonLevel)) == null ? void 0 : _a.get(taskId);
+          if (typeof rowIndex === "number") {
+            const y = rowIndex * fullRowHeight;
+            selectedTasksRes.push(
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "rect",
+                {
+                  x: 0,
+                  y,
+                  width: "100%",
+                  height: fullRowHeight,
+                  fill: colorStyles.selectedTaskBackgroundColor
+                },
+                `selected-${taskId}`
+              )
+            );
+          }
         }
         if (comparisonLevel > comparisonLevels) {
           continue;
@@ -11615,7 +11621,6 @@
       () => collectVisibleTasks(childTasksMap, rootTasksMap, enableTaskGrouping),
       [childTasksMap, rootTasksMap]
     );
-    console.log("Visible Task IDs:", visibleTasks.map((t) => t.id));
     const tasksMap = React.useMemo(() => getTasksMap(tasks), [tasks]);
     const checkTaskIdExists = React.useCallback(
       (newId, comparisonLevel = 1) => {
@@ -11691,11 +11696,27 @@
       () => (distances.rowHeight - taskHeight) / 2,
       [distances, taskHeight]
     );
+    const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask, rowIndexToTasksMap] = React.useMemo(
+      () => enableTaskGrouping ? getMapTaskToRowIndexWithGrouping(visibleTasks, comparisonLevels, true) : getMapTaskToRowIndex(visibleTasks, comparisonLevels),
+      [visibleTasks, comparisonLevels, enableTaskGrouping]
+    );
     const taskHalfHeight = React.useMemo(
       () => Math.round(taskHeight / 2),
       [taskHeight]
     );
     const maxLevelLength = React.useMemo(() => {
+      if (enableTaskGrouping) {
+        let totalHeightInRows = 0;
+        for (const [_, rowMap] of rowIndexToTasksMap) {
+          for (const [_2, tasksInRow] of rowMap) {
+            const maxStack = tasksInRow.length;
+            const stackedHeight = maxStack * (taskHeight + 2);
+            const rowsNeeded = Math.ceil(stackedHeight / fullRowHeight);
+            totalHeightInRows += rowsNeeded;
+          }
+        }
+        return Math.max(totalHeightInRows, 1);
+      }
       let maxLength = 0;
       const countByLevel = {};
       visibleTasks.forEach(({ comparisonLevel = 1 }) => {
@@ -11708,15 +11729,19 @@
         }
       });
       return maxLength;
-    }, [visibleTasks, comparisonLevels]);
-    const ganttFullHeight = React.useMemo(
-      () => maxLevelLength * fullRowHeight,
-      [maxLevelLength, fullRowHeight]
-    );
-    const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask, rowIndexToTasksMap] = React.useMemo(
-      () => enableTaskGrouping ? getMapTaskToRowIndexWithGrouping(visibleTasks, comparisonLevels, true) : getMapTaskToRowIndex(visibleTasks, comparisonLevels),
-      [visibleTasks, comparisonLevels, enableTaskGrouping]
-    );
+    }, [visibleTasks, comparisonLevels, enableTaskGrouping, rowIndexToTasksMap, fullRowHeight, taskHeight]);
+    const ganttFullHeight = React.useMemo(() => {
+      if (enableTaskGrouping) {
+        let totalRows = 0;
+        for (const [, taskMap] of rowIndexToTasksMap) {
+          for (const [, tasks2] of taskMap) {
+            totalRows += tasks2.length;
+          }
+        }
+        return Math.max(totalRows, 1) * fullRowHeight;
+      }
+      return maxLevelLength * fullRowHeight;
+    }, [enableTaskGrouping, rowIndexToTasksMap, maxLevelLength, fullRowHeight]);
     const {
       checkHasCopyTasks,
       checkHasCutTasks,
@@ -11989,8 +12014,6 @@
     };
     const handleExpanderClick = React.useCallback(
       (clickedTask) => {
-        console.log(`Task ${clickedTask.id} hideChildren changed from ${clickedTask.hideChildren} to ${!clickedTask.hideChildren}`);
-        console.log("Task types:", tasks.map((task) => `${task.id}: ${task.type}`));
         if (onChangeExpandState) {
           onChangeExpandState({
             ...clickedTask,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thepocman/gantt-task-react",
-  "version": "1.0.9",
+  "version": "1.0.11",
   "description": "Fork of gantt-task-react with support for grouped tasks on a single row when collapsed",
   "author": "Adrian Bueno <adrianlbueno@users.noreply.github.com>",
   "homepage": "https://github.com/adrianlbueno/gantt-task-react#readme",