Resizing properties logic using Placeholders

[malta]

Hi community! Hope you all are doing ok.

Does anybody know what is Figma’s logic when changing a Placeholder with a component?

Context: I have a Card component variant set which a few of these variants have a Placeholder auto layout to enable users to replace with whatever they want.

But as I try to change it with a different component it overrides its resizing properties and does not carry the component properties:

In this example, my Button has Hug - Hug property but this is not being reflected since my Placeholder has Fill - Fill. The weird thing is that this doesn’t happen with all components.

Can anyone help me with this? Maybe I am missing something…

[Nate_G]

@malta When I’ve built out Placeholders/Slots, one thing I found as key is using auto layout for the main component and any elements I will be swapping in (all using hug x hug).

→ Get Example File

[malta]

Hey, Nate! Thank you so much for your help. I really appreciate how you organized the file to answer my question. Amazing!

Do you know if there is any way to have that behavior using Fixed x Fixed properties? I would like only the placeholder to carry the component properties and the card to remain the same size.

[Nate_G]

@malta So you want the card to always remain the same size (width & height), but then swap in content that “Fills” the placeholder area?

[malta]

Yes but with the content preserving its “original” properties. Currently, when I try to replace it, it’s carrying the placeholder properties, not the component.

Does it make sense? I know it might sound confusing

[Nate_G]

In that case, you don’t need auto layout applied to your card.

[malta]

Got it! In this case I think the best option is leaving the Placeholder without auto layout.

I was thinking it would be better to usage applying an auto layout but it seems that it works better without.

Thank you so much, Nate!