I like this idea.

The way that we currently deal with things like this is to place a bunch of hidden copies of the components and wrap them in an auto layout so that the container resizes to only the objects that are viewed. Then when we need more rows, tabs, cards, etc. we go to the layers panel and just unhide more.

*Note this approach is still a little problematic because it doesn’t let you rearrange the order like you can do in a detached component. So our work around for this that sometimes works is that when we start by showing/hiding every other copy. It would be nice if we could override auto layout object order without detaching the components.

Here is an example of out Tabs Bar:

Yes, that’s the common way of doing that at the moment.

Regarding moving there is this @Mr.Biscuit plugin that aims to allow you to move/reorganize elements in an instance without detaching it.

PS: I haven’t tried it yet

I was thinking of doing this too, but was afraid of performance issues with so many hidden elements. Although it would be super cool to add new rows that will refresh with placeholder data.

Sadly I can’t use community plugins for work, but this sounds like a great tool.

This 1000%. I use the exact same “solution” and I have the same dilemma of not being able to rearrange order of autolayout children. That kind of override would be a huge improvement.

Thanks Steven, I just installed the Instance Utilis plugin and it worked. It is not perfect because it will revert any component name overrides but it does allow reordering which is super cool. Thanks for the head up on this plugin.

If I can suggest something for tables, don’t make the table itself the variant.

Instead, make the row or column a variant (most commonly rows) that way you can wrap it on a simple auto layout and adjust line positioning. I did this video to explain how I do it. This allows for unlimited table sizes.

Here’s my file: Tables in Figma

Thanks for the suggestions, I have rewritten the entire algorithm and had all the known bugs fixed. Now the plugin performs 5x faster than previous on average.

@Mr.Biscuit

Awesome, I will check it out this afternoon. Thanks for letting creating this plugin and thanks for letting us know about the update.

@Bruno_Figueiredo is there a way to click on the cell and manually change the width or with the cursor, it won’t let me when is an instance of the main component.

One problem with this work-around is that it would be messy for code generation plugins. All those hidden layers would still show up as hidden elements in the resulting code.