Selected item disappears from dropdown when selected

[designertyler]

This behavior was carried over from v9 to v10. The selected option should remain in the dropdown and be shown as selected instead of being removed from the list.

Current behavior: Option 2 disappears from the list when it is selected.

Expected behavior: Option 2 remains in the list and has some indication that it is selected.

[asudoh]

Hi 👋 thank you for bringing this up! Given this issue has type: discussion 💬 label and the UX is hard to change the UX after we ship v10, let me tag @IBM/carbon-designers - My apologies in case this issue came from the team's consensus. Thanks!

[aagonzales]

I think we decided to make a variation of the dropdown that did that @designertyler and keeping this one as well since there are some valid use-cases for it.

[asudoh]

Thanks @aagonzales for clarifying! Given this is now for adding an option technically it no longer is locked down to a specific release, but please don't hesitate to speak it has to be in v10. Thanks!

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. Thanks for your contributions.

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[designertyler]

Still needed, stalebot

[marceltrautmann]

suggest text (in standards) explaining when to use which option. i understand there are valid use cases, so it would help to know what they are.

[joshua-vaughn]

What are the valid use cases for removing the selected item from the list? This seems more like a bug than an enhancement to me.

[chrisconnors-ibm]

It's currently implemented as designed, so deviations from that design constitute enhancements.

It's valid to say the original design might not be what is desired or required currently, but they're still enhancements.

[marceltrautmann]

Some clarity around why it was designed this way, along with sample use cases would help us determine if we can use it as is, or if we need to wait for the enhancement discussed above.

[jeoffw]

@janchild please add this to Content to-do list. We should clarify the uses of Dropdown vs Select, and concisely explain the rationale for why it works the way it does currently (if there is a good rationale).

[chrisconnors-ibm]

suggest text (in standards) explaining when to use which option. i understand there are valid use cases, so it would help to know what they are.

@marceltrautmann I'm unclear what you mean by "when to use which option" - this issue illustrates an actual and desired behavior of a single component, not a choice between two possible existing behaviors. Only the current behavior exists today. What are you referring to here?

[marceltrautmann]

https://github.com/carbon-design-system/carbon/issues/1936#issuecomment-468346982

This implies two variations yes?

[designertyler]

Yes, the original issue was to make it a variation. This was to work around the "no functionality changes for v10 release" goal.

@chrisconnors-ibm Now that we've released v10, should this become the new default behavior or a variant?

[aagonzales]

I think its a new variant with the intent to deprecate the older version in the next major release. I worry about switching functionality on people without them opting into it.

I shouldn't have said "valid" in my previous comment, but it is in use by product teams. It is unknown if everyone using dropdown today agrees with switching it (maybe they do, its a true unknown) but that's why I'd like to make it a variant and not just change it on everybody.

[marceltrautmann]

Wouldn’t that require all existing users to manually switch over to the new variant once the old is deprecated?

[joshua-vaughn]

If it's the same component, if we just changed the behavior rather than making it a variant then I think everyone would get the new behavior (keeping the selected item in the list) "for free." If it's a variant, then teams would have to manually switch over to it.

My question is WHY was the dropdown designed with the current behavior (removing the selected item from the list) in Carbon v9? I get that there was a "no functionality changes for v10 release" goal, but I've NEVER seen a dropdown work that way in 20 years of UX design! Does anyone actually WANT the current behavior? Providing unnecessary variants just increases inconsistency.

[marceltrautmann]

based on Anna‘s comments I think we can move past the ‘why’ and focus on getting the smoothest transition.

[aagonzales]

If no one else is concerned about switching functionality on people then we can just update the default. But I think that's a breaking change so we'll have to wait until v11 to update. @carbon-design-system/developers . Would changing this in the default dropdown be a breaking change?

If it is a breaking change, then the only way to get it into V10 would be to add it as a variant.

[asudoh]

Thank you for sharing your thoughts on this @aagonzales!

Would changing this in the default dropdown be a breaking change?

This is more of a design perspective I think. Here's what happens; If we just make a change in a minor release, our users' CI process may just upgrade Carbon and their products see the change in behavior (of dropdown selection UI) all the sudden (e.g. just by refreshing browser or logging into products like IBM Cloud console first time in a while). The question is if it's a breaking change in UX perspective.

[marceltrautmann]

for what it’s worth, my vote is no, it’s not a breaking ux change. kinda the opposite :-)

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[marceltrautmann]

keepalive-bot

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

[marceltrautmann]

keepAlive[bot]

[marceltrautmann]

will this item gain some traction?

[aagonzales]

bump @shinytoyrobots and @chrisconnors-ibm for planning prioritization. This would be part of the "Component Enhancements" project.

[asudoh]

👍 on prioritization. Thoughts on staged steps, in priority order, I talked briefly about with @aagonzales:

1. Update website to demonstrate React version of dropdown, given the React version does not have the selection problem described here
2. Rectify vanilla dropdown

[aagonzales]

Fixed in React and live on the website now https://www.carbondesignsystem.com/components/dropdown/code

[elizabethsjudd]

Can we get this UX change added to Carbon Vanilla as well so we have consistent behavior across the different frameworks.

[asudoh]

Unfortunately, there is some other major differences, like the markup structure and the keyboard navigation model, and changing those, including changing the selected style itself are breaking changes.

Feel free to introduce a CSS class for the alternate selection model, and/or introduce a V2 dropdown incorporating the entire behaviors seen in React dropdown. A raw-DOM based keyboard interaction code for carbon-components-react's keyboard navigation model can be seen here that you'd be able base the work on.

[joshua-vaughn]

It doesn't sound like this issue should be closed yet

[aagonzales]

@joshua-vaughn Carbon is doing react first. Any vanilla updates request should be made in a separate issue.

[joshua-vaughn]

I'm confused. I don't think the original issue was logged specifically on React, it was loged against Carbon in general. Are designers expected to log separate issues for each codebase for the same bug?