react-weekly-planning 1.0.1 → 1.0.3

package/README.md

@@ -3,7 +3,9 @@
 This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
 
 
-### Detailed Description and Use Cases
+### Description and Use Cases
+
+`react-weekly-planning` provides a React component for weekly planning. Easily set up and manage a weekly schedule with customizable tasks, groups and views.
 
 #### `weekOffset`
 
@@ -98,8 +100,10 @@ Props for the Calendar component.
 | `sumHoursContainerClassName` | string                                                                                | Additional class names for the sum hours container.                                               |
 | `sumHoursHeadStyle`          | React.CSSProperties \| undefined                                                      | Additional styles for the sum hours header.                                                       |
 | `sumHoursHeadClassName`      | string                                                                                | Additional class names for the sum hours header.                                                  |
-| `handleAddTask`              | (groupId: string, dayInfo: dayInfoType) => void                                       | Handler function for adding a new task.                                                           |
-| `addTaskRender`              | ({ groupId, dayInfo }: { groupId: string; dayInfo: dayInfoType }) => React.ReactNode  | Custom render function for adding a task.                                                         |
+| `handleAddTask`              | handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) => void;          | Handler function for adding a new task.                                                           |
+| `addTaskRender`              | addTaskRender?: ({currentGroup,dayInfo}:{
+  currentGroup: GroupFeildsType;dayInfo: dayInfoType;
+}) => React.ReactNode;         | Custom render function for adding a task.                                                         |
 | `tasks`                      | TasksType                                                                             | Array of tasks to be displayed in the calendar.                                                   |
 | `handleDragTask`             | (event: React.DragEvent<HTMLDivElement>, currentTask: TaskFeildsType) => void         | Handler function for dragging a task.                                                             |
 | `handleDropTask`             | (event: React.DragEvent<HTMLTableDataCellElement>, taskStart: number, taskEnd: number, taskDate: Date, groupId: string, dayIndex: number, newTask: TaskFeildsType, newTasks: TasksType) => void | Handler function for dropping a task.                                                             |

package/definitions/index.ts

