gantt-task-react-powern 0.4.67 → 0.4.68

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.
@@ -274,6 +274,9 @@ var getWeekNumberISO8601 = function getWeekNumberISO8601(date) {
274
274
  return weekNumber;
275
275
  }
276
276
  };
277
+ var getDaysInMonth = function getDaysInMonth(month, year) {
278
+ return new Date(year, month + 1, 0).getDate();
279
+ };
277
280
 
278
281
  var styles = {"ganttTable":"_3_ygE","ganttTable_Header":"_1nBOt","ganttTable_HeaderSeparator":"_2eZzQ","ganttTable_HeaderItem":"_WuQ0f"};
279
282
 
@@ -281,8 +284,7 @@ var TaskListHeaderDefault = function TaskListHeaderDefault(_ref) {
281
284
  var headerHeight = _ref.headerHeight,
282
285
  fontFamily = _ref.fontFamily,
283
286
  fontSize = _ref.fontSize,
284
- rowWidth = _ref.rowWidth,
285
- scheduleType = _ref.scheduleType;
287
+ rowWidth = _ref.rowWidth;
286
288
  return React.createElement("div", {
287
289
  className: styles.ganttTable,
288
290
  style: {
@@ -309,8 +311,8 @@ var TaskListHeaderDefault = function TaskListHeaderDefault(_ref) {
309
311
  }), React.createElement("div", {
310
312
  className: styles.ganttTable_HeaderItem,
311
313
  style: {
312
- minWidth: parseInt(rowWidth) * 2,
313
- maxWidth: parseInt(rowWidth) * 2
314
+ minWidth: parseInt(rowWidth) * 1.8,
315
+ maxWidth: parseInt(rowWidth) * 1.8
314
316
  }
315
317
  }, "Task"), React.createElement("div", {
316
318
  className: styles.ganttTable_HeaderSeparator,
@@ -321,7 +323,7 @@ var TaskListHeaderDefault = function TaskListHeaderDefault(_ref) {
321
323
  }), React.createElement("div", {
322
324
  className: styles.ganttTable_HeaderItem,
323
325
  style: {
324
- minWidth: parseInt(rowWidth) * 0.6
326
+ minWidth: parseInt(rowWidth) * 0.7
325
327
  },
326
328
  title: "Planned Start"
327
329
  }, "Planned Start"), React.createElement("div", {
@@ -333,31 +335,13 @@ var TaskListHeaderDefault = function TaskListHeaderDefault(_ref) {
333
335
  }), React.createElement("div", {
334
336
  className: styles.ganttTable_HeaderItem,
335
337
  style: {
336
- minWidth: parseInt(rowWidth) * 0.6
338
+ minWidth: parseInt(rowWidth) * 0.7
337
339
  },
338
340
  title: "Planned End"
339
- }, "Planned End"), scheduleType === "lookAhead" && React.createElement("div", {
340
- className: styles.ganttTable_HeaderItem,
341
- style: {
342
- minWidth: parseInt(rowWidth) * 0.6
343
- },
344
- title: "Planned Start"
345
- }, "Actual Start"), scheduleType === "lookAhead" && React.createElement("div", {
346
- className: styles.ganttTable_HeaderSeparator,
347
- style: {
348
- height: headerHeight * 0.5,
349
- marginTop: headerHeight * 0.25
350
- }
351
- }), scheduleType === "lookAhead" && React.createElement("div", {
352
- className: styles.ganttTable_HeaderItem,
353
- style: {
354
- minWidth: parseInt(rowWidth) * 0.6
355
- },
356
- title: "Planned End"
357
- }, "Actual End")));
341
+ }, "Planned End")));
358
342
  };
359
343
 
360
- var styles$1 = {"taskListWrapper":"_3ZbQT","taskListTableRow":"_34SS0","taskListLookAheadRow":"_GzvG4","taskListMilestoneRow":"_3Ykml","taskListCell":"_3lLk3","taskListNameWrapper":"_nI1Xw","taskListExpander":"_2QjE6","taskListExpanderPlaceholder":"_1fnLB","taskListEmptyExpander":"_2TfEi","taskListText":"_2ZvXU"};
344
+ var styles$1 = {"taskListWrapper":"_3ZbQT","taskListTableRow":"_34SS0","taskListCell":"_3lLk3","taskListNameWrapper":"_nI1Xw","taskListExpander":"_2QjE6","taskListExpanderPlaceholder":"_1fnLB","taskListEmptyExpander":"_2TfEi","taskListText":"_2ZvXU"};
361
345
 
