Skip to main content
Question

Can't use conditional interaction inside interactive component

Jake_Moore1

I’ve created this inline editable text component with for variant states: Default, Hover, Open, and Filled.

Int-Comp-Var

I’m trying to use variables and a conditional to decide whether clicking the hover state should change the component to the Open or Filled state. You can see the logic in the screenshot above.

However, I’m unable to set different states of the component. The If and Else are tied together. I can change the state inside Else, but that also changes the state in the If to match it. And changing the state inside If has no effect. It always mirrors what’s in Else.

2 replies

Angel_Claudio

Thanks, still having the same issue as well.

Angel_Claudio

Not sure if this is a solution for you, but Figma sent me a workaround recently via email that didn’t work, so I had to implement the following workaround:

The following is my update, I’m unsuccessful with the workaround on child components, no matter where I create the change to, I can never create two that don’t mimic each other.

My fix was the following:

  1. I made a copy of my main component (instead of working with a child component).

  2. Since the main component you see the variant with the arrows going to and from in prototype design, I simply set the variable of interest the value I wanted depending on whether or not the variant was visible.

The con of course, is that I will have to make a copy of the main component and do step #2 every time I have a particular variable I’m trying to flip on and off, so basically my assets will have all these one offs instead of 1 asset I can keep reusing and modifying with a conditional statement.

Reply


Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings