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.
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
[x] Add meaningful unit tests for your component (verify that all lines are covered)
[x] Verify that all existing tests pass
[x] ~Add component features demo in Storybook (different stories)~
[x] ~Approve test images for new stories~
[x] Add screenshots of the key elements of the component
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.
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