Allow enabling custom line heights using theme.json (#25043)

WordPress · Sep 3, 2020 · 829e762 · 829e762
1 parent 97ec77e
commit 829e762
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 19 deletions.
diff --git a/lib/client-assets.php b/lib/client-assets.php
@@ -620,19 +620,6 @@ function gutenberg_extend_block_editor_styles( $settings ) {
 }
 add_filter( 'block_editor_settings', 'gutenberg_extend_block_editor_styles' );
 
-/**
- * Extends block editor settings to determine whether to use custom line height controls.
- *
- * @param array $settings Default editor settings.
- *
- * @return array Filtered editor settings.
- */
-function gutenberg_extend_settings_custom_line_height( $settings ) {
-	$settings['enableCustomLineHeight'] = get_theme_support( 'custom-line-height' );
-	return $settings;
-}
-add_filter( 'block_editor_settings', 'gutenberg_extend_settings_custom_line_height' );
-
 /**
  * Extends block editor settings to determine whether to use custom unit controls.
  * Currently experimental.

diff --git a/lib/experimental-default-theme.json b/lib/experimental-default-theme.json
@@ -136,6 +136,9 @@
 			},
 			"fontSize": {
 				"custom": true
+			},
+			"lineHeight": {
+				"custom": false
 			}
 		}
 	}

diff --git a/lib/global-styles.php b/lib/global-styles.php
@@ -627,6 +627,12 @@ function gutenberg_experimental_global_styles_get_editor_features( $config ) {
 		}
 		$features['global']['fontSize']['custom'] = false;
 	}
+	if ( get_theme_support( 'custom-line-height' ) ) {
+		if ( ! isset( $features['global']['lineHeight'] ) ) {
+			$features['global']['lineHeight'] = array();
+		}
+		$features['global']['lineHeight']['custom'] = true;
+	}
 
 	return $features;
 }
@@ -663,6 +669,7 @@ function gutenberg_experimental_global_styles_settings( $settings ) {
 	unset( $settings['disableCustomColors'] );
 	unset( $settings['disableCustomGradients'] );
 	unset( $settings['disableCustomFontSizes'] );
+	unset( $settings['enableCustomLineHeight'] );
 
 	return $settings;
 }

diff --git a/packages/block-editor/src/components/use-editor-feature/index.js b/packages/block-editor/src/components/use-editor-feature/index.js
@@ -26,6 +26,7 @@ const deprecatedFlags = {
 		settings.disableCustomFontSizes === undefined
 			? undefined
 			: ! settings.disableCustomFontSizes,
+	'lineHeight.custom': ( settings ) => settings.enableCustomLineHeight,
 };
 
 /**

diff --git a/packages/block-editor/src/hooks/line-height.js b/packages/block-editor/src/hooks/line-height.js
@@ -2,13 +2,13 @@
  * WordPress dependencies
  */
 import { hasBlockSupport } from '@wordpress/blocks';
-import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
 import LineHeightControl from '../components/line-height-control';
 import { cleanEmptyObject } from './utils';
+import useEditorFeature from '../components/use-editor-feature';
 
 export const LINE_HEIGHT_SUPPORT_KEY = '__experimentalLineHeight';
 
@@ -56,11 +56,7 @@ export function LineHeightEdit( props ) {
  * @return {boolean} Whether setting is disabled.
  */
 export function useIsLineHeightDisabled( { name: blockName } = {} ) {
-	const isDisabled = useSelect( ( select ) => {
-		const editorSettings = select( 'core/block-editor' ).getSettings();
-
-		return ! editorSettings.enableCustomLineHeight;
-	} );
+	const isDisabled = ! useEditorFeature( 'lineHeight.custom' );
 
 	return (
 		! hasBlockSupport( blockName, LINE_HEIGHT_SUPPORT_KEY ) || isDisabled