@megha-ui/react 1.2.466 → 1.2.468

package/dist/components/grid/types/grid.d.ts

@@ -193,6 +193,7 @@ export interface GroupedRowProps {
     alternateRowColor?: boolean;
     locale?: string;
     formatOptions?: any;
+    actionsKey?: string;
 }
 export interface GroupedData {
     type: string;
@@ -300,6 +301,7 @@ export interface GridRowProps {
     ignoreRowSelect?: Set<string>;
     locale?: string;
     formatOptions?: any;
+    actionsKey?: string;
 }
 export interface SearchQuery {
     text: string;

package/dist/components/grid/utils/gridRow.js

@@ -19,7 +19,7 @@ const isUrl = (value) => {
     }
     return false;
 };
-const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRows, toggleRowSelection, columns, widthMode, index, rowKey, hasVerticalScroll, onRowClick, loading, groupBy, rowIndex, columnIndex, hlBorderColor, handleDragStart, handleDragOver, handleDrop, draggable, checkboxWrapper, hugColumnWidths, hugColumnHeights, alternateRowColor, isExpandable, expandedRow, ignoreRowSelect, locale, formatOptions, }) => {
+const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRows, toggleRowSelection, columns, widthMode, index, rowKey, hasVerticalScroll, onRowClick, loading, groupBy, rowIndex, columnIndex, hlBorderColor, handleDragStart, handleDragOver, handleDrop, draggable, checkboxWrapper, hugColumnWidths, hugColumnHeights, alternateRowColor, isExpandable, expandedRow, ignoreRowSelect, locale, formatOptions, actionsKey }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
     const [itemsAlign, setItemsAlign] = useState("stretch");
     const [draggableIndex, setDraggableIndex] = useState(0);
@@ -27,7 +27,9 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
         .split(",")
         .filter((g) => g)
         .flatMap((g) => g.split("+").filter((k) => k)), [groupBy]);
