search

formkit / auto-animate

A zero-config, drop-in animation utility that adds smooth transitions to your web app. You can use it with React, Vue, or any other JavaScript application.
https://auto-animate.formkit.com
MIT License
12.86k stars 226 forks source link

feature request: enable only the animations we need #153

Open yojona opened 1 year ago

yojona commented 1 year ago

It would be great to be able to pass the animations we need, like:

useAutoAnimate(['add', 'remove']);

My app uses react-beautiful-dnd and it doesn't work very well with 'remain', so in cases like this when we use other libraries with animations that might interfere with the behavior of the element, this function will be really useful.

yojona commented 1 year ago

I think this #118 is related

drmercer commented 1 year ago

@yojona I use a similar library (dndkit) and solved this issue by disabling autoAnimate while I update the DOM after a dropped drag. It's a little tricky to get right, but it works, and as a nice side-effect, it preserves the "remain" animation when the list order is changing for other reasons.

felipedeboni commented 1 month ago

It would be nice to have a bit more control over it and it's defaults.

Eg.: I want to override just add animation and keep others as default.

In theory we could modify the config to have: onAdd, onRemove, onRemain and if omitted it would pick the defaults for it. Probably solves two things at once, if user pass false to any of these, than it wouldn't animate that action.

wangyinyuan commented 2 weeks ago

So is there any easy way to do this now?

I'm also trying to disable the add and remove animations and just keep the remain default animation.

felipedeboni commented 1 week ago

So is there any easy way to do this now?

I'm also trying to disable the add and remove animations and just keep the remain default animation.

I ended up forking it on our private monorepo and added the callbacks I said earlier, most likely the pull request wasn't going to be accepted so I didn't even tried to make one.