search

carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.73k stars 1.79k forks source link

[Dropdown] Including a way to remove selection for optional dropdowns #6581

Closed dianasanborn closed 3 years ago

dianasanborn commented 4 years ago

Summary

There is a need for users to have a way to clear the selection for optional dropdowns.

For example: If a user made a selection on an optional field, but wanted to remove the selection and keep it blank.

We are looking to include a "Select" option in the dropdown to allow the user to revert back to a null option, but would love the Carbon team's thoughts on this as well.

Screen Shot 2020-07-29 at 2 40 41 PM

It would be helpful if this guidance was also included in the dropdown component as well.

AlexanderLyon commented 3 years ago

@tw15egan @laurenmrice I'd like to take a stab at this enhancement if nobody else is already on it!

Would this also require a new optional prop? I don't currently see any existing functionality in the docs to make this component optional

tw15egan commented 3 years ago

@AlexanderLyon Awesome! I'll let @laurenmrice chime in with design / UX specs for you to follow.

I'm thinking we'd want this functionality to be tied to a new prop. Based on our WIP naming conventions for our next major release, I think this new prop would make sense as isOptional.

@joshblack What do you think?

AlexanderLyon commented 3 years ago

I opened a PR in the meantime with one possible solution for this, but I'd love some feedback if there's some more detailed specs to be followed!

laurenmrice commented 3 years ago

We are going to use Dianas UX approach. (this has been tested with user research)

Here is the spec below @AlexanderLyon :

dropdown (optional)

laurenmrice commented 3 years ago

@joshblack created a Codesandbox that demonstrates that we can achieve this implementation with our current codebase. A prop won't be needed.