Skip to main content

Preserve child variants' properties when switching parent Variant's property


Antoine

Hi,

I’m creating complex and nested variants and I’ve been wondering if the following behavior is a bug or simply how Variants work, in which case I’d like to suggest some improvements.

Demo file to help

Let’s say I have a component, a button, with multiple states that are properties of a single Variant.

Now I have another Variant, in which my button is nested, that also has states (for example, a page with a light and dark version).

If I change the state of my button (child Variant) in an instance of the Page Variant, and then change a property of the parent, the child Variant reverts back to whatever set of properties it has in the master parent Variant.

It would be nice to preserve “overriden” properties of child variants when changing the parent Variant’s properties (if they match).

Hope the situation is clear! Cheers.

4 replies

James_Mitchell

+1

I’m working on form fields/inputs and have the same issue. Can’t think of a suitable workaround. I haven’t created a stripped down version as @Antoine 's is a good example, but here’s my full component structure:

Figma – 17 Mar 21

Of course it would actually have a lot more variants but looking for a good solution going forward before filling it in.


Blair1
  • 6 replies
  • October 11, 2021

Hi folks! Have you found a good workaround for this yet? Trying to do something similar using the Plugin API where I reset an instance’s mainComponent. Even when preserve the variantProperties of that instance, it doesn’t reset the children


  • 0 replies
  • December 16, 2021

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


FigmaIsBad

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings