MultiSelect - Display as chip behaviour

[andreaswill]

If display="chip" is set in the MultiSelect component, then a maximum of 3 elements are displayed as chips in the MultiSelect. If there are more, overflow: hidden and text-overflow: ellipsis are used to indicate that there are more selected elements.

Unfortunately, this only works if the width of the MultiSelect and the width of the chips (content and padding) match the logic that only a maximum of 3 elements are visible. (a maximum of 3 elements are generated in the DOM)

To recreate this:
On the PrimeNG homepage, if you change the width of the MultiSelect to e.g. 400px and then select 4 elements. The user then gets no info that more than 3 elements are selected, bc. there is no overflow and text-overflow.

The problem does not exist if the selected elements are displayed as text.

Is there a solution for displaying the selected elements as a chip that works with variable widths of the MultiSelect and different numbers of chips or different text lengths?

[andreaswill]

Figured out it can be solved by generating more selected elements in the DOM via the [maxSelectedLabels] property.