Reset 'clicked' instances on new frames

Dear Community, I’m stuck on the following.

I created a component for a dropdown menu. When dragging multiple instances onto the same frame, they function well independently in Present mode.

However, when adding instances onto a new frame, the instances inherit the dropdown selections from the previous frame, instead of resetting to default.

Preview | Design File

Is there a reason why the ‘clicked’ state of an instance is retained?

Apologies if this is a rookie question, I’m still quite new to Figma.

Appreciate your support!

So you want two pages with dropdown on it?

The problem is that right now, the first page works correctly but when the second page appears, it inherits the selected options from the first page?

How are you making the dropdown? Using components and variants?

Hi William, appreciate your quick note!

That is the problem, correct.

And indeed, I have a variant that is made up of the different button / selection components.

Have you tried creating a new page and then dragging a new dropdown component onto it to see if it works? I.e. Connect a brand new third page as a test.

Thanks William.

Do you mean dragging a new instance of the dropdown component from the Assets menu on the side? If so, yes, I tried that. Whether I duplicate the instance on canvas or drag a new instance from the Assets panel, same result.

You have to do it a different way to get what you want. I think (I might be wrong) that each component has a state in a prototype hence why it’s saved even when you click to different art boards.

I would try to do it in another way by either:

  • Making a new dropdown component (duplicate what you already have)
  • Or making a new Figma page and linking from one page to another

Let me know if it works as I’m curious too…