gantt-task-react-v 1.3.4 → 1.3.5

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

@@ -13168,40 +13168,47 @@ const TaskGanttContentInner = (props) => {
         )
       );
       if (task.comparisonDates && comparisonDates) {
+        console.log(`Comparison bar for task ${task.id}:`, {
+          originalCoords: comparisonDates,
+          taskComparisonDates: task.comparisonDates
+        });
         const safeComparisonX = isNaN(comparisonDates.x) || !isFinite(comparisonDates.x) ? 0 : comparisonDates.x;
-        const safeComparisonY = isNaN(comparisonDates.y) || !isFinite(comparisonDates.y) ? safeLevelY : comparisonDates.y;
-        const safeComparisonWidth = isNaN(comparisonDates.width) || !isFinite(comparisonDates.width) ? 10 : Math.max(comparisonDates.width, 1);
-        const safeComparisonHeight = isNaN(comparisonDates.height) || !isFinite(comparisonDates.height) ? 4 : Math.max(comparisonDates.height, 1);
-        tasksRes.push(
-          /* @__PURE__ */ jsx(
-            "svg",
-            {
-              id: task.id + "_comparison",
-              className: "TaskItemWrapperComparison",
-              x: Math.max(safeComparisonX + (additionalLeftSpace || 0), 0),
-              y: safeComparisonY,
-              width: safeComparisonWidth,
-              height: safeComparisonHeight * 2,
-              children: /* @__PURE__ */ jsx(
-                BarComparison,
-                {
-                  inProgress: !task.comparisonDates.end,
-                  isPlan: task.comparisonDates.start.getTime() >= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.end.getTime() || task.comparisonDates.start.getTime() <= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.start.getTime(),
-                  isWarning: !!task.comparisonDates.end && task.comparisonDates.end.getTime() >= task.end.getTime(),
-                  isCritical: task.comparisonDates.start.getTime() > task.start.getTime(),
-                  barCornerRadius: distances.barCornerRadius,
-                  height: safeComparisonHeight,
-                  width: safeComparisonWidth,
-                  borderHeight: distances.barComparisonTaskBorderHeight,
-                  yOffset: distances.barComparisonTaskYOffset,
-                  task,
-                  onTooltipTask
-                }
-              )
-            },
-            key2 + "_comparison"
-          )
-        );
+        const safeComparisonWidth = isNaN(comparisonDates.width) || !isFinite(comparisonDates.width) ? 10 : Math.max(comparisonDates.width, 3);
+        const safeComparisonHeight = isNaN(comparisonDates.height) || !isFinite(comparisonDates.height) ? 6 : Math.max(comparisonDates.height, 3);
+        const comparisonRight = safeComparisonX + safeComparisonWidth;
+        const isVisible = comparisonRight >= 0 && safeComparisonX <= 1e4;
+        if (isVisible) {
+          tasksRes.push(
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                id: task.id + "_comparison",
+                className: "TaskItemWrapperComparison",
+                x: Math.max(safeComparisonX + (additionalLeftSpace || 0), 0),
+                y: safeLevelY + taskHeight + 2,
+                width: safeComparisonWidth,
+                height: safeComparisonHeight,
+                children: /* @__PURE__ */ jsx(
+                  BarComparison,
+                  {
+                    inProgress: !task.comparisonDates.end,
+                    isPlan: task.comparisonDates.start.getTime() >= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.end.getTime() || task.comparisonDates.start.getTime() <= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.start.getTime(),
+                    isWarning: !!task.comparisonDates.end && task.comparisonDates.end.getTime() >= task.end.getTime(),
+                    isCritical: task.comparisonDates.start.getTime() > task.start.getTime(),
+                    barCornerRadius: distances.barCornerRadius,
+                    height: safeComparisonHeight,
+                    width: safeComparisonWidth,
+                    borderHeight: distances.barComparisonTaskBorderHeight,
+                    yOffset: distances.barComparisonTaskYOffset,
+                    task,
+                    onTooltipTask
+                  }
+                )
+              },
+              key2 + "_comparison"
+            )
+          );
+        }
       }
       const addedDependenciesAtLevel = addedDependencies[comparisonLevel] || {};
       if (!addedDependencies[comparisonLevel]) {
@@ -13860,11 +13867,12 @@ const countTaskCoordinates = (task, taskToRowIndexMap, startDate, viewMode, rtl,
     );
     cx1 = isNaN(cx1) || !isFinite(cx1) ? x1 : cx1;
     cx2 = isNaN(cx2) || !isFinite(cx2) ? x2 : cx2;
+    const comparisonWidth = Math.max(Math.abs(cx2 - cx1), 3);
+    const comparisonX = Math.min(cx1, cx2);
     comparisonDates = {
-      x: cx1,
+      x: comparisonX,
       y: y + taskHeight,
-      width: Math.max(cx2 - cx1, 1),
-      // Ensure minimum width of 1px for visibility
+      width: comparisonWidth,
       height: barComparisonTaskHeight
     };
   }

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

