@omniumretail/component-library 1.3.41 → 1.3.42

package/dist/component-library.es.js

@@ -24894,12 +24894,7 @@ const ResponsiveTable = (props) => {
     if (disableCellSelection) return;
     const rowKey = record[rowKeyValue];
     const originalCellContent = record[columnKey];
-    console.log("🔍 CLICK DEBUG:", {
-      rowKey,
-      columnKey,
-      originalCellContent,
-      selectedCells: selectedCells.length
-    });
+    console.log("🔍 CLICK DEBUG:", { rowKey, columnKey, originalCellContent, selectedCells: selectedCells.length, templateEditMode });
     if (useOrderedCellSelection) ;
     else {
       const cellIndex = selectedCells.findIndex(
@@ -24908,34 +24903,45 @@ const ResponsiveTable = (props) => {
       const isSelected = cellIndex >= 0;
       const hasBackendSD = originalCellContent?.type === "S" || originalCellContent?.type === "D";
       const hasBackendContent = originalCellContent?.type && !hasBackendSD;
-      console.log("🔍 STATE:", { cellIndex, isSelected, hasBackendSD, hasBackendContent });
+      const hasBackendBackground = hasBackendSD || originalCellContent?.type === "F";
+      const hasBlockedContent = originalCellContent?.type === "I" || originalCellContent?.type === "L";
+      console.log("🔍 STATE:", { cellIndex, isSelected, hasBackendSD, hasBackendContent, templateEditMode });
+      if (!templateEditMode && hasBlockedContent) {
+        console.log("🚫 BLOCKED: I/L not clickable in user mode");
+        return;
+      }
       let newSelectedCells;
       if (isSelected) {
         const selectedCell = selectedCells[cellIndex];
         const selectedType = selectedCell?.value?.type;
         console.log("✅ IS SELECTED:", { selectedType });
-        if (selectedType !== null) {
-          if (hasBackendContent) {
+        if (templateEditMode) {
+          if (selectedType !== null) {
+            if (hasBackendContent) {
+              newSelectedCells = selectedCells.map(
+                (cell, idx) => idx === cellIndex ? { ...cell, value: { type: null, color: null } } : cell
+              );
+              console.log("➡️ Marked as empty (template mode)");
+            } else {
+              newSelectedCells = selectedCells.filter((_, index) => index !== cellIndex);
+              console.log("➡️ Removed (template mode)");
+            }
+          } else {
             newSelectedCells = selectedCells.map(
-              (cell, idx) => idx === cellIndex ? { ...cell, value: { type: null, color: null } } : cell
+              (cell, idx) => idx === cellIndex ? {
+                ...cell,
+                value: { type: currentTemplateType, color: currentTemplateColor }
+              } : cell
             );
-            console.log("➡️ Marked as empty");
-          } else {
-            newSelectedCells = selectedCells.filter((_, index) => index !== cellIndex);
-            console.log("➡️ Removed");
+            console.log("➡️ Added new type to empty (template mode)");
           }
         } else {
-          newSelectedCells = selectedCells.map(
-            (cell, idx) => idx === cellIndex ? {
-              ...cell,
-              value: templateEditMode ? { type: currentTemplateType, color: currentTemplateColor } : { type: "X", color: selectedCellColor || "grey" }
-            } : cell
-          );
-          console.log("➡️ Added new type to empty");
+          newSelectedCells = selectedCells.filter((_, index) => index !== cellIndex);
+          console.log("➡️ Removed (user mode)");
         }
       } else {
         console.log("❌ NOT SELECTED");
-        if (hasBackendContent) {
+        if (templateEditMode && hasBackendContent) {
           const newCell = {
             rowKey,
             columnKey,
@@ -24943,7 +24949,20 @@ const ResponsiveTable = (props) => {
             rowData: record
           };
           newSelectedCells = [...selectedCells, newCell];
-          console.log("➡️ Adding as empty (backend content)");
+          console.log("➡️ Adding as empty (template mode, backend content)");
+        } else if (!templateEditMode && (hasBackendBackground || !originalCellContent?.type)) {
+          const newCell = {
+            rowKey,
+            columnKey,
+            value: { type: "X", color: selectedCellColor || "grey" },
+            rowData: record
+          };
+          if (cellSelectionMode === "single") {
+            newSelectedCells = [newCell];
+          } else {
+            newSelectedCells = [...selectedCells, newCell];
+          }
+          console.log("➡️ Adding X (user mode, empty or background)");
         } else {
           const newCell = {
             rowKey,
@@ -25091,18 +25110,13 @@ const ResponsiveTable = (props) => {
                 );
               }
               if (!useOrderedCellSelection) {
-                const isSelectable2 = enableCellSelection && selectableColumns?.includes(key);
-                const originalCellContent2 = record[key];
-                const isDisabled = originalCellContent2?.disabled === true;
-                const isReadonly = originalCellContent2?.readonly === true;
-                const cellIndex2 = selectedCells.findIndex(
-                  (cell) => cell.rowKey === record[rowKeyValue] && cell.columnKey === key
-                );
-                const isSelected2 = cellIndex2 !== -1;
-                const hasBackendSD = originalCellContent2?.type === "S" || originalCellContent2?.type === "D";
+                const isDisabled = originalCellContent?.disabled === true;
+                const isReadonly = originalCellContent?.readonly === true;
+                const hasBackendBackground = originalCellContent?.type === "S" || originalCellContent?.type === "D" || originalCellContent?.type === "F";
+                const hasBlockedContent = originalCellContent?.type === "I" || originalCellContent?.type === "L";
                 const getTopLayerContent = () => {
-                  if (isSelected2) {
-                    const selectedCell = selectedCells[cellIndex2];
+                  if (isSelected) {
+                    const selectedCell = selectedCells[cellIndex];
                     const cellType = selectedCell?.value?.type;
                     return {
                       type: cellType,
@@ -25111,10 +25125,10 @@ const ResponsiveTable = (props) => {
                       isFromSelection: true
                     };
                   }
-                  if (originalCellContent2?.type && !hasBackendSD) {
+                  if (originalCellContent?.type && !hasBackendBackground) {
                     return {
-                      type: originalCellContent2.type,
-                      color: originalCellContent2.color,
+                      type: originalCellContent.type,
+                      color: originalCellContent.color,
                       isFromSelection: false
                     };
                   }
@@ -25125,21 +25139,18 @@ const ResponsiveTable = (props) => {
                   if (topLayer?.isFromSelection && topLayer.type === null) {
                     return void 0;
                   }
-                  if (hasBackendSD) {
-                    return originalCellContent2.color;
+                  if (hasBackendBackground) {
+                    return originalCellContent.color;
                   }
                   if (topLayer?.isFromSelection && (topLayer.type === "F" || topLayer.type === "S" || topLayer.type === "D")) {
                     return topLayer.color;
                   }
-                  if (!topLayer?.isFromSelection && originalCellContent2?.type && (originalCellContent2.type === "F" || originalCellContent2.type === "S" || originalCellContent2.type === "D")) {
-                    return originalCellContent2.color;
-                  }
                   return void 0;
                 };
                 const cellBackgroundColor = getBackgroundColor();
                 if (isDisabled) {
-                  if (originalCellContent2?.type === "I" || originalCellContent2?.type === "L" || isReadonly) {
-                    return /* @__PURE__ */ jsx(Tag, { color: originalCellContent2.color, style: { margin: -4, cursor: "not-allowed" }, children: originalCellContent2.type });
+                  if (originalCellContent?.type === "I" || originalCellContent?.type === "L" || isReadonly) {
+                    return /* @__PURE__ */ jsx(Tag, { color: originalCellContent.color, style: { margin: -4, cursor: "not-allowed" }, children: originalCellContent.type });
                   } else {
                     return /* @__PURE__ */ jsx(
                       "div",
@@ -25157,7 +25168,7 @@ const ResponsiveTable = (props) => {
                     );
                   }
                 }
-                if (isSelectable2) {
+                if (isSelectable) {
                   const cellContent = (() => {
                     if (templateEditMode) {
                       if (topLayer && topLayer.type === null) {
@@ -25166,13 +25177,13 @@ const ResponsiveTable = (props) => {
                       if (topLayer) {
                         return /* @__PURE__ */ jsx(Tag, { color: topLayer.color, style: { margin: -4, cursor: "pointer" }, children: topLayer.type });
                       }
-                      if (hasBackendSD) {
-                        return /* @__PURE__ */ jsx(Tag, { color: originalCellContent2.color, style: { margin: -4, cursor: "pointer" }, children: originalCellContent2.type });
+                      if (hasBackendBackground) {
+                        return /* @__PURE__ */ jsx(Tag, { color: originalCellContent.color, style: { margin: -4, cursor: "pointer" }, children: originalCellContent.type });
                       }
                       return null;
                     }
-                    if (isSelected2) {
-                      const selectedCell = selectedCells[cellIndex2];
+                    if (isSelected) {
+                      const selectedCell = selectedCells[cellIndex];
                       const cellColor = selectedCell?.value?.color || selectedCellColor;
                       const cellType = selectedCell?.value?.type || "X";
                       const isLicenseType = cellType === "L";
@@ -25186,8 +25197,11 @@ const ResponsiveTable = (props) => {
                         }
                       );
                     }
-                    if (originalCellContent2) {
-                      return /* @__PURE__ */ jsx(Tag, { color: originalCellContent2.color, style: { margin: -4 }, children: originalCellContent2.type });
+                    if (hasBackendBackground) {
+                      return /* @__PURE__ */ jsx(Tag, { color: originalCellContent.color, style: { margin: -4, cursor: "pointer" }, children: originalCellContent.type });
+                    }
+                    if (hasBlockedContent) {
+                      return /* @__PURE__ */ jsx(Tag, { color: originalCellContent.color, style: { margin: -4, cursor: "not-allowed" }, children: originalCellContent.type });
                     }
                     return null;
                   })();
@@ -25197,15 +25211,15 @@ const ResponsiveTable = (props) => {
                       onClick: (e) => {
                         e.stopPropagation();
                         if (disableCellSelection) return;
-                        if (!templateEditMode && isSelected2 && selectedCells[cellIndex2]?.value?.type === "L") {
+                        if (!templateEditMode && isSelected && selectedCells[cellIndex]?.value?.type === "L") {
                           return;
                         }
                         handleCellClick(record, key);
                       },
                       className: classNames(
                         styles$7.selectableCell,
-                        isSelected2 && styles$7.selected,
-                        isSelected2 && styles$7.uniformSelection
+                        isSelected && styles$7.selected,
+                        isSelected && styles$7.uniformSelection
                       ),
                       style: {
                         cursor: disableCellSelection ? "not-allowed" : void 0,