Downshift: Replace scrollIntoView with scroll-into-view-if-needed

[kentcdodds]

I'd like to reduce the amount of code to maintain and scrollIntoView is probably the most complicated code in this project. Richard pointed me to scroll-into-view-if-needed. Looks like it could be a good replacement.

Anyone want to make a PR to replace scrollIntoView and see how it impacts the examples?

[Drapegnik]

It would be interesting to me, but at the moment there is no time. I can try to do it during the week

[razh]

Note that scroll-into-view-if-needed (bundle.jsis 9.51 kB unminified) includes the amator animation library (8.13 kB unminified).

[kentcdodds]

Ah, that's good to know @razh! Thanks for bringing that up! We definitely don't want that :-/

Maybe we should just take ours and extract it to an isolated package if we can't find something else? I feel like there's gotta be a good, small solution to this!

[Drapegnik]

@kentcdodds how you see the best way:

1. fork scroll-into-view-if-needed, get rid of amator and:
   
   
   
   1. use it by direct link on github fork repo?
   
   
   2. publish new package and use it?
   
   
2. completely extract source code as new package

In first case we'll still be able to update ours fork from parent

[kentcdodds]

Well, if we can't find anything better than what we have built ourselves, then I say let's make a new package out of what we have.

Alternatively we could just not worry about it and leave things as they are 😅 Maybe I'm just complicating things...

[Drapegnik]

How about to use patch-package with scroll-into-view-if-needed?

[kentcdodds]

Interesting! I've never heard of that before! That is _definitely_ overkill though. I thought about this as a passing idea that would make downshift a little easier to maintain. It's not really a big sticking point for me, and I feel like doing something like that would overcomplicate things...

[stipsan]

Hey guys, just want to let you know that we just introduced a simpler API interface for scroll-into-view-if-needed. Next step is to get rid of amator and reduce bundle size as much as possible 😄

[kentcdodds]

Cool! If you're able to make it small and satisfy the use case we have then I'd love to use it!

[stipsan]

The plan is to replace https://github.com/anvaka/amator with https://github.com/chrisdickinson/raf, that decision was an easy one.
But for letting you control the easing in userland I'm still on the lookout for a minimal library that lets you set a cubic bezier like easing. Best package I've found is https://github.com/arian/cubic-bezier but I'm not sure if it's the way to go.

Speaking of which is animated transitions within your use case or not? If it's not I could publish another file you can import from the package that don't include any animation logic so you don't have to pay the cost 🙂

[kentcdodds]

Yeah! We don't need animations, so if you could make it so I don't have to include that but that would be great!

[stipsan]

ah! Then you don't need to wait for the animation refactor, I'll publish an update for you soon 😄

[stipsan]

Does this look good for your use case? https://github.com/stipsan/scroll-into-view-if-needed/pull/152

Filesize is around 4kB without minifying or gzipping if you import scroll-into-view-if-needed/dist/calculate to avoid the animation dependencies 🙂

Edit

It landed on 3.62kB https://unpkg.com/[email protected]/dist/calculate.js

[kentcdodds]

See the PR for an explanation for why this is closed.