From 166c36d39e975368d3ae1491f12042a5b2546b47 Mon Sep 17 00:00:00 2001
From: Dobrovolsky Ivan <dobrovolsky1993@gmail.com>
Date: Tue, 4 Aug 2026 10:48:07 +0300
Subject: [PATCH] fix(INTERNAL-2620): close drawer on outside click

---
 src/harmony/Drawer/Drawer.tsx | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/harmony/Drawer/Drawer.tsx b/src/harmony/Drawer/Drawer.tsx
index 55265688..422d85d4 100644
--- a/src/harmony/Drawer/Drawer.tsx
+++ b/src/harmony/Drawer/Drawer.tsx
@@ -14,6 +14,7 @@ interface DrawerProps {
     className?: string;
     animated?: boolean;
     onClose?: () => void;
+    closeOnClickOutside?: boolean;
 }
 
 const DrawerContext = React.createContext<Partial<{ onClose(): void }>>({
@@ -36,6 +37,7 @@ export const Drawer: React.FC<React.PropsWithChildren<DrawerProps>> = ({
     children,
     onClose,
     className,
+    closeOnClickOutside = false,
 }) => {
     const drawerRef = useRef<HTMLDivElement>(null);
     const [opened, setOpened] = useState(false);
@@ -43,6 +45,23 @@ export const Drawer: React.FC<React.PropsWithChildren<DrawerProps>> = ({
         disableGlobalEvent: false,
     });
 
+    useEffect(() => {
+        if (!onClose || !visible || !closeOnClickOutside) return;
+
+        const handleClickOutside = (event: MouseEvent) => {
+            const target = event.target as Node;
+            if (drawerRef.current && !drawerRef.current.contains(target)) {
+                onClose();
+            }
+        };
+
+        document.addEventListener('mousedown', handleClickOutside);
+
+        return () => {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [onClose, visible, closeOnClickOutside]);
+
     const performState = useCallback((condition: boolean, classes: [string, string]) => {
         if (drawerRef.current == null) {
             return;