@megha-ui/react 1.2.640 → 1.2.641
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.
|
@@ -150,7 +150,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
150
150
|
? "var(--row-bg)"
|
|
151
151
|
: "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 &&
|
|
152
152
|
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) => {
|
|
153
|
-
var _a, _b, _c, _d, _e, _f
|
|
153
|
+
var _a, _b, _c, _d, _e, _f;
|
|
154
154
|
const cellData = item[column.key];
|
|
155
155
|
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
|
|
156
156
|
.toString()
|
|
@@ -171,18 +171,14 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
171
171
|
var _a;
|
|
172
172
|
return checkAvailableForTooltip((_a = item.id.value.toString()) !== null && _a !== void 0 ? _a : colIndex.toString());
|
|
173
173
|
}, children: ["+", " ", cellData.value.toString().split(">>").slice(3)
|
|
174
|
-
.length, " ", "more", _jsx(Tooltip, { className: "custom-tooltip", clickable: true, id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] }))] })) : (
|
|
175
|
-
.toString()
|
|
176
|
-
.split(">>")
|
|
177
|
-
.map((item) => `<div>${item}</div>`)
|
|
178
|
-
.join("")}</div>`, children: ["Multiple", " ", `(${cellData.value.toString().split(">>").length})`] }), _jsx(Tooltip, { className: "custom-tooltip", id: (_d = item.id.value.toString()) !== null && _d !== void 0 ? _d : colIndex.toString(), place: "left" })] })) })) : (_jsx("span", { children: cellData.value })) })) : column.isArrayString ? (_jsx("span", { className: "flex-grow-0 flex-shrink-0 rounded-full", style: (cellData === null || cellData === void 0 ? void 0 : cellData.value)
|
|
174
|
+
.length, " ", "more", _jsx(Tooltip, { className: "custom-tooltip", clickable: true, id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] }))] })) : (_jsx("span", { children: `${cellData.value.toString().split(">>").join(", ")}` })) })) : (_jsx("span", { children: cellData.value })) })) : column.isArrayString ? (_jsx("span", { className: "flex-grow-0 flex-shrink-0 rounded-full", style: (cellData === null || cellData === void 0 ? void 0 : cellData.value)
|
|
179
175
|
? {
|
|
180
176
|
background: "var(--standard)",
|
|
181
177
|
color: "var(--foreground)",
|
|
182
178
|
border: "1px solid var(--standard)",
|
|
183
179
|
padding: "0.25rem 0.5rem",
|
|
184
180
|
}
|
|
185
|
-
: {}, children: (
|
|
181
|
+
: {}, children: (_c = cellData === null || cellData === void 0 ? void 0 : cellData.value) !== null && _c !== void 0 ? _c : "" })) : 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, (_d = column.dataType) !== null && _d !== void 0 ? _d : "string", locale, formatOptions)) : cellData ? (cellData) : ("");
|
|
186
182
|
const cellUrl = cellData === null || cellData === void 0 ? void 0 : cellData.url;
|
|
187
183
|
const isHidden = column.overflowHidden;
|
|
188
184
|
if (!column.hidden && !groupByKeys.includes(column.key)) {
|
|
@@ -213,7 +209,7 @@ const GridRow = ({ item, rowStyle, cellStyle, rowHeight, bulkSelect, selectedRow
|
|
|
213
209
|
column.dataType === "currency"
|
|
214
210
|
? "end"
|
|
215
211
|
: "start",
|
|
216
|
-
}, children: isUrl(cellUrl) ? (_jsx("a", { href: cellUrl, target: "_blank", rel: "noopener noreferrer", children: cellValue })) : column.render ? (column.render(cellValue)) : (cellValue) }))] }, `${column.key}-${(
|
|
212
|
+
}, children: isUrl(cellUrl) ? (_jsx("a", { href: cellUrl, target: "_blank", rel: "noopener noreferrer", children: cellValue })) : column.render ? (column.render(cellValue)) : (cellValue) }))] }, `${column.key}-${(_f = (_e = item.id) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : index}`));
|
|
217
213
|
}
|
|
218
214
|
return null;
|
|
219
215
|
})] }, String((_r = (_q = item.id) === null || _q === void 0 ? void 0 : _q.value) !== null && _r !== void 0 ? _r : index)));
|
|
@@ -32,6 +32,28 @@ const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode,
|
|
|
32
32
|
.split(",")
|
|
33
33
|
.filter((g) => g)
|
|
34
34
|
.flatMap((g) => g.split("+").filter((k) => k)), [groupBy]);
|
|
35
|
+
const checkAvailableForTooltip = (id) => {
|
|
36
|
+
setTimeout(() => {
|
|
37
|
+
var _a;
|
|
38
|
+
const tooltips = document.querySelectorAll(".react-tooltip");
|
|
39
|
+
let currentTooltip = [];
|
|
40
|
+
tooltips.forEach((value) => {
|
|
41
|
+
if (value.id === id && Array.isArray(currentTooltip)) {
|
|
42
|
+
currentTooltip.push(value);
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
currentTooltip = currentTooltip[0];
|
|
46
|
+
if (currentTooltip) {
|
|
47
|
+
const gridContent = document.querySelector("#grid-content");
|
|
48
|
+
const { height } = (_a = gridContent === null || gridContent === void 0 ? void 0 : gridContent.getBoundingClientRect()) !== null && _a !== void 0 ? _a : {};
|
|
49
|
+
if (height) {
|
|
50
|
+
const availableHeight = height - 50;
|
|
51
|
+
const styles = currentTooltip.getAttribute("style");
|
|
52
|
+
currentTooltip.setAttribute("style", `${styles} height: max-content; max-height: ${availableHeight}px; overflow: hidden auto;`);
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}, 50);
|
|
56
|
+
};
|
|
35
57
|
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
|
|
36
58
|
? "var(--row-bg)"
|
|
37
59
|
: "var(--row-bg-even)" }), children: [groupByKeys.map((_groupBy) => {
|
|
@@ -55,13 +77,35 @@ const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode,
|
|
|
55
77
|
}), columns
|
|
56
78
|
.filter((column) => !groupByKeys.includes(column.key))
|
|
57
79
|
.map((column, colIndex) => {
|
|
58
|
-
var _a, _b, _c, _d;
|
|
80
|
+
var _a, _b, _c, _d, _e;
|
|
59
81
|
const cellData = item[column.key];
|
|
60
|
-
const cellValue = cellData && cellData.isArrayString ? (_jsx("div", {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
82
|
+
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
|
|
83
|
+
.toString()
|
|
84
|
+
.split(">>")
|
|
85
|
+
.slice(0, 3)
|
|
86
|
+
.map((item) => (_jsx("div", { className: "flex-grow-0 flex-shrink-0 rounded-full", style: {
|
|
87
|
+
background: "var(--standard)",
|
|
88
|
+
color: "var(--foreground)",
|
|
89
|
+
border: "1px solid var(--standard)",
|
|
90
|
+
padding: "0.25rem 0.5rem",
|
|
91
|
+
}, children: item }))), cellData.value.toString().split(">>").slice(3).length >
|
|
92
|
+
0 && (_jsxs("div", { className: "flex-grow-0 flex-shrink-0", "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
|
|
93
|
+
.toString()
|
|
94
|
+
.split(">>")
|
|
95
|
+
.slice(3)
|
|
96
|
+
.map((item) => `<div>${item}</div>`)
|
|
97
|
+
.join("")}</div>`, onMouseEnter: () => {
|
|
98
|
+
var _a;
|
|
99
|
+
return checkAvailableForTooltip((_a = item.id.value.toString()) !== null && _a !== void 0 ? _a : colIndex.toString());
|
|
100
|
+
}, children: ["+", " ", cellData.value.toString().split(">>").slice(3)
|
|
101
|
+
.length, " ", "more", _jsx(Tooltip, { className: "custom-tooltip", clickable: true, id: (_b = item.id.value.toString()) !== null && _b !== void 0 ? _b : colIndex.toString(), place: "top" })] }))] })) : (_jsx("span", { children: `${cellData.value.toString().split(">>").join(", ")}` })) })) : (_jsx("span", { children: cellData.value })) })) : column.isArrayString ? (_jsx("span", { className: "flex-grow-0 flex-shrink-0 rounded-full", style: (cellData === null || cellData === void 0 ? void 0 : cellData.value)
|
|
102
|
+
? {
|
|
103
|
+
background: "var(--standard)",
|
|
104
|
+
color: "var(--foreground)",
|
|
105
|
+
border: "1px solid var(--standard)",
|
|
106
|
+
padding: "0.25rem 0.5rem",
|
|
107
|
+
}
|
|
108
|
+
: {}, children: (_c = cellData === null || cellData === void 0 ? void 0 : cellData.value) !== null && _c !== void 0 ? _c : "" })) : cellData && Object.keys(cellData).includes("html") ? (cellData === null || cellData === void 0 ? void 0 : cellData.html) : cellData && Object.keys(cellData).includes("value") ? (cellData === null || cellData === void 0 ? void 0 : cellData.value) : cellData ? (cellData) : ("");
|
|
65
109
|
const cellUrl = cellData === null || cellData === void 0 ? void 0 : cellData.url;
|
|
66
110
|
const isHidden = column.overflowHidden;
|
|
67
111
|
if (!column.hidden) {
|
|
@@ -88,7 +132,7 @@ const GroupedRow = ({ item, rowStyle, cellStyle, rowHeight, columns, widthMode,
|
|
|
88
132
|
column.dataType === "currency"
|
|
89
133
|
? "end"
|
|
90
134
|
: "start",
|
|
91
|
-
}, children: isUrl(cellUrl) ? (_jsx("a", { href: cellUrl, target: "_blank", rel: "noopener noreferrer", children: cellValue })) : column.render ? (column.render(cellValue)) : (cellValue) })) }, `${column.key}-${(
|
|
135
|
+
}, children: isUrl(cellUrl) ? (_jsx("a", { href: cellUrl, target: "_blank", rel: "noopener noreferrer", children: cellValue })) : column.render ? (column.render(cellValue)) : (cellValue) })) }, `${column.key}-${(_e = (_d = item.id) === null || _d === void 0 ? void 0 : _d.value) !== null && _e !== void 0 ? _e : index}`));
|
|
92
136
|
}
|
|
93
137
|
return null;
|
|
94
138
|
})] }));
|
package/package.json
CHANGED