Currently, Figma’s Plugin API provides extensive capabilities for creating, updating, and managing design tokens through variables. However, there is no direct method to programmatically sort these variables within the Variables panel. The ability to sort variables is crucial for maintaining organized and easily navigable collections, especially as the number of variables grows in complex design systems.
While styles in Figma offer a moveLocal*After method that allows developers to reorder them programmatically, there is no equivalent functionality for variables. Implementing this feature would greatly enhance the utility of the Plugin API, aligning it with existing features available for styles and improving workflow automation for developers and designers alike.
Proposed Feature
- API Method: Introduce a method similar to
moveLocal*Afterfor variables, such asmoveVariableAfter(variableId: string, afterVariableId: string): void. - Functionality: This method would allow developers to programmatically reorder variables within a collection by specifying the position of a variable relative to another. This would facilitate sorting variables alphabetically, by usage frequency, or any other custom logic, directly from a plugin.
- Use Cases:
- Alphabetical Sorting: Automatically sort variables alphabetically within a collection for easier navigation.
- Custom Sorting Logic: Implement custom sorting based on naming conventions, usage, or other criteria.
- Consistency Across Projects: Ensure consistent variable order across different Figma files or projects when using the same design system.
Benefits
- Improved Organization: Keeping variables sorted and organized within collections would enhance usability and efficiency in managing design systems.
- Consistency: Ensure a consistent variable order across different files, especially when using shared libraries.
- Enhanced Automation: Enable more advanced automation workflows within plugins, reducing the need for manual reordering in the UI.