Bump to 0.6.6

CHANGELOG.adoc

@@ -0,0 +1,16 @@
+= Changelog
+
+== v0.6.6
+
+=== Breaking changes
+- Renamed Gantt prop `onClick` to `onTaskClick`
+- Added `onTaskContextMenu` prop
+
+=== Dependency update
+
+=== New features
+
+=== Improvements
+
+=== Bug fixes
+- Fixed an issue introduced in v0.6.5 where left-clicking a task did not work

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ObeoNetwork/gantt-task-react",
-  "version": "0.6.5",
+  "version": "0.6.6",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "MaTeMaTuK <maksym.vikarii@gmail.com>",
   "homepage": "https://github.com/ObeoNetwork/gantt-task-react",

src/components/gantt/gantt.tsx

@@ -208,7 +208,8 @@ export const Gantt: React.FC<GanttProps> = ({
   onArrowDoubleClick: onArrowDoubleClickProp = undefined,
   onChangeExpandState = undefined,
   onChangeTasks = undefined,
-  onContextMenu = undefined,
+  onTaskClick = undefined,
+  onTaskContextMenu = undefined,
   onDateChange: onDateChangeProp = undefined,
   onDelete = undefined,
   onDoubleClick = undefined,
@@ -1751,9 +1752,15 @@ export const Gantt: React.FC<GanttProps> = ({
     ]
   );
 
-  const onTaskContextMenu = (task: TaskOrEmpty) => {
-    if (onContextMenu) {
-      onContextMenu(task);
+  const handleTaskContextMenu = (task: TaskOrEmpty) => {
+    if (onTaskContextMenu) {
+      onTaskContextMenu(task);
+    }
+  };
+
+    const handleTaskClick = (task: TaskOrEmpty) => {
+    if (onTaskClick) {
+      onTaskClick(task);
     }
   };
 
@@ -1785,7 +1792,8 @@ export const Gantt: React.FC<GanttProps> = ({
       isShowDependencyWarnings,
       mapGlobalRowIndexToTask,
       onArrowDoubleClick,
-      onContextMenu: onTaskContextMenu,
+      onTaskClick: handleTaskClick,
+      onTaskContextMenu: handleTaskContextMenu,
       onDoubleClick,
       onFixDependencyPosition,
       onProgressChange,
@@ -1835,7 +1843,8 @@ export const Gantt: React.FC<GanttProps> = ({
       mapTaskToCoordinates,
       onArrowDoubleClick,
       onChangeTooltipTask,
-      onContextMenu,
+      onTaskClick,
+      onTaskContextMenu,
       onDoubleClick,
       onFixDependencyPosition,
       onProgressChange,
@@ -1883,7 +1892,8 @@ export const Gantt: React.FC<GanttProps> = ({
     icons,
     isShowTaskNumbers,
     mapTaskToNestedIndex,
-    onContextMenu: onTaskContextMenu,
+    onTaskClick: onTaskClick,
+    onTaskContextMenu: onTaskContextMenu,
     onExpanderClick: handleExpanderClick,
     selectTaskOnMouseDown,
     selectedIdsMirror,

src/components/gantt/task-gantt-content.tsx

@@ -68,6 +68,7 @@ export type TaskGanttContentProps = {
     event: React.MouseEvent<SVGElement>
   ) => void;
   onArrowDoubleClick: (taskFrom: Task, taskTo: Task) => void;
+  onTaskClick?: (task: Task, event: React.MouseEvent<SVGElement>) => void;
   onTaskContextMenu?: (task: Task, event: React.MouseEvent<SVGElement>) => void;
   onDoubleClick?: (task: Task) => void;
   renderedRowIndexes: OptimizedListParams | null;
@@ -113,6 +114,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
   onArrowDoubleClick,
   onDependencyContextMenu,
   onDoubleClick,
+  onTaskClick,
   onTaskContextMenu,
   renderedRowIndexes,
   rtl,
@@ -240,6 +242,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
             ganttRelationEvent={ganttRelationEvent}
             isDelete={!task.isDisabled}
             onDoubleClick={onDoubleClick}
+            onClick={onTaskClick}
             onTaskContextMenu={onTaskContextMenu}
             onEventStart={handleTaskDragStart}
             setTooltipTask={setTooltipTask}

src/components/gantt/task-gantt.tsx

@@ -145,6 +145,18 @@ const TaskGanttInner: React.FC<TaskGanttProps> = ({
   const [selectedTask, setSelectedTask] = React.useState<Task>(null);
   const open = Boolean(anchorEl);
 
+  const onTaskClick: (
+    task: Task,
+    event: React.MouseEvent<SVGElement>
+  ) => void = (task, event) => {
+
+    setArrowAnchorEl(null);
+    setSelectedDependency(null);
+    setAnchorEl(null);
+    setSelectedTask(task);
+    barProps.onTaskClick(task, event);
+  };
+
   const onRightClickTask: (
     task: Task,
     event: React.MouseEvent<SVGElement>
@@ -155,7 +167,7 @@ const TaskGanttInner: React.FC<TaskGanttProps> = ({
     setSelectedDependency(null);
     setAnchorEl(event.currentTarget);
     setSelectedTask(task);
-    barProps.onTaskContextMenu(task, event);
+    barProps.onTaskClick(task, event);
   };
 
   const onClose = () => {
@@ -213,6 +225,7 @@ const TaskGanttInner: React.FC<TaskGanttProps> = ({
             <Grid {...gridProps} />
             <TaskGanttContent
               {...barProps}
+              onTaskClick={onTaskClick}
               onTaskContextMenu={onRightClickTask}
               onDependencyContextMenu={onDependencyContextMenu}
             />

src/components/task-item/task-item.tsx

@@ -55,6 +55,7 @@ export type TaskItemProps = {
   isCritical: boolean;
   rtl: boolean;
   onDoubleClick?: (task: Task) => void;
+  onClick?: (task: Task, event: React.MouseEvent<SVGElement>) => void;
   onTaskContextMenu?: (task: Task, event: React.MouseEvent<SVGElement>) => void;
   setTooltipTask: (task: Task | null, element: Element | null) => void;
   onEventStart: (
@@ -90,6 +91,7 @@ const TaskItemInner: React.FC<TaskItemProps> = props => {
     isDateChangeable,
     isDelete,
     isSelected,
+    onClick = undefined,
     onTaskContextMenu = undefined,
     onDoubleClick = undefined,
     onEventStart,
@@ -174,6 +176,16 @@ const TaskItemInner: React.FC<TaskItemProps> = props => {
   }, [task, fixEndPosition, outOfParentWarnings, getTaskGlobalIndexByRef]);
 
   const handleClick = useCallback(
+    (event: React.MouseEvent<SVGElement>) => {
+      if (onClick) {
+        onClick(task, event);
+      }
+    },
+    [onClick, task]
+  );
+
+
+  const handleRightClick = useCallback(
     (event: React.MouseEvent<SVGElement>) => {
       if (onTaskContextMenu) {
         onTaskContextMenu(task, event);
@@ -377,7 +389,8 @@ const TaskItemInner: React.FC<TaskItemProps> = props => {
       onMouseDown={onMouseDown}
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
-      onContextMenu={handleClick}
+      onClick={handleClick}
+      onContextMenu={handleRightClick}
       onDoubleClick={handleDoubleClick}
       ref={taskRootRef}
     >

src/components/task-list/task-list-table-row.tsx

@@ -44,7 +44,8 @@ type TaskListTableRowProps = {
   isEven: boolean;
   isSelected: boolean;
   isShowTaskNumbers: boolean;
-  onRightClick: (task: TaskOrEmpty) => void;
+  onTaskClick: (task: TaskOrEmpty) => void;
+  onTaskContextMenu: (task: TaskOrEmpty) => void;
   onExpanderClick: (task: Task) => void;
   scrollToTask: (task: Task) => void;
   selectTaskOnMouseDown: (taskId: string, event: MouseEvent) => void;
@@ -80,7 +81,8 @@ const TaskListTableRowInner: React.FC<TaskListTableRowProps> = ({
   isEven,
   isSelected,
   isShowTaskNumbers,
-  onRightClick,
+  onTaskClick,
+  onTaskContextMenu,
   onExpanderClick,
   scrollToTask,
   selectTaskOnMouseDown,
@@ -103,7 +105,8 @@ const TaskListTableRowInner: React.FC<TaskListTableRowProps> = ({
       }
 
       selectTaskOnMouseDown(task.id, event);
-      onRightClick(task);
+      onTaskClick(task);
+      onTaskContextMenu(task);
     },
     [scrollToTask, selectTaskOnMouseDown, task]
   );

src/components/task-list/task-list-table.tsx

@@ -30,7 +30,8 @@ const TaskListTableDefaultInner: React.FC<TaskListTableProps> = ({
   icons,
   isShowTaskNumbers,
   mapTaskToNestedIndex,
-  onContextMenu,
+  onTaskClick,
+  onTaskContextMenu,
   onExpanderClick,
   renderedIndexes,
   scrollToTask,
@@ -107,7 +108,8 @@ const TaskListTableDefaultInner: React.FC<TaskListTableProps> = ({
           isEven={index % 2 === 1}
           isSelected={selectedIdsMirror[id]}
           isShowTaskNumbers={isShowTaskNumbers}
-          onRightClick={onContextMenu}
+          onTaskClick={onTaskClick}
+          onTaskContextMenu={onTaskContextMenu}
           onExpanderClick={onExpanderClick}
           scrollToTask={scrollToTask}
           selectTaskOnMouseDown={selectTaskOnMouseDown}

src/components/task-list/task-list.tsx

@@ -58,7 +58,8 @@ export type TaskListProps = {
   icons?: Partial<Icons>;
   isShowTaskNumbers: boolean;
   mapTaskToNestedIndex: MapTaskToNestedIndex;
-  onContextMenu?: (task: TaskOrEmpty) => void;
+  onTaskClick?: (task: TaskOrEmpty) => void;
+  onTaskContextMenu?: (task: TaskOrEmpty) => void;
   onExpanderClick: (task: Task) => void;
   scrollToTask: (task: Task) => void;
   selectTaskOnMouseDown: (taskId: string, event: MouseEvent) => void;
@@ -100,7 +101,8 @@ const TaskListInner: React.FC<TaskListProps> = ({
   isShowTaskNumbers,
   mapTaskToNestedIndex,
   onExpanderClick,
-  onContextMenu,
+  onTaskClick,
+  onTaskContextMenu,
   scrollToTask,
   selectTaskOnMouseDown,
   selectedIdsMirror,
@@ -184,7 +186,8 @@ const TaskListInner: React.FC<TaskListProps> = ({
               icons={icons}
               isShowTaskNumbers={isShowTaskNumbers}
               mapTaskToNestedIndex={mapTaskToNestedIndex}
-              onContextMenu={onContextMenu}
+              onTaskClick={onTaskClick}
+              onTaskContextMenu={onTaskContextMenu}
               onExpanderClick={onExpanderClick}
               renderedIndexes={renderedIndexes}
               scrollToTask={scrollToTask}

src/types/public-types.ts

@@ -364,11 +364,11 @@ export interface EventOption {
   /**
    * Invokes on bar click.
    */
-  onClick?: (task: TaskOrEmpty) => void;
+  onTaskClick?: (task: TaskOrEmpty) => void;
   /**
    * Invokes on bar right click.
    */
-  onContextMenu?: (task: TaskOrEmpty) => void;
+  onTaskContextMenu?: (task: TaskOrEmpty) => void;
   /**
    * Recount descedents of a group task when moving
    */
@@ -641,7 +641,8 @@ export interface TaskListTableProps {
   icons?: Partial<Icons>;
   isShowTaskNumbers: boolean;
   mapTaskToNestedIndex: MapTaskToNestedIndex;
-  onContextMenu: (task: TaskOrEmpty) => void;
+  onTaskClick: (task: TaskOrEmpty) => void;
+  onTaskContextMenu: (task: TaskOrEmpty) => void;
   onExpanderClick: (task: Task) => void;
   renderedIndexes: OptimizedListParams | null;
   scrollToTask: (task: Task) => void;

stories/Comparison.tsx

@@ -58,7 +58,7 @@ export const Comparison: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
     />
   );

stories/CriticalPath.tsx

@@ -123,7 +123,7 @@ export const CriticalPath: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
     />
   );

stories/CustomColumns_VerticalScroll.tsx

@@ -208,7 +208,7 @@ export const CustomColumns_VerticalScroll: React.FC = props => {
           onChangeTasks={onChangeTasks}
           onDoubleClick={handleDblClick}
           onEditTask={onEditTask}
-          onClick={handleClick}
+          onTaskClick={handleClick}
           tasks={tasks}
           onResizeColumn={onResizeColumn}
         />

stories/CustomIcons.tsx

@@ -70,7 +70,7 @@ export const CustomIcons: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
     />
   );

stories/CustomPalette_Zoom.tsx

@@ -485,7 +485,8 @@ export const CustomPalette_Zoom: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
+      onTaskContextMenu={handleClick}
       tasks={tasks}
       viewMode={viewMode}
       roundDate={roundDate}

stories/CustomRelationKind.tsx

@@ -68,7 +68,7 @@ export const CustomRelationKind: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
       onRelationChange={handleRelationChange}
     />

stories/StressTest.tsx

@@ -169,7 +169,7 @@ export const StressTest: React.FC<AppProps> = ({
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
     />
   );

stories/Warnings.tsx

@@ -50,7 +50,7 @@ export const Warnings: React.FC = props => {
       onChangeTasks={onChangeTasks}
       onDoubleClick={handleDblClick}
       onEditTask={onEditTask}
-      onClick={handleClick}
+      onTaskClick={handleClick}
       tasks={tasks}
     />
   );