carbon-design-system / carbon

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

MuliSelect with labeled selections #2571

Closed geforcelive closed 4 years ago

geforcelive commented 5 years ago

Summary

We need a replacement for well known select2 component. We are using it while filtering in terms of in-set clause. The proposition is to extend the MultiSelect component, so we could see the list of options that we currently choosed, not only its count.

Justification

We started transision of UI to new look and feel using react and carbon components. In case of replacing filtering we have found that our one component have no equal replacemnt in react carbon components.

Desired UX and success metrics

On the picture below one can see the desired behavior on the UI: image

We would like to either choose by selecting a option or type a option to narrow down the list of results.

Each option should contain a pair of id and value. Under the hood we would like to pass the ids to the backend for further filtering.

"Must have" functionality

Displaying currently choosed elements is a must have.

Specific timeline issues / requests

It is on our near roadmap. We plan to deliver first increment this year.

Available extra resources

We could organize some extra resources based on the cost of the enhancment.

asudoh commented 5 years ago

@IBM/carbon-designers Any thoughts...? Thanks!

designertyler commented 5 years ago

I'd suggest detaching the selected tag and dropdown areas rather than trying to build all that functionally in a small area. This would also give you the space you need to show tags with longer names and could be possible with the tag and multi select components today.

geforcelive commented 5 years ago

Any chance or plans to have such component in future carbon components?

stale[bot] commented 5 years ago

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.

aagonzales commented 5 years ago

Related issue: https://github.com/carbon-design-system/carbon-components-react/issues/1374

dakahn commented 5 years ago

@carbon-design-system/design This has come up a few times recently in our internal slack and it seems like a few people are interested in contributing this to Carbon. Is this something we intend to work on and support?

shixiedesign commented 5 years ago

Let's discuss as a group next week @dakahn

stale[bot] commented 5 years ago

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.

laurenmrice commented 5 years ago

not stale

stale[bot] commented 5 years ago

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.

laurenmrice commented 5 years ago

not stale

stale[bot] commented 5 years ago

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] commented 5 years ago

As there's been no activity since this issue was marked as stale, we are auto-closing it.

jeanservaas commented 5 years ago

not stale

stale[bot] commented 4 years ago

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] commented 4 years ago

As there's been no activity since this issue was marked as stale, we are auto-closing it.

drewdistefano commented 4 years ago

Can some progress be made on this? This would be very useful for the Product Discovery team.

stale[bot] commented 4 years ago

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] commented 4 years ago

As there's been no activity since this issue was marked as stale, we are auto-closing it.

aagonzales commented 4 years ago

@geforcelive @drewdistefano Sorry for the very delayed response. Carbon has reviewed your proposal and think that the MultiSelect dropdown is the correct component to use here and that the added functionality of raising the full tags to be in the field is not scalable (what would happen if the user select 20 items?). As Tyler suggested a more scalable solution would need to be designed that doesn't include the bounds of the field and perhaps served more as a filter control than a dropdown.

We will not be pursuing this design as it currently is spec-ed for a Carbon enhancement but if this is something you team feels it still needs you of course can build it on your own. Please feel free to submit alternate designs and we will re-open the issue.