@megha-ui/react 1.3.2 → 1.3.5
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.
|
@@ -44,7 +44,10 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
|
|
|
44
44
|
const parentRect = parent.getBoundingClientRect();
|
|
45
45
|
const elementRect = element.getBoundingClientRect();
|
|
46
46
|
const searchOptionRect = (_a = searchOptionRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
|
|
47
|
-
return parentRect.height -
|
|
47
|
+
return (parentRect.height -
|
|
48
|
+
elementRect.height -
|
|
49
|
+
8 -
|
|
50
|
+
((_b = searchOptionRect === null || searchOptionRect === void 0 ? void 0 : searchOptionRect.height) !== null && _b !== void 0 ? _b : 0));
|
|
48
51
|
}
|
|
49
52
|
parent = parent.parentElement;
|
|
50
53
|
console.log({ parent });
|
|
@@ -71,13 +74,19 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
|
|
|
71
74
|
setIntermediateValues(selectedValues);
|
|
72
75
|
}, [selectedValues]);
|
|
73
76
|
useEffect(() => {
|
|
74
|
-
var _a, _b, _c;
|
|
77
|
+
var _a, _b, _c, _d, _e;
|
|
75
78
|
if (isOpen && searchEnabled) {
|
|
76
79
|
(_a = searchInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
80
|
+
if (typeof maxDropdownHeight === "undefined") {
|
|
81
|
+
const rect = (_b = wrapperRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect();
|
|
82
|
+
const searchOptionRect = (_c = searchOptionRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect();
|
|
83
|
+
const viewportSpace = document.body.clientHeight -
|
|
84
|
+
((_d = rect === null || rect === void 0 ? void 0 : rect.bottom) !== null && _d !== void 0 ? _d : 0) -
|
|
85
|
+
8 -
|
|
86
|
+
((_e = searchOptionRect === null || searchOptionRect === void 0 ? void 0 : searchOptionRect.height) !== null && _e !== void 0 ? _e : 0);
|
|
87
|
+
const overflowSpace = getOverflowParentHeight(wrapperRef.current, viewportSpace);
|
|
88
|
+
setHeight(overflowSpace);
|
|
89
|
+
}
|
|
81
90
|
}
|
|
82
91
|
if (isOpen) {
|
|
83
92
|
setHighlightIndex(0);
|
|
@@ -414,7 +423,10 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
|
|
|
414
423
|
display: "flex",
|
|
415
424
|
alignItems: "start",
|
|
416
425
|
width: "100%",
|
|
417
|
-
}, children: _jsx("span", { children: "Select All" }) })] })), _jsx("div", {
|
|
426
|
+
}, children: _jsx("span", { children: "Select All" }) })] })), _jsx("div", { style: {
|
|
427
|
+
maxHeight: (maxDropdownHeight !== null && maxDropdownHeight !== void 0 ? maxDropdownHeight : height) ? `${height}px` : "",
|
|
428
|
+
overflowY: "auto",
|
|
429
|
+
}, children: isLoading ? (_jsxs(Block, { as: "div", className: "flex items-center justify-between", children: [_jsx(Text, { as: "span", children: "Loading options" }), _jsx(Loader, { size: 12 })] })) : isCreatable && filteredOptions.length < 1 && searchTerm ? (_jsxs("li", { onClick: (e) => onCreate(searchTerm), style: Object.assign(Object.assign({}, listItemStyle), { display: "flex", alignItems: "center", wordWrap: "break-word", textWrap: "wrap", justifyContent: "space-between" }), children: [isMultiple && (_jsx(Checkbox, { selected: intermediateValues.includes(searchTerm), onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper })), _jsx("div", { style: {
|
|
418
430
|
display: "flex",
|
|
419
431
|
alignItems: "start",
|
|
420
432
|
width: "100%",
|
package/package.json
CHANGED