fix Primefaces primefaces#4961 SlideMenu: SlideMenu with popup prop p…

…assed doesnot close on Escape keypress.
qburst · Sep 25, 2023 · a9187e8 · a9187e8
1 parent 7e2f278
commit a9187e8
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 1 deletion.
diff --git a/components/doc/common/apidoc/index.json b/components/doc/common/apidoc/index.json
@@ -42300,6 +42300,14 @@
                             "default": "false",
                             "description": "Defines if menu would displayed as a popup."
                         },
+                        {
+                            "name": "closeOnEscape",
+                            "optional": true,
+                            "readonly": false,
+                            "type": "boolean",
+                            "default": "true",
+                            "description": "Specifies if pressing escape key should hide the SlideMenu Popup."
+                        },
                         {
                             "name": "pt",
                             "optional": true,

diff --git a/components/lib/slidemenu/SlideMenu.js b/components/lib/slidemenu/SlideMenu.js
@@ -9,6 +9,7 @@ import { Portal } from '../portal/Portal';
 import { DomHandler, IconUtils, UniqueComponentId, ZIndexUtils, mergeProps } from '../utils/Utils';
 import { SlideMenuBase } from './SlideMenuBase';
 import { SlideMenuSub } from './SlideMenuSub';
+import { useOnEscapeKey } from '../../lib/hooks/Hooks';
 
 export const SlideMenu = React.memo(
     React.forwardRef((inProps, ref) => {
@@ -34,6 +35,10 @@ export const SlideMenu = React.memo(
         const backward = React.useRef(null);
         const slideMenuContent = React.useRef(null);
 
+        useOnEscapeKey(targetRef, props.popup && props.closeOnEscape, (event) => {
+            hide(event);
+        });
+
         const [bindOverlayListener, unbindOverlayListener] = useOverlayListener({
             target: targetRef,
             overlay: menuRef,

diff --git a/components/lib/slidemenu/SlideMenuBase.js b/components/lib/slidemenu/SlideMenuBase.js
@@ -155,7 +155,8 @@ export const SlideMenuBase = ComponentBase.extend({
         submenuIcon: null,
         transitionOptions: null,
         viewportHeight: 175,
-        children: undefined
+        children: undefined,
+        closeOnEscape: true
     },
     css: {
         classes,

diff --git a/components/lib/slidemenu/slidemenu.d.ts b/components/lib/slidemenu/slidemenu.d.ts
@@ -220,6 +220,11 @@ export interface SlideMenuProps extends Omit<React.DetailedHTMLProps<React.HTMLA
      * @defaultValue 175
      */
     viewportHeight?: number | undefined;
+    /**
+     * Specifies if pressing escape key should hide the SlideMenu Popup.
+     * @defaultValue true
+     */
+    closeOnEscape?: boolean | undefined;
     /**
      * Callback to invoke when a popup menu is shown.
      * @param {React.SyntheticEvent} event - Browser event.