[feat] Allow ComboBox to return JSX in its drop down options #3201
Description
Does your feature request relate to a specific USWDS component?
Currently the ComboBox takes options as a prop in the form of a ComboBoxOption type that consists of 2 strings, a value and a label.
export interface ComboBoxOption { value: string label: string }
This means that all the options in the drop down can only be simple strings.
This is frustrating when you need the option to be more sophisticated (more than one piece of info per selection)
Id like to be able to pass in JSX as a label for a drop down option in the ComboBox.
An easy way to do this would be to allow the ComboBoxOption interface to have an additional, optional render function field that returns JSX.
export interface ComboBoxOption { value: string label: string render?: () => JSX.Element }
Then in the returned list tag, check for the render function, if it was passed, invoke it to return the JSX as the option. If it wasn't, just use option.label instead.
{option.render ? option.render(): option.label}