extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2025-01-18 03:48:33 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: enhance keyboard navigation for language selection in GenerateCodeItem

Browse Source
This commit is contained in:
Pragadesh-45 2024-12-03 17:59:48 +05:30
parent ca6c2ebb03
commit 5b6172e5ac
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/index.js
View File

@ -63,9 +63,20 @@ const GenerateCodeItem = ({ collection, item, onClose }) => {
tabIndex={0} tabIndex={0}
onClick={() => setSelectedLanguage(language)} onClick={() => setSelectedLanguage(language)}
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === 'Enter' || e.key === ' ') { if (e.key === 'Tab') {
setSelectedLanguage(language);
e.preventDefault(); e.preventDefault();
const currentIndex = languages.findIndex((lang) => lang.name === selectedLanguage.name);
const nextIndex = e.shiftKey
? (currentIndex - 1 + languages.length) % languages.length
: (currentIndex + 1) % languages.length;
setSelectedLanguage(languages[nextIndex]);
}
if (e.shiftKey && e.key === 'Tab') {
e.preventDefault();
const currentIndex = languages.findIndex((lang) => lang.name === selectedLanguage.name);
const nextIndex = (currentIndex - 1 + languages.length) % languages.length;
setSelectedLanguage(languages[nextIndex]);
} }
}} }}
aria-pressed={language.name === selectedLanguage.name} aria-pressed={language.name === selectedLanguage.name}