fix #1023 MultiSelect DropDown appears in center and therefore detached from its inputfield if too little space available

vegegoku · vegegoku · commit 39a31ed9e240 · 2025-04-13T14:16:48.000+03:00
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/Menu.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/Menu.java
@@ -1719,6 +1719,8 @@ public Menu<V> close() {
           parent.expand();
         }
       }
+      removeCssProperty(SpaceChecker.MAX_HEIGHT);
+      removeCssProperty(SpaceChecker.MAX_WIDTH);
     }
     return this;
   }
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestFitSideDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestFitSideDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 
 import elemental2.dom.Element;
 
@@ -45,7 +46,12 @@ public DropDirection position(DropDirectionContext context) {
       }
     }
 
-    return MIDDLE_SCREEN.position(context);
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+
+    context.newSpaceChecker();
+
+    return position(context);
   }
 
   /** {@inheritDoc} */
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleDownUpDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleDownUpDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 
 import elemental2.dom.Element;
 
@@ -37,7 +38,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceAbove()) {
       return TOP_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleSideDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleSideDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 
 import elemental2.dom.Element;
 
@@ -35,7 +36,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceOnLeft()) {
       return LEFT_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleUpDownDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestMiddleUpDownDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 
 import elemental2.dom.Element;
 
@@ -36,7 +37,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceBelow()) {
       return BOTTOM_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestSideUpDownDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BestSideUpDownDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 
 import elemental2.dom.Element;
 
@@ -44,7 +45,11 @@ public DropDirection position(DropDirectionContext context) {
       }
     }
 
-    return MIDDLE_SCREEN.position(context);
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+    context.newSpaceChecker();
+
+    return position(context);
   }
 
   /** {@inheritDoc} */
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomLeftDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomLeftDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -76,7 +77,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceAbove()) {
       return TOP_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomMiddleDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomMiddleDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -51,7 +52,11 @@ public DropDirection position(DropDirectionContext context) {
         return TOP_MIDDLE.position(context);
       }
     }
