Hello! We recreated our Component Library with Modes and Variables. Unfortunately when I wanna use my components in working file (Libraries are added to File) some components aren’t appearing by switching the modes. It seems to have issues with nested components and changing properties with modes when a component variant is “reloaded/lazy loaded”. Works only fine for the first mode. It’s a massive issue now since we aren’t able to work properly.
First I thought it has to do with hidden component (we are using _parts oftentimes) but even after publishing the part component it doesn’t work.
Are there anybody with the same issue and a solution? Seems like a bug for me
Hi @Denise_Hagenow, Thanks for reaching out and sharing those screenshots with us!
I’m checking internally to see if there are related reports, but without seeing the actual file, it’s a bit challenging for us.
If possible, could you please share a video recording of the issue switching the modes?
Make sure to include the whole window, with the properties and layers panels in view, and expand the relevant layer and select any layers you’re having trouble with, that would be super helpful for us to check any relevant settings.
Additionally, could you please share screenshots of the related variants you’re using for changing modes and those applied to the nested instance?
We use these videos and screenshots to try and reproduce the issue in our own files, so showing all the steps needed to reproduce the behavior is very helpful.
Hope to hear from you soon! If there’s anything I misunderstood, please let me know.
Also, if anyone in our community has any insights or suggestions, feel free to jump in!
Hello @Junko3 thanks for responding quickly. I reported this as a bug via the contact form as well and since I was asked to share the files, I invited support-share@figma.com to our libraries and the example working file. Do you have access to that? Otherwise I could do a screen recording.
Hi @Denise_Hagenow, Thank you for submitting a ticket regarding this issue! I’ve located your ticket (#980935) in our system.
We truly appreciate you sharing the files with support-share@figma.com. If you could kindly double-check to make sure they’ve been added as an Editor. No need to worry, it won’t affect your billing in any way.
I also noticed that the direct links to the related files seems not included in your ticket. Could you please send those direct links through the ticket? This would enable our support team to take a more detailed look!
Moreover, it would be really helpful if you could share a video recording of the issue as you switch modes within the ticket.
This will assist our support team in reproducing the issue and investigating the cause.
Hi. Is there any solution here? I’ve been encountering exactly the same problem where my component instances have missing/hidden layers. The missing layers are usually a property binded to a variable. Like @Denise_Hagenow , it only appears once I detach that property from a variable or I switch modes. Most of the time, when I reload my page, the layers disappear again. Hoping for a response. Thanks!
Hi @Patricia_Ibasco, Thank you for bringing this to our attention!
In order to better support you, we would like to see details of the affected files. Therefore, I have gone ahead and created a support ticket on your behalf. The ticket number assigned is #1073162. Please respond directly to the ticket with the requested information.
Thank you for your understanding and cooperation in this matter!
See demo file (the nested property issue is described at the end)
In another prod file that I can’t share with much more complex structure this goes as far as locking the content and not allowing to override a nested text layer.
This is now three different bugs I have found with bound variables. Such a mess.
Hi there! Thanks for getting in touch. It’s really great that you sent that file our way – we appreciate it.
I’ve gone ahead and shared your case with our team internally, and it looks like what you’re experiencing might be tied to a bug we’re already looking into.
I totally get that this can be frustrating, and sorry for any inconvenience this has caused you.
While we can’t offer an immediate fix right now, but our engineering team knows about the issue and will work on finding a solution in the future.
Your understanding and patience in the meantime mean a lot to us.
Following. Our team is experiencing the same issue : elements are not displayed in a template when switching between variables modes when our component is called first and our user-segment variable modified second.
PS : It seems to be mostly the first mode that is buggy (out of three user-segments) in our file and don’t display the header component inside the template that is bound to multiple modes also.
Our team is also experiencing the same issue. Any updates? @Junko3
I have the main component: Button Group.
I have a Desktop variant and a Mobile variant. I can switch between desktop and mobile and it retains the text value.
I want to use Button Group in a Status Message component.
I added it to the Status Message component.
I created a text string variable for button group (breakpoints/buttons/button group) for button group to switch to the mobile variant if a mobile mode is being used. I.e. When mobile size semantics are used, switch to “mobile” variant for button group.
I attached the new variable to the button group instance.
Now when I add “mobile” semantics to the section, I try and drag the component over, however it does not retain the text string value.
Hello there, I regret to inform you that there are no updates to share at this time.
Thank you for providing the details. In this case, by sharing the relevant file with our technical quality team, they will be able to take a closer look at your file(s). You can do so by submitting a bug report via this link: https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001744374
When submitting, please remember to include the following details:
Your Figma account email
Recordings or screenshots of the issue, capturing the full Figma screen with the left and right-hand panels
The URLs of the affected file and any related library files; add support-share@figma.com as an editor of those files (this will not affect your billing)
I truly appreciate your assistance and understanding!