From 415d158ed70cf8b88f173c43fb727bcc8129f943 Mon Sep 17 00:00:00 2001
From: melloware <mellowaredev@gmail.com>
Date: Fri, 23 Dec 2022 07:15:36 -0500
Subject: [PATCH] Fix #3811: Sidebar toggle dissmissable state

---
 components/lib/sidebar/Sidebar.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/components/lib/sidebar/Sidebar.js b/components/lib/sidebar/Sidebar.js
index a745e798a4..d9f7c1b396 100644
--- a/components/lib/sidebar/Sidebar.js
+++ b/components/lib/sidebar/Sidebar.js
@@ -4,7 +4,7 @@ import { CSSTransition } from '../csstransition/CSSTransition';
 import { useEventListener, useMountEffect, useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { Portal } from '../portal/Portal';
 import { Ripple } from '../ripple/Ripple';
-import { classNames, DomHandler, ObjectUtils, ZIndexUtils } from '../utils/Utils';
+import { DomHandler, ObjectUtils, ZIndexUtils, classNames } from '../utils/Utils';
 
 export const Sidebar = React.forwardRef((props, ref) => {
     const [maskVisibleState, setMaskVisibleState] = React.useState(false);
@@ -140,6 +140,17 @@ export const Sidebar = React.forwardRef((props, ref) => {
         }
     }, [maskVisibleState]);
 
+    useUpdateEffect(() => {
+        // #3811 if dismissible state is toggled while open we must unregister and re-regisetr
+        if (visibleState) {
+            unbindDocumentClickListener();
+
+            if (props.dismissable && !props.modal) {
+                bindDocumentClickListener();
+            }
+        }
+    }, [props.dismissable, props.modal, visibleState]);
+
     useUnmountEffect(() => {
         disableDocumentSettings();
         maskRef.current && ZIndexUtils.clear(maskRef.current);