Dear community, I'm requesting advice on an OOUI-related issue with the Page Forms extension and its use of comboboxes with autocompletion over the API. It used to support mapping values to labels, e.g. displaytitles, mapping properties and even mapping templates, but I'm not sure if that functionality has fully survived the switch to OOUI's ComboBoxInputWidget, which happened in 2021.

To be clear, Page Forms has two kinds of autocompletion: local, which is intended for use cases where all of the options can be preloaded, and remote, which relies on an API to retrieve its data and labels for suggestions as the user types. Both are implemented in OOUI, the former through PHP, the latter through JS. It is the remote, JS-based type I'm referring to here.

The ComboBoxInputWidget lets me differentiate between what it calls data and labels if I want to create options for the dropdown list. So far so good, but when the user has selected an option from the list and the value is accepted in the input (good), there is no sign of a label (bad). Confusingly, it's just the value itself, which is what needs to get submitted, that is also displayed to the user.

Many years ago (2017), it was confirmed that this was not yet possible in OOUI (see
mailing list and Stackoverflow). To judge by the code, this is still the default behaviour :

OO.ui.ComboBoxInputWidget.prototype.onMenuChoose = function ( item ) {
	this.setValue( item.getData() );
};

Even if it is not possible out of the box, it is 2023 and OOUI is meant to be extensible and 'chainable'. I don't know how to go from here, however. Sure I can override onMenuChoose, but how does the ComboBoxInputWidget /TextInputWidget facilitate the 'value-label mechanism'? Are there any best practices I should be aware of, or there creative solutions available?

P.S. TextInputWidget does offer a 'label' property, but it is intended for a rather different purpose.