Simple variants are breaking

[Melina_Rozenfeld]

Having problems with components that contain icons in our design system library.
It’s happening in basic components such buttons and other more complex, but they all have variants with and without icon (icon=on, icon=off).

After swapping the icon in a component for a different icon, the toggle no longer works. So basically the variant “breaks”. Once the icon is hidden, the toggle stops working and can’t show the icon again.

We tested resetting the variants to the base and doing the overrides again, rebuilding the base and swapping it in the variants, etc.
The only way we could get it to work was by rebuilding the base from scratch and the entire variant again. Since we have a very large design system, doing this for our entire component set will be time consuming and wasteful.

Please note that:
-The library was created more than a month ago and everything was woking fine up until now.
-There were no changes made to these components in the last weeks.
-We have tried testing in other files, other pages, same problem persists.
-The components facing the issue don’t have a lot of variants, it happens with simple buttons.
-No figma updates available

Attaching an example of the problem.

Is someone facing something similar / has a workaround it?

[ElioQoshi]

I am having a similar issue here, but the opposite, not being able to toggle the icon off. I never noticed this issue like you said. Not sure why this is happening, but it’s definitely problematic.

[Galia_Ugolnikova]

Hi, Melina! Had the same issue for the last 2 weeks with icons in buttons. What worked for us - we wrapped all the icons with autolayout. But it is for sure some kind of bug. Hope this will work for you. Cheers

[Melina_Rozenfeld]

Thank you!
What worked for us, in the end, was removing the base component. When we started building our library we used bases, and after a lot of exploring we saw that detaching the base from the component was solving the issue.