gantt-task-react-v 1.7.7 → 1.7.8

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

@@ -10457,6 +10457,16 @@ const TaskListTableRowInner = forwardRef(
       }
       return isSelected ? "var(--gantt-table-selected-task-background-color)" : isEven ? "var(--gantt-table-even-background-color)" : "var(--gantt-background-color, #fff)";
     }, [isEven, isOverlay2, isSelected]);
+    const pinnedBgColor = useMemo(() => {
+      if (isOverlay2) {
+        return "var(--gantt-table-drag-task-background-color)";
+      }
+      if (isSelected) {
+        const base = isEven ? "var(--gantt-table-even-background-color, #f5f5f5)" : "var(--gantt-background-color, #fff)";
+        return `linear-gradient(var(--gantt-table-selected-task-background-color), var(--gantt-table-selected-task-background-color)), linear-gradient(${base}, ${base})`;
+      }
+      return isEven ? "var(--gantt-table-even-background-color)" : "var(--gantt-background-color, #fff)";
+    }, [isEven, isOverlay2, isSelected]);
     const rowClassName = useMemo(() => {
       const classNames = [styles$h.taskListTableRow];
       if (moveOverPosition === "after") {
@@ -10478,7 +10488,7 @@ const TaskListTableRowInner = forwardRef(
       const pinnedBase = {
         position: "relative",
         zIndex: 3,
-        backgroundColor: backgroundColor || "var(--gantt-background-color, #fff)"
+        background: pinnedBgColor
       };
       for (let i = 0; i < columns.length; i++) {
         if (columns[i].pinned === "left") {
@@ -10497,7 +10507,7 @@ const TaskListTableRowInner = forwardRef(
         }
       }
       return result;
-    }, [columns, backgroundColor]);
+    }, [columns, pinnedBgColor]);
     return /* @__PURE__ */ jsxs(
       "div",
       {
@@ -11334,7 +11344,7 @@ const TaskListInner = ({
                         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, var(--gantt-table-even-background-color, #f5f5f5) ${fullRowHeight}px)`
                     },
                     children: /* @__PURE__ */ jsx(
                       RenderTaskListTable,
@@ -14449,7 +14459,7 @@ const TaskGanttInner = (props) => {
       backgroundPositionX: additionalLeftSpace || void 0,
       backgroundImage: [
         `linear-gradient(to right, #ebeff2 1px, transparent 2px)`,
-        `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`
+        `linear-gradient(to bottom, transparent ${fullRowHeight}px, var(--gantt-table-even-background-color, #f5f5f5) ${fullRowHeight}px)`
       ].join(", ")
     }),
     [

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

@@ -10474,6 +10474,16 @@
         }
         return isSelected ? "var(--gantt-table-selected-task-background-color)" : isEven ? "var(--gantt-table-even-background-color)" : "var(--gantt-background-color, #fff)";
       }, [isEven, isOverlay2, isSelected]);
+      const pinnedBgColor = React.useMemo(() => {
+        if (isOverlay2) {
+          return "var(--gantt-table-drag-task-background-color)";
+        }
+        if (isSelected) {
+          const base = isEven ? "var(--gantt-table-even-background-color, #f5f5f5)" : "var(--gantt-background-color, #fff)";
+          return `linear-gradient(var(--gantt-table-selected-task-background-color), var(--gantt-table-selected-task-background-color)), linear-gradient(${base}, ${base})`;
+        }
+        return isEven ? "var(--gantt-table-even-background-color)" : "var(--gantt-background-color, #fff)";
+      }, [isEven, isOverlay2, isSelected]);
       const rowClassName = React.useMemo(() => {
         const classNames = [styles$h.taskListTableRow];
         if (moveOverPosition === "after") {
@@ -10495,7 +10505,7 @@
         const pinnedBase = {
           position: "relative",
           zIndex: 3,
-          backgroundColor: backgroundColor || "var(--gantt-background-color, #fff)"
+          background: pinnedBgColor
         };
         for (let i = 0; i < columns.length; i++) {
           if (columns[i].pinned === "left") {
@@ -10514,7 +10524,7 @@
           }
         }
         return result;
-      }, [columns, backgroundColor]);
+      }, [columns, pinnedBgColor]);
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
@@ -11351,7 +11361,7 @@
                           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, var(--gantt-table-even-background-color, #f5f5f5) ${fullRowHeight}px)`
                       },
                       children: /* @__PURE__ */ jsxRuntime.jsx(
                         RenderTaskListTable,
@@ -14466,7 +14476,7 @@
         backgroundPositionX: additionalLeftSpace || void 0,
         backgroundImage: [
           `linear-gradient(to right, #ebeff2 1px, transparent 2px)`,
-          `linear-gradient(to bottom, transparent ${fullRowHeight}px, #f5f5f5 ${fullRowHeight}px)`
+          `linear-gradient(to bottom, transparent ${fullRowHeight}px, var(--gantt-table-even-background-color, #f5f5f5) ${fullRowHeight}px)`
         ].join(", ")
       }),
       [

package/package.json

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