@codezee/sixtify-brahma 0.2.70 → 0.2.71

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codezee/sixtify-brahma",
-  "version": "0.2.70",
+  "version": "0.2.71",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/hardikranpariya/sixtify-brahma.git"

package/packages/shared-components/dist/CellSelectionTable/CellSelectionTable.d.ts

@@ -3,9 +3,10 @@ import { type MouseEvent, type ReactNode } from "react";
 import type { CellCoord, Column } from "./utils/types";
 export type Cell = {
     cellLabel: string;
+} & {
     [key: string]: ReactNode;
 };
-export type TableDataRow = Record<string, string | Cell>;
+export type TableDataRow = Record<string, string | Cell | boolean>;
 export type CellSelectionTableProps = {
     columns: Column[];
     data: TableDataRow[];

package/packages/shared-components/dist/CellSelectionTable/CellSelectionTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellSelectionTable.d.ts","sourceRoot":"","sources":["../../src/CellSelectionTable/CellSelectionTable.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAGzC,OAAO,EACL,KAAK,UAAU,EACf,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAoB,MAAM,eAAe,CAAC;AAEzE,MAAM,MAAM,IAAI,GAAG;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC;AAEzD,MAAM,MAAM,uBAAuB,GAAG;IACpC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,eAAe,EAAE,CACf,aAAa,EAAE,UAAU,CAAC,SAAS,EAAE,CAAC,EACtC,CAAC,EAAE,UAAU,KACV,IAAI,CAAC;IACV,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,oFAQhC,QAAQ,CAAC,uBAAuB,CAAC,4CAwRnC,CAAC"}
+{"version":3,"file":"CellSelectionTable.d.ts","sourceRoot":"","sources":["../../src/CellSelectionTable/CellSelectionTable.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EACL,KAAK,UAAU,EACf,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EACV,SAAS,EACT,MAAM,EAGP,MAAM,eAAe,CAAC;AAEvB,MAAM,MAAM,IAAI,GAAG;IACjB,SAAS,EAAE,MAAM,CAAC;CACnB,GAAG;IACF,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,OAAO,CAAC,CAAC;AAEnE,MAAM,MAAM,uBAAuB,GAAG;IACpC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,eAAe,EAAE,CACf,aAAa,EAAE,UAAU,CAAC,SAAS,EAAE,CAAC,EACtC,CAAC,EAAE,UAAU,KACV,IAAI,CAAC;IACV,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,oFAQhC,QAAQ,CAAC,uBAAuB,CAAC,4CA+WnC,CAAC"}

package/packages/shared-components/dist/CellSelectionTable/CellSelectionTable.js

@@ -1,17 +1,11 @@
 "use client";
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CellSelectionTable = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
-const useStickyColumns_1 = require("./hook/useStickyColumns");
-const groupBy_1 = __importDefault(require("lodash/groupBy"));
-const uniqBy_1 = __importDefault(require("lodash/uniqBy"));
 const react_1 = require("react");
-const Tooltip_1 = require("../Tooltip");
+const useStickyColumns_1 = require("./hook/useStickyColumns");
 const EmployeeCell_1 = require("./SubComponents/EmployeeCell");
 const TableBodyLoader_1 = require("./SubComponents/TableBodyLoader");
 const helper_1 = require("./utils/helper");
@@ -19,19 +13,41 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
     const theme = (0, material_1.useTheme)();
     const { slate, iron, butterflyBlue } = theme.palette.app.color;
     const selectingRef = (0, react_1.useRef)(false);
+    const selectionModeRef = (0, react_1.useRef)("add");
     const anchorRef = (0, react_1.useRef)(null);
     const hoveringRef = (0, react_1.useRef)(null);
     const [selectedRanges, setSelectedRanges] = (0, react_1.useState)([]);
+    const [currentSelectedRanges, setCurrentSelectedRanges] = (0, react_1.useState)([]);
     const { stickyMap } = (0, useStickyColumns_1.useStickyColumns)(columns);
-    const selectedSet = (0, react_1.useMemo)(() => {
-        const set = new Set();
-        selectedRanges.flat().forEach((cell) => {
-            set.add(`${cell.row}-${cell.col}`);
+    const isSelectedCell = (rowIndex, colIndex) => {
+        if (selectedRanges.length === 0 && currentSelectedRanges.length === 0) {
+            return false;
+        }
+        return [...selectedRanges, ...currentSelectedRanges].some((range) => range.some((cell) => cell.row === rowIndex && cell.col === colIndex));
+    };
+    const memoizedData = (0, react_1.useMemo)(() => {
+        return data.map((row) => {
+            const normalizedRow = {};
+            for (const key in row) {
+                const value = row[key];
+                if (typeof value === "string") {
+                    if (value.toLowerCase() === "true") {
+                        normalizedRow[key] = true;
+                    }
+                    else if (value.toLowerCase() === "false") {
+                        normalizedRow[key] = false;
+                    }
+                    else {
+                        normalizedRow[key] = value;
+                    }
+                }
+                else if (typeof value === "boolean" || typeof value === "object") {
+                    normalizedRow[key] = value;
+                }
+            }
+            return normalizedRow;
         });
-        return set;
-    }, [selectedRanges]);
-    const isSelectedCell = (0, react_1.useCallback)((rowIndex, colIndex) => selectedSet.has(`${rowIndex}-${colIndex}`), [selectedSet]);
-    const memoizedData = (0, react_1.useMemo)(() => data, [data]);
+    }, [data]);
     function getCellColor({ cellKey, isSelected = false, }) {
         if (isSelected) {
             return butterflyBlue[800];
@@ -41,44 +57,92 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
         }
         return iron[600];
     }
-    const groupedRanges = (0, react_1.useMemo)(() => {
-        const unique = (0, uniqBy_1.default)(selectedRanges, (cell) => `${cell.row}-${cell.col}`);
-        return (0, groupBy_1.default)(unique, "row");
-    }, [selectedRanges]);
     const handleCellMouseDown = (0, react_1.useCallback)((ri, ci) => (e) => {
+        if (columns[ci]?.disableSelection) {
+            const nextSelectableIndex = columns.findIndex((col, index) => !col.disableSelection && index > ci);
+            if (nextSelectableIndex !== -1) {
+                return (0, helper_1.handleMouseDown)({
+                    e,
+                    ri,
+                    ci: nextSelectableIndex,
+                    selectingRef,
+                    anchorRef,
+                    selectedRanges,
+                    setSelectedRanges,
+                    selectionModeRef,
+                });
+            }
+            const fallbackIndex = [...columns]
+                .reverse()
+                .findIndex((col, index) => !col.disableSelection && columns.length - 1 - index < ci);
+            if (fallbackIndex !== -1) {
+                const adjustedIndex = columns.length - 1 - fallbackIndex;
+                return (0, helper_1.handleMouseDown)({
+                    e,
+                    ri,
+                    ci: adjustedIndex,
+                    selectingRef,
+                    anchorRef,
+                    selectedRanges,
+                    setSelectedRanges,
+                    selectionModeRef,
+                });
+            }
+            return;
+        }
         (0, helper_1.handleMouseDown)({
             e,
             ri,
             ci,
             selectingRef,
             anchorRef,
+            selectedRanges,
             setSelectedRanges,
+            selectionModeRef,
         });
-    }, []);
-    const handleCellMouseEnter = (0, react_1.useCallback)((ri, ci) => () => {
+    }, [selectedRanges]);
+    const handleCellMouseEnter = (0, react_1.useCallback)((ri, ci) => (e) => {
         (0, helper_1.handleMouseEnter)({
+            e,
             selectingRef,
             anchorRef,
             hoveringRef,
             ri,
             ci,
+            selectedRanges,
             setSelectedRanges,
+            selectionModeRef,
+            currentSelectedRanges,
+            setCurrentSelectedRanges,
+            columns,
+            data: memoizedData,
         });
-    }, []);
-    const handleCellMouseUp = (0, react_1.useCallback)((e) => {
+    }, [
+        helper_1.handleMouseEnter,
+        selectingRef,
+        anchorRef,
+        hoveringRef,
+        setSelectedRanges,
+        selectionModeRef,
+        memoizedData,
+        columns,
+    ]);
+    const handleCellMouseUp = (0, react_1.useCallback)((ri, ci) => (e) => {
         (0, helper_1.handleMouseUp)({
             e,
             selectingRef,
             anchorRef,
             hoveringRef,
+            ri,
+            ci,
             setSelectedRanges,
+            selectionModeRef,
+            setCurrentSelectedRanges,
+            data: memoizedData,
+            columns,
         });
-    }, []);
+    }, [memoizedData, columns]);
     const handleContextMenuCallback = (0, react_1.useCallback)((ri, ci) => (e) => {
-        if (Object.keys(groupedRanges).length && !e) {
-            setSelectedRanges([]);
-            return;
-        }
         (0, helper_1.handleContextMenu)({
             e,
             ri,
@@ -87,7 +151,7 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
             setSelectedRanges,
             onCellSelection,
         });
-    }, [setSelectedRanges, onCellSelection, groupedRanges]);
+    }, [onCellSelection, selectedRanges]);
     return ((0, jsx_runtime_1.jsx)(material_1.Box, { position: "relative", overflow: "auto", height: height, bgcolor: iron[600], children: (0, jsx_runtime_1.jsxs)(material_1.Table, { stickyHeader: true, sx: {
                 borderCollapse: "separate",
                 borderSpacing: 0,
@@ -97,20 +161,25 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
                     padding: "5px",
                     height: "50px",
                 },
-            }, children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: columns.map(({ key, label, minWidth = "auto", lockPinned = false, align = "left", }, ci) => ((0, jsx_runtime_1.jsx)(material_1.TableCell, { align: align, sx: {
-                                ...(lockPinned && {
-                                    top: 0,
-                                    left: stickyMap.has(ci) ? stickyMap.get(ci) : 0,
-                                    zIndex: 10,
-                                    position: "sticky",
-                                }),
-                                backgroundColor: slate[700],
-                                minWidth,
-                                padding: "5px 10px",
-                            }, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", children: label }) }, key))) }) }), loading ? ((0, jsx_runtime_1.jsx)(TableBodyLoader_1.TableBodyLoader, { columns: columns, rowCount: 25 })) : ((0, jsx_runtime_1.jsx)(material_1.TableBody, { children: memoizedData.map((row, ri) => ((0, jsx_runtime_1.jsx)(material_1.TableRow, { sx: { backgroundColor: iron[600] }, children: columns.map(({ key, maxWidth = "auto", minWidth = "auto", isEmployee, align = "center", lockPinned = false, }, ci) => {
+            }, children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsx)(material_1.TableRow, { children: columns.map(({ key, label, minWidth = "auto", lockPinned = false, align = "left", }, ci) => {
+                            const isSticky = stickyMap.has(ci);
+                            const left = isSticky ? stickyMap.get(ci) : 0;
+                            return ((0, jsx_runtime_1.jsx)(material_1.TableCell, { align: align, sx: {
+                                    ...(lockPinned && {
+                                        top: 0,
+                                        left,
+                                        zIndex: 10,
+                                        position: "sticky",
+                                    }),
+                                    backgroundColor: slate[700],
+                                    minWidth,
+                                    padding: "5px 10px",
+                                }, children: (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "subtitle2", children: label }) }, key));
+                        }) }) }), loading ? ((0, jsx_runtime_1.jsx)(TableBodyLoader_1.TableBodyLoader, { columns: columns, rowCount: 25 })) : ((0, jsx_runtime_1.jsx)(material_1.TableBody, { children: memoizedData.map((row, ri) => ((0, jsx_runtime_1.jsx)(material_1.TableRow, { sx: { backgroundColor: iron[600] }, children: columns.map(({ key, maxWidth = "auto", minWidth = "auto", isEmployee, align = "center", lockPinned = false, }, ci) => {
                             const cell = row[key];
                             const getRowTitle = (0, helper_1.getCellValue)(cell, "cellLabel");
-                            const tooltip = typeof cell !== "string" &&
+                            const tooltip = typeof cell === "object" &&
+                                cell != null &&
                                 typeof cell?.["cellTooltip"] === "object"
                                 ? cell["cellTooltip"]
                                 : (0, helper_1.getCellValue)(cell, "cellTooltip");
@@ -118,6 +187,8 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
                             const cellActive = (0, helper_1.getCellValue)(cell, "cellActive");
                             const isSticky = stickyMap.has(ci);
                             const left = isSticky ? stickyMap.get(ci) : 0;
+                            const content = isEmployee ? ((0, jsx_runtime_1.jsx)(EmployeeCell_1.EmployeeCell, { row: row })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", children: getRowTitle }));
+                            const isNotDisabled = !(columns[ci]?.disableSelection || row?.rowDisabled);
                             return ((0, jsx_runtime_1.jsx)(material_1.TableCell, { align: align, sx: {
                                     ...(lockPinned && {
                                         top: 0,
@@ -125,6 +196,11 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
                                         zIndex: 5,
                                         position: "sticky",
                                     }),
+                                    ...(isNotDisabled
+                                        ? {}
+                                        : {
+                                            cursor: "not-allowed",
+                                        }),
                                     userSelect: "none",
                                     overflow: "hidden",
                                     bgcolor: (0, material_1.lighten)(getCellColor({
@@ -137,15 +213,11 @@ const CellSelectionTable = ({ columns, data, onCellSelection, cellColors, height
                                     cursor: "pointer",
                                     maxWidth,
                                     minWidth,
-                                }, onMouseDown: !columns[ci]?.disableSelection
-                                    ? handleCellMouseDown(ri, ci)
-                                    : undefined, onMouseEnter: !columns[ci]?.disableSelection
+                                }, onMouseDown: (e) => handleCellMouseDown(ri, ci)(e), onMouseEnter: isNotDisabled
                                     ? handleCellMouseEnter(ri, ci)
-                                    : undefined, onMouseUp: !columns[ci]?.disableSelection
-                                    ? handleCellMouseUp
-                                    : undefined, onContextMenu: !columns[ci]?.disableSelection
+                                    : undefined, onMouseUp: (e) => handleCellMouseUp(ri, ci)(e), onContextMenu: isNotDisabled
                                     ? handleContextMenuCallback(ri, ci)
-                                    : undefined, children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { toolTipLabel: tooltip, children: isEmployee ? ((0, jsx_runtime_1.jsx)(EmployeeCell_1.EmployeeCell, { row: row })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", children: getRowTitle })) }) }, key));
+                                    : undefined, children: tooltip ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: tooltip, children: content })) : (content) }, key));
                         }) }, typeof row.id === "string" ? row.id : ""))) }))] }) }));
 };
 exports.CellSelectionTable = CellSelectionTable;

