Site editor: Add a navigable region for content area of Library and T…

…emplate views (#51782)
WordPress · Jun 23, 2023 · b2a7941 · b2a7941
1 parent 1cdf6df
commit b2a7941
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/packages/edit-site/src/components/page-library/index.js b/packages/edit-site/src/components/page-library/index.js
@@ -1,6 +1,7 @@
 /**
  * WordPress dependencies
  */
+import { __ } from '@wordpress/i18n';
 import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
 import { getQueryArgs } from '@wordpress/url';
 
@@ -26,7 +27,11 @@ export default function PageLibrary() {
 	// from the site editor store to the block editor store.
 	return (
 		<ExperimentalBlockEditorProvider settings={ settings }>
-			<Page className="edit-site-library">
+			<Page
+				className="edit-site-library"
+				title={ __( 'Library content' ) }
+				hideTitleFromUI
+			>
 				<PatternsList type={ type } categoryId={ category } />
 			</Page>
 		</ExperimentalBlockEditorProvider>

diff --git a/packages/edit-site/src/components/page/index.js b/packages/edit-site/src/components/page/index.js
@@ -3,6 +3,11 @@
  */
 import classnames from 'classnames';
 
+/**
+ * WordPress dependencies
+ */
+import { NavigableRegion } from '@wordpress/interface';
+
 /**
  * Internal dependencies
  */
@@ -14,19 +19,20 @@ export default function Page( {
 	actions,
 	children,
 	className,
+	hideTitleFromUI = false,
 } ) {
 	const classes = classnames( 'edit-site-page', className );
 
 	return (
-		<div className={ classes }>
-			{ title && (
+		<NavigableRegion className={ classes } ariaLabel={ title }>
+			{ ! hideTitleFromUI && title && (
 				<Header
 					title={ title }
 					subTitle={ subTitle }
 					actions={ actions }
 				/>
 			) }
 			<div className="edit-site-page-content">{ children }</div>
-		</div>
+		</NavigableRegion>
 	);
 }