Component instance automatically set to fill with auto-layout

Hey @Ben_Dansby, thanks for the feedback!

We’ll pass this onto our team for future consideration.

Likewise, this’d be really useful.

​@dvaliao Any progress on this? Placing an instance into a container with an autofill and having to make the instance “fill” each time is a waste of time and clicks. If Fill or Hug has been set inside a component (With an autofill), the property should carry over without having to re-set it each time!

Hi ​@djv 
Is this feature live or not?
Our Product Designers noticed it, and it’s becoming a real time-waster for us.
If my button component is set to “hug”, it shouldn’t automatically switch to “fill” when placed inside an auto-layout.

I feel like this is a bigger problem with the introduction of slots. I can use slots to populate my list component, allowing users more control over the amount of rows in a list. However, if I have a inset list, were the width of the nest row component is required to change, any new instances placed retain the original width. I’m unable to set the row width to be ‘Fill’ meaning new instances come in too big

I’m also here because this is an issue when using slots.

Agreed, 100%. Having to set the width to fill each time you insert an instance anywhere is a pain. They need a instance default setting for height and width for all components.

Also, is anyone else feeling like “Community Support” responses have trickled down to zero? It feels like they’re ignoring us now.

This issue is bothering my team also. Did anything happen with this?

Adding my +1 to this.

Hey everyone, Until Figma adds the same functionality they did with Slots, I think you’ll all find this useful.

This solves for automatically make instances width fill by default AND making components actually capable of dragging into tighter spaces.

For a single components:

1. Apply Auto Layout to the component.
2. Wrap the component in a frame and apply Auto Layout to the frame.
3. Inside the frame, set the component’s width to Fill.

For a component sets with variants:

1. Apply Auto Layout to the component.
2. Set each variant to Fill.

Drag instances directly into their target container

Make all components narrower than the containers it will be used in. It may make your component organization look weird, but it works.

Drag instances directly from Assets into the target Auto Layout container. Figma can then recognize the parent and set the instance to Fill container.

Avoid placing the instance on the canvas first and moving it later. Without an Auto Layout parent, Figma assigns a Fixed width, which may remain fixed when moved into another container.