gantt-task-react-v 1.0.15 → 1.0.16

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.
@@ -1,4 +1,4 @@
1
- import type { MouseEvent, RefObject } from "react";
1
+ import type { MouseEvent, RefObject, SyntheticEvent } from "react";
2
2
  import React from "react";
3
3
  import { AllowReorderTask, ChildByLevelMap, Column, DateSetup, DependencyMap, Distances, GanttRenderIconsProps, MapTaskToNestedIndex, OnResizeColumn, Task, RenderTask, TableRenderBottomProps } from "../../types";
4
4
  export type TaskListProps = {
@@ -37,5 +37,6 @@ export type TaskListProps = {
37
37
  tasks: readonly RenderTask[];
38
38
  onResizeColumn?: OnResizeColumn;
39
39
  tableBottom?: TableRenderBottomProps;
40
+ onVerticalScrollbarScrollY?: (event: SyntheticEvent<HTMLDivElement>) => void;
40
41
  };
41
42
  export declare const TaskList: React.NamedExoticComponent<TaskListProps>;
@@ -10657,14 +10657,14 @@ const TaskListTableDefaultInner = ({
10657
10657
  );
10658
10658
  };
10659
10659
  const TaskListTable = memo(TaskListTableDefaultInner);
10660
- const taskListRoot = "_taskListRoot_3vx1x_1";
10661
- const taskListHorizontalScroll = "_taskListHorizontalScroll_3vx1x_19";
10662
- const taskListResizer = "_taskListResizer_3vx1x_81";
10663
- const horizontalContainer$1 = "_horizontalContainer_3vx1x_145";
10664
- const tableWrapper = "_tableWrapper_3vx1x_161";
10665
- const scrollToTop = "_scrollToTop_3vx1x_175";
10666
- const scrollToBottom = "_scrollToBottom_3vx1x_191";
10667
- const hidden = "_hidden_3vx1x_207";
10660
+ const taskListRoot = "_taskListRoot_1rzqg_1";
10661
+ const taskListHorizontalScroll = "_taskListHorizontalScroll_1rzqg_19";
10662
+ const taskListResizer = "_taskListResizer_1rzqg_75";
10663
+ const horizontalContainer$1 = "_horizontalContainer_1rzqg_139";
10664
+ const tableWrapper = "_tableWrapper_1rzqg_155";
10665
+ const scrollToTop = "_scrollToTop_1rzqg_167";
10666
+ const scrollToBottom = "_scrollToBottom_1rzqg_183";
10667
+ const hidden = "_hidden_1rzqg_199";
10668
10668
  const styles$d = {
10669
10669
  taskListRoot,
10670
10670
  taskListHorizontalScroll,
@@ -10720,7 +10720,8 @@ const TaskListInner = ({
10720
10720
  tasks,
10721
10721
  onResizeColumn,
10722
10722
  canReorderTasks,
10723
- tableBottom
10723
+ tableBottom,
10724
+ onVerticalScrollbarScrollY
10724
10725
  }) => {
10725
10726
  const [
10726
10727
  columns,
@@ -10830,6 +10831,7 @@ const TaskListInner = ({
10830
10831
  style: {
10831
10832
  width: taskListWidth
10832
10833
  },
10834
+ onScroll: onVerticalScrollbarScrollY,
10833
10835
  children: /* @__PURE__ */ jsx(
10834
10836
  "div",
10835
10837
  {
@@ -19844,7 +19846,8 @@ const Gantt = (props) => {
19844
19846
  taskListContainerRef,
19845
19847
  taskListRef,
19846
19848
  tasks: visibleTasks,
19847
- ganttRef: wrapperRef
19849
+ ganttRef: wrapperRef,
19850
+ onVerticalScrollbarScrollY
19848
19851
  }),
19849
19852
  [
19850
19853
  childTasksMap,
@@ -19872,7 +19875,8 @@ const Gantt = (props) => {
19872
19875
  selectedIdsMirror,
19873
19876
  taskList,
19874
19877
  taskListContainerRef,
19875
- visibleTasks
19878
+ visibleTasks,
19879
+ onVerticalScrollbarScrollY
19876
19880
  ]
19877
19881
  );
19878
19882
  return /* @__PURE__ */ jsx(GanttThemeProvider, { theme, children: (cssVars) => /* @__PURE__ */ jsx(GanttLocaleProvider, { locale, children: /* @__PURE__ */ jsxs(
@@ -10674,14 +10674,14 @@
10674
10674
  );
10675
10675
  };
10676
10676
  const TaskListTable = React.memo(TaskListTableDefaultInner);
10677
- const taskListRoot = "_taskListRoot_3vx1x_1";
10678
- const taskListHorizontalScroll = "_taskListHorizontalScroll_3vx1x_19";
10679
- const taskListResizer = "_taskListResizer_3vx1x_81";
10680
- const horizontalContainer$1 = "_horizontalContainer_3vx1x_145";
10681
- const tableWrapper = "_tableWrapper_3vx1x_161";
10682
- const scrollToTop = "_scrollToTop_3vx1x_175";
10683
- const scrollToBottom = "_scrollToBottom_3vx1x_191";
10684
- const hidden = "_hidden_3vx1x_207";
10677
+ const taskListRoot = "_taskListRoot_1rzqg_1";
10678
+ const taskListHorizontalScroll = "_taskListHorizontalScroll_1rzqg_19";
10679
+ const taskListResizer = "_taskListResizer_1rzqg_75";
10680
+ const horizontalContainer$1 = "_horizontalContainer_1rzqg_139";
10681
+ const tableWrapper = "_tableWrapper_1rzqg_155";
10682
+ const scrollToTop = "_scrollToTop_1rzqg_167";
10683
+ const scrollToBottom = "_scrollToBottom_1rzqg_183";
10684
+ const hidden = "_hidden_1rzqg_199";
10685
10685
  const styles$d = {
10686
10686
  taskListRoot,
10687
10687
  taskListHorizontalScroll,
@@ -10737,7 +10737,8 @@
10737
10737
  tasks,
10738
10738
  onResizeColumn,
10739
10739
  canReorderTasks,
10740
- tableBottom
10740
+ tableBottom,
10741
+ onVerticalScrollbarScrollY
10741
10742
  }) => {
10742
10743
  const [
10743
10744
  columns,
@@ -10847,6 +10848,7 @@
10847
10848
  style: {
10848
10849
  width: taskListWidth
10849
10850
  },
10851
+ onScroll: onVerticalScrollbarScrollY,
10850
10852
  children: /* @__PURE__ */ jsxRuntime.jsx(
10851
10853
  "div",
10852
10854
  {
@@ -19861,7 +19863,8 @@
19861
19863
  taskListContainerRef,
19862
19864
  taskListRef,
19863
19865
  tasks: visibleTasks,
19864
- ganttRef: wrapperRef
19866
+ ganttRef: wrapperRef,
19867
+ onVerticalScrollbarScrollY
19865
19868
  }),
19866
19869
  [
19867
19870
  childTasksMap,
@@ -19889,7 +19892,8 @@
19889
19892
  selectedIdsMirror,
19890
19893
  taskList,
19891
19894
  taskListContainerRef,
19892
- visibleTasks
19895
+ visibleTasks,
19896
+ onVerticalScrollbarScrollY
19893
19897
  ]
19894
19898
  );
19895
19899
  return /* @__PURE__ */ jsxRuntime.jsx(GanttThemeProvider, { theme, children: (cssVars) => /* @__PURE__ */ jsxRuntime.jsx(GanttLocaleProvider, { locale, children: /* @__PURE__ */ jsxRuntime.jsxs(
package/dist/style.css CHANGED
@@ -282,7 +282,7 @@
282
282
  border-bottom: 1px solid var(--gantt-divider-color);
283
283
  table-layout: fixed;
284
284
  }
285
- ._taskListRoot_3vx1x_1 {
285
+ ._taskListRoot_1rzqg_1 {
286
286
  position: relative;
287
287
  /*noinspection CssUnresolvedCustomProperty*/
288
288
  border-left: 1px solid var(--gantt-table-divider-color, var(--gantt-divider-color));
@@ -291,23 +291,20 @@
291
291
  flex-direction: column;
292
292
  }
293
293
 
294
- ._taskListHorizontalScroll_3vx1x_19 {
294
+ ._taskListHorizontalScroll_1rzqg_19 {
295
295
  overflow-x: scroll;
296
- flex: 1 1 auto;
297
- display: flex;
298
- flex-direction: column;
299
296
  }
300
297
 
301
- ._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar {
298
+ ._taskListHorizontalScroll_1rzqg_19::-webkit-scrollbar {
302
299
  width: 1rem;
303
300
  height: 1rem;
304
301
  }
305
302
 
306
- ._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-corner {
303
+ ._taskListHorizontalScroll_1rzqg_19::-webkit-scrollbar-corner {
307
304
  background: transparent;
308
305
  }
309
306
 
310
- ._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-thumb {
307
+ ._taskListHorizontalScroll_1rzqg_19::-webkit-scrollbar-thumb {
311
308
  border: 4px solid transparent;
312
309
  /*noinspection CssUnresolvedCustomProperty*/
313
310
  background: var(--gantt-scrollbar-thumb-color);
@@ -315,14 +312,14 @@
315
312
  background-clip: padding-box;
316
313
  }
317
314
 
318
- ._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-thumb:hover {
315
+ ._taskListHorizontalScroll_1rzqg_19::-webkit-scrollbar-thumb:hover {
319
316
  border: 2px solid transparent;
320
317
  /*noinspection CssUnresolvedCustomProperty*/
321
318
  background: var(--gantt-scrollbar-thumb-color);
322
319
  background-clip: padding-box;
323
320
  }
324
321
 
325
- ._taskListResizer_3vx1x_81 {
322
+ ._taskListResizer_1rzqg_75 {
326
323
  position: absolute;
327
324
  top: 0;
328
325
  right: -3px;
@@ -334,16 +331,16 @@
334
331
  }
335
332
 
336
333
  /*noinspection CssUnresolvedCustomProperty*/
337
- ._taskListResizer_3vx1x_81:hover {
334
+ ._taskListResizer_1rzqg_75:hover {
338
335
  background-color: var(--gantt-table-hover-action-color);
339
336
  filter: var(--gantt-hover-filter);
340
337
  }
341
338
 
342
- ._taskListResizer_3vx1x_81:hover::before {
339
+ ._taskListResizer_1rzqg_75:hover::before {
343
340
  display: none;
344
341
  }
345
342
 
346
- ._taskListResizer_3vx1x_81::before {
343
+ ._taskListResizer_1rzqg_75::before {
347
344
  content: "";
348
345
  position: absolute;
349
346
  top: 0;
@@ -354,22 +351,21 @@
354
351
  background-color: var(--gantt-table-resize-color, var(--gantt-divider-color));
355
352
  }
356
353
 
357
- ._horizontalContainer_3vx1x_145 {
354
+ ._horizontalContainer_1rzqg_139 {
358
355
  margin: 0;
359
356
  padding: 0;
360
- overflow: hidden;
357
+ overflow-y: auto;
358
+ overflow-x: hidden;
361
359
  height: 100%;
362
- min-height: 0;
363
360
  }
364
361
 
365
- ._tableWrapper_3vx1x_161 {
362
+ ._tableWrapper_1rzqg_155 {
366
363
  position: relative;
367
- flex: 1 1 auto;
368
- display: flex;
369
- flex-direction: column;
364
+ flex: 1;
365
+ overflow: hidden;
370
366
  }
371
367
 
372
- ._scrollToTop_3vx1x_175 {
368
+ ._scrollToTop_1rzqg_167 {
373
369
  position: absolute;
374
370
  top: 0;
375
371
  left: 0;
@@ -377,7 +373,7 @@
377
373
  height: 20px;
378
374
  }
379
375
 
380
- ._scrollToBottom_3vx1x_191 {
376
+ ._scrollToBottom_1rzqg_183 {
381
377
  position: absolute;
382
378
  bottom: 0;
383
379
  left: 0;
@@ -385,7 +381,7 @@
385
381
  height: 20px;
386
382
  }
387
383
 
388
- ._hidden_3vx1x_207 {
384
+ ._hidden_1rzqg_199 {
389
385
  display: none;
390
386
  }
391
387
  ._ganttToday_1oyhk_1 {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gantt-task-react-v",
3
- "version": "1.0.15",
3
+ "version": "1.0.16",
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",