Today I found an interesting mechanic in the plugins API that I want to share with you. I work with components a lot building my plugin Master and to check whether the instance is of the correct component I usually used the following:
if (instance.mainComponent === component)
Where instance is InstanceNode and component is some ComponentNode I got from somewhere. However, today I found that is not always true for library components! I tried creating a component, publishing it and creating an instance of it in another file. Then I changed the component, published changes and created another instance without updating the previous one. If you simply compare the main components of these instances, they will be different and they will also have different IDs, which are local to this file and are completely different from their IDs in the library.
So turns out Figma stores a main component in the file somewhere, in the hidden storage. This also happens when you import a component — Figma stores the latest version of the component somewhere in the file.
This nuance is important when searching for components for example. In my case I was searching for all instances in which instance.mainComponent === component but it didn’t give any results for the previous versions of this component. So if I want to find all instances of the component no matter the version, I would need to instead search by component key: instance.mainComponent.key === component.key. It’s unique to every component and no matter the version, it will be the same for both hidden local versions of the library component.
Feel free to ask questions here, I’ll be glad to help — it’s a bit hard to describe this all.