hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

116404: Apply focus on first item

Browse Source 
(cherry picked from commit 2152bab717)
This commit is contained in:
Alexandre Vryghem
2024-07-05 16:02:42 +02:00
parent 53186988f5
commit 73285284ce
2 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.ts
View File

@@ -83,10 +83,13 @@ export class ExpandableNavbarSectionComponent extends NavbarSectionComponent imp
ngAfterViewChecked(): void { ngAfterViewChecked(): void {
if (this.addArrowEventListeners) { if (this.addArrowEventListeners) {
const dropdownItems = document.querySelectorAll(`#${this.expandableNavbarSectionId()} *[role="menuitem"]`); const dropdownItems: NodeListOf<HTMLElement> = document.querySelectorAll(`#${this.expandableNavbarSectionId()} *[role="menuitem"]`);
dropdownItems.forEach(item => { dropdownItems.forEach((item: HTMLElement) => {
item.addEventListener('keydown', this.navigateDropdown.bind(this)); item.addEventListener('keydown', this.navigateDropdown.bind(this));
}); });
if (dropdownItems.length > 0) {
dropdownItems.item(0).focus();
}
this.addArrowEventListeners = false; this.addArrowEventListeners = false;
} }
} }
@@ -166,7 +169,7 @@ export class ExpandableNavbarSectionComponent extends NavbarSectionComponent imp
this.deactivateSection(event, false); this.deactivateSection(event, false);
break; break;
case 'ArrowDown': case 'ArrowDown':
this.navigateDropdown(event); this.activateSection(event);
break; break;
case 'Space': case 'Space':
event.preventDefault(); event.preventDefault();

7
src/app/shared/menu/menu-section/menu-section.component.ts
View File

@@ -75,9 +75,12 @@ export class MenuSectionComponent implements OnInit, OnDestroy {
/** /**
* Activate this section * Activate this section
* @param {Event} event The user event that triggered this method * @param {Event} event The user event that triggered this method
* @param skipEvent Weather the event should still be triggered after deactivating the section or not
*/ */
activateSection(event: Event) { activateSection(event: Event, skipEvent = true): void {
event.preventDefault(); if (skipEvent) {
event.preventDefault();
}
if (!this.section.model?.disabled) { if (!this.section.model?.disabled) {
this.menuService.activateSection(this.menuID, this.section.id); this.menuService.activateSection(this.menuID, this.section.id);
} }