362
346
  var localeDateStringCache = {};
363
347
 
@@ -385,7 +369,6 @@ var TaskListTableDefault = function TaskListTableDefault(_ref) {
385
369
  var rowHeight = _ref.rowHeight,
386
370
  rowWidth = _ref.rowWidth,
387
371
  tasks = _ref.tasks,
388
- scheduleType = _ref.scheduleType,
389
372
  leafTasks = _ref.leafTasks,
390
373
  fontFamily = _ref.fontFamily,
391
374
  fontSize = _ref.fontSize,
@@ -421,7 +404,7 @@ var TaskListTableDefault = function TaskListTableDefault(_ref) {
421
404
  }
422
405
 
423
406
  return React.createElement("div", {
424
- className: t.type === "milestone" ? styles$1.taskListMilestoneRow : scheduleType === "lookAhead" ? styles$1.taskListLookAheadRow : styles$1.taskListTableRow,
407
+ className: styles$1.taskListTableRow,
425
408
  style: {
426
409
  height: rowHeight
427
410
  },
@@ -478,23 +461,7 @@ var TaskListTableDefault = function TaskListTableDefault(_ref) {
478
461
  }
479
462
  }, React.createElement("div", {
480
463
  className: styles$1.taskListText
481
- }, "\xA0", toLocaleDateString(t.end, dateTimeOptions))), scheduleType === "lookAhead" && React.createElement("div", {
482
- className: styles$1.taskListCell,
483
- style: {
484
- minWidth: parseInt(rowWidth) * 0.6,
485
- maxWidth: parseInt(rowWidth) * 0.6
486
- }
487
- }, React.createElement("div", {
488
- className: styles$1.taskListText
489
- }, "\xA0", toLocaleDateString(t.actualStart, dateTimeOptions))), scheduleType === "lookAhead" && React.createElement("div", {
490
- className: styles$1.taskListCell,
491
- style: {
492
- minWidth: parseInt(rowWidth) * 0.6,
493
- maxWidth: parseInt(rowWidth) * 0.6
494
- }
495
- }, React.createElement("div", {
496
- className: styles$1.taskListText
497
- }, "\xA0", toLocaleDateString(t.actualEnd, dateTimeOptions))));
464
+ }, "\xA0", toLocaleDateString(t.end, dateTimeOptions))));
498
465
  }));
499
466
  };
500
467
 
@@ -661,7 +628,6 @@ var TaskList = function TaskList(_ref) {
661
628
  rowHeight = _ref.rowHeight,
662
629
  scrollY = _ref.scrollY,
663
630
  tasks = _ref.tasks,
664
- scheduleType = _ref.scheduleType,
665
631
  leafTasks = _ref.leafTasks,
666
632
  selectedTask = _ref.selectedTask,
667
633
  setSelectedTask = _ref.setSelectedTask,
@@ -683,8 +649,7 @@ var TaskList = function TaskList(_ref) {
683
649
  headerHeight: headerHeight,
684
650
  fontFamily: fontFamily,
685
651
  fontSize: fontSize,
686
- rowWidth: rowWidth,
687
- scheduleType: scheduleType
652
+ rowWidth: rowWidth
688
653
  };
689
654
  var selectedTaskId = selectedTask ? selectedTask.id : "";
690
655
  var tableProps = {
@@ -694,7 +659,6 @@ var TaskList = function TaskList(_ref) {
694
659
  fontSize: fontSize,
695
660
  tasks: tasks,
696
661
  leafTasks: leafTasks,
697
- scheduleType: scheduleType,
698
662
  locale: locale,
699
663
  selectedTaskId: selectedTaskId,
700
664
  setSelectedTask: setSelectedTask,
@@ -712,17 +676,15 @@ var TaskList = function TaskList(_ref) {
712
676
  }, React.createElement(TaskListTable, Object.assign({}, tableProps))));
713
677
  };
714
678
 
