Bug(?): onExit jumps around when used with a changing css grid container

[mprast]

It looks like the positioning logic react-flip-toolkit is using is having trouble meshing with css grid at points.

Here's a repro!

What I'd expect to see: 'Two!' should stay where it is and fade out
What I did see: 'Two!' jumped to the right before fading out

It looks like elements in a css grid are positioned relative to their grid cell, not the grid container at large (even when they're absolutely positioned). So what I think is going on is that "Two!" in the example above is being positioned further to the right than it should be before onExit() gets called because its grid cell changed position as well.

I'm not sure whether this is a bug, but it was at least surprising behavior to me. On the one hand, my understanding from this issue and others is that onExit() and onAppear() are not designed for situations in which the transitioning element's parent is moved - on the other hand, thinking about grid cells as parents in their own right feels strange to me, since (afaik) they don't correspond to anything in the DOM. It also doesn't feel like changing the layout of cells within a grid container should count as changing the container itself if the container is not repositioned or resized.

If this is indeed a bug, I'm not sure if there's a bulletproof fix that would be guaranteed to not mess with anyone's layout. I did find a workaround, which is to remove all possible css grid styles in the onExit() handler - without grid-column etc. absolute positioning seems to work the way it would with regular divs. In either case it may be helpful to call this out in the docs in case anyone runs into it.

Thanks so much for taking a look!