gantt-task-react-v 1.0.58 → 1.1.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.
@@ -10907,6 +10907,204 @@ const styles$c = {
10907
10907
  ganttToday,
10908
10908
  ganttTodayCircle
10909
10909
  };
10910
+ const getDateByOffset = (startDate, offset2, viewMode) => {
10911
+ switch (viewMode) {
10912
+ case ViewMode.Day:
10913
+ return addDays(startDate, offset2);
10914
+ case ViewMode.HalfDay:
10915
+ return addHours(startDate, offset2 * 12);
10916
+ case ViewMode.QuarterDay:
10917
+ return addHours(startDate, offset2 * 6);
10918
+ case ViewMode.Hour:
10919
+ return addHours(startDate, offset2);
10920
+ case ViewMode.Month:
10921
+ return addMonths(startDate, offset2);
10922
+ case ViewMode.Week:
10923
+ return addWeeks(startDate, offset2);
10924
+ case ViewMode.Year:
10925
+ return addYears(startDate, offset2);
10926
+ default:
10927
+ throw new Error("Unknown view mode");
10928
+ }
10929
+ };
10930
+ const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
10931
+ const index2 = getDatesDiff(xDate, startDate, viewMode);
10932
+ const currentDate = getDateByOffset(startDate, index2, viewMode);
10933
+ const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
10934
+ const remainderMillis = xDate.getTime() - currentDate.getTime();
10935
+ const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
10936
+ return index2 * columnWidth + percentOfInterval * columnWidth;
10937
+ };
10938
+ const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
10939
+ const index2 = getDatesDiff(xDate, startDate, viewMode);
10940
+ const currentDate = getDateByOffset(startDate, index2, viewMode);
10941
+ const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
10942
+ const remainderMillis = xDate.getTime() - currentDate.getTime();
10943
+ const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
10944
+ return index2 * columnWidth + percentOfInterval * columnWidth;
10945
+ };
10946
+ const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
10947
+ const progressWidth = Math.max((taskX2 - taskX1) * progress * 0.01, 0);
10948
+ let progressX;
10949
+ if (rtl) {
10950
+ progressX = taskX2 - progressWidth;
10951
+ } else {
10952
+ progressX = taskX1;
10953
+ }
10954
+ return [progressWidth, progressX];
10955
+ };
10956
+ const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
10957
+ let newDate = new Date((x - taskX) / xStep * timeStep + taskDate.getTime());
10958
+ newDate = new Date(
10959
+ newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
10960
+ );
10961
+ return newDate;
10962
+ };
10963
+ const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
10964
+ let result;
10965
+ switch (selectedTask.type) {
10966
+ case "milestone":
10967
+ result = handleTaskBySVGMouseEventForMilestone(
10968
+ action,
10969
+ selectedTask,
10970
+ initialCoordinates,
10971
+ coordinates,
10972
+ xStep,
10973
+ timeStep
10974
+ );
10975
+ break;
10976
+ default:
10977
+ result = handleTaskBySVGMouseEventForBar(
10978
+ action,
10979
+ selectedTask,
10980
+ initialCoordinates,
10981
+ coordinates,
10982
+ xStep,
10983
+ timeStep,
10984
+ rtl
10985
+ );
10986
+ break;
10987
+ }
10988
+ return result;
10989
+ };
10990
+ const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
10991
+ const changedTask = { ...selectedTask };
10992
+ let isChanged = false;
10993
+ switch (action) {
10994
+ case "progress":
10995
+ isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
10996
+ if (isChanged) {
10997
+ changedTask.progress = Math.round(
10998
+ coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
10999
+ );
11000
+ }
11001
+ break;
11002
+ case "start": {
11003
+ isChanged = initialCoordinates.x1 !== coordinates.x1;
11004
+ if (isChanged) {
11005
+ if (rtl) {
11006
+ changedTask.end = dateByX(
11007
+ coordinates.x1,
11008
+ initialCoordinates.x1,
11009
+ selectedTask.end,
11010
+ xStep,
11011
+ timeStep
11012
+ );
11013
+ } else {
11014
+ changedTask.start = dateByX(
11015
+ coordinates.x1,
11016
+ initialCoordinates.x1,
11017
+ selectedTask.start,
11018
+ xStep,
11019
+ timeStep
11020
+ );
11021
+ }
11022
+ }
11023
+ break;
11024
+ }
11025
+ case "end": {
11026
+ isChanged = initialCoordinates.x2 !== coordinates.x2;
11027
+ if (isChanged) {
11028
+ if (rtl) {
11029
+ changedTask.start = dateByX(
11030
+ coordinates.x2,
11031
+ initialCoordinates.x2,
11032
+ selectedTask.start,
11033
+ xStep,
11034
+ timeStep
11035
+ );
11036
+ } else {
11037
+ changedTask.end = dateByX(
11038
+ coordinates.x2,
11039
+ initialCoordinates.x2,
11040
+ selectedTask.end,
11041
+ xStep,
11042
+ timeStep
11043
+ );
11044
+ }
11045
+ }
11046
+ break;
11047
+ }
11048
+ case "move": {
11049
+ isChanged = initialCoordinates.x1 !== coordinates.x1;
11050
+ if (isChanged) {
11051
+ if (rtl) {
11052
+ changedTask.end = dateByX(
11053
+ coordinates.x1,
11054
+ initialCoordinates.x1,
11055
+ selectedTask.end,
11056
+ xStep,
11057
+ timeStep
11058
+ );
11059
+ changedTask.start = dateByX(
11060
+ coordinates.x2,
11061
+ initialCoordinates.x2,
11062
+ selectedTask.start,
11063
+ xStep,
11064
+ timeStep
11065
+ );
11066
+ } else {
11067
+ changedTask.start = dateByX(
11068
+ coordinates.x1,
11069
+ initialCoordinates.x1,
11070
+ selectedTask.start,
11071
+ xStep,
11072
+ timeStep
11073
+ );
11074
+ changedTask.end = dateByX(
11075
+ coordinates.x2,
11076
+ initialCoordinates.x2,
11077
+ selectedTask.end,
11078
+ xStep,
11079
+ timeStep
11080
+ );
11081
+ }
11082
+ }
11083
+ break;
11084
+ }
11085
+ }
11086
+ return { isChanged, changedTask };
11087
+ };
11088
+ const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
11089
+ const changedTask = { ...selectedTask };
11090
+ const isChanged = coordinates.x1 !== initialCoordinates.x1;
11091
+ if (isChanged) {
11092
+ switch (action) {
11093
+ case "move": {
11094
+ changedTask.start = dateByX(
11095
+ coordinates.x1,
11096
+ initialCoordinates.x1,
11097
+ selectedTask.start,
11098
+ xStep,
11099
+ timeStep
11100
+ );
11101
+ changedTask.end = changedTask.start;
11102
+ break;
11103
+ }
11104
+ }
11105
+ }
11106
+ return { isChanged, changedTask };
11107
+ };
10910
11108
  const GanttTodayInner = ({
10911
11109
  additionalLeftSpace,
10912
11110
  distances: { columnWidth },
@@ -10928,38 +11126,14 @@ const GanttTodayInner = ({
10928
11126
  return null;
10929
11127
  }
10930
11128
  const today = /* @__PURE__ */ new Date();
10931
- const todayIndex = getDatesDiff(today, startDate, viewMode);
10932
- const extraMultiplier = () => {
10933
- switch (viewMode) {
10934
- case ViewMode.Week: {
10935
- const percent = today.getDay() / 7;
10936
- return 1 + percent * 0.2;
10937
- }
10938
- case ViewMode.Month: {
10939
- const dayInMonth = today.getDate();
10940
- const maxDaysInMonth = getDaysInMonth(
10941
- today.getMonth(),
10942
- today.getFullYear()
10943
- );
10944
- const percent = dayInMonth / maxDaysInMonth;
10945
- return 1 + percent * 0.5;
10946
- }
10947
- case ViewMode.Year: {
10948
- const percent = today.getMonth() / 12;
10949
- return 1 + percent * 0.5;
10950
- }
10951
- default:
10952
- return 1;
10953
- }
10954
- };
10955
- const tickX = todayIndex * columnWidth * extraMultiplier();
10956
- const x = rtl ? tickX + columnWidth : tickX;
11129
+ const x = taskXCoordinate(today, startDate, viewMode, columnWidth);
11130
+ const adjustedX = rtl ? x + columnWidth : x;
10957
11131
  const color = todayColor || "var(--gantt-calendar-today-color)";
10958
11132
  return /* @__PURE__ */ jsxs(Fragment, { children: [
10959
11133
  /* @__PURE__ */ jsx(
10960
11134
  "rect",
10961
11135
  {
10962
- x: additionalLeftSpace + x,
11136
+ x: additionalLeftSpace + adjustedX,
10963
11137
  y: 0,
10964
11138
  width: 2,
10965
11139
  height: ganttFullHeight,
@@ -10970,7 +11144,7 @@ const GanttTodayInner = ({
10970
11144
  "circle",
10971
11145
  {
10972
11146
  className: styles$c.ganttTodayCircle,
10973
- cx: x + 1,
11147
+ cx: adjustedX + 1,
10974
11148
  cy: 6,
10975
11149
  r: 6,
10976
11150
  fill: color
@@ -10979,7 +11153,7 @@ const GanttTodayInner = ({
10979
11153
  /* @__PURE__ */ jsx(
10980
11154
  "text",
10981
11155
  {
10982
- x: additionalLeftSpace + x + 8,
11156
+ x: additionalLeftSpace + adjustedX + 8,
10983
11157
  y: 10,
10984
11158
  fill: color,
10985
11159
  fontSize: 12,
@@ -11004,38 +11178,14 @@ const GanttTodayInner = ({
11004
11178
  if (!showDataDateLine || !dataDate) {
11005
11179
  return null;
11006
11180
  }
11007
- const dataIndex = getDatesDiff(dataDate, startDate, viewMode);
11008
- const extraMultiplier = () => {
11009
- switch (viewMode) {
11010
- case ViewMode.Week: {
11011
- const percent = dataDate.getDay() / 7;
11012
- return 1 + percent * 0.2;
11013
- }
11014
- case ViewMode.Month: {
11015
- const dayInMonth = dataDate.getDate();
11016
- const maxDaysInMonth = getDaysInMonth(
11017
- dataDate.getMonth(),
11018
- dataDate.getFullYear()
11019
- );
11020
- const percent = dayInMonth / maxDaysInMonth;
11021
- return 1 + percent * 0.5;
11022
- }
11023
- case ViewMode.Year: {
11024
- const percent = dataDate.getMonth() / 12;
11025
- return 1 + percent * 0.5;
11026
- }
11027
- default:
11028
- return 1;
11029
- }
11030
- };
11031
- const tickX = dataIndex * columnWidth * extraMultiplier();
11032
- const x = rtl ? tickX + columnWidth : tickX;
11181
+ const x = taskXCoordinate(dataDate, startDate, viewMode, columnWidth);
11182
+ const adjustedX = rtl ? x + columnWidth : x;
11033
11183
  const color = dataDateColor || "var(--gantt-calendar-today-color)";
11034
11184
  return /* @__PURE__ */ jsxs(Fragment, { children: [
11035
11185
  /* @__PURE__ */ jsx(
11036
11186
  "rect",
11037
11187
  {
11038
- x: additionalLeftSpace + x,
11188
+ x: additionalLeftSpace + adjustedX,
11039
11189
  y: 0,
11040
11190
  width: 2,
11041
11191
  height: ganttFullHeight,
@@ -11047,7 +11197,7 @@ const GanttTodayInner = ({
11047
11197
  "circle",
11048
11198
  {
11049
11199
  className: styles$c.ganttTodayCircle,
11050
- cx: x + 1,
11200
+ cx: adjustedX + 1,
11051
11201
  cy: 6,
11052
11202
  r: 6,
11053
11203
  fill: color
@@ -11056,7 +11206,7 @@ const GanttTodayInner = ({
11056
11206
  /* @__PURE__ */ jsx(
11057
11207
  "text",
11058
11208
  {
11059
- x: additionalLeftSpace + x + 8,
11209
+ x: additionalLeftSpace + adjustedX + 8,
11060
11210
  y: 10,
11061
11211
  fill: color,
11062
11212
  fontSize: 12,
@@ -11770,204 +11920,6 @@ const RelationLine = ({
11770
11920
  }
11771
11921
  );
11772
11922
  };
11773
- const getDateByOffset = (startDate, offset2, viewMode) => {
11774
- switch (viewMode) {
11775
- case ViewMode.Day:
11776
- return addDays(startDate, offset2);
11777
- case ViewMode.HalfDay:
11778
- return addHours(startDate, offset2 * 12);
11779
- case ViewMode.QuarterDay:
11780
- return addHours(startDate, offset2 * 6);
11781
- case ViewMode.Hour:
11782
- return addHours(startDate, offset2);
11783
- case ViewMode.Month:
11784
- return addMonths(startDate, offset2);
11785
- case ViewMode.Week:
11786
- return addWeeks(startDate, offset2);
11787
- case ViewMode.Year:
11788
- return addYears(startDate, offset2);
11789
- default:
11790
- throw new Error("Unknown view mode");
11791
- }
11792
- };
11793
- const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
11794
- const index2 = getDatesDiff(xDate, startDate, viewMode);
11795
- const currentDate = getDateByOffset(startDate, index2, viewMode);
11796
- const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
11797
- const remainderMillis = xDate.getTime() - currentDate.getTime();
11798
- const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
11799
- return index2 * columnWidth + percentOfInterval * columnWidth;
11800
- };
11801
- const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
11802
- const index2 = getDatesDiff(xDate, startDate, viewMode);
11803
- const currentDate = getDateByOffset(startDate, index2, viewMode);
11804
- const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
11805
- const remainderMillis = xDate.getTime() - currentDate.getTime();
11806
- const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
11807
- return index2 * columnWidth + percentOfInterval * columnWidth;
11808
- };
11809
- const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
11810
- const progressWidth = Math.max((taskX2 - taskX1) * progress * 0.01, 0);
11811
- let progressX;
11812
- if (rtl) {
11813
- progressX = taskX2 - progressWidth;
11814
- } else {
11815
- progressX = taskX1;
11816
- }
11817
- return [progressWidth, progressX];
11818
- };
11819
- const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
11820
- let newDate = new Date((x - taskX) / xStep * timeStep + taskDate.getTime());
11821
- newDate = new Date(
11822
- newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
11823
- );
11824
- return newDate;
11825
- };
11826
- const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
11827
- let result;
11828
- switch (selectedTask.type) {
11829
- case "milestone":
11830
- result = handleTaskBySVGMouseEventForMilestone(
11831
- action,
11832
- selectedTask,
11833
- initialCoordinates,
11834
- coordinates,
11835
- xStep,
11836
- timeStep
11837
- );
11838
- break;
11839
- default:
11840
- result = handleTaskBySVGMouseEventForBar(
11841
- action,
11842
- selectedTask,
11843
- initialCoordinates,
11844
- coordinates,
11845
- xStep,
11846
- timeStep,
11847
- rtl
11848
- );
11849
- break;
11850
- }
11851
- return result;
11852
- };
11853
- const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
11854
- const changedTask = { ...selectedTask };
11855
- let isChanged = false;
11856
- switch (action) {
11857
- case "progress":
11858
- isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
11859
- if (isChanged) {
11860
- changedTask.progress = Math.round(
11861
- coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
11862
- );
11863
- }
11864
- break;
11865
- case "start": {
11866
- isChanged = initialCoordinates.x1 !== coordinates.x1;
11867
- if (isChanged) {
11868
- if (rtl) {
11869
- changedTask.end = dateByX(
11870
- coordinates.x1,
11871
- initialCoordinates.x1,
11872
- selectedTask.end,
11873
- xStep,
11874
- timeStep
11875
- );
11876
- } else {
11877
- changedTask.start = dateByX(
11878
- coordinates.x1,
11879
- initialCoordinates.x1,
11880
- selectedTask.start,
11881
- xStep,
11882
- timeStep
11883
- );
11884
- }
11885
- }
11886
- break;
11887
- }
11888
- case "end": {
11889
- isChanged = initialCoordinates.x2 !== coordinates.x2;
11890
- if (isChanged) {
11891
- if (rtl) {
11892
- changedTask.start = dateByX(
11893
- coordinates.x2,
11894
- initialCoordinates.x2,
11895
- selectedTask.start,
11896
- xStep,
11897
- timeStep
11898
- );
11899
- } else {
11900
- changedTask.end = dateByX(
11901
- coordinates.x2,
11902
- initialCoordinates.x2,
11903
- selectedTask.end,
11904
- xStep,
11905
- timeStep
11906
- );
11907
- }
11908
- }
11909
- break;
11910
- }
11911
- case "move": {
11912
- isChanged = initialCoordinates.x1 !== coordinates.x1;
11913
- if (isChanged) {
11914
- if (rtl) {
11915
- changedTask.end = dateByX(
11916
- coordinates.x1,
11917
- initialCoordinates.x1,
11918
- selectedTask.end,
11919
- xStep,
11920
- timeStep
11921
- );
11922
- changedTask.start = dateByX(
11923
- coordinates.x2,
11924
- initialCoordinates.x2,
11925
- selectedTask.start,
11926
- xStep,
11927
- timeStep
11928
- );
11929
- } else {
11930
- changedTask.start = dateByX(
11931
- coordinates.x1,
11932
- initialCoordinates.x1,
11933
- selectedTask.start,
11934
- xStep,
11935
- timeStep
11936
- );
11937
- changedTask.end = dateByX(
11938
- coordinates.x2,
11939
- initialCoordinates.x2,
11940
- selectedTask.end,
11941
- xStep,
11942
- timeStep
11943
- );
11944
- }
11945
- }
11946
- break;
11947
- }
11948
- }
11949
- return { isChanged, changedTask };
11950
- };
11951
- const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
11952
- const changedTask = { ...selectedTask };
11953
- const isChanged = coordinates.x1 !== initialCoordinates.x1;
11954
- if (isChanged) {
11955
- switch (action) {
11956
- case "move": {
11957
- changedTask.start = dateByX(
11958
- coordinates.x1,
11959
- initialCoordinates.x1,
11960
- selectedTask.start,
11961
- xStep,
11962
- timeStep
11963
- );
11964
- changedTask.end = changedTask.start;
11965
- break;
11966
- }
11967
- }
11968
- }
11969
- return { isChanged, changedTask };
11970
- };
11971
11923
  const barWrapper = "_barWrapper_5jhkr_1";
11972
11924
  const barHandle = "_barHandle_5jhkr_11";
11973
11925
  const barHandleImportantVisible = "_barHandleImportantVisible_5jhkr_37";
@@ -10924,6 +10924,204 @@
10924
10924
  ganttToday,
10925
10925
  ganttTodayCircle
10926
10926
  };
10927
+ const getDateByOffset = (startDate, offset2, viewMode) => {
10928
+ switch (viewMode) {
10929
+ case ViewMode.Day:
10930
+ return addDays(startDate, offset2);
10931
+ case ViewMode.HalfDay:
10932
+ return addHours(startDate, offset2 * 12);
10933
+ case ViewMode.QuarterDay:
10934
+ return addHours(startDate, offset2 * 6);
10935
+ case ViewMode.Hour:
10936
+ return addHours(startDate, offset2);
10937
+ case ViewMode.Month:
10938
+ return addMonths(startDate, offset2);
10939
+ case ViewMode.Week:
10940
+ return addWeeks(startDate, offset2);
10941
+ case ViewMode.Year:
10942
+ return addYears(startDate, offset2);
10943
+ default:
10944
+ throw new Error("Unknown view mode");
10945
+ }
10946
+ };
10947
+ const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
10948
+ const index2 = getDatesDiff(xDate, startDate, viewMode);
10949
+ const currentDate = getDateByOffset(startDate, index2, viewMode);
10950
+ const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
10951
+ const remainderMillis = xDate.getTime() - currentDate.getTime();
10952
+ const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
10953
+ return index2 * columnWidth + percentOfInterval * columnWidth;
10954
+ };
10955
+ const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
10956
+ const index2 = getDatesDiff(xDate, startDate, viewMode);
10957
+ const currentDate = getDateByOffset(startDate, index2, viewMode);
10958
+ const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
10959
+ const remainderMillis = xDate.getTime() - currentDate.getTime();
10960
+ const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
10961
+ return index2 * columnWidth + percentOfInterval * columnWidth;
10962
+ };
10963
+ const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
10964
+ const progressWidth = Math.max((taskX2 - taskX1) * progress * 0.01, 0);
10965
+ let progressX;
10966
+ if (rtl) {
10967
+ progressX = taskX2 - progressWidth;
10968
+ } else {
10969
+ progressX = taskX1;
10970
+ }
10971
+ return [progressWidth, progressX];
10972
+ };
10973
+ const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
10974
+ let newDate = new Date((x - taskX) / xStep * timeStep + taskDate.getTime());
10975
+ newDate = new Date(
10976
+ newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
10977
+ );
10978
+ return newDate;
10979
+ };
10980
+ const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
10981
+ let result;
10982
+ switch (selectedTask.type) {
10983
+ case "milestone":
10984
+ result = handleTaskBySVGMouseEventForMilestone(
10985
+ action,
10986
+ selectedTask,
10987
+ initialCoordinates,
10988
+ coordinates,
10989
+ xStep,
10990
+ timeStep
10991
+ );
10992
+ break;
10993
+ default:
10994
+ result = handleTaskBySVGMouseEventForBar(
10995
+ action,
10996
+ selectedTask,
10997
+ initialCoordinates,
10998
+ coordinates,
10999
+ xStep,
11000
+ timeStep,
11001
+ rtl
11002
+ );
11003
+ break;
11004
+ }
11005
+ return result;
11006
+ };
11007
+ const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
11008
+ const changedTask = { ...selectedTask };
11009
+ let isChanged = false;
11010
+ switch (action) {
11011
+ case "progress":
11012
+ isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
11013
+ if (isChanged) {
11014
+ changedTask.progress = Math.round(
11015
+ coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
11016
+ );
11017
+ }
11018
+ break;
11019
+ case "start": {
11020
+ isChanged = initialCoordinates.x1 !== coordinates.x1;
11021
+ if (isChanged) {
11022
+ if (rtl) {
11023
+ changedTask.end = dateByX(
11024
+ coordinates.x1,
11025
+ initialCoordinates.x1,
11026
+ selectedTask.end,
11027
+ xStep,
11028
+ timeStep
11029
+ );
11030
+ } else {
11031
+ changedTask.start = dateByX(
11032
+ coordinates.x1,
11033
+ initialCoordinates.x1,
11034
+ selectedTask.start,
11035
+ xStep,
11036
+ timeStep
11037
+ );
11038
+ }
11039
+ }
11040
+ break;
11041
+ }
11042
+ case "end": {
11043
+ isChanged = initialCoordinates.x2 !== coordinates.x2;
11044
+ if (isChanged) {
11045
+ if (rtl) {
11046
+ changedTask.start = dateByX(
11047
+ coordinates.x2,
11048
+ initialCoordinates.x2,
11049
+ selectedTask.start,
11050
+ xStep,
11051
+ timeStep
11052
+ );
11053
+ } else {
11054
+ changedTask.end = dateByX(
11055
+ coordinates.x2,
11056
+ initialCoordinates.x2,
11057
+ selectedTask.end,
11058
+ xStep,
11059
+ timeStep
11060
+ );
11061
+ }
11062
+ }
11063
+ break;
11064
+ }
11065
+ case "move": {
11066
+ isChanged = initialCoordinates.x1 !== coordinates.x1;
11067
+ if (isChanged) {
11068
+ if (rtl) {
11069
+ changedTask.end = dateByX(
11070
+ coordinates.x1,
11071
+ initialCoordinates.x1,
11072
+ selectedTask.end,
11073
+ xStep,
11074
+ timeStep
11075
+ );
11076
+ changedTask.start = dateByX(
11077
+ coordinates.x2,
11078
+ initialCoordinates.x2,
11079
+ selectedTask.start,
11080
+ xStep,
11081
+ timeStep
11082
+ );
11083
+ } else {
11084
+ changedTask.start = dateByX(
11085
+ coordinates.x1,
11086
+ initialCoordinates.x1,
11087
+ selectedTask.start,
11088
+ xStep,
11089
+ timeStep
11090
+ );
11091
+ changedTask.end = dateByX(
11092
+ coordinates.x2,
11093
+ initialCoordinates.x2,
11094
+ selectedTask.end,
11095
+ xStep,
11096
+ timeStep
11097
+ );
11098
+ }
11099
+ }
11100
+ break;
11101
+ }
11102
+ }
11103
+ return { isChanged, changedTask };
11104
+ };
11105
+ const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
11106
+ const changedTask = { ...selectedTask };
11107
+ const isChanged = coordinates.x1 !== initialCoordinates.x1;
11108
+ if (isChanged) {
11109
+ switch (action) {
11110
+ case "move": {
11111
+ changedTask.start = dateByX(
11112
+ coordinates.x1,
11113
+ initialCoordinates.x1,
11114
+ selectedTask.start,
11115
+ xStep,
11116
+ timeStep
11117
+ );
11118
+ changedTask.end = changedTask.start;
11119
+ break;
11120
+ }
11121
+ }
11122
+ }
11123
+ return { isChanged, changedTask };
11124
+ };
10927
11125
  const GanttTodayInner = ({
10928
11126
  additionalLeftSpace,
10929
11127
  distances: { columnWidth },
@@ -10945,38 +11143,14 @@
10945
11143
  return null;
10946
11144
  }
10947
11145
  const today = /* @__PURE__ */ new Date();
10948
- const todayIndex = getDatesDiff(today, startDate, viewMode);
10949
- const extraMultiplier = () => {
10950
- switch (viewMode) {
10951
- case ViewMode.Week: {
10952
- const percent = today.getDay() / 7;
10953
- return 1 + percent * 0.2;
10954
- }
10955
- case ViewMode.Month: {
10956
- const dayInMonth = today.getDate();
10957
- const maxDaysInMonth = getDaysInMonth(
10958
- today.getMonth(),
10959
- today.getFullYear()
10960
- );
10961
- const percent = dayInMonth / maxDaysInMonth;
10962
- return 1 + percent * 0.5;
10963
- }
10964
- case ViewMode.Year: {
10965
- const percent = today.getMonth() / 12;
10966
- return 1 + percent * 0.5;
10967
- }
10968
- default:
10969
- return 1;
10970
- }
10971
- };
10972
- const tickX = todayIndex * columnWidth * extraMultiplier();
10973
- const x = rtl ? tickX + columnWidth : tickX;
11146
+ const x = taskXCoordinate(today, startDate, viewMode, columnWidth);
11147
+ const adjustedX = rtl ? x + columnWidth : x;
10974
11148
  const color = todayColor || "var(--gantt-calendar-today-color)";
10975
11149
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
10976
11150
  /* @__PURE__ */ jsxRuntime.jsx(
10977
11151
  "rect",
10978
11152
  {
10979
- x: additionalLeftSpace + x,
11153
+ x: additionalLeftSpace + adjustedX,
10980
11154
  y: 0,
10981
11155
  width: 2,
10982
11156
  height: ganttFullHeight,
@@ -10987,7 +11161,7 @@
10987
11161
  "circle",
10988
11162
  {
10989
11163
  className: styles$c.ganttTodayCircle,
10990
- cx: x + 1,
11164
+ cx: adjustedX + 1,
10991
11165
  cy: 6,
10992
11166
  r: 6,
10993
11167
  fill: color
@@ -10996,7 +11170,7 @@
10996
11170
  /* @__PURE__ */ jsxRuntime.jsx(
10997
11171
  "text",
10998
11172
  {
10999
- x: additionalLeftSpace + x + 8,
11173
+ x: additionalLeftSpace + adjustedX + 8,
11000
11174
  y: 10,
11001
11175
  fill: color,
11002
11176
  fontSize: 12,
@@ -11021,38 +11195,14 @@
11021
11195
  if (!showDataDateLine || !dataDate) {
11022
11196
  return null;
11023
11197
  }
11024
- const dataIndex = getDatesDiff(dataDate, startDate, viewMode);
11025
- const extraMultiplier = () => {
11026
- switch (viewMode) {
11027
- case ViewMode.Week: {
11028
- const percent = dataDate.getDay() / 7;
11029
- return 1 + percent * 0.2;
11030
- }
11031
- case ViewMode.Month: {
11032
- const dayInMonth = dataDate.getDate();
11033
- const maxDaysInMonth = getDaysInMonth(
11034
- dataDate.getMonth(),
11035
- dataDate.getFullYear()
11036
- );
11037
- const percent = dayInMonth / maxDaysInMonth;
11038
- return 1 + percent * 0.5;
11039
- }
11040
- case ViewMode.Year: {
11041
- const percent = dataDate.getMonth() / 12;
11042
- return 1 + percent * 0.5;
11043
- }
11044
- default:
11045
- return 1;
11046
- }
11047
- };
11048
- const tickX = dataIndex * columnWidth * extraMultiplier();
11049
- const x = rtl ? tickX + columnWidth : tickX;
11198
+ const x = taskXCoordinate(dataDate, startDate, viewMode, columnWidth);
11199
+ const adjustedX = rtl ? x + columnWidth : x;
11050
11200
  const color = dataDateColor || "var(--gantt-calendar-today-color)";
11051
11201
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
11052
11202
  /* @__PURE__ */ jsxRuntime.jsx(
11053
11203
  "rect",
11054
11204
  {
11055
- x: additionalLeftSpace + x,
11205
+ x: additionalLeftSpace + adjustedX,
11056
11206
  y: 0,
11057
11207
  width: 2,
11058
11208
  height: ganttFullHeight,
@@ -11064,7 +11214,7 @@
11064
11214
  "circle",
11065
11215
  {
11066
11216
  className: styles$c.ganttTodayCircle,
11067
- cx: x + 1,
11217
+ cx: adjustedX + 1,
11068
11218
  cy: 6,
11069
11219
  r: 6,
11070
11220
  fill: color
@@ -11073,7 +11223,7 @@
11073
11223
  /* @__PURE__ */ jsxRuntime.jsx(
11074
11224
  "text",
11075
11225
  {
11076
- x: additionalLeftSpace + x + 8,
11226
+ x: additionalLeftSpace + adjustedX + 8,
11077
11227
  y: 10,
11078
11228
  fill: color,
11079
11229
  fontSize: 12,
@@ -11787,204 +11937,6 @@
11787
11937
  }
11788
11938
  );
11789
11939
  };
11790
- const getDateByOffset = (startDate, offset2, viewMode) => {
11791
- switch (viewMode) {
11792
- case ViewMode.Day:
11793
- return addDays(startDate, offset2);
11794
- case ViewMode.HalfDay:
11795
- return addHours(startDate, offset2 * 12);
11796
- case ViewMode.QuarterDay:
11797
- return addHours(startDate, offset2 * 6);
11798
- case ViewMode.Hour:
11799
- return addHours(startDate, offset2);
11800
- case ViewMode.Month:
11801
- return addMonths(startDate, offset2);
11802
- case ViewMode.Week:
11803
- return addWeeks(startDate, offset2);
11804
- case ViewMode.Year:
11805
- return addYears(startDate, offset2);
11806
- default:
11807
- throw new Error("Unknown view mode");
11808
- }
11809
- };
11810
- const taskXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
11811
- const index2 = getDatesDiff(xDate, startDate, viewMode);
11812
- const currentDate = getDateByOffset(startDate, index2, viewMode);
11813
- const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
11814
- const remainderMillis = xDate.getTime() - currentDate.getTime();
11815
- const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
11816
- return index2 * columnWidth + percentOfInterval * columnWidth;
11817
- };
11818
- const taskComparisonXCoordinate = (xDate, startDate, viewMode, columnWidth) => {
11819
- const index2 = getDatesDiff(xDate, startDate, viewMode);
11820
- const currentDate = getDateByOffset(startDate, index2, viewMode);
11821
- const nextDate = getDateByOffset(startDate, index2 + 1, viewMode);
11822
- const remainderMillis = xDate.getTime() - currentDate.getTime();
11823
- const percentOfInterval = remainderMillis / (nextDate.getTime() - currentDate.getTime());
11824
- return index2 * columnWidth + percentOfInterval * columnWidth;
11825
- };
11826
- const progressWithByParams = (taskX1, taskX2, progress, rtl) => {
11827
- const progressWidth = Math.max((taskX2 - taskX1) * progress * 0.01, 0);
11828
- let progressX;
11829
- if (rtl) {
11830
- progressX = taskX2 - progressWidth;
11831
- } else {
11832
- progressX = taskX1;
11833
- }
11834
- return [progressWidth, progressX];
11835
- };
11836
- const dateByX = (x, taskX, taskDate, xStep, timeStep) => {
11837
- let newDate = new Date((x - taskX) / xStep * timeStep + taskDate.getTime());
11838
- newDate = new Date(
11839
- newDate.getTime() + (newDate.getTimezoneOffset() - taskDate.getTimezoneOffset()) * 6e4
11840
- );
11841
- return newDate;
11842
- };
11843
- const handleTaskBySVGMouseEvent = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
11844
- let result;
11845
- switch (selectedTask.type) {
11846
- case "milestone":
11847
- result = handleTaskBySVGMouseEventForMilestone(
11848
- action,
11849
- selectedTask,
11850
- initialCoordinates,
11851
- coordinates,
11852
- xStep,
11853
- timeStep
11854
- );
11855
- break;
11856
- default:
11857
- result = handleTaskBySVGMouseEventForBar(
11858
- action,
11859
- selectedTask,
11860
- initialCoordinates,
11861
- coordinates,
11862
- xStep,
11863
- timeStep,
11864
- rtl
11865
- );
11866
- break;
11867
- }
11868
- return result;
11869
- };
11870
- const handleTaskBySVGMouseEventForBar = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep, rtl) => {
11871
- const changedTask = { ...selectedTask };
11872
- let isChanged = false;
11873
- switch (action) {
11874
- case "progress":
11875
- isChanged = initialCoordinates.progressWidth !== coordinates.progressWidth;
11876
- if (isChanged) {
11877
- changedTask.progress = Math.round(
11878
- coordinates.progressWidth * 100 / (coordinates.x2 - coordinates.x1)
11879
- );
11880
- }
11881
- break;
11882
- case "start": {
11883
- isChanged = initialCoordinates.x1 !== coordinates.x1;
11884
- if (isChanged) {
11885
- if (rtl) {
11886
- changedTask.end = dateByX(
11887
- coordinates.x1,
11888
- initialCoordinates.x1,
11889
- selectedTask.end,
11890
- xStep,
11891
- timeStep
11892
- );
11893
- } else {
11894
- changedTask.start = dateByX(
11895
- coordinates.x1,
11896
- initialCoordinates.x1,
11897
- selectedTask.start,
11898
- xStep,
11899
- timeStep
11900
- );
11901
- }
11902
- }
11903
- break;
11904
- }
11905
- case "end": {
11906
- isChanged = initialCoordinates.x2 !== coordinates.x2;
11907
- if (isChanged) {
11908
- if (rtl) {
11909
- changedTask.start = dateByX(
11910
- coordinates.x2,
11911
- initialCoordinates.x2,
11912
- selectedTask.start,
11913
- xStep,
11914
- timeStep
11915
- );
11916
- } else {
11917
- changedTask.end = dateByX(
11918
- coordinates.x2,
11919
- initialCoordinates.x2,
11920
- selectedTask.end,
11921
- xStep,
11922
- timeStep
11923
- );
11924
- }
11925
- }
11926
- break;
11927
- }
11928
- case "move": {
11929
- isChanged = initialCoordinates.x1 !== coordinates.x1;
11930
- if (isChanged) {
11931
- if (rtl) {
11932
- changedTask.end = dateByX(
11933
- coordinates.x1,
11934
- initialCoordinates.x1,
11935
- selectedTask.end,
11936
- xStep,
11937
- timeStep
11938
- );
11939
- changedTask.start = dateByX(
11940
- coordinates.x2,
11941
- initialCoordinates.x2,
11942
- selectedTask.start,
11943
- xStep,
11944
- timeStep
11945
- );
11946
- } else {
11947
- changedTask.start = dateByX(
11948
- coordinates.x1,
11949
- initialCoordinates.x1,
11950
- selectedTask.start,
11951
- xStep,
11952
- timeStep
11953
- );
11954
- changedTask.end = dateByX(
11955
- coordinates.x2,
11956
- initialCoordinates.x2,
11957
- selectedTask.end,
11958
- xStep,
11959
- timeStep
11960
- );
11961
- }
11962
- }
11963
- break;
11964
- }
11965
- }
11966
- return { isChanged, changedTask };
11967
- };
11968
- const handleTaskBySVGMouseEventForMilestone = (action, selectedTask, initialCoordinates, coordinates, xStep, timeStep) => {
11969
- const changedTask = { ...selectedTask };
11970
- const isChanged = coordinates.x1 !== initialCoordinates.x1;
11971
- if (isChanged) {
11972
- switch (action) {
11973
- case "move": {
11974
- changedTask.start = dateByX(
11975
- coordinates.x1,
11976
- initialCoordinates.x1,
11977
- selectedTask.start,
11978
- xStep,
11979
- timeStep
11980
- );
11981
- changedTask.end = changedTask.start;
11982
- break;
11983
- }
11984
- }
11985
- }
11986
- return { isChanged, changedTask };
11987
- };
11988
11940
  const barWrapper = "_barWrapper_5jhkr_1";
11989
11941
  const barHandle = "_barHandle_5jhkr_11";
11990
11942
  const barHandleImportantVisible = "_barHandleImportantVisible_5jhkr_37";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gantt-task-react-v",
3
- "version": "1.0.58",
3
+ "version": "1.1.0",
4
4
  "description": "Interactive Gantt Chart for React with TypeScript.",
5
5
  "author": "aguilanbon",
6
6
  "homepage": "https://github.com/aguilanbon/gantt-task-react-v",
@@ -55,15 +55,19 @@
55
55
  "@babel/types": "^7.20.7",
56
56
  "@chromatic-com/storybook": "^1.3.1",
57
57
  "@rollup/plugin-image": "3.0.3",
58
- "@storybook/addon-essentials": "^8.0.6",
59
- "@storybook/addon-interactions": "^8.0.6",
60
- "@storybook/addon-links": "^8.0.6",
61
- "@storybook/addon-onboarding": "^8.0.6",
62
- "@storybook/blocks": "^8.0.6",
63
- "@storybook/cli": "^8.4.4",
64
- "@storybook/react": "^8.4.4",
65
- "@storybook/react-vite": "^8.0.6",
66
- "@storybook/test": "^8.0.6",
58
+ "@storybook/addon-essentials": "8.2.10",
59
+ "@storybook/addon-interactions": "8.2.10",
60
+ "@storybook/addon-links": "8.2.10",
61
+ "@storybook/addon-onboarding": "8.2.10",
62
+ "@storybook/blocks": "8.2.10",
63
+ "@storybook/cli": "8.2.10",
64
+ "@storybook/react": "8.2.10",
65
+ "@storybook/react-vite": "8.2.10",
66
+ "@storybook/test": "8.2.10",
67
+ "@storybook/core-server": "8.2.10",
68
+ "@storybook/jest": "0.2.3",
69
+ "@storybook/test-runner": "0.23.0",
70
+ "@storybook/testing-library": "^0.2.2",
67
71
  "@testing-library/jest-dom": "^6.4.2",
68
72
  "@testing-library/react": "^14.2.2",
69
73
  "@testing-library/user-event": "^14.2.1",
@@ -93,7 +97,7 @@
93
97
  "react": "^18.2.0",
94
98
  "react-dom": "^18.2.0",
95
99
  "rollup-plugin-peer-deps-external": "2.2.4",
96
- "storybook": "^8.0.6",
100
+ "storybook": "8.2.10",
97
101
  "typescript": "^5.1.6",
98
102
  "vite": "5.2.8",
99
103
  "vite-plugin-turbosnap": "^1.0.3",