I don't believe it's currently possible, so this is a feature request, related to multi-select mode. Currently, each time a new item is selected, the list closes. The requested feature is to allow the list to stay open, allowing multiple items to be selected without closing and reopening the list each time. I could see this being a config option (with the default being the current behavior) and/or a way to specify a "key option" (i.e. selecting an item with the Ctrl/Cmd key pressed would not close the list, but clicking normally would).
@Eric24 There is already a prop which handles your use case. It is called closeMenuOnSelect and its default value is set to true, meaning the default behaviour is to close the menu when selecting an option. Setting the props value to false should allow for the behaviour you seek, keeping the menu open after selecting an option.
@Rall3n : According to the docs, the closeMenuOnSelect prop is deprecated (only available in V1 of react-select). Is that correct?
@Eric24 I couldn鈥檛 find any mention of deprecation regarding this prop.
@Rall3n : On this page: https://react-select.com/advanced
_Below is an example of replicating the behaviour supported by the (deprecated) onSelectResetsInput and (deprecated) closeMenuOnSelect props in react-select v1_
Am I misinterpreting this paragraph?
PS - The demo below that paragraph, that I think is trying to show the "new way" to manage the list, doesn't work anyway (the list closes on each select), but if I add closeMenuOnSelect={false} to the demo in the sandbox, it does work fine. Very confusing.
It seems that line in the docs was added a couple of years ago: https://github.com/JedWatson/react-select/commit/229592421199d2e7c22cae9ec34ee5ddb0673de5#diff-fd614ecf8dd9267fb749dff82585c022
However, according to the docs here there is no mention of deprecation: https://react-select.com/props#select-props
I use this option in a production environment with the latest version of react-select without issues. Maybe you could open a PR to remove this "deprecated" mention in the docs?
https://github.com/JedWatson/react-select/issues/2032#issuecomment-502719989 - This can be a temporary solution to your problem. I used a variation of this and worked great !
Most helpful comment
@Eric24 There is already a prop which handles your use case. It is called
closeMenuOnSelectand its default value is set totrue, meaning the default behaviour is to close the menu when selecting an option. Setting the props value tofalseshould allow for the behaviour you seek, keeping the menu open after selecting an option.