@xsolla/xui-context-menu 0.185.1 → 0.185.2

package/web/index.mjs

@@ -459,13 +459,16 @@ var OptionCell = ({
       const inOption = optionRef.current?.contains(target);
       const inSubmenu = submenuWrapperRef.current?.contains(target);
       if (!inOption && !inSubmenu) {
+        if (target.closest("[data-xui-context-menu-portal]")) return;
         setSubmenuOpen(false);
         return;
       }
-      if (inSubmenu && target.closest(
-        '[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]'
-      )) {
-        setSubmenuOpen(false);
+      if (inSubmenu) {
+        const activated = target.closest(
+          '[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]'
+        );
+        const isLeafAction = activated?.getAttribute("role") === "menuitem" && activated.getAttribute("aria-haspopup") !== "menu";
+        if (isLeafAction) setSubmenuOpen(false);
       }
     };
     document.addEventListener("mousedown", onMouseDown);
@@ -1359,6 +1362,7 @@ var ARROW_HALF = ARROW_SIZE / 2;
 var ARROW_EDGE_OFFSET = 12;
 var ARROW_TIP_PROTRUSION = ARROW_HALF * Math.SQRT2;
 var PANEL_SHADOW = "0 4px 12px rgba(0,0,0,0.15)";
+var PORTALED_LAYER_SELECTOR = '[data-modal-id],[role="listbox"],[data-xui-context-menu-portal]';
 var textFromNode = (node) => {
   if (node === null || node === void 0 || typeof node === "boolean")
     return "";
@@ -1545,7 +1549,13 @@ var ContextMenuRoot = forwardRef(
       if (!isOpen || !trigger) return;
       const onMouseDown = (event) => {
         const target = event.target;
-        if (!target || containerRef.current?.contains(target)) return;
+        if (!target) return;
+        if (containerRef.current?.contains(target)) return;
+        const path = typeof event.composedPath === "function" ? event.composedPath() : [];
+        const isInsidePortaledLayer = path.length ? path.some(
+          (node) => node instanceof Element && node.matches(PORTALED_LAYER_SELECTOR)
+        ) : target instanceof Element && !!target.closest(PORTALED_LAYER_SELECTOR);
+        if (isInsidePortaledLayer) return;
         closeMenu();
       };
       const onScroll = () => closeMenu();