@megha-ui/react 1.2.239 → 1.2.240

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

@@ -46,6 +46,11 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
     const [searchOpsPosition, setSearchOpsPosition] = useState(null);
     const [headerColumns, setHeaderColumns] = useState([]);
     const [resizeIndex, setResizeIndex] = useState(-1);
+    // Support composite groupBy (e.g., "colA+colB,colC") by flattening to keys
+    const groupByKeys = useMemo(() => (groupBy || "")
+        .split(",")
+        .filter((g) => g)
+        .flatMap((g) => g.split("+").filter((k) => k)), [groupBy]);
     const handleMenuClick = (e, columnKey) => {
         e.stopPropagation();
         const rect = e.currentTarget.getBoundingClientRect();
@@ -230,10 +235,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
             position: "sticky",
             top: 0,
             zIndex: 1,
-        }, id: "header", children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), children: _jsx(Checkbox, { selected: allRowsSelected, onChange: () => toggleSelectAll(), noLabel: true, wrapperClass: checkboxWrapper }) })), groupBy
-                .split(",")
-                .filter((item) => item)
-                .map((_groupBy) => {
+        }, id: "header", children: [bulkSelect && (_jsx("div", { style: Object.assign(Object.assign({}, cellStyle), { textTransform: "uppercase", padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis" }), 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, _59, _60, _61, _62;
                 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)
@@ -507,7 +509,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
                                             : "var(--disabled-bg)",
                                     }, height: 32, extraInputStyle: { minWidth: 10 }, className: "w-full", backgroundColor: "var(--background)" }) }))] }, (_62 = headerColumns.find((column) => column.key === _groupBy)) === null || _62 === void 0 ? void 0 : _62.key)) }));
             }), headerColumns
-                .filter((column) => !groupBy.includes(column.key))
+                .filter((column) => !groupByKeys.includes(column.key))
                 .map((column, colIndex) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
                 if (!column.hidden) {

package/package.json

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