search

clauderic / react-tiny-virtual-list

A tiny but mighty 3kb list virtualization library, with zero dependencies 💪 Supports variable heights/widths, sticky items, scrolling to index, and more!
https://clauderic.github.io/react-tiny-virtual-list/
MIT License
2.46k stars 165 forks source link

support scrollToIndexIfNecessary? #19

Closed kentcdodds closed 7 years ago

kentcdodds commented 7 years ago

I'm trying to support react-tiny-virtual-list in a nice way in downshift and it would be very helpful if there were a way to have react-tiny-virtual-list only scroll to an index if that node is not currently visible.

See this example and the live demo here.

Thanks!

clauderic commented 7 years ago

Hey @kentcdodds,

Sorry for the late response. Completely missed this somehow 🤷‍♂️

I hadn't thought of that particular use case, but I'm sure it's a fairly common one so it would absolutely make sense to support this 👍

I think this behaviour can be handled by slightly tweaking the implementation of scrollToAlignment. Something like scrollToAlignment="auto".

kentcdodds commented 7 years ago

That sounds great :+1: Thanks!

Can't wait to update my example.

clauderic commented 7 years ago

Just shipped scrollToAlignment="auto" with version 2.1.0. 'auto' scrolls the least amount possible to ensure that the specified scrollToIndex item is fully visible, which should be the behaviour you're looking for. Let me know how that goes 👍

kentcdodds commented 7 years ago

Thank you! It works great!

kentcdodds commented 7 years ago

Whoops, wrong link. Here's the right one: https://codesandbox.io/s/v670kq95l

clauderic commented 7 years ago

Looks awesome 🤓 🎉