UI for new select component is not as intuitive as deprecated version

Just putting this out here for team.

Just FYI, the new select component is much less user (client) friendly than the deprecated version.

The deprecated version had a standard UI for select inputs where the user could see what they have selected, and it only showed one instance of the selected item, in reference to the other items in the list.

The new select is more like a multi select tool in terms of the UI. It’s confusing for people to use.

I think both options should be available.

OLD Version - Can see what you have selected and where you are in the list:

NEW Version - Very confusing for the user to tell where they are in reference to the other items:
Screen Shot 2022-12-13 at 11.09.14 PM

At a minimum, users should be able to do some more styling to make it more intuitive, such as add shadows to the option wrapper, get rid of the scroll bar and change overflow options.

2 Likes

Hey Kevin,

Also select element is hard to style to try and get it more user friendly.

@flo showed a trick to change the type from text to free-layout
image

But my final design is still not as clear as a default HTML 5 select element.
Hopefully the incoming new states (active, selected…) will help?

Matth-

1 Like

Thank for that. I agree.

Even in Free-layout, you cannot expand the width of the items beyond the width of the select input.

1 Like

@flo à la suite du ménage fait sur le selecteur : on ne peut plus choisir la couleur du background :slight_smile: