Possible to keep menu open when clicking outside?

[tdsoundation]

React/React-dom version: 18
React-Menu version: 4.2.2

Hi, is it possible to keep the menu open when clicking outside of the menu? I'm using a ControlledMenu btw, but I'm not sure how to stop onClose from being called.

Thanks

[szhsin]

The onClose event cannot be prevented from being called, but you can decide whether to close the menu.

For example, when clicking outside the menu, the reason in the event will be 'blur'. You can keep the menu open by not calling the state setter. https://codesandbox.io/p/sandbox/react-menu-1422-nml5q8

[tdsoundation]

Yup, that gets the job done :) thank you

[tdsoundation]

ok, one issue though, the toggle doesn't close the dropdown when clicked even though it's being passed the handlers from useClick:

const [open, setOpen] = useState(false)
const anchorProps = useClick(open, () => setOpen(true))

return (
  <>
       <button {...anchorProps}>Toggle</button>

       <ControlledMenu...
  </>
)

is there a way to make it close the menu when clicked?

[szhsin]

The useClick hook was designed to always close the menu during the onClose event. In this case, it's perfectly acceptable to toggle the isOpen state when the toggle button is clicked: setOpen((o) => !o)
Have updated the example as well.