Is it possible to pick multiple elements with useSelectState?

[marcus-josendal]

The documentation for useSelect says the following: In addition, useSelectState manages the state necessary for multiple selection and exposes a SelectionManager.

If you try to set one key with the selectionManager it works as expected:

selectState.selectionManager.setSelectedKeys(["two"]);
console.log(_.toArray(selectState.selectionManager.selectedKeys));  // prints ["two"]

If you try to set multiple keys it ignores one of the keys:

selectState.selectionManager.setSelectedKeys(["two", "three"]);
console.log(_.toArray(selectState.selectionManager.selectedKeys)); // this prints ["two"] aswell

It seems that if you want multiple selections you have to use the use useListBox hook, but this hook doesn't include popover and accessibility features the useSelect hook offers.

[devongovett]

At the moment it's not possible. useSelect only allows single selection. It's pretty much emulating a <select> element. Multi-select becomes more complex as it's unclear where or how to display the selected items in the button. There's not really a standard UI pattern for that. What did you have in mind?

That said, you can use the list box hook separately. The source for useSelect itself isn't that complex either since it just combines a lot of other hooks, so you could pretty easily build a custom version.

[marcus-josendal]

The idea is to re-create something like this: https://material-ui.com/components/selects/ - See "Multiple Select".

Isn't it quite normal to expose this kind of functionality? I know I can't compare React-Spectrum to a component library such as Material-UI, but I get the impression that almost every component library exposes this functionality.

I do get your point on how it might be somewhat unclear how to display the items, but I think it should at least be allowed to set multiple keys. How you display them can be left to the ones implementing it.

[nivoset]

html select does support multiselect, (only when it isn't a dropdown though)
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select_multiple

however yes, this would be a very useful thing to have. i'm pondering making this somehow