715
- var styles$4 = {"gridRow":"_2dZTy","gridRowLookAhead":"_2RRca","gridRowLine":"_3rUKi","gridTick":"_RuwuK","darkerGridRow":"_2M-tt"};
679
+ var styles$4 = {"gridRow":"_2dZTy","gridRowLine":"_3rUKi","gridTick":"_RuwuK","darkerGridRow":"_2M-tt"};
716
680
 
717
681
  var GridBody = function GridBody(_ref) {
718
682
  var tasks = _ref.tasks,
719
- scheduleType = _ref.scheduleType,
720
683
  dates = _ref.dates,
721
684
  rowHeight = _ref.rowHeight,
722
685
  svgWidth = _ref.svgWidth,
723
686
  columnWidth = _ref.columnWidth,
724
687
  todayColor = _ref.todayColor,
725
- weekendColor = _ref.weekendColor,
726
688
  rtl = _ref.rtl;
727
689
  var y = 0;
728
690
  var gridRows = [];
@@ -744,7 +706,7 @@ var GridBody = function GridBody(_ref) {
744
706
  y: y,
745
707
  width: svgWidth,
746
708
  height: rowHeight,
747
- className: isDarkerRow ? styles$4.darkerGridRow : scheduleType === "lookAhead" ? styles$4.gridRowLookAhead : styles$4.gridRow
709
+ className: isDarkerRow ? styles$4.darkerGridRow : styles$4.gridRow
748
710
  }));
749
711
  rowLines.push(React.createElement("line", {
750
712
  key: "RowLine" + task.id,
@@ -761,7 +723,6 @@ var GridBody = function GridBody(_ref) {
761
723
  var tickX = 0;
762
724
  var ticks = [];
763
725
  var today = React.createElement("rect", null);
764
- var weekend = [];
765
726
 
766
727
  for (var i = 0; i < dates.length; i++) {
767
728
  var date = dates[i];
@@ -784,16 +745,6 @@ var GridBody = function GridBody(_ref) {
784
745
  });
785
746
  }
786
747
 
787
- if (date.getDay() === 6 || date.getDay() === 0) {
788
- weekend.push(React.createElement("rect", {
789
- x: tickX,
790
- y: 0,
791
- width: columnWidth,
792
- height: y,
793
- fill: weekendColor
794
- }));
795
- }
796
-
797
748
  if (rtl && i + 1 !== dates.length && date.getTime() >= now.getTime() && dates[i + 1].getTime() < now.getTime()) {
798
749
  today = React.createElement("rect", {
799
750
  x: tickX + columnWidth,
@@ -815,9 +766,7 @@ var GridBody = function GridBody(_ref) {
815
766
  className: "rowLines"
816
767
  }, rowLines), React.createElement("g", {
817
768
  className: "ticks"
818
- }, ticks), scheduleType === "lookAhead" && React.createElement("g", {
819
- className: "weekend"
820
- }, weekend), React.createElement("g", {
769
+ }, ticks), React.createElement("g", {
821
770
  className: "today"
822
771
  }, today));
823
772
  };
@@ -1062,21 +1011,7 @@ var Calendar = function Calendar(_ref) {
1062
1011
  x1Line: columnWidth * (i + 1),
1063
1012
  y1Line: 0,
1064
1013
  y2Line: topDefaultHeight,
1065
- xText: topValues.length === 0 ? columnWidth * (i + 1) * 0.5 : columnWidth * (i + 1) - date.getDate() * columnWidth * 0.5,
1066
- yText: topDefaultHeight * 0.9
1067
- }));
1068
- }
1069
-
1070
- if (i + 1 === dates.length) {
1071
- var _topValue = getLocaleMonth(date, locale) + " " + date.getFullYear();
1072
-
1073
- topValues.push(React.createElement(TopPartOfCalendar, {
1074
- key: _topValue + date.getFullYear(),
1075
- value: _topValue,
1076
- x1Line: columnWidth * (i + 1),
1077
- y1Line: 0,
1078
- y2Line: topDefaultHeight,
1079
- xText: columnWidth * (i + 1) - date.getDate() * columnWidth * 0.5,
1014
+ xText: columnWidth * (i + 1) - getDaysInMonth(date.getMonth(), date.getFullYear()) * columnWidth * 0.5,
1080
1015
  yText: topDefaultHeight * 0.9
1081
1016
  }));
1082
1017
  }
