Change to Previous State (Interactive Components)

I’m working on a component that consists of three different “expanded” states and a “collapsed” state shared by all three.

Ideally, the “collapsed” state would remember which “Expanded” state triggered it and revert to that state when the expand/collapse trigger is toggled. Am I correct that that’s currently not possible with interactive components?

If so, I’m guessing the only way to achieve what I’m after is to create each “Expanded” state as its own interactive component with a paired “collapse” state, then combine those three components into a set.

Depending on your use case, it is possible by showing/hiding elements in your instances. Here is a quick proof of concept you can duplicate to your drafts. Figma

However, the “show/hide” technique I used isn’t considered best practice. It can bloat components and hurt performance. The best practice is what you described: grouping three separate components into a single variant set.

I just wanted to show you both options so you can choose what works best for your use case.

Thanks! I see what you mean about the bloat with that solution. I’ll use the three component options for now, but I hope Figma adds something along the lines of Change to: Previous State in the future.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.