@wordpress/edit-site 5.14.0 → 5.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "5.14.0",
+	"version": "5.16.0",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -27,43 +27,43 @@
 	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.37.0",
-		"@wordpress/api-fetch": "^6.34.0",
-		"@wordpress/block-editor": "^12.5.0",
-		"@wordpress/block-library": "^8.14.0",
-		"@wordpress/blocks": "^12.14.0",
-		"@wordpress/commands": "^0.8.0",
-		"@wordpress/components": "^25.3.0",
-		"@wordpress/compose": "^6.14.0",
-		"@wordpress/core-commands": "^0.6.0",
-		"@wordpress/core-data": "^6.14.0",
-		"@wordpress/data": "^9.7.0",
-		"@wordpress/date": "^4.37.0",
-		"@wordpress/deprecated": "^3.37.0",
-		"@wordpress/dom": "^3.37.0",
-		"@wordpress/editor": "^13.14.0",
-		"@wordpress/element": "^5.14.0",
-		"@wordpress/escape-html": "^2.37.0",
-		"@wordpress/hooks": "^3.37.0",
-		"@wordpress/html-entities": "^3.37.0",
-		"@wordpress/i18n": "^4.37.0",
-		"@wordpress/icons": "^9.28.0",
-		"@wordpress/interface": "^5.14.0",
-		"@wordpress/keyboard-shortcuts": "^4.14.0",
-		"@wordpress/keycodes": "^3.37.0",
-		"@wordpress/media-utils": "^4.28.0",
-		"@wordpress/notices": "^4.5.0",
-		"@wordpress/plugins": "^6.5.0",
-		"@wordpress/preferences": "^3.14.0",
-		"@wordpress/primitives": "^3.35.0",
-		"@wordpress/private-apis": "^0.19.0",
-		"@wordpress/reusable-blocks": "^4.14.0",
-		"@wordpress/router": "^0.6.0",
-		"@wordpress/style-engine": "^1.20.0",
-		"@wordpress/url": "^3.38.0",
-		"@wordpress/viewport": "^5.14.0",
-		"@wordpress/widgets": "^3.14.0",
-		"@wordpress/wordcount": "^3.37.0",
+		"@wordpress/a11y": "^3.39.0",
+		"@wordpress/api-fetch": "^6.36.0",
+		"@wordpress/block-editor": "^12.7.0",
+		"@wordpress/block-library": "^8.16.0",
+		"@wordpress/blocks": "^12.16.0",
+		"@wordpress/commands": "^0.10.0",
+		"@wordpress/components": "^25.5.0",
+		"@wordpress/compose": "^6.16.0",
+		"@wordpress/core-commands": "^0.8.0",
+		"@wordpress/core-data": "^6.16.0",
+		"@wordpress/data": "^9.9.0",
+		"@wordpress/date": "^4.39.0",
+		"@wordpress/deprecated": "^3.39.0",
+		"@wordpress/dom": "^3.39.0",
+		"@wordpress/editor": "^13.16.0",
+		"@wordpress/element": "^5.16.0",
+		"@wordpress/escape-html": "^2.39.0",
+		"@wordpress/hooks": "^3.39.0",
+		"@wordpress/html-entities": "^3.39.0",
+		"@wordpress/i18n": "^4.39.0",
+		"@wordpress/icons": "^9.30.0",
+		"@wordpress/interface": "^5.16.0",
+		"@wordpress/keyboard-shortcuts": "^4.16.0",
+		"@wordpress/keycodes": "^3.39.0",
+		"@wordpress/media-utils": "^4.30.0",
+		"@wordpress/notices": "^4.7.0",
+		"@wordpress/plugins": "^6.7.0",
+		"@wordpress/preferences": "^3.16.0",
+		"@wordpress/primitives": "^3.37.0",
+		"@wordpress/private-apis": "^0.21.0",
+		"@wordpress/reusable-blocks": "^4.16.0",
+		"@wordpress/router": "^0.8.0",
+		"@wordpress/style-engine": "^1.22.0",
+		"@wordpress/url": "^3.40.0",
+		"@wordpress/viewport": "^5.16.0",
+		"@wordpress/widgets": "^3.16.0",
+		"@wordpress/wordcount": "^3.39.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.9.2",
@@ -71,7 +71,6 @@
 		"downloadjs": "^1.4.7",
 		"fast-deep-equal": "^3.1.3",
 		"is-plain-object": "^5.0.0",
