Figma Support Forum

Interactive components not working when nested inside a main component

Hello, I found out that if i create an interactive component (ex: Button), and place it inside a a main component (obsiously as an instance), the interactions are no longer working.
But if you create an instance of the parent component, then it all works as expected.

7 Likes

I ran into the same thing. It looks like a click interaction (on click, mouse down, mouse up, while pressing) will work, but mouse enter / mouse leave / while hovering doesn’t.

Same issue here. I have a dropdown interactive component with the expanded and collapsed state as variants, then I have an instance of that in another component. I initially joined the beta to see if this would solve this, but I guess there are still some bugs to fix :confused:

Partial interaction working for me. I have a button nested in parent component. The mouse-in state triggers, but mouse-leave and on-click are not working. Button component stays in its hover state until I restart the animation with a refresh, etc.

Hi, I think I have a related problem. I created an interactive checkbox with two states. However, when I add it to any layer, the “change to” interaction does not work.


I added the checkbox by dragging the component form the assets tab.
Pretty new to the software and UI Design in generell, so very thankful for any advice.

Same issue here, I noticed that since day one of the beta.

please fix this :green_heart:

Have the same issue, i’m glad I finally realised it wasn’t just me.
This is a an important one to fix. Building a larger library of components this is a must have!

I’m having the same problem. The workaround I found it to break the parent component and paste it onto every frame of the prototype…which is quite time-consuming :stuck_out_tongue:

If there was a multi-state feature within an element, this entire problem would be solved.