Skip to main content

We have a “Media” component in our design system which assigns the aspect ratio to a property. 

Properties

Aspect Ratio: 1:1 | 5:4 | 4:3 | 3:2 | 16:9 | 2:1 | 21:9

Orientation: Horizontal | Vertical

 

When we create an instance of this component, resizing works and the aspect ratio remains locked. Using the Aspect Ratio property works as expected. However, if the component is resized, then the Aspect Ratio property seems to break. It will make the instance resize to an arbitrary aspect ratio based on the width of the instance and the height of the variant for said property. If you simply click the edge or a corner as if to resize it, the instance updates to the appropriate aspect ratio.

Oh so I am not the only one surprised by this ?! It looks like a bug to be honest. I was excited to see the Aspect Ratio property being released for this use case! But somehow I can’t make it work properly with Instance swapping of a Media component with different aspect ratios. I get the exact same behavior as what you describe here, did you find a workaround?


Reply