For font sizes of < 14px that have no defined minimum sizes, use the …

…font size to set the floor of the clamp() value.

lib/block-supports/typography.php

@@ -453,7 +453,7 @@ function gutenberg_get_typography_font_size_value( $preset, $should_use_fluid_ty
 		return $preset['size'];
 	}
 
-	// Check if fluid font sizes are activated.
+	// Checks if fluid font sizes are activated.
 	$typography_settings         = gutenberg_get_global_settings( array( 'typography' ) );
 	$should_use_fluid_typography = isset( $typography_settings['fluid'] ) && true === $typography_settings['fluid'] ? true : $should_use_fluid_typography;
 
@@ -506,10 +506,10 @@ function gutenberg_get_typography_font_size_value( $preset, $should_use_fluid_ty
 		/*
 		 * If a minimum size was not passed to this function
 		 * and the user-defined font size is lower than $minimum_font_size_limit,
-		 * then do not fluidify.
+		 * then uses the user-defined font size as the minimum font-size.
 		 */
 		if ( ! isset( $fluid_font_size_settings['min'] ) && $preferred_size['value'] < $minimum_font_size_limit['value'] ) {
-			return $preset['size'];
+			$minimum_font_size_raw = implode( '', $preferred_size );
 		} else {
 			$minimum_font_size_parsed = gutenberg_get_typography_value_and_unit(
 				$minimum_font_size_raw,

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

@@ -93,27 +93,35 @@ export function getComputedFluidTypographyValue( {
 		);
 
 		if ( !! minimumFontSizeLimitParsed?.value ) {
+			/*
+			 * If a minimum size was not passed to this function
+			 * and the user-defined font size is lower than $minimum_font_size_limit,
+			 * then uses the user-defined font size as the minimum font-size.
+			 */
 			if (
 				! minimumFontSize &&
 				fontSizeParsed?.value < minimumFontSizeLimitParsed?.value
 			) {
-				return null;
-			}
-			const minimumFontSizeParsed = getTypographyValueAndUnit(
-				minimumFontSizeValue,
-				{
-					coerceTo: fontSizeParsed.unit,
+				minimumFontSizeValue = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;
+			} else {
+				const minimumFontSizeParsed = getTypographyValueAndUnit(
+					minimumFontSizeValue,
+					{
+						coerceTo: fontSizeParsed.unit,
+					}
+				);
+
+				/*
+				 * Otherwise, if the passed or calculated minimum font size is lower than $minimum_font_size_limit
+				 * use $minimum_font_size_limit instead.
+				 */
+				if (
+					!! minimumFontSizeParsed?.value &&
+					minimumFontSizeParsed.value <
+						minimumFontSizeLimitParsed.value
+				) {
+					minimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;
 				}
-			);
-			/*
-			 * Otherwise, if the passed or calculated minimum font size is lower than $minimum_font_size_limit
-			 * use $minimum_font_size_limit instead.
-			 */
-			if (
-				!! minimumFontSizeParsed?.value &&
-				minimumFontSizeParsed.value < minimumFontSizeLimitParsed.value
-			) {
-				minimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;
 			}
 		}
 

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

@@ -191,14 +191,15 @@ describe( 'typography utils', () => {
 
 			{
 				message:
-					'return size where no min is give and size is less than default min size.',
+					'return clamped using font size where no min is given and size is less than default min size.',
 				preset: {
 					size: '3px',
 				},
 				typographySettings: {
 					fluid: true,
 				},
-				expected: '3px',
+				expected:
+					'clamp(3px, 0.188rem + ((1vw - 7.68px) * 0.18), 4.5px)',
 			},
 
 			{

phpunit/block-supports/typography-test.php

@@ -448,12 +448,12 @@ public function data_generate_font_size_preset_fixtures() {
 				'expected_output'             => '10em',
 			),
 
-			'return_size_where_no_min_is_given_and_less_than_default_min_size' => array(
+			'return_clamped_size_where_no_min_is_given_and_less_than_default_min_size' => array(
 				'font_size'                   => array(
 					'size' => '3px',
 				),
 				'should_use_fluid_typography' => true,
-				'expected_output'             => '3px',
+				'expected_output'             => 'clamp(3px, 0.188rem + ((1vw - 7.68px) * 0.18), 4.5px)',
 			),
 
 			'return_fluid_clamp_value_with_different_min_max_units' => array(