Adjust ScrollIntoView on tab key event?

[michelle enos]

I am using smooth-scrollbar to create a horizontal scrollbar. The design I'm working with includes a fixed menu bar on the left side of the page, about 90px wide. Everything is working beautifully except for one little issue.

If I use the tab key to navigate through the page, everything generally works as expected - the scrollbar position updates if need be and scrolls the newly focused elements into view. The only issue I'm having is that the elements scroll into view without any offset on the left side of the page and are therefore partly covered by the menu.

I found the listener handling tab events here: https://github.com/idiotWu/smooth-scrollbar/blob/develop/src/events/keyboard.ts

function handleTabKey(scrollbar: I.Scrollbar) {
  // handle in next frame
  requestAnimationFrame(() => {
    scrollbar.scrollIntoView(document.activeElement as HTMLElement, {
      offsetTop: scrollbar.size.container.height / 2,
      onlyScrollIfNeeded: true,
    });
  });
}

All I need to do is to add an offsetLeft into that function! I can't find any way to adjust this though aside from hacking the source code (for the record I did try this and confirmed that it works). Am I missing an option that would help me? Any ideas?

[Daofeng Wu]

I think this is a bug as we didn't consider the pages with horizontal scrollbars.

Feel free to create a pull request that adds the missing offsetLeft 😆.

P.S. the keyboard handler seems a bit messy. We may need to refactor it completely in v9 🤔

[Daofeng Wu]

Fixed in v8.8.1.