Skip to main content

I have two files: my library where I keep all of my components and another file where I’m creating my design. As I was working on my prototype I created my components in my working file instead of the library. So I moved all of the components to my library file. When I play my prototype, there’s a very important part that isn’t working anymore.


How it should work:

As I click in the menu icon, I get this dropdown:

Screen Shot 2022-04-29 at 10.55.35


However, this is not working. When I click on the dropdown menu, nothing happens. This is how I structured my components in the library. As you can see I have hover states for some components:

Screen Shot 2022-04-29 at 10.59.29

Hello Paula,


It does not work because the overlay (= instance of Side Bar Menus component) belongs to your “library” files now. Figma is not yet able to play prototype with elements spread among different pages/files.

You can still solve your probleme by :



  • a) nesting a instance of “Side Bar Menus” into “Sidebar Components” on your library file

  • b) override the menu icon action: “On Click” on your other file to open an instance of Side Bar Menus in the same file

Hey @Haroll Thanks for your reply, but none of the options work 😦

Hi @Paula_Mourad


I’m sorry that didn’t help. Is it possible for you to change a bit your components structures to have all states in your library files?


Here is the working protoype of what is described below: Sidebar nested component example


image


What I did was:



  1. I change your Side Bar Menus component to create a submenu-item instead, with a hover property

  2. In sidebar I kept the state hover and I add a on Click state (triggered by a click on the icon button on far left of sidebar)

    This new state display an autolayout with 4 instances of sidebar menu item


Since the whole component is on the same file, wherever I import sidebar component it worked.


Let me know if this could be a solution for you

Terms & ConditionsCookie settings