iTwin / iTwinUI-react

A react component library for iTwinUI.
https://github.com/iTwin/iTwinUI
Other
84 stars 23 forks source link

fix(Table): Syncing header and body horizontal scroll state #760

Closed bentleyvk closed 2 years ago

bentleyvk commented 2 years ago

Closes #757

This one was a really strange bug. Turns out after you enable some column, it won't fully fit and horizontal scrollbar will appear and everything will be scrolled to the left although column manager dropdown menu will still be visible (check GIF) so clicking anywhere else will close the menu and focus to icon button inside header column. This focus will scroll header and that makes header not aligned with the body. table-header-shift2

So what I did, I fully synced header scroll position with the body. I also made it scroll into column manager button to prevent content shift for the user.

Checklist