Close only 1 menu at a time without closing parent menu, react burger menu

[vbit32]

I'm trying to set up a shop mobile navigation, where on click of a parent category, a new Menu is returned on top of the old one, displaying the subcategories of that parent. There will ever be only 1 level depth of subcategories, no more. Just parents categories, and its 1 level subcategories.

I custom handle the onClose event for each Menu that's generated, only problem is, when I close any subcategories menu, it also sets the parent category menu underneath to be hidden. I believe this is because every Menu has 'bm-menu-wrapper' and thus, all elements with that class get hidden. Is there a way around this? Thank you!

[vbit32]

Additionally: I found a temporary work around but would still prefer a better, built-in solution:

For now, I am simply remove the class 'bm-menu-wrapper' on initial state change for that component, and using a custom class:

      const handleStateChange = (state) => {
        document.getElementById('main-menu').classList.remove('bm-menu-wrap');
        setIsMenuOpen(state.isOpen);
      };

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.