I’ve made a list item component that uses a nested photo component inside it to control the size of profile photo displayed.
The issue I’m having is when I change the variant of the photo component used inside the master component, everything updates just fine. However, when i make an instance of the master component and choose a different variant of the photo component, the photo component’s dimensions do not update, only some of the radius and stroke widths.
I’ve looked to see if there was any restraints such as min/max heights, etc. But I’m not seeing it. I’ve linked the file and a video showing the issue
Unfortunately, it seems that this is a feature limitation where swapping instances or changing variants in nested instances retains the size of the original instances/variants. As a workaround, you can apply auto layout to each variant to get the nested instances to resize accordingly.
Based on your file, I couldn’t access the main component of the photo icon. Could you try adding auto layout to each variant and see if that solves the issue?
To anyone having this problem, wrap the master component being used for nesting in an auto-layout frame set to ‘hug’ contents.
Additionally, if you need the component to have a fixed height and width and not resize based on the parent frame being set to ‘hug’ (such as I did because of it being a fixed size photo), simply set the contents inside the auto-layout to fixed dimensions. This will make the auto-layout ‘hug’ to the right size.
