@thepocman/gantt-task-react 1.0.13 → 1.0.14

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

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import * as React from "react";
-import React__default, { useState, useEffect, useCallback, memo, Fragment, useMemo, useRef, useLayoutEffect } from "react";
+import React__default, { useState, useEffect, useMemo, useCallback, memo, Fragment, useRef, useLayoutEffect } from "react";
 import { UnfoldLess, UnfoldMore, UnfoldMoreDouble } from "@mui/icons-material";
 import { createTheme, ThemeProvider, Tooltip as Tooltip$1, IconButton } from "@mui/material";
 import ClickAwayListener from "@mui/material/ClickAwayListener";
@@ -461,7 +461,6 @@ var locale = {
 const enDateLocale = locale;
 const collectChildren = (arrayRes, mirrorRes, task, childTasksOnLevel, enableTaskGrouping) => {
   const { comparisonLevel = 1 } = task;
-  console.log(`Task ${task.id} visibility check: type=${task.type}, hideChildren=${task.hideChildren}, will ${task.type === "empty" || task.hideChildren && task.type !== "user" ? "hide" : "show"} children`);
   arrayRes.push(task);
   if (comparisonLevel === 1) {
     mirrorRes[task.id] = true;
@@ -1591,14 +1590,9 @@ const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoor
   return { isChanged, changedTask };
 };
 const countTaskCoordinates = (task, taskToRowIndexMap, startDate, viewMode, rtl, fullRowHeight, taskHeight, taskYOffset, distances, svgWidth, sequentialOffset = 0) => {
-  const { columnWidth, rowHeight } = distances;
+  const { columnWidth } = distances;
   const { id, comparisonLevel = 1, progress, type } = task;
   const indexesAtLevel = taskToRowIndexMap.get(comparisonLevel);
-  console.log("Looking for task id:", task.id, "level:", comparisonLevel);
-  console.log("taskToRowIndexMap", Array.from(taskToRowIndexMap.entries()).map(([level, map]) => ({
-    level,
-    rows: Array.from(map.entries())
-  })));
   if (!indexesAtLevel) {
     throw new Error(`Indexes at level ${comparisonLevel} are not found`);
   }
@@ -1608,7 +1602,7 @@ const countTaskCoordinates = (task, taskToRowIndexMap, startDate, viewMode, rtl,
   }
   const x1 = rtl ? svgWidth - taskXCoordinate(task.end, startDate, viewMode, columnWidth) : taskXCoordinate(task.start, startDate, viewMode, columnWidth);
   const x22 = rtl ? svgWidth - taskXCoordinate(task.start, startDate, viewMode, columnWidth) : taskXCoordinate(task.end, startDate, viewMode, columnWidth);
-  const levelY = rowIndex * fullRowHeight + rowHeight * (comparisonLevel - 1);
+  const levelY = rowIndex * fullRowHeight;
   const y3 = levelY + taskYOffset + sequentialOffset;
   const [progressWidth, progressX] = type === "milestone" ? [0, x1] : progressWithByParams(x1, x22, progress, rtl);
   const taskX1 = type === "milestone" ? x1 - taskHeight * 0.5 : x1;
@@ -1660,21 +1654,31 @@ const getMapTaskToCoordinates = (tasks, visibleTasksMirror, taskToRowIndexMap, s
   });
   return res;
 };
-const countTaskCoordinatesWithGrouping = (task, taskToRowIndexMap, startDate, viewMode, rtl, fullRowHeight, taskHeight, taskYOffset, distances, svgWidth, sequentialOffset = 0) => {
-  const { columnWidth, rowHeight } = distances;
+const countTaskCoordinatesWithGrouping = (task, rowIndexToTasksMap, startDate, viewMode, rtl, fullRowHeight, taskHeight, taskYOffset, distances, svgWidth, sequentialOffset = 0) => {
+  const { columnWidth } = distances;
   const { id, comparisonLevel = 1, progress, type } = task;
-  const indexesAtLevel = taskToRowIndexMap.get(comparisonLevel);
-  if (!indexesAtLevel) {
-    throw new Error(`Indexes at level ${comparisonLevel} are not found`);
+  let rowIndex = -1;
+  let taskIndexInRow = 0;
+  const rowMapAtLevel = rowIndexToTasksMap.get(comparisonLevel);
+  if (!rowMapAtLevel) {
+    throw new Error(`No rows found for comparison level ${comparisonLevel}`);
+  }
+  for (const [currentRowIndex, tasksInRow] of rowMapAtLevel.entries()) {
+    const taskIndex = tasksInRow.findIndex((t2) => t2.id === id);
+    if (taskIndex !== -1) {
+      rowIndex = currentRowIndex;
+      taskIndexInRow = taskIndex;
+      break;
+    }
   }
-  const rowIndex = indexesAtLevel.get(id);
-  if (typeof rowIndex !== "number") {
-    throw new Error(`Row index for task ${id} is not found`);
+  if (rowIndex === -1) {
+    throw new Error(`Task ${id} not found in rowIndexToTasksMap`);
   }
   const x1 = rtl ? svgWidth - taskXCoordinate(task.end, startDate, viewMode, columnWidth) : taskXCoordinate(task.start, startDate, viewMode, columnWidth);
   const x22 = rtl ? svgWidth - taskXCoordinate(task.start, startDate, viewMode, columnWidth) : taskXCoordinate(task.end, startDate, viewMode, columnWidth);
-  const levelY = rowIndex * fullRowHeight + rowHeight * (comparisonLevel - 1);
-  const y3 = levelY + taskYOffset + sequentialOffset;
+  const levelY = rowIndex * fullRowHeight;
+  const taskStackOffset = taskIndexInRow * (taskHeight + 2);
+  const y3 = levelY + taskYOffset + sequentialOffset + taskStackOffset;
   const [progressWidth, progressX] = type === "milestone" ? [0, x1] : progressWithByParams(x1, x22, progress, rtl);
   const taskX1 = type === "milestone" ? x1 - taskHeight * 0.5 : x1;
   const taskX2 = type === "milestone" ? x22 + taskHeight * 0.5 : x22;
@@ -1697,6 +1701,34 @@ const countTaskCoordinatesWithGrouping = (task, taskToRowIndexMap, startDate, vi
     y: y3
   };
 };
+const getMapTaskToCoordinatesWithGrouping = (tasks, visibleTasksMirror, rowIndexToTasksMap, startDate, viewMode, rtl, fullRowHeight, taskHeight, taskYOffset, distances, svgWidth) => {
+  const res = /* @__PURE__ */ new Map();
+  tasks.forEach((task) => {
+    if (task.type === "empty" || task.type === "user") {
+      return;
+    }
+    const { id, comparisonLevel = 1 } = task;
+    if (!visibleTasksMirror[id]) {
+      return;
+    }
+    const taskCoordinates = countTaskCoordinatesWithGrouping(
+      task,
+      rowIndexToTasksMap,
+      startDate,
+      viewMode,
+      rtl,
+      fullRowHeight,
+      taskHeight,
+      taskYOffset,
+      distances,
+      svgWidth
+    );
+    const resByLevel = res.get(comparisonLevel) || /* @__PURE__ */ new Map();
+    resByLevel.set(id, taskCoordinates);
+    res.set(comparisonLevel, resByLevel);
+  });
+  return res;
+};
 const getMapTaskToGlobalIndex = (tasks) => {
   const res = /* @__PURE__ */ new Map();
   tasks.forEach((task, index2) => {
@@ -1710,43 +1742,33 @@ const getMapTaskToGlobalIndex = (tasks) => {
   });
   return res;
 };
-const getMapTaskTo = (indexesOnLevel, taskId, level, collectedIndex, childTasksOnLevel) => {
-  const childs = childTasksOnLevel.get(taskId);
-  if (childs && childs.length > 0) {
-    childs.forEach(({
-      id: childId
-    }, index2) => {
-      const childIndex = `${collectedIndex}.${index2 + 1}`;
-      indexesOnLevel.set(childId, [level, childIndex]);
-      getMapTaskTo(
-        indexesOnLevel,
-        childId,
-        level + 1,
-        childIndex,
-        childTasksOnLevel
-      );
-    });
+const setIndex = (map, level, id, depth, indexStr) => {
+  if (!map.has(level)) {
+    map.set(level, /* @__PURE__ */ new Map());
   }
+  map.get(level).set(id, [depth, indexStr]);
+};
+const walkTasks = (map, comparisonLevel, parentId, depth, prefix, childTasksMap) => {
+  const children = childTasksMap.get(parentId);
+  if (!children)
+    return;
+  children.forEach((child, i2) => {
+    const indexStr = `${prefix}.${i2 + 1}`;
+    setIndex(map, comparisonLevel, child.id, depth, indexStr);
+    walkTasks(map, comparisonLevel, child.id, depth + 1, indexStr, childTasksMap);
+  });
 };
 const getMapTaskToNestedIndex = (childTasksMap, rootTasksMap) => {
-  const res = /* @__PURE__ */ new Map();
+  const map = /* @__PURE__ */ new Map();
   for (const [comparisonLevel, rootTasks] of rootTasksMap.entries()) {
-    const indexesOnLevel = /* @__PURE__ */ new Map();
-    const childTasksOnLevel = childTasksMap.get(comparisonLevel) || /* @__PURE__ */ new Map();
-    rootTasks.forEach(({ id: rootId }, index2) => {
-      const rootIndex = `${index2 + 1}`;
-      indexesOnLevel.set(rootId, [0, rootIndex]);
-      getMapTaskTo(
-        indexesOnLevel,
-        rootId,
-        1,
-        rootIndex,
-        childTasksOnLevel
-      );
+    const childMap = childTasksMap.get(comparisonLevel) ?? /* @__PURE__ */ new Map();
+    rootTasks.forEach((task, i2) => {
+      const indexStr = `${i2 + 1}`;
+      setIndex(map, comparisonLevel, task.id, 0, indexStr);
+      walkTasks(map, comparisonLevel, task.id, 1, indexStr, childMap);
     });
-    res.set(comparisonLevel, indexesOnLevel);
   }
-  return res;
+  return map;
 };
 const getMapTaskToRowIndex = (visibleTasks, comparisonLevels) => {
   const taskToRowIndexRes = /* @__PURE__ */ new Map();
@@ -1921,6 +1943,33 @@ const useOptimizedList = (containerRef, property, cellSize) => {
   ]);
   return indexes;
 };
+const TASK_SPACING = 2;
+const buildRowEntries = (rowIndexToTasksMap, taskHeight) => {
+  const rowToTaskCount = /* @__PURE__ */ new Map();
+  for (const rowMap of rowIndexToTasksMap.values()) {
+    for (const [rowIndex, tasks] of rowMap.entries()) {
+      rowToTaskCount.set(rowIndex, (rowToTaskCount.get(rowIndex) ?? 0) + tasks.length);
+    }
+  }
+  return [...rowToTaskCount.entries()].map(([rowIndex, count2]) => ({
+    rowIndex,
+    height: count2 * (taskHeight + TASK_SPACING)
+  })).sort((a4, b3) => a4.rowIndex - b3.rowIndex);
+};
+const useGroupedVirtualization = (rowIndexToTasksMap, taskHeight) => {
+  var _a, _b;
+  const rowEntries = useMemo(
+    () => buildRowEntries(rowIndexToTasksMap, taskHeight),
+    [rowIndexToTasksMap, taskHeight]
+  );
+  return [
+    ((_a = rowEntries[0]) == null ? void 0 : _a.rowIndex) ?? 0,
+    ((_b = rowEntries[rowEntries.length - 1]) == null ? void 0 : _b.rowIndex) ?? 0,
+    true,
+    true,
+    rowEntries.reduce((sum, entry) => sum + entry.height, 0)
+  ];
+};
 const button$2 = "_button_1eue5_1";
 const styles$i = {
   button: button$2
@@ -3357,6 +3406,7 @@ const TaskListInner = ({
   dateSetup,
   dependencyMap,
   distances,
+  rowIndexToTasksMap,
   fontFamily,
   fontSize,
   fullRowHeight,
@@ -3395,7 +3445,11 @@ const TaskListInner = ({
     onTableResizeStart,
     onColumnResizeStart
   ] = useTableListResize(columnsProp, distances, onResizeColumn);
-  const renderedIndexes = useOptimizedList(
+  const renderedIndexes = enableTaskGrouping ? useGroupedVirtualization(
+    //taskListContentRef,
+    rowIndexToTasksMap,
+    distances.taskHeight
+  ) : useOptimizedList(
     taskListContentRef,
     "scrollTop",
     fullRowHeight
@@ -3451,6 +3505,7 @@ const TaskListInner = ({
                       columns,
                       cutIdsMirror,
                       enableTaskGrouping,
+                      rowIndexToTasksMap,
                       dateSetup,
                       dependencyMap,
                       distances,
@@ -3672,21 +3727,6 @@ const TaskListHeaderDefaultInner = (props) => {
   );
 };
 const TaskListHeaderDefault = memo(TaskListHeaderDefaultInner);
-const checkHasChildren = (task, childTasksMap) => {
-  const {
-    id,
-    comparisonLevel = 1
-  } = task;
-  const childIdsByLevel = childTasksMap.get(comparisonLevel);
-  if (!childIdsByLevel) {
-    return false;
-  }
-  const childs = childIdsByLevel.get(id);
-  if (!childs) {
-    return false;
-  }
-  return childs.length > 0;
-};
 const taskListTableRow = "_taskListTableRow_1e35i_1";
 const taskListTableRowGrabbing = "_taskListTableRowGrabbing_1e35i_13";
 const cut = "_cut_1e35i_21";
@@ -4030,6 +4070,21 @@ const TaskListTableRowInner = ({
   );
 };
 const TaskListTableRow = memo(TaskListTableRowInner);
+const checkHasChildren = (task, childTasksMap) => {
+  const {
+    id,
+    comparisonLevel = 1
+  } = task;
+  const childIdsByLevel = childTasksMap.get(comparisonLevel);
+  if (!childIdsByLevel) {
+    return false;
+  }
+  const childs = childIdsByLevel.get(id);
+  if (!childs) {
+    return false;
+  }
+  return childs.length > 0;
+};
 const taskListWrapper = "_taskListWrapper_5941j_1";
 const styles$b = {
   taskListWrapper
@@ -4058,6 +4113,7 @@ const TaskListTableDefaultInner = ({
   icons,
   isShowTaskNumbers,
   mapTaskToNestedIndex,
+  rowIndexToTasksMap,
   onClick,
   onExpanderClick,
   renderedIndexes,
@@ -4067,98 +4123,146 @@ const TaskListTableDefaultInner = ({
   tasks
 }) => {
   const renderedTasks = useMemo(() => {
-    console.log("enableTaskGrouping", enableTaskGrouping);
     if (!enableTaskGrouping) {
-      return tasks;
+      return tasks.filter((task) => !task.comparisonLevel || task.comparisonLevel === 1);
     }
-    return tasks.filter((task) => {
-      const parent = tasks.find((t2) => t2.id === task.parent);
-      const isGroupedChildOfCollapsedUser = parent && parent.type === "user" && parent.hideChildren === true;
-      return !isGroupedChildOfCollapsedUser;
-    });
+    return tasks.filter((task) => task.type !== "user");
   }, [tasks, enableTaskGrouping]);
   const [draggedTask, setDraggedTask] = useState(null);
   const renderedListWithOffset = useMemo(() => {
-    if (!renderedIndexes) {
+    var _a;
+    if (!renderedIndexes)
       return null;
-    }
     const [start, end] = renderedIndexes;
-    const renderedList = [];
-    for (let index2 = start; index2 <= end; ++index2) {
-      const task = renderedTasks[index2];
-      if (!task) {
-        break;
-      }
-      const { id, comparisonLevel = 1 } = task;
-      const indexesOnLevel = mapTaskToNestedIndex.get(comparisonLevel);
-      if (!indexesOnLevel) {
-        throw new Error(`Indexes are not found for level ${comparisonLevel}`);
+    const renderList = [];
+    if (!enableTaskGrouping) {
+      for (let rowIndex = start; rowIndex <= end; rowIndex++) {
+        const task = renderedTasks[rowIndex];
+        if (!task)
+          break;
+        const { id, comparisonLevel = 1 } = task;
+        const indexesOnLevel = mapTaskToNestedIndex.get(comparisonLevel);
+        const taskIndex = indexesOnLevel == null ? void 0 : indexesOnLevel.get(id);
+        const [depth, indexStr] = taskIndex ?? [0, ""];
+        renderList.push(
+          /* @__PURE__ */ jsx(
+            TaskListTableRow,
+            {
+              canMoveTasks,
+              colors,
+              columns,
+              dateSetup,
+              dependencyMap,
+              depth,
+              distances,
+              fullRowHeight,
+              getTaskCurrentState,
+              handleAddTask,
+              handleDeleteTasks,
+              handleEditTask,
+              handleMoveTaskBefore,
+              handleMoveTaskAfter,
+              handleMoveTasksInside,
+              handleOpenContextMenu,
+              hasChildren: checkHasChildren(task, childTasksMap),
+              icons,
+              indexStr,
+              isClosed: Boolean(task == null ? void 0 : task.hideChildren),
+              isCut: cutIdsMirror[id],
+              isEven: rowIndex % 2 === 1,
+              isSelected: selectedIdsMirror[id],
+              isShowTaskNumbers,
+              onClick,
+              onExpanderClick,
+              scrollToTask,
+              selectTaskOnMouseDown,
+              task,
+              tasks,
+              draggedTask,
+              setDraggedTask
+            },
+            id
+          )
+        );
       }
-      const taskIndex = indexesOnLevel.get(id);
-      if (!taskIndex) {
-        throw new Error(`Index is not found for task ${id}`);
+    } else {
+      for (let rowIndex = start; rowIndex <= end; rowIndex++) {
+        const taskList = (_a = rowIndexToTasksMap.get(1)) == null ? void 0 : _a.get(rowIndex);
+        if (!taskList)
+          continue;
+        for (const task of taskList) {
+          const parent = tasks.find((t2) => t2.id === task.parent);
+          if (parent == null ? void 0 : parent.hideChildren)
+            continue;
+          const { id, comparisonLevel } = task;
+          let depth = 0;
+          let indexStr = "";
+          console.log("comparisonLevel", comparisonLevel);
+          const levelMap = mapTaskToNestedIndex.get(comparisonLevel);
+          const taskIndex = levelMap == null ? void 0 : levelMap.get(id);
+          if (taskIndex) {
+            console.log("object :>> ", [depth, indexStr] = taskIndex);
+            [depth, indexStr] = taskIndex;
+          }
+          renderList.push(
+            /* @__PURE__ */ jsx(
+              TaskListTableRow,
+              {
+                canMoveTasks,
+                colors,
+                columns,
+                dateSetup,
+                dependencyMap,
+                depth,
+                distances,
+                fullRowHeight,
+                getTaskCurrentState,
+                handleAddTask,
+                handleDeleteTasks,
+                handleEditTask,
+                handleMoveTaskBefore,
+                handleMoveTaskAfter,
+                handleMoveTasksInside,
+                handleOpenContextMenu,
+                hasChildren: checkHasChildren(task, childTasksMap),
+                icons,
+                indexStr,
+                isClosed: Boolean(task == null ? void 0 : task.hideChildren),
+                isCut: cutIdsMirror[id],
+                isEven: rowIndex % 2 === 1,
+                isSelected: selectedIdsMirror[id],
+                isShowTaskNumbers,
+                onClick,
+                onExpanderClick,
+                scrollToTask,
+                selectTaskOnMouseDown,
+                task,
+                tasks,
+                draggedTask,
+                setDraggedTask
+              },
+              id
+            )
+          );
+        }
       }
-      const [depth, indexStr] = taskIndex;
-      renderedList.push(
-        /* @__PURE__ */ jsx(
-          TaskListTableRow,
-          {
-            canMoveTasks,
-            colors,
-            columns,
-            dateSetup,
-            dependencyMap,
-            depth,
-            distances,
-            fullRowHeight,
-            getTaskCurrentState,
-            handleAddTask,
-            handleDeleteTasks,
-            handleEditTask,
-            handleMoveTaskBefore,
-            handleMoveTaskAfter,
-            handleMoveTasksInside,
-            handleOpenContextMenu,
-            hasChildren: checkHasChildren(task, childTasksMap),
-            icons,
-            indexStr,
-            isClosed: Boolean(task == null ? void 0 : task.hideChildren),
-            isCut: cutIdsMirror[id],
-            isEven: index2 % 2 === 1,
-            isSelected: selectedIdsMirror[id],
-            isShowTaskNumbers,
-            onClick,
-            onExpanderClick,
-            scrollToTask,
-            selectTaskOnMouseDown,
-            task,
-            tasks,
-            draggedTask,
-            setDraggedTask
-          },
-          id
-        )
-      );
     }
     return /* @__PURE__ */ jsxs(Fragment$1, { children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          style: {
-            height: fullRowHeight * start
-          }
-        }
-      ),
-      renderedList
+      /* @__PURE__ */ jsx("div", { style: { height: fullRowHeight * start } }),
+      renderList
     ] });
   }, [
+    renderedIndexes,
+    renderedTasks,
+    rowIndexToTasksMap,
+    mapTaskToNestedIndex,
+    tasks,
+    enableTaskGrouping,
+    fullRowHeight,
     colors,
     columns,
     cutIdsMirror,
-    fullRowHeight,
     getTaskCurrentState,
-    renderedIndexes,
-    renderedTasks,
     selectTaskOnMouseDown,
     selectedIdsMirror,
     draggedTask
@@ -4167,10 +4271,7 @@ const TaskListTableDefaultInner = ({
     "div",
     {
       className: styles$b.taskListWrapper,
-      style: {
-        fontFamily,
-        fontSize
-      },
+      style: { fontFamily, fontSize },
       children: renderedListWithOffset
     }
   );
@@ -4979,9 +5080,9 @@ const Grid = (props) => {
     /* @__PURE__ */ jsx(GridBody, { ...props })
   ] });
 };
-const ganttTaskRoot = "_ganttTaskRoot_1g0yd_1";
-const ganttTaskContent = "_ganttTaskContent_1g0yd_81";
-const wrapper$2 = "_wrapper_1g0yd_107";
+const ganttTaskRoot = "_ganttTaskRoot_jnu0p_1";
+const ganttTaskContent = "_ganttTaskContent_jnu0p_83";
+const wrapper$2 = "_wrapper_jnu0p_111";
 const styles$9 = {
   ganttTaskRoot,
   ganttTaskContent,
@@ -6410,6 +6511,8 @@ const TaskGanttContent = ({
   handleFixDependency,
   handleTaskDragStart,
   isShowDependencyWarnings,
+  enableTaskGrouping,
+  rowIndexToTasksMap,
   mapGlobalRowIndexToTask,
   onArrowDoubleClick,
   onArrowClick,
@@ -6429,263 +6532,228 @@ const TaskGanttContent = ({
 }) => {
   const [renderedTasks, renderedArrows, renderedSelectedTasks] = useMemo(() => {
     var _a;
-    if (!renderedRowIndexes) {
+    if (!renderedRowIndexes)
       return [null, null, null];
-    }
     const [start, end] = renderedRowIndexes;
     const tasksRes = [];
     const arrowsRes = [];
     const selectedTasksRes = [];
     const addedSelectedTasks = {};
     const addedDependencies = {};
-    console.log("mapGlobalRowIndexToTask", mapGlobalRowIndexToTask);
     for (let index2 = start; index2 <= end; ++index2) {
-      const task = mapGlobalRowIndexToTask.get(index2);
-      if (!task) {
-        continue;
-      }
-      const { comparisonLevel = 1, id: taskId } = task;
-      if (selectedIdsMirror[taskId] && !addedSelectedTasks[taskId]) {
-        addedSelectedTasks[taskId] = true;
-        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}`
-            )
-          );
+      const tasksAtRow = [];
+      if (enableTaskGrouping) {
+        for (let level = 1; level <= comparisonLevels; level++) {
+          const levelMap = rowIndexToTasksMap.get(level);
+          const rowTasks = levelMap == null ? void 0 : levelMap.get(index2);
+          if (Array.isArray(rowTasks)) {
+            tasksAtRow.push(...rowTasks);
+          }
         }
+      } else {
+        const task = mapGlobalRowIndexToTask.get(index2);
+        if (task)
+          tasksAtRow.push(task);
       }
-      if (comparisonLevel > comparisonLevels) {
-        continue;
-      }
-      if (task.type === "empty" || task.type === "user") {
-        continue;
-      }
-      const key = `${comparisonLevel}_${task.id}`;
-      const criticalPathOnLevel = criticalPaths ? criticalPaths.get(comparisonLevel) : void 0;
-      const isCritical = criticalPathOnLevel ? criticalPathOnLevel.tasks.has(task.id) : false;
-      const {
-        containerX,
-        containerWidth,
-        innerX1,
-        innerX2,
-        width,
-        levelY,
-        progressWidth,
-        x1: taskX1,
-        x2: taskX2
-      } = getTaskCoordinates2(task);
-      tasksRes.push(
-        /* @__PURE__ */ jsx(
-          "svg",
-          {
-            id: task.id,
-            className: "TaskItemClassName",
-            x: containerX + (additionalLeftSpace || 0),
-            y: levelY,
-            width: containerWidth,
-            height: fullRowHeight,
-            children: /* @__PURE__ */ jsx(
-              TaskItem,
-              {
-                getTaskGlobalIndexByRef,
-                hasChildren: checkHasChildren(task, childTasksMap),
-                hasDependencyWarning: taskToHasDependencyWarningMap ? checkTaskHasDependencyWarning(
-                  task,
-                  taskToHasDependencyWarningMap
-                ) : false,
-                progressWidth,
-                progressX: rtl ? innerX2 : innerX1,
-                selectTaskOnMouseDown,
-                task,
-                taskYOffset,
-                width,
-                x1: innerX1,
-                x2: innerX2,
-                childOutOfParentWarnings,
-                distances,
-                taskHeight,
-                taskHalfHeight,
-                isProgressChangeable: !task.isDisabled,
-                isDateChangeable: !task.isDisabled,
-                isRelationChangeable: !task.isRelationDisabled,
-                authorizedRelations,
-                ganttRelationEvent,
-                isDelete: !task.isDisabled,
-                onDoubleClick,
-                onClick,
-                onEventStart: handleTaskDragStart,
-                setTooltipTask,
-                onRelationStart: handleBarRelationStart,
-                isSelected: Boolean(selectedIdsMirror[taskId]),
-                isCritical,
-                rtl,
-                fixStartPosition,
-                fixEndPosition,
-                handleDeleteTasks,
-                colorStyles
-              }
-            )
-          },
-          key
-        )
-      );
-      const addedDependenciesAtLevel = addedDependencies[comparisonLevel] || {};
-      if (!addedDependencies[comparisonLevel]) {
-        addedDependencies[comparisonLevel] = addedDependenciesAtLevel;
-      }
-      const addedDependenciesAtTask = addedDependenciesAtLevel[taskId] || {};
-      if (!addedDependenciesAtLevel[taskId]) {
-        addedDependenciesAtLevel[taskId] = addedDependenciesAtTask;
-      }
-      const dependenciesAtLevel = dependencyMap.get(comparisonLevel);
-      if (!dependenciesAtLevel) {
-        continue;
-      }
-      const dependenciesByTask = dependenciesAtLevel.get(taskId);
-      if (dependenciesByTask) {
-        const criticalPathForTask = criticalPathOnLevel ? criticalPathOnLevel.dependencies.get(task.id) : void 0;
-        dependenciesByTask.filter(({ source }) => visibleTasksMirror[source.id]).forEach(
-          ({
-            containerHeight,
-            containerY,
-            innerFromY,
-            innerToY,
-            marginBetweenTasks,
-            ownTarget,
-            source,
-            sourceTarget
-          }) => {
-            if (addedDependenciesAtTask[source.id]) {
-              return;
-            }
-            addedDependenciesAtTask[source.id] = true;
-            const isCritical2 = criticalPathForTask ? criticalPathForTask.has(source.id) : false;
-            const { x1: fromX1, x2: fromX2 } = getTaskCoordinates2(source);
-            const containerX2 = Math.min(fromX1, taskX1) - 300;
-            const containerWidth2 = Math.max(fromX2, taskX2) - containerX2 + 300;
-            arrowsRes.push(
+      console.log("tasksAtRow", tasksAtRow);
+      for (const task of tasksAtRow) {
+        const comparisonLevel = task.comparisonLevel ?? 1;
+        const { id: taskId } = task;
+        if (selectedIdsMirror[taskId] && !addedSelectedTasks[taskId]) {
+          addedSelectedTasks[taskId] = true;
+          const rowIndex = (_a = taskToRowIndexMap.get(comparisonLevel)) == null ? void 0 : _a.get(taskId);
+          if (typeof rowIndex === "number") {
+            selectedTasksRes.push(
               /* @__PURE__ */ jsx(
-                "svg",
+                "rect",
                 {
-                  className: "ArrowClassName",
-                  x: containerX2 + (additionalLeftSpace || 0),
-                  y: containerY,
-                  width: containerWidth2,
-                  height: containerHeight,
-                  children: /* @__PURE__ */ jsx(
-                    Arrow,
-                    {
-                      colorStyles,
-                      distances,
-                      taskFrom: source,
-                      extremityFrom: sourceTarget,
-                      fromX1: fromX1 - containerX2,
-                      fromX2: fromX2 - containerX2,
-                      fromY: innerFromY,
-                      taskTo: task,
-                      extremityTo: ownTarget,
-                      toX1: taskX1 - containerX2,
-                      toX2: taskX2 - containerX2,
-                      toY: innerToY,
-                      marginBetweenTasks,
-                      fullRowHeight,
-                      taskHeight,
-                      isShowDependencyWarnings,
-                      isCritical: isCritical2,
-                      rtl,
-                      onArrowDoubleClick,
-                      onArrowClick,
-                      handleFixDependency
-                    }
-                  )
+                  x: 0,
+                  y: rowIndex * fullRowHeight,
+                  width: "100%",
+                  height: fullRowHeight,
+                  fill: colorStyles.selectedTaskBackgroundColor
                 },
-                `Arrow from ${source.id} to ${taskId} on ${comparisonLevel}`
+                `selected-${taskId}`
               )
             );
           }
-        );
-      }
-      const dependentsAtLevel = dependentMap.get(comparisonLevel);
-      if (!dependentsAtLevel) {
-        continue;
-      }
-      const dependentsByTask = dependentsAtLevel.get(taskId);
-      if (dependentsByTask) {
-        dependentsByTask.filter(({ dependent }) => visibleTasksMirror[dependent.id]).forEach(
-          ({
-            containerHeight,
-            containerY,
-            innerFromY,
-            innerToY,
-            marginBetweenTasks,
-            ownTarget,
-            dependent,
-            dependentTarget
-          }) => {
-            const addedDependenciesAtDependent = addedDependenciesAtLevel[dependent.id] || {};
-            if (!addedDependenciesAtLevel[dependent.id]) {
-              addedDependenciesAtLevel[dependent.id] = addedDependenciesAtDependent;
-            }
-            if (addedDependenciesAtDependent[taskId]) {
-              return;
-            }
-            addedDependenciesAtDependent[taskId] = true;
-            const criticalPathForTask = criticalPathOnLevel ? criticalPathOnLevel.dependencies.get(dependent.id) : void 0;
-            const isCritical2 = criticalPathForTask ? criticalPathForTask.has(task.id) : false;
-            const { x1: toX1, x2: toX2 } = getTaskCoordinates2(dependent);
-            const containerX2 = Math.min(toX1, taskX1) - 300;
-            const containerWidth2 = Math.max(toX2, taskX2) - containerX2 + 300;
-            arrowsRes.push(
-              /* @__PURE__ */ jsx(
-                "svg",
+        }
+        if (comparisonLevel > comparisonLevels)
+          continue;
+        if (task.type === "empty" || task.type === "user")
+          continue;
+        const key = `${comparisonLevel}_${task.id}`;
+        const criticalPathOnLevel = criticalPaths == null ? void 0 : criticalPaths.get(comparisonLevel);
+        const isCritical = !!(criticalPathOnLevel == null ? void 0 : criticalPathOnLevel.tasks.has(task.id));
+        const {
+          containerX,
+          containerWidth,
+          innerX1,
+          innerX2,
+          width,
+          levelY,
+          progressWidth,
+          x1: taskX1,
+          x2: taskX2
+        } = getTaskCoordinates2(task);
+        tasksRes.push(
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              id: task.id,
+              className: "TaskItemClassName",
+              x: containerX + additionalLeftSpace,
+              y: levelY,
+              width: containerWidth,
+              height: fullRowHeight,
+              children: /* @__PURE__ */ jsx(
+                TaskItem,
                 {
-                  x: containerX2 + (additionalLeftSpace || 0),
-                  y: containerY,
-                  width: containerWidth2,
-                  height: containerHeight,
-                  children: /* @__PURE__ */ jsx(
-                    Arrow,
-                    {
-                      colorStyles,
-                      distances,
-                      taskFrom: task,
-                      extremityFrom: ownTarget,
-                      fromX1: taskX1 - containerX2,
-                      fromX2: taskX2 - containerX2,
-                      fromY: innerFromY,
-                      taskTo: dependent,
-                      extremityTo: dependentTarget,
-                      toX1: toX1 - containerX2,
-                      toX2: toX2 - containerX2,
-                      toY: innerToY,
-                      marginBetweenTasks,
-                      fullRowHeight,
-                      taskHeight,
-                      isShowDependencyWarnings,
-                      isCritical: isCritical2,
-                      rtl,
-                      onArrowDoubleClick,
-                      onArrowClick,
-                      handleFixDependency
-                    }
-                  )
-                },
-                `Arrow from ${taskId} to ${dependent.id} on ${comparisonLevel}`
+                  getTaskGlobalIndexByRef,
+                  hasChildren: checkHasChildren(task, childTasksMap),
+                  hasDependencyWarning: taskToHasDependencyWarningMap ? checkTaskHasDependencyWarning(task, taskToHasDependencyWarningMap) : false,
+                  progressWidth,
+                  progressX: rtl ? innerX2 : innerX1,
+                  selectTaskOnMouseDown,
+                  task,
+                  taskYOffset,
+                  width,
+                  x1: innerX1,
+                  x2: innerX2,
+                  childOutOfParentWarnings,
+                  distances,
+                  taskHeight,
+                  taskHalfHeight,
+                  isProgressChangeable: !task.isDisabled,
+                  isDateChangeable: !task.isDisabled,
+                  isRelationChangeable: !task.isRelationDisabled,
+                  authorizedRelations,
+                  ganttRelationEvent,
+                  isDelete: !task.isDisabled,
+                  onDoubleClick,
+                  onClick,
+                  onEventStart: handleTaskDragStart,
+                  setTooltipTask,
+                  onRelationStart: handleBarRelationStart,
+                  isSelected: Boolean(selectedIdsMirror[taskId]),
+                  isCritical,
+                  rtl,
+                  fixStartPosition,
+                  fixEndPosition,
+                  handleDeleteTasks,
+                  colorStyles
+                }
               )
-            );
-          }
+            },
+            key
+          )
         );
+        const addedDependenciesAtLevel = addedDependencies[comparisonLevel] ?? (addedDependencies[comparisonLevel] = {});
+        const addedDependenciesAtTask = addedDependenciesAtLevel[taskId] ?? (addedDependenciesAtLevel[taskId] = {});
+        const dependenciesAtLevel = dependencyMap.get(comparisonLevel);
+        const dependenciesByTask = dependenciesAtLevel == null ? void 0 : dependenciesAtLevel.get(taskId);
+        dependenciesByTask == null ? void 0 : dependenciesByTask.filter(({ source }) => visibleTasksMirror[source.id]).forEach((dep) => {
+          var _a2;
+          if (addedDependenciesAtTask[dep.source.id])
+            return;
+          addedDependenciesAtTask[dep.source.id] = true;
+          const { x1: fromX1, x2: fromX2 } = getTaskCoordinates2(dep.source);
+          const containerX2 = Math.min(fromX1, taskX1) - 300;
+          const containerWidth2 = Math.max(fromX2, taskX2) - containerX2 + 300;
+          const isDepCritical = !!((_a2 = criticalPathOnLevel == null ? void 0 : criticalPathOnLevel.dependencies.get(task.id)) == null ? void 0 : _a2.has(dep.source.id));
+          arrowsRes.push(
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                className: "ArrowClassName",
+                x: containerX2 + additionalLeftSpace,
+                y: dep.containerY,
+                width: containerWidth2,
+                height: dep.containerHeight,
+                children: /* @__PURE__ */ jsx(
+                  Arrow,
+                  {
+                    colorStyles,
+                    distances,
+                    taskFrom: dep.source,
+                    extremityFrom: dep.sourceTarget,
+                    fromX1: fromX1 - containerX2,
+                    fromX2: fromX2 - containerX2,
+                    fromY: dep.innerFromY,
+                    taskTo: task,
+                    extremityTo: dep.ownTarget,
+                    toX1: taskX1 - containerX2,
+                    toX2: taskX2 - containerX2,
+                    toY: dep.innerToY,
+                    marginBetweenTasks: dep.marginBetweenTasks,
+                    fullRowHeight,
+                    taskHeight,
+                    isShowDependencyWarnings,
+                    isCritical: isDepCritical,
+                    rtl,
+                    onArrowDoubleClick,
+                    onArrowClick,
+                    handleFixDependency
+                  }
+                )
+              },
+              `Arrow from ${dep.source.id} to ${taskId} on ${comparisonLevel}`
+            )
+          );
+        });
+        const dependentsAtLevel = dependentMap.get(comparisonLevel);
+        const dependentsByTask = dependentsAtLevel == null ? void 0 : dependentsAtLevel.get(taskId);
+        dependentsByTask == null ? void 0 : dependentsByTask.filter(({ dependent }) => visibleTasksMirror[dependent.id]).forEach((dep) => {
+          var _a2, _b;
+          console.log("dependent", dep);
+          const addedDepsForDep = addedDependenciesAtLevel[_a2 = dep.dependent.id] ?? (addedDependenciesAtLevel[_a2] = {});
+          if (addedDepsForDep[taskId])
+            return;
+          addedDepsForDep[taskId] = true;
+          const isDepCritical = !!((_b = criticalPathOnLevel == null ? void 0 : criticalPathOnLevel.dependencies.get(dep.dependent.id)) == null ? void 0 : _b.has(task.id));
+          const { x1: toX1, x2: toX2 } = getTaskCoordinates2(dep.dependent);
+          const containerX2 = Math.min(toX1, taskX1) - 300;
+          const containerWidth2 = Math.max(toX2, taskX2) - containerX2 + 300;
+          arrowsRes.push(
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                className: "ArrowClassName",
+                x: containerX2 + additionalLeftSpace,
+                y: dep.containerY,
+                width: containerWidth2,
+                height: dep.containerHeight,
+                children: /* @__PURE__ */ jsx(
+                  Arrow,
+                  {
+                    colorStyles,
+                    distances,
+                    taskFrom: task,
+                    extremityFrom: dep.ownTarget,
+                    fromX1: taskX1 - containerX2,
+                    fromX2: taskX2 - containerX2,
+                    fromY: dep.innerFromY,
+                    taskTo: dep.dependent,
+                    extremityTo: dep.dependentTarget,
+                    toX1: toX1 - containerX2,
+                    toX2: toX2 - containerX2,
+                    toY: dep.innerToY,
+                    marginBetweenTasks: dep.marginBetweenTasks,
+                    fullRowHeight,
+                    taskHeight,
+                    isShowDependencyWarnings,
+                    isCritical: isDepCritical,
+                    rtl,
+                    onArrowDoubleClick,
+                    onArrowClick,
+                    handleFixDependency
+                  }
+                )
+              },
+              `Arrow from ${taskId} to ${dep.dependent.id} on ${comparisonLevel}`
+            )
+          );
+        });
       }
     }
     return [tasksRes, arrowsRes, selectedTasksRes];
@@ -6702,7 +6770,9 @@ const TaskGanttContent = ({
     renderedRowIndexes,
     selectTaskOnMouseDown,
     selectedIdsMirror,
-    visibleTasksMirror
+    visibleTasksMirror,
+    rowIndexToTasksMap,
+    enableTaskGrouping
   ]);
   return /* @__PURE__ */ jsxs("g", { className: "content", children: [
     renderedSelectedTasks,
@@ -11376,42 +11446,48 @@ const getMapTaskToRowIndexWithGrouping = (tasks, comparisonLevels, isGrouped = f
   const rowIndexToTaskMap = /* @__PURE__ */ new Map();
   const rowIndexToTasksMap = /* @__PURE__ */ new Map();
   const mapGlobalRowIndexToTask = /* @__PURE__ */ new Map();
-  const parentMap = new Map(
-    tasks.map((task) => [task.id, task])
-  );
+  const parentMap = new Map(tasks.map((t2) => [t2.id, t2]));
   let globalRowIndex = 0;
   for (let comparisonLevel = 1; comparisonLevel <= comparisonLevels; comparisonLevel++) {
-    const taskToRowIndexMapAtLevel = /* @__PURE__ */ new Map();
-    const rowIndexToTaskMapAtLevel = /* @__PURE__ */ new Map();
-    const rowIndexToTasksMapAtLevel = /* @__PURE__ */ new Map();
-    taskToRowIndexMap.set(comparisonLevel, taskToRowIndexMapAtLevel);
-    rowIndexToTaskMap.set(comparisonLevel, rowIndexToTaskMapAtLevel);
-    rowIndexToTasksMap.set(comparisonLevel, rowIndexToTasksMapAtLevel);
+    const taskToRow = /* @__PURE__ */ new Map();
+    const rowToTask = /* @__PURE__ */ new Map();
+    const rowToTasks = /* @__PURE__ */ new Map();
+    taskToRowIndexMap.set(comparisonLevel, taskToRow);
+    rowIndexToTaskMap.set(comparisonLevel, rowToTask);
+    rowIndexToTasksMap.set(comparisonLevel, rowToTasks);
     let rowIndex = 0;
     for (const task of tasks) {
-      const level = task.comparisonLevel ?? 1;
-      if (level !== comparisonLevel)
+      if ((task.comparisonLevel ?? 1) !== comparisonLevel)
         continue;
-      const { id, parent } = task;
+      const { id, parent, type } = task;
       let assignedRowIndex = rowIndex;
-      if (isGrouped && parent && parentMap.has(parent)) {
+      if (type === "user" || type === "project") {
+        taskToRow.set(id, rowIndex);
+        rowToTask.set(rowIndex, task);
+        rowToTasks.set(rowIndex, [task]);
+        mapGlobalRowIndexToTask.set(globalRowIndex, task);
+        rowIndex++;
+        globalRowIndex++;
+        continue;
+      }
+      if (isGrouped && parent) {
         const parentTask = parentMap.get(parent);
-        const isGroupedAudit = (parentTask == null ? void 0 : parentTask.type) === "user" && (parentTask == null ? void 0 : parentTask.hideChildren);
-        if (isGroupedAudit) {
-          const parentRowIndex = taskToRowIndexMapAtLevel.get(parent);
-          if (typeof parentRowIndex === "number") {
-            assignedRowIndex = parentRowIndex;
-          }
+        const parentRowIndex = taskToRow.get(parent);
+        if ((parentTask == null ? void 0 : parentTask.hideChildren) && parentRowIndex !== void 0) {
+          assignedRowIndex = parentRowIndex;
+        } else {
+          assignedRowIndex = rowIndex;
+          rowIndex++;
         }
-      }
-      taskToRowIndexMapAtLevel.set(id, assignedRowIndex);
-      rowIndexToTaskMapAtLevel.set(assignedRowIndex, task);
-      const existingTasks = rowIndexToTasksMapAtLevel.get(assignedRowIndex) ?? [];
-      rowIndexToTasksMapAtLevel.set(assignedRowIndex, [...existingTasks, task]);
-      mapGlobalRowIndexToTask.set(globalRowIndex, task);
-      if (assignedRowIndex === rowIndex) {
+      } else {
+        assignedRowIndex = rowIndex;
         rowIndex++;
       }
+      taskToRow.set(id, assignedRowIndex);
+      rowToTask.set(assignedRowIndex, task);
+      const existing = rowToTasks.get(assignedRowIndex) ?? [];
+      rowToTasks.set(assignedRowIndex, [...existing, task]);
+      mapGlobalRowIndexToTask.set(globalRowIndex, task);
       globalRowIndex++;
     }
   }
@@ -11477,6 +11553,7 @@ const defaultDateFormats = {
 const defaultDistances = {
   actionColumnWidth: 40,
   arrowIndent: 20,
+  taskHeight: 24,
   barCornerRadius: 3,
   barFill: 60,
   columnWidth: 60,
@@ -11663,11 +11740,6 @@ const Gantt = ({
     () => distances.rowHeight * comparisonLevels,
     [distances, comparisonLevels]
   );
-  const renderedRowIndexes = useOptimizedList(
-    ganttTaskContentRef,
-    "scrollTop",
-    distances.rowHeight
-  );
   const colorStyles = useMemo(
     () => ({
       ...defaultColors,
@@ -11683,18 +11755,15 @@ 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 [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask, rowIndexToTasksMap] = useMemo(
+    () => enableTaskGrouping ? getMapTaskToRowIndexWithGrouping(visibleTasks, comparisonLevels, true) : getMapTaskToRowIndex(visibleTasks, comparisonLevels),
+    [visibleTasks, comparisonLevels, enableTaskGrouping]
+  );
   const maxLevelLength = useMemo(() => {
-    if (enableTaskGrouping) {
-      return Math.max((rowIndexToTasksMap == null ? void 0 : rowIndexToTasksMap.size) ?? 0, 1);
-    }
     let maxLength = 0;
     const countByLevel = {};
     visibleTasks.forEach(({ comparisonLevel = 1 }) => {
@@ -11707,20 +11776,26 @@ const Gantt = ({
       }
     });
     return maxLength;
-  }, [visibleTasks, comparisonLevels, enableTaskGrouping, rowIndexToTasksMap]);
+  }, [visibleTasks, comparisonLevels]);
   const ganttFullHeight = useMemo(() => {
-    if (enableTaskGrouping) {
-      let totalHeight = 0;
-      for (const [, taskMap] of rowIndexToTasksMap) {
-        for (const [, tasks2] of taskMap) {
-          const rowHeight = tasks2.length * (taskHeight + 2);
-          totalHeight += Math.max(rowHeight, fullRowHeight);
-        }
-      }
-      return Math.max(totalHeight, fullRowHeight);
+    if (!enableTaskGrouping) {
+      return maxLevelLength * fullRowHeight;
     }
-    return maxLevelLength * fullRowHeight;
-  }, [enableTaskGrouping, rowIndexToTasksMap, maxLevelLength, fullRowHeight, taskHeight]);
+    let totalRows = 0;
+    for (const comparisonMap of rowIndexToTasksMap.values()) {
+      totalRows += comparisonMap.size;
+    }
+    return totalRows * fullRowHeight;
+  }, [enableTaskGrouping, rowIndexToTasksMap, maxLevelLength, fullRowHeight]);
+  const renderedRowIndexes = enableTaskGrouping ? useGroupedVirtualization(
+    //ganttTaskContentRef,
+    rowIndexToTasksMap,
+    fullRowHeight
+  ) : useOptimizedList(
+    ganttTaskContentRef,
+    "scrollTop",
+    fullRowHeight
+  );
   const {
     checkHasCopyTasks,
     checkHasCutTasks,
@@ -11779,22 +11854,10 @@ const Gantt = ({
   const svgClientWidth = renderedColumnIndexes && renderedColumnIndexes[4];
   const countTaskCoordinates$1 = useCallback(
     (task) => {
-      var _a;
       if (enableTaskGrouping) {
-        const comparisonLevel = task.comparisonLevel ?? 1;
-        let sequentialOffset = 0;
-        const indexesAtLevel = taskToRowIndexMap.get(comparisonLevel);
-        const rowIndex = indexesAtLevel == null ? void 0 : indexesAtLevel.get(task.id);
-        if (typeof rowIndex === "number") {
-          const rowTasksAtLevel = ((_a = rowIndexToTasksMap.get(comparisonLevel)) == null ? void 0 : _a.get(rowIndex)) ?? [];
-          const indexInRow = rowTasksAtLevel.findIndex((t2) => t2.id === task.id);
-          if (indexInRow !== -1) {
-            sequentialOffset = indexInRow * (taskHeight + 2);
-          }
-        }
         return countTaskCoordinatesWithGrouping(
           task,
-          taskToRowIndexMap,
+          rowIndexToTasksMap,
           startDate,
           viewMode,
           rtl,
@@ -11803,7 +11866,7 @@ const Gantt = ({
           taskYOffset,
           distances,
           svgWidth,
-          sequentialOffset
+          0
         );
       }
       return countTaskCoordinates(
@@ -11834,7 +11897,19 @@ const Gantt = ({
     ]
   );
   const mapTaskToCoordinates = useMemo(
-    () => getMapTaskToCoordinates(
+    () => enableTaskGrouping ? getMapTaskToCoordinatesWithGrouping(
+      tasks,
+      visibleTasksMirror,
+      rowIndexToTasksMap,
+      startDate,
+      viewMode,
+      rtl,
+      fullRowHeight,
+      taskHeight,
+      taskYOffset,
+      distances,
+      svgWidth
+    ) : getMapTaskToCoordinates(
       tasks,
       visibleTasksMirror,
       taskToRowIndexMap,
@@ -11848,17 +11923,19 @@ const Gantt = ({
       svgWidth
     ),
     [
-      distances,
-      fullRowHeight,
+      tasks,
+      visibleTasksMirror,
+      rowIndexToTasksMap,
       taskToRowIndexMap,
-      rtl,
       startDate,
-      svgWidth,
+      viewMode,
+      rtl,
+      fullRowHeight,
       taskHeight,
-      tasks,
       taskYOffset,
-      viewMode,
-      visibleTasksMirror
+      distances,
+      svgWidth,
+      enableTaskGrouping
     ]
   );
   const scrollToTask = useCallback(
@@ -11993,8 +12070,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,
@@ -12870,6 +12945,8 @@ const Gantt = ({
   };
   const barProps = useMemo(
     () => ({
+      enableTaskGrouping,
+      rowIndexToTasksMap,
       authorizedRelations,
       additionalLeftSpace,
       additionalRightSpace,
@@ -12919,6 +12996,8 @@ const Gantt = ({
     [
       additionalLeftSpace,
       additionalRightSpace,
+      enableTaskGrouping,
+      rowIndexToTasksMap,
       checkIsHoliday,
       childOutOfParentWarnings,
       childTasksMap,
@@ -12970,6 +13049,7 @@ const Gantt = ({
     TaskListHeader,
     TaskListTable,
     enableTaskGrouping,
+    rowIndexToTasksMap,
     canMoveTasks,
     canResizeColumns,
     childTasksMap,