Sort variants alphabetically (ascending/descending)

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

I’m creating variants of online merchants logos and need a effective way to organize them alphabetically (not removing them from the variant and adding them back in order - that would be time consuming). These variants are linked to several projects, so the library will constantly need updating. See screenshots

Screen Shot 2022-02-24 at 12.57.03 PM

Does anyone have a solution for this - plugin, figma update etc? Thanks in advance!

2 Likes

But the issue with this is if the components are already being using on another file then if we do break and combine the components again, we’ll have to replace everything or double-check it all over again.

We need this feature for organizing a design system!

1 Like

This would be super useful! I’m spending a fair bit of time ordering them manually at the moment, and then as I add new variants I have to go reshuffle it all.

Thank you good sir.

Anyone else missing the powerful sorting from the old variants panel?
Sorting values in the new variant property panel is an irritating pain compared to this and takes forever. Was hoping that it will get noticed and fixed/reverted by now, but hey.
Such productivity!

2 Likes

hi guys!!

any news?

Running into this frequently and honestly all they’d have to do is make the order match the variant order that’s already in the component.
Screen Shot 2022-08-19 at 3.23.11 PM

There are plenty of plugins to auto sort layers but for whatever reason the variant menu is different, requiring a manual reorder.

Screen Shot 2022-08-19 at 3.23.03 PM

Screen Shot 2022-08-19 at 3.23.42 PM

Which is mostly fine for smaller components but annoying to say the least to have to do every time and not feasible for larger more complex variant sets.

I also don’t count breaking the component to get it resorted as a “solution” since I’d literally have to re link all of the instances.

2 Likes

I’ve tried this and it does not work unfortunately.

I’ve created a plugin to search variant by name.
Yet, the plugin is under reviewing by Figma team and I hope it will be approved to publish soon
Screen record of the plugin

So we are still waiting for a solution to this? I have to add new icons and it is a mess, unless I do it manually which is time consuming. :frowning:

1 Like

I’m desperate. I need this feature!

1 Like

The worst way to make flags mate

Ok, do you have a better idea?

I’d make each one of them as a single component. This way my users will be able to lookup an asset they need. And this is the best practice from Figma itself, fairly obvious though :rofl:

The problem with single components here is, to hold additional meta data like in my case, ISO codes. So far there is no reasonable solution for this in Figma.

My current solution for it looks like this:

image
I’m not happy with that.

I think I found the hack :slightly_smiling_face:

If you rename a variant field two times in a row, the values are reordered.
It worked on figma desktop on my mac (did not check into the browser)

@S_e_b_a_s_t_i_a_n @Rebekka_Karrengarn you just need to rename Country into Country2 and then name it back to Country

Normaly this is safe and should not break anything too, right @Ilya_Ivanov ?

5 Likes

It works Stephane, you are a genius! thanks.

3 Likes