nuvox 0.1.3 → 0.1.4

package/dist/react/index.js

@@ -80,6 +80,12 @@ function withAccentOverride(color, children) {
 import { useLayoutEffect, useRef } from "react";
 import { createPortal } from "react-dom";
 var TRACKED_ATTRIBUTES = ["data-theme", "data-accent"];
+var portalAnchors = /* @__PURE__ */ new WeakMap();
+function getPortalAnchor(portalNode) {
+  return portalAnchors.get(portalNode) ?? null;
+}
+var nextNestedStackOffset = 0;
+var NESTED_OVERRIDE_BASE_Z_INDEX = 1150;
 function ThemedPortal({ anchorRef, children, container }) {
   const portalElRef = useRef(null);
   if (!portalElRef.current && typeof document !== "undefined") {
@@ -91,6 +97,14 @@ function ThemedPortal({ anchorRef, children, container }) {
     const portalEl = portalElRef.current;
     if (!portalEl) return;
     target.appendChild(portalEl);
+    if (anchorRef.current) {
+      portalAnchors.set(portalEl, anchorRef.current);
+      const enclosingPortal = anchorRef.current.closest("[data-nuvox-portal]");
+      if (enclosingPortal) {
+        portalEl.style.position = "relative";
+        portalEl.style.zIndex = String(NESTED_OVERRIDE_BASE_Z_INDEX + nextNestedStackOffset++);
+      }
+    }
     function syncAttribute(attr) {
       const anchor2 = anchorRef.current;
       if (!anchor2 || !portalEl) return;
@@ -15173,6 +15187,19 @@ function getOpenIntent(key) {
 
 // src/theme-engine/useClickOutside.ts
 import { useEffect as useEffect5 } from "react";
+function isNestedWithinRefs(target, refs) {
+  if (!(target instanceof Element)) return false;
+  let current = target;
+  for (let depth = 0; depth < 20; depth++) {
+    const portalNode = current.closest("[data-nuvox-portal]");
+    if (!portalNode) return false;
+    const anchor = getPortalAnchor(portalNode);
+    if (!anchor) return false;
+    if (refs.some((ref) => ref.current?.contains(anchor))) return true;
+    current = anchor;
+  }
+  return false;
+}
 function useClickOutside(isOpen, refs, onOutsideClick) {
   useEffect5(() => {
     if (!isOpen) return;
@@ -15180,7 +15207,7 @@ function useClickOutside(isOpen, refs, onOutsideClick) {
       const target = e.target;
       const isInside = refs.some((ref) => ref.current?.contains(target));
       if (isInside) return;
-      if (target instanceof Element && target.closest("[data-nuvox-portal]")) return;
+      if (isNestedWithinRefs(target, refs)) return;
       onOutsideClick();
     }
     document.addEventListener("pointerdown", onPointerDown, true);