Situation
I’m using a component with 3 variants (default, hover, filled) as an interactive checkbox, designed in a design system file. There are no interactions in the MPC component in the design system file, only in the prototype file. This component is used on multiple screens in a prototype (a question flow with selectable answers).
Problem
When I click an answer (switching the component to the “filled” variant), that state carries over to the same component instance on the next screen — even though I haven’t interacted with it there. So it should be in default state. Figma appears to remember the variant state globally, not per screen, which breaks the logic of my prototype.
This becomes a serious problem when only one answer should be selected: if all options appear as “selected” due to previous interactions, the user can’t proceed in the flow anymore.
This prototype is being tested on a fairly large scale, so we need reliable behavior. These unintended state carryovers lead to confusion and make the prototype unusable in some cases.
Expected behavior:
Each instance of a component in a prototype should maintain its own interaction state, unless explicitly linked. Or, I’d like a setting to control whether interaction states are global or screen-specific.
Workarounds I’ve tried:
-
Detaching instances (loses design system benefits)
-
Duplicating the component per screen (not scalable)
-
Using overlays to simulate interaction (hacky and limited)
Feature request:
Please add an option to isolate interactive component states per screen/frame in a prototype — or more control over how interaction states persist across screens.
