Windowscroller

[jfrolich]

Thanks for your work on this, looks really impressive 🎉

I am interested if you are open to add windowscroller functionality in this library or if that is out of scope for this library perhaps because of performance reasons.

In our app we make use of react-virtualized at this moment, but it's always great to switch to a more performant alternative. If I can find time, I am interested to help out with the implementation of the windowscroller functionality.

[bvaughn]

WindowScroller was one of those painful to maintain components. I see the usefulness of it, but I'm not sure I'm interested in committing to maintain another one. I would prefer instead, if possible, for an external component to be built (and published separately) that implements this functionality on top of react-window.

I might be willing to make a couple of changes to react-window to support such a component, if it existed, depending on how complex they would be.

Maybe a good initial start would be for someone (you?) to submit a PR that adds it to this library directly– so we could see how complicated it might be to publish separately.

[PascalSenn]

If you really need a window scroller, you can just use the one of react-virtalized.

WindowScroller
https://codesandbox.io/s/vy620pkzzy

WindowScroller with dynamic content
https://codesandbox.io/s/xvl23p7okp

[bvaughn]

I think I'm going to close this issue for now since I don't plan on taking any action on it—and the long term plan (in my mind at least) was a separate module anyway. I'd still be happy to take a look at a proposal though!

[carlosagsmendes]

Hu @PascalSenn , are you using the WindowScroller from react-virtualized with success? Thanks in advance

[carlosagsmendes]

Hi again @PascalSenn , I'm trying your approach with a grid but it is not working for me. Can you help?

Thanks in advance

[lipoolock]

@carlosagsmendes
To fix your issue, you have to fallback on doc which is explaining that for Grid, you have to provide another param signature than Lists
scrollTo({scrollLeft: number, scrollTop: number}) => https://react-window.now.sh/#/api/FixedSizeGrid

Hope this will help...
Note: take care of the CSS trick of @PascalSenn

// This height will override the window.innerHeight set in JSX : height={window.innerHeight}
.window-scroller-override {
  height: 100% !important;
}

To give help, here a sample with Grid working : https://codesandbox.io/s/wq301o8qz7

[kgregory]

If you really need a window scroller, you can just use the one of react-virtalized.

WindowScroller
https://codesandbox.io/s/vy620pkzzy

WindowScroller with dynamic content
https://codesandbox.io/s/xvl23p7okp

FYI for anyone considering these examples, please note that use of window.innerWidth and window.innerHeight does not account the presence of scrollbars. The scrollbar size, which varies by browser/device (and whether these is enough content for them to be presented), needs to be deducted.