gantt-task-react-v 1.6.19 → 1.7.1

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

@@ -11380,278 +11380,6 @@ const styles$d = {
   ganttToday,
   ganttTodayCircle
 };
-const getDateByOffset = (startDate, offset2, viewMode) => {
-  switch (viewMode) {
-    case ViewMode.Day:
-      return addDays(startDate, offset2);
-    case ViewMode.HalfDay:
-      return addHours(startDate, offset2 * 12);
-    case ViewMode.QuarterDay:
-      return addHours(startDate, offset2 * 6);
-    case ViewMode.Hour:
-      return addHours(startDate, offset2);
-    case ViewMode.Month:
-      return addMonths(startDate, offset2);
-    case ViewMode.Week:
-      return addWeeks(startDate, offset2);
-    case ViewMode.Year:
-      return addYears(startDate, offset2);
-    default:
-      throw new Error("Unknown view mode");
-  }
-};
-const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
-  const index2 = getDatesDiff(xDate, startDate, viewMode);
-  const currentDate = getDateByOffset(startDate, index2, viewMode);
-  const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
-  const remainderMillis = xDate.getTime() - currentDate.getTime();
-  const intervalDuration = nextDate.getTime() - currentDate.getTime();
-  const percentOfInterval = intervalDuration === 0 ? 0 : remainderMillis / intervalDuration;
-  const result = index2 * columnWidth + percentOfInterval * columnWidth;
-  return isNaN(result) || !isFinite(result) ? 0 : result;
-};
-const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
-  const index2 = getDatesDiff(xDate, startDate, viewMode);
-  const currentDate = getDateByOffset(startDate, index2, viewMode);
-  const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
-  const remainderMillis = xDate.getTime() - currentDate.getTime();
-  const intervalDuration = nextDate.getTime() - currentDate.getTime();
-  const percentOfInterval = intervalDuration === 0 ? 0 : remainderMillis / intervalDuration;
-  const result = index2 * columnWidth + percentOfInterval * columnWidth;
-  return isNaN(result) || !isFinite(result) ? 0 : result;
-};
-const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
-  const safeTaskX1 = isNaN(taskX1) || !isFinite(taskX1) ? 0 : taskX1;
-  const safeTaskX2 = isNaN(taskX2) || !isFinite(taskX2) ? 0 : taskX2;
-  const safeProgress = isNaN(progress) || !isFinite(progress) ? 0 : progress;
-  const progressWidth = Math.max(
-    (safeTaskX2 - safeTaskX1) * safeProgress * 0.01,
-    0
-  );
-  let progressX;
-  if (rtl) {
-    progressX = safeTaskX2 - progressWidth;
-  } else {
-    progressX = safeTaskX1;
-  }
-  return [progressWidth, progressX];
-};
-const getProgressPoint = (progressX, taskY, taskHeight) => {
-  const point = [
-    progressX - 5,
-    taskY + taskHeight,
-    progressX + 5,
-    taskY + taskHeight,
-    progressX,
-    taskY + taskHeight - 8.66
-  ];
-  return point.join(",");
-};
-const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
-  const safeX = isNaN(x) || !isFinite(x) ? 0 : x;
-  const safeTaskX = isNaN(taskX) || !isFinite(taskX) ? 0 : taskX;
-  const safeXStep = isNaN(xStep) || !isFinite(xStep) || xStep === 0 ? 1 : xStep;
-  const safeTimeStep = isNaN(timeStep) || !isFinite(timeStep) ? 0 : timeStep;
-  let newDate = new Date(
-    (safeX - safeTaskX) / safeXStep * safeTimeStep + taskDate.getTime()
-  );
-  newDate = new Date(
-    newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
-  );
-  return newDate;
-};
-const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
-  let result;
-  switch (selectedTask.type) {
-    case "milestone":
-      result = handleTaskBySVGMouseEventForMilestone(
-        action,
-        selectedTask,
-        initialCoordinates,
-        coordinates,
-        xStep,
-        timeStep
-      );
-      break;
-    default:
-      result = handleTaskBySVGMouseEventForBar(
-        action,
-        selectedTask,
-        initialCoordinates,
-        coordinates,
-        xStep,
-        timeStep,
-        rtl
-      );
-      break;
-  }
-  return result;
-};
-const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
-  const changedTask = { ...selectedTask };
-  let isChanged = false;
-  switch (action) {
-    case "progress":
-      isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
-      if (isChanged) {
-        changedTask.progress = Math.round(
-          coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
-        );
-      }
-      break;
-    case "start": {
-      isChanged = initialCoordinates.x1 !== coordinates.x1;
-      if (isChanged) {
-        if (rtl) {
-          changedTask.end = dateByX(
-            coordinates.x1,
-            initialCoordinates.x1,
-            selectedTask.end,
-            xStep,
-            timeStep
-          );
-        } else {
-          changedTask.start = dateByX(
-            coordinates.x1,
-            initialCoordinates.x1,
-            selectedTask.start,
-            xStep,
-            timeStep
-          );
-        }
-      }
-      break;
-    }
-    case "end": {
-      isChanged = initialCoordinates.x2 !== coordinates.x2;
-      if (isChanged) {
-        if (rtl) {
-          changedTask.start = dateByX(
-            coordinates.x2,
-            initialCoordinates.x2,
-            selectedTask.start,
-            xStep,
-            timeStep
-          );
-        } else {
-          changedTask.end = dateByX(
-            coordinates.x2,
-            initialCoordinates.x2,
-            selectedTask.end,
-            xStep,
-            timeStep
-          );
-        }
-      }
-      break;
-    }
-    case "move": {
-      isChanged = initialCoordinates.x1 !== coordinates.x1;
-      if (isChanged) {
-        if (rtl) {
-          changedTask.end = dateByX(
-            coordinates.x1,
-            initialCoordinates.x1,
-            selectedTask.end,
-            xStep,
-            timeStep
-          );
-          changedTask.start = dateByX(
-            coordinates.x2,
-            initialCoordinates.x2,
-            selectedTask.start,
-            xStep,
-            timeStep
-          );
-        } else {
-          changedTask.start = dateByX(
-            coordinates.x1,
-            initialCoordinates.x1,
-            selectedTask.start,
-            xStep,
-            timeStep
-          );
-          changedTask.end = dateByX(
-            coordinates.x2,
-            initialCoordinates.x2,
-            selectedTask.end,
-            xStep,
-            timeStep
-          );
-        }
-      }
-      break;
-    }
-  }
-  return { isChanged, changedTask };
-};
-const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
-  const changedTask = { ...selectedTask };
-  const isChanged = coordinates.x1 !== initialCoordinates.x1;
-  if (isChanged) {
-    switch (action) {
-      case "move": {
-        changedTask.start = dateByX(
-          coordinates.x1,
-          initialCoordinates.x1,
-          selectedTask.start,
-          xStep,
-          timeStep
-        );
-        changedTask.end = changedTask.start;
-        break;
-      }
-    }
-  }
-  return { isChanged, changedTask };
-};
-const DateLine = ({
-  config,
-  additionalLeftSpace,
-  startDate,
-  viewMode,
-  columnWidth,
-  rtl,
-  ganttFullHeight
-}) => {
-  const tickX = taskXCoordinate(config.date, startDate, viewMode, columnWidth);
-  const x = rtl ? tickX + columnWidth : tickX;
-  const absX = additionalLeftSpace + x;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      "rect",
-      {
-        x: absX,
-        y: 0,
-        width: 2,
-        height: ganttFullHeight,
-        fill: config.color,
-        strokeDasharray: config.dashArray
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "circle",
-      {
-        className: styles$d.ganttTodayCircle,
-        cx: absX + 1,
-        cy: 6,
-        r: 6,
-        fill: config.color
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "text",
-      {
-        x: absX + 10,
-        y: 10,
-        fill: config.color,
-        fontSize: 12,
-        fontWeight: 600,
-        children: config.label
-      }
-    )
-  ] });
-};
 const GanttTodayInner = ({
   additionalLeftSpace,
   distances: { columnWidth },
@@ -11662,133 +11390,185 @@ const GanttTodayInner = ({
   viewMode,
   showTodayLine = true,
   showDataDateLine = false,
-  showProjectStartLine = false,
-  showProjectEndLine = false,
   dataDate = null,
-  projectStartDate = null,
-  projectEndDate = null,
   todayColor = null,
   dataDateColor = null,
-  projectStartColor = null,
-  projectEndColor = null,
   todayLabel = "Today",
-  dataDateLabel = "Data Date",
-  projectStartLabel = "Project Start",
-  projectEndLabel = "Project End"
+  dataDateLabel = "Data Date"
 }) => {
-  const lineProps = useMemo(
-    () => ({
-      additionalLeftSpace,
-      startDate,
-      viewMode,
-      columnWidth,
-      rtl,
-      ganttFullHeight
-    }),
-    [
-      additionalLeftSpace,
-      startDate,
-      viewMode,
-      columnWidth,
-      rtl,
-      ganttFullHeight
-    ]
-  );
   const todayElement = useMemo(() => {
     if (isUnknownDates || !showTodayLine) {
       return null;
     }
-    return /* @__PURE__ */ jsx(
-      DateLine,
-      {
-        config: {
-          date: /* @__PURE__ */ new Date(),
-          color: todayColor || "var(--gantt-calendar-today-color)",
-          label: todayLabel
-        },
-        ...lineProps
-      }
-    );
-  }, [isUnknownDates, showTodayLine, todayColor, todayLabel, lineProps]);
-  const dataDateElement = useMemo(() => {
-    if (!showDataDateLine || !dataDate) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(
-      DateLine,
-      {
-        config: {
-          date: dataDate,
-          color: dataDateColor || "#ff6600",
-          label: dataDateLabel
-        },
-        ...lineProps
-      }
-    );
-  }, [showDataDateLine, dataDate, dataDateColor, dataDateLabel, lineProps]);
-  const projectStartElement = useMemo(() => {
-    if (!showProjectStartLine || !projectStartDate) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(
-      DateLine,
-      {
-        config: {
-          date: projectStartDate,
-          color: projectStartColor || "#4caf50",
-          label: projectStartLabel
-        },
-        ...lineProps
+    const today = /* @__PURE__ */ new Date();
+    const todayIndex = getDatesDiff(today, startDate, viewMode);
+    const extraMultiplier = () => {
+      switch (viewMode) {
+        case ViewMode.Week: {
+          const percent = today.getDay() / 7;
+          return 1 + percent * 0.2;
+        }
+        case ViewMode.Month: {
+          const dayInMonth = today.getDate();
+          const maxDaysInMonth = getDaysInMonth(
+            today.getMonth(),
+            today.getFullYear()
+          );
+          const percent = dayInMonth / maxDaysInMonth;
+          return 1 + percent * 0.5;
+        }
+        case ViewMode.Year: {
+          const percent = today.getMonth() / 12;
+          return 1 + percent * 0.5;
+        }
+        default:
+          return 1;
       }
-    );
+    };
+    const tickX = todayIndex * columnWidth * extraMultiplier();
+    const x = rtl ? tickX + columnWidth : tickX;
+    const color = todayColor || "var(--gantt-calendar-today-color)";
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "rect",
+        {
+          x: additionalLeftSpace + x,
+          y: 0,
+          width: 2,
+          height: ganttFullHeight,
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "circle",
+        {
+          className: styles$d.ganttTodayCircle,
+          cx: x + 1,
+          cy: 6,
+          r: 6,
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "text",
+        {
+          x: additionalLeftSpace + x + 8,
+          y: 10,
+          fill: color,
+          fontSize: 12,
+          fontWeight: 600,
+          children: todayLabel
+        }
+      )
+    ] });
   }, [
-    showProjectStartLine,
-    projectStartDate,
-    projectStartColor,
-    projectStartLabel,
-    lineProps
+    additionalLeftSpace,
+    columnWidth,
+    ganttFullHeight,
+    isUnknownDates,
+    rtl,
+    startDate,
+    viewMode,
+    showTodayLine,
+    todayColor,
+    todayLabel
   ]);
-  const projectEndElement = useMemo(() => {
-    if (!showProjectEndLine || !projectEndDate) {
+  const dataDateElement = useMemo(() => {
+    if (!showDataDateLine || !dataDate) {
       return null;
     }
-    return /* @__PURE__ */ jsx(
-      DateLine,
-      {
-        config: {
-          date: projectEndDate,
-          color: projectEndColor || "#f44336",
-          label: projectEndLabel
-        },
-        ...lineProps
+    const dataIndex = getDatesDiff(dataDate, startDate, viewMode);
+    const extraMultiplier = () => {
+      switch (viewMode) {
+        case ViewMode.Week: {
+          const percent = dataDate.getDay() / 7;
+          return 1 + percent * 0.2;
+        }
+        case ViewMode.Month: {
+          const dayInMonth = dataDate.getDate();
+          const maxDaysInMonth = getDaysInMonth(
+            dataDate.getMonth(),
+            dataDate.getFullYear()
+          );
+          const percent = dayInMonth / maxDaysInMonth;
+          return 1 + percent * 0.5;
+        }
+        case ViewMode.Year: {
+          const percent = dataDate.getMonth() / 12;
+          return 1 + percent * 0.5;
+        }
+        default:
+          return 1;
       }
-    );
+    };
+    const tickX = dataIndex * columnWidth * extraMultiplier();
+    const x = rtl ? tickX + columnWidth : tickX;
+    const color = dataDateColor || "var(--gantt-calendar-today-color)";
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "rect",
+        {
+          x: additionalLeftSpace + x,
+          y: 0,
+          width: 2,
+          height: ganttFullHeight,
+          fill: color,
+          opacity: 0.9
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "circle",
+        {
+          className: styles$d.ganttTodayCircle,
+          cx: x + 1,
+          cy: 6,
+          r: 6,
+          fill: color
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "text",
+        {
+          x: additionalLeftSpace + x + 8,
+          y: 10,
+          fill: color,
+          fontSize: 12,
+          fontWeight: 600,
+          children: dataDateLabel || "Data Date"
+        }
+      )
+    ] });
   }, [
-    showProjectEndLine,
-    projectEndDate,
-    projectEndColor,
-    projectEndLabel,
-    lineProps
+    additionalLeftSpace,
+    columnWidth,
+    ganttFullHeight,
+    rtl,
+    startDate,
+    viewMode,
+    showDataDateLine,
+    dataDate,
+    dataDateColor,
+    dataDateLabel
   ]);
   return /* @__PURE__ */ jsxs("g", { className: "today", children: [
-    projectStartElement,
-    projectEndElement,
     dataDateElement,
     todayElement
   ] });
 };
 const GanttToday = memo(GanttTodayInner);
-const calendarBottomText = "_calendarBottomText_15t8b_1";
-const calendarTopTick = "_calendarTopTick_15t8b_25";
-const calendarTopText = "_calendarTopText_15t8b_35";
-const calendarHeader = "_calendarHeader_15t8b_61";
-const calendar = "_calendar_15t8b_1";
-const calendarDragging$1 = "_calendarDragging_15t8b_85";
+const calendarBottomText = "_calendarBottomText_1mt8w_1";
+const calendarTopTick = "_calendarTopTick_1mt8w_31";
+const calendarTopText = "_calendarTopText_1mt8w_41";
+const calendarHeader = "_calendarHeader_1mt8w_67";
+const calendarBottomSeparator = "_calendarBottomSeparator_1mt8w_81";
+const calendar = "_calendar_1mt8w_1";
+const calendarDragging$1 = "_calendarDragging_1mt8w_103";
 const styles$c = {
   calendarBottomText,
   calendarTopTick,
   calendarTopText,
   calendarHeader,
+  calendarBottomSeparator,
   calendar,
   calendarDragging: calendarDragging$1
 };
@@ -12072,6 +11852,19 @@ const Calendar = ({
     const bottomValues2 = [];
     let weeksCount = 1;
     const topDefaultHeight = headerHeight * 0.5;
+    bottomValues2.push(
+      /* @__PURE__ */ jsx(
+        "line",
+        {
+          x1: 0,
+          y1: topDefaultHeight,
+          x2: fullSvgWidth,
+          y2: topDefaultHeight,
+          className: styles$c.calendarBottomSeparator
+        },
+        "week-top-border"
+      )
+    );
     for (let i = endColumnIndex; i >= startColumnIndex; i--) {
       const date = getDate(i);
       const month = date.getMonth();
@@ -12081,6 +11874,19 @@ const Calendar = ({
         topValue = renderTopHeaderByDate(date);
       }
       const bottomValue = renderBottomHeaderByDate(date, i);
+      bottomValues2.push(
+        /* @__PURE__ */ jsx(
+          "line",
+          {
+            x1: additionalLeftSpace + columnWidth * i,
+            y1: topDefaultHeight,
+            x2: additionalLeftSpace + columnWidth * i,
+            y2: headerHeight,
+            className: styles$c.calendarBottomSeparator
+          },
+          `week-sep-${i}`
+        )
+      );
       bottomValues2.push(
         renderBottomText(
           additionalLeftSpace + columnWidth * (i + +rtl),
@@ -12116,11 +11922,37 @@ const Calendar = ({
     const bottomValues2 = [];
     const topDefaultHeight = headerHeight * 0.5;
     const renderedMonths = /* @__PURE__ */ new Set();
+    bottomValues2.push(
+      /* @__PURE__ */ jsx(
+        "line",
+        {
+          x1: 0,
+          y1: topDefaultHeight,
+          x2: fullSvgWidth,
+          y2: topDefaultHeight,
+          className: styles$c.calendarBottomSeparator
+        },
+        "day-top-border"
+      )
+    );
     for (let i = startColumnIndex; i <= endColumnIndex; i++) {
       const date = getDate(i);
       const bottomValue = renderBottomHeaderByDate(date, i);
       const month = date.getMonth();
       const fullYear = date.getFullYear();
+      bottomValues2.push(
+        /* @__PURE__ */ jsx(
+          "line",
+          {
+            x1: additionalLeftSpace + columnWidth * i,
+            y1: topDefaultHeight,
+            x2: additionalLeftSpace + columnWidth * i,
+            y2: headerHeight,
+            className: styles$c.calendarBottomSeparator
+          },
+          `day-sep-${i}`
+        )
+      );
       bottomValues2.push(
         renderBottomText(
           additionalLeftSpace + columnWidth * i + columnWidth * 0.5,
@@ -12560,6 +12392,231 @@ const RelationLine = ({
     }
   );
 };
+const getDateByOffset = (startDate, offset2, viewMode) => {
+  switch (viewMode) {
+    case ViewMode.Day:
+      return addDays(startDate, offset2);
+    case ViewMode.HalfDay:
+      return addHours(startDate, offset2 * 12);
+    case ViewMode.QuarterDay:
+      return addHours(startDate, offset2 * 6);
+    case ViewMode.Hour:
+      return addHours(startDate, offset2);
+    case ViewMode.Month:
+      return addMonths(startDate, offset2);
+    case ViewMode.Week:
+      return addWeeks(startDate, offset2);
+    case ViewMode.Year:
+      return addYears(startDate, offset2);
+    default:
+      throw new Error("Unknown view mode");
+  }
+};
+const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
+  const index2 = getDatesDiff(xDate, startDate, viewMode);
+  const currentDate = getDateByOffset(startDate, index2, viewMode);
+  const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
+  const remainderMillis = xDate.getTime() - currentDate.getTime();
+  const intervalDuration = nextDate.getTime() - currentDate.getTime();
+  const percentOfInterval = intervalDuration === 0 ? 0 : remainderMillis / intervalDuration;
+  const result = index2 * columnWidth + percentOfInterval * columnWidth;
+  return isNaN(result) || !isFinite(result) ? 0 : result;
+};
+const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
+  const index2 = getDatesDiff(xDate, startDate, viewMode);
+  const currentDate = getDateByOffset(startDate, index2, viewMode);
+  const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
+  const remainderMillis = xDate.getTime() - currentDate.getTime();
+  const intervalDuration = nextDate.getTime() - currentDate.getTime();
+  const percentOfInterval = intervalDuration === 0 ? 0 : remainderMillis / intervalDuration;
+  const result = index2 * columnWidth + percentOfInterval * columnWidth;
+  return isNaN(result) || !isFinite(result) ? 0 : result;
+};
+const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
+  const safeTaskX1 = isNaN(taskX1) || !isFinite(taskX1) ? 0 : taskX1;
+  const safeTaskX2 = isNaN(taskX2) || !isFinite(taskX2) ? 0 : taskX2;
+  const safeProgress = isNaN(progress) || !isFinite(progress) ? 0 : progress;
+  const progressWidth = Math.max(
+    (safeTaskX2 - safeTaskX1) * safeProgress * 0.01,
+    0
+  );
+  let progressX;
+  if (rtl) {
+    progressX = safeTaskX2 - progressWidth;
+  } else {
+    progressX = safeTaskX1;
+  }
+  return [progressWidth, progressX];
+};
+const getProgressPoint = (progressX, taskY, taskHeight) => {
+  const point = [
+    progressX - 5,
+    taskY + taskHeight,
+    progressX + 5,
+    taskY + taskHeight,
+    progressX,
+    taskY + taskHeight - 8.66
+  ];
+  return point.join(",");
+};
+const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
+  const safeX = isNaN(x) || !isFinite(x) ? 0 : x;
+  const safeTaskX = isNaN(taskX) || !isFinite(taskX) ? 0 : taskX;
+  const safeXStep = isNaN(xStep) || !isFinite(xStep) || xStep === 0 ? 1 : xStep;
+  const safeTimeStep = isNaN(timeStep) || !isFinite(timeStep) ? 0 : timeStep;
+  let newDate = new Date(
+    (safeX - safeTaskX) / safeXStep * safeTimeStep + taskDate.getTime()
+  );
+  newDate = new Date(
+    newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
+  );
+  return newDate;
+};
+const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
+  let result;
+  switch (selectedTask.type) {
+    case "milestone":
+      result = handleTaskBySVGMouseEventForMilestone(
+        action,
+        selectedTask,
+        initialCoordinates,
+        coordinates,
+        xStep,
+        timeStep
+      );
+      break;
+    default:
+      result = handleTaskBySVGMouseEventForBar(
+        action,
+        selectedTask,
+        initialCoordinates,
+        coordinates,
+        xStep,
+        timeStep,
+        rtl
+      );
+      break;
+  }
+  return result;
+};
+const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
+  const changedTask = { ...selectedTask };
+  let isChanged = false;
+  switch (action) {
+    case "progress":
+      isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
+      if (isChanged) {
+        changedTask.progress = Math.round(
+          coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
+        );
+      }
+      break;
+    case "start": {
+      isChanged = initialCoordinates.x1 !== coordinates.x1;
+      if (isChanged) {
+        if (rtl) {
+          changedTask.end = dateByX(
+            coordinates.x1,
+            initialCoordinates.x1,
+            selectedTask.end,
+            xStep,
+            timeStep
+          );
+        } else {
+          changedTask.start = dateByX(
+            coordinates.x1,
+            initialCoordinates.x1,
+            selectedTask.start,
+            xStep,
+            timeStep
+          );
+        }
+      }
+      break;
+    }
+    case "end": {
+      isChanged = initialCoordinates.x2 !== coordinates.x2;
+      if (isChanged) {
+        if (rtl) {
+          changedTask.start = dateByX(
+            coordinates.x2,
+            initialCoordinates.x2,
+            selectedTask.start,
+            xStep,
+            timeStep
+          );
+        } else {
+          changedTask.end = dateByX(
+            coordinates.x2,
+            initialCoordinates.x2,
+            selectedTask.end,
+            xStep,
+            timeStep
+          );
+        }
+      }
+      break;
+    }
+    case "move": {
+      isChanged = initialCoordinates.x1 !== coordinates.x1;
+      if (isChanged) {
+        if (rtl) {
+          changedTask.end = dateByX(
+            coordinates.x1,
+            initialCoordinates.x1,
+            selectedTask.end,
+            xStep,
+            timeStep
+          );
+          changedTask.start = dateByX(
+            coordinates.x2,
+            initialCoordinates.x2,
+            selectedTask.start,
+            xStep,
+            timeStep
+          );
+        } else {
+          changedTask.start = dateByX(
+            coordinates.x1,
+            initialCoordinates.x1,
+            selectedTask.start,
+            xStep,
+            timeStep
+          );
+          changedTask.end = dateByX(
+            coordinates.x2,
+            initialCoordinates.x2,
+            selectedTask.end,
+            xStep,
+            timeStep
+          );
+        }
+      }
+      break;
+    }
+  }
+  return { isChanged, changedTask };
+};
+const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
+  const changedTask = { ...selectedTask };
+  const isChanged = coordinates.x1 !== initialCoordinates.x1;
+  if (isChanged) {
+    switch (action) {
+      case "move": {
+        changedTask.start = dateByX(
+          coordinates.x1,
+          initialCoordinates.x1,
+          selectedTask.start,
+          xStep,
+          timeStep
+        );
+        changedTask.end = changedTask.start;
+        break;
+      }
+    }
+  }
+  return { isChanged, changedTask };
+};
 const barWrapper = "_barWrapper_5jhkr_1";
 const barHandle = "_barHandle_5jhkr_11";
 const barHandleImportantVisible = "_barHandleImportantVisible_5jhkr_37";
@@ -13194,9 +13251,9 @@ const Milestone = ({
     relationHandles
   ] });
 };
-const barLabel = "_barLabel_81831_1";
-const barLabelHidden = "_barLabelHidden_81831_27";
-const barLabelOutside = "_barLabelOutside_81831_37";
+const barLabel = "_barLabel_5nsbb_1";
+const barLabelHidden = "_barLabelHidden_5nsbb_27";
+const barLabelOutside = "_barLabelOutside_5nsbb_37";
 const style = {
   barLabel,
   barLabelHidden,
@@ -13206,6 +13263,7 @@ const TaskResponsiveLabelInner = (props) => {
   const {
     alwaysOutline,
     arrowIndent,
+    forceOutside,
     rtl,
     label: label2,
     taskHeight,
@@ -13221,21 +13279,22 @@ const TaskResponsiveLabelInner = (props) => {
       setIsTextInside(textRef.current.getBBox().width < width);
     }
   }, [textRef, width, viewMode]);
+  const shouldBeOutside = alwaysOutline || forceOutside;
   const calculatedX = useMemo(() => {
-    if (isTextInside && !alwaysOutline) {
+    if (isTextInside && !shouldBeOutside) {
       return x1 + width * 0.5;
     }
     if (rtl && textRef.current) {
       return x1 - textRef.current.getBBox().width - arrowIndent * 0.8;
     }
     return x1 + width + arrowIndent * 1.2;
-  }, [alwaysOutline, x1, width, isTextInside, rtl, arrowIndent]);
+  }, [shouldBeOutside, x1, width, isTextInside, rtl, arrowIndent]);
   return /* @__PURE__ */ jsx(
     "text",
     {
       x: calculatedX,
       y: taskYOffset + taskHeight * 0.5,
-      className: isTextInside && !alwaysOutline ? style.barLabel : style.barLabelOutside,
+      className: isTextInside && !shouldBeOutside ? style.barLabel : style.barLabelOutside,
       ref: textRef,
       children: label2
     }
@@ -13499,7 +13558,8 @@ const TaskItemInner = (props) => {
             label: task.name,
             taskYOffset,
             viewMode,
-            alwaysOutline: task.type === "project"
+            alwaysOutline: task.type === "project",
+            forceOutside: props.showProgress && width > 40
           }
         )
       ]
@@ -13824,6 +13884,10 @@ const TaskGanttContentInner = (props) => {
         const safeComparisonY = isNaN(comparisonDates.y) || !isFinite(comparisonDates.y) ? safeLevelY : comparisonDates.y;
         const safeComparisonWidth = isNaN(comparisonDates.width) || !isFinite(comparisonDates.width) ? 0 : Math.max(comparisonDates.width, 0);
         const safeComparisonHeight = isNaN(comparisonDates.height) || !isFinite(comparisonDates.height) ? 0 : Math.max(comparisonDates.height, 0);
+        const maxComparisonSvgHeight = Math.max(
+          distances.rowHeight - taskYOffset - taskHeight,
+          safeComparisonHeight
+        );
         tasksRes.push(
           /* @__PURE__ */ jsx(
             "svg",
@@ -13833,7 +13897,7 @@ const TaskGanttContentInner = (props) => {
               x: Math.max(safeComparisonX + (additionalLeftSpace || 0), 0),
               y: safeComparisonY,
               width: safeComparisonWidth,
-              height: safeComparisonHeight * 2,
+              height: Math.min(safeComparisonHeight * 2, maxComparisonSvgHeight),
               children: /* @__PURE__ */ jsx(
                 BarComparison,
                 {
@@ -14639,11 +14703,16 @@ const countTaskCoordinates = (task, taskToRowIndexMap, startDate, viewMode, rtl,
     );
     cx1 = isNaN(cx1) || !isFinite(cx1) ? x1 : cx1;
     cx2 = isNaN(cx2) || !isFinite(cx2) ? x2 : cx2;
+    const remainingRowSpace = distances.rowHeight - taskYOffset - taskHeight;
+    const clampedHeight = Math.min(
+      barComparisonTaskHeight,
+      Math.max(remainingRowSpace - 2, 2)
+    );
     comparisonDates = {
       x: cx1,
       y: y + taskHeight,
       width: Math.max(cx2 - cx1, 0),
-      height: barComparisonTaskHeight
+      height: clampedHeight
     };
   }
   return {
@@ -19975,19 +20044,11 @@ const Gantt = (props) => {
     rowHeight,
     showTodayLine = true,
     showDataDateLine = false,
-    showProjectStartLine = false,
-    showProjectEndLine = false,
     dataDate = null,
-    projectStartDate = null,
-    projectEndDate = null,
     todayColor,
     dataDateColor,
-    projectStartColor,
-    projectEndColor,
     todayLabel = "Today",
     dataDateLabel = "Data Date",
-    projectStartLabel = "Project Start",
-    projectEndLabel = "Project End",
     showProgress = true,
     hideProjectProgress = false,
     progressColor,
@@ -21416,19 +21477,11 @@ const Gantt = (props) => {
       viewMode,
       showTodayLine,
       showDataDateLine,
-      showProjectStartLine,
-      showProjectEndLine,
       dataDate,
-      projectStartDate,
-      projectEndDate,
       todayColor,
       dataDateColor,
-      projectStartColor,
-      projectEndColor,
       todayLabel,
-      dataDateLabel,
-      projectStartLabel,
-      projectEndLabel
+      dataDateLabel
     }),
     [
       additionalLeftSpace,
@@ -21440,19 +21493,11 @@ const Gantt = (props) => {
       viewMode,
       showTodayLine,
       showDataDateLine,
-      showProjectStartLine,
-      showProjectEndLine,
       dataDate,
-      projectStartDate,
-      projectEndDate,
       todayColor,
       dataDateColor,
-      projectStartColor,
-      projectEndColor,
       todayLabel,
-      dataDateLabel,
-      projectStartLabel,
-      projectEndLabel
+      dataDateLabel
     ]
   );
   const calendarProps = useMemo(