improved image sizes for left/right/center alignment

[mukeshpanchal27]

Overview

Follow-up: #1187
This issue cover calculate sizes for left/right/center alignment.

Approach

For initial work:

• Only return a smaller image size if the content or wide size is larger than the image size.
  • If content size is 620px and content use thumbnail the the size will use thumbnail 150px image size instead of 620px.
• Parse the width value for "px"; for other types( vw, min() ), return the image width according to the default WordPress behaviour.

Core editor issues:

• The image markup is missing default width and height attributes. These attributes are set when the image is resized.
• The Cover block does not add the image width attribute.
  • When adding a new Cover block, it defaults to using the full image size.
  • When adding an Image block, selecting a thumbnail, and transforming it to a Cover block, the thumbnail image is used instead of the full image. There should be an image size attribute in the Cover block to display this information.

[joemcgill]

@mukeshpanchal27 once #1251 is fixed, I think this issue should be updated to focus only on applying a maximum constraint to left/right/center aligned images that are larger than their container.

I'm also unclear about what you mean by:

Parse the width value for "px"; for other types( vw, min() ), return the image width according to the default WordPress behaviour.

Could you clarify?

[ramiy]

Any chance to support start/end for RTL websites?

[joemcgill]

This is now unblocked since #1251 is fixed.

[mukeshpanchal27]

Any chance to support start/end for RTL websites?

@ramiy Could you please share more details where is use in RTL sites so we can explore it? Thanks!

[westonruter]

Any chance to support start/end for RTL websites?

@ramiy Perhaps you're referring to supporting logical properties? So instead having to switch from left to right when switching from LTR to RTL, you can just use start. I'm not sure exactly how this would apply here since WordPress core is is using left and right for the block attribute values. See https://github.com/WordPress/gutenberg/blob/a8501ab1562cfdcd33e342440431b09717f0a9c1/schemas/json/block.json#L234-L255

[mukeshpanchal27]

The PR #1290 has been merged. As we are still discussing start/end for RTL sites, we will close it once that is finalized.

[sstopfer]

If we don't hear back by the end of the week, let's close the ticket. @mukeshpanchal27

[westonruter]

I think the RTL issue is something to be tracked upstream in Gutenberg, for example WordPress/gutenberg#52353

Since Gutenberg doesn't use logical properties, there's nothing we can do here.