From 00fd43f51c50bbd8066e315cd8eaf1c7536aeedc Mon Sep 17 00:00:00 2001
From: Atris <vacekj@outlook.com>
Date: Mon, 25 Nov 2024 17:34:28 +0100
Subject: [PATCH] feat: don't show outline unless focused by keyboard

---
 .changeset/dull-dolphins-sell.md | 5 +++++
 packages/ui/src/Tabs/index.tsx   | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/dull-dolphins-sell.md

diff --git a/.changeset/dull-dolphins-sell.md b/.changeset/dull-dolphins-sell.md
new file mode 100644
index 000000000..05cf3fda1
--- /dev/null
+++ b/.changeset/dull-dolphins-sell.md
@@ -0,0 +1,5 @@
+---
+'@penumbra-zone/ui': minor
+---
+
+Only display tab outline when focused via keyboard, not otherwise.
diff --git a/packages/ui/src/Tabs/index.tsx b/packages/ui/src/Tabs/index.tsx
index 82058b73c..a5be2f647 100644
--- a/packages/ui/src/Tabs/index.tsx
+++ b/packages/ui/src/Tabs/index.tsx
@@ -101,7 +101,7 @@ export const Tabs = ({ value, onChange, options, actionType = 'default' }: TabsP
                   value === option.value ? 'text-text-primary' : 'text-text-secondary',
                   getDensityItemClasses(density),
                   getFocusOutlineColorByActionType(actionType),
-                  'focus:outline focus:outline-2',
+                  'focus-visible:outline focus-visible:outline-2',
                   'hover:bg-action-hoverOverlay',
                 )}
               >