Jetpack Tiled Gallery: Square layout aspect ratio

[guarani]

When images are added to the Jetpack Tiled Gallery (and the square layout is selected *), display them as squares, similar how they're displayed on the web.

Related:

• Project issue: Port the Jetpack Tiled Gallery #3874

• At time of writing, the inner block implementation has just been merged (see Jetpack Tiled Gallery: Inner blocks implementation #4000), and we're only focusing on the square layout, so this issue is specific to the square layout.

Tasks

Gutenberg changes

In order to be able to set the image block's aspect ratio via a parent block, the following changes are first necessary in Gutenberg:

• Enable third-party styles to be passed to the image block's shapeStyle prop. Resolved in [RNMobile] Image Block: Enable Parent Blocks to Pass Own Styles to Image's 'ShapeStyle' WordPress/gutenberg#35420.
• Resolve conflict with the core gallery block. The gallery block is currently forcing a fixed height for any parent blocks using a context, which will prevent parent blocks from setting custom styles. Resolved in [RNMobile] Refactor Fixed Height Styling for Gallery Block WordPress/gutenberg#36013.

Aspect ratio

When the above Gutenberg changes have been shipped, it'll be possible for any parent block to set the image block's aspect ratio:

• Set aspect ratio via Tiled Gallery block. Pending review in Tiled Gallery Block: Aspect Ratio for Square Layout #4017.

[guarani]

👋 Hi @SiobhyB, I just realized this is assigned to me but based on your work in #4017, I changed the assignment to you. Please let me know if you think otherwise 👍