gantt-lib 0.0.7 → 0.0.9

package/dist/index.mjs

@@ -717,6 +717,7 @@ function handleGlobalMouseMove(e) {
       const dayWidth2 = globalActiveDrag.dayWidth;
       const monthStart = globalActiveDrag.monthStart;
       for (const chainTask of activeChain) {
+        if (chainTask.locked) continue;
         const chainStart = new Date(chainTask.startDate);
         const chainEnd = new Date(chainTask.endDate);
         const chainStartOffset = Math.round(
@@ -796,6 +797,7 @@ var useTaskDrag = (options) => {
     onCascade
   } = options;
   const isOwnerRef = useRef(false);
+  const locked = options.locked ?? false;
   const [isDragging, setIsDragging] = useState(false);
   const [dragMode, setDragMode] = useState(null);
   const [currentLeft, setCurrentLeft] = useState(0);
@@ -901,7 +903,7 @@ var useTaskDrag = (options) => {
                 dependencies: recalculateIncomingLags(draggedTaskData, newStartDate, newEndDate, allTasks)
               }
             },
-            ...chainForCompletion.map((chainTask) => {
+            ...chainForCompletion.filter((chainTask) => !chainTask.locked).map((chainTask) => {
               const origStart = new Date(chainTask.startDate);
               const origEnd = new Date(chainTask.endDate);
               const newStart = new Date(Date.UTC(
@@ -951,6 +953,7 @@ var useTaskDrag = (options) => {
     };
   }, []);
   const handleMouseDown = useCallback((e) => {
+    if (locked) return;
     const target = e.currentTarget;
     const edgeZone = detectEdgeZone(e.clientX, target, edgeZoneWidth);
     let mode = null;
@@ -1005,13 +1008,14 @@ var useTaskDrag = (options) => {
       cascadeChainEnd: !disableConstraints ? getTransitiveCascadeChain(taskId, allTasks, ["FS", "FF"]) : [],
       onCascadeProgress
     };
-  }, [edgeZoneWidth, currentLeft, currentWidth, dayWidth, monthStart, taskId, onDragStateChange, handleProgress, handleComplete, handleCancel, allTasks, disableConstraints, onCascadeProgress, onCascade]);
+  }, [edgeZoneWidth, currentLeft, currentWidth, dayWidth, monthStart, taskId, onDragStateChange, handleProgress, handleComplete, handleCancel, allTasks, disableConstraints, onCascadeProgress, onCascade, locked]);
   const getCursorStyle = useCallback(() => {
+    if (locked) return "not-allowed";
     if (isDragging) {
       return "grabbing";
     }
     return "grab";
-  }, [isDragging]);
+  }, [locked, isDragging]);
   return {
     isDragging,
     dragMode,
@@ -1030,10 +1034,11 @@ var useTaskDrag = (options) => {
 // src/components/TaskRow/TaskRow.tsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var arePropsEqual = (prevProps, nextProps) => {
-  return prevProps.task.id === nextProps.task.id && prevProps.task.name === nextProps.task.name && prevProps.task.startDate === nextProps.task.startDate && prevProps.task.endDate === nextProps.task.endDate && prevProps.task.color === nextProps.task.color && prevProps.task.progress === nextProps.task.progress && prevProps.task.accepted === nextProps.task.accepted && prevProps.monthStart.getTime() === nextProps.monthStart.getTime() && prevProps.dayWidth === nextProps.dayWidth && prevProps.rowHeight === nextProps.rowHeight && prevProps.overridePosition?.left === nextProps.overridePosition?.left && prevProps.overridePosition?.width === nextProps.overridePosition?.width && prevProps.allTasks === nextProps.allTasks && prevProps.disableConstraints === nextProps.disableConstraints;
+  return prevProps.task.id === nextProps.task.id && prevProps.task.name === nextProps.task.name && prevProps.task.startDate === nextProps.task.startDate && prevProps.task.endDate === nextProps.task.endDate && prevProps.task.color === nextProps.task.color && prevProps.task.progress === nextProps.task.progress && prevProps.task.accepted === nextProps.task.accepted && prevProps.monthStart.getTime() === nextProps.monthStart.getTime() && prevProps.dayWidth === nextProps.dayWidth && prevProps.rowHeight === nextProps.rowHeight && prevProps.overridePosition?.left === nextProps.overridePosition?.left && prevProps.overridePosition?.width === nextProps.overridePosition?.width && prevProps.allTasks === nextProps.allTasks && prevProps.disableConstraints === nextProps.disableConstraints && prevProps.task.locked === nextProps.task.locked && prevProps.task.divider === nextProps.task.divider;
 };
 var TaskRow = React2.memo(
-  ({ task, monthStart, dayWidth, rowHeight, onChange, onDragStateChange, rowIndex, allTasks, enableAutoSchedule, disableConstraints, overridePosition, onCascadeProgress, onCascade }) => {
+  ({ task, monthStart, dayWidth, rowHeight, onChange, onDragStateChange, rowIndex, allTasks, enableAutoSchedule, disableConstraints, overridePosition, onCascadeProgress, onCascade, divider }) => {
+    const { divider: taskDivider } = task;
     const taskStartDate = useMemo2(() => parseUTCDate(task.startDate), [task.startDate]);
     const taskEndDate = useMemo2(() => parseUTCDate(task.endDate), [task.endDate]);
     const { left, width } = useMemo2(
@@ -1049,7 +1054,8 @@ var TaskRow = React2.memo(
       if (progressWidth === 100) {
         return task.accepted ? "var(--gantt-progress-accepted, #22c55e)" : "var(--gantt-progress-completed, #fbbf24)";
       }
-      return task.color ? `color-mix(in srgb, ${task.color} 40%, black)` : "var(--gantt-progress-color, rgba(0, 0, 0, 0.2))";
+      const baseColor = task.color || "var(--gantt-task-bar-default-color)";
+      return `color-mix(in srgb, ${baseColor} 40%, black)`;
     }, [progressWidth, task.accepted, task.color]);
     const handleDragEnd = (result) => {
       const updatedTask = {
@@ -1079,6 +1085,7 @@ var TaskRow = React2.memo(
       rowIndex,
       enableAutoSchedule,
       disableConstraints,
+      locked: task.locked,
       onCascadeProgress,
       onCascade
     });
@@ -1093,81 +1100,106 @@ var TaskRow = React2.memo(
     ) + 1;
     const estimatedTextWidth = durationDays >= 10 ? 76 : 62;
     const showProgressInside = progressWidth > 0 && displayWidth > estimatedTextWidth;
-    return /* @__PURE__ */ jsx2(
+    return /* @__PURE__ */ jsxs2(
       "div",
       {
         className: "gantt-tr-row",
         style: { height: `${rowHeight}px` },
-        children: /* @__PURE__ */ jsxs2("div", { className: "gantt-tr-taskContainer", children: [
-          /* @__PURE__ */ jsxs2(
-            "div",
-            {
-              "data-taskbar": true,
-              className: `gantt-tr-taskBar ${isDragging ? "gantt-tr-dragging" : ""}`,
-              style: {
-                left: `${displayLeft}px`,
-                width: `${displayWidth}px`,
-                backgroundColor: barColor,
-                height: "var(--gantt-task-bar-height)",
-                cursor: dragHandleProps.style.cursor,
-                userSelect: dragHandleProps.style.userSelect
-              },
-              onMouseDown: dragHandleProps.onMouseDown,
-              children: [
-                progressWidth > 0 && /* @__PURE__ */ jsx2(
-                  "div",
-                  {
-                    className: "gantt-tr-progressBar",
-                    style: {
-                      width: `${progressWidth}%`,
-                      backgroundColor: progressColor
+        children: [
+          taskDivider === "top" && /* @__PURE__ */ jsx2("div", { className: "gantt-tr-divider gantt-tr-divider-top" }),
+          /* @__PURE__ */ jsxs2("div", { className: "gantt-tr-taskContainer", children: [
+            /* @__PURE__ */ jsxs2(
+              "div",
+              {
+                "data-taskbar": true,
+                className: `gantt-tr-taskBar ${isDragging ? "gantt-tr-dragging" : ""} ${task.locked ? "gantt-tr-locked" : ""}`,
+                style: {
+                  left: `${displayLeft}px`,
+                  width: `${displayWidth}px`,
+                  backgroundColor: barColor,
+                  height: "var(--gantt-task-bar-height)",
+                  cursor: dragHandleProps.style.cursor,
+                  userSelect: dragHandleProps.style.userSelect
+                },
+                onMouseDown: dragHandleProps.onMouseDown,
+                children: [
+                  progressWidth > 0 && /* @__PURE__ */ jsx2(
+                    "div",
+                    {
+                      className: "gantt-tr-progressBar",
+                      style: {
+                        width: `${progressWidth}%`,
+                        backgroundColor: progressColor
+                      }
                     }
-                  }
-                ),
-                /* @__PURE__ */ jsx2("div", { className: "gantt-tr-resizeHandle gantt-tr-resizeHandleLeft" }),
-                /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-taskDuration", children: [
-                  durationDays,
-                  " \u0434"
-                ] }),
-                progressWidth > 0 && showProgressInside && /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-progressText", children: [
-                  progressWidth,
-                  "%"
-                ] }),
-                /* @__PURE__ */ jsx2("div", { className: "gantt-tr-resizeHandle gantt-tr-resizeHandleRight" })
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx2(
-            "div",
-            {
-              className: "gantt-tr-leftLabels",
-              style: {
-                left: `${displayLeft}px`
-              },
-              children: /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-dateLabel gantt-tr-dateLabelLeft", children: [
-                startDateLabel,
-                "\u2013",
-                endDateLabel
-              ] })
-            }
-          ),
-          /* @__PURE__ */ jsxs2(
-            "div",
-            {
-              className: "gantt-tr-rightLabels",
-              style: {
-                left: `${displayLeft + displayWidth}px`
-              },
-              children: [
-                progressWidth > 0 && !showProgressInside && /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-externalProgress", children: [
-                  progressWidth,
-                  "%"
-                ] }),
-                /* @__PURE__ */ jsx2("span", { className: "gantt-tr-externalTaskName", children: task.name })
-              ]
-            }
-          )
-        ] })
+                  ),
+                  /* @__PURE__ */ jsx2("div", { className: "gantt-tr-resizeHandle gantt-tr-resizeHandleLeft" }),
+                  /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-taskDuration", children: [
+                    durationDays,
+                    " \u0434"
+                  ] }),
+                  progressWidth > 0 && showProgressInside && /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-progressText", children: [
+                    progressWidth,
+                    "%"
+                  ] }),
+                  /* @__PURE__ */ jsx2("div", { className: "gantt-tr-resizeHandle gantt-tr-resizeHandleRight" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              "div",
+              {
+                className: `gantt-tr-leftLabels ${task.locked ? "gantt-tr-leftLabels-locked" : ""}`,
+                style: {
+                  left: `${displayLeft}px`
+                },
+                children: /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-dateLabel gantt-tr-dateLabelLeft", children: [
+                  startDateLabel,
+                  "\u2013",
+                  endDateLabel
+                ] })
+              }
+            ),
+            task.locked && /* @__PURE__ */ jsx2(
+              "svg",
+              {
+                className: "gantt-tr-lockIcon",
+                style: {
+                  position: "absolute",
+                  left: `${displayLeft - 16}px`,
+                  top: "50%",
+                  transform: "translateY(-50%)",
+                  width: "12px",
+                  height: "12px",
+                  color: "#444",
+                  pointerEvents: "none"
+                },
+                viewBox: "0 0 24 24",
+                fill: "currentColor",
+                "aria-label": "Locked",
+                "aria-hidden": "false",
+                children: /* @__PURE__ */ jsx2("path", { d: "M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z" })
+              }
+            ),
+            /* @__PURE__ */ jsxs2(
+              "div",
+              {
+                className: "gantt-tr-rightLabels",
+                style: {
+                  left: `${displayLeft + displayWidth}px`
+                },
+                children: [
+                  progressWidth > 0 && !showProgressInside && /* @__PURE__ */ jsxs2("span", { className: "gantt-tr-externalProgress", children: [
+                    progressWidth,
+                    "%"
+                  ] }),
+                  /* @__PURE__ */ jsx2("span", { className: "gantt-tr-externalTaskName", children: task.name })
+                ]
+              }
+            )
+          ] }),
+          taskDivider === "bottom" && /* @__PURE__ */ jsx2("div", { className: "gantt-tr-divider gantt-tr-divider-bottom" })
+        ]
       }
     );
   },