-    return MIDDLE_SCREEN.position(context);
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+    context.newSpaceChecker();
+
+    return position(context);
   }
 
   private DropDirection showBelowMiddle(Element source, SpaceChecker spaceChecker) {
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomRightDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/BottomRightDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -75,7 +76,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceAbove()) {
       return TOP_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftDownDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftDownDropDirection.java
@@ -16,6 +16,7 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static elemental2.dom.DomGlobal.window;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -65,7 +66,12 @@ public DropDirection position(DropDirectionContext context) {
       } else if (spaceChecker.hasSpaceAbove()) {
         return LEFT_UP.position(context);
       } else {
-        return MIDDLE_SCREEN.position(context);
+        elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+        elementOf(context.getSource())
+            .setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+        context.newSpaceChecker();
+
+        return position(context);
       }
     } else if (spaceChecker.hasSpaceOnRight()) {
       return RIGHT_DOWN.position(context);
@@ -75,7 +81,11 @@ public DropDirection position(DropDirectionContext context) {
       return TOP_MIDDLE.position(context);
     }
 
-    return MIDDLE_SCREEN.position(context);
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+    context.newSpaceChecker();
+
+    return position(context);
   }
 
   /** {@inheritDoc} */
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftMiddleDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftMiddleDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -33,7 +34,7 @@ public DropDirection position(DropDirectionContext context) {
     dui_flex_col_reverse.remove(source);
 
     SpaceChecker spaceChecker = context.getSpaceChecker();
-    ;
+
     Style.of(source).style.setProperty("top", px.of(0));
     Style.of(source).style.setProperty("left", px.of(0));
 
@@ -44,7 +45,12 @@ public DropDirection position(DropDirectionContext context) {
       double spaceUp = spaceChecker.getAvailableSpaceOnTop();
       double delta = 0;
       if (spaceNeeded > spaceDown && spaceNeeded > spaceUp) {
-        return MIDDLE_SCREEN.position(context);
+        elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+        elementOf(context.getSource())
+            .setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+        context.newSpaceChecker();
+
+        return position(context);
       } else if (spaceNeeded > spaceUp) {
         delta = spaceNeeded - spaceUp;
       } else if (spaceNeeded > spaceDown) {
@@ -76,7 +82,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceBelow()) {
       return BOTTOM_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftUpDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/LeftUpDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -52,7 +53,11 @@ public DropDirection position(DropDirectionContext context) {
         return BOTTOM_MIDDLE.position(context);
       }
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightDownDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightDownDropDirection.java
@@ -16,10 +16,10 @@
 package org.dominokit.domino.ui.menu.direction;
 
 import static elemental2.dom.DomGlobal.window;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
-import elemental2.dom.DomGlobal;
 import elemental2.dom.Element;
 import org.dominokit.domino.ui.style.Style;
 
@@ -32,17 +32,14 @@ public DropDirection position(DropDirectionContext context) {
     Element target = context.getTarget();
     cleanup(source);
     SpaceChecker spaceChecker = context.getSpaceChecker();
-    ;
 
     if (spaceChecker.hasSpaceOnRight()) {
       if (spaceChecker.hasSpaceBelow()) {
         double delta = 0;
         double availableSpace = spaceChecker.getAvailableSpaceOnTop();
-        DomGlobal.console.info("availableSpace : " + availableSpace);
         if (availableSpace < spaceChecker.getSourceHeight()) {
           delta = spaceChecker.getSourceHeight() - availableSpace;
         }
-        DomGlobal.console.info("delta : " + delta);
 
         double top = spaceChecker.getTargetTop() + window.pageYOffset - delta;
         double thresholdTopSpace = spaceChecker.getThresholdTopSpace();
@@ -74,7 +71,12 @@ public DropDirection position(DropDirectionContext context) {
       } else if (spaceChecker.hasSpaceAbove()) {
         return RIGHT_UP.position(context);
       } else {
-        return MIDDLE_SCREEN.position(context);
+        elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+        elementOf(context.getSource())
+            .setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+        context.newSpaceChecker();
+
+        return position(context);
       }
     } else if (spaceChecker.hasSpaceOnLeft()) {
       return LEFT_DOWN.position(context);
@@ -84,7 +86,11 @@ public DropDirection position(DropDirectionContext context) {
       return TOP_MIDDLE.position(context);
     }
 
-    return MIDDLE_SCREEN.position(context);
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+    elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+    context.newSpaceChecker();
+
+    return position(context);
   }
 
   /** {@inheritDoc} */
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightMiddleDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightMiddleDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -33,7 +34,7 @@ public DropDirection position(DropDirectionContext context) {
     dui_flex_col_reverse.remove(source);
 
     SpaceChecker spaceChecker = context.getSpaceChecker();
-    ;
+
     Style.of(source).style.setProperty("top", px.of(0));
     Style.of(source).style.setProperty("left", px.of(0));
 
@@ -76,7 +77,11 @@ public DropDirection position(DropDirectionContext context) {
     } else if (spaceChecker.hasSpaceBelow()) {
       return BOTTOM_MIDDLE.position(context);
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightUpDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/RightUpDropDirection.java
@@ -17,6 +17,7 @@
 
 import static elemental2.dom.DomGlobal.window;
 import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;
+import static org.dominokit.domino.ui.utils.Domino.elementOf;
 import static org.dominokit.domino.ui.utils.ElementsFactory.elements;
 import static org.dominokit.domino.ui.utils.Unit.px;
 
@@ -51,7 +52,11 @@ public DropDirection position(DropDirectionContext context) {
         return BOTTOM_MIDDLE.position(context);
       }
     } else {
-      return MIDDLE_SCREEN.position(context);
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());
+      elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());
+      context.newSpaceChecker();
+
+      return position(context);
     }
   }
 
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/SpaceChecker.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/SpaceChecker.java
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopLeftDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopLeftDropDirection.java
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopMiddleDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopMiddleDropDirection.java
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopRightDropDirection.java b/domino-ui/src/main/java/org/dominokit/domino/ui/menu/direction/TopRightDropDirection.java
diff --git a/domino-ui/src/main/resources/org/dominokit/domino/ui/public/css/domino-ui/dui-components/domino-ui-menu.css b/domino-ui/src/main/resources/org/dominokit/domino/ui/public/css/domino-ui/dui-components/domino-ui-menu.css

Original file line number	Diff line number	Diff line change
`@@ -1719,6 +1719,8 @@ public Menu<V> close() {`
`1719`	`1719`	`parent.expand();`
`1720`	`1720`	`}`
`1721`	`1721`	`}`
	`1722`	`+ removeCssProperty(SpaceChecker.MAX_HEIGHT);`
	`1723`	`+ removeCssProperty(SpaceChecker.MAX_WIDTH);`
`1722`	`1724`	`}`
`1723`	`1725`	`return this;`
`1724`	`1726`	`}`
Original file line number	Diff line number	Diff line change
`@@ -16,6 +16,7 @@`
`16`	`16`	`package org.dominokit.domino.ui.menu.direction;`
`17`	`17`
`18`	`18`	`import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;`
	`19`	`+import static org.dominokit.domino.ui.utils.Domino.elementOf;`
`19`	`20`
`20`	`21`	`import elemental2.dom.Element;`
`21`	`22`
`@@ -45,7 +46,12 @@ public DropDirection position(DropDirectionContext context) {`
`45`	`46`	`}`
`46`	`47`	`}`
`47`	`48`
`48`		`- return MIDDLE_SCREEN.position(context);`
	`49`	`+ elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());`
	`50`	`+ elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());`
	`51`	`+`
	`52`	`+ context.newSpaceChecker();`
	`53`	`+`
	`54`	`+ return position(context);`
`49`	`55`	`}`
`50`	`56`
`51`	`57`	`/** {@inheritDoc} */`
Original file line number	Diff line number	Diff line change
`@@ -17,6 +17,7 @@`
`17`	`17`
`18`	`18`	`import static elemental2.dom.DomGlobal.window;`
`19`	`19`	`import static org.dominokit.domino.ui.style.SpacingCss.dui_flex_col_reverse;`
	`20`	`+import static org.dominokit.domino.ui.utils.Domino.elementOf;`
`20`	`21`	`import static org.dominokit.domino.ui.utils.ElementsFactory.elements;`
`21`	`22`	`import static org.dominokit.domino.ui.utils.Unit.px;`
`22`	`23`
`@@ -51,7 +52,11 @@ public DropDirection position(DropDirectionContext context) {`
`51`	`52`	`return TOP_MIDDLE.position(context);`
`52`	`53`	`}`
`53`	`54`	`}`
`54`		`- return MIDDLE_SCREEN.position(context);`
	`55`	`+ elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumSideSpaceProperty());`
	`56`	`+ elementOf(context.getSource()).setCssProperty(spaceChecker.getMaximumVerticalSpaceProperty());`
	`57`	`+ context.newSpaceChecker();`
	`58`	`+`
	`59`	`+ return position(context);`
`55`	`60`	`}`
`56`	`61`
`57`	`62`	`private DropDirection showBelowMiddle(Element source, SpaceChecker spaceChecker) {`