gantt-task-react-v 1.0.13 → 1.0.15

package/dist/components/gantt/task-gantt.d.ts

@@ -5,8 +5,6 @@ import { CalendarProps } from "../calendar/calendar";
 import { TaskGanttContentProps } from "./task-gantt-content";
 import { GanttTaskBarActions } from "../../types";
 export interface TaskGanttProps extends GanttTaskBarActions {
-    ganttHeight?: number;
-    useCssHeight?: boolean;
     barProps: TaskGanttContentProps;
     calendarProps: Omit<CalendarProps, "scrollRef">;
     fullRowHeight: number;

package/dist/components/task-list/index.d.ts

@@ -14,8 +14,6 @@ export type TaskListProps = {
     distances: Distances;
     fullRowHeight: number;
     ganttFullHeight: number;
-    ganttHeight?: number;
-    useCssHeight?: boolean;
     getTaskCurrentState: (task: Task) => Task;
     handleAddTask: (task: Task | null) => void;
     handleDeleteTasks: (task: RenderTask[]) => void;

package/dist/gantt-task-react.es.js

@@ -10657,14 +10657,14 @@ const TaskListTableDefaultInner = ({
   );
 };
 const TaskListTable = memo(TaskListTableDefaultInner);
-const taskListRoot = "_taskListRoot_3y2l5_1";
-const taskListHorizontalScroll = "_taskListHorizontalScroll_3y2l5_13";
-const taskListResizer = "_taskListResizer_3y2l5_69";
-const horizontalContainer$1 = "_horizontalContainer_3y2l5_133";
-const tableWrapper = "_tableWrapper_3y2l5_145";
-const scrollToTop = "_scrollToTop_3y2l5_153";
-const scrollToBottom = "_scrollToBottom_3y2l5_169";
-const hidden = "_hidden_3y2l5_185";
+const taskListRoot = "_taskListRoot_3vx1x_1";
+const taskListHorizontalScroll = "_taskListHorizontalScroll_3vx1x_19";
+const taskListResizer = "_taskListResizer_3vx1x_81";
+const horizontalContainer$1 = "_horizontalContainer_3vx1x_145";
+const tableWrapper = "_tableWrapper_3vx1x_161";
+const scrollToTop = "_scrollToTop_3vx1x_175";
+const scrollToBottom = "_scrollToBottom_3vx1x_191";
+const hidden = "_hidden_3vx1x_207";
 const styles$d = {
   taskListRoot,
   taskListHorizontalScroll,
@@ -10720,9 +10720,7 @@ const TaskListInner = ({
   tasks,
   onResizeColumn,
   canReorderTasks,
-  tableBottom,
-  ganttHeight,
-  useCssHeight
+  tableBottom
 }) => {
   const [
     columns,
@@ -10830,29 +10828,15 @@ const TaskListInner = ({
                 ref: taskListContainerRef,
                 className: styles$d.horizontalContainer,
                 style: {
-                  // If consumer asked for CSS height (e.g. "100%"), let the
-                  // container fill its parent. Otherwise compute pixel height.
-                  height: ganttHeight == null && ganttHeight !== 0 && (typeof ganttHeight === "undefined" || useCssHeight) ? "100%" : (() => {
-                    const minRowsHeight = distances.minimumRowDisplayed * distances.rowHeight;
-                    const resolved = typeof ganttHeight === "number" ? ganttHeight : void 0;
-                    const visible = Math.max(
-                      minRowsHeight,
-                      Math.min(ganttFullHeight, resolved ?? ganttFullHeight)
-                    );
-                    return visible;
-                  })(),
                   width: taskListWidth
                 },
                 children: /* @__PURE__ */ jsx(
                   "div",
                   {
                     style: {
-                      height: Math.max(
-                        ganttFullHeight,
-                        distances.minimumRowDisplayed * distances.rowHeight
-                      ),
                       backgroundSize: `100% ${fullRowHeight * 2}px`,
-                      backgroundImage: `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`
+                      backgroundImage: `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`,
+                      height: "100%"
                     },
                     children: /* @__PURE__ */ jsx(
                       RenderTaskListTable,
@@ -13163,12 +13147,12 @@ const TaskGanttContentInner = (props) => {
   ] });
 };
 const TaskGanttContent = memo(TaskGanttContentInner);
-const ganttVerticalContainer = "_ganttVerticalContainer_1hrwo_1";
-const horizontalContainer = "_horizontalContainer_1hrwo_75";
-const ganttHeader = "_ganttHeader_1hrwo_87";
-const ganttBodyScroll = "_ganttBodyScroll_1hrwo_97";
-const wrapper = "_wrapper_1hrwo_109";
-const calendarDragging = "_calendarDragging_1hrwo_131";
+const ganttVerticalContainer = "_ganttVerticalContainer_7rmhe_1";
+const horizontalContainer = "_horizontalContainer_7rmhe_79";
+const ganttHeader = "_ganttHeader_7rmhe_95";
+const ganttBodyScroll = "_ganttBodyScroll_7rmhe_105";
+const wrapper = "_wrapper_7rmhe_121";
+const calendarDragging = "_calendarDragging_7rmhe_147";
 const styles$2 = {
   ganttVerticalContainer,
   horizontalContainer,
@@ -13193,32 +13177,19 @@ const TaskGanttInner = (props) => {
     horizontalContainerRef,
     onVerticalScrollbarScrollX,
     verticalGanttContainerRef,
-    verticalScrollbarRef,
-    ganttHeight
+    verticalScrollbarRef
   } = props;
   const contentRef = React__default.useRef(null);
   const moveStateVertRef = useRef(null);
   const moveStateHorRef = useRef(null);
   const moveStateScrollRef = useRef(null);
-  const containerStyle = useMemo(() => {
-    const minRowsHeight = minimumRowDisplayed * rowHeight;
-    const resolved = typeof ganttHeight === "number" ? ganttHeight : void 0;
-    const visible = Math.max(
-      minRowsHeight,
-      Math.min(ganttFullHeight, resolved ?? ganttFullHeight)
-    );
-    return {
-      height: props.useCssHeight ? "100%" : visible,
+  const containerStyle = useMemo(
+    () => ({
+      height: "100%",
       width: fullSvgWidth
-    };
-  }, [
-    ganttFullHeight,
-    minimumRowDisplayed,
-    rowHeight,
-    fullSvgWidth,
-    ganttHeight,
-    props.useCssHeight
-  ]);
+    }),
+    [fullSvgWidth]
+  );
   const gridStyle = useMemo(
     () => ({
       height: Math.max(ganttFullHeight, minimumRowDisplayed * rowHeight),
@@ -13302,18 +13273,15 @@ const TaskGanttInner = (props) => {
       moveStateHorRef.current = null;
       contentContainer.classList.remove(styles$2.calendarDragging);
     };
-    const moveListener = (evt) => onScrollMove(evt);
-    const startListener = (evt) => onScrollStart(evt);
-    const endListener = (evt) => onScrollEnd(evt);
-    contentContainer.addEventListener("mousemove", moveListener);
-    contentContainer.addEventListener("mousedown", startListener);
-    contentContainer.addEventListener("mouseup", endListener);
-    contentContainer.addEventListener("mouseout", endListener);
+    contentContainer.addEventListener("mousemove", onScrollMove);
+    contentContainer.addEventListener("mousedown", onScrollStart);
+    contentContainer.addEventListener("mouseup", onScrollEnd);
+    contentContainer.addEventListener("mouseout", onScrollEnd);
     return () => {
-      contentContainer.removeEventListener("mousemove", moveListener);
-      contentContainer.removeEventListener("mousedown", startListener);
-      contentContainer.removeEventListener("mouseup", endListener);
-      contentContainer.removeEventListener("mouseout", endListener);
+      contentContainer.removeEventListener("mousemove", onScrollMove);
+      contentContainer.removeEventListener("mousedown", onScrollStart);
+      contentContainer.removeEventListener("mouseup", onScrollEnd);
+      contentContainer.removeEventListener("mouseout", onScrollEnd);
     };
   }, [verticalScrollbarRef, horizontalContainerRef, verticalGanttContainerRef]);
   return /* @__PURE__ */ jsxs(
@@ -18746,7 +18714,6 @@ const Gantt = (props) => {
     );
     return chosen;
   }, [distances, ganttFullHeight, clientHeight, measuredHeight]);
-  const isCssHeight = typeof clientHeight === "string";
   const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask] = useMemo(
     () => getMapTaskToRowIndex(visibleTasks, comparisonLevels),
     [visibleTasks, comparisonLevels]
@@ -18940,30 +18907,14 @@ const Gantt = (props) => {
       return () => {
       };
     }
-    const measureWithAncestorFallback = (el) => {
-      const rect = el.getBoundingClientRect();
-      let height = rect.height;
-      try {
-        let p = el.parentElement;
-        while (p) {
-          const pRect = p.getBoundingClientRect();
-          if (pRect.height > height + 1) {
-            height = pRect.height;
-            break;
-          }
-          p = p.parentElement;
-        }
-      } catch (e) {
-      }
-      return height;
-    };
-    setMeasuredHeight(measureWithAncestorFallback(node));
+    setMeasuredHeight(node.getBoundingClientRect().height);
     const ResizeObserverCtor = window.ResizeObserver;
     let ro;
     if (typeof ResizeObserverCtor === "function") {
       const ctor = ResizeObserverCtor;
       ro = new ctor(() => {
-        setMeasuredHeight(measureWithAncestorFallback(node));
+        const rect = node.getBoundingClientRect();
+        setMeasuredHeight(rect.height);
       });
       ro.observe(node);
     }
@@ -19875,8 +19826,6 @@ const Gantt = (props) => {
       distances,
       fullRowHeight,
       ganttFullHeight,
-      ganttHeight,
-      useCssHeight: isCssHeight,
       getTaskCurrentState,
       handleAddTask,
       handleDeleteTasks,
@@ -19906,8 +19855,6 @@ const Gantt = (props) => {
       distances,
       fullRowHeight,
       ganttFullHeight,
-      ganttHeight,
-      isCssHeight,
       getTaskCurrentState,
       handleAddTask,
       handleDeleteTasks,
@@ -19931,7 +19878,7 @@ const Gantt = (props) => {
   return /* @__PURE__ */ jsx(GanttThemeProvider, { theme, children: (cssVars) => /* @__PURE__ */ jsx(GanttLocaleProvider, { locale, children: /* @__PURE__ */ jsxs(
     "div",
     {
-      style: typeof clientHeight === "string" ? { ...cssVars, height: clientHeight } : cssVars,
+      style: cssVars,
       className: `${styles$2.wrapper} gantt`,
       onKeyDown: handleKeyDown,
       tabIndex: 0,
@@ -19948,8 +19895,6 @@ const Gantt = (props) => {
             fullRowHeight,
             fullSvgWidth,
             ganttFullHeight,
-            ganttHeight,
-            useCssHeight: typeof clientHeight === "string",
             ganttSVGRef,
             ganttTodayProps: gridProps,
             horizontalContainerRef,

package/dist/gantt-task-react.umd.js

@@ -10674,14 +10674,14 @@
     );
   };
   const TaskListTable = React.memo(TaskListTableDefaultInner);
-  const taskListRoot = "_taskListRoot_3y2l5_1";
-  const taskListHorizontalScroll = "_taskListHorizontalScroll_3y2l5_13";
-  const taskListResizer = "_taskListResizer_3y2l5_69";
-  const horizontalContainer$1 = "_horizontalContainer_3y2l5_133";
-  const tableWrapper = "_tableWrapper_3y2l5_145";
-  const scrollToTop = "_scrollToTop_3y2l5_153";
-  const scrollToBottom = "_scrollToBottom_3y2l5_169";
-  const hidden = "_hidden_3y2l5_185";
+  const taskListRoot = "_taskListRoot_3vx1x_1";
+  const taskListHorizontalScroll = "_taskListHorizontalScroll_3vx1x_19";
+  const taskListResizer = "_taskListResizer_3vx1x_81";
+  const horizontalContainer$1 = "_horizontalContainer_3vx1x_145";
+  const tableWrapper = "_tableWrapper_3vx1x_161";
+  const scrollToTop = "_scrollToTop_3vx1x_175";
+  const scrollToBottom = "_scrollToBottom_3vx1x_191";
+  const hidden = "_hidden_3vx1x_207";
   const styles$d = {
     taskListRoot,
     taskListHorizontalScroll,
@@ -10737,9 +10737,7 @@
     tasks,
     onResizeColumn,
     canReorderTasks,
-    tableBottom,
-    ganttHeight,
-    useCssHeight
+    tableBottom
   }) => {
     const [
       columns,
@@ -10847,29 +10845,15 @@
                   ref: taskListContainerRef,
                   className: styles$d.horizontalContainer,
                   style: {
-                    // If consumer asked for CSS height (e.g. "100%"), let the
-                    // container fill its parent. Otherwise compute pixel height.
-                    height: ganttHeight == null && ganttHeight !== 0 && (typeof ganttHeight === "undefined" || useCssHeight) ? "100%" : (() => {
-                      const minRowsHeight = distances.minimumRowDisplayed * distances.rowHeight;
-                      const resolved = typeof ganttHeight === "number" ? ganttHeight : void 0;
-                      const visible = Math.max(
-                        minRowsHeight,
-                        Math.min(ganttFullHeight, resolved ?? ganttFullHeight)
-                      );
-                      return visible;
-                    })(),
                     width: taskListWidth
                   },
                   children: /* @__PURE__ */ jsxRuntime.jsx(
                     "div",
                     {
                       style: {
-                        height: Math.max(
-                          ganttFullHeight,
-                          distances.minimumRowDisplayed * distances.rowHeight
-                        ),
                         backgroundSize: `100% ${fullRowHeight * 2}px`,
-                        backgroundImage: `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`
+                        backgroundImage: `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`,
+                        height: "100%"
                       },
                       children: /* @__PURE__ */ jsxRuntime.jsx(
                         RenderTaskListTable,
@@ -13180,12 +13164,12 @@
     ] });
   };
   const TaskGanttContent = React.memo(TaskGanttContentInner);
-  const ganttVerticalContainer = "_ganttVerticalContainer_1hrwo_1";
-  const horizontalContainer = "_horizontalContainer_1hrwo_75";
-  const ganttHeader = "_ganttHeader_1hrwo_87";
-  const ganttBodyScroll = "_ganttBodyScroll_1hrwo_97";
-  const wrapper = "_wrapper_1hrwo_109";
-  const calendarDragging = "_calendarDragging_1hrwo_131";
+  const ganttVerticalContainer = "_ganttVerticalContainer_7rmhe_1";
+  const horizontalContainer = "_horizontalContainer_7rmhe_79";
+  const ganttHeader = "_ganttHeader_7rmhe_95";
+  const ganttBodyScroll = "_ganttBodyScroll_7rmhe_105";
+  const wrapper = "_wrapper_7rmhe_121";
+  const calendarDragging = "_calendarDragging_7rmhe_147";
   const styles$2 = {
     ganttVerticalContainer,
     horizontalContainer,
@@ -13210,32 +13194,19 @@
       horizontalContainerRef,
       onVerticalScrollbarScrollX,
       verticalGanttContainerRef,
-      verticalScrollbarRef,
-      ganttHeight
+      verticalScrollbarRef
     } = props;
     const contentRef = React.useRef(null);
     const moveStateVertRef = React.useRef(null);
     const moveStateHorRef = React.useRef(null);
     const moveStateScrollRef = React.useRef(null);
-    const containerStyle = React.useMemo(() => {
-      const minRowsHeight = minimumRowDisplayed * rowHeight;
-      const resolved = typeof ganttHeight === "number" ? ganttHeight : void 0;
-      const visible = Math.max(
-        minRowsHeight,
-        Math.min(ganttFullHeight, resolved ?? ganttFullHeight)
-      );
-      return {
-        height: props.useCssHeight ? "100%" : visible,
+    const containerStyle = React.useMemo(
+      () => ({
+        height: "100%",
         width: fullSvgWidth
-      };
-    }, [
-      ganttFullHeight,
-      minimumRowDisplayed,
-      rowHeight,
-      fullSvgWidth,
-      ganttHeight,
-      props.useCssHeight
-    ]);
+      }),
+      [fullSvgWidth]
+    );
     const gridStyle = React.useMemo(
       () => ({
         height: Math.max(ganttFullHeight, minimumRowDisplayed * rowHeight),
@@ -13319,18 +13290,15 @@
         moveStateHorRef.current = null;
         contentContainer.classList.remove(styles$2.calendarDragging);
       };
-      const moveListener = (evt) => onScrollMove(evt);
-      const startListener = (evt) => onScrollStart(evt);
-      const endListener = (evt) => onScrollEnd(evt);
-      contentContainer.addEventListener("mousemove", moveListener);
-      contentContainer.addEventListener("mousedown", startListener);
-      contentContainer.addEventListener("mouseup", endListener);
-      contentContainer.addEventListener("mouseout", endListener);
+      contentContainer.addEventListener("mousemove", onScrollMove);
+      contentContainer.addEventListener("mousedown", onScrollStart);
+      contentContainer.addEventListener("mouseup", onScrollEnd);
+      contentContainer.addEventListener("mouseout", onScrollEnd);
       return () => {
-        contentContainer.removeEventListener("mousemove", moveListener);
-        contentContainer.removeEventListener("mousedown", startListener);
-        contentContainer.removeEventListener("mouseup", endListener);
-        contentContainer.removeEventListener("mouseout", endListener);
+        contentContainer.removeEventListener("mousemove", onScrollMove);
+        contentContainer.removeEventListener("mousedown", onScrollStart);
+        contentContainer.removeEventListener("mouseup", onScrollEnd);
+        contentContainer.removeEventListener("mouseout", onScrollEnd);
       };
     }, [verticalScrollbarRef, horizontalContainerRef, verticalGanttContainerRef]);
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -18763,7 +18731,6 @@
       );
       return chosen;
     }, [distances, ganttFullHeight, clientHeight, measuredHeight]);
-    const isCssHeight = typeof clientHeight === "string";
     const [taskToRowIndexMap, rowIndexToTaskMap, mapGlobalRowIndexToTask] = React.useMemo(
       () => getMapTaskToRowIndex(visibleTasks, comparisonLevels),
       [visibleTasks, comparisonLevels]
@@ -18957,30 +18924,14 @@
         return () => {
         };
       }
-      const measureWithAncestorFallback = (el) => {
-        const rect = el.getBoundingClientRect();
-        let height = rect.height;
-        try {
-          let p = el.parentElement;
-          while (p) {
-            const pRect = p.getBoundingClientRect();
-            if (pRect.height > height + 1) {
-              height = pRect.height;
-              break;
-            }
-            p = p.parentElement;
-          }
-        } catch (e) {
-        }
-        return height;
-      };
-      setMeasuredHeight(measureWithAncestorFallback(node));
+      setMeasuredHeight(node.getBoundingClientRect().height);
       const ResizeObserverCtor = window.ResizeObserver;
       let ro;
       if (typeof ResizeObserverCtor === "function") {
         const ctor = ResizeObserverCtor;
         ro = new ctor(() => {
-          setMeasuredHeight(measureWithAncestorFallback(node));
+          const rect = node.getBoundingClientRect();
+          setMeasuredHeight(rect.height);
         });
         ro.observe(node);
       }
@@ -19892,8 +19843,6 @@
         distances,
         fullRowHeight,
         ganttFullHeight,
-        ganttHeight,
-        useCssHeight: isCssHeight,
         getTaskCurrentState,
         handleAddTask,
         handleDeleteTasks,
@@ -19923,8 +19872,6 @@
         distances,
         fullRowHeight,
         ganttFullHeight,
-        ganttHeight,
-        isCssHeight,
         getTaskCurrentState,
         handleAddTask,
         handleDeleteTasks,
@@ -19948,7 +19895,7 @@
     return /* @__PURE__ */ jsxRuntime.jsx(GanttThemeProvider, { theme, children: (cssVars) => /* @__PURE__ */ jsxRuntime.jsx(GanttLocaleProvider, { locale, children: /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        style: typeof clientHeight === "string" ? { ...cssVars, height: clientHeight } : cssVars,
+        style: cssVars,
         className: `${styles$2.wrapper} gantt`,
         onKeyDown: handleKeyDown,
         tabIndex: 0,
@@ -19965,8 +19912,6 @@
               fullRowHeight,
               fullSvgWidth,
               ganttFullHeight,
-              ganttHeight,
-              useCssHeight: typeof clientHeight === "string",
               ganttSVGRef,
               ganttTodayProps: gridProps,
               horizontalContainerRef,

package/dist/style.css

@@ -282,26 +282,32 @@
   border-bottom: 1px solid var(--gantt-divider-color);
   table-layout: fixed;
 }
-._taskListRoot_3y2l5_1 {
+._taskListRoot_3vx1x_1 {
   position: relative;
   /*noinspection CssUnresolvedCustomProperty*/
   border-left: 1px solid var(--gantt-table-divider-color, var(--gantt-divider-color));
+  height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 
-._taskListHorizontalScroll_3y2l5_13 {
+._taskListHorizontalScroll_3vx1x_19 {
   overflow-x: scroll;
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
 }
 
-._taskListHorizontalScroll_3y2l5_13::-webkit-scrollbar {
+._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar {
   width: 1rem;
   height: 1rem;
 }
 
-._taskListHorizontalScroll_3y2l5_13::-webkit-scrollbar-corner {
+._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-corner {
   background: transparent;
 }
 
-._taskListHorizontalScroll_3y2l5_13::-webkit-scrollbar-thumb {
+._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-thumb {
   border: 4px solid transparent;
   /*noinspection CssUnresolvedCustomProperty*/
   background: var(--gantt-scrollbar-thumb-color);
@@ -309,14 +315,14 @@
   background-clip: padding-box;
 }
 
-._taskListHorizontalScroll_3y2l5_13::-webkit-scrollbar-thumb:hover {
+._taskListHorizontalScroll_3vx1x_19::-webkit-scrollbar-thumb:hover {
   border: 2px solid transparent;
   /*noinspection CssUnresolvedCustomProperty*/
   background: var(--gantt-scrollbar-thumb-color);
   background-clip: padding-box;
 }
 
-._taskListResizer_3y2l5_69 {
+._taskListResizer_3vx1x_81 {
   position: absolute;
   top: 0;
   right: -3px;
@@ -328,16 +334,16 @@
 }
 
 /*noinspection CssUnresolvedCustomProperty*/
-._taskListResizer_3y2l5_69:hover {
+._taskListResizer_3vx1x_81:hover {
   background-color: var(--gantt-table-hover-action-color);
   filter: var(--gantt-hover-filter);
 }
 
-._taskListResizer_3y2l5_69:hover::before {
+._taskListResizer_3vx1x_81:hover::before {
   display: none;
 }
 
-._taskListResizer_3y2l5_69::before {
+._taskListResizer_3vx1x_81::before {
   content: "";
   position: absolute;
   top: 0;
@@ -348,17 +354,22 @@
   background-color: var(--gantt-table-resize-color, var(--gantt-divider-color));
 }
 
-._horizontalContainer_3y2l5_133 {
+._horizontalContainer_3vx1x_145 {
   margin: 0;
   padding: 0;
   overflow: hidden;
+  height: 100%;
+  min-height: 0;
 }
 
-._tableWrapper_3y2l5_145 {
+._tableWrapper_3vx1x_161 {
   position: relative;
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
 }
 
-._scrollToTop_3y2l5_153 {
+._scrollToTop_3vx1x_175 {
   position: absolute;
   top: 0;
   left: 0;
@@ -366,7 +377,7 @@
   height: 20px;
 }
 
-._scrollToBottom_3y2l5_169 {
+._scrollToBottom_3vx1x_191 {
   position: absolute;
   bottom: 0;
   left: 0;
@@ -374,7 +385,7 @@
   height: 20px;
 }
 
-._hidden_3y2l5_185 {
+._hidden_3vx1x_207 {
   display: none;
 }
 ._ganttToday_1oyhk_1 {
@@ -568,29 +579,31 @@
   user-select: none;
   stroke-width: 0;
 }
-._ganttVerticalContainer_1hrwo_1 {
+._ganttVerticalContainer_7rmhe_1 {
   display: flex;
   flex-direction: column;
-  overflow-x: scroll;
-  overflow-y: scroll;
+  overflow-x: hidden;
+  overflow-y: hidden;
   font-size: 0;
   margin: 0;
   padding: 0;
   /*noinspection CssUnresolvedCustomProperty*/
   border-right: 1px solid var(--gantt-calendar-divider-color, var(--gantt-divider-color));
   flex-grow: 1;
+  height: 100%;
+  min-height: 0;
 }
 
-._ganttVerticalContainer_1hrwo_1::-webkit-scrollbar {
+._ganttVerticalContainer_7rmhe_1::-webkit-scrollbar {
   width: 1rem;
   height: 1rem;
 }
 
-._ganttVerticalContainer_1hrwo_1::-webkit-scrollbar-corner {
+._ganttVerticalContainer_7rmhe_1::-webkit-scrollbar-corner {
   background: transparent;
 }
 
-._ganttVerticalContainer_1hrwo_1::-webkit-scrollbar-thumb {
+._ganttVerticalContainer_7rmhe_1::-webkit-scrollbar-thumb {
   border: 4px solid transparent;
   /*noinspection CssUnresolvedCustomProperty*/
   background: var(--gantt-scrollbar-thumb-color);
@@ -598,31 +611,35 @@
   background-clip: padding-box;
 }
 
-._ganttVerticalContainer_1hrwo_1::-webkit-scrollbar-thumb:hover {
+._ganttVerticalContainer_7rmhe_1::-webkit-scrollbar-thumb:hover {
   border: 2px solid transparent;
   /*noinspection CssUnresolvedCustomProperty*/
   background: var(--gantt-scrollbar-thumb-color);
   background-clip: padding-box;
 }
 
-._horizontalContainer_1hrwo_75 {
+._horizontalContainer_7rmhe_79 {
   margin: 0;
   padding: 0;
   overflow: hidden;
+  height: 100%;
+  min-height: 0;
 }
 
-._ganttHeader_1hrwo_87 {
+._ganttHeader_7rmhe_95 {
   flex: 0 0 auto;
   z-index: 3;
 }
 
-._ganttBodyScroll_1hrwo_97 {
+._ganttBodyScroll_7rmhe_105 {
   flex: 1 1 auto;
   overflow-y: auto;
   overflow-x: hidden;
+  min-height: 0;
+  height: 100%;
 }
 
-._wrapper_1hrwo_109 {
+._wrapper_7rmhe_121 {
   display: flex;
   padding: 0;
   margin: 0;
@@ -631,9 +648,11 @@
   position: relative;
   /*noinspection CssUnresolvedCustomProperty*/
   border-bottom: 1px solid var(--gantt-divider-color);
+  height: 100%;
+  min-height: 0;
 }
 
-._calendarDragging_1hrwo_131 {
+._calendarDragging_7rmhe_147 {
   cursor: grabbing;
 }
 /*noinspection CssUnresolvedCustomProperty*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gantt-task-react-v",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "aguilanbon",
   "homepage": "https://github.com/aguilanbon/gantt-task-react-v",
@@ -23,7 +23,7 @@
   ],
   "scripts": {
     "storybook": "start-storybook -p 6006",
-    "build": "vite build && tsc",
+  "build": "vite build && node -e \"require('child_process').execSync('tsc', {stdio:'inherit'})\"",
     "start": "vite --host",
     "prepare": "npm run build",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",