[RAC/GridList] framer-motion enter animations not working

[jeffijoe]

Provide a general summary of the issue here

When using <AnimatePresence> with a <GridList>, the items do not animate in as expected.

🤔 Expected Behavior?

Animations should work the same as if using regular HTML elements

😯 Current Behavior

enter animations do not play, they're stuck in their starting state

animations-broken-encoded.mp4

💁 Possible Solution

Not a solution, but it can be partially worked around by applying the animations to a child of the GridListItem, however, when doing so the initial={false} is not respected on AnimatePresence.

I suspect the reason, at least for the issue with the workaround where initial={false} isn't respected, is due to how collections work in React Aria; the items probably aren't rendered in the first render, and when they do render, it won't be the initial one.

🔦 Context

We're trying to animate list items.

🖥️ Steps to Reproduce

I've reproduced this with the latest versions of all packages here: https://codesandbox.io/p/sandbox/condescending-fog-3vkgjk

Version

RAC 1.8.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macOS

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response