Hi community!
I’m trying to replicate a appearing and disappearing behaviour inside a component like regular material snackbars.
Here is the testfile with my components and animation:
As you can see in the file I have 3 different snackbar styles as component variants. For the animation I’m using another component with different animation states as variants. My goal is to be able to use this animated snackbar freely when prototyping, being able to override the nested snackbar’s variants and text, with the animation still working.
For some reason, when I override anything within an instance of the animated component, the animation stops working correctly. You can play two different prototypes to see different ‘bugs’. Sometimes the textlabel moves on its own, sometimes transparency doesn’t work as defined in the component. Sometimes the animation doesn’t play at all, after I changed something in the instance, like overriding the text content.
When I leave the nested component untouched, the animation works perfectly fine.
Any ideas?
Greetings, Willi