Carbon: ComboBox `selectedItem` prop like Dropdown

[harshzalavadiya]

Summary

carbon-components-react's ComboBox component only allows user to set initialSelectedItem but will be nice to have selectedItem like Dropdown component
Please describe your request in one or two sentences.

Justification

NA

Desired UX and success metrics

NA

"Must have" functionality

NA

Specific timeline issues / requests

NA

Available extra resources

NA

[eglepuo]

Totally agree

[eglepuo]

@emyarod are you planning to implement it?

[emyarod]

do you mind expanding on the Justification and Desired UX and success metrics?

[eglepuo]

Summary

carbon-components-react's ComboBox component only allows user to set initialSelectedItem but will be nice to have selectedItem like Dropdown component
Please describe your request in one or two sentences.

Justification

It's not possible to add new values to ComboBox component. For example I have ComboBox with some values to choose from, but I want to have possibility to add new values to that ComboBox. So I create button for new value addition, and after submitting that new value I want it to appear in the ComboBox, but I don't want to set it as a InitialSelectedValue, because then it is not possible to remove it from that field.

Desired UX and success metrics

Design should not be changed, it just should have possibility to set Selected Value and that is all I need.

"Must have" functionality

ComboBox have SelectedItem prop.

@emyarod hope it will help you :)

[emyarod]

@eglepuo is this the scenario you are describing? https://codesandbox.io/s/codesandbox-8misj

[eglepuo]

@emyarod yes

[emyarod]

@eglepuo the example I wrote in that codesandbox is using the existing component. does that fit your use case?

also cc @harshzalavadiya

[harshzalavadiya]

@emyarod looks nice

[emyarod]

so the component already supports the functionality you're looking for in initialSelectedItem then right?

[eglepuo]

@emyarod thanks you! My problem was that I was trying to filter items from backend with OnInputChange function, and then this component was not working correctly, and changed to filtering function to frontend filtering with ShouldFilterItem and now it works as expected. I think we can close this issue. :)

[harshzalavadiya]

@emyarod
Sorry I didn't looked at properly before but I guess you misunderstood issue
Currently Dropdown component has two props

• initialSelectedItem: One time doesn't matter even if it changes won't affect dropdown
• selectedItem: Will update on state update

But if you look at ComboBox

• initialSelectedItem: Exists but rerenders component on change
• selectedItem: Doesn't exist

If Dropdown was suppose to be Same as Combobox but with search then should have same properties

Example

https://codesandbox.io/s/codesandbox-3y85x

Scenario

• Currently the application that we are developing uses formik for validation so I have written wrapper for form component
• So for example whenever formik component initializes it sends initial value which is never going to chenge throughout lifecycle and so on onChange event I'm setting value to formik store not to initial value

Possible workaround can be I can add react hook and set value everytime will work just fine but the I raised issue because of inconsistency of how props are behaving for both components

[emyarod]

@harshzalavadiya

I won't be able to change the behavior of initialSelectedItem in <ComboBox /> to match <Dropdown /> until the next major version release as that would be a breaking change

but for now it sounds like adding selectedItem to <ComboBox /> would mirror the current initialSelectedItem behavior in <ComboBox /> is that right?

[harshzalavadiya]

Yes sounds about right,
There's already workaround for this issue, so I totally understand breaking things might not be ideal.