ComboBox: onRenderContainer and onRenderList need the default onRenderItem function

[abettadapur]

@cschleiden

Describe the issue:

The onRenderContainer and onRenderList properties on the ComboBox are not particularly helpful because they are not passed the default render function for onRenderItem.

As an example, if I wanted to render the ComboBox list in the virtualized Fabric list, I have the following problems:

• I do not have any of the state from ComboBox, so I cannot tell if an item is selected
• I must rewrite the onRenderItem function for the List so that I can click on items in the list

It would be nice if the onRenderList function was passed the default render for the list as well as the default render functions for all of the components in the tree (onRenderItem, onRenderOption). That would solve the above two issues and make the onRenderList prop more useful.

[cschleiden]

@christiango What do you think? We were thinking instead of just passing the ComboBox's props to onRenderList to pass at least this._onRenderItem.

[christiango]

@jspurlin would be the best person to answer that, but it sounds reasonable to me.

[jspurlin]

Yeah, sounds reasonable, but if this change is made that callback will no longer be an IRenderFunction. Also, if we make this change we should return the actual onRenderItem (the default _onRenderItem or the custom render that was passed in, e.g. let { onRenderItem = this._onRenderItem } = this.props; and pass onRenderItem) otherwise you could get into a weird state where you try to use the onRenderItem that's passed to onRenderList and you don't get the desired result. If that didn't happen onRenderList would always have to check which onRenderItem they need to use

[cschleiden]

Yes, of course. We should follow the "onRender resolution logic". For the onRenderList prop continuing to be an IRenderFunction, we could extend from the IComboBoxProps (e.g., IComboBoxRenderProps) and pass the resolved onRenderOption method in a new prop.

[abettadapur]

onRenderItem also needs to be passed some state about the item, so that I can mark it as selected in a custom implementation