[Bug]: 7.1 Table of contents is not scrollable

[ajkl2533]

Describe the bug

When TOC became too long that overflows the viewport there is no way how to scroll to the lower items.

Screen.Recording.2023-07-20.at.16.31.00.mov

To Reproduce

1. Enable TOC
2. Open component docs (ideally with many stories)
3. Make the viewport smaller so that TOC overflows

System

Environment Info:

  System:
    OS: macOS 13.4.1
    CPU: (10) arm64 Apple M1 Pro
  Binaries:
    Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
    Yarn: 3.5.0 - ~/.nvm/versions/node/v16.16.0/bin/yarn
    npm: 8.14.0 - ~/Projects/design-system-v2/node_modules/.bin/npm
  Browsers:
    Chrome: 114.0.5735.198
    Safari: 16.5.1
  npmPackages:
    @storybook/addon-a11y: ^7.1.0 => 7.1.0 
    @storybook/addon-actions: ^7.1.0 => 7.1.0 
    @storybook/addon-designs: ^7.0.1 => 7.0.1 
    @storybook/addon-docs: ^7.1.0 => 7.1.0 
    @storybook/addon-essentials: ^7.1.0 => 7.1.0 
    @storybook/addon-interactions: ^7.1.0 => 7.1.0 
    @storybook/blocks: ^7.1.0 => 7.1.0 
    @storybook/components: ^7.1.0 => 7.1.0 
    @storybook/jest: ^0.1.0 => 0.1.0 
    @storybook/react: ^7.1.0 => 7.1.0 
    @storybook/react-vite: ^7.1.0 => 7.1.0 
    @storybook/test-runner: ^0.11.0 => 0.11.0 
    @storybook/testing-library: ^0.2.0 => 0.2.0

Additional context

No response

[almoghaimo]

Hello 👋

Can I work on this issue?
It's my first contribution, Is there any preferred way of solving this issue or any guidelines I should follow?

@vanessayuenn

[vanessayuenn]

@shilman do you have any pointers for @almoghaimo?

[ghost]

Hi @vanessayuenn, If no one is currently working on this I would like to work on this issue

[almoghaimo]

Hi @vineetpradhan-dev I have already started to work on it.
I managed to reproduce the bug and pop up with a solution.

Are there any pointers about how to test it?
In addition, I'll add a video on what it looks like, can you tell if the scroll behavior is how it is expected to be?

fix_scroll_bug.mov

@vanessayuenn @shilman