gantt-task-react-v 1.2.0 → 1.2.1

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

@@ -7473,11 +7473,11 @@
   function useScrollIntent(_ref2) {
     let {
       delta,
-      disabled
+      disabled: disabled2
     } = _ref2;
     const previousDelta = usePrevious(delta);
     return useLazyMemo((previousIntent) => {
-      if (disabled || !previousDelta || !previousIntent) {
+      if (disabled2 || !previousDelta || !previousIntent) {
         return defaultScrollIntent;
       }
       const direction = {
@@ -7494,7 +7494,7 @@
           [Direction.Forward]: previousIntent.y[Direction.Forward] || direction.y === 1
         }
       };
-    }, [disabled, delta, previousDelta]);
+    }, [disabled2, delta, previousDelta]);
   }
   function useCachedNode(draggableNodes, id) {
     const draggableNode = id !== null ? draggableNodes.get(id) : void 0;
@@ -7543,8 +7543,8 @@
       strategy
     } = config;
     const containersRef = React.useRef(containers);
-    const disabled = isDisabled();
-    const disabledRef = useLatestValue(disabled);
+    const disabled2 = isDisabled();
+    const disabledRef = useLatestValue(disabled2);
     const measureDroppableContainers = React.useCallback(function(ids2) {
       if (ids2 === void 0) {
         ids2 = [];
@@ -7561,7 +7561,7 @@
     }, [disabledRef]);
     const timeoutId = React.useRef(null);
     const droppableRects = useLazyMemo((previousValue) => {
-      if (disabled && !dragging2) {
+      if (disabled2 && !dragging2) {
         return defaultValue;
       }
       if (!previousValue || previousValue === defaultValue || containersRef.current !== containers || queue != null) {
@@ -7584,19 +7584,19 @@
         return map;
       }
       return previousValue;
-    }, [containers, queue, dragging2, disabled, measure]);
+    }, [containers, queue, dragging2, disabled2, measure]);
     React.useEffect(() => {
       containersRef.current = containers;
     }, [containers]);
     React.useEffect(
       () => {
-        if (disabled) {
+        if (disabled2) {
           return;
         }
         measureDroppableContainers();
       },
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [dragging2, disabled]
+      [dragging2, disabled2]
     );
     React.useEffect(
       () => {
@@ -7609,7 +7609,7 @@
     );
     React.useEffect(
       () => {
-        if (disabled || typeof frequency !== "number" || timeoutId.current !== null) {
+        if (disabled2 || typeof frequency !== "number" || timeoutId.current !== null) {
           return;
         }
         timeoutId.current = setTimeout(() => {
@@ -7618,7 +7618,7 @@
         }, frequency);
       },
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [frequency, disabled, measureDroppableContainers, ...dependencies]
+      [frequency, disabled2, measureDroppableContainers, ...dependencies]
     );
     return {
       droppableRects,
@@ -7653,18 +7653,18 @@
   function useMutationObserver(_ref) {
     let {
       callback,
-      disabled
+      disabled: disabled2
     } = _ref;
     const handleMutations = useEvent(callback);
     const mutationObserver = React.useMemo(() => {
-      if (disabled || typeof window === "undefined" || typeof window.MutationObserver === "undefined") {
+      if (disabled2 || typeof window === "undefined" || typeof window.MutationObserver === "undefined") {
         return void 0;
       }
       const {
         MutationObserver
       } = window;
       return new MutationObserver(handleMutations);
-    }, [handleMutations, disabled]);
+    }, [handleMutations, disabled2]);
     React.useEffect(() => {
       return () => mutationObserver == null ? void 0 : mutationObserver.disconnect();
     }, [mutationObserver]);
@@ -7673,12 +7673,12 @@
   function useResizeObserver(_ref) {
     let {
       callback,
-      disabled
+      disabled: disabled2
     } = _ref;
     const handleResize = useEvent(callback);
     const resizeObserver = React.useMemo(
       () => {
-        if (disabled || typeof window === "undefined" || typeof window.ResizeObserver === "undefined") {
+        if (disabled2 || typeof window === "undefined" || typeof window.ResizeObserver === "undefined") {
           return void 0;
         }
         const {
@@ -7687,7 +7687,7 @@
         return new ResizeObserver2(handleResize);
       },
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [disabled]
+      [disabled2]
     );
     React.useEffect(() => {
       return () => resizeObserver == null ? void 0 : resizeObserver.disconnect();
@@ -8005,9 +8005,9 @@
     getEnabled() {
       return this.toArray().filter((_ref) => {
         let {
-          disabled
+          disabled: disabled2
         } = _ref;
-        return !disabled;
+        return !disabled2;
       });
     }
     getNodeFor(id) {
@@ -8137,7 +8137,7 @@
         const {
           id,
           key: key2,
-          disabled
+          disabled: disabled2
         } = action;
         const element = state.droppable.containers.get(id);
         if (!element || key2 !== element.key) {
@@ -8146,7 +8146,7 @@
         const containers = new DroppableContainersMap(state.droppable.containers);
         containers.set(id, {
           ...element,
-          disabled
+          disabled: disabled2
         });
         return {
           ...state,
@@ -8182,7 +8182,7 @@
   }
   function RestoreFocus(_ref) {
     let {
-      disabled
+      disabled: disabled2
     } = _ref;
     const {
       active,
@@ -8192,7 +8192,7 @@
     const previousActivatorEvent = usePrevious(activatorEvent);
     const previousActiveId = usePrevious(active == null ? void 0 : active.id);
     React.useEffect(() => {
-      if (disabled) {
+      if (disabled2) {
         return;
       }
       if (!activatorEvent && previousActivatorEvent && previousActiveId != null) {
@@ -8226,7 +8226,7 @@
           }
         });
       }
-    }, [activatorEvent, disabled, draggableNodes, previousActiveId, previousActivatorEvent]);
+    }, [activatorEvent, disabled2, draggableNodes, previousActiveId, previousActivatorEvent]);
     return null;
   }
   function applyModifiers(modifiers, _ref) {
@@ -8277,8 +8277,8 @@
       y: config
     } : config;
     useIsomorphicLayoutEffect(() => {
-      const disabled = !x && !y;
-      if (disabled || !activeNode) {
+      const disabled2 = !x && !y;
+      if (disabled2 || !activeNode) {
         initialized.current = false;
         return;
       }
@@ -8785,7 +8785,7 @@
     let {
       id,
       data,
-      disabled = false,
+      disabled: disabled2 = false,
       attributes
     } = _ref;
     const key2 = useUniqueId(ID_PREFIX$1);
@@ -8831,18 +8831,18 @@
     const memoizedAttributes = React.useMemo(() => ({
       role,
       tabIndex,
-      "aria-disabled": disabled,
+      "aria-disabled": disabled2,
       "aria-pressed": isDragging && role === defaultRole ? true : void 0,
       "aria-roledescription": roleDescription,
       "aria-describedby": ariaDescribedById.draggable
-    }), [disabled, role, tabIndex, isDragging, roleDescription, ariaDescribedById.draggable]);
+    }), [disabled2, role, tabIndex, isDragging, roleDescription, ariaDescribedById.draggable]);
     return {
       active,
       activatorEvent,
       activeNodeRect,
       attributes: memoizedAttributes,
       isDragging,
-      listeners: disabled ? void 0 : listeners,
+      listeners: disabled2 ? void 0 : listeners,
       node,
       over,
       setNodeRef,
@@ -8860,7 +8860,7 @@
   function useDroppable(_ref) {
     let {
       data,
-      disabled = false,
+      disabled: disabled2 = false,
       id,
       resizeObserverConfig
     } = _ref;
@@ -8872,7 +8872,7 @@
       measureDroppableContainers
     } = React.useContext(InternalContext);
     const previous = React.useRef({
-      disabled
+      disabled: disabled2
     });
     const resizeObserverConnected = React.useRef(false);
     const rect = React.useRef(null);
@@ -8936,7 +8936,7 @@
           element: {
             id,
             key: key2,
-            disabled,
+            disabled: disabled2,
             node: nodeRef,
             rect,
             data: dataRef
@@ -8952,16 +8952,16 @@
       [id]
     );
     React.useEffect(() => {
-      if (disabled !== previous.current.disabled) {
+      if (disabled2 !== previous.current.disabled) {
         dispatch({
           type: Action.SetDroppableDisabled,
           id,
           key: key2,
-          disabled
+          disabled: disabled2
         });
-        previous.current.disabled = disabled;
+        previous.current.disabled = disabled2;
       }
-    }, [id, key2, disabled, dispatch]);
+    }, [id, key2, disabled2, dispatch]);
     return {
       active,
       rect,
@@ -9352,14 +9352,14 @@
     }
     return true;
   }
-  function normalizeDisabled(disabled) {
-    if (typeof disabled === "boolean") {
+  function normalizeDisabled(disabled2) {
+    if (typeof disabled2 === "boolean") {
       return {
-        draggable: disabled,
-        droppable: disabled
+        draggable: disabled2,
+        droppable: disabled2
       };
     }
-    return disabled;
+    return disabled2;
   }
   const rectSortingStrategy = (_ref) => {
     let {
@@ -9481,7 +9481,7 @@
     const previousItemsRef = React.useRef(items);
     const itemsHaveChanged = !itemsEqual(items, previousItemsRef.current);
     const disableTransforms = overIndex !== -1 && activeIndex === -1 || itemsHaveChanged;
-    const disabled = normalizeDisabled(disabledProp);
+    const disabled2 = normalizeDisabled(disabledProp);
     useIsomorphicLayoutEffect(() => {
       if (itemsHaveChanged && isDragging) {
         measureDroppableContainers(items);
@@ -9494,7 +9494,7 @@
       () => ({
         activeIndex,
         containerId,
-        disabled,
+        disabled: disabled2,
         disableTransforms,
         items,
         overIndex,
@@ -9503,7 +9503,7 @@
         strategy
       }),
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [activeIndex, containerId, disabled.draggable, disabled.droppable, disableTransforms, items, overIndex, droppableRects, useDragOverlay, strategy]
+      [activeIndex, containerId, disabled2.draggable, disabled2.droppable, disableTransforms, items, overIndex, droppableRects, useDragOverlay, strategy]
     );
     return React.createElement(Context.Provider, {
       value: contextValue
@@ -9556,7 +9556,7 @@
   };
   function useDerivedTransform(_ref) {
     let {
-      disabled,
+      disabled: disabled2,
       index: index2,
       node,
       rect
@@ -9564,7 +9564,7 @@
     const [derivedTransform, setDerivedtransform] = React.useState(null);
     const previousIndex = React.useRef(index2);
     useIsomorphicLayoutEffect(() => {
-      if (!disabled && index2 !== previousIndex.current && node.current) {
+      if (!disabled2 && index2 !== previousIndex.current && node.current) {
         const initial = rect.current;
         if (initial) {
           const current = getClientRect(node.current, {
@@ -9584,7 +9584,7 @@
       if (index2 !== previousIndex.current) {
         previousIndex.current = index2;
       }
-    }, [disabled, index2, node, rect]);
+    }, [disabled2, index2, node, rect]);
     React.useEffect(() => {
       if (derivedTransform) {
         setDerivedtransform(null);
@@ -9615,7 +9615,7 @@
       useDragOverlay,
       strategy: globalStrategy
     } = React.useContext(Context);
-    const disabled = normalizeLocalDisabled(localDisabled, globalDisabled);
+    const disabled2 = normalizeLocalDisabled(localDisabled, globalDisabled);
     const index2 = items.indexOf(id);
     const data = React.useMemo(() => ({
       sortable: {
@@ -9634,7 +9634,7 @@
     } = useDroppable({
       id,
       data,
-      disabled: disabled.droppable,
+      disabled: disabled2.droppable,
       resizeObserverConfig: {
         updateMeasurementsFor: itemsAfterCurrentSortable,
         ...resizeObserverConfig
@@ -9658,7 +9658,7 @@
         ...defaultAttributes,
         ...userDefinedAttributes
       },
-      disabled: disabled.draggable
+      disabled: disabled2.draggable
     });
     const setNodeRef = useCombinedRefs(setDroppableNodeRef, setDraggableNodeRef);
     const isSorting = Boolean(active);
@@ -10654,14 +10654,15 @@
     );
   };
   const TaskListTable = React.memo(TaskListTableDefaultInner);
-  const taskListRoot = "_taskListRoot_yoz76_1";
-  const taskListHorizontalScroll = "_taskListHorizontalScroll_yoz76_19";
-  const taskListResizer = "_taskListResizer_yoz76_81";
-  const horizontalContainer$1 = "_horizontalContainer_yoz76_145";
-  const tableWrapper = "_tableWrapper_yoz76_159";
-  const scrollToTop = "_scrollToTop_yoz76_173";
-  const scrollToBottom = "_scrollToBottom_yoz76_189";
-  const hidden = "_hidden_yoz76_205";
+  const taskListRoot = "_taskListRoot_yadug_1";
+  const taskListHorizontalScroll = "_taskListHorizontalScroll_yadug_19";
+  const taskListResizer = "_taskListResizer_yadug_81";
+  const horizontalContainer$1 = "_horizontalContainer_yadug_145";
+  const tableWrapper = "_tableWrapper_yadug_159";
+  const scrollToTop = "_scrollToTop_yadug_173";
+  const scrollToBottom = "_scrollToBottom_yadug_189";
+  const hidden = "_hidden_yadug_205";
+  const disabled$1 = "_disabled_yadug_213";
   const styles$d = {
     taskListRoot,
     taskListHorizontalScroll,
@@ -10670,7 +10671,8 @@
     tableWrapper,
     scrollToTop,
     scrollToBottom,
-    hidden
+    hidden,
+    disabled: disabled$1
   };
   const checkHasChildren = (task, childTasksMap) => {
     const { id, comparisonLevel = 1 } = task;
@@ -10719,7 +10721,8 @@
     tasks,
     onResizeColumn,
     canReorderTasks,
-    tableBottom
+    tableBottom,
+    isLoading = false
   }) => {
     const [
       columns,
@@ -10821,83 +10824,89 @@
                 canResizeColumns
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles$d.tableWrapper, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  ref: taskListContainerRef,
-                  className: styles$d.horizontalContainer,
-                  style: {
-                    height: Math.max(
-                      ganttHeight - ((tableBottom == null ? void 0 : tableBottom.height) || 0),
-                      distances.minimumRowDisplayed * distances.rowHeight
-                    ),
-                    width: taskListWidth
-                  },
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                className: `${styles$d.tableWrapper} ${isLoading ? styles$d.disabled : ""}`,
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
                     "div",
                     {
+                      ref: taskListContainerRef,
+                      className: styles$d.horizontalContainer,
                       style: {
                         height: Math.max(
-                          ganttFullHeight,
+                          ganttHeight - ((tableBottom == null ? void 0 : tableBottom.height) || 0),
                           distances.minimumRowDisplayed * distances.rowHeight
                         ),
-                        backgroundSize: `100% ${fullRowHeight * 2}px`,
-                        backgroundImage: `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`
+                        width: taskListWidth
                       },
                       children: /* @__PURE__ */ jsxRuntime.jsx(
-                        RenderTaskListTable,
+                        "div",
                         {
-                          ganttRef,
-                          getTableRowProps,
-                          canMoveTasks: canReorderTasks,
-                          allowMoveTask: allowReorderTask,
-                          childTasksMap,
-                          columns,
-                          cutIdsMirror,
-                          dateSetup,
-                          dependencyMap,
-                          distances,
-                          fullRowHeight,
-                          ganttFullHeight,
-                          getTaskCurrentState,
-                          handleAddTask,
-                          handleDeleteTasks,
-                          handleEditTask,
-                          handleMoveTaskBefore,
-                          handleMoveTaskAfter,
-                          handleMoveTasksInside,
-                          handleOpenContextMenu,
-                          icons,
-                          isShowTaskNumbers,
-                          mapTaskToNestedIndex,
-                          onClick,
-                          onExpanderClick,
-                          renderedIndexes,
-                          scrollToTask,
-                          selectTaskOnMouseDown,
-                          selectedIdsMirror,
-                          taskListWidth,
-                          tasks
+                          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)`
+                          },
+                          children: /* @__PURE__ */ jsxRuntime.jsx(
+                            RenderTaskListTable,
+                            {
+                              ganttRef,
+                              getTableRowProps,
+                              canMoveTasks: canReorderTasks,
+                              allowMoveTask: allowReorderTask,
+                              childTasksMap,
+                              columns,
+                              cutIdsMirror,
+                              dateSetup,
+                              dependencyMap,
+                              distances,
+                              fullRowHeight,
+                              ganttFullHeight,
+                              getTaskCurrentState,
+                              handleAddTask,
+                              handleDeleteTasks,
+                              handleEditTask,
+                              handleMoveTaskBefore,
+                              handleMoveTaskAfter,
+                              handleMoveTasksInside,
+                              handleOpenContextMenu,
+                              icons,
+                              isShowTaskNumbers,
+                              mapTaskToNestedIndex,
+                              onClick,
+                              onExpanderClick,
+                              renderedIndexes,
+                              scrollToTask,
+                              selectTaskOnMouseDown,
+                              selectedIdsMirror,
+                              taskListWidth,
+                              tasks
+                            }
+                          )
                         }
                       )
                     }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: `${styles$d.scrollToTop} ${!renderedIndexes || renderedIndexes[2] ? styles$d.hidden : ""}`
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: `${styles$d.scrollToBottom} ${!renderedIndexes || renderedIndexes[3] ? styles$d.hidden : ""}`
+                    }
                   )
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: `${styles$d.scrollToTop} ${!renderedIndexes || renderedIndexes[2] ? styles$d.hidden : ""}`
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: `${styles$d.scrollToBottom} ${!renderedIndexes || renderedIndexes[3] ? styles$d.hidden : ""}`
-                }
-              )
-            ] }),
+                ]
+              }
+            ),
             (tableBottom == null ? void 0 : tableBottom.renderContent) && (tableBottom == null ? void 0 : tableBottom.height) && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: tableBottom.height, width: "100%" }, children: tableBottom.renderContent() })
           ]
         }
@@ -13380,15 +13389,17 @@
     ] });
   };
   const TaskGanttContent = React.memo(TaskGanttContentInner);
-  const ganttVerticalContainer = "_ganttVerticalContainer_1wr55_1";
-  const horizontalContainer = "_horizontalContainer_1wr55_73";
-  const wrapper = "_wrapper_1wr55_85";
-  const calendarDragging = "_calendarDragging_1wr55_109";
+  const ganttVerticalContainer = "_ganttVerticalContainer_1czjq_1";
+  const horizontalContainer = "_horizontalContainer_1czjq_73";
+  const wrapper = "_wrapper_1czjq_85";
+  const calendarDragging = "_calendarDragging_1czjq_109";
+  const disabled = "_disabled_1czjq_117";
   const styles$2 = {
     ganttVerticalContainer,
     horizontalContainer,
     wrapper,
-    calendarDragging
+    calendarDragging,
+    disabled
   };
   const TaskGanttInner = (props) => {
     const {
@@ -13408,7 +13419,8 @@
       onVerticalScrollbarScrollX,
       verticalGanttContainerRef,
       verticalScrollbarRef,
-      onOpenGanttContextMenu
+      onOpenGanttContextMenu,
+      isLoading = false
     } = props;
     const contentRef = React.useRef(null);
     const moveStateVertRef = React.useRef(null);
@@ -13536,7 +13548,7 @@
             "div",
             {
               ref: horizontalContainerRef,
-              className: styles$2.horizontalContainer,
+              className: `${styles$2.horizontalContainer} ${isLoading ? styles$2.disabled : ""}`,
               style: containerStyle,
               children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: gridStyle, children: /* @__PURE__ */ jsxRuntime.jsxs(
                 "svg",
@@ -18036,7 +18048,7 @@
       },
       handleAction,
       option,
-      option: { icon: icon2, label: label2, disabled, children }
+      option: { icon: icon2, label: label2, disabled: disabled2, children }
     } = props;
     const [hovered, setHovered] = React.useState(false);
     const [coords, setCoords] = React.useState(null);
@@ -18046,7 +18058,7 @@
     const onClick = React.useCallback(
       (e) => {
         e.preventDefault();
-        if (disabled) {
+        if (disabled2) {
           return;
         }
         if (children && children.length > 0) {
@@ -18056,7 +18068,7 @@
         handleAction(option);
         onClose == null ? void 0 : onClose();
       },
-      [onClose, handleAction, option, disabled, children]
+      [onClose, handleAction, option, disabled2, children]
     );
     React.useEffect(() => {
       if (!hovered || !nestedRef.current)
@@ -18116,8 +18128,8 @@
             "button",
             {
               className: styles$1.menuOption,
-              "aria-disabled": disabled,
-              disabled,
+              "aria-disabled": disabled2,
+              disabled: disabled2,
               style: {
                 height: contextMenuOptionHeight,
                 paddingLeft: contextMenuSidePadding,
@@ -18134,7 +18146,7 @@
                     style: {
                       width: contextMenuIconWidth,
                       color: "var(--gantt-context-menu-text-color)",
-                      opacity: disabled ? 0.3 : 0.5
+                      opacity: disabled2 ? 0.3 : 0.5
                     },
                     children: icon2
                   }
@@ -19001,7 +19013,8 @@
       todayLabel = "Today",
       dataDateLabel = "Data Date",
       showProgress = true,
-      progressColor
+      progressColor,
+      isLoading = false
     } = props;
     const ganttSVGRef = React.useRef(null);
     const wrapperRef = React.useRef(null);
@@ -20364,7 +20377,8 @@
         taskListContainerRef,
         taskListRef,
         tasks: visibleTasks,
-        ganttRef: wrapperRef
+        ganttRef: wrapperRef,
+        isLoading
       }),
       [
         childTasksMap,
@@ -20393,7 +20407,8 @@
         selectedIdsMirror,
         taskList,
         taskListContainerRef,
-        visibleTasks
+        visibleTasks,
+        isLoading
       ]
     );
     return /* @__PURE__ */ jsxRuntime.jsx(GanttThemeProvider, { theme, children: (cssVars) => /* @__PURE__ */ jsxRuntime.jsx(GanttLocaleProvider, { locale, children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -20431,7 +20446,8 @@
               verticalGanttContainerRef,
               onOpenGanttContextMenu: (clientX, clientY) => {
                 handleOpenGanttContextMenu(null, clientX, clientY);
-              }
+              },
+              isLoading
             }
           ),
           tooltipTaskFromMap && /* @__PURE__ */ jsxRuntime.jsx(