Adding a "Set Variable" to component instance (CI) interactions doesn't work

[Ammar_Junaid]

I have attached a Boolean variable to a card, for it to only be visible when the my Switch CI (Component Instance) is toggled ON.

In my prototype, I start with the Boolean variable set to false (card not visible), and my switch toggled OFF. When I toggle it ON, the card shows up, but toggling it back OFF doesn’t hide the card.

Here are the settings I am using.

I found a fix for this, by adding the “Set Variable” condition to the Master Component instead of the instance, and it worked, the card would disappear when my switch was off, and vice versa.

But now the issue is, I want to use the same interaction for other elements on other pages. But, if I toggle my switch ON on one page (for example to show all completed transactions on a table), then go to my other page (where that page’s switch is OFF) the card that should be hidden is visible because I changed the variable on the previous page.

Creating more variables doesn’t work either because I’m using the same component to set all these variables.

I think adding these set variable conditions should work on an instance level instead of component level, that way you can use the same component, in as many interaction as you’d like.

I hope my explanation was clear, if not, I’m willing to discuss it further.

[gshbhara]

I have exactly the opposite problem. My set/conditional variable wont work from parent/main components. Also, adding additional interaction for the on pressed event wont work with set variable regardless I use it via Parent or child.

Is this a bug or a feature? Hey Figma team please look into this and let us know if a resolution to this might be feasible.

[Francois_Coucke]

I have the same problem with a checkbox component.
In my Checkbox master component which is a variant (state : default / checked) I added an onClick animation that change default state to checked state.

I don’t want to put any variable in my master component because it is used in many other contexts.

In one instance of my Checkbox component I want to keep the master component’s interactions and also add a variable so that in this specific context the onClick interaction changes the state of the checkbox AND update my “testValue” from 0 to 100 and vice-versa from the checked instance.

The variable actually updates from default to checked (from 0 to 100) however it doesn’t update back from checked to default (from 100 to 0)

When I add the variable of the master component, it works like a charm, but that is definitely not ideal since a “basic” component like a checkbox can be used in a lot of files with many different contexts.

Is there any way to prevent this weird behavior ?

Thanks in advance !