gantt-lib 0.111.0 → 0.113.0

package/dist/index.js

@@ -41,6 +41,7 @@ __export(index_exports, {
   GanttChart: () => GanttChart,
   GridBackground: () => GridBackground_default,
   Input: () => Input,
+  PlanFactMatrix: () => PlanFactMatrix,
   Popover: () => Popover,
   PopoverContent: () => PopoverContent,
   PopoverTrigger: () => PopoverTrigger,
@@ -144,7 +145,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/GanttChart/GanttChart.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 
 // src/core/scheduling/dateMath.ts
 var DAY_MS = 24 * 60 * 60 * 1e3;
@@ -698,10 +699,10 @@ function buildTaskRangeFromStart(startDate, duration, businessDays = false, week
       end: parseDateOnly(addBusinessDays(normalizedStart, duration, weekendPredicate))
     };
   }
-  const DAY_MS5 = 24 * 60 * 60 * 1e3;
+  const DAY_MS6 = 24 * 60 * 60 * 1e3;
   return {
     start: normalizedStart,
-    end: new Date(normalizedStart.getTime() + (Math.max(1, duration) - 1) * DAY_MS5)
+    end: new Date(normalizedStart.getTime() + (Math.max(1, duration) - 1) * DAY_MS6)
   };
 }
 function buildTaskRangeFromEnd(endDate, duration, businessDays = false, weekendPredicate, snapDirection = -1) {
@@ -712,9 +713,9 @@ function buildTaskRangeFromEnd(endDate, duration, businessDays = false, weekendP
       end: normalizedEnd
     };
   }
-  const DAY_MS5 = 24 * 60 * 60 * 1e3;
+  const DAY_MS6 = 24 * 60 * 60 * 1e3;
   return {
-    start: new Date(normalizedEnd.getTime() - (Math.max(1, duration) - 1) * DAY_MS5),
+    start: new Date(normalizedEnd.getTime() - (Math.max(1, duration) - 1) * DAY_MS6),
     end: normalizedEnd
   };
 }
@@ -1129,13 +1130,13 @@ function computeParentProgress(parentId, tasks) {
   if (children.length === 0) {
     return 0;
   }
-  const DAY_MS5 = 24 * 60 * 60 * 1e3;
+  const DAY_MS6 = 24 * 60 * 60 * 1e3;
   let totalWeight = 0;
   let weightedSum = 0;
   for (const child of children) {
     const start = new Date(child.startDate).getTime();
     const end = new Date(child.endDate).getTime();
-    const duration = (end - start + DAY_MS5) / DAY_MS5;
+    const duration = (end - start + DAY_MS6) / DAY_MS6;
     const progress = child.progress ?? 0;
     totalWeight += duration;
     weightedSum += duration * progress;
@@ -10564,6 +10565,1001 @@ function TableMatrix({
   ] });
 }
 
