From 3f74c33d45f1fc1b2b641dc2893045213e6a2225 Mon Sep 17 00:00:00 2001
From: Paul Jankowski <8bittitan@gmail.com>
Date: Wed, 5 Aug 2026 12:15:42 -0400
Subject: [PATCH] fix(v5): ignore slash shortcut on focused buttons (#2955)

Backport of #2871.\n\nOriginal commit: 0e41a78c44e9f731d825a75957e5668aeae30d69

Co-authored-by: Sigmabro <122412346+Sigmabrogz@users.noreply.github.com>
---
 .changeset/calm-buttons-listen.md                 |  6 ++++++
 .../src/__tests__/DocSearch.test.tsx              | 15 +++++++++++++++
 .../src/useDocSearchKeyboardEvents.ts             |  3 ++-
 .../src/__tests__/keyboardShortcuts.test.tsx      | 12 ++++++++++++
 .../src/useDocSearchKeyboardEvents.ts             |  3 ++-
 5 files changed, 37 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/calm-buttons-listen.md

diff --git a/.changeset/calm-buttons-listen.md b/.changeset/calm-buttons-listen.md
new file mode 100644
index 00000000..e3d44486
--- /dev/null
+++ b/.changeset/calm-buttons-listen.md
@@ -0,0 +1,6 @@
+---
+"@docsearch/core": patch
+"@docsearch/react": patch
+---
+
+Prevent the slash search shortcut from intercepting key events on focused buttons.
diff --git a/packages/docsearch-core/src/__tests__/DocSearch.test.tsx b/packages/docsearch-core/src/__tests__/DocSearch.test.tsx
index 9defab72..191b22b1 100644
--- a/packages/docsearch-core/src/__tests__/DocSearch.test.tsx
+++ b/packages/docsearch-core/src/__tests__/DocSearch.test.tsx
@@ -138,6 +138,21 @@ describe('@docsearch/core', () => {
       expect(screen.getByText('State: modal-search')).toBeInTheDocument();
     });
 
+    it('does not open search with / from a focused button', () => {
+      renderWithProvider(
+        <>
+          <StateRender />
+          <button type="button">Action</button>
+        </>
+      );
+
+      const button = screen.getByRole('button', { name: 'Action' });
+      button.focus();
+      fireEvent.keyDown(button, { key: '/', code: 'Slash' });
+
+      expect(screen.getByText('State: ready')).toBeInTheDocument();
+    });
+
     it('respects keyboard shortcuts', () => {
       renderWithProvider(<StateRender />, {
         keyboardShortcuts: {
diff --git a/packages/docsearch-core/src/useDocSearchKeyboardEvents.ts b/packages/docsearch-core/src/useDocSearchKeyboardEvents.ts
index 5bcd60f7..73ebf98c 100644
--- a/packages/docsearch-core/src/useDocSearchKeyboardEvents.ts
+++ b/packages/docsearch-core/src/useDocSearchKeyboardEvents.ts
@@ -34,7 +34,8 @@ function isEditingContent(event: KeyboardEvent): boolean {
     element.isContentEditable ||
     tagName === 'INPUT' ||
     tagName === 'SELECT' ||
-    tagName === 'TEXTAREA'
+    tagName === 'TEXTAREA' ||
+    tagName === 'BUTTON'
   );
 }
 
diff --git a/packages/docsearch-react/src/__tests__/keyboardShortcuts.test.tsx b/packages/docsearch-react/src/__tests__/keyboardShortcuts.test.tsx
index b446a3d7..d3b2f517 100644
--- a/packages/docsearch-react/src/__tests__/keyboardShortcuts.test.tsx
+++ b/packages/docsearch-react/src/__tests__/keyboardShortcuts.test.tsx
@@ -62,6 +62,18 @@ describe('keyboard shortcuts', () => {
 
       expect(document.querySelector('.DocSearch-Modal')).toBeInTheDocument();
     });
+
+    it('does not respond to / from the search button', () => {
+      render(<DocSearch />);
+
+      const button = screen.getByRole('button', { name: /Search/ });
+      button.focus();
+      fireEvent.keyDown(button, { key: '/', code: 'Slash' });
+
+      expect(
+        document.querySelector('.DocSearch-Modal')
+      ).not.toBeInTheDocument();
+    });
   });
 
   describe('custom keyboard shortcuts configuration', () => {
diff --git a/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts b/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts
index 0c052cc4..34cfe557 100644
--- a/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts
+++ b/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts
@@ -32,7 +32,8 @@ function isEditingContent(event: KeyboardEvent): boolean {
     element.isContentEditable ||
     tagName === 'INPUT' ||
     tagName === 'SELECT' ||
-    tagName === 'TEXTAREA'
+    tagName === 'TEXTAREA' ||
+    tagName === 'BUTTON'
   );
 }