-    const handleRowClick = useCallback(() => {
+    const handleRowClick = useCallback((column) => {
+        if (actionsKey === null || actionsKey === void 0 ? void 0 : actionsKey.split(",").includes(column.key))
+            return;
         onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(item);
     }, [onRowClick, item]);
     const getRowClassNames = useCallback(() => {
@@ -57,7 +59,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
         expandedRow === ((_b = item === null || item === void 0 ? void 0 : item.id) === null || _b === void 0 ? void 0 : _b.value) &&
         item.expandedDetails ? (_jsxs("div", { children: [_jsxs("div", { id: String((_d = (_c = item.id) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : index), draggable: draggable, onDragStart: (e) => handleDragStart && handleDragStart(e, index), onDragOver: (e) => handleDragOver && handleDragOver(e), onDrop: (e) => handleDrop && handleDrop(e, index), className: getRowClassNames(), style: Object.assign(Object.assign({}, rowStyle), { position: "relative", display: "flex", alignItems: itemsAlign, fontSize: "inherit", minHeight: rowHeight, height: "max-content", boxSizing: "border-box", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                         ? "var(--row-bg)"
-                        : "var(--row-bg-even)" }), onClick: handleRowClick, children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
+                        : "var(--row-bg-even)" }), children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
                                 ignoreRowSelect.has((_e = item["id"].value) === null || _e === void 0 ? void 0 : _e.toString()), onChange: () => { var _a; return toggleRowSelection((_a = item["id"].value) === null || _a === void 0 ? void 0 : _a.toString()); }, selected: item["id"] && selectedRows.has(item["id"].value), wrapperClass: checkboxWrapper }) })), item[groupBy] && (_jsx("div", { style: {
                             width: widthMode === "auto"
                                 ? "auto"
@@ -99,7 +101,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
                                         ? `1px solid ${hlBorderColor}`
                                         : "", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                                         ? "var(--row-bg)"
-                                        : "var(--row-bg-even)" }), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
+                                        : "var(--row-bg-even)" }), onClick: () => handleRowClick(column), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
                                             cursor: "grab",
                                             margin: "0 0.25rem",
                                         }, children: "\u2630" })), loading ? (_jsx("div", { style: { width: column.width, height: rowHeight }, children: _jsx(Shimmer, { height: 32, width: column.width }) })) : (_jsx("div", { className: (cellData === null || cellData === void 0 ? void 0 : cellData.className) || "", id: `column-${column.key}-${(_b = column.dataType) !== null && _b !== void 0 ? _b : "string"}`, style: {
@@ -121,13 +123,15 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
                 item.expandedDetails &&
                 item.expandedDetails.html] }, String((_o = (_m = item.id) === null || _m === void 0 ? void 0 : _m.value) !== null && _o !== void 0 ? _o : index))) : (_jsxs("div", { id: `${index}`, draggable: draggable, onDragStart: (e) => handleDragStart && handleDragStart(e, index), onDragOver: (e) => handleDragOver && handleDragOver(e), onDrop: (e) => handleDrop && handleDrop(e, index), className: getRowClassNames(), style: Object.assign(Object.assign({}, rowStyle), { position: "relative", display: "flex", alignItems: itemsAlign, fontSize: "inherit", minHeight: rowHeight, height: "max-content", boxSizing: "border-box", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                 ? "var(--row-bg)"
-                : "var(--row-bg-even)" }), onClick: handleRowClick, children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
+                : "var(--row-bg-even)" }), children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
                         ignoreRowSelect.has((_p = item["id"].value) === null || _p === void 0 ? void 0 : _p.toString()), onChange: () => { var _a; return toggleRowSelection((_a = item["id"].value) === null || _a === void 0 ? void 0 : _a.toString()); }, selected: item["id"] && selectedRows.has(item["id"].value), wrapperClass: checkboxWrapper }) })), columns.map((column, colIndex) => {
                 var _a, _b, _c, _d, _e;
                 const cellData = item[column.key];
-                const cellValue = cellData && cellData.isArrayString ? (_jsx("div", { "data-tooltip-id": (_a = item.id.value.toString()) !== null && _a !== void 0 ? _a : colIndex.toString(), "data-tooltip-html": `<div class="flex flex-col">${cellData.value.toString().split(">>").map(item => `<div>${item}</div>`).join("")}</div>`, children: cellData.value.toString().split(">>").length > 1 ?
-                        _jsxs(_Fragment, { children: [_jsx("span", { children: "Multiple" }), _jsx(Tooltip, { className: "custom-tooltip", id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] })
-                        : _jsx("span", { children: cellData.value }) })) : cellData && Object.keys(cellData).includes("html") ? (cellData === null || cellData === void 0 ? void 0 : cellData.html) : cellData && Object.keys(cellData).includes("value") ? (formatValue(cellData === null || cellData === void 0 ? void 0 : cellData.value, (_c = column.dataType) !== null && _c !== void 0 ? _c : "string", locale, formatOptions)) : cellData ? (cellData) : ("");
+                const cellValue = cellData && cellData.isArrayString ? (_jsx("div", { "data-tooltip-id": (_a = item.id.value.toString()) !== null && _a !== void 0 ? _a : colIndex.toString(), "data-tooltip-html": `<div class="flex flex-col">${cellData.value
+                        .toString()
+                        .split(">>")
+                        .map((item) => `<div>${item}</div>`)
+                        .join("")}</div>`, children: cellData.value.toString().split(">>").length > 1 ? (_jsxs(_Fragment, { children: [_jsx("span", { children: "Multiple" }), _jsx(Tooltip, { className: "custom-tooltip", id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] })) : (_jsx("span", { children: cellData.value })) })) : cellData && Object.keys(cellData).includes("html") ? (cellData === null || cellData === void 0 ? void 0 : cellData.html) : cellData && Object.keys(cellData).includes("value") ? (formatValue(cellData === null || cellData === void 0 ? void 0 : cellData.value, (_c = column.dataType) !== null && _c !== void 0 ? _c : "string", locale, formatOptions)) : cellData ? (cellData) : ("");
                 const cellUrl = cellData === null || cellData === void 0 ? void 0 : cellData.url;
                 const isHidden = column.overflowHidden;
                 if (!column.hidden && !groupByKeys.includes(column.key)) {
@@ -146,7 +150,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
                                 ? `1px solid ${hlBorderColor}`
                                 : "", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                                 ? "var(--row-bg)"
-                                : "var(--row-bg-even)" }), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
+                                : "var(--row-bg-even)" }), onClick: () => handleRowClick(column), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
                                     cursor: "grab",
                                 }, children: _jsx(MdDragIndicator, { size: "1.25rem" }) })), loading ? (_jsx("div", { style: { width: column.width, height: rowHeight }, children: _jsx(Shimmer, { height: 32, width: column.width }) })) : (_jsx("div", { className: (cellData === null || cellData === void 0 ? void 0 : cellData.className) || "", style: {
                                     display: "flex",

package/dist/components/grid/utils/groupedGridDetails.js

@@ -122,7 +122,7 @@ const GroupedGrid = ({ groupedData, rowOpened, startIndex, endIndex, alternateRo
                             }
                             return null;
                         }), isSummarise &&
-                            parseInt(((_b = item === null || item === void 0 ? void 0 : item.count) === null || _b === void 0 ? void 0 : _b.toString()) || "0") > 0 && (_jsx(SummariseDetails, { rowIndex: gIndex, removedKeys: (_c = item.groupedKey) === null || _c === void 0 ? void 0 : _c.split(">").flatMap((ele) => ele.split("+")), columns: gridColumns, groupBy: gridGroupBy, sortable: sortable, cellStyle: cellStyle, columnWidths: columnWidths, widthMode: widthMode, summariseKeys: summariseKeys, summariseDetails: summariseDetails, activeCalculateColor: activeCalculateColor, gridRef: gridRef, setCalculatePosition: setCalculatePosition, calculatePosition: calculatePosition, calculatetextColor: calculatetextColor, setCalculateVisible: setCalculateVisible, calculateVisible: calculateVisible, summariseDisplay: summariseDisplay, recalculate: recalculate, groupedData: item.groupedValue, actionsKey: actionsKey }))] }, String((_d = item.groupedValue) !== null && _d !== void 0 ? _d : gIndex))) : (_jsx(GroupedRow, { item: item.rowData, index: gIndex, rowStyle: Object.assign(Object.assign({}, rowStyle), (selectedRow === gIndex ? selectedRowStyle : {})), cellStyle: cellStyle, rowHeight: rowHeight, alternateRowColor: alternateRowColor, bulkSelect: bulkSelect, columns: gridColumns, widthMode: widthMode, rowKey: rowKey, onRowClick: onRowClick, loading: isLoading, groupBy: gridGroupBy, selectedRows: selectedRows, toggleRowSelection: toggleRowSelection, hasVerticalScroll: hasVerticalScroll, hugColumnWidths: columnWidths }, String(((_f = (_e = item.rowData) === null || _e === void 0 ? void 0 : _e.id) === null || _f === void 0 ? void 0 : _f.value)
+                            parseInt(((_b = item === null || item === void 0 ? void 0 : item.count) === null || _b === void 0 ? void 0 : _b.toString()) || "0") > 0 && (_jsx(SummariseDetails, { rowIndex: gIndex, removedKeys: (_c = item.groupedKey) === null || _c === void 0 ? void 0 : _c.split(">").flatMap((ele) => ele.split("+")), columns: gridColumns, groupBy: gridGroupBy, sortable: sortable, cellStyle: cellStyle, columnWidths: columnWidths, widthMode: widthMode, summariseKeys: summariseKeys, summariseDetails: summariseDetails, activeCalculateColor: activeCalculateColor, gridRef: gridRef, setCalculatePosition: setCalculatePosition, calculatePosition: calculatePosition, calculatetextColor: calculatetextColor, setCalculateVisible: setCalculateVisible, calculateVisible: calculateVisible, summariseDisplay: summariseDisplay, recalculate: recalculate, groupedData: item.groupedValue, actionsKey: actionsKey }))] }, String((_d = item.groupedValue) !== null && _d !== void 0 ? _d : gIndex))) : (_jsx(GroupedRow, { item: item.rowData, index: gIndex, rowStyle: Object.assign(Object.assign({}, rowStyle), (selectedRow === gIndex ? selectedRowStyle : {})), cellStyle: cellStyle, rowHeight: rowHeight, alternateRowColor: alternateRowColor, bulkSelect: bulkSelect, columns: gridColumns, widthMode: widthMode, rowKey: rowKey, onRowClick: onRowClick, loading: isLoading, groupBy: gridGroupBy, selectedRows: selectedRows, toggleRowSelection: toggleRowSelection, hasVerticalScroll: hasVerticalScroll, hugColumnWidths: columnWidths, actionsKey: actionsKey }, String(((_f = (_e = item.rowData) === null || _e === void 0 ? void 0 : _e.id) === null || _f === void 0 ? void 0 : _f.value)
                     ? `${item.groupedValue}-${(_h = (_g = item.rowData) === null || _g === void 0 ? void 0 : _g.id) === null || _h === void 0 ? void 0 : _h.value}`
                     : gIndex)));
         }) }));

