fix(ui): bound dropdowns during scroll

packages/ui-core/src/floating.ts

@@ -37,8 +37,18 @@ export function computeFloatingPosition({
   viewportHeight = typeof window === "undefined" ? 1080 : window.innerHeight,
   viewportPadding = 8,
 }: FloatingPositionOptions): FloatingPosition {
-  const roomBelow = viewportHeight - anchor.bottom - offset - viewportPadding;
-  const roomAbove = anchor.top - offset - viewportPadding;
+  const viewportAvailableHeight = Math.max(
+    0,
+    viewportHeight - viewportPadding * 2,
+  );
+  const roomBelow = Math.min(
+    viewportAvailableHeight,
+    Math.max(0, viewportHeight - anchor.bottom - offset - viewportPadding),
+  );
+  const roomAbove = Math.min(
+    viewportAvailableHeight,
+    Math.max(0, anchor.top - offset - viewportPadding),
+  );
   const requestedTop = placement.startsWith("top");
   const shouldFlip = requestedTop
     ? surfaceHeight > roomAbove && roomBelow > roomAbove
@@ -56,12 +66,18 @@ export function computeFloatingPosition({
   );
 
   const availableHeight = resolvedPlacement.startsWith("top") ? roomAbove : roomBelow;
-  const maxHeight = Math.max(96, availableHeight);
+  const maxHeight = Math.min(
+    viewportAvailableHeight,
+    Math.max(Math.min(96, viewportAvailableHeight), availableHeight),
+  );
   const visibleHeight = Math.min(surfaceHeight, maxHeight);
-  const top = resolvedPlacement.startsWith("top")
-    ? Math.max(viewportPadding, anchor.top - offset - visibleHeight)
-    : Math.min(anchor.bottom + offset, viewportHeight - visibleHeight - viewportPadding);
+  const desiredTop = resolvedPlacement.startsWith("top")
+    ? anchor.top - offset - visibleHeight
+    : anchor.bottom + offset;
+  const top = Math.min(
+    Math.max(viewportPadding, desiredTop),
+    Math.max(viewportPadding, viewportHeight - visibleHeight - viewportPadding),
+  );
 
   return { top, left, maxHeight, resolvedPlacement };
 }
-