@axiom-lattice/react-sdk 2.1.124 → 2.1.125

package/dist/index.js

@@ -6521,6 +6521,24 @@ var Menu = ({
   const handleCloseDrawer = (0, import_react28.useCallback)((itemId) => {
     setDrawerStates((prev) => ({ ...prev, [itemId]: false }));
   }, []);
+  const openDrawerIds = (0, import_react28.useMemo)(
+    () => items.filter((item) => item.type === "drawer" && drawerStates[item.id]).map((item) => item.id),
+    [items, drawerStates]
+  );
+  (0, import_react28.useEffect)(() => {
+    if (openDrawerIds.length === 0) return;
+    const handlePointerDown = (e) => {
+      const target = e.target;
+      if (!target || typeof target.closest !== "function") return;
+      openDrawerIds.forEach((id) => {
+        if (!target.closest(`.menu-drawer-${id}`)) {
+          handleCloseDrawer(id);
+        }
+      });
+    };
+    document.addEventListener("mousedown", handlePointerDown);
+    return () => document.removeEventListener("mousedown", handlePointerDown);
+  }, [openDrawerIds, handleCloseDrawer]);
   const handleToggleExpand = (0, import_react28.useCallback)(() => {
     if (!forceIconMode) {
       const newValue = !isIconView;
@@ -6665,6 +6683,7 @@ var Menu = ({
     items.filter((item) => item.type === "drawer").map((item) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       import_antd9.Drawer,
       {
+        rootClassName: `menu-drawer-${item.id}`,
         title: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
           "div",
           {