[ui5-tokenizer]: broken overflow mechanism

[nnaydenow]

Bug Description

ui5-tokenizer doesn't show tokens if there is enough space for them but it hides them correctly.

Screen.Recording.2025-01-14.at.12.44.24.mov

Affected Component

ui5-tokenizer

Expected Behaviour

If I resize the container which wraps the ui5-tokenizer additional tokens to be displayed if there is enough space.

Isolated Example

https://sap.github.io/ui5-webcomponents/play/#eyJpbmRleC5odG1sIjp7Im5hbWUiOiJpbmRleC5odG1sIiwiY29udGVudCI6IjwhLS0gcGxheWdyb3VuZC1mb2xkIC0tPlxuPCFET0NUWVBFIGh0bWw-XG48aHRtbCBsYW5nPVwiZW5cIj5cblxuXG5cblxuXG5cbjxoZWFkPlxuICAgIFxuICAgIDxzdHlsZT5cbiAgICAgICo6bm90KDpkZWZpbmVkKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICB9XG5cbiAgICBodG1sIHtcbiAgICAgIGZvcmNlZC1jb2xvci1hZGp1c3Q6IG5vbmU7XG4gICAgfVxuICAgIDwvc3R5bGU-XG5cbiAgICBcbiAgICA8c3R5bGU-XG4gICAgICAqOm5vdCg6ZGVmaW5lZCkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgfVxuXG4gICAgaHRtbCB7XG4gICAgICBmb3JjZWQtY29sb3ItYWRqdXN0OiBub25lO1xuICAgIH1cbiAgICA8L3N0eWxlPlxuXG4gICAgXG4gICAgPHN0eWxlPlxuICAgICAgKjpub3QoOmRlZmluZWQpIHtcbiAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICAgIH1cblxuICAgIGh0bWwge1xuICAgICAgZm9yY2VkLWNvbG9yLWFkanVzdDogbm9uZTtcbiAgICB9XG4gICAgPC9zdHlsZT5cblxuICAgIFxuICAgIDxzdHlsZT5cbiAgICAgICo6bm90KDpkZWZpbmVkKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICB9XG5cbiAgICBodG1sIHtcbiAgICAgIGZvcmNlZC1jb2xvci1hZGp1c3Q6IG5vbmU7XG4gICAgfVxuICAgIDwvc3R5bGU-XG5cbiAgICBcbiAgICA8c3R5bGU-XG4gICAgICAqOm5vdCg6ZGVmaW5lZCkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgfVxuXG4gICAgaHRtbCB7XG4gICAgICBmb3JjZWQtY29sb3ItYWRqdXN0OiBub25lO1xuICAgIH1cbiAgICA8L3N0eWxlPlxuXG4gICAgPG1ldGEgY2hhcnNldD1cIlVURi04XCI-XG4gICAgPG1ldGEgbmFtZT1cInZpZXdwb3J0XCIgY29udGVudD1cIndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjBcIj5cbiAgICA8dGl0bGU-U2FtcGxlPC90aXRsZT5cbjwvaGVhZD5cblxuPGJvZHkgc3R5bGU9XCJiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zYXBCYWNrZ3JvdW5kQ29sb3IpXCI-XG4gICAgPCEtLSBwbGF5Z3JvdW5kLWZvbGQtZW5kIC0tPlxuICAgIFxuICBcdDxkaXYgc3R5bGU9XCJ3aWR0aDogNTAlOyBib3JkZXI6IDFweCBzb2xpZCBibGFjazsgbWFyZ2luOiBhdXRvOyBwYWRkaW5nOiAxcmVtO1wiPlxuXHRcdDx1aTUtdG9rZW5pemVyIHN0eWxlPVwid2lkdGg6IDEwMCU7IGJvcmRlcjogMXB4IHNvbGlkIHJlZDtcIj5cblx0XHRcdDx1aTUtdG9rZW4gdGV4dD1cIkFuZG9yYVwiPjwvdWk1LXRva2VuPlxuXHRcdFx0PHVpNS10b2tlbiB0ZXh0PVwiQnVsZ2FyaWFcIj48L3VpNS10b2tlbj5cblx0XHRcdDx1aTUtdG9rZW4gdGV4dD1cIkNhbmFkYVwiPjwvdWk1LXRva2VuPlxuXHRcdFx0PHVpNS10b2tlbiB0ZXh0PVwiRGVubWFya1wiPjwvdWk1LXRva2VuPlxuXHRcdFx0PHVpNS10b2tlbiB0ZXh0PVwiRXN0b25pYVwiPjwvdWk1LXRva2VuPlxuXHRcdFx0PHVpNS10b2tlbiB0ZXh0PVwiQW5kb3JhXCI-PC91aTUtdG9rZW4-XG5cdFx0XHQ8dWk1LXRva2VuIHRleHQ9XCJCdWxnYXJpYVwiPjwvdWk1LXRva2VuPlxuXHRcdFx0PHVpNS10b2tlbiB0ZXh0PVwiQ2FuYWRhXCI-PC91aTUtdG9rZW4-XG5cdFx0XHQ8dWk1LXRva2VuIHRleHQ9XCJEZW5tYXJrXCI-PC91aTUtdG9rZW4-XG5cdFx0XHQ8dWk1LXRva2VuIHRleHQ9XCJFc3RvbmlhXCI-PC91aTUtdG9rZW4-XG5cdFx0XHQ8dWk1LXRva2VuIHRleHQ9XCJBbmRvcmFcIj48L3VpNS10b2tlbj5cblx0XHRcdDx1aTUtdG9rZW4gdGV4dD1cIkJ1bGdhcmlhXCI-PC91aTUtdG9rZW4-XG5cdFx0XHQ8dWk1LXRva2VuIHRleHQ9XCJDYW5hZGFcIj48L3VpNS10b2tlbj5cblx0XHRcdDx1aTUtdG9rZW4gdGV4dD1cIkRlbm1hcmtcIj48L3VpNS10b2tlbj5cblx0XHRcdDx1aTUtdG9rZW4gdGV4dD1cIkVzdG9uaWFcIj48L3VpNS10b2tlbj5cblx0XHQ8L3VpNS10b2tlbml6ZXI-XG5cdDwvZGl2PlxuICAgIDwhLS0gcGxheWdyb3VuZC1mb2xkIC0tPlxuICAgIDxzY3JpcHQgdHlwZT1cIm1vZHVsZVwiIHNyYz1cIm1haW4uanNcIj48L3NjcmlwdD5cbjwvYm9keT5cblxuPC9odG1sPlxuPCEtLSBwbGF5Z3JvdW5kLWZvbGQtZW5kIC0tPlxuIn0sIm1haW4uanMiOnsibmFtZSI6Im1haW4uanMiLCJjb250ZW50IjoiLyogcGxheWdyb3VuZC1oaWRlICovXG5pbXBvcnQgXCIuL3BsYXlncm91bmQtc3VwcG9ydC5qc1wiO1xuLyogcGxheWdyb3VuZC1oaWRlLWVuZCAqL1xuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzL2Rpc3QvVG9rZW5pemVyLmpzXCI7XG5pbXBvcnQgXCJAdWk1L3dlYmNvbXBvbmVudHMvZGlzdC9Ub2tlbi5qc1wiOyJ9fQ

Steps to Reproduce

1. Resize the playground view and shrink the container
2. Observe that tokens are displayed correctly in more items
3. Resize the playground view and grow the container
4. Observe that tokens are not displayed if there is enough space.
   ...

Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

nightly

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[ilhan007]

As additional context, there is a SAP Design request that depends on this - #10357. There is a requirement to use Tokenizer within a Form and currently the Tokekinzer does not work properly in Form, because of the issue above.