bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-17 00:33:44 +00:00
Code Issues Releases Wiki Activity

[SM-43] create product-switcher (#4189)

Browse Source 
* rebase to master

* use bit-menu in product switcher; add focusStrategy to bit-menu

* recommit locales after rebase

* add light style to iconButton, use in product-switcher

* move out of component library

* add buttonType input

* gate behind sm flag

* update aria-label

* add role input to bit-menu

* style changes

* simplify partition logic

* split into two components for Storybook

* update focus styles; update grid sizing to relative

* fix underline on hover

* update attribute binding

* move to layouts dir

* add bitLink; update grid gap

* reorder loose components

* move orgs mock

* move a11y module

* fix aria role bug; add aria label to menu

* update colors

* update ring color

* simplify colors

* remove duplicate link module
This commit is contained in:
Will Martin
2022-12-21 16:50:41 -05:00
committed by GitHub
parent 7d3063942e
commit eeb407b8a4
22 changed files with 387 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
libs/components/src/menu/menu-trigger-for.directive.ts
View File

@@ -19,7 +19,9 @@ import { MenuComponent } from "./menu.component";
})
export class MenuTriggerForDirective implements OnDestroy {
@HostBinding("attr.aria-expanded") isOpen = false;
@HostBinding("attr.aria-haspopup") hasPopup = "menu";
@HostBinding("attr.aria-haspopup") get hasPopup(): "menu" | "dialog" {
return this.menu?.ariaRole || "menu";
}
@HostBinding("attr.role") role = "button";
@Input("bitMenuTriggerFor") menu: MenuComponent;
@@ -86,9 +88,11 @@ export class MenuTriggerForDirective implements OnDestroy {
}
this.destroyMenu();
});
this.keyDownEventsSub = this.overlayRef
.keydownEvents()
.subscribe((event: KeyboardEvent) => this.menu.keyManager.onKeydown(event));
this.keyDownEventsSub =
this.menu.keyManager &&
this.overlayRef
.keydownEvents()
.subscribe((event: KeyboardEvent) => this.menu.keyManager.onKeydown(event));
}
private destroyMenu() {
@@ -102,9 +106,12 @@ export class MenuTriggerForDirective implements OnDestroy {
private getClosedEvents(): Observable<any> {
const detachments = this.overlayRef.detachments();
const escKey = this.overlayRef
.keydownEvents()
.pipe(filter((event: KeyboardEvent) => event.key === "Escape" || event.key === "Tab"));
const escKey = this.overlayRef.keydownEvents().pipe(
filter((event: KeyboardEvent) => {
const keys = this.menu.ariaRole === "menu" ? ["Escape", "Tab"] : ["Escape"];
return keys.includes(event.key);
})
);
const backdrop = this.overlayRef.backdropClick();
const menuClosed = this.menu.closed;