Auto-layout is not working on instances still

[kruthi]

I have tried all the mentioned resolutions in the community for similar issue. Still doesn’t work for me. Auto-layout works for main component but doesn’t work for instances.

Scenario: I have a two rectangles, each of them are components indivdually. When I club them and use vertical auto-layout and make this a component, then use an instance of this and try to copy and paste the rectangle, it doesn’t add up to the stack, it just appears on one of the rectangle and comes up as a separate component.
Expectation is for it to add up below the two rectangles.

Here are some screenshots:

Please help, its breaking all components in the design system.
Let me know if any additional information is required.

[Brian_Saunders]

I think you are not understanding how auto layout and components work in Figma. If I am understanding your problem correctly, Figma is behaving like it’s supposed to behave.

[kruthi]

Are you saying the we cannot do anything to instances while using them without detaching them? Trying to add ‘page name’ component here to the instance will not get added to that auto-layout because the main component has only 2 of them?

[kruthi]

Looks like it was a valid ask understanding the components in Figma. For anyone who has the same question as mine, the answer is Figma hasn’t added this feature yet. Here are some links to refer:

Adding elements to component instances

I see this question has been asked before, but I’m wondering if anything has changed (looks like it was last asked in 2022). Say I have a master component containing 4 separate ‘blocks,’ with each block including an icon, body copy and a link. If I instert an instance of that component in my design, I know that I can easily delete one of the blocks and the component will adjust with no issues, but what if I want to add in say a 5th block…are we still unable to do that?

Add items to autolayout in component instances

We often have the problem that we don’t know how many items we should include in a component, for example a toolbar. We often end up adding some hidden extra buttons. This works, but it has some really annoying downsides: We have to guess a good maximum number of items We have to detach if we want to add more We cannot handle separators in a good way, other than adding them everywhere and hiding them It’s way too difficult to reorder items I suggest that autolayouts can have a property that …

[Raphael_M]

Yes. Instance is just a copy of your main component. The most you can do is modify some of its properties, and not add or subtract them.

[kruthi]

Got it. Thanks for confirming!