Dropdown can not display selected element (string is fine)

What package(s) are you using?

• carbon-components
• [ x] carbon-components-react

Detailed description

I am using itemToElement to show my dropdown options, but now Dropdown can not show the selected element because the line " {selectedItem ? itemToString(selectedItem) : label}" should try to invoke “itemToElement” if it is available but now only string can be displayed .

<ListBox.Field
                  id={id}
                  tabIndex="0"
                  disabled={disabled}
                  aria-disabled={disabled}
                  aria-labelledby={`${labelId} ${fieldLabelId}`}
                  aria-describedby={helperId}
                  {...buttonProps}>
                  <span
                    id={fieldLabelId}
                    className={`${prefix}--list-box__label`}
                    title={selectedItem ? itemToString(selectedItem) : label}
                    {...getLabelProps()}>
                    {selectedItem ? itemToString(selectedItem) : label}
                  </span>
                  <ListBox.MenuIcon
                    isOpen={isOpen}
                    translateWithId={translateWithId}
                  />
                </ListBox.Field>

This is my expected result

[ilovepumpkin]

I guess not, 😄. I will let her know about this. Thanks!

[joshblack]

I just wanted to chime in here and clarify that the design intent is not to have custom options like tags inside of the dropdown component. Similarly, custom items should not render in the field position. The rationale for this is that it can create some confusion UX-wise around how to use the control (for example if it looks like a multi-select but doesn’t behave like one)

Feel free to reach out on #carbon-design-system on Slack if there are any concerns with this!

For folks on the team, can see our recent thread on the support channel for the resolution 👍