gantt-lib 0.26.0 → 0.28.0

package/dist/index.mjs

@@ -3873,7 +3873,8 @@ var TaskListRow = React9.memo(
     customDays,
     isWeekend: isWeekend3,
     businessDays,
-    isFilterMatch = false
+    isFilterMatch = false,
+    isFilterHideMode = false
   }) => {
     const [editingName, setEditingName] = useState4(false);
     const [nameValue, setNameValue] = useState4("");
@@ -4637,39 +4638,41 @@ var TaskListRow = React9.memo(
           ),
           /* @__PURE__ */ jsxs9("div", { className: "gantt-tl-cell gantt-tl-cell-name", children: [
             isChild && !editingName && /* @__PURE__ */ jsxs9(Fragment2, { children: [
-              ancestorContinues.map(
-                (continues, idx) => continues ? /* @__PURE__ */ jsx12(
+              !isFilterHideMode && /* @__PURE__ */ jsxs9(Fragment2, { children: [
+                ancestorContinues.map(
+                  (continues, idx) => continues ? /* @__PURE__ */ jsx12(
+                    "span",
+                    {
+                      style: {
+                        position: "absolute",
+                        left: `${idx * 20 + 9}px`,
+                        top: 0,
+                        height: `${rowHeight}px`,
+                        width: "1.5px",
+                        background: "var(--gantt-hierarchy-line-color)",
+                        borderRadius: "1px",
+                        pointerEvents: "none"
+                      }
+                    },
+                    idx
+                  ) : null
+                ),
+                /* @__PURE__ */ jsx12(
                   "span",
                   {
                     style: {
                       position: "absolute",
-                      left: `${idx * 20 + 9}px`,
+                      left: `${(nestingDepth - 1) * 20 + 9}px`,
                       top: 0,
-                      height: `${rowHeight}px`,
+                      height: isLastChild ? `${rowHeight / 2}px` : `${rowHeight}px`,
                       width: "1.5px",
                       background: "var(--gantt-hierarchy-line-color)",
                       borderRadius: "1px",
                       pointerEvents: "none"
                     }
-                  },
-                  idx
-                ) : null
-              ),
-              /* @__PURE__ */ jsx12(
-                "span",
-                {
-                  style: {
-                    position: "absolute",
-                    left: `${(nestingDepth - 1) * 20 + 9}px`,
-                    top: 0,
-                    height: isLastChild ? `${rowHeight / 2}px` : `${rowHeight}px`,
-                    width: "1.5px",
-                    background: "var(--gantt-hierarchy-line-color)",
-                    borderRadius: "1px",
-                    pointerEvents: "none"
                   }
-                }
-              ),
+                )
+              ] }),
               /* @__PURE__ */ jsx12(
                 "span",
                 {
@@ -4702,7 +4705,7 @@ var TaskListRow = React9.memo(
               )
             ] }),
             isParent && !editingName && /* @__PURE__ */ jsxs9(Fragment2, { children: [
-              !isCollapsed && /* @__PURE__ */ jsx12(
+              !isFilterHideMode && !isCollapsed && /* @__PURE__ */ jsx12(
                 "span",
                 {
                   style: {
@@ -5310,7 +5313,10 @@ var TaskList = ({
   customDays,
   isWeekend: isWeekend3,
   businessDays,
-  highlightedTaskIds = /* @__PURE__ */ new Set()
+  highlightedTaskIds = /* @__PURE__ */ new Set(),
+  filterMode = "highlight",
+  filteredTaskIds = /* @__PURE__ */ new Set(),
+  isFilterActive = false
 }) => {
   const [internalCollapsedParentIds, setInternalCollapsedParentIds] = useState6(/* @__PURE__ */ new Set());
   const collapsedParentIds = externalCollapsedParentIds ?? internalCollapsedParentIds;
@@ -5342,8 +5348,12 @@ var TaskList = ({
       }
       return false;
     }
-    return orderedTasks.filter((task) => !isAnyAncestorCollapsed(task.parentId));
-  }, [orderedTasks, collapsedParentIds]);
+    let tasks2 = orderedTasks.filter((task) => !isAnyAncestorCollapsed(task.parentId));
+    if (filterMode === "hide" && isFilterActive) {
+      tasks2 = tasks2.filter((task) => filteredTaskIds.has(task.id));
+    }
+    return tasks2;
+  }, [orderedTasks, collapsedParentIds, filterMode, filteredTaskIds, isFilterActive]);
   const totalHeight = useMemo8(
     () => visibleTasks.length * rowHeight,
     [visibleTasks.length, rowHeight]
@@ -5354,6 +5364,16 @@ var TaskList = ({
     ),
     [visibleTasks]
   );
+  const originalTaskNumberMap = useMemo8(
+    () => {
+      const numberMap = /* @__PURE__ */ new Map();
+      for (let i = 0; i < orderedTasks.length; i++) {
+        numberMap.set(orderedTasks[i].id, getTaskNumber(orderedTasks, i));
+      }
+      return Object.fromEntries(numberMap);
+    },
+    [orderedTasks]
+  );
   const nestingDepthMap = useMemo8(() => {
     const depthMap = /* @__PURE__ */ new Map();
     const taskById = new Map(tasks.map((t) => [t.id, t]));
@@ -5775,8 +5795,8 @@ var TaskList = ({
           {
             task,
             rowIndex: index,
-            taskNumber: getTaskNumber(visibleTasks, index),
-            taskNumberMap: visibleTaskNumberMap,
+            taskNumber: originalTaskNumberMap[task.id] || "",
+            taskNumberMap: originalTaskNumberMap,
             rowHeight,
             onTasksChange,
             selectedTaskId,
@@ -5815,7 +5835,8 @@ var TaskList = ({
             customDays,
             isWeekend: isWeekend3,
             businessDays,
-            isFilterMatch: highlightedTaskIds.has(task.id)
+            isFilterMatch: filterMode === "highlight" ? highlightedTaskIds.has(task.id) : false,
+            isFilterHideMode: filterMode === "hide" && isFilterActive
           },
           task.id
         )) }),
@@ -5889,10 +5910,12 @@ var GanttChart = forwardRef(({
   isWeekend: isWeekend3,
   businessDays = true,
   taskFilter,
+  filterMode = "highlight",
   collapsedParentIds: externalCollapsedParentIds,
   onToggleCollapse: externalOnToggleCollapse,
   highlightedTaskIds,
-  disableTaskDrag = false
+  disableTaskDrag = false,
+  showChart = true
 }, ref) => {
   const scrollContainerRef = useRef7(null);
   const [selectedTaskId, setSelectedTaskId] = useState7(null);
@@ -5923,20 +5946,27 @@ var GanttChart = forwardRef(({
       }
       return false;
     }
-    return normalizedTasks.filter((task) => !isAnyAncestorCollapsed(task.parentId));
-  }, [normalizedTasks, collapsedParentIds]);
+    let tasks2 = normalizedTasks.filter((task) => !isAnyAncestorCollapsed(task.parentId));
+    if (filterMode === "hide" && taskFilter) {
+      tasks2 = tasks2.filter(taskFilter);
+    }
+    return tasks2;
+  }, [normalizedTasks, collapsedParentIds, filterMode, taskFilter]);
   const matchedTaskIds = useMemo9(() => {
     if (!taskFilter) return /* @__PURE__ */ new Set();
     return new Set(visibleTasks.filter(taskFilter).map((task) => task.id));
   }, [visibleTasks, taskFilter]);
   const taskListHighlightedTaskIds = useMemo9(() => {
+    if (filterMode === "hide") {
+      return /* @__PURE__ */ new Set();
+    }
     if ((!highlightedTaskIds || highlightedTaskIds.size === 0) && matchedTaskIds.size === 0) {
       return /* @__PURE__ */ new Set();
     }
     const mergedHighlightedTaskIds = new Set(highlightedTaskIds ?? []);
     matchedTaskIds.forEach((taskId) => mergedHighlightedTaskIds.add(taskId));
     return mergedHighlightedTaskIds;
-  }, [highlightedTaskIds, matchedTaskIds]);
+  }, [filterMode, highlightedTaskIds, matchedTaskIds]);
   const totalGridHeight = useMemo9(
     () => visibleTasks.length * rowHeight,
     [visibleTasks.length, rowHeight]
@@ -6352,10 +6382,13 @@ var GanttChart = forwardRef(({
             highlightedTaskIds: taskListHighlightedTaskIds,
             customDays,
             isWeekend: isWeekend3,
-            businessDays
+            businessDays,
+            filterMode,
+            filteredTaskIds: matchedTaskIds,
+            isFilterActive: !!taskFilter
           }
         ),
-        /* @__PURE__ */ jsxs12("div", { style: { minWidth: `${gridWidth}px`, flex: 1 }, children: [
+        /* @__PURE__ */ jsxs12("div", { className: showChart ? "" : "gantt-chart-hidden", style: { minWidth: `${gridWidth}px`, flex: 1 }, children: [
           /* @__PURE__ */ jsx15("div", { className: "gantt-stickyHeader", style: { width: `${gridWidth}px` }, children: /* @__PURE__ */ jsx15(
             TimeScaleHeader_default,
             {
@@ -6437,7 +6470,7 @@ var GanttChart = forwardRef(({
                     onCascadeProgress: handleCascadeProgress,
                     onCascade: handleCascade,
                     highlightExpiredTasks,
-                    isFilterMatch: matchedTaskIds.has(task.id),
+                    isFilterMatch: filterMode === "highlight" ? matchedTaskIds.has(task.id) : false,
                     businessDays,
                     customDays,
                     isWeekend: isWeekend3,