Closed zpeterson closed 5 months ago
Shouldn't the display reflect the multiple selected values somehow? What should "value" be with multiple selections or is it only valid in single select mode?
This breaks keyboard navigation. Opening/closing the listbox now conflicts with selecting/deselecting the currently checked option.
Just thinking out loud here: we may want to demonstrate how both the original behavior and the new behavior can be achieved with class overrides - it could make better sense to keep the original behavior, then override the methods via the select.register.ts
module (which currently contains additional example logic regarding multiple
and size
).
I commented in the related issue, but I don't support this update. Components which allow for multiple selection should not hide the values selected, which is realistically the only way that can work within the constraints of the Select component. The Picker is designed for multiple values inherently and provides a better interface for working with them.
The general rule I find that's providing the best experience is to use Select for single-select options on a small list of non-dynamic choices like a list of four different sort columns. Any time the list is long enough to scroll or has named items (people, files, groups, etc.) where search is beneficial and/or multiple values may be selected should use Picker.
One of the updates I am going to propose for Picker is also a single-select mode to gain the benefits of working with a long list but in the case where only a single value is allowed.
Pull Request
π Description
Make select component collapsible when multi-select (
multiple
attribute) is enabled.Before
![select-before](https://github.com/microsoft/fast/assets/48063210/69a5fef5-59b7-4451-a360-563662aeec9d)After
![select-after](https://github.com/microsoft/fast/assets/48063210/a05feb46-00f1-46f6-a62a-e9f56de69afb)π« Issues
https://github.com/microsoft/fast/issues/6889
π©βπ» Reviewer Notes
Please test the select component in Storybook and checkout the before/after gifs in the description.
π Test Plan
Tested in Storybook.
β Checklist
General
$ yarn change
Component-specific