package/packages/shared-components/dist/CellSelectionTable/SubComponents/EmployeeCell.d.ts

@@ -1,6 +1,6 @@
 import type { ModifyCellObj } from "../utils";
 type EmployeeCellProps = {
-    row: Record<string, string | ModifyCellObj | undefined>;
+    row: Record<string, string | ModifyCellObj | boolean | undefined>;
 };
 export declare const EmployeeCell: ({ row }: EmployeeCellProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/packages/shared-components/dist/CellSelectionTable/SubComponents/EmployeeCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmployeeCell.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/SubComponents/EmployeeCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,KAAK,iBAAiB,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,aAAa,GAAG,SAAS,CAAC,CAAC;CACzD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,SAAS,iBAAiB,4CAiBtD,CAAC"}
+{"version":3,"file":"EmployeeCell.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/SubComponents/EmployeeCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,KAAK,iBAAiB,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,aAAa,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;CACnE,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,SAAS,iBAAiB,4CAiBtD,CAAC"}

package/packages/shared-components/dist/CellSelectionTable/hook/useStickyColumns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStickyColumns.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/hook/useStickyColumns.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC,KAAK,YAAY,GAAG,MAAM,GAAG;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,KAAK,sBAAsB,GAAG;IAC5B,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC,CAAC;AAYF,eAAO,MAAM,gBAAgB,GAAI,SAAS,MAAM,EAAE,KAAG,sBA4BpD,CAAC"}
+{"version":3,"file":"useStickyColumns.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/hook/useStickyColumns.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC,KAAK,YAAY,GAAG,MAAM,GAAG;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,KAAK,sBAAsB,GAAG;IAC5B,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAChC,CAAC;AAYF,eAAO,MAAM,gBAAgB,GAAI,SAAS,MAAM,EAAE,KAAG,sBAuBpD,CAAC"}

package/packages/shared-components/dist/CellSelectionTable/hook/useStickyColumns.js

@@ -1,35 +1,27 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useStickyColumns = void 0;
-const isNaN_1 = __importDefault(require("lodash/isNaN"));
-const isNumber_1 = __importDefault(require("lodash/isNumber"));
-const parseInt_1 = __importDefault(require("lodash/parseInt"));
 const react_1 = require("react");
 const parseMinWidth = (minWidth) => {
-    if ((0, isNumber_1.default)(minWidth)) {
+    if (typeof minWidth === "number") {
         return minWidth;
     }
-    const parsed = (0, parseInt_1.default)((minWidth ?? "36").replace("px", ""));
-    return (0, isNaN_1.default)(parsed) ? 36 : parsed;
+    const cleaned = parseInt((minWidth ?? "36").replace("px", ""), 10);
+    return isNaN(cleaned) ? 36 : cleaned;
 };
 const useStickyColumns = (columns) => {
     return (0, react_1.useMemo)(() => {
-        const { parsedColumns, stickyMap } = columns.reduce((acc, col, idx) => {
+        const stickyMap = new Map();
+        const parsedColumns = [];
+        let runningOffset = 0;
+        columns.forEach((col, idx) => {
             const parsedMinWidth = parseMinWidth(col.minWidth);
             const parsedCol = { ...col, idx, parsedMinWidth };
-            acc.parsedColumns.push(parsedCol);
+            parsedColumns.push(parsedCol);
             if (col.lockPinned) {
-                acc.stickyMap.set(idx, acc.offset);
-                acc.offset += parsedMinWidth;
+                stickyMap.set(idx, runningOffset);
+                runningOffset += parsedMinWidth;
             }
-            return acc;
-        }, {
-            parsedColumns: [],
-            stickyMap: new Map(),
-            offset: 0,
         });
         return { parsedColumns, stickyMap };
     }, [columns]);

package/packages/shared-components/dist/CellSelectionTable/utils/helper.d.ts

@@ -1,8 +1,8 @@
-import type { HandleContextMenuArgs, HandleMouseDownArgs, HandleMouseEnterArgs, HandleMunseUpArgs } from "./types";
 import type { Cell } from "../CellSelectionTable";
-export declare function handleMouseEnter({ selectingRef, anchorRef, hoveringRef, ri, ci, setSelectedRanges, }: HandleMouseEnterArgs): void;
-export declare function handleMouseDown({ e, ri, ci, selectingRef, anchorRef, setSelectedRanges, }: HandleMouseDownArgs): void;
-export declare function handleMouseUp({ e, selectingRef, anchorRef, hoveringRef, setSelectedRanges, }: HandleMunseUpArgs): void;
+import type { HandleContextMenuArgs, HandleMouseDownArgs, HandleMouseEnterArgs, HandleMouseUpArgs } from "./types";
+export declare function handleMouseDown({ e, ri, ci, selectingRef, anchorRef, selectedRanges, selectionModeRef, }: HandleMouseDownArgs): void;
+export declare function handleMouseEnter({ anchorRef, hoveringRef, ri, ci, setSelectedRanges, selectionModeRef, setCurrentSelectedRanges, columns, data, }: HandleMouseEnterArgs): void;
+export declare function handleMouseUp({ e, ri, ci, selectingRef, anchorRef, hoveringRef, setSelectedRanges, selectionModeRef, setCurrentSelectedRanges, columns, data, }: HandleMouseUpArgs): void;
 export declare function handleContextMenu({ e, ri, ci, setSelectedRanges, onCellSelection, selectedRanges, }: HandleContextMenuArgs): void;
-export declare const getCellValue: (cell: string | Cell | undefined, key: string) => string;
+export declare const getCellValue: (cell: string | Cell | boolean | undefined, key: string) => string;
 //# sourceMappingURL=helper.d.ts.map

package/packages/shared-components/dist/CellSelectionTable/utils/helper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/helper.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAEV,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EAClB,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAgClD,wBAAgB,gBAAgB,CAAC,EAC/B,YAAY,EACZ,SAAS,EACT,WAAW,EACX,EAAE,EACF,EAAE,EACF,iBAAiB,GAClB,EAAE,oBAAoB,QAOtB;AAED,wBAAgB,eAAe,CAAC,EAC9B,CAAC,EACD,EAAE,EACF,EAAE,EACF,YAAY,EACZ,SAAS,EACT,iBAAiB,GAClB,EAAE,mBAAmB,QAkBrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,CAAC,EACD,YAAY,EACZ,SAAS,EACT,WAAW,EACX,iBAAiB,GAClB,EAAE,iBAAiB,QAQnB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,CAAC,EACD,EAAE,EACF,EAAE,EACF,iBAAiB,EACjB,eAAe,EACf,cAAc,GACf,EAAE,qBAAqB,QAkCvB;AACD,eAAO,MAAM,YAAY,GACvB,MAAM,MAAM,GAAG,IAAI,GAAG,SAAS,EAC/B,KAAK,MAAM,KACV,MAoBF,CAAC"}
+{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/helper.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,KAAK,EAEV,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EAElB,MAAM,SAAS,CAAC;AAwBjB,wBAAgB,eAAe,CAAC,EAC9B,CAAC,EACD,EAAE,EACF,EAAE,EACF,YAAY,EACZ,SAAS,EACT,cAAc,EACd,gBAAgB,GACjB,EAAE,mBAAmB,QAwBrB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,WAAW,EACX,EAAE,EACF,EAAE,EACF,iBAAiB,EACjB,gBAAgB,EAChB,wBAAwB,EACxB,OAAO,EACP,IAAI,GACL,EAAE,oBAAoB,QAiDtB;AAED,wBAAgB,aAAa,CAAC,EAC5B,CAAC,EACD,EAAE,EACF,EAAE,EACF,YAAY,EACZ,SAAS,EACT,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,wBAAwB,EACxB,OAAO,EACP,IAAI,GACL,EAAE,iBAAiB,QA+CnB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,CAAC,EACD,EAAE,EACF,EAAE,EACF,iBAAiB,EACjB,eAAe,EACf,cAAc,GACf,EAAE,qBAAqB,QA6CvB;AAED,eAAO,MAAM,YAAY,GACvB,MAAM,MAAM,GAAG,IAAI,GAAG,OAAO,GAAG,SAAS,EACzC,KAAK,MAAM,KACV,MAsBF,CAAC"}

package/packages/shared-components/dist/CellSelectionTable/utils/helper.js

@@ -4,91 +4,155 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCellValue = void 0;
-exports.handleMouseEnter = handleMouseEnter;
 exports.handleMouseDown = handleMouseDown;
+exports.handleMouseEnter = handleMouseEnter;
 exports.handleMouseUp = handleMouseUp;
 exports.handleContextMenu = handleContextMenu;
-const compact_1 = __importDefault(require("lodash/compact"));
-const map_1 = __importDefault(require("lodash/map"));
-function updateRange(start, end, setSelectedRanges) {
-    const top = Math.min(start.row, end.row);
-    const bottom = Math.max(start.row, end.row);
-    const left = Math.min(start.col, end.col);
-    const right = Math.max(start.col, end.col);
-    const range = [];
-    for (let r = top; r <= bottom; r++) {
-        for (let c = left; c <= right; c++) {
-            range.push({ row: r, col: c });
-        }
-    }
-    setSelectedRanges((prev) => {
-        const out = [...prev];
-        out.splice(out.length - 1, 1, ...range);
-        return out;
-    });
+const keyBy_1 = __importDefault(require("lodash/keyBy"));
+const omit_1 = __importDefault(require("lodash/omit"));
+const range_1 = __importDefault(require("lodash/range"));
+const some_1 = __importDefault(require("lodash/some"));
+const uniqBy_1 = __importDefault(require("lodash/uniqBy"));
+const values_1 = __importDefault(require("lodash/values"));
+const cellKey = ({ row, col }) => `${row}:${col}`;
+function rangeCoords(a, b) {
+    return (0, range_1.default)(Math.min(a, b), Math.max(a, b) + 1);
 }
-function handleMouseEnter({ selectingRef, anchorRef, hoveringRef, ri, ci, setSelectedRanges, }) {
-    if (!selectingRef.current || !anchorRef.current) {
-        return;
-    }
-    hoveringRef.current = { row: ri, col: ci };
-    updateRange(anchorRef.current, hoveringRef.current, setSelectedRanges);
+function getRangeCells(a, b) {
+    const rows = rangeCoords(a.row, b.row);
+    const cols = rangeCoords(a.col, b.col);
+    return rows.flatMap((row) => cols.map((col) => ({ row, col })));
+}
+function arrayToRecord(cells) {
+    return (0, keyBy_1.default)(cells, cellKey);
 }
-function handleMouseDown({ e, ri, ci, selectingRef, anchorRef, setSelectedRanges, }) {
+function recordToArray(rec) {
+    return (0, values_1.default)(rec);
+}
+function handleMouseDown({ e, ri, ci, selectingRef, anchorRef, selectedRanges, selectionModeRef, }) {
     if (e.button === 2) {
         return;
     }
-    const anchor = { row: ri, col: ci };
+    const start = { row: ri, col: ci };
+    const additive = e.ctrlKey || e.metaKey;
     selectingRef.current = true;
-    anchorRef.current = anchor;
-    if (e.ctrlKey || e.metaKey) {
-        setSelectedRanges((prev) => [...prev, anchor]);
+    anchorRef.current = start;
+    const key = cellKey(start);
+    const isAlreadySelected = (0, some_1.default)(selectedRanges.flat(), (c) => cellKey(c) === key);
+    if (additive) {
+        selectionModeRef.current = isAlreadySelected ? "remove" : "add";
+    }
+    else {
+        selectionModeRef.current = "replace";
+    }
+}
+function handleMouseEnter({ anchorRef, hoveringRef, ri, ci, setSelectedRanges, selectionModeRef, setCurrentSelectedRanges, columns, data, }) {
+    if (anchorRef.current === null) {
+        return;
+    }
+    const end = { row: ri, col: ci };
+    hoveringRef.current = end;
+    const rawDraggedCells = getRangeCells(anchorRef.current, end);
+    const draggedCells = data.some((row) => row?.rowDisabled) ||
+        columns.some((col) => col?.disableSelection)
+        ? rawDraggedCells.filter((cell) => !data[cell.row]?.rowDisabled && !columns[cell.col]?.disableSelection)
+        : rawDraggedCells;
+    if (!draggedCells.length) {
+        setCurrentSelectedRanges([]);
+        return;
+    }
+    const mode = selectionModeRef.current;
+    if (mode === "replace") {
+        setSelectedRanges([draggedCells]);
+        return;
+    }
+    if (mode === "remove") {
+        const toRemove = new Set(draggedCells.map(cellKey));
+        setSelectedRanges((prev) => prev
+            .map((group) => group.filter((cell) => !toRemove.has(cellKey(cell))))
+            .filter((group) => group.length));
         return;
     }
-    setSelectedRanges([anchor]);
+    if (mode === "add") {
+        setCurrentSelectedRanges([draggedCells]);
+    }
 }
-function handleMouseUp({ e, selectingRef, anchorRef, hoveringRef, setSelectedRanges, }) {
+function handleMouseUp({ e, ri, ci, selectingRef, anchorRef, hoveringRef, setSelectedRanges, selectionModeRef, setCurrentSelectedRanges, columns, data, }) {
+    if (!selectionModeRef.current || !anchorRef.current) {
+        return;
+    }
+    const end = { row: ri, col: ci };
+    const additive = e.ctrlKey || e.metaKey;
+    const mode = selectionModeRef.current;
+    const rawDraggedCells = getRangeCells(anchorRef.current, end);
+    const draggedCells = data.some((row) => row?.rowDisabled) ||
+        columns.some((col) => col?.disableSelection)
+        ? rawDraggedCells.filter((cell) => !data[cell.row]?.rowDisabled && !columns[cell.col]?.disableSelection)
+        : rawDraggedCells;
     selectingRef.current = false;
     anchorRef.current = null;
     hoveringRef.current = null;
-    if (!(e?.ctrlKey || e?.metaKey)) {
-        setSelectedRanges([]);
-    }
+    setSelectedRanges((prev) => {
+        if (mode === "replace") {
+            return [draggedCells];
+        }
+        if (mode === "remove") {
+            const toRemove = new Set(draggedCells.map(cellKey));
+            return prev
+                .map((group) => group.filter((cell) => !toRemove.has(cellKey(cell))))
+                .filter((group) => group.length);
+        }
+        if (mode === "add") {
+            return additive ? [...prev, draggedCells] : [draggedCells];
+        }
+        return prev;
+    });
+    setCurrentSelectedRanges([]);
 }
 function handleContextMenu({ e, ri, ci, setSelectedRanges, onCellSelection, selectedRanges, }) {
     e.preventDefault();
-    const singleCell = [{ row: ri, col: ci }];
-    const keySet = new Set((0, map_1.default)(selectedRanges, (cell) => `${cell.row}:${cell.col}`));
-    if (e.ctrlKey || e.metaKey) {
-        singleCell.forEach((cell) => keySet.add(`${cell.row}:${cell.col}`));
-        const merged = (0, compact_1.default)((0, map_1.default)(Array.from(keySet), (key) => {
-            const [rowStr, colStr] = key.split(":");
-            const row = Number(rowStr);
-            const col = Number(colStr);
-            return Number.isNaN(row) || Number.isNaN(col)
-                ? null
-                : { row, col };
-        }));
-        setSelectedRanges(merged);
-        onCellSelection?.({ selectedCells: merged }, e);
-        return;
+    const clicked = { row: ri, col: ci };
+    const keyClicked = cellKey(clicked);
+    const additive = e.button === 2;
+    const additiveCtrl = e.ctrlKey || e.metaKey;
+    const allSelectedCells = selectedRanges.flat();
+    const alreadySelected = (0, some_1.default)(allSelectedCells, (c) => cellKey(c) === keyClicked);
+    const baseRec = arrayToRecord(allSelectedCells);
+    const newRec = (() => {
+        if (additiveCtrl || additive) {
+            if (!additive && alreadySelected) {
+                return (0, omit_1.default)(baseRec, keyClicked);
+            }
+            if (clicked && alreadySelected) {
+                return { ...baseRec, [keyClicked]: clicked };
+            }
+        }
+        return { [keyClicked]: clicked };
+    })();
+    const newSelection = recordToArray(newRec);
+    if (newSelection.length > 0) {
+        setSelectedRanges([newSelection]);
+        const newSelectedData = (0, uniqBy_1.default)(newSelection, cellKey);
+        if (onCellSelection) {
+            onCellSelection({ selectedCells: newSelectedData }, e);
+        }
     }
-    setSelectedRanges(singleCell);
-    onCellSelection?.({ selectedCells: singleCell }, e);
 }
 const getCellValue = (cell, key) => {
     if (typeof cell === "string") {
         return cell;
     }
-    const value = cell?.[key];
-    if (typeof value === "string") {
-        return value;
-    }
-    if (typeof value === "number") {
-        return value.toString();
-    }
-    if (value === true) {
-        return "active";
+    if (cell && typeof cell === "object") {
+        const value = cell[key];
+        if (typeof value === "string") {
+            return value;
+        }
+        if (typeof value === "number") {
+            return value.toString();
+        }
+        if (value === true) {
+            return "active";
+        }
     }
     return "";
 };

package/packages/shared-components/dist/CellSelectionTable/utils/index.d.ts

@@ -1,3 +1,2 @@
-export * from "./helper";
 export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/packages/shared-components/dist/CellSelectionTable/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/packages/shared-components/dist/CellSelectionTable/utils/index.js

@@ -14,5 +14,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./helper"), exports);
 __exportStar(require("./types"), exports);

package/packages/shared-components/dist/CellSelectionTable/utils/types.d.ts

@@ -1,6 +1,7 @@
 import type { TableCellProps } from "@mui/material";
 import type { Dictionary } from "lodash";
 import type { Dispatch, MouseEvent, MutableRefObject, SetStateAction } from "react";
+import type { TableDataRow } from "../CellSelectionTable";
 export type Column = {
     key: string;
     label: string;
@@ -21,13 +22,26 @@ export type CellCoord = {
     row: number;
     col: number;
 };
+export type SelectionRange = {
+    start: CellCoord;
+    end: CellCoord;
+};
+export type SelectionMode = "add" | "remove" | "replace" | "move";
+export type SelectionRecord = Record<string, CellCoord>;
 export type HandleMouseEnterArgs = {
+    e: MouseEvent<HTMLTableCellElement>;
     selectingRef: MutableRefObject<boolean>;
     anchorRef: MutableRefObject<CellCoord | null>;
     hoveringRef: MutableRefObject<CellCoord | null>;
     ri: number;
     ci: number;
-    setSelectedRanges: Dispatch<SetStateAction<CellCoord[]>>;
+    selectedRanges: CellCoord[][];
+    setSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    selectionModeRef: MutableRefObject<SelectionMode>;
+    currentSelectedRanges: CellCoord[][];
+    setCurrentSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    columns: Column[];
+    data: TableDataRow[];
 };
 export type HandleMouseDownArgs = {
     e: MouseEvent<HTMLTableCellElement>;
@@ -35,21 +49,39 @@ export type HandleMouseDownArgs = {
     ci: number;
     selectingRef: MutableRefObject<boolean>;
     anchorRef: MutableRefObject<CellCoord | null>;
-    setSelectedRanges: Dispatch<SetStateAction<CellCoord[]>>;
+    selectedRanges: CellCoord[][];
+    setSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    selectionModeRef: MutableRefObject<SelectionMode>;
 };
-export type HandleMunseUpArgs = {
+export type HandleMouseUpArgs = {
     e: MouseEvent<HTMLTableCellElement>;
+    ri: number;
+    ci: number;
+    selectingRef: MutableRefObject<boolean>;
+    anchorRef: MutableRefObject<CellCoord | null>;
+    hoveringRef: MutableRefObject<CellCoord | null>;
+    setSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    selectionModeRef: MutableRefObject<SelectionMode>;
+    setCurrentSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    columns: Column[];
+    data: TableDataRow[];
+};
+export type HandleMouseMoveArgs = {
+    e: MouseEvent<HTMLTableCellElement>;
+    ri: number;
+    ci: number;
     selectingRef: MutableRefObject<boolean>;
     anchorRef: MutableRefObject<CellCoord | null>;
     hoveringRef: MutableRefObject<CellCoord | null>;
-    setSelectedRanges: Dispatch<SetStateAction<CellCoord[]>>;
+    setSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
+    selectionModeRef: MutableRefObject<SelectionMode>;
 };
 export type HandleContextMenuArgs = {
     e: MouseEvent<HTMLTableCellElement>;
     ri: number;
     ci: number;
-    selectedRanges: CellCoord[];
-    setSelectedRanges: Dispatch<SetStateAction<CellCoord[]>>;
+    selectedRanges: CellCoord[][];
+    setSelectedRanges: Dispatch<SetStateAction<CellCoord[][]>>;
     onCellSelection: (ranges: Dictionary<CellCoord[]>, e: MouseEvent<HTMLTableCellElement>) => void;
 };
 export type GetCellColorArgs = {

package/packages/shared-components/dist/CellSelectionTable/utils/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,KAAK,EACV,QAAQ,EACR,UAAU,EACV,gBAAgB,EAChB,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,MAAM,GAAG;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAErD,MAAM,MAAM,oBAAoB,GAAG;IACjC,YAAY,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC,SAAS,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAC9C,WAAW,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAChD,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;CAC1D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,CAAC,EAAE,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC,SAAS,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAC9C,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;CAC1D,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,CAAC,EAAE,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACpC,YAAY,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC,SAAS,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAC9C,WAAW,EAAE,gBAAgB,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;IAChD,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;CAC1D,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,CAAC,EAAE,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,cAAc,EAAE,SAAS,EAAE,CAAC;IAC5B,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;IACzD,eAAe,EAAE,CACf,MAAM,EAAE,UAAU,CAAC,SAAS,EAAE,CAAC,EAC/B,CAAC,EAAE,UAAU,CAAC,oBAAoB,CAAC,KAChC,IAAI,CAAC;CACX,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/CellSelectionTable/utils/types.ts"],"names":[],"mappings":"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"}

package/packages/shared-components/dist/FormFields/DatePicker/DatePicker.d.ts

@@ -1,5 +1,5 @@
 import type { DatePickerProps as MuiDatePickerProps } from "@mui/x-date-pickers/DatePicker";
-import type { PickerValidDate } from "@mui/x-date-pickers/models";
+import type { DateView, PickerValidDate } from "@mui/x-date-pickers/models";
 import React from "react";
 import type { FieldError, FieldValues, UseControllerProps } from "react-hook-form";
 export type DatePickerProps<P extends FieldValues> = UseControllerProps<P> & MuiDatePickerProps<PickerValidDate> & Partial<{
@@ -11,6 +11,7 @@ export type DatePickerProps<P extends FieldValues> = UseControllerProps<P> & Mui
     helperText: string;
     loading: boolean;
     clearable?: boolean;
+    view?: DateView[];
     disableKeyboardInput?: boolean;
     setError: (name: keyof P, error: FieldError | {
         type: string;
@@ -23,5 +24,5 @@ export declare const dateFormats: {
 };
 export declare const LeftArrowIcon: React.FC;
 export declare const RightArrowIcon: React.FC;
-export declare function DatePicker<P extends FieldValues>({ setError, control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, clearable, rules, disableKeyboardInput, format, ...restProps }: DatePickerProps<P>): import("react/jsx-runtime").JSX.Element;
+export declare function DatePicker<P extends FieldValues>({ setError, control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, clearable, rules, disableKeyboardInput, views, format, ...restProps }: DatePickerProps<P>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DatePicker.d.ts.map

package/packages/shared-components/dist/FormFields/DatePicker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,IAAI,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAE5F,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAGlE,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAKzB,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACxE,kBAAkB,CAAC,eAAe,CAAC,GACnC,OAAO,CAAC;IACN,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,EAAE,CACR,IAAI,EAAE,MAAM,CAAC,EACb,KAAK,EAAE,UAAU,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KACnD,IAAI,CAAC;CACX,CAAC,CAAC;AAEL,eAAO,MAAM,WAAW;;;CAGvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAcjC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAclC,CAAC;AAEF,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,EAChD,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,SAAgB,EAChB,KAAK,EACL,oBAA4B,EAC5B,MAAqC,EACrC,GAAG,SAAS,EACb,EAAE,eAAe,CAAC,CAAC,CAAC,2CAyIpB"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,IAAI,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAE5F,OAAO,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAG5E,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAKzB,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACxE,kBAAkB,CAAC,eAAe,CAAC,GACnC,OAAO,CAAC;IACN,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,EAAE,CAAC;IAClB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,EAAE,CACR,IAAI,EAAE,MAAM,CAAC,EACb,KAAK,EAAE,UAAU,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KACnD,IAAI,CAAC;CACX,CAAC,CAAC;AAEL,eAAO,MAAM,WAAW;;;CAGvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAcjC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAclC,CAAC;AAEF,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,EAChD,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,SAAgB,EAChB,KAAK,EACL,oBAA4B,EAC5B,KAAgC,EAChC,MAAqC,EACrC,GAAG,SAAS,EACb,EAAE,eAAe,CAAC,CAAC,CAAC,2CAyIpB"}

package/packages/shared-components/dist/FormFields/DatePicker/DatePicker.js

@@ -40,7 +40,8 @@ const RightArrowIcon = () => {
         } }));
 };
 exports.RightArrowIcon = RightArrowIcon;
-function DatePicker({ setError, control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, clearable = true, rules, disableKeyboardInput = false, format = exports.dateFormats.dateWithEuropean, ...restProps }) {
+function DatePicker({ setError, control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, clearable = true, rules, disableKeyboardInput = false, views = ["year", "month", "day"], format = exports.dateFormats.dateWithEuropean, ...restProps }) {
+    const [localError, setLocalError] = (0, react_1.useState)();
     const { field: { value, onChange, ...restField }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
     const [open, setOpen] = (0, react_1.useState)(false);
     const theme = (0, material_1.useTheme)();
@@ -49,8 +50,7 @@ function DatePicker({ setError, control, defaultValue, disabled = false, label,
     if (loading) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label });
     }
-    const EmptyIcon = () => null;
-    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && (0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, children: label }), (0, jsx_runtime_1.jsx)(DatePicker_1.DatePicker, { ...restField, ...restProps, disabled: disabled, format: format, value: finalValue, readOnly: readOnly, open: open && !readOnly, onOpen: () => setOpen(true), onClose: () => setOpen(false), slotProps: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && (0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, children: label }), (0, jsx_runtime_1.jsx)(DatePicker_1.DatePicker, { ...restField, ...restProps, disabled: disabled, views: views, format: format, value: finalValue, readOnly: readOnly, open: open && !readOnly, onOpen: () => setOpen(true), onClose: () => setOpen(false), slotProps: {
                     field: {
                         clearable,
                         onClear: () => onChange(null),
@@ -61,8 +61,8 @@ function DatePicker({ setError, control, defaultValue, disabled = false, label,
                     },
                     textField: {
                         disabled,
-                        helperText,
-                        error,
+                        error: !!localError || error,
+                        helperText: localError ?? helperText,
                         InputProps: {
                             endAdornment: ((0, jsx_runtime_1.jsx)(Actions_1.CalendarIconAction, { disabled: disabled, onClick: () => setOpen(true) })),
                             sx: {
@@ -119,26 +119,21 @@ function DatePicker({ setError, control, defaultValue, disabled = false, label,
                 }, slots: {
                     leftArrowIcon: exports.LeftArrowIcon,
                     rightArrowIcon: exports.RightArrowIcon,
-                    switchViewIcon: EmptyIcon,
                 }, dayOfWeekFormatter: (weekday) => `${weekday.toFormat("ccc")}`, onAccept: (value, details) => {
                     if (restProps?.onAccept) {
                         restProps.onAccept(value, details);
                     }
                 }, onChange: (value, details) => {
-                    if (restProps?.onChange) {
-                        restProps.onChange(value, details);
-                        return;
-                    }
-                    if (details.validationError && value && value.year >= 1000) {
-                        if ((0, isFunction_1.default)(setError)) {
-                            setError(name, {
-                                type: "manual",
-                                message: "common.date.invalid",
-                            });
-                        }
-                    }
-                    else if (value?.isValid) {
-                        onChange(value.toISODate());
+                    const isValid = value?.isValid === true;
+                    const hasError = Boolean(details.validationError ?? !isValid);
+                    onChange(isValid ? value.toISODate() : null);
+                    setLocalError(hasError ? "Please enter a valid date" : "");
+                    if ((0, isFunction_1.default)(setError) && hasError) {
+                        setError(name, {
+                            type: "manual",
+                            message: "common.date.invalid",
+                        });
                     }
+                    restProps?.onChange?.(value, details);
                 } })] }));
 }