From 43d01bec4c2cb496aece9746ad4e83cd2273fa22 Mon Sep 17 00:00:00 2001
From: Victoria League <vleague@bitwarden.com>
Date: Mon, 10 Jun 2024 10:21:33 -0400
Subject: [PATCH] [CL-286] Update badge to use focus-visible instead of focus
 (#9551)

---
 libs/components/src/badge/badge.directive.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/libs/components/src/badge/badge.directive.ts b/libs/components/src/badge/badge.directive.ts
index acce4a18aad..abbcd3b695b 100644
--- a/libs/components/src/badge/badge.directive.ts
+++ b/libs/components/src/badge/badge.directive.ts
@@ -42,10 +42,10 @@ export class BadgeDirective implements FocusableElement {
       "tw-whitespace-nowrap",
       "tw-text-xs",
       "hover:tw-no-underline",
-      "focus:tw-outline-none",
-      "focus:tw-ring",
-      "focus:tw-ring-offset-2",
-      "focus:tw-ring-primary-700",
+      "focus-visible:tw-outline-none",
+      "focus-visible:tw-ring",
+      "focus-visible:tw-ring-offset-2",
+      "focus-visible:tw-ring-primary-700",
     ]
       .concat(styles[this.variant])
       .concat(this.hasHoverEffects ? hoverStyles[this.variant] : [])