From ea8ba6807fee41f808a5adadd643ab31e9e05957 Mon Sep 17 00:00:00 2001
From: Alex Stine <alex.stine@yourtechadvisors.com>
Date: Thu, 9 Dec 2021 16:24:43 -0500
Subject: [PATCH 1/2] Site Editor: when Toggle navigation receives state false,
 focus the trigger for screen readers.

---
 .../navigation-sidebar/navigation-toggle/index.js     | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js b/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
index b1beba474add7b..7bec922ed11591 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { useSelect, useDispatch } from '@wordpress/data';
+import { useEffect, useRef } from '@wordpress/element';
 import {
 	Button,
 	Icon,
@@ -40,6 +41,15 @@ function NavigationToggle( { icon } ) {
 
 	const disableMotion = useReducedMotion();
 
+	const navigationToggleRef = useRef();
+
+	useEffect( () => {
+		// Focus the trigger button if close
+		if ( ! isNavigationOpen ) {
+			navigationToggleRef.current.focus();
+		}
+	}, [ isNavigationOpen ] );
+
 	const toggleNavigationPanel = () =>
 		setIsNavigationPanelOpened( ! isNavigationOpen );
 
@@ -79,6 +89,7 @@ function NavigationToggle( { icon } ) {
 			<Button
 				className="edit-site-navigation-toggle__button has-icon"
 				label={ __( 'Toggle navigation' ) }
+				ref={ navigationToggleRef }
 				onClick={ toggleNavigationPanel }
 				showTooltip
 			>

From 26ae22fde7644b8f766a0f35606ec552432fa116 Mon Sep 17 00:00:00 2001
From: Alex Stine <alex.stine@yourtechadvisors.com>
Date: Thu, 16 Dec 2021 09:56:56 -0500
Subject: [PATCH 2/2] Add comment that points to a future PR

Co-authored-by: George Mamadashvili <georgemamadashvili@gmail.com>
---
 .../components/navigation-sidebar/navigation-toggle/index.js   | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js b/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
index 39c277bad899a9..63401f3564814f 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-toggle/index.js
@@ -44,7 +44,8 @@ function NavigationToggle( { icon } ) {
 	const navigationToggleRef = useRef();
 
 	useEffect( () => {
-		// Focus the trigger button if close
+		// TODO: Remove this effect when alternative solution is merged.
+		// See: https://github.com/WordPress/gutenberg/pull/37314
 		if ( ! isNavigationOpen ) {
 			navigationToggleRef.current.focus();
 		}