@@ -13185,40 +13185,47 @@
           )
         );
         if (task.comparisonDates && comparisonDates) {
+          console.log(`Comparison bar for task ${task.id}:`, {
+            originalCoords: comparisonDates,
+            taskComparisonDates: task.comparisonDates
+          });
           const safeComparisonX = isNaN(comparisonDates.x) || !isFinite(comparisonDates.x) ? 0 : comparisonDates.x;
-          const safeComparisonY = isNaN(comparisonDates.y) || !isFinite(comparisonDates.y) ? safeLevelY : comparisonDates.y;
-          const safeComparisonWidth = isNaN(comparisonDates.width) || !isFinite(comparisonDates.width) ? 10 : Math.max(comparisonDates.width, 1);
-          const safeComparisonHeight = isNaN(comparisonDates.height) || !isFinite(comparisonDates.height) ? 4 : Math.max(comparisonDates.height, 1);
-          tasksRes.push(
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "svg",
-              {
-                id: task.id + "_comparison",
-                className: "TaskItemWrapperComparison",
-                x: Math.max(safeComparisonX + (additionalLeftSpace || 0), 0),
-                y: safeComparisonY,
-                width: safeComparisonWidth,
-                height: safeComparisonHeight * 2,
-                children: /* @__PURE__ */ jsxRuntime.jsx(
-                  BarComparison,
-                  {
-                    inProgress: !task.comparisonDates.end,
-                    isPlan: task.comparisonDates.start.getTime() >= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.end.getTime() || task.comparisonDates.start.getTime() <= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.start.getTime(),
-                    isWarning: !!task.comparisonDates.end && task.comparisonDates.end.getTime() >= task.end.getTime(),
-                    isCritical: task.comparisonDates.start.getTime() > task.start.getTime(),
-                    barCornerRadius: distances.barCornerRadius,
-                    height: safeComparisonHeight,
-                    width: safeComparisonWidth,
-                    borderHeight: distances.barComparisonTaskBorderHeight,
-                    yOffset: distances.barComparisonTaskYOffset,
-                    task,
-                    onTooltipTask
-                  }
-                )
-              },
-              key2 + "_comparison"
-            )
-          );
+          const safeComparisonWidth = isNaN(comparisonDates.width) || !isFinite(comparisonDates.width) ? 10 : Math.max(comparisonDates.width, 3);
+          const safeComparisonHeight = isNaN(comparisonDates.height) || !isFinite(comparisonDates.height) ? 6 : Math.max(comparisonDates.height, 3);
+          const comparisonRight = safeComparisonX + safeComparisonWidth;
+          const isVisible = comparisonRight >= 0 && safeComparisonX <= 1e4;
+          if (isVisible) {
+            tasksRes.push(
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "svg",
+                {
+                  id: task.id + "_comparison",
+                  className: "TaskItemWrapperComparison",
+                  x: Math.max(safeComparisonX + (additionalLeftSpace || 0), 0),
+                  y: safeLevelY + taskHeight + 2,
+                  width: safeComparisonWidth,
+                  height: safeComparisonHeight,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    BarComparison,
+                    {
+                      inProgress: !task.comparisonDates.end,
+                      isPlan: task.comparisonDates.start.getTime() >= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.end.getTime() || task.comparisonDates.start.getTime() <= task.start.getTime() && !!task.comparisonDates.end && task.comparisonDates.end.getTime() <= task.start.getTime(),
+                      isWarning: !!task.comparisonDates.end && task.comparisonDates.end.getTime() >= task.end.getTime(),
+                      isCritical: task.comparisonDates.start.getTime() > task.start.getTime(),
+                      barCornerRadius: distances.barCornerRadius,
+                      height: safeComparisonHeight,
+                      width: safeComparisonWidth,
+                      borderHeight: distances.barComparisonTaskBorderHeight,
+                      yOffset: distances.barComparisonTaskYOffset,
+                      task,
+                      onTooltipTask
+                    }
+                  )
+                },
+                key2 + "_comparison"
+              )
+            );
+          }
         }
         const addedDependenciesAtLevel = addedDependencies[comparisonLevel] || {};
         if (!addedDependencies[comparisonLevel]) {
@@ -13877,11 +13884,12 @@
       );
       cx1 = isNaN(cx1) || !isFinite(cx1) ? x1 : cx1;
       cx2 = isNaN(cx2) || !isFinite(cx2) ? x2 : cx2;
+      const comparisonWidth = Math.max(Math.abs(cx2 - cx1), 3);
+      const comparisonX = Math.min(cx1, cx2);
       comparisonDates = {
-        x: cx1,
+        x: comparisonX,
         y: y + taskHeight,
-        width: Math.max(cx2 - cx1, 1),
-        // Ensure minimum width of 1px for visibility
+        width: comparisonWidth,
         height: barComparisonTaskHeight
       };
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gantt-task-react-v",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "aguilanbon",
   "homepage": "https://github.com/aguilanbon/gantt-task-react-v",