fix: 🐛 #17051 fix dynamic tab display

[qwadrox]

fixes #17051

Tabview could handle dynamic tabs properly in V17 so this fix attempts to achieve the same behavior.

I had one edge case though that I couldn't confidently address. When selectedTab is set to something like 20

selectedTab = signal(20);

meaning the selected tab is not visible on the page load, then I filter, because of the inkbar's CSS transition the layout is still in flux, and then in the updateButtonState()

this.isNextButtonEnabled.set(_list.offsetWidth >= offsetWidth && scrollLeft !== scrollWidth - width);

the scrollWidth calculations aren't accurate until the inkbar settles. I guess. So it would incorrectly display the NextButton.

to overcome I came up with this:
_inkbar.addEventListener('transitionend', () => { this.updateButtonState(); }, { once: true } );

It listens for the inkbar's transition to complete before making the final button state update

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

2 Skipped Deployments

Name	Status	Preview	Updated (UTC)
primeng	⬜️ Ignored (Inspect)	Visit Preview	Dec 27, 2024 8:47pm
primeng-v18	⬜️ Ignored (Inspect)	Visit Preview	Dec 27, 2024 8:47pm

[vercel]

@qwadrox is attempting to deploy a commit to the primetek Team on Vercel.

A member of the Team first needs to authorize it.