@megha-ui/react 1.2.132 → 1.2.133
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/grid/index.js +5 -7
- package/dist/components/grid/types/grid.d.ts +4 -0
- package/dist/components/grid/utils/gridFilterDropdown.d.ts +2 -0
- package/dist/components/grid/utils/gridFilterDropdown.js +2 -2
- package/dist/components/grid/utils/gridHeader.d.ts +2 -0
- package/dist/components/grid/utils/gridHeader.js +2 -2
- package/dist/components/grid/utils/groupedGridDetails.js +1 -1
- package/package.json +1 -1
|
@@ -1356,16 +1356,14 @@ const Grid = ({ columns, wrapperClass, updateGridColumns, data, height, sortable
|
|
|
1356
1356
|
return data[column.key] && data[column.key].value
|
|
1357
1357
|
? (_a = data[column.key].value) === null || _a === void 0 ? void 0 : _a.toString()
|
|
1358
1358
|
: "";
|
|
1359
|
-
})
|
|
1359
|
+
}),
|
|
1360
1360
|
];
|
|
1361
|
-
selectedValues.forEach(item => {
|
|
1361
|
+
selectedValues.forEach((item) => {
|
|
1362
1362
|
if (!options.includes(item)) {
|
|
1363
1363
|
options.push(item);
|
|
1364
1364
|
}
|
|
1365
1365
|
});
|
|
1366
|
-
options = [
|
|
1367
|
-
...new Set(options),
|
|
1368
|
-
];
|
|
1366
|
+
options = [...new Set(options)];
|
|
1369
1367
|
if (!column.hidden) {
|
|
1370
1368
|
return ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
1371
1369
|
position: "relative",
|
|
@@ -1416,7 +1414,7 @@ const Grid = ({ columns, wrapperClass, updateGridColumns, data, height, sortable
|
|
|
1416
1414
|
: [..._gridGroupBy.split(",").filter((item) => item), value].join(",");
|
|
1417
1415
|
setGridGroupBy(_gridGroupBy);
|
|
1418
1416
|
updateGroupBy && updateGroupBy(_gridGroupBy);
|
|
1419
|
-
}, headerDropdownIndex: headerDropdownIndex, updateGridColumns: updateGridColumns, setGridColumns: setGridColumns, widthUnits: widthUnits, gridData: filteredData, checkboxWrapper: checkboxWrapper, onFilter: onFilter, setUniqueSearch: setUniqueSearch, uniqueSearch: uniqueSearch, hugColumnWidths: columnWidths, menuVisible: menuVisible, setMenuVisible: setMenuVisible, dropdownVisible: dropdownVisible, actionsKey: actionsKey, setDropdownVisible: setDropdownVisible, columnSearchOutside: columnSearchOutside }), hugLoading && ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
1417
|
+
}, headerDropdownIndex: headerDropdownIndex, updateGridColumns: updateGridColumns, setGridColumns: setGridColumns, widthUnits: widthUnits, gridData: filteredData, checkboxWrapper: checkboxWrapper, onFilter: onFilter, setUniqueSearch: setUniqueSearch, uniqueSearch: uniqueSearch, hugColumnWidths: columnWidths, menuVisible: menuVisible, setMenuVisible: setMenuVisible, dropdownVisible: dropdownVisible, actionsKey: actionsKey, setDropdownVisible: setDropdownVisible, columnSearchOutside: columnSearchOutside, locale: locale, formatOptions: formatOptions }), hugLoading && ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
1420
1418
|
position: "sticky",
|
|
1421
1419
|
width: "100%",
|
|
1422
1420
|
height: `calc(100% - ${(_a = headerRef === null || headerRef === void 0 ? void 0 : headerRef.current) === null || _a === void 0 ? void 0 : _a.clientHeight}px)`,
|
|
@@ -1429,7 +1427,7 @@ const Grid = ({ columns, wrapperClass, updateGridColumns, data, height, sortable
|
|
|
1429
1427
|
alignItems: "center",
|
|
1430
1428
|
justifyContent: "center",
|
|
1431
1429
|
background: "#fff",
|
|
1432
|
-
}, children: (0, jsx_runtime_1.jsx)(loader_1.default, { size: 32 }) })), (0, jsx_runtime_1.jsx)("div", { id: "table-body", children: gridGroupBy !== "" ? ((0, jsx_runtime_1.jsx)(groupedGridDetails_1.default, { groupedData: groupedData, rowOpened: rowOpened, startIndex: startIndex, endIndex: endIndex, alternateRowColor: alternateRowColor, updateRowOpened: updateRowOpened, columnWidths: columnWidths, columnHeights: columnHeights, groupBy: groupBy, widthMode: widthMode, rowKey: rowKey, rowHeight: rowHeight, headerBackground: headerBackground, isSummarise: summariseAvailable, gridGroupBy: gridGroupBy, rowStyle: rowStyle, sortable: sortable, cellStyle: cellStyle, summariseKeys: summariseKeys, summariseDetails: summariseDetails, activeCalculateColor: activeCalculateColor, gridRef: gridRef, setCalculatePosition: setCalculatePosition, calculatePosition: calculatePosition, calculatetextColor: calculatetextColor, setCalculateVisible: setCalculateVisible, calculateVisible: calculateVisible, summariseDisplay: summariseDisplay, recalculate: recalculate, selectedRowStyle: selectedRowStyle, isLoading: isLoading, selectedRow: selectedRow, onRowClick: onRowClick, gridColumns: gridColumns, bulkSelect: bulkSelect, selectedRows: selectedRows, toggleRowSelection: toggleRowSelection, hasVerticalScroll: hasVerticalScroll, setColumnWidths: setColumnWidths, setColumnHeights: setColumnHeights, actionsKey: actionsKey })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(paginate ? paginatedData : sortedData).map((item, index) => {
|
|
1430
|
+
}, children: (0, jsx_runtime_1.jsx)(loader_1.default, { size: 32 }) })), (0, jsx_runtime_1.jsx)("div", { id: "table-body", children: gridGroupBy !== "" ? ((0, jsx_runtime_1.jsx)(groupedGridDetails_1.default, { locale: locale, formatOptions: formatOptions, groupedData: groupedData, rowOpened: rowOpened, startIndex: startIndex, endIndex: endIndex, alternateRowColor: alternateRowColor, updateRowOpened: updateRowOpened, columnWidths: columnWidths, columnHeights: columnHeights, groupBy: groupBy, widthMode: widthMode, rowKey: rowKey, rowHeight: rowHeight, headerBackground: headerBackground, isSummarise: summariseAvailable, gridGroupBy: gridGroupBy, rowStyle: rowStyle, sortable: sortable, cellStyle: cellStyle, summariseKeys: summariseKeys, summariseDetails: summariseDetails, activeCalculateColor: activeCalculateColor, gridRef: gridRef, setCalculatePosition: setCalculatePosition, calculatePosition: calculatePosition, calculatetextColor: calculatetextColor, setCalculateVisible: setCalculateVisible, calculateVisible: calculateVisible, summariseDisplay: summariseDisplay, recalculate: recalculate, selectedRowStyle: selectedRowStyle, isLoading: isLoading, selectedRow: selectedRow, onRowClick: onRowClick, gridColumns: gridColumns, bulkSelect: bulkSelect, selectedRows: selectedRows, toggleRowSelection: toggleRowSelection, hasVerticalScroll: hasVerticalScroll, setColumnWidths: setColumnWidths, setColumnHeights: setColumnHeights, actionsKey: actionsKey })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(paginate ? paginatedData : sortedData).map((item, index) => {
|
|
1433
1431
|
var _a, _b, _c, _d;
|
|
1434
1432
|
if (paginate) {
|
|
1435
1433
|
return ((0, jsx_runtime_1.jsx)(gridRow_1.default, { item: item, index: index, rowStyle: Object.assign(Object.assign({}, rowStyle), (selectedRow === index ? selectedRowStyle : {})), handleDragStart: handleDragStart, handleDragOver: handleDragOver, handleDrop: handleDrop, draggable: draggable, cellStyle: cellStyle, rowHeight: rowHeight, alternateRowColor: alternateRowColor, bulkSelect: bulkSelect, selectedRows: selectedRows ? selectedRows : new Set([""]), ignoreRowSelect: ignoreRowSelect ? ignoreRowSelect : new Set([""]), toggleRowSelection: toggleRowSelection, columns: gridColumns, widthMode: widthMode, hasVerticalScroll: hasVerticalScroll, onRowClick: onRowClick, loading: isLoading, groupBy: gridGroupBy, rowKey: rowKey, rowIndex: rowIndex, columnIndex: columnIndex, hlBorderColor: hlBorderColor, hugColumnWidths: columnWidths, hugColumnHeights: columnHeights, expandedRow: expandedRow, isExpandable: isExpandable, checkboxWrapper: checkboxWrapper, locale: locale, formatOptions: formatOptions }, String((_b = (_a = item.id) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : index)));
|
|
@@ -179,6 +179,8 @@ export interface GroupedRowProps {
|
|
|
179
179
|
};
|
|
180
180
|
gridTemplateColumns?: string;
|
|
181
181
|
alternateRowColor?: boolean;
|
|
182
|
+
locale?: string;
|
|
183
|
+
formatOptions?: any;
|
|
182
184
|
}
|
|
183
185
|
export interface GroupedData {
|
|
184
186
|
type: string;
|
|
@@ -244,6 +246,8 @@ export interface GroupedGridProps {
|
|
|
244
246
|
setColumnWidths: any;
|
|
245
247
|
setColumnHeights: any;
|
|
246
248
|
actionsKey: string;
|
|
249
|
+
locale?: string;
|
|
250
|
+
formatOptions?: any;
|
|
247
251
|
}
|
|
248
252
|
export interface GridRowProps {
|
|
249
253
|
item: DataRow;
|
|
@@ -30,6 +30,8 @@ interface GridFilterDropdownProps {
|
|
|
30
30
|
searchable: boolean;
|
|
31
31
|
columnIndex: number;
|
|
32
32
|
columnType: string;
|
|
33
|
+
locale?: string;
|
|
34
|
+
formatOptions?: any;
|
|
33
35
|
}
|
|
34
36
|
declare const GridFilterDropdown: React.FC<GridFilterDropdownProps>;
|
|
35
37
|
export default GridFilterDropdown;
|
|
@@ -10,7 +10,7 @@ const textFilterDropdown_1 = __importDefault(require("./textFilterDropdown"));
|
|
|
10
10
|
const text_input_1 = __importDefault(require("../../text-input"));
|
|
11
11
|
const checkbox_1 = __importDefault(require("../../checkbox"));
|
|
12
12
|
const commonService_1 = require("../../../services/commonService");
|
|
13
|
-
const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, columnKey, searchElement, activeSearchType, textFilterLabel, columnData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, sortingOps, searchable, searchInput, columnIndex, columnType }) => {
|
|
13
|
+
const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, columnKey, searchElement, activeSearchType, textFilterLabel, columnData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, sortingOps, searchable, searchInput, columnIndex, columnType, locale, formatOptions }) => {
|
|
14
14
|
var _a, _b, _c, _d;
|
|
15
15
|
const [isOpen, setIsOpen] = (0, react_1.useState)(false);
|
|
16
16
|
const [filterColumnData, setFilterColumnData] = (0, react_1.useState)([]);
|
|
@@ -82,7 +82,7 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
|
|
|
82
82
|
cursor: "pointer",
|
|
83
83
|
display: "flex",
|
|
84
84
|
alignItems: "center",
|
|
85
|
-
}, onClick: () => handleSelect(item, columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: (_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.includes(item), onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper }), (0, jsx_runtime_1.jsx)("span", { style: { marginLeft: "0.5rem" }, children: (0, commonService_1.formatValue)(item, columnType) })] }, item));
|
|
85
|
+
}, onClick: () => handleSelect(item, columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: (_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.includes(item), onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper }), (0, jsx_runtime_1.jsx)("span", { style: { marginLeft: "0.5rem" }, children: (0, commonService_1.formatValue)(item, columnType, locale, formatOptions) })] }, item));
|
|
86
86
|
})] }))] })), isOpen && ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { combined: true, columnIndex: columnIndex, headerDropdownIndex: headerDropdownIndex || 1001, searchOptions: searchOptions, position: position
|
|
87
87
|
? {
|
|
88
88
|
top: position.top,
|
|
@@ -52,6 +52,8 @@ interface GridHeaderProps {
|
|
|
52
52
|
setDropdownVisible: any;
|
|
53
53
|
actionsKey?: string;
|
|
54
54
|
columnSearchOutside: boolean;
|
|
55
|
+
locale?: string;
|
|
56
|
+
formatOptions?: any;
|
|
55
57
|
}
|
|
56
58
|
export declare const getColumnData: (columnKey: string, gridData: DataRow[], type: string) => (string | number)[];
|
|
57
59
|
declare const _default: React.NamedExoticComponent<GridHeaderProps>;
|
|
@@ -81,7 +81,7 @@ const getColumnData = (columnKey, gridData, type) => {
|
|
|
81
81
|
});
|
|
82
82
|
};
|
|
83
83
|
exports.getColumnData = getColumnData;
|
|
84
|
-
const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resizable = false, defaultSearchOperation, sortQueries, onSort, bulkSelect, allRowsSelected, someRowsSelected, toggleSelectAll, cellStyle, widthMode, rowHeight, headerRef, showMenu, headerBackground, headerTopBorder, headerBottomBorder, groupBy, setGroupBy, updateGridColumns, setGridColumns, headerDropdownIndex, widthUnits, textFilterLabel = "Text Filter", gridData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, hugColumnWidths, menuVisible, setMenuVisible, dropdownVisible, setDropdownVisible, actionsKey = "actions", columnSearchOutside, }) => {
|
|
84
|
+
const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resizable = false, defaultSearchOperation, sortQueries, onSort, bulkSelect, allRowsSelected, someRowsSelected, toggleSelectAll, cellStyle, widthMode, rowHeight, headerRef, showMenu, headerBackground, headerTopBorder, headerBottomBorder, groupBy, setGroupBy, updateGridColumns, setGridColumns, headerDropdownIndex, widthUnits, textFilterLabel = "Text Filter", gridData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, hugColumnWidths, menuVisible, setMenuVisible, dropdownVisible, setDropdownVisible, actionsKey = "actions", columnSearchOutside, locale, formatOptions, }) => {
|
|
85
85
|
const [menuPosition, setMenuPosition] = (0, react_1.useState)(null);
|
|
86
86
|
const [searchOpsPosition, setSearchOpsPosition] = (0, react_1.useState)(null);
|
|
87
87
|
const [headerColumns, setHeaderColumns] = (0, react_1.useState)([]);
|
|
@@ -332,7 +332,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
|
|
|
332
332
|
: "#000",
|
|
333
333
|
} }), dropdownVisible ===
|
|
334
334
|
((_r = headerColumns.find((column) => column.key === _groupBy)) === null || _r === void 0 ? void 0 : _r.key) &&
|
|
335
|
-
(((_s = headerColumns.find((column) => column.key === _groupBy)) === null || _s === void 0 ? void 0 : _s.uniqueDrop) ? ((0, jsx_runtime_1.jsx)(gridFilterDropdown_1.default, { columnType: (_u = (_t = headerColumns.find((column) => column.key === _groupBy)) === null || _t === void 0 ? void 0 : _t.dataType) !== null && _u !== void 0 ? _u : "string", columnIndex: -1, searchable: ((_v = headerColumns.find((column) => column.key === _groupBy)) === null || _v === void 0 ? void 0 : _v.search) || false, headerDropdownIndex: headerDropdownIndex, searchInput: (search &&
|
|
335
|
+
(((_s = headerColumns.find((column) => column.key === _groupBy)) === null || _s === void 0 ? void 0 : _s.uniqueDrop) ? ((0, jsx_runtime_1.jsx)(gridFilterDropdown_1.default, { locale: locale, formatOptions: formatOptions, columnType: (_u = (_t = headerColumns.find((column) => column.key === _groupBy)) === null || _t === void 0 ? void 0 : _t.dataType) !== null && _u !== void 0 ? _u : "string", columnIndex: -1, searchable: ((_v = headerColumns.find((column) => column.key === _groupBy)) === null || _v === void 0 ? void 0 : _v.search) || false, headerDropdownIndex: headerDropdownIndex, searchInput: (search &&
|
|
336
336
|
((_w = headerColumns.find((column) => column.key === _groupBy)) === null || _w === void 0 ? void 0 : _w.search) && ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
337
337
|
marginTop: "0.5rem",
|
|
338
338
|
padding: "0.5rem",
|
|
@@ -7,7 +7,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
7
7
|
const react_1 = require("react");
|
|
8
8
|
const groupedRow_1 = __importDefault(require("./groupedRow"));
|
|
9
9
|
const SummariseDetails_1 = __importDefault(require("./SummariseDetails"));
|
|
10
|
-
const GroupedGrid = ({ groupedData, rowOpened, startIndex, endIndex, alternateRowColor, updateRowOpened, columnWidths, columnHeights, groupBy, widthMode, rowKey, rowHeight, headerBackground, isSummarise, gridGroupBy, rowStyle, sortable, cellStyle, summariseKeys, summariseDetails, activeCalculateColor, gridRef, setCalculatePosition, calculatePosition, calculatetextColor, setCalculateVisible, calculateVisible, summariseDisplay, recalculate, selectedRowStyle, isLoading, selectedRow, onRowClick, gridColumns, bulkSelect, selectedRows, toggleRowSelection, hasVerticalScroll, setColumnWidths, setColumnHeights, actionsKey, }) => {
|
|
10
|
+
const GroupedGrid = ({ groupedData, rowOpened, startIndex, endIndex, alternateRowColor, updateRowOpened, columnWidths, columnHeights, groupBy, widthMode, rowKey, rowHeight, headerBackground, isSummarise, gridGroupBy, rowStyle, sortable, cellStyle, summariseKeys, summariseDetails, activeCalculateColor, gridRef, setCalculatePosition, calculatePosition, calculatetextColor, setCalculateVisible, calculateVisible, summariseDisplay, recalculate, selectedRowStyle, isLoading, selectedRow, onRowClick, gridColumns, bulkSelect, selectedRows, toggleRowSelection, hasVerticalScroll, setColumnWidths, setColumnHeights, actionsKey, locale, formatOptions, }) => {
|
|
11
11
|
const groupedDiv = (0, react_1.useRef)(null);
|
|
12
12
|
const [renderedKeys, setRenderedKeys] = (0, react_1.useState)([]);
|
|
13
13
|
(0, react_1.useEffect)(() => {
|
package/package.json
CHANGED