@megha-ui/react 1.2.467 → 1.2.468
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.
|
@@ -19,7 +19,7 @@ const isUrl = (value) => {
|
|
|
19
19
|
}
|
|
20
20
|
return false;
|
|
21
21
|
};
|
|
22
|
-
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, }) => {
|
|
22
|
+
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 }) => {
|
|
23
23
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
24
24
|
const [itemsAlign, setItemsAlign] = useState("stretch");
|
|
25
25
|
const [draggableIndex, setDraggableIndex] = useState(0);
|
|
@@ -27,7 +27,9 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
27
27
|
.split(",")
|
|
28
28
|
.filter((g) => g)
|
|
29
29
|
.flatMap((g) => g.split("+").filter((k) => k)), [groupBy]);
|
|
30
|
-
const handleRowClick = useCallback(() => {
|
|
30
|
+
const handleRowClick = useCallback((column) => {
|
|
31
|
+
if (actionsKey === null || actionsKey === void 0 ? void 0 : actionsKey.split(",").includes(column.key))
|
|
32
|
+
return;
|
|
31
33
|
onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(item);
|
|
32
34
|
}, [onRowClick, item]);
|
|
33
35
|
const getRowClassNames = useCallback(() => {
|
|
@@ -57,7 +59,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
57
59
|
expandedRow === ((_b = item === null || item === void 0 ? void 0 : item.id) === null || _b === void 0 ? void 0 : _b.value) &&
|
|
58
60
|
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
|
|
59
61
|
? "var(--row-bg)"
|
|
60
|
-
: "var(--row-bg-even)" }),
|
|
62
|
+
: "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 &&
|
|
61
63
|
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: {
|
|
62
64
|
width: widthMode === "auto"
|
|
63
65
|
? "auto"
|
|
@@ -99,7 +101,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
99
101
|
? `1px solid ${hlBorderColor}`
|
|
100
102
|
: "", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
|
|
101
103
|
? "var(--row-bg)"
|
|
102
|
-
: "var(--row-bg-even)" }), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
|
|
104
|
+
: "var(--row-bg-even)" }), onClick: () => handleRowClick(column), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
|
|
103
105
|
cursor: "grab",
|
|
104
106
|
margin: "0 0.25rem",
|
|
105
107
|
}, 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
|
|
|
121
123
|
item.expandedDetails &&
|
|
122
124
|
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
|
|
123
125
|
? "var(--row-bg)"
|
|
124
|
-
: "var(--row-bg-even)" }),
|
|
126
|
+
: "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 &&
|
|
125
127
|
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) => {
|
|
126
128
|
var _a, _b, _c, _d, _e;
|
|
127
129
|
const cellData = item[column.key];
|
|
128
|
-
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
|
|
129
|
-
|
|
130
|
-
|
|
130
|
+
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
|
|
131
|
+
.toString()
|
|
132
|
+
.split(">>")
|
|
133
|
+
.map((item) => `<div>${item}</div>`)
|
|
134
|
+
.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) : ("");
|
|
131
135
|
const cellUrl = cellData === null || cellData === void 0 ? void 0 : cellData.url;
|
|
132
136
|
const isHidden = column.overflowHidden;
|
|
133
137
|
if (!column.hidden && !groupByKeys.includes(column.key)) {
|
|
@@ -146,7 +150,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
146
150
|
? `1px solid ${hlBorderColor}`
|
|
147
151
|
: "", backgroundColor: alternateRowColor && (index + 1) % 2 === 0
|
|
148
152
|
? "var(--row-bg)"
|
|
149
|
-
: "var(--row-bg-even)" }), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
|
|
153
|
+
: "var(--row-bg-even)" }), onClick: () => handleRowClick(column), children: [draggable && colIndex === draggableIndex && (_jsx("div", { onDragStart: (e) => handleDragStart && handleDragStart(e, index), style: {
|
|
150
154
|
cursor: "grab",
|
|
151
155
|
}, 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: {
|
|
152
156
|
display: "flex",
|
package/package.json
CHANGED