Initial implementation of improved image `sizes` algorithm

[joemcgill]

Overview

This issue cover adding the first set of enhancement to the auto-sizes plugin, that improve the default image sizes algorithm by constraining the maximum sizes width by layout settings from theme.json and the content width setting in classic themes for default aligned images.

Approach

To kick off this effort, I’ve created a proof of concept implementation, which adds the sizes attribute to images in blocks during the block rendering process, via block render filters. This approach is based on the following initial proposal for new algorithms based on alignment values:

• default: (max-width: contentSize + padding) calc(100vw - padding), contentSize
• wide: (max-width: wideSize + padding) calc(100vw - padding), widesize
• full:
  • With useRootPaddingAwareAlignments: 100vw
  • Without useRootPaddingAwareAlignments: calc(100vw - padding)