From 08f92116f907ae69983931a3285d24ed567f2dd1 Mon Sep 17 00:00:00 2001
From: Amaresh S M <30730124+amareshsm@users.noreply.github.com>
Date: Mon, 10 Feb 2025 00:10:01 +0530
Subject: [PATCH 1/2] docs: Fix Keyboard Navigation for Search Results
---
docs/src/assets/js/search.js | 37 +++++++++++++++++++-----------------
1 file changed, 20 insertions(+), 17 deletions(-)
diff --git a/docs/src/assets/js/search.js b/docs/src/assets/js/search.js
index 3fc6e65578cf..4e601763cafd 100644
--- a/docs/src/assets/js/search.js
+++ b/docs/src/assets/js/search.js
@@ -199,7 +199,6 @@ if (searchInput)
}
searchQuery = query
-
});
@@ -218,17 +217,15 @@ if (poweredByLink) {
}
document.addEventListener('keydown', function (e) {
-
const searchResults = Array.from(document.querySelectorAll('.search-results__item'));
+ const isArrowKey = e.key === "ArrowUp" || e.key === "ArrowDown";
if (e.key === "Escape") {
e.preventDefault();
if (searchResults.length) {
clearSearchResults(true);
searchInput.focus();
- } else if (
- document.activeElement === searchInput
- ) {
+ } else if (document.activeElement === searchInput) {
clearNoResults();
searchInput.blur();
}
@@ -242,21 +239,27 @@ document.addEventListener('keydown', function (e) {
if (!searchResults.length) return;
- switch (e.key) {
- case "ArrowUp":
- e.preventDefault();
+ if (isArrowKey) {
+ e.preventDefault();
+
+ if (e.key === "ArrowUp") {
activeIndex = activeIndex - 1 < 0 ? searchResults.length - 1 : activeIndex - 1;
- break;
- case "ArrowDown":
- e.preventDefault();
+ } else if (e.key === "ArrowDown") {
activeIndex = activeIndex + 1 < searchResults.length ? activeIndex + 1 : 0;
- break;
+ }
+
+ if (activeIndex !== -1) {
+ const activeSearchResult = searchResults[activeIndex];
+ activeSearchResult.querySelector('a').focus();
+
+ if (isScrollable(resultsElement)) {
+ maintainScrollVisibility(activeSearchResult, resultsElement);
+ }
+ }
}
- if (activeIndex === -1) return;
- const activeSearchResult = searchResults[activeIndex];
- activeSearchResult.querySelector('a').focus();
- if (isScrollable(resultsElement)) {
- maintainScrollVisibility(activeSearchResult, resultsElement);
+ if (e.key === "Tab" && document.activeElement.classList.contains("search-results__item__title")) {
+ return;
}
});
+
From 66c71c8419900b7f573dd9c3b6a37e4a310c32a9 Mon Sep 17 00:00:00 2001
From: Amaresh S M <30730124+amareshsm@users.noreply.github.com>
Date: Mon, 10 Feb 2025 00:42:25 +0530
Subject: [PATCH 2/2] remove explicit tab key handling
---
docs/src/assets/js/search.js | 4 ----
1 file changed, 4 deletions(-)
diff --git a/docs/src/assets/js/search.js b/docs/src/assets/js/search.js
index 4e601763cafd..913eda1ab078 100644
--- a/docs/src/assets/js/search.js
+++ b/docs/src/assets/js/search.js
@@ -257,9 +257,5 @@ document.addEventListener('keydown', function (e) {
}
}
}
-
- if (e.key === "Tab" && document.activeElement.classList.contains("search-results__item__title")) {
- return;
- }
});
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy