From 937c588713a053525f1e2288584fdc8e9b09496c Mon Sep 17 00:00:00 2001
From: AkinAguda <lordtitan7@gmail.com>
Date: Fri, 18 Jun 2021 13:17:37 +0100
Subject: [PATCH] added bug fix for unregistered event listener

---
 package-lock.json |  2 +-
 package.json      |  2 +-
 src/index.tsx     | 37 +++++++++++++++++++------------------
 3 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 1e4b839..55d89ac 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "unop-react-dropdown",
-  "version": "0.1.7",
+  "version": "0.2.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index c0c6f44..5e6ac37 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.2.0",
+  "version": "0.2.1",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
diff --git a/src/index.tsx b/src/index.tsx
index cb13e20..185f17c 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -38,27 +38,28 @@ const UnopDropdown: React.FC<UnopDropdownProps> = ({
     element.style.visibility = 'visible';
   }, []);
 
+  const handler = (e: MouseEvent) => {
+    const path = e.composedPath();
+    if (show && closeOnClickOut && !path.includes(dropdownMenuRef.current!)) {
+      handleAction(e);
+    } else {
+      if (
+        show &&
+        closeOnDropdownClicked &&
+        path.includes(dropdownMenuRef.current!)
+      ) {
+        handleAction(e);
+      }
+    }
+  };
+
   useEffect(() => {
     if (closeOnClickOut || closeOnDropdownClicked) {
-      window.addEventListener('click', (e) => {
-        const path = e.composedPath();
-        if (
-          show &&
-          closeOnClickOut &&
-          !path.includes(dropdownMenuRef.current!)
-        ) {
-          handleAction(e);
-        } else {
-          if (
-            show &&
-            closeOnDropdownClicked &&
-            path.includes(dropdownMenuRef.current!)
-          ) {
-            handleAction(e);
-          }
-        }
-      });
+      window.addEventListener('click', handler);
     }
+    return () => {
+      window.removeEventListener('click', handler);
+    };
   }, [show]);
 
   const displayMenuItem = (e: CustomMouseEvent) => {