@wordpress/block-editor 11.3.3 → 11.4.0

package/src/hooks/typography.js

@@ -2,68 +2,38 @@
  * WordPress dependencies
  */
 import { getBlockSupport, hasBlockSupport } from '@wordpress/blocks';
-import { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
+import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import InspectorControls from '../components/inspector-controls';
-import { getFontAppearanceLabel } from '../components/font-appearance-control';
-
-import {
-	LINE_HEIGHT_SUPPORT_KEY,
-	LineHeightEdit,
-	hasLineHeightValue,
-	resetLineHeight,
-	useIsLineHeightDisabled,
-} from './line-height';
-import {
-	FONT_STYLE_SUPPORT_KEY,
-	FONT_WEIGHT_SUPPORT_KEY,
-	FontAppearanceEdit,
-	hasFontAppearanceValue,
-	resetFontAppearance,
-	useIsFontAppearanceDisabled,
-	useIsFontStyleDisabled,
-	useIsFontWeightDisabled,
-} from './font-appearance';
-import {
-	FONT_FAMILY_SUPPORT_KEY,
-	FontFamilyEdit,
-	hasFontFamilyValue,
-	resetFontFamily,
-	useIsFontFamilyDisabled,
-} from './font-family';
-import {
-	FONT_SIZE_SUPPORT_KEY,
-	FontSizeEdit,
-	hasFontSizeValue,
-	resetFontSize,
-	useIsFontSizeDisabled,
-} from './font-size';
-import {
-	TEXT_DECORATION_SUPPORT_KEY,
-	TextDecorationEdit,
-	hasTextDecorationValue,
-	resetTextDecoration,
-	useIsTextDecorationDisabled,
-} from './text-decoration';
 import {
-	TEXT_TRANSFORM_SUPPORT_KEY,
-	TextTransformEdit,
-	hasTextTransformValue,
-	resetTextTransform,
-	useIsTextTransformDisabled,
-} from './text-transform';
+	default as StylesTypographyPanel,
+	useHasTypographyPanel,
+} from '../components/global-styles/typography-panel';
+
+import { LINE_HEIGHT_SUPPORT_KEY } from './line-height';
+import { FONT_FAMILY_SUPPORT_KEY } from './font-family';
+import { FONT_SIZE_SUPPORT_KEY } from './font-size';
+import { useSetting } from '../components';
+import { cleanEmptyObject } from './utils';
 import {
-	LETTER_SPACING_SUPPORT_KEY,
-	LetterSpacingEdit,
-	hasLetterSpacingValue,
-	resetLetterSpacing,
-	useIsLetterSpacingDisabled,
-} from './letter-spacing';
+	overrideSettingsWithSupports,
+	useSupportedStyles,
+} from '../components/global-styles/hooks';
+
+function omit( object, keys ) {
+	return Object.fromEntries(
+		Object.entries( object ).filter( ( [ key ] ) => ! keys.includes( key ) )
+	);
+}
 