package/dist/components/grid/utils/groupedRow.js

@@ -15,8 +15,10 @@ const isUrl = (value) => {
     }
     return false;
 };
-const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode, index, rowKey, onRowClick, loading, groupBy, hugColumnWidths, alternateRowColor, }) => {
-    const handleRowClick = useCallback(() => {
+const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode, index, rowKey, onRowClick, loading, groupBy, hugColumnWidths, alternateRowColor, actionsKey, }) => {
+    const handleRowClick = useCallback((column) => {
+        if (actionsKey === null || actionsKey === void 0 ? void 0 : actionsKey.split(",").includes(column.key))
+            return;
         onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(item);
     }, [onRowClick, item]);
     const getRowClassNames = useCallback(() => {
@@ -31,7 +33,7 @@ const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode,
         .flatMap((g) => g.split("+").filter((k) => k)), [groupBy]);
     return (_jsxs("div", { id: `${index}`, className: getRowClassNames(), style: Object.assign(Object.assign({}, rowStyle), { position: "relative", display: "flex", alignItems: "center", fontSize: "inherit", minHeight: rowHeight, height: "max-content", boxSizing: "border-box", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                 ? "var(--row-bg)"
-                : "var(--row-bg-even)" }), onClick: handleRowClick, children: [groupByKeys.map((_groupBy) => {
+                : "var(--row-bg-even)" }), children: [groupByKeys.map((_groupBy) => {
                 var _a, _b;
                 return (_jsx("div", { style: {
                         width: widthMode === "auto"
@@ -77,7 +79,7 @@ const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode,
                             //     : "",
                             backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                                 ? "var(--row-bg)"
-                                : "var(--row-bg-even)" }), children: loading ? (_jsx("div", { style: { width: column.width, height: rowHeight }, children: _jsx(Shimmer, { height: 32, width: column.width }) })) : (_jsx("div", { className: (cellData === null || cellData === void 0 ? void 0 : cellData.className) || "", style: {
+                                : "var(--row-bg-even)" }), onClick: () => handleRowClick(column), children: loading ? (_jsx("div", { style: { width: column.width, height: rowHeight }, children: _jsx(Shimmer, { height: 32, width: column.width }) })) : (_jsx("div", { className: (cellData === null || cellData === void 0 ? void 0 : cellData.className) || "", style: {
                                 display: "flex",
                                 alignItems: "center", // Vertically center content within the cell
                                 width: "100%",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megha-ui/react",
-  "version": "1.2.466",
+  "version": "1.2.468",
   "description": "A collection of reusable UI components for React applications, built with TypeScript.",
   "main": "./dist/index.js",
   "module": "./dist/index.js",