@@ -4,7 +4,7 @@
 export type GroupPropsType = {
   /** Custom render function for the group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -41,15 +41,13 @@ type GroupAdditionalFieldsType = Record<any, unknown>;
 export type GroupFeildsType = GroupRiquiredFieldsType &
   GroupAdditionalFieldsType;
 
-
-
 /**
  * Props for the GroupComponent.
  */
 export type GroupComponentPropsType = {
   /** Custom render function for the group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -133,7 +131,7 @@ export type CalendarPropsType = {
   date: Date;
   /** Custom render function for a group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -154,7 +152,7 @@ export type CalendarPropsType = {
   /** Custom render function for a task. */
   taskRender?: ({
     currentTask,
-    handleDragTask
+    handleDragTask,
   }: {
     currentTask: TaskFeildsType;
     handleDragTask?: (
@@ -203,16 +201,13 @@ export type CalendarPropsType = {
   /** Additional class names for the sum hours header. */
   sumHoursHeadClassName?: string;
   /** Handler function for adding a new task. */
-  handleAddTask?: (
-    groupId: string,
-    dayInfo: dayInfoType
-  ) => void;
+  handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) => void;
   /** Custom render function for adding a task. */
-  addTaskRender?:({
-    groupId,
+  addTaskRender?: ({
+    currentGroup,
     dayInfo,
   }: {
-    groupId: string;
+    currentGroup: GroupFeildsType;
     dayInfo: dayInfoType;
   }) => React.ReactNode;
   /** Array of tasks to be displayed in the calendar. */
@@ -234,9 +229,7 @@ export type CalendarPropsType = {
     newTasks: TasksType
   ) => void;
   /** Handler function for ending the drag of a task. */
-  handleDragTaskEnd?: (
-    event: React.DragEvent<HTMLDivElement>
-  ) => void;
+  handleDragTaskEnd?: (event: React.DragEvent<HTMLDivElement>) => void;
   /** Custom render function for the groups header. */
   groupsHeadRender?: () => React.ReactNode;
   /** Custom render function for the sum of hours. */
@@ -254,7 +247,7 @@ export type CalendarPropsType = {
     sumHoursByGroups: number;
   }) => React.ReactNode;
   /** Custom render function for the sum of hours header. */
-  sumHoursHeadRender?:() => React.ReactNode;
+  sumHoursHeadRender?: () => React.ReactNode;
   /** Handler function for clicking a task. */
   handleClickTask?: (currentTask: TaskFeildsType) => void;
   /** Handler function for clicking a group. */
@@ -270,27 +263,24 @@ export type StyleType = React.CSSProperties | undefined;
  * Props for the AddTask component.
  */
 export type AddTaskPropsType = {
-  /** ID of the group. */
-  groupId: string;
+  /** The current group data. */
+  currentGroup: GroupFeildsType;
   /** Additional styles for the add task button. */
   addTaskStyle?: StyleType;
   /** Additional class names for the add task button. */
   addTaskClassName?: string;
   /** Custom render function for adding a task. */
   addTaskRender?: ({
-    groupId,
+    currentGroup,
     dayInfo,
   }: {
-    groupId: string;
+    currentGroup: GroupFeildsType;
     dayInfo: dayInfoType;
   }) => React.ReactNode;
   /** Information about the day. */
   dayInfo: dayInfoType;
   /** Handler function for adding a new task. */
-  handleAddTask?: (
-    groupId: string,
-    dayInfo: dayInfoType
-  ) => void;
+  handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) => void;
 };
 
 /**
@@ -343,7 +333,7 @@ export type TaskContainerPropsType = {
   /** Custom render function for a task. */
   taskRender?: ({
     currentTask,
-    handleDragTask
+    handleDragTask,
   }: {
     currentTask: TaskFeildsType;
     handleDragTask?: (
@@ -352,17 +342,13 @@ export type TaskContainerPropsType = {
     ) => void;
   }) => React.ReactNode;
   /** Handler function for ending the drag of a task. */
-  handleDragTaskEnd?:(
-    event: React.DragEvent<HTMLDivElement>
-  ) => void;
+  handleDragTaskEnd?: (event: React.DragEvent<HTMLDivElement>) => void;
   /** The current task data. */
   currentTask: TaskFeildsType;
   /** Handler function for clicking a task. */
   handleClickTask?: (currentTask: TaskFeildsType) => void;
 };
 
-
-
 /**
  * Props for the GroupsHeadContainer component.
  */
@@ -375,8 +361,6 @@ export type GroupsHeadContainerPropsType = {
   className?: string;
 };
 
-
-
 /**
  * Props for the SumHoursHeadContainer component.
  */

package/docs/global.html

@@ -220,13 +220,13 @@
             
 <tr class="deep-level-0">
     
-        <td class="name"><code>groupId</code></td>
+        <td class="name"><code>currentGroup</code></td>
     
 
     <td class="type">
     
         
-<code class="param-type">string</code>
+<code class="param-type"><a href="global.html#GroupFeildsType">GroupFeildsType</a></code>
 
 
     
@@ -242,7 +242,7 @@
 
     
 
-    <td class="description last">ID of the group.</td>
+    <td class="description last">The current group data.</td>
 </tr>
 
         

package/docs/index.html

@@ -106,7 +106,8 @@
     <section>
         <article><h2>License</h2>
 <p>This project is licensed under the MIT License - see the <a href="LICENSE">LICENSE</a> file for details.</p>
-<h3>Detailed Description and Use Cases</h3>
+<h3>Description and Use Cases</h3>
+<p><code>react-weekly-planning</code> provides a React component for weekly planning. Easily set up and manage a weekly schedule with customizable tasks, groups and views.</p>
 <h4><code>weekOffset</code></h4>
 <ul>
 <li>
@@ -324,13 +325,23 @@ taskId, taskStart taskEnd, task, taskDate, groupId, dayIndex
 </tr>
 <tr>
 <td><code>handleAddTask</code></td>
-<td>(groupId: string, dayInfo: dayInfoType) =&gt; void</td>
+<td>handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) =&gt; void;</td>
 <td>Handler function for adding a new task.</td>
 </tr>
 <tr>
 <td><code>addTaskRender</code></td>
-<td>({ groupId, dayInfo }: { groupId: string; dayInfo: dayInfoType }) =&gt; React.ReactNode</td>
+<td>addTaskRender?: ({currentGroup,dayInfo}:{</td>
+<td></td>
+</tr>
+<tr>
+<td>currentGroup: GroupFeildsType;dayInfo: dayInfoType;</td>
+<td></td>
+<td></td>
+</tr>
+<tr>
+<td>}) =&gt; React.ReactNode;</td>
 <td>Custom render function for adding a task.</td>
+<td></td>
 </tr>
 <tr>
 <td><code>tasks</code></td>

package/docs/index.ts.html

@@ -95,7 +95,7 @@
 export type GroupPropsType = {
   /** Custom render function for the group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -132,15 +132,13 @@ type GroupAdditionalFieldsType = Record<any, unknown>;
 export type GroupFeildsType = GroupRiquiredFieldsType &
   GroupAdditionalFieldsType;
 
-
-
 /**
  * Props for the GroupComponent.
  */
 export type GroupComponentPropsType = {
   /** Custom render function for the group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -224,7 +222,7 @@ export type CalendarPropsType = {
   date: Date;
   /** Custom render function for a group. */
   groupRender?: ({
-    currentGroup
+    currentGroup,
   }: {
     currentGroup: GroupFeildsType;
   }) => React.ReactNode;
@@ -245,7 +243,7 @@ export type CalendarPropsType = {
   /** Custom render function for a task. */
   taskRender?: ({
     currentTask,
-    handleDragTask
+    handleDragTask,
   }: {
     currentTask: TaskFeildsType;
     handleDragTask?: (
@@ -294,16 +292,13 @@ export type CalendarPropsType = {
   /** Additional class names for the sum hours header. */
   sumHoursHeadClassName?: string;
   /** Handler function for adding a new task. */
-  handleAddTask?: (
-    groupId: string,
-    dayInfo: dayInfoType
-  ) => void;
+  handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) => void;
   /** Custom render function for adding a task. */
-  addTaskRender?:({
-    groupId,
+  addTaskRender?: ({
+    currentGroup,
     dayInfo,
   }: {
-    groupId: string;
+    currentGroup: GroupFeildsType;
     dayInfo: dayInfoType;
   }) => React.ReactNode;
   /** Array of tasks to be displayed in the calendar. */
@@ -325,9 +320,7 @@ export type CalendarPropsType = {
     newTasks: TasksType
   ) => void;
   /** Handler function for ending the drag of a task. */
-  handleDragTaskEnd?: (
-    event: React.DragEvent<HTMLDivElement>
-  ) => void;
+  handleDragTaskEnd?: (event: React.DragEvent<HTMLDivElement>) => void;
   /** Custom render function for the groups header. */
   groupsHeadRender?: () => React.ReactNode;
   /** Custom render function for the sum of hours. */
@@ -345,7 +338,7 @@ export type CalendarPropsType = {
     sumHoursByGroups: number;
   }) => React.ReactNode;
   /** Custom render function for the sum of hours header. */
-  sumHoursHeadRender?:() => React.ReactNode;
+  sumHoursHeadRender?: () => React.ReactNode;
   /** Handler function for clicking a task. */
   handleClickTask?: (currentTask: TaskFeildsType) => void;
   /** Handler function for clicking a group. */
@@ -361,27 +354,24 @@ export type StyleType = React.CSSProperties | undefined;
  * Props for the AddTask component.
  */
 export type AddTaskPropsType = {
-  /** ID of the group. */
-  groupId: string;
+  /** The current group data. */
+  currentGroup: GroupFeildsType;
   /** Additional styles for the add task button. */
   addTaskStyle?: StyleType;
   /** Additional class names for the add task button. */
   addTaskClassName?: string;
   /** Custom render function for adding a task. */
   addTaskRender?: ({
-    groupId,
+    currentGroup,
     dayInfo,
   }: {
-    groupId: string;
+    currentGroup: GroupFeildsType;
     dayInfo: dayInfoType;
   }) => React.ReactNode;
   /** Information about the day. */
   dayInfo: dayInfoType;
   /** Handler function for adding a new task. */
-  handleAddTask?: (
-    groupId: string,
-    dayInfo: dayInfoType
-  ) => void;
+  handleAddTask?: (currentGroup: GroupFeildsType, dayInfo: dayInfoType) => void;
 };
 
 /**
@@ -434,7 +424,7 @@ export type TaskContainerPropsType = {
   /** Custom render function for a task. */
   taskRender?: ({
     currentTask,
-    handleDragTask
+    handleDragTask,
   }: {
     currentTask: TaskFeildsType;
     handleDragTask?: (
@@ -443,17 +433,13 @@ export type TaskContainerPropsType = {
     ) => void;
   }) => React.ReactNode;
   /** Handler function for ending the drag of a task. */
-  handleDragTaskEnd?:(
-    event: React.DragEvent<HTMLDivElement>
-  ) => void;
+  handleDragTaskEnd?: (event: React.DragEvent<HTMLDivElement>) => void;
   /** The current task data. */
   currentTask: TaskFeildsType;
   /** Handler function for clicking a task. */
   handleClickTask?: (currentTask: TaskFeildsType) => void;
 };
 
-
-
 /**
  * Props for the GroupsHeadContainer component.
  */
@@ -466,8 +452,6 @@ export type GroupsHeadContainerPropsType = {
   className?: string;
 };
 
-
-
 /**
  * Props for the SumHoursHeadContainer component.
  */

package/index.js

@@ -116,7 +116,7 @@ const Calendar = ({ style, className, groups, weekOffset, date, groupRender, day
                                             task.groupId === group.id &&
                                             compareWeekOffset(date, weekOffset || 0, task.taskDate)).sort((a, b) => a.taskStart - b.taskStart).map((task, taskKey) => {
                                             return (_jsx(TaskContainer, { handleDragTask: handleDragTask, taskRender: taskRender, handleDragTaskEnd: handleDragTaskEnd, style: taskContainerStyle, className: `${taskContainerClassName}`, currentTask: task, handleClickTask: handleClickTask }, `${taskKey} task`));
-                                        }) }), _jsx(AddTask, { addTaskStyle: addTaskStyle, addTaskClassName: addTaskClassName, groupId: group.id, dayInfo: dailyHours[positionDay], addTaskRender: addTaskRender, handleAddTask: handleAddTask })] }, positionDay) }, `td-${group.id}day-i${positionDay}`))), _jsx("td", { children: _jsx(SumHoursContainer, { groupId: group.id, tasks: tasks, weekOffset: weekOffset || 0, calendarDate: date, sumHoursRender: sumHoursRender, sumHoursByGroups: sumHoursByGroups(group.id, tasks, weekOffset || 0, date), className: sumHoursContainerClassName, style: sumHoursContainerStyle }) }, `${i}sumHours`)] }, `${i} tr`))) })] }));
+                                        }) }), _jsx(AddTask, { addTaskStyle: addTaskStyle, addTaskClassName: addTaskClassName, currentGroup: group, dayInfo: dailyHours[positionDay], addTaskRender: addTaskRender, handleAddTask: handleAddTask })] }, positionDay) }, `td-${group.id}day-i${positionDay}`))), _jsx("td", { children: _jsx(SumHoursContainer, { groupId: group.id, tasks: tasks, weekOffset: weekOffset || 0, calendarDate: date, sumHoursRender: sumHoursRender, sumHoursByGroups: sumHoursByGroups(group.id, tasks, weekOffset || 0, date), className: sumHoursContainerClassName, style: sumHoursContainerStyle }) }, `${i}sumHours`)] }, `${i} tr`))) })] }));
 };
 const SumHoursHead = ({ sumHoursHeadRender, className, style, }) => {
     if (sumHoursHeadRender) {
@@ -159,17 +159,17 @@ const GroupContainer = ({ className, style, groupRender, currentGroup, handleCli
     };
     return (_jsxs("div", { onClick: handleClick, className: `${className}`, style: Object.assign(Object.assign({}, groupContainerStyle), style), children: [currentGroup.imageUrl && (_jsx("img", { width: 30, height: 30, src: currentGroup.imageUrl, alt: "groupimg" })), _jsx("label", { children: currentGroup.label && currentGroup.label })] }));
 };
-const AddTask = ({ groupId, handleAddTask, addTaskRender, dayInfo, addTaskStyle, addTaskClassName, }) => {
+const AddTask = ({ currentGroup, handleAddTask, addTaskRender, dayInfo, addTaskStyle, addTaskClassName, }) => {
     if (addTaskRender) {
         return (_jsx(_Fragment, { children: addTaskRender({
-                groupId,
+                currentGroup,
                 dayInfo,
             }) }));
     }
     const handleClick = () => {
         if (!handleAddTask)
             return;
-        handleAddTask(groupId, dayInfo);
+        handleAddTask(currentGroup, dayInfo);
     };
     return (_jsx("div", { onClick: handleClick, style: addTaskStyle, className: `addPlanStyle ${addTaskClassName}`, children: "+" }));
 };

package/index.tsx

@@ -296,7 +296,7 @@ const Calendar = ({
                   <AddTask
                     addTaskStyle={addTaskStyle}
                     addTaskClassName={addTaskClassName}
-                    groupId={group.id}
+                    currentGroup={group}
                     dayInfo={dailyHours[positionDay]}
                     addTaskRender={addTaskRender}
                     handleAddTask={handleAddTask}
@@ -446,7 +446,7 @@ const GroupContainer = ({
 };
 
 const AddTask = ({
-  groupId,
+  currentGroup,
   handleAddTask,
   addTaskRender,
   dayInfo,
@@ -457,7 +457,7 @@ const AddTask = ({
     return (
       <>
         {addTaskRender({
-          groupId,
+          currentGroup,
           dayInfo,
         })}
       </>
@@ -466,7 +466,7 @@ const AddTask = ({
 
   const handleClick = () => {
     if (!handleAddTask) return;
-    handleAddTask(groupId, dayInfo);
+    handleAddTask(currentGroup, dayInfo);
   };
 
   return (

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-weekly-planning",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "main": "index.js",
   "scripts": {
     "test": "jest",
@@ -29,7 +29,7 @@
   ],
   "author": "Kacou Yao Yves Morel",
   "license": "MIT",
-  "description": "A React component for weekly planning. Easily set up and manage a weekly schedule with customizable tasks, groups and views.",
+  "description": "react-weekly-planning provides a React component for weekly planning. Easily set up and manage a weekly schedule with customizable tasks, groups and views.",
   "dependencies": {
     "@babel/types": "^7.24.5",
     "@types/babel__generator": "^7.6.8",