labsense-ui-kit 1.2.67 → 1.2.68

package/dist/index.modern.js

@@ -7482,11 +7482,28 @@ var MultiSelectDropdown = function MultiSelectDropdown(_ref31) {
     NoOptionsText = _ref31$NoOptionsText === void 0 ? 'No Options Available' : _ref31$NoOptionsText;
   var themeColors = useTheme();
   var _useState = useState(false),
-    isOpen = _useState[0],
-    setIsOpen = _useState[1];
+    dropUp = _useState[0],
+    setDropUp = _useState[1];
+  var _useState2 = useState(false),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
   var dropdownRef = useRef(null);
   var toggleDropdown = function toggleDropdown() {
-    if (!disabled) setIsOpen(function (prev) {
+    if (disabled) return;
+    var refToUse = dropdownRef.current;
+    if (refToUse) {
+      var rect = refToUse.getBoundingClientRect();
+      var windowHeight = window.innerHeight;
+      var spaceBelow = windowHeight - rect.bottom;
+      var spaceAbove = rect.top;
+      var dropdownHeight = 156;
+      if (spaceBelow < dropdownHeight && spaceAbove > dropdownHeight) {
+        setDropUp(true);
+      } else {
+        setDropUp(false);
+      }
+    }
+    setIsOpen(function (prev) {
       return !prev;
     });
   };
@@ -7571,7 +7588,11 @@ var MultiSelectDropdown = function MultiSelectDropdown(_ref31) {
   })), isOpen && React.createElement(DropdownMenu, {
     "$width": optionWidth,
     "$menuBackground": menuBackground || themeColors.vms.text.white,
-    "$optionsBorderRadius": optionsBorderRadius
+    "$optionsBorderRadius": optionsBorderRadius,
+    style: {
+      top: dropUp ? 'auto' : 'calc(100% + 8px)',
+      bottom: dropUp ? 'calc(100% + 8px)' : 'auto'
+    }
   }, React.createElement(OptionComponent, {
     options: options,
     selectedOptions: selectedOptions,