Use the .clone() method on the ComponentNode inside the ComponentSetNode and then use appendChild to insert into the ComponentSetNode or create a new component with figma.createComponent() and then appendChild to the ComponentSetNode.

Hi, thanks for your answer, but you haven’t answered all my questions.

I read the developer documentation and understand that it is not allowed to add component properties of type “VARIANT”.

I have also tried to create or clone componentNode in componentSetNode, but the problem is that I didn’t find a way to customize the properties so that later I can use a variant of the component by toggling the properties in the side pane.

If you could let me know how to customize the variant properties through the plugin code, I would be very grateful.

Thanks,

I don’t quite understand what problem you are facing.

How to set the properties and value of a variant?

Change the ComponentNode.name property following the pattern: PropertyName=PropertyValue, PropertyName=PropertyValue, …

How to add a component property?

Use addComponentProperty.

How to apply added component property to node in inside ComponentNode?

Store the value (which you got after using addComponentProperty) in a variable and change the componentPropertyReferences property of the desired node.

To be more specific, please share enough information, full code, screenshots/video so that anyone can help you.

Hi, thank you for your answer. It solved my problem!

What I want to do is using plugin code to generate many component variants (say 100), each variant are defined by a group of the properties. For example:

Variant1: shape=box, state=normal, size=normal

Variant2: shape=box, state=hover, size=big

Variant3: shape=box, state=mouse down, size=big

…

Previously I couldn’t find a way to define all those properties. Now I know Figma is parsing the variants’ names to define all the properties, that answered my question!

Thank you!

thankyou so much, this helped!