Skip to main content
Solved

Unexpected Behavior with Nested Component Interactions in Prototype Mode

  • September 18, 2023
  • 5 replies
  • 815 views

Alexander_Simone

I’ve recently encountered an unusual behavior in Figma while working with nested components that have interactive prototyping involved. To better demonstrate the issue, I’ve created a short video.

Here’s a brief rundown:

  1. I created a Component with a gray rectangle.
  2. I then made a Variant of this component, altering its height and changing its color to red.
  3. Using the Prototype feature, I linked the two variants to switch upon interaction.
  4. I turned an instance of this combined component into a new component.
  5. Instances of this new component exhibit inconsistent behavior in Preview mode. Specifically, the color changes on interaction, but not the height, unless the parent component is also interacted with.

My understanding is that instances should behave independently during preview unless their parent component is modified in design mode. I’m wondering if anyone else has experienced this or if there’s something I might be overlooking?

Any insights or suggestions would be greatly appreciated!

Thank you in advance for your help!

Best answer by Celine_

Hi Alexander!
After further investigation, this looks like a long-standing bug and our engineers are aware of ‌this. I’ll go ahead and add your encounter with this issue to our ongoing bug report. While I can’t guarantee an ETA on a fix, I can bubble this up with our engineering team for some more visibility at the very least.

Thanks again for your thoughts and patience in the interim!

If you do want to stay up to date with the latest update in Figma, please keep an eye on our Release Notes: figma.com/fr/release-notes/?context=confirmLocalePref

View original
This topic has been closed for comments

5 replies

Rich_Smith

I’m also experiencing odd/inconsistent nested component variant changes in prototypes, and I submitted a bug report. I use state changes for navigation components often, so it’s causing a lot of issues for my team and I.


Celine_
Figmate
  • Community Support
  • 3532 replies
  • Answer
  • September 26, 2023

Hi Alexander!
After further investigation, this looks like a long-standing bug and our engineers are aware of ‌this. I’ll go ahead and add your encounter with this issue to our ongoing bug report. While I can’t guarantee an ETA on a fix, I can bubble this up with our engineering team for some more visibility at the very least.

Thanks again for your thoughts and patience in the interim!

If you do want to stay up to date with the latest update in Figma, please keep an eye on our Release Notes: figma.com/fr/release-notes/?context=confirmLocalePref


Celine_
Figmate
  • Community Support
  • 3532 replies
  • September 26, 2023

Hi @Rich_Smith ,
I saw in our back end that our support team helped you to solve your issue. Glad it’s been solved!
For visibility to the community (if this can help), it appears that once “Reset component state” is applied to the interaction both to and from the modal, the issue is resolved and the prototype behaves as expected for your issue.


Alexis_Kraus

I think I am having a similar issue to Alexander. Should I ask support for help?


Khanisorn

I get the same issue. I don’t know how to call it. but please Dev use Dependency Injection technique to manage with nested component in Figma.


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