[Feature Request] Add a class when something is chosen in a List Component

[kud]

Affected Projects React

Is your feature request related to a problem? Please describe. I don't know in CSS when a filter / facet has a value chosen.

Describe the solution you'd like For the moment I did this workaround:

            <MultiDropdownList
              className={classNames({ "MultiDropdownList": true, "MultiDropdownList--active": state.fatesFilterActive })}
              onValueChange={(value) => {
                this.setState({ fatesFilterActive: value.length > 0 })
              }}
              innerClass={{
                title: "MultiDropdownList-title",
                select: "MultiDropdownList-select",
                list: "MultiDropdownList-list",
                icon: "MultiDropdownList-icon",
                count: "MultiDropdownList-count",
              }}
/>

[jyash97]

We do apply a class active to the item which is currently selected. Consider the below example:

 <MultiDropdownList
    componentId="BookSensor"
    innerClass={{
         list: "list"
    }}
    dataField="original_series.raw"
    size={100}
 />

And you can use this selector:

.list .active { 
  color: red;
}

Example: https://codesandbox.io/s/multidropdownlist-kjxby

[jyash97]

Reopening it because I may have interpreted incorrectly. So you want to create a class whenever a filter is active. Right?

[kud]

I would like to know as a developer that at least one element has been selected in the list, on the whole component.

I need it to change the colour of the whole component when the filter has something selected or it's the initial state.

I don't need to change the style of the list but the style of the select in fact :D