+// src/components/PlanFactMatrix/PlanFactMatrix.tsx
+var import_react17 = __toESM(require("react"));
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var DAY_MS5 = 24 * 60 * 60 * 1e3;
+function joinClasses2(...values) {
+  return values.filter(Boolean).join(" ");
+}
+function formatDateKey(date) {
+  const year = date.getUTCFullYear();
+  const month = String(date.getUTCMonth() + 1).padStart(2, "0");
+  const day = String(date.getUTCDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
+}
+function escapeAttributeValue(value) {
+  return value.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+}
+function parseNumberInput(value) {
+  const trimmed = value.trim();
+  if (trimmed === "") return void 0;
+  const normalized = trimmed.replace(/\s+/g, "").replace(",", ".");
+  const parsed = Number(normalized);
+  if (!Number.isFinite(parsed) || parsed < 0) {
+    return null;
+  }
+  return parsed;
+}
+function getDateOnlyMs(date) {
+  return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());
+}
+function getPlannedIndexRange(task, rangeStartMs, rangeLength) {
+  if (rangeLength <= 0) return null;
+  const start = parseUTCDate(task.startDate);
+  const end = parseUTCDate(task.endDate);
+  const startIndex = Math.ceil((getDateOnlyMs(start) - rangeStartMs) / DAY_MS5);
+  const endIndex = Math.floor((getDateOnlyMs(end) - rangeStartMs) / DAY_MS5);
+  const clampedStartIndex = Math.max(0, startIndex);
+  const clampedEndIndex = Math.min(rangeLength - 1, endIndex);
+  if (clampedStartIndex > clampedEndIndex) return null;
+  return {
+    startIndex: clampedStartIndex,
+    endIndex: clampedEndIndex
+  };
+}
+function isDateIndexWithinPlannedRange(dateIndex, range) {
+  return !!range && range.startIndex <= dateIndex && dateIndex <= range.endIndex;
+}
+function formatValue(value) {
+  if (value === void 0) return "";
+  const absoluteValue = Math.abs(value);
+  if (absoluteValue >= 1e6) {
+    const compactValue = value / 1e6;
+    const fractionDigits = absoluteValue >= 1e7 ? 0 : 1;
+    return `${compactValue.toLocaleString("ru-RU", {
+      minimumFractionDigits: 0,
+      maximumFractionDigits: fractionDigits,
+      useGrouping: false
+    })}m`;
+  }
+  if (absoluteValue >= 1e4) {
+    const compactValue = value / 1e3;
+    const fractionDigits = absoluteValue >= 1e5 ? 0 : 1;
+    return `${compactValue.toLocaleString("ru-RU", {
+      minimumFractionDigits: 0,
+      maximumFractionDigits: fractionDigits,
+      useGrouping: false
+    })}k`;
+  }
+  return Number.isInteger(value) ? String(value) : String(value).replace(".", ",");
+}
+function formatTooltipValue(value) {
+  if (value === void 0) return "";
+  return value.toLocaleString("ru-RU", { maximumFractionDigits: 20 });
+}
+function getSubrowIndex(taskIndex, kind) {
+  return taskIndex * 2 + (kind === "plan" ? 0 : 1);
+}
+function findEditableTaskIndex(tasks, parentTaskIds, startIndex, step) {
+  let index = startIndex;
+  while (index >= 0 && index < tasks.length) {
+    if (!parentTaskIds.has(tasks[index].id)) {
+      return index;
+    }
+    index += step;
+  }
+  return null;
+}
+function PlanFactCellEditor({
+  value,
+  startValue,
+  onCommit,
+  onCommitRange,
+  onCancel
+}) {
+  const [draft, setDraft] = (0, import_react17.useState)(startValue ?? (value === void 0 ? "" : String(value)));
+  const inputRef = (0, import_react17.useRef)(null);
+  (0, import_react17.useEffect)(() => {
+    inputRef.current?.focus();
+    if (startValue === void 0) {
+      inputRef.current?.select();
+    } else {
+      inputRef.current?.setSelectionRange(startValue.length, startValue.length);
+    }
+  }, [startValue]);
+  const commit = (0, import_react17.useCallback)(() => {
+    const parsed = parseNumberInput(draft);
+    if (parsed === null) {
+      onCancel();
+      return;
+    }
+    onCommit(parsed);
+  }, [draft, onCancel, onCommit]);
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    "input",
+    {
+      ref: inputRef,
+      value: draft,
+      className: "gantt-pf-editor",
+      inputMode: "decimal",
+      onChange: (event) => setDraft(event.target.value),
+      onBlur: commit,
+      onKeyDown: (event) => {
+        if (event.key === "Escape") {
+          event.preventDefault();
+          onCancel();
+          return;
+        }
+        if (event.key === "Enter") {
+          event.preventDefault();
+          if (event.ctrlKey || event.metaKey) {
+            const parsed = parseNumberInput(draft);
+            if (parsed === null) {
+              onCancel();
+              return;
+            }
+            onCommitRange?.(parsed);
+          } else {
+            commit();
+          }
+        }
+      }
+    }
+  );
+}
+function getCellSignatureForTask(cell, taskId) {
+  return cell?.taskId === taskId ? `${cell.dateIndex}:${cell.kind}` : "";
+}
+function getEditingCellSignatureForTask(cell, taskId) {
+  return cell?.taskId === taskId ? `${cell.dateIndex}:${cell.kind}:${cell.startValue ?? ""}` : "";
+}
+function getRangeAnchorSignatureForTask(range, taskId) {
+  return range?.anchor.taskId === taskId ? `${range.anchor.dateIndex}:${range.anchor.kind}` : "";
+}
+function doesRangeTouchRow(bounds, rowIndex) {
+  if (!bounds) return false;
+  const firstSubrowIndex = rowIndex * 2;
+  const lastSubrowIndex = firstSubrowIndex + 1;
+  return bounds.fromSubrowIndex <= lastSubrowIndex && bounds.toSubrowIndex >= firstSubrowIndex;
+}
+function areRangeBoundsEqual(left, right) {
+  if (left === right) return true;
+  if (!left || !right) return false;
+  return left.fromDateIndex === right.fromDateIndex && left.toDateIndex === right.toDateIndex && left.fromSubrowIndex === right.fromSubrowIndex && left.toSubrowIndex === right.toSubrowIndex;
+}
+function PlanFactRowInner({
+  task,
+  rowIndex,
+  dateRange,
+  dateKeys,
+  renderedDateIndices,
+  rowHeight,
+  subrowHeight,
+  dayWidth,
+  plannedRange,
+  todayDateIndex,
+  isParent,
+  isHighlighted,
+  selectedTaskId,
+  activeCell,
+  editingCell,
+  selectedRange,
+  renderedRangeBounds,
+  didDragSelectRef,
+  isSelectingRef,
+  isFillDraggingRef,
+  onTaskSelect,
+  selectSingleCell,
+  queueHoverCellUpdate,
+  setActiveCell,
+  setEditingCell,
+  setFillRange,
+  clearSelectedCells,
+  commitCell,
+  commitSelectedCells,
+  moveActiveCell,
+  extendSelectedRange,
+  focusCell,
+  showOverflowTooltip,
+  hideOverflowTooltip
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    "div",
+    {
+      "data-gantt-task-row-id": task.id,
+      className: joinClasses2(
+        "gantt-pf-row",
+        isParent && "gantt-pf-row-parent",
+        selectedTaskId === task.id && "gantt-pf-row-selected",
+        isHighlighted && "gantt-pf-row-highlighted"
+      ),
+      style: {
+        top: `${rowIndex * rowHeight}px`,
+        height: `${rowHeight}px`,
+        gridTemplateColumns: `repeat(${dateRange.length}, ${dayWidth}px)`,
+        ["--gantt-pf-today-left"]: todayDateIndex !== void 0 && todayDateIndex >= 0 ? `${todayDateIndex * dayWidth}px` : void 0
+      },
+      onClick: () => onTaskSelect?.(task.id),
+      children: renderedDateIndices.map((dateIndex) => {
+        const dateKey = dateKeys[dateIndex];
+        if (dateKey === void 0) return null;
+        const planned = isDateIndexWithinPlannedRange(dateIndex, plannedRange);
+        return ["plan", "fact"].map((kind) => {
+          const subrowIndex = getSubrowIndex(rowIndex, kind);
+          const isInRenderedRange = !!renderedRangeBounds && dateIndex >= renderedRangeBounds.fromDateIndex && dateIndex <= renderedRangeBounds.toDateIndex && subrowIndex >= renderedRangeBounds.fromSubrowIndex && subrowIndex <= renderedRangeBounds.toSubrowIndex;
+          const planValue = task.planByDate?.[dateKey];
+          const factValue = task.factByDate?.[dateKey];
+          const value = kind === "plan" ? planValue : factValue;
+          const factStatus = factValue === void 0 || planValue === void 0 ? null : factValue >= planValue ? "success" : "warning";
+          const isActive = activeCell?.taskId === task.id && activeCell.dateIndex === dateIndex && activeCell.kind === kind;
+          const isEditing = editingCell?.taskId === task.id && editingCell.dateIndex === dateIndex && editingCell.kind === kind;
+          const currentCell = { taskId: task.id, dateIndex, kind };
+          const isSelected = !isParent && isInRenderedRange;
+          const showFillHandle = !isParent && !isEditing && isInRenderedRange && renderedRangeBounds !== null && dateIndex === renderedRangeBounds.toDateIndex && subrowIndex === renderedRangeBounds.toSubrowIndex;
+          const isRangeAnchor = !showFillHandle && !isParent && selectedRange?.anchor.taskId === task.id && selectedRange.anchor.dateIndex === dateIndex && selectedRange.anchor.kind === kind;
+          return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+            "div",
+            {
+              "data-plan-fact-task-id": task.id,
+              "data-plan-fact-date-index": dateIndex,
+              "data-plan-fact-kind": kind,
+              className: joinClasses2(
+                "gantt-pf-cell",
+                `gantt-pf-cell-${kind}`,
+                planned && kind === "plan" && "gantt-pf-cell-planned",
+                value !== void 0 && "gantt-pf-cell-hasValue",
+                kind === "fact" && factStatus === "success" && "gantt-pf-cell-factSuccess",
+                kind === "fact" && factStatus === "warning" && "gantt-pf-cell-factWarning",
+                isSelected && "gantt-pf-cell-selected",
+                isInRenderedRange && renderedRangeBounds !== null && dateIndex === renderedRangeBounds.fromDateIndex && "gantt-pf-cell-rangeLeft",
+                isInRenderedRange && renderedRangeBounds !== null && dateIndex === renderedRangeBounds.toDateIndex && "gantt-pf-cell-rangeRight",
+                isInRenderedRange && renderedRangeBounds !== null && subrowIndex === renderedRangeBounds.fromSubrowIndex && "gantt-pf-cell-rangeTop",
+                isInRenderedRange && renderedRangeBounds !== null && subrowIndex === renderedRangeBounds.toSubrowIndex && "gantt-pf-cell-rangeBottom",
+                isRangeAnchor && "gantt-pf-cell-rangeAnchor",
+                isActive && "gantt-pf-cell-active",
+                isEditing && "gantt-pf-cell-editing",
+                isParent && "gantt-pf-cell-readonly"
+              ),
+              style: {
+                gridColumn: dateIndex + 1,
+                gridRow: kind === "plan" ? 1 : 2,
+                height: `${subrowHeight}px`
+              },
+              tabIndex: isParent ? -1 : 0,
+              onMouseDown: (event) => {
+                if (isParent) return;
+                event.preventDefault();
+                event.stopPropagation();
+                didDragSelectRef.current = false;
+                isSelectingRef.current = true;
+                selectSingleCell(currentCell);
+                onTaskSelect?.(task.id);
+                event.currentTarget.focus();
+              },
+              onMouseEnter: () => {
+                if (isParent) return;
+                if (!isFillDraggingRef.current && !isSelectingRef.current) return;
+                queueHoverCellUpdate(currentCell);
+              },
+              onFocus: () => {
+                if (isParent) return;
+                setActiveCell({ taskId: task.id, dateIndex, kind });
+              },
+              onClick: (event) => {
+                event.stopPropagation();
+                if (didDragSelectRef.current) {
+                  didDragSelectRef.current = false;
+                  return;
+                }
+                onTaskSelect?.(task.id);
+                if (isParent) return;
+                selectSingleCell(currentCell);
+                event.currentTarget.focus();
+              },
+              onDoubleClick: (event) => {
+                event.stopPropagation();
+                if (isParent) return;
+                setEditingCell({ taskId: task.id, dateIndex, kind });
+              },
+              onKeyDown: (event) => {
+                if (isParent || isEditing) return;
+                if (event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "ArrowUp" || event.key === "ArrowDown") {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  const direction = event.key.replace("Arrow", "").toLowerCase();
+                  if (event.shiftKey) {
+                    extendSelectedRange(selectedRange?.focus ?? currentCell, direction);
+                  } else {
+                    moveActiveCell(currentCell, direction);
+                  }
+                  return;
+                }
+                if (event.key === "Enter" || event.key === "F2") {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  setEditingCell(selectedRange?.anchor ?? currentCell);
+                  return;
+                }
+                if (event.key === "Backspace" || event.key === "Delete") {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  clearSelectedCells();
+                  return;
+                }
+                if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
+                  event.preventDefault();
+                  event.stopPropagation();
+                  setEditingCell({ ...currentCell, startValue: event.key });
+                }
+              },
+              children: [
+                isEditing ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  PlanFactCellEditor,
+                  {
+                    value,
+                    startValue: editingCell.startValue,
+                    onCommit: (nextValue) => {
+                      commitCell(task, dateIndex, kind, nextValue);
+                      setEditingCell(null);
+                      const nextActiveCell = { taskId: task.id, dateIndex, kind };
+                      selectSingleCell(nextActiveCell);
+                      focusCell(nextActiveCell);
+                    },
+                    onCommitRange: (nextValue) => {
+                      commitSelectedCells(nextValue);
+                      setEditingCell(null);
+                      const nextActiveCell = { taskId: task.id, dateIndex, kind };
+                      selectSingleCell(nextActiveCell);
+                      focusCell(nextActiveCell);
+                    },
+                    onCancel: () => {
+                      setEditingCell(null);
+                      const nextActiveCell = { taskId: task.id, dateIndex, kind };
+                      selectSingleCell(nextActiveCell);
+                      focusCell(nextActiveCell);
+                    }
+                  }
+                ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  "span",
+                  {
+                    className: "gantt-pf-cellValue",
+                    onMouseEnter: (event) => {
+                      if (isParent || value === void 0) return;
+                      const compactValue = formatValue(value);
+                      const fullValue = formatTooltipValue(value);
+                      showOverflowTooltip(event.currentTarget, fullValue, compactValue !== fullValue);
+                    },
+                    onMouseLeave: hideOverflowTooltip,
+                    children: isParent ? "" : formatValue(value)
+                  }
+                ),
+                showFillHandle && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  "span",
+                  {
+                    className: "gantt-pf-fillHandle",
+                    "aria-hidden": "true",
+                    onMouseDown: (event) => {
+                      event.preventDefault();
+                      event.stopPropagation();
+                      isSelectingRef.current = false;
+                      isFillDraggingRef.current = true;
+                      setFillRange(selectedRange);
+                    }
+                  }
+                )
+              ]
+            },
+            `${task.id}:${dateKey}:${kind}`
+          );
+        });
+      })
+    }
+  );
+}
+function arePlanFactRowsEqual(previous, next) {
+  const previousRangeTouchesRow = doesRangeTouchRow(previous.renderedRangeBounds, previous.rowIndex);
+  const nextRangeTouchesRow = doesRangeTouchRow(next.renderedRangeBounds, next.rowIndex);
+  return previous.task === next.task && previous.rowIndex === next.rowIndex && previous.dateRange === next.dateRange && previous.dateKeys === next.dateKeys && previous.renderedDateIndices === next.renderedDateIndices && previous.rowHeight === next.rowHeight && previous.subrowHeight === next.subrowHeight && previous.dayWidth === next.dayWidth && previous.plannedRange === next.plannedRange && previous.todayDateIndex === next.todayDateIndex && previous.isParent === next.isParent && previous.isHighlighted === next.isHighlighted && previous.selectedTaskId === previous.task.id === (next.selectedTaskId === next.task.id) && getCellSignatureForTask(previous.activeCell, previous.task.id) === getCellSignatureForTask(next.activeCell, next.task.id) && getEditingCellSignatureForTask(previous.editingCell, previous.task.id) === getEditingCellSignatureForTask(next.editingCell, next.task.id) && getRangeAnchorSignatureForTask(previous.selectedRange, previous.task.id) === getRangeAnchorSignatureForTask(next.selectedRange, next.task.id) && previousRangeTouchesRow === nextRangeTouchesRow && (!nextRangeTouchesRow || areRangeBoundsEqual(previous.renderedRangeBounds, next.renderedRangeBounds));
+}
+var PlanFactRow = import_react17.default.memo(PlanFactRowInner, arePlanFactRowsEqual);
+function PlanFactMatrix({
+  tasks,
+  allTasks = tasks,
+  dateRange,
+  dayWidth,
+  rowHeight,
+  headerHeight,
+  bodyMinHeight,
+  selectedTaskId,
+  onTaskSelect,
+  onTasksChange,
+  onCellCommit,
+  highlightedTaskIds,
+  filterMode = "highlight",
+  visibleRowIndices,
+  visibleDateIndices,
+  todayDateIndex
+}) {
+  const [activeCell, setActiveCell] = (0, import_react17.useState)(null);
+  const [editingCell, setEditingCell] = (0, import_react17.useState)(null);
+  const [selectedRange, setSelectedRange] = (0, import_react17.useState)(null);
+  const [fillRange, setFillRange] = (0, import_react17.useState)(null);
+  const [overflowTooltip, setOverflowTooltip] = (0, import_react17.useState)(null);
+  const isSelectingRef = (0, import_react17.useRef)(false);
+  const isFillDraggingRef = (0, import_react17.useRef)(false);
+  const didDragSelectRef = (0, import_react17.useRef)(false);
+  const pendingHoverCellRef = (0, import_react17.useRef)(null);
+  const hoverFrameRef = (0, import_react17.useRef)(null);
+  const rootRef = (0, import_react17.useRef)(null);
+  const bodyRef = (0, import_react17.useRef)(null);
+  const totalWidth = dateRange.length * dayWidth;
+  const subrowHeight = rowHeight / 2;
+  const renderedRowIndices = (0, import_react17.useMemo)(
+    () => visibleRowIndices ?? tasks.map((_, index) => index),
+    [tasks, visibleRowIndices]
+  );
+  const renderedDateIndices = (0, import_react17.useMemo)(
+    () => visibleDateIndices ?? dateRange.map((_, index) => index),
+    [dateRange, visibleDateIndices]
+  );
+  const parentTaskIds = (0, import_react17.useMemo)(() => {
+    const ids = /* @__PURE__ */ new Set();
+    for (const task of allTasks) {
+      if (task.parentId) ids.add(task.parentId);
+    }
+    return ids;
+  }, [allTasks]);
+  const dateKeys = (0, import_react17.useMemo)(() => dateRange.map(formatDateKey), [dateRange]);
+  const dateRangeStartMs = dateRange[0] ? getDateOnlyMs(dateRange[0]) : 0;
+  const taskIndexById = (0, import_react17.useMemo)(() => {
+    const indexById = /* @__PURE__ */ new Map();
+    tasks.forEach((task, index) => indexById.set(task.id, index));
+    return indexById;
+  }, [tasks]);
+  const taskById = (0, import_react17.useMemo)(
+    () => new Map(tasks.map((task) => [task.id, task])),
+    [tasks]
+  );
+  const monthSeparatorIndices = (0, import_react17.useMemo)(() => {
+    const indices = [];
+    for (let index = 1; index < dateRange.length; index += 1) {
+      if (dateRange[index].getUTCDate() === 1) {
+        indices.push(index);
+      }
+    }
+    return indices;
+  }, [dateRange]);
+  const plannedRangeByTaskId = (0, import_react17.useMemo)(() => {
+    const rangeByTaskId = /* @__PURE__ */ new Map();
+    for (const task of tasks) {
+      rangeByTaskId.set(task.id, getPlannedIndexRange(task, dateRangeStartMs, dateRange.length));
+    }
+    return rangeByTaskId;
+  }, [dateRange.length, dateRangeStartMs, tasks]);
+  const focusCell = (0, import_react17.useCallback)((cell) => {
+    window.requestAnimationFrame(() => {
+      const selector = [
+        `[data-plan-fact-task-id="${escapeAttributeValue(cell.taskId)}"]`,
+        `[data-plan-fact-date-index="${cell.dateIndex}"]`,
+        `[data-plan-fact-kind="${cell.kind}"]`
+      ].join("");
+      bodyRef.current?.querySelector(selector)?.focus();
+    });
+  }, []);
+  const clearSelection = (0, import_react17.useCallback)(() => {
+    if (hoverFrameRef.current !== null) {
+      window.cancelAnimationFrame(hoverFrameRef.current);
+      hoverFrameRef.current = null;
+    }
+    pendingHoverCellRef.current = null;
+    isSelectingRef.current = false;
+    isFillDraggingRef.current = false;
+    didDragSelectRef.current = false;
+    setActiveCell(null);
+    setEditingCell(null);
+    setSelectedRange(null);
+    setFillRange(null);
+    setOverflowTooltip(null);
+  }, []);
+  const hideOverflowTooltip = (0, import_react17.useCallback)(() => {
+    setOverflowTooltip(null);
+  }, []);
+  const flushPendingHoverCell = (0, import_react17.useCallback)(() => {
+    hoverFrameRef.current = null;
+    const currentCell = pendingHoverCellRef.current;
+    if (!currentCell) return;
+    if (isFillDraggingRef.current && selectedRange) {
+      setFillRange({ anchor: selectedRange.anchor, focus: currentCell });
+      setActiveCell(currentCell);
+      onTaskSelect?.(currentCell.taskId);
+      return;
+    }
+    if (!isSelectingRef.current) return;
+    didDragSelectRef.current = true;
+    setSelectedRange((currentRange) => ({
+      anchor: currentRange?.anchor ?? currentCell,
+      focus: currentCell
+    }));
+    onTaskSelect?.(currentCell.taskId);
+  }, [onTaskSelect, selectedRange]);
+  const queueHoverCellUpdate = (0, import_react17.useCallback)((cell) => {
+    pendingHoverCellRef.current = cell;
+    if (hoverFrameRef.current !== null) return;
+    hoverFrameRef.current = window.requestAnimationFrame(flushPendingHoverCell);
+  }, [flushPendingHoverCell]);
+  const showOverflowTooltip = (0, import_react17.useCallback)((target, label, force = false) => {
+    if (!rootRef.current || !label) return;
+    if (!force && target.scrollWidth <= target.clientWidth) {
+      setOverflowTooltip(null);
+      return;
+    }
+    const rootRect = rootRef.current.getBoundingClientRect();
+    const targetRect = target.getBoundingClientRect();
+    setOverflowTooltip({
+      label,
+      left: targetRect.left - rootRect.left + targetRect.width / 2,
+      top: targetRect.top - rootRect.top
+    });
+  }, []);
+  const selectSingleCell = (0, import_react17.useCallback)((cell) => {
+    setActiveCell(cell);
+    setSelectedRange({ anchor: cell, focus: cell });
+    setFillRange(null);
+  }, []);
+  const getRangeBounds = (0, import_react17.useCallback)((range) => {
+    const anchorTaskIndex = taskIndexById.get(range.anchor.taskId);
+    const focusTaskIndex = taskIndexById.get(range.focus.taskId);
+    if (anchorTaskIndex === void 0 || focusTaskIndex === void 0) {
+      return null;
+    }
+    return {
+      fromDateIndex: Math.min(range.anchor.dateIndex, range.focus.dateIndex),
+      toDateIndex: Math.max(range.anchor.dateIndex, range.focus.dateIndex),
+      fromSubrowIndex: Math.min(
+        getSubrowIndex(anchorTaskIndex, range.anchor.kind),
+        getSubrowIndex(focusTaskIndex, range.focus.kind)
+      ),
+      toSubrowIndex: Math.max(
+        getSubrowIndex(anchorTaskIndex, range.anchor.kind),
+        getSubrowIndex(focusTaskIndex, range.focus.kind)
+      )
+    };
+  }, [taskIndexById]);
+  const renderedRange = fillRange ?? selectedRange;
+  const renderedRangeBounds = (0, import_react17.useMemo)(
+    () => renderedRange ? getRangeBounds(renderedRange) : null,
+    [getRangeBounds, renderedRange]
+  );
+  const getCellFromPosition = (0, import_react17.useCallback)((subrowIndex, dateIndex) => {
+    const task = tasks[Math.floor(subrowIndex / 2)];
+    if (!task) return null;
+    return {
+      taskId: task.id,
+      dateIndex,
+      kind: subrowIndex % 2 === 0 ? "plan" : "fact"
+    };
+  }, [tasks]);
+  const isCellInRange = (0, import_react17.useCallback)((cell, range) => {
+    const bounds = getRangeBounds(range);
+    if (!bounds) return false;
+    const cellTaskIndex = taskIndexById.get(cell.taskId);
+    if (cellTaskIndex === void 0) {
+      return false;
+    }
+    const cellSubrowIndex = getSubrowIndex(cellTaskIndex, cell.kind);
+    return cell.dateIndex >= bounds.fromDateIndex && cell.dateIndex <= bounds.toDateIndex && cellSubrowIndex >= bounds.fromSubrowIndex && cellSubrowIndex <= bounds.toSubrowIndex;
+  }, [getRangeBounds, taskIndexById]);
+  const commitCell = (0, import_react17.useCallback)((task, dateIndex, kind, value) => {
+    const dateKey = dateKeys[dateIndex];
+    const source = kind === "plan" ? task.planByDate : task.factByDate;
+    const nextValues = { ...source ?? {} };
+    if (value === void 0) {
+      delete nextValues[dateKey];
+    } else {
+      nextValues[dateKey] = value;
+    }
+    const changedTask = {
+      ...task,
+      [kind === "plan" ? "planByDate" : "factByDate"]: nextValues
+    };
+    onTasksChange?.([changedTask]);
+    onCellCommit?.({
+      task,
+      date: dateRange[dateIndex],
+      dateKey,
+      kind,
+      value
+    });
+  }, [dateKeys, dateRange, onCellCommit, onTasksChange]);
+  const commitRangeCells = (0, import_react17.useCallback)((bounds, value, mode) => {
+    const changedTasksById = /* @__PURE__ */ new Map();
+    for (let subrowIndex = bounds.fromSubrowIndex; subrowIndex <= bounds.toSubrowIndex; subrowIndex += 1) {
+      const task = tasks[Math.floor(subrowIndex / 2)];
+      if (!task || parentTaskIds.has(task.id)) continue;
+      const kind = subrowIndex % 2 === 0 ? "plan" : "fact";
+      const currentChangedTask = changedTasksById.get(task.id) ?? task;
+      let nextPlanByDate = currentChangedTask.planByDate;
+      let nextFactByDate = currentChangedTask.factByDate;
+      let didChange = false;
+      for (let dateIndex = bounds.fromDateIndex; dateIndex <= bounds.toDateIndex; dateIndex += 1) {
+        const dateKey = dateKeys[dateIndex];
+        if (dateKey === void 0) continue;
+        const currentValues = kind === "plan" ? nextPlanByDate : nextFactByDate;
+        const currentValue = currentValues?.[dateKey];
+        const nextValue = mode === "clear" ? void 0 : value;
+        if (currentValue === nextValue) continue;
+        if (kind === "plan") {
+          nextPlanByDate = { ...nextPlanByDate ?? {} };
+          if (nextValue === void 0) {
+            delete nextPlanByDate[dateKey];
+          } else {
+            nextPlanByDate[dateKey] = nextValue;
+          }
+        } else {
+          nextFactByDate = { ...nextFactByDate ?? {} };
+          if (nextValue === void 0) {
+            delete nextFactByDate[dateKey];
+          } else {
+            nextFactByDate[dateKey] = nextValue;
+          }
+        }
+        didChange = true;
+      }
+      if (didChange) {
+        changedTasksById.set(task.id, {
+          ...currentChangedTask,
+          ...nextPlanByDate !== currentChangedTask.planByDate ? { planByDate: nextPlanByDate ?? {} } : {},
+          ...nextFactByDate !== currentChangedTask.factByDate ? { factByDate: nextFactByDate ?? {} } : {}
+        });
+      }
+    }
+    const changedTasks = Array.from(changedTasksById.values());
+    if (changedTasks.length > 0) {
+      onTasksChange?.(changedTasks);
+    }
+  }, [dateKeys, onTasksChange, parentTaskIds, tasks]);
+  const clearSelectedCells = (0, import_react17.useCallback)(() => {
+    const activeRange = fillRange ?? selectedRange;
+    if (!activeRange) {
+      if (!activeCell) return;
+      const task = taskById.get(activeCell.taskId);
+      if (!task || parentTaskIds.has(task.id)) return;
+      commitCell(task, activeCell.dateIndex, activeCell.kind, void 0);
+      return;
+    }
+    const bounds = getRangeBounds(activeRange);
+    if (bounds) {
+      commitRangeCells(bounds, void 0, "clear");
+    }
+  }, [activeCell, commitCell, commitRangeCells, fillRange, getRangeBounds, parentTaskIds, selectedRange, taskById]);
+  const commitSelectedCells = (0, import_react17.useCallback)((value) => {
+    const activeRange = fillRange ?? selectedRange;
+    if (!activeRange) {
+      if (!activeCell) return;
+      const task = taskById.get(activeCell.taskId);
+      if (!task || parentTaskIds.has(task.id)) return;
+      commitCell(task, activeCell.dateIndex, activeCell.kind, value);
+      return;
+    }
+    const bounds = getRangeBounds(activeRange);
+    if (bounds) {
+      commitRangeCells(bounds, value, "set");
+    }
+  }, [activeCell, commitCell, commitRangeCells, fillRange, getRangeBounds, parentTaskIds, selectedRange, taskById]);
+  const getCellValue = (0, import_react17.useCallback)((cell) => {
+    const task = taskById.get(cell.taskId);
+    if (!task) return void 0;
+    const dateKey = dateKeys[cell.dateIndex];
+    return cell.kind === "plan" ? task.planByDate?.[dateKey] : task.factByDate?.[dateKey];
+  }, [dateKeys, taskById]);
+  const applyFillRange = (0, import_react17.useCallback)((nextFillRange) => {
+    const targetRange = nextFillRange ?? fillRange;
+    if (!selectedRange || !targetRange) return;
+    const sourceBounds = getRangeBounds(selectedRange);
+    const targetBounds = getRangeBounds(targetRange);
+    if (!sourceBounds || !targetBounds) return;
+    const sourceDateSpan = sourceBounds.toDateIndex - sourceBounds.fromDateIndex + 1;
+    const sourceSubrowSpan = sourceBounds.toSubrowIndex - sourceBounds.fromSubrowIndex + 1;
+    const changedTasksById = /* @__PURE__ */ new Map();
+    for (let subrowIndex = targetBounds.fromSubrowIndex; subrowIndex <= targetBounds.toSubrowIndex; subrowIndex += 1) {
+      const targetCellForRow = getCellFromPosition(subrowIndex, targetBounds.fromDateIndex);
+      if (!targetCellForRow || parentTaskIds.has(targetCellForRow.taskId)) continue;
+      const originalTask = taskById.get(targetCellForRow.taskId);
+      if (!originalTask) continue;
+      let changedTask = changedTasksById.get(originalTask.id) ?? originalTask;
+      let nextPlanByDate = changedTask.planByDate;
+      let nextFactByDate = changedTask.factByDate;
+      let didChange = false;
+      for (let dateIndex = targetBounds.fromDateIndex; dateIndex <= targetBounds.toDateIndex; dateIndex += 1) {
+        const targetCell = getCellFromPosition(subrowIndex, dateIndex);
+        if (!targetCell || isCellInRange(targetCell, selectedRange)) continue;
+        const sourceSubrowIndex = sourceBounds.fromSubrowIndex + ((subrowIndex - sourceBounds.fromSubrowIndex) % sourceSubrowSpan + sourceSubrowSpan) % sourceSubrowSpan;
+        const sourceDateIndex = sourceBounds.fromDateIndex + ((dateIndex - sourceBounds.fromDateIndex) % sourceDateSpan + sourceDateSpan) % sourceDateSpan;
+        const sourceCell = getCellFromPosition(sourceSubrowIndex, sourceDateIndex);
+        if (!sourceCell) continue;
+        const nextValue = getCellValue(sourceCell);
+        const dateKey = dateKeys[dateIndex];
+        const currentValues = targetCell.kind === "plan" ? nextPlanByDate : nextFactByDate;
+        if (currentValues?.[dateKey] === nextValue) continue;
+        if (targetCell.kind === "plan") {
+          nextPlanByDate = { ...nextPlanByDate ?? {} };
+          if (nextValue === void 0) {
+            delete nextPlanByDate[dateKey];
+          } else {
+            nextPlanByDate[dateKey] = nextValue;
+          }
+        } else {
+          nextFactByDate = { ...nextFactByDate ?? {} };
+          if (nextValue === void 0) {
+            delete nextFactByDate[dateKey];
+          } else {
+            nextFactByDate[dateKey] = nextValue;
+          }
+        }
+        didChange = true;
+      }
+      if (didChange) {
+        changedTasksById.set(originalTask.id, {
+          ...changedTask,
+          ...nextPlanByDate !== changedTask.planByDate ? { planByDate: nextPlanByDate ?? {} } : {},
+          ...nextFactByDate !== changedTask.factByDate ? { factByDate: nextFactByDate ?? {} } : {}
+        });
+      }
+    }
+    const changedTasks = Array.from(changedTasksById.values());
+    if (changedTasks.length > 0) {
+      onTasksChange?.(changedTasks);
+    }
+    setSelectedRange(targetRange);
+    setActiveCell(targetRange.anchor);
+    setFillRange(null);
+  }, [
+    dateKeys,
+    fillRange,
+    getCellFromPosition,
+    getCellValue,
+    getRangeBounds,
+    isCellInRange,
+    onTasksChange,
+    parentTaskIds,
+    selectedRange,
+    taskById
+  ]);
+  const moveActiveCell = (0, import_react17.useCallback)((cell, direction) => {
+    const taskIndex = tasks.findIndex((task) => task.id === cell.taskId);
+    if (taskIndex < 0) return;
+    let nextCell = { ...cell };
+    if (direction === "left") {
+      nextCell.dateIndex = Math.max(0, cell.dateIndex - 1);
+    } else if (direction === "right") {
+      nextCell.dateIndex = Math.min(dateRange.length - 1, cell.dateIndex + 1);
+    } else if (direction === "up") {
+      if (cell.kind === "fact") {
+        nextCell.kind = "plan";
+      } else {
+        const previousEditableTaskIndex = findEditableTaskIndex(tasks, parentTaskIds, taskIndex - 1, -1);
+        if (previousEditableTaskIndex === null) return;
+        const previousTask = tasks[previousEditableTaskIndex];
+        nextCell = { taskId: previousTask.id, dateIndex: cell.dateIndex, kind: "fact" };
+      }
+    } else if (direction === "down") {
+      if (cell.kind === "plan") {
+        nextCell.kind = "fact";
+      } else {
+        const nextEditableTaskIndex = findEditableTaskIndex(tasks, parentTaskIds, taskIndex + 1, 1);
+        if (nextEditableTaskIndex === null) return;
+        const nextTask = tasks[nextEditableTaskIndex];
+        nextCell = { taskId: nextTask.id, dateIndex: cell.dateIndex, kind: "plan" };
+      }
+    }
+    setActiveCell(nextCell);
+    setSelectedRange({ anchor: nextCell, focus: nextCell });
+    onTaskSelect?.(nextCell.taskId);
+    focusCell(nextCell);
+  }, [dateRange.length, focusCell, onTaskSelect, parentTaskIds, tasks]);
+  const extendSelectedRange = (0, import_react17.useCallback)((cell, direction) => {
+    const taskIndex = tasks.findIndex((task) => task.id === cell.taskId);
+    if (taskIndex < 0) return;
+    let nextCell = { ...cell };
+    if (direction === "left") {
+      nextCell.dateIndex = Math.max(0, cell.dateIndex - 1);
+    } else if (direction === "right") {
+      nextCell.dateIndex = Math.min(dateRange.length - 1, cell.dateIndex + 1);
+    } else if (direction === "up") {
+      if (cell.kind === "fact") {
+        nextCell.kind = "plan";
+      } else {
+        const previousEditableTaskIndex = findEditableTaskIndex(tasks, parentTaskIds, taskIndex - 1, -1);
+        if (previousEditableTaskIndex === null) return;
+        const previousTask = tasks[previousEditableTaskIndex];
+        nextCell = { taskId: previousTask.id, dateIndex: cell.dateIndex, kind: "fact" };
+      }
+    } else if (direction === "down") {
+      if (cell.kind === "plan") {
+        nextCell.kind = "fact";
+      } else {
+        const nextEditableTaskIndex = findEditableTaskIndex(tasks, parentTaskIds, taskIndex + 1, 1);
+        if (nextEditableTaskIndex === null) return;
+        const nextTask = tasks[nextEditableTaskIndex];
+        nextCell = { taskId: nextTask.id, dateIndex: cell.dateIndex, kind: "plan" };
+      }
+    }
+    setActiveCell((currentActiveCell) => currentActiveCell ?? cell);
+    setFillRange(null);
+    setSelectedRange((currentRange) => ({
+      anchor: currentRange?.anchor ?? cell,
+      focus: nextCell
+    }));
+    onTaskSelect?.(nextCell.taskId);
+    focusCell(selectedRange?.anchor ?? cell);
+  }, [dateRange.length, focusCell, onTaskSelect, parentTaskIds, selectedRange, tasks]);
+  (0, import_react17.useEffect)(() => {
+    const endSelection = () => {
+      let pendingFillRange = null;
+      if (hoverFrameRef.current !== null) {
+        window.cancelAnimationFrame(hoverFrameRef.current);
+        hoverFrameRef.current = null;
+        const pendingCell = pendingHoverCellRef.current;
+        if (pendingCell && isFillDraggingRef.current && selectedRange) {
+          pendingFillRange = { anchor: selectedRange.anchor, focus: pendingCell };
+        }
+        flushPendingHoverCell();
+      }
+      if (isFillDraggingRef.current) {
+        isFillDraggingRef.current = false;
+        applyFillRange(pendingFillRange);
+      }
+      isSelectingRef.current = false;
+    };
+    window.addEventListener("mouseup", endSelection);
+    return () => {
+      window.removeEventListener("mouseup", endSelection);
+    };
+  }, [applyFillRange, flushPendingHoverCell]);
+  (0, import_react17.useEffect)(() => () => {
+    if (hoverFrameRef.current !== null) {
+      window.cancelAnimationFrame(hoverFrameRef.current);
+    }
+  }, []);
+  (0, import_react17.useEffect)(() => {
+    const handleKeyDown = (event) => {
+      if (event.key !== "Escape") return;
+      clearSelection();
+    };
+    const handleMouseDown = (event) => {
+      const target = event.target;
+      if (target instanceof Node && rootRef.current?.contains(target)) {
+        return;
+      }
+      clearSelection();
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    document.addEventListener("mousedown", handleMouseDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+      document.removeEventListener("mousedown", handleMouseDown);
+    };
+  }, [clearSelection]);
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+    "div",
+    {
+      ref: rootRef,
+      className: "gantt-pf-root",
+      style: {
+        width: `${totalWidth}px`,
+        ["--gantt-pf-day-width"]: `${dayWidth}px`
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "gantt-pf-header", style: { width: `${totalWidth}px`, height: `${headerHeight}px` }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            TimeScaleHeader_default,
+            {
+              days: dateRange,
+              dayWidth,
+              headerHeight: headerHeight - 1,
+              viewMode: "day"
+            }
+          ),
+          todayDateIndex !== void 0 && todayDateIndex >= 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            "span",
+            {
+              className: "gantt-pf-headerTodayLine",
+              "aria-hidden": "true",
+              style: {
+                left: `${todayDateIndex * dayWidth}px`,
+                top: `${Math.max(0, headerHeight / 2)}px`
+              }
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "gantt-pf-monthSeparatorLayer", "aria-hidden": "true", children: monthSeparatorIndices.map((dateIndex) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          "span",
+          {
+            className: "gantt-pf-monthSeparator",
+            style: {
+              left: `${Math.round(dateIndex * dayWidth)}px`,
+              top: `${Math.max(0, headerHeight / 2)}px`
+            }
+          },
+          `month-separator-${dateIndex}`
+        )) }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          "div",
+          {
+            ref: bodyRef,
+            className: "gantt-pf-body",
+            style: {
+              height: `${tasks.length * rowHeight}px`,
+              minHeight: bodyMinHeight,
+              width: `${totalWidth}px`
+            },
+            children: renderedRowIndices.map((rowIndex) => {
+              const task = tasks[rowIndex];
+              if (!task) return null;
+              const isParent = parentTaskIds.has(task.id);
+              const isHighlighted = filterMode === "highlight" && !!highlightedTaskIds?.has(task.id);
+              return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                PlanFactRow,
+                {
+                  task,
+                  rowIndex,
+                  dateRange,
+                  dateKeys,
+                  renderedDateIndices,
+                  rowHeight,
+                  subrowHeight,
+                  dayWidth,
+                  plannedRange: plannedRangeByTaskId.get(task.id) ?? null,
+                  todayDateIndex,
+                  isParent,
+                  isHighlighted,
+                  selectedTaskId,
+                  activeCell,
+                  editingCell,
+                  selectedRange,
+                  renderedRangeBounds,
+                  didDragSelectRef,
+                  isSelectingRef,
+                  isFillDraggingRef,
+                  onTaskSelect,
+                  selectSingleCell,
+                  queueHoverCellUpdate,
+                  setActiveCell,
+                  setEditingCell,
+                  setFillRange,
+                  clearSelectedCells,
+                  commitCell,
+                  commitSelectedCells,
+                  moveActiveCell,
+                  extendSelectedRange,
+                  focusCell,
+                  showOverflowTooltip,
+                  hideOverflowTooltip
+                },
+                task.id
+              );
+            })
+          }
+        ),
+        overflowTooltip && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          "div",
+          {
+            className: "gantt-pf-overflowTooltip",
+            role: "tooltip",
+            "aria-hidden": "true",
+            style: {
+              left: `${overflowTooltip.left}px`,
+              top: `${overflowTooltip.top}px`
+            },
+            children: overflowTooltip.label
+          }
+        )
+      ]
+    }
+  );
+}
+
 // src/components/GanttChart/print.ts
 function getPrintDocumentTitle({
   header,
@@ -10972,9 +11968,60 @@ function createTaskPreviewPositionStore() {
 }
 
 // src/components/GanttChart/GanttChart.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var SCROLL_TO_ROW_CONTEXT_ROWS = 2;
 var TASK_ROW_OVERSCAN = 8;
+var PLAN_FACT_COLUMN_OVERSCAN = 24;
+var PLAN_FACT_COLUMN_WINDOW_STEP = 14;
+function getFullMonthDays(tasks) {
+  if (!tasks || tasks.length === 0) {
+    return getMultiMonthDays(tasks);
+  }
+  let minDate = null;
+  let maxDate = null;
+  for (const task of tasks) {
+    const start = parseUTCDate(task.startDate);
+    const end = parseUTCDate(task.endDate);
+    if (!minDate || start.getTime() < minDate.getTime()) {
+      minDate = start;
+    }
+    if (!maxDate || end.getTime() > maxDate.getTime()) {
+      maxDate = end;
+    }
+  }
+  if (!minDate || !maxDate) {
+    return getMultiMonthDays(tasks);
+  }
+  const startOfMonth2 = new Date(Date.UTC(minDate.getUTCFullYear(), minDate.getUTCMonth(), 1));
+  const endOfMonth = new Date(Date.UTC(maxDate.getUTCFullYear(), maxDate.getUTCMonth() + 1, 0));
+  const days = [];
+  const current = new Date(startOfMonth2);
+  while (current.getTime() <= endOfMonth.getTime()) {
+    days.push(new Date(Date.UTC(
+      current.getUTCFullYear(),
+      current.getUTCMonth(),
+      current.getUTCDate()
+    )));
+    current.setUTCDate(current.getUTCDate() + 1);
+  }
+  return days;
+}
+function getPlanFactRangeTasks(tasks) {
+  const rangeTasks = [];
+  for (const task of tasks) {
+    rangeTasks.push({ startDate: task.startDate, endDate: task.endDate });
+    for (const dateKey of Object.keys(task.planByDate ?? {})) {
+      rangeTasks.push({ startDate: dateKey, endDate: dateKey });
+    }
+    for (const dateKey of Object.keys(task.factByDate ?? {})) {
+      rangeTasks.push({ startDate: dateKey, endDate: dateKey });
+    }
+  }
+  return rangeTasks;
+}
+function clampScrollValue(value, max) {
+  return Math.min(max, Math.max(0, value));
+}
 function arePositionMapsEqual(left, right) {
   if (left.size !== right.size) return false;
   for (const [taskId, leftPosition] of left) {
@@ -11011,9 +12058,9 @@ function arePreviewTaskMapsEqual(left, right) {
 }
 function GanttChartInner(props, ref) {
   if (props.mode === "resource-planner") {
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ResourceTimelineChart, { ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ResourceTimelineChart, { ...props });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     TaskGanttChart,
     {
       ...props,
@@ -11023,6 +12070,7 @@ function GanttChartInner(props, ref) {
 }
 function TaskGanttChartInner(props, ref) {
   const isTableMatrixMode = props.mode === "table-matrix";
+  const isPlanFactMode = props.mode === "plan-fact";
   const {
     tasks,
     rowHeight = 40,
@@ -11072,47 +12120,52 @@ function TaskGanttChartInner(props, ref) {
     onTaskDateChangeModeChange: externalOnTaskDateChangeModeChange
   } = props;
   const dayWidth = !isTableMatrixMode ? props.dayWidth ?? 40 : 40;
-  const viewMode = !isTableMatrixMode ? props.viewMode ?? "day" : "day";
-  const customDays = !isTableMatrixMode ? props.customDays : void 0;
-  const isWeekend3 = !isTableMatrixMode ? props.isWeekend : void 0;
-  const businessDays = !isTableMatrixMode ? props.businessDays ?? true : true;
+  const viewMode = !isTableMatrixMode && !isPlanFactMode ? props.viewMode ?? "day" : "day";
+  const customDays = !isTableMatrixMode && !isPlanFactMode ? props.customDays : void 0;
+  const isWeekend3 = !isTableMatrixMode && !isPlanFactMode ? props.isWeekend : void 0;
+  const businessDays = !isTableMatrixMode && !isPlanFactMode ? props.businessDays ?? true : true;
   const matrixColumns = isTableMatrixMode ? props.matrixColumns : [];
   const matrixColumnGroups = isTableMatrixMode ? props.matrixColumnGroups : void 0;
   const onMatrixCellClick = isTableMatrixMode ? props.onMatrixCellClick : void 0;
   const matrixDateOverlay = isTableMatrixMode ? props.matrixDateOverlay : void 0;
-  const containerRef = (0, import_react17.useRef)(null);
-  const scrollContainerRef = (0, import_react17.useRef)(null);
-  const scrollContentRef = (0, import_react17.useRef)(null);
-  const clearSelectedTaskTimeoutRef = (0, import_react17.useRef)(null);
-  const hasAutoScrolledToTodayRef = (0, import_react17.useRef)(false);
-  const previewPositionStoreRef = (0, import_react17.useRef)(null);
-  const renderedTaskIdsRef = (0, import_react17.useRef)(/* @__PURE__ */ new Set());
+  const onPlanFactCellCommit = isPlanFactMode ? props.onPlanFactCellCommit : void 0;
+  const containerRef = (0, import_react18.useRef)(null);
+  const scrollContainerRef = (0, import_react18.useRef)(null);
+  const scrollContentRef = (0, import_react18.useRef)(null);
+  const clearSelectedTaskTimeoutRef = (0, import_react18.useRef)(null);
+  const hasAutoScrolledToTodayRef = (0, import_react18.useRef)(false);
+  const previewPositionStoreRef = (0, import_react18.useRef)(null);
+  const renderedTaskIdsRef = (0, import_react18.useRef)(/* @__PURE__ */ new Set());
   if (previewPositionStoreRef.current === null) {
     previewPositionStoreRef.current = createTaskPreviewPositionStore();
   }
   const previewPositionStore = previewPositionStoreRef.current;
-  const [selectedTaskId, setSelectedTaskId] = (0, import_react17.useState)(null);
-  const [taskListHasRightShadow, setTaskListHasRightShadow] = (0, import_react17.useState)(false);
-  const [internalTaskDateChangeMode, setInternalTaskDateChangeMode] = (0, import_react17.useState)("preserve-duration");
-  const [scrollViewport, setScrollViewport] = (0, import_react17.useState)({ scrollTop: 0, viewportHeight: 0 });
-  const [selectedChip, setSelectedChip] = (0, import_react17.useState)(null);
-  const [activeTimelineTooltip, setActiveTimelineTooltip] = (0, import_react17.useState)(null);
-  const [internalCollapsedParentIds, setInternalCollapsedParentIds] = (0, import_react17.useState)(/* @__PURE__ */ new Set());
+  const [selectedTaskId, setSelectedTaskId] = (0, import_react18.useState)(null);
+  const [taskListHasRightShadow, setTaskListHasRightShadow] = (0, import_react18.useState)(false);
+  const [internalTaskDateChangeMode, setInternalTaskDateChangeMode] = (0, import_react18.useState)("preserve-duration");
+  const [scrollViewport, setScrollViewport] = (0, import_react18.useState)({ scrollTop: 0, viewportHeight: 0 });
+  const [planFactDateWindow, setPlanFactDateWindow] = (0, import_react18.useState)(null);
+  const [selectedChip, setSelectedChip] = (0, import_react18.useState)(null);
+  const [activeTimelineTooltip, setActiveTimelineTooltip] = (0, import_react18.useState)(null);
+  const [internalCollapsedParentIds, setInternalCollapsedParentIds] = (0, import_react18.useState)(/* @__PURE__ */ new Set());
   const collapsedParentIds = externalCollapsedParentIds ?? internalCollapsedParentIds;
-  const [editingTaskId, setEditingTaskId] = (0, import_react17.useState)(null);
+  const [editingTaskId, setEditingTaskId] = (0, import_react18.useState)(null);
   const taskDateChangeMode = externalTaskDateChangeMode ?? internalTaskDateChangeMode;
   const handleTaskDateChangeMode = externalOnTaskDateChangeModeChange ?? setInternalTaskDateChangeMode;
-  const resolvedRowContentLines = Math.max(1, Math.floor(rowContentLines));
-  const effectiveRowHeight = (0, import_react17.useMemo)(
+  const resolvedRowContentLines = isPlanFactMode ? Math.max(2, Math.floor(rowContentLines)) : Math.max(1, Math.floor(rowContentLines));
+  const effectiveRowHeight = (0, import_react18.useMemo)(
     () => Math.max(rowHeight, 10 + resolvedRowContentLines * 18),
     [resolvedRowContentLines, rowHeight]
   );
-  const normalizedTasks = (0, import_react17.useMemo)(() => normalizeHierarchyTasks(tasks), [tasks]);
-  const isCustomWeekend = (0, import_react17.useMemo)(
+  const normalizedTasks = (0, import_react18.useMemo)(() => normalizeHierarchyTasks(tasks), [tasks]);
+  const isCustomWeekend = (0, import_react18.useMemo)(
     () => createCustomDayPredicate({ customDays, isWeekend: isWeekend3 }),
     [customDays, isWeekend3]
   );
-  const dateRangeTasks = (0, import_react17.useMemo)(() => {
+  const dateRangeTasks = (0, import_react18.useMemo)(() => {
+    if (isPlanFactMode) {
+      return getPlanFactRangeTasks(normalizedTasks);
+    }
     if (!showBaseline) {
       return normalizedTasks;
     }
@@ -11121,22 +12174,25 @@ function TaskGanttChartInner(props, ref) {
       startDate: task.baselineStartDate && parseUTCDate(task.baselineStartDate).getTime() < parseUTCDate(task.startDate).getTime() ? task.baselineStartDate : task.startDate,
       endDate: task.baselineEndDate && parseUTCDate(task.baselineEndDate).getTime() > parseUTCDate(task.endDate).getTime() ? task.baselineEndDate : task.endDate
     }));
-  }, [normalizedTasks, showBaseline]);
-  const dateRange = (0, import_react17.useMemo)(() => getMultiMonthDays(dateRangeTasks), [dateRangeTasks]);
-  const [validationResult, setValidationResult] = (0, import_react17.useState)(null);
-  const [cascadeOverrides, setCascadeOverrides] = (0, import_react17.useState)(/* @__PURE__ */ new Map());
-  const gridWidth = (0, import_react17.useMemo)(
+  }, [isPlanFactMode, normalizedTasks, showBaseline]);
+  const dateRange = (0, import_react18.useMemo)(
+    () => isPlanFactMode ? getFullMonthDays(dateRangeTasks) : getMultiMonthDays(dateRangeTasks),
+    [dateRangeTasks, isPlanFactMode]
+  );
+  const [validationResult, setValidationResult] = (0, import_react18.useState)(null);
+  const [cascadeOverrides, setCascadeOverrides] = (0, import_react18.useState)(/* @__PURE__ */ new Map());
+  const gridWidth = (0, import_react18.useMemo)(
     () => Math.round(dateRange.length * dayWidth),
     [dateRange.length, dayWidth]
   );
-  const matrixWidth = (0, import_react17.useMemo)(
+  const matrixWidth = (0, import_react18.useMemo)(
     () => matrixColumns.reduce((sum, column) => {
       if (typeof column.width !== "number") return void 0;
       return sum !== void 0 ? sum + column.width : void 0;
     }, 0),
     [matrixColumns]
   );
-  const visibleTasks = (0, import_react17.useMemo)(() => {
+  const visibleTasks = (0, import_react18.useMemo)(() => {
     const parentMap = new Map(normalizedTasks.map((t) => [t.id, t.parentId]));
     function isAnyAncestorCollapsed(parentId) {
       let current = parentId;
@@ -11152,11 +12208,11 @@ function TaskGanttChartInner(props, ref) {
     }
     return tasks2;
   }, [normalizedTasks, collapsedParentIds, filterMode, taskFilter]);
-  const matchedTaskIds = (0, import_react17.useMemo)(() => {
+  const matchedTaskIds = (0, import_react18.useMemo)(() => {
     if (!taskFilter) return /* @__PURE__ */ new Set();
     return new Set(visibleTasks.filter(taskFilter).map((task) => task.id));
   }, [visibleTasks, taskFilter]);
-  const taskListHighlightedTaskIds = (0, import_react17.useMemo)(() => {
+  const taskListHighlightedTaskIds = (0, import_react18.useMemo)(() => {
     if (filterMode === "hide") {
       return /* @__PURE__ */ new Set();
     }
@@ -11167,33 +12223,34 @@ function TaskGanttChartInner(props, ref) {
     matchedTaskIds.forEach((taskId) => mergedHighlightedTaskIds.add(taskId));
     return mergedHighlightedTaskIds;
   }, [filterMode, highlightedTaskIds, matchedTaskIds]);
-  const totalGridHeight = (0, import_react17.useMemo)(
+  const totalGridHeight = (0, import_react18.useMemo)(
     () => visibleTasks.length * effectiveRowHeight,
     [effectiveRowHeight, visibleTasks.length]
   );
   const timelineHeaderHeight = headerHeight + 1;
-  const tableBodyMinHeight = (0, import_react17.useMemo)(() => {
-    if (!isTableMatrixMode || containerHeight === void 0) {
+  const tableBodyMinHeight = (0, import_react18.useMemo)(() => {
+    if (!isTableMatrixMode && !isPlanFactMode || containerHeight === void 0) {
       return void 0;
     }
     if (typeof containerHeight === "number") {
       return Math.max(0, containerHeight - timelineHeaderHeight);
     }
     return `calc(${containerHeight} - ${timelineHeaderHeight}px)`;
-  }, [containerHeight, isTableMatrixMode, timelineHeaderHeight]);
-  const monthStart = (0, import_react17.useMemo)(() => {
+  }, [containerHeight, isPlanFactMode, isTableMatrixMode, timelineHeaderHeight]);
+  const monthStart = (0, import_react18.useMemo)(() => {
     if (dateRange.length === 0) {
       return new Date(Date.UTC((/* @__PURE__ */ new Date()).getUTCFullYear(), (/* @__PURE__ */ new Date()).getUTCMonth(), 1));
     }
     const firstDay = dateRange[0];
     return new Date(Date.UTC(firstDay.getUTCFullYear(), firstDay.getUTCMonth(), 1));
   }, [dateRange]);
-  const todayInRange = (0, import_react17.useMemo)(() => {
+  const todayIndex = (0, import_react18.useMemo)(() => {
     const now = /* @__PURE__ */ new Date();
     const today = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate()));
-    return dateRange.some((day) => day.getTime() === today.getTime());
+    return dateRange.findIndex((day) => day.getTime() === today.getTime());
   }, [dateRange]);
-  const visibleTimelineMarkers = (0, import_react17.useMemo)(() => {
+  const todayInRange = todayIndex !== -1;
+  const visibleTimelineMarkers = (0, import_react18.useMemo)(() => {
     if (isTableMatrixMode || !timelineMarkers || timelineMarkers.length === 0 || dateRange.length === 0) {
       return [];
     }
@@ -11204,22 +12261,22 @@ function TaskGanttChartInner(props, ref) {
       return markerDate >= rangeStartMs && markerDate <= rangeEndMs;
     });
   }, [dateRange, isTableMatrixMode, timelineMarkers]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     if (isTableMatrixMode) return;
     if (hasAutoScrolledToTodayRef.current) return;
     const container = scrollContainerRef.current;
     if (!container || dateRange.length === 0) return;
     const now = /* @__PURE__ */ new Date();
     const today = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate()));
-    const todayIndex = dateRange.findIndex((day) => day.getTime() === today.getTime());
-    if (todayIndex === -1) return;
-    const todayOffset = todayIndex * dayWidth;
+    const todayIndex2 = dateRange.findIndex((day) => day.getTime() === today.getTime());
+    if (todayIndex2 === -1) return;
+    const todayOffset = todayIndex2 * dayWidth;
     const containerWidth = container.clientWidth;
     const scrollLeft = Math.round(todayOffset + dayWidth / 2 - containerWidth * 0.3);
     container.scrollLeft = Math.max(0, scrollLeft);
     hasAutoScrolledToTodayRef.current = true;
   }, [dateRange, dayWidth, isTableMatrixMode]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const container = scrollContainerRef.current;
     if (!container) return;
     let frameId = null;
@@ -11227,13 +12284,33 @@ function TaskGanttChartInner(props, ref) {
       frameId = null;
       const nextHasRightShadow = container.scrollLeft > 0;
       const nextViewportHeight = Math.max(0, container.clientHeight - timelineHeaderHeight);
+      const nextViewportWidth = Math.max(0, container.clientWidth - (showTaskList ? taskListWidth : 0));
       const nextScrollTop = container.scrollTop;
+      const nextScrollLeft = container.scrollLeft;
+      const nextChartScrollLeft = Math.max(0, nextScrollLeft);
       setTaskListHasRightShadow(
         (previous) => previous === nextHasRightShadow ? previous : nextHasRightShadow
       );
       setScrollViewport(
         (previous) => previous.scrollTop === nextScrollTop && previous.viewportHeight === nextViewportHeight ? previous : { scrollTop: nextScrollTop, viewportHeight: nextViewportHeight }
       );
+      setPlanFactDateWindow((previous) => {
+        if (!isPlanFactMode || dateRange.length === 0 || nextViewportWidth <= 0) {
+          return previous === null ? previous : null;
+        }
+        const firstVisibleColumn = Math.max(0, Math.floor(nextChartScrollLeft / dayWidth));
+        const visibleColumnCount = Math.max(1, Math.ceil(nextViewportWidth / dayWidth));
+        const lastVisibleColumn = Math.min(dateRange.length - 1, firstVisibleColumn + visibleColumnCount - 1);
+        const rangeStart = Math.max(
+          0,
+          Math.floor(Math.max(0, firstVisibleColumn - PLAN_FACT_COLUMN_OVERSCAN) / PLAN_FACT_COLUMN_WINDOW_STEP) * PLAN_FACT_COLUMN_WINDOW_STEP
+        );
+        const rangeEnd = Math.min(
+          dateRange.length - 1,
+          Math.ceil((lastVisibleColumn + PLAN_FACT_COLUMN_OVERSCAN + 1) / PLAN_FACT_COLUMN_WINDOW_STEP) * PLAN_FACT_COLUMN_WINDOW_STEP - 1
+        );
+        return previous?.start === rangeStart && previous.end === rangeEnd ? previous : { start: rangeStart, end: rangeEnd };
+      });
     };
     const scheduleUpdate = () => {
       if (frameId !== null) return;
@@ -11254,21 +12331,21 @@ function TaskGanttChartInner(props, ref) {
       container.removeEventListener("scroll", scheduleUpdate);
       window.removeEventListener("resize", scheduleUpdate);
     };
-  }, [timelineHeaderHeight]);
-  const scrollToToday = (0, import_react17.useCallback)(() => {
+  }, [dateRange.length, dayWidth, isPlanFactMode, showTaskList, taskListWidth, timelineHeaderHeight]);
+  const scrollToToday = (0, import_react18.useCallback)(() => {
     if (isTableMatrixMode) return;
     const container = scrollContainerRef.current;
     if (!container || dateRange.length === 0) return;
     const now = /* @__PURE__ */ new Date();
     const today = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate()));
-    const todayIndex = dateRange.findIndex((day) => day.getTime() === today.getTime());
-    if (todayIndex === -1) return;
-    const todayOffset = todayIndex * dayWidth;
+    const todayIndex2 = dateRange.findIndex((day) => day.getTime() === today.getTime());
+    if (todayIndex2 === -1) return;
+    const todayOffset = todayIndex2 * dayWidth;
     const containerWidth = container.clientWidth;
     const scrollLeft = Math.round(todayOffset + dayWidth / 2 - containerWidth * 0.3);
     container.scrollTo({ left: Math.max(0, scrollLeft), behavior: "smooth" });
   }, [dateRange, dayWidth, isTableMatrixMode]);
-  const scrollToTask = (0, import_react17.useCallback)((taskId) => {
+  const scrollToTask = (0, import_react18.useCallback)((taskId) => {
     if (isTableMatrixMode) {
       const container2 = scrollContainerRef.current;
       if (!container2) return;
@@ -11295,7 +12372,7 @@ function TaskGanttChartInner(props, ref) {
     const scrollLeft = Math.round(taskOffset - dayWidth * 2);
     container.scrollTo({ left: Math.max(0, scrollLeft), behavior: "smooth" });
   }, [dateRange, dayWidth, effectiveRowHeight, isTableMatrixMode, tasks, visibleTasks]);
-  const scrollToRow = (0, import_react17.useCallback)((taskId, options = {}) => {
+  const scrollToRow = (0, import_react18.useCallback)((taskId, options = {}) => {
     const container = scrollContainerRef.current;
     if (!container) return;
     const task = tasks.find((t) => t.id === taskId);
@@ -11324,21 +12401,21 @@ function TaskGanttChartInner(props, ref) {
     }
     container.scrollTo({ top: scrollTop, behavior });
   }, [effectiveRowHeight, tasks, visibleTasks]);
-  const [dragGuideLines, setDragGuideLines] = (0, import_react17.useState)(null);
-  const [draggedTaskOverride, setDraggedTaskOverride] = (0, import_react17.useState)(null);
-  const [previewTasksById, setPreviewTasksById] = (0, import_react17.useState)(/* @__PURE__ */ new Map());
-  (0, import_react17.useEffect)(() => {
+  const [dragGuideLines, setDragGuideLines] = (0, import_react18.useState)(null);
+  const [draggedTaskOverride, setDraggedTaskOverride] = (0, import_react18.useState)(null);
+  const [previewTasksById, setPreviewTasksById] = (0, import_react18.useState)(/* @__PURE__ */ new Map());
+  (0, import_react18.useEffect)(() => {
     const result = validateDependencies(tasks);
     setValidationResult(result);
     onValidateDependencies?.(result);
   }, [tasks, onValidateDependencies]);
-  (0, import_react17.useEffect)(() => () => {
+  (0, import_react18.useEffect)(() => () => {
     if (clearSelectedTaskTimeoutRef.current !== null) {
       window.clearTimeout(clearSelectedTaskTimeoutRef.current);
     }
     previewPositionStore.clear();
   }, [previewPositionStore]);
-  const handleTaskChange = (0, import_react17.useCallback)((updatedTasks) => {
+  const handleTaskChange = (0, import_react18.useCallback)((updatedTasks) => {
     const updatedTask = updatedTasks[0];
     if (!updatedTask) return;
     const originalTask = tasks.find((t) => t.id === updatedTask.id);
@@ -11384,7 +12461,7 @@ function TaskGanttChartInner(props, ref) {
     const cascadedTasks = disableConstraints ? [updatedTask] : universalCascade(updatedTask, newStart, newEnd, sourceTasks, businessDays, isCustomWeekend);
     onTasksChange?.(cascadedTasks);
   }, [tasks, onTasksChange, disableConstraints, editingTaskId, businessDays, isCustomWeekend]);
-  const handleDelete = (0, import_react17.useCallback)((taskId) => {
+  const handleDelete = (0, import_react18.useCallback)((taskId) => {
     const toDelete = /* @__PURE__ */ new Set([taskId]);
     function collectDescendants(parentId) {
       const children = getChildren(parentId, tasks);
@@ -11409,10 +12486,10 @@ function TaskGanttChartInner(props, ref) {
     }
     toDelete.forEach((id) => onDelete?.(id));
   }, [tasks, onTasksChange, onDelete]);
-  const handleInsertAfter = (0, import_react17.useCallback)((taskId, newTask) => {
+  const handleInsertAfter = (0, import_react18.useCallback)((taskId, newTask) => {
     onInsertAfter?.(taskId, newTask);
   }, [onInsertAfter]);
-  const handleReorder = (0, import_react17.useCallback)((reorderedTasks, movedTaskId, inferredParentId) => {
+  const handleReorder = (0, import_react18.useCallback)((reorderedTasks, movedTaskId, inferredParentId) => {
     let updated = reorderedTasks;
     if (movedTaskId) {
       updated = updated.map((t) => {
@@ -11429,7 +12506,7 @@ function TaskGanttChartInner(props, ref) {
     }
     onTasksChange?.(normalized);
   }, [onTasksChange, onReorder]);
-  const dependencyOverrides = (0, import_react17.useMemo)(() => {
+  const dependencyOverrides = (0, import_react18.useMemo)(() => {
     const map = new Map(cascadeOverrides);
     if (draggedTaskOverride) {
       map.set(draggedTaskOverride.taskId, {
@@ -11439,7 +12516,7 @@ function TaskGanttChartInner(props, ref) {
     }
     return map;
   }, [cascadeOverrides, draggedTaskOverride]);
-  const handleCascadeProgress = (0, import_react17.useCallback)((overrides, previewTasks = []) => {
+  const handleCascadeProgress = (0, import_react18.useCallback)((overrides, previewTasks = []) => {
     previewPositionStore.setPositions(overrides);
     const renderedTaskIds = renderedTaskIdsRef.current;
     const renderedOverrides = /* @__PURE__ */ new Map();
@@ -11454,26 +12531,26 @@ function TaskGanttChartInner(props, ref) {
       return arePreviewTaskMapsEqual(current, next) ? current : next;
     });
   }, [previewPositionStore]);
-  const previewNormalizedTasks = (0, import_react17.useMemo)(() => {
+  const previewNormalizedTasks = (0, import_react18.useMemo)(() => {
     if (previewTasksById.size === 0) return normalizedTasks;
     return normalizedTasks.map((task) => previewTasksById.get(task.id) ?? task);
   }, [normalizedTasks, previewTasksById]);
-  const previewVisibleTasks = (0, import_react17.useMemo)(() => {
+  const previewVisibleTasks = (0, import_react18.useMemo)(() => {
     if (previewTasksById.size === 0) return visibleTasks;
     return visibleTasks.map((task) => previewTasksById.get(task.id) ?? task);
   }, [visibleTasks, previewTasksById]);
-  const visibleTaskIndexMap = (0, import_react17.useMemo)(
+  const visibleTaskIndexMap = (0, import_react18.useMemo)(
     () => new Map(visibleTasks.map((task, index) => [task.id, index])),
     [visibleTasks]
   );
-  const forcedRenderedTaskIds = (0, import_react17.useMemo)(() => {
+  const forcedRenderedTaskIds = (0, import_react18.useMemo)(() => {
     const ids = /* @__PURE__ */ new Set();
     if (draggedTaskOverride) {
       ids.add(draggedTaskOverride.taskId);
     }
     return ids;
   }, [draggedTaskOverride]);
-  const visibleTaskWindowIndices = (0, import_react17.useMemo)(() => {
+  const visibleTaskWindowIndices = (0, import_react18.useMemo)(() => {
     const totalTasks = visibleTasks.length;
     if (totalTasks === 0) {
       return [];
@@ -11499,35 +12576,44 @@ function TaskGanttChartInner(props, ref) {
     }
     return Array.from(indices).sort((left, right) => left - right);
   }, [effectiveRowHeight, forcedRenderedTaskIds, scrollViewport, visibleTaskIndexMap, visibleTasks.length]);
-  const renderedChartTasks = (0, import_react17.useMemo)(
+  const visiblePlanFactDateIndices = (0, import_react18.useMemo)(() => {
+    if (!isPlanFactMode || dateRange.length === 0 || !planFactDateWindow) {
+      return void 0;
+    }
+    return Array.from(
+      { length: planFactDateWindow.end - planFactDateWindow.start + 1 },
+      (_, index) => planFactDateWindow.start + index
+    );
+  }, [dateRange.length, isPlanFactMode, planFactDateWindow]);
+  const renderedChartTasks = (0, import_react18.useMemo)(
     () => visibleTaskWindowIndices.map((index) => {
       const task = previewVisibleTasks[index];
       return task ? { index, task } : null;
     }).filter((entry) => entry !== null),
     [previewVisibleTasks, visibleTaskWindowIndices]
   );
-  const renderedDependencyTasks = (0, import_react17.useMemo)(
+  const renderedDependencyTasks = (0, import_react18.useMemo)(
     () => renderedChartTasks.map(({ task }) => task),
     [renderedChartTasks]
   );
-  renderedTaskIdsRef.current = (0, import_react17.useMemo)(
+  renderedTaskIdsRef.current = (0, import_react18.useMemo)(
     () => new Set(renderedChartTasks.map(({ task }) => task.id)),
     [renderedChartTasks]
   );
-  const handleCascade = (0, import_react17.useCallback)((cascadedTasks) => {
+  const handleCascade = (0, import_react18.useCallback)((cascadedTasks) => {
     onTasksChange?.(cascadedTasks);
   }, [tasks, onTasksChange]);
-  const handleTaskSelect = (0, import_react17.useCallback)((taskId) => {
+  const handleTaskSelect = (0, import_react18.useCallback)((taskId) => {
     setSelectedTaskId(taskId);
   }, []);
-  const hoveredRowElementsRef = (0, import_react17.useRef)([]);
-  const clearHoveredRows = (0, import_react17.useCallback)(() => {
+  const hoveredRowElementsRef = (0, import_react18.useRef)([]);
+  const clearHoveredRows = (0, import_react18.useCallback)(() => {
     for (const element of hoveredRowElementsRef.current) {
-      element.classList.remove("gantt-tl-row-hovered", "gantt-tr-row-hovered", "gantt-mx-row-hovered");
+      element.classList.remove("gantt-tl-row-hovered", "gantt-tr-row-hovered", "gantt-mx-row-hovered", "gantt-pf-row-hovered");
     }
     hoveredRowElementsRef.current = [];
   }, []);
-  const applyHoveredRows = (0, import_react17.useCallback)((taskId) => {
+  const applyHoveredRows = (0, import_react18.useCallback)((taskId) => {
     const root = scrollContentRef.current;
     if (!root) return;
     clearHoveredRows();
@@ -11544,10 +12630,13 @@ function TaskGanttChartInner(props, ref) {
       if (element.classList.contains("gantt-mx-row")) {
         element.classList.add("gantt-mx-row-hovered");
       }
+      if (element.classList.contains("gantt-pf-row")) {
+        element.classList.add("gantt-pf-row-hovered");
+      }
     }
     hoveredRowElementsRef.current = nextHoveredRows;
   }, [clearHoveredRows]);
-  const handleSharedRowHover = (0, import_react17.useCallback)((event) => {
+  const handleSharedRowHover = (0, import_react18.useCallback)((event) => {
     const target = event.target;
     const row = target.closest("[data-gantt-task-row-id]");
     const taskId = row?.dataset.ganttTaskRowId;
@@ -11557,7 +12646,7 @@ function TaskGanttChartInner(props, ref) {
     }
     applyHoveredRows(taskId);
   }, [applyHoveredRows]);
-  const handleToggleCollapse = externalOnToggleCollapse ?? (0, import_react17.useCallback)((parentId) => {
+  const handleToggleCollapse = externalOnToggleCollapse ?? (0, import_react18.useCallback)((parentId) => {
     setInternalCollapsedParentIds((prev) => {
       const next = new Set(prev);
       if (next.has(parentId)) {
@@ -11568,20 +12657,20 @@ function TaskGanttChartInner(props, ref) {
       return next;
     });
   }, []);
-  const allParentIds = (0, import_react17.useMemo)(() => {
+  const allParentIds = (0, import_react18.useMemo)(() => {
     return new Set(
       normalizedTasks.filter((t) => isTaskParent(t.id, normalizedTasks)).map((t) => t.id)
     );
   }, [normalizedTasks]);
-  const handleCollapseAll = (0, import_react17.useCallback)(() => {
+  const handleCollapseAll = (0, import_react18.useCallback)(() => {
     if (externalCollapsedParentIds) return;
     setInternalCollapsedParentIds(allParentIds);
   }, [allParentIds, externalCollapsedParentIds]);
-  const handleExpandAll = (0, import_react17.useCallback)(() => {
+  const handleExpandAll = (0, import_react18.useCallback)(() => {
     if (externalCollapsedParentIds) return;
     setInternalCollapsedParentIds(/* @__PURE__ */ new Set());
   }, [externalCollapsedParentIds]);
-  const exportToPdf = (0, import_react17.useCallback)(async (options) => {
+  const exportToPdf = (0, import_react18.useCallback)(async (options) => {
     const sourceContainer = containerRef.current;
     const sourceContent = scrollContentRef.current;
     if (!sourceContainer || !sourceContent || typeof window === "undefined" || typeof document === "undefined") {
@@ -11617,7 +12706,7 @@ function TaskGanttChartInner(props, ref) {
       orientation: options?.orientation
     });
   }, [showTaskList, showChart]);
-  (0, import_react17.useImperativeHandle)(
+  (0, import_react18.useImperativeHandle)(
     ref,
     () => ({
       scrollToToday,
@@ -11640,7 +12729,7 @@ function TaskGanttChartInner(props, ref) {
     }
     return depth;
   }
-  const handlePromoteTask = (0, import_react17.useCallback)((taskId) => {
+  const handlePromoteTask = (0, import_react18.useCallback)((taskId) => {
     if (onPromoteTask) {
       onPromoteTask(taskId);
       return;
@@ -11672,7 +12761,7 @@ function TaskGanttChartInner(props, ref) {
     ]);
     onTasksChange?.(reorderedTasks);
   }, [tasks, onTasksChange, onPromoteTask]);
-  const handleDemoteTask = (0, import_react17.useCallback)((taskId, newParentId) => {
+  const handleDemoteTask = (0, import_react18.useCallback)((taskId, newParentId) => {
     if (onDemoteTask) {
       onDemoteTask(taskId, newParentId);
       return;
@@ -11713,7 +12802,7 @@ function TaskGanttChartInner(props, ref) {
     };
     onTasksChange?.([updatedDemotedTask]);
   }, [tasks, onTasksChange, onDemoteTask]);
-  const handleUngroupTask = (0, import_react17.useCallback)((taskId) => {
+  const handleUngroupTask = (0, import_react18.useCallback)((taskId) => {
     if (onUngroupTask) {
       onUngroupTask(taskId);
       return;
@@ -11738,8 +12827,8 @@ function TaskGanttChartInner(props, ref) {
       onTasksChange?.(changedTasks);
     }
   }, [tasks, onTasksChange, onUngroupTask]);
-  const panStateRef = (0, import_react17.useRef)(null);
-  const handlePanStart = (0, import_react17.useCallback)((e) => {
+  const panStateRef = (0, import_react18.useRef)(null);
+  const handlePanStart = (0, import_react18.useCallback)((e) => {
     if (e.button !== 0) return;
     const target = e.target;
     if (target.closest("[data-taskbar]")) return;
@@ -11752,7 +12841,10 @@ function TaskGanttChartInner(props, ref) {
       startX: e.clientX,
       startY: e.clientY,
       scrollX: container.scrollLeft,
-      scrollY: container.scrollTop
+      scrollY: container.scrollTop,
+      currentX: e.clientX,
+      currentY: e.clientY,
+      frameId: null
     };
     if (document.activeElement instanceof HTMLElement) {
       document.activeElement.blur();
@@ -11760,17 +12852,38 @@ function TaskGanttChartInner(props, ref) {
     container.style.cursor = "grabbing";
     e.preventDefault();
   }, []);
-  (0, import_react17.useEffect)(() => {
-    const handlePanMove = (e) => {
+  (0, import_react18.useEffect)(() => {
+    const flushPanMove = () => {
       const pan = panStateRef.current;
       if (!pan?.active) return;
+      pan.frameId = null;
       const container = scrollContainerRef.current;
       if (!container) return;
-      container.scrollLeft = pan.scrollX - (e.clientX - pan.startX);
-      container.scrollTop = pan.scrollY - (e.clientY - pan.startY);
+      const maxScrollLeft = Math.max(0, container.scrollWidth - container.clientWidth);
+      const maxScrollTop = Math.max(0, container.scrollHeight - container.clientHeight);
+      const nextScrollLeft = clampScrollValue(pan.scrollX - (pan.currentX - pan.startX), maxScrollLeft);
+      const nextScrollTop = clampScrollValue(pan.scrollY - (pan.currentY - pan.startY), maxScrollTop);
+      if (Math.abs(container.scrollLeft - nextScrollLeft) > 0.5) {
+        container.scrollLeft = nextScrollLeft;
+      }
+      if (Math.abs(container.scrollTop - nextScrollTop) > 0.5) {
+        container.scrollTop = nextScrollTop;
+      }
+    };
+    const handlePanMove = (e) => {
+      const pan = panStateRef.current;
+      if (!pan?.active) return;
+      pan.currentX = e.clientX;
+      pan.currentY = e.clientY;
+      if (pan.frameId !== null) return;
+      pan.frameId = window.requestAnimationFrame(flushPanMove);
     };
     const handlePanEnd = () => {
-      if (!panStateRef.current?.active) return;
+      const pan = panStateRef.current;
+      if (!pan?.active) return;
+      if (pan.frameId !== null) {
+        window.cancelAnimationFrame(pan.frameId);
+      }
       panStateRef.current = null;
       const container = scrollContainerRef.current;
       if (container) container.style.cursor = "";
@@ -11782,19 +12895,19 @@ function TaskGanttChartInner(props, ref) {
       window.removeEventListener("mouseup", handlePanEnd);
     };
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "div",
     {
       ref: containerRef,
-      className: isTableMatrixMode ? "gantt-container gantt-container-tableMatrix" : "gantt-container",
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      className: isTableMatrixMode ? "gantt-container gantt-container-tableMatrix" : isPlanFactMode ? "gantt-container gantt-container-planFact" : "gantt-container",
+      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "div",
         {
           ref: scrollContainerRef,
           className: "gantt-scrollContainer",
           style: { height: containerHeight ?? "auto", cursor: "grab" },
           onMouseDown: handlePanStart,
-          children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
             "div",
             {
               ref: scrollContentRef,
@@ -11802,7 +12915,7 @@ function TaskGanttChartInner(props, ref) {
               onMouseOver: handleSharedRowHover,
               onMouseLeave: clearHoveredRows,
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   TaskList,
                   {
                     tasks: normalizedTasks,
@@ -11855,17 +12968,17 @@ function TaskGanttChartInner(props, ref) {
                     visibleRowIndices: visibleTaskWindowIndices
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   "div",
                   {
-                    className: isTableMatrixMode || showChart ? "gantt-chartSurface" : "gantt-chartSurface gantt-chart-hidden",
+                    className: isTableMatrixMode || isPlanFactMode || showChart ? "gantt-chartSurface" : "gantt-chartSurface gantt-chart-hidden",
                     style: {
-                      minWidth: isTableMatrixMode ? matrixWidth !== void 0 ? `${matrixWidth}px` : void 0 : `${gridWidth}px`,
-                      width: isTableMatrixMode ? matrixWidth !== void 0 ? `${matrixWidth}px` : "max-content" : void 0,
-                      flex: isTableMatrixMode ? "0 0 auto" : 1,
-                      display: isTableMatrixMode || showChart ? void 0 : "none"
+                      minWidth: isTableMatrixMode ? matrixWidth !== void 0 ? `${matrixWidth}px` : void 0 : isPlanFactMode ? `${gridWidth}px` : `${gridWidth}px`,
+                      width: isTableMatrixMode ? matrixWidth !== void 0 ? `${matrixWidth}px` : "max-content" : isPlanFactMode ? `${gridWidth}px` : void 0,
+                      flex: isTableMatrixMode || isPlanFactMode ? "0 0 auto" : 1,
+                      display: isTableMatrixMode || isPlanFactMode || showChart ? void 0 : "none"
                     },
-                    children: isTableMatrixMode ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                    children: isTableMatrixMode ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                       TableMatrix,
                       {
                         tasks: visibleTasks,
@@ -11882,14 +12995,34 @@ function TaskGanttChartInner(props, ref) {
                         highlightedTaskIds: taskListHighlightedTaskIds,
                         filterMode
                       }
-                    ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+                    ) : isPlanFactMode ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                      PlanFactMatrix,
+                      {
+                        tasks: visibleTasks,
+                        allTasks: normalizedTasks,
+                        dateRange,
+                        dayWidth,
+                        rowHeight: effectiveRowHeight,
+                        headerHeight: timelineHeaderHeight,
+                        bodyMinHeight: tableBodyMinHeight,
+                        selectedTaskId,
+                        onTaskSelect: handleTaskSelect,
+                        onTasksChange: handleTaskChange,
+                        onCellCommit: onPlanFactCellCommit,
+                        highlightedTaskIds: taskListHighlightedTaskIds,
+                        filterMode,
+                        visibleRowIndices: visibleTaskWindowIndices,
+                        visibleDateIndices: visiblePlanFactDateIndices,
+                        todayDateIndex: todayInRange ? todayIndex : void 0
+                      }
+                    ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                         "div",
                         {
                           className: "gantt-stickyHeader",
                           style: { width: `${gridWidth}px`, height: `${timelineHeaderHeight}px` },
                           children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               TimeScaleHeader_default,
                               {
                                 days: dateRange,
@@ -11902,7 +13035,7 @@ function TaskGanttChartInner(props, ref) {
                                 onTimelineHoverEnd: () => setActiveTimelineTooltip(null)
                               }
                             ),
-                            activeTimelineTooltip && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "gantt-timelineTooltipLayer", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            activeTimelineTooltip && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "gantt-timelineTooltipLayer", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               "div",
                               {
                                 className: "gantt-timelineTooltip",
@@ -11916,7 +13049,7 @@ function TaskGanttChartInner(props, ref) {
                           ]
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+                      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                         "div",
                         {
                           className: "gantt-taskArea",
@@ -11926,7 +13059,7 @@ function TaskGanttChartInner(props, ref) {
                             height: `${totalGridHeight}px`
                           },
                           children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               GridBackground_default,
                               {
                                 dateRange,
@@ -11936,7 +13069,7 @@ function TaskGanttChartInner(props, ref) {
                                 isCustomWeekend
                               }
                             ),
-                            todayInRange && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            todayInRange && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               TodayIndicator_default,
                               {
                                 monthStart,
@@ -11945,7 +13078,7 @@ function TaskGanttChartInner(props, ref) {
                                 onHoverEnd: () => setActiveTimelineTooltip(null)
                               }
                             ),
-                            visibleTimelineMarkers.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            visibleTimelineMarkers.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               TimelineMarkers_default,
                               {
                                 rangeStart: monthStart,
@@ -11956,7 +13089,7 @@ function TaskGanttChartInner(props, ref) {
                                 onHoverEnd: () => setActiveTimelineTooltip(null)
                               }
                             ),
-                            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               DependencyLines_default,
                               {
                                 tasks: renderedDependencyTasks,
@@ -11974,7 +13107,7 @@ function TaskGanttChartInner(props, ref) {
                                 weekendPredicate: isCustomWeekend
                               }
                             ),
-                            dragGuideLines && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            dragGuideLines && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               DragGuideLines_default,
                               {
                                 isDragging: dragGuideLines.isDragging,
@@ -11984,7 +13117,7 @@ function TaskGanttChartInner(props, ref) {
                                 totalHeight: totalGridHeight
                               }
                             ),
-                            renderedChartTasks.map(({ task, index }) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                            renderedChartTasks.map(({ task, index }) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                               "div",
                               {
                                 style: {
@@ -11994,7 +13127,7 @@ function TaskGanttChartInner(props, ref) {
                                   right: 0,
                                   height: `${effectiveRowHeight}px`
                                 },
-                                children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                                children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                                   TaskRow_default,
                                   {
                                     task,
@@ -12045,14 +13178,14 @@ function TaskGanttChartInner(props, ref) {
     }
   );
 }
-var TaskGanttChart = (0, import_react17.forwardRef)(TaskGanttChartInner);
-var GanttChart = (0, import_react17.forwardRef)(GanttChartInner);
+var TaskGanttChart = (0, import_react18.forwardRef)(TaskGanttChartInner);
+var GanttChart = (0, import_react18.forwardRef)(GanttChartInner);
 GanttChart.displayName = "GanttChart";
 
 // src/components/ui/Button.tsx
-var import_react18 = __toESM(require("react"));
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var Button = import_react18.default.forwardRef(
+var import_react19 = __toESM(require("react"));
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var Button = import_react19.default.forwardRef(
   ({ className, variant = "default", size = "default", children, ...props }, ref) => {
     const classes = [
       "gantt-btn",
@@ -12060,7 +13193,7 @@ var Button = import_react18.default.forwardRef(
       size !== "default" ? `gantt-btn-${size}` : "",
       className || ""
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { ref, className: classes, ...props, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { ref, className: classes, ...props, children });
   }
 );
 Button.displayName = "Button";
@@ -12108,6 +13241,7 @@ var nameContains = (substring, caseSensitive = false) => (task) => {
   GanttChart,
   GridBackground,
   Input,
+  PlanFactMatrix,
   Popover,
   PopoverContent,
   PopoverTrigger,