gantt-task-react-v 1.4.7 → 1.4.8

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

@@ -24,6 +24,7 @@ export interface TaskGanttContentProps extends GanttTaskBarActions {
     onArrowDoubleClick: (taskFrom: Task, taskTo: Task) => void;
     onArrowClick?: (taskFrom: Task, taskTo: Task) => void;
     activeArrowKey?: string | null;
+    activeTaskId?: string | null;
     onClick?: (task: Task, event: React.MouseEvent<SVGElement>) => void;
     onDoubleClick?: (task: Task) => void;
     renderedRowIndexes: OptimizedListParams | null;

package/dist/components/other/gantt-drawer.d.ts

@@ -4,6 +4,7 @@ interface GanttDrawerInternalProps {
     data: GanttDrawerData | null;
     width: number;
     onClose: () => void;
+    onGoToTask?: (taskId: string) => void;
     renderContent?: RenderDrawerContent;
 }
 export declare const GanttDrawer: React.NamedExoticComponent<GanttDrawerInternalProps>;

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

@@ -13161,6 +13161,7 @@ const TaskGanttContentInner = (props) => {
     onArrowDoubleClick,
     onArrowClick,
     activeArrowKey,
+    activeTaskId,
     onDoubleClick,
     onClick,
     renderedRowIndexes,
@@ -13465,7 +13466,7 @@ const TaskGanttContentInner = (props) => {
                       rtl,
                       onArrowDoubleClick,
                       onArrowClick,
-                      isActive: activeArrowKey === `${source.id}|${taskId}`,
+                      isActive: activeArrowKey === `${source.id}|${taskId}` || activeTaskId === source.id || activeTaskId === taskId,
                       fromConnectionIndex: getConnectionIndex(
                         `${source.id}|${sourceTarget}|out`
                       ),
@@ -13551,7 +13552,7 @@ const TaskGanttContentInner = (props) => {
                       rtl,
                       onArrowDoubleClick,
                       onArrowClick,
-                      isActive: activeArrowKey === `${taskId}|${dependent.id}`,
+                      isActive: activeArrowKey === `${taskId}|${dependent.id}` || activeTaskId === taskId || activeTaskId === dependent.id,
                       fromConnectionIndex: getConnectionIndex(
                         `${taskId}|${ownTarget}|out`
                       ),
@@ -13650,7 +13651,7 @@ const TaskGanttContentInner = (props) => {
                       rtl,
                       onArrowDoubleClick,
                       onArrowClick,
-                      isActive: activeArrowKey === `${source.id}|${taskId}`,
+                      isActive: activeArrowKey === `${source.id}|${taskId}` || activeTaskId === source.id || activeTaskId === taskId,
                       fromConnectionIndex: getConnectionIndex(
                         `${source.id}|${sourceTarget}|out`
                       ),
@@ -13710,6 +13711,7 @@ const TaskGanttContentInner = (props) => {
     onArrowDoubleClick,
     onArrowClick,
     activeArrowKey,
+    activeTaskId,
     showProgress,
     progressColor
   ]);
@@ -19330,13 +19332,15 @@ const GanttLoaderInner = ({ loading }) => {
   return /* @__PURE__ */ jsx("div", { className: `${styles$1.loader} ${loading ? "" : styles$1.loaderHidden}` });
 };
 const GanttLoader = memo(GanttLoaderInner);
-const overlay = "_overlay_1rnqn_1";
-const drawer = "_drawer_1rnqn_19";
-const drawer_open = "_drawer_open_1rnqn_51";
-const header = "_header_1rnqn_59";
-const title = "_title_1rnqn_77";
-const closeButton = "_closeButton_1rnqn_97";
-const body = "_body_1rnqn_131";
+const overlay = "_overlay_hyem8_1";
+const drawer = "_drawer_hyem8_19";
+const drawer_open = "_drawer_open_hyem8_51";
+const header = "_header_hyem8_59";
+const title = "_title_hyem8_77";
+const closeButton = "_closeButton_hyem8_97";
+const body = "_body_hyem8_131";
+const goToTaskBar = "_goToTaskBar_hyem8_145";
+const goToTaskButton = "_goToTaskButton_hyem8_159";
 const styles = {
   overlay,
   drawer,
@@ -19344,12 +19348,15 @@ const styles = {
   header,
   title,
   closeButton,
-  body
+  body,
+  goToTaskBar,
+  goToTaskButton
 };
 const GanttDrawerInner = ({
   data,
   width,
   onClose,
+  onGoToTask,
   renderContent
 }) => {
   const handleOverlayClick = useCallback(
@@ -19360,6 +19367,12 @@ const GanttDrawerInner = ({
     [onClose]
   );
   const title2 = (data == null ? void 0 : data.type) === "task" ? data.task.name : (data == null ? void 0 : data.type) === "arrow" ? `${data.taskFrom.name} → ${data.taskTo.name}` : "";
+  const goToTaskIds = [];
+  if ((data == null ? void 0 : data.type) === "task") {
+    goToTaskIds.push(data.task.id);
+  } else if ((data == null ? void 0 : data.type) === "arrow") {
+    goToTaskIds.push(data.taskFrom.id, data.taskTo.id);
+  }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     data && /* @__PURE__ */ jsx("div", { className: styles.overlay, onClick: handleOverlayClick }),
     /* @__PURE__ */ jsxs(
@@ -19389,7 +19402,78 @@ const GanttDrawerInner = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsx("div", { className: styles.body, children: data && renderContent ? renderContent(data) : null })
+          /* @__PURE__ */ jsxs("div", { className: styles.body, children: [
+            data && onGoToTask && /* @__PURE__ */ jsxs("div", { className: styles.goToTaskBar, children: [
+              data.type === "task" && /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  className: styles.goToTaskButton,
+                  onClick: () => onGoToTask(data.task.id),
+                  type: "button",
+                  children: [
+                    /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsx(
+                      "path",
+                      {
+                        d: "M2 7h10M8 3l4 4-4 4",
+                        stroke: "currentColor",
+                        strokeWidth: "1.5",
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round"
+                      }
+                    ) }),
+                    "Go to Task"
+                  ]
+                }
+              ),
+              data.type === "arrow" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    className: styles.goToTaskButton,
+                    onClick: () => onGoToTask(data.taskFrom.id),
+                    type: "button",
+                    children: [
+                      /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M2 7h10M8 3l4 4-4 4",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round"
+                        }
+                      ) }),
+                      "Go to ",
+                      data.taskFrom.name
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    className: styles.goToTaskButton,
+                    onClick: () => onGoToTask(data.taskTo.id),
+                    type: "button",
+                    children: [
+                      /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsx(
+                        "path",
+                        {
+                          d: "M2 7h10M8 3l4 4-4 4",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round"
+                        }
+                      ) }),
+                      "Go to ",
+                      data.taskTo.name
+                    ]
+                  }
+                )
+              ] })
+            ] }),
+            data && renderContent ? renderContent(data) : null
+          ] })
         ]
       }
     )
