looker-open-source/components

Value labels in Select Multi component disappear during filtering

Closed this issue · 1 comments

kufelkamil commented

Currently values parameter of SelectMulti is used for both rendering selected options and dropdown list. If filtering is active and currently selection option is filtered out then it starts being represented using value instead of label, which causes bad user experience.

working example: https://codesandbox.io/s/selectmulti-labels-filtering-52bs6

@looker/components version = 2.1.0

Selected options is represented using label

Selected options is represented using value

mdodgelooker commented

Hi @kufelkamil thank you for submitting this issue. We are looking into a possible solution where values would be an array of objects just like options (i.e. { value: 'GB', label: 'United Kingdom' }) instead of strings.

In the meantime, here are a couple workarounds that may work for you, depending on your use case:
https://codesandbox.io/s/selectmulti-labels-filtering-forked-w558i

Workaround 1: Keep options corresponding to current values in the filtered list, even when they don't match the filter term.
Workaround 2: Support filtering on the country abbreviation ('GB') but only send the value to options ({ value: 'United Kingdom' }).

  • 👍1