gantt-lib 0.62.0 → 0.64.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -4550,12 +4550,11 @@ var TaskListRow = React9.memo(
4550
4550
  }, [editingTaskId, task.id, disableTaskNameEditing]);
4551
4551
  const handleNameClick = useCallback4(
4552
4552
  (e) => {
4553
- if (disableTaskNameEditing) return;
4554
4553
  e.stopPropagation();
4555
4554
  onRowClick?.(task.id);
4556
4555
  onScrollToTask?.(task.id);
4557
4556
  },
4558
- [task.id, disableTaskNameEditing, onRowClick, onScrollToTask]
4557
+ [task.id, onRowClick, onScrollToTask]
4559
4558
  );
4560
4559
  const handleNameDoubleClick = useCallback4(
4561
4560
  (e) => {
@@ -5342,7 +5341,8 @@ var TaskListRow = React9.memo(
5342
5341
  id: crypto.randomUUID(),
5343
5342
  name: "\u041D\u043E\u0432\u0430\u044F \u0437\u0430\u0434\u0430\u0447\u0430",
5344
5343
  startDate: todayISO,
5345
- endDate: endISO
5344
+ endDate: endISO,
5345
+ parentId: task.parentId
5346
5346
  };
5347
5347
  onInsertAfter(task.id, newTask);
5348
5348
  },
@@ -5910,10 +5910,17 @@ TaskListRow.displayName = "TaskListRow";
5910
5910
  // src/components/TaskList/NewTaskRow.tsx
5911
5911
  import { useState as useState5, useRef as useRef5, useEffect as useEffect5 } from "react";
5912
5912
  import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
5913
- var NewTaskRow = ({ rowHeight, onConfirm, onCancel }) => {
5913
+ var NewTaskRow = ({
5914
+ rowHeight,
5915
+ onConfirm,
5916
+ onCancel,
5917
+ nestingDepth = 0
5918
+ }) => {
5914
5919
  const [nameValue, setNameValue] = useState5("");
5915
5920
  const inputRef = useRef5(null);
5916
5921
  const confirmedRef = useRef5(false);
5922
+ const inputInnerPadding = 4;
5923
+ const levelOffset = nestingDepth > 0 ? nestingDepth * 20 + 8 : 0;
5917
5924
  useEffect5(() => {
5918
5925
  if (inputRef.current) {
5919
5926
  inputRef.current.focus();
@@ -5952,7 +5959,12 @@ var NewTaskRow = ({ rowHeight, onConfirm, onCancel }) => {
5952
5959
  onKeyDown: handleKeyDown,
5953
5960
  onBlur: handleBlur,
5954
5961
  placeholder: "\u041D\u0430\u0437\u0432\u0430\u043D\u0438\u0435",
5955
- className: "gantt-tl-name-input"
5962
+ className: "gantt-tl-name-input",
5963
+ style: {
5964
+ left: `${Math.max(0, levelOffset - inputInnerPadding)}px`,
5965
+ width: levelOffset > 0 ? `calc(100% - ${Math.max(0, levelOffset - inputInnerPadding)}px)` : "100%",
5966
+ paddingLeft: `${inputInnerPadding}px`
5967
+ }
5956
5968
  }
5957
5969
  ) }),
5958
5970
  /* @__PURE__ */ jsx13("div", { className: "gantt-tl-cell" }),
@@ -6376,6 +6388,7 @@ var TaskList = ({
6376
6388
  onTasksChange?.([{ ...task, dependencies: updatedDeps }]);
6377
6389
  }, [tasks, onTasksChange]);
6378
6390
  const [isCreating, setIsCreating] = useState6(false);
6391
+ const [pendingInsert, setPendingInsert] = useState6(null);
6379
6392
  const [draggingIndex, setDraggingIndex] = useState6(null);
6380
6393
  const [dragOverIndex, setDragOverIndex] = useState6(null);
6381
6394
  const dragOriginIndexRef = useRef6(null);
@@ -6534,6 +6547,81 @@ var TaskList = ({
6534
6547
  setIsCreating(false);
6535
6548
  }, [onAdd]);
6536
6549
  const handleCancelNewTask = useCallback5(() => setIsCreating(false), []);
6550
+ const findInsertAfterTaskId = useCallback5((anchorTaskId) => {
6551
+ const anchorIndex = orderedTasks.findIndex((task) => task.id === anchorTaskId);
6552
+ if (anchorIndex === -1) {
6553
+ return anchorTaskId;
6554
+ }
6555
+ const taskById = new Map(orderedTasks.map((task) => [task.id, task]));
6556
+ let insertAfterTaskId = anchorTaskId;
6557
+ for (let index = anchorIndex + 1; index < orderedTasks.length; index += 1) {
6558
+ let currentParentId = orderedTasks[index]?.parentId;
6559
+ let isDescendant = false;
6560
+ while (currentParentId) {
6561
+ if (currentParentId === anchorTaskId) {
6562
+ isDescendant = true;
6563
+ break;
6564
+ }
6565
+ currentParentId = taskById.get(currentParentId)?.parentId;
6566
+ }
6567
+ if (!isDescendant) {
6568
+ break;
6569
+ }
6570
+ insertAfterTaskId = orderedTasks[index].id;
6571
+ }
6572
+ return insertAfterTaskId;
6573
+ }, [orderedTasks]);
6574
+ const pendingInsertDisplayTaskId = useMemo8(() => {
6575
+ if (!pendingInsert) {
6576
+ return null;
6577
+ }
6578
+ const taskById = new Map(visibleTasks.map((task) => [task.id, task]));
6579
+ if (!taskById.has(pendingInsert.anchorTaskId)) {
6580
+ return null;
6581
+ }
6582
+ let displayTaskId = pendingInsert.anchorTaskId;
6583
+ for (const task of visibleTasks) {
6584
+ let currentParentId = task.parentId;
6585
+ while (currentParentId) {
6586
+ if (currentParentId === pendingInsert.anchorTaskId) {
6587
+ displayTaskId = task.id;
6588
+ break;
6589
+ }
6590
+ currentParentId = taskById.get(currentParentId)?.parentId;
6591
+ }
6592
+ }
6593
+ return displayTaskId;
6594
+ }, [pendingInsert, visibleTasks]);
6595
+ const handleStartInsertAfter = useCallback5((taskId, newTask) => {
6596
+ const anchorTask = orderedTasks.find((task) => task.id === taskId);
6597
+ if (!anchorTask) {
6598
+ return;
6599
+ }
6600
+ setIsCreating(false);
6601
+ setPendingInsert({
6602
+ anchorTaskId: taskId,
6603
+ insertAfterTaskId: findInsertAfterTaskId(taskId),
6604
+ parentId: anchorTask.parentId,
6605
+ startDate: newTask.startDate,
6606
+ endDate: newTask.endDate,
6607
+ nestingDepth: nestingDepthMap.get(taskId) ?? 0
6608
+ });
6609
+ }, [findInsertAfterTaskId, nestingDepthMap, orderedTasks]);
6610
+ const handleConfirmInsertedTask = useCallback5((name) => {
6611
+ if (!pendingInsert) {
6612
+ return;
6613
+ }
6614
+ const newTask = {
6615
+ id: crypto.randomUUID(),
6616
+ name,
6617
+ startDate: pendingInsert.startDate,
6618
+ endDate: pendingInsert.endDate,
6619
+ parentId: pendingInsert.parentId
6620
+ };
6621
+ onInsertAfter?.(pendingInsert.insertAfterTaskId, newTask);
6622
+ setPendingInsert(null);
6623
+ }, [onInsertAfter, pendingInsert]);
6624
+ const handleCancelInsertedTask = useCallback5(() => setPendingInsert(null), []);
6537
6625
  function getTaskDepth(task, tasks2) {
6538
6626
  if (!task) return 0;
6539
6627
  let depth = 0;
@@ -6673,73 +6761,87 @@ var TaskList = ({
6673
6761
  /* @__PURE__ */ jsx14("div", { className: "gantt-tl-body", style: { height: `${totalHeight}px` }, children: visibleTasks.map((task, index) => {
6674
6762
  const previousVisibleTask = index > 0 ? visibleTasks[index - 1] : void 0;
6675
6763
  const canDemoteTask = index === 0 || !task.parentId || previousVisibleTask?.id !== task.parentId;
6676
- return /* @__PURE__ */ jsx14(
6677
- TaskListRow,
6678
- {
6679
- task,
6680
- rowIndex: index,
6681
- taskNumber: originalTaskNumberMap[task.id] || "",
6682
- taskNumberMap: originalTaskNumberMap,
6683
- rowHeight,
6684
- onTasksChange,
6685
- selectedTaskId,
6686
- onRowClick: handleRowClick,
6687
- disableTaskNameEditing,
6688
- disableDependencyEditing,
6689
- allTasks: tasks,
6690
- activeLinkType,
6691
- onSetActiveLinkType: setActiveLinkType,
6692
- selectingPredecessorFor,
6693
- dependencyPickMode,
6694
- onSetDependencyPickMode: setDependencyPickMode,
6695
- onSetSelectingPredecessorFor: setSelectingPredecessorFor,
6696
- onAddDependency: handleAddDependency,
6697
- onRemoveDependency: handleRemoveDependency,
6698
- selectedChip,
6699
- onChipSelect: handleChipSelect,
6700
- onScrollToTask,
6701
- onDelete,
6702
- onAdd,
6703
- onInsertAfter,
6704
- editingTaskId: propEditingTaskId,
6705
- isDragging: draggingIndex === index,
6706
- isDragOver: dragOverIndex === index,
6707
- onDragStart: handleDragStart,
6708
- onDragOver: handleDragOver,
6709
- onDrop: handleDrop,
6710
- onDragEnd: handleDragEnd,
6711
- collapsedParentIds,
6712
- onToggleCollapse: handleToggleCollapse,
6713
- onPromoteTask,
6714
- onDemoteTask: onDemoteTask ? handleDemoteWrapper : void 0,
6715
- onDuplicateTask: onReorder ? handleDuplicateTask : void 0,
6716
- canDemoteTask,
6717
- isLastChild: lastChildIds.has(task.id),
6718
- nestingDepth: nestingDepthMap.get(task.id) ?? 0,
6719
- ancestorContinues: ancestorContinuesMap.get(task.id) ?? [],
6720
- customDays,
6721
- isWeekend: isWeekend3,
6722
- businessDays,
6723
- isFilterMatch: filterMode === "highlight" ? highlightedTaskIds.has(task.id) : false,
6724
- isFilterHideMode: filterMode === "hide" && isFilterActive,
6725
- resolvedColumns
6726
- },
6727
- task.id
6728
- );
6764
+ return /* @__PURE__ */ jsxs11(React11.Fragment, { children: [
6765
+ /* @__PURE__ */ jsx14(
6766
+ TaskListRow,
6767
+ {
6768
+ task,
6769
+ rowIndex: index,
6770
+ taskNumber: originalTaskNumberMap[task.id] || "",
6771
+ taskNumberMap: originalTaskNumberMap,
6772
+ rowHeight,
6773
+ onTasksChange,
6774
+ selectedTaskId,
6775
+ onRowClick: handleRowClick,
6776
+ disableTaskNameEditing,
6777
+ disableDependencyEditing,
6778
+ allTasks: tasks,
6779
+ activeLinkType,
6780
+ onSetActiveLinkType: setActiveLinkType,
6781
+ selectingPredecessorFor,
6782
+ dependencyPickMode,
6783
+ onSetDependencyPickMode: setDependencyPickMode,
6784
+ onSetSelectingPredecessorFor: setSelectingPredecessorFor,
6785
+ onAddDependency: handleAddDependency,
6786
+ onRemoveDependency: handleRemoveDependency,
6787
+ selectedChip,
6788
+ onChipSelect: handleChipSelect,
6789
+ onScrollToTask,
6790
+ onDelete,
6791
+ onAdd,
6792
+ onInsertAfter: handleStartInsertAfter,
6793
+ editingTaskId: propEditingTaskId,
6794
+ isDragging: draggingIndex === index,
6795
+ isDragOver: dragOverIndex === index,
6796
+ onDragStart: handleDragStart,
6797
+ onDragOver: handleDragOver,
6798
+ onDrop: handleDrop,
6799
+ onDragEnd: handleDragEnd,
6800
+ collapsedParentIds,
6801
+ onToggleCollapse: handleToggleCollapse,
6802
+ onPromoteTask,
6803
+ onDemoteTask: onDemoteTask ? handleDemoteWrapper : void 0,
6804
+ onDuplicateTask: onReorder ? handleDuplicateTask : void 0,
6805
+ canDemoteTask,
6806
+ isLastChild: lastChildIds.has(task.id),
6807
+ nestingDepth: nestingDepthMap.get(task.id) ?? 0,
6808
+ ancestorContinues: ancestorContinuesMap.get(task.id) ?? [],
6809
+ customDays,
6810
+ isWeekend: isWeekend3,
6811
+ businessDays,
6812
+ isFilterMatch: filterMode === "highlight" ? highlightedTaskIds.has(task.id) : false,
6813
+ isFilterHideMode: filterMode === "hide" && isFilterActive,
6814
+ resolvedColumns
6815
+ }
6816
+ ),
6817
+ pendingInsertDisplayTaskId === task.id && /* @__PURE__ */ jsx14(
6818
+ NewTaskRow,
6819
+ {
6820
+ rowHeight,
6821
+ onConfirm: handleConfirmInsertedTask,
6822
+ onCancel: handleCancelInsertedTask,
6823
+ nestingDepth: pendingInsert?.nestingDepth ?? 0
6824
+ }
6825
+ )
6826
+ ] }, task.id);
6729
6827
  }) }),
6730
- isCreating && /* @__PURE__ */ jsx14(
6828
+ isCreating && !pendingInsert && /* @__PURE__ */ jsx14(
6731
6829
  NewTaskRow,
6732
6830
  {
6733
6831
  rowHeight,
6734
6832
  onConfirm: handleConfirmNewTask,
6735
- onCancel: handleCancelNewTask
6833
+ onCancel: handleCancelNewTask,
6834
+ nestingDepth: 0
6736
6835
  }
6737
6836
  ),
6738
- enableAddTask && onAdd && !isCreating && /* @__PURE__ */ jsx14(
6837
+ enableAddTask && onAdd && !isCreating && !pendingInsert && /* @__PURE__ */ jsx14(
6739
6838
  "button",
6740
6839
  {
6741
6840
  className: `gantt-tl-add-btn${dragOverIndex === visibleTasks.length ? " gantt-tl-add-btn-drag-over" : ""}`,
6742
- onClick: () => setIsCreating(true),
6841
+ onClick: () => {
6842
+ setPendingInsert(null);
6843
+ setIsCreating(true);
6844
+ },
6743
6845
  onDragEnter: (e) => {
6744
6846
  e.preventDefault();
6745
6847
  setDragOverIndex(visibleTasks.length);
@@ -6881,7 +6983,7 @@ function GanttChartInner(props, ref) {
6881
6983
  if (todayIndex === -1) return;
6882
6984
  const todayOffset = todayIndex * dayWidth;
6883
6985
  const containerWidth = container.clientWidth;
6884
- const scrollLeft = Math.round(todayOffset - containerWidth / 2 + dayWidth / 2);
6986
+ const scrollLeft = Math.round(todayOffset + dayWidth / 2 - containerWidth * 0.3);
6885
6987
  container.scrollLeft = Math.max(0, scrollLeft);
6886
6988
  }, []);
6887
6989
  useEffect7(() => {
@@ -6905,7 +7007,7 @@ function GanttChartInner(props, ref) {
6905
7007
  if (todayIndex === -1) return;
6906
7008
  const todayOffset = todayIndex * dayWidth;
6907
7009
  const containerWidth = container.clientWidth;
6908
- const scrollLeft = Math.round(todayOffset - containerWidth / 2 + dayWidth / 2);
7010
+ const scrollLeft = Math.round(todayOffset + dayWidth / 2 - containerWidth * 0.3);
6909
7011
  container.scrollTo({ left: Math.max(0, scrollLeft), behavior: "smooth" });
6910
7012
  }, [dateRange, dayWidth]);
6911
7013
  const scrollToTask = useCallback6((taskId) => {
@@ -7016,7 +7118,6 @@ function GanttChartInner(props, ref) {
7016
7118
  toDelete.forEach((id) => onDelete?.(id));
7017
7119
  }, [tasks, onTasksChange, onDelete]);
7018
7120
  const handleInsertAfter = useCallback6((taskId, newTask) => {
7019
- setEditingTaskId(newTask.id);
7020
7121
  onInsertAfter?.(taskId, newTask);
7021
7122
  }, [onInsertAfter]);
7022
7123
  const handleReorder = useCallback6((reorderedTasks, movedTaskId, inferredParentId) => {