@@ -19464,6 +19548,7 @@ const Gantt = (props) => {
   const renderDrawerContent = drawerProps == null ? void 0 : drawerProps.renderDrawerContent;
   const [drawerData, setDrawerData] = useState(null);
   const [activeArrowKey, setActiveArrowKey] = useState(null);
+  const [activeTaskId, setActiveTaskId] = useState(null);
   const taskBar = useMemo(() => {
     return mergeDeepObj(
       {},
@@ -20557,6 +20642,7 @@ const Gantt = (props) => {
     (taskFrom, taskTo) => {
       if (enableDrawer) {
         setActiveArrowKey(`${taskFrom.id}|${taskTo.id}`);
+        setActiveTaskId(null);
         setDrawerData({ type: "arrow", taskFrom, taskTo });
       }
       if (taskBar.onArrowClick) {
@@ -20569,6 +20655,7 @@ const Gantt = (props) => {
     (task, _event) => {
       if (enableDrawer) {
         setActiveArrowKey(null);
+        setActiveTaskId(task.id);
         setDrawerData({ type: "task", task });
       }
       if (taskBar.onClick) {
@@ -20580,7 +20667,51 @@ const Gantt = (props) => {
   const handleDrawerClose = useCallback(() => {
     setDrawerData(null);
     setActiveArrowKey(null);
+    setActiveTaskId(null);
   }, []);
+  const handleGoToTask = useCallback(
+    (taskId) => {
+      for (const [comparisonLevel, levelMap] of tasksMap) {
+        const task = levelMap.get(taskId);
+        if (!task || task.type === "empty")
+          continue;
+        const { x1 } = getTaskCoordinates(task, mapTaskToCoordinates);
+        setScrollXProgrammatically(Math.max(0, x1 - 100));
+        const rowIndexMap = taskToRowIndexMap.get(comparisonLevel);
+        if (rowIndexMap) {
+          const rowIndex = rowIndexMap.get(taskId);
+          if (typeof rowIndex === "number") {
+            const targetScrollY = rowIndex * fullRowHeight - ganttHeight / 2 + fullRowHeight / 2;
+            setScrollYProgrammatically(
+              Math.max(
+                0,
+                Math.min(targetScrollY, ganttFullHeight - ganttHeight)
+              )
+            );
+          }
+        }
+        selectTask(taskId);
+        if (onSelectTaskIds) {
+          onSelectTaskIds([taskId]);
+        }
+        break;
+      }
+      handleDrawerClose();
+    },
+    [
+      tasksMap,
+      mapTaskToCoordinates,
+      taskToRowIndexMap,
+      fullRowHeight,
+      ganttHeight,
+      ganttFullHeight,
+      setScrollXProgrammatically,
+      setScrollYProgrammatically,
+      selectTask,
+      onSelectTaskIds,
+      handleDrawerClose
+    ]
+  );
   const handleAction = useHandleAction({
     checkTaskIdExists,
     childTasksMap,
@@ -20796,6 +20927,7 @@ const Gantt = (props) => {
       onArrowDoubleClick,
       onArrowClick: enableDrawer ? onArrowClick : taskBar.onArrowClick,
       activeArrowKey,
+      activeTaskId,
       renderedRowIndexes,
       rtl,
       selectTaskOnMouseDown,
@@ -20835,6 +20967,7 @@ const Gantt = (props) => {
       onArrowDoubleClick,
       onArrowClick,
       activeArrowKey,
+      activeTaskId,
       enableDrawer,
       handleTaskClick,
       renderedRowIndexes,
@@ -21010,6 +21143,7 @@ const Gantt = (props) => {
             data: drawerData,
             width: drawerWidth,
             onClose: handleDrawerClose,
+            onGoToTask: handleGoToTask,
             renderContent: renderDrawerContent
           }
         )

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

@@ -13178,6 +13178,7 @@
       onArrowDoubleClick,
       onArrowClick,
       activeArrowKey,
+      activeTaskId,
       onDoubleClick,
       onClick,
       renderedRowIndexes,
@@ -13482,7 +13483,7 @@
                         rtl,
                         onArrowDoubleClick,
                         onArrowClick,
-                        isActive: activeArrowKey === `${source.id}|${taskId}`,
+                        isActive: activeArrowKey === `${source.id}|${taskId}` || activeTaskId === source.id || activeTaskId === taskId,
                         fromConnectionIndex: getConnectionIndex(
                           `${source.id}|${sourceTarget}|out`
                         ),
@@ -13568,7 +13569,7 @@
                         rtl,
                         onArrowDoubleClick,
                         onArrowClick,
-                        isActive: activeArrowKey === `${taskId}|${dependent.id}`,
+                        isActive: activeArrowKey === `${taskId}|${dependent.id}` || activeTaskId === taskId || activeTaskId === dependent.id,
                         fromConnectionIndex: getConnectionIndex(
                           `${taskId}|${ownTarget}|out`
                         ),
@@ -13667,7 +13668,7 @@
                         rtl,
                         onArrowDoubleClick,
                         onArrowClick,
-                        isActive: activeArrowKey === `${source.id}|${taskId}`,
+                        isActive: activeArrowKey === `${source.id}|${taskId}` || activeTaskId === source.id || activeTaskId === taskId,
                         fromConnectionIndex: getConnectionIndex(
                           `${source.id}|${sourceTarget}|out`
                         ),
@@ -13727,6 +13728,7 @@
       onArrowDoubleClick,
       onArrowClick,
       activeArrowKey,
+      activeTaskId,
       showProgress,
       progressColor
     ]);
@@ -19347,13 +19349,15 @@
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${styles$1.loader} ${loading ? "" : styles$1.loaderHidden}` });
   };
   const GanttLoader = React.memo(GanttLoaderInner);
-  const overlay = "_overlay_1rnqn_1";
-  const drawer = "_drawer_1rnqn_19";
-  const drawer_open = "_drawer_open_1rnqn_51";
-  const header = "_header_1rnqn_59";
-  const title = "_title_1rnqn_77";
-  const closeButton = "_closeButton_1rnqn_97";
-  const body = "_body_1rnqn_131";
+  const overlay = "_overlay_hyem8_1";
+  const drawer = "_drawer_hyem8_19";
+  const drawer_open = "_drawer_open_hyem8_51";
+  const header = "_header_hyem8_59";
+  const title = "_title_hyem8_77";
+  const closeButton = "_closeButton_hyem8_97";
+  const body = "_body_hyem8_131";
+  const goToTaskBar = "_goToTaskBar_hyem8_145";
+  const goToTaskButton = "_goToTaskButton_hyem8_159";
   const styles = {
     overlay,
     drawer,
@@ -19361,12 +19365,15 @@
     header,
     title,
     closeButton,
-    body
+    body,
+    goToTaskBar,
+    goToTaskButton
   };
   const GanttDrawerInner = ({
     data,
     width,
     onClose,
+    onGoToTask,
     renderContent
   }) => {
     const handleOverlayClick = React.useCallback(
@@ -19377,6 +19384,12 @@
       [onClose]
     );
     const title2 = (data == null ? void 0 : data.type) === "task" ? data.task.name : (data == null ? void 0 : data.type) === "arrow" ? `${data.taskFrom.name} → ${data.taskTo.name}` : "";
+    const goToTaskIds = [];
+    if ((data == null ? void 0 : data.type) === "task") {
+      goToTaskIds.push(data.task.id);
+    } else if ((data == null ? void 0 : data.type) === "arrow") {
+      goToTaskIds.push(data.taskFrom.id, data.taskTo.id);
+    }
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       data && /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.overlay, onClick: handleOverlayClick }),
       /* @__PURE__ */ jsxRuntime.jsxs(
@@ -19406,7 +19419,78 @@
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.body, children: data && renderContent ? renderContent(data) : null })
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.body, children: [
+              data && onGoToTask && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.goToTaskBar, children: [
+                data.type === "task" && /* @__PURE__ */ jsxRuntime.jsxs(
+                  "button",
+                  {
+                    className: styles.goToTaskButton,
+                    onClick: () => onGoToTask(data.task.id),
+                    type: "button",
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+                        "path",
+                        {
+                          d: "M2 7h10M8 3l4 4-4 4",
+                          stroke: "currentColor",
+                          strokeWidth: "1.5",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round"
+                        }
+                      ) }),
+                      "Go to Task"
+                    ]
+                  }
+                ),
+                data.type === "arrow" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "button",
+                    {
+                      className: styles.goToTaskButton,
+                      onClick: () => onGoToTask(data.taskFrom.id),
+                      type: "button",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+                          "path",
+                          {
+                            d: "M2 7h10M8 3l4 4-4 4",
+                            stroke: "currentColor",
+                            strokeWidth: "1.5",
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round"
+                          }
+                        ) }),
+                        "Go to ",
+                        data.taskFrom.name
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "button",
+                    {
+                      className: styles.goToTaskButton,
+                      onClick: () => onGoToTask(data.taskTo.id),
+                      type: "button",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
+                          "path",
+                          {
+                            d: "M2 7h10M8 3l4 4-4 4",
+                            stroke: "currentColor",
+                            strokeWidth: "1.5",
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round"
+                          }
+                        ) }),
+                        "Go to ",
+                        data.taskTo.name
+                      ]
+                    }
+                  )
+                ] })
+              ] }),
+              data && renderContent ? renderContent(data) : null
+            ] })
           ]
         }
       )
@@ -19481,6 +19565,7 @@
     const renderDrawerContent = drawerProps == null ? void 0 : drawerProps.renderDrawerContent;
     const [drawerData, setDrawerData] = React.useState(null);
     const [activeArrowKey, setActiveArrowKey] = React.useState(null);
+    const [activeTaskId, setActiveTaskId] = React.useState(null);
     const taskBar = React.useMemo(() => {
       return mergeDeepObj(
         {},
@@ -20574,6 +20659,7 @@
       (taskFrom, taskTo) => {
         if (enableDrawer) {
           setActiveArrowKey(`${taskFrom.id}|${taskTo.id}`);
+          setActiveTaskId(null);
           setDrawerData({ type: "arrow", taskFrom, taskTo });
         }
         if (taskBar.onArrowClick) {
@@ -20586,6 +20672,7 @@
       (task, _event) => {
         if (enableDrawer) {
           setActiveArrowKey(null);
+          setActiveTaskId(task.id);
           setDrawerData({ type: "task", task });
         }
         if (taskBar.onClick) {
@@ -20597,7 +20684,51 @@
     const handleDrawerClose = React.useCallback(() => {
       setDrawerData(null);
       setActiveArrowKey(null);
+      setActiveTaskId(null);
     }, []);
+    const handleGoToTask = React.useCallback(
+      (taskId) => {
+        for (const [comparisonLevel, levelMap] of tasksMap) {
+          const task = levelMap.get(taskId);
+          if (!task || task.type === "empty")
+            continue;
+          const { x1 } = getTaskCoordinates(task, mapTaskToCoordinates);
+          setScrollXProgrammatically(Math.max(0, x1 - 100));
+          const rowIndexMap = taskToRowIndexMap.get(comparisonLevel);
+          if (rowIndexMap) {
+            const rowIndex = rowIndexMap.get(taskId);
+            if (typeof rowIndex === "number") {
+              const targetScrollY = rowIndex * fullRowHeight - ganttHeight / 2 + fullRowHeight / 2;
+              setScrollYProgrammatically(
+                Math.max(
+                  0,
+                  Math.min(targetScrollY, ganttFullHeight - ganttHeight)
+                )
+              );
+            }
+          }
+          selectTask(taskId);
+          if (onSelectTaskIds) {
+            onSelectTaskIds([taskId]);
+          }
+          break;
+        }
+        handleDrawerClose();
+      },
+      [
+        tasksMap,
+        mapTaskToCoordinates,
+        taskToRowIndexMap,
+        fullRowHeight,
+        ganttHeight,
+        ganttFullHeight,
+        setScrollXProgrammatically,
+        setScrollYProgrammatically,
+        selectTask,
+        onSelectTaskIds,
+        handleDrawerClose
+      ]
+    );
     const handleAction = useHandleAction({
       checkTaskIdExists,
       childTasksMap,
@@ -20813,6 +20944,7 @@
         onArrowDoubleClick,
         onArrowClick: enableDrawer ? onArrowClick : taskBar.onArrowClick,
         activeArrowKey,
+        activeTaskId,
         renderedRowIndexes,
         rtl,
         selectTaskOnMouseDown,
@@ -20852,6 +20984,7 @@
         onArrowDoubleClick,
         onArrowClick,
         activeArrowKey,
+        activeTaskId,
         enableDrawer,
         handleTaskClick,
         renderedRowIndexes,
@@ -21027,6 +21160,7 @@
               data: drawerData,
               width: drawerWidth,
               onClose: handleDrawerClose,
+              onGoToTask: handleGoToTask,
               renderContent: renderDrawerContent
             }
           )

package/dist/style.css

@@ -728,7 +728,7 @@
 ._loaderHidden_covn4_49 {
   display: none;
 }
-._overlay_1rnqn_1 {
+._overlay_hyem8_1 {
   position: absolute;
   top: 0;
   left: 0;
@@ -737,7 +737,7 @@
   z-index: 998;
 }
 
-._drawer_1rnqn_19 {
+._drawer_hyem8_19 {
   position: absolute;
   top: 0;
   right: 0;
@@ -753,11 +753,11 @@
   transition: transform 0.25s ease;
 }
 
-._drawer_open_1rnqn_51 {
+._drawer_open_hyem8_51 {
   transform: translateX(0);
 }
 
-._header_1rnqn_59 {
+._header_hyem8_59 {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -766,7 +766,7 @@
   flex-shrink: 0;
 }
 
-._title_1rnqn_77 {
+._title_hyem8_77 {
   font-weight: 600;
   font-size: 14px;
   color: var(--gantt-drawer-title-color, #333);
@@ -776,7 +776,7 @@
   white-space: nowrap;
 }
 
-._closeButton_1rnqn_97 {
+._closeButton_hyem8_97 {
   background: none;
   border: none;
   cursor: pointer;
@@ -789,13 +789,43 @@
   transition: background 0.15s ease;
 }
 
-._closeButton_1rnqn_97:hover {
+._closeButton_hyem8_97:hover {
   background: var(--gantt-drawer-close-hover-bg, #f0f0f0);
 }
 
-._body_1rnqn_131 {
+._body_hyem8_131 {
   flex: 1;
   overflow-y: auto;
   overflow-x: hidden;
   padding: 16px;
 }
+
+._goToTaskBar_hyem8_145 {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 12px;
+}
+
+._goToTaskButton_hyem8_159 {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 12px;
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--gantt-drawer-go-to-color, #1976d2);
+  background: var(--gantt-drawer-go-to-bg, #e3f2fd);
+  border: 1px solid var(--gantt-drawer-go-to-border, #90caf9);
+  border-radius: 4px;
+  cursor: pointer;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  transition: background 0.15s ease;
+}
+
+._goToTaskButton_hyem8_159:hover {
+  background: var(--gantt-drawer-go-to-hover-bg, #bbdefb);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gantt-task-react-v",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "aguilanbon",
   "homepage": "https://github.com/aguilanbon/gantt-task-react-v",