@mirror-physics/fractal-ui 0.2.0-next.85 → 0.2.0-next.86

package/dist/index.cjs

@@ -1684,6 +1684,9 @@ var React12 = __toESM(require("react"), 1);
 var import_fractal_icons10 = require("@mirror-physics/fractal-icons");
 
 // src/components/Dropdown/position.ts
+function isDropdownTriggerVisible(trigger, bounds) {
+  return trigger.right > bounds.left && trigger.left < bounds.right && trigger.bottom > bounds.top && trigger.top < bounds.bottom;
+}
 function positionDropdown(trigger, panel, bounds, direction, align) {
   const gap = 4;
   const width = Math.min(panel.width, Math.max(0, bounds.right - bounds.left));
@@ -1824,12 +1827,17 @@ function Dropdown({
           bounds.bottom = Math.min(bounds.bottom, rect.top + ancestor.clientTop + ancestor.clientHeight);
         }
       }
+      const triggerRect = trigger.getBoundingClientRect();
+      if (!isDropdownTriggerVisible(triggerRect, bounds)) {
+        focusOnOpen.current = false;
+        setOpen(false);
+        return false;
+      }
       const padding = Math.max(0, collisionPadding);
       bounds.left += padding;
       bounds.right = Math.max(bounds.left, bounds.right - padding);
       bounds.top += padding;
       bounds.bottom = Math.max(bounds.top, bounds.bottom - padding);
-      const triggerRect = trigger.getBoundingClientRect();
       const rootRect = root.getBoundingClientRect();
       const availableWidth = bounds.right - bounds.left;
       const heightLimit = Math.max(0, maxHeight);
@@ -1849,8 +1857,9 @@ function Dropdown({
         panel.style[key] = `${nextStyle[key]}px`;
       }
       setPanelStyle((previous) => Object.entries(nextStyle).every(([key, value]) => previous[key] === value) ? previous : nextStyle);
+      return true;
     };
-    updatePosition();
+    if (!updatePosition()) return;
     if (searchable && !panel.contains(document.activeElement)) searchRef.current?.focus({ preventScroll: true });
     if (focusOnOpen.current) {
       focusOnOpen.current = false;