+const LETTER_SPACING_SUPPORT_KEY = 'typography.__experimentalLetterSpacing';
+const TEXT_TRANSFORM_SUPPORT_KEY = 'typography.__experimentalTextTransform';
+const TEXT_DECORATION_SUPPORT_KEY = 'typography.__experimentalTextDecoration';
+const FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle';
+const FONT_WEIGHT_SUPPORT_KEY = 'typography.__experimentalFontWeight';
 export const TYPOGRAPHY_SUPPORT_KEY = 'typography';
 export const TYPOGRAPHY_SUPPORT_KEYS = [
 	LINE_HEIGHT_SUPPORT_KEY,
@@ -76,159 +46,124 @@ export const TYPOGRAPHY_SUPPORT_KEYS = [
 	LETTER_SPACING_SUPPORT_KEY,
 ];
 
-export function TypographyPanel( props ) {
-	const { clientId } = props;
-	const isFontFamilyDisabled = useIsFontFamilyDisabled( props );
-	const isFontSizeDisabled = useIsFontSizeDisabled( props );
-	const isFontAppearanceDisabled = useIsFontAppearanceDisabled( props );
-	const isLineHeightDisabled = useIsLineHeightDisabled( props );
-	const isTextDecorationDisabled = useIsTextDecorationDisabled( props );
-	const isTextTransformDisabled = useIsTextTransformDisabled( props );
-	const isLetterSpacingDisabled = useIsLetterSpacingDisabled( props );
+function TypographyInspectorControl( { children } ) {
+	return (
+		<InspectorControls group="typography">{ children }</InspectorControls>
+	);
+}
 
-	const hasFontStyles = ! useIsFontStyleDisabled( props );
-	const hasFontWeights = ! useIsFontWeightDisabled( props );
+function useBlockSettings( name ) {
+	const fontFamilies = useSetting( 'typography.fontFamilies' );
+	const fontSizes = useSetting( 'typography.fontSizes' );
+	const customFontSize = useSetting( 'typography.customFontSize' );
+	const fontStyle = useSetting( 'typography.fontStyle' );
+	const fontWeight = useSetting( 'typography.fontWeight' );
+	const lineHeight = useSetting( 'typography.lineHeight' );
+	const textDecoration = useSetting( 'typography.textDecoration' );
+	const textTransform = useSetting( 'typography.textTransform' );
+	const letterSpacing = useSetting( 'typography.letterSpacing' );
+	const supports = useSupportedStyles( name, null );
 
-	const isDisabled = useIsTypographyDisabled( props );
-	const isSupported = hasTypographySupport( props.name );
+	return useMemo( () => {
+		const rawSettings = {
+			typography: {
+				fontFamilies: {
+					custom: fontFamilies,
+				},
+				fontSizes: {
+					custom: fontSizes,
+				},
+				customFontSize,
+				fontStyle,
+				fontWeight,
+				lineHeight,
+				textDecoration,
+				textTransform,
+				letterSpacing,
+			},
+		};
+		return overrideSettingsWithSupports( rawSettings, supports );
+	}, [
+		fontFamilies,
+		fontSizes,
+		customFontSize,
+		fontStyle,
+		fontWeight,
+		lineHeight,
+		textDecoration,
+		textTransform,
+		letterSpacing,
+		supports,
+	] );
+}
 
-	if ( isDisabled || ! isSupported ) return null;
+export function TypographyPanel( {
+	clientId,
+	name,
+	attributes,
+	setAttributes,
+} ) {
+	const settings = useBlockSettings( name );
+	const isEnabled = useHasTypographyPanel( settings );
+	const value = useMemo( () => {
+		return {
+			...attributes.style,
+			typography: {
+				...attributes.style?.typography,
+				fontFamily: attributes.fontFamily
+					? 'var:preset|font-family|' + attributes.fontFamily
+					: undefined,
+				fontSize: attributes.fontSize
+					? 'var:preset|font-size|' + attributes.fontSize
+					: attributes.style?.typography?.fontSize,
+			},
+		};
+	}, [ attributes.style, attributes.fontSize, attributes.fontFamily ] );
 
-	const defaultControls = getBlockSupport( props.name, [
+	const onChange = ( newStyle ) => {
+		const updatedStyle = { ...omit( newStyle, [ 'fontFamily' ] ) };
+		const fontSizeValue = newStyle?.typography?.fontSize;
+		const fontFamilyValue = newStyle?.typography?.fontFamily;
+		const fontSizeSlug = fontSizeValue?.startsWith(
+			'var:preset|font-size|'
+		)
+			? fontSizeValue.substring( 'var:preset|font-size|'.length )
+			: undefined;
+		const fontFamilySlug = fontFamilyValue?.startsWith(
+			'var:preset|font-family|'
+		)
+			? fontFamilyValue.substring( 'var:preset|font-family|'.length )
+			: undefined;
+		updatedStyle.typography = {
+			...omit( updatedStyle.typography, [ 'fontFamily' ] ),
+			fontSize: fontSizeSlug ? undefined : fontSizeValue,
+		};
+		setAttributes( {
+			style: cleanEmptyObject( updatedStyle ),
+			fontFamily: fontFamilySlug,
+			fontSize: fontSizeSlug,
+		} );
+	};
+
+	if ( ! isEnabled ) {
+		return null;
+	}
+
+	const defaultControls = getBlockSupport( name, [
 		TYPOGRAPHY_SUPPORT_KEY,
 		'__experimentalDefaultControls',
 	] );
 
-	const createResetAllFilter = ( attribute ) => ( newAttributes ) => ( {
-		...newAttributes,
-		style: {
-			...newAttributes.style,
-			typography: {
-				...newAttributes.style?.typography,
-				[ attribute ]: undefined,
-			},
-		},
-	} );
-
 	return (
-		<InspectorControls group="typography">
-			{ ! isFontFamilyDisabled && (
-				<ToolsPanelItem
-					hasValue={ () => hasFontFamilyValue( props ) }
-					label={ __( 'Font family' ) }
-					onDeselect={ () => resetFontFamily( props ) }
-					isShownByDefault={ defaultControls?.fontFamily }
-					resetAllFilter={ ( newAttributes ) => ( {
-						...newAttributes,
-						fontFamily: undefined,
-					} ) }
-					panelId={ clientId }
-				>
-					<FontFamilyEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isFontSizeDisabled && (
-				<ToolsPanelItem
-					hasValue={ () => hasFontSizeValue( props ) }
-					/* translators: Ensure translation is distinct from "Letter case" */
-					label={ __( 'Font size' ) }
-					onDeselect={ () => resetFontSize( props ) }
-					isShownByDefault={ defaultControls?.fontSize }
-					resetAllFilter={ ( newAttributes ) => ( {
-						...newAttributes,
-						fontSize: undefined,
-						style: {
-							...newAttributes.style,
-							typography: {
-								...newAttributes.style?.typography,
-								fontSize: undefined,
-							},
-						},
-					} ) }
-					panelId={ clientId }
-				>
-					<FontSizeEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isFontAppearanceDisabled && (
-				<ToolsPanelItem
-					className="single-column"
-					hasValue={ () => hasFontAppearanceValue( props ) }
-					label={ getFontAppearanceLabel(
-						hasFontStyles,
-						hasFontWeights
-					) }
-					onDeselect={ () => resetFontAppearance( props ) }
-					isShownByDefault={ defaultControls?.fontAppearance }
-					resetAllFilter={ ( newAttributes ) => ( {
-						...newAttributes,
-						style: {
-							...newAttributes.style,
-							typography: {
-								...newAttributes.style?.typography,
-								fontStyle: undefined,
-								fontWeight: undefined,
-							},
-						},
-					} ) }
-					panelId={ clientId }
-				>
-					<FontAppearanceEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isLineHeightDisabled && (
-				<ToolsPanelItem
-					className="single-column"
-					hasValue={ () => hasLineHeightValue( props ) }
-					label={ __( 'Line height' ) }
-					onDeselect={ () => resetLineHeight( props ) }
-					isShownByDefault={ defaultControls?.lineHeight }
-					resetAllFilter={ createResetAllFilter( 'lineHeight' ) }
-					panelId={ clientId }
-				>
-					<LineHeightEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isLetterSpacingDisabled && (
-				<ToolsPanelItem
-					className="single-column"
-					hasValue={ () => hasLetterSpacingValue( props ) }
-					label={ __( 'Letter spacing' ) }
-					onDeselect={ () => resetLetterSpacing( props ) }
-					isShownByDefault={ defaultControls?.letterSpacing }
-					resetAllFilter={ createResetAllFilter( 'letterSpacing' ) }
-					panelId={ clientId }
-				>
-					<LetterSpacingEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isTextDecorationDisabled && (
-				<ToolsPanelItem
-					className="single-column"
-					hasValue={ () => hasTextDecorationValue( props ) }
-					label={ __( 'Decoration' ) }
-					onDeselect={ () => resetTextDecoration( props ) }
-					isShownByDefault={ defaultControls?.textDecoration }
-					resetAllFilter={ createResetAllFilter( 'textDecoration' ) }
-					panelId={ clientId }
-				>
-					<TextDecorationEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-			{ ! isTextTransformDisabled && (
-				<ToolsPanelItem
-					hasValue={ () => hasTextTransformValue( props ) }
-					/* translators: Ensure translation is distinct from "Font size" */
-					label={ __( 'Letter case' ) }
-					onDeselect={ () => resetTextTransform( props ) }
-					isShownByDefault={ defaultControls?.textTransform }
-					resetAllFilter={ createResetAllFilter( 'textTransform' ) }
-					panelId={ clientId }
-				>
-					<TextTransformEdit { ...props } />
-				</ToolsPanelItem>
-			) }
-		</InspectorControls>
+		<StylesTypographyPanel
+			as={ TypographyInspectorControl }
+			panelId={ clientId }
+			name={ name }
+			settings={ settings }
+			value={ value }
+			onChange={ onChange }
+			defaultControls={ defaultControls }
+		/>
 	);
 }
 
@@ -237,17 +172,3 @@ export const hasTypographySupport = ( blockName ) => {
 		hasBlockSupport( blockName, key )
 	);
 };
-
-function useIsTypographyDisabled( props = {} ) {
-	const configs = [
-		useIsFontAppearanceDisabled( props ),
-		useIsFontSizeDisabled( props ),
-		useIsLineHeightDisabled( props ),
-		useIsFontFamilyDisabled( props ),
-		useIsTextDecorationDisabled( props ),
-		useIsTextTransformDisabled( props ),
-		useIsLetterSpacingDisabled( props ),
-	];
-
-	return configs.filter( Boolean ).length === configs.length;
-}

package/src/private-apis.js

@@ -5,6 +5,7 @@ import * as globalStyles from './components/global-styles';
 import { ExperimentalBlockEditorProvider } from './components/provider';
 import { lock } from './lock-unlock';
 import OffCanvasEditor from './components/off-canvas-editor';
+import LeafMoreMenu from './components/off-canvas-editor/leaf-more-menu';
 
 /**
  * Private @wordpress/block-editor APIs.
@@ -13,5 +14,6 @@ export const privateApis = {};
 lock( privateApis, {
 	...globalStyles,
 	ExperimentalBlockEditorProvider,
+	LeafMoreMenu,
 	OffCanvasEditor,
 } );

package/src/store/selectors.js

@@ -55,6 +55,17 @@ const MILLISECONDS_PER_WEEK = 7 * 24 * 3600 * 1000;
  */
 const EMPTY_ARRAY = [];
 
+/**
+ * Shared reference to an empty Set for cases where it is important to avoid
+ * returning a new Set reference on every invocation, as in a connected or
+ * other pure component which performs `shouldComponentUpdate` check on props.
+ * This should be used as a last resort, since the normalized data should be
+ * maintained by the reducer result in state.
+ *
+ * @type {Set}
+ */
+const EMPTY_SET = new Set();
+
 /**
  * Returns a block's name given its client ID, or null if no block exists with
  * the client ID.
@@ -2722,11 +2733,15 @@ export function isBlockVisible( state, clientId ) {
  */
 export const __unstableGetVisibleBlocks = createSelector(
 	( state ) => {
-		return new Set(
+		const visibleBlocks = new Set(
 			Object.keys( state.blockVisibility ).filter(
 				( key ) => state.blockVisibility[ key ]
 			)
 		);
+		if ( visibleBlocks.size === 0 ) {
+			return EMPTY_SET;
+		}
+		return visibleBlocks;
 	},
 	( state ) => [ state.blockVisibility ]
 );

package/build/hooks/font-appearance.js

@@ -1,188 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FONT_WEIGHT_SUPPORT_KEY = exports.FONT_STYLE_SUPPORT_KEY = void 0;
-exports.FontAppearanceEdit = FontAppearanceEdit;
-exports.hasFontAppearanceValue = hasFontAppearanceValue;
-exports.resetFontAppearance = resetFontAppearance;
-exports.useIsFontAppearanceDisabled = useIsFontAppearanceDisabled;
-exports.useIsFontStyleDisabled = useIsFontStyleDisabled;
-exports.useIsFontWeightDisabled = useIsFontWeightDisabled;
-
-var _element = require("@wordpress/element");
-
-var _blocks = require("@wordpress/blocks");
-
-var _fontAppearanceControl = _interopRequireDefault(require("../components/font-appearance-control"));
-
-var _useSetting = _interopRequireDefault(require("../components/use-setting"));
-
-var _utils = require("./utils");
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-/**
- * Key within block settings' support array indicating support for font style.
- */
-const FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle';
-/**
- * Key within block settings' support array indicating support for font weight.
- */
-
-exports.FONT_STYLE_SUPPORT_KEY = FONT_STYLE_SUPPORT_KEY;
-const FONT_WEIGHT_SUPPORT_KEY = 'typography.__experimentalFontWeight';
-/**
- * Inspector control panel containing the font appearance options.
- *
- * @param {Object} props Block properties.
- *
- * @return {WPElement} Font appearance edit element.
- */
-
-exports.FONT_WEIGHT_SUPPORT_KEY = FONT_WEIGHT_SUPPORT_KEY;
-
-function FontAppearanceEdit(props) {
-  var _style$typography, _style$typography2;
-
-  const {
-    attributes: {
-      style
-    },
-    setAttributes
-  } = props;
-  const hasFontStyles = !useIsFontStyleDisabled(props);
-  const hasFontWeights = !useIsFontWeightDisabled(props);
-
-  const onChange = newStyles => {
-    setAttributes({
-      style: (0, _utils.cleanEmptyObject)({ ...style,
-        typography: { ...(style === null || style === void 0 ? void 0 : style.typography),
-          fontStyle: newStyles.fontStyle,
-          fontWeight: newStyles.fontWeight
-        }
-      })
-    });
-  };
-
-  const fontStyle = style === null || style === void 0 ? void 0 : (_style$typography = style.typography) === null || _style$typography === void 0 ? void 0 : _style$typography.fontStyle;
-  const fontWeight = style === null || style === void 0 ? void 0 : (_style$typography2 = style.typography) === null || _style$typography2 === void 0 ? void 0 : _style$typography2.fontWeight;
-  return (0, _element.createElement)(_fontAppearanceControl.default, {
-    onChange: onChange,
-    hasFontStyles: hasFontStyles,
-    hasFontWeights: hasFontWeights,
-    value: {
-      fontStyle,
-      fontWeight
-    },
-    size: "__unstable-large"
-  });
-}
-/**
- * Checks if font style support has been disabled either by not opting in for
- * support or by failing to provide preset styles.
- *
- * @param {Object} props      Block properties.
- * @param {string} props.name Name for the block type.
- *
- * @return {boolean} Whether font style support has been disabled.
- */
-
-
-function useIsFontStyleDisabled() {
-  let {
-    name: blockName
-  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  const styleSupport = (0, _blocks.hasBlockSupport)(blockName, FONT_STYLE_SUPPORT_KEY);
-  const hasFontStyles = (0, _useSetting.default)('typography.fontStyle');
-  return !styleSupport || !hasFontStyles;
-}
-/**
- * Checks if font weight support has been disabled either by not opting in for
- * support or by failing to provide preset weights.
- *
- * @param {Object} props      Block properties.
- * @param {string} props.name Name for the block type.
- *
- * @return {boolean} Whether font weight support has been disabled.
- */
-
-
-function useIsFontWeightDisabled() {
-  let {
-    name: blockName
-  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  const weightSupport = (0, _blocks.hasBlockSupport)(blockName, FONT_WEIGHT_SUPPORT_KEY);
-  const hasFontWeights = (0, _useSetting.default)('typography.fontWeight');
-  return !weightSupport || !hasFontWeights;
-}
-/**
- * Checks if font appearance support has been disabled.
- *
- * @param {Object} props Block properties.
- *
- * @return {boolean} Whether font appearance support has been disabled.
- */
-
-
-function useIsFontAppearanceDisabled(props) {
-  const stylesDisabled = useIsFontStyleDisabled(props);
-  const weightsDisabled = useIsFontWeightDisabled(props);
-  return stylesDisabled && weightsDisabled;
-}
-/**
- * Checks if there is either a font style or weight value set within the
- * typography styles.
- *
- * @param {Object} props Block props.
- * @return {boolean}     Whether or not the block has a font style or weight.
- */
-
-
-function hasFontAppearanceValue(props) {
-  var _props$attributes$sty;
-
-  const {
-    fontStyle,
-    fontWeight
-  } = ((_props$attributes$sty = props.attributes.style) === null || _props$attributes$sty === void 0 ? void 0 : _props$attributes$sty.typography) || {};
-  return !!fontStyle || !!fontWeight;
-}
-/**
- * Resets the font style and weight block support attributes. This can be used
- * when disabling the font appearance support controls for a block via a
- * progressive discovery panel.
- *
- * @param {Object} props               Block props.
- * @param {Object} props.attributes    Block's attributes.
- * @param {Object} props.setAttributes Function to set block's attributes.
- */
-
-
-function resetFontAppearance(_ref) {
-  let {
-    attributes = {},
-    setAttributes
-  } = _ref;
-  const {
-    style
-  } = attributes;
-  setAttributes({
-    style: (0, _utils.cleanEmptyObject)({ ...style,
-      typography: { ...(style === null || style === void 0 ? void 0 : style.typography),
-        fontStyle: undefined,
-        fontWeight: undefined
-      }
-    })
-  });
-}
-//# sourceMappingURL=font-appearance.js.map

package/build/hooks/font-appearance.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-editor/src/hooks/font-appearance.js"],"names":["FONT_STYLE_SUPPORT_KEY","FONT_WEIGHT_SUPPORT_KEY","FontAppearanceEdit","props","attributes","style","setAttributes","hasFontStyles","useIsFontStyleDisabled","hasFontWeights","useIsFontWeightDisabled","onChange","newStyles","typography","fontStyle","fontWeight","name","blockName","styleSupport","weightSupport","useIsFontAppearanceDisabled","stylesDisabled","weightsDisabled","hasFontAppearanceValue","resetFontAppearance","undefined"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { hasBlockSupport } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport FontAppearanceControl from '../components/font-appearance-control';\nimport useSetting from '../components/use-setting';\nimport { cleanEmptyObject } from './utils';\n\n/**\n * Key within block settings' support array indicating support for font style.\n */\nexport const FONT_STYLE_SUPPORT_KEY = 'typography.__experimentalFontStyle';\n\n/**\n * Key within block settings' support array indicating support for font weight.\n */\nexport const FONT_WEIGHT_SUPPORT_KEY = 'typography.__experimentalFontWeight';\n\n/**\n * Inspector control panel containing the font appearance options.\n *\n * @param {Object} props Block properties.\n *\n * @return {WPElement} Font appearance edit element.\n */\nexport function FontAppearanceEdit( props ) {\n\tconst {\n\t\tattributes: { style },\n\t\tsetAttributes,\n\t} = props;\n\n\tconst hasFontStyles = ! useIsFontStyleDisabled( props );\n\tconst hasFontWeights = ! useIsFontWeightDisabled( props );\n\n\tconst onChange = ( newStyles ) => {\n\t\tsetAttributes( {\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...style,\n\t\t\t\ttypography: {\n\t\t\t\t\t...style?.typography,\n\t\t\t\t\tfontStyle: newStyles.fontStyle,\n\t\t\t\t\tfontWeight: newStyles.fontWeight,\n\t\t\t\t},\n\t\t\t} ),\n\t\t} );\n\t};\n\n\tconst fontStyle = style?.typography?.fontStyle;\n\tconst fontWeight = style?.typography?.fontWeight;\n\n\treturn (\n\t\t<FontAppearanceControl\n\t\t\tonChange={ onChange }\n\t\t\thasFontStyles={ hasFontStyles }\n\t\t\thasFontWeights={ hasFontWeights }\n\t\t\tvalue={ { fontStyle, fontWeight } }\n\t\t\tsize=\"__unstable-large\"\n\t\t/>\n\t);\n}\n\n/**\n * Checks if font style support has been disabled either by not opting in for\n * support or by failing to provide preset styles.\n *\n * @param {Object} props      Block properties.\n * @param {string} props.name Name for the block type.\n *\n * @return {boolean} Whether font style support has been disabled.\n */\nexport function useIsFontStyleDisabled( { name: blockName } = {} ) {\n\tconst styleSupport = hasBlockSupport( blockName, FONT_STYLE_SUPPORT_KEY );\n\tconst hasFontStyles = useSetting( 'typography.fontStyle' );\n\n\treturn ! styleSupport || ! hasFontStyles;\n}\n\n/**\n * Checks if font weight support has been disabled either by not opting in for\n * support or by failing to provide preset weights.\n *\n * @param {Object} props      Block properties.\n * @param {string} props.name Name for the block type.\n *\n * @return {boolean} Whether font weight support has been disabled.\n */\nexport function useIsFontWeightDisabled( { name: blockName } = {} ) {\n\tconst weightSupport = hasBlockSupport( blockName, FONT_WEIGHT_SUPPORT_KEY );\n\tconst hasFontWeights = useSetting( 'typography.fontWeight' );\n\n\treturn ! weightSupport || ! hasFontWeights;\n}\n\n/**\n * Checks if font appearance support has been disabled.\n *\n * @param {Object} props Block properties.\n *\n * @return {boolean} Whether font appearance support has been disabled.\n */\nexport function useIsFontAppearanceDisabled( props ) {\n\tconst stylesDisabled = useIsFontStyleDisabled( props );\n\tconst weightsDisabled = useIsFontWeightDisabled( props );\n\n\treturn stylesDisabled && weightsDisabled;\n}\n\n/**\n * Checks if there is either a font style or weight value set within the\n * typography styles.\n *\n * @param {Object} props Block props.\n * @return {boolean}     Whether or not the block has a font style or weight.\n */\nexport function hasFontAppearanceValue( props ) {\n\tconst { fontStyle, fontWeight } = props.attributes.style?.typography || {};\n\treturn !! fontStyle || !! fontWeight;\n}\n\n/**\n * Resets the font style and weight block support attributes. This can be used\n * when disabling the font appearance support controls for a block via a\n * progressive discovery panel.\n *\n * @param {Object} props               Block props.\n * @param {Object} props.attributes    Block's attributes.\n * @param {Object} props.setAttributes Function to set block's attributes.\n */\nexport function resetFontAppearance( { attributes = {}, setAttributes } ) {\n\tconst { style } = attributes;\n\n\tsetAttributes( {\n\t\tstyle: cleanEmptyObject( {\n\t\t\t...style,\n\t\t\ttypography: {\n\t\t\t\t...style?.typography,\n\t\t\t\tfontStyle: undefined,\n\t\t\t\tfontWeight: undefined,\n\t\t\t},\n\t\t} ),\n\t} );\n}\n"]}