Hey all hoping someone has a solution to a real headscratcher we stumbled across today.

We’re building out a prototype for testing where we load component instances as overlays. This modal overlay has a number of auto layouts using hug width/height.

These auto layouts work as expected in prototype mode when added to a page. But if we load the component as an overlay the hug height/width breaks:

This is what it looks like on the page in prototype mode:

And this is what the same component looks like when loaded as an overlay:

As you can see many auto-layouts break but only when shown as an overlay:

• List item


• Partner description


• Earn & redeem Points tags


• Special offers heading


• Active competition label

While detaching the component fixes the issue we obviously don’t want to do this because it completely messes with our workflow for updating components.

Has anyone faced this issue before or know of a potential solution?

Thanks!