Revert "Aligning comments acrossing PHP and JS and making sure they'r…

…e clearer."

This reverts commit 863d9ae.

lib/block-supports/typography.php

@@ -462,7 +462,7 @@ function gutenberg_get_typography_font_size_value( $preset, $should_use_fluid_ty
 	$default_minimum_viewport_width   = '768px';
 	$default_minimum_font_size_factor = 0.75;
 	$default_scale_factor             = 1;
-	$default_minimum_font_size_limit  = '16px';
+	$default_minimum_font_size_limit  = '14px';
 
 	// Font sizes.
 	$fluid_font_size_settings = isset( $preset['fluid'] ) ? $preset['fluid'] : null;
@@ -492,7 +492,7 @@ function gutenberg_get_typography_font_size_value( $preset, $should_use_fluid_ty
 		)
 	);
 
-	// Enforce lower bound font size if a font size has not explicitly set a min and/or a max value.
+	// Don't enforce minimum font size if a font size has explicitly set a min and max value.
 	if ( ! empty( $minimum_font_size_limit ) && ( ! $minimum_font_size_raw && ! $maximum_font_size_raw ) ) {
 		/*
 		 * If a minimum size was not passed to this function
@@ -510,13 +510,13 @@ function gutenberg_get_typography_font_size_value( $preset, $should_use_fluid_ty
 	}
 
 	/*
-	 * If no fluid min font size is provided, create one using
+	 * If no minimumFontSize is provided, create one using
 	 * the given font size multiplied by the min font size scale factor.
 	 */
 	if ( ! $minimum_font_size_raw ) {
 		$calculated_minimum_font_size = round( $preferred_size['value'] * $default_minimum_font_size_factor, 3 );
 
-		// Only use calculated min font size if it is greater that the minimum font size limit.
+		// Only use calculated min font size if it's > $minimum_font_size_limit value.
 		if ( ! empty( $minimum_font_size_limit ) && $calculated_minimum_font_size <= $minimum_font_size_limit['value'] ) {
 			$minimum_font_size_raw = $minimum_font_size_limit['value'] . $minimum_font_size_limit['unit'];
 		} else {

packages/block-editor/README.md

@@ -400,10 +400,9 @@ _Returns_
 Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
 font size OR a single font size can be specified.
 
-If a single font size is specified, it is scaled down by
-minimumFontSizeFactor to arrive at the minimum font size.
-
-The incoming `fontSize` value is used for the maximum font size value.
+If a single font size is specified, it is scaled up and down by
+minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and
+maximum sizes.
 
 _Usage_
 

packages/block-editor/src/components/font-sizes/fluid-utils.js

@@ -9,16 +9,15 @@ const DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';
 const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';
 const DEFAULT_SCALE_FACTOR = 1;
 const DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;
-const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '16px';
+const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
 
 /**
  * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
  * font size OR a single font size can be specified.
  *
- * If a single font size is specified, it is scaled down by
- * minimumFontSizeFactor to arrive at the minimum font size.
- *
- * The incoming `fontSize` value is used for the maximum font size value.
+ * If a single font size is specified, it is scaled up and down by
+ * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and
+ * maximum sizes.
  *
  * @example
  * ```js
@@ -75,7 +74,7 @@ export function getComputedFluidTypographyValue( {
 			}
 		);
 
-		// Enforce lower bound font size if a font size has not explicitly set a min and/or a max value.
+		// Don't enforce minimum font size if a font size has explicitly set a min and max value.
 		if (
 			!! minimumFontSizeLimitParsed?.value &&
 			! minimumFontSize &&
@@ -97,7 +96,7 @@ export function getComputedFluidTypographyValue( {
 		}
 
 		/*
-		 * If no fluid min font size is provided, create one using
+		 * If no minimumFontSize is provided, create one using
 		 * the given font size multiplied by the min font size scale factor.
 		 */
 		if ( ! minimumFontSize ) {
@@ -106,7 +105,7 @@ export function getComputedFluidTypographyValue( {
 				3
 			);
 
-			// Only use calculated min font size if it is greater that the minimum font size limit.
+			// Only use calculated min font size if it's > $minimum_font_size_limit value.
 			if (
 				!! minimumFontSizeLimitParsed?.value &&
 				calculatedMinimumFontSize < minimumFontSizeLimitParsed?.value
@@ -121,10 +120,8 @@ export function getComputedFluidTypographyValue( {
 	// Grab the minimum font size and normalize it in order to use the value for calculations.
 	const minimumFontSizeParsed = getTypographyValueAndUnit( minimumFontSize );
 
-	/*
-	 * We get a 'preferred' unit to keep units consistent when calculating,
-	 * otherwise the result will not be accurate.
-	 */
+	// We get a 'preferred' unit to keep units consistent when calculating,
+	// otherwise the result will not be accurate.
 	const fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';
 
 	// Grabs the maximum font size and normalize it in order to use the value for calculations.

packages/block-editor/src/components/font-sizes/test/fluid-utils.js

@@ -67,14 +67,14 @@ describe( 'getComputedFluidTypographyValue()', () => {
 		);
 	} );
 
-	it( 'should return a fluid font size and apply lower bound when given a min and max font size factor', () => {
+	it( 'should return a fluid font size when given a min and max font size factor', () => {
 		const fluidTypographyValues = getComputedFluidTypographyValue( {
 			fontSize: '30px',
 			minimumFontSizeFactor: '0.5',
 			maximumFontSizeFactor: '2',
 		} );
 		expect( fluidTypographyValues ).toBe(
-			'clamp(16px, 1rem + ((1vw - 7.68px) * 1.683), 30px)'
+			'clamp(15px, 0.938rem + ((1vw - 7.68px) * 1.803), 30px)'
 		);
 	} );
 

packages/edit-site/src/components/global-styles/test/typography-utils.js

@@ -215,12 +215,12 @@ describe( 'typography utils', () => {
 				message:
 					'returns value when size is equal to lower bounds and no fluid min/max set',
 				preset: {
-					size: '16px',
+					size: '14px',
 				},
 				typographySettings: {
 					fluid: true,
 				},
-				expected: '16px',
+				expected: '14px',
 			},
 
 			{
@@ -304,7 +304,7 @@ describe( 'typography utils', () => {
 
 			{
 				message:
-					'should apply lower bound test when only fluid max is set',
+					'should not apply lower bound test when only fluid max is set',
 				preset: {
 					size: '0.875rem',
 					fluid: {
@@ -315,7 +315,7 @@ describe( 'typography utils', () => {
 					fluid: true,
 				},
 				expected:
-					'clamp(1rem, 1rem + ((1vw - 0.48rem) * 36.538), 20rem)',
+					'clamp(0.875rem, 0.875rem + ((1vw - 0.48rem) * 36.779), 20rem)',
 			},
 
 			{

phpunit/block-supports/typography-test.php

@@ -466,10 +466,10 @@ public function data_generate_font_size_preset_fixtures() {
 
 			'returns value when size is equal to lower bounds and no fluid min/max set' => array(
 				'font_size'                   => array(
-					'size' => '16px',
+					'size' => '14px',
 				),
 				'should_use_fluid_typography' => true,
-				'expected_output'             => '16px',
+				'expected_output'             => '14px',
 			),
 
 			'returns clamp value with different min max units' => array(
@@ -529,15 +529,15 @@ public function data_generate_font_size_preset_fixtures() {
 				'expected_output'             => 'clamp(12px, 0.75rem + ((1vw - 7.68px) * 0.962), 20px)',
 			),
 
-			'should apply lower bound test when only fluid max is set' => array(
+			'should not apply lower bound test when only fluid max is set' => array(
 				'font_size'                   => array(
 					'size'  => '0.875rem',
 					'fluid' => array(
 						'max' => '20rem',
 					),
 				),
 				'should_use_fluid_typography' => true,
-				'expected_output'             => 'clamp(1rem, 1rem + ((1vw - 0.48rem) * 36.538), 20rem)',
+				'expected_output'             => 'clamp(0.875rem, 0.875rem + ((1vw - 0.48rem) * 36.779), 20rem)',
 			),
 
 			'returns clamp value when min and max font sizes are equal' => array(
@@ -698,7 +698,7 @@ public function data_generate_replace_inline_font_styles_with_fluid_values_fixtu
 				'block_content'               => '<p class="has-medium-font-size" style="    font-size:   20px   ;    ">A paragraph inside a group</p>',
 				'font_size_value'             => '20px',
 				'should_use_fluid_typography' => true,
-				'expected_output'             => '<p class="has-medium-font-size" style="    font-size:clamp(16px, 1rem + ((1vw - 7.68px) * 0.481), 20px);    ">A paragraph inside a group</p>',
+				'expected_output'             => '<p class="has-medium-font-size" style="    font-size:clamp(15px, 0.938rem + ((1vw - 7.68px) * 0.601), 20px);    ">A paragraph inside a group</p>',
 			),
 			'return_content_with_first_match_replace_only' => array(
 				'block_content'               => "<div class=\"wp-block-group\" style=\"font-size:1.5em\"> \n \n<p style=\"font-size:1.5em\">A paragraph inside a group</p></div>",