@megha-ui/react 1.3.23 → 1.3.25

package/dist/components/grid/index.js

@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useEffect, useRef, useMemo, } from "react";
+import { useState, useEffect, useRef, useMemo } from "react";
 import * as XLSX from "xlsx";
 import { saveAs } from "file-saver";
 import Pagination from "./utils/pagination";
@@ -1516,11 +1516,12 @@ withCard = false, cardClassName, cardHeader, title, headerLeft, headerRight, sub
                                             }, children: "\u00D7" })] }, chip));
                             })] }))] }), _jsxs("div", { id: `grid-content`, onScroll: onScroll, ref: gridRef, style: {
                     display: "grid",
-                    gridTemplateColumns: gridColumns
-                        .map((_, index) => index > gridColumns.length - 2
-                        ? "minmax(max-content, 1fr)"
-                        : "max-content")
-                        .join(" "),
+                    gridTemplateColumns: [
+                        ...(bulkSelect ? ["max-content"] : []),
+                        ...gridColumns.map((_, index) => index < gridColumns.length - 1
+                            ? "max-content"
+                            : "minmax(max-content, 1fr)"),
+                    ].join(" "),
                     gridAutoRows: "max-content",
                     height: `calc(100% - ${removalHeight})`,
                     border: gridBorder ? "1px solid #f0f0f0" : "none",
@@ -1549,7 +1550,7 @@ withCard = false, cardClassName, cardHeader, title, headerLeft, headerRight, sub
                             alignItems: "center",
                             padding: "1rem 0",
                             justifyContent: "center",
-                            gridColumn: "1 / -1"
+                            gridColumn: "1 / -1",
                         }, children: "No Data available" })), summariseAvailable &&
                         filteredData.length > 0 &&
                         gridGroupBy === "" && (_jsx(NewSummariseDetails, { summariseKeys: summariseKeys, columns: gridColumns, groupBy: gridGroupBy, sortable: sortable, cellStyle: cellStyle, columnWidths: columnWidths, widthMode: widthMode, summariseDetails: summariseDetails, activeCalculateColor: activeCalculateColor, gridRef: gridRef, setCalculatePosition: setCalculatePosition, calculatePosition: calculatePosition, calculatetextColor: calculatetextColor, setCalculateVisible: setCalculateVisible, calculateVisible: calculateVisible, summariseDisplay: summariseDisplay, recalculate: recalculate, actionsKey: actionsKey }))] }), paginate && gridGroupBy === "" && (_jsxs("div", { id: "pagination", style: {

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

@@ -246,7 +246,10 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
         setIsResizing(false);
         setResizeIndex(-1);
     };
-    return (_jsxs(_Fragment, { children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis", position: "sticky", top: 0, zIndex: 1 }), children: _jsx(Checkbox, { selected: allRowsSelected, onChange: () => toggleSelectAll(), noLabel: true, wrapperClass: checkboxWrapper }) })), groupByKeys.map((_groupBy) => {
+    return (_jsxs(_Fragment, { children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis", position: "sticky", top: 0, zIndex: 1, backgroundColor: "var(--row-header-bg)" }), children: _jsx("div", { style: {
+                        display: "flex",
+                        alignItems: "center"
+                    }, children: _jsx(Checkbox, { selected: allRowsSelected, onChange: () => toggleSelectAll(), noLabel: true, wrapperClass: checkboxWrapper }) }) })), groupByKeys.map((_groupBy) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58;
                 return (_jsx(_Fragment, { children: headerColumns.find((column) => column.key === _groupBy) && (_jsxs("div", { className: `${sortable &&
                             ((_a = headerColumns.find((column) => column.key === _groupBy)) === null || _a === void 0 ? void 0 : _a.sortable)

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

@@ -93,10 +93,15 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
     return isExpandable &&
         ((_a = item === null || item === void 0 ? void 0 : item.id) === null || _a === void 0 ? void 0 : _a.value) &&
         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), 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", height: "max-content", boxSizing: "border-box", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
+        item.expandedDetails ? (_jsxs("div", { style: { display: "contents" }, children: [_jsxs("div", { id: String((_d = (_c = item.id) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : 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", height: "max-content", boxSizing: "border-box", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
                         ? "var(--row-bg)"
-                        : "var(--row-bg-even)" }), children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign(Object.assign({}, cellStyle), dragHighlightStyle), { 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: {
+                        : "var(--row-bg-even)" }), children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign(Object.assign({}, cellStyle), dragHighlightStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
+                                ? "var(--row-bg)"
+                                : "var(--row-bg-even)" }), children: _jsx("div", { style: {
+                                display: "flex",
+                                alignItems: "center",
+                            }, 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: {
                             wordBreak: widthMode === "auto" ? "break-all" : "unset",
                             padding: groupBy ? "0.25rem" : 0,
                             backgroundColor: alternateRowColor && (index + 1) % 2 === 0
@@ -142,8 +147,13 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
                 ((_h = item === null || item === void 0 ? void 0 : item.id) === null || _h === void 0 ? void 0 : _h.value) &&
                 expandedRow === ((_j = item === null || item === void 0 ? void 0 : item.id) === null || _j === void 0 ? void 0 : _j.value) &&
                 item.expandedDetails &&
-                item.expandedDetails.html] }, String((_l = (_k = item.id) === null || _k === void 0 ? void 0 : _k.value) !== null && _l !== void 0 ? _l : index))) : (_jsxs("div", { id: `${index}`, className: getRowClassNames(), onDragOver: (e) => handleDragOver && handleDragOver(e), onDrop: (e) => handleDrop && handleDrop(e, index), style: { display: "contents" }, children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign(Object.assign(Object.assign({}, cellStyle), rowStyle), dragHighlightStyle), { textTransform: "uppercase", padding: "0.25rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
-                        ignoreRowSelect.has((_m = item["id"].value) === null || _m === void 0 ? void 0 : _m.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) => {
+                item.expandedDetails.html] }, String((_l = (_k = item.id) === null || _k === void 0 ? void 0 : _k.value) !== null && _l !== void 0 ? _l : index))) : (_jsxs("div", { id: `${index}`, className: getRowClassNames(), onDragOver: (e) => handleDragOver && handleDragOver(e), onDrop: (e) => handleDrop && handleDrop(e, index), style: { display: "contents" }, children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign(Object.assign(Object.assign({}, cellStyle), rowStyle), dragHighlightStyle), { textTransform: "uppercase", padding: "0.25rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
+                        ? "var(--row-bg)"
+                        : "var(--row-bg-even)" }), children: _jsx("div", { style: {
+                        display: "flex",
+                        alignItems: "center",
+                    }, children: _jsx(Checkbox, { noLabel: true, disabled: ignoreRowSelect &&
+                            ignoreRowSelect.has((_m = item["id"].value) === null || _m === void 0 ? void 0 : _m.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, _f, _g;
                 const cellData = item[column.key];
                 const cellValue = cellData && cellData.isArrayString ? (_jsx("div", { children: cellData.value.toString().split(">>").length > 1 ? (_jsx(_Fragment, { children: column.isArrayString ? (_jsxs("div", { className: "flex items-center gap-2", children: [cellData.value

package/package.json

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