From a397d3b72a1719aba882b64a55dbb38aa6305686 Mon Sep 17 00:00:00 2001
From: yogeshbhutkar <yogesh.bhutkar@rtcamp.com>
Date: Mon, 3 Feb 2025 14:18:03 +0530
Subject: [PATCH] a11y: return focus to parent button on reset

---
 .../components/global-styles/shadow-panel-components.js    | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/block-editor/src/components/global-styles/shadow-panel-components.js b/packages/block-editor/src/components/global-styles/shadow-panel-components.js
index 6891b4e9ef273..c335ef29384f4 100644
--- a/packages/block-editor/src/components/global-styles/shadow-panel-components.js
+++ b/packages/block-editor/src/components/global-styles/shadow-panel-components.js
@@ -13,7 +13,7 @@ import {
 	Composite,
 	Tooltip,
 } from '@wordpress/components';
-import { useMemo } from '@wordpress/element';
+import { useMemo, useRef } from '@wordpress/element';
 import { shadow as shadowIcon, Icon, check, reset } from '@wordpress/icons';
 
 /**
@@ -135,10 +135,13 @@ export function ShadowPopover( { shadow, onShadowChange, settings } ) {
 
 function renderShadowToggle( shadow, onShadowChange ) {
 	return ( { onToggle, isOpen } ) => {
+		const shadowButtonRef = useRef( undefined );
+
 		const toggleProps = {
 			onClick: onToggle,
 			className: clsx( { 'is-open': isOpen } ),
 			'aria-expanded': isOpen,
+			ref: shadowButtonRef,
 		};
 
 		const removeButtonProps = {
@@ -147,6 +150,8 @@ function renderShadowToggle( shadow, onShadowChange ) {
 					onToggle();
 				}
 				onShadowChange( undefined );
+				// Return focus to parent button.
+				shadowButtonRef.current?.focus();
 			},
 			className: clsx(
 				'block-editor-global-styles__shadow-editor__remove-button',