WP_Theme_JSON::compute_spacing_sizes() │ private static │ WP 6.6.0

Generates a set of spacing sizes by starting with a medium size and applying an operator with an increment value to generate the rest of the sizes outward from the medium size. The medium slug is '50' with the rest of the slugs being 10 apart. The generated names use t-shirt sizing.

Example:

$spacing_scale = array(
	'steps'      => 4,
	'mediumStep' => 16,
	'unit'       => 'px',
	'operator'   => '+',
	'increment'  => 2,
);
$spacing_sizes = static::compute_spacing_sizes( $spacing_scale );
// -> array(
//        array( 'name' => 'Small',   'slug' => '40', 'size' => '14px' ),
//        array( 'name' => 'Medium',  'slug' => '50', 'size' => '16px' ),
//        array( 'name' => 'Large',   'slug' => '60', 'size' => '18px' ),
//        array( 'name' => 'X-Large', 'slug' => '70', 'size' => '20px' ),
//    )

Method of the class: WP_Theme_JSON{}

No Hooks.

Return

Array. The spacing sizes presets or an empty array if some spacing scale values are missing or invalid.

Usage

$result = WP_Theme_JSON::compute_spacing_sizes( $spacing_scale );

$spacing_scale(array) (required)

The spacing scale values. All are required.

• steps(int)
  The number of steps in the scale. (up to 10 steps are supported.)

• mediumStep(float)
  The middle value that gets the slug '50'. (For even number of steps, this becomes the first middle value.)

• unit(string)
  The CSS unit to use for the sizes.

• operator(string)
  The mathematical operator to apply to generate the other sizes. Either '+' or '*'.

• increment(float)
  The value used with the operator to generate the other sizes.

Changelog

WP_Theme_JSON::compute_spacing_sizes() WP Theme JSON::compute spacing sizes code ^{WP 6.6.2}

private static function compute_spacing_sizes( $spacing_scale ) {
	/*
	 * This condition is intentionally missing some checks on ranges for the values in order to
	 * keep backwards compatibility with the previous implementation.
	 */
	if (
		! isset( $spacing_scale['steps'] ) ||
		! is_numeric( $spacing_scale['steps'] ) ||
		0 === $spacing_scale['steps'] ||
		! isset( $spacing_scale['mediumStep'] ) ||
		! is_numeric( $spacing_scale['mediumStep'] ) ||
		! isset( $spacing_scale['unit'] ) ||
		! isset( $spacing_scale['operator'] ) ||
		( '+' !== $spacing_scale['operator'] && '*' !== $spacing_scale['operator'] ) ||
		! isset( $spacing_scale['increment'] ) ||
		! is_numeric( $spacing_scale['increment'] )
	) {
		return array();
	}

	$unit            = '%' === $spacing_scale['unit'] ? '%' : sanitize_title( $spacing_scale['unit'] );
	$current_step    = $spacing_scale['mediumStep'];
	$steps_mid_point = round( $spacing_scale['steps'] / 2, 0 );
	$x_small_count   = null;
	$below_sizes     = array();
	$slug            = 40;
	$remainder       = 0;

	for ( $below_midpoint_count = $steps_mid_point - 1; $spacing_scale['steps'] > 1 && $slug > 0 && $below_midpoint_count > 0; $below_midpoint_count-- ) {
		if ( '+' === $spacing_scale['operator'] ) {
			$current_step -= $spacing_scale['increment'];
		} elseif ( $spacing_scale['increment'] > 1 ) {
			$current_step /= $spacing_scale['increment'];
		} else {
			$current_step *= $spacing_scale['increment'];
		}

		if ( $current_step <= 0 ) {
			$remainder = $below_midpoint_count;
			break;
		}

		$below_sizes[] = array(
			/* translators: %s: Digit to indicate multiple of sizing, eg. 2X-Small. */
			'name' => $below_midpoint_count === $steps_mid_point - 1 ? __( 'Small' ) : sprintf( __( '%sX-Small' ), (string) $x_small_count ),
			'slug' => (string) $slug,
			'size' => round( $current_step, 2 ) . $unit,
		);

		if ( $below_midpoint_count === $steps_mid_point - 2 ) {
			$x_small_count = 2;
		}

		if ( $below_midpoint_count < $steps_mid_point - 2 ) {
			++$x_small_count;
		}

		$slug -= 10;
	}

	$below_sizes = array_reverse( $below_sizes );

	$below_sizes[] = array(
		'name' => __( 'Medium' ),
		'slug' => '50',
		'size' => $spacing_scale['mediumStep'] . $unit,
	);

	$current_step  = $spacing_scale['mediumStep'];
	$x_large_count = null;
	$above_sizes   = array();
	$slug          = 60;
	$steps_above   = ( $spacing_scale['steps'] - $steps_mid_point ) + $remainder;

	for ( $above_midpoint_count = 0; $above_midpoint_count < $steps_above; $above_midpoint_count++ ) {
		$current_step = '+' === $spacing_scale['operator']
			? $current_step + $spacing_scale['increment']
			: ( $spacing_scale['increment'] >= 1 ? $current_step * $spacing_scale['increment'] : $current_step / $spacing_scale['increment'] );

		$above_sizes[] = array(
			/* translators: %s: Digit to indicate multiple of sizing, eg. 2X-Large. */
			'name' => 0 === $above_midpoint_count ? __( 'Large' ) : sprintf( __( '%sX-Large' ), (string) $x_large_count ),
			'slug' => (string) $slug,
			'size' => round( $current_step, 2 ) . $unit,
		);

		if ( 1 === $above_midpoint_count ) {
			$x_large_count = 2;
		}

		if ( $above_midpoint_count > 1 ) {
			++$x_large_count;
		}

		$slug += 10;
	}

	$spacing_sizes = $below_sizes;
	foreach ( $above_sizes as $above_sizes_item ) {
		$spacing_sizes[] = $above_sizes_item;
	}

	return $spacing_sizes;
}