-		"lodash": "^4.17.21",
 		"memize": "^2.1.0",
 		"react-autosize-textarea": "^7.1.0",
 		"rememo": "^4.0.2",
@@ -84,5 +83,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "bcd13d59b22553b3c9dc5869077bff1e864cf9f5"
+	"gitHead": "b898cf1dc8e70841d1647ea0994ac6278acc18a7"
 }

package/src/components/add-new-page/index.js

@@ -72,9 +72,6 @@ export default function AddNewPageModal( { onSave, onClose } ) {
 			<form onSubmit={ createPage }>
 				<VStack spacing={ 3 }>
 					<TextControl
-						/* eslint-disable jsx-a11y/no-autofocus */
-						autoFocus
-						/* eslint-enable jsx-a11y/no-autofocus */
 						label={ __( 'Page title' ) }
 						onChange={ setTitle }
 						placeholder={ __( 'No title' ) }

package/src/components/add-new-pattern/index.js

@@ -5,6 +5,7 @@ import { DropdownMenu } from '@wordpress/components';
 import { useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { plus, symbol, symbolFilled } from '@wordpress/icons';
+import { useSelect } from '@wordpress/data';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 
 /**
@@ -14,6 +15,7 @@ import CreatePatternModal from '../create-pattern-modal';
 import CreateTemplatePartModal from '../create-template-part-modal';
 import SidebarButton from '../sidebar-button';
 import { unlock } from '../../lock-unlock';
+import { store as editSiteStore } from '../../store';
 
 const { useHistory } = unlock( routerPrivateApis );
 
@@ -22,6 +24,10 @@ export default function AddNewPattern() {
 	const [ showPatternModal, setShowPatternModal ] = useState( false );
 	const [ showTemplatePartModal, setShowTemplatePartModal ] =
 		useState( false );
+	const isTemplatePartsMode = useSelect( ( select ) => {
+		const settings = select( editSiteStore ).getSettings();
+		return !! settings.supportsTemplatePartsMode;
+	}, [] );
 
 	function handleCreatePattern( { pattern, categoryId } ) {
 		setShowPatternModal( false );
@@ -51,21 +57,28 @@ export default function AddNewPattern() {
 		setShowTemplatePartModal( false );
 	}
 
+	const controls = [
+		{
+			icon: symbol,
+			onClick: () => setShowPatternModal( true ),
+			title: __( 'Create pattern' ),
+		},
+	];
+
+	// Remove condition when command palette issues are resolved.
+	// See: https://github.com/WordPress/gutenberg/issues/52154.
+	if ( ! isTemplatePartsMode ) {
+		controls.push( {
+			icon: symbolFilled,
+			onClick: () => setShowTemplatePartModal( true ),
+			title: __( 'Create template part' ),
+		} );
+	}
+
 	return (
 		<>
 			<DropdownMenu
-				controls={ [
-					{
-						icon: symbolFilled,
-						onClick: () => setShowTemplatePartModal( true ),
-						title: __( 'Create template part' ),
-					},
-					{
-						icon: symbol,
-						onClick: () => setShowPatternModal( true ),
-						title: __( 'Create pattern' ),
-					},
-				] }
+				controls={ controls }
 				toggleProps={ {
 					as: SidebarButton,
 				} }

package/src/components/add-new-template/utils.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { get } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -20,6 +15,14 @@ import { blockMeta, post, archive } from '@wordpress/icons';
  * @property {string}        name The entity's name.
  */
 
+const getValueFromObjectPath = ( object, path ) => {
+	let value = object;
+	path.split( '.' ).forEach( ( fieldName ) => {
+		value = value?.[ fieldName ];
+	} );
+	return value;
+};
+
 /**
  * Helper util to map records to add a `name` prop from a
  * provided path, in order to handle all entities in the same
@@ -32,7 +35,7 @@ import { blockMeta, post, archive } from '@wordpress/icons';
 export const mapToIHasNameAndId = ( entities, path ) => {
 	return ( entities || [] ).map( ( entity ) => ( {
 		...entity,
-		name: decodeEntities( get( entity, path ) ),
+		name: decodeEntities( getValueFromObjectPath( entity, path ) ),
 	} ) );
 };
 

package/src/components/block-editor/constants.js

@@ -1 +1,5 @@
-export const FOCUSABLE_ENTITIES = [ 'wp_template_part', 'wp_navigation' ];
+export const FOCUSABLE_ENTITIES = [
+	'wp_template_part',
+	'wp_navigation',
+	'wp_block',
+];

package/src/components/block-editor/editor-canvas.js

@@ -88,7 +88,7 @@ function EditorCanvas( { enableResizing, settings, children, ...props } ) {
 					enableResizing ? 'min-height:0!important;' : ''
 				}}body{position:relative; ${
 					canvasMode === 'view'
-						? 'cursor: pointer; height: 100vh'
+						? 'cursor: pointer; min-height: 100vh;'
 						: ''
 				}}}`
 			}</style>

package/src/components/block-editor/index.js

@@ -1,7 +1,3 @@
-/**
- * External dependencies
- */
-
 /**
  * WordPress dependencies
  */

package/src/components/block-editor/use-site-editor-settings.js

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useSelect } from '@wordpress/data';
+import { useDispatch, useSelect } from '@wordpress/data';
 import { useMemo } from '@wordpress/element';
 import { store as coreStore } from '@wordpress/core-data';
 /**
@@ -11,16 +11,93 @@ import { store as editSiteStore } from '../../store';
 import { unlock } from '../../lock-unlock';
 import inserterMediaCategories from './inserter-media-categories';
 
-export default function useSiteEditorSettings( templateType ) {
-	const { storedSettings, canvasMode } = useSelect( ( select ) => {
-		const { getSettings, getCanvasMode } = unlock(
-			select( editSiteStore )
-		);
-		return {
-			storedSettings: getSettings(),
-			canvasMode: getCanvasMode(),
-		};
-	}, [] );
+function useArchiveLabel( templateSlug ) {
+	const taxonomyMatches = templateSlug?.match(
+		/^(category|tag|taxonomy-([^-]+))$|^(((category|tag)|taxonomy-([^-]+))-(.+))$/
+	);
+	let taxonomy;
+	let term;
+	let isAuthor = false;
+	let authorSlug;
+	if ( taxonomyMatches ) {
+		// If is for a all taxonomies of a type
+		if ( taxonomyMatches[ 1 ] ) {
+			taxonomy = taxonomyMatches[ 2 ]
+				? taxonomyMatches[ 2 ]
+				: taxonomyMatches[ 1 ];
+		}
+		// If is for a all taxonomies of a type
+		else if ( taxonomyMatches[ 3 ] ) {
+			taxonomy = taxonomyMatches[ 6 ]
+				? taxonomyMatches[ 6 ]
+				: taxonomyMatches[ 4 ];
+			term = taxonomyMatches[ 7 ];
+		}
+		taxonomy = taxonomy === 'tag' ? 'post_tag' : taxonomy;
+
+		//getTaxonomy( 'category' );
+		//wp.data.select('core').getEntityRecords( 'taxonomy', 'category', {slug: 'newcat'} );
+	} else {
+		const authorMatches = templateSlug?.match( /^(author)$|^author-(.+)$/ );
+		if ( authorMatches ) {
+			isAuthor = true;
+			if ( authorMatches[ 2 ] ) {
+				authorSlug = authorMatches[ 2 ];
+			}
+		}
+	}
+	return useSelect(
+		( select ) => {
+			const { getEntityRecords, getTaxonomy, getAuthors } =
+				select( coreStore );
+			let archiveTypeLabel;
+			let archiveNameLabel;
+			if ( taxonomy ) {
+				archiveTypeLabel =
+					getTaxonomy( taxonomy )?.labels?.singular_name;
+			}
+			if ( term ) {
+				const records = getEntityRecords( 'taxonomy', taxonomy, {
+					slug: term,
+					per_page: 1,
+				} );
+				if ( records && records[ 0 ] ) {
+					archiveNameLabel = records[ 0 ].name;
+				}
+			}
+			if ( isAuthor ) {
+				archiveTypeLabel = 'Author';
+				if ( authorSlug ) {
+					const authorRecords = getAuthors( { slug: authorSlug } );
+					if ( authorRecords && authorRecords[ 0 ] ) {
+						archiveNameLabel = authorRecords[ 0 ].name;
+					}
+				}
+			}
+			return {
+				archiveTypeLabel,
+				archiveNameLabel,
+			};
+		},
+		[ authorSlug, isAuthor, taxonomy, term ]
+	);
+}
+
+export default function useSiteEditorSettings() {
+	const { setIsInserterOpened } = useDispatch( editSiteStore );
+	const { storedSettings, canvasMode, templateType } = useSelect(
+		( select ) => {
+			const { getSettings, getCanvasMode, getEditedPostType } = unlock(
+				select( editSiteStore )
+			);
+			return {
+				storedSettings: getSettings( setIsInserterOpened ),
+				canvasMode: getCanvasMode(),
+				templateType: getEditedPostType(),
+			};
+		},
+		[ setIsInserterOpened ]
+	);
 
 	const settingsBlockPatterns =
 		storedSettings.__experimentalAdditionalBlockPatterns ?? // WP 6.0
@@ -29,14 +106,27 @@ export default function useSiteEditorSettings( templateType ) {
 		storedSettings.__experimentalAdditionalBlockPatternCategories ?? // WP 6.0
 		storedSettings.__experimentalBlockPatternCategories; // WP 5.9
 
-	const { restBlockPatterns, restBlockPatternCategories } = useSelect(
-		( select ) => ( {
-			restBlockPatterns: select( coreStore ).getBlockPatterns(),
-			restBlockPatternCategories:
-				select( coreStore ).getBlockPatternCategories(),
-		} ),
-		[]
-	);
+	const { restBlockPatterns, restBlockPatternCategories, templateSlug } =
+		useSelect( ( select ) => {
+			const { getEditedPostType, getEditedPostId } =
+				select( editSiteStore );
+			const { getEditedEntityRecord } = select( coreStore );
+			const usedPostType = getEditedPostType();
+			const usedPostId = getEditedPostId();
+			const _record = getEditedEntityRecord(
+				'postType',
+				usedPostType,
+				usedPostId
+			);
+			return {
+				restBlockPatterns: select( coreStore ).getBlockPatterns(),
+				restBlockPatternCategories:
+					select( coreStore ).getBlockPatternCategories(),
+				templateSlug: _record.slug,
+			};
+		}, [] );
+	const archiveLabels = useArchiveLabel( templateSlug );
+
 	const blockPatterns = useMemo(
 		() =>
 			[
@@ -82,6 +172,15 @@ export default function useSiteEditorSettings( templateType ) {
 			__experimentalBlockPatterns: blockPatterns,
 			__experimentalBlockPatternCategories: blockPatternCategories,
 			focusMode: canvasMode === 'view' && focusMode ? false : focusMode,
+			__experimentalArchiveTitleTypeLabel: archiveLabels.archiveTypeLabel,
+			__experimentalArchiveTitleNameLabel: archiveLabels.archiveNameLabel,
 		};
-	}, [ storedSettings, blockPatterns, blockPatternCategories, canvasMode ] );
+	}, [
+		storedSettings,
+		blockPatterns,
+		blockPatternCategories,
+		canvasMode,
+		archiveLabels.archiveTypeLabel,
+		archiveLabels.archiveNameLabel,
+	] );
 }

package/src/components/canvas-spinner/style.scss

@@ -2,10 +2,24 @@
 	width: 100%;
 	height: 100%;
 	display: flex;
+	opacity: 0;
 	align-items: center;
 	justify-content: center;
 
+	animation: 0.5s ease 1s edit-site-canvas-spinner__fade-in-animation;
+	animation-fill-mode: forwards;
+	@include reduce-motion("animation");
+
 	circle {
 		stroke: rgba($black, 0.3);
 	}
 }
+
+@keyframes edit-site-canvas-spinner__fade-in-animation {
+	from {
+		opacity: 0;
+	}
+	to {
+		opacity: 1;
+	}
+}

package/src/components/code-editor/index.js

@@ -1,50 +1,56 @@
+/**
+ * External dependencies
+ */
+import Textarea from 'react-autosize-textarea';
+
 /**
  * WordPress dependencies
  */
-import { parse, __unstableSerializeAndClean } from '@wordpress/blocks';
-import { useEntityBlockEditor, useEntityProp } from '@wordpress/core-data';
+import { __unstableSerializeAndClean } from '@wordpress/blocks';
+import { store as coreStore } from '@wordpress/core-data';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
 import { __ } from '@wordpress/i18n';
-import { Button } from '@wordpress/components';
+import { Button, VisuallyHidden } from '@wordpress/components';
+import { useMemo } from '@wordpress/element';
+import { useInstanceId } from '@wordpress/compose';
 
 /**
  * Internal dependencies
  */
 import { store as editSiteStore } from '../../store';
-import CodeEditorTextArea from './code-editor-text-area';
 
 export default function CodeEditor() {
-	const { templateType, shortcut } = useSelect( ( select ) => {
-		const { getEditedPostType } = select( editSiteStore );
+	const instanceId = useInstanceId( CodeEditor );
+	const { shortcut, content, blocks, type, id } = useSelect( ( select ) => {
+		const { getEditedEntityRecord } = select( coreStore );
+		const { getEditedPostType, getEditedPostId } = select( editSiteStore );
 		const { getShortcutRepresentation } = select( keyboardShortcutsStore );
+		const _type = getEditedPostType();
+		const _id = getEditedPostId();
+		const editedRecord = getEditedEntityRecord( 'postType', _type, _id );
+
 		return {
-			templateType: getEditedPostType(),
 			shortcut: getShortcutRepresentation( 'core/edit-site/toggle-mode' ),
+			content: editedRecord?.content,
+			blocks: editedRecord?.blocks,
+			type: _type,
+			id: _id,
 		};
 	}, [] );
-	const [ contentStructure, setContent ] = useEntityProp(
-		'postType',
-		templateType,
-		'content'
-	);
-	const [ blocks, , onChange ] = useEntityBlockEditor(
-		'postType',
-		templateType
-	);
-
+	const { editEntityRecord } = useDispatch( coreStore );
 	// Replicates the logic found in getEditedPostContent().
-	let content;
-	if ( contentStructure instanceof Function ) {
-		content = contentStructure( { blocks } );
-	} else if ( blocks ) {
-		// If we have parsed blocks already, they should be our source of truth.
-		// Parsing applies block deprecations and legacy block conversions that
-		// unparsed content will not have.
-		content = __unstableSerializeAndClean( blocks );
-	} else {
-		content = contentStructure;
-	}
+	const realContent = useMemo( () => {
+		if ( content instanceof Function ) {
+			return content( { blocks } );
+		} else if ( blocks ) {
+			// If we have parsed blocks already, they should be our source of truth.
+			// Parsing applies block deprecations and legacy block conversions that
+			// unparsed content will not have.
+			return __unstableSerializeAndClean( blocks );
+		}
+		return content;
+	}, [ content, blocks ] );
 
 	const { switchEditorMode } = useDispatch( editSiteStore );
 	return (
@@ -60,14 +66,26 @@ export default function CodeEditor() {
 				</Button>
 			</div>
 			<div className="edit-site-code-editor__body">
-				<CodeEditorTextArea
-					value={ content }
-					onChange={ ( newContent ) => {
-						onChange( parse( newContent ), {
+				<VisuallyHidden
+					as="label"
+					htmlFor={ `code-editor-text-area-${ instanceId }` }
+				>
+					{ __( 'Type text or HTML' ) }
+				</VisuallyHidden>
+				<Textarea
+					autoComplete="off"
+					dir="auto"
+					value={ realContent }
+					onChange={ ( event ) => {
+						editEntityRecord( 'postType', type, id, {
+							content: event.target.value,
+							blocks: undefined,
 							selection: undefined,
 						} );
 					} }
-					onInput={ setContent }
+					className="edit-site-code-editor-text-area"
+					id={ `code-editor-text-area-${ instanceId }` }
+					placeholder={ __( 'Start writing with text or HTML' ) }
 				/>
 			</div>
 		</div>

package/src/components/create-pattern-modal/index.js

@@ -14,6 +14,7 @@ import { __ } from '@wordpress/i18n';
 import { useState } from '@wordpress/element';
 import { store as noticesStore } from '@wordpress/notices';
 import { useDispatch } from '@wordpress/data';
+import { serialize } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -21,9 +22,11 @@ import { useDispatch } from '@wordpress/data';
 import { SYNC_TYPES, USER_PATTERN_CATEGORY } from '../page-patterns/utils';
 
 export default function CreatePatternModal( {
+	blocks = [],
 	closeModal,
 	onCreate,
 	onError,
+	title,
 } ) {
 	const [ name, setName ] = useState( '' );
 	const [ syncType, setSyncType ] = useState( SYNC_TYPES.unsynced );
@@ -52,7 +55,7 @@ export default function CreatePatternModal( {
 				'wp_block',
 				{
 					title: name || __( 'Untitled Pattern' ),
-					content: '',
+					content: blocks?.length ? serialize( blocks ) : '',
 					status: 'publish',
 					meta:
 						syncType === SYNC_TYPES.unsynced
@@ -76,7 +79,7 @@ export default function CreatePatternModal( {
 
 	return (
 		<Modal
-			title={ __( 'Create pattern' ) }
+			title={ title || __( 'Create pattern' ) }
 			onRequestClose={ closeModal }
 			overlayClassName="edit-site-create-pattern-modal"
 		>

package/src/components/editor/index.js

@@ -58,9 +58,10 @@ const interfaceLabels = {
 };
 
 const typeLabels = {
-	wp_template: __( 'Template Part' ),
+	wp_template: __( 'Template' ),
 	wp_template_part: __( 'Template Part' ),
 	wp_block: __( 'Pattern' ),
+	wp_navigation: __( 'Navigation' ),
 };
 
 // Prevent accidental removal of certain blocks, asking the user for
@@ -70,8 +71,8 @@ const blockRemovalRules = {
 	'core/post-content': __(
 		'Post Content displays the content of a post or page.'
 	),
-	'core/footnotes': __(
-		'The Footnotes block displays all footnotes found in the content. Note that any footnotes in the content will persist after removing this block.'
+	'core/post-template': __(
+		'Post Template displays each post or page in a Query Loop.'
 	),
 };
 
@@ -165,12 +166,11 @@ export default function Editor( { isLoading } ) {
 
 	let title;
 	if ( hasLoadedPost ) {
-		const type = typeLabels[ editedPostType ] ?? __( 'Template' );
 		title = sprintf(
 			// translators: A breadcrumb trail in browser tab. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).
 			__( '%1$s ‹ %2$s ‹ Editor' ),
 			getTitle(),
-			type
+			typeLabels[ editedPostType ] ?? typeLabels.wp_template
 		);
 	}
 

package/src/components/global-styles/global-styles-provider.js

@@ -31,7 +31,7 @@ export function mergeBaseAndUserConfigs( base, user ) {
 }
 
 function useGlobalStylesUserConfig() {
-	const { globalStylesId, isReady, settings, styles } = useSelect(
+	const { globalStylesId, isReady, settings, styles, behaviors } = useSelect(
 		( select ) => {
 			const { getEditedEntityRecord, hasFinishedResolution } =
 				select( coreStore );
@@ -65,6 +65,7 @@ function useGlobalStylesUserConfig() {
 				isReady: hasResolved,
 				settings: record?.settings,
 				styles: record?.styles,
+				behaviors: record?.behaviors,
 			};
 		},
 		[]
@@ -76,8 +77,9 @@ function useGlobalStylesUserConfig() {
 		return {
 			settings: settings ?? {},
 			styles: styles ?? {},
+			behaviors: behaviors ?? {},
 		};
-	}, [ settings, styles ] );
+	}, [ settings, styles, behaviors ] );
 
 	const setConfig = useCallback(
 		( callback, options = {} ) => {
@@ -89,6 +91,7 @@ function useGlobalStylesUserConfig() {
 			const currentConfig = {
 				styles: record?.styles ?? {},
 				settings: record?.settings ?? {},
+				behaviors: record?.behaviors ?? {},
 			};
 			const updatedConfig = callback( currentConfig );
 			editEntityRecord(
@@ -98,6 +101,8 @@ function useGlobalStylesUserConfig() {
 				{
 					styles: cleanEmptyObject( updatedConfig.styles ) || {},
 					settings: cleanEmptyObject( updatedConfig.settings ) || {},
+					behaviors:
+						cleanEmptyObject( updatedConfig.behaviors ) || {},
 				},
 				options
 			);