@wordpress/edit-post 7.15.0 → 7.17.0

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

@@ -334,11 +334,19 @@ export default function VisualEditor( { styles } ) {
 		.is-root-container.alignfull { max-width: none; margin-left: auto; margin-right: auto;}
 		.is-root-container.alignfull:where(.is-layout-flow) > :not(.alignleft):not(.alignright) { max-width: none;}`;
 
+	const isToBeIframed =
+		( ( hasV3BlocksOnly || ( isGutenbergPlugin && isBlockBasedTheme ) ) &&
+			! hasMetaBoxes ) ||
+		isTemplateMode ||
+		deviceType === 'Tablet' ||
+		deviceType === 'Mobile';
+
 	return (
 		<BlockTools
 			__unstableContentRef={ ref }
 			className={ classnames( 'edit-post-visual-editor', {
 				'is-template-mode': isTemplateMode,
+				'has-inline-canvas': ! isToBeIframed,
 			} ) }
 		>
 			<motion.div
@@ -354,14 +362,7 @@ export default function VisualEditor( { styles } ) {
 					className={ previewMode }
 				>
 					<MaybeIframe
-						shouldIframe={
-							( ( hasV3BlocksOnly ||
-								( isGutenbergPlugin && isBlockBasedTheme ) ) &&
-								! hasMetaBoxes ) ||
-							isTemplateMode ||
-							deviceType === 'Tablet' ||
-							deviceType === 'Mobile'
-						}
+						shouldIframe={ isToBeIframed }
 						contentRef={ contentRef }
 						styles={ styles }
 					>

package/src/components/visual-editor/style.scss

@@ -2,7 +2,11 @@
 	position: relative;
 	display: flex;
 	flex-flow: column;
-	overflow: hidden;
+	// In the iframed canvas this keeps extra scrollbars from appearing (when block toolbars overflow). In the
+	// legacy (non-iframed) canvas, overflow must not be hidden in order to maintain support for sticky positioning.
+	&:not(.has-inline-canvas) {
+		overflow: hidden;
+	}
 
 	// Gray preview overlay (desktop/tablet/mobile) is intentionally not set on an element with scrolling content like
 	// interface-interface-skeleton__content. This causes graphical glitches (flashes of the background color)

package/src/editor.js

@@ -9,7 +9,6 @@ import {
 	store as editorStore,
 	privateApis as editorPrivateApis,
 } from '@wordpress/editor';
-import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
 import { useMemo } from '@wordpress/element';
 import { SlotFillProvider } from '@wordpress/components';
 import { store as coreStore } from '@wordpress/core-data';
@@ -28,7 +27,6 @@ import { unlock } from './lock-unlock';
 import useCommonCommands from './hooks/commands/use-common-commands';
 
 const { ExperimentalEditorProvider } = unlock( editorPrivateApis );
-const { getLayoutStyles } = unlock( blockEditorPrivateApis );
 const { useCommands } = unlock( coreCommandsPrivateApis );
 
 function Editor( { postId, postType, settings, initialEdits, ...props } ) {
@@ -39,7 +37,6 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
 		focusMode,
 		isDistractionFree,
 		hasInlineToolbar,
-		hasThemeStyles,
 		post,
 		preferredStyleVariations,
 		hiddenBlockTypes,
@@ -51,7 +48,6 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
 		( select ) => {
 			const {
 				isFeatureActive,
-				__experimentalGetPreviewDeviceType,
 				isEditingTemplate,
 				getEditedPostTemplate,
 				getHiddenBlockTypes,
@@ -80,13 +76,10 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
 			const canEditTemplate = canUser( 'create', 'templates' );
 
 			return {
-				hasFixedToolbar:
-					isFeatureActive( 'fixedToolbar' ) ||
-					__experimentalGetPreviewDeviceType() !== 'Desktop',
+				hasFixedToolbar: isFeatureActive( 'fixedToolbar' ),
 				focusMode: isFeatureActive( 'focusMode' ),
 				isDistractionFree: isFeatureActive( 'distractionFree' ),
 				hasInlineToolbar: isFeatureActive( 'inlineToolbar' ),
-				hasThemeStyles: isFeatureActive( 'themeStyles' ),
 				preferredStyleVariations: select( preferencesStore ).get(
 					'core/edit-post',
 					'preferredStyleVariations'
@@ -158,44 +151,6 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
 		keepCaretInsideBlock,
 	] );
 
-	const styles = useMemo( () => {
-		const themeStyles = [];
-		const presetStyles = [];
-		settings.styles?.forEach( ( style ) => {
-			if ( ! style.__unstableType || style.__unstableType === 'theme' ) {
-				themeStyles.push( style );
-			} else {
-				presetStyles.push( style );
-			}
-		} );
-
-		const defaultEditorStyles = [
-			...settings.defaultEditorStyles,
-			...presetStyles,
-		];
-
-		// If theme styles are not present or displayed, ensure that
-		// base layout styles are still present in the editor.
-		if (
-			! settings.disableLayoutStyles &&
-			! ( hasThemeStyles && themeStyles.length )
-		) {
-			defaultEditorStyles.push( {
-				css: getLayoutStyles( {
-					style: {},
-					selector: 'body',
-					hasBlockGapSupport: false,
-					hasFallbackGapSupport: true,
-					fallbackGapValue: '0.5em',
-				} ),
-			} );
-		}
-
-		return hasThemeStyles && themeStyles.length
-			? settings.styles
-			: defaultEditorStyles;
-	}, [ settings, hasThemeStyles ] );
-
 	if ( ! post ) {
 		return null;
 	}
@@ -214,7 +169,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
 					<ErrorBoundary>
 						<CommandMenu />
 						<EditorInitialization postId={ postId } />
-						<Layout styles={ styles } />
+						<Layout />
 					</ErrorBoundary>
 					<PostLockedModal />
 				</ExperimentalEditorProvider>

package/src/hooks/commands/use-common-commands.js

@@ -5,17 +5,20 @@ import { useSelect, useDispatch } from '@wordpress/data';
 import { __, isRTL } from '@wordpress/i18n';
 import {
 	code,
-	cog,
 	drawerLeft,
 	drawerRight,
 	blockDefault,
-	keyboardClose,
+	keyboard,
 	desktop,
 	listView,
+	external,
+	formatListBullets,
 } from '@wordpress/icons';
 import { useCommand } from '@wordpress/commands';
 import { store as preferencesStore } from '@wordpress/preferences';
 import { store as interfaceStore } from '@wordpress/interface';
+import { store as editorStore } from '@wordpress/editor';
+import { store as noticesStore } from '@wordpress/notices';
 
 /**
  * Internal dependencies
@@ -32,20 +35,30 @@ export default function useCommonCommands() {
 		setIsListViewOpened,
 	} = useDispatch( editPostStore );
 	const { openModal } = useDispatch( interfaceStore );
-	const { editorMode, activeSidebar, isListViewOpen } = useSelect(
-		( select ) => {
-			const { getEditorMode, isListViewOpened } = select( editPostStore );
-			return {
-				activeSidebar: select(
-					interfaceStore
-				).getActiveComplementaryArea( editPostStore.name ),
-				editorMode: getEditorMode(),
-				isListViewOpen: isListViewOpened(),
-			};
-		},
-		[]
-	);
+	const {
+		editorMode,
+		activeSidebar,
+		isListViewOpen,
+		isPublishSidebarEnabled,
+		showBlockBreadcrumbs,
+	} = useSelect( ( select ) => {
+		const { getEditorMode, isListViewOpened, isFeatureActive } =
+			select( editPostStore );
+		return {
+			activeSidebar: select( interfaceStore ).getActiveComplementaryArea(
+				editPostStore.name
+			),
+			editorMode: getEditorMode(),
+			isListViewOpen: isListViewOpened(),
+			isPublishSidebarEnabled:
+				select( editorStore ).isPublishSidebarEnabled(),
+			showBlockBreadcrumbs: isFeatureActive( 'showBlockBreadcrumbs' ),
+		};
+	}, [] );
 	const { toggle } = useDispatch( preferencesStore );
+	const { createInfoNotice } = useDispatch( noticesStore );
+	const { __unstableSaveForPreview } = useDispatch( editorStore );
+	const { getCurrentPostId } = useSelect( editorStore );
 
 	useCommand( {
 		name: 'core/open-settings-sidebar',
@@ -78,7 +91,6 @@ export default function useCommonCommands() {
 	useCommand( {
 		name: 'core/toggle-distraction-free',
 		label: __( 'Toggle distraction free' ),
-		icon: cog,
 		callback: ( { close } ) => {
 			toggle( 'core/edit-post', 'distractionFree' );
 			close();
@@ -88,7 +100,6 @@ export default function useCommonCommands() {
 	useCommand( {
 		name: 'core/toggle-spotlight-mode',
 		label: __( 'Toggle spotlight mode' ),
-		icon: cog,
 		callback: ( { close } ) => {
 			toggle( 'core/edit-post', 'focusMode' );
 			close();
@@ -118,7 +129,6 @@ export default function useCommonCommands() {
 	useCommand( {
 		name: 'core/toggle-top-toolbar',
 		label: __( 'Toggle top toolbar' ),
-		icon: cog,
 		callback: ( { close } ) => {
 			toggle( 'core/edit-post', 'fixedToolbar' );
 			close();
@@ -137,8 +147,7 @@ export default function useCommonCommands() {
 
 	useCommand( {
 		name: 'core/open-preferences',
-		label: __( 'Open editor preferences' ),
-		icon: cog,
+		label: __( 'Editor preferences' ),
 		callback: () => {
 			openModal( PREFERENCES_MODAL_NAME );
 		},
@@ -146,10 +155,63 @@ export default function useCommonCommands() {
 
 	useCommand( {
 		name: 'core/open-shortcut-help',
-		label: __( 'Open keyboard shortcuts' ),
-		icon: keyboardClose,
+		label: __( 'Keyboard shortcuts' ),
+		icon: keyboard,
 		callback: () => {
 			openModal( KEYBOARD_SHORTCUT_HELP_MODAL_NAME );
 		},
 	} );
+
+	useCommand( {
+		name: 'core/toggle-breadcrumbs',
+		label: showBlockBreadcrumbs
+			? __( 'Hide block breadcrumbs' )
+			: __( 'Show block breadcrumbs' ),
+		callback: ( { close } ) => {
+			toggle( 'core/edit-post', 'showBlockBreadcrumbs' );
+			close();
+			createInfoNotice(
+				showBlockBreadcrumbs
+					? __( 'Breadcrumbs hidden.' )
+					: __( 'Breadcrumbs visible.' ),
+				{
+					id: 'core/edit-post/toggle-breadcrumbs/notice',
+					type: 'snackbar',
+				}
+			);
+		},
+	} );
+
+	useCommand( {
+		name: 'core/toggle-publish-sidebar',
+		label: isPublishSidebarEnabled
+			? __( 'Disable pre-publish checklist' )
+			: __( 'Enable pre-publish checklist' ),
+		icon: formatListBullets,
+		callback: ( { close } ) => {
+			close();
+			toggle( 'core/edit-post', 'isPublishSidebarEnabled' );
+			createInfoNotice(
+				isPublishSidebarEnabled
+					? __( 'Pre-publish checklist off.' )
+					: __( 'Pre-publish checklist on.' ),
+				{
+					id: 'core/edit-post/publish-sidebar/notice',
+					type: 'snackbar',
+				}
+			);
+		},
+	} );
+
+	useCommand( {
+		name: 'core/preview-link',
+		label: __( 'Preview in a new tab' ),
+		icon: external,
+		callback: async ( { close } ) => {
+			close();
+			const postId = getCurrentPostId();
+			const link = await __unstableSaveForPreview();
+			window.open( link, `wp-preview-${ postId }` );
+		},
+	} );
 }

package/src/index.js

@@ -65,7 +65,11 @@ export function initializeEditor(
 	dispatch( blocksStore ).__experimentalReapplyBlockTypeFilters();
 
 	// Check if the block list view should be open by default.
-	if ( select( editPostStore ).isFeatureActive( 'showListViewByDefault' ) ) {
+	// If `distractionFree` mode is enabled, the block list view should not be open.
+	if (
+		select( editPostStore ).isFeatureActive( 'showListViewByDefault' ) &&
+		! select( editPostStore ).isFeatureActive( 'distractionFree' )
+	) {
 		dispatch( editPostStore ).setIsListViewOpened( true );
 	}
 

package/src/store/selectors.js

@@ -15,6 +15,11 @@ import deprecated from '@wordpress/deprecated';
 
 const EMPTY_ARRAY = [];
 const EMPTY_OBJECT = {};
+const EMPTY_INSERTION_POINT = {
+	rootClientId: undefined,
+	insertionIndex: undefined,
+	filterValue: undefined,
+};
 
 /**
  * Returns the current editing mode.
@@ -472,9 +477,11 @@ export function isInserterOpened( state ) {
  * @return {Object} The root client ID, index to insert at and starting filter value.
  */
 export function __experimentalGetInsertionPoint( state ) {
-	const { rootClientId, insertionIndex, filterValue } =
-		state.blockInserterPanel;
-	return { rootClientId, insertionIndex, filterValue };
+	if ( typeof state === 'boolean' ) {
+		return EMPTY_INSERTION_POINT;
+	}
+
+	return state.blockInserterPanel;
 }
 
 /**

package/src/style.scss

@@ -2,7 +2,7 @@
 @import "./components/header/style.scss";
 @import "./components/header/fullscreen-mode-close/style.scss";
 @import "./components/header/header-toolbar/style.scss";
-@import "./components/header/document-title/style.scss";
+@import "./components/header/document-actions/style.scss";
 @import "./components/keyboard-shortcut-help-modal/style.scss";
 @import "./components/layout/style.scss";
 @import "./components/block-manager/style.scss";

package/src/test/editor.native.js

@@ -74,11 +74,12 @@ describe( 'Editor', () => {
 		// Act
 		const paragraphBlock = getBlock( screen, 'Paragraph' );
 		fireEvent.press( paragraphBlock );
-
-		toggleMode();
+		act( () => {
+			toggleMode();
+		} );
 
 		// Assert
-		const htmlEditor = await screen.findByLabelText( 'html-view-content' );
+		const htmlEditor = screen.getByLabelText( 'html-view-content' );
 		expect( htmlEditor ).toBeVisible();
 	} );
 } );

package/build/components/header/document-title/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-post/src/components/header/document-title/index.js"],"names":["DocumentTitle","template","isEditing","select","isEditingTemplate","getEditedPostTemplate","editPostStore","_isEditing","clearSelectedBlock","blockEditorStore","setIsEditingTemplate","open","openCommandCenter","commandsStore","templateTitle","title","slug","chevronRightSmall","chevronLeftSmall","layout","displayShortcut","primary"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AAKA;;AAnBA;AACA;AACA;;AAcA;AACA;AACA;AAGA,SAASA,aAAT,GAAyB;AACxB,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,MAA0B,qBAAaC,MAAF,IAAc;AACxD,UAAM;AAAEC,MAAAA,iBAAF;AAAqBC,MAAAA;AAArB,QACLF,MAAM,CAAEG,YAAF,CADP;;AAEA,UAAMC,UAAU,GAAGH,iBAAiB,EAApC;;AAEA,WAAO;AACNH,MAAAA,QAAQ,EAAEM,UAAU,GAAGF,qBAAqB,EAAxB,GAA6B,IAD3C;AAENH,MAAAA,SAAS,EAAEK;AAFL,KAAP;AAIA,GAT+B,EAS7B,EAT6B,CAAhC;AAUA,QAAM;AAAEC,IAAAA;AAAF,MAAyB,uBAAaC,kBAAb,CAA/B;AACA,QAAM;AAAEC,IAAAA;AAAF,MAA2B,uBAAaJ,YAAb,CAAjC;AACA,QAAM;AAAEK,IAAAA,IAAI,EAAEC;AAAR,MAA8B,uBAAaC,eAAb,CAApC;;AAEA,MAAK,CAAEX,SAAF,IAAe,CAAED,QAAtB,EAAiC;AAChC,WAAO,IAAP;AACA;;AAED,MAAIa,aAAa,GAAG,cAAI,SAAJ,CAApB;;AACA,MAAKb,QAAQ,EAAEc,KAAf,EAAuB;AACtBD,IAAAA,aAAa,GAAGb,QAAQ,CAACc,KAAzB;AACA,GAFD,MAEO,IAAK,CAAC,CAAEd,QAAR,EAAmB;AACzBa,IAAAA,aAAa,GAAGb,QAAQ,CAACe,IAAzB;AACA;;AAED,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAG,MAAM;AACfR,MAAAA,kBAAkB;AAClBE,MAAAA,oBAAoB,CAAE,KAAF,CAApB;AACA,KAJF;AAKC,IAAA,IAAI,EAAG,qBAAUO,wBAAV,GAA8BC;AALtC,KAOG,cAAI,MAAJ,CAPH,CADD,CADD,EAaC,4BAAC,kBAAD;AACC,IAAA,SAAS,EAAC,iCADX;AAEC,IAAA,OAAO,EAAG,MAAMN,iBAAiB;AAFlC,KAIC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,OAAO,EAAC;AAA9B,KACC,4BAAC,sBAAD;AAAW,IAAA,IAAI,EAAGO;AAAlB,IADD,EAEC,4BAAC,8BAAD;AAAM,IAAA,IAAI,EAAC,MAAX;AAAkB,IAAA,EAAE,EAAC;AAArB,KACC,4BAAC,0BAAD;AAAgB,IAAA,EAAE,EAAC;AAAnB,KACG,cAAI,oBAAJ,CADH,CADD,EAIGL,aAJH,CAFD,CAJD,CAbD,EA2BC,4BAAC,kBAAD;AACC,IAAA,SAAS,EAAC,oCADX;AAEC,IAAA,OAAO,EAAG,MAAMF,iBAAiB;AAFlC,KAIGQ,0BAAgBC,OAAhB,CAAyB,GAAzB,CAJH,CA3BD,CADD;AAoCA;;eAEcrB,a","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { BlockIcon, store as blockEditorStore } from '@wordpress/block-editor';\nimport {\n\tButton,\n\tVisuallyHidden,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n} from '@wordpress/components';\nimport { layout, chevronLeftSmall, chevronRightSmall } from '@wordpress/icons';\nimport { store as commandsStore } from '@wordpress/commands';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editPostStore } from '../../../store';\n\nfunction DocumentTitle() {\n\tconst { template, isEditing } = useSelect( ( select ) => {\n\t\tconst { isEditingTemplate, getEditedPostTemplate } =\n\t\t\tselect( editPostStore );\n\t\tconst _isEditing = isEditingTemplate();\n\n\t\treturn {\n\t\t\ttemplate: _isEditing ? getEditedPostTemplate() : null,\n\t\t\tisEditing: _isEditing,\n\t\t};\n\t}, [] );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst { setIsEditingTemplate } = useDispatch( editPostStore );\n\tconst { open: openCommandCenter } = useDispatch( commandsStore );\n\n\tif ( ! isEditing || ! template ) {\n\t\treturn null;\n\t}\n\n\tlet templateTitle = __( 'Default' );\n\tif ( template?.title ) {\n\t\ttemplateTitle = template.title;\n\t} else if ( !! template ) {\n\t\ttemplateTitle = template.slug;\n\t}\n\n\treturn (\n\t\t<div className=\"edit-post-document-title\">\n\t\t\t<span className=\"edit-post-document-title__left\">\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\t\tsetIsEditingTemplate( false );\n\t\t\t\t\t} }\n\t\t\t\t\ticon={ isRTL() ? chevronRightSmall : chevronLeftSmall }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Back' ) }\n\t\t\t\t</Button>\n\t\t\t</span>\n\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-post-document-title__title\"\n\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t>\n\t\t\t\t<HStack spacing={ 1 } justify=\"center\">\n\t\t\t\t\t<BlockIcon icon={ layout } />\n\t\t\t\t\t<Text size=\"body\" as=\"h1\">\n\t\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t\t{ __( 'Editing template: ' ) }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t{ templateTitle }\n\t\t\t\t\t</Text>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-post-document-title__shortcut\"\n\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t>\n\t\t\t\t{ displayShortcut.primary( 'k' ) }\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n\nexport default DocumentTitle;\n"]}

package/build-module/components/header/document-title/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/edit-post/src/components/header/document-title/index.js"],"names":["__","isRTL","useSelect","useDispatch","BlockIcon","store","blockEditorStore","Button","VisuallyHidden","__experimentalHStack","HStack","__experimentalText","Text","layout","chevronLeftSmall","chevronRightSmall","commandsStore","displayShortcut","editPostStore","DocumentTitle","template","isEditing","select","isEditingTemplate","getEditedPostTemplate","_isEditing","clearSelectedBlock","setIsEditingTemplate","open","openCommandCenter","templateTitle","title","slug","primary"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { BlockIcon, store as blockEditorStore } from '@wordpress/block-editor';\nimport {\n\tButton,\n\tVisuallyHidden,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n} from '@wordpress/components';\nimport { layout, chevronLeftSmall, chevronRightSmall } from '@wordpress/icons';\nimport { store as commandsStore } from '@wordpress/commands';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editPostStore } from '../../../store';\n\nfunction DocumentTitle() {\n\tconst { template, isEditing } = useSelect( ( select ) => {\n\t\tconst { isEditingTemplate, getEditedPostTemplate } =\n\t\t\tselect( editPostStore );\n\t\tconst _isEditing = isEditingTemplate();\n\n\t\treturn {\n\t\t\ttemplate: _isEditing ? getEditedPostTemplate() : null,\n\t\t\tisEditing: _isEditing,\n\t\t};\n\t}, [] );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst { setIsEditingTemplate } = useDispatch( editPostStore );\n\tconst { open: openCommandCenter } = useDispatch( commandsStore );\n\n\tif ( ! isEditing || ! template ) {\n\t\treturn null;\n\t}\n\n\tlet templateTitle = __( 'Default' );\n\tif ( template?.title ) {\n\t\ttemplateTitle = template.title;\n\t} else if ( !! template ) {\n\t\ttemplateTitle = template.slug;\n\t}\n\n\treturn (\n\t\t<div className=\"edit-post-document-title\">\n\t\t\t<span className=\"edit-post-document-title__left\">\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\t\tsetIsEditingTemplate( false );\n\t\t\t\t\t} }\n\t\t\t\t\ticon={ isRTL() ? chevronRightSmall : chevronLeftSmall }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Back' ) }\n\t\t\t\t</Button>\n\t\t\t</span>\n\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-post-document-title__title\"\n\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t>\n\t\t\t\t<HStack spacing={ 1 } justify=\"center\">\n\t\t\t\t\t<BlockIcon icon={ layout } />\n\t\t\t\t\t<Text size=\"body\" as=\"h1\">\n\t\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t\t{ __( 'Editing template: ' ) }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t{ templateTitle }\n\t\t\t\t\t</Text>\n\t\t\t\t</HStack>\n\t\t\t</Button>\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-post-document-title__shortcut\"\n\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t>\n\t\t\t\t{ displayShortcut.primary( 'k' ) }\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n\nexport default DocumentTitle;\n"]}