@wordpress/block-editor 15.6.1 → 15.7.0

package/src/components/global-styles/typography-panel.js

@@ -9,6 +9,7 @@ import {
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useCallback, useMemo, useEffect } from '@wordpress/element';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
@@ -21,7 +22,7 @@ import TextAlignmentControl from '../text-alignment-control';
 import TextTransformControl from '../text-transform-control';
 import TextDecorationControl from '../text-decoration-control';
 import WritingModeControl from '../writing-mode-control';
-import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
+import { useToolsPanelDropdownMenuProps } from './utils';
 import { setImmutably } from '../../utils/object';
 import {
 	getMergedFontFamiliesAndFontFamilyFaces,

package/src/components/global-styles/typography-utils.js

@@ -1,141 +1,8 @@
-/**
- * The fluid utilities must match the backend equivalent.
- * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php
- * ---------------------------------------------------------------
- */
-
 /**
  * Internal dependencies
  */
-import {
-	getComputedFluidTypographyValue,
-	getTypographyValueAndUnit,
-} from '../font-sizes/fluid-utils';
 import { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';
 
-/**
- * @typedef {Object} FluidPreset
- * @property {string|undefined}  max A maximum font size value.
- * @property {?string|undefined} min A minimum font size value.
- */
-
-/**
- * @typedef {Object} Preset
- * @property {?string|?number}               size  A default font size.
- * @property {string}                        name  A font size name, displayed in the UI.
- * @property {string}                        slug  A font size slug
- * @property {boolean|FluidPreset|undefined} fluid Specifies the minimum and maximum font size value of a fluid font size.
- */
-
-/**
- * @typedef {Object} TypographySettings
- * @property {?string} minViewportWidth  Minimum viewport size from which type will have fluidity. Optional if size is specified.
- * @property {?string} maxViewportWidth  Maximum size up to which type will have fluidity. Optional if size is specified.
- * @property {?number} scaleFactor       A scale factor to determine how fast a font scales within boundaries. Optional.
- * @property {?number} minFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.
- * @property {?string} minFontSize       The smallest a calculated font size may be. Optional.
- */
-
-/**
- * Returns a font-size value based on a given font-size preset.
- * Takes into account fluid typography parameters and attempts to return a css formula depending on available, valid values.
- *
- * The Core PHP equivalent is wp_get_typography_font_size_value().
- *
- * @param {Preset}                     preset
- * @param {Object}                     settings
- * @param {boolean|TypographySettings} settings.typography.fluid  Whether fluid typography is enabled, and, optionally, fluid font size options.
- * @param {?Object}                    settings.typography.layout Layout options.
- *
- * @return {string|*} A font-size value or the value of preset.size.
- */
-export function getTypographyFontSizeValue( preset, settings ) {
-	const { size: defaultSize } = preset;
-
-	/*
-	 * Catch falsy values and 0/'0'. Fluid calculations cannot be performed on `0`.
-	 * Also return early when a preset font size explicitly disables fluid typography with `false`.
-	 */
-	if ( ! defaultSize || '0' === defaultSize || false === preset?.fluid ) {
-		return defaultSize;
-	}
-
-	/*
-	 * Return early when fluid typography is disabled in the settings, and there
-	 * are no local settings to enable it for the individual preset.
-	 *
-	 * If this condition isn't met, either the settings or individual preset settings
-	 * have enabled fluid typography.
-	 */
-	if (
-		! isFluidTypographyEnabled( settings?.typography ) &&
-		! isFluidTypographyEnabled( preset )
-	) {
-		return defaultSize;
-	}
-
-	let fluidTypographySettings =
-		getFluidTypographyOptionsFromSettings( settings );
-	fluidTypographySettings =
-		typeof fluidTypographySettings?.fluid === 'object'
-			? fluidTypographySettings?.fluid
-			: {};
-
-	const fluidFontSizeValue = getComputedFluidTypographyValue( {
-		minimumFontSize: preset?.fluid?.min,
-		maximumFontSize: preset?.fluid?.max,
-		fontSize: defaultSize,
-		minimumFontSizeLimit: fluidTypographySettings?.minFontSize,
-		maximumViewportWidth: fluidTypographySettings?.maxViewportWidth,
-		minimumViewportWidth: fluidTypographySettings?.minViewportWidth,
-	} );
-
-	if ( !! fluidFontSizeValue ) {
-		return fluidFontSizeValue;
-	}
-
-	return defaultSize;
-}
-
-function isFluidTypographyEnabled( typographySettings ) {
-	const fluidSettings = typographySettings?.fluid;
-	return (
-		true === fluidSettings ||
-		( fluidSettings &&
-			typeof fluidSettings === 'object' &&
-			Object.keys( fluidSettings ).length > 0 )
-	);
-}
-
-/**
- * Returns fluid typography settings from theme.json setting object.
- *
- * @param {Object} settings            Theme.json settings
- * @param {Object} settings.typography Theme.json typography settings
- * @param {Object} settings.layout     Theme.json layout settings
- * @return {TypographySettings} Fluid typography settings
- */
-export function getFluidTypographyOptionsFromSettings( settings ) {
-	const typographySettings = settings?.typography;
-	const layoutSettings = settings?.layout;
-	const defaultMaxViewportWidth = getTypographyValueAndUnit(
-		layoutSettings?.wideSize
-	)
-		? layoutSettings?.wideSize
-		: null;
-	return isFluidTypographyEnabled( typographySettings ) &&
-		defaultMaxViewportWidth
-		? {
-				fluid: {
-					maxViewportWidth: defaultMaxViewportWidth,
-					...typographySettings.fluid,
-				},
-		  }
-		: {
-				fluid: typographySettings?.fluid,
-		  };
-}
-
 /**
  * Returns an object of merged font families and the font faces from the selected font family
  * based on the theme.json settings object and the currently selected font family.