Hello,
In this topic i posted a demo example i created few days ago about this bug.
Curiorus thing is that in the same file i have a faulty interactive icon, and another one that is working properlly.
Both share exactly the same configuration and hieriarchy
Take a look:
This has been the behavior before component props also. It’s now just simpler to switch out the instance. The simplest way to work around it is to implement an icon component that uses the actual icon instance as a mask, and covers the icon frame with a rectangle fill which is then used to change the actual color of the icon. Then you just expose the internal icon as an instance property and it should work.
Adding my 2 cents, that it’s indeed a recursion bug from before. We don’t want to go back to the union hack days. Means a lot of files need adjusting. We can’t switch to the new props with this bug unfortunately.
I’m experiencing the same issue while experimenting with the new component properties together with variants: I noticed that swapping the icon instance before changing the variant doesn’t change the icon’s color as expected, while if I first change the variant (where the icon has a different color) then I change the icon, it will keep the color used in the variant. That’s weird, it seems like a bug to me.
Same, discovered this when converting my button component. I tried the playground like @jussivir did and found the same problem. The old variant-based component switched colors just fine when switching states.
Maybe it’s unrelated or an issue with the Material Icon library, but I also noticed that if you use 1 instance swap instead of 2, only the first will carry over the color defined in the variant when switched, while the other reverts to the original color:
ok, i’ve just read the help article on properties and that’s not how the program is behaving at all.
can’t apply parent-created properties to nested layers;
can’t create text property from nested text layer;
can’t create boolean property from nested component instance.