From 2894d79eda131ec08068e1710edf68c987c8e9ae Mon Sep 17 00:00:00 2001
From: Daniel Richards <daniel.richards@automattic.com>
Date: Wed, 1 May 2024 13:20:11 +0800
Subject: [PATCH] Add focus styles

---
 packages/block-library/src/social-link/editor.scss | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/packages/block-library/src/social-link/editor.scss b/packages/block-library/src/social-link/editor.scss
index b8350ba39970e9..73211958b48c15 100644
--- a/packages/block-library/src/social-link/editor.scss
+++ b/packages/block-library/src/social-link/editor.scss
@@ -20,6 +20,15 @@
 
 	// This rule is duplicated from the style.scss and needs to be the same as there.
 	padding: 0.25em;
+
+	// Focus styles replicate the `@wordpress/components` button component.
+	&:focus:not(:disabled) {
+		border-radius: 2px;
+		box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+
+		// Windows High Contrast mode will show this outline, but not the box-shadow.
+		outline: 3px solid transparent;
+	}
 }
 
 .wp-block-social-links.is-style-pill-shape .wp-social-link button {