React-autosuggest: Scrollbar on fixed height suggestion container will not scroll when arrow keys are pressed

[samuliheljo]

I have a style:
.react-autosuggest__suggestions {
max-height: 130px;
overflow: auto;
}
and quite a lot of suggestions.

I would like suggestion container to scroll when user clicks arrow up or down. Any ideas?

[moroshko]

@samuliheljo Looks like a bug. I'll have a look, but feel free to submit a Pull Request to speed up things :)

[moroshko]

@samuliheljo I wonder what's your use case to have so many items that require a scroll bar. Maybe autosuggest is not the right component for you? Could you please describe your use case?

[samuliheljo]

Hi, use case is same as described in #22. We got it working using similar hack as described in that issue.

One could argue that in case of long list maybe only top n results should be shown and thus prevent this problem from occurring.

This issue is not currently blocking us. It is not clear whether this will be in our final implementation. If you are interested, see https://github.com/HSLdevcom/openjourneyplanner-ui/blob/master/app/component/search/search.cjsx#L212-L239

[moroshko]

@samuliheljo Nice hack :)

From UX point of view, I'm not sure how helpful are those suggestions that are hiding behind the scrolling bar. I'd guess that most users just continue typing to reduce the amount of suggested options, rather than stop typing and scrolling to see the rest of the suggestions.

But, I agree, it's not that clear, and ideally react-autosuggest will "just work". You are welcome to submit a Pull Request to fix this and make the world a better place :)

[moroshko]

It's fixed in v1.14.1

[moroshko]

@samuliheljo @joeybaker Note that from version 1.15.0 you have to specify scrollBar={true}.

[hughlomas]

@moroshko Heya, I noticed in the upgrade guide (https://github.com/moroshko/react-autosuggest/blob/b903c628bc18abb6186701edf284a26ec2ba0999/UPGRADE_GUIDE.md) it says scrollBar isn't supported right now for 3.x, any ETA?

[moroshko]

@hughlomas Implementing scrollBar in 3.0 is a bit different, as 3.0 relies on react-autowhatever as its rendering layer. I'm quite busy in the next few weeks, but hope to get to it once I have a bit more time. You are always welcome to help!

[avindra]

@moroshko: Any update on scrollBar? It would be nice to have this feature again.. should this issue be reopened?

[moroshko]

@avindra It's coming! We have a Pull Request opened for react-autowhatever and also this one for react-autosuggest.