inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-4257] - Resolved a11y issue around jumping focus (#8168)

Browse Source 
* ACS-4257 - Clicking on filter buttons on search results no longer switches focus from button to first element

* [ACS-4257] Added key listeners to open and close the menus to improve keyboard only usability

* ACS-4257 - Clicking on filter buttons on search results no longer switches focus from button to first element

* [ACS-4257] Added key listeners to open and close the menus to improve keyboard only usability

---------

Co-authored-by: suneet-gupta <suneet.gupta@hyland.com>
This commit is contained in:
swapnil-verma-gl
2023-02-14 22:01:12 +05:30
committed by GitHub
parent a1ec61f857
commit 275d30b043
4 changed files with 24 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip/search-facet-chip.component.html
View File

@@ -6,6 +6,7 @@
[matMenuTriggerFor]="menu"
(onMenuOpen)="onMenuOpen()"
(keydown.enter)="onEnterKeydown()"
(keydown.escape)="onEscKeydown()"
[attr.title]="facetField.displayValue$ | async"
#menuTrigger="matMenuTrigger">

13
lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip/search-facet-chip.component.ts
View File

@@ -46,7 +46,6 @@ export class SearchFacetChipComponent {
onMenuOpen() {
if (this.menuContainer && !this.focusTrap) {
this.focusTrap = this.focusTrapFactory.create(this.menuContainer.nativeElement);
this.focusTrap.focusInitialElement();
}
}
@@ -66,6 +65,16 @@ export class SearchFacetChipComponent {
}
onEnterKeydown(): void {
this.menuTrigger.openMenu();
if (!this.menuTrigger.menuOpen) {
this.menuTrigger.openMenu();
} else {
this.menuTrigger.closeMenu();
}
}
onEscKeydown() {
if (this.menuTrigger.menuOpen) {
this.menuTrigger.closeMenu();
}
}
}

1
lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.html
View File

@@ -6,6 +6,7 @@
[matMenuTriggerFor]="menu"
(onMenuOpen)="onMenuOpen()"
(keydown.enter)="onEnterKeydown()"
(keydown.escape)="onEscKeydown()"
[attr.title]="widget.getDisplayValue() | async"
#menuTrigger="matMenuTrigger">
<span class="adf-search-filter-placeholder">

13
lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.ts
View File

@@ -47,7 +47,6 @@ export class SearchWidgetChipComponent {
onMenuOpen() {
if (this.menuContainer && !this.focusTrap) {
this.focusTrap = this.focusTrapFactory.create(this.menuContainer.nativeElement);
this.focusTrap.focusInitialElement();
}
}
@@ -67,6 +66,16 @@ export class SearchWidgetChipComponent {
}
onEnterKeydown(): void {
this.menuTrigger.openMenu();
if (!this.menuTrigger.menuOpen) {
this.menuTrigger.openMenu();
} else {
this.menuTrigger.closeMenu();
}
}
onEscKeydown() {
if (this.menuTrigger.menuOpen) {
this.menuTrigger.closeMenu();
}
}
}