Skip to main content

Hi, I’m having trouble using “Navigate to” overrides on component variant interactions. I’m trying to make a component where a non-default variant will navigate to a different frame (while the rest just change between the varients).


For example. I have a list that you can navigate up and down with the arrow keys (the arrow keys here are changing the list component between variants of each other. When you press up from the top of the list, it navigates to a new frame, when you press down at the bottom of the list, it navigates to a new frame.


For some reason, this only works for the variant that is set first when starting the prototype (whether the first or last item is selected by default). Is this a bug? As designed? Any workarounds other than having individual frames for each list item being focused?


Figma – 30 Jun 22

Same issue here, it seems that non-default variants still don’t keep track of the navigation they are linked to. Are there any improvements about that or any workaround that might have been found ?

I have the same issue. Specifically when using a drop down menu. I am creating a dashboard with a filter. When the filter is open (variant state) I can’t use the variant to navigate to a new page (filtered state). Instead I have to build the component as two components. That’s the only work around I’ve been able to find so far.

I don’t know if I had the same issue as you, but I intended to use one of the variants of my component to take the user to another frame with the same component ‘in another variant,’ and it wasn’t working either. I noticed that changing the name of the component variant within the second frame made it work. I recommend you give it a try! If you can, please respond letting me know if it worked 🙂

Just tried this before searching. While renaming the layers let me embed different links by swapping to/from different variants, when going back to the default variant and into a prototype, the non-default variant just has no link attached.


It’s weird because even switching to that variant in the file, I can see the link there, just in the prototype it seems to be overriding… Yet, there isn’t any overriding set to reset the component to default. I’m stumped!

I wanna share the solution which was working for me: If you have a dropdown component where the “open state” is a menu with nested components, it helped me to wrap the nested component into an “interaction-helper”-frame which i then could use for prototype “navigate-to” connections within the Design

Reply


Terms & ConditionsCookie settings