Hi, I'd like to drop here a solution if it could help anyone having the same problem.

I use Ani Motion to animate some light effects on my website, particularly on radix components such as Accordion, Navbar, etc. based on the guide that John explained here, which has been working great so far: https://createtodaydigital.notion.site/How-to-animate-Webstudio-using-Ani-Motion-65f798896ae14376b57c9d273dca5109#01f6e49d57334a72a988e14a8deabc6f

I however struggle to animate the Tabs component, in particular when applying the property data-ani to Tab Content, which John also noticed in his guide (screenshot below).

After some time trying in and out, I might happen to find a simple solution that works, it's to wrap all the Tab Content instances into a parent box and apply data-ani-children and data-ani effect to it. I made a quick showcase here for everyone to notice the difference: https://p-cf985f41-e572-4bc8-8789-17e78ef53e43.apps.webstudio.is/?authToken=a4d73283-d7f5-4937-a106-45b5814825c8&mode=preview

I'm not technically skilled enough to explain why it works but it works so I just want to share here to anyone who might bump into the same problem.

What do you think @John Siciliano ? If it's a valid solution for you maybe you can directly update in your guide so other people know how to process?

Btw many thanks for all the content (videos, blog, guide, etc.) you've produced, I enjoy following them and it has helped me tremendously upgrading my skills in Webstudio. You guys are doing a really great job!