AutocompleteWidget: better display in small layouts

[vera]

I just updated from version 1.9 to the most recent version.

I noticed that the display of the AutocompleteWidget is now less suitable for small layouts. E.g. we have an AutocompleteWidget inside a popover with width 400px. Previously 7 options could be shown at once:

Now only 4 options can be shown at once and I feel like some of the whitespace around the options is "wasted" space:

Maybe a compact option could be added when the widget is used in small spaces to get the old layout back?

[rombaum]

@vera nice idea to provide a compact view.

However, Just to let you know. I'm missing some information in your second screenshot. MeSH and also some entities of SNOMED CT will provide a description which could be added to the autocomplete:

or only with SNOMED CT

Just add &fieldList=description,label,iri,ontology_name,type,short_form to your integration than you will get also the description for the suggested terms.

[vera]

@rombaum thank you for the tip!

When I add the descriptions, I have the opposite problem than above when the widget has a lot of space and is quite wide:

The descriptions are cut off short even though there would be more space available.

[jusa3]

The descriptions are truncated after 40 characters. I could provide an option to adapt that, too. Maybe we should think about a parameter analogous parameter such as styleParams, which can hold multiple style related parameters and can be easily extended @rombaum ?

[jusa3]

Not straightforward with CSS inline styles and text-overflow: ellipsis.

Found another possible solution: the EuiComboBox component prop truncationProps. Only available since v88.4.0 so we first would need to update Eui.