How to make a ComboBox overlay expand its width so it can display longer text?

Flow
1

so I have a combo box that has a set height

vaadin-combo-box-item {
    font-size: 12px;
    min-height: 14px;
    max-height: 20px;
}

However, when a item has a long text, it would get cut off
Can the overlay automatically expand when item text is too long so the full item is visible? I also want the text to stay on one line (no wrapping).

image

2

Hi, did you check this Combo Box component | Vaadin components?

3

so I see that we can set a fixed width with

comboBox.getStyle().set("--vaadin-combo-box-overlay-width", "350px");

However, is there a way to dynamically adjust the overlay width?
I tried doing:

vaadin-combo-box-overlay::part(overlay) {            
    white-space: nowrap;
    min-width: 150px;
    max-width: 200px;
}

But the overlay just stays at 150px, and it is not expanding?
image

4

There is no API for that, but it has been studied and some solutions have been posted like this for example: