Extract from 344e288c8c084756f11a0a903f2b9b970119ab71

akeneo · May 27, 2024 · 8a0eb6e · 8a0eb6e
1 parent 34b2a78
commit 8a0eb6e
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 7 deletions.
diff --git a/lib/components/Dropdown/Overlay/Overlay.js b/lib/components/Dropdown/Overlay/Overlay.js
diff --git a/lib/components/Dropdown/Overlay/Overlay.js.map b/lib/components/Dropdown/Overlay/Overlay.js.map
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "akeneo-design-system",
-  "version": "0.1.241",
+  "version": "0.1.242",
   "description": "Akeneo design system",
   "main": "lib/index.js",
   "scripts": {

diff --git a/src/components/Dropdown/Overlay/Overlay.tsx b/src/components/Dropdown/Overlay/Overlay.tsx
@@ -35,7 +35,7 @@ const Container = styled.div<
     fixedWidth: number | null;
   } & AkeneoThemedProps
 >`
-  ${CommonStyle}
+  ${CommonStyle};
   background: ${getColor('white')};
   box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.3);
   padding: 10px 0;
@@ -45,8 +45,7 @@ const Container = styled.div<
   z-index: 1901;
   top: ${({top}) => top}px;
   left: ${({left}) => left}px;
-
-  ${getWidthProperties}
+  ${getWidthProperties};
 `;
 
 type OverlayProps = Override<
@@ -84,7 +83,7 @@ type OverlayProps = Override<
   }
 >;
 
-const Backdrop = styled.div<{isOpen: boolean} & AkeneoThemedProps>`
+const Backdrop = styled.div`
   position: fixed;
   top: 0;
   left: 0;
@@ -121,6 +120,12 @@ const getOverlayPosition = (
     top = 'up' === verticalPosition ? parentRect.top - elementRect.height : parentRect.bottom + 1;
   }
 
+  // Adjust the vertical position to top if the dropdown list height exceeds the screen
+  const spaceBelow = window.innerHeight - parentRect.bottom;
+  const exceedsScreen = spaceBelow < elementRect.height && parentRect.top > elementRect.height;
+  top = exceedsScreen ? parentRect.bottom - elementRect.height + BORDER_SHADOW_OFFSET : top;
+  top = exceedsScreen && dropdownOpenerVisible ? parentRect.top - elementRect.height : top;
+
   const left = 'left' === horizontalPosition ? parentRect.right - elementRect.width : parentRect.left;
 
   return [top, left];