Megamenu: not hiding properly

[peconomou929]

Describe the bug

Imagine somebody would like to have two megamenu components (say A and B) on the same webpage. Each megamenu has its own submenus (say A1, A2, etc. and B1, B2, etc.).

If the user clicks on A1, a panel will open up. If the user then clicks on B1, the expected behavior is not only that B1 opens, but also that A1 closes. This does not happen.

Reproducer

No response

PrimeReact version

10.5.3

React version

17.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

1. Go to the documentation page for the megamenu.
2. Make sure you can see the first two examples ('Basic' and 'Vertical') simultaneously in the browser.
3. Click on one submenu from the first example (e.g. 'Furniture') and one submenu from the second example.
4. Observe as the first submenu panel does not close as the second opens.

Expected behavior

A submenu panel should close when the user clicks anywhere outside of the panel or its header action.