With the new auto layout (Config 2022) update for some reason my form inputs are messed up

Figma is truly getting inconsistent. Form behaviours seem ok one day. Yet nightmarishly buggy the next. Screenshot here shows that Figma simply refuses to drop down the content auto layout frames. Yet everything and everywhere ~ is already set to hug contents everywhere. Restarted figma, reset browser, still doesn’t work.

I have for the nth time recreating .base variants from scratch, form layouts etc.

I have noticed these bugs and can tolerate in the past ~ by recreating the components which usually solve the issue. But not this time. Figma is getting extremely inconsistent and we’ve lost too many hours unnecessarily troubleshooting on what should have been resolved.

Anyone else having this same problem?? I am also finding the new variants system update completely unintuitive, and adding new properties is now a lot more difficult.

Apologies for venting my frustration. Figma draft project attached.

Capture 2

You are using component properties that are not supported for that behavior.

From component properties documentation:

Warning: It’s important to note that component properties don’t support prototype interactions . If you want to create prototypes with your components, you’ll still need to use variants.

There’s a playground file in there that has this slide:

Klesus

Thank you for clarifying that with me. my frustration however stands that the drop down actually works elsewhere in another layout, yet not anywhere in my current form composition.

I have just recreated all my forms yet another problem persist - I can’t even see the drop down anywhere.

I always thought and could have sworn my form inputs were behaving exactly as intended without me having to worry about figma’s quote on “component properties don’t support prototype interactions”.

And now, for some reason everything is just broken. Worse - Figma simply now refuses to honour Fill to container behaviour on ANYTHING. We’re talking about static states here. See screenshot attached.

This is extremely frustrating as I am forced to troubleshoot for hours on things that should have been resolved by my own hands (and eyes) earlier.

Again, I thank you for any help from anyone.

regards, Andrew.
Buggy

I have spent yet another attempt AT RECREATING ALL atomic base component once again just as proof of bug and error (please refer to the shared figma link) ~ that ALL FORM input drop down hug contents which were previously working in previous figma iterations is for some reason broken and now unable to show the expected automatic “hug contents” we knew all along.

This is beyond frustrating as now anything to do with new form input designs is now Ko’d. It simply refuses to perform that familiar “hug contents”. now as you can see in the screenshot it is now just gobbling up all over the place.

I am close to give up and call it a day. Looks like I have to somehow revert back to another DS iteration manually.

Andrew.

Screen Shot 2022-05-12 at 9.48.56 pm

Is this what you’re trying to do?

1 Like

Yesssss I am having this issue now as well. My components work on the page I create them on, but when I publish the library and go to use them in other docs they are not acting as expected. Set to hug and then if I change from one banner to another that’s a different size the new banner gets all stretched out and misaligned… not great bob.

2 Likes

RizePoint_product,

Your prototype works BEAUTIFUL…at least ~ when it is viewed holistically as a stand alone layout without it managed as a component.

Yet not in my layout…my goal (as with any design system) is to reuse the entire form as a component.

still doesnt work

This is so fundamentally broken. Why is this not raised anywhere with Figma?

UPDATE

Defenitely some sort of bug is happening.

I copied and pasted into the previous composition. DID NOT CHANGE A SINGLE PARAMETER whatsoever - hug contents everywhere ~ and now it works. …

…But as soon as I wanted, as a design & styling decision override ~ for them to stretch horizontally via Fill Container.…everything messes up again.

But DOESNT WORK ~ as soon as FIll Container is set horizontal for streched design decision

I firmly believe this needs to be escalated. Otherwise design decisions are severely limited impacting all projects.

Ahhhh, I missed that you were creating the entire form as a component. In that context, I’m able to replicate the issue.

If I had to guess it’s something to do with how Figma “locks” aspects of component instances that compounds when they’re nested. I agree it’s an issue.