@@ -1862,7 +1797,7 @@ var Bar = function Bar(_ref) {
1862
1797
  var handleHeight = task.height / 2 - 1;
1863
1798
 
1864
1799
  if (type == "planned") {
1865
- if ((task === null || task === void 0 ? void 0 : task.x1) >= 0 && (task === null || task === void 0 ? void 0 : task.x2) >= 0) return React.createElement("g", {
1800
+ if (task.x1 && task.x2) return React.createElement("g", {
1866
1801
  className: styles$6.barWrapper,
1867
1802
  tabIndex: 0
1868
1803
  }, React.createElement(BarDisplay, {
@@ -1910,7 +1845,7 @@ var Bar = function Bar(_ref) {
1910
1845
  className: styles$6.barWrapper,
1911
1846
  tabIndex: 0
1912
1847
  });
1913
- } else if ((task === null || task === void 0 ? void 0 : task.actualx1) >= 0 && (task === null || task === void 0 ? void 0 : task.actualx2) >= 0) {
1848
+ } else if (task.actualx1 && task.actualx2) {
1914
1849
  return React.createElement("g", {
1915
1850
  className: styles$6.barWrapper,
1916
1851
  tabIndex: 0
@@ -2097,11 +2032,11 @@ var TaskItem = function TaskItem(props) {
2097
2032
  useEffect(function () {
2098
2033
  switch (task.typeInternal) {
2099
2034
  case "milestone":
2100
- if (task.x1 >= 0 && task.actualx1 >= 0) setTaskItem([React.createElement(Milestone, Object.assign({}, props))]);else setTaskItem([]);
2035
+ setTaskItem([React.createElement(Milestone, Object.assign({}, props))]);
2101
2036
  break;
2102
2037
 
2103
2038
  case "project":
2104
- if ((task === null || task === void 0 ? void 0 : task.x1) >= 0 && (task === null || task === void 0 ? void 0 : task.x2) >= 0 && task.x2 > task.x1 && (task === null || task === void 0 ? void 0 : task.actualx1) >= 0 && (task === null || task === void 0 ? void 0 : task.actualx2) >= 0 && task.actualx2 > task.actualx1) setTaskItem([React.createElement(Project, Object.assign({}, props))]);else setTaskItem([]);
2039
+ setTaskItem([React.createElement(Project, Object.assign({}, props))]);
2105
2040
  break;
2106
2041
 
2107
2042
  case "smalltask":
@@ -2112,13 +2047,13 @@ var TaskItem = function TaskItem(props) {
2112
2047
  {
2113
2048
  var _taskItem = [];
2114
2049
 
2115
- if ((task === null || task === void 0 ? void 0 : task.x1) >= 0 && (task === null || task === void 0 ? void 0 : task.x2) >= 0) {
2050
+ if (task.x1 && task.x2) {
2116
2051
  _taskItem.push(React.createElement(Bar, Object.assign({}, props, {
2117
2052
  type: "planned"
2118
2053
  })));
2119
2054
  }
2120
2055
 
2121
- if ((task === null || task === void 0 ? void 0 : task.actualx1) >= 0 && (task === null || task === void 0 ? void 0 : task.actualx2) >= 0) {
2056
+ if (task.actualx1 && task.actualx2) {
2122
2057
  _taskItem.push(React.createElement(Bar, Object.assign({}, props, {
2123
2058
  type: "actual"
2124
2059
  })));
@@ -2429,7 +2364,7 @@ var TaskGanttContent = function TaskGanttContent(_ref) {
2429
2364
  return task.barChildren.map(function (child) {
2430
2365
  var _task$criticalPathArr, _task$criticalPathArr2;
2431
2366
 
2432
- if (task.x2 > task.x1 || task.actualx2 > task.actualx1) return React.createElement(Arrow, {
2367
+ return React.createElement(Arrow, {
2433
2368
  key: "Arrow from " + task.id + " to " + tasks[child.index].id,
2434
2369
  taskFrom: task,
2435
2370
  taskTo: tasks[child.index],
@@ -2440,11 +2375,6 @@ var TaskGanttContent = function TaskGanttContent(_ref) {
2440
2375
  arrowColor: ((_task$criticalPathArr = task.criticalPathArrows) === null || _task$criticalPathArr === void 0 ? void 0 : (_task$criticalPathArr2 = _task$criticalPathArr.find(function (arrow) {
2441
2376
  return arrow.taskId == tasks[child.index].id;
2442
2377
  })) === null || _task$criticalPathArr2 === void 0 ? void 0 : _task$criticalPathArr2.arrowColor) || "#808080"
2443
- });else return React.createElement("g", {
2444
- key: _task.id,
2445
- style: {
2446
- height: taskHeight
2447
- }
2448
2378
  });
2449
2379
  });
2450
2380
  })), React.createElement("g", {
@@ -2566,12 +2496,6 @@ var Gantt = function Gantt(_ref) {
2566
2496
  var tasks = _ref.tasks,
2567
2497
  _ref$leafTasks = _ref.leafTasks,
2568
2498
  leafTasks = _ref$leafTasks === void 0 ? [] : _ref$leafTasks,
2569
- _ref$scheduleType = _ref.scheduleType,
2570
- scheduleType = _ref$scheduleType === void 0 ? "main" : _ref$scheduleType,
2571
- _ref$startDate = _ref.startDate,
2572
- startDate = _ref$startDate === void 0 ? new Date() : _ref$startDate,
2573
- _ref$endDate = _ref.endDate,
2574
- endDate = _ref$endDate === void 0 ? new Date() : _ref$endDate,
2575
2499
  _ref$headerHeight = _ref.headerHeight,
2576
2500
  headerHeight = _ref$headerHeight === void 0 ? 50 : _ref$headerHeight,
2577
2501
  _ref$columnWidth = _ref.columnWidth,
@@ -2628,8 +2552,6 @@ var Gantt = function Gantt(_ref) {
2628
2552
  arrowIndent = _ref$arrowIndent === void 0 ? 20 : _ref$arrowIndent,
2629
2553
  _ref$todayColor = _ref.todayColor,
2630
2554
  todayColor = _ref$todayColor === void 0 ? "rgba(252, 248, 227, 0.5)" : _ref$todayColor,
2631
- _ref$weekendColor = _ref.weekendColor,
2632
- weekendColor = _ref$weekendColor === void 0 ? "#f5f5f5" : _ref$weekendColor,
2633
2555
  viewDate = _ref.viewDate,
2634
2556
  _ref$TooltipContent = _ref.TooltipContent,
2635
2557
  TooltipContent = _ref$TooltipContent === void 0 ? StandardTooltipContent : _ref$TooltipContent,
@@ -2650,19 +2572,12 @@ var Gantt = function Gantt(_ref) {
2650
2572
 
2651
2573
  var _useState = useState(function () {
2652
2574
  var _ganttDateRange = ganttDateRange(tasks, viewMode, preStepsCount),
2653
- startDateRange = _ganttDateRange[0],
2654
- endDateRange = _ganttDateRange[1];
2655
-
2656
- if (scheduleType === "lookAhead") {
2657
- return {
2658
- viewMode: viewMode,
2659
- dates: seedDates(startDate, endDate, viewMode)
2660
- };
2661
- }
2575
+ startDate = _ganttDateRange[0],
2576
+ endDate = _ganttDateRange[1];
2662
2577
 
2663
2578
  return {
2664
2579
  viewMode: viewMode,
2665
- dates: seedDates(startDateRange, endDateRange, viewMode)
2580
+ dates: seedDates(startDate, endDate, viewMode)
2666
2581
  };
2667
2582
  }),
2668
2583
  dateSetup = _useState[0],
@@ -2721,14 +2636,6 @@ var Gantt = function Gantt(_ref) {
2721
2636
  ignoreScrollEvent = _useState12[0],
2722
2637
  setIgnoreScrollEvent = _useState12[1];
2723
2638
 
2724
- useEffect(function () {
2725
- if (scheduleType === "lookAhead" && startDate && endDate) {
2726
- setDateSetup({
2727
- viewMode: viewMode,
2728
- dates: seedDates(startDate, endDate, viewMode)
2729
- });
2730
- }
2731
- }, [startDate, endDate]);
2732
2639
  useEffect(function () {
2733
2640
  var filteredTasks;
2734
2641
 
@@ -2741,14 +2648,10 @@ var Gantt = function Gantt(_ref) {
2741
2648
  filteredTasks = filteredTasks.sort(sortTasks);
2742
2649
 
2743
2650
  var _ganttDateRange2 = ganttDateRange(filteredTasks, viewMode, preStepsCount),
2744
- startDateRange = _ganttDateRange2[0],
2745
- endDateRange = _ganttDateRange2[1];
2651
+ startDate = _ganttDateRange2[0],
2652
+ endDate = _ganttDateRange2[1];
2746
2653
 
2747
- var newDates = seedDates(startDateRange, endDateRange, viewMode);
2748
-
2749
- if (scheduleType === "lookAhead") {
2750
- newDates = seedDates(startDate, endDate, viewMode);
2751
- }
2654
+ var newDates = seedDates(startDate, endDate, viewMode);
2752
2655
 
2753
2656
  if (rtl) {
2754
2657
  newDates = newDates.reverse();
@@ -2758,24 +2661,18 @@ var Gantt = function Gantt(_ref) {
2758
2661
  }
2759
2662
  }
2760
2663
 
2761
- if (scheduleType !== "lookAhead") {
2762
- setDateSetup({
2763
- dates: seedDates(startDateRange, endDateRange, viewMode),
2764
- viewMode: viewMode
2765
- });
2766
- }
2664
+ setDateSetup({
2665
+ dates: newDates,
2666
+ viewMode: viewMode
2667
+ });
2767
2668
 
2768
2669
  var _getCriticalPaths = getCriticalPaths(leafTasks),
2769
2670
  primaryPath = _getCriticalPaths[0],
2770
2671
  secondaryPath = _getCriticalPaths[1];
2771
2672
 
2772
2673
  uncolorAll(tasks);
2773
-
2774
- if (scheduleType !== "lookAhead") {
2775
- colorPath(secondaryPath, "#00ff00", tasks);
2776
- colorPath(primaryPath, "#ff0000", tasks);
2777
- }
2778
-
2674
+ colorPath(secondaryPath, "#00ff00", tasks);
2675
+ colorPath(primaryPath, "#ff0000", tasks);
2779
2676
  setBarTasks(convertToBarTasks(filteredTasks, newDates, columnWidth, rowHeight, taskHeight, barCornerRadius, handleWidth, rtl, barProgressColor, barProgressSelectedColor, barBackgroundColor, barBackgroundSelectedColor, projectProgressColor, projectProgressSelectedColor, projectBackgroundColor, projectBackgroundSelectedColor, milestoneBackgroundColor, milestoneBackgroundSelectedColor));
2780
2677
  }, [tasks, viewMode, preStepsCount, rowHeight, barCornerRadius, columnWidth, taskHeight, handleWidth, barProgressColor, barProgressSelectedColor, barBackgroundColor, barBackgroundSelectedColor, projectProgressColor, projectProgressSelectedColor, projectBackgroundColor, projectBackgroundSelectedColor, milestoneBackgroundColor, milestoneBackgroundSelectedColor, rtl, scrollX, onExpanderClick]);
2781
2678
  useEffect(function () {
@@ -2994,11 +2891,9 @@ var Gantt = function Gantt(_ref) {
2994
2891
  columnWidth: columnWidth,
2995
2892
  svgWidth: svgWidth,
2996
2893
  tasks: tasks,
2997
- scheduleType: scheduleType,
2998
2894
  rowHeight: rowHeight,
2999
2895
  dates: dateSetup.dates,
3000
2896
  todayColor: todayColor,
3001
- weekendColor: weekendColor,
3002
2897
  rtl: rtl
3003
2898
  };
3004
2899
  var calendarProps = {
@@ -3042,7 +2937,6 @@ var Gantt = function Gantt(_ref) {
3042
2937
  fontSize: fontSize,
3043
2938
  tasks: barTasks,
3044
2939
  leafTasks: leafTasks,
3045
- scheduleType: scheduleType,
3046
2940
  locale: locale,
3047
2941
  headerHeight: headerHeight,
3048
2942